@m3e/react 2.0.1 → 2.0.3

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.
Files changed (202) hide show
  1. package/README.md +4 -0
  2. package/dist/all.js +13 -45
  3. package/dist/all.js.map +1 -1
  4. package/dist/all.min.js +2 -2
  5. package/dist/all.min.js.map +1 -1
  6. package/dist/app-bar.js +2 -34
  7. package/dist/app-bar.js.map +1 -1
  8. package/dist/app-bar.min.js +2 -2
  9. package/dist/app-bar.min.js.map +1 -1
  10. package/dist/autocomplete.js +2 -34
  11. package/dist/autocomplete.js.map +1 -1
  12. package/dist/autocomplete.min.js +2 -2
  13. package/dist/autocomplete.min.js.map +1 -1
  14. package/dist/avatar.js +2 -34
  15. package/dist/avatar.js.map +1 -1
  16. package/dist/avatar.min.js +2 -2
  17. package/dist/avatar.min.js.map +1 -1
  18. package/dist/badge.js +2 -34
  19. package/dist/badge.js.map +1 -1
  20. package/dist/badge.min.js +2 -2
  21. package/dist/badge.min.js.map +1 -1
  22. package/dist/bottom-sheet.js +1 -33
  23. package/dist/bottom-sheet.js.map +1 -1
  24. package/dist/bottom-sheet.min.js +2 -2
  25. package/dist/bottom-sheet.min.js.map +1 -1
  26. package/dist/button-group.js +2 -34
  27. package/dist/button-group.js.map +1 -1
  28. package/dist/button-group.min.js +2 -2
  29. package/dist/button-group.min.js.map +1 -1
  30. package/dist/button.js +2 -34
  31. package/dist/button.js.map +1 -1
  32. package/dist/button.min.js +2 -2
  33. package/dist/button.min.js.map +1 -1
  34. package/dist/card.js +2 -34
  35. package/dist/card.js.map +1 -1
  36. package/dist/card.min.js +2 -2
  37. package/dist/card.min.js.map +1 -1
  38. package/dist/checkbox.js +2 -34
  39. package/dist/checkbox.js.map +1 -1
  40. package/dist/checkbox.min.js +2 -2
  41. package/dist/checkbox.min.js.map +1 -1
  42. package/dist/chips.js +1 -33
  43. package/dist/chips.js.map +1 -1
  44. package/dist/chips.min.js +2 -2
  45. package/dist/chips.min.js.map +1 -1
  46. package/dist/core.js +1 -33
  47. package/dist/core.js.map +1 -1
  48. package/dist/core.min.js +2 -2
  49. package/dist/core.min.js.map +1 -1
  50. package/dist/dialog.js +2 -34
  51. package/dist/dialog.js.map +1 -1
  52. package/dist/dialog.min.js +2 -2
  53. package/dist/dialog.min.js.map +1 -1
  54. package/dist/divider.js +2 -34
  55. package/dist/divider.js.map +1 -1
  56. package/dist/divider.min.js +2 -2
  57. package/dist/divider.min.js.map +1 -1
  58. package/dist/drawer-container.js +2 -34
  59. package/dist/drawer-container.js.map +1 -1
  60. package/dist/drawer-container.min.js +2 -2
  61. package/dist/drawer-container.min.js.map +1 -1
  62. package/dist/expansion-panel.js +1 -33
  63. package/dist/expansion-panel.js.map +1 -1
  64. package/dist/expansion-panel.min.js +2 -2
  65. package/dist/expansion-panel.min.js.map +1 -1
  66. package/dist/fab-menu.js +1 -33
  67. package/dist/fab-menu.js.map +1 -1
  68. package/dist/fab-menu.min.js +2 -2
  69. package/dist/fab-menu.min.js.map +1 -1
  70. package/dist/fab.js +1 -33
  71. package/dist/fab.js.map +1 -1
  72. package/dist/fab.min.js +2 -2
  73. package/dist/fab.min.js.map +1 -1
  74. package/dist/form-field.js +1 -33
  75. package/dist/form-field.js.map +1 -1
  76. package/dist/form-field.min.js +2 -2
  77. package/dist/form-field.min.js.map +1 -1
  78. package/dist/heading.js +1 -33
  79. package/dist/heading.js.map +1 -1
  80. package/dist/heading.min.js +2 -2
  81. package/dist/heading.min.js.map +1 -1
  82. package/dist/icon-button.js +1 -33
  83. package/dist/icon-button.js.map +1 -1
  84. package/dist/icon-button.min.js +2 -2
  85. package/dist/icon-button.min.js.map +1 -1
  86. package/dist/icon.js +1 -33
  87. package/dist/icon.js.map +1 -1
  88. package/dist/icon.min.js +2 -2
  89. package/dist/icon.min.js.map +1 -1
  90. package/dist/index.js +0 -1
  91. package/dist/index.js.map +1 -1
  92. package/dist/list.js +1 -33
  93. package/dist/list.js.map +1 -1
  94. package/dist/list.min.js +2 -2
  95. package/dist/list.min.js.map +1 -1
  96. package/dist/loading-indicator.js +1 -33
  97. package/dist/loading-indicator.js.map +1 -1
  98. package/dist/loading-indicator.min.js +2 -2
  99. package/dist/loading-indicator.min.js.map +1 -1
  100. package/dist/menu.js +1 -33
  101. package/dist/menu.js.map +1 -1
  102. package/dist/menu.min.js +2 -2
  103. package/dist/menu.min.js.map +1 -1
  104. package/dist/nav-bar.js +1 -33
  105. package/dist/nav-bar.js.map +1 -1
  106. package/dist/nav-bar.min.js +2 -2
  107. package/dist/nav-bar.min.js.map +1 -1
  108. package/dist/nav-menu.js +1 -33
  109. package/dist/nav-menu.js.map +1 -1
  110. package/dist/nav-menu.min.js +2 -2
  111. package/dist/nav-menu.min.js.map +1 -1
  112. package/dist/nav-rail.js +1 -33
  113. package/dist/nav-rail.js.map +1 -1
  114. package/dist/nav-rail.min.js +2 -2
  115. package/dist/nav-rail.min.js.map +1 -1
  116. package/dist/option.js +1 -33
  117. package/dist/option.js.map +1 -1
  118. package/dist/option.min.js +2 -2
  119. package/dist/option.min.js.map +1 -1
  120. package/dist/paginator.js +0 -1
  121. package/dist/paginator.js.map +1 -1
  122. package/dist/paginator.min.js +2 -2
  123. package/dist/paginator.min.js.map +1 -1
  124. package/dist/progress-indicator.js +1 -33
  125. package/dist/progress-indicator.js.map +1 -1
  126. package/dist/progress-indicator.min.js +2 -2
  127. package/dist/progress-indicator.min.js.map +1 -1
  128. package/dist/radio-group.js +1 -33
  129. package/dist/radio-group.js.map +1 -1
  130. package/dist/radio-group.min.js +2 -2
  131. package/dist/radio-group.min.js.map +1 -1
  132. package/dist/segmented-button.js +1 -33
  133. package/dist/segmented-button.js.map +1 -1
  134. package/dist/segmented-button.min.js +2 -2
  135. package/dist/segmented-button.min.js.map +1 -1
  136. package/dist/select.js +1 -33
  137. package/dist/select.js.map +1 -1
  138. package/dist/select.min.js +2 -2
  139. package/dist/select.min.js.map +1 -1
  140. package/dist/shape.js +1 -33
  141. package/dist/shape.js.map +1 -1
  142. package/dist/shape.min.js +2 -2
  143. package/dist/shape.min.js.map +1 -1
  144. package/dist/slide-group.js +1 -33
  145. package/dist/slide-group.js.map +1 -1
  146. package/dist/slide-group.min.js +2 -2
  147. package/dist/slide-group.min.js.map +1 -1
  148. package/dist/slider.js +1 -33
  149. package/dist/slider.js.map +1 -1
  150. package/dist/slider.min.js +2 -2
  151. package/dist/slider.min.js.map +1 -1
  152. package/dist/snackbar.js +0 -1
  153. package/dist/snackbar.js.map +1 -1
  154. package/dist/snackbar.min.js +2 -2
  155. package/dist/split-button.js +1 -33
  156. package/dist/split-button.js.map +1 -1
  157. package/dist/split-button.min.js +2 -2
  158. package/dist/split-button.min.js.map +1 -1
  159. package/dist/src/app-bar/AppBar.d.ts +1 -1
  160. package/dist/src/autocomplete/Autocomplete.d.ts +1 -1
  161. package/dist/src/avatar/Avatar.d.ts +1 -1
  162. package/dist/src/badge/Badge.d.ts +1 -1
  163. package/dist/src/button/Button.d.ts +1 -1
  164. package/dist/src/button-group/ButtonGroup.d.ts +1 -1
  165. package/dist/src/card/Card.d.ts +1 -1
  166. package/dist/src/checkbox/Checkbox.d.ts +1 -1
  167. package/dist/src/dialog/Dialog.d.ts +1 -1
  168. package/dist/src/divider/Divider.d.ts +1 -1
  169. package/dist/src/drawer-container/DrawerContainer.d.ts +1 -1
  170. package/dist/stepper.js +1 -33
  171. package/dist/stepper.js.map +1 -1
  172. package/dist/stepper.min.js +2 -2
  173. package/dist/stepper.min.js.map +1 -1
  174. package/dist/switch.js +1 -33
  175. package/dist/switch.js.map +1 -1
  176. package/dist/switch.min.js +2 -2
  177. package/dist/switch.min.js.map +1 -1
  178. package/dist/tabs.js +1 -33
  179. package/dist/tabs.js.map +1 -1
  180. package/dist/tabs.min.js +2 -2
  181. package/dist/tabs.min.js.map +1 -1
  182. package/dist/textarea-autosize.js +1 -33
  183. package/dist/textarea-autosize.js.map +1 -1
  184. package/dist/textarea-autosize.min.js +2 -2
  185. package/dist/textarea-autosize.min.js.map +1 -1
  186. package/dist/theme.js +1 -33
  187. package/dist/theme.js.map +1 -1
  188. package/dist/theme.min.js +2 -2
  189. package/dist/theme.min.js.map +1 -1
  190. package/dist/toc.js +1 -33
  191. package/dist/toc.js.map +1 -1
  192. package/dist/toc.min.js +2 -2
  193. package/dist/toc.min.js.map +1 -1
  194. package/dist/toolbar.js +1 -33
  195. package/dist/toolbar.js.map +1 -1
  196. package/dist/toolbar.min.js +2 -2
  197. package/dist/toolbar.min.js.map +1 -1
  198. package/dist/tooltip.js +1 -33
  199. package/dist/tooltip.js.map +1 -1
  200. package/dist/tooltip.min.js +2 -2
  201. package/dist/tooltip.min.js.map +1 -1
  202. package/package.json +2 -2
@@ -10,7 +10,7 @@ export type { ButtonGroupSize, ButtonGroupVariant, M3eButtonGroupElement } from
10
10
  * native DOM events dispatched by the component. Refs are forwarded to the
11
11
  * underlying `<m3e-button-group>` instance for imperative access.
12
12
  *
13
- * See the `m3e-button-group` documentation in `@m3e/button-group` for full details on behavior,
13
+ * See the `m3e-button-group` documentation for full details on behavior,
14
14
  * styling, accessibility, and supported events.
15
15
  */
16
16
  export declare const M3eButtonGroup: import("@lit/react").ReactWebComponent<M3eButtonGroupElement, {}>;
@@ -10,7 +10,7 @@ export type { CardOrientation, CardVariant, M3eCardElement } from "@m3e/web/card
10
10
  * native DOM events dispatched by the component. Refs are forwarded to the
11
11
  * underlying `<m3e-card>` instance for imperative access.
12
12
  *
13
- * See the `m3e-card` documentation in `@m3e/card` for full details on behavior,
13
+ * See the `m3e-card` documentation for full details on behavior,
14
14
  * styling, accessibility, and supported events.
15
15
  */
16
16
  export declare const M3eCard: import("@lit/react").ReactWebComponent<M3eCardElement, {
@@ -10,7 +10,7 @@ export type { M3eCheckboxElement } from "@m3e/web/checkbox";
10
10
  * native DOM events dispatched by the component. Refs are forwarded to the
11
11
  * underlying `<m3e-checkbox>` instance for imperative access.
12
12
  *
13
- * See the `m3e-checkbox` documentation in `@m3e/checkbox` for full details on behavior,
13
+ * See the `m3e-checkbox` documentation for full details on behavior,
14
14
  * styling, accessibility, and supported events.
15
15
  */
16
16
  export declare const M3eCheckbox: import("@lit/react").ReactWebComponent<M3eCheckboxElement, {
@@ -10,7 +10,7 @@ export type { M3eDialogElement } from "@m3e/web/dialog";
10
10
  * native DOM events dispatched by the component. Refs are forwarded to the
11
11
  * underlying `<m3e-dialog>` instance for imperative access.
12
12
  *
13
- * See the `m3e-dialog` documentation in `@m3e/dialog` for full details on behavior,
13
+ * See the `m3e-dialog` documentation for full details on behavior,
14
14
  * styling, accessibility, and supported events.
15
15
  */
16
16
  export declare const M3eDialog: import("@lit/react").ReactWebComponent<M3eDialogElement, {
@@ -10,7 +10,7 @@ export type { M3eDividerElement } from "@m3e/web/divider";
10
10
  * native DOM events dispatched by the component. Refs are forwarded to the
11
11
  * underlying `<m3e-divider>` instance for imperative access.
12
12
  *
13
- * See the `m3e-divider` documentation in `@m3e/divider` for full details on behavior,
13
+ * See the `m3e-divider` documentation for full details on behavior,
14
14
  * styling, accessibility, and supported events.
15
15
  */
16
16
  export declare const M3eDivider: import("@lit/react").ReactWebComponent<M3eDividerElement, {}>;
@@ -10,7 +10,7 @@ export type { DrawerMode, DrawerPosition, M3eDrawerContainerElement } from "@m3e
10
10
  * native DOM events dispatched by the component. Refs are forwarded to the
11
11
  * underlying `<m3e-drawer-container>` instance for imperative access.
12
12
  *
13
- * See the `m3e-drawer-container` documentation in `@m3e/drawer-container` for full details on behavior,
13
+ * See the `m3e-drawer-container` documentation for full details on behavior,
14
14
  * styling, accessibility, and supported events.
15
15
  */
16
16
  export declare const M3eDrawerContainer: import("@lit/react").ReactWebComponent<M3eDrawerContainerElement, {
package/dist/stepper.js CHANGED
@@ -1,4 +1,3 @@
1
- "use client";
2
1
  /**
3
2
  * @license MIT
4
3
  * Copyright (c) 2025 matraic
@@ -6,40 +5,9 @@
6
5
  */
7
6
 
8
7
  import React from 'react';
9
- import { createComponent as createComponent$1 } from '@lit/react';
8
+ import { createComponent } from '@lit/react';
10
9
  import { M3eStepElement, M3eStepPanelElement, M3eStepperElement, M3eStepperNextElement, M3eStepperPreviousElement, M3eStepperResetElement } from '@m3e/web/stepper';
11
10
 
12
- /**
13
- * Creates an SSR-safe React component for a custom element. Properties are distinguished
14
- * from attributes automatically, and events can be configured so they are added
15
- * to the custom element as event listeners.
16
- *
17
- * @param options An options bag containing the parameters needed to generate a
18
- * wrapped web component.
19
- *
20
- * @param options.react The React module, typically imported from the `react`
21
- * npm package.
22
- * @param options.tagName The custom element tag name registered via
23
- * `customElements.define`.
24
- * @param options.elementClass The custom element class registered via
25
- * `customElements.define`.
26
- * @param options.events An object listing events to which the component can
27
- * listen. The object keys are the event property names passed in via React
28
- * props and the object values are the names of the corresponding events
29
- * generated by the custom element. For example, given `{onactivate:
30
- * 'activate'}` an event function may be passed via the component's `onactivate`
31
- * prop and will be called when the custom element fires its `activate` event.
32
- * @param options.displayName A React component display name, used in debugging
33
- * messages. Default value is inferred from the name of custom element class
34
- * registered via `customElements.define`.
35
- */
36
- // eslint-disable-next-line @typescript-eslint/no-empty-object-type
37
- function createComponent({ react, tagName, elementClass, events, displayName, }) {
38
- return typeof window !== "undefined"
39
- ? createComponent$1({ react, tagName, elementClass, events, displayName })
40
- : null;
41
- }
42
-
43
11
  /**
44
12
  * React binding for the `m3e-step` Web Component from `@m3e/web/stepper`.
45
13
  *
@@ -1 +1 @@
1
- {"version":3,"file":"stepper.js","sources":["../../src/utils/createComponent.ts","../../src/stepper/Step.ts","../../src/stepper/StepPanel.ts","../../src/stepper/Stepper.ts","../../src/stepper/StepperNext.ts","../../src/stepper/StepperPrevious.ts","../../src/stepper/StepperReset.ts"],"sourcesContent":["import { createComponent as createReactComponent, EventName, Options, ReactWebComponent } from \"@lit/react\";\r\n\r\ntype EventNames = Record<string, EventName | string>;\r\n\r\n/**\r\n * Creates an SSR-safe React component for a custom element. Properties are distinguished\r\n * from attributes automatically, and events can be configured so they are added\r\n * to the custom element as event listeners.\r\n *\r\n * @param options An options bag containing the parameters needed to generate a\r\n * wrapped web component.\r\n *\r\n * @param options.react The React module, typically imported from the `react`\r\n * npm package.\r\n * @param options.tagName The custom element tag name registered via\r\n * `customElements.define`.\r\n * @param options.elementClass The custom element class registered via\r\n * `customElements.define`.\r\n * @param options.events An object listing events to which the component can\r\n * listen. The object keys are the event property names passed in via React\r\n * props and the object values are the names of the corresponding events\r\n * generated by the custom element. For example, given `{onactivate:\r\n * 'activate'}` an event function may be passed via the component's `onactivate`\r\n * prop and will be called when the custom element fires its `activate` event.\r\n * @param options.displayName A React component display name, used in debugging\r\n * messages. Default value is inferred from the name of custom element class\r\n * registered via `customElements.define`.\r\n */\r\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\r\nexport function createComponent<I extends HTMLElement, E extends EventNames = {}>({\r\n react,\r\n tagName,\r\n elementClass,\r\n events,\r\n displayName,\r\n}: Options<I, E>): ReactWebComponent<I, E> {\r\n return typeof window !== \"undefined\"\r\n ? createReactComponent<I, E>({ react, tagName, elementClass, events, displayName })\r\n : <ReactWebComponent<I, E>>(<unknown>null);\r\n}\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eStepElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-step` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-step>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-step>` instance for imperative access.\r\n *\r\n * See the `m3e-step` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStep = createComponent({\r\n tagName: \"m3e-step\",\r\n elementClass: M3eStepElement,\r\n react: React,\r\n events: {\r\n onInput: \"input\",\r\n onChange: \"change\",\r\n onClick: \"click\",\r\n },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eStepPanelElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepPanelElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-step-panel` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-step-panel>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-step-panel>` instance for imperative access.\r\n *\r\n * See the `m3e-step-panel` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepPanel = createComponent({\r\n tagName: \"m3e-step-panel\",\r\n elementClass: M3eStepPanelElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eStepperElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperElement, StepperOrientation, StepLabelPosition, StepHeaderPosition } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepper = createComponent({\r\n tagName: \"m3e-stepper\",\r\n elementClass: M3eStepperElement,\r\n react: React,\r\n events: {\r\n onChange: \"change\",\r\n },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eStepperNextElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperNextElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper-next` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper-next>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper-next>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper-next` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepperNext = createComponent({\r\n tagName: \"m3e-stepper-next\",\r\n elementClass: M3eStepperNextElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eStepperPreviousElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperPreviousElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper-previous` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper-previous>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper-previous>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper-previous` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepperPrevious = createComponent({\r\n tagName: \"m3e-stepper-previous\",\r\n elementClass: M3eStepperPreviousElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eStepperResetElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperResetElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper-reset` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper-reset>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper-reset>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper-reset` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepperReset = createComponent({\r\n tagName: \"m3e-stepper-reset\",\r\n elementClass: M3eStepperResetElement,\r\n react: React,\r\n});\r\n"],"names":["createReactComponent"],"mappings":";;;;;;;;;;;AAIA;;;;;;;;;;;;;;;;;;;;;;;AAuBG;AACH;AACM,SAAU,eAAe,CAAmD,EAChF,KAAK,EACL,OAAO,EACP,YAAY,EACZ,MAAM,EACN,WAAW,GACG,EAAA;IACd,OAAO,OAAO,MAAM,KAAK;AACvB,UAAEA,iBAAoB,CAAO,EAAE,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,EAAE,WAAW,EAAE;UAC7C,IAAK;AAC9C;;ACjCA;;;;;;;;;;;;AAYG;AACI,MAAM,OAAO,GAAG,eAAe,CAAC;AACrC,IAAA,OAAO,EAAE,UAAU;AACnB,IAAA,YAAY,EAAE,cAAc;AAC5B,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,OAAO,EAAE,OAAO;AAChB,QAAA,QAAQ,EAAE,QAAQ;AAClB,QAAA,OAAO,EAAE,OAAO;AACjB,KAAA;AACF,CAAA;;ACtBD;;;;;;;;;;;;AAYG;AACI,MAAM,YAAY,GAAG,eAAe,CAAC;AAC1C,IAAA,OAAO,EAAE,gBAAgB;AACzB,IAAA,YAAY,EAAE,mBAAmB;AACjC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;AAYG;AACI,MAAM,UAAU,GAAG,eAAe,CAAC;AACxC,IAAA,OAAO,EAAE,aAAa;AACtB,IAAA,YAAY,EAAE,iBAAiB;AAC/B,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA;AACF,CAAA;;ACpBD;;;;;;;;;;;;AAYG;AACI,MAAM,cAAc,GAAG,eAAe,CAAC;AAC5C,IAAA,OAAO,EAAE,kBAAkB;AAC3B,IAAA,YAAY,EAAE,qBAAqB;AACnC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;AAYG;AACI,MAAM,kBAAkB,GAAG,eAAe,CAAC;AAChD,IAAA,OAAO,EAAE,sBAAsB;AAC/B,IAAA,YAAY,EAAE,yBAAyB;AACvC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;AAYG;AACI,MAAM,eAAe,GAAG,eAAe,CAAC;AAC7C,IAAA,OAAO,EAAE,mBAAmB;AAC5B,IAAA,YAAY,EAAE,sBAAsB;AACpC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;;;"}
1
+ {"version":3,"file":"stepper.js","sources":["../../src/stepper/Step.ts","../../src/stepper/StepPanel.ts","../../src/stepper/Stepper.ts","../../src/stepper/StepperNext.ts","../../src/stepper/StepperPrevious.ts","../../src/stepper/StepperReset.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eStepElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-step` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-step>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-step>` instance for imperative access.\r\n *\r\n * See the `m3e-step` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStep = createComponent({\r\n tagName: \"m3e-step\",\r\n elementClass: M3eStepElement,\r\n react: React,\r\n events: {\r\n onInput: \"input\",\r\n onChange: \"change\",\r\n onClick: \"click\",\r\n },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eStepPanelElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepPanelElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-step-panel` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-step-panel>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-step-panel>` instance for imperative access.\r\n *\r\n * See the `m3e-step-panel` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepPanel = createComponent({\r\n tagName: \"m3e-step-panel\",\r\n elementClass: M3eStepPanelElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eStepperElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperElement, StepperOrientation, StepLabelPosition, StepHeaderPosition } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepper = createComponent({\r\n tagName: \"m3e-stepper\",\r\n elementClass: M3eStepperElement,\r\n react: React,\r\n events: {\r\n onChange: \"change\",\r\n },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eStepperNextElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperNextElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper-next` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper-next>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper-next>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper-next` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepperNext = createComponent({\r\n tagName: \"m3e-stepper-next\",\r\n elementClass: M3eStepperNextElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eStepperPreviousElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperPreviousElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper-previous` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper-previous>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper-previous>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper-previous` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepperPrevious = createComponent({\r\n tagName: \"m3e-stepper-previous\",\r\n elementClass: M3eStepperPreviousElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eStepperResetElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperResetElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper-reset` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper-reset>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper-reset>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper-reset` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepperReset = createComponent({\r\n tagName: \"m3e-stepper-reset\",\r\n elementClass: M3eStepperResetElement,\r\n react: React,\r\n});\r\n"],"names":[],"mappings":";;;;;;;;;;AAMA;;;;;;;;;;;;AAYG;AACI,MAAM,OAAO,GAAG,eAAe,CAAC;AACrC,IAAA,OAAO,EAAE,UAAU;AACnB,IAAA,YAAY,EAAE,cAAc;AAC5B,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,OAAO,EAAE,OAAO;AAChB,QAAA,QAAQ,EAAE,QAAQ;AAClB,QAAA,OAAO,EAAE,OAAO;AACjB,KAAA;AACF,CAAA;;ACtBD;;;;;;;;;;;;AAYG;AACI,MAAM,YAAY,GAAG,eAAe,CAAC;AAC1C,IAAA,OAAO,EAAE,gBAAgB;AACzB,IAAA,YAAY,EAAE,mBAAmB;AACjC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;AAYG;AACI,MAAM,UAAU,GAAG,eAAe,CAAC;AACxC,IAAA,OAAO,EAAE,aAAa;AACtB,IAAA,YAAY,EAAE,iBAAiB;AAC/B,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA;AACF,CAAA;;ACpBD;;;;;;;;;;;;AAYG;AACI,MAAM,cAAc,GAAG,eAAe,CAAC;AAC5C,IAAA,OAAO,EAAE,kBAAkB;AAC3B,IAAA,YAAY,EAAE,qBAAqB;AACnC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;AAYG;AACI,MAAM,kBAAkB,GAAG,eAAe,CAAC;AAChD,IAAA,OAAO,EAAE,sBAAsB;AAC/B,IAAA,YAAY,EAAE,yBAAyB;AACvC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;AAYG;AACI,MAAM,eAAe,GAAG,eAAe,CAAC;AAC7C,IAAA,OAAO,EAAE,mBAAmB;AAC5B,IAAA,YAAY,EAAE,sBAAsB;AACpC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;;;"}
@@ -1,7 +1,7 @@
1
- "use client";
2
1
  /**
3
2
  * @license MIT
4
3
  * Copyright (c) 2025 matraic
5
4
  * See LICENSE file in the project root for full license text.
6
- */import e from"react";import{createComponent as t}from"@lit/react";import{M3eStepElement as a,M3eStepPanelElement as n,M3eStepperElement as s,M3eStepperNextElement as m,M3eStepperPreviousElement as r,M3eStepperResetElement as l}from"@m3e/web/stepper";function p({react:e,tagName:a,elementClass:n,events:s,displayName:m}){return"undefined"!=typeof window?t({react:e,tagName:a,elementClass:n,events:s,displayName:m}):null}const c=p({tagName:"m3e-step",elementClass:a,react:e,events:{onInput:"input",onChange:"change",onClick:"click"}}),o=p({tagName:"m3e-step-panel",elementClass:n,react:e}),i=p({tagName:"m3e-stepper",elementClass:s,react:e,events:{onChange:"change"}}),g=p({tagName:"m3e-stepper-next",elementClass:m,react:e}),C=p({tagName:"m3e-stepper-previous",elementClass:r,react:e}),N=p({tagName:"m3e-stepper-reset",elementClass:l,react:e});export{c as M3eStep,o as M3eStepPanel,i as M3eStepper,g as M3eStepperNext,C as M3eStepperPrevious,N as M3eStepperReset};
5
+ */
6
+ import e from"react";import{createComponent as t}from"@lit/react";import{M3eStepElement as a,M3eStepPanelElement as m,M3eStepperElement as s,M3eStepperNextElement as r,M3eStepperPreviousElement as n,M3eStepperResetElement as p}from"@m3e/web/stepper";const l=t({tagName:"m3e-step",elementClass:a,react:e,events:{onInput:"input",onChange:"change",onClick:"click"}}),c=t({tagName:"m3e-step-panel",elementClass:m,react:e}),o=t({tagName:"m3e-stepper",elementClass:s,react:e,events:{onChange:"change"}}),g=t({tagName:"m3e-stepper-next",elementClass:r,react:e}),C=t({tagName:"m3e-stepper-previous",elementClass:n,react:e}),i=t({tagName:"m3e-stepper-reset",elementClass:p,react:e});export{l as M3eStep,c as M3eStepPanel,o as M3eStepper,g as M3eStepperNext,C as M3eStepperPrevious,i as M3eStepperReset};
7
7
  //# sourceMappingURL=stepper.min.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"stepper.min.js","sources":["../../src/utils/createComponent.ts","../../src/stepper/Step.ts","../../src/stepper/StepPanel.ts","../../src/stepper/Stepper.ts","../../src/stepper/StepperNext.ts","../../src/stepper/StepperPrevious.ts","../../src/stepper/StepperReset.ts"],"sourcesContent":["import { createComponent as createReactComponent, EventName, Options, ReactWebComponent } from \"@lit/react\";\r\n\r\ntype EventNames = Record<string, EventName | string>;\r\n\r\n/**\r\n * Creates an SSR-safe React component for a custom element. Properties are distinguished\r\n * from attributes automatically, and events can be configured so they are added\r\n * to the custom element as event listeners.\r\n *\r\n * @param options An options bag containing the parameters needed to generate a\r\n * wrapped web component.\r\n *\r\n * @param options.react The React module, typically imported from the `react`\r\n * npm package.\r\n * @param options.tagName The custom element tag name registered via\r\n * `customElements.define`.\r\n * @param options.elementClass The custom element class registered via\r\n * `customElements.define`.\r\n * @param options.events An object listing events to which the component can\r\n * listen. The object keys are the event property names passed in via React\r\n * props and the object values are the names of the corresponding events\r\n * generated by the custom element. For example, given `{onactivate:\r\n * 'activate'}` an event function may be passed via the component's `onactivate`\r\n * prop and will be called when the custom element fires its `activate` event.\r\n * @param options.displayName A React component display name, used in debugging\r\n * messages. Default value is inferred from the name of custom element class\r\n * registered via `customElements.define`.\r\n */\r\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\r\nexport function createComponent<I extends HTMLElement, E extends EventNames = {}>({\r\n react,\r\n tagName,\r\n elementClass,\r\n events,\r\n displayName,\r\n}: Options<I, E>): ReactWebComponent<I, E> {\r\n return typeof window !== \"undefined\"\r\n ? createReactComponent<I, E>({ react, tagName, elementClass, events, displayName })\r\n : <ReactWebComponent<I, E>>(<unknown>null);\r\n}\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eStepElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-step` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-step>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-step>` instance for imperative access.\r\n *\r\n * See the `m3e-step` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStep = createComponent({\r\n tagName: \"m3e-step\",\r\n elementClass: M3eStepElement,\r\n react: React,\r\n events: {\r\n onInput: \"input\",\r\n onChange: \"change\",\r\n onClick: \"click\",\r\n },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eStepPanelElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepPanelElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-step-panel` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-step-panel>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-step-panel>` instance for imperative access.\r\n *\r\n * See the `m3e-step-panel` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepPanel = createComponent({\r\n tagName: \"m3e-step-panel\",\r\n elementClass: M3eStepPanelElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eStepperElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperElement, StepperOrientation, StepLabelPosition, StepHeaderPosition } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepper = createComponent({\r\n tagName: \"m3e-stepper\",\r\n elementClass: M3eStepperElement,\r\n react: React,\r\n events: {\r\n onChange: \"change\",\r\n },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eStepperNextElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperNextElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper-next` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper-next>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper-next>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper-next` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepperNext = createComponent({\r\n tagName: \"m3e-stepper-next\",\r\n elementClass: M3eStepperNextElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eStepperPreviousElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperPreviousElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper-previous` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper-previous>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper-previous>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper-previous` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepperPrevious = createComponent({\r\n tagName: \"m3e-stepper-previous\",\r\n elementClass: M3eStepperPreviousElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eStepperResetElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperResetElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper-reset` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper-reset>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper-reset>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper-reset` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepperReset = createComponent({\r\n tagName: \"m3e-stepper-reset\",\r\n elementClass: M3eStepperResetElement,\r\n react: React,\r\n});\r\n"],"names":["createComponent","react","tagName","elementClass","events","displayName","window","createReactComponent","M3eStep","M3eStepElement","React","onInput","onChange","onClick","M3eStepPanel","M3eStepPanelElement","M3eStepper","M3eStepperElement","M3eStepperNext","M3eStepperNextElement","M3eStepperPrevious","M3eStepperPreviousElement","M3eStepperReset","M3eStepperResetElement"],"mappings":";;;;;6PA6BM,SAAUA,GAAkEC,MAChFA,EAAKC,QACLA,EAAOC,aACPA,EAAYC,OACZA,EAAMC,YACNA,IAEA,MAAyB,oBAAXC,OACVC,EAA2B,CAAEN,QAAOC,UAASC,eAAcC,SAAQC,gBAChC,IACzC,CCpBO,MAAMG,EAAUR,EAAgB,CACrCE,QAAS,WACTC,aAAcM,EACdR,MAAOS,EACPN,OAAQ,CACNO,QAAS,QACTC,SAAU,SACVC,QAAS,WCPAC,EAAed,EAAgB,CAC1CE,QAAS,iBACTC,aAAcY,EACdd,MAAOS,ICHIM,EAAahB,EAAgB,CACxCE,QAAS,cACTC,aAAcc,EACdhB,MAAOS,EACPN,OAAQ,CACNQ,SAAU,YCLDM,EAAiBlB,EAAgB,CAC5CE,QAAS,mBACTC,aAAcgB,EACdlB,MAAOS,ICHIU,EAAqBpB,EAAgB,CAChDE,QAAS,uBACTC,aAAckB,EACdpB,MAAOS,ICHIY,EAAkBtB,EAAgB,CAC7CE,QAAS,oBACTC,aAAcoB,EACdtB,MAAOS"}
1
+ {"version":3,"file":"stepper.min.js","sources":["../../src/stepper/Step.ts","../../src/stepper/StepPanel.ts","../../src/stepper/Stepper.ts","../../src/stepper/StepperNext.ts","../../src/stepper/StepperPrevious.ts","../../src/stepper/StepperReset.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eStepElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-step` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-step>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-step>` instance for imperative access.\r\n *\r\n * See the `m3e-step` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStep = createComponent({\r\n tagName: \"m3e-step\",\r\n elementClass: M3eStepElement,\r\n react: React,\r\n events: {\r\n onInput: \"input\",\r\n onChange: \"change\",\r\n onClick: \"click\",\r\n },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eStepPanelElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepPanelElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-step-panel` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-step-panel>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-step-panel>` instance for imperative access.\r\n *\r\n * See the `m3e-step-panel` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepPanel = createComponent({\r\n tagName: \"m3e-step-panel\",\r\n elementClass: M3eStepPanelElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eStepperElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperElement, StepperOrientation, StepLabelPosition, StepHeaderPosition } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepper = createComponent({\r\n tagName: \"m3e-stepper\",\r\n elementClass: M3eStepperElement,\r\n react: React,\r\n events: {\r\n onChange: \"change\",\r\n },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eStepperNextElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperNextElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper-next` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper-next>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper-next>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper-next` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepperNext = createComponent({\r\n tagName: \"m3e-stepper-next\",\r\n elementClass: M3eStepperNextElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eStepperPreviousElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperPreviousElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper-previous` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper-previous>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper-previous>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper-previous` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepperPrevious = createComponent({\r\n tagName: \"m3e-stepper-previous\",\r\n elementClass: M3eStepperPreviousElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eStepperResetElement } from \"@m3e/web/stepper\";\r\nexport type { M3eStepperResetElement } from \"@m3e/web/stepper\";\r\n\r\n/**\r\n * React binding for the `m3e-stepper-reset` Web Component from `@m3e/web/stepper`.\r\n *\r\n * This component renders the underlying `<m3e-stepper-reset>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-stepper-reset>` instance for imperative access.\r\n *\r\n * See the `m3e-stepper-reset` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStepperReset = createComponent({\r\n tagName: \"m3e-stepper-reset\",\r\n elementClass: M3eStepperResetElement,\r\n react: React,\r\n});\r\n"],"names":["M3eStep","createComponent","tagName","elementClass","M3eStepElement","react","React","events","onInput","onChange","onClick","M3eStepPanel","M3eStepPanelElement","M3eStepper","M3eStepperElement","M3eStepperNext","M3eStepperNextElement","M3eStepperPrevious","M3eStepperPreviousElement","M3eStepperReset","M3eStepperResetElement"],"mappings":";;;;;0PAmBO,MAAMA,EAAUC,EAAgB,CACrCC,QAAS,WACTC,aAAcC,EACdC,MAAOC,EACPC,OAAQ,CACNC,QAAS,QACTC,SAAU,SACVC,QAAS,WCPAC,EAAeV,EAAgB,CAC1CC,QAAS,iBACTC,aAAcS,EACdP,MAAOC,ICHIO,EAAaZ,EAAgB,CACxCC,QAAS,cACTC,aAAcW,EACdT,MAAOC,EACPC,OAAQ,CACNE,SAAU,YCLDM,EAAiBd,EAAgB,CAC5CC,QAAS,mBACTC,aAAca,EACdX,MAAOC,ICHIW,EAAqBhB,EAAgB,CAChDC,QAAS,uBACTC,aAAce,EACdb,MAAOC,ICHIa,EAAkBlB,EAAgB,CAC7CC,QAAS,oBACTC,aAAciB,EACdf,MAAOC"}
package/dist/switch.js CHANGED
@@ -1,4 +1,3 @@
1
- "use client";
2
1
  /**
3
2
  * @license MIT
4
3
  * Copyright (c) 2025 matraic
@@ -6,40 +5,9 @@
6
5
  */
7
6
 
8
7
  import React from 'react';
9
- import { createComponent as createComponent$1 } from '@lit/react';
8
+ import { createComponent } from '@lit/react';
10
9
  import { M3eSwitchElement } from '@m3e/web/switch';
11
10
 
12
- /**
13
- * Creates an SSR-safe React component for a custom element. Properties are distinguished
14
- * from attributes automatically, and events can be configured so they are added
15
- * to the custom element as event listeners.
16
- *
17
- * @param options An options bag containing the parameters needed to generate a
18
- * wrapped web component.
19
- *
20
- * @param options.react The React module, typically imported from the `react`
21
- * npm package.
22
- * @param options.tagName The custom element tag name registered via
23
- * `customElements.define`.
24
- * @param options.elementClass The custom element class registered via
25
- * `customElements.define`.
26
- * @param options.events An object listing events to which the component can
27
- * listen. The object keys are the event property names passed in via React
28
- * props and the object values are the names of the corresponding events
29
- * generated by the custom element. For example, given `{onactivate:
30
- * 'activate'}` an event function may be passed via the component's `onactivate`
31
- * prop and will be called when the custom element fires its `activate` event.
32
- * @param options.displayName A React component display name, used in debugging
33
- * messages. Default value is inferred from the name of custom element class
34
- * registered via `customElements.define`.
35
- */
36
- // eslint-disable-next-line @typescript-eslint/no-empty-object-type
37
- function createComponent({ react, tagName, elementClass, events, displayName, }) {
38
- return typeof window !== "undefined"
39
- ? createComponent$1({ react, tagName, elementClass, events, displayName })
40
- : null;
41
- }
42
-
43
11
  /**
44
12
  * React binding for the `m3e-switch` Web Component from `@m3e/web/switch`.
45
13
  *
@@ -1 +1 @@
1
- {"version":3,"file":"switch.js","sources":["../../src/utils/createComponent.ts","../../src/switch/Switch.ts"],"sourcesContent":["import { createComponent as createReactComponent, EventName, Options, ReactWebComponent } from \"@lit/react\";\r\n\r\ntype EventNames = Record<string, EventName | string>;\r\n\r\n/**\r\n * Creates an SSR-safe React component for a custom element. Properties are distinguished\r\n * from attributes automatically, and events can be configured so they are added\r\n * to the custom element as event listeners.\r\n *\r\n * @param options An options bag containing the parameters needed to generate a\r\n * wrapped web component.\r\n *\r\n * @param options.react The React module, typically imported from the `react`\r\n * npm package.\r\n * @param options.tagName The custom element tag name registered via\r\n * `customElements.define`.\r\n * @param options.elementClass The custom element class registered via\r\n * `customElements.define`.\r\n * @param options.events An object listing events to which the component can\r\n * listen. The object keys are the event property names passed in via React\r\n * props and the object values are the names of the corresponding events\r\n * generated by the custom element. For example, given `{onactivate:\r\n * 'activate'}` an event function may be passed via the component's `onactivate`\r\n * prop and will be called when the custom element fires its `activate` event.\r\n * @param options.displayName A React component display name, used in debugging\r\n * messages. Default value is inferred from the name of custom element class\r\n * registered via `customElements.define`.\r\n */\r\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\r\nexport function createComponent<I extends HTMLElement, E extends EventNames = {}>({\r\n react,\r\n tagName,\r\n elementClass,\r\n events,\r\n displayName,\r\n}: Options<I, E>): ReactWebComponent<I, E> {\r\n return typeof window !== \"undefined\"\r\n ? createReactComponent<I, E>({ react, tagName, elementClass, events, displayName })\r\n : <ReactWebComponent<I, E>>(<unknown>null);\r\n}\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eSwitchElement } from \"@m3e/web/switch\";\r\nexport type { M3eSwitchElement, SwitchIcons } from \"@m3e/web/switch\";\r\n\r\n/**\r\n * React binding for the `m3e-switch` Web Component from `@m3e/web/switch`.\r\n *\r\n * This component renders the underlying `<m3e-switch>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-switch>` instance for imperative access.\r\n *\r\n * See the `m3e-switch` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eSwitch = createComponent({\r\n tagName: \"m3e-switch\",\r\n elementClass: M3eSwitchElement,\r\n react: React,\r\n events: {\r\n onInput: \"input\",\r\n onChange: \"change\",\r\n onClick: \"click\",\r\n },\r\n});\r\n"],"names":["createReactComponent"],"mappings":";;;;;;;;;;;AAIA;;;;;;;;;;;;;;;;;;;;;;;AAuBG;AACH;AACM,SAAU,eAAe,CAAmD,EAChF,KAAK,EACL,OAAO,EACP,YAAY,EACZ,MAAM,EACN,WAAW,GACG,EAAA;IACd,OAAO,OAAO,MAAM,KAAK;AACvB,UAAEA,iBAAoB,CAAO,EAAE,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,EAAE,WAAW,EAAE;UAC7C,IAAK;AAC9C;;ACjCA;;;;;;;;;;;;AAYG;AACI,MAAM,SAAS,GAAG,eAAe,CAAC;AACvC,IAAA,OAAO,EAAE,YAAY;AACrB,IAAA,YAAY,EAAE,gBAAgB;AAC9B,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,OAAO,EAAE,OAAO;AAChB,QAAA,QAAQ,EAAE,QAAQ;AAClB,QAAA,OAAO,EAAE,OAAO;AACjB,KAAA;AACF,CAAA;;;;"}
1
+ {"version":3,"file":"switch.js","sources":["../../src/switch/Switch.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eSwitchElement } from \"@m3e/web/switch\";\r\nexport type { M3eSwitchElement, SwitchIcons } from \"@m3e/web/switch\";\r\n\r\n/**\r\n * React binding for the `m3e-switch` Web Component from `@m3e/web/switch`.\r\n *\r\n * This component renders the underlying `<m3e-switch>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-switch>` instance for imperative access.\r\n *\r\n * See the `m3e-switch` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eSwitch = createComponent({\r\n tagName: \"m3e-switch\",\r\n elementClass: M3eSwitchElement,\r\n react: React,\r\n events: {\r\n onInput: \"input\",\r\n onChange: \"change\",\r\n onClick: \"click\",\r\n },\r\n});\r\n"],"names":[],"mappings":";;;;;;;;;;AAMA;;;;;;;;;;;;AAYG;AACI,MAAM,SAAS,GAAG,eAAe,CAAC;AACvC,IAAA,OAAO,EAAE,YAAY;AACrB,IAAA,YAAY,EAAE,gBAAgB;AAC9B,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,OAAO,EAAE,OAAO;AAChB,QAAA,QAAQ,EAAE,QAAQ;AAClB,QAAA,OAAO,EAAE,OAAO;AACjB,KAAA;AACF,CAAA;;;;"}
@@ -1,7 +1,7 @@
1
- "use client";
2
1
  /**
3
2
  * @license MIT
4
3
  * Copyright (c) 2025 matraic
5
4
  * See LICENSE file in the project root for full license text.
6
- */import e from"react";import{createComponent as t}from"@lit/react";import{M3eSwitchElement as n}from"@m3e/web/switch";const a=function({react:e,tagName:n,elementClass:a,events:m,displayName:o}){return"undefined"!=typeof window?t({react:e,tagName:n,elementClass:a,events:m,displayName:o}):null}({tagName:"m3e-switch",elementClass:n,react:e,events:{onInput:"input",onChange:"change",onClick:"click"}});export{a as M3eSwitch};
5
+ */
6
+ import t from"react";import{createComponent as e}from"@lit/react";import{M3eSwitchElement as o}from"@m3e/web/switch";const c=e({tagName:"m3e-switch",elementClass:o,react:t,events:{onInput:"input",onChange:"change",onClick:"click"}});export{c as M3eSwitch};
7
7
  //# sourceMappingURL=switch.min.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"switch.min.js","sources":["../../src/switch/Switch.ts","../../src/utils/createComponent.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eSwitchElement } from \"@m3e/web/switch\";\r\nexport type { M3eSwitchElement, SwitchIcons } from \"@m3e/web/switch\";\r\n\r\n/**\r\n * React binding for the `m3e-switch` Web Component from `@m3e/web/switch`.\r\n *\r\n * This component renders the underlying `<m3e-switch>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-switch>` instance for imperative access.\r\n *\r\n * See the `m3e-switch` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eSwitch = createComponent({\r\n tagName: \"m3e-switch\",\r\n elementClass: M3eSwitchElement,\r\n react: React,\r\n events: {\r\n onInput: \"input\",\r\n onChange: \"change\",\r\n onClick: \"click\",\r\n },\r\n});\r\n","import { createComponent as createReactComponent, EventName, Options, ReactWebComponent } from \"@lit/react\";\r\n\r\ntype EventNames = Record<string, EventName | string>;\r\n\r\n/**\r\n * Creates an SSR-safe React component for a custom element. Properties are distinguished\r\n * from attributes automatically, and events can be configured so they are added\r\n * to the custom element as event listeners.\r\n *\r\n * @param options An options bag containing the parameters needed to generate a\r\n * wrapped web component.\r\n *\r\n * @param options.react The React module, typically imported from the `react`\r\n * npm package.\r\n * @param options.tagName The custom element tag name registered via\r\n * `customElements.define`.\r\n * @param options.elementClass The custom element class registered via\r\n * `customElements.define`.\r\n * @param options.events An object listing events to which the component can\r\n * listen. The object keys are the event property names passed in via React\r\n * props and the object values are the names of the corresponding events\r\n * generated by the custom element. For example, given `{onactivate:\r\n * 'activate'}` an event function may be passed via the component's `onactivate`\r\n * prop and will be called when the custom element fires its `activate` event.\r\n * @param options.displayName A React component display name, used in debugging\r\n * messages. Default value is inferred from the name of custom element class\r\n * registered via `customElements.define`.\r\n */\r\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\r\nexport function createComponent<I extends HTMLElement, E extends EventNames = {}>({\r\n react,\r\n tagName,\r\n elementClass,\r\n events,\r\n displayName,\r\n}: Options<I, E>): ReactWebComponent<I, E> {\r\n return typeof window !== \"undefined\"\r\n ? createReactComponent<I, E>({ react, tagName, elementClass, events, displayName })\r\n : <ReactWebComponent<I, E>>(<unknown>null);\r\n}\r\n"],"names":["M3eSwitch","react","tagName","elementClass","events","displayName","window","createReactComponent","createComponent","M3eSwitchElement","React","onInput","onChange","onClick"],"mappings":";;;;;wHAmBO,MAAMA,ECUP,UAA4EC,MAChFA,EAAKC,QACLA,EAAOC,aACPA,EAAYC,OACZA,EAAMC,YACNA,IAEA,MAAyB,oBAAXC,OACVC,EAA2B,CAAEN,QAAOC,UAASC,eAAcC,SAAQC,gBAChC,IACzC,CDpByBG,CAAgB,CACvCN,QAAS,aACTC,aAAcM,EACdR,MAAOS,EACPN,OAAQ,CACNO,QAAS,QACTC,SAAU,SACVC,QAAS"}
1
+ {"version":3,"file":"switch.min.js","sources":["../../src/switch/Switch.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eSwitchElement } from \"@m3e/web/switch\";\r\nexport type { M3eSwitchElement, SwitchIcons } from \"@m3e/web/switch\";\r\n\r\n/**\r\n * React binding for the `m3e-switch` Web Component from `@m3e/web/switch`.\r\n *\r\n * This component renders the underlying `<m3e-switch>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-switch>` instance for imperative access.\r\n *\r\n * See the `m3e-switch` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eSwitch = createComponent({\r\n tagName: \"m3e-switch\",\r\n elementClass: M3eSwitchElement,\r\n react: React,\r\n events: {\r\n onInput: \"input\",\r\n onChange: \"change\",\r\n onClick: \"click\",\r\n },\r\n});\r\n"],"names":["M3eSwitch","createComponent","tagName","elementClass","M3eSwitchElement","react","React","events","onInput","onChange","onClick"],"mappings":";;;;;qHAmBO,MAAMA,EAAYC,EAAgB,CACvCC,QAAS,aACTC,aAAcC,EACdC,MAAOC,EACPC,OAAQ,CACNC,QAAS,QACTC,SAAU,SACVC,QAAS"}
package/dist/tabs.js CHANGED
@@ -1,4 +1,3 @@
1
- "use client";
2
1
  /**
3
2
  * @license MIT
4
3
  * Copyright (c) 2025 matraic
@@ -6,40 +5,9 @@
6
5
  */
7
6
 
8
7
  import React from 'react';
9
- import { createComponent as createComponent$1 } from '@lit/react';
8
+ import { createComponent } from '@lit/react';
10
9
  import { M3eTabElement, M3eTabPanelElement, M3eTabsElement } from '@m3e/web/tabs';
11
10
 
12
- /**
13
- * Creates an SSR-safe React component for a custom element. Properties are distinguished
14
- * from attributes automatically, and events can be configured so they are added
15
- * to the custom element as event listeners.
16
- *
17
- * @param options An options bag containing the parameters needed to generate a
18
- * wrapped web component.
19
- *
20
- * @param options.react The React module, typically imported from the `react`
21
- * npm package.
22
- * @param options.tagName The custom element tag name registered via
23
- * `customElements.define`.
24
- * @param options.elementClass The custom element class registered via
25
- * `customElements.define`.
26
- * @param options.events An object listing events to which the component can
27
- * listen. The object keys are the event property names passed in via React
28
- * props and the object values are the names of the corresponding events
29
- * generated by the custom element. For example, given `{onactivate:
30
- * 'activate'}` an event function may be passed via the component's `onactivate`
31
- * prop and will be called when the custom element fires its `activate` event.
32
- * @param options.displayName A React component display name, used in debugging
33
- * messages. Default value is inferred from the name of custom element class
34
- * registered via `customElements.define`.
35
- */
36
- // eslint-disable-next-line @typescript-eslint/no-empty-object-type
37
- function createComponent({ react, tagName, elementClass, events, displayName, }) {
38
- return typeof window !== "undefined"
39
- ? createComponent$1({ react, tagName, elementClass, events, displayName })
40
- : null;
41
- }
42
-
43
11
  /**
44
12
  * React binding for the `m3e-tab` Web Component from `@m3e/web/tabs`.
45
13
  *
package/dist/tabs.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.js","sources":["../../src/utils/createComponent.ts","../../src/tabs/Tab.ts","../../src/tabs/TabPanel.ts","../../src/tabs/Tabs.ts"],"sourcesContent":["import { createComponent as createReactComponent, EventName, Options, ReactWebComponent } from \"@lit/react\";\r\n\r\ntype EventNames = Record<string, EventName | string>;\r\n\r\n/**\r\n * Creates an SSR-safe React component for a custom element. Properties are distinguished\r\n * from attributes automatically, and events can be configured so they are added\r\n * to the custom element as event listeners.\r\n *\r\n * @param options An options bag containing the parameters needed to generate a\r\n * wrapped web component.\r\n *\r\n * @param options.react The React module, typically imported from the `react`\r\n * npm package.\r\n * @param options.tagName The custom element tag name registered via\r\n * `customElements.define`.\r\n * @param options.elementClass The custom element class registered via\r\n * `customElements.define`.\r\n * @param options.events An object listing events to which the component can\r\n * listen. The object keys are the event property names passed in via React\r\n * props and the object values are the names of the corresponding events\r\n * generated by the custom element. For example, given `{onactivate:\r\n * 'activate'}` an event function may be passed via the component's `onactivate`\r\n * prop and will be called when the custom element fires its `activate` event.\r\n * @param options.displayName A React component display name, used in debugging\r\n * messages. Default value is inferred from the name of custom element class\r\n * registered via `customElements.define`.\r\n */\r\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\r\nexport function createComponent<I extends HTMLElement, E extends EventNames = {}>({\r\n react,\r\n tagName,\r\n elementClass,\r\n events,\r\n displayName,\r\n}: Options<I, E>): ReactWebComponent<I, E> {\r\n return typeof window !== \"undefined\"\r\n ? createReactComponent<I, E>({ react, tagName, elementClass, events, displayName })\r\n : <ReactWebComponent<I, E>>(<unknown>null);\r\n}\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eTabElement } from \"@m3e/web/tabs\";\r\nexport type { M3eTabElement } from \"@m3e/web/tabs\";\r\n\r\n/**\r\n * React binding for the `m3e-tab` Web Component from `@m3e/web/tabs`.\r\n *\r\n * This component renders the underlying `<m3e-tab>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-tab>` instance for imperative access.\r\n *\r\n * See the `m3e-tab` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTab = createComponent({\r\n tagName: \"m3e-tab\",\r\n elementClass: M3eTabElement,\r\n react: React,\r\n events: {\r\n onInput: \"input\",\r\n onChange: \"change\",\r\n onClick: \"click\",\r\n },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eTabPanelElement } from \"@m3e/web/tabs\";\r\nexport type { M3eTabPanelElement } from \"@m3e/web/tabs\";\r\n\r\n/**\r\n * React binding for the `m3e-tab-panel` Web Component from `@m3e/web/tabs`.\r\n *\r\n * This component renders the underlying `<m3e-tab-panel>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-tab-panel>` instance for imperative access.\r\n *\r\n * See the `m3e-tab-panel` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTabPanel = createComponent({\r\n tagName: \"m3e-tab-panel\",\r\n elementClass: M3eTabPanelElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eTabsElement } from \"@m3e/web/tabs\";\r\nexport type { M3eTabsElement, TabVariant, TabHeaderPosition } from \"@m3e/web/tabs\";\r\n\r\n/**\r\n * React binding for the `m3e-tabs` Web Component from `@m3e/web/tabs`.\r\n *\r\n * This component renders the underlying `<m3e-tabs>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-tabs>` instance for imperative access.\r\n *\r\n * See the `m3e-tabs` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTabs = createComponent({\r\n tagName: \"m3e-tabs\",\r\n elementClass: M3eTabsElement,\r\n react: React,\r\n events: {\r\n onChange: \"change\",\r\n },\r\n});\r\n"],"names":["createReactComponent"],"mappings":";;;;;;;;;;;AAIA;;;;;;;;;;;;;;;;;;;;;;;AAuBG;AACH;AACM,SAAU,eAAe,CAAmD,EAChF,KAAK,EACL,OAAO,EACP,YAAY,EACZ,MAAM,EACN,WAAW,GACG,EAAA;IACd,OAAO,OAAO,MAAM,KAAK;AACvB,UAAEA,iBAAoB,CAAO,EAAE,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,EAAE,WAAW,EAAE;UAC7C,IAAK;AAC9C;;ACjCA;;;;;;;;;;;;AAYG;AACI,MAAM,MAAM,GAAG,eAAe,CAAC;AACpC,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,YAAY,EAAE,aAAa;AAC3B,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,OAAO,EAAE,OAAO;AAChB,QAAA,QAAQ,EAAE,QAAQ;AAClB,QAAA,OAAO,EAAE,OAAO;AACjB,KAAA;AACF,CAAA;;ACtBD;;;;;;;;;;;;AAYG;AACI,MAAM,WAAW,GAAG,eAAe,CAAC;AACzC,IAAA,OAAO,EAAE,eAAe;AACxB,IAAA,YAAY,EAAE,kBAAkB;AAChC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;AAYG;AACI,MAAM,OAAO,GAAG,eAAe,CAAC;AACrC,IAAA,OAAO,EAAE,UAAU;AACnB,IAAA,YAAY,EAAE,cAAc;AAC5B,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA;AACF,CAAA;;;;"}
1
+ {"version":3,"file":"tabs.js","sources":["../../src/tabs/Tab.ts","../../src/tabs/TabPanel.ts","../../src/tabs/Tabs.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eTabElement } from \"@m3e/web/tabs\";\r\nexport type { M3eTabElement } from \"@m3e/web/tabs\";\r\n\r\n/**\r\n * React binding for the `m3e-tab` Web Component from `@m3e/web/tabs`.\r\n *\r\n * This component renders the underlying `<m3e-tab>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-tab>` instance for imperative access.\r\n *\r\n * See the `m3e-tab` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTab = createComponent({\r\n tagName: \"m3e-tab\",\r\n elementClass: M3eTabElement,\r\n react: React,\r\n events: {\r\n onInput: \"input\",\r\n onChange: \"change\",\r\n onClick: \"click\",\r\n },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eTabPanelElement } from \"@m3e/web/tabs\";\r\nexport type { M3eTabPanelElement } from \"@m3e/web/tabs\";\r\n\r\n/**\r\n * React binding for the `m3e-tab-panel` Web Component from `@m3e/web/tabs`.\r\n *\r\n * This component renders the underlying `<m3e-tab-panel>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-tab-panel>` instance for imperative access.\r\n *\r\n * See the `m3e-tab-panel` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTabPanel = createComponent({\r\n tagName: \"m3e-tab-panel\",\r\n elementClass: M3eTabPanelElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eTabsElement } from \"@m3e/web/tabs\";\r\nexport type { M3eTabsElement, TabVariant, TabHeaderPosition } from \"@m3e/web/tabs\";\r\n\r\n/**\r\n * React binding for the `m3e-tabs` Web Component from `@m3e/web/tabs`.\r\n *\r\n * This component renders the underlying `<m3e-tabs>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-tabs>` instance for imperative access.\r\n *\r\n * See the `m3e-tabs` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTabs = createComponent({\r\n tagName: \"m3e-tabs\",\r\n elementClass: M3eTabsElement,\r\n react: React,\r\n events: {\r\n onChange: \"change\",\r\n },\r\n});\r\n"],"names":[],"mappings":";;;;;;;;;;AAMA;;;;;;;;;;;;AAYG;AACI,MAAM,MAAM,GAAG,eAAe,CAAC;AACpC,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,YAAY,EAAE,aAAa;AAC3B,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,OAAO,EAAE,OAAO;AAChB,QAAA,QAAQ,EAAE,QAAQ;AAClB,QAAA,OAAO,EAAE,OAAO;AACjB,KAAA;AACF,CAAA;;ACtBD;;;;;;;;;;;;AAYG;AACI,MAAM,WAAW,GAAG,eAAe,CAAC;AACzC,IAAA,OAAO,EAAE,eAAe;AACxB,IAAA,YAAY,EAAE,kBAAkB;AAChC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;AAYG;AACI,MAAM,OAAO,GAAG,eAAe,CAAC;AACrC,IAAA,OAAO,EAAE,UAAU;AACnB,IAAA,YAAY,EAAE,cAAc;AAC5B,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA;AACF,CAAA;;;;"}
package/dist/tabs.min.js CHANGED
@@ -1,7 +1,7 @@
1
- "use client";
2
1
  /**
3
2
  * @license MIT
4
3
  * Copyright (c) 2025 matraic
5
4
  * See LICENSE file in the project root for full license text.
6
- */import e from"react";import{createComponent as t}from"@lit/react";import{M3eTabElement as a,M3eTabPanelElement as n,M3eTabsElement as m}from"@m3e/web/tabs";function s({react:e,tagName:a,elementClass:n,events:m,displayName:s}){return"undefined"!=typeof window?t({react:e,tagName:a,elementClass:n,events:m,displayName:s}):null}const l=s({tagName:"m3e-tab",elementClass:a,react:e,events:{onInput:"input",onChange:"change",onClick:"click"}}),o=s({tagName:"m3e-tab-panel",elementClass:n,react:e}),r=s({tagName:"m3e-tabs",elementClass:m,react:e,events:{onChange:"change"}});export{l as M3eTab,o as M3eTabPanel,r as M3eTabs};
5
+ */
6
+ import e from"react";import{createComponent as t}from"@lit/react";import{M3eTabElement as a,M3eTabPanelElement as n,M3eTabsElement as m}from"@m3e/web/tabs";const o=t({tagName:"m3e-tab",elementClass:a,react:e,events:{onInput:"input",onChange:"change",onClick:"click"}}),r=t({tagName:"m3e-tab-panel",elementClass:n,react:e}),c=t({tagName:"m3e-tabs",elementClass:m,react:e,events:{onChange:"change"}});export{o as M3eTab,r as M3eTabPanel,c as M3eTabs};
7
7
  //# sourceMappingURL=tabs.min.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.min.js","sources":["../../src/utils/createComponent.ts","../../src/tabs/Tab.ts","../../src/tabs/TabPanel.ts","../../src/tabs/Tabs.ts"],"sourcesContent":["import { createComponent as createReactComponent, EventName, Options, ReactWebComponent } from \"@lit/react\";\r\n\r\ntype EventNames = Record<string, EventName | string>;\r\n\r\n/**\r\n * Creates an SSR-safe React component for a custom element. Properties are distinguished\r\n * from attributes automatically, and events can be configured so they are added\r\n * to the custom element as event listeners.\r\n *\r\n * @param options An options bag containing the parameters needed to generate a\r\n * wrapped web component.\r\n *\r\n * @param options.react The React module, typically imported from the `react`\r\n * npm package.\r\n * @param options.tagName The custom element tag name registered via\r\n * `customElements.define`.\r\n * @param options.elementClass The custom element class registered via\r\n * `customElements.define`.\r\n * @param options.events An object listing events to which the component can\r\n * listen. The object keys are the event property names passed in via React\r\n * props and the object values are the names of the corresponding events\r\n * generated by the custom element. For example, given `{onactivate:\r\n * 'activate'}` an event function may be passed via the component's `onactivate`\r\n * prop and will be called when the custom element fires its `activate` event.\r\n * @param options.displayName A React component display name, used in debugging\r\n * messages. Default value is inferred from the name of custom element class\r\n * registered via `customElements.define`.\r\n */\r\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\r\nexport function createComponent<I extends HTMLElement, E extends EventNames = {}>({\r\n react,\r\n tagName,\r\n elementClass,\r\n events,\r\n displayName,\r\n}: Options<I, E>): ReactWebComponent<I, E> {\r\n return typeof window !== \"undefined\"\r\n ? createReactComponent<I, E>({ react, tagName, elementClass, events, displayName })\r\n : <ReactWebComponent<I, E>>(<unknown>null);\r\n}\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eTabElement } from \"@m3e/web/tabs\";\r\nexport type { M3eTabElement } from \"@m3e/web/tabs\";\r\n\r\n/**\r\n * React binding for the `m3e-tab` Web Component from `@m3e/web/tabs`.\r\n *\r\n * This component renders the underlying `<m3e-tab>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-tab>` instance for imperative access.\r\n *\r\n * See the `m3e-tab` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTab = createComponent({\r\n tagName: \"m3e-tab\",\r\n elementClass: M3eTabElement,\r\n react: React,\r\n events: {\r\n onInput: \"input\",\r\n onChange: \"change\",\r\n onClick: \"click\",\r\n },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eTabPanelElement } from \"@m3e/web/tabs\";\r\nexport type { M3eTabPanelElement } from \"@m3e/web/tabs\";\r\n\r\n/**\r\n * React binding for the `m3e-tab-panel` Web Component from `@m3e/web/tabs`.\r\n *\r\n * This component renders the underlying `<m3e-tab-panel>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-tab-panel>` instance for imperative access.\r\n *\r\n * See the `m3e-tab-panel` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTabPanel = createComponent({\r\n tagName: \"m3e-tab-panel\",\r\n elementClass: M3eTabPanelElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eTabsElement } from \"@m3e/web/tabs\";\r\nexport type { M3eTabsElement, TabVariant, TabHeaderPosition } from \"@m3e/web/tabs\";\r\n\r\n/**\r\n * React binding for the `m3e-tabs` Web Component from `@m3e/web/tabs`.\r\n *\r\n * This component renders the underlying `<m3e-tabs>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-tabs>` instance for imperative access.\r\n *\r\n * See the `m3e-tabs` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTabs = createComponent({\r\n tagName: \"m3e-tabs\",\r\n elementClass: M3eTabsElement,\r\n react: React,\r\n events: {\r\n onChange: \"change\",\r\n },\r\n});\r\n"],"names":["createComponent","react","tagName","elementClass","events","displayName","window","createReactComponent","M3eTab","M3eTabElement","React","onInput","onChange","onClick","M3eTabPanel","M3eTabPanelElement","M3eTabs","M3eTabsElement"],"mappings":";;;;;+JA6BM,SAAUA,GAAkEC,MAChFA,EAAKC,QACLA,EAAOC,aACPA,EAAYC,OACZA,EAAMC,YACNA,IAEA,MAAyB,oBAAXC,OACVC,EAA2B,CAAEN,QAAOC,UAASC,eAAcC,SAAQC,gBAChC,IACzC,CCpBO,MAAMG,EAASR,EAAgB,CACpCE,QAAS,UACTC,aAAcM,EACdR,MAAOS,EACPN,OAAQ,CACNO,QAAS,QACTC,SAAU,SACVC,QAAS,WCPAC,EAAcd,EAAgB,CACzCE,QAAS,gBACTC,aAAcY,EACdd,MAAOS,ICHIM,EAAUhB,EAAgB,CACrCE,QAAS,WACTC,aAAcc,EACdhB,MAAOS,EACPN,OAAQ,CACNQ,SAAU"}
1
+ {"version":3,"file":"tabs.min.js","sources":["../../src/tabs/Tab.ts","../../src/tabs/TabPanel.ts","../../src/tabs/Tabs.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eTabElement } from \"@m3e/web/tabs\";\r\nexport type { M3eTabElement } from \"@m3e/web/tabs\";\r\n\r\n/**\r\n * React binding for the `m3e-tab` Web Component from `@m3e/web/tabs`.\r\n *\r\n * This component renders the underlying `<m3e-tab>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-tab>` instance for imperative access.\r\n *\r\n * See the `m3e-tab` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTab = createComponent({\r\n tagName: \"m3e-tab\",\r\n elementClass: M3eTabElement,\r\n react: React,\r\n events: {\r\n onInput: \"input\",\r\n onChange: \"change\",\r\n onClick: \"click\",\r\n },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eTabPanelElement } from \"@m3e/web/tabs\";\r\nexport type { M3eTabPanelElement } from \"@m3e/web/tabs\";\r\n\r\n/**\r\n * React binding for the `m3e-tab-panel` Web Component from `@m3e/web/tabs`.\r\n *\r\n * This component renders the underlying `<m3e-tab-panel>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-tab-panel>` instance for imperative access.\r\n *\r\n * See the `m3e-tab-panel` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTabPanel = createComponent({\r\n tagName: \"m3e-tab-panel\",\r\n elementClass: M3eTabPanelElement,\r\n react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eTabsElement } from \"@m3e/web/tabs\";\r\nexport type { M3eTabsElement, TabVariant, TabHeaderPosition } from \"@m3e/web/tabs\";\r\n\r\n/**\r\n * React binding for the `m3e-tabs` Web Component from `@m3e/web/tabs`.\r\n *\r\n * This component renders the underlying `<m3e-tabs>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-tabs>` instance for imperative access.\r\n *\r\n * See the `m3e-tabs` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTabs = createComponent({\r\n tagName: \"m3e-tabs\",\r\n elementClass: M3eTabsElement,\r\n react: React,\r\n events: {\r\n onChange: \"change\",\r\n },\r\n});\r\n"],"names":["M3eTab","createComponent","tagName","elementClass","M3eTabElement","react","React","events","onInput","onChange","onClick","M3eTabPanel","M3eTabPanelElement","M3eTabs","M3eTabsElement"],"mappings":";;;;;4JAmBO,MAAMA,EAASC,EAAgB,CACpCC,QAAS,UACTC,aAAcC,EACdC,MAAOC,EACPC,OAAQ,CACNC,QAAS,QACTC,SAAU,SACVC,QAAS,WCPAC,EAAcV,EAAgB,CACzCC,QAAS,gBACTC,aAAcS,EACdP,MAAOC,ICHIO,EAAUZ,EAAgB,CACrCC,QAAS,WACTC,aAAcW,EACdT,MAAOC,EACPC,OAAQ,CACNE,SAAU"}
@@ -1,4 +1,3 @@
1
- "use client";
2
1
  /**
3
2
  * @license MIT
4
3
  * Copyright (c) 2025 matraic
@@ -6,40 +5,9 @@
6
5
  */
7
6
 
8
7
  import React from 'react';
9
- import { createComponent as createComponent$1 } from '@lit/react';
8
+ import { createComponent } from '@lit/react';
10
9
  import { M3eTextareaAutosizeElement } from '@m3e/web/textarea-autosize';
11
10
 
12
- /**
13
- * Creates an SSR-safe React component for a custom element. Properties are distinguished
14
- * from attributes automatically, and events can be configured so they are added
15
- * to the custom element as event listeners.
16
- *
17
- * @param options An options bag containing the parameters needed to generate a
18
- * wrapped web component.
19
- *
20
- * @param options.react The React module, typically imported from the `react`
21
- * npm package.
22
- * @param options.tagName The custom element tag name registered via
23
- * `customElements.define`.
24
- * @param options.elementClass The custom element class registered via
25
- * `customElements.define`.
26
- * @param options.events An object listing events to which the component can
27
- * listen. The object keys are the event property names passed in via React
28
- * props and the object values are the names of the corresponding events
29
- * generated by the custom element. For example, given `{onactivate:
30
- * 'activate'}` an event function may be passed via the component's `onactivate`
31
- * prop and will be called when the custom element fires its `activate` event.
32
- * @param options.displayName A React component display name, used in debugging
33
- * messages. Default value is inferred from the name of custom element class
34
- * registered via `customElements.define`.
35
- */
36
- // eslint-disable-next-line @typescript-eslint/no-empty-object-type
37
- function createComponent({ react, tagName, elementClass, events, displayName, }) {
38
- return typeof window !== "undefined"
39
- ? createComponent$1({ react, tagName, elementClass, events, displayName })
40
- : null;
41
- }
42
-
43
11
  /**
44
12
  * React binding for the `m3e-textarea-autosize` Web Component from `@m3e/web/textarea-autosize`.
45
13
  *
@@ -1 +1 @@
1
- {"version":3,"file":"textarea-autosize.js","sources":["../../src/utils/createComponent.ts","../../src/textarea-autosize/TextareaAutosize.ts"],"sourcesContent":["import { createComponent as createReactComponent, EventName, Options, ReactWebComponent } from \"@lit/react\";\r\n\r\ntype EventNames = Record<string, EventName | string>;\r\n\r\n/**\r\n * Creates an SSR-safe React component for a custom element. Properties are distinguished\r\n * from attributes automatically, and events can be configured so they are added\r\n * to the custom element as event listeners.\r\n *\r\n * @param options An options bag containing the parameters needed to generate a\r\n * wrapped web component.\r\n *\r\n * @param options.react The React module, typically imported from the `react`\r\n * npm package.\r\n * @param options.tagName The custom element tag name registered via\r\n * `customElements.define`.\r\n * @param options.elementClass The custom element class registered via\r\n * `customElements.define`.\r\n * @param options.events An object listing events to which the component can\r\n * listen. The object keys are the event property names passed in via React\r\n * props and the object values are the names of the corresponding events\r\n * generated by the custom element. For example, given `{onactivate:\r\n * 'activate'}` an event function may be passed via the component's `onactivate`\r\n * prop and will be called when the custom element fires its `activate` event.\r\n * @param options.displayName A React component display name, used in debugging\r\n * messages. Default value is inferred from the name of custom element class\r\n * registered via `customElements.define`.\r\n */\r\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\r\nexport function createComponent<I extends HTMLElement, E extends EventNames = {}>({\r\n react,\r\n tagName,\r\n elementClass,\r\n events,\r\n displayName,\r\n}: Options<I, E>): ReactWebComponent<I, E> {\r\n return typeof window !== \"undefined\"\r\n ? createReactComponent<I, E>({ react, tagName, elementClass, events, displayName })\r\n : <ReactWebComponent<I, E>>(<unknown>null);\r\n}\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eTextareaAutosizeElement } from \"@m3e/web/textarea-autosize\";\r\nexport type { M3eTextareaAutosizeElement } from \"@m3e/web/textarea-autosize\";\r\n\r\n/**\r\n * React binding for the `m3e-textarea-autosize` Web Component from `@m3e/web/textarea-autosize`.\r\n *\r\n * This component renders the underlying `<m3e-textarea-autosize>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-textarea-autosize>` instance for imperative access.\r\n *\r\n * See the `m3e-textarea-autosize` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTextareaAutosize = createComponent({\r\n tagName: \"m3e-textarea-autosize\",\r\n elementClass: M3eTextareaAutosizeElement,\r\n react: React,\r\n});\r\n"],"names":["createReactComponent"],"mappings":";;;;;;;;;;;AAIA;;;;;;;;;;;;;;;;;;;;;;;AAuBG;AACH;AACM,SAAU,eAAe,CAAmD,EAChF,KAAK,EACL,OAAO,EACP,YAAY,EACZ,MAAM,EACN,WAAW,GACG,EAAA;IACd,OAAO,OAAO,MAAM,KAAK;AACvB,UAAEA,iBAAoB,CAAO,EAAE,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,EAAE,WAAW,EAAE;UAC7C,IAAK;AAC9C;;ACjCA;;;;;;;;;;;;AAYG;AACI,MAAM,mBAAmB,GAAG,eAAe,CAAC;AACjD,IAAA,OAAO,EAAE,uBAAuB;AAChC,IAAA,YAAY,EAAE,0BAA0B;AACxC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;;;"}
1
+ {"version":3,"file":"textarea-autosize.js","sources":["../../src/textarea-autosize/TextareaAutosize.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eTextareaAutosizeElement } from \"@m3e/web/textarea-autosize\";\r\nexport type { M3eTextareaAutosizeElement } from \"@m3e/web/textarea-autosize\";\r\n\r\n/**\r\n * React binding for the `m3e-textarea-autosize` Web Component from `@m3e/web/textarea-autosize`.\r\n *\r\n * This component renders the underlying `<m3e-textarea-autosize>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-textarea-autosize>` instance for imperative access.\r\n *\r\n * See the `m3e-textarea-autosize` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTextareaAutosize = createComponent({\r\n tagName: \"m3e-textarea-autosize\",\r\n elementClass: M3eTextareaAutosizeElement,\r\n react: React,\r\n});\r\n"],"names":[],"mappings":";;;;;;;;;;AAMA;;;;;;;;;;;;AAYG;AACI,MAAM,mBAAmB,GAAG,eAAe,CAAC;AACjD,IAAA,OAAO,EAAE,uBAAuB;AAChC,IAAA,YAAY,EAAE,0BAA0B;AACxC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;;;"}
@@ -1,7 +1,7 @@
1
- "use client";
2
1
  /**
3
2
  * @license MIT
4
3
  * Copyright (c) 2025 matraic
5
4
  * See LICENSE file in the project root for full license text.
6
- */import e from"react";import{createComponent as t}from"@lit/react";import{M3eTextareaAutosizeElement as a}from"@m3e/web/textarea-autosize";const m=function({react:e,tagName:a,elementClass:m,events:r,displayName:n}){return"undefined"!=typeof window?t({react:e,tagName:a,elementClass:m,events:r,displayName:n}):null}({tagName:"m3e-textarea-autosize",elementClass:a,react:e});export{m as M3eTextareaAutosize};
5
+ */
6
+ import e from"react";import{createComponent as t}from"@lit/react";import{M3eTextareaAutosizeElement as a}from"@m3e/web/textarea-autosize";const r=t({tagName:"m3e-textarea-autosize",elementClass:a,react:e});export{r as M3eTextareaAutosize};
7
7
  //# sourceMappingURL=textarea-autosize.min.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"textarea-autosize.min.js","sources":["../../src/textarea-autosize/TextareaAutosize.ts","../../src/utils/createComponent.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eTextareaAutosizeElement } from \"@m3e/web/textarea-autosize\";\r\nexport type { M3eTextareaAutosizeElement } from \"@m3e/web/textarea-autosize\";\r\n\r\n/**\r\n * React binding for the `m3e-textarea-autosize` Web Component from `@m3e/web/textarea-autosize`.\r\n *\r\n * This component renders the underlying `<m3e-textarea-autosize>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-textarea-autosize>` instance for imperative access.\r\n *\r\n * See the `m3e-textarea-autosize` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTextareaAutosize = createComponent({\r\n tagName: \"m3e-textarea-autosize\",\r\n elementClass: M3eTextareaAutosizeElement,\r\n react: React,\r\n});\r\n","import { createComponent as createReactComponent, EventName, Options, ReactWebComponent } from \"@lit/react\";\r\n\r\ntype EventNames = Record<string, EventName | string>;\r\n\r\n/**\r\n * Creates an SSR-safe React component for a custom element. Properties are distinguished\r\n * from attributes automatically, and events can be configured so they are added\r\n * to the custom element as event listeners.\r\n *\r\n * @param options An options bag containing the parameters needed to generate a\r\n * wrapped web component.\r\n *\r\n * @param options.react The React module, typically imported from the `react`\r\n * npm package.\r\n * @param options.tagName The custom element tag name registered via\r\n * `customElements.define`.\r\n * @param options.elementClass The custom element class registered via\r\n * `customElements.define`.\r\n * @param options.events An object listing events to which the component can\r\n * listen. The object keys are the event property names passed in via React\r\n * props and the object values are the names of the corresponding events\r\n * generated by the custom element. For example, given `{onactivate:\r\n * 'activate'}` an event function may be passed via the component's `onactivate`\r\n * prop and will be called when the custom element fires its `activate` event.\r\n * @param options.displayName A React component display name, used in debugging\r\n * messages. Default value is inferred from the name of custom element class\r\n * registered via `customElements.define`.\r\n */\r\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\r\nexport function createComponent<I extends HTMLElement, E extends EventNames = {}>({\r\n react,\r\n tagName,\r\n elementClass,\r\n events,\r\n displayName,\r\n}: Options<I, E>): ReactWebComponent<I, E> {\r\n return typeof window !== \"undefined\"\r\n ? createReactComponent<I, E>({ react, tagName, elementClass, events, displayName })\r\n : <ReactWebComponent<I, E>>(<unknown>null);\r\n}\r\n"],"names":["M3eTextareaAutosize","react","tagName","elementClass","events","displayName","window","createReactComponent","createComponent","M3eTextareaAutosizeElement","React"],"mappings":";;;;;6IAmBO,MAAMA,ECUP,UAA4EC,MAChFA,EAAKC,QACLA,EAAOC,aACPA,EAAYC,OACZA,EAAMC,YACNA,IAEA,MAAyB,oBAAXC,OACVC,EAA2B,CAAEN,QAAOC,UAASC,eAAcC,SAAQC,gBAChC,IACzC,CDpBmCG,CAAgB,CACjDN,QAAS,wBACTC,aAAcM,EACdR,MAAOS"}
1
+ {"version":3,"file":"textarea-autosize.min.js","sources":["../../src/textarea-autosize/TextareaAutosize.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eTextareaAutosizeElement } from \"@m3e/web/textarea-autosize\";\r\nexport type { M3eTextareaAutosizeElement } from \"@m3e/web/textarea-autosize\";\r\n\r\n/**\r\n * React binding for the `m3e-textarea-autosize` Web Component from `@m3e/web/textarea-autosize`.\r\n *\r\n * This component renders the underlying `<m3e-textarea-autosize>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-textarea-autosize>` instance for imperative access.\r\n *\r\n * See the `m3e-textarea-autosize` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTextareaAutosize = createComponent({\r\n tagName: \"m3e-textarea-autosize\",\r\n elementClass: M3eTextareaAutosizeElement,\r\n react: React,\r\n});\r\n"],"names":["M3eTextareaAutosize","createComponent","tagName","elementClass","M3eTextareaAutosizeElement","react","React"],"mappings":";;;;;0IAmBO,MAAMA,EAAsBC,EAAgB,CACjDC,QAAS,wBACTC,aAAcC,EACdC,MAAOC"}
package/dist/theme.js CHANGED
@@ -1,4 +1,3 @@
1
- "use client";
2
1
  /**
3
2
  * @license MIT
4
3
  * Copyright (c) 2025 matraic
@@ -6,40 +5,9 @@
6
5
  */
7
6
 
8
7
  import React from 'react';
9
- import { createComponent as createComponent$1 } from '@lit/react';
8
+ import { createComponent } from '@lit/react';
10
9
  import { M3eThemeElement } from '@m3e/web/theme';
11
10
 
12
- /**
13
- * Creates an SSR-safe React component for a custom element. Properties are distinguished
14
- * from attributes automatically, and events can be configured so they are added
15
- * to the custom element as event listeners.
16
- *
17
- * @param options An options bag containing the parameters needed to generate a
18
- * wrapped web component.
19
- *
20
- * @param options.react The React module, typically imported from the `react`
21
- * npm package.
22
- * @param options.tagName The custom element tag name registered via
23
- * `customElements.define`.
24
- * @param options.elementClass The custom element class registered via
25
- * `customElements.define`.
26
- * @param options.events An object listing events to which the component can
27
- * listen. The object keys are the event property names passed in via React
28
- * props and the object values are the names of the corresponding events
29
- * generated by the custom element. For example, given `{onactivate:
30
- * 'activate'}` an event function may be passed via the component's `onactivate`
31
- * prop and will be called when the custom element fires its `activate` event.
32
- * @param options.displayName A React component display name, used in debugging
33
- * messages. Default value is inferred from the name of custom element class
34
- * registered via `customElements.define`.
35
- */
36
- // eslint-disable-next-line @typescript-eslint/no-empty-object-type
37
- function createComponent({ react, tagName, elementClass, events, displayName, }) {
38
- return typeof window !== "undefined"
39
- ? createComponent$1({ react, tagName, elementClass, events, displayName })
40
- : null;
41
- }
42
-
43
11
  /**
44
12
  * React binding for the `m3e-theme` Web Component from `@m3e/web/theme`.
45
13
  *
package/dist/theme.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"theme.js","sources":["../../src/utils/createComponent.ts","../../src/theme/Theme.ts"],"sourcesContent":["import { createComponent as createReactComponent, EventName, Options, ReactWebComponent } from \"@lit/react\";\r\n\r\ntype EventNames = Record<string, EventName | string>;\r\n\r\n/**\r\n * Creates an SSR-safe React component for a custom element. Properties are distinguished\r\n * from attributes automatically, and events can be configured so they are added\r\n * to the custom element as event listeners.\r\n *\r\n * @param options An options bag containing the parameters needed to generate a\r\n * wrapped web component.\r\n *\r\n * @param options.react The React module, typically imported from the `react`\r\n * npm package.\r\n * @param options.tagName The custom element tag name registered via\r\n * `customElements.define`.\r\n * @param options.elementClass The custom element class registered via\r\n * `customElements.define`.\r\n * @param options.events An object listing events to which the component can\r\n * listen. The object keys are the event property names passed in via React\r\n * props and the object values are the names of the corresponding events\r\n * generated by the custom element. For example, given `{onactivate:\r\n * 'activate'}` an event function may be passed via the component's `onactivate`\r\n * prop and will be called when the custom element fires its `activate` event.\r\n * @param options.displayName A React component display name, used in debugging\r\n * messages. Default value is inferred from the name of custom element class\r\n * registered via `customElements.define`.\r\n */\r\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\r\nexport function createComponent<I extends HTMLElement, E extends EventNames = {}>({\r\n react,\r\n tagName,\r\n elementClass,\r\n events,\r\n displayName,\r\n}: Options<I, E>): ReactWebComponent<I, E> {\r\n return typeof window !== \"undefined\"\r\n ? createReactComponent<I, E>({ react, tagName, elementClass, events, displayName })\r\n : <ReactWebComponent<I, E>>(<unknown>null);\r\n}\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eThemeElement } from \"@m3e/web/theme\";\r\nexport type { ColorScheme, ContrastLevel, MotionScheme, M3eThemeElement } from \"@m3e/web/theme\";\r\n\r\n/**\r\n * React binding for the `m3e-theme` Web Component from `@m3e/web/theme`.\r\n *\r\n * This component renders the underlying `<m3e-theme>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-theme>` instance for imperative access.\r\n *\r\n * See the `m3e-theme` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTheme = createComponent({\r\n tagName: \"m3e-theme\",\r\n elementClass: M3eThemeElement,\r\n react: React,\r\n events: {\r\n onChange: \"change\",\r\n },\r\n});\r\n"],"names":["createReactComponent"],"mappings":";;;;;;;;;;;AAIA;;;;;;;;;;;;;;;;;;;;;;;AAuBG;AACH;AACM,SAAU,eAAe,CAAmD,EAChF,KAAK,EACL,OAAO,EACP,YAAY,EACZ,MAAM,EACN,WAAW,GACG,EAAA;IACd,OAAO,OAAO,MAAM,KAAK;AACvB,UAAEA,iBAAoB,CAAO,EAAE,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,EAAE,WAAW,EAAE;UAC7C,IAAK;AAC9C;;ACjCA;;;;;;;;;;;;AAYG;AACI,MAAM,QAAQ,GAAG,eAAe,CAAC;AACtC,IAAA,OAAO,EAAE,WAAW;AACpB,IAAA,YAAY,EAAE,eAAe;AAC7B,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA;AACF,CAAA;;;;"}
1
+ {"version":3,"file":"theme.js","sources":["../../src/theme/Theme.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eThemeElement } from \"@m3e/web/theme\";\r\nexport type { ColorScheme, ContrastLevel, MotionScheme, M3eThemeElement } from \"@m3e/web/theme\";\r\n\r\n/**\r\n * React binding for the `m3e-theme` Web Component from `@m3e/web/theme`.\r\n *\r\n * This component renders the underlying `<m3e-theme>` element and exposes its\r\n * properties, attributes, and events through an idiomatic React interface.\r\n *\r\n * Props map directly to element properties, and event handlers receive the\r\n * native DOM events dispatched by the component. Refs are forwarded to the\r\n * underlying `<m3e-theme>` instance for imperative access.\r\n *\r\n * See the `m3e-theme` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTheme = createComponent({\r\n tagName: \"m3e-theme\",\r\n elementClass: M3eThemeElement,\r\n react: React,\r\n events: {\r\n onChange: \"change\",\r\n },\r\n});\r\n"],"names":[],"mappings":";;;;;;;;;;AAMA;;;;;;;;;;;;AAYG;AACI,MAAM,QAAQ,GAAG,eAAe,CAAC;AACtC,IAAA,OAAO,EAAE,WAAW;AACpB,IAAA,YAAY,EAAE,eAAe;AAC7B,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA;AACF,CAAA;;;;"}
package/dist/theme.min.js CHANGED
@@ -1,7 +1,7 @@
1
- "use client";
2
1
  /**
3
2
  * @license MIT
4
3
  * Copyright (c) 2025 matraic
5
4
  * See LICENSE file in the project root for full license text.
6
- */import e from"react";import{createComponent as t}from"@lit/react";import{M3eThemeElement as a}from"@m3e/web/theme";const n=function({react:e,tagName:a,elementClass:n,events:m,displayName:r}){return"undefined"!=typeof window?t({react:e,tagName:a,elementClass:n,events:m,displayName:r}):null}({tagName:"m3e-theme",elementClass:a,react:e,events:{onChange:"change"}});export{n as M3eTheme};
5
+ */
6
+ import e from"react";import{createComponent as t}from"@lit/react";import{M3eThemeElement as m}from"@m3e/web/theme";const r=t({tagName:"m3e-theme",elementClass:m,react:e,events:{onChange:"change"}});export{r as M3eTheme};
7
7
  //# sourceMappingURL=theme.min.js.map