@rafal.lemieszewski/tide-ui 0.87.6 → 0.87.8

package/dist/es/components/fundamental/card.js

@@ -1,68 +1,68 @@
 import { jsx as o } from "react/jsx-runtime";
-import * as t from "react";
-import { cn as d } from "../../lib/utils.js";
-const s = /* @__PURE__ */ t.forwardRef(({ className: a, ...r }, e) => /* @__PURE__ */ o(
+import * as d from "react";
+import { cn as t } from "../../lib/utils.js";
+const s = /* @__PURE__ */ d.forwardRef(({ className: r, ...a }, e) => /* @__PURE__ */ o(
   "div",
   {
     ref: e,
-    className: d(
-      "bg-[var(--color-surface-primary)] border border-[var(--color-border-primary-subtle)] rounded-l text-[var(--color-text-primary)]",
-      a
+    className: t(
+      "bg-[var(--color-surface-primary)] border border-[var(--color-border-primary-subtle)] rounded-[var(--border-radius-l)] text-[var(--color-text-primary)]",
+      r
     ),
-    ...r
+    ...a
   }
 ));
 s.displayName = "Card";
-const c = /* @__PURE__ */ t.forwardRef(({ className: a, ...r }, e) => /* @__PURE__ */ o(
+const c = /* @__PURE__ */ d.forwardRef(({ className: r, ...a }, e) => /* @__PURE__ */ o(
   "div",
   {
     ref: e,
-    className: d("flex flex-col space-y-[var(--space-s)] p-[var(--space-l)]", a),
-    ...r
+    className: t("flex flex-col space-y-[var(--space-s)] p-[var(--space-l)]", r),
+    ...a
   }
 ));
 c.displayName = "CardHeader";
-const l = /* @__PURE__ */ t.forwardRef(({ className: a, ...r }, e) => /* @__PURE__ */ o(
+const i = /* @__PURE__ */ d.forwardRef(({ className: r, ...a }, e) => /* @__PURE__ */ o(
   "h3",
   {
     ref: e,
-    className: d("text-heading-md leading-none tracking-tight", a),
-    ...r
+    className: t("text-heading-md leading-none tracking-tight", r),
+    ...a
   }
 ));
-l.displayName = "CardTitle";
-const i = /* @__PURE__ */ t.forwardRef(({ className: a, ...r }, e) => /* @__PURE__ */ o(
+i.displayName = "CardTitle";
+const l = /* @__PURE__ */ d.forwardRef(({ className: r, ...a }, e) => /* @__PURE__ */ o(
   "p",
   {
     ref: e,
-    className: d("text-body-sm text-[var(--color-text-secondary)]", a),
-    ...r
+    className: t("text-body-sm text-[var(--color-text-secondary)]", r),
+    ...a
   }
 ));
-i.displayName = "CardDescription";
-const p = /* @__PURE__ */ t.forwardRef(({ className: a, ...r }, e) => /* @__PURE__ */ o(
+l.displayName = "CardDescription";
+const p = /* @__PURE__ */ d.forwardRef(({ className: r, ...a }, e) => /* @__PURE__ */ o(
   "div",
   {
     ref: e,
-    className: d("p-[var(--space-l)] pt-0", a),
-    ...r
+    className: t("p-[var(--space-l)] pt-0", r),
+    ...a
   }
 ));
 p.displayName = "CardContent";
-const m = /* @__PURE__ */ t.forwardRef(({ className: a, ...r }, e) => /* @__PURE__ */ o(
+const m = /* @__PURE__ */ d.forwardRef(({ className: r, ...a }, e) => /* @__PURE__ */ o(
   "div",
   {
     ref: e,
-    className: d("flex items-center p-[var(--space-l)] pt-0", a),
-    ...r
+    className: t("flex items-center p-[var(--space-l)] pt-0", r),
+    ...a
   }
 ));
 m.displayName = "CardFooter";
 export {
   s as Card,
   p as CardContent,
-  i as CardDescription,
+  l as CardDescription,
   m as CardFooter,
   c as CardHeader,
-  l as CardTitle
+  i as CardTitle
 };

package/dist/es/components/fundamental/chart.js

@@ -154,7 +154,7 @@ const G = (s, c = 0) => {
   return /* @__PURE__ */ m(
     "div",
     {
-      className: `rounded-s border border-[var(--color-border-primary-medium)] bg-[var(--color-surface-primary)] p-[var(--space-m)] shadow-md min-w-[120px] ${d} z-[9999]`,
+      className: `rounded-[var(--border-radius-s)] border border-[var(--color-border-primary-medium)] bg-[var(--color-surface-primary)] p-[var(--space-m)] shadow-[var(--shadow-300)] min-w-[120px] ${d} z-[9999]`,
       role: "tooltip",
       "aria-label": "Chart data tooltip",
       children: [

package/dist/es/components/fundamental/checkbox.js

@@ -1,11 +1,11 @@
 import { jsx as e } from "react/jsx-runtime";
 import * as s from "react";
 import * as r from "@radix-ui/react-checkbox";
-import { Minus as n, Check as b } from "lucide-react";
+import { Minus as b, Check as n } from "lucide-react";
 import { cva as t } from "class-variance-authority";
 import { cn as o } from "../../lib/utils.js";
 const l = t(
-  "peer w-[var(--size-2xs)] h-[var(--size-2xs)] shrink-0 rounded-s border-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring-color)] focus-visible:ring-offset-2 cursor-pointer hover:cursor-pointer [&:not(:disabled)]:cursor-pointer disabled:cursor-not-allowed disabled:opacity-100 box-border",
+  "peer w-[var(--size-2xs)] h-[var(--size-2xs)] shrink-0 rounded-[var(--border-radius-s)] border-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring-color)] focus-visible:ring-offset-2 cursor-pointer hover:cursor-pointer [&:not(:disabled)]:cursor-pointer disabled:cursor-not-allowed disabled:opacity-100 box-border",
   {
     variants: {
       variant: {
@@ -41,7 +41,7 @@ const l = t(
     ref: c,
     className: o(l({ variant: i }), d),
     ...a,
-    children: /* @__PURE__ */ e(r.Indicator, { className: o(v()), children: a.checked === "indeterminate" ? /* @__PURE__ */ e(n, {}) : /* @__PURE__ */ e(b, {}) })
+    children: /* @__PURE__ */ e(r.Indicator, { className: o(v()), children: a.checked === "indeterminate" ? /* @__PURE__ */ e(b, {}) : /* @__PURE__ */ e(n, {}) })
   }
 ));
 u.displayName = r.Root.displayName;

package/dist/es/components/fundamental/command.js

@@ -1,27 +1,27 @@
-import { jsx as r, jsxs as l } from "react/jsx-runtime";
+import { jsx as o, jsxs as l } from "react/jsx-runtime";
 import * as d from "react";
 import * as m from "@radix-ui/react-dialog";
-import { Command as o } from "cmdk";
+import { Command as r } from "cmdk";
 import { cn as s } from "../../lib/utils.js";
-import { Icon as b } from "./icon.js";
+import { Icon as g } from "./icon.js";
 import { Button as _ } from "./button.js";
 import { X as h } from "lucide-react";
 import { inputVariants as N } from "./input.js";
-const c = /* @__PURE__ */ d.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(
-  o,
+const c = /* @__PURE__ */ d.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ o(
+  r,
   {
     ref: t,
     loop: !0,
     className: s(
-      "flex h-full w-full flex-col overflow-hidden rounded-m bg-[var(--color-surface-primary)] text-[var(--color-text-primary)]",
+      "flex h-full w-full flex-col overflow-hidden rounded-[var(--border-radius-m)] bg-[var(--color-surface-primary)] text-[var(--color-text-primary)]",
       e
     ),
     ...a
   }
 ));
-c.displayName = o.displayName;
-const B = ({ children: e, commandProps: a, ...t }) => /* @__PURE__ */ r(m.Root, { ...t, children: /* @__PURE__ */ l(m.Portal, { children: [
-  /* @__PURE__ */ r(
+c.displayName = r.displayName;
+const B = ({ children: e, commandProps: a, ...t }) => /* @__PURE__ */ o(m.Root, { ...t, children: /* @__PURE__ */ l(m.Portal, { children: [
+  /* @__PURE__ */ o(
     m.Overlay,
     {
       className: s(
@@ -29,14 +29,14 @@ const B = ({ children: e, commandProps: a, ...t }) => /* @__PURE__ */ r(m.Root,
       )
     }
   ),
-  /* @__PURE__ */ r(
+  /* @__PURE__ */ o(
     m.Content,
     {
       className: s(
-        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed top-[50%] left-[50%] z-50 grid w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] overflow-hidden rounded-l border border-[var(--color-border-primary-subtle)] bg-[var(--color-surface-primary)] p-0 shadow-lg duration-200 max-w-[450px]"
+        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed top-[50%] left-[50%] z-50 grid w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] overflow-hidden rounded-[var(--border-radius-l)] border border-[var(--color-border-primary-subtle)] bg-[var(--color-surface-primary)] p-0 shadow-[var(--shadow-400)] duration-200 max-w-[450px]"
       ),
       "aria-describedby": void 0,
-      children: /* @__PURE__ */ r(
+      children: /* @__PURE__ */ o(
         c,
         {
           className: "[&_[cmdk-group-heading]]:px-[var(--space-m)] [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-[var(--color-text-tertiary)] [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-4 [&_[cmdk-input-wrapper]_svg]:w-4 [&_[cmdk-item]]:px-[var(--space-m)] [&_[cmdk-item]]:min-h-[var(--size-m)] [&_[cmdk-item]]:py-[var(--space-s)] [&_[cmdk-item]_svg]:h-4 [&_[cmdk-item]_svg]:w-4",
@@ -47,10 +47,10 @@ const B = ({ children: e, commandProps: a, ...t }) => /* @__PURE__ */ r(m.Root,
     }
   )
 ] }) }), w = /* @__PURE__ */ d.forwardRef(({ className: e, size: a = "m", clearable: t = !0, onClear: u, value: i, ...x }, f) => {
-  const p = t && i && String(i).length > 0, v = a === "s" ? "s" : "m", y = a === "s" ? "pl-[30px]" : "pl-[34px]", g = p ? "pr-[calc(var(--size-s)+var(--space-m)+var(--space-s))]" : "";
+  const p = t && i && String(i).length > 0, v = a === "s" ? "s" : "m", y = a === "s" ? "pl-[30px]" : "pl-[34px]", b = p ? "pr-[calc(var(--size-s)+var(--space-m)+var(--space-s))]" : "";
   return /* @__PURE__ */ l("div", { className: "relative p-[var(--space-s)] border-b border-[var(--color-border-primary-subtle)]", "cmdk-input-wrapper": "", children: [
-    /* @__PURE__ */ r(
-      b,
+    /* @__PURE__ */ o(
+      g,
       {
         name: "search",
         size: v,
@@ -58,15 +58,15 @@ const B = ({ children: e, commandProps: a, ...t }) => /* @__PURE__ */ r(m.Root,
         className: "absolute left-[18px] top-1/2 -translate-y-1/2 pointer-events-none"
       }
     ),
-    /* @__PURE__ */ r(
-      o.Input,
+    /* @__PURE__ */ o(
+      r.Input,
       {
         ref: f,
         value: i,
         className: s(
           N({ size: a, variant: "default" }),
           y,
-          g,
+          b,
           // Force typography to override cmdk defaults
           a === "s" && "[&]:text-body-sm",
           a === "m" && "[&]:text-body-md",
@@ -82,7 +82,7 @@ const B = ({ children: e, commandProps: a, ...t }) => /* @__PURE__ */ r(m.Root,
         ...x
       }
     ),
-    p && /* @__PURE__ */ r(
+    p && /* @__PURE__ */ o(
       _,
       {
         type: "button",
@@ -99,27 +99,27 @@ const B = ({ children: e, commandProps: a, ...t }) => /* @__PURE__ */ r(m.Root,
     )
   ] });
 });
-w.displayName = o.Input.displayName;
-const k = /* @__PURE__ */ d.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(
-  o.List,
+w.displayName = r.Input.displayName;
+const k = /* @__PURE__ */ d.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ o(
+  r.List,
   {
     ref: t,
     className: s("max-h-[300px] overflow-y-auto overflow-x-hidden", e),
     ...a
   }
 ));
-k.displayName = o.List.displayName;
-const C = /* @__PURE__ */ d.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(
-  o.Empty,
+k.displayName = r.List.displayName;
+const C = /* @__PURE__ */ d.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ o(
+  r.Empty,
   {
     ref: t,
     className: s("py-6 text-center [&]:text-body-md text-[var(--color-text-secondary)]", e),
     ...a
   }
 ));
-C.displayName = o.Empty.displayName;
-const R = /* @__PURE__ */ d.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(
-  o.Group,
+C.displayName = r.Empty.displayName;
+const R = /* @__PURE__ */ d.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ o(
+  r.Group,
   {
     ref: t,
     className: s(
@@ -129,28 +129,28 @@ const R = /* @__PURE__ */ d.forwardRef(({ className: e, ...a }, t) => /* @__PURE
     ...a
   }
 ));
-R.displayName = o.Group.displayName;
-const I = /* @__PURE__ */ d.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(
-  o.Separator,
+R.displayName = r.Group.displayName;
+const I = /* @__PURE__ */ d.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ o(
+  r.Separator,
   {
     ref: t,
     className: s("-mx-1 h-px bg-[var(--color-border-primary-subtle)]", e),
     ...a
   }
 ));
-I.displayName = o.Separator.displayName;
-const P = /* @__PURE__ */ d.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(
-  o.Item,
+I.displayName = r.Separator.displayName;
+const P = /* @__PURE__ */ d.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ o(
+  r.Item,
   {
     ref: t,
     className: s(
-      "[&]:text-body-md relative flex cursor-pointer select-none items-center rounded-m px-[var(--space-m)] min-h-[var(--size-m)] py-[var(--space-s)] outline-none transition-colors aria-selected:bg-[var(--color-background-neutral-subtlest-hovered)] aria-selected:text-[var(--color-text-primary)] data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50",
+      "[&]:text-body-md relative flex cursor-pointer select-none items-center rounded-[var(--border-radius-m)] px-[var(--space-m)] min-h-[var(--size-m)] py-[var(--space-s)] outline-none transition-colors aria-selected:bg-[var(--color-background-neutral-subtlest-hovered)] aria-selected:text-[var(--color-text-primary)] data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50",
       e
     ),
     ...a
   }
 ));
-P.displayName = o.Item.displayName;
+P.displayName = r.Item.displayName;
 export {
   c as Command,
   B as CommandDialog,

package/dist/es/components/fundamental/dialog.js

@@ -17,14 +17,14 @@ const C = o.Root, z = o.Trigger, f = o.Portal, R = o.Close, d = /* @__PURE__ */
   }
 ));
 d.displayName = o.Overlay.displayName;
-const x = /* @__PURE__ */ i.forwardRef(({ className: a, children: e, ...s }, c) => /* @__PURE__ */ l(f, { children: [
+const v = /* @__PURE__ */ i.forwardRef(({ className: a, children: e, ...s }, c) => /* @__PURE__ */ l(f, { children: [
   /* @__PURE__ */ t(d, {}),
   /* @__PURE__ */ l(
     o.Content,
     {
       ref: c,
       className: r(
-        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed top-[50%] left-[50%] z-50 flex flex-col w-[calc(100%-2rem)] max-w-lg max-h-[85vh] translate-x-[-50%] translate-y-[-50%] overflow-hidden rounded-l border border-[var(--color-border-primary-subtle)] bg-[var(--color-surface-primary)] shadow-xl duration-200 sm:max-w-[425px]",
+        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed top-[50%] left-[50%] z-50 flex flex-col w-[calc(100%-2rem)] max-w-lg max-h-[85vh] translate-x-[-50%] translate-y-[-50%] overflow-hidden rounded-[var(--border-radius-l)] border border-[var(--color-border-primary-subtle)] bg-[var(--color-surface-primary)] shadow-[var(--shadow-500)] duration-200 sm:max-w-[425px]",
         a
       ),
       "aria-describedby": void 0,
@@ -47,8 +47,8 @@ const x = /* @__PURE__ */ i.forwardRef(({ className: a, children: e, ...s }, c)
     }
   )
 ] }));
-x.displayName = o.Content.displayName;
-const v = ({
+v.displayName = o.Content.displayName;
+const x = ({
   className: a,
   ...e
 }) => /* @__PURE__ */ t(
@@ -61,7 +61,7 @@ const v = ({
     ...e
   }
 );
-v.displayName = "DialogHeader";
+x.displayName = "DialogHeader";
 const y = ({
   className: a,
   ...e
@@ -97,9 +97,9 @@ export {
   C as Dialog,
   y as DialogBody,
   R as DialogClose,
-  x as DialogContent,
+  v as DialogContent,
   g as DialogFooter,
-  v as DialogHeader,
+  x as DialogHeader,
   d as DialogOverlay,
   f as DialogPortal,
   b as DialogTitle,

package/dist/es/components/fundamental/drawer.js

@@ -26,7 +26,7 @@ const p = /* @__PURE__ */ l.forwardRef(({ className: r, children: e, ...t }, d)
     {
       ref: d,
       className: s(
-        "fixed bottom-0 left-0 right-0 z-50 w-full max-w-none flex h-auto flex-col rounded-t-lg border-t border-[var(--color-border-primary-subtle)] bg-[var(--color-surface-primary)] shadow-xl",
+        "fixed bottom-0 left-0 right-0 z-50 w-full max-w-none flex h-auto flex-col rounded-t-lg border-t border-[var(--color-border-primary-subtle)] bg-[var(--color-surface-primary)] shadow-[var(--shadow-500)]",
         r
       ),
       style: {