@m3e/react 2.0.2 → 2.0.3

package/dist/core.js.map

@@ -1 +1 @@
-{"version":3,"file":"core.js","sources":["../../src/utils/createComponent.ts","../../src/core/Collapsible.ts","../../src/core/Elevation.ts","../../src/core/FocusRing.ts","../../src/core/PseudoCheckbox.ts","../../src/core/PseudoRadio.ts","../../src/core/Ripple.ts","../../src/core/ScrollContainer.ts","../../src/core/Slide.ts","../../src/core/StateLayer.ts","../../src/core/TextHighlight.ts","../../src/core/TextOverflow.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 { M3eCollapsibleElement } from \"@m3e/web/core\";\r\nexport type { M3eCollapsibleElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-collapsible` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-collapsible>` 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-collapsible>` instance for imperative access.\r\n *\r\n * See the `m3e-collapsible` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eCollapsible = createComponent({\r\n  tagName: \"m3e-collapsible\",\r\n  elementClass: M3eCollapsibleElement,\r\n  react: React,\r\n  events: {\r\n    onOpening: \"opening\",\r\n    onOpened: \"opened\",\r\n    onClosing: \"closing\",\r\n    onClosed: \"closed\",\r\n  },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eElevationElement } from \"@m3e/web/core\";\r\nexport type { M3eElevationElement, ElevationLevel } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-elevation` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-elevation>` 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-elevation>` instance for imperative access.\r\n *\r\n * See the `m3e-elevation` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eElevation = createComponent({\r\n  tagName: \"m3e-elevation\",\r\n  elementClass: M3eElevationElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eFocusRingElement } from \"@m3e/web/core\";\r\nexport type { M3eFocusRingElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-focus-ring` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-focus-ring>` 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-focus-ring>` instance for imperative access.\r\n *\r\n * See the `m3e-focus-ring` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eFocusRing = createComponent({\r\n  tagName: \"m3e-focus-ring\",\r\n  elementClass: M3eFocusRingElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3ePseudoCheckboxElement } from \"@m3e/web/core\";\r\nexport type { M3ePseudoCheckboxElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-pseudo-checkbox` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-pseudo-checkbox>` 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-pseudo-checkbox>` instance for imperative access.\r\n *\r\n * See the `m3e-pseudo-checkbox` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3ePseudoCheckbox = createComponent({\r\n  tagName: \"m3e-pseudo-checkbox\",\r\n  elementClass: M3ePseudoCheckboxElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3ePseudoRadioElement } from \"@m3e/web/core\";\r\nexport type { M3ePseudoRadioElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-pseudo-radio` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-pseudo-radio>` 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-pseudo-radio>` instance for imperative access.\r\n *\r\n * See the `m3e-pseudo-radio` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3ePseudoRadio = createComponent({\r\n  tagName: \"m3e-pseudo-radio\",\r\n  elementClass: M3ePseudoRadioElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eRippleElement } from \"@m3e/web/core\";\r\nexport type { M3eRippleElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-ripple` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-ripple>` 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-ripple>` instance for imperative access.\r\n *\r\n * See the `m3e-ripple` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eRipple = createComponent({\r\n  tagName: \"m3e-ripple\",\r\n  elementClass: M3eRippleElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eScrollContainerElement } from \"@m3e/web/core\";\r\nexport type { M3eScrollContainerElement, ScrollDividers } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-scroll-container` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-scroll-container>` 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-scroll-container>` instance for imperative access.\r\n *\r\n * See the `m3e-scroll-container` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eScrollContainer = createComponent({\r\n  tagName: \"m3e-scroll-container\",\r\n  elementClass: M3eScrollContainerElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eSlideElement } from \"@m3e/web/core\";\r\nexport type { M3eSlideElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-slide` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-slide>` 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-slide>` instance for imperative access.\r\n *\r\n * See the `m3e-slide` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eSlide = createComponent({\r\n  tagName: \"m3e-slide\",\r\n  elementClass: M3eSlideElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eStateLayerElement } from \"@m3e/web/core\";\r\nexport type { M3eStateLayerElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-state-layer` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-state-layer>` 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-state-layer>` instance for imperative access.\r\n *\r\n * See the `m3e-state-layer` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStateLayer = createComponent({\r\n  tagName: \"m3e-state-layer\",\r\n  elementClass: M3eStateLayerElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eTextHighlightElement } from \"@m3e/web/core\";\r\nexport type { M3eTextHighlightElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-text-highlight` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-text-highlight>` 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-text-highlight>` instance for imperative access.\r\n *\r\n * See the `m3e-text-highlight` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTextHighlight = createComponent({\r\n  tagName: \"m3e-text-highlight\",\r\n  elementClass: M3eTextHighlightElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eTextOverflowElement } from \"@m3e/web/core\";\r\nexport type { M3eTextOverflowElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-text-overflow` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-text-overflow>` 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-text-overflow>` instance for imperative access.\r\n *\r\n * See the `m3e-text-overflow` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTextOverflow = createComponent({\r\n  tagName: \"m3e-text-overflow\",\r\n  elementClass: M3eTextOverflowElement,\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,cAAc,GAAG,eAAe,CAAC;AAC5C,IAAA,OAAO,EAAE,iBAAiB;AAC1B,IAAA,YAAY,EAAE,qBAAqB;AACnC,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,QAAQ,EAAE,QAAQ;AAClB,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA;AACF,CAAA;;ACvBD;;;;;;;;;;;;AAYG;AACI,MAAM,YAAY,GAAG,eAAe,CAAC;AAC1C,IAAA,OAAO,EAAE,eAAe;AACxB,IAAA,YAAY,EAAE,mBAAmB;AACjC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;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,iBAAiB,GAAG,eAAe,CAAC;AAC/C,IAAA,OAAO,EAAE,qBAAqB;AAC9B,IAAA,YAAY,EAAE,wBAAwB;AACtC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;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,SAAS,GAAG,eAAe,CAAC;AACvC,IAAA,OAAO,EAAE,YAAY;AACrB,IAAA,YAAY,EAAE,gBAAgB;AAC9B,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,QAAQ,GAAG,eAAe,CAAC;AACtC,IAAA,OAAO,EAAE,WAAW;AACpB,IAAA,YAAY,EAAE,eAAe;AAC7B,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;AAYG;AACI,MAAM,aAAa,GAAG,eAAe,CAAC;AAC3C,IAAA,OAAO,EAAE,iBAAiB;AAC1B,IAAA,YAAY,EAAE,oBAAoB;AAClC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;AAYG;AACI,MAAM,gBAAgB,GAAG,eAAe,CAAC;AAC9C,IAAA,OAAO,EAAE,oBAAoB;AAC7B,IAAA,YAAY,EAAE,uBAAuB;AACrC,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;;;;"}
+{"version":3,"file":"core.js","sources":["../../src/core/Collapsible.ts","../../src/core/Elevation.ts","../../src/core/FocusRing.ts","../../src/core/PseudoCheckbox.ts","../../src/core/PseudoRadio.ts","../../src/core/Ripple.ts","../../src/core/ScrollContainer.ts","../../src/core/Slide.ts","../../src/core/StateLayer.ts","../../src/core/TextHighlight.ts","../../src/core/TextOverflow.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eCollapsibleElement } from \"@m3e/web/core\";\r\nexport type { M3eCollapsibleElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-collapsible` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-collapsible>` 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-collapsible>` instance for imperative access.\r\n *\r\n * See the `m3e-collapsible` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eCollapsible = createComponent({\r\n  tagName: \"m3e-collapsible\",\r\n  elementClass: M3eCollapsibleElement,\r\n  react: React,\r\n  events: {\r\n    onOpening: \"opening\",\r\n    onOpened: \"opened\",\r\n    onClosing: \"closing\",\r\n    onClosed: \"closed\",\r\n  },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eElevationElement } from \"@m3e/web/core\";\r\nexport type { M3eElevationElement, ElevationLevel } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-elevation` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-elevation>` 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-elevation>` instance for imperative access.\r\n *\r\n * See the `m3e-elevation` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eElevation = createComponent({\r\n  tagName: \"m3e-elevation\",\r\n  elementClass: M3eElevationElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eFocusRingElement } from \"@m3e/web/core\";\r\nexport type { M3eFocusRingElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-focus-ring` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-focus-ring>` 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-focus-ring>` instance for imperative access.\r\n *\r\n * See the `m3e-focus-ring` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eFocusRing = createComponent({\r\n  tagName: \"m3e-focus-ring\",\r\n  elementClass: M3eFocusRingElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3ePseudoCheckboxElement } from \"@m3e/web/core\";\r\nexport type { M3ePseudoCheckboxElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-pseudo-checkbox` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-pseudo-checkbox>` 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-pseudo-checkbox>` instance for imperative access.\r\n *\r\n * See the `m3e-pseudo-checkbox` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3ePseudoCheckbox = createComponent({\r\n  tagName: \"m3e-pseudo-checkbox\",\r\n  elementClass: M3ePseudoCheckboxElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3ePseudoRadioElement } from \"@m3e/web/core\";\r\nexport type { M3ePseudoRadioElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-pseudo-radio` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-pseudo-radio>` 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-pseudo-radio>` instance for imperative access.\r\n *\r\n * See the `m3e-pseudo-radio` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3ePseudoRadio = createComponent({\r\n  tagName: \"m3e-pseudo-radio\",\r\n  elementClass: M3ePseudoRadioElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eRippleElement } from \"@m3e/web/core\";\r\nexport type { M3eRippleElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-ripple` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-ripple>` 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-ripple>` instance for imperative access.\r\n *\r\n * See the `m3e-ripple` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eRipple = createComponent({\r\n  tagName: \"m3e-ripple\",\r\n  elementClass: M3eRippleElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eScrollContainerElement } from \"@m3e/web/core\";\r\nexport type { M3eScrollContainerElement, ScrollDividers } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-scroll-container` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-scroll-container>` 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-scroll-container>` instance for imperative access.\r\n *\r\n * See the `m3e-scroll-container` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eScrollContainer = createComponent({\r\n  tagName: \"m3e-scroll-container\",\r\n  elementClass: M3eScrollContainerElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eSlideElement } from \"@m3e/web/core\";\r\nexport type { M3eSlideElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-slide` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-slide>` 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-slide>` instance for imperative access.\r\n *\r\n * See the `m3e-slide` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eSlide = createComponent({\r\n  tagName: \"m3e-slide\",\r\n  elementClass: M3eSlideElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eStateLayerElement } from \"@m3e/web/core\";\r\nexport type { M3eStateLayerElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-state-layer` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-state-layer>` 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-state-layer>` instance for imperative access.\r\n *\r\n * See the `m3e-state-layer` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStateLayer = createComponent({\r\n  tagName: \"m3e-state-layer\",\r\n  elementClass: M3eStateLayerElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eTextHighlightElement } from \"@m3e/web/core\";\r\nexport type { M3eTextHighlightElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-text-highlight` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-text-highlight>` 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-text-highlight>` instance for imperative access.\r\n *\r\n * See the `m3e-text-highlight` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTextHighlight = createComponent({\r\n  tagName: \"m3e-text-highlight\",\r\n  elementClass: M3eTextHighlightElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eTextOverflowElement } from \"@m3e/web/core\";\r\nexport type { M3eTextOverflowElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-text-overflow` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-text-overflow>` 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-text-overflow>` instance for imperative access.\r\n *\r\n * See the `m3e-text-overflow` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTextOverflow = createComponent({\r\n  tagName: \"m3e-text-overflow\",\r\n  elementClass: M3eTextOverflowElement,\r\n  react: React,\r\n});\r\n"],"names":[],"mappings":";;;;;;;;;;AAMA;;;;;;;;;;;;AAYG;AACI,MAAM,cAAc,GAAG,eAAe,CAAC;AAC5C,IAAA,OAAO,EAAE,iBAAiB;AAC1B,IAAA,YAAY,EAAE,qBAAqB;AACnC,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,QAAQ,EAAE,QAAQ;AAClB,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA;AACF,CAAA;;ACvBD;;;;;;;;;;;;AAYG;AACI,MAAM,YAAY,GAAG,eAAe,CAAC;AAC1C,IAAA,OAAO,EAAE,eAAe;AACxB,IAAA,YAAY,EAAE,mBAAmB;AACjC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;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,iBAAiB,GAAG,eAAe,CAAC;AAC/C,IAAA,OAAO,EAAE,qBAAqB;AAC9B,IAAA,YAAY,EAAE,wBAAwB;AACtC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;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,SAAS,GAAG,eAAe,CAAC;AACvC,IAAA,OAAO,EAAE,YAAY;AACrB,IAAA,YAAY,EAAE,gBAAgB;AAC9B,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,QAAQ,GAAG,eAAe,CAAC;AACtC,IAAA,OAAO,EAAE,WAAW;AACpB,IAAA,YAAY,EAAE,eAAe;AAC7B,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;AAYG;AACI,MAAM,aAAa,GAAG,eAAe,CAAC;AAC3C,IAAA,OAAO,EAAE,iBAAiB;AAC1B,IAAA,YAAY,EAAE,oBAAoB;AAClC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;AAYG;AACI,MAAM,gBAAgB,GAAG,eAAe,CAAC;AAC9C,IAAA,OAAO,EAAE,oBAAoB;AAC7B,IAAA,YAAY,EAAE,uBAAuB;AACrC,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;;;;"}

package/dist/core.min.js

@@ -1,7 +1,7 @@
-"use client";
 /**
  * @license MIT
  * Copyright (c) 2025 matraic
  * See LICENSE file in the project root for full license text.
- */import e from"react";import{createComponent as a}from"@lit/react";import{M3eCollapsibleElement as t,M3eElevationElement as l,M3eFocusRingElement as m,M3ePseudoCheckboxElement as s,M3ePseudoRadioElement as n,M3eRippleElement as o,M3eScrollContainerElement as r,M3eSlideElement as c,M3eStateLayerElement as i,M3eTextHighlightElement as g,M3eTextOverflowElement as p}from"@m3e/web/core";function C({react:e,tagName:t,elementClass:l,events:m,displayName:s}){return"undefined"!=typeof window?a({react:e,tagName:t,elementClass:l,events:m,displayName:s}):null}const N=C({tagName:"m3e-collapsible",elementClass:t,react:e,events:{onOpening:"opening",onOpened:"opened",onClosing:"closing",onClosed:"closed"}}),d=C({tagName:"m3e-elevation",elementClass:l,react:e}),f=C({tagName:"m3e-focus-ring",elementClass:m,react:e}),u=C({tagName:"m3e-pseudo-checkbox",elementClass:s,react:e}),v=C({tagName:"m3e-pseudo-radio",elementClass:n,react:e}),h=C({tagName:"m3e-ripple",elementClass:o,react:e}),w=C({tagName:"m3e-scroll-container",elementClass:r,react:e}),x=C({tagName:"m3e-slide",elementClass:c,react:e}),y=C({tagName:"m3e-state-layer",elementClass:i,react:e}),b=C({tagName:"m3e-text-highlight",elementClass:g,react:e}),O=C({tagName:"m3e-text-overflow",elementClass:p,react:e});export{N as M3eCollapsible,d as M3eElevation,f as M3eFocusRing,u as M3ePseudoCheckbox,v as M3ePseudoRadio,h as M3eRipple,w as M3eScrollContainer,x as M3eSlide,y as M3eStateLayer,b as M3eTextHighlight,O as M3eTextOverflow};
+ */
+import e from"react";import{createComponent as a}from"@lit/react";import{M3eCollapsibleElement as t,M3eElevationElement as m,M3eFocusRingElement as l,M3ePseudoCheckboxElement as s,M3ePseudoRadioElement as o,M3eRippleElement as n,M3eScrollContainerElement as r,M3eSlideElement as c,M3eStateLayerElement as g,M3eTextHighlightElement as i,M3eTextOverflowElement as p}from"@m3e/web/core";const C=a({tagName:"m3e-collapsible",elementClass:t,react:e,events:{onOpening:"opening",onOpened:"opened",onClosing:"closing",onClosed:"closed"}}),N=a({tagName:"m3e-elevation",elementClass:m,react:e}),d=a({tagName:"m3e-focus-ring",elementClass:l,react:e}),f=a({tagName:"m3e-pseudo-checkbox",elementClass:s,react:e}),h=a({tagName:"m3e-pseudo-radio",elementClass:o,react:e}),x=a({tagName:"m3e-ripple",elementClass:n,react:e}),b=a({tagName:"m3e-scroll-container",elementClass:r,react:e}),u=a({tagName:"m3e-slide",elementClass:c,react:e}),v=a({tagName:"m3e-state-layer",elementClass:g,react:e}),w=a({tagName:"m3e-text-highlight",elementClass:i,react:e}),O=a({tagName:"m3e-text-overflow",elementClass:p,react:e});export{C as M3eCollapsible,N as M3eElevation,d as M3eFocusRing,f as M3ePseudoCheckbox,h as M3ePseudoRadio,x as M3eRipple,b as M3eScrollContainer,u as M3eSlide,v as M3eStateLayer,w as M3eTextHighlight,O as M3eTextOverflow};
 //# sourceMappingURL=core.min.js.map

package/dist/core.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"core.min.js","sources":["../../src/utils/createComponent.ts","../../src/core/Collapsible.ts","../../src/core/Elevation.ts","../../src/core/FocusRing.ts","../../src/core/PseudoCheckbox.ts","../../src/core/PseudoRadio.ts","../../src/core/Ripple.ts","../../src/core/ScrollContainer.ts","../../src/core/Slide.ts","../../src/core/StateLayer.ts","../../src/core/TextHighlight.ts","../../src/core/TextOverflow.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 { M3eCollapsibleElement } from \"@m3e/web/core\";\r\nexport type { M3eCollapsibleElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-collapsible` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-collapsible>` 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-collapsible>` instance for imperative access.\r\n *\r\n * See the `m3e-collapsible` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eCollapsible = createComponent({\r\n  tagName: \"m3e-collapsible\",\r\n  elementClass: M3eCollapsibleElement,\r\n  react: React,\r\n  events: {\r\n    onOpening: \"opening\",\r\n    onOpened: \"opened\",\r\n    onClosing: \"closing\",\r\n    onClosed: \"closed\",\r\n  },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eElevationElement } from \"@m3e/web/core\";\r\nexport type { M3eElevationElement, ElevationLevel } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-elevation` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-elevation>` 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-elevation>` instance for imperative access.\r\n *\r\n * See the `m3e-elevation` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eElevation = createComponent({\r\n  tagName: \"m3e-elevation\",\r\n  elementClass: M3eElevationElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eFocusRingElement } from \"@m3e/web/core\";\r\nexport type { M3eFocusRingElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-focus-ring` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-focus-ring>` 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-focus-ring>` instance for imperative access.\r\n *\r\n * See the `m3e-focus-ring` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eFocusRing = createComponent({\r\n  tagName: \"m3e-focus-ring\",\r\n  elementClass: M3eFocusRingElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3ePseudoCheckboxElement } from \"@m3e/web/core\";\r\nexport type { M3ePseudoCheckboxElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-pseudo-checkbox` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-pseudo-checkbox>` 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-pseudo-checkbox>` instance for imperative access.\r\n *\r\n * See the `m3e-pseudo-checkbox` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3ePseudoCheckbox = createComponent({\r\n  tagName: \"m3e-pseudo-checkbox\",\r\n  elementClass: M3ePseudoCheckboxElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3ePseudoRadioElement } from \"@m3e/web/core\";\r\nexport type { M3ePseudoRadioElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-pseudo-radio` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-pseudo-radio>` 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-pseudo-radio>` instance for imperative access.\r\n *\r\n * See the `m3e-pseudo-radio` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3ePseudoRadio = createComponent({\r\n  tagName: \"m3e-pseudo-radio\",\r\n  elementClass: M3ePseudoRadioElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eRippleElement } from \"@m3e/web/core\";\r\nexport type { M3eRippleElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-ripple` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-ripple>` 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-ripple>` instance for imperative access.\r\n *\r\n * See the `m3e-ripple` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eRipple = createComponent({\r\n  tagName: \"m3e-ripple\",\r\n  elementClass: M3eRippleElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eScrollContainerElement } from \"@m3e/web/core\";\r\nexport type { M3eScrollContainerElement, ScrollDividers } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-scroll-container` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-scroll-container>` 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-scroll-container>` instance for imperative access.\r\n *\r\n * See the `m3e-scroll-container` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eScrollContainer = createComponent({\r\n  tagName: \"m3e-scroll-container\",\r\n  elementClass: M3eScrollContainerElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eSlideElement } from \"@m3e/web/core\";\r\nexport type { M3eSlideElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-slide` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-slide>` 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-slide>` instance for imperative access.\r\n *\r\n * See the `m3e-slide` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eSlide = createComponent({\r\n  tagName: \"m3e-slide\",\r\n  elementClass: M3eSlideElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eStateLayerElement } from \"@m3e/web/core\";\r\nexport type { M3eStateLayerElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-state-layer` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-state-layer>` 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-state-layer>` instance for imperative access.\r\n *\r\n * See the `m3e-state-layer` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStateLayer = createComponent({\r\n  tagName: \"m3e-state-layer\",\r\n  elementClass: M3eStateLayerElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eTextHighlightElement } from \"@m3e/web/core\";\r\nexport type { M3eTextHighlightElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-text-highlight` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-text-highlight>` 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-text-highlight>` instance for imperative access.\r\n *\r\n * See the `m3e-text-highlight` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTextHighlight = createComponent({\r\n  tagName: \"m3e-text-highlight\",\r\n  elementClass: M3eTextHighlightElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eTextOverflowElement } from \"@m3e/web/core\";\r\nexport type { M3eTextOverflowElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-text-overflow` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-text-overflow>` 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-text-overflow>` instance for imperative access.\r\n *\r\n * See the `m3e-text-overflow` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTextOverflow = createComponent({\r\n  tagName: \"m3e-text-overflow\",\r\n  elementClass: M3eTextOverflowElement,\r\n  react: React,\r\n});\r\n"],"names":["createComponent","react","tagName","elementClass","events","displayName","window","createReactComponent","M3eCollapsible","M3eCollapsibleElement","React","onOpening","onOpened","onClosing","onClosed","M3eElevation","M3eElevationElement","M3eFocusRing","M3eFocusRingElement","M3ePseudoCheckbox","M3ePseudoCheckboxElement","M3ePseudoRadio","M3ePseudoRadioElement","M3eRipple","M3eRippleElement","M3eScrollContainer","M3eScrollContainerElement","M3eSlide","M3eSlideElement","M3eStateLayer","M3eStateLayerElement","M3eTextHighlight","M3eTextHighlightElement","M3eTextOverflow","M3eTextOverflowElement"],"mappings":";;;;;mYA6BM,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,EAAiBR,EAAgB,CAC5CE,QAAS,kBACTC,aAAcM,EACdR,MAAOS,EACPN,OAAQ,CACNO,UAAW,UACXC,SAAU,SACVC,UAAW,UACXC,SAAU,YCRDC,EAAef,EAAgB,CAC1CE,QAAS,gBACTC,aAAca,EACdf,MAAOS,ICHIO,EAAejB,EAAgB,CAC1CE,QAAS,iBACTC,aAAce,EACdjB,MAAOS,ICHIS,EAAoBnB,EAAgB,CAC/CE,QAAS,sBACTC,aAAciB,EACdnB,MAAOS,ICHIW,EAAiBrB,EAAgB,CAC5CE,QAAS,mBACTC,aAAcmB,EACdrB,MAAOS,ICHIa,EAAYvB,EAAgB,CACvCE,QAAS,aACTC,aAAcqB,EACdvB,MAAOS,ICHIe,EAAqBzB,EAAgB,CAChDE,QAAS,uBACTC,aAAcuB,EACdzB,MAAOS,ICHIiB,EAAW3B,EAAgB,CACtCE,QAAS,YACTC,aAAcyB,EACd3B,MAAOS,ICHImB,EAAgB7B,EAAgB,CAC3CE,QAAS,kBACTC,aAAc2B,EACd7B,MAAOS,ICHIqB,EAAmB/B,EAAgB,CAC9CE,QAAS,qBACTC,aAAc6B,EACd/B,MAAOS,ICHIuB,EAAkBjC,EAAgB,CAC7CE,QAAS,oBACTC,aAAc+B,EACdjC,MAAOS"}
+{"version":3,"file":"core.min.js","sources":["../../src/core/Collapsible.ts","../../src/core/Elevation.ts","../../src/core/FocusRing.ts","../../src/core/PseudoCheckbox.ts","../../src/core/PseudoRadio.ts","../../src/core/Ripple.ts","../../src/core/ScrollContainer.ts","../../src/core/Slide.ts","../../src/core/StateLayer.ts","../../src/core/TextHighlight.ts","../../src/core/TextOverflow.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eCollapsibleElement } from \"@m3e/web/core\";\r\nexport type { M3eCollapsibleElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-collapsible` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-collapsible>` 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-collapsible>` instance for imperative access.\r\n *\r\n * See the `m3e-collapsible` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eCollapsible = createComponent({\r\n  tagName: \"m3e-collapsible\",\r\n  elementClass: M3eCollapsibleElement,\r\n  react: React,\r\n  events: {\r\n    onOpening: \"opening\",\r\n    onOpened: \"opened\",\r\n    onClosing: \"closing\",\r\n    onClosed: \"closed\",\r\n  },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eElevationElement } from \"@m3e/web/core\";\r\nexport type { M3eElevationElement, ElevationLevel } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-elevation` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-elevation>` 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-elevation>` instance for imperative access.\r\n *\r\n * See the `m3e-elevation` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eElevation = createComponent({\r\n  tagName: \"m3e-elevation\",\r\n  elementClass: M3eElevationElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eFocusRingElement } from \"@m3e/web/core\";\r\nexport type { M3eFocusRingElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-focus-ring` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-focus-ring>` 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-focus-ring>` instance for imperative access.\r\n *\r\n * See the `m3e-focus-ring` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eFocusRing = createComponent({\r\n  tagName: \"m3e-focus-ring\",\r\n  elementClass: M3eFocusRingElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3ePseudoCheckboxElement } from \"@m3e/web/core\";\r\nexport type { M3ePseudoCheckboxElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-pseudo-checkbox` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-pseudo-checkbox>` 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-pseudo-checkbox>` instance for imperative access.\r\n *\r\n * See the `m3e-pseudo-checkbox` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3ePseudoCheckbox = createComponent({\r\n  tagName: \"m3e-pseudo-checkbox\",\r\n  elementClass: M3ePseudoCheckboxElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3ePseudoRadioElement } from \"@m3e/web/core\";\r\nexport type { M3ePseudoRadioElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-pseudo-radio` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-pseudo-radio>` 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-pseudo-radio>` instance for imperative access.\r\n *\r\n * See the `m3e-pseudo-radio` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3ePseudoRadio = createComponent({\r\n  tagName: \"m3e-pseudo-radio\",\r\n  elementClass: M3ePseudoRadioElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eRippleElement } from \"@m3e/web/core\";\r\nexport type { M3eRippleElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-ripple` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-ripple>` 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-ripple>` instance for imperative access.\r\n *\r\n * See the `m3e-ripple` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eRipple = createComponent({\r\n  tagName: \"m3e-ripple\",\r\n  elementClass: M3eRippleElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eScrollContainerElement } from \"@m3e/web/core\";\r\nexport type { M3eScrollContainerElement, ScrollDividers } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-scroll-container` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-scroll-container>` 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-scroll-container>` instance for imperative access.\r\n *\r\n * See the `m3e-scroll-container` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eScrollContainer = createComponent({\r\n  tagName: \"m3e-scroll-container\",\r\n  elementClass: M3eScrollContainerElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eSlideElement } from \"@m3e/web/core\";\r\nexport type { M3eSlideElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-slide` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-slide>` 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-slide>` instance for imperative access.\r\n *\r\n * See the `m3e-slide` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eSlide = createComponent({\r\n  tagName: \"m3e-slide\",\r\n  elementClass: M3eSlideElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eStateLayerElement } from \"@m3e/web/core\";\r\nexport type { M3eStateLayerElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-state-layer` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-state-layer>` 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-state-layer>` instance for imperative access.\r\n *\r\n * See the `m3e-state-layer` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eStateLayer = createComponent({\r\n  tagName: \"m3e-state-layer\",\r\n  elementClass: M3eStateLayerElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eTextHighlightElement } from \"@m3e/web/core\";\r\nexport type { M3eTextHighlightElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-text-highlight` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-text-highlight>` 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-text-highlight>` instance for imperative access.\r\n *\r\n * See the `m3e-text-highlight` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTextHighlight = createComponent({\r\n  tagName: \"m3e-text-highlight\",\r\n  elementClass: M3eTextHighlightElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eTextOverflowElement } from \"@m3e/web/core\";\r\nexport type { M3eTextOverflowElement } from \"@m3e/web/core\";\r\n\r\n/**\r\n * React binding for the `m3e-text-overflow` Web Component from `@m3e/web/web/core`.\r\n *\r\n * This component renders the underlying `<m3e-text-overflow>` 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-text-overflow>` instance for imperative access.\r\n *\r\n * See the `m3e-text-overflow` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eTextOverflow = createComponent({\r\n  tagName: \"m3e-text-overflow\",\r\n  elementClass: M3eTextOverflowElement,\r\n  react: React,\r\n});\r\n"],"names":["M3eCollapsible","createComponent","tagName","elementClass","M3eCollapsibleElement","react","React","events","onOpening","onOpened","onClosing","onClosed","M3eElevation","M3eElevationElement","M3eFocusRing","M3eFocusRingElement","M3ePseudoCheckbox","M3ePseudoCheckboxElement","M3ePseudoRadio","M3ePseudoRadioElement","M3eRipple","M3eRippleElement","M3eScrollContainer","M3eScrollContainerElement","M3eSlide","M3eSlideElement","M3eStateLayer","M3eStateLayerElement","M3eTextHighlight","M3eTextHighlightElement","M3eTextOverflow","M3eTextOverflowElement"],"mappings":";;;;;gYAmBO,MAAMA,EAAiBC,EAAgB,CAC5CC,QAAS,kBACTC,aAAcC,EACdC,MAAOC,EACPC,OAAQ,CACNC,UAAW,UACXC,SAAU,SACVC,UAAW,UACXC,SAAU,YCRDC,EAAeX,EAAgB,CAC1CC,QAAS,gBACTC,aAAcU,EACdR,MAAOC,ICHIQ,EAAeb,EAAgB,CAC1CC,QAAS,iBACTC,aAAcY,EACdV,MAAOC,ICHIU,EAAoBf,EAAgB,CAC/CC,QAAS,sBACTC,aAAcc,EACdZ,MAAOC,ICHIY,EAAiBjB,EAAgB,CAC5CC,QAAS,mBACTC,aAAcgB,EACdd,MAAOC,ICHIc,EAAYnB,EAAgB,CACvCC,QAAS,aACTC,aAAckB,EACdhB,MAAOC,ICHIgB,EAAqBrB,EAAgB,CAChDC,QAAS,uBACTC,aAAcoB,EACdlB,MAAOC,ICHIkB,EAAWvB,EAAgB,CACtCC,QAAS,YACTC,aAAcsB,EACdpB,MAAOC,ICHIoB,EAAgBzB,EAAgB,CAC3CC,QAAS,kBACTC,aAAcwB,EACdtB,MAAOC,ICHIsB,EAAmB3B,EAAgB,CAC9CC,QAAS,qBACTC,aAAc0B,EACdxB,MAAOC,ICHIwB,EAAkB7B,EAAgB,CAC7CC,QAAS,oBACTC,aAAc4B,EACd1B,MAAOC"}

package/dist/dialog.js

@@ -1,4 +1,3 @@
-"use client";
 /**
  * @license MIT
  * Copyright (c) 2025 matraic
@@ -6,40 +5,9 @@
  */
 
 import React from 'react';
-import { createComponent as createComponent$1 } from '@lit/react';
+import { createComponent } from '@lit/react';
 import { M3eDialogElement, M3eDialogActionElement, M3eDialogTriggerElement } from '@m3e/web/dialog';
 
-/**
- * Creates an SSR-safe React component for a custom element. Properties are distinguished
- * from attributes automatically, and events can be configured so they are added
- * to the custom element as event listeners.
- *
- * @param options An options bag containing the parameters needed to generate a
- * wrapped web component.
- *
- * @param options.react The React module, typically imported from the `react`
- * npm package.
- * @param options.tagName The custom element tag name registered via
- * `customElements.define`.
- * @param options.elementClass The custom element class registered via
- * `customElements.define`.
- * @param options.events An object listing events to which the component can
- * listen. The object keys are the event property names passed in via React
- * props and the object values are the names of the corresponding events
- * generated by the custom element. For example, given `{onactivate:
- * 'activate'}` an event function may be passed via the component's `onactivate`
- * prop and will be called when the custom element fires its `activate` event.
- * @param options.displayName A React component display name, used in debugging
- * messages. Default value is inferred from the name of custom element class
- * registered via `customElements.define`.
- */
-// eslint-disable-next-line @typescript-eslint/no-empty-object-type
-function createComponent({ react, tagName, elementClass, events, displayName, }) {
-    return typeof window !== "undefined"
-        ? createComponent$1({ react, tagName, elementClass, events, displayName })
-        : null;
-}
-
 /**
  * React binding for the `m3e-dialog` Web Component from `@m3e/web/dialog`.
  *
@@ -50,7 +18,7 @@ function createComponent({ react, tagName, elementClass, events, displayName, })
  * native DOM events dispatched by the component. Refs are forwarded to the
  * underlying `<m3e-dialog>` instance for imperative access.
  *
- * See the `m3e-dialog` documentation in `@m3e/dialog` for full details on behavior,
+ * See the `m3e-dialog` documentation for full details on behavior,
  * styling, accessibility, and supported events.
  */
 const M3eDialog = createComponent({

package/dist/dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.js","sources":["../../src/utils/createComponent.ts","../../src/dialog/Dialog.ts","../../src/dialog/DialogAction.ts","../../src/dialog/DialogTrigger.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 { M3eDialogElement } from \"@m3e/web/dialog\";\r\nexport type { M3eDialogElement } from \"@m3e/web/dialog\";\r\n\r\n/**\r\n * React binding for the `m3e-dialog` Web Component from `@m3e/web/dialog`.\r\n *\r\n * This component renders the underlying `<m3e-dialog>` 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-dialog>` instance for imperative access.\r\n *\r\n * See the `m3e-dialog` documentation in `@m3e/dialog` for full details on behavior,\r\n * styling, accessibility, and supported events.\r\n */\r\nexport const M3eDialog = createComponent({\r\n  tagName: \"m3e-dialog\",\r\n  elementClass: M3eDialogElement,\r\n  react: React,\r\n  events: {\r\n    onOpening: \"opening\",\r\n    onOpened: \"opened\",\r\n    onClosing: \"closing\",\r\n    onClosed: \"closed\",\r\n    onCancel: \"cancel\",\r\n  },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eDialogActionElement } from \"@m3e/web/dialog\";\r\nexport type { M3eDialogActionElement } from \"@m3e/web/dialog\";\r\n\r\n/**\r\n * React binding for the `m3e-dialog-action` Web Component from `@m3e/web/dialog`.\r\n *\r\n * This component renders the underlying `<m3e-dialog-action>` 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-dialog-action>` instance for imperative access.\r\n *\r\n * See the `m3e-dialog-action` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eDialogAction = createComponent({\r\n  tagName: \"m3e-dialog-action\",\r\n  elementClass: M3eDialogActionElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eDialogTriggerElement } from \"@m3e/web/dialog\";\r\nexport type { M3eDialogTriggerElement } from \"@m3e/web/dialog\";\r\n\r\n/**\r\n * React binding for the `m3e-dialog-trigger` Web Component from `@m3e/web/dialog`.\r\n *\r\n * This component renders the underlying `<m3e-dialog-trigger>` 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-dialog-trigger>` instance for imperative access.\r\n *\r\n * See the `m3e-dialog-trigger` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eDialogTrigger = createComponent({\r\n  tagName: \"m3e-dialog-trigger\",\r\n  elementClass: M3eDialogTriggerElement,\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,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,SAAS,EAAE,SAAS;AACpB,QAAA,QAAQ,EAAE,QAAQ;AAClB,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,QAAQ,EAAE,QAAQ;AAClB,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA;AACF,CAAA;;ACxBD;;;;;;;;;;;;AAYG;AACI,MAAM,eAAe,GAAG,eAAe,CAAC;AAC7C,IAAA,OAAO,EAAE,mBAAmB;AAC5B,IAAA,YAAY,EAAE,sBAAsB;AACpC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;AAYG;AACI,MAAM,gBAAgB,GAAG,eAAe,CAAC;AAC9C,IAAA,OAAO,EAAE,oBAAoB;AAC7B,IAAA,YAAY,EAAE,uBAAuB;AACrC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;;;"}
+{"version":3,"file":"dialog.js","sources":["../../src/dialog/Dialog.ts","../../src/dialog/DialogAction.ts","../../src/dialog/DialogTrigger.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eDialogElement } from \"@m3e/web/dialog\";\r\nexport type { M3eDialogElement } from \"@m3e/web/dialog\";\r\n\r\n/**\r\n * React binding for the `m3e-dialog` Web Component from `@m3e/web/dialog`.\r\n *\r\n * This component renders the underlying `<m3e-dialog>` 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-dialog>` instance for imperative access.\r\n *\r\n * See the `m3e-dialog` documentation for full details on behavior,\r\n * styling, accessibility, and supported events.\r\n */\r\nexport const M3eDialog = createComponent({\r\n  tagName: \"m3e-dialog\",\r\n  elementClass: M3eDialogElement,\r\n  react: React,\r\n  events: {\r\n    onOpening: \"opening\",\r\n    onOpened: \"opened\",\r\n    onClosing: \"closing\",\r\n    onClosed: \"closed\",\r\n    onCancel: \"cancel\",\r\n  },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eDialogActionElement } from \"@m3e/web/dialog\";\r\nexport type { M3eDialogActionElement } from \"@m3e/web/dialog\";\r\n\r\n/**\r\n * React binding for the `m3e-dialog-action` Web Component from `@m3e/web/dialog`.\r\n *\r\n * This component renders the underlying `<m3e-dialog-action>` 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-dialog-action>` instance for imperative access.\r\n *\r\n * See the `m3e-dialog-action` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eDialogAction = createComponent({\r\n  tagName: \"m3e-dialog-action\",\r\n  elementClass: M3eDialogActionElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eDialogTriggerElement } from \"@m3e/web/dialog\";\r\nexport type { M3eDialogTriggerElement } from \"@m3e/web/dialog\";\r\n\r\n/**\r\n * React binding for the `m3e-dialog-trigger` Web Component from `@m3e/web/dialog`.\r\n *\r\n * This component renders the underlying `<m3e-dialog-trigger>` 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-dialog-trigger>` instance for imperative access.\r\n *\r\n * See the `m3e-dialog-trigger` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eDialogTrigger = createComponent({\r\n  tagName: \"m3e-dialog-trigger\",\r\n  elementClass: M3eDialogTriggerElement,\r\n  react: React,\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,SAAS,EAAE,SAAS;AACpB,QAAA,QAAQ,EAAE,QAAQ;AAClB,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,QAAQ,EAAE,QAAQ;AAClB,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA;AACF,CAAA;;ACxBD;;;;;;;;;;;;AAYG;AACI,MAAM,eAAe,GAAG,eAAe,CAAC;AAC7C,IAAA,OAAO,EAAE,mBAAmB;AAC5B,IAAA,YAAY,EAAE,sBAAsB;AACpC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACjBD;;;;;;;;;;;;AAYG;AACI,MAAM,gBAAgB,GAAG,eAAe,CAAC;AAC9C,IAAA,OAAO,EAAE,oBAAoB;AAC7B,IAAA,YAAY,EAAE,uBAAuB;AACrC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;;;"}

package/dist/dialog.min.js

@@ -1,7 +1,7 @@
-"use client";
 /**
  * @license MIT
  * Copyright (c) 2025 matraic
  * See LICENSE file in the project root for full license text.
- */import e from"react";import{createComponent as a}from"@lit/react";import{M3eDialogElement as n,M3eDialogActionElement as t,M3eDialogTriggerElement as o}from"@m3e/web/dialog";function l({react:e,tagName:n,elementClass:t,events:o,displayName:l}){return"undefined"!=typeof window?a({react:e,tagName:n,elementClass:t,events:o,displayName:l}):null}const m=l({tagName:"m3e-dialog",elementClass:n,react:e,events:{onOpening:"opening",onOpened:"opened",onClosing:"closing",onClosed:"closed",onCancel:"cancel"}}),s=l({tagName:"m3e-dialog-action",elementClass:t,react:e}),i=l({tagName:"m3e-dialog-trigger",elementClass:o,react:e});export{m as M3eDialog,s as M3eDialogAction,i as M3eDialogTrigger};
+ */
+import e from"react";import{createComponent as o}from"@lit/react";import{M3eDialogElement as a,M3eDialogActionElement as n,M3eDialogTriggerElement as t}from"@m3e/web/dialog";const l=o({tagName:"m3e-dialog",elementClass:a,react:e,events:{onOpening:"opening",onOpened:"opened",onClosing:"closing",onClosed:"closed",onCancel:"cancel"}}),m=o({tagName:"m3e-dialog-action",elementClass:n,react:e}),i=o({tagName:"m3e-dialog-trigger",elementClass:t,react:e});export{l as M3eDialog,m as M3eDialogAction,i as M3eDialogTrigger};
 //# sourceMappingURL=dialog.min.js.map

package/dist/dialog.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.min.js","sources":["../../src/utils/createComponent.ts","../../src/dialog/Dialog.ts","../../src/dialog/DialogAction.ts","../../src/dialog/DialogTrigger.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 { M3eDialogElement } from \"@m3e/web/dialog\";\r\nexport type { M3eDialogElement } from \"@m3e/web/dialog\";\r\n\r\n/**\r\n * React binding for the `m3e-dialog` Web Component from `@m3e/web/dialog`.\r\n *\r\n * This component renders the underlying `<m3e-dialog>` 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-dialog>` instance for imperative access.\r\n *\r\n * See the `m3e-dialog` documentation in `@m3e/dialog` for full details on behavior,\r\n * styling, accessibility, and supported events.\r\n */\r\nexport const M3eDialog = createComponent({\r\n  tagName: \"m3e-dialog\",\r\n  elementClass: M3eDialogElement,\r\n  react: React,\r\n  events: {\r\n    onOpening: \"opening\",\r\n    onOpened: \"opened\",\r\n    onClosing: \"closing\",\r\n    onClosed: \"closed\",\r\n    onCancel: \"cancel\",\r\n  },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eDialogActionElement } from \"@m3e/web/dialog\";\r\nexport type { M3eDialogActionElement } from \"@m3e/web/dialog\";\r\n\r\n/**\r\n * React binding for the `m3e-dialog-action` Web Component from `@m3e/web/dialog`.\r\n *\r\n * This component renders the underlying `<m3e-dialog-action>` 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-dialog-action>` instance for imperative access.\r\n *\r\n * See the `m3e-dialog-action` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eDialogAction = createComponent({\r\n  tagName: \"m3e-dialog-action\",\r\n  elementClass: M3eDialogActionElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eDialogTriggerElement } from \"@m3e/web/dialog\";\r\nexport type { M3eDialogTriggerElement } from \"@m3e/web/dialog\";\r\n\r\n/**\r\n * React binding for the `m3e-dialog-trigger` Web Component from `@m3e/web/dialog`.\r\n *\r\n * This component renders the underlying `<m3e-dialog-trigger>` 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-dialog-trigger>` instance for imperative access.\r\n *\r\n * See the `m3e-dialog-trigger` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eDialogTrigger = createComponent({\r\n  tagName: \"m3e-dialog-trigger\",\r\n  elementClass: M3eDialogTriggerElement,\r\n  react: React,\r\n});\r\n"],"names":["createComponent","react","tagName","elementClass","events","displayName","window","createReactComponent","M3eDialog","M3eDialogElement","React","onOpening","onOpened","onClosing","onClosed","onCancel","M3eDialogAction","M3eDialogActionElement","M3eDialogTrigger","M3eDialogTriggerElement"],"mappings":";;;;;iLA6BM,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,EAAYR,EAAgB,CACvCE,QAAS,aACTC,aAAcM,EACdR,MAAOS,EACPN,OAAQ,CACNO,UAAW,UACXC,SAAU,SACVC,UAAW,UACXC,SAAU,SACVC,SAAU,YCTDC,EAAkBhB,EAAgB,CAC7CE,QAAS,oBACTC,aAAcc,EACdhB,MAAOS,ICHIQ,EAAmBlB,EAAgB,CAC9CE,QAAS,qBACTC,aAAcgB,EACdlB,MAAOS"}
+{"version":3,"file":"dialog.min.js","sources":["../../src/dialog/Dialog.ts","../../src/dialog/DialogAction.ts","../../src/dialog/DialogTrigger.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eDialogElement } from \"@m3e/web/dialog\";\r\nexport type { M3eDialogElement } from \"@m3e/web/dialog\";\r\n\r\n/**\r\n * React binding for the `m3e-dialog` Web Component from `@m3e/web/dialog`.\r\n *\r\n * This component renders the underlying `<m3e-dialog>` 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-dialog>` instance for imperative access.\r\n *\r\n * See the `m3e-dialog` documentation for full details on behavior,\r\n * styling, accessibility, and supported events.\r\n */\r\nexport const M3eDialog = createComponent({\r\n  tagName: \"m3e-dialog\",\r\n  elementClass: M3eDialogElement,\r\n  react: React,\r\n  events: {\r\n    onOpening: \"opening\",\r\n    onOpened: \"opened\",\r\n    onClosing: \"closing\",\r\n    onClosed: \"closed\",\r\n    onCancel: \"cancel\",\r\n  },\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eDialogActionElement } from \"@m3e/web/dialog\";\r\nexport type { M3eDialogActionElement } from \"@m3e/web/dialog\";\r\n\r\n/**\r\n * React binding for the `m3e-dialog-action` Web Component from `@m3e/web/dialog`.\r\n *\r\n * This component renders the underlying `<m3e-dialog-action>` 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-dialog-action>` instance for imperative access.\r\n *\r\n * See the `m3e-dialog-action` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eDialogAction = createComponent({\r\n  tagName: \"m3e-dialog-action\",\r\n  elementClass: M3eDialogActionElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eDialogTriggerElement } from \"@m3e/web/dialog\";\r\nexport type { M3eDialogTriggerElement } from \"@m3e/web/dialog\";\r\n\r\n/**\r\n * React binding for the `m3e-dialog-trigger` Web Component from `@m3e/web/dialog`.\r\n *\r\n * This component renders the underlying `<m3e-dialog-trigger>` 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-dialog-trigger>` instance for imperative access.\r\n *\r\n * See the `m3e-dialog-trigger` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eDialogTrigger = createComponent({\r\n  tagName: \"m3e-dialog-trigger\",\r\n  elementClass: M3eDialogTriggerElement,\r\n  react: React,\r\n});\r\n"],"names":["M3eDialog","createComponent","tagName","elementClass","M3eDialogElement","react","React","events","onOpening","onOpened","onClosing","onClosed","onCancel","M3eDialogAction","M3eDialogActionElement","M3eDialogTrigger","M3eDialogTriggerElement"],"mappings":";;;;;8KAmBO,MAAMA,EAAYC,EAAgB,CACvCC,QAAS,aACTC,aAAcC,EACdC,MAAOC,EACPC,OAAQ,CACNC,UAAW,UACXC,SAAU,SACVC,UAAW,UACXC,SAAU,SACVC,SAAU,YCTDC,EAAkBZ,EAAgB,CAC7CC,QAAS,oBACTC,aAAcW,EACdT,MAAOC,ICHIS,EAAmBd,EAAgB,CAC9CC,QAAS,qBACTC,aAAca,EACdX,MAAOC"}

package/dist/divider.js

@@ -1,4 +1,3 @@
-"use client";
 /**
  * @license MIT
  * Copyright (c) 2025 matraic
@@ -6,40 +5,9 @@
  */
 
 import React from 'react';
-import { createComponent as createComponent$1 } from '@lit/react';
+import { createComponent } from '@lit/react';
 import { M3eDividerElement } from '@m3e/web/divider';
 
-/**
- * Creates an SSR-safe React component for a custom element. Properties are distinguished
- * from attributes automatically, and events can be configured so they are added
- * to the custom element as event listeners.
- *
- * @param options An options bag containing the parameters needed to generate a
- * wrapped web component.
- *
- * @param options.react The React module, typically imported from the `react`
- * npm package.
- * @param options.tagName The custom element tag name registered via
- * `customElements.define`.
- * @param options.elementClass The custom element class registered via
- * `customElements.define`.
- * @param options.events An object listing events to which the component can
- * listen. The object keys are the event property names passed in via React
- * props and the object values are the names of the corresponding events
- * generated by the custom element. For example, given `{onactivate:
- * 'activate'}` an event function may be passed via the component's `onactivate`
- * prop and will be called when the custom element fires its `activate` event.
- * @param options.displayName A React component display name, used in debugging
- * messages. Default value is inferred from the name of custom element class
- * registered via `customElements.define`.
- */
-// eslint-disable-next-line @typescript-eslint/no-empty-object-type
-function createComponent({ react, tagName, elementClass, events, displayName, }) {
-    return typeof window !== "undefined"
-        ? createComponent$1({ react, tagName, elementClass, events, displayName })
-        : null;
-}
-
 /**
  * React binding for the `m3e-divider` Web Component from `@m3e/web/divider`.
  *
@@ -50,7 +18,7 @@ function createComponent({ react, tagName, elementClass, events, displayName, })
  * native DOM events dispatched by the component. Refs are forwarded to the
  * underlying `<m3e-divider>` instance for imperative access.
  *
- * See the `m3e-divider` documentation in `@m3e/divider` for full details on behavior,
+ * See the `m3e-divider` documentation for full details on behavior,
  * styling, accessibility, and supported events.
  */
 const M3eDivider = createComponent({

package/dist/divider.js.map

@@ -1 +1 @@
-{"version":3,"file":"divider.js","sources":["../../src/utils/createComponent.ts","../../src/divider/Divider.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 { M3eDividerElement } from \"@m3e/web/divider\";\r\nexport type { M3eDividerElement } from \"@m3e/web/divider\";\r\n\r\n/**\r\n * React binding for the `m3e-divider` Web Component from `@m3e/web/divider`.\r\n *\r\n * This component renders the underlying `<m3e-divider>` 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-divider>` instance for imperative access.\r\n *\r\n * See the `m3e-divider` documentation in `@m3e/divider` for full details on behavior,\r\n * styling, accessibility, and supported events.\r\n */\r\nexport const M3eDivider = createComponent({\r\n  tagName: \"m3e-divider\",\r\n  elementClass: M3eDividerElement,\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,UAAU,GAAG,eAAe,CAAC;AACxC,IAAA,OAAO,EAAE,aAAa;AACtB,IAAA,YAAY,EAAE,iBAAiB;AAC/B,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;;;"}
+{"version":3,"file":"divider.js","sources":["../../src/divider/Divider.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eDividerElement } from \"@m3e/web/divider\";\r\nexport type { M3eDividerElement } from \"@m3e/web/divider\";\r\n\r\n/**\r\n * React binding for the `m3e-divider` Web Component from `@m3e/web/divider`.\r\n *\r\n * This component renders the underlying `<m3e-divider>` 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-divider>` instance for imperative access.\r\n *\r\n * See the `m3e-divider` documentation for full details on behavior,\r\n * styling, accessibility, and supported events.\r\n */\r\nexport const M3eDivider = createComponent({\r\n  tagName: \"m3e-divider\",\r\n  elementClass: M3eDividerElement,\r\n  react: React,\r\n});\r\n"],"names":[],"mappings":";;;;;;;;;;AAMA;;;;;;;;;;;;AAYG;AACI,MAAM,UAAU,GAAG,eAAe,CAAC;AACxC,IAAA,OAAO,EAAE,aAAa;AACtB,IAAA,YAAY,EAAE,iBAAiB;AAC/B,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;;;"}

package/dist/divider.min.js

@@ -1,7 +1,7 @@
-"use client";
 /**
  * @license MIT
  * Copyright (c) 2025 matraic
  * See LICENSE file in the project root for full license text.
- */import e from"react";import{createComponent as t}from"@lit/react";import{M3eDividerElement as a}from"@m3e/web/divider";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-divider",elementClass:a,react:e});export{m as M3eDivider};
+ */
+import e from"react";import{createComponent as r}from"@lit/react";import{M3eDividerElement as t}from"@m3e/web/divider";const m=r({tagName:"m3e-divider",elementClass:t,react:e});export{m as M3eDivider};
 //# sourceMappingURL=divider.min.js.map

package/dist/divider.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"divider.min.js","sources":["../../src/divider/Divider.ts","../../src/utils/createComponent.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eDividerElement } from \"@m3e/web/divider\";\r\nexport type { M3eDividerElement } from \"@m3e/web/divider\";\r\n\r\n/**\r\n * React binding for the `m3e-divider` Web Component from `@m3e/web/divider`.\r\n *\r\n * This component renders the underlying `<m3e-divider>` 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-divider>` instance for imperative access.\r\n *\r\n * See the `m3e-divider` documentation in `@m3e/divider` for full details on behavior,\r\n * styling, accessibility, and supported events.\r\n */\r\nexport const M3eDivider = createComponent({\r\n  tagName: \"m3e-divider\",\r\n  elementClass: M3eDividerElement,\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":["M3eDivider","react","tagName","elementClass","events","displayName","window","createReactComponent","createComponent","M3eDividerElement","React"],"mappings":";;;;;0HAmBO,MAAMA,ECUP,UAA4EC,MAChFA,EAAKC,QACLA,EAAOC,aACPA,EAAYC,OACZA,EAAMC,YACNA,IAEA,MAAyB,oBAAXC,OACVC,EAA2B,CAAEN,QAAOC,UAASC,eAAcC,SAAQC,gBAChC,IACzC,CDpB0BG,CAAgB,CACxCN,QAAS,cACTC,aAAcM,EACdR,MAAOS"}
+{"version":3,"file":"divider.min.js","sources":["../../src/divider/Divider.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eDividerElement } from \"@m3e/web/divider\";\r\nexport type { M3eDividerElement } from \"@m3e/web/divider\";\r\n\r\n/**\r\n * React binding for the `m3e-divider` Web Component from `@m3e/web/divider`.\r\n *\r\n * This component renders the underlying `<m3e-divider>` 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-divider>` instance for imperative access.\r\n *\r\n * See the `m3e-divider` documentation for full details on behavior,\r\n * styling, accessibility, and supported events.\r\n */\r\nexport const M3eDivider = createComponent({\r\n  tagName: \"m3e-divider\",\r\n  elementClass: M3eDividerElement,\r\n  react: React,\r\n});\r\n"],"names":["M3eDivider","createComponent","tagName","elementClass","M3eDividerElement","react","React"],"mappings":";;;;;uHAmBO,MAAMA,EAAaC,EAAgB,CACxCC,QAAS,cACTC,aAAcC,EACdC,MAAOC"}

package/dist/drawer-container.js

@@ -1,4 +1,3 @@
-"use client";
 /**
  * @license MIT
  * Copyright (c) 2025 matraic
@@ -6,40 +5,9 @@
  */
 
 import React from 'react';
-import { createComponent as createComponent$1 } from '@lit/react';
+import { createComponent } from '@lit/react';
 import { M3eDrawerContainerElement, M3eDrawerToggleElement } from '@m3e/web/drawer-container';
 
-/**
- * Creates an SSR-safe React component for a custom element. Properties are distinguished
- * from attributes automatically, and events can be configured so they are added
- * to the custom element as event listeners.
- *
- * @param options An options bag containing the parameters needed to generate a
- * wrapped web component.
- *
- * @param options.react The React module, typically imported from the `react`
- * npm package.
- * @param options.tagName The custom element tag name registered via
- * `customElements.define`.
- * @param options.elementClass The custom element class registered via
- * `customElements.define`.
- * @param options.events An object listing events to which the component can
- * listen. The object keys are the event property names passed in via React
- * props and the object values are the names of the corresponding events
- * generated by the custom element. For example, given `{onactivate:
- * 'activate'}` an event function may be passed via the component's `onactivate`
- * prop and will be called when the custom element fires its `activate` event.
- * @param options.displayName A React component display name, used in debugging
- * messages. Default value is inferred from the name of custom element class
- * registered via `customElements.define`.
- */
-// eslint-disable-next-line @typescript-eslint/no-empty-object-type
-function createComponent({ react, tagName, elementClass, events, displayName, }) {
-    return typeof window !== "undefined"
-        ? createComponent$1({ react, tagName, elementClass, events, displayName })
-        : null;
-}
-
 /**
  * React binding for the `m3e-drawer-container` Web Component from `@m3e/web/drawer-container`.
  *
@@ -50,7 +18,7 @@ function createComponent({ react, tagName, elementClass, events, displayName, })
  * native DOM events dispatched by the component. Refs are forwarded to the
  * underlying `<m3e-drawer-container>` instance for imperative access.
  *
- * See the `m3e-drawer-container` documentation in `@m3e/drawer-container` for full details on behavior,
+ * See the `m3e-drawer-container` documentation for full details on behavior,
  * styling, accessibility, and supported events.
  */
 const M3eDrawerContainer = createComponent({

package/dist/drawer-container.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer-container.js","sources":["../../src/utils/createComponent.ts","../../src/drawer-container/DrawerContainer.ts","../../src/drawer-container/DrawerToggle.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 { M3eDrawerContainerElement } from \"@m3e/web/drawer-container\";\r\nexport type { DrawerMode, DrawerPosition, M3eDrawerContainerElement } from \"@m3e/web/drawer-container\";\r\n\r\n/**\r\n * React binding for the `m3e-drawer-container` Web Component from `@m3e/web/drawer-container`.\r\n *\r\n * This component renders the underlying `<m3e-drawer-container>` 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-drawer-container>` instance for imperative access.\r\n *\r\n * See the `m3e-drawer-container` documentation in `@m3e/drawer-container` for full details on behavior,\r\n * styling, accessibility, and supported events.\r\n */\r\nexport const M3eDrawerContainer = createComponent({\r\n  tagName: \"m3e-drawer-container\",\r\n  elementClass: M3eDrawerContainerElement,\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 { M3eDrawerToggleElement } from \"@m3e/web/drawer-container\";\r\nexport type { M3eDrawerToggleElement } from \"@m3e/web/drawer-container\";\r\n\r\n/**\r\n * React binding for the `m3e-drawer-toggle` Web Component from `@m3e/web/drawer-container`.\r\n *\r\n * This component renders the underlying `<m3e-drawer-toggle>` 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-drawer-toggle>` instance for imperative access.\r\n *\r\n * See the `m3e-drawer-toggle` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eDrawerToggle = createComponent({\r\n  tagName: \"m3e-drawer-toggle\",\r\n  elementClass: M3eDrawerToggleElement,\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,kBAAkB,GAAG,eAAe,CAAC;AAChD,IAAA,OAAO,EAAE,sBAAsB;AAC/B,IAAA,YAAY,EAAE,yBAAyB;AACvC,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA;AACF,CAAA;;ACpBD;;;;;;;;;;;;AAYG;AACI,MAAM,eAAe,GAAG,eAAe,CAAC;AAC7C,IAAA,OAAO,EAAE,mBAAmB;AAC5B,IAAA,YAAY,EAAE,sBAAsB;AACpC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;;;"}
+{"version":3,"file":"drawer-container.js","sources":["../../src/drawer-container/DrawerContainer.ts","../../src/drawer-container/DrawerToggle.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eDrawerContainerElement } from \"@m3e/web/drawer-container\";\r\nexport type { DrawerMode, DrawerPosition, M3eDrawerContainerElement } from \"@m3e/web/drawer-container\";\r\n\r\n/**\r\n * React binding for the `m3e-drawer-container` Web Component from `@m3e/web/drawer-container`.\r\n *\r\n * This component renders the underlying `<m3e-drawer-container>` 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-drawer-container>` instance for imperative access.\r\n *\r\n * See the `m3e-drawer-container` documentation for full details on behavior,\r\n * styling, accessibility, and supported events.\r\n */\r\nexport const M3eDrawerContainer = createComponent({\r\n  tagName: \"m3e-drawer-container\",\r\n  elementClass: M3eDrawerContainerElement,\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 { M3eDrawerToggleElement } from \"@m3e/web/drawer-container\";\r\nexport type { M3eDrawerToggleElement } from \"@m3e/web/drawer-container\";\r\n\r\n/**\r\n * React binding for the `m3e-drawer-toggle` Web Component from `@m3e/web/drawer-container`.\r\n *\r\n * This component renders the underlying `<m3e-drawer-toggle>` 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-drawer-toggle>` instance for imperative access.\r\n *\r\n * See the `m3e-drawer-toggle` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eDrawerToggle = createComponent({\r\n  tagName: \"m3e-drawer-toggle\",\r\n  elementClass: M3eDrawerToggleElement,\r\n  react: React,\r\n});\r\n"],"names":[],"mappings":";;;;;;;;;;AAMA;;;;;;;;;;;;AAYG;AACI,MAAM,kBAAkB,GAAG,eAAe,CAAC;AAChD,IAAA,OAAO,EAAE,sBAAsB;AAC/B,IAAA,YAAY,EAAE,yBAAyB;AACvC,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA;AACF,CAAA;;ACpBD;;;;;;;;;;;;AAYG;AACI,MAAM,eAAe,GAAG,eAAe,CAAC;AAC7C,IAAA,OAAO,EAAE,mBAAmB;AAC5B,IAAA,YAAY,EAAE,sBAAsB;AACpC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;;;"}

package/dist/drawer-container.min.js

@@ -1,7 +1,7 @@
-"use client";
 /**
  * @license MIT
  * Copyright (c) 2025 matraic
  * See LICENSE file in the project root for full license text.
- */import e from"react";import{createComponent as t}from"@lit/react";import{M3eDrawerContainerElement as a,M3eDrawerToggleElement as n}from"@m3e/web/drawer-container";function r({react:e,tagName:a,elementClass:n,events:r,displayName:m}){return"undefined"!=typeof window?t({react:e,tagName:a,elementClass:n,events:r,displayName:m}):null}const m=r({tagName:"m3e-drawer-container",elementClass:a,react:e,events:{onChange:"change"}}),o=r({tagName:"m3e-drawer-toggle",elementClass:n,react:e});export{m as M3eDrawerContainer,o as M3eDrawerToggle};
+ */
+import e from"react";import{createComponent as r}from"@lit/react";import{M3eDrawerContainerElement as t,M3eDrawerToggleElement as a}from"@m3e/web/drawer-container";const m=r({tagName:"m3e-drawer-container",elementClass:t,react:e,events:{onChange:"change"}}),o=r({tagName:"m3e-drawer-toggle",elementClass:a,react:e});export{m as M3eDrawerContainer,o as M3eDrawerToggle};
 //# sourceMappingURL=drawer-container.min.js.map

package/dist/drawer-container.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer-container.min.js","sources":["../../src/utils/createComponent.ts","../../src/drawer-container/DrawerContainer.ts","../../src/drawer-container/DrawerToggle.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 { M3eDrawerContainerElement } from \"@m3e/web/drawer-container\";\r\nexport type { DrawerMode, DrawerPosition, M3eDrawerContainerElement } from \"@m3e/web/drawer-container\";\r\n\r\n/**\r\n * React binding for the `m3e-drawer-container` Web Component from `@m3e/web/drawer-container`.\r\n *\r\n * This component renders the underlying `<m3e-drawer-container>` 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-drawer-container>` instance for imperative access.\r\n *\r\n * See the `m3e-drawer-container` documentation in `@m3e/drawer-container` for full details on behavior,\r\n * styling, accessibility, and supported events.\r\n */\r\nexport const M3eDrawerContainer = createComponent({\r\n  tagName: \"m3e-drawer-container\",\r\n  elementClass: M3eDrawerContainerElement,\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 { M3eDrawerToggleElement } from \"@m3e/web/drawer-container\";\r\nexport type { M3eDrawerToggleElement } from \"@m3e/web/drawer-container\";\r\n\r\n/**\r\n * React binding for the `m3e-drawer-toggle` Web Component from `@m3e/web/drawer-container`.\r\n *\r\n * This component renders the underlying `<m3e-drawer-toggle>` 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-drawer-toggle>` instance for imperative access.\r\n *\r\n * See the `m3e-drawer-toggle` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eDrawerToggle = createComponent({\r\n  tagName: \"m3e-drawer-toggle\",\r\n  elementClass: M3eDrawerToggleElement,\r\n  react: React,\r\n});\r\n"],"names":["createComponent","react","tagName","elementClass","events","displayName","window","createReactComponent","M3eDrawerContainer","M3eDrawerContainerElement","React","onChange","M3eDrawerToggle","M3eDrawerToggleElement"],"mappings":";;;;;uKA6BM,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,EAAqBR,EAAgB,CAChDE,QAAS,uBACTC,aAAcM,EACdR,MAAOS,EACPN,OAAQ,CACNO,SAAU,YCLDC,EAAkBZ,EAAgB,CAC7CE,QAAS,oBACTC,aAAcU,EACdZ,MAAOS"}
+{"version":3,"file":"drawer-container.min.js","sources":["../../src/drawer-container/DrawerContainer.ts","../../src/drawer-container/DrawerToggle.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eDrawerContainerElement } from \"@m3e/web/drawer-container\";\r\nexport type { DrawerMode, DrawerPosition, M3eDrawerContainerElement } from \"@m3e/web/drawer-container\";\r\n\r\n/**\r\n * React binding for the `m3e-drawer-container` Web Component from `@m3e/web/drawer-container`.\r\n *\r\n * This component renders the underlying `<m3e-drawer-container>` 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-drawer-container>` instance for imperative access.\r\n *\r\n * See the `m3e-drawer-container` documentation for full details on behavior,\r\n * styling, accessibility, and supported events.\r\n */\r\nexport const M3eDrawerContainer = createComponent({\r\n  tagName: \"m3e-drawer-container\",\r\n  elementClass: M3eDrawerContainerElement,\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 { M3eDrawerToggleElement } from \"@m3e/web/drawer-container\";\r\nexport type { M3eDrawerToggleElement } from \"@m3e/web/drawer-container\";\r\n\r\n/**\r\n * React binding for the `m3e-drawer-toggle` Web Component from `@m3e/web/drawer-container`.\r\n *\r\n * This component renders the underlying `<m3e-drawer-toggle>` 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-drawer-toggle>` instance for imperative access.\r\n *\r\n * See the `m3e-drawer-toggle` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eDrawerToggle = createComponent({\r\n  tagName: \"m3e-drawer-toggle\",\r\n  elementClass: M3eDrawerToggleElement,\r\n  react: React,\r\n});\r\n"],"names":["M3eDrawerContainer","createComponent","tagName","elementClass","M3eDrawerContainerElement","react","React","events","onChange","M3eDrawerToggle","M3eDrawerToggleElement"],"mappings":";;;;;oKAmBO,MAAMA,EAAqBC,EAAgB,CAChDC,QAAS,uBACTC,aAAcC,EACdC,MAAOC,EACPC,OAAQ,CACNC,SAAU,YCLDC,EAAkBR,EAAgB,CAC7CC,QAAS,oBACTC,aAAcO,EACdL,MAAOC"}

package/dist/expansion-panel.js

@@ -1,4 +1,3 @@
-"use client";
 /**
  * @license MIT
  * Copyright (c) 2025 matraic
@@ -6,40 +5,9 @@
  */
 
 import React from 'react';
-import { createComponent as createComponent$1 } from '@lit/react';
+import { createComponent } from '@lit/react';
 import { M3eAccordionElement, M3eExpansionPanelElement } from '@m3e/web/expansion-panel';
 
-/**
- * Creates an SSR-safe React component for a custom element. Properties are distinguished
- * from attributes automatically, and events can be configured so they are added
- * to the custom element as event listeners.
- *
- * @param options An options bag containing the parameters needed to generate a
- * wrapped web component.
- *
- * @param options.react The React module, typically imported from the `react`
- * npm package.
- * @param options.tagName The custom element tag name registered via
- * `customElements.define`.
- * @param options.elementClass The custom element class registered via
- * `customElements.define`.
- * @param options.events An object listing events to which the component can
- * listen. The object keys are the event property names passed in via React
- * props and the object values are the names of the corresponding events
- * generated by the custom element. For example, given `{onactivate:
- * 'activate'}` an event function may be passed via the component's `onactivate`
- * prop and will be called when the custom element fires its `activate` event.
- * @param options.displayName A React component display name, used in debugging
- * messages. Default value is inferred from the name of custom element class
- * registered via `customElements.define`.
- */
-// eslint-disable-next-line @typescript-eslint/no-empty-object-type
-function createComponent({ react, tagName, elementClass, events, displayName, }) {
-    return typeof window !== "undefined"
-        ? createComponent$1({ react, tagName, elementClass, events, displayName })
-        : null;
-}
-
 /**
  * React binding for the `m3e-accordion` Web Component from `@m3e/web/expansion-panel`.
  *

package/dist/expansion-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"expansion-panel.js","sources":["../../src/utils/createComponent.ts","../../src/expansion-panel/Accordion.ts","../../src/expansion-panel/ExpansionPanel.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 { M3eAccordionElement } from \"@m3e/web/expansion-panel\";\r\nexport type { M3eAccordionElement } from \"@m3e/web/expansion-panel\";\r\n\r\n/**\r\n * React binding for the `m3e-accordion` Web Component from `@m3e/web/expansion-panel`.\r\n *\r\n * This component renders the underlying `<m3e-accordion>` 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-accordion>` instance for imperative access.\r\n *\r\n * See the `m3e-accordion` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eAccordion = createComponent({\r\n  tagName: \"m3e-accordion\",\r\n  elementClass: M3eAccordionElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"../utils\";\r\n\r\nimport { M3eExpansionPanelElement } from \"@m3e/web/expansion-panel\";\r\nexport type {\r\n  ExpansionToggleDirection,\r\n  ExpansionTogglePosition,\r\n  M3eExpansionPanelElement,\r\n} from \"@m3e/web/expansion-panel\";\r\n\r\n/**\r\n * React binding for the `m3e-expansion-panel` Web Component from `@m3e/web/expansion-panel`.\r\n *\r\n * This component renders the underlying `<m3e-expansion-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-expansion-panel>` instance for imperative access.\r\n *\r\n * See the `m3e-expansion-panel` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eExpansionPanel = createComponent({\r\n  tagName: \"m3e-expansion-panel\",\r\n  elementClass: M3eExpansionPanelElement,\r\n  react: React,\r\n  events: {\r\n    onOpening: \"opening\",\r\n    onOpened: \"opened\",\r\n    onClosing: \"closing\",\r\n    onClosed: \"closed\",\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,YAAY,GAAG,eAAe,CAAC;AAC1C,IAAA,OAAO,EAAE,eAAe;AACxB,IAAA,YAAY,EAAE,mBAAmB;AACjC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACbD;;;;;;;;;;;;AAYG;AACI,MAAM,iBAAiB,GAAG,eAAe,CAAC;AAC/C,IAAA,OAAO,EAAE,qBAAqB;AAC9B,IAAA,YAAY,EAAE,wBAAwB;AACtC,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,QAAQ,EAAE,QAAQ;AAClB,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA;AACF,CAAA;;;;"}
+{"version":3,"file":"expansion-panel.js","sources":["../../src/expansion-panel/Accordion.ts","../../src/expansion-panel/ExpansionPanel.ts"],"sourcesContent":["import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eAccordionElement } from \"@m3e/web/expansion-panel\";\r\nexport type { M3eAccordionElement } from \"@m3e/web/expansion-panel\";\r\n\r\n/**\r\n * React binding for the `m3e-accordion` Web Component from `@m3e/web/expansion-panel`.\r\n *\r\n * This component renders the underlying `<m3e-accordion>` 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-accordion>` instance for imperative access.\r\n *\r\n * See the `m3e-accordion` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eAccordion = createComponent({\r\n  tagName: \"m3e-accordion\",\r\n  elementClass: M3eAccordionElement,\r\n  react: React,\r\n});\r\n","import React from \"react\";\r\nimport { createComponent } from \"@lit/react\";\r\n\r\nimport { M3eExpansionPanelElement } from \"@m3e/web/expansion-panel\";\r\nexport type {\r\n  ExpansionToggleDirection,\r\n  ExpansionTogglePosition,\r\n  M3eExpansionPanelElement,\r\n} from \"@m3e/web/expansion-panel\";\r\n\r\n/**\r\n * React binding for the `m3e-expansion-panel` Web Component from `@m3e/web/expansion-panel`.\r\n *\r\n * This component renders the underlying `<m3e-expansion-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-expansion-panel>` instance for imperative access.\r\n *\r\n * See the `m3e-expansion-panel` documentation for full details on behavior, styling,\r\n * accessibility, and supported events.\r\n */\r\nexport const M3eExpansionPanel = createComponent({\r\n  tagName: \"m3e-expansion-panel\",\r\n  elementClass: M3eExpansionPanelElement,\r\n  react: React,\r\n  events: {\r\n    onOpening: \"opening\",\r\n    onOpened: \"opened\",\r\n    onClosing: \"closing\",\r\n    onClosed: \"closed\",\r\n  },\r\n});\r\n"],"names":[],"mappings":";;;;;;;;;;AAMA;;;;;;;;;;;;AAYG;AACI,MAAM,YAAY,GAAG,eAAe,CAAC;AAC1C,IAAA,OAAO,EAAE,eAAe;AACxB,IAAA,YAAY,EAAE,mBAAmB;AACjC,IAAA,KAAK,EAAE,KAAK;AACb,CAAA;;ACbD;;;;;;;;;;;;AAYG;AACI,MAAM,iBAAiB,GAAG,eAAe,CAAC;AAC/C,IAAA,OAAO,EAAE,qBAAqB;AAC9B,IAAA,YAAY,EAAE,wBAAwB;AACtC,IAAA,KAAK,EAAE,KAAK;AACZ,IAAA,MAAM,EAAE;AACN,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,QAAQ,EAAE,QAAQ;AAClB,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA;AACF,CAAA;;;;"}

package/dist/expansion-panel.min.js

@@ -1,7 +1,7 @@
-"use client";
 /**
  * @license MIT
  * Copyright (c) 2025 matraic
  * See LICENSE file in the project root for full license text.
- */import e from"react";import{createComponent as n}from"@lit/react";import{M3eAccordionElement as a,M3eExpansionPanelElement as t}from"@m3e/web/expansion-panel";function o({react:e,tagName:a,elementClass:t,events:o,displayName:s}){return"undefined"!=typeof window?n({react:e,tagName:a,elementClass:t,events:o,displayName:s}):null}const s=o({tagName:"m3e-accordion",elementClass:a,react:e}),l=o({tagName:"m3e-expansion-panel",elementClass:t,react:e,events:{onOpening:"opening",onOpened:"opened",onClosing:"closing",onClosed:"closed"}});export{s as M3eAccordion,l as M3eExpansionPanel};
+ */
+import e from"react";import{createComponent as n}from"@lit/react";import{M3eAccordionElement as o,M3eExpansionPanelElement as a}from"@m3e/web/expansion-panel";const t=n({tagName:"m3e-accordion",elementClass:o,react:e}),m=n({tagName:"m3e-expansion-panel",elementClass:a,react:e,events:{onOpening:"opening",onOpened:"opened",onClosing:"closing",onClosed:"closed"}});export{t as M3eAccordion,m as M3eExpansionPanel};
 //# sourceMappingURL=expansion-panel.min.js.map