@mekari/pixel3-theme 0.7.2-dev.1 → 1.0.0-next.0

package/dist/recipes/button.d.ts

@@ -1,6 +1,338 @@
-import * as _pandacss_dev from '@pandacss/dev';
+import * as _pandacss_types from '@pandacss/types';
 
-declare const buttonRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
-declare const buttonGroupRecipe: _pandacss_dev.RecipeConfig<_pandacss_dev.RecipeVariantRecord>;
+declare const buttonRecipe: _pandacss_types.RecipeConfig<{
+    variant: {
+        primary: {
+            color: "white";
+            background: "blue.400";
+            borderColor: "blue.400";
+            _hover: {
+                background: "blue.500";
+                borderColor: "blue.500";
+            };
+            _active: {
+                background: "blue.700";
+                borderColor: "blue.700";
+            };
+            _loading: {
+                background: "blue.400";
+            };
+            _nextTheme: {
+                color: "text.inverse";
+                background: "background.brand.bold";
+                borderColor: "background.brand.bold";
+                _hover: {
+                    background: "background.brand.bold.hovered";
+                    borderColor: "background.brand.bold.hovered";
+                };
+                _active: {
+                    background: "background.brand.bold.pressed";
+                    borderColor: "background.brand.bold.pressed";
+                };
+                _loading: {
+                    background: "background.brand.bold";
+                };
+            };
+        };
+        secondary: {
+            color: "blue.400";
+            background: "white";
+            borderColor: "gray.100";
+            _hover: {
+                background: "gray.50";
+                borderColor: "gray.100";
+            };
+            _active: {
+                background: "blue.50";
+                borderColor: "blue.50";
+            };
+            _loading: {
+                background: "white";
+            };
+            _nextTheme: {
+                color: "text.link";
+                background: "background.neutral";
+                borderColor: "border.default";
+                _hover: {
+                    background: "background.neutral.hovered";
+                    borderColor: "border.default";
+                };
+                _active: {
+                    background: "background.neutral.pressed";
+                    borderColor: "border.default";
+                };
+                _loading: {
+                    background: "background.neutral";
+                };
+            };
+        };
+        ghost: {
+            color: "gray.600";
+            background: "transparent";
+            borderColor: "transparent";
+            _hover: {
+                background: "gray.50";
+                borderColor: "gray.50";
+            };
+            _active: {
+                background: "gray.100";
+                borderColor: "gray.100";
+            };
+            _loading: {
+                background: "transparent";
+            };
+            _nextTheme: {
+                color: "text.secondary";
+                background: "transparent";
+                borderColor: "transparent";
+                _hover: {
+                    background: "background.neutral.hovered";
+                    borderColor: "background.neutral.hovered";
+                };
+                _active: {
+                    background: "background.neutral.pressed";
+                    borderColor: "background.neutral.pressed";
+                };
+                _loading: {
+                    background: "transparent";
+                };
+            };
+        };
+        danger: {
+            color: "white";
+            background: "red.400";
+            borderColor: "red.400";
+            _hover: {
+                background: "red.500";
+                borderColor: "red.500";
+            };
+            _active: {
+                background: "red.700";
+                borderColor: "red.700";
+            };
+            _focusVisible: {
+                borderColor: "red.400";
+                boxShadow: "0 0 0 3px #FDECEE";
+            };
+            _loading: {
+                background: "red.400";
+            };
+            _nextTheme: {
+                color: "text.inverse";
+                background: "background.danger.bold";
+                borderColor: "background.danger.bold";
+                _hover: {
+                    background: "background.danger.bold.hovered";
+                    borderColor: "background.danger.bold.hovered";
+                };
+                _active: {
+                    background: "background.danger.bold.pressed";
+                    borderColor: "background.danger.bold.pressed";
+                };
+                _focusVisible: {
+                    borderColor: "border.focused";
+                    boxShadow: "focus";
+                };
+                _loading: {
+                    background: "background.danger.bold";
+                };
+            };
+        };
+        tertiary: {
+            color: "white";
+            background: "#282E33";
+            borderColor: "#282E33";
+            _hover: {
+                background: "#38414A";
+                borderColor: "#38414A";
+            };
+            _active: {
+                background: "#454F59";
+                borderColor: "#454F59";
+            };
+            _loading: {
+                background: "#282E33";
+            };
+            _nextTheme: {
+                color: "text.inverse.static";
+                background: "background.tertiary";
+                borderColor: "background.tertiary";
+                _hover: {
+                    background: "background.tertiary.hovered";
+                    borderColor: "background.tertiary.hovered";
+                };
+                _active: {
+                    background: "background.tertiary.pressed";
+                    borderColor: "background.tertiary.pressed";
+                };
+                _loading: {
+                    background: "background.tertiary";
+                };
+            };
+        };
+        textLink: {
+            color: "blue.400";
+            background: "transparent";
+            borderColor: "transparent";
+            _hover: {
+                color: "blue.500";
+            };
+            _active: {
+                color: "blue.700";
+            };
+            _disabled: {
+                cursor: "not-allowed";
+                color: "gray.400";
+                borderColor: "transparent";
+                _hover: {
+                    borderColor: "transparent";
+                    color: "gray.400";
+                };
+            };
+            _loading: {
+                background: "white";
+            };
+            _nextTheme: {
+                color: "text.link";
+                background: "transparent";
+                borderColor: "transparent";
+                _hover: {
+                    color: "text.link";
+                    textDecoration: "underline";
+                };
+                _active: {
+                    color: "text.link.pressed";
+                };
+                _disabled: {
+                    color: "text.disabled";
+                    _hover: {
+                        color: "text.disabled";
+                        textDecoration: "none";
+                    };
+                };
+                _loading: {
+                    background: "text.inverse";
+                };
+            };
+        };
+        unstyled: {
+            display: "inline";
+            color: "inherit";
+            backgroundColor: "transparent";
+            border: "none";
+            outline: "none";
+            margin: "0";
+            padding: "0";
+            fontSize: "inherit";
+            fontWeight: "inherit";
+            lineHeight: "inherit";
+            userSelect: "inherit";
+            textAlign: "inherit";
+        };
+    };
+    size: {
+        sm: {
+            borderRadius: "sm";
+            textStyle: string;
+            fontWeight: "regular";
+            _isRounded: {
+                borderRadius: "full";
+            };
+            _loading: {
+                borderRadius: "sm";
+                _isRounded: {
+                    borderRadius: "full";
+                };
+            };
+            _hasIcon: {
+                paddingX: string;
+                paddingY: string;
+                _nextTheme: {
+                    paddingX: string;
+                    paddingY: string;
+                };
+            };
+            _hasLabel: {
+                paddingX: string;
+                paddingY: string;
+                _hasIcon: {
+                    '&[data-icon-position=left]': {
+                        paddingLeft: "1.5";
+                        paddingRight: "2";
+                    };
+                    '&[data-icon-position=right]': {
+                        paddingLeft: "2";
+                        paddingRight: "1.5";
+                    };
+                };
+                _nextTheme: {
+                    paddingX: string;
+                    paddingY: string;
+                    _hasIcon: {
+                        '&[data-icon-position=left]': {
+                            paddingLeft: "2xs";
+                            paddingRight: "xs";
+                        };
+                        '&[data-icon-position=right]': {
+                            paddingLeft: "xs";
+                            paddingRight: "2xs";
+                        };
+                    };
+                };
+            };
+        };
+        md: {
+            borderRadius: "md";
+            textStyle: string;
+            fontWeight: "semiBold";
+            _isRounded: {
+                borderRadius: "full";
+            };
+            _loading: {
+                borderRadius: "md";
+                _isRounded: {
+                    borderRadius: "full";
+                };
+            };
+            _hasIcon: {
+                paddingX: string;
+                paddingY: string;
+                _nextTheme: {
+                    paddingX: string;
+                    paddingY: string;
+                };
+            };
+            _hasLabel: {
+                paddingX: string;
+                paddingY: string;
+                _hasIcon: {
+                    '&[data-icon-position=left]': {
+                        paddingLeft: "3";
+                        paddingRight: "4";
+                    };
+                    '&[data-icon-position=right]': {
+                        paddingLeft: "4";
+                        paddingRight: "3";
+                    };
+                };
+                _nextTheme: {
+                    paddingX: string;
+                    paddingY: string;
+                    _hasIcon: {
+                        '&[data-icon-position=left]': {
+                            paddingLeft: "sm";
+                            paddingRight: "md";
+                        };
+                        '&[data-icon-position=right]': {
+                            paddingLeft: "md";
+                            paddingRight: "sm";
+                        };
+                    };
+                };
+            };
+        };
+    };
+}>;
+declare const buttonGroupRecipe: _pandacss_types.RecipeConfig<_pandacss_types.RecipeVariantRecord>;
 
 export { buttonGroupRecipe, buttonRecipe };

package/dist/recipes/carousel.d.mts

@@ -1,5 +1,5 @@
-import * as _pandacss_dev from '@pandacss/dev';
+import * as _pandacss_types from '@pandacss/types';
 
-declare const carouselSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const carouselSlotRecipe: _pandacss_types.SlotRecipeConfig<"root" | "buttonRight" | "buttonLeft", _pandacss_types.SlotRecipeVariantRecord<"root" | "buttonRight" | "buttonLeft">>;
 
 export { carouselSlotRecipe };

package/dist/recipes/carousel.d.ts

@@ -1,5 +1,5 @@
-import * as _pandacss_dev from '@pandacss/dev';
+import * as _pandacss_types from '@pandacss/types';
 
-declare const carouselSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const carouselSlotRecipe: _pandacss_types.SlotRecipeConfig<"root" | "buttonRight" | "buttonLeft", _pandacss_types.SlotRecipeVariantRecord<"root" | "buttonRight" | "buttonLeft">>;
 
 export { carouselSlotRecipe };

package/dist/recipes/chart.d.mts

@@ -1,5 +1,5 @@
-import * as _pandacss_dev from '@pandacss/dev';
+import * as _pandacss_types from '@pandacss/types';
 
-declare const chartSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const chartSlotRecipe: _pandacss_types.SlotRecipeConfig<"root" | "chartHeader" | "chartWrapper" | "chartContainer" | "canvasContainer" | "chartLegend" | "legendWrapper" | "legendBox" | "chartTooltip" | "tooltipWrapper" | "tooltipRow" | "tooltipItem" | "tooltipBox", _pandacss_types.SlotRecipeVariantRecord<"root" | "chartHeader" | "chartWrapper" | "chartContainer" | "canvasContainer" | "chartLegend" | "legendWrapper" | "legendBox" | "chartTooltip" | "tooltipWrapper" | "tooltipRow" | "tooltipItem" | "tooltipBox">>;
 
 export { chartSlotRecipe };

package/dist/recipes/chart.d.ts

@@ -1,5 +1,5 @@
-import * as _pandacss_dev from '@pandacss/dev';
+import * as _pandacss_types from '@pandacss/types';
 
-declare const chartSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const chartSlotRecipe: _pandacss_types.SlotRecipeConfig<"root" | "chartHeader" | "chartWrapper" | "chartContainer" | "canvasContainer" | "chartLegend" | "legendWrapper" | "legendBox" | "chartTooltip" | "tooltipWrapper" | "tooltipRow" | "tooltipItem" | "tooltipBox", _pandacss_types.SlotRecipeVariantRecord<"root" | "chartHeader" | "chartWrapper" | "chartContainer" | "canvasContainer" | "chartLegend" | "legendWrapper" | "legendBox" | "chartTooltip" | "tooltipWrapper" | "tooltipRow" | "tooltipItem" | "tooltipBox">>;
 
 export { chartSlotRecipe };

package/dist/recipes/checkbox.d.mts

@@ -1,5 +1,5 @@
-import * as _pandacss_dev from '@pandacss/dev';
+import * as _pandacss_types from '@pandacss/types';
 
-declare const checkboxSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const checkboxSlotRecipe: _pandacss_types.SlotRecipeConfig<"root" | "control" | "label", _pandacss_types.SlotRecipeVariantRecord<"root" | "control" | "label">>;
 
 export { checkboxSlotRecipe };

package/dist/recipes/checkbox.d.ts

@@ -1,5 +1,5 @@
-import * as _pandacss_dev from '@pandacss/dev';
+import * as _pandacss_types from '@pandacss/types';
 
-declare const checkboxSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const checkboxSlotRecipe: _pandacss_types.SlotRecipeConfig<"root" | "control" | "label", _pandacss_types.SlotRecipeVariantRecord<"root" | "control" | "label">>;
 
 export { checkboxSlotRecipe };

package/dist/recipes/color-picker.d.mts

@@ -1,5 +1,5 @@
-import * as _pandacss_dev from '@pandacss/dev';
+import * as _pandacss_types from '@pandacss/types';
 
-declare const colorPickerSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const colorPickerSlotRecipe: _pandacss_types.SlotRecipeConfig<"root" | "popoverContent" | "popoverTrigger" | "boxColor" | "inputTrigger" | "iconDropdown" | "wrapperAdvance" | "wrapperBasic" | "wrapperSaturation" | "wrapperHue" | "wrapperInput" | "boxPreset" | "wrapperPreset" | "wrapperBasicPreset", _pandacss_types.SlotRecipeVariantRecord<"root" | "popoverContent" | "popoverTrigger" | "boxColor" | "inputTrigger" | "iconDropdown" | "wrapperAdvance" | "wrapperBasic" | "wrapperSaturation" | "wrapperHue" | "wrapperInput" | "boxPreset" | "wrapperPreset" | "wrapperBasicPreset">>;
 
 export { colorPickerSlotRecipe };

package/dist/recipes/color-picker.d.ts

@@ -1,5 +1,5 @@
-import * as _pandacss_dev from '@pandacss/dev';
+import * as _pandacss_types from '@pandacss/types';
 
-declare const colorPickerSlotRecipe: _pandacss_dev.SlotRecipeConfig;
+declare const colorPickerSlotRecipe: _pandacss_types.SlotRecipeConfig<"root" | "popoverContent" | "popoverTrigger" | "boxColor" | "inputTrigger" | "iconDropdown" | "wrapperAdvance" | "wrapperBasic" | "wrapperSaturation" | "wrapperHue" | "wrapperInput" | "boxPreset" | "wrapperPreset" | "wrapperBasicPreset", _pandacss_types.SlotRecipeVariantRecord<"root" | "popoverContent" | "popoverTrigger" | "boxColor" | "inputTrigger" | "iconDropdown" | "wrapperAdvance" | "wrapperBasic" | "wrapperSaturation" | "wrapperHue" | "wrapperInput" | "boxPreset" | "wrapperPreset" | "wrapperBasicPreset">>;
 
 export { colorPickerSlotRecipe };