@cerberus-design/react 0.16.0-next-f96f1b5 → 0.16.0-next-004ae01

package/build/legacy/_tsup-dts-rollup.d.cts

@@ -26,10 +26,12 @@ import { closestCorners } from '@dnd-kit/core';
 import { Collision } from '@dnd-kit/core';
 import { CollisionDescriptor } from '@dnd-kit/core';
 import { CollisionDetection } from '@dnd-kit/core';
+import { Combobox as Combobox_2 } from '@ark-ui/react/combobox';
 import { ComboboxClearTriggerProps } from '@ark-ui/react/combobox';
 import { ComboboxContentProps } from '@ark-ui/react/combobox';
 import { ComboboxControlProps } from '@ark-ui/react/combobox';
 import { ComboboxInputProps } from '@ark-ui/react/combobox';
+import type { ComboboxInputValueChangeDetails as ComboboxInputValueChangeDetails_2 } from '@ark-ui/react/combobox';
 import { ComboboxItemGroupLabelProps } from '@ark-ui/react/combobox';
 import { ComboboxItemGroupProps } from '@ark-ui/react/combobox';
 import { ComboboxItemIndicatorProps } from '@ark-ui/react/combobox';
@@ -40,6 +42,7 @@ import { ComboboxLabelProps } from '@ark-ui/react/combobox';
 import { ComboboxPositionerProps } from '@ark-ui/react/combobox';
 import { ComboboxRootProps } from '@ark-ui/react/combobox';
 import { ComboboxTriggerProps } from '@ark-ui/react/combobox';
+import { ComboboxVariantProps } from '@cerberus/styled-system/recipes';
 import { Context } from 'react';
 import { Data } from '@dnd-kit/core';
 import { DataRef } from '@dnd-kit/core';
@@ -955,7 +958,7 @@ export { ComboboxClearTrigger as ComboboxClearTrigger_alias_2 }
 /**
  * The content of the combobox component.
  */
-declare function ComboboxContent(props: ComboboxContentProps): JSX_2.Element;
+declare function ComboboxContent(props: ComboboxContentProps & ComboboxVariantProps): JSX_2.Element;
 export { ComboboxContent }
 export { ComboboxContent as ComboboxContent_alias_1 }
 export { ComboboxContent as ComboboxContent_alias_2 }
@@ -976,6 +979,11 @@ export { ComboboxInput }
 export { ComboboxInput as ComboboxInput_alias_1 }
 export { ComboboxInput as ComboboxInput_alias_2 }
 
+declare type ComboboxInputValueChangeDetails = Combobox_2.InputValueChangeDetails;
+export { ComboboxInputValueChangeDetails }
+export { ComboboxInputValueChangeDetails as ComboboxInputValueChangeDetails_alias_1 }
+export { ComboboxInputValueChangeDetails as ComboboxInputValueChangeDetails_alias_2 }
+
 /**
  * An individual item in the combobox component.
  */
@@ -1016,20 +1024,6 @@ export { ComboboxItemText }
 export { ComboboxItemText as ComboboxItemText_alias_1 }
 export { ComboboxItemText as ComboboxItemText_alias_2 }
 
-/**
- * This module contains the ComboboxItemWithIndicator component.
- * @module 'combobox/item'
- */
-/**
- * An abstraction of the ComboboxItem component that includes an indicator.
- * @description [Combobox Docs](https://cerberus.digitalu.design/react/combobox)
- * @description [Ark Docs](https://ark-ui.com/react/docs/components/combobox)
- */
-declare function ComboboxItemWithIndicator(props: ComboboxItemProps_2): JSX_2.Element;
-export { ComboboxItemWithIndicator }
-export { ComboboxItemWithIndicator as ComboboxItemWithIndicator_alias_1 }
-export { ComboboxItemWithIndicator as ComboboxItemWithIndicator_alias_2 }
-
 /**
  * The label that appears above the combobox input.
  */
@@ -1119,7 +1113,7 @@ export { ComboboxPositioner }
 export { ComboboxPositioner as ComboboxPositioner_alias_1 }
 export { ComboboxPositioner as ComboboxPositioner_alias_2 }
 
-declare interface ComboboxProps extends ComboboxRootProps<SelectCollectionItem> {
+declare interface ComboboxProps extends ComboboxRootProps<SelectCollectionItem>, ComboboxVariantProps {
     /**
      * The label that appears above the combobox input.
      */
@@ -1141,11 +1135,19 @@ export { ComboboxProps as ComboboxProps_alias_2 }
  * The ComboboxRoot component is the context provider for the Combobox
  * component.
  */
-declare function ComboboxRoot(props: ComboboxRootProps<SelectCollectionItem>): JSX_2.Element;
+declare function ComboboxRoot(props: ComboboxRootProps<SelectCollectionItem> & ComboboxVariantProps): JSX_2.Element;
 export { ComboboxRoot }
 export { ComboboxRoot as ComboboxRoot_alias_1 }
 export { ComboboxRoot as ComboboxRoot_alias_2 }
 
+/**
+ * The icon that appears at the start of the combobox input.
+ */
+declare function ComboboxStartIcon(props: PropsWithChildren): JSX_2.Element;
+export { ComboboxStartIcon }
+export { ComboboxStartIcon as ComboboxStartIcon_alias_1 }
+export { ComboboxStartIcon as ComboboxStartIcon_alias_2 }
+
 /**
  * The trigger that opens the dropdown.
  */
@@ -1169,6 +1171,25 @@ export { ComboItemGroupProps }
 export { ComboItemGroupProps as ComboItemGroupProps_alias_1 }
 export { ComboItemGroupProps as ComboItemGroupProps_alias_2 }
 
+declare const ComboItemText: typeof ComboboxItemText;
+export { ComboItemText }
+export { ComboItemText as ComboItemText_alias_1 }
+export { ComboItemText as ComboItemText_alias_2 }
+
+/**
+ * This module contains the ComboboxItemWithIndicator component.
+ * @module 'combobox/item'
+ */
+/**
+ * An abstraction of the ComboboxItem component that includes an indicator.
+ * @description [Combobox Docs](https://cerberus.digitalu.design/react/combobox)
+ * @description [Ark Docs](https://ark-ui.com/react/docs/components/combobox)
+ */
+declare function ComboItemWithIndicator(props: ComboboxItemProps_2): JSX_2.Element;
+export { ComboItemWithIndicator }
+export { ComboItemWithIndicator as ComboItemWithIndicator_alias_1 }
+export { ComboItemWithIndicator as ComboItemWithIndicator_alias_2 }
+
 /**
  * Provides a confirm modal to the app.
  * @see https://cerberus.digitalu.design/react/confirm-modal
@@ -4413,6 +4434,28 @@ declare function splitProps<T extends object>(props: T, ...keyGroups: (keyof T)[
 export { splitProps }
 export { splitProps as splitProps_alias_1 }
 
+/**
+ * This module contains a custom hook that provides a stateful collection for
+ * the Combobox component.
+ */
+declare interface StatefulCollectionReturn {
+    /**
+     * The collection of items.
+     */
+    collection: ReturnType<typeof createSelectCollection>;
+    /**
+     * The filter value split into an array of characters.
+     */
+    filterChars: string[];
+    /**
+     * The function to handle input changes.
+     */
+    handleInputChange: (details: ComboboxInputValueChangeDetails_2) => void;
+}
+export { StatefulCollectionReturn }
+export { StatefulCollectionReturn as StatefulCollectionReturn_alias_1 }
+export { StatefulCollectionReturn as StatefulCollectionReturn_alias_2 }
+
 /**
  * This module contains the tag component.
  * @module
@@ -5265,6 +5308,17 @@ export { useSensor }
 
 export { useSensors }
 
+/**
+ * This hook provides a stateful collection for the Combobox component.
+ * It returns a collection of items and a function to handle input changes.
+ * @param initialItems - The initial collection of items.
+ * @return An object containing the collection and a function to handle input changes.
+ */
+declare function useStatefulCollection(initialItems?: SelectCollectionItem[]): StatefulCollectionReturn;
+export { useStatefulCollection }
+export { useStatefulCollection as useStatefulCollection_alias_1 }
+export { useStatefulCollection as useStatefulCollection_alias_2 }
+
 /**
  * Used to access the tabs context.
  * @returns The tabs context.

package/build/legacy/components/combobox/combobox.cjs

@@ -37,83 +37,9 @@ function useCerberusContext() {
   return context;
 }
 
-// src/components/field/primitives.tsx
-var import_field = require("@ark-ui/react/field");
-var import_css3 = require("@cerberus/styled-system/css");
-var import_recipes3 = require("@cerberus/styled-system/recipes");
-
-// src/components/field/status-indicator.tsx
+// src/components/Portal.tsx
 var import_react2 = require("@ark-ui/react");
-var import_css = require("@cerberus/styled-system/css");
-var import_recipes = require("@cerberus/styled-system/recipes");
-var import_jsx_runtime2 = require("react/jsx-runtime");
-function FieldStatusIndicator(props) {
-  const { fallback, ...nativeProps } = props;
-  const styles = (0, import_recipes.field)();
-  const fieldContext = (0, import_react2.useFieldContext)();
-  const { icons } = useCerberusContext();
-  const { invalid: InvalidIcon } = icons;
-  if (fieldContext.invalid) {
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-      "span",
-      {
-        ...nativeProps,
-        "aria-hidden": "true",
-        "data-invalid": true,
-        className: (0, import_css.cx)(nativeProps.className, styles.statusIndicator),
-        children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(InvalidIcon, {})
-      }
-    );
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    "span",
-    {
-      ...nativeProps,
-      "aria-hidden": "true",
-      "data-part": "end-indicator",
-      className: (0, import_css.cx)(nativeProps.className, styles.endIndicator),
-      children: fallback
-    }
-  );
-}
-
-// src/components/field/start-indicator.tsx
-var import_css2 = require("@cerberus/styled-system/css");
-var import_recipes2 = require("@cerberus/styled-system/recipes");
-var import_jsx_runtime3 = require("react/jsx-runtime");
-function FieldStartIndicator(props) {
-  const styles = (0, import_recipes2.field)();
-  if (!props.children) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-    "span",
-    {
-      ...props,
-      "data-part": "start-indicator",
-      className: (0, import_css2.cx)(props.className, styles.startIndicator)
-    }
-  );
-}
-
-// src/components/field/primitives.tsx
-var import_jsx_runtime4 = require("react/jsx-runtime");
-function FieldInput(props) {
-  const { size, startIcon, endIcon, ...fieldProps } = props;
-  const styles = (0, import_recipes3.field)({ size });
-  const hasStartIcon = Boolean(startIcon);
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: styles.inputRoot, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FieldStartIndicator, { children: startIcon }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      import_field.Field.Input,
-      {
-        ...fieldProps,
-        ...hasStartIcon && { "data-has": "start-indicator" },
-        className: (0, import_css3.cx)(styles.input, fieldProps.className)
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FieldStatusIndicator, { fallback: endIcon })
-  ] });
-}
-var Input = FieldInput;
+var Portal = import_react2.Portal;
 
 // src/components/Show.tsx
 var import_react3 = require("react");
@@ -126,51 +52,129 @@ function Show(props) {
   }, [condition, children, fallback]);
 }
 
-// src/components/Portal.tsx
-var import_react4 = require("@ark-ui/react");
-var Portal = import_react4.Portal;
-
 // src/components/combobox/primitives.tsx
 var import_combobox = require("@ark-ui/react/combobox");
-var import_jsx_runtime5 = require("react/jsx-runtime");
+var import_factory = require("@ark-ui/react/factory");
+var import_recipes = require("@cerberus/styled-system/recipes");
+var import_css = require("@cerberus/styled-system/css");
+var import_jsx_runtime2 = require("react/jsx-runtime");
 function ComboboxRoot(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_combobox.Combobox.Root, { ...props });
+  const { size, ...rootProps } = props;
+  const styles = (0, import_recipes.combobox)({ size });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_combobox.Combobox.Root,
+    {
+      ...rootProps,
+      className: (0, import_css.cx)(styles.root, rootProps.className)
+    }
+  );
 }
 function ComboboxLabel(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_combobox.Combobox.Label, { ...props });
+  const styles = (0, import_recipes.combobox)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_combobox.Combobox.Label, { ...props, className: (0, import_css.cx)(styles.label, props.className) });
 }
 function ComboboxControl(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_combobox.Combobox.Control, { ...props });
+  const styles = (0, import_recipes.combobox)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_combobox.Combobox.Control,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.control, props.className)
+    }
+  );
 }
 function ComboboxInput(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_combobox.Combobox.Input, { ...props });
+  const styles = (0, import_recipes.combobox)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_combobox.Combobox.Input, { ...props, className: (0, import_css.cx)(styles.input, props.className) });
 }
 function ComboboxTrigger(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_combobox.Combobox.Trigger, { ...props });
+  const styles = (0, import_recipes.combobox)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_combobox.Combobox.Trigger,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.trigger, props.className)
+    }
+  );
 }
 function ComboboxClearTrigger(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_combobox.Combobox.ClearTrigger, { ...props });
+  const styles = (0, import_recipes.combobox)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_combobox.Combobox.ClearTrigger,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.clearTrigger, props.className)
+    }
+  );
 }
 function ComboboxPositioner(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_combobox.Combobox.Positioner, { ...props });
+  const styles = (0, import_recipes.combobox)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_combobox.Combobox.Positioner,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.positioner, props.className)
+    }
+  );
 }
 function ComboboxContent(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_combobox.Combobox.Content, { ...props });
+  const { size, ...contentProps } = props;
+  const styles = (0, import_recipes.combobox)({ size });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_combobox.Combobox.Content,
+    {
+      ...contentProps,
+      className: (0, import_css.cx)(styles.content, contentProps.className)
+    }
+  );
 }
 function ComboboxItemGroup(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_combobox.Combobox.ItemGroup, { ...props });
+  const styles = (0, import_recipes.combobox)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_combobox.Combobox.ItemGroup,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.itemGroup, props.className)
+    }
+  );
 }
 function ComboboxItemGroupLabel(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_combobox.Combobox.ItemGroupLabel, { ...props });
+  const styles = (0, import_recipes.combobox)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_combobox.Combobox.ItemGroupLabel,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.itemGroupLabel, props.className)
+    }
+  );
 }
 function ComboboxItem(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_combobox.Combobox.Item, { ...props });
+  const styles = (0, import_recipes.combobox)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_combobox.Combobox.Item, { ...props, className: (0, import_css.cx)(styles.item, props.className) });
 }
 function ComboboxItemText(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_combobox.Combobox.ItemText, { ...props });
+  const styles = (0, import_recipes.combobox)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_combobox.Combobox.ItemText,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.itemText, props.className)
+    }
+  );
 }
 function ComboboxItemIndicator(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_combobox.Combobox.ItemIndicator, { ...props });
+  const styles = (0, import_recipes.combobox)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_combobox.Combobox.ItemIndicator,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.itemIndicator, props.className)
+    }
+  );
+}
+function ComboboxStartIcon(props) {
+  const styles = (0, import_recipes.combobox)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_factory.ark.span, { ...props, className: styles.startIcon });
 }
 
 // src/components/combobox/parts.ts
@@ -191,24 +195,26 @@ var ComboboxParts = {
 };
 
 // src/components/combobox/combobox.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime3 = require("react/jsx-runtime");
 function Combobox2(props) {
-  const { label, children, ...rootProps } = props;
+  const { label, children, startIcon, ...rootProps } = props;
   const { icons } = useCerberusContext();
   const { selectArrow: SelectArrow, close: CloseIcon } = icons;
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(ComboboxParts.Root, { ...rootProps, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Show, { when: Boolean(label), children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ComboboxParts.Label, { children: label }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(ComboboxParts.Control, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ComboboxParts.Input, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-        Input,
+  const hasStartIcon = Boolean(startIcon);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(ComboboxParts.Root, { ...rootProps, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Show, { when: Boolean(label), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ComboboxParts.Label, { children: label }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(ComboboxParts.Control, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Show, { when: hasStartIcon, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ComboboxStartIcon, { children: startIcon }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+        ComboboxParts.Input,
         {
-          startIcon: props.startIcon,
-          endIcon: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ComboboxParts.ClearTrigger, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(CloseIcon, {}) })
+          ...hasStartIcon && { "data-has": "start-indicator" }
         }
-      ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ComboboxParts.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SelectArrow, {}) })
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ComboboxParts.ClearTrigger, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CloseIcon, {}) }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ComboboxParts.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SelectArrow, {}) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ComboboxParts.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ComboboxParts.Content, { children }) }) })
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ComboboxParts.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ComboboxParts.Content, { size: rootProps.size, children }) }) })
   ] });
 }
 // Annotate the CommonJS export names for ESM import in node:

package/build/legacy/components/combobox/combobox.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/combobox/combobox.tsx","../../../../src/context/cerberus.tsx","../../../../src/components/field/primitives.tsx","../../../../src/components/field/status-indicator.tsx","../../../../src/components/field/start-indicator.tsx","../../../../src/components/Show.tsx","../../../../src/components/Portal.tsx","../../../../src/components/combobox/primitives.tsx","../../../../src/components/combobox/parts.ts"],"sourcesContent":["'use client'\n\nimport type { ComboboxRootProps } from '@ark-ui/react/combobox'\nimport { useCerberusContext } from '../../context/cerberus'\nimport type { SelectCollectionItem } from '../select/select'\nimport { Input, type FieldInputProps } from '../field/index'\nimport { Portal } from '../Portal'\nimport { Show } from '../Show'\nimport { ComboboxParts } from './parts'\n\nexport interface ComboboxProps extends ComboboxRootProps<SelectCollectionItem> {\n  /**\n   * The label that appears above the combobox input.\n   */\n  label?: string\n  /**\n   * The icon that appears at the start of the combobox input.\n   */\n  startIcon?: FieldInputProps['startIcon']\n}\n\nexport function Combobox(props: ComboboxProps) {\n  const { label, children, ...rootProps } = props\n\n  const { icons } = useCerberusContext()\n  const { selectArrow: SelectArrow, close: CloseIcon } = icons\n\n  return (\n    <ComboboxParts.Root {...rootProps}>\n      <Show when={Boolean(label)}>\n        <ComboboxParts.Label>{label}</ComboboxParts.Label>\n      </Show>\n\n      <ComboboxParts.Control>\n        <ComboboxParts.Input asChild>\n          <Input\n            startIcon={props.startIcon}\n            endIcon={\n              <ComboboxParts.ClearTrigger>\n                <CloseIcon />\n              </ComboboxParts.ClearTrigger>\n            }\n          />\n        </ComboboxParts.Input>\n\n        <ComboboxParts.Trigger>\n          <SelectArrow />\n        </ComboboxParts.Trigger>\n      </ComboboxParts.Control>\n\n      <Portal>\n        <ComboboxParts.Positioner>\n          <ComboboxParts.Content>{children}</ComboboxParts.Content>\n        </ComboboxParts.Positioner>\n      </Portal>\n    </ComboboxParts.Root>\n  )\n}\n","'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport type { SystemConfig } from '../config'\n\n/**\n * This  module contains the Cerberus configuration context and helpers.\n * @module context/cerberus\n */\n\ntype CerberusContextValue = SystemConfig\n\nconst CerberusContext = createContext<CerberusContextValue | null>(null)\n\ninterface CerberusProviderProps {\n  config: SystemConfig\n}\n\n/**\n * Cerberus configuration provider.\n * @param props.config The Cerberus configuration created with\n * `makeSystemConfig` helper.\n */\nexport function CerberusProvider(\n  props: PropsWithChildren<CerberusProviderProps>,\n) {\n  return (\n    <CerberusContext.Provider value={props.config}>\n      {props.children}\n    </CerberusContext.Provider>\n  )\n}\n\n/**\n * Returns the Cerberus configuration context.\n * @returns The Cerberus configuration context.\n */\nexport function useCerberusContext() {\n  const context = useContext(CerberusContext)\n  if (!context) {\n    throw new Error('useCerberus must be used within a CerberusProvider')\n  }\n  return context\n}\n","import {\n  Field,\n  type FieldHelperTextProps,\n  type FieldInputProps as ArkFieldInputProps,\n  type FieldLabelProps,\n  type FieldRootProps as ArkFieldRootProps,\n  type FieldTextareaProps,\n} from '@ark-ui/react/field'\nimport type { ReactNode } from 'react'\nimport { cx } from '@cerberus/styled-system/css'\nimport { field, type FieldVariantProps } from '@cerberus/styled-system/recipes'\nimport { FieldStatusIndicator } from './status-indicator'\nimport { FieldStartIndicator } from './start-indicator'\n\n/**\n * This module contains all the primitives of the Field component.\n * @module 'field'\n */\n\nexport type FieldRootProps = ArkFieldRootProps & FieldVariantProps\n\n/**\n * The context & container for the Field components.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot required ids={{ input: 'exampleId' }}>\n *  <FieldLabel>Label</FieldLabel>\n *  <FieldInput />\n * </FieldRoot>\n * ```\n */\nexport function FieldRoot(props: FieldRootProps) {\n  const { size, ...fieldProps } = props\n  const styles = field({ size })\n  return (\n    <Field.Root\n      {...fieldProps}\n      className={cx(styles.root, fieldProps.className)}\n    />\n  )\n}\n\n/**\n * The label for the Field component.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n *   <FieldLabel>Label</FieldLabel>\n * </FieldRoot>\n * ```\n */\nexport function FieldLabel(props: FieldLabelProps) {\n  const { children, ...nativeProps } = props\n  const styles = field()\n  return (\n    <Field.Label {...nativeProps} className={cx(styles.label, props.className)}>\n      {children}\n      <Field.RequiredIndicator>(required)</Field.RequiredIndicator>\n    </Field.Label>\n  )\n}\n\n/**\n * The required indicator for the Field component.\n */\nexport function FieldRequiredIndicator() {\n  return <Field.RequiredIndicator>(required)</Field.RequiredIndicator>\n}\n\nexport interface FieldInputProps\n  extends Omit<ArkFieldInputProps, 'size'>,\n    FieldVariantProps {\n  /**\n   * An optional icon to display at the start of the input.\n   */\n  startIcon?: ReactNode\n  /**\n   * An optional icon to display at the end of the input.\n   */\n  endIcon?: ReactNode\n}\n\n/**\n * The input for the Field component.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n *   <FieldInput />\n * </FieldRoot>\n * ```\n */\nexport function FieldInput(props: FieldInputProps) {\n  const { size, startIcon, endIcon, ...fieldProps } = props\n  const styles = field({ size })\n  const hasStartIcon = Boolean(startIcon)\n\n  return (\n    <div className={styles.inputRoot}>\n      <FieldStartIndicator>{startIcon}</FieldStartIndicator>\n      <Field.Input\n        {...fieldProps}\n        {...(hasStartIcon && { 'data-has': 'start-indicator' })}\n        className={cx(styles.input, fieldProps.className)}\n      />\n      <FieldStatusIndicator fallback={endIcon} />\n    </div>\n  )\n}\n\n/**\n * The helper text for the Field component that is shown when the field is\n * valid.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n *   <FieldInput />\n *   <FieldHelperText>Helper text</FieldHelperText>\n * </FieldRoot>\n * ```\n */\nexport function FieldHelperText(props: FieldHelperTextProps) {\n  const styles = field()\n\n  if (!props.children) return null\n\n  return (\n    <Field.HelperText\n      {...props}\n      className={cx(styles.helperText, props.className)}\n    />\n  )\n}\n\n/**\n * The error text for the Field component that is shown when the field is\n * invalid.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n *   <FieldInput />\n *   <FieldErrorText>Error text</FieldErrorText>\n * </FieldRoot>\n * ```\n */\nexport function FieldErrorText(props: FieldHelperTextProps) {\n  const styles = field()\n\n  if (!props.children) return null\n\n  return (\n    <Field.ErrorText\n      {...props}\n      className={cx(styles.errorText, props.className)}\n    />\n  )\n}\n\n/**\n * The textarea for the Field component.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n *   <FieldTextarea />\n * </FieldRoot>\n * ```\n */\nexport function FieldTextarea(props: FieldTextareaProps) {\n  const styles = field()\n  return (\n    <Field.Textarea\n      {...props}\n      className={cx(styles.textarea, props.className)}\n    />\n  )\n}\n\n/**\n * A named export for the FieldInput component.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * import { Input } from '@cerberus/react'\n *\n * <Field\n *   ids={{\n *    control: 'email',\n *   }}\n *   label=\"Enter your email\"\n *   helperText=\"We'll never share your email with anyone else.\"\n *   errorText=\"Email is required.\"\n *   required\n * >\n *   <Input type=\"email\" />\n * </Field>\n * ```\n */\nexport const Input = FieldInput\nexport const Textarea = FieldTextarea\n","'use client'\n\nimport { useFieldContext } from '@ark-ui/react'\nimport { cx } from '@cerberus/styled-system/css'\nimport { field } from '@cerberus/styled-system/recipes'\nimport { useCerberusContext } from '../../context/cerberus'\nimport type { HTMLAttributes, ReactNode } from 'react'\n\nexport interface FieldStatusIndicatorProps\n  extends HTMLAttributes<HTMLSpanElement> {\n  /**\n   * The fallback content to display when the field is valid.\n   */\n  fallback?: ReactNode\n}\n\n/**\n * The invalid status indicator for the Field component.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <FieldRoot>\n *   <FieldStatusIndicator />\n * </FieldRoot>\n * ```\n */\nexport function FieldStatusIndicator(props: FieldStatusIndicatorProps) {\n  const { fallback, ...nativeProps } = props\n  const styles = field()\n  const fieldContext = useFieldContext()\n\n  const { icons } = useCerberusContext()\n  const { invalid: InvalidIcon } = icons\n\n  if (fieldContext.invalid) {\n    return (\n      <span\n        {...nativeProps}\n        aria-hidden=\"true\"\n        data-invalid\n        className={cx(nativeProps.className, styles.statusIndicator)}\n      >\n        <InvalidIcon />\n      </span>\n    )\n  }\n\n  return (\n    <span\n      {...nativeProps}\n      aria-hidden=\"true\"\n      data-part=\"end-indicator\"\n      className={cx(nativeProps.className, styles.endIndicator)}\n    >\n      {fallback}\n    </span>\n  )\n}\n","import { cx } from '@cerberus/styled-system/css'\nimport { field } from '@cerberus/styled-system/recipes'\nimport type { HTMLAttributes } from 'react'\n\nexport type FieldIndicatorProps = HTMLAttributes<HTMLSpanElement>\n\n/**\n * The start indicator displays an indicator at the start of the Input.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n */\nexport function FieldStartIndicator(props: FieldIndicatorProps) {\n  const styles = field()\n\n  if (!props.children) return null\n\n  return (\n    <span\n      {...props}\n      data-part=\"start-indicator\"\n      className={cx(props.className, styles.startIndicator)}\n    />\n  )\n}\n","'use client'\n\nimport { useMemo, type PropsWithChildren, type ReactNode } from 'react'\n\n/**\n * This module contains the Show component.\n * @module\n */\n\nexport interface ShowProps {\n  /**\n   * The condition to render memoized children or the fallback content.\n   */\n  when: boolean | null | undefined\n  /**\n   * The children to render when the condition is false.\n   */\n  fallback?: ReactNode\n}\n\n/**\n * Conditionally render a memoized version of the children or optional fallback\n * content.\n * @see https://cerberus.digitalu.design/react/show\n * @example\n * ```tsx\n * <Show when={isLoggedIn} fallback={<Navigate to=\"/login\" />}>\n *   <Dashboard />\n * </Show>\n */\nexport function Show(props: PropsWithChildren<ShowProps>): ReactNode {\n  const { when, children, fallback } = props\n  const condition = useMemo(() => when ?? false, [when])\n\n  return useMemo(() => {\n    if (condition) return children\n    return fallback ?? null\n  }, [condition, children, fallback])\n}\n","import {\n  Portal as ArkPortal,\n  type PortalProps as ArkPortalProps,\n} from '@ark-ui/react'\n\n/**\n * This module is the Portal component.\n * @module\n */\n\nexport type PortalProps = ArkPortalProps\n\n/**\n * The Portal component is used to render children into a DOM node that exists outside the DOM hierarchy of the parent component.\n * @see https://cerberus.digitalu.design/react/portal\n * @definition [React Portal Docs](https://react.dev/reference/react-dom/createPortal)\n * @example\n * ```tsx\n * 'use client'\n *\n * import { Portal } from '@cerberus/react'\n *\n * function SomeFeatureWithinSSRPage() {\n *   return (\n *     <Portal>\n *       <div>Portal Content outside of the React VDom tree</div>\n *     </Portal>\n *   )\n * }\n */\nexport const Portal = ArkPortal\n","import {\n  Combobox,\n  type ComboboxClearTriggerProps,\n  type ComboboxContentProps,\n  type ComboboxControlProps,\n  type ComboboxInputProps,\n  type ComboboxItemGroupLabelProps,\n  type ComboboxItemGroupProps,\n  type ComboboxItemIndicatorProps,\n  type ComboboxItemProps,\n  type ComboboxItemTextProps,\n  type ComboboxLabelProps,\n  type ComboboxPositionerProps,\n  type ComboboxRootProps,\n  type ComboboxTriggerProps,\n} from '@ark-ui/react/combobox'\nimport type { SelectCollectionItem } from '../select/select'\n\n/**\n * This module contains the primitives of the Combobox.\n * @module 'combobox/primitives'\n */\n\n/**\n * The ComboboxRoot component is the context provider for the Combobox\n * component.\n */\nexport function ComboboxRoot(props: ComboboxRootProps<SelectCollectionItem>) {\n  return <Combobox.Root {...props} />\n}\n\n/**\n * The label that appears above the combobox input.\n */\nexport function ComboboxLabel(props: ComboboxLabelProps) {\n  return <Combobox.Label {...props} />\n}\n\n/**\n * The control that wraps the combobox input.\n */\nexport function ComboboxControl(props: ComboboxControlProps) {\n  return <Combobox.Control {...props} />\n}\n\n/**\n * The input of the combobox.\n */\nexport function ComboboxInput(props: ComboboxInputProps) {\n  return <Combobox.Input {...props} />\n}\n\n/**\n * The trigger that opens the dropdown.\n */\nexport function ComboboxTrigger(props: ComboboxTriggerProps) {\n  return <Combobox.Trigger {...props} />\n}\n\n/**\n * The trigger to clear the combobox input.\n */\nexport function ComboboxClearTrigger(props: ComboboxClearTriggerProps) {\n  return <Combobox.ClearTrigger {...props} />\n}\n\n/**\n * The positioner that wraps the content.\n */\nexport function ComboboxPositioner(props: ComboboxPositionerProps) {\n  return <Combobox.Positioner {...props} />\n}\n\n/**\n * The content of the combobox component.\n */\nexport function ComboboxContent(props: ComboboxContentProps) {\n  return <Combobox.Content {...props} />\n}\n\n/**\n * A group of items in the combobox component.\n */\nexport function ComboboxItemGroup(props: ComboboxItemGroupProps) {\n  return <Combobox.ItemGroup {...props} />\n}\n\n/**\n * The label for a group of items in the combobox component.\n */\nexport function ComboboxItemGroupLabel(props: ComboboxItemGroupLabelProps) {\n  return <Combobox.ItemGroupLabel {...props} />\n}\n\n/**\n * An individual item in the combobox component.\n */\nexport function ComboboxItem(props: ComboboxItemProps) {\n  return <Combobox.Item {...props} />\n}\n\n/**\n * The text that labels a single item of the combobox.\n */\nexport function ComboboxItemText(props: ComboboxItemTextProps) {\n  return <Combobox.ItemText {...props} />\n}\n\n/**\n * The indicator that appears when the item has been selected.\n */\nexport function ComboboxItemIndicator(props: ComboboxItemIndicatorProps) {\n  return <Combobox.ItemIndicator {...props} />\n}\n","import type { ElementType } from 'react'\nimport {\n  ComboboxClearTrigger,\n  ComboboxContent,\n  ComboboxControl,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxItemGroup,\n  ComboboxItemGroupLabel,\n  ComboboxItemIndicator,\n  ComboboxItemText,\n  ComboboxLabel,\n  ComboboxPositioner,\n  ComboboxRoot,\n  ComboboxTrigger,\n} from './primitives'\n\n/**\n * This module contains the parts of the Combobox parts.\n * @module 'combobox/parts'\n */\n\ninterface ComboboxPartsValue {\n  /**\n   * The context provider for the Select component.\n   */\n  Root: ElementType\n  /**\n   * The label that appears above the select input.\n   */\n  Label: ElementType\n  /**\n   * The control that wraps the select trigger.\n   */\n  Control: ElementType\n  /**\n   * The filterable input of the combobox.\n   */\n  Input: ElementType\n  /**\n   * The trigger that opens the dropdown.\n   */\n  Trigger: ElementType\n  /**\n   * The trigger to clear the select input.\n   */\n  ClearTrigger: ElementType\n  /**\n   * The positioner that wraps the content.\n   */\n  Positioner: ElementType\n  /**\n   * The content of the select component.\n   */\n  Content: ElementType\n  /**\n   * A group of items in the select component.\n   */\n  ItemGroup: ElementType\n  /**\n   * The label for a group of items in the select component.\n   */\n  ItemGroupLabel: ElementType\n  /**\n   * An individual item in the select component.\n   */\n  Item: ElementType\n  /**\n   * The text that labels a single radio of the field.\n   */\n  ItemText: ElementType\n  /**\n   * The indicator that appears when the item has been selected.\n   */\n  ItemIndicator: ElementType\n}\n\n/**\n * An Object containing the parts of the Radio component. For users that\n * prefer Object component syntax.\n *\n * @remarks\n *\n * When using object component syntax, you import the ComboboxParts object and\n * the entire family of components vs. only what you use.\n */\nexport const ComboboxParts: ComboboxPartsValue = {\n  Root: ComboboxRoot,\n  Label: ComboboxLabel,\n  Control: ComboboxControl,\n  Input: ComboboxInput,\n  Trigger: ComboboxTrigger,\n  ClearTrigger: ComboboxClearTrigger,\n  Positioner: ComboboxPositioner,\n  Content: ComboboxContent,\n  ItemGroup: ComboboxItemGroup,\n  ItemGroupLabel: ComboboxItemGroupLabel,\n  Item: ComboboxItem,\n  ItemText: ComboboxItemText,\n  ItemIndicator: ComboboxItemIndicator,\n}\n"],"mappings":"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","names":["Combobox","import_css","import_recipes","import_react","import_jsx_runtime","import_css","import_recipes","import_jsx_runtime","import_jsx_runtime","import_react","import_react","ArkPortal","import_jsx_runtime","import_jsx_runtime","Combobox"]}
+{"version":3,"sources":["../../../../src/components/combobox/combobox.tsx","../../../../src/context/cerberus.tsx","../../../../src/components/Portal.tsx","../../../../src/components/Show.tsx","../../../../src/components/combobox/primitives.tsx","../../../../src/components/combobox/parts.ts"],"sourcesContent":["'use client'\n\nimport type { ComboboxRootProps } from '@ark-ui/react/combobox'\nimport type { ComboboxVariantProps } from '@cerberus/styled-system/recipes'\nimport { useCerberusContext } from '../../context/cerberus'\nimport type { SelectCollectionItem } from '../select/select'\nimport { type FieldInputProps } from '../field/index'\nimport { Portal } from '../Portal'\nimport { Show } from '../Show'\nimport { ComboboxParts } from './parts'\nimport { ComboboxStartIcon } from './primitives'\n\nexport interface ComboboxProps\n  extends ComboboxRootProps<SelectCollectionItem>,\n    ComboboxVariantProps {\n  /**\n   * The label that appears above the combobox input.\n   */\n  label?: string\n  /**\n   * The icon that appears at the start of the combobox input.\n   */\n  startIcon?: FieldInputProps['startIcon']\n}\n\nexport function Combobox(props: ComboboxProps) {\n  const { label, children, startIcon, ...rootProps } = props\n\n  const { icons } = useCerberusContext()\n  const { selectArrow: SelectArrow, close: CloseIcon } = icons\n\n  const hasStartIcon = Boolean(startIcon)\n\n  return (\n    <ComboboxParts.Root {...rootProps}>\n      <Show when={Boolean(label)}>\n        <ComboboxParts.Label>{label}</ComboboxParts.Label>\n      </Show>\n\n      <ComboboxParts.Control>\n        <Show when={hasStartIcon}>\n          <ComboboxStartIcon>{startIcon}</ComboboxStartIcon>\n        </Show>\n\n        <ComboboxParts.Input\n          {...(hasStartIcon && { 'data-has': 'start-indicator' })}\n        />\n\n        <ComboboxParts.ClearTrigger>\n          <CloseIcon />\n        </ComboboxParts.ClearTrigger>\n        <ComboboxParts.Trigger>\n          <SelectArrow />\n        </ComboboxParts.Trigger>\n      </ComboboxParts.Control>\n\n      <Portal>\n        <ComboboxParts.Positioner>\n          <ComboboxParts.Content size={rootProps.size}>\n            {children}\n          </ComboboxParts.Content>\n        </ComboboxParts.Positioner>\n      </Portal>\n    </ComboboxParts.Root>\n  )\n}\n","'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport type { SystemConfig } from '../config'\n\n/**\n * This  module contains the Cerberus configuration context and helpers.\n * @module context/cerberus\n */\n\ntype CerberusContextValue = SystemConfig\n\nconst CerberusContext = createContext<CerberusContextValue | null>(null)\n\ninterface CerberusProviderProps {\n  config: SystemConfig\n}\n\n/**\n * Cerberus configuration provider.\n * @param props.config The Cerberus configuration created with\n * `makeSystemConfig` helper.\n */\nexport function CerberusProvider(\n  props: PropsWithChildren<CerberusProviderProps>,\n) {\n  return (\n    <CerberusContext.Provider value={props.config}>\n      {props.children}\n    </CerberusContext.Provider>\n  )\n}\n\n/**\n * Returns the Cerberus configuration context.\n * @returns The Cerberus configuration context.\n */\nexport function useCerberusContext() {\n  const context = useContext(CerberusContext)\n  if (!context) {\n    throw new Error('useCerberus must be used within a CerberusProvider')\n  }\n  return context\n}\n","import {\n  Portal as ArkPortal,\n  type PortalProps as ArkPortalProps,\n} from '@ark-ui/react'\n\n/**\n * This module is the Portal component.\n * @module\n */\n\nexport type PortalProps = ArkPortalProps\n\n/**\n * The Portal component is used to render children into a DOM node that exists outside the DOM hierarchy of the parent component.\n * @see https://cerberus.digitalu.design/react/portal\n * @definition [React Portal Docs](https://react.dev/reference/react-dom/createPortal)\n * @example\n * ```tsx\n * 'use client'\n *\n * import { Portal } from '@cerberus/react'\n *\n * function SomeFeatureWithinSSRPage() {\n *   return (\n *     <Portal>\n *       <div>Portal Content outside of the React VDom tree</div>\n *     </Portal>\n *   )\n * }\n */\nexport const Portal = ArkPortal\n","'use client'\n\nimport { useMemo, type PropsWithChildren, type ReactNode } from 'react'\n\n/**\n * This module contains the Show component.\n * @module\n */\n\nexport interface ShowProps {\n  /**\n   * The condition to render memoized children or the fallback content.\n   */\n  when: boolean | null | undefined\n  /**\n   * The children to render when the condition is false.\n   */\n  fallback?: ReactNode\n}\n\n/**\n * Conditionally render a memoized version of the children or optional fallback\n * content.\n * @see https://cerberus.digitalu.design/react/show\n * @example\n * ```tsx\n * <Show when={isLoggedIn} fallback={<Navigate to=\"/login\" />}>\n *   <Dashboard />\n * </Show>\n */\nexport function Show(props: PropsWithChildren<ShowProps>): ReactNode {\n  const { when, children, fallback } = props\n  const condition = useMemo(() => when ?? false, [when])\n\n  return useMemo(() => {\n    if (condition) return children\n    return fallback ?? null\n  }, [condition, children, fallback])\n}\n","import {\n  Combobox,\n  type ComboboxClearTriggerProps,\n  type ComboboxContentProps,\n  type ComboboxControlProps,\n  type ComboboxInputProps,\n  type ComboboxItemGroupLabelProps,\n  type ComboboxItemGroupProps,\n  type ComboboxItemIndicatorProps,\n  type ComboboxItemProps,\n  type ComboboxItemTextProps,\n  type ComboboxLabelProps,\n  type ComboboxPositionerProps,\n  type ComboboxRootProps,\n  type ComboboxTriggerProps,\n} from '@ark-ui/react/combobox'\nimport { ark } from '@ark-ui/react/factory'\nimport type { SelectCollectionItem } from '../select/select'\nimport {\n  combobox,\n  type ComboboxVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport { cx } from '@cerberus/styled-system/css'\nimport type { PropsWithChildren } from 'react'\n\n/**\n * This module contains the primitives of the Combobox.\n * @module 'combobox/primitives'\n */\n\n/**\n * The ComboboxRoot component is the context provider for the Combobox\n * component.\n */\nexport function ComboboxRoot(\n  props: ComboboxRootProps<SelectCollectionItem> & ComboboxVariantProps,\n) {\n  const { size, ...rootProps } = props\n  const styles = combobox({ size })\n  return (\n    <Combobox.Root\n      {...rootProps}\n      className={cx(styles.root, rootProps.className)}\n    />\n  )\n}\n\n/**\n * The label that appears above the combobox input.\n */\nexport function ComboboxLabel(props: ComboboxLabelProps) {\n  const styles = combobox()\n  return (\n    <Combobox.Label {...props} className={cx(styles.label, props.className)} />\n  )\n}\n\n/**\n * The control that wraps the combobox input.\n */\nexport function ComboboxControl(props: ComboboxControlProps) {\n  const styles = combobox()\n  return (\n    <Combobox.Control\n      {...props}\n      className={cx(styles.control, props.className)}\n    />\n  )\n}\n\n/**\n * The input of the combobox.\n */\nexport function ComboboxInput(props: ComboboxInputProps) {\n  const styles = combobox()\n  return (\n    <Combobox.Input {...props} className={cx(styles.input, props.className)} />\n  )\n}\n\n/**\n * The trigger that opens the dropdown.\n */\nexport function ComboboxTrigger(props: ComboboxTriggerProps) {\n  const styles = combobox()\n  return (\n    <Combobox.Trigger\n      {...props}\n      className={cx(styles.trigger, props.className)}\n    />\n  )\n}\n\n/**\n * The trigger to clear the combobox input.\n */\nexport function ComboboxClearTrigger(props: ComboboxClearTriggerProps) {\n  const styles = combobox()\n  return (\n    <Combobox.ClearTrigger\n      {...props}\n      className={cx(styles.clearTrigger, props.className)}\n    />\n  )\n}\n\n/**\n * The positioner that wraps the content.\n */\nexport function ComboboxPositioner(props: ComboboxPositionerProps) {\n  const styles = combobox()\n  return (\n    <Combobox.Positioner\n      {...props}\n      className={cx(styles.positioner, props.className)}\n    />\n  )\n}\n\n/**\n * The content of the combobox component.\n */\nexport function ComboboxContent(\n  props: ComboboxContentProps & ComboboxVariantProps,\n) {\n  const { size, ...contentProps } = props\n  const styles = combobox({ size })\n  return (\n    <Combobox.Content\n      {...contentProps}\n      className={cx(styles.content, contentProps.className)}\n    />\n  )\n}\n\n/**\n * A group of items in the combobox component.\n */\nexport function ComboboxItemGroup(props: ComboboxItemGroupProps) {\n  const styles = combobox()\n  return (\n    <Combobox.ItemGroup\n      {...props}\n      className={cx(styles.itemGroup, props.className)}\n    />\n  )\n}\n\n/**\n * The label for a group of items in the combobox component.\n */\nexport function ComboboxItemGroupLabel(props: ComboboxItemGroupLabelProps) {\n  const styles = combobox()\n  return (\n    <Combobox.ItemGroupLabel\n      {...props}\n      className={cx(styles.itemGroupLabel, props.className)}\n    />\n  )\n}\n\n/**\n * An individual item in the combobox component.\n */\nexport function ComboboxItem(props: ComboboxItemProps) {\n  const styles = combobox()\n  return (\n    <Combobox.Item {...props} className={cx(styles.item, props.className)} />\n  )\n}\n\n/**\n * The text that labels a single item of the combobox.\n */\nexport function ComboboxItemText(props: ComboboxItemTextProps) {\n  const styles = combobox()\n  return (\n    <Combobox.ItemText\n      {...props}\n      className={cx(styles.itemText, props.className)}\n    />\n  )\n}\n\n/**\n * The indicator that appears when the item has been selected.\n */\nexport function ComboboxItemIndicator(props: ComboboxItemIndicatorProps) {\n  const styles = combobox()\n  return (\n    <Combobox.ItemIndicator\n      {...props}\n      className={cx(styles.itemIndicator, props.className)}\n    />\n  )\n}\n\n/**\n * The icon that appears at the start of the combobox input.\n */\nexport function ComboboxStartIcon(props: PropsWithChildren) {\n  const styles = combobox()\n  return <ark.span {...props} className={styles.startIcon} />\n}\n\n// We are only doing this to make the API consistent\nexport const ComboItemText = ComboboxItemText\n\nexport type ComboboxInputValueChangeDetails = Combobox.InputValueChangeDetails\n","import type { ElementType } from 'react'\nimport {\n  ComboboxClearTrigger,\n  ComboboxContent,\n  ComboboxControl,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxItemGroup,\n  ComboboxItemGroupLabel,\n  ComboboxItemIndicator,\n  ComboboxItemText,\n  ComboboxLabel,\n  ComboboxPositioner,\n  ComboboxRoot,\n  ComboboxTrigger,\n} from './primitives'\n\n/**\n * This module contains the parts of the Combobox parts.\n * @module 'combobox/parts'\n */\n\ninterface ComboboxPartsValue {\n  /**\n   * The context provider for the Select component.\n   */\n  Root: ElementType\n  /**\n   * The label that appears above the select input.\n   */\n  Label: ElementType\n  /**\n   * The control that wraps the select trigger.\n   */\n  Control: ElementType\n  /**\n   * The filterable input of the combobox.\n   */\n  Input: ElementType\n  /**\n   * The trigger that opens the dropdown.\n   */\n  Trigger: ElementType\n  /**\n   * The trigger to clear the select input.\n   */\n  ClearTrigger: ElementType\n  /**\n   * The positioner that wraps the content.\n   */\n  Positioner: ElementType\n  /**\n   * The content of the select component.\n   */\n  Content: ElementType\n  /**\n   * A group of items in the select component.\n   */\n  ItemGroup: ElementType\n  /**\n   * The label for a group of items in the select component.\n   */\n  ItemGroupLabel: ElementType\n  /**\n   * An individual item in the select component.\n   */\n  Item: ElementType\n  /**\n   * The text that labels a single radio of the field.\n   */\n  ItemText: ElementType\n  /**\n   * The indicator that appears when the item has been selected.\n   */\n  ItemIndicator: ElementType\n}\n\n/**\n * An Object containing the parts of the Radio component. For users that\n * prefer Object component syntax.\n *\n * @remarks\n *\n * When using object component syntax, you import the ComboboxParts object and\n * the entire family of components vs. only what you use.\n */\nexport const ComboboxParts: ComboboxPartsValue = {\n  Root: ComboboxRoot,\n  Label: ComboboxLabel,\n  Control: ComboboxControl,\n  Input: ComboboxInput,\n  Trigger: ComboboxTrigger,\n  ClearTrigger: ComboboxClearTrigger,\n  Positioner: ComboboxPositioner,\n  Content: ComboboxContent,\n  ItemGroup: ComboboxItemGroup,\n  ItemGroupLabel: ComboboxItemGroupLabel,\n  Item: ComboboxItem,\n  ItemText: ComboboxItemText,\n  ItemIndicator: ComboboxItemIndicator,\n}\n"],"mappings":"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","names":["Combobox","import_react","ArkPortal","import_react","import_jsx_runtime","import_jsx_runtime","Combobox"]}