impact-nova 2.0.8 → 2.1.0-alpha.1

package/dist/components/forms/switch/switch.types.d.ts

@@ -0,0 +1,11 @@
+import { VariantProps } from 'class-variance-authority';
+import { FieldControlProps } from '../../../lib/primitives/field.types';
+import { switchRootVariants } from './switch.variants';
+import type * as React from "react";
+import type * as SwitchPrimitives from "@radix-ui/react-switch";
+export type SwitchProps = React.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root> & VariantProps<typeof switchRootVariants> & FieldControlProps & {
+    /** @deprecated Use `disabled` */
+    isDisabled?: boolean;
+    /** @deprecated Use `error` */
+    isError?: boolean;
+};

package/dist/components/forms/switch/switch.variants.d.ts

@@ -0,0 +1,6 @@
+export declare const switchRootVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | "default" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export declare const switchThumbVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | "default" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/components/forms/switch/switch.variants.js

@@ -0,0 +1,36 @@
+import { cva as t } from "class-variance-authority";
+const e = t(
+  "peer inline-flex shrink-0 cursor-pointer items-center rounded-full border transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring focus-visible:ring-offset-2 focus-visible:ring-offset-canvas disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-brand-tint data-[state=checked]:border-canvas-accordion data-[state=unchecked]:bg-canvas-elevated data-[state=unchecked]:border-canvas-tint",
+  {
+    variants: {
+      size: {
+        default: "h-[16px] w-[24px]",
+        sm: "h-[14px] w-[20px]",
+        md: "h-[16px] w-[24px]",
+        lg: "h-[20px] w-[32px]"
+      }
+    },
+    defaultVariants: {
+      size: "default"
+    }
+  }
+), s = t(
+  "pointer-events-none block rounded-full shadow-lg ring-0 transition-transform data-[state=checked]:bg-brand data-[state=unchecked]:bg-stroke-field",
+  {
+    variants: {
+      size: {
+        default: "h-[10px] w-[10px] data-[state=checked]:translate-x-[10px] data-[state=unchecked]:translate-x-[2px]",
+        sm: "h-[8px] w-[8px] data-[state=checked]:translate-x-[8px] data-[state=unchecked]:translate-x-[2px]",
+        md: "h-[10px] w-[10px] data-[state=checked]:translate-x-[10px] data-[state=unchecked]:translate-x-[2px]",
+        lg: "h-[14px] w-[14px] data-[state=checked]:translate-x-[14px] data-[state=unchecked]:translate-x-[2px]"
+      }
+    },
+    defaultVariants: {
+      size: "default"
+    }
+  }
+);
+export {
+  e as switchRootVariants,
+  s as switchThumbVariants
+};

package/dist/components/forms/textarea/index.d.ts

@@ -0,0 +1,3 @@
+export { Textarea } from './textarea';
+export type { TextareaProps } from './textarea.types';
+export { textareaVariants } from './textarea.variants';

package/dist/components/forms/textarea/index.js

@@ -0,0 +1,6 @@
+import { Textarea as e } from "./textarea.js";
+import { textareaVariants as o } from "./textarea.variants.js";
+export {
+  e as Textarea,
+  o as textareaVariants
+};

package/dist/components/forms/textarea/textarea.d.ts

@@ -0,0 +1,5 @@
+import { TextareaProps } from './textarea.types';
+import * as React from "react";
+declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
+export { Textarea };
+export type { TextareaProps } from './textarea.types';

package/dist/components/forms/textarea/textarea.js

@@ -0,0 +1,98 @@
+import { jsx as r, jsxs as v } from "react/jsx-runtime";
+import * as U from "react";
+import { createComponent as k } from "../../../lib/primitives/create-component.js";
+import { useFieldChrome as z } from "../../../lib/primitives/use-field-chrome.js";
+import { cn as x } from "../../../lib/utils.js";
+import { textareaVariants as G } from "./textarea.variants.js";
+const V = k(
+  "Textarea",
+  ({
+    className: g,
+    label: s,
+    helperText: a,
+    helperTextPosition: n = "absolute",
+    labelOrientation: u,
+    characterLimit: i,
+    required: b,
+    isRequired: p,
+    error: C,
+    isError: h,
+    size: N,
+    disabled: w,
+    isDisabled: j,
+    value: d,
+    onChange: y,
+    defaultValue: l,
+    id: B,
+    ...S
+  }, q) => {
+    const A = b ?? p, e = C ?? h, o = w ?? j, R = !!(s || a || e), c = d !== void 0, [D, E] = U.useState(
+      () => String(l ?? "").length
+    ), F = c ? String(d ?? "").length : D, I = (f) => {
+      c || E(f.target.value.length), y?.(f);
+    }, t = z({
+      label: s,
+      helperText: a,
+      helperTextPosition: n,
+      labelOrientation: u,
+      error: e,
+      required: A,
+      disabled: o,
+      id: B,
+      footer: a && n === "flow" || i ? /* @__PURE__ */ v("div", { className: "flex items-center justify-between gap-[6px]", children: [
+        /* @__PURE__ */ r("div", { className: "flex min-w-0 flex-1" }),
+        i ? /* @__PURE__ */ v(
+          "div",
+          {
+            className: "text-[12px] font-medium leading-[18px] text-navigation-muted text-right",
+            "data-component": "character-count-indicator",
+            children: [
+              F,
+              "/",
+              i
+            ]
+          }
+        ) : null
+      ] }) : void 0,
+      rootClassName: "min-w-[240px]"
+    }), m = /* @__PURE__ */ r(
+      "div",
+      {
+        className: x(
+          a && n === "absolute" && "relative"
+        ),
+        children: /* @__PURE__ */ r(
+          "textarea",
+          {
+            className: x(
+              G({
+                error: !!e,
+                size: N,
+                disabled: !!o,
+                className: g
+              }),
+              "bg-canvas",
+              o && "bg-disabled-surface"
+            ),
+            ref: q,
+            disabled: !!o,
+            value: d,
+            defaultValue: l,
+            onChange: I,
+            id: t.controlId,
+            "data-component": "textarea",
+            "data-invalid": e || void 0,
+            "data-disabled": o || void 0,
+            "aria-invalid": t.controlAria["aria-invalid"],
+            "aria-describedby": t.controlAria["aria-describedby"],
+            ...S
+          }
+        )
+      }
+    );
+    return /* @__PURE__ */ r("div", { className: "flex w-full flex-col gap-[6px]", children: R ? t.wrapControl(m) : m });
+  }
+);
+export {
+  V as Textarea
+};

package/dist/components/forms/textarea/textarea.types.d.ts

@@ -0,0 +1,16 @@
+import { FieldControlProps } from '../../../lib/primitives/field.types';
+import type * as React from "react";
+export interface TextareaProps extends FieldControlProps {
+    className?: string;
+    value?: string;
+    onChange?: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
+    characterLimit?: number;
+    /** @deprecated Use `required` */
+    isRequired?: boolean;
+    /** @deprecated Use `error` */
+    isError?: boolean;
+    /** @deprecated Use `disabled` */
+    isDisabled?: boolean;
+    defaultValue?: string;
+    placeholder?: string;
+}

package/dist/components/forms/textarea/textarea.variants.d.ts

@@ -0,0 +1,5 @@
+export declare const textareaVariants: (props?: ({
+    error?: boolean | null | undefined;
+    size?: "sm" | "md" | "lg" | "default" | null | undefined;
+    disabled?: boolean | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/components/forms/textarea/textarea.variants.js

@@ -0,0 +1,29 @@
+import { cva as e } from "class-variance-authority";
+const d = e(
+  "flex w-full rounded-md border border-field bg-transparent px-3 py-2 text-sm font-medium shadow-sm transition-colors placeholder:font-medium placeholder:text-content-empty focus-visible:outline-none focus-visible:border-brand hover:border-brand disabled:cursor-not-allowed disabled:bg-disabled-surface disabled:text-disabled-foreground disabled:border-stroke",
+  {
+    variants: {
+      error: {
+        true: "border-destructive hover:border-destructive",
+        false: ""
+      },
+      size: {
+        default: "min-h-20",
+        sm: "min-h-14",
+        md: "min-h-[72px]",
+        lg: "min-h-32"
+      },
+      disabled: {
+        true: "cursor-not-allowed opacity-100 bg-disabled-surface border-stroke text-disabled-foreground placeholder:text-disabled-foreground hover:border-stroke",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      size: "default",
+      error: !1
+    }
+  }
+);
+export {
+  d as textareaVariants
+};

package/dist/components/layout/breadcrumb/breadcrumb.d.ts

@@ -0,0 +1,31 @@
+import { BreadcrumbHomeLinkProps } from './breadcrumb.types';
+import * as React from "react";
+declare const HomeIcon: ({ className }: {
+    className?: string;
+}) => import("react/jsx-runtime").JSX.Element;
+declare const Breadcrumb: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & {
+    separator?: React.ReactNode;
+} & React.RefAttributes<HTMLElement>>;
+declare const BreadcrumbList: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, "ref"> & {
+    maxWords?: number;
+} & React.RefAttributes<HTMLOListElement>>;
+declare const BreadcrumbItem: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React.RefAttributes<HTMLLIElement>>;
+declare const BreadcrumbLink: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+    asChild?: boolean;
+    maxWords?: number;
+} & React.RefAttributes<HTMLAnchorElement>>;
+declare const BreadcrumbHomeLink: React.ForwardRefExoticComponent<BreadcrumbHomeLinkProps & React.RefAttributes<HTMLAnchorElement>>;
+declare const BreadcrumbPage: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+    maxWords?: number;
+} & React.RefAttributes<HTMLSpanElement>>;
+declare const BreadcrumbSeparator: {
+    ({ children, className, ...props }: React.ComponentProps<"li">): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const BreadcrumbEllipsis: {
+    ({ className, ...props }: React.ComponentProps<"span">): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const BreadcrumbHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const BreadcrumbArrowSeparator: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React.RefAttributes<HTMLLIElement>>;
+export { Breadcrumb, BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbHomeLink, BreadcrumbPage, BreadcrumbSeparator, BreadcrumbEllipsis, BreadcrumbHeader, HomeIcon, BreadcrumbArrowSeparator, };

package/dist/components/layout/breadcrumb/breadcrumb.js

@@ -0,0 +1,200 @@
+import { jsx as a, jsxs as f } from "react/jsx-runtime";
+import * as n from "react";
+import { Slot as v } from "@radix-ui/react-slot";
+import { ThreeDots as H } from "impact-nova-icons";
+import { ClickMeArrow as L } from "../../ui/local-raster-icons/rasterIcons.js";
+import { Tooltip as C, TooltipTrigger as w, TooltipContent as g } from "../../feedback/tooltip/tooltip.js";
+import { cn as s } from "../../../lib/utils.js";
+import { useImpactNovaI18n as h } from "../../../i18n/use-impact-nova-i18n.js";
+const b = n.createContext({}), B = (e, t) => {
+  const r = e.split(/\s+/);
+  return r.length <= t ? e : r.slice(0, t).join(" ") + "...";
+}, R = ({ className: e }) => /* @__PURE__ */ a(
+  "svg",
+  {
+    width: "13",
+    height: "16",
+    viewBox: "0 0 12 13",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "aria-hidden": "true",
+    focusable: "false",
+    className: s("h-3.5 w-3.5", e),
+    children: /* @__PURE__ */ a(
+      "path",
+      {
+        d: "M2.0013 11.1654H4.0013V7.83203C4.0013 7.64314 4.06519 7.48481 4.19297 7.35703C4.32075 7.22925 4.47908 7.16536 4.66797 7.16536H7.33464C7.52352 7.16536 7.68186 7.22925 7.80964 7.35703C7.93741 7.48481 8.0013 7.64314 8.0013 7.83203V11.1654H10.0013V5.16536L6.0013 2.16536L2.0013 5.16536V11.1654ZM0.667969 11.1654V5.16536C0.667969 4.95425 0.715191 4.75425 0.809635 4.56536C0.90408 4.37648 1.03464 4.22092 1.2013 4.0987L5.2013 1.0987C5.43464 0.92092 5.7013 0.832031 6.0013 0.832031C6.3013 0.832031 6.56797 0.92092 6.8013 1.0987L10.8013 4.0987C10.968 4.22092 11.0985 4.37648 11.193 4.56536C11.2874 4.75425 11.3346 4.95425 11.3346 5.16536V11.1654C11.3346 11.532 11.2041 11.8459 10.943 12.107C10.6819 12.3681 10.368 12.4987 10.0013 12.4987H7.33464C7.14575 12.4987 6.98741 12.4348 6.85964 12.307C6.73186 12.1793 6.66797 12.0209 6.66797 11.832V8.4987H5.33464V11.832C5.33464 12.0209 5.27075 12.1793 5.14297 12.307C5.01519 12.4348 4.85686 12.4987 4.66797 12.4987H2.0013C1.63464 12.4987 1.32075 12.3681 1.05964 12.107C0.798524 11.8459 0.667969 11.532 0.667969 11.1654Z",
+        fill: "currentColor"
+      }
+    )
+  }
+), W = n.forwardRef(({ "aria-label": e, ...t }, r) => {
+  const { t: o } = h();
+  return /* @__PURE__ */ a(
+    "nav",
+    {
+      ref: r,
+      "aria-label": e ?? o("aria.breadcrumb"),
+      "data-component": "breadcrumb",
+      ...t
+    }
+  );
+});
+W.displayName = "Breadcrumb";
+const V = n.forwardRef(({ className: e, maxWords: t, ...r }, o) => /* @__PURE__ */ a(b.Provider, { value: { maxWords: t }, children: /* @__PURE__ */ a(
+  "ol",
+  {
+    ref: o,
+    className: s(
+      "flex flex-wrap items-center text-[14px] font-medium text-secondary-foreground",
+      e
+    ),
+    ...r
+  }
+) }));
+V.displayName = "BreadcrumbList";
+const S = n.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ a(
+  "li",
+  {
+    ref: r,
+    className: s("inline-flex items-center gap-1.5", e),
+    ...t
+  }
+));
+S.displayName = "BreadcrumbItem";
+const N = n.forwardRef(
+  ({ asChild: e, className: t, maxWords: r, children: o, ...u }, p) => {
+    const i = e ? v : "a", { maxWords: d } = n.useContext(b), c = r ?? d, l = typeof o == "string", m = l && c ? B(o, c) : o, y = l && c && o.split(/\s+/).length > c, x = /* @__PURE__ */ a(
+      i,
+      {
+        ref: p,
+        className: s(
+          "transition-colors text-brand hover:text-brand-strong font-medium",
+          t
+        ),
+        ...u,
+        children: m
+      }
+    );
+    return y ? /* @__PURE__ */ f(C, { children: [
+      /* @__PURE__ */ a(w, { asChild: !0, children: x }),
+      /* @__PURE__ */ a(g, { side: "top", variant: "tertiary", children: o })
+    ] }) : x;
+  }
+);
+N.displayName = "BreadcrumbLink";
+const T = n.forwardRef(({ ...e }, t) => {
+  const { t: r } = h();
+  return /* @__PURE__ */ a(N, { ref: t, "aria-label": r("aria.home"), ...e, children: /* @__PURE__ */ a(R, {}) });
+});
+T.displayName = "BreadcrumbHomeLink";
+const k = n.forwardRef(({ className: e, maxWords: t, children: r, ...o }, u) => {
+  const { maxWords: p } = n.useContext(b), i = t ?? p, d = typeof r == "string", c = d && i ? B(r, i) : r, l = d && i && r.split(/\s+/).length > i, m = /* @__PURE__ */ a(
+    "span",
+    {
+      ref: u,
+      role: "link",
+      "aria-disabled": "true",
+      "aria-current": "page",
+      "data-current": "page",
+      className: s("font-extrabold text-content", e),
+      ...o,
+      children: c
+    }
+  );
+  return l ? /* @__PURE__ */ f(C, { children: [
+    /* @__PURE__ */ a(w, { asChild: !0, children: m }),
+    /* @__PURE__ */ a(g, { side: "top", variant: "tertiary", children: r })
+  ] }) : m;
+});
+k.displayName = "BreadcrumbPage";
+const M = ({
+  children: e,
+  className: t,
+  ...r
+}) => /* @__PURE__ */ a(
+  "li",
+  {
+    role: "presentation",
+    "aria-hidden": "true",
+    className: s(
+      "[&>svg]:w-3.5 [&>svg]:h-3.5 text-secondary-foreground",
+      t
+    ),
+    ...r,
+    children: e ?? /* @__PURE__ */ a(
+      "svg",
+      {
+        width: "16",
+        height: "16",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        className: "h-4 w-4",
+        children: /* @__PURE__ */ a(
+          "path",
+          {
+            d: "M8.59 16.59 13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z",
+            fill: "currentColor"
+          }
+        )
+      }
+    )
+  }
+);
+M.displayName = "BreadcrumbSeparator";
+const j = ({
+  className: e,
+  ...t
+}) => {
+  const { t: r } = h(), o = r("aria.more");
+  return /* @__PURE__ */ f(
+    "span",
+    {
+      role: "presentation",
+      "aria-hidden": "true",
+      className: s("flex h-9 w-9 items-center justify-center", e),
+      ...t,
+      children: [
+        /* @__PURE__ */ a(H, { className: "h-4 w-4" }),
+        /* @__PURE__ */ a("span", { className: "sr-only", children: o })
+      ]
+    }
+  );
+};
+j.displayName = "BreadcrumbElipssis";
+const I = n.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ a(
+  "div",
+  {
+    ref: r,
+    className: s("flex h-14 items-center justify-between px-6", e),
+    ...t
+  }
+));
+I.displayName = "BreadcrumbHeader";
+const A = n.forwardRef(({ className: e, style: t, ...r }, o) => /* @__PURE__ */ a(
+  "li",
+  {
+    ref: o,
+    role: "presentation",
+    "aria-hidden": "true",
+    className: s("inline-flex items-center", e),
+    style: t,
+    ...r,
+    children: /* @__PURE__ */ a(L, { size: 12 })
+  }
+));
+A.displayName = "BreadcrumbArrowSeparator";
+export {
+  W as Breadcrumb,
+  A as BreadcrumbArrowSeparator,
+  j as BreadcrumbEllipsis,
+  I as BreadcrumbHeader,
+  T as BreadcrumbHomeLink,
+  S as BreadcrumbItem,
+  N as BreadcrumbLink,
+  V as BreadcrumbList,
+  k as BreadcrumbPage,
+  M as BreadcrumbSeparator,
+  R as HomeIcon
+};

package/dist/components/layout/breadcrumb/breadcrumb.types.d.ts

@@ -0,0 +1,15 @@
+import type * as React from "react";
+export type BreadcrumbProps = React.ComponentPropsWithoutRef<"nav"> & {
+    separator?: React.ReactNode;
+};
+export type BreadcrumbListProps = React.ComponentPropsWithoutRef<"ol"> & {
+    maxWords?: number;
+};
+export type BreadcrumbLinkProps = React.ComponentPropsWithoutRef<"a"> & {
+    asChild?: boolean;
+    maxWords?: number;
+};
+export type BreadcrumbHomeLinkProps = Omit<BreadcrumbLinkProps, "children">;
+export type BreadcrumbPageProps = React.ComponentPropsWithoutRef<"span"> & {
+    maxWords?: number;
+};

package/dist/components/layout/dynamic-layout/dynamic-layout.d.ts

@@ -0,0 +1,6 @@
+import { DynamicLayoutProps } from './dynamic-layout.types';
+import * as React from "react";
+declare const DynamicLayout: React.ForwardRefExoticComponent<DynamicLayoutProps & React.RefAttributes<HTMLDivElement>>;
+/** @deprecated Use `GridLayout`. `DynamicLayout` is not the app shell — see `Layout` from `impact-nova/layout`. */
+declare const GridLayout: React.ForwardRefExoticComponent<DynamicLayoutProps & React.RefAttributes<HTMLDivElement>>;
+export { DynamicLayout, GridLayout };

package/dist/components/layout/dynamic-layout/dynamic-layout.js

@@ -0,0 +1,28 @@
+import { jsx as c } from "react/jsx-runtime";
+import * as y from "react";
+import { cn as e } from "../../../lib/utils.js";
+import { dynamicLayoutVariants as s } from "./dynamic-layout.variants.js";
+const m = y.forwardRef(
+  ({ className: r, layout: a, columns: o, gap: t, children: i, ...d }, n) => /* @__PURE__ */ c(
+    "div",
+    {
+      ref: n,
+      "data-layout": a ?? "flex",
+      "data-component": "dynamic-layout",
+      "data-columns": o ?? void 0,
+      "data-gap": t ?? "md",
+      className: e(
+        s({ layout: a, columns: o, gap: t }),
+        r
+      ),
+      ...d,
+      children: i
+    }
+  )
+);
+m.displayName = "DynamicLayout";
+const l = m;
+export {
+  m as DynamicLayout,
+  l as GridLayout
+};

package/dist/components/layout/dynamic-layout/dynamic-layout.types.d.ts

@@ -0,0 +1,6 @@
+import { VariantProps } from 'class-variance-authority';
+import { dynamicLayoutVariants } from './dynamic-layout.variants';
+import type * as React from "react";
+export interface DynamicLayoutProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof dynamicLayoutVariants> {
+    children: React.ReactNode;
+}

package/dist/components/layout/dynamic-layout/dynamic-layout.variants.d.ts

@@ -0,0 +1,5 @@
+export declare const dynamicLayoutVariants: (props?: ({
+    layout?: "grid" | "flex" | "stack" | null | undefined;
+    columns?: 1 | 2 | 4 | 3 | 6 | 12 | null | undefined;
+    gap?: "sm" | "md" | "lg" | "none" | "xl" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/components/layout/dynamic-layout/dynamic-layout.variants.js

@@ -0,0 +1,32 @@
+import { cva as a } from "class-variance-authority";
+const g = a("", {
+  variants: {
+    layout: {
+      grid: "grid",
+      flex: "flex",
+      stack: "flex flex-col"
+    },
+    columns: {
+      1: "grid-cols-1",
+      2: "grid-cols-2",
+      3: "grid-cols-3",
+      4: "grid-cols-4",
+      6: "grid-cols-6",
+      12: "grid-cols-12"
+    },
+    gap: {
+      none: "gap-0",
+      sm: "gap-2",
+      md: "gap-4",
+      lg: "gap-6",
+      xl: "gap-8"
+    }
+  },
+  defaultVariants: {
+    layout: "flex",
+    gap: "md"
+  }
+});
+export {
+  g as dynamicLayoutVariants
+};

package/dist/components/layout/header/header.d.ts

@@ -0,0 +1,25 @@
+import { BadgeProps } from '../../data-display/badge';
+import { KeyBinding } from '../../primitives/kbd';
+import * as React from "react";
+declare const Header: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>>;
+declare const HeaderLeft: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const HeaderRight: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+/** Home/logo link — pass logo content as `children` (e.g. `<img src={IAUrl} />`). No default logo. */
+declare const HeaderLogo: React.ForwardRefExoticComponent<React.AnchorHTMLAttributes<HTMLAnchorElement> & React.RefAttributes<HTMLAnchorElement>>;
+declare const HeaderSeparator: React.ForwardRefExoticComponent<Omit<Omit<import('@radix-ui/react-separator').SeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const HeaderTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLHeadingElement>>;
+declare const HeaderBadge: {
+    ({ className, children, style, ...props }: Omit<BadgeProps, "size" | "shape">): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+type HeaderBotButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
+declare const HeaderBotButton: React.ForwardRefExoticComponent<HeaderBotButtonProps & React.RefAttributes<HTMLButtonElement>>;
+interface NotificationIconButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "children"> {
+    showIndicator?: boolean;
+    /** Passed through to the underlying icon `Button` tooltip. */
+    tooltipSide?: "top" | "bottom" | "left" | "right";
+    /** Keyboard shortcut shown in the tooltip next to the label (requires `aria-label`). */
+    tooltipKeybinding?: KeyBinding;
+}
+declare const NotificationIconButton: React.ForwardRefExoticComponent<NotificationIconButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export { Header, HeaderLeft, HeaderRight, HeaderLogo, HeaderSeparator, HeaderTitle, HeaderBadge, HeaderBotButton, NotificationIconButton, };