@kong-ui-public/sandbox-layout 2.4.3 → 2.4.4-pr.3045.75be65007.0

package/dist/sandbox-layout.umd.js

@@ -1 +1 @@
-(function(n,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@kong/icons")):typeof define=="function"&&define.amd?define(["exports","vue","@kong/icons"],e):(n=typeof globalThis<"u"?globalThis:n||self,e(n["kong-ui-public-sandbox-layout"]={},n.Vue,n.KongIcons))})(this,(function(n,e,m){"use strict";const k="kong-ui-sandbox-layout-links",N={key:0,class:"kong-ui-sandbox-navigation"},g=e.defineComponent({__name:"SandboxNavigation",emits:["router-link-click"],setup(o,{emit:l}){const s=l,t=e.inject(k,[]);return(d,_)=>{const r=e.resolveComponent("router-link");return e.openBlock(),e.createElementBlock("nav",null,[e.unref(t).length?(e.openBlock(),e.createElementBlock("ul",N,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(t),c=>(e.openBlock(),e.createElementBlock("li",{key:c.name,class:"sandbox-link"},[e.createVNode(r,{to:c.to,onClick:a=>s("router-link-click",c)},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(c.name),1)]),_:2},1032,["to","onClick"])]))),128))])):e.createCommentVNode("",!0)])}}}),p=(o,l)=>{const s=o.__vccOpts||o;for(const[t,d]of l)s[t]=d;return s},f=p(g,[["__scopeId","data-v-b67e5e07"]]),h="24px",C={class:"kong-ui-sandbox-layout"},V={class:"header"},b={class:"header-left"},y={class:"mobile-nav-container"},x={class:"toggle-mobile-nav"},E={key:0,class:"mobile-title"},B={class:"header-right"},S={key:0,class:"mobile-controls-container"},u={class:"toggle-mobile-controls"},T={class:"layout"},I={class:"desktop-nav-container"},K={class:"sandbox-container"},L={key:0},$={key:0,class:"sandbox-controls"},O=p(e.defineComponent({__name:"SandboxLayout",props:{title:{type:String,default:""},links:{type:Array,required:!1,default:()=>[]},controlsMinWidth:{type:Number,default:240}},setup(o){e.useCssVars(t=>({v013f10df:s.value}));const l=o;e.provide(k,l.links);const s=e.computed(()=>`${l.controlsMinWidth}px`);return(t,d)=>{const _=e.resolveComponent("KSlideout"),r=e.resolveComponent("KToggle"),c=e.resolveComponent("router-link");return e.openBlock(),e.createElementBlock("div",C,[e.createElementVNode("header",V,[e.createElementVNode("div",b,[e.createElementVNode("div",y,[e.createVNode(r,null,{default:e.withCtx(({isToggled:a,toggle:i})=>[e.createElementVNode("div",null,[e.createElementVNode("div",x,[e.createVNode(e.unref(m.MenuIcon),{role:"button",size:e.unref(h),title:"Toggle menu",onClick:i},null,8,["size","onClick"])]),e.createVNode(_,{title:"Main Menu",visible:a.value,onClose:i},{default:e.withCtx(()=>[e.createVNode(f,{onRouterLinkClick:i},null,8,["onRouterLinkClick"])]),_:2},1032,["visible","onClose"])])]),_:1}),o.title?(e.openBlock(),e.createElementBlock("h1",E,[e.createVNode(c,{class:"home-link",to:{name:"home"}},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.title),1)]),_:1})])):e.createCommentVNode("",!0)])]),e.createElementVNode("div",B,[t.$slots.controls?(e.openBlock(),e.createElementBlock("div",S,[e.createVNode(r,null,{default:e.withCtx(({isToggled:a,toggle:i})=>[e.createElementVNode("div",null,[e.createElementVNode("div",u,[e.createVNode(e.unref(m.CogIcon),{role:"button",size:e.unref(h),title:"Toggle controls",onClick:i},null,8,["size","onClick"])]),e.createVNode(_,{title:"Controls",visible:a.value,onClose:i},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"controls",{},void 0,!0)]),_:3},8,["visible","onClose"])])]),_:3})])):e.createCommentVNode("",!0)])]),e.createElementVNode("div",T,[e.createElementVNode("div",I,[e.createVNode(f)]),e.createElementVNode("div",K,[o.title?(e.openBlock(),e.createElementBlock("h1",L,e.toDisplayString(o.title),1)):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"default",{},void 0,!0)]),t.$slots.controls?(e.openBlock(),e.createElementBlock("div",$,[e.renderSlot(t.$slots,"controls",{},void 0,!0)])):e.createCommentVNode("",!0)])])}}}),[["__scopeId","data-v-c0d4de41"]]);n.SandboxLayout=O,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})}));
+(function(n,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@kong/icons")):typeof define=="function"&&define.amd?define(["exports","vue","@kong/icons"],e):(n=typeof globalThis<"u"?globalThis:n||self,e(n["kong-ui-public-sandbox-layout"]={},n.Vue,n.KongIcons))})(this,function(n,e,m){"use strict";const k="kong-ui-sandbox-layout-links",N={key:0,class:"kong-ui-sandbox-navigation"},g=e.defineComponent({__name:"SandboxNavigation",emits:["router-link-click"],setup(o,{emit:l}){const s=l,t=e.inject(k,[]);return(d,_)=>{const r=e.resolveComponent("router-link");return e.openBlock(),e.createElementBlock("nav",null,[e.unref(t).length?(e.openBlock(),e.createElementBlock("ul",N,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(t),c=>(e.openBlock(),e.createElementBlock("li",{key:c.name,class:"sandbox-link"},[e.createVNode(r,{to:c.to,onClick:a=>s("router-link-click",c)},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(c.name),1)]),_:2},1032,["to","onClick"])]))),128))])):e.createCommentVNode("",!0)])}}}),p=(o,l)=>{const s=o.__vccOpts||o;for(const[t,d]of l)s[t]=d;return s},f=p(g,[["__scopeId","data-v-b67e5e07"]]),h="24px",C={class:"kong-ui-sandbox-layout"},V={class:"header"},b={class:"header-left"},y={class:"mobile-nav-container"},x={class:"toggle-mobile-nav"},E={key:0,class:"mobile-title"},B={class:"header-right"},S={key:0,class:"mobile-controls-container"},u={class:"toggle-mobile-controls"},T={class:"layout"},I={class:"desktop-nav-container"},K={class:"sandbox-container"},L={key:0},$={key:0,class:"sandbox-controls"},O=p(e.defineComponent({__name:"SandboxLayout",props:{title:{type:String,default:""},links:{type:Array,required:!1,default:()=>[]},controlsMinWidth:{type:Number,default:240}},setup(o){e.useCssVars(t=>({v013f10df:s.value}));const l=o;e.provide(k,l.links);const s=e.computed(()=>`${l.controlsMinWidth}px`);return(t,d)=>{const _=e.resolveComponent("KSlideout"),r=e.resolveComponent("KToggle"),c=e.resolveComponent("router-link");return e.openBlock(),e.createElementBlock("div",C,[e.createElementVNode("header",V,[e.createElementVNode("div",b,[e.createElementVNode("div",y,[e.createVNode(r,null,{default:e.withCtx(({isToggled:a,toggle:i})=>[e.createElementVNode("div",null,[e.createElementVNode("div",x,[e.createVNode(e.unref(m.MenuIcon),{role:"button",size:e.unref(h),title:"Toggle menu",onClick:i},null,8,["size","onClick"])]),e.createVNode(_,{title:"Main Menu",visible:a.value,onClose:i},{default:e.withCtx(()=>[e.createVNode(f,{onRouterLinkClick:i},null,8,["onRouterLinkClick"])]),_:2},1032,["visible","onClose"])])]),_:1}),o.title?(e.openBlock(),e.createElementBlock("h1",E,[e.createVNode(c,{class:"home-link",to:{name:"home"}},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.title),1)]),_:1})])):e.createCommentVNode("",!0)])]),e.createElementVNode("div",B,[t.$slots.controls?(e.openBlock(),e.createElementBlock("div",S,[e.createVNode(r,null,{default:e.withCtx(({isToggled:a,toggle:i})=>[e.createElementVNode("div",null,[e.createElementVNode("div",u,[e.createVNode(e.unref(m.CogIcon),{role:"button",size:e.unref(h),title:"Toggle controls",onClick:i},null,8,["size","onClick"])]),e.createVNode(_,{title:"Controls",visible:a.value,onClose:i},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"controls",{},void 0,!0)]),_:3},8,["visible","onClose"])])]),_:3})])):e.createCommentVNode("",!0)])]),e.createElementVNode("div",T,[e.createElementVNode("div",I,[e.createVNode(f)]),e.createElementVNode("div",K,[o.title?(e.openBlock(),e.createElementBlock("h1",L,e.toDisplayString(o.title),1)):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"default",{},void 0,!0)]),t.$slots.controls?(e.openBlock(),e.createElementBlock("div",$,[e.renderSlot(t.$slots,"controls",{},void 0,!0)])):e.createCommentVNode("",!0)])])}}}),[["__scopeId","data-v-c0d4de41"]]);n.SandboxLayout=O,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})});

package/dist/style.css

@@ -1 +1 @@
-.kong-ui-sandbox-navigation[data-v-b67e5e07]{list-style:none;margin:0;margin:var(--kui-space-0, 0px);padding:0;padding:var(--kui-space-0, 0px)}.kong-ui-sandbox-navigation .sandbox-link[data-v-b67e5e07]{margin-bottom:8px;margin-bottom:var(--kui-space-40, 8px)}.kong-ui-sandbox-navigation .sandbox-link[data-v-b67e5e07]:last-of-type{margin-bottom:0}.kong-ui-sandbox-navigation .sandbox-link a[data-v-b67e5e07]{background:#eee;border-radius:4px;border-radius:var(--kui-border-radius-20, 4px);color:#0044f4;color:var(--kui-color-text-primary, #0044f4);display:block;font-weight:600;font-weight:var(--kui-font-weight-semibold, 600);overflow:hidden;padding:8px 16px;padding:var(--kui-space-40, 8px) var(--kui-space-60, 16px);text-decoration:none;text-overflow:ellipsis;transition:all .2s ease-in-out;transition:all var(--kui-animation-duration-20, .2s) ease-in-out;white-space:nowrap}.kong-ui-sandbox-navigation .sandbox-link a[data-v-b67e5e07]:hover{background:#ccc;color:#002099;color:var(--kui-color-text-primary-stronger, #002099)}.kong-ui-sandbox-navigation .sandbox-link a.router-link-exact-active[data-v-b67e5e07],.kong-ui-sandbox-navigation .sandbox-link a.active[data-v-b67e5e07],.kong-ui-sandbox-navigation .sandbox-link a.router-link-exact-active[data-v-b67e5e07]:hover,.kong-ui-sandbox-navigation .sandbox-link a.active[data-v-b67e5e07]:hover{background:#0044f4;background:var(--kui-color-background-primary, #0044f4);color:#fff;color:var(--kui-color-text-inverse, #ffffff)}html,body{margin:0;padding:0}.kong-ui-sandbox-layout .header[data-v-c0d4de41]{align-items:center;border-bottom:1px solid #e0e4ea;border-bottom:var(--kui-border-width-10, 1px) solid var(--kui-color-border, #e0e4ea);display:flex;justify-content:space-between;width:100%}@media(min-width:1280px){.kong-ui-sandbox-layout .header[data-v-c0d4de41]{display:none}}.kong-ui-sandbox-layout .header .header-left[data-v-c0d4de41],.kong-ui-sandbox-layout .header .header-right[data-v-c0d4de41]{align-items:center;display:flex;gap:20px;gap:var(--kui-space-70, 20px);padding:20px;padding:var(--kui-space-70, 20px);width:100%}.kong-ui-sandbox-layout .header .header-right[data-v-c0d4de41]{justify-content:flex-end}.kong-ui-sandbox-layout .header h1[data-v-c0d4de41]{font-size:18px;font-size:var(--kui-font-size-50, 18px);margin:0;margin:var(--kui-space-0, 0px);white-space:nowrap}@media(min-width:768px){.kong-ui-sandbox-layout .header h1[data-v-c0d4de41]{font-size:24px;font-size:var(--kui-font-size-70, 24px)}}.kong-ui-sandbox-layout .layout[data-v-c0d4de41]{display:flex;gap:20px;gap:var(--kui-space-70, 20px);padding:20px;padding:var(--kui-space-70, 20px)}.kong-ui-sandbox-layout .mobile-nav-container[data-v-c0d4de41]{align-items:center;display:flex;gap:20px;gap:var(--kui-space-70, 20px)}@media(min-width:1280px){.kong-ui-sandbox-layout .mobile-nav-container[data-v-c0d4de41],.kong-ui-sandbox-layout .mobile-controls-container[data-v-c0d4de41],.kong-ui-sandbox-layout .mobile-title[data-v-c0d4de41]{display:none}}.kong-ui-sandbox-layout .sandbox-controls[data-v-c0d4de41],.kong-ui-sandbox-layout .desktop-nav-container[data-v-c0d4de41]{display:none}@media(min-width:1280px){.kong-ui-sandbox-layout .sandbox-controls[data-v-c0d4de41],.kong-ui-sandbox-layout .desktop-nav-container[data-v-c0d4de41]{display:block}}.kong-ui-sandbox-layout .desktop-nav-container[data-v-c0d4de41]{min-width:240px}.kong-ui-sandbox-layout .sandbox-container[data-v-c0d4de41]{min-height:50vh;width:100%}@media(min-width:1280px){.kong-ui-sandbox-layout .sandbox-container[data-v-c0d4de41]{border:1px solid #e0e4ea;border:var(--kui-border-width-10, 1px) solid var(--kui-color-border, #e0e4ea);border-radius:6px;border-radius:var(--kui-border-radius-30, 6px);padding:20px;padding:var(--kui-space-70, 20px)}}.kong-ui-sandbox-layout .sandbox-container h1[data-v-c0d4de41]{margin:0 0 20px;margin:var(--kui-space-0, 0px) var(--kui-space-0, 0px) var(--kui-space-70, 20px)}.kong-ui-sandbox-layout .sandbox-controls[data-v-c0d4de41]{min-width:var(--v013f10df)}@media(min-width:1280px){.kong-ui-sandbox-layout .sandbox-controls[data-v-c0d4de41]{border:1px solid #e0e4ea;border:var(--kui-border-width-10, 1px) solid var(--kui-color-border, #e0e4ea);border-radius:6px;border-radius:var(--kui-border-radius-30, 6px);padding:20px;padding:var(--kui-space-70, 20px)}}.kong-ui-sandbox-layout .home-link[data-v-c0d4de41],.kong-ui-sandbox-layout .home-link[data-v-c0d4de41]:visited{color:#0044f4;color:var(--kui-color-text-primary, #0044f4);text-decoration:none}.kong-ui-sandbox-layout .toggle-mobile-nav[data-v-c0d4de41],.kong-ui-sandbox-layout .toggle-mobile-controls[data-v-c0d4de41]{color:#0044f4;color:var(--kui-color-text-primary, #0044f4);cursor:pointer;transition:color .2s ease-in-out;transition:color var(--kui-animation-duration-20, .2s) ease-in-out}.kong-ui-sandbox-layout .toggle-mobile-nav[data-v-c0d4de41]:hover,.kong-ui-sandbox-layout .toggle-mobile-controls[data-v-c0d4de41]:hover{color:#0030cc;color:var(--kui-color-text-primary-strong, #0030cc)}.kong-ui-sandbox-layout[data-v-c0d4de41] .k-slideout,.kong-ui-sandbox-layout[data-v-c0d4de41] .k-card-body{font-size:16px;font-size:var(--kui-font-size-40, 16px)}
+.kong-ui-sandbox-navigation[data-v-b67e5e07]{list-style:none;margin:0;margin:var(--kui-space-0, 0px);padding:0;padding:var(--kui-space-0, 0px)}.kong-ui-sandbox-navigation .sandbox-link[data-v-b67e5e07]{margin-bottom:8px;margin-bottom:var(--kui-space-40, 8px)}.kong-ui-sandbox-navigation .sandbox-link[data-v-b67e5e07]:last-of-type{margin-bottom:0}.kong-ui-sandbox-navigation .sandbox-link a[data-v-b67e5e07]{background:#eee;border-radius:4px;border-radius:var(--kui-border-radius-20, 4px);color:#0044f4;color:var(--kui-color-text-primary, #0044f4);display:block;font-weight:600;font-weight:var(--kui-font-weight-semibold, 600);overflow:hidden;padding:8px 16px;padding:var(--kui-space-40, 8px) var(--kui-space-60, 16px);text-decoration:none;text-overflow:ellipsis;transition:all .2s ease-in-out;transition:all var(--kui-animation-duration-20, .2s) ease-in-out;white-space:nowrap}.kong-ui-sandbox-navigation .sandbox-link a[data-v-b67e5e07]:hover{background:#ccc;color:#002099;color:var(--kui-color-text-primary-stronger, #002099)}.kong-ui-sandbox-navigation .sandbox-link a.router-link-exact-active[data-v-b67e5e07],.kong-ui-sandbox-navigation .sandbox-link a.active[data-v-b67e5e07],.kong-ui-sandbox-navigation .sandbox-link a.router-link-exact-active[data-v-b67e5e07]:hover,.kong-ui-sandbox-navigation .sandbox-link a.active[data-v-b67e5e07]:hover{background:#0044f4;background:var(--kui-color-background-primary, #0044f4);color:#fff;color:var(--kui-color-text-inverse, #ffffff)}html,body{margin:0;padding:0}.kong-ui-sandbox-layout .header[data-v-c0d4de41]{align-items:center;border-bottom:1px solid #e0e4ea;border-bottom:var(--kui-border-width-10, 1px) solid var(--kui-color-border, #e0e4ea);display:flex;justify-content:space-between;width:100%}@media (min-width: 1280px){.kong-ui-sandbox-layout .header[data-v-c0d4de41]{display:none}}.kong-ui-sandbox-layout .header .header-left[data-v-c0d4de41],.kong-ui-sandbox-layout .header .header-right[data-v-c0d4de41]{align-items:center;display:flex;gap:20px;gap:var(--kui-space-70, 20px);padding:20px;padding:var(--kui-space-70, 20px);width:100%}.kong-ui-sandbox-layout .header .header-right[data-v-c0d4de41]{justify-content:flex-end}.kong-ui-sandbox-layout .header h1[data-v-c0d4de41]{font-size:18px;font-size:var(--kui-font-size-50, 18px);margin:0;margin:var(--kui-space-0, 0px);white-space:nowrap}@media (min-width: 768px){.kong-ui-sandbox-layout .header h1[data-v-c0d4de41]{font-size:24px;font-size:var(--kui-font-size-70, 24px)}}.kong-ui-sandbox-layout .layout[data-v-c0d4de41]{display:flex;gap:20px;gap:var(--kui-space-70, 20px);padding:20px;padding:var(--kui-space-70, 20px)}.kong-ui-sandbox-layout .mobile-nav-container[data-v-c0d4de41]{align-items:center;display:flex;gap:20px;gap:var(--kui-space-70, 20px)}@media (min-width: 1280px){.kong-ui-sandbox-layout .mobile-nav-container[data-v-c0d4de41],.kong-ui-sandbox-layout .mobile-controls-container[data-v-c0d4de41],.kong-ui-sandbox-layout .mobile-title[data-v-c0d4de41]{display:none}}.kong-ui-sandbox-layout .sandbox-controls[data-v-c0d4de41],.kong-ui-sandbox-layout .desktop-nav-container[data-v-c0d4de41]{display:none}@media (min-width: 1280px){.kong-ui-sandbox-layout .sandbox-controls[data-v-c0d4de41],.kong-ui-sandbox-layout .desktop-nav-container[data-v-c0d4de41]{display:block}}.kong-ui-sandbox-layout .desktop-nav-container[data-v-c0d4de41]{min-width:240px}.kong-ui-sandbox-layout .sandbox-container[data-v-c0d4de41]{min-height:50vh;width:100%}@media (min-width: 1280px){.kong-ui-sandbox-layout .sandbox-container[data-v-c0d4de41]{border:1px solid #e0e4ea;border:var(--kui-border-width-10, 1px) solid var(--kui-color-border, #e0e4ea);border-radius:6px;border-radius:var(--kui-border-radius-30, 6px);padding:20px;padding:var(--kui-space-70, 20px)}}.kong-ui-sandbox-layout .sandbox-container h1[data-v-c0d4de41]{margin:0 0 20px;margin:var(--kui-space-0, 0px) var(--kui-space-0, 0px) var(--kui-space-70, 20px)}.kong-ui-sandbox-layout .sandbox-controls[data-v-c0d4de41]{min-width:var(--v013f10df)}@media (min-width: 1280px){.kong-ui-sandbox-layout .sandbox-controls[data-v-c0d4de41]{border:1px solid #e0e4ea;border:var(--kui-border-width-10, 1px) solid var(--kui-color-border, #e0e4ea);border-radius:6px;border-radius:var(--kui-border-radius-30, 6px);padding:20px;padding:var(--kui-space-70, 20px)}}.kong-ui-sandbox-layout .home-link[data-v-c0d4de41],.kong-ui-sandbox-layout .home-link[data-v-c0d4de41]:visited{color:#0044f4;color:var(--kui-color-text-primary, #0044f4);text-decoration:none}.kong-ui-sandbox-layout .toggle-mobile-nav[data-v-c0d4de41],.kong-ui-sandbox-layout .toggle-mobile-controls[data-v-c0d4de41]{color:#0044f4;color:var(--kui-color-text-primary, #0044f4);cursor:pointer;transition:color .2s ease-in-out;transition:color var(--kui-animation-duration-20, .2s) ease-in-out}.kong-ui-sandbox-layout .toggle-mobile-nav[data-v-c0d4de41]:hover,.kong-ui-sandbox-layout .toggle-mobile-controls[data-v-c0d4de41]:hover{color:#0030cc;color:var(--kui-color-text-primary-strong, #0030cc)}.kong-ui-sandbox-layout[data-v-c0d4de41] .k-slideout,.kong-ui-sandbox-layout[data-v-c0d4de41] .k-card-body{font-size:16px;font-size:var(--kui-font-size-40, 16px)}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kong-ui-public/sandbox-layout",
-  "version": "2.4.3",
+  "version": "2.4.4-pr.3045.75be65007.0",
   "type": "module",
   "main": "./dist/sandbox-layout.umd.js",
   "module": "./dist/sandbox-layout.es.js",
@@ -47,7 +47,7 @@
     "vue": ">= 3.3.13 < 4"
   },
   "dependencies": {
-    "@kong/icons": "^1.47.0"
+    "@kong/icons": "^1.48.0"
   },
   "scripts": {
     "dev": "cross-env USE_SANDBOX=true vite",