m3e

Package Version Hex Docs

Version 2.3.10 of this software is aligned with v2.7.9 of M3E.

• adjust/correct the way that TypeScript ARRAY fields are handled

• generator now supports TypeScript Array types and defaults
• compatibility with the Gestures APIs in M3E 2.7.9

• compatibility with numerous fixes in the M3E library

• substantial changes to move from M3E 2.5.13 up to 2.7.3

• gleam.toml correctly updated

• MonthView: new field "active"
• MultiYearView: new field "active"
• YearView: new field "active"

• Theme now has a ThemeVariant
• added ThemeIcon

• no API changes

• no API changes

• no API changes

• Tabs: disable_pagination changed from boolean to string

• DatePicker: add range - Whether a range of dates can be selected

• Collapsible: updated with the new attributes orientation and no_animate

m3e is a set of Gleam/Lustre wrappers for M3E — Material 3 Expressive components

m3e provides Gleam functions for all of the M3E components

Each M3E component is represented by a Gleam type, has

• a constructor function new(...)
• a render() function which creates a Lustre Element from the Gleam type
• setter functions which return a new record with one of the fields of the input record updated. As such, these functions are designed to be used in the Builder Pattern with Gleam's pipe operator
• where there are 2 or more fields in the opaque record of each component (and hence 2 or more setter functions), support is provided for the Config Record pattern, i.e. a Config type, and default_config(), from_config(), and render_config() functions

 import m3e/button
 let b = button.new()
 |> button.size(button_size.ExtraSmall)
 |> button.variant(button_variant.Tonal)
 |> button.render([], [element.text("Extra Small")]),

 import lustre/element
 import m3e/card
 card.render_config(
 card.Config(..card.default_config(), variant: card_variant.Outlined),
 [],
 [html.div([card.slot(card.Content)], [element.text("This is a card")])],
 )

Version 1.* of this software was hand-written. Version 2.* is machine generated from a Custom Element Manifest supplied with each new release of Material 3 Expressive. As such, the Gleam API more closely follows the Manifest (and hence the documented M3E components) than did version 1.*

https://hexdocs.pm/m3e

gleam add m3e@2

The examples/ folder contains a showcase application which will eventually replicate each of the M3E demonstration cases in the Gleam/Lustre context.