@saas-ui/react 3.0.0-alpha.16 → 3.0.0-alpha.18

package/dist/index.d.cts

@@ -22,6 +22,7 @@ export { LoadingOverlay, useLoadingOverlayStyles } from './components/loading-ov
 export { Navbar } from './components/navbar/index.cjs';
 export { NumberInput, NumberInputProps } from './components/number-input/index.cjs';
 export { Menu } from './components/menu/index.cjs';
+export { Pagination } from './components/pagination/index.cjs';
 export { PasswordInput, PasswordInputProps } from './components/password-input/index.cjs';
 export { Persona, PersonaAvatar, PersonaAvatarProps, PersonaProps, Presence, PresenceConfig, defaultPresenceOptions } from './components/persona/index.cjs';
 export { PinInput, PinInputProps } from './components/pin-input/index.cjs';

package/dist/index.d.ts

@@ -22,6 +22,7 @@ export { LoadingOverlay, useLoadingOverlayStyles } from './components/loading-ov
 export { Navbar } from './components/navbar/index.js';
 export { NumberInput, NumberInputProps } from './components/number-input/index.js';
 export { Menu } from './components/menu/index.js';
+export { Pagination } from './components/pagination/index.js';
 export { PasswordInput, PasswordInputProps } from './components/password-input/index.js';
 export { Persona, PersonaAvatar, PersonaAvatarProps, PersonaProps, Presence, PresenceConfig, defaultPresenceOptions } from './components/persona/index.js';
 export { PinInput, PinInputProps } from './components/pin-input/index.js';

package/dist/index.js

@@ -1,53 +1,60 @@
 import {
   Tooltip
 } from "./chunk-QSNSWCTM.js";
+import {
+  Toaster,
+  toast
+} from "./chunk-HELHPHIQ.js";
 import {
   colors
 } from "./chunk-3MO37LYW.js";
 import {
-  SearchInput
-} from "./chunk-LIYUBUOP.js";
+  Radio,
+  RadioGroup
+} from "./chunk-WYLMBMAH.js";
 import {
   SegmentedControl
 } from "./chunk-SKXSBAOS.js";
+import {
+  SearchInput
+} from "./chunk-46ISJZBS.js";
 import {
   namespace_exports as namespace_exports3
-} from "./chunk-S3CQW7GD.js";
+} from "./chunk-BU7QENBQ.js";
+import {
+  steps_exports
+} from "./chunk-VZG7EJ64.js";
 import {
   sidebar_exports,
   useSidebar,
   useSidebarItemStyles,
   useSidebarStyles
 } from "./chunk-GGAKUS66.js";
-import {
-  steps_exports
-} from "./chunk-44ZA3TYW.js";
 import {
   Switch
 } from "./chunk-SA3OGTOO.js";
-import {
-  Toaster,
-  toast
-} from "./chunk-HELHPHIQ.js";
-import {
-  loading_overlay_exports,
-  useLoadingOverlayStyles
-} from "./chunk-7VSTNV2B.js";
-import {
-  Spinner
-} from "./chunk-32JGENDB.js";
 import {
   menu_exports
-} from "./chunk-KK77TYNL.js";
+} from "./chunk-C7B3ELC4.js";
 import {
   navbar_exports
 } from "./chunk-Q6SNJJO2.js";
 import {
   NumberInput
 } from "./chunk-ULAJ3JEO.js";
+import {
+  loading_overlay_exports,
+  useLoadingOverlayStyles
+} from "./chunk-7VSTNV2B.js";
+import {
+  Spinner
+} from "./chunk-32JGENDB.js";
 import {
   PasswordInput
 } from "./chunk-CD2JUFI2.js";
+import {
+  pagination_exports
+} from "./chunk-MLJN6IOJ.js";
 import {
   Persona,
   PersonaAvatar,
@@ -56,16 +63,9 @@ import {
 import {
   PinInput
 } from "./chunk-2EUACKRH.js";
-import {
-  Radio,
-  RadioGroup
-} from "./chunk-WYLMBMAH.js";
-import {
-  namespace_exports
-} from "./chunk-CB52LBJK.js";
 import {
   namespace_exports as namespace_exports2
-} from "./chunk-H6TFEHY4.js";
+} from "./chunk-WS5XGFSL.js";
 import {
   EmptyState
 } from "./chunk-FJFNGSPL.js";
@@ -75,6 +75,9 @@ import {
 import {
   IconBadge
 } from "./chunk-I2RXEKTB.js";
+import {
+  namespace_exports
+} from "./chunk-72LEGXHY.js";
 import "./chunk-KTLWEUNW.js";
 import {
   InputGroup
@@ -106,8 +109,8 @@ import {
 } from "./chunk-L356FPLY.js";
 import {
   CloseButton
-} from "./chunk-FZW2DYK3.js";
-import "./chunk-VDXTEASE.js";
+} from "./chunk-BKYGKH3L.js";
+import "./chunk-4TPVIHNO.js";
 import {
   Command
 } from "./chunk-UASXI64E.js";
@@ -2302,7 +2305,7 @@ var appShellSlotRecipe = defineSlotRecipe({
     position: {
       static: {
         root: {
-          height: "100vh"
+          height: "100dvh"
         }
       },
       fullscreen: {
@@ -2313,18 +2316,12 @@ var appShellSlotRecipe = defineSlotRecipe({
       }
     },
     variant: {
-      plain: {},
-      raised: {
-        main: {
-          boxShadow: "xs",
-          zIndex: "layer-1"
-        }
-      }
+      plain: {}
     }
   },
   defaultVariants: {
     position: "static",
-    variant: "raised"
+    variant: "plain"
   }
 });
 
@@ -2335,7 +2332,6 @@ var gridListSlotRecipe = defineSlotRecipe2({
   slots: ["root", "item", "header", "cell"],
   base: {
     root: {
-      py: 2,
       position: "relative"
     },
     item: {
@@ -2344,35 +2340,14 @@ var gridListSlotRecipe = defineSlotRecipe2({
       alignItems: "center",
       justifyContent: "space-between",
       flex: 1,
-      cursor: "pointer",
       userSelect: "none",
-      transitionProperty: "common",
-      transitionDuration: "normal",
       borderRadius: "inherit",
       outline: "none",
-      _hover: {
-        bg: "blackAlpha.50",
-        _dark: {
-          bg: "whiteAlpha.50"
-        }
-      },
       _focusVisible: {
         boxShadow: "outline"
       },
-      _focus: {
-        bg: "blackAlpha.50",
-        _dark: {
-          bg: "whiteAlpha.50"
-        }
-      },
-      _active: {
-        bg: "blackAlpha.100",
-        _dark: {
-          bg: "whiteAlpha.100"
-        }
-      },
       _disabled: {
-        cursor: "inherit",
+        cursor: "disabled",
         opacity: 0.5,
         _hover: {
           bg: "transparent",
@@ -2394,50 +2369,92 @@ var gridListSlotRecipe = defineSlotRecipe2({
       position: "sticky",
       fontSize: "md",
       fontWeight: "semibold",
-      color: "muted"
+      color: "fg.muted"
     },
     cell: {
-      display: "flex",
       flexShrink: 0
     }
   },
   variants: {
+    interactive: {
+      true: {
+        item: {
+          cursor: "button",
+          transitionProperty: "bg",
+          transitionDuration: "fast",
+          _hover: {
+            bg: "bg.subtle"
+          },
+          _active: {
+            bg: "bg.subtle"
+          }
+        }
+      }
+    },
+    variant: {
+      simple: {},
+      rounded: {
+        item: {
+          borderRadius: "md",
+          mb: 0.5
+        }
+      }
+    },
     size: {
       sm: {
         root: {
-          fontSize: "sm"
+          textStyle: "sm",
+          py: 0.5
         },
         item: {
           py: 1,
-          px: 1
+          px: 2,
+          gap: 1
         },
         header: {
           py: 1,
-          px: 1
-        },
-        cell: {
-          px: 1
+          px: 2
         }
       },
       md: {
         root: {
-          fontSize: "md"
+          textStyle: "md",
+          py: 1
         },
         item: {
           py: 2,
-          px: 2
+          px: 3,
+          gap: 2
         },
         header: {
           py: 2,
-          px: 2
-        },
-        cell: {
-          px: 2
+          px: 3
         }
       }
     }
   },
+  compoundVariants: [
+    {
+      variant: "rounded",
+      size: "sm",
+      css: {
+        root: {
+          p: 1
+        }
+      }
+    },
+    {
+      variant: "rounded",
+      size: "md",
+      css: {
+        root: {
+          p: 2
+        }
+      }
+    }
+  ],
   defaultVariants: {
+    variant: "simple",
     size: "md"
   }
 });
@@ -2520,7 +2537,7 @@ var navbarSlotRecipe = defineSlotRecipe4({
       top: 0,
       insetX: 0,
       transitionProperty: "common",
-      transitionDuration: "normal",
+      transitionDuration: "moderate",
       transitionTimingFunction: "ease-in-out",
       _hidden: {
         transform: "translateY(-100%)"
@@ -2556,7 +2573,7 @@ var navbarSlotRecipe = defineSlotRecipe4({
       boxSizing: "border-box",
       borderRadius: "md",
       transitionProperty: "common",
-      transitionDuration: "normal",
+      transitionDuration: "moderate",
       lineHeight: 1,
       _focusVisible: {
         outline: "none",
@@ -4605,7 +4622,7 @@ var editableSlotRecipe = defineSlotRecipe21({
       display: "inline-flex",
       alignItems: "center",
       transitionProperty: "common",
-      transitionDuration: "normal",
+      transitionDuration: "moderate",
       cursor: "text",
       _hover: {
         bg: "bg.muted"
@@ -4620,7 +4637,7 @@ var editableSlotRecipe = defineSlotRecipe21({
       py: "1",
       px: "1",
       transitionProperty: "common",
-      transitionDuration: "normal",
+      transitionDuration: "moderate",
       width: "full",
       focusVisibleRing: "inside",
       focusRingWidth: "2px",
@@ -8675,6 +8692,7 @@ export {
   menu_exports as Menu,
   navbar_exports as Navbar,
   NumberInput,
+  pagination_exports as Pagination,
   PasswordInput,
   Persona,
   PersonaAvatar,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saas-ui/react",
-  "version": "3.0.0-alpha.16",
+  "version": "3.0.0-alpha.18",
   "description": "Saas UI - The React component library for startups.",
   "type": "module",
   "exports": {
@@ -70,7 +70,7 @@
   },
   "dependencies": {
     "@ark-ui/react": "^4.4.4",
-    "@saas-ui/core": "3.0.0-alpha.4",
+    "@saas-ui/core": "3.0.0-alpha.5",
     "@saas-ui/hooks": "3.0.0-alpha.4"
   },
   "peerDependencies": {