@m3e/web 2.1.2 → 2.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -0
- package/dist/all.js +2783 -354
- package/dist/all.js.map +1 -1
- package/dist/all.min.js +77 -41
- package/dist/all.min.js.map +1 -1
- package/dist/app-bar.js +14 -7
- package/dist/app-bar.js.map +1 -1
- package/dist/app-bar.min.js +1 -1
- package/dist/app-bar.min.js.map +1 -1
- package/dist/autocomplete.js +24 -26
- package/dist/autocomplete.js.map +1 -1
- package/dist/autocomplete.min.js +1 -1
- package/dist/autocomplete.min.js.map +1 -1
- package/dist/bottom-sheet.js +8 -27
- package/dist/bottom-sheet.js.map +1 -1
- package/dist/bottom-sheet.min.js +1 -1
- package/dist/bottom-sheet.min.js.map +1 -1
- package/dist/calendar.js +1082 -0
- package/dist/calendar.js.map +1 -0
- package/dist/calendar.min.js +43 -0
- package/dist/calendar.min.js.map +1 -0
- package/dist/card.js +4 -2
- package/dist/card.js.map +1 -1
- package/dist/card.min.js +1 -1
- package/dist/card.min.js.map +1 -1
- package/dist/chips.js +2 -6
- package/dist/chips.js.map +1 -1
- package/dist/chips.min.js +1 -1
- package/dist/chips.min.js.map +1 -1
- package/dist/core-a11y.js +23 -9
- package/dist/core-a11y.js.map +1 -1
- package/dist/core-a11y.min.js +4 -4
- package/dist/core-a11y.min.js.map +1 -1
- package/dist/core-anchoring.js +135 -15
- package/dist/core-anchoring.js.map +1 -1
- package/dist/core-anchoring.min.js +1 -1
- package/dist/core-anchoring.min.js.map +1 -1
- package/dist/core.js +101 -1
- package/dist/core.js.map +1 -1
- package/dist/core.min.js +1 -1
- package/dist/core.min.js.map +1 -1
- package/dist/css-custom-data.json +962 -462
- package/dist/custom-elements.json +16838 -12546
- package/dist/datepicker.js +552 -0
- package/dist/datepicker.js.map +1 -0
- package/dist/datepicker.min.js +7 -0
- package/dist/datepicker.min.js.map +1 -0
- package/dist/fab-menu.js +1 -1
- package/dist/fab-menu.js.map +1 -1
- package/dist/fab-menu.min.js +1 -1
- package/dist/fab-menu.min.js.map +1 -1
- package/dist/form-field.js +2 -6
- package/dist/form-field.js.map +1 -1
- package/dist/form-field.min.js +3 -3
- package/dist/form-field.min.js.map +1 -1
- package/dist/html-custom-data.json +546 -180
- package/dist/menu.js +3 -7
- package/dist/menu.js.map +1 -1
- package/dist/menu.min.js +1 -1
- package/dist/menu.min.js.map +1 -1
- package/dist/nav-menu.js +3 -11
- package/dist/nav-menu.js.map +1 -1
- package/dist/nav-menu.min.js +1 -1
- package/dist/nav-menu.min.js.map +1 -1
- package/dist/nav-rail.js +2 -6
- package/dist/nav-rail.js.map +1 -1
- package/dist/nav-rail.min.js +1 -1
- package/dist/nav-rail.min.js.map +1 -1
- package/dist/option.js +5 -6
- package/dist/option.js.map +1 -1
- package/dist/option.min.js +1 -1
- package/dist/option.min.js.map +1 -1
- package/dist/paginator.js +2 -2
- package/dist/paginator.js.map +1 -1
- package/dist/paginator.min.js +1 -1
- package/dist/paginator.min.js.map +1 -1
- package/dist/search.js +805 -0
- package/dist/search.js.map +1 -0
- package/dist/search.min.js +7 -0
- package/dist/search.min.js.map +1 -0
- package/dist/select.js +5 -16
- package/dist/select.js.map +1 -1
- package/dist/select.min.js +1 -1
- package/dist/select.min.js.map +1 -1
- package/dist/snackbar.js +2 -6
- package/dist/snackbar.js.map +1 -1
- package/dist/snackbar.min.js +1 -1
- package/dist/snackbar.min.js.map +1 -1
- package/dist/src/all.d.ts +3 -0
- package/dist/src/all.d.ts.map +1 -1
- package/dist/src/app-bar/AppBarElement.d.ts +6 -4
- package/dist/src/app-bar/AppBarElement.d.ts.map +1 -1
- package/dist/src/autocomplete/AutocompleteElement.d.ts +2 -2
- package/dist/src/autocomplete/AutocompleteElement.d.ts.map +1 -1
- package/dist/src/autocomplete/AutocompleteQueryEventDetail.d.ts +12 -0
- package/dist/src/autocomplete/AutocompleteQueryEventDetail.d.ts.map +1 -0
- package/dist/src/autocomplete/QueryEventDetail.d.ts +3 -8
- package/dist/src/autocomplete/QueryEventDetail.d.ts.map +1 -1
- package/dist/src/autocomplete/index.d.ts +1 -0
- package/dist/src/autocomplete/index.d.ts.map +1 -1
- package/dist/src/bottom-sheet/BottomSheetElement.d.ts.map +1 -1
- package/dist/src/calendar/CalendarElement.d.ts +213 -0
- package/dist/src/calendar/CalendarElement.d.ts.map +1 -0
- package/dist/src/calendar/CalendarView.d.ts +3 -0
- package/dist/src/calendar/CalendarView.d.ts.map +1 -0
- package/dist/src/calendar/CalendarViewElementBase.d.ts +28 -0
- package/dist/src/calendar/CalendarViewElementBase.d.ts.map +1 -0
- package/dist/src/calendar/MonthViewElement.d.ts +36 -0
- package/dist/src/calendar/MonthViewElement.d.ts.map +1 -0
- package/dist/src/calendar/MultiYearViewElement.d.ts +27 -0
- package/dist/src/calendar/MultiYearViewElement.d.ts.map +1 -0
- package/dist/src/calendar/YearViewElement.d.ts +27 -0
- package/dist/src/calendar/YearViewElement.d.ts.map +1 -0
- package/dist/src/calendar/index.d.ts +7 -0
- package/dist/src/calendar/index.d.ts.map +1 -0
- package/dist/src/calendar/utils.d.ts +24 -0
- package/dist/src/calendar/utils.d.ts.map +1 -0
- package/dist/src/card/CardElement.d.ts.map +1 -1
- package/dist/src/chips/InputChipSetElement.d.ts.map +1 -1
- package/dist/src/core/a11y/FocusTrapElement.d.ts.map +1 -1
- package/dist/src/core/a11y/InteractivityChecker.d.ts.map +1 -1
- package/dist/src/core/anchoring/AnchorOptions.d.ts +1 -1
- package/dist/src/core/anchoring/AnchorOptions.d.ts.map +1 -1
- package/dist/src/core/anchoring/FloatingPanelElement.d.ts +18 -3
- package/dist/src/core/anchoring/FloatingPanelElement.d.ts.map +1 -1
- package/dist/src/core/anchoring/positionAnchor.d.ts.map +1 -1
- package/dist/src/core/shared/controllers/InertController.d.ts +19 -0
- package/dist/src/core/shared/controllers/InertController.d.ts.map +1 -0
- package/dist/src/core/shared/controllers/index.d.ts +1 -0
- package/dist/src/core/shared/controllers/index.d.ts.map +1 -1
- package/dist/src/core/shared/converters/dateConverter.d.ts +4 -0
- package/dist/src/core/shared/converters/dateConverter.d.ts.map +1 -0
- package/dist/src/core/shared/converters/index.d.ts +1 -0
- package/dist/src/core/shared/converters/index.d.ts.map +1 -1
- package/dist/src/core/shared/utils/index.d.ts +1 -0
- package/dist/src/core/shared/utils/index.d.ts.map +1 -1
- package/dist/src/core/shared/utils/registerStyleSheet.d.ts +7 -0
- package/dist/src/core/shared/utils/registerStyleSheet.d.ts.map +1 -0
- package/dist/src/datepicker/DatepickerElement.d.ts +237 -0
- package/dist/src/datepicker/DatepickerElement.d.ts.map +1 -0
- package/dist/src/datepicker/DatepickerToggleElement.d.ts +21 -0
- package/dist/src/datepicker/DatepickerToggleElement.d.ts.map +1 -0
- package/dist/src/datepicker/DatepickerVariant.d.ts +3 -0
- package/dist/src/datepicker/DatepickerVariant.d.ts.map +1 -0
- package/dist/src/datepicker/index.d.ts +4 -0
- package/dist/src/datepicker/index.d.ts.map +1 -0
- package/dist/src/form-field/FormFieldElement.d.ts.map +1 -1
- package/dist/src/menu/MenuElement.d.ts.map +1 -1
- package/dist/src/nav-menu/NavMenuElement.d.ts.map +1 -1
- package/dist/src/nav-menu/NavMenuItemElement.d.ts.map +1 -1
- package/dist/src/nav-rail/NavRailElement.d.ts.map +1 -1
- package/dist/src/option/OptionElement.d.ts.map +1 -1
- package/dist/src/option/OptionPanelElement.d.ts.map +1 -1
- package/dist/src/paginator/PageEventDetail.d.ts +6 -11
- package/dist/src/paginator/PageEventDetail.d.ts.map +1 -1
- package/dist/src/paginator/PaginatorElement.d.ts +3 -3
- package/dist/src/paginator/PaginatorElement.d.ts.map +1 -1
- package/dist/src/paginator/PaginatorPageEventDetail.d.ts +12 -0
- package/dist/src/paginator/PaginatorPageEventDetail.d.ts.map +1 -0
- package/dist/src/paginator/index.d.ts +1 -0
- package/dist/src/paginator/index.d.ts.map +1 -1
- package/dist/src/search/SearchBarElement.d.ts +92 -0
- package/dist/src/search/SearchBarElement.d.ts.map +1 -0
- package/dist/src/search/SearchViewElement.d.ts +146 -0
- package/dist/src/search/SearchViewElement.d.ts.map +1 -0
- package/dist/src/search/SearchViewMode.d.ts +3 -0
- package/dist/src/search/SearchViewMode.d.ts.map +1 -0
- package/dist/src/search/SearchViewQueryEventDetail.d.ts +12 -0
- package/dist/src/search/SearchViewQueryEventDetail.d.ts.map +1 -0
- package/dist/src/search/index.d.ts +5 -0
- package/dist/src/search/index.d.ts.map +1 -0
- package/dist/src/search/styles/SearchBarStyle.d.ts +12 -0
- package/dist/src/search/styles/SearchBarStyle.d.ts.map +1 -0
- package/dist/src/search/styles/SearchBarToken.d.ts +27 -0
- package/dist/src/search/styles/SearchBarToken.d.ts.map +1 -0
- package/dist/src/search/styles/SearchViewStyle.d.ts +12 -0
- package/dist/src/search/styles/SearchViewStyle.d.ts.map +1 -0
- package/dist/src/search/styles/SearchViewToken.d.ts +26 -0
- package/dist/src/search/styles/SearchViewToken.d.ts.map +1 -0
- package/dist/src/search/styles/index.d.ts +3 -0
- package/dist/src/search/styles/index.d.ts.map +1 -0
- package/dist/src/select/SelectElement.d.ts.map +1 -1
- package/dist/src/snackbar/SnackbarElement.d.ts.map +1 -1
- package/dist/src/stepper/StepperElement.d.ts.map +1 -1
- package/dist/stepper.js +2 -6
- package/dist/stepper.js.map +1 -1
- package/dist/stepper.min.js +1 -1
- package/dist/stepper.min.js.map +1 -1
- package/dist/tooltip.js +1 -1
- package/dist/tooltip.js.map +1 -1
- package/dist/tooltip.min.js +1 -1
- package/dist/tooltip.min.js.map +1 -1
- package/package.json +16 -1
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
"tags": [
|
|
5
5
|
{
|
|
6
6
|
"name": "m3e-app-bar",
|
|
7
|
-
"description": "A bar, placed a the top of a screen, used to help users navigate through an application.\n---\n\n\n### **Methods:**\n - **attach(control: _HTMLElement_): _void_** - Attaches the element to an interactive control.\n- **detach(): _void_** - Detaches the element from its current interactive control.\n\n### **Slots:**\n - **leading
|
|
7
|
+
"description": "A bar, placed a the top of a screen, used to help users navigate through an application.\n---\n\n\n### **Methods:**\n - **attach(control: _HTMLElement_): _void_** - Attaches the element to an interactive control.\n- **detach(): _void_** - Detaches the element from its current interactive control.\n\n### **Slots:**\n - **leading** - Renders content positioned at the start of the bar.\n- **subtitle** - Renders the subtitle of the bar.\n- **title** - Renders the title of the bar.\n- **trailing** - Renders one or more action buttons aligned to the end of the bar.\n- **leading-icon** - Deprecated: use the `leading` slot.\n- **trailing-icon** - Deprecated: use the `trailing` slot.\n\n### **CSS Properties:**\n - **--m3e-app-bar-container-color** - Background color of the app bar container. _(default: undefined)_\n- **--m3e-app-bar-container-color-on-scroll** - Background color of the app bar container when scrolled. _(default: undefined)_\n- **--m3e-app-bar-container-elevation** - Elevation (shadow) of the app bar container. _(default: undefined)_\n- **--m3e-app-bar-container-elevation-on-scroll** - Elevation (shadow) of the app bar container when scrolled. _(default: undefined)_\n- **--m3e-app-bar-title-text-color** - Color of the app bar title text. _(default: undefined)_\n- **--m3e-app-bar-subtitle-text-color** - Color of the app bar subtitle text. _(default: undefined)_\n- **--m3e-app-bar-padding-left** - Left padding for the app bar container. _(default: undefined)_\n- **--m3e-app-bar-padding-right** - Right padding for the app bar container. _(default: undefined)_\n- **--m3e-app-bar-small-container-height** - Height of the small app bar container. _(default: undefined)_\n- **--m3e-app-bar-small-title-text-font-size** - Font size for the small app bar title text. _(default: undefined)_\n- **--m3e-app-bar-small-title-text-font-weight** - Font weight for the small app bar title text. _(default: undefined)_\n- **--m3e-app-bar-small-title-text-line-height** - Line height for the small app bar title text. _(default: undefined)_\n- **--m3e-app-bar-small-subtitle-text-tracking** - Letter spacing (tracking) for the small app bar title text. _(default: undefined)_\n- **--m3e-app-bar-small-subtitle-text-font-size** - Font size for the small app bar subtitle text. _(default: undefined)_\n- **--m3e-app-bar-small-subtitle-text-font-weight** - Font weight for the small app bar subtitle text. _(default: undefined)_\n- **--m3e-app-bar-small-subtitle-text-line-height** - Line height for the small app bar subtitle text. _(default: undefined)_\n- **--m3e-app-bar-small-subtitle-text-tracking** - Letter spacing (tracking) for the small app bar subtitle text. _(default: undefined)_\n- **--m3e-app-bar-small-heading-padding-left** - Left padding for the small app bar heading. _(default: undefined)_\n- **--m3e-app-bar-small-heading-padding-right** - Right padding for the small app bar heading. _(default: undefined)_\n- **--m3e-app-bar-medium-container-height** - Height of the medium app bar container. _(default: undefined)_\n- **--m3e-app-bar-medium-container-height-with-subtitle** - Height of the medium app bar container with subtitle. _(default: undefined)_\n- **--m3e-app-bar-medium-title-text-font-size** - Font size for the medium app bar title text. _(default: undefined)_\n- **--m3e-app-bar-medium-title-text-font-weight** - Font weight for the medium app bar title text. _(default: undefined)_\n- **--m3e-app-bar-medium-title-text-line-height** - Line height for the medium app bar title text. _(default: undefined)_\n- **--m3e-app-bar-medium-subtitle-text-tracking** - Letter spacing (tracking) for the medium app bar title text. _(default: undefined)_\n- **--m3e-app-bar-medium-subtitle-text-font-size** - Font size for the medium app bar subtitle text. _(default: undefined)_\n- **--m3e-app-bar-medium-subtitle-text-font-weight** - Font weight for the medium app bar subtitle text. _(default: undefined)_\n- **--m3e-app-bar-medium-subtitle-text-line-height** - Line height for the medium app bar subtitle text. _(default: undefined)_\n- **--m3e-app-bar-medium-subtitle-text-tracking** - Letter spacing (tracking) for the medium app bar subtitle text. _(default: undefined)_\n- **--m3e-app-bar-medium-heading-padding-left** - Left padding for the medium app bar heading. _(default: undefined)_\n- **--m3e-app-bar-medium-heading-padding-right** - Right padding for the medium app bar heading. _(default: undefined)_\n- **--m3e-app-bar-medium-padding-top** - Top padding for the medium app bar. _(default: undefined)_\n- **--m3e-app-bar-medium-padding-bottom** - Bottom padding for the medium app bar. _(default: undefined)_\n- **--m3e-app-bar-medium-title-max-lines** - Maximum number of lines for the medium app bar title. _(default: undefined)_\n- **--m3e-app-bar-medium-subtitle-max-lines** - Maximum number of lines for the medium app bar subtitle. _(default: undefined)_\n- **--m3e-app-bar-large-container-height** - Height of the large app bar container. _(default: undefined)_\n- **--m3e-app-bar-large-container-height-with-subtitle** - Height of the large app bar container with subtitle. _(default: undefined)_\n- **--m3e-app-bar-large-title-text-font-size** - Font size for the large app bar title text. _(default: undefined)_\n- **--m3e-app-bar-large-title-text-font-weight** - Font weight for the large app bar title text. _(default: undefined)_\n- **--m3e-app-bar-large-title-text-line-height** - Line height for the large app bar title text. _(default: undefined)_\n- **--m3e-app-bar-large-subtitle-text-tracking** - Letter spacing (tracking) for the large app bar title text. _(default: undefined)_\n- **--m3e-app-bar-large-subtitle-text-font-size** - Font size for the large app bar subtitle text. _(default: undefined)_\n- **--m3e-app-bar-large-subtitle-text-font-weight** - Font weight for the large app bar subtitle text. _(default: undefined)_\n- **--m3e-app-bar-large-subtitle-text-line-height** - Line height for the large app bar subtitle text. _(default: undefined)_\n- **--m3e-app-bar-large-subtitle-text-tracking** - Letter spacing (tracking) for the large app bar subtitle text. _(default: undefined)_\n- **--m3e-app-bar-large-heading-padding-left** - Left padding for the large app bar heading. _(default: undefined)_\n- **--m3e-app-bar-large-heading-padding-right** - Right padding for the large app bar heading. _(default: undefined)_\n- **--m3e-app-bar-large-padding-top** - Top padding for the large app bar. _(default: undefined)_\n- **--m3e-app-bar-large-padding-bottom** - Bottom padding for the large app bar. _(default: undefined)_\n- **--m3e-app-bar-large-title-max-lines** - Maximum number of lines for the large app bar title. _(default: undefined)_\n- **--m3e-app-bar-large-subtitle-max-lines** - Maximum number of lines for the large app bar subtitle. _(default: undefined)_",
|
|
8
8
|
"attributes": [
|
|
9
9
|
{
|
|
10
10
|
"name": "centered",
|
|
@@ -99,28 +99,6 @@
|
|
|
99
99
|
],
|
|
100
100
|
"references": []
|
|
101
101
|
},
|
|
102
|
-
{
|
|
103
|
-
"name": "m3e-badge",
|
|
104
|
-
"description": "A visual indicator used to label content.\n---\n\n\n### **Methods:**\n - **attach(control: _HTMLElement_): _void_** - Attaches the element to an interactive control.\n- **detach(): _void_** - Detaches the element from its current interactive control.\n\n### **Slots:**\n - _default_ - Renders the content of the badge.\n\n### **CSS Properties:**\n - **--m3e-badge-shape** - Corner radius of the badge. _(default: undefined)_\n- **--m3e-badge-color** - Foreground color of badge content. _(default: undefined)_\n- **--m3e-badge-container-color** - Background color of the badge. _(default: undefined)_\n- **--m3e-badge-small-size** - Fixed dimensions for small badge. Used for minimal indicators (e.g. dot). _(default: undefined)_\n- **--m3e-badge-medium-size** - Height and min-width for medium badge. _(default: undefined)_\n- **--m3e-badge-medium-font-size** - Font size for medium badge label. _(default: undefined)_\n- **--m3e-badge-medium-font-weight** - Font weight for medium badge label. _(default: undefined)_\n- **--m3e-badge-medium-line-height** - Line height for medium badge label. _(default: undefined)_\n- **--m3e-badge-medium-tracking** - Letter spacing for medium badge label. _(default: undefined)_\n- **--m3e-badge-large-size** - Height and min-width for large badge. _(default: undefined)_\n- **--m3e-badge-large-font-size** - Font size for large badge label. _(default: undefined)_\n- **--m3e-badge-large-font-weight** - Font weight for large badge label. _(default: undefined)_\n- **--m3e-badge-large-line-height** - Line height for large badge label. _(default: undefined)_\n- **--m3e-badge-large-tracking** - Letter spacing for large badge label. _(default: undefined)_",
|
|
105
|
-
"attributes": [
|
|
106
|
-
{
|
|
107
|
-
"name": "size",
|
|
108
|
-
"description": "The size of the badge.",
|
|
109
|
-
"values": [{ "name": "BadgeSize" }]
|
|
110
|
-
},
|
|
111
|
-
{
|
|
112
|
-
"name": "position",
|
|
113
|
-
"description": "The position of the badge, when attached to another element.",
|
|
114
|
-
"values": [{ "name": "BadgePosition" }]
|
|
115
|
-
},
|
|
116
|
-
{
|
|
117
|
-
"name": "for",
|
|
118
|
-
"description": "The identifier of the interactive control to which this element is attached.",
|
|
119
|
-
"values": []
|
|
120
|
-
}
|
|
121
|
-
],
|
|
122
|
-
"references": []
|
|
123
|
-
},
|
|
124
102
|
{
|
|
125
103
|
"name": "m3e-avatar",
|
|
126
104
|
"description": "An image, icon or textual initials representing a user or other identity.\n---\n\n\n### **Slots:**\n - _default_ - Renders the content of the avatar.\n\n### **CSS Properties:**\n - **--m3e-avatar-size** - Size of the avatar. _(default: undefined)_\n- **--m3e-avatar-shape** - Border radius of the avatar. _(default: undefined)_\n- **--m3e-avatar-font-size** - Font size for the avatar. _(default: undefined)_\n- **--m3e-avatar-font-weight** - Font weight for the avatar. _(default: undefined)_\n- **--m3e-avatar-line-height** - Line height for the avatar. _(default: undefined)_\n- **--m3e-avatar-tracking** - Letter spacing for the avatar. _(default: undefined)_\n- **--m3e-avatar-color** - Background color of the avatar. _(default: undefined)_\n- **--m3e-avatar-label-color** - Text color of the avatar. _(default: undefined)_",
|
|
@@ -203,23 +181,201 @@
|
|
|
203
181
|
"references": []
|
|
204
182
|
},
|
|
205
183
|
{
|
|
206
|
-
"name": "m3e-
|
|
207
|
-
"description": "
|
|
184
|
+
"name": "m3e-badge",
|
|
185
|
+
"description": "A visual indicator used to label content.\n---\n\n\n### **Methods:**\n - **attach(control: _HTMLElement_): _void_** - Attaches the element to an interactive control.\n- **detach(): _void_** - Detaches the element from its current interactive control.\n\n### **Slots:**\n - _default_ - Renders the content of the badge.\n\n### **CSS Properties:**\n - **--m3e-badge-shape** - Corner radius of the badge. _(default: undefined)_\n- **--m3e-badge-color** - Foreground color of badge content. _(default: undefined)_\n- **--m3e-badge-container-color** - Background color of the badge. _(default: undefined)_\n- **--m3e-badge-small-size** - Fixed dimensions for small badge. Used for minimal indicators (e.g. dot). _(default: undefined)_\n- **--m3e-badge-medium-size** - Height and min-width for medium badge. _(default: undefined)_\n- **--m3e-badge-medium-font-size** - Font size for medium badge label. _(default: undefined)_\n- **--m3e-badge-medium-font-weight** - Font weight for medium badge label. _(default: undefined)_\n- **--m3e-badge-medium-line-height** - Line height for medium badge label. _(default: undefined)_\n- **--m3e-badge-medium-tracking** - Letter spacing for medium badge label. _(default: undefined)_\n- **--m3e-badge-large-size** - Height and min-width for large badge. _(default: undefined)_\n- **--m3e-badge-large-font-size** - Font size for large badge label. _(default: undefined)_\n- **--m3e-badge-large-font-weight** - Font weight for large badge label. _(default: undefined)_\n- **--m3e-badge-large-line-height** - Line height for large badge label. _(default: undefined)_\n- **--m3e-badge-large-tracking** - Letter spacing for large badge label. _(default: undefined)_",
|
|
208
186
|
"attributes": [
|
|
209
187
|
{
|
|
210
|
-
"name": "
|
|
211
|
-
"description": "
|
|
188
|
+
"name": "size",
|
|
189
|
+
"description": "The size of the badge.",
|
|
190
|
+
"values": [{ "name": "BadgeSize" }]
|
|
191
|
+
},
|
|
192
|
+
{
|
|
193
|
+
"name": "position",
|
|
194
|
+
"description": "The position of the badge, when attached to another element.",
|
|
195
|
+
"values": [{ "name": "BadgePosition" }]
|
|
196
|
+
},
|
|
197
|
+
{
|
|
198
|
+
"name": "for",
|
|
199
|
+
"description": "The identifier of the interactive control to which this element is attached.",
|
|
212
200
|
"values": []
|
|
201
|
+
}
|
|
202
|
+
],
|
|
203
|
+
"references": []
|
|
204
|
+
},
|
|
205
|
+
{
|
|
206
|
+
"name": "m3e-calendar",
|
|
207
|
+
"description": "A calendar used to select a date.\n---\n\n\n### **Events:**\n - **change** - Emitted when the selected date changes.\n\n### **Methods:**\n - **focusActiveCell(): _Promise<void>_** - Asynchronously focuses the active date.\n- **updateTodayDate(): _void_** - Updates today's date.\n- **movePreviousPeriod(): _Promise<void>_** - Moves the calendar to the previous period.\n- **moveNextPeriod(): _Promise<void>_** - Moves the calendar to the next period.\n- **togglePeriod(): _Promise<void>_** - Toggles the current period.\n\n### **Slots:**\n - **header** - Renders the header of the calendar.\n\n### **CSS Properties:**\n - **--m3e-calendar-container-color** - Background color of the container surface. _(default: undefined)_\n- **--m3e-calendar-container-elevation** - Elevation shadow applied to the container surface. _(default: undefined)_\n- **--m3e-calendar-container-shape** - Corner radius of the container surface. _(default: undefined)_\n- **--m3e-calendar-padding** - Padding applied to the calendar header and body. _(default: undefined)_\n- **--m3e-calendar-period-button-text-color** - Text color used for the period‑navigation buttons in the header. _(default: undefined)_\n- **--m3e-calendar-weekday-font-size** - Font size of weekday labels in month view. _(default: undefined)_\n- **--m3e-calendar-weekday-font-weight** - Font weight of weekday labels in month view. _(default: undefined)_\n- **--m3e-calendar-weekday-line-height** - Line height of weekday labels in month view. _(default: undefined)_\n- **--m3e-calendar-weekday-tracking** - Letter spacing of weekday labels in month view. _(default: undefined)_\n- **--m3e-calendar-date-font-size** - Font size of date cells in month view. _(default: undefined)_\n- **--m3e-calendar-date-font-weight** - Font weight of date cells in month view. _(default: undefined)_\n- **--m3e-calendar-date-line-height** - Line height of date cells in month view. _(default: undefined)_\n- **--m3e-calendar-date-tracking** - Letter spacing of date cells in month view. _(default: undefined)_\n- **--m3e-calendar-item-font-size** - Font size of items in year and multi‑year views. _(default: undefined)_\n- **--m3e-calendar-item-font-weight** - Font weight of items in year and multi‑year views. _(default: undefined)_\n- **--m3e-calendar-item-line-height** - Line height of items in year and multi‑year views. _(default: undefined)_\n- **--m3e-calendar-item-tracking** - Letter spacing of items in year and multi‑year views. _(default: undefined)_\n- **--m3e-calendar-item-selected-color** - Text color for selected date items. _(default: undefined)_\n- **--m3e-calendar-item-selected-container-color** - Background color for selected date items. _(default: undefined)_\n- **--m3e-calendar-item-selected-ripple-color** - Ripple color used when interacting with selected date items. _(default: undefined)_\n- **--m3e-calendar-item-selected-hover-color** - Hover color used when interacting with selected date items. _(default: undefined)_\n- **--m3e-calendar-item-selected-focus-color** - Focus color used when interacting with selected date items. _(default: undefined)_\n- **--m3e-calendar-item-current-outline-thickness** - Outline thickness used to indicate the current date. _(default: undefined)_\n- **--m3e-calendar-item-current-outline-color** - Outline color used to indicate the current date. _(default: undefined)_\n- **--m3e-calendar-item-special-color** - Text color for dates marked as special. _(default: undefined)_\n- **--m3e-calendar-item-special-container-color** - Background color for dates marked as special. _(default: undefined)_\n- **--m3e-calendar-item-special-ripple-color** - Ripple color used when interacting with dates marked as special. _(default: undefined)_\n- **--m3e-calendar-item-special-hover-color** - Hover color used when interacting with dates marked as special. _(default: undefined)_\n- **--m3e-calendar-item-special-focus-color** - Focus color used when interacting with dates marked as special. _(default: undefined)_\n- **--m3e-calendar-range-container-color** - Background color applied to the selected date range. _(default: undefined)_\n- **--m3e-calendar-range-color** - Text color for dates within a selected range. _(default: undefined)_\n- **--m3e-calendar-item-disabled-color** - Color used for disabled date items. _(default: undefined)_\n- **--m3e-calendar-item-disabled-color-opacity** - Opacity applied to the disabled item color. _(default: undefined)_\n- **--m3e-calendar-slide-animation-duration** - Duration of slide transitions between calendar views. _(default: undefined)_",
|
|
208
|
+
"attributes": [
|
|
209
|
+
{
|
|
210
|
+
"name": "date",
|
|
211
|
+
"description": "The selected date.",
|
|
212
|
+
"values": [{ "name": "Date" }]
|
|
213
213
|
},
|
|
214
214
|
{
|
|
215
|
-
"name": "
|
|
216
|
-
"description": "The
|
|
217
|
-
"values": [{ "name": "
|
|
215
|
+
"name": "max-date",
|
|
216
|
+
"description": "The maximum date that can be selected.",
|
|
217
|
+
"values": [{ "name": "Date" }]
|
|
218
218
|
},
|
|
219
219
|
{
|
|
220
|
-
"name": "
|
|
221
|
-
"description": "The
|
|
222
|
-
"values": [{ "name": "
|
|
220
|
+
"name": "min-date",
|
|
221
|
+
"description": "The minimum date that can be selected.",
|
|
222
|
+
"values": [{ "name": "Date" }]
|
|
223
|
+
},
|
|
224
|
+
{
|
|
225
|
+
"name": "range-end",
|
|
226
|
+
"description": "End of a date range.",
|
|
227
|
+
"values": [{ "name": "Date" }]
|
|
228
|
+
},
|
|
229
|
+
{
|
|
230
|
+
"name": "range-start",
|
|
231
|
+
"description": "Start of a date range.",
|
|
232
|
+
"values": [{ "name": "Date" }]
|
|
233
|
+
},
|
|
234
|
+
{
|
|
235
|
+
"name": "start-at",
|
|
236
|
+
"description": "A date specifying the period (month or year) to start the calendar in.",
|
|
237
|
+
"values": [{ "name": "Date" }]
|
|
238
|
+
},
|
|
239
|
+
{
|
|
240
|
+
"name": "start-view",
|
|
241
|
+
"description": "The initial view used to select a date.",
|
|
242
|
+
"values": [{ "name": "CalendarView" }]
|
|
243
|
+
},
|
|
244
|
+
{
|
|
245
|
+
"name": "previous-month-label",
|
|
246
|
+
"description": "The accessible label given to the button used to move to the previous month.",
|
|
247
|
+
"values": []
|
|
248
|
+
},
|
|
249
|
+
{
|
|
250
|
+
"name": "next-month-label",
|
|
251
|
+
"description": "The accessible label given to the button used to move to the next month.",
|
|
252
|
+
"values": []
|
|
253
|
+
},
|
|
254
|
+
{
|
|
255
|
+
"name": "previous-year-label",
|
|
256
|
+
"description": "The accessible label given to the button used to move to the previous year.",
|
|
257
|
+
"values": []
|
|
258
|
+
},
|
|
259
|
+
{
|
|
260
|
+
"name": "next-year-label",
|
|
261
|
+
"description": "The accessible label given to the button used to move to the next year.",
|
|
262
|
+
"values": []
|
|
263
|
+
},
|
|
264
|
+
{
|
|
265
|
+
"name": "previous-multi-year-label",
|
|
266
|
+
"description": "The accessible label given to the button used to move to the previous 24 years.",
|
|
267
|
+
"values": []
|
|
268
|
+
},
|
|
269
|
+
{
|
|
270
|
+
"name": "next-multi-year-label",
|
|
271
|
+
"description": "The accessible label given to the button used to move to the next 24 years.",
|
|
272
|
+
"values": []
|
|
273
|
+
}
|
|
274
|
+
],
|
|
275
|
+
"references": []
|
|
276
|
+
},
|
|
277
|
+
{
|
|
278
|
+
"name": "m3e-month-view",
|
|
279
|
+
"description": "An internal component used to display a single month in a calendar.\n---\n\n\n### **Events:**\n - **change**\n- **active-change**\n\n### **Methods:**\n - **focusActiveCell(): _Promise<void>_** - Asynchronously focuses the active date.",
|
|
280
|
+
"attributes": [
|
|
281
|
+
{
|
|
282
|
+
"name": "range-start",
|
|
283
|
+
"description": "Start of a date range.",
|
|
284
|
+
"values": [{ "name": "Date" }]
|
|
285
|
+
},
|
|
286
|
+
{
|
|
287
|
+
"name": "range-end",
|
|
288
|
+
"description": "End of a date range.",
|
|
289
|
+
"values": [{ "name": "Date" }]
|
|
290
|
+
},
|
|
291
|
+
{
|
|
292
|
+
"name": "today",
|
|
293
|
+
"description": "Today's date.",
|
|
294
|
+
"values": [{ "name": "Date" }]
|
|
295
|
+
},
|
|
296
|
+
{
|
|
297
|
+
"name": "date",
|
|
298
|
+
"description": "The selected date.",
|
|
299
|
+
"values": [{ "name": "Date" }]
|
|
300
|
+
},
|
|
301
|
+
{
|
|
302
|
+
"name": "active-date",
|
|
303
|
+
"description": "The active date.",
|
|
304
|
+
"values": [{ "name": "Date" }]
|
|
305
|
+
},
|
|
306
|
+
{
|
|
307
|
+
"name": "min-date",
|
|
308
|
+
"description": "The minimum date that can be selected.",
|
|
309
|
+
"values": [{ "name": "Date" }]
|
|
310
|
+
},
|
|
311
|
+
{
|
|
312
|
+
"name": "max-date",
|
|
313
|
+
"description": "The maximum date that can be selected.",
|
|
314
|
+
"values": [{ "name": "Date" }]
|
|
315
|
+
}
|
|
316
|
+
],
|
|
317
|
+
"references": []
|
|
318
|
+
},
|
|
319
|
+
{
|
|
320
|
+
"name": "m3e-multi-year-view",
|
|
321
|
+
"description": "An internal component used to display a year selector in a calendar.\n---\n\n\n### **Events:**\n - **change**\n- **active-change**\n\n### **Methods:**\n - **focusActiveCell(): _Promise<void>_** - Asynchronously focuses the active date.",
|
|
322
|
+
"attributes": [
|
|
323
|
+
{
|
|
324
|
+
"name": "today",
|
|
325
|
+
"description": "Today's date.",
|
|
326
|
+
"values": [{ "name": "Date" }]
|
|
327
|
+
},
|
|
328
|
+
{
|
|
329
|
+
"name": "date",
|
|
330
|
+
"description": "The selected date.",
|
|
331
|
+
"values": [{ "name": "Date" }]
|
|
332
|
+
},
|
|
333
|
+
{
|
|
334
|
+
"name": "active-date",
|
|
335
|
+
"description": "The active date.",
|
|
336
|
+
"values": [{ "name": "Date" }]
|
|
337
|
+
},
|
|
338
|
+
{
|
|
339
|
+
"name": "min-date",
|
|
340
|
+
"description": "The minimum date that can be selected.",
|
|
341
|
+
"values": [{ "name": "Date" }]
|
|
342
|
+
},
|
|
343
|
+
{
|
|
344
|
+
"name": "max-date",
|
|
345
|
+
"description": "The maximum date that can be selected.",
|
|
346
|
+
"values": [{ "name": "Date" }]
|
|
347
|
+
}
|
|
348
|
+
],
|
|
349
|
+
"references": []
|
|
350
|
+
},
|
|
351
|
+
{
|
|
352
|
+
"name": "m3e-year-view",
|
|
353
|
+
"description": "An internal component used to display a single year in a calendar.\n---\n\n\n### **Events:**\n - **change**\n- **active-change**\n\n### **Methods:**\n - **focusActiveCell(): _Promise<void>_** - Asynchronously focuses the active date.",
|
|
354
|
+
"attributes": [
|
|
355
|
+
{
|
|
356
|
+
"name": "today",
|
|
357
|
+
"description": "Today's date.",
|
|
358
|
+
"values": [{ "name": "Date" }]
|
|
359
|
+
},
|
|
360
|
+
{
|
|
361
|
+
"name": "date",
|
|
362
|
+
"description": "The selected date.",
|
|
363
|
+
"values": [{ "name": "Date" }]
|
|
364
|
+
},
|
|
365
|
+
{
|
|
366
|
+
"name": "active-date",
|
|
367
|
+
"description": "The active date.",
|
|
368
|
+
"values": [{ "name": "Date" }]
|
|
369
|
+
},
|
|
370
|
+
{
|
|
371
|
+
"name": "min-date",
|
|
372
|
+
"description": "The minimum date that can be selected.",
|
|
373
|
+
"values": [{ "name": "Date" }]
|
|
374
|
+
},
|
|
375
|
+
{
|
|
376
|
+
"name": "max-date",
|
|
377
|
+
"description": "The maximum date that can be selected.",
|
|
378
|
+
"values": [{ "name": "Date" }]
|
|
223
379
|
}
|
|
224
380
|
],
|
|
225
381
|
"references": []
|
|
@@ -301,6 +457,28 @@
|
|
|
301
457
|
],
|
|
302
458
|
"references": []
|
|
303
459
|
},
|
|
460
|
+
{
|
|
461
|
+
"name": "m3e-button-group",
|
|
462
|
+
"description": "Organizes buttons and adds interactions between them.\n---\n\n\n### **Slots:**\n - _default_ - Renders the buttons of the group.\n\n### **CSS Properties:**\n - **--m3e-standard-button-group-extra-small-spacing** - Spacing between buttons in standard variant, extra-small size. _(default: undefined)_\n- **--m3e-standard-button-group-small-spacing** - Spacing between buttons in standard variant, small size. _(default: undefined)_\n- **--m3e-standard-button-group-medium-spacing** - Spacing between buttons in standard variant, medium size. _(default: undefined)_\n- **--m3e-standard-button-group-large-spacing** - Spacing between buttons in standard variant, large size. _(default: undefined)_\n- **--m3e-standard-button-group-extra-large-spacing** - Spacing between buttons in standard variant, extra-large size. _(default: undefined)_\n- **--m3e-connected-button-group-spacing** - Spacing between buttons in connected variant. _(default: undefined)_\n- **--m3e-connected-button-group-extra-small-inner-shape** - Corner shape for connected variant, extra-small size. _(default: undefined)_\n- **--m3e-connected-button-group-extra-small-inner-pressed-shape** - Pressed corner shape for connected variant, extra-small size. _(default: undefined)_\n- **--m3e-connected-button-group-small-inner-shape** - Corner shape for connected variant, small size. _(default: undefined)_\n- **--m3e-connected-button-group-small-inner-pressed-shape** - Pressed corner shape for connected variant, small size. _(default: undefined)_\n- **--m3e-connected-button-group-medium-inner-shape** - Corner shape for connected variant, medium size. _(default: undefined)_\n- **--m3e-connected-button-group-medium-inner-pressed-shape** - Pressed corner shape for connected variant, medium size. _(default: undefined)_\n- **--m3e-connected-button-group-large-inner-shape** - Corner shape for connected variant, large size. _(default: undefined)_\n- **--m3e-connected-button-group-large-inner-pressed-shape** - Pressed corner shape for connected variant, large size. _(default: undefined)_\n- **--m3e-connected-button-group-extra-large-inner-shape** - Corner shape for connected variant, extra-large size. _(default: undefined)_\n- **--m3e-connected-button-group-extra-large-inner-pressed-shape** - Pressed corner shape for connected variant, extra-large size. _(default: undefined)_",
|
|
463
|
+
"attributes": [
|
|
464
|
+
{
|
|
465
|
+
"name": "multi",
|
|
466
|
+
"description": "Whether multiple toggle buttons can be selected.",
|
|
467
|
+
"values": []
|
|
468
|
+
},
|
|
469
|
+
{
|
|
470
|
+
"name": "size",
|
|
471
|
+
"description": "The size of the group.",
|
|
472
|
+
"values": [{ "name": "ButtonGroupSize" }]
|
|
473
|
+
},
|
|
474
|
+
{
|
|
475
|
+
"name": "variant",
|
|
476
|
+
"description": "The appearance variant of the group.",
|
|
477
|
+
"values": [{ "name": "ButtonGroupVariant" }]
|
|
478
|
+
}
|
|
479
|
+
],
|
|
480
|
+
"references": []
|
|
481
|
+
},
|
|
304
482
|
{
|
|
305
483
|
"name": "m3e-card",
|
|
306
484
|
"description": "A content container for text, images (or other media), and actions in the context of a single subject.\n---\n\n\n### **Events:**\n - **click** - Emitted when the element is clicked.\n\n### **Slots:**\n - _default_ - Renders the content of the card without padding.\n- **header** - Renders the header of the card.\n- **content** - Renders the content of the card with padding.\n- **actions** - Renders the actions of the card.\n- **footer** - Renders the footer of the card.\n\n### **CSS Properties:**\n - **--m3e-card-padding** - Internal spacing for all slotted regions _(default: undefined)_\n- **--m3e-card-shape** - Corner radius of the card container. _(default: undefined)_\n- **--m3e-filled-card-text-color** - Foreground color for text content in filled cards. _(default: undefined)_\n- **--m3e-filled-card-container-color** - Background color of the filled card container. _(default: undefined)_\n- **--m3e-filled-card-container-elevation** - Elevation level for filled card container. _(default: undefined)_\n- **--m3e-filled-card-disabled-text-color** - Text color when filled card is disabled. _(default: undefined)_\n- **--m3e-filled-card-disabled-text-opacity** - Opacity applied to text when disabled. _(default: undefined)_\n- **--m3e-filled-card-disabled-container-color** - Background color when disabled. _(default: undefined)_\n- **--m3e-filled-card-disabled-container-elevation** - Elevation level when disabled. _(default: undefined)_\n- **--m3e-filled-card-disabled-container-elevation-color** - Shadow color when disabled. _(default: undefined)_\n- **--m3e-filled-card-disabled-container-elevation-opacity** - Shadow opacity when disabled. _(default: undefined)_\n- **--m3e-filled-card-disabled-container-opacity** - Overall container opacity when disabled. _(default: undefined)_\n- **--m3e-filled-card-hover-text-color** - Text color on hover. _(default: undefined)_\n- **--m3e-filled-card-hover-state-layer-color** - State layer color on hover. _(default: undefined)_\n- **--m3e-filled-card-hover-state-layer-opacity** - State layer opacity on hover. _(default: undefined)_\n- **--m3e-filled-card-hover-container-elevation** - Elevation level on hover. _(default: undefined)_\n- **--m3e-filled-card-focus-text-color** - Text color on focus. _(default: undefined)_\n- **--m3e-filled-card-focus-state-layer-color** - State layer color on focus. _(default: undefined)_\n- **--m3e-filled-card-focus-state-layer-opacity** - State layer opacity on focus. _(default: undefined)_\n- **--m3e-filled-card-focus-container-elevation** - Elevation level on focus. _(default: undefined)_\n- **--m3e-filled-card-pressed-text-color** - Text color on press. _(default: undefined)_\n- **--m3e-filled-card-pressed-state-layer-color** - State layer color on press. _(default: undefined)_\n- **--m3e-filled-card-pressed-state-layer-opacity** - State layer opacity on press. _(default: undefined)_\n- **--m3e-filled-card-pressed-container-elevation** - Elevation level on press. _(default: undefined)_\n- **--m3e-elevated-card-text-color** - Foreground color for text content in elevated cards. _(default: undefined)_\n- **--m3e-elevated-card-container-color** - Background color of the elevated card container. _(default: undefined)_\n- **--m3e-elevated-card-container-elevation** - Elevation level for elevated card container. _(default: undefined)_\n- **--m3e-elevated-card-disabled-text-color** - Text color when elevated card is disabled. _(default: undefined)_\n- **--m3e-elevated-card-disabled-text-opacity** - Opacity applied to text when disabled. _(default: undefined)_\n- **--m3e-elevated-card-disabled-container-color** - Background color when disabled. _(default: undefined)_\n- **--m3e-elevated-card-disabled-container-elevation** - Elevation level when disabled. _(default: undefined)_\n- **--m3e-elevated-card-disabled-container-elevation-color** - Shadow color when disabled. _(default: undefined)_\n- **--m3e-elevated-card-disabled-container-elevation-opacity** - Shadow opacity when disabled. _(default: undefined)_\n- **--m3e-elevated-card-disabled-container-opacity** - Overall container opacity when disabled. _(default: undefined)_\n- **--m3e-elevated-card-hover-text-color** - Text color on hover. _(default: undefined)_\n- **--m3e-elevated-card-hover-state-layer-color** - State layer color on hover. _(default: undefined)_\n- **--m3e-elevated-card-hover-state-layer-opacity** - State layer opacity on hover. _(default: undefined)_\n- **--m3e-elevated-card-hover-container-elevation** - Elevation level on hover. _(default: undefined)_\n- **--m3e-elevated-card-focus-text-color** - Text color on focus. _(default: undefined)_\n- **--m3e-elevated-card-focus-state-layer-color** - State layer color on focus. _(default: undefined)_\n- **--m3e-elevated-card-focus-state-layer-opacity** - State layer opacity on focus. _(default: undefined)_\n- **--m3e-elevated-card-focus-container-elevation** - Elevation level on focus. _(default: undefined)_\n- **--m3e-elevated-card-pressed-text-color** - Text color on press. _(default: undefined)_\n- **--m3e-elevated-card-pressed-state-layer-color** - State layer color on press. _(default: undefined)_\n- **--m3e-elevated-card-pressed-state-layer-opacity** - State layer opacity on press. _(default: undefined)_\n- **--m3e-elevated-card-pressed-container-elevation** - Elevation level on press. _(default: undefined)_\n- **--m3e-outlined-card-text-color** - Foreground color for text content in outlined cards. _(default: undefined)_\n- **--m3e-outlined-card-container-color** - Background color of the outlined card container. _(default: undefined)_\n- **--m3e-outlined-card-container-elevation** - Elevation level for outlined card container. _(default: undefined)_\n- **--m3e-outlined-card-outline-color** - Border color for outlined cards. _(default: undefined)_\n- **--m3e-outlined-card-outline-thickness** - Border thickness for outlined cards. _(default: undefined)_\n- **--m3e-outlined-card-disabled-text-color** - Text color when outlined card is disabled. _(default: undefined)_\n- **--m3e-outlined-card-disabled-text-opacity** - Opacity applied to text when disabled. _(default: undefined)_\n- **--m3e-outlined-card-disabled-container-elevation** - Elevation level when disabled. _(default: undefined)_\n- **--m3e-outlined-card-disabled-container-elevation-color** - Shadow color when disabled. _(default: undefined)_\n- **--m3e-outlined-card-disabled-container-elevation-opacity** - Shadow opacity when disabled. _(default: undefined)_\n- **--m3e-outlined-card-disabled-outline-color** - Border color when disabled. _(default: undefined)_\n- **--m3e-outlined-card-disabled-outline-opacity** - Border opacity when disabled. _(default: undefined)_\n- **--m3e-outlined-card-hover-text-color** - Text color on hover. _(default: undefined)_\n- **--m3e-outlined-card-hover-state-layer-color** - State layer color on hover. _(default: undefined)_\n- **--m3e-outlined-card-hover-state-layer-opacity** - State layer opacity on hover. _(default: undefined)_\n- **--m3e-outlined-card-hover-container-elevation** - Elevation level on hover. _(default: undefined)_\n- **--m3e-outlined-card-hover-outline-color** - Border color on hover. _(default: undefined)_\n- **--m3e-outlined-card-focus-text-color** - Text color on focus. _(default: undefined)_\n- **--m3e-outlined-card-focus-state-layer-color** - State layer color on focus. _(default: undefined)_\n- **--m3e-outlined-card-focus-state-layer-opacity** - State layer opacity on focus. _(default: undefined)_\n- **--m3e-outlined-card-focus-container-elevation** - Elevation level on focus. _(default: undefined)_\n- **--m3e-outlined-card-focus-outline-color** - Border color on focus. _(default: undefined)_\n- **--m3e-outlined-card-pressed-text-color** - Text color on press. _(default: undefined)_\n- **--m3e-outlined-card-pressed-state-layer-color** - State layer color on press. _(default: undefined)_\n- **--m3e-outlined-card-pressed-state-layer-opacity** - State layer opacity on press. _(default: undefined)_\n- **--m3e-outlined-card-pressed-container-elevation** - Elevation level on press. _(default: undefined)_\n- **--m3e-outlined-card-pressed-outline-color** - Border color on press. _(default: undefined)_",
|
|
@@ -681,6 +859,120 @@
|
|
|
681
859
|
],
|
|
682
860
|
"references": []
|
|
683
861
|
},
|
|
862
|
+
{
|
|
863
|
+
"name": "m3e-datepicker",
|
|
864
|
+
"description": "Presents a date picker on a temporary surface.\n---\n\n\n### **Events:**\n - **change** - Dispatched when the selected date changes.\n- **beforetoggle** - Dispatched before the toggle state changes.\n- **toggle** - Dispatched after the toggle state has changed.\n\n### **Methods:**\n - **show(trigger: _HTMLElement_, anchor: _HTMLElement | undefined_): _Promise<void>_** - Opens the picker.\n- **hide(restoreFocus: _boolean_): _void_** - Hides the picker.\n- **toggle(trigger: _HTMLElement_, anchor: _HTMLElement | undefined_): _Promise<void>_** - Toggles the picker.\n\n### **CSS Properties:**\n - **--m3e-datepicker-container-padding-block** - Block‑axis padding of the date picker container. _(default: undefined)_\n- **--m3e-datepicker-container-padding-inline** - Inline‑axis padding of the date picker container. _(default: undefined)_\n- **--m3e-datepicker-container-color** - Background color of the standard container surface. _(default: undefined)_\n- **--m3e-datepicker-container-elevation** - Elevation shadow applied to the container surface. _(default: undefined)_\n- **--m3e-datepicker-modal-headline-font-size** - Font size used for the modal headline text. _(default: undefined)_\n- **--m3e-datepicker-modal-headline-font-weight** - Font weight used for the modal headline text. _(default: undefined)_\n- **--m3e-datepicker-modal-headline-line-height** - Line height used for the modal headline text. _(default: undefined)_\n- **--m3e-datepicker-modal-headline-tracking** - Letter spacing used for the modal headline text. _(default: undefined)_\n- **--m3e-datepicker-modal-supporting-text-font-size** - Font size used for supporting text in modal mode. _(default: undefined)_\n- **--m3e-datepicker-modal-supporting-text-font-weight** - Font weight used for supporting text in modal mode. _(default: undefined)_\n- **--m3e-datepicker-modal-supporting-text-line-height** - Line height used for supporting text in modal mode. _(default: undefined)_\n- **--m3e-datepicker-modal-supporting-text-tracking** - Letter spacing used for supporting text in modal mode. _(default: undefined)_\n- **--m3e-datepicker-actions-padding-inline** - Inline‑axis padding of the action row. _(default: undefined)_\n- **--m3e-datepicker-docked-container-color** - Background color of the container in docked mode. _(default: undefined)_\n- **--m3e-datepicker-docked-container-shape** - Corner radius of the container in docked mode. _(default: undefined)_\n- **--m3e-datepicker-modal-container-color** - Background color of the container in modal mode. _(default: undefined)_\n- **--m3e-datepicker-modal-container-shape** - Corner radius of the container in modal mode. _(default: undefined)_\n- **--m3e-divider-thickness** - Thickness of divider elements within the picker. _(default: undefined)_\n- **--m3e-divider-color** - Color of divider rules within the picker. _(default: undefined)_\n- **--m3e-dialog-scrim-color** - Base color used for the modal scrim behind the picker. _(default: undefined)_\n- **--m3e-dialog-scrim-opacity** - Opacity applied to the scrim color in modal mode. _(default: undefined)_",
|
|
865
|
+
"attributes": [
|
|
866
|
+
{
|
|
867
|
+
"name": "variant",
|
|
868
|
+
"description": "The appearance variant of the picker.",
|
|
869
|
+
"values": [{ "name": "DatepickerVariant" }]
|
|
870
|
+
},
|
|
871
|
+
{
|
|
872
|
+
"name": "clearable",
|
|
873
|
+
"description": "Whether the user can clear the selected date and close the picker.",
|
|
874
|
+
"values": []
|
|
875
|
+
},
|
|
876
|
+
{
|
|
877
|
+
"name": "date",
|
|
878
|
+
"description": "The selected date.",
|
|
879
|
+
"values": [{ "name": "Date" }]
|
|
880
|
+
},
|
|
881
|
+
{
|
|
882
|
+
"name": "max-date",
|
|
883
|
+
"description": "The maximum date that can be selected.",
|
|
884
|
+
"values": [{ "name": "Date" }]
|
|
885
|
+
},
|
|
886
|
+
{
|
|
887
|
+
"name": "min-date",
|
|
888
|
+
"description": "The minimum date that can be selected.",
|
|
889
|
+
"values": [{ "name": "Date" }]
|
|
890
|
+
},
|
|
891
|
+
{
|
|
892
|
+
"name": "range-end",
|
|
893
|
+
"description": "End of a date range.",
|
|
894
|
+
"values": [{ "name": "Date" }]
|
|
895
|
+
},
|
|
896
|
+
{
|
|
897
|
+
"name": "range-start",
|
|
898
|
+
"description": "Start of a date range.",
|
|
899
|
+
"values": [{ "name": "Date" }]
|
|
900
|
+
},
|
|
901
|
+
{
|
|
902
|
+
"name": "start-at",
|
|
903
|
+
"description": "A date specifying the period (month or year) to start the calendar in.",
|
|
904
|
+
"values": [{ "name": "Date" }]
|
|
905
|
+
},
|
|
906
|
+
{
|
|
907
|
+
"name": "start-view",
|
|
908
|
+
"description": "The initial view used to select a date.",
|
|
909
|
+
"values": [{ "name": "CalendarView" }]
|
|
910
|
+
},
|
|
911
|
+
{
|
|
912
|
+
"name": "previous-month-label",
|
|
913
|
+
"description": "The accessible label given to the button used to move to the previous month.",
|
|
914
|
+
"values": []
|
|
915
|
+
},
|
|
916
|
+
{
|
|
917
|
+
"name": "next-month-label",
|
|
918
|
+
"description": "The accessible label given to the button used to move to the next month.",
|
|
919
|
+
"values": []
|
|
920
|
+
},
|
|
921
|
+
{
|
|
922
|
+
"name": "previous-year-label",
|
|
923
|
+
"description": "The accessible label given to the button used to move to the previous year.",
|
|
924
|
+
"values": []
|
|
925
|
+
},
|
|
926
|
+
{
|
|
927
|
+
"name": "next-year-label",
|
|
928
|
+
"description": "The accessible label given to the button used to move to the next year.",
|
|
929
|
+
"values": []
|
|
930
|
+
},
|
|
931
|
+
{
|
|
932
|
+
"name": "previous-multi-year-label",
|
|
933
|
+
"description": "The accessible label given to the button used to move to the previous 24 years.",
|
|
934
|
+
"values": []
|
|
935
|
+
},
|
|
936
|
+
{
|
|
937
|
+
"name": "next-multi-year-label",
|
|
938
|
+
"description": "The accessible label given to the button used to move to the next 24 years.",
|
|
939
|
+
"values": []
|
|
940
|
+
},
|
|
941
|
+
{
|
|
942
|
+
"name": "clear-label",
|
|
943
|
+
"description": "The label given to the button used clear the selected date and close the picker.",
|
|
944
|
+
"values": []
|
|
945
|
+
},
|
|
946
|
+
{
|
|
947
|
+
"name": "confirm-label",
|
|
948
|
+
"description": "The label given to the button used apply the selected date and close the picker.",
|
|
949
|
+
"values": []
|
|
950
|
+
},
|
|
951
|
+
{
|
|
952
|
+
"name": "dismiss-label",
|
|
953
|
+
"description": "The label given to the button used discard the selected date and close the picker.",
|
|
954
|
+
"values": []
|
|
955
|
+
},
|
|
956
|
+
{
|
|
957
|
+
"name": "label",
|
|
958
|
+
"description": "The label given to the the picker.",
|
|
959
|
+
"values": []
|
|
960
|
+
}
|
|
961
|
+
],
|
|
962
|
+
"references": []
|
|
963
|
+
},
|
|
964
|
+
{
|
|
965
|
+
"name": "m3e-datepicker-toggle",
|
|
966
|
+
"description": "An element, nested within a clickable element, used to toggle a datepicker.\n---\n\n\n### **Methods:**\n \n- **attach(control: _HTMLElement_): _void_** - Attaches the element to an interactive control.\n- **detach(): _void_** - Detaches the element from its current interactive control.",
|
|
967
|
+
"attributes": [
|
|
968
|
+
{
|
|
969
|
+
"name": "for",
|
|
970
|
+
"description": "The identifier of the interactive control to which this element is attached.",
|
|
971
|
+
"values": []
|
|
972
|
+
}
|
|
973
|
+
],
|
|
974
|
+
"references": []
|
|
975
|
+
},
|
|
684
976
|
{
|
|
685
977
|
"name": "m3e-dialog-action",
|
|
686
978
|
"description": "An element, nested within a clickable element, used to close a parenting dialog.\n---\n\n\n### **Methods:**\n \n\n### **Slots:**\n - _default_ - Renders the content of the action.",
|
|
@@ -794,26 +1086,97 @@
|
|
|
794
1086
|
"values": []
|
|
795
1087
|
},
|
|
796
1088
|
{
|
|
797
|
-
"name": "start-mode",
|
|
798
|
-
"description": "The behavior mode of the start drawer.",
|
|
799
|
-
"values": [{ "name": "DrawerMode" }]
|
|
1089
|
+
"name": "start-mode",
|
|
1090
|
+
"description": "The behavior mode of the start drawer.",
|
|
1091
|
+
"values": [{ "name": "DrawerMode" }]
|
|
1092
|
+
},
|
|
1093
|
+
{
|
|
1094
|
+
"name": "start-divider",
|
|
1095
|
+
"description": "Whether to show a divider between the start drawer and content for `side` mode.",
|
|
1096
|
+
"values": []
|
|
1097
|
+
}
|
|
1098
|
+
],
|
|
1099
|
+
"references": []
|
|
1100
|
+
},
|
|
1101
|
+
{
|
|
1102
|
+
"name": "m3e-drawer-toggle",
|
|
1103
|
+
"description": "An element, nested within a clickable element, used to toggle the opened state of a drawer.\n---\n\n\n### **Methods:**\n - **attach(control: _HTMLElement_): _void_** - Attaches the element to an interactive control.\n- **detach(): _void_** - Detaches the element from its current interactive control.\n",
|
|
1104
|
+
"attributes": [
|
|
1105
|
+
{
|
|
1106
|
+
"name": "for",
|
|
1107
|
+
"description": "The identifier of the interactive control to which this element is attached.",
|
|
1108
|
+
"values": []
|
|
1109
|
+
}
|
|
1110
|
+
],
|
|
1111
|
+
"references": []
|
|
1112
|
+
},
|
|
1113
|
+
{
|
|
1114
|
+
"name": "m3e-accordion",
|
|
1115
|
+
"description": "Combines multiple expansion panels in to an accordion.\n---\n\n\n### **Slots:**\n - _default_ - Renders the panels of the accordion.",
|
|
1116
|
+
"attributes": [
|
|
1117
|
+
{
|
|
1118
|
+
"name": "multi",
|
|
1119
|
+
"description": "Whether multiple expansion panels can be open at the same time.",
|
|
1120
|
+
"values": []
|
|
1121
|
+
}
|
|
1122
|
+
],
|
|
1123
|
+
"references": []
|
|
1124
|
+
},
|
|
1125
|
+
{
|
|
1126
|
+
"name": "m3e-expansion-header",
|
|
1127
|
+
"description": "A button used to toggle the expanded state of an expansion panel.\n---\n\n\n### **Events:**\n - **click** - Emitted when the element is clicked.\n\n### **Slots:**\n - _default_ - Renders the content of the header.\n- **toggle-icon** - Renders the icon of the expansion toggle.\n\n### **CSS Properties:**\n - **--m3e-expansion-header-collapsed-height** - Height of the header when the panel is collapsed. _(default: undefined)_\n- **--m3e-expansion-header-expanded-height** - Height of the header when the panel is expanded. _(default: undefined)_\n- **--m3e-expansion-header-padding-left** - Left padding inside the header. _(default: undefined)_\n- **--m3e-expansion-header-padding-right** - Right padding inside the header. _(default: undefined)_\n- **--m3e-expansion-header-spacing** - Spacing between header elements. _(default: undefined)_\n- **--m3e-expansion-header-toggle-icon-size** - Size of the toggle icon (e.g. chevron). _(default: undefined)_\n- **--m3e-expansion-header-font-size** - The font size of the header text. _(default: undefined)_\n- **--m3e-expansion-header-font-weight** - The font weight of the header text. _(default: undefined)_\n- **--m3e-expansion-header-line-height** - The line height of the header text. _(default: undefined)_\n- **--m3e-expansion-header-tracking** - Letter spacing (tracking) of the header text. _(default: undefined)_",
|
|
1128
|
+
"attributes": [
|
|
1129
|
+
{
|
|
1130
|
+
"name": "hide-toggle",
|
|
1131
|
+
"description": "Whether to hide the expansion toggle.",
|
|
1132
|
+
"values": []
|
|
1133
|
+
},
|
|
1134
|
+
{
|
|
1135
|
+
"name": "toggle-direction",
|
|
1136
|
+
"description": "The direction of the expansion toggle.",
|
|
1137
|
+
"values": [{ "name": "ExpansionToggleDirection" }]
|
|
1138
|
+
},
|
|
1139
|
+
{
|
|
1140
|
+
"name": "toggle-position",
|
|
1141
|
+
"description": "The position of the expansion toggle.",
|
|
1142
|
+
"values": [{ "name": "ExpansionTogglePosition" }]
|
|
1143
|
+
},
|
|
1144
|
+
{
|
|
1145
|
+
"name": "disabled",
|
|
1146
|
+
"description": "Whether the element is disabled.",
|
|
1147
|
+
"values": []
|
|
1148
|
+
}
|
|
1149
|
+
],
|
|
1150
|
+
"references": []
|
|
1151
|
+
},
|
|
1152
|
+
{
|
|
1153
|
+
"name": "m3e-expansion-panel",
|
|
1154
|
+
"description": "An expandable details-summary view.\n---\n\n\n### **Events:**\n - **opening** - Emitted when the expansion panel begins to open.\n- **opened** - Emitted when the expansion panel has opened.\n- **closing** - Emitted when the expansion panel begins to close.\n- **closed** - Emitted when the expansion panel has closed.\n\n### **Slots:**\n - _default_ - Renders the detail of the panel.\n- **actions** - Renders the actions bar of the panel.\n- **header** - Renders the header content.\n- **toggle-icon** - Renders the expansion toggle icon.\n\n### **CSS Properties:**\n - **--m3e-expansion-header-collapsed-height** - Height of the header when the panel is collapsed. _(default: undefined)_\n- **--m3e-expansion-header-expanded-height** - Height of the header when the panel is expanded. _(default: undefined)_\n- **--m3e-expansion-header-padding-left** - Left padding inside the header. _(default: undefined)_\n- **--m3e-expansion-header-padding-right** - Right padding inside the header. _(default: undefined)_\n- **--m3e-expansion-header-spacing** - Spacing between header elements. _(default: undefined)_\n- **--m3e-expansion-header-toggle-icon-size** - Size of the toggle icon (e.g. chevron). _(default: undefined)_\n- **--m3e-expansion-header-font-size** - The font size of the header text. _(default: undefined)_\n- **--m3e-expansion-header-font-weight** - The font weight of the header text. _(default: undefined)_\n- **--m3e-expansion-header-line-height** - The line height of the header text. _(default: undefined)_\n- **--m3e-expansion-header-tracking** - Letter spacing (tracking) of the header text. _(default: undefined)_\n- **--m3e-expansion-panel-text-color** - Color of the panel's text content. _(default: undefined)_\n- **--m3e-expansion-panel-disabled-text-color** - Color of the panel's text content, when disabled. _(default: undefined)_\n- **--m3e-expansion-panel-disabled-text-opacity** - Opacity of the panel's text content, when disabled. _(default: undefined)_\n- **--m3e-expansion-panel-container-color** - Background color of the panel container. _(default: undefined)_\n- **--m3e-expansion-panel-elevation** - Elevation level when the panel is collapsed. _(default: undefined)_\n- **--m3e-expansion-panel-shape** - Shape (e.g. border radius) of the panel when collapsed. _(default: undefined)_\n- **--m3e-expansion-panel-open-elevation** - Elevation level when the panel is expanded. _(default: undefined)_\n- **--m3e-expansion-panel-open-shape** - Shape (e.g. border radius) of the panel when expanded. _(default: undefined)_\n- **--m3e-expansion-panel-content-padding** - Padding around the panel's content area. _(default: undefined)_\n- **--m3e-expansion-panel-actions-spacing** - Spacing between action buttons or elements. _(default: undefined)_\n- **--m3e-expansion-panel-actions-padding** - Padding around the actions section. _(default: undefined)_\n- **--m3e-expansion-panel-actions-divider-thickness** - Thickness of the divider above actions. _(default: undefined)_\n- **--m3e-expansion-panel-actions-divider-color** - Color of the divider above actions. _(default: undefined)_",
|
|
1155
|
+
"attributes": [
|
|
1156
|
+
{
|
|
1157
|
+
"name": "disabled",
|
|
1158
|
+
"description": "Whether the element is disabled.",
|
|
1159
|
+
"values": []
|
|
1160
|
+
},
|
|
1161
|
+
{
|
|
1162
|
+
"name": "hide-toggle",
|
|
1163
|
+
"description": "Whether to hide the expansion toggle.",
|
|
1164
|
+
"values": []
|
|
1165
|
+
},
|
|
1166
|
+
{
|
|
1167
|
+
"name": "open",
|
|
1168
|
+
"description": "Whether the panel is expanded.",
|
|
1169
|
+
"values": []
|
|
1170
|
+
},
|
|
1171
|
+
{
|
|
1172
|
+
"name": "toggle-direction",
|
|
1173
|
+
"description": "The direction of the expansion toggle.",
|
|
1174
|
+
"values": [{ "name": "ExpansionToggleDirection" }]
|
|
800
1175
|
},
|
|
801
1176
|
{
|
|
802
|
-
"name": "
|
|
803
|
-
"description": "
|
|
804
|
-
"values": []
|
|
805
|
-
}
|
|
806
|
-
],
|
|
807
|
-
"references": []
|
|
808
|
-
},
|
|
809
|
-
{
|
|
810
|
-
"name": "m3e-drawer-toggle",
|
|
811
|
-
"description": "An element, nested within a clickable element, used to toggle the opened state of a drawer.\n---\n\n\n### **Methods:**\n - **attach(control: _HTMLElement_): _void_** - Attaches the element to an interactive control.\n- **detach(): _void_** - Detaches the element from its current interactive control.\n",
|
|
812
|
-
"attributes": [
|
|
813
|
-
{
|
|
814
|
-
"name": "for",
|
|
815
|
-
"description": "The identifier of the interactive control to which this element is attached.",
|
|
816
|
-
"values": []
|
|
1177
|
+
"name": "toggle-position",
|
|
1178
|
+
"description": "The position of the expansion toggle.",
|
|
1179
|
+
"values": [{ "name": "ExpansionTogglePosition" }]
|
|
817
1180
|
}
|
|
818
1181
|
],
|
|
819
1182
|
"references": []
|
|
@@ -890,77 +1253,6 @@
|
|
|
890
1253
|
],
|
|
891
1254
|
"references": []
|
|
892
1255
|
},
|
|
893
|
-
{
|
|
894
|
-
"name": "m3e-accordion",
|
|
895
|
-
"description": "Combines multiple expansion panels in to an accordion.\n---\n\n\n### **Slots:**\n - _default_ - Renders the panels of the accordion.",
|
|
896
|
-
"attributes": [
|
|
897
|
-
{
|
|
898
|
-
"name": "multi",
|
|
899
|
-
"description": "Whether multiple expansion panels can be open at the same time.",
|
|
900
|
-
"values": []
|
|
901
|
-
}
|
|
902
|
-
],
|
|
903
|
-
"references": []
|
|
904
|
-
},
|
|
905
|
-
{
|
|
906
|
-
"name": "m3e-expansion-header",
|
|
907
|
-
"description": "A button used to toggle the expanded state of an expansion panel.\n---\n\n\n### **Events:**\n - **click** - Emitted when the element is clicked.\n\n### **Slots:**\n - _default_ - Renders the content of the header.\n- **toggle-icon** - Renders the icon of the expansion toggle.\n\n### **CSS Properties:**\n - **--m3e-expansion-header-collapsed-height** - Height of the header when the panel is collapsed. _(default: undefined)_\n- **--m3e-expansion-header-expanded-height** - Height of the header when the panel is expanded. _(default: undefined)_\n- **--m3e-expansion-header-padding-left** - Left padding inside the header. _(default: undefined)_\n- **--m3e-expansion-header-padding-right** - Right padding inside the header. _(default: undefined)_\n- **--m3e-expansion-header-spacing** - Spacing between header elements. _(default: undefined)_\n- **--m3e-expansion-header-toggle-icon-size** - Size of the toggle icon (e.g. chevron). _(default: undefined)_\n- **--m3e-expansion-header-font-size** - The font size of the header text. _(default: undefined)_\n- **--m3e-expansion-header-font-weight** - The font weight of the header text. _(default: undefined)_\n- **--m3e-expansion-header-line-height** - The line height of the header text. _(default: undefined)_\n- **--m3e-expansion-header-tracking** - Letter spacing (tracking) of the header text. _(default: undefined)_",
|
|
908
|
-
"attributes": [
|
|
909
|
-
{
|
|
910
|
-
"name": "hide-toggle",
|
|
911
|
-
"description": "Whether to hide the expansion toggle.",
|
|
912
|
-
"values": []
|
|
913
|
-
},
|
|
914
|
-
{
|
|
915
|
-
"name": "toggle-direction",
|
|
916
|
-
"description": "The direction of the expansion toggle.",
|
|
917
|
-
"values": [{ "name": "ExpansionToggleDirection" }]
|
|
918
|
-
},
|
|
919
|
-
{
|
|
920
|
-
"name": "toggle-position",
|
|
921
|
-
"description": "The position of the expansion toggle.",
|
|
922
|
-
"values": [{ "name": "ExpansionTogglePosition" }]
|
|
923
|
-
},
|
|
924
|
-
{
|
|
925
|
-
"name": "disabled",
|
|
926
|
-
"description": "Whether the element is disabled.",
|
|
927
|
-
"values": []
|
|
928
|
-
}
|
|
929
|
-
],
|
|
930
|
-
"references": []
|
|
931
|
-
},
|
|
932
|
-
{
|
|
933
|
-
"name": "m3e-expansion-panel",
|
|
934
|
-
"description": "An expandable details-summary view.\n---\n\n\n### **Events:**\n - **opening** - Emitted when the expansion panel begins to open.\n- **opened** - Emitted when the expansion panel has opened.\n- **closing** - Emitted when the expansion panel begins to close.\n- **closed** - Emitted when the expansion panel has closed.\n\n### **Slots:**\n - _default_ - Renders the detail of the panel.\n- **actions** - Renders the actions bar of the panel.\n- **header** - Renders the header content.\n- **toggle-icon** - Renders the expansion toggle icon.\n\n### **CSS Properties:**\n - **--m3e-expansion-header-collapsed-height** - Height of the header when the panel is collapsed. _(default: undefined)_\n- **--m3e-expansion-header-expanded-height** - Height of the header when the panel is expanded. _(default: undefined)_\n- **--m3e-expansion-header-padding-left** - Left padding inside the header. _(default: undefined)_\n- **--m3e-expansion-header-padding-right** - Right padding inside the header. _(default: undefined)_\n- **--m3e-expansion-header-spacing** - Spacing between header elements. _(default: undefined)_\n- **--m3e-expansion-header-toggle-icon-size** - Size of the toggle icon (e.g. chevron). _(default: undefined)_\n- **--m3e-expansion-header-font-size** - The font size of the header text. _(default: undefined)_\n- **--m3e-expansion-header-font-weight** - The font weight of the header text. _(default: undefined)_\n- **--m3e-expansion-header-line-height** - The line height of the header text. _(default: undefined)_\n- **--m3e-expansion-header-tracking** - Letter spacing (tracking) of the header text. _(default: undefined)_\n- **--m3e-expansion-panel-text-color** - Color of the panel's text content. _(default: undefined)_\n- **--m3e-expansion-panel-disabled-text-color** - Color of the panel's text content, when disabled. _(default: undefined)_\n- **--m3e-expansion-panel-disabled-text-opacity** - Opacity of the panel's text content, when disabled. _(default: undefined)_\n- **--m3e-expansion-panel-container-color** - Background color of the panel container. _(default: undefined)_\n- **--m3e-expansion-panel-elevation** - Elevation level when the panel is collapsed. _(default: undefined)_\n- **--m3e-expansion-panel-shape** - Shape (e.g. border radius) of the panel when collapsed. _(default: undefined)_\n- **--m3e-expansion-panel-open-elevation** - Elevation level when the panel is expanded. _(default: undefined)_\n- **--m3e-expansion-panel-open-shape** - Shape (e.g. border radius) of the panel when expanded. _(default: undefined)_\n- **--m3e-expansion-panel-content-padding** - Padding around the panel's content area. _(default: undefined)_\n- **--m3e-expansion-panel-actions-spacing** - Spacing between action buttons or elements. _(default: undefined)_\n- **--m3e-expansion-panel-actions-padding** - Padding around the actions section. _(default: undefined)_\n- **--m3e-expansion-panel-actions-divider-thickness** - Thickness of the divider above actions. _(default: undefined)_\n- **--m3e-expansion-panel-actions-divider-color** - Color of the divider above actions. _(default: undefined)_",
|
|
935
|
-
"attributes": [
|
|
936
|
-
{
|
|
937
|
-
"name": "disabled",
|
|
938
|
-
"description": "Whether the element is disabled.",
|
|
939
|
-
"values": []
|
|
940
|
-
},
|
|
941
|
-
{
|
|
942
|
-
"name": "hide-toggle",
|
|
943
|
-
"description": "Whether to hide the expansion toggle.",
|
|
944
|
-
"values": []
|
|
945
|
-
},
|
|
946
|
-
{
|
|
947
|
-
"name": "open",
|
|
948
|
-
"description": "Whether the panel is expanded.",
|
|
949
|
-
"values": []
|
|
950
|
-
},
|
|
951
|
-
{
|
|
952
|
-
"name": "toggle-direction",
|
|
953
|
-
"description": "The direction of the expansion toggle.",
|
|
954
|
-
"values": [{ "name": "ExpansionToggleDirection" }]
|
|
955
|
-
},
|
|
956
|
-
{
|
|
957
|
-
"name": "toggle-position",
|
|
958
|
-
"description": "The position of the expansion toggle.",
|
|
959
|
-
"values": [{ "name": "ExpansionTogglePosition" }]
|
|
960
|
-
}
|
|
961
|
-
],
|
|
962
|
-
"references": []
|
|
963
|
-
},
|
|
964
1256
|
{
|
|
965
1257
|
"name": "m3e-fab-menu",
|
|
966
1258
|
"description": "A menu, opened from a floating action button (FAB), used to display multiple related actions.\n---\n\n\n### **Events:**\n - **beforetoggle** - Dispatched before the toggle state changes.\n- **toggle** - Dispatched after the toggle state has changed.\n\n### **Methods:**\n - **show(trigger: _HTMLElement_): _Promise<void>_** - Opens the menu.\n- **hide(restoreFocus: _boolean_): _void_** - Hides the menu.\n- **toggle(trigger: _HTMLElement_): _Promise<void>_** - Toggles the menu.\n\n### **Slots:**\n - _default_ - Renders the contents of the menu.\n\n### **CSS Properties:**\n - **--m3e-fab-menu-spacing** - Vertical gap between menu items. _(default: undefined)_\n- **--m3e-fab-menu-max-width** - Maximum width of the menu. _(default: undefined)_\n- **--m3e-primary-fab-color** - Foreground color for primary variant items. _(default: undefined)_\n- **--m3e-primary-fab-container-color** - Container color for primary variant items. _(default: undefined)_\n- **--m3e-primary-fab-hover-color** - Hover background color for primary variant items. _(default: undefined)_\n- **--m3e-primary-fab-focus-color** - Focus background color for primary variant items. _(default: undefined)_\n- **--m3e-primary-fab-ripple-color** - Ripple color for primary variant items. _(default: undefined)_\n- **--m3e-secondary-fab-color** - Foreground color for secondary variant items. _(default: undefined)_\n- **--m3e-secondary-fab-container-color** - Container color for secondary variant items. _(default: undefined)_\n- **--m3e-secondary-fab-hover-color** - Hover background color for secondary variant items. _(default: undefined)_\n- **--m3e-secondary-fab-focus-color** - Focus background color for secondary variant items. _(default: undefined)_\n- **--m3e-secondary-fab-ripple-color** - Ripple color for secondary variant items. _(default: undefined)_\n- **--m3e-tertiary-fab-color** - Foreground color for tertiary variant items. _(default: undefined)_\n- **--m3e-tertiary-fab-container-color** - Container color for tertiary variant items. _(default: undefined)_\n- **--m3e-tertiary-fab-hover-color** - Hover background color for tertiary variant items. _(default: undefined)_\n- **--m3e-tertiary-fab-focus-color** - Focus background color for tertiary variant items. _(default: undefined)_\n- **--m3e-tertiary-fab-ripple-color** - Ripple color for tertiary variant items. _(default: undefined)_",
|
|
@@ -1537,6 +1829,30 @@
|
|
|
1537
1829
|
],
|
|
1538
1830
|
"references": []
|
|
1539
1831
|
},
|
|
1832
|
+
{
|
|
1833
|
+
"name": "m3e-nav-rail",
|
|
1834
|
+
"description": "A vertical bar, typically used on larger devices, that allows a user to switch between views.\n---\n\n\n### **Events:**\n - **change** - Emitted when the selected state of an item changes.\n\n### **Slots:**\n - _default_ - Renders the items of the bar.\n\n### **CSS Properties:**\n - **--m3e-nav-rail-top-space** - Top block padding for the nav rail. _(default: undefined)_\n- **--m3e-nav-rail-bottom-space** - Bottom block padding for the nav rail. _(default: undefined)_\n- **--m3e-nav-rail-compact-width** - Width of the nav rail in compact mode. _(default: undefined)_\n- **--m3e-nav-rail-expanded-inline-padding** - Inline padding for expanded nav rail. _(default: undefined)_\n- **--m3e-nav-rail-expanded-min-width** - Minimum width of the nav rail in expanded mode. _(default: undefined)_\n- **--m3e-nav-rail-expanded-max-width** - Maximum width of the nav rail in expanded mode. _(default: undefined)_\n- **--m3e-nav-rail-expanded-item-height** - Height of nav items in expanded mode. _(default: undefined)_\n- **--m3e-nav-rail-button-item-space** - Space below icon buttons and FABs. _(default: undefined)_\n- **--m3e-nav-rail-expanded-icon-button-inset** - Inset for icon buttons in expanded mode. _(default: undefined)_\n- **--m3e-nav-bar-height** - Height of the navigation bar. _(default: undefined)_\n- **--m3e-nav-bar-container-color** - Background color of the navigation bar container. _(default: undefined)_\n- **--m3e-nav-bar-vertical-item-width** - Minimum width of vertical nav items. _(default: undefined)_",
|
|
1835
|
+
"attributes": [
|
|
1836
|
+
{
|
|
1837
|
+
"name": "mode",
|
|
1838
|
+
"description": "The mode in which items in the rail are presented.",
|
|
1839
|
+
"values": [{ "name": "NavBarMode" }]
|
|
1840
|
+
}
|
|
1841
|
+
],
|
|
1842
|
+
"references": []
|
|
1843
|
+
},
|
|
1844
|
+
{
|
|
1845
|
+
"name": "m3e-nav-rail-toggle",
|
|
1846
|
+
"description": "An element, nested within a clickable element, used to toggle the expanded state of a navigation rail.\n---\n\n\n### **Methods:**\n - **attach(control: _HTMLElement_): _void_** - Attaches the element to an interactive control.\n- **detach(): _void_** - Detaches the element from its current interactive control.\n",
|
|
1847
|
+
"attributes": [
|
|
1848
|
+
{
|
|
1849
|
+
"name": "for",
|
|
1850
|
+
"description": "The identifier of the interactive control to which this element is attached.",
|
|
1851
|
+
"values": []
|
|
1852
|
+
}
|
|
1853
|
+
],
|
|
1854
|
+
"references": []
|
|
1855
|
+
},
|
|
1540
1856
|
{
|
|
1541
1857
|
"name": "m3e-nav-menu",
|
|
1542
1858
|
"description": "A hierarchical menu, typically used on larger devices, that allows a user to switch between views.\n---\n\n\n### **Methods:**\n - **expand(items: _M3eNavMenuItemElement | undefined_): _void_** - Expands the specified items, or all items if no items are provided.\n- **collapse(items: _M3eNavMenuItemElement | undefined_): _void_** - Collapses the specified items, or all items if no items are provided.\n\n### **Slots:**\n - _default_ - Renders the items of the menu.\n\n### **CSS Properties:**\n - **--m3e-nav-menu-padding-top** - Top padding for the menu. _(default: undefined)_\n- **--m3e-nav-menu-padding-bottom** - Bottom padding for the menu. _(default: undefined)_\n- **--m3e-nav-menu-padding-left** - Left padding for the menu. _(default: undefined)_\n- **--m3e-nav-menu-padding-right** - Right padding for the menu. _(default: undefined)_\n- **--m3e-nav-menu-divider-margin** - Margin for divider elements in the menu. _(default: undefined)_\n- **--m3e-nav-menu-scrollbar-width** - Width of the menu scrollbar. _(default: undefined)_\n- **--m3e-nav-menu-scrollbar-color** - Color of the menu scrollbar. _(default: undefined)_",
|
|
@@ -1576,30 +1892,6 @@
|
|
|
1576
1892
|
"attributes": [],
|
|
1577
1893
|
"references": []
|
|
1578
1894
|
},
|
|
1579
|
-
{
|
|
1580
|
-
"name": "m3e-nav-rail",
|
|
1581
|
-
"description": "A vertical bar, typically used on larger devices, that allows a user to switch between views.\n---\n\n\n### **Events:**\n - **change** - Emitted when the selected state of an item changes.\n\n### **Slots:**\n - _default_ - Renders the items of the bar.\n\n### **CSS Properties:**\n - **--m3e-nav-rail-top-space** - Top block padding for the nav rail. _(default: undefined)_\n- **--m3e-nav-rail-bottom-space** - Bottom block padding for the nav rail. _(default: undefined)_\n- **--m3e-nav-rail-compact-width** - Width of the nav rail in compact mode. _(default: undefined)_\n- **--m3e-nav-rail-expanded-inline-padding** - Inline padding for expanded nav rail. _(default: undefined)_\n- **--m3e-nav-rail-expanded-min-width** - Minimum width of the nav rail in expanded mode. _(default: undefined)_\n- **--m3e-nav-rail-expanded-max-width** - Maximum width of the nav rail in expanded mode. _(default: undefined)_\n- **--m3e-nav-rail-expanded-item-height** - Height of nav items in expanded mode. _(default: undefined)_\n- **--m3e-nav-rail-button-item-space** - Space below icon buttons and FABs. _(default: undefined)_\n- **--m3e-nav-rail-expanded-icon-button-inset** - Inset for icon buttons in expanded mode. _(default: undefined)_\n- **--m3e-nav-bar-height** - Height of the navigation bar. _(default: undefined)_\n- **--m3e-nav-bar-container-color** - Background color of the navigation bar container. _(default: undefined)_\n- **--m3e-nav-bar-vertical-item-width** - Minimum width of vertical nav items. _(default: undefined)_",
|
|
1582
|
-
"attributes": [
|
|
1583
|
-
{
|
|
1584
|
-
"name": "mode",
|
|
1585
|
-
"description": "The mode in which items in the rail are presented.",
|
|
1586
|
-
"values": [{ "name": "NavBarMode" }]
|
|
1587
|
-
}
|
|
1588
|
-
],
|
|
1589
|
-
"references": []
|
|
1590
|
-
},
|
|
1591
|
-
{
|
|
1592
|
-
"name": "m3e-nav-rail-toggle",
|
|
1593
|
-
"description": "An element, nested within a clickable element, used to toggle the expanded state of a navigation rail.\n---\n\n\n### **Methods:**\n - **attach(control: _HTMLElement_): _void_** - Attaches the element to an interactive control.\n- **detach(): _void_** - Detaches the element from its current interactive control.\n",
|
|
1594
|
-
"attributes": [
|
|
1595
|
-
{
|
|
1596
|
-
"name": "for",
|
|
1597
|
-
"description": "The identifier of the interactive control to which this element is attached.",
|
|
1598
|
-
"values": []
|
|
1599
|
-
}
|
|
1600
|
-
],
|
|
1601
|
-
"references": []
|
|
1602
|
-
},
|
|
1603
1895
|
{
|
|
1604
1896
|
"name": "m3e-optgroup",
|
|
1605
1897
|
"description": "Groups options under a subheading.\n---\n\n\n### **Slots:**\n - _default_ - Renders the options of the group.\n- **label** - Renders the label of the group.\n\n### **CSS Properties:**\n - **--m3e-option-height** - The height of the group label container. _(default: undefined)_\n- **--m3e-option-font-size** - The font size of the group label. _(default: undefined)_\n- **--m3e-option-font-weight** - The font weight of the group label. _(default: undefined)_\n- **--m3e-option-line-height** - The line height of the group label. _(default: undefined)_\n- **--m3e-option-tracking** - The letter spacing of the group label. _(default: undefined)_\n- **--m3e-option-padding-end** - The right padding of the label. _(default: undefined)_\n- **--m3e-option-padding-start** - The left padding of the label. _(default: undefined)_\n- **--m3e-option-color** - The text color of the group label. _(default: undefined)_",
|
|
@@ -1645,7 +1937,7 @@
|
|
|
1645
1937
|
},
|
|
1646
1938
|
{
|
|
1647
1939
|
"name": "m3e-option-panel",
|
|
1648
|
-
"description": "Presents a list of options on a temporary surface.\n---\n\n\n### **Events:**\n - **beforetoggle** - Dispatched before the toggle state changes.\n- **toggle** - Dispatched after the toggle state has changed.\n\n### **Methods:**\n - **show(trigger: _HTMLElement_, anchor: _HTMLElement | undefined_): _Promise<void>_** - Opens the panel.\n- **hide(restoreFocus: _boolean_): _void_** - Hides the panel.\n- **toggle(trigger: _HTMLElement_, anchor: _HTMLElement | undefined_): _Promise<void>_** - Toggles the panel.\n\n### **Slots:**\n - _default_ - Renders the contents of the list.\n\n### **CSS Properties:**\n - **--m3e-option-panel-container-shape** - Corner radius of the panel container. _(default: undefined)_\n- **--m3e-option-panel-container-min-width** - Minimum width of the panel container. _(default: undefined)_\n- **--m3e-option-panel-container-max-width** - Maximum width of the panel container. _(default: undefined)_\n- **--m3e-option-panel-container-max-height** - Maximum height of the panel container. _(default: undefined)_\n- **--m3e-option-panel-container-padding-block** - Vertical padding inside the panel container. _(default: undefined)_\n- **--m3e-option-panel-container-padding-inline** - Horizontal padding inside the panel container. _(default: undefined)_\n- **--m3e-option-panel-container-color** - Background color of the panel container. _(default: undefined)_\n- **--m3e-option-panel-container-elevation** - Box shadow elevation of the panel container. _(default: undefined)_\n- **--m3e-option-panel-gap** - Vertical spacing between option items. _(default: undefined)_\n- **--m3e-option-panel-divider-spacing** - Vertical spacing around slotted `m3e-divider` elements. _(default: undefined)_\n- **--m3e-option-panel-text-highlight-container-color** - Background color used for text highlight matches. _(default: undefined)_\n- **--m3e-option-panel-text-highlight-color** - Text color used for text highlight matches. _(default: undefined)_\n- **--m3e-floating-panel-container-shape** - Corner radius of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-min-width** - Minimum width of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-max-width** - Maximum width of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-max-height** - Maximum height of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-padding-block** - Vertical padding inside the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-padding-inline** - Horizontal padding inside the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-color** - Background color of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-elevation** - Box shadow elevation of the panel container. _(default: undefined)_",
|
|
1940
|
+
"description": "Presents a list of options on a temporary surface.\n---\n\n\n### **Events:**\n - **beforetoggle** - Dispatched before the toggle state changes.\n- **toggle** - Dispatched after the toggle state has changed.\n\n### **Methods:**\n - **show(trigger: _HTMLElement_, anchor: _HTMLElement | null | undefined_): _Promise<void>_** - Opens the panel.\n- **hide(restoreFocus: _boolean_): _void_** - Hides the panel.\n- **toggle(trigger: _HTMLElement_, anchor: _HTMLElement | undefined_): _Promise<void>_** - Toggles the panel.\n\n### **Slots:**\n - _default_ - Renders the contents of the list.\n\n### **CSS Properties:**\n - **--m3e-option-panel-container-shape** - Corner radius of the panel container. _(default: undefined)_\n- **--m3e-option-panel-container-min-width** - Minimum width of the panel container. _(default: undefined)_\n- **--m3e-option-panel-container-max-width** - Maximum width of the panel container. _(default: undefined)_\n- **--m3e-option-panel-container-max-height** - Maximum height of the panel container. _(default: undefined)_\n- **--m3e-option-panel-container-padding-block** - Vertical padding inside the panel container. _(default: undefined)_\n- **--m3e-option-panel-container-padding-inline** - Horizontal padding inside the panel container. _(default: undefined)_\n- **--m3e-option-panel-container-color** - Background color of the panel container. _(default: undefined)_\n- **--m3e-option-panel-container-elevation** - Box shadow elevation of the panel container. _(default: undefined)_\n- **--m3e-option-panel-gap** - Vertical spacing between option items. _(default: undefined)_\n- **--m3e-option-panel-divider-spacing** - Vertical spacing around slotted `m3e-divider` elements. _(default: undefined)_\n- **--m3e-option-panel-text-highlight-container-color** - Background color used for text highlight matches. _(default: undefined)_\n- **--m3e-option-panel-text-highlight-color** - Text color used for text highlight matches. _(default: undefined)_\n- **--m3e-floating-panel-container-shape** - Corner radius of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-min-width** - Minimum width of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-max-width** - Maximum width of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-max-height** - Maximum height of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-padding-block** - Vertical padding inside the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-padding-inline** - Horizontal padding inside the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-color** - Background color of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-elevation** - Box shadow elevation of the panel container. _(default: undefined)_",
|
|
1649
1941
|
"attributes": [
|
|
1650
1942
|
{
|
|
1651
1943
|
"name": "state",
|
|
@@ -1656,6 +1948,16 @@
|
|
|
1656
1948
|
"name": "scroll-strategy",
|
|
1657
1949
|
"description": "The strategy that controls how the panel behaves when its trigger scrolls.",
|
|
1658
1950
|
"values": [{ "name": "FloatingPanelScrollStrategy" }]
|
|
1951
|
+
},
|
|
1952
|
+
{
|
|
1953
|
+
"name": "fit-anchor-width",
|
|
1954
|
+
"description": "Whether the panel's width should match its anchor's width.",
|
|
1955
|
+
"values": []
|
|
1956
|
+
},
|
|
1957
|
+
{
|
|
1958
|
+
"name": "anchor-offset",
|
|
1959
|
+
"description": "The logical margin, in pixels, between the panel and its anchor.",
|
|
1960
|
+
"values": []
|
|
1659
1961
|
}
|
|
1660
1962
|
],
|
|
1661
1963
|
"references": []
|
|
@@ -1846,6 +2148,60 @@
|
|
|
1846
2148
|
],
|
|
1847
2149
|
"references": []
|
|
1848
2150
|
},
|
|
2151
|
+
{
|
|
2152
|
+
"name": "m3e-search-bar",
|
|
2153
|
+
"description": "A bar that provides a prominent entry point for search.\n---\n\n\n### **Events:**\n - **clear** - Dispatched when the search term is cleared.\n\n### **Methods:**\n - **clear(): _void_** - Clears the search term.\n\n### **Slots:**\n - **leading** - Renders content before the input of the bar.\n- **input** - Renders the input of the bar.\n- **trailing** - Renders content after the input of the bar.\n\n### **CSS Properties:**\n - **--m3e-search-bar-container-color** - Background color of the search bar container. _(default: undefined)_\n- **--m3e-search-bar-leading-icon-color** - Color of the leading icon. _(default: undefined)_\n- **--m3e-search-bar-trailing-icon-color** - Color of the trailing icon. _(default: undefined)_\n- **--m3e-search-bar-container-height** - Height of the search bar container. _(default: undefined)_\n- **--m3e-search-bar-container-shape** - Shape (border radius) of the search bar container. _(default: undefined)_\n- **--m3e-search-bar-icon-size** - Size of icons inside the search bar. _(default: undefined)_\n- **--m3e-search-bar-supporting-text-color** - Color of the supporting text. _(default: undefined)_\n- **--m3e-search-bar-supporting-text-font-size** - Font size of the supporting text. _(default: undefined)_\n- **--m3e-search-bar-supporting-text-font-weight** - Font weight of the supporting text. _(default: undefined)_\n- **--m3e-search-bar-supporting-text-line-height** - Line height of the supporting text. _(default: undefined)_\n- **--m3e-search-bar-supporting-text-tracking** - Letter spacing of the supporting text. _(default: undefined)_\n- **--m3e-search-bar-input-color** - Color of the input text. _(default: undefined)_\n- **--m3e-search-bar-input-text-font-size** - Font size of the input text. _(default: undefined)_\n- **--m3e-search-bar-input-text-font-weight** - Font weight of the input text. _(default: undefined)_\n- **--m3e-search-bar-input-text-line-height** - Line height of the input text. _(default: undefined)_\n- **--m3e-search-bar-input-text-tracking** - Letter spacing of the input text. _(default: undefined)_\n- **--m3e-search-bar-leading-space** - Space before the leading icon. _(default: undefined)_\n- **--m3e-search-bar-trailing-space** - Space after the trailing icon. _(default: undefined)_\n- **--m3e-search-bar-no-actions-leading-space** - Leading padding when no actions are present. _(default: undefined)_\n- **--m3e-search-bar-no-actions-trailing-space** - Trailing padding when no actions are present. _(default: undefined)_\n- **--m3e-search-bar-leading-actions-trailing-space** - Space between leading actions and the input. _(default: undefined)_\n- **--m3e-search-bar-trailing-actions-leading-space** - Space between the input and trailing actions. _(default: undefined)_\n- **--m3e-search-bar-actions-gap** - Gap between action icons. _(default: undefined)_",
|
|
2154
|
+
"attributes": [
|
|
2155
|
+
{
|
|
2156
|
+
"name": "clearable",
|
|
2157
|
+
"description": "Whether the bar presents a button used to clear the search term.",
|
|
2158
|
+
"values": []
|
|
2159
|
+
},
|
|
2160
|
+
{
|
|
2161
|
+
"name": "clear-label",
|
|
2162
|
+
"description": "The accessible label given to the button used to clear the search term.",
|
|
2163
|
+
"values": []
|
|
2164
|
+
}
|
|
2165
|
+
],
|
|
2166
|
+
"references": []
|
|
2167
|
+
},
|
|
2168
|
+
{
|
|
2169
|
+
"name": "m3e-search-view",
|
|
2170
|
+
"description": "A surface that presents suggestions and results for a search.\n---\n\n\n### **Events:**\n - **query** - Dispatched when the view is opened or when the user modifies the search term.\n- **clear** - Dispatched when the search term is cleared.\n- **beforetoggle** - Dispatched before the toggle state changes.\n- **toggle** - Dispatched after the toggle state has changed.\n\n### **Methods:**\n - **clear(): _void_** - Clears the search term.\n\n### **Slots:**\n - _default_ - When open, renders the results content of the view.\n- **input** - Renders the input of the view.\n- **open-leading** - When open, renders content before the input of the view.\n- **open-trailing** - When open, renders content after the input of the view.\n- **closed-leading** - When closed, renders content before the input of the view.\n- **closed-trailing** - When closed, renders content after the input of the view.\n\n### **CSS Properties:**\n - **--m3e-search-view-container-color** - Background color of the view container. _(default: undefined)_\n- **--m3e-search-view-contained-container-color** - Background color of the contained view container. _(default: undefined)_\n- **--m3e-search-view-divider-color** - Color of the divider separating header and results. _(default: undefined)_\n- **--m3e-search-view-divider-thickness** - Thickness of the divider separating header and results. _(default: undefined)_\n- **--m3e-search-view-full-screen-container-shape** - Shape of the fullscreen view container. _(default: undefined)_\n- **--m3e-search-view-full-screen-header-container-height** - Height of the header container in fullscreen mode. _(default: undefined)_\n- **--m3e-search-view-docked-container-shape** - Shape of the docked view container. _(default: undefined)_\n- **--m3e-search-view-docked-header-container-height** - Height of the header container in docked mode. _(default: undefined)_\n- **--m3e-search-view-contained-leading-margin** - Leading margin for the contained view. _(default: undefined)_\n- **--m3e-search-view-contained-trailing-margin** - Trailing margin for the contained view. _(default: undefined)_\n- **--m3e-search-view-contained-focused-leading-margin** - Leading margin when the contained view is focused. _(default: undefined)_\n- **--m3e-search-view-contained-focused-trailing-margin** - Trailing margin when the contained view is focused. _(default: undefined)_\n- **--m3e-search-view-contained-docked-bar-results-gap** - Gap between the contained docked bar and results. _(default: undefined)_\n- **--m3e-search-view-contained-docked-results-shape** - Shape of the results container in contained docked mode. _(default: undefined)_\n- **--m3e-search-view-contained-docked-bar-shape** - Shape of the bar in contained docked mode. _(default: undefined)_\n- **--m3e-search-view-contained-full-screen-bar-container-height** - Height of the bar container in contained fullscreen mode. _(default: undefined)_\n- **--m3e-search-view-docked-container-min-height** - Minimum height of the docked view container. _(default: undefined)_\n- **--m3e-search-view-docked-container-max-height** - Maximum height of the docked view container. _(default: undefined)_\n- **--m3e-search-view-contained-docked-results-space** - Space above the results in contained docked mode. _(default: undefined)_\n- **--m3e-search-view-docked-results-bottom-space** - Space below the results in docked mode. _(default: undefined)_\n- **--m3e-search-view-docked-scrim-color** - Color of the scrim behind the docked view. _(default: undefined)_\n- **--m3e-search-view-docked-scrim-opacity** - Opacity of the scrim behind the docked view. _(default: undefined)_",
|
|
2171
|
+
"attributes": [
|
|
2172
|
+
{
|
|
2173
|
+
"name": "contained",
|
|
2174
|
+
"description": "Whether the view features a persistent, filled search container.",
|
|
2175
|
+
"values": []
|
|
2176
|
+
},
|
|
2177
|
+
{
|
|
2178
|
+
"name": "mode",
|
|
2179
|
+
"description": "The behavior mode of the view.",
|
|
2180
|
+
"values": [{ "name": "SearchViewMode" }]
|
|
2181
|
+
},
|
|
2182
|
+
{
|
|
2183
|
+
"name": "open",
|
|
2184
|
+
"description": "Whether the view is expanded to show results.",
|
|
2185
|
+
"values": []
|
|
2186
|
+
},
|
|
2187
|
+
{
|
|
2188
|
+
"name": "clear-label",
|
|
2189
|
+
"description": "The accessible label given to the button used to clear the search term.",
|
|
2190
|
+
"values": []
|
|
2191
|
+
},
|
|
2192
|
+
{
|
|
2193
|
+
"name": "close-label",
|
|
2194
|
+
"description": "The accessible label given to the button used to collapse the view.",
|
|
2195
|
+
"values": []
|
|
2196
|
+
},
|
|
2197
|
+
{
|
|
2198
|
+
"name": "hide-search-icon",
|
|
2199
|
+
"description": "Whether to hide the search icon.",
|
|
2200
|
+
"values": []
|
|
2201
|
+
}
|
|
2202
|
+
],
|
|
2203
|
+
"references": []
|
|
2204
|
+
},
|
|
1849
2205
|
{
|
|
1850
2206
|
"name": "m3e-button-segment",
|
|
1851
2207
|
"description": "A option that can be selected within a segmented button.\n---\n\n\n### **Events:**\n - **input** - Emitted when the checked state changes.\n- **change** - Emitted when the checked state changes.\n- **click** - Emitted when the element is clicked.\n\n### **Methods:**\n - **markAsPristine(): _void_** - Marks the element as pristine.\n- **markAsDirty(): _void_** - Marks the element as dirty.\n- **markAsTouched(): _void_** - Marks the element as touched.\n- **markAsUntouched(): _void_** - Marks the element as untouched.\n\n### **Slots:**\n - _default_ - Renders the label of the option.\n- **icon** - Renders an icon before the option's label.\n\n### **CSS Properties:**\n - **--m3e-segmented-button-height** - Total height of the segmented button. _(default: undefined)_\n- **--m3e-segmented-button-outline-thickness** - Thickness of the button’s border. _(default: undefined)_\n- **--m3e-segmented-button-outline-color** - Color of the button’s border. _(default: undefined)_\n- **--m3e-segmented-button-padding-start** - Padding on the leading edge of the button content. _(default: undefined)_\n- **--m3e-segmented-button-padding-end** - Padding on the trailing edge of the button content. _(default: undefined)_\n- **--m3e-segmented-button-spacing** - Horizontal gap between icon and label. _(default: undefined)_\n- **--m3e-segmented-button-font-size** - Font size of the label text. _(default: undefined)_\n- **--m3e-segmented-button-font-weight** - Font weight of the label text. _(default: undefined)_\n- **--m3e-segmented-button-line-height** - Line height of the label text. _(default: undefined)_\n- **--m3e-segmented-button-tracking** - Letter spacing of the label text. _(default: undefined)_\n- **--m3e-segmented-button-with-icon-padding-start** - Leading padding when an icon is present. _(default: undefined)_\n- **--m3e-segmented-button-selected-container-color** - Background color of a selected segment. _(default: undefined)_\n- **--m3e-segmented-button-selected-container-hover-color** - Hover state-layer color for selected segments. _(default: undefined)_\n- **--m3e-segmented-button-selected-container-focus-color** - Focus state-layer color for selected segments. _(default: undefined)_\n- **--m3e-segmented-button-selected-ripple-color** - Ripple color for selected segments. _(default: undefined)_\n- **--m3e-segmented-button-selected-label-text-color** - Label text color for selected segments. _(default: undefined)_\n- **--m3e-segmented-button-selected-icon-color** - Icon color for selected segments. _(default: undefined)_\n- **--m3e-segmented-button-unselected-container-hover-color** - Hover state-layer color for unselected segments. _(default: undefined)_\n- **--m3e-segmented-button-unselected-container-focus-color** - Focus state-layer color for unselected segments. _(default: undefined)_\n- **--m3e-segmented-button-unselected-ripple-color** - Ripple color for unselected segments. _(default: undefined)_\n- **--m3e-segmented-button-unselected-label-text-color** - Label text color for unselected segments. _(default: undefined)_\n- **--m3e-segmented-button-unselected-icon-color** - Icon color for unselected segments. _(default: undefined)_\n- **--m3e-segmented-button-icon-size** - Font size of the icon. _(default: undefined)_\n- **--m3e-segmented-button-disabled-outline-color** - Base color for disabled segment borders. _(default: undefined)_\n- **--m3e-segmented-button-disabled-outline-opacity** - Opacity applied to disabled segment borders. _(default: undefined)_\n- **--m3e-segmented-button-disabled-label-text-color** - Base color for disabled label text. _(default: undefined)_\n- **--m3e-segmented-button-disabled-label-text-opacity** - Opacity applied to disabled label text. _(default: undefined)_\n- **--m3e-segmented-button-disabled-icon-color** - Base color for disabled icons. _(default: undefined)_\n- **--m3e-segmented-button-disabled-icon-opacity** - Opacity applied to disabled icons. _(default: undefined)_",
|
|
@@ -1944,6 +2300,38 @@
|
|
|
1944
2300
|
],
|
|
1945
2301
|
"references": []
|
|
1946
2302
|
},
|
|
2303
|
+
{
|
|
2304
|
+
"name": "m3e-slide-group",
|
|
2305
|
+
"description": "Presents pagination controls used to scroll overflowing content.\n---\n\n\n### **Slots:**\n - _default_ - Renders the content to paginate.\n- **next-icon** - Renders the icon to present for the next button.\n- **prev-icon** - Renders the icon to present for the previous button.\n\n### **CSS Properties:**\n - **--m3e-slide-group-button-icon-size** - Sets icon size for scroll buttons; overrides default small icon size. _(default: undefined)_\n- **--m3e-slide-group-button-size** - Defines scroll button size; used for width (horizontal) or height (vertical). _(default: undefined)_\n- **--m3e-slide-group-divider-top** - Adds top border to content container for visual separation. _(default: undefined)_\n- **--m3e-slide-group-divider-bottom** - Adds bottom border to content container for visual separation. _(default: undefined)_",
|
|
2306
|
+
"attributes": [
|
|
2307
|
+
{
|
|
2308
|
+
"name": "disabled",
|
|
2309
|
+
"description": "Whether scroll buttons are disabled.",
|
|
2310
|
+
"values": []
|
|
2311
|
+
},
|
|
2312
|
+
{
|
|
2313
|
+
"name": "next-page-label",
|
|
2314
|
+
"description": "The accessible label given to the button used to move to the next page.",
|
|
2315
|
+
"values": []
|
|
2316
|
+
},
|
|
2317
|
+
{
|
|
2318
|
+
"name": "previous-page-label",
|
|
2319
|
+
"description": "The accessible label given to the button used to move to the previous page.",
|
|
2320
|
+
"values": []
|
|
2321
|
+
},
|
|
2322
|
+
{
|
|
2323
|
+
"name": "threshold",
|
|
2324
|
+
"description": "A value, in pixels, indicating the scroll threshold at which to begin showing pagination controls.",
|
|
2325
|
+
"values": []
|
|
2326
|
+
},
|
|
2327
|
+
{
|
|
2328
|
+
"name": "vertical",
|
|
2329
|
+
"description": "Whether content is oriented vertically.",
|
|
2330
|
+
"values": []
|
|
2331
|
+
}
|
|
2332
|
+
],
|
|
2333
|
+
"references": []
|
|
2334
|
+
},
|
|
1947
2335
|
{
|
|
1948
2336
|
"name": "m3e-slider",
|
|
1949
2337
|
"description": "Allows for the selection of numeric values from a range.\n---\n\n\n### **CSS Properties:**\n - **--m3e-slider-min-width** - Minimum inline size of the slider host. _(default: undefined)_\n- **--m3e-slider-small-height** - Height of the slider when size is small or extra-small. _(default: undefined)_\n- **--m3e-slider-medium-height** - Height of the slider when size is medium. _(default: undefined)_\n- **--m3e-slider-large-height** - Height of the slider when size is large. _(default: undefined)_\n- **--m3e-slider-extra-large-height** - Height of the slider when size is extra-large. _(default: undefined)_\n- **--m3e-slider-small-active-track-shape** - Corner shape of the active track for small sliders. _(default: undefined)_\n- **--m3e-slider-small-inactive-active-track-start-shape** - Corner shape of the inactive track start for small sliders. _(default: undefined)_\n- **--m3e-slider-small-inactive-track-end-shape** - Corner shape of the inactive track end for small sliders. _(default: undefined)_\n- **--m3e-slider-medium-active-track-shape** - Corner shape of the active track for medium sliders. _(default: undefined)_\n- **--m3e-slider-medium-inactive-active-track-start-shape** - Corner shape of the inactive track start for medium sliders. _(default: undefined)_\n- **--m3e-slider-medium-inactive-track-end-shape** - Corner shape of the inactive track end for medium sliders. _(default: undefined)_\n- **--m3e-slider-large-active-track-shape** - Corner shape of the active track for large sliders. _(default: undefined)_\n- **--m3e-slider-large-inactive-active-track-start-shape** - Corner shape of the inactive track start for large sliders. _(default: undefined)_\n- **--m3e-slider-large-inactive-track-end-shape** - Corner shape of the inactive track end for large sliders. _(default: undefined)_\n- **--m3e-slider-extra-large-active-track-shape** - Corner shape of the active track for extra-large sliders. _(default: undefined)_\n- **--m3e-slider-extra-large-inactive-active-track-start-shape** - Corner shape of the inactive track start for extra-large sliders. _(default: undefined)_\n- **--m3e-slider-extra-large-inactive-track-end-shape** - Corner shape of the inactive track end for extra-large sliders. _(default: undefined)_\n- **--m3e-slider-extra-small-track-height** - Height of the track for extra-small sliders. _(default: undefined)_\n- **--m3e-slider-small-track-height** - Height of the track for small sliders. _(default: undefined)_\n- **--m3e-slider-medium-track-height** - Height of the track for medium sliders. _(default: undefined)_\n- **--m3e-slider-large-track-height** - Height of the track for large sliders. _(default: undefined)_\n- **--m3e-slider-extra-large-track-height** - Height of the track for extra-large sliders. _(default: undefined)_\n- **--m3e-slider-tick-size** - Size of each tick mark. _(default: undefined)_\n- **--m3e-slider-tick-shape** - Corner shape of each tick mark. _(default: undefined)_\n- **--m3e-slider-inactive-track-color** - Background color of the inactive track when enabled. _(default: undefined)_\n- **--m3e-slider-disabled-inactive-track-color** - Base color of the inactive track when disabled. _(default: undefined)_\n- **--m3e-slider-disabled-inactive-track-opacity** - Opacity of the inactive track when disabled. _(default: undefined)_\n- **--m3e-slider-active-track-color** - Background color of the active track when enabled. _(default: undefined)_\n- **--m3e-slider-disabled-active-track-color** - Base color of the active track when disabled. _(default: undefined)_\n- **--m3e-slider-disabled-active-track-opacity** - Opacity of the active track when disabled. _(default: undefined)_\n- **--m3e-slider-tick-active-color** - Color of active ticks when enabled. _(default: undefined)_\n- **--m3e-slider-disabled-tick-active-color** - Color of active ticks when disabled. _(default: undefined)_\n- **--m3e-slider-tick-inactive-color** - Color of inactive ticks when enabled. _(default: undefined)_\n- **--m3e-slider-disabled-tick-inactive-color** - Color of inactive ticks when disabled. _(default: undefined)_",
|
|
@@ -2008,38 +2396,6 @@
|
|
|
2008
2396
|
],
|
|
2009
2397
|
"references": []
|
|
2010
2398
|
},
|
|
2011
|
-
{
|
|
2012
|
-
"name": "m3e-slide-group",
|
|
2013
|
-
"description": "Presents pagination controls used to scroll overflowing content.\n---\n\n\n### **Slots:**\n - _default_ - Renders the content to paginate.\n- **next-icon** - Renders the icon to present for the next button.\n- **prev-icon** - Renders the icon to present for the previous button.\n\n### **CSS Properties:**\n - **--m3e-slide-group-button-icon-size** - Sets icon size for scroll buttons; overrides default small icon size. _(default: undefined)_\n- **--m3e-slide-group-button-size** - Defines scroll button size; used for width (horizontal) or height (vertical). _(default: undefined)_\n- **--m3e-slide-group-divider-top** - Adds top border to content container for visual separation. _(default: undefined)_\n- **--m3e-slide-group-divider-bottom** - Adds bottom border to content container for visual separation. _(default: undefined)_",
|
|
2014
|
-
"attributes": [
|
|
2015
|
-
{
|
|
2016
|
-
"name": "disabled",
|
|
2017
|
-
"description": "Whether scroll buttons are disabled.",
|
|
2018
|
-
"values": []
|
|
2019
|
-
},
|
|
2020
|
-
{
|
|
2021
|
-
"name": "next-page-label",
|
|
2022
|
-
"description": "The accessible label given to the button used to move to the next page.",
|
|
2023
|
-
"values": []
|
|
2024
|
-
},
|
|
2025
|
-
{
|
|
2026
|
-
"name": "previous-page-label",
|
|
2027
|
-
"description": "The accessible label given to the button used to move to the previous page.",
|
|
2028
|
-
"values": []
|
|
2029
|
-
},
|
|
2030
|
-
{
|
|
2031
|
-
"name": "threshold",
|
|
2032
|
-
"description": "A value, in pixels, indicating the scroll threshold at which to begin showing pagination controls.",
|
|
2033
|
-
"values": []
|
|
2034
|
-
},
|
|
2035
|
-
{
|
|
2036
|
-
"name": "vertical",
|
|
2037
|
-
"description": "Whether content is oriented vertically.",
|
|
2038
|
-
"values": []
|
|
2039
|
-
}
|
|
2040
|
-
],
|
|
2041
|
-
"references": []
|
|
2042
|
-
},
|
|
2043
2399
|
{
|
|
2044
2400
|
"name": "m3e-snackbar",
|
|
2045
2401
|
"description": "Presents short updates about application processes at the bottom of the screen.\n---\n\n\n### **Events:**\n - **beforetoggle** - Dispatched before the toggle state changes.\n- **toggle** - Dispatched after the toggle state has changed.\n\n### **Slots:**\n - _default_ - Renders the content of the snackbar.\n- **close-icon** - Renders the icon of the button used to close the snackbar.\n\n### **CSS Properties:**\n - **--m3e-snackbar-margin** - Vertical offset from the bottom of the viewport. _(default: undefined)_\n- **--m3e-snackbar-container-shape** - Border radius of the snackbar container. _(default: undefined)_\n- **--m3e-snackbar-container-color** - Background color of the snackbar. _(default: undefined)_\n- **--m3e-snackbar-padding** - Internal spacing of the snackbar container. _(default: undefined)_\n- **--m3e-snackbar-min-width** - Minimum width of the snackbar. _(default: undefined)_\n- **--m3e-snackbar-max-width** - Maximum width of the snackbar. _(default: undefined)_",
|
|
@@ -2499,12 +2855,22 @@
|
|
|
2499
2855
|
},
|
|
2500
2856
|
{
|
|
2501
2857
|
"name": "m3e-floating-panel",
|
|
2502
|
-
"description": "A lightweight, generic floating surface used to present content above the page.\n---\n\n\n### **Events:**\n - **beforetoggle** - Dispatched before the toggle state changes.\n- **toggle** - Dispatched after the toggle state has changed.\n\n### **Methods:**\n - **show(trigger: _HTMLElement_, anchor: _HTMLElement | undefined_): _Promise<void>_** - Opens the panel.\n- **hide(restoreFocus: _boolean_): _void_** - Hides the panel.\n- **toggle(trigger: _HTMLElement_, anchor: _HTMLElement | undefined_): _Promise<void>_** - Toggles the panel.\n\n### **Slots:**\n - _default_ - Renders the contents of the panel.\n\n### **CSS Properties:**\n - **--m3e-floating-panel-container-shape** - Corner radius of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-min-width** - Minimum width of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-max-width** - Maximum width of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-max-height** - Maximum height of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-padding-block** - Vertical padding inside the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-padding-inline** - Horizontal padding inside the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-color** - Background color of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-elevation** - Box shadow elevation of the panel container. _(default: undefined)_",
|
|
2858
|
+
"description": "A lightweight, generic floating surface used to present content above the page.\n---\n\n\n### **Events:**\n - **beforetoggle** - Dispatched before the toggle state changes.\n- **toggle** - Dispatched after the toggle state has changed.\n\n### **Methods:**\n - **show(trigger: _HTMLElement_, anchor: _HTMLElement | null | undefined_): _Promise<void>_** - Opens the panel.\n- **hide(restoreFocus: _boolean_): _void_** - Hides the panel.\n- **toggle(trigger: _HTMLElement_, anchor: _HTMLElement | undefined_): _Promise<void>_** - Toggles the panel.\n\n### **Slots:**\n - _default_ - Renders the contents of the panel.\n\n### **CSS Properties:**\n - **--m3e-floating-panel-container-shape** - Corner radius of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-min-width** - Minimum width of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-max-width** - Maximum width of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-max-height** - Maximum height of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-padding-block** - Vertical padding inside the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-padding-inline** - Horizontal padding inside the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-color** - Background color of the panel container. _(default: undefined)_\n- **--m3e-floating-panel-container-elevation** - Box shadow elevation of the panel container. _(default: undefined)_",
|
|
2503
2859
|
"attributes": [
|
|
2504
2860
|
{
|
|
2505
2861
|
"name": "scroll-strategy",
|
|
2506
2862
|
"description": "The strategy that controls how the panel behaves when its trigger scrolls.",
|
|
2507
2863
|
"values": [{ "name": "FloatingPanelScrollStrategy" }]
|
|
2864
|
+
},
|
|
2865
|
+
{
|
|
2866
|
+
"name": "fit-anchor-width",
|
|
2867
|
+
"description": "Whether the panel's width should match its anchor's width.",
|
|
2868
|
+
"values": []
|
|
2869
|
+
},
|
|
2870
|
+
{
|
|
2871
|
+
"name": "anchor-offset",
|
|
2872
|
+
"description": "The logical margin, in pixels, between the panel and its anchor.",
|
|
2873
|
+
"values": []
|
|
2508
2874
|
}
|
|
2509
2875
|
],
|
|
2510
2876
|
"references": []
|