asma-ui-core 3.105.0 → 3.107.0

package/dist/components/inputs/dynamic-select/components/DynamicSelectAutocomplete.js

@@ -1,10 +1,10 @@
 import { cn as q } from "../../../../helpers/cn.js";
+import { StyledTooltip as z } from "../../../data-display/tooltip/StyledTooltip.js";
 import { LoadingIcon as te } from "../../../icons/loading-icon/LoadingIcon.js";
 import { CheckIcon as le } from "../../../icons/check-icon/CheckIcon.js";
 import { PlusIconCircle as ae } from "../../../icons/plus-icon-circle/PlusIconCircle.js";
-import { StyledChip as z } from "../../../data-display/chip/StyledChip.js";
+import { StyledChip as E } from "../../../data-display/chip/StyledChip.js";
 import { StyledCheckbox as re } from "../../checkbox/base-ui/StyledCheckbox.js";
-import { StyledTooltip as E } from "../../../data-display/tooltip/StyledTooltip.js";
 import { StyledInputField as oe } from "../../input-field/StyledInputField.js";
 import { StyledSelectAutocomplete as ie } from "../../select-autocomplete/StyledSelectAutocomplete.js";
 import { DynamicInteractiveChipGroup as ne } from "./DynamicInteractiveChipGroup.js";
@@ -55,7 +55,7 @@ var Ce = se((O, H) => {
       renderValue: o ? (e) => {
         if (!Array.isArray(e)) return null;
         const t = e, c = X ?? k.length, r = t.slice(0, c), n = t.length - c;
-        return [...r.map((a) => /* @__PURE__ */ l(z, {
+        return [...r.map((a) => /* @__PURE__ */ l(E, {
           dataTest: `${w(a)}-chip`,
           readOnly: u,
           variant: "outlined",
@@ -69,7 +69,7 @@ var Ce = se((O, H) => {
           onDelete: () => {
             Array.isArray(g) && x(g.filter((p) => !$(p, a)));
           }
-        }, w(a))), n > 0 ? /* @__PURE__ */ l(z, {
+        }, w(a))), n > 0 ? /* @__PURE__ */ l(E, {
           dataTest: "remaining-count-tag-chip",
           label: `+${n}`,
           variant: "outlined",
@@ -105,7 +105,7 @@ var Ce = se((O, H) => {
           }, j, e["data-active"] !== void 0 && /* @__PURE__ */ l("span", {
             "aria-hidden": "true",
             className: "border-l-solid pointer-events-none absolute inset-y-0 left-0 border-l-[3px] border-focus-ring"
-          }), /* @__PURE__ */ l(E, {
+          }), /* @__PURE__ */ l(z, {
             arrow: !0,
             title: n,
             open: p,
@@ -135,7 +135,7 @@ var Ce = se((O, H) => {
         }, j, e["data-active"] !== void 0 && /* @__PURE__ */ l("span", {
           "aria-hidden": "true",
           className: "border-l-solid pointer-events-none absolute inset-y-0 left-0 border-l-[3px] border-focus-ring"
-        }), /* @__PURE__ */ l(E, {
+        }), /* @__PURE__ */ l(z, {
           arrow: !0,
           title: n,
           open: p,

package/dist/components/inputs/select/StyledSelect.js

@@ -1,8 +1,8 @@
 import { cn as y } from "../../../helpers/cn.js";
 import { resolveSx as je } from "../../../helpers/sx.js";
-import { ChevronDownIcon as Ue } from "../../icons/chevron-down-icon/ChevronDownIcon.js";
-import { CloseIcon as Ve } from "../../icons/close-icon/CloseIcon.js";
-import { TOP_LAYER_PROPS as qe, TOP_LAYER_RESET_STYLE as Ye, getOpenModalDialogAncestor as re, shouldUsePopoverTopLayer as ze, useTopLayerRef as Ke } from "../../../hooks/useTopLayer.hook.js";
+import { TOP_LAYER_PROPS as Ue, TOP_LAYER_RESET_STYLE as Ve, getOpenModalDialogAncestor as re, shouldUsePopoverTopLayer as qe, useTopLayerRef as Ye } from "../../../hooks/useTopLayer.hook.js";
+import { ChevronDownIcon as ze } from "../../icons/chevron-down-icon/ChevronDownIcon.js";
+import { CloseIcon as Ke } from "../../icons/close-icon/CloseIcon.js";
 import { HelperRow as We } from "../../../helpers/HelperRow.js";
 import { useHelperRowBudget as Ge } from "../../../helpers/useHelperRowBudget.js";
 import { useHelperSlot as Je } from "../../../helpers/useHelperSlot.js";
@@ -32,7 +32,7 @@ var Ct = ({ dataTest: T, value: M, defaultValue: ne, onChange: $, error: le, err
     at(N, { enabled: !n && !c }),
     ct(N),
     pt(N, { role: "listbox" })
-  ]), [Q, X] = x(), _ = ze(Q), Ee = ft([Ke(Se, _), P]);
+  ]), [Q, X] = x(), _ = qe(Q), Ee = ft([Ye(Se, _), P]);
   B(() => u?.setFocused(r || k), [
     r,
     k,
@@ -149,11 +149,11 @@ var Ct = ({ dataTest: T, value: M, defaultValue: ne, onChange: $, error: le, err
               onClick: (e) => {
                 e.stopPropagation(), ee();
               },
-              children: /* @__PURE__ */ l(Ve, {
+              children: /* @__PURE__ */ l(Ke, {
                 width: 18,
                 height: 18
               })
-            }), /* @__PURE__ */ l(Ue, {
+            }), /* @__PURE__ */ l(ze, {
               width: 24,
               height: 24,
               className: y("shrink-0 transition-transform", H ? "text-gama-500" : Me, r && "flip-180")
@@ -178,9 +178,9 @@ var Ct = ({ dataTest: T, value: M, defaultValue: ne, onChange: $, error: le, err
           "aria-multiselectable": d ? !0 : void 0,
           "aria-labelledby": v,
           "aria-label": v ? void 0 : w,
-          ..._ ? qe : {},
+          ..._ ? Ue : {},
           style: {
-            ..._ ? Ye : {},
+            ..._ ? Ve : {},
             ...Fe,
             fontFamily: "Roboto, Helvetica, Arial, sans-serif"
           },

package/dist/components/inputs/select-autocomplete/StyledSelectAutocomplete.js

@@ -1,11 +1,11 @@
 import { cn as _ } from "../../../helpers/cn.js";
-import { ChevronDownIcon as nt } from "../../icons/chevron-down-icon/ChevronDownIcon.js";
-import { CloseIcon as at } from "../../icons/close-icon/CloseIcon.js";
-import { CheckIcon as it } from "../../icons/check-icon/CheckIcon.js";
-import { PlusIconCircle as ct } from "../../icons/plus-icon-circle/PlusIconCircle.js";
-import { StyledChip as dt } from "../../data-display/chip/StyledChip.js";
+import { TOP_LAYER_PROPS as nt, TOP_LAYER_RESET_STYLE as at, getOpenModalDialogAncestor as it, shouldUsePopoverTopLayer as ct, useTopLayerRef as dt } from "../../../hooks/useTopLayer.hook.js";
+import { ChevronDownIcon as ut } from "../../icons/chevron-down-icon/ChevronDownIcon.js";
+import { CloseIcon as pt } from "../../icons/close-icon/CloseIcon.js";
+import { CheckIcon as ft } from "../../icons/check-icon/CheckIcon.js";
+import { PlusIconCircle as mt } from "../../icons/plus-icon-circle/PlusIconCircle.js";
+import { StyledChip as ht } from "../../data-display/chip/StyledChip.js";
 import { StyledCheckbox as de } from "../checkbox/base-ui/StyledCheckbox.js";
-import { TOP_LAYER_PROPS as ut, TOP_LAYER_RESET_STYLE as pt, getOpenModalDialogAncestor as ft, shouldUsePopoverTopLayer as mt, useTopLayerRef as ht } from "../../../hooks/useTopLayer.hook.js";
 import { LoadingIcon as bt } from "../../../table/shared-components/LoadingIcon.js";
 import U from "./StyledSelectAutocomplete.module.js";
 import { useEffect as ue, useMemo as V, useRef as pe, useState as D } from "react";
@@ -64,7 +64,7 @@ function Ut({ dataTest: l, options: b, renderInput: me, value: N, onChange: A, g
         He(e.reference.width), We(Ne ? t - 8 : Math.min(t - 8, 320));
       } })
     ]
-  }), { getReferenceProps: Ve, getFloatingProps: Be, getItemProps: Te } = Nt([Dt(se), At(se, { role: "listbox" })]), Ye = fe([E.setReference]), ne = V(() => a ? ft(E.reference.current) : void 0, [a, E]), z = mt(ne), qe = fe([ht(E.setFloating, z)]), Ge = (e) => j.includes(k) ? k : j[e === 1 ? 0 : j.length - 1] ?? null, Je = (e) => {
+  }), { getReferenceProps: Ve, getFloatingProps: Be, getItemProps: Te } = Nt([Dt(se), At(se, { role: "listbox" })]), Ye = fe([E.setReference]), ne = V(() => a ? it(E.reference.current) : void 0, [a, E]), z = ct(ne), qe = fe([dt(E.setFloating, z)]), Ge = (e) => j.includes(k) ? k : j[e === 1 ? 0 : j.length - 1] ?? null, Je = (e) => {
     h.length !== 0 && x((t) => {
       const n = h.indexOf(t ?? k);
       return n === -1 ? h[e === 1 ? 0 : h.length - 1] ?? null : h[Math.min(Math.max(n + e, 0), h.length - 1)] ?? null;
@@ -112,7 +112,7 @@ function Ut({ dataTest: l, options: b, renderInput: me, value: N, onChange: A, g
   a && o != null && (o === -1 || u[o] !== void 0) && (ce = o === -1 ? `${l}-select-all` : `${l}-option-${o}`);
   const Xe = (e) => {
     e.preventDefault(), !(S || g) && (K.current?.focus(), d(!a));
-  }, Ze = r ? Y ? Y(i, ({ index: e }) => ({ "data-index": e })) : i.map((e, t) => /* @__PURE__ */ s(dt, {
+  }, Ze = r ? Y ? Y(i, ({ index: e }) => ({ "data-index": e })) : i.map((e, t) => /* @__PURE__ */ s(ht, {
     dataTest: `selected-chip-${c(e)}`,
     label: c(e),
     readOnly: g,
@@ -134,7 +134,7 @@ function Ut({ dataTest: l, options: b, renderInput: me, value: N, onChange: A, g
         className: "invisible flex min-h-6 min-w-6 cursor-pointer items-center justify-center rounded-full border-0 bg-delta-50 group-focus-within:visible",
         onMouseDown: (e) => e.preventDefault(),
         onClick: ae,
-        children: /* @__PURE__ */ s(at, {
+        children: /* @__PURE__ */ s(pt, {
           width: 20,
           height: 20,
           className: "text-delta-700"
@@ -149,11 +149,11 @@ function Ut({ dataTest: l, options: b, renderInput: me, value: N, onChange: A, g
         className: "flex cursor-pointer items-center border-0 bg-transparent",
         onMouseDown: (e) => e.preventDefault(),
         onClick: Xe,
-        children: Ie ?? (r ? /* @__PURE__ */ s(ct, {
+        children: Ie ?? (r ? /* @__PURE__ */ s(mt, {
           width: 24,
           height: 24,
           className: "text-delta-700"
-        }) : /* @__PURE__ */ s(nt, {
+        }) : /* @__PURE__ */ s(ut, {
           width: 24,
           height: 24,
           className: _(U["select-custom-icon"], a && U["select-custom-icon-open"], "text-delta-700")
@@ -208,7 +208,7 @@ function Ut({ dataTest: l, options: b, renderInput: me, value: N, onChange: A, g
           decorative: !0
         }) : /* @__PURE__ */ s("span", {
           className: "w-5",
-          children: n.selected && /* @__PURE__ */ s(it, {
+          children: n.selected && /* @__PURE__ */ s(ft, {
             width: 20,
             height: 20,
             className: "text-gama-500"
@@ -252,9 +252,9 @@ function Ut({ dataTest: l, options: b, renderInput: me, value: N, onChange: A, g
       root: ne,
       children: /* @__PURE__ */ I("ul", {
         ref: qe,
-        ...z ? ut : {},
+        ...z ? nt : {},
         style: {
-          ...z ? pt : {},
+          ...z ? at : {},
           ...Ue,
           width: ze ?? void 0,
           maxHeight: ee ?? void 0,

package/dist/components/navigation/link/StyledLink.js

@@ -1,40 +1,67 @@
-import l from "./StyledLink.module.js";
-import s from "clsx";
+import { StyledTooltip as D } from "../../data-display/tooltip/StyledTooltip.js";
+import e from "./StyledLink.module.js";
+import k from "clsx";
 import "react";
-import { jsxs as i } from "react/jsx-runtime";
-var g = ({ href: d, disabled: n, size: u = "large", dataTest: m, reflink: y, className: t, content: a, contentNode: r, onClick: c, ...k }) => {
-  let e = l["styled-link-large"];
-  switch (u) {
+import { jsx as g, jsxs as o } from "react/jsx-runtime";
+var v = ({ href: y, disabled: l, disabledReason: d, size: p = "large", dataTest: m, reflink: u, className: r, content: n, contentNode: s, onClick: x, ...i }) => {
+  let a = e["styled-link-large"];
+  switch (p) {
     case "large":
-      e = l["styled-link-large"];
+      a = e["styled-link-large"];
       break;
     case "small":
-      e = l["styled-link-small"];
+      a = e["styled-link-small"];
       break;
     case "xs":
-      e = l["styled-link-xs"];
+      a = e["styled-link-xs"];
       break;
   }
-  return n ? /* @__PURE__ */ i("span", {
-    className: s(l["styled-link"], l["styled-link-disabled"], e, t),
-    children: [a, r]
-  }) : d ? /* @__PURE__ */ i("a", {
-    ...k,
+  if (l && !d) return /* @__PURE__ */ o("span", {
+    className: k(e["styled-link"], e["styled-link-disabled"], a, r),
+    children: [n, s]
+  });
+  const c = (t) => /* @__PURE__ */ g(D, {
+    title: d,
+    open: l ? void 0 : !1,
+    openOnTap: !!l,
+    persistentDescription: !!l,
+    children: t
+  }), f = (t) => {
+    if (l) {
+      t.preventDefault();
+      return;
+    }
+    x?.(t);
+  };
+  return c(y ? /* @__PURE__ */ o("a", {
+    ...i,
     "data-testid": m,
-    ref: y,
-    href: d,
-    className: s(l["styled-link"], "asma-touch-ready", e, t),
-    children: [a, r]
-  }) : /* @__PURE__ */ i("button", {
-    ...k,
+    ref: u,
+    href: l ? void 0 : y,
+    role: l ? "link" : i.role,
+    "aria-disabled": l ? !0 : i["aria-disabled"],
+    tabIndex: l ? 0 : i.tabIndex,
+    onClick: f,
+    onKeyDown: (t) => {
+      if (l && t.key === "Enter") {
+        t.preventDefault();
+        return;
+      }
+      i.onKeyDown?.(t);
+    },
+    className: k(e["styled-link"], l ? e["styled-link-disabled"] : "asma-touch-ready", a, r),
+    children: [n, s]
+  }) : /* @__PURE__ */ o("button", {
+    ...i,
     "data-testid": m,
-    ref: y,
+    ref: u,
     type: "button",
-    onClick: c,
-    className: s(l["styled-link"], l["styled-link-button"], "asma-touch-ready", e, t),
-    children: [a, r]
-  });
+    "aria-disabled": l ? !0 : i["aria-disabled"],
+    onClick: f,
+    className: k(e["styled-link"], e["styled-link-button"], l ? e["styled-link-disabled"] : "asma-touch-ready", a, r),
+    children: [n, s]
+  }));
 };
 export {
-  g as StyledLink
+  v as StyledLink
 };

package/dist/components/navigation/link/StyledLink.module.js

@@ -1,10 +1,10 @@
 var l = {
-  "styled-link": "_styled-link_1au3b_1",
-  "styled-link-disabled": "_styled-link-disabled_1au3b_14",
-  "styled-link-button": "_styled-link-button_1au3b_30",
-  "styled-link-xs": "_styled-link-xs_1au3b_35",
-  "styled-link-small": "_styled-link-small_1au3b_40",
-  "styled-link-large": "_styled-link-large_1au3b_45"
+  "styled-link": "_styled-link_ttb58_1",
+  "styled-link-disabled": "_styled-link-disabled_ttb58_14",
+  "styled-link-button": "_styled-link-button_ttb58_37",
+  "styled-link-xs": "_styled-link-xs_ttb58_42",
+  "styled-link-small": "_styled-link-small_ttb58_47",
+  "styled-link-large": "_styled-link-large_ttb58_52"
 };
 export {
   l as default

package/dist/components/navigation/menu/StyledMenuItem.js

@@ -1,51 +1,56 @@
-import { cn as i } from "../../../helpers/cn.js";
-import { resolveSx as w } from "../../../helpers/sx.js";
-import { StyledCheckbox as D } from "../../inputs/checkbox/base-ui/StyledCheckbox.js";
-import { StyledTooltip as g } from "../../data-display/tooltip/StyledTooltip.js";
-import { Children as k, isValidElement as A } from "react";
+import { cn as s } from "../../../helpers/cn.js";
+import { resolveSx as A } from "../../../helpers/sx.js";
+import { StyledTooltip as E } from "../../data-display/tooltip/StyledTooltip.js";
+import { StyledCheckbox as _ } from "../../inputs/checkbox/base-ui/StyledCheckbox.js";
+import { Children as C, isValidElement as S } from "react";
 import { jsx as u } from "react/jsx-runtime";
-var p = {
+var c = {
   en: "Already added",
   no: "Allerede lagt til"
-}, E = () => (typeof document > "u" ? "" : document.documentElement.lang).toLowerCase().startsWith("en") ? p.en : p.no, c = (r) => {
+}, L = () => (typeof document > "u" ? "" : document.documentElement.lang).toLowerCase().startsWith("en") ? c.en : c.no, f = (a) => {
   let t = !1;
-  return k.forEach(r, (o) => {
-    if (t || !A(o)) return;
-    if (o.type === D) {
+  return C.forEach(a, (o) => {
+    if (t || !S(o)) return;
+    if (o.type === _) {
       const e = o.props;
       t = e.checked === !0 && e.disabled === !0;
       return;
     }
-    const a = o.props.children;
-    a !== void 0 && c(a) && (t = !0);
+    const n = o.props.children;
+    n !== void 0 && f(n) && (t = !0);
   }), t;
-}, j = ({ children: r, onClick: t, onMouseDown: o, onMouseUp: a, disabled: e, selected: l, dense: f, tooltip: y, className: v, classes: d, sx: x, "data-test": h, "data-testid": b, value: _ }) => {
-  const s = /* @__PURE__ */ u("li", {
+}, H = ({ children: a, onClick: t, onMouseDown: o, onMouseUp: n, disabled: e, disabledReason: l, "aria-busy": v, selected: d, dense: y, tooltip: x, className: h, classes: p, sx: b, "data-test": D, "data-testid": w, value: M }) => {
+  const g = (i) => {
+    e || (i.key === "Enter" || i.key === " ") && (i.preventDefault(), t?.(i));
+  }, r = !!e && !!l, k = /* @__PURE__ */ u("li", {
     role: "menuitem",
     "aria-disabled": e ? !0 : void 0,
+    "aria-busy": v ? !0 : void 0,
+    "data-has-reason": r ? "" : void 0,
     tabIndex: -1,
-    "data-test": h,
-    "data-testid": b,
+    "data-test": D,
+    "data-testid": w,
     onClick: e ? void 0 : t,
     onMouseDown: e ? void 0 : o,
-    onMouseUp: e ? void 0 : a,
-    onKeyDown: (n) => {
-      e || (n.key === "Enter" || n.key === " ") && (n.preventDefault(), t?.(n));
-    },
-    className: i("box-border flex items-center px-4 text-base outline-none focus-visible:shadow-[inset_3px_0_var(--colors-focus-ring)]", f ? "min-h-8 py-1" : "min-h-10 py-2", "asma-pressable asma-touch-target", e ? "cursor-not-allowed text-delta-300 aria-disabled:text-delta-300" : i("cursor-pointer text-delta-700", !l && "hover:bg-delta-50"), l && i("bg-gama-50", d?.selected), d?.root, v),
+    onMouseUp: e ? void 0 : n,
+    onKeyDown: g,
+    className: s("box-border flex items-center px-4 text-base outline-none focus-visible:shadow-[inset_3px_0_var(--colors-focus-ring)]", y ? "min-h-8 py-1" : "min-h-10 py-2", "asma-pressable asma-touch-target", e ? "cursor-not-allowed text-delta-300 aria-disabled:text-delta-300" : s("cursor-pointer text-delta-700", !d && "hover:bg-delta-50"), d && s("bg-gama-50", p?.selected), p?.root, h),
     style: {
       fontFamily: "Roboto, Helvetica, Arial, sans-serif",
-      ...w(x)
+      ...A(b)
     },
-    children: r
-  }), m = y ?? (c(r) ? E() : void 0);
-  return m ? /* @__PURE__ */ u(g, {
+    children: a
+  }), m = r ? l : x ?? (f(a) ? L() : void 0);
+  return /* @__PURE__ */ u(E, {
     title: m,
-    arrow: !0,
-    placement: "top",
-    children: s
-  }) : s;
+    open: m ? void 0 : !1,
+    arrow: !r,
+    placement: r ? "left" : "top",
+    openOnTap: r,
+    persistentDescription: r,
+    children: k
+  });
 };
 export {
-  j as StyledMenuItem
+  H as StyledMenuItem
 };

package/dist/components/navigation/tabs/StyledTab.js

@@ -1,38 +1,36 @@
-import { cn as g } from "../../../helpers/cn.js";
-import { resolveSx as v } from "../../../helpers/sx.js";
-import { StyledTooltip as y } from "../../data-display/tooltip/StyledTooltip.js";
-import { useTabsContext as _ } from "./TabsContext.js";
-import { useCallback as w, useId as S } from "react";
-import { Fragment as T, jsx as i, jsxs as k } from "react/jsx-runtime";
-var A = ({ value: l, label: d, disabled: o, tooltip: s, className: n, sx: b, index: f }) => {
-  const e = _(), p = S(), c = s ? `${p}-reason` : void 0, t = l !== void 0 ? l : f, r = e ? e.value === t : !1, x = /\btext-(?:xs|sm|base|lg|xl|\[)/.test(n ?? ""), u = /\bfont-(?:thin|extralight|light|normal|medium|semibold|bold|extrabold|black)\b/.test(n ?? ""), h = /\b(?:uppercase|lowercase|capitalize|normal-case)\b/.test(n ?? ""), m = /* @__PURE__ */ i("button", {
-    ref: w((a) => {
-      e?.register(t, a);
-    }, [e, t]),
+import { cn as y } from "../../../helpers/cn.js";
+import { resolveSx as _ } from "../../../helpers/sx.js";
+import { StyledTooltip as w } from "../../data-display/tooltip/StyledTooltip.js";
+import { useTabsContext as T } from "./TabsContext.js";
+import { useCallback as S } from "react";
+import { jsx as c } from "react/jsx-runtime";
+var A = ({ value: i, label: m, disabled: t, disabledReason: l, tooltip: p, className: n, sx: f, index: x }) => {
+  const e = T(), o = i !== void 0 ? i : x, r = e ? e.value === o : !1, b = /\btext-(?:xs|sm|base|lg|xl|\[)/.test(n ?? ""), u = /\bfont-(?:thin|extralight|light|normal|medium|semibold|bold|extrabold|black)\b/.test(n ?? ""), h = /\b(?:uppercase|lowercase|capitalize|normal-case)\b/.test(n ?? ""), d = S((a) => {
+    e?.register(o, a);
+  }, [e, o]), s = t && l ? l : p, v = !!t && !!s, g = /* @__PURE__ */ c("button", {
+    ref: d,
     type: "button",
     role: "tab",
     "aria-selected": r,
-    "aria-disabled": o ? !0 : void 0,
-    "aria-describedby": c,
+    "aria-disabled": t ? !0 : void 0,
     tabIndex: r ? 0 : -1,
-    "data-tab-value": typeof t == "string" || typeof t == "number" ? String(t) : void 0,
-    onClick: (a) => !o && e?.onSelect(a, t),
-    className: g("inline-flex min-h-12 min-w-[90px] shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-t-lg border-0 bg-transparent px-4 py-3 tracking-normal outline-none transition-colors", !x && (e?.size === "small" ? "text-base" : "text-lg"), !u && (e?.size === "small" || r || o ? "font-semibold" : "font-medium hover:font-semibold focus-visible:font-semibold"), !h && "normal-case", e?.size === "small" && "min-h-10 px-3 py-2", "asma-pressable", o ? "text-delta-300" : r ? "text-gama-500" : "text-delta-600", o ? "cursor-not-allowed" : "cursor-pointer", "focus-visible:shadow-[inset_0_0_0_3px_var(--colors-focus-ring)]", !o && !r && "hover:shadow-[inset_0_-3px_0_0_var(--colors-delta-300)]", n),
+    "data-tab-value": typeof o == "string" || typeof o == "number" ? String(o) : void 0,
+    onClick: (a) => !t && e?.onSelect(a, o),
+    className: y("inline-flex min-h-12 min-w-[90px] shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-t-lg border-0 bg-transparent px-4 py-3 tracking-normal outline-none transition-colors", !b && (e?.size === "small" ? "text-base" : "text-lg"), !u && (e?.size === "small" || r || t ? "font-semibold" : "font-medium hover:font-semibold focus-visible:font-semibold"), !h && "normal-case", e?.size === "small" && "min-h-10 px-3 py-2", "asma-pressable", t ? "text-delta-300" : r ? "text-gama-500" : "text-delta-600", t ? "cursor-not-allowed" : "cursor-pointer", "focus-visible:shadow-[inset_0_0_0_3px_var(--colors-focus-ring)]", !t && !r && "hover:shadow-[inset_0_-3px_0_0_var(--colors-delta-300)]", n),
     style: {
       fontFamily: "Roboto, Helvetica, Arial, sans-serif",
-      ...v(b)
+      ..._(f)
     },
-    children: d
+    children: m
   });
-  return s ? /* @__PURE__ */ i(y, {
+  return /* @__PURE__ */ c(w, {
     title: s,
+    open: s ? void 0 : !1,
     arrow: !0,
-    children: /* @__PURE__ */ k(T, { children: [m, /* @__PURE__ */ i("span", {
-      id: c,
-      hidden: !0,
-      children: s
-    })] })
-  }) : m;
+    openOnTap: v,
+    persistentDescription: !!s,
+    children: g
+  });
 };
 export {
   A as StyledTab

package/dist/components/utils/bottom-sheet/StyledBottomSheet.js

@@ -1,7 +1,7 @@
 import { cn as n } from "../../../helpers/cn.js";
-import { CloseIcon as A } from "../../icons/close-icon/CloseIcon.js";
-import { IndeterminateIcon as H } from "../../icons/indeterminate-icon/IndeterminateIcon.js";
-import { registerOpenModalDialog as q } from "../../../hooks/useTopLayer.hook.js";
+import { registerOpenModalDialog as A } from "../../../hooks/useTopLayer.hook.js";
+import { CloseIcon as H } from "../../icons/close-icon/CloseIcon.js";
+import { IndeterminateIcon as q } from "../../icons/indeterminate-icon/IndeterminateIcon.js";
 import { StyledButton as I } from "../../inputs/button/StyledButton.js";
 import { useShortViewportMediaQuery as G } from "../../../hooks/useMediaQuery.hook.js";
 import { useDebouncedValue as P } from "../../../hooks/useDebouncedValue.hook.js";
@@ -26,7 +26,7 @@ var te = 500, xe = ({ dataTest: r, id: D, open: a, onClose: o, title: s, ariaLab
     v.current = document.activeElement instanceof HTMLElement ? document.activeElement : null, e.open || e.showModal(), e.focus({ preventScroll: !0 });
     const U = requestAnimationFrame(() => {
       y(!0);
-    }), V = q(e);
+    }), V = A(e);
     return () => {
       cancelAnimationFrame(U), V(), y(!1), e.open && e.close();
       const E = v.current;
@@ -87,12 +87,12 @@ var te = 500, xe = ({ dataTest: r, id: D, open: a, onClose: o, title: s, ariaLab
                 onClick: () => {
                   o("closeButton");
                 },
-                startIcon: /* @__PURE__ */ t(A, {
+                startIcon: /* @__PURE__ */ t(H, {
                   width: 24,
                   height: 24
                 })
               }),
-              /* @__PURE__ */ t(H, {
+              /* @__PURE__ */ t(q, {
                 "aria-hidden": "true",
                 focusable: "false",
                 width: 24,

package/dist/components/utils/copy-wrapper/CopyButton.js

@@ -1,12 +1,12 @@
-import { ContentCopyIcon as c } from "../../icons/content-copy-icon/ContentCopyIcon.js";
-import { StyledTooltip as d } from "../../data-display/tooltip/StyledTooltip.js";
+import { StyledTooltip as c } from "../../data-display/tooltip/StyledTooltip.js";
+import { ContentCopyIcon as d } from "../../icons/content-copy-icon/ContentCopyIcon.js";
 import { StyledButton as m } from "../../inputs/button/StyledButton.js";
 import { useMobileMediaQuery as h } from "../../../hooks/useMediaQuery.hook.js";
 import "react";
 import { jsx as t } from "react/jsx-runtime";
 var g = ({ className: n, contentToCopy: p, locale: r, messageInfo: a, text: e }) => {
   const i = r === "en" ? "Copy" : "Kopier", l = h();
-  return /* @__PURE__ */ t(d, {
+  return /* @__PURE__ */ t(c, {
     title: i,
     children: /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(m, {
       dataTest: "copy-button",
@@ -14,7 +14,7 @@ var g = ({ className: n, contentToCopy: p, locale: r, messageInfo: a, text: e })
       className: n,
       size: "small",
       variant: "text",
-      startIcon: /* @__PURE__ */ t(c, {
+      startIcon: /* @__PURE__ */ t(d, {
         width: 20,
         height: 20
       }),

package/dist/components/utils/copy-wrapper/CopyWrapper.js

@@ -1,13 +1,13 @@
 import { cn as m } from "../../../helpers/cn.js";
-import { ContentCopyIcon as s } from "../../icons/content-copy-icon/ContentCopyIcon.js";
-import { StyledTooltip as c } from "../../data-display/tooltip/StyledTooltip.js";
+import { StyledTooltip as s } from "../../data-display/tooltip/StyledTooltip.js";
+import { ContentCopyIcon as c } from "../../icons/content-copy-icon/ContentCopyIcon.js";
 import { StyledButton as d } from "../../inputs/button/StyledButton.js";
 import e from "./CopyWrapper.module.js";
 import "react";
 import { jsx as t, jsxs as h } from "react/jsx-runtime";
 var b = ({ className: i, contentToCopy: p, locale: o, messageInfo: a, children: n }) => /* @__PURE__ */ h("div", {
   className: m("flex items-center hover:text-gama-500", e["copy-wrapper"], i),
-  children: [n, /* @__PURE__ */ t(c, {
+  children: [n, /* @__PURE__ */ t(s, {
     title: o === "no" ? "Kopier" : "Copy",
     children: /* @__PURE__ */ t("div", {
       className: e["hidden-copy"],
@@ -22,7 +22,7 @@ var b = ({ className: i, contentToCopy: p, locale: o, messageInfo: a, children:
             a(o === "no" ? "Kopiert til utklippstavle" : "Copied to clipboard");
           }).catch((l) => console.error("Copying failed with this: ", l));
         },
-        startIcon: /* @__PURE__ */ t(s, {
+        startIcon: /* @__PURE__ */ t(c, {
           width: 20,
           height: 20
         })