@m3e/core 1.0.0-rc.1

package/dist/src/shared/mixins/index.d.ts

@@ -0,0 +1,25 @@
+export * from "./AttachInternals";
+export * from "./Checked";
+export * from "./CheckedIndeterminate";
+export * from "./CheckedOrSelected";
+export * from "./ConstraintValidation";
+export * from "./Dirty";
+export * from "./Disabled";
+export * from "./DisabledInteractive";
+export * from "./EventAttribute";
+export * from "./Focusable";
+export * from "./FormAssociated";
+export * from "./FormSubmitter";
+export * from "./hasKeys";
+export * from "./HtmlFor";
+export * from "./KeyboardClick";
+export * from "./Labelled";
+export * from "./LinkButton";
+export * from "./ReadOnly";
+export * from "./Required";
+export * from "./RequiredConstraintValidation";
+export * from "./Role";
+export * from "./Selected";
+export * from "./Touched";
+export * from "./Vertical";
+//# sourceMappingURL=index.d.ts.map

package/dist/src/shared/mixins/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/shared/mixins/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC;AAClC,cAAc,WAAW,CAAC;AAC1B,cAAc,wBAAwB,CAAC;AACvC,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC;AACvC,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,uBAAuB,CAAC;AACtC,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,gCAAgC,CAAC;AAC/C,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC"}

package/dist/src/shared/primitives/CollapsibleElement.d.ts

@@ -0,0 +1,58 @@
+import { CSSResultGroup, LitElement, PropertyValues } from "lit";
+declare const M3eCollapsibleElement_base: import("../mixins/Constructor").Constructor & typeof LitElement;
+/**
+ * A container used to expand and collapse content.
+ *
+ * @example
+ * ```html
+ * <m3e-collapsible>
+ *  <!-- Collapsible content -->
+ * </m3e-collapsible>
+ * ```
+ *
+ * @tag m3e-collapsible
+ *
+ * @slot - Renders the collapsible content.
+ *
+ * @attr open - Whether content is visible.
+ *
+ * @fires opening - Emitted when the collapsible begins to open.
+ * @fires opened - Emitted when the collapsible has opened.
+ * @fires closing - Emitted when the collapsible begins to close.
+ * @fires closed - Emitted when the collapsible has closed.
+ *
+ * @cssprop --m3e-collapsible-animation-duration - The duration of the expand / collapse animation.
+ */
+export declare class M3eCollapsibleElement extends M3eCollapsibleElement_base {
+    #private;
+    /** The styles of the element. */
+    static styles: CSSResultGroup;
+    /**
+     * Whether content is visible.
+     * @default false
+     */
+    open: boolean;
+    /** @inheritdoc */
+    protected update(changedProperties: PropertyValues): void;
+    /** @inheritdoc */
+    protected render(): unknown;
+}
+interface M3eCollapsibleElementEventMap extends HTMLElementEventMap {
+    opening: Event;
+    opened: Event;
+    closing: Event;
+    closed: Event;
+}
+export interface M3eCollapsibleElement {
+    addEventListener<K extends keyof M3eCollapsibleElementEventMap>(type: K, listener: (this: M3eCollapsibleElement, ev: M3eCollapsibleElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof M3eCollapsibleElementEventMap>(type: K, listener: (this: M3eCollapsibleElement, ev: M3eCollapsibleElementEventMap[K]) => void, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "m3e-collapsible": M3eCollapsibleElement;
+    }
+}
+export {};
+//# sourceMappingURL=CollapsibleElement.d.ts.map

package/dist/src/shared/primitives/CollapsibleElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollapsibleElement.d.ts","sourceRoot":"","sources":["../../../../src/shared/primitives/CollapsibleElement.ts"],"names":[],"mappings":"AAEA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAE,cAAc,EAAa,MAAM,KAAK,CAAC;;AAOvF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,qBACa,qBAAsB,SAAQ,0BAM1C;;IACC,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAoCpC;IAKF;;;OAGG;IACyC,IAAI,UAAS;IAEzD,kBAAkB;cACC,MAAM,CAAC,iBAAiB,EAAE,cAAc,GAAG,IAAI;IA0ElE,kBAAkB;cACC,MAAM,IAAI,OAAO;CAuBrC;AAED,UAAU,6BAA8B,SAAQ,mBAAmB;IACjE,OAAO,EAAE,KAAK,CAAC;IACf,MAAM,EAAE,KAAK,CAAC;IACd,OAAO,EAAE,KAAK,CAAC;IACf,MAAM,EAAE,KAAK,CAAC;CACf;AAED,MAAM,WAAW,qBAAqB;IACpC,gBAAgB,CAAC,CAAC,SAAS,MAAM,6BAA6B,EAC5D,IAAI,EAAE,CAAC,EACP,QAAQ,EAAE,CAAC,IAAI,EAAE,qBAAqB,EAAE,EAAE,EAAE,6BAA6B,CAAC,CAAC,CAAC,KAAK,IAAI,EACrF,OAAO,CAAC,EAAE,OAAO,GAAG,uBAAuB,GAC1C,IAAI,CAAC;IAER,gBAAgB,CACd,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,kCAAkC,EAC5C,OAAO,CAAC,EAAE,OAAO,GAAG,uBAAuB,GAC1C,IAAI,CAAC;IAER,mBAAmB,CAAC,CAAC,SAAS,MAAM,6BAA6B,EAC/D,IAAI,EAAE,CAAC,EACP,QAAQ,EAAE,CAAC,IAAI,EAAE,qBAAqB,EAAE,EAAE,EAAE,6BAA6B,CAAC,CAAC,CAAC,KAAK,IAAI,EACrF,OAAO,CAAC,EAAE,OAAO,GAAG,oBAAoB,GACvC,IAAI,CAAC;IAER,mBAAmB,CACjB,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,kCAAkC,EAC5C,OAAO,CAAC,EAAE,OAAO,GAAG,oBAAoB,GACvC,IAAI,CAAC;CACT;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,qBAAqB,CAAC;KAC1C;CACF"}

package/dist/src/shared/primitives/ElevationElement.d.ts

@@ -0,0 +1,88 @@
+import { CSSResultGroup, LitElement, PropertyValues } from "lit";
+import { ElevationLevel } from "./ElevationLevel";
+declare const M3eElevationElement_base: import("../mixins/Constructor").Constructor<import("..").HtmlForMixin> & import("../mixins/Constructor").Constructor & typeof LitElement;
+/**
+ * @summary
+ * Visually depicts elevation using a shadow.
+ *
+ * @description
+ * The `m3e-elevation` component is an absolute positioned element used to depict elevation using a shadow.
+ * The parenting element must be a relative positioned element and allow for overflow. Use the `level` attribute
+ * to specify the elevation level.
+ *
+ * The component can also be attached to another element using the `for` attribute.  When attached, elevation will
+ * be lifted by 1 level on hover. This can be disabled using the `disabled` attribute.
+ *
+ * Alternately, use the `attach` and `detach` methods to programmatically attach and detach this element to another.
+ *
+ * @example
+ * The following example illustrates basic markup. Note how the parenting element's position is `relative`. A parenting
+ * element's position must be `relative` and overflow must be visible.
+ *
+ * ```html
+ * <div style="position: relative;">
+ *  <m3e-elevation level="1"></m3e-elevation>
+ * <div>
+ * ```
+ * @example
+ * The following example illustrates attaching elevation to an interactive element. In this example, the parenting div
+ * is given an `id` referenced by `m3e-elevation` using the `for` attribute.  Note that `#myDiv` is not used when
+ * specifying the attached element's identifier.  The `#` is inferred.
+ *
+ * ```html
+ * <div id="myDiv" style="position: relative;">
+ *  <m3e-elevation for="myDiv" level="1"></m3e-elevation>
+ * <div>
+ * ```
+ *
+ * @tag m3e-elevation
+ *
+ * @attr disabled - Whether hover and press events will not trigger changes in elevation, when attached to an interactive element.
+ * @attr for - The identifier of the interactive control to which this element is attached.
+ * @attr level - The level at which to visually depict elevation.
+ *
+ * @cssprop --m3e-elevation-color - Color used to depict elevation.
+ * @cssprop --m3e-elevation-lift-duration - Duration when lifting.
+ * @cssprop --m3e-elevation-lift-easing - Easing curve when lifting.
+ * @cssprop --m3e-elevation-settle-duration - Duration when settling.
+ * @cssprop --m3e-elevation-settle-easing - Easing curve when settling.
+ * @cssprop --m3e-elevation-level - Elevation when resting (box-shadow).
+ * @cssprop --m3e-elevation-hover-level - Elevation on hover (box-shadow).
+ * @cssprop --m3e-elevation-focus-level - Elevation on focus (box-shadow).
+ * @cssprop --m3e-elevation-pressed-level - Elevation on pressed (box-shadow).
+ */
+export declare class M3eElevationElement extends M3eElevationElement_base {
+    #private;
+    /** The styles of the element. */
+    static styles: CSSResultGroup;
+    private readonly _shadow?;
+    /**
+     * Whether hover and press events will not trigger changes in elevation, when attached to an interactive element.
+     * @default false
+     */
+    disabled: boolean;
+    /**
+     * The level at which to visually depict elevation.
+     * @default null
+     */
+    level: ElevationLevel | null;
+    /** @inheritdoc */
+    attach(control: HTMLElement): void;
+    /** @inheritdoc */
+    detach(): void;
+    /** @inheritdoc */
+    connectedCallback(): void;
+    /** @inheritdoc */
+    disconnectedCallback(): void;
+    /** @inheritdoc */
+    protected updated(_changedProperties: PropertyValues<this>): void;
+    /** @inheritdoc */
+    protected render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "m3e-elevation": M3eElevationElement;
+    }
+}
+export {};
+//# sourceMappingURL=ElevationElement.d.ts.map

package/dist/src/shared/primitives/ElevationElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ElevationElement.d.ts","sourceRoot":"","sources":["../../../../src/shared/primitives/ElevationElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAE,cAAc,EAAa,MAAM,KAAK,CAAC;AAMvF,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;;AAIlD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AACH,qBACa,mBAAoB,SAAQ,wBAAiC;;IACxE,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CA6EpC;IAoBgB,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAc;IAEzD;;;OAGG;IACyC,QAAQ,UAAS;IAE7D;;;OAGG;IACwC,KAAK,EAAE,cAAc,GAAG,IAAI,CAAQ;IAE/E,kBAAkB;IACT,MAAM,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAQ3C,kBAAkB;IACT,MAAM,IAAI,IAAI;IASvB,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAKlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IASrC,kBAAkB;cACC,OAAO,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAW1E,kBAAkB;cACC,MAAM,IAAI,OAAO;CAyBrC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,mBAAmB,CAAC;KACtC;CACF"}

package/dist/src/shared/primitives/ElevationLevel.d.ts

@@ -0,0 +1,3 @@
+/** Specifies the possible levels in which to visually depict elevation. */
+export type ElevationLevel = 0 | 1 | 2 | 3 | 4 | 5;
+//# sourceMappingURL=ElevationLevel.d.ts.map

package/dist/src/shared/primitives/ElevationLevel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ElevationLevel.d.ts","sourceRoot":"","sources":["../../../../src/shared/primitives/ElevationLevel.ts"],"names":[],"mappings":"AAAA,2EAA2E;AAC3E,MAAM,MAAM,cAAc,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC"}

package/dist/src/shared/primitives/ElevationToken.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Component design tokens that control the `M3eElevationElement`.
+ * @internal
+ */
+export declare const ElevationToken: {
+    readonly liftDuration: import("lit").CSSResult;
+    readonly liftEasing: import("lit").CSSResult;
+    readonly settleDuration: import("lit").CSSResult;
+    readonly settleEasing: import("lit").CSSResult;
+    readonly level: import("lit").CSSResult;
+    readonly hoverLevel: import("lit").CSSResult;
+    readonly focusLevel: import("lit").CSSResult;
+    readonly pressedLevel: import("lit").CSSResult;
+};
+//# sourceMappingURL=ElevationToken.d.ts.map

package/dist/src/shared/primitives/ElevationToken.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ElevationToken.d.ts","sourceRoot":"","sources":["../../../../src/shared/primitives/ElevationToken.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,eAAO,MAAM,cAAc;;;;;;;;;CASjB,CAAC"}

package/dist/src/shared/primitives/FocusRingElement.d.ts

@@ -0,0 +1,78 @@
+import { CSSResultGroup, LitElement, PropertyValues } from "lit";
+declare const M3eFocusRingElement_base: import("../mixins/Constructor").Constructor<import("..").HtmlForMixin> & import("../mixins/Constructor").Constructor & typeof LitElement;
+/**
+ * @summary
+ * A focus ring used to depict a strong focus indicator.
+ *
+ * @description
+ * The `m3e-focus-ring` component is an absolute positioned element used to provide a strong focus indicator.
+ * The parenting element must be a relative positioned focusable element and allow for overflow.
+ *
+ * The component can be attached to an interactive element using the `for` attribute or programmatically using the `attach` method.
+ * The focus ring is displayed when the interactive element receives visible focus and hidden when focus is lost.
+ * This can be disabled using the `disabled` attribute.
+ *
+ * Alternately, you can use the `show` and `hide` methods to programmatically control the focus ring.
+ *
+ * @example
+ * The following example illustrates attaching a focus ring to an interactive element. In this example, the parenting div
+ * has relative positioning and is given an `id` referenced by `m3e-focus-ring` using the `for` attribute.  Note that `#myDiv`
+ * is not used when specifying the attached element's identifier.  The `#` is inferred.
+ *
+ * ```html
+ * <div id="myDiv" tabindex="0" style="position: relative;">
+ *  <m3e-focus-ring for="myDiv"></m3e-focus-ring>
+ * <div>
+ * ```
+ *
+ * @tag m3e-focus-ring
+ *
+ * @attr disabled - Whether the focus events will not trigger the focus ring. Focus rings can be still controlled manually by using the `show` and `hide` methods.
+ * @attr inward - Whether the focus ring animates inward instead of outward.
+ *
+ * @cssprop --m3e-focus-ring-color - The color of the focus ring.
+ * @cssprop --m3e-focus-ring-duration - The duration of the focus ring animation.
+ * @cssprop --m3e-focus-ring-growth-factor - The factor by which the focus ring grows.
+ * @cssprop --m3e-focus-ring-thickness - The thickness of the focus ring.
+ * @cssprop --m3e-focus-ring-visibility - The visibility of the focus ring.
+ */
+export declare class M3eFocusRingElement extends M3eFocusRingElement_base {
+    #private;
+    /** The styles of the element. */
+    static styles: CSSResultGroup;
+    /** @private */ private readonly _outline?;
+    /**
+     * Whether the focus ring animates inward instead of outward.
+     * @default false
+     */
+    inward: boolean;
+    /**
+     * Whether the focus events will not trigger the focus ring.
+     * Focus rings can be still controlled manually by using the `show` and `hide` methods.
+     * @default false
+     */
+    disabled: boolean;
+    /** Launches a manual focus ring. */
+    show(): void;
+    /** Hides the focus ring. */
+    hide(): void;
+    /** @inheritdoc */
+    attach(control: HTMLElement): void;
+    /** @inheritdoc */
+    detach(): void;
+    /** @inheritdoc */
+    connectedCallback(): void;
+    /** @inheritdoc */
+    disconnectedCallback(): void;
+    /** @inheritdoc */
+    protected render(): unknown;
+    /** @inheritdoc */
+    protected updated(_changedProperties: PropertyValues<this>): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "m3e-focus-ring": M3eFocusRingElement;
+    }
+}
+export {};
+//# sourceMappingURL=FocusRingElement.d.ts.map

package/dist/src/shared/primitives/FocusRingElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FocusRingElement.d.ts","sourceRoot":"","sources":["../../../../src/shared/primitives/FocusRingElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;;AAQ5E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,qBACa,mBAAoB,SAAQ,wBAAiC;;IACxE,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CA8DpC;IAQF,eAAe,CAAoB,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAc;IAE3E;;;OAGG;IACyC,MAAM,UAAS;IAE3D;;;;OAIG;IACyC,QAAQ,UAAS;IAE7D,oCAAoC;IACpC,IAAI,IAAI,IAAI;IAIZ,4BAA4B;IAC5B,IAAI,IAAI,IAAI;IAIZ,kBAAkB;IACT,MAAM,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAK3C,kBAAkB;IACT,MAAM,IAAI,IAAI;IAOvB,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAKlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAKrC,kBAAkB;cACC,MAAM,IAAI,OAAO;IAIpC,kBAAkB;cACC,OAAO,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;CAkB3E;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,mBAAmB,CAAC;KACvC;CACF"}

package/dist/src/shared/primitives/FocusRingToken.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Component design tokens that control the `M3eFocusRingElement`.
+ * @internal
+ */
+export declare const FocusRingToken: {
+    /** The color of the focus ring. */
+    readonly color: import("lit").CSSResult;
+    /** The duration of the focus ring animation. */
+    readonly duration: import("lit").CSSResult;
+    /** The thickness of the focus ring. */
+    readonly thickness: import("lit").CSSResult;
+    /** The visibility of the focus ring. */
+    readonly visibility: import("lit").CSSResult;
+    /** The factor by which the focus ring grows. */
+    readonly growthFactor: import("lit").CSSResult;
+};
+//# sourceMappingURL=FocusRingToken.d.ts.map

package/dist/src/shared/primitives/FocusRingToken.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FocusRingToken.d.ts","sourceRoot":"","sources":["../../../../src/shared/primitives/FocusRingToken.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,eAAO,MAAM,cAAc;IACzB,mCAAmC;;IAGnC,gDAAgD;;IAGhD,uCAAuC;;IAGvC,wCAAwC;;IAGxC,gDAAgD;;CAExC,CAAC"}

package/dist/src/shared/primitives/PseudoCheckboxElement.d.ts

@@ -0,0 +1,50 @@
+import { CSSResultGroup, LitElement } from "lit";
+declare const M3ePseudoCheckboxElement_base: import("../mixins/Constructor").Constructor<import("..").CheckedIndeterminateMixin> & import("../mixins/Constructor").Constructor<import("..").DisabledMixin> & import("../mixins/Constructor").Constructor & typeof LitElement;
+/**
+ * @summary
+ * An element which looks like a checkbox.
+ *
+ * @description
+ * The `m3e-pseudo-checkbox` component is a pseudo-checkbox supporting checked, indeterminate, and disabled
+ * states. It is customizable via CSS properties for expressive, accessible UI design.
+ *
+ * @example
+ * The following example illustrates how to render a checked pseudo-checkbox.
+ * ```html
+ * <m3e-pseudo-checkbox checked></m3e-pseudo-checkbox>
+ * ```
+ *
+ * @tag m3e-pseudo-checkbox
+ *
+ * @attr checked - A value indicating whether the element is checked.
+ * @attr disabled - A value indicating whether the element is disabled.
+ * @attr indeterminate - A value indicating whether the element's checked state is indeterminate.
+ *
+ * @cssprop --m3e-checkbox-icon-size - Size of the checkbox icon.
+ * @cssprop --m3e-checkbox-container-shape - Border radius of the checkbox container.
+ * @cssprop --m3e-checkbox-unselected-outline-thickness - Outline thickness for unselected state.
+ * @cssprop --m3e-checkbox-unselected-outline-color - Outline color for unselected state.
+ * @cssprop --m3e-checkbox-selected-container-color - Background color for selected state.
+ * @cssprop --m3e-checkbox-selected-icon-color - Icon color for selected state.
+ * @cssprop --m3e-checkbox-unselected-disabled-outline-color - Outline color for unselected disabled state.
+ * @cssprop --m3e-checkbox-unselected-disabled-outline-opacity - Outline opacity for unselected disabled state.
+ * @cssprop --m3e-checkbox-selected-disabled-container-color - Background color for selected disabled state.
+ * @cssprop --m3e-checkbox-selected-disabled-container-opacity - Background opacity for selected disabled state.
+ * @cssprop --m3e-checkbox-selected-disabled-icon-color - Icon color for selected disabled state.
+ * @cssprop --m3e-checkbox-selected-disabled-icon-opacity - Icon opacity for selected disabled state.
+ */
+export declare class M3ePseudoCheckboxElement extends M3ePseudoCheckboxElement_base {
+    /** The styles of the element. */
+    static styles: CSSResultGroup;
+    /** @inheritdoc */
+    connectedCallback(): void;
+    /** @inheritdoc */
+    protected render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "m3e-pseudo-checkbox": M3ePseudoCheckboxElement;
+    }
+}
+export {};
+//# sourceMappingURL=PseudoCheckboxElement.d.ts.map

package/dist/src/shared/primitives/PseudoCheckboxElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PseudoCheckboxElement.d.ts","sourceRoot":"","sources":["../../../../src/shared/primitives/PseudoCheckboxElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAW,MAAM,KAAK,CAAC;;AAMrE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,qBACa,wBAAyB,SAAQ,6BAAwD;IACpG,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CA6CpC;IAEF,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAKlC,kBAAkB;cACC,MAAM,IAAI,OAAO;CAarC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,wBAAwB,CAAC;KACjD;CACF"}

package/dist/src/shared/primitives/PseudoRadioElement.d.ts

@@ -0,0 +1,41 @@
+import { CSSResultGroup, LitElement } from "lit";
+declare const M3ePseudoRadioElement_base: import("../mixins/Constructor").Constructor<import("..").CheckedMixin> & import("../mixins/Constructor").Constructor<import("..").DisabledMixin> & import("../mixins/Constructor").Constructor & typeof LitElement;
+/**
+ * @summary
+ * An element which looks like a radio button.
+ *
+ * @description
+ * The `m3e-pseudo-radio` component is a pseudo-radio supporting checked and disabled
+ * states. It is customizable via CSS properties for expressive, accessible UI design.
+ *
+ * @example
+ * The following example illustrates how to render a checked pseudo-radio.
+ * ```html
+ * <m3e-pseudo-radio checked></m3e-pseudo-radio>
+ * ```
+ *
+ * @tag m3e-pseudo-radio
+ *
+ * @attr checked - A value indicating whether the element is checked.
+ * @attr disabled - A value indicating whether the element is disabled.
+ *
+ * @cssprop --m3e-radio-icon-size - Size of the radio icon.
+ * @cssprop --m3e-radio-unselected-icon-color - Color of the unselected radio icon.
+ * @cssprop --m3e-radio-selected-icon-color - Color of the selected radio icon.
+ * @cssprop --m3e-radio-disabled-icon-color - Color of the disabled radio icon.
+ */
+export declare class M3ePseudoRadioElement extends M3ePseudoRadioElement_base {
+    /** The styles of the element. */
+    static styles: CSSResultGroup;
+    /** @inheritdoc */
+    connectedCallback(): void;
+    /** @inheritdoc */
+    protected render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "m3e-pseudo-radio": M3ePseudoRadioElement;
+    }
+}
+export {};
+//# sourceMappingURL=PseudoRadioElement.d.ts.map

package/dist/src/shared/primitives/PseudoRadioElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PseudoRadioElement.d.ts","sourceRoot":"","sources":["../../../../src/shared/primitives/PseudoRadioElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;;AAM5D;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBACa,qBAAsB,SAAQ,0BAA2C;IACpF,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAwBpC;IAEF,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAKlC,kBAAkB;cACC,MAAM,IAAI,OAAO;CAUrC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kBAAkB,EAAE,qBAAqB,CAAC;KAC3C;CACF"}

package/dist/src/shared/primitives/RippleElement.d.ts

@@ -0,0 +1,110 @@
+import { CSSResultGroup, LitElement, PropertyValues } from "lit";
+declare const M3eRippleElement_base: import("../mixins/Constructor").Constructor<import("..").HtmlForMixin> & import("../mixins/Constructor").Constructor & typeof LitElement;
+/**
+ * @summary
+ * Connects user input to screen reactions using ripples.
+ *
+ * @description
+ * The `m3e-ripple` component is an absolute positioned element used to depict a ripple.
+ * The parenting element must be a relative positioned element.
+ *
+ * The component can be attached to an interactive element using the `for` attribute or programmatically using the `attach` method.
+ * The ripple is displayed when the interactive element is pressed and hidden when released.  This can be disabled using the `disabled` attribute.
+ *
+ * The pressed state actives either using both pointer and keyboard events. For keyboard events, `SPACE` and `ENTER` activate a ripple.
+ * You can disabled whether the `ENTER` key actives a ripple using the `disable-enter` attribute.
+ *
+ * Alternately, you can use the `show` and `hide` methods to programmatically control the ripple.
+ *
+ * @example
+ * The following example illustrates attaching a ripple to an interactive element. In this example, the parenting div
+ * has relative positioning and is given an `id` referenced by `m3e-ripple` using the `for` attribute.  Note that `#myDiv`
+ * is not used when specifying the attached element's identifier.  The `#` is inferred.
+ *
+ * ```html
+ * <div id="myDiv" tabindex="0" style="position: relative;">
+ *  <m3e-ripple for="myDiv"></m3e-ripple>
+ * <div>
+ * ```
+ *
+ * @tag m3e-ripple
+ *
+ * @attr centered - Whether the ripple always originates from the center of the element's bounds, rather than originating from the location of the click event.
+ * @attr disable-enter - Whether the ripple is disabled when the enter key is pressed.
+ * @attr disabled - Whether click events will not trigger the ripple.  Ripples can be still controlled manually by using the `show` and 'hide' methods.
+ * @attr for - The identifier of the interactive control to which this element is attached.
+ * @attr radius - The radius, in pixels, of the ripple.
+ * @attr unbounded - Whether the ripple is visible outside the element's bounds.
+ *
+ * @cssprop --m3e-ripple-color - The color of the ripple.
+ * @cssprop --m3e-ripple-enter-duration - The duration for the enter animation (expansion from point of contact).
+ * @cssprop --m3e-ripple-exit-duration - The duration for the exit animation (fade-out).
+ * @cssprop --m3e-ripple-opacity - The opacity of the ripple.
+ * @cssprop --m3e-ripple-scale-factor - The factor by which to scale the ripple.
+ * @cssprop --m3e-ripple-shape - The shape of the ripple.
+ */
+export declare class M3eRippleElement extends M3eRippleElement_base {
+    #private;
+    /** The styles of the element. */
+    static styles: CSSResultGroup;
+    /**
+     * Whether click events will not trigger the ripple.
+     * Ripples can be still controlled manually by using the `show` and 'hide' methods.
+     * @default false
+     */
+    disabled: boolean;
+    /**
+     * Whether the ripple is disabled when the enter key is pressed.
+     * @default false
+     */
+    disableEnter: boolean;
+    /**
+     * Whether the ripple always originates from the center of the element's bounds, rather
+     * than originating from the location of the click event.
+     * @default false
+     */
+    centered: boolean;
+    /**
+     * Whether the ripple is visible outside the element's bounds.
+     * @default false
+     */
+    unbounded: boolean;
+    /**
+     * The radius, in pixels, of the ripple.
+     * @default null
+     */
+    radius: number | null;
+    /**
+     * The element that triggers the ripple when click events are received.
+     * @default null
+     */
+    trigger: string | HTMLElement | null;
+    /** Whether the ripple is currently visible to the user. */
+    get visible(): boolean;
+    /**
+     * Launches a manual ripple.
+     * @param {number} x The x-coordinate, relative to the viewport, at which to present the ripple.
+     * @param {number} y The y-coordinate, relative to the viewport, at which to present the ripple.
+     * @param {boolean} [persistent=false] Whether the ripple will persist until hidden.
+     */
+    show(x: number, y: number, persistent?: boolean): void;
+    /** Manually hides the ripple. */
+    hide(): void;
+    /** @inheritdoc */
+    attach(control: HTMLElement): void;
+    /** @inheritdoc */
+    detach(): void;
+    /** @inheritdoc */
+    connectedCallback(): void;
+    /** @inheritdoc */
+    disconnectedCallback(): void;
+    /** @inheritdoc */
+    protected updated(_changedProperties: PropertyValues<this>): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "m3e-ripple": M3eRippleElement;
+    }
+}
+export {};
+//# sourceMappingURL=RippleElement.d.ts.map

package/dist/src/shared/primitives/RippleElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RippleElement.d.ts","sourceRoot":"","sources":["../../../../src/shared/primitives/RippleElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;;AAStE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,qBACa,gBAAiB,SAAQ,qBAAiC;;IACrE,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAmEpC;IASF;;;;OAIG;IACyC,QAAQ,UAAS;IAE7D;;;OAGG;IACqE,YAAY,UAAS;IAE7F;;;;OAIG;IACyC,QAAQ,UAAS;IAE7D;;;OAGG;IACyC,SAAS,UAAS;IAE9D;;;OAGG;IACyB,MAAM,EAAE,MAAM,GAAG,IAAI,CAAQ;IAEzD;;;OAGG;IACS,OAAO,EAAE,MAAM,GAAG,WAAW,GAAG,IAAI,CAAQ;IAExD,2DAA2D;IAC3D,IAAI,OAAO,YAEV;IAED;;;;;OAKG;IACH,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,UAAU,GAAE,OAAe,GAAG,IAAI;IAqC7D,iCAAiC;IACjC,IAAI,IAAI,IAAI;IAIZ,kBAAkB;IACT,MAAM,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAK3C,kBAAkB;IACT,MAAM,IAAI,IAAI;IAOvB,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAKlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAKrC,kBAAkB;cACC,OAAO,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;CAiC3E;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,gBAAgB,CAAC;KAChC;CACF"}

package/dist/src/shared/primitives/RippleToken.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Component design tokens that control the `M3eRippleElement`.
+ * @internal
+ */
+export declare const RippleToken: {
+    readonly color: import("lit").CSSResult;
+    readonly opacity: import("lit").CSSResult;
+    readonly enterDuration: import("lit").CSSResult;
+    readonly exitDuration: import("lit").CSSResult;
+    readonly scaleFactor: import("lit").CSSResult;
+};
+//# sourceMappingURL=RippleToken.d.ts.map

package/dist/src/shared/primitives/RippleToken.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RippleToken.d.ts","sourceRoot":"","sources":["../../../../src/shared/primitives/RippleToken.ts"],"names":[],"mappings":"AAIA;;;GAGG;AACH,eAAO,MAAM,WAAW;;;;;;CAMd,CAAC"}

package/dist/src/shared/primitives/ScrollContainerElement.d.ts

@@ -0,0 +1,64 @@
+import { CSSResultGroup, LitElement, PropertyValues } from "lit";
+import { ScrollDividers } from "./ScrollDividers";
+declare const M3eScrollContainerElement_base: import("../mixins/Constructor").Constructor & typeof LitElement;
+/**
+ * @summary
+ * A vertically oriented content container which presents dividers above and below content when scrolled.
+ *
+ * @description
+ * The `m3e-scroll-container` component provides a vertically oriented scrollable container with dynamic
+ * dividers above and below content. Designed according to Material 3 principles, it supports custom scrollbar
+ * thickness, divider styling, and focus ring theming via CSS custom properties.
+ *
+ * @example
+ * This example shows a scrollable container with dividers above and below the content, and thin scrollbars enabled.
+ * ```html
+ * <m3e-scroll-container dividers="above-below" thin>
+ *   <div>Scrollable content goes here</div>
+ * </m3e-scroll-container>
+ * ```
+ *
+ * @tag m3e-scroll-container
+ *
+ * @slot - Renders the scrollable content.
+ *
+ * @attr dividers - The dividers used to separate scrollable content.
+ * @attr thin - Whether to present thin scrollbars.
+ *
+ * @cssprop --m3e-divider-thickness - Thickness of the divider lines above and below content.
+ * @cssprop --m3e-divider-color - Color of the divider lines when visible.
+ * @cssprop --m3e-focus-ring-color - Color of the focus ring outline.
+ * @cssprop --m3e-focus-ring-thickness - Thickness of the focus ring outline.
+ * @cssprop --m3e-focus-ring-factor - Animation factor for focus ring thickness.
+ * @cssprop --m3e-focus-ring-duration - Duration of the focus ring animation.
+ */
+export declare class M3eScrollContainerElement extends M3eScrollContainerElement_base {
+    #private;
+    /** The styles of the element. */
+    static styles: CSSResultGroup;
+    /**
+     * The dividers used to separate scrollable content.
+     * @default "above-below"
+     */
+    dividers: ScrollDividers;
+    /**
+     * Whether to present thin scrollbars.
+     * @default false
+     */
+    thin: boolean;
+    /** @inheritdoc */
+    disconnectedCallback(): void;
+    /** @inheritdoc */
+    protected update(changedProperties: PropertyValues<this>): void;
+    /** @inheritdoc */
+    protected render(): unknown;
+    /** @private */
+    private _updateScroll;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "m3e-scroll-container": M3eScrollContainerElement;
+    }
+}
+export {};
+//# sourceMappingURL=ScrollContainerElement.d.ts.map

package/dist/src/shared/primitives/ScrollContainerElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollContainerElement.d.ts","sourceRoot":"","sources":["../../../../src/shared/primitives/ScrollContainerElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAO5E,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;;AAElD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,qBACa,yBAA0B,SAAQ,8BAAwB;;IACrE,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAmDpC;IAIF;;;OAGG;IACS,QAAQ,EAAE,cAAc,CAAiB;IAErD;;;OAGG;IACyC,IAAI,UAAS;IAEzD,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAKrC,kBAAkB;cACC,MAAM,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAWxE,kBAAkB;cACC,MAAM,IAAI,OAAO;IAIpC,eAAe;IAEf,OAAO,CAAC,aAAa;CAStB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,yBAAyB,CAAC;KACnD;CACF"}

package/dist/src/shared/primitives/ScrollDividers.d.ts

@@ -0,0 +1,3 @@
+/** Specifies the possible dividers used to separate scrollable content. */
+export type ScrollDividers = "above" | "below" | "above-below" | "none";
+//# sourceMappingURL=ScrollDividers.d.ts.map

package/dist/src/shared/primitives/ScrollDividers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollDividers.d.ts","sourceRoot":"","sources":["../../../../src/shared/primitives/ScrollDividers.ts"],"names":[],"mappings":"AAAA,2EAA2E;AAC3E,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,OAAO,GAAG,aAAa,GAAG,MAAM,CAAC"}