@kong-ui-public/page-layout 1.3.2 → 1.3.3-pr.3958.1339dfc7e.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/page-layout.es.js
CHANGED
|
@@ -638,7 +638,7 @@ const Tt = {
|
|
|
638
638
|
], 2);
|
|
639
639
|
};
|
|
640
640
|
}
|
|
641
|
-
}), da = /* @__PURE__ */ pe(Yt, [["__scopeId", "data-v-
|
|
641
|
+
}), da = /* @__PURE__ */ pe(Yt, [["__scopeId", "data-v-3e9b1adf"]]), Zt = {
|
|
642
642
|
key: 0,
|
|
643
643
|
class: "about-card-description",
|
|
644
644
|
"data-testid": "about-card-description"
|
|
@@ -745,7 +745,7 @@ const Tt = {
|
|
|
745
745
|
]), 1032, ["title", "title-tag"]);
|
|
746
746
|
};
|
|
747
747
|
}
|
|
748
|
-
}), va = /* @__PURE__ */ pe(sa, [["__scopeId", "data-v-
|
|
748
|
+
}), va = /* @__PURE__ */ pe(sa, [["__scopeId", "data-v-3ecdd6e6"]]);
|
|
749
749
|
export {
|
|
750
750
|
va as AboutCard,
|
|
751
751
|
Ot as NEW_APPEARANCE_INJECTION_KEY,
|
package/dist/page-layout.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(B,t){typeof exports=="object"&&typeof module<"u"?t(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"],t):(B=typeof globalThis<"u"?globalThis:B||self,t(B["kong-ui-public-page-layout"]={},B.Vue,B.VueRouter,B["kong-ui-public-i18n"],B.KongIcons))})(this,(function(B,t,J,tt,D){"use strict";const mt={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 ft(){const e=tt.createI18n("en-us",mt);return{i18n:e,i18nT:tt.i18nTComponent(e)}}const Z={useI18n:ft},ht="12px",O="16px",gt="2px",et="16px";function kt(e,c){return t.getCurrentScope()?(t.onScopeDispose(e,c),!0):!1}const bt=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const x=()=>{};function yt(e,c){function n(...l){return new Promise((s,d)=>{Promise.resolve(e(()=>c.apply(this,l),{fn:c,thisArg:this,args:l})).then(s).catch(d)})}return"cancel"in e&&Object.assign(n,{cancel:e.cancel,flush:e.flush,isPending:e.isPending}),n}function wt(e,c={}){let n,l,s=x,d=x;const u=t.shallowRef(!1),i=p=>{clearTimeout(p),s(),s=x};let k;return Object.assign(p=>{const m=t.toValue(e),C=t.toValue(c.maxWait);return n&&i(n),m<=0||C!==void 0&&C<=0?(l&&(i(l),l=void 0),u.value=!1,Promise.resolve(p())):(u.value=!0,new Promise((E,f)=>{s=c.rejectOnCancel?f:E,d=E,k=p,C&&!l&&(l=setTimeout(()=>{n&&i(n),l=void 0,u.value=!1,E(k())},C)),n=setTimeout(()=>{l&&i(l),l=void 0,u.value=!1,E(p())},m)}))},{cancel:()=>{n&&(i(n),n=void 0),l&&(i(l),l=void 0),u.value=!1,d=x},flush:()=>{if(u.value){n&&(clearTimeout(n),n=void 0),l&&(clearTimeout(l),l=void 0),u.value=!1;const p=d;s=x,d=x,p(k())}},isPending:t.shallowReadonly(u)})}function Ct(e,c=200,n={}){return yt(wt(c,n),e)}const Bt=bt?window:void 0;function ot(e){var c;const n=t.toValue(e);return(c=n?.$el)!==null&&c!==void 0?c:n}function Et(){const e=t.shallowRef(!1),c=t.getCurrentInstance();return c&&t.onMounted(()=>{e.value=!0},c),e}function Tt(e){const c=Et();return t.computed(()=>(c.value,!!e()))}function nt(e,c,n={}){const{window:l=Bt,...s}=n;let d;const u=Tt(()=>l&&"ResizeObserver"in l),i=()=>{d&&(d.disconnect(),d=void 0)},k=t.watch(t.computed(()=>{const p=t.toValue(e);return Array.isArray(p)?p.map(m=>ot(m)):[ot(p)]}),p=>{if(i(),u.value&&l){d=new ResizeObserver(c);for(const m of p)m&&d.observe(m,s)}},{immediate:!0,flush:"post"}),b=()=>{i(),k()};return kt(b),{isSupported:u,stop:b}}const _t={ref:"page-layout-tabs",class:"page-layout-tabs","data-testid":"page-layout-tabs"},Nt={key:0},St=["aria-label"],$t={key:0,class:"layout-loader-container"},It=t.defineComponent({__name:"PageLayoutTabs",props:{tabs:{default:()=>[]}},setup(e){const{i18n:{t:c}}=Z.useI18n(),n=J.useRouter(),l=t.inject("app:navigateTo",null),s=f=>{if(typeof f.to!="string"){n.push(f.to);return}if(typeof l!="function"){window.location.href=f.to;return}l(f.to)},d=t.useTemplateRef("page-layout-tabs"),u=t.useTemplateRef("page-layout-tabs-list"),i=t.ref(e.tabs.length),k=t.ref(!1),b=t.computed(()=>e.tabs.slice(0,i.value)),p=t.computed(()=>e.tabs.slice(i.value)),m=async()=>{if(!d.value||!u.value)return;k.value=!1,i.value=e.tabs.length,await t.nextTick();const f=d.value?.getBoundingClientRect().width-parseInt(et)*2;let I=u.value?.getBoundingClientRect().width;if(!f||!I){k.value=!0;return}const _=50;for(;I+_>f&&i.value>1;)i.value--,await t.nextTick(),I=u.value?.getBoundingClientRect().width||0;k.value=!0};let C=null;const E=()=>{C&&clearTimeout(C),C=setTimeout(()=>{m()},150)};return t.onMounted(()=>{m(),nt(d,E)}),t.onBeforeUnmount(()=>{C&&clearTimeout(C)}),t.watch(()=>e.tabs,()=>{m()},{deep:!0}),(f,I)=>{const _=t.resolveComponent("KDropdownItem"),V=t.resolveComponent("KDropdown"),z=t.resolveComponent("KSkeletonBox");return t.openBlock(),t.createElementBlock("nav",_t,[t.createElementVNode("ul",{ref:"page-layout-tabs-list",class:t.normalizeClass({"layout-computing":!k.value})},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(b.value,r=>(t.openBlock(),t.createElementBlock("li",{key:`${r.key}-tab`},[(t.openBlock(),t.createBlock(t.resolveDynamicComponent(typeof r.to=="string"?"a":"router-link"),t.mergeProps({ref_for:!0},typeof r.to=="string"?{href:r.to}:{to:r.to},{"aria-current":r.active?"page":void 0,class:["tab-link",{active:r.active}],"data-testid":r.dataTestId?r.dataTestId:`page-layout-tab-${r.key}`,tabindex:"0",onClick:t.withModifiers(A=>s(r),["prevent"]),onKeydown:t.withKeys(t.withModifiers(A=>s(r),["prevent"]),["enter"])}),{default:t.withCtx(()=>[t.renderSlot(f.$slots,`tab-${r.key}`,{tab:r},()=>[t.createTextVNode(t.toDisplayString(r.label),1)],!0)]),_:2},1040,["aria-current","class","data-testid","onClick","onKeydown"]))]))),128)),e.tabs.length>i.value?(t.openBlock(),t.createElementBlock("li",Nt,[t.createVNode(V,{"kpop-attributes":{placement:"bottom-end",popoverElementAttributes:{"data-testid":"tabs-overflow-dropdown-popover"}}},{items:t.withCtx(()=>[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(p.value,r=>(t.openBlock(),t.createBlock(_,{key:`${r.key}-dropdown-item`,"aria-current":r.active?"page":void 0,"data-testid":r.dataTestId?r.dataTestId:`page-layout-tab-${r.key}`,item:{label:r.label,value:r.key,to:r.to},selected:r.active},{default:t.withCtx(()=>[t.renderSlot(f.$slots,`tab-${r.key}`,{tab:r},()=>[t.createTextVNode(t.toDisplayString(r.label),1)],!0)]),_:2},1032,["aria-current","data-testid","item","selected"]))),128))]),default:t.withCtx(()=>[t.createElementVNode("button",{"aria-label":t.unref(c)("tabs.more_button.aria_label"),class:t.normalizeClass(["tab-link",{active:p.value.find(r=>r.active)}]),"data-testid":"tabs-overflow-dropdown-button"},[t.createTextVNode(t.toDisplayString(t.unref(c)("tabs.more_button.label"))+" ",1),t.createVNode(t.unref(D.ChevronDownIcon),{decorative:"",size:`var(--kui-icon-size-30, ${t.unref(O)})`},null,8,["size"])],10,St)]),_:3})])):t.createCommentVNode("",!0)],2),k.value?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("div",$t,[(t.openBlock(),t.createElementBlock(t.Fragment,null,t.renderList(3,r=>t.createVNode(z,{key:`layout-loader-${r}`,height:"1",width:"5"})),64))]))],512)}}}),U=(e,c)=>{const n=e.__vccOpts||e;for(const[l,s]of c)n[l]=s;return n},At=U(It,[["__scopeId","data-v-02891bc1"]]),Vt=["aria-label","data-fit"],Dt={key:0,"aria-hidden":"true",class:"anchor-ellipsis","data-testid":"anchor-navigation-leading-ellipsis"},Lt=["aria-current","data-testid","title","onClick"],Rt={key:1,"aria-hidden":"true",class:"anchor-ellipsis","data-testid":"anchor-navigation-trailing-ellipsis"},Pt={key:2},at=140,lt=22,X=16,j="data-anchor-attention",Kt=1200,Ot=1600,xt=U(t.defineComponent({__name:"PageLayoutAnchorNavigation",props:{anchors:{default:()=>[]}},setup(e){const{i18n:{t:c}}=Z.useI18n(),n=t.useTemplateRef("page-layout-anchor-navigation"),l=t.useTemplateRef("page-layout-anchor-navigation-list"),s=t.ref("all"),d=t.ref(""),u=t.ref([]),i=t.computed(()=>e.anchors.filter(o=>u.value.includes(o.id))),k=t.computed(()=>{const o=i.value.findIndex(a=>a.id===d.value);return o===-1?0:o}),b=t.computed(()=>{const o=i.value,a=o.length,h=k.value;if(s.value==="all")return{anchors:o,hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!1};if(s.value==="hidden")return{anchors:[],hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!1};if(s.value==="active-only")return{anchors:o.slice(h,h+1),hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!0};const y=s.value==="window-3"?3:2;if(a<=y)return{anchors:o,hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!0};const S=h<y?0:h>=a-y?a-y:h-1;return{anchors:o.slice(S,S+y),hasLeadingEllipsis:S>0,hasTrailingEllipsis:S+y<a,hasOverflowDropdown:!0}}),p=o=>o.dataTestId??`page-layout-anchor-${o.id.replace(/[^\w-]+/g,"-").replace(/^-+|-+$/g,"")}`,m=t.ref(null),C=()=>{let o=n.value?.parentElement??null;for(;o;){const{overflowY:a}=getComputedStyle(o);if(a==="auto"||a==="scroll"||a==="overlay")return o;o=o.parentElement}return null},E=o=>{if(o.element)return o.element.isConnected?o.element:null;const a=m.value??document;try{return a.querySelector(o.id)??a.querySelector(`#${CSS.escape(o.id)}`)}catch{return null}},f=()=>(n.value?.closest(".page-layout-header")?.getBoundingClientRect().height??0)+parseInt(et,10),I=parseInt(O,10),_=parseInt(gt,10),V=o=>o*at+2*I+lt+(o+2)*_+X,z=()=>at+lt+_+X;let r=0;const A=async()=>{if(!i.value.length){s.value="hidden";return}const o=++r;if(s.value="all",await t.nextTick(),o!==r||!n.value||!l.value)return;const a=n.value.getBoundingClientRect().width,h=l.value.getBoundingClientRect().width;a<=0||h<=0||h+X<=a||(V(3)<=a?s.value="window-3":V(2)<=a?s.value="window-2":z()<=a?s.value="active-only":s.value="hidden")};let L=null;nt(n,()=>{L&&clearTimeout(L),L=setTimeout(()=>{q(),A()},150)});let F=null,M=null,R=0,G=0,P=null,v=null;const st=o=>{const a=String(++R);ct(),v=o,o.removeAttribute(j),G=requestAnimationFrame(()=>{o.setAttribute(j,a),P=setTimeout(()=>{o.getAttribute(j)===a&&o.removeAttribute(j)},Kt)})},ct=()=>{cancelAnimationFrame(G),P&&(clearTimeout(P),P=null),v?.removeAttribute(j),v=null},W=()=>m.value??window,se=new Set(["ArrowUp","ArrowDown","PageUp","PageDown","Home","End"," "]),T=o=>{if(o instanceof KeyboardEvent&&!se.has(o.key))return;o&&o.type!=="scrollend"&&R++,F=null,M&&(clearTimeout(M),M=null);const a=W();a.removeEventListener("scrollend",T),a.removeEventListener("wheel",T),a.removeEventListener("touchstart",T),a.removeEventListener("keydown",T)},ce=o=>{T(),F=o;const a=W();a.addEventListener("scrollend",T,{once:!0}),a.addEventListener("wheel",T,{passive:!0}),a.addEventListener("touchstart",T,{passive:!0}),a.addEventListener("keydown",T,{passive:!0}),M=setTimeout(T,1e3)},dt=()=>{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}},q=()=>{const{top:o,scrollTop:a,clientHeight:h,scrollHeight:y}=dt(),S=f(),w=[];let g=null,K=null;for(const $ of e.anchors){const H=E($);H&&(w.push($.id),K=$.id,g??=$.id,H.getBoundingClientRect().top-o<=($.offset??S)+8&&(g=$.id))}const Y=w.length!==u.value.length||w.some(($,H)=>$!==u.value[H]);return Y&&(u.value=w),F||(K&&a>0&&a+h>=y-2&&(g=K),d.value=g??""),Y};let Q=!1;const ut=()=>{Q||(Q=!0,requestAnimationFrame(()=>{Q=!1,q()&&A()}))},de=o=>{const a=W();let h=!1;const y=()=>{h||(h=!0,a.removeEventListener("scrollend",y),o())};a.addEventListener("scrollend",y,{once:!0}),window.setTimeout(y,Ot)},pt=o=>{const a=E(o);if(!a)return;d.value=o.id,ce(o.id);const h=o.offset??f(),{scrollTop:y,clientHeight:S,scrollHeight:w}=dt(),g=m.value,K=g?a.getBoundingClientRect().top-g.getBoundingClientRect().top+g.scrollTop-h:a.getBoundingClientRect().top+window.scrollY-h,Y=Math.min(Math.max(K,0),Math.max(w-S,0)),$=Math.abs(Y-y)>=2,H=++R;if((g??window).scrollTo({behavior:"smooth",top:K}),!$){st(a);return}de(()=>{H===R&&st(a)})},ue=(o,a)=>{a(),pt(o)};return t.onMounted(()=>{m.value=C(),W().addEventListener("scroll",ut,{passive:!0}),q(),A(),requestAnimationFrame(()=>{q(),A()})}),t.onBeforeUnmount(()=>{W().removeEventListener("scroll",ut),T(),R++,ct(),L&&clearTimeout(L)}),t.watch(()=>e.anchors,()=>{e.anchors.some(o=>o.id===d.value)||(d.value=""),q(),A()},{deep:!0}),(o,a)=>{const h=t.resolveComponent("KButton"),y=t.resolveComponent("KDropdownItem"),S=t.resolveComponent("KDropdown");return t.openBlock(),t.createElementBlock("nav",{ref:"page-layout-anchor-navigation","aria-label":t.unref(c)("anchor_navigation.aria_label"),class:"page-layout-anchor-navigation","data-fit":s.value,"data-testid":"page-layout-anchor-navigation"},[t.createElementVNode("ul",{ref:"page-layout-anchor-navigation-list",class:t.normalizeClass({"layout-hidden":s.value==="hidden"})},[b.value.hasLeadingEllipsis?(t.openBlock(),t.createElementBlock("li",Dt," … ")):t.createCommentVNode("",!0),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(b.value.anchors,w=>(t.openBlock(),t.createElementBlock("li",{key:`${w.id}-anchor`},[t.createElementVNode("button",{"aria-current":w.id===d.value?"location":void 0,class:t.normalizeClass(["anchor-link",{active:w.id===d.value}]),"data-testid":p(w),title:w.label,type:"button",onClick:g=>pt(w)},t.toDisplayString(w.label),11,Lt)]))),128)),b.value.hasTrailingEllipsis?(t.openBlock(),t.createElementBlock("li",Rt," … ")):t.createCommentVNode("",!0),b.value.hasOverflowDropdown?(t.openBlock(),t.createElementBlock("li",Pt,[t.createVNode(S,{"kpop-attributes":{placement:"bottom-end",popoverElementAttributes:{"data-testid":"anchor-navigation-overflow-dropdown-popover"}}},{items:t.withCtx(({closeDropdown:w})=>[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(i.value,g=>(t.openBlock(),t.createBlock(y,{key:`${g.id}-dropdown-item`,"aria-current":g.id===d.value?"location":void 0,"data-testid":p(g),selected:g.id===d.value,onClick:K=>ue(g,w)},{default:t.withCtx(()=>[t.createTextVNode(t.toDisplayString(g.label),1)]),_:2},1032,["aria-current","data-testid","selected","onClick"]))),128))]),default:t.withCtx(()=>[t.createVNode(h,{appearance:"tertiary","aria-label":t.unref(c)("anchor_navigation.more_button.aria_label"),class:"anchor-overflow-button","data-testid":"anchor-navigation-overflow-dropdown-button",icon:"",size:"small"},{default:t.withCtx(()=>[t.createVNode(t.unref(D.ChevronDownIcon),{decorative:"",size:`var(--kui-icon-size-30, ${t.unref(O)})`},null,8,["size"])]),_:1},8,["aria-label"])]),_:1})])):t.createCommentVNode("",!0)],2)],8,Vt)}}}),[["__scopeId","data-v-2f18cb71"]]),it=Symbol("nested-page-layout-detection"),rt="page-layout:new-appearance",zt={key:0,class:"page-layout-header","data-testid":"page-layout-header"},Ft={class:"page-header-container"},Mt={class:"page-header-start"},Ht={class:"title-container"},jt={key:1,class:"page-layout-title-wrapper"},vt={class:"page-layout-title","data-testid":"page-layout-title"},Wt=["aria-label"],qt={key:3,class:"title-after-container"},Ut={class:"page-header-actions-container"},Gt={key:0,class:"page-layout-aside-container","data-testid":"page-layout-aside"},Yt={class:"page-layout-content"},Jt=U(t.defineComponent({__name:"PageLayout",props:{breadcrumbs:{default:()=>[]},title:{},backTo:{},tabs:{default:()=>[]},anchors:{default:()=>[]},pageShortcutData:{}},setup(e){const c=t.inject("app:navigateTo",null),n=t.inject(rt,null),l=t.inject("app:pageShortcutsContext",null),{i18n:{t:s}}=Z.useI18n(),d=J.useRouter(),u=J.useRoute(),i=t.computed(()=>!!(e.tabs&&e.tabs.length)),k=t.computed(()=>typeof e.backTo=="string"),b=t.computed(()=>t.toValue(n)===!0),p=t.computed(()=>b.value&&!i.value&&!!(e.anchors&&e.anchors.length)),m=t.computed(()=>!!e.pageShortcutData&&!!e.pageShortcutData.entityType&&!!e.pageShortcutData.label),C=t.computed(()=>m.value&&!!l&&"onFavoriteToggle"in l&&typeof l.onFavoriteToggle=="function"),E=t.ref(0),f=t.computed(()=>!!l&&"isFavorite"in l&&typeof l.isFavorite=="function"&&l.isFavorite(e.pageShortcutData)===!0),I=async()=>{if(e.backTo){if(typeof e.backTo=="object"){d.push(e.backTo);return}if(typeof c!="function"){window.location.href=e.backTo;return}await c(e.backTo)}},_=t.ref(0),V=t.computed(()=>_.value>0);t.provide(it,()=>(_.value++,()=>{_.value--}));const z=t.inject(it,null),r=t.ref(null);typeof z=="function"&&(r.value=z());const A=()=>{l.onFavoriteToggle({...e.pageShortcutData,path:e.pageShortcutData?.path||u.fullPath})};t.onUnmounted(()=>{r.value?.()});const L=Ct(()=>{!V.value&&m.value&&l&&"onEntityPageVisit"in l&&typeof l.onEntityPageVisit=="function"&&(l.onEntityPageVisit({...e.pageShortcutData,path:e.pageShortcutData?.path||u?.fullPath}),E.value++)},500);return t.watch([()=>e.pageShortcutData,()=>u?.fullPath],()=>{L()},{immediate:!0,deep:!0}),(N,F)=>{const M=t.resolveComponent("KBreadcrumbs"),R=t.resolveComponent("KTooltip"),G=t.resolveComponent("router-view");return t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["kong-ui-public-page-layout",{"new-appearance":b.value}]),"data-testid":"kong-ui-public-page-layout"},[V.value?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("div",zt,[t.createElementVNode("div",Ft,[t.createElementVNode("div",Mt,[e.breadcrumbs&&e.breadcrumbs.length?(t.openBlock(),t.createBlock(M,{key:0,class:"header-breadcrumbs","data-testid":"page-layout-breadcrumbs","item-max-width":"25ch",items:e.breadcrumbs},t.createSlots({_:2},[b.value?{name:"divider",fn:t.withCtx(()=>[t.createVNode(t.unref(D.ChevronRightIcon),{decorative:"",size:`var(--kui-icon-size-30, ${t.unref(O)})`},null,8,["size"])]),key:"0"}:void 0]),1032,["items"])):t.createCommentVNode("",!0),t.createElementVNode("div",Ht,[e.backTo&&!b.value?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(k.value?"a":"router-link"),t.mergeProps({key:0},k.value?{href:e.backTo}:{to:e.backTo},{"aria-label":t.unref(s)("back_button"),class:"navigate-back","data-testid":"page-layout-navigate-back",tabindex:"0",onClick:t.withModifiers(I,["prevent"]),onKeydown:t.withKeys(t.withModifiers(I,["prevent"]),["enter"])}),{default:t.withCtx(()=>[t.createVNode(t.unref(D.ArrowTopLeftIcon),{decorative:"",size:`var(--kui-icon-size-30, ${t.unref(O)})`},null,8,["size"])]),_:1},16,["aria-label","onKeydown"])):t.createCommentVNode("",!0),e.title||N.$slots.title?(t.openBlock(),t.createElementBlock("span",jt,[t.renderSlot(N.$slots,"title",{},()=>[t.createElementVNode("h1",vt,t.toDisplayString(e.title),1)],!0)])):t.createCommentVNode("",!0),C.value?(t.openBlock(),t.createElementBlock("div",{key:E.value,class:"favorite-button-container"},[t.createVNode(R,{placement:"right",text:f.value?t.unref(s)("favorite_button.remove_shortcut"):t.unref(s)("favorite_button.save_shortcut")},{default:t.withCtx(()=>[t.createElementVNode("button",{"aria-label":f.value?t.unref(s)("favorite_button.remove_shortcut"):t.unref(s)("favorite_button.save_shortcut"),class:t.normalizeClass(["favorite-button",{active:f.value}]),"data-testid":"page-layout-favorite-button",type:"button",onClick:A},[(t.openBlock(),t.createBlock(t.resolveDynamicComponent(f.value?t.unref(D.StarFillIcon):t.unref(D.StarIcon)),{decorative:"",size:`var(--kui-icon-size-30, ${t.unref(O)})`},null,8,["size"]))],10,Wt)]),_:1},8,["text"])])):t.createCommentVNode("",!0),N.$slots["title-after"]?(t.openBlock(),t.createElementBlock("div",qt,[t.renderSlot(N.$slots,"title-after",{},void 0,!0)])):t.createCommentVNode("",!0)])]),p.value?(t.openBlock(),t.createBlock(xt,{key:0,anchors:e.anchors},null,8,["anchors"])):t.createCommentVNode("",!0),t.createElementVNode("div",Ut,[t.renderSlot(N.$slots,"actions",{},void 0,!0),F[0]||(F[0]=t.createElementVNode("div",{"data-teleport-target":"ask-kai"},null,-1))])]),i.value?(t.openBlock(),t.createBlock(At,{key:0,tabs:e.tabs},t.createSlots({_:2},[t.renderList(e.tabs,P=>({name:`tab-${P.key}`,fn:t.withCtx(v=>[t.renderSlot(N.$slots,`tab-${P.key}`,t.normalizeProps(t.guardReactiveProps(v)),void 0,!0)])}))]),1032,["tabs"])):t.createCommentVNode("",!0)])),t.createElementVNode("div",{class:t.normalizeClass(["page-layout-content-container",{"has-nested-page-layout":V.value}])},[b.value&&N.$slots.aside?(t.openBlock(),t.createElementBlock("div",Gt,[t.renderSlot(N.$slots,"aside",{},void 0,!0)])):t.createCommentVNode("",!0),t.createElementVNode("div",Yt,[i.value?(t.openBlock(),t.createBlock(G,{key:0})):t.renderSlot(N.$slots,"default",{},void 0,!0,1)])],2)],2)}}}),[["__scopeId","data-v-e714e65a"]]),Zt={key:0,class:"about-card-description","data-testid":"about-card-description"},Xt={key:1,class:"about-card-skeleton","data-testid":"about-card-skeleton"},Qt={key:2,class:"about-card-rows","data-testid":"about-card-rows"},te=["data-testid"],ee={class:"about-card-row-label"},oe={class:"about-card-row-text"},ne=["aria-label","data-testid"],ae={class:"about-card-row-value"},le={class:"about-card-row-text"},ie={key:3,class:"about-card-content","data-testid":"about-card-content"},re=U(t.defineComponent({__name:"AboutCard",props:{title:{default:""},titleTag:{default:"h2"},description:{default:""},rows:{default:()=>[]},isLoading:{type:Boolean,default:!1}},setup(e){const c=t.computed(()=>e.rows.length||4);return(n,l)=>{const s=t.resolveComponent("KSkeletonBox"),d=t.resolveComponent("KTooltip"),u=t.resolveComponent("KCard");return t.openBlock(),t.createBlock(u,{class:"kong-ui-public-about-card",title:e.title,"title-tag":e.titleTag},t.createSlots({default:t.withCtx(()=>[n.$slots.description||e.description?(t.openBlock(),t.createElementBlock("p",Zt,[t.renderSlot(n.$slots,"description",{},()=>[t.createTextVNode(t.toDisplayString(e.description),1)],!0)])):t.createCommentVNode("",!0),e.isLoading?(t.openBlock(),t.createElementBlock("div",Xt,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(c.value,i=>(t.openBlock(),t.createBlock(s,{key:i,height:"2",width:"100"}))),128))])):e.rows.length?(t.openBlock(),t.createElementBlock("dl",Qt,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.rows,i=>(t.openBlock(),t.createElementBlock("div",{key:i.key,class:"about-card-row","data-testid":`about-card-row-${i.key}`},[t.createElementVNode("dt",ee,[t.renderSlot(n.$slots,`label-${i.key}`,{row:i},()=>[t.createElementVNode("span",oe,t.toDisplayString(i.label),1)],!0),i.tooltip?(t.openBlock(),t.createBlock(d,{key:0,text:i.tooltip},{default:t.withCtx(()=>[t.createElementVNode("button",{"aria-label":i.tooltip,class:"about-card-row-tooltip-trigger","data-testid":`about-card-row-${i.key}-tooltip`,type:"button"},[t.createVNode(t.unref(D.InfoIcon),{size:`var(--kui-icon-size-20, ${t.unref(ht)})`},null,8,["size"])],8,ne)]),_:2},1032,["text"])):t.createCommentVNode("",!0)]),t.createElementVNode("dd",ae,[t.renderSlot(n.$slots,`row-${i.key}`,{row:i},()=>[t.createElementVNode("span",le,t.toDisplayString(i.value),1)],!0)])],8,te))),128))])):t.createCommentVNode("",!0),n.$slots.default?(t.openBlock(),t.createElementBlock("div",ie,[t.renderSlot(n.$slots,"default",{},void 0,!0)])):t.createCommentVNode("",!0)]),_:2},[n.$slots.title||e.title?{name:"title",fn:t.withCtx(()=>[t.renderSlot(n.$slots,"title",{},()=>[t.createTextVNode(t.toDisplayString(e.title),1)],!0)]),key:"0"}:void 0,n.$slots.actions?{name:"actions",fn:t.withCtx(()=>[t.renderSlot(n.$slots,"actions",{},void 0,!0)]),key:"1"}:void 0]),1032,["title","title-tag"])}}}),[["__scopeId","data-v-86b6c183"]]);B.AboutCard=re,B.NEW_APPEARANCE_INJECTION_KEY=rt,B.PageLayout=Jt,Object.defineProperty(B,Symbol.toStringTag,{value:"Module"})}));
|
|
1
|
+
(function(B,t){typeof exports=="object"&&typeof module<"u"?t(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"],t):(B=typeof globalThis<"u"?globalThis:B||self,t(B["kong-ui-public-page-layout"]={},B.Vue,B.VueRouter,B["kong-ui-public-i18n"],B.KongIcons))})(this,(function(B,t,J,tt,D){"use strict";const mt={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 ft(){const e=tt.createI18n("en-us",mt);return{i18n:e,i18nT:tt.i18nTComponent(e)}}const Z={useI18n:ft},ht="12px",O="16px",gt="2px",et="16px";function kt(e,c){return t.getCurrentScope()?(t.onScopeDispose(e,c),!0):!1}const bt=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const x=()=>{};function yt(e,c){function n(...l){return new Promise((s,d)=>{Promise.resolve(e(()=>c.apply(this,l),{fn:c,thisArg:this,args:l})).then(s).catch(d)})}return"cancel"in e&&Object.assign(n,{cancel:e.cancel,flush:e.flush,isPending:e.isPending}),n}function wt(e,c={}){let n,l,s=x,d=x;const u=t.shallowRef(!1),i=p=>{clearTimeout(p),s(),s=x};let k;return Object.assign(p=>{const m=t.toValue(e),C=t.toValue(c.maxWait);return n&&i(n),m<=0||C!==void 0&&C<=0?(l&&(i(l),l=void 0),u.value=!1,Promise.resolve(p())):(u.value=!0,new Promise((E,f)=>{s=c.rejectOnCancel?f:E,d=E,k=p,C&&!l&&(l=setTimeout(()=>{n&&i(n),l=void 0,u.value=!1,E(k())},C)),n=setTimeout(()=>{l&&i(l),l=void 0,u.value=!1,E(p())},m)}))},{cancel:()=>{n&&(i(n),n=void 0),l&&(i(l),l=void 0),u.value=!1,d=x},flush:()=>{if(u.value){n&&(clearTimeout(n),n=void 0),l&&(clearTimeout(l),l=void 0),u.value=!1;const p=d;s=x,d=x,p(k())}},isPending:t.shallowReadonly(u)})}function Ct(e,c=200,n={}){return yt(wt(c,n),e)}const Bt=bt?window:void 0;function ot(e){var c;const n=t.toValue(e);return(c=n?.$el)!==null&&c!==void 0?c:n}function Et(){const e=t.shallowRef(!1),c=t.getCurrentInstance();return c&&t.onMounted(()=>{e.value=!0},c),e}function Tt(e){const c=Et();return t.computed(()=>(c.value,!!e()))}function nt(e,c,n={}){const{window:l=Bt,...s}=n;let d;const u=Tt(()=>l&&"ResizeObserver"in l),i=()=>{d&&(d.disconnect(),d=void 0)},k=t.watch(t.computed(()=>{const p=t.toValue(e);return Array.isArray(p)?p.map(m=>ot(m)):[ot(p)]}),p=>{if(i(),u.value&&l){d=new ResizeObserver(c);for(const m of p)m&&d.observe(m,s)}},{immediate:!0,flush:"post"}),b=()=>{i(),k()};return kt(b),{isSupported:u,stop:b}}const _t={ref:"page-layout-tabs",class:"page-layout-tabs","data-testid":"page-layout-tabs"},Nt={key:0},St=["aria-label"],$t={key:0,class:"layout-loader-container"},It=t.defineComponent({__name:"PageLayoutTabs",props:{tabs:{default:()=>[]}},setup(e){const{i18n:{t:c}}=Z.useI18n(),n=J.useRouter(),l=t.inject("app:navigateTo",null),s=f=>{if(typeof f.to!="string"){n.push(f.to);return}if(typeof l!="function"){window.location.href=f.to;return}l(f.to)},d=t.useTemplateRef("page-layout-tabs"),u=t.useTemplateRef("page-layout-tabs-list"),i=t.ref(e.tabs.length),k=t.ref(!1),b=t.computed(()=>e.tabs.slice(0,i.value)),p=t.computed(()=>e.tabs.slice(i.value)),m=async()=>{if(!d.value||!u.value)return;k.value=!1,i.value=e.tabs.length,await t.nextTick();const f=d.value?.getBoundingClientRect().width-parseInt(et)*2;let I=u.value?.getBoundingClientRect().width;if(!f||!I){k.value=!0;return}const _=50;for(;I+_>f&&i.value>1;)i.value--,await t.nextTick(),I=u.value?.getBoundingClientRect().width||0;k.value=!0};let C=null;const E=()=>{C&&clearTimeout(C),C=setTimeout(()=>{m()},150)};return t.onMounted(()=>{m(),nt(d,E)}),t.onBeforeUnmount(()=>{C&&clearTimeout(C)}),t.watch(()=>e.tabs,()=>{m()},{deep:!0}),(f,I)=>{const _=t.resolveComponent("KDropdownItem"),V=t.resolveComponent("KDropdown"),z=t.resolveComponent("KSkeletonBox");return t.openBlock(),t.createElementBlock("nav",_t,[t.createElementVNode("ul",{ref:"page-layout-tabs-list",class:t.normalizeClass({"layout-computing":!k.value})},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(b.value,r=>(t.openBlock(),t.createElementBlock("li",{key:`${r.key}-tab`},[(t.openBlock(),t.createBlock(t.resolveDynamicComponent(typeof r.to=="string"?"a":"router-link"),t.mergeProps({ref_for:!0},typeof r.to=="string"?{href:r.to}:{to:r.to},{"aria-current":r.active?"page":void 0,class:["tab-link",{active:r.active}],"data-testid":r.dataTestId?r.dataTestId:`page-layout-tab-${r.key}`,tabindex:"0",onClick:t.withModifiers(A=>s(r),["prevent"]),onKeydown:t.withKeys(t.withModifiers(A=>s(r),["prevent"]),["enter"])}),{default:t.withCtx(()=>[t.renderSlot(f.$slots,`tab-${r.key}`,{tab:r},()=>[t.createTextVNode(t.toDisplayString(r.label),1)],!0)]),_:2},1040,["aria-current","class","data-testid","onClick","onKeydown"]))]))),128)),e.tabs.length>i.value?(t.openBlock(),t.createElementBlock("li",Nt,[t.createVNode(V,{"kpop-attributes":{placement:"bottom-end",popoverElementAttributes:{"data-testid":"tabs-overflow-dropdown-popover"}}},{items:t.withCtx(()=>[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(p.value,r=>(t.openBlock(),t.createBlock(_,{key:`${r.key}-dropdown-item`,"aria-current":r.active?"page":void 0,"data-testid":r.dataTestId?r.dataTestId:`page-layout-tab-${r.key}`,item:{label:r.label,value:r.key,to:r.to},selected:r.active},{default:t.withCtx(()=>[t.renderSlot(f.$slots,`tab-${r.key}`,{tab:r},()=>[t.createTextVNode(t.toDisplayString(r.label),1)],!0)]),_:2},1032,["aria-current","data-testid","item","selected"]))),128))]),default:t.withCtx(()=>[t.createElementVNode("button",{"aria-label":t.unref(c)("tabs.more_button.aria_label"),class:t.normalizeClass(["tab-link",{active:p.value.find(r=>r.active)}]),"data-testid":"tabs-overflow-dropdown-button"},[t.createTextVNode(t.toDisplayString(t.unref(c)("tabs.more_button.label"))+" ",1),t.createVNode(t.unref(D.ChevronDownIcon),{decorative:"",size:`var(--kui-icon-size-30, ${t.unref(O)})`},null,8,["size"])],10,St)]),_:3})])):t.createCommentVNode("",!0)],2),k.value?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("div",$t,[(t.openBlock(),t.createElementBlock(t.Fragment,null,t.renderList(3,r=>t.createVNode(z,{key:`layout-loader-${r}`,height:"1",width:"5"})),64))]))],512)}}}),U=(e,c)=>{const n=e.__vccOpts||e;for(const[l,s]of c)n[l]=s;return n},At=U(It,[["__scopeId","data-v-02891bc1"]]),Vt=["aria-label","data-fit"],Dt={key:0,"aria-hidden":"true",class:"anchor-ellipsis","data-testid":"anchor-navigation-leading-ellipsis"},Lt=["aria-current","data-testid","title","onClick"],Rt={key:1,"aria-hidden":"true",class:"anchor-ellipsis","data-testid":"anchor-navigation-trailing-ellipsis"},Pt={key:2},at=140,lt=22,X=16,j="data-anchor-attention",Kt=1200,Ot=1600,xt=U(t.defineComponent({__name:"PageLayoutAnchorNavigation",props:{anchors:{default:()=>[]}},setup(e){const{i18n:{t:c}}=Z.useI18n(),n=t.useTemplateRef("page-layout-anchor-navigation"),l=t.useTemplateRef("page-layout-anchor-navigation-list"),s=t.ref("all"),d=t.ref(""),u=t.ref([]),i=t.computed(()=>e.anchors.filter(o=>u.value.includes(o.id))),k=t.computed(()=>{const o=i.value.findIndex(a=>a.id===d.value);return o===-1?0:o}),b=t.computed(()=>{const o=i.value,a=o.length,h=k.value;if(s.value==="all")return{anchors:o,hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!1};if(s.value==="hidden")return{anchors:[],hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!1};if(s.value==="active-only")return{anchors:o.slice(h,h+1),hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!0};const y=s.value==="window-3"?3:2;if(a<=y)return{anchors:o,hasLeadingEllipsis:!1,hasTrailingEllipsis:!1,hasOverflowDropdown:!0};const S=h<y?0:h>=a-y?a-y:h-1;return{anchors:o.slice(S,S+y),hasLeadingEllipsis:S>0,hasTrailingEllipsis:S+y<a,hasOverflowDropdown:!0}}),p=o=>o.dataTestId??`page-layout-anchor-${o.id.replace(/[^\w-]+/g,"-").replace(/^-+|-+$/g,"")}`,m=t.ref(null),C=()=>{let o=n.value?.parentElement??null;for(;o;){const{overflowY:a}=getComputedStyle(o);if(a==="auto"||a==="scroll"||a==="overlay")return o;o=o.parentElement}return null},E=o=>{if(o.element)return o.element.isConnected?o.element:null;const a=m.value??document;try{return a.querySelector(o.id)??a.querySelector(`#${CSS.escape(o.id)}`)}catch{return null}},f=()=>(n.value?.closest(".page-layout-header")?.getBoundingClientRect().height??0)+parseInt(et,10),I=parseInt(O,10),_=parseInt(gt,10),V=o=>o*at+2*I+lt+(o+2)*_+X,z=()=>at+lt+_+X;let r=0;const A=async()=>{if(!i.value.length){s.value="hidden";return}const o=++r;if(s.value="all",await t.nextTick(),o!==r||!n.value||!l.value)return;const a=n.value.getBoundingClientRect().width,h=l.value.getBoundingClientRect().width;a<=0||h<=0||h+X<=a||(V(3)<=a?s.value="window-3":V(2)<=a?s.value="window-2":z()<=a?s.value="active-only":s.value="hidden")};let L=null;nt(n,()=>{L&&clearTimeout(L),L=setTimeout(()=>{q(),A()},150)});let F=null,M=null,R=0,G=0,P=null,v=null;const st=o=>{const a=String(++R);ct(),v=o,o.removeAttribute(j),G=requestAnimationFrame(()=>{o.setAttribute(j,a),P=setTimeout(()=>{o.getAttribute(j)===a&&o.removeAttribute(j)},Kt)})},ct=()=>{cancelAnimationFrame(G),P&&(clearTimeout(P),P=null),v?.removeAttribute(j),v=null},W=()=>m.value??window,se=new Set(["ArrowUp","ArrowDown","PageUp","PageDown","Home","End"," "]),T=o=>{if(o instanceof KeyboardEvent&&!se.has(o.key))return;o&&o.type!=="scrollend"&&R++,F=null,M&&(clearTimeout(M),M=null);const a=W();a.removeEventListener("scrollend",T),a.removeEventListener("wheel",T),a.removeEventListener("touchstart",T),a.removeEventListener("keydown",T)},ce=o=>{T(),F=o;const a=W();a.addEventListener("scrollend",T,{once:!0}),a.addEventListener("wheel",T,{passive:!0}),a.addEventListener("touchstart",T,{passive:!0}),a.addEventListener("keydown",T,{passive:!0}),M=setTimeout(T,1e3)},dt=()=>{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}},q=()=>{const{top:o,scrollTop:a,clientHeight:h,scrollHeight:y}=dt(),S=f(),w=[];let g=null,K=null;for(const $ of e.anchors){const H=E($);H&&(w.push($.id),K=$.id,g??=$.id,H.getBoundingClientRect().top-o<=($.offset??S)+8&&(g=$.id))}const Y=w.length!==u.value.length||w.some(($,H)=>$!==u.value[H]);return Y&&(u.value=w),F||(K&&a>0&&a+h>=y-2&&(g=K),d.value=g??""),Y};let Q=!1;const ut=()=>{Q||(Q=!0,requestAnimationFrame(()=>{Q=!1,q()&&A()}))},de=o=>{const a=W();let h=!1;const y=()=>{h||(h=!0,a.removeEventListener("scrollend",y),o())};a.addEventListener("scrollend",y,{once:!0}),window.setTimeout(y,Ot)},pt=o=>{const a=E(o);if(!a)return;d.value=o.id,ce(o.id);const h=o.offset??f(),{scrollTop:y,clientHeight:S,scrollHeight:w}=dt(),g=m.value,K=g?a.getBoundingClientRect().top-g.getBoundingClientRect().top+g.scrollTop-h:a.getBoundingClientRect().top+window.scrollY-h,Y=Math.min(Math.max(K,0),Math.max(w-S,0)),$=Math.abs(Y-y)>=2,H=++R;if((g??window).scrollTo({behavior:"smooth",top:K}),!$){st(a);return}de(()=>{H===R&&st(a)})},ue=(o,a)=>{a(),pt(o)};return t.onMounted(()=>{m.value=C(),W().addEventListener("scroll",ut,{passive:!0}),q(),A(),requestAnimationFrame(()=>{q(),A()})}),t.onBeforeUnmount(()=>{W().removeEventListener("scroll",ut),T(),R++,ct(),L&&clearTimeout(L)}),t.watch(()=>e.anchors,()=>{e.anchors.some(o=>o.id===d.value)||(d.value=""),q(),A()},{deep:!0}),(o,a)=>{const h=t.resolveComponent("KButton"),y=t.resolveComponent("KDropdownItem"),S=t.resolveComponent("KDropdown");return t.openBlock(),t.createElementBlock("nav",{ref:"page-layout-anchor-navigation","aria-label":t.unref(c)("anchor_navigation.aria_label"),class:"page-layout-anchor-navigation","data-fit":s.value,"data-testid":"page-layout-anchor-navigation"},[t.createElementVNode("ul",{ref:"page-layout-anchor-navigation-list",class:t.normalizeClass({"layout-hidden":s.value==="hidden"})},[b.value.hasLeadingEllipsis?(t.openBlock(),t.createElementBlock("li",Dt," … ")):t.createCommentVNode("",!0),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(b.value.anchors,w=>(t.openBlock(),t.createElementBlock("li",{key:`${w.id}-anchor`},[t.createElementVNode("button",{"aria-current":w.id===d.value?"location":void 0,class:t.normalizeClass(["anchor-link",{active:w.id===d.value}]),"data-testid":p(w),title:w.label,type:"button",onClick:g=>pt(w)},t.toDisplayString(w.label),11,Lt)]))),128)),b.value.hasTrailingEllipsis?(t.openBlock(),t.createElementBlock("li",Rt," … ")):t.createCommentVNode("",!0),b.value.hasOverflowDropdown?(t.openBlock(),t.createElementBlock("li",Pt,[t.createVNode(S,{"kpop-attributes":{placement:"bottom-end",popoverElementAttributes:{"data-testid":"anchor-navigation-overflow-dropdown-popover"}}},{items:t.withCtx(({closeDropdown:w})=>[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(i.value,g=>(t.openBlock(),t.createBlock(y,{key:`${g.id}-dropdown-item`,"aria-current":g.id===d.value?"location":void 0,"data-testid":p(g),selected:g.id===d.value,onClick:K=>ue(g,w)},{default:t.withCtx(()=>[t.createTextVNode(t.toDisplayString(g.label),1)]),_:2},1032,["aria-current","data-testid","selected","onClick"]))),128))]),default:t.withCtx(()=>[t.createVNode(h,{appearance:"tertiary","aria-label":t.unref(c)("anchor_navigation.more_button.aria_label"),class:"anchor-overflow-button","data-testid":"anchor-navigation-overflow-dropdown-button",icon:"",size:"small"},{default:t.withCtx(()=>[t.createVNode(t.unref(D.ChevronDownIcon),{decorative:"",size:`var(--kui-icon-size-30, ${t.unref(O)})`},null,8,["size"])]),_:1},8,["aria-label"])]),_:1})])):t.createCommentVNode("",!0)],2)],8,Vt)}}}),[["__scopeId","data-v-2f18cb71"]]),it=Symbol("nested-page-layout-detection"),rt="page-layout:new-appearance",zt={key:0,class:"page-layout-header","data-testid":"page-layout-header"},Ft={class:"page-header-container"},Mt={class:"page-header-start"},Ht={class:"title-container"},jt={key:1,class:"page-layout-title-wrapper"},vt={class:"page-layout-title","data-testid":"page-layout-title"},Wt=["aria-label"],qt={key:3,class:"title-after-container"},Ut={class:"page-header-actions-container"},Gt={key:0,class:"page-layout-aside-container","data-testid":"page-layout-aside"},Yt={class:"page-layout-content"},Jt=U(t.defineComponent({__name:"PageLayout",props:{breadcrumbs:{default:()=>[]},title:{},backTo:{},tabs:{default:()=>[]},anchors:{default:()=>[]},pageShortcutData:{}},setup(e){const c=t.inject("app:navigateTo",null),n=t.inject(rt,null),l=t.inject("app:pageShortcutsContext",null),{i18n:{t:s}}=Z.useI18n(),d=J.useRouter(),u=J.useRoute(),i=t.computed(()=>!!(e.tabs&&e.tabs.length)),k=t.computed(()=>typeof e.backTo=="string"),b=t.computed(()=>t.toValue(n)===!0),p=t.computed(()=>b.value&&!i.value&&!!(e.anchors&&e.anchors.length)),m=t.computed(()=>!!e.pageShortcutData&&!!e.pageShortcutData.entityType&&!!e.pageShortcutData.label),C=t.computed(()=>m.value&&!!l&&"onFavoriteToggle"in l&&typeof l.onFavoriteToggle=="function"),E=t.ref(0),f=t.computed(()=>!!l&&"isFavorite"in l&&typeof l.isFavorite=="function"&&l.isFavorite(e.pageShortcutData)===!0),I=async()=>{if(e.backTo){if(typeof e.backTo=="object"){d.push(e.backTo);return}if(typeof c!="function"){window.location.href=e.backTo;return}await c(e.backTo)}},_=t.ref(0),V=t.computed(()=>_.value>0);t.provide(it,()=>(_.value++,()=>{_.value--}));const z=t.inject(it,null),r=t.ref(null);typeof z=="function"&&(r.value=z());const A=()=>{l.onFavoriteToggle({...e.pageShortcutData,path:e.pageShortcutData?.path||u.fullPath})};t.onUnmounted(()=>{r.value?.()});const L=Ct(()=>{!V.value&&m.value&&l&&"onEntityPageVisit"in l&&typeof l.onEntityPageVisit=="function"&&(l.onEntityPageVisit({...e.pageShortcutData,path:e.pageShortcutData?.path||u?.fullPath}),E.value++)},500);return t.watch([()=>e.pageShortcutData,()=>u?.fullPath],()=>{L()},{immediate:!0,deep:!0}),(N,F)=>{const M=t.resolveComponent("KBreadcrumbs"),R=t.resolveComponent("KTooltip"),G=t.resolveComponent("router-view");return t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["kong-ui-public-page-layout",{"new-appearance":b.value}]),"data-testid":"kong-ui-public-page-layout"},[V.value?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("div",zt,[t.createElementVNode("div",Ft,[t.createElementVNode("div",Mt,[e.breadcrumbs&&e.breadcrumbs.length?(t.openBlock(),t.createBlock(M,{key:0,class:"header-breadcrumbs","data-testid":"page-layout-breadcrumbs","item-max-width":"25ch",items:e.breadcrumbs},t.createSlots({_:2},[b.value?{name:"divider",fn:t.withCtx(()=>[t.createVNode(t.unref(D.ChevronRightIcon),{decorative:"",size:`var(--kui-icon-size-30, ${t.unref(O)})`},null,8,["size"])]),key:"0"}:void 0]),1032,["items"])):t.createCommentVNode("",!0),t.createElementVNode("div",Ht,[e.backTo&&!b.value?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(k.value?"a":"router-link"),t.mergeProps({key:0},k.value?{href:e.backTo}:{to:e.backTo},{"aria-label":t.unref(s)("back_button"),class:"navigate-back","data-testid":"page-layout-navigate-back",tabindex:"0",onClick:t.withModifiers(I,["prevent"]),onKeydown:t.withKeys(t.withModifiers(I,["prevent"]),["enter"])}),{default:t.withCtx(()=>[t.createVNode(t.unref(D.ArrowTopLeftIcon),{decorative:"",size:`var(--kui-icon-size-30, ${t.unref(O)})`},null,8,["size"])]),_:1},16,["aria-label","onKeydown"])):t.createCommentVNode("",!0),e.title||N.$slots.title?(t.openBlock(),t.createElementBlock("span",jt,[t.renderSlot(N.$slots,"title",{},()=>[t.createElementVNode("h1",vt,t.toDisplayString(e.title),1)],!0)])):t.createCommentVNode("",!0),C.value?(t.openBlock(),t.createElementBlock("div",{key:E.value,class:"favorite-button-container"},[t.createVNode(R,{placement:"right",text:f.value?t.unref(s)("favorite_button.remove_shortcut"):t.unref(s)("favorite_button.save_shortcut")},{default:t.withCtx(()=>[t.createElementVNode("button",{"aria-label":f.value?t.unref(s)("favorite_button.remove_shortcut"):t.unref(s)("favorite_button.save_shortcut"),class:t.normalizeClass(["favorite-button",{active:f.value}]),"data-testid":"page-layout-favorite-button",type:"button",onClick:A},[(t.openBlock(),t.createBlock(t.resolveDynamicComponent(f.value?t.unref(D.StarFillIcon):t.unref(D.StarIcon)),{decorative:"",size:`var(--kui-icon-size-30, ${t.unref(O)})`},null,8,["size"]))],10,Wt)]),_:1},8,["text"])])):t.createCommentVNode("",!0),N.$slots["title-after"]?(t.openBlock(),t.createElementBlock("div",qt,[t.renderSlot(N.$slots,"title-after",{},void 0,!0)])):t.createCommentVNode("",!0)])]),p.value?(t.openBlock(),t.createBlock(xt,{key:0,anchors:e.anchors},null,8,["anchors"])):t.createCommentVNode("",!0),t.createElementVNode("div",Ut,[t.renderSlot(N.$slots,"actions",{},void 0,!0),F[0]||(F[0]=t.createElementVNode("div",{"data-teleport-target":"ask-kai"},null,-1))])]),i.value?(t.openBlock(),t.createBlock(At,{key:0,tabs:e.tabs},t.createSlots({_:2},[t.renderList(e.tabs,P=>({name:`tab-${P.key}`,fn:t.withCtx(v=>[t.renderSlot(N.$slots,`tab-${P.key}`,t.normalizeProps(t.guardReactiveProps(v)),void 0,!0)])}))]),1032,["tabs"])):t.createCommentVNode("",!0)])),t.createElementVNode("div",{class:t.normalizeClass(["page-layout-content-container",{"has-nested-page-layout":V.value}])},[b.value&&N.$slots.aside?(t.openBlock(),t.createElementBlock("div",Gt,[t.renderSlot(N.$slots,"aside",{},void 0,!0)])):t.createCommentVNode("",!0),t.createElementVNode("div",Yt,[i.value?(t.openBlock(),t.createBlock(G,{key:0})):t.renderSlot(N.$slots,"default",{},void 0,!0,1)])],2)],2)}}}),[["__scopeId","data-v-3e9b1adf"]]),Zt={key:0,class:"about-card-description","data-testid":"about-card-description"},Xt={key:1,class:"about-card-skeleton","data-testid":"about-card-skeleton"},Qt={key:2,class:"about-card-rows","data-testid":"about-card-rows"},te=["data-testid"],ee={class:"about-card-row-label"},oe={class:"about-card-row-text"},ne=["aria-label","data-testid"],ae={class:"about-card-row-value"},le={class:"about-card-row-text"},ie={key:3,class:"about-card-content","data-testid":"about-card-content"},re=U(t.defineComponent({__name:"AboutCard",props:{title:{default:""},titleTag:{default:"h2"},description:{default:""},rows:{default:()=>[]},isLoading:{type:Boolean,default:!1}},setup(e){const c=t.computed(()=>e.rows.length||4);return(n,l)=>{const s=t.resolveComponent("KSkeletonBox"),d=t.resolveComponent("KTooltip"),u=t.resolveComponent("KCard");return t.openBlock(),t.createBlock(u,{class:"kong-ui-public-about-card",title:e.title,"title-tag":e.titleTag},t.createSlots({default:t.withCtx(()=>[n.$slots.description||e.description?(t.openBlock(),t.createElementBlock("p",Zt,[t.renderSlot(n.$slots,"description",{},()=>[t.createTextVNode(t.toDisplayString(e.description),1)],!0)])):t.createCommentVNode("",!0),e.isLoading?(t.openBlock(),t.createElementBlock("div",Xt,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(c.value,i=>(t.openBlock(),t.createBlock(s,{key:i,height:"2",width:"100"}))),128))])):e.rows.length?(t.openBlock(),t.createElementBlock("dl",Qt,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.rows,i=>(t.openBlock(),t.createElementBlock("div",{key:i.key,class:"about-card-row","data-testid":`about-card-row-${i.key}`},[t.createElementVNode("dt",ee,[t.renderSlot(n.$slots,`label-${i.key}`,{row:i},()=>[t.createElementVNode("span",oe,t.toDisplayString(i.label),1)],!0),i.tooltip?(t.openBlock(),t.createBlock(d,{key:0,text:i.tooltip},{default:t.withCtx(()=>[t.createElementVNode("button",{"aria-label":i.tooltip,class:"about-card-row-tooltip-trigger","data-testid":`about-card-row-${i.key}-tooltip`,type:"button"},[t.createVNode(t.unref(D.InfoIcon),{size:`var(--kui-icon-size-20, ${t.unref(ht)})`},null,8,["size"])],8,ne)]),_:2},1032,["text"])):t.createCommentVNode("",!0)]),t.createElementVNode("dd",ae,[t.renderSlot(n.$slots,`row-${i.key}`,{row:i},()=>[t.createElementVNode("span",le,t.toDisplayString(i.value),1)],!0)])],8,te))),128))])):t.createCommentVNode("",!0),n.$slots.default?(t.openBlock(),t.createElementBlock("div",ie,[t.renderSlot(n.$slots,"default",{},void 0,!0)])):t.createCommentVNode("",!0)]),_:2},[n.$slots.title||e.title?{name:"title",fn:t.withCtx(()=>[t.renderSlot(n.$slots,"title",{},()=>[t.createTextVNode(t.toDisplayString(e.title),1)],!0)]),key:"0"}:void 0,n.$slots.actions?{name:"actions",fn:t.withCtx(()=>[t.renderSlot(n.$slots,"actions",{},void 0,!0)]),key:"1"}:void 0]),1032,["title","title-tag"])}}}),[["__scopeId","data-v-3ecdd6e6"]]);B.AboutCard=re,B.NEW_APPEARANCE_INJECTION_KEY=rt,B.PageLayout=Jt,Object.defineProperty(B,Symbol.toStringTag,{value:"Module"})}));
|
package/dist/style.css
CHANGED
|
@@ -1 +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-2f18cb71]{display:flex;flex:1 1 0;justify-content:center;min-width:0;overflow-x:clip}.page-layout-anchor-navigation ul[data-v-2f18cb71]{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-2f18cb71]{display:none}.page-layout-anchor-navigation ul li[data-v-2f18cb71]{display:flex}.page-layout-anchor-navigation .anchor-link[data-v-2f18cb71]{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-2f18cb71]: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-2f18cb71]: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-2f18cb71]{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-2f18cb71]{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-2f18cb71]{color:#6c7489;color:var(--kui-color-text-neutral, #6c7489)}.kong-ui-public-page-layout[data-v-e714e65a]{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-e714e65a]{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-e714e65a]{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-e714e65a]{min-width:0}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .header-breadcrumbs[data-v-e714e65a] .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-e714e65a] .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-e714e65a]{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-e714e65a],.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button[data-v-e714e65a]{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-e714e65a]:hover,.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button[data-v-e714e65a]: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-e714e65a]:focus-visible,.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button[data-v-e714e65a]: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-e714e65a]{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-e714e65a]>*{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-e714e65a]{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-e714e65a]{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-e714e65a]: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-e714e65a]{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-e714e65a]{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-e714e65a]{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-e714e65a]{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-e714e65a]{position:sticky;top:0;z-index:3}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container[data-v-e714e65a]{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-e714e65a]{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-e714e65a]{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-e714e65a]{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-e714e65a]>*{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-e714e65a],.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start .title-after-container[data-v-e714e65a]{flex-shrink:0}.kong-ui-public-page-layout.new-appearance .page-layout-header:not(:has(.page-layout-tabs)) .page-header-container[data-v-e714e65a]{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-e714e65a]{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-e714e65a]{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-e714e65a]{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-e714e65a]{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-e714e65a]{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-e714e65a]{flex-shrink:0;width:400px}}.kong-ui-public-page-layout[data-v-e714e65a] [data-anchor-attention]{animation:anchor-attention-e714e65a 1s cubic-bezier(.2,0,0,1) both;animation:anchor-attention-e714e65a calc(var(--kui-animation-duration-20, .2s) * 5) cubic-bezier(.2,0,0,1) both}@media(prefers-reduced-motion:reduce){.kong-ui-public-page-layout[data-v-e714e65a] [data-anchor-attention]{animation-name:anchor-attention-still-e714e65a}}@keyframes anchor-attention-e714e65a{0%{box-shadow:0 0 color-mix(in srgb,#0044f4 80%,transparent);box-shadow:0 0 color-mix(in srgb,var(--kui-color-brand, #0044f4) 80%,transparent)}18%{box-shadow:0 0 0 4px color-mix(in srgb,#0044f4 70%,transparent);box-shadow:0 0 0 var(--kui-border-width-30, 4px) color-mix(in srgb,var(--kui-color-brand, #0044f4) 70%,transparent)}55%{box-shadow:0 0 0 8px color-mix(in srgb,#0044f4 28%,transparent);box-shadow:0 0 0 calc(var(--kui-border-width-30, 4px) * 2) color-mix(in srgb,var(--kui-color-brand, #0044f4) 28%,transparent)}to{box-shadow:0 0 0 12px color-mix(in srgb,#0044f4 0%,transparent);box-shadow:0 0 0 calc(var(--kui-border-width-30, 4px) * 3) color-mix(in srgb,var(--kui-color-brand, #0044f4) 0%,transparent)}}@keyframes anchor-attention-still-e714e65a{0%,45%{box-shadow:0 0 0 2px color-mix(in srgb,#0044f4 70%,transparent);box-shadow:0 0 0 var(--kui-border-width-20, 2px) color-mix(in srgb,var(--kui-color-brand, #0044f4) 70%,transparent)}to{box-shadow:0 0 0 2px color-mix(in srgb,#0044f4 0%,transparent);box-shadow:0 0 0 var(--kui-border-width-20, 2px) color-mix(in srgb,var(--kui-color-brand, #0044f4) 0%,transparent)}}.kong-ui-public-about-card[data-v-86b6c183]{--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-86b6c183]{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-86b6c183]{display:flex;flex-direction:column;gap:12px;gap:var(--kui-space-50, 12px)}.kong-ui-public-about-card .about-card-rows[data-v-86b6c183]{display:flex;flex-direction:column;margin:0;margin:var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row[data-v-86b6c183]{align-items:center;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;gap:8px;gap:var(--kui-space-40, 8px);min-height:47px;padding:8px 0;padding:var(--kui-space-40, 8px) var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row[data-v-86b6c183]: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-86b6c183]:first-child{padding-top:0;padding-top:var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row-label[data-v-86b6c183]{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-86b6c183]{-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-86b6c183]{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-86b6c183]{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-86b6c183]{margin-top:16px;margin-top:var(--kui-space-60, 16px)}@container (max-width: 320px){.kong-ui-public-about-card .about-card-row[data-v-86b6c183]{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-86b6c183]{width:auto}}
|
|
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-2f18cb71]{display:flex;flex:1 1 0;justify-content:center;min-width:0;overflow-x:clip}.page-layout-anchor-navigation ul[data-v-2f18cb71]{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-2f18cb71]{display:none}.page-layout-anchor-navigation ul li[data-v-2f18cb71]{display:flex}.page-layout-anchor-navigation .anchor-link[data-v-2f18cb71]{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-2f18cb71]: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-2f18cb71]: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-2f18cb71]{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-2f18cb71]{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-2f18cb71]{color:#6c7489;color:var(--kui-color-text-neutral, #6c7489)}.kong-ui-public-page-layout[data-v-3e9b1adf]{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-3e9b1adf]{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-3e9b1adf]{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-3e9b1adf]{min-width:0}.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .header-breadcrumbs[data-v-3e9b1adf] .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-3e9b1adf] .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-3e9b1adf]{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-3e9b1adf],.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button[data-v-3e9b1adf]{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-3e9b1adf]:hover,.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button[data-v-3e9b1adf]: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-3e9b1adf]:focus-visible,.kong-ui-public-page-layout .page-layout-header .page-header-container .page-header-start .title-container .favorite-button[data-v-3e9b1adf]: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-3e9b1adf]{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-3e9b1adf]>*{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-3e9b1adf]{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-3e9b1adf]{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-3e9b1adf]: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-3e9b1adf]{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-3e9b1adf]{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-3e9b1adf]{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-3e9b1adf]{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-3e9b1adf]{position:sticky;top:0;z-index:3}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container[data-v-3e9b1adf]{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-3e9b1adf]{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-3e9b1adf]{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-3e9b1adf]{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-3e9b1adf]>*{font-size:12px;font-size:var(--kui-font-size-20, 12px);line-height:16px;line-height:var(--kui-line-height-20, 16px);max-width:40ch}.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start .header-breadcrumbs[data-v-3e9b1adf],.kong-ui-public-page-layout.new-appearance .page-layout-header .page-header-container .page-header-start .title-after-container[data-v-3e9b1adf]{flex-shrink:0}.kong-ui-public-page-layout.new-appearance .page-layout-header:not(:has(.page-layout-tabs)) .page-header-container[data-v-3e9b1adf]{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-3e9b1adf]{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-3e9b1adf]{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-3e9b1adf]{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-3e9b1adf]{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-3e9b1adf]{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-3e9b1adf]{flex-shrink:0;width:400px}}.kong-ui-public-page-layout[data-v-3e9b1adf] [data-anchor-attention]{animation:anchor-attention-3e9b1adf 1s cubic-bezier(.2,0,0,1) both;animation:anchor-attention-3e9b1adf calc(var(--kui-animation-duration-20, .2s) * 5) cubic-bezier(.2,0,0,1) both}@media(prefers-reduced-motion:reduce){.kong-ui-public-page-layout[data-v-3e9b1adf] [data-anchor-attention]{animation-name:anchor-attention-still-3e9b1adf}}@keyframes anchor-attention-3e9b1adf{0%{box-shadow:0 0 color-mix(in srgb,#0044f4 80%,transparent);box-shadow:0 0 color-mix(in srgb,var(--kui-color-brand, #0044f4) 80%,transparent)}18%{box-shadow:0 0 0 4px color-mix(in srgb,#0044f4 70%,transparent);box-shadow:0 0 0 var(--kui-border-width-30, 4px) color-mix(in srgb,var(--kui-color-brand, #0044f4) 70%,transparent)}55%{box-shadow:0 0 0 8px color-mix(in srgb,#0044f4 28%,transparent);box-shadow:0 0 0 calc(var(--kui-border-width-30, 4px) * 2) color-mix(in srgb,var(--kui-color-brand, #0044f4) 28%,transparent)}to{box-shadow:0 0 0 12px color-mix(in srgb,#0044f4 0%,transparent);box-shadow:0 0 0 calc(var(--kui-border-width-30, 4px) * 3) color-mix(in srgb,var(--kui-color-brand, #0044f4) 0%,transparent)}}@keyframes anchor-attention-still-3e9b1adf{0%,45%{box-shadow:0 0 0 2px color-mix(in srgb,#0044f4 70%,transparent);box-shadow:0 0 0 var(--kui-border-width-20, 2px) color-mix(in srgb,var(--kui-color-brand, #0044f4) 70%,transparent)}to{box-shadow:0 0 0 2px color-mix(in srgb,#0044f4 0%,transparent);box-shadow:0 0 0 var(--kui-border-width-20, 2px) color-mix(in srgb,var(--kui-color-brand, #0044f4) 0%,transparent)}}.kong-ui-public-about-card[data-v-3ecdd6e6]{container-type:inline-size}.kong-ui-public-about-card .about-card-description[data-v-3ecdd6e6]{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-3ecdd6e6]{display:flex;flex-direction:column;gap:12px;gap:var(--kui-space-50, 12px)}.kong-ui-public-about-card .about-card-rows[data-v-3ecdd6e6]{display:flex;flex-direction:column;margin:0;margin:var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row[data-v-3ecdd6e6]{align-items:center;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;gap:8px;gap:var(--kui-space-40, 8px);min-height:47px;padding:8px 0;padding:var(--kui-space-40, 8px) var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row[data-v-3ecdd6e6]: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-3ecdd6e6]:first-child{padding-top:0;padding-top:var(--kui-space-0, 0px)}.kong-ui-public-about-card .about-card-row-label[data-v-3ecdd6e6]{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-3ecdd6e6]{-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-3ecdd6e6]{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-3ecdd6e6]{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-3ecdd6e6]{margin-top:16px;margin-top:var(--kui-space-60, 16px)}@container (max-width: 320px){.kong-ui-public-about-card .about-card-row[data-v-3ecdd6e6]{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-3ecdd6e6]{width:auto}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AboutCard.vue.d.ts","sourceRoot":"","sources":["../../../src/components/AboutCard.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"AboutCard.vue.d.ts","sourceRoot":"","sources":["../../../src/components/AboutCard.vue"],"names":[],"mappings":"AA4OA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAY9D,KAAK,WAAW,GAAG,cAAc,CAAC;AAwMlC,QAAA,MAAM,UAAU,wSAEd,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
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kong-ui-public/page-layout",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.3-pr.3958.1339dfc7e.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./dist/page-layout.umd.js",
|
|
6
6
|
"module": "./dist/page-layout.es.js",
|
|
@@ -22,10 +22,10 @@
|
|
|
22
22
|
},
|
|
23
23
|
"devDependencies": {
|
|
24
24
|
"@kong-ui-public/i18n": "^2.5.1",
|
|
25
|
-
"@kong-ui-public/sandbox-layout": "^2.8.
|
|
26
|
-
"@kong/design-tokens": "3.4.
|
|
25
|
+
"@kong-ui-public/sandbox-layout": "^2.8.2-pr.3958.1339dfc7e.0",
|
|
26
|
+
"@kong/design-tokens": "3.4.4",
|
|
27
27
|
"@kong/icons": "^1.62.1",
|
|
28
|
-
"@kong/kongponents": "9.
|
|
28
|
+
"@kong/kongponents": "9.66.4",
|
|
29
29
|
"vue": "^3.5.43",
|
|
30
30
|
"vue-router": "^5.3.1"
|
|
31
31
|
},
|