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

package/dist/theme/recipes.d.ts

@@ -1,861 +0,0 @@
-export declare const recipes: {
-    badge: import("@chakra-ui/react").RecipeDefinition<{
-        variant: {
-            solid: {
-                bg: "colorPalette.solid";
-                color: "colorPalette.contrast";
-            };
-            subtle: {
-                bg: "colorPalette.subtle";
-                color: "colorPalette.fg";
-            };
-            outline: {
-                color: "colorPalette.fg";
-                shadow: "inset 0 0 0px 1px var(--shadow-color)";
-                shadowColor: "colorPalette.subtle";
-            };
-            surface: {
-                bg: "colorPalette.muted/20";
-                color: "colorPalette.fg";
-                shadow: "inset 0 0 0px 1px var(--shadow-color)";
-                shadowColor: "colorPalette.subtle";
-            };
-            plain: {
-                color: "colorPalette.fg";
-            };
-        };
-        size: {
-            xs: {
-                textStyle: "2xs";
-                px: "1";
-                minH: "4";
-            };
-            sm: {
-                textStyle: "xs";
-                px: "1.5";
-                minH: "5";
-            };
-            md: {
-                textStyle: "sm";
-                px: "2";
-                minH: "6";
-            };
-            lg: {
-                textStyle: "sm";
-                px: "2.5";
-                minH: "7";
-            };
-        };
-    }>;
-    button: import("@chakra-ui/react").RecipeDefinition<{
-        size: {
-            xs: {
-                gap: "1";
-                h: "6";
-                minW: "6";
-                textStyle: "xs";
-                borderRadius: "control.sm";
-                px: "2";
-            };
-            sm: {
-                gap: "2";
-                h: "7";
-                minW: "7";
-                textStyle: "sm";
-                borderRadius: "control.md";
-                px: "2.5";
-            };
-            md: {
-                gap: "2";
-                h: "8";
-                minW: "8";
-                borderRadius: "control.md";
-                textStyle: "sm";
-                px: "3";
-            };
-            lg: {
-                gap: "3";
-                h: "10";
-                minW: "10";
-                borderRadius: "control.lg";
-                textStyle: "md";
-                px: "4.5";
-            };
-            xl: {
-                gap: "3";
-                h: "12";
-                minW: "12";
-                borderRadius: "control.lg";
-                textStyle: "lg";
-                px: "6";
-            };
-        };
-        variant: {
-            solid: {
-                bg: "colorPalette.solid";
-                boxShadow: "sm";
-                color: "colorPalette.contrast";
-                _hover: {
-                    bg: "colorPalette.solid/90";
-                };
-                _popupExpanded: {
-                    bg: string;
-                };
-            };
-            subtle: {
-                bg: "colorPalette.muted";
-                color: "colorPalette.fg";
-                _hover: {
-                    bg: "colorPalette.subtle";
-                };
-                _popupExpanded: {
-                    bg: string;
-                };
-            };
-            glass: {
-                bg: "colorPalette.solid";
-                color: "colorPalette.contrast";
-                '--btn-shadow': "shadows.sm";
-                boxShadow: {
-                    base: "0 0 0 1px rgba(0,0,0,0.25) inset, 0px 2px 0px 0px rgba(255,255,255,0.2) inset, var(--btn-shadow)";
-                    _dark: " 0px 1px 0px 0px rgba(255,255,255,0.2) inset, var(--btn-shadow)";
-                };
-                textShadow: "0 1px 2px rgba(0,0,0,0.3)";
-                overflow: "clip";
-                _after: {
-                    content: "\"\"";
-                    position: "absolute";
-                    top: "0";
-                    left: "0";
-                    right: "0";
-                    bottom: "0";
-                    background: "linear-gradient(180deg, white 40%, rgba(0,0,0,0.2))";
-                    opacity: number;
-                    transitionProperty: "opacity";
-                    transitionDuration: "moderate";
-                    pointerEvents: "none";
-                };
-                _hover: {
-                    bg: "colorPalette.solid";
-                    _after: {
-                        background: "linear-gradient(180deg, rgba(255,255,255,0.8) 40%, rgba(0,0,0,0.6))";
-                    };
-                };
-                _popupExpanded: {
-                    bg: string;
-                    _after: {
-                        background: string;
-                    };
-                };
-            };
-            surface: {
-                bg: "colorPalette.muted/20";
-                borderWidth: "1px";
-                borderColor: "colorPalette.emphasized/90";
-                color: "colorPalette.fg";
-                shadow: "xs";
-                _hover: {
-                    bg: "colorPalette.muted";
-                    borderColor: "colorPalette.emphasized";
-                };
-                _popupExpanded: {
-                    bg: string;
-                    borderColor: string;
-                };
-            };
-            outline: {
-                borderWidth: "0.5px";
-                borderColor: "colorPalette.emphasized";
-                color: "colorPalette.fg";
-                _hover: {
-                    bg: "colorPalette.muted";
-                };
-                _popupExpanded: {
-                    bg: string;
-                };
-            };
-            ghost: {
-                color: "colorPalette.fg";
-                _hover: {
-                    bg: "colorPalette.subtle";
-                };
-                _popupExpanded: {
-                    bg: string;
-                };
-            };
-            plain: {
-                color: "colorPalette.fg";
-            };
-        };
-    }>;
-    code: import("@chakra-ui/react").RecipeDefinition<{
-        variant: {
-            solid: {
-                bg: "colorPalette.solid";
-                color: "colorPalette.contrast";
-            };
-            subtle: {
-                bg: "colorPalette.subtle";
-                color: "colorPalette.fg";
-            };
-            outline: {
-                color: "colorPalette.fg";
-                shadow: "inset 0 0 0px 1px var(--shadow-color)";
-                shadowColor: "colorPalette.subtle";
-            };
-            surface: {
-                bg: "colorPalette.muted/20";
-                color: "colorPalette.fg";
-                shadow: "inset 0 0 0px 1px var(--shadow-color)";
-                shadowColor: "colorPalette.subtle";
-            };
-            plain: {
-                color: "colorPalette.fg";
-            };
-        };
-        size: {
-            xs: {
-                textStyle: "2xs";
-                px: "1";
-                minH: "4";
-            };
-            sm: {
-                textStyle: "xs";
-                px: "1.5";
-                minH: "5";
-            };
-            md: {
-                textStyle: "sm";
-                px: "2";
-                minH: "6";
-            };
-            lg: {
-                textStyle: "sm";
-                px: "2.5";
-                minH: "7";
-            };
-        };
-    }>;
-    container: import("@chakra-ui/react").RecipeDefinition<{
-        centerContent: {
-            true: {
-                display: "flex";
-                flexDirection: "column";
-                alignItems: "center";
-            };
-        };
-        fluid: {
-            true: {
-                maxWidth: "full";
-            };
-        };
-    }>;
-    heading: 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";
-            };
-        };
-    }>;
-    input: import("@chakra-ui/react").RecipeDefinition<{
-        size: {
-            xs: {
-                borderRadius: "control.sm";
-                textStyle: "xs";
-                px: "2";
-                '--input-height': "sizes.6";
-            };
-            sm: {
-                borderRadius: "control.md";
-                textStyle: "sm";
-                px: "2.5";
-                '--input-height': "sizes.7";
-            };
-            md: {
-                borderRadius: "control.md";
-                textStyle: "sm";
-                px: "3";
-                '--input-height': "sizes.8";
-            };
-            lg: {
-                borderRadius: "control.lg";
-                textStyle: "md";
-                px: "4.5";
-                '--input-height': "sizes.10";
-            };
-            xl: {
-                borderRadius: "control.lg";
-                textStyle: "md";
-                px: "6";
-                '--input-height': "sizes.12";
-            };
-        };
-        variant: {
-            outline: {
-                bg: "transparent";
-                borderWidth: "1px";
-                borderColor: "border";
-                focusVisibleRing: "inside";
-                focusRingWidth: "0";
-                _hover: {
-                    borderColor: "border.emphasized";
-                    _focusVisible: {
-                        borderColor: "var(--focus-ring-color)";
-                    };
-                };
-            };
-            subtle: {
-                borderWidth: "1px";
-                borderColor: "transparent";
-                bg: "bg.muted";
-                focusVisibleRing: "inside";
-            };
-            flushed: {
-                bg: "transparent";
-                borderBottomWidth: "1px";
-                borderBottomColor: "border";
-                borderRadius: "0";
-                px: "0";
-                _focusVisible: {
-                    borderColor: "var(--focus-color)";
-                    boxShadow: "0px 1px 0px 0px var(--focus-color)";
-                };
-            };
-        };
-    }>;
-    inputAddon: import("@chakra-ui/react").RecipeDefinition<{
-        size: {
-            xs: {
-                borderRadius: "control.sm";
-                textStyle: "xs";
-                px: "2";
-                '--input-height': "sizes.6";
-            };
-            sm: {
-                borderRadius: "control.md";
-                textStyle: "sm";
-                px: "2.5";
-                '--input-height': "sizes.7";
-            };
-            md: {
-                borderRadius: "control.md";
-                textStyle: "sm";
-                px: "3";
-                '--input-height': "sizes.8";
-            };
-            lg: {
-                borderRadius: "control.lg";
-                textStyle: "md";
-                px: "4.5";
-                '--input-height': "sizes.10";
-            };
-            xl: {
-                borderRadius: "control.lg";
-                textStyle: "md";
-                px: "6";
-                '--input-height': "sizes.12";
-            };
-        };
-        variant: {
-            outline: {
-                border: "1px solid";
-                borderColor: "border";
-                bg: "bg.muted";
-            };
-            subtle: {
-                border: "2px solid";
-                borderColor: "transparent";
-                bg: {
-                    _light: "gray.100";
-                    _dark: "white/10";
-                };
-            };
-            flushed: {
-                borderBottom: "1px solid";
-                borderColor: "inherit";
-                borderRadius: "0";
-                px: "0";
-                bg: "transparent";
-            };
-        };
-    }>;
-    kbd: import("@chakra-ui/react").RecipeDefinition<{
-        variant: {
-            raised: {
-                bg: "colorPalette.subtle";
-                color: "colorPalette.fg";
-                borderWidth: "1px";
-                borderBottomWidth: "2px";
-                borderColor: "colorPalette.muted";
-            };
-            outline: {
-                borderWidth: "1px";
-                color: "colorPalette.fg";
-            };
-            subtle: {
-                bg: "colorPalette.subtle";
-                color: "colorPalette.fg";
-            };
-            plain: {
-                color: "colorPalette.fg";
-            };
-        };
-        size: {
-            sm: {
-                textStyle: "xs";
-                height: "4.5";
-            };
-            md: {
-                textStyle: "xs";
-                height: "5";
-            };
-            lg: {
-                textStyle: "sm";
-                height: "6";
-            };
-        };
-    }>;
-    link: import("@chakra-ui/react").RecipeDefinition<{
-        variant: {
-            underline: {
-                color: "colorPalette.fg";
-                textDecoration: "underline";
-                textUnderlineOffset: "3px";
-                textDecorationColor: "currentColor/20";
-            };
-            plain: {
-                color: "colorPalette.fg";
-                _hover: {
-                    textDecoration: "underline";
-                    textUnderlineOffset: "3px";
-                    textDecorationColor: "currentColor/20";
-                };
-            };
-        };
-    }>;
-    mark: import("@chakra-ui/react").RecipeDefinition<{
-        variant: {
-            subtle: {
-                bg: "colorPalette.subtle";
-                color: "inherit";
-            };
-            solid: {
-                bg: "colorPalette.solid";
-                color: "colorPalette.contrast";
-            };
-            text: {
-                fontWeight: "medium";
-            };
-            plain: {};
-        };
-    }>;
-    separator: import("@chakra-ui/react").RecipeDefinition<{
-        variant: {
-            solid: {
-                borderStyle: "solid";
-            };
-            dashed: {
-                borderStyle: "dashed";
-            };
-            dotted: {
-                borderStyle: "dotted";
-            };
-        };
-        orientation: {
-            vertical: {
-                height: "100%";
-                borderInlineStartWidth: "var(--separator-thickness)";
-            };
-            horizontal: {
-                width: "100%";
-                borderTopWidth: "var(--separator-thickness)";
-            };
-        };
-        size: {
-            xs: {
-                '--separator-thickness': "0.5px";
-            };
-            sm: {
-                '--separator-thickness': "1px";
-            };
-            md: {
-                '--separator-thickness': "2px";
-            };
-            lg: {
-                '--separator-thickness': "3px";
-            };
-        };
-    }>;
-    skeleton: import("@chakra-ui/react").RecipeDefinition<{
-        loading: {
-            true: {
-                borderRadius: "panel.md";
-                boxShadow: "none";
-                backgroundClip: "padding-box";
-                cursor: "default";
-                color: "transparent";
-                pointerEvents: "none";
-                userSelect: "none";
-                flexShrink: "0";
-                '&::before, &::after, *': {
-                    visibility: "hidden";
-                };
-            };
-            false: {
-                background: "unset";
-                animation: "fade-in var(--fade-duration, 0.1s) ease-out !important";
-            };
-        };
-        variant: {
-            pulse: {
-                background: "bg.emphasized";
-                animation: "pulse";
-                animationDuration: "var(--duration, 1.2s)";
-            };
-            shine: {
-                '--animate-from': "200%";
-                '--animate-to': "-200%";
-                '--start-color': "colors.bg.muted";
-                '--end-color': "colors.bg.emphasized";
-                backgroundImage: "linear-gradient(270deg,var(--start-color),var(--end-color),var(--end-color),var(--start-color))";
-                backgroundSize: "400% 100%";
-                animation: "bg-position var(--duration, 5s) ease-in-out infinite";
-            };
-            none: {
-                animation: "none";
-                background: "bg.muted";
-            };
-        };
-    }>;
-    skipNavLink: import("@chakra-ui/react").RecipeDefinition<import("@chakra-ui/react").RecipeVariantRecord>;
-    spinner: import("@chakra-ui/react").RecipeDefinition<{
-        size: {
-            inherit: {
-                '--spinner-size': "1em";
-            };
-            xs: {
-                '--spinner-size': "sizes.3";
-            };
-            sm: {
-                '--spinner-size': "sizes.4";
-            };
-            md: {
-                '--spinner-size': "sizes.5";
-            };
-            lg: {
-                '--spinner-size': "sizes.8";
-            };
-            xl: {
-                '--spinner-size': "sizes.10";
-            };
-        };
-    }>;
-    textarea: import("@chakra-ui/react").RecipeDefinition<{
-        size: {
-            xs: {
-                borderRadius: "control.sm";
-                textStyle: "xs";
-                px: "2";
-                py: "1";
-                scrollPaddingBottom: "1";
-            };
-            sm: {
-                borderRadius: "control.md";
-                textStyle: "sm";
-                px: "2.5";
-                py: "1.5";
-                scrollPaddingBottom: "1.5";
-            };
-            md: {
-                borderRadius: "control.md";
-                textStyle: "sm";
-                px: "3";
-                py: "1.5";
-                scrollPaddingBottom: "1.5";
-            };
-            lg: {
-                borderRadius: "control.lg";
-                textStyle: "md";
-                px: "4";
-                py: "2";
-                scrollPaddingBottom: "2";
-            };
-            xl: {
-                borderRadius: "control.lg";
-                textStyle: "md";
-                px: "4.5";
-                py: "3.5";
-                scrollPaddingBottom: "3.5";
-            };
-        };
-        variant: {
-            outline: {
-                bg: "transparent";
-                borderWidth: "1px";
-                borderColor: "border";
-                focusVisibleRing: "inside";
-                focusRingWidth: number;
-            };
-            subtle: {
-                borderWidth: "1px";
-                borderColor: "transparent";
-                bg: "bg.muted";
-                focusVisibleRing: "inside";
-            };
-            flushed: {
-                bg: "transparent";
-                borderBottomWidth: "1px";
-                borderBottomColor: "border";
-                borderRadius: "0";
-                px: "0";
-                _focusVisible: {
-                    borderColor: "var(--focus-color)";
-                    boxShadow: "0px 1px 0px 0px var(--focus-color)";
-                };
-            };
-        };
-    }>;
-    icon: import("@chakra-ui/react").RecipeDefinition<{
-        size: {
-            inherit: {
-                '--icon-size': "1em";
-            };
-            xs: {
-                '--icon-size': "sizes.3";
-            };
-            sm: {
-                '--icon-size': "sizes.4";
-            };
-            md: {
-                '--icon-size': "sizes.5";
-            };
-            lg: {
-                '--icon-size': "sizes.6";
-            };
-            xl: {
-                '--icon-size': "sizes.7";
-            };
-            '2xl': {
-                '--icon-size': "sizes.8";
-            };
-        };
-    }>;
-    checkmark: import("@chakra-ui/react").RecipeDefinition<{
-        size: {
-            xs: {
-                boxSize: "3";
-            };
-            sm: {
-                boxSize: "3.5";
-            };
-            md: {
-                boxSize: "4";
-                p: "0.5";
-            };
-            lg: {
-                boxSize: "5";
-                p: "0.5";
-            };
-        };
-        variant: {
-            solid: {
-                borderColor: "border.emphasized";
-                '&:is([data-state=checked], [data-state=indeterminate])': {
-                    bg: "colorPalette.solid";
-                    color: "colorPalette.contrast";
-                    borderColor: "colorPalette.solid";
-                };
-            };
-            outline: {
-                borderColor: "border.emphasized";
-                '&:is([data-state=checked], [data-state=indeterminate])': {
-                    color: "colorPalette.fg";
-                    borderColor: "colorPalette.solid";
-                };
-            };
-            subtle: {
-                bg: "colorPalette.muted";
-                borderColor: "colorPalette.emphasized";
-                '&:is([data-state=checked], [data-state=indeterminate])': {
-                    color: "colorPalette.fg";
-                };
-            };
-            plain: {
-                '&:is([data-state=checked], [data-state=indeterminate])': {
-                    color: "colorPalette.fg";
-                };
-            };
-            inverted: {
-                borderColor: "border";
-                color: "colorPalette.fg";
-                '&:is([data-state=checked], [data-state=indeterminate])': {
-                    borderColor: "colorPalette.solid";
-                };
-            };
-        };
-    }>;
-    radiomark: import("@chakra-ui/react").RecipeDefinition<{
-        variant: {
-            solid: {
-                borderWidth: "1px";
-                borderColor: "border";
-                _checked: {
-                    bg: "colorPalette.solid";
-                    color: "colorPalette.contrast";
-                    borderColor: "colorPalette.solid";
-                };
-            };
-            subtle: {
-                borderWidth: "1px";
-                bg: "colorPalette.muted";
-                borderColor: "colorPalette.muted";
-                color: "transparent";
-                _checked: {
-                    color: "colorPalette.fg";
-                };
-            };
-            outline: {
-                borderWidth: "1px";
-                borderColor: "inherit";
-                _checked: {
-                    color: "colorPalette.fg";
-                    borderColor: "colorPalette.solid";
-                };
-                '& .dot': {
-                    scale: "0.6";
-                };
-            };
-            inverted: {
-                bg: "bg";
-                borderWidth: "1px";
-                borderColor: "inherit";
-                _checked: {
-                    color: "colorPalette.solid";
-                    borderColor: "currentcolor";
-                };
-            };
-        };
-        size: {
-            xs: {
-                boxSize: "3";
-            };
-            sm: {
-                boxSize: "3.5";
-            };
-            md: {
-                boxSize: "4";
-            };
-            lg: {
-                boxSize: "5";
-            };
-        };
-    }>;
-    suiCommand: import("@chakra-ui/react").RecipeDefinition<{
-        size: {
-            sm: {
-                fontSize: "xs";
-            };
-            md: {
-                fontSize: "sm";
-            };
-            lg: {
-                fontSize: "md";
-            };
-        };
-    }>;
-    suiIconBadge: import("@chakra-ui/react").RecipeDefinition<{
-        variant: {
-            outline: {
-                borderWidth: "1px";
-                borderColor: "colorPalette.subtle";
-                color: "colorPalette.fg";
-            };
-            solid: {
-                bg: "colorPalette.solid";
-                color: "white";
-            };
-            subtle: {
-                bg: "colorPalette.subtle";
-                color: "colorPalette.fg";
-            };
-        };
-        size: {
-            sm: {
-                borderRadius: "sm";
-                fontSize: "0.9em";
-                w: number;
-                h: number;
-            };
-            md: {
-                borderRadius: "md";
-                fontSize: "1.1em";
-                w: number;
-                h: number;
-            };
-            lg: {
-                borderRadius: "md";
-                fontSize: "1.3em";
-                w: number;
-                h: number;
-            };
-            xl: {
-                borderRadius: "md";
-                fontSize: "1.5em";
-                w: number;
-                h: number;
-            };
-        };
-    }>;
-};