@cerberus-design/react 0.18.4 → 0.19.0

package/build/modern/chunk-QUOJS5LL.js

@@ -0,0 +1,81 @@
+// src/components/spinner/spinner.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function Spinner(props) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      "aria-busy": "true",
+      "data-scope": "spinner",
+      "data-part": "root",
+      role: "status",
+      xmlns: "http://www.w3.org/2000/svg",
+      height: props.size,
+      width: props.size,
+      viewBox: "0 0 24 24",
+      children: /* @__PURE__ */ jsxs(
+        "g",
+        {
+          fill: "none",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: 2,
+          children: [
+            /* @__PURE__ */ jsxs(
+              "path",
+              {
+                strokeDasharray: 16,
+                strokeDashoffset: 16,
+                d: "M12 3c4.97 0 9 4.03 9 9",
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "animate",
+                    {
+                      fill: "freeze",
+                      attributeName: "stroke-dashoffset",
+                      dur: "0.15s",
+                      values: "16;0"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    "animateTransform",
+                    {
+                      attributeName: "transform",
+                      dur: "0.75s",
+                      repeatCount: "indefinite",
+                      type: "rotate",
+                      values: "0 12 12;360 12 12"
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "path",
+              {
+                strokeDasharray: 64,
+                strokeDashoffset: 64,
+                strokeOpacity: 0.3,
+                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",
+                children: /* @__PURE__ */ jsx(
+                  "animate",
+                  {
+                    fill: "freeze",
+                    attributeName: "stroke-dashoffset",
+                    dur: "0.6s",
+                    values: "64;0"
+                  }
+                )
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+}
+
+export {
+  Spinner
+};
+//# sourceMappingURL=chunk-QUOJS5LL.js.map

package/build/modern/chunk-QUOJS5LL.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/spinner/spinner.tsx"],"sourcesContent":["/**\n * This module contains the Spinner component.\n * @module\n */\n\nexport interface SpinnerProps {\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      data-scope=\"spinner\"\n      data-part=\"root\"\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    >\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":";AA6CQ,SAKE,KALF;AAnBD,SAAS,QAAQ,OAAqB;AAC3C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,cAAW;AAAA,MACX,aAAU;AAAA,MACV,MAAK;AAAA,MACL,OAAM;AAAA,MACN,QAAQ,MAAM;AAAA,MACd,OAAO,MAAM;AAAA,MACb,SAAQ;AAAA,MAER;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;","names":[]}

package/build/modern/chunk-QZ5BIUMH.js

@@ -0,0 +1,226 @@
+import {
+  ProgressBar
+} from "./chunk-KTTGGO72.js";
+import {
+  Field
+} from "./chunk-SFQIENJB.js";
+import {
+  IconButton
+} from "./chunk-G4CDF7LY.js";
+import {
+  Avatar
+} from "./chunk-WJHG3ZFR.js";
+import {
+  FieldHelperText
+} from "./chunk-MBZHMWPR.js";
+import {
+  useCerberusContext
+} from "./chunk-GITT5645.js";
+
+// src/components/file-upload/file-status.tsx
+import {
+  useCallback,
+  useMemo
+} from "react";
+import { fileStatus } from "styled-system/recipes";
+import { css, cx } from "styled-system/css";
+import { hstack, vstack } from "styled-system/patterns";
+import { jsx, jsxs } from "react/jsx-runtime";
+var processStatus = /* @__PURE__ */ ((processStatus2) => {
+  processStatus2["TODO"] = "todo";
+  processStatus2["PROCESSING"] = "processing";
+  processStatus2["DONE"] = "done";
+  processStatus2["ERROR"] = "error";
+  return processStatus2;
+})(processStatus || {});
+function FileStatus(props) {
+  const { file, now, status, onClick, ...nativeProps } = props;
+  const actionLabel = useMemo(() => getStatusActionLabel(status), [status]);
+  const palette = useMemo(() => getPalette(status), [status]);
+  const modalIconPalette = useMemo(() => getModalIconPalette(status), [status]);
+  const styles = useMemo(() => {
+    switch (status) {
+      case "todo" /* TODO */:
+        return fileStatus({ status: "todo" });
+      case "processing" /* PROCESSING */:
+        return fileStatus({ status: "processing" });
+      case "done" /* DONE */:
+        return fileStatus({ status: "done" });
+      case "error" /* ERROR */:
+        return fileStatus({ status: "error" });
+      default:
+        return fileStatus();
+    }
+  }, [status]);
+  const handleClick = useCallback(
+    (e) => {
+      const actionStatus = getStatusActionLabel(
+        status
+      ).toLocaleLowerCase();
+      onClick(actionStatus, e);
+    },
+    [onClick, status]
+  );
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...nativeProps,
+      className: cx(nativeProps.className, styles.root, hstack()),
+      children: [
+        /* @__PURE__ */ jsx(
+          Avatar,
+          {
+            gradient: modalIconPalette,
+            fallback: /* @__PURE__ */ jsx(MatchFileStatusIcon, { size: 24, status })
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: vstack({
+              alignItems: "flex-start",
+              gap: "0.12rem",
+              w: "full"
+            }),
+            children: [
+              /* @__PURE__ */ jsx(
+                "small",
+                {
+                  className: css({
+                    color: "page.text.initial",
+                    textStyle: "label-sm"
+                  }),
+                  children: file
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                ProgressBar,
+                {
+                  id: props.id,
+                  label: "File upload status",
+                  now,
+                  size: "sm"
+                }
+              ),
+              /* @__PURE__ */ jsx(Field, { label: "", invalid: modalIconPalette === "hades-dark", children: /* @__PURE__ */ jsx(
+                FieldHelperText,
+                {
+                  className: css({
+                    color: "page.text.100"
+                  }),
+                  id: `help:${file}`,
+                  children: /* @__PURE__ */ jsx(MatchFileStatusText, { status, now })
+                }
+              ) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            ariaLabel: actionLabel,
+            onClick: handleClick,
+            palette,
+            size: "sm",
+            children: /* @__PURE__ */ jsx(MatchStatusAction, { status })
+          }
+        )
+      ]
+    }
+  );
+}
+function MatchFileStatusIcon(props) {
+  const { icons } = useCerberusContext();
+  const {
+    waitingFileUploader: TodoIcon,
+    fileUploader: FileUploaderIcon,
+    invalidAlt: InvalidIcon,
+    successNotification: DoneIcon
+  } = icons;
+  switch (props.status) {
+    case "todo" /* TODO */:
+      return /* @__PURE__ */ jsx(TodoIcon, { size: props.size });
+    case "processing" /* PROCESSING */:
+      return /* @__PURE__ */ jsx(FileUploaderIcon, { size: props.size });
+    case "done" /* DONE */:
+      return /* @__PURE__ */ jsx(DoneIcon, { size: props.size });
+    case "error" /* ERROR */:
+      return /* @__PURE__ */ jsx(InvalidIcon, { size: props.size });
+    default:
+      throw new Error("Unknown status");
+  }
+}
+function MatchFileStatusText(props) {
+  switch (props.status) {
+    case "todo" /* TODO */:
+      return "Waiting to upload";
+    case "processing" /* PROCESSING */:
+      return `${props.now}% Complete`;
+    case "done" /* DONE */:
+      return "File uploaded successfully";
+    case "error" /* ERROR */:
+      return "There was an error uploading the file";
+    default:
+      throw new Error("Invalid status");
+  }
+}
+function MatchStatusAction(props) {
+  const { icons } = useCerberusContext();
+  const { close: CloseIcon, redo: RedoIcon, delete: TrashIcon } = icons;
+  switch (props.status) {
+    case "todo" /* TODO */:
+    case "processing" /* PROCESSING */:
+      return /* @__PURE__ */ jsx(CloseIcon, {});
+    case "error" /* ERROR */:
+      return /* @__PURE__ */ jsx(RedoIcon, {});
+    case "done" /* DONE */:
+      return /* @__PURE__ */ jsx(TrashIcon, {});
+    default:
+      throw new Error("Invalid status");
+  }
+}
+function getStatusActionLabel(status) {
+  switch (status) {
+    case "todo" /* TODO */:
+    case "processing" /* PROCESSING */:
+      return "Cancel";
+    case "error" /* ERROR */:
+      return "Retry";
+    case "done" /* DONE */:
+      return "Delete";
+    default:
+      return "";
+  }
+}
+function getPalette(status) {
+  switch (status) {
+    case "todo" /* TODO */:
+    case "processing" /* PROCESSING */:
+      return "danger";
+    case "error" /* ERROR */:
+      return "action";
+    case "done" /* DONE */:
+      return "danger";
+    default:
+      return "action";
+  }
+}
+function getModalIconPalette(status) {
+  switch (status) {
+    case "todo" /* TODO */:
+    case "processing" /* PROCESSING */:
+      return "charon-light";
+    case "error" /* ERROR */:
+      return "hades-dark";
+    case "done" /* DONE */:
+      return "thanatos-light";
+    default:
+      return "charon-light";
+  }
+}
+
+export {
+  processStatus,
+  FileStatus
+};
+//# sourceMappingURL=chunk-QZ5BIUMH.js.map

package/build/modern/chunk-QZ5BIUMH.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/file-upload/file-status.tsx"],"sourcesContent":["'use client'\n\nimport {\n  useCallback,\n  useMemo,\n  type HTMLAttributes,\n  type MouseEvent,\n} from 'react'\nimport { fileStatus, type FileStatusVariantProps } from 'styled-system/recipes'\nimport { css, cx } from 'styled-system/css'\nimport { hstack, vstack } from 'styled-system/patterns'\nimport { useCerberusContext } from '../../context/cerberus'\nimport { ProgressBar, type ProgressBarProps } from '../progress/index'\nimport { IconButton } from '../icon-button/index'\nimport { Avatar } from '../avatar/avatar'\nimport { Field, FieldHelperText } from '../field/index'\n\n/**\n * This module contains the FileStatus component.\n * @module\n */\n\n/**\n * The available values of the fileStatus helper Object.\n * @example\n * ```tsx\n * import { fileStatus } from '@cerberus/react'\n * processStatus.TODO // 'todo'\n * ```\n */\nexport type FileStatusKey = (typeof processStatus)[keyof typeof processStatus]\n\n/**\n * The actions that can be performed on a file.\n */\nexport type FileStatusActions = 'cancel' | 'retry' | 'delete'\nexport interface FileBaseStatusProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'onClick'> {\n  /**\n   * A unique identifier for the file status. Required for accessibility.\n   */\n  id: string\n  /**\n   * The name of the file.\n   */\n  file: string\n  /**\n   * The percentage of the file that has been processed.\n   */\n  now: ProgressBarProps['now']\n  /**\n   * The status of the file.\n   */\n  status: processStatus\n  /**\n   * The action to perform on the file when a user clicks the\n   * button located at the end of the status card.\n   * @param status - The status of the file.\n   * @param e - The event object.\n   * @example\n   * ```tsx\n   * <FileStatus file=\"file.txt\" now={0} status={processStatus.TODO} action={(status, e) => console.log(status, e)} />\n   * ```\n   * @default () => {}\n   */\n  onClick: (status: FileStatusActions, e: MouseEvent<HTMLButtonElement>) => void\n}\nexport type FileStatusProps = FileBaseStatusProps & FileStatusVariantProps\n\n/**\n * A helper object to represent the status of a file.\n * @example\n * ```tsx\n * import { fileStatus } from '@cerberus/react'\n * processStatus.TODO // 'todo'\n * ```\n */\nexport const enum processStatus {\n  TODO = 'todo',\n  PROCESSING = 'processing',\n  DONE = 'done',\n  ERROR = 'error',\n}\n\n/**\n * A component that displays the status of a file during file processing.\n * @see https://cerberus.digitalu.design/react/file-uploader\n * @example\n * ```tsx\n * <FileStatus file=\"file.txt\" now={0} status={processStatus.TODO} action={(status, e) => console.log(status, e)} />\n * ```\n */\nexport function FileStatus(props: FileStatusProps) {\n  const { file, now, status, onClick, ...nativeProps } = props\n  const actionLabel = useMemo(() => getStatusActionLabel(status), [status])\n  const palette = useMemo(() => getPalette(status), [status])\n  const modalIconPalette = useMemo(() => getModalIconPalette(status), [status])\n  const styles = useMemo(() => {\n    switch (status) {\n      case processStatus.TODO:\n        return fileStatus({ status: 'todo' })\n      case processStatus.PROCESSING:\n        return fileStatus({ status: 'processing' })\n      case processStatus.DONE:\n        return fileStatus({ status: 'done' })\n      case processStatus.ERROR:\n        return fileStatus({ status: 'error' })\n      default:\n        return fileStatus()\n    }\n  }, [status])\n\n  const handleClick = useCallback(\n    (e: MouseEvent<HTMLButtonElement>) => {\n      const actionStatus = getStatusActionLabel(\n        status,\n      ).toLocaleLowerCase() as FileStatusActions\n      onClick(actionStatus, e)\n    },\n    [onClick, status],\n  )\n\n  return (\n    <div\n      {...nativeProps}\n      className={cx(nativeProps.className, styles.root, hstack())}\n    >\n      <Avatar\n        gradient={modalIconPalette}\n        fallback={<MatchFileStatusIcon size={24} status={status} />}\n      />\n\n      <div\n        className={vstack({\n          alignItems: 'flex-start',\n          gap: '0.12rem',\n          w: 'full',\n        })}\n      >\n        <small\n          className={css({\n            color: 'page.text.initial',\n            textStyle: 'label-sm',\n          })}\n        >\n          {file}\n        </small>\n        <ProgressBar\n          id={props.id}\n          label=\"File upload status\"\n          now={now}\n          size=\"sm\"\n        />\n        <Field label=\"\" invalid={modalIconPalette === 'hades-dark'}>\n          <FieldHelperText\n            className={css({\n              color: 'page.text.100',\n            })}\n            id={`help:${file}`}\n          >\n            <MatchFileStatusText status={status} now={now} />\n          </FieldHelperText>\n        </Field>\n      </div>\n\n      <IconButton\n        ariaLabel={actionLabel}\n        onClick={handleClick}\n        palette={palette}\n        size=\"sm\"\n      >\n        <MatchStatusAction status={status} />\n      </IconButton>\n    </div>\n  )\n}\n\ninterface FileStatusElProps {\n  status: FileStatusProps['status']\n  size?: 16 | 20 | 24 | 32\n  now?: number\n}\n\nfunction MatchFileStatusIcon(props: FileStatusElProps) {\n  const { icons } = useCerberusContext()\n  const {\n    waitingFileUploader: TodoIcon,\n    fileUploader: FileUploaderIcon,\n    invalidAlt: InvalidIcon,\n    successNotification: DoneIcon,\n  } = icons\n\n  switch (props.status) {\n    case processStatus.TODO:\n      return <TodoIcon size={props.size} />\n    case processStatus.PROCESSING:\n      return <FileUploaderIcon size={props.size} />\n    case processStatus.DONE:\n      return <DoneIcon size={props.size} />\n    case processStatus.ERROR:\n      return <InvalidIcon size={props.size} />\n    default:\n      throw new Error('Unknown status')\n  }\n}\n\nfunction MatchFileStatusText(props: FileStatusElProps) {\n  switch (props.status) {\n    case processStatus.TODO:\n      return 'Waiting to upload'\n    case processStatus.PROCESSING:\n      return `${props.now}% Complete`\n    case processStatus.DONE:\n      return 'File uploaded successfully'\n    case processStatus.ERROR:\n      return 'There was an error uploading the file'\n    default:\n      throw new Error('Invalid status')\n  }\n}\n\nfunction MatchStatusAction(props: FileStatusElProps) {\n  const { icons } = useCerberusContext()\n  const { close: CloseIcon, redo: RedoIcon, delete: TrashIcon } = icons\n  switch (props.status) {\n    case processStatus.TODO:\n    case processStatus.PROCESSING:\n      return <CloseIcon />\n    case processStatus.ERROR:\n      return <RedoIcon />\n    case processStatus.DONE:\n      return <TrashIcon />\n    default:\n      throw new Error('Invalid status')\n  }\n}\n\nfunction getStatusActionLabel(status: FileStatusKey) {\n  switch (status) {\n    case processStatus.TODO:\n    case processStatus.PROCESSING:\n      return 'Cancel'\n    case processStatus.ERROR:\n      return 'Retry'\n    case processStatus.DONE:\n      return 'Delete'\n    default:\n      return ''\n  }\n}\n\nfunction getPalette(status: FileStatusKey) {\n  switch (status) {\n    case processStatus.TODO:\n    case processStatus.PROCESSING:\n      return 'danger'\n    case processStatus.ERROR:\n      return 'action'\n    case processStatus.DONE:\n      return 'danger'\n    default:\n      return 'action'\n  }\n}\n\nfunction getModalIconPalette(status: FileStatusKey) {\n  switch (status) {\n    case processStatus.TODO:\n    case processStatus.PROCESSING:\n      return 'charon-light'\n    case processStatus.ERROR:\n      return 'hades-dark'\n    case processStatus.DONE:\n      return 'thanatos-light'\n    default:\n      return 'charon-light'\n  }\n}\n"],"mappings":"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","names":["processStatus"]}

package/build/modern/chunk-RIBBTTT4.js

@@ -0,0 +1,36 @@
+import {
+  Spinner
+} from "./chunk-QUOJS5LL.js";
+import {
+  ButtonRoot
+} from "./chunk-4FRIJ5VV.js";
+import {
+  Show
+} from "./chunk-NUXMADXV.js";
+
+// src/components/button/button.tsx
+import {
+  createContext,
+  useContext,
+  useMemo
+} from "react";
+import { Box } from "styled-system/jsx";
+import { Fragment, jsx } from "react/jsx-runtime";
+var ButtonContext = createContext({
+  pending: false
+});
+function Button(props) {
+  const { pending = false, ...nativeProps } = props;
+  const value = useMemo(() => ({ pending }), [pending]);
+  return /* @__PURE__ */ jsx(ButtonContext.Provider, { value, children: /* @__PURE__ */ jsx(ButtonRoot, { ...nativeProps, disabled: pending || nativeProps.disabled }) });
+}
+function ButtonIcon(props) {
+  const { pending } = useContext(ButtonContext);
+  return /* @__PURE__ */ jsx(Show, { when: pending, fallback: /* @__PURE__ */ jsx(Fragment, { children: props.children }), children: /* @__PURE__ */ jsx(Box, { w: "4", children: /* @__PURE__ */ jsx(Spinner, {}) }) });
+}
+
+export {
+  Button,
+  ButtonIcon
+};
+//# sourceMappingURL=chunk-RIBBTTT4.js.map

package/build/modern/chunk-RIBBTTT4.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/button/button.tsx"],"sourcesContent":["'use client'\n\nimport { type HTMLArkProps } from '@ark-ui/react/factory'\nimport {\n  type PropsWithChildren,\n  createContext,\n  useContext,\n  useMemo,\n} from 'react'\nimport { type ButtonVariantProps } from 'styled-system/recipes'\nimport { Box } from 'styled-system/jsx'\nimport type { CerberusPrimitiveProps } from '../../system/types'\nimport { Show } from '../show/index'\nimport { Spinner } from '../spinner/index'\nimport { ButtonRoot } from './primitives'\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 = CerberusPrimitiveProps<\n  HTMLArkProps<'button'> &\n    ButtonVariantProps & {\n      pending?: boolean\n    }\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 { pending = false, ...nativeProps } = props\n  const value = useMemo(() => ({ pending }), [pending])\n  return (\n    <ButtonContext.Provider value={value}>\n      <ButtonRoot {...nativeProps} disabled={pending || nativeProps.disabled} />\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"],"mappings":";;;;;;;;;;;AAGA;AAAA,EAEE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,WAAW;AAmCd,SAY6B,UAZ7B;AApBN,IAAM,gBAAgB,cAAkC;AAAA,EACtD,SAAS;AACX,CAAC;AAaM,SAAS,OAAO,OAAoB;AACzC,QAAM,EAAE,UAAU,OAAO,GAAG,YAAY,IAAI;AAC5C,QAAM,QAAQ,QAAQ,OAAO,EAAE,QAAQ,IAAI,CAAC,OAAO,CAAC;AACpD,SACE,oBAAC,cAAc,UAAd,EAAuB,OACtB,8BAAC,cAAY,GAAG,aAAa,UAAU,WAAW,YAAY,UAAU,GAC1E;AAEJ;AAMO,SAAS,WAAW,OAAkC;AAC3D,QAAM,EAAE,QAAQ,IAAI,WAAW,aAAa;AAC5C,SACE,oBAAC,QAAK,MAAM,SAAS,UAAU,gCAAG,gBAAM,UAAS,GAC/C,8BAAC,OAAI,GAAE,KACL,8BAAC,WAAQ,GACX,GACF;AAEJ;","names":[]}

package/build/modern/chunk-RJGEKVHZ.js

@@ -0,0 +1,59 @@
+import {
+  DatePickerClearTrigger,
+  DatePickerContent,
+  DatePickerContext,
+  DatePickerControl,
+  DatePickerInputEl,
+  DatePickerLabel,
+  DatePickerMonthSelect,
+  DatePickerNextTrigger,
+  DatePickerPositioner,
+  DatePickerPrevTrigger,
+  DatePickerRangeText,
+  DatePickerRoot,
+  DatePickerTable,
+  DatePickerTableBody,
+  DatePickerTableCell,
+  DatePickerTableCellTrigger,
+  DatePickerTableHead,
+  DatePickerTableHeader,
+  DatePickerTableRow,
+  DatePickerTrigger,
+  DatePickerView,
+  DatePickerViewControl,
+  DatePickerViewTrigger,
+  DatePickerYearSelect
+} from "./chunk-DJCPF4JA.js";
+
+// src/components/date-picker/parts.ts
+var DatePickerParts = {
+  Root: DatePickerRoot,
+  Label: DatePickerLabel,
+  Control: DatePickerControl,
+  Input: DatePickerInputEl,
+  Trigger: DatePickerTrigger,
+  ClearTrigger: DatePickerClearTrigger,
+  Positioner: DatePickerPositioner,
+  Content: DatePickerContent,
+  YearSelect: DatePickerYearSelect,
+  MonthSelect: DatePickerMonthSelect,
+  View: DatePickerView,
+  Context: DatePickerContext,
+  ViewControl: DatePickerViewControl,
+  PrevTrigger: DatePickerPrevTrigger,
+  NextTrigger: DatePickerNextTrigger,
+  ViewTrigger: DatePickerViewTrigger,
+  RangeText: DatePickerRangeText,
+  Table: DatePickerTable,
+  TableHead: DatePickerTableHead,
+  TableRow: DatePickerTableRow,
+  TableHeader: DatePickerTableHeader,
+  TableBody: DatePickerTableBody,
+  TableCell: DatePickerTableCell,
+  TableCellTrigger: DatePickerTableCellTrigger
+};
+
+export {
+  DatePickerParts
+};
+//# sourceMappingURL=chunk-RJGEKVHZ.js.map

package/build/modern/chunk-RMEVOJ2E.js

@@ -0,0 +1 @@
+//# sourceMappingURL=chunk-RMEVOJ2E.js.map

package/build/modern/chunk-SFQIENJB.js

@@ -0,0 +1,40 @@
+import {
+  HelperText
+} from "./chunk-DWKGFNTK.js";
+import {
+  Show
+} from "./chunk-NUXMADXV.js";
+import {
+  FieldErrorText,
+  FieldHelperText,
+  FieldLabel,
+  FieldRoot
+} from "./chunk-MBZHMWPR.js";
+import {
+  splitProps
+} from "./chunk-BL7G3577.js";
+
+// src/components/field/field.tsx
+import { HStack } from "styled-system/jsx";
+import { jsx, jsxs } from "react/jsx-runtime";
+function Field(props) {
+  const [statusProps, fieldProps, rootProps] = splitProps(
+    props,
+    ["disabled", "required", "readOnly", "invalid"],
+    ["label", "helperText", "secondaryHelperText", "errorText", "children"]
+  );
+  return /* @__PURE__ */ jsxs(FieldRoot, { ...statusProps, ...rootProps, children: [
+    /* @__PURE__ */ jsx(Show, { when: fieldProps.label, children: /* @__PURE__ */ jsx(FieldLabel, { children: fieldProps.label }) }),
+    fieldProps.children,
+    /* @__PURE__ */ jsxs(HStack, { justifyContent: "space-between", w: "full", children: [
+      /* @__PURE__ */ jsx(HelperText, { invalid: statusProps.invalid, children: fieldProps.helperText }),
+      /* @__PURE__ */ jsx(FieldErrorText, { children: fieldProps.errorText }),
+      /* @__PURE__ */ jsx(Show, { when: fieldProps.secondaryHelperText, children: /* @__PURE__ */ jsx(FieldHelperText, { children: fieldProps.secondaryHelperText }) })
+    ] })
+  ] });
+}
+
+export {
+  Field
+};
+//# sourceMappingURL=chunk-SFQIENJB.js.map

package/build/modern/chunk-SFQIENJB.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/field/field.tsx"],"sourcesContent":["import { type FieldRootProps } from '@ark-ui/react/field'\nimport { HStack } from 'styled-system/jsx'\nimport { splitProps } from '../../utils/index'\nimport { Show } from '../show/index'\nimport {\n  FieldErrorText,\n  FieldHelperText,\n  FieldLabel,\n  FieldRoot,\n} from './primitives'\nimport { HelperText } from './helper-text'\n\nexport interface FieldProps extends FieldRootProps {\n  /**\n   * The label of the field.\n   */\n  label?: string\n  /**\n   * The helper text of the field.\n   */\n  helperText?: string\n  /**\n   * A helper text positioned at the end of the field. Good for Textarea fields.\n   */\n  secondaryHelperText?: string\n  /**\n   * The error text of the field. Shown when the field is invalid.\n   */\n  errorText?: string\n}\n\n/**\n * The Field component is the context provider for all FieldParts and displays\n * the label, helperText, and ErrorText.\n * @description [Field Docs](https://cerberus.digitalu.design/react/field)\n * @example\n * ```tsx\n * <Field\n *  ids={{\n *   control: 'firstName',\n *  }}\n *  label=\"Label\"\n *  helperText=\"This is what people will see on your profile.\"\n *  errorText=\"A first name is required to create an account.\"\n *  required\n * >\n *   <Input name=\"firstName\" type=\"text\" />\n * </Field>\n * ```\n */\nexport function Field(props: FieldProps) {\n  const [statusProps, fieldProps, rootProps] = splitProps(\n    props,\n    ['disabled', 'required', 'readOnly', 'invalid'],\n    ['label', 'helperText', 'secondaryHelperText', 'errorText', 'children'],\n  )\n\n  return (\n    <FieldRoot {...statusProps} {...rootProps}>\n      <Show when={fieldProps.label}>\n        <FieldLabel>{fieldProps.label}</FieldLabel>\n      </Show>\n\n      {fieldProps.children}\n\n      <HStack justifyContent=\"space-between\" w=\"full\">\n        <HelperText invalid={statusProps.invalid}>\n          {fieldProps.helperText}\n        </HelperText>\n\n        <FieldErrorText>{fieldProps.errorText}</FieldErrorText>\n\n        <Show when={fieldProps.secondaryHelperText}>\n          <FieldHelperText>{fieldProps.secondaryHelperText}</FieldHelperText>\n        </Show>\n      </HStack>\n    </FieldRoot>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AACA,SAAS,cAAc;AA2Df,cAKF,YALE;AAVD,SAAS,MAAM,OAAmB;AACvC,QAAM,CAAC,aAAa,YAAY,SAAS,IAAI;AAAA,IAC3C;AAAA,IACA,CAAC,YAAY,YAAY,YAAY,SAAS;AAAA,IAC9C,CAAC,SAAS,cAAc,uBAAuB,aAAa,UAAU;AAAA,EACxE;AAEA,SACE,qBAAC,aAAW,GAAG,aAAc,GAAG,WAC9B;AAAA,wBAAC,QAAK,MAAM,WAAW,OACrB,8BAAC,cAAY,qBAAW,OAAM,GAChC;AAAA,IAEC,WAAW;AAAA,IAEZ,qBAAC,UAAO,gBAAe,iBAAgB,GAAE,QACvC;AAAA,0BAAC,cAAW,SAAS,YAAY,SAC9B,qBAAW,YACd;AAAA,MAEA,oBAAC,kBAAgB,qBAAW,WAAU;AAAA,MAEtC,oBAAC,QAAK,MAAM,WAAW,qBACrB,8BAAC,mBAAiB,qBAAW,qBAAoB,GACnD;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}

package/build/modern/chunk-SQRFRBDB.js

@@ -0,0 +1,48 @@
+import {
+  createCerberusPrimitive
+} from "./chunk-WC5DERNW.js";
+
+// src/components/radio/primitives.tsx
+import {
+  RadioGroup as ArkRadioGroup
+} from "@ark-ui/react/radio-group";
+import { radioGroup } from "styled-system/recipes";
+var { withSlotRecipe } = createCerberusPrimitive(radioGroup);
+var RadioGroupRoot = withSlotRecipe(
+  ArkRadioGroup.Root,
+  "root"
+);
+var RadioGroupLabel = withSlotRecipe(
+  ArkRadioGroup.Label,
+  "label"
+);
+var RadioGroupIndicator = withSlotRecipe(
+  ArkRadioGroup.Indicator,
+  "indicator"
+);
+var RadioGroupItem = withSlotRecipe(
+  ArkRadioGroup.Item,
+  "item"
+);
+var RadioGroupItemText = withSlotRecipe(
+  ArkRadioGroup.ItemText,
+  "itemText"
+);
+var RadioGroupItemControl = withSlotRecipe(
+  ArkRadioGroup.ItemControl,
+  "itemControl"
+);
+var RadioGroupItemHiddenInput = ArkRadioGroup.ItemHiddenInput;
+var RadioGroup = RadioGroupRoot;
+
+export {
+  RadioGroupRoot,
+  RadioGroupLabel,
+  RadioGroupIndicator,
+  RadioGroupItem,
+  RadioGroupItemText,
+  RadioGroupItemControl,
+  RadioGroupItemHiddenInput,
+  RadioGroup
+};
+//# sourceMappingURL=chunk-SQRFRBDB.js.map

package/build/modern/chunk-SQRFRBDB.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/radio/primitives.tsx"],"sourcesContent":["import {\n  RadioGroup as ArkRadioGroup,\n  type RadioGroupIndicatorProps as ArkRadioGroupIndicatorProps,\n  type RadioGroupItemControlProps as ArkRadioGroupItemControlProps,\n  type RadioGroupItemHiddenInputProps as ArkRadioGroupItemHiddenInputProps,\n  type RadioGroupItemProps as ArkRadioGroupItemProps,\n  type RadioGroupItemTextProps as ArkRadioGroupItemTextProps,\n  type RadioGroupLabelProps as ArkRadioGroupLabelProps,\n  type RadioGroupRootProps as ArkRadioGroupRootProps,\n} from '@ark-ui/react/radio-group'\nimport { radioGroup, type RadioGroupVariantProps } from 'styled-system/recipes'\nimport {\n  createCerberusPrimitive,\n  type CerberusPrimitiveProps,\n} from '../../system/index'\n\n/**\n * This module contains the Radio primitives\n * @module 'react/radio'\n */\n\nconst { withSlotRecipe } = createCerberusPrimitive(radioGroup)\n\n// Root\n\nexport type RadioGroupRootProps = CerberusPrimitiveProps<\n  ArkRadioGroupRootProps & RadioGroupVariantProps\n>\n// @ts-expect-error this is a workaround for the type WIP\nexport const RadioGroupRoot = withSlotRecipe<RadioGroupRootProps>(\n  ArkRadioGroup.Root,\n  'root',\n)\n\n// Label\n\nexport type RadioGroupLabelProps =\n  CerberusPrimitiveProps<ArkRadioGroupLabelProps>\nexport const RadioGroupLabel = withSlotRecipe<RadioGroupLabelProps>(\n  ArkRadioGroup.Label,\n  'label',\n)\n\n// Indicator\n\nexport type RadioGroupIndicatorProps =\n  CerberusPrimitiveProps<ArkRadioGroupIndicatorProps>\nexport const RadioGroupIndicator = withSlotRecipe<RadioGroupIndicatorProps>(\n  ArkRadioGroup.Indicator,\n  'indicator',\n)\n\n// Item\n\nexport type RadioGroupItemProps = CerberusPrimitiveProps<ArkRadioGroupItemProps>\nexport const RadioGroupItem = withSlotRecipe<RadioGroupItemProps>(\n  ArkRadioGroup.Item,\n  'item',\n)\n\n// Item Text\n\nexport type RadioGroupItemTextProps = CerberusPrimitiveProps<\n  ArkRadioGroupItemTextProps & RadioGroupVariantProps\n>\nexport const RadioGroupItemText = withSlotRecipe<RadioGroupItemTextProps>(\n  ArkRadioGroup.ItemText,\n  'itemText',\n)\n\n// Item Control\n\nexport type RadioGroupItemControlProps = CerberusPrimitiveProps<\n  ArkRadioGroupItemControlProps & RadioGroupVariantProps\n>\nexport const RadioGroupItemControl = withSlotRecipe<RadioGroupItemControlProps>(\n  ArkRadioGroup.ItemControl,\n  'itemControl',\n)\n\n// Item Hidden Input\n\nexport type RadioGroupItemHiddenInputProps = ArkRadioGroupItemHiddenInputProps\nexport const RadioGroupItemHiddenInput = ArkRadioGroup.ItemHiddenInput\n\n/**\n * The context provider for a set of radio buttons.\n * It provides the necessary context for managing the state of the radio group.\n * @see {@link https://cerberus.digitalu.design/react/radio/overview}\n *\n * @example\n * ```tsx\n * import { RadioGroup } from '@cerberus/react/radio';\n *\n * <RadioGroup defaultValue=\"cerberus\">\n *   <Radio value=\"cerberus\">Cerberus</Radio>\n *   <Radio value=\"hades\">Hades</Radio>\n *   <Radio value=\"zeus\">Zeus</Radio>\n * </RadioGroup>\n * ```\n */\nexport const RadioGroup = RadioGroupRoot\n"],"mappings":";;;;;AAAA;AAAA,EACE,cAAc;AAAA,OAQT;AACP,SAAS,kBAA+C;AAWxD,IAAM,EAAE,eAAe,IAAI,wBAAwB,UAAU;AAQtD,IAAM,iBAAiB;AAAA,EAC5B,cAAc;AAAA,EACd;AACF;AAMO,IAAM,kBAAkB;AAAA,EAC7B,cAAc;AAAA,EACd;AACF;AAMO,IAAM,sBAAsB;AAAA,EACjC,cAAc;AAAA,EACd;AACF;AAKO,IAAM,iBAAiB;AAAA,EAC5B,cAAc;AAAA,EACd;AACF;AAOO,IAAM,qBAAqB;AAAA,EAChC,cAAc;AAAA,EACd;AACF;AAOO,IAAM,wBAAwB;AAAA,EACnC,cAAc;AAAA,EACd;AACF;AAKO,IAAM,4BAA4B,cAAc;AAkBhD,IAAM,aAAa;","names":[]}

package/build/modern/chunk-T5TX5YHC.js

@@ -0,0 +1,25 @@
+import {
+  cerberus
+} from "./chunk-WC5DERNW.js";
+
+// src/components/theme/theme.tsx
+import { jsx } from "react/jsx-runtime";
+function Theme(props) {
+  const { mode, theme, ...nativeProps } = props;
+  const colorMode = mode || "light";
+  const themeName = theme || "cerberus";
+  return /* @__PURE__ */ jsx(
+    cerberus.div,
+    {
+      ...nativeProps,
+      "data-panda-theme": themeName,
+      "data-color-mode": colorMode,
+      children: props.children
+    }
+  );
+}
+
+export {
+  Theme
+};
+//# sourceMappingURL=chunk-T5TX5YHC.js.map

package/build/modern/chunk-T5TX5YHC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/theme/theme.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react'\nimport type { ColorModes, CustomThemes } from '../../context/theme'\nimport { cerberus, type CerberusPrimitiveProps } from '../../system'\n\nexport interface ThemeProps<T extends string> {\n  /**\n   * The color mode to apply to the theme.\n   * @default 'light'\n   */\n  mode?: ColorModes\n  /**\n   * The theme to apply to the component.\n   * @default 'cerberus'\n   */\n  theme?: CustomThemes<T>\n}\n\nexport function Theme<T extends string>(\n  props: PropsWithChildren<CerberusPrimitiveProps<ThemeProps<T>>>,\n) {\n  const { mode, theme, ...nativeProps } = props\n  const colorMode = mode || 'light'\n  const themeName = theme || 'cerberus'\n\n  return (\n    <cerberus.div\n      {...nativeProps}\n      data-panda-theme={themeName}\n      data-color-mode={colorMode}\n    >\n      {props.children}\n    </cerberus.div>\n  )\n}\n"],"mappings":";;;;;AAyBI;AARG,SAAS,MACd,OACA;AACA,QAAM,EAAE,MAAM,OAAO,GAAG,YAAY,IAAI;AACxC,QAAM,YAAY,QAAQ;AAC1B,QAAM,YAAY,SAAS;AAE3B,SACE;AAAA,IAAC,SAAS;AAAA,IAAT;AAAA,MACE,GAAG;AAAA,MACJ,oBAAkB;AAAA,MAClB,mBAAiB;AAAA,MAEhB,gBAAM;AAAA;AAAA,EACT;AAEJ;","names":[]}

package/build/modern/chunk-TCACYLCL.js

@@ -0,0 +1,40 @@
+import {
+  AccordionChevronItemIndicator
+} from "./chunk-GPGFQNJ6.js";
+import {
+  AccordionParts
+} from "./chunk-4NW7Q2VS.js";
+import {
+  Show
+} from "./chunk-NUXMADXV.js";
+import {
+  splitProps
+} from "./chunk-BL7G3577.js";
+
+// src/components/accordion/item-group.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function Accordion(props) {
+  return /* @__PURE__ */ jsx(AccordionParts.Root, { ...props });
+}
+function AccordionItemGroup(props) {
+  const [groupProps, itemProps] = splitProps(props, [
+    "heading",
+    "children",
+    "indicatorPosition"
+  ]);
+  const indicatorPosition = groupProps.indicatorPosition ?? "end";
+  return /* @__PURE__ */ jsxs(AccordionParts.Item, { ...itemProps, children: [
+    /* @__PURE__ */ jsxs(AccordionParts.ItemTrigger, { "data-indicator-position": indicatorPosition, children: [
+      /* @__PURE__ */ jsx(Show, { when: indicatorPosition === "start", children: /* @__PURE__ */ jsx(AccordionChevronItemIndicator, {}) }),
+      groupProps.heading,
+      /* @__PURE__ */ jsx(Show, { when: indicatorPosition === "end", children: /* @__PURE__ */ jsx(AccordionChevronItemIndicator, {}) })
+    ] }),
+    /* @__PURE__ */ jsx(AccordionParts.ItemContent, { children: groupProps.children })
+  ] });
+}
+
+export {
+  Accordion,
+  AccordionItemGroup
+};
+//# sourceMappingURL=chunk-TCACYLCL.js.map

package/build/modern/chunk-TCACYLCL.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/accordion/item-group.tsx"],"sourcesContent":["import type {\n  AccordionItemProps,\n  AccordionRootProps,\n} from '@ark-ui/react/accordion'\nimport { type AccordionVariantProps } from 'styled-system/recipes'\nimport { splitProps } from '../../utils/index'\nimport { Show } from '../show/index'\nimport { AccordionParts } from './parts'\nimport { AccordionChevronItemIndicator } from './item-indicator'\n\n/**\n * This module contains an abstraction of the AccordionItem components.\n * @module\n */\n\nexport function Accordion(props: AccordionRootProps & AccordionVariantProps) {\n  return <AccordionParts.Root {...props} />\n}\n\nexport interface AccordionItemGroupProps\n  extends AccordionItemProps,\n    AccordionVariantProps {\n  /**\n   * The heading of the accordion item to open and close the content.\n   */\n  heading: string\n  /**\n   * The position of the arrow indicator.\n   */\n  indicatorPosition?: 'start' | 'end'\n}\n\n/**\n * The AccordionItemGroup component is an abstraction of the Accordion primitive\n * components which renders an accordion item with a heading and an indicator.\n *\n * It is a wrapper around the `AccordionParts.Item`, `AccordionParts.\n * ItemTrigger`, `AccordionParts.ItemIndicator`, and `AccordionParts.ItemContent` components.\n *\n * @description [Cerberus docs](https://cerberus.digitalu.design/react/accordion)\n * @description [Ark docs](https://ark-ui.com/react/docs/components/accordion)\n */\nexport function AccordionItemGroup(props: AccordionItemGroupProps) {\n  const [groupProps, itemProps] = splitProps(props, [\n    'heading',\n    'children',\n    'indicatorPosition',\n  ])\n  const indicatorPosition = groupProps.indicatorPosition ?? 'end'\n\n  return (\n    <AccordionParts.Item {...itemProps}>\n      <AccordionParts.ItemTrigger data-indicator-position={indicatorPosition}>\n        <Show when={indicatorPosition === 'start'}>\n          <AccordionChevronItemIndicator />\n        </Show>\n\n        {groupProps.heading}\n\n        <Show when={indicatorPosition === 'end'}>\n          <AccordionChevronItemIndicator />\n        </Show>\n      </AccordionParts.ItemTrigger>\n\n      <AccordionParts.ItemContent>\n        {groupProps.children}\n      </AccordionParts.ItemContent>\n    </AccordionParts.Item>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;AAgBS,cAoCH,YApCG;AADF,SAAS,UAAU,OAAmD;AAC3E,SAAO,oBAAC,eAAe,MAAf,EAAqB,GAAG,OAAO;AACzC;AAyBO,SAAS,mBAAmB,OAAgC;AACjE,QAAM,CAAC,YAAY,SAAS,IAAI,WAAW,OAAO;AAAA,IAChD;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,oBAAoB,WAAW,qBAAqB;AAE1D,SACE,qBAAC,eAAe,MAAf,EAAqB,GAAG,WACvB;AAAA,yBAAC,eAAe,aAAf,EAA2B,2BAAyB,mBACnD;AAAA,0BAAC,QAAK,MAAM,sBAAsB,SAChC,8BAAC,iCAA8B,GACjC;AAAA,MAEC,WAAW;AAAA,MAEZ,oBAAC,QAAK,MAAM,sBAAsB,OAChC,8BAAC,iCAA8B,GACjC;AAAA,OACF;AAAA,IAEA,oBAAC,eAAe,aAAf,EACE,qBAAW,UACd;AAAA,KACF;AAEJ;","names":[]}