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

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

@@ -1,52 +0,0 @@
-export declare const blockquoteSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "root" | "icon" | "caption", {
-    justify: {
-        start: {
-            root: {
-                alignItems: "flex-start";
-                textAlign: "start";
-            };
-        };
-        center: {
-            root: {
-                alignItems: "center";
-                textAlign: "center";
-            };
-        };
-        end: {
-            root: {
-                alignItems: "flex-end";
-                textAlign: "end";
-            };
-        };
-    };
-    variant: {
-        subtle: {
-            root: {
-                paddingX: "5";
-                borderStartWidth: "4px";
-                borderStartColor: "colorPalette.muted";
-            };
-            icon: {
-                color: "colorPalette.fg";
-            };
-        };
-        solid: {
-            root: {
-                paddingX: "5";
-                borderStartWidth: "4px";
-                borderStartColor: "colorPalette.solid";
-            };
-            icon: {
-                color: "colorPalette.solid";
-            };
-        };
-        plain: {
-            root: {
-                paddingX: "5";
-            };
-            icon: {
-                color: "colorPalette.solid";
-            };
-        };
-    };
-}>;

package/dist/components/blockquote/blockquote.recipe.js

@@ -1,77 +0,0 @@
-import { blockquoteAnatomy } from '@chakra-ui/react/anatomy';
-import { defineSlotRecipe } from '@chakra-ui/react/styled-system';
-export const blockquoteSlotRecipe = defineSlotRecipe({
-    className: 'chakra-blockquote',
-    slots: blockquoteAnatomy.keys(),
-    base: {
-        root: {
-            position: 'relative',
-            display: 'flex',
-            flexDirection: 'column',
-            gap: '2',
-        },
-        caption: {
-            textStyle: 'sm',
-            color: 'fg.muted',
-        },
-        icon: {
-            boxSize: '5',
-        },
-    },
-    variants: {
-        justify: {
-            start: {
-                root: {
-                    alignItems: 'flex-start',
-                    textAlign: 'start',
-                },
-            },
-            center: {
-                root: {
-                    alignItems: 'center',
-                    textAlign: 'center',
-                },
-            },
-            end: {
-                root: {
-                    alignItems: 'flex-end',
-                    textAlign: 'end',
-                },
-            },
-        },
-        variant: {
-            subtle: {
-                root: {
-                    paddingX: '5',
-                    borderStartWidth: '4px',
-                    borderStartColor: 'colorPalette.muted',
-                },
-                icon: {
-                    color: 'colorPalette.fg',
-                },
-            },
-            solid: {
-                root: {
-                    paddingX: '5',
-                    borderStartWidth: '4px',
-                    borderStartColor: 'colorPalette.solid',
-                },
-                icon: {
-                    color: 'colorPalette.solid',
-                },
-            },
-            plain: {
-                root: {
-                    paddingX: '5',
-                },
-                icon: {
-                    color: 'colorPalette.solid',
-                },
-            },
-        },
-    },
-    defaultVariants: {
-        variant: 'subtle',
-        justify: 'start',
-    },
-});

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

@@ -1,46 +0,0 @@
-export declare const breadcrumbSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"link" | "root" | "item" | "separator" | "currentLink" | "list" | "ellipsis", {
-    variant: {
-        underline: {
-            link: {
-                color: "colorPalette.fg";
-                textDecoration: "underline";
-                textUnderlineOffset: "0.2em";
-                textDecorationColor: "colorPalette.muted";
-            };
-            currentLink: {
-                color: "colorPalette.fg";
-            };
-        };
-        plain: {
-            link: {
-                color: "fg.muted";
-                _hover: {
-                    color: "fg";
-                };
-            };
-            currentLink: {
-                color: "fg";
-            };
-        };
-    };
-    size: {
-        sm: {
-            list: {
-                gap: "1";
-                textStyle: "xs";
-            };
-        };
-        md: {
-            list: {
-                gap: "1.5";
-                textStyle: "sm";
-            };
-        };
-        lg: {
-            list: {
-                gap: "2";
-                textStyle: "md";
-            };
-        };
-    };
-}>;

package/dist/components/breadcrumb/breadcrumb.recipe.js

@@ -1,90 +0,0 @@
-import { breadcrumbAnatomy } from '@chakra-ui/react/anatomy';
-import { defineSlotRecipe } from '@chakra-ui/react/styled-system';
-export const breadcrumbSlotRecipe = defineSlotRecipe({
-    className: 'chakra-breadcrumb',
-    slots: breadcrumbAnatomy.keys(),
-    base: {
-        list: {
-            display: 'flex',
-            alignItems: 'center',
-            wordBreak: 'break-word',
-            color: 'fg.muted',
-        },
-        link: {
-            outline: '0',
-            textDecoration: 'none',
-            borderRadius: 'control.sm',
-            focusRing: 'outside',
-            display: 'inline-flex',
-            alignItems: 'center',
-            gap: '2',
-        },
-        item: {
-            display: 'inline-flex',
-            alignItems: 'center',
-        },
-        separator: {
-            color: 'fg.muted',
-            opacity: '0.8',
-            _icon: {
-                boxSize: '1em',
-            },
-        },
-        ellipsis: {
-            display: 'inline-flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            _icon: {
-                boxSize: '1em',
-            },
-        },
-    },
-    variants: {
-        variant: {
-            underline: {
-                link: {
-                    color: 'colorPalette.fg',
-                    textDecoration: 'underline',
-                    textUnderlineOffset: '0.2em',
-                    textDecorationColor: 'colorPalette.muted',
-                },
-                currentLink: {
-                    color: 'colorPalette.fg',
-                },
-            },
-            plain: {
-                link: {
-                    color: 'fg.muted',
-                    _hover: { color: 'fg' },
-                },
-                currentLink: {
-                    color: 'fg',
-                },
-            },
-        },
-        size: {
-            sm: {
-                list: {
-                    gap: '1',
-                    textStyle: 'xs',
-                },
-            },
-            md: {
-                list: {
-                    gap: '1.5',
-                    textStyle: 'sm',
-                },
-            },
-            lg: {
-                list: {
-                    gap: '2',
-                    textStyle: 'md',
-                },
-            },
-        },
-    },
-    defaultVariants: {
-        variant: 'plain',
-        size: 'md',
-    },
-});

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

@@ -1,141 +0,0 @@
-export declare const buttonRecipe: 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";
-        };
-    };
-}>;

package/dist/components/button/button.recipe.js

@@ -1,185 +0,0 @@
-import { defineRecipe } from '@chakra-ui/react/styled-system';
-export const buttonRecipe = defineRecipe({
-    className: 'chakra-button',
-    base: {
-        colorPalette: 'gray',
-        display: 'inline-flex',
-        appearance: 'none',
-        alignItems: 'center',
-        justifyContent: 'center',
-        userSelect: 'none',
-        position: 'relative',
-        whiteSpace: 'nowrap',
-        verticalAlign: 'middle',
-        cursor: 'pointer',
-        flexShrink: '0',
-        outline: '0',
-        lineHeight: '1.2',
-        isolation: 'isolate',
-        fontWeight: 'medium',
-        transitionProperty: 'common',
-        transitionDuration: 'moderate',
-        focusVisibleRing: 'outside',
-        _disabled: {
-            layerStyle: 'disabled',
-        },
-        _icon: {
-            fontSize: '1em',
-            flexShrink: 0,
-        },
-    },
-    variants: {
-        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: 'colorPalette.solid/90',
-                },
-            },
-            subtle: {
-                bg: 'colorPalette.muted',
-                color: 'colorPalette.fg',
-                _hover: {
-                    bg: 'colorPalette.subtle',
-                },
-                _popupExpanded: {
-                    bg: 'colorPalette.subtle',
-                },
-            },
-            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: 0.2,
-                    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: 'colorPalette.solid',
-                    _after: {
-                        background: 'linear-gradient(180deg, rgba(255,255,255,0.8) 40%, rgba(0,0,0,0.6))',
-                    },
-                },
-            },
-            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: 'colorPalette.muted',
-                    borderColor: 'colorPalette.emphasized',
-                },
-            },
-            outline: {
-                borderWidth: '0.5px',
-                borderColor: 'colorPalette.emphasized',
-                color: 'colorPalette.fg',
-                _hover: {
-                    bg: 'colorPalette.muted',
-                },
-                _popupExpanded: {
-                    bg: 'colorPalette.muted',
-                },
-            },
-            ghost: {
-                color: 'colorPalette.fg',
-                _hover: {
-                    bg: 'colorPalette.subtle',
-                },
-                _popupExpanded: {
-                    bg: 'colorPalette.subtle',
-                },
-            },
-            plain: {
-                color: 'colorPalette.fg',
-            },
-        },
-    },
-    compoundVariants: [
-        {
-            variant: 'plain',
-            css: {
-                px: 0,
-            },
-        },
-    ],
-    defaultVariants: {
-        size: 'md',
-        variant: 'surface',
-        colorPalette: 'gray',
-    },
-});

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

@@ -1,78 +0,0 @@
-export declare const cardSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "body" | "root" | "title" | "header" | "footer", {
-    size: {
-        sm: {
-            root: {
-                '--card-padding': "spacing.2.5";
-            };
-            title: {
-                fontSize: "sm";
-            };
-        };
-        md: {
-            root: {
-                '--card-padding': "spacing.4";
-            };
-            title: {
-                fontSize: "md";
-            };
-        };
-        lg: {
-            root: {
-                '--card-padding': "spacing.6";
-            };
-            title: {
-                fontSize: "lg";
-            };
-        };
-    };
-    variant: {
-        elevated: {
-            root: {
-                bg: "bg.panel";
-                boxShadow: "md";
-                borderWidth: "0.5px";
-                borderColor: "border";
-                _pressable: {
-                    transitionProperty: string;
-                    transitionDuration: string;
-                    _hover: {
-                        borderColor: string;
-                    };
-                };
-            };
-        };
-        outline: {
-            root: {
-                bg: "bg.panel";
-                borderWidth: "1px";
-                borderColor: "border";
-                _pressable: {
-                    transitionProperty: string;
-                    transitionDuration: string;
-                    _hover: {
-                        borderColor: string;
-                    };
-                };
-            };
-        };
-        subtle: {
-            root: {
-                bg: "colorPalette.muted";
-            };
-        };
-        solid: {
-            root: {
-                bg: "colorPalette.solid";
-                color: "colorPalette.contrast";
-                _pressable: {
-                    _hover: {
-                        bg: string;
-                    };
-                };
-            };
-            description: {
-                color: "colorPalette.contrast/80";
-            };
-        };
-    };
-}>;