@altinn/altinn-components 0.52.7 → 0.53.0

package/dist/components/Timeline/TimelineFooter.js

@@ -1,19 +1,20 @@
 import { jsx as i } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import { Byline as l } from "../Byline/Byline.js";
 import "../RootProvider/RootProvider.js";
 import { TimelineBase as n } from "./TimelineBase.js";
 import "../Snackbar/useSnackbar.js";
 import { S as f } from "../../CircleFill-yFbEHBRX.js";
-const F = ({
+const S = ({
   loading: r,
   as: o = "li",
-  color: e = "neutral",
-  icon: m = f,
+  color: m = "neutral",
+  icon: e = f,
   iconColor: t,
   children: p
-}) => /* @__PURE__ */ i(n, { loading: r, as: o, icon: m, color: e, iconColor: t, border: "hidden", children: /* @__PURE__ */ i(l, { loading: r, children: p }) });
+}) => /* @__PURE__ */ i(n, { loading: r, as: o, icon: e, color: m, iconColor: t, border: "hidden", children: /* @__PURE__ */ i(l, { loading: r, children: p }) });
 export {
-  F as TimelineFooter
+  S as TimelineFooter
 };

package/dist/components/Timeline/TimelineHeader.js

@@ -2,6 +2,7 @@ import { jsxs as m, jsx as e } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import { Skeleton as c } from "../Skeleton/Skeleton.js";
+import "../Button/Button.js";
 import { Byline as a } from "../Byline/Byline.js";
 import "../RootProvider/RootProvider.js";
 import { TimelineIcon as l } from "./TimelineIcon.js";
@@ -11,10 +12,10 @@ import '../../assets/TimelineHeader.css';const p = "_header_177gq_1", h = "_side
   header: p,
   sidebar: h,
   content: _
-}, z = ({ as: t = "li", loading: i, color: o, icon: s, children: n }) => /* @__PURE__ */ m(d, { as: t, className: r.header, color: o, children: [
+}, T = ({ as: t = "li", loading: i, color: o, icon: s, children: n }) => /* @__PURE__ */ m(d, { as: t, className: r.header, color: o, children: [
   /* @__PURE__ */ e("aside", { className: r.sidebar, children: /* @__PURE__ */ e(c, { variant: "circle", loading: i, children: /* @__PURE__ */ e(l, { icon: s, theme: "base", size: "lg" }) }) }),
   /* @__PURE__ */ e("div", { className: r.content, children: /* @__PURE__ */ e(a, { loading: i, size: "lg", children: n }) })
 ] });
 export {
-  z as TimelineHeader
+  T as TimelineHeader
 };

package/dist/components/Timeline/TimelineIcon.js

@@ -1,9 +1,10 @@
 import { jsx as t } from "react/jsx-runtime";
-import { isValidElement as n } from "react";
+import { isValidElement as p } from "react";
 import "../../index-p1eeF8LQ.js";
-import { Icon as s, isIconProps as p } from "../Icon/Icon.js";
+import { Icon as s, isIconProps as n } from "../Icon/Icon.js";
 import { isAvatarProps as l, Avatar as f } from "../Avatar/Avatar.js";
 import { isAvatarGroupProps as c, AvatarGroup as u } from "../Avatar/AvatarGroup.js";
+import "../Button/Button.js";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
 import { S as d } from "../../XMark-tKk6aExO.js";
@@ -11,9 +12,9 @@ import '../../assets/TimelineIcon.css';const g = "_icon_13w5g_1", a = {
   icon: g
 };
 function v(o) {
-  return typeof o == "string" || typeof o == "number" || typeof o == "boolean" || o === null || n(o);
+  return typeof o == "string" || typeof o == "number" || typeof o == "boolean" || o === null || p(o);
 }
-const x = ({ loading: o, size: e, color: i, theme: m, icon: r }) => r ? o ? /* @__PURE__ */ t(s, { className: a.icon, svgElement: d, loading: !0 }) : /* @__PURE__ */ t("div", { className: a.icon, "data-color": i, "data-size": e, children: l(r) && /* @__PURE__ */ t(f, { ...r }) || c(r) && /* @__PURE__ */ t(u, { ...r, className: a.avatarGroup }) || p(r) && /* @__PURE__ */ t(s, { ...r, theme: m }) || v(r) && r || /* @__PURE__ */ t(s, { theme: m, svgElement: r }) }) : null;
+const S = ({ loading: o, size: i, color: e, theme: m, icon: r }) => r ? o ? /* @__PURE__ */ t(s, { className: a.icon, svgElement: d, loading: !0 }) : /* @__PURE__ */ t("div", { className: a.icon, "data-color": e, "data-size": i, children: l(r) && /* @__PURE__ */ t(f, { ...r }) || c(r) && /* @__PURE__ */ t(u, { ...r, className: a.avatarGroup }) || n(r) && /* @__PURE__ */ t(s, { ...r, theme: m }) || v(r) && r || /* @__PURE__ */ t(s, { theme: m, svgElement: r }) }) : null;
 export {
-  x as TimelineIcon
+  S as TimelineIcon
 };

package/dist/components/Timeline/TimelineSection.js

@@ -2,12 +2,13 @@ import { jsxs as a, jsx as t } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import { Typography as c } from "../Typography/Typography.js";
+import "../Button/Button.js";
 import { Byline as j } from "../Byline/Byline.js";
 import "../RootProvider/RootProvider.js";
 import { TimelineBase as l } from "./TimelineBase.js";
 import "../Snackbar/useSnackbar.js";
 import { Section as u } from "../Page/Section.js";
-const q = ({
+const v = ({
   loading: o,
   unread: p,
   level: e,
@@ -36,5 +37,5 @@ const q = ({
   }
 );
 export {
-  q as TimelineSection
+  v as TimelineSection
 };

package/dist/components/Timeline/TimelineSegment.js

@@ -1,29 +1,30 @@
 import { jsx as i, jsxs as S } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import { Byline as a } from "../Byline/Byline.js";
 import "../RootProvider/RootProvider.js";
 import { TimelineBase as h } from "./TimelineBase.js";
 import "../Snackbar/useSnackbar.js";
 import { Section as x } from "../Page/Section.js";
 import { S as d } from "../../CircleFill-yFbEHBRX.js";
-const q = ({
+const w = ({
   loading: r,
   unread: m,
   datetime: t,
   byline: o,
   icon: e = d,
-  color: l,
-  spacing: p = 2,
+  color: p,
+  spacing: l = 2,
   margin: n = "bottom",
   children: c,
   id: s,
   footer: j,
   ...f
-}) => /* @__PURE__ */ i(h, { loading: r, color: m ? l : "neutral", icon: e, as: "li", ...f, id: s, children: /* @__PURE__ */ S(x, { margin: n, spacing: p, children: [
+}) => /* @__PURE__ */ i(h, { loading: r, color: m ? p : "neutral", icon: e, as: "li", ...f, id: s, children: /* @__PURE__ */ S(x, { margin: n, spacing: l, children: [
   o && /* @__PURE__ */ i(a, { loading: r, datetime: t, children: o }),
   c
 ] }) });
 export {
-  q as TimelineSegment
+  w as TimelineSegment
 };

package/dist/components/Timeline/index.js

@@ -1,4 +1,4 @@
-import { Timeline as o } from "./Timeline.js";
+import { Timeline as i } from "./Timeline.js";
 import { TimelineSegment as m } from "./TimelineSegment.js";
 import { TimelineActivity as n } from "./TimelineActivity.js";
 import { TimelineBase as l } from "./TimelineBase.js";
@@ -6,15 +6,13 @@ import { TimelineSection as x } from "./TimelineSection.js";
 import { TimelineHeader as c } from "./TimelineHeader.js";
 import { TimelineFooter as S } from "./TimelineFooter.js";
 import { TimelineIcon as g } from "./TimelineIcon.js";
-import { TimelineLink as s } from "./TimelineLink.js";
 export {
-  o as Timeline,
+  i as Timeline,
   n as TimelineActivity,
   l as TimelineBase,
   S as TimelineFooter,
   c as TimelineHeader,
   g as TimelineIcon,
-  s as TimelineLink,
   x as TimelineSection,
   m as TimelineSegment
 };

package/dist/components/Toolbar/ToolbarAccountMenu.js

@@ -1,45 +1,46 @@
-import { jsxs as T, jsx as c } from "react/jsx-runtime";
-import { createElement as g } from "react";
+import { jsxs as g, jsx as i } from "react/jsx-runtime";
+import { createElement as x } from "react";
 import "../../index-p1eeF8LQ.js";
-import { AccountMenu as x } from "../Account/AccountMenu.js";
+import { AccountMenu as T } from "../Account/AccountMenu.js";
 import { useIsDesktop as b } from "../../hooks/useIsDesktop.js";
+import "../Button/Button.js";
 import { useRootContext as k } from "../RootProvider/RootProvider.js";
-import { DrawerOrDropdown as I } from "../Dropdown/DrawerOrDropdown.js";
+import { DrawerOrDropdown as h } from "../Dropdown/DrawerOrDropdown.js";
 import "../Snackbar/useSnackbar.js";
-import { ToolbarButton as h } from "./ToolbarButton.js";
-import { ToolbarFilterBase as w } from "./ToolbarFilterBase.js";
-const O = ({
+import { ToolbarButton as w } from "./ToolbarButton.js";
+import { ToolbarFilterBase as B } from "./ToolbarFilterBase.js";
+const R = ({
   currentAccount: e,
   id: n = "toolbar-accounts",
-  onSelectAccount: i,
+  onSelectAccount: c,
   buttonTestId: l,
   title: m = "Endre aktør",
   ...p
 }) => {
   const { currentId: a, toggleId: d, closeAll: r } = k(), u = b(), f = () => d(n), o = a === n;
-  return /* @__PURE__ */ T(w, { expanded: o, onBlurCapture: (t) => {
+  return /* @__PURE__ */ g(B, { expanded: o, onBlurCapture: (t) => {
     const s = t.relatedTarget;
     (!s || !t.currentTarget.contains(s)) && r();
-  }, dataTestId: "filter-base-accounts", children: [
-    /* @__PURE__ */ c(
-      h,
+  }, "data-testid": "filter-base-accounts", children: [
+    /* @__PURE__ */ i(
+      w,
       {
         type: "switch",
         onToggle: f,
         active: !!e,
-        dataTestId: l,
+        "data-testid": l,
         "aria-expanded": o,
         children: e?.name
       }
     ),
-    /* @__PURE__ */ c(I, { open: o, size: "lg", drawerTitle: m, onClose: r, children: /* @__PURE__ */ g(
-      x,
+    /* @__PURE__ */ i(h, { open: o, size: "lg", drawerTitle: m, onClose: r, children: /* @__PURE__ */ x(
+      T,
       {
         ...p,
         keyboardEvents: o && u,
         key: a,
         onSelectAccount: (t) => {
-          i?.(t), r();
+          c?.(t), r();
         },
         currentAccount: e
       }
@@ -47,5 +48,5 @@ const O = ({
   ] });
 };
 export {
-  O as ToolbarAccountMenu
+  R as ToolbarAccountMenu
 };

package/dist/components/Toolbar/ToolbarAdd.js

@@ -2,22 +2,23 @@ import { jsxs as c, jsx as r } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
 import { useIsDesktop as u } from "../../hooks/useIsDesktop.js";
+import "../Button/Button.js";
 import { useRootContext as f } from "../RootProvider/RootProvider.js";
 import { DrawerOrDropdown as g } from "../Dropdown/DrawerOrDropdown.js";
 import { Menu as x } from "../Menu/Menu.js";
 import "../Snackbar/useSnackbar.js";
 import { ToolbarButton as T } from "./ToolbarButton.js";
 import { ToolbarFilterBase as B } from "./ToolbarFilterBase.js";
-const v = ({ label: t = "Legg til", items: a, id: e }) => {
-  const { currentId: l, closeAll: n, toggleId: d } = f(), o = l === e, m = () => d(e), s = u();
+const E = ({ label: t = "Legg til", items: a, id: e }) => {
+  const { currentId: l, closeAll: n, toggleId: m } = f(), o = l === e, d = () => m(e), s = u();
   return /* @__PURE__ */ c(B, { expanded: o, onBlurCapture: (p) => {
     const i = p.relatedTarget;
     s && (!i || !p.currentTarget.contains(i)) && n();
   }, children: [
-    /* @__PURE__ */ r(T, { type: "add", onToggle: m, "aria-expanded": o, children: t }),
+    /* @__PURE__ */ r(T, { type: "add", onToggle: d, "aria-expanded": o, children: t }),
     /* @__PURE__ */ r(g, { drawerTitle: t, open: o, onClose: n, children: /* @__PURE__ */ r(x, { color: "neutral", items: a, keyboardEvents: o && s }) })
   ] });
 };
 export {
-  v as ToolbarAdd
+  E as ToolbarAdd
 };

package/dist/components/Toolbar/ToolbarButton.js

@@ -1,109 +1,115 @@
 "use client";
-import { jsx as d } from "react/jsx-runtime";
+import { jsxs as s, jsx as i } from "react/jsx-runtime";
+import { Button as f } from "../Button/Button.js";
 import "../../index-p1eeF8LQ.js";
-import i, { forwardRef as s } from "react";
+import a, { forwardRef as p } from "react";
 import "../RootProvider/RootProvider.js";
 import "../Snackbar/useSnackbar.js";
-import { Button as c } from "../Button/Button.js";
-import { ComboButton as y } from "../Button/ComboButton.js";
-import { S as w } from "../../XMark-tKk6aExO.js";
-import { u as p } from "../../useId-BVFxCjkq.js";
-import '../../assets/ToolbarButton.css';var O = function(t, n) {
-  var o = {};
-  for (var e in t) Object.prototype.hasOwnProperty.call(t, e) && n.indexOf(e) < 0 && (o[e] = t[e]);
+import { ButtonGroup as h } from "../Button/ButtonGroup.js";
+import { ButtonGroupDivider as w } from "../Button/ButtonGroupDivider.js";
+import { S as O } from "../../XMark-tKk6aExO.js";
+import { u as v } from "../../useId-BVFxCjkq.js";
+import '../../assets/ToolbarButton.css';var g = function(t, o) {
+  var l = {};
+  for (var e in t) Object.prototype.hasOwnProperty.call(t, e) && o.indexOf(e) < 0 && (l[e] = t[e]);
   if (t != null && typeof Object.getOwnPropertySymbols == "function")
     for (var r = 0, e = Object.getOwnPropertySymbols(t); r < e.length; r++)
-      n.indexOf(e[r]) < 0 && Object.prototype.propertyIsEnumerable.call(t, e[r]) && (o[e[r]] = t[e[r]]);
-  return o;
+      o.indexOf(e[r]) < 0 && Object.prototype.propertyIsEnumerable.call(t, e[r]) && (l[e[r]] = t[e[r]]);
+  return l;
 };
-const g = s((t, n) => {
-  var { title: o, titleId: e } = t, r = O(t, ["title", "titleId"]);
-  let l = p();
-  return l = o ? e || "title-" + l : void 0, i.createElement(
+const x = p((t, o) => {
+  var { title: l, titleId: e } = t, r = g(t, ["title", "titleId"]);
+  let n = v();
+  return n = l ? e || "title-" + n : void 0, a.createElement(
     "svg",
-    Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24", focusable: !1, role: "img", ref: n, "aria-labelledby": l }, r),
-    o ? i.createElement("title", { id: l }, o) : null,
-    i.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M12.53 4.47a.75.75 0 0 0-1.06 0l-3.5 3.5a.75.75 0 0 0 1.06 1.06L12 6.06l2.97 2.97a.75.75 0 1 0 1.06-1.06zm-3.5 10.5a.75.75 0 0 0-1.06 1.06l3.5 3.5a.75.75 0 0 0 1.06 0l3.5-3.5a.75.75 0 1 0-1.06-1.06L12 17.94z", clipRule: "evenodd" })
+    Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24", focusable: !1, role: "img", ref: o, "aria-labelledby": n }, r),
+    l ? a.createElement("title", { id: n }, l) : null,
+    a.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M12.53 4.47a.75.75 0 0 0-1.06 0l-3.5 3.5a.75.75 0 0 0 1.06 1.06L12 6.06l2.97 2.97a.75.75 0 1 0 1.06-1.06zm-3.5 10.5a.75.75 0 0 0-1.06 1.06l3.5 3.5a.75.75 0 0 0 1.06 0l3.5-3.5a.75.75 0 1 0-1.06-1.06L12 17.94z", clipRule: "evenodd" })
   );
 });
-var h = function(t, n) {
-  var o = {};
-  for (var e in t) Object.prototype.hasOwnProperty.call(t, e) && n.indexOf(e) < 0 && (o[e] = t[e]);
+var _ = function(t, o) {
+  var l = {};
+  for (var e in t) Object.prototype.hasOwnProperty.call(t, e) && o.indexOf(e) < 0 && (l[e] = t[e]);
   if (t != null && typeof Object.getOwnPropertySymbols == "function")
     for (var r = 0, e = Object.getOwnPropertySymbols(t); r < e.length; r++)
-      n.indexOf(e[r]) < 0 && Object.prototype.propertyIsEnumerable.call(t, e[r]) && (o[e[r]] = t[e[r]]);
-  return o;
+      o.indexOf(e[r]) < 0 && Object.prototype.propertyIsEnumerable.call(t, e[r]) && (l[e[r]] = t[e[r]]);
+  return l;
 };
-const x = s((t, n) => {
-  var { title: o, titleId: e } = t, r = h(t, ["title", "titleId"]);
-  let l = p();
-  return l = o ? e || "title-" + l : void 0, i.createElement(
+const j = p((t, o) => {
+  var { title: l, titleId: e } = t, r = _(t, ["title", "titleId"]);
+  let n = v();
+  return n = l ? e || "title-" + n : void 0, a.createElement(
     "svg",
-    Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24", focusable: !1, role: "img", ref: n, "aria-labelledby": l }, r),
-    o ? i.createElement("title", { id: l }, o) : null,
-    i.createElement("path", { fill: "currentColor", d: "M12.75 5.5a.75.75 0 0 0-1.5 0v5.75H5.5a.75.75 0 0 0 0 1.5h5.75v5.75a.75.75 0 0 0 1.5 0v-5.75h5.75a.75.75 0 0 0 0-1.5h-5.75z" })
+    Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", fill: "none", viewBox: "0 0 24 24", focusable: !1, role: "img", ref: o, "aria-labelledby": n }, r),
+    l ? a.createElement("title", { id: n }, l) : null,
+    a.createElement("path", { fill: "currentColor", d: "M12.75 5.5a.75.75 0 0 0-1.5 0v5.75H5.5a.75.75 0 0 0 0 1.5h5.75v5.75a.75.75 0 0 0 1.5 0v-5.75h5.75a.75.75 0 0 0 0-1.5h-5.75z" })
   );
-}), _ = "_removeButton_fxc8_1", j = {
-  removeButton: _
-}, L = ({
+}), B = "_removeButton_fxc8_1", I = {
+  removeButton: B
+}, H = ({
   type: t = "select",
-  selected: n = !1,
   removable: o = !1,
-  ariaLabel: e,
-  active: r,
-  children: l,
-  onToggle: a,
-  onRemove: v,
-  iconAltText: b,
-  dataTestId: f,
+  ariaLabel: l,
+  active: e,
+  children: r,
+  onToggle: n,
+  onRemove: b,
+  iconAltText: y,
+  "data-testid": u,
   tabIndex: m,
-  "aria-expanded": u
-}) => o ? /* @__PURE__ */ d(
-  y,
-  {
-    className: j.removeButton,
-    variant: r ? "solid" : "outline",
-    size: "xs",
-    icon: w,
-    selected: n,
-    onLabelClick: a,
-    onIconClick: v,
-    iconAltText: b,
-    ariaLabel: typeof l != "string" ? e : void 0,
-    "aria-expanded": u,
-    dataTestId: f,
-    tabIndex: m,
-    children: l
+  "aria-expanded": c
+}) => {
+  if (o) {
+    const d = e ? "tinted" : "outline";
+    return /* @__PURE__ */ s(
+      h,
+      {
+        connected: !0,
+        className: I.removeButton,
+        variant: d,
+        size: "xs",
+        "aria-expanded": c,
+        "data-testid": u,
+        tabIndex: m,
+        children: [
+          /* @__PURE__ */ i(f, { variant: d, onClick: n, children: r }),
+          /* @__PURE__ */ i(w, { variant: d }),
+          /* @__PURE__ */ i(f, { variant: d, "aria-label": y || "remove", onClick: b, children: /* @__PURE__ */ i(O, {}) })
+        ]
+      }
+    );
   }
-) : t === "add" ? /* @__PURE__ */ d(
-  c,
-  {
-    variant: "dotted",
-    size: "xs",
-    icon: x,
-    selected: n,
-    onClick: a,
-    ariaLabel: e || "add",
-    "aria-expanded": u,
-    dataTestId: f,
-    tabIndex: m,
-    children: l
-  }
-) : /* @__PURE__ */ d(
-  c,
-  {
-    dataTestId: f,
-    variant: r ? "solid" : "outline",
-    size: "xs",
-    icon: g,
-    ariaLabel: e,
-    selected: n,
-    onClick: a,
-    "aria-expanded": u,
-    reverse: !0,
-    children: l
-  }
-);
+  return t === "add" ? /* @__PURE__ */ s(
+    f,
+    {
+      variant: "outline",
+      size: "xs",
+      onClick: n,
+      "aria-label": l || "add",
+      "aria-expanded": c,
+      "data-testid": u,
+      tabIndex: m,
+      children: [
+        /* @__PURE__ */ i(j, {}),
+        /* @__PURE__ */ i("span", { children: r })
+      ]
+    }
+  ) : /* @__PURE__ */ s(
+    f,
+    {
+      "data-testid": u,
+      variant: e ? "solid" : "outline",
+      size: "xs",
+      "aria-label": l,
+      onClick: n,
+      "aria-expanded": c,
+      children: [
+        /* @__PURE__ */ i("span", { children: r }),
+        /* @__PURE__ */ i(x, {})
+      ]
+    }
+  );
+};
 export {
-  L as ToolbarButton
+  H as ToolbarButton
 };

package/dist/components/Toolbar/ToolbarDaterange.js

@@ -1,6 +1,7 @@
 import { jsxs as n, jsx as o } from "react/jsx-runtime";
 import { useState as m } from "react";
 import "../../index-p1eeF8LQ.js";
+import "../Button/Button.js";
 import { useRootContext as F } from "../RootProvider/RootProvider.js";
 import { DrawerOrDropdown as x } from "../Dropdown/DrawerOrDropdown.js";
 import { MenuInputField as p } from "../Menu/MenuInputField.js";
@@ -13,7 +14,7 @@ import '../../assets/ToolbarDaterange.css';const I = "_datepicker_ud6cb_1", N =
   datepicker: I,
   fields: N,
   description: j
-}, L = ({
+}, P = ({
   id: i = "toolbar-filter-datetange",
   title: f = "Select daterange",
   description: g = "Choose dates or click to set daterange.",
@@ -53,5 +54,5 @@ import '../../assets/ToolbarDaterange.css';const I = "_datepicker_ud6cb_1", N =
   ] });
 };
 export {
-  L as ToolbarDaterange
+  P as ToolbarDaterange
 };

package/dist/components/Toolbar/ToolbarFilter.js

@@ -1,53 +1,54 @@
-import { jsxs as C, jsx as a } from "react/jsx-runtime";
+import { jsxs as D, jsx as a } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
-import { useIsDesktop as D } from "../../hooks/useIsDesktop.js";
+import { useIsDesktop as I } from "../../hooks/useIsDesktop.js";
+import "../Button/Button.js";
 import { useRootContext as j } from "../RootProvider/RootProvider.js";
 import { DrawerOrDropdown as F } from "../Dropdown/DrawerOrDropdown.js";
 import "../Snackbar/useSnackbar.js";
 import { ToolbarButton as L } from "./ToolbarButton.js";
 import { ToolbarFilterBase as O } from "./ToolbarFilterBase.js";
 import { ToolbarOptions as R } from "./ToolbarOptions.js";
-const E = (c, t) => Array.isArray(t) ? t.join(", ") : t, N = ({
-  removable: c,
+const E = (i, t) => Array.isArray(t) ? t.join(", ") : t, P = ({
+  removable: i,
   label: t,
   name: o,
-  filterState: i,
-  options: b,
-  optionGroups: m,
-  onChange: T,
-  onRemove: y,
+  filterState: c,
+  options: m,
+  optionGroups: b,
+  onChange: y,
+  onRemove: T,
   buttonAltText: p = "Remove button",
   getSelectedLabel: g,
   showResultsLabel: x = "Show results",
   optionType: A,
   id: s = `toolbar-filter-${o}`
 }) => {
-  const { currentId: h, toggleId: v, closeAll: d } = j(), u = D(), I = (b ?? []).map((r) => {
-    const e = i?.[r.name || o];
+  const { currentId: h, toggleId: v, closeAll: d } = j(), u = I(), k = (m ?? []).map((r) => {
+    const e = c?.[r.name || o];
     return {
       name: o,
       ...r,
       checked: Array.isArray(e) ? e.includes(r.value) : r.value === e
     };
-  }), n = i?.[o], k = g?.(o, n) ?? E(o, n), f = () => v(s), l = h === s, w = (r) => {
+  }), n = c?.[o], w = g?.(o, n) ?? E(o, n), f = () => v(s), l = h === s, B = (r) => {
     const e = r.relatedTarget;
     u && (!e || !r.currentTarget.contains(e)) && d();
-  }, B = Array.isArray(n) ? n.length > 0 : typeof n < "u";
-  return /* @__PURE__ */ C(O, { expanded: l, onBlurCapture: w, dataTestId: "filter-base-" + s, children: [
+  }, C = Array.isArray(n) ? n.length > 0 : typeof n < "u";
+  return /* @__PURE__ */ D(O, { expanded: l, onBlurCapture: B, "data-testid": "filter-base-" + s, children: [
     /* @__PURE__ */ a(
       L,
       {
         type: "select",
-        removable: c,
-        active: B,
+        removable: i,
+        active: C,
         onToggle: f,
         ariaLabel: p,
         iconAltText: p,
-        onRemove: y,
-        dataTestId: s,
+        onRemove: T,
+        "data-testid": s,
         tabIndex: l ? -1 : 0,
-        children: k || t
+        children: w || t
       }
     ),
     /* @__PURE__ */ a(
@@ -64,9 +65,9 @@ const E = (c, t) => Array.isArray(t) ? t.join(", ") : t, N = ({
           R,
           {
             name: o,
-            options: I,
-            optionGroups: m,
-            onChange: T,
+            options: k,
+            optionGroups: b,
+            onChange: y,
             optionType: A,
             keyboardEvents: l && u
           }
@@ -76,5 +77,5 @@ const E = (c, t) => Array.isArray(t) ? t.join(", ") : t, N = ({
   ] });
 };
 export {
-  N as ToolbarFilter
+  P as ToolbarFilter
 };

package/dist/components/Toolbar/ToolbarFilterBase.js

@@ -1,17 +1,17 @@
-import { jsx as d } from "react/jsx-runtime";
+import { jsx as o } from "react/jsx-runtime";
 import { c as r } from "../../index-p1eeF8LQ.js";
-import '../../assets/ToolbarFilterBase.css';const c = "_base_4n04w_1", l = "_expanded_4n04w_5", e = {
+import '../../assets/ToolbarFilterBase.css';const c = "_base_4n04w_1", i = "_expanded_4n04w_5", e = {
   base: c,
-  expanded: l
-}, i = ({
+  expanded: i
+}, x = ({
   expanded: s = !1,
   children: a,
   onBlurCapture: t,
-  dataTestId: n
+  "data-testid": d
 }) => {
-  const o = r(e.base, s && e.expanded);
-  return /* @__PURE__ */ d("div", { onBlurCapture: t, className: o, "data-testid": n, children: a });
+  const n = r(e.base, s && e.expanded);
+  return /* @__PURE__ */ o("div", { onBlurCapture: t, className: n, "data-testid": d, children: a });
 };
 export {
-  i as ToolbarFilterBase
+  x as ToolbarFilterBase
 };

package/dist/components/Toolbar/ToolbarMenu.js

@@ -1,13 +1,14 @@
 import { jsxs as u, jsx as o } from "react/jsx-runtime";
 import "../../index-p1eeF8LQ.js";
 import "react";
+import "../Button/Button.js";
 import { useRootContext as f } from "../RootProvider/RootProvider.js";
 import { DrawerOrDropdown as x } from "../Dropdown/DrawerOrDropdown.js";
 import { Menu as T } from "../Menu/Menu.js";
 import "../Snackbar/useSnackbar.js";
 import { ToolbarButton as b } from "./ToolbarButton.js";
 import { ToolbarFilterBase as g } from "./ToolbarFilterBase.js";
-const v = ({
+const y = ({
   label: e,
   value: n,
   groups: m,
@@ -23,5 +24,5 @@ const v = ({
   ] });
 };
 export {
-  v as ToolbarMenu
+  y as ToolbarMenu
 };