@cerberus-design/react 0.18.4 → 0.19.1

package/build/modern/chunk-2MU6WE52.js

@@ -0,0 +1,45 @@
+import {
+  DatePickerViewControlGroup
+} from "./chunk-A655GBYQ.js";
+import {
+  DatePickerParts
+} from "./chunk-BWZXR2WZ.js";
+
+// src/components/date-picker/day-view.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function DatePickerDayView(props) {
+  function isToday(date) {
+    const today = /* @__PURE__ */ new Date();
+    const formatted = today.toISOString().split("T")[0];
+    const arkDate = `${date.year}-${String(date.month).padStart(2, "0")}-${String(date.day).padStart(2, "0")}`;
+    return formatted === arkDate;
+  }
+  function isPastDay(date) {
+    const today = /* @__PURE__ */ new Date();
+    const arkDate = `${date.year}-${String(date.month).padStart(2, "0")}-${String(date.day).padStart(2, "0")}`;
+    return new Date(arkDate) < today;
+  }
+  function getDayValue(date) {
+    if (isToday(date)) return "today";
+    if (isPastDay(date)) return "past";
+    return "future";
+  }
+  return /* @__PURE__ */ jsx(DatePickerParts.View, { ...props, view: "day", children: /* @__PURE__ */ jsx(DatePickerParts.Context, { children: (datePickerData) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(DatePickerViewControlGroup, {}),
+    /* @__PURE__ */ jsxs(DatePickerParts.Table, { children: [
+      /* @__PURE__ */ jsx(DatePickerParts.TableHead, { children: /* @__PURE__ */ jsx(DatePickerParts.TableRow, { children: datePickerData.weekDays.map((weekDay, id) => /* @__PURE__ */ jsx(DatePickerParts.TableHeader, { children: weekDay.narrow }, id)) }) }),
+      /* @__PURE__ */ jsx(DatePickerParts.TableBody, { children: datePickerData.weeks.map((week, id) => /* @__PURE__ */ jsx(DatePickerParts.TableRow, { children: week.map((day, id2) => /* @__PURE__ */ jsx(DatePickerParts.TableCell, { value: day, children: /* @__PURE__ */ jsx(
+        DatePickerParts.TableCellTrigger,
+        {
+          "data-date": getDayValue(day),
+          children: day.day
+        }
+      ) }, id2)) }, id)) })
+    ] })
+  ] }) }) });
+}
+
+export {
+  DatePickerDayView
+};
+//# sourceMappingURL=chunk-2MU6WE52.js.map

package/build/modern/chunk-2MU6WE52.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/date-picker/day-view.tsx"],"sourcesContent":["'use client'\n\nimport type {\n  DatePicker,\n  UseDatePickerContext,\n} from '@ark-ui/react/date-picker'\nimport { DatePickerParts } from './parts'\nimport type { DatePickerViewProps } from './primitives'\nimport { DatePickerViewControlGroup } from './view-control-group'\n\n/**\n * This private module contains an abstraction of the DayView component.\n * @module 'date-picker/day-view'\n */\n\nexport type DateValue = DatePicker.DateValue\n\n/**\n * An abstraction of the DatePickerDayView that renders the day view of the\n * DatePicker.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n */\nexport function DatePickerDayView(props: Omit<DatePickerViewProps, 'view'>) {\n  function isToday(date: DateValue): boolean {\n    const today = new Date()\n    const formatted = today.toISOString().split('T')[0]\n    const arkDate = `${date.year}-${String(date.month).padStart(2, '0')}-${String(date.day).padStart(2, '0')}`\n    return formatted === arkDate\n  }\n\n  function isPastDay(date: DateValue): boolean {\n    const today = new Date()\n    const arkDate = `${date.year}-${String(date.month).padStart(2, '0')}-${String(date.day).padStart(2, '0')}`\n    return new Date(arkDate) < today\n  }\n\n  function getDayValue(date: DateValue): 'today' | 'past' | 'future' {\n    if (isToday(date)) return 'today'\n    if (isPastDay(date)) return 'past'\n    return 'future'\n  }\n\n  return (\n    <DatePickerParts.View {...props} view=\"day\">\n      <DatePickerParts.Context>\n        {(datePickerData: UseDatePickerContext) => (\n          <>\n            <DatePickerViewControlGroup />\n\n            <DatePickerParts.Table>\n              <DatePickerParts.TableHead>\n                <DatePickerParts.TableRow>\n                  {datePickerData.weekDays.map((weekDay, id) => (\n                    <DatePickerParts.TableHeader key={id}>\n                      {weekDay.narrow}\n                    </DatePickerParts.TableHeader>\n                  ))}\n                </DatePickerParts.TableRow>\n              </DatePickerParts.TableHead>\n\n              <DatePickerParts.TableBody>\n                {datePickerData.weeks.map((week, id) => (\n                  <DatePickerParts.TableRow key={id}>\n                    {week.map((day, id) => (\n                      <DatePickerParts.TableCell key={id} value={day}>\n                        <DatePickerParts.TableCellTrigger\n                          data-date={getDayValue(day)}\n                        >\n                          {day.day}\n                        </DatePickerParts.TableCellTrigger>\n                      </DatePickerParts.TableCell>\n                    ))}\n                  </DatePickerParts.TableRow>\n                ))}\n              </DatePickerParts.TableBody>\n            </DatePickerParts.Table>\n          </>\n        )}\n      </DatePickerParts.Context>\n    </DatePickerParts.View>\n  )\n}\n"],"mappings":";;;;;;;;AA8CU,mBACE,KAEA,YAHF;AAxBH,SAAS,kBAAkB,OAA0C;AAC1E,WAAS,QAAQ,MAA0B;AACzC,UAAM,QAAQ,oBAAI,KAAK;AACvB,UAAM,YAAY,MAAM,YAAY,EAAE,MAAM,GAAG,EAAE,CAAC;AAClD,UAAM,UAAU,GAAG,KAAK,IAAI,IAAI,OAAO,KAAK,KAAK,EAAE,SAAS,GAAG,GAAG,CAAC,IAAI,OAAO,KAAK,GAAG,EAAE,SAAS,GAAG,GAAG,CAAC;AACxG,WAAO,cAAc;AAAA,EACvB;AAEA,WAAS,UAAU,MAA0B;AAC3C,UAAM,QAAQ,oBAAI,KAAK;AACvB,UAAM,UAAU,GAAG,KAAK,IAAI,IAAI,OAAO,KAAK,KAAK,EAAE,SAAS,GAAG,GAAG,CAAC,IAAI,OAAO,KAAK,GAAG,EAAE,SAAS,GAAG,GAAG,CAAC;AACxG,WAAO,IAAI,KAAK,OAAO,IAAI;AAAA,EAC7B;AAEA,WAAS,YAAY,MAA8C;AACjE,QAAI,QAAQ,IAAI,EAAG,QAAO;AAC1B,QAAI,UAAU,IAAI,EAAG,QAAO;AAC5B,WAAO;AAAA,EACT;AAEA,SACE,oBAAC,gBAAgB,MAAhB,EAAsB,GAAG,OAAO,MAAK,OACpC,8BAAC,gBAAgB,SAAhB,EACE,WAAC,mBACA,iCACE;AAAA,wBAAC,8BAA2B;AAAA,IAE5B,qBAAC,gBAAgB,OAAhB,EACC;AAAA,0BAAC,gBAAgB,WAAhB,EACC,8BAAC,gBAAgB,UAAhB,EACE,yBAAe,SAAS,IAAI,CAAC,SAAS,OACrC,oBAAC,gBAAgB,aAAhB,EACE,kBAAQ,UADuB,EAElC,CACD,GACH,GACF;AAAA,MAEA,oBAAC,gBAAgB,WAAhB,EACE,yBAAe,MAAM,IAAI,CAAC,MAAM,OAC/B,oBAAC,gBAAgB,UAAhB,EACE,eAAK,IAAI,CAAC,KAAKA,QACd,oBAAC,gBAAgB,WAAhB,EAAmC,OAAO,KACzC;AAAA,QAAC,gBAAgB;AAAA,QAAhB;AAAA,UACC,aAAW,YAAY,GAAG;AAAA,UAEzB,cAAI;AAAA;AAAA,MACP,KAL8BA,GAMhC,CACD,KAT4B,EAU/B,CACD,GACH;AAAA,OACF;AAAA,KACF,GAEJ,GACF;AAEJ;","names":["id"]}

package/build/modern/chunk-2OWVBM5W.js

@@ -0,0 +1,62 @@
+import {
+  createCerberusPrimitive
+} from "./chunk-ZGPHSKEB.js";
+
+// src/components/admonition/primitives.tsx
+import { ark } from "@ark-ui/react/factory";
+import { admonition } from "styled-system/recipes";
+var { withSlotRecipe, withNoRecipe } = createCerberusPrimitive(admonition);
+var AdmonitionRoot = withSlotRecipe(
+  ark.aside,
+  "root",
+  {
+    defaultProps: {
+      "data-scope": "admonition",
+      "data-part": "root"
+    }
+  }
+);
+var AdmonitionIndicator = withNoRecipe(
+  ark.span,
+  {
+    defaultProps: {
+      "data-scope": "admonition",
+      "data-part": "indicator"
+    }
+  }
+);
+var AdmonitionContent = withNoRecipe(ark.div, {
+  defaultProps: {
+    "data-scope": "admonition",
+    "data-part": "content"
+  }
+});
+var AdmonitionHeading = withSlotRecipe(
+  ark.p,
+  "heading",
+  {
+    defaultProps: {
+      "data-scope": "admonition",
+      "data-part": "heading"
+    }
+  }
+);
+var AdmonitionDescription = withSlotRecipe(
+  ark.p,
+  "description",
+  {
+    defaultProps: {
+      "data-scope": "admonition",
+      "data-part": "description"
+    }
+  }
+);
+
+export {
+  AdmonitionRoot,
+  AdmonitionIndicator,
+  AdmonitionContent,
+  AdmonitionHeading,
+  AdmonitionDescription
+};
+//# sourceMappingURL=chunk-2OWVBM5W.js.map

package/build/modern/chunk-2OWVBM5W.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/admonition/primitives.tsx"],"sourcesContent":["import { ark, type HTMLArkProps } from '@ark-ui/react/factory'\nimport { admonition, type AdmonitionVariantProps } from 'styled-system/recipes'\nimport {\n  createCerberusPrimitive,\n  type CerberusPrimitiveProps,\n} from '../../system/index'\n\n/**\n * This module contains the primitives of the Admonition components.\n * @module 'admonition/primitives'\n */\n\nconst { withSlotRecipe, withNoRecipe } = createCerberusPrimitive(admonition)\n\n/**\n * The `AdmonitionRoot` component is the container for the Admonition.\n */\nexport const AdmonitionRoot = withSlotRecipe<AdmonitionRootProps>(\n  ark.aside,\n  'root',\n  {\n    defaultProps: {\n      'data-scope': 'admonition',\n      'data-part': 'root',\n    },\n  },\n)\nexport type AdmonitionRootProps = CerberusPrimitiveProps<\n  HTMLArkProps<'aside'> & AdmonitionVariantProps\n>\n\n/**\n * The `AdmonitionIndicator` component is the indicator for the Admonition.\n */\nexport const AdmonitionIndicator = withNoRecipe<AdmonitionIndicatorProps>(\n  ark.span,\n  {\n    defaultProps: {\n      'data-scope': 'admonition',\n      'data-part': 'indicator',\n    },\n  },\n)\nexport type AdmonitionIndicatorProps = CerberusPrimitiveProps<\n  HTMLArkProps<'span'>\n>\n\n/**\n * The `AdmonitionContent` component is the content for the Admonition.\n */\nexport const AdmonitionContent = withNoRecipe<AdmonitionContentProps>(ark.div, {\n  defaultProps: {\n    'data-scope': 'admonition',\n    'data-part': 'content',\n  },\n})\nexport type AdmonitionContentProps = CerberusPrimitiveProps<HTMLArkProps<'div'>>\n\n/**\n * The `AdmonitionHeading` component is the heading title for the Admonition.\n */\nexport const AdmonitionHeading = withSlotRecipe<AdmonitionHeadingProps>(\n  ark.p,\n  'heading',\n  {\n    defaultProps: {\n      'data-scope': 'admonition',\n      'data-part': 'heading',\n    },\n  },\n)\nexport type AdmonitionHeadingProps = CerberusPrimitiveProps<\n  HTMLArkProps<'p'> & AdmonitionVariantProps\n>\n\n/**\n * The `AdmonitionDescription` component is the description for the Admonition.\n */\nexport const AdmonitionDescription = withSlotRecipe<AdmonitionDescriptionProps>(\n  ark.p,\n  'description',\n  {\n    defaultProps: {\n      'data-scope': 'admonition',\n      'data-part': 'description',\n    },\n  },\n)\nexport type AdmonitionDescriptionProps = CerberusPrimitiveProps<\n  HTMLArkProps<'p'> & AdmonitionVariantProps\n>\n"],"mappings":";;;;;AAAA,SAAS,WAA8B;AACvC,SAAS,kBAA+C;AAWxD,IAAM,EAAE,gBAAgB,aAAa,IAAI,wBAAwB,UAAU;AAKpE,IAAM,iBAAiB;AAAA,EAC5B,IAAI;AAAA,EACJ;AAAA,EACA;AAAA,IACE,cAAc;AAAA,MACZ,cAAc;AAAA,MACd,aAAa;AAAA,IACf;AAAA,EACF;AACF;AAQO,IAAM,sBAAsB;AAAA,EACjC,IAAI;AAAA,EACJ;AAAA,IACE,cAAc;AAAA,MACZ,cAAc;AAAA,MACd,aAAa;AAAA,IACf;AAAA,EACF;AACF;AAQO,IAAM,oBAAoB,aAAqC,IAAI,KAAK;AAAA,EAC7E,cAAc;AAAA,IACZ,cAAc;AAAA,IACd,aAAa;AAAA,EACf;AACF,CAAC;AAMM,IAAM,oBAAoB;AAAA,EAC/B,IAAI;AAAA,EACJ;AAAA,EACA;AAAA,IACE,cAAc;AAAA,MACZ,cAAc;AAAA,MACd,aAAa;AAAA,IACf;AAAA,EACF;AACF;AAQO,IAAM,wBAAwB;AAAA,EACnC,IAAI;AAAA,EACJ;AAAA,EACA;AAAA,IACE,cAAc;AAAA,MACZ,cAAc;AAAA,MACd,aAAa;AAAA,IACf;AAAA,EACF;AACF;","names":[]}

package/build/modern/chunk-2Q4KTP6D.js

@@ -0,0 +1,226 @@
+import {
+  ProgressBar
+} from "./chunk-KYYKBLP2.js";
+import {
+  Field
+} from "./chunk-4WSCG2CM.js";
+import {
+  IconButton
+} from "./chunk-YVYOOJ3X.js";
+import {
+  Avatar
+} from "./chunk-OMM4CPZU.js";
+import {
+  FieldHelperText
+} from "./chunk-JG5V3AK4.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-2Q4KTP6D.js.map

package/build/modern/chunk-2Q4KTP6D.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-2T2S226G.js

@@ -0,0 +1,14 @@
+import {
+  SelectItemGroup,
+  SelectItemGroupLabel
+} from "./chunk-MG2YW4IP.js";
+
+// src/components/select/option-group.tsx
+var OptionGroup = SelectItemGroup;
+var OptionGroupLabel = SelectItemGroupLabel;
+
+export {
+  OptionGroup,
+  OptionGroupLabel
+};
+//# sourceMappingURL=chunk-2T2S226G.js.map

package/build/modern/chunk-2T2S226G.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/select/option-group.tsx"],"sourcesContent":["import { SelectItemGroup, SelectItemGroupLabel } from './primitives'\n\n/**\n * This module contains the named abstractions OptionGroup and OptionGroupLabel\n * components for API consistency with the Select component.\n * @module 'react/select/option-group'\n */\n\n/**\n * The OptionGroup component is a group of options in the dropdown list.\n * @definition [Select docs](https://cerberus.digitalu.design/react/select)\n * @definition [ARK docs](https://ark-ui.com/react/docs/components/select)\n * @example\n * ```tsx\n * <OptionGroup>\n *  <OptionGroupLabel>Greek gods</OptionGroupLabel>\n *  ...\n * </OptionGroup>\n * ```\n */\nexport const OptionGroup = SelectItemGroup\n\n/**\n * The OptionGroupLabel component is the label of the OptionGroup.\n * @definition [Select docs](https://cerberus.digitalu.design/react/select)\n * @definition [ARK docs](https://ark-ui.com/react/docs/components/select)\n * @example\n * ```tsx\n * <OptionGroupLabel>Greek gods</OptionGroupLabel>\n * ```\n */\nexport const OptionGroupLabel = SelectItemGroupLabel\n"],"mappings":";;;;;;AAoBO,IAAM,cAAc;AAWpB,IAAM,mBAAmB;","names":[]}

package/build/modern/chunk-2UFNNWLA.js

@@ -0,0 +1,182 @@
+import {
+  Dialog
+} from "./chunk-YQNOAJM7.js";
+import {
+  DialogCloseTrigger,
+  DialogDescription,
+  DialogHeading,
+  DialogProvider
+} from "./chunk-HPWLIE64.js";
+import {
+  Button
+} from "./chunk-TF2DXEUF.js";
+import {
+  Avatar
+} from "./chunk-OMM4CPZU.js";
+import {
+  Show
+} from "./chunk-NUXMADXV.js";
+import {
+  useCerberusContext
+} from "./chunk-GITT5645.js";
+
+// src/context/confirm-modal.tsx
+import {
+  createContext,
+  useCallback,
+  useContext,
+  useMemo,
+  useRef,
+  useState
+} from "react";
+import { css } from "styled-system/css";
+import { HStack, VStack } from "styled-system/jsx";
+import { jsx, jsxs } from "react/jsx-runtime";
+var ConfirmModalContext = createContext(null);
+function ConfirmModal(props) {
+  const [open, setOpen] = useState(false);
+  const [content, setContent] = useState(null);
+  const resolveRef = useRef(null);
+  const kind = content?.kind ?? "non-destructive";
+  const { icons } = useCerberusContext();
+  const { confirmModal: ConfirmIcon } = icons;
+  const palette = useMemo(
+    () => kind === "destructive" ? "danger" : "action",
+    [kind]
+  );
+  const handleChoice = useCallback(
+    (e) => {
+      const target = e.currentTarget;
+      if (target.value === "true") {
+        resolveRef.current?.(true);
+      }
+      resolveRef.current?.(false);
+      setOpen(false);
+    },
+    [setOpen]
+  );
+  const handleShow = useCallback(
+    (options) => {
+      return new Promise((resolve) => {
+        setContent({ ...options });
+        setOpen(true);
+        resolveRef.current = resolve;
+      });
+    },
+    [setOpen, setContent]
+  );
+  const handleOpenChange = useCallback(
+    ({ open: open2 }) => {
+      setOpen(open2);
+      if (!open2) {
+        resolveRef.current?.(null);
+        resolveRef.current = null;
+      }
+    },
+    [setOpen]
+  );
+  const value = useMemo(
+    () => ({
+      show: handleShow
+    }),
+    [handleShow]
+  );
+  return /* @__PURE__ */ jsxs(ConfirmModalContext.Provider, { value, children: [
+    props.children,
+    /* @__PURE__ */ jsx(DialogProvider, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsx(
+      Dialog,
+      {
+        size: "sm",
+        style: {
+          "--dialog-content-min-h": "auto"
+        },
+        children: /* @__PURE__ */ jsxs(
+          VStack,
+          {
+            alignItems: "flex-start",
+            gap: "md",
+            justify: "space-between",
+            w: "full",
+            children: [
+              /* @__PURE__ */ jsx(
+                HStack,
+                {
+                  alignSelf: "center",
+                  justify: "center",
+                  paddingBlockEnd: "md",
+                  w: "full",
+                  children: /* @__PURE__ */ jsx(
+                    Show,
+                    {
+                      when: palette === "danger",
+                      fallback: /* @__PURE__ */ jsx(
+                        Avatar,
+                        {
+                          gradient: "charon-light",
+                          fallback: /* @__PURE__ */ jsx(ConfirmIcon, { size: 24 })
+                        }
+                      ),
+                      children: /* @__PURE__ */ jsx(
+                        Avatar,
+                        {
+                          gradient: "hades-dark",
+                          fallback: /* @__PURE__ */ jsx(ConfirmIcon, { size: 24 })
+                        }
+                      )
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsx(DialogHeading, { children: content?.heading }),
+              /* @__PURE__ */ jsx(Show, { when: content?.description, children: /* @__PURE__ */ jsx(DialogDescription, { children: content?.description }) }),
+              /* @__PURE__ */ jsxs(HStack, { gap: "md", pt: "md", w: "full", children: [
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    autoFocus: true,
+                    className: css({
+                      w: "1/2"
+                    }),
+                    name: "confirm",
+                    onClick: handleChoice,
+                    palette,
+                    value: "true",
+                    children: content?.actionText
+                  }
+                ),
+                /* @__PURE__ */ jsx(DialogCloseTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    className: css({
+                      w: "1/2"
+                    }),
+                    name: "cancel",
+                    onClick: handleChoice,
+                    usage: "outlined",
+                    value: "false",
+                    children: content?.cancelText
+                  }
+                ) })
+              ] })
+            ]
+          }
+        )
+      }
+    ) })
+  ] });
+}
+function useConfirmModal() {
+  const context = useContext(ConfirmModalContext);
+  if (context === null) {
+    throw new Error(
+      "useConfirmModal must be used within a ConfirmModal Provider"
+    );
+  }
+  return context;
+}
+
+export {
+  ConfirmModal,
+  useConfirmModal
+};
+//# sourceMappingURL=chunk-2UFNNWLA.js.map

package/build/modern/chunk-2UFNNWLA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/context/confirm-modal.tsx"],"sourcesContent":["'use client'\n\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useMemo,\n  useRef,\n  useState,\n  type MouseEvent,\n  type PropsWithChildren,\n  type ReactNode,\n} from 'react'\nimport { css } from 'styled-system/css'\nimport { HStack, VStack } from 'styled-system/jsx'\nimport { Button } from '../components/button/button'\nimport { Show } from '../components/show/index'\nimport { Avatar } from '../components/avatar/avatar'\nimport {\n  Dialog,\n  DialogCloseTrigger,\n  DialogDescription,\n  DialogHeading,\n  DialogProvider,\n  type OpenChangeDetails,\n} from '../components/dialog'\nimport { useCerberusContext } from './cerberus'\n\n/**\n * This module provides a context and hook for the confirm modal.\n * @module\n */\n\nexport interface BaseConfirmOptions {\n  /**\n   * The heading of the confirm modal.\n   */\n  heading: string\n  /**\n   * The text for the action button.\n   */\n  actionText: string\n  /**\n   * The text for the cancel button.\n   */\n  cancelText: string\n}\n\nexport interface DestructiveConfirmOptions extends BaseConfirmOptions {\n  /**\n   * The kind of confirm modal to show.\n   */\n  kind?: 'destructive'\n  /**\n   * The description of the confirm modal. Can only be a string for destructive confirm modals.\n   */\n  description?: string\n}\n\nexport interface NonDestructiveConfirmModalOptions extends BaseConfirmOptions {\n  /**\n   * The kind of confirm modal to show.\n   * @default 'non-destructive'\n   */\n  kind?: 'non-destructive'\n  /**\n   * The description of the confirm modal. Can be a ReactNode for non-destructive kind if you need to display text links.\n   * @example\n   * ```tsx\n   * description: <>Use a Fragment because we put the content within a Paragraph tag.</>\n   */\n  description?: ReactNode\n}\n\nexport type ShowConfirmModalOptions =\n  | NonDestructiveConfirmModalOptions\n  | DestructiveConfirmOptions\n\nexport type ShowResult = ((value: boolean | null) => void) | null\n\nexport interface ConfirmModalValue {\n  show: (options: ShowConfirmModalOptions) => Promise<boolean | null>\n}\n\nconst ConfirmModalContext = createContext<ConfirmModalValue | null>(null)\n\nexport type ConfirmModalProviderProps = PropsWithChildren<unknown>\n\n/**\n * Provides a confirm modal to the app.\n * @see https://cerberus.digitalu.design/react/confirm-modal\n * @example\n * ```tsx\n * // Wrap the Provider around the root of the feature.\n * <ConfirmModal>\n *   <SomeFeatureSection />\n * </ConfirmModal>\n *\n * // Use the hook to show the confirm modal.\n * const confirm = useConfirmModal()\n *\n * const handleClick = useCallback(async () => {\n *  const userConsent = await confirm.show({\n *   heading: 'Add new payment method?',\n *  description:\n *   'This will add a new payment method to your account to be billed for future purchases.',\n * actionText: 'Yes, add payment method',\n * cancelText: 'No, cancel',\n * })\n * setConsent(userConsent)\n * }, [confirm])\n * ```\n */\nexport function ConfirmModal(\n  props: PropsWithChildren<ConfirmModalProviderProps>,\n) {\n  const [open, setOpen] = useState<boolean>(false)\n  const [content, setContent] = useState<ShowConfirmModalOptions | null>(null)\n  const resolveRef = useRef<ShowResult>(null)\n  const kind = content?.kind ?? 'non-destructive'\n\n  const { icons } = useCerberusContext()\n  const { confirmModal: ConfirmIcon } = icons\n\n  const palette = useMemo(\n    () => (kind === 'destructive' ? 'danger' : 'action'),\n    [kind],\n  )\n\n  const handleChoice = useCallback(\n    (e: MouseEvent<HTMLButtonElement>) => {\n      const target = e.currentTarget as HTMLButtonElement\n      if (target.value === 'true') {\n        resolveRef.current?.(true)\n      }\n      resolveRef.current?.(false)\n      setOpen(false)\n    },\n    [setOpen],\n  )\n\n  const handleShow = useCallback(\n    (options: ShowConfirmModalOptions) => {\n      return new Promise<boolean | null>((resolve) => {\n        setContent({ ...options })\n        setOpen(true)\n        resolveRef.current = resolve\n      })\n    },\n    [setOpen, setContent],\n  )\n\n  const handleOpenChange = useCallback(\n    ({ open }: OpenChangeDetails) => {\n      setOpen(open)\n      if (!open) {\n        resolveRef.current?.(null)\n        resolveRef.current = null\n      }\n    },\n    [setOpen],\n  )\n\n  const value = useMemo(\n    () => ({\n      show: handleShow,\n    }),\n    [handleShow],\n  )\n\n  return (\n    <ConfirmModalContext.Provider value={value}>\n      {props.children}\n\n      <DialogProvider open={open} onOpenChange={handleOpenChange}>\n        <Dialog\n          size=\"sm\"\n          style={{\n            '--dialog-content-min-h': 'auto',\n          }}\n        >\n          <VStack\n            alignItems=\"flex-start\"\n            gap=\"md\"\n            justify=\"space-between\"\n            w=\"full\"\n          >\n            <HStack\n              alignSelf=\"center\"\n              justify=\"center\"\n              paddingBlockEnd=\"md\"\n              w=\"full\"\n            >\n              <Show\n                when={palette === 'danger'}\n                fallback={\n                  <Avatar\n                    gradient=\"charon-light\"\n                    fallback={<ConfirmIcon size={24} />}\n                  />\n                }\n              >\n                <Avatar\n                  gradient=\"hades-dark\"\n                  fallback={<ConfirmIcon size={24} />}\n                />\n              </Show>\n            </HStack>\n\n            <DialogHeading>{content?.heading}</DialogHeading>\n\n            <Show when={content?.description}>\n              <DialogDescription>{content?.description}</DialogDescription>\n            </Show>\n\n            <HStack gap=\"md\" pt=\"md\" w=\"full\">\n              <Button\n                autoFocus\n                className={css({\n                  w: '1/2',\n                })}\n                name=\"confirm\"\n                onClick={handleChoice}\n                palette={palette}\n                value=\"true\"\n              >\n                {content?.actionText}\n              </Button>\n              <DialogCloseTrigger asChild>\n                <Button\n                  className={css({\n                    w: '1/2',\n                  })}\n                  name=\"cancel\"\n                  onClick={handleChoice}\n                  usage=\"outlined\"\n                  value=\"false\"\n                >\n                  {content?.cancelText}\n                </Button>\n              </DialogCloseTrigger>\n            </HStack>\n          </VStack>\n        </Dialog>\n      </DialogProvider>\n    </ConfirmModalContext.Provider>\n  )\n}\n\nexport function useConfirmModal(): ConfirmModalValue {\n  const context = useContext(ConfirmModalContext)\n  if (context === null) {\n    throw new Error(\n      'useConfirmModal must be used within a ConfirmModal Provider',\n    )\n  }\n  return context\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAEA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AACP,SAAS,WAAW;AACpB,SAAS,QAAQ,cAAc;AAwLD,cAiBlB,YAjBkB;AAlH9B,IAAM,sBAAsB,cAAwC,IAAI;AA6BjE,SAAS,aACd,OACA;AACA,QAAM,CAAC,MAAM,OAAO,IAAI,SAAkB,KAAK;AAC/C,QAAM,CAAC,SAAS,UAAU,IAAI,SAAyC,IAAI;AAC3E,QAAM,aAAa,OAAmB,IAAI;AAC1C,QAAM,OAAO,SAAS,QAAQ;AAE9B,QAAM,EAAE,MAAM,IAAI,mBAAmB;AACrC,QAAM,EAAE,cAAc,YAAY,IAAI;AAEtC,QAAM,UAAU;AAAA,IACd,MAAO,SAAS,gBAAgB,WAAW;AAAA,IAC3C,CAAC,IAAI;AAAA,EACP;AAEA,QAAM,eAAe;AAAA,IACnB,CAAC,MAAqC;AACpC,YAAM,SAAS,EAAE;AACjB,UAAI,OAAO,UAAU,QAAQ;AAC3B,mBAAW,UAAU,IAAI;AAAA,MAC3B;AACA,iBAAW,UAAU,KAAK;AAC1B,cAAQ,KAAK;AAAA,IACf;AAAA,IACA,CAAC,OAAO;AAAA,EACV;AAEA,QAAM,aAAa;AAAA,IACjB,CAAC,YAAqC;AACpC,aAAO,IAAI,QAAwB,CAAC,YAAY;AAC9C,mBAAW,EAAE,GAAG,QAAQ,CAAC;AACzB,gBAAQ,IAAI;AACZ,mBAAW,UAAU;AAAA,MACvB,CAAC;AAAA,IACH;AAAA,IACA,CAAC,SAAS,UAAU;AAAA,EACtB;AAEA,QAAM,mBAAmB;AAAA,IACvB,CAAC,EAAE,MAAAA,MAAK,MAAyB;AAC/B,cAAQA,KAAI;AACZ,UAAI,CAACA,OAAM;AACT,mBAAW,UAAU,IAAI;AACzB,mBAAW,UAAU;AAAA,MACvB;AAAA,IACF;AAAA,IACA,CAAC,OAAO;AAAA,EACV;AAEA,QAAM,QAAQ;AAAA,IACZ,OAAO;AAAA,MACL,MAAM;AAAA,IACR;AAAA,IACA,CAAC,UAAU;AAAA,EACb;AAEA,SACE,qBAAC,oBAAoB,UAApB,EAA6B,OAC3B;AAAA,UAAM;AAAA,IAEP,oBAAC,kBAAe,MAAY,cAAc,kBACxC;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAO;AAAA,UACL,0BAA0B;AAAA,QAC5B;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACC,YAAW;AAAA,YACX,KAAI;AAAA,YACJ,SAAQ;AAAA,YACR,GAAE;AAAA,YAEF;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAU;AAAA,kBACV,SAAQ;AAAA,kBACR,iBAAgB;AAAA,kBAChB,GAAE;AAAA,kBAEF;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAM,YAAY;AAAA,sBAClB,UACE;AAAA,wBAAC;AAAA;AAAA,0BACC,UAAS;AAAA,0BACT,UAAU,oBAAC,eAAY,MAAM,IAAI;AAAA;AAAA,sBACnC;AAAA,sBAGF;AAAA,wBAAC;AAAA;AAAA,0BACC,UAAS;AAAA,0BACT,UAAU,oBAAC,eAAY,MAAM,IAAI;AAAA;AAAA,sBACnC;AAAA;AAAA,kBACF;AAAA;AAAA,cACF;AAAA,cAEA,oBAAC,iBAAe,mBAAS,SAAQ;AAAA,cAEjC,oBAAC,QAAK,MAAM,SAAS,aACnB,8BAAC,qBAAmB,mBAAS,aAAY,GAC3C;AAAA,cAEA,qBAAC,UAAO,KAAI,MAAK,IAAG,MAAK,GAAE,QACzB;AAAA;AAAA,kBAAC;AAAA;AAAA,oBACC,WAAS;AAAA,oBACT,WAAW,IAAI;AAAA,sBACb,GAAG;AAAA,oBACL,CAAC;AAAA,oBACD,MAAK;AAAA,oBACL,SAAS;AAAA,oBACT;AAAA,oBACA,OAAM;AAAA,oBAEL,mBAAS;AAAA;AAAA,gBACZ;AAAA,gBACA,oBAAC,sBAAmB,SAAO,MACzB;AAAA,kBAAC;AAAA;AAAA,oBACC,WAAW,IAAI;AAAA,sBACb,GAAG;AAAA,oBACL,CAAC;AAAA,oBACD,MAAK;AAAA,oBACL,SAAS;AAAA,oBACT,OAAM;AAAA,oBACN,OAAM;AAAA,oBAEL,mBAAS;AAAA;AAAA,gBACZ,GACF;AAAA,iBACF;AAAA;AAAA;AAAA,QACF;AAAA;AAAA,IACF,GACF;AAAA,KACF;AAEJ;AAEO,SAAS,kBAAqC;AACnD,QAAM,UAAU,WAAW,mBAAmB;AAC9C,MAAI,YAAY,MAAM;AACpB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;","names":["open"]}

package/build/modern/chunk-34U4QQ3I.js

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

package/build/modern/chunk-3RPBRD5W.js

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

package/build/modern/chunk-3Z4TSR6V.js

@@ -0,0 +1,21 @@
+import {
+  AccordionItem,
+  AccordionItemContent,
+  AccordionItemIndicator,
+  AccordionItemTrigger,
+  AccordionRoot
+} from "./chunk-BDXVYV32.js";
+
+// src/components/accordion/parts.ts
+var AccordionParts = {
+  Root: AccordionRoot,
+  Item: AccordionItem,
+  ItemTrigger: AccordionItemTrigger,
+  ItemContent: AccordionItemContent,
+  ItemIndicator: AccordionItemIndicator
+};
+
+export {
+  AccordionParts
+};
+//# sourceMappingURL=chunk-3Z4TSR6V.js.map