@saas-ui/react 3.0.0-next.44 → 3.0.0-next.48

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

@@ -1,188 +0,0 @@
-export declare const checkboxCardSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "content" | "label" | "control" | "indicator" | "root" | "addon", {
-    size: {
-        sm: {
-            root: {
-                textStyle: "sm";
-            };
-            control: {
-                padding: "3";
-                gap: "1.5";
-            };
-            addon: {
-                px: "3";
-                py: "1.5";
-                borderTopWidth: "1px";
-            };
-            indicator: {
-                boxSize: "3.5";
-            } | undefined;
-        };
-        md: {
-            root: {
-                textStyle: "sm";
-            };
-            control: {
-                padding: "4";
-                gap: "2.5";
-            };
-            addon: {
-                px: "4";
-                py: "2";
-                borderTopWidth: "1px";
-            };
-            indicator: {
-                boxSize: "4";
-                p: "0.5";
-            } | undefined;
-        };
-        lg: {
-            root: {
-                textStyle: "md";
-            };
-            control: {
-                padding: "4";
-                gap: "3.5";
-            };
-            addon: {
-                px: "4";
-                py: "2";
-                borderTopWidth: "1px";
-            };
-            indicator: {
-                boxSize: "5";
-                p: "0.5";
-            } | undefined;
-        };
-    };
-    variant: {
-        surface: {
-            root: {
-                borderWidth: "1px";
-                borderColor: "border";
-                _checked: {
-                    bg: "colorPalette.subtle";
-                    color: "colorPalette.fg";
-                    borderColor: "colorPalette.muted";
-                };
-                _disabled: {
-                    bg: "bg.muted";
-                };
-            };
-            indicator: {
-                borderColor: "border.emphasized";
-                '&:is([data-state=checked], [data-state=indeterminate])': {
-                    bg: "colorPalette.solid";
-                    color: "colorPalette.contrast";
-                    borderColor: "colorPalette.solid";
-                };
-            } | undefined;
-        };
-        subtle: {
-            root: {
-                bg: "bg.muted";
-            };
-            control: {
-                _checked: {
-                    bg: "colorPalette.muted";
-                    color: "colorPalette.fg";
-                };
-            };
-            indicator: {
-                '&:is([data-state=checked], [data-state=indeterminate])': {
-                    color: "colorPalette.fg";
-                };
-            } | undefined;
-        };
-        outline: {
-            root: {
-                borderWidth: "1px";
-                borderColor: "border";
-                _checked: {
-                    boxShadow: "0 0 0 1px var(--shadow-color)";
-                    boxShadowColor: "colorPalette.solid";
-                    borderColor: "colorPalette.solid";
-                };
-            };
-            indicator: {
-                borderColor: "border.emphasized";
-                '&:is([data-state=checked], [data-state=indeterminate])': {
-                    bg: "colorPalette.solid";
-                    color: "colorPalette.contrast";
-                    borderColor: "colorPalette.solid";
-                };
-            } | undefined;
-        };
-        solid: {
-            root: {
-                borderWidth: "1px";
-                _checked: {
-                    bg: "colorPalette.solid";
-                    color: "colorPalette.contrast";
-                    borderColor: "colorPalette.solid";
-                };
-            };
-            indicator: {
-                borderColor: "border";
-                color: "colorPalette.fg";
-                '&:is([data-state=checked], [data-state=indeterminate])': {
-                    borderColor: "colorPalette.solid";
-                };
-            } | undefined;
-        };
-    };
-    justify: {
-        start: {
-            root: {
-                '--checkbox-card-justify': "flex-start";
-            };
-        };
-        end: {
-            root: {
-                '--checkbox-card-justify': "flex-end";
-            };
-        };
-        center: {
-            root: {
-                '--checkbox-card-justify': "center";
-            };
-        };
-    };
-    align: {
-        start: {
-            root: {
-                '--checkbox-card-align': "flex-start";
-            };
-            content: {
-                textAlign: "start";
-            };
-        };
-        end: {
-            root: {
-                '--checkbox-card-align': "flex-end";
-            };
-            content: {
-                textAlign: "end";
-            };
-        };
-        center: {
-            root: {
-                '--checkbox-card-align': "center";
-            };
-            content: {
-                textAlign: "center";
-            };
-        };
-    };
-    orientation: {
-        vertical: {
-            control: {
-                flexDirection: "column";
-            };
-        };
-        horizontal: {
-            control: {
-                flexDirection: "row";
-            };
-        };
-    };
-}>;

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

@@ -1,202 +0,0 @@
-import { checkboxCardAnatomy } from '@chakra-ui/react/anatomy';
-import { defineSlotRecipe } from '@chakra-ui/react/styled-system';
-import { checkmarkRecipe } from "../checkmark/checkmark.recipe.js";
-export const checkboxCardSlotRecipe = defineSlotRecipe({
-    slots: checkboxCardAnatomy.keys(),
-    className: 'chakra-checkbox-card',
-    base: {
-        root: {
-            colorPalette: 'accent',
-            display: 'flex',
-            flexDirection: 'column',
-            userSelect: 'none',
-            position: 'relative',
-            borderRadius: 'panel.md',
-            flex: '1',
-            focusVisibleRing: 'outside',
-            _disabled: {
-                opacity: '0.8',
-                borderColor: 'border.subtle',
-            },
-            _invalid: {
-                outline: '2px solid',
-                outlineColor: 'border.error',
-            },
-        },
-        control: {
-            display: 'inline-flex',
-            flex: '1',
-            position: 'relative',
-            borderRadius: 'panel.md',
-            justifyContent: 'var(--checkbox-card-justify)',
-            alignItems: 'var(--checkbox-card-align)',
-        },
-        label: {
-            fontWeight: 'medium',
-            display: 'flex',
-            alignItems: 'center',
-            gap: '2',
-            _disabled: {
-                opacity: '0.5',
-            },
-        },
-        description: {
-            opacity: '0.64',
-            textStyle: 'sm',
-        },
-        addon: {
-            _disabled: {
-                opacity: '0.5',
-            },
-        },
-        indicator: checkmarkRecipe.base,
-        content: {
-            display: 'flex',
-            flexDirection: 'column',
-            flex: '1',
-            gap: '1',
-            justifyContent: 'var(--checkbox-card-justify)',
-            alignItems: 'var(--checkbox-card-align)',
-        },
-    },
-    variants: {
-        size: {
-            sm: {
-                root: {
-                    textStyle: 'sm',
-                },
-                control: {
-                    padding: '3',
-                    gap: '1.5',
-                },
-                addon: {
-                    px: '3',
-                    py: '1.5',
-                    borderTopWidth: '1px',
-                },
-                indicator: checkmarkRecipe.variants?.size.sm,
-            },
-            md: {
-                root: {
-                    textStyle: 'sm',
-                },
-                control: {
-                    padding: '4',
-                    gap: '2.5',
-                },
-                addon: {
-                    px: '4',
-                    py: '2',
-                    borderTopWidth: '1px',
-                },
-                indicator: checkmarkRecipe.variants?.size.md,
-            },
-            lg: {
-                root: {
-                    textStyle: 'md',
-                },
-                control: {
-                    padding: '4',
-                    gap: '3.5',
-                },
-                addon: {
-                    px: '4',
-                    py: '2',
-                    borderTopWidth: '1px',
-                },
-                indicator: checkmarkRecipe.variants?.size.lg,
-            },
-        },
-        variant: {
-            surface: {
-                root: {
-                    borderWidth: '1px',
-                    borderColor: 'border',
-                    _checked: {
-                        bg: 'colorPalette.subtle',
-                        color: 'colorPalette.fg',
-                        borderColor: 'colorPalette.muted',
-                    },
-                    _disabled: {
-                        bg: 'bg.muted',
-                    },
-                },
-                indicator: checkmarkRecipe.variants?.variant.solid,
-            },
-            subtle: {
-                root: {
-                    bg: 'bg.muted',
-                },
-                control: {
-                    _checked: {
-                        bg: 'colorPalette.muted',
-                        color: 'colorPalette.fg',
-                    },
-                },
-                indicator: checkmarkRecipe.variants?.variant.plain,
-            },
-            outline: {
-                root: {
-                    borderWidth: '1px',
-                    borderColor: 'border',
-                    _checked: {
-                        boxShadow: '0 0 0 1px var(--shadow-color)',
-                        boxShadowColor: 'colorPalette.solid',
-                        borderColor: 'colorPalette.solid',
-                    },
-                },
-                indicator: checkmarkRecipe.variants?.variant.solid,
-            },
-            solid: {
-                root: {
-                    borderWidth: '1px',
-                    _checked: {
-                        bg: 'colorPalette.solid',
-                        color: 'colorPalette.contrast',
-                        borderColor: 'colorPalette.solid',
-                    },
-                },
-                indicator: checkmarkRecipe.variants?.variant.inverted,
-            },
-        },
-        justify: {
-            start: {
-                root: { '--checkbox-card-justify': 'flex-start' },
-            },
-            end: {
-                root: { '--checkbox-card-justify': 'flex-end' },
-            },
-            center: {
-                root: { '--checkbox-card-justify': 'center' },
-            },
-        },
-        align: {
-            start: {
-                root: { '--checkbox-card-align': 'flex-start' },
-                content: { textAlign: 'start' },
-            },
-            end: {
-                root: { '--checkbox-card-align': 'flex-end' },
-                content: { textAlign: 'end' },
-            },
-            center: {
-                root: { '--checkbox-card-align': 'center' },
-                content: { textAlign: 'center' },
-            },
-        },
-        orientation: {
-            vertical: {
-                control: { flexDirection: 'column' },
-            },
-            horizontal: {
-                control: { flexDirection: 'row' },
-            },
-        },
-    },
-    defaultVariants: {
-        size: 'md',
-        variant: 'outline',
-        align: 'start',
-        orientation: 'horizontal',
-    },
-});

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

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

package/dist/components/checkmark/checkmark.recipe.js

@@ -1,80 +0,0 @@
-import { defineRecipe } from '@chakra-ui/react/styled-system';
-export const checkmarkRecipe = defineRecipe({
-    className: 'chakra-checkmark',
-    base: {
-        display: 'inline-flex',
-        alignItems: 'center',
-        justifyContent: 'center',
-        flexShrink: '0',
-        color: 'white',
-        borderWidth: '1px',
-        borderColor: 'transparent',
-        borderRadius: 'control.md',
-        focusVisibleRing: 'outside',
-        _invalid: {
-            colorPalette: 'red',
-            borderColor: 'border.error',
-        },
-        _disabled: {
-            opacity: '0.5',
-        },
-    },
-    variants: {
-        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',
-                },
-            },
-        },
-    },
-    defaultVariants: {
-        variant: 'solid',
-        size: 'md',
-    },
-});

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

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

package/dist/components/code/code.recipe.js

@@ -1,14 +0,0 @@
-import { defineRecipe } from '@chakra-ui/react/styled-system';
-import { badgeRecipe } from "../badge/badge.recipe.js";
-const { variants, defaultVariants } = badgeRecipe;
-export const codeRecipe = defineRecipe({
-    className: 'chakra-code',
-    base: {
-        fontFamily: 'mono',
-        alignItems: 'center',
-        display: 'inline-flex',
-        borderRadius: 'indicator.md',
-    },
-    variants,
-    defaultVariants,
-});

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

@@ -1 +0,0 @@
-export declare const collapsibleSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "indicator" | "root" | "trigger", import("@chakra-ui/react").SlotRecipeVariantRecord<"content" | "indicator" | "root" | "trigger">>;

package/dist/components/collapsible/collapsible.recipe.js

@@ -1,19 +0,0 @@
-import { collapsibleAnatomy } from '@chakra-ui/react/anatomy';
-import { defineSlotRecipe } from '@chakra-ui/react/styled-system';
-export const collapsibleSlotRecipe = defineSlotRecipe({
-    slots: collapsibleAnatomy.keys(),
-    className: 'chakra-collapsible',
-    base: {
-        content: {
-            _open: {
-                animationName: 'expand-height, fade-in',
-                animationDuration: 'moderate',
-            },
-            _closed: {
-                animationName: 'collapse-height, fade-out',
-                animationDuration: 'moderate',
-                overflow: 'hidden',
-            },
-        },
-    },
-});