@cognite/aura 0.3.2 → 0.3.4

package/dist/components/ui/core/badge/badge.js

@@ -1,108 +1,73 @@
-import { forwardRef as l } from "react";
-import { mergeProps as p } from "@base-ui/react/merge-props";
-import { useRender as m } from "@base-ui/react/use-render";
-import { cva as v } from "class-variance-authority";
-import { cn as x } from "../../../../lib/utils.js";
-const k = v(
-  "inline-flex h-5 items-center align-middle justify-center rounded-md border px-1 text-sm font-medium leading-[18px] w-fit whitespace-nowrap shrink-0 gap-1 [&>svg]:pointer-events-none [&>svg]:size-3 outline-none focus-visible:border-ring focus-visible:ring-ring-muted focus-visible:ring aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
-  {
-    variants: {
-      variant: {
-        default: "border-transparent bg-neutral-background text-foreground-on-neutral",
-        fjord: "border-transparent bg-decorative-background-fjord text-decorative-foreground-fjord",
-        nordic: "border-transparent bg-decorative-background-nordic text-decorative-foreground-nordic",
-        aurora: "border-transparent bg-decorative-background-aurora text-decorative-foreground-aurora",
-        sky: "border-transparent bg-decorative-background-sky text-decorative-foreground-sky",
-        dusk: "border-transparent bg-decorative-background-dusk text-decorative-foreground-dusk",
-        orange: "border-transparent bg-decorative-background-orange text-decorative-foreground-orange",
-        gray: "border-transparent bg-decorative-background-mountain text-decorative-foreground-mountain",
-        mountain: "border-transparent bg-decorative-background-mountain text-decorative-foreground-mountain",
-        secondary: "border-transparent bg-secondary-background text-secondary-foreground",
-        error: "border-transparent bg-destructive-background text-destructive-foreground-on-critical",
-        warning: "border-transparent bg-warning-background text-warning-foreground-on-warning",
-        success: "border-transparent bg-success-background text-success-foreground-on-success",
-        inProgress: "border-transparent bg-info-background text-info-foreground-on-info",
-        archived: "border-transparent bg-neutral-background text-neutral-foreground-on-neutral",
-        closable: "border-transparent bg-secondary-background text-secondary-foreground hover:bg-secondary-background-hover cursor-pointer"
-      },
-      size: {
-        default: "",
-        icon: "w-5 px-0 py-0"
-      },
-      outline: {
-        true: "border-border"
-      },
-      background: {
-        false: "bg-transparent"
-      },
-      dot: {
-        true: "min-w-5 rounded-md border border-background px-1 gap-0"
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default",
-      outline: !1,
-      background: !0,
-      dot: !1
-    }
-  }
-), w = l(
-  ({
-    className: t,
-    variant: r,
-    size: a,
-    outline: d,
-    dot: o,
-    background: i,
-    urgent: s = !1,
-    children: n,
-    render: u,
-    ...g
-  }, c) => {
-    const b = !n, f = r && !(/* @__PURE__ */ new Set([
-      "mountain",
-      "fjord",
-      "nordic",
-      "aurora",
-      "dusk",
-      "orange"
-    ])).has(r), e = d === !0 && f;
-    return m({
-      defaultTagName: "span",
-      ref: c,
-      props: p(
-        {
-          className: x(
-            k({
-              variant: r,
-              size: a,
-              outline: e,
-              background: e ? !1 : i,
-              dot: o
-            }),
-            e && r === "error" && "text-destructive-foreground",
-            e && r === "warning" && "text-warning-foreground",
-            e && r === "success" && "text-success-foreground",
-            e && r === "inProgress" && "text-info-foreground",
-            e && r === "archived" && "text-neutral-foreground",
-            o && b && "h-2 w-2 min-h-2 min-w-2 max-h-2 max-w-2 rounded-full p-0 border-0",
-            o && s && "bg-destructive-background text-destructive-foreground-on-critical",
-            t
-          )
-        },
-        { ...g, children: n }
-      ),
-      render: u,
-      state: {
-        slot: "badge",
-        variant: r
-      }
-    });
-  }
-);
-w.displayName = "Badge";
-export {
-  w as Badge,
-  k as badgeVariants
-};
+import { cn as e } from "../../../../lib/utils.js";
+import { forwardRef as t } from "react";
+import { cva as n } from "class-variance-authority";
+import { mergeProps as r } from "@base-ui/react/merge-props";
+import { useRender as i } from "@base-ui/react/use-render";
+//#region libs/aura/src/components/ui/core/badge/badge.tsx
+var a = n("inline-flex h-5 items-center align-middle justify-center rounded-md border px-1 text-sm font-medium leading-[18px] w-fit whitespace-nowrap shrink-0 gap-1 [&>svg]:pointer-events-none [&>svg]:size-3 outline-none focus-visible:border-ring focus-visible:ring-ring-muted focus-visible:ring aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden", {
+	variants: {
+		variant: {
+			default: "border-transparent bg-neutral-background text-foreground-on-neutral",
+			fjord: "border-transparent bg-decorative-background-fjord text-decorative-foreground-fjord",
+			nordic: "border-transparent bg-decorative-background-nordic text-decorative-foreground-nordic",
+			aurora: "border-transparent bg-decorative-background-aurora text-decorative-foreground-aurora",
+			sky: "border-transparent bg-decorative-background-sky text-decorative-foreground-sky",
+			dusk: "border-transparent bg-decorative-background-dusk text-decorative-foreground-dusk",
+			orange: "border-transparent bg-decorative-background-orange text-decorative-foreground-orange",
+			gray: "border-transparent bg-decorative-background-mountain text-decorative-foreground-mountain",
+			mountain: "border-transparent bg-decorative-background-mountain text-decorative-foreground-mountain",
+			secondary: "border-transparent bg-secondary-background text-secondary-foreground",
+			error: "border-transparent bg-destructive-background text-destructive-foreground-on-critical",
+			warning: "border-transparent bg-warning-background text-warning-foreground-on-warning",
+			success: "border-transparent bg-success-background text-success-foreground-on-success",
+			inProgress: "border-transparent bg-info-background text-info-foreground-on-info",
+			archived: "border-transparent bg-neutral-background text-neutral-foreground-on-neutral",
+			closable: "border-transparent bg-secondary-background text-secondary-foreground hover:bg-secondary-background-hover cursor-pointer"
+		},
+		size: {
+			default: "",
+			icon: "w-5 px-0 py-0"
+		},
+		outline: { true: "border-border" },
+		background: { false: "bg-transparent" },
+		dot: { true: "min-w-5 rounded-md border border-background px-1 gap-0" }
+	},
+	defaultVariants: {
+		variant: "default",
+		size: "default",
+		outline: !1,
+		background: !0,
+		dot: !1
+	}
+}), o = t(({ className: t, variant: n, size: o, outline: s, dot: c, background: l, urgent: u = !1, children: d, render: f, ...p }, m) => {
+	let h = !d, g = n && !(/* @__PURE__ */ new Set([
+		"mountain",
+		"fjord",
+		"nordic",
+		"aurora",
+		"dusk",
+		"orange"
+	])).has(n), _ = s === !0 && g;
+	return i({
+		defaultTagName: "span",
+		ref: m,
+		props: r({ className: e(a({
+			variant: n,
+			size: o,
+			outline: _,
+			background: !_ && l,
+			dot: c
+		}), _ && n === "error" && "text-destructive-foreground", _ && n === "warning" && "text-warning-foreground", _ && n === "success" && "text-success-foreground", _ && n === "inProgress" && "text-info-foreground", _ && n === "archived" && "text-neutral-foreground", c && h && "h-2 w-2 min-h-2 min-w-2 max-h-2 max-w-2 rounded-full p-0 border-0", c && u && "bg-destructive-background text-destructive-foreground-on-critical", t) }, {
+			...p,
+			children: d
+		}),
+		render: f,
+		state: {
+			slot: "badge",
+			variant: n
+		}
+	});
+});
+o.displayName = "Badge";
+//#endregion
+export { o as Badge, a as badgeVariants };

package/dist/components/ui/core/banner/banner.js

@@ -1,218 +1,149 @@
-import { jsx as s } from "react/jsx-runtime";
-import { createContext as k, forwardRef as l, useMemo as w, useContext as b, useState as B, useRef as N, useEffect as y, useCallback as C } from "react";
-import { cva as V } from "class-variance-authority";
-import { cn as u } from "../../../../lib/utils.js";
-import { Badge as S } from "../badge/badge.js";
-import { Button as A } from "../button/button.js";
-const R = (e) => {
-}, m = k({
-  show: !0,
-  setShow: R,
-  variant: "default"
+import { cn as e } from "../../../../lib/utils.js";
+import { Button as t } from "../button/button.js";
+import { Badge as n } from "../badge/badge.js";
+import { createContext as r, forwardRef as i, useCallback as a, useContext as o, useEffect as s, useMemo as c, useRef as l, useState as u } from "react";
+import { jsx as d } from "react/jsx-runtime";
+import { cva as f } from "class-variance-authority";
+var p = r({
+	show: !0,
+	setShow: (e) => {},
+	variant: "default"
 });
-function p(e) {
-  return typeof e == "function";
+function m(e) {
+	return typeof e == "function";
 }
-function j({
-  visible: e,
-  defaultVisible: t,
-  onClose: n
-}) {
-  const [r, a] = B(t), i = e !== void 0, g = i ? e : r, d = N(n);
-  y(() => {
-    d.current = n;
-  }, [n]);
-  const x = C(
-    (o) => {
-      if (i) {
-        (p(o) ? o(e) : o) || d.current?.();
-        return;
-      }
-      a((c) => {
-        const f = p(o) ? o(c) : o;
-        return f || d.current?.(), f;
-      });
-    },
-    [i, e]
-  );
-  return [g, x];
+function h({ visible: e, defaultVisible: t, onClose: n }) {
+	let [r, i] = u(t), o = e !== void 0, c = o ? e : r, d = l(n);
+	return s(() => {
+		d.current = n;
+	}, [n]), [c, a((t) => {
+		if (o) {
+			(m(t) ? t(e) : t) || d.current?.();
+			return;
+		}
+		i((e) => {
+			let n = m(t) ? t(e) : t;
+			return n || d.current?.(), n;
+		});
+	}, [o, e])];
 }
-const I = V(
-  "flex w-full h-11 flex-col items-start justify-center px-3 py-0",
-  {
-    variants: {
-      variant: {
-        default: "bg-neutral-background text-foreground-fixed-dark",
-        info: "bg-info-background text-foreground-fixed-dark",
-        warning: "bg-warning-background text-foreground-fixed-dark",
-        destructive: "bg-destructive-background text-foreground-fixed-dark"
-      },
-      inset: {
-        true: "rounded-lg",
-        false: ""
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      inset: !1
-    }
-  }
-), M = l(
-  ({
-    children: e,
-    visible: t,
-    defaultVisible: n = !0,
-    onClose: r,
-    className: a,
-    inset: i = !1,
-    variant: g = "default",
-    ...d
-  }, x) => {
-    const o = g ?? "default", [c, f] = j({
-      defaultVisible: n,
-      visible: t,
-      onClose: r
-    }), h = w(
-      () => ({ show: c ?? !0, setShow: f, variant: o }),
-      [c, f, o]
-    );
-    return c ? /* @__PURE__ */ s(m.Provider, { value: h, children: /* @__PURE__ */ s(
-      "div",
-      {
-        ref: x,
-        "data-slot": "banner",
-        className: u(
-          I({ variant: o, inset: i }),
-          a
-        ),
-        ...d,
-        children: /* @__PURE__ */ s(
-          "div",
-          {
-            "data-slot": "banner-content",
-            className: "flex h-7 w-full items-center self-stretch gap-2",
-            children: e
-          }
-        )
-      }
-    ) }) : null;
-  }
-);
-M.displayName = "Banner";
-const O = {
-  default: "text-neutral-foreground-on-neutral",
-  info: "text-info-foreground-on-info",
-  warning: "text-warning-foreground-on-warning",
-  destructive: "text-destructive-foreground-on-critical"
-}, _ = l(
-  ({ icon: e, className: t, ...n }, r) => {
-    const { variant: a } = b(m);
-    return /* @__PURE__ */ s(
-      "div",
-      {
-        ref: r,
-        "data-slot": "banner-icon",
-        className: u(
-          "flex h-4 w-4 shrink-0 items-center justify-center",
-          O[a],
-          t
-        ),
-        ...n,
-        children: /* @__PURE__ */ s(e, { size: 16 })
-      }
-    );
-  }
-);
-_.displayName = "BannerIcon";
-const E = l(
-  ({ className: e, ...t }, n) => /* @__PURE__ */ s(
-    "p",
-    {
-      ref: n,
-      "data-slot": "banner-title",
-      className: u(
-        "flex min-w-0 flex-1 items-center text-base font-medium leading-5 tracking-tighter text-foreground-fixed-dark",
-        e
-      ),
-      ...t
-    }
-  )
-);
-E.displayName = "BannerTitle";
-const L = l(
-  ({ outline: e = !0, variant: t, className: n, ...r }, a) => {
-    const { variant: i } = b(m), d = t ?? {
-      default: "default",
-      info: "inProgress",
-      destructive: "error",
-      warning: "warning"
-    }[i];
-    return /* @__PURE__ */ s(
-      S,
-      {
-        ref: a,
-        "data-slot": "banner-status",
-        outline: e,
-        variant: d,
-        className: u("shrink-0", n),
-        ...r
-      }
-    );
-  }
-);
-L.displayName = "BannerStatus";
-const P = l(
-  ({ className: e, ...t }, n) => /* @__PURE__ */ s(
-    "div",
-    {
-      ref: n,
-      "data-slot": "banner-actions",
-      className: u("ml-auto flex h-7 shrink-0 items-center gap-2", e),
-      ...t
-    }
-  )
-);
-P.displayName = "BannerActions";
-const v = l(
-  ({ variant: e = "ghost", size: t = "sm", className: n, ...r }, a) => /* @__PURE__ */ s(
-    A,
-    {
-      ref: a,
-      "data-slot": "banner-action",
-      className: u(
-        "h-7 min-w-16 shrink-0 rounded px-2 text-sm font-medium leading-4.5 text-foreground-fixed-dark hover:bg-transparent dark:hover:bg-transparent hover:text-foreground-secondary-fixed-dark disabled:bg-transparent dark:disabled:bg-transparent disabled:text-disabled-foreground",
-        n
-      ),
-      size: t,
-      variant: e,
-      ...r
-    }
-  )
-);
-v.displayName = "BannerAction";
-const T = l(
-  ({ onClick: e, ...t }, n) => {
-    const { setShow: r } = b(m);
-    return /* @__PURE__ */ s(
-      v,
-      {
-        ref: n,
-        "data-slot": "banner-close",
-        onClick: (i) => {
-          r(!1), e?.(i);
-        },
-        ...t
-      }
-    );
-  }
-);
-T.displayName = "BannerClose";
-export {
-  M as Banner,
-  v as BannerAction,
-  P as BannerActions,
-  T as BannerClose,
-  _ as BannerIcon,
-  L as BannerStatus,
-  E as BannerTitle
-};
+var g = f("flex w-full h-11 flex-col items-start justify-center px-3 py-0", {
+	variants: {
+		variant: {
+			default: "bg-neutral-background text-foreground-fixed-dark",
+			info: "bg-info-background text-foreground-fixed-dark",
+			warning: "bg-warning-background text-foreground-fixed-dark",
+			destructive: "bg-destructive-background text-foreground-fixed-dark"
+		},
+		inset: {
+			true: "rounded-lg",
+			false: ""
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		inset: !1
+	}
+}), _ = i(({ children: t, visible: n, defaultVisible: r = !0, onClose: i, className: a, inset: o = !1, variant: s = "default", ...l }, u) => {
+	let f = s ?? "default", [m, _] = h({
+		defaultVisible: r,
+		visible: n,
+		onClose: i
+	}), v = c(() => ({
+		show: m ?? !0,
+		setShow: _,
+		variant: f
+	}), [
+		m,
+		_,
+		f
+	]);
+	return m ? /* @__PURE__ */ d(p.Provider, {
+		value: v,
+		children: /* @__PURE__ */ d("div", {
+			ref: u,
+			"data-slot": "banner",
+			className: e(g({
+				variant: f,
+				inset: o
+			}), a),
+			...l,
+			children: /* @__PURE__ */ d("div", {
+				"data-slot": "banner-content",
+				className: "flex h-7 w-full items-center self-stretch gap-2",
+				children: t
+			})
+		})
+	}) : null;
+});
+_.displayName = "Banner";
+var v = {
+	default: "text-neutral-foreground-on-neutral",
+	info: "text-info-foreground-on-info",
+	warning: "text-warning-foreground-on-warning",
+	destructive: "text-destructive-foreground-on-critical"
+}, y = i(({ icon: t, className: n, ...r }, i) => {
+	let { variant: a } = o(p);
+	return /* @__PURE__ */ d("div", {
+		ref: i,
+		"data-slot": "banner-icon",
+		className: e("flex h-4 w-4 shrink-0 items-center justify-center", v[a], n),
+		...r,
+		children: /* @__PURE__ */ d(t, { size: 16 })
+	});
+});
+y.displayName = "BannerIcon";
+var b = i(({ className: t, ...n }, r) => /* @__PURE__ */ d("p", {
+	ref: r,
+	"data-slot": "banner-title",
+	className: e("flex min-w-0 flex-1 items-center text-base font-medium leading-5 tracking-tighter text-foreground-fixed-dark", t),
+	...n
+}));
+b.displayName = "BannerTitle";
+var x = i(({ outline: t = !0, variant: r, className: i, ...a }, s) => {
+	let { variant: c } = o(p);
+	return /* @__PURE__ */ d(n, {
+		ref: s,
+		"data-slot": "banner-status",
+		outline: t,
+		variant: r ?? {
+			default: "default",
+			info: "inProgress",
+			destructive: "error",
+			warning: "warning"
+		}[c],
+		className: e("shrink-0", i),
+		...a
+	});
+});
+x.displayName = "BannerStatus";
+var S = i(({ className: t, ...n }, r) => /* @__PURE__ */ d("div", {
+	ref: r,
+	"data-slot": "banner-actions",
+	className: e("ml-auto flex h-7 shrink-0 items-center gap-2", t),
+	...n
+}));
+S.displayName = "BannerActions";
+var C = i(({ variant: n = "ghost", size: r = "sm", className: i, ...a }, o) => /* @__PURE__ */ d(t, {
+	ref: o,
+	"data-slot": "banner-action",
+	className: e("h-7 min-w-16 shrink-0 rounded px-2 text-sm font-medium leading-4.5 text-foreground-fixed-dark hover:bg-transparent dark:hover:bg-transparent hover:text-foreground-secondary-fixed-dark disabled:bg-transparent dark:disabled:bg-transparent disabled:text-disabled-foreground", i),
+	size: r,
+	variant: n,
+	...a
+}));
+C.displayName = "BannerAction";
+var w = i(({ onClick: e, ...t }, n) => {
+	let { setShow: r } = o(p);
+	return /* @__PURE__ */ d(C, {
+		ref: n,
+		"data-slot": "banner-close",
+		onClick: (t) => {
+			r(!1), e?.(t);
+		},
+		...t
+	});
+});
+w.displayName = "BannerClose";
+//#endregion
+export { _ as Banner, C as BannerAction, S as BannerActions, w as BannerClose, y as BannerIcon, x as BannerStatus, b as BannerTitle };