@commercetools/nimbus 2.0.1-rc2 → 2.0.1-rc4

package/dist/{box.d.ts → components/box/box.d.ts}

@@ -1,30 +1,16 @@
-import { HTMLChakraProps } from '@chakra-ui/react/styled-system';
-import { JSX } from 'react/jsx-runtime';
-
-/**
- * # Box
- *
- * A basic layout component that serves as a wrapper or container.
- *
- * @see {@link https://nimbus-documentation.vercel.app/components/layout/box}
- */
-export declare const Box: {
-    (props: BoxProps): JSX.Element;
-    displayName: string;
-};
-
-export declare type BoxProps = HTMLChakraProps<"div"> & {
-    children?: React.ReactNode;
-    ref?: React.Ref<HTMLDivElement>;
-};
-
-export { }
-
-
-declare module "slate" {
-    interface CustomTypes {
-        Editor: BaseEditor & ReactEditor & HistoryEditor;
-        Element: CustomElement;
-        Text: CustomText;
-    }
-}
+import { HTMLChakraProps } from '@chakra-ui/react/styled-system';
+export type BoxProps = HTMLChakraProps<"div"> & {
+    children?: React.ReactNode;
+    ref?: React.Ref<HTMLDivElement>;
+};
+/**
+ * # Box
+ *
+ * A basic layout component that serves as a wrapper or container.
+ *
+ * @see {@link https://nimbus-documentation.vercel.app/components/layout/box}
+ */
+export declare const Box: {
+    (props: BoxProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

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

@@ -0,0 +1 @@
+export { Box, type BoxProps } from './box';

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

@@ -0,0 +1,12 @@
+import { ButtonProps } from './button.types.ts';
+/**
+ * # Button
+ *
+ * Displays a Button.
+ *
+ * @see {@link https://nimbus-documentation.vercel.app/components/inputs/button}
+ */
+export declare const Button: {
+    (props: ButtonProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/components/button/button.recipe.d.ts

@@ -0,0 +1,107 @@
+export declare const buttonRecipe: import('@chakra-ui/react').RecipeDefinition<{
+    size: {
+        "2xs": {
+            h: "600";
+            minW: "600";
+            fontSize: "300";
+            fontWeight: "500";
+            lineHeight: "400";
+            px: "200";
+            gap: "100";
+            _icon: {
+                width: "400";
+                height: "400";
+            };
+        };
+        xs: {
+            h: "800";
+            minW: "800";
+            fontSize: "350";
+            fontWeight: "500";
+            lineHeight: "400";
+            px: "300";
+            gap: "100";
+            _icon: {
+                width: "500";
+                height: "500";
+            };
+        };
+        md: {
+            h: "1000";
+            minW: "1000";
+            fontSize: "400";
+            lineHeight: "500";
+            px: "400";
+            gap: "200";
+            _icon: {
+                width: "600";
+                height: "600";
+            };
+        };
+    };
+    variant: {
+        solid: {
+            bg: "colorPalette.9";
+            color: "colorPalette.contrast";
+            _hover: {
+                bg: "colorPalette.10";
+            };
+            _expanded: {
+                bg: "colorPalette.10";
+            };
+        };
+        subtle: {
+            bg: "colorPalette.3";
+            color: "colorPalette.11";
+            _hover: {
+                bg: "colorPalette.4";
+            };
+            _expanded: {
+                bg: "colorPalette.4";
+            };
+        };
+        outline: {
+            borderWidth: "1px";
+            borderColor: "colorPalette.7";
+            color: "colorPalette.11";
+            transitionProperty: "background-color, border-color, color";
+            transitionDuration: "moderate";
+            _hover: {
+                bg: "colorPalette.3";
+                borderColor: "colorPalette.8";
+            };
+            _expanded: {
+                bg: "colorPalette.subtle";
+            };
+        };
+        ghost: {
+            color: "colorPalette.11";
+            _hover: {
+                bg: "colorPalette.4";
+            };
+            _expanded: {
+                bg: "colorPalette.4";
+            };
+        };
+        link: {
+            color: "colorPalette.11";
+            _hover: {
+                textDecoration: "underline";
+            };
+        };
+    };
+    tone: {
+        primary: {
+            colorPalette: "primary";
+        };
+        critical: {
+            colorPalette: "critical";
+        };
+        neutral: {
+            colorPalette: "neutral";
+        };
+        info: {
+            colorPalette: "info";
+        };
+    };
+}>;

package/dist/components/button/button.slots.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Root component that provides the styling context for the Button component.
+ * Uses Chakra UI's recipe context system for consistent styling across instances.
+ */
+export declare const ButtonRoot: import('react').ForwardRefExoticComponent<Omit<import('@chakra-ui/react').HTMLChakraProps<"button", {
+    size?: import('@chakra-ui/react').RecipeProps<"button">["size"];
+    variant?: import('@chakra-ui/react').RecipeProps<"button">["variant"];
+    tone?: import('@chakra-ui/react').RecipeProps<"button">["tone"];
+} & import('@chakra-ui/react').UnstyledProp>, "slot"> & {
+    slot?: string | null | undefined;
+} & import('react').RefAttributes<HTMLButtonElement>>;

package/dist/components/button/button.types.d.ts

@@ -0,0 +1,36 @@
+import { AriaButtonProps as RaButtonProps } from 'react-aria';
+import { HTMLChakraProps, RecipeProps, UnstyledProp } from '@chakra-ui/react';
+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;
+export type ButtonRootSlotProps = Omit<HTMLChakraProps<"button", ButtonRecipeProps>, "slot"> & {
+    slot?: string | null | undefined;
+};
+export type ButtonProps = Omit<ButtonRootSlotProps, keyof RaButtonProps> & RaButtonProps & {
+    /**
+     * 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>;
+};
+export {};

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

@@ -0,0 +1,2 @@
+export * from './button';
+export * from './button.types';

package/dist/components/calendar/calendar.d.ts

@@ -0,0 +1,10 @@
+import { CalendarProps } from './calendar.types';
+import { DateValue } from 'react-aria';
+/**
+ * # Calendar
+ *
+ * Calendars display a grid of days in one or more months and allow users to select a single date.
+ *
+ * @see {@link https://nimbus-documentation.vercel.app/components/inputs/calendar}
+ */
+export declare const Calendar: (props: CalendarProps<DateValue>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/calendar/calendar.recipe.d.ts

@@ -0,0 +1 @@
+export declare const calendarSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"grid" | "root" | "header" | "grids" | "monthTitle" | "gridHeader" | "headerCell" | "gridBody" | "bodyCell", import('@chakra-ui/react').SlotRecipeVariantRecord<"grid" | "root" | "header" | "grids" | "monthTitle" | "gridHeader" | "headerCell" | "gridBody" | "bodyCell">>;