@reapit/elements 5.0.0-beta.62 → 5.0.0-beta.64

package/dist/types/utils/line-clamp/__tests__/use-is-truncated.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=use-is-truncated.test.d.ts.map

package/dist/types/utils/line-clamp/__tests__/use-is-truncated.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-is-truncated.test.d.ts","sourceRoot":"/","sources":["utils/line-clamp/__tests__/use-is-truncated.test.tsx"],"names":[],"mappings":""}

package/dist/types/utils/line-clamp/index.d.ts

@@ -0,0 +1,3 @@
+export * from './line-clamp';
+export * from './styles';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/utils/line-clamp/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"/","sources":["utils/line-clamp/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA;AAC5B,cAAc,UAAU,CAAA"}

package/dist/types/utils/line-clamp/is-height-truncated.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Determines whether the element's content is truncated.
+ *
+ * @param truncationTargetElement - The DOM element to check for text truncation
+ * @returns `true` if the element's content is overflowing vertically, `false` otherwise
+ */
+export declare function isHeightTruncated(truncationTargetElement: HTMLElement | null): boolean;
+//# sourceMappingURL=is-height-truncated.d.ts.map

package/dist/types/utils/line-clamp/is-height-truncated.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"is-height-truncated.d.ts","sourceRoot":"/","sources":["utils/line-clamp/is-height-truncated.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,uBAAuB,EAAE,WAAW,GAAG,IAAI,GAAG,OAAO,CAQtF"}

package/dist/types/utils/line-clamp/line-clamp.d.ts

@@ -0,0 +1,23 @@
+import type { ElementType, HTMLAttributes, ReactNode } from 'react';
+export declare namespace LineClamp {
+    interface Props extends HTMLAttributes<HTMLElement> {
+        /** The element to render as. Defaults to `<p>` */
+        as?: ElementType;
+        /** The textual content to clamp. */
+        children: ReactNode;
+        /** The number of lines that should be visible */
+        clampTo: number | 'none';
+    }
+}
+/**
+ * A utility component that allows limiting the contents of a block to a specified number of lines.
+ * It provides a "show more" button to visually disclose the truncated text. When disclosed, a
+ * "show less" button is available to visually hide the text again. The truncation is only visual,
+ * meaning screen readers will still read the full text.
+ *
+ * If the contents of a block should be clamped, but does not need to be visually disclosed,
+ * use the [line-clamp](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/line-clamp)
+ * CSS property instead of this component.
+ */
+export declare function LineClamp({ as: Element, children, clampTo, ...rest }: LineClamp.Props): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=line-clamp.d.ts.map

package/dist/types/utils/line-clamp/line-clamp.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"line-clamp.d.ts","sourceRoot":"/","sources":["utils/line-clamp/line-clamp.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAiB,WAAW,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAElF,yBAAiB,SAAS,CAAC;IACzB,UAAiB,KAAM,SAAQ,cAAc,CAAC,WAAW,CAAC;QACxD,kDAAkD;QAClD,EAAE,CAAC,EAAE,WAAW,CAAA;QAChB,oCAAoC;QACpC,QAAQ,EAAE,SAAS,CAAA;QACnB,iDAAiD;QACjD,OAAO,EAAE,MAAM,GAAG,MAAM,CAAA;KACzB;CACF;AAED;;;;;;;;;GASG;AACH,wBAAgB,SAAS,CAAC,EAAE,EAAE,EAAE,OAAa,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,EAAE,SAAS,CAAC,KAAK,2CA+C3F"}

package/dist/types/utils/line-clamp/line-clamp.stories.d.ts

@@ -0,0 +1,12 @@
+import { LineClamp } from './line-clamp';
+import type { Meta, StoryObj } from '@storybook/react-vite';
+declare const meta: Meta<typeof LineClamp>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Example: Story;
+/**
+ * The disclosure button will show and hide dynamically if a change in the element's size, content
+ * or `clampTo` prop causes the content to overflow.
+ */
+export declare const Dynamic: Story;
+//# sourceMappingURL=line-clamp.stories.d.ts.map

package/dist/types/utils/line-clamp/line-clamp.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"line-clamp.stories.d.ts","sourceRoot":"/","sources":["utils/line-clamp/line-clamp.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAIxC,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAE3D,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CAQhC,CAAA;AAED,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAarB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,OAAO,EAAE,KAwCrB,CAAA"}

package/dist/types/utils/line-clamp/styles.d.ts

@@ -0,0 +1,3 @@
+export declare const elLineClampText: import("@linaria/core").LinariaClassName;
+export declare const elLineClampDisclosureButton: import("@linaria/core").LinariaClassName;
+//# sourceMappingURL=styles.d.ts.map

package/dist/types/utils/line-clamp/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"/","sources":["utils/line-clamp/styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,eAAe,0CAqB3B,CAAA;AAED,eAAO,MAAM,2BAA2B,0CAWvC,CAAA"}

package/dist/types/utils/line-clamp/use-is-truncated.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Determines if the element with the given ID is truncated. Accepts dependencies for
+ * re-calculating whether the element's content is truncated.
+ */
+export declare function useIsHeightTruncated(truncationTargetId: string, dependencies?: unknown[]): boolean;
+//# sourceMappingURL=use-is-truncated.d.ts.map

package/dist/types/utils/line-clamp/use-is-truncated.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-is-truncated.d.ts","sourceRoot":"/","sources":["utils/line-clamp/use-is-truncated.ts"],"names":[],"mappings":"AAGA;;;GAGG;AACH,wBAAgB,oBAAoB,CAAC,kBAAkB,EAAE,MAAM,EAAE,YAAY,GAAE,OAAO,EAAO,GAAG,OAAO,CA2BtG"}

package/dist/types/utils/listbox/__tests__/use-select-state.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=use-select-state.test.d.ts.map

package/dist/types/utils/listbox/__tests__/use-select-state.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-select-state.test.d.ts","sourceRoot":"/","sources":["utils/listbox/__tests__/use-select-state.test.tsx"],"names":[],"mappings":""}

package/dist/types/utils/listbox/__tests__/use-selection-observer.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=use-selection-observer.test.d.ts.map

package/dist/types/utils/listbox/__tests__/use-selection-observer.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-selection-observer.test.d.ts","sourceRoot":"/","sources":["utils/listbox/__tests__/use-selection-observer.test.tsx"],"names":[],"mappings":""}

package/dist/types/utils/listbox/__tests__/use-state.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-state.test.d.ts","sourceRoot":"/","sources":["utils/listbox/__tests__/use-state.test.tsx"],"names":[],"mappings":""}

package/dist/types/utils/listbox/dom-helpers/get-listbox-value.d.ts

@@ -9,6 +9,6 @@
  * @returns Readonly array of selected option values, excluding empty strings
  * @throws {ListboxError} when the listbox does not exist or lacks a select element
  */
-export declare function getListboxValue(listboxId: string): readonly string[];
-export declare function getListboxValue(selectElement: HTMLSelectElement): readonly string[];
+export declare function getListboxValue(listboxId: string): string | readonly string[];
+export declare function getListboxValue(selectElement: HTMLSelectElement): string | readonly string[];
 //# sourceMappingURL=get-listbox-value.d.ts.map

package/dist/types/utils/listbox/dom-helpers/get-listbox-value.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"get-listbox-value.d.ts","sourceRoot":"/","sources":["utils/listbox/dom-helpers/get-listbox-value.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;GAUG;AACH,wBAAgB,eAAe,CAAC,SAAS,EAAE,MAAM,GAAG,SAAS,MAAM,EAAE,CAAA;AACrE,wBAAgB,eAAe,CAAC,aAAa,EAAE,iBAAiB,GAAG,SAAS,MAAM,EAAE,CAAA"}
+{"version":3,"file":"get-listbox-value.d.ts","sourceRoot":"/","sources":["utils/listbox/dom-helpers/get-listbox-value.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;GAUG;AACH,wBAAgB,eAAe,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,MAAM,EAAE,CAAA;AAC9E,wBAAgB,eAAe,CAAC,aAAa,EAAE,iBAAiB,GAAG,MAAM,GAAG,SAAS,MAAM,EAAE,CAAA"}

package/dist/types/utils/listbox/index.d.ts

@@ -6,6 +6,7 @@ export * from './optgroup';
 export * from './option';
 export * from './render-context';
 export * from './use-focus-management';
-export * from './use-listbox-selection-observer';
-export * from './use-listbox-state';
+export * from './use-selection-observer';
+export * from './use-select-state';
+export * from './use-state';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/utils/listbox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"/","sources":["utils/listbox/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA;AACzB,cAAc,eAAe,CAAA;AAC7B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,WAAW,CAAA;AACzB,cAAc,YAAY,CAAA;AAC1B,cAAc,UAAU,CAAA;AACxB,cAAc,kBAAkB,CAAA;AAChC,cAAc,wBAAwB,CAAA;AACtC,cAAc,kCAAkC,CAAA;AAChD,cAAc,qBAAqB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"/","sources":["utils/listbox/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA;AACzB,cAAc,eAAe,CAAA;AAC7B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,WAAW,CAAA;AACzB,cAAc,YAAY,CAAA;AAC1B,cAAc,UAAU,CAAA;AACxB,cAAc,kBAAkB,CAAA;AAChC,cAAc,wBAAwB,CAAA;AACtC,cAAc,0BAA0B,CAAA;AACxC,cAAc,oBAAoB,CAAA;AAClC,cAAc,aAAa,CAAA"}

package/dist/types/utils/listbox/listbox.d.ts

@@ -5,7 +5,8 @@ import { ListboxOption } from './option';
 import { ListboxOptgroup } from './optgroup';
 import { ListboxRenderContext, useListboxRenderContext } from './render-context';
 import { ListboxSelect } from './select';
-import { useListboxSelectionObserver } from './use-listbox-selection-observer';
+import { useListboxSelectionObserver } from './use-selection-observer';
+import { useListboxState } from './use-state';
 import type { ChangeEventHandler, ComponentPropsWithoutRef, ElementType, HTMLAttributes, ReactNode } from 'react';
 type AttributesToOmit = 'onChange';
 export declare namespace Listbox {
@@ -45,7 +46,7 @@ export declare namespace Listbox {
          * Always an array of strings, regardless of single- or multi-select mode.
          * For single-select, uses only the first value.
          */
-        defaultValue?: readonly string[];
+        defaultValue?: string | readonly string[];
         /** The listbox element's ID. Generates automatically if omitted. */
         id?: string;
         /** The form control name for form submission. */
@@ -86,7 +87,7 @@ export declare namespace Listbox {
          * Always an array of strings, regardless of single- or multi-select mode.
          * For single-select, uses only the first value.
          */
-        value?: readonly string[];
+        value?: string | readonly string[];
     }
     /**
      * Polymorphic props that merge BaseProps with any additional props from the `as` component.
@@ -128,6 +129,7 @@ export declare namespace Listbox {
     var Optgroup: typeof ListboxOptgroup;
     var Select: import("react").ForwardRefExoticComponent<ListboxSelect.Props & import("react").RefAttributes<HTMLSelectElement>>;
     var useSelectionObserver: typeof useListboxSelectionObserver;
+    var useState: typeof useListboxState;
     var Context: import("react").Context<ListboxContext.Value | null>;
     var RenderContext: import("react").Context<ListboxRenderContext.Value | null>;
     var useContext: typeof useListboxContext;

package/dist/types/utils/listbox/listbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"listbox.d.ts","sourceRoot":"/","sources":["utils/listbox/listbox.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"listbox.d.ts","sourceRoot":"/","sources":["utils/listbox/listbox.tsx"],"names":[],"mappings":"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"}

package/dist/types/utils/listbox/listbox.stories.d.ts

@@ -60,9 +60,17 @@ export declare const Groups: Story;
  *
  * Whether single- or multi-select behaviour is desired, the controlled state must be an array of
  * string values. The example here demonstrates a controlled usage of the `Listbox` via simple
- * local component state (`useState`) and `Listbox.getValue`.
+ * local component state (`Listbox.useState`) and `Listbox.getValue`.
  */
 export declare const Controlled: Story;
+/**
+ * For multi-select listboxes, the controlled value should be an array of strings. This example
+ * demonstrates a controlled multi-select listbox where users can select multiple options.
+ *
+ * The `Listbox.getValue` helper returns an array for multi-select listboxes, making it easy to
+ * manage the state.
+ */
+export declare const ControlledMultiSelect: Story;
 /**
  * Clearing the listbox's selection when it's value is controlled is trivial: the value can simply be
  * set to an empty array. However, sometimes the controlled value's setter may not be available to the
@@ -87,6 +95,9 @@ export declare const ObservingState: Story;
 /**
  * Any selected options will be included in the form data during submission. The following example
  * demonstrates this through a native HTML form.
+ *
+ * Note: the form submission handler retrieves the "options" form value using `formData.getAll('options')`.
+ * This will result in an array of selected values, whether the listbox is a single- or multi-select.
  */
 export declare const Forms: Story;
 //# sourceMappingURL=listbox.stories.d.ts.map

package/dist/types/utils/listbox/listbox.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"listbox.stories.d.ts","sourceRoot":"/","sources":["utils/listbox/listbox.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AAInC,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAE3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;CAsBsB,CAAA;AAEhC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC;;;;GAIG;AACH,eAAO,MAAM,OAAO,EAAE,KAkBrB,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,MAAM,EAAE,KAMpB,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,KAOtB,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,KAKtB,CAAA;AAED;;;;;GAKG;AACH,eAAO,MAAM,YAAY,EAAE,KAO1B,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,MAAM,EAAE,KA8BpB,CAAA;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,UAAU,EAAE,KAsBxB,CAAA;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,aAAa,EAAE,KAiB3B,CAAA;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,cAAc,EAAE,KAyB5B,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,KAAK,EAAE,KAwBnB,CAAA"}
+{"version":3,"file":"listbox.stories.d.ts","sourceRoot":"/","sources":["utils/listbox/listbox.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AAInC,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAE3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;CAsBsB,CAAA;AAEhC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC;;;;GAIG;AACH,eAAO,MAAM,OAAO,EAAE,KAkBrB,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,MAAM,EAAE,KAMpB,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,KAOtB,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,KAKtB,CAAA;AAED;;;;;GAKG;AACH,eAAO,MAAM,YAAY,EAAE,KAO1B,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,MAAM,EAAE,KA8BpB,CAAA;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,UAAU,EAAE,KA2BxB,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,qBAAqB,EAAE,KA6BnC,CAAA;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,aAAa,EAAE,KAiB3B,CAAA;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,cAAc,EAAE,KAyB5B,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,KAAK,EAAE,KAwBnB,CAAA"}

package/dist/types/utils/listbox/{use-listbox-state.d.ts → use-select-state.d.ts}

@@ -1,14 +1,14 @@
 import type { ChangeEventHandler } from 'react';
-export declare namespace useListboxState {
+export declare namespace useListboxSelectState {
     interface Input {
         /** Initially selected option values for uncontrolled mode */
-        defaultValue?: readonly string[];
+        defaultValue?: string | readonly string[];
         /** Allows multiple option selection */
         multiple: boolean;
         /** Change event handler for the underlying select element */
         onChange?: ChangeEventHandler<HTMLSelectElement>;
         /** Selected option values for controlled mode */
-        value?: readonly string[];
+        value?: string | readonly string[];
     }
     type Output = [
         /** Currently selected option values */
@@ -23,8 +23,6 @@ export declare namespace useListboxState {
  *
  * In controlled mode, uses the provided `value` prop to determine selection.
  * In uncontrolled mode, manages internal state initialized from `defaultValue`.
- *
- * For single-select listboxes, uses only the first selected value.
  */
-export declare function useListboxState({ defaultValue, multiple, onChange, value, }: useListboxState.Input): useListboxState.Output;
-//# sourceMappingURL=use-listbox-state.d.ts.map
+export declare function useListboxSelectState({ defaultValue, multiple, onChange, value, }: useListboxSelectState.Input): useListboxSelectState.Output;
+//# sourceMappingURL=use-select-state.d.ts.map

package/dist/types/utils/listbox/use-select-state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-select-state.d.ts","sourceRoot":"/","sources":["utils/listbox/use-select-state.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,OAAO,CAAA;AAE/C,yBAAiB,qBAAqB,CAAC;IACrC,UAAiB,KAAK;QACpB,6DAA6D;QAC7D,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,MAAM,EAAE,CAAA;QACzC,uCAAuC;QACvC,QAAQ,EAAE,OAAO,CAAA;QACjB,6DAA6D;QAC7D,QAAQ,CAAC,EAAE,kBAAkB,CAAC,iBAAiB,CAAC,CAAA;QAChD,iDAAiD;QACjD,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,MAAM,EAAE,CAAA;KACnC;IAED,KAAY,MAAM,GAAG;QACnB,uCAAuC;QACvC,KAAK,EAAE,SAAS,MAAM,EAAE;QACxB,4CAA4C;QAC5C,QAAQ,EAAE,kBAAkB,CAAC,iBAAiB,CAAC;KAChD,CAAA;CACF;AAED;;;;;;GAMG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,KAAK,GACN,EAAE,qBAAqB,CAAC,KAAK,GAAG,qBAAqB,CAAC,MAAM,CAY5D"}

package/dist/types/utils/listbox/{use-listbox-selection-observer.d.ts → use-selection-observer.d.ts}

@@ -12,5 +12,5 @@
  * Handles unstable callback references with a ref, preventing unnecessary re-observation when
  * the callback reference changes but the listbox ID remains constant.
  */
-export declare function useListboxSelectionObserver(listboxId: string, callback: (visibleOptions: HTMLButtonElement[], listboxState: readonly string[]) => void): void;
-//# sourceMappingURL=use-listbox-selection-observer.d.ts.map
+export declare function useListboxSelectionObserver(listboxId: string, callback: (visibleOptions: HTMLButtonElement[], listboxState: string | readonly string[]) => void): void;
+//# sourceMappingURL=use-selection-observer.d.ts.map

package/dist/types/utils/listbox/use-selection-observer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-selection-observer.d.ts","sourceRoot":"/","sources":["utils/listbox/use-selection-observer.tsx"],"names":[],"mappings":"AAKA;;;;;;;;;;;;;GAaG;AACH,wBAAgB,2BAA2B,CACzC,SAAS,EAAE,MAAM,EACjB,QAAQ,EAAE,CAAC,cAAc,EAAE,iBAAiB,EAAE,EAAE,YAAY,EAAE,MAAM,GAAG,SAAS,MAAM,EAAE,KAAK,IAAI,GAChG,IAAI,CAmCN"}

package/dist/types/utils/listbox/use-state.d.ts

@@ -0,0 +1,7 @@
+import type { Dispatch, SetStateAction } from 'react';
+/**
+ * A thin useState wrapper that bakes in the type of state expected by a Listbox; specifically,
+ * a string or readonly array of strings.
+ */
+export declare function useListboxState(initialState: string | readonly string[] | (() => string | readonly string[])): [string | readonly string[], Dispatch<SetStateAction<string | readonly string[]>>];
+//# sourceMappingURL=use-state.d.ts.map

package/dist/types/utils/listbox/use-state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-state.d.ts","sourceRoot":"/","sources":["utils/listbox/use-state.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAErD;;;GAGG;AACH,wBAAgB,eAAe,CAC7B,YAAY,EAAE,MAAM,GAAG,SAAS,MAAM,EAAE,GAAG,CAAC,MAAM,MAAM,GAAG,SAAS,MAAM,EAAE,CAAC,GAC5E,CAAC,MAAM,GAAG,SAAS,MAAM,EAAE,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,GAAG,SAAS,MAAM,EAAE,CAAC,CAAC,CAAC,CAEpF"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reapit/elements",
-  "version": "5.0.0-beta.62",
+  "version": "5.0.0-beta.64",
   "description": "A collection of React components and utilities for building apps for Reapit Marketplace",
   "homepage": "https://github.com/reapit/elements#readme",
   "bugs": {
@@ -53,6 +53,11 @@
       "import": "./dist/js/lab/*.js",
       "require": "./dist/js/lab/*.cjs"
     },
+    "./polyfills/*": {
+      "types": "./dist/types/polyfills/*/index.d.ts",
+      "import": "./dist/js/polyfills/*.js",
+      "require": "./dist/js/polyfills/*.cjs"
+    },
     "./utils/*": {
       "types": "./dist/types/utils/*/index.d.ts",
       "import": "./dist/js/utils/*.js",

package/dist/js/autocomplete-BbOHe_2t.js

@@ -1,58 +0,0 @@
-import { jsx as i } from "react/jsx-runtime";
-import { g as t } from "./combobox-vYU1IEFA.js";
-import "./button-base-BcnVjgNa.js";
-import "react";
-import "./listbox-z26X2kKG.js";
-import "./icons/close.js";
-import "./icons/chevron-down.js";
-import "./search-input-P7uo0pIh.js";
-import { SearchIcon as I } from "./icons/search.js";
-function l({
-  defaultOptions: n,
-  onClick: p,
-  placeholder: s = "Search...",
-  ...a
-}) {
-  const c = t.useButton({ onClick: p, placeholder: s }), e = t.useContext(), u = t.useHasSelection(e.listboxId), d = u && !e.multiple, m = !u, x = !u || e.multiple;
-  return /* @__PURE__ */ i(
-    t.Button,
-    {
-      ...a,
-      ...c,
-      action: d && /* @__PURE__ */ i(t.ClearButton, { "aria-controls": e.listboxId, disabled: e.disabled }),
-      leadingIcon: m && /* @__PURE__ */ i(I, { "aria-hidden": !0 }),
-      placeholder: s,
-      size: e.size,
-      children: x ? s : /* @__PURE__ */ i(t.SelectedContent, { defaultOptions: n, listboxId: e.listboxId })
-    }
-  );
-}
-l.displayName = "Autocomplete.Button";
-function r({ closeOnSelection: n = "auto", ...p }) {
-  return /* @__PURE__ */ i(t.Popup, { ...p, closeOnSelection: n });
-}
-r.displayName = "Autocomplete.Popup";
-function o(n) {
-  return /* @__PURE__ */ i(t, { ...n });
-}
-o.getValue = t.getListboxValue;
-o.getListboxId = t.getListboxId;
-o.getPopupId = t.getPopupId;
-o.Button = l;
-o.Divider = t.Divider;
-o.DefaultOptionsContext = t.DefaultOptionsContext;
-o.Listbox = t.Listbox;
-o.Option = t.Option;
-o.OptionAdditionalInfo = t.OptionAdditionalInfo;
-o.Optgroup = t.Optgroup;
-o.Placeholder = t.ListboxPlaceholder;
-o.Popup = r;
-o.SearchInput = t.SearchInput;
-o.SelectionChips = t.SelectionChips;
-o.SelectionChipsItem = t.SelectionChipsItem;
-o.useState = t.useState;
-export {
-  o as A,
-  l as a,
-  r as b
-};

package/dist/js/autocomplete-D0vKABmX.cjs

@@ -1 +0,0 @@
-"use strict";const i=require("react/jsx-runtime"),o=require("./combobox-DmzxFDJp.cjs");require("./button-base-tw0zLUCC.cjs");require("react");require("./listbox-WqmeAQ3c.cjs");require("./icons/close.cjs");require("./icons/chevron-down.cjs");require("./search-input-iGgUwfw7.cjs");const C=require("./icons/search.cjs");function c({defaultOptions:n,onClick:b,placeholder:u="Search...",...x}){const p=o.Combobox.useButton({onClick:b,placeholder:u}),e=o.Combobox.useContext(),s=o.Combobox.useHasSelection(e.listboxId),l=s&&!e.multiple,m=!s,a=!s||e.multiple;return i.jsx(o.Combobox.Button,{...x,...p,action:l&&i.jsx(o.Combobox.ClearButton,{"aria-controls":e.listboxId,disabled:e.disabled}),leadingIcon:m&&i.jsx(C.SearchIcon,{"aria-hidden":!0}),placeholder:u,size:e.size,children:a?u:i.jsx(o.Combobox.SelectedContent,{defaultOptions:n,listboxId:e.listboxId})})}c.displayName="Autocomplete.Button";function r({closeOnSelection:n="auto",...b}){return i.jsx(o.Combobox.Popup,{...b,closeOnSelection:n})}r.displayName="Autocomplete.Popup";function t(n){return i.jsx(o.Combobox,{...n})}t.getValue=o.Combobox.getListboxValue;t.getListboxId=o.Combobox.getListboxId;t.getPopupId=o.Combobox.getPopupId;t.Button=c;t.Divider=o.Combobox.Divider;t.DefaultOptionsContext=o.Combobox.DefaultOptionsContext;t.Listbox=o.Combobox.Listbox;t.Option=o.Combobox.Option;t.OptionAdditionalInfo=o.Combobox.OptionAdditionalInfo;t.Optgroup=o.Combobox.Optgroup;t.Placeholder=o.Combobox.ListboxPlaceholder;t.Popup=r;t.SearchInput=o.Combobox.SearchInput;t.SelectionChips=o.Combobox.SelectionChips;t.SelectionChipsItem=o.Combobox.SelectionChipsItem;t.useState=o.Combobox.useState;exports.Autocomplete=t;exports.AutocompleteButton=c;exports.AutocompletePopup=r;

package/dist/js/autocomplete-control-Ddah11Qw.js

@@ -1,43 +0,0 @@
-import { jsx as o, jsxs as x } from "react/jsx-runtime";
-import { A as t } from "./autocomplete-BbOHe_2t.js";
-import { a as r } from "./form-control-Cv1xUB2V.js";
-import { useId as n } from "react";
-function L({
-  children: f,
-  defaultOptions: v,
-  disabled: s,
-  errorText: i,
-  helpText: d,
-  id: I,
-  label: a,
-  maxWidth: h,
-  multiple: c,
-  required: m,
-  size: l = "medium",
-  ...A
-}) {
-  const b = n(), e = I ?? b, p = n(), u = n();
-  return /* @__PURE__ */ o(r, { as: "div", size: l, maxWidth: h, children: /* @__PURE__ */ x(t.DefaultOptionsContext.Provider, { value: v ?? [], children: [
-    a && /* @__PURE__ */ o(r.Label, { htmlFor: e, isRequired: m, children: a }),
-    /* @__PURE__ */ o(
-      t,
-      {
-        ...A,
-        "aria-describedby": d && !i ? p : void 0,
-        "aria-errormessage": i ? u : void 0,
-        "aria-invalid": i ? !0 : void 0,
-        disabled: s,
-        id: e,
-        multiple: c,
-        required: m,
-        size: l,
-        children: f
-      }
-    ),
-    i ? /* @__PURE__ */ o(r.ErrorText, { id: u, children: i }) : d && /* @__PURE__ */ o(r.HelpText, { id: p, children: d }),
-    c && /* @__PURE__ */ o(t.SelectionChips, { disabled: s, listboxId: t.getListboxId(e) })
-  ] }) });
-}
-export {
-  L as A
-};

package/dist/js/autocomplete-control-IlAuj9Gg.cjs

@@ -1 +0,0 @@
-"use strict";const o=require("react/jsx-runtime"),e=require("./autocomplete-D0vKABmX.cjs"),r=require("./form-control-Be_ITYmU.cjs"),c=require("react");function h({children:x,defaultOptions:C,disabled:n,errorText:t,helpText:i,id:I,label:l,maxWidth:j,multiple:d,required:u,size:m="medium",...v}){const A=c.useId(),s=I??A,a=c.useId(),p=c.useId();return o.jsx(r.FormControl,{as:"div",size:m,maxWidth:j,children:o.jsxs(e.Autocomplete.DefaultOptionsContext.Provider,{value:C??[],children:[l&&o.jsx(r.FormControl.Label,{htmlFor:s,isRequired:u,children:l}),o.jsx(e.Autocomplete,{...v,"aria-describedby":i&&!t?a:void 0,"aria-errormessage":t?p:void 0,"aria-invalid":t?!0:void 0,disabled:n,id:s,multiple:d,required:u,size:m,children:x}),t?o.jsx(r.FormControl.ErrorText,{id:p,children:t}):i&&o.jsx(r.FormControl.HelpText,{id:a,children:i}),d&&o.jsx(e.Autocomplete.SelectionChips,{disabled:n,listboxId:e.Autocomplete.getListboxId(s)})]})})}exports.AutocompleteControl=h;

package/dist/js/combobox-DmzxFDJp.cjs

@@ -1 +0,0 @@
-"use strict";const n=require("react/jsx-runtime");require("./button-base-tw0zLUCC.cjs");const b=require("react"),N=require("./button-Ccwmxlgv.cjs"),C=require("./listbox-WqmeAQ3c.cjs"),J=require("./icons/close.cjs"),zo=require("./icons/chevron-down.cjs"),K=require("./search-input-iGgUwfw7.cjs"),Ro=require("./anchor-positioning-DGfgb1OU.cjs"),Q=require("./index-8ctufnBx.cjs"),c=require("./index-Dmlb2--K.cjs"),Z=require("./utils/breakpoints.cjs"),oo=require("./use-match-media-BfoAxEfC.cjs"),Wo=require("./icons/check.cjs"),eo=require("./chip-group-66bqmP7S.cjs");function to({"aria-label":o="Clear selection","aria-controls":e,onClick:t,...s}){const i=r=>{t?.(r),C.clearListboxValue(e)};return n.jsx(N.Button,{...s,"aria-controls":e,"aria-label":o,hasNoPadding:!0,iconLeft:n.jsx(J.CloseIcon,{}),onClick:i,size:"small",variant:"tertiary"})}function j(o){const e=typeof o=="string"?document.getElementById(o):o;if(!e){const t=typeof o=="string"?`with ID "${o}"`:"(passed by reference)";throw new Error(`closeComboboxPopup: Element ${t} not found in the DOM`)}if(!(e instanceof HTMLDialogElement)){const t=typeof o=="string"?`with ID "${o}"`:"(passed by reference)";throw new Error(`closeComboboxPopup: Element ${t} is not an HTMLDialogElement`)}e.close()}const v={AUTO:"auto",ALWAYS:"always",NEVER:"never"};function no(o){if(o.defaultPrevented||!o.isTrusted)return;const e=io(o.target);if(!e)return;const{closeOnSelection:t}=o.currentTarget.dataset;if(t!==v.NEVER){if(t===v.ALWAYS){j(o.currentTarget);return}if(t===v.AUTO){const{listboxId:s}=e.dataset,i=s?document.getElementById(s):null;Fo(i)&&j(o.currentTarget)}}}function so(o){!("closedBy"in HTMLDialogElement.prototype)&&o.target===o.currentTarget&&o.currentTarget.close()}function io(o){return o instanceof HTMLElement?o.closest('[role="option"]'):null}function Fo(o){return"ariaMultiSelectable"in Element.prototype?o?.ariaMultiSelectable==="false":o?.getAttribute("aria-multiselectable")==="false"}function ao(o){const{preserveSearchOnClose:e}=o.currentTarget.dataset;if(e==="true")return;const t=o.currentTarget.querySelector("input");t instanceof HTMLInputElement&&K.clearSearchInput(t)}const D=b.createContext(null);function H(){const o=b.useContext(D);if(!o)throw new Error("useComboboxPopupDialogContext requires a ComboboxPopupDialog ancestor");return o}function w(o){const e=typeof o=="string"?document.getElementById(o):o;if(!e){const t=typeof o=="string"?`with ID "${o}"`:"(passed by reference)";throw new Error(`openComboboxPopup: Element ${t} not found in the DOM`)}if(!(e instanceof HTMLDialogElement)){const t=typeof o=="string"?`with ID "${o}"`:"(passed by reference)";throw new Error(`openComboboxPopup: Element ${t} is not an HTMLDialogElement`)}e.showModal()}function Go(){return n.jsx("form",{role:"none",children:n.jsx(N.Button,{"aria-label":"Close",formMethod:"dialog",iconLeft:n.jsx(J.CloseIcon,{"aria-hidden":!0}),size:"large",type:"submit",variant:"tertiary"})})}const lo="el-combobox-popup-dialog",ro=c.styled_default("div")({name:"ElComboboxPopupDialogHeader",class:"el-combobox-popup-dialog-header",propsAsIs:!1}),bo=c.styled_default("div")({name:"ElComboboxPopupDialogListboxContainer",class:"el-combobox-popup-dialog-listbox-container",propsAsIs:!1}),q="calc(anchor-size(width) + 2 * var(--combobox-popup-padding))",co="calc(anchor(left) - var(--combobox-popup-padding))",uo="calc(anchor(top) - var(--combobox-popup-padding))";function h({"aria-labelledby":o,children:e,className:t,closeOnSelection:s="auto",id:i,maxHeight:r,maxWidth:l=q,minWidth:p=q,onClose:d,onClick:x,preserveSearchOnClose:m=!1,search:g,style:S,variant:f="auto",...P}){const B=oo.useMatchMedia(Z.isWidthAtOrAbove("SM")),M=f==="popover"||f==="auto"&&B,X=f==="drawer"||f==="auto"&&!B,Vo=O=>{d?.(O),g&&ao(O)},$o=O=>{x?.(O),no(O),so(O)};return n.jsx("dialog",{...P,"aria-labelledby":o,className:Q.cx_default(lo,t),closedby:"any","data-close-on-selection":s,"data-preserve-search-on-close":m,"data-variant":f,id:i,onClose:Vo,onClick:$o,style:{...S,maxHeight:r},children:n.jsxs(D.Provider,{value:{variant:f},children:[M&&n.jsx(Ro.AnchorPositioning,{anchorElementId:o,left:co,maxWidth:l,minWidth:p,positionedElementId:i,positionTryFallbacks:"flip-block, flip-inline",top:uo}),(g||X)&&n.jsxs(ro,{children:[g,X&&n.jsx(Go,{})]}),n.jsx(bo,{children:e})]})})}h.Context=D;h.useContext=H;h.open=w;h.close=j;function po(o,e){const t=b.useRef(e);b.useEffect(function(){t.current=e},[e]),b.useEffect(function(){const i=document.getElementById(o);if(i instanceof HTMLElement){const r=new AbortController;return i.addEventListener("toggle",l=>t.current(l),{signal:r.signal}),()=>r.abort()}},[o])}function xo(o){const[e,t]=b.useState(!1);return po(o,s=>{t(s.newState==="open")}),e}function Co({"aria-label":o="Open popup","aria-controls":e,onClick:t,...s}){const i=r=>{t?.(r),w(e)};return n.jsx(N.Button,{...s,"aria-controls":e,"aria-label":o,hasNoPadding:!0,iconLeft:n.jsx(zo.ChevronDownIcon,{}),onClick:i,size:"small",tabIndex:-1,variant:"tertiary"})}const mo=c.styled_default("div")({name:"ElComboboxButtonContainer",class:"el-combobox-button-container",propsAsIs:!1}),fo=c.styled_default("button")({name:"ElComboboxButton",class:"el-combobox-button",propsAsIs:!1}),ho=c.styled_default("span")({name:"ElComboboxButtonIconContainer",class:"el-combobox-button-icon-container",propsAsIs:!1}),go=c.styled_default("span")({name:"ElComboboxButtonLabelContainer",class:"el-combobox-button-label-container",propsAsIs:!1}),Eo=c.styled_default("span")({name:"ElComboboxButtonActionContainer",class:"el-combobox-button-action-container",propsAsIs:!1});function I({action:o,"aria-controls":e,"aria-expanded":t,children:s,className:i,id:r,leadingIcon:l,placeholder:p="Select an option",showValidity:d,size:x="medium",style:m,...g}){const S=!s||s===p;return n.jsxs(mo,{className:i,"data-size":x,style:m,children:[n.jsxs(fo,{...g,"aria-autocomplete":"list","aria-controls":e,"aria-expanded":t,"aria-haspopup":"dialog","data-placeholder-shown":S,"data-show-validity":!!d,id:r,role:"combobox",type:"button",children:[l&&n.jsx(ho,{children:l}),n.jsx(go,{children:s??p})]}),o&&n.jsx(Eo,{children:o})]})}I.ClearButton=to;I.OpenPopupButton=Co;const _=b.createContext(null);function y(){const o=b.useContext(_);if(!o)throw new Error("useComboboxContext requires a Combobox ancestor");return o}const Oo=b.createContext([]);function T(){return b.useContext(Oo)}const Io=c.styled_default("div")({name:"ElComboboxListbox",class:"el-combobox-listbox",propsAsIs:!1}),yo=c.styled_default("div")({name:"ElComboboxListboxPlaceholder",class:"el-combobox-listbox-placeholder",propsAsIs:!1});function V({children:o,size:e="medium",...t}){return C.useListboxRenderContext()==="native"?null:n.jsx(yo,{...t,"aria-live":"polite","data-size":e,role:"status",children:o})}V.displayName="Combobox.ListboxPlaceholder";const Lo=c.styled_default("div")({name:"ElComboboxOptgroup",class:"el-combobox-optgroup",propsAsIs:!1}),So=c.styled_default("div")({name:"ElComboboxOptgroupLabelContainer",class:"el-combobox-optgroup-label-container",propsAsIs:!1});function Po({"aria-label":o,children:e,label:t,...s}){const i=b.useId();return n.jsxs(Lo,{...s,"aria-label":o,"aria-labelledby":o?void 0:i,role:"group",children:[t&&n.jsx(So,{id:i,children:t}),e]})}function $(o){return n.jsx(C.Listbox.Optgroup,{as:Po,...o})}$.displayName="Combobox.Optgroup";function z(o){return"ariaLabelledByElements"in Element.prototype?o.ariaLabelledByElements?.at(0)?.textContent??o.textContent:document.getElementById(o.getAttribute("aria-labelledby"))?.textContent??o.textContent}const Ao=c.styled_default("button")({name:"ElComboboxOption",class:"el-combobox-option",propsAsIs:!1}),Bo=c.styled_default("span")({name:"ElComboboxOptionCheckIconContainer",class:"el-combobox-option-check-icon-container",propsAsIs:!1}),vo=c.styled_default("span")({name:"ElComboboxOptionLabel",class:"el-combobox-option-label",propsAsIs:!1}),R=c.styled_default("span")({name:"ElComboboxOptionTextContainer",class:"el-combobox-option-text-container",propsAsIs:!1}),W=c.styled_default("span")({name:"ElComboboxOptionBadgeContainer",class:"el-combobox-option-badge-container",propsAsIs:!1}),jo=c.styled_default("span")({name:"ElComboboxOptionAdditionalInfoContainer",class:"el-combobox-option-additional-info-container",propsAsIs:!1}),Do=c.styled_default("span")({name:"ElComboboxOptionAdditionalInfo",class:"el-combobox-option-additional-info",propsAsIs:!1}),wo=c.styled_default("span")({name:"ElComboboxOptionAdditionalInfoIconContainer",class:"el-combobox-option-additional-info-icon-container",propsAsIs:!1});function F({badge:o,children:e,icon:t,...s}){return n.jsxs(Do,{...s,children:[t&&n.jsx(wo,{children:t}),n.jsx(R,{children:e}),o&&n.jsx(W,{children:o})]})}F.displayName="Combobox.OptionAdditionalInfo";function L({badge:o,children:e,additionalInfo:t,size:s="medium",...i}){const r=b.useId(),l=b.useId(),p=b.useId(),d=[o&&r,t&&p].filter(x=>!!x).join(" ")||void 0;return n.jsxs(Ao,{...i,"aria-labelledby":l,"aria-details":d,"data-size":s,role:"option",type:"button",children:[n.jsx(Bo,{"aria-hidden":!0,children:n.jsx(Wo.CheckIcon,{})}),n.jsxs(vo,{children:[n.jsx(R,{id:l,children:e}),o&&n.jsx(W,{id:r,children:o})]}),t&&n.jsx(jo,{id:p,children:t})]})}L.getOptionLabel=z;L.AdditionalInfo=F;function E(o){const{size:e}=y();return n.jsx(C.Listbox.Option,{as:L,...o,size:e==="small"?"medium":e})}E.displayName="Combobox.Option";E.getLabel=L.getOptionLabel;E.AdditionalInfo=L.AdditionalInfo;function u({defaultValue:o,...e}){const s=T().map(d=>d.value),{disabled:i,listboxId:r,multiple:l,required:p}=y();return n.jsx(C.Listbox,{...e,as:Io,"aria-disabled":i,"aria-multiselectable":l,"aria-orientation":"vertical","aria-required":p,defaultValue:o??s,id:r,selectionFollowsFocus:!1})}u.displayName="Combobox.Listbox";u.Divider=C.Listbox.Divider;u.Optgroup=$;u.Option=E;u.OptionAdditionalInfo=E.AdditionalInfo;u.Placeholder=V;u.clearValue=C.Listbox.clearValue;u.getOptionLabel=E.getLabel;u.getSelectedOptions=C.Listbox.getSelectedOptions;u.getValue=C.Listbox.getValue;u.setOptionSelectedState=C.Listbox.setOptionSelectedState;function A(o){const{comboboxId:e,popupId:t}=y();return n.jsx(h,{...o,"aria-labelledby":e,id:t,children:o.children})}A.displayName="Combobox.Popup";A.show=h.open;A.hide=h.close;function Uo({isXSBreakpoint:o,popupVariant:e}){switch(e){case"drawer":return"borderless";case"popover":return"default";case"auto":return o?"borderless":"default"}}function _o(o){const{variant:e}=H(),t=oo.useMatchMedia(Z.isWidthBelow("SM")),s=Uo({isXSBreakpoint:t,popupVariant:e});return n.jsx(K.SearchInput,{...o,type:"text",variant:s})}_o.displayName="Combobox.SearchInput";function k(o,e=[]){const[t,s]=b.useState(()=>e);return C.useListboxSelectionObserver(o,(i,r)=>{s(l=>{const p=l.filter(x=>r.includes(x.value)),d=i.filter(x=>!l.some(m=>m.value===x.value)).map(x=>({label:z(x),value:x.value}));return[...p,...d]})}),t}function Yo({defaultOptions:o,listboxId:e}){const t=T();return k(e,o??t).at(0)?.label}const To=b.createContext(null);function Xo(){const o=b.useContext(To);if(!o)throw new Error("useComboboxSelectionChipsContext requires a ComboboxSelectionChips ancestor");return o}function ko({children:o,value:e,...t}){const s=Xo();return n.jsx(eo.ChipGroup.Item,{...t,"aria-controls":s.listboxId,"aria-label":`Remove ${o}`,onClick:()=>C.setListboxOptionSelectedState(s.listboxId,e,()=>!1),value:e,children:o})}const Jo="el-combobox-selection-chips";function G({children:o,className:e,defaultOptions:t,listboxId:s,...i}){const r=T(),l=k(s,t??r),p=o?.(l)??l.map(d=>n.jsx(ko,{value:d.value,children:d.label},d.value));return l.length>0&&n.jsx(eo.ChipGroup,{...i,className:Q.cx_default(Jo,e),variant:"selection",children:n.jsx(To.Provider,{value:{listboxId:s},children:p})})}G.Item=ko;const Mo=c.styled_default("div")({name:"ElCombobox",class:"el-combobox",propsAsIs:!1});function U(o){return`${o}-listbox`}function Y(o){return`${o}-popup`}function qo({onClick:o}={}){const{ariaDescribedBy:e,ariaErrorMessage:t,ariaInvalid:s,comboboxId:i,disabled:r,popupId:l,required:p}=y(),d=xo(l);return{"aria-controls":l,"aria-describedby":e,"aria-errormessage":t,"aria-expanded":d,"aria-invalid":s,"aria-required":p,disabled:r,id:i,onClick:m=>{o?.(m),w(l)}}}function No(o){const[e,t]=b.useState(!1);return C.useListboxSelectionObserver(o,(s,i)=>{t(i.length>0)}),e}function Ho(o){return b.useState(o)}function a({"aria-describedby":o,"aria-errormessage":e,"aria-invalid":t,children:s,disabled:i=!1,id:r,maxWidth:l,multiple:p=!1,required:d=!1,showValidity:x=!1,size:m="medium",style:g,...S}){const f=b.useId(),P=r??f,B=U(P),M=Y(P);return n.jsx(_.Provider,{value:{ariaDescribedBy:o,ariaErrorMessage:e,ariaInvalid:t,comboboxId:P,disabled:i,listboxId:B,multiple:p,popupId:M,required:d,size:m},children:n.jsx(Mo,{...S,"data-show-validity":x,style:{"--combobox-max-width":l,...g},children:s})})}a.getOptionLabel=u.getOptionLabel;a.getListboxValue=C.Listbox.getValue;a.getListboxId=U;a.getPopupId=Y;a.Button=I;a.ClearButton=I.ClearButton;a.Divider=u.Divider;a.Listbox=u;a.ListboxPlaceholder=u.Placeholder;a.OpenPopupButton=I.OpenPopupButton;a.Optgroup=u.Optgroup;a.Option=u.Option;a.OptionAdditionalInfo=u.OptionAdditionalInfo;a.Popup=A;a.SearchInput=_o;a.SelectedContent=Yo;a.SelectionChips=G;a.SelectionChipsItem=G.Item;a.Context=_;a.DefaultOptionsContext=Oo;a.useButton=qo;a.useContext=y;a.useDefaultOptionsContext=T;a.useHasSelection=No;a.useSelectedOptions=k;a.useState=Ho;exports.CLOSE_ON_SELECTION=v;exports.Combobox=a;exports.ComboboxButton=I;exports.ComboboxButtonClearButton=to;exports.ComboboxButtonOpenPopupButton=Co;exports.ComboboxContext=_;exports.ComboboxListbox=u;exports.ComboboxListboxOptgroup=$;exports.ComboboxListboxOption=E;exports.ComboboxListboxPlaceholder=V;exports.ComboboxOptgroup=Po;exports.ComboboxOption=L;exports.ComboboxOptionAdditionalInfo=F;exports.ComboboxPopup=A;exports.ComboboxPopupDialog=h;exports.ComboboxPopupDialogContext=D;exports.ElCombobox=Mo;exports.ElComboboxButton=fo;exports.ElComboboxButtonActionContainer=Eo;exports.ElComboboxButtonContainer=mo;exports.ElComboboxButtonIconContainer=ho;exports.ElComboboxButtonLabelContainer=go;exports.ElComboboxListbox=Io;exports.ElComboboxListboxPlaceholder=yo;exports.ElComboboxOptgroup=Lo;exports.ElComboboxOptgroupLabelContainer=So;exports.ElComboboxOption=Ao;exports.ElComboboxOptionAdditionalInfo=Do;exports.ElComboboxOptionAdditionalInfoContainer=jo;exports.ElComboboxOptionAdditionalInfoIconContainer=wo;exports.ElComboboxOptionBadgeContainer=W;exports.ElComboboxOptionCheckIconContainer=Bo;exports.ElComboboxOptionLabel=vo;exports.ElComboboxOptionTextContainer=R;exports.ElComboboxPopupDialogHeader=ro;exports.ElComboboxPopupDialogListboxContainer=bo;exports.clearSearchInputOnClose=ao;exports.closeComboboxPopup=j;exports.closeOnBackdropClick=so;exports.defaultPopupInsetLeft=co;exports.defaultPopupInsetTop=uo;exports.defaultPopupWidth=q;exports.elComboboxPopupDialog=lo;exports.getComboboxListboxId=U;exports.getComboboxPopupId=Y;exports.getOptionElement=io;exports.getOptionLabel=z;exports.maybeCloseOnSelection=no;exports.openComboboxPopup=w;exports.useComboboxButton=qo;exports.useComboboxContext=y;exports.useComboboxHasSelection=No;exports.useComboboxPopupDialogContext=H;exports.useComboboxPopupObserver=po;exports.useComboboxPopupState=xo;exports.useComboboxSelectedOptions=k;exports.useComboboxState=Ho;