@commercetools/nimbus 0.0.0-canary-20251015173928 → 0.0.0-canary-20251015182814

package/dist/drawer.d.ts

@@ -16,27 +16,39 @@ import { RecipeVariantProps } from '@chakra-ui/react';
 import { SlotRecipeDefinition } from '@chakra-ui/react';
 import { UnstyledProp } from '@chakra-ui/react';
 
-declare type ButtonProps = ButtonRootProps & FunctionalButtonProps & {
+declare type ButtonProps = Omit<ButtonRootSlotProps, keyof AriaButtonProps> & AriaButtonProps & {
+    /**
+     * Data attributes for testing or custom metadata
+     */
+    [key: `data-${string}`]: unknown;
+    /**
+     * Slot name for React Aria Components composition
+     */
     slot?: string | null | undefined;
+    /**
+     * Ref forwarding to the button element
+     */
     ref?: React.Ref<HTMLButtonElement>;
 };
 
-/**
- * Base recipe props interface that combines Chakra UI's recipe props
- * with the unstyled prop option for the button element.
- */
 declare type ButtonRecipeProps = {
+    /**
+     * Size variant of the button
+     * @default "md"
+     */
     size?: RecipeProps<"button">["size"];
+    /**
+     * Visual style variant of the button
+     * @default "subtle"
+     */
     variant?: RecipeProps<"button">["variant"];
+    /**
+     * Color tone palette for the button
+     */
     tone?: RecipeProps<"button">["tone"];
 } & UnstyledProp;
 
-/**
- * Root props interface that extends Chakra's HTML props with our recipe props.
- * This creates a complete set of props for the root element, combining
- * HTML attributes, Chakra's styling system, and our custom recipe props.
- */
-declare type ButtonRootProps = Omit<HTMLChakraProps_2<"button", ButtonRecipeProps>, "slot"> & {
+declare type ButtonRootSlotProps = Omit<HTMLChakraProps_2<"button", ButtonRecipeProps>, "slot"> & {
     slot?: string | null | undefined;
 };
 
@@ -267,7 +279,7 @@ export declare type DrawerBackdropSlotProps = HTMLChakraProps<"div">;
  *
  * The main body content section of the drawer.
  */
-export declare interface DrawerBodyProps extends DrawerBodySlotProps {
+export declare type DrawerBodyProps = DrawerBodySlotProps & {
     /**
      * The body content
      */
@@ -276,7 +288,7 @@ export declare interface DrawerBodyProps extends DrawerBodySlotProps {
      * The ref to the drawer body
      */
     ref?: React.Ref<HTMLDivElement>;
-}
+};
 
 export declare type DrawerBodySlotProps = HTMLChakraProps<"div">;
 
@@ -286,13 +298,13 @@ export declare type DrawerBodySlotProps = HTMLChakraProps<"div">;
  * A button that closes the drawer when activated.
  * Displays an IconButton with an X icon by default.
  */
-export declare interface DrawerCloseTriggerProps extends Omit<IconButtonProps, "aria-label"> {
+export declare type DrawerCloseTriggerProps = Omit<IconButtonProps, "aria-label"> & {
     /**
      * Accessible label for the close button
      * @default "Close drawer"
      */
     "aria-label"?: string;
-}
+};
 
 export declare type DrawerCloseTriggerSlotProps = HTMLChakraProps<"div">;
 
@@ -302,7 +314,7 @@ export declare type DrawerCloseTriggerSlotProps = HTMLChakraProps<"div">;
  * The main drawer content container that wraps the React Aria Dialog and Dialog.
  * Configuration (size, placement, etc.) is inherited from Drawer.Root via context.
  */
-export declare interface DrawerContentProps extends DrawerBackdropSlotProps {
+export declare type DrawerContentProps = DrawerBackdropSlotProps & {
     /**
      * The drawer content
      */
@@ -311,7 +323,7 @@ export declare interface DrawerContentProps extends DrawerBackdropSlotProps {
      * The ref to the drawer content
      */
     ref?: React.RefObject<HTMLDivElement>;
-}
+};
 
 export declare type DrawerContentSlotProps = HTMLChakraProps<"div">;
 
@@ -320,7 +332,7 @@ export declare type DrawerContentSlotProps = HTMLChakraProps<"div">;
  *
  * The footer section of the drawer, typically containing action buttons.
  */
-export declare interface DrawerFooterProps extends DrawerFooterSlotProps {
+export declare type DrawerFooterProps = DrawerFooterSlotProps & {
     /**
      * The footer content (usually buttons)
      */
@@ -329,7 +341,7 @@ export declare interface DrawerFooterProps extends DrawerFooterSlotProps {
      * The ref to the drawer footer
      */
     ref?: React.Ref<HTMLElement>;
-}
+};
 
 export declare type DrawerFooterSlotProps = HTMLChakraProps<"footer">;
 
@@ -338,7 +350,7 @@ export declare type DrawerFooterSlotProps = HTMLChakraProps<"footer">;
  *
  * The header section of the drawer content.
  */
-export declare interface DrawerHeaderProps extends DrawerHeaderSlotProps {
+export declare type DrawerHeaderProps = DrawerHeaderSlotProps & {
     /**
      * The header content
      */
@@ -347,7 +359,7 @@ export declare interface DrawerHeaderProps extends DrawerHeaderSlotProps {
      * The ref to the drawer header
      */
     ref?: React.Ref<HTMLElement>;
-}
+};
 
 export declare type DrawerHeaderSlotProps = HTMLChakraProps<"header">;
 
@@ -360,7 +372,7 @@ export declare type DrawerHeaderSlotProps = HTMLChakraProps<"header">;
  * This component handles configuration through recipe variants that are passed
  * down to child components via context.
  */
-export declare interface DrawerRootProps extends RecipeVariantProps<typeof drawerSlotRecipe> {
+export declare type DrawerRootProps = RecipeVariantProps<typeof drawerSlotRecipe> & {
     /**
      * The children components (Trigger, Content, etc.)
      */
@@ -406,7 +418,7 @@ export declare interface DrawerRootProps extends RecipeVariantProps<typeof drawe
      * a `slot`-property set to `title`.
      */
     "aria-label"?: string;
-}
+};
 
 export declare type DrawerRootSlotProps = HTMLChakraProps<"div">;
 
@@ -514,7 +526,7 @@ borderRadius: number;
  *
  * The accessible title element for the drawer.
  */
-export declare interface DrawerTitleProps extends DrawerTitleSlotProps {
+export declare type DrawerTitleProps = DrawerTitleSlotProps & {
     /**
      * The title text
      */
@@ -523,7 +535,7 @@ export declare interface DrawerTitleProps extends DrawerTitleSlotProps {
      * The ref to the drawer title
      */
     ref?: React.Ref<HTMLHeadingElement>;
-}
+};
 
 export declare type DrawerTitleSlotProps = HTMLChakraProps<"h2">;
 
@@ -532,7 +544,7 @@ export declare type DrawerTitleSlotProps = HTMLChakraProps<"h2">;
  *
  * The trigger element that opens the drawer when activated.
  */
-export declare interface DrawerTriggerProps extends DrawerTriggerSlotProps {
+export declare type DrawerTriggerProps = DrawerTriggerSlotProps & {
     /**
      * The trigger content
      */
@@ -551,21 +563,18 @@ export declare interface DrawerTriggerProps extends DrawerTriggerSlotProps {
      * The ref to the trigger html-button
      */
     ref?: React.RefObject<HTMLButtonElement>;
-}
+};
 
 export declare type DrawerTriggerSlotProps = HTMLChakraProps<"button">;
 
-/** combine chakra-button props with aria-button props */
-declare type FunctionalButtonProps = AriaButtonProps & Omit<ButtonRootProps, keyof AriaButtonProps | "slot"> & {
-    [key: `data-${string}`]: unknown;
-};
-
-/**
- * Main props interface for the IconButton component.
- */
 declare type IconButtonProps = ButtonProps & {
-    /** explains the intended action, required for accessibility */
+    /**
+     * Required accessible label explaining the intended action
+     */
     "aria-label": string;
+    /**
+     * Ref forwarding to the button element
+     */
     ref?: React.Ref<HTMLButtonElement>;
 };
 

package/dist/field-errors.d.ts

@@ -36,65 +36,80 @@ export declare const FieldErrors: {
     getCustomMessage: (key: string, customMessages?: FieldErrorsProps["customMessages"]) => React.ReactNode;
 };
 
-/**
- * Props for FieldErrors component
- */
-export declare type FieldErrorsProps = FieldErrorsRootProps & {
+export declare type FieldErrorsProps = FieldErrorsRootSlotProps & {
     /**
-     * ID of the error field for accessibility
+     * Unique identifier for the field errors
      */
     id?: string;
     /**
-     * Error object - only truthy values will be rendered
-     * Compatible with UI-Kit FieldErrors format
+     * Object mapping error types to boolean values indicating presence
      */
     errors?: TFieldErrors;
     /**
-     * Whether error messages should be visible
-     * @deprecated This prop will be automatically handled by the component
+     * Whether the error messages are visible
+     * @default false
      */
     isVisible?: boolean;
     /**
-     * Custom error renderer function
-     * Return null to fall back to renderDefaultError or built-in errors
+     * Custom render function for error messages
      */
     renderError?: TErrorRenderer;
     /**
-     * Default error renderer function for errors not handled by renderError
-     * Return null to fall back to built-in error handling
+     * Default render function for error messages when no custom renderer is provided
      */
     renderDefaultError?: TErrorRenderer;
     /**
-     * Custom error messages to override built-in ones
+     * Custom message overrides for specific error types
      */
     customMessages?: {
+        /** Message for missing field error */
         missing?: ReactNode;
+        /** Message for invalid field error */
         invalid?: ReactNode;
+        /** Message for empty field error */
         empty?: ReactNode;
+        /** Message for minimum length error */
         min?: ReactNode;
+        /** Message for maximum length error */
         max?: ReactNode;
+        /** Message for format error */
         format?: ReactNode;
+        /** Message for duplicate value error */
         duplicate?: ReactNode;
+        /** Message for negative value error */
         negative?: ReactNode;
+        /** Message for fractional value error */
         fractions?: ReactNode;
+        /** Message for below minimum value error */
         belowMin?: ReactNode;
+        /** Message for above maximum value error */
         aboveMax?: ReactNode;
+        /** Message for out of range error */
         outOfRange?: ReactNode;
+        /** Message for invalid from server error */
         invalidFromServer?: ReactNode;
+        /** Message for not found error */
         notFound?: ReactNode;
+        /** Message for blocked error */
         blocked?: ReactNode;
     };
 };
 
-declare type FieldErrorsRootProps = HTMLChakraProps<"div"> & {
+declare type FieldErrorsRootSlotProps = HTMLChakraProps<"div"> & {
+    /**
+     * Unique identifier for the field errors container
+     */
     id?: string;
+    /**
+     * ARIA role for the container
+     */
     role?: string;
+    /**
+     * Error message content to display
+     */
     children?: ReactNode;
 };
 
-/**
- * Built-in error types that FieldErrors can handle automatically
- */
 export declare const FieldErrorTypes: {
     readonly MISSING: "missing";
     readonly INVALID: "invalid";
@@ -113,15 +128,8 @@ export declare const FieldErrorTypes: {
     readonly BLOCKED: "blocked";
 };
 
-/**
- * Function to render custom error messages
- */
 export declare type TErrorRenderer = (key: string, error?: boolean) => ReactNode;
 
-/**
- * Error object type - compatible with UI-Kit FieldErrors
- * Only entries with truthy values will be rendered as errors
- */
 export declare type TFieldErrors = Record<string, boolean>;
 
 export { }

package/dist/form-field.d.ts

@@ -47,31 +47,51 @@ export declare type FormFieldLabelSlotProps = HTMLChakraProps<"div">;
 
 export declare type FormFieldPopoverSlotProps = HTMLChakraProps<"div">;
 
-/**
- * Main props interface for the FormField component.
- * Extends FormFieldVariantProps to include both root props and variant props,
- * while adding support for React children.
- */
 export declare type FormFieldProps = FormFieldRootSlotProps & {
+    /**
+     * Form field content (label, input, description, error)
+     */
     children?: React.ReactNode;
-    /** true if the field is a required field */
+    /**
+     * Whether the field is required for form submission
+     * @default false
+     */
     isRequired?: boolean;
-    /** true if the field is invalid */
+    /**
+     * Whether the field has a validation error
+     * @default false
+     */
     isInvalid?: boolean;
-    /** true if the field is disabled */
+    /**
+     * Whether the field is disabled
+     * @default false
+     */
     isDisabled?: boolean;
-    /** true, if the field is read only  */
+    /**
+     * Whether the field is read-only
+     * @default false
+     */
     isReadOnly?: boolean;
-    /** id passed to the field's input component*/
+    /**
+     * Unique identifier for the input element
+     */
     id?: string;
     /**
-     * React ref to be forwarded to the root element
+     * Ref forwarding to the root element
      */
     ref?: React.Ref<HTMLDivElement>;
 };
 
-export declare type FormFieldRecipeProps = {
+declare type FormFieldRecipeProps = {
+    /**
+     * Size variant of the form field
+     * @default "md"
+     */
     size?: SlotRecipeProps<"formField">["size"];
+    /**
+     * Layout direction for label and input positioning
+     * @default "column"
+     */
     direction?: SlotRecipeProps<"formField">["direction"];
 };
 

package/dist/group.d.ts

@@ -10,25 +10,21 @@ declare type DefaultExcludedProps = "css" | "asChild" | "as" | "colorScheme";
 
 export declare const Group: GroupComponent;
 
-/** Type signature for the main `Group` component. */
+/**
+ * Type signature for the main Group component.
+ */
 export declare type GroupComponent = FC<GroupProps>;
 
-export declare interface GroupProps extends Omit<GroupSlotProps, DefaultExcludedProps>, Pick<GroupProps_2, "isDisabled" | "isInvalid" | "onHoverChange" | "onHoverStart" | "onHoverEnd"> {
+export declare interface GroupProps extends Omit<GroupRootSlotProps, DefaultExcludedProps>, Pick<GroupProps_2, "isDisabled" | "isInvalid" | "onHoverChange" | "onHoverStart" | "onHoverEnd"> {
+    /**
+     * Ref forwarding to the root element
+     */
     ref?: Ref<typeof Group_2>;
 }
 
-/**
- * Base recipe props interface that combines Chakra UI's recipe props
- * with the unstyled prop option for the div element.
- */
 declare type GroupRecipeProps = RecipeProps<"group"> & UnstyledProp;
 
-/**
- * Root props interface that extends Chakra's HTML props with our recipe props.
- * This creates a complete set of props for the root element, combining
- * HTML attributes, Chakra's styling system, and our custom recipe props.
- */
-export declare type GroupSlotProps = HTMLChakraProps<"div", GroupRecipeProps>;
+export declare type GroupRootSlotProps = HTMLChakraProps<"div", GroupRecipeProps>;
 
 export { }
 

package/dist/icon-button.d.ts

@@ -4,35 +4,42 @@ import { JSX } from 'react/jsx-runtime';
 import { RecipeProps } from '@chakra-ui/react';
 import { UnstyledProp } from '@chakra-ui/react';
 
-declare type ButtonProps = ButtonRootProps & FunctionalButtonProps & {
+declare type ButtonProps = Omit<ButtonRootSlotProps, keyof AriaButtonProps> & AriaButtonProps & {
+    /**
+     * Data attributes for testing or custom metadata
+     */
+    [key: `data-${string}`]: unknown;
+    /**
+     * Slot name for React Aria Components composition
+     */
     slot?: string | null | undefined;
+    /**
+     * Ref forwarding to the button element
+     */
     ref?: React.Ref<HTMLButtonElement>;
 };
 
-/**
- * Base recipe props interface that combines Chakra UI's recipe props
- * with the unstyled prop option for the button element.
- */
 declare type ButtonRecipeProps = {
+    /**
+     * Size variant of the button
+     * @default "md"
+     */
     size?: RecipeProps<"button">["size"];
+    /**
+     * Visual style variant of the button
+     * @default "subtle"
+     */
     variant?: RecipeProps<"button">["variant"];
+    /**
+     * Color tone palette for the button
+     */
     tone?: RecipeProps<"button">["tone"];
 } & UnstyledProp;
 
-/**
- * Root props interface that extends Chakra's HTML props with our recipe props.
- * This creates a complete set of props for the root element, combining
- * HTML attributes, Chakra's styling system, and our custom recipe props.
- */
-declare type ButtonRootProps = Omit<HTMLChakraProps<"button", ButtonRecipeProps>, "slot"> & {
+declare type ButtonRootSlotProps = Omit<HTMLChakraProps<"button", ButtonRecipeProps>, "slot"> & {
     slot?: string | null | undefined;
 };
 
-/** combine chakra-button props with aria-button props */
-declare type FunctionalButtonProps = AriaButtonProps & Omit<ButtonRootProps, keyof AriaButtonProps | "slot"> & {
-    [key: `data-${string}`]: unknown;
-};
-
 /**
  * # IconButton
  *
@@ -45,12 +52,14 @@ export declare const IconButton: {
     displayName: string;
 };
 
-/**
- * Main props interface for the IconButton component.
- */
 export declare type IconButtonProps = ButtonProps & {
-    /** explains the intended action, required for accessibility */
+    /**
+     * Required accessible label explaining the intended action
+     */
     "aria-label": string;
+    /**
+     * Ref forwarding to the button element
+     */
     ref?: React.Ref<HTMLButtonElement>;
 };
 

package/dist/icon-toggle-button.d.ts

@@ -3,10 +3,6 @@ import { JSX } from 'react/jsx-runtime';
 import { RecipeProps } from '@chakra-ui/react';
 import { ToggleButtonProps as ToggleButtonProps_2 } from 'react-aria-components';
 
-/**
- * Additional properties we want to exclude from the ToggleButton component.
- * These are chakra-ui props we don't want exposed for non-polymorphic components.
- */
 declare type ExcludedProps = "css" | "colorScheme" | "recipe" | "as" | "asChild";
 
 /**
@@ -22,33 +18,42 @@ export declare const IconToggleButton: {
 };
 
 export declare type IconToggleButtonProps = Omit<ToggleButtonProps, "aria-label"> & {
-    /** explains the intended action, required for accessibility */
+    /**
+     * Required accessible label for the icon button
+     */
     "aria-label": string;
+    /**
+     * Ref forwarding to the button element
+     */
     ref?: React.Ref<HTMLButtonElement>;
 };
 
-declare type ToggleButtonProps = Omit<ToggleButtonRootProps, keyof ToggleButtonProps_2 | ExcludedProps> & ToggleButtonProps_2 & {
+declare type ToggleButtonProps = Omit<ToggleButtonRootSlotProps, keyof ToggleButtonProps_2 | ExcludedProps> & ToggleButtonProps_2 & {
     /**
-     * Ref to the underlying button element
+     * Ref forwarding to the button element
      */
     ref?: React.Ref<HTMLButtonElement>;
 };
 
-/**
- * Base recipe props interface.
- */
 declare type ToggleButtonRecipeProps = {
+    /**
+     * Size variant of the toggle button
+     * @default "md"
+     */
     size?: RecipeProps<"toggleButton">["size"];
+    /**
+     * Visual style variant of the toggle button
+     * @default "outline"
+     */
     variant?: RecipeProps<"toggleButton">["variant"];
+    /**
+     * Color tone palette for the toggle button
+     * @default "primary"
+     */
     tone?: RecipeProps<"toggleButton">["tone"];
 };
 
-/**
- * Root props interface that extends Chakra's HTML props with our recipe props.
- * This creates a complete set of props for the root element, combining
- * HTML attributes, Chakra's styling system, and our custom recipe props.
- */
-declare type ToggleButtonRootProps = HTMLChakraProps<"button", ToggleButtonRecipeProps>;
+declare type ToggleButtonRootSlotProps = HTMLChakraProps<"button", ToggleButtonRecipeProps>;
 
 export { }
 

package/dist/icon.d.ts

@@ -15,11 +15,6 @@ export declare const Icon: {
     displayName: string;
 };
 
-/**
- * Main props interface for the Icon component.
- * Extends IconVariantProps to include both root props and variant props,
- * while adding support for React children.
- */
 export declare type IconProps = IconVariantProps & {
     /**
      * Accepts only a single child - an icon-component or SVG html-element.
@@ -45,24 +40,10 @@ export declare type IconProps = IconVariantProps & {
     slot?: string | null | undefined;
 };
 
-/**
- * Base recipe props interface that combines Chakra UI's recipe props
- * with the unstyled prop option for the svg element.
- */
 declare type IconRecipeProps = RecipeProps<"icon"> & UnstyledProp;
 
-/**
- * Root props interface that extends Chakra's HTML props with our recipe props.
- * This creates a complete set of props for the root element, combining
- * HTML attributes, Chakra's styling system, and our custom recipe props.
- */
 export declare type IconRootSlotProps = HTMLChakraProps<"svg", IconRecipeProps>;
 
-/**
- * Combines the root props with Chakra UI's recipe variant props.
- * This allows the component to accept both structural props from Root
- * and styling variants from the recipe.
- */
 declare type IconVariantProps = Omit<IconRootSlotProps, keyof React.SVGProps<SVGSVGElement> | "css" | "unstyled" | "asChild" | "recipe">;
 
 export { }

package/dist/index.d.ts

@@ -7,27 +7,39 @@ import { SlotRecipeProps } from '@chakra-ui/react';
 import { SystemContext } from '@chakra-ui/react';
 import { UnstyledProp } from '@chakra-ui/react';
 
-declare type ButtonProps = ButtonRootProps & FunctionalButtonProps & {
+declare type ButtonProps = Omit<ButtonRootSlotProps, keyof AriaButtonProps> & AriaButtonProps & {
+    /**
+     * Data attributes for testing or custom metadata
+     */
+    [key: `data-${string}`]: unknown;
+    /**
+     * Slot name for React Aria Components composition
+     */
     slot?: string | null | undefined;
+    /**
+     * Ref forwarding to the button element
+     */
     ref?: React.Ref<HTMLButtonElement>;
 };
 
-/**
- * Base recipe props interface that combines Chakra UI's recipe props
- * with the unstyled prop option for the button element.
- */
 declare type ButtonRecipeProps = {
+    /**
+     * Size variant of the button
+     * @default "md"
+     */
     size?: RecipeProps<"button">["size"];
+    /**
+     * Visual style variant of the button
+     * @default "subtle"
+     */
     variant?: RecipeProps<"button">["variant"];
+    /**
+     * Color tone palette for the button
+     */
     tone?: RecipeProps<"button">["tone"];
 } & UnstyledProp;
 
-/**
- * Root props interface that extends Chakra's HTML props with our recipe props.
- * This creates a complete set of props for the root element, combining
- * HTML attributes, Chakra's styling system, and our custom recipe props.
- */
-declare type ButtonRootProps = Omit<HTMLChakraProps<"button", ButtonRecipeProps>, "slot"> & {
+declare type ButtonRootSlotProps = Omit<HTMLChakraProps<"button", ButtonRecipeProps>, "slot"> & {
     slot?: string | null | undefined;
 };
 
@@ -144,7 +156,9 @@ declare type DialogHeaderSlotProps = HTMLChakraProps<"header">;
 declare type DialogModalOverlaySlotProps = HTMLChakraProps<"div">;
 
 declare type DialogRecipeProps = {
+    /** Placement of the dialog in the viewport */
     placement?: SlotRecipeProps<"dialog">["placement"];
+    /** How scrolling behavior is handled when content overflows */
     scrollBehavior?: SlotRecipeProps<"dialog">["scrollBehavior"];
 };
 
@@ -263,17 +277,14 @@ declare type DialogTriggerProps = DialogTriggerSlotProps & {
 
 declare type DialogTriggerSlotProps = HTMLChakraProps<"button">;
 
-/** combine chakra-button props with aria-button props */
-declare type FunctionalButtonProps = AriaButtonProps & Omit<ButtonRootProps, keyof AriaButtonProps | "slot"> & {
-    [key: `data-${string}`]: unknown;
-};
-
-/**
- * Main props interface for the IconButton component.
- */
 declare type IconButtonProps = ButtonProps & {
-    /** explains the intended action, required for accessibility */
+    /**
+     * Required accessible label explaining the intended action
+     */
     "aria-label": string;
+    /**
+     * Ref forwarding to the button element
+     */
     ref?: React.Ref<HTMLButtonElement>;
 };