@cerberus-design/react 0.16.0-next-ba05f96 → 0.16.0-next-d049636

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

@@ -1,4 +1,8 @@
-import { Accordion as Accordion_2 } from '@ark-ui/react';
+import { AccordionItemContentProps } from '@ark-ui/react/accordion';
+import { AccordionItemIndicatorProps } from '@ark-ui/react/accordion';
+import { AccordionItemProps } from '@ark-ui/react/accordion';
+import { AccordionItemTriggerProps } from '@ark-ui/react/accordion';
+import { AccordionRootProps } from '@ark-ui/react/accordion';
 import { AccordionVariantProps } from '@cerberus/styled-system/recipes';
 import { Activator } from '@dnd-kit/core';
 import { Activators } from '@dnd-kit/core';
@@ -118,6 +122,7 @@ import { ForwardRefExoticComponent } from 'react';
 import { getClientRect } from '@dnd-kit/core';
 import { getFirstCollision } from '@dnd-kit/core';
 import { getScrollableAncestors } from '@dnd-kit/core';
+import { HTMLArkProps } from '@ark-ui/react/factory';
 import { HTMLAttributes } from 'react';
 import { HtmlHTMLAttributes } from 'react';
 import { IconButtonVariantProps } from '@cerberus/styled-system/recipes';
@@ -238,89 +243,58 @@ import { useSensor } from '@dnd-kit/core';
 import { useSensors } from '@dnd-kit/core';
 
 /**
- * The context provider for the Accordion family.
- * @definition [Accordion docs](https://cerberus.digitalu.design/react/accordion)
- * @example
- * ```tsx
- * <Accordion>
- *  <AccordionItemGroup heading="Item 1 heading" value="one">
- *     This is the content
- *  </AccordionItemGroup>
- * </Accordion>
- * ```
+ * This module contains an abstraction of the AccordionItem components.
+ * @module
  */
-declare function Accordion(props: AccordionProps): JSX_2.Element;
+declare const Accordion: ElementType;
 export { Accordion }
 export { Accordion as Accordion_alias_1 }
+export { Accordion as Accordion_alias_2 }
 
 /**
- * The item for the Accordion component.
- * @definition [ARK docs](https://ark-ui.com/react/docs/components/accordion)
- * @definition [Accordion docs](https://cerberus.digitalu.design/react/accordion)
- * @example
- * ```tsx
- * <Accordion>
- *   <AccordionItem value="one">
- *     <AccordionTrigger>
- *        Accordion Item 1
- *     <AccordionIndicator />
- *     </AccordionTrigger>
- *     <AccordionContent>Accordion Item 1 content</AccordionContent>
- *   </AccordionItem>
- * </Accordion>
- * ```
+ * This module contains the internal AccordionItemIndicator component.
+ * @module 'accordion/item-indicator'
  */
-declare function AccordionItem(props: AccordionItemProps): JSX_2.Element;
+export declare function AccordionChevronItemIndicator(props: AccordionItemIndicatorProps & AccordionVariantProps): JSX_2.Element;
+
+/**
+ * The primitive item component of the Accordion component.
+ *
+ * This component returns the Ark `Accordion.Item` component which has a
+ * base style using the Cerberus `accordion` recipe that can be overridden.
+ */
+declare function AccordionItem(props: AccordionItemProps & AccordionVariantProps): JSX_2.Element;
 export { AccordionItem }
 export { AccordionItem as AccordionItem_alias_1 }
+export { AccordionItem as AccordionItem_alias_2 }
 
 /**
- * The content for the Accordion component.
- * @definition [ARK docs](https://ark-ui.com/react/docs/components/accordion)
- * @definition [Accordion docs](https://cerberus.digitalu.design/react/accordion)
- * @example
- * ```tsx
- * <Accordion>
- *   <AccordionItem value="one">
- *     <AccordionTrigger>
- *        Accordion Item 1
- *     <AccordionIndicator />
- *     </AccordionTrigger>
- *     <AccordionContent>Accordion Item 1 content</AccordionContent>
- *   </AccordionItem>
- * </Accordion>
- * ```
- * */
+ * The primitive content component of the Accordion component.
+ *
+ * This component returns the Ark `Accordion.Content` component which has a
+ * base style using the Cerberus `accordion` recipe that can be overridden.
+ */
 declare function AccordionItemContent(props: AccordionItemContentProps): JSX_2.Element;
 export { AccordionItemContent }
 export { AccordionItemContent as AccordionItemContent_alias_1 }
-
-declare type AccordionItemContentProps = Accordion_2.ItemContentProps & AccordionVariantProps;
-export { AccordionItemContentProps }
-export { AccordionItemContentProps as AccordionItemContentProps_alias_1 }
+export { AccordionItemContent as AccordionItemContent_alias_2 }
 
 /**
- * A grouped item for the Accordion component.
- * @definition [ARK docs](https://ark-ui.com/react/docs/components/accordion)
- * @definition [Accordion docs](https://cerberus.digitalu.design/react/accordion)
- * @example
- * ```tsx
- * <Accordion>
- *   <AccordionItemGroup heading="Accordion Item 1" value="one">
- *     Accordion Item 1 content
- *   </AccordionItemGroup>
- * </Accordion>
- * ```
+ * The AccordionItemGroup component is an abstraction of the Accordion primitive
+ * components which renders an accordion item with a heading and an indicator.
+ *
+ * It is a wrapper around the `AccordionParts.Item`, `AccordionParts.
+ * ItemTrigger`, `AccordionParts.ItemIndicator`, and `AccordionParts.ItemContent` components.
+ *
+ * @description [Cerberus docs](https://cerberus.digitalu.design/react/accordion)
+ * @description [Ark docs](https://ark-ui.com/react/docs/components/accordion)
  */
-declare function AccordionItemGroup(props: PropsWithChildren<AccordionItemGroupProps>): JSX_2.Element;
+declare function AccordionItemGroup(props: AccordionItemGroupProps): JSX_2.Element;
 export { AccordionItemGroup }
 export { AccordionItemGroup as AccordionItemGroup_alias_1 }
+export { AccordionItemGroup as AccordionItemGroup_alias_2 }
 
-/**
- * This module contains an abstraction of the AccordionItem components.
- * @module
- */
-declare interface AccordionItemGroupBaseProps extends Accordion_2.ItemProps {
+declare interface AccordionItemGroupProps extends AccordionItemProps, AccordionVariantProps {
     /**
      * The heading of the accordion item to open and close the content.
      */
@@ -330,68 +304,87 @@ declare interface AccordionItemGroupBaseProps extends Accordion_2.ItemProps {
      */
     indicatorPosition?: 'start' | 'end';
 }
-export { AccordionItemGroupBaseProps }
-export { AccordionItemGroupBaseProps as AccordionItemGroupBaseProps_alias_1 }
-
-declare type AccordionItemGroupProps = AccordionItemGroupBaseProps & AccordionVariantProps;
 export { AccordionItemGroupProps }
 export { AccordionItemGroupProps as AccordionItemGroupProps_alias_1 }
+export { AccordionItemGroupProps as AccordionItemGroupProps_alias_2 }
 
 /**
- * The indicator for the Accordion component.
- * @definition [ARK docs](https://ark-ui.com/react/docs/components/accordion)
- * @definition [Accordion docs](https://cerberus.digitalu.design/react/accordion)
- * @example
- * ```tsx
- * <Accordion>
- *   <AccordionItem value="one">
- *     <AccordionTrigger>
- *        Accordion Item 1
- *     <AccordionIndicator />
- *     </AccordionTrigger>
- *     <AccordionContent>Accordion Item 1 content</AccordionContent>
- *   </AccordionItem>
- * </Accordion>
- * ```
- * */
+ * The primitive item indicator component of the Accordion component.
+ *
+ * This component returns the Ark `Accordion.ItemIndicator` component which has
+ * a base style using the Cerberus `accordion` recipe that can be overridden.
+ */
 declare function AccordionItemIndicator(props: AccordionItemIndicatorProps): JSX_2.Element;
 export { AccordionItemIndicator }
 export { AccordionItemIndicator as AccordionItemIndicator_alias_1 }
-
-declare type AccordionItemIndicatorProps = Accordion_2.ItemIndicatorProps & AccordionVariantProps;
-export { AccordionItemIndicatorProps }
-export { AccordionItemIndicatorProps as AccordionItemIndicatorProps_alias_1 }
-
-declare type AccordionItemProps = Accordion_2.ItemProps & AccordionVariantProps;
+export { AccordionItemIndicator as AccordionItemIndicator_alias_2 }
 
 /**
- * The trigger for the Accordion component.
- * @definition [ARK docs](https://ark-ui.com/react/docs/components/accordion)
- * @definition [Accordion docs](https://cerberus.digitalu.design/react/accordion)
- * @example
- * ```tsx
- * <Accordion>
- *   <AccordionItem value="one">
- *     <AccordionTrigger>
- *        Accordion Item 1
- *     <AccordionIndicator />
- *     </AccordionTrigger>
- *     <AccordionContent>Accordion Item 1 content</AccordionContent>
- *   </AccordionItem>
- * </Accordion>
- * ```
+ * The primitive trigger component of the Accordion component.
+ *
+ * This component returns the Ark `Accordion.ItemTrigger` component which has
+ * a base style using the Cerberus `accordion` recipe that can be overridden.
  */
 declare function AccordionItemTrigger(props: AccordionItemTriggerProps): JSX_2.Element;
 export { AccordionItemTrigger }
 export { AccordionItemTrigger as AccordionItemTrigger_alias_1 }
+export { AccordionItemTrigger as AccordionItemTrigger_alias_2 }
+
+/**
+ * An Object containing the parts of the Accordion component. For users that
+ * prefer Object component syntax.
+ *
+ * @remarks
+ *
+ * When using object component syntax, you import the AccordionParts object and
+ * the entire family of components vs. only what you use.
+ */
+declare const AccordionParts: AccordionPartsValue;
+export { AccordionParts }
+export { AccordionParts as AccordionParts_alias_1 }
+export { AccordionParts as AccordionParts_alias_2 }
 
-declare type AccordionItemTriggerProps = Accordion_2.ItemTriggerProps & AccordionVariantProps;
-export { AccordionItemTriggerProps }
-export { AccordionItemTriggerProps as AccordionItemTriggerProps_alias_1 }
+/**
+ * This module contains the parts of the Accordion component.
+ * @module 'accordion/parts'
+ */
+declare interface AccordionPartsValue {
+    /**
+     * The context provider of the accordion.
+     */
+    Root: ElementType;
+    /**
+     * The item of the accordion.
+     */
+    Item: ElementType;
+    /**
+     * The trigger of the accordion item.
+     */
+    ItemTrigger: ElementType;
+    /**
+     * The content of the accordion item.
+     */
+    ItemContent: ElementType;
+    /**
+     * The indicator of the accordion item.
+     */
+    ItemIndicator: ElementType;
+}
 
-declare type AccordionProps = Accordion_2.RootProps & AccordionVariantProps;
-export { AccordionProps }
-export { AccordionProps as AccordionProps_alias_1 }
+/**
+ * This module contains the primitives of the Accordion component.
+ * @module 'accordion/primitives'
+ */
+/**
+ * The primitive root component of the Accordion component.
+ *
+ * This component returns the Ark `Accordion.Root` component which has a
+ * base style using the Cerberus `accordion` recipe that can be overridden.
+ */
+declare function AccordionRoot(props: AccordionRootProps & AccordionVariantProps): JSX_2.Element;
+export { AccordionRoot }
+export { AccordionRoot as AccordionRoot_alias_1 }
+export { AccordionRoot as AccordionRoot_alias_2 }
 
 export { Activator }
 
@@ -412,78 +405,123 @@ export declare type AddNotifyAction = {
 };
 
 /**
- * The `Admonition` component is used to create an admonition.
- * @example
- * ```tsx
- * <Admonition palette="page">
- *  <AdmonitionHeading palette="page">Page</AdmonitionHeading>
- *  <AdmonitionDescription palette="page">
- *   This is a page admonition.
- *  </AdmonitionDescription>
- * </Admonition>
- * ```
- * @see https://cerberus.digitalu.design/react/admonition
+ * The Admonition component is an abstraction of the primitives which
+ * displays a Admonition with a label.
+ *
+ * @description [Cerberus Docs](https://cerberus.digitalu.design/react/admonition)
+ *
+ * @remarks
+ *
+ * For a customizable Admonition, use the `AdmonitionParts` object to access the
+ * individual primitives of the Admonition component.
  */
 declare function Admonition(props: AdmonitionProps): JSX_2.Element;
 export { Admonition }
 export { Admonition as Admonition_alias_1 }
+export { Admonition as Admonition_alias_2 }
 
 /**
- * The `AdmonitionDescription` component is used to create a description within
- * an admonition.
- * @example
- * ```tsx
- * <Admonition palette="page">
- *  <AdmonitionHeading palette="page">Page</AdmonitionHeading>
- *  <AdmonitionDescription palette="page">
- *   This is a page admonition.
- *  </AdmonitionDescription>
- * </Admonition>
- * ```
- * @see https://cerberus.digitalu.design/react/admonition
+ * The `AdmonitionContent` component is the content for the Admonition.
  */
-declare function AdmonitionDescription(props: AdmonitionDescriptionProps): JSX_2.Element;
+declare function AdmonitionContent(props: HTMLArkProps<'div'>): JSX_2.Element;
+export { AdmonitionContent }
+export { AdmonitionContent as AdmonitionContent_alias_1 }
+export { AdmonitionContent as AdmonitionContent_alias_2 }
+
+/**
+ * The `AdmonitionDescription` component is the description for the Admonition.
+ */
+declare function AdmonitionDescription(props: HTMLArkProps<'p'>): JSX_2.Element;
 export { AdmonitionDescription }
 export { AdmonitionDescription as AdmonitionDescription_alias_1 }
-
-declare type AdmonitionDescriptionProps = HTMLAttributes<HTMLParagraphElement> & AdmonitionVariantProps;
-export { AdmonitionDescriptionProps }
-export { AdmonitionDescriptionProps as AdmonitionDescriptionProps_alias_1 }
+export { AdmonitionDescription as AdmonitionDescription_alias_2 }
 
 /**
- * The `AdmonitionHeading` component is used to create a heading within an
- * admonition.
- * @example
- * ```tsx
- * <Admonition palette="page">
- *  <AdmonitionHeading palette="page">Page</AdmonitionHeading>
- *  <AdmonitionDescription palette="page">
- *   This is a page admonition.
- *  </AdmonitionDescription>
- * </Admonition>
- * ```
- * @see https://cerberus.digitalu.design/react/admonition
+ * The `AdmonitionHeading` component is the heading title for the Admonition.
  */
-declare function AdmonitionHeading(props: AdmonitionHeadingProps): JSX_2.Element;
+declare function AdmonitionHeading(props: HTMLArkProps<'p'>): JSX_2.Element;
 export { AdmonitionHeading }
 export { AdmonitionHeading as AdmonitionHeading_alias_1 }
+export { AdmonitionHeading as AdmonitionHeading_alias_2 }
+
+/**
+ * The `AdmonitionIndicator` component is the indicator for the Admonition.
+ */
+declare function AdmonitionIndicator(props: HTMLArkProps<'span'>): JSX_2.Element;
+export { AdmonitionIndicator }
+export { AdmonitionIndicator as AdmonitionIndicator_alias_1 }
+export { AdmonitionIndicator as AdmonitionIndicator_alias_2 }
+
+/**
+ * An Object containing the parts of the Accordion component. For users that
+ * prefer Object component syntax.
+ *
+ * @remarks
+ *
+ * When using object component syntax, you import the AdmonitionParts object and
+ * the entire family of components vs. only what you use.
+ */
+declare const AdmonitionParts: AdmonitionPartsValue;
+export { AdmonitionParts }
+export { AdmonitionParts as AdmonitionParts_alias_1 }
+export { AdmonitionParts as AdmonitionParts_alias_2 }
 
-declare type AdmonitionHeadingProps = HTMLAttributes<HTMLParagraphElement> & AdmonitionVariantProps;
-export { AdmonitionHeadingProps }
-export { AdmonitionHeadingProps as AdmonitionHeadingProps_alias_1 }
+/**
+ * This module contains the parts of the Admonition component.
+ * @module 'admonition/parts'
+ */
+declare interface AdmonitionPartsValue {
+    /**
+     * The context provider of the Admonition.
+     */
+    Root: ElementType;
+    /**
+     * The indicator of the Admonition.
+     */
+    Indicator: ElementType;
+    /**
+     * The content of the Admonition.
+     */
+    Content: ElementType;
+    /**
+     * The heading of the Admonition.
+     */
+    Heading: ElementType;
+    /**
+     * The description of the Admonition.
+     */
+    Description: ElementType;
+}
 
 /**
- * This module provides a set of components for creating admonitions.
- * @module Admonition
+ * This module provides an abstraction for the Admonition component.
+ * @module 'admonition/admonition'
  */
-declare type AdmonitionProps = HTMLAttributes<HTMLDivElement> & AdmonitionVariantProps & {
+declare interface AdmonitionProps extends AdmonitionVariantProps, HTMLArkProps<'aside'> {
+    /**
+     * The heading title for the Admonition.
+     */
+    heading?: string;
     /**
      * One off replacement for the icon.
      */
     icon?: ReactNode;
-};
+}
 export { AdmonitionProps }
 export { AdmonitionProps as AdmonitionProps_alias_1 }
+export { AdmonitionProps as AdmonitionProps_alias_2 }
+
+/**
+ * This module contains the primitives of the Admonition components.
+ * @module 'admonition/primitives'
+ */
+/**
+ * The `AdmonitionRoot` component is the container for the Admonition.
+ */
+declare function AdmonitionRoot(props: HTMLArkProps<'aside'> & AdmonitionVariantProps): JSX_2.Element;
+export { AdmonitionRoot }
+export { AdmonitionRoot as AdmonitionRoot_alias_1 }
+export { AdmonitionRoot as AdmonitionRoot_alias_2 }
 
 export declare function AnimatingUploadIcon(props: AnimatingUploadIconProps): JSX_2.Element;
 

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

@@ -0,0 +1,178 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/accordion/index.ts
+var accordion_exports = {};
+__export(accordion_exports, {
+  Accordion: () => Accordion2,
+  AccordionItem: () => AccordionItem,
+  AccordionItemContent: () => AccordionItemContent,
+  AccordionItemGroup: () => AccordionItemGroup,
+  AccordionItemIndicator: () => AccordionItemIndicator,
+  AccordionItemTrigger: () => AccordionItemTrigger,
+  AccordionParts: () => AccordionParts,
+  AccordionRoot: () => AccordionRoot
+});
+module.exports = __toCommonJS(accordion_exports);
+
+// src/components/accordion/primitives.tsx
+var import_accordion = require("@ark-ui/react/accordion");
+var import_css = require("@cerberus/styled-system/css");
+var import_recipes = require("@cerberus/styled-system/recipes");
+var import_jsx_runtime = require("react/jsx-runtime");
+function AccordionRoot(props) {
+  const { size, ...rootProps } = props;
+  const styles = (0, import_recipes.accordion)({ size });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_accordion.Accordion.Root,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.root, rootProps.className),
+      "data-size": size
+    }
+  );
+}
+function AccordionItem(props) {
+  const styles = (0, import_recipes.accordion)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_accordion.Accordion.Item, { ...props, className: (0, import_css.cx)(styles.item, props.className) });
+}
+function AccordionItemTrigger(props) {
+  const styles = (0, import_recipes.accordion)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_accordion.Accordion.ItemTrigger,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.itemTrigger, props.className)
+    }
+  );
+}
+function AccordionItemIndicator(props) {
+  const styles = (0, import_recipes.accordion)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_accordion.Accordion.ItemIndicator,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.itemIndicator, props.className)
+    }
+  );
+}
+function AccordionItemContent(props) {
+  const styles = (0, import_recipes.accordion)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_accordion.Accordion.ItemContent,
+    {
+      ...props,
+      className: (0, import_css.cx)(styles.itemContent, props.className)
+    }
+  );
+}
+
+// src/components/accordion/parts.ts
+var AccordionParts = {
+  Root: AccordionRoot,
+  Item: AccordionItem,
+  ItemTrigger: AccordionItemTrigger,
+  ItemContent: AccordionItemContent,
+  ItemIndicator: AccordionItemIndicator
+};
+
+// 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/Show.tsx
+var import_react = require("react");
+function Show(props) {
+  const { when, children, fallback } = props;
+  const condition = (0, import_react.useMemo)(() => when ?? false, [when]);
+  return (0, import_react.useMemo)(() => {
+    if (condition) return children;
+    return fallback ?? null;
+  }, [condition, children, fallback]);
+}
+
+// src/context/cerberus.tsx
+var import_react2 = require("react");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var CerberusContext = (0, import_react2.createContext)(null);
+function useCerberusContext() {
+  const context = (0, import_react2.useContext)(CerberusContext);
+  if (!context) {
+    throw new Error("useCerberus must be used within a CerberusProvider");
+  }
+  return context;
+}
+
+// src/components/accordion/item-indicator.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function AccordionChevronItemIndicator(props) {
+  const { size, ...indicatorProps } = props;
+  const iconSize = size === "sm" ? 16 : "24";
+  const { icons } = useCerberusContext();
+  const { accordionIndicator: ChevronDown } = icons;
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(AccordionParts.ItemIndicator, { ...indicatorProps, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ChevronDown, { size: iconSize }) });
+}
+
+// src/components/accordion/item-group.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var Accordion2 = AccordionParts.Root;
+function AccordionItemGroup(props) {
+  const [groupProps, itemProps] = splitProps(props, [
+    "heading",
+    "children",
+    "indicatorPosition"
+  ]);
+  const indicatorPosition = groupProps.indicatorPosition ?? "end";
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(AccordionParts.Item, { ...itemProps, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(AccordionParts.ItemTrigger, { "data-indicator-position": indicatorPosition, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Show, { when: indicatorPosition === "start", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AccordionChevronItemIndicator, {}) }),
+      groupProps.heading,
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Show, { when: indicatorPosition === "end", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AccordionChevronItemIndicator, {}) })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AccordionParts.ItemContent, { children: groupProps.children })
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Accordion,
+  AccordionItem,
+  AccordionItemContent,
+  AccordionItemGroup,
+  AccordionItemIndicator,
+  AccordionItemTrigger,
+  AccordionParts,
+  AccordionRoot
+});
+//# sourceMappingURL=index.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/accordion/index.ts","../../../../src/components/accordion/primitives.tsx","../../../../src/components/accordion/parts.ts","../../../../src/utils/index.ts","../../../../src/components/Show.tsx","../../../../src/context/cerberus.tsx","../../../../src/components/accordion/item-indicator.tsx","../../../../src/components/accordion/item-group.tsx"],"sourcesContent":["export * from './parts'\nexport * from './primitives'\nexport * from './item-group'\n","import {\n  Accordion,\n  type AccordionItemContentProps,\n  type AccordionItemIndicatorProps,\n  type AccordionItemProps,\n  type AccordionItemTriggerProps,\n  type AccordionRootProps,\n} from '@ark-ui/react/accordion'\nimport { cx } from '@cerberus/styled-system/css'\nimport {\n  accordion,\n  type AccordionVariantProps,\n} from '@cerberus/styled-system/recipes'\n\n/**\n * This module contains the primitives of the Accordion component.\n * @module 'accordion/primitives'\n */\n\n/**\n * The primitive root component of the Accordion component.\n *\n * This component returns the Ark `Accordion.Root` component which has a\n * base style using the Cerberus `accordion` recipe that can be overridden.\n */\nexport function AccordionRoot(\n  props: AccordionRootProps & AccordionVariantProps,\n) {\n  const { size, ...rootProps } = props\n  const styles = accordion({ size })\n  return (\n    <Accordion.Root\n      {...props}\n      className={cx(styles.root, rootProps.className)}\n      data-size={size}\n    />\n  )\n}\n\n/**\n * The primitive item component of the Accordion component.\n *\n * This component returns the Ark `Accordion.Item` component which has a\n * base style using the Cerberus `accordion` recipe that can be overridden.\n */\nexport function AccordionItem(\n  props: AccordionItemProps & AccordionVariantProps,\n) {\n  const styles = accordion()\n  return (\n    <Accordion.Item {...props} className={cx(styles.item, props.className)} />\n  )\n}\n\n/**\n * The primitive trigger component of the Accordion component.\n *\n * This component returns the Ark `Accordion.ItemTrigger` component which has\n * a base style using the Cerberus `accordion` recipe that can be overridden.\n */\nexport function AccordionItemTrigger(props: AccordionItemTriggerProps) {\n  const styles = accordion()\n  return (\n    <Accordion.ItemTrigger\n      {...props}\n      className={cx(styles.itemTrigger, props.className)}\n    />\n  )\n}\n\n/**\n * The primitive item indicator component of the Accordion component.\n *\n * This component returns the Ark `Accordion.ItemIndicator` component which has\n * a base style using the Cerberus `accordion` recipe that can be overridden.\n */\nexport function AccordionItemIndicator(props: AccordionItemIndicatorProps) {\n  const styles = accordion()\n  return (\n    <Accordion.ItemIndicator\n      {...props}\n      className={cx(styles.itemIndicator, props.className)}\n    />\n  )\n}\n\n/**\n * The primitive content component of the Accordion component.\n *\n * This component returns the Ark `Accordion.Content` component which has a\n * base style using the Cerberus `accordion` recipe that can be overridden.\n */\nexport function AccordionItemContent(props: AccordionItemContentProps) {\n  const styles = accordion()\n  return (\n    <Accordion.ItemContent\n      {...props}\n      className={cx(styles.itemContent, props.className)}\n    />\n  )\n}\n","import type { ElementType } from 'react'\nimport {\n  AccordionItem,\n  AccordionItemContent,\n  AccordionItemIndicator,\n  AccordionItemTrigger,\n  AccordionRoot,\n} from './primitives'\n\n/**\n * This module contains the parts of the Accordion component.\n * @module 'accordion/parts'\n */\n\ninterface AccordionPartsValue {\n  /**\n   * The context provider of the accordion.\n   */\n  Root: ElementType\n  /**\n   * The item of the accordion.\n   */\n  Item: ElementType\n  /**\n   * The trigger of the accordion item.\n   */\n  ItemTrigger: ElementType\n  /**\n   * The content of the accordion item.\n   */\n  ItemContent: ElementType\n  /**\n   * The indicator of the accordion item.\n   */\n  ItemIndicator: ElementType\n}\n\n/**\n * An Object containing the parts of the Accordion component. For users that\n * prefer Object component syntax.\n *\n * @remarks\n *\n * When using object component syntax, you import the AccordionParts object and\n * the entire family of components vs. only what you use.\n */\nexport const AccordionParts: AccordionPartsValue = {\n  Root: AccordionRoot,\n  Item: AccordionItem,\n  ItemTrigger: AccordionItemTrigger,\n  ItemContent: AccordionItemContent,\n  ItemIndicator: AccordionItemIndicator,\n}\n","/**\n * This module contains utility functions that are used across your app.\n * @module Utils\n */\n\n/**\n * Formats the count of notifications to be displayed in the notification badge.\n * @param count - The number of notifications.\n * @returns The formatted count of notifications.\n * @example\n * ```tsx\n * const count = formatNotifyCount(100)\n * console.log(count) // '99+'\n * ```\n */\nexport function formatNotifyCount(count: number): string {\n  if (count > 99) return '99+'\n  return count.toString()\n}\n\n/**\n * Splits the properties of an object into multiple groups based on lists of keys.\n * @param props - The object to split.\n * @param keyGroups - The lists of keys to include in each group.\n * @returns An array of objects: each containing the properties specified in the corresponding key group, and the last object containing the remaining keys.\n */\nexport function splitProps<T extends object>(\n  props: T,\n  ...keyGroups: (keyof T)[][]\n): { [K in keyof T]?: T[K] }[] {\n  const result = keyGroups.map(() => ({}) as { [K in keyof T]?: T[K] })\n  const rest = {} as { [K in keyof T]?: T[K] }\n\n  for (const key in props) {\n    let assigned = false\n    for (let i = 0; i < keyGroups.length; i++) {\n      if (keyGroups[i].includes(key as keyof T)) {\n        result[i][key as keyof T] = props[key]\n        assigned = true\n        break\n      }\n    }\n    if (!assigned) {\n      rest[key as keyof T] = props[key]\n    }\n  }\n\n  return [...result, rest]\n}\n\nexport * from './localStorage'\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","'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport type { SystemConfig } from '../config'\n\n/**\n * This  module contains the Cerberus configuration context and helpers.\n * @module context/cerberus\n */\n\ntype CerberusContextValue = SystemConfig\n\nconst CerberusContext = createContext<CerberusContextValue | null>(null)\n\ninterface CerberusProviderProps {\n  config: SystemConfig\n}\n\n/**\n * Cerberus configuration provider.\n * @param props.config The Cerberus configuration created with\n * `makeSystemConfig` helper.\n */\nexport function CerberusProvider(\n  props: PropsWithChildren<CerberusProviderProps>,\n) {\n  return (\n    <CerberusContext.Provider value={props.config}>\n      {props.children}\n    </CerberusContext.Provider>\n  )\n}\n\n/**\n * Returns the Cerberus configuration context.\n * @returns The Cerberus configuration context.\n */\nexport function useCerberusContext() {\n  const context = useContext(CerberusContext)\n  if (!context) {\n    throw new Error('useCerberus must be used within a CerberusProvider')\n  }\n  return context\n}\n","'use client'\n\nimport { type AccordionItemIndicatorProps } from '@ark-ui/react/accordion'\nimport { type AccordionVariantProps } from '@cerberus/styled-system/recipes'\nimport { useCerberusContext } from '../../context/cerberus'\nimport { AccordionParts } from './parts'\n\n/**\n * This module contains the internal AccordionItemIndicator component.\n * @module 'accordion/item-indicator'\n */\n\nexport function AccordionChevronItemIndicator(\n  props: AccordionItemIndicatorProps & AccordionVariantProps,\n) {\n  const { size, ...indicatorProps } = props\n  const iconSize = size === 'sm' ? 16 : '24'\n\n  const { icons } = useCerberusContext()\n  const { accordionIndicator: ChevronDown } = icons\n\n  return (\n    <AccordionParts.ItemIndicator {...indicatorProps}>\n      <ChevronDown size={iconSize} />\n    </AccordionParts.ItemIndicator>\n  )\n}\n","import type { AccordionItemProps } from '@ark-ui/react/accordion'\nimport { type AccordionVariantProps } from '@cerberus/styled-system/recipes'\nimport { splitProps } from '../../utils/index'\nimport { Show } from '../Show'\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\n// We are only exposing this to keep the API consistent\nexport const Accordion = AccordionParts.Root\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":"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","names":["Accordion","import_react","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","Accordion"]}