@telia-ace/knowledge-widget-components-guide 1.0.38-experimental.8 → 1.0.38

package/dist/guide.35a46def.js

@@ -0,0 +1,859 @@
+var be = Object.defineProperty, fe = Object.defineProperties;
+var ye = Object.getOwnPropertyDescriptors;
+var W = Object.getOwnPropertySymbols;
+var ee = Object.prototype.hasOwnProperty, te = Object.prototype.propertyIsEnumerable;
+var _ = (e, t, n) => t in e ? be(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, S = (e, t) => {
+  for (var n in t || (t = {}))
+    ee.call(t, n) && _(e, n, t[n]);
+  if (W)
+    for (var n of W(t))
+      te.call(t, n) && _(e, n, t[n]);
+  return e;
+}, D = (e, t) => fe(e, ye(t));
+var F = (e, t) => {
+  var n = {};
+  for (var o in e)
+    ee.call(e, o) && t.indexOf(o) < 0 && (n[o] = e[o]);
+  if (e != null && W)
+    for (var o of W(e))
+      t.indexOf(o) < 0 && te.call(e, o) && (n[o] = e[o]);
+  return n;
+};
+import { css as G } from "@emotion/react";
+import r from "@emotion/styled";
+import { ContactList as oe, contactLink as pe } from "@telia-ace/knowledge-widget-adapters";
+import { NotFound as $e, Component as Ee } from "@telia-ace/knowledge-widget-types-grid";
+import { useRouteData as q, List as ke, TextLink as le, paddedBorderTabStyle as re, Feedback as we, StyledHeaderText as xe, useDispatch as se, useProperties as J, useContainer as ie, Tooltip as Le, Text as K, SymbolBadge as O, StyledListButton as T, useFavorites as ze, StyledText as ne, FavoriteButton as Se, DrawerList as ce, DrawerAnimationType as me, DropdownList as de, useChildren as Be, Lightbox as Ne, DialogLink as Ce, embeddedLinkMapper as ve, createEmptyComponent as De, Loader as Re, loadingOpacity as Fe, Paragraph as Te, genericHtml as Oe, headingElement as Ie, DialogList as We, contentBox as He, Metadata as Pe, Button as Me, linkTabStyle as je } from "@telia-ace/knowledge-widget-ui";
+import { appendClassNames as H, buildCategoryTrail as Ae, createParams as Ve } from "@telia-ace/widget-utilities";
+import a, { useMemo as P, useState as Ge, useEffect as qe, useCallback as V, forwardRef as Je } from "react";
+import { PickerTypes as p } from "@telia-ace/knowledge-widget-core";
+const Ke = ({
+  className: e,
+  defaultAnswerVersionLabel: t,
+  guide: { perspective: n, perspectives: o },
+  availablePerspectives: u = []
+}) => {
+  const { name: c, params: l } = q(), h = P(() => !o || !u.length ? [] : u.filter(({ name: m }) => !!o[m]).map(({ name: m, title: d }) => ({ label: d, connection: o[m] })), [o, u]);
+  return /* @__PURE__ */ a.createElement(
+    Ue,
+    {
+      className: H(e, "humany-guide-answer-version-picker"),
+      items: h,
+      renderItem: (m) => {
+        const d = m.label === "Default" ? t : m.label, g = n === m.connection, b = g && (!l.connection || n === l.connection);
+        return /* @__PURE__ */ a.createElement("li", { key: m.connection, "data-version": m.connection }, /* @__PURE__ */ a.createElement(
+          Xe,
+          {
+            key: m.connection,
+            as: b ? "span" : void 0,
+            text: d,
+            routeName: c,
+            selected: g,
+            "aria-label": d,
+            title: d,
+            params: D(S({}, l), {
+              connection: m.connection
+            })
+          }
+        ));
+      }
+    }
+  );
+}, Qe = Ke, Ue = r(ke)`
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+
+    list-style: none;
+    padding: 0;
+    margin: 0;
+
+    li:not(:last-child) {
+        margin: 0 calc(${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.small;
+}} * 2) 0 0;
+    }
+
+    li > span {
+        cursor: default;
+    }
+`, Xe = r(le)`
+    font-weight: 300;
+    color: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
+}};
+    text-decoration: none;
+
+    ${(e) => e.selected && G`
+            font-weight: bold;
+            text-decoration: underline;
+        `}
+
+    &:focus-visible {
+        ${re};
+    }
+`, Ye = r(oe)`
+    border-top: ${(e) => e.theme.border};
+    ${(e) => e.backButtonShown === "true" && `border-bottom: ${e.theme.border};`}
+`, Ze = r(we)`
+    ${(e) => {
+  var t, n;
+  return `padding: ${(t = e.theme.sizes) == null ? void 0 : t.large} ${(n = e.theme.sizes) == null ? void 0 : n.large};`;
+}}
+`, _e = r(xe)`
+    ${(e) => {
+  var t, n;
+  return `padding: ${(t = e.theme.sizes) == null ? void 0 : t.large} ${(n = e.theme.sizes) == null ? void 0 : n.large};`;
+}}
+
+    display: block;
+    font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.normal;
+}};
+    font-weight: bold;
+`, et = ({ backButtonShown: e = !1, accordion: t = !1 }) => {
+  const n = se(), {
+    loading: o = !1,
+    dialog: u = [],
+    guide: c,
+    handoverContactMethods: l = [],
+    contactHeader: h,
+    showFeedback: m,
+    feedbackDirection: d = "horizontal",
+    feedbackRecognitionLabel: g,
+    feedbackGiven: b,
+    feedbackHeader: $,
+    positiveFeedbackLabel: E,
+    negativeFeedbackLabel: f,
+    contactFeedbackLabel: s
+  } = J();
+  return !m || !c || !c.allowFeedback || o && !b || u.length ? null : b && g && !l.length ? /* @__PURE__ */ a.createElement(_e, { accordion: t ? "true" : "false" }, g) : c.hasHandover && l.length ? /* @__PURE__ */ a.createElement(
+    Ye,
+    {
+      backButtonShown: e ? "true" : "false",
+      accordion: t ? "true" : "false",
+      header: h,
+      contactMethods: l,
+      dispatch: n
+    }
+  ) : /* @__PURE__ */ a.createElement(
+    Ze,
+    {
+      accordion: t ? "true" : "false",
+      positive: E,
+      negative: c.hasHandover ? s : f,
+      header: $,
+      selected: b,
+      onFeedback: (k) => n("feedback", k),
+      direction: d
+    }
+  );
+}, tt = et, nt = ({
+  guide: { categories: e = [] },
+  toolbar: { picker: t = p.NONE }
+}) => {
+  const [n, o] = Ge([]), u = ie();
+  return qe(() => {
+    Ae(
+      "index",
+      e.map((c) => c.toString()),
+      u
+    ).then((c) => {
+      o(c);
+    });
+  }, [e]), n.length ? /* @__PURE__ */ a.createElement(
+    Le,
+    {
+      className: "humany-guide-category-tooltip",
+      sticky: t === p.DRAWER,
+      content: /* @__PURE__ */ a.createElement(a.Fragment, null, n.map((c) => /* @__PURE__ */ a.createElement(
+        ot,
+        {
+          className: "humany-guide-category-trail",
+          key: c.map((l) => l.id).join(".")
+        },
+        c.map((l, h) => /* @__PURE__ */ a.createElement(
+          K,
+          {
+            className: "humany-guide-category-trail-segment",
+            key: l.id
+          },
+          l.symbol && h === 0 && /* @__PURE__ */ a.createElement(O, { size: 14, symbol: l.symbol }),
+          l.title,
+          h !== c.length - 1 && /* @__PURE__ */ a.createElement(lt, { className: "humany-category-separator" }, "/")
+        ))
+      )))
+    },
+    t === p.DRAWER ? /* @__PURE__ */ a.createElement(
+      T,
+      {
+        className: "humany-guide-category-tooltip-button",
+        "data-has-label": "false",
+        "data-has-symbol": "true"
+      },
+      /* @__PURE__ */ a.createElement(
+        ae,
+        {
+          size: 19,
+          symbol: { type: "Svg", content: "information" }
+        }
+      )
+    ) : /* @__PURE__ */ a.createElement(ae, { size: 19, symbol: { type: "Svg", content: "information" } })
+  ) : null;
+}, at = nt, ot = r.div`
+    i,
+    svg {
+        margin: 0 ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.small;
+}} 0 0;
+    }
+
+    &:not(:last-child) {
+        margin: 0 0 ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.small;
+}};
+    }
+`, lt = r(K)`
+    margin: 0 ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.small;
+}};
+`, ae = r(O)`
+    display: block;
+`, rt = ({
+  header: e,
+  tooltip: t,
+  printActionLabel: n,
+  copyActionLabel: o,
+  addFavoriteTooltip: u,
+  removeFavoriteCancelLabel: c,
+  removeFavoriteConfirmLabel: l,
+  removeFavoriteHeader: h,
+  removeFavoriteLabel: m,
+  removeFavoriteTooltip: d,
+  toolbarFunctionsCloseButtonAriaLabel: g,
+  allowCopy: b = !1,
+  allowPrint: $ = !1,
+  showFavoriteToggle: E = !1,
+  picker: f = p.NONE,
+  guide: s,
+  dispatch: k
+}) => {
+  const [B, C] = ze(), i = V(
+    (y) => {
+      s && k("copy", s);
+    },
+    [s, k]
+  ), L = V(() => {
+    s && k("print");
+  }, [s, k]), z = P(() => {
+    const { id: y, title: R } = s, v = [];
+    if (b && v.push({
+      type: "copy",
+      child: /* @__PURE__ */ a.createElement(
+        T,
+        {
+          "data-has-label": o ? "true" : "false",
+          "data-has-symbol": "true",
+          title: o,
+          "aria-label": n,
+          onClick: i
+        },
+        /* @__PURE__ */ a.createElement(A, { size: 16, symbol: { type: "Svg", content: "copy" } }),
+        o && /* @__PURE__ */ a.createElement(ne, null, o)
+      )
+    }), $ && v.push({
+      type: "print",
+      child: /* @__PURE__ */ a.createElement(
+        T,
+        {
+          "data-has-label": n ? "true" : "false",
+          "data-has-symbol": "true",
+          title: n,
+          "aria-label": n,
+          onClick: L
+        },
+        /* @__PURE__ */ a.createElement(A, { size: 16, symbol: { type: "Svg", content: "print" } }),
+        n && /* @__PURE__ */ a.createElement(ne, null, n)
+      )
+    }), E) {
+      const I = B.indexOf(y) > -1;
+      v.push({
+        type: "favorite",
+        child: /* @__PURE__ */ a.createElement(
+          Se,
+          {
+            id: y,
+            guideTitle: R,
+            isFavorite: I,
+            buttonLabel: I ? d : u,
+            addFavoriteTooltip: u,
+            removeFavoriteCancelLabel: c,
+            removeFavoriteConfirmLabel: l,
+            removeFavoriteHeader: h,
+            removeFavoriteLabel: m,
+            removeFavoriteTooltip: d,
+            actions: C
+          }
+        )
+      });
+    }
+    return v;
+  }, [
+    B,
+    s,
+    b,
+    $,
+    E,
+    n,
+    o,
+    u,
+    c,
+    l,
+    h,
+    m,
+    d
+  ]);
+  if (!z.length)
+    return null;
+  const w = /* @__PURE__ */ a.createElement(
+    ct,
+    {
+      tabIndex: 0,
+      title: t,
+      "data-has-symbol": "true",
+      "data-has-label": "false"
+    },
+    /* @__PURE__ */ a.createElement(A, { symbol: { type: "Svg", content: "options" }, size: 18 })
+  ), N = ({ type: y, child: R }) => /* @__PURE__ */ a.createElement("li", { key: y, "data-function-type": y }, R);
+  return f === p.DROPDOWN ? /* @__PURE__ */ a.createElement(
+    it,
+    {
+      className: "humany-guide-functions-dropdown-list",
+      header: e,
+      items: z,
+      trigger: w,
+      renderItem: N,
+      closeButtonAriaLabel: g
+    }
+  ) : f === p.DRAWER ? /* @__PURE__ */ a.createElement(
+    ce,
+    {
+      className: "humany-guide-functions-drawer-list",
+      animation: { type: me.SlideInBottom },
+      header: e,
+      items: z,
+      trigger: w,
+      renderItem: N,
+      closeButtonAriaLabel: g
+    }
+  ) : null;
+}, st = rt, A = r(O)`
+    circle {
+        fill: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
+}};
+    }
+
+    line,
+    path,
+    rect {
+        stroke: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
+}};
+    }
+`, it = r(de)`
+    display: block;
+    min-height: auto;
+`, ct = r(T)`
+    padding: calc(${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.small;
+}} * 2) 0;
+`, mt = (e, t) => {
+  var n;
+  return ((n = t.find((o) => o.id === e.id)) == null ? void 0 : n.label) || "";
+}, dt = (c) => {
+  var l = c, {
+    header: e,
+    tooltip: t,
+    picker: n = p.NONE,
+    guide: o
+  } = l, u = F(l, [
+    "header",
+    "tooltip",
+    "picker",
+    "guide"
+  ]);
+  const { name: h, params: m } = q(), d = P(() => Object.keys(o.translations || {}).reduce((E, f) => {
+    const s = {};
+    return s.key = f, s.id = (o.translations || {})[f], s.label = u[`${f}LanguageLabel`], (s.id || s.label) && E.push(s), E;
+  }, []), [o, u]);
+  if (!d.length)
+    return null;
+  const g = mt(o, d), b = /* @__PURE__ */ a.createElement(
+    ht,
+    {
+      tabIndex: 0,
+      title: t,
+      "data-has-symbol": "true",
+      "data-has-label": n === p.DROPDOWN && g ? "true" : "false"
+    },
+    n === p.DROPDOWN && /* @__PURE__ */ a.createElement(a.Fragment, null, g && /* @__PURE__ */ a.createElement(bt, null, g), /* @__PURE__ */ a.createElement(
+      ft,
+      {
+        symbol: { type: "Svg", content: "caret-down" },
+        size: 11
+      }
+    )),
+    n === p.DRAWER && /* @__PURE__ */ a.createElement(a.Fragment, null, /* @__PURE__ */ a.createElement(gt, { symbol: { type: "Svg", content: "language" }, size: 20 }))
+  ), $ = ({ label: E, key: f, id: s }) => /* @__PURE__ */ a.createElement("li", { key: f, "data-language": f }, /* @__PURE__ */ a.createElement(
+    pt,
+    {
+      tabIndex: 0,
+      text: E,
+      routeName: h,
+      selected: o.id === s,
+      params: Ve(D(S({}, m), {
+        connection: void 0,
+        guide: s
+      }))
+    }
+  ));
+  return n === p.DROPDOWN ? /* @__PURE__ */ a.createElement(
+    yt,
+    {
+      className: "humany-guide-languages-dropdown-list",
+      header: e,
+      items: d,
+      trigger: b,
+      renderItem: $
+    }
+  ) : n === p.DRAWER ? /* @__PURE__ */ a.createElement(
+    ce,
+    {
+      className: "humany-guide-languages-drawer-list",
+      animation: { type: me.SlideInBottom },
+      header: e,
+      items: d,
+      trigger: b,
+      renderItem: $
+    }
+  ) : null;
+}, ut = dt, ht = r(T)`
+    &&& {
+        margin: 0 ${(e) => {
+  var t;
+  return `calc(${(t = e.theme.sizes) == null ? void 0 : t.small} * 2)`;
+}} 0 0;
+    }
+`, gt = r(O)`
+    circle {
+        fill: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
+}};
+    }
+
+    line,
+    path,
+    rect {
+        stroke: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
+}};
+    }
+`, bt = r(K)`
+    margin: 0 ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.small;
+}} 0 0;
+    font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.normal;
+}};
+`, ft = r(O)`
+    align-self: flex-end;
+    stroke-width: 2px;
+    stroke-linecap: round;
+
+    && {
+        width: 0.6em;
+        height: 1em;
+    }
+    line {
+        stroke: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
+}};
+    }
+`, yt = r(de)`
+    display: block;
+    min-height: auto;
+`, pt = r(le)`
+    color: ${(e) => {
+  var t, n;
+  return e.selected ? (t = e.theme.colors) == null ? void 0 : t.primary : (n = e.theme.colors) == null ? void 0 : n.text;
+}};
+    ${(e) => e.selected && "font-weight: bold;"}
+
+    outline: none;
+    &:focus-visible {
+        ${re}
+        text-decoration: underline;
+    }
+`, $t = (e) => {
+  const {
+    allowCopy: t = !1,
+    allowPrint: n = !1,
+    guideCategories: o = !1,
+    language: u = !1,
+    showFavoriteToggle: c = !1,
+    picker: l = p.NONE
+  } = e;
+  return !t && !n && !u && !c && !o || l === p.NONE;
+}, Et = ({ className: e = "", dispatch: t }) => {
+  const y = J(), {
+    toolbarLanguageHeader: n,
+    toolbarFunctionsHeader: o,
+    toolbarLanguageTooltip: u,
+    toolbarFunctionsTooltip: c,
+    toolbarFunctionsCloseButtonAriaLabel: l,
+    printActionLabel: h,
+    copyActionLabel: m,
+    addFavoriteTooltip: d,
+    removeFavoriteCancelLabel: g,
+    removeFavoriteConfirmLabel: b,
+    removeFavoriteHeader: $,
+    removeFavoriteLabel: E,
+    removeFavoriteTooltip: f,
+    guide: s,
+    toolbar: k
+  } = y, B = F(y, [
+    "toolbarLanguageHeader",
+    "toolbarFunctionsHeader",
+    "toolbarLanguageTooltip",
+    "toolbarFunctionsTooltip",
+    "toolbarFunctionsCloseButtonAriaLabel",
+    "printActionLabel",
+    "copyActionLabel",
+    "addFavoriteTooltip",
+    "removeFavoriteCancelLabel",
+    "removeFavoriteConfirmLabel",
+    "removeFavoriteHeader",
+    "removeFavoriteLabel",
+    "removeFavoriteTooltip",
+    "guide",
+    "toolbar"
+  ]);
+  if (!s || !k || $t(k))
+    return null;
+  const { language: C, guideCategories: i, allowCopy: L, allowPrint: z, showFavoriteToggle: w, picker: N } = k;
+  return /* @__PURE__ */ a.createElement(wt, { className: H("humany-guide-toolbar", e) }, C && Object.keys(s.translations || {}).length > 1 && /* @__PURE__ */ a.createElement(
+    ut,
+    S({
+      guide: s,
+      header: n,
+      tooltip: u,
+      picker: N
+    }, B)
+  ), i && /* @__PURE__ */ a.createElement(at, { guide: s, toolbar: k }), (L || z || w) && /* @__PURE__ */ a.createElement(
+    st,
+    {
+      guide: s,
+      header: o,
+      tooltip: c,
+      printActionLabel: h,
+      copyActionLabel: m,
+      addFavoriteTooltip: d,
+      removeFavoriteCancelLabel: g,
+      removeFavoriteConfirmLabel: b,
+      removeFavoriteHeader: $,
+      removeFavoriteLabel: E,
+      removeFavoriteTooltip: f,
+      toolbarFunctionsCloseButtonAriaLabel: l,
+      allowCopy: L,
+      allowPrint: z,
+      showFavoriteToggle: w,
+      picker: N,
+      dispatch: t
+    }
+  ));
+}, kt = Et, wt = r.div`
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin: 0 0 0 auto;
+
+    > :not(:last-child) {
+        margin: 0 calc(${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.small;
+}} * 2) 0 0;
+    }
+`, Gt = Je(
+  (u, o) => {
+    var c = u, { className: e, accordion: t = !1 } = c, n = F(c, ["className", "accordion"]);
+    const {
+      loading: l = !1,
+      dialog: h = [],
+      contactMethods: m = [],
+      showHeader: d = !0,
+      showAnswerVersions: g = !1,
+      defaultAnswerVersionLabel: b = "Default",
+      backButtonLabel: $,
+      metadataByLabel: E,
+      metadataModifiedLabel: f,
+      metadataPublishedLabel: s,
+      availablePerspectives: k,
+      metadata: B,
+      toolbar: C,
+      guide: i,
+      error: L
+    } = J(), {
+      params: { connection: z }
+    } = q(), w = ie(), N = Be(), y = se(), R = P(() => ({
+      transform: {
+        img: (x) => /* @__PURE__ */ a.createElement(Ne, { attrs: x, htmlBody: (i == null ? void 0 : i.body) || "" }),
+        a: (x) => {
+          const Y = x, { children: he } = Y, X = F(Y, ["children"])["data-target"];
+          if (X && h.length) {
+            const Z = h.find(
+              ({ connection: ge }) => ge === X
+            );
+            if (Z)
+              return /* @__PURE__ */ a.createElement(Ce, S({}, Z), he);
+          }
+          return ve(w)(x);
+        }
+      }
+    }), [i, w, h]), v = V(() => {
+      y("back");
+    }, [y]);
+    if (!i && !L && !l)
+      return De(w, D(S({}, n), {
+        className: H(e, "humany-guide")
+      }));
+    const { id: I = "", title: Q = "", body: M = "", translations: U = {} } = i || {};
+    if (L && L.status === 404)
+      return /* @__PURE__ */ a.createElement($e, { showSearch: !1 });
+    const j = !!t && !!z, ue = Object.keys(U).find((x) => U[x] === `${I}`);
+    return /* @__PURE__ */ a.createElement(
+      xt,
+      D(S({
+        ref: o
+      }, n), {
+        "data-loading": l,
+        className: H(e, "humany-guide")
+      }),
+      /* @__PURE__ */ a.createElement(
+        Nt,
+        {
+          "data-loading": l,
+          accordion: t ? "true" : "false",
+          className: "humany-guide-content"
+        },
+        (g && i || !!C) && /* @__PURE__ */ a.createElement(Bt, { className: "humany-guide-top" }, g && i && /* @__PURE__ */ a.createElement(
+          Qe,
+          {
+            defaultAnswerVersionLabel: b,
+            availablePerspectives: k,
+            guide: i
+          }
+        ), !!C && /* @__PURE__ */ a.createElement(kt, { dispatch: y })),
+        !!(Q || M) && /* @__PURE__ */ a.createElement(
+          Lt,
+          {
+            className: "humany-guide-body",
+            accordion: t ? "true" : "false",
+            header: d && Q || void 0,
+            html: M,
+            htmlParseInstruction: R,
+            lang: ue
+          }
+        ),
+        h && M.indexOf("h-option-link") === -1 && /* @__PURE__ */ a.createElement(St, { dialog: h }),
+        /* @__PURE__ */ a.createElement(
+          zt,
+          {
+            backButtonShown: j ? "true" : "false",
+            contactMethods: m,
+            dispatch: y,
+            guideId: i && i.id
+          }
+        ),
+        !m.length && /* @__PURE__ */ a.createElement(tt, { backButtonShown: j, accordion: t }),
+        j && /* @__PURE__ */ a.createElement(Dt, { "aria-label": $, onClick: v }, /* @__PURE__ */ a.createElement(
+          Rt,
+          {
+            width: "7",
+            height: "13",
+            viewBox: "0 0 7 13",
+            fill: "none",
+            xmlns: "http://www.w3.org/2000/svg"
+          },
+          /* @__PURE__ */ a.createElement("line", { x1: "6.64645", y1: "12.5513", x2: "0.648357", y2: "6.55319" }),
+          /* @__PURE__ */ a.createElement("line", { x1: "0.646447", y1: "6.64455", x2: "6.64454", y2: "0.646465" })
+        ), $ && /* @__PURE__ */ a.createElement("span", null, $)),
+        B && /* @__PURE__ */ a.createElement(
+          Ct,
+          D(S({}, B), {
+            modified: i == null ? void 0 : i.modified,
+            published: i == null ? void 0 : i.published,
+            modifiedBy: i == null ? void 0 : i.modifiedBy,
+            publishedBy: i == null ? void 0 : i.publishedBy,
+            byLabel: E,
+            modifiedLabel: f,
+            publishedLabel: s
+          })
+        ),
+        N.map((x) => /* @__PURE__ */ a.createElement(
+          vt,
+          {
+            key: x.id,
+            id: x.id,
+            branch: "default",
+            embedded: !0
+          }
+        ))
+      ),
+      /* @__PURE__ */ a.createElement(Re, { loading: l })
+    );
+  }
+), xt = r.div`
+    ${Fe}
+    min-width: 0;
+`, Lt = r(Te)`
+    ${Oe}
+    ${(e) => {
+  var t;
+  return `padding: ${(t = e.theme.sizes) == null ? void 0 : t.large};`;
+}}
+  display: block;
+    line-height: 1.6em;
+
+    ${(e) => {
+  var t, n;
+  return Ie(e)(
+    "h1",
+    G`
+                font-size: ${(t = e.theme.fonts) == null ? void 0 : t.large};
+                font-weight: normal;
+                line-height: 1.6em;
+                line-height: 1.6em;
+                margin: 0 0 ${(n = e.theme.sizes) == null ? void 0 : n.small};
+            `
+  );
+}}
+
+    p {
+        font-weight: 300;
+        font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.normal;
+}};
+        color: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
+}};
+        a {
+            display: inline;
+        }
+    }
+`, zt = r(oe)`
+    border-top: ${(e) => e.theme.border};
+    ${(e) => e.backButtonShown === "true" && `border-bottom: ${e.theme.border};`}
+`, St = r(We)`
+    ${(e) => {
+  var t, n;
+  return `padding: 0 ${(t = e.theme.sizes) == null ? void 0 : t.large} ${(n = e.theme.sizes) == null ? void 0 : n.large};`;
+}}
+    display: block;
+`, Bt = r.div`
+    ${(e) => {
+  var t, n;
+  return `padding: calc(${(t = e.theme.sizes) == null ? void 0 : t.normal}*2) ${(n = e.theme.sizes) == null ? void 0 : n.large};`;
+}}
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border-bottom: ${(e) => e.theme.border};
+    border-radius: ${(e) => `${e.theme.borderRadius} ${e.theme.borderRadius}`} 0 0;
+    background-color: #ffffff;
+`, Nt = r.div`
+    ${He}
+    display: block;
+    > a {
+        ${pe}
+    }
+
+    ${(e) => e.accordion === "true" && G`
+            white-space: normal;
+            box-shadow: none;
+            background-color: #fafafa;
+        `}
+`, Ct = r(Pe)`
+    display: block;
+    ${(e) => {
+  var t, n;
+  return `padding: calc(${(t = e.theme.sizes) == null ? void 0 : t.normal}*2) ${(n = e.theme.sizes) == null ? void 0 : n.large};`;
+}}
+    font-weight: 300;
+    font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.normal;
+}};
+    color: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
+}};
+    border-top: ${(e) => e.theme.border};
+`, vt = r(Ee)`
+    border-top: ${(e) => e.theme.border};
+`, Dt = r(Me)`
+    ${(e) => {
+  var t, n;
+  return `padding: ${(t = e.theme.sizes) == null ? void 0 : t.normal} calc(${(n = e.theme.sizes) == null ? void 0 : n.normal} * 2);`;
+}}
+    color: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.primary;
+}};
+    text-decoration: underline;
+    font-size: ${(e) => {
+  var t;
+  return (t = e.theme.fonts) == null ? void 0 : t.normal;
+}};
+    span {
+        font-weight: 300;
+    }
+    &:focus-visible {
+        ${je}
+        padding: ${(e) => {
+  var t, n;
+  return `calc(${(t = e.theme.sizes) == null ? void 0 : t.small} / 2) ${(n = e.theme.sizes) == null ? void 0 : n.small}`;
+}};
+    }
+`, Rt = r.svg`
+    margin-right: ${(e) => {
+  var t;
+  return (t = e.theme.sizes) == null ? void 0 : t.small;
+}};
+    line {
+        stroke: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.primary;
+}};
+    }
+`;
+export {
+  Gt as default
+};
+//# sourceMappingURL=guide.35a46def.js.map