@cerberus-design/react 0.16.0-next-d049636 → 0.17.0-next-e7f9956

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/button/index.ts","../../../../src/components/button/button.tsx","../../../../src/components/Show.tsx","../../../../src/components/Spinner.tsx","../../../../src/components/button/parts.ts"],"sourcesContent":["export * from './button'\nexport * from './parts'\n","'use client'\n\nimport {\n  type ButtonHTMLAttributes,\n  type PropsWithChildren,\n  createContext,\n  useContext,\n  useMemo,\n} from 'react'\nimport { cx } from '@cerberus/styled-system/css'\nimport {\n  button,\n  type ButtonVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport { Box } from '@cerberus/styled-system/jsx'\nimport { Show } from '../Show'\nimport { Spinner } from '../Spinner'\n\n/**\n * This module contains the Button component.\n * @module\n */\n\ninterface ButtonContextValue {\n  pending: boolean\n}\n\nconst ButtonContext = createContext<ButtonContextValue>({\n  pending: false,\n})\n\nexport type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n  ButtonVariantProps & {\n    pending?: boolean\n  }\n\n/**\n * A component that allows the user to perform actions\n * @see https://cerberus.digitalu.design/react/button\n */\nexport function Button(props: ButtonProps): JSX.Element {\n  const { palette, usage, shape, size, pending = false, ...nativeProps } = props\n  const value = useMemo(() => ({ pending }), [pending])\n\n  return (\n    <ButtonContext.Provider value={value}>\n      <button\n        {...nativeProps}\n        disabled={pending || nativeProps.disabled}\n        className={cx(\n          nativeProps.className,\n          button({\n            palette,\n            usage,\n            shape,\n            size,\n          }),\n        )}\n      />\n    </ButtonContext.Provider>\n  )\n}\n\n/**\n * An icon to display in a button that utilizes the pending state to display\n * a loading spinner.\n */\nexport function ButtonIcon(props: PropsWithChildren<object>) {\n  const { pending } = useContext(ButtonContext)\n  return (\n    <Show when={pending} fallback={<>{props.children}</>}>\n      <Box w=\"4\">\n        <Spinner />\n      </Box>\n    </Show>\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 type { SVGProps } from 'react'\n\n/**\n * This module contains the Spinner component.\n * @module\n */\n\nexport type SpinnerProps = SVGProps<SVGSVGElement> & {\n  /**\n   * The size of the spinner\n   */\n  size?: number | string\n}\n\n/**\n * The Spinner component is used to display a loading indicator. Typically used\n * in buttons, modals, and other components that require a loading state.\n * @see https://cerberus.digitalu.design/react/loading-states/\n * @example\n * ```tsx\n * <Button>\n *   <Show when={loading} fallback={<>Save</>}>\n *      Saving\n *      <Spinner size={24} />\n *   </Show>\n * </Button>\n * ```\n */\nexport function Spinner(props: SpinnerProps) {\n  return (\n    <svg\n      aria-busy=\"true\"\n      role=\"status\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      height={props.size}\n      width={props.size}\n      viewBox=\"0 0 24 24\"\n      {...props}\n    >\n      <g\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        strokeWidth={2}\n      >\n        <path\n          strokeDasharray={16}\n          strokeDashoffset={16}\n          d=\"M12 3c4.97 0 9 4.03 9 9\"\n        >\n          <animate\n            fill=\"freeze\"\n            attributeName=\"stroke-dashoffset\"\n            dur=\"0.15s\"\n            values=\"16;0\"\n          ></animate>\n          <animateTransform\n            attributeName=\"transform\"\n            dur=\"0.75s\"\n            repeatCount=\"indefinite\"\n            type=\"rotate\"\n            values=\"0 12 12;360 12 12\"\n          ></animateTransform>\n        </path>\n        <path\n          strokeDasharray={64}\n          strokeDashoffset={64}\n          strokeOpacity={0.3}\n          d=\"M12 3c4.97 0 9 4.03 9 9c0 4.97 -4.03 9 -9 9c-4.97 0 -9 -4.03 -9 -9c0 -4.97 4.03 -9 9 -9Z\"\n        >\n          <animate\n            fill=\"freeze\"\n            attributeName=\"stroke-dashoffset\"\n            dur=\"0.6s\"\n            values=\"64;0\"\n          ></animate>\n        </path>\n      </g>\n    </svg>\n  )\n}\n","import type { ElementType } from 'react'\nimport { Button, ButtonIcon } from './button'\n\n/**\n * This module contains the parts of the Button component.\n * @module 'button/parts'\n */\n\ninterface ButtonPartsValue {\n  /**\n   * The context provider of the button.\n   */\n  Root: ElementType\n  /**\n   * The icon of the button.\n   */\n  Icon: ElementType\n}\n\n/**\n * An Object containing the parts of the Button component. For users that\n * prefer Object component syntax.\n *\n * @remarks\n *\n * When using object component syntax, you import the ButtonParts object and\n * the entire family of components vs. only what you use.\n */\nexport const ButtonParts: ButtonPartsValue = {\n  Root: Button,\n  Icon: ButtonIcon,\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACEA,IAAAA,gBAMO;AACP,iBAAmB;AACnB,qBAGO;AACP,iBAAoB;;;ACZpB,mBAAgE;AA4BzD,SAAS,KAAK,OAAgD;AACnE,QAAM,EAAE,MAAM,UAAU,SAAS,IAAI;AACrC,QAAM,gBAAY,sBAAQ,MAAM,QAAQ,OAAO,CAAC,IAAI,CAAC;AAErD,aAAO,sBAAQ,MAAM;AACnB,QAAI,UAAW,QAAO;AACtB,WAAO,YAAY;AAAA,EACrB,GAAG,CAAC,WAAW,UAAU,QAAQ,CAAC;AACpC;;;ACQQ;AAlBD,SAAS,QAAQ,OAAqB;AAC3C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,OAAM;AAAA,MACN,QAAQ,MAAM;AAAA,MACd,OAAO,MAAM;AAAA,MACb,SAAQ;AAAA,MACP,GAAG;AAAA,MAEJ;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,QAAO;AAAA,UACP,eAAc;AAAA,UACd,gBAAe;AAAA,UACf,aAAa;AAAA,UAEb;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,iBAAiB;AAAA,gBACjB,kBAAkB;AAAA,gBAClB,GAAE;AAAA,gBAEF;AAAA;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAK;AAAA,sBACL,eAAc;AAAA,sBACd,KAAI;AAAA,sBACJ,QAAO;AAAA;AAAA,kBACR;AAAA,kBACD;AAAA,oBAAC;AAAA;AAAA,sBACC,eAAc;AAAA,sBACd,KAAI;AAAA,sBACJ,aAAY;AAAA,sBACZ,MAAK;AAAA,sBACL,QAAO;AAAA;AAAA,kBACR;AAAA;AAAA;AAAA,YACH;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,iBAAiB;AAAA,gBACjB,kBAAkB;AAAA,gBAClB,eAAe;AAAA,gBACf,GAAE;AAAA,gBAEF;AAAA,kBAAC;AAAA;AAAA,oBACC,MAAK;AAAA,oBACL,eAAc;AAAA,oBACd,KAAI;AAAA,oBACJ,QAAO;AAAA;AAAA,gBACR;AAAA;AAAA,YACH;AAAA;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;;;AFnCM,IAAAC,sBAAA;AAnBN,IAAM,oBAAgB,6BAAkC;AAAA,EACtD,SAAS;AACX,CAAC;AAWM,SAAS,OAAO,OAAiC;AACtD,QAAM,EAAE,SAAS,OAAO,OAAO,MAAM,UAAU,OAAO,GAAG,YAAY,IAAI;AACzE,QAAM,YAAQ,uBAAQ,OAAO,EAAE,QAAQ,IAAI,CAAC,OAAO,CAAC;AAEpD,SACE,6CAAC,cAAc,UAAd,EAAuB,OACtB;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU,WAAW,YAAY;AAAA,MACjC,eAAW;AAAA,QACT,YAAY;AAAA,YACZ,uBAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA;AAAA,EACF,GACF;AAEJ;AAMO,SAAS,WAAW,OAAkC;AAC3D,QAAM,EAAE,QAAQ,QAAI,0BAAW,aAAa;AAC5C,SACE,6CAAC,QAAK,MAAM,SAAS,UAAU,6EAAG,gBAAM,UAAS,GAC/C,uDAAC,kBAAI,GAAE,KACL,uDAAC,WAAQ,GACX,GACF;AAEJ;;;AGhDO,IAAM,cAAgC;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM;AACR;","names":["import_react","import_jsx_runtime"]}
+{"version":3,"sources":["../../../../src/components/button/index.ts","../../../../src/components/button/button.tsx","../../../../src/components/Show.tsx","../../../../src/components/Spinner.tsx","../../../../src/components/button/parts.ts"],"sourcesContent":["export * from './button'\nexport * from './parts'\n","'use client'\n\nimport { ark, type HTMLArkProps } from '@ark-ui/react/factory'\nimport {\n  type PropsWithChildren,\n  createContext,\n  useContext,\n  useMemo,\n} from 'react'\nimport { cx } from '@cerberus/styled-system/css'\nimport {\n  button,\n  type ButtonVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport { Box } from '@cerberus/styled-system/jsx'\nimport { Show } from '../Show'\nimport { Spinner } from '../Spinner'\n\n/**\n * This module contains the Button component.\n * @module\n */\n\ninterface ButtonContextValue {\n  pending: boolean\n}\n\nconst ButtonContext = createContext<ButtonContextValue>({\n  pending: false,\n})\n\nexport type ButtonProps = HTMLArkProps<'button'> &\n  ButtonVariantProps & {\n    pending?: boolean\n  }\n\n/**\n * A component that allows the user to perform actions\n * @see https://cerberus.digitalu.design/react/button\n */\nexport function Button(props: ButtonProps) {\n  const { palette, usage, shape, size, pending = false, ...nativeProps } = props\n  const value = useMemo(() => ({ pending }), [pending])\n\n  return (\n    <ButtonContext.Provider value={value}>\n      <ark.button\n        {...nativeProps}\n        disabled={pending || nativeProps.disabled}\n        className={cx(\n          nativeProps.className,\n          button({\n            palette,\n            usage,\n            shape,\n            size,\n          }),\n        )}\n      />\n    </ButtonContext.Provider>\n  )\n}\n\n/**\n * An icon to display in a button that utilizes the pending state to display\n * a loading spinner.\n */\nexport function ButtonIcon(props: PropsWithChildren<object>) {\n  const { pending } = useContext(ButtonContext)\n  return (\n    <Show when={pending} fallback={<>{props.children}</>}>\n      <Box w=\"4\">\n        <Spinner />\n      </Box>\n    </Show>\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 type { SVGProps } from 'react'\n\n/**\n * This module contains the Spinner component.\n * @module\n */\n\nexport type SpinnerProps = SVGProps<SVGSVGElement> & {\n  /**\n   * The size of the spinner\n   */\n  size?: number | string\n}\n\n/**\n * The Spinner component is used to display a loading indicator. Typically used\n * in buttons, modals, and other components that require a loading state.\n * @see https://cerberus.digitalu.design/react/loading-states/\n * @example\n * ```tsx\n * <Button>\n *   <Show when={loading} fallback={<>Save</>}>\n *      Saving\n *      <Spinner size={24} />\n *   </Show>\n * </Button>\n * ```\n */\nexport function Spinner(props: SpinnerProps) {\n  return (\n    <svg\n      aria-busy=\"true\"\n      role=\"status\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      height={props.size}\n      width={props.size}\n      viewBox=\"0 0 24 24\"\n      {...props}\n    >\n      <g\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        strokeWidth={2}\n      >\n        <path\n          strokeDasharray={16}\n          strokeDashoffset={16}\n          d=\"M12 3c4.97 0 9 4.03 9 9\"\n        >\n          <animate\n            fill=\"freeze\"\n            attributeName=\"stroke-dashoffset\"\n            dur=\"0.15s\"\n            values=\"16;0\"\n          ></animate>\n          <animateTransform\n            attributeName=\"transform\"\n            dur=\"0.75s\"\n            repeatCount=\"indefinite\"\n            type=\"rotate\"\n            values=\"0 12 12;360 12 12\"\n          ></animateTransform>\n        </path>\n        <path\n          strokeDasharray={64}\n          strokeDashoffset={64}\n          strokeOpacity={0.3}\n          d=\"M12 3c4.97 0 9 4.03 9 9c0 4.97 -4.03 9 -9 9c-4.97 0 -9 -4.03 -9 -9c0 -4.97 4.03 -9 9 -9Z\"\n        >\n          <animate\n            fill=\"freeze\"\n            attributeName=\"stroke-dashoffset\"\n            dur=\"0.6s\"\n            values=\"64;0\"\n          ></animate>\n        </path>\n      </g>\n    </svg>\n  )\n}\n","import type { ElementType } from 'react'\nimport { Button, ButtonIcon } from './button'\n\n/**\n * This module contains the parts of the Button component.\n * @module 'button/parts'\n */\n\ninterface ButtonPartsValue {\n  /**\n   * The context provider of the button.\n   */\n  Root: ElementType\n  /**\n   * The icon of the button.\n   */\n  Icon: ElementType\n}\n\n/**\n * An Object containing the parts of the Button component. For users that\n * prefer Object component syntax.\n *\n * @remarks\n *\n * When using object component syntax, you import the ButtonParts object and\n * the entire family of components vs. only what you use.\n */\nexport const ButtonParts: ButtonPartsValue = {\n  Root: Button,\n  Icon: ButtonIcon,\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACEA,qBAAuC;AACvC,IAAAA,gBAKO;AACP,iBAAmB;AACnB,qBAGO;AACP,iBAAoB;;;ACZpB,mBAAgE;AA4BzD,SAAS,KAAK,OAAgD;AACnE,QAAM,EAAE,MAAM,UAAU,SAAS,IAAI;AACrC,QAAM,gBAAY,sBAAQ,MAAM,QAAQ,OAAO,CAAC,IAAI,CAAC;AAErD,aAAO,sBAAQ,MAAM;AACnB,QAAI,UAAW,QAAO;AACtB,WAAO,YAAY;AAAA,EACrB,GAAG,CAAC,WAAW,UAAU,QAAQ,CAAC;AACpC;;;ACQQ;AAlBD,SAAS,QAAQ,OAAqB;AAC3C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,OAAM;AAAA,MACN,QAAQ,MAAM;AAAA,MACd,OAAO,MAAM;AAAA,MACb,SAAQ;AAAA,MACP,GAAG;AAAA,MAEJ;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,QAAO;AAAA,UACP,eAAc;AAAA,UACd,gBAAe;AAAA,UACf,aAAa;AAAA,UAEb;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,iBAAiB;AAAA,gBACjB,kBAAkB;AAAA,gBAClB,GAAE;AAAA,gBAEF;AAAA;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAK;AAAA,sBACL,eAAc;AAAA,sBACd,KAAI;AAAA,sBACJ,QAAO;AAAA;AAAA,kBACR;AAAA,kBACD;AAAA,oBAAC;AAAA;AAAA,sBACC,eAAc;AAAA,sBACd,KAAI;AAAA,sBACJ,aAAY;AAAA,sBACZ,MAAK;AAAA,sBACL,QAAO;AAAA;AAAA,kBACR;AAAA;AAAA;AAAA,YACH;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,iBAAiB;AAAA,gBACjB,kBAAkB;AAAA,gBAClB,eAAe;AAAA,gBACf,GAAE;AAAA,gBAEF;AAAA,kBAAC;AAAA;AAAA,oBACC,MAAK;AAAA,oBACL,eAAc;AAAA,oBACd,KAAI;AAAA,oBACJ,QAAO;AAAA;AAAA,gBACR;AAAA;AAAA,YACH;AAAA;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;;;AFnCM,IAAAC,sBAAA;AAnBN,IAAM,oBAAgB,6BAAkC;AAAA,EACtD,SAAS;AACX,CAAC;AAWM,SAAS,OAAO,OAAoB;AACzC,QAAM,EAAE,SAAS,OAAO,OAAO,MAAM,UAAU,OAAO,GAAG,YAAY,IAAI;AACzE,QAAM,YAAQ,uBAAQ,OAAO,EAAE,QAAQ,IAAI,CAAC,OAAO,CAAC;AAEpD,SACE,6CAAC,cAAc,UAAd,EAAuB,OACtB;AAAA,IAAC,mBAAI;AAAA,IAAJ;AAAA,MACE,GAAG;AAAA,MACJ,UAAU,WAAW,YAAY;AAAA,MACjC,eAAW;AAAA,QACT,YAAY;AAAA,YACZ,uBAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA;AAAA,EACF,GACF;AAEJ;AAMO,SAAS,WAAW,OAAkC;AAC3D,QAAM,EAAE,QAAQ,QAAI,0BAAW,aAAa;AAC5C,SACE,6CAAC,QAAK,MAAM,SAAS,UAAU,6EAAG,gBAAM,UAAS,GAC/C,uDAAC,kBAAI,GAAE,KACL,uDAAC,WAAQ,GACX,GACF;AAEJ;;;AGhDO,IAAM,cAAgC;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM;AACR;","names":["import_react","import_jsx_runtime"]}

package/build/legacy/components/button/index.d.cts

@@ -0,0 +1,4 @@
+export { Button_alias_2 as Button } from '../../_tsup-dts-rollup.cjs';
+export { ButtonIcon_alias_2 as ButtonIcon } from '../../_tsup-dts-rollup.cjs';
+export { ButtonProps_alias_2 as ButtonProps } from '../../_tsup-dts-rollup.cjs';
+export { ButtonParts_alias_1 as ButtonParts } from '../../_tsup-dts-rollup.cjs';

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

@@ -25,6 +25,7 @@ __export(parts_exports, {
 module.exports = __toCommonJS(parts_exports);
 
 // src/components/button/button.tsx
+var import_factory = require("@ark-ui/react/factory");
 var import_react2 = require("react");
 var import_css = require("@cerberus/styled-system/css");
 var import_recipes = require("@cerberus/styled-system/recipes");
@@ -126,7 +127,7 @@ function Button(props) {
   const { palette, usage, shape, size, pending = false, ...nativeProps } = props;
   const value = (0, import_react2.useMemo)(() => ({ pending }), [pending]);
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ButtonContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    "button",
+    import_factory.ark.button,
     {
       ...nativeProps,
       disabled: pending || nativeProps.disabled,

package/build/legacy/components/button/parts.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/button/parts.ts","../../../../src/components/button/button.tsx","../../../../src/components/Show.tsx","../../../../src/components/Spinner.tsx"],"sourcesContent":["import type { ElementType } from 'react'\nimport { Button, ButtonIcon } from './button'\n\n/**\n * This module contains the parts of the Button component.\n * @module 'button/parts'\n */\n\ninterface ButtonPartsValue {\n  /**\n   * The context provider of the button.\n   */\n  Root: ElementType\n  /**\n   * The icon of the button.\n   */\n  Icon: ElementType\n}\n\n/**\n * An Object containing the parts of the Button component. For users that\n * prefer Object component syntax.\n *\n * @remarks\n *\n * When using object component syntax, you import the ButtonParts object and\n * the entire family of components vs. only what you use.\n */\nexport const ButtonParts: ButtonPartsValue = {\n  Root: Button,\n  Icon: ButtonIcon,\n}\n","'use client'\n\nimport {\n  type ButtonHTMLAttributes,\n  type PropsWithChildren,\n  createContext,\n  useContext,\n  useMemo,\n} from 'react'\nimport { cx } from '@cerberus/styled-system/css'\nimport {\n  button,\n  type ButtonVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport { Box } from '@cerberus/styled-system/jsx'\nimport { Show } from '../Show'\nimport { Spinner } from '../Spinner'\n\n/**\n * This module contains the Button component.\n * @module\n */\n\ninterface ButtonContextValue {\n  pending: boolean\n}\n\nconst ButtonContext = createContext<ButtonContextValue>({\n  pending: false,\n})\n\nexport type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n  ButtonVariantProps & {\n    pending?: boolean\n  }\n\n/**\n * A component that allows the user to perform actions\n * @see https://cerberus.digitalu.design/react/button\n */\nexport function Button(props: ButtonProps): JSX.Element {\n  const { palette, usage, shape, size, pending = false, ...nativeProps } = props\n  const value = useMemo(() => ({ pending }), [pending])\n\n  return (\n    <ButtonContext.Provider value={value}>\n      <button\n        {...nativeProps}\n        disabled={pending || nativeProps.disabled}\n        className={cx(\n          nativeProps.className,\n          button({\n            palette,\n            usage,\n            shape,\n            size,\n          }),\n        )}\n      />\n    </ButtonContext.Provider>\n  )\n}\n\n/**\n * An icon to display in a button that utilizes the pending state to display\n * a loading spinner.\n */\nexport function ButtonIcon(props: PropsWithChildren<object>) {\n  const { pending } = useContext(ButtonContext)\n  return (\n    <Show when={pending} fallback={<>{props.children}</>}>\n      <Box w=\"4\">\n        <Spinner />\n      </Box>\n    </Show>\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 type { SVGProps } from 'react'\n\n/**\n * This module contains the Spinner component.\n * @module\n */\n\nexport type SpinnerProps = SVGProps<SVGSVGElement> & {\n  /**\n   * The size of the spinner\n   */\n  size?: number | string\n}\n\n/**\n * The Spinner component is used to display a loading indicator. Typically used\n * in buttons, modals, and other components that require a loading state.\n * @see https://cerberus.digitalu.design/react/loading-states/\n * @example\n * ```tsx\n * <Button>\n *   <Show when={loading} fallback={<>Save</>}>\n *      Saving\n *      <Spinner size={24} />\n *   </Show>\n * </Button>\n * ```\n */\nexport function Spinner(props: SpinnerProps) {\n  return (\n    <svg\n      aria-busy=\"true\"\n      role=\"status\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      height={props.size}\n      width={props.size}\n      viewBox=\"0 0 24 24\"\n      {...props}\n    >\n      <g\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        strokeWidth={2}\n      >\n        <path\n          strokeDasharray={16}\n          strokeDashoffset={16}\n          d=\"M12 3c4.97 0 9 4.03 9 9\"\n        >\n          <animate\n            fill=\"freeze\"\n            attributeName=\"stroke-dashoffset\"\n            dur=\"0.15s\"\n            values=\"16;0\"\n          ></animate>\n          <animateTransform\n            attributeName=\"transform\"\n            dur=\"0.75s\"\n            repeatCount=\"indefinite\"\n            type=\"rotate\"\n            values=\"0 12 12;360 12 12\"\n          ></animateTransform>\n        </path>\n        <path\n          strokeDasharray={64}\n          strokeDashoffset={64}\n          strokeOpacity={0.3}\n          d=\"M12 3c4.97 0 9 4.03 9 9c0 4.97 -4.03 9 -9 9c-4.97 0 -9 -4.03 -9 -9c0 -4.97 4.03 -9 9 -9Z\"\n        >\n          <animate\n            fill=\"freeze\"\n            attributeName=\"stroke-dashoffset\"\n            dur=\"0.6s\"\n            values=\"64;0\"\n          ></animate>\n        </path>\n      </g>\n    </svg>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACEA,IAAAA,gBAMO;AACP,iBAAmB;AACnB,qBAGO;AACP,iBAAoB;;;ACZpB,mBAAgE;AA4BzD,SAAS,KAAK,OAAgD;AACnE,QAAM,EAAE,MAAM,UAAU,SAAS,IAAI;AACrC,QAAM,gBAAY,sBAAQ,MAAM,QAAQ,OAAO,CAAC,IAAI,CAAC;AAErD,aAAO,sBAAQ,MAAM;AACnB,QAAI,UAAW,QAAO;AACtB,WAAO,YAAY;AAAA,EACrB,GAAG,CAAC,WAAW,UAAU,QAAQ,CAAC;AACpC;;;ACQQ;AAlBD,SAAS,QAAQ,OAAqB;AAC3C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,OAAM;AAAA,MACN,QAAQ,MAAM;AAAA,MACd,OAAO,MAAM;AAAA,MACb,SAAQ;AAAA,MACP,GAAG;AAAA,MAEJ;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,QAAO;AAAA,UACP,eAAc;AAAA,UACd,gBAAe;AAAA,UACf,aAAa;AAAA,UAEb;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,iBAAiB;AAAA,gBACjB,kBAAkB;AAAA,gBAClB,GAAE;AAAA,gBAEF;AAAA;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAK;AAAA,sBACL,eAAc;AAAA,sBACd,KAAI;AAAA,sBACJ,QAAO;AAAA;AAAA,kBACR;AAAA,kBACD;AAAA,oBAAC;AAAA;AAAA,sBACC,eAAc;AAAA,sBACd,KAAI;AAAA,sBACJ,aAAY;AAAA,sBACZ,MAAK;AAAA,sBACL,QAAO;AAAA;AAAA,kBACR;AAAA;AAAA;AAAA,YACH;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,iBAAiB;AAAA,gBACjB,kBAAkB;AAAA,gBAClB,eAAe;AAAA,gBACf,GAAE;AAAA,gBAEF;AAAA,kBAAC;AAAA;AAAA,oBACC,MAAK;AAAA,oBACL,eAAc;AAAA,oBACd,KAAI;AAAA,oBACJ,QAAO;AAAA;AAAA,gBACR;AAAA;AAAA,YACH;AAAA;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;;;AFnCM,IAAAC,sBAAA;AAnBN,IAAM,oBAAgB,6BAAkC;AAAA,EACtD,SAAS;AACX,CAAC;AAWM,SAAS,OAAO,OAAiC;AACtD,QAAM,EAAE,SAAS,OAAO,OAAO,MAAM,UAAU,OAAO,GAAG,YAAY,IAAI;AACzE,QAAM,YAAQ,uBAAQ,OAAO,EAAE,QAAQ,IAAI,CAAC,OAAO,CAAC;AAEpD,SACE,6CAAC,cAAc,UAAd,EAAuB,OACtB;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU,WAAW,YAAY;AAAA,MACjC,eAAW;AAAA,QACT,YAAY;AAAA,YACZ,uBAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA;AAAA,EACF,GACF;AAEJ;AAMO,SAAS,WAAW,OAAkC;AAC3D,QAAM,EAAE,QAAQ,QAAI,0BAAW,aAAa;AAC5C,SACE,6CAAC,QAAK,MAAM,SAAS,UAAU,6EAAG,gBAAM,UAAS,GAC/C,uDAAC,kBAAI,GAAE,KACL,uDAAC,WAAQ,GACX,GACF;AAEJ;;;ADhDO,IAAM,cAAgC;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM;AACR;","names":["import_react","import_jsx_runtime"]}
+{"version":3,"sources":["../../../../src/components/button/parts.ts","../../../../src/components/button/button.tsx","../../../../src/components/Show.tsx","../../../../src/components/Spinner.tsx"],"sourcesContent":["import type { ElementType } from 'react'\nimport { Button, ButtonIcon } from './button'\n\n/**\n * This module contains the parts of the Button component.\n * @module 'button/parts'\n */\n\ninterface ButtonPartsValue {\n  /**\n   * The context provider of the button.\n   */\n  Root: ElementType\n  /**\n   * The icon of the button.\n   */\n  Icon: ElementType\n}\n\n/**\n * An Object containing the parts of the Button component. For users that\n * prefer Object component syntax.\n *\n * @remarks\n *\n * When using object component syntax, you import the ButtonParts object and\n * the entire family of components vs. only what you use.\n */\nexport const ButtonParts: ButtonPartsValue = {\n  Root: Button,\n  Icon: ButtonIcon,\n}\n","'use client'\n\nimport { ark, type HTMLArkProps } from '@ark-ui/react/factory'\nimport {\n  type PropsWithChildren,\n  createContext,\n  useContext,\n  useMemo,\n} from 'react'\nimport { cx } from '@cerberus/styled-system/css'\nimport {\n  button,\n  type ButtonVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport { Box } from '@cerberus/styled-system/jsx'\nimport { Show } from '../Show'\nimport { Spinner } from '../Spinner'\n\n/**\n * This module contains the Button component.\n * @module\n */\n\ninterface ButtonContextValue {\n  pending: boolean\n}\n\nconst ButtonContext = createContext<ButtonContextValue>({\n  pending: false,\n})\n\nexport type ButtonProps = HTMLArkProps<'button'> &\n  ButtonVariantProps & {\n    pending?: boolean\n  }\n\n/**\n * A component that allows the user to perform actions\n * @see https://cerberus.digitalu.design/react/button\n */\nexport function Button(props: ButtonProps) {\n  const { palette, usage, shape, size, pending = false, ...nativeProps } = props\n  const value = useMemo(() => ({ pending }), [pending])\n\n  return (\n    <ButtonContext.Provider value={value}>\n      <ark.button\n        {...nativeProps}\n        disabled={pending || nativeProps.disabled}\n        className={cx(\n          nativeProps.className,\n          button({\n            palette,\n            usage,\n            shape,\n            size,\n          }),\n        )}\n      />\n    </ButtonContext.Provider>\n  )\n}\n\n/**\n * An icon to display in a button that utilizes the pending state to display\n * a loading spinner.\n */\nexport function ButtonIcon(props: PropsWithChildren<object>) {\n  const { pending } = useContext(ButtonContext)\n  return (\n    <Show when={pending} fallback={<>{props.children}</>}>\n      <Box w=\"4\">\n        <Spinner />\n      </Box>\n    </Show>\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 type { SVGProps } from 'react'\n\n/**\n * This module contains the Spinner component.\n * @module\n */\n\nexport type SpinnerProps = SVGProps<SVGSVGElement> & {\n  /**\n   * The size of the spinner\n   */\n  size?: number | string\n}\n\n/**\n * The Spinner component is used to display a loading indicator. Typically used\n * in buttons, modals, and other components that require a loading state.\n * @see https://cerberus.digitalu.design/react/loading-states/\n * @example\n * ```tsx\n * <Button>\n *   <Show when={loading} fallback={<>Save</>}>\n *      Saving\n *      <Spinner size={24} />\n *   </Show>\n * </Button>\n * ```\n */\nexport function Spinner(props: SpinnerProps) {\n  return (\n    <svg\n      aria-busy=\"true\"\n      role=\"status\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      height={props.size}\n      width={props.size}\n      viewBox=\"0 0 24 24\"\n      {...props}\n    >\n      <g\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        strokeWidth={2}\n      >\n        <path\n          strokeDasharray={16}\n          strokeDashoffset={16}\n          d=\"M12 3c4.97 0 9 4.03 9 9\"\n        >\n          <animate\n            fill=\"freeze\"\n            attributeName=\"stroke-dashoffset\"\n            dur=\"0.15s\"\n            values=\"16;0\"\n          ></animate>\n          <animateTransform\n            attributeName=\"transform\"\n            dur=\"0.75s\"\n            repeatCount=\"indefinite\"\n            type=\"rotate\"\n            values=\"0 12 12;360 12 12\"\n          ></animateTransform>\n        </path>\n        <path\n          strokeDasharray={64}\n          strokeDashoffset={64}\n          strokeOpacity={0.3}\n          d=\"M12 3c4.97 0 9 4.03 9 9c0 4.97 -4.03 9 -9 9c-4.97 0 -9 -4.03 -9 -9c0 -4.97 4.03 -9 9 -9Z\"\n        >\n          <animate\n            fill=\"freeze\"\n            attributeName=\"stroke-dashoffset\"\n            dur=\"0.6s\"\n            values=\"64;0\"\n          ></animate>\n        </path>\n      </g>\n    </svg>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACEA,qBAAuC;AACvC,IAAAA,gBAKO;AACP,iBAAmB;AACnB,qBAGO;AACP,iBAAoB;;;ACZpB,mBAAgE;AA4BzD,SAAS,KAAK,OAAgD;AACnE,QAAM,EAAE,MAAM,UAAU,SAAS,IAAI;AACrC,QAAM,gBAAY,sBAAQ,MAAM,QAAQ,OAAO,CAAC,IAAI,CAAC;AAErD,aAAO,sBAAQ,MAAM;AACnB,QAAI,UAAW,QAAO;AACtB,WAAO,YAAY;AAAA,EACrB,GAAG,CAAC,WAAW,UAAU,QAAQ,CAAC;AACpC;;;ACQQ;AAlBD,SAAS,QAAQ,OAAqB;AAC3C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,OAAM;AAAA,MACN,QAAQ,MAAM;AAAA,MACd,OAAO,MAAM;AAAA,MACb,SAAQ;AAAA,MACP,GAAG;AAAA,MAEJ;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,QAAO;AAAA,UACP,eAAc;AAAA,UACd,gBAAe;AAAA,UACf,aAAa;AAAA,UAEb;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,iBAAiB;AAAA,gBACjB,kBAAkB;AAAA,gBAClB,GAAE;AAAA,gBAEF;AAAA;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAK;AAAA,sBACL,eAAc;AAAA,sBACd,KAAI;AAAA,sBACJ,QAAO;AAAA;AAAA,kBACR;AAAA,kBACD;AAAA,oBAAC;AAAA;AAAA,sBACC,eAAc;AAAA,sBACd,KAAI;AAAA,sBACJ,aAAY;AAAA,sBACZ,MAAK;AAAA,sBACL,QAAO;AAAA;AAAA,kBACR;AAAA;AAAA;AAAA,YACH;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,iBAAiB;AAAA,gBACjB,kBAAkB;AAAA,gBAClB,eAAe;AAAA,gBACf,GAAE;AAAA,gBAEF;AAAA,kBAAC;AAAA;AAAA,oBACC,MAAK;AAAA,oBACL,eAAc;AAAA,oBACd,KAAI;AAAA,oBACJ,QAAO;AAAA;AAAA,gBACR;AAAA;AAAA,YACH;AAAA;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;;;AFnCM,IAAAC,sBAAA;AAnBN,IAAM,oBAAgB,6BAAkC;AAAA,EACtD,SAAS;AACX,CAAC;AAWM,SAAS,OAAO,OAAoB;AACzC,QAAM,EAAE,SAAS,OAAO,OAAO,MAAM,UAAU,OAAO,GAAG,YAAY,IAAI;AACzE,QAAM,YAAQ,uBAAQ,OAAO,EAAE,QAAQ,IAAI,CAAC,OAAO,CAAC;AAEpD,SACE,6CAAC,cAAc,UAAd,EAAuB,OACtB;AAAA,IAAC,mBAAI;AAAA,IAAJ;AAAA,MACE,GAAG;AAAA,MACJ,UAAU,WAAW,YAAY;AAAA,MACjC,eAAW;AAAA,QACT,YAAY;AAAA,YACZ,uBAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA;AAAA,EACF,GACF;AAEJ;AAMO,SAAS,WAAW,OAAkC;AAC3D,QAAM,EAAE,QAAQ,QAAI,0BAAW,aAAa;AAC5C,SACE,6CAAC,QAAK,MAAM,SAAS,UAAU,6EAAG,gBAAM,UAAS,GAC/C,uDAAC,kBAAI,GAAE,KACL,uDAAC,WAAQ,GACX,GACF;AAEJ;;;ADhDO,IAAM,cAAgC;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM;AACR;","names":["import_react","import_jsx_runtime"]}

package/build/legacy/components/button/parts.d.cts

@@ -0,0 +1 @@
+export { ButtonParts_alias_2 as ButtonParts } from '../../_tsup-dts-rollup.cjs';

package/build/legacy/components/checkbox/checkbox-icon.d.cts

@@ -0,0 +1 @@
+export { CheckboxIcon } from '../../_tsup-dts-rollup.cjs';

package/build/legacy/components/checkbox/checkbox.d.cts

@@ -0,0 +1,2 @@
+export { Checkbox_alias_1 as Checkbox } from '../../_tsup-dts-rollup.cjs';
+export { CheckboxProps_alias_1 as CheckboxProps } from '../../_tsup-dts-rollup.cjs';

package/build/legacy/components/checkbox/index.d.cts

@@ -0,0 +1,9 @@
+export { Checkbox_alias_2 as Checkbox } from '../../_tsup-dts-rollup.cjs';
+export { CheckboxProps_alias_2 as CheckboxProps } from '../../_tsup-dts-rollup.cjs';
+export { CheckboxParts_alias_1 as CheckboxParts } from '../../_tsup-dts-rollup.cjs';
+export { CheckboxRoot_alias_1 as CheckboxRoot } from '../../_tsup-dts-rollup.cjs';
+export { CheckboxLabel_alias_1 as CheckboxLabel } from '../../_tsup-dts-rollup.cjs';
+export { CheckboxControl_alias_1 as CheckboxControl } from '../../_tsup-dts-rollup.cjs';
+export { CheckboxIndicator_alias_1 as CheckboxIndicator } from '../../_tsup-dts-rollup.cjs';
+export { CheckboxHiddenInput_alias_1 as CheckboxHiddenInput } from '../../_tsup-dts-rollup.cjs';
+export { CheckboxGroup_alias_1 as CheckboxGroup } from '../../_tsup-dts-rollup.cjs';

package/build/legacy/components/checkbox/parts.d.cts

@@ -0,0 +1 @@
+export { CheckboxParts_alias_2 as CheckboxParts } from '../../_tsup-dts-rollup.cjs';

package/build/legacy/components/checkbox/primitives.d.cts

@@ -0,0 +1,6 @@
+export { CheckboxRoot_alias_2 as CheckboxRoot } from '../../_tsup-dts-rollup.cjs';
+export { CheckboxLabel_alias_2 as CheckboxLabel } from '../../_tsup-dts-rollup.cjs';
+export { CheckboxControl_alias_2 as CheckboxControl } from '../../_tsup-dts-rollup.cjs';
+export { CheckboxIndicator_alias_2 as CheckboxIndicator } from '../../_tsup-dts-rollup.cjs';
+export { CheckboxHiddenInput_alias_2 as CheckboxHiddenInput } from '../../_tsup-dts-rollup.cjs';
+export { CheckboxGroup_alias_2 as CheckboxGroup } from '../../_tsup-dts-rollup.cjs';

package/build/legacy/components/combobox/combobox.d.cts

@@ -0,0 +1,2 @@
+export { Combobox_alias_1 as Combobox } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxProps_alias_1 as ComboboxProps } from '../../_tsup-dts-rollup.cjs';

package/build/legacy/components/combobox/index.d.cts

@@ -0,0 +1,24 @@
+export { ComboboxParts_alias_1 as ComboboxParts } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxRoot_alias_1 as ComboboxRoot } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxLabel_alias_1 as ComboboxLabel } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxControl_alias_1 as ComboboxControl } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxInput_alias_1 as ComboboxInput } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxTrigger_alias_1 as ComboboxTrigger } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxClearTrigger_alias_1 as ComboboxClearTrigger } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxPositioner_alias_1 as ComboboxPositioner } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxContent_alias_1 as ComboboxContent } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxItemGroup_alias_1 as ComboboxItemGroup } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxItemGroupLabel_alias_1 as ComboboxItemGroupLabel } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxItem_alias_1 as ComboboxItem } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxItemText_alias_1 as ComboboxItemText } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxItemIndicator_alias_1 as ComboboxItemIndicator } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxStartIcon_alias_1 as ComboboxStartIcon } from '../../_tsup-dts-rollup.cjs';
+export { ComboItemText_alias_1 as ComboItemText } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxInputValueChangeDetails_alias_1 as ComboboxInputValueChangeDetails } from '../../_tsup-dts-rollup.cjs';
+export { Combobox_alias_2 as Combobox } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxProps_alias_2 as ComboboxProps } from '../../_tsup-dts-rollup.cjs';
+export { ComboItemWithIndicator_alias_1 as ComboItemWithIndicator } from '../../_tsup-dts-rollup.cjs';
+export { ComboItemGroup_alias_1 as ComboItemGroup } from '../../_tsup-dts-rollup.cjs';
+export { ComboItemGroupProps_alias_1 as ComboItemGroupProps } from '../../_tsup-dts-rollup.cjs';
+export { useStatefulCollection_alias_1 as useStatefulCollection } from '../../_tsup-dts-rollup.cjs';
+export { StatefulCollectionReturn_alias_1 as StatefulCollectionReturn } from '../../_tsup-dts-rollup.cjs';

package/build/legacy/components/combobox/item-group.d.cts

@@ -0,0 +1,2 @@
+export { ComboItemGroup_alias_2 as ComboItemGroup } from '../../_tsup-dts-rollup.cjs';
+export { ComboItemGroupProps_alias_2 as ComboItemGroupProps } from '../../_tsup-dts-rollup.cjs';

package/build/legacy/components/combobox/item.d.cts

@@ -0,0 +1 @@
+export { ComboItemWithIndicator_alias_2 as ComboItemWithIndicator } from '../../_tsup-dts-rollup.cjs';

package/build/legacy/components/combobox/parts.d.cts

@@ -0,0 +1 @@
+export { ComboboxParts_alias_2 as ComboboxParts } from '../../_tsup-dts-rollup.cjs';

package/build/legacy/components/combobox/primitives.d.cts

@@ -0,0 +1,16 @@
+export { ComboboxRoot_alias_2 as ComboboxRoot } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxLabel_alias_2 as ComboboxLabel } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxControl_alias_2 as ComboboxControl } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxInput_alias_2 as ComboboxInput } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxTrigger_alias_2 as ComboboxTrigger } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxClearTrigger_alias_2 as ComboboxClearTrigger } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxPositioner_alias_2 as ComboboxPositioner } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxContent_alias_2 as ComboboxContent } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxItemGroup_alias_2 as ComboboxItemGroup } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxItemGroupLabel_alias_2 as ComboboxItemGroupLabel } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxItem_alias_2 as ComboboxItem } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxItemText_alias_2 as ComboboxItemText } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxItemIndicator_alias_2 as ComboboxItemIndicator } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxStartIcon_alias_2 as ComboboxStartIcon } from '../../_tsup-dts-rollup.cjs';
+export { ComboItemText_alias_2 as ComboItemText } from '../../_tsup-dts-rollup.cjs';
+export { ComboboxInputValueChangeDetails_alias_2 as ComboboxInputValueChangeDetails } from '../../_tsup-dts-rollup.cjs';

package/build/legacy/components/combobox/use-stateful-collection.d.cts

@@ -0,0 +1,2 @@
+export { useStatefulCollection_alias_2 as useStatefulCollection } from '../../_tsup-dts-rollup.cjs';
+export { StatefulCollectionReturn_alias_2 as StatefulCollectionReturn } from '../../_tsup-dts-rollup.cjs';

package/build/legacy/components/cta-dialog/context.d.cts

@@ -0,0 +1,3 @@
+export { ShowCTAModalOptions } from '../../_tsup-dts-rollup.cjs';
+export { CTAModalValue } from '../../_tsup-dts-rollup.cjs';
+export { CTAModalContext } from '../../_tsup-dts-rollup.cjs';

package/build/legacy/components/cta-dialog/index.cjs

@@ -62,109 +62,96 @@ function For(props) {
   return (_a = props.each) == null ? void 0 : _a.map(props.children);
 }
 
-// src/components/Avatar.tsx
-var import_css = require("@cerberus/styled-system/css");
-var import_patterns = require("@cerberus/styled-system/patterns");
+// src/utils/index.ts
+function splitProps(props, ...keyGroups) {
+  const result = keyGroups.map(() => ({}));
+  const rest = {};
+  for (const key in props) {
+    let assigned = false;
+    for (let i = 0; i < keyGroups.length; i++) {
+      if (keyGroups[i].includes(key)) {
+        result[i][key] = props[key];
+        assigned = true;
+        break;
+      }
+    }
+    if (!assigned) {
+      rest[key] = props[key];
+    }
+  }
+  return [...result, rest];
+}
+
+// src/components/avatar/primitives.tsx
+var import_avatar = require("@ark-ui/react/avatar");
 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 Avatar(props) {
-  const {
-    ariaLabel,
-    as,
-    gradient,
-    size,
-    src,
-    width,
-    height,
-    icon,
-    ...nativeProps
-  } = props;
-  const { icons } = useCerberusContext();
-  const { avatar: AvatarIcon } = icons;
-  const initials = (ariaLabel || "").split(" ").map((word) => word[0]).join("").slice(0, 2);
+function AvatarRoot(props) {
+  const { gradient, shape, size, ...rootProps } = props;
+  const styles = (0, import_recipes.avatar)({ gradient, shape, size });
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    "div",
+    import_avatar.Avatar.Root,
     {
-      ...nativeProps,
-      className: (0, import_css.cx)(
-        nativeProps.className,
-        (0, import_recipes.avatar)({ gradient, size }),
-        (0, import_patterns.circle)()
-      ),
-      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        Show,
-        {
-          when: Boolean(src) || Boolean(as),
-          fallback: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-            Show,
-            {
-              when: Boolean(initials),
-              fallback: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-                Show,
-                {
-                  when: Boolean(icon),
-                  fallback: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-                    AvatarIcon,
-                    {
-                      size: iconSizeMap[size]
-                    }
-                  ),
-                  children: icon
-                }
-              ),
-              children: initials
-            }
-          ),
-          children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-            Show,
-            {
-              when: Boolean(as),
-              fallback: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-                "img",
-                {
-                  alt: props.ariaLabel,
-                  className: (0, import_css.css)({
-                    h: "full",
-                    objectFit: "cover",
-                    w: "full"
-                  }),
-                  decoding: "async",
-                  loading: "lazy",
-                  src,
-                  height,
-                  width
-                }
-              ),
-              children: as
-            }
-          )
-        }
-      )
+      ...rootProps,
+      className: (0, import_css.cx)(styles.root, rootProps.className)
+    }
+  );
+}
+function AvatarImage(props) {
+  const styles = (0, import_recipes.avatar)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_avatar.Avatar.Image, { ...props, className: (0, import_css.cx)(styles.image, props.className) });
+}
+function AvatarFallback(props) {
+  const styles = (0, import_recipes.avatar)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_avatar.Avatar.Fallback,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.fallback, props.className)
     }
   );
 }
-var iconSizeMap = {
-  xs: 16,
-  sm: 16,
-  md: 20,
-  lg: 34,
-  xl: 32,
-  "2xl": 32,
-  "3xl": 32,
-  "4xl": 32
+
+// src/components/avatar/parts.ts
+var AvatarParts = {
+  Root: AvatarRoot,
+  Image: AvatarImage,
+  Fallback: AvatarFallback
 };
 
+// src/components/avatar/avatar.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function Avatar2(props) {
+  const [imgProps, { fallback, children }, rootProps] = splitProps(
+    props,
+    ["alt", "src"],
+    ["fallback", "children"]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(AvatarParts.Root, { ...rootProps, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    Show,
+    {
+      when: Boolean(children),
+      fallback: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(AvatarParts.Fallback, { children: fallback }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(AvatarParts.Image, { ...imgProps })
+      ] }),
+      children
+    }
+  ) });
+}
+
 // src/components/dialog/primitives.tsx
 var import_dialog = require("@ark-ui/react/dialog");
 var import_css2 = require("@cerberus/styled-system/css");
 var import_recipes2 = require("@cerberus/styled-system/recipes");
-var import_jsx_runtime3 = require("react/jsx-runtime");
+var import_jsx_runtime4 = require("react/jsx-runtime");
 function DialogRoot(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_dialog.Dialog.Root, { ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_dialog.Dialog.Root, { ...props });
 }
 function DialogBackdrop(props) {
   const styles = (0, import_recipes2.dialog)();
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
     import_dialog.Dialog.Backdrop,
     {
       ...props,
@@ -174,7 +161,7 @@ function DialogBackdrop(props) {
 }
 function DialogPositioner(props) {
   const styles = (0, import_recipes2.dialog)();
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
     import_dialog.Dialog.Positioner,
     {
       ...props,
@@ -185,7 +172,7 @@ function DialogPositioner(props) {
 function DialogContent(props) {
   const { size, ...contentProps } = props;
   const styles = (0, import_recipes2.dialog)({ size });
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
     import_dialog.Dialog.Content,
     {
       ...contentProps,
@@ -195,11 +182,11 @@ function DialogContent(props) {
 }
 function DialogHeading(props) {
   const styles = (0, import_recipes2.dialog)();
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_dialog.Dialog.Title, { ...props, className: (0, import_css2.cx)(styles.title, props.className) });
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_dialog.Dialog.Title, { ...props, className: (0, import_css2.cx)(styles.title, props.className) });
 }
 function DialogDescription(props) {
   const styles = (0, import_recipes2.dialog)();
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
     import_dialog.Dialog.Description,
     {
       ...props,
@@ -208,18 +195,19 @@ function DialogDescription(props) {
   );
 }
 function DialogCloseTrigger(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_dialog.Dialog.CloseTrigger, { ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_dialog.Dialog.CloseTrigger, { ...props });
 }
 var DialogProvider = DialogRoot;
 
 // src/components/IconButton.tsx
+var import_factory = require("@ark-ui/react/factory");
 var import_css3 = require("@cerberus/styled-system/css");
 var import_recipes3 = require("@cerberus/styled-system/recipes");
-var import_jsx_runtime4 = require("react/jsx-runtime");
+var import_jsx_runtime5 = require("react/jsx-runtime");
 function IconButton(props) {
   const { ariaLabel, palette, usage, size, ...nativeProps } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-    "button",
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    import_factory.ark.button,
     {
       ...nativeProps,
       "aria-label": ariaLabel ?? "Icon Button",
@@ -238,25 +226,25 @@ function IconButton(props) {
 // src/components/dialog/close-icon-trigger.tsx
 var import_recipes4 = require("@cerberus/styled-system/recipes");
 var import_css4 = require("@cerberus/styled-system/css");
-var import_jsx_runtime5 = require("react/jsx-runtime");
+var import_jsx_runtime6 = require("react/jsx-runtime");
 function DialogCloseIconTrigger(props) {
   const styles = (0, import_recipes4.dialog)();
   const { icons } = useCerberusContext();
   const { close: CloseIcon } = icons;
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
     DialogCloseTrigger,
     {
       ...props,
       className: (0, import_css4.cx)(styles.closeTrigger, props.className),
       asChild: true,
-      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
         IconButton,
         {
           ariaLabel: "Close dialog",
           palette: "action",
           size: "lg",
           usage: "ghost",
-          children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(CloseIcon, {})
+          children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(CloseIcon, {})
         }
       )
     }
@@ -268,11 +256,11 @@ var import_react3 = require("@ark-ui/react");
 var Portal = import_react3.Portal;
 
 // src/components/dialog/dialog.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 function Dialog2(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Portal, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DialogBackdrop, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DialogPositioner, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DialogContent, { ...props }) })
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(Portal, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(DialogBackdrop, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(DialogPositioner, { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(DialogContent, { ...props }) })
   ] });
 }
 
@@ -284,19 +272,20 @@ var CTAModalContext = (0, import_react4.createContext)(null);
 var import_css6 = require("@cerberus/styled-system/css");
 
 // src/components/button/button.tsx
+var import_factory2 = require("@ark-ui/react/factory");
 var import_react5 = require("react");
 var import_css5 = require("@cerberus/styled-system/css");
 var import_recipes5 = require("@cerberus/styled-system/recipes");
 var import_jsx = require("@cerberus/styled-system/jsx");
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 var ButtonContext = (0, import_react5.createContext)({
   pending: false
 });
 function Button(props) {
   const { palette, usage, shape, size, pending = false, ...nativeProps } = props;
   const value = (0, import_react5.useMemo)(() => ({ pending }), [pending]);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ButtonContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-    "button",
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ButtonContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    import_factory2.ark.button,
     {
       ...nativeProps,
       disabled: pending || nativeProps.disabled,
@@ -314,14 +303,14 @@ function Button(props) {
 }
 
 // src/components/cta-dialog/trigger-item.tsx
-var import_factory = require("@ark-ui/react/factory");
+var import_factory3 = require("@ark-ui/react/factory");
 var import_recipes6 = require("@cerberus/styled-system/recipes");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 function TriggerItem(props) {
   const { asChild, children, ...buttonProps } = props;
   if (asChild) {
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-      import_factory.ark.div,
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+      import_factory3.ark.div,
       {
         className: (0, import_css6.cx)(
           (0, import_recipes6.button)({
@@ -337,7 +326,7 @@ function TriggerItem(props) {
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
     Button,
     {
       ...buttonProps,
@@ -352,7 +341,7 @@ function TriggerItem(props) {
 }
 
 // src/components/cta-dialog/provider.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 function CTAModal(props) {
   const [open, setOpen] = (0, import_react6.useState)(false);
   const [content, setContent] = (0, import_react6.useState)(null);
@@ -383,39 +372,37 @@ function CTAModal(props) {
     }),
     [handleShow]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(CTAModalContext.Provider, { value, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(CTAModalContext.Provider, { value, children: [
     props.children,
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(DialogProvider, { open, onOpenChange: (e) => setOpen(e.open), children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Dialog2, { size: "sm", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(DialogCloseIconTrigger, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx2.VStack, { gap: "xl", w: "full", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx2.VStack, { alignItems: "flex-start", gap: "md", w: "full", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx2.VStack, { gap: "lg", w: "full", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-            Avatar,
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogProvider, { open, onOpenChange: (e) => setOpen(e.open), children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(Dialog2, { size: "sm", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogCloseIconTrigger, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx2.VStack, { gap: "xl", w: "full", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_jsx2.VStack, { alignItems: "flex-start", gap: "md", w: "full", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx2.VStack, { gap: "lg", w: "full", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+            Avatar2,
             {
-              ariaLabel: "",
               gradient: "charon-light",
-              icon: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+              fallback: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                 Show,
                 {
                   when: Boolean(confirmIcon),
-                  fallback: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(FallbackIcon, { size: 24 }),
+                  fallback: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FallbackIcon, { size: 24 }),
                   children: confirmIcon
                 }
-              ),
-              src: ""
+              )
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(DialogHeading, { children: content == null ? void 0 : content.heading }),
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(DialogDescription, { children: content == null ? void 0 : content.description })
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogHeading, { children: content == null ? void 0 : content.heading }),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogDescription, { children: content == null ? void 0 : content.description })
         ] }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx2.HStack, { gap: "md", w: "full", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(For, { each: content == null ? void 0 : content.actions._actions, children: (action, index) => {
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_jsx2.HStack, { gap: "md", w: "full", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(For, { each: content == null ? void 0 : content.actions._actions, children: (action, index) => {
           var _a;
-          return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
             Show,
             {
               when: ((_a = content == null ? void 0 : content.actions) == null ? void 0 : _a.type) === "btnAction",
-              fallback: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TriggerItem, { asChild: true, children: action }),
-              children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TriggerItem, { "data-index": index, onClick: handleActionClick, children: action == null ? void 0 : action.text })
+              fallback: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(TriggerItem, { asChild: true, children: action }),
+              children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(TriggerItem, { "data-index": index, onClick: handleActionClick, children: action == null ? void 0 : action.text })
             },
             index
           );