@commercetools/nimbus 0.0.0-canary-20250930100116 → 0.0.0-canary-20250930190235

package/dist/index.d.ts

@@ -24,6 +24,9 @@ import { CardProps as CardProps_2 } from './card.types';
 import { CellProps } from 'react-aria-components';
 import { CheckboxProps as CheckboxProps_2 } from 'react-aria-components';
 import { CodeProps } from '@chakra-ui/react';
+import { CollapsibleMotionContentProps as CollapsibleMotionContentProps_2 } from './collapsible-motion.types';
+import { CollapsibleMotionRootProps as CollapsibleMotionRootProps_2 } from './collapsible-motion.types';
+import { CollapsibleMotionTriggerProps as CollapsibleMotionTriggerProps_2 } from './collapsible-motion.types';
 import { ColumnProps } from 'react-aria-components';
 import { ComboBoxOptionGroupProps as ComboBoxOptionGroupProps_2 } from './combobox.types';
 import { ComboBoxOptionProps as ComboBoxOptionProps_2 } from './combobox.types';
@@ -860,6 +863,113 @@ declare type CheckboxVariantProps = CheckboxRootProps & RecipeVariantProps<typeo
  */
 export declare const Code: ForwardRefExoticComponent<CodeProps & RefAttributes<HTMLElement>>;
 
+export declare const CollapsibleMotion: {
+    Root: ForwardRefExoticComponent<CollapsibleMotionRootProps_2 & RefAttributes<HTMLDivElement>>;
+    Trigger: ForwardRefExoticComponent<CollapsibleMotionTriggerProps_2 & RefAttributes<HTMLButtonElement>>;
+    Content: ForwardRefExoticComponent<CollapsibleMotionContentProps_2 & RefAttributes<HTMLDivElement>>;
+};
+
+/**
+ * Props for CollapsibleMotion.Content component
+ * The collapsible content container with Chakra UI styling support
+ * Extends HTML div attributes to support all standard div props
+ */
+export declare interface CollapsibleMotionContentProps extends HTMLChakraProps<"div"> {
+    /**
+     * The content to be collapsed/expanded
+     */
+    children: ReactNode;
+}
+
+/**
+ * Internal context value interface for sharing state between compound components
+ * This provides the communication layer between Root, Trigger, and Content components
+ *
+ * Note: Only includes properties that are actually consumed by child components.
+ * React Aria handles state management internally through buttonProps/panelProps.
+ */
+export declare interface CollapsibleMotionContextValue {
+    /** Whether the collapsible is disabled */
+    isDisabled: boolean;
+    /** Whether the content is currently expanded */
+    isExpanded: boolean;
+    /** Button props from React Aria for accessibility */
+    buttonProps: AriaButtonProps<"button">;
+    /** Panel props from React Aria for accessibility */
+    panelProps: React.HTMLAttributes<HTMLDivElement>;
+    /** Panel ref for React Aria (needs to be attached to the panel container) */
+    panelRef: RefObject<HTMLDivElement | null>;
+}
+
+/**
+ * Recipe variant props extracted from the slot recipe
+ * These control the visual variants available in the recipe system
+ */
+export declare type CollapsibleMotionRecipeProps = RecipeVariantProps<CollapsibleMotionSlotRecipe>;
+
+/**
+ * Props for CollapsibleMotion.Root component
+ * The main container that manages disclosure state and provides context to child components
+ * Extends recipe props to inherit styling variants
+ */
+export declare interface CollapsibleMotionRootProps extends CollapsibleMotionRecipeProps {
+    /**
+     * The child components (Trigger and Content)
+     */
+    children: ReactNode;
+    /**
+     * Whether the content is expanded by default (uncontrolled mode)
+     */
+    defaultExpanded?: boolean;
+    /**
+     * Whether the content is expanded (controlled mode)
+     */
+    isExpanded?: boolean;
+    /**
+     * Callback fired when the expanded state changes
+     */
+    onExpandedChange?: (isExpanded: boolean) => void;
+    /**
+     * Whether the collapsible is disabled
+     */
+    isDisabled?: boolean;
+    /**
+     * Data attributes for testing and analytics
+     */
+    [key: `data-${string}`]: unknown;
+}
+
+/**
+ * Root slot props combining Chakra HTML props with recipe variants
+ * This is the base for the root container component
+ */
+export declare type CollapsibleMotionRootSlotProps = HTMLChakraProps<"div", CollapsibleMotionRecipeProps>;
+
+/**
+ * Type definition for the CollapsibleMotion slot recipe
+ * This is the foundation for all recipe-based styling
+ */
+export declare type CollapsibleMotionSlotRecipe = typeof collapsibleMotionSlotRecipe;
+
+declare const collapsibleMotionSlotRecipe: SlotRecipeDefinition<"content" | "root" | "trigger", SlotRecipeVariantRecord<"content" | "root" | "trigger">>;
+
+/**
+ * Props for CollapsibleMotion.Trigger component
+ * The clickable element that toggles the disclosure state
+ * Extends button HTML attributes for direct button rendering
+ */
+export declare interface CollapsibleMotionTriggerProps extends HTMLChakraProps<"button"> {
+    /**
+     * The trigger element content (typically text or icons)
+     */
+    children: React.ReactNode;
+    /**
+     * Whether to render as a child element (use children directly as the trigger)
+     * @default false
+     */
+    asChild?: boolean;
+}
+
 export declare interface ColorModeProviderProps extends ThemeProviderProps {
 }
 

package/dist/index.es.js

@@ -1,66 +1,67 @@
 import { A as Le } from "./chunks/avatar-Bu12OMzz.es.js";
 import { B as Be } from "./chunks/box-DuBoAZvq.es.js";
-import { B as Fe } from "./chunks/button-DRMpnb-1.es.js";
+import { B as Fe } from "./chunks/button-CzLJhEV7.es.js";
 import { C as Ke } from "./chunks/code-Dl7u63Zn.es.js";
-import { C as Ne, c as Ue, b as je, a as Ge } from "./chunks/combobox-C1LdL2D0.es.js";
+import { C as Ne, c as Ue, b as je, a as Ge } from "./chunks/combobox-wkLS3Qcd.es.js";
 import { D as Ve } from "./chunks/dialog-DTSuKnyk.es.js";
 import { a as We, F as $e } from "./chunks/field-errors-CcQ1ssQj.es.js";
-import { G as Je } from "./chunks/group-CqfSQXe7.es.js";
-import { I as Ye } from "./chunks/icon-button-C_i4ydsN.es.js";
-import { I as et } from "./chunks/icon-toggle-button-f03QyjEE.es.js";
+import { G as Je } from "./chunks/group-FqYM3Go1.es.js";
+import { I as Ye } from "./chunks/icon-button-CwG0NBaY.es.js";
+import { I as et } from "./chunks/icon-toggle-button-Ya3xXEj8.es.js";
 import { I as rt } from "./chunks/image-DRigLU80.es.js";
-import { K as nt } from "./chunks/kbd-BXN9aXRE.es.js";
-import { L as st } from "./chunks/link-CFK97sc0.es.js";
+import { K as nt } from "./chunks/kbd-D10CDyIE.es.js";
+import { L as st } from "./chunks/link-CwFZrz1A.es.js";
 import { L as ut, c as lt, b as ct, a as ft } from "./chunks/list-Nz5KjWzs.es.js";
 import { S as pt } from "./chunks/simple-grid-DU5v66TG.es.js";
-import { T as yt } from "./chunks/text-DfQpupDi.es.js";
-import { b as gt, a as bt, T as xt } from "./chunks/tooltip-B1YdruCE.es.js";
-import { M as ht } from "./chunks/make-element-focusable-BamCHW5U.es.js";
-import { z as X } from "./chunks/nimbus-provider-BE3QFNWW.es.js";
-import { N as wt } from "./chunks/nimbus-provider-BE3QFNWW.es.js";
-import { C as St } from "./chunks/checkbox-CdSHDZgM.es.js";
-import { S as kt } from "./chunks/stack-CoNreM7B.es.js";
-import { V as Rt } from "./chunks/visually-hidden-BluyWhUI.es.js";
-import { T as At } from "./chunks/text-input-Bm5P6cG3.es.js";
-import { N as Mt } from "./chunks/number-input-COfobs8H.es.js";
-import { G as Pt } from "./chunks/grid-De8qjf98.es.js";
-import { S as Ht, c as Kt, d as Ot, b as Nt, a as Ut } from "./chunks/select-CwavXa9Y.es.js";
-import { S as Gt } from "./chunks/separator-BSLmXG3h.es.js";
-import { A as Vt, d as zt, c as Wt, e as $t, b as Xt, a as Jt } from "./chunks/accordion-Ae1N6ceW.es.js";
-import { A as Yt, d as Zt, c as er, e as tr, a as rr, b as or } from "./chunks/alert-BRDuEo75.es.js";
-import { B as ar } from "./chunks/badge-BJd-Q81M.es.js";
-import { C as ir, c as ur, b as lr, a as cr } from "./chunks/card-BfUdf1Fy.es.js";
-import { F as dr, d as pr, e as mr, f as yr, c as vr, b as gr, a as br } from "./chunks/form-field-bP4SYMaC.es.js";
-import { I as Cr } from "./chunks/icon-DHu0zrOb.es.js";
-import { I as _r } from "./chunks/inline-svg-DTleUhZq.es.js";
-import { L as Tr } from "./chunks/loading-spinner-DqWmjCK2.es.js";
-import { P as Er } from "./chunks/password-input-BXIl-f4z.es.js";
-import { S as Dr } from "./chunks/split-button-BxfsI-af.es.js";
-import { T as Ir } from "./chunks/time-input-BVrf5gCi.es.js";
-import { M as Lr } from "./chunks/multiline-text-input-DZaLPY2Z.es.js";
-import { M as Br } from "./chunks/money-input-BN_yFB_R.es.js";
-import { R as Fr, b as Hr, a as Kr } from "./chunks/radio-input-CBsoUt1S.es.js";
-import { S as Nr } from "./chunks/switch-CaNbdCzT.es.js";
-import { T as jr } from "./chunks/tag-group-CnStbH_k.es.js";
-import { T as qr } from "./chunks/toggle-button-Bg4ygY7u.es.js";
-import { T as zr, b as Wr, a as $r } from "./chunks/toggle-button-group-jRdpdYyd.es.js";
-import { D as Jr } from "./chunks/date-input-CoAPdZTG.es.js";
-import { C as Yr } from "./chunks/calendar-DnQnMOcs.es.js";
-import { D as eo } from "./chunks/date-picker-Bic1MCyC.es.js";
-import { P as ro } from "./chunks/progress-bar-8RZO_7Pa.es.js";
-import { R as no } from "./chunks/range-calendar-ZSiCkuoX.es.js";
-import { D as so } from "./chunks/date-range-picker-D4jLAymc.es.js";
-import { T as uo } from "./chunks/toolbar-BZFjOgau.es.js";
-import { g as J } from "./chunks/rich-text-input-DynX9BO2.es.js";
-import { R as co } from "./chunks/rich-text-input-DynX9BO2.es.js";
-import { D as po, e as mo, g as yo, d as vo, i as go, h as bo, c as xo, j as Co, a as ho, f as _o, k as wo, b as To } from "./chunks/data-table-CommJV1y.es.js";
-import { P as Eo } from "./chunks/pagination-C4dyNajw.es.js";
-import { s as Do } from "./chunks/index-CRta5Y1_.es.js";
+import { T as yt } from "./chunks/text-Bi4Gre95.es.js";
+import { b as gt, a as bt, T as xt } from "./chunks/tooltip-BE3LzL7I.es.js";
+import { M as ht } from "./chunks/make-element-focusable-DRTJNWHH.es.js";
+import { z as X } from "./chunks/nimbus-provider-DBBdCIeV.es.js";
+import { N as wt } from "./chunks/nimbus-provider-DBBdCIeV.es.js";
+import { C as St } from "./chunks/checkbox-hKLS_Hpf.es.js";
+import { C as kt } from "./chunks/collapsible-motion-D8dG2JLf.es.js";
+import { S as Rt } from "./chunks/stack-CoNreM7B.es.js";
+import { V as At } from "./chunks/visually-hidden-09RsVX6x.es.js";
+import { T as Mt } from "./chunks/text-input-CiZheGLu.es.js";
+import { N as Pt } from "./chunks/number-input-GalEa1xO.es.js";
+import { G as Ht } from "./chunks/grid-De8qjf98.es.js";
+import { S as Ot, c as Nt, d as Ut, b as jt, a as Gt } from "./chunks/select-CU6bPTz6.es.js";
+import { S as Vt } from "./chunks/separator-Demj-lbE.es.js";
+import { A as Wt, d as $t, c as Xt, e as Jt, b as Qt, a as Yt } from "./chunks/accordion-BdPLxwi8.es.js";
+import { A as er, d as tr, c as rr, e as or, a as nr, b as ar } from "./chunks/alert-CiUQDrPl.es.js";
+import { B as ir } from "./chunks/badge-CHmfeeRs.es.js";
+import { C as lr, c as cr, b as fr, a as dr } from "./chunks/card-D9fWUQqs.es.js";
+import { F as mr, d as yr, e as vr, f as gr, c as br, b as xr, a as Cr } from "./chunks/form-field-ZCIvXD-t.es.js";
+import { I as _r } from "./chunks/icon-DHu0zrOb.es.js";
+import { I as Tr } from "./chunks/inline-svg-DTleUhZq.es.js";
+import { L as Er } from "./chunks/loading-spinner-D3xWum_0.es.js";
+import { P as Dr } from "./chunks/password-input-XPlnNgUY.es.js";
+import { S as Ir } from "./chunks/split-button-8Dt6KkSc.es.js";
+import { T as Lr } from "./chunks/time-input-CGwOrAf4.es.js";
+import { M as Br } from "./chunks/multiline-text-input-uXOEV56a.es.js";
+import { M as Fr } from "./chunks/money-input-Bp0LI7WP.es.js";
+import { R as Kr, b as Or, a as Nr } from "./chunks/radio-input-B0M7JizK.es.js";
+import { S as jr } from "./chunks/switch-D28v2iAJ.es.js";
+import { T as qr } from "./chunks/tag-group-RzZiEVi1.es.js";
+import { T as zr } from "./chunks/toggle-button-Cj4XMEzn.es.js";
+import { T as $r, b as Xr, a as Jr } from "./chunks/toggle-button-group-DXmJCAH5.es.js";
+import { D as Yr } from "./chunks/date-input-KbMioTti.es.js";
+import { C as eo } from "./chunks/calendar-B_H9_kwD.es.js";
+import { D as ro } from "./chunks/date-picker-rBQTH5hR.es.js";
+import { P as no } from "./chunks/progress-bar-CpKSaB_5.es.js";
+import { R as so } from "./chunks/range-calendar-BQsO9nZw.es.js";
+import { D as uo } from "./chunks/date-range-picker-BEk9kT2e.es.js";
+import { T as co } from "./chunks/toolbar-5TZLzPq3.es.js";
+import { g as J } from "./chunks/rich-text-input-ADGWauFn.es.js";
+import { R as po } from "./chunks/rich-text-input-ADGWauFn.es.js";
+import { D as yo, e as vo, g as go, d as bo, i as xo, h as Co, c as ho, j as _o, a as wo, f as To, k as So, b as Eo } from "./chunks/data-table-Bp2P2wVh.es.js";
+import { P as Do } from "./chunks/pagination-wNk5gMNe.es.js";
+import { s as Io } from "./chunks/index-C7AV1c1_.es.js";
 import { useState as M, useRef as S, useCallback as k, useLayoutEffect as Q, useEffect as B, useContext as G, createContext as q } from "react";
-import { Flex as Io } from "@chakra-ui/react/flex";
-import { Heading as Lo } from "@chakra-ui/react/heading";
-import { Table as Bo } from "@chakra-ui/react/table";
-import { M as Fo, c as Ho, d as Ko, a as Oo, e as No, g as Uo, f as jo, b as Go } from "./chunks/menu-Dfwew0Go.es.js";
+import { Flex as Lo } from "@chakra-ui/react/flex";
+import { Heading as Bo } from "@chakra-ui/react/heading";
+import { Table as Fo } from "@chakra-ui/react/table";
+import { M as Ko, c as Oo, d as No, a as Uo, e as jo, g as Go, f as qo, b as Vo } from "./chunks/menu-Bo_DdYZH.es.js";
 import "react/jsx-runtime";
 function L() {
   return L = Object.assign ? Object.assign.bind() : function(e) {
@@ -421,120 +422,121 @@ function Re(e, t) {
   return r === "light" ? e : t;
 }
 export {
-  Vt as Accordion,
-  Yt as Alert,
+  Wt as Accordion,
+  er as Alert,
   Le as Avatar,
-  ar as Badge,
+  ir as Badge,
   Be as Box,
   Fe as Button,
-  Yr as Calendar,
-  ir as Card,
+  eo as Calendar,
+  lr as Card,
   St as Checkbox,
   Ke as Code,
+  kt as CollapsibleMotion,
   Ne as ComboBox,
-  po as DataTable,
-  Jr as DateInput,
-  eo as DatePicker,
-  so as DateRangePicker,
+  yo as DataTable,
+  Yr as DateInput,
+  ro as DatePicker,
+  uo as DateRangePicker,
   Ve as Dialog,
   We as FieldErrorTypes,
   $e as FieldErrors,
-  Io as Flex,
-  dr as FormField,
-  Pt as Grid,
+  Lo as Flex,
+  mr as FormField,
+  Ht as Grid,
   Je as Group,
-  Lo as Heading,
-  Cr as Icon,
+  Bo as Heading,
+  _r as Icon,
   Ye as IconButton,
   et as IconToggleButton,
   rt as Image,
-  _r as InlineSvg,
+  Tr as InlineSvg,
   nt as Kbd,
   st as Link,
   ut as List,
-  Tr as LoadingSpinner,
+  Er as LoadingSpinner,
   ht as MakeElementFocusable,
-  Fo as Menu,
-  Br as MoneyInput,
-  Lr as MultilineTextInput,
+  Ko as Menu,
+  Fr as MoneyInput,
+  Br as MultilineTextInput,
   wt as NimbusProvider,
-  Mt as NumberInput,
-  Eo as Pagination,
-  Er as PasswordInput,
-  ro as ProgressBar,
-  Fr as RadioInput,
-  no as RangeCalendar,
-  co as RichTextInput,
-  Ht as Select,
-  Gt as Separator,
+  Pt as NumberInput,
+  Do as Pagination,
+  Dr as PasswordInput,
+  no as ProgressBar,
+  Kr as RadioInput,
+  so as RangeCalendar,
+  po as RichTextInput,
+  Ot as Select,
+  Vt as Separator,
   pt as SimpleGrid,
-  Dr as SplitButton,
-  kt as Stack,
-  Nr as Switch,
-  Bo as Table,
-  jr as TagGroup,
+  Ir as SplitButton,
+  Rt as Stack,
+  jr as Switch,
+  Fo as Table,
+  qr as TagGroup,
   yt as Text,
-  At as TextInput,
-  Ir as TimeInput,
-  qr as ToggleButton,
-  zr as ToggleButtonGroup,
-  uo as Toolbar,
+  Mt as TextInput,
+  Lr as TimeInput,
+  zr as ToggleButton,
+  $r as ToggleButtonGroup,
+  co as Toolbar,
   gt as Tooltip,
-  Rt as VisuallyHidden,
-  zt as _AccordionContent,
-  Wt as _AccordionHeader,
-  $t as _AccordionHeaderRightContent,
-  Xt as _AccordionItem,
-  Jt as _AccordionRoot,
-  Zt as _AlertActions,
-  er as _AlertDescription,
-  tr as _AlertDismissButton,
-  rr as _AlertRoot,
-  or as _AlertTitle,
-  ur as _CardContent,
-  lr as _CardHeader,
-  cr as _CardRoot,
+  At as VisuallyHidden,
+  $t as _AccordionContent,
+  Xt as _AccordionHeader,
+  Jt as _AccordionHeaderRightContent,
+  Qt as _AccordionItem,
+  Yt as _AccordionRoot,
+  tr as _AlertActions,
+  rr as _AlertDescription,
+  or as _AlertDismissButton,
+  nr as _AlertRoot,
+  ar as _AlertTitle,
+  cr as _CardContent,
+  fr as _CardHeader,
+  dr as _CardRoot,
   Ue as _ComboBoxOption,
   je as _ComboBoxOptionGroup,
   Ge as _ComboBoxRoot,
-  mo as _DataTableBody,
-  yo as _DataTableCell,
-  vo as _DataTableColumn,
-  go as _DataTableExpandButton,
-  bo as _DataTableFooter,
-  xo as _DataTableHeader,
-  Co as _DataTableNestedIcon,
-  ho as _DataTableRoot,
-  _o as _DataTableRow,
-  wo as _DataTableSelectionCell,
-  To as _DataTableTable,
-  pr as _FormFieldDescription,
-  mr as _FormFieldError,
-  yr as _FormFieldInfoBox,
-  vr as _FormFieldInput,
-  gr as _FormFieldLabel,
-  br as _FormFieldRoot,
+  vo as _DataTableBody,
+  go as _DataTableCell,
+  bo as _DataTableColumn,
+  xo as _DataTableExpandButton,
+  Co as _DataTableFooter,
+  ho as _DataTableHeader,
+  _o as _DataTableNestedIcon,
+  wo as _DataTableRoot,
+  To as _DataTableRow,
+  So as _DataTableSelectionCell,
+  Eo as _DataTableTable,
+  yr as _FormFieldDescription,
+  vr as _FormFieldError,
+  gr as _FormFieldInfoBox,
+  br as _FormFieldInput,
+  xr as _FormFieldLabel,
+  Cr as _FormFieldRoot,
   lt as _ListIndicator,
   ct as _ListItem,
   ft as _ListRoot,
-  Ho as _MenuContent,
-  Ko as _MenuItem,
-  Oo as _MenuRoot,
-  No as _MenuSection,
-  Uo as _MenuSubmenu,
-  jo as _MenuSubmenuTrigger,
-  Go as _MenuTrigger,
-  Hr as _RadioInputOption,
-  Kr as _RadioInputRoot,
-  Kt as _SelectOption,
-  Ot as _SelectOptionGroup,
-  Nt as _SelectOptions,
-  Ut as _SelectRoot,
-  Wr as _ToggleButtonGroupButton,
-  $r as _ToggleButtonGroupRoot,
+  Oo as _MenuContent,
+  No as _MenuItem,
+  Uo as _MenuRoot,
+  jo as _MenuSection,
+  Go as _MenuSubmenu,
+  qo as _MenuSubmenuTrigger,
+  Vo as _MenuTrigger,
+  Or as _RadioInputOption,
+  Nr as _RadioInputRoot,
+  Nt as _SelectOption,
+  Ut as _SelectOptionGroup,
+  jt as _SelectOptions,
+  Gt as _SelectRoot,
+  Xr as _ToggleButtonGroupButton,
+  Jr as _ToggleButtonGroupRoot,
   bt as _TooltipContent,
   xt as _TooltipRoot,
-  Do as system,
+  Io as system,
   he as useColorMode,
   Re as useColorModeValue,
   De as useColorScheme,