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

package/dist/components/command/command.recipe.js

@@ -1,34 +0,0 @@
-import { defineRecipe, } from '@chakra-ui/react/styled-system';
-export const commandRecipe = defineRecipe({
-    className: 'sui-command',
-    base: {
-        colorPalette: 'gray',
-        display: 'inline-flex',
-        gap: 1,
-        color: 'fg.muted',
-        '[role=tooltip] > &': {
-            ms: 1,
-            _before: {
-                content: '"•"',
-                me: 1,
-                fontSize: 'xs',
-            },
-        },
-    },
-    variants: {
-        size: {
-            sm: {
-                fontSize: 'xs',
-            },
-            md: {
-                fontSize: 'sm',
-            },
-            lg: {
-                fontSize: 'md',
-            },
-        },
-    },
-    defaultVariants: {
-        size: 'md',
-    },
-});

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

@@ -1,14 +0,0 @@
-export declare const containerRecipe: import("@chakra-ui/react").RecipeDefinition<{
-    centerContent: {
-        true: {
-            display: "flex";
-            flexDirection: "column";
-            alignItems: "center";
-        };
-    };
-    fluid: {
-        true: {
-            maxWidth: "full";
-        };
-    };
-}>;

package/dist/components/container/container.recipe.js

@@ -1,25 +0,0 @@
-import { defineRecipe } from '@chakra-ui/react/styled-system';
-export const containerRecipe = defineRecipe({
-    className: 'chakra-container',
-    base: {
-        position: 'relative',
-        maxWidth: '8xl',
-        w: '100%',
-        mx: 'auto',
-        px: { base: '4', md: '6', lg: '8' },
-    },
-    variants: {
-        centerContent: {
-            true: {
-                display: 'flex',
-                flexDirection: 'column',
-                alignItems: 'center',
-            },
-        },
-        fluid: {
-            true: {
-                maxWidth: 'full',
-            },
-        },
-    },
-});

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

@@ -1,55 +0,0 @@
-export declare const dataListSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"root" | "item" | "itemLabel" | "itemValue", {
-    orientation: {
-        horizontal: {
-            root: {
-                display: "flex";
-                flexDirection: "column";
-            };
-            item: {
-                display: "inline-flex";
-                alignItems: "center";
-                gap: "4";
-            };
-            itemLabel: {
-                minWidth: "var(--label-width, 120px)";
-            };
-        };
-        vertical: {
-            root: {
-                display: "flex";
-                flexDirection: "column";
-            };
-            item: {
-                display: "flex";
-                flexDirection: "column";
-                gap: "1";
-            };
-        };
-    };
-    size: {
-        sm: {
-            root: {
-                gap: "3";
-            };
-            item: {
-                textStyle: "xs";
-            };
-        };
-        md: {
-            root: {
-                gap: "4";
-            };
-            item: {
-                textStyle: "sm";
-            };
-        };
-        lg: {
-            root: {
-                gap: "5";
-            };
-            item: {
-                textStyle: "md";
-            };
-        };
-    };
-}>;

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

@@ -1,78 +0,0 @@
-import { dataListAnatomy } from '@chakra-ui/react/anatomy';
-import { defineSlotRecipe } from '@chakra-ui/react/styled-system';
-export const dataListSlotRecipe = defineSlotRecipe({
-    slots: dataListAnatomy.keys(),
-    className: 'chakra-data-list',
-    base: {
-        itemLabel: {
-            color: 'fg.muted',
-            display: 'flex',
-            alignItems: 'center',
-            gap: '1',
-        },
-        itemValue: {
-            display: 'flex',
-            minWidth: '0',
-            flex: '1',
-        },
-    },
-    variants: {
-        orientation: {
-            horizontal: {
-                root: {
-                    display: 'flex',
-                    flexDirection: 'column',
-                },
-                item: {
-                    display: 'inline-flex',
-                    alignItems: 'center',
-                    gap: '4',
-                },
-                itemLabel: {
-                    minWidth: 'var(--label-width, 120px)',
-                },
-            },
-            vertical: {
-                root: {
-                    display: 'flex',
-                    flexDirection: 'column',
-                },
-                item: {
-                    display: 'flex',
-                    flexDirection: 'column',
-                    gap: '1',
-                },
-            },
-        },
-        size: {
-            sm: {
-                root: {
-                    gap: '3',
-                },
-                item: {
-                    textStyle: 'xs',
-                },
-            },
-            md: {
-                root: {
-                    gap: '4',
-                },
-                item: {
-                    textStyle: 'sm',
-                },
-            },
-            lg: {
-                root: {
-                    gap: '5',
-                },
-                item: {
-                    textStyle: 'md',
-                },
-            },
-        },
-    },
-    defaultVariants: {
-        size: 'md',
-        orientation: 'horizontal',
-    },
-});

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

@@ -1,166 +0,0 @@
-export declare const dialogSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "content" | "body" | "backdrop" | "positioner" | "closeTrigger" | "title" | "header" | "footer" | "trigger", {
-    variant: {
-        dialog: {};
-        confirm: {
-            content: {
-                textAlign: "center";
-            };
-            header: {
-                flexDirection: "column";
-                alignItems: "center";
-            };
-            footer: {
-                display: "flex";
-                flexDirection: "column-reverse";
-                justifyContent: "stretch";
-                alignItems: "stretch";
-            };
-        };
-    };
-    placement: {
-        center: {
-            positioner: {
-                alignItems: "center";
-            };
-            content: {
-                '--dialog-base-margin': "auto";
-                mx: "auto";
-            };
-        };
-        top: {
-            positioner: {
-                alignItems: "flex-start";
-            };
-            content: {
-                '--dialog-base-margin': "spacing.16";
-                mx: "auto";
-            };
-        };
-        bottom: {
-            positioner: {
-                alignItems: "flex-end";
-            };
-            content: {
-                '--dialog-base-margin': "spacing.16";
-                mx: "auto";
-            };
-        };
-    };
-    scrollBehavior: {
-        inside: {
-            positioner: {
-                overflow: "hidden";
-            };
-            content: {
-                maxH: "calc(100% - 7.5rem)";
-            };
-            body: {
-                overflow: "auto";
-            };
-        };
-        outside: {
-            positioner: {
-                overflow: "auto";
-                pointerEvents: "auto";
-            };
-        };
-    };
-    size: {
-        xs: {
-            content: {
-                maxW: "sm";
-            };
-        };
-        sm: {
-            content: {
-                maxW: "md";
-            };
-        };
-        md: {
-            content: {
-                maxW: "lg";
-            };
-        };
-        lg: {
-            content: {
-                maxW: "2xl";
-            };
-        };
-        xl: {
-            content: {
-                maxW: "4xl";
-            };
-        };
-        cover: {
-            positioner: {
-                padding: "10";
-            };
-            content: {
-                width: "100%";
-                height: "100%";
-                '--dialog-margin': "0";
-            };
-        };
-        full: {
-            content: {
-                maxW: "100vw";
-                minH: "100vh";
-                '--dialog-margin': "0";
-                borderRadius: "0";
-            };
-        };
-    };
-    motionPreset: {
-        scale: {
-            content: {
-                _open: {
-                    animationName: "scale-in, fade-in";
-                };
-                _closed: {
-                    animationName: "scale-out, fade-out";
-                };
-            };
-        };
-        'slide-in-bottom': {
-            content: {
-                _open: {
-                    animationName: "slide-from-bottom, fade-in";
-                };
-                _closed: {
-                    animationName: "slide-to-bottom, fade-out";
-                };
-            };
-        };
-        'slide-in-top': {
-            content: {
-                _open: {
-                    animationName: "slide-from-top, fade-in";
-                };
-                _closed: {
-                    animationName: "slide-to-top, fade-out";
-                };
-            };
-        };
-        'slide-in-left': {
-            content: {
-                _open: {
-                    animationName: "slide-from-left, fade-in";
-                };
-                _closed: {
-                    animationName: "slide-to-left, fade-out";
-                };
-            };
-        };
-        'slide-in-right': {
-            content: {
-                _open: {
-                    animationName: "slide-from-right, fade-in";
-                };
-                _closed: {
-                    animationName: "slide-to-right, fade-out";
-                };
-            };
-        };
-        none: {};
-    };
-}>;

package/dist/components/dialog/dialog.recipe.js

@@ -1,256 +0,0 @@
-import { dialogAnatomy } from '@chakra-ui/react/anatomy';
-import { defineSlotRecipe } from '@chakra-ui/react/styled-system';
-export const dialogSlotRecipe = defineSlotRecipe({
-    slots: dialogAnatomy.keys(),
-    className: 'chakra-dialog',
-    base: {
-        backdrop: {
-            layerStyle: 'backdrop',
-            pos: 'fixed',
-            left: 0,
-            top: 0,
-            w: '100vw',
-            h: '100dvh',
-            zIndex: 'layer-4',
-            _open: {
-                animationName: 'fade-in',
-                animationDuration: 'slow',
-            },
-            _closed: {
-                animationName: 'fade-out',
-                animationDuration: 'moderate',
-            },
-        },
-        positioner: {
-            display: 'flex',
-            width: '100vw',
-            height: '100dvh',
-            position: 'fixed',
-            left: 0,
-            top: 0,
-            '--dialog-z-index': 'zIndex.layer-4',
-            zIndex: 'calc(var(--dialog-z-index) + var(--layer-index, 0))',
-            justifyContent: 'center',
-            overscrollBehaviorY: 'none',
-        },
-        content: {
-            display: 'flex',
-            flexDirection: 'column',
-            position: 'relative',
-            width: '100%',
-            outline: 0,
-            textStyle: 'sm',
-            my: 'var(--dialog-margin, var(--dialog-base-margin))',
-            zIndex: 'calc(var(--dialog-z-index) + var(--layer-index, 0))',
-            layerStyle: 'overlay',
-            _open: {
-                animationDuration: 'moderate',
-            },
-            _closed: {
-                animationDuration: 'faster',
-            },
-        },
-        header: {
-            display: 'flex',
-            flex: 0,
-            px: '6',
-            py: '4',
-            paddingBottom: '2',
-        },
-        body: {
-            flex: '1',
-            px: '6',
-            py: '4',
-            '&:is(.chakra-dialog__header + &)': {
-                paddingTop: '2',
-            },
-            '&:has(+ .chakra-dialog__footer)': {
-                paddingBottom: '2',
-            },
-        },
-        footer: {
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'flex-end',
-            gap: '3',
-            px: '6',
-            pt: '2',
-            pb: '4',
-        },
-        title: {
-            textStyle: 'lg',
-            fontWeight: 'semibold',
-        },
-        description: {
-            color: 'fg.muted',
-        },
-        closeTrigger: {
-            position: 'absolute',
-            top: '4',
-            right: '4',
-        },
-    },
-    variants: {
-        variant: {
-            dialog: {},
-            confirm: {
-                content: {
-                    textAlign: 'center',
-                },
-                header: {
-                    flexDirection: 'column',
-                    alignItems: 'center',
-                },
-                footer: {
-                    display: 'flex',
-                    flexDirection: 'column-reverse',
-                    justifyContent: 'stretch',
-                    alignItems: 'stretch',
-                },
-            },
-        },
-        placement: {
-            center: {
-                positioner: {
-                    alignItems: 'center',
-                },
-                content: {
-                    '--dialog-base-margin': 'auto',
-                    mx: 'auto',
-                },
-            },
-            top: {
-                positioner: {
-                    alignItems: 'flex-start',
-                },
-                content: {
-                    '--dialog-base-margin': 'spacing.16',
-                    mx: 'auto',
-                },
-            },
-            bottom: {
-                positioner: {
-                    alignItems: 'flex-end',
-                },
-                content: {
-                    '--dialog-base-margin': 'spacing.16',
-                    mx: 'auto',
-                },
-            },
-        },
-        scrollBehavior: {
-            inside: {
-                positioner: {
-                    overflow: 'hidden',
-                },
-                content: {
-                    maxH: 'calc(100% - 7.5rem)',
-                },
-                body: {
-                    overflow: 'auto',
-                },
-            },
-            outside: {
-                positioner: {
-                    overflow: 'auto',
-                    pointerEvents: 'auto',
-                },
-            },
-        },
-        size: {
-            xs: {
-                content: {
-                    maxW: 'sm',
-                },
-            },
-            sm: {
-                content: {
-                    maxW: 'md',
-                },
-            },
-            md: {
-                content: {
-                    maxW: 'lg',
-                },
-            },
-            lg: {
-                content: {
-                    maxW: '2xl',
-                },
-            },
-            xl: {
-                content: {
-                    maxW: '4xl',
-                },
-            },
-            cover: {
-                positioner: {
-                    padding: '10',
-                },
-                content: {
-                    width: '100%',
-                    height: '100%',
-                    '--dialog-margin': '0',
-                },
-            },
-            full: {
-                content: {
-                    maxW: '100vw',
-                    minH: '100vh',
-                    '--dialog-margin': '0',
-                    borderRadius: '0',
-                },
-            },
-        },
-        motionPreset: {
-            scale: {
-                content: {
-                    _open: { animationName: 'scale-in, fade-in' },
-                    _closed: { animationName: 'scale-out, fade-out' },
-                },
-            },
-            'slide-in-bottom': {
-                content: {
-                    _open: { animationName: 'slide-from-bottom, fade-in' },
-                    _closed: { animationName: 'slide-to-bottom, fade-out' },
-                },
-            },
-            'slide-in-top': {
-                content: {
-                    _open: { animationName: 'slide-from-top, fade-in' },
-                    _closed: { animationName: 'slide-to-top, fade-out' },
-                },
-            },
-            'slide-in-left': {
-                content: {
-                    _open: { animationName: 'slide-from-left, fade-in' },
-                    _closed: { animationName: 'slide-to-left, fade-out' },
-                },
-            },
-            'slide-in-right': {
-                content: {
-                    _open: { animationName: 'slide-from-right, fade-in' },
-                    _closed: { animationName: 'slide-to-right, fade-out' },
-                },
-            },
-            none: {},
-        },
-    },
-    compoundVariants: [
-        {
-            variant: 'confirm',
-            css: {
-                content: {
-                    maxW: 'xs',
-                },
-            },
-        },
-    ],
-    defaultVariants: {
-        size: 'md',
-        scrollBehavior: 'outside',
-        placement: 'top',
-        motionPreset: 'scale',
-        variant: 'dialog',
-    },
-});