@saas-ui/react 3.0.0-next.27 → 3.0.0-next.28

package/dist/components/sidebar/sidebar.recipe.js

@@ -24,7 +24,7 @@ export const sidebarSlotRecipe = defineSlotRecipe({
             flexDirection: 'column',
         },
         backdrop: {
-            bg: 'blackAlpha.200',
+            layerStyle: 'backdrop',
             position: 'fixed',
             inset: 0,
             '--sidebar-backdrop-z-index': 'zIndex.layer-3',

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

@@ -1,7 +1,7 @@
 export declare const skeletonRecipe: import("@chakra-ui/react").RecipeDefinition<{
     loading: {
         true: {
-            borderRadius: "l2";
+            borderRadius: "panel.md";
             boxShadow: "none";
             backgroundClip: "padding-box";
             cursor: "default";

package/dist/components/skeleton/skeleton.recipe.js

@@ -5,7 +5,7 @@ export const skeletonRecipe = defineRecipe({
     variants: {
         loading: {
             true: {
-                borderRadius: 'l2',
+                borderRadius: 'panel.md',
                 boxShadow: 'none',
                 backgroundClip: 'padding-box',
                 cursor: 'default',

package/dist/components/skip-nav-link/skip-nav-link.recipe.js

@@ -5,7 +5,7 @@ export const skipNavLinkRecipe = defineRecipe({
         display: 'inline-flex',
         bg: 'bg.panel',
         padding: '2.5',
-        borderRadius: 'l2',
+        borderRadius: 'control.md',
         fontWeight: 'semibold',
         focusVisibleRing: 'outside',
         textStyle: 'sm',

package/dist/components/stat/stat.recipe.js

@@ -7,7 +7,7 @@ export const statSlotRecipe = defineSlotRecipe({
         root: {
             display: 'flex',
             flexDirection: 'column',
-            gap: '1',
+            gap: '0',
             position: 'relative',
             flex: '1',
         },

package/dist/components/steps/steps.recipe.js

@@ -57,7 +57,7 @@ export const stepsSlotRecipe = defineSlotRecipe({
             gap: '3',
             textAlign: 'start',
             focusVisibleRing: 'outside',
-            borderRadius: 'l2',
+            borderRadius: 'control.md',
         },
         content: {
             focusVisibleRing: 'outside',

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

@@ -1,4 +1,4 @@
-export declare const tabsSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "root" | "indicator" | "list" | "trigger" | "contentGroup", {
+export declare const tabsSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "indicator" | "root" | "list" | "trigger" | "contentGroup", {
     fitted: {
         true: {
             list: {
@@ -105,6 +105,7 @@ export declare const tabsSlotRecipe: import("@chakra-ui/react").SlotRecipeDefini
                     _horizontal: {
                         layerStyle: "indicator.bottom";
                         borderTopRadius: "3px";
+                        '--indicator-offset-x': "spacing.3";
                         '--indicator-offset-y': "-1px";
                         '--indicator-color': "colors.colorPalette.solid";
                     };

package/dist/components/tabs/tabs.recipe.js

@@ -173,6 +173,7 @@ export const tabsSlotRecipe = defineSlotRecipe({
                         _horizontal: {
                             layerStyle: 'indicator.bottom',
                             borderTopRadius: '3px',
+                            '--indicator-offset-x': 'spacing.3',
                             '--indicator-offset-y': '-1px',
                             '--indicator-color': 'colors.colorPalette.solid',
                         },

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

@@ -1,4 +1,4 @@
-export declare const tagSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "closeTrigger" | "startElement" | "endElement", {
+export declare const tagSlotRecipe: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "closeTrigger" | "endElement" | "startElement", {
     size: {
         sm: {
             root: {

package/dist/components/tooltip/tooltip.recipe.js

@@ -12,7 +12,7 @@ export const tooltipSlotRecipe = defineSlotRecipe({
             color: 'fg',
             px: '2.5',
             py: '1',
-            borderRadius: 'l2',
+            borderRadius: 'panel.sm',
             fontWeight: 'medium',
             textStyle: 'xs',
             boxShadow: 'md',

package/dist/theme/conditions.d.ts

@@ -14,4 +14,5 @@ export declare const conditions: {
     parentHover: string;
     pressable: string;
     popupExpanded: string;
+    rowHover: string;
 };

package/dist/theme/conditions.js

@@ -15,4 +15,5 @@ export const conditions = defineConditions({
     parentHover: 'button:hover &, a:hover &, [role=button]:hover &',
     pressable: '&:is(a, button, [role=button])',
     popupExpanded: '&:is([aria-haspopup][aria-expanded=true], [aria-haspopup][data-expanded], [aria-haspopup][data-state=expanded])',
+    rowHover: 'tr:hover &, [role=row]:hover &',
 });

package/dist/theme/global-css.js

@@ -43,14 +43,17 @@ export const globalCss = defineGlobalStyles({
         '--overlay-effect': 'blur({blurs.lg})',
         '--backdrop-effect': 'none',
     },
+    '.dark *': {
+        '--overlay-translucency': '85%',
+    },
     body: {
         color: 'fg',
         bg: 'bg',
         lineHeight: '1.5',
         colorPalette: 'accent',
     },
-    '*::placeholder': {
-        color: 'fg.subtle',
+    '*::placeholder, *[data-placeholder]': {
+        color: 'fg.muted/90',
     },
     '*::selection': {
         bg: 'colorPalette.solid/20',

package/dist/theme/recipes.d.ts

@@ -116,7 +116,10 @@ export declare const recipes: {
                 bg: "colorPalette.solid";
                 color: "colorPalette.contrast";
                 '--btn-shadow': "shadows.sm";
-                boxShadow: "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)";
+                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: {
@@ -516,7 +519,7 @@ export declare const recipes: {
     skeleton: import("@chakra-ui/react").RecipeDefinition<{
         loading: {
             true: {
-                borderRadius: "l2";
+                borderRadius: "panel.md";
                 boxShadow: "none";
                 backgroundClip: "padding-box";
                 cursor: "default";

package/dist/theme/semantic-tokens/colors.js

@@ -72,7 +72,7 @@ export const semanticColors = defineSemanticTokens.colors({
         overlay: {
             value: {
                 _light: 'color-mix(in oklch, {colors.white} var(--overlay-translucency), transparent)',
-                _dark: 'color-mix(in srgb, var(--overlay-translucency), {colors.gray.950} 100%)',
+                _dark: 'color-mix(in oklch, {colors.gray.800} var(--overlay-translucency), transparent)',
             },
         },
         backdrop: {

package/dist/theme/semantic-tokens/shadows.js

@@ -45,7 +45,7 @@ export const semanticShadows = defineSemanticTokens.shadows({
     inset: {
         value: {
             _light: 'inset 0 1px 2px 0 {black/5}',
-            _dark: 'inset 0 1px 2px 0 {colors.gray.300/5}',
+            _dark: 'inset 0 -1px 2px 0 {colors.gray.300/8}, inset 0 0 0 1px {colors.gray.300/8}',
         },
     },
 });

package/dist/theme/slot-recipes.d.ts

@@ -75,7 +75,7 @@ export declare const slotRecipes: {
         };
     }>;
     actionBar: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "positioner" | "separator" | "selectionTrigger" | "closeTrigger", import("@chakra-ui/react").SlotRecipeVariantRecord<"content" | "positioner" | "separator" | "selectionTrigger" | "closeTrigger">>;
-    alert: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "description" | "root" | "indicator" | "title", {
+    alert: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "content" | "indicator" | "root" | "title", {
         status: {
             info: {
                 root: {
@@ -335,7 +335,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    breadcrumb: import("@chakra-ui/react").SlotRecipeDefinition<"root" | "item" | "separator" | "link" | "currentLink" | "list" | "ellipsis", {
+    breadcrumb: import("@chakra-ui/react").SlotRecipeDefinition<"link" | "root" | "item" | "separator" | "currentLink" | "list" | "ellipsis", {
         variant: {
             underline: {
                 link: {
@@ -381,7 +381,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    card: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "root" | "title" | "header" | "body" | "footer", {
+    card: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "body" | "root" | "title" | "header" | "footer", {
         size: {
             sm: {
                 root: {
@@ -459,7 +459,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    checkbox: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "group" | "indicator" | "control", {
+    checkbox: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "control" | "indicator" | "root" | "group", {
         size: {
             xs: {
                 root: {
@@ -539,7 +539,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    checkboxCard: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "description" | "label" | "root" | "indicator" | "control" | "addon", {
+    checkboxCard: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "content" | "label" | "control" | "indicator" | "root" | "addon", {
         size: {
             sm: {
                 root: {
@@ -727,7 +727,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    collapsible: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "root" | "trigger", import("@chakra-ui/react").SlotRecipeVariantRecord<"content" | "root" | "trigger">>;
+    collapsible: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "indicator" | "root" | "trigger", import("@chakra-ui/react").SlotRecipeVariantRecord<"content" | "indicator" | "root" | "trigger">>;
     dataList: import("@chakra-ui/react").SlotRecipeDefinition<"root" | "item" | "itemLabel" | "itemValue", {
         orientation: {
             horizontal: {
@@ -783,7 +783,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    dialog: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "description" | "backdrop" | "positioner" | "closeTrigger" | "title" | "header" | "body" | "footer" | "trigger", {
+    dialog: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "content" | "body" | "backdrop" | "positioner" | "closeTrigger" | "title" | "header" | "footer" | "trigger", {
         variant: {
             dialog: {};
             confirm: {
@@ -949,7 +949,7 @@ export declare const slotRecipes: {
             none: {};
         };
     }>;
-    drawer: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "description" | "backdrop" | "positioner" | "closeTrigger" | "title" | "header" | "body" | "footer" | "trigger", {
+    drawer: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "content" | "body" | "backdrop" | "positioner" | "closeTrigger" | "title" | "header" | "footer" | "trigger", {
         size: {
             xs: {
                 content: {
@@ -1062,7 +1062,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    editable: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "control" | "input" | "area" | "preview" | "editTrigger" | "submitTrigger" | "cancelTrigger" | "textarea", {
+    editable: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "textarea" | "control" | "root" | "input" | "area" | "preview" | "editTrigger" | "submitTrigger" | "cancelTrigger", {
         size: {
             sm: {
                 root: {
@@ -1099,7 +1099,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    emptyState: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "description" | "root" | "indicator" | "title" | "actions", {
+    emptyState: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "content" | "indicator" | "root" | "title" | "actions", {
         size: {
             sm: {
                 root: {
@@ -1181,7 +1181,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    field: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "input" | "textarea" | "select" | "errorText" | "helperText" | "requiredIndicator", {
+    field: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "textarea" | "root" | "input" | "select" | "errorText" | "helperText" | "requiredIndicator", {
         orientation: {
             vertical: {
                 root: {
@@ -1239,7 +1239,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    list: import("@chakra-ui/react").SlotRecipeDefinition<"root" | "indicator" | "item", {
+    list: import("@chakra-ui/react").SlotRecipeDefinition<"indicator" | "root" | "item", {
         variant: {
             marker: {
                 root: {
@@ -1306,6 +1306,7 @@ export declare const slotRecipes: {
                     textStyle: "xs";
                     py: "1";
                     px: "1.5";
+                    ps: "var(--menu-item-inset, {sizes.1.5})";
                 };
                 itemGroupLabel: {
                     textStyle: "xs";
@@ -1323,6 +1324,7 @@ export declare const slotRecipes: {
                     textStyle: "sm";
                     py: "1.5";
                     px: "2";
+                    ps: "var(--menu-item-inset, {sizes.2})";
                 };
                 itemGroupLabel: {
                     textStyle: "sm";
@@ -1332,7 +1334,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    nativeSelect: import("@chakra-ui/react").SlotRecipeDefinition<"root" | "indicator" | "field", {
+    nativeSelect: import("@chakra-ui/react").SlotRecipeDefinition<"indicator" | "root" | "field", {
         variant: {
             outline: {
                 field: {
@@ -1422,7 +1424,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    numberInput: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "control" | "input" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", {
+    numberInput: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "control" | "root" | "input" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", {
         size: {
             xs: {
                 input: {
@@ -1566,7 +1568,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    pinInput: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "control" | "input", {
+    pinInput: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "control" | "root" | "input", {
         size: {
             sm: {
                 input: {
@@ -1802,7 +1804,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    popover: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "description" | "indicator" | "positioner" | "closeTrigger" | "title" | "header" | "body" | "footer" | "trigger" | "anchor" | "arrow" | "arrowTip", {
+    popover: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "content" | "body" | "anchor" | "indicator" | "positioner" | "closeTrigger" | "title" | "header" | "footer" | "trigger" | "arrow" | "arrowTip", {
         size: {
             xs: {
                 content: {
@@ -1831,7 +1833,7 @@ export declare const slotRecipes: {
             outline: {
                 track: {
                     shadow: "inset";
-                    bgColor: "bg.muted";
+                    bgColor: "bg.subtle";
                 };
                 range: {
                     bgColor: "colorPalette.solid";
@@ -1850,7 +1852,7 @@ export declare const slotRecipes: {
             square: {};
             rounded: {
                 track: {
-                    borderRadius: "l1";
+                    borderRadius: "control.sm";
                 };
             };
             full: {
@@ -1957,7 +1959,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    radioCard: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "indicator" | "item" | "itemContent" | "itemIndicator" | "itemText" | "itemControl" | "itemAddon" | "itemDescription", {
+    radioCard: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "indicator" | "root" | "item" | "itemContent" | "itemIndicator" | "itemText" | "itemControl" | "itemAddon" | "itemDescription", {
         size: {
             sm: {
                 item: {
@@ -2148,7 +2150,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    radioGroup: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "indicator" | "item" | "itemIndicator" | "itemText" | "itemControl" | "itemAddon", {
+    radioGroup: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "indicator" | "root" | "item" | "itemIndicator" | "itemText" | "itemControl" | "itemAddon", {
         variant: {
             outline: {
                 itemControl: {
@@ -2225,7 +2227,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    ratingGroup: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "control" | "item" | "itemIndicator", {
+    ratingGroup: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "control" | "root" | "item" | "itemIndicator", {
         size: {
             xs: {
                 item: {
@@ -2249,7 +2251,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    segmentGroup: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "indicator" | "item" | "itemText" | "itemControl", {
+    segmentGroup: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "indicator" | "root" | "item" | "itemText" | "itemControl", {
         size: {
             xs: {
                 root: {
@@ -2297,7 +2299,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    select: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "label" | "root" | "indicator" | "control" | "item" | "itemIndicator" | "positioner" | "list" | "trigger" | "itemGroup" | "clearTrigger" | "itemGroupLabel" | "itemText" | "valueText" | "indicatorGroup", {
+    select: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "label" | "control" | "indicator" | "root" | "item" | "itemIndicator" | "positioner" | "list" | "trigger" | "itemGroup" | "clearTrigger" | "itemGroupLabel" | "itemText" | "valueText" | "indicatorGroup", {
         variant: {
             outline: {
                 trigger: {
@@ -2452,7 +2454,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    slider: import("@chakra-ui/react").SlotRecipeDefinition<"marker" | "label" | "root" | "control" | "valueText" | "track" | "range" | "thumb" | "markerGroup" | "draggingIndicator" | "markerIndicator", {
+    slider: import("@chakra-ui/react").SlotRecipeDefinition<"marker" | "label" | "control" | "root" | "valueText" | "track" | "range" | "thumb" | "markerGroup" | "draggingIndicator" | "markerIndicator", {
         size: {
             sm: {
                 root: {
@@ -2553,7 +2555,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    stat: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "indicator" | "valueText" | "helpText" | "valueUnit", {
+    stat: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "indicator" | "root" | "valueText" | "helpText" | "valueUnit", {
         size: {
             sm: {
                 valueText: {
@@ -2572,7 +2574,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    steps: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "description" | "progress" | "root" | "indicator" | "item" | "separator" | "title" | "list" | "trigger" | "nextTrigger" | "prevTrigger", {
+    steps: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "content" | "progress" | "indicator" | "root" | "item" | "separator" | "title" | "list" | "trigger" | "nextTrigger" | "prevTrigger", {
         orientation: {
             vertical: {
                 root: {
@@ -2714,7 +2716,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    switch: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "indicator" | "control" | "thumb", {
+    switch: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "control" | "indicator" | "root" | "thumb", {
         variant: {
             solid: {
                 control: {
@@ -2791,7 +2793,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    table: import("@chakra-ui/react").SlotRecipeDefinition<"cell" | "root" | "row" | "caption" | "header" | "body" | "footer" | "columnHeader", {
+    table: import("@chakra-ui/react").SlotRecipeDefinition<"body" | "cell" | "row" | "root" | "caption" | "header" | "footer" | "columnHeader", {
         interactive: {
             true: {
                 body: {
@@ -2912,7 +2914,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    tabs: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "root" | "indicator" | "list" | "trigger" | "contentGroup", {
+    tabs: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "indicator" | "root" | "list" | "trigger" | "contentGroup", {
         fitted: {
             true: {
                 list: {
@@ -3019,6 +3021,7 @@ export declare const slotRecipes: {
                         _horizontal: {
                             layerStyle: "indicator.bottom";
                             borderTopRadius: "3px";
+                            '--indicator-offset-x': "spacing.3";
                             '--indicator-offset-y': "-1px";
                             '--indicator-color': "colors.colorPalette.solid";
                         };
@@ -3174,7 +3177,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    tag: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "closeTrigger" | "startElement" | "endElement", {
+    tag: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "closeTrigger" | "endElement" | "startElement", {
         size: {
             sm: {
                 root: {
@@ -3269,7 +3272,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    toast: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "root" | "indicator" | "closeTrigger" | "title" | "actionTrigger", import("@chakra-ui/react").SlotRecipeVariantRecord<"description" | "root" | "indicator" | "closeTrigger" | "title" | "actionTrigger">>;
+    toast: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "indicator" | "root" | "closeTrigger" | "title" | "actionTrigger", import("@chakra-ui/react").SlotRecipeVariantRecord<"description" | "indicator" | "root" | "closeTrigger" | "title" | "actionTrigger">>;
     tooltip: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "positioner" | "trigger" | "arrow" | "arrowTip", {
         variant: {
             inverted: {
@@ -3280,7 +3283,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    status: import("@chakra-ui/react").SlotRecipeDefinition<"root" | "indicator", {
+    status: import("@chakra-ui/react").SlotRecipeDefinition<"indicator" | "root", {
         size: {
             sm: {
                 root: {
@@ -3299,7 +3302,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    timeline: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "description" | "root" | "indicator" | "item" | "separator" | "title" | "connector", {
+    timeline: import("@chakra-ui/react").SlotRecipeDefinition<"description" | "content" | "indicator" | "root" | "item" | "separator" | "title" | "connector", {
         variant: {
             subtle: {
                 indicator: {
@@ -3405,7 +3408,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    suiPersona: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "root" | "avatar" | "presence" | "details" | "secondaryLabel" | "tertiaryLabel", {
+    suiPersona: import("@chakra-ui/react").SlotRecipeDefinition<"label" | "presence" | "root" | "avatar" | "details" | "secondaryLabel" | "tertiaryLabel", {
         size: {
             '2xs': {
                 details: {
@@ -3565,7 +3568,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    suiNavbar: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "root" | "item" | "link" | "brand", {
+    suiNavbar: import("@chakra-ui/react").SlotRecipeDefinition<"content" | "link" | "root" | "item" | "brand", {
         variant: {
             neutral: {
                 root: {
@@ -3599,7 +3602,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    suiSidebar: import("@chakra-ui/react").SlotRecipeDefinition<"backdrop" | "root" | "group" | "header" | "body" | "footer" | "trigger" | "track" | "flyoutTrigger" | "groupHeader" | "groupTitle" | "groupEndElement" | "groupContent", {
+    suiSidebar: import("@chakra-ui/react").SlotRecipeDefinition<"body" | "backdrop" | "root" | "header" | "footer" | "group" | "trigger" | "track" | "flyoutTrigger" | "groupHeader" | "groupTitle" | "groupEndElement" | "groupContent", {
         mode: {
             collapsible: {
                 root: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saas-ui/react",
-  "version": "3.0.0-next.27",
+  "version": "3.0.0-next.28",
   "description": "Saas UI - The React component library for startups.",
   "type": "module",
   "exports": {