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

package/dist/components/icon-badge/icon-badge.recipe.js

@@ -1,57 +0,0 @@
-import { defineRecipe } from '@chakra-ui/react/styled-system';
-export const iconBadgeRecipe = defineRecipe({
-    className: 'sui-icon-badge',
-    base: {
-        colorPalette: 'gray',
-        display: 'inline-flex',
-        alignItems: 'center',
-        justifyContent: 'center',
-    },
-    variants: {
-        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: 6,
-                h: 6,
-            },
-            md: {
-                borderRadius: 'md',
-                fontSize: '1.1em',
-                w: 8,
-                h: 8,
-            },
-            lg: {
-                borderRadius: 'md',
-                fontSize: '1.3em',
-                w: 10,
-                h: 10,
-            },
-            xl: {
-                borderRadius: 'md',
-                fontSize: '1.5em',
-                w: 12,
-                h: 12,
-            },
-        },
-    },
-    defaultVariants: {
-        variant: 'outline',
-        size: 'md',
-    },
-});

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

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

package/dist/components/input/input.recipe.js

@@ -1,93 +0,0 @@
-import { defineRecipe } from '@chakra-ui/react/styled-system';
-export const inputRecipe = defineRecipe({
-    className: 'chakra-input',
-    base: {
-        width: '100%',
-        minWidth: '0',
-        outline: '0',
-        position: 'relative',
-        appearance: 'none',
-        textAlign: 'start',
-        _disabled: {
-            layerStyle: 'disabled',
-        },
-        height: 'var(--input-height)',
-        minW: 'var(--input-height)',
-        '--focus-color': 'colors.colorPalette.focusRing',
-        '--error-color': 'colors.border.error',
-        _invalid: {
-            focusRingColor: 'var(--error-color)',
-            borderColor: 'var(--error-color)',
-        },
-    },
-    variants: {
-        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)',
-                },
-            },
-        },
-    },
-    defaultVariants: {
-        size: 'md',
-        variant: 'outline',
-    },
-});

package/dist/components/input-addon/input-addon.recipe.d.ts

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

package/dist/components/input-addon/input-addon.recipe.js

@@ -1,36 +0,0 @@
-import { defineRecipe } from '@chakra-ui/react/styled-system';
-import { inputRecipe } from "../input/input.recipe.js";
-export const inputAddonRecipe = defineRecipe({
-    className: 'chakra-input-addon',
-    base: {
-        flex: '0 0 auto',
-        width: 'auto',
-        height: 'var(--input-height)',
-        display: 'flex',
-        alignItems: 'center',
-        whiteSpace: 'nowrap',
-    },
-    variants: {
-        size: inputRecipe.variants.size,
-        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',
-            },
-        },
-    },
-    defaultVariants: inputRecipe.defaultVariants,
-});

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

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

package/dist/components/kbd/kbd.recipe.js

@@ -1,56 +0,0 @@
-import { defineRecipe } from '@chakra-ui/react/styled-system';
-export const kbdRecipe = defineRecipe({
-    className: 'chakra-kbd',
-    base: {
-        display: 'inline-flex',
-        alignItems: 'center',
-        fontWeight: 'medium',
-        fontFamily: 'body',
-        flexShrink: '0',
-        whiteSpace: 'nowrap',
-        wordSpacing: '-0.5em',
-        userSelect: 'none',
-        px: '1',
-        borderRadius: 'indicator.md',
-    },
-    variants: {
-        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',
-            },
-        },
-    },
-    defaultVariants: {
-        size: 'md',
-        variant: 'subtle',
-    },
-});

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

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

package/dist/components/link/link.recipe.js

@@ -1,34 +0,0 @@
-import { defineRecipe } from '@chakra-ui/react/styled-system';
-export const linkRecipe = defineRecipe({
-    className: 'chakra-link',
-    base: {
-        display: 'inline-flex',
-        alignItems: 'center',
-        outline: 'none',
-        gap: '1.5',
-        cursor: 'pointer',
-        borderRadius: 'control.sm',
-        focusRing: 'outside',
-    },
-    variants: {
-        variant: {
-            underline: {
-                color: 'colorPalette.fg',
-                textDecoration: 'underline',
-                textUnderlineOffset: '3px',
-                textDecorationColor: 'currentColor/20',
-            },
-            plain: {
-                color: 'colorPalette.fg',
-                _hover: {
-                    textDecoration: 'underline',
-                    textUnderlineOffset: '3px',
-                    textDecorationColor: 'currentColor/20',
-                },
-            },
-        },
-    },
-    defaultVariants: {
-        variant: 'plain',
-    },
-});

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

@@ -1,38 +0,0 @@
-export declare const listSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"indicator" | "root" | "item", {
-    variant: {
-        marker: {
-            root: {
-                listStyle: "revert";
-                listStylePosition: "inside";
-            };
-            item: {
-                _marker: {
-                    color: "fg.subtle";
-                };
-            };
-        };
-        plain: {
-            item: {
-                alignItems: "flex-start";
-                display: "inline-flex";
-            };
-        };
-    };
-    align: {
-        center: {
-            item: {
-                alignItems: "center";
-            };
-        };
-        start: {
-            item: {
-                alignItems: "flex-start";
-            };
-        };
-        end: {
-            item: {
-                alignItems: "flex-end";
-            };
-        };
-    };
-}>;

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

@@ -1,62 +0,0 @@
-import { listAnatomy } from '@chakra-ui/react/anatomy';
-import { defineSlotRecipe } from '@chakra-ui/react/styled-system';
-export const listSlotRecipe = defineSlotRecipe({
-    className: 'chakra-list',
-    slots: listAnatomy.keys(),
-    base: {
-        root: {
-            display: 'flex',
-            flexDirection: 'column',
-            gap: 'var(--list-gap)',
-            '& :where(ul, ol)': {
-                marginTop: 'var(--list-gap)',
-            },
-        },
-        item: {
-            whiteSpace: 'normal',
-            display: 'list-item',
-        },
-        indicator: {
-            marginEnd: '2',
-            minHeight: '1lh',
-            flexShrink: 0,
-            display: 'inline-block',
-            verticalAlign: 'middle',
-        },
-    },
-    variants: {
-        variant: {
-            marker: {
-                root: {
-                    listStyle: 'revert',
-                    listStylePosition: 'inside',
-                },
-                item: {
-                    _marker: {
-                        color: 'fg.subtle',
-                    },
-                },
-            },
-            plain: {
-                item: {
-                    alignItems: 'flex-start',
-                    display: 'inline-flex',
-                },
-            },
-        },
-        align: {
-            center: {
-                item: { alignItems: 'center' },
-            },
-            start: {
-                item: { alignItems: 'flex-start' },
-            },
-            end: {
-                item: { alignItems: 'flex-end' },
-            },
-        },
-    },
-    defaultVariants: {
-        variant: 'marker',
-    },
-});

package/dist/components/loading-overlay/loading-overlay.recipe.d.ts

@@ -1,26 +0,0 @@
-export declare const loadingOverlaySlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"text" | "root", {
-    variant: {
-        fill: {
-            root: {
-                flex: number;
-                height: "100%";
-                bg: "currentBg";
-            };
-        };
-        fullscreen: {
-            root: {
-                position: "fixed";
-                inset: number;
-                zIndex: "modal";
-                bg: "bg";
-            };
-        };
-        overlay: {
-            root: {
-                position: "absolute";
-                inset: number;
-                bg: "currentBg/50";
-            };
-        };
-    };
-}>;

package/dist/components/loading-overlay/loading-overlay.recipe.js

@@ -1,51 +0,0 @@
-import { defineSlotRecipe } from '@chakra-ui/react';
-export const loadingOverlaySlotRecipe = defineSlotRecipe({
-    className: 'sui-loading-overlay',
-    slots: ['root', 'text'],
-    base: {
-        root: {
-            display: 'flex',
-            flexDirection: 'column',
-            alignItems: 'center',
-            justifyContent: 'center',
-            p: 4,
-            transitionProperty: 'opacity',
-            transitionDuration: 'slower',
-            _open: {
-                opacity: 1,
-            },
-            _closed: {
-                opacity: 0,
-            },
-        },
-    },
-    variants: {
-        variant: {
-            fill: {
-                root: {
-                    flex: 1,
-                    height: '100%',
-                    bg: 'currentBg',
-                },
-            },
-            fullscreen: {
-                root: {
-                    position: 'fixed',
-                    inset: 0,
-                    zIndex: 'modal',
-                    bg: 'bg',
-                },
-            },
-            overlay: {
-                root: {
-                    position: 'absolute',
-                    inset: 0,
-                    bg: 'currentBg/50',
-                },
-            },
-        },
-    },
-    defaultVariants: {
-        variant: 'fill',
-    },
-});

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

@@ -1,16 +0,0 @@
-export declare const markRecipe: import("@chakra-ui/react").RecipeDefinition<{
-    variant: {
-        subtle: {
-            bg: "colorPalette.subtle";
-            color: "inherit";
-        };
-        solid: {
-            bg: "colorPalette.solid";
-            color: "colorPalette.contrast";
-        };
-        text: {
-            fontWeight: "medium";
-        };
-        plain: {};
-    };
-}>;

package/dist/components/mark/mark.recipe.js

@@ -1,25 +0,0 @@
-import { defineRecipe } from '@chakra-ui/react/styled-system';
-export const markRecipe = defineRecipe({
-    className: 'chakra-mark',
-    base: {
-        bg: 'transparent',
-        color: 'inherit',
-        whiteSpace: 'nowrap',
-    },
-    variants: {
-        variant: {
-            subtle: {
-                bg: 'colorPalette.subtle',
-                color: 'inherit',
-            },
-            solid: {
-                bg: 'colorPalette.solid',
-                color: 'colorPalette.contrast',
-            },
-            text: {
-                fontWeight: 'medium',
-            },
-            plain: {},
-        },
-    },
-});