@kong-ui-public/page-layout 1.3.0 → 1.3.1

package/dist/page-layout.es.js

@@ -1,4 +1,4 @@
-import { shallowRef as Ce, shallowReadonly as Be, getCurrentScope as Ne, onScopeDispose as Oe, toValue as te, watch as re, computed as w, getCurrentInstance as ze, onMounted as be, defineComponent as ue, inject as ee, useTemplateRef as se, ref as F, onBeforeUnmount as Ee, resolveComponent as R, openBlock as i, createElementBlock as d, createElementVNode as b, normalizeClass as j, Fragment as G, renderList as M, createBlock as D, resolveDynamicComponent as fe, mergeProps as Se, withKeys as Ae, withModifiers as le, withCtx as T, renderSlot as E, createTextVNode as X, toDisplayString as B, createVNode as N, unref as f, createCommentVNode as m, nextTick as pe, provide as Fe, onUnmounted as He, createSlots as ge, normalizeProps as xe, guardReactiveProps as We } from "vue";
+import { shallowRef as Ce, shallowReadonly as Be, getCurrentScope as ze, onScopeDispose as Ne, toValue as ae, watch as re, computed as w, getCurrentInstance as Oe, onMounted as be, defineComponent as ue, inject as te, useTemplateRef as se, ref as F, onBeforeUnmount as Ee, resolveComponent as R, openBlock as i, createElementBlock as d, createElementVNode as b, normalizeClass as j, Fragment as G, renderList as M, createBlock as D, resolveDynamicComponent as fe, mergeProps as Se, withKeys as Ae, withModifiers as le, withCtx as T, renderSlot as E, createTextVNode as X, toDisplayString as B, createVNode as z, unref as h, createCommentVNode as m, nextTick as pe, provide as Fe, onUnmounted as He, createSlots as ge, normalizeProps as xe, guardReactiveProps as We } from "vue";
 import { useRouter as De, useRoute as Me } from "vue-router";
 import { createI18n as Ve, i18nTComponent as je } from "@kong-ui-public/i18n";
 import { ChevronDownIcon as Re, ChevronRightIcon as Ge, ArrowTopLeftIcon as Ue, StarFillIcon as qe, StarIcon as Ye, InfoIcon as Ze } from "@kong/icons";
@@ -18,9 +18,9 @@ function at() {
 }
 const me = {
   useI18n: at
-}, ot = "12px", ae = "16px", nt = "2px", Le = "16px";
+}, ot = "12px", Q = "16px", nt = "2px", Le = "16px";
 function it(e, r) {
-  return Ne() ? (Oe(e, r), !0) : !1;
+  return ze() ? (Ne(e, r), !0) : !1;
 }
 const st = typeof window < "u" && typeof document < "u";
 typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
@@ -44,17 +44,17 @@ function lt(e, r) {
 }
 function rt(e, r = {}) {
   let a, o, l = J, c = J;
-  const v = Ce(!1), n = (h) => {
-    clearTimeout(h), l(), l = J;
+  const v = Ce(!1), n = (f) => {
+    clearTimeout(f), l(), l = J;
   };
   let y;
-  return Object.assign((h) => {
-    const p = te(e), I = te(r.maxWait);
-    return a && n(a), p <= 0 || I !== void 0 && I <= 0 ? (o && (n(o), o = void 0), v.value = !1, Promise.resolve(h())) : (v.value = !0, new Promise((S, g) => {
-      l = r.rejectOnCancel ? g : S, c = S, y = h, I && !o && (o = setTimeout(() => {
+  return Object.assign((f) => {
+    const p = ae(e), I = ae(r.maxWait);
+    return a && n(a), p <= 0 || I !== void 0 && I <= 0 ? (o && (n(o), o = void 0), v.value = !1, Promise.resolve(f())) : (v.value = !0, new Promise((S, g) => {
+      l = r.rejectOnCancel ? g : S, c = S, y = f, I && !o && (o = setTimeout(() => {
         a && n(a), o = void 0, v.value = !1, S(y());
       }, I)), a = setTimeout(() => {
-        o && n(o), o = void 0, v.value = !1, S(h());
+        o && n(o), o = void 0, v.value = !1, S(f());
       }, p);
     }));
   }, {
@@ -64,8 +64,8 @@ function rt(e, r = {}) {
     flush: () => {
       if (v.value) {
         a && (clearTimeout(a), a = void 0), o && (clearTimeout(o), o = void 0), v.value = !1;
-        const h = c;
-        l = J, c = J, h(y());
+        const f = c;
+        l = J, c = J, f(y());
       }
     },
     isPending: Be(v)
@@ -77,12 +77,12 @@ function ut(e, r = 200, a = {}) {
 const ct = st ? window : void 0;
 function Te(e) {
   var r;
-  const a = te(e);
+  const a = ae(e);
   return (r = a?.$el) !== null && r !== void 0 ? r : a;
 }
 // @__NO_SIDE_EFFECTS__
 function dt() {
-  const e = Ce(!1), r = ze();
+  const e = Ce(!1), r = Oe();
   return r && be(() => {
     e.value = !0;
   }, r), e;
@@ -98,12 +98,12 @@ function Pe(e, r, a = {}) {
   const v = /* @__PURE__ */ vt(() => o && "ResizeObserver" in o), n = () => {
     c && (c.disconnect(), c = void 0);
   }, y = re(w(() => {
-    const h = te(e);
-    return Array.isArray(h) ? h.map((p) => Te(p)) : [Te(h)];
-  }), (h) => {
+    const f = ae(e);
+    return Array.isArray(f) ? f.map((p) => Te(p)) : [Te(f)];
+  }), (f) => {
     if (n(), v.value && o) {
       c = new ResizeObserver(r);
-      for (const p of h) p && c.observe(p, l);
+      for (const p of f) p && c.observe(p, l);
     }
   }, {
     immediate: !0,
@@ -129,7 +129,7 @@ const ht = {
     tabs: { default: () => [] }
   },
   setup(e) {
-    const { i18n: { t: r } } = me.useI18n(), a = De(), o = ee("app:navigateTo", null), l = (g) => {
+    const { i18n: { t: r } } = me.useI18n(), a = De(), o = te("app:navigateTo", null), l = (g) => {
       if (typeof g.to != "string") {
         a.push(g.to);
         return;
@@ -139,19 +139,19 @@ const ht = {
         return;
       }
       o(g.to);
-    }, c = se("page-layout-tabs"), v = se("page-layout-tabs-list"), n = F(e.tabs.length), y = F(!1), k = w(() => e.tabs.slice(0, n.value)), h = w(() => e.tabs.slice(n.value)), p = async () => {
+    }, c = se("page-layout-tabs"), v = se("page-layout-tabs-list"), n = F(e.tabs.length), y = F(!1), k = w(() => e.tabs.slice(0, n.value)), f = w(() => e.tabs.slice(n.value)), p = async () => {
       if (!c.value || !v.value)
         return;
       y.value = !1, n.value = e.tabs.length, await pe();
       const g = c.value?.getBoundingClientRect().width - parseInt(Le) * 2;
-      let O = v.value?.getBoundingClientRect().width;
-      if (!g || !O) {
+      let N = v.value?.getBoundingClientRect().width;
+      if (!g || !N) {
         y.value = !0;
         return;
       }
       const P = 50;
-      for (; O + P > g && n.value > 1; )
-        n.value--, await pe(), O = v.value?.getBoundingClientRect().width || 0;
+      for (; N + P > g && n.value > 1; )
+        n.value--, await pe(), N = v.value?.getBoundingClientRect().width || 0;
       y.value = !0;
     };
     let I = null;
@@ -166,7 +166,7 @@ const ht = {
       I && clearTimeout(I);
     }), re(() => e.tabs, () => {
       p();
-    }, { deep: !0 }), (g, O) => {
+    }, { deep: !0 }), (g, N) => {
       const P = R("KDropdownItem"), H = R("KDropdown"), U = R("KSkeletonBox");
       return i(), d("nav", ht, [
         b("ul", {
@@ -181,8 +181,8 @@ const ht = {
               class: ["tab-link", { active: s.active }],
               "data-testid": s.dataTestId ? s.dataTestId : `page-layout-tab-${s.key}`,
               tabindex: "0",
-              onClick: le((z) => l(s), ["prevent"]),
-              onKeydown: Ae(le((z) => l(s), ["prevent"]), ["enter"])
+              onClick: le((O) => l(s), ["prevent"]),
+              onKeydown: Ae(le((O) => l(s), ["prevent"]), ["enter"])
             }), {
               default: T(() => [
                 E(g.$slots, `tab-${s.key}`, { tab: s }, () => [
@@ -193,12 +193,12 @@ const ht = {
             }, 1040, ["aria-current", "class", "data-testid", "onClick", "onKeydown"]))
           ]))), 128)),
           e.tabs.length > n.value ? (i(), d("li", ft, [
-            N(H, { "kpop-attributes": {
+            z(H, { "kpop-attributes": {
               placement: "bottom-end",
               popoverElementAttributes: { "data-testid": "tabs-overflow-dropdown-popover" }
             } }, {
               items: T(() => [
-                (i(!0), d(G, null, M(h.value, (s) => (i(), D(P, {
+                (i(!0), d(G, null, M(f.value, (s) => (i(), D(P, {
                   key: `${s.key}-dropdown-item`,
                   "aria-current": s.active ? "page" : void 0,
                   "data-testid": s.dataTestId ? s.dataTestId : `page-layout-tab-${s.key}`,
@@ -219,14 +219,14 @@ const ht = {
               ]),
               default: T(() => [
                 b("button", {
-                  "aria-label": f(r)("tabs.more_button.aria_label"),
-                  class: j(["tab-link", { active: h.value.find((s) => s.active) }]),
+                  "aria-label": h(r)("tabs.more_button.aria_label"),
+                  class: j(["tab-link", { active: f.value.find((s) => s.active) }]),
                   "data-testid": "tabs-overflow-dropdown-button"
                 }, [
-                  X(B(f(r)("tabs.more_button.label")) + " ", 1),
-                  N(f(Re), {
+                  X(B(h(r)("tabs.more_button.label")) + " ", 1),
+                  z(h(Re), {
                     decorative: "",
-                    size: `var(--kui-icon-size-30, ${f(ae)})`
+                    size: `var(--kui-icon-size-30, ${h(Q)})`
                   }, null, 8, ["size"])
                 ], 10, pt)
               ]),
@@ -235,7 +235,7 @@ const ht = {
           ])) : m("", !0)
         ], 2),
         y.value ? m("", !0) : (i(), d("div", gt, [
-          (i(), d(G, null, M(3, (s) => N(U, {
+          (i(), d(G, null, M(3, (s) => z(U, {
             key: `layout-loader-${s}`,
             height: "1",
             width: "5"
@@ -286,7 +286,7 @@ const ht = {
         hasTrailingEllipsis: x + $ < u,
         hasOverflowDropdown: !0
       };
-    }), h = (t) => t.dataTestId ?? `page-layout-anchor-${t.id.replace(/[^\w-]+/g, "-").replace(/^-+|-+$/g, "")}`, p = F(null), I = () => {
+    }), f = (t) => t.dataTestId ?? `page-layout-anchor-${t.id.replace(/[^\w-]+/g, "-").replace(/^-+|-+$/g, "")}`, p = F(null), I = () => {
       let t = a.value?.parentElement ?? null;
       for (; t; ) {
         const { overflowY: u } = getComputedStyle(t);
@@ -304,9 +304,9 @@ const ht = {
       } catch {
         return null;
       }
-    }, g = () => (a.value?.closest(".page-layout-header")?.getBoundingClientRect().height ?? 0) + parseInt(Le, 10), O = parseInt(ae, 10), P = parseInt(nt, 10), H = (t) => t * _e + 2 * O + $e + (t + 2) * P + he, U = () => _e + $e + P + he;
+    }, g = () => (a.value?.closest(".page-layout-header")?.getBoundingClientRect().height ?? 0) + parseInt(Le, 10), N = parseInt(Q, 10), P = parseInt(nt, 10), H = (t) => t * _e + 2 * N + $e + (t + 2) * P + he, U = () => _e + $e + P + he;
     let s = 0;
-    const z = async () => {
+    const O = async () => {
       if (!n.value.length) {
         l.value = "hidden";
         return;
@@ -320,7 +320,7 @@ const ht = {
     let V = null;
     Pe(a, () => {
       V && clearTimeout(V), V = setTimeout(() => {
-        Q(), z();
+        ee(), O();
       }, 150);
     });
     let q = null, Y = null;
@@ -340,7 +340,7 @@ const ht = {
         clientHeight: t ? t.clientHeight : window.innerHeight,
         scrollHeight: t ? t.scrollHeight : document.documentElement.scrollHeight
       };
-    }, Q = () => {
+    }, ee = () => {
       const { top: t, scrollTop: u, clientHeight: _, scrollHeight: $ } = de(), x = g(), C = [];
       let A = null, ne = null;
       for (const W of e.anchors) {
@@ -353,7 +353,7 @@ const ht = {
     let ve = !1;
     const ye = () => {
       ve || (ve = !0, requestAnimationFrame(() => {
-        ve = !1, Q() && z();
+        ve = !1, ee() && O();
       }));
     }, ke = (t) => {
       const u = S(t);
@@ -370,18 +370,18 @@ const ht = {
       u(), ke(t);
     };
     return be(() => {
-      p.value = I(), Z().addEventListener("scroll", ye, { passive: !0 }), Q(), z(), requestAnimationFrame(() => {
-        Q(), z();
+      p.value = I(), Z().addEventListener("scroll", ye, { passive: !0 }), ee(), O(), requestAnimationFrame(() => {
+        ee(), O();
       });
     }), Ee(() => {
       Z().removeEventListener("scroll", ye), L(), V && clearTimeout(V);
     }), re(() => e.anchors, () => {
-      e.anchors.some((t) => t.id === c.value) || (c.value = ""), Q(), z();
+      e.anchors.some((t) => t.id === c.value) || (c.value = ""), ee(), O();
     }, { deep: !0 }), (t, u) => {
       const _ = R("KButton"), $ = R("KDropdownItem"), x = R("KDropdown");
       return i(), d("nav", {
         ref: "page-layout-anchor-navigation",
-        "aria-label": f(r)("anchor_navigation.aria_label"),
+        "aria-label": h(r)("anchor_navigation.aria_label"),
         class: "page-layout-anchor-navigation",
         "data-fit": l.value,
         "data-testid": "page-layout-anchor-navigation"
@@ -397,7 +397,7 @@ const ht = {
             b("button", {
               "aria-current": C.id === c.value ? "location" : void 0,
               class: j(["anchor-link", { active: C.id === c.value }]),
-              "data-testid": h(C),
+              "data-testid": f(C),
               title: C.label,
               type: "button",
               onClick: (A) => ke(C)
@@ -405,7 +405,7 @@ const ht = {
           ]))), 128)),
           k.value.hasTrailingEllipsis ? (i(), d("li", Tt, " … ")) : m("", !0),
           k.value.hasOverflowDropdown ? (i(), d("li", _t, [
-            N(x, { "kpop-attributes": {
+            z(x, { "kpop-attributes": {
               placement: "bottom-end",
               popoverElementAttributes: { "data-testid": "anchor-navigation-overflow-dropdown-popover" }
             } }, {
@@ -413,7 +413,7 @@ const ht = {
                 (i(!0), d(G, null, M(n.value, (A) => (i(), D($, {
                   key: `${A.id}-dropdown-item`,
                   "aria-current": A.id === c.value ? "location" : void 0,
-                  "data-testid": h(A),
+                  "data-testid": f(A),
                   selected: A.id === c.value,
                   onClick: (ne) => Ke(A, C)
                 }, {
@@ -424,18 +424,18 @@ const ht = {
                 }, 1032, ["aria-current", "data-testid", "selected", "onClick"]))), 128))
               ]),
               default: T(() => [
-                N(_, {
+                z(_, {
                   appearance: "tertiary",
-                  "aria-label": f(r)("anchor_navigation.more_button.aria_label"),
+                  "aria-label": h(r)("anchor_navigation.more_button.aria_label"),
                   class: "anchor-overflow-button",
                   "data-testid": "anchor-navigation-overflow-dropdown-button",
                   icon: "",
                   size: "small"
                 }, {
                   default: T(() => [
-                    N(f(Re), {
+                    z(h(Re), {
                       decorative: "",
-                      size: `var(--kui-icon-size-30, ${f(ae)})`
+                      size: `var(--kui-icon-size-30, ${h(Q)})`
                     }, null, 8, ["size"])
                   ]),
                   _: 1
@@ -461,11 +461,11 @@ const ht = {
 }, Pt = ["aria-label"], Kt = {
   key: 3,
   class: "title-after-container"
-}, Bt = { class: "page-header-actions-container" }, Nt = {
+}, Bt = { class: "page-header-actions-container" }, zt = {
   key: 0,
   class: "page-layout-aside-container",
   "data-testid": "page-layout-aside"
-}, Ot = { class: "page-layout-content" }, zt = /* @__PURE__ */ ue({
+}, Nt = { class: "page-layout-content" }, Ot = /* @__PURE__ */ ue({
   __name: "PageLayout",
   props: {
     breadcrumbs: { default: () => [] },
@@ -476,7 +476,7 @@ const ht = {
     pageShortcutData: {}
   },
   setup(e) {
-    const r = ee("app:navigateTo", null), a = ee(Ct, null), o = ee("app:pageShortcutsContext", null), { i18n: { t: l } } = me.useI18n(), c = De(), v = Me(), n = w(() => !!(e.tabs && e.tabs.length)), y = w(() => typeof e.backTo == "string"), k = w(() => te(a) === !0), h = w(() => k.value && !n.value && !!(e.anchors && e.anchors.length)), p = w(() => !!e.pageShortcutData && !!e.pageShortcutData.entityType && !!e.pageShortcutData.label), I = w(() => p.value && !!o && "onFavoriteToggle" in o && typeof o.onFavoriteToggle == "function"), S = F(0), g = w(() => !!o && "isFavorite" in o && typeof o.isFavorite == "function" && o.isFavorite(e.pageShortcutData) === !0), O = async () => {
+    const r = te("app:navigateTo", null), a = te(Ct, null), o = te("app:pageShortcutsContext", null), { i18n: { t: l } } = me.useI18n(), c = De(), v = Me(), n = w(() => !!(e.tabs && e.tabs.length)), y = w(() => typeof e.backTo == "string"), k = w(() => ae(a) === !0), f = w(() => k.value && !n.value && !!(e.anchors && e.anchors.length)), p = w(() => !!e.pageShortcutData && !!e.pageShortcutData.entityType && !!e.pageShortcutData.label), I = w(() => p.value && !!o && "onFavoriteToggle" in o && typeof o.onFavoriteToggle == "function"), S = F(0), g = w(() => !!o && "isFavorite" in o && typeof o.isFavorite == "function" && o.isFavorite(e.pageShortcutData) === !0), N = async () => {
       if (e.backTo) {
         if (typeof e.backTo == "object") {
           c.push(e.backTo);
@@ -492,9 +492,9 @@ const ht = {
     Fe(Ie, () => (P.value++, () => {
       P.value--;
     }));
-    const U = ee(Ie, null), s = F(null);
+    const U = te(Ie, null), s = F(null);
     typeof U == "function" && (s.value = U());
-    const z = () => {
+    const O = () => {
       o.onFavoriteToggle({ ...e.pageShortcutData, path: e.pageShortcutData?.path || v.fullPath });
     };
     He(() => {
@@ -524,24 +524,27 @@ const ht = {
                 k.value ? {
                   name: "divider",
                   fn: T(() => [
-                    N(f(Ge), { decorative: "" })
+                    z(h(Ge), {
+                      decorative: "",
+                      size: `var(--kui-icon-size-30, ${h(Q)})`
+                    }, null, 8, ["size"])
                   ]),
                   key: "0"
                 } : void 0
               ]), 1032, ["items"])) : m("", !0),
               b("div", Dt, [
                 e.backTo && !k.value ? (i(), D(fe(y.value ? "a" : "router-link"), Se({ key: 0 }, y.value ? { href: e.backTo } : { to: e.backTo }, {
-                  "aria-label": f(l)("back_button"),
+                  "aria-label": h(l)("back_button"),
                   class: "navigate-back",
                   "data-testid": "page-layout-navigate-back",
                   tabindex: "0",
-                  onClick: le(O, ["prevent"]),
-                  onKeydown: Ae(le(O, ["prevent"]), ["enter"])
+                  onClick: le(N, ["prevent"]),
+                  onKeydown: Ae(le(N, ["prevent"]), ["enter"])
                 }), {
                   default: T(() => [
-                    N(f(Ue), {
+                    z(h(Ue), {
                       decorative: "",
-                      size: `var(--kui-icon-size-30, ${f(ae)})`
+                      size: `var(--kui-icon-size-30, ${h(Q)})`
                     }, null, 8, ["size"])
                   ]),
                   _: 1
@@ -555,21 +558,21 @@ const ht = {
                   key: S.value,
                   class: "favorite-button-container"
                 }, [
-                  N(Z, {
+                  z(Z, {
                     placement: "right",
-                    text: g.value ? f(l)("favorite_button.remove_shortcut") : f(l)("favorite_button.save_shortcut")
+                    text: g.value ? h(l)("favorite_button.remove_shortcut") : h(l)("favorite_button.save_shortcut")
                   }, {
                     default: T(() => [
                       b("button", {
-                        "aria-label": g.value ? f(l)("favorite_button.remove_shortcut") : f(l)("favorite_button.save_shortcut"),
+                        "aria-label": g.value ? h(l)("favorite_button.remove_shortcut") : h(l)("favorite_button.save_shortcut"),
                         class: j(["favorite-button", { active: g.value }]),
                         "data-testid": "page-layout-favorite-button",
                         type: "button",
-                        onClick: z
+                        onClick: O
                       }, [
-                        (i(), D(fe(g.value ? f(qe) : f(Ye)), {
+                        (i(), D(fe(g.value ? h(qe) : h(Ye)), {
                           decorative: "",
-                          size: `var(--kui-icon-size-30, ${f(ae)})`
+                          size: `var(--kui-icon-size-30, ${h(Q)})`
                         }, null, 8, ["size"]))
                       ], 10, Pt)
                     ]),
@@ -581,7 +584,7 @@ const ht = {
                 ])) : m("", !0)
               ])
             ]),
-            h.value ? (i(), D(It, {
+            f.value ? (i(), D(It, {
               key: 0,
               anchors: e.anchors
             }, null, 8, ["anchors"])) : m("", !0),
@@ -605,17 +608,17 @@ const ht = {
         b("div", {
           class: j(["page-layout-content-container", { "has-nested-page-layout": H.value }])
         }, [
-          k.value && K.$slots.aside ? (i(), d("div", Nt, [
+          k.value && K.$slots.aside ? (i(), d("div", zt, [
             E(K.$slots, "aside", {}, void 0, !0)
           ])) : m("", !0),
-          b("div", Ot, [
+          b("div", Nt, [
             n.value ? (i(), D(L, { key: 0 })) : E(K.$slots, "default", {}, void 0, !0, 1)
           ])
         ], 2)
       ], 2);
     };
   }
-}), ea = /* @__PURE__ */ ce(zt, [["__scopeId", "data-v-b57669c9"]]), Ft = {
+}), ea = /* @__PURE__ */ ce(Ot, [["__scopeId", "data-v-82c7f181"]]), Ft = {
   key: 0,
   class: "about-card-description",
   "data-testid": "about-card-description"
@@ -682,8 +685,8 @@ const ht = {
                       "data-testid": `about-card-row-${n.key}-tooltip`,
                       type: "button"
                     }, [
-                      N(f(Ze), {
-                        size: `var(--kui-icon-size-20, ${f(ot)})`
+                      z(h(Ze), {
+                        size: `var(--kui-icon-size-20, ${h(ot)})`
                       }, null, 8, ["size"])
                     ], 8, jt)
                   ]),

package/dist/page-layout.umd.js

@@ -1 +1 @@
-(function(C,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("vue-router"),require("@kong-ui-public/i18n"),require("@kong/icons")):typeof define=="function"&&define.amd?define(["exports","vue","vue-router","@kong-ui-public/i18n","@kong/icons"],e):(C=typeof globalThis<"u"?globalThis:C||self,e(C["kong-ui-public-page-layout"]={},C.Vue,C.VueRouter,C["kong-ui-public-i18n"],C.KongIcons))})(this,(function(C,e,q,J,L){"use strict";const re={back_button:"Go back",favorite_button:{save_shortcut:"Save page to shortcuts",remove_shortcut:"Remove page from shortcuts"},tabs:{more_button:{label:"More",aria_label:"More tabs"}},anchor_navigation:{aria_label:"Page sections",more_button:{aria_label:"More page sections"}}};function se(){const t=J.createI18n("en-us",re);return{i18n:t,i18nT:J.i18nTComponent(t)}}const G={useI18n:se},ce="12px",O="16px",de="2px",Z="16px";function ue(t,s){return e.getCurrentScope()?(e.onScopeDispose(t,s),!0):!1}const pe=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const A=()=>{};function me(t,s){function n(...a){return new Promise((r,d)=>{Promise.resolve(t(()=>s.apply(this,a),{fn:s,thisArg:this,args:a})).then(r).catch(d)})}return"cancel"in t&&Object.assign(n,{cancel:t.cancel,flush:t.flush,isPending:t.isPending}),n}function fe(t,s={}){let n,a,r=A,d=A;const u=e.shallowRef(!1),l=p=>{clearTimeout(p),r(),r=A};let h;return Object.assign(p=>{const m=e.toValue(t),y=e.toValue(s.maxWait);return n&&l(n),m<=0||y!==void 0&&y<=0?(a&&(l(a),a=void 0),u.value=!1,Promise.resolve(p())):(u.value=!0,new Promise((B,f)=>{r=s.rejectOnCancel?f:B,d=B,h=p,y&&!a&&(a=setTimeout(()=>{n&&l(n),a=void 0,u.value=!1,B(h())},y)),n=setTimeout(()=>{a&&l(a),a=void 0,u.value=!1,B(p())},m)}))},{cancel:()=>{n&&(l(n),n=void 0),a&&(l(a),a=void 0),u.value=!1,d=A},flush:()=>{if(u.value){n&&(clearTimeout(n),n=void 0),a&&(clearTimeout(a),a=void 0),u.value=!1;const p=d;r=A,d=A,p(h())}},isPending:e.shallowReadonly(u)})}function he(t,s=200,n={}){return me(fe(s,n),t)}const ge=pe?window:void 0;function X(t){var s;const n=e.toValue(t);return(s=n?.$el)!==null&&s!==void 0?s:n}function ke(){const t=e.shallowRef(!1),s=e.getCurrentInstance();return s&&e.onMounted(()=>{t.value=!0},s),t}function be(t){const s=ke();return e.computed(()=>(s.value,!!t()))}function Q(t,s,n={}){const{window:a=ge,...r}=n;let d;const u=be(()=>a&&"ResizeObserver"in a),l=()=>{d&&(d.disconnect(),d=void 0)},h=e.watch(e.computed(()=>{const p=e.toValue(t);return Array.isArray(p)?p.map(m=>X(m)):[X(p)]}),p=>{if(l(),u.value&&a){d=new ResizeObserver(s);for(const m of p)m&&d.observe(m,r)}},{immediate:!0,flush:"post"}),g=()=>{l(),h()};return ue(g),{isSupported:u,stop:g}}const ye={ref:"page-layout-tabs",class:"page-layout-tabs","data-testid":"page-layout-tabs"},we={key:0},Ce=["aria-label"],Be={key:0,class:"layout-loader-container"},Ee=e.defineComponent({__name:"PageLayoutTabs",props:{tabs:{default:()=>[]}},setup(t){const{i18n:{t:s}}=G.useI18n(),n=q.useRouter(),a=e.inject("app:navigateTo",null),r=f=>{if(typeof f.to!="string"){n.push(f.to);return}if(typeof a!="function"){window.location.href=f.to;return}a(f.to)},d=e.useTemplateRef("page-layout-tabs"),u=e.useTemplateRef("page-layout-tabs-list"),l=e.ref(t.tabs.length),h=e.ref(!1),g=e.computed(()=>t.tabs.slice(0,l.value)),p=e.computed(()=>t.tabs.slice(l.value)),m=async()=>{if(!d.value||!u.value)return;h.value=!1,l.value=t.tabs.length,await e.nextTick();const f=d.value?.getBoundingClientRect().width-parseInt(Z)*2;let $=u.value?.getBoundingClientRect().width;if(!f||!$){h.value=!0;return}const _=50;for(;$+_>f&&l.value>1;)l.value--,await e.nextTick(),$=u.value?.getBoundingClientRect().width||0;h.value=!0};let y=null;const B=()=>{y&&clearTimeout(y),y=setTimeout(()=>{m()},150)};return e.onMounted(()=>{m(),Q(d,B)}),e.onBeforeUnmount(()=>{y&&clearTimeout(y)}),e.watch(()=>t.tabs,()=>{m()},{deep:!0}),(f,$)=>{const _=e.resolveComponent("KDropdownItem"),I=e.resolveComponent("KDropdown"),P=e.resolveComponent("KSkeletonBox");return e.openBlock(),e.createElementBlock("nav",ye,[e.createElementVNode("ul",{ref:"page-layout-tabs-list",class:e.normalizeClass({"layout-computing":!h.value})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(g.value,i=>(e.openBlock(),e.createElementBlock("li",{key:`${i.key}-tab`},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(typeof i.to=="string"?"a":"router-link"),e.mergeProps({ref_for:!0},typeof i.to=="string"?{href:i.to}:{to:i.to},{"aria-current":i.active?"page":void 0,class:["tab-link",{active:i.active}],"data-testid":i.dataTestId?i.dataTestId:`page-layout-tab-${i.key}`,tabindex:"0",onClick:e.withModifiers(S=>r(i),["prevent"]),onKeydown:e.withKeys(e.withModifiers(S=>r(i),["prevent"]),["enter"])}),{default:e.withCtx(()=>[e.renderSlot(f.$slots,`tab-${i.key}`,{tab:i},()=>[e.createTextVNode(e.toDisplayString(i.label),1)],!0)]),_:2},1040,["aria-current","class","data-testid","onClick","onKeydown"]))]))),128)),t.tabs.length>l.value?(e.openBlock(),e.createElementBlock("li",we,[e.createVNode(I,{"kpop-attributes":{placement:"bottom-end",popoverElementAttributes:{"data-testid":"tabs-overflow-dropdown-popover"}}},{items:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(p.value,i=>(e.openBlock(),e.createBlock(_,{key:`${i.key}-dropdown-item`,"aria-current":i.active?"page":void 0,"data-testid":i.dataTestId?i.dataTestId:`page-layout-tab-${i.key}`,item:{label:i.label,value:i.key,to:i.to},selected:i.active},{default:e.withCtx(()=>[e.renderSlot(f.$slots,`tab-${i.key}`,{tab:i},()=>[e.createTextVNode(e.toDisplayString(i.label),1)],!0)]),_:2},1032,["aria-current","data-testid","item","selected"]))),128))]),default:e.withCtx(()=>[e.createElementVNode("button",{"aria-label":e.unref(s)("tabs.more_button.aria_label"),class:e.normalizeClass(["tab-link",{active:p.value.find(i=>i.active)}]),"data-testid":"tabs-overflow-dropdown-button"},[e.createTextVNode(e.toDisplayString(e.unref(s)("tabs.more_button.label"))+" ",1),e.createVNode(e.unref(L.ChevronDownIcon),{decorative:"",size:`var(--kui-icon-size-30, ${e.unref(O)})`},null,8,["size"])],10,Ce)]),_:3})])):e.createCommentVNode("",!0)],2),h.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",Be,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(3,i=>e.createVNode(P,{key:`layout-loader-${i}`,height:"1",width:"5"})),64))]))],512)}}}),M=(t,s)=>{const n=t.__vccOpts||t;for(const[a,r]of s)n[a]=r;return n},Te=M(Ee,[["__scopeId","data-v-02891bc1"]]),_e=["aria-label","data-fit"],Ne={key:0,"aria-hidden":"true",class:"anchor-ellipsis","data-testid":"anchor-navigation-leading-ellipsis"},$e=["aria-current","data-testid","title","onClick"],Se={key:1,"aria-hidden":"true",class:"anchor-ellipsis","data-testid":"anchor-navigation-trailing-ellipsis"},Ie={key:2},ee=140,te=22,U=16,Ve=M(e.defineComponent({__name:"PageLayoutAnchorNavigation",props:{anchors:{default:()=>[]}},setup(t){const{i18n:{t:s}}=G.useI18n(),n=e.useTemplateRef("page-layout-anchor-navigation"),a=e.useTemplateRef("page-layout-anchor-navigation-list"),r=e.ref("all"),d=e.ref(""),u=e.ref([]),l=e.computed(()=>t.anchors.filter(o=>u.value.includes(o.id))),h=e.computed(()=>{const o=l.value.findIndex(c=>c.id===d.value);return o===-1?0:o}),g=e.computed(()=>{const o=l.value,c=o.length,k=h.value;if(r.value==="all")return{anchors:o,hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!1};if(r.value==="hidden")return{anchors:[],hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!1};if(r.value==="active-only")return{anchors:o.slice(k,k+1),hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!0};const b=r.value==="window-3"?3:2;if(c<=b)return{anchors:o,hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!0};const V=k<b?0:k>=c-b?c-b:k-1;return{anchors:o.slice(V,V+b),hasLeadingEllipsis:V>0,hasTrailingEllipsis:V+b<c,hasOverflowDropdown:!0}}),p=o=>o.dataTestId??`page-layout-anchor-${o.id.replace(/[^\w-]+/g,"-").replace(/^-+|-+$/g,"")}`,m=e.ref(null),y=()=>{let o=n.value?.parentElement??null;for(;o;){const{overflowY:c}=getComputedStyle(o);if(c==="auto"||c==="scroll"||c==="overlay")return o;o=o.parentElement}return null},B=o=>{if(o.element)return o.element.isConnected?o.element:null;const c=m.value??document;try{return c.querySelector(o.id)??c.querySelector(`#${CSS.escape(o.id)}`)}catch{return null}},f=()=>(n.value?.closest(".page-layout-header")?.getBoundingClientRect().height??0)+parseInt(Z,10),$=parseInt(O,10),_=parseInt(de,10),I=o=>o*ee+2*$+te+(o+2)*_+U,P=()=>ee+te+_+U;let i=0;const S=async()=>{if(!l.value.length){r.value="hidden";return}const o=++i;if(r.value="all",await e.nextTick(),o!==i||!n.value||!a.value)return;const c=n.value.getBoundingClientRect().width,k=a.value.getBoundingClientRect().width;c<=0||k<=0||k+U<=c||(I(3)<=c?r.value="window-3":I(2)<=c?r.value="window-2":P()<=c?r.value="active-only":r.value="hidden")};let R=null;Q(n,()=>{R&&clearTimeout(R),R=setTimeout(()=>{F(),S()},150)});let K=null,x=null;const z=()=>m.value??window,T=()=>{K=null,x&&(clearTimeout(x),x=null);const o=z();o.removeEventListener("scrollend",T),o.removeEventListener("wheel",T),o.removeEventListener("touchstart",T)},H=o=>{T(),K=o;const c=z();c.addEventListener("scrollend",T,{once:!0}),c.addEventListener("wheel",T,{passive:!0}),c.addEventListener("touchstart",T,{passive:!0}),x=setTimeout(T,1e3)},v=()=>{const o=m.value;return{top:o?o.getBoundingClientRect().top:0,scrollTop:o?o.scrollTop:window.scrollY,clientHeight:o?o.clientHeight:window.innerHeight,scrollHeight:o?o.scrollHeight:document.documentElement.scrollHeight}},F=()=>{const{top:o,scrollTop:c,clientHeight:k,scrollHeight:b}=v(),V=f(),w=[];let E=null,j=null;for(const D of t.anchors){const W=B(D);W&&(w.push(D.id),j=D.id,E??=D.id,W.getBoundingClientRect().top-o<=(D.offset??V)+8&&(E=D.id))}const ie=w.length!==u.value.length||w.some((D,W)=>D!==u.value[W]);return ie&&(u.value=w),K||(j&&c>0&&c+k>=b-2&&(E=j),d.value=E??""),ie};let Y=!1;const ae=()=>{Y||(Y=!0,requestAnimationFrame(()=>{Y=!1,F()&&S()}))},le=o=>{const c=B(o);if(!c)return;d.value=o.id,H(o.id);const k=o.offset??f(),b=m.value;if(b){b.scrollTo({behavior:"smooth",top:c.getBoundingClientRect().top-b.getBoundingClientRect().top+b.scrollTop-k});return}window.scrollTo({behavior:"smooth",top:c.getBoundingClientRect().top+window.scrollY-k})},et=(o,c)=>{c(),le(o)};return e.onMounted(()=>{m.value=y(),z().addEventListener("scroll",ae,{passive:!0}),F(),S(),requestAnimationFrame(()=>{F(),S()})}),e.onBeforeUnmount(()=>{z().removeEventListener("scroll",ae),T(),R&&clearTimeout(R)}),e.watch(()=>t.anchors,()=>{t.anchors.some(o=>o.id===d.value)||(d.value=""),F(),S()},{deep:!0}),(o,c)=>{const k=e.resolveComponent("KButton"),b=e.resolveComponent("KDropdownItem"),V=e.resolveComponent("KDropdown");return e.openBlock(),e.createElementBlock("nav",{ref:"page-layout-anchor-navigation","aria-label":e.unref(s)("anchor_navigation.aria_label"),class:"page-layout-anchor-navigation","data-fit":r.value,"data-testid":"page-layout-anchor-navigation"},[e.createElementVNode("ul",{ref:"page-layout-anchor-navigation-list",class:e.normalizeClass({"layout-hidden":r.value==="hidden"})},[g.value.hasLeadingEllipsis?(e.openBlock(),e.createElementBlock("li",Ne," … ")):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(g.value.anchors,w=>(e.openBlock(),e.createElementBlock("li",{key:`${w.id}-anchor`},[e.createElementVNode("button",{"aria-current":w.id===d.value?"location":void 0,class:e.normalizeClass(["anchor-link",{active:w.id===d.value}]),"data-testid":p(w),title:w.label,type:"button",onClick:E=>le(w)},e.toDisplayString(w.label),11,$e)]))),128)),g.value.hasTrailingEllipsis?(e.openBlock(),e.createElementBlock("li",Se," … ")):e.createCommentVNode("",!0),g.value.hasOverflowDropdown?(e.openBlock(),e.createElementBlock("li",Ie,[e.createVNode(V,{"kpop-attributes":{placement:"bottom-end",popoverElementAttributes:{"data-testid":"anchor-navigation-overflow-dropdown-popover"}}},{items:e.withCtx(({closeDropdown:w})=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.value,E=>(e.openBlock(),e.createBlock(b,{key:`${E.id}-dropdown-item`,"aria-current":E.id===d.value?"location":void 0,"data-testid":p(E),selected:E.id===d.value,onClick:j=>et(E,w)},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(E.label),1)]),_:2},1032,["aria-current","data-testid","selected","onClick"]))),128))]),default:e.withCtx(()=>[e.createVNode(k,{appearance:"tertiary","aria-label":e.unref(s)("anchor_navigation.more_button.aria_label"),class:"anchor-overflow-button","data-testid":"anchor-navigation-overflow-dropdown-button",icon:"",size:"small"},{default:e.withCtx(()=>[e.createVNode(e.unref(L.ChevronDownIcon),{decorative:"",size:`var(--kui-icon-size-30, ${e.unref(O)})`},null,8,["size"])]),_:1},8,["aria-label"])]),_:1})])):e.createCommentVNode("",!0)],2)],8,_e)}}}),[["__scopeId","data-v-f9770830"]]),oe=Symbol("nested-page-layout-detection"),ne="page-layout:new-appearance",De={key:0,class:"page-layout-header","data-testid":"page-layout-header"},Le={class:"page-header-container"},Re={class:"page-header-start"},Ae={class:"title-container"},Pe={key:1,class:"page-layout-title-wrapper"},Ke={class:"page-layout-title","data-testid":"page-layout-title"},xe=["aria-label"],ze={key:3,class:"title-after-container"},Oe={class:"page-header-actions-container"},Fe={key:0,class:"page-layout-aside-container","data-testid":"page-layout-aside"},Me={class:"page-layout-content"},He=M(e.defineComponent({__name:"PageLayout",props:{breadcrumbs:{default:()=>[]},title:{},backTo:{},tabs:{default:()=>[]},anchors:{default:()=>[]},pageShortcutData:{}},setup(t){const s=e.inject("app:navigateTo",null),n=e.inject(ne,null),a=e.inject("app:pageShortcutsContext",null),{i18n:{t:r}}=G.useI18n(),d=q.useRouter(),u=q.useRoute(),l=e.computed(()=>!!(t.tabs&&t.tabs.length)),h=e.computed(()=>typeof t.backTo=="string"),g=e.computed(()=>e.toValue(n)===!0),p=e.computed(()=>g.value&&!l.value&&!!(t.anchors&&t.anchors.length)),m=e.computed(()=>!!t.pageShortcutData&&!!t.pageShortcutData.entityType&&!!t.pageShortcutData.label),y=e.computed(()=>m.value&&!!a&&"onFavoriteToggle"in a&&typeof a.onFavoriteToggle=="function"),B=e.ref(0),f=e.computed(()=>!!a&&"isFavorite"in a&&typeof a.isFavorite=="function"&&a.isFavorite(t.pageShortcutData)===!0),$=async()=>{if(t.backTo){if(typeof t.backTo=="object"){d.push(t.backTo);return}if(typeof s!="function"){window.location.href=t.backTo;return}await s(t.backTo)}},_=e.ref(0),I=e.computed(()=>_.value>0);e.provide(oe,()=>(_.value++,()=>{_.value--}));const P=e.inject(oe,null),i=e.ref(null);typeof P=="function"&&(i.value=P());const S=()=>{a.onFavoriteToggle({...t.pageShortcutData,path:t.pageShortcutData?.path||u.fullPath})};e.onUnmounted(()=>{i.value?.()});const R=he(()=>{!I.value&&m.value&&a&&"onEntityPageVisit"in a&&typeof a.onEntityPageVisit=="function"&&(a.onEntityPageVisit({...t.pageShortcutData,path:t.pageShortcutData?.path||u?.fullPath}),B.value++)},500);return e.watch([()=>t.pageShortcutData,()=>u?.fullPath],()=>{R()},{immediate:!0,deep:!0}),(N,K)=>{const x=e.resolveComponent("KBreadcrumbs"),z=e.resolveComponent("KTooltip"),T=e.resolveComponent("router-view");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["kong-ui-public-page-layout",{"new-appearance":g.value}]),"data-testid":"kong-ui-public-page-layout"},[I.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",De,[e.createElementVNode("div",Le,[e.createElementVNode("div",Re,[t.breadcrumbs&&t.breadcrumbs.length?(e.openBlock(),e.createBlock(x,{key:0,class:"header-breadcrumbs","data-testid":"page-layout-breadcrumbs","item-max-width":"25ch",items:t.breadcrumbs},e.createSlots({_:2},[g.value?{name:"divider",fn:e.withCtx(()=>[e.createVNode(e.unref(L.ChevronRightIcon),{decorative:""})]),key:"0"}:void 0]),1032,["items"])):e.createCommentVNode("",!0),e.createElementVNode("div",Ae,[t.backTo&&!g.value?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(h.value?"a":"router-link"),e.mergeProps({key:0},h.value?{href:t.backTo}:{to:t.backTo},{"aria-label":e.unref(r)("back_button"),class:"navigate-back","data-testid":"page-layout-navigate-back",tabindex:"0",onClick:e.withModifiers($,["prevent"]),onKeydown:e.withKeys(e.withModifiers($,["prevent"]),["enter"])}),{default:e.withCtx(()=>[e.createVNode(e.unref(L.ArrowTopLeftIcon),{decorative:"",size:`var(--kui-icon-size-30, ${e.unref(O)})`},null,8,["size"])]),_:1},16,["aria-label","onKeydown"])):e.createCommentVNode("",!0),t.title||N.$slots.title?(e.openBlock(),e.createElementBlock("span",Pe,[e.renderSlot(N.$slots,"title",{},()=>[e.createElementVNode("h1",Ke,e.toDisplayString(t.title),1)],!0)])):e.createCommentVNode("",!0),y.value?(e.openBlock(),e.createElementBlock("div",{key:B.value,class:"favorite-button-container"},[e.createVNode(z,{placement:"right",text:f.value?e.unref(r)("favorite_button.remove_shortcut"):e.unref(r)("favorite_button.save_shortcut")},{default:e.withCtx(()=>[e.createElementVNode("button",{"aria-label":f.value?e.unref(r)("favorite_button.remove_shortcut"):e.unref(r)("favorite_button.save_shortcut"),class:e.normalizeClass(["favorite-button",{active:f.value}]),"data-testid":"page-layout-favorite-button",type:"button",onClick:S},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(f.value?e.unref(L.StarFillIcon):e.unref(L.StarIcon)),{decorative:"",size:`var(--kui-icon-size-30, ${e.unref(O)})`},null,8,["size"]))],10,xe)]),_:1},8,["text"])])):e.createCommentVNode("",!0),N.$slots["title-after"]?(e.openBlock(),e.createElementBlock("div",ze,[e.renderSlot(N.$slots,"title-after",{},void 0,!0)])):e.createCommentVNode("",!0)])]),p.value?(e.openBlock(),e.createBlock(Ve,{key:0,anchors:t.anchors},null,8,["anchors"])):e.createCommentVNode("",!0),e.createElementVNode("div",Oe,[e.renderSlot(N.$slots,"actions",{},void 0,!0),K[0]||(K[0]=e.createElementVNode("div",{"data-teleport-target":"ask-kai"},null,-1))])]),l.value?(e.openBlock(),e.createBlock(Te,{key:0,tabs:t.tabs},e.createSlots({_:2},[e.renderList(t.tabs,H=>({name:`tab-${H.key}`,fn:e.withCtx(v=>[e.renderSlot(N.$slots,`tab-${H.key}`,e.normalizeProps(e.guardReactiveProps(v)),void 0,!0)])}))]),1032,["tabs"])):e.createCommentVNode("",!0)])),e.createElementVNode("div",{class:e.normalizeClass(["page-layout-content-container",{"has-nested-page-layout":I.value}])},[g.value&&N.$slots.aside?(e.openBlock(),e.createElementBlock("div",Fe,[e.renderSlot(N.$slots,"aside",{},void 0,!0)])):e.createCommentVNode("",!0),e.createElementVNode("div",Me,[l.value?(e.openBlock(),e.createBlock(T,{key:0})):e.renderSlot(N.$slots,"default",{},void 0,!0,1)])],2)],2)}}}),[["__scopeId","data-v-b57669c9"]]),je={key:0,class:"about-card-description","data-testid":"about-card-description"},We={key:1,class:"about-card-skeleton","data-testid":"about-card-skeleton"},qe={key:2,class:"about-card-rows","data-testid":"about-card-rows"},Ge=["data-testid"],Ue={class:"about-card-row-label"},ve={class:"about-card-row-text"},Ye=["aria-label","data-testid"],Je={class:"about-card-row-value"},Ze={class:"about-card-row-text"},Xe={key:3,class:"about-card-content","data-testid":"about-card-content"},Qe=M(e.defineComponent({__name:"AboutCard",props:{title:{default:""},titleTag:{default:"h2"},description:{default:""},rows:{default:()=>[]},isLoading:{type:Boolean,default:!1}},setup(t){const s=e.computed(()=>t.rows.length||4);return(n,a)=>{const r=e.resolveComponent("KSkeletonBox"),d=e.resolveComponent("KTooltip"),u=e.resolveComponent("KCard");return e.openBlock(),e.createBlock(u,{class:"kong-ui-public-about-card",title:t.title,"title-tag":t.titleTag},e.createSlots({default:e.withCtx(()=>[n.$slots.description||t.description?(e.openBlock(),e.createElementBlock("p",je,[e.renderSlot(n.$slots,"description",{},()=>[e.createTextVNode(e.toDisplayString(t.description),1)],!0)])):e.createCommentVNode("",!0),t.isLoading?(e.openBlock(),e.createElementBlock("div",We,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(s.value,l=>(e.openBlock(),e.createBlock(r,{key:l,height:"2",width:"100"}))),128))])):t.rows.length?(e.openBlock(),e.createElementBlock("dl",qe,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.rows,l=>(e.openBlock(),e.createElementBlock("div",{key:l.key,class:"about-card-row","data-testid":`about-card-row-${l.key}`},[e.createElementVNode("dt",Ue,[e.renderSlot(n.$slots,`label-${l.key}`,{row:l},()=>[e.createElementVNode("span",ve,e.toDisplayString(l.label),1)],!0),l.tooltip?(e.openBlock(),e.createBlock(d,{key:0,text:l.tooltip},{default:e.withCtx(()=>[e.createElementVNode("button",{"aria-label":l.tooltip,class:"about-card-row-tooltip-trigger","data-testid":`about-card-row-${l.key}-tooltip`,type:"button"},[e.createVNode(e.unref(L.InfoIcon),{size:`var(--kui-icon-size-20, ${e.unref(ce)})`},null,8,["size"])],8,Ye)]),_:2},1032,["text"])):e.createCommentVNode("",!0)]),e.createElementVNode("dd",Je,[e.renderSlot(n.$slots,`row-${l.key}`,{row:l},()=>[e.createElementVNode("span",Ze,e.toDisplayString(l.value),1)],!0)])],8,Ge))),128))])):e.createCommentVNode("",!0),n.$slots.default?(e.openBlock(),e.createElementBlock("div",Xe,[e.renderSlot(n.$slots,"default",{},void 0,!0)])):e.createCommentVNode("",!0)]),_:2},[n.$slots.title||t.title?{name:"title",fn:e.withCtx(()=>[e.renderSlot(n.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(t.title),1)],!0)]),key:"0"}:void 0,n.$slots.actions?{name:"actions",fn:e.withCtx(()=>[e.renderSlot(n.$slots,"actions",{},void 0,!0)]),key:"1"}:void 0]),1032,["title","title-tag"])}}}),[["__scopeId","data-v-0316c887"]]);C.AboutCard=Qe,C.NEW_APPEARANCE_INJECTION_KEY=ne,C.PageLayout=He,Object.defineProperty(C,Symbol.toStringTag,{value:"Module"})}));
+(function(C,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("vue-router"),require("@kong-ui-public/i18n"),require("@kong/icons")):typeof define=="function"&&define.amd?define(["exports","vue","vue-router","@kong-ui-public/i18n","@kong/icons"],e):(C=typeof globalThis<"u"?globalThis:C||self,e(C["kong-ui-public-page-layout"]={},C.Vue,C.VueRouter,C["kong-ui-public-i18n"],C.KongIcons))})(this,(function(C,e,q,J,L){"use strict";const re={back_button:"Go back",favorite_button:{save_shortcut:"Save page to shortcuts",remove_shortcut:"Remove page from shortcuts"},tabs:{more_button:{label:"More",aria_label:"More tabs"}},anchor_navigation:{aria_label:"Page sections",more_button:{aria_label:"More page sections"}}};function se(){const t=J.createI18n("en-us",re);return{i18n:t,i18nT:J.i18nTComponent(t)}}const G={useI18n:se},ce="12px",A="16px",de="2px",Z="16px";function ue(t,s){return e.getCurrentScope()?(e.onScopeDispose(t,s),!0):!1}const pe=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const P=()=>{};function me(t,s){function n(...a){return new Promise((r,d)=>{Promise.resolve(t(()=>s.apply(this,a),{fn:s,thisArg:this,args:a})).then(r).catch(d)})}return"cancel"in t&&Object.assign(n,{cancel:t.cancel,flush:t.flush,isPending:t.isPending}),n}function fe(t,s={}){let n,a,r=P,d=P;const u=e.shallowRef(!1),l=p=>{clearTimeout(p),r(),r=P};let h;return Object.assign(p=>{const m=e.toValue(t),b=e.toValue(s.maxWait);return n&&l(n),m<=0||b!==void 0&&b<=0?(a&&(l(a),a=void 0),u.value=!1,Promise.resolve(p())):(u.value=!0,new Promise((B,f)=>{r=s.rejectOnCancel?f:B,d=B,h=p,b&&!a&&(a=setTimeout(()=>{n&&l(n),a=void 0,u.value=!1,B(h())},b)),n=setTimeout(()=>{a&&l(a),a=void 0,u.value=!1,B(p())},m)}))},{cancel:()=>{n&&(l(n),n=void 0),a&&(l(a),a=void 0),u.value=!1,d=P},flush:()=>{if(u.value){n&&(clearTimeout(n),n=void 0),a&&(clearTimeout(a),a=void 0),u.value=!1;const p=d;r=P,d=P,p(h())}},isPending:e.shallowReadonly(u)})}function he(t,s=200,n={}){return me(fe(s,n),t)}const ge=pe?window:void 0;function X(t){var s;const n=e.toValue(t);return(s=n?.$el)!==null&&s!==void 0?s:n}function ke(){const t=e.shallowRef(!1),s=e.getCurrentInstance();return s&&e.onMounted(()=>{t.value=!0},s),t}function ye(t){const s=ke();return e.computed(()=>(s.value,!!t()))}function Q(t,s,n={}){const{window:a=ge,...r}=n;let d;const u=ye(()=>a&&"ResizeObserver"in a),l=()=>{d&&(d.disconnect(),d=void 0)},h=e.watch(e.computed(()=>{const p=e.toValue(t);return Array.isArray(p)?p.map(m=>X(m)):[X(p)]}),p=>{if(l(),u.value&&a){d=new ResizeObserver(s);for(const m of p)m&&d.observe(m,r)}},{immediate:!0,flush:"post"}),g=()=>{l(),h()};return ue(g),{isSupported:u,stop:g}}const be={ref:"page-layout-tabs",class:"page-layout-tabs","data-testid":"page-layout-tabs"},we={key:0},Ce=["aria-label"],Be={key:0,class:"layout-loader-container"},Ee=e.defineComponent({__name:"PageLayoutTabs",props:{tabs:{default:()=>[]}},setup(t){const{i18n:{t:s}}=G.useI18n(),n=q.useRouter(),a=e.inject("app:navigateTo",null),r=f=>{if(typeof f.to!="string"){n.push(f.to);return}if(typeof a!="function"){window.location.href=f.to;return}a(f.to)},d=e.useTemplateRef("page-layout-tabs"),u=e.useTemplateRef("page-layout-tabs-list"),l=e.ref(t.tabs.length),h=e.ref(!1),g=e.computed(()=>t.tabs.slice(0,l.value)),p=e.computed(()=>t.tabs.slice(l.value)),m=async()=>{if(!d.value||!u.value)return;h.value=!1,l.value=t.tabs.length,await e.nextTick();const f=d.value?.getBoundingClientRect().width-parseInt(Z)*2;let $=u.value?.getBoundingClientRect().width;if(!f||!$){h.value=!0;return}const _=50;for(;$+_>f&&l.value>1;)l.value--,await e.nextTick(),$=u.value?.getBoundingClientRect().width||0;h.value=!0};let b=null;const B=()=>{b&&clearTimeout(b),b=setTimeout(()=>{m()},150)};return e.onMounted(()=>{m(),Q(d,B)}),e.onBeforeUnmount(()=>{b&&clearTimeout(b)}),e.watch(()=>t.tabs,()=>{m()},{deep:!0}),(f,$)=>{const _=e.resolveComponent("KDropdownItem"),I=e.resolveComponent("KDropdown"),K=e.resolveComponent("KSkeletonBox");return e.openBlock(),e.createElementBlock("nav",be,[e.createElementVNode("ul",{ref:"page-layout-tabs-list",class:e.normalizeClass({"layout-computing":!h.value})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(g.value,i=>(e.openBlock(),e.createElementBlock("li",{key:`${i.key}-tab`},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(typeof i.to=="string"?"a":"router-link"),e.mergeProps({ref_for:!0},typeof i.to=="string"?{href:i.to}:{to:i.to},{"aria-current":i.active?"page":void 0,class:["tab-link",{active:i.active}],"data-testid":i.dataTestId?i.dataTestId:`page-layout-tab-${i.key}`,tabindex:"0",onClick:e.withModifiers(S=>r(i),["prevent"]),onKeydown:e.withKeys(e.withModifiers(S=>r(i),["prevent"]),["enter"])}),{default:e.withCtx(()=>[e.renderSlot(f.$slots,`tab-${i.key}`,{tab:i},()=>[e.createTextVNode(e.toDisplayString(i.label),1)],!0)]),_:2},1040,["aria-current","class","data-testid","onClick","onKeydown"]))]))),128)),t.tabs.length>l.value?(e.openBlock(),e.createElementBlock("li",we,[e.createVNode(I,{"kpop-attributes":{placement:"bottom-end",popoverElementAttributes:{"data-testid":"tabs-overflow-dropdown-popover"}}},{items:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(p.value,i=>(e.openBlock(),e.createBlock(_,{key:`${i.key}-dropdown-item`,"aria-current":i.active?"page":void 0,"data-testid":i.dataTestId?i.dataTestId:`page-layout-tab-${i.key}`,item:{label:i.label,value:i.key,to:i.to},selected:i.active},{default:e.withCtx(()=>[e.renderSlot(f.$slots,`tab-${i.key}`,{tab:i},()=>[e.createTextVNode(e.toDisplayString(i.label),1)],!0)]),_:2},1032,["aria-current","data-testid","item","selected"]))),128))]),default:e.withCtx(()=>[e.createElementVNode("button",{"aria-label":e.unref(s)("tabs.more_button.aria_label"),class:e.normalizeClass(["tab-link",{active:p.value.find(i=>i.active)}]),"data-testid":"tabs-overflow-dropdown-button"},[e.createTextVNode(e.toDisplayString(e.unref(s)("tabs.more_button.label"))+" ",1),e.createVNode(e.unref(L.ChevronDownIcon),{decorative:"",size:`var(--kui-icon-size-30, ${e.unref(A)})`},null,8,["size"])],10,Ce)]),_:3})])):e.createCommentVNode("",!0)],2),h.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",Be,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(3,i=>e.createVNode(K,{key:`layout-loader-${i}`,height:"1",width:"5"})),64))]))],512)}}}),M=(t,s)=>{const n=t.__vccOpts||t;for(const[a,r]of s)n[a]=r;return n},Te=M(Ee,[["__scopeId","data-v-02891bc1"]]),_e=["aria-label","data-fit"],Ne={key:0,"aria-hidden":"true",class:"anchor-ellipsis","data-testid":"anchor-navigation-leading-ellipsis"},$e=["aria-current","data-testid","title","onClick"],Se={key:1,"aria-hidden":"true",class:"anchor-ellipsis","data-testid":"anchor-navigation-trailing-ellipsis"},Ie={key:2},ee=140,te=22,U=16,Ve=M(e.defineComponent({__name:"PageLayoutAnchorNavigation",props:{anchors:{default:()=>[]}},setup(t){const{i18n:{t:s}}=G.useI18n(),n=e.useTemplateRef("page-layout-anchor-navigation"),a=e.useTemplateRef("page-layout-anchor-navigation-list"),r=e.ref("all"),d=e.ref(""),u=e.ref([]),l=e.computed(()=>t.anchors.filter(o=>u.value.includes(o.id))),h=e.computed(()=>{const o=l.value.findIndex(c=>c.id===d.value);return o===-1?0:o}),g=e.computed(()=>{const o=l.value,c=o.length,k=h.value;if(r.value==="all")return{anchors:o,hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!1};if(r.value==="hidden")return{anchors:[],hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!1};if(r.value==="active-only")return{anchors:o.slice(k,k+1),hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!0};const y=r.value==="window-3"?3:2;if(c<=y)return{anchors:o,hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!0};const V=k<y?0:k>=c-y?c-y:k-1;return{anchors:o.slice(V,V+y),hasLeadingEllipsis:V>0,hasTrailingEllipsis:V+y<c,hasOverflowDropdown:!0}}),p=o=>o.dataTestId??`page-layout-anchor-${o.id.replace(/[^\w-]+/g,"-").replace(/^-+|-+$/g,"")}`,m=e.ref(null),b=()=>{let o=n.value?.parentElement??null;for(;o;){const{overflowY:c}=getComputedStyle(o);if(c==="auto"||c==="scroll"||c==="overlay")return o;o=o.parentElement}return null},B=o=>{if(o.element)return o.element.isConnected?o.element:null;const c=m.value??document;try{return c.querySelector(o.id)??c.querySelector(`#${CSS.escape(o.id)}`)}catch{return null}},f=()=>(n.value?.closest(".page-layout-header")?.getBoundingClientRect().height??0)+parseInt(Z,10),$=parseInt(A,10),_=parseInt(de,10),I=o=>o*ee+2*$+te+(o+2)*_+U,K=()=>ee+te+_+U;let i=0;const S=async()=>{if(!l.value.length){r.value="hidden";return}const o=++i;if(r.value="all",await e.nextTick(),o!==i||!n.value||!a.value)return;const c=n.value.getBoundingClientRect().width,k=a.value.getBoundingClientRect().width;c<=0||k<=0||k+U<=c||(I(3)<=c?r.value="window-3":I(2)<=c?r.value="window-2":K()<=c?r.value="active-only":r.value="hidden")};let R=null;Q(n,()=>{R&&clearTimeout(R),R=setTimeout(()=>{F(),S()},150)});let z=null,x=null;const O=()=>m.value??window,T=()=>{z=null,x&&(clearTimeout(x),x=null);const o=O();o.removeEventListener("scrollend",T),o.removeEventListener("wheel",T),o.removeEventListener("touchstart",T)},H=o=>{T(),z=o;const c=O();c.addEventListener("scrollend",T,{once:!0}),c.addEventListener("wheel",T,{passive:!0}),c.addEventListener("touchstart",T,{passive:!0}),x=setTimeout(T,1e3)},v=()=>{const o=m.value;return{top:o?o.getBoundingClientRect().top:0,scrollTop:o?o.scrollTop:window.scrollY,clientHeight:o?o.clientHeight:window.innerHeight,scrollHeight:o?o.scrollHeight:document.documentElement.scrollHeight}},F=()=>{const{top:o,scrollTop:c,clientHeight:k,scrollHeight:y}=v(),V=f(),w=[];let E=null,j=null;for(const D of t.anchors){const W=B(D);W&&(w.push(D.id),j=D.id,E??=D.id,W.getBoundingClientRect().top-o<=(D.offset??V)+8&&(E=D.id))}const ie=w.length!==u.value.length||w.some((D,W)=>D!==u.value[W]);return ie&&(u.value=w),z||(j&&c>0&&c+k>=y-2&&(E=j),d.value=E??""),ie};let Y=!1;const ae=()=>{Y||(Y=!0,requestAnimationFrame(()=>{Y=!1,F()&&S()}))},le=o=>{const c=B(o);if(!c)return;d.value=o.id,H(o.id);const k=o.offset??f(),y=m.value;if(y){y.scrollTo({behavior:"smooth",top:c.getBoundingClientRect().top-y.getBoundingClientRect().top+y.scrollTop-k});return}window.scrollTo({behavior:"smooth",top:c.getBoundingClientRect().top+window.scrollY-k})},et=(o,c)=>{c(),le(o)};return e.onMounted(()=>{m.value=b(),O().addEventListener("scroll",ae,{passive:!0}),F(),S(),requestAnimationFrame(()=>{F(),S()})}),e.onBeforeUnmount(()=>{O().removeEventListener("scroll",ae),T(),R&&clearTimeout(R)}),e.watch(()=>t.anchors,()=>{t.anchors.some(o=>o.id===d.value)||(d.value=""),F(),S()},{deep:!0}),(o,c)=>{const k=e.resolveComponent("KButton"),y=e.resolveComponent("KDropdownItem"),V=e.resolveComponent("KDropdown");return e.openBlock(),e.createElementBlock("nav",{ref:"page-layout-anchor-navigation","aria-label":e.unref(s)("anchor_navigation.aria_label"),class:"page-layout-anchor-navigation","data-fit":r.value,"data-testid":"page-layout-anchor-navigation"},[e.createElementVNode("ul",{ref:"page-layout-anchor-navigation-list",class:e.normalizeClass({"layout-hidden":r.value==="hidden"})},[g.value.hasLeadingEllipsis?(e.openBlock(),e.createElementBlock("li",Ne," … ")):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(g.value.anchors,w=>(e.openBlock(),e.createElementBlock("li",{key:`${w.id}-anchor`},[e.createElementVNode("button",{"aria-current":w.id===d.value?"location":void 0,class:e.normalizeClass(["anchor-link",{active:w.id===d.value}]),"data-testid":p(w),title:w.label,type:"button",onClick:E=>le(w)},e.toDisplayString(w.label),11,$e)]))),128)),g.value.hasTrailingEllipsis?(e.openBlock(),e.createElementBlock("li",Se," … ")):e.createCommentVNode("",!0),g.value.hasOverflowDropdown?(e.openBlock(),e.createElementBlock("li",Ie,[e.createVNode(V,{"kpop-attributes":{placement:"bottom-end",popoverElementAttributes:{"data-testid":"anchor-navigation-overflow-dropdown-popover"}}},{items:e.withCtx(({closeDropdown:w})=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.value,E=>(e.openBlock(),e.createBlock(y,{key:`${E.id}-dropdown-item`,"aria-current":E.id===d.value?"location":void 0,"data-testid":p(E),selected:E.id===d.value,onClick:j=>et(E,w)},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(E.label),1)]),_:2},1032,["aria-current","data-testid","selected","onClick"]))),128))]),default:e.withCtx(()=>[e.createVNode(k,{appearance:"tertiary","aria-label":e.unref(s)("anchor_navigation.more_button.aria_label"),class:"anchor-overflow-button","data-testid":"anchor-navigation-overflow-dropdown-button",icon:"",size:"small"},{default:e.withCtx(()=>[e.createVNode(e.unref(L.ChevronDownIcon),{decorative:"",size:`var(--kui-icon-size-30, ${e.unref(A)})`},null,8,["size"])]),_:1},8,["aria-label"])]),_:1})])):e.createCommentVNode("",!0)],2)],8,_e)}}}),[["__scopeId","data-v-f9770830"]]),oe=Symbol("nested-page-layout-detection"),ne="page-layout:new-appearance",De={key:0,class:"page-layout-header","data-testid":"page-layout-header"},Le={class:"page-header-container"},Re={class:"page-header-start"},Ae={class:"title-container"},Pe={key:1,class:"page-layout-title-wrapper"},Ke={class:"page-layout-title","data-testid":"page-layout-title"},ze=["aria-label"],xe={key:3,class:"title-after-container"},Oe={class:"page-header-actions-container"},Fe={key:0,class:"page-layout-aside-container","data-testid":"page-layout-aside"},Me={class:"page-layout-content"},He=M(e.defineComponent({__name:"PageLayout",props:{breadcrumbs:{default:()=>[]},title:{},backTo:{},tabs:{default:()=>[]},anchors:{default:()=>[]},pageShortcutData:{}},setup(t){const s=e.inject("app:navigateTo",null),n=e.inject(ne,null),a=e.inject("app:pageShortcutsContext",null),{i18n:{t:r}}=G.useI18n(),d=q.useRouter(),u=q.useRoute(),l=e.computed(()=>!!(t.tabs&&t.tabs.length)),h=e.computed(()=>typeof t.backTo=="string"),g=e.computed(()=>e.toValue(n)===!0),p=e.computed(()=>g.value&&!l.value&&!!(t.anchors&&t.anchors.length)),m=e.computed(()=>!!t.pageShortcutData&&!!t.pageShortcutData.entityType&&!!t.pageShortcutData.label),b=e.computed(()=>m.value&&!!a&&"onFavoriteToggle"in a&&typeof a.onFavoriteToggle=="function"),B=e.ref(0),f=e.computed(()=>!!a&&"isFavorite"in a&&typeof a.isFavorite=="function"&&a.isFavorite(t.pageShortcutData)===!0),$=async()=>{if(t.backTo){if(typeof t.backTo=="object"){d.push(t.backTo);return}if(typeof s!="function"){window.location.href=t.backTo;return}await s(t.backTo)}},_=e.ref(0),I=e.computed(()=>_.value>0);e.provide(oe,()=>(_.value++,()=>{_.value--}));const K=e.inject(oe,null),i=e.ref(null);typeof K=="function"&&(i.value=K());const S=()=>{a.onFavoriteToggle({...t.pageShortcutData,path:t.pageShortcutData?.path||u.fullPath})};e.onUnmounted(()=>{i.value?.()});const R=he(()=>{!I.value&&m.value&&a&&"onEntityPageVisit"in a&&typeof a.onEntityPageVisit=="function"&&(a.onEntityPageVisit({...t.pageShortcutData,path:t.pageShortcutData?.path||u?.fullPath}),B.value++)},500);return e.watch([()=>t.pageShortcutData,()=>u?.fullPath],()=>{R()},{immediate:!0,deep:!0}),(N,z)=>{const x=e.resolveComponent("KBreadcrumbs"),O=e.resolveComponent("KTooltip"),T=e.resolveComponent("router-view");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["kong-ui-public-page-layout",{"new-appearance":g.value}]),"data-testid":"kong-ui-public-page-layout"},[I.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",De,[e.createElementVNode("div",Le,[e.createElementVNode("div",Re,[t.breadcrumbs&&t.breadcrumbs.length?(e.openBlock(),e.createBlock(x,{key:0,class:"header-breadcrumbs","data-testid":"page-layout-breadcrumbs","item-max-width":"25ch",items:t.breadcrumbs},e.createSlots({_:2},[g.value?{name:"divider",fn:e.withCtx(()=>[e.createVNode(e.unref(L.ChevronRightIcon),{decorative:"",size:`var(--kui-icon-size-30, ${e.unref(A)})`},null,8,["size"])]),key:"0"}:void 0]),1032,["items"])):e.createCommentVNode("",!0),e.createElementVNode("div",Ae,[t.backTo&&!g.value?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(h.value?"a":"router-link"),e.mergeProps({key:0},h.value?{href:t.backTo}:{to:t.backTo},{"aria-label":e.unref(r)("back_button"),class:"navigate-back","data-testid":"page-layout-navigate-back",tabindex:"0",onClick:e.withModifiers($,["prevent"]),onKeydown:e.withKeys(e.withModifiers($,["prevent"]),["enter"])}),{default:e.withCtx(()=>[e.createVNode(e.unref(L.ArrowTopLeftIcon),{decorative:"",size:`var(--kui-icon-size-30, ${e.unref(A)})`},null,8,["size"])]),_:1},16,["aria-label","onKeydown"])):e.createCommentVNode("",!0),t.title||N.$slots.title?(e.openBlock(),e.createElementBlock("span",Pe,[e.renderSlot(N.$slots,"title",{},()=>[e.createElementVNode("h1",Ke,e.toDisplayString(t.title),1)],!0)])):e.createCommentVNode("",!0),b.value?(e.openBlock(),e.createElementBlock("div",{key:B.value,class:"favorite-button-container"},[e.createVNode(O,{placement:"right",text:f.value?e.unref(r)("favorite_button.remove_shortcut"):e.unref(r)("favorite_button.save_shortcut")},{default:e.withCtx(()=>[e.createElementVNode("button",{"aria-label":f.value?e.unref(r)("favorite_button.remove_shortcut"):e.unref(r)("favorite_button.save_shortcut"),class:e.normalizeClass(["favorite-button",{active:f.value}]),"data-testid":"page-layout-favorite-button",type:"button",onClick:S},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(f.value?e.unref(L.StarFillIcon):e.unref(L.StarIcon)),{decorative:"",size:`var(--kui-icon-size-30, ${e.unref(A)})`},null,8,["size"]))],10,ze)]),_:1},8,["text"])])):e.createCommentVNode("",!0),N.$slots["title-after"]?(e.openBlock(),e.createElementBlock("div",xe,[e.renderSlot(N.$slots,"title-after",{},void 0,!0)])):e.createCommentVNode("",!0)])]),p.value?(e.openBlock(),e.createBlock(Ve,{key:0,anchors:t.anchors},null,8,["anchors"])):e.createCommentVNode("",!0),e.createElementVNode("div",Oe,[e.renderSlot(N.$slots,"actions",{},void 0,!0),z[0]||(z[0]=e.createElementVNode("div",{"data-teleport-target":"ask-kai"},null,-1))])]),l.value?(e.openBlock(),e.createBlock(Te,{key:0,tabs:t.tabs},e.createSlots({_:2},[e.renderList(t.tabs,H=>({name:`tab-${H.key}`,fn:e.withCtx(v=>[e.renderSlot(N.$slots,`tab-${H.key}`,e.normalizeProps(e.guardReactiveProps(v)),void 0,!0)])}))]),1032,["tabs"])):e.createCommentVNode("",!0)])),e.createElementVNode("div",{class:e.normalizeClass(["page-layout-content-container",{"has-nested-page-layout":I.value}])},[g.value&&N.$slots.aside?(e.openBlock(),e.createElementBlock("div",Fe,[e.renderSlot(N.$slots,"aside",{},void 0,!0)])):e.createCommentVNode("",!0),e.createElementVNode("div",Me,[l.value?(e.openBlock(),e.createBlock(T,{key:0})):e.renderSlot(N.$slots,"default",{},void 0,!0,1)])],2)],2)}}}),[["__scopeId","data-v-82c7f181"]]),je={key:0,class:"about-card-description","data-testid":"about-card-description"},We={key:1,class:"about-card-skeleton","data-testid":"about-card-skeleton"},qe={key:2,class:"about-card-rows","data-testid":"about-card-rows"},Ge=["data-testid"],Ue={class:"about-card-row-label"},ve={class:"about-card-row-text"},Ye=["aria-label","data-testid"],Je={class:"about-card-row-value"},Ze={class:"about-card-row-text"},Xe={key:3,class:"about-card-content","data-testid":"about-card-content"},Qe=M(e.defineComponent({__name:"AboutCard",props:{title:{default:""},titleTag:{default:"h2"},description:{default:""},rows:{default:()=>[]},isLoading:{type:Boolean,default:!1}},setup(t){const s=e.computed(()=>t.rows.length||4);return(n,a)=>{const r=e.resolveComponent("KSkeletonBox"),d=e.resolveComponent("KTooltip"),u=e.resolveComponent("KCard");return e.openBlock(),e.createBlock(u,{class:"kong-ui-public-about-card",title:t.title,"title-tag":t.titleTag},e.createSlots({default:e.withCtx(()=>[n.$slots.description||t.description?(e.openBlock(),e.createElementBlock("p",je,[e.renderSlot(n.$slots,"description",{},()=>[e.createTextVNode(e.toDisplayString(t.description),1)],!0)])):e.createCommentVNode("",!0),t.isLoading?(e.openBlock(),e.createElementBlock("div",We,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(s.value,l=>(e.openBlock(),e.createBlock(r,{key:l,height:"2",width:"100"}))),128))])):t.rows.length?(e.openBlock(),e.createElementBlock("dl",qe,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.rows,l=>(e.openBlock(),e.createElementBlock("div",{key:l.key,class:"about-card-row","data-testid":`about-card-row-${l.key}`},[e.createElementVNode("dt",Ue,[e.renderSlot(n.$slots,`label-${l.key}`,{row:l},()=>[e.createElementVNode("span",ve,e.toDisplayString(l.label),1)],!0),l.tooltip?(e.openBlock(),e.createBlock(d,{key:0,text:l.tooltip},{default:e.withCtx(()=>[e.createElementVNode("button",{"aria-label":l.tooltip,class:"about-card-row-tooltip-trigger","data-testid":`about-card-row-${l.key}-tooltip`,type:"button"},[e.createVNode(e.unref(L.InfoIcon),{size:`var(--kui-icon-size-20, ${e.unref(ce)})`},null,8,["size"])],8,Ye)]),_:2},1032,["text"])):e.createCommentVNode("",!0)]),e.createElementVNode("dd",Je,[e.renderSlot(n.$slots,`row-${l.key}`,{row:l},()=>[e.createElementVNode("span",Ze,e.toDisplayString(l.value),1)],!0)])],8,Ge))),128))])):e.createCommentVNode("",!0),n.$slots.default?(e.openBlock(),e.createElementBlock("div",Xe,[e.renderSlot(n.$slots,"default",{},void 0,!0)])):e.createCommentVNode("",!0)]),_:2},[n.$slots.title||t.title?{name:"title",fn:e.withCtx(()=>[e.renderSlot(n.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(t.title),1)],!0)]),key:"0"}:void 0,n.$slots.actions?{name:"actions",fn:e.withCtx(()=>[e.renderSlot(n.$slots,"actions",{},void 0,!0)]),key:"1"}:void 0]),1032,["title","title-tag"])}}}),[["__scopeId","data-v-0316c887"]]);C.AboutCard=Qe,C.NEW_APPEARANCE_INJECTION_KEY=ne,C.PageLayout=He,Object.defineProperty(C,Symbol.toStringTag,{value:"Module"})}));

package/dist/style.css

@@ -1 +1 @@
-.page-layout-tabs[data-v-02891bc1]{align-items:flex-end;border-bottom:1px solid #e0e4ea;border-bottom:var(--kui-border-width-10, 1px) solid var(--kui-color-border, #e0e4ea);box-sizing:border-box;display:flex;height:34px;overflow-x:clip;padding:0 16px;padding:var(--kui-space-0, 0px) var(--kui-space-60, 16px);position:relative;width:100%}.page-layout-tabs a[data-v-02891bc1],.page-layout-tabs button[data-v-02891bc1]{background-color:#0000;background-color:var(--kui-color-background-transparent, rgba(0, 0, 0, 0));border:none;color:inherit;cursor:pointer;font:inherit;outline:none;padding:0;padding:var(--kui-space-0, 0px);text-decoration:none}.page-layout-tabs ul[data-v-02891bc1]{display:flex;gap:20px;gap:var(--kui-space-70, 20px);list-style:none;margin:0;margin:var(--kui-space-0, 0px);margin-bottom:-1px;margin-bottom:calc(-1 * var(--kui-border-width-10, 1px));max-width:100%;padding:0;padding:var(--kui-space-0, 0px)}.page-layout-tabs ul.layout-computing[data-v-02891bc1]{height:0;visibility:hidden}.page-layout-tabs ul li[data-v-02891bc1]{display:flex}.page-layout-tabs ul li .tab-link[data-v-02891bc1]{align-items:center;border-bottom:2px solid rgba(0,0,0,0);border-bottom:var(--kui-border-width-20, 2px) solid var(--kui-color-border-transparent, rgba(0, 0, 0, 0));border-radius:4px 4px 0 0;border-radius:var(--kui-border-radius-20, 4px) var(--kui-border-radius-20, 4px) var(--kui-border-radius-0, 0px) var(--kui-border-radius-0, 0px);color:#52596e;color:var(--kui-color-text-neutral-strong, #52596e);cursor:pointer;display:flex;font-size:12px;font-size:var(--kui-font-size-20, 12px);font-weight:500;font-weight:var(--kui-font-weight-medium, 500);gap:6px;gap:var(--kui-space-30, 6px);line-height:20px;line-height:var(--kui-line-height-30, 20px);padding:6px 0;padding:var(--kui-space-30, 6px) var(--kui-space-0, 0px);text-decoration:none;transition:color .2s ease-in,border-color .2s ease-in,font-weight .2s ease-in;white-space:nowrap}.page-layout-tabs ul li .tab-link[data-v-02891bc1]:hover{border-bottom:2px solid #afb7c5;border-bottom:var(--kui-border-width-20, 2px) solid var(--kui-color-border-neutral-weak, #afb7c5);color:#0d0e14;color:var(--kui-color-text, #0d0e14);text-decoration:none}.page-layout-tabs ul li .tab-link[data-v-02891bc1]:focus-visible{box-shadow:0 0 0 4px #0044f433;box-shadow:var(--kui-shadow-focus, 0px 0px 0px 4px rgba(0, 68, 244, .2));text-decoration:none}.page-layout-tabs ul li .tab-link.active[data-v-02891bc1]{border-bottom:2px solid #0044f4;border-bottom:var(--kui-border-width-20, 2px) solid var(--kui-color-border-primary, #0044f4);color:#0044f4!important;color:var(--kui-color-text-primary, #0044f4)!important;font-weight:600;font-weight:var(--kui-font-weight-semibold, 600);text-decoration:none}.page-layout-tabs .layout-loader-container[data-v-02891bc1]{align-items:center;display:flex;gap:20px;gap:var(--kui-space-70, 20px);height:34px;inset:0 0 0 16px;left:var(--kui-space-60, 16px);position:absolute}.page-layout-anchor-navigation[data-v-f9770830]{display:flex;flex:1 1 0;justify-content:center;min-width:0;overflow-x:clip}.page-layout-anchor-navigation ul[data-v-f9770830]{align-items:center;display:flex;flex-shrink:0;gap:2px;gap:var(--kui-space-10, 2px);list-style:none;margin:0;margin:var(--kui-space-0, 0px);padding:0;padding:var(--kui-space-0, 0px)}.page-layout-anchor-navigation ul.layout-hidden[data-v-f9770830]{display:none}.page-layout-anchor-navigation ul li[data-v-f9770830]{display:flex}.page-layout-anchor-navigation .anchor-link[data-v-f9770830]{background-color:#0000;background-color:var(--kui-color-background-transparent, rgba(0, 0, 0, 0));border:none;border-radius:4px;border-radius:var(--kui-border-radius-20, 4px);box-sizing:border-box;color:#6c7489;color:var(--kui-color-text-neutral, #6c7489);cursor:pointer;font-family:inherit;font-size:12px;font-size:var(--kui-font-size-20, 12px);font-weight:500;font-weight:var(--kui-font-weight-medium, 500);line-height:16px;line-height:var(--kui-line-height-20, 16px);max-width:140px;outline:none;overflow:hidden;padding:4px 8px;padding:var(--kui-space-20, 4px) var(--kui-space-40, 8px);text-overflow:ellipsis;transition:background-color .2s ease-in,color .2s ease-in;transition:background-color var(--kui-animation-duration-20, .2s) ease-in,color var(--kui-animation-duration-20, .2s) ease-in;white-space:nowrap}.page-layout-anchor-navigation .anchor-link[data-v-f9770830]:hover{background-color:#f9fafb;background-color:var(--kui-color-background-neutral-weakest, #f9fafb);color:#0d0e14;color:var(--kui-color-text, #0d0e14)}.page-layout-anchor-navigation .anchor-link[data-v-f9770830]:focus-visible{box-shadow:0 0 0 4px #0044f433;box-shadow:var(--kui-shadow-focus, 0px 0px 0px 4px rgba(0, 68, 244, .2))}.page-layout-anchor-navigation .anchor-link.active[data-v-f9770830]{background-color:#0044f4;background-color:var(--kui-color-brand, #0044f4);color:#0d0e14;color:var(--kui-color-text, #0d0e14)}.page-layout-anchor-navigation .anchor-ellipsis[data-v-f9770830]{align-items:center;color:#afb7c5;color:var(--kui-color-text-neutral-weak, #afb7c5);font-size:12px;font-size:var(--kui-font-size-20, 12px);justify-content:center;line-height:16px;line-height:var(--kui-line-height-20, 16px);-webkit-user-select:none;user-select:none;width:16px;width:var(--kui-icon-size-30, 16px)}.page-layout-anchor-navigation .anchor-overflow-button[data-v-f9770830]{color:#6c7489;color:var(--kui-color-text-neutral, #6c7489)}.kong-ui-public-page-layout[data-v-b57669c9]{box-sizing:border-box;container-name:page-layout;container-type:inline-size;font-family:Inter,Roboto,Helvetica,sans-serif;font-family:var(--kui-font-family-text, "Inter", Roboto, Helvetica, sans-serif)}.kong-ui-public-page-layout .page-layout-header[data-v-b57669c9]{background-color:#fff;background-color:var(--kui-color-background, #ffffff);display:flex;flex-direction:column;gap:8px;gap:var(--kui-space-40, 8px)}.kong-ui-public-page-layout .page-layout-header .page-header-container[data-v-b57669c9]{align-items:flex-end;display:flex;gap:6px;gap:var(--kui-space-30, 6px);justify-content:space-between;padding:16px 16px 0;padding:var(--kui-space-60, 16px) var(--kui-space-60, 16px) var(--kui-space-0, 0px) var(--kui-space-60, 16px)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start[data-v-b57669c9]{min-width:0}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .header-breadcrumbs[data-v-b57669c9] .breadcrumbs-item-container:first-child .breadcrumbs-item{padding-left:0;padding-left:var(--kui-space-0, 0px)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .header-breadcrumbs[data-v-b57669c9] .breadcrumbs-item-container .breadcrumbs-item.active .breadcrumbs-text{color:#6c7489;color:var(--kui-color-text-neutral, #6c7489)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container[data-v-b57669c9]{align-items:flex-end;display:flex;gap:4px;gap:var(--kui-space-20, 4px)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .navigate-back[data-v-b57669c9],.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button[data-v-b57669c9]{background-color:#0000;background-color:var(--kui-color-background-transparent, rgba(0, 0, 0, 0));border:none;border-radius:4px;border-radius:var(--kui-border-radius-20, 4px);color:#6c7489;color:var(--kui-color-text-neutral, #6c7489);cursor:pointer;outline:none;padding:4px;padding:var(--kui-space-20, 4px);transition:background-color .2s ease-in,color .2s ease-in}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .navigate-back[data-v-b57669c9]:hover,.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button[data-v-b57669c9]:hover{color:#0d0e14;color:var(--kui-color-text, #0d0e14)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .navigate-back[data-v-b57669c9]:focus-visible,.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button[data-v-b57669c9]:focus-visible{box-shadow:0 0 0 4px #0044f433;box-shadow:var(--kui-shadow-focus, 0px 0px 0px 4px rgba(0, 68, 244, .2))}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .page-layout-title-wrapper[data-v-b57669c9]{min-width:0;overflow:hidden}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .page-layout-title-wrapper[data-v-b57669c9]>*{color:#0d0e14;color:var(--kui-color-text, #0d0e14);font-size:18px;font-size:var(--kui-font-size-50, 18px);font-weight:600;font-weight:var(--kui-font-weight-semibold, 600);line-height:24px;line-height:var(--kui-line-height-40, 24px);margin:0;margin:var(--kui-space-0, 0px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button-container[data-v-b57669c9]{align-self:center;display:flex;margin-left:4px;margin-left:var(--kui-space-20, 4px)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button-container .favorite-button[data-v-b57669c9]{color:#afb7c5;color:var(--kui-color-text-neutral-weak, #afb7c5);padding:0;padding:var(--kui-space-0, 0px)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button-container .favorite-button[data-v-b57669c9]:hover{color:#6c7489;color:var(--kui-color-text-neutral, #6c7489)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button-container .favorite-button.active[data-v-b57669c9]{color:#ffc400;color:var(--kui-color-text-warning-weak, #ffc400)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .title-after-container[data-v-b57669c9]{align-items:flex-end;display:flex;gap:6px;gap:var(--kui-space-30, 6px);margin-left:4px;margin-left:var(--kui-space-20, 4px)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-actions-container[data-v-b57669c9]{align-items:center;display:flex;gap:6px;gap:var(--kui-space-30, 6px)}.kong-ui-public-page-layout .page-layout-header:not(:has(.page-layout-tabs)) .page-header-container[data-v-b57669c9]{border-bottom:1px solid #e0e4ea;border-bottom:var(--kui-border-width-10, 1px) solid var(--kui-color-border, #e0e4ea);padding:16px;padding:var(--kui-space-60, 16px)}.kong-ui-public-page-layout.new-appearance .page-layout-header[data-v-b57669c9]{position:sticky;top:0;z-index:3}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container[data-v-b57669c9]{align-items:center;padding:8px 16px 0;padding:var(--kui-space-40, 8px) var(--kui-space-60, 16px) var(--kui-space-0, 0px) var(--kui-space-60, 16px)}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start[data-v-b57669c9]{align-items:center;display:flex;gap:4px;gap:var(--kui-space-20, 4px)}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start .title-container[data-v-b57669c9]{align-items:center;min-width:0}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start .title-container .page-layout-title-wrapper[data-v-b57669c9]{color:#0d0e14;color:var(--kui-color-text, #0d0e14);font-size:14px;font-size:var(--kui-font-size-30, 14px);font-weight:600;font-weight:var(--kui-font-weight-semibold, 600);line-height:20px;line-height:var(--kui-line-height-30, 20px);max-width:40ch;text-overflow:ellipsis;white-space:nowrap}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start .title-container .page-layout-title-wrapper[data-v-b57669c9]>*{font-size:14px;font-size:var(--kui-font-size-30, 14px);line-height:20px;line-height:var(--kui-line-height-30, 20px);max-width:40ch}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start .header-breadcrumbs[data-v-b57669c9],.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start .title-after-container[data-v-b57669c9]{flex-shrink:0}.kong-ui-public-page-layout.new-appearance .page-layout-header:not(:has(.page-layout-tabs)) .page-header-container[data-v-b57669c9]{box-sizing:border-box;height:44px;padding:8px 16px;padding:var(--kui-space-40, 8px) var(--kui-space-60, 16px)}.kong-ui-public-page-layout .page-layout-content-container[data-v-b57669c9]{background-color:#f9fafb;background-color:var(--kui-color-background-neutral-weakest, #f9fafb);display:flex;flex-direction:column-reverse;gap:12px;gap:var(--kui-space-50, 12px);padding:16px;padding:var(--kui-space-60, 16px)}.kong-ui-public-page-layout .page-layout-content-container.has-nested-page-layout[data-v-b57669c9]{padding:0;padding:var(--kui-space-0, 0px)}@container page-layout (min-width: 1024px){.kong-ui-public-page-layout .page-layout-content-container[data-v-b57669c9]{flex-direction:row-reverse;gap:8px;gap:var(--kui-space-40, 8px)}}.kong-ui-public-page-layout .page-layout-content-container .page-layout-content[data-v-b57669c9]{display:flex;flex-direction:column;gap:12px;gap:var(--kui-space-50, 12px);min-width:0;width:100%}.kong-ui-public-page-layout .page-layout-content-container .page-layout-aside-container[data-v-b57669c9]{display:flex;flex-direction:column;gap:8px;gap:var(--kui-space-40, 8px)}@container page-layout (min-width: 1024px){.kong-ui-public-page-layout .page-layout-content-container .page-layout-aside-container[data-v-b57669c9]{flex-shrink:0;width:400px}}.kong-ui-public-about-card[data-v-0316c887]{--kui-card-gap: var(--kui-space-50, 12px);--kui-card-title-font-size: var(--kui-font-size-30, 14px);container-type:inline-size}.kong-ui-public-about-card .about-card-description[data-v-0316c887]{color:#6c7489;color:var(--kui-color-text-neutral, #6c7489);font-size:14px;font-size:var(--kui-font-size-30, 14px);line-height:20px;line-height:var(--kui-line-height-30, 20px);margin:0 0 16px;margin:var(--kui-space-0, 0px) var(--kui-space-0, 0px) var(--kui-space-60, 16px)}.kong-ui-public-about-card .about-card-skeleton[data-v-0316c887]{display:flex;flex-direction:column;gap:12px;gap:var(--kui-space-50, 12px)}.kong-ui-public-about-card .about-card-rows[data-v-0316c887]{display:flex;flex-direction:column;margin:0;margin:var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row[data-v-0316c887]{align-items:center;border-bottom:1px solid #e0e4ea;border-bottom:var(--kui-border-width-10, 1px) solid var(--kui-color-border, #e0e4ea);display:flex;gap:8px;gap:var(--kui-space-40, 8px);padding:8px 0;padding:var(--kui-space-40, 8px) var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row[data-v-0316c887]:last-child{border-bottom:none;padding-bottom:0;padding-bottom:var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row[data-v-0316c887]:first-child{padding-top:0;padding-top:var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row-label[data-v-0316c887]{align-items:center;color:#0d0e14;color:var(--kui-color-text, #0d0e14);display:flex;flex:0 0 auto;font-size:12px;font-size:var(--kui-font-size-20, 12px);font-weight:500;font-weight:var(--kui-font-weight-medium, 500);gap:4px;gap:var(--kui-space-20, 4px);line-height:16px;line-height:var(--kui-line-height-20, 16px);width:140px}.kong-ui-public-about-card .about-card-row-text[data-v-0316c887]{-webkit-box-orient:vertical;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;overflow-wrap:anywhere}.kong-ui-public-about-card .about-card-row-tooltip-trigger[data-v-0316c887]{align-items:center;background:none;border:none;color:#6c7489;color:var(--kui-color-text-neutral, #6c7489);cursor:pointer;display:flex;padding:0;padding:var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row-value[data-v-0316c887]{color:#6c7489;color:var(--kui-color-text-neutral, #6c7489);flex:1 1 0;font-size:12px;font-size:var(--kui-font-size-20, 12px);line-height:16px;line-height:var(--kui-line-height-20, 16px);margin:0;margin:var(--kui-space-0, 0px);min-width:0;overflow-wrap:anywhere}.kong-ui-public-about-card .about-card-content[data-v-0316c887]{margin-top:16px;margin-top:var(--kui-space-60, 16px)}@container (max-width: 320px){.kong-ui-public-about-card .about-card-row[data-v-0316c887]{align-items:flex-start;flex-direction:column;gap:2px;gap:var(--kui-space-10, 2px)}.kong-ui-public-about-card .about-card-row-label[data-v-0316c887]{width:auto}}
+.page-layout-tabs[data-v-02891bc1]{align-items:flex-end;border-bottom:1px solid #e0e4ea;border-bottom:var(--kui-border-width-10, 1px) solid var(--kui-color-border, #e0e4ea);box-sizing:border-box;display:flex;height:34px;overflow-x:clip;padding:0 16px;padding:var(--kui-space-0, 0px) var(--kui-space-60, 16px);position:relative;width:100%}.page-layout-tabs a[data-v-02891bc1],.page-layout-tabs button[data-v-02891bc1]{background-color:#0000;background-color:var(--kui-color-background-transparent, rgba(0, 0, 0, 0));border:none;color:inherit;cursor:pointer;font:inherit;outline:none;padding:0;padding:var(--kui-space-0, 0px);text-decoration:none}.page-layout-tabs ul[data-v-02891bc1]{display:flex;gap:20px;gap:var(--kui-space-70, 20px);list-style:none;margin:0;margin:var(--kui-space-0, 0px);margin-bottom:-1px;margin-bottom:calc(-1 * var(--kui-border-width-10, 1px));max-width:100%;padding:0;padding:var(--kui-space-0, 0px)}.page-layout-tabs ul.layout-computing[data-v-02891bc1]{height:0;visibility:hidden}.page-layout-tabs ul li[data-v-02891bc1]{display:flex}.page-layout-tabs ul li .tab-link[data-v-02891bc1]{align-items:center;border-bottom:2px solid rgba(0,0,0,0);border-bottom:var(--kui-border-width-20, 2px) solid var(--kui-color-border-transparent, rgba(0, 0, 0, 0));border-radius:4px 4px 0 0;border-radius:var(--kui-border-radius-20, 4px) var(--kui-border-radius-20, 4px) var(--kui-border-radius-0, 0px) var(--kui-border-radius-0, 0px);color:#52596e;color:var(--kui-color-text-neutral-strong, #52596e);cursor:pointer;display:flex;font-size:12px;font-size:var(--kui-font-size-20, 12px);font-weight:500;font-weight:var(--kui-font-weight-medium, 500);gap:6px;gap:var(--kui-space-30, 6px);line-height:20px;line-height:var(--kui-line-height-30, 20px);padding:6px 0;padding:var(--kui-space-30, 6px) var(--kui-space-0, 0px);text-decoration:none;transition:color .2s ease-in,border-color .2s ease-in,font-weight .2s ease-in;white-space:nowrap}.page-layout-tabs ul li .tab-link[data-v-02891bc1]:hover{border-bottom:2px solid #afb7c5;border-bottom:var(--kui-border-width-20, 2px) solid var(--kui-color-border-neutral-weak, #afb7c5);color:#0d0e14;color:var(--kui-color-text, #0d0e14);text-decoration:none}.page-layout-tabs ul li .tab-link[data-v-02891bc1]:focus-visible{box-shadow:0 0 0 4px #0044f433;box-shadow:var(--kui-shadow-focus, 0px 0px 0px 4px rgba(0, 68, 244, .2));text-decoration:none}.page-layout-tabs ul li .tab-link.active[data-v-02891bc1]{border-bottom:2px solid #0044f4;border-bottom:var(--kui-border-width-20, 2px) solid var(--kui-color-border-primary, #0044f4);color:#0044f4!important;color:var(--kui-color-text-primary, #0044f4)!important;font-weight:600;font-weight:var(--kui-font-weight-semibold, 600);text-decoration:none}.page-layout-tabs .layout-loader-container[data-v-02891bc1]{align-items:center;display:flex;gap:20px;gap:var(--kui-space-70, 20px);height:34px;inset:0 0 0 16px;left:var(--kui-space-60, 16px);position:absolute}.page-layout-anchor-navigation[data-v-f9770830]{display:flex;flex:1 1 0;justify-content:center;min-width:0;overflow-x:clip}.page-layout-anchor-navigation ul[data-v-f9770830]{align-items:center;display:flex;flex-shrink:0;gap:2px;gap:var(--kui-space-10, 2px);list-style:none;margin:0;margin:var(--kui-space-0, 0px);padding:0;padding:var(--kui-space-0, 0px)}.page-layout-anchor-navigation ul.layout-hidden[data-v-f9770830]{display:none}.page-layout-anchor-navigation ul li[data-v-f9770830]{display:flex}.page-layout-anchor-navigation .anchor-link[data-v-f9770830]{background-color:#0000;background-color:var(--kui-color-background-transparent, rgba(0, 0, 0, 0));border:none;border-radius:4px;border-radius:var(--kui-border-radius-20, 4px);box-sizing:border-box;color:#6c7489;color:var(--kui-color-text-neutral, #6c7489);cursor:pointer;font-family:inherit;font-size:12px;font-size:var(--kui-font-size-20, 12px);font-weight:500;font-weight:var(--kui-font-weight-medium, 500);line-height:16px;line-height:var(--kui-line-height-20, 16px);max-width:140px;outline:none;overflow:hidden;padding:4px 8px;padding:var(--kui-space-20, 4px) var(--kui-space-40, 8px);text-overflow:ellipsis;transition:background-color .2s ease-in,color .2s ease-in;transition:background-color var(--kui-animation-duration-20, .2s) ease-in,color var(--kui-animation-duration-20, .2s) ease-in;white-space:nowrap}.page-layout-anchor-navigation .anchor-link[data-v-f9770830]:hover{background-color:#f9fafb;background-color:var(--kui-color-background-neutral-weakest, #f9fafb);color:#0d0e14;color:var(--kui-color-text, #0d0e14)}.page-layout-anchor-navigation .anchor-link[data-v-f9770830]:focus-visible{box-shadow:0 0 0 4px #0044f433;box-shadow:var(--kui-shadow-focus, 0px 0px 0px 4px rgba(0, 68, 244, .2))}.page-layout-anchor-navigation .anchor-link.active[data-v-f9770830]{background-color:#0044f4;background-color:var(--kui-color-brand, #0044f4);color:#0d0e14;color:var(--kui-color-text, #0d0e14)}.page-layout-anchor-navigation .anchor-ellipsis[data-v-f9770830]{align-items:center;color:#afb7c5;color:var(--kui-color-text-neutral-weak, #afb7c5);font-size:12px;font-size:var(--kui-font-size-20, 12px);justify-content:center;line-height:16px;line-height:var(--kui-line-height-20, 16px);-webkit-user-select:none;user-select:none;width:16px;width:var(--kui-icon-size-30, 16px)}.page-layout-anchor-navigation .anchor-overflow-button[data-v-f9770830]{color:#6c7489;color:var(--kui-color-text-neutral, #6c7489)}.kong-ui-public-page-layout[data-v-82c7f181]{box-sizing:border-box;container-name:page-layout;container-type:inline-size;font-family:Inter,Roboto,Helvetica,sans-serif;font-family:var(--kui-font-family-text, "Inter", Roboto, Helvetica, sans-serif)}.kong-ui-public-page-layout .page-layout-header[data-v-82c7f181]{background-color:#fff;background-color:var(--kui-color-background, #ffffff);display:flex;flex-direction:column;gap:8px;gap:var(--kui-space-40, 8px)}.kong-ui-public-page-layout .page-layout-header .page-header-container[data-v-82c7f181]{align-items:flex-end;display:flex;gap:6px;gap:var(--kui-space-30, 6px);justify-content:space-between;padding:16px 16px 0;padding:var(--kui-space-60, 16px) var(--kui-space-60, 16px) var(--kui-space-0, 0px) var(--kui-space-60, 16px)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start[data-v-82c7f181]{min-width:0}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .header-breadcrumbs[data-v-82c7f181] .breadcrumbs-item-container:first-child .breadcrumbs-item{padding-left:0;padding-left:var(--kui-space-0, 0px)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .header-breadcrumbs[data-v-82c7f181] .breadcrumbs-item-container .breadcrumbs-item.active .breadcrumbs-text{color:#6c7489;color:var(--kui-color-text-neutral, #6c7489)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container[data-v-82c7f181]{align-items:flex-end;display:flex;gap:4px;gap:var(--kui-space-20, 4px)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .navigate-back[data-v-82c7f181],.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button[data-v-82c7f181]{background-color:#0000;background-color:var(--kui-color-background-transparent, rgba(0, 0, 0, 0));border:none;border-radius:4px;border-radius:var(--kui-border-radius-20, 4px);color:#6c7489;color:var(--kui-color-text-neutral, #6c7489);cursor:pointer;outline:none;padding:4px;padding:var(--kui-space-20, 4px);transition:background-color .2s ease-in,color .2s ease-in}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .navigate-back[data-v-82c7f181]:hover,.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button[data-v-82c7f181]:hover{color:#0d0e14;color:var(--kui-color-text, #0d0e14)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .navigate-back[data-v-82c7f181]:focus-visible,.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button[data-v-82c7f181]:focus-visible{box-shadow:0 0 0 4px #0044f433;box-shadow:var(--kui-shadow-focus, 0px 0px 0px 4px rgba(0, 68, 244, .2))}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .page-layout-title-wrapper[data-v-82c7f181]{min-width:0;overflow:hidden}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .page-layout-title-wrapper[data-v-82c7f181]>*{color:#0d0e14;color:var(--kui-color-text, #0d0e14);font-size:18px;font-size:var(--kui-font-size-50, 18px);font-weight:600;font-weight:var(--kui-font-weight-semibold, 600);line-height:24px;line-height:var(--kui-line-height-40, 24px);margin:0;margin:var(--kui-space-0, 0px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button-container[data-v-82c7f181]{align-self:center;display:flex;margin-left:4px;margin-left:var(--kui-space-20, 4px)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button-container .favorite-button[data-v-82c7f181]{color:#afb7c5;color:var(--kui-color-text-neutral-weak, #afb7c5);padding:0;padding:var(--kui-space-0, 0px)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button-container .favorite-button[data-v-82c7f181]:hover{color:#6c7489;color:var(--kui-color-text-neutral, #6c7489)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button-container .favorite-button.active[data-v-82c7f181]{color:#ffc400;color:var(--kui-color-text-warning-weak, #ffc400)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .title-after-container[data-v-82c7f181]{align-items:flex-end;display:flex;gap:6px;gap:var(--kui-space-30, 6px);margin-left:4px;margin-left:var(--kui-space-20, 4px)}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-actions-container[data-v-82c7f181]{align-items:center;display:flex;gap:6px;gap:var(--kui-space-30, 6px)}.kong-ui-public-page-layout .page-layout-header:not(:has(.page-layout-tabs)) .page-header-container[data-v-82c7f181]{border-bottom:1px solid #e0e4ea;border-bottom:var(--kui-border-width-10, 1px) solid var(--kui-color-border, #e0e4ea);padding:16px;padding:var(--kui-space-60, 16px)}.kong-ui-public-page-layout.new-appearance .page-layout-header[data-v-82c7f181]{position:sticky;top:0;z-index:3}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container[data-v-82c7f181]{align-items:center;padding:8px 16px 0;padding:var(--kui-space-40, 8px) var(--kui-space-60, 16px) var(--kui-space-0, 0px) var(--kui-space-60, 16px)}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start[data-v-82c7f181]{align-items:center;display:flex;gap:4px;gap:var(--kui-space-20, 4px)}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start .title-container[data-v-82c7f181]{align-items:center;min-width:0}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start .title-container .page-layout-title-wrapper[data-v-82c7f181]{color:#0d0e14;color:var(--kui-color-text, #0d0e14);font-size:14px;font-size:var(--kui-font-size-30, 14px);font-weight:600;font-weight:var(--kui-font-weight-semibold, 600);line-height:20px;line-height:var(--kui-line-height-30, 20px);max-width:40ch;text-overflow:ellipsis;white-space:nowrap}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start .title-container .page-layout-title-wrapper[data-v-82c7f181]>*{font-size:14px;font-size:var(--kui-font-size-30, 14px);line-height:20px;line-height:var(--kui-line-height-30, 20px);max-width:40ch}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start .header-breadcrumbs[data-v-82c7f181],.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start .title-after-container[data-v-82c7f181]{flex-shrink:0}.kong-ui-public-page-layout.new-appearance .page-layout-header:not(:has(.page-layout-tabs)) .page-header-container[data-v-82c7f181]{box-sizing:border-box;height:44px;padding:8px 16px;padding:var(--kui-space-40, 8px) var(--kui-space-60, 16px)}.kong-ui-public-page-layout .page-layout-content-container[data-v-82c7f181]{background-color:#f9fafb;background-color:var(--kui-color-background-neutral-weakest, #f9fafb);display:flex;flex-direction:column-reverse;gap:12px;gap:var(--kui-space-50, 12px);padding:16px;padding:var(--kui-space-60, 16px)}.kong-ui-public-page-layout .page-layout-content-container.has-nested-page-layout[data-v-82c7f181]{padding:0;padding:var(--kui-space-0, 0px)}@container page-layout (min-width: 1024px){.kong-ui-public-page-layout .page-layout-content-container[data-v-82c7f181]{flex-direction:row-reverse;gap:8px;gap:var(--kui-space-40, 8px)}}.kong-ui-public-page-layout .page-layout-content-container .page-layout-content[data-v-82c7f181]{display:flex;flex-direction:column;gap:12px;gap:var(--kui-space-50, 12px);min-width:0;width:100%}.kong-ui-public-page-layout .page-layout-content-container .page-layout-aside-container[data-v-82c7f181]{display:flex;flex-direction:column;gap:8px;gap:var(--kui-space-40, 8px)}@container page-layout (min-width: 1024px){.kong-ui-public-page-layout .page-layout-content-container .page-layout-aside-container[data-v-82c7f181]{flex-shrink:0;width:400px}}.kong-ui-public-about-card[data-v-0316c887]{--kui-card-gap: var(--kui-space-50, 12px);--kui-card-title-font-size: var(--kui-font-size-30, 14px);container-type:inline-size}.kong-ui-public-about-card .about-card-description[data-v-0316c887]{color:#6c7489;color:var(--kui-color-text-neutral, #6c7489);font-size:14px;font-size:var(--kui-font-size-30, 14px);line-height:20px;line-height:var(--kui-line-height-30, 20px);margin:0 0 16px;margin:var(--kui-space-0, 0px) var(--kui-space-0, 0px) var(--kui-space-60, 16px)}.kong-ui-public-about-card .about-card-skeleton[data-v-0316c887]{display:flex;flex-direction:column;gap:12px;gap:var(--kui-space-50, 12px)}.kong-ui-public-about-card .about-card-rows[data-v-0316c887]{display:flex;flex-direction:column;margin:0;margin:var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row[data-v-0316c887]{align-items:center;border-bottom:1px solid #e0e4ea;border-bottom:var(--kui-border-width-10, 1px) solid var(--kui-color-border, #e0e4ea);display:flex;gap:8px;gap:var(--kui-space-40, 8px);padding:8px 0;padding:var(--kui-space-40, 8px) var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row[data-v-0316c887]:last-child{border-bottom:none;padding-bottom:0;padding-bottom:var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row[data-v-0316c887]:first-child{padding-top:0;padding-top:var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row-label[data-v-0316c887]{align-items:center;color:#0d0e14;color:var(--kui-color-text, #0d0e14);display:flex;flex:0 0 auto;font-size:12px;font-size:var(--kui-font-size-20, 12px);font-weight:500;font-weight:var(--kui-font-weight-medium, 500);gap:4px;gap:var(--kui-space-20, 4px);line-height:16px;line-height:var(--kui-line-height-20, 16px);width:140px}.kong-ui-public-about-card .about-card-row-text[data-v-0316c887]{-webkit-box-orient:vertical;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;overflow-wrap:anywhere}.kong-ui-public-about-card .about-card-row-tooltip-trigger[data-v-0316c887]{align-items:center;background:none;border:none;color:#6c7489;color:var(--kui-color-text-neutral, #6c7489);cursor:pointer;display:flex;padding:0;padding:var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row-value[data-v-0316c887]{color:#6c7489;color:var(--kui-color-text-neutral, #6c7489);flex:1 1 0;font-size:12px;font-size:var(--kui-font-size-20, 12px);line-height:16px;line-height:var(--kui-line-height-20, 16px);margin:0;margin:var(--kui-space-0, 0px);min-width:0;overflow-wrap:anywhere}.kong-ui-public-about-card .about-card-content[data-v-0316c887]{margin-top:16px;margin-top:var(--kui-space-60, 16px)}@container (max-width: 320px){.kong-ui-public-about-card .about-card-row[data-v-0316c887]{align-items:flex-start;flex-direction:column;gap:2px;gap:var(--kui-space-10, 2px)}.kong-ui-public-about-card .about-card-row-label[data-v-0316c887]{width:auto}}

package/dist/types/components/PageLayout.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PageLayout.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PageLayout.vue"],"names":[],"mappings":"AAiiBA,OAAO,KAAK,EAAE,eAAe,EAAE,eAAe,EAAoB,MAAM,UAAU,CAAA;AAqBlF,KAAK,WAAW,GAAG,eAAe,CAAC;AA8bnC,QAAA,MAAM,UAAU,0SAEd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
+{"version":3,"file":"PageLayout.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PageLayout.vue"],"names":[],"mappings":"AAoiBA,OAAO,KAAK,EAAE,eAAe,EAAE,eAAe,EAAoB,MAAM,UAAU,CAAA;AAqBlF,KAAK,WAAW,GAAG,eAAe,CAAC;AAgcnC,QAAA,MAAM,UAAU,0SAEd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kong-ui-public/page-layout",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "type": "module",
   "main": "./dist/page-layout.umd.js",
   "module": "./dist/page-layout.es.js",