@cognite/aura 0.3.0 → 0.3.2

package/dist/components/ui/core/dropdown-menu/dropdown-menu.js

@@ -1,17 +1,36 @@
-import { jsx as n, jsxs as c } from "react/jsx-runtime";
-import { forwardRef as i } from "react";
+import { jsx as n, jsxs as m } from "react/jsx-runtime";
+import { forwardRef as u } from "react";
 import { Menu as r } from "@base-ui/react/menu";
-import { IconCheck as l, IconChevronRight as m } from "@tabler/icons-react";
-import { usePortalContainer as g } from "../../../../lib/portal-container-context.js";
+import { IconCheck as l, IconChevronRight as f } from "@tabler/icons-react";
+import { cva as g } from "class-variance-authority";
+import { usePortalContainer as b } from "../../../../lib/portal-container-context.js";
 import { cn as d } from "../../../../lib/utils.js";
-function G({ ...e }) {
+const c = g(
+  "relative flex min-h-9 cursor-default items-center gap-2 rounded-md p-2 text-sm leading-4.5 font-medium outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+  {
+    variants: {
+      inset: {
+        true: "pl-8"
+      },
+      variant: {
+        default: "focus:bg-accent-background focus:text-foreground [&_svg:not([class*='text-'])]:text-foreground",
+        destructive: "text-destructive-foreground focus:bg-destructive-background-hover hover:bg-destructive-background-hover focus:text-destructive-foreground [&_svg]:text-destructive-foreground"
+      }
+    },
+    defaultVariants: {
+      inset: !1,
+      variant: "default"
+    }
+  }
+);
+function I({ ...e }) {
   return /* @__PURE__ */ n(r.Root, { "data-slot": "dropdown-menu", ...e });
 }
-function f({
+function x({
   container: e,
   ...t
 }) {
-  const o = g();
+  const o = b();
   return /* @__PURE__ */ n(
     r.Portal,
     {
@@ -21,22 +40,22 @@ function f({
     }
   );
 }
-function L({
+function C({
   children: e,
   ...t
 }) {
   return /* @__PURE__ */ n(r.Trigger, { "data-slot": "dropdown-menu-trigger", ...t, children: e });
 }
-function b({
+function w({
   align: e = "start",
   alignOffset: t = 0,
   side: o = "bottom",
   sideOffset: a = 4,
   className: s,
-  container: u,
+  container: i,
   ...p
 }) {
-  return /* @__PURE__ */ n(f, { container: u, children: /* @__PURE__ */ n(
+  return /* @__PURE__ */ n(x, { container: i, children: /* @__PURE__ */ n(
     r.Positioner,
     {
       className: "isolate z-50 outline-none",
@@ -49,7 +68,7 @@ function b({
         {
           "data-slot": "dropdown-menu-content",
           className: d(
-            "bg-popover-background text-foreground p-1 data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--available-height) min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border shadow-md outline-none",
+            "bg-popover-background text-foreground p-1 data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--available-height) min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-xl border border-border shadow-md outline-none",
             s
           ),
           ...p
@@ -58,34 +77,28 @@ function b({
     }
   ) });
 }
-function P({ ...e }) {
+function R({ ...e }) {
   return /* @__PURE__ */ n(r.Group, { "data-slot": "dropdown-menu-group", ...e });
 }
-const v = i(({ className: e, inset: t, variant: o = "default", children: a, ...s }, u) => /* @__PURE__ */ n(
-  r.Item,
-  {
-    ref: u,
-    "data-slot": "dropdown-menu-item",
-    "data-inset": t,
-    "data-variant": o,
-    className: d(
-      "focus:bg-accent-background focus:text-foreground data-[variant=destructive]:text-destructive-foreground data-[variant=destructive]:focus:bg-destructive-background-hover dark:data-[variant=destructive]:focus:bg-destructive-background-hover data-[variant=destructive]:focus:text-destructive-foreground data-[variant=destructive]:*:[svg]:text-destructive-foreground data-[variant=destructive]:hover:bg-destructive-background-hover dark:data-[variant=destructive]:hover:bg-destructive-background-hover [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm p-2 text-base outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-inset:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-      e
-    ),
-    ...s,
-    children: a
-  }
-));
-v.displayName = "DropdownMenuItem";
-const x = i(({ className: e, children: t, checked: o, ...a }, s) => /* @__PURE__ */ c(
+const S = u(
+  ({ className: e, inset: t, variant: o = "default", children: a, ...s }, i) => /* @__PURE__ */ n(
+    r.Item,
+    {
+      ref: i,
+      "data-slot": "dropdown-menu-item",
+      "data-inset": t,
+      "data-variant": o,
+      className: d(c({ inset: t, variant: o }), e),
+      ...s,
+      children: a
+    }
+  )
+), _ = u(({ className: e, children: t, checked: o, ...a }, s) => /* @__PURE__ */ m(
   r.CheckboxItem,
   {
     ref: s,
     "data-slot": "dropdown-menu-checkbox-item",
-    className: d(
-      "focus:bg-accent-background focus:text-foreground h-9 relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-      e
-    ),
+    className: d(c({ inset: !0 }), e),
     checked: o,
     ...a,
     children: [
@@ -94,8 +107,7 @@ const x = i(({ className: e, children: t, checked: o, ...a }, s) => /* @__PURE__
     ]
   }
 ));
-x.displayName = "DropdownMenuCheckboxItem";
-function T({
+function y({
   ...e
 }) {
   return /* @__PURE__ */ n(
@@ -106,53 +118,44 @@ function T({
     }
   );
 }
-const w = i(({ className: e, children: t, ...o }, a) => /* @__PURE__ */ c(
+const G = u(({ className: e, children: t, ...o }, a) => /* @__PURE__ */ m(
   r.RadioItem,
   {
     ref: a,
     "data-slot": "dropdown-menu-radio-item",
-    className: d(
-      "focus:bg-accent-background focus:text-foreground h-9 relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-      e
-    ),
+    className: d(c({ inset: !0 }), e),
     ...o,
     children: [
       /* @__PURE__ */ n("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ n(r.RadioItemIndicator, { children: /* @__PURE__ */ n(l, { className: "size-4 text-foreground" }) }) }),
       t
     ]
   }
-));
-w.displayName = "DropdownMenuRadioItem";
-const h = i(({ className: e, inset: t, ...o }, a) => /* @__PURE__ */ n(
+)), P = u(({ className: e, inset: t, ...o }, a) => /* @__PURE__ */ n(
   r.GroupLabel,
   {
     ref: a,
     "data-slot": "dropdown-menu-label",
     "data-inset": t,
     className: d(
-      "-mx-1 -mt-1 mb-1 px-2 py-1.5 text-sm border-b border-border font-medium data-inset:pl-8 text-foreground dark:text-foreground",
+      "-mx-1 -mt-1 mb-1 px-3 pt-2 text-sm leading-4.5 border-b border-border font-medium data-inset:pl-8 text-muted-foreground",
       e
     ),
     ...o
   }
-));
-h.displayName = "DropdownMenuLabel";
-const M = i(
+)), j = u(
   ({ className: e, ...t }, o) => /* @__PURE__ */ n(
     "div",
     {
       ref: o,
       "data-slot": "dropdown-menu-header",
       className: d(
-        "-mx-1 -mt-1 mb-1 flex flex-row items-center gap-2 border-b border-border px-2 py-2 pointer-events-none",
+        "-mx-1 -mt-1 mb-1 flex flex-row items-center gap-2 border-b border-border p-3 pointer-events-none",
         e
       ),
       ...t
     }
   )
-);
-M.displayName = "DropdownMenuHeader";
-const D = i(({ className: e, ...t }, o) => /* @__PURE__ */ n(
+), T = u(({ className: e, ...t }, o) => /* @__PURE__ */ n(
   r.Separator,
   {
     ref: o,
@@ -160,9 +163,7 @@ const D = i(({ className: e, ...t }, o) => /* @__PURE__ */ n(
     className: d("bg-border -mx-1 my-1 h-px", e),
     ...t
   }
-));
-D.displayName = "DropdownMenuSeparator";
-const N = i(
+)), L = u(
   ({ className: e, ...t }, o) => /* @__PURE__ */ n(
     "span",
     {
@@ -176,40 +177,38 @@ const N = i(
     }
   )
 );
-N.displayName = "DropdownMenuShortcut";
-function j({
+function V({
   ...e
 }) {
   return /* @__PURE__ */ n(r.SubmenuRoot, { "data-slot": "dropdown-menu-sub", ...e });
 }
-const k = i(({ className: e, inset: t, children: o, ...a }, s) => /* @__PURE__ */ c(
+const H = u(({ className: e, inset: t, children: o, ...a }, s) => /* @__PURE__ */ m(
   r.SubmenuTrigger,
   {
     ref: s,
     "data-slot": "dropdown-menu-sub-trigger",
     "data-inset": t,
     className: d(
-      "focus:bg-accent-background focus:text-foreground data-open:bg-accent-background data-open:text-foreground [&_svg:not([class*='text-'])]:text-muted-foreground flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-inset:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+      "focus:bg-accent-background focus:text-foreground data-open:bg-accent-background data-open:text-foreground [&_svg:not([class*='text-'])]:text-muted-foreground flex min-h-9 cursor-default items-center gap-2 rounded-md px-2 text-sm leading-4.5 font-medium outline-hidden select-none data-inset:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
       e
     ),
     ...a,
     children: [
       o,
-      /* @__PURE__ */ n(m, { className: "ml-auto size-4" })
+      /* @__PURE__ */ n(f, { className: "ml-auto size-4" })
     ]
   }
 ));
-k.displayName = "DropdownMenuSubTrigger";
-function H({
+function q({
   align: e = "start",
   alignOffset: t = -3,
   side: o = "right",
   sideOffset: a = 0,
   className: s,
-  ...u
+  ...i
 }) {
   return /* @__PURE__ */ n(
-    b,
+    w,
     {
       "data-slot": "dropdown-menu-sub-content",
       className: d("min-w-32 w-auto", s),
@@ -217,41 +216,40 @@ function H({
       alignOffset: t,
       side: o,
       sideOffset: a,
-      ...u
+      ...i
     }
   );
 }
-const y = i(
+const A = u(
   ({ className: e, ...t }, o) => /* @__PURE__ */ n(
     "div",
     {
       ref: o,
       "data-slot": "dropdown-menu-section-label",
       className: d(
-        "px-2 py-1 text-sm text-muted-foreground dark:text-muted-foreground",
+        "px-3 pt-2 pb-0 text-sm font-medium text-muted-foreground",
         e
       ),
       ...t
     }
   )
 );
-y.displayName = "DropdownMenuSectionLabel";
 export {
-  G as DropdownMenu,
-  x as DropdownMenuCheckboxItem,
-  b as DropdownMenuContent,
-  P as DropdownMenuGroup,
-  M as DropdownMenuHeader,
-  v as DropdownMenuItem,
-  h as DropdownMenuLabel,
-  f as DropdownMenuPortal,
-  T as DropdownMenuRadioGroup,
-  w as DropdownMenuRadioItem,
-  y as DropdownMenuSectionLabel,
-  D as DropdownMenuSeparator,
-  N as DropdownMenuShortcut,
-  j as DropdownMenuSub,
-  H as DropdownMenuSubContent,
-  k as DropdownMenuSubTrigger,
-  L as DropdownMenuTrigger
+  I as DropdownMenu,
+  _ as DropdownMenuCheckboxItem,
+  w as DropdownMenuContent,
+  R as DropdownMenuGroup,
+  j as DropdownMenuHeader,
+  S as DropdownMenuItem,
+  P as DropdownMenuLabel,
+  x as DropdownMenuPortal,
+  y as DropdownMenuRadioGroup,
+  G as DropdownMenuRadioItem,
+  A as DropdownMenuSectionLabel,
+  T as DropdownMenuSeparator,
+  L as DropdownMenuShortcut,
+  V as DropdownMenuSub,
+  q as DropdownMenuSubContent,
+  H as DropdownMenuSubTrigger,
+  C as DropdownMenuTrigger
 };

package/dist/components/ui/core/hover-card/hover-card.js

@@ -1,15 +1,15 @@
 import { jsx as t } from "react/jsx-runtime";
-import { useMemo as p, forwardRef as l, useContext as f, createContext as u } from "react";
+import { createContext as p, forwardRef as l, useContext as f, useMemo as u } from "react";
 import { PreviewCard as d } from "@base-ui/react/preview-card";
 import { usePortalContainer as g } from "../../../../lib/portal-container-context.js";
 import { cn as v } from "../../../../lib/utils.js";
-const m = u(null);
+const m = p(null);
 function w({
   openDelay: o,
   closeDelay: e,
   ...a
 }) {
-  const r = p(
+  const r = u(
     () => ({ openDelay: o, closeDelay: e }),
     [o, e]
   );

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

@@ -8,7 +8,7 @@ const u = o(
       ref: a,
       "data-slot": "input",
       className: l(
-        "w-full",
+        "w-full h-9",
         d,
         s,
         p,