@telia-ace/widget-ui 1.0.16 → 1.0.19

package/dist/index.js

@@ -1,51 +1,35 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-import styled, { css, keyframes } from "styled-components";
-import { kebabCase, appendClassNames, uuid, removeNullAndUndefinedValues } from "@telia-ace/widget-utilities";
-import React, { forwardRef, createContext, useContext as useContext$1, useState, useEffect, useRef, useCallback, useImperativeHandle, useMemo, Component, lazy } from "react";
-import { CSSTransition, Transition } from "react-transition-group";
-import { Container, WidgetState } from "@webprovisions/platform";
-import { ComponentPlatform, asDescriptor, createEventSubscriber, ComponentQuery, WidgetRenderState, extendComponent } from "@telia-ace/widget-core";
-import { createPortal } from "react-dom";
-import convert from "htmr";
-import { HistoryMode, getSpecificWidgetPath } from "@telia-ace/widget-routing";
-import { Link as Link$1 } from "react-router-dom";
-const inEnteringState = (status) => {
-  return status === "entering" || status === "entered";
-};
-const inExitingState = (status) => {
-  return status === "exiting" || status === "exited";
-};
-const partials = {
+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) => {
+  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]);
+  return e;
+}, k = (e, t) => ze(e, Be(t));
+var $ = (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]);
+  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 = {
   fade: {
     in: "opacity: 1;",
     out: "opacity: 0;"
@@ -70,52 +54,40 @@ const partials = {
     in: "transform: scale(1);",
     out: "transform: scale(0);"
   }
-};
-const transformTransitions = ["slide-up", "slide-down", "slide-left", "slide-right", "scale"];
-const transitionComposer = {
-  compose: (status = "exited", definitions) => {
-    const { enter, exit } = definitions;
-    const inKeys = enter.transitionKeys.split(" ");
-    const transitionProperty = transformTransitions.indexOf(inKeys[0]) > -1 ? "transform" : "opacity";
-    if (inEnteringState(status)) {
-      if (inKeys && inKeys.length > 0) {
-        return css`
-                    ${inKeys && inKeys.length > 0 && inKeys.map((key) => partials[key] ? partials[key].in : "")}
-                    transition: ${transitionProperty} ${enter.duration}ms ${enter.easing};
-                `;
-      }
-      return "";
-    }
-    const inBase = inKeys && inKeys.length > 0 && css`
-                ${inKeys.map((key) => partials[key] ? partials[key].out : "")}
+}, Qe = ["slide-up", "slide-down", "slide-left", "slide-right", "scale"], oe = {
+  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 a = o && o.length > 0 && M`
+                ${o.map((m) => W[m] ? W[m].out : "")}
             `;
-    if (inExitingState(status)) {
-      const outKeys = exit.transitionKeys.split(" ");
-      if (outKeys && outKeys.length > 0 && status === "exiting") {
-        return css`
-                    ${inBase};
-                    ${outKeys.map((key) => partials[key] ? partials[key].out : "")}
-                    transition: ${transitionProperty} ${exit.duration}ms ${exit.easing};
-                `;
-      }
-      return inBase;
+    if (qe(e)) {
+      const m = s.transitionKeys.split(" ");
+      return m && m.length > 0 && e === "exiting" ? M`
+                    ${a};
+                    ${m.map((l) => W[l] ? W[l].out : "")}
+                    transition: ${i} ${s.duration}ms ${s.easing};
+                ` : a;
     }
   },
-  composeViewTransition: (status, type, direction) => {
-    if (type === "slide") {
-      return transitionComposer.compose(status, {
+  composeViewTransition: (e, t, n) => {
+    if (t === "slide")
+      return oe.compose(e, {
         enter: {
-          transitionKeys: direction === "forth" ? "slide-right" : "slide-left",
+          transitionKeys: n === "forth" ? "slide-right" : "slide-left",
           duration: 500
         },
         exit: {
-          transitionKeys: direction === "forth" ? "slide-left" : "slide-right",
+          transitionKeys: n === "forth" ? "slide-left" : "slide-right",
           duration: 500
         }
       });
-    }
-    if (type === "fade") {
-      return transitionComposer.compose(status, {
+    if (t === "fade")
+      return oe.compose(e, {
         enter: {
           transitionKeys: "fade",
           duration: 500
@@ -125,232 +97,130 @@ const transitionComposer = {
           duration: 500
         }
       });
-    }
   },
-  get: (title) => {
-    return partials[title];
-  }
+  get: (e) => W[e]
 };
-var Browsers = /* @__PURE__ */ ((Browsers2) => {
-  Browsers2["Opera"] = "opera";
-  Browsers2["Chrome"] = "chrome";
-  Browsers2["Firefox"] = "firefox";
-  Browsers2["Safari"] = "safari";
-  Browsers2["Edge"] = "edge";
-  Browsers2["EdgeChromium"] = "edge-chromium";
-  Browsers2["Blink"] = "blink";
-  Browsers2["IE"] = "internet-explorer";
-  return Browsers2;
-})(Browsers || {});
-var browser = () => {
+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 = () => {
   const {
-    opr,
-    opera,
-    InstallTrigger,
-    HTMLElement,
-    safari,
-    documentMode,
-    StyleMedia,
-    chrome,
-    CSS
-  } = window;
-  const isOpera = !!opr && !!opr.addons || !!opera || navigator.userAgent.indexOf(" OPR/") >= 0;
-  if (isOpera) {
+    opr: e,
+    opera: t,
+    InstallTrigger: n,
+    HTMLElement: s,
+    safari: o,
+    documentMode: i,
+    StyleMedia: a,
+    chrome: m,
+    CSS: l
+  } = window, c = !!e && !!e.addons || !!t || navigator.userAgent.indexOf(" OPR/") >= 0;
+  if (c)
     return "opera";
-  }
-  if (InstallTrigger) {
+  if (n)
     return "firefox";
-  }
-  const safariCheck = ((p) => {
-    return p.toString() === "[object SafariRemoteNotification]";
-  })(!safari || typeof safari !== "undefined" && safari.pushNotification);
-  if (/constructor/i.test(HTMLElement) || safariCheck) {
+  const u = ((h) => h.toString() === "[object SafariRemoteNotification]")(!o || typeof o != "undefined" && o.pushNotification);
+  if (/constructor/i.test(s) || u)
     return "safari";
-  }
-  const isIE = !!documentMode;
-  if (isIE) {
+  const f = !!i;
+  if (f)
     return "internet-explorer";
-  }
-  if (!isIE && !!StyleMedia) {
+  if (!f && !!a)
     return "edge";
-  }
-  const isChrome = !!chrome && (!!chrome.webstore || !!chrome.runtime);
-  if (isChrome) {
+  const d = !!m && (!!m.webstore || !!m.runtime);
+  if (d)
     return "chrome";
-  }
-  if (isChrome && navigator.userAgent.indexOf("Edg") !== -1) {
+  if (d && navigator.userAgent.indexOf("Edg") !== -1)
     return "edge-chromium";
-  }
-  if ((isChrome || isOpera) && !!CSS) {
+  if ((d || c) && !!l)
     return "blink";
-  }
-};
-const types = ["string", "number"];
-var convertToStringAttributes = (props) => {
-  return Object.keys(props).reduce((result, key) => {
-    const value = typeof props[key] === "undefined" ? "" : props[key];
-    const type = typeof value;
-    if (types.indexOf(type) > -1) {
-      const sub = key.substring(0, 5);
-      if (sub === "data-" || sub === "aria-") {
-        result[kebabCase(key)] = value.toString();
-      } else if (key.substring(0, 4) !== "css-") {
-        result[key] = value.toString();
-      }
-    } else {
-      result[key] = value;
-    }
-    return result;
-  }, {});
-};
-const createEmptyComponent = (container, props) => {
-  if (container.get("seoConfiguration")) {
-    return /* @__PURE__ */ React.createElement(Empty, __spreadValues({}, props));
-  }
-  return null;
-};
-const isAnchorLink = (href) => {
-  const re = new RegExp("^#", "i");
-  const match = re.test(href);
-  return match;
-};
-const embeddedLinkMapper = (container) => (_a) => {
-  var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
+}, 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());
+  } else
+    t[n] = s;
+  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"]);
   const {
-    implementation,
-    name: currentWidgetName
-  } = container.get("$widget");
-  const { href = "" } = props;
-  if (isAnchorLink(href)) {
-    return /* @__PURE__ */ React.createElement(AnchorLink, {
-      smooth: true,
-      to: href
-    }, children);
+    implementation: i,
+    name: a
+  } = e.get("$widget"), { href: m = "" } = n;
+  if (Je(m))
+    return /* @__PURE__ */ r.createElement(it, {
+      smooth: !0,
+      to: m
+    }, 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
+      }, t);
   }
-  const escapedBindings = implementation.bindings.map((binding) => binding.replace(/\./g, "\\.")).join("|");
-  const regexp = new RegExp(`^((http[s]?:)?//)?(${escapedBindings})/([^\\s]+)`);
-  const expArray = regexp.exec(href);
-  if (expArray && expArray.length >= 4) {
-    const targetWidgetName = expArray[4];
-    const targetWidget = implementation.widgets.get(targetWidgetName);
-    if (targetWidget && !targetWidgetName.startsWith("blob?") && !targetWidgetName.startsWith(currentWidgetName)) {
-      return /* @__PURE__ */ React.createElement(WidgetLink, {
-        widgetName: targetWidgetName
-      }, children);
-    }
-  }
-  return /* @__PURE__ */ React.createElement("a", __spreadValues({}, props), children);
-};
-const filterCssProps = (props) => {
-  const cssProps = {};
-  Object.keys(props).forEach((key) => {
-    if (key.indexOf("css-") > -1) {
-      cssProps[key] = props[key];
-    }
-  });
-  return cssProps;
-};
-const filterCssPropsStyle = css`
-    ${(p) => {
-  let css2 = "";
-  Object.keys(filterCssProps(p)).forEach((key) => {
-    if (key.indexOf("css-") > -1) {
-      css2 += `${key.replace("css-", "")}:${p[key]};`;
-    }
-  });
-  return css2;
+  return /* @__PURE__ */ r.createElement("a", p({}, n), t);
+}, we = (e) => {
+  const t = {};
+  return Object.keys(e).forEach((n) => {
+    n.indexOf("css-") > -1 && (t[n] = e[n]);
+  }), t;
+}, tt = M`
+    ${(e) => {
+  let t = "";
+  return Object.keys(we(e)).forEach((n) => {
+    n.indexOf("css-") > -1 && (t += `${n.replace("css-", "")}:${e[n]};`);
+  }), t;
 }}
-`;
-const genericHashLink = (props, As) => {
-  let hashFragment = "";
-  const reset = () => {
-    hashFragment = "";
-  };
-  const getElementAndScroll = (scrollFunction) => {
-    const element = document.getElementById(hashFragment);
-    if (element !== null) {
-      scrollFunction(element);
-      reset();
-      return true;
-    }
-    return false;
-  };
-  const handleClick = (e) => {
-    e.preventDefault();
-    reset();
-    if (props.onClick)
-      props.onClick(e);
-    if (typeof props.to === "string") {
-      hashFragment = props.to.split("#").slice(1).join("#");
-    }
-    if (hashFragment !== "") {
-      getElementAndScroll(props.scroll || ((el) => props.smooth ? el.scrollIntoView({ behavior: "smooth" }) : el.scrollIntoView()));
-    }
-    return false;
-  };
-  const _a = props, { scroll, smooth, to } = _a, filteredProps = __objRest(_a, ["scroll", "smooth", "to"]);
-  if (As === "a") {
-    filteredProps.href = "javascript:;";
-  }
-  return /* @__PURE__ */ React.createElement(As, __spreadProps(__spreadValues({}, filteredProps), {
-    onClick: handleClick
-  }), props.children);
-};
-const headingElement = (element, style) => {
-  let defaultTag = element;
-  let prefix = "";
-  if (["h1", "h2", "h3", "h4", "h5", "h6"].includes(element)) {
-    defaultTag = element;
-  } else {
-    const match = element.match(/h1|h2|h3|h4|h5|h6/);
-    if (match == null ? void 0 : match[0]) {
-      defaultTag = match[0];
-      const [pre] = element.split(defaultTag);
-      prefix = pre;
+`, nt = (e, t) => {
+  let n = "";
+  const s = () => {
+    n = "";
+  }, o = (f) => {
+    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
+  }), e.children);
+}, X = (e, t) => {
+  let n = e, s = "";
+  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 [a] = e.split(n);
+      s = a;
     }
   }
-  const renderTag = (element2, pre, mapping) => {
-    if (mapping[element2]) {
-      return `${pre}${mapping[element2]}`;
-    }
-    return `${pre}${element2}`;
-  };
-  return css`
-        ${(p) => renderTag(defaultTag, prefix, p.theme.typographyVariantMapping || {})} {
-            ${style}
+  const o = (i, a, m) => m[i] ? `${a}${m[i]}` : `${a}${i}`;
+  return M`
+        ${(i) => o(n, s, i.theme.typographyVariantMapping || {})} {
+            ${t}
         }
     `;
 };
-function parseHtmlString(html, instruction) {
-  if (instruction) {
-    return convert(html, instruction);
-  }
-  return convert(html);
+function rt(e, t) {
+  return t ? ye(e, t) : ye(e);
 }
-const imageLightboxRenderer = (attrs) => /* @__PURE__ */ React.createElement(Lightbox, {
-  attrs
-});
-const defaultRenderInstructions = (container) => {
-  return {
-    transform: {
-      a: embeddedLinkMapper(container),
-      img: imageLightboxRenderer
-    }
-  };
-};
-const AnchorLink = (props) => {
-  return genericHashLink(props, "a");
-};
-var Button = forwardRef((_a, ref) => {
-  var _b = _a, { className, children } = _b, other = __objRest(_b, ["className", "children"]);
-  return /* @__PURE__ */ React.createElement(StyledButton$2, __spreadProps(__spreadValues({
+const ot = (e) => /* @__PURE__ */ r.createElement(Wt, {
+  attrs: e
+}), st = (e) => ({
+  transform: {
+    a: et(e),
+    img: ot
+  }
+}), 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({
     type: "button",
-    className: appendClassNames(className, "humany-button")
-  }, convertToStringAttributes(other)), {
-    ref
-  }), children);
-});
-const StyledButton$2 = styled.button`
+    className: w(e, "humany-button")
+  }, R(n)), {
+    ref: s
+  }), t);
+}), at = v.button`
     -webkit-appearance: button;
     text-transform: none;
     overflow: visible;
@@ -363,423 +233,239 @@ const StyledButton$2 = styled.button`
     line-height: normal;
     margin: 0;
     padding: 0;
-`;
-const Checkbox = (_c) => {
-  var _d = _c, {
-    onChange = () => {
+`, Cn = (o) => {
+  var i = o, {
+    onChange: e = () => {
     },
-    onEnter = () => {
+    onEnter: t = () => {
     },
-    className
-  } = _d, other = __objRest(_d, [
+    className: n
+  } = i, s = $(i, [
     "onChange",
     "onEnter",
     "className"
   ]);
-  return /* @__PURE__ */ React.createElement("input", __spreadValues({
-    className: appendClassNames(className, "humany-checkbox"),
-    onKeyDown: (e) => {
-      if (e.key === "Enter") {
-        onEnter(e);
-      }
+  return /* @__PURE__ */ r.createElement("input", p({
+    className: w(n, "humany-checkbox"),
+    onKeyDown: (a) => {
+      a.key === "Enter" && t(a);
     },
-    onChange: (e) => onChange(e.target.value, e.currentTarget.checked)
-  }, convertToStringAttributes(other)));
-};
-const ContainerContext = createContext(new Container());
-const ColumnContext = createContext(1);
-const ComponentNodeContext = createContext({
+    onChange: (a) => e(a.target.value, a.currentTarget.checked)
+  }, R(s)));
+}, ct = Z(new Pe()), lt = Z(1), $e = Z({
   id: "",
   type: "",
   name: "",
   branch: ""
-});
-const ComponentPropertyContext = createContext({});
-const RoutingContext = createContext(null);
-const useComponentDescriptor = () => useContext$1(ComponentNodeContext);
-const useContainer = () => useContext$1(ContainerContext);
-const useAction = (passedOrigin, passedContainer) => {
-  const origin = useComponentDescriptor().id;
-  const container = useContainer();
-  return (action, value) => {
-    (passedContainer || container).getAsync("actionResolver").then((resolver) => {
-      resolver.action(passedOrigin || origin, action, value);
+}), 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);
     });
   };
-};
-const useComponentNode = (id) => {
-  const descriptor = useContext$1(ComponentNodeContext);
-  const components = useComponentPlatform();
-  const [node, setNode] = useState();
-  useEffect(() => {
-    if ((id || descriptor.id) && components) {
-      const node2 = components.nodes.get(id || descriptor.id);
-      setNode(node2);
-    }
-  }, [id, descriptor.id, components]);
-  return node;
-};
-const useIsMounted = () => {
-  const isMounted = useRef(false);
-  useEffect(() => {
-    isMounted.current = true;
-    return () => {
-      isMounted.current = false;
-    };
-  }, []);
-  return isMounted;
-};
-const useComponentPlatform = (passedContainer) => {
-  const container = useContainer();
-  const [componentPlatform, setComponentPlatform] = useState(null);
-  const isMounted = useIsMounted();
-  useEffect(() => {
-    ComponentPlatform.getInstance(passedContainer || container).then((platform) => {
-      if (isMounted.current) {
-        setComponentPlatform(platform);
-      }
+}, ce = (e) => {
+  const t = O($e), n = I(), [s, o] = L();
+  return C(() => {
+    if ((e || t.id) && n) {
+      const i = n.nodes.get(e || t.id);
+      o(i);
+    }
+  }, [e, t.id, n]), s;
+}, B = () => {
+  const e = S(!1);
+  return C(() => (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);
     });
-  }, [isMounted]);
-  return componentPlatform;
-};
-const useChildren = () => {
-  const node = useComponentNode();
-  const components = useComponentPlatform();
-  const [children, setChildren] = useState([]);
-  const isMounted = useIsMounted();
-  const updateChildren = useCallback((node2) => {
-    if (components && isMounted.current) {
-      const branch = components.getBranch(node2);
-      const children2 = node2.getChildren(branch).map((child) => asDescriptor(child));
-      setChildren(children2);
-    }
-  }, [isMounted, components, setChildren]);
-  useEffect(() => {
-    if (node) {
-      updateChildren(node);
-    }
-  }, [node, components]);
-  useEffect(() => {
-    if (components) {
-      const [subscribe, unsubscribe] = createEventSubscriber(components.events);
-      subscribe("components:set-layout", (event, data) => {
-        if (node === data.node.parent || data.node.parent === components.nodes.root) {
-          updateChildren(data.node.parent);
-        }
-      });
-      subscribe("components:node-appended", (event, data) => {
-        if (node === data.node.parent || data.node.parent === components.nodes.root) {
-          updateChildren(data.node.parent);
-        }
-      });
-      subscribe("components:node-removed", (event, { parentNode }) => {
-        if (parentNode === node || parentNode === components.nodes.root) {
-          updateChildren(parentNode);
-        }
-      });
-      return () => {
-        unsubscribe();
+  }, [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(() => {
+    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);
+      }), () => {
+        m();
       };
     }
-  }, [node, components, updateChildren]);
-  return children;
-};
-const useColumns = () => useContext$1(ColumnContext);
-const useComponent = (passedType, passedContainer) => {
-  const descriptor = useComponentDescriptor();
-  const container = useContainer();
-  const [component, setComponent] = useState(void 0);
-  const isMounted = useIsMounted();
-  const type = passedType || descriptor.type || "";
-  useEffect(() => {
-    if (type) {
-      let unsubscribe;
-      (passedContainer || container).getAsync("componentResolver").then((resolver) => {
-        if (isMounted.current) {
-          const component2 = resolver.getComponent(type);
-          setComponent(component2);
+  }, [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) => {
+        if (a.current) {
+          const u = c.getComponent(m);
+          i(u);
         }
-        unsubscribe = resolver.registerResolver(type, (component2) => {
-          if (isMounted.current) {
-            setComponent(component2);
-          }
+        l = c.registerResolver(m, (u) => {
+          a.current && i(u);
         });
-      });
-      return () => {
-        if (unsubscribe) {
-          unsubscribe();
-        }
+      }), () => {
+        l && l();
       };
     }
-  }, [isMounted, type, passedContainer, container]);
-  return component;
-};
-const useContext = (id) => {
-  const node = useComponentNode(id);
-  const components = useComponentPlatform();
-  const [context, setContext] = useState({});
-  const isMounted = useIsMounted();
-  useEffect(() => {
-    if (node && isMounted.current) {
-      setContext(node.attributes.context);
-    }
-  }, [isMounted, node]);
-  useEffect(() => {
-    if (components) {
-      const unsubscribe = components.events.subscribe("components:context-changed", (event, data) => {
-        if (node === data.node && isMounted.current) {
-          setContext(data.node.attributes.context);
-        }
+  }, [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(() => {
+    if (n) {
+      const a = n.events.subscribe("components:context-changed", (m, l) => {
+        t === l.node && i.current && o(l.node.attributes.context);
       });
       return () => {
-        unsubscribe();
+        a();
       };
     }
-  }, [isMounted, components]);
-  return context;
-};
-const useDispatch = () => {
-  const components = useComponentPlatform();
-  const descriptor = useComponentDescriptor();
-  const [queue, setQueue] = useState([]);
-  const [actions, setActions] = useState();
-  useEffect(() => {
-    if (components && descriptor) {
-      const component = new ComponentQuery(components).withId(descriptor.id);
-      const actions2 = components.actions(component, descriptor.type || uuid());
-      setActions(actions2);
-      if (queue !== null) {
-        queue.forEach((item) => {
-          actions2.dispatch(item.key, item.data).then((value) => item.resolve(value)).catch((reason) => item.reject(reason));
-        });
-        setQueue(null);
-      }
-    }
-  }, [components, descriptor.id]);
-  return (key, data) => {
-    if (queue !== null) {
-      return new Promise((resolve, reject) => {
-        queue.push({
-          key,
-          data,
-          resolve,
-          reject
-        });
-      });
-    }
-    return actions.dispatch(key, data);
-  };
-};
-var useEventListener = (eventName, handler, element = window, condition = () => true) => {
-  const savedHandler = useRef(() => {
+  }, [i, n]), s;
+}, $n = () => {
+  const e = I(), t = ae(), [n, s] = L([]), [o, i] = L();
+  return C(() => {
+    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));
+    }
+  }, [e, t.id]), (a, m) => n !== null ? new Promise((l, c) => {
+    n.push({
+      key: a,
+      data: m,
+      resolve: l,
+      reject: c
+    });
+  }) : o.dispatch(a, m);
+}, z = (e, t, n = window, s = () => !0) => {
+  const o = S(() => {
   });
-  useEffect(() => {
-    savedHandler.current = handler;
-  }, [handler]);
-  useEffect(() => {
-    const isSupported = element && condition();
-    if (!isSupported)
+  C(() => {
+    o.current = t;
+  }, [t]), C(() => {
+    if (!(n && s()))
       return;
-    const eventListener = (event) => savedHandler.current(event);
-    element.addEventListener(eventName, eventListener);
-    return () => {
-      element.removeEventListener(eventName, eventListener);
+    const a = (m) => o.current(m);
+    return n.addEventListener(e, a), () => {
+      n.removeEventListener(e, a);
     };
-  }, [eventName, element]);
-};
-const useEvents = (passedContainer) => {
-  const container = useContainer();
-  const { events } = (passedContainer || container).get("$widget");
-  return events;
-};
-const useKeyPress = (targetKey, action) => {
-  const [keyPressed, setKeyPressed] = useState(false);
-  const onKeyDown = useCallback((event) => {
-    const { key } = event;
-    if (key === targetKey) {
-      setKeyPressed(true);
-      if (action) {
-        action(event);
-      }
-    }
-  }, [setKeyPressed, action]);
-  const onKeyUp = useCallback(({ key }) => {
-    if (key === targetKey) {
-      setKeyPressed(false);
-    }
-  }, [setKeyPressed]);
-  useEventListener("keydown", onKeyDown, window);
-  useEventListener("keyup", onKeyUp, window);
-  return keyPressed;
-};
-const useLayout = (id) => {
-  const node = useComponentNode(id);
-  const components = useComponentPlatform();
-  const [layout, setLayout] = useState({});
-  const isMounted = useIsMounted();
-  useEffect(() => {
-    if (node && isMounted.current) {
-      setLayout(node.attributes.layout);
-    }
-  }, [node, isMounted]);
-  useEffect(() => {
-    if (components) {
-      const unsubscribe = components.events.subscribe("components:layout-changed", (event, data) => {
-        if (node === data.node && isMounted.current) {
-          setLayout(data.node.attributes.layout);
-        }
+  }, [e, n]);
+}, ft = (e) => {
+  const t = T(), { 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(() => {
+    if (n) {
+      const a = n.events.subscribe("components:layout-changed", (m, l) => {
+        t === l.node && i.current && o(l.node.attributes.layout);
       });
       return () => {
-        unsubscribe();
+        a();
       };
     }
-  }, [components, isMounted]);
-  return layout;
-};
-const usePrevious = (value) => {
-  const ref = useRef();
-  useEffect(() => {
-    ref.current = value;
-  });
-  return ref.current;
-};
-const useProperties = () => {
-  const properties = useContext$1(ComponentPropertyContext);
-  return properties;
-};
-const useRenderState = (passedContainer) => {
-  const [renderState, setRenderState] = useState();
-  const container = useContainer();
-  const isMounted = useIsMounted();
-  useEffect(() => {
-    let unsubscribe;
-    const widget = (passedContainer || container).get("$widget");
-    if (!widget) {
+  }, [n, i]), s;
+}, ke = (e) => {
+  const t = S();
+  return C(() => {
+    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");
+    if (!a)
       return;
-    }
-    const { name, invoke } = widget;
-    invoke("renderState").then((renderState2) => {
-      if (isMounted.current) {
-        setRenderState(renderState2);
-      }
-    });
-    (passedContainer || container).getAsync("actionResolver").then((actionResolver) => {
-      unsubscribe = actionResolver.subscribe(name, (origin, action) => {
-        switch (action) {
+    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) {
           case "close":
           case "open":
-            if (isMounted.current) {
-              setRenderState(action === "open" ? WidgetRenderState.open : WidgetRenderState.closed);
-            }
+            o.current && n(f === "open" ? j.open : j.closed);
             break;
           case "hide":
-            if (isMounted.current) {
-              setRenderState(WidgetRenderState.hidden);
-            }
+            o.current && n(j.hidden);
         }
       });
-    });
-    return () => {
-      if (unsubscribe) {
-        unsubscribe();
-      }
+    }), () => {
+      i && i();
     };
-  }, [isMounted]);
-  return renderState;
-};
-const useRouter = () => {
-  const router = useContext$1(RoutingContext);
-  return router;
-};
-const useRouteData = (passedContainer) => {
-  const container = useContainer();
-  const router = useRouter();
-  const [routeData, setRouteData] = useState({ name: "", params: {} });
-  const isMounted = useIsMounted();
-  useEffect(() => {
-    const widget = (passedContainer || container).get("$widget");
-    if (!widget) {
+  }, [o]), t;
+}, Le = () => O(mt), Sn = (e) => {
+  const t = T(), n = Le(), [s, o] = L({ name: "", params: {} }), i = B();
+  return C(() => {
+    const a = (e || t).get("$widget");
+    if (!a)
       return;
-    }
-    const { events } = widget;
-    const unsubscribe = events.subscribe("router:change", (e, { next: { routeData: routeData2 } }) => {
-      if (isMounted.current) {
-        const { name, params } = routeData2;
-        removeNullAndUndefinedValues(params);
-        setRouteData({ name, params });
+    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 });
       }
     });
-    return unsubscribe;
-  }, [isMounted, passedContainer, container]);
-  useEffect(() => {
-    if (router && router.history && isMounted.current) {
-      const routeData2 = router.getRouteData();
-      const { name, params } = routeData2;
-      removeNullAndUndefinedValues(params);
-      setRouteData({ name, params });
-    }
-  }, [router, isMounted]);
-  return routeData;
-};
-var useScroll = (scrollable) => {
-  const elem = useRef();
-  const previousY = useRef(0);
-  let timeoutId;
-  const onScroll = useCallback(() => {
-    var _a;
-    (_a = elem.current) == null ? void 0 : _a.classList.add("humany-scrolling");
-    clearTimeout(timeoutId);
-    timeoutId = setTimeout(() => {
-      var _a2;
-      (_a2 = elem.current) == null ? void 0 : _a2.classList.remove("humany-scrolling");
+  }, [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(() => {
+    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");
     }, 500);
-  }, [elem]);
-  const onTouchStart = useCallback((event) => {
-    previousY.current = event.touches[0].clientY;
-  }, [elem]);
-  const traverseScrollable = (element) => {
-    if (isScrollable(element)) {
-      if (element === elem.current) {
-        return element;
-      }
-      return null;
-    }
-    if (element.parentElement) {
-      return traverseScrollable(element.parentElement);
-    }
-    return null;
-  };
-  const isScrollable = (element) => {
-    return element.scrollWidth > element.clientWidth || element.scrollHeight > element.clientHeight;
-  };
-  const onTouchMove = useCallback((event) => {
-    if (!event.cancelable) {
+  }, [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 top = event.touches[0].clientY;
-    const firstScrollable = traverseScrollable(event.target);
-    if (!firstScrollable) {
+    const u = c.touches[0].clientY, f = a(c.target);
+    if (!f)
       return;
-    }
-    const scrollTop = firstScrollable.scrollTop;
-    const direction = previousY.current - top < 0 ? "up" : "down";
-    const isAtTop = scrollTop <= 0 && direction === "up";
-    const isAtBottom = scrollTop >= firstScrollable.scrollHeight - firstScrollable.offsetHeight && direction === "down";
-    if (isAtTop || isAtBottom) {
-      event.preventDefault();
-    }
-    previousY.current = top;
-  }, [elem, previousY]);
-  useEventListener("scroll", onScroll, elem.current, () => elem.current && scrollable);
-  useEventListener("touchstart", onTouchStart, elem.current, () => elem.current && scrollable);
-  useEventListener("touchmove", onTouchMove, elem.current, () => elem.current && scrollable);
-  if (!scrollable) {
-    return ["", elem];
-  }
-  return [styling, elem];
-};
-const styling = `
-    overflow-y: ${browser() === Browsers.Chrome || browser() === Browsers.EdgeChromium ? "overlay" : "auto"};
+    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"};
     overflow-x: hidden;
     -ms-overflow-style: none; /* IE 10+ */
     scrollbar-width: thin; /* Firefox */
@@ -806,126 +492,94 @@ const styling = `
             background-color: #7F7F7F;
         }
     }
-`;
-const useSettings = () => {
-  const [settings, setSettings] = useState(null);
-  const container = useContainer();
-  const isMounted = useIsMounted();
-  useEffect(() => {
-    container.get("settings").then((settings2) => {
-      if (isMounted.current) {
-        setSettings(settings2);
-      }
+`, Hn = () => {
+  const [e, t] = L(null), n = T(), s = B();
+  return C(() => {
+    n.get("settings").then((o) => {
+      s.current && t(o);
     });
-  }, [isMounted]);
-  return settings;
-};
-const useToggle = (initialValue = false) => {
-  const [value, setValue] = useState(initialValue);
-  const toggle = useCallback((forced) => {
-    setValue(typeof forced === "boolean" ? forced : (v) => !v);
+  }, [s]), e;
+}, le = (e = !1) => {
+  const [t, n] = L(e), s = H((o) => {
+    n(typeof o == "boolean" ? o : (i) => !i);
   }, []);
-  return [value, toggle];
-};
-var useTransitionEnd = (handler) => {
-  const container = useContainer();
-  const components = useComponentPlatform();
-  const widgetDOMElement = container.get("widgetDOMElement");
-  const [viewDOMElement, setViewDOMElement] = useState(null);
-  const [rootDOMElement, setRootDOMElement] = useState(null);
-  const isMounted = useIsMounted();
-  useEffect(() => {
-    if (components && isMounted.current) {
-      const rootArea = components.nodes.all.find((n) => n.name === "root-area");
-      const view = components.nodes.all.find((n) => n.type === "view");
-      if (!(view == null ? void 0 : view.attributes.properties.animation) && !(rootArea == null ? void 0 : rootArea.attributes.properties.animation)) {
-        handler();
-      } else {
-        const getElement = (id = "") => widgetDOMElement == null ? void 0 : widgetDOMElement.querySelector(`[data-node-id="${id}"]`);
-        const viewDOMElement2 = getElement(view == null ? void 0 : view.id);
-        if (viewDOMElement2) {
-          setViewDOMElement(viewDOMElement2);
-        }
-        const rootDOMElement2 = getElement(rootArea == null ? void 0 : rootArea.id);
-        if (rootDOMElement2) {
-          setRootDOMElement(rootDOMElement2);
-        }
+  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))
+        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);
       }
     }
-  }, [components, container, isMounted]);
-  const eventListener = useCallback((event) => {
-    if (isMounted.current && (event.target === viewDOMElement || event.target === rootDOMElement)) {
-      handler();
-    }
-  }, [handler, isMounted, viewDOMElement, rootDOMElement]);
-  useEventListener("transitionend", eventListener, viewDOMElement);
-  useEventListener("transitionend", eventListener, rootDOMElement);
-};
-const useWidgetEvent = (event, callback, dependencies = [], passedContainer) => {
-  const events = useEvents(passedContainer);
-  useEffect(() => {
-    if (events) {
-      const unsubscribe = events.subscribe(event, callback);
+  }, [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);
       return () => {
-        unsubscribe();
+        i();
       };
     }
-  }, [events].concat(dependencies));
-  return (data) => events == null ? void 0 : events.dispatch(event, data);
-};
-const useUniqueMenu = (id, callback) => {
-  const dispatch = useWidgetEvent("widget:menu-toggled", (_, triggeredId) => {
-    if (triggeredId !== id) {
-      callback();
-    }
+  }, [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();
   });
-  return () => dispatch(id);
-};
-const Text = (_e) => {
-  var _f = _e, { className, children } = _f, other = __objRest(_f, ["className", "children"]);
-  return /* @__PURE__ */ React.createElement("span", __spreadValues({
-    className: appendClassNames(className, "humany-text")
-  }, convertToStringAttributes(other)), children);
-};
-const contentBox = css`
+  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`
     display: flex;
     justify-content: center;
     flex-direction: column;
     background: #ffffff;
-    border-radius: ${(p) => p.theme.borderRadius};
-    border: ${(p) => p.theme.border};
-    box-shadow: ${(p) => p.theme.boxShadow || "none"};
-    ${(p) => p["data-loading"] && "min-height: 150px;"}
-`;
-const buttonCss = css`
+    border-radius: ${(e) => e.theme.borderRadius};
+    border: ${(e) => e.theme.border};
+    box-shadow: ${(e) => e.theme.boxShadow || "none"};
+    ${(e) => e["data-loading"] && "min-height: 150px;"}
+`, pt = M`
     cursor: pointer;
     text-align: center;
     border: none;
-    padding: ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
+    padding: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.normal;
 }};
-    border-radius: ${(p) => p.theme.borderRadius};
-    font-family: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.type;
+    border-radius: ${(e) => e.theme.borderRadius};
+    font-family: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.type;
 }};
-    font-size: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.normal;
+    font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.normal;
 }};
     font-weight: 300;
-`;
-const invertedHoverButton = ({
-  primaryColor,
-  secondaryColor,
-  active
-}) => css`
-    ${buttonCss}
-    border: 1px solid ${active ? secondaryColor : primaryColor};
-    background-color: ${active ? primaryColor : secondaryColor};
+`, Dn = ({
+  primaryColor: e,
+  secondaryColor: t,
+  active: n
+}) => M`
+    ${pt}
+    border: 1px solid ${n ? t : e};
+    background-color: ${n ? e : t};
 
-    color: ${active ? secondaryColor : primaryColor};
+    color: ${n ? t : e};
     transition: background-color 200ms ease-out, color 200ms ease-out;
 
     span,
@@ -933,110 +587,104 @@ const invertedHoverButton = ({
     p,
     a {
         transition: color 200ms ease-out;
-        color: ${active ? secondaryColor : primaryColor};
-        font-size: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.normal;
+        color: ${n ? t : e};
+        font-size: ${(s) => {
+  var o;
+  return (o = s.theme.fonts) == null ? void 0 : o.normal;
 }};
     }
 
-    ${(p) => !p.disabled && css`
+    ${(s) => !s.disabled && M`
             &:hover {
-                background-color: ${primaryColor};
-                color: ${secondaryColor};
+                background-color: ${e};
+                color: ${t};
 
                 span,
                 i,
                 p,
                 a {
-                    color: ${secondaryColor};
+                    color: ${t};
                 }
             }
 
             &:focus {
-                ${(p2) => {
-  var _a;
-  return ((_a = p2.theme.accessibility) == null ? void 0 : _a.isTabbing) && borderTabStyle;
+                ${(o) => {
+  var i;
+  return ((i = o.theme.accessibility) == null ? void 0 : i.isTabbing) && P;
 }};
             }
         `}
-`;
-const borderTabStyle = css`
-    outline: ${(p) => {
-  var _a;
-  return (_a = p.theme.accessibility) == null ? void 0 : _a.border;
+`, P = M`
+    outline: ${(e) => {
+  var t;
+  return (t = e.theme.accessibility) == null ? void 0 : t.border;
 }};
-    color: ${(p) => {
-  var _a, _b;
-  return (_b = (_a = p.theme.accessibility) == null ? void 0 : _a.colors) == null ? void 0 : _b.inactiveText;
+    color: ${(e) => {
+  var t, n;
+  return (n = (t = e.theme.accessibility) == null ? void 0 : t.colors) == null ? void 0 : n.inactiveText;
 }};
     border-color: transparent;
-`;
-const linkTabStyle = css`
-    ${borderTabStyle}
+`, Tn = M`
+    ${P}
     text-decoration: underline;
-`;
-const paddedBorderTabStyle = css`
-    ${borderTabStyle}
-    outline-offset: ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.small;
+`, Nn = M`
+    ${P}
+    outline-offset: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.small;
 }};
-`;
-const CloseButton$1 = styled(Button)`
+`, de = v(U)`
     position: absolute;
-    top: ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
+    top: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.normal;
 }};
-    right: ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
+    right: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.normal;
 }};
     z-index: 1;
 
     svg {
-        stroke: ${(p) => {
-  var _a;
-  return (_a = p.theme.colors) == null ? void 0 : _a.text;
+        stroke: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
 }};
     }
 
     &:focus {
-        ${(p) => {
-  var _a;
-  return ((_a = p.theme.accessibility) == null ? void 0 : _a.isTabbing) && css`
-                ${borderTabStyle}
-                padding: ${(p2) => {
-    var _a2;
-    return (_a2 = p2.theme.sizes) == null ? void 0 : _a2.small;
+        ${(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;
             `;
 }};
     }
-`;
-const StyledText = styled(Text)`
-    font-size: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.normal;
+`, xe = v(me)`
+    font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.normal;
 }};
     font-weight: normal;
     line-height: 1.2em;
-    color: ${(p) => {
-  var _a;
-  return (_a = p.theme.colors) == null ? void 0 : _a.text;
+    color: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
 }};
-`;
-const list = css`
+`, gt = M`
     padding: 0;
     margin: 0;
     list-style: none;
     > li {
-        margin: 0 0 ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
+        margin: 0 0 ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.normal;
 }};
         white-space: nowrap;
         text-overflow: ellipsis;
@@ -1051,38 +699,37 @@ const list = css`
     > li:last-child {
         margin: 0;
     }
-`;
-const itemList = css`
+`, zn = M`
     > div {
-        ${headingElement("> h1", css`
-                margin: 0 0 ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
+        ${X("> h1", M`
+                margin: 0 0 ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.normal;
 }};
-                font-size: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.medium;
+                font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.medium;
 }};
                 font-weight: normal;
                 line-height: 1.8em;
-                color: ${(p) => {
-  var _a;
-  return (_a = p.theme.colors) == null ? void 0 : _a.text;
+                color: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
 }};
             `)}
     }
     > ul {
-        ${list}
+        ${gt}
     }
 
-    ${headingElement("h1", css`
+    ${X("h1", M`
             display: flex;
             align-items: center;
 
             i {
-                margin: 7px ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
+                margin: 7px ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.normal;
 }} 0 0;
                 width: 24px;
                 display: inline-block;
@@ -1093,113 +740,26 @@ const itemList = css`
                 text-align: center;
             }
         `)}
-`;
-const genericHtml = css`
-    font-size: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.normal;
-}};
-    font-weight: 300;
-    line-height: 1.5em;
-    color: ${(p) => {
-  var _a;
-  return (_a = p.theme.colors) == null ? void 0 : _a.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: ${(p) => {
-  var _a;
-  return (_a = p.theme.colors) == null ? void 0 : _a.link;
-}};
-        &:focus {
-            ${(p) => {
-  var _a;
-  return ((_a = p.theme.accessibility) == null ? void 0 : _a.isTabbing) && linkTabStyle;
-}};
-        }
-    }
-
-    img {
-        max-width: 100% !important;
-        height: auto !important;
-    }
-
-    p {
-        word-break: break-word;
-        margin: ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
-}} 0;
-    }
-
-    p:first-child {
-        margin: 0 0 ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
-}};
-    }
-
-    p:last-child {
-        margin: ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
-}} 0 0;
-    }
-
-    p:only-child {
-        margin: 0;
-    }
-`;
-const Portal = ({
-  elementId = "humany-portal-elements",
-  parent = document.body,
-  children
-}) => {
-  const [container] = useState(() => {
-    const el = document.getElementById(elementId) || document.createElement("div");
-    el.id = elementId;
-    return el;
+`, 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;
   });
-  useEffect(() => {
-    parent.appendChild(container);
-    return () => {
-      if (container.childElementCount <= 1) {
-        parent.removeChild(container);
-      }
-    };
-  }, [container]);
-  return createPortal(children, container);
-};
-const SymbolBadge = (_g) => {
-  var _h = _g, {
-    text = "",
-    backgroundSize = "contain",
-    size = 12,
-    symbol = {
+  return C(() => (document.body.appendChild(n), () => {
+    n.childElementCount <= 1 && document.body.removeChild(n);
+  }), [n]), Xe(t, n);
+}, A = (m) => {
+  var l = m, {
+    text: e = "",
+    backgroundSize: t = "contain",
+    size: n = 12,
+    symbol: s = {
       content: "",
       type: ""
     },
-    elementStyle = {},
-    className
-  } = _h, other = __objRest(_h, [
+    elementStyle: o = {},
+    className: i
+  } = l, a = $(l, [
     "text",
     "backgroundSize",
     "size",
@@ -1207,280 +767,263 @@ const SymbolBadge = (_g) => {
     "elementStyle",
     "className"
   ]);
-  const { type, content } = symbol;
-  const sharedProps = {
-    "aria-label": text,
+  const { type: c, content: u } = s, f = {
+    "aria-label": e,
     role: "presentation"
   };
-  switch (type) {
+  switch (c) {
     case "Uri": {
-      const style = {
-        backgroundSize,
-        backgroundImage: `url('${content}')`,
+      const d = {
+        backgroundSize: t,
+        backgroundImage: `url('${u}')`,
         backgroundRepeat: "no-repeat",
         backgroundPosition: "center",
         backgroundAttachment: "center"
       };
-      return /* @__PURE__ */ React.createElement("i", __spreadValues(__spreadValues({
-        className: appendClassNames(className, "humany-icon", "humany-custom-icon"),
-        title: text,
-        style: __spreadValues(__spreadValues({}, style), elementStyle)
-      }, sharedProps), other));
+      return /* @__PURE__ */ r.createElement("i", p(p({
+        className: w(i, "humany-icon", "humany-custom-icon"),
+        title: e,
+        style: p(p({}, d), o)
+      }, f), a));
     }
     case "Svg": {
-      const svgProps = __spreadProps(__spreadValues({
-        className: appendClassNames(className, "humany-icon"),
-        width: `${size}`,
+      const d = k(p({
+        className: w(i, "humany-icon"),
+        width: `${n}`,
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
-      }, other), {
+      }, a), {
         ref: null
-      });
-      const style = { minWidth: `${size}` };
-      switch (content) {
-        case "search": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+      }), h = { minWidth: `${n}` };
+      switch (u) {
+        case "search":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 32 30"
-          }, svgProps), /* @__PURE__ */ React.createElement("circle", {
+          }, d), /* @__PURE__ */ r.createElement("circle", {
             cx: "14.8457",
             cy: "14.5175",
             r: "8.14359",
             transform: "rotate(45 14.8457 14.5175)"
-          }), /* @__PURE__ */ React.createElement("line", {
+          }), /* @__PURE__ */ r.createElement("line", {
             x1: "21.1001",
             y1: "20.4865",
             x2: "26.5798",
             y2: "25.9661"
           }));
-        }
-        case "clear": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "clear":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 27 27"
-          }, svgProps), /* @__PURE__ */ React.createElement("circle", {
+          }, d), /* @__PURE__ */ r.createElement("circle", {
             cx: "13.4351",
             cy: "13.435",
             r: "9",
             transform: "rotate(45 13.4351 13.435)",
             stroke: "black"
-          }), /* @__PURE__ */ React.createElement("line", {
+          }), /* @__PURE__ */ r.createElement("line", {
             x1: "16.6172",
             y1: "10.2531",
             x2: "10.2533",
             y2: "16.6171",
             stroke: "black"
-          }), /* @__PURE__ */ React.createElement("line", {
+          }), /* @__PURE__ */ r.createElement("line", {
             x1: "16.6171",
             y1: "16.617",
             x2: "10.2532",
             y2: "10.2531",
             stroke: "black"
           }));
-        }
-        case "close": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "close":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 13 13"
-          }, svgProps), /* @__PURE__ */ React.createElement("path", {
+          }, d), /* @__PURE__ */ r.createElement("path", {
             d: "M12.3068 0.50647L1.27246 11.7273",
             stroke: "black"
-          }), /* @__PURE__ */ React.createElement("path", {
+          }), /* @__PURE__ */ r.createElement("path", {
             d: "M12.2812 11.9473L1.24686 0.726451",
             stroke: "black"
           }));
-        }
-        case "caret-right": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "caret-right":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 14 14",
-            style
-          }, svgProps), /* @__PURE__ */ React.createElement("line", {
+            style: h
+          }, d), /* @__PURE__ */ r.createElement("line", {
             x1: "4.13",
             y1: "1.05",
             x2: "10.13",
             y2: "7.05",
             stroke: "black"
-          }), /* @__PURE__ */ React.createElement("line", {
+          }), /* @__PURE__ */ r.createElement("line", {
             x1: "10.13",
             y1: "6.95",
             x2: "4.13",
             y2: "12.95",
             stroke: "black"
           }));
-        }
-        case "caret-left": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "caret-left":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 14 14",
-            style
-          }, svgProps), /* @__PURE__ */ React.createElement("line", {
+            style: h
+          }, d), /* @__PURE__ */ r.createElement("line", {
             x1: "10.13",
             y1: "12.95",
             x2: "4.13",
             y2: "6.95",
             stroke: "black"
-          }), /* @__PURE__ */ React.createElement("line", {
+          }), /* @__PURE__ */ r.createElement("line", {
             x1: "4.13",
             y1: "7.05",
             x2: "10.13",
             y2: "1.05",
             stroke: "black"
           }));
-        }
-        case "caret-up": {
-          return /* @__PURE__ */ React.createElement(CaretUp, __spreadValues({
+        case "caret-up":
+          return /* @__PURE__ */ r.createElement(yt, p({
             viewBox: "0 0 14 14",
-            style
-          }, svgProps), /* @__PURE__ */ React.createElement("line", {
+            style: h
+          }, d), /* @__PURE__ */ r.createElement("line", {
             x1: "13.09",
             y1: "3.99",
             x2: "7.1",
             y2: "9.99",
             stroke: "black"
-          }), /* @__PURE__ */ React.createElement("line", {
+          }), /* @__PURE__ */ r.createElement("line", {
             x1: "7.19",
             y1: "9.99",
             x2: "1.19",
             y2: "3.99",
             stroke: "black"
           }));
-        }
-        case "caret-down": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "caret-down":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 14 14",
-            style
-          }, svgProps), /* @__PURE__ */ React.createElement("line", {
+            style: h
+          }, d), /* @__PURE__ */ r.createElement("line", {
             x1: "13.09",
             y1: "3.99",
             x2: "7.1",
             y2: "9.99",
             stroke: "black"
-          }), /* @__PURE__ */ React.createElement("line", {
+          }), /* @__PURE__ */ r.createElement("line", {
             x1: "7.19",
             y1: "9.99",
             x2: "1.19",
             y2: "3.99",
             stroke: "black"
           }));
-        }
-        case "back": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "back":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 18 18"
-          }, svgProps), /* @__PURE__ */ React.createElement("line", {
+          }, d), /* @__PURE__ */ r.createElement("line", {
             y1: "-0.5",
             x2: "11.724",
             y2: "-0.5",
             transform: "matrix(-0.682355 -0.731021 0.682355 -0.731021 13 16.9999)",
             stroke: "white"
-          }), /* @__PURE__ */ React.createElement("line", {
+          }), /* @__PURE__ */ r.createElement("line", {
             y1: "-0.5",
             x2: "11.724",
             y2: "-0.5",
             transform: "matrix(0.682355 -0.731021 0.682355 0.731021 5 9.5705)",
             stroke: "white"
           }));
-        }
-        case "alert": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "alert":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 19 19"
-          }, svgProps), /* @__PURE__ */ React.createElement("circle", {
+          }, d), /* @__PURE__ */ r.createElement("circle", {
             cx: "9.5",
             cy: "9.5",
             r: "9.5",
             fill: "#CA0813"
-          }), /* @__PURE__ */ React.createElement("path", {
+          }), /* @__PURE__ */ r.createElement("path", {
             d: "M10.36 4.878V8.882C10.36 9.30667 10.339 9.72433 10.297 10.135C10.255 10.541 10.199 10.9727 10.129 11.43H8.96C8.89 10.9727 8.834 10.541 8.792 10.135C8.75 9.72433 8.729 9.30667 8.729 8.882V4.878H10.36ZM8.463 14.048C8.463 13.9033 8.48867 13.7657 8.54 13.635C8.596 13.5043 8.67067 13.3923 8.764 13.299C8.862 13.2057 8.97633 13.131 9.107 13.075C9.23767 13.019 9.37767 12.991 9.527 12.991C9.67167 12.991 9.80933 13.019 9.94 13.075C10.0707 13.131 10.1827 13.2057 10.276 13.299C10.3693 13.3923 10.444 13.5043 10.5 13.635C10.556 13.7657 10.584 13.9033 10.584 14.048C10.584 14.1973 10.556 14.3373 10.5 14.468C10.444 14.594 10.3693 14.7037 10.276 14.797C10.1827 14.8903 10.0707 14.9627 9.94 15.014C9.80933 15.07 9.67167 15.098 9.527 15.098C9.37767 15.098 9.23767 15.07 9.107 15.014C8.97633 14.9627 8.862 14.8903 8.764 14.797C8.67067 14.7037 8.596 14.594 8.54 14.468C8.48867 14.3373 8.463 14.1973 8.463 14.048Z",
             fill: "white"
           }));
-        }
-        case "send": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "send":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 20 17"
-          }, svgProps), /* @__PURE__ */ React.createElement("path", {
+          }, 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",
             fill: "#A6A6A6",
             stroke: "#A6A6A6",
             strokeWidth: "0.1"
           }));
-        }
-        case "chat": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "chat":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "-2 -3 40 40"
-          }, svgProps), /* @__PURE__ */ React.createElement("path", {
+          }, d), /* @__PURE__ */ r.createElement("path", {
             strokeWidth: "0",
             fillRule: "evenodd",
             clipRule: "evenodd",
             d: "M16.9799 34C21.2676 34 25.1841 32.4256 28.1725 29.8285L34.9534 32.1994C35.7991 32.4951 36.553 31.5778 36.0892 30.8173L32.2559 24.5317C33.3474 22.3103 33.9598 19.8153 33.9598 17.1786C33.9598 7.88838 26.3576 0.357178 16.9799 0.357178C7.60216 0.357178 0 7.88838 0 17.1786C0 26.4688 7.60216 34 16.9799 34ZM30.7031 24.565C31.9094 22.3701 32.5948 19.8536 32.5948 17.1786C32.5948 8.6352 25.6038 1.70942 16.9799 1.70942C8.35601 1.70942 1.36498 8.6352 1.36498 17.1786C1.36498 25.722 8.35601 32.6478 16.9799 32.6478C21.1946 32.6478 25.0193 30.9935 27.8285 28.3047L34.3975 30.5798L30.7031 24.565Z",
             fill: "currentColor"
-          }), /* @__PURE__ */ React.createElement("path", {
+          }), /* @__PURE__ */ r.createElement("path", {
             strokeWidth: "0",
             d: "M12.9395 17.1786C12.9395 18.6079 11.7809 19.7665 10.3516 19.7665C8.92237 19.7665 7.76373 18.6079 7.76373 17.1786C7.76373 15.7493 8.92237 14.5907 10.3516 14.5907C11.7809 14.5907 12.9395 15.7493 12.9395 17.1786Z",
             fill: "currentColor"
-          }), /* @__PURE__ */ React.createElement("path", {
+          }), /* @__PURE__ */ r.createElement("path", {
             strokeWidth: "0",
             d: "M19.4093 17.1786C19.4093 18.6079 18.2507 19.7665 16.8214 19.7665C15.3921 19.7665 14.2335 18.6079 14.2335 17.1786C14.2335 15.7493 15.3921 14.5907 16.8214 14.5907C18.2507 14.5907 19.4093 15.7493 19.4093 17.1786Z",
             fill: "currentColor"
-          }), /* @__PURE__ */ React.createElement("path", {
+          }), /* @__PURE__ */ r.createElement("path", {
             strokeWidth: "0",
             d: "M25.8791 17.1786C25.8791 18.6079 24.7204 19.7665 23.2912 19.7665C21.8619 19.7665 20.7033 18.6079 20.7033 17.1786C20.7033 15.7493 21.8619 14.5907 23.2912 14.5907C24.7204 14.5907 25.8791 15.7493 25.8791 17.1786Z",
             fill: "currentColor"
           }));
-        }
-        case "chat-new": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "chat-new":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 26 24"
-          }, svgProps), /* @__PURE__ */ React.createElement("path", {
+          }, 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",
             fill: "currentColor"
-          }), /* @__PURE__ */ React.createElement("path", {
+          }), /* @__PURE__ */ r.createElement("path", {
             d: "M25.6633 4C25.6633 6.20914 23.8724 8 21.6633 8C19.4541 8 17.6633 6.20914 17.6633 4C17.6633 1.79086 19.4541 0 21.6633 0C23.8724 0 25.6633 1.79086 25.6633 4Z",
             fill: "currentColor"
           }));
-        }
-        case "agent": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "agent":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 36 30"
-          }, svgProps), /* @__PURE__ */ React.createElement("path", {
+          }, 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",
             stroke: "white"
-          }), /* @__PURE__ */ React.createElement("path", {
+          }), /* @__PURE__ */ r.createElement("path", {
             d: "M34.65 15.5996C34.65 18.0849 32.6353 20.0996 30.15 20.0996L29.2683 20.0996L29.2683 10.8888L30.15 10.8888C32.6353 10.8888 34.65 12.9035 34.65 15.3888L34.65 15.5996Z",
             stroke: "white"
-          }), /* @__PURE__ */ React.createElement("path", {
+          }), /* @__PURE__ */ r.createElement("path", {
             d: "M29.2565 20.5974C29.2565 26.341 22.8747 26.9792 19.6838 26.9792",
             stroke: "white"
-          }), /* @__PURE__ */ React.createElement("circle", {
+          }), /* @__PURE__ */ r.createElement("circle", {
             cx: "17.4074",
             cy: "26.9795",
             r: "2.05271",
             stroke: "white"
-          }), /* @__PURE__ */ React.createElement("path", {
+          }), /* @__PURE__ */ r.createElement("path", {
             d: "M6.28467 12.9396C6.28467 11.195 6.28686 18.0452 6.28467 8.47234C6.28248 -1.10049 29.2591 -1.10047 29.259 8.47234C29.259 18.0452 29.2569 11.6631 29.259 12.9396",
             stroke: "white"
           }));
-        }
-        case "minimize": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "minimize":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 -10 22 22"
-          }, svgProps), /* @__PURE__ */ React.createElement("path", {
+          }, d), /* @__PURE__ */ r.createElement("path", {
             d: "M0 1H22",
             stroke: "white"
           }));
-        }
-        case "sorting": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "sorting":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 18 14"
-          }, svgProps), /* @__PURE__ */ React.createElement("path", {
+          }, d), /* @__PURE__ */ r.createElement("path", {
             d: "M18 1H0M8 13H0M13 7H0"
           }));
-        }
-        case "copy": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "copy":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 19 17"
-          }, svgProps), /* @__PURE__ */ React.createElement("rect", {
+          }, d), /* @__PURE__ */ r.createElement("rect", {
             x: "0.5",
             y: "0.5",
             width: "11.6667",
             height: "11.6014",
             rx: "1.5",
             fill: "white"
-          }), /* @__PURE__ */ React.createElement("rect", {
+          }), /* @__PURE__ */ r.createElement("rect", {
             x: "6.83301",
             y: "4.89868",
             width: "11.6667",
@@ -1488,249 +1031,127 @@ const SymbolBadge = (_g) => {
             rx: "1.5",
             fill: "white"
           }));
-        }
-        case "print": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "print":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 16 17"
-          }, svgProps), /* @__PURE__ */ React.createElement("path", {
+          }, 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",
             fill: "white",
             stroke: "black"
-          }), /* @__PURE__ */ React.createElement("path", {
+          }), /* @__PURE__ */ r.createElement("path", {
             d: "M0.5 4.84595C0.5 4.56981 0.723858 4.34595 1 4.34595H15C15.2761 4.34595 15.5 4.5698 15.5 4.84595V10.8399C15.5 11.116 15.2761 11.3399 15 11.3399H1C0.723858 11.3399 0.5 11.116 0.5 10.8399V4.84595Z",
             fill: "white",
             stroke: "black"
-          }), /* @__PURE__ */ React.createElement("path", {
+          }), /* @__PURE__ */ r.createElement("path", {
             d: "M4.31592 10.0061C4.31592 9.72996 4.53978 9.5061 4.81592 9.5061H11.1845C11.4606 9.5061 11.6845 9.72996 11.6845 10.0061V16.0001C11.6845 16.2762 11.4606 16.5001 11.1845 16.5001H4.81592C4.53978 16.5001 4.31592 16.2762 4.31592 16.0001V10.0061Z",
             fill: "white",
             stroke: "black"
-          }), /* @__PURE__ */ React.createElement("line", {
+          }), /* @__PURE__ */ r.createElement("line", {
             x1: "5.29004",
             y1: "10.8323",
             x2: "10.7101",
             y2: "10.8323",
             stroke: "black"
-          }), /* @__PURE__ */ React.createElement("line", {
+          }), /* @__PURE__ */ r.createElement("line", {
             x1: "5.29004",
             y1: "12.5242",
             x2: "10.7101",
             y2: "12.5242",
             stroke: "black"
-          }), /* @__PURE__ */ React.createElement("line", {
+          }), /* @__PURE__ */ r.createElement("line", {
             x1: "5.29004",
             y1: "14.2161",
             x2: "10.7101",
             y2: "14.2161",
             stroke: "black"
           }));
-        }
-        case "language": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "language":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 19 19"
-          }, svgProps), /* @__PURE__ */ React.createElement("path", {
+          }, 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__ */ React.createElement("svg", __spreadValues({
+        case "information":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 17 17"
-          }, svgProps), /* @__PURE__ */ React.createElement("path", {
+          }, 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",
             fill: "black"
-          }), /* @__PURE__ */ React.createElement("path", {
+          }), /* @__PURE__ */ r.createElement("path", {
             d: "M7.21887 6.67639C6.89117 6.71981 6.66072 7.02066 6.70414 7.34836C6.74756 7.67605 7.04841 7.9065 7.3761 7.86308L8.353 7.73364L7.17405 11.3945C7.11289 11.5844 7.15164 11.7825 7.26117 11.932C7.38068 12.1287 7.60875 12.2469 7.85155 12.2147L9.40669 12.0087C9.73436 11.9653 9.96479 11.6645 9.92137 11.3368C9.87795 11.0091 9.57713 10.7787 9.24947 10.8221L8.58762 10.9098L9.76774 7.24534C9.83038 7.05084 9.78821 6.84771 9.67254 6.69702C9.55085 6.50877 9.32791 6.39694 9.09093 6.42834L7.21887 6.67639Z",
             fill: "black"
-          }), /* @__PURE__ */ React.createElement("path", {
+          }), /* @__PURE__ */ r.createElement("path", {
             fillRule: "evenodd",
             clipRule: "evenodd",
             d: "M17 8.5C17 13.1944 13.1944 17 8.5 17C3.80558 17 0 13.1944 0 8.5C0 3.80558 3.80558 0 8.5 0C13.1944 0 17 3.80558 17 8.5ZM16 8.5C16 12.8454 12.8454 16 8.5 16C4.15461 16 1 12.8454 1 8.5C1 4.15461 4.15461 1 8.5 1C12.8454 1 16 4.15461 16 8.5Z",
             fill: "black"
           }));
-        }
-        case "options": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "options":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 16 2"
-          }, svgProps), /* @__PURE__ */ React.createElement("circle", {
+          }, d), /* @__PURE__ */ r.createElement("circle", {
             cx: "15",
             cy: "1",
             r: "1",
             transform: "rotate(90 15 1)",
             fill: "black"
-          }), /* @__PURE__ */ React.createElement("circle", {
+          }), /* @__PURE__ */ r.createElement("circle", {
             cx: "1",
             cy: "1",
             r: "1",
             transform: "rotate(90 1 1)",
             fill: "black"
-          }), /* @__PURE__ */ React.createElement("circle", {
+          }), /* @__PURE__ */ r.createElement("circle", {
             cx: "8",
             cy: "1",
             r: "1",
             transform: "rotate(90 8 1)",
             fill: "black"
           }));
-        }
-        case "browse": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
-            viewBox: "0 0 24 24"
-          }, svgProps), /* @__PURE__ */ React.createElement("circle", {
-            cx: "12",
-            cy: "12",
-            r: "12",
-            fill: "currentColor"
-          }), /* @__PURE__ */ React.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__ */ React.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__ */ React.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__ */ React.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": {
-          if (style.minWidth && typeof style.minWidth === "number") {
-            style.minWidth = `${style.minWidth}px`;
-          }
-          return /* @__PURE__ */ React.createElement("svg", __spreadProps(__spreadValues({
-            viewBox: "0 0 25 25"
-          }, svgProps), {
-            style
-          }), /* @__PURE__ */ React.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__ */ React.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__ */ React.createElement("svg", __spreadValues({
+        case "star-empty":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 13 12"
-          }, svgProps), /* @__PURE__ */ React.createElement("path", {
+          }, 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__ */ React.createElement("svg", __spreadValues({
+        case "star-filled":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 13 12"
-          }, svgProps), /* @__PURE__ */ React.createElement("path", {
+          }, 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",
             fill: "black",
             stroke: "black"
           }));
-        }
-        case "cog-wheel": {
-          return /* @__PURE__ */ React.createElement("svg", __spreadValues({
+        case "cog-wheel":
+          return /* @__PURE__ */ r.createElement("svg", p({
             viewBox: "0 0 24 24"
-          }, svgProps), /* @__PURE__ */ React.createElement("path", {
+          }, d), /* @__PURE__ */ r.createElement("path", {
             fillRule: "evenodd",
             clipRule: "evenodd",
             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__ */ React.createElement("svg", __spreadValues({
-            viewBox: "0 0 24 24"
-          }, svgProps), /* @__PURE__ */ React.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__ */ React.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__ */ React.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__ */ React.createElement("svg", __spreadValues({
-            viewBox: "0 0 24 24"
-          }, svgProps), /* @__PURE__ */ React.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__ */ React.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__ */ React.createElement("svg", __spreadValues({
-            viewBox: "0 0 24 24"
-          }, svgProps), /* @__PURE__ */ React.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__ */ React.createElement("svg", __spreadValues({
-            viewBox: "0 0 24 24"
-          }, svgProps), /* @__PURE__ */ React.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"
-          }));
-        }
       }
       return null;
     }
-    case "FontAwesome": {
-      return /* @__PURE__ */ React.createElement(Icon, __spreadValues({
-        className,
-        faIcon: content,
-        title: text
-      }, other));
-    }
+    case "FontAwesome":
+      return /* @__PURE__ */ r.createElement(Tt, p({
+        className: i,
+        faIcon: u,
+        title: e
+      }, a));
     default:
-    case "Text": {
-      return text ? /* @__PURE__ */ React.createElement("i", __spreadValues(__spreadValues({
-        className: appendClassNames(className, "humany-letter-symbol"),
-        title: text
-      }, sharedProps), other), text.substring(0, 2)) : null;
-    }
+    case "Text":
+      return e ? /* @__PURE__ */ r.createElement("i", p(p({
+        className: w(i, "humany-letter-symbol"),
+        title: e
+      }, f), a), e.substring(0, 2)) : null;
   }
-};
-const CaretUp = styled.svg`
+}, yt = v.svg`
     transform: rotate(180deg);
-`;
-const defaultVariantMapping = {
+`, bt = {
   h1: "h1",
   h2: "h2",
   h3: "h3",
@@ -1739,131 +1160,96 @@ const defaultVariantMapping = {
   h6: "h6",
   p: "p",
   span: "span"
-};
-const Typography = ({ variant, component, className, children }) => {
-  const { typographyVariantMapping = {} } = useContext();
-  const variantMapping = __spreadValues(__spreadValues({}, defaultVariantMapping), typographyVariantMapping);
-  const Component2 = component || variantMapping[variant] || "span";
-  return /* @__PURE__ */ React.createElement(Base, {
-    className,
-    as: Component2
-  }, children);
-};
-const Base = styled.span``;
-var AnimationType = /* @__PURE__ */ ((AnimationType2) => {
-  AnimationType2["SlideInLeft"] = "slide-in-left";
-  AnimationType2["SlideInRight"] = "slide-in-right";
-  AnimationType2["SlideInBottom"] = "slide-in-bottom";
-  AnimationType2["SlideInTop"] = "slide-in-top";
-  return AnimationType2;
-})(AnimationType || {});
-const defaultDuration = 300;
-const Drawer = ({
-  className,
-  children,
-  header,
-  onToggle,
-  trigger,
-  fullScreen = false,
-  closeButtonAriaLabel,
-  animation = {
+}, _ = ({ 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, {
+    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 = ({
+  className: e,
+  children: t,
+  header: n,
+  onToggle: s,
+  trigger: o,
+  fullScreen: i = !1,
+  closeButtonAriaLabel: a,
+  animation: m = {
     type: "slide-in-bottom"
   }
 }) => {
-  const { duration = defaultDuration } = animation;
-  const closeButtonRef = useRef();
-  const triggerRef = useRef();
-  const [css2, ref] = useScroll(true);
-  const [visible, toggleVisible] = useToggle();
-  const previousVisible = usePrevious(visible);
-  const id = useRef(uuid());
-  useEffect(() => {
-    if (onToggle) {
-      onToggle(visible);
-    }
-  }, [visible]);
-  const esc = useKeyPress("Escape");
-  useEffect(() => {
-    if (esc) {
-      toggleVisible(false);
-    }
-  }, [esc]);
-  useEventListener("click", (event) => {
-    const { target } = event;
-    if (!triggerRef.current || !ref.current || !target) {
-      return;
-    }
-    if (triggerRef.current !== target && ref.current !== target && !ref.current.contains(target) && !triggerRef.current.contains(target)) {
-      toggleVisible(false);
-    }
+  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 closeMenus = useUniqueMenu(id.current, () => {
-    toggleVisible(false);
+  const b = ue(x.current, () => {
+    g(!1);
   });
-  useWidgetEvent("router:changed", () => {
-    toggleVisible(false);
-  });
-  useEffect(() => {
-    if (visible && closeButtonRef.current) {
-      closeButtonRef.current.focus();
-    } else if (!visible && triggerRef.current && previousVisible) {
-      triggerRef.current.focus();
-    }
-  }, [visible, closeButtonRef.current, triggerRef.current]);
-  const WrapperWithAnimation = animations[animation.type];
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(CSSTransition, {
-    in: visible,
+  Q("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,
     className: "humany-drawer-transition",
     classNames: "humany-drawer-transition",
-    unmountOnExit: true,
-    timeout: duration
-  }, /* @__PURE__ */ React.createElement(Portal, null, /* @__PURE__ */ React.createElement(WrapperWithAnimation, {
-    duration,
-    fullScreen,
-    className: appendClassNames(className, "humany-drawer", `humany-drawer-${id.current}`),
+    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}`),
     clientHeight: document.body.clientHeight,
-    css: css2,
-    ref
-  }, /* @__PURE__ */ React.createElement(CloseButton$1, {
-    onClick: () => toggleVisible(false),
+    css: f,
+    ref: d
+  }, /* @__PURE__ */ r.createElement(de, {
+    onClick: () => g(!1),
     tabIndex: 0,
-    ref: closeButtonRef,
-    "aria-label": closeButtonAriaLabel
-  }, /* @__PURE__ */ React.createElement(SymbolBadge, {
+    ref: c,
+    "aria-label": a
+  }, /* @__PURE__ */ r.createElement(A, {
     symbol: { type: "Svg", content: "close" }
-  })), !!header && /* @__PURE__ */ React.createElement(Header$1, {
+  })), !!n && /* @__PURE__ */ r.createElement(vt, {
     variant: "h1",
     className: "humany-drawer-header"
-  }, header), children))), React.cloneElement(trigger, {
-    onClick: (event) => {
-      toggleVisible();
-      closeMenus();
+  }, n), t))), r.cloneElement(o, {
+    onClick: (K) => {
+      g(), b();
     },
-    ref: triggerRef,
-    "aria-label": trigger.props.title,
-    "aria-expanded": visible
+    ref: u,
+    "aria-label": o.props.title,
+    "aria-expanded": h
   }));
-};
-const Wrapper$7 = styled.div`
-    font-family: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.type;
+}, J = v.div`
+    font-family: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.type;
 }};
-    font-size: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.normal;
+    font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.normal;
 }};
     position: fixed;
     bottom: 0;
     left: 0;
-    border: ${(p) => p.theme.border};
+    border: ${(e) => e.theme.border};
     width: 100%;
-    box-shadow: ${(p) => p.theme.boxShadow};
+    box-shadow: ${(e) => e.theme.boxShadow};
     background: #ffffff;
-    ${(p) => p.css && p.css}
-`;
-const Header$1 = styled(Typography)`
-    padding: ${(p) => p.theme.sizes.normal};
+    ${(e) => e.css && e.css}
+`, vt = v(_)`
+    padding: ${(e) => e.theme.sizes.normal};
     margin: 0;
     text-align: center;
     border-bottom: #eeeeee 1px solid;
@@ -1873,22 +1259,20 @@ const Header$1 = styled(Typography)`
     justify-content: center;
     align-items: center;
     font-weight: bold;
-    color: ${(p) => {
-  var _a;
-  return (_a = p.theme.colors) == null ? void 0 : _a.text;
+    color: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
 }};
-    font-size: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.normal;
+    font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.normal;
 }};
     line-height: 1.2em;
-`;
-const AnimationBase = css`
-    transition: ${(p) => p.duration}ms;
-`;
-const WrapperWithSlideInBottom = styled(Wrapper$7)`
+`, ee = M`
+    transition: ${(e) => e.duration}ms;
+`, wt = v(J)`
     max-height: 0;
-    ${AnimationBase}
+    ${ee}
 
     &.humany-drawer-transition-enter {
         max-height: 0;
@@ -1896,18 +1280,17 @@ const WrapperWithSlideInBottom = styled(Wrapper$7)`
     &.humany-drawer-transition-enter-active,
     &.humany-drawer-transition-enter-done,
     &.humany-drawer-transition-exit {
-        max-height: ${(p) => p.fullScreen ? "100%" : "400px"};
+        max-height: ${(e) => e.fullScreen ? "100%" : "400px"};
     }
 
     &.humany-drawer-transition-exit-active,
     &.humany-drawer-transition-exit-done {
         max-height: 0;
     }
-`;
-const WrapperWithSlideInRight = styled(Wrapper$7)`
-    ${AnimationBase}
+`, $t = v(J)`
+    ${ee}
     transform: translateX(100%);
-    height: ${(p) => p.fullScreen ? "100%" : "auto"};
+    height: ${(e) => e.fullScreen ? "100%" : "auto"};
 
     &.humany-drawer-transition-enter {
         transform: translateX(100%);
@@ -1922,11 +1305,10 @@ const WrapperWithSlideInRight = styled(Wrapper$7)`
     &.humany-drawer-transition-exit-done {
         transform: translateX(100%);
     }
-`;
-const WrapperWithSlideInLeft = styled(Wrapper$7)`
-    ${AnimationBase}
+`, kt = v(J)`
+    ${ee}
     transform: translateX(-100%);
-    height: ${(p) => p.fullScreen ? "100%" : "auto"};
+    height: ${(e) => e.fullScreen ? "100%" : "auto"};
 
     &.humany-drawer-transition-enter {
         transform: translateX(-100%);
@@ -1941,9 +1323,8 @@ const WrapperWithSlideInLeft = styled(Wrapper$7)`
     &.humany-drawer-transition-exit-done {
         transform: translateX(-100%);
     }
-`;
-const WrapperWithSlideInTop = styled(Wrapper$7)`
-    ${AnimationBase}
+`, Lt = v(J)`
+    ${ee}
     bottom: unset;
     top: 0;
     height: 0;
@@ -1954,219 +1335,153 @@ const WrapperWithSlideInTop = styled(Wrapper$7)`
     &.humany-drawer-transition-enter-active,
     &.humany-drawer-transition-enter-done,
     &.humany-drawer-transition-exit {
-        height: ${(p) => p.clientHeight}px;
+        height: ${(e) => e.clientHeight}px;
     }
 
     &.humany-drawer-transition-exit-active,
     &.humany-drawer-transition-exit-done {
         height: 0;
     }
-`;
-const animations = {
-  ["slide-in-bottom"]: WrapperWithSlideInBottom,
-  ["slide-in-right"]: WrapperWithSlideInRight,
-  ["slide-in-left"]: WrapperWithSlideInLeft,
-  ["slide-in-top"]: WrapperWithSlideInTop
-};
-const usePosition = (visible, id, element) => {
-  const [posX, setPosX] = useState(0);
-  const [posY, setPosY] = useState(0);
-  const set = useCallback((event, trigger) => {
-    event.preventDefault();
-    if (trigger) {
-      const clientRect = trigger.getBoundingClientRect();
-      setPosX(Math.max(document.body.clientWidth - clientRect.right, 1));
-      setPosY(clientRect.bottom + window.scrollY);
-    }
-  }, [posX, posY, setPosX, setPosY]);
-  useEffect(() => {
-    if (!element || !visible) {
+`, 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(() => {
+    if (!n || !e)
       return;
-    }
-    const clientRect = element.getBoundingClientRect();
-    const newPos = {
-      x: posX,
-      y: posY
+    const l = n.getBoundingClientRect(), c = {
+      x: s,
+      y: i
     };
-    if (clientRect.left < 0) {
-      newPos.x = 0;
-    }
-    if (clientRect.bottom > window.innerHeight) {
-      newPos.y = 0;
-    }
-    if (newPos.x !== posX) {
-      setPosX(newPos.x);
-    }
-    if (newPos.y !== posY) {
-      setPosY(newPos.y);
-    }
-  }, [element, visible, id]);
-  return [{ x: posX, y: posY }, set];
-};
-const Dropdown = React.forwardRef((_i, ref) => {
-  var _j = _i, { className = "", children = null, trigger, closeButtonAriaLabel } = _j, props = __objRest(_j, ["className", "children", "trigger", "closeButtonAriaLabel"]);
-  const closeButtonRef = useRef();
-  const triggerRef = useRef();
-  const innerRef = useRef();
-  useImperativeHandle(ref, () => innerRef.current, [innerRef.current]);
-  const id = useRef(uuid());
-  const [visible, setVisible] = useState(false);
-  const previousVisible = usePrevious(visible);
-  const [{ x, y }, set] = usePosition(visible, id.current, innerRef.current);
-  const esc = useKeyPress("Escape");
-  useEffect(() => {
-    if (esc) {
-      setVisible(false);
-    }
-  }, [esc]);
-  useEffect(() => {
-    if (visible && closeButtonRef.current) {
-      closeButtonRef.current.focus();
-    } else if (!visible && triggerRef.current && previousVisible) {
-      triggerRef.current.focus();
-    }
-  }, [visible, closeButtonRef.current, triggerRef.current]);
-  useEventListener("click", (event) => {
-    const { target } = event;
-    if (!innerRef.current || !target) {
-      return;
-    }
-    if (innerRef.current !== target && !innerRef.current.contains(target)) {
-      setVisible(false);
-    }
-  }, window);
-  useWidgetEvent("router:changed", () => {
-    setVisible(false);
+    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 closeMenus = useUniqueMenu(id.current, () => {
-    setVisible(false);
-  });
-  const onTriggerClick = useCallback((event) => {
-    event.stopPropagation();
-    set(event, triggerRef.current);
-    setVisible(!visible);
-    closeMenus();
-  }, [closeMenus, set, setVisible]);
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, visible && /* @__PURE__ */ React.createElement(Portal, null, /* @__PURE__ */ React.createElement(StyledDropdown, __spreadProps(__spreadValues({
-    className: appendClassNames("humany-dropdown", `humany-dropdown-${id.current}`, className)
-  }, props), {
-    x,
-    y,
-    ref: innerRef
-  }), /* @__PURE__ */ React.createElement(CloseButton$1, {
-    onClick: () => setVisible(false),
+  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: closeButtonRef,
-    "aria-label": closeButtonAriaLabel
-  }, /* @__PURE__ */ React.createElement(SymbolBadge, {
+    ref: l,
+    "aria-label": s
+  }, /* @__PURE__ */ r.createElement(A, {
     symbol: { type: "Svg", content: "close" }
-  })), children)), React.cloneElement(trigger, {
-    onClick: onTriggerClick,
-    ref: triggerRef,
-    "aria-label": trigger.props.title,
-    "aria-expanded": visible
+  })), t)), r.cloneElement(n, {
+    onClick: K,
+    ref: c,
+    "aria-label": n.props.title,
+    "aria-expanded": d
   }));
-});
-const StyledDropdown = styled.div`
-    ${contentBox}
-    padding: ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.medium;
+}), St = v.div`
+    ${Se}
+    padding: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.medium;
 }};
     min-width: 150px;
     position: absolute;
-    box-shadow: ${(p) => p.theme.boxShadow};
+    box-shadow: ${(e) => e.theme.boxShadow};
 
-    ${(p) => {
-  var _a, _b, _c;
-  let css2 = "";
-  if (p.y > 0) {
-    css2 += `top: calc(${((_a = p.theme.sizes) == null ? void 0 : _a.small) || "0px"} + ${p.y || "0"}px);`;
-  } else {
-    css2 += `bottom: ${((_b = p.theme.sizes) == null ? void 0 : _b.normal) || "0px"};`;
-  }
-  if (p.x > 0) {
-    css2 += `right: ${p.x || "0"}px;`;
-  } else {
-    css2 += `left: ${((_c = p.theme.sizes) == null ? void 0 : _c.normal) || "0px"};`;
-  }
-  return css2;
+    ${(e) => {
+  var n, s, o;
+  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;
 }};
-`;
-const Empty = (_k) => {
-  var other = __objRest(_k, []);
-  return /* @__PURE__ */ React.createElement(Wrapper$6, __spreadValues({}, other));
-};
-const Wrapper$6 = styled.div`
+`, Ht = (t) => {
+  var e = $(t, []);
+  return /* @__PURE__ */ r.createElement(Rt, p({}, e));
+}, Rt = v.div`
     display: none;
-`;
-var grid = forwardRef((_l, ref) => {
-  var _m = _l, { children, columns, gap, className } = _m, other = __objRest(_m, ["children", "columns", "gap", "className"]);
-  return /* @__PURE__ */ React.createElement(Div, __spreadProps(__spreadValues(__spreadValues({
-    className: appendClassNames(className, "humany-grid"),
-    "data-columns": columns,
-    "data-gap": gap
-  }, filterCssProps(other)), convertToStringAttributes(other)), {
-    ref
-  }), children);
-});
-const Div = styled.div`
+`, 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`
     display: grid;
-    grid-template-columns: repeat(${(p) => p["data-columns"]}, 1fr);
-    grid-gap: ${(p) => p["data-gap"]};
+    grid-template-columns: repeat(${(e) => e["data-columns"]}, 1fr);
+    grid-gap: ${(e) => e["data-gap"]};
     justify-content: center;
     grid-auto-rows: max-content;
-    ${filterCssPropsStyle}
-`;
-var Html = forwardRef((_n, ref) => {
-  var _o = _n, { htmlParseInstruction = null, className, html } = _o, other = __objRest(_o, ["htmlParseInstruction", "className", "html"]);
-  const container = useContainer();
-  const [processedHtml, setProcessedHtml] = useState();
-  useEffect(() => {
-    const instructions = htmlParseInstruction || defaultRenderInstructions(container);
-    const processed = parseHtmlString(html, instructions);
-    setProcessedHtml(processed);
-  }, [html, htmlParseInstruction]);
-  return /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({
-    className: appendClassNames(className, "humany-html")
-  }, convertToStringAttributes(other)), {
-    ref
-  }), processedHtml);
-});
-const Icon = (_p) => {
-  var _q = _p, {
-    faIcon,
-    title,
-    className = "",
-    role = "presentation"
-  } = _q, other = __objRest(_q, [
+    ${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, {
+    faIcon: e,
+    title: t,
+    className: n = "",
+    role: s = "presentation"
+  } = a, o = $(a, [
     "faIcon",
     "title",
     "className",
     "role"
   ]);
-  return /* @__PURE__ */ React.createElement("i", __spreadValues({
-    className: appendClassNames(className, `fa fa-${faIcon}`),
-    title,
-    role
-  }, convertToStringAttributes(other)));
-};
-var input = forwardRef((_r, ref) => {
-  var _s = _r, {
-    className = "",
-    autoFocus = false,
-    onFocusChange = () => {
+  return /* @__PURE__ */ r.createElement("i", p({
+    className: w(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 = () => {
+    onEnter: s = () => {
     },
-    onEscape = () => {
+    onEscape: o = () => {
     },
-    selectAllOnFocus,
-    onChange = () => {
+    selectAllOnFocus: i,
+    onChange: a = () => {
     },
-    disabled = false,
-    type
-  } = _s, other = __objRest(_s, [
+    disabled: m = !1,
+    type: l
+  } = d, c = $(d, [
     "className",
     "autoFocus",
     "onFocusChange",
@@ -2177,87 +1492,70 @@ var input = forwardRef((_r, ref) => {
     "disabled",
     "type"
   ]);
-  const [hasFocus, setHasFocus] = useState(autoFocus);
-  const innerRef = useRef();
-  useImperativeHandle(ref, () => innerRef.current);
-  useEffect(() => {
-    var _a;
-    if (autoFocus) {
-      (_a = innerRef == null ? void 0 : innerRef.current) == null ? void 0 : _a.focus();
-    }
-  }, [autoFocus, ref, innerRef]);
-  const handleFocus = (inFocus, event) => {
-    setHasFocus(inFocus);
-    onFocusChange && onFocusChange(inFocus);
-    if (selectAllOnFocus && inFocus) {
-      event.target.select();
-    }
-  };
-  const props = __spreadProps(__spreadValues({}, convertToStringAttributes(other)), {
-    disabled,
-    autoFocus,
-    type,
-    onKeyDown: (e) => {
-      if (e.key === "Enter" && hasFocus) {
-        onEnter(e);
-      }
-      if (e.key === "Escape" && hasFocus) {
-        onEscape(e);
-      }
+  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: (e) => handleFocus(true, e),
-    onBlur: (e) => handleFocus(false, e),
-    onChange: (e) => onChange(e.target.value || ""),
-    className: appendClassNames(className, "humany-input"),
-    "data-type": type
+    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 type !== "textarea" ? /* @__PURE__ */ React.createElement("input", __spreadProps(__spreadValues({}, props), {
-    ref: innerRef
-  })) : /* @__PURE__ */ React.createElement("textarea", __spreadProps(__spreadValues({}, props), {
-    ref: innerRef
+  return l !== "textarea" ? /* @__PURE__ */ r.createElement("input", k(p({}, y), {
+    ref: E
+  })) : /* @__PURE__ */ r.createElement("textarea", k(p({}, y), {
+    ref: E
   }));
-});
-var List = forwardRef((_t, ref) => {
-  var _u = _t, { className, items, renderItem, renderLi = false } = _u, other = __objRest(_u, ["className", "items", "renderItem", "renderLi"]);
-  return /* @__PURE__ */ React.createElement("ul", __spreadProps(__spreadValues({
-    className: appendClassNames(className, "humany-list"),
-    "data-item-count": items.length
-  }, convertToStringAttributes(other)), {
-    ref
-  }), items.map((item, index, items2) => renderLi ? /* @__PURE__ */ React.createElement("li", {
+}), 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: item.id
-  }, renderItem(item, index, items2)) : renderItem(item, index, items2)));
-});
-var Paragraph = forwardRef((_v, ref) => {
-  var _w = _v, { text, html, header, className, htmlParseInstruction, symbol } = _w, other = __objRest(_w, ["text", "html", "header", "className", "htmlParseInstruction", "symbol"]);
-  return /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({
-    className: appendClassNames(className, "humany-paragraph")
-  }, convertToStringAttributes(other)), {
-    ref
-  }), header ? /* @__PURE__ */ React.createElement(Typography, {
+    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"
-  }, symbol ? /* @__PURE__ */ React.createElement(SymbolBadge, {
-    symbol
-  }) : null, header) : null, html ? /* @__PURE__ */ React.createElement(Html, {
-    html,
-    htmlParseInstruction
-  }) : null, text ? /* @__PURE__ */ React.createElement(Text, null, text) : null);
-});
-var ItemList = forwardRef((_x, ref) => {
-  var _y = _x, {
-    header,
-    customHeader,
-    text,
-    html,
-    className,
-    children,
-    symbol,
-    items,
-    renderItem,
-    renderLi,
-    ulProps
-  } = _y, other = __objRest(_y, [
+  }, 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",
@@ -2270,96 +1568,75 @@ var ItemList = forwardRef((_x, ref) => {
     "renderLi",
     "ulProps"
   ]);
-  return /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({
-    className: appendClassNames(className, "humany-item-list"),
-    "data-item-count": items.length
-  }, convertToStringAttributes(other)), {
-    ref
-  }), customHeader ? customHeader : header || text || html ? /* @__PURE__ */ React.createElement(Paragraph, {
-    symbol,
-    header,
-    text,
-    html
-  }) : null, items.length ? /* @__PURE__ */ React.createElement(List, __spreadValues({
-    items,
-    renderItem,
-    renderLi
-  }, ulProps)) : null, children);
-});
-const ItemTree = ({
-  className = "",
-  tree,
-  renderItem,
-  rootItem,
-  renderUnselected = true,
-  renderEmpty = true,
-  ulProps,
-  liProps
+  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 = ({
+  className: e = "",
+  tree: t,
+  renderItem: n,
+  rootItem: s,
+  renderUnselected: o = !0,
+  renderEmpty: i = !0,
+  ulProps: a,
+  liProps: m
 }) => {
-  const hasSelectedChildren = (items) => {
-    return !checkIfSelected(items);
-  };
-  const checkIfSelected = (items) => {
-    if (!items || items.length < 1) {
-      return true;
-    }
-    return !items.some((item) => !!item.selected);
-  };
-  const renderTreeItems = (treeItems, level) => {
-    return /* @__PURE__ */ React.createElement(ItemList, {
-      className: appendClassNames(`humany-item-tree-level-${level}`),
-      items: treeItems,
-      ulProps,
-      renderItem: (itemProps) => {
-        const { id, selected, items, matches } = itemProps;
-        const isSelected = selected && checkIfSelected(items);
-        if (!renderEmpty && !matches) {
-          return null;
-        }
-        return /* @__PURE__ */ React.createElement("li", __spreadProps(__spreadValues({}, convertToStringAttributes(liProps)), {
-          key: id,
-          className: "humany-item-tree-item"
-        }), renderItem && renderItem(itemProps, level, isSelected), items && (renderUnselected || isSelected) && renderTreeItems(items, level + 1));
-      }
-    });
-  };
-  return /* @__PURE__ */ React.createElement("div", {
-    className: appendClassNames(className, "humany-item-tree")
-  }, rootItem && rootItem(!hasSelectedChildren(tree || [])), tree && renderTreeItems(tree, 1));
-};
-const Overlay = (_z) => {
-  var _A = _z, {
-    visible,
-    duration = 500,
-    children,
-    onClick = () => {
+  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,
+    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)), {
+        key: g,
+        className: "humany-item-tree-item"
+      }), n && n(h, d, b), x && (o || b) && u(x, d + 1));
     }
-  } = _A, other = __objRest(_A, [
+  });
+  return /* @__PURE__ */ r.createElement("div", {
+    className: w(e, "humany-item-tree")
+  }, s && s(!l(t || [])), t && u(t, 1));
+}, De = (i) => {
+  var a = i, {
+    visible: e,
+    duration: t = 500,
+    children: n,
+    onClick: s = () => {
+    }
+  } = a, o = $(a, [
     "visible",
     "duration",
     "children",
     "onClick"
   ]);
-  const ref = useRef();
-  const onOverlayClick = useCallback((e) => {
-    if (e.target === ref.current) {
-      onClick(e);
-    }
-  }, [onClick]);
-  return /* @__PURE__ */ React.createElement(CSSTransition, {
-    in: visible,
+  const m = S(), l = H((c) => {
+    c.target === m.current && s(c);
+  }, [s]);
+  return /* @__PURE__ */ r.createElement(ve, {
+    in: e,
     className: "humany-overlay-transition",
     classNames: "humany-overlay-transition",
-    unmountOnExit: true,
-    timeout: duration
-  }, /* @__PURE__ */ React.createElement(Portal, null, /* @__PURE__ */ React.createElement(Wrapper$5, __spreadValues({
+    unmountOnExit: !0,
+    timeout: t
+  }, /* @__PURE__ */ r.createElement(G, null, /* @__PURE__ */ r.createElement(Vt, p({
     className: "humany-overlay",
-    duration,
-    ref,
-    onClick: onOverlayClick
-  }, other), children)));
-};
-const Wrapper$5 = styled.div`
+    duration: t,
+    ref: m,
+    onClick: l
+  }, o), n)));
+}, Vt = v.div`
     background: rgba(0, 0, 0, 0.6);
     min-width: 100%;
     min-height: 100%;
@@ -2373,7 +1650,7 @@ const Wrapper$5 = styled.div`
     align-items: center;
     z-index: 7;
 
-    transition: ${(p) => p.duration}ms;
+    transition: ${(e) => e.duration}ms;
     opacity: 0;
 
     &.humany-overlay-transition-enter {
@@ -2389,460 +1666,117 @@ const Wrapper$5 = styled.div`
     &.humany-overlay-transition-exit-done {
         opacity: 0;
     }
-`;
-const ZoomButtons = ({ zoom, zoomLevel }) => {
-  return /* @__PURE__ */ React.createElement(Wrapper$4, null, /* @__PURE__ */ React.createElement(Buttons, null, /* @__PURE__ */ React.createElement(StyledButton$1, {
-    "aria-label": "Zoom out",
-    onClick: () => {
-      zoom(false);
-    }
-  }, /* @__PURE__ */ React.createElement(StyledSymbolBadge$1, {
-    size: 24,
-    symbol: { type: "Svg", content: "zoom-out" }
-  })), /* @__PURE__ */ React.createElement(StyledButton$1, {
-    "aria-label": "Zoom in",
-    onClick: () => {
-      zoom(true);
-    }
-  }, /* @__PURE__ */ React.createElement(StyledSymbolBadge$1, {
+`, 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: "zoom-in" }
-  }))), /* @__PURE__ */ React.createElement(ZoomLevel, null, /* @__PURE__ */ React.createElement(Typography, {
-    variant: "p"
-  }, zoomLevel, "%")));
-};
-const Wrapper$4 = styled.div`
-    width: 100vw;
-    display: flex;
-    position: absolute;
-    bottom: 0;
-    margin-bottom: ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
-}};
-    justify-content: center;
-    flex-direction: row;
-`;
-const ZoomLevel = styled.div`
-    right: 45px;
-    position: absolute;
-    color: #fff;
-    font-size: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.normal;
-}};
-    line-height: 1.5em;
-    ${(p) => {
-  var _a, _b;
-  return ((_a = p.theme.fonts) == null ? void 0 : _a.type) && `
-    font-family: ${(_b = p.theme.fonts) == null ? void 0 : _b.type};
-  `;
-}}
-`;
-const Buttons = styled.div`
-    position: relative;
-    margin: ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
-}};
-`;
-const StyledSymbolBadge$1 = styled(SymbolBadge)`
-    path {
-        stroke: #ffffff;
-    }
-`;
-const StyledButton$1 = styled(Button)`
-    transition: opacity 300ms ease-in-out;
-    opacity: 0.7;
-    &:hover {
-        opacity: 1;
-    }
-    margin: ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.small;
-}};
-`;
-const spin = keyframes`
-  100% {
-    transform: rotate(360deg);
-  }
-`;
-const dash = keyframes`
-  0% {
-    stroke-dasharray: 1, 200;
-    stroke-dashoffset: 0;
-  }
-  50% {
-    stroke-dasharray: 89, 200;
-    stroke-dashoffset: -35px;
-  }
-  100% {
-    stroke-dasharray: 89, 200;
-    stroke-dashoffset: -124px;
-  }
-`;
-const SpinnerSvg = styled.svg`
-    animation: ${spin} 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;
-`;
-const Wrapper$3 = styled.div`
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  height: 100%;
-  width: 100%;
-  pointer-events: ${(p) => p["data-loading"] ? "all" : "none"}
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  transition: 200ms ease-out opacity;
-  box-sizing: border-box;
-  overflow: hidden;
-  ${SpinnerSvg} {
-    opacity: ${(p) => p["data-loading"] ? "1" : "0"}
-  }
-`;
-const Spinner = styled.div`
-    position: relative;
-    margin: 0 auto;
-    width: 100px;
-    &:before {
-        content: '';
-        display: block;
-        padding-top: 100%;
-    }
-`;
-const SpinnerCircle = styled.circle`
-    stroke-dasharray: 1, 200;
-    stroke-dashoffset: 0;
-    animation: ${dash} 1.5s ease-in-out infinite;
-    stroke-linecap: round;
-    stroke: ${(p) => {
-  var _a;
-  return (_a = p.theme.colors) == null ? void 0 : _a.primary;
+    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) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.normal;
 }};
-    stroke-width: 2px;
-`;
-const Loader = ({ loading = false }) => {
-  return /* @__PURE__ */ React.createElement(Wrapper$3, {
-    className: "humany-loader",
-    "data-loading": loading
-  }, /* @__PURE__ */ React.createElement(Spinner, {
-    className: "humany-spinner"
-  }, /* @__PURE__ */ React.createElement(SpinnerSvg, {
-    viewBox: "25 25 50 50"
-  }, /* @__PURE__ */ React.createElement(SpinnerCircle, {
-    cx: "50",
-    cy: "50",
-    r: "20",
-    fill: "none",
-    "stroke-width": "2",
-    "stroke-miterlimit": "10"
-  }))));
-};
-const ZoomImg = (_B) => {
-  var _C = _B, { zoomState } = _C, attrs = __objRest(_C, ["zoomState"]);
-  const ref = useRef(null);
-  const [loaded, setLoaded] = useState(false);
-  const _a = attrs.style || {}, { width, height } = _a, restStyle = __objRest(_a, ["width", "height"]);
-  const imageSize = useMemo(() => {
-    const img = ref.current;
-    if (img) {
-      if (img.width >= img.height) {
-        return [`${zoomState}vw`, "auto"];
-      } else {
-        return ["auto", `${zoomState}vh`];
-      }
-    }
-    return null;
-  }, [zoomState, ref, loaded]);
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Loader, {
-    loading: !loaded
-  }), /* @__PURE__ */ React.createElement(Img, __spreadProps(__spreadValues({
-    onLoad: () => {
-      setLoaded(true);
-    },
-    ref,
-    imageSize,
-    draggable: "false"
-  }, attrs), {
-    style: restStyle
-  })), /* @__PURE__ */ React.createElement(EmptyDiv, null));
-};
-const Img = styled.img`
-    transform: none;
+    max-width: 80%;
+    max-height: 80%;
 
-    ${(props) => props.imageSize ? css`
-                  width: ${props.imageSize[0]};
-                  height: ${props.imageSize[1]};
-                  display: inline-block;
-              ` : "display:none;"}
-    vertical-align: middle;
-    position: relative;
-`;
-const EmptyDiv = styled.div`
-    height: 100%;
-    display: inline-block;
-    vertical-align: middle;
-`;
-const useFadeOut = () => {
-  const timeOut = useRef();
-  const [show, setShow] = useState(true);
-  const triggerChange = useCallback(() => {
-    if (!show)
-      setShow(true);
-    if (timeOut.current) {
-      clearTimeout(timeOut.current);
-    }
-    timeOut.current = setTimeout(() => {
-      setShow(false);
-    }, 3e3);
-    return () => {
-      if (timeOut.current) {
-        clearTimeout(timeOut.current);
-      }
-    };
-  }, [show, timeOut]);
-  return [show, triggerChange];
-};
-const Lightbox = ({ attrs }) => {
-  const [visible, toggleVisible] = useToggle(false);
-  const esc = useKeyPress("Escape");
-  const [zoomState, setZoomState] = useState(80);
-  const [scroll, setScroll] = useState({ top: 0, left: 0, x: 0, y: 0 });
-  const [scrolling, setScrolling] = useState(false);
-  const [show, triggerFadeOut] = useFadeOut();
-  const ref = useRef(null);
-  useEffect(() => {
-    if (esc) {
-      toggleVisible(false);
-    }
-  }, [esc]);
-  const overlayClick = useCallback((e) => {
-    toggleVisible(false);
-  }, [toggleVisible]);
-  const changeZoomState = useCallback((zoomIn) => {
-    if (zoomIn) {
-      setZoomState(zoomState + 10);
-    } else {
-      setZoomState(zoomState - 10);
-    }
-  }, [setZoomState, zoomState]);
-  const downloadImage = useCallback(() => {
-    const { src } = attrs;
-    if (src) {
-      window.open(src, "_blank");
-    }
-  }, [attrs]);
-  const mouseDownHandler = useCallback((e) => {
-    const ele = ref.current;
-    if (ele) {
-      setScroll({ top: ele.scrollTop, left: ele.scrollLeft, x: e.clientX, y: e.clientY });
-      setScrolling(true);
-    }
-  }, [ref]);
-  const mouseDragHandler = useCallback((e) => {
-    const ele = ref.current;
-    if (ele && scrolling) {
-      const dx = e.clientX - scroll.x;
-      const dy = e.clientY - scroll.y;
-      ele.scrollTop = scroll.top - dy;
-      ele.scrollLeft = scroll.left - dx;
-    }
-  }, [scrolling, scroll]);
-  const mouseStopDragHandler = (e) => {
-    e.preventDefault();
-    setScrolling(false);
-  };
-  const isDraggable = useMemo(() => {
-    if (ref.current) {
-      const image = ref.current.getElementsByTagName("img");
-      if (image) {
-        const img = image[0];
-        return img.width > window.innerWidth || img.height > window.innerHeight;
-      }
+    img {
+        width: auto !important;
+        height: auto !important;
+        max-width: 100%;
+        max-height: 100%;
     }
-    return false;
-  }, [ref, zoomState]);
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Overlay, {
-    visible,
-    onClick: overlayClick
-  }, /* @__PURE__ */ React.createElement(DraggableArea, {
-    onMouseDown: () => triggerFadeOut(),
-    onMouseMove: () => triggerFadeOut(),
-    onTouchStart: () => triggerFadeOut()
-  }, /* @__PURE__ */ React.createElement(TransparentBarTop, {
-    show
-  }, /* @__PURE__ */ React.createElement(DownloadButton, {
-    onClick: () => downloadImage()
-  }, /* @__PURE__ */ React.createElement(StyledSymbolBadge, {
-    size: 20,
-    symbol: { type: "Svg", content: "download" }
-  })), /* @__PURE__ */ React.createElement(CloseButton, {
-    onClick: () => toggleVisible(false)
-  }, /* @__PURE__ */ React.createElement(StyledSymbolBadge, {
-    size: 20,
-    symbol: { type: "Svg", content: "lightbox-close" }
-  }))), /* @__PURE__ */ React.createElement(Content$1, {
-    scrolling,
-    isDraggable,
-    ref,
-    onMouseMove: mouseDragHandler,
-    onMouseDown: mouseDownHandler,
-    onMouseUp: mouseStopDragHandler
-  }, /* @__PURE__ */ React.createElement(ZoomImg, __spreadValues({
-    zoomState
-  }, attrs))), /* @__PURE__ */ React.createElement(TransparentBarBottom, {
-    show
-  }, /* @__PURE__ */ React.createElement(ZoomButtons, {
-    zoom: changeZoomState,
-    zoomLevel: zoomState
-  })))), /* @__PURE__ */ React.createElement("a", {
-    onClick: () => toggleVisible()
-  }, /* @__PURE__ */ React.createElement(Thumbnail, __spreadValues({}, attrs))));
-};
-const TransparentBar = styled.div`
-    position: absolute;
-    width: 100vw;
-    height: 88px;
-    left: 0px;
-    transition: opacity 0.3s ease 0s;
-    z-index: 5;
-    ${(p) => p.show ? "opacity: 1;" : css`
-                  opacity: 0;
-                  pointer-events: none;
-              `}
-`;
-const DraggableArea = styled.div`
-    width: 100%;
-`;
-const TransparentBarTop = styled(TransparentBar)`
-    top: 0px;
-    background-image: linear-gradient(to bottom, rgb(15, 15, 15, 0.8), rgba(30, 30, 30, 0));
-`;
-const TransparentBarBottom = styled(TransparentBar)`
-    bottom: 0px;
-    background-image: linear-gradient(to top, rgb(15, 15, 15, 0.8), rgba(30, 30, 30, 0));
-`;
-const Content$1 = styled.div`
-    width: 100%;
-    height: 100vh;
-    overflow: auto;
-    text-align: center;
-    vertical-align: middle;
-    white-space: nowrap;
-    justify-content: center;
-    cursor: ${(props) => props.isDraggable ? props.scrolling ? "grabbing" : "grab" : "auto"};
-`;
-const StyledButton = styled(Button)`
+`, It = v(U)`
     position: fixed;
-    top: 34px;
+    top: 50px;
+    right: 50px;
     transition: opacity 300ms ease-in-out;
     opacity: 0.7;
+
     &:hover {
         opacity: 1;
     }
-`;
-const CloseButton = styled(StyledButton)`
-    right: 32px;
-`;
-const DownloadButton = styled(StyledButton)`
-    right: 80px;
-`;
-const StyledSymbolBadge = styled(SymbolBadge)`
+`, Pt = v(A)`
     path {
         stroke: #ffffff;
     }
-`;
-const Thumbnail = styled.img`
+`, Ft = v.img`
     cursor: pointer;
-`;
-var RouteLink = forwardRef((_D, forwardedRef) => {
-  var _E = _D, { className, onClick = () => {
-  }, name = "", to = "", params = {}, children } = _E, other = __objRest(_E, ["className", "onClick", "name", "to", "params", "children"]);
-  const router = useRouter();
-  const container = useContainer();
-  if (!router) {
+`, 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 path = "";
-  const props = __spreadProps(__spreadValues({
-    onClick,
-    className: appendClassNames(className, "humany-route-link"),
-    to: path,
-    innerRef: forwardedRef
-  }, other), {
+  let d = "";
+  const h = k(p({
+    onClick: t,
+    className: w(e, "humany-route-link"),
+    to: d,
+    innerRef: m
+  }, a), {
     ref: null
   });
-  if (name) {
-    const routes = router.routes || [];
-    const route = routes.find((r) => r.name === name);
-    if (!route) {
-      return /* @__PURE__ */ React.createElement(Link$1, __spreadProps(__spreadValues({}, props), {
-        onClick: (e) => {
-          onClick(e);
-          e.preventDefault();
+  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.`);
         }
-      }), children);
-    }
-    const encodedParams = Object.keys(params).reduce((acc, key) => {
-      acc[key] = typeof params[key] === "string" ? encodeURIComponent(params[key]) : params[key];
-      return acc;
-    }, {});
+      }), i);
+    const x = Object.keys(o).reduce((y, b) => (y[b] = typeof o[b] == "string" ? encodeURIComponent(o[b]) : o[b], y), {});
     try {
-      path = router.generate(name, encodedParams || {});
-    } catch (e) {
-      return /* @__PURE__ */ React.createElement(Link$1, __spreadValues({}, props), children);
+      d = u.generate(n, x || {});
+    } catch (y) {
+      return /* @__PURE__ */ r.createElement(re, p({}, h), i);
     }
-    if (path && router.settings.mode && router.settings.mode === HistoryMode.browser && path[0] !== "/") {
-      path = `/${path}`;
-    }
-  } else if (to && router.history) {
-    path = router.history.createHref({
+    d && u.settings.mode && u.settings.mode === be.browser && d[0] !== "/" && (d = `/${d}`);
+  } else if (s && u.history)
+    d = u.history.createHref({
       hash: "",
-      pathname: to,
+      pathname: s,
       search: "",
       state: void 0
     });
-  } else {
-    return null;
+  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);
   }
-  if (router.settings && router.settings.mode === HistoryMode.scopedHash) {
-    const widgetName = container.get("$widget").name;
-    path = getSpecificWidgetPath(path, widgetName);
-  }
-  return /* @__PURE__ */ React.createElement(Link$1, __spreadProps(__spreadValues({}, props), {
-    to: path
-  }), children);
-});
-var Link = forwardRef((_F, ref) => {
-  var _G = _F, {
-    className,
-    disabled = false,
-    role = "link",
-    tabIndex = 0,
-    onClick = () => {
+  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 = () => {
     },
-    onKeyDown = () => {
+    onKeyDown: i = () => {
     },
-    title,
-    href,
-    children,
-    target,
-    routeName,
-    params
-  } = _G, other = __objRest(_G, [
+    title: a,
+    href: m,
+    children: l,
+    target: c,
+    routeName: u,
+    params: f
+  } = E, d = $(E, [
     "className",
     "disabled",
     "role",
@@ -2856,298 +1790,261 @@ var Link = forwardRef((_F, ref) => {
     "routeName",
     "params"
   ]);
-  const props = {
-    title,
-    disabled,
-    role,
-    tabIndex,
-    className: appendClassNames(className, "humany-link", [!!disabled, "humany-disabled"]),
-    onClick: (e) => {
-      e.persist();
-      if (disabled) {
-        e.preventDefault();
+  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;
       }
-      onClick(e);
+      o(y);
     },
-    onKeyDown: (e) => {
-      e.persist();
-      if (disabled) {
-        if (e.key !== "Tab") {
-          e.preventDefault();
-        }
+    onKeyDown: (y) => {
+      if (y.persist(), t) {
+        y.key !== "Tab" && y.preventDefault();
         return;
       }
-      onKeyDown(e);
+      i(y);
     }
   };
-  return routeName ? /* @__PURE__ */ React.createElement(StyledRouteLink, __spreadProps(__spreadValues(__spreadValues({
-    name: routeName,
-    params
-  }, props), convertToStringAttributes(other)), {
-    ref
-  }), children) : /* @__PURE__ */ React.createElement(StyledLink, __spreadProps(__spreadValues(__spreadValues({
-    href,
-    target
-  }, props), convertToStringAttributes(other)), {
-    ref
-  }), children);
-});
-const StyledRouteLink = styled(RouteLink)`
-    ${(p) => p.disabled ? `
+  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;"}
-`;
-const StyledLink = styled.a`
-    ${(p) => p.disabled ? `
+`, Kt = v.a`
+    ${(e) => e.disabled ? `
     pointer-events: none;
     opacity: .7;
   ` : "cursor: pointer;"}
-`;
-const Modal = forwardRef((_H, ref) => {
-  var _I = _H, { className, children, trigger, onOverlayClick = () => {
-  }, close = false } = _I, other = __objRest(_I, ["className", "children", "trigger", "onOverlayClick", "close"]);
-  const [visible, toggleVisible] = useToggle();
-  const [css2, innerRef] = useScroll(true);
-  const closeButtonRef = useRef();
-  const id = useRef(uuid());
-  const esc = useKeyPress("Escape");
-  useEffect(() => {
-    if (esc || close) {
-      toggleVisible(false);
-    }
-  }, [esc, close]);
-  useEffect(() => {
-    if (visible && closeButtonRef.current) {
-      closeButtonRef.current.focus();
-    }
-  }, [visible, closeButtonRef.current]);
-  useWidgetEvent("router:changed", () => {
-    toggleVisible(false);
+`, 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 overlayClick = useCallback((e) => {
-    toggleVisible(false);
-    onOverlayClick(e);
-  }, [onOverlayClick, toggleVisible]);
-  useImperativeHandle(ref, () => ({
+  const x = H((b) => {
+    u(!1), s(b);
+  }, [s, u]);
+  ie(a, () => ({
     close() {
-      toggleVisible(false);
+      u(!1);
     }
   }));
-  const closeMenus = useCallback(() => {
-    return useUniqueMenu(id.current, () => {
-      toggleVisible(false);
-    });
-  }, [id.current]);
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Overlay, {
-    visible,
-    onClick: overlayClick
-  }, /* @__PURE__ */ React.createElement(Wrapper$2, __spreadProps(__spreadValues({
-    className: appendClassNames(className, "humany-modal", `humany-modal-${id.current}`),
-    css: css2,
+  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
-  }, other), {
-    ref: innerRef
-  }), /* @__PURE__ */ React.createElement(CloseButton$1, {
-    onClick: () => toggleVisible(false),
+  }, i), {
+    ref: d
+  }), /* @__PURE__ */ r.createElement(de, {
+    onClick: () => u(!1),
     tabIndex: 0,
-    ref: closeButtonRef
-  }, /* @__PURE__ */ React.createElement(SymbolBadge, {
+    ref: h
+  }, /* @__PURE__ */ r.createElement(A, {
     symbol: { type: "Svg", content: "close" }
-  })), children)), React.cloneElement(trigger, {
-    onClick: (event) => {
-      toggleVisible();
-      closeMenus();
+  })), t)), r.cloneElement(n, {
+    onClick: (b) => {
+      u(), y();
     }
   }));
-});
-const Wrapper$2 = styled.div`
-    font-family: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.type;
+}), jt = v.div`
+    font-family: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.type;
 }};
-    font-size: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.normal;
+    font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.normal;
 }};
     position: relative;
     max-width: 50%;
     min-width: 200px;
-    padding: ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.medium;
+    padding: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.medium;
 }};
-    ${contentBox}
-    ${(p) => p.css && p.css}
+    ${Se}
+    ${(e) => e.css && e.css}
   outline: none;
-`;
-const Confirm = ({
-  className,
-  trigger,
-  header = "",
-  text = "",
-  onCancel = () => {
+`, Pn = ({
+  className: e,
+  trigger: t,
+  header: n = "",
+  text: s = "",
+  onCancel: o = () => {
   },
-  onConfirm = () => {
+  onConfirm: i = () => {
   },
-  cancelLabel = "",
-  confirmLabel = ""
+  cancelLabel: a = "",
+  confirmLabel: m = ""
 }) => {
-  const ref = useRef();
-  const cancel = useCallback(() => {
-    var _a;
-    onCancel();
-    (_a = ref == null ? void 0 : ref.current) == null ? void 0 : _a.close();
-  }, [onCancel]);
-  const confirm = useCallback(() => {
-    var _a;
-    onConfirm();
-    (_a = ref == null ? void 0 : ref.current) == null ? void 0 : _a.close();
-  }, [onConfirm]);
-  return /* @__PURE__ */ React.createElement(StyledModal, {
-    className,
-    trigger,
-    ref,
-    onOverlayClick: cancel
-  }, header && /* @__PURE__ */ React.createElement(StyledText, null, header), text && /* @__PURE__ */ React.createElement(StyledText, null, text), confirmLabel && /* @__PURE__ */ React.createElement(StyledConfirmButton, {
-    onClick: confirm
-  }, confirmLabel), cancelLabel && /* @__PURE__ */ React.createElement(StyledCancelButton, {
-    onClick: cancel
-  }, cancelLabel));
-};
-const StyledModal = styled(Modal)`
+  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, {
+    className: e,
+    trigger: t,
+    ref: l,
+    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, {
+    onClick: c
+  }, a));
+}, Xt = v(Yt)`
     display: block;
 
     span {
         display: block;
-        margin: 0 0 ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.normal;
+        margin: 0 0 ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.normal;
 }};
 
         &:first-of-type:not(:only-of-type) {
             font-weight: 700;
-            margin: 0 0 ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.small;
+            margin: 0 0 ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.small;
 }};
         }
     }
-`;
-const StyledConfirmButton = styled(Button)`
+`, _t = v(U)`
     display: inline-block;
     min-width: 50px;
-    ${(p) => {
-  var _a, _b;
-  return `padding: ${(_a = p.theme.sizes) == null ? void 0 : _a.small} ${(_b = p.theme.sizes) == null ? void 0 : _b.normal};`;
+    ${(e) => {
+  var t, n;
+  return `padding: ${(t = e.theme.sizes) == null ? void 0 : t.small} ${(n = e.theme.sizes) == null ? void 0 : n.normal};`;
 }}
-    ${(p) => p.theme.borderRadius && `border-radius: ${p.theme.borderRadius};`}
+    ${(e) => e.theme.borderRadius && `border-radius: ${e.theme.borderRadius};`}
   color: #FFFFFF;
-    background-color: ${(p) => {
-  var _a;
-  return (_a = p.theme.colors) == null ? void 0 : _a.primary;
+    background-color: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.primary;
 }};
-    border: 1px solid ${(p) => {
-  var _a;
-  return (_a = p.theme.colors) == null ? void 0 : _a.primary;
+    border: 1px solid ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.primary;
 }};
 
-    margin: 0 ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.small;
+    margin: 0 ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.small;
 }} 0 0;
 
     &:focus {
-        ${(p) => {
-  var _a;
-  return ((_a = p.theme.accessibility) == null ? void 0 : _a.isTabbing) && borderTabStyle;
+        ${(e) => {
+  var t;
+  return ((t = e.theme.accessibility) == null ? void 0 : t.isTabbing) && P;
 }};
         background-color: transparent;
     }
-`;
-const StyledCancelButton = styled(Button)`
+`, Ut = v(U)`
     display: inline-block;
     min-width: 50px;
-    ${(p) => {
-  var _a, _b;
-  return `padding: ${(_a = p.theme.sizes) == null ? void 0 : _a.small} ${(_b = p.theme.sizes) == null ? void 0 : _b.normal};`;
+    ${(e) => {
+  var t, n;
+  return `padding: ${(t = e.theme.sizes) == null ? void 0 : t.small} ${(n = e.theme.sizes) == null ? void 0 : n.normal};`;
 }}
-    ${(p) => p.theme.borderRadius && `border-radius: ${p.theme.borderRadius};`}
+    ${(e) => e.theme.borderRadius && `border-radius: ${e.theme.borderRadius};`}
   background-color: transparent;
-    color: ${(p) => {
-  var _a;
-  return (_a = p.theme.colors) == null ? void 0 : _a.text;
+    color: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
 }};
-    border: 1px solid ${(p) => {
-  var _a;
-  return (_a = p.theme.colors) == null ? void 0 : _a.text;
+    border: 1px solid ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
 }};
 
     &:focus {
-        ${(p) => {
-  var _a;
-  return ((_a = p.theme.accessibility) == null ? void 0 : _a.isTabbing) && borderTabStyle;
+        ${(e) => {
+  var t;
+  return ((t = e.theme.accessibility) == null ? void 0 : t.isTabbing) && P;
 }};
     }
-`;
-const NotFound = ({
-  header = "",
-  link = "",
-  suggestionHeader = "",
-  suggestion = ""
-}) => {
-  return /* @__PURE__ */ React.createElement(Wrapper$1, null, /* @__PURE__ */ React.createElement(Status, null, /* @__PURE__ */ React.createElement(Typography, {
-    variant: "h2"
-  }, "404")), /* @__PURE__ */ React.createElement(Header, null, /* @__PURE__ */ React.createElement(Typography, {
-    variant: "h3"
-  }, header), /* @__PURE__ */ React.createElement(TextLink, {
-    routeName: "index",
-    "aria-label": link,
-    text: link
-  })), /* @__PURE__ */ React.createElement(Content, null, /* @__PURE__ */ React.createElement("span", null, suggestionHeader), /* @__PURE__ */ React.createElement("ul", null, /* @__PURE__ */ React.createElement("li", null, suggestion))));
-};
-const Wrapper$1 = styled.div`
+`, Fn = ({
+  header: e = "",
+  link: t = "",
+  suggestionHeader: n = "",
+  suggestion: s = ""
+}) => /* @__PURE__ */ r.createElement(qt, null, /* @__PURE__ */ r.createElement(Qt, null, /* @__PURE__ */ r.createElement(_, {
+  variant: "h2"
+}, "404")), /* @__PURE__ */ r.createElement(Gt, null, /* @__PURE__ */ r.createElement(_, {
+  variant: "h3"
+}, e), /* @__PURE__ */ r.createElement(en, {
+  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`
     display: flex;
     flex-wrap: wrap;
-`;
-const Status = styled.div`
-    ${headingElement("h2", css`
+`, Qt = v.div`
+    ${X("h2", M`
             padding: 0;
             margin: 0;
             color: gray;
             font-size: 7em;
         `)}
-`;
-const Header = styled.div`
-    margin-left: ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.medium;
+`, Gt = v.div`
+    margin-left: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.medium;
 }};
 
-    ${headingElement("h3", css`
+    ${X("h3", M`
             text-transform: uppercase;
-            font-size: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.normal;
+            font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.normal;
 }};
         `)}
 
     a {
-        color: ${(p) => {
-  var _a;
-  return (_a = p.theme.colors) == null ? void 0 : _a.link;
+        color: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.link;
 }};
-        font-size: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.small;
+        font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.small;
 }};
     }
-`;
-const Content = styled.div`
-    margin-top: ${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.medium;
+`, Jt = v.div`
+    margin-top: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.medium;
 }};
     min-width: 100%;
 
@@ -3155,345 +2052,301 @@ const Content = styled.div`
         font-weight: bold;
     }
 `;
-class TabStop extends Component {
+class Zn extends We {
   constructor() {
-    super(...arguments);
-    this.state = {
-      boundFocus: false
+    super(...arguments), this.state = {
+      boundFocus: !1
     };
   }
   componentWillMount() {
-    const settings = this.props.container.get("accessibilitySettings");
-    if (settings && settings.boundFocus) {
-      this.setState({
-        boundFocus: true
-      });
-    }
+    const t = this.props.container.get("accessibilitySettings");
+    t && t.boundFocus && this.setState({
+      boundFocus: !0
+    });
   }
   componentDidMount() {
-    if (!this.state.boundFocus) {
+    if (!this.state.boundFocus)
       return;
-    }
-    const widgetDOMElement = this.props.container.get("widgetDOMElement");
-    if (this.node && widgetDOMElement) {
-      this.onFocusListener = this.node.addEventListener("focus", () => {
-        const focusable = widgetDOMElement.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
-        const filtered = [].filter.call(focusable, (el) => {
-          if (typeof window === "undefined") {
-            return true;
-          }
-          const style = window.getComputedStyle(el);
-          if (style.display === "none" || el.offsetWidth <= 0 && el.offsetHeight <= 0) {
-            return false;
-          }
-          return true;
-        });
-        const firstFocusable = filtered[0];
-        if (firstFocusable) {
-          firstFocusable.focus();
-        }
-      });
-    }
+    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();
+    }));
   }
   componentWillUnmount() {
-    if (this.node) {
-      this.node.removeEventListener("focus", this.onFocusListener);
-    }
+    this.node && this.node.removeEventListener("focus", this.onFocusListener);
   }
   render() {
-    if (!this.state.boundFocus) {
-      return null;
-    }
-    return /* @__PURE__ */ React.createElement("div", {
+    return this.state.boundFocus ? /* @__PURE__ */ r.createElement("div", {
       style: { opacity: 0 },
       tabIndex: 0,
-      ref: (node) => {
-        this.node = node;
+      ref: (t) => {
+        this.node = t;
       }
-    });
+    }) : null;
   }
 }
-var TextLink = forwardRef((_J, ref) => {
-  var _K = _J, { className, description, text, children } = _K, other = __objRest(_K, ["className", "description", "text", "children"]);
-  return /* @__PURE__ */ React.createElement(Link, __spreadProps(__spreadValues({
-    className: appendClassNames(className, "humany-text-link")
-  }, other), {
-    ref
-  }), children, /* @__PURE__ */ React.createElement(Text, null, text), description ? /* @__PURE__ */ React.createElement(Html, {
-    html: description,
+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 DateFormats = /* @__PURE__ */ ((DateFormats2) => {
-  DateFormats2["HH_MM"] = "hh:mm";
-  DateFormats2["YYYY_MM_DD"] = "yyyy-mm-dd";
-  DateFormats2["YYYY_MM_DD_HH_MM"] = "yyyy-mm-dd hh:mm";
-  return DateFormats2;
-})(DateFormats || {});
-const Timestamp = ({ className = "", format = "hh:mm", timestamp }) => {
-  return /* @__PURE__ */ React.createElement("span", {
-    className: appendClassNames(className, "humany-timestamp")
-  }, formatDate(timestamp, format));
-};
-const asTwoDigitString = (input2) => {
-  return `0${input2}`.slice(-2);
-};
-function formatDate(unformattedDate, format) {
-  const date = new Date(unformattedDate);
-  const dateArray = date.toTimeString().split(" ")[0].split(":");
-  const timeString = dateArray.length > 1 ? `${dateArray[0]}:${dateArray[1]}` : dateArray[0];
-  const year = date.getFullYear();
-  const month = date.getMonth() + 1;
-  const day = date.getDate();
-  const dateString = `${year}-${asTwoDigitString(month)}-${asTwoDigitString(day)}`;
-  if (format === "yyyy-mm-dd") {
-    return dateString;
-  }
-  if (format === "hh:mm") {
-    return timeString;
-  }
-  return `${dateString} ${timeString}`;
+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 Tooltip = (_L) => {
-  var _M = _L, { className, children, content, sticky = false } = _M, other = __objRest(_M, ["className", "children", "content", "sticky"]);
-  const [open, setOpen] = useState(false);
-  const id = useRef(uuid());
-  const ref = useRef();
-  const [{ x, y }, set] = usePosition(open, id.current, ref.current);
-  const clickHandler = (event) => {
-    const { target } = event;
-    if (!ref.current || !target) {
-      return;
-    }
-    if (ref.current !== target && !ref.current.contains(target)) {
-      setOpen(false);
-    }
+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);
   };
-  useEffect(() => {
-    if (!sticky) {
-      return;
-    }
-    window.addEventListener("click", clickHandler);
-    return () => {
-      window.removeEventListener("click", clickHandler);
-    };
-  }, [open, sticky]);
-  const handleMouseEvent = useCallback((e, value) => {
-    set(e, ref.current);
-    setOpen(value);
-  }, [set, setOpen]);
-  return /* @__PURE__ */ React.createElement(Trigger, {
-    ref,
+  C(() => {
+    if (!!s)
+      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,
     className: "humany-tooltip-trigger",
-    onMouseEnter: !sticky ? (e) => handleMouseEvent(e, true) : void 0,
-    onMouseLeave: !sticky ? (e) => handleMouseEvent(e, false) : void 0,
-    onTouchEnd: sticky ? (e) => handleMouseEvent(e, !open) : void 0,
-    onClick: sticky ? (e) => handleMouseEvent(e, !open) : void 0
-  }, children, open && /* @__PURE__ */ React.createElement(Portal, null, /* @__PURE__ */ React.createElement(TooltipContainer, __spreadValues({
-    className: appendClassNames(className, "humany-tooltip-container"),
-    x,
-    y
-  }, other), content)));
-};
-const Trigger = styled.div`
+    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,
+    y: d
+  }, o), n)));
+}, rn = v.div`
     display: flex;
     align-items: center;
-`;
-const TooltipContainer = styled.div`
+`, on = v.div`
     color: #ffffff;
     background: #161616;
-    border-radius: ${(p) => p.theme.borderRadius};
-    padding: calc(${(p) => {
-  var _a;
-  return (_a = p.theme.sizes) == null ? void 0 : _a.small;
+    border-radius: ${(e) => e.theme.borderRadius};
+    padding: calc(${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.small;
 }} * 2);
-    font-size: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.normal;
+    font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.normal;
 }};
-    font-family: ${(p) => {
-  var _a;
-  return (_a = p.theme.fonts) == null ? void 0 : _a.type;
+    font-family: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.type;
 }};
     position: absolute;
     z-index: 10;
 
     a {
-        color: ${(p) => p.color ? p.color : "inherit"};
+        color: ${(e) => e.color ? e.color : "inherit"};
         text-decoration: none;
     }
 
     i,
     svg {
-        margin-right: ${(p) => p.theme.sizes.small};
+        margin-right: ${(e) => e.theme.sizes.small};
     }
 
-    ${(p) => {
-  let css2 = "";
-  if (p.y > 0) {
-    css2 += `top: calc(2px + ${p.y || "0"}px);`;
-  } else {
-    css2 += `bottom: 2px;`;
-  }
-  if (p.x > 0) {
-    css2 += `right: calc(2px + ${p.x || "0"}px);`;
-  } else {
-    css2 += `left: 2px;`;
-  }
-  return css2;
+    ${(e) => {
+  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;
 }};
-`;
-const TransitionComponent = (props) => {
+`, Yn = (e) => {
   const {
-    in: inState,
-    mountOnEnter = true,
-    unmountOnExit = true,
-    timeout,
-    children,
-    transitions
-  } = props;
-  const generateTransitionDefinition = () => {
-    var _a, _b;
-    if (!transitions || transitions === "none") {
-      return;
-    }
-    if (typeof transitions === "string") {
-      return {
-        enter: {
-          transitionKeys: transitions,
-          duration: !!timeout ? typeof timeout === "number" ? timeout : timeout.enter : 200,
-          easing: "ease-in"
-        },
-        exit: {
-          transitionKeys: transitions,
-          duration: !!timeout ? typeof timeout === "number" ? timeout : timeout.exit : 200,
-          easing: "ease-out"
-        }
-      };
-    }
-    if (typeof transitions === "object") {
-      const { enter, exit } = transitions;
-      return {
-        enter: {
-          transitionKeys: (_a = transitions.enter) == null ? void 0 : _a.type,
-          duration: !!timeout ? typeof timeout === "number" ? timeout : timeout.enter : 200,
-          easing: !!enter.easing ? enter.easing : "ease-in"
-        },
-        exit: {
-          transitionKeys: (_b = transitions.enter) == null ? void 0 : _b.type,
-          duration: !!timeout ? typeof timeout === "number" ? timeout : timeout.enter : 200,
-          easing: !!exit.easing ? exit.easing : "ease-out"
-        }
-      };
+    in: t,
+    mountOnEnter: n = !0,
+    unmountOnExit: s = !0,
+    timeout: o,
+    children: i,
+    transitions: a
+  } = e, l = (() => {
+    var c, u;
+    if (!(!a || a === "none")) {
+      if (typeof a == "string")
+        return {
+          enter: {
+            transitionKeys: a,
+            duration: o ? typeof o == "number" ? o : o.enter : 200,
+            easing: "ease-in"
+          },
+          exit: {
+            transitionKeys: a,
+            duration: o ? typeof o == "number" ? o : o.exit : 200,
+            easing: "ease-out"
+          }
+        };
+      if (typeof a == "object") {
+        const { enter: f, 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"
+          },
+          exit: {
+            transitionKeys: (u = a.enter) == null ? void 0 : u.type,
+            duration: o ? typeof o == "number" ? o : o.enter : 200,
+            easing: d.easing ? d.easing : "ease-out"
+          }
+        };
+      }
     }
-  };
-  const def = generateTransitionDefinition();
-  return /* @__PURE__ */ React.createElement(Transition, {
+  })();
+  return /* @__PURE__ */ r.createElement(Ie, {
     timeout: {
-      enter: def && def.enter.duration || 0,
-      exit: def && def.exit.duration || 0
+      enter: l && l.enter.duration || 0,
+      exit: l && l.exit.duration || 0
     },
-    in: inState,
-    appear: true,
-    mountOnEnter,
-    unmountOnExit,
-    onEnter: (node) => node.clientHeight
-  }, (state) => children && children(state, def && transitionComposer.compose(state, def)));
-};
-var WidgetLink = forwardRef((_N, ref) => {
-  var _O = _N, { className, children, onClick = () => {
-  }, widgetName, activationOptions } = _O, other = __objRest(_O, ["className", "children", "onClick", "widgetName", "activationOptions"]);
-  const container = useContainer();
-  const getWidget = () => {
-    const { implementation } = container.get("$widget");
-    return implementation.widgets.get(widgetName);
+    in: t,
+    appear: !0,
+    mountOnEnter: n,
+    unmountOnExit: s,
+    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);
   };
-  useEffect(() => {
-    const widget = getWidget();
-    widget == null ? void 0 : widget.activate(activationOptions).then(() => widget.invoke("attach"));
-    return () => {
-      widget == null ? void 0 : widget.deactivate();
+  C(() => {
+    const h = u();
+    return h == null || h.activate(o).then(() => h.invoke("attach")), () => {
+      h == null || h.deactivate();
     };
-  }, [widgetName]);
-  const openWidget = (e) => {
-    const widget = getWidget();
-    const target = e.currentTarget;
-    if (widget) {
-      const toggle = () => {
-        widget.invoke("renderState").then((renderState) => renderState === WidgetRenderState.open ? widget.invoke("close") : widget.invoke("open")).then(() => {
-          widget.events.subscribeOnce("widget:area-rendered", (event, data) => {
-            const widgetDOMElement = container.get("widgetDOMElement");
-            if (widgetDOMElement) {
-              widget.events.dispatch("widget:modal-opened", {
-                name: widget.name,
-                ref: target
-              });
-            }
+  }, [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
+            });
           });
         });
       };
-      if (widget.state === WidgetState.Deactivated) {
-        widget.activate(activationOptions).then(() => widget.invoke("attach")).then(toggle);
-      } else {
-        toggle();
-      }
-    }
-  };
-  const onEnter = (e) => {
-    if (e.key === "Enter") {
-      e.preventDefault();
-      openWidget(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__ */ React.createElement(Link, __spreadProps(__spreadValues({
-    className: appendClassNames(className, "humany-widget-link"),
-    onKeyDown: onEnter,
-    onClick: (e) => {
-      onClick(e);
-      openWidget(e);
-    }
-  }, other), {
-    ref
-  }), children);
-});
-const WidgetOverlayOutlet = forwardRef(({ portalId = "humany-widget-overlay-portal", className, children }, ref) => {
-  const container = useContainer();
-  const parentElement = useMemo(() => {
-    if (!container)
-      return null;
-    const widgetDOMElement = container.get("widgetDOMElement");
-    if (!widgetDOMElement || !widgetDOMElement.childElementCount)
-      return null;
-    return widgetDOMElement.children[0];
-  }, [container]);
-  if (!parentElement) {
-    return null;
-  }
-  return /* @__PURE__ */ React.createElement(Portal, {
-    elementId: portalId,
-    parent: parentElement
-  }, /* @__PURE__ */ React.createElement(Wrapper, {
-    className: appendClassNames("humany-widget-overlay-outlet", className),
-    ref
-  }, children));
-});
-const Wrapper = styled.div`
-    background-color: #ffffff;
-    position: absolute;
-    top: 0;
-    left: 0;
-    bottom: 0;
-    right: 0;
-    z-index: 10;
-    width: 100%;
-    height: 100%;
-`;
-const createReactComponent = (container, type, reactComponent, fn, options) => {
-  return container.getAsync("componentResolver").then((componentResolver) => {
-    componentResolver.registerComponent(type, lazy(() => reactComponent));
-    return extendComponent(container, type, fn || (() => {
-    }), type, options);
-  });
+  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)));
+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,
+  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,
+  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
 };
-export { AnchorLink, Button, Checkbox, ColumnContext, ComponentNodeContext, ComponentPropertyContext, Confirm, ContainerContext, DateFormats, Drawer, AnimationType as DrawerAnimationType, Dropdown, Empty, grid as Grid, Html, Icon, input as Input, ItemList, ItemTree, Lightbox, Link, List, Modal, NotFound, Overlay, Paragraph, Portal, RouteLink, RoutingContext, StyledText, SymbolBadge, TabStop, Text, TextLink, Timestamp, Tooltip, TransitionComponent, Typography, WidgetLink, WidgetOverlayOutlet, borderTabStyle, browser, buttonCss, contentBox, convertToStringAttributes, createEmptyComponent, createReactComponent, defaultRenderInstructions, embeddedLinkMapper, filterCssProps, filterCssPropsStyle, genericHashLink, genericHtml, headingElement, invertedHoverButton, itemList, linkTabStyle, list, paddedBorderTabStyle, parseHtmlString as processHtmlString, transitionComposer, useAction, useChildren, useColumns, useComponent, useComponentDescriptor, useComponentNode, useComponentPlatform, useContainer, useContext, useDispatch, useEventListener, useEvents, useIsMounted, useKeyPress, useLayout, usePrevious, useProperties, useRenderState, useRouteData, useRouter, useScroll, useSettings, useToggle, useTransitionEnd, useUniqueMenu, useWidgetEvent };
 //# sourceMappingURL=index.js.map