@canonical/maas-react-components 1.24.1 → 1.25.0

package/dist/@canonical/maas-react-components.es.js

@@ -1,6 +1,6 @@
-import { jsxs as K, jsx as l, Fragment as Ae } from "react/jsx-runtime";
+import { jsxs as K, jsx as l, Fragment as Se } from "react/jsx-runtime";
 import * as oe from "react";
-import pt, { useRef as Oe, useState as ge, useEffect as _e, useCallback as Q, cloneElement as dt, createContext as mt, useId as ke, useContext as Mr, useMemo as se, useReducer as Lr, forwardRef as vt, useImperativeHandle as yt, Fragment as gt } from "react";
+import pt, { useRef as De, useState as ge, useEffect as _e, useCallback as Q, cloneElement as dt, createContext as mt, useId as ke, useContext as Mr, useMemo as se, useReducer as Lr, forwardRef as vt, useImperativeHandle as yt, Fragment as gt } from "react";
 import { useListener as bt, Link as ht, Spinner as _t, Tooltip as Et, Button as fe, Icon as we, Row as wt, Col as St, Input as Ct, Label as Tt, CheckboxInput as xt, useClickOutside as Ot, useOnEscapePressed as Dt, SearchBox as At } from "@canonical/react-components";
 function Br(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
@@ -42,7 +42,7 @@ var zr = { exports: {} };
   })();
 })(zr);
 var Pt = zr.exports;
-const B = /* @__PURE__ */ Br(Pt);
+const L = /* @__PURE__ */ Br(Pt);
 const ye = {
   caution: "#F99B11",
   light: "#F7F7F7",
@@ -77,7 +77,7 @@ const ye = {
   size: o = "regular",
   ...s
 }) => {
-  const i = Oe(null), f = t == null ? void 0 : t.reduce((C, S) => C + S.value, 0), c = n || f, v = t.map((C) => C.value / c * 100), [g, h] = ge(0);
+  const i = De(null), f = t == null ? void 0 : t.reduce((C, S) => C + S.value, 0), c = n || f, v = t.map((C) => C.value / c * 100), [g, h] = ge(0);
   _e(() => {
     h(a === "segmented" ? yr(i, c) : 0);
   }, [c, a]);
@@ -87,7 +87,7 @@ const ye = {
   return bt(window, b, "resize", !0, a === "segmented"), /* @__PURE__ */ K(
     "div",
     {
-      className: B("p-meter", e, {
+      className: L("p-meter", e, {
         "p-meter--small": o === "small"
       }),
       "aria-label": s == null ? void 0 : s["aria-label"],
@@ -139,7 +139,7 @@ const ye = {
       ${tr} ${n}px
     )`
   });
-  return /* @__PURE__ */ K(Ae, { children: [
+  return /* @__PURE__ */ K(Se, { children: [
     a() ? /* @__PURE__ */ l(
       "div",
       {
@@ -171,7 +171,7 @@ const ye = {
 }) => /* @__PURE__ */ l(
   "div",
   {
-    className: B("p-meter__label", e),
+    className: L("p-meter__label", e),
     "data-testid": Ee.label,
     children: r
   }
@@ -184,7 +184,25 @@ const kt = ({
   e,
   "% ",
   /* @__PURE__ */ l(_t, { className: "progress-indicator__spinner" })
-] }), $t = ({ children: e }) => /* @__PURE__ */ l(Ae, { children: e }), Mt = ({
+] });
+const Po = ({
+  text: e,
+  children: r,
+  className: t,
+  isPending: n = !1
+}) => {
+  const a = Math.floor(Math.random() * 750);
+  return n ? /* @__PURE__ */ l(
+    "span",
+    {
+      "aria-label": "loading",
+      className: L("p-placeholder", t),
+      role: "progressbar",
+      style: { animationDelay: `${a}ms` },
+      children: /* @__PURE__ */ l("span", { "aria-hidden": "true", children: e || r || "Loading" })
+    }
+  ) : /* @__PURE__ */ l(Se, { children: r });
+}, $t = ({ children: e }) => /* @__PURE__ */ l(Se, { children: e }), Mt = ({
   isCollapsed: e,
   setIsCollapsed: r,
   className: t
@@ -192,7 +210,7 @@ const kt = ({
   Et,
   {
     className: "p-side-navigation__tooltip-wrapper",
-    message: /* @__PURE__ */ K(Ae, { children: [
+    message: /* @__PURE__ */ K(Se, { children: [
       e ? "expand" : "collapse",
       "( ",
       /* @__PURE__ */ l("code", { children: "[" }),
@@ -205,7 +223,7 @@ const kt = ({
       {
         appearance: "base",
         "aria-label": `${e ? "expand" : "collapse"} main navigation`,
-        className: B(
+        className: L(
           "is-dense has-icon is-dark u-no-margin l-navigation-collapse-toggle",
           t
         ),
@@ -216,24 +234,24 @@ const kt = ({
       }
     )
   }
-), Lt = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-panel__content", children: /* @__PURE__ */ l("nav", { className: "p-side-navigation--icons is-dark", children: e }) }), Bt = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-panel__controls u-no-margin--top", children: e }), zt = ({ children: e }) => /* @__PURE__ */ l("div", { className: "l-navigation__drawer", children: /* @__PURE__ */ l("div", { className: "p-panel is-dark", children: e }) }), Wt = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-panel__footer", children: e }), Yt = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-panel__header", children: e }), qt = ({ light: e = !0, name: r }) => /* @__PURE__ */ l(we, { className: "p-side-navigation__icon", light: e, name: r }), Ut = ({ children: e, className: r, hasActiveChild: t }) => /* @__PURE__ */ l("li", { className: B("p-side-navigation__item", r, { "has-active-child": t }), children: e }), Kt = ({ children: e, id: r, variant: t = "base" }) => /* @__PURE__ */ l("span", { className: B("p-side-navigation__label", { "p-side-navigation__label--group": t === "group" }), id: r, children: e }), Ht = ({
+), Lt = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-panel__content", children: /* @__PURE__ */ l("nav", { className: "p-side-navigation--icons is-dark", children: e }) }), Bt = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-panel__controls u-no-margin--top", children: e }), zt = ({ children: e }) => /* @__PURE__ */ l("div", { className: "l-navigation__drawer", children: /* @__PURE__ */ l("div", { className: "p-panel is-dark", children: e }) }), Wt = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-panel__footer", children: e }), Yt = ({ children: e }) => /* @__PURE__ */ l("div", { className: "p-panel__header", children: e }), qt = ({ light: e = !0, name: r }) => /* @__PURE__ */ l(we, { className: "p-side-navigation__icon", light: e, name: r }), Ut = ({ children: e, className: r, hasActiveChild: t }) => /* @__PURE__ */ l("li", { className: L("p-side-navigation__item", r, { "has-active-child": t }), children: e }), Kt = ({ children: e, id: r, variant: t = "base" }) => /* @__PURE__ */ l("span", { className: L("p-side-navigation__label", { "p-side-navigation__label--group": t === "group" }), id: r, children: e }), Ht = ({
   as: e,
   ...r
 }) => /* @__PURE__ */ l(
   e || "a",
   {
-    className: B("p-side-navigation__link", r.className),
+    className: L("p-side-navigation__link", r.className),
     ...r
   }
-), Gt = ({ children: e, className: r }) => /* @__PURE__ */ l("ul", { className: B("p-side-navigation__list", r), children: e }), Vt = ({
+), Gt = ({ children: e, className: r }) => /* @__PURE__ */ l("ul", { className: L("p-side-navigation__list", r), children: e }), Vt = ({
   as: e,
   children: r,
   className: t,
   ...n
-}) => /* @__PURE__ */ l(e || "a", { className: B("p-panel__logo", t), ...n, children: /* @__PURE__ */ l("div", { className: "p-navigation__tagged-logo", children: r }) }), Jt = ({ children: e }) => dt(e, { className: "p-panel__logo-icon p-navigation__logo-icon" }), Zt = ({ children: e, variant: r = "base" }) => /* @__PURE__ */ l(
+}) => /* @__PURE__ */ l(e || "a", { className: L("p-panel__logo", t), ...n, children: /* @__PURE__ */ l("div", { className: "p-navigation__tagged-logo", children: r }) }), Jt = ({ children: e }) => dt(e, { className: "p-panel__logo-icon p-navigation__logo-icon" }), Zt = ({ children: e, variant: r = "base" }) => /* @__PURE__ */ l(
   "div",
   {
-    className: B("p-panel__logo-name is-fading-when-collapsed", {
+    className: L("p-panel__logo-name is-fading-when-collapsed", {
       "p-panel__logo-name--small": r === "small"
     }),
     children: e
@@ -246,7 +264,7 @@ const kt = ({
   fe,
   {
     appearance: "base",
-    className: B(
+    className: L(
       "p-side-navigation__button--menu has-icon is-dark",
       r
     ),
@@ -256,7 +274,7 @@ const kt = ({
     children: e
   }
 ), rn = ({ children: e }) => /* @__PURE__ */ l("span", { className: "p-side-navigation__text", children: e });
-const H = ({ children: e, className: r, isCollapsed: t }) => /* @__PURE__ */ l("header", { "aria-label": "main navigation", className: B("l-navigation is-maas", r, { "is-collapsed": t, "is-pinned": !t }), children: e }), tn = ({ children: e, className: r }) => /* @__PURE__ */ l("header", { "aria-label": "navigation", className: "l-navigation-bar", children: /* @__PURE__ */ l("div", { className: B("p-panel is-dark", r), children: e }) });
+const H = ({ children: e, className: r, isCollapsed: t }) => /* @__PURE__ */ l("header", { "aria-label": "main navigation", className: L("l-navigation is-maas", r, { "is-collapsed": t, "is-pinned": !t }), children: e }), tn = ({ children: e, className: r }) => /* @__PURE__ */ l("header", { "aria-label": "navigation", className: "l-navigation-bar", children: /* @__PURE__ */ l("div", { className: L("p-panel is-dark", r), children: e }) });
 H.Header = Yt;
 H.Banner = $t;
 H.Drawer = zt;
@@ -323,7 +341,7 @@ const qr = oe.createContext(null), Ur = oe.createContext([!1, () => {
   return /* @__PURE__ */ l(
     "header",
     {
-      className: B("main-toolbar", {
+      className: L("main-toolbar", {
         "main-toolbar--stacked": n
       }),
       ref: r,
@@ -338,7 +356,7 @@ const qr = oe.createContext(null), Ur = oe.createContext([!1, () => {
 }) => /* @__PURE__ */ l(
   e || "h1",
   {
-    className: B("main-toolbar__title p-heading--4", t),
+    className: L("main-toolbar__title p-heading--4", t),
     "data-testid": "main-toolbar-heading",
     ...n,
     children: r
@@ -347,7 +365,7 @@ const qr = oe.createContext(null), Ur = oe.createContext([!1, () => {
   const r = oe.useContext(qr), [t, n] = oe.useContext(Ur), a = oe.useRef(null);
   return oe.useEffect(() => {
     !a.current || !r || n(a.current.getBoundingClientRect().width > r.width);
-  }, [n, r, a]), /* @__PURE__ */ K(Ae, { children: [
+  }, [n, r, a]), /* @__PURE__ */ K(Se, { children: [
     /* @__PURE__ */ l(
       "div",
       {
@@ -361,7 +379,7 @@ const qr = oe.createContext(null), Ur = oe.createContext([!1, () => {
     /* @__PURE__ */ l(
       "div",
       {
-        className: B("main-toolbar__controls", {
+        className: L("main-toolbar__controls", {
           "main-toolbar__controls--stacked": t
         }),
         children: e
@@ -378,16 +396,16 @@ const Be = ({
   variant: n = "wide",
   ...a
 }) => {
-  const o = t || "section", s = B("content-section", r);
+  const o = t || "section", s = L("content-section", r);
   return /* @__PURE__ */ l(o, { ...a, className: s, children: /* @__PURE__ */ l(wt, { children: /* @__PURE__ */ l(St, { size: n === "narrow" ? 6 : 12, children: e }) }) });
 }, pn = ({ children: e, className: r, as: t, ...n }) => /* @__PURE__ */ l(
   t || "h1",
   {
     ...n,
-    className: B("content-section__title p-heading--4", r),
+    className: L("content-section__title p-heading--4", r),
     children: e
   }
-), dn = ({ children: e, className: r }) => /* @__PURE__ */ l("header", { className: B("content-section__header", r), children: e }), mn = ({ children: e, className: r }) => /* @__PURE__ */ l("div", { className: B("content-section__body", r), children: e }), vn = ({ children: e, className: r }) => /* @__PURE__ */ l("footer", { className: B("content-section__footer", r), children: e });
+), dn = ({ children: e, className: r }) => /* @__PURE__ */ l("header", { className: L("content-section__header", r), children: e }), mn = ({ children: e, className: r }) => /* @__PURE__ */ l("div", { className: L("content-section__body", r), children: e }), vn = ({ children: e, className: r }) => /* @__PURE__ */ l("footer", { className: L("content-section__footer", r), children: e });
 Be.Title = pn;
 Be.Header = dn;
 Be.Content = mn;
@@ -399,12 +417,12 @@ const Hr = ({
 }) => /* @__PURE__ */ l(
   "div",
   {
-    className: B("fade-in--down", r),
+    className: L("fade-in--down", r),
     "aria-hidden": t ? "false" : "true",
     style: { visibility: t ? "visible" : "hidden" },
     children: e
   }
-), Po = ({
+), Ro = ({
   children: e,
   ...r
 }) => /* @__PURE__ */ l(Hr, { isVisible: !r["aria-hidden"], children: /* @__PURE__ */ l("div", { className: "p-form__nested-group", ...r, children: e }) });
@@ -423,7 +441,7 @@ const yn = ({
   "nav",
   {
     "aria-label": (c == null ? void 0 : c["aria-label"]) || "pagination",
-    className: B("p-pagination", e),
+    className: L("p-pagination", e),
     children: /* @__PURE__ */ K("span", { className: "p-pagination--items", children: [
       /* @__PURE__ */ l(
         fe,
@@ -471,7 +489,7 @@ const yn = ({
       )
     ] })
   }
-), Ro = ({
+), Fo = ({
   currentPage: e,
   disabled: r,
   paginate: t,
@@ -501,13 +519,13 @@ const yn = ({
     }
   );
 };
-const Fo = ({ activeStep: e, items: r }) => /* @__PURE__ */ l("ol", { className: "stepper", children: r.map((t, n) => {
+const Io = ({ activeStep: e, items: r }) => /* @__PURE__ */ l("ol", { className: "stepper", children: r.map((t, n) => {
   const a = n === e, o = n < e;
   return /* @__PURE__ */ l("li", { "aria-label": t, className: "stepper__item", children: /* @__PURE__ */ l(
     "p",
     {
       "aria-label": o ? `${t} (completed)` : t,
-      className: B("stepper__title", {
+      className: L("stepper__title", {
         "stepper__title--is-active": a,
         "stepper__title--is-complete": o
       }),
@@ -529,7 +547,7 @@ function gn() {
   if (gr)
     return I;
   gr = 1;
-  var e = typeof Symbol == "function" && Symbol.for, r = e ? Symbol.for("react.element") : 60103, t = e ? Symbol.for("react.portal") : 60106, n = e ? Symbol.for("react.fragment") : 60107, a = e ? Symbol.for("react.strict_mode") : 60108, o = e ? Symbol.for("react.profiler") : 60114, s = e ? Symbol.for("react.provider") : 60109, i = e ? Symbol.for("react.context") : 60110, f = e ? Symbol.for("react.async_mode") : 60111, c = e ? Symbol.for("react.concurrent_mode") : 60111, v = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, h = e ? Symbol.for("react.suspense_list") : 60120, b = e ? Symbol.for("react.memo") : 60115, C = e ? Symbol.for("react.lazy") : 60116, S = e ? Symbol.for("react.block") : 60121, L = e ? Symbol.for("react.fundamental") : 60117, N = e ? Symbol.for("react.responder") : 60118, U = e ? Symbol.for("react.scope") : 60119;
+  var e = typeof Symbol == "function" && Symbol.for, r = e ? Symbol.for("react.element") : 60103, t = e ? Symbol.for("react.portal") : 60106, n = e ? Symbol.for("react.fragment") : 60107, a = e ? Symbol.for("react.strict_mode") : 60108, o = e ? Symbol.for("react.profiler") : 60114, s = e ? Symbol.for("react.provider") : 60109, i = e ? Symbol.for("react.context") : 60110, f = e ? Symbol.for("react.async_mode") : 60111, c = e ? Symbol.for("react.concurrent_mode") : 60111, v = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, h = e ? Symbol.for("react.suspense_list") : 60120, b = e ? Symbol.for("react.memo") : 60115, C = e ? Symbol.for("react.lazy") : 60116, S = e ? Symbol.for("react.block") : 60121, B = e ? Symbol.for("react.fundamental") : 60117, N = e ? Symbol.for("react.responder") : 60118, U = e ? Symbol.for("react.scope") : 60119;
   function A(p) {
     if (typeof p == "object" && p !== null) {
       var X = p.$$typeof;
@@ -588,7 +606,7 @@ function gn() {
   }, I.isSuspense = function(p) {
     return A(p) === g;
   }, I.isValidElementType = function(p) {
-    return typeof p == "string" || typeof p == "function" || p === n || p === c || p === o || p === a || p === g || p === h || typeof p == "object" && p !== null && (p.$$typeof === C || p.$$typeof === b || p.$$typeof === s || p.$$typeof === i || p.$$typeof === v || p.$$typeof === L || p.$$typeof === N || p.$$typeof === U || p.$$typeof === S);
+    return typeof p == "string" || typeof p == "function" || p === n || p === c || p === o || p === a || p === g || p === h || typeof p == "object" && p !== null && (p.$$typeof === C || p.$$typeof === b || p.$$typeof === s || p.$$typeof === i || p.$$typeof === v || p.$$typeof === B || p.$$typeof === N || p.$$typeof === U || p.$$typeof === S);
   }, I.typeOf = A, I;
 }
 var j = {};
@@ -603,10 +621,10 @@ var j = {};
 var br;
 function bn() {
   return br || (br = 1, process.env.NODE_ENV !== "production" && function() {
-    var e = typeof Symbol == "function" && Symbol.for, r = e ? Symbol.for("react.element") : 60103, t = e ? Symbol.for("react.portal") : 60106, n = e ? Symbol.for("react.fragment") : 60107, a = e ? Symbol.for("react.strict_mode") : 60108, o = e ? Symbol.for("react.profiler") : 60114, s = e ? Symbol.for("react.provider") : 60109, i = e ? Symbol.for("react.context") : 60110, f = e ? Symbol.for("react.async_mode") : 60111, c = e ? Symbol.for("react.concurrent_mode") : 60111, v = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, h = e ? Symbol.for("react.suspense_list") : 60120, b = e ? Symbol.for("react.memo") : 60115, C = e ? Symbol.for("react.lazy") : 60116, S = e ? Symbol.for("react.block") : 60121, L = e ? Symbol.for("react.fundamental") : 60117, N = e ? Symbol.for("react.responder") : 60118, U = e ? Symbol.for("react.scope") : 60119;
+    var e = typeof Symbol == "function" && Symbol.for, r = e ? Symbol.for("react.element") : 60103, t = e ? Symbol.for("react.portal") : 60106, n = e ? Symbol.for("react.fragment") : 60107, a = e ? Symbol.for("react.strict_mode") : 60108, o = e ? Symbol.for("react.profiler") : 60114, s = e ? Symbol.for("react.provider") : 60109, i = e ? Symbol.for("react.context") : 60110, f = e ? Symbol.for("react.async_mode") : 60111, c = e ? Symbol.for("react.concurrent_mode") : 60111, v = e ? Symbol.for("react.forward_ref") : 60112, g = e ? Symbol.for("react.suspense") : 60113, h = e ? Symbol.for("react.suspense_list") : 60120, b = e ? Symbol.for("react.memo") : 60115, C = e ? Symbol.for("react.lazy") : 60116, S = e ? Symbol.for("react.block") : 60121, B = e ? Symbol.for("react.fundamental") : 60117, N = e ? Symbol.for("react.responder") : 60118, U = e ? Symbol.for("react.scope") : 60119;
     function A(d) {
       return typeof d == "string" || typeof d == "function" || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
-      d === n || d === c || d === o || d === a || d === g || d === h || typeof d == "object" && d !== null && (d.$$typeof === C || d.$$typeof === b || d.$$typeof === s || d.$$typeof === i || d.$$typeof === v || d.$$typeof === L || d.$$typeof === N || d.$$typeof === U || d.$$typeof === S);
+      d === n || d === c || d === o || d === a || d === g || d === h || typeof d == "object" && d !== null && (d.$$typeof === C || d.$$typeof === b || d.$$typeof === s || d.$$typeof === i || d.$$typeof === v || d.$$typeof === B || d.$$typeof === N || d.$$typeof === U || d.$$typeof === S);
     }
     function k(d) {
       if (typeof d == "object" && d !== null) {
@@ -623,14 +641,14 @@ function bn() {
               case g:
                 return me;
               default:
-                var Te = me && me.$$typeof;
-                switch (Te) {
+                var xe = me && me.$$typeof;
+                switch (xe) {
                   case i:
                   case v:
                   case C:
                   case b:
                   case s:
-                    return Te;
+                    return xe;
                   default:
                     return re;
                 }
@@ -854,7 +872,7 @@ function En() {
       this.message = u, this.data = y && typeof y == "object" ? y : {}, this.stack = "";
     }
     S.prototype = Error.prototype;
-    function L(u) {
+    function B(u) {
       if (process.env.NODE_ENV !== "production")
         var y = {}, T = 0;
       function x(P, w, O, R, F, D, q) {
@@ -889,10 +907,10 @@ function En() {
         }
         return null;
       }
-      return L(y);
+      return B(y);
     }
     function U() {
-      return L(s);
+      return B(s);
     }
     function A(u) {
       function y(T, x, E, P, w) {
@@ -910,7 +928,7 @@ function En() {
         }
         return null;
       }
-      return L(y);
+      return B(y);
     }
     function k() {
       function u(y, T, x, E, P) {
@@ -921,7 +939,7 @@ function En() {
         }
         return null;
       }
-      return L(u);
+      return B(u);
     }
     function p() {
       function u(y, T, x, E, P) {
@@ -932,7 +950,7 @@ function En() {
         }
         return null;
       }
-      return L(u);
+      return B(u);
     }
     function X(u) {
       function y(T, x, E, P, w) {
@@ -942,7 +960,7 @@ function En() {
         }
         return null;
       }
-      return L(y);
+      return B(y);
     }
     function $(u) {
       if (!Array.isArray(u))
@@ -959,7 +977,7 @@ function En() {
         });
         return new S("Invalid " + P + " `" + w + "` of value `" + String(O) + "` " + ("supplied to `" + E + "`, expected one of " + F + "."));
       }
-      return L(y);
+      return B(y);
     }
     function J(u) {
       function y(T, x, E, P, w) {
@@ -976,7 +994,7 @@ function En() {
           }
         return null;
       }
-      return L(y);
+      return B(y);
     }
     function ee(u) {
       if (!Array.isArray(u))
@@ -998,13 +1016,13 @@ function En() {
         var re = F.length > 0 ? ", expected one of type [" + F.join(", ") + "]" : "";
         return new S("Invalid " + O + " `" + R + "` supplied to " + ("`" + w + "`" + re + "."));
       }
-      return L(x);
+      return B(x);
     }
     function ce() {
       function u(y, T, x, E, P) {
         return W(y[T]) ? null : new S("Invalid " + E + " `" + P + "` supplied to " + ("`" + x + "`, expected a ReactNode."));
       }
-      return L(u);
+      return B(u);
     }
     function pe(u, y, T, x, E) {
       return new S(
@@ -1026,7 +1044,7 @@ function En() {
         }
         return null;
       }
-      return L(y);
+      return B(y);
     }
     function le(u) {
       function y(T, x, E, P, w) {
@@ -1049,7 +1067,7 @@ Valid keys: ` + JSON.stringify(Object.keys(u), null, "  ")
         }
         return null;
       }
-      return L(y);
+      return B(y);
     }
     function W(u) {
       switch (typeof u) {
@@ -1179,7 +1197,7 @@ if (process.env.NODE_ENV !== "production") {
   nr.exports = wn()();
 var Tn = nr.exports;
 const M = /* @__PURE__ */ Br(Tn);
-function Se(e, r, t, n) {
+function Ce(e, r, t, n) {
   function a(o) {
     return o instanceof t ? o : new t(function(s) {
       s(o);
@@ -1206,7 +1224,7 @@ function Se(e, r, t, n) {
     c((n = n.apply(e, r || [])).next());
   });
 }
-function Ce(e, r) {
+function Te(e, r) {
   var t = { label: 0, sent: function() {
     if (o[0] & 1)
       throw o[1];
@@ -1414,8 +1432,8 @@ var Dn = [
   // Windows
 ];
 function An(e) {
-  return Se(this, void 0, void 0, function() {
-    return Ce(this, function(r) {
+  return Ce(this, void 0, void 0, function() {
+    return Te(this, function(r) {
       return $e(e) && Pn(e.dataTransfer) ? [2, jn(e.dataTransfer, e.type)] : Rn(e) ? [2, Fn(e)] : Array.isArray(e) && e.every(function(t) {
         return "getFile" in t && typeof t.getFile == "function";
       }) ? [2, In(e)] : [2, []];
@@ -1437,9 +1455,9 @@ function Fn(e) {
   });
 }
 function In(e) {
-  return Se(this, void 0, void 0, function() {
+  return Ce(this, void 0, void 0, function() {
     var r;
-    return Ce(this, function(t) {
+    return Te(this, function(t) {
       switch (t.label) {
         case 0:
           return [4, Promise.all(e.map(function(n) {
@@ -1454,9 +1472,9 @@ function In(e) {
   });
 }
 function jn(e, r) {
-  return Se(this, void 0, void 0, function() {
+  return Ce(this, void 0, void 0, function() {
     var t, n;
-    return Ce(this, function(a) {
+    return Te(this, function(a) {
       switch (a.label) {
         case 0:
           return e.items ? (t = or(e.items).filter(function(o) {
@@ -1505,8 +1523,8 @@ function Ar(e) {
   return Promise.resolve(t);
 }
 function kn(e) {
-  return Se(this, void 0, void 0, function() {
-    return Ce(this, function(r) {
+  return Ce(this, void 0, void 0, function() {
+    return Te(this, function(r) {
       return [2, e.isDirectory ? Zr(e) : $n(e)];
     });
   });
@@ -1518,9 +1536,9 @@ function Zr(e) {
     function o() {
       var s = this;
       r.readEntries(function(i) {
-        return Se(s, void 0, void 0, function() {
+        return Ce(s, void 0, void 0, function() {
           var f, c, v;
-          return Ce(this, function(g) {
+          return Te(this, function(g) {
             switch (g.label) {
               case 0:
                 if (i.length)
@@ -1552,8 +1570,8 @@ function Zr(e) {
   });
 }
 function $n(e) {
-  return Se(this, void 0, void 0, function() {
-    return Ce(this, function(r) {
+  return Ce(this, void 0, void 0, function() {
+    return Te(this, function(r) {
       return [2, new Promise(function(t, n) {
         e.file(function(a) {
           var o = Pe(a, e.fullPath);
@@ -1614,7 +1632,7 @@ function Fr(e) {
 function Xr(e, r, t) {
   return r in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e;
 }
-function De(e, r) {
+function Ae(e, r) {
   return qn(e) || Yn(e, r) || Qr(e, r) || Wn();
 }
 function Wn() {
@@ -1708,7 +1726,7 @@ function ve(e) {
 function Zn(e) {
   var r = e.files, t = e.accept, n = e.minSize, a = e.maxSize, o = e.multiple, s = e.maxFiles, i = e.validator;
   return !o && r.length > 1 || o && s >= 1 && r.length > s ? !1 : r.every(function(f) {
-    var c = et(f, t), v = De(c, 1), g = v[0], h = rt(f, n, a), b = De(h, 1), C = b[0], S = i ? i(f) : null;
+    var c = et(f, t), v = Ae(c, 1), g = v[0], h = rt(f, n, a), b = Ae(h, 1), C = b[0], S = i ? i(f) : null;
     return g && C && !S;
   });
 }
@@ -1750,10 +1768,10 @@ function ro() {
 function to(e) {
   if (ve(e)) {
     var r = Object.entries(e).filter(function(t) {
-      var n = De(t, 2), a = n[0], o = n[1], s = !0;
+      var n = Ae(t, 2), a = n[0], o = n[1], s = !0;
       return tt(a) || (console.warn('Skipped "'.concat(a, '" because it is not a valid MIME type. Check https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types for a list of valid MIME types.')), s = !1), (!Array.isArray(o) || !o.every(nt)) && (console.warn('Skipped "'.concat(a, '" because an invalid file extension was provided.')), s = !1), s;
     }).reduce(function(t, n) {
-      var a = De(n, 2), o = a[0], s = a[1];
+      var a = Ae(n, 2), o = a[0], s = a[1];
       return Fr(Fr({}, t), {}, Xr({}, o, s));
     }, {});
     return [{
@@ -1767,7 +1785,7 @@ function to(e) {
 function no(e) {
   if (ve(e))
     return Object.entries(e).reduce(function(r, t) {
-      var n = De(t, 2), a = n[0], o = n[1];
+      var n = Ae(t, 2), a = n[0], o = n[1];
       return [].concat(Pr(r), [a], Pr(o));
     }, []).filter(function(r) {
       return tt(r) || nt(r);
@@ -2098,15 +2116,15 @@ var cr = {
   fileRejections: []
 };
 function it() {
-  var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, r = z(z({}, at), e), t = r.accept, n = r.disabled, a = r.getFilesFromEvent, o = r.maxSize, s = r.minSize, i = r.multiple, f = r.maxFiles, c = r.onDragEnter, v = r.onDragLeave, g = r.onDragOver, h = r.onDrop, b = r.onDropAccepted, C = r.onDropRejected, S = r.onFileDialogCancel, L = r.onFileDialogOpen, N = r.useFsAccessApi, U = r.autoFocus, A = r.preventDropOnDocument, k = r.noClick, p = r.noKeyboard, X = r.noDrag, $ = r.noDragEventsBubbling, J = r.onError, ee = r.validator, ce = se(function() {
+  var e = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, r = z(z({}, at), e), t = r.accept, n = r.disabled, a = r.getFilesFromEvent, o = r.maxSize, s = r.minSize, i = r.multiple, f = r.maxFiles, c = r.onDragEnter, v = r.onDragLeave, g = r.onDragOver, h = r.onDrop, b = r.onDropAccepted, C = r.onDropRejected, S = r.onFileDialogCancel, B = r.onFileDialogOpen, N = r.useFsAccessApi, U = r.autoFocus, A = r.preventDropOnDocument, k = r.noClick, p = r.noKeyboard, X = r.noDrag, $ = r.noDragEventsBubbling, J = r.onError, ee = r.validator, ce = se(function() {
     return no(t);
   }, [t]), pe = se(function() {
     return to(t);
   }, [t]), de = se(function() {
-    return typeof L == "function" ? L : $r;
-  }, [L]), le = se(function() {
+    return typeof B == "function" ? B : $r;
+  }, [B]), le = se(function() {
     return typeof S == "function" ? S : $r;
-  }, [S]), W = Oe(null), Z = Oe(null), ne = Lr(ho, cr), ae = rr(ne, 2), ue = ae[0], G = ae[1], u = ue.isFocused, y = ue.isFileDialogActive, T = Oe(typeof window < "u" && window.isSecureContext && N && ro()), x = function() {
+  }, [S]), W = De(null), Z = De(null), ne = Lr(ho, cr), ae = rr(ne, 2), ue = ae[0], G = ae[1], u = ue.isFocused, y = ue.isFileDialogActive, T = De(typeof window < "u" && window.isSecureContext && N && ro()), x = function() {
     !T.current && y && setTimeout(function() {
       if (Z.current) {
         var _ = Z.current.files;
@@ -2121,7 +2139,7 @@ function it() {
       window.removeEventListener("focus", x, !1);
     };
   }, [Z, y, le, T]);
-  var E = Oe([]), P = function(_) {
+  var E = De([]), P = function(_) {
     W.current && W.current.contains(_.target) || (_.preventDefault(), E.current = []);
   };
   _e(function() {
@@ -2179,7 +2197,7 @@ function it() {
   }, [W, v, $]), D = Q(function(m, _) {
     var Y = [], V = [];
     m.forEach(function(te) {
-      var xe = et(te, ce), he = rr(xe, 2), We = he[0], Ye = he[1], qe = rt(te, s, o), Ie = rr(qe, 2), Ue = Ie[0], Ke = Ie[1], He = ee ? ee(te) : null;
+      var Oe = et(te, ce), he = rr(Oe, 2), We = he[0], Ye = he[1], qe = rt(te, s, o), Ie = rr(qe, 2), Ue = Ie[0], Ke = Ie[1], He = ee ? ee(te) : null;
       if (We && Ue && !He)
         Y.push(te);
       else {
@@ -2240,7 +2258,7 @@ function it() {
     G({
       type: "focus"
     });
-  }, []), Te = Q(function() {
+  }, []), xe = Q(function() {
     G({
       type: "blur"
     });
@@ -2256,11 +2274,11 @@ function it() {
     $ && _.stopPropagation();
   }, ct = se(function() {
     return function() {
-      var m = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, _ = m.refKey, Y = _ === void 0 ? "ref" : _, V = m.role, te = m.onKeyDown, xe = m.onFocus, he = m.onBlur, We = m.onClick, Ye = m.onDragEnter, qe = m.onDragOver, Ie = m.onDragLeave, Ue = m.onDrop, Ke = Le(m, co);
+      var m = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, _ = m.refKey, Y = _ === void 0 ? "ref" : _, V = m.role, te = m.onKeyDown, Oe = m.onFocus, he = m.onBlur, We = m.onClick, Ye = m.onDragEnter, qe = m.onDragOver, Ie = m.onDragLeave, Ue = m.onDrop, Ke = Le(m, co);
       return z(z(sr({
         onKeyDown: ze(ie(te, re)),
-        onFocus: ze(ie(xe, me)),
-        onBlur: ze(ie(he, Te)),
+        onFocus: ze(ie(Oe, me)),
+        onBlur: ze(ie(he, xe)),
         onClick: be(ie(We, dr)),
         onDragEnter: Re(ie(Ye, O)),
         onDragOver: Re(ie(qe, R)),
@@ -2271,11 +2289,11 @@ function it() {
         tabIndex: 0
       } : {}), Ke);
     };
-  }, [W, re, me, Te, dr, O, R, F, q, p, X, n]), lt = Q(function(m) {
+  }, [W, re, me, xe, dr, O, R, F, q, p, X, n]), lt = Q(function(m) {
     m.stopPropagation();
   }, []), ut = se(function() {
     return function() {
-      var m = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, _ = m.refKey, Y = _ === void 0 ? "ref" : _, V = m.onChange, te = m.onClick, xe = Le(m, lo), he = sr({
+      var m = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, _ = m.refKey, Y = _ === void 0 ? "ref" : _, V = m.onChange, te = m.onClick, Oe = Le(m, lo), he = sr({
         accept: ce,
         multiple: i,
         type: "file",
@@ -2286,7 +2304,7 @@ function it() {
         onClick: be(ie(te, lt)),
         tabIndex: -1
       }, Y, Z);
-      return z(z({}, he), xe);
+      return z(z({}, he), Oe);
     };
   }, [Z, t, i, q, n]);
   return z(z({}, ue), {}, {
@@ -2400,7 +2418,7 @@ const _o = () => {
   return /* @__PURE__ */ K(
     "div",
     {
-      className: B("p-form__group p-form-validation", {
+      className: L("p-form__group p-form-validation", {
         "is-error": !!r
       }),
       children: [
@@ -2463,7 +2481,7 @@ const _o = () => {
       ]
     }
   );
-}, Io = ({
+}, jo = ({
   accept: e,
   error: r,
   help: t,
@@ -2535,7 +2553,7 @@ const st = (e, r) => e.label.localeCompare(r.label, "en", { numeric: !0 }), wo =
   const C = se(() => e.some((N) => N.group), [e]), S = se(
     () => C ? f(e) : [{ group: "Ungrouped", items: e }],
     [e, f]
-  ), L = (N) => {
+  ), B = (N) => {
     const { checked: U, value: A } = N.target, k = e.find((p) => `${p.value}` === A);
     if (k) {
       const p = U ? [...r, k] : r.filter((X) => `${X.value}` !== A) ?? [];
@@ -2553,14 +2571,14 @@ const st = (e, r) => e.label.localeCompare(r.label, "en", { numeric: !0 }), wo =
           label: A.label,
           checked: v.has(A.value),
           value: A.value,
-          onChange: L
+          onChange: B
         },
         A.value
       ) }, A.value)) })
     ] }, N)),
     s ? /* @__PURE__ */ l("div", { className: "multi-select__footer", children: s }) : null
   ] }) });
-}, jo = ({
+}, No = ({
   disabled: e,
   selectedItems: r = [],
   label: t,
@@ -2583,7 +2601,7 @@ const st = (e, r) => e.label.localeCompare(r.label, "en", { numeric: !0 }), wo =
   _e(() => {
     h || S("");
   }, [h]);
-  const [L, N] = ge([]), U = r || L, A = ($) => {
+  const [B, N] = ge([]), U = r || B, A = ($) => {
     const J = Array.from(new Set($));
     N(J), n && n(J);
   }, k = ke(), p = ke(), X = U.filter(
@@ -2638,7 +2656,7 @@ const st = (e, r) => e.label.localeCompare(r.label, "en", { numeric: !0 }), wo =
         disabledItems: i,
         header: f,
         updateItems: A,
-        footer: c || /* @__PURE__ */ K(Ae, { children: [
+        footer: c || /* @__PURE__ */ K(Se, { children: [
           /* @__PURE__ */ l(
             fe,
             {
@@ -2675,7 +2693,7 @@ const st = (e, r) => e.label.localeCompare(r.label, "en", { numeric: !0 }), wo =
       }
     )
   ] }) });
-}, No = ({ value: e, unit: r }, {
+}, ko = ({ value: e, unit: r }, {
   binary: t = !1,
   convertTo: n,
   decimals: a = 2,
@@ -2699,22 +2717,23 @@ export {
   Be as ContentSection,
   Ao as ExternalLink,
   Eo as FileUpload,
-  Io as FileUploadContainer,
+  jo as FileUploadContainer,
   ur as FormSection,
   Yr as InputGroup,
   Kr as MainToolbar,
   Ft as Meter,
-  jo as MultiSelect,
+  No as MultiSelect,
   Co as MultiSelectDropdown,
   H as Navigation,
   tn as NavigationBar,
-  Po as NestedFormGroup,
+  Ro as NestedFormGroup,
   yn as Pagination,
-  Ro as PaginationContainer,
+  Fo as PaginationContainer,
+  Po as Placeholder,
   kt as ProgressIndicator,
-  Fo as Stepper,
+  Io as Stepper,
   Do as defaultFilledColors,
-  No as formatBytes,
+  ko as formatBytes,
   ye as meterColor,
   Ee as testIds
 };