@commercetools/nimbus 0.0.0-canary-20251010180202 → 0.0.0-canary-20251013204307

package/dist/progress-bar.d.ts

@@ -1,10 +1,8 @@
 import { AriaProgressBarProps } from 'react-aria';
-import { HTMLChakraProps } from '@chakra-ui/react/styled-system';
+import { HTMLChakraProps } from '@chakra-ui/react';
 import { JSX } from 'react/jsx-runtime';
-import { RecipeProps } from '@chakra-ui/react/styled-system';
-import { RecipeVariantProps } from '@chakra-ui/react/styled-system';
-import { SlotRecipeDefinition } from '@chakra-ui/react';
-import { UnstyledProp } from '@chakra-ui/react/styled-system';
+import { SlotRecipeProps } from '@chakra-ui/react';
+import { UnstyledProp } from '@chakra-ui/react';
 
 /**
  * Additional properties we want to exclude from the ProgressBar component.
@@ -34,138 +32,58 @@ export declare const ProgressBar: {
     displayName: string;
 };
 
+export declare type ProgressBarFillSlotProps = HTMLChakraProps<"div">;
+
+export declare type ProgressBarLabelSlotProps = HTMLChakraProps<"span">;
+
 /**
  * Main props interface for the ProgressBar component.
  * Extends ProgressBarRootProps to include root props, variant props, and aria props,
  * while adding custom props for label display and formatting.
  */
-export declare interface ProgressBarProps extends Omit<ProgressBarRootProps, ExcludedProps> {
+export declare type ProgressBarProps = Omit<ProgressBarRootProps, ExcludedProps> & {
     /**
      * Ref forwarding to the root element
      */
     ref?: React.Ref<HTMLDivElement>;
-    /**
-     * Whether the progress bar represents an active, ongoing process.
-     * Set to `true` for dynamic progress (e.g., file uploads, downloads).
-     * Set to `false` for static progress indicators (e.g., step 3 of 5 in a wizard).
-     * @default true
-     */
-    isDynamic?: boolean;
     /**
      * Format options for the progress bar.
      * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat
      * @default { style: "percent" }
      */
     formatOptions?: ProgressBarRootProps["formatOptions"];
-}
+};
 
 /**
- * Base recipe props interface that combines Chakra UI's recipe props
+ * Base recipe props type that combines Chakra UI's recipe props
  * with the unstyled prop option for the div element.
  */
-declare interface ProgressBarRecipeProps extends RecipeProps<"div">, UnstyledProp {
-}
+export declare type ProgressBarRecipeProps = {
+    size?: SlotRecipeProps<"progressBar">["size"];
+    /**
+     * Whether the progress bar represents an active, ongoing process.
+     * Set to `true` for dynamic progress (e.g., file uploads, downloads).
+     * Set to `false` for static progress indicators (e.g., step 3 of 5 in a wizard).
+     * @default true
+     */
+    isDynamic?: SlotRecipeProps<"progressBar">["isDynamic"];
+    isIndeterminate?: SlotRecipeProps<"progressBar">["isIndeterminate"];
+    variant?: SlotRecipeProps<"progressBar">["variant"];
+    layout?: SlotRecipeProps<"progressBar">["layout"];
+} & UnstyledProp;
 
 /**
- * Root props interface that extends Chakra's HTML props with our recipe props,
+ * Root props type that extends Chakra's HTML props with our recipe props,
  * aria props, and data attributes.
  */
-declare interface ProgressBarRootProps extends Omit<HTMLChakraProps<"div", ProgressBarRecipeProps>, "translate">, Omit<RecipeVariantProps<typeof progressBarSlotRecipe>, "isIndeterminate">, AriaProgressBarProps {
+export declare type ProgressBarRootProps = Omit<HTMLChakraProps<"div", ProgressBarRecipeProps>, "translate"> & Omit<ProgressBarRecipeProps, "isIndeterminate"> & AriaProgressBarProps & {
     [key: `data-${string}`]: string;
     translate?: "yes" | "no";
-}
-
-/**
- * Recipe configuration for the ProgressBar component.
- * Defines the styling variants and base styles using Chakra UI's slot recipe system.
- */
-declare const progressBarSlotRecipe: SlotRecipeDefinition<"fill" | "label" | "track" | "root" | "value", {
-size: {
-"2xs": {
-root: {
-"--progress-bar-radius": "{radii.300}";
-"--progress-bar-font-size": "{fontSizes.350}";
-"--progress-bar-height": "{sizes.300}";
-"--progress-bar-line-height": "{fontSizes.500}";
-};
-};
-md: {
-root: {
-"--progress-bar-radius": "{radii.600}";
-"--progress-bar-font-size": "{fontSizes.400}";
-"--progress-bar-height": "{sizes.600}";
-"--progress-bar-line-height": "{fontSizes.600}";
-};
-};
-};
-isDynamic: {
-true: {
-fill: {
-"--progress-bar-animation": "gradient-shimmer 4s ease-in-out infinite";
-"&[data-complete='true']": {
-"--progress-bar-animation": "none";
-};
 };
-};
-};
-isIndeterminate: {
-true: {
-fill: {
-"--progress-bar-animation": "progress-indeterminate 2s ease-in-out infinite";
-width: "40% !important";
-};
-};
-};
-variant: {
-solid: {
-root: {
-"--progress-bar-text-color": "{colors.neutral.12}";
-"--progress-bar-track-bg": "{colors.neutralAlpha.3}";
-};
-};
-contrast: {
-root: {
-"--progress-bar-text-color": "{colors.colorPalette.contrast}";
-"--progress-bar-track-bg": "{colors.colorPalette.contrast/15}";
-};
-fill: {
-bgImage: "linear-gradient(90deg, {colors.colorPalette.contrast/25}, {colors.colorPalette.contrast}, {colors.colorPalette.contrast/25})";
-};
-};
-};
-layout: {
-minimal: {
-label: {
-display: "none";
-};
-value: {
-display: "none";
-};
-};
-inline: {
-root: {
-flexDirection: "row";
-alignItems: "center";
-gap: "400";
-};
-track: {
-flex: number;
-};
-};
-stacked: {
-root: {
-flexDirection: "column";
-gap: "200";
-};
-text: {
-display: "flex";
-justifyContent: "space-between";
-alignItems: "center";
-width: "100%";
-};
-};
-};
-}>;
+
+export declare type ProgressBarTrackSlotProps = HTMLChakraProps<"div">;
+
+export declare type ProgressBarValueSlotProps = HTMLChakraProps<"span">;
 
 export { }
 

package/dist/radio-input.d.ts

@@ -1,14 +1,12 @@
-import { HTMLChakraProps } from '@chakra-ui/react/styled-system';
+import { HTMLChakraProps } from '@chakra-ui/react';
 import { JSX } from 'react/jsx-runtime';
 import { RadioGroupProps as RadioGroupProps_2 } from 'react-aria-components';
 import { RadioInputOptionProps as RadioInputOptionProps_2 } from './radio-input.types';
 import { RadioInputRootProps as RadioInputRootProps_2 } from './radio-input.types';
 import { RadioProps } from 'react-aria-components';
-import { RecipeProps } from '@chakra-ui/react/styled-system';
-import { RecipeVariantProps } from '@chakra-ui/react/styled-system';
-import { SlotRecipeDefinition } from '@chakra-ui/react';
+import { RecipeProps } from '@chakra-ui/react';
 
-declare type RadioGroupProps = Omit<RadioGroupProps_2, "children"> & {
+declare type RadioGroupProps = Omit<RadioGroupProps_2, "children" | "orientation"> & {
     children?: React.ReactNode;
 };
 
@@ -28,11 +26,13 @@ export declare const _RadioInputOption: {
     displayName: string;
 };
 
-export declare interface RadioInputOptionProps extends RadioProps, Omit<RadioInputOptionSlotProps, keyof RadioProps> {
-}
+export declare type RadioInputOptionProps = RadioProps & Omit<RadioInputOptionSlotProps, keyof RadioProps>;
 
-export declare interface RadioInputOptionSlotProps extends HTMLChakraProps<"span", RecipeProps<"option">> {
-}
+export declare type RadioInputOptionSlotProps = HTMLChakraProps<"span", RecipeProps<"option">>;
+
+declare type RadioInputRecipeProps = {
+    orientation?: RecipeProps<"radioInput">["orientation"];
+};
 
 /**
  * # RadioInput
@@ -46,33 +46,9 @@ export declare const _RadioInputRoot: {
     displayName: string;
 };
 
-export declare interface RadioInputRootProps extends RadioGroupProps, Omit<RadioInputRootSlotProps, keyof RadioGroupProps> {
-}
-
-export declare interface RadioInputRootSlotProps extends HTMLChakraProps<"div", RecipeVariantProps<typeof radioInputSlotRecipe>> {
-}
+export declare type RadioInputRootProps = Omit<RadioInputRootSlotProps, keyof RadioGroupProps> & RadioGroupProps;
 
-/**
- * Recipe configuration for the RadioInput component.
- * Defines the styling variants and base styles using Chakra UI's recipe system.
- */
-declare const radioInputSlotRecipe: SlotRecipeDefinition<"option" | "root", {
-orientation: {
-horizontal: {
-root: {
-flexDirection: "row";
-gap: "600";
-};
-};
-vertical: {
-root: {
-flexDirection: "column";
-alignItems: "flex-start";
-gap: "400";
-};
-};
-};
-}>;
+export declare type RadioInputRootSlotProps = HTMLChakraProps<"div", RadioInputRecipeProps>;
 
 export { }
 

package/dist/range-calendar.d.ts

@@ -1,10 +1,8 @@
 import { DateValue } from '@internationalized/date';
-import { HTMLChakraProps } from '@chakra-ui/react/styled-system';
+import { HTMLChakraProps } from '@chakra-ui/react';
 import { JSX } from 'react/jsx-runtime';
 import { RangeCalendarProps as RangeCalendarProps_2 } from 'react-aria-components';
-import { RecipeVariantProps } from '@chakra-ui/react/styled-system';
-import { SlotRecipeDefinition } from '@chakra-ui/react';
-import { SlotRecipeVariantRecord } from '@chakra-ui/react';
+import { SlotRecipeProps } from '@chakra-ui/react';
 
 /**
  * Additional properties we want to exclude from the RangeCalendar component.
@@ -14,13 +12,27 @@ declare type ExcludedProps = "as" | "style" | "createCalendar";
 
 export declare const RangeCalendar: (props: RangeCalendarProps<DateValue>) => JSX.Element;
 
-export declare interface RangeCalendarProps<T extends DateValue> extends Omit<RangeCalendarRootSlotProps, keyof RangeCalendarProps_2<DateValue> | ExcludedProps>, Omit<RangeCalendarProps_2<T>, ExcludedProps>, RecipeVariantProps<typeof rangeCalendarSlotRecipe> {
-}
+export declare type RangeCalendarCellSlotProps = HTMLChakraProps<"td">;
 
-declare interface RangeCalendarRootSlotProps extends HTMLChakraProps<"div", RecipeVariantProps<typeof rangeCalendarSlotRecipe> & RangeCalendarProps_2<DateValue>> {
-}
+export declare type RangeCalendarGridBodySlotProps = HTMLChakraProps<"tbody">;
 
-declare const rangeCalendarSlotRecipe: SlotRecipeDefinition<"header" | "grid" | "root" | "grids" | "monthTitle" | "gridHeader" | "headerCell" | "gridBody" | "bodyCell", SlotRecipeVariantRecord<"header" | "grid" | "root" | "grids" | "monthTitle" | "gridHeader" | "headerCell" | "gridBody" | "bodyCell">>;
+export declare type RangeCalendarGridHeaderSlotProps = HTMLChakraProps<"thead">;
+
+export declare type RangeCalendarGridSlotProps = HTMLChakraProps<"table">;
+
+export declare type RangeCalendarGridsSlotProps = HTMLChakraProps<"div">;
+
+export declare type RangeCalendarHeaderCellSlotProps = HTMLChakraProps<"th">;
+
+export declare type RangeCalendarHeaderSlotProps = HTMLChakraProps<"div">;
+
+export declare type RangeCalendarMonthTitleSlotProps = HTMLChakraProps<"div">;
+
+export declare type RangeCalendarProps<T extends DateValue> = Omit<RangeCalendarRootSlotProps, keyof RangeCalendarProps_2<DateValue> | ExcludedProps> & Omit<RangeCalendarProps_2<T>, ExcludedProps> & SlotRecipeProps<"rangeCalendar">;
+
+declare type RangeCalendarRecipeProps = SlotRecipeProps<"rangeCalendar">;
+
+export declare type RangeCalendarRootSlotProps = HTMLChakraProps<"div", RangeCalendarRecipeProps & RangeCalendarProps_2<DateValue>>;
 
 /**
  * Range value type for date ranges

package/dist/rich-text-input.d.ts

@@ -1,9 +1,8 @@
 import { FocusEventHandler } from 'react';
 import { HTMLChakraProps } from '@chakra-ui/react';
 import { JSX } from 'react/jsx-runtime';
-import { RecipeVariantProps } from '@chakra-ui/react';
 import { Ref } from 'react';
-import { SlotRecipeDefinition } from '@chakra-ui/react';
+import { SlotRecipeProps } from '@chakra-ui/react';
 import { UnstyledProp } from '@chakra-ui/react';
 
 declare type DefaultExcludedProps = "css" | "asChild" | "as" | "onChange";
@@ -16,7 +15,9 @@ export declare const RichTextInput: {
     displayName: string;
 };
 
-export declare interface RichTextInputProps extends Omit<RichTextInputRootSlotProps, DefaultExcludedProps | "children"> {
+export declare type RichTextInputEditableSlotProps = HTMLChakraProps<"div">;
+
+export declare type RichTextInputProps = Omit<RichTextInputRootSlotProps, DefaultExcludedProps | "children"> & {
     /**
      * The ref for the rich text input component
      */
@@ -61,11 +62,13 @@ export declare interface RichTextInputProps extends Omit<RichTextInputRootSlotPr
      * Whether to focus the input when it mounts
      */
     autoFocus?: boolean;
-}
+};
+
+declare type RichTextInputRecipeProps = SlotRecipeProps<"richTextInput">;
 
-declare const richTextInputRecipe: SlotRecipeDefinition<"root" | "toolbar" | "editable", {}>;
+export declare type RichTextInputRootSlotProps = HTMLChakraProps<"div", RichTextInputRecipeProps & UnstyledProp>;
 
-declare type RichTextInputRootSlotProps = HTMLChakraProps<"div", RecipeVariantProps<typeof richTextInputRecipe> & UnstyledProp>;
+export declare type RichTextInputToolbarSlotProps = HTMLChakraProps<"div">;
 
 export { }
 

package/dist/scoped-search-input.d.ts

@@ -1,8 +1,7 @@
-import { HTMLChakraProps } from '@chakra-ui/react/styled-system';
+import { HTMLChakraProps } from '@chakra-ui/react';
 import { JSX } from 'react/jsx-runtime';
-import { RecipeVariantProps } from '@chakra-ui/react/styled-system';
 import { ScopedSearchInputValue as ScopedSearchInputValue_2 } from './scoped-search-input.types';
-import { SlotRecipeDefinition } from '@chakra-ui/react';
+import { SlotRecipeProps } from '@chakra-ui/react';
 
 export declare const ScopedSearchInput: {
     (props: ScopedSearchInputProps): JSX.Element;
@@ -13,7 +12,7 @@ export declare const ScopedSearchInput: {
 /**
  * Option definition for the select dropdown
  */
-export declare interface ScopedSearchInputOption {
+export declare type ScopedSearchInputOption = {
     /**
      * Display label for the option
      */
@@ -26,12 +25,12 @@ export declare interface ScopedSearchInputOption {
      * Whether the option is disabled
      */
     isDisabled?: boolean;
-}
+};
 
 /**
  * Option group definition for grouped options
  */
-export declare interface ScopedSearchInputOptionGroup {
+export declare type ScopedSearchInputOptionGroup = {
     /**
      * Group label
      */
@@ -40,9 +39,9 @@ export declare interface ScopedSearchInputOptionGroup {
      * Options in this group
      */
     options: ScopedSearchInputOption[];
-}
+};
 
-export declare interface ScopedSearchInputProps extends Omit<ScopedSearchInputRootSlotProps, "value" | "onSubmit" | "as" | "asChild"> {
+export declare type ScopedSearchInputProps = Omit<ScopedSearchInputRootSlotProps, "value" | "onSubmit" | "as" | "asChild"> & {
     /**
      * The current value (controlled)
      */
@@ -124,22 +123,18 @@ export declare interface ScopedSearchInputProps extends Omit<ScopedSearchInputRo
      * ID of element labeling the component
      */
     "aria-labelledby"?: string;
-}
-
-declare interface ScopedSearchInputRootSlotProps extends HTMLChakraProps<"div", RecipeVariantProps<typeof scopedSearchInputSlotRecipe>> {
-}
+};
 
-declare const scopedSearchInputSlotRecipe: SlotRecipeDefinition<"container" | "root" | "selectWrapper" | "searchWrapper", {
-size: {
-sm: {};
-md: {};
+declare type ScopedSearchInputRecipeProps = {
+    size?: SlotRecipeProps<"scopedSearchInput">["size"];
 };
-}>;
+
+declare type ScopedSearchInputRootSlotProps = HTMLChakraProps<"div", ScopedSearchInputRecipeProps>;
 
 /**
  * Value structure for ScopedSearchInput
  */
-export declare interface ScopedSearchInputValue {
+export declare type ScopedSearchInputValue = {
     /**
      * The text in the search input
      */
@@ -148,7 +143,7 @@ export declare interface ScopedSearchInputValue {
      * The selected option key from the select dropdown
      */
     option: string;
-}
+};
 
 export { }
 

package/dist/search-input.d.ts

@@ -1,8 +1,7 @@
-import { HTMLChakraProps } from '@chakra-ui/react/styled-system';
+import { HTMLChakraProps } from '@chakra-ui/react';
 import { JSX } from 'react/jsx-runtime';
-import { RecipeVariantProps } from '@chakra-ui/react/styled-system';
 import { SearchFieldProps } from 'react-aria-components';
-import { SlotRecipeDefinition } from '@chakra-ui/react';
+import { SlotRecipeProps } from '@chakra-ui/react';
 
 /**
  * # SearchInput
@@ -15,11 +14,15 @@ export declare const SearchInput: {
     displayName: string;
 };
 
+export declare type SearchInputInputProps = HTMLChakraProps<"input">;
+
+export declare type SearchInputLeadingElementProps = HTMLChakraProps<"div">;
+
 /**
  * Props for the SearchInput component.
  * Built on React Aria's SearchField for accessibility.
  */
-export declare interface SearchInputProps extends Omit<SearchFieldProps, "ref">, Omit<SearchInputRootProps, keyof SearchFieldProps | "as" | "asChild"> {
+export declare type SearchInputProps = Omit<SearchInputRootProps, keyof SearchFieldProps | "as" | "asChild"> & Omit<SearchFieldProps, "ref"> & {
     /**
      * React ref to be forwarded to the input element
      */
@@ -28,55 +31,14 @@ export declare interface SearchInputProps extends Omit<SearchFieldProps, "ref">,
      * Placeholder text for the input
      */
     placeholder?: string;
-}
-
-declare interface SearchInputRootProps extends HTMLChakraProps<"div", RecipeVariantProps<typeof searchInputSlotRecipe>> {
-}
-
-/**
- * Recipe configuration for the SearchInput component.
- * Defines the styling variants and base styles using Chakra UI's slot recipe system.
- */
-declare const searchInputSlotRecipe: SlotRecipeDefinition<"input" | "root" | "leadingElement", {
-size: {
-sm: {
-root: {
-height: "800";
-px: "300";
-gap: "100";
-textStyle: "sm";
-};
-leadingElement: {
-"& > svg": {
-boxSize: "400";
-};
-};
 };
-md: {
-root: {
-height: "1000";
-px: "400";
-gap: "200";
-textStyle: "md";
-};
-leadingElement: {
-"& > svg": {
-boxSize: "500";
-};
-};
-};
-};
-variant: {
-solid: {
-root: {
-"--border-width": "sizes.25";
-"--border-color": "colors.neutral.7";
-backgroundColor: "primary.1";
-};
-};
-ghost: {};
+
+declare type SearchInputRecipeProps = {
+    size?: SlotRecipeProps<"searchInput">["size"];
+    variant?: SlotRecipeProps<"searchInput">["variant"];
 };
-}>;
+
+export declare type SearchInputRootProps = HTMLChakraProps<"div", SearchInputRecipeProps>;
 
 export { }