@umami/react-zen 0.208.0 → 0.209.0

package/dist/index.js

@@ -33199,9 +33199,9 @@ function Calendar2({
       onChange: handleChange,
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("header", { className: Calendar_default.header, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Button2, { slot: "previous", className: Calendar_default.button, variant: "quiet", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Icon2, { rotate: 180, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronDown, {}) }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Button2, { slot: "previous", className: Calendar_default.button, variant: "quiet", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Icon2, { rotate: 90, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronDown, {}) }) }),
           /* @__PURE__ */ (0, import_jsx_runtime28.jsx)($5cb03073d3f54797$export$a8a3e93435678ff9, { className: Calendar_default.heading }),
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Button2, { slot: "next", className: Calendar_default.button, variant: "quiet", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Icon2, { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronDown, {}) }) })
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Button2, { slot: "next", className: Calendar_default.button, variant: "quiet", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Icon2, { rotate: -90, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronDown, {}) }) })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)($dfd62f934fc76fed$export$5bd780d491cfc46c, { children: [
           /* @__PURE__ */ (0, import_jsx_runtime28.jsx)($dfd62f934fc76fed$export$22e2d15eaa4d2377, { children: (day) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)($dfd62f934fc76fed$export$ad2135cac3a11b3d, { className: Calendar_default.headerCell, children: day }) }),
@@ -33241,9 +33241,47 @@ function Checkbox2({ label, className, children, ...props }) {
 // src/components/ComboBox.tsx
 var import_classnames23 = __toESM(require_classnames());
 
+// src/components/Grid.tsx
+var import_classnames21 = __toESM(require_classnames());
+var import_jsx_runtime30 = require("react/jsx-runtime");
+function Grid({
+  display = "grid",
+  justifyContent,
+  justifyItems,
+  alignContent,
+  alignItems,
+  gap,
+  gapX,
+  gapY,
+  autoFlow,
+  rows,
+  columns,
+  areas,
+  className,
+  style,
+  children,
+  ...props
+}) {
+  const [classes, styleProps] = useDesignProps({
+    display,
+    justifyContent,
+    justifyItems,
+    alignContent,
+    alignItems,
+    gap,
+    gapX,
+    gapY,
+    gridTemplateRows: rows,
+    gridTemplateColumns: columns,
+    gridTemplateAreas: areas,
+    gridAutoFlow: autoFlow
+  });
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Box, { ...props, className: (0, import_classnames21.default)(className, classes), style: { ...styleProps, ...style }, children });
+}
+
 // src/components/List.tsx
 var import_react187 = require("react");
-var import_classnames21 = __toESM(require_classnames());
+var import_classnames22 = __toESM(require_classnames());
 
 // src/lib/constants.ts
 var ACCENT_COLORS = [
@@ -33290,7 +33328,7 @@ function getHighlightColor(color) {
 var List_default = { "list": "List_list__Yzk2Y", "separator": "List_separator__ODZiZ", "section": "List_section__NTI0O", "header": "List_header__MjE1Y", "item": "List_item__MzU5Y", "checkmark": "List_checkmark__YzRiZ", "hideCheckmark": "List_hideCheckmark__NDlhN", "fullscreen": "List_fullscreen__NWMyY" };
 
 // src/components/List.tsx
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 function List({
   id,
   items = [],
@@ -33318,9 +33356,9 @@ function List({
     }
   };
   const fieldId = useFieldId(id);
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
-    label && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Label2, { htmlFor: fieldId, children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_jsx_runtime31.Fragment, { children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Label2, { htmlFor: fieldId, children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
       $eed445e0843c11d0$export$41f133550aa26f48,
       {
         id: fieldId,
@@ -33329,7 +33367,7 @@ function List({
         selectedKeys: value || selectedKeys,
         defaultSelectedKeys: value || defaultSelectedKeys,
         items,
-        className: (0, import_classnames21.default)(
+        className: (0, import_classnames22.default)(
           List_default.list,
           className,
           !showCheckmark && List_default.hideCheckmark,
@@ -33340,9 +33378,9 @@ function List({
         children: children || items?.map((item) => {
           const id2 = item[idProperty] || item.toString();
           const label2 = item[labelProperty] || item.toString();
-          return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react187.Fragment, { children: [
-            item[separatorProperty] && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)($431f98aba6844401$export$1ff3c3f08ae963c0, { className: List_default.separator }),
-            /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(ListItem, { id: id2, className: List_default.item, children: label2 })
+          return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react187.Fragment, { children: [
+            item[separatorProperty] && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)($431f98aba6844401$export$1ff3c3f08ae963c0, { className: List_default.separator }),
+            /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ListItem, { id: id2, className: List_default.item, children: label2 })
           ] }, id2);
         })
       }
@@ -33356,68 +33394,30 @@ function ListItem({
   showCheckmark = true,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
     $eed445e0843c11d0$export$a11e76429ed99b4,
     {
       ...props,
       id,
-      className: (0, import_classnames21.default)(List_default.item, className),
+      className: (0, import_classnames22.default)(List_default.item, className),
       textValue: typeof children === "string" ? children : id?.toString(),
       children: [
         children,
-        showCheckmark && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Icon2, { "aria-hidden": "true", className: List_default.checkmark, children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(Check, {}) })
+        showCheckmark && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Icon2, { "aria-hidden": "true", className: List_default.checkmark, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Check, {}) })
       ]
     }
   );
 }
 function ListSeparator({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)($431f98aba6844401$export$1ff3c3f08ae963c0, { ...props, className: (0, import_classnames21.default)(List_default.separator, className) });
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)($431f98aba6844401$export$1ff3c3f08ae963c0, { ...props, className: (0, import_classnames22.default)(List_default.separator, className) });
 }
 function ListSection({ title, className, children, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)($eed445e0843c11d0$export$dca12b0bb56e4fc, { ...props, className: (0, import_classnames21.default)(List_default.section, className), children: [
-    title && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)($72a5793c14baf454$export$8b251419efc915eb, { className: List_default.header, children: title }),
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)($eed445e0843c11d0$export$dca12b0bb56e4fc, { ...props, className: (0, import_classnames22.default)(List_default.section, className), children: [
+    title && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)($72a5793c14baf454$export$8b251419efc915eb, { className: List_default.header, children: title }),
     children
   ] });
 }
 
-// src/components/Grid.tsx
-var import_classnames22 = __toESM(require_classnames());
-var import_jsx_runtime31 = require("react/jsx-runtime");
-function Grid({
-  display = "grid",
-  justifyContent,
-  justifyItems,
-  alignContent,
-  alignItems,
-  gap,
-  gapX,
-  gapY,
-  autoFlow,
-  rows,
-  columns,
-  areas,
-  className,
-  style,
-  children,
-  ...props
-}) {
-  const [classes, styleProps] = useDesignProps({
-    display,
-    justifyContent,
-    justifyItems,
-    alignContent,
-    alignItems,
-    gap,
-    gapX,
-    gapY,
-    gridTemplateRows: rows,
-    gridTemplateColumns: columns,
-    gridTemplateAreas: areas,
-    gridAutoFlow: autoFlow
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Box, { ...props, className: (0, import_classnames22.default)(className, classes), style: { ...styleProps, ...style }, children });
-}
-
 // css-modules:E:\dev\umami-react-zen\src\components\ComboBox.module.css
 var ComboBox_default = { "combobox": "ComboBox_combobox__ZDYxZ", "input": "ComboBox_input__YjNkN", "button": "ComboBox_button__NTlhM", "list": "ComboBox_list__NTdiY" };
 

package/dist/index.mjs

@@ -33074,9 +33074,9 @@ function Calendar2({
       onChange: handleChange,
       children: [
         /* @__PURE__ */ jsxs13("header", { className: Calendar_default.header, children: [
-          /* @__PURE__ */ jsx28(Button2, { slot: "previous", className: Calendar_default.button, variant: "quiet", children: /* @__PURE__ */ jsx28(Icon2, { rotate: 180, children: /* @__PURE__ */ jsx28(ChevronDown, {}) }) }),
+          /* @__PURE__ */ jsx28(Button2, { slot: "previous", className: Calendar_default.button, variant: "quiet", children: /* @__PURE__ */ jsx28(Icon2, { rotate: 90, children: /* @__PURE__ */ jsx28(ChevronDown, {}) }) }),
           /* @__PURE__ */ jsx28($5cb03073d3f54797$export$a8a3e93435678ff9, { className: Calendar_default.heading }),
-          /* @__PURE__ */ jsx28(Button2, { slot: "next", className: Calendar_default.button, variant: "quiet", children: /* @__PURE__ */ jsx28(Icon2, { children: /* @__PURE__ */ jsx28(ChevronDown, {}) }) })
+          /* @__PURE__ */ jsx28(Button2, { slot: "next", className: Calendar_default.button, variant: "quiet", children: /* @__PURE__ */ jsx28(Icon2, { rotate: -90, children: /* @__PURE__ */ jsx28(ChevronDown, {}) }) })
         ] }),
         /* @__PURE__ */ jsxs13($dfd62f934fc76fed$export$5bd780d491cfc46c, { children: [
           /* @__PURE__ */ jsx28($dfd62f934fc76fed$export$22e2d15eaa4d2377, { children: (day) => /* @__PURE__ */ jsx28($dfd62f934fc76fed$export$ad2135cac3a11b3d, { className: Calendar_default.headerCell, children: day }) }),
@@ -33116,9 +33116,47 @@ function Checkbox2({ label, className, children, ...props }) {
 // src/components/ComboBox.tsx
 var import_classnames23 = __toESM(require_classnames());
 
+// src/components/Grid.tsx
+var import_classnames21 = __toESM(require_classnames());
+import { jsx as jsx30 } from "react/jsx-runtime";
+function Grid({
+  display = "grid",
+  justifyContent,
+  justifyItems,
+  alignContent,
+  alignItems,
+  gap,
+  gapX,
+  gapY,
+  autoFlow,
+  rows,
+  columns,
+  areas,
+  className,
+  style,
+  children,
+  ...props
+}) {
+  const [classes, styleProps] = useDesignProps({
+    display,
+    justifyContent,
+    justifyItems,
+    alignContent,
+    alignItems,
+    gap,
+    gapX,
+    gapY,
+    gridTemplateRows: rows,
+    gridTemplateColumns: columns,
+    gridTemplateAreas: areas,
+    gridAutoFlow: autoFlow
+  });
+  return /* @__PURE__ */ jsx30(Box, { ...props, className: (0, import_classnames21.default)(className, classes), style: { ...styleProps, ...style }, children });
+}
+
 // src/components/List.tsx
 import { Fragment as Fragment3 } from "react";
-var import_classnames21 = __toESM(require_classnames());
+var import_classnames22 = __toESM(require_classnames());
 
 // src/lib/constants.ts
 var ACCENT_COLORS = [
@@ -33165,7 +33203,7 @@ function getHighlightColor(color) {
 var List_default = { "list": "List_list__Yzk2Y", "separator": "List_separator__ODZiZ", "section": "List_section__NTI0O", "header": "List_header__MjE1Y", "item": "List_item__MzU5Y", "checkmark": "List_checkmark__YzRiZ", "hideCheckmark": "List_hideCheckmark__NDlhN", "fullscreen": "List_fullscreen__NWMyY" };
 
 // src/components/List.tsx
-import { Fragment as Fragment4, jsx as jsx30, jsxs as jsxs15 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx31, jsxs as jsxs15 } from "react/jsx-runtime";
 function List({
   id,
   items = [],
@@ -33194,8 +33232,8 @@ function List({
   };
   const fieldId = useFieldId(id);
   return /* @__PURE__ */ jsxs15(Fragment4, { children: [
-    label && /* @__PURE__ */ jsx30(Label2, { htmlFor: fieldId, children: label }),
-    /* @__PURE__ */ jsx30(
+    label && /* @__PURE__ */ jsx31(Label2, { htmlFor: fieldId, children: label }),
+    /* @__PURE__ */ jsx31(
       $eed445e0843c11d0$export$41f133550aa26f48,
       {
         id: fieldId,
@@ -33204,7 +33242,7 @@ function List({
         selectedKeys: value || selectedKeys,
         defaultSelectedKeys: value || defaultSelectedKeys,
         items,
-        className: (0, import_classnames21.default)(
+        className: (0, import_classnames22.default)(
           List_default.list,
           className,
           !showCheckmark && List_default.hideCheckmark,
@@ -33216,8 +33254,8 @@ function List({
           const id2 = item[idProperty] || item.toString();
           const label2 = item[labelProperty] || item.toString();
           return /* @__PURE__ */ jsxs15(Fragment3, { children: [
-            item[separatorProperty] && /* @__PURE__ */ jsx30($431f98aba6844401$export$1ff3c3f08ae963c0, { className: List_default.separator }),
-            /* @__PURE__ */ jsx30(ListItem, { id: id2, className: List_default.item, children: label2 })
+            item[separatorProperty] && /* @__PURE__ */ jsx31($431f98aba6844401$export$1ff3c3f08ae963c0, { className: List_default.separator }),
+            /* @__PURE__ */ jsx31(ListItem, { id: id2, className: List_default.item, children: label2 })
           ] }, id2);
         })
       }
@@ -33236,63 +33274,25 @@ function ListItem({
     {
       ...props,
       id,
-      className: (0, import_classnames21.default)(List_default.item, className),
+      className: (0, import_classnames22.default)(List_default.item, className),
       textValue: typeof children === "string" ? children : id?.toString(),
       children: [
         children,
-        showCheckmark && /* @__PURE__ */ jsx30(Icon2, { "aria-hidden": "true", className: List_default.checkmark, children: /* @__PURE__ */ jsx30(Check, {}) })
+        showCheckmark && /* @__PURE__ */ jsx31(Icon2, { "aria-hidden": "true", className: List_default.checkmark, children: /* @__PURE__ */ jsx31(Check, {}) })
       ]
     }
   );
 }
 function ListSeparator({ className, ...props }) {
-  return /* @__PURE__ */ jsx30($431f98aba6844401$export$1ff3c3f08ae963c0, { ...props, className: (0, import_classnames21.default)(List_default.separator, className) });
+  return /* @__PURE__ */ jsx31($431f98aba6844401$export$1ff3c3f08ae963c0, { ...props, className: (0, import_classnames22.default)(List_default.separator, className) });
 }
 function ListSection({ title, className, children, ...props }) {
-  return /* @__PURE__ */ jsxs15($eed445e0843c11d0$export$dca12b0bb56e4fc, { ...props, className: (0, import_classnames21.default)(List_default.section, className), children: [
-    title && /* @__PURE__ */ jsx30($72a5793c14baf454$export$8b251419efc915eb, { className: List_default.header, children: title }),
+  return /* @__PURE__ */ jsxs15($eed445e0843c11d0$export$dca12b0bb56e4fc, { ...props, className: (0, import_classnames22.default)(List_default.section, className), children: [
+    title && /* @__PURE__ */ jsx31($72a5793c14baf454$export$8b251419efc915eb, { className: List_default.header, children: title }),
     children
   ] });
 }
 
-// src/components/Grid.tsx
-var import_classnames22 = __toESM(require_classnames());
-import { jsx as jsx31 } from "react/jsx-runtime";
-function Grid({
-  display = "grid",
-  justifyContent,
-  justifyItems,
-  alignContent,
-  alignItems,
-  gap,
-  gapX,
-  gapY,
-  autoFlow,
-  rows,
-  columns,
-  areas,
-  className,
-  style,
-  children,
-  ...props
-}) {
-  const [classes, styleProps] = useDesignProps({
-    display,
-    justifyContent,
-    justifyItems,
-    alignContent,
-    alignItems,
-    gap,
-    gapX,
-    gapY,
-    gridTemplateRows: rows,
-    gridTemplateColumns: columns,
-    gridTemplateAreas: areas,
-    gridAutoFlow: autoFlow
-  });
-  return /* @__PURE__ */ jsx31(Box, { ...props, className: (0, import_classnames22.default)(className, classes), style: { ...styleProps, ...style }, children });
-}
-
 // css-modules:E:\dev\umami-react-zen\src\components\ComboBox.module.css
 var ComboBox_default = { "combobox": "ComboBox_combobox__ZDYxZ", "input": "ComboBox_input__YjNkN", "button": "ComboBox_button__NTlhM", "list": "ComboBox_list__NTdiY" };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umami/react-zen",
-  "version": "0.208.0",
+  "version": "0.209.0",
   "description": "Modern, minimalist React component library",
   "author": "Umami <hello@umami.is>",
   "license": "MIT",