fix: improve theme

.changeset/unlucky-pens-sit.md

@@ -0,0 +1,5 @@
+---
+'@saas-ui/react': patch
+---
+
+Fixed incorrect props type for GridListRoot

packages/saas-ui-react/src/components/button/button.recipe.ts

@@ -43,7 +43,7 @@ export const buttonRecipe = defineRecipe({
       sm: {
         gap: '2',
         h: '7',
-        minW: '8',
+        minW: '7',
         textStyle: 'sm',
         borderRadius: 'md',
         px: '2.5',

packages/saas-ui-react/src/components/grid-list/grid-list.recipe.ts

@@ -1,4 +1,4 @@
-import { defineSlotRecipe } from '@chakra-ui/react'
+import { type RecipeVariantProps, defineSlotRecipe } from '@chakra-ui/react'
 
 export const gridListSlotRecipe = defineSlotRecipe({
   className: 'sui-grid-list',
@@ -131,3 +131,5 @@ export const gridListSlotRecipe = defineSlotRecipe({
     size: 'md',
   },
 })
+
+export type GridListVariantProps = RecipeVariantProps<typeof gridListSlotRecipe>

packages/saas-ui-react/src/components/grid-list/grid-list.tsx

@@ -1,14 +1,17 @@
-import type { HTMLChakraProps, SlotRecipeProps } from '@chakra-ui/react'
+import type { HTMLChakraProps } from '@chakra-ui/react'
 import { GridList } from '@saas-ui/core/grid-list'
 
+import type { SlotRecipeProps } from '#types'
+
 import { withContext, withProvider } from './grid-list.context.ts'
+import type { GridListVariantProps } from './grid-list.recipe.ts'
 
 interface GridListRootProps
   extends GridList.RootProps,
     HTMLChakraProps<'div'>,
-    SlotRecipeProps<'suiGridList'> {}
+    SlotRecipeProps<'suiGridList', GridListVariantProps> {}
 
-const GridListRoot = withProvider<HTMLDivElement, GridList.RootProps>(
+const GridListRoot = withProvider<HTMLDivElement, GridListRootProps>(
   GridList.Root,
   'root',
 )

packages/saas-ui-react/src/components/icon-button/index.ts

@@ -0,0 +1 @@
+export { IconButton, type IconButtonProps } from '@chakra-ui/react'

packages/saas-ui-react/src/index.ts

@@ -16,6 +16,7 @@ export * from './components/drawer/index.ts'
 export * from './components/empty-state/index.ts'
 export * from './components/grid-list/index.ts'
 export * from './components/icon-badge/index.ts'
+export * from './components/icon-button/index.ts'
 export * from './components/input-group/index.ts'
 export * from './components/link/index.ts'
 export * from './components/loading-overlay/index.ts'

packages/saas-ui-react/src/theme/recipes/chakra/empty-state.ts

@@ -7,6 +7,11 @@ export const emptyStateSlotRecipe = defineSlotRecipe({
   base: {
     root: {
       width: 'full',
+      height: 'full',
+      display: 'flex',
+      flexDirection: 'column',
+      alignItems: 'center',
+      justifyContent: 'center',
     },
     content: {
       display: 'flex',

packages/saas-ui-react/src/types.ts

@@ -2,6 +2,7 @@ import {
   RecipeProps as ChakraRecipeProps,
   SlotRecipeProps as ChakraSlotRecipeProps,
   type RecipeDefinition,
+  type SlotRecipeDefinition,
 } from '@chakra-ui/react'
 
 export type RecipeProps<T, DefaultRecipe> =
@@ -10,6 +11,8 @@ export type RecipeProps<T, DefaultRecipe> =
     : ChakraRecipeProps<T>
 
 export type SlotRecipeProps<T, DefaultSlotRecipe> =
-  ChakraSlotRecipeProps<T> extends { recipe?: RecipeDefinition }
-    ? ChakraSlotRecipeProps<T> & DefaultSlotRecipe
-    : ChakraSlotRecipeProps<T>
+  ChakraSlotRecipeProps<T> extends { variant?: any }
+    ? ChakraSlotRecipeProps<T>
+    : ChakraSlotRecipeProps<T> & DefaultSlotRecipe
+
+type Test = ChakraSlotRecipeProps<'suiGridList'>