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

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @saas-ui/react
 
+## 3.0.0-alpha.19
+
+### Patch Changes
+
+- ba3b566: Improved Sidebar contrast
+- 38082d4: Improved horizontal field styles
+- ba3b566: Improved focusRing styles
+- ba3b566: Added SegmentControl stories and made sizing consistent with buttons
+- 3a73bc8: Fixed incorrect props type for GridListRoot
+- ba3b566: Sidebar.Button now renders a div with role="button"
+- 727b902: Allow click event on Sidebar.Track to be prevented
+
 ## 3.0.0-alpha.18
 
 ### Minor Changes

package/dist/chunk-QVFJV6HJ.js

@@ -0,0 +1,8 @@
+'use client'
+
+// src/components/icon-button/index.ts
+import { IconButton } from "@chakra-ui/react";
+
+export {
+  IconButton
+};

package/dist/{chunk-ULAJ3JEO.js → chunk-S5J6REMC.js}

@@ -18,7 +18,15 @@ var NumberInput = forwardRef(
       ...rest
     } = props;
     return /* @__PURE__ */ jsxs(ChakraNumberInput.Root, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ jsx(InputGroup, { startElement, endElement, children: /* @__PURE__ */ jsx(ChakraNumberInput.Input, { ref, ...inputProps }) }),
+      /* @__PURE__ */ jsx(
+        InputGroup,
+        {
+          startElement,
+          endElement,
+          width: "full",
+          children: /* @__PURE__ */ jsx(ChakraNumberInput.Input, { ref, ...inputProps })
+        }
+      ),
       !hideControls && !endElement ? /* @__PURE__ */ jsxs(ChakraNumberInput.Control, { children: [
         /* @__PURE__ */ jsx(ChakraNumberInput.IncrementTrigger, {}),
         /* @__PURE__ */ jsx(ChakraNumberInput.DecrementTrigger, {})

package/dist/components/card/index.cjs

@@ -0,0 +1,31 @@
+'use client'
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/card/index.ts
+var card_exports = {};
+__export(card_exports, {
+  Card: () => import_react.Card
+});
+module.exports = __toCommonJS(card_exports);
+var import_react = require("@chakra-ui/react");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Card
+});

package/dist/components/card/index.d.cts

@@ -0,0 +1 @@
+export { Card } from '@chakra-ui/react';

package/dist/components/card/index.d.ts

@@ -0,0 +1 @@
+export { Card } from '@chakra-ui/react';

package/dist/components/card/index.js

@@ -0,0 +1,8 @@
+'use client'
+import "../../chunk-RTMS5TJN.js";
+
+// src/components/card/index.ts
+import { Card } from "@chakra-ui/react";
+export {
+  Card
+};

package/dist/components/command/index.d.cts

@@ -1,10 +1,7 @@
 import * as react from 'react';
 import * as _chakra_ui_react from '@chakra-ui/react';
-import { RecipeProps as RecipeProps$1, RecipeDefinition, RecipeVariantProps, HTMLChakraProps, UnstyledProp } from '@chakra-ui/react';
-
-type RecipeProps<T, DefaultRecipe> = RecipeProps$1<T> extends {
-    recipe?: RecipeDefinition;
-} ? RecipeProps$1<T> & DefaultRecipe : RecipeProps$1<T>;
+import { RecipeVariantProps, HTMLChakraProps, UnstyledProp } from '@chakra-ui/react';
+import { R as RecipeProps } from '../../types-DnFoUudY.cjs';
 
 declare const commandRecipe: _chakra_ui_react.RecipeDefinition<{
     size: {

package/dist/components/command/index.d.ts

@@ -1,10 +1,7 @@
 import * as react from 'react';
 import * as _chakra_ui_react from '@chakra-ui/react';
-import { RecipeProps as RecipeProps$1, RecipeDefinition, RecipeVariantProps, HTMLChakraProps, UnstyledProp } from '@chakra-ui/react';
-
-type RecipeProps<T, DefaultRecipe> = RecipeProps$1<T> extends {
-    recipe?: RecipeDefinition;
-} ? RecipeProps$1<T> & DefaultRecipe : RecipeProps$1<T>;
+import { RecipeVariantProps, HTMLChakraProps, UnstyledProp } from '@chakra-ui/react';
+import { R as RecipeProps } from '../../types-DnFoUudY.js';
 
 declare const commandRecipe: _chakra_ui_react.RecipeDefinition<{
     size: {

package/dist/components/grid-list/index.d.cts

@@ -1,10 +1,72 @@
 import * as react from 'react';
-import { HTMLChakraProps, SlotRecipeProps } from '@chakra-ui/react';
+import * as _chakra_ui_react from '@chakra-ui/react';
+import { RecipeVariantProps, HTMLChakraProps } from '@chakra-ui/react';
 import { GridList } from '@saas-ui/core/grid-list';
+import { S as SlotRecipeProps } from '../../types-DnFoUudY.cjs';
 
-interface GridListRootProps extends GridList.RootProps, HTMLChakraProps<'div'>, SlotRecipeProps<'suiGridList'> {
+declare const gridListSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"cell" | "root" | "item" | "header", {
+    interactive: {
+        true: {
+            item: {
+                cursor: "button";
+                transitionProperty: "bg";
+                transitionDuration: "fast";
+                _hover: {
+                    bg: "bg.subtle";
+                };
+                _active: {
+                    bg: "bg.subtle";
+                };
+            };
+        };
+    };
+    variant: {
+        simple: {};
+        rounded: {
+            item: {
+                borderRadius: "md";
+                mb: number;
+            };
+        };
+    };
+    size: {
+        sm: {
+            root: {
+                textStyle: "sm";
+                py: number;
+            };
+            item: {
+                py: number;
+                px: number;
+                gap: number;
+            };
+            header: {
+                py: number;
+                px: number;
+            };
+        };
+        md: {
+            root: {
+                textStyle: "md";
+                py: number;
+            };
+            item: {
+                py: number;
+                px: number;
+                gap: number;
+            };
+            header: {
+                py: number;
+                px: number;
+            };
+        };
+    };
+}>;
+type GridListVariantProps = RecipeVariantProps<typeof gridListSlotRecipe>;
+
+interface GridListRootProps extends GridList.RootProps, HTMLChakraProps<'div'>, SlotRecipeProps<'suiGridList', GridListVariantProps> {
 }
-declare const GridListRoot: react.ForwardRefExoticComponent<GridList.RootProps & react.RefAttributes<HTMLDivElement>>;
+declare const GridListRoot: react.ForwardRefExoticComponent<GridListRootProps & react.RefAttributes<HTMLDivElement>>;
 interface GridListItemProps extends GridList.ItemProps, HTMLChakraProps<'div'> {
 }
 declare const GridListItem: react.ForwardRefExoticComponent<GridListItemProps & react.RefAttributes<HTMLDivElement>>;

package/dist/components/grid-list/index.d.ts

@@ -1,10 +1,72 @@
 import * as react from 'react';
-import { HTMLChakraProps, SlotRecipeProps } from '@chakra-ui/react';
+import * as _chakra_ui_react from '@chakra-ui/react';
+import { RecipeVariantProps, HTMLChakraProps } from '@chakra-ui/react';
 import { GridList } from '@saas-ui/core/grid-list';
+import { S as SlotRecipeProps } from '../../types-DnFoUudY.js';
 
-interface GridListRootProps extends GridList.RootProps, HTMLChakraProps<'div'>, SlotRecipeProps<'suiGridList'> {
+declare const gridListSlotRecipe: _chakra_ui_react.SlotRecipeDefinition<"cell" | "root" | "item" | "header", {
+    interactive: {
+        true: {
+            item: {
+                cursor: "button";
+                transitionProperty: "bg";
+                transitionDuration: "fast";
+                _hover: {
+                    bg: "bg.subtle";
+                };
+                _active: {
+                    bg: "bg.subtle";
+                };
+            };
+        };
+    };
+    variant: {
+        simple: {};
+        rounded: {
+            item: {
+                borderRadius: "md";
+                mb: number;
+            };
+        };
+    };
+    size: {
+        sm: {
+            root: {
+                textStyle: "sm";
+                py: number;
+            };
+            item: {
+                py: number;
+                px: number;
+                gap: number;
+            };
+            header: {
+                py: number;
+                px: number;
+            };
+        };
+        md: {
+            root: {
+                textStyle: "md";
+                py: number;
+            };
+            item: {
+                py: number;
+                px: number;
+                gap: number;
+            };
+            header: {
+                py: number;
+                px: number;
+            };
+        };
+    };
+}>;
+type GridListVariantProps = RecipeVariantProps<typeof gridListSlotRecipe>;
+
+interface GridListRootProps extends GridList.RootProps, HTMLChakraProps<'div'>, SlotRecipeProps<'suiGridList', GridListVariantProps> {
 }
-declare const GridListRoot: react.ForwardRefExoticComponent<GridList.RootProps & react.RefAttributes<HTMLDivElement>>;
+declare const GridListRoot: react.ForwardRefExoticComponent<GridListRootProps & react.RefAttributes<HTMLDivElement>>;
 interface GridListItemProps extends GridList.ItemProps, HTMLChakraProps<'div'> {
 }
 declare const GridListItem: react.ForwardRefExoticComponent<GridListItemProps & react.RefAttributes<HTMLDivElement>>;

package/dist/components/icon-button/index.cjs

@@ -0,0 +1,31 @@
+'use client'
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/icon-button/index.ts
+var icon_button_exports = {};
+__export(icon_button_exports, {
+  IconButton: () => import_react.IconButton
+});
+module.exports = __toCommonJS(icon_button_exports);
+var import_react = require("@chakra-ui/react");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  IconButton
+});

package/dist/components/icon-button/index.d.cts

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

package/dist/components/icon-button/index.d.ts

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

package/dist/components/icon-button/index.js

@@ -0,0 +1,8 @@
+'use client'
+import {
+  IconButton
+} from "../../chunk-QVFJV6HJ.js";
+import "../../chunk-RTMS5TJN.js";
+export {
+  IconButton
+};

package/dist/components/number-input/index.cjs

@@ -68,7 +68,15 @@ var NumberInput = (0, import_react3.forwardRef)(
       ...rest
     } = props;
     return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_react4.NumberInput.Root, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(InputGroup, { startElement, endElement, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react4.NumberInput.Input, { ref, ...inputProps }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+        InputGroup,
+        {
+          startElement,
+          endElement,
+          width: "full",
+          children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react4.NumberInput.Input, { ref, ...inputProps })
+        }
+      ),
       !hideControls && !endElement ? /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_react4.NumberInput.Control, { children: [
         /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react4.NumberInput.IncrementTrigger, {}),
         /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react4.NumberInput.DecrementTrigger, {})

package/dist/components/number-input/index.js

@@ -1,7 +1,7 @@
 'use client'
 import {
   NumberInput
-} from "../../chunk-ULAJ3JEO.js";
+} from "../../chunk-S5J6REMC.js";
 import "../../chunk-PKI6YH2V.js";
 import "../../chunk-RTMS5TJN.js";
 export {