@fragments-sdk/ui 0.14.0 → 0.16.0

package/dist/components/Combobox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Combobox/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,yDAAyD;IACzD,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,MAAM,WAAW,mBAAoB,SAAQ,mBAAmB;IAC9D,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,gCAAgC;IAChC,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,4CAA4C;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oCAAoC;IACpC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC/C,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3C;AAED,MAAM,WAAW,qBAAsB,SAAQ,mBAAmB;IAChE,6CAA6C;IAC7C,QAAQ,EAAE,IAAI,CAAC;IACf,gCAAgC;IAChC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,4CAA4C;IAC5C,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,oCAAoC;IACpC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,8BAA8B;IAC9B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACtC;AAED,MAAM,MAAM,aAAa,GAAG,mBAAmB,GAAG,qBAAqB,CAAC;AAExE,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC;IACrF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;uBAEmB;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,oBAAqB,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IACzF,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,oBAAqB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAChF,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IACnC,mHAAmH;IACnH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC;IAC5F,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAC3E,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAC3E,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,WAAW,uBAAwB,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAChF,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAqGD,iBAAS,YAAY,CAAC,EACpB,QAAQ,EACR,KAAK,EACL,YAAY,EACZ,aAAa,EACb,QAAQ,EACR,QAAgB,EAChB,IAAI,EACJ,WAAW,EACX,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,aAAoB,GACrB,EAAE,aAAa,2CA6Hf;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,WAAkB,EAAE,GAAG,SAAS,EAAE,EAAE,kBAAkB,2CAoDzF;AAED,iBAAS,eAAe,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,oBAAoB,2CAUnF;AAED,iBAAS,eAAe,CAAC,EACvB,QAAQ,EACR,SAAS,EACT,UAAc,EACd,KAAe,EACf,eAAe,EACf,GAAG,SAAS,EACb,EAAE,oBAAoB,2CAqBtB;AAED,iBAAS,YAAY,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,iBAAiB,2CAyB9F;AAED,iBAAS,aAAa,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,kBAAkB,2CAG/E;AAED,iBAAS,aAAa,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,kBAAkB,2CAG/E;AAED,iBAAS,kBAAkB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,EAAE,uBAAuB,2CAGzF;AAMD,eAAO,MAAM,QAAQ;;;;;;;;;CASnB,CAAC;AAGH,OAAO,EACL,YAAY,EACZ,aAAa,EACb,eAAe,EACf,eAAe,EACf,YAAY,EACZ,aAAa,EACb,aAAa,EACb,kBAAkB,GACnB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Combobox/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/Combobox/index.js

@@ -1,20 +1,8 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
+import { Combobox as Combobox$1 } from "@base-ui/react/combobox";
+import { useFormFieldIds, mergeAriaIds } from "../../utils/aria.js";
 import styles from "./Combobox.module.scss.js";
-import { ComboboxItemIndicator } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/item-indicator/ComboboxItemIndicator.js";
-import { ComboboxRoot as ComboboxRoot$1 } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/root/ComboboxRoot.js";
-import { ComboboxGroupLabel as ComboboxGroupLabel$1 } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/group-label/ComboboxGroupLabel.js";
-import { ComboboxGroup as ComboboxGroup$1 } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/group/ComboboxGroup.js";
-import { ComboboxEmpty as ComboboxEmpty$1 } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/empty/ComboboxEmpty.js";
-import { ComboboxItem as ComboboxItem$1 } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/item/ComboboxItem.js";
-import { ComboboxPortal } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/portal/ComboboxPortal.js";
-import { ComboboxPositioner } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/positioner/ComboboxPositioner.js";
-import { ComboboxPopup } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/popup/ComboboxPopup.js";
-import { ComboboxTrigger as ComboboxTrigger$1 } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/trigger/ComboboxTrigger.js";
-import { ComboboxInput as ComboboxInput$1 } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/input/ComboboxInput.js";
-import { ComboboxChips } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/chips/ComboboxChips.js";
-import { ComboboxChip } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/chip/ComboboxChip.js";
-import { ComboboxChipRemove } from "../../node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/chip-remove/ComboboxChipRemove.js";
 function ChevronDownIcon() {
   return /* @__PURE__ */ jsx(
     "svg",
@@ -80,7 +68,8 @@ const ComboboxContext = React.createContext({
   },
   explicitTriggerCount: 0,
   registerTrigger: () => () => {
-  }
+  },
+  size: "md"
 });
 function getNodeText(node) {
   if (node == null || typeof node === "boolean") return "";
@@ -90,7 +79,7 @@ function getNodeText(node) {
     return getNodeText(node.props.children);
   return "";
 }
-function ComboboxRoot({
+const ComboboxRoot = React.forwardRef(function ComboboxRoot2({
   children,
   value,
   defaultValue,
@@ -104,8 +93,13 @@ function ComboboxRoot({
   required,
   name,
   placeholder,
-  autoHighlight = true
-}) {
+  autoHighlight = true,
+  label,
+  helperText,
+  error,
+  size = "md",
+  className
+}, ref) {
   const [internalValue, setInternalValue] = React.useState(
     value ?? defaultValue ?? (multiple ? [] : null)
   );
@@ -151,10 +145,20 @@ function ComboboxRoot({
       itemsVersion,
       incrementItemsVersion,
       explicitTriggerCount,
-      registerTrigger
+      registerTrigger,
+      size
     }),
-    [placeholder, multiple, selectedValues, itemsVersion, incrementItemsVersion, explicitTriggerCount, registerTrigger]
+    [placeholder, multiple, selectedValues, itemsVersion, incrementItemsVersion, explicitTriggerCount, registerTrigger, size]
   );
+  const { labelId, helperId, errorId, hasError, errorMessage } = useFormFieldIds("combobox", { label, helperText, error });
+  const wrapperClasses = [styles.wrapper, className].filter(Boolean).join(" ");
+  const helperClasses = [styles.helper, hasError && styles.helperError].filter(Boolean).join(" ");
+  const wrapperContent = (inner) => /* @__PURE__ */ jsxs("div", { ref, className: wrapperClasses, children: [
+    label && /* @__PURE__ */ jsx("span", { id: labelId, className: styles.label, children: label }),
+    inner,
+    helperText && /* @__PURE__ */ jsx("span", { id: helperId, className: helperClasses, children: helperText }),
+    errorMessage && /* @__PURE__ */ jsx("span", { id: errorId, className: styles.errorMessage, children: errorMessage })
+  ] });
   if (multiple) {
     const controlledValue2 = value;
     const uncontrolledValue2 = defaultValue;
@@ -165,23 +169,27 @@ function ComboboxRoot({
       }
       emitChange2 == null ? void 0 : emitChange2(newValue);
     };
-    return /* @__PURE__ */ jsx(ComboboxContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
-      ComboboxRoot$1,
-      {
-        value: controlledValue2,
-        defaultValue: uncontrolledValue2,
-        onValueChange: handleValueChange2,
-        open,
-        defaultOpen,
-        onOpenChange: (nextOpen) => handleOpenChange(nextOpen),
-        disabled,
-        required,
-        name,
-        multiple: true,
-        autoHighlight,
-        itemToStringLabel,
-        children
-      }
+    return /* @__PURE__ */ jsx(ComboboxContext.Provider, { value: contextValue, children: wrapperContent(
+      /* @__PURE__ */ jsx(
+        Combobox$1.Root,
+        {
+          value: controlledValue2,
+          defaultValue: uncontrolledValue2,
+          onValueChange: handleValueChange2,
+          open,
+          defaultOpen,
+          onOpenChange: (nextOpen) => handleOpenChange(nextOpen),
+          disabled,
+          required,
+          name,
+          multiple: true,
+          autoHighlight,
+          itemToStringLabel,
+          "aria-labelledby": labelId,
+          "aria-describedby": mergeAriaIds(errorId, helperId),
+          children
+        }
+      )
     ) });
   }
   const controlledValue = value;
@@ -193,65 +201,70 @@ function ComboboxRoot({
     }
     emitChange == null ? void 0 : emitChange(newValue);
   };
-  return /* @__PURE__ */ jsx(ComboboxContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
-    ComboboxRoot$1,
-    {
-      value: controlledValue,
-      defaultValue: uncontrolledValue ?? null,
-      onValueChange: handleValueChange,
-      open,
-      defaultOpen,
-      onOpenChange: (nextOpen) => handleOpenChange(nextOpen),
-      disabled,
-      required,
-      name,
-      multiple: false,
-      autoHighlight,
-      itemToStringLabel,
-      children
-    }
+  return /* @__PURE__ */ jsx(ComboboxContext.Provider, { value: contextValue, children: wrapperContent(
+    /* @__PURE__ */ jsx(
+      Combobox$1.Root,
+      {
+        value: controlledValue,
+        defaultValue: uncontrolledValue ?? null,
+        onValueChange: handleValueChange,
+        open,
+        defaultOpen,
+        onOpenChange: (nextOpen) => handleOpenChange(nextOpen),
+        disabled,
+        required,
+        name,
+        multiple: false,
+        autoHighlight,
+        itemToStringLabel,
+        "aria-labelledby": labelId,
+        "aria-describedby": mergeAriaIds(errorId, helperId),
+        children
+      }
+    )
   ) });
-}
+});
 function ComboboxInput({ className, showTrigger = true, ...htmlProps }) {
   const context = React.useContext(ComboboxContext);
-  const classes = [styles.input, className].filter(Boolean).join(" ");
+  const inputSizeClass = context.size === "sm" ? styles.inputSm : context.size === "lg" ? styles.inputLg : void 0;
+  const wrapperSizeClass = context.size === "sm" ? styles.inputWrapperSm : context.size === "lg" ? styles.inputWrapperLg : void 0;
+  const classes = [styles.input, inputSizeClass, className].filter(Boolean).join(" ");
+  const wrapperClasses = [styles.inputWrapper, wrapperSizeClass].filter(Boolean).join(" ");
   const renderTrigger = showTrigger && context.explicitTriggerCount === 0;
   if (context.multiple) {
-    return /* @__PURE__ */ jsxs("div", { className: styles.multiContainer, children: [
-      /* @__PURE__ */ jsxs("div", { className: styles.inputWrapper, children: [
-        /* @__PURE__ */ jsx(
-          ComboboxInput$1,
-          {
-            placeholder: context.selectedValues.length === 0 ? context.placeholder : void 0,
-            ...htmlProps,
-            className: classes
-          }
-        ),
-        renderTrigger && /* @__PURE__ */ jsx(ComboboxTrigger$1, { className: styles.trigger, children: /* @__PURE__ */ jsx(ChevronDownIcon, {}) })
-      ] }),
-      context.selectedValues.length > 0 && /* @__PURE__ */ jsx(ComboboxChips, { className: styles.chips, children: context.selectedValues.map((chipValue) => /* @__PURE__ */ jsxs(ComboboxChip, { className: styles.chip, children: [
+    return /* @__PURE__ */ jsxs("div", { className: wrapperClasses, children: [
+      context.selectedValues.length > 0 && /* @__PURE__ */ jsx(Combobox$1.Chips, { className: styles.chips, children: context.selectedValues.map((chipValue) => /* @__PURE__ */ jsxs(Combobox$1.Chip, { className: styles.chip, children: [
         /* @__PURE__ */ jsx("span", { className: styles.chipLabel, children: context.itemsRef.current.get(chipValue) ?? chipValue }),
-        /* @__PURE__ */ jsx(ComboboxChipRemove, { className: styles.chipRemove, children: /* @__PURE__ */ jsx(XIcon, {}) })
-      ] }, chipValue)) })
+        /* @__PURE__ */ jsx(Combobox$1.ChipRemove, { className: styles.chipRemove, children: /* @__PURE__ */ jsx(XIcon, {}) })
+      ] }, chipValue)) }),
+      /* @__PURE__ */ jsx(
+        Combobox$1.Input,
+        {
+          placeholder: context.selectedValues.length === 0 ? context.placeholder : void 0,
+          ...htmlProps,
+          className: classes
+        }
+      ),
+      renderTrigger && /* @__PURE__ */ jsx(Combobox$1.Trigger, { className: styles.trigger, children: /* @__PURE__ */ jsx(ChevronDownIcon, {}) })
     ] });
   }
-  return /* @__PURE__ */ jsxs("div", { className: styles.inputWrapper, children: [
+  return /* @__PURE__ */ jsxs("div", { className: wrapperClasses, children: [
     /* @__PURE__ */ jsx(
-      ComboboxInput$1,
+      Combobox$1.Input,
       {
         placeholder: context.placeholder,
         ...htmlProps,
         className: classes
       }
     ),
-    renderTrigger && /* @__PURE__ */ jsx(ComboboxTrigger$1, { className: styles.trigger, children: /* @__PURE__ */ jsx(ChevronDownIcon, {}) })
+    renderTrigger && /* @__PURE__ */ jsx(Combobox$1.Trigger, { className: styles.trigger, children: /* @__PURE__ */ jsx(ChevronDownIcon, {}) })
   ] });
 }
 function ComboboxTrigger({ children, className, ...htmlProps }) {
   const { registerTrigger } = React.useContext(ComboboxContext);
   React.useEffect(() => registerTrigger(), [registerTrigger]);
   const classes = [styles.trigger, className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsx(ComboboxTrigger$1, { ...htmlProps, className: classes, children: children ?? /* @__PURE__ */ jsx(ChevronDownIcon, {}) });
+  return /* @__PURE__ */ jsx(Combobox$1.Trigger, { ...htmlProps, className: classes, children: children ?? /* @__PURE__ */ jsx(ChevronDownIcon, {}) });
 }
 function ComboboxContent({
   children,
@@ -263,14 +276,14 @@ function ComboboxContent({
 }) {
   const popupClasses = [styles.popup, className].filter(Boolean).join(" ");
   const popupStyle = maxVisibleItems != null ? { "--fui-select-max-items": maxVisibleItems + 0.5, ...htmlProps.style } : htmlProps.style;
-  return /* @__PURE__ */ jsx(ComboboxPortal, { children: /* @__PURE__ */ jsx(
-    ComboboxPositioner,
+  return /* @__PURE__ */ jsx(Combobox$1.Portal, { children: /* @__PURE__ */ jsx(
+    Combobox$1.Positioner,
     {
       side: "bottom",
       sideOffset,
       align,
       className: styles.positioner,
-      children: /* @__PURE__ */ jsx(ComboboxPopup, { ...htmlProps, className: popupClasses, style: popupStyle, children })
+      children: /* @__PURE__ */ jsx(Combobox$1.Popup, { ...htmlProps, className: popupClasses, style: popupStyle, children })
     }
   ) });
 }
@@ -287,29 +300,29 @@ function ComboboxItem({ children, value, disabled, className, ...htmlProps }) {
       incrementItemsVersion();
     };
   }, [itemsRef, incrementItemsVersion, value, label]);
-  return /* @__PURE__ */ jsxs(ComboboxItem$1, { ...htmlProps, value, disabled, className: classes, children: [
+  return /* @__PURE__ */ jsxs(Combobox$1.Item, { ...htmlProps, value, disabled, className: classes, children: [
     children,
-    /* @__PURE__ */ jsx(ComboboxItemIndicator, { className: styles.itemIndicator, children: /* @__PURE__ */ jsx(CheckIcon, {}) })
+    /* @__PURE__ */ jsx(Combobox$1.ItemIndicator, { className: styles.itemIndicator, children: /* @__PURE__ */ jsx(CheckIcon, {}) })
   ] });
 }
 function ComboboxEmpty({ children, className, ...htmlProps }) {
   const classes = [styles.empty, className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsx(ComboboxEmpty$1, { ...htmlProps, className: classes, children });
+  return /* @__PURE__ */ jsx(Combobox$1.Empty, { ...htmlProps, className: classes, children });
 }
 function ComboboxGroup({ children, className, ...htmlProps }) {
   const classes = [styles.group, className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsx(ComboboxGroup$1, { ...htmlProps, className: classes, children });
+  return /* @__PURE__ */ jsx(Combobox$1.Group, { ...htmlProps, className: classes, children });
 }
 function ComboboxGroupLabel({ children, className, ...htmlProps }) {
   const classes = [styles.groupLabel, className].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsx(ComboboxGroupLabel$1, { ...htmlProps, className: classes, children });
+  return /* @__PURE__ */ jsx(Combobox$1.GroupLabel, { ...htmlProps, className: classes, children });
 }
 const Combobox = Object.assign(ComboboxRoot, {
   Input: ComboboxInput,
   Trigger: ComboboxTrigger,
   Content: ComboboxContent,
   Item: ComboboxItem,
-  ItemIndicator: ComboboxItemIndicator,
+  ItemIndicator: Combobox$1.ItemIndicator,
   Empty: ComboboxEmpty,
   Group: ComboboxGroup,
   GroupLabel: ComboboxGroupLabel
@@ -325,4 +338,3 @@ export {
   ComboboxRoot,
   ComboboxTrigger
 };
-//# sourceMappingURL=index.js.map

package/dist/components/Command/Command.module.scss.cjs

@@ -36,4 +36,3 @@ exports.itemActive = itemActive;
 exports.itemDisabled = itemDisabled;
 exports.list = list;
 exports.separator = separator;
-//# sourceMappingURL=Command.module.scss.cjs.map

package/dist/components/Command/Command.module.scss.js

@@ -36,4 +36,3 @@ export {
   list,
   separator
 };
-//# sourceMappingURL=Command.module.scss.js.map

package/dist/components/Command/index.cjs

@@ -413,4 +413,3 @@ exports.CommandItem = CommandItem;
 exports.CommandList = CommandList;
 exports.CommandRoot = CommandRoot;
 exports.CommandSeparator = CommandSeparator;
-//# sourceMappingURL=index.cjs.map

package/dist/components/Command/index.js

@@ -396,4 +396,3 @@ export {
   CommandRoot,
   CommandSeparator
 };
-//# sourceMappingURL=index.js.map

package/dist/components/ConversationList/ConversationList.module.scss.cjs

@@ -1,15 +1,15 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const conversationList = "_conversationList_ob1wd_1";
-const content = "_content_ob1wd_15";
-const loadingHistory = "_loadingHistory_ob1wd_23";
-const dateSeparator = "_dateSeparator_ob1wd_50";
-const dateSeparatorLine = "_dateSeparatorLine_ob1wd_57";
-const dateSeparatorText = "_dateSeparatorText_ob1wd_63";
-const typingIndicator = "_typingIndicator_ob1wd_74";
-const typingAvatar = "_typingAvatar_ob1wd_81";
-const typingContent = "_typingContent_ob1wd_97";
-const typingDot = "_typingDot_ob1wd_106";
+const conversationList = "_conversationList_1ghm6_1";
+const content = "_content_1ghm6_15";
+const loadingHistory = "_loadingHistory_1ghm6_23";
+const dateSeparator = "_dateSeparator_1ghm6_50";
+const dateSeparatorLine = "_dateSeparatorLine_1ghm6_57";
+const dateSeparatorText = "_dateSeparatorText_1ghm6_63";
+const typingIndicator = "_typingIndicator_1ghm6_74";
+const typingAvatar = "_typingAvatar_1ghm6_81";
+const typingContent = "_typingContent_1ghm6_97";
+const typingDot = "_typingDot_1ghm6_106";
 const styles = {
   conversationList,
   content,
@@ -33,4 +33,3 @@ exports.typingAvatar = typingAvatar;
 exports.typingContent = typingContent;
 exports.typingDot = typingDot;
 exports.typingIndicator = typingIndicator;
-//# sourceMappingURL=ConversationList.module.scss.cjs.map

package/dist/components/ConversationList/ConversationList.module.scss.js

@@ -1,13 +1,13 @@
-const conversationList = "_conversationList_ob1wd_1";
-const content = "_content_ob1wd_15";
-const loadingHistory = "_loadingHistory_ob1wd_23";
-const dateSeparator = "_dateSeparator_ob1wd_50";
-const dateSeparatorLine = "_dateSeparatorLine_ob1wd_57";
-const dateSeparatorText = "_dateSeparatorText_ob1wd_63";
-const typingIndicator = "_typingIndicator_ob1wd_74";
-const typingAvatar = "_typingAvatar_ob1wd_81";
-const typingContent = "_typingContent_ob1wd_97";
-const typingDot = "_typingDot_ob1wd_106";
+const conversationList = "_conversationList_1ghm6_1";
+const content = "_content_1ghm6_15";
+const loadingHistory = "_loadingHistory_1ghm6_23";
+const dateSeparator = "_dateSeparator_1ghm6_50";
+const dateSeparatorLine = "_dateSeparatorLine_1ghm6_57";
+const dateSeparatorText = "_dateSeparatorText_1ghm6_63";
+const typingIndicator = "_typingIndicator_1ghm6_74";
+const typingAvatar = "_typingAvatar_1ghm6_81";
+const typingContent = "_typingContent_1ghm6_97";
+const typingDot = "_typingDot_1ghm6_106";
 const styles = {
   conversationList,
   content,
@@ -33,4 +33,3 @@ export {
   typingDot,
   typingIndicator
 };
-//# sourceMappingURL=ConversationList.module.scss.js.map

package/dist/components/ConversationList/index.cjs

@@ -166,4 +166,3 @@ exports.ConversationListRoot = ConversationListRoot;
 exports.DateSeparator = DateSeparator;
 exports.TypingIndicator = TypingIndicator;
 exports.useConversationList = useConversationList;
-//# sourceMappingURL=index.cjs.map

package/dist/components/ConversationList/index.js

@@ -149,4 +149,3 @@ export {
   TypingIndicator,
   useConversationList
 };
-//# sourceMappingURL=index.js.map

package/dist/components/DataTable/DataTable.module.scss.cjs

@@ -1,31 +1,31 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const wrapper = "_wrapper_3946y_1";
-const table = "_table_3946y_6";
-const caption = "_caption_3946y_14";
-const captionHidden = "_captionHidden_3946y_23";
-const sm = "_sm_3946y_35";
-const th = "_th_3946y_35";
-const td = "_td_3946y_36";
-const md = "_md_3946y_41";
-const thead = "_thead_3946y_47";
-const headerRow = "_headerRow_3946y_53";
-const headerContent = "_headerContent_3946y_72";
-const thSortable = "_thSortable_3946y_78";
-const sortButton = "_sortButton_3946y_82";
-const sortIndicator = "_sortIndicator_3946y_121";
-const row = "_row_3946y_131";
-const clickable = "_clickable_3946y_142";
-const selected = "_selected_3946y_156";
-const striped = "_striped_3946y_169";
-const bordered = "_bordered_3946y_185";
-const fixedLayout = "_fixedLayout_3946y_191";
-const checkboxCell = "_checkboxCell_3946y_195";
-const expandCell = "_expandCell_3946y_201";
-const expandButton = "_expandButton_3946y_207";
-const subRow = "_subRow_3946y_240";
-const emptyState = "_emptyState_3946y_247";
-const emptyMessage = "_emptyMessage_3946y_254";
+const wrapper = "_wrapper_1rnwn_1";
+const table = "_table_1rnwn_6";
+const caption = "_caption_1rnwn_14";
+const captionHidden = "_captionHidden_1rnwn_23";
+const sm = "_sm_1rnwn_35";
+const th = "_th_1rnwn_35";
+const td = "_td_1rnwn_36";
+const md = "_md_1rnwn_41";
+const thead = "_thead_1rnwn_47";
+const headerRow = "_headerRow_1rnwn_53";
+const headerContent = "_headerContent_1rnwn_72";
+const thSortable = "_thSortable_1rnwn_78";
+const sortButton = "_sortButton_1rnwn_82";
+const sortIndicator = "_sortIndicator_1rnwn_121";
+const row = "_row_1rnwn_131";
+const clickable = "_clickable_1rnwn_142";
+const selected = "_selected_1rnwn_156";
+const striped = "_striped_1rnwn_169";
+const bordered = "_bordered_1rnwn_185";
+const fixedLayout = "_fixedLayout_1rnwn_191";
+const checkboxCell = "_checkboxCell_1rnwn_195";
+const expandCell = "_expandCell_1rnwn_201";
+const expandButton = "_expandButton_1rnwn_207";
+const subRow = "_subRow_1rnwn_240";
+const emptyState = "_emptyState_1rnwn_247";
+const emptyMessage = "_emptyMessage_1rnwn_254";
 const styles = {
   wrapper,
   table,
@@ -81,4 +81,3 @@ exports.th = th;
 exports.thSortable = thSortable;
 exports.thead = thead;
 exports.wrapper = wrapper;
-//# sourceMappingURL=DataTable.module.scss.cjs.map

package/dist/components/DataTable/DataTable.module.scss.js

@@ -1,29 +1,29 @@
-const wrapper = "_wrapper_3946y_1";
-const table = "_table_3946y_6";
-const caption = "_caption_3946y_14";
-const captionHidden = "_captionHidden_3946y_23";
-const sm = "_sm_3946y_35";
-const th = "_th_3946y_35";
-const td = "_td_3946y_36";
-const md = "_md_3946y_41";
-const thead = "_thead_3946y_47";
-const headerRow = "_headerRow_3946y_53";
-const headerContent = "_headerContent_3946y_72";
-const thSortable = "_thSortable_3946y_78";
-const sortButton = "_sortButton_3946y_82";
-const sortIndicator = "_sortIndicator_3946y_121";
-const row = "_row_3946y_131";
-const clickable = "_clickable_3946y_142";
-const selected = "_selected_3946y_156";
-const striped = "_striped_3946y_169";
-const bordered = "_bordered_3946y_185";
-const fixedLayout = "_fixedLayout_3946y_191";
-const checkboxCell = "_checkboxCell_3946y_195";
-const expandCell = "_expandCell_3946y_201";
-const expandButton = "_expandButton_3946y_207";
-const subRow = "_subRow_3946y_240";
-const emptyState = "_emptyState_3946y_247";
-const emptyMessage = "_emptyMessage_3946y_254";
+const wrapper = "_wrapper_1rnwn_1";
+const table = "_table_1rnwn_6";
+const caption = "_caption_1rnwn_14";
+const captionHidden = "_captionHidden_1rnwn_23";
+const sm = "_sm_1rnwn_35";
+const th = "_th_1rnwn_35";
+const td = "_td_1rnwn_36";
+const md = "_md_1rnwn_41";
+const thead = "_thead_1rnwn_47";
+const headerRow = "_headerRow_1rnwn_53";
+const headerContent = "_headerContent_1rnwn_72";
+const thSortable = "_thSortable_1rnwn_78";
+const sortButton = "_sortButton_1rnwn_82";
+const sortIndicator = "_sortIndicator_1rnwn_121";
+const row = "_row_1rnwn_131";
+const clickable = "_clickable_1rnwn_142";
+const selected = "_selected_1rnwn_156";
+const striped = "_striped_1rnwn_169";
+const bordered = "_bordered_1rnwn_185";
+const fixedLayout = "_fixedLayout_1rnwn_191";
+const checkboxCell = "_checkboxCell_1rnwn_195";
+const expandCell = "_expandCell_1rnwn_201";
+const expandButton = "_expandButton_1rnwn_207";
+const subRow = "_subRow_1rnwn_240";
+const emptyState = "_emptyState_1rnwn_247";
+const emptyMessage = "_emptyMessage_1rnwn_254";
 const styles = {
   wrapper,
   table,
@@ -81,4 +81,3 @@ export {
   thead,
   wrapper
 };
-//# sourceMappingURL=DataTable.module.scss.js.map

package/dist/components/DataTable/index.cjs

@@ -401,4 +401,3 @@ const DataTable = Object.assign(DataTableRoot, {
 });
 exports.DataTable = DataTable;
 exports.createColumns = createColumns;
-//# sourceMappingURL=index.cjs.map

package/dist/components/DataTable/index.js

@@ -384,4 +384,3 @@ export {
   DataTable,
   createColumns
 };
-//# sourceMappingURL=index.js.map

package/dist/components/DatePicker/DatePicker.module.scss.cjs

@@ -1,32 +1,42 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const trigger = "_trigger_uib0c_1";
-const triggerIcon = "_triggerIcon_uib0c_55";
-const triggerValue = "_triggerValue_uib0c_66";
-const triggerPlaceholder = "_triggerPlaceholder_uib0c_74";
-const positioner = "_positioner_uib0c_83";
-const popup = "_popup_uib0c_88";
-const calendar = "_calendar_uib0c_108";
-const months = "_months_uib0c_117";
-const monthCaption = "_monthCaption_uib0c_122";
-const captionLabel = "_captionLabel_uib0c_129";
-const nav = "_nav_uib0c_135";
-const navButton = "_navButton_uib0c_146";
-const chevron = "_chevron_uib0c_188";
-const monthGrid = "_monthGrid_uib0c_192";
-const weekday = "_weekday_uib0c_197";
-const day = "_day_uib0c_214";
-const dayButton = "_dayButton_uib0c_223";
-const today = "_today_uib0c_255";
-const selected = "_selected_uib0c_259";
-const outside = "_outside_uib0c_267";
-const disabled = "_disabled_uib0c_272";
-const focused = "_focused_uib0c_278";
-const rangeStart = "_rangeStart_uib0c_283";
-const rangeEnd = "_rangeEnd_uib0c_284";
-const rangeMiddle = "_rangeMiddle_uib0c_285";
-const preset = "_preset_uib0c_340";
+const wrapper = "_wrapper_ycc6i_1";
+const label = "_label_ycc6i_6";
+const helper = "_helper_ycc6i_19";
+const helperError = "_helperError_ycc6i_26";
+const errorMessage = "_errorMessage_ycc6i_30";
+const trigger = "_trigger_ycc6i_36";
+const triggerIcon = "_triggerIcon_ycc6i_90";
+const triggerValue = "_triggerValue_ycc6i_101";
+const triggerPlaceholder = "_triggerPlaceholder_ycc6i_109";
+const positioner = "_positioner_ycc6i_118";
+const popup = "_popup_ycc6i_123";
+const calendar = "_calendar_ycc6i_143";
+const months = "_months_ycc6i_152";
+const monthCaption = "_monthCaption_ycc6i_157";
+const captionLabel = "_captionLabel_ycc6i_164";
+const nav = "_nav_ycc6i_170";
+const navButton = "_navButton_ycc6i_181";
+const chevron = "_chevron_ycc6i_223";
+const monthGrid = "_monthGrid_ycc6i_227";
+const weekday = "_weekday_ycc6i_232";
+const day = "_day_ycc6i_249";
+const dayButton = "_dayButton_ycc6i_258";
+const today = "_today_ycc6i_290";
+const selected = "_selected_ycc6i_294";
+const outside = "_outside_ycc6i_302";
+const disabled = "_disabled_ycc6i_307";
+const focused = "_focused_ycc6i_313";
+const rangeStart = "_rangeStart_ycc6i_318";
+const rangeEnd = "_rangeEnd_ycc6i_319";
+const rangeMiddle = "_rangeMiddle_ycc6i_320";
+const preset = "_preset_ycc6i_375";
 const styles = {
+  wrapper,
+  label,
+  helper,
+  helperError,
+  errorMessage,
   trigger,
   triggerIcon,
   triggerValue,
@@ -61,7 +71,11 @@ exports.day = day;
 exports.dayButton = dayButton;
 exports.default = styles;
 exports.disabled = disabled;
+exports.errorMessage = errorMessage;
 exports.focused = focused;
+exports.helper = helper;
+exports.helperError = helperError;
+exports.label = label;
 exports.monthCaption = monthCaption;
 exports.monthGrid = monthGrid;
 exports.months = months;
@@ -81,4 +95,4 @@ exports.triggerIcon = triggerIcon;
 exports.triggerPlaceholder = triggerPlaceholder;
 exports.triggerValue = triggerValue;
 exports.weekday = weekday;
-//# sourceMappingURL=DatePicker.module.scss.cjs.map
+exports.wrapper = wrapper;