@cerberus-design/react 0.15.0 → 0.16.0-next-4f6c716

package/build/legacy/components/radio/radio.cjs

@@ -0,0 +1,82 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/radio/radio.tsx
+var radio_exports = {};
+__export(radio_exports, {
+  Radio: () => Radio
+});
+module.exports = __toCommonJS(radio_exports);
+
+// src/components/radio/primitives.tsx
+var import_radio_group = require("@ark-ui/react/radio-group");
+var import_css = require("@cerberus/styled-system/css");
+var import_recipes = require("@cerberus/styled-system/recipes");
+var import_jsx_runtime = require("react/jsx-runtime");
+function RadioGroupItem(props) {
+  const styles = (0, import_recipes.radioGroup)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_radio_group.RadioGroup.Item,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.item, props.className)
+    }
+  );
+}
+function RadioGroupItemText(props) {
+  const { size, orientation, ...itemTextProps } = props;
+  const styles = (0, import_recipes.radioGroup)({ size, orientation });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_radio_group.RadioGroup.ItemText,
+    {
+      ...itemTextProps,
+      className: (0, import_css.cx)(styles.itemText, itemTextProps.className)
+    }
+  );
+}
+function RadioGroupItemControl(props) {
+  const { size, orientation, ...itemControlProps } = props;
+  const styles = (0, import_recipes.radioGroup)({ size, orientation });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_radio_group.RadioGroup.ItemControl,
+    {
+      ...itemControlProps,
+      className: (0, import_css.cx)(styles.itemControl, itemControlProps.className)
+    }
+  );
+}
+function RadioGroupItemHiddenInput(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radio_group.RadioGroup.ItemHiddenInput, { ...props });
+}
+
+// src/components/radio/radio.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function Radio(props) {
+  const { size, children, ...groupProps } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(RadioGroupItem, { ...groupProps, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(RadioGroupItemControl, { size }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(RadioGroupItemText, { size, children }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(RadioGroupItemHiddenInput, {})
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Radio
+});
+//# sourceMappingURL=radio.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/radio/radio.tsx","../../../../src/components/radio/primitives.tsx"],"sourcesContent":["import type { RadioGroupItemProps } from '@ark-ui/react'\nimport { type RadioGroupVariantProps } from '@cerberus/styled-system/recipes'\nimport {\n  RadioGroupItem,\n  RadioGroupItemControl,\n  RadioGroupItemHiddenInput,\n  RadioGroupItemText,\n} from './primitives'\n\n/**\n * This module contains the Radio component.\n * @module\n */\n\nexport type RadioProps = RadioGroupVariantProps & RadioGroupItemProps\n\n/**\n * The Radio component is used to allow users to select a single option from a list of options.\n * @see https://cerberus.digitalu.design/react/radio\n * @memberof module:Field\n * @example\n * ```tsx\n * <Radio value=\"option1\">Option 1</Radio>\n * ```\n */\nexport function Radio(props: RadioProps) {\n  const { size, children, ...groupProps } = props\n  return (\n    <RadioGroupItem {...groupProps}>\n      <RadioGroupItemControl size={size} />\n      <RadioGroupItemText size={size}>{children}</RadioGroupItemText>\n      <RadioGroupItemHiddenInput />\n    </RadioGroupItem>\n  )\n}\n","import {\n  RadioGroup as ArkRadioGroup,\n  type RadioGroupIndicatorProps,\n  type RadioGroupItemControlProps,\n  type RadioGroupItemHiddenInputProps,\n  type RadioGroupItemProps,\n  type RadioGroupItemTextProps,\n  type RadioGroupLabelProps,\n  type RadioGroupRootProps,\n} from '@ark-ui/react/radio-group'\nimport { cx } from '@cerberus/styled-system/css'\nimport {\n  radioGroup,\n  type RadioGroupVariantProps,\n} from '@cerberus/styled-system/recipes'\n\n/**\n * This module contains the Radio primitives\n * @module 'react/radio'\n */\n\n/**\n * The RadioGroupRoot component is used to group radio buttons together.\n */\nexport function RadioGroupRoot(\n  props: RadioGroupRootProps & RadioGroupVariantProps,\n) {\n  const { size, orientation, ...rootProps } = props\n  const styles = radioGroup({ size, orientation })\n  return (\n    <ArkRadioGroup.Root\n      {...rootProps}\n      className={cx(styles.root, rootProps.className)}\n    />\n  )\n}\n\n/**\n * The RadioGroupLabel component is used to label a group of radio buttons.\n */\nexport function RadioGroupLabel(props: RadioGroupLabelProps) {\n  const styles = radioGroup()\n  return (\n    <ArkRadioGroup.Label\n      {...props}\n      className={cx(styles.label, props.className)}\n    />\n  )\n}\n\n/**\n * The RadioGroupIndicator component is used to indicate the selected radio\n * button in a group.\n */\nexport function RadioGroupIndicator(props: RadioGroupIndicatorProps) {\n  const styles = radioGroup()\n  return (\n    <ArkRadioGroup.Indicator\n      {...props}\n      className={cx(styles.indicator, props.className)}\n    />\n  )\n}\n\n/**\n * The RadioGroupItem component is used to render a single radio button in a\n * group.\n */\nexport function RadioGroupItem(props: RadioGroupItemProps) {\n  const styles = radioGroup()\n  return (\n    <ArkRadioGroup.Item\n      {...props}\n      className={cx(styles.item, props.className)}\n    />\n  )\n}\n\n/**\n * The RadioGroupItemText component is used to render the text label for a\n * single radio button in a group.\n */\nexport function RadioGroupItemText(\n  props: RadioGroupItemTextProps & RadioGroupVariantProps,\n) {\n  const { size, orientation, ...itemTextProps } = props\n  const styles = radioGroup({ size, orientation })\n  return (\n    <ArkRadioGroup.ItemText\n      {...itemTextProps}\n      className={cx(styles.itemText, itemTextProps.className)}\n    />\n  )\n}\n\n/**\n * The RadioGroupItemControl component is used to render the control for a\n * single radio button in a group.\n */\nexport function RadioGroupItemControl(\n  props: RadioGroupItemControlProps & RadioGroupVariantProps,\n) {\n  const { size, orientation, ...itemControlProps } = props\n  const styles = radioGroup({ size, orientation })\n  return (\n    <ArkRadioGroup.ItemControl\n      {...itemControlProps}\n      className={cx(styles.itemControl, itemControlProps.className)}\n    />\n  )\n}\n\n/**\n * The RadioGroupItemHiddenInput component is used to render the hidden input\n * for a single radio button in a group.\n */\nexport function RadioGroupItemHiddenInput(\n  props: RadioGroupItemHiddenInputProps,\n) {\n  return <ArkRadioGroup.ItemHiddenInput {...props} />\n}\n\nexport const RadioGroup = RadioGroupRoot\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,yBASO;AACP,iBAAmB;AACnB,qBAGO;AAgBH;AAsCG,SAAS,eAAe,OAA4B;AACzD,QAAM,aAAS,2BAAW;AAC1B,SACE;AAAA,IAAC,mBAAAA,WAAc;AAAA,IAAd;AAAA,MACE,GAAG;AAAA,MACJ,eAAW,eAAG,OAAO,MAAM,MAAM,SAAS;AAAA;AAAA,EAC5C;AAEJ;AAMO,SAAS,mBACd,OACA;AACA,QAAM,EAAE,MAAM,aAAa,GAAG,cAAc,IAAI;AAChD,QAAM,aAAS,2BAAW,EAAE,MAAM,YAAY,CAAC;AAC/C,SACE;AAAA,IAAC,mBAAAA,WAAc;AAAA,IAAd;AAAA,MACE,GAAG;AAAA,MACJ,eAAW,eAAG,OAAO,UAAU,cAAc,SAAS;AAAA;AAAA,EACxD;AAEJ;AAMO,SAAS,sBACd,OACA;AACA,QAAM,EAAE,MAAM,aAAa,GAAG,iBAAiB,IAAI;AACnD,QAAM,aAAS,2BAAW,EAAE,MAAM,YAAY,CAAC;AAC/C,SACE;AAAA,IAAC,mBAAAA,WAAc;AAAA,IAAd;AAAA,MACE,GAAG;AAAA,MACJ,eAAW,eAAG,OAAO,aAAa,iBAAiB,SAAS;AAAA;AAAA,EAC9D;AAEJ;AAMO,SAAS,0BACd,OACA;AACA,SAAO,4CAAC,mBAAAA,WAAc,iBAAd,EAA+B,GAAG,OAAO;AACnD;;;AD5FI,IAAAC,sBAAA;AAHG,SAAS,MAAM,OAAmB;AACvC,QAAM,EAAE,MAAM,UAAU,GAAG,WAAW,IAAI;AAC1C,SACE,8CAAC,kBAAgB,GAAG,YAClB;AAAA,iDAAC,yBAAsB,MAAY;AAAA,IACnC,6CAAC,sBAAmB,MAAa,UAAS;AAAA,IAC1C,6CAAC,6BAA0B;AAAA,KAC7B;AAEJ;","names":["ArkRadioGroup","import_jsx_runtime"]}

package/build/legacy/components/select/index.cjs

@@ -0,0 +1,265 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/select/index.ts
+var select_exports = {};
+__export(select_exports, {
+  Option: () => Option,
+  OptionGroup: () => OptionGroup,
+  OptionGroupLabel: () => OptionGroupLabel,
+  Select: () => Select2,
+  SelectClearTrigger: () => SelectClearTrigger,
+  SelectContent: () => SelectContent,
+  SelectControl: () => SelectControl,
+  SelectHiddenSelect: () => SelectHiddenSelect,
+  SelectIndicator: () => SelectIndicator,
+  SelectItem: () => SelectItem,
+  SelectItemGroup: () => SelectItemGroup,
+  SelectItemGroupLabel: () => SelectItemGroupLabel,
+  SelectItemIndicator: () => SelectItemIndicator,
+  SelectItemText: () => SelectItemText,
+  SelectLabel: () => SelectLabel,
+  SelectParts: () => SelectParts,
+  SelectPositioner: () => SelectPositioner,
+  SelectRoot: () => SelectRoot,
+  SelectTrigger: () => SelectTrigger,
+  SelectValueText: () => SelectValueText,
+  createSelectCollection: () => createSelectCollection
+});
+module.exports = __toCommonJS(select_exports);
+
+// src/components/select/primitives.tsx
+var import_select = require("@ark-ui/react/select");
+var import_recipes = require("@cerberus/styled-system/recipes");
+var import_css = require("@cerberus/styled-system/css");
+var import_jsx_runtime = require("react/jsx-runtime");
+function SelectRoot(props) {
+  const { size, ...rootProps } = props;
+  const styles = (0, import_recipes.select)({ size });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.Root,
+    {
+      ...rootProps,
+      className: (0, import_css.cx)(styles.root, rootProps.className)
+    }
+  );
+}
+function SelectLabel(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.Label, { ...props, className: (0, import_css.cx)(styles.label, props.className) });
+}
+function SelectControl(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.Control, { ...props });
+}
+function SelectTrigger(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.Trigger,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.trigger, props.className)
+    }
+  );
+}
+function SelectValueText(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.ValueText, { ...props });
+}
+function SelectIndicator(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.Indicator,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.indicator, props.className)
+    }
+  );
+}
+function SelectClearTrigger(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.ClearTrigger, { ...props });
+}
+function SelectPositioner(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.Positioner,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.positioner, props.className)
+    }
+  );
+}
+function SelectContent(props) {
+  const { size, ...contentProps } = props;
+  const styles = (0, import_recipes.select)({ size });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.Content,
+    {
+      ...contentProps,
+      className: (0, import_css.cx)(styles.content, contentProps.className)
+    }
+  );
+}
+function SelectItemGroup(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.ItemGroup, { ...props });
+}
+function SelectItemGroupLabel(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.ItemGroupLabel,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.itemGroupLabel, props.className)
+    }
+  );
+}
+function SelectItem(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.Item, { ...props, className: (0, import_css.cx)(styles.item, props.className) });
+}
+function SelectItemText(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.ItemText, { ...props });
+}
+function SelectItemIndicator(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.ItemIndicator,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.itemIndicator, props.className)
+    }
+  );
+}
+function SelectHiddenSelect(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.HiddenSelect, { ...props });
+}
+function createSelectCollection(collection) {
+  return (0, import_select.createListCollection)({
+    items: collection
+  });
+}
+
+// src/components/select/parts.ts
+var SelectParts = {
+  Root: SelectRoot,
+  Label: SelectLabel,
+  Control: SelectControl,
+  Trigger: SelectTrigger,
+  ClearTrigger: SelectClearTrigger,
+  ValueText: SelectValueText,
+  Indicator: SelectIndicator,
+  Positioner: SelectPositioner,
+  Content: SelectContent,
+  ItemGroup: SelectItemGroup,
+  ItemGroupLabel: SelectItemGroupLabel,
+  Item: SelectItem,
+  ItemText: SelectItemText,
+  ItemIndicator: SelectItemIndicator,
+  HiddenSelect: SelectHiddenSelect
+};
+
+// src/components/select/select.tsx
+var import_jsx = require("@cerberus/styled-system/jsx");
+
+// src/context/cerberus.tsx
+var import_react = require("react");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var CerberusContext = (0, import_react.createContext)(null);
+function useCerberusContext() {
+  const context = (0, import_react.useContext)(CerberusContext);
+  if (!context) {
+    throw new Error("useCerberus must be used within a CerberusProvider");
+  }
+  return context;
+}
+
+// src/components/Portal.tsx
+var import_react2 = require("@ark-ui/react");
+var Portal = import_react2.Portal;
+
+// src/components/Show.tsx
+var import_react3 = require("react");
+function Show(props) {
+  const { when, children, fallback } = props;
+  const condition = (0, import_react3.useMemo)(() => when ?? false, [when]);
+  return (0, import_react3.useMemo)(() => {
+    if (condition) return children;
+    return fallback ?? null;
+  }, [condition, children, fallback]);
+}
+
+// src/components/select/select.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function Select2(props) {
+  const { collection, placeholder, ...rootProps } = props;
+  const { icons } = useCerberusContext();
+  const { selectArrow: SelectArrow, invalid: InvalidIcon } = icons;
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(SelectParts.Root, { collection, ...rootProps, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SelectParts.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(SelectParts.Trigger, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SelectParts.ValueText, { placeholder }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx.HStack, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Show, { when: props.invalid, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(InvalidIcon, { "data-part": "invalid-icon" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SelectParts.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SelectArrow, {}) })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SelectParts.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SelectParts.Content, { size: rootProps.size, children: props.children }) }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SelectParts.HiddenSelect, {})
+  ] });
+}
+function Option(props) {
+  const { item, ...itemProps } = props;
+  const { icons } = useCerberusContext();
+  const { selectChecked: CheckedIcon } = icons;
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(SelectParts.Item, { ...itemProps, item, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SelectParts.ItemText, { children: item == null ? void 0 : item.label }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SelectParts.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CheckedIcon, {}) })
+  ] });
+}
+
+// src/components/select/option-group.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function OptionGroup(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SelectItemGroup, { ...props });
+}
+function OptionGroupLabel(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SelectItemGroupLabel, { ...props });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Option,
+  OptionGroup,
+  OptionGroupLabel,
+  Select,
+  SelectClearTrigger,
+  SelectContent,
+  SelectControl,
+  SelectHiddenSelect,
+  SelectIndicator,
+  SelectItem,
+  SelectItemGroup,
+  SelectItemGroupLabel,
+  SelectItemIndicator,
+  SelectItemText,
+  SelectLabel,
+  SelectParts,
+  SelectPositioner,
+  SelectRoot,
+  SelectTrigger,
+  SelectValueText,
+  createSelectCollection
+});
+//# sourceMappingURL=index.cjs.map

package/build/legacy/components/select/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/select/index.ts","../../../../src/components/select/primitives.tsx","../../../../src/components/select/parts.ts","../../../../src/components/select/select.tsx","../../../../src/context/cerberus.tsx","../../../../src/components/Portal.tsx","../../../../src/components/Show.tsx","../../../../src/components/select/option-group.tsx"],"sourcesContent":["export * from './parts'\nexport * from './primitives'\nexport * from './select'\nexport * from './option-group'\n","import {\n  createListCollection,\n  Select,\n  type ListCollection,\n  type SelectClearTriggerProps,\n  type SelectContentProps,\n  type SelectControlProps,\n  type SelectHiddenSelectProps,\n  type SelectIndicatorProps,\n  type SelectItemGroupLabelProps,\n  type SelectItemGroupProps,\n  type SelectItemIndicatorProps,\n  type SelectItemProps,\n  type SelectItemTextProps,\n  type SelectLabelProps,\n  type SelectPositionerProps,\n  type SelectRootProps,\n  type SelectTriggerProps,\n  type SelectValueChangeDetails,\n  type SelectValueTextProps,\n} from '@ark-ui/react/select'\nimport {\n  select,\n  type SelectVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport { cx } from '@cerberus/styled-system/css'\nimport type { SelectCollectionItem } from './select'\n\n/**\n * This module contains the Select primitives\n * @module 'react/select'\n */\n\n/**\n * The SelectRoot component is the context provider for the Select component.\n */\nexport function SelectRoot(\n  props: SelectRootProps<SelectCollectionItem> & SelectVariantProps,\n) {\n  const { size, ...rootProps } = props\n  const styles = select({ size })\n  return (\n    <Select.Root\n      {...rootProps}\n      className={cx(styles.root, rootProps.className)}\n    />\n  )\n}\n\n/**\n * The label that appears above the select input.\n */\nexport function SelectLabel(props: SelectLabelProps) {\n  const styles = select()\n  return (\n    <Select.Label {...props} className={cx(styles.label, props.className)} />\n  )\n}\n\n/**\n * The control that wraps the select trigger.\n */\nexport function SelectControl(props: SelectControlProps) {\n  return <Select.Control {...props} />\n}\n\n/**\n * The trigger that opens the dropdown.\n */\nexport function SelectTrigger(props: SelectTriggerProps) {\n  const styles = select()\n  return (\n    <Select.Trigger\n      {...props}\n      className={cx(styles.trigger, props.className)}\n    />\n  )\n}\n\n/**\n * The text that appears in the trigger.\n */\nexport function SelectValueText(props: SelectValueTextProps) {\n  return <Select.ValueText {...props} />\n}\n\n/**\n * The indicator that appears in the trigger.\n */\nexport function SelectIndicator(props: SelectIndicatorProps) {\n  const styles = select()\n  return (\n    <Select.Indicator\n      {...props}\n      className={cx(styles.indicator, props.className)}\n    />\n  )\n}\n\n/**\n * The trigger that clears the selected value.\n */\nexport function SelectClearTrigger(props: SelectClearTriggerProps) {\n  return <Select.ClearTrigger {...props} />\n}\n\n/**\n * The positioner that contains the dropdown.\n */\nexport function SelectPositioner(props: SelectPositionerProps) {\n  const styles = select()\n  return (\n    <Select.Positioner\n      {...props}\n      className={cx(styles.positioner, props.className)}\n    />\n  )\n}\n\n/**\n * The content of the dropdown (i.e. the container itself).\n */\nexport function SelectContent(props: SelectContentProps & SelectVariantProps) {\n  const { size, ...contentProps } = props\n  const styles = select({ size })\n  return (\n    <Select.Content\n      {...contentProps}\n      className={cx(styles.content, contentProps.className)}\n    />\n  )\n}\n\n/**\n * The container for a group of item options.\n */\nexport function SelectItemGroup(props: SelectItemGroupProps) {\n  return <Select.ItemGroup {...props} />\n}\n\n/**\n * The label for a group of item options.\n */\nexport function SelectItemGroupLabel(props: SelectItemGroupLabelProps) {\n  const styles = select()\n  return (\n    <Select.ItemGroupLabel\n      {...props}\n      className={cx(styles.itemGroupLabel, props.className)}\n    />\n  )\n}\n\n/**\n * The container for an item in the select content.\n */\nexport function SelectItem(props: SelectItemProps) {\n  const styles = select()\n  return <Select.Item {...props} className={cx(styles.item, props.className)} />\n}\n\n/**\n * The text for an item option.\n */\nexport function SelectItemText(props: SelectItemTextProps) {\n  return <Select.ItemText {...props} />\n}\n\n/**\n * The indicator for an item option shown when it is selected.\n */\nexport function SelectItemIndicator(props: SelectItemIndicatorProps) {\n  const styles = select()\n  return (\n    <Select.ItemIndicator\n      {...props}\n      className={cx(styles.itemIndicator, props.className)}\n    />\n  )\n}\n\n/**\n * The native input for a select item.\n */\nexport function SelectHiddenSelect(props: SelectHiddenSelectProps) {\n  return <Select.HiddenSelect {...props} />\n}\n\n/**\n * A helper function to create a SelectCollection object.\n * @param collection - An array of SelectCollectionItem objects that matches\n * the following shape:\n * ```ts\n * [{ label: 'Hades', value: 'hades', disabled?: true }]\n * ```\n */\nexport function createSelectCollection(\n  collection: SelectCollectionItem[],\n): ListCollection<SelectCollectionItem> {\n  return createListCollection({\n    items: collection,\n  })\n}\n\nexport type { SelectValueChangeDetails, ListCollection }\n","import type { ElementType } from 'react'\nimport {\n  SelectClearTrigger,\n  SelectContent,\n  SelectControl,\n  SelectHiddenSelect,\n  SelectIndicator,\n  SelectItem,\n  SelectItemGroup,\n  SelectItemGroupLabel,\n  SelectItemIndicator,\n  SelectItemText,\n  SelectLabel,\n  SelectPositioner,\n  SelectRoot,\n  SelectTrigger,\n  SelectValueText,\n} from './primitives'\n\n/**\n * This module contains the parts of the Select parts.\n * @module 'select/parts'\n */\n\ninterface SelectPartsValue {\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 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 text that appears in the trigger.\n   */\n  ValueText: ElementType\n  /**\n   * The indicator that appears in the trigger.\n   */\n  Indicator: 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   * The native select for use within a field.\n   */\n  HiddenSelect: 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 SelectParts object and\n * the entire family of components vs. only what you use.\n */\nexport const SelectParts: SelectPartsValue = {\n  Root: SelectRoot,\n  Label: SelectLabel,\n  Control: SelectControl,\n  Trigger: SelectTrigger,\n  ClearTrigger: SelectClearTrigger,\n  ValueText: SelectValueText,\n  Indicator: SelectIndicator,\n  Positioner: SelectPositioner,\n  Content: SelectContent,\n  ItemGroup: SelectItemGroup,\n  ItemGroupLabel: SelectItemGroupLabel,\n  Item: SelectItem,\n  ItemText: SelectItemText,\n  ItemIndicator: SelectItemIndicator,\n  HiddenSelect: SelectHiddenSelect,\n}\n","'use client'\n\nimport type { SelectItemProps, SelectRootProps } from '@ark-ui/react/select'\nimport { type SelectVariantProps } from '@cerberus/styled-system/recipes'\nimport { HStack } from '@cerberus/styled-system/jsx'\nimport { useCerberusContext } from '../../context/cerberus'\nimport { Portal } from '../Portal'\nimport { Show } from '../Show'\nimport { SelectParts } from './parts'\n\n/**\n * This module contains the Select components.\n * @module 'react/select'\n */\n\nexport interface SelectCollectionItem {\n  /**\n   * What is displayed in the dropdown list.\n   */\n  label: string\n  /**\n   * The value of the selected item used in the form.\n   */\n  value: string\n  /**\n   * If the item is disabled.\n   */\n  disabled?: boolean\n}\n\nexport interface SelectCollection {\n  /**\n   * The items to be displayed in the dropdown list.\n   */\n  items: SelectCollectionItem[]\n}\n\nexport interface BaseSelectProps {\n  /**\n   * The placeholder text when no option is selected.\n   */\n  placeholder?: string\n}\n\nexport type SelectProps = SelectRootProps<SelectCollectionItem> &\n  BaseSelectProps &\n  SelectVariantProps\n\n/**\n * The Select component is a dropdown list that allows users to select an\n * option from a list.\n * @definition [Select docs](https://cerberus.digitalu.design/react/select)\n * @definition [ARK docs](https://ark-ui.com/react/docs/components/select)\n * @example\n * ```tsx\n * import { Select, Option, createListCollection } from '@cerberus-design/react'\n *\n * export function SelectBasicPreview() {\n *  const collection = createListCollection({\n *   items: [\n *    { label: 'Hades', value: 'hades' },\n *    { label: 'Persephone', value: 'persephone' },\n *    { label: 'Zeus', value: 'zeus', disabled: true },\n *   ]\n *  })\n *\n *  return (\n *   <Select\n *    collection={collection}\n *    label=\"Select Relative\"\n *    placeholder=\"Choose option\"\n *   >\n *   {collection.items.map((item) => (\n *    <Option key={item.value} item={item} />\n *   ))}\n *  </Select>\n *  )\n * }\n */\nexport function Select(props: SelectProps) {\n  const { collection, placeholder, ...rootProps } = props\n  const { icons } = useCerberusContext()\n  const { selectArrow: SelectArrow, invalid: InvalidIcon } = icons\n\n  return (\n    <SelectParts.Root collection={collection} {...rootProps}>\n      <SelectParts.Control>\n        <SelectParts.Trigger>\n          <SelectParts.ValueText placeholder={placeholder} />\n\n          <HStack>\n            <Show when={props.invalid}>\n              <InvalidIcon data-part=\"invalid-icon\" />\n            </Show>\n            <SelectParts.Indicator>\n              <SelectArrow />\n            </SelectParts.Indicator>\n          </HStack>\n        </SelectParts.Trigger>\n      </SelectParts.Control>\n\n      <Portal>\n        <SelectParts.Positioner>\n          <SelectParts.Content size={rootProps.size}>\n            {props.children}\n          </SelectParts.Content>\n        </SelectParts.Positioner>\n      </Portal>\n\n      <SelectParts.HiddenSelect />\n    </SelectParts.Root>\n  )\n}\n\nexport interface OptionProps extends SelectItemProps {\n  /**\n   * The CollectionListItem to be displayed in the dropdown list.\n   */\n  item: SelectCollectionItem\n}\n\nexport function Option(props: OptionProps) {\n  const { item, ...itemProps } = props\n  const { icons } = useCerberusContext()\n  const { selectChecked: CheckedIcon } = icons\n\n  return (\n    <SelectParts.Item {...itemProps} item={item}>\n      <SelectParts.ItemText>{item?.label}</SelectParts.ItemText>\n      <SelectParts.ItemIndicator>\n        <CheckedIcon />\n      </SelectParts.ItemIndicator>\n    </SelectParts.Item>\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 type {\n  SelectItemGroupLabelProps,\n  SelectItemGroupProps,\n} from '@ark-ui/react/select'\nimport { SelectItemGroup, SelectItemGroupLabel } from './primitives'\n\n/**\n * The OptionGroup component is a group of options in the dropdown list.\n * @definition [Select docs](https://cerberus.digitalu.design/react/select)\n * @definition [ARK docs](https://ark-ui.com/react/docs/components/select)\n * @example\n * ```tsx\n * <OptionGroup>\n *  <OptionGroupLabel>Greek gods</OptionGroupLabel>\n *  ...\n * </OptionGroup>\n * ```\n */\nexport function OptionGroup(props: SelectItemGroupProps) {\n  return <SelectItemGroup {...props} />\n}\n\n/**\n * The OptionGroupLabel component is the label of the OptionGroup.\n * @definition [Select docs](https://cerberus.digitalu.design/react/select)\n * @definition [ARK docs](https://ark-ui.com/react/docs/components/select)\n * @example\n * ```tsx\n * <OptionGroupLabel>Greek gods</OptionGroupLabel>\n * ```\n */\nexport function OptionGroupLabel(props: SelectItemGroupLabelProps) {\n  return <SelectItemGroupLabel {...props} />\n}\n"],"mappings":"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","names":["Select","import_jsx_runtime","import_react","ArkPortal","import_react","import_jsx_runtime","Select","import_jsx_runtime"]}

package/build/legacy/components/select/option-group.cjs

@@ -0,0 +1,60 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/select/option-group.tsx
+var option_group_exports = {};
+__export(option_group_exports, {
+  OptionGroup: () => OptionGroup,
+  OptionGroupLabel: () => OptionGroupLabel
+});
+module.exports = __toCommonJS(option_group_exports);
+
+// src/components/select/primitives.tsx
+var import_select = require("@ark-ui/react/select");
+var import_recipes = require("@cerberus/styled-system/recipes");
+var import_css = require("@cerberus/styled-system/css");
+var import_jsx_runtime = require("react/jsx-runtime");
+function SelectItemGroup(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.ItemGroup, { ...props });
+}
+function SelectItemGroupLabel(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.ItemGroupLabel,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.itemGroupLabel, props.className)
+    }
+  );
+}
+
+// src/components/select/option-group.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function OptionGroup(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(SelectItemGroup, { ...props });
+}
+function OptionGroupLabel(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(SelectItemGroupLabel, { ...props });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  OptionGroup,
+  OptionGroupLabel
+});
+//# sourceMappingURL=option-group.cjs.map

package/build/legacy/components/select/option-group.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/select/option-group.tsx","../../../../src/components/select/primitives.tsx"],"sourcesContent":["import type {\n  SelectItemGroupLabelProps,\n  SelectItemGroupProps,\n} from '@ark-ui/react/select'\nimport { SelectItemGroup, SelectItemGroupLabel } from './primitives'\n\n/**\n * The OptionGroup component is a group of options in the dropdown list.\n * @definition [Select docs](https://cerberus.digitalu.design/react/select)\n * @definition [ARK docs](https://ark-ui.com/react/docs/components/select)\n * @example\n * ```tsx\n * <OptionGroup>\n *  <OptionGroupLabel>Greek gods</OptionGroupLabel>\n *  ...\n * </OptionGroup>\n * ```\n */\nexport function OptionGroup(props: SelectItemGroupProps) {\n  return <SelectItemGroup {...props} />\n}\n\n/**\n * The OptionGroupLabel component is the label of the OptionGroup.\n * @definition [Select docs](https://cerberus.digitalu.design/react/select)\n * @definition [ARK docs](https://ark-ui.com/react/docs/components/select)\n * @example\n * ```tsx\n * <OptionGroupLabel>Greek gods</OptionGroupLabel>\n * ```\n */\nexport function OptionGroupLabel(props: SelectItemGroupLabelProps) {\n  return <SelectItemGroupLabel {...props} />\n}\n","import {\n  createListCollection,\n  Select,\n  type ListCollection,\n  type SelectClearTriggerProps,\n  type SelectContentProps,\n  type SelectControlProps,\n  type SelectHiddenSelectProps,\n  type SelectIndicatorProps,\n  type SelectItemGroupLabelProps,\n  type SelectItemGroupProps,\n  type SelectItemIndicatorProps,\n  type SelectItemProps,\n  type SelectItemTextProps,\n  type SelectLabelProps,\n  type SelectPositionerProps,\n  type SelectRootProps,\n  type SelectTriggerProps,\n  type SelectValueChangeDetails,\n  type SelectValueTextProps,\n} from '@ark-ui/react/select'\nimport {\n  select,\n  type SelectVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport { cx } from '@cerberus/styled-system/css'\nimport type { SelectCollectionItem } from './select'\n\n/**\n * This module contains the Select primitives\n * @module 'react/select'\n */\n\n/**\n * The SelectRoot component is the context provider for the Select component.\n */\nexport function SelectRoot(\n  props: SelectRootProps<SelectCollectionItem> & SelectVariantProps,\n) {\n  const { size, ...rootProps } = props\n  const styles = select({ size })\n  return (\n    <Select.Root\n      {...rootProps}\n      className={cx(styles.root, rootProps.className)}\n    />\n  )\n}\n\n/**\n * The label that appears above the select input.\n */\nexport function SelectLabel(props: SelectLabelProps) {\n  const styles = select()\n  return (\n    <Select.Label {...props} className={cx(styles.label, props.className)} />\n  )\n}\n\n/**\n * The control that wraps the select trigger.\n */\nexport function SelectControl(props: SelectControlProps) {\n  return <Select.Control {...props} />\n}\n\n/**\n * The trigger that opens the dropdown.\n */\nexport function SelectTrigger(props: SelectTriggerProps) {\n  const styles = select()\n  return (\n    <Select.Trigger\n      {...props}\n      className={cx(styles.trigger, props.className)}\n    />\n  )\n}\n\n/**\n * The text that appears in the trigger.\n */\nexport function SelectValueText(props: SelectValueTextProps) {\n  return <Select.ValueText {...props} />\n}\n\n/**\n * The indicator that appears in the trigger.\n */\nexport function SelectIndicator(props: SelectIndicatorProps) {\n  const styles = select()\n  return (\n    <Select.Indicator\n      {...props}\n      className={cx(styles.indicator, props.className)}\n    />\n  )\n}\n\n/**\n * The trigger that clears the selected value.\n */\nexport function SelectClearTrigger(props: SelectClearTriggerProps) {\n  return <Select.ClearTrigger {...props} />\n}\n\n/**\n * The positioner that contains the dropdown.\n */\nexport function SelectPositioner(props: SelectPositionerProps) {\n  const styles = select()\n  return (\n    <Select.Positioner\n      {...props}\n      className={cx(styles.positioner, props.className)}\n    />\n  )\n}\n\n/**\n * The content of the dropdown (i.e. the container itself).\n */\nexport function SelectContent(props: SelectContentProps & SelectVariantProps) {\n  const { size, ...contentProps } = props\n  const styles = select({ size })\n  return (\n    <Select.Content\n      {...contentProps}\n      className={cx(styles.content, contentProps.className)}\n    />\n  )\n}\n\n/**\n * The container for a group of item options.\n */\nexport function SelectItemGroup(props: SelectItemGroupProps) {\n  return <Select.ItemGroup {...props} />\n}\n\n/**\n * The label for a group of item options.\n */\nexport function SelectItemGroupLabel(props: SelectItemGroupLabelProps) {\n  const styles = select()\n  return (\n    <Select.ItemGroupLabel\n      {...props}\n      className={cx(styles.itemGroupLabel, props.className)}\n    />\n  )\n}\n\n/**\n * The container for an item in the select content.\n */\nexport function SelectItem(props: SelectItemProps) {\n  const styles = select()\n  return <Select.Item {...props} className={cx(styles.item, props.className)} />\n}\n\n/**\n * The text for an item option.\n */\nexport function SelectItemText(props: SelectItemTextProps) {\n  return <Select.ItemText {...props} />\n}\n\n/**\n * The indicator for an item option shown when it is selected.\n */\nexport function SelectItemIndicator(props: SelectItemIndicatorProps) {\n  const styles = select()\n  return (\n    <Select.ItemIndicator\n      {...props}\n      className={cx(styles.itemIndicator, props.className)}\n    />\n  )\n}\n\n/**\n * The native input for a select item.\n */\nexport function SelectHiddenSelect(props: SelectHiddenSelectProps) {\n  return <Select.HiddenSelect {...props} />\n}\n\n/**\n * A helper function to create a SelectCollection object.\n * @param collection - An array of SelectCollectionItem objects that matches\n * the following shape:\n * ```ts\n * [{ label: 'Hades', value: 'hades', disabled?: true }]\n * ```\n */\nexport function createSelectCollection(\n  collection: SelectCollectionItem[],\n): ListCollection<SelectCollectionItem> {\n  return createListCollection({\n    items: collection,\n  })\n}\n\nexport type { SelectValueChangeDetails, ListCollection }\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,oBAoBO;AACP,qBAGO;AACP,iBAAmB;AAiBf;AA8FG,SAAS,gBAAgB,OAA6B;AAC3D,SAAO,4CAAC,qBAAO,WAAP,EAAkB,GAAG,OAAO;AACtC;AAKO,SAAS,qBAAqB,OAAkC;AACrE,QAAM,aAAS,uBAAO;AACtB,SACE;AAAA,IAAC,qBAAO;AAAA,IAAP;AAAA,MACE,GAAG;AAAA,MACJ,eAAW,eAAG,OAAO,gBAAgB,MAAM,SAAS;AAAA;AAAA,EACtD;AAEJ;;;ADpIS,IAAAA,sBAAA;AADF,SAAS,YAAY,OAA6B;AACvD,SAAO,6CAAC,mBAAiB,GAAG,OAAO;AACrC;AAWO,SAAS,iBAAiB,OAAkC;AACjE,SAAO,6CAAC,wBAAsB,GAAG,OAAO;AAC1C;","names":["import_jsx_runtime"]}

package/build/legacy/components/select/parts.cjs

@@ -0,0 +1,153 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/select/parts.ts
+var parts_exports = {};
+__export(parts_exports, {
+  SelectParts: () => SelectParts
+});
+module.exports = __toCommonJS(parts_exports);
+
+// src/components/select/primitives.tsx
+var import_select = require("@ark-ui/react/select");
+var import_recipes = require("@cerberus/styled-system/recipes");
+var import_css = require("@cerberus/styled-system/css");
+var import_jsx_runtime = require("react/jsx-runtime");
+function SelectRoot(props) {
+  const { size, ...rootProps } = props;
+  const styles = (0, import_recipes.select)({ size });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.Root,
+    {
+      ...rootProps,
+      className: (0, import_css.cx)(styles.root, rootProps.className)
+    }
+  );
+}
+function SelectLabel(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.Label, { ...props, className: (0, import_css.cx)(styles.label, props.className) });
+}
+function SelectControl(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.Control, { ...props });
+}
+function SelectTrigger(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.Trigger,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.trigger, props.className)
+    }
+  );
+}
+function SelectValueText(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.ValueText, { ...props });
+}
+function SelectIndicator(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.Indicator,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.indicator, props.className)
+    }
+  );
+}
+function SelectClearTrigger(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.ClearTrigger, { ...props });
+}
+function SelectPositioner(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.Positioner,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.positioner, props.className)
+    }
+  );
+}
+function SelectContent(props) {
+  const { size, ...contentProps } = props;
+  const styles = (0, import_recipes.select)({ size });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.Content,
+    {
+      ...contentProps,
+      className: (0, import_css.cx)(styles.content, contentProps.className)
+    }
+  );
+}
+function SelectItemGroup(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.ItemGroup, { ...props });
+}
+function SelectItemGroupLabel(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.ItemGroupLabel,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.itemGroupLabel, props.className)
+    }
+  );
+}
+function SelectItem(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.Item, { ...props, className: (0, import_css.cx)(styles.item, props.className) });
+}
+function SelectItemText(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.ItemText, { ...props });
+}
+function SelectItemIndicator(props) {
+  const styles = (0, import_recipes.select)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_select.Select.ItemIndicator,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.itemIndicator, props.className)
+    }
+  );
+}
+function SelectHiddenSelect(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_select.Select.HiddenSelect, { ...props });
+}
+
+// src/components/select/parts.ts
+var SelectParts = {
+  Root: SelectRoot,
+  Label: SelectLabel,
+  Control: SelectControl,
+  Trigger: SelectTrigger,
+  ClearTrigger: SelectClearTrigger,
+  ValueText: SelectValueText,
+  Indicator: SelectIndicator,
+  Positioner: SelectPositioner,
+  Content: SelectContent,
+  ItemGroup: SelectItemGroup,
+  ItemGroupLabel: SelectItemGroupLabel,
+  Item: SelectItem,
+  ItemText: SelectItemText,
+  ItemIndicator: SelectItemIndicator,
+  HiddenSelect: SelectHiddenSelect
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  SelectParts
+});
+//# sourceMappingURL=parts.cjs.map