@saas-ui/react 3.0.0-next.43 → 3.0.0-next.47

package/dist/components/field/field.recipe.js

@@ -1,74 +0,0 @@
-import { fieldAnatomy } from '@chakra-ui/react/anatomy';
-import { defineSlotRecipe } from '@chakra-ui/react/styled-system';
-export const fieldSlotRecipe = defineSlotRecipe({
-    className: 'chakra-field',
-    slots: fieldAnatomy.keys(),
-    base: {
-        requiredIndicator: {
-            color: 'fg.error',
-            lineHeight: '1',
-        },
-        root: {
-            display: 'flex',
-            width: '100%',
-            position: 'relative',
-            gap: '1.5',
-        },
-        label: {
-            display: 'flex',
-            alignItems: 'center',
-            textAlign: 'start',
-            textStyle: 'sm',
-            fontWeight: 'medium',
-            gap: '1',
-            userSelect: 'none',
-            _disabled: {
-                opacity: '0.5',
-            },
-        },
-        errorText: {
-            display: 'inline-flex',
-            alignItems: 'center',
-            fontWeight: 'medium',
-            gap: '1',
-            color: 'fg.error',
-            textStyle: 'xs',
-        },
-        helperText: {
-            color: 'fg.muted',
-            textStyle: 'xs',
-        },
-    },
-    variants: {
-        orientation: {
-            vertical: {
-                root: {
-                    flexDirection: 'column',
-                    alignItems: 'flex-start',
-                },
-            },
-            horizontal: {
-                root: {
-                    display: 'grid',
-                    gridTemplateColumns: 'var(--field-label-width, 8rem) 1fr',
-                    alignItems: 'center',
-                    '&:has(textarea)': {
-                        alignItems: 'flex-start',
-                        '& label': {
-                            pt: 1.5,
-                        },
-                    },
-                },
-                helperText: {
-                    gridColumn: 2,
-                },
-                errorText: {
-                    gridColumn: 2,
-                },
-            },
-        },
-    },
-    defaultVariants: {
-        orientation: 'vertical',
-    },
-});

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

@@ -1,37 +0,0 @@
-export declare const fieldsetSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "root" | "errorText" | "helperText" | "legend", {
-    size: {
-        sm: {
-            root: {
-                spaceY: "2";
-            };
-            content: {
-                gap: "1.5";
-            };
-            legend: {
-                textStyle: "sm";
-            };
-        };
-        md: {
-            root: {
-                spaceY: "4";
-            };
-            content: {
-                gap: "4";
-            };
-            legend: {
-                textStyle: "sm";
-            };
-        };
-        lg: {
-            root: {
-                spaceY: "6";
-            };
-            content: {
-                gap: "4";
-            };
-            legend: {
-                textStyle: "md";
-            };
-        };
-    };
-}>;

package/dist/components/fieldset/fieldset.recipe.js

@@ -1,59 +0,0 @@
-import { fieldsetAnatomy } from '@chakra-ui/react/anatomy';
-import { defineSlotRecipe } from '@chakra-ui/react/styled-system';
-export const fieldsetSlotRecipe = defineSlotRecipe({
-    className: 'fieldset',
-    slots: [...fieldsetAnatomy.keys(), 'content'],
-    base: {
-        root: {
-            display: 'flex',
-            flexDirection: 'column',
-            width: 'full',
-        },
-        content: {
-            display: 'flex',
-            flexDirection: 'column',
-            width: 'full',
-        },
-        legend: {
-            color: 'fg',
-            fontWeight: 'medium',
-            _disabled: {
-                opacity: '0.5',
-            },
-        },
-        helperText: {
-            color: 'fg.muted',
-            textStyle: 'sm',
-        },
-        errorText: {
-            display: 'inline-flex',
-            alignItems: 'center',
-            color: 'fg.error',
-            gap: '2',
-            fontWeight: 'medium',
-            textStyle: 'sm',
-        },
-    },
-    variants: {
-        size: {
-            sm: {
-                root: { spaceY: '2' },
-                content: { gap: '1.5' },
-                legend: { textStyle: 'sm' },
-            },
-            md: {
-                root: { spaceY: '4' },
-                content: { gap: '4' },
-                legend: { textStyle: 'sm' },
-            },
-            lg: {
-                root: { spaceY: '6' },
-                content: { gap: '4' },
-                legend: { textStyle: 'md' },
-            },
-        },
-    },
-    defaultVariants: {
-        size: 'md',
-    },
-});

package/dist/components/file-upload/file-upload.recipe.d.ts

@@ -1 +0,0 @@
-export declare const fileUploadSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "item" | "itemContent" | "trigger" | "itemGroup" | "clearTrigger" | "dropzone" | "itemDeleteTrigger" | "itemName" | "itemPreview" | "itemPreviewImage" | "itemSizeText" | "dropzoneContent" | "fileText", import("@chakra-ui/react").SlotRecipeVariantRecord<"label" | "root" | "item" | "itemContent" | "trigger" | "itemGroup" | "clearTrigger" | "dropzone" | "itemDeleteTrigger" | "itemName" | "itemPreview" | "itemPreviewImage" | "itemSizeText" | "dropzoneContent" | "fileText">>;

package/dist/components/file-upload/file-upload.recipe.js

@@ -1,90 +0,0 @@
-import { fileUploadAnatomy } from '@chakra-ui/react/anatomy';
-import { defineSlotRecipe } from '@chakra-ui/react/styled-system';
-export const fileUploadSlotRecipe = defineSlotRecipe({
-    className: 'chakra-file-upload',
-    slots: fileUploadAnatomy.keys(),
-    base: {
-        root: {
-            display: 'flex',
-            flexDirection: 'column',
-            gap: '4',
-            width: '100%',
-            alignItems: 'flex-start',
-        },
-        label: {
-            fontWeight: 'medium',
-            textStyle: 'sm',
-        },
-        dropzone: {
-            background: 'bg',
-            borderRadius: 'panel.md',
-            borderWidth: '1px',
-            borderStyle: 'dashed',
-            display: 'flex',
-            alignItems: 'center',
-            flexDirection: 'column',
-            gap: '4',
-            justifyContent: 'center',
-            p: '4',
-            transition: 'backgrounds',
-            focusVisibleRing: 'outside',
-            _dragging: {
-                bg: 'colorPalette.subtle',
-                borderStyle: 'solid',
-                borderColor: 'colorPalette.solid',
-            },
-        },
-        dropzoneContent: {
-            display: 'flex',
-            flexDirection: 'column',
-            alignItems: 'center',
-            textAlign: 'center',
-            gap: '4',
-            textStyle: 'sm',
-        },
-        item: {
-            textStyle: 'sm',
-            animationName: 'fade-in',
-            animationDuration: 'moderate',
-            background: 'bg',
-            borderRadius: 'panel.md',
-            borderWidth: '1px',
-            width: '100%',
-            display: 'flex',
-            alignItems: 'center',
-            gap: '3',
-            px: '4',
-            py: '2',
-        },
-        itemGroup: {
-            width: '100%',
-            display: 'flex',
-            flexDirection: 'column',
-            gap: '3',
-        },
-        itemName: {
-            color: 'fg',
-            fontWeight: 'medium',
-            lineClamp: '1',
-        },
-        itemContent: {
-            display: 'flex',
-            flexDirection: 'column',
-            gap: '0.5',
-            flex: '1',
-        },
-        itemSizeText: {
-            color: 'fg.muted',
-            textStyle: 'xs',
-        },
-        itemDeleteTrigger: {
-            alignSelf: 'flex-start',
-        },
-        itemPreviewImage: {
-            width: '10',
-            height: '10',
-            objectFit: 'scale-down',
-        },
-    },
-    defaultVariants: {},
-});

package/dist/components/grid-list/grid-list.recipe.d.ts

@@ -1,60 +0,0 @@
-import { type RecipeVariantProps } from '@chakra-ui/react/styled-system';
-export declare const gridListSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"cell" | "root" | "item" | "header", {
-    interactive: {
-        true: {
-            item: {
-                cursor: "button";
-                transitionProperty: "bg";
-                transitionDuration: "fast";
-                _hover: {
-                    bg: "bg.subtle";
-                };
-                _active: {
-                    bg: "bg.subtle";
-                };
-            };
-        };
-    };
-    variant: {
-        simple: {};
-        rounded: {
-            item: {
-                borderRadius: "md";
-                mb: number;
-            };
-        };
-    };
-    size: {
-        sm: {
-            root: {
-                textStyle: "sm";
-                py: number;
-            };
-            item: {
-                py: number;
-                px: number;
-                gap: number;
-            };
-            header: {
-                py: number;
-                px: number;
-            };
-        };
-        md: {
-            root: {
-                textStyle: "md";
-                py: number;
-            };
-            item: {
-                py: number;
-                px: number;
-                gap: number;
-            };
-            header: {
-                py: number;
-                px: number;
-            };
-        };
-    };
-}>;
-export type GridListVariantProps = RecipeVariantProps<typeof gridListSlotRecipe>;

package/dist/components/grid-list/grid-list.recipe.js

@@ -1,131 +0,0 @@
-import { defineSlotRecipe, } from '@chakra-ui/react/styled-system';
-export const gridListSlotRecipe = defineSlotRecipe({
-    className: 'sui-grid-list',
-    slots: ['root', 'item', 'header', 'cell'],
-    base: {
-        root: {
-            position: 'relative',
-        },
-        item: {
-            display: 'flex',
-            flexDirection: 'row',
-            alignItems: 'center',
-            justifyContent: 'space-between',
-            flex: 1,
-            userSelect: 'none',
-            borderRadius: 'inherit',
-            outline: 'none',
-            _focusVisible: {
-                boxShadow: 'outline',
-            },
-            _disabled: {
-                cursor: 'disabled',
-                opacity: 0.5,
-                _hover: {
-                    bg: 'transparent',
-                    _dark: {
-                        bg: 'transparent',
-                    },
-                },
-                _active: {
-                    bg: 'transparent',
-                    _dark: {
-                        bg: 'transparent',
-                    },
-                },
-            },
-        },
-        header: {
-            display: 'flex',
-            flexDirection: 'row',
-            position: 'sticky',
-            fontWeight: 'medium',
-            color: 'fg.subtle',
-        },
-        cell: {
-            flexShrink: 0,
-        },
-    },
-    variants: {
-        interactive: {
-            true: {
-                item: {
-                    cursor: 'button',
-                    transitionProperty: 'bg',
-                    transitionDuration: 'fast',
-                    _hover: {
-                        bg: 'bg.subtle',
-                    },
-                    _active: {
-                        bg: 'bg.subtle',
-                    },
-                },
-            },
-        },
-        variant: {
-            simple: {},
-            rounded: {
-                item: {
-                    borderRadius: 'md',
-                    mb: 0.5,
-                },
-            },
-        },
-        size: {
-            sm: {
-                root: {
-                    textStyle: 'sm',
-                    py: 0.5,
-                },
-                item: {
-                    py: 1,
-                    px: 2,
-                    gap: 1,
-                },
-                header: {
-                    py: 0.5,
-                    px: 2,
-                },
-            },
-            md: {
-                root: {
-                    textStyle: 'md',
-                    py: 1,
-                },
-                item: {
-                    py: 2,
-                    px: 3,
-                    gap: 2,
-                },
-                header: {
-                    py: 1,
-                    px: 3,
-                },
-            },
-        },
-    },
-    compoundVariants: [
-        {
-            variant: 'rounded',
-            size: 'sm',
-            css: {
-                root: {
-                    p: 1,
-                },
-            },
-        },
-        {
-            variant: 'rounded',
-            size: 'md',
-            css: {
-                root: {
-                    p: 2,
-                },
-            },
-        },
-    ],
-    defaultVariants: {
-        variant: 'simple',
-        size: 'md',
-    },
-});

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

@@ -1,59 +0,0 @@
-export declare const headingRecipe: import("@chakra-ui/react").RecipeDefinition<{
-    size: {
-        xs: {
-            fontSize: "xs";
-            lineHeight: "heading.xs";
-            letterSpacing: "heading.xs";
-        };
-        sm: {
-            fontSize: "sm";
-            lineHeight: "heading.sm";
-            letterSpacing: "heading.sm";
-        };
-        md: {
-            fontSize: "md";
-            lineHeight: "heading.md";
-            letterSpacing: "heading.md";
-        };
-        lg: {
-            fontSize: "lg";
-            lineHeight: "heading.lg";
-            letterSpacing: "heading.lg";
-        };
-        xl: {
-            fontSize: "xl";
-            lineHeight: "heading.xl";
-            letterSpacing: "heading.xl";
-        };
-        '2xl': {
-            fontSize: "2xl";
-            lineHeight: "heading.2xl";
-            letterSpacing: "heading.2xl";
-        };
-        '3xl': {
-            fontSize: "3xl";
-            lineHeight: "heading.3xl";
-            letterSpacing: "heading.3xl";
-        };
-        '4xl': {
-            fontSize: "4xl";
-            lineHeight: "heading.4xl";
-            letterSpacing: "heading.4xl";
-        };
-        '5xl': {
-            fontSize: "5xl";
-            lineHeight: "heading.5xl";
-            letterSpacing: "heading.5xl";
-        };
-        '6xl': {
-            fontSize: "6xl";
-            lineHeight: "heading.6xl";
-            letterSpacing: "heading.6xl";
-        };
-        '7xl': {
-            fontSize: "7xl";
-            lineHeight: "heading.7xl";
-            letterSpacing: "heading.7xl";
-        };
-    };
-}>;

package/dist/components/heading/heading.recipe.js

@@ -1,70 +0,0 @@
-import { defineRecipe } from '@chakra-ui/react/styled-system';
-export const headingRecipe = defineRecipe({
-    className: 'chakra-heading',
-    base: {
-        fontFamily: 'heading',
-        fontWeight: 'semibold',
-    },
-    variants: {
-        size: {
-            xs: {
-                fontSize: 'xs',
-                lineHeight: 'heading.xs',
-                letterSpacing: 'heading.xs',
-            },
-            sm: {
-                fontSize: 'sm',
-                lineHeight: 'heading.sm',
-                letterSpacing: 'heading.sm',
-            },
-            md: {
-                fontSize: 'md',
-                lineHeight: 'heading.md',
-                letterSpacing: 'heading.md',
-            },
-            lg: {
-                fontSize: 'lg',
-                lineHeight: 'heading.lg',
-                letterSpacing: 'heading.lg',
-            },
-            xl: {
-                fontSize: 'xl',
-                lineHeight: 'heading.xl',
-                letterSpacing: 'heading.xl',
-            },
-            '2xl': {
-                fontSize: '2xl',
-                lineHeight: 'heading.2xl',
-                letterSpacing: 'heading.2xl',
-            },
-            '3xl': {
-                fontSize: '3xl',
-                lineHeight: 'heading.3xl',
-                letterSpacing: 'heading.3xl',
-            },
-            '4xl': {
-                fontSize: '4xl',
-                lineHeight: 'heading.4xl',
-                letterSpacing: 'heading.4xl',
-            },
-            '5xl': {
-                fontSize: '5xl',
-                lineHeight: 'heading.5xl',
-                letterSpacing: 'heading.5xl',
-            },
-            '6xl': {
-                fontSize: '6xl',
-                lineHeight: 'heading.6xl',
-                letterSpacing: 'heading.6xl',
-            },
-            '7xl': {
-                fontSize: '7xl',
-                lineHeight: 'heading.7xl',
-                letterSpacing: 'heading.7xl',
-            },
-        },
-    },
-    defaultVariants: {
-        size: 'xl',
-    },
-});

package/dist/components/hover-card/hover-card.recipe.d.ts

@@ -1,28 +0,0 @@
-export declare const hoverCardSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "positioner" | "trigger" | "arrow" | "arrowTip", {
-    size: {
-        xs: {
-            content: {
-                padding: "3";
-                borderRadius: "panel.sm";
-            };
-        };
-        sm: {
-            content: {
-                padding: "4";
-                borderRadius: "panel.md";
-            };
-        };
-        md: {
-            content: {
-                padding: "5";
-                borderRadius: "panel.md";
-            };
-        };
-        lg: {
-            content: {
-                padding: "6";
-                borderRadius: "panel.lg";
-            };
-        };
-    };
-}>;

package/dist/components/hover-card/hover-card.recipe.js

@@ -1,70 +0,0 @@
-import { hoverCardAnatomy } from '@chakra-ui/react/anatomy';
-import { defineSlotRecipe } from '@chakra-ui/react/styled-system';
-export const hoverCardSlotRecipe = defineSlotRecipe({
-    className: 'chakra-hover-card',
-    slots: hoverCardAnatomy.keys(),
-    base: {
-        content: {
-            position: 'relative',
-            display: 'flex',
-            flexDirection: 'column',
-            textStyle: 'sm',
-            '--hovercard-bg': 'colors.bg.panel',
-            bg: 'var(--hovercard-bg)',
-            maxWidth: '80',
-            '--hover-card-z-index': 'zIndex.layer-2',
-            zIndex: 'calc(var(--hover-card-z-index) + var(--layer-index, 0))',
-            transformOrigin: 'var(--transform-origin)',
-            borderWidth: '1px',
-            outline: '0',
-            layerStyle: 'overlay',
-            _open: {
-                animationStyle: 'slide-fade-in',
-                animationDuration: 'fast',
-            },
-            _closed: {
-                animationStyle: 'slide-fade-out',
-                animationDuration: 'faster',
-            },
-        },
-        arrow: {
-            '--arrow-size': 'sizes.3',
-            '--arrow-background': 'var(--hovercard-bg)',
-        },
-        arrowTip: {
-            borderTopWidth: '0.5px',
-            borderInlineStartWidth: '0.5px',
-        },
-    },
-    variants: {
-        size: {
-            xs: {
-                content: {
-                    padding: '3',
-                    borderRadius: 'panel.sm',
-                },
-            },
-            sm: {
-                content: {
-                    padding: '4',
-                    borderRadius: 'panel.md',
-                },
-            },
-            md: {
-                content: {
-                    padding: '5',
-                    borderRadius: 'panel.md',
-                },
-            },
-            lg: {
-                content: {
-                    padding: '6',
-                    borderRadius: 'panel.lg',
-                },
-            },
-        },
-    },
-    defaultVariants: {
-        size: 'md',
-    },
-});