@midas-ds/components 17.2.5 → 17.3.0

package/chunks/{ListBox-D5BBeZWL.js → ListBox-CDlOUvzJ.js}

@@ -1,7 +1,7 @@
 import { jsx as i } from "react/jsx-runtime";
-import { ListLayout as e, Virtualizer as n, ListBox as a } from "react-aria-components";
-import { c as l } from "./clsx-AexbMWKp.js";
-import '../assets/ListBox.css';class x extends e {
+import { ListLayout as e, Virtualizer as n, ListBox as l } from "react-aria-components";
+import { c as x } from "./clsx-AexbMWKp.js";
+import '../assets/ListBox.css';class B extends e {
   /**
    * When using the ListLayout our scroll container height is not calculated properly when the content is partially sectioned.
    * ```ts
@@ -25,29 +25,29 @@ import '../assets/ListBox.css';class x extends e {
     }), this.contentSize;
   }
 }
-const B = "_listBox_1vajh_4", r = "_listBoxPopover_1vajh_16", c = "_listBoxSectionHeading_1vajh_31", _ = "_listBoxButton_1vajh_43", h = "_listBoxItem_1vajh_55", m = "_textContent_1vajh_69", L = "_listBoxLoadMoreItem_1vajh_175", u = {
-  listBox: B,
-  listBoxPopover: r,
+const r = "_listBox_1k3vu_4", a = "_listBoxPopover_1k3vu_16", c = "_listBoxSectionHeading_1k3vu_31", _ = "_listBoxButton_1k3vu_43", u = "_listBoxItem_1k3vu_55", m = "_textContent_1k3vu_69", L = "_listBoxLoadMoreItem_1k3vu_175", v = {
+  listBox: r,
+  listBoxPopover: a,
   listBoxSectionHeading: c,
   listBoxButton: _,
-  listBoxItem: h,
+  listBoxItem: u,
   textContent: m,
   listBoxLoadMoreItem: L
-}, g = ({
+}, k = ({
   className: s,
   children: t,
   ...o
 }) => /* @__PURE__ */ i(
   n,
   {
-    layout: x,
+    layout: B,
     layoutOptions: {
       headingHeight: 38
     },
     children: /* @__PURE__ */ i(
-      a,
+      l,
       {
-        className: l(u.listBox, s),
+        className: x(v.listBox, s),
         ...o,
         children: t
       }
@@ -55,6 +55,6 @@ const B = "_listBox_1vajh_4", r = "_listBoxPopover_1vajh_16", c = "_listBoxSecti
   }
 );
 export {
-  g as L,
-  u as s
+  k as L,
+  v as s
 };

package/chunks/{ListBoxEmptyState-_Cn38cQ6.js → ListBoxEmptyState-CXKkWQy1.js}

@@ -1,8 +1,8 @@
 import { jsx as s } from "react/jsx-runtime";
 import { c as m } from "./clsx-AexbMWKp.js";
 import { Popover as r } from "react-aria-components";
-import { s as a } from "./ListBox-D5BBeZWL.js";
-import { T as p } from "./Text-BuXvuoqM.js";
+import { s as a } from "./ListBox-CDlOUvzJ.js";
+import { T as p } from "./Text-D0r_W4lH.js";
 import '../assets/ListBoxEmptyState.css';const n = ({
   className: t,
   children: o,
@@ -15,7 +15,7 @@ import '../assets/ListBoxEmptyState.css';const n = ({
     ...e,
     children: o
   }
-), i = "_listBoxEmptyState_18j20_1", x = {
+), i = "_listBoxEmptyState_1wxhy_1", x = {
   listBoxEmptyState: i
 }, E = ({ className: t, ...o }) => /* @__PURE__ */ s(
   p,

package/chunks/{ListBoxHeader-CL9bFH22.js → ListBoxHeader-DSYdXl2I.js}

@@ -1,6 +1,6 @@
 import { jsx as o, jsxs as m, Fragment as c } from "react/jsx-runtime";
 import { c as i } from "./clsx-AexbMWKp.js";
-import { s as e } from "./ListBox-D5BBeZWL.js";
+import { s as e } from "./ListBox-CDlOUvzJ.js";
 import { ListBoxItem as x, ListBoxSection as d, ListBoxLoadMoreItem as l, Header as L } from "react-aria-components";
 import { S as B } from "./Spinner-CfKMn18u.js";
 import { u as p } from "./useLocalizedStringFormatter-BHvsRxDk.js";

package/chunks/{Popover-BcEtFiU1.js → Popover-CaP4LFhg.js}

@@ -1,25 +1,25 @@
 import { jsxs as c, jsx as o } from "react/jsx-runtime";
 import { c as i } from "./clsx-AexbMWKp.js";
 import { Popover as v, OverlayArrow as l } from "react-aria-components";
-import '../assets/Popover.css';const n = "_popover_1wjt3_1", w = "_arrow_1wjt3_23", r = {
+import '../assets/Popover.css';const n = "_popover_1sqxu_1", m = "_arrow_1sqxu_23", r = {
   popover: n,
-  arrow: w
+  arrow: m
 };
-function d({
-  children: e,
-  className: s,
+function _({
+  children: s,
+  className: e,
   offset: p = 4,
-  hideArrow: t = !1,
-  ...a
+  hideArrow: a = !1,
+  ...t
 }) {
   return /* @__PURE__ */ c(
     v,
     {
-      ...a,
+      ...t,
       offset: p,
-      className: i(r.popover, s),
+      className: i(r.popover, e),
       children: [
-        !t && /* @__PURE__ */ o(l, { className: r.arrow, children: /* @__PURE__ */ o(
+        !a && /* @__PURE__ */ o(l, { className: r.arrow, children: /* @__PURE__ */ o(
           "svg",
           {
             width: 16,
@@ -28,11 +28,11 @@ function d({
             children: /* @__PURE__ */ o("path", { d: "M0 0 L8 8 L16 0" })
           }
         ) }),
-        e
+        s
       ]
     }
   );
 }
 export {
-  d as P
+  _ as P
 };

package/chunks/{ProgressBar-Dg0JMQ71.js → ProgressBar-acc8946-.js}

@@ -1,6 +1,6 @@
 import { jsx as s, jsxs as d, Fragment as _ } from "react/jsx-runtime";
 import { ProgressBar as f } from "react-aria-components";
-import { L as t } from "./Label-6GZmmff9.js";
+import { L as t } from "./Label-s4J9sYdy.js";
 import { c as l } from "./clsx-AexbMWKp.js";
 import '../assets/ProgressBar.css';const N = "_progressBar_1a2ad_1", g = "_label_1a2ad_9", p = "_value_1a2ad_14", v = "_bar_1a2ad_19", h = "_fill_1a2ad_29", e = {
   progressBar: N,

package/chunks/{Radio-CAIyBgBp.js → Radio-DjivEe-_.js}

@@ -2,9 +2,9 @@
 import { jsx as r, jsxs as n } from "react/jsx-runtime";
 import { Radio as u, RadioGroup as _, Group as f } from "react-aria-components";
 import { c as p } from "./clsx-AexbMWKp.js";
-import { a as G, L as R } from "./Label-6GZmmff9.js";
-import { T as h } from "./Text-BuXvuoqM.js";
-import { F as t } from "./FieldError-BMTrvSof.js";
+import { a as G, L as R } from "./Label-s4J9sYdy.js";
+import { T as h } from "./Text-D0r_W4lH.js";
+import { F as t } from "./FieldError-krpMBtie.js";
 import '../assets/Radio.css';const x = "_radioGroup_1ls9z_1", w = "_wrap_1ls9z_12", z = "_radio_1ls9z_1", s = {
   radioGroup: x,
   wrap: w,

package/chunks/{RangeCalendar-DIMxoHhy.js → RangeCalendar-LheFd9WF.js}

@@ -1,32 +1,32 @@
 import { jsx as e, jsxs as o } from "react/jsx-runtime";
-import { RangeCalendarContext as h, CalendarGrid as C, CalendarCell as g, Calendar as v, RangeCalendar as _ } from "react-aria-components";
-import { c as p, a as l } from "./clsx-AexbMWKp.js";
-import { F as c } from "./FieldError-BMTrvSof.js";
-import * as y from "react";
-import { B as i } from "./Button-CaLOUTDO.js";
-import { H as f } from "./Heading-D8tNNJkt.js";
+import { RangeCalendarContext as h, CalendarGrid as C, CalendarCell as v, Calendar as _, RangeCalendar as p } from "react-aria-components";
+import { c as y, a as l } from "./clsx-AexbMWKp.js";
+import { F as s } from "./FieldError-krpMBtie.js";
+import * as f from "react";
+import { B as i } from "./Button-BhIvfqOc.js";
+import { H as g } from "./Heading-nfcRc2QF.js";
 import { c as R } from "./createLucideIcon-CP-mMPfa.js";
 import { C as x } from "./chevron-right-DvXGOiS_.js";
-import '../assets/RangeCalendar.css';const u = [["path", { d: "m15 18-6-6 6-6", key: "1wnfg3" }]], N = R("chevron-left", u), q = "_container_eq3gc_1", I = "_calendar_eq3gc_6", $ = "_day_eq3gc_28", G = "_header_eq3gc_92", H = "_range_eq3gc_159", r = {
-  container: q,
+import '../assets/RangeCalendar.css';const u = [["path", { d: "m15 18-6-6 6-6", key: "1wnfg3" }]], N = R("chevron-left", u), b = "_container_a83bt_1", I = "_calendar_a83bt_6", $ = "_day_a83bt_28", G = "_header_a83bt_92", H = "_range_a83bt_159", r = {
+  container: b,
   calendar: I,
   day: $,
   header: G,
   range: H
-}, s = ({
+}, t = ({
   weekdayStyle: d = "short",
   isReadOnly: n
 }) => {
-  const a = !!y.useContext(h);
+  const a = !!f.useContext(h);
   return /* @__PURE__ */ e(C, { weekdayStyle: d, children: (m) => /* @__PURE__ */ e(
-    g,
+    v,
     {
       date: m,
-      className: p(r.day, a && r.range),
+      className: y(r.day, a && r.range),
       "data-readonly": n || void 0
     }
   ) });
-}, t = ({
+}, c = ({
   isDisabled: d,
   isReadOnly: n
 }) => /* @__PURE__ */ o("header", { className: r.header, children: [
@@ -40,7 +40,7 @@ import '../assets/RangeCalendar.css';const u = [["path", { d: "m15 18-6-6 6-6",
     }
   ),
   /* @__PURE__ */ e(
-    f,
+    g,
     {
       level: 3,
       elementType: "h2",
@@ -56,44 +56,44 @@ import '../assets/RangeCalendar.css';const u = [["path", { d: "m15 18-6-6 6-6",
       children: /* @__PURE__ */ e(x, {})
     }
   )
-] }), E = ({
+] }), O = ({
   className: d,
   errorMessage: n,
   ...a
 }) => /* @__PURE__ */ o("div", { className: r.container, children: [
   /* @__PURE__ */ o(
-    v,
+    _,
     {
       className: l(r.calendar, d),
       "data-readonly": a.isReadOnly || void 0,
       ...a,
       children: [
-        /* @__PURE__ */ e(t, { ...a }),
-        /* @__PURE__ */ e(s, { ...a })
+        /* @__PURE__ */ e(c, { ...a }),
+        /* @__PURE__ */ e(t, { ...a })
       ]
     }
   ),
-  /* @__PURE__ */ e(c, { isInvalid: a.isInvalid, children: n })
-] }), O = ({
+  /* @__PURE__ */ e(s, { isInvalid: a.isInvalid, children: n })
+] }), T = ({
   className: d,
   errorMessage: n,
   ...a
 }) => /* @__PURE__ */ o("div", { className: r.container, children: [
   /* @__PURE__ */ o(
-    _,
+    p,
     {
       className: l(r.calendar, d),
       "data-readonly": a.isReadOnly || void 0,
       ...a,
       children: [
-        /* @__PURE__ */ e(t, { ...a }),
-        /* @__PURE__ */ e(s, { ...a })
+        /* @__PURE__ */ e(c, { ...a }),
+        /* @__PURE__ */ e(t, { ...a })
       ]
     }
   ),
-  /* @__PURE__ */ e(c, { isInvalid: a.isInvalid, children: n })
+  /* @__PURE__ */ e(s, { isInvalid: a.isInvalid, children: n })
 ] });
 export {
-  E as C,
-  O as R
+  O as C,
+  T as R
 };

package/chunks/SearchField-1DYv0w4b.js

@@ -0,0 +1,128 @@
+'use client';
+import { jsxs as u, jsx as a } from "react/jsx-runtime";
+import { s as y } from "./TextField.module-BDIbEV87.js";
+import { B as C } from "./Button-BhIvfqOc.js";
+import { C as F } from "./ClearButton-DBr9Zfwq.js";
+import { c as l } from "./clsx-AexbMWKp.js";
+import * as N from "react";
+import { useSearchFieldState as x } from "react-stately";
+import { useSearchField as j } from "react-aria";
+import { F as f } from "./FieldError-krpMBtie.js";
+import { c as p } from "./createLucideIcon-CP-mMPfa.js";
+import { u as B } from "./useLocalizedStringFormatter-BHvsRxDk.js";
+import '../assets/SearchField.css';const D = [
+  ["path", { d: "m21 21-4.34-4.34", key: "14j7rj" }],
+  ["circle", { cx: "11", cy: "11", r: "8", key: "4ej97u" }]
+], E = p("search", D), k = "_container_19q7q_1", P = "_inner_19q7q_10", T = "_inputContainer_19q7q_15", w = "_medium_19q7q_21", I = "_icon_19q7q_26", K = "_clear_19q7q_39", L = "_input_19q7q_15", n = {
+  container: k,
+  inner: P,
+  inputContainer: T,
+  medium: w,
+  icon: I,
+  clear: K,
+  input: L
+}, M = { search: "Search" }, R = { search: "Sök" }, V = {
+  en: M,
+  sv: R
+};
+function O(r) {
+  return !!r?.length;
+}
+const Z = ({
+  errorPosition: r = "top",
+  size: i = "large",
+  ...e
+}) => {
+  const { value: t, setValue: m } = x(e), b = B(V), d = N.useRef(null), { inputProps: o, isInvalid: c, validationErrors: h, clearButtonProps: q } = j(
+    {
+      ...e,
+      label: e.placeholder,
+      validationBehavior: "native"
+    },
+    { value: t, setValue: m },
+    d
+  ), v = ({ target: s }) => m(s.value), S = () => m(""), _ = () => {
+    if (e.validate && O(e.validate(t)) || c || !t) {
+      d.current?.focus();
+      return;
+    }
+    e.onSubmit && e.onSubmit(t);
+  }, g = ({ key: s }) => {
+    s === "Enter" && _();
+  };
+  return /* @__PURE__ */ u(
+    "div",
+    {
+      className: l(n.container, e.className),
+      "data-disabled": o.disabled,
+      children: [
+        r === "top" && /* @__PURE__ */ a(f, { isInvalid: c, children: e.errorMessage ?? h.join(" ") }),
+        /* @__PURE__ */ u("div", { className: n.inner, children: [
+          /* @__PURE__ */ u(
+            "div",
+            {
+              className: l(n.inputContainer, {
+                [n.medium]: i === "medium"
+              }),
+              children: [
+                /* @__PURE__ */ a(
+                  E,
+                  {
+                    size: 20,
+                    className: n.icon
+                  }
+                ),
+                /* @__PURE__ */ a(
+                  "input",
+                  {
+                    ...o,
+                    ...o.disabled && { "data-disabled": !0 },
+                    className: l(
+                      y.input,
+                      n.input,
+                      o.className,
+                      { [n.medium]: i === "medium" }
+                    ),
+                    ref: d,
+                    onChange: v,
+                    value: t,
+                    "aria-invalid": c,
+                    onKeyDown: g,
+                    "aria-label": e.placeholder,
+                    "aria-labelledby": ""
+                  }
+                ),
+                t.length > 0 && /* @__PURE__ */ a(
+                  F,
+                  {
+                    ...q,
+                    onPress: S,
+                    size: i,
+                    className: l(n.clear, {
+                      [n.medium]: i === "medium"
+                    })
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ a(
+            C,
+            {
+              size: i,
+              isDisabled: e.isDisabled,
+              excludeFromTabOrder: !0,
+              onPress: _,
+              type: "button",
+              children: e.buttonText ? e.buttonText : b.format("search")
+            }
+          )
+        ] }),
+        r === "bottom" && /* @__PURE__ */ a(f, { isInvalid: c, children: e.errorMessage ?? h.join(" ") })
+      ]
+    }
+  );
+};
+export {
+  Z as S
+};

package/chunks/Select-CV0H13h-.js

@@ -0,0 +1,222 @@
+import { jsx as e, Fragment as V, jsxs as i } from "react/jsx-runtime";
+import { SelectStateContext as d, SelectValue as g, Button as _, TagList as A, Select as C } from "react-aria-components";
+import { FocusScope as N } from "@react-aria/focus";
+import { a as x, L as b } from "./Label-s4J9sYdy.js";
+import { a as T, c as y } from "./clsx-AexbMWKp.js";
+import { T as B } from "./Text-D0r_W4lH.js";
+import { F as h } from "./FieldError-krpMBtie.js";
+import p, { useContext as f } from "react";
+import { C as M } from "./Checkbox-sAkQe7Q9.js";
+import { u as m } from "./useLocalizedStringFormatter-BHvsRxDk.js";
+import { useFocusManager as F } from "react-aria";
+import { X as L } from "./x-B9bYxG31.js";
+import { L as I } from "./ListBox-CDlOUvzJ.js";
+import { P as G } from "./Popover-CaP4LFhg.js";
+import { a as j, T as k } from "./TagGroup-BscTXQ_E.js";
+import { C as R } from "./chevron-down-BBFYYzZq.js";
+import '../assets/Select.css';const $ = { clearAll: "Clear all", selectAll: "Select all", selectedItems: "Selected items", selected: "selected" }, w = { clearAll: "Rensa alla", selectAll: "Välj alla", selectedItems: "Valda objekt", selected: "valda" }, u = {
+  en: $,
+  sv: w
+}, P = "_select_1h0s2_1", z = "_triggerContainer_1h0s2_7", D = "_trigger_1h0s2_7", E = "_medium_1h0s2_29", K = "_icon_1h0s2_66", W = "_selectValue_1h0s2_72", X = "_placeholder_1h0s2_78", q = "_multiSelectValue_1h0s2_88", H = "_selectValueTag_1h0s2_112", J = "_clearButton_1h0s2_126", O = "_truncate_1h0s2_138", Q = "_popover_1h0s2_175", U = "_selectAll_1h0s2_201", Y = "_tagGroup_1h0s2_269", s = {
+  select: P,
+  triggerContainer: z,
+  trigger: D,
+  medium: E,
+  icon: K,
+  selectValue: W,
+  placeholder: X,
+  multiSelectValue: q,
+  selectValueTag: H,
+  clearButton: J,
+  truncate: O,
+  popover: Q,
+  selectAll: U,
+  tagGroup: Y
+}, Z = () => {
+  const t = p.useContext(d), c = m(u), r = () => t?.setValue(
+    t?.selectionManager.isSelectAll ? null : Array.from(t.collection.getKeys())
+  );
+  return /* @__PURE__ */ e(
+    M,
+    {
+      className: s.selectAll,
+      isIndeterminate: !t?.selectionManager.isSelectAll && !t?.selectionManager.isEmpty,
+      isSelected: t?.selectionManager.isSelectAll,
+      onChange: r,
+      children: c.format("selectAll")
+    }
+  );
+}, ee = ({
+  isDisabled: t
+}) => {
+  const c = m(u), r = (l, o) => l.length === 1 ? o : `${l.length} ${c.format("selected")}`;
+  return /* @__PURE__ */ e(
+    g,
+    {
+      className: s.multiSelectValue,
+      "data-disabled": t || void 0,
+      children: ({ isPlaceholder: l, selectedItems: o, selectedText: a }) => l ? /* @__PURE__ */ e(V, {}) : /* @__PURE__ */ i(
+        "div",
+        {
+          className: s.selectValueTag,
+          "data-disabled": t || void 0,
+          children: [
+            /* @__PURE__ */ e("span", { className: s.truncate, children: r(o, a) }),
+            /* @__PURE__ */ e(te, { isDisabled: t })
+          ]
+        }
+      )
+    }
+  );
+}, te = ({
+  isDisabled: t
+}) => {
+  const c = p.useContext(d), r = m(u), l = F(), o = () => {
+    l?.focusFirst(), c?.setValue(null);
+  };
+  return /* @__PURE__ */ e(
+    _,
+    {
+      "aria-label": r.format("clearAll"),
+      className: s.clearButton,
+      onPress: o,
+      slot: null,
+      isDisabled: t,
+      children: /* @__PURE__ */ e(
+        L,
+        {
+          width: 20,
+          height: 20
+        }
+      )
+    }
+  );
+}, le = ({
+  showTags: t,
+  isDisabled: c
+}) => {
+  const r = m(u), l = f(d), o = (a) => {
+    l?.selectionManager.toggleSelection(Array.from(a)[0]);
+  };
+  return !l?.selectedItems.length || !t ? null : /* @__PURE__ */ e(
+    j,
+    {
+      "aria-label": r.format("selectedItems"),
+      className: s.tagGroup,
+      onRemove: o,
+      selectionBehavior: "toggle",
+      children: /* @__PURE__ */ e(A, { items: l.selectedItems, children: (a) => /* @__PURE__ */ e(
+        k,
+        {
+          isDismissable: !0,
+          id: a.key,
+          isDisabled: c,
+          textValue: a.textValue,
+          children: a.textValue
+        },
+        a.key
+      ) })
+    }
+  );
+}, se = ({
+  isDisabled: t,
+  selectionMode: c,
+  size: r
+}) => {
+  const l = f(d);
+  return /* @__PURE__ */ i(
+    _,
+    {
+      className: T(
+        {
+          [s.medium]: r === "medium"
+        },
+        s.trigger
+      ),
+      "data-invalid": !!l?.displayValidation.isInvalid || void 0,
+      children: [
+        /* @__PURE__ */ e(
+          g,
+          {
+            className: s.selectValue,
+            "data-disabled": t || void 0,
+            children: ({ selectedText: o, defaultChildren: a }) => /* @__PURE__ */ e("div", { className: s.placeholder, children: /* @__PURE__ */ e("span", { className: s.truncate, children: c === "multiple" && o ? null : o || a }) })
+          }
+        ),
+        /* @__PURE__ */ e(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: s.icon,
+            children: /* @__PURE__ */ e(R, { size: 20 })
+          }
+        )
+      ]
+    }
+  );
+};
+function Ve({
+  children: t,
+  description: c,
+  errorMessage: r,
+  errorPosition: l = "top",
+  items: o,
+  label: a,
+  popover: S,
+  size: v = "large",
+  ...n
+}) {
+  return /* @__PURE__ */ e(N, { children: /* @__PURE__ */ i(
+    C,
+    {
+      ...n,
+      className: y(n.className, s.select),
+      children: [
+        /* @__PURE__ */ e(x, { popover: S, children: a && /* @__PURE__ */ e(b, { "data-disabled": n.isDisabled || void 0, children: a }) }),
+        c && /* @__PURE__ */ e(B, { slot: "description", children: c }),
+        l === "top" && /* @__PURE__ */ e(h, { children: r }),
+        /* @__PURE__ */ i(
+          "div",
+          {
+            className: s.triggerContainer,
+            "data-disabled": n.isDisabled || void 0,
+            children: [
+              /* @__PURE__ */ e(
+                se,
+                {
+                  size: v,
+                  ...n
+                }
+              ),
+              n.selectionMode === "multiple" ? /* @__PURE__ */ e(ee, { ...n }) : null
+            ]
+          }
+        ),
+        l === "bottom" && /* @__PURE__ */ e(h, { children: r }),
+        /* @__PURE__ */ i(
+          G,
+          {
+            className: s.popover,
+            offset: 0,
+            hideArrow: !0,
+            children: [
+              n.isSelectableAll && /* @__PURE__ */ e(Z, {}),
+              /* @__PURE__ */ e(
+                I,
+                {
+                  escapeKeyBehavior: "none",
+                  items: o,
+                  children: t
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ e(le, { ...n })
+      ]
+    }
+  ) });
+}
+export {
+  Ve as S
+};