@telia-ace/knowledge-widget-components-guide 1.0.16 → 1.0.19

package/dist/guide.858ab7a6.js

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