@telia-ace/widget-ui 1.0.21 → 1.0.23-next.0

package/dist/index.js

@@ -1,35 +1,36 @@
-var Ne = Object.defineProperty, ze = Object.defineProperties;
-var Be = Object.getOwnPropertyDescriptors;
-var Y = Object.getOwnPropertySymbols;
-var he = Object.prototype.hasOwnProperty, pe = Object.prototype.propertyIsEnumerable;
-var fe = (e, t, n) => t in e ? Ne(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, p = (e, t) => {
+var ct = Object.defineProperty, lt = Object.defineProperties;
+var ut = Object.getOwnPropertyDescriptors;
+var ne = Object.getOwnPropertySymbols;
+var He = Object.prototype.hasOwnProperty, ze = Object.prototype.propertyIsEnumerable;
+var me = (e, t, n) => t in e ? ct(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, h = (e, t) => {
   for (var n in t || (t = {}))
-    he.call(t, n) && fe(e, n, t[n]);
-  if (Y)
-    for (var n of Y(t))
-      pe.call(t, n) && fe(e, n, t[n]);
+    He.call(t, n) && me(e, n, t[n]);
+  if (ne)
+    for (var n of ne(t))
+      ze.call(t, n) && me(e, n, t[n]);
   return e;
-}, k = (e, t) => ze(e, Be(t));
-var $ = (e, t) => {
+}, $ = (e, t) => lt(e, ut(t));
+var S = (e, t) => {
   var n = {};
-  for (var s in e)
-    he.call(e, s) && t.indexOf(s) < 0 && (n[s] = e[s]);
-  if (e != null && Y)
-    for (var s of Y(e))
-      t.indexOf(s) < 0 && pe.call(e, s) && (n[s] = e[s]);
+  for (var o in e)
+    He.call(e, o) && t.indexOf(o) < 0 && (n[o] = e[o]);
+  if (e != null && ne)
+    for (var o of ne(e))
+      t.indexOf(o) < 0 && ze.call(e, o) && (n[o] = e[o]);
   return n;
 };
-import v, { css as M } from "styled-components";
-import { kebabCase as Ve, appendClassNames as w, uuid as F, removeNullAndUndefinedValues as ge, Logger as ne } from "@telia-ace/widget-utilities";
-import r, { forwardRef as D, createContext as Z, useContext as O, useState as L, useEffect as C, useRef as S, useCallback as H, useImperativeHandle as ie, Component as We, lazy as Oe } from "react";
-import { CSSTransition as ve, Transition as Ie } from "react-transition-group";
-import { Container as Pe, WidgetState as Fe } from "@webprovisions/platform";
-import { ComponentPlatform as Ze, asDescriptor as Ae, createEventSubscriber as Ke, ComponentQuery as Ye, WidgetRenderState as j, extendComponent as je } from "@telia-ace/widget-core";
-import { createPortal as Xe } from "react-dom";
-import ye from "htmr";
-import { HistoryMode as be, getSpecificWidgetPath as _e } from "@telia-ace/widget-routing";
-import { Link as re } from "react-router-dom";
-const Ue = (e) => e === "entering" || e === "entered", qe = (e) => e === "exiting" || e === "exited", W = {
+var re = (e, t, n) => (me(e, typeof t != "symbol" ? t + "" : t, n), n);
+import C, { css as L, keyframes as We } from "styled-components";
+import { kebabCase as mt, appendClassNames as M, uuid as q, removeNullAndUndefinedValues as De, Logger as de } from "@telia-ace/widget-utilities";
+import r, { forwardRef as N, createContext as Q, useContext as X, useState as k, useEffect as w, useRef as R, useCallback as H, useImperativeHandle as Ce, useMemo as ie, Component as dt, lazy as ft } from "react";
+import { CSSTransition as Ie, Transition as ht } from "react-transition-group";
+import { Container as pt, WidgetState as gt } from "@webprovisions/platform";
+import { ComponentPlatform as Ct, asDescriptor as yt, createEventSubscriber as bt, ComponentQuery as vt, WidgetRenderState as oe, extendComponent as wt } from "@telia-ace/widget-core";
+import { createPortal as Et } from "react-dom";
+import Be from "htmr";
+import { HistoryMode as Te, getSpecificWidgetPath as xt } from "@telia-ace/widget-routing";
+import { Link as fe } from "react-router-dom";
+const kt = (e) => e === "entering" || e === "entered", $t = (e) => e === "exiting" || e === "exited", K = {
   fade: {
     in: "opacity: 1;",
     out: "opacity: 0;"
@@ -54,29 +55,29 @@ const Ue = (e) => e === "entering" || e === "entered", qe = (e) => e === "exitin
     in: "transform: scale(1);",
     out: "transform: scale(0);"
   }
-}, Qe = ["slide-up", "slide-down", "slide-left", "slide-right", "scale"], oe = {
+}, Lt = ["slide-up", "slide-down", "slide-left", "slide-right", "scale"], he = {
   compose: (e = "exited", t) => {
-    const { enter: n, exit: s } = t, o = n.transitionKeys.split(" "), i = Qe.indexOf(o[0]) > -1 ? "transform" : "opacity";
-    if (Ue(e))
-      return o && o.length > 0 ? M`
-                    ${o && o.length > 0 && o.map((m) => W[m] ? W[m].in : "")}
-                    transition: ${i} ${n.duration}ms ${n.easing};
+    const { enter: n, exit: o } = t, i = n.transitionKeys.split(" "), s = Lt.indexOf(i[0]) > -1 ? "transform" : "opacity";
+    if (kt(e))
+      return i && i.length > 0 ? L`
+                    ${i && i.length > 0 && i.map((l) => K[l] ? K[l].in : "")}
+                    transition: ${s} ${n.duration}ms ${n.easing};
                 ` : "";
-    const a = o && o.length > 0 && M`
-                ${o.map((m) => W[m] ? W[m].out : "")}
+    const a = i && i.length > 0 && L`
+                ${i.map((l) => K[l] ? K[l].out : "")}
             `;
-    if (qe(e)) {
-      const m = s.transitionKeys.split(" ");
-      return m && m.length > 0 && e === "exiting" ? M`
+    if ($t(e)) {
+      const l = o.transitionKeys.split(" ");
+      return l && l.length > 0 && e === "exiting" ? L`
                     ${a};
-                    ${m.map((l) => W[l] ? W[l].out : "")}
-                    transition: ${i} ${s.duration}ms ${s.easing};
+                    ${l.map((u) => K[u] ? K[u].out : "")}
+                    transition: ${s} ${o.duration}ms ${o.easing};
                 ` : a;
     }
   },
   composeViewTransition: (e, t, n) => {
     if (t === "slide")
-      return oe.compose(e, {
+      return he.compose(e, {
         enter: {
           transitionKeys: n === "forth" ? "slide-right" : "slide-left",
           duration: 500
@@ -87,7 +88,7 @@ const Ue = (e) => e === "entering" || e === "entered", qe = (e) => e === "exitin
         }
       });
     if (t === "fade")
-      return oe.compose(e, {
+      return he.compose(e, {
         enter: {
           transitionKeys: "fade",
           duration: 500
@@ -98,129 +99,132 @@ const Ue = (e) => e === "entering" || e === "entered", qe = (e) => e === "exitin
         }
       });
   },
-  get: (e) => W[e]
+  get: (e) => K[e]
 };
-var se = /* @__PURE__ */ ((e) => (e.Opera = "opera", e.Chrome = "chrome", e.Firefox = "firefox", e.Safari = "safari", e.Edge = "edge", e.EdgeChromium = "edge-chromium", e.Blink = "blink", e.IE = "internet-explorer", e))(se || {});
-const Ce = () => {
+var pe = /* @__PURE__ */ ((e) => (e.Opera = "opera", e.Chrome = "chrome", e.Firefox = "firefox", e.Safari = "safari", e.Edge = "edge", e.EdgeChromium = "edge-chromium", e.Blink = "blink", e.IE = "internet-explorer", e))(pe || {});
+const Ne = () => {
   const {
     opr: e,
     opera: t,
     InstallTrigger: n,
-    HTMLElement: s,
-    safari: o,
-    documentMode: i,
+    HTMLElement: o,
+    safari: i,
+    documentMode: s,
     StyleMedia: a,
-    chrome: m,
-    CSS: l
+    chrome: l,
+    CSS: u
   } = window, c = !!e && !!e.addons || !!t || navigator.userAgent.indexOf(" OPR/") >= 0;
   if (c)
     return "opera";
   if (n)
     return "firefox";
-  const u = ((h) => h.toString() === "[object SafariRemoteNotification]")(!o || typeof o != "undefined" && o.pushNotification);
-  if (/constructor/i.test(s) || u)
+  const m = ((f) => f.toString() === "[object SafariRemoteNotification]")(!i || typeof i != "undefined" && i.pushNotification);
+  if (/constructor/i.test(o) || m)
     return "safari";
-  const f = !!i;
-  if (f)
+  const p = !!s;
+  if (p)
     return "internet-explorer";
-  if (!f && !!a)
+  if (!p && !!a)
     return "edge";
-  const d = !!m && (!!m.webstore || !!m.runtime);
+  const d = !!l && (!!l.webstore || !!l.runtime);
   if (d)
     return "chrome";
   if (d && navigator.userAgent.indexOf("Edg") !== -1)
     return "edge-chromium";
-  if ((d || c) && !!l)
+  if ((d || c) && !!u)
     return "blink";
-}, Ge = ["string", "number"], R = (e) => Object.keys(e).reduce((t, n) => {
-  const s = typeof e[n] == "undefined" ? "" : e[n], o = typeof s;
-  if (Ge.indexOf(o) > -1) {
-    const i = n.substring(0, 5);
-    i === "data-" || i === "aria-" ? t[Ve(n)] = s.toString() : n.substring(0, 4) !== "css-" && (t[n] = s.toString());
+}, Mt = ["string", "number"], V = (e) => Object.keys(e).reduce((t, n) => {
+  const o = typeof e[n] == "undefined" ? "" : e[n], i = typeof o;
+  if (Mt.indexOf(i) > -1) {
+    const s = n.substring(0, 5);
+    s === "data-" || s === "aria-" ? t[mt(n)] = o.toString() : n.substring(0, 4) !== "css-" && (t[n] = o.toString());
   } else
-    t[n] = s;
+    t[n] = o;
   return t;
-}, {}), bn = (e, t) => e.get("seoConfiguration") ? /* @__PURE__ */ r.createElement(Ht, p({}, t)) : null, Je = (e) => new RegExp("^#", "i").test(e), et = (e) => (s) => {
-  var o = s, { children: t } = o, n = $(o, ["children"]);
+}, {}), h1 = (e, t) => e.get("seoConfiguration") ? /* @__PURE__ */ r.createElement(sn, h({}, t)) : null, St = (e) => new RegExp("^#", "i").test(e), Rt = (e) => (o) => {
+  var i = o, { children: t } = i, n = S(i, ["children"]);
   const {
-    implementation: i,
+    implementation: s,
     name: a
-  } = e.get("$widget"), { href: m = "" } = n;
-  if (Je(m))
-    return /* @__PURE__ */ r.createElement(it, {
+  } = e.get("$widget"), { href: l = "" } = n;
+  if (St(l))
+    return /* @__PURE__ */ r.createElement(Nt, {
       smooth: !0,
-      to: m
+      to: l
     }, t);
-  const l = i.bindings.map((f) => f.replace(/\./g, "\\.")).join("|"), u = new RegExp(`^((http[s]?:)?//)?(${l})/([^\\s]+)`).exec(m);
-  if (u && u.length >= 4) {
-    const f = u[4];
-    if (i.widgets.get(f) && !f.startsWith("blob?") && !f.startsWith(a))
-      return /* @__PURE__ */ r.createElement(sn, {
-        widgetName: f
+  const u = s.bindings.map((p) => p.replace(/\./g, "\\.")).join("|"), m = new RegExp(`^((http[s]?:)?//)?(${u})/([^\\s]+)`).exec(l);
+  if (m && m.length >= 4) {
+    const p = m[4];
+    if (s.widgets.get(p) && !p.startsWith("blob?") && !p.startsWith(a))
+      return /* @__PURE__ */ r.createElement(t1, {
+        widgetName: p
       }, t);
   }
-  return /* @__PURE__ */ r.createElement("a", p({}, n), t);
-}, we = (e) => {
+  return /* @__PURE__ */ r.createElement("a", h({}, n), t);
+}, Oe = (e) => {
   const t = {};
   return Object.keys(e).forEach((n) => {
     n.indexOf("css-") > -1 && (t[n] = e[n]);
   }), t;
-}, tt = M`
+}, Ht = L`
     ${(e) => {
   let t = "";
-  return Object.keys(we(e)).forEach((n) => {
+  return Object.keys(Oe(e)).forEach((n) => {
     n.indexOf("css-") > -1 && (t += `${n.replace("css-", "")}:${e[n]};`);
   }), t;
 }}
-`, nt = (e, t) => {
+`, zt = (e, t) => {
   let n = "";
-  const s = () => {
+  const o = () => {
     n = "";
-  }, o = (f) => {
+  }, i = (p) => {
     const d = document.getElementById(n);
-    return d !== null ? (f(d), s(), !0) : !1;
-  }, i = (f) => (f.preventDefault(), s(), e.onClick && e.onClick(f), typeof e.to == "string" && (n = e.to.split("#").slice(1).join("#")), n !== "" && o(e.scroll || ((d) => e.smooth ? d.scrollIntoView({ behavior: "smooth" }) : d.scrollIntoView())), !1), u = e, { scroll: a, smooth: m, to: l } = u, c = $(u, ["scroll", "smooth", "to"]);
-  return t === "a" && (c.href = "javascript:;"), /* @__PURE__ */ r.createElement(t, k(p({}, c), {
-    onClick: i
+    return d !== null ? (p(d), o(), !0) : !1;
+  }, s = (p) => (p.preventDefault(), o(), e.onClick && e.onClick(p), typeof e.to == "string" && (n = e.to.split("#").slice(1).join("#")), n !== "" && i(
+    e.scroll || ((d) => e.smooth ? d.scrollIntoView({ behavior: "smooth" }) : d.scrollIntoView())
+  ), !1), m = e, { scroll: a, smooth: l, to: u } = m, c = S(m, ["scroll", "smooth", "to"]);
+  return t === "a" && (c.href = "javascript:;"), /* @__PURE__ */ r.createElement(t, $(h({}, c), {
+    onClick: s
   }), e.children);
-}, X = (e, t) => {
-  let n = e, s = "";
+}, se = (e, t) => {
+  let n = e, o = "";
   if (["h1", "h2", "h3", "h4", "h5", "h6"].includes(e))
     n = e;
   else {
-    const i = e.match(/h1|h2|h3|h4|h5|h6/);
-    if (i != null && i[0]) {
-      n = i[0];
+    const s = e.match(/h1|h2|h3|h4|h5|h6/);
+    if (s != null && s[0]) {
+      n = s[0];
       const [a] = e.split(n);
-      s = a;
+      o = a;
     }
   }
-  const o = (i, a, m) => m[i] ? `${a}${m[i]}` : `${a}${i}`;
-  return M`
-        ${(i) => o(n, s, i.theme.typographyVariantMapping || {})} {
+  const i = (s, a, l) => l[s] ? `${a}${l[s]}` : `${a}${s}`;
+  return L`
+        ${(s) => i(n, o, s.theme.typographyVariantMapping || {})} {
             ${t}
         }
     `;
 };
-function rt(e, t) {
-  return t ? ye(e, t) : ye(e);
+function Dt(e, t) {
+  return t ? Be(e, t) : Be(e);
 }
-const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
-  attrs: e
-}), st = (e) => ({
+const Bt = (e) => (t) => /* @__PURE__ */ r.createElement(Sn, {
+  attrs: t,
+  htmlBody: e
+}), Tt = (e, t) => ({
   transform: {
-    a: et(e),
-    img: ot
+    a: Rt(e),
+    img: Bt(t)
   }
-}), it = (e) => nt(e, "a"), U = D((o, s) => {
-  var i = o, { className: e, children: t } = i, n = $(i, ["className", "children"]);
-  return /* @__PURE__ */ r.createElement(at, k(p({
+}), Nt = (e) => zt(e, "a"), ae = N((i, o) => {
+  var s = i, { className: e, children: t } = s, n = S(s, ["className", "children"]);
+  return /* @__PURE__ */ r.createElement(Vt, $(h({
     type: "button",
-    className: w(e, "humany-button")
-  }, R(n)), {
-    ref: s
+    className: M(e, "humany-button")
+  }, V(n)), {
+    ref: o
   }), t);
-}), at = v.button`
+}), Vt = C.button`
     -webkit-appearance: button;
     text-transform: none;
     overflow: visible;
@@ -233,239 +237,274 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
     line-height: normal;
     margin: 0;
     padding: 0;
-`, Cn = (o) => {
-  var i = o, {
+`, p1 = (i) => {
+  var s = i, {
     onChange: e = () => {
     },
     onEnter: t = () => {
     },
     className: n
-  } = i, s = $(i, [
+  } = s, o = S(s, [
     "onChange",
     "onEnter",
     "className"
   ]);
-  return /* @__PURE__ */ r.createElement("input", p({
-    className: w(n, "humany-checkbox"),
+  return /* @__PURE__ */ r.createElement("input", h({
+    className: M(n, "humany-checkbox"),
     onKeyDown: (a) => {
       a.key === "Enter" && t(a);
     },
     onChange: (a) => e(a.target.value, a.currentTarget.checked)
-  }, R(s)));
-}, ct = Z(new Pe()), lt = Z(1), $e = Z({
+  }, V(o)));
+}, Zt = Q(new pt()), Wt = Q(1), Fe = Q({
   id: "",
   type: "",
   name: "",
   branch: ""
-}), ut = Z({}), mt = Z(null), ae = () => O($e), T = () => O(ct), xn = (e, t) => {
-  const n = ae().id, s = T();
-  return (o, i) => {
-    (t || s).getAsync("actionResolver").then((a) => {
-      a.action(e || n, o, i);
+}), It = Q({}), Ot = Q(null), ye = () => X(Fe), Z = () => X(Zt), g1 = (e, t) => {
+  const n = ye().id, o = Z();
+  return (i, s) => {
+    (t || o).getAsync("actionResolver").then((a) => {
+      a.action(e || n, i, s);
     });
   };
-}, ce = (e) => {
-  const t = O($e), n = I(), [s, o] = L();
-  return C(() => {
+}, be = (e) => {
+  const t = X(Fe), n = _(), [o, i] = k();
+  return w(() => {
     if ((e || t.id) && n) {
-      const i = n.nodes.get(e || t.id);
-      o(i);
+      const s = n.nodes.get(e || t.id);
+      i(s);
     }
-  }, [e, t.id, n]), s;
-}, B = () => {
-  const e = S(!1);
-  return C(() => (e.current = !0, () => {
+  }, [e, t.id, n]), o;
+}, O = () => {
+  const e = R(!1);
+  return w(() => (e.current = !0, () => {
     e.current = !1;
   }), []), e;
-}, I = (e) => {
-  const t = T(), [n, s] = L(null), o = B();
-  return C(() => {
-    Ze.getInstance(e || t).then((i) => {
-      o.current && s(i);
+}, _ = (e) => {
+  const t = Z(), [n, o] = k(null), i = O();
+  return w(() => {
+    Ct.getInstance(e || t).then((s) => {
+      i.current && o(s);
     });
-  }, [o]), n;
-}, En = () => {
-  const e = ce(), t = I(), [n, s] = L([]), o = B(), i = H((a) => {
-    if (t && o.current) {
-      const m = t.getBranch(a), l = a.getChildren(m).map((c) => Ae(c));
-      s(l);
-    }
-  }, [o, t, s]);
-  return C(() => {
-    e && i(e);
-  }, [e, t]), C(() => {
+  }, [i]), n;
+}, C1 = () => {
+  const e = be(), t = _(), [n, o] = k([]), i = O(), s = H(
+    (a) => {
+      if (t && i.current) {
+        const l = t.getBranch(a), u = a.getChildren(l).map((c) => yt(c));
+        o(u);
+      }
+    },
+    [i, t, o]
+  );
+  return w(() => {
+    e && s(e);
+  }, [e, t]), w(() => {
     if (t) {
-      const [a, m] = Ke(t.events);
-      return a("components:set-layout", (l, c) => {
-        (e === c.node.parent || c.node.parent === t.nodes.root) && i(c.node.parent);
-      }), a("components:node-appended", (l, c) => {
-        (e === c.node.parent || c.node.parent === t.nodes.root) && i(c.node.parent);
-      }), a("components:node-removed", (l, { parentNode: c }) => {
-        (c === e || c === t.nodes.root) && i(c);
+      const [a, l] = bt(t.events);
+      return a("components:set-layout", (u, c) => {
+        (e === c.node.parent || c.node.parent === t.nodes.root) && s(c.node.parent);
+      }), a("components:node-appended", (u, c) => {
+        (e === c.node.parent || c.node.parent === t.nodes.root) && s(c.node.parent);
+      }), a("components:node-removed", (u, { parentNode: c }) => {
+        (c === e || c === t.nodes.root) && s(c);
       }), () => {
-        m();
+        l();
       };
     }
-  }, [e, t, i]), n;
-}, vn = () => O(lt), wn = (e, t) => {
-  const n = ae(), s = T(), [o, i] = L(void 0), a = B(), m = e || n.type || "";
-  return C(() => {
-    if (m) {
-      let l;
-      return (t || s).getAsync("componentResolver").then((c) => {
+  }, [e, t, s]), n;
+}, y1 = () => X(Wt), b1 = (e, t) => {
+  const n = ye(), o = Z(), [i, s] = k(void 0), a = O(), l = e || n.type || "";
+  return w(() => {
+    if (l) {
+      let u;
+      return (t || o).getAsync("componentResolver").then((c) => {
         if (a.current) {
-          const u = c.getComponent(m);
-          i(u);
+          const m = c.getComponent(l);
+          s(m);
         }
-        l = c.registerResolver(m, (u) => {
-          a.current && i(u);
+        u = c.registerResolver(l, (m) => {
+          a.current && s(m);
         });
       }), () => {
-        l && l();
+        u && u();
       };
     }
-  }, [a, m, t, s]), o;
-}, dt = (e) => {
-  const t = ce(e), n = I(), [s, o] = L({}), i = B();
-  return C(() => {
-    t && i.current && o(t.attributes.context);
-  }, [i, t]), C(() => {
+  }, [a, l, t, o]), i;
+}, Ft = (e) => {
+  const t = be(e), n = _(), [o, i] = k({}), s = O();
+  return w(() => {
+    t && s.current && i(t.attributes.context);
+  }, [s, t]), w(() => {
     if (n) {
-      const a = n.events.subscribe("components:context-changed", (m, l) => {
-        t === l.node && i.current && o(l.node.attributes.context);
-      });
+      const a = n.events.subscribe(
+        "components:context-changed",
+        (l, u) => {
+          t === u.node && s.current && i(u.node.attributes.context);
+        }
+      );
       return () => {
         a();
       };
     }
-  }, [i, n]), s;
-}, $n = () => {
-  const e = I(), t = ae(), [n, s] = L([]), [o, i] = L();
-  return C(() => {
+  }, [s, n]), o;
+}, v1 = () => {
+  const e = _(), t = ye(), [n, o] = k([]), [i, s] = k();
+  return w(() => {
     if (e && t) {
-      const a = new Ye(e).withId(t.id), m = e.actions(a, t.type || F());
-      i(m), n !== null && (n.forEach((l) => {
-        m.dispatch(l.key, l.data).then((c) => l.resolve(c)).catch((c) => l.reject(c));
-      }), s(null));
+      const a = new vt(e).withId(t.id), l = e.actions(a, t.type || q());
+      s(l), n !== null && (n.forEach((u) => {
+        l.dispatch(u.key, u.data).then((c) => u.resolve(c)).catch((c) => u.reject(c));
+      }), o(null));
     }
-  }, [e, t.id]), (a, m) => n !== null ? new Promise((l, c) => {
+  }, [e, t.id]), (a, l) => n !== null ? new Promise((u, c) => {
     n.push({
       key: a,
-      data: m,
-      resolve: l,
+      data: l,
+      resolve: u,
       reject: c
     });
-  }) : o.dispatch(a, m);
-}, z = (e, t, n = window, s = () => !0) => {
-  const o = S(() => {
+  }) : i.dispatch(a, l);
+}, I = (e, t, n = window, o = () => !0) => {
+  const i = R(() => {
   });
-  C(() => {
-    o.current = t;
-  }, [t]), C(() => {
-    if (!(n && s()))
+  w(() => {
+    i.current = t;
+  }, [t]), w(() => {
+    if (!(n && o()))
       return;
-    const a = (m) => o.current(m);
+    const a = (l) => i.current(l);
     return n.addEventListener(e, a), () => {
       n.removeEventListener(e, a);
     };
   }, [e, n]);
-}, ft = (e) => {
-  const t = T(), { events: n } = (e || t).get("$widget");
+}, At = (e) => {
+  const t = Z(), { events: n } = (e || t).get("$widget");
   return n;
-}, q = (e, t) => {
-  const [n, s] = L(!1), o = H((a) => {
-    const { key: m } = a;
-    m === e && (s(!0), t && t(a));
-  }, [s, t]), i = H(({ key: a }) => {
-    a === e && s(!1);
-  }, [s]);
-  return z("keydown", o, window), z("keyup", i, window), n;
-}, kn = (e) => {
-  const t = ce(e), n = I(), [s, o] = L({}), i = B();
-  return C(() => {
-    t && i.current && o(t.attributes.layout);
-  }, [t, i]), C(() => {
+}, w1 = () => {
+  const [e, t] = k(!1);
+  return w(() => {
+    const n = () => {
+      t(!1);
+    }, o = (i) => {
+      i.keyCode === 9 && t(!0);
+    };
+    return window.addEventListener("keydown", o), window.addEventListener("click", n), () => {
+      window.removeEventListener("keydown", o), window.removeEventListener("click", n);
+    };
+  }, []), e;
+}, j = (e, t) => {
+  const [n, o] = k(!1), i = H(
+    (a) => {
+      const { key: l } = a;
+      l === e && (o(!0), t && t(a));
+    },
+    [o, t]
+  ), s = H(
+    ({ key: a }) => {
+      a === e && o(!1);
+    },
+    [o]
+  );
+  return I("keydown", i, window), I("keyup", s, window), n;
+}, E1 = (e) => {
+  const t = be(e), n = _(), [o, i] = k({}), s = O();
+  return w(() => {
+    t && s.current && i(t.attributes.layout);
+  }, [t, s]), w(() => {
     if (n) {
-      const a = n.events.subscribe("components:layout-changed", (m, l) => {
-        t === l.node && i.current && o(l.node.attributes.layout);
-      });
+      const a = n.events.subscribe(
+        "components:layout-changed",
+        (l, u) => {
+          t === u.node && s.current && i(u.node.attributes.layout);
+        }
+      );
       return () => {
         a();
       };
     }
-  }, [n, i]), s;
-}, ke = (e) => {
-  const t = S();
-  return C(() => {
+  }, [n, s]), o;
+}, Ae = (e) => {
+  const t = R();
+  return w(() => {
     t.current = e;
   }), t.current;
-}, Ln = () => O(ut), Mn = (e) => {
-  const [t, n] = L(), s = T(), o = B();
-  return C(() => {
-    let i;
-    const a = (e || s).get("$widget");
+}, x1 = () => X(It), k1 = (e) => {
+  const [t, n] = k(), o = Z(), i = O();
+  return w(() => {
+    let s;
+    const a = (e || o).get("$widget");
     if (!a)
       return;
-    const { name: m, invoke: l } = a;
-    return l("renderState").then((c) => {
-      o.current && n(c);
-    }), (e || s).getAsync("actionResolver").then((c) => {
-      i = c.subscribe(m, (u, f) => {
-        switch (f) {
+    const { name: l, invoke: u } = a;
+    return u("renderState").then((c) => {
+      i.current && n(c);
+    }), (e || o).getAsync("actionResolver").then((c) => {
+      s = c.subscribe(l, (m, p) => {
+        switch (p) {
           case "close":
           case "open":
-            o.current && n(f === "open" ? j.open : j.closed);
+            i.current && n(
+              p === "open" ? oe.open : oe.closed
+            );
             break;
           case "hide":
-            o.current && n(j.hidden);
+            i.current && n(oe.hidden);
         }
       });
     }), () => {
-      i && i();
+      s && s();
     };
-  }, [o]), t;
-}, Le = () => O(mt), Sn = (e) => {
-  const t = T(), n = Le(), [s, o] = L({ name: "", params: {} }), i = B();
-  return C(() => {
+  }, [i]), t;
+}, Pe = () => X(Ot), $1 = (e) => {
+  const t = Z(), n = Pe(), [o, i] = k({ name: "", params: {} }), s = O();
+  return w(() => {
     const a = (e || t).get("$widget");
     if (!a)
       return;
-    const { events: m } = a;
-    return m.subscribe("router:change", (c, { next: { routeData: u } }) => {
-      if (i.current) {
-        const { name: f, params: d } = u;
-        ge(d), o({ name: f, params: d });
+    const { events: l } = a;
+    return l.subscribe("router:change", (c, { next: { routeData: m } }) => {
+      if (s.current) {
+        const { name: p, params: d } = m;
+        De(d), i({ name: p, params: d });
       }
     });
-  }, [i, e, t]), C(() => {
-    if (n && n.history && i.current) {
-      const a = n.getRouteData(), { name: m, params: l } = a;
-      ge(l), o({ name: m, params: l });
-    }
-  }, [n, i]), s;
-}, Me = (e) => {
-  const t = S(), n = S(0);
-  let s;
-  const o = H(() => {
+  }, [s, e, t]), w(() => {
+    if (n && n.history && s.current) {
+      const a = n.getRouteData(), { name: l, params: u } = a;
+      De(u), i({ name: l, params: u });
+    }
+  }, [n, s]), o;
+}, Ke = (e) => {
+  const t = R(), n = R(0);
+  let o;
+  const i = H(() => {
     var c;
-    (c = t.current) == null || c.classList.add("humany-scrolling"), clearTimeout(s), s = setTimeout(() => {
-      var u;
-      (u = t.current) == null || u.classList.remove("humany-scrolling");
+    (c = t.current) == null || c.classList.add("humany-scrolling"), clearTimeout(o), o = setTimeout(() => {
+      var m;
+      (m = t.current) == null || m.classList.remove("humany-scrolling");
     }, 500);
-  }, [t]), i = H((c) => {
-    n.current = c.touches[0].clientY;
-  }, [t]), a = (c) => m(c) ? c === t.current ? c : null : c.parentElement ? a(c.parentElement) : null, m = (c) => c.scrollWidth > c.clientWidth || c.scrollHeight > c.clientHeight, l = H((c) => {
-    if (!c.cancelable)
-      return;
-    const u = c.touches[0].clientY, f = a(c.target);
-    if (!f)
-      return;
-    const d = f.scrollTop, h = n.current - u < 0 ? "up" : "down", g = d <= 0 && h === "up", E = d >= f.scrollHeight - f.offsetHeight && h === "down";
-    (g || E) && c.preventDefault(), n.current = u;
-  }, [t, n]);
-  return z("scroll", o, t.current, () => t.current && e), z("touchstart", i, t.current, () => t.current && e), z("touchmove", l, t.current, () => t.current && e), e ? [ht, t] : ["", t];
-}, ht = `
-    overflow-y: ${Ce() === se.Chrome || Ce() === se.EdgeChromium ? "overlay" : "auto"};
+  }, [t]), s = H(
+    (c) => {
+      n.current = c.touches[0].clientY;
+    },
+    [t]
+  ), a = (c) => l(c) ? c === t.current ? c : null : c.parentElement ? a(c.parentElement) : null, l = (c) => c.scrollWidth > c.clientWidth || c.scrollHeight > c.clientHeight, u = H(
+    (c) => {
+      if (!c.cancelable)
+        return;
+      const m = c.touches[0].clientY, p = a(c.target);
+      if (!p)
+        return;
+      const d = p.scrollTop, f = n.current - m < 0 ? "up" : "down", g = d <= 0 && f === "up", E = d >= p.scrollHeight - p.offsetHeight && f === "down";
+      (g || E) && c.preventDefault(), n.current = m;
+    },
+    [t, n]
+  );
+  return I("scroll", i, t.current, () => t.current && e), I("touchstart", s, t.current, () => t.current && e), I("touchmove", u, t.current, () => t.current && e), e ? [Pt, t] : ["", t];
+}, Pt = `
+    overflow-y: ${Ne() === pe.Chrome || Ne() === pe.EdgeChromium ? "overlay" : "auto"};
     overflow-x: hidden;
     -ms-overflow-style: none; /* IE 10+ */
     scrollbar-width: thin; /* Firefox */
@@ -492,58 +531,61 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             background-color: #7F7F7F;
         }
     }
-`, Hn = () => {
-  const [e, t] = L(null), n = T(), s = B();
-  return C(() => {
-    n.get("settings").then((o) => {
-      s.current && t(o);
+`, L1 = () => {
+  const [e, t] = k(null), n = Z(), o = O();
+  return w(() => {
+    n.get("settings").then((i) => {
+      o.current && t(i);
     });
-  }, [s]), e;
-}, le = (e = !1) => {
-  const [t, n] = L(e), s = H((o) => {
-    n(typeof o == "boolean" ? o : (i) => !i);
+  }, [o]), e;
+}, Ye = (e = !1) => {
+  const [t, n] = k(e), o = H((i) => {
+    n(typeof i == "boolean" ? i : (s) => !s);
   }, []);
-  return [t, s];
-}, Rn = (e) => {
-  const t = T(), n = I(), s = t.get("widgetDOMElement"), [o, i] = L(null), [a, m] = L(null), l = B();
-  C(() => {
-    if (n && l.current) {
-      const u = n.nodes.all.find((d) => d.name === "root-area"), f = n.nodes.all.find((d) => d.type === "view");
-      if (!(f != null && f.attributes.properties.animation) && !(u != null && u.attributes.properties.animation))
+  return [t, o];
+}, M1 = (e) => {
+  const t = Z(), n = _(), o = t.get("widgetDOMElement"), [i, s] = k(null), [a, l] = k(null), u = O();
+  w(() => {
+    if (n && u.current) {
+      const m = n.nodes.all.find((d) => d.name === "root-area"), p = n.nodes.all.find((d) => d.type === "view");
+      if (!(p != null && p.attributes.properties.animation) && !(m != null && m.attributes.properties.animation))
         e();
       else {
-        const d = (E = "") => s == null ? void 0 : s.querySelector(`[data-node-id="${E}"]`), h = d(f == null ? void 0 : f.id);
-        h && i(h);
-        const g = d(u == null ? void 0 : u.id);
-        g && m(g);
+        const d = (E = "") => o == null ? void 0 : o.querySelector(`[data-node-id="${E}"]`), f = d(p == null ? void 0 : p.id);
+        f && s(f);
+        const g = d(m == null ? void 0 : m.id);
+        g && l(g);
       }
     }
-  }, [n, t, l]);
-  const c = H((u) => {
-    l.current && (u.target === o || u.target === a) && e();
-  }, [e, l, o, a]);
-  z("transitionend", c, o), z("transitionend", c, a);
-}, Q = (e, t, n = [], s) => {
-  const o = ft(s);
-  return C(() => {
-    if (o) {
-      const i = o.subscribe(e, t);
+  }, [n, t, u]);
+  const c = H(
+    (m) => {
+      u.current && (m.target === i || m.target === a) && e();
+    },
+    [e, u, i, a]
+  );
+  I("transitionend", c, i), I("transitionend", c, a);
+}, ce = (e, t, n = [], o) => {
+  const i = At(o);
+  return w(() => {
+    if (i) {
+      const s = i.subscribe(e, t);
       return () => {
-        i();
+        s();
       };
     }
-  }, [o].concat(n)), (i) => o == null ? void 0 : o.dispatch(e, i);
-}, ue = (e, t) => {
-  const n = Q("widget:menu-toggled", (s, o) => {
-    o !== e && t();
+  }, [i].concat(n)), (s) => i == null ? void 0 : i.dispatch(e, s);
+}, ve = (e, t) => {
+  const n = ce("widget:menu-toggled", (o, i) => {
+    i !== e && t();
   });
   return () => n(e);
-}, me = (s) => {
-  var o = s, { className: e, children: t } = o, n = $(o, ["className", "children"]);
-  return /* @__PURE__ */ r.createElement("span", p({
-    className: w(e, "humany-text")
-  }, R(n)), t);
-}, Se = M`
+}, we = (o) => {
+  var i = o, { className: e, children: t } = i, n = S(i, ["className", "children"]);
+  return /* @__PURE__ */ r.createElement("span", h({
+    className: M(e, "humany-text")
+  }, V(n)), t);
+}, je = L`
     display: flex;
     justify-content: center;
     flex-direction: column;
@@ -552,7 +594,7 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
     border: ${(e) => e.theme.border};
     box-shadow: ${(e) => e.theme.boxShadow || "none"};
     ${(e) => e["data-loading"] && "min-height: 150px;"}
-`, pt = M`
+`, Kt = L`
     cursor: pointer;
     text-align: center;
     border: none;
@@ -570,12 +612,12 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
   return (t = e.theme.fonts) == null ? void 0 : t.normal;
 }};
     font-weight: 300;
-`, Dn = ({
+`, S1 = ({
   primaryColor: e,
   secondaryColor: t,
   active: n
-}) => M`
-    ${pt}
+}) => L`
+    ${Kt}
     border: 1px solid ${n ? t : e};
     background-color: ${n ? e : t};
 
@@ -588,13 +630,13 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
     a {
         transition: color 200ms ease-out;
         color: ${n ? t : e};
-        font-size: ${(s) => {
-  var o;
-  return (o = s.theme.fonts) == null ? void 0 : o.normal;
+        font-size: ${(o) => {
+  var i;
+  return (i = o.theme.fonts) == null ? void 0 : i.normal;
 }};
     }
 
-    ${(s) => !s.disabled && M`
+    ${(o) => !o.disabled && L`
             &:hover {
                 background-color: ${e};
                 color: ${t};
@@ -607,14 +649,11 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
                 }
             }
 
-            &:focus {
-                ${(o) => {
-  var i;
-  return ((i = o.theme.accessibility) == null ? void 0 : i.isTabbing) && P;
-}};
+            &:focus-visible {
+                ${P};
             }
         `}
-`, P = M`
+`, P = L`
     outline: ${(e) => {
   var t;
   return (t = e.theme.accessibility) == null ? void 0 : t.border;
@@ -624,16 +663,16 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
   return (n = (t = e.theme.accessibility) == null ? void 0 : t.colors) == null ? void 0 : n.inactiveText;
 }};
     border-color: transparent;
-`, Tn = M`
+`, Yt = L`
     ${P}
     text-decoration: underline;
-`, Nn = M`
+`, R1 = L`
     ${P}
     outline-offset: ${(e) => {
   var t;
   return (t = e.theme.sizes) == null ? void 0 : t.small;
 }};
-`, de = v(U)`
+`, Ee = C(ae)`
     position: absolute;
     top: ${(e) => {
   var t;
@@ -652,21 +691,16 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
 }};
     }
 
-    &:focus {
-        ${(e) => {
+    &:focus-visible {
+        ${P}
+        padding: ${(e) => {
   var t;
-  return ((t = e.theme.accessibility) == null ? void 0 : t.isTabbing) && M`
-                ${P}
-                padding: ${(n) => {
-    var s;
-    return (s = n.theme.sizes) == null ? void 0 : s.small;
-  }};
-                height: 15px;
-                box-sizing: content-box;
-            `;
+  return (t = e.theme.sizes) == null ? void 0 : t.small;
 }};
+        height: 15px;
+        box-sizing: content-box;
     }
-`, xe = v(me)`
+`, Ve = C(we)`
     font-size: ${(e) => {
   var t;
   return (t = e.theme.fonts) == null ? void 0 : t.normal;
@@ -677,7 +711,7 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
   var t;
   return (t = e.theme.colors) == null ? void 0 : t.text;
 }};
-`, gt = M`
+`, jt = L`
     padding: 0;
     margin: 0;
     list-style: none;
@@ -699,38 +733,43 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
     > li:last-child {
         margin: 0;
     }
-`, zn = M`
+`, H1 = L`
     > div {
-        ${X("> h1", M`
+        ${se(
+  "> h1",
+  L`
                 margin: 0 0 ${(e) => {
-  var t;
-  return (t = e.theme.sizes) == null ? void 0 : t.normal;
-}};
+    var t;
+    return (t = e.theme.sizes) == null ? void 0 : t.normal;
+  }};
                 font-size: ${(e) => {
-  var t;
-  return (t = e.theme.fonts) == null ? void 0 : t.medium;
-}};
+    var t;
+    return (t = e.theme.fonts) == null ? void 0 : t.medium;
+  }};
                 font-weight: normal;
                 line-height: 1.8em;
                 color: ${(e) => {
-  var t;
-  return (t = e.theme.colors) == null ? void 0 : t.text;
-}};
-            `)}
+    var t;
+    return (t = e.theme.colors) == null ? void 0 : t.text;
+  }};
+            `
+)}
     }
     > ul {
-        ${gt}
+        ${jt}
     }
 
-    ${X("h1", M`
+    ${se(
+  "h1",
+  L`
             display: flex;
             align-items: center;
 
             i {
                 margin: 7px ${(e) => {
-  var t;
-  return (t = e.theme.sizes) == null ? void 0 : t.normal;
-}} 0 0;
+    var t;
+    return (t = e.theme.sizes) == null ? void 0 : t.normal;
+  }} 0 0;
                 width: 24px;
                 display: inline-block;
                 vertical-align: text-bottom;
@@ -739,27 +778,102 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
                 min-height: 24px;
                 text-align: center;
             }
-        `)}
-`, G = ({ elementId: e = "humany-portal-elements", children: t }) => {
-  const [n] = r.useState(() => {
-    const s = document.getElementById(e) || document.createElement("div");
-    return s.id = e, s;
+        `
+)}
+`, z1 = L`
+    font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.normal;
+}};
+    font-weight: 300;
+    line-height: 1.5em;
+    color: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
+}};
+
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+        word-break: break-word;
+        &:first-child {
+            margin-top: 0;
+        }
+        &:only-child {
+            margin: 0;
+        }
+        &:last-child {
+            margin-bottom: 0;
+        }
+    }
+
+    a {
+        color: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.link;
+}};
+        &:focus-visible {
+            ${Yt};
+        }
+    }
+
+    img {
+        max-width: 100% !important;
+        height: auto !important;
+    }
+
+    p {
+        word-break: break-word;
+        margin: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.normal;
+}} 0;
+    }
+
+    p:first-child {
+        margin: 0 0 ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.normal;
+}};
+    }
+
+    p:last-child {
+        margin: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.normal;
+}} 0 0;
+    }
+
+    p:only-child {
+        margin: 0;
+    }
+`, G = ({
+  elementId: e = "humany-portal-elements",
+  parent: t = document.body,
+  children: n
+}) => {
+  const [o] = k(() => {
+    const i = document.getElementById(e) || document.createElement("div");
+    return i.id = e, i;
   });
-  return C(() => (document.body.appendChild(n), () => {
-    n.childElementCount <= 1 && document.body.removeChild(n);
-  }), [n]), Xe(t, n);
-}, A = (m) => {
-  var l = m, {
+  return w(() => (t.appendChild(o), () => {
+    o.childElementCount <= 1 && t.removeChild(o);
+  }), [o]), Et(n, o);
+}, J = (l) => {
+  var u = l, {
     text: e = "",
     backgroundSize: t = "contain",
     size: n = 12,
-    symbol: s = {
+    symbol: o = {
       content: "",
       type: ""
     },
-    elementStyle: o = {},
-    className: i
-  } = l, a = $(l, [
+    elementStyle: i = {},
+    className: s
+  } = u, a = S(u, [
     "text",
     "backgroundSize",
     "size",
@@ -767,7 +881,7 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
     "elementStyle",
     "className"
   ]);
-  const { type: c, content: u } = s, f = {
+  const { type: c, content: m } = o, p = {
     "aria-label": e,
     role: "presentation"
   };
@@ -775,29 +889,29 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
     case "Uri": {
       const d = {
         backgroundSize: t,
-        backgroundImage: `url('${u}')`,
+        backgroundImage: `url('${m}')`,
         backgroundRepeat: "no-repeat",
         backgroundPosition: "center",
         backgroundAttachment: "center"
       };
-      return /* @__PURE__ */ r.createElement("i", p(p({
-        className: w(i, "humany-icon", "humany-custom-icon"),
+      return /* @__PURE__ */ r.createElement("i", h(h({
+        className: M(s, "humany-icon", "humany-custom-icon"),
         title: e,
-        style: p(p({}, d), o)
-      }, f), a));
+        style: h(h({}, d), i)
+      }, p), a));
     }
     case "Svg": {
-      const d = k(p({
-        className: w(i, "humany-icon"),
+      const d = $(h({
+        className: M(s, "humany-icon"),
         width: `${n}`,
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
       }, a), {
         ref: null
-      }), h = { minWidth: `${n}` };
-      switch (u) {
+      }), f = { minWidth: `${n}` };
+      switch (m) {
         case "search":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 32 30"
           }, d), /* @__PURE__ */ r.createElement("circle", {
             cx: "14.8457",
@@ -811,7 +925,7 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             y2: "25.9661"
           }));
         case "clear":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 27 27"
           }, d), /* @__PURE__ */ r.createElement("circle", {
             cx: "13.4351",
@@ -833,7 +947,7 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             stroke: "black"
           }));
         case "close":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 13 13"
           }, d), /* @__PURE__ */ r.createElement("path", {
             d: "M12.3068 0.50647L1.27246 11.7273",
@@ -843,9 +957,9 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             stroke: "black"
           }));
         case "caret-right":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 14 14",
-            style: h
+            style: f
           }, d), /* @__PURE__ */ r.createElement("line", {
             x1: "4.13",
             y1: "1.05",
@@ -860,9 +974,9 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             stroke: "black"
           }));
         case "caret-left":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 14 14",
-            style: h
+            style: f
           }, d), /* @__PURE__ */ r.createElement("line", {
             x1: "10.13",
             y1: "12.95",
@@ -877,9 +991,9 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             stroke: "black"
           }));
         case "caret-up":
-          return /* @__PURE__ */ r.createElement(yt, p({
+          return /* @__PURE__ */ r.createElement(Xt, h({
             viewBox: "0 0 14 14",
-            style: h
+            style: f
           }, d), /* @__PURE__ */ r.createElement("line", {
             x1: "13.09",
             y1: "3.99",
@@ -894,9 +1008,9 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             stroke: "black"
           }));
         case "caret-down":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 14 14",
-            style: h
+            style: f
           }, d), /* @__PURE__ */ r.createElement("line", {
             x1: "13.09",
             y1: "3.99",
@@ -911,7 +1025,7 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             stroke: "black"
           }));
         case "back":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 18 18"
           }, d), /* @__PURE__ */ r.createElement("line", {
             y1: "-0.5",
@@ -927,7 +1041,7 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             stroke: "white"
           }));
         case "alert":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 19 19"
           }, d), /* @__PURE__ */ r.createElement("circle", {
             cx: "9.5",
@@ -939,7 +1053,7 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             fill: "white"
           }));
         case "send":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 20 17"
           }, d), /* @__PURE__ */ r.createElement("path", {
             d: "M18.95 8.56428L0.949951 0.941406V7.02531L13.6351 8.47059L0.950001 9.92276L0.949951 15.9414L18.95 8.56428Z",
@@ -948,7 +1062,7 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             strokeWidth: "0.1"
           }));
         case "chat":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "-2 -3 40 40"
           }, d), /* @__PURE__ */ r.createElement("path", {
             strokeWidth: "0",
@@ -970,7 +1084,7 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             fill: "currentColor"
           }));
         case "chat-new":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 26 24"
           }, d), /* @__PURE__ */ r.createElement("path", {
             d: "M22.1109 10.3813C22.3941 10.2876 22.6674 10.1722 22.9288 10.0371C23.1902 10.9797 23.33 11.9734 23.33 13C23.33 19.0751 18.4348 24 12.3962 24C9.6352 24 7.11325 22.9705 5.18893 21.2721L0.82251 22.8226C0.277922 23.0159 -0.207515 22.4161 0.0911259 21.9188L2.55952 17.8084C1.85665 16.3558 1.46233 14.7242 1.46233 13C1.46233 6.92487 6.35758 2 12.3962 2C13.4013 2 14.3747 2.13645 15.2992 2.39193C15.1628 2.65458 15.0464 2.92925 14.9519 3.21394C14.1358 2.99881 13.2793 2.88427 12.3962 2.88427C6.84301 2.88427 2.34128 7.41324 2.34128 13C2.34128 14.7493 2.78263 16.3949 3.5594 17.8302L1.18047 21.7634L5.41046 20.2757C7.21939 22.034 9.68221 23.1157 12.3962 23.1157C17.9493 23.1157 22.451 18.5868 22.451 13C22.451 12.0944 22.3328 11.2165 22.1109 10.3813Z",
@@ -980,7 +1094,7 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             fill: "currentColor"
           }));
         case "agent":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 36 30"
           }, d), /* @__PURE__ */ r.createElement("path", {
             d: "M0.900024 15.3887C0.900024 12.9034 2.91474 10.8887 5.40002 10.8887H6.28179V20.0995H5.40002C2.91474 20.0995 0.900024 18.0848 0.900024 15.5995V15.3887Z",
@@ -1001,20 +1115,20 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             stroke: "white"
           }));
         case "minimize":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 -10 22 22"
           }, d), /* @__PURE__ */ r.createElement("path", {
             d: "M0 1H22",
             stroke: "white"
           }));
         case "sorting":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 18 14"
           }, d), /* @__PURE__ */ r.createElement("path", {
             d: "M18 1H0M8 13H0M13 7H0"
           }));
         case "copy":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 19 17"
           }, d), /* @__PURE__ */ r.createElement("rect", {
             x: "0.5",
@@ -1032,7 +1146,7 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             fill: "white"
           }));
         case "print":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 16 17"
           }, d), /* @__PURE__ */ r.createElement("path", {
             d: "M4.31592 0.999999C4.31592 0.723857 4.53977 0.5 4.81592 0.5H11.1845C11.4606 0.5 11.6845 0.723858 11.6845 1V4.53323H4.31592V0.999999Z",
@@ -1066,14 +1180,14 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             stroke: "black"
           }));
         case "language":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 19 19"
           }, d), /* @__PURE__ */ r.createElement("path", {
             d: "M9.5 18C14.1944 18 18 14.1944 18 9.5C18 4.80558 14.1944 1 9.5 1M9.5 18C4.80558 18 1 14.1944 1 9.5C1 4.80558 4.80558 1 9.5 1M9.5 18C11.823 18 13.7062 14.1944 13.7062 9.5C13.7062 4.80558 11.823 1 9.5 1M9.5 18C7.17699 18 5.29381 14.1944 5.29381 9.5C5.29381 4.80558 7.17699 1 9.5 1M1.44333 6.78351H17.4742M1.3088 11.7784H17.6912",
             stroke: "black"
           }));
         case "information":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 17 17"
           }, d), /* @__PURE__ */ r.createElement("path", {
             d: "M9.72182 5.99993C10.0524 5.99993 10.3203 5.73198 10.3203 5.40145C10.3203 5.07092 10.0524 4.80297 9.72182 4.80297C9.39129 4.80297 9.12335 5.07092 9.12335 5.40145C9.12335 5.73198 9.39129 5.99993 9.72182 5.99993Z",
@@ -1088,7 +1202,7 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             fill: "black"
           }));
         case "options":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 16 2"
           }, d), /* @__PURE__ */ r.createElement("circle", {
             cx: "15",
@@ -1109,15 +1223,64 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             transform: "rotate(90 8 1)",
             fill: "black"
           }));
+        case "browse":
+          return /* @__PURE__ */ r.createElement("svg", h({
+            viewBox: "0 0 24 24"
+          }, d), /* @__PURE__ */ r.createElement("circle", {
+            cx: "12",
+            cy: "12",
+            r: "12",
+            fill: "currentColor"
+          }), /* @__PURE__ */ r.createElement("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M6.16663 7.33334C6.16663 6.68901 6.68896 6.16667 7.33329 6.16667H10.25C10.8943 6.16667 11.4166 6.68901 11.4166 7.33334V10.25C11.4166 10.8943 10.8943 11.4167 10.25 11.4167H7.33329C6.68896 11.4167 6.16663 10.8943 6.16663 10.25V7.33334ZM7.33329 7.04167H10.25C10.411 7.04167 10.5416 7.17226 10.5416 7.33334V10.25C10.5416 10.4111 10.411 10.5417 10.25 10.5417H7.33329C7.17221 10.5417 7.04163 10.4111 7.04163 10.25V7.33334C7.04163 7.17226 7.17221 7.04167 7.33329 7.04167Z",
+            fill: "white"
+          }), /* @__PURE__ */ r.createElement("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M6.16663 13.75C6.16663 13.1057 6.68896 12.5833 7.33329 12.5833H10.25C10.8943 12.5833 11.4166 13.1057 11.4166 13.75V16.6667C11.4166 17.311 10.8943 17.8333 10.25 17.8333H7.33329C6.68896 17.8333 6.16663 17.311 6.16663 16.6667V13.75ZM7.33329 13.4583H10.25C10.411 13.4583 10.5416 13.5889 10.5416 13.75V16.6667C10.5416 16.8278 10.411 16.9583 10.25 16.9583H7.33329C7.17221 16.9583 7.04163 16.8278 7.04163 16.6667V13.75C7.04163 13.5889 7.17221 13.4583 7.33329 13.4583Z",
+            fill: "white"
+          }), /* @__PURE__ */ r.createElement("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M13.75 6.16667C13.1056 6.16667 12.5833 6.68901 12.5833 7.33334V10.25C12.5833 10.8943 13.1056 11.4167 13.75 11.4167H16.6666C17.311 11.4167 17.8333 10.8943 17.8333 10.25V7.33334C17.8333 6.68901 17.311 6.16667 16.6666 6.16667H13.75ZM16.6666 7.04167H13.75C13.5889 7.04167 13.4583 7.17226 13.4583 7.33334V10.25C13.4583 10.4111 13.5889 10.5417 13.75 10.5417H16.6666C16.8277 10.5417 16.9583 10.4111 16.9583 10.25V7.33334C16.9583 7.17226 16.8277 7.04167 16.6666 7.04167Z",
+            fill: "white"
+          }), /* @__PURE__ */ r.createElement("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M17.8333 15.2083C17.8333 16.6581 16.658 17.8333 15.2083 17.8333C13.7585 17.8333 12.5833 16.6581 12.5833 15.2083C12.5833 13.7586 13.7585 12.5833 15.2083 12.5833C16.658 12.5833 17.8333 13.7586 17.8333 15.2083ZM16.9583 15.2083C16.9583 16.1748 16.1748 16.9583 15.2083 16.9583C14.2418 16.9583 13.4583 16.1748 13.4583 15.2083C13.4583 14.2418 14.2418 13.4583 15.2083 13.4583C16.1748 13.4583 16.9583 14.2418 16.9583 15.2083Z",
+            fill: "white"
+          }));
+        case "video":
+          return f.minWidth && typeof f.minWidth == "number" && (f.minWidth = `${f.minWidth}px`), /* @__PURE__ */ r.createElement("svg", $(h({
+            viewBox: "0 0 25 25"
+          }, d), {
+            style: f
+          }), /* @__PURE__ */ r.createElement("path", {
+            d: "M16.8245 10.0758C18.7392 8.55799 21.3085 7.08973 21.7947 7.61552C22.5982 8.47863 22.5288 16.6929 21.7947 17.4766C21.3482 17.9627 18.7589 16.4945 16.8245 14.9866",
+            stroke: "currentColor",
+            strokeWidth: "1.5",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }), /* @__PURE__ */ r.createElement("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M2.61914 12.5385C2.61914 7.12973 4.41578 5.32715 9.80764 5.32715C15.1985 5.32715 16.9952 7.12973 16.9952 12.5385C16.9952 17.9462 15.1985 19.7497 9.80764 19.7497C4.41578 19.7497 2.61914 17.9462 2.61914 12.5385Z",
+            stroke: "currentColor",
+            strokeWidth: "1.5",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }));
         case "star-empty":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 13 12"
           }, d), /* @__PURE__ */ r.createElement("path", {
             d: "M2 5.2767L5.11944 4.81796L6.70023 2L7.96487 4.81796L11 5.51699L8.75527 7.64684L9.18735 11L6.42623 9.40534L3.62295 10.7925L4.21311 7.64684L2 5.2767Z",
             stroke: "black"
           }));
         case "star-filled":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 13 12"
           }, d), /* @__PURE__ */ r.createElement("path", {
             d: "M2 5.2767L5.11944 4.81796L6.70023 2L7.96487 4.81796L11 5.51699L8.75527 7.64684L9.18735 11L6.42623 9.40534L3.62295 10.7925L4.21311 7.64684L2 5.2767Z",
@@ -1125,7 +1288,7 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             stroke: "black"
           }));
         case "cog-wheel":
-          return /* @__PURE__ */ r.createElement("svg", p({
+          return /* @__PURE__ */ r.createElement("svg", h({
             viewBox: "0 0 24 24"
           }, d), /* @__PURE__ */ r.createElement("path", {
             fillRule: "evenodd",
@@ -1133,25 +1296,92 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
             d: "M15.273 2.68498V1C15.273 0.447715 14.8253 0 14.273 0H9.72754C9.17525 0 8.72754 0.447715 8.72754 1V2.6852C8.72754 3.20708 8.09656 3.46843 7.72754 3.09941L6.53588 1.90775C6.14536 1.51723 5.51219 1.51723 5.12167 1.90775L1.90755 5.12187C1.51702 5.5124 1.51702 6.14556 1.90755 6.53609L3.09865 7.72719C3.46767 8.09621 3.20632 8.72719 2.68444 8.72719H1C0.447715 8.72719 0 9.1749 0 9.72719V14.2726C0 14.8249 0.447715 15.2726 1 15.2726H2.68534C3.20722 15.2726 3.46857 15.9036 3.09955 16.2726L1.90793 17.4643C1.51741 17.8548 1.51741 18.488 1.90793 18.8785L5.12205 22.0926C5.51258 22.4831 6.14574 22.4831 6.53627 22.0926L7.72754 20.9013C8.09656 20.5323 8.72754 20.7937 8.72754 21.3155V23C8.72754 23.5523 9.17525 24 9.72754 24H14.273C14.8253 24 15.273 23.5523 15.273 23V21.3158C15.273 20.7939 15.904 20.5325 16.273 20.9015L17.4639 22.0924C17.8544 22.483 18.4876 22.483 18.8781 22.0924L22.0922 18.8783C22.4828 18.4878 22.4828 17.8546 22.0922 17.4641L20.9008 16.2726C20.5317 15.9036 20.7931 15.2726 21.315 15.2726H23C23.5523 15.2726 24 14.8249 24 14.2726V9.72719C24 9.1749 23.5523 8.72719 23 8.72719H21.3159C20.794 8.72719 20.5326 8.09621 20.9017 7.72719L22.0926 6.53625C22.4831 6.14572 22.4831 5.51256 22.0926 5.12203L18.8785 1.90791C18.488 1.51739 17.8548 1.51739 17.4643 1.90791L16.273 3.0992C15.904 3.46822 15.273 3.20686 15.273 2.68498ZM16.5792 4.20716C16.263 4.52345 15.7775 4.58532 15.3687 4.40375C15.2439 4.34832 15.1174 4.29587 14.9895 4.2465C14.5723 4.08555 14.273 3.69861 14.273 3.25149V2C14.273 1.44771 13.8253 1 13.273 1H10.7275C10.1753 1 9.72754 1.44772 9.72754 2V3.25116C9.72754 3.69832 9.42816 4.08528 9.01096 4.2462C8.88288 4.29561 8.75633 4.34809 8.6314 4.40357C8.22262 4.58511 7.73715 4.52323 7.42087 4.20695L6.53588 3.32196C6.14536 2.93144 5.51219 2.93144 5.12167 3.32196L3.32176 5.12187C2.93124 5.5124 2.93124 6.14556 3.32176 6.53609L4.20676 7.42109C4.52303 7.73736 4.58491 8.22283 4.40338 8.63161C4.34797 8.75638 4.29555 8.88276 4.2462 9.01067C4.08526 9.42784 3.69831 9.72719 3.25118 9.72719H2C1.44772 9.72719 1 10.1749 1 10.7272V13.2726C1 13.8249 1.44772 14.2726 2 14.2726H3.2511C3.69825 14.2726 4.0852 14.572 4.24614 14.9892C4.29556 15.1173 4.34807 15.2439 4.40357 15.3688C4.58513 15.7776 4.52327 16.2631 4.20698 16.5794L3.32215 17.4643C2.93162 17.8548 2.93162 18.488 3.32215 18.8785L5.12205 20.6784C5.51258 21.0689 6.14574 21.0689 6.53627 20.6784L7.42136 19.7933C7.73762 19.477 8.22305 19.4151 8.63183 19.5966C8.75662 19.6521 8.88302 19.7045 9.01096 19.7538C9.42816 19.9147 9.72754 20.3017 9.72754 20.7489V22C9.72754 22.5523 10.1753 23 10.7275 23H13.273C13.8253 23 14.273 22.5523 14.273 22V20.7485C14.273 20.3014 14.5723 19.9145 14.9895 19.7535C15.1173 19.7042 15.2436 19.6518 15.3682 19.5965C15.777 19.4149 16.2625 19.4768 16.5788 19.7931L17.4639 20.6782C17.8544 21.0687 18.4876 21.0687 18.8781 20.6782L20.678 18.8783C21.0685 18.4878 21.0685 17.8546 20.678 17.4641L19.7929 16.579C19.4766 16.2627 19.4147 15.7772 19.5963 15.3684C19.6517 15.2436 19.7042 15.1172 19.7535 14.9892C19.9145 14.572 20.3014 14.2726 20.7486 14.2726H22C22.5523 14.2726 23 13.8249 23 13.2726V10.7272C23 10.1749 22.5523 9.72719 22 9.72719H20.7485C20.3013 9.72719 19.9144 9.42784 19.7535 9.01067C19.7042 8.8829 19.6518 8.75665 19.5965 8.63201C19.415 8.22324 19.4768 7.7378 19.7931 7.42154L20.6784 6.53625C21.0689 6.14572 21.0689 5.51256 20.6784 5.12203L18.8785 3.32213C18.488 2.9316 17.8548 2.9316 17.4643 3.32213L16.5792 4.20716ZM16.5999 12.0001C16.5999 14.5406 14.5404 16.6001 11.9999 16.6001C9.45939 16.6001 7.3999 14.5406 7.3999 12.0001C7.3999 9.45958 9.45939 7.40009 11.9999 7.40009C14.5404 7.40009 16.5999 9.45958 16.5999 12.0001ZM17.5999 12.0001C17.5999 15.0929 15.0927 17.6001 11.9999 17.6001C8.90711 17.6001 6.3999 15.0929 6.3999 12.0001C6.3999 8.90729 8.90711 6.40009 11.9999 6.40009C15.0927 6.40009 17.5999 8.90729 17.5999 12.0001Z",
             fill: "black"
           }));
+        case "zoom-in":
+          return /* @__PURE__ */ r.createElement("svg", h({
+            viewBox: "0 0 24 24"
+          }, d), /* @__PURE__ */ r.createElement("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M21.9774 20.8287L17.9149 16.7662C17.8437 16.6957 17.76 16.639 17.668 16.5992C20.7612 12.9331 20.415 7.48045 16.883 4.23507C13.3509 0.989694 7.88848 1.10517 4.49673 4.49691C1.10499 7.88866 0.98951 13.3511 4.23489 16.8831C7.48027 20.4152 12.9329 20.7614 16.599 17.6682C16.6388 17.7601 16.6955 17.8439 16.766 17.9151L20.8285 21.9776C21.1457 22.2948 21.6601 22.2948 21.9774 21.9776C22.2947 21.6603 22.2947 21.1459 21.9774 20.8287ZM10.8404 18.1531C6.80186 18.1531 3.52794 14.8792 3.52794 10.8406C3.52794 6.80204 6.80186 3.52813 10.8404 3.52813C14.879 3.52813 18.1529 6.80204 18.1529 10.8406C18.1483 14.8773 14.8771 18.1484 10.8404 18.1531Z",
+            fill: "white"
+          }), /* @__PURE__ */ r.createElement("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M10.8749 6.75003C11.2892 6.75003 11.6249 7.08581 11.6249 7.50003V14.25C11.6249 14.6642 11.2892 15 10.8749 15C10.4607 15 10.1249 14.6642 10.1249 14.25V7.50003C10.1249 7.08581 10.4607 6.75003 10.8749 6.75003Z",
+            fill: "white"
+          }), /* @__PURE__ */ r.createElement("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M6.74994 10.875C6.74994 10.4608 7.08573 10.125 7.49994 10.125H14.2499C14.6642 10.125 14.9999 10.4608 14.9999 10.875C14.9999 11.2892 14.6642 11.625 14.2499 11.625H7.49994C7.08573 11.625 6.74994 11.2892 6.74994 10.875Z",
+            fill: "white"
+          }));
+        case "zoom-out":
+          return /* @__PURE__ */ r.createElement("svg", h({
+            viewBox: "0 0 24 24"
+          }, d), /* @__PURE__ */ r.createElement("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M22.1025 20.9536L18.04 16.8911C17.9688 16.8206 17.8851 16.764 17.7931 16.7241C20.8864 13.0581 20.5401 7.60539 17.0081 4.36001C13.476 1.11463 8.0136 1.23011 4.62185 4.62185C1.23011 8.0136 1.11463 13.476 4.36001 17.0081C7.60539 20.5401 13.0581 20.8864 16.7241 17.7931C16.764 17.8851 16.8206 17.9688 16.8911 18.04L20.9536 22.1025C21.2709 22.4198 21.7853 22.4198 22.1025 22.1025C22.4198 21.7853 22.4198 21.2709 22.1025 20.9536ZM10.9656 18.2781C6.92698 18.2781 3.65306 15.0041 3.65306 10.9656C3.65306 6.92698 6.92698 3.65306 10.9656 3.65306C15.0041 3.65306 18.2781 6.92698 18.2781 10.9656C18.2734 15.0022 15.0022 18.2734 10.9656 18.2781Z",
+            fill: "white"
+          }), /* @__PURE__ */ r.createElement("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M6.87506 11C6.87506 10.5858 7.21085 10.25 7.62506 10.25H14.3751C14.7893 10.25 15.1251 10.5858 15.1251 11C15.1251 11.4142 14.7893 11.75 14.3751 11.75H7.62506C7.21085 11.75 6.87506 11.4142 6.87506 11Z",
+            fill: "white"
+          }));
+        case "download":
+          return /* @__PURE__ */ r.createElement("svg", h({
+            viewBox: "0 0 24 24"
+          }, d), /* @__PURE__ */ r.createElement("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M22.5 11.1346V18.4038C22.498 20.1873 21.0527 21.6326 19.2692 21.6346H4.73077C2.94731 21.6326 1.50204 20.1873 1.5 18.4038V11.1346C1.5 10.6885 1.86162 10.3269 2.30769 10.3269C2.75377 10.3269 3.11538 10.6885 3.11538 11.1346V18.4038C3.1164 19.2956 3.83904 20.0182 4.73077 20.0192H19.2692C20.161 20.0182 20.8836 19.2956 20.8846 18.4038V11.1346C20.8846 10.6885 21.2462 10.3269 21.6923 10.3269C22.1384 10.3269 22.5 10.6885 22.5 11.1346ZM11.1434 16.2663C11.6167 16.7388 12.3832 16.7388 12.8565 16.2663L17.4172 11.7057C17.7326 11.3903 17.7326 10.8789 17.4172 10.5635C17.1018 10.2481 16.5904 10.2481 16.275 10.5635L12.8076 14.0308V3.05769C12.8076 2.61162 12.446 2.25 11.9999 2.25C11.5539 2.25 11.1923 2.61162 11.1923 3.05769V14.0308L7.72485 10.5636C7.40946 10.2482 6.89812 10.2482 6.58273 10.5636C6.26734 10.8789 6.26734 11.3903 6.58273 11.7057L11.1434 16.2663Z",
+            fill: "white"
+          }));
+        case "lightbox-close":
+          return /* @__PURE__ */ r.createElement("svg", h({
+            viewBox: "0 0 24 24"
+          }, d), /* @__PURE__ */ r.createElement("path", {
+            xmlns: "http://www.w3.org/2000/svg",
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M19.2621 18.1129C19.4674 18.3182 19.5475 18.6173 19.4724 18.8977C19.3973 19.178 19.1783 19.397 18.8979 19.4721C18.6176 19.5472 18.3184 19.4671 18.1132 19.2619L12.1877 13.3363L6.26214 19.2619C6.0569 19.4671 5.75776 19.5472 5.47741 19.4721C5.19705 19.397 4.97807 19.178 4.90294 18.8977C4.82782 18.6173 4.90798 18.3182 5.11321 18.1129L11.0388 12.1874L5.11321 6.26186C4.90798 6.05663 4.82782 5.75749 4.90294 5.47713C4.97807 5.19678 5.19705 4.97779 5.47741 4.90267C5.75776 4.82755 6.0569 4.9077 6.26214 5.11294L12.1877 11.0385L18.1132 5.11294C18.4305 4.79567 18.9449 4.79567 19.2621 5.11294C19.5794 5.4302 19.5794 5.9446 19.2621 6.26186L13.3366 12.1874L19.2621 18.1129Z",
+            fill: "white"
+          }));
+        case "pagination-left":
+          return /* @__PURE__ */ r.createElement("svg", h({
+            viewBox: "0 0 24 24"
+          }, d), /* @__PURE__ */ r.createElement("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M15.7935 18.7087C16.0092 18.9029 16.105 19.1974 16.0447 19.4813C15.9844 19.7652 15.7772 19.9954 15.5012 20.0852C15.2251 20.1749 14.9222 20.1105 14.7065 19.9164L6.58148 12.6039C6.41027 12.4498 6.3125 12.2303 6.3125 12C6.3125 11.7697 6.41027 11.5503 6.58148 11.3962L14.7065 4.08372C15.04 3.78354 15.5536 3.81054 15.8538 4.14402C16.154 4.4775 16.127 4.99119 15.7935 5.29136L8.33939 12L15.7935 18.7087Z",
+            fill: "#222222"
+          }));
+        case "pagination-right":
+          return /* @__PURE__ */ r.createElement("svg", h({
+            viewBox: "0 0 24 24"
+          }, d), /* @__PURE__ */ r.createElement("path", {
+            d: "M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z"
+          }));
       }
       return null;
     }
     case "FontAwesome":
-      return /* @__PURE__ */ r.createElement(Tt, p({
-        className: i,
-        faIcon: u,
+      return /* @__PURE__ */ r.createElement(ln, h({
+        className: s,
+        faIcon: m,
         title: e
       }, a));
     default:
     case "Text":
-      return e ? /* @__PURE__ */ r.createElement("i", p(p({
-        className: w(i, "humany-letter-symbol"),
+      return e ? /* @__PURE__ */ r.createElement("i", h(h({
+        className: M(s, "humany-letter-symbol"),
         title: e
-      }, f), a), e.substring(0, 2)) : null;
+      }, p), a), e.substring(0, 2)) : null;
   }
-}, yt = v.svg`
+}, Xt = C.svg`
     transform: rotate(180deg);
-`, bt = {
+`, _t = {
   h1: "h1",
   h2: "h2",
   h3: "h3",
@@ -1160,78 +1390,86 @@ const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
   h6: "h6",
   p: "p",
   span: "span"
-}, _ = ({ variant: e, component: t, className: n, children: s }) => {
-  const { typographyVariantMapping: o = {} } = dt(), i = p(p({}, bt), o), a = t || i[e] || "span";
-  return /* @__PURE__ */ r.createElement(Ct, {
+}, U = ({ variant: e, component: t, className: n, children: o }) => {
+  const { typographyVariantMapping: i = {} } = Ft(), s = h(h({}, _t), i), a = t || s[e] || "span";
+  return /* @__PURE__ */ r.createElement(Ut, {
     className: n,
     as: a
-  }, s);
-}, Ct = v.span``;
-var xt = /* @__PURE__ */ ((e) => (e.SlideInLeft = "slide-in-left", e.SlideInRight = "slide-in-right", e.SlideInBottom = "slide-in-bottom", e.SlideInTop = "slide-in-top", e))(xt || {});
-const Et = 300, Bn = ({
+  }, o);
+}, Ut = C.span``;
+var qt = /* @__PURE__ */ ((e) => (e.SlideInLeft = "slide-in-left", e.SlideInRight = "slide-in-right", e.SlideInBottom = "slide-in-bottom", e.SlideInTop = "slide-in-top", e))(qt || {});
+const Qt = 300, D1 = ({
   className: e,
   children: t,
   header: n,
-  onToggle: s,
-  trigger: o,
-  fullScreen: i = !1,
+  onToggle: o,
+  trigger: i,
+  fullScreen: s = !1,
   closeButtonAriaLabel: a,
-  animation: m = {
+  animation: l = {
     type: "slide-in-bottom"
   }
 }) => {
-  const { duration: l = Et } = m, c = S(), u = S(), [f, d] = Me(!0), [h, g] = le(), E = ke(h), x = S(F());
-  C(() => {
-    s && s(h);
-  }, [h]);
-  const y = q("Escape");
-  C(() => {
-    y && g(!1);
-  }, [y]), z("click", (K) => {
-    const { target: N } = K;
-    !u.current || !d.current || !N || u.current !== N && d.current !== N && !d.current.contains(N) && !u.current.contains(N) && g(!1);
-  }, window);
-  const b = ue(x.current, () => {
+  const { duration: u = Qt } = l, c = R(), m = R(), [p, d] = Ke(!0), [f, g] = Ye(), E = Ae(f), v = R(q());
+  w(() => {
+    o && o(f);
+  }, [f]);
+  const b = j("Escape");
+  w(() => {
+    b && g(!1);
+  }, [b]), I(
+    "click",
+    (T) => {
+      const { target: z } = T;
+      !m.current || !d.current || !z || m.current !== z && d.current !== z && !d.current.contains(z) && !m.current.contains(z) && g(!1);
+    },
+    window
+  );
+  const y = ve(v.current, () => {
     g(!1);
   });
-  Q("router:changed", () => {
+  ce("router:changed", () => {
     g(!1);
-  }), C(() => {
-    h && c.current ? c.current.focus() : !h && u.current && E && u.current.focus();
-  }, [h, c.current, u.current]);
-  const V = Mt[m.type];
-  return /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(ve, {
-    in: h,
+  }), w(() => {
+    f && c.current ? c.current.focus() : !f && m.current && E && m.current.focus();
+  }, [f, c.current, m.current]);
+  const B = rn[l.type];
+  return /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(Ie, {
+    in: f,
     className: "humany-drawer-transition",
     classNames: "humany-drawer-transition",
     unmountOnExit: !0,
-    timeout: l
-  }, /* @__PURE__ */ r.createElement(G, null, /* @__PURE__ */ r.createElement(V, {
-    duration: l,
-    fullScreen: i,
-    className: w(e, "humany-drawer", `humany-drawer-${x.current}`),
+    timeout: u
+  }, /* @__PURE__ */ r.createElement(G, null, /* @__PURE__ */ r.createElement(B, {
+    duration: u,
+    fullScreen: s,
+    className: M(
+      e,
+      "humany-drawer",
+      `humany-drawer-${v.current}`
+    ),
     clientHeight: document.body.clientHeight,
-    css: f,
+    css: p,
     ref: d
-  }, /* @__PURE__ */ r.createElement(de, {
+  }, /* @__PURE__ */ r.createElement(Ee, {
     onClick: () => g(!1),
     tabIndex: 0,
     ref: c,
     "aria-label": a
-  }, /* @__PURE__ */ r.createElement(A, {
+  }, /* @__PURE__ */ r.createElement(J, {
     symbol: { type: "Svg", content: "close" }
-  })), !!n && /* @__PURE__ */ r.createElement(vt, {
+  })), !!n && /* @__PURE__ */ r.createElement(Gt, {
     variant: "h1",
     className: "humany-drawer-header"
-  }, n), t))), r.cloneElement(o, {
-    onClick: (K) => {
-      g(), b();
+  }, n), t))), r.cloneElement(i, {
+    onClick: (T) => {
+      g(), y();
     },
-    ref: u,
-    "aria-label": o.props.title,
-    "aria-expanded": h
+    ref: m,
+    "aria-label": i.props.title,
+    "aria-expanded": f
   }));
-}, J = v.div`
+}, le = C.div`
     font-family: ${(e) => {
   var t;
   return (t = e.theme.fonts) == null ? void 0 : t.type;
@@ -1248,7 +1486,7 @@ const Et = 300, Bn = ({
     box-shadow: ${(e) => e.theme.boxShadow};
     background: #ffffff;
     ${(e) => e.css && e.css}
-`, vt = v(_)`
+`, Gt = C(U)`
     padding: ${(e) => e.theme.sizes.normal};
     margin: 0;
     text-align: center;
@@ -1268,11 +1506,11 @@ const Et = 300, Bn = ({
   return (t = e.theme.fonts) == null ? void 0 : t.normal;
 }};
     line-height: 1.2em;
-`, ee = M`
+`, ue = L`
     transition: ${(e) => e.duration}ms;
-`, wt = v(J)`
+`, Jt = C(le)`
     max-height: 0;
-    ${ee}
+    ${ue}
 
     &.humany-drawer-transition-enter {
         max-height: 0;
@@ -1287,8 +1525,8 @@ const Et = 300, Bn = ({
     &.humany-drawer-transition-exit-done {
         max-height: 0;
     }
-`, $t = v(J)`
-    ${ee}
+`, en = C(le)`
+    ${ue}
     transform: translateX(100%);
     height: ${(e) => e.fullScreen ? "100%" : "auto"};
 
@@ -1305,8 +1543,8 @@ const Et = 300, Bn = ({
     &.humany-drawer-transition-exit-done {
         transform: translateX(100%);
     }
-`, kt = v(J)`
-    ${ee}
+`, tn = C(le)`
+    ${ue}
     transform: translateX(-100%);
     height: ${(e) => e.fullScreen ? "100%" : "auto"};
 
@@ -1323,8 +1561,8 @@ const Et = 300, Bn = ({
     &.humany-drawer-transition-exit-done {
         transform: translateX(-100%);
     }
-`, Lt = v(J)`
-    ${ee}
+`, nn = C(le)`
+    ${ue}
     bottom: unset;
     top: 0;
     height: 0;
@@ -1342,68 +1580,84 @@ const Et = 300, Bn = ({
     &.humany-drawer-transition-exit-done {
         height: 0;
     }
-`, Mt = {
-  ["slide-in-bottom"]: wt,
-  ["slide-in-right"]: $t,
-  ["slide-in-left"]: kt,
-  ["slide-in-top"]: Lt
-}, He = (e, t, n) => {
-  const [s, o] = L(0), [i, a] = L(0), m = H((l, c) => {
-    if (l.preventDefault(), c) {
-      const u = c.getBoundingClientRect();
-      o(Math.max(document.body.clientWidth - u.right, 1)), a(u.bottom + window.scrollY);
-    }
-  }, [s, i, o, a]);
-  return C(() => {
+`, rn = {
+  ["slide-in-bottom"]: Jt,
+  ["slide-in-right"]: en,
+  ["slide-in-left"]: tn,
+  ["slide-in-top"]: nn
+}, Xe = (e, t, n) => {
+  const [o, i] = k(0), [s, a] = k(0), l = H(
+    (u, c) => {
+      if (u.preventDefault(), c) {
+        const m = c.getBoundingClientRect();
+        i(Math.max(document.body.clientWidth - m.right, 1)), a(m.bottom + window.scrollY);
+      }
+    },
+    [o, s, i, a]
+  );
+  return w(() => {
     if (!n || !e)
       return;
-    const l = n.getBoundingClientRect(), c = {
-      x: s,
-      y: i
+    const u = n.getBoundingClientRect(), c = {
+      x: o,
+      y: s
     };
-    l.left < 0 && (c.x = 0), l.bottom > window.innerHeight && (c.y = 0), c.x !== s && o(c.x), c.y !== i && a(c.y);
-  }, [n, e, t]), [{ x: s, y: i }, m];
-}, Vn = r.forwardRef((a, i) => {
-  var m = a, { className: e = "", children: t = null, trigger: n, closeButtonAriaLabel: s } = m, o = $(m, ["className", "children", "trigger", "closeButtonAriaLabel"]);
-  const l = S(), c = S(), u = S();
-  ie(i, () => u.current, [u.current]);
-  const f = S(F()), [d, h] = L(!1), g = ke(d), [{ x: E, y: x }, y] = He(d, f.current, u.current), b = q("Escape");
-  C(() => {
-    b && h(!1);
-  }, [b]), C(() => {
-    d && l.current ? l.current.focus() : !d && c.current && g && c.current.focus();
-  }, [d, l.current, c.current]), z("click", (N) => {
-    const { target: te } = N;
-    !u.current || !te || u.current !== te && !u.current.contains(te) && h(!1);
-  }, window), Q("router:changed", () => {
-    h(!1);
-  });
-  const V = ue(f.current, () => {
-    h(!1);
-  }), K = H((N) => {
-    N.stopPropagation(), y(N, c.current), h(!d), V();
-  }, [V, y, h]);
-  return /* @__PURE__ */ r.createElement(r.Fragment, null, d && /* @__PURE__ */ r.createElement(G, null, /* @__PURE__ */ r.createElement(St, k(p({
-    className: w("humany-dropdown", `humany-dropdown-${f.current}`, e)
-  }, o), {
-    x: E,
-    y: x,
-    ref: u
-  }), /* @__PURE__ */ r.createElement(de, {
-    onClick: () => h(!1),
-    tabIndex: 0,
-    ref: l,
-    "aria-label": s
-  }, /* @__PURE__ */ r.createElement(A, {
-    symbol: { type: "Svg", content: "close" }
-  })), t)), r.cloneElement(n, {
-    onClick: K,
-    ref: c,
-    "aria-label": n.props.title,
-    "aria-expanded": d
-  }));
-}), St = v.div`
-    ${Se}
+    u.left < 0 && (c.x = 0), u.bottom > window.innerHeight && (c.y = 0), c.x !== o && i(c.x), c.y !== s && a(c.y);
+  }, [n, e, t]), [{ x: o, y: s }, l];
+}, B1 = r.forwardRef(
+  (a, s) => {
+    var l = a, { className: e = "", children: t = null, trigger: n, closeButtonAriaLabel: o } = l, i = S(l, ["className", "children", "trigger", "closeButtonAriaLabel"]);
+    const u = R(), c = R(), m = R();
+    Ce(s, () => m.current, [m.current]);
+    const p = R(q()), [d, f] = k(!1), g = Ae(d), [{ x: E, y: v }, b] = Xe(d, p.current, m.current), y = j("Escape");
+    w(() => {
+      y && f(!1);
+    }, [y]), w(() => {
+      d && u.current ? u.current.focus() : !d && c.current && g && c.current.focus();
+    }, [d, u.current, c.current]), I(
+      "click",
+      (z) => {
+        const { target: Y } = z;
+        !m.current || !Y || m.current !== Y && !m.current.contains(Y) && f(!1);
+      },
+      window
+    ), ce("router:changed", () => {
+      f(!1);
+    });
+    const B = ve(p.current, () => {
+      f(!1);
+    }), T = H(
+      (z) => {
+        z.stopPropagation(), b(z, c.current), f(!d), B();
+      },
+      [B, b, f]
+    );
+    return /* @__PURE__ */ r.createElement(r.Fragment, null, d && /* @__PURE__ */ r.createElement(G, null, /* @__PURE__ */ r.createElement(on, $(h({
+      className: M(
+        "humany-dropdown",
+        `humany-dropdown-${p.current}`,
+        e
+      )
+    }, i), {
+      x: E,
+      y: v,
+      ref: m
+    }), /* @__PURE__ */ r.createElement(Ee, {
+      onClick: () => f(!1),
+      tabIndex: 0,
+      ref: u,
+      "aria-label": o
+    }, /* @__PURE__ */ r.createElement(J, {
+      symbol: { type: "Svg", content: "close" }
+    })), t)), r.cloneElement(n, {
+      onClick: T,
+      ref: c,
+      "aria-label": n.props.title,
+      "aria-expanded": d
+    }));
+  }
+), on = C.div`
+    ${je}
     padding: ${(e) => {
   var t;
   return (t = e.theme.sizes) == null ? void 0 : t.medium;
@@ -1413,230 +1667,372 @@ const Et = 300, Bn = ({
     box-shadow: ${(e) => e.theme.boxShadow};
 
     ${(e) => {
-  var n, s, o;
+  var n, o, i;
   let t = "";
-  return e.y > 0 ? t += `top: calc(${((n = e.theme.sizes) == null ? void 0 : n.small) || "0px"} + ${e.y || "0"}px);` : t += `bottom: ${((s = e.theme.sizes) == null ? void 0 : s.normal) || "0px"};`, e.x > 0 ? t += `right: ${e.x || "0"}px;` : t += `left: ${((o = e.theme.sizes) == null ? void 0 : o.normal) || "0px"};`, t;
+  return e.y > 0 ? t += `top: calc(${((n = e.theme.sizes) == null ? void 0 : n.small) || "0px"} + ${e.y || "0"}px);` : t += `bottom: ${((o = e.theme.sizes) == null ? void 0 : o.normal) || "0px"};`, e.x > 0 ? t += `right: ${e.x || "0"}px;` : t += `left: ${((i = e.theme.sizes) == null ? void 0 : i.normal) || "0px"};`, t;
 }};
-`, Ht = (t) => {
-  var e = $(t, []);
-  return /* @__PURE__ */ r.createElement(Rt, p({}, e));
-}, Rt = v.div`
+`, sn = (t) => {
+  var e = S(t, []);
+  return /* @__PURE__ */ r.createElement(an, h({}, e));
+}, an = C.div`
     display: none;
-`, Wn = D((a, i) => {
-  var m = a, { children: e, columns: t, gap: n, className: s } = m, o = $(m, ["children", "columns", "gap", "className"]);
-  return /* @__PURE__ */ r.createElement(Dt, k(p(p({
-    className: w(s, "humany-grid"),
-    "data-columns": t,
-    "data-gap": n
-  }, we(o)), R(o)), {
-    ref: i
-  }), e);
-}), Dt = v.div`
+`, T1 = N(
+  (a, s) => {
+    var l = a, { children: e, columns: t, gap: n, className: o } = l, i = S(l, ["children", "columns", "gap", "className"]);
+    return /* @__PURE__ */ r.createElement(cn, $(h(h({
+      className: M(o, "humany-grid"),
+      "data-columns": t,
+      "data-gap": n
+    }, Oe(i)), V(i)), {
+      ref: s
+    }), e);
+  }
+), cn = C.div`
     display: grid;
     grid-template-columns: repeat(${(e) => e["data-columns"]}, 1fr);
     grid-gap: ${(e) => e["data-gap"]};
     justify-content: center;
     grid-auto-rows: max-content;
-    ${tt}
-`, Re = D((i, o) => {
-  var a = i, { htmlParseInstruction: e = null, className: t, html: n } = a, s = $(a, ["htmlParseInstruction", "className", "html"]);
-  const m = T(), [l, c] = L();
-  return C(() => {
-    const u = e || st(m), f = rt(n, u);
-    c(f);
-  }, [n, e]), /* @__PURE__ */ r.createElement("div", k(p({
-    className: w(t, "humany-html")
-  }, R(s)), {
-    ref: o
-  }), l);
-}), Tt = (i) => {
-  var a = i, {
+    ${Ht}
+`, _e = N(
+  (s, i) => {
+    var a = s, { htmlParseInstruction: e = null, className: t, html: n } = a, o = S(a, ["htmlParseInstruction", "className", "html"]);
+    const l = Z(), [u, c] = k();
+    return w(() => {
+      const m = Tt(l, n), p = $(h(h({}, m), e), {
+        transform: h(h({}, m.transform), e == null ? void 0 : e.transform)
+      }), d = Dt(n, p);
+      c(d);
+    }, [n, e]), /* @__PURE__ */ r.createElement("div", $(h({
+      className: M(t, "humany-html")
+    }, V(o)), {
+      ref: i
+    }), u);
+  }
+), ln = (s) => {
+  var a = s, {
     faIcon: e,
     title: t,
     className: n = "",
-    role: s = "presentation"
-  } = a, o = $(a, [
+    role: o = "presentation"
+  } = a, i = S(a, [
     "faIcon",
     "title",
     "className",
     "role"
   ]);
-  return /* @__PURE__ */ r.createElement("i", p({
-    className: w(n, `fa fa-${e}`),
+  return /* @__PURE__ */ r.createElement("i", h({
+    className: M(n, `fa fa-${e}`),
     title: t,
-    role: s
-  }, R(o)));
-}, On = D((f, u) => {
-  var d = f, {
-    className: e = "",
-    autoFocus: t = !1,
-    onFocusChange: n = () => {
-    },
-    onEnter: s = () => {
-    },
-    onEscape: o = () => {
-    },
-    selectAllOnFocus: i,
-    onChange: a = () => {
-    },
-    disabled: m = !1,
-    type: l
-  } = d, c = $(d, [
-    "className",
-    "autoFocus",
-    "onFocusChange",
-    "onEnter",
-    "onEscape",
-    "selectAllOnFocus",
-    "onChange",
-    "disabled",
-    "type"
-  ]);
-  const [h, g] = L(t), E = S();
-  ie(u, () => E.current), C(() => {
-    var b;
-    t && ((b = E == null ? void 0 : E.current) == null || b.focus());
-  }, [t, u, E]);
-  const x = (b, V) => {
-    g(b), n && n(b), i && b && V.target.select();
-  }, y = k(p({}, R(c)), {
-    disabled: m,
-    autoFocus: t,
-    type: l,
-    onKeyDown: (b) => {
-      b.key === "Enter" && h && s(b), b.key === "Escape" && h && o(b);
-    },
-    onFocus: (b) => x(!0, b),
-    onBlur: (b) => x(!1, b),
-    onChange: (b) => a(b.target.value || ""),
-    className: w(e, "humany-input"),
-    "data-type": l
-  });
-  return l !== "textarea" ? /* @__PURE__ */ r.createElement("input", k(p({}, y), {
-    ref: E
-  })) : /* @__PURE__ */ r.createElement("textarea", k(p({}, y), {
-    ref: E
-  }));
-}), Nt = D((a, i) => {
-  var m = a, { className: e, items: t, renderItem: n, renderLi: s = !1 } = m, o = $(m, ["className", "items", "renderItem", "renderLi"]);
-  return /* @__PURE__ */ r.createElement("ul", k(p({
-    className: w(e, "humany-list"),
-    "data-item-count": t.length
-  }, R(o)), {
-    ref: i
-  }), t.map((l, c, u) => s ? /* @__PURE__ */ r.createElement("li", {
-    className: "humany-list-item",
-    key: l.id
-  }, n(l, c, u)) : n(l, c, u)));
-}), zt = D((l, m) => {
-  var c = l, { text: e, html: t, header: n, className: s, htmlParseInstruction: o, symbol: i } = c, a = $(c, ["text", "html", "header", "className", "htmlParseInstruction", "symbol"]);
-  return /* @__PURE__ */ r.createElement("div", k(p({
-    className: w(s, "humany-paragraph")
-  }, R(a)), {
-    ref: m
-  }), n ? /* @__PURE__ */ r.createElement(_, {
-    variant: "h1"
-  }, i ? /* @__PURE__ */ r.createElement(A, {
-    symbol: i
-  }) : null, n) : null, t ? /* @__PURE__ */ r.createElement(Re, {
-    html: t,
-    htmlParseInstruction: o
-  }) : null, e ? /* @__PURE__ */ r.createElement(me, null, e) : null);
-}), Bt = D((h, d) => {
-  var g = h, {
-    header: e,
-    customHeader: t,
-    text: n,
-    html: s,
-    className: o,
-    children: i,
-    symbol: a,
-    items: m,
-    renderItem: l,
-    renderLi: c,
-    ulProps: u
-  } = g, f = $(g, [
-    "header",
-    "customHeader",
-    "text",
-    "html",
-    "className",
-    "children",
-    "symbol",
-    "items",
-    "renderItem",
-    "renderLi",
-    "ulProps"
-  ]);
-  return /* @__PURE__ */ r.createElement("div", k(p({
-    className: w(o, "humany-item-list"),
-    "data-item-count": m.length
-  }, R(f)), {
-    ref: d
-  }), t || (e || n || s ? /* @__PURE__ */ r.createElement(zt, {
-    symbol: a,
-    header: e,
-    text: n,
-    html: s
-  }) : null), m.length ? /* @__PURE__ */ r.createElement(Nt, p({
-    items: m,
-    renderItem: l,
-    renderLi: c
-  }, u)) : null, i);
-}), In = ({
+    role: o
+  }, V(i)));
+}, N1 = N(
+  (p, m) => {
+    var d = p, {
+      className: e = "",
+      autoFocus: t = !1,
+      onFocusChange: n = () => {
+      },
+      onEnter: o = () => {
+      },
+      onEscape: i = () => {
+      },
+      selectAllOnFocus: s,
+      onChange: a = () => {
+      },
+      disabled: l = !1,
+      type: u
+    } = d, c = S(d, [
+      "className",
+      "autoFocus",
+      "onFocusChange",
+      "onEnter",
+      "onEscape",
+      "selectAllOnFocus",
+      "onChange",
+      "disabled",
+      "type"
+    ]);
+    const [f, g] = k(t), E = R();
+    Ce(m, () => E.current), w(() => {
+      var y;
+      t && ((y = E == null ? void 0 : E.current) == null || y.focus());
+    }, [t, m, E]);
+    const v = (y, B) => {
+      g(y), n && n(y), s && y && B.target.select();
+    }, b = $(h({}, V(c)), {
+      disabled: l,
+      autoFocus: t,
+      type: u,
+      onKeyDown: (y) => {
+        y.key === "Enter" && f && o(y), y.key === "Escape" && f && i(y);
+      },
+      onFocus: (y) => v(!0, y),
+      onBlur: (y) => v(!1, y),
+      onChange: (y) => a(y.target.value || ""),
+      className: M(e, "humany-input"),
+      "data-type": u
+    });
+    return u !== "textarea" ? /* @__PURE__ */ r.createElement("input", $(h({}, b), {
+      ref: E
+    })) : /* @__PURE__ */ r.createElement("textarea", $(h({}, b), {
+      ref: E
+    }));
+  }
+), un = N(
+  (a, s) => {
+    var l = a, { className: e, items: t, renderItem: n, renderLi: o = !1 } = l, i = S(l, ["className", "items", "renderItem", "renderLi"]);
+    return /* @__PURE__ */ r.createElement("ul", $(h({
+      className: M(e, "humany-list"),
+      "data-item-count": t.length
+    }, V(i)), {
+      ref: s
+    }), t.map(
+      (u, c, m) => o ? /* @__PURE__ */ r.createElement("li", {
+        className: "humany-list-item",
+        key: u.id || c
+      }, n(u, c, m)) : n(u, c, m)
+    ));
+  }
+), mn = N(
+  (u, l) => {
+    var c = u, { text: e, html: t, header: n, className: o, htmlParseInstruction: i, symbol: s } = c, a = S(c, ["text", "html", "header", "className", "htmlParseInstruction", "symbol"]);
+    return /* @__PURE__ */ r.createElement("div", $(h({
+      className: M(o, "humany-paragraph")
+    }, V(a)), {
+      ref: l
+    }), n ? /* @__PURE__ */ r.createElement(U, {
+      variant: "h1"
+    }, s ? /* @__PURE__ */ r.createElement(J, {
+      symbol: s
+    }) : null, n) : null, t ? /* @__PURE__ */ r.createElement(_e, {
+      html: t,
+      htmlParseInstruction: i
+    }) : null, e ? /* @__PURE__ */ r.createElement(we, null, e) : null);
+  }
+), dn = N(
+  (f, d) => {
+    var g = f, {
+      header: e,
+      customHeader: t,
+      text: n,
+      html: o,
+      className: i,
+      children: s,
+      symbol: a,
+      items: l,
+      renderItem: u,
+      renderLi: c,
+      ulProps: m
+    } = g, p = S(g, [
+      "header",
+      "customHeader",
+      "text",
+      "html",
+      "className",
+      "children",
+      "symbol",
+      "items",
+      "renderItem",
+      "renderLi",
+      "ulProps"
+    ]);
+    return /* @__PURE__ */ r.createElement("div", $(h({
+      className: M(i, "humany-item-list"),
+      "data-item-count": l.length
+    }, V(p)), {
+      ref: d
+    }), t || (e || n || o ? /* @__PURE__ */ r.createElement(mn, {
+      symbol: a,
+      header: e,
+      text: n,
+      html: o
+    }) : null), l.length ? /* @__PURE__ */ r.createElement(un, h({
+      items: l,
+      renderItem: u,
+      renderLi: c
+    }, m)) : null, s);
+  }
+), V1 = ({
   className: e = "",
   tree: t,
   renderItem: n,
-  rootItem: s,
-  renderUnselected: o = !0,
-  renderEmpty: i = !0,
+  rootItem: o,
+  renderUnselected: i = !0,
+  renderEmpty: s = !0,
   ulProps: a,
-  liProps: m
+  liProps: l
 }) => {
-  const l = (f) => !c(f), c = (f) => !f || f.length < 1 ? !0 : !f.some((d) => !!d.selected), u = (f, d) => /* @__PURE__ */ r.createElement(Bt, {
-    className: w(`humany-item-tree-level-${d}`),
-    items: f,
+  const u = (p) => !c(p), c = (p) => !p || p.length < 1 ? !0 : !p.some((d) => !!d.selected), m = (p, d) => /* @__PURE__ */ r.createElement(dn, {
+    className: M(`humany-item-tree-level-${d}`),
+    items: p,
     ulProps: a,
-    renderItem: (h) => {
-      const { id: g, selected: E, items: x, matches: y } = h, b = E && c(x);
-      return !i && !y ? null : /* @__PURE__ */ r.createElement("li", k(p({}, R(m)), {
+    renderItem: (f) => {
+      const { id: g, selected: E, items: v, matches: b } = f, y = E && c(v);
+      return !s && !b ? null : /* @__PURE__ */ r.createElement("li", $(h({}, V(l)), {
         key: g,
         className: "humany-item-tree-item"
-      }), n && n(h, d, b), x && (o || b) && u(x, d + 1));
+      }), n && n(f, d, y), v && (i || y) && m(v, d + 1));
     }
   });
   return /* @__PURE__ */ r.createElement("div", {
-    className: w(e, "humany-item-tree")
-  }, s && s(!l(t || [])), t && u(t, 1));
-}, De = (i) => {
-  var a = i, {
+    className: M(e, "humany-item-tree")
+  }, o && o(!u(t || [])), t && m(t, 1));
+}, fn = N(
+  (u, l) => {
+    var c = u, { className: e, onClick: t = () => {
+    }, name: n = "", to: o = "", params: i = {}, children: s } = c, a = S(c, ["className", "onClick", "name", "to", "params", "children"]);
+    const m = Pe(), p = Z();
+    if (!m)
+      return null;
+    let d = "";
+    const f = $(h({
+      onClick: t,
+      className: M(e, "humany-route-link"),
+      to: d,
+      innerRef: l
+    }, a), {
+      ref: null
+    });
+    if (n) {
+      if (!(m.routes || []).find((b) => b.name === n))
+        return process.env.NODE_ENV !== "production" && de.warn(`Unable to create route. No route named "${n}" exist.`), /* @__PURE__ */ r.createElement(fe, $(h({}, f), {
+          onClick: (b) => {
+            t(b), b.preventDefault(), process.env.NODE_ENV !== "production" && de.warn(`Unable to navigate. No route named "${n}" exist.`);
+          }
+        }), s);
+      const v = Object.keys(i).reduce((b, y) => (b[y] = typeof i[y] == "string" ? encodeURIComponent(i[y]) : i[y], b), {});
+      try {
+        d = m.generate(n, v || {});
+      } catch (b) {
+        return /* @__PURE__ */ r.createElement(fe, h({}, f), s);
+      }
+      d && m.settings.mode && m.settings.mode === Te.browser && d[0] !== "/" && (d = `/${d}`);
+    } else if (o && m.history)
+      d = m.history.createHref({
+        hash: "",
+        pathname: o,
+        search: "",
+        state: void 0
+      });
+    else
+      return process.env.NODE_ENV !== "production" && de.warn(
+        'Unable to generate path for route link. Either specify route name or use the "to" prop.'
+      ), null;
+    if (m.settings && m.settings.mode === Te.scopedHash) {
+      const g = p.get("$widget").name;
+      d = xt(d, g);
+    }
+    return /* @__PURE__ */ r.createElement(fe, $(h({}, f), {
+      to: d
+    }), s);
+  }
+), xe = N(
+  (g, f) => {
+    var E = g, {
+      className: e,
+      disabled: t = !1,
+      role: n = "link",
+      tabIndex: o = 0,
+      onClick: i = () => {
+      },
+      onKeyDown: s = () => {
+      },
+      title: a,
+      href: l,
+      children: u,
+      target: c,
+      routeName: m,
+      params: p
+    } = E, d = S(E, [
+      "className",
+      "disabled",
+      "role",
+      "tabIndex",
+      "onClick",
+      "onKeyDown",
+      "title",
+      "href",
+      "children",
+      "target",
+      "routeName",
+      "params"
+    ]);
+    const v = {
+      title: a,
+      disabled: t,
+      role: n,
+      tabIndex: o,
+      className: M(e, "humany-link", [!!t, "humany-disabled"]),
+      onClick: (b) => {
+        if (b.persist(), t) {
+          b.preventDefault();
+          return;
+        }
+        i(b);
+      },
+      onKeyDown: (b) => {
+        if (b.persist(), t) {
+          b.key !== "Tab" && b.preventDefault();
+          return;
+        }
+        s(b);
+      }
+    };
+    return m ? /* @__PURE__ */ r.createElement(hn, $(h(h({
+      name: m,
+      params: p
+    }, v), V(d)), {
+      ref: f
+    }), u) : /* @__PURE__ */ r.createElement(pn, $(h(h({
+      href: l,
+      target: c
+    }, v), V(d)), {
+      ref: f
+    }), u);
+  }
+), hn = C(fn)`
+    ${(e) => e.disabled ? `
+      pointer-events: none;
+      opacity: .7;
+    ` : "cursor: pointer;"}
+`, pn = C.a`
+    ${(e) => e.disabled ? `
+    pointer-events: none;
+    opacity: .7;
+  ` : "cursor: pointer;"}
+`, Ue = (s) => {
+  var a = s, {
     visible: e,
     duration: t = 500,
     children: n,
-    onClick: s = () => {
+    onClick: o = () => {
     }
-  } = a, o = $(a, [
+  } = a, i = S(a, [
     "visible",
     "duration",
     "children",
     "onClick"
   ]);
-  const m = S(), l = H((c) => {
-    c.target === m.current && s(c);
-  }, [s]);
-  return /* @__PURE__ */ r.createElement(ve, {
+  const l = R(), u = H(
+    (c) => {
+      c.target === l.current && o(c);
+    },
+    [o]
+  );
+  return /* @__PURE__ */ r.createElement(Ie, {
     in: e,
     className: "humany-overlay-transition",
     classNames: "humany-overlay-transition",
     unmountOnExit: !0,
     timeout: t
-  }, /* @__PURE__ */ r.createElement(G, null, /* @__PURE__ */ r.createElement(Vt, p({
+  }, /* @__PURE__ */ r.createElement(G, null, /* @__PURE__ */ r.createElement(gn, h({
     className: "humany-overlay",
     duration: t,
-    ref: m,
-    onClick: l
-  }, o), n)));
-}, Vt = v.div`
+    ref: l,
+    onClick: u
+  }, i), n)));
+}, gn = C.div`
     background: rgba(0, 0, 0, 0.6);
     min-width: 100%;
     min-height: 100%;
@@ -1666,215 +2062,576 @@ const Et = 300, Bn = ({
     &.humany-overlay-transition-exit-done {
         opacity: 0;
     }
-`, Wt = ({ attrs: e }) => {
-  const [t, n] = le(!1), s = q("Escape");
-  C(() => {
-    s && n(!1);
-  }, [s]);
-  const o = H((i) => {
-    n(!1);
-  }, [n]);
-  return /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(De, {
-    visible: t,
-    onClick: o
-  }, /* @__PURE__ */ r.createElement(It, {
-    onClick: () => n(!1)
-  }, /* @__PURE__ */ r.createElement(Pt, {
-    size: 24,
-    symbol: { type: "Svg", content: "close" }
-  })), /* @__PURE__ */ r.createElement(Ot, null, /* @__PURE__ */ r.createElement("img", p({}, e)))), /* @__PURE__ */ r.createElement("a", {
-    onClick: () => n()
-  }, /* @__PURE__ */ r.createElement(Ft, p({}, e))));
-}, Ot = v.div`
-    padding: ${(e) => {
+`, Cn = We`
+  100% {
+    transform: rotate(360deg);
+  }
+`, yn = We`
+  0% {
+    stroke-dasharray: 1, 200;
+    stroke-dashoffset: 0;
+  }
+  50% {
+    stroke-dasharray: 89, 200;
+    stroke-dashoffset: -35px;
+  }
+  100% {
+    stroke-dasharray: 89, 200;
+    stroke-dashoffset: -124px;
+  }
+`, qe = C.svg`
+    animation: ${Cn} 2s linear infinite;
+    height: 100%;
+    transform-origin: center center;
+    width: 100%;
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    margin: auto;
+    transition: 200ms ease-out opacity;
+`, bn = C.div`
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  height: 100%;
+  width: 100%;
+  pointer-events: ${(e) => e["data-loading"] ? "all" : "none"}
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  transition: 200ms ease-out opacity;
+  box-sizing: border-box;
+  overflow: hidden;
+  ${qe} {
+    opacity: ${(e) => e["data-loading"] ? "1" : "0"}
+  }
+`, vn = C.div`
+    position: relative;
+    margin: 0 auto;
+    width: 100px;
+    &:before {
+        content: '';
+        display: block;
+        padding-top: 100%;
+    }
+`, wn = C.circle`
+    stroke-dasharray: 1, 200;
+    stroke-dashoffset: 0;
+    animation: ${yn} 1.5s ease-in-out infinite;
+    stroke-linecap: round;
+    stroke: ${(e) => {
   var t;
-  return (t = e.theme.sizes) == null ? void 0 : t.normal;
+  return (t = e.theme.colors) == null ? void 0 : t.primary;
 }};
-    max-width: 80%;
-    max-height: 80%;
-
-    img {
-        width: auto !important;
-        height: auto !important;
-        max-width: 100%;
-        max-height: 100%;
+    stroke-width: 2px;
+`, En = ({ className: e, loading: t = !1 }) => /* @__PURE__ */ r.createElement(bn, {
+  className: M("humany-loader", e),
+  "data-loading": t
+}, /* @__PURE__ */ r.createElement(vn, {
+  className: "humany-spinner"
+}, /* @__PURE__ */ r.createElement(qe, {
+  viewBox: "25 25 50 50"
+}, /* @__PURE__ */ r.createElement(wn, {
+  cx: "50",
+  cy: "50",
+  r: "20",
+  fill: "none",
+  "stroke-width": "2",
+  "stroke-miterlimit": "10"
+})))), xn = (i) => {
+  var s = i, {
+    zoomState: e,
+    image: t,
+    changeZoom: n
+  } = s, o = S(s, [
+    "zoomState",
+    "image",
+    "changeZoom"
+  ]);
+  var b;
+  const a = R(null), [l, u] = k(!1), [c, m] = k(!1), v = o.style || {}, { width: p, height: d } = v, f = S(v, ["width", "height"]), g = H(() => {
+    const y = a.current;
+    if (y) {
+      const B = window.innerWidth / y.width, T = window.innerHeight / y.height, z = Math.min(B, T);
+      return T >= 1 && B >= 1 ? 1 : z;
     }
-`, It = v(U)`
-    position: fixed;
-    top: 50px;
-    right: 50px;
-    transition: opacity 300ms ease-in-out;
-    opacity: 0.7;
-
-    &:hover {
-        opacity: 1;
+    return 1;
+  }, [l, t.src]), E = ie(() => {
+    const y = a.current;
+    if (y) {
+      if (!c) {
+        m(!0);
+        const B = g();
+        n(B);
+      }
+      return y.width >= y.height ? [`${e * t.originalWidth}px`, "auto"] : ["auto", `${e * t.originalHeight}px`];
     }
-`, Pt = v(A)`
-    path {
+    return null;
+  }, [e, a, l, t.src]);
+  return w(() => (u(!1), function() {
+    m(!1);
+  }), [t.src]), /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(kn, {
+    loading: !l
+  }), /* @__PURE__ */ r.createElement($n, $(h({
+    onLoad: () => {
+      u(!0);
+    },
+    ref: a,
+    imageSize: E,
+    draggable: "false"
+  }, o), {
+    alt: ((b = o.alt) == null ? void 0 : b.toString()) || "",
+    style: f,
+    src: t.src,
+    loaded: l
+  })), /* @__PURE__ */ r.createElement(Ln, null));
+}, kn = C(En)`
+    svg circle {
         stroke: #ffffff;
     }
-`, Ft = v.img`
-    cursor: pointer;
-`, Zt = D((l, m) => {
-  var c = l, { className: e, onClick: t = () => {
-  }, name: n = "", to: s = "", params: o = {}, children: i } = c, a = $(c, ["className", "onClick", "name", "to", "params", "children"]);
-  const u = Le(), f = T();
-  if (!u)
-    return null;
-  let d = "";
-  const h = k(p({
-    onClick: t,
-    className: w(e, "humany-route-link"),
-    to: d,
-    innerRef: m
-  }, a), {
-    ref: null
-  });
-  if (n) {
-    if (!(u.routes || []).find((y) => y.name === n))
-      return process.env.NODE_ENV !== "production" && ne.warn(`Unable to create route. No route named "${n}" exist.`), /* @__PURE__ */ r.createElement(re, k(p({}, h), {
-        onClick: (y) => {
-          t(y), y.preventDefault(), process.env.NODE_ENV !== "production" && ne.warn(`Unable to navigate. No route named "${n}" exist.`);
-        }
-      }), i);
-    const x = Object.keys(o).reduce((y, b) => (y[b] = typeof o[b] == "string" ? encodeURIComponent(o[b]) : o[b], y), {});
-    try {
-      d = u.generate(n, x || {});
-    } catch (y) {
-      return /* @__PURE__ */ r.createElement(re, p({}, h), i);
-    }
-    d && u.settings.mode && u.settings.mode === be.browser && d[0] !== "/" && (d = `/${d}`);
-  } else if (s && u.history)
-    d = u.history.createHref({
-      hash: "",
-      pathname: s,
-      search: "",
-      state: void 0
-    });
-  else
-    return process.env.NODE_ENV !== "production" && ne.warn('Unable to generate path for route link. Either specify route name or use the "to" prop.'), null;
-  if (u.settings && u.settings.mode === be.scopedHash) {
-    const g = f.get("$widget").name;
-    d = _e(d, g);
-  }
-  return /* @__PURE__ */ r.createElement(re, k(p({}, h), {
-    to: d
-  }), i);
-}), Te = D((g, h) => {
-  var E = g, {
-    className: e,
-    disabled: t = !1,
-    role: n = "link",
-    tabIndex: s = 0,
-    onClick: o = () => {
+`, $n = C.img`
+    transform: none;
+
+    ${(e) => e.imageSize && L`
+            width: ${e.imageSize[0]};
+            height: ${e.imageSize[1]};
+            display: inline-block;
+        `}
+    vertical-align: middle;
+    position: relative;
+    ${(e) => !e.loaded && "display:none;"}
+`, Ln = C.div`
+    height: 100%;
+    display: inline-block;
+    vertical-align: middle;
+`, Mn = () => {
+  const e = R(), [t, n] = k(!0), o = H(() => (t || n(!0), e.current && clearTimeout(e.current), e.current = setTimeout(() => {
+    n(!1);
+  }, 3e3), () => {
+    e.current && clearTimeout(e.current);
+  }), [t, e]);
+  return [t, o];
+}, Sn = ({ attrs: e, htmlBody: t }) => {
+  var Se;
+  const n = j("Escape"), o = j("ArrowLeft"), i = j("ArrowRight"), [s, a] = k(1), [l, u] = k({ top: 0, left: 0, x: 0, y: 0 }), [c, m] = k(!1), [p, d] = Mn(), [f, g] = k(null), [E, v] = k(null), b = R(null), y = R(null), B = R(null), T = R(null);
+  w(() => {
+    n && g(null);
+  }, [n]), w(() => {
+    a(1);
+  }, [f]), w(() => {
+    var F, A;
+    if (f === null || y.current === null)
+      return;
+    const x = y.current.firstElementChild, D = (F = B.current) == null ? void 0 : F.querySelector(".nav-left"), W = (A = B.current) == null ? void 0 : A.querySelector(".nav-right");
+    if (E === "Right")
+      te && W ? W.focus() : ee && D && D.focus();
+    else if (E === "Left")
+      ee && D ? D.focus() : te && W && W.focus();
+    else {
+      if (!x)
+        return;
+      x.focus();
+    }
+  }, [f, y, B, E]), w(() => {
+    if (o) {
+      if (ee)
+        return Le();
+    } else if (i && te)
+      return Me();
+  }, [o, i]);
+  const z = ie(() => {
+    const x = document.createElement("div");
+    x.innerHTML = t || "";
+    const D = x.getElementsByTagName("img");
+    return Array.from(D).reduce((F, A) => {
+      const Re = A.getAttribute("src"), it = A.height || Number.parseInt(A.style.height, 10), st = A.width || Number.parseInt(A.style.width, 10);
+      if (Re) {
+        const at = {
+          src: Re,
+          originalWidth: st,
+          originalHeight: it
+        };
+        F.push(at);
+      }
+      return F;
+    }, []);
+  }, [t]), Y = H(() => {
+    const { src: x } = e;
+    if (x) {
+      const D = z.findIndex((W, F) => W.src === x);
+      g(D);
+    }
+  }, [z, e]), Je = H((x) => {
+    g(null);
+  }, []), $e = H(
+    (x) => {
+      a(x ? s + s * 0.25 : s - s * 0.25);
     },
-    onKeyDown: i = () => {
+    [a, s]
+  ), et = H(() => {
+    if (f !== null) {
+      const { src: x } = z[f];
+      x && window.open(x, "_self");
+    }
+  }, [z, f]), tt = H(
+    (x) => {
+      const D = T.current;
+      D && (u({ top: D.scrollTop, left: D.scrollLeft, x: x.clientX, y: x.clientY }), m(!0));
     },
-    title: a,
-    href: m,
-    children: l,
-    target: c,
-    routeName: u,
-    params: f
-  } = E, d = $(E, [
-    "className",
-    "disabled",
-    "role",
-    "tabIndex",
-    "onClick",
-    "onKeyDown",
-    "title",
-    "href",
-    "children",
-    "target",
-    "routeName",
-    "params"
-  ]);
-  const x = {
-    title: a,
-    disabled: t,
-    role: n,
-    tabIndex: s,
-    className: w(e, "humany-link", [!!t, "humany-disabled"]),
-    onClick: (y) => {
-      if (y.persist(), t) {
-        y.preventDefault();
-        return;
+    [T]
+  ), nt = H(
+    (x) => {
+      const D = T.current;
+      if (D && c) {
+        const W = x.clientX - l.x, F = x.clientY - l.y;
+        D.scrollTop = l.top - F, D.scrollLeft = l.left - W;
       }
-      o(y);
     },
-    onKeyDown: (y) => {
-      if (y.persist(), t) {
-        y.key !== "Tab" && y.preventDefault();
-        return;
+    [c, l]
+  ), rt = (x) => {
+    x.preventDefault(), m(!1);
+  }, ot = ie(() => {
+    if (T.current) {
+      const x = T.current.getElementsByTagName("img");
+      if (x && x.length) {
+        const D = x[0];
+        return D.width > window.innerWidth || D.height > window.innerHeight;
       }
-      i(y);
     }
-  };
-  return u ? /* @__PURE__ */ r.createElement(At, k(p(p({
-    name: u,
-    params: f
-  }, x), R(d)), {
-    ref: h
-  }), l) : /* @__PURE__ */ r.createElement(Kt, k(p(p({
-    href: m,
-    target: c
-  }, x), R(d)), {
-    ref: h
-  }), l);
-}), At = v(Zt)`
-    ${(e) => e.disabled ? `
-      pointer-events: none;
-      opacity: .7;
-    ` : "cursor: pointer;"}
-`, Kt = v.a`
-    ${(e) => e.disabled ? `
-    pointer-events: none;
-    opacity: .7;
-  ` : "cursor: pointer;"}
-`, Yt = D((m, a) => {
-  var l = m, { className: e, children: t, trigger: n, onOverlayClick: s = () => {
-  }, close: o = !1 } = l, i = $(l, ["className", "children", "trigger", "onOverlayClick", "close"]);
-  const [c, u] = le(), [f, d] = Me(!0), h = S(), g = S(F()), E = q("Escape");
-  C(() => {
-    (E || o) && u(!1);
-  }, [E, o]), C(() => {
-    c && h.current && h.current.focus();
-  }, [c, h.current]), Q("router:changed", () => {
-    u(!1);
-  });
-  const x = H((b) => {
-    u(!1), s(b);
-  }, [s, u]);
-  ie(a, () => ({
-    close() {
-      u(!1);
-    }
-  }));
-  const y = H(() => ue(g.current, () => {
-    u(!1);
-  }), [g.current]);
-  return /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(De, {
-    visible: c,
-    onClick: x
-  }, /* @__PURE__ */ r.createElement(jt, k(p({
-    className: w(e, "humany-modal", `humany-modal-${g.current}`),
-    css: f,
-    tabIndex: -1
-  }, i), {
-    ref: d
-  }), /* @__PURE__ */ r.createElement(de, {
-    onClick: () => u(!1),
-    tabIndex: 0,
-    ref: h
-  }, /* @__PURE__ */ r.createElement(A, {
-    symbol: { type: "Svg", content: "close" }
-  })), t)), r.cloneElement(n, {
-    onClick: (b) => {
-      u(), y();
+    return !1;
+  }, [T, s]), Le = () => {
+    f !== null && (v("Left"), g(f - 1));
+  }, Me = () => {
+    f !== null && (v("Right"), g(f + 1));
+  }, ee = f !== null && f > 0 && z.length > 1, te = f !== null && z.length - 1 > f;
+  return /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(Ue, {
+    visible: f !== null,
+    onClick: Je
+  }, /* @__PURE__ */ r.createElement(Vn, {
+    onMouseDown: () => d(),
+    onMouseMove: () => d(),
+    onTouchStart: () => d(),
+    onKeyDown: () => d()
+  }, /* @__PURE__ */ r.createElement(Zn, {
+    show: p.toString()
+  }, /* @__PURE__ */ r.createElement(Dn, {
+    ref: y,
+    buttons: [
+      {
+        id: "download",
+        onClick: et,
+        icon: "download",
+        ariaLabel: "Download image"
+      },
+      {
+        id: "lightbox-close",
+        onClick: () => g(null),
+        icon: "lightbox-close",
+        ariaLabel: "Close"
+      }
+    ]
+  })), /* @__PURE__ */ r.createElement(In, {
+    scrolling: c.toString(),
+    isDraggable: ot.toString(),
+    ref: T,
+    onMouseMove: nt,
+    onMouseDown: tt,
+    onMouseUp: rt
+  }, f !== null && /* @__PURE__ */ r.createElement(xn, $(h({
+    changeZoom: (x) => {
+      a(x);
+    },
+    zoomState: s
+  }, e), {
+    image: z[f]
+  }))), /* @__PURE__ */ r.createElement(Tn, {
+    ref: B,
+    show: p.toString(),
+    buttons: [
+      {
+        id: "previous",
+        onClick: Le,
+        icon: "caret-left",
+        circle: !0,
+        show: ee,
+        className: "nav-left",
+        ariaLabel: "Navigate to previous image"
+      },
+      {
+        id: "next",
+        onClick: Me,
+        icon: "caret-right",
+        circle: !0,
+        show: te,
+        className: "nav-right",
+        ariaLabel: "Navigate to next image"
+      }
+    ]
+  }), /* @__PURE__ */ r.createElement(Wn, {
+    show: p.toString()
+  }, /* @__PURE__ */ r.createElement(Bn, {
+    buttons: [
+      {
+        id: "zoom-out",
+        onClick: () => $e(!1),
+        icon: "zoom-out",
+        ariaLabel: "Zoom out"
+      },
+      {
+        id: "zoom-in",
+        onClick: () => $e(!0),
+        icon: "zoom-in",
+        ariaLabel: "Zoom in"
+      }
+    ]
+  }), /* @__PURE__ */ r.createElement(Nn, {
+    variant: "span"
+  }, Math.trunc(s * 100), "%")))), /* @__PURE__ */ r.createElement(Rn, {
+    ref: b,
+    onClick: Y,
+    onKeyDown: (x) => {
+      x.key === "Enter" && (x.preventDefault(), Y());
+    },
+    tabIndex: 0
+  }, /* @__PURE__ */ r.createElement(On, $(h({}, e), {
+    alt: ((Se = e.alt) == null ? void 0 : Se.toString()) || ""
+  }))));
+}, ke = N(
+  ({ show: e = "true", buttons: t, className: n }, o) => /* @__PURE__ */ r.createElement(Hn, {
+    ref: o,
+    show: e,
+    className: M("humany-button-set", n)
+  }, t.map(
+    ({ id: i, circle: s = !1, show: a = !0, ariaLabel: l, onClick: u, icon: c, className: m }, p) => /* @__PURE__ */ r.createElement(zn, {
+      key: i + p.toString(),
+      circle: s.toString(),
+      onClick: u,
+      tabIndex: a ? void 0 : -1,
+      show: a.toString(),
+      icon: c,
+      className: m,
+      "aria-label": l
+    }, /* @__PURE__ */ r.createElement(J, {
+      size: 24,
+      symbol: { type: "Svg", content: c }
+    }))
+  ))
+), Qe = C.div`
+    transition: opacity 0.3s ease 0s;
+    z-index: 5;
+    ${(e) => e.show === "true" ? "opacity: 1;" : L`
+                  opacity: 0;
+                  pointer-events: none;
+              `}
+`, Rn = C(xe)`
+    display: inline-block !important;
+`, Hn = C(Qe)`
+    position: fixed;
+    display: flex;
+    gap: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.normal;
+}};
+`, ge = "39px", zn = C(ae)`
+    width: ${ge};
+    height: ${ge};
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    ${(e) => e.icon === "caret-left" && L`
+            svg {
+                position: relative;
+                left: -2px;
+            }
+        `}
+
+    ${(e) => {
+  var t;
+  return e.circle === "true" ? L`
+                  background-color: #ffffff;
+                  border-radius: 50%;
+
+                  svg {
+                      path,
+                      line {
+                          stroke: ${(t = e.theme.colors) == null ? void 0 : t.text};
+                      }
+                  }
+
+                  &:focus-visible {
+                      ${P}
+                      outline-color: #ffffff;
+                      background-color: transparent;
+
+                      svg {
+                          path,
+                          line {
+                              stroke: #ffffff;
+                          }
+                      }
+                  }
+              ` : L`
+                  svg {
+                      path,
+                      line {
+                          stroke: #ffffff;
+                      }
+                  }
+                  &:focus {
+                      outline-color: #ffffff;
+                  }
+                  &:focus-visible {
+                      ${P}
+                  }
+              `;
+}}
+
+    ${(e) => e.show === "true" ? L`
+                  opacity: 0.8;
+                  transition: opacity 0.3s ease 0s;
+                  &:hover {
+                      opacity: 1;
+                  }
+              ` : L`
+                  opacity: 0;
+                  pointer-events: none;
+              `}
+`, Dn = C(ke)`
+    top: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.large;
+}};
+    right: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.large;
+}};
+`, Bn = C(ke)`
+    bottom: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.large;
+}};
+    width: 100%;
+    align-items: center;
+    justify-content: center;
+`, Tn = C(ke)`
+    display: block;
+    button {
+        position: fixed;
+        top: calc(50% - calc(${ge} / 2));
+        &:first-child {
+            left: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.large;
+}};
+        }
+        &:last-child {
+            right: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.large;
+}};
+        }
     }
-  }));
-}), jt = v.div`
+`, Nn = C(U)`
+    position: fixed;
+    bottom: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.large;
+}};
+    right: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.large;
+}};
+    color: #ffffff;
+    font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.medium;
+}};
+    font-family: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.type;
+}};
+`, Ge = C(Qe)`
+    position: absolute;
+    width: 100vw;
+    height: 88px;
+    left: 0px;
+    z-index: 5;
+`, Vn = C.div`
+    width: 100%;
+`, Zn = C(Ge)`
+    top: 0px;
+    background-image: linear-gradient(to bottom, rgb(34, 34, 34, 0.8), rgba(34, 34, 34, 0));
+`, Wn = C(Ge)`
+    bottom: 0px;
+    background-image: linear-gradient(to top, rgb(34, 34, 34, 0.8), rgba(34, 34, 34, 0));
+`, In = C.div`
+    width: 100%;
+    height: 100vh;
+    overflow: auto;
+    text-align: center;
+    vertical-align: middle;
+    white-space: nowrap;
+    justify-content: center;
+    cursor: ${(e) => e.isDraggable === "true" ? e.scrolling === "true" ? "grabbing" : "grab" : "auto"};
+`, On = C.img`
+    cursor: pointer;
+`, Fn = N(
+  (l, a) => {
+    var u = l, { className: e, children: t, trigger: n, onOverlayClick: o = () => {
+    }, close: i = !1 } = u, s = S(u, ["className", "children", "trigger", "onOverlayClick", "close"]);
+    const [c, m] = Ye(), [p, d] = Ke(!0), f = R(), g = R(q()), E = j("Escape");
+    w(() => {
+      (E || i) && m(!1);
+    }, [E, i]), w(() => {
+      c && f.current && f.current.focus();
+    }, [c, f.current]), ce("router:changed", () => {
+      m(!1);
+    });
+    const v = H(
+      (y) => {
+        m(!1), o(y);
+      },
+      [o, m]
+    );
+    Ce(a, () => ({
+      close() {
+        m(!1);
+      }
+    }));
+    const b = H(() => ve(g.current, () => {
+      m(!1);
+    }), [g.current]);
+    return /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(Ue, {
+      visible: c,
+      onClick: v
+    }, /* @__PURE__ */ r.createElement(An, $(h({
+      className: M(
+        e,
+        "humany-modal",
+        `humany-modal-${g.current}`
+      ),
+      css: p,
+      tabIndex: -1
+    }, s), {
+      ref: d
+    }), /* @__PURE__ */ r.createElement(Ee, {
+      onClick: () => m(!1),
+      tabIndex: 0,
+      ref: f
+    }, /* @__PURE__ */ r.createElement(J, {
+      symbol: { type: "Svg", content: "close" }
+    })), t)), r.cloneElement(n, {
+      onClick: (y) => {
+        m(), b();
+      }
+    }));
+  }
+), An = C.div`
     font-family: ${(e) => {
   var t;
   return (t = e.theme.fonts) == null ? void 0 : t.type;
@@ -1890,39 +2647,39 @@ const Et = 300, Bn = ({
   var t;
   return (t = e.theme.sizes) == null ? void 0 : t.medium;
 }};
-    ${Se}
+    ${je}
     ${(e) => e.css && e.css}
   outline: none;
-`, Pn = ({
+`, Z1 = ({
   className: e,
   trigger: t,
   header: n = "",
-  text: s = "",
-  onCancel: o = () => {
+  text: o = "",
+  onCancel: i = () => {
   },
-  onConfirm: i = () => {
+  onConfirm: s = () => {
   },
   cancelLabel: a = "",
-  confirmLabel: m = ""
+  confirmLabel: l = ""
 }) => {
-  const l = S(), c = H(() => {
-    var f;
-    o(), (f = l == null ? void 0 : l.current) == null || f.close();
-  }, [o]), u = H(() => {
-    var f;
-    i(), (f = l == null ? void 0 : l.current) == null || f.close();
-  }, [i]);
-  return /* @__PURE__ */ r.createElement(Xt, {
+  const u = R(), c = H(() => {
+    var p;
+    i(), (p = u == null ? void 0 : u.current) == null || p.close();
+  }, [i]), m = H(() => {
+    var p;
+    s(), (p = u == null ? void 0 : u.current) == null || p.close();
+  }, [s]);
+  return /* @__PURE__ */ r.createElement(Pn, {
     className: e,
     trigger: t,
-    ref: l,
+    ref: u,
     onOverlayClick: c
-  }, n && /* @__PURE__ */ r.createElement(xe, null, n), s && /* @__PURE__ */ r.createElement(xe, null, s), m && /* @__PURE__ */ r.createElement(_t, {
-    onClick: u
-  }, m), a && /* @__PURE__ */ r.createElement(Ut, {
+  }, n && /* @__PURE__ */ r.createElement(Ve, null, n), o && /* @__PURE__ */ r.createElement(Ve, null, o), l && /* @__PURE__ */ r.createElement(Kn, {
+    onClick: m
+  }, l), a && /* @__PURE__ */ r.createElement(Yn, {
     onClick: c
   }, a));
-}, Xt = v(Yt)`
+}, Pn = C(Fn)`
     display: block;
 
     span {
@@ -1940,7 +2697,7 @@ const Et = 300, Bn = ({
 }};
         }
     }
-`, _t = v(U)`
+`, Kn = C(ae)`
     display: inline-block;
     min-width: 50px;
     ${(e) => {
@@ -1964,13 +2721,13 @@ const Et = 300, Bn = ({
 }} 0 0;
 
     &:focus {
-        ${(e) => {
-  var t;
-  return ((t = e.theme.accessibility) == null ? void 0 : t.isTabbing) && P;
-}};
         background-color: transparent;
     }
-`, Ut = v(U)`
+
+    &:focus-visible {
+        ${P}
+    }
+`, Yn = C(ae)`
     display: inline-block;
     min-width: 50px;
     ${(e) => {
@@ -1988,48 +2745,51 @@ const Et = 300, Bn = ({
   return (t = e.theme.colors) == null ? void 0 : t.text;
 }};
 
-    &:focus {
-        ${(e) => {
-  var t;
-  return ((t = e.theme.accessibility) == null ? void 0 : t.isTabbing) && P;
-}};
+    &:focus-visible {
+        ${P};
     }
-`, Fn = ({
+`, W1 = ({
   header: e = "",
   link: t = "",
   suggestionHeader: n = "",
-  suggestion: s = ""
-}) => /* @__PURE__ */ r.createElement(qt, null, /* @__PURE__ */ r.createElement(Qt, null, /* @__PURE__ */ r.createElement(_, {
+  suggestion: o = ""
+}) => /* @__PURE__ */ r.createElement(jn, null, /* @__PURE__ */ r.createElement(Xn, null, /* @__PURE__ */ r.createElement(U, {
   variant: "h2"
-}, "404")), /* @__PURE__ */ r.createElement(Gt, null, /* @__PURE__ */ r.createElement(_, {
+}, "404")), /* @__PURE__ */ r.createElement(_n, null, /* @__PURE__ */ r.createElement(U, {
   variant: "h3"
-}, e), /* @__PURE__ */ r.createElement(en, {
+}, e), /* @__PURE__ */ r.createElement(qn, {
   routeName: "index",
   "aria-label": t,
   text: t
-})), /* @__PURE__ */ r.createElement(Jt, null, /* @__PURE__ */ r.createElement("span", null, n), /* @__PURE__ */ r.createElement("ul", null, /* @__PURE__ */ r.createElement("li", null, s)))), qt = v.div`
+})), /* @__PURE__ */ r.createElement(Un, null, /* @__PURE__ */ r.createElement("span", null, n), /* @__PURE__ */ r.createElement("ul", null, /* @__PURE__ */ r.createElement("li", null, o)))), jn = C.div`
     display: flex;
     flex-wrap: wrap;
-`, Qt = v.div`
-    ${X("h2", M`
+`, Xn = C.div`
+    ${se(
+  "h2",
+  L`
             padding: 0;
             margin: 0;
             color: gray;
             font-size: 7em;
-        `)}
-`, Gt = v.div`
+        `
+)}
+`, _n = C.div`
     margin-left: ${(e) => {
   var t;
   return (t = e.theme.sizes) == null ? void 0 : t.medium;
 }};
 
-    ${X("h3", M`
+    ${se(
+  "h3",
+  L`
             text-transform: uppercase;
             font-size: ${(e) => {
-  var t;
-  return (t = e.theme.fonts) == null ? void 0 : t.normal;
-}};
-        `)}
+    var t;
+    return (t = e.theme.fonts) == null ? void 0 : t.normal;
+  }};
+        `
+)}
 
     a {
         color: ${(e) => {
@@ -2041,7 +2801,7 @@ const Et = 300, Bn = ({
   return (t = e.theme.fonts) == null ? void 0 : t.small;
 }};
     }
-`, Jt = v.div`
+`, Un = C.div`
     margin-top: ${(e) => {
   var t;
   return (t = e.theme.sizes) == null ? void 0 : t.medium;
@@ -2052,25 +2812,30 @@ const Et = 300, Bn = ({
         font-weight: bold;
     }
 `;
-class Zn extends We {
+class I1 extends dt {
   constructor() {
-    super(...arguments), this.state = {
+    super(...arguments);
+    re(this, "node");
+    re(this, "onFocusListener");
+    re(this, "state", {
       boundFocus: !1
-    };
+    });
   }
   componentWillMount() {
-    const t = this.props.container.get("accessibilitySettings");
-    t && t.boundFocus && this.setState({
+    const n = this.props.container.get("accessibilitySettings");
+    n && n.boundFocus && this.setState({
       boundFocus: !0
     });
   }
   componentDidMount() {
     if (!this.state.boundFocus)
       return;
-    const t = this.props.container.get("widgetDOMElement");
-    this.node && t && (this.onFocusListener = this.node.addEventListener("focus", () => {
-      const n = t.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'), o = [].filter.call(n, (i) => typeof window == "undefined" ? !0 : !(window.getComputedStyle(i).display === "none" || i.offsetWidth <= 0 && i.offsetHeight <= 0))[0];
-      o && o.focus();
+    const n = this.props.container.get("widgetDOMElement");
+    this.node && n && (this.onFocusListener = this.node.addEventListener("focus", () => {
+      const o = n.querySelectorAll(
+        'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
+      ), s = [].filter.call(o, (a) => typeof window == "undefined" ? !0 : !(window.getComputedStyle(a).display === "none" || a.offsetWidth <= 0 && a.offsetHeight <= 0))[0];
+      s && s.focus();
     }));
   }
   componentWillUnmount() {
@@ -2080,62 +2845,67 @@ class Zn extends We {
     return this.state.boundFocus ? /* @__PURE__ */ r.createElement("div", {
       style: { opacity: 0 },
       tabIndex: 0,
-      ref: (t) => {
-        this.node = t;
+      ref: (n) => {
+        this.node = n;
       }
     }) : null;
   }
 }
-const en = D((a, i) => {
-  var m = a, { className: e, description: t, text: n, children: s } = m, o = $(m, ["className", "description", "text", "children"]);
-  return /* @__PURE__ */ r.createElement(Te, k(p({
-    className: w(e, "humany-text-link")
-  }, o), {
-    ref: i
-  }), s, /* @__PURE__ */ r.createElement(me, null, n), t ? /* @__PURE__ */ r.createElement(Re, {
-    html: t,
-    className: "humany-description"
-  }) : null);
-});
-var tn = /* @__PURE__ */ ((e) => (e.HH_MM = "hh:mm", e.YYYY_MM_DD = "yyyy-mm-dd", e.YYYY_MM_DD_HH_MM = "yyyy-mm-dd hh:mm", e))(tn || {});
-const An = ({ className: e = "", format: t = "hh:mm", timestamp: n }) => /* @__PURE__ */ r.createElement("span", {
-  className: w(e, "humany-timestamp")
-}, nn(n, t)), Ee = (e) => `0${e}`.slice(-2);
-function nn(e, t) {
-  const n = new Date(e), s = n.toTimeString().split(" ")[0].split(":"), o = s.length > 1 ? `${s[0]}:${s[1]}` : s[0], i = n.getFullYear(), a = n.getMonth() + 1, m = n.getDate(), l = `${i}-${Ee(a)}-${Ee(m)}`;
-  return t === "yyyy-mm-dd" ? l : t === "hh:mm" ? o : `${l} ${o}`;
+const qn = N(
+  (a, s) => {
+    var l = a, { className: e, description: t, text: n, children: o } = l, i = S(l, ["className", "description", "text", "children"]);
+    return /* @__PURE__ */ r.createElement(xe, $(h({
+      className: M(e, "humany-text-link")
+    }, i), {
+      ref: s
+    }), o, /* @__PURE__ */ r.createElement(we, null, n), t ? /* @__PURE__ */ r.createElement(_e, {
+      html: t,
+      className: "humany-description"
+    }) : null);
+  }
+);
+var Qn = /* @__PURE__ */ ((e) => (e.HH_MM = "hh:mm", e.YYYY_MM_DD = "yyyy-mm-dd", e.YYYY_MM_DD_HH_MM = "yyyy-mm-dd hh:mm", e))(Qn || {});
+const O1 = ({ className: e = "", format: t = "hh:mm", timestamp: n }) => /* @__PURE__ */ r.createElement("span", {
+  className: M(e, "humany-timestamp")
+}, Gn(n, t)), Ze = (e) => `0${e}`.slice(-2);
+function Gn(e, t) {
+  const n = new Date(e), o = n.toTimeString().split(" ")[0].split(":"), i = o.length > 1 ? `${o[0]}:${o[1]}` : o[0], s = n.getFullYear(), a = n.getMonth() + 1, l = n.getDate(), u = `${s}-${Ze(a)}-${Ze(l)}`;
+  return t === "yyyy-mm-dd" ? u : t === "hh:mm" ? i : `${u} ${i}`;
 }
-const Kn = (i) => {
-  var a = i, { className: e, children: t, content: n, sticky: s = !1 } = a, o = $(a, ["className", "children", "content", "sticky"]);
-  const [m, l] = L(!1), c = S(F()), u = S(), [{ x: f, y: d }, h] = He(m, c.current, u.current), g = (x) => {
-    const { target: y } = x;
-    !u.current || !y || u.current !== y && !u.current.contains(y) && l(!1);
+const F1 = (s) => {
+  var a = s, { className: e, children: t, content: n, sticky: o = !1 } = a, i = S(a, ["className", "children", "content", "sticky"]);
+  const [l, u] = k(!1), c = R(q()), m = R(), [{ x: p, y: d }, f] = Xe(l, c.current, m.current), g = (v) => {
+    const { target: b } = v;
+    !m.current || !b || m.current !== b && !m.current.contains(b) && u(!1);
   };
-  C(() => {
-    if (!!s)
+  w(() => {
+    if (!!o)
       return window.addEventListener("click", g), () => {
         window.removeEventListener("click", g);
       };
-  }, [m, s]);
-  const E = H((x, y) => {
-    h(x, u.current), l(y);
-  }, [h, l]);
-  return /* @__PURE__ */ r.createElement(rn, {
-    ref: u,
+  }, [l, o]);
+  const E = H(
+    (v, b) => {
+      f(v, m.current), u(b);
+    },
+    [f, u]
+  );
+  return /* @__PURE__ */ r.createElement(Jn, {
+    ref: m,
     className: "humany-tooltip-trigger",
-    onMouseEnter: s ? void 0 : (x) => E(x, !0),
-    onMouseLeave: s ? void 0 : (x) => E(x, !1),
-    onTouchEnd: s ? (x) => E(x, !m) : void 0,
-    onClick: s ? (x) => E(x, !m) : void 0
-  }, t, m && /* @__PURE__ */ r.createElement(G, null, /* @__PURE__ */ r.createElement(on, p({
-    className: w(e, "humany-tooltip-container"),
-    x: f,
+    onMouseEnter: o ? void 0 : (v) => E(v, !0),
+    onMouseLeave: o ? void 0 : (v) => E(v, !1),
+    onTouchEnd: o ? (v) => E(v, !l) : void 0,
+    onClick: o ? (v) => E(v, !l) : void 0
+  }, t, l && /* @__PURE__ */ r.createElement(G, null, /* @__PURE__ */ r.createElement(e1, h({
+    className: M(e, "humany-tooltip-container"),
+    x: p,
     y: d
-  }, o), n)));
-}, rn = v.div`
+  }, i), n)));
+}, Jn = C.div`
     display: flex;
     align-items: center;
-`, on = v.div`
+`, e1 = C.div`
     color: #ffffff;
     background: #161616;
     border-radius: ${(e) => e.theme.borderRadius};
@@ -2168,185 +2938,224 @@ const Kn = (i) => {
   let t = "";
   return e.y > 0 ? t += `top: calc(2px + ${e.y || "0"}px);` : t += "bottom: 2px;", e.x > 0 ? t += `right: calc(2px + ${e.x || "0"}px);` : t += "left: 2px;", t;
 }};
-`, Yn = (e) => {
+`, A1 = (e) => {
   const {
     in: t,
     mountOnEnter: n = !0,
-    unmountOnExit: s = !0,
-    timeout: o,
-    children: i,
+    unmountOnExit: o = !0,
+    timeout: i,
+    children: s,
     transitions: a
-  } = e, l = (() => {
-    var c, u;
+  } = e, u = (() => {
+    var c, m;
     if (!(!a || a === "none")) {
       if (typeof a == "string")
         return {
           enter: {
             transitionKeys: a,
-            duration: o ? typeof o == "number" ? o : o.enter : 200,
+            duration: i ? typeof i == "number" ? i : i.enter : 200,
             easing: "ease-in"
           },
           exit: {
             transitionKeys: a,
-            duration: o ? typeof o == "number" ? o : o.exit : 200,
+            duration: i ? typeof i == "number" ? i : i.exit : 200,
             easing: "ease-out"
           }
         };
       if (typeof a == "object") {
-        const { enter: f, exit: d } = a;
+        const { enter: p, exit: d } = a;
         return {
           enter: {
             transitionKeys: (c = a.enter) == null ? void 0 : c.type,
-            duration: o ? typeof o == "number" ? o : o.enter : 200,
-            easing: f.easing ? f.easing : "ease-in"
+            duration: i ? typeof i == "number" ? i : i.enter : 200,
+            easing: p.easing ? p.easing : "ease-in"
           },
           exit: {
-            transitionKeys: (u = a.enter) == null ? void 0 : u.type,
-            duration: o ? typeof o == "number" ? o : o.enter : 200,
+            transitionKeys: (m = a.enter) == null ? void 0 : m.type,
+            duration: i ? typeof i == "number" ? i : i.enter : 200,
             easing: d.easing ? d.easing : "ease-out"
           }
         };
       }
     }
   })();
-  return /* @__PURE__ */ r.createElement(Ie, {
+  return /* @__PURE__ */ r.createElement(ht, {
     timeout: {
-      enter: l && l.enter.duration || 0,
-      exit: l && l.exit.duration || 0
+      enter: u && u.enter.duration || 0,
+      exit: u && u.exit.duration || 0
     },
     in: t,
     appear: !0,
     mountOnEnter: n,
-    unmountOnExit: s,
+    unmountOnExit: o,
     onEnter: (c) => c.clientHeight
-  }, (c) => i && i(c, l && oe.compose(c, l)));
-}, sn = D((m, a) => {
-  var l = m, { className: e, children: t, onClick: n = () => {
-  }, widgetName: s, activationOptions: o } = l, i = $(l, ["className", "children", "onClick", "widgetName", "activationOptions"]);
-  const c = T(), u = () => {
-    const { implementation: h } = c.get("$widget");
-    return h.widgets.get(s);
-  };
-  C(() => {
-    const h = u();
-    return h == null || h.activate(o).then(() => h.invoke("attach")), () => {
-      h == null || h.deactivate();
+  }, (c) => s && s(c, u && he.compose(c, u)));
+}, t1 = N(
+  (l, a) => {
+    var u = l, { className: e, children: t, onClick: n = () => {
+    }, widgetName: o, activationOptions: i } = u, s = S(u, ["className", "children", "onClick", "widgetName", "activationOptions"]);
+    const c = Z(), m = () => {
+      const { implementation: f } = c.get("$widget");
+      return f.widgets.get(o);
     };
-  }, [s]);
-  const f = (h) => {
-    const g = u(), E = h.currentTarget;
-    if (g) {
-      const x = () => {
-        g.invoke("renderState").then((y) => y === j.open ? g.invoke("close") : g.invoke("open")).then(() => {
-          g.events.subscribeOnce("widget:area-rendered", (y, b) => {
-            c.get("widgetDOMElement") && g.events.dispatch("widget:modal-opened", {
-              name: g.name,
-              ref: E
+    w(() => {
+      const f = m();
+      return f == null || f.activate(i).then(() => f.invoke("attach")), () => {
+        f == null || f.deactivate();
+      };
+    }, [o]);
+    const p = (f) => {
+      const g = m(), E = f.currentTarget;
+      if (g) {
+        const v = () => {
+          g.invoke("renderState").then(
+            (b) => b === oe.open ? g.invoke("close") : g.invoke("open")
+          ).then(() => {
+            g.events.subscribeOnce("widget:area-rendered", (b, y) => {
+              c.get(
+                "widgetDOMElement"
+              ) && g.events.dispatch("widget:modal-opened", {
+                name: g.name,
+                ref: E
+              });
             });
           });
-        });
-      };
-      g.state === Fe.Deactivated ? g.activate(o).then(() => g.invoke("attach")).then(x) : x();
-    }
-  }, d = (h) => {
-    h.key === "Enter" && (h.preventDefault(), f(h));
-  };
-  return /* @__PURE__ */ r.createElement(Te, k(p({
-    className: w(e, "humany-widget-link"),
-    onKeyDown: d,
-    onClick: (h) => {
-      n(h), f(h);
-    }
-  }, i), {
-    ref: a
-  }), t);
-}), jn = (e, t, n, s, o) => e.getAsync("componentResolver").then((i) => (i.registerComponent(t, Oe(() => n)), je(e, t, s || (() => {
-}), t, o)));
+        };
+        g.state === gt.Deactivated ? g.activate(i).then(() => g.invoke("attach")).then(v) : v();
+      }
+    }, d = (f) => {
+      f.key === "Enter" && (f.preventDefault(), p(f));
+    };
+    return /* @__PURE__ */ r.createElement(xe, $(h({
+      className: M(e, "humany-widget-link"),
+      onKeyDown: d,
+      onClick: (f) => {
+        n(f), p(f);
+      }
+    }, s), {
+      ref: a
+    }), t);
+  }
+), P1 = N(
+  ({ portalId: e = "humany-widget-overlay-portal", className: t, children: n }, o) => {
+    const i = Z(), s = ie(() => {
+      if (!i)
+        return null;
+      const a = i.get("widgetDOMElement");
+      return !a || !a.childElementCount ? null : a.children[0];
+    }, [i]);
+    return s ? /* @__PURE__ */ r.createElement(G, {
+      elementId: e,
+      parent: s
+    }, /* @__PURE__ */ r.createElement(n1, {
+      className: M("humany-widget-overlay-outlet", t),
+      ref: o
+    }, n)) : null;
+  }
+), n1 = C.div`
+    background-color: #ffffff;
+    position: absolute;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    z-index: 10;
+    width: 100%;
+    height: 100%;
+`, K1 = (e, t, n, o, i) => e.getAsync("componentResolver").then((s) => (s.registerComponent(
+  t,
+  ft(() => n)
+), wt(e, t, o || (() => {
+}), t, i)));
 export {
-  it as AnchorLink,
-  U as Button,
-  Cn as Checkbox,
-  lt as ColumnContext,
-  $e as ComponentNodeContext,
-  ut as ComponentPropertyContext,
-  Pn as Confirm,
-  ct as ContainerContext,
-  tn as DateFormats,
-  Bn as Drawer,
-  xt as DrawerAnimationType,
-  Vn as Dropdown,
-  Ht as Empty,
-  Wn as Grid,
-  Re as Html,
-  Tt as Icon,
-  On as Input,
-  Bt as ItemList,
-  In as ItemTree,
-  Wt as Lightbox,
-  Te as Link,
-  Nt as List,
-  Yt as Modal,
-  Fn as NotFound,
-  De as Overlay,
-  zt as Paragraph,
+  Nt as AnchorLink,
+  ae as Button,
+  p1 as Checkbox,
+  Wt as ColumnContext,
+  Fe as ComponentNodeContext,
+  It as ComponentPropertyContext,
+  Z1 as Confirm,
+  Zt as ContainerContext,
+  Qn as DateFormats,
+  D1 as Drawer,
+  qt as DrawerAnimationType,
+  B1 as Dropdown,
+  sn as Empty,
+  T1 as Grid,
+  _e as Html,
+  ln as Icon,
+  N1 as Input,
+  dn as ItemList,
+  V1 as ItemTree,
+  Sn as Lightbox,
+  xe as Link,
+  un as List,
+  Fn as Modal,
+  W1 as NotFound,
+  Ue as Overlay,
+  mn as Paragraph,
   G as Portal,
-  Zt as RouteLink,
-  mt as RoutingContext,
-  xe as StyledText,
-  A as SymbolBadge,
-  Zn as TabStop,
-  me as Text,
-  en as TextLink,
-  An as Timestamp,
-  Kn as Tooltip,
-  Yn as TransitionComponent,
-  _ as Typography,
-  sn as WidgetLink,
+  fn as RouteLink,
+  Ot as RoutingContext,
+  Ve as StyledText,
+  J as SymbolBadge,
+  I1 as TabStop,
+  we as Text,
+  qn as TextLink,
+  O1 as Timestamp,
+  F1 as Tooltip,
+  A1 as TransitionComponent,
+  U as Typography,
+  t1 as WidgetLink,
+  P1 as WidgetOverlayOutlet,
   P as borderTabStyle,
-  Ce as browser,
-  pt as buttonCss,
-  Se as contentBox,
-  R as convertToStringAttributes,
-  bn as createEmptyComponent,
-  jn as createReactComponent,
-  st as defaultRenderInstructions,
-  et as embeddedLinkMapper,
-  we as filterCssProps,
-  tt as filterCssPropsStyle,
-  nt as genericHashLink,
-  X as headingElement,
-  Dn as invertedHoverButton,
-  zn as itemList,
-  Tn as linkTabStyle,
-  gt as list,
-  Nn as paddedBorderTabStyle,
-  rt as processHtmlString,
-  oe as transitionComposer,
-  xn as useAction,
-  En as useChildren,
-  vn as useColumns,
-  wn as useComponent,
-  ae as useComponentDescriptor,
-  ce as useComponentNode,
-  I as useComponentPlatform,
-  T as useContainer,
-  dt as useContext,
-  $n as useDispatch,
-  z as useEventListener,
-  ft as useEvents,
-  B as useIsMounted,
-  q as useKeyPress,
-  kn as useLayout,
-  ke as usePrevious,
-  Ln as useProperties,
-  Mn as useRenderState,
-  Sn as useRouteData,
-  Le as useRouter,
-  Me as useScroll,
-  Hn as useSettings,
-  le as useToggle,
-  Rn as useTransitionEnd,
-  ue as useUniqueMenu,
-  Q as useWidgetEvent
+  Ne as browser,
+  Kt as buttonCss,
+  je as contentBox,
+  V as convertToStringAttributes,
+  h1 as createEmptyComponent,
+  K1 as createReactComponent,
+  Tt as defaultRenderInstructions,
+  Rt as embeddedLinkMapper,
+  Oe as filterCssProps,
+  Ht as filterCssPropsStyle,
+  zt as genericHashLink,
+  z1 as genericHtml,
+  se as headingElement,
+  Bt as imageLightboxRenderer,
+  S1 as invertedHoverButton,
+  H1 as itemList,
+  Yt as linkTabStyle,
+  jt as list,
+  R1 as paddedBorderTabStyle,
+  Dt as processHtmlString,
+  he as transitionComposer,
+  g1 as useAction,
+  C1 as useChildren,
+  y1 as useColumns,
+  b1 as useComponent,
+  ye as useComponentDescriptor,
+  be as useComponentNode,
+  _ as useComponentPlatform,
+  Z as useContainer,
+  Ft as useContext,
+  v1 as useDispatch,
+  I as useEventListener,
+  At as useEvents,
+  O as useIsMounted,
+  w1 as useIsTabbing,
+  j as useKeyPress,
+  E1 as useLayout,
+  Ae as usePrevious,
+  x1 as useProperties,
+  k1 as useRenderState,
+  $1 as useRouteData,
+  Pe as useRouter,
+  Ke as useScroll,
+  L1 as useSettings,
+  Ye as useToggle,
+  M1 as useTransitionEnd,
+  ve as useUniqueMenu,
+  ce as useWidgetEvent
 };
 //# sourceMappingURL=index.js.map