@commercetools/nimbus 0.0.0-canary-20251013071647 → 0.0.0-canary-20251014065943

package/dist/date-input.d.ts

@@ -1,11 +1,9 @@
 import { DateFieldProps } from 'react-aria-components';
 import { DateValue } 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';
 
 /**
  * # DateInput
@@ -27,7 +25,7 @@ export declare const DateInput: {
  * 2. Merge with DateInputRootProps, excluding conflicting keys
  * 3. Add recipe variant props
  */
-export declare interface DateInputProps extends DateFieldProps<DateValue>, Omit<DateInputRootProps, keyof DateFieldProps<DateValue> | ExcludedProps>, RecipeVariantProps<typeof dateInputSlotRecipe> {
+export declare type DateInputProps = DateInputRootProps & DateFieldProps<DateValue> & Omit<DateInputRootProps, keyof DateFieldProps<DateValue> | ExcludedProps> & {
     /**
      * Optional element to display at the start of the input
      * Will respect text direction (left in LTR, right in RTL)
@@ -38,94 +36,27 @@ export declare interface DateInputProps extends DateFieldProps<DateValue>, Omit<
      * Will respect text direction (right in LTR, left in RTL)
      */
     trailingElement?: React.ReactNode;
-}
+};
 
 /**
  * Base recipe props interface that combines Chakra UI's recipe props
  * with the unstyled prop option for the div element.
  */
-declare interface DateInputRecipeProps extends RecipeProps<"div">, UnstyledProp {
-}
+declare type DateInputRecipeProps = {
+    size?: SlotRecipeProps<"dateInput">["size"];
+    variant?: SlotRecipeProps<"dateInput">["variant"];
+} & 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.
+ *
+ * We exclude props that conflict with React Aria's DateFieldProps:
+ * - onChange: HTML's FormEventHandler vs React Aria's (value: DateValue | null) => void
+ * - value/defaultValue: HTML's string[] vs React Aria's DateValue | null
  */
-declare interface DateInputRootProps extends HTMLChakraProps<"div", DateInputRecipeProps> {
-}
-
-/**
- * Recipe configuration for the DateInput component.
- * Defines the styling variants and base styles using Chakra UI's recipe system.
- */
-declare const dateInputSlotRecipe: SlotRecipeDefinition<"root" | "leadingElement" | "trailingElement" | "segmentGroup" | "segment", {
-size: {
-sm: {
-root: {
-h: "800";
-textStyle: "sm";
-px: "300";
-gap: "100";
-};
-leadingElement: {
-"& > svg": {
-boxSize: "400";
-};
-};
-trailingElement: {
-"& > svg": {
-boxSize: "400";
-};
-};
-};
-md: {
-root: {
-h: "1000";
-textStyle: "md";
-px: "400";
-gap: "200";
-};
-leadingElement: {
-"& > svg": {
-boxSize: "500";
-};
-};
-trailingElement: {
-"& > svg": {
-boxSize: "500";
-};
-};
-};
-};
-variant: {
-solid: {
-root: {
-"--border-width": "sizes.25";
-"--border-color": "colors.neutral.7";
-backgroundColor: "neutral.1";
-_hover: {
-backgroundColor: "primary.2";
-};
-};
-};
-ghost: {
-root: {
-_hover: {
-backgroundColor: "primary.2";
-};
-};
-};
-plain: {
-root: {
-px: "0";
-outline: "none!";
-boxShadow: "none!";
-bg: "transparent!";
-};
-};
-};
-}>;
+export declare type DateInputRootProps = Omit<HTMLChakraProps<"div", DateInputRecipeProps>, "onChange" | "value" | "defaultValue">;
 
 /**
  * Additional properties we want to exclude from the DateInput component.

package/dist/date-picker.d.ts

@@ -1,12 +1,10 @@
 import { DateFieldProps } from 'react-aria-components';
 import { DatePickerStateOptions } from 'react-stately';
 import { DateValue } 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';
 
 /**
  * Properties from DatePickerStateOptions that would conflict with similarly named
@@ -23,7 +21,7 @@ declare type ConflictingPickerStateProps = keyof DatePickerStateOptions<DateValu
  * 2. Merge with DateInputRootProps, excluding conflicting keys
  * 3. Add recipe variant props
  */
-declare interface DateInputProps extends DateFieldProps<DateValue>, Omit<DateInputRootProps, keyof DateFieldProps<DateValue> | ExcludedProps>, RecipeVariantProps<typeof dateInputSlotRecipe> {
+declare type DateInputProps = DateInputRootProps & DateFieldProps<DateValue> & Omit<DateInputRootProps, keyof DateFieldProps<DateValue> | ExcludedProps> & {
     /**
      * Optional element to display at the start of the input
      * Will respect text direction (left in LTR, right in RTL)
@@ -34,94 +32,27 @@ declare interface DateInputProps extends DateFieldProps<DateValue>, Omit<DateInp
      * Will respect text direction (right in LTR, left in RTL)
      */
     trailingElement?: React.ReactNode;
-}
+};
 
 /**
  * Base recipe props interface that combines Chakra UI's recipe props
  * with the unstyled prop option for the div element.
  */
-declare interface DateInputRecipeProps extends RecipeProps<"div">, UnstyledProp {
-}
+declare type DateInputRecipeProps = {
+    size?: SlotRecipeProps<"dateInput">["size"];
+    variant?: SlotRecipeProps<"dateInput">["variant"];
+} & 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.
+ *
+ * We exclude props that conflict with React Aria's DateFieldProps:
+ * - onChange: HTML's FormEventHandler vs React Aria's (value: DateValue | null) => void
+ * - value/defaultValue: HTML's string[] vs React Aria's DateValue | null
  */
-declare interface DateInputRootProps extends HTMLChakraProps<"div", DateInputRecipeProps> {
-}
-
-/**
- * Recipe configuration for the DateInput component.
- * Defines the styling variants and base styles using Chakra UI's recipe system.
- */
-declare const dateInputSlotRecipe: SlotRecipeDefinition<"root" | "leadingElement" | "trailingElement" | "segmentGroup" | "segment", {
-size: {
-sm: {
-root: {
-h: "800";
-textStyle: "sm";
-px: "300";
-gap: "100";
-};
-leadingElement: {
-"& > svg": {
-boxSize: "400";
-};
-};
-trailingElement: {
-"& > svg": {
-boxSize: "400";
-};
-};
-};
-md: {
-root: {
-h: "1000";
-textStyle: "md";
-px: "400";
-gap: "200";
-};
-leadingElement: {
-"& > svg": {
-boxSize: "500";
-};
-};
-trailingElement: {
-"& > svg": {
-boxSize: "500";
-};
-};
-};
-};
-variant: {
-solid: {
-root: {
-"--border-width": "sizes.25";
-"--border-color": "colors.neutral.7";
-backgroundColor: "neutral.1";
-_hover: {
-backgroundColor: "primary.2";
-};
-};
-};
-ghost: {
-root: {
-_hover: {
-backgroundColor: "primary.2";
-};
-};
-};
-plain: {
-root: {
-px: "0";
-outline: "none!";
-boxShadow: "none!";
-bg: "transparent!";
-};
-};
-};
-}>;
+declare type DateInputRootProps = Omit<HTMLChakraProps<"div", DateInputRecipeProps>, "onChange" | "value" | "defaultValue">;
 
 /**
  * # DatePicker
@@ -142,7 +73,7 @@ export declare const DatePicker: {
  * 1. Conflicting props from DateInputProps to avoid TypeScript errors
  * 2. Explicitly excluded props that we don't want users to access
  */
-export declare interface DatePickerProps extends Omit<DateInputProps, ConflictingPickerStateProps | ExcludedProps_2>, Omit<DatePickerStateOptions<DateValue>, ExcludedProps_2>, RecipeVariantProps<typeof datePickerSlotRecipe> {
+export declare type DatePickerProps = DatePickerRootProps & Omit<DateInputProps, ConflictingPickerStateProps | ExcludedProps_2> & Omit<DatePickerStateOptions<DateValue>, ExcludedProps_2> & {
     /**
      * Whether the calendar popover should be open by default (uncontrolled).
      */
@@ -160,30 +91,35 @@ export declare interface DatePickerProps extends Omit<DateInputProps, Conflictin
      * This prop is forwarded to both the main date input and footer time input.
      */
     hideTimeZone?: boolean;
-}
+};
+
+/**
+ * Base recipe props interface that combines Chakra UI's recipe props
+ * with the unstyled prop option for the div element.
+ */
+declare type DatePickerRecipeProps = {
+    size?: SlotRecipeProps<"datePicker">["size"];
+    variant?: SlotRecipeProps<"datePicker">["variant"];
+} & UnstyledProp;
 
 /**
- * Recipe configuration for the DatePicker component.
- * Defines the styling variants and base styles using Chakra UI's recipe system.
+ * 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.
+ *
+ * We exclude props that conflict with React Aria's DatePickerStateOptions:
+ * - onChange: HTML's FormEventHandler vs React Aria's (value: DateValue | null) => void
+ * - value/defaultValue: HTML's string[] vs React Aria's DateValue | null
  */
-declare const datePickerSlotRecipe: SlotRecipeDefinition<"calendar" | "popover" | "root" | "group" | "calendarHeader" | "calendarGrid" | "calendarCell", {
-size: {
-sm: {};
-md: {};
-};
-variant: {
-solid: {};
-ghost: {};
-};
-}>;
+export declare type DatePickerRootProps = Omit<HTMLChakraProps<"div", DatePickerRecipeProps>, "onChange" | "value" | "defaultValue">;
 
 /**
  * Props for the DatePickerTimeInput component.
  */
-export declare interface DatePickerTimeInputProps {
+export declare type DatePickerTimeInputProps = {
     hideTimeZone?: boolean;
     hourCycle?: 12 | 24;
-}
+};
 
 /**
  * Additional properties we want to exclude from the DateInput component.

package/dist/date-range-picker.d.ts

@@ -1,11 +1,9 @@
 import { DateRangePickerProps as DateRangePickerProps_2 } from 'react-aria-components';
 import { DateValue } 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';
 
 /**
  * DateRangePicker
@@ -24,7 +22,7 @@ export declare const DateRangePicker: {
  * We extend React Aria's DateRangePickerProps and add the size/variant props
  * that we want to pass through to the DateInput components.
  */
-export declare interface DateRangePickerProps extends Omit<DateRangePickerProps_2<DateValue>, ExcludedProps>, Omit<DateRangePickerRootProps, keyof DateRangePickerProps_2<DateValue> | ExcludedProps>, RecipeVariantProps<typeof dateRangePickerSlotRecipe> {
+export declare type DateRangePickerProps = Omit<DateRangePickerRootProps, keyof DateRangePickerProps_2<DateValue> | ExcludedProps> & Omit<DateRangePickerProps_2<DateValue>, ExcludedProps> & {
     /**
      * Whether the calendar popover should be open by default (uncontrolled).
      */
@@ -42,65 +40,31 @@ export declare interface DateRangePickerProps extends Omit<DateRangePickerProps_
      * This prop is forwarded to both the main date inputs and footer time inputs.
      */
     hideTimeZone?: boolean;
-}
+};
 
 /**
  * Base recipe props interface that combines Chakra UI's recipe props
  * with the unstyled prop option for the div element.
  */
-declare interface DateRangePickerRecipeProps extends RecipeProps<"div">, UnstyledProp {
-}
+declare type DateRangePickerRecipeProps = {
+    size?: SlotRecipeProps<"dateRangePicker">["size"];
+    variant?: SlotRecipeProps<"dateRangePicker">["variant"];
+} & 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 interface DateRangePickerRootProps extends HTMLChakraProps<"div", DateRangePickerRecipeProps> {
-}
-
-declare const dateRangePickerSlotRecipe: SlotRecipeDefinition<"trigger" | "calendar" | "popover" | "root" | "group" | "calendarHeader" | "calendarGrid" | "calendarCell", {
-size: {
-sm: {
-group: {
-height: "800";
-pr: "calc({spacing.1400} + {spacing.400})";
-};
-trigger: {
-top: "50";
-};
-};
-md: {
-group: {
-height: "1000";
-pr: "calc({spacing.1600} + {spacing.200} + {spacing.400})";
-};
-trigger: {
-top: "100";
-};
-};
-};
-variant: {
-solid: {};
-ghost: {
-group: {
-bg: "transparent";
-px: "300";
-_hover: {
-bg: "primary.2";
-};
-};
-};
-};
-}>;
+export declare type DateRangePickerRootProps = HTMLChakraProps<"div", DateRangePickerRecipeProps>;
 
 /**
  * Props for the DateRangePickerTimeInput component.
  */
-export declare interface DateRangePickerTimeInputProps {
+export declare type DateRangePickerTimeInputProps = {
     hideTimeZone?: boolean;
     hourCycle?: 12 | 24;
-}
+};
 
 /**
  * Additional properties we want to exclude from the DateRangePicker component.