@kong-ui-public/sandbox-layout 2.1.76-pr.2274.f680a8e93.0 → 2.2.1
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/sandbox-layout.es.js +9 -9
- package/dist/sandbox-layout.umd.js +1 -1
- package/dist/style.css +1 -1
- package/dist/types/components/SandboxLayout.vue.d.ts +10 -12
- package/dist/types/components/SandboxLayout.vue.d.ts.map +1 -1
- package/dist/types/components/SandboxNavigation.vue.d.ts +1 -1
- package/dist/types/components/SandboxNavigation.vue.d.ts.map +1 -1
- package/package.json +4 -4
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent as y, inject as N, resolveComponent as k, createElementBlock as s, openBlock as l, createCommentVNode as _, unref as u, Fragment as T, renderList as $, createVNode as e, withCtx as d, createTextVNode as x, toDisplayString as
|
|
1
|
+
import { defineComponent as y, inject as N, resolveComponent as k, createElementBlock as s, openBlock as l, createCommentVNode as _, unref as u, Fragment as T, renderList as $, createVNode as e, withCtx as d, createTextVNode as x, toDisplayString as p, useCssVars as K, computed as L, provide as O, createElementVNode as o, renderSlot as b } from "vue";
|
|
2
2
|
import { MenuIcon as E, CogIcon as V } from "@kong/icons";
|
|
3
3
|
const S = "kong-ui-sandbox-layout-links", z = {
|
|
4
4
|
key: 0,
|
|
@@ -21,7 +21,7 @@ const S = "kong-ui-sandbox-layout-links", z = {
|
|
|
21
21
|
onClick: (m) => c("router-link-click", a)
|
|
22
22
|
}, {
|
|
23
23
|
default: d(() => [
|
|
24
|
-
x(
|
|
24
|
+
x(p(a.name), 1)
|
|
25
25
|
]),
|
|
26
26
|
_: 2
|
|
27
27
|
}, 1032, ["to", "onClick"])
|
|
@@ -63,7 +63,7 @@ const S = "kong-ui-sandbox-layout-links", z = {
|
|
|
63
63
|
},
|
|
64
64
|
setup(n) {
|
|
65
65
|
K((t) => ({
|
|
66
|
-
"
|
|
66
|
+
"4f585fbc": c.value
|
|
67
67
|
}));
|
|
68
68
|
const i = n;
|
|
69
69
|
O(S, i.links);
|
|
@@ -105,7 +105,7 @@ const S = "kong-ui-sandbox-layout-links", z = {
|
|
|
105
105
|
to: { name: "home" }
|
|
106
106
|
}, {
|
|
107
107
|
default: d(() => [
|
|
108
|
-
x(
|
|
108
|
+
x(p(n.title), 1)
|
|
109
109
|
]),
|
|
110
110
|
_: 1
|
|
111
111
|
})
|
|
@@ -131,7 +131,7 @@ const S = "kong-ui-sandbox-layout-links", z = {
|
|
|
131
131
|
onClose: r
|
|
132
132
|
}, {
|
|
133
133
|
default: d(() => [
|
|
134
|
-
|
|
134
|
+
b(t.$slots, "controls", {}, void 0, !0)
|
|
135
135
|
]),
|
|
136
136
|
_: 2
|
|
137
137
|
}, 1032, ["visible", "onClose"])
|
|
@@ -147,17 +147,17 @@ const S = "kong-ui-sandbox-layout-links", z = {
|
|
|
147
147
|
e(f)
|
|
148
148
|
]),
|
|
149
149
|
o("div", G, [
|
|
150
|
-
n.title ? (l(), s("h1", J,
|
|
151
|
-
|
|
150
|
+
n.title ? (l(), s("h1", J, p(n.title), 1)) : _("", !0),
|
|
151
|
+
b(t.$slots, "default", {}, void 0, !0)
|
|
152
152
|
]),
|
|
153
153
|
t.$slots.controls ? (l(), s("div", X, [
|
|
154
|
-
|
|
154
|
+
b(t.$slots, "controls", {}, void 0, !0)
|
|
155
155
|
])) : _("", !0)
|
|
156
156
|
])
|
|
157
157
|
]);
|
|
158
158
|
};
|
|
159
159
|
}
|
|
160
|
-
}), Q = /* @__PURE__ */ I(Z, [["__scopeId", "data-v-
|
|
160
|
+
}), Q = /* @__PURE__ */ I(Z, [["__scopeId", "data-v-62a393b2"]]);
|
|
161
161
|
export {
|
|
162
162
|
Q as SandboxLayout
|
|
163
163
|
};
|
|
@@ -1 +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
|
|
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-2cb154ed"]]),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=>({"4f585fbc":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)]),_:2},1032,["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-62a393b2"]]);n.SandboxLayout=O,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})});
|
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.kong-ui-sandbox-navigation[data-v-2cb154ed]{list-style:none;margin:0;padding:0}.kong-ui-sandbox-navigation .sandbox-link[data-v-2cb154ed]{margin-bottom:8px}.kong-ui-sandbox-navigation .sandbox-link[data-v-2cb154ed]:last-of-type{margin-bottom:0}.kong-ui-sandbox-navigation .sandbox-link a[data-v-2cb154ed]{background:#eee;border-radius:4px;color:#0044f4;display:block;font-weight:600;overflow:hidden;padding:8px 16px;text-decoration:none;text-overflow:ellipsis;transition:all .2s ease-in-out;white-space:nowrap}.kong-ui-sandbox-navigation .sandbox-link a[data-v-2cb154ed]:hover{background:#ccc;color:#002099}.kong-ui-sandbox-navigation .sandbox-link a.router-link-exact-active[data-v-2cb154ed],.kong-ui-sandbox-navigation .sandbox-link a.active[data-v-2cb154ed],.kong-ui-sandbox-navigation .sandbox-link a.router-link-exact-active[data-v-2cb154ed]:hover,.kong-ui-sandbox-navigation .sandbox-link a.active[data-v-2cb154ed]:hover{background:#0044f4;color:#fff}html,body{margin:0;padding:0}.kong-ui-sandbox-layout .header[data-v-
|
|
1
|
+
.kong-ui-sandbox-navigation[data-v-2cb154ed]{list-style:none;margin:0;padding:0}.kong-ui-sandbox-navigation .sandbox-link[data-v-2cb154ed]{margin-bottom:8px}.kong-ui-sandbox-navigation .sandbox-link[data-v-2cb154ed]:last-of-type{margin-bottom:0}.kong-ui-sandbox-navigation .sandbox-link a[data-v-2cb154ed]{background:#eee;border-radius:4px;color:#0044f4;display:block;font-weight:600;overflow:hidden;padding:8px 16px;text-decoration:none;text-overflow:ellipsis;transition:all .2s ease-in-out;white-space:nowrap}.kong-ui-sandbox-navigation .sandbox-link a[data-v-2cb154ed]:hover{background:#ccc;color:#002099}.kong-ui-sandbox-navigation .sandbox-link a.router-link-exact-active[data-v-2cb154ed],.kong-ui-sandbox-navigation .sandbox-link a.active[data-v-2cb154ed],.kong-ui-sandbox-navigation .sandbox-link a.router-link-exact-active[data-v-2cb154ed]:hover,.kong-ui-sandbox-navigation .sandbox-link a.active[data-v-2cb154ed]:hover{background:#0044f4;color:#fff}html,body{margin:0;padding:0}.kong-ui-sandbox-layout .header[data-v-62a393b2]{align-items:center;border-bottom:1px solid #e0e4ea;display:flex;justify-content:space-between;width:100%}@media (min-width: 1280px){.kong-ui-sandbox-layout .header[data-v-62a393b2]{display:none}}.kong-ui-sandbox-layout .header .header-left[data-v-62a393b2],.kong-ui-sandbox-layout .header .header-right[data-v-62a393b2]{align-items:center;display:flex;gap:20px;padding:20px;width:100%}.kong-ui-sandbox-layout .header .header-right[data-v-62a393b2]{justify-content:flex-end}.kong-ui-sandbox-layout .header h1[data-v-62a393b2]{font-size:18px;margin:0;white-space:nowrap}@media (min-width: 768px){.kong-ui-sandbox-layout .header h1[data-v-62a393b2]{font-size:24px}}.kong-ui-sandbox-layout .layout[data-v-62a393b2]{display:flex;gap:20px;padding:20px}.kong-ui-sandbox-layout .mobile-nav-container[data-v-62a393b2]{align-items:center;display:flex;gap:20px}@media (min-width: 1280px){.kong-ui-sandbox-layout .mobile-nav-container[data-v-62a393b2],.kong-ui-sandbox-layout .mobile-controls-container[data-v-62a393b2],.kong-ui-sandbox-layout .mobile-title[data-v-62a393b2]{display:none}}.kong-ui-sandbox-layout .sandbox-controls[data-v-62a393b2],.kong-ui-sandbox-layout .desktop-nav-container[data-v-62a393b2]{display:none}@media (min-width: 1280px){.kong-ui-sandbox-layout .sandbox-controls[data-v-62a393b2],.kong-ui-sandbox-layout .desktop-nav-container[data-v-62a393b2]{display:block}}.kong-ui-sandbox-layout .desktop-nav-container[data-v-62a393b2]{min-width:240px}.kong-ui-sandbox-layout .sandbox-container[data-v-62a393b2]{min-height:50vh;width:100%}@media (min-width: 1280px){.kong-ui-sandbox-layout .sandbox-container[data-v-62a393b2]{border:1px solid #e0e4ea;border-radius:6px;padding:20px}}.kong-ui-sandbox-layout .sandbox-container h1[data-v-62a393b2]{margin:0 0 20px}.kong-ui-sandbox-layout .sandbox-controls[data-v-62a393b2]{min-width:var(--4f585fbc)}@media (min-width: 1280px){.kong-ui-sandbox-layout .sandbox-controls[data-v-62a393b2]{border:1px solid #e0e4ea;border-radius:6px;padding:20px}}.kong-ui-sandbox-layout .home-link[data-v-62a393b2],.kong-ui-sandbox-layout .home-link[data-v-62a393b2]:visited{color:#0044f4;text-decoration:none}.kong-ui-sandbox-layout .toggle-mobile-nav[data-v-62a393b2],.kong-ui-sandbox-layout .toggle-mobile-controls[data-v-62a393b2]{color:#0044f4;cursor:pointer;transition:color .2s ease-in-out}.kong-ui-sandbox-layout .toggle-mobile-nav[data-v-62a393b2]:hover,.kong-ui-sandbox-layout .toggle-mobile-controls[data-v-62a393b2]:hover{color:#0030cc}.kong-ui-sandbox-layout[data-v-62a393b2] .k-slideout,.kong-ui-sandbox-layout[data-v-62a393b2] .k-card-body{font-size:16px}
|
|
@@ -1,15 +1,13 @@
|
|
|
1
1
|
import type { PropType } from 'vue';
|
|
2
2
|
import type { SandboxNavigationItem } from '../types';
|
|
3
|
-
declare
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
attrs: Partial<{}>;
|
|
3
|
+
declare var __VLS_55: {}, __VLS_61: {}, __VLS_63: {};
|
|
4
|
+
type __VLS_Slots = {} & {
|
|
5
|
+
controls?: (props: typeof __VLS_55) => any;
|
|
6
|
+
} & {
|
|
7
|
+
default?: (props: typeof __VLS_61) => any;
|
|
8
|
+
} & {
|
|
9
|
+
controls?: (props: typeof __VLS_63) => any;
|
|
11
10
|
};
|
|
12
|
-
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
13
11
|
declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
14
12
|
title: {
|
|
15
13
|
type: StringConstructor;
|
|
@@ -24,7 +22,7 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
|
|
|
24
22
|
type: NumberConstructor;
|
|
25
23
|
default: number;
|
|
26
24
|
};
|
|
27
|
-
}>,
|
|
25
|
+
}>, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
28
26
|
title: {
|
|
29
27
|
type: StringConstructor;
|
|
30
28
|
default: string;
|
|
@@ -43,9 +41,9 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
|
|
|
43
41
|
links: SandboxNavigationItem[];
|
|
44
42
|
controlsMinWidth: number;
|
|
45
43
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
46
|
-
declare const _default:
|
|
44
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
47
45
|
export default _default;
|
|
48
|
-
type
|
|
46
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
49
47
|
new (): {
|
|
50
48
|
$slots: S;
|
|
51
49
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SandboxLayout.vue.d.ts","sourceRoot":"","sources":["../../../src/components/SandboxLayout.vue"],"names":[],"mappings":"AAiPA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAA;AACnC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAA;
|
|
1
|
+
{"version":3,"file":"SandboxLayout.vue.d.ts","sourceRoot":"","sources":["../../../src/components/SandboxLayout.vue"],"names":[],"mappings":"AAiPA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAA;AACnC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAA;AA+SrD,QAAA,IAAI,QAAQ,IAAW,EAAE,QAAQ,IAAW,EAAE,QAAQ,IAAY,CAAE;AACpE,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC9C;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC7C;IAAE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAqCjD,QAAA,MAAM,eAAe;;;;;;cASF,QAAQ,CAAC,qBAAqB,EAAE,CAAC;;;;;;;;;;;;;;cAAjC,QAAQ,CAAC,qBAAqB,EAAE,CAAC;;;;;;;;;;;;4EASlD,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAE1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
declare const _default: import("vue").DefineComponent<{},
|
|
1
|
+
declare const _default: import("vue").DefineComponent<{}, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
2
2
|
"router-link-click": (link: string | import("vue-router").RouteLocationAsRelativeGeneric | import("vue-router").RouteLocationAsPathGeneric) => any;
|
|
3
3
|
}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{
|
|
4
4
|
"onRouter-link-click"?: ((link: string | import("vue-router").RouteLocationAsRelativeGeneric | import("vue-router").RouteLocationAsPathGeneric) => any) | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SandboxNavigation.vue.d.ts","sourceRoot":"","sources":["../../../src/components/SandboxNavigation.vue"],"names":[],"mappings":";;;;;
|
|
1
|
+
{"version":3,"file":"SandboxNavigation.vue.d.ts","sourceRoot":"","sources":["../../../src/components/SandboxNavigation.vue"],"names":[],"mappings":";;;;;AAuLA,wBAIG"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kong-ui-public/sandbox-layout",
|
|
3
|
-
"version": "2.1
|
|
3
|
+
"version": "2.2.1",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./dist/sandbox-layout.umd.js",
|
|
6
6
|
"module": "./dist/sandbox-layout.es.js",
|
|
@@ -21,8 +21,8 @@
|
|
|
21
21
|
"access": "public"
|
|
22
22
|
},
|
|
23
23
|
"devDependencies": {
|
|
24
|
-
"@kong/design-tokens": "1.
|
|
25
|
-
"@kong/kongponents": "9.
|
|
24
|
+
"@kong/design-tokens": "^1.18.0",
|
|
25
|
+
"@kong/kongponents": "^9.37.2",
|
|
26
26
|
"vue": "^3.5.13",
|
|
27
27
|
"vue-router": "^4.4.5"
|
|
28
28
|
},
|
|
@@ -44,7 +44,7 @@
|
|
|
44
44
|
"errorLimit": "200KB"
|
|
45
45
|
},
|
|
46
46
|
"peerDependencies": {
|
|
47
|
-
"vue": "
|
|
47
|
+
"vue": "^3.5.13"
|
|
48
48
|
},
|
|
49
49
|
"dependencies": {
|
|
50
50
|
"@kong/icons": "^1.33.2"
|