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

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

@@ -1,236 +0,0 @@
-export declare const pinInputSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "control" | "root" | "input", {
-    size: {
-        sm: {
-            input: {
-                px: number;
-                borderRadius: "control.sm";
-                textStyle: "xs";
-                '--input-height': "sizes.6";
-            } | {
-                px: number;
-                borderRadius: "control.md";
-                textStyle: "sm";
-                '--input-height': "sizes.7";
-            } | {
-                px: number;
-                borderRadius: "control.md";
-                textStyle: "sm";
-                '--input-height': "sizes.8";
-            } | {
-                px: number;
-                borderRadius: "control.lg";
-                textStyle: "md";
-                '--input-height': "sizes.10";
-            } | {
-                px: number;
-                borderRadius: "control.lg";
-                textStyle: "md";
-                '--input-height': "sizes.12";
-            };
-        };
-        md: {
-            input: {
-                px: number;
-                borderRadius: "control.sm";
-                textStyle: "xs";
-                '--input-height': "sizes.6";
-            } | {
-                px: number;
-                borderRadius: "control.md";
-                textStyle: "sm";
-                '--input-height': "sizes.7";
-            } | {
-                px: number;
-                borderRadius: "control.md";
-                textStyle: "sm";
-                '--input-height': "sizes.8";
-            } | {
-                px: number;
-                borderRadius: "control.lg";
-                textStyle: "md";
-                '--input-height': "sizes.10";
-            } | {
-                px: number;
-                borderRadius: "control.lg";
-                textStyle: "md";
-                '--input-height': "sizes.12";
-            };
-        };
-        lg: {
-            input: {
-                px: number;
-                borderRadius: "control.sm";
-                textStyle: "xs";
-                '--input-height': "sizes.6";
-            } | {
-                px: number;
-                borderRadius: "control.md";
-                textStyle: "sm";
-                '--input-height': "sizes.7";
-            } | {
-                px: number;
-                borderRadius: "control.md";
-                textStyle: "sm";
-                '--input-height': "sizes.8";
-            } | {
-                px: number;
-                borderRadius: "control.lg";
-                textStyle: "md";
-                '--input-height': "sizes.10";
-            } | {
-                px: number;
-                borderRadius: "control.lg";
-                textStyle: "md";
-                '--input-height': "sizes.12";
-            };
-        };
-        xl: {
-            input: {
-                px: number;
-                borderRadius: "control.sm";
-                textStyle: "xs";
-                '--input-height': "sizes.6";
-            } | {
-                px: number;
-                borderRadius: "control.md";
-                textStyle: "sm";
-                '--input-height': "sizes.7";
-            } | {
-                px: number;
-                borderRadius: "control.md";
-                textStyle: "sm";
-                '--input-height': "sizes.8";
-            } | {
-                px: number;
-                borderRadius: "control.lg";
-                textStyle: "md";
-                '--input-height': "sizes.10";
-            } | {
-                px: number;
-                borderRadius: "control.lg";
-                textStyle: "md";
-                '--input-height': "sizes.12";
-            };
-        };
-        xs: {
-            input: {
-                px: number;
-                borderRadius: "control.sm";
-                textStyle: "xs";
-                '--input-height': "sizes.6";
-            } | {
-                px: number;
-                borderRadius: "control.md";
-                textStyle: "sm";
-                '--input-height': "sizes.7";
-            } | {
-                px: number;
-                borderRadius: "control.md";
-                textStyle: "sm";
-                '--input-height': "sizes.8";
-            } | {
-                px: number;
-                borderRadius: "control.lg";
-                textStyle: "md";
-                '--input-height': "sizes.10";
-            } | {
-                px: number;
-                borderRadius: "control.lg";
-                textStyle: "md";
-                '--input-height': "sizes.12";
-            };
-        };
-    };
-    variant: {
-        outline: {
-            input: {
-                bg: "transparent";
-                borderWidth: "1px";
-                borderColor: "border";
-                focusVisibleRing: "inside";
-                focusRingWidth: "0";
-                _hover: {
-                    borderColor: "border.emphasized";
-                    _focusVisible: {
-                        borderColor: "var(--focus-ring-color)";
-                    };
-                };
-            } | {
-                borderWidth: "1px";
-                borderColor: "transparent";
-                bg: "bg.muted";
-                focusVisibleRing: "inside";
-            } | {
-                bg: "transparent";
-                borderBottomWidth: "1px";
-                borderBottomColor: "border";
-                borderRadius: "0";
-                px: "0";
-                _focusVisible: {
-                    borderColor: "var(--focus-color)";
-                    boxShadow: "0px 1px 0px 0px var(--focus-color)";
-                };
-            };
-        };
-        subtle: {
-            input: {
-                bg: "transparent";
-                borderWidth: "1px";
-                borderColor: "border";
-                focusVisibleRing: "inside";
-                focusRingWidth: "0";
-                _hover: {
-                    borderColor: "border.emphasized";
-                    _focusVisible: {
-                        borderColor: "var(--focus-ring-color)";
-                    };
-                };
-            } | {
-                borderWidth: "1px";
-                borderColor: "transparent";
-                bg: "bg.muted";
-                focusVisibleRing: "inside";
-            } | {
-                bg: "transparent";
-                borderBottomWidth: "1px";
-                borderBottomColor: "border";
-                borderRadius: "0";
-                px: "0";
-                _focusVisible: {
-                    borderColor: "var(--focus-color)";
-                    boxShadow: "0px 1px 0px 0px var(--focus-color)";
-                };
-            };
-        };
-        flushed: {
-            input: {
-                bg: "transparent";
-                borderWidth: "1px";
-                borderColor: "border";
-                focusVisibleRing: "inside";
-                focusRingWidth: "0";
-                _hover: {
-                    borderColor: "border.emphasized";
-                    _focusVisible: {
-                        borderColor: "var(--focus-ring-color)";
-                    };
-                };
-            } | {
-                borderWidth: "1px";
-                borderColor: "transparent";
-                bg: "bg.muted";
-                focusVisibleRing: "inside";
-            } | {
-                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/pin-input/pin-input.recipe.js

@@ -1,32 +0,0 @@
-import { pinInputAnatomy } from '@chakra-ui/react/anatomy';
-import { defineSlotRecipe } from '@chakra-ui/react/styled-system';
-import { mapEntries } from "../../theme/utils.js";
-import { inputRecipe } from "../input/input.recipe.js";
-const { variants, defaultVariants } = inputRecipe;
-export const pinInputSlotRecipe = defineSlotRecipe({
-    className: 'chakra-pin-input',
-    slots: pinInputAnatomy.keys(),
-    base: {
-        input: {
-            ...inputRecipe.base,
-            textAlign: 'center',
-            width: 'var(--input-height)',
-        },
-    },
-    variants: {
-        size: mapEntries(variants.size, (key, value) => [
-            key,
-            {
-                input: {
-                    ...value,
-                    px: 0,
-                },
-            },
-        ]),
-        variant: mapEntries(variants.variant, (key, value) => [
-            key,
-            { input: value },
-        ]),
-    },
-    defaultVariants: defaultVariants,
-});

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

@@ -1,24 +0,0 @@
-export declare const popoverSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "content" | "body" | "anchor" | "indicator" | "positioner" | "closeTrigger" | "title" | "header" | "footer" | "trigger" | "arrow" | "arrowTip", {
-    size: {
-        xs: {
-            content: {
-                '--popover-padding': "spacing.3";
-            };
-        };
-        sm: {
-            content: {
-                '--popover-padding': "spacing.4";
-            };
-        };
-        md: {
-            content: {
-                '--popover-padding': "spacing.5";
-            };
-        };
-        lg: {
-            content: {
-                '--popover-padding': "spacing.6";
-            };
-        };
-    };
-}>;

package/dist/components/popover/popover.recipe.js

@@ -1,84 +0,0 @@
-import { popoverAnatomy } from '@chakra-ui/react/anatomy';
-import { defineSlotRecipe } from '@chakra-ui/react/styled-system';
-export const popoverSlotRecipe = defineSlotRecipe({
-    className: 'chakra-popover',
-    slots: popoverAnatomy.keys(),
-    base: {
-        content: {
-            layerStyle: 'overlay',
-            position: 'relative',
-            display: 'flex',
-            flexDirection: 'column',
-            textStyle: 'sm',
-            '--popover-bg': 'colors.bg.panel',
-            bg: 'var(--popover-bg)',
-            '--popover-size': 'sizes.xs',
-            '--popover-mobile-size': 'calc(100dvw - 1rem)',
-            width: {
-                base: 'min(var(--popover-mobile-size), var(--popover-size))',
-                sm: 'var(--popover-size)',
-            },
-            '--popover-z-index': 'zIndex.layer-2',
-            zIndex: 'calc(var(--popover-z-index) + var(--layer-index, 0))',
-            outline: '0',
-            transformOrigin: 'var(--transform-origin)',
-            _open: {
-                animationStyle: 'scale-fade-in',
-                animationDuration: 'fast',
-            },
-            _closed: {
-                animationStyle: 'scale-fade-out',
-                animationDuration: 'faster',
-            },
-        },
-        header: {
-            paddingInline: 'var(--popover-padding)',
-            paddingTop: 'var(--popover-padding)',
-        },
-        body: {
-            padding: 'var(--popover-padding)',
-            flex: '1',
-        },
-        footer: {
-            display: 'flex',
-            alignItems: 'center',
-            paddingInline: 'var(--popover-padding)',
-            paddingBottom: 'var(--popover-padding)',
-        },
-        arrow: {
-            '--arrow-size': 'sizes.3',
-            '--arrow-background': 'var(--popover-bg)',
-        },
-        arrowTip: {
-            borderTopWidth: '1px',
-            borderInlineStartWidth: '1px',
-        },
-    },
-    variants: {
-        size: {
-            xs: {
-                content: {
-                    '--popover-padding': 'spacing.3',
-                },
-            },
-            sm: {
-                content: {
-                    '--popover-padding': 'spacing.4',
-                },
-            },
-            md: {
-                content: {
-                    '--popover-padding': 'spacing.5',
-                },
-            },
-            lg: {
-                content: {
-                    '--popover-padding': 'spacing.6',
-                },
-            },
-        },
-    },
-    defaultVariants: {
-        size: 'md',
-    },
-});

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

@@ -1,82 +0,0 @@
-export declare const progressSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "valueText" | "circle" | "track" | "range" | "view" | "circleTrack" | "circleRange", {
-    variant: {
-        outline: {
-            track: {
-                shadow: "inset";
-                bgColor: "bg.subtle";
-            };
-            range: {
-                bgColor: "colorPalette.solid";
-            };
-        };
-        subtle: {
-            track: {
-                bgColor: "colorPalette.muted";
-            };
-            range: {
-                bgColor: "colorPalette.solid/72";
-            };
-        };
-    };
-    shape: {
-        square: {};
-        rounded: {
-            track: {
-                borderRadius: "control.sm";
-            };
-        };
-        full: {
-            track: {
-                borderRadius: "full";
-            };
-        };
-    };
-    striped: {
-        true: {
-            range: {
-                backgroundImage: "linear-gradient(45deg, var(--stripe-color) 25%, transparent 25%, transparent 50%, var(--stripe-color) 50%, var(--stripe-color) 75%, transparent 75%, transparent)";
-                backgroundSize: "var(--stripe-size) var(--stripe-size)";
-                '--stripe-size': "1rem";
-                '--stripe-color': {
-                    _light: "rgba(255, 255, 255, 0.3)";
-                    _dark: "rgba(0, 0, 0, 0.3)";
-                };
-            };
-        };
-    };
-    animated: {
-        true: {
-            range: {
-                '--animate-from': "var(--stripe-size)";
-                animation: "bg-position 1s linear infinite";
-            };
-        };
-    };
-    size: {
-        xs: {
-            track: {
-                h: "1.5";
-            };
-        };
-        sm: {
-            track: {
-                h: "2";
-            };
-        };
-        md: {
-            track: {
-                h: "2.5";
-            };
-        };
-        lg: {
-            track: {
-                h: "3";
-            };
-        };
-        xl: {
-            track: {
-                h: "4";
-            };
-        };
-    };
-}>;

package/dist/components/progress/progress.recipe.js

@@ -1,121 +0,0 @@
-import { progressAnatomy } from '@chakra-ui/react/anatomy';
-import { defineSlotRecipe } from '@chakra-ui/react/styled-system';
-export const progressSlotRecipe = defineSlotRecipe({
-    slots: progressAnatomy.keys(),
-    className: 'chakra-progress',
-    base: {
-        root: {
-            colorPalette: 'accent',
-            textStyle: 'sm',
-            position: 'relative',
-        },
-        track: {
-            overflow: 'hidden',
-            position: 'relative',
-        },
-        range: {
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            transitionProperty: 'width, height',
-            transitionDuration: 'slow',
-            height: '100%',
-            bgColor: 'var(--track-color)',
-            _indeterminate: {
-                '--animate-from-x': '-40%',
-                '--animate-to-x': '100%',
-                position: 'absolute',
-                willChange: 'left',
-                minWidth: '50%',
-                animation: 'position 1s ease infinite normal none running',
-                backgroundImage: `linear-gradient(to right, transparent 0%, var(--track-color) 50%, transparent 100%)`,
-            },
-        },
-        label: {
-            display: 'inline-flex',
-            fontWeight: 'medium',
-        },
-        valueText: {
-            textStyle: 'xs',
-            lineHeight: '1',
-            fontWeight: 'medium',
-        },
-    },
-    variants: {
-        variant: {
-            outline: {
-                track: {
-                    shadow: 'inset',
-                    bgColor: 'bg.subtle',
-                },
-                range: {
-                    bgColor: 'colorPalette.solid',
-                },
-            },
-            subtle: {
-                track: {
-                    bgColor: 'colorPalette.muted',
-                },
-                range: {
-                    bgColor: 'colorPalette.solid/72',
-                },
-            },
-        },
-        shape: {
-            square: {},
-            rounded: {
-                track: {
-                    borderRadius: 'control.sm',
-                },
-            },
-            full: {
-                track: {
-                    borderRadius: 'full',
-                },
-            },
-        },
-        striped: {
-            true: {
-                range: {
-                    backgroundImage: `linear-gradient(45deg, var(--stripe-color) 25%, transparent 25%, transparent 50%, var(--stripe-color) 50%, var(--stripe-color) 75%, transparent 75%, transparent)`,
-                    backgroundSize: `var(--stripe-size) var(--stripe-size)`,
-                    '--stripe-size': '1rem',
-                    '--stripe-color': {
-                        _light: 'rgba(255, 255, 255, 0.3)',
-                        _dark: 'rgba(0, 0, 0, 0.3)',
-                    },
-                },
-            },
-        },
-        animated: {
-            true: {
-                range: {
-                    '--animate-from': 'var(--stripe-size)',
-                    animation: 'bg-position 1s linear infinite',
-                },
-            },
-        },
-        size: {
-            xs: {
-                track: { h: '1.5' },
-            },
-            sm: {
-                track: { h: '2' },
-            },
-            md: {
-                track: { h: '2.5' },
-            },
-            lg: {
-                track: { h: '3' },
-            },
-            xl: {
-                track: { h: '4' },
-            },
-        },
-    },
-    defaultVariants: {
-        variant: 'outline',
-        size: 'md',
-        shape: 'rounded',
-    },
-});

package/dist/components/progress-circle/progress-circle.recipe.d.ts

@@ -1,49 +0,0 @@
-export declare const progressCircleSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "valueText" | "circle" | "track" | "range" | "view" | "circleTrack" | "circleRange", {
-    size: {
-        xs: {
-            circle: {
-                '--size': "sizes.4";
-                '--thickness': "3px";
-            };
-            valueText: {
-                textStyle: "2xs";
-            };
-        };
-        sm: {
-            circle: {
-                '--size': "sizes.6";
-                '--thickness': "5px";
-            };
-            valueText: {
-                textStyle: "2xs";
-            };
-        };
-        md: {
-            circle: {
-                '--size': "sizes.10";
-                '--thickness': "6px";
-            };
-            valueText: {
-                textStyle: "xs";
-            };
-        };
-        lg: {
-            circle: {
-                '--size': "sizes.14";
-                '--thickness': "7px";
-            };
-            valueText: {
-                textStyle: "sm";
-            };
-        };
-        xl: {
-            circle: {
-                '--size': "sizes.16";
-                '--thickness': "8px";
-            };
-            valueText: {
-                textStyle: "sm";
-            };
-        };
-    };
-}>;