@rafal.lemieszewski/tide-ui 0.83.0 → 0.84.2

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

@@ -0,0 +1,142 @@
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import * as t from "react";
+import { Slot as x } from "@radix-ui/react-slot";
+import { ChevronDown as h, Check as y, ArrowRight as N } from "lucide-react";
+import { cn as s } from "../../lib/utils.js";
+import { Popover as g, PopoverTrigger as B, PopoverContent as w } from "./popover.js";
+import { Command as C, CommandInput as P, CommandList as R, CommandEmpty as k, CommandGroup as S, CommandItem as L } from "./command.js";
+const z = t.forwardRef(({ ...r }, a) => /* @__PURE__ */ e("nav", { ref: a, "aria-label": "breadcrumb", ...r }));
+z.displayName = "Breadcrumb";
+const I = t.forwardRef(({ className: r, ...a }, o) => /* @__PURE__ */ e(
+  "ol",
+  {
+    ref: o,
+    className: s(
+      "[&]:text-body-md flex  flex-wrap items-center gap-[var(--space-s)] text-[var(--color-text-secondary)]",
+      r
+    ),
+    ...a
+  }
+));
+I.displayName = "BreadcrumbList";
+const j = t.forwardRef(({ className: r, ...a }, o) => /* @__PURE__ */ e(
+  "li",
+  {
+    ref: o,
+    className: s("inline-flex items-center gap-[var(--space-s)]", r),
+    ...a
+  }
+));
+j.displayName = "BreadcrumbItem";
+const O = t.forwardRef(({ asChild: r, className: a, ...o }, c) => /* @__PURE__ */ e(
+  r ? x : "a",
+  {
+    ref: c,
+    className: s(
+      "rounded-xs cursor-pointer underline-offset-2 transition-colors hover:text-[var(--color-text-primary)] hover:underline focus:ring-2 focus:ring-[var(--color-border-focused)] focus:ring-offset-2 focus:outline-none",
+      a
+    ),
+    ...o
+  }
+));
+O.displayName = "BreadcrumbLink";
+const A = t.forwardRef(({ className: r, ...a }, o) => /* @__PURE__ */ e(
+  "span",
+  {
+    ref: o,
+    role: "link",
+    "aria-disabled": "true",
+    "aria-current": "page",
+    className: s(
+      "!text-body-medium-md text-[var(--color-text-primary)]",
+      r
+    ),
+    ...a
+  }
+));
+A.displayName = "BreadcrumbPage";
+const D = t.forwardRef(
+  ({
+    children: r,
+    className: a,
+    siblings: o,
+    value: c,
+    onSelect: m,
+    searchPlaceholder: d = "Search...",
+    emptyMessage: u = "No items found.",
+    ...p
+  }, f) => {
+    const [v, l] = t.useState(!1);
+    return /* @__PURE__ */ i(g, { open: v, onOpenChange: l, children: [
+      /* @__PURE__ */ e(B, { asChild: !0, children: /* @__PURE__ */ i(
+        "button",
+        {
+          ref: f,
+          "aria-current": "page",
+          className: s(
+            "!text-body-medium-md inline-flex cursor-pointer items-center gap-[var(--space-xs)] text-[var(--color-text-primary)] underline-offset-2 transition-colors hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-border-focused)] focus-visible:ring-offset-2",
+            a
+          ),
+          ...p,
+          children: [
+            r,
+            /* @__PURE__ */ e(h, { className: "h-[var(--size-3xs)] w-[var(--size-3xs)] shrink-0 text-[var(--color-icon-tertiary)]" })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ e(w, { align: "start", className: "min-w-[16rem] p-0", children: /* @__PURE__ */ i(C, { children: [
+        /* @__PURE__ */ e(P, { placeholder: d }),
+        /* @__PURE__ */ i(R, { children: [
+          /* @__PURE__ */ e(k, { children: u }),
+          /* @__PURE__ */ e(S, { children: o.map((n) => /* @__PURE__ */ i(
+            L,
+            {
+              value: n.value,
+              onSelect: (b) => {
+                m(b), l(!1);
+              },
+              children: [
+                n.label,
+                /* @__PURE__ */ e(
+                  y,
+                  {
+                    className: s(
+                      "ml-auto h-4 w-4 text-[var(--color-icon-brand-bold)]",
+                      c === n.value ? "opacity-100" : "opacity-0"
+                    )
+                  }
+                )
+              ]
+            },
+            n.value
+          )) })
+        ] })
+      ] }) })
+    ] });
+  }
+);
+D.displayName = "BreadcrumbPagePicker";
+const E = ({
+  children: r,
+  className: a,
+  ...o
+}) => /* @__PURE__ */ e(
+  "li",
+  {
+    role: "presentation",
+    "aria-hidden": "true",
+    className: s("text-[var(--color-text-tertiary)]", a),
+    ...o,
+    children: r ?? /* @__PURE__ */ e(N, { className: "h-[var(--size-3xs)] w-[var(--size-3xs)]" })
+  }
+);
+E.displayName = "BreadcrumbSeparator";
+export {
+  z as Breadcrumb,
+  j as BreadcrumbItem,
+  O as BreadcrumbLink,
+  I as BreadcrumbList,
+  A as BreadcrumbPage,
+  D as BreadcrumbPagePicker,
+  E as BreadcrumbSeparator
+};

package/dist/es/components/fundamental/button-group.js

@@ -0,0 +1,86 @@
+import { jsx as d } from "react/jsx-runtime";
+import * as t from "react";
+import { cva as m } from "class-variance-authority";
+import { cn as i } from "../../lib/utils.js";
+import { Separator as v } from "./separator.js";
+const f = m(
+  "flex w-fit items-stretch has-[>[data-slot=button-group]]:gap-[var(--space-xs)] [&>*]:focus-visible:relative [&>*]:focus-visible:z-10",
+  {
+    variants: {
+      orientation: {
+        horizontal: "[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none",
+        vertical: "flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none"
+      }
+    },
+    defaultVariants: {
+      orientation: "horizontal"
+    }
+  }
+), b = t.forwardRef(
+  ({ className: o, orientation: e, size: r, variant: a, children: l, ...u }, p) => {
+    const c = t.Children.map(l, (s) => {
+      if (t.isValidElement(s)) {
+        const n = s.props;
+        return n?.["data-slot"] && n["data-slot"] !== "button" ? s : t.cloneElement(s, {
+          size: n.size || r,
+          variant: n.variant || a
+        });
+      }
+      return s;
+    });
+    return /* @__PURE__ */ d(
+      "div",
+      {
+        ref: p,
+        role: "group",
+        "data-slot": "button-group",
+        "data-orientation": e,
+        className: i(f({ orientation: e }), o),
+        ...u,
+        children: c
+      }
+    );
+  }
+);
+b.displayName = "ButtonGroup";
+const x = t.forwardRef(
+  ({ className: o, asChild: e = !1, children: r, ...a }, l) => e && t.isValidElement(r) ? t.cloneElement(r, {
+    className: i(
+      "bg-[var(--color-background-neutral-subtlest)] shadow-xs flex items-center gap-[var(--space-xs)] rounded-m border border-[var(--color-border-primary-subtle)] px-[var(--space-l)] [&]:text-body-sm font-medium [&_svg:not([class*='size-'])]:size-[var(--size-s)] [&_svg]:pointer-events-none",
+      r.props.className,
+      o
+    )
+  }) : /* @__PURE__ */ d(
+    "div",
+    {
+      ref: l,
+      className: i(
+        "bg-[var(--color-background-neutral-subtlest)] shadow-xs flex items-center gap-[var(--space-xs)] rounded-m border border-[var(--color-border-primary-subtle)] px-[var(--space-l)] [&]:text-body-sm font-medium [&_svg:not([class*='size-'])]:size-[var(--size-s)] [&_svg]:pointer-events-none",
+        o
+      ),
+      ...a,
+      children: r
+    }
+  )
+);
+x.displayName = "ButtonGroupText";
+const g = t.forwardRef(({ className: o, orientation: e = "vertical", ...r }, a) => /* @__PURE__ */ d(
+  v,
+  {
+    ref: a,
+    "data-slot": "button-group-separator",
+    orientation: e,
+    className: i(
+      "bg-[var(--color-border-input)] relative !m-0 self-stretch data-[orientation=vertical]:h-auto",
+      o
+    ),
+    ...r
+  }
+));
+g.displayName = "ButtonGroupSeparator";
+export {
+  b as ButtonGroup,
+  g as ButtonGroupSeparator,
+  x as ButtonGroupText,
+  f as buttonGroupVariants
+};

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

@@ -0,0 +1,186 @@
+import { jsxs as P, jsx as c } from "react/jsx-runtime";
+import N from "react";
+import { cva as j } from "class-variance-authority";
+import { cn as I } from "../../lib/utils.js";
+import { Icon as d } from "./icon.js";
+const V = j(
+  "inline-flex items-center justify-center relative transition-all duration-150 ease-in-out focus:outline-none cursor-pointer select-none disabled:cursor-not-allowed gap-[var(--space-xs)] whitespace-nowrap",
+  {
+    variants: {
+      variant: {
+        default: [
+          "bg-[var(--color-background-neutral-subtlest)] text-[var(--color-text-primary)]",
+          "border border-[var(--color-border-action-outline)]",
+          "enabled:hover:bg-[var(--color-background-neutral-subtlest-hovered)] enabled:hover:border-[var(--color-border-action-outline-hovered)] enabled:hover:shadow-sm",
+          "focus-visible:ring-2 focus-visible:ring-[var(--ring-color)] focus-visible:ring-offset-2",
+          "enabled:active:bg-[var(--grey-alpha-50)] enabled:active:translate-y-px enabled:active:shadow-xs",
+          "disabled:bg-[var(--color-background-disabled)] disabled:[&]:text-[var(--color-text-disabled)] disabled:border-[var(--color-border-action-outline)]"
+        ],
+        secondary: [
+          "bg-[var(--color-background-neutral-subtlest)] text-[var(--color-text-primary)]",
+          "border border-[var(--color-border-action-outline)]",
+          "enabled:hover:bg-[var(--color-background-neutral-subtlest-hovered)] enabled:hover:border-[var(--color-border-action-outline-hovered)] enabled:hover:shadow-sm",
+          "focus-visible:ring-2 focus-visible:ring-[var(--ring-color)] focus-visible:ring-offset-2",
+          "enabled:active:bg-[var(--grey-alpha-50)] enabled:active:translate-y-px enabled:active:shadow-xs",
+          "disabled:bg-[var(--color-background-disabled)] disabled:[&]:text-[var(--color-text-disabled)] disabled:border-[var(--color-border-action-outline)]"
+        ],
+        primary: [
+          "bg-[var(--color-background-blue-bold)] [&]:text-[var(--color-text-on-action)]",
+          "border-none",
+          "enabled:hover:bg-[var(--color-background-blue-bold-hovered)] enabled:hover:shadow-sm",
+          "focus-visible:ring-2 focus-visible:ring-[var(--ring-color)] focus-visible:ring-offset-2",
+          "enabled:active:bg-[var(--blue-700)] enabled:active:translate-y-px enabled:active:shadow-xs",
+          "disabled:bg-[var(--color-background-disabled)] disabled:[&]:text-[var(--color-text-disabled)]"
+        ],
+        destructive: [
+          "bg-[var(--color-background-error-bold)] [&]:text-[var(--color-text-on-action)]",
+          "border-none",
+          "enabled:hover:bg-[var(--color-background-error-bold-hovered)] enabled:hover:shadow-sm",
+          "focus-visible:ring-2 focus-visible:ring-[var(--ring-color)] focus-visible:ring-offset-2",
+          "enabled:active:bg-[var(--red-700)] enabled:active:translate-y-px enabled:active:shadow-xs",
+          "disabled:bg-[var(--color-background-disabled)] disabled:[&]:text-[var(--color-text-disabled)]"
+        ],
+        success: [
+          "bg-[var(--color-background-success-bold)] [&]:text-[var(--color-text-on-action)]",
+          "border-none",
+          "enabled:hover:bg-[var(--color-background-success-bold-hovered)] enabled:hover:shadow-sm",
+          "focus-visible:ring-2 focus-visible:ring-[var(--ring-color)] focus-visible:ring-offset-2",
+          "enabled:active:bg-[var(--green-700)] enabled:active:translate-y-px enabled:active:shadow-xs",
+          "disabled:bg-[var(--color-background-disabled)] disabled:[&]:text-[var(--color-text-disabled)]"
+        ],
+        ghost: [
+          "bg-transparent text-[var(--color-text-primary)]",
+          "border-none",
+          "enabled:hover:bg-[var(--color-background-neutral-hovered)]",
+          "focus-visible:ring-2 focus-visible:ring-[var(--ring-color)] focus-visible:ring-offset-2",
+          "enabled:active:bg-[var(--grey-alpha-100)] enabled:active:translate-y-px",
+          "disabled:bg-[var(--color-background-neutral-subtlest)] disabled:[&]:text-[var(--color-text-disabled)]"
+        ]
+      },
+      size: {
+        s: [
+          "text-label-sm h-[var(--size-s)] rounded-s px-[var(--space-m)]"
+        ],
+        m: [
+          "text-label-md h-[var(--size-m)] rounded-s px-[var(--space-m)]"
+        ],
+        l: [
+          "text-label-md h-[var(--size-l)] rounded-s px-[var(--space-l)]"
+        ]
+      },
+      iconPosition: {
+        none: "",
+        left: "",
+        right: "",
+        only: ""
+      }
+    },
+    compoundVariants: [
+      // Icon padding adjustments for different sizes
+      {
+        size: "s",
+        iconPosition: "left",
+        className: "pl-[var(--space-s)] pr-[var(--space-m)]"
+      },
+      {
+        size: "s",
+        iconPosition: "right",
+        className: "pl-[var(--space-m)] pr-[var(--space-s)]"
+      },
+      {
+        size: "s",
+        iconPosition: "only",
+        className: "px-[var(--space-s)] min-w-[var(--size-s)]"
+      },
+      {
+        size: "m",
+        iconPosition: "left",
+        className: "pl-[var(--space-s)] pr-[var(--space-m)]"
+      },
+      {
+        size: "m",
+        iconPosition: "right",
+        className: "pl-[var(--space-m)] pr-[var(--space-s)]"
+      },
+      {
+        size: "m",
+        iconPosition: "only",
+        className: "px-[var(--space-s)] min-w-[var(--size-m)]"
+      },
+      {
+        size: "l",
+        iconPosition: "left",
+        className: "pl-[var(--space-m)] pr-[var(--space-l)]"
+      },
+      {
+        size: "l",
+        iconPosition: "right",
+        className: "pl-[var(--space-l)] pr-[var(--space-m)]"
+      },
+      {
+        size: "l",
+        iconPosition: "only",
+        className: "px-[var(--space-m)] min-w-[var(--size-l)]"
+      }
+    ],
+    defaultVariants: {
+      variant: "default",
+      size: "m",
+      iconPosition: "none"
+    }
+  }
+), B = N.forwardRef(
+  ({
+    className: u,
+    variant: o,
+    size: b,
+    children: s,
+    icon: a,
+    iconPosition: p,
+    dropdown: i = !1,
+    dropdownOpen: g = !1,
+    disabled: m = !1,
+    loading: e = !1,
+    type: f = "button",
+    ...x
+  }, h) => {
+    const l = b || "m", v = m || e, n = v ? "disabled" : o === "primary" || o === "destructive" || o === "success" ? "inverse" : "primary", y = () => e ? /* @__PURE__ */ c(d, { name: "loader-2", size: l, color: n, className: "animate-spin" }) : null, t = () => e ? y() : a ? /* @__PURE__ */ c(d, { name: a, size: l, color: n }) : null, z = () => i ? /* @__PURE__ */ c(d, { name: "chevron-down", size: l, color: n }) : null, r = a && s ? p : a || e ? "only" : e && s ? "left" : "none", w = i ? {
+      "aria-haspopup": "menu",
+      "aria-expanded": g
+    } : {}, k = e ? {
+      "aria-busy": !0,
+      "aria-disabled": !0
+    } : {};
+    return /* @__PURE__ */ P(
+      "button",
+      {
+        type: f,
+        className: I(
+          V({
+            variant: o,
+            size: b,
+            iconPosition: r,
+            className: u
+          })
+        ),
+        ref: h,
+        disabled: v,
+        ...w,
+        ...k,
+        ...x,
+        children: [
+          r === "left" && t(),
+          r !== "only" && s,
+          r === "right" && t(),
+          r === "only" && t(),
+          i && z()
+        ]
+      }
+    );
+  }
+);
+B.displayName = "Button";
+export {
+  B as Button,
+  V as buttonVariants
+};

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

@@ -0,0 +1,130 @@
+import { jsx as x } from "react/jsx-runtime";
+import * as y from "react";
+import { DayPicker as I } from "react-day-picker";
+import { cn as m } from "../../lib/utils.js";
+import { Icon as P } from "./icon.js";
+function H(i) {
+  const {
+    className: h,
+    classNames: w,
+    showOutsideDays: _ = !0,
+    mode: n,
+    ...k
+  } = i, o = "selected" in i ? i.selected : void 0, s = "onSelect" in i ? i.onSelect : void 0, [r, v] = y.useState(null), [g, b] = y.useState(null), f = (e, t) => e.toDateString() === t.toDateString(), p = (e, t, c) => {
+    const u = e.getTime(), a = t.getTime(), d = c.getTime(), [E, M] = a < d ? [a, d] : [d, a];
+    return u > E && u < M;
+  }, S = (e, t) => {
+    if (!t.disabled && n === "range")
+      if (!r)
+        v(e);
+      else if (f(e, r))
+        s && s({ from: r, to: r }), v(null), b(null);
+      else {
+        const [c, u] = [r, e].sort((a, d) => a.getTime() - d.getTime());
+        s && s({ from: c, to: u }), v(null), b(null);
+      }
+  }, z = (e, t) => {
+    n === "range" && r && !t.disabled && b(e);
+  }, D = () => {
+    n === "range" && b(null);
+  }, R = (e) => !r || !g ? !1 : p(e, r, g), C = (e) => r ? f(e, r) : !1, T = (e) => {
+    if (r || n !== "range" || !o || typeof o > "u") return !1;
+    const t = o;
+    return t.from ? f(e, t.from) : !1;
+  }, N = (e) => {
+    if (r || n !== "range" || !o || typeof o > "u") return !1;
+    const t = o;
+    return t.to ? f(e, t.to) : !1;
+  }, j = (e) => {
+    if (r || n !== "range" || !o || typeof o > "u") return !1;
+    const t = o;
+    return !t.from || !t.to ? !1 : p(e, t.from, t.to);
+  }, l = {
+    showOutsideDays: _,
+    className: m(
+      // relative for nav positioning; padding creates space around entire calendar including buttons
+      "relative",
+      "py-[var(--space-m)] px-[var(--space-s)]",
+      h
+    ),
+    onDayMouseEnter: z,
+    onDayMouseLeave: D,
+    modifiers: {
+      rangeStart: C,
+      rangePreview: R,
+      confirmedRangeStart: T,
+      confirmedRangeEnd: N,
+      inConfirmedRange: j
+    },
+    classNames: {
+      // months: no 'relative' so nav positions to root; horizontal margin creates space for side buttons
+      months: "flex flex-col sm:flex-row sm:gap-[var(--space-l)] mx-[calc(var(--size-m)+var(--space-s))]",
+      month: "space-y-[var(--space-l)]",
+      month_caption: "flex justify-center pt-[var(--space-xs)] relative items-center",
+      caption_label: "text-body-medium-md text-[var(--color-text-primary)]",
+      // nav: fills root, flexbox positions buttons at left/right edges, vertically centered
+      nav: "absolute inset-0 flex justify-between items-center px-[var(--space-s)] pointer-events-none z-10",
+      button_previous: m(
+        "pointer-events-auto",
+        "inline-flex items-center justify-center rounded-m",
+        "w-[var(--size-m)] h-[var(--size-m)] p-0",
+        "bg-[var(--color-background-neutral-subtlest)] text-[var(--color-text-primary)]",
+        "border border-[var(--color-border-action-outline)]",
+        "hover:bg-[var(--color-background-neutral-subtlest-hovered)] hover:border-[var(--color-border-action-outline-hovered)] hover:shadow-sm",
+        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring-color)] focus-visible:ring-offset-2",
+        "disabled:pointer-events-none disabled:opacity-50"
+      ),
+      button_next: m(
+        "pointer-events-auto",
+        "inline-flex items-center justify-center rounded-m",
+        "w-[var(--size-m)] h-[var(--size-m)] p-0",
+        "bg-[var(--color-background-neutral-subtlest)] text-[var(--color-text-primary)]",
+        "border border-[var(--color-border-action-outline)]",
+        "hover:bg-[var(--color-background-neutral-subtlest-hovered)] hover:border-[var(--color-border-action-outline-hovered)] hover:shadow-sm",
+        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring-color)] focus-visible:ring-offset-2",
+        "disabled:pointer-events-none disabled:opacity-50"
+      ),
+      month_grid: "w-full border-collapse space-y-[var(--space-xs)]",
+      weekdays: "flex",
+      weekday: "text-[var(--color-text-tertiary)] rounded-m w-[var(--size-m)] font-normal text-caption-medium-sm",
+      week: "flex w-full mt-[var(--space-s)]",
+      day: "h-[var(--size-m)] w-[var(--size-m)] text-center text-body-sm p-0 relative focus-within:relative focus-within:z-20",
+      day_button: m(
+        "inline-flex items-center justify-center rounded-m",
+        "w-[var(--size-m)] h-[var(--size-m)] p-0",
+        "text-body-sm font-normal text-[var(--color-text-primary)]",
+        "hover:bg-[var(--color-background-neutral-subtlest-hovered)]",
+        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring-color)]",
+        "disabled:pointer-events-none disabled:opacity-50"
+      ),
+      range_start: "day-range-start",
+      range_end: "day-range-end",
+      selected: "!bg-[var(--color-background-blue-bold)] [&_button]:!text-white [&_button]:after:!bg-white rounded-m",
+      today: "[&_button]:relative [&_button]:after:content-[''] [&_button]:after:absolute [&_button]:after:bottom-1 [&_button]:after:left-1/2 [&_button]:after:-translate-x-1/2 [&_button]:after:w-1 [&_button]:after:h-1 [&_button]:after:rounded-full [&_button]:after:bg-red-500 font-medium",
+      outside: "day-outside text-[var(--color-text-tertiary)] opacity-50 aria-selected:bg-[var(--color-background-blue-subtle)] aria-selected:text-[var(--color-text-tertiary)] aria-selected:opacity-30",
+      disabled: "text-[var(--color-text-disabled)] opacity-50",
+      range_middle: "bg-[var(--color-background-blue-subtle)] text-[var(--color-text-primary)]",
+      hidden: "invisible",
+      ...w
+    },
+    modifiersClassNames: {
+      rangeStart: "!bg-[var(--color-background-blue-bold)] [&_button]:!text-white [&_button]:after:!bg-white rounded-l-md",
+      rangePreview: "bg-[var(--color-background-blue-subtle)] [&_button]:text-[var(--color-text-primary)]",
+      confirmedRangeStart: "!bg-[var(--color-background-blue-bold)] [&_button]:!text-white [&_button]:after:!bg-white rounded-l-md",
+      confirmedRangeEnd: "!bg-[var(--color-background-blue-bold)] [&_button]:!text-white [&_button]:after:!bg-white rounded-r-md",
+      inConfirmedRange: "bg-[var(--color-background-blue-subtle)] [&_button]:text-[var(--color-text-primary)]"
+    },
+    components: {
+      Chevron: ({ orientation: e, ...t }) => {
+        const c = e === "left" ? "chevron-left" : "chevron-right", { size: u, ...a } = t;
+        return /* @__PURE__ */ x(P, { name: c, size: "s", ...a });
+      }
+    },
+    ...k
+  };
+  return n === "range" ? l.onDayClick = S : (l.mode = n, l.selected = o, l.onSelect = s), /* @__PURE__ */ x(I, { ...l });
+}
+H.displayName = "Calendar";
+export {
+  H as Calendar
+};

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

@@ -0,0 +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 = t.forwardRef(({ className: a, ...r }, 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
+    ),
+    ...r
+  }
+));
+s.displayName = "Card";
+const c = t.forwardRef(({ className: a, ...r }, e) => /* @__PURE__ */ o(
+  "div",
+  {
+    ref: e,
+    className: d("flex flex-col space-y-[var(--space-s)] p-[var(--space-l)]", a),
+    ...r
+  }
+));
+c.displayName = "CardHeader";
+const l = t.forwardRef(({ className: a, ...r }, e) => /* @__PURE__ */ o(
+  "h3",
+  {
+    ref: e,
+    className: d("text-heading-md leading-none tracking-tight", a),
+    ...r
+  }
+));
+l.displayName = "CardTitle";
+const i = t.forwardRef(({ className: a, ...r }, e) => /* @__PURE__ */ o(
+  "p",
+  {
+    ref: e,
+    className: d("text-body-sm text-[var(--color-text-secondary)]", a),
+    ...r
+  }
+));
+i.displayName = "CardDescription";
+const p = t.forwardRef(({ className: a, ...r }, e) => /* @__PURE__ */ o(
+  "div",
+  {
+    ref: e,
+    className: d("p-[var(--space-l)] pt-0", a),
+    ...r
+  }
+));
+p.displayName = "CardContent";
+const m = t.forwardRef(({ className: a, ...r }, e) => /* @__PURE__ */ o(
+  "div",
+  {
+    ref: e,
+    className: d("flex items-center p-[var(--space-l)] pt-0", a),
+    ...r
+  }
+));
+m.displayName = "CardFooter";
+export {
+  s as Card,
+  p as CardContent,
+  i as CardDescription,
+  m as CardFooter,
+  c as CardHeader,
+  l as CardTitle
+};