@telia-ace/knowledge-widget-ui 1.0.38 → 1.0.39

package/dist/index.js

@@ -1,71 +1,71 @@
 var He = Object.defineProperty, je = Object.defineProperties;
 var Oe = Object.getOwnPropertyDescriptors;
 var R = Object.getOwnPropertySymbols;
-var oe = Object.prototype.hasOwnProperty, se = Object.prototype.propertyIsEnumerable;
-var re = (t, e, a) => e in t ? He(t, e, { enumerable: !0, configurable: !0, writable: !0, value: a }) : t[e] = a, y = (t, e) => {
+var re = Object.prototype.hasOwnProperty, se = Object.prototype.propertyIsEnumerable;
+var oe = (t, e, a) => e in t ? He(t, e, { enumerable: !0, configurable: !0, writable: !0, value: a }) : t[e] = a, y = (t, e) => {
   for (var a in e || (e = {}))
-    oe.call(e, a) && re(t, a, e[a]);
+    re.call(e, a) && oe(t, a, e[a]);
   if (R)
     for (var a of R(e))
-      se.call(e, a) && re(t, a, e[a]);
+      se.call(e, a) && oe(t, a, e[a]);
   return t;
 }, E = (t, e) => je(t, Oe(e));
 var w = (t, e) => {
   var a = {};
-  for (var r in t)
-    oe.call(t, r) && e.indexOf(r) < 0 && (a[r] = t[r]);
+  for (var o in t)
+    re.call(t, o) && e.indexOf(o) < 0 && (a[o] = t[o]);
   if (t != null && R)
-    for (var r of R(t))
-      e.indexOf(r) < 0 && se.call(t, r) && (a[r] = t[r]);
+    for (var o of R(t))
+      e.indexOf(o) < 0 && se.call(t, o) && (a[o] = t[o]);
   return a;
 };
-import { useRouteData as he, Link as Ye, Icon as H, List as Z, list as ge, invertedHoverButton as pe, ItemList as O, itemList as Y, Drawer as _e, Dropdown as ye, headingElement as ee, Text as $e, Button as te, paddedBorderTabStyle as ie, Confirm as Ve, SymbolBadge as N, StyledText as J, convertToStringAttributes as ve, useKeyPress as W, useContainer as Ke, useEventListener as le, Timestamp as xe, DateFormats as be, TextLink as Q, useIsTabbing as qe, usePrevious as Ge, borderTabStyle as X, Paragraph as Ue, genericHtml as Je, AnchorLink as Qe, WidgetLink as Xe } from "@telia-ace/widget-ui";
-export * from "@telia-ace/widget-ui";
-import { createParams as j, formatUrl as ce, appendClassNames as z, htmlParentContains as Ze } from "@telia-ace/widget-utilities";
-import n, { forwardRef as _, useCallback as k, useState as A, useEffect as V, useMemo as et, useRef as we, useImperativeHandle as tt } from "react";
+import { css as $, keyframes as he } from "@emotion/react";
 import d from "@emotion/styled";
-import { css as $, keyframes as Ee } from "@emotion/react";
-const ke = ({
+import { useRouteData as ge, Link as Ye, Icon as H, List as Z, list as pe, invertedHoverButton as ye, Drawer as _e, ItemList as O, itemList as Y, Dropdown as $e, headingElement as ee, Text as ve, Button as te, paddedBorderTabStyle as ie, Confirm as Ke, SymbolBadge as N, StyledText as J, convertToStringAttributes as xe, useKeyPress as W, useContainer as Ve, useEventListener as le, DateFormats as be, Timestamp as we, useIsTabbing as qe, usePrevious as Ge, TextLink as Q, borderTabStyle as X, Paragraph as Ue, genericHtml as Je, AnchorLink as Qe, WidgetLink as Xe } from "@telia-ace/widget-ui";
+export * from "@telia-ace/widget-ui";
+import n, { forwardRef as _, useCallback as k, useState as T, useEffect as K, useMemo as Ze, useRef as Ee, useImperativeHandle as et } from "react";
+import { createParams as j, formatUrl as ce, appendClassNames as z, htmlParentContains as tt } from "@telia-ace/widget-utilities";
+const at = ({
   title: t = "",
   className: e,
   id: a,
-  parent: r,
+  parent: o,
   connection: s,
   type: i,
-  target: o,
+  target: r,
   href: c,
   children: m
 }) => {
-  const f = {}, { name: u, params: l } = he();
+  const u = {}, { name: f, params: l } = ge();
   switch (i) {
     case "default":
     case "guide":
-      const { id: h, title: S } = r;
-      f.routeName = u, f.params = j(E(y({}, l), {
+      const { id: h, title: S } = o;
+      u.routeName = f, u.params = j(E(y({}, l), {
         guide: a,
         connection: a === h ? s : void 0,
         uriName: a === h ? ce(S) : ce(t)
       }));
       break;
     case "link":
-      f.href = c, f.target = o;
+      u.href = c, u.target = r;
       break;
   }
-  return /* @__PURE__ */ n.createElement(Ye, y({ className: z(e, "humany-dialog-link") }, f), m || /* @__PURE__ */ n.createElement(n.Fragment, null, i === "link" && /* @__PURE__ */ n.createElement(H, { faIcon: "link" }), /* @__PURE__ */ n.createElement("span", null, t)));
-}, Ot = _((s, r) => {
+  return /* @__PURE__ */ n.createElement(Ye, y({ className: z(e, "humany-dialog-link") }, u), m || /* @__PURE__ */ n.createElement(n.Fragment, null, i === "link" && /* @__PURE__ */ n.createElement(H, { faIcon: "link" }), /* @__PURE__ */ n.createElement("span", null, t)));
+}, ke = at, ta = _((s, o) => {
   var i = s, { className: t, dialog: e } = i, a = w(i, ["className", "dialog"]);
   return e.length ? /* @__PURE__ */ n.createElement(
-    at,
+    nt,
     E(y({
       className: z(t, "humany-dialog"),
       items: e,
-      renderItem: (o) => /* @__PURE__ */ n.createElement("li", { key: o.connection, "data-dialog": o.connection }, /* @__PURE__ */ n.createElement(ke, y({}, o)))
+      renderItem: (r) => /* @__PURE__ */ n.createElement("li", { key: r.connection, "data-dialog": r.connection }, /* @__PURE__ */ n.createElement(ke, y({}, r)))
     }, a), {
-      ref: r
+      ref: o
     })
   ) : null;
-}), at = d(Z)`
-    ${ge}
+}), nt = d(Z)`
+    ${pe}
     a {
         min-width: 150px;
         max-width: 400px;
@@ -73,7 +73,7 @@ const ke = ({
         white-space: normal;
         ${(t) => {
   var e, a;
-  return ((e = t.theme.colors) == null ? void 0 : e.primary) && pe({
+  return ((e = t.theme.colors) == null ? void 0 : e.primary) && ye({
     primaryColor: (a = t.theme.colors) == null ? void 0 : a.primary,
     secondaryColor: "#FFFFFF",
     theme: t.theme
@@ -87,18 +87,18 @@ const ke = ({
   return (e = t.theme.sizes) == null ? void 0 : e.small;
 }} 0 0;
     }
-`, Yt = (u) => {
-  var l = u, {
+`, ot = (f) => {
+  var l = f, {
     trigger: t,
     header: e,
     className: a,
-    animation: r,
+    animation: o,
     fullScreen: s,
     onToggle: i,
-    children: o,
+    children: r,
     ref: c,
     closeButtonAriaLabel: m
-  } = l, f = w(l, [
+  } = l, u = w(l, [
     "trigger",
     "header",
     "className",
@@ -115,14 +115,14 @@ const ke = ({
       className: z(a, "humany-drawer-list"),
       trigger: t,
       header: e,
-      animation: r,
+      animation: o,
       fullScreen: s,
       onToggle: i,
       closeButtonAriaLabel: m
     },
-    /* @__PURE__ */ n.createElement(nt, y({}, f), o)
+    /* @__PURE__ */ n.createElement(rt, y({}, u), r)
   );
-}, nt = d(O)`
+}, aa = ot, rt = d(O)`
     ${Y}
     font-family: ${(t) => {
   var e;
@@ -140,7 +140,7 @@ const ke = ({
   return (e = t.theme.fonts) == null ? void 0 : e.normal;
 }};
     }
-`, _t = ({ items: t, renderItem: e, trigger: a, header: r, children: s }) => /* @__PURE__ */ n.createElement(ye, { className: "humany-dropdown-actions", trigger: a }, /* @__PURE__ */ n.createElement(rt, null, !!r && /* @__PURE__ */ n.createElement(ot, null, r), t && e && /* @__PURE__ */ n.createElement(st, { items: t, renderItem: e }), s)), rt = d.div`
+`, st = ({ items: t, renderItem: e, trigger: a, header: o, children: s }) => /* @__PURE__ */ n.createElement($e, { className: "humany-dropdown-actions", trigger: a }, /* @__PURE__ */ n.createElement(it, null, !!o && /* @__PURE__ */ n.createElement(lt, null, o), t && e && /* @__PURE__ */ n.createElement(ct, { items: t, renderItem: e }), s)), na = st, it = d.div`
     background: #fff;
     border: #ccc 1px solid;
     box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
@@ -152,7 +152,7 @@ const ke = ({
   var e;
   return (e = t.theme.fonts) == null ? void 0 : e.normal;
 }};
-`, ot = d.div`
+`, lt = d.div`
     padding: ${(t) => {
   var e;
   return (e = t.theme.sizes) == null ? void 0 : e.normal;
@@ -185,7 +185,7 @@ const ke = ({
   return (e = t.theme.sizes) == null ? void 0 : e.small;
 }};
     }
-`, st = d(Z)`
+`, ct = d(Z)`
     list-style: none;
     padding: 0;
     margin: 0;
@@ -220,28 +220,28 @@ const ke = ({
             }
         }
     }
-`, Vt = (i) => {
-  var o = i, {
+`, mt = (i) => {
+  var r = i, {
     trigger: t,
     className: e,
     children: a,
-    closeButtonAriaLabel: r
-  } = o, s = w(o, [
+    closeButtonAriaLabel: o
+  } = r, s = w(r, [
     "trigger",
     "className",
     "children",
     "closeButtonAriaLabel"
   ]);
   return /* @__PURE__ */ n.createElement(
-    ye,
+    $e,
     {
       className: z(e, "humany-dropdown-list"),
-      closeButtonAriaLabel: r,
+      closeButtonAriaLabel: o,
       trigger: t
     },
-    /* @__PURE__ */ n.createElement(it, y({}, s), a)
+    /* @__PURE__ */ n.createElement(dt, y({}, s), a)
   );
-}, it = d(O)`
+}, oa = mt, dt = d(O)`
     ${Y}
     font-family: ${(t) => {
   var e;
@@ -277,7 +277,7 @@ const ke = ({
             }
         }
     }
-`, lt = (t) => $`
+`, ut = (t) => $`
     ${t["data-loading"] && "position: relative;"};
     ${t["data-loading"] && "min-height: 150px;"}
     > * {
@@ -287,7 +287,7 @@ const ke = ({
     .humany-loader {
         opacity: ${t["data-loading"] ? "1" : "0"};
     }
-`, Kt = d(H)`
+`, ra = d(H)`
     && {
         font-size: ${(t) => {
   var e;
@@ -295,7 +295,7 @@ const ke = ({
 }};
     }
     width: 1.2em;
-`, qt = d($e)`
+`, sa = d(ve)`
     font-size: ${(t) => {
   var e;
   return (e = t.theme.fonts) == null ? void 0 : e.medium;
@@ -306,7 +306,7 @@ const ke = ({
   var e;
   return (e = t.theme.colors) == null ? void 0 : e.text;
 }};
-`, ct = d(te)`
+`, ft = d(te)`
     display: flex;
     align-items: center;
 
@@ -334,26 +334,26 @@ const ke = ({
         flex: 1;
         font-weight: 300;
     }
-`, mt = ({
+`, ht = ({
   addFavoriteTooltip: t,
   removeFavoriteCancelLabel: e,
   removeFavoriteConfirmLabel: a,
-  removeFavoriteHeader: r,
+  removeFavoriteHeader: o,
   removeFavoriteLabel: s,
   removeFavoriteTooltip: i,
-  id: o,
+  id: r,
   isFavorite: c,
   guideTitle: m,
-  buttonLabel: f = "",
-  actions: { addFavorite: u, removeFavorite: l }
+  buttonLabel: u = "",
+  actions: { addFavorite: f, removeFavorite: l }
 }) => {
   const h = k(() => {
-    l(o);
-  }, [o, l]), S = k(() => {
-    u(o);
-  }, [o, u]), p = `${c ? i : t}${m ? `: "${m}"` : ""}`;
+    l(r);
+  }, [r, l]), S = k(() => {
+    f(r);
+  }, [r, f]), p = `${c ? i : t}${m ? `: "${m}"` : ""}`;
   return /* @__PURE__ */ n.createElement(n.Fragment, null, c ? /* @__PURE__ */ n.createElement(
-    Ve,
+    Ke,
     {
       trigger: /* @__PURE__ */ n.createElement(
         me,
@@ -362,7 +362,7 @@ const ke = ({
           title: p,
           "aria-label": p,
           "data-favorite": "true",
-          "data-has-label": f ? "true" : "false",
+          "data-has-label": u ? "true" : "false",
           "data-has-symbol": "true"
         },
         /* @__PURE__ */ n.createElement(
@@ -372,12 +372,12 @@ const ke = ({
             symbol: { type: "Svg", content: "star-empty" }
           }
         ),
-        f && /* @__PURE__ */ n.createElement(J, null, f)
+        u && /* @__PURE__ */ n.createElement(J, null, u)
       ),
       onConfirm: h,
       cancelLabel: e,
       confirmLabel: a,
-      header: r,
+      header: o,
       text: s
     }
   ) : /* @__PURE__ */ n.createElement(
@@ -388,13 +388,13 @@ const ke = ({
       "aria-label": p,
       onClick: S,
       "data-favorite": "false",
-      "data-has-label": f ? "true" : "false",
+      "data-has-label": u ? "true" : "false",
       "data-has-symbol": "true"
     },
     /* @__PURE__ */ n.createElement(N, { size: 16, symbol: { type: "Svg", content: "star-empty" } }),
-    f && /* @__PURE__ */ n.createElement(J, null, f)
+    u && /* @__PURE__ */ n.createElement(J, null, u)
   ));
-}, me = d(ct)`
+}, gt = ht, me = d(ft)`
     grid-area: favorite;
 
     &:focus-visible {
@@ -419,13 +419,13 @@ const ke = ({
     }
 
     ${(t) => {
-  var e, a, r, s, i, o, c;
+  var e, a, o, s, i, r, c;
   return ((e = t.theme.colors) == null ? void 0 : e.text) && $`
             svg {
                 stroke: ${(a = t.theme.colors) == null ? void 0 : a.text};
 
                 path {
-                    stroke: ${(r = t.theme.colors) == null ? void 0 : r.text};
+                    stroke: ${(o = t.theme.colors) == null ? void 0 : o.text};
                 }
 
                 ${t["data-favorite"] === "true" && `
@@ -446,7 +446,7 @@ const ke = ({
             fill: transparent;
           }
         ` : `
-          fill: ${(o = t.theme.colors) == null ? void 0 : o.text};
+          fill: ${(r = t.theme.colors) == null ? void 0 : r.text};
 
           path {
             fill: ${(c = t.theme.colors) == null ? void 0 : c.text};
@@ -456,18 +456,18 @@ const ke = ({
             }
         `;
 }}
-`, Gt = _(
-  (f, m) => {
-    var u = f, {
+`, ia = _(
+  (u, m) => {
+    var f = u, {
       onFeedback: t = () => {
       },
       direction: e = "horizontal",
       className: a,
-      header: r,
+      header: o,
       positive: s,
       negative: i,
-      selected: o
-    } = u, c = w(u, [
+      selected: r
+    } = f, c = w(f, [
       "onFeedback",
       "direction",
       "className",
@@ -477,21 +477,21 @@ const ke = ({
       "selected"
     ]);
     return /* @__PURE__ */ n.createElement(
-      ft,
+      yt,
       E(y({
         className: z(a, "humany-feedback"),
         "data-direction": e
-      }, ve(c)), {
+      }, xe(c)), {
         ref: m
       }),
-      !!r && /* @__PURE__ */ n.createElement(dt, null, r),
+      !!o && /* @__PURE__ */ n.createElement(pt, null, o),
       /* @__PURE__ */ n.createElement(
         de,
         {
           className: "humany-feedback-button",
-          disabled: !!o,
-          "aria-pressed": o === "positive",
-          "data-selected": o === "positive",
+          disabled: !!r,
+          "aria-pressed": r === "positive",
+          "data-selected": r === "positive",
           "data-direction": e,
           onClick: () => t("positive")
         },
@@ -502,9 +502,9 @@ const ke = ({
         de,
         {
           className: "humany-feedback-button",
-          disabled: !!o,
-          "aria-pressed": o === "negative",
-          "data-selected": o === "negative",
+          disabled: !!r,
+          "aria-pressed": r === "negative",
+          "data-selected": r === "negative",
           "data-direction": e,
           onClick: () => t("negative")
         },
@@ -513,7 +513,7 @@ const ke = ({
       )
     );
   }
-), dt = d(J)`
+), pt = d(J)`
     font-weight: normal;
     margin: 0 0 ${(t) => {
   var e;
@@ -552,7 +552,7 @@ const ke = ({
 
   ${(t) => {
   var e, a;
-  return ((e = t.theme.colors) == null ? void 0 : e.primary) && pe({
+  return ((e = t.theme.colors) == null ? void 0 : e.primary) && ye({
     active: t["data-selected"],
     primaryColor: (a = t.theme.colors) == null ? void 0 : a.primary,
     secondaryColor: "#FFFFFF",
@@ -566,7 +566,7 @@ const ke = ({
   return (e = t.theme.sizes) == null ? void 0 : e.small;
 }} 0 0;
     }
-`, ft = d.div`
+`, yt = d.div`
     ${(t) => {
   var e;
   return t["data-direction"] === "vertical" && $`
@@ -578,16 +578,16 @@ const ke = ({
             }
         `;
 }}
-`, Ut = () => {
-  const [t, e] = A(null), a = W("ArrowLeft"), r = W("ArrowRight"), s = W("ArrowUp"), i = W("ArrowDown");
-  return V(() => {
-    e(a ? "left" : r ? "right" : s ? "up" : i ? "down" : null);
-  }, [a, r, s, i]), t;
-}, Jt = (t, e) => {
-  const [a, r] = A(t), s = k(() => setTimeout(() => {
-    r(t);
-  }, e), [e, r, t]);
-  return V(
+`, $t = () => {
+  const [t, e] = T(null), a = W("ArrowLeft"), o = W("ArrowRight"), s = W("ArrowUp"), i = W("ArrowDown");
+  return K(() => {
+    e(a ? "left" : o ? "right" : s ? "up" : i ? "down" : null);
+  }, [a, o, s, i]), t;
+}, la = $t, vt = (t, e) => {
+  const [a, o] = T(t), s = k(() => setTimeout(() => {
+    o(t);
+  }, e), [e, o, t]);
+  return K(
     () => {
       const i = s();
       return () => {
@@ -596,70 +596,70 @@ const ke = ({
     },
     [s]
   ), a;
-}, ut = () => {
-  const t = Ke(), [e, a] = A([]), r = t.get("favorites");
-  V(() => {
-    if (r) {
-      a(r.get());
+}, ca = vt, xt = () => {
+  const t = Ve(), [e, a] = T([]), o = t.get("favorites");
+  K(() => {
+    if (o) {
+      a(o.get());
       const { events: m } = t.get("$widget");
-      return m.subscribe("widget:favorites-updated", (u, { updated: l }) => {
+      return m.subscribe("widget:favorites-updated", (f, { updated: l }) => {
         a([...l]);
       });
     }
   }, []);
-  const s = (m) => r ? r.add(m) : Promise.resolve([]), i = (m) => r ? r.remove(m) : Promise.resolve([]), o = () => r ? r.clear() : Promise.resolve([]), c = k(
+  const s = (m) => o ? o.add(m) : Promise.resolve([]), i = (m) => o ? o.remove(m) : Promise.resolve([]), r = () => o ? o.clear() : Promise.resolve([]), c = k(
     (m) => e.indexOf(m) > -1 ? i(m) : s(m),
     [e]
   );
   return [
     e,
-    et(
+    Ze(
       () => ({
         addFavorite: s,
         removeFavorite: i,
-        clearFavorites: o,
+        clearFavorites: r,
         toggleFavorite: c
       }),
       [e]
     )
   ];
-}, Qt = () => {
-  const [t, e] = A(!1), a = we(), r = k(() => e(!0), [e]), s = k(() => e(!1), [e]);
-  return le("mouseenter", r, a.current), le("mouseleave", s, a.current), [t, a];
-}, ht = ({
+}, bt = xt, ma = () => {
+  const [t, e] = T(!1), a = Ee(), o = k(() => e(!0), [e]), s = k(() => e(!1), [e]);
+  return le("mouseenter", o, a.current), le("mouseleave", s, a.current), [t, a];
+}, wt = ({
   format: t = be.YYYY_MM_DD_HH_MM,
   className: e = "",
   byLabel: a = "",
-  modifiedLabel: r = "",
+  modifiedLabel: o = "",
   publishedLabel: s = "",
   modifiedBy: i = "",
-  publishedBy: o = "",
+  publishedBy: r = "",
   showModified: c = !1,
   showPublished: m = !1,
-  modified: f,
-  published: u
+  modified: u,
+  published: f
 }) => {
-  const l = m && u ? /* @__PURE__ */ n.createElement(fe, { format: t, timestamp: u }) : null, h = c && f ? /* @__PURE__ */ n.createElement(fe, { format: t, timestamp: f }) : null;
-  return !l && !h ? null : /* @__PURE__ */ n.createElement(U, { className: z(e, "humany-metadata") }, l && /* @__PURE__ */ n.createElement(U, { className: "humany-published" }, s, l, a && o && ` ${a.replace("{{editor}}", o)}`), h && /* @__PURE__ */ n.createElement(U, { className: "humany-modified" }, l && ", ", r, h, a && i && ` ${a.replace("{{editor}}", i)}`));
-}, fe = d(xe)`
+  const l = m && f ? /* @__PURE__ */ n.createElement(ue, { format: t, timestamp: f }) : null, h = c && u ? /* @__PURE__ */ n.createElement(ue, { format: t, timestamp: u }) : null;
+  return !l && !h ? null : /* @__PURE__ */ n.createElement(U, { className: z(e, "humany-metadata") }, l && /* @__PURE__ */ n.createElement(U, { className: "humany-published" }, s, l, a && r && ` ${a.replace("{{editor}}", r)}`), h && /* @__PURE__ */ n.createElement(U, { className: "humany-modified" }, l && ", ", o, h, a && i && ` ${a.replace("{{editor}}", i)}`));
+}, Et = wt, ue = d(we)`
     &:not(:first-child) {
         margin-left: 4px;
     }
     &:not(:last-child) {
         margin-right: 4px;
     }
-`, U = d($e)`
+`, U = d(ve)`
     font-style: italic;
-`, gt = ({ tags: t }) => t.filter((e) => e.symbol).length ? /* @__PURE__ */ n.createElement(
-  $t,
+`, kt = ({ tags: t }) => t.filter((e) => e.symbol).length ? /* @__PURE__ */ n.createElement(
+  Nt,
   {
     className: "humany-guide-list-tags",
     items: t,
-    renderItem: ({ id: e, symbol: a, title: r }) => a && /* @__PURE__ */ n.createElement("li", { key: e, "data-tag": e }, /* @__PURE__ */ n.createElement(vt, { size: 18, symbol: a, title: r }))
+    renderItem: ({ id: e, symbol: a, title: o }) => a && /* @__PURE__ */ n.createElement("li", { key: e, "data-tag": e }, /* @__PURE__ */ n.createElement(Lt, { size: 18, symbol: a, title: o }))
   }
-) : null, Xt = _(({ title: t, id: e, route: a, symbolSize: r, collapseUri: s, children: i }, o) => {
-  const { params: c } = he();
-  return /* @__PURE__ */ n.createElement(pt, { ref: o, "data-guide": e }, /* @__PURE__ */ n.createElement(
+) : null, da = _(({ title: t, id: e, route: a, symbolSize: o, collapseUri: s, children: i }, r) => {
+  const { params: c } = ge();
+  return /* @__PURE__ */ n.createElement(zt, { ref: r, "data-guide": e }, /* @__PURE__ */ n.createElement(
     Q,
     {
       title: t,
@@ -673,9 +673,9 @@ const ke = ({
       })),
       text: t
     },
-    /* @__PURE__ */ n.createElement(N, { size: r, symbol: { type: "Svg", content: "caret-up" } })
+    /* @__PURE__ */ n.createElement(N, { size: o, symbol: { type: "Svg", content: "caret-up" } })
   ), i);
-}), pt = d.li`
+}), zt = d.li`
     > a {
         grid-column: 1/-1;
         font-weight: bold;
@@ -688,21 +688,21 @@ const ke = ({
     > div {
         grid-column: 1/-1;
     }
-`, Zt = _(
-  (Mt, Ie) => {
-    var ae = Mt, {
+`, ua = _(
+  (Gt, Fe) => {
+    var ae = Gt, {
       expandable: t = !1,
       routing: e = {},
       paramMappers: a = {},
-      symbolSize: r = 11,
+      symbolSize: o = 11,
       pageRole: s = "link",
       pageCaret: i = "down",
-      showTags: o = !1,
+      showTags: r = !1,
       showFavoriteToggle: c = !1,
       localPaging: m = !1,
-      onItemClick: f = () => {
+      onItemClick: u = () => {
       },
-      dispatch: u = () => {
+      dispatch: f = () => {
       },
       metadata: l = {},
       pageLabel: h,
@@ -716,7 +716,7 @@ const ke = ({
       removeFavoriteHeader: Se,
       removeFavoriteLabel: Ne,
       removeFavoriteTooltip: Le
-    } = ae, Fe = w(ae, [
+    } = ae, De = w(ae, [
       "expandable",
       "routing",
       "paramMappers",
@@ -741,19 +741,19 @@ const ke = ({
       "removeFavoriteLabel",
       "removeFavoriteTooltip"
     ]);
-    const K = qe(), I = we(), T = Ge(x), { guide: Te = "guide", page: De = "index" } = e, {
-      guide: Ae = ({ id: g }) => j({ guide: g }),
+    const V = qe(), F = Ee(), I = Ge(x), { guide: Ie = "guide", page: Ae = "index" } = e, {
+      guide: Te = ({ id: g }) => j({ guide: g }),
       page: ne = () => j()
-    } = a, [Ce, Me] = ut();
-    tt(Ie, () => I.current);
+    } = a, [Ce, Me] = bt();
+    et(Fe, () => F.current);
     const q = (g) => {
-      const { id: b, title: v, tags: F, published: P, modified: D, publishedBy: B, modifiedBy: G } = g;
+      const { id: b, title: v, tags: D, published: P, modified: A, publishedBy: B, modifiedBy: G } = g;
       return /* @__PURE__ */ n.createElement(
         "li",
         {
           key: b,
           "data-guide": b,
-          "has-metadata": (!!(l != null && l.showPublished) && !!P || !!(l != null && l.showModified) && !!D).toString()
+          "has-metadata": (!!(l != null && l.showPublished) && !!P || !!(l != null && l.showModified) && !!A).toString()
         },
         /* @__PURE__ */ n.createElement(
           Q,
@@ -761,15 +761,15 @@ const ke = ({
             className: "humany-guide-link",
             title: v,
             "aria-label": v,
-            routeName: Te,
-            onClick: (We) => f(We, g),
-            params: Ae(g),
+            routeName: Ie,
+            onClick: (We) => u(We, g),
+            params: Te(g),
             text: v
           },
           /* @__PURE__ */ n.createElement(
             N,
             {
-              size: r,
+              size: o,
               symbol: {
                 type: "Svg",
                 content: t ? "caret-down" : "caret-right"
@@ -778,7 +778,7 @@ const ke = ({
           )
         ),
         c && /* @__PURE__ */ n.createElement(
-          mt,
+          gt,
           {
             guideTitle: v,
             addFavoriteTooltip: C,
@@ -792,12 +792,12 @@ const ke = ({
             id: b
           }
         ),
-        o && /* @__PURE__ */ n.createElement(gt, { tags: F }),
+        r && /* @__PURE__ */ n.createElement(kt, { tags: D }),
         /* @__PURE__ */ n.createElement(
-          xt,
+          Dt,
           E(y({}, l), {
-            indent: t ? void 0 : r,
-            modified: D,
+            indent: t ? void 0 : o,
+            modified: A,
             published: P,
             publishedBy: B,
             modifiedBy: G
@@ -809,29 +809,29 @@ const ke = ({
       [L, q]
     ), Be = k(
       (g) => {
-        m && (g.preventDefault(), u("page", ne()));
+        m && (g.preventDefault(), f("page", ne()));
       },
-      [u, m]
+      [f, m]
     );
-    V(() => {
-      if (K && T && T.length < x.length && I.current) {
-        const g = I.current.querySelectorAll(".humany-guide-list > ul > li"), b = g[T.length];
-        if (g.length === x.length && T.length) {
-          const v = g[T.length];
+    K(() => {
+      if (V && I && I.length < x.length && F.current) {
+        const g = F.current.querySelectorAll(".humany-guide-list > ul > li"), b = g[I.length];
+        if (g.length === x.length && I.length) {
+          const v = g[I.length];
           if (v) {
-            const F = v.querySelector(
+            const D = v.querySelector(
               ".humany-guide-link"
             );
-            F && F.focus();
+            D && D.focus();
           }
         } else
-          b && new MutationObserver((F, P) => {
-            F.forEach((D) => {
-              if (D.addedNodes) {
+          b && new MutationObserver((D, P) => {
+            D.forEach((A) => {
+              if (A.addedNodes) {
                 const B = Array.from(
-                  D.addedNodes
+                  A.addedNodes
                 ).find((G) => G.tagName === "A");
-                B && Ze(I.current, document.activeElement) && (K && B.focus(), P.disconnect());
+                B && tt(F.current, document.activeElement) && (V && B.focus(), P.disconnect());
               }
             });
           }).observe(b, {
@@ -848,17 +848,17 @@ const ke = ({
       (g) => typeof l[g] != "undefined"
     ).length;
     return /* @__PURE__ */ n.createElement(
-      yt,
+      St,
       E(y({
         className: z(S, "humany-guide-list"),
         "data-item-count": x.length,
         items: x,
         renderItem: Pe,
-        isTabbing: K,
+        isTabbing: V,
         expandable: t ? "true" : "false",
-        "grid-items": o || c || Re ? "true" : "false"
-      }, ve(Fe)), {
-        ref: I
+        "grid-items": r || c || Re ? "true" : "false"
+      }, xe(De)), {
+        ref: F
       }),
       h ? /* @__PURE__ */ n.createElement(
         Q,
@@ -866,7 +866,7 @@ const ke = ({
           text: h,
           title: h,
           "aria-label": h,
-          routeName: De,
+          routeName: Ae,
           role: s,
           params: ne(),
           onClick: Be
@@ -874,7 +874,7 @@ const ke = ({
         /* @__PURE__ */ n.createElement(
           N,
           {
-            size: r,
+            size: o,
             symbol: { type: "Svg", content: `caret-${i}` }
           }
         )
@@ -882,7 +882,7 @@ const ke = ({
       p
     );
   }
-), yt = d(O)`
+), St = d(O)`
     ${Y}
     padding: ${(t) => {
   var e;
@@ -1033,8 +1033,8 @@ const ke = ({
             text-decoration: underline;
         }
     }
-`, $t = d(Z)`
-    ${ge}
+`, Nt = d(Z)`
+    ${pe}
     display: flex;
     margin: 0 0 0 auto;
     grid-area: tags;
@@ -1049,7 +1049,7 @@ const ke = ({
         align-items: center;
         justify-content: space-between;
     }
-`, vt = d(N)`
+`, Lt = d(N)`
     display: block;
     color: ${(t) => {
   var e;
@@ -1066,7 +1066,7 @@ const ke = ({
         font-size: ${t.size}px;
       `;
 }}
-`, xt = d(ht)`
+`, Dt = d(Et)`
     grid-area: metadata;
     text-overflow: ellipsis;
     overflow: hidden;
@@ -1078,11 +1078,11 @@ const ke = ({
   var e;
   return typeof t.indent == "number" && `text-indent: calc(${(e = t.theme.sizes) == null ? void 0 : e.small} * 2 + ${t.indent}px);`;
 }}
-`, bt = Ee`
+`, Ft = he`
   100% {
     transform: rotate(360deg);
   }
-`, wt = Ee`
+`, It = he`
   0% {
     stroke-dasharray: 1, 200;
     stroke-dashoffset: 0;
@@ -1095,8 +1095,8 @@ const ke = ({
     stroke-dasharray: 89, 200;
     stroke-dashoffset: -124px;
   }
-`, Et = d.svg`
-    animation: ${bt} 2s linear infinite;
+`, At = d.svg`
+    animation: ${Ft} 2s linear infinite;
     height: 100%;
     transform-origin: center center;
     width: 100%;
@@ -1107,7 +1107,7 @@ const ke = ({
     right: 0;
     margin: auto;
     transition: 200ms ease-out opacity;
-`, kt = d.div`
+`, Tt = d.div`
     position: absolute;
     top: 0;
     bottom: 0;
@@ -1126,7 +1126,7 @@ const ke = ({
     .humany-spinner-svg {
         opacity: ${(t) => t["data-loading"] ? "1" : "0"};
     }
-`, zt = d.div`
+`, Ct = d.div`
     position: relative;
     margin: 0 auto;
     width: 100px;
@@ -1135,18 +1135,18 @@ const ke = ({
         display: block;
         padding-top: 100%;
     }
-`, St = d.circle`
+`, Mt = d.circle`
     stroke-dasharray: 1, 200;
     stroke-dashoffset: 0;
-    animation: ${wt} 1.5s ease-in-out infinite;
+    animation: ${It} 1.5s ease-in-out infinite;
     stroke-linecap: round;
     stroke: ${(t) => {
   var e;
   return (e = t.theme.colors) == null ? void 0 : e.primary;
 }};
     stroke-width: 2px;
-`, Nt = ({ loading: t = !1 }) => /* @__PURE__ */ n.createElement(kt, { className: "humany-loader", "data-loading": t }, /* @__PURE__ */ n.createElement(zt, { className: "humany-spinner" }, /* @__PURE__ */ n.createElement(Et, { className: "humany-spinner-svg", viewBox: "25 25 50 50" }, /* @__PURE__ */ n.createElement(
-  St,
+`, Pt = ({ loading: t = !1 }) => /* @__PURE__ */ n.createElement(Tt, { className: "humany-loader", "data-loading": t }, /* @__PURE__ */ n.createElement(Ct, { className: "humany-spinner" }, /* @__PURE__ */ n.createElement(At, { className: "humany-spinner-svg", viewBox: "25 25 50 50" }, /* @__PURE__ */ n.createElement(
+  Mt,
   {
     cx: "50",
     cy: "50",
@@ -1155,44 +1155,44 @@ const ke = ({
     "stroke-width": "2",
     "stroke-miterlimit": "10"
   }
-)))), ea = (i) => {
-  var o = i, {
+)))), Bt = Pt, Rt = (i) => {
+  var r = i, {
     className: t,
     showHeader: e,
     notificationList: a,
-    loading: r
-  } = o, s = w(o, [
+    loading: o
+  } = r, s = w(r, [
     "className",
     "showHeader",
     "notificationList",
     "loading"
   ]);
-  const [c, m] = A(null), {
-    id: f,
-    title: u,
+  const [c, m] = T(null), {
+    id: u,
+    title: f,
     symbol: l,
     notifications: h = [],
     defaultHeaderOptions: S = { visible: !0 }
   } = a || {};
-  return !h.length && !r ? null : /* @__PURE__ */ n.createElement(
-    Ft,
+  return !h.length && !o ? null : /* @__PURE__ */ n.createElement(
+    Ht,
     E(y({}, s), {
-      "data-loading": r,
+      "data-loading": o,
       "data-show-header": typeof e == "boolean" ? e : S.visible,
       className: z(t, "humany-notification-list"),
-      "data-notification-category": f,
-      header: u,
+      "data-notification-category": u,
+      header: f,
       symbol: l,
       items: h,
       renderItem: ({ id: p, title: x, body: L, modified: C, expandable: M }) => /* @__PURE__ */ n.createElement(
-        It,
+        jt,
         {
           key: p,
           "data-notification": p,
           "data-expanded": M ? c === p : !0
         },
         M ? /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(
-          Lt,
+          Wt,
           {
             title: x,
             "aria-label": x,
@@ -1201,7 +1201,7 @@ const ke = ({
           },
           /* @__PURE__ */ n.createElement("span", null, x),
           /* @__PURE__ */ n.createElement(
-            Tt,
+            Ot,
             {
               size: 11,
               symbol: {
@@ -1210,18 +1210,18 @@ const ke = ({
               }
             }
           )
-        ), /* @__PURE__ */ n.createElement(ue, { html: L }), C && /* @__PURE__ */ n.createElement(
-          Dt,
+        ), /* @__PURE__ */ n.createElement(fe, { html: L }), C && /* @__PURE__ */ n.createElement(
+          Yt,
           {
             format: be.YYYY_MM_DD,
             timestamp: C
           }
-        )) : /* @__PURE__ */ n.createElement(ue, { html: L })
+        )) : /* @__PURE__ */ n.createElement(fe, { html: L })
       )
     }),
-    /* @__PURE__ */ n.createElement(Nt, { loading: r })
+    /* @__PURE__ */ n.createElement(Bt, { loading: o })
   );
-}, Lt = d(te)`
+}, Wt = d(te)`
     display: flex;
     justify-content: space-between;
     align-items: center;
@@ -1258,8 +1258,8 @@ const ke = ({
             text-decoration: underline;
         }
     }
-`, Ft = d(O)`
-    ${lt}
+`, Ht = d(O)`
+    ${ut}
     ${Y}
   overflow: hidden;
     justify-content: flex-start;
@@ -1283,21 +1283,21 @@ const ke = ({
             text-decoration: underline;
         }
     }
-`, ue = d(Ue)`
+`, fe = d(Ue)`
     ${Je}
     font-weight: 300;
 
     p {
         white-space: normal;
     }
-`, It = d.li`
+`, jt = d.li`
     .humany-paragraph {
         display: none;
         &:not(:only-child) {
             ${(t) => {
-  var e, a, r;
+  var e, a, o;
   return ((e = t.theme.sizes) == null ? void 0 : e.cardinal) && ((a = t.theme.sizes) == null ? void 0 : a.normal) && $`
-                    margin: ${(r = t.theme.sizes) == null ? void 0 : r.normal} 0;
+                    margin: ${(o = t.theme.sizes) == null ? void 0 : o.normal} 0;
                 `;
 }}
         }
@@ -1317,7 +1317,7 @@ const ke = ({
   return (e = t.theme.colors) == null ? void 0 : e.accent;
 }};
     }
-`, Tt = d(N)`
+`, Ot = d(N)`
     margin: 0 0 0 ${(t) => {
   var e;
   return (e = t.theme.sizes) == null ? void 0 : e.small;
@@ -1328,62 +1328,62 @@ const ke = ({
   return (e = t.theme.colors) == null ? void 0 : e.primary;
 }};
     }
-`, Dt = d(xe)`
+`, Yt = d(we)`
     font-size: ${(t) => {
   var e;
   return (e = t.theme.fonts) == null ? void 0 : e.small;
 }};
     font-weight: 300;
-`, At = (t) => new RegExp("^#", "i").test(t), Ct = (t) => (r) => {
-  var s = r, { children: e } = s, a = w(s, ["children"]);
+`, fa = Rt, _t = (t) => new RegExp("^#", "i").test(t), Kt = (t) => (o) => {
+  var s = o, { children: e } = s, a = w(s, ["children"]);
   const {
     implementation: i,
-    name: o
+    name: r
   } = t.get("$widget"), { href: c = "" } = a;
-  if (At(c))
+  if (_t(c))
     return /* @__PURE__ */ n.createElement(Qe, { smooth: !0, to: c }, e);
-  const m = i.bindings.map((l) => l.replace(/\./g, "\\.")).join("|"), u = new RegExp(`^((http[s]?:)?//)?(${m})/([^\\s]+)`).exec(c);
-  if (u && u.length >= 4) {
-    const l = u[4];
-    if (i.widgets.get(l) && !l.startsWith("blob?") && !l.startsWith(o))
+  const m = i.bindings.map((l) => l.replace(/\./g, "\\.")).join("|"), f = new RegExp(`^((http[s]?:)?//)?(${m})/([^\\s]+)`).exec(c);
+  if (f && f.length >= 4) {
+    const l = f[4];
+    if (i.widgets.get(l) && !l.startsWith("blob?") && !l.startsWith(r))
       return /* @__PURE__ */ n.createElement(Xe, { widgetName: l }, e);
   }
   return /* @__PURE__ */ n.createElement("a", y({}, a), e);
-}, ta = (t, e = []) => ({
+}, Vt = Kt, qt = (t, e = []) => ({
   transform: {
     a: (a) => {
-      const c = a, { children: r } = c, i = w(c, ["children"])["data-target"];
+      const c = a, { children: o } = c, i = w(c, ["children"])["data-target"];
       if (i && e.length) {
-        const m = e.find(({ connection: f }) => f === i);
+        const m = e.find(({ connection: u }) => u === i);
         if (m)
-          return /* @__PURE__ */ n.createElement(ke, y({}, m), r);
+          return /* @__PURE__ */ n.createElement(ke, y({}, m), o);
       }
-      return Ct(t)(a);
+      return Vt(t)(a);
     }
   }
-});
+}), ha = qt;
 export {
-  Xt as AccordionListItem,
+  da as AccordionListItem,
   ke as DialogLink,
-  Ot as DialogList,
-  Yt as DrawerList,
-  _t as DropdownActions,
-  Vt as DropdownList,
-  mt as FavoriteButton,
-  Gt as Feedback,
-  Zt as GuideList,
-  Nt as Loader,
-  kt as LoaderWrapper,
-  ht as Metadata,
-  ea as NotificationList,
-  Kt as SmallCaret,
-  qt as StyledHeaderText,
-  ct as StyledListButton,
-  ta as guideRenderInstructions,
-  lt as loadingOpacity,
-  Ut as useArrowKeys,
-  Jt as useDebounce,
-  ut as useFavorites,
-  Qt as useHover
+  ta as DialogList,
+  aa as DrawerList,
+  na as DropdownActions,
+  oa as DropdownList,
+  gt as FavoriteButton,
+  ia as Feedback,
+  ua as GuideList,
+  Bt as Loader,
+  Tt as LoaderWrapper,
+  Et as Metadata,
+  fa as NotificationList,
+  ra as SmallCaret,
+  sa as StyledHeaderText,
+  ft as StyledListButton,
+  ha as guideRenderInstructions,
+  ut as loadingOpacity,
+  la as useArrowKeys,
+  ca as useDebounce,
+  bt as useFavorites,
+  ma as useHover
 };
 //# sourceMappingURL=index.js.map