@cerberus-design/react 0.22.0 → 0.24.0

package/dist/components/select/primitives.cjs

@@ -4,22 +4,22 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const recipes = require('styled-system/recipes');
 const index = require('../../system/index.cjs');
-const listCollection = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/collection/list-collection.cjs');
-const selectHiddenSelect = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-hidden-select.cjs');
-const selectItemIndicator = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-item-indicator.cjs');
-const selectItemText = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-item-text.cjs');
-const selectItem = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-item.cjs');
-const selectItemGroupLabel = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-item-group-label.cjs');
-const selectItemGroup = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-item-group.cjs');
-const selectContent = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-content.cjs');
-const selectPositioner = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-positioner.cjs');
-const selectIndicator = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-indicator.cjs');
-const selectValueText = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-value-text.cjs');
-const selectClearTrigger = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-clear-trigger.cjs');
-const selectTrigger = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-trigger.cjs');
-const selectControl = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-control.cjs');
-const selectLabel = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-label.cjs');
-const selectRoot = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-root.cjs');
+const listCollection = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/collection/list-collection.cjs');
+const selectHiddenSelect = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-hidden-select.cjs');
+const selectItemIndicator = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-item-indicator.cjs');
+const selectItemText = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-item-text.cjs');
+const selectItem = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-item.cjs');
+const selectItemGroupLabel = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-item-group-label.cjs');
+const selectItemGroup = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-item-group.cjs');
+const selectContent = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-content.cjs');
+const selectPositioner = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-positioner.cjs');
+const selectIndicator = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-indicator.cjs');
+const selectValueText = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-value-text.cjs');
+const selectClearTrigger = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-clear-trigger.cjs');
+const selectTrigger = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-trigger.cjs');
+const selectControl = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-control.cjs');
+const selectLabel = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-label.cjs');
+const selectRoot = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-root.cjs');
 
 const { withSlotRecipe, withNoRecipe } = index.createCerberusPrimitive(recipes.select);
 const SelectRoot = withSlotRecipe(selectRoot.SelectRoot, "root");

package/dist/components/select/primitives.js

@@ -1,21 +1,21 @@
 import { select } from 'styled-system/recipes';
 import { createCerberusPrimitive } from '../../system/index.js';
-import { createListCollection } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/collection/list-collection.js';
-import { SelectHiddenSelect as SelectHiddenSelect$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-hidden-select.js';
-import { SelectItemIndicator as SelectItemIndicator$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-item-indicator.js';
-import { SelectItemText as SelectItemText$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-item-text.js';
-import { SelectItem as SelectItem$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-item.js';
-import { SelectItemGroupLabel as SelectItemGroupLabel$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-item-group-label.js';
-import { SelectItemGroup as SelectItemGroup$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-item-group.js';
-import { SelectContent as SelectContent$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-content.js';
-import { SelectPositioner as SelectPositioner$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-positioner.js';
-import { SelectIndicator as SelectIndicator$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-indicator.js';
-import { SelectValueText as SelectValueText$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-value-text.js';
-import { SelectClearTrigger as SelectClearTrigger$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-clear-trigger.js';
-import { SelectTrigger as SelectTrigger$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-trigger.js';
-import { SelectControl as SelectControl$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-control.js';
-import { SelectLabel as SelectLabel$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-label.js';
-import { SelectRoot as SelectRoot$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/select/select-root.js';
+import { createListCollection } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/collection/list-collection.js';
+import { SelectHiddenSelect as SelectHiddenSelect$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-hidden-select.js';
+import { SelectItemIndicator as SelectItemIndicator$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-item-indicator.js';
+import { SelectItemText as SelectItemText$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-item-text.js';
+import { SelectItem as SelectItem$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-item.js';
+import { SelectItemGroupLabel as SelectItemGroupLabel$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-item-group-label.js';
+import { SelectItemGroup as SelectItemGroup$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-item-group.js';
+import { SelectContent as SelectContent$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-content.js';
+import { SelectPositioner as SelectPositioner$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-positioner.js';
+import { SelectIndicator as SelectIndicator$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-indicator.js';
+import { SelectValueText as SelectValueText$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-value-text.js';
+import { SelectClearTrigger as SelectClearTrigger$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-clear-trigger.js';
+import { SelectTrigger as SelectTrigger$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-trigger.js';
+import { SelectControl as SelectControl$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-control.js';
+import { SelectLabel as SelectLabel$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-label.js';
+import { SelectRoot as SelectRoot$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/select/select-root.js';
 
 const { withSlotRecipe, withNoRecipe } = createCerberusPrimitive(select);
 const SelectRoot = withSlotRecipe(SelectRoot$1, "root");

package/dist/components/show/show.cjs

@@ -7,11 +7,12 @@ const jsxRuntime = require('react/jsx-runtime');
 function Show(props) {
   const { when, children, fallback } = props;
   if (when) {
+    if (typeof children === "function") {
+      return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: children() });
+    }
     return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
   }
-  if (fallback) {
-    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: fallback });
-  }
+  if (fallback) return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: fallback });
   return null;
 }
 

package/dist/components/show/show.d.cts

@@ -1,9 +1,15 @@
-import { PropsWithChildren, ReactNode } from 'react';
+import { ReactNode } from 'react';
 /**
  * This module contains the Show component.
  * @module
  */
 export interface ShowProps<T> {
+    /**
+     * The children to render when the condition is true.
+     * This can be a ReactNode or a function that returns a ReactNode. Passing a
+     * function will lazy render the children only when needed.
+     */
+    children: ReactNode | (() => ReactNode);
     /**
      * The condition to render memoized children or the fallback content.
      */
@@ -23,4 +29,4 @@ export interface ShowProps<T> {
  *   <Dashboard />
  * </Show>
  */
-export declare function Show<T>(props: PropsWithChildren<ShowProps<T>>): import("react/jsx-runtime").JSX.Element | null;
+export declare function Show<T>(props: ShowProps<T>): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/show/show.d.ts

@@ -1,9 +1,15 @@
-import { PropsWithChildren, ReactNode } from 'react';
+import { ReactNode } from 'react';
 /**
  * This module contains the Show component.
  * @module
  */
 export interface ShowProps<T> {
+    /**
+     * The children to render when the condition is true.
+     * This can be a ReactNode or a function that returns a ReactNode. Passing a
+     * function will lazy render the children only when needed.
+     */
+    children: ReactNode | (() => ReactNode);
     /**
      * The condition to render memoized children or the fallback content.
      */
@@ -23,4 +29,4 @@ export interface ShowProps<T> {
  *   <Dashboard />
  * </Show>
  */
-export declare function Show<T>(props: PropsWithChildren<ShowProps<T>>): import("react/jsx-runtime").JSX.Element | null;
+export declare function Show<T>(props: ShowProps<T>): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/show/show.js

@@ -3,11 +3,12 @@ import { jsx, Fragment } from 'react/jsx-runtime';
 function Show(props) {
   const { when, children, fallback } = props;
   if (when) {
+    if (typeof children === "function") {
+      return /* @__PURE__ */ jsx(Fragment, { children: children() });
+    }
     return /* @__PURE__ */ jsx(Fragment, { children });
   }
-  if (fallback) {
-    return /* @__PURE__ */ jsx(Fragment, { children: fallback });
-  }
+  if (fallback) return /* @__PURE__ */ jsx(Fragment, { children: fallback });
   return null;
 }
 

package/dist/components/split-button/button.cjs

@@ -5,10 +5,10 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const jsxRuntime = require('react/jsx-runtime');
 const cerberus = require('../../context/cerberus.cjs');
 const index = require('../../utils/index.cjs');
-const button = require('../button/button.cjs');
+const parts = require('../button/parts.cjs');
 const primitives = require('../button/primitives.cjs');
 const menu = require('../menu/menu.cjs');
-const button$1 = require('../icon-button/button.cjs');
+const button = require('../icon-button/button.cjs');
 
 function SplitButton(props) {
   const [elProps, { usage = "filled", actionText }, actionProps] = index.splitProps(
@@ -20,13 +20,17 @@ function SplitButton(props) {
   const { selectArrow: SelectArrow } = icons;
   const iconShape = actionProps.shape === "rounded" ? "circle" : "square";
   return /* @__PURE__ */ jsxRuntime.jsxs(primitives.ButtonGroup, { layout: "attached", shape: actionProps.shape, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(button.Button, { usage, ...actionProps, children: actionText }),
+    /* @__PURE__ */ jsxRuntime.jsxs(parts.ButtonParts.Root, { usage, ...actionProps, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(parts.ButtonParts.Icon, {}),
+      actionText
+    ] }),
     /* @__PURE__ */ jsxRuntime.jsxs(menu.Menu, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(menu.MenuTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(
-        button$1.IconButton,
+        button.IconButton,
         {
           ariaLabel: "More options",
           palette: actionProps.palette,
+          disabled: actionProps.pending,
           shape: iconShape,
           usage,
           children: /* @__PURE__ */ jsxRuntime.jsx(SelectArrow, {})

package/dist/components/split-button/button.d.cts

@@ -1,10 +1,13 @@
-import { PropsWithChildren } from 'react';
 import { ButtonProps } from '../button/index';
+import { CerberusPrimitiveProps } from '../../system/types';
 /**
  * This module provides an abstraction for a SplitButton component.
  * @module SplitButton
  */
 export interface SplitButtonProps extends ButtonProps {
+    /** T
+     * he text for the primary action button.
+     */
     actionText: string;
 }
 /**
@@ -12,4 +15,4 @@ export interface SplitButtonProps extends ButtonProps {
  * dropdown menu for additional actions.
  * @definition [Cerberus docs](https://cerberus.digitalu.designdocs/components/split-button)
  */
-export declare function SplitButton(props: PropsWithChildren<SplitButtonProps>): import("react/jsx-runtime").JSX.Element;
+export declare function SplitButton(props: CerberusPrimitiveProps<SplitButtonProps>): import("react/jsx-runtime").JSX.Element;

package/dist/components/split-button/button.d.ts

@@ -1,10 +1,13 @@
-import { PropsWithChildren } from 'react';
 import { ButtonProps } from '../button/index';
+import { CerberusPrimitiveProps } from '../../system/types';
 /**
  * This module provides an abstraction for a SplitButton component.
  * @module SplitButton
  */
 export interface SplitButtonProps extends ButtonProps {
+    /** T
+     * he text for the primary action button.
+     */
     actionText: string;
 }
 /**
@@ -12,4 +15,4 @@ export interface SplitButtonProps extends ButtonProps {
  * dropdown menu for additional actions.
  * @definition [Cerberus docs](https://cerberus.digitalu.designdocs/components/split-button)
  */
-export declare function SplitButton(props: PropsWithChildren<SplitButtonProps>): import("react/jsx-runtime").JSX.Element;
+export declare function SplitButton(props: CerberusPrimitiveProps<SplitButtonProps>): import("react/jsx-runtime").JSX.Element;

package/dist/components/split-button/button.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useCerberusContext } from '../../context/cerberus.js';
 import { splitProps } from '../../utils/index.js';
-import { Button } from '../button/button.js';
+import { ButtonParts } from '../button/parts.js';
 import { ButtonGroup } from '../button/primitives.js';
 import { Menu, MenuTrigger, MenuContent } from '../menu/menu.js';
 import { IconButton } from '../icon-button/button.js';
@@ -16,13 +16,17 @@ function SplitButton(props) {
   const { selectArrow: SelectArrow } = icons;
   const iconShape = actionProps.shape === "rounded" ? "circle" : "square";
   return /* @__PURE__ */ jsxs(ButtonGroup, { layout: "attached", shape: actionProps.shape, children: [
-    /* @__PURE__ */ jsx(Button, { usage, ...actionProps, children: actionText }),
+    /* @__PURE__ */ jsxs(ButtonParts.Root, { usage, ...actionProps, children: [
+      /* @__PURE__ */ jsx(ButtonParts.Icon, {}),
+      actionText
+    ] }),
     /* @__PURE__ */ jsxs(Menu, { children: [
       /* @__PURE__ */ jsx(MenuTrigger, { children: /* @__PURE__ */ jsx(
         IconButton,
         {
           ariaLabel: "More options",
           palette: actionProps.palette,
+          disabled: actionProps.pending,
           shape: iconShape,
           usage,
           children: /* @__PURE__ */ jsx(SelectArrow, {})

package/dist/components/switch/primitives.cjs

@@ -4,11 +4,11 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const recipes = require('styled-system/recipes');
 const index = require('../../system/index.cjs');
-const switchHiddenInput = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/switch/switch-hidden-input.cjs');
-const switchThumb = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/switch/switch-thumb.cjs');
-const switchControl = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/switch/switch-control.cjs');
-const switchLabel = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/switch/switch-label.cjs');
-const switchRoot = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/switch/switch-root.cjs');
+const switchHiddenInput = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/switch/switch-hidden-input.cjs');
+const switchThumb = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/switch/switch-thumb.cjs');
+const switchControl = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/switch/switch-control.cjs');
+const switchLabel = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/switch/switch-label.cjs');
+const switchRoot = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/switch/switch-root.cjs');
 
 const { withSlotRecipe, withNoRecipe } = index.createCerberusPrimitive(recipes.switchRecipe);
 const SwitchRoot = withSlotRecipe(switchRoot.SwitchRoot, "root");

package/dist/components/switch/primitives.js

@@ -1,10 +1,10 @@
 import { switchRecipe } from 'styled-system/recipes';
 import { createCerberusPrimitive } from '../../system/index.js';
-import { SwitchHiddenInput as SwitchHiddenInput$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/switch/switch-hidden-input.js';
-import { SwitchThumb as SwitchThumb$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/switch/switch-thumb.js';
-import { SwitchControl as SwitchControl$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/switch/switch-control.js';
-import { SwitchLabel as SwitchLabel$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/switch/switch-label.js';
-import { SwitchRoot as SwitchRoot$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/switch/switch-root.js';
+import { SwitchHiddenInput as SwitchHiddenInput$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/switch/switch-hidden-input.js';
+import { SwitchThumb as SwitchThumb$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/switch/switch-thumb.js';
+import { SwitchControl as SwitchControl$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/switch/switch-control.js';
+import { SwitchLabel as SwitchLabel$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/switch/switch-label.js';
+import { SwitchRoot as SwitchRoot$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/switch/switch-root.js';
 
 const { withSlotRecipe, withNoRecipe } = createCerberusPrimitive(switchRecipe);
 const SwitchRoot = withSlotRecipe(SwitchRoot$1, "root");

package/dist/components/tabs/primitives.cjs

@@ -4,11 +4,11 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const recipes = require('styled-system/recipes');
 const index = require('../../system/index.cjs');
-const tabIndicator = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/tabs/tab-indicator.cjs');
-const tabContent = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/tabs/tab-content.cjs');
-const tabTrigger = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/tabs/tab-trigger.cjs');
-const tabList = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/tabs/tab-list.cjs');
-const tabsRoot = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/tabs/tabs-root.cjs');
+const tabIndicator = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/tabs/tab-indicator.cjs');
+const tabContent = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/tabs/tab-content.cjs');
+const tabTrigger = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/tabs/tab-trigger.cjs');
+const tabList = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/tabs/tab-list.cjs');
+const tabsRoot = require('../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/tabs/tabs-root.cjs');
 
 const { withSlotRecipe } = index.createCerberusPrimitive(recipes.tabs);
 const TabsRoot = withSlotRecipe(tabsRoot.TabsRoot, "root");

package/dist/components/tabs/primitives.js

@@ -1,10 +1,10 @@
 import { tabs } from 'styled-system/recipes';
 import { createCerberusPrimitive } from '../../system/index.js';
-import { TabIndicator } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/tabs/tab-indicator.js';
-import { TabContent } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/tabs/tab-content.js';
-import { TabTrigger } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/tabs/tab-trigger.js';
-import { TabList } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/tabs/tab-list.js';
-import { TabsRoot as TabsRoot$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/tabs/tabs-root.js';
+import { TabIndicator } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/tabs/tab-indicator.js';
+import { TabContent } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/tabs/tab-content.js';
+import { TabTrigger } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/tabs/tab-trigger.js';
+import { TabList } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/tabs/tab-list.js';
+import { TabsRoot as TabsRoot$1 } from '../../node_modules/.pnpm/@ark-ui_react@5.29.1_react-dom@19.2.1_react@19.2.1__react@19.2.1/node_modules/@ark-ui/react/dist/components/tabs/tabs-root.js';
 
 const { withSlotRecipe } = createCerberusPrimitive(tabs);
 const TabsRoot = withSlotRecipe(TabsRoot$1, "root");

package/dist/components/tag/closable.cjs

@@ -0,0 +1,42 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const cerberus = require('../../context/cerberus.cjs');
+const primitives = require('./primitives.cjs');
+const button = require('../icon-button/button.cjs');
+
+function ClosableTag(props) {
+  const { onClick, children, ...rootProps } = props;
+  const { icons } = cerberus.useCerberusContext();
+  const { close: Close } = icons;
+  const palette = rootProps.palette === "page" ? "secondaryAction" : rootProps.palette ?? "secondaryAction";
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    primitives.TagRoot,
+    {
+      "data-palette": palette,
+      palette,
+      shape: "pill",
+      pe: "0",
+      ...rootProps,
+      children: [
+        children,
+        /* @__PURE__ */ jsxRuntime.jsx(
+          button.IconButton,
+          {
+            ariaLabel: "Close",
+            onClick,
+            palette,
+            usage: "filled",
+            size: "sm",
+            children: /* @__PURE__ */ jsxRuntime.jsx(Close, {})
+          }
+        )
+      ]
+    }
+  );
+}
+
+exports.ClosableTag = ClosableTag;

package/dist/components/tag/closable.d.cts

@@ -0,0 +1,9 @@
+import { ButtonHTMLAttributes } from 'react';
+import { TagRootProps } from './primitives';
+export interface ClosableTagProps extends TagRootProps {
+    /**
+     * The action to be performed when the close button is clicked.
+     */
+    onClick: ButtonHTMLAttributes<HTMLButtonElement>['onClick'];
+}
+export declare function ClosableTag(props: ClosableTagProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/tag/closable.d.ts

@@ -0,0 +1,9 @@
+import { ButtonHTMLAttributes } from 'react';
+import { TagRootProps } from './primitives';
+export interface ClosableTagProps extends TagRootProps {
+    /**
+     * The action to be performed when the close button is clicked.
+     */
+    onClick: ButtonHTMLAttributes<HTMLButtonElement>['onClick'];
+}
+export declare function ClosableTag(props: ClosableTagProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/tag/closable.js

@@ -0,0 +1,38 @@
+'use client';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useCerberusContext } from '../../context/cerberus.js';
+import { TagRoot } from './primitives.js';
+import { IconButton } from '../icon-button/button.js';
+
+function ClosableTag(props) {
+  const { onClick, children, ...rootProps } = props;
+  const { icons } = useCerberusContext();
+  const { close: Close } = icons;
+  const palette = rootProps.palette === "page" ? "secondaryAction" : rootProps.palette ?? "secondaryAction";
+  return /* @__PURE__ */ jsxs(
+    TagRoot,
+    {
+      "data-palette": palette,
+      palette,
+      shape: "pill",
+      pe: "0",
+      ...rootProps,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            ariaLabel: "Close",
+            onClick,
+            palette,
+            usage: "filled",
+            size: "sm",
+            children: /* @__PURE__ */ jsx(Close, {})
+          }
+        )
+      ]
+    }
+  );
+}
+
+export { ClosableTag };

package/dist/components/tag/index.cjs

@@ -2,8 +2,10 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
+const primitives = require('./primitives.cjs');
 const tag = require('./tag.cjs');
 
 
 
+exports.TagRoot = primitives.TagRoot;
 exports.Tag = tag.Tag;

package/dist/components/tag/index.d.cts

@@ -1 +1,2 @@
+export * from './primitives';
 export * from './tag';

package/dist/components/tag/index.d.ts

@@ -1 +1,2 @@
+export * from './primitives';
 export * from './tag';

package/dist/components/tag/index.js

@@ -1 +1,2 @@
+export { TagRoot } from './primitives.js';
 export { Tag } from './tag.js';

package/dist/components/tag/primitives.cjs

@@ -0,0 +1,16 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const index = require('../../system/index.cjs');
+const recipes = require('styled-system/recipes');
+
+const { withRecipe } = index.createCerberusPrimitive(recipes.tag);
+const TagRoot = withRecipe("span", {
+  defaultProps: {
+    "data-scope": "tag",
+    "data-part": "root"
+  }
+});
+
+exports.TagRoot = TagRoot;

package/dist/components/tag/primitives.d.cts

@@ -0,0 +1,5 @@
+import { CerberusPrimitiveProps } from '../../system/index';
+import { TagVariantProps } from 'styled-system/recipes';
+import { HTMLAttributes, ForwardRefExoticComponent, DetailedHTMLProps, RefAttributes } from 'react';
+export type TagRootProps = CerberusPrimitiveProps<Omit<HTMLAttributes<HTMLSpanElement>, 'onClick'> & TagVariantProps>;
+export declare const TagRoot: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps< DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>, "ref"> & RefAttributes<unknown>>;

package/dist/components/tag/primitives.d.ts

@@ -0,0 +1,5 @@
+import { CerberusPrimitiveProps } from '../../system/index';
+import { TagVariantProps } from 'styled-system/recipes';
+import { HTMLAttributes, ForwardRefExoticComponent, DetailedHTMLProps, RefAttributes } from 'react';
+export type TagRootProps = CerberusPrimitiveProps<Omit<HTMLAttributes<HTMLSpanElement>, 'onClick'> & TagVariantProps>;
+export declare const TagRoot: ForwardRefExoticComponent<Omit<CerberusPrimitiveProps< DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>, "ref"> & RefAttributes<unknown>>;

package/dist/components/tag/primitives.js

@@ -0,0 +1,12 @@
+import { createCerberusPrimitive } from '../../system/index.js';
+import { tag } from 'styled-system/recipes';
+
+const { withRecipe } = createCerberusPrimitive(tag);
+const TagRoot = withRecipe("span", {
+  defaultProps: {
+    "data-scope": "tag",
+    "data-part": "root"
+  }
+});
+
+export { TagRoot };

package/dist/components/tag/tag.cjs

@@ -3,56 +3,20 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const factory = require('../../node_modules/.pnpm/@ark-ui_react@5.25.0_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@ark-ui/react/dist/components/factory.cjs');
-const css = require('styled-system/css');
-const recipes = require('styled-system/recipes');
-const cerberus = require('../../context/cerberus.cjs');
-const show = require('../show/show.cjs');
-const button = require('../icon-button/button.cjs');
+const primitives = require('./primitives.cjs');
+const closable = require('./closable.cjs');
 
+function isClosableTag(props) {
+  return "onClick" in props && typeof props.onClick !== "undefined";
+}
 function Tag(props) {
-  const { shape: initShape, gradient, onClick, usage, ...nativeProps } = props;
-  const palette = props?.palette ?? "page";
-  const isClosable = Boolean(onClick);
-  const shape = isClosable ? "pill" : initShape;
-  const closableStyles = isClosable ? closableCss : "";
-  const { icons } = cerberus.useCerberusContext();
-  const { close: Close } = icons;
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    factory.ark.span,
-    {
-      ...nativeProps,
-      className: css.cx(
-        nativeProps.className,
-        recipes.tag({
-          gradient,
-          palette,
-          shape,
-          usage
-        }),
-        closableStyles
-      ),
-      children: [
-        props.children,
-        /* @__PURE__ */ jsxRuntime.jsx(show.Show, { when: isClosable, children: /* @__PURE__ */ jsxRuntime.jsx(
-          button.IconButton,
-          {
-            ariaLabel: "Close",
-            onClick,
-            palette: "action",
-            usage: "filled",
-            size: "sm",
-            children: /* @__PURE__ */ jsxRuntime.jsx(Close, {})
-          }
-        ) })
-      ]
-    }
-  );
+  const { children } = props;
+  if (isClosableTag(props)) {
+    const { onClick, ...rootProps2 } = props;
+    return /* @__PURE__ */ jsxRuntime.jsx(closable.ClosableTag, { onClick, ...rootProps2, children });
+  }
+  const rootProps = props;
+  return /* @__PURE__ */ jsxRuntime.jsx(primitives.TagRoot, { "data-palette": rootProps.palette ?? "page", ...rootProps, children });
 }
-const closableCss = css.css({
-  bgColor: "action.bg.active",
-  color: "action.text.initial",
-  paddingInlineEnd: "0"
-});
 
 exports.Tag = Tag;