lkt-tabs 1.0.8 → 1.1.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.
Files changed (8) hide show
  1. package/dist/lkt-tabs.es.js +83 -87
  2. package/dist/lkt-tabs.umd.js +1 -1
  3. package/dist/src/components/LktTab.vue.d.ts +94 -128
  4. package/dist/src/lib-components/LktTabs.vue.d.ts +56 -142
  5. package/dist/vite.config.d.ts +9 -9
  6. package/package.json +17 -14
  7. package/src/lib-components/LktTabs.vue +28 -22
  8. /package/dist/{style.css → lkt-tabs.css} +0 -0
package/dist/lkt-tabs.es.js CHANGED
@@ -1,16 +1,16 @@
1
- import { defineComponent as B, ref as g, computed as c, watch as $, openBlock as r, createElementBlock as i, unref as u, renderSlot as p, createCommentVNode as P, getCurrentInstance as q, nextTick as x, normalizeClass as L, withDirectives as F, createElementVNode as V, Fragment as b, renderList as _, withModifiers as H, vShow as O, normalizeStyle as z, createBlock as D, withCtx as E } from "vue";
1
+ import { defineComponent as H, ref as $, computed as c, watch as k, createElementBlock as u, createCommentVNode as A, openBlock as i, renderSlot as v, getCurrentInstance as P, useSlots as j, nextTick as q, normalizeClass as C, withDirectives as y, createElementVNode as L, Fragment as S, renderList as g, withModifiers as V, vShow as F, normalizeStyle as z, createBlock as D, withCtx as E } from "vue";
2
2
  import { getSessionStorage as K, setSessionStorage as N } from "lkt-session";
3
3
  function U(a = 10) {
4
- let l = "";
5
- const t = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789", s = t.length;
6
- for (let n = 0; n < a; n++)
7
- l += t.charAt(Math.floor(Math.random() * s));
8
- return l;
4
+ let r = "";
5
+ const t = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789", d = t.length;
6
+ for (let s = 0; s < a; s++)
7
+ r += t.charAt(Math.floor(Math.random() * d));
8
+ return r;
9
9
  }
10
10
  function Y(a) {
11
11
  return typeof a == "string";
12
12
  }
13
- const G = ["id"], J = /* @__PURE__ */ B({
13
+ const G = ["id"], J = /* @__PURE__ */ H({
14
14
  __name: "LktTab",
15
15
  props: {
16
16
  id: { type: String, default: "" },
@@ -20,35 +20,22 @@ const G = ["id"], J = /* @__PURE__ */ B({
20
20
  isDisabled: { type: Boolean, default: !1 }
21
21
  },
22
22
  emits: ["is-active"],
23
- setup(a, { emit: l }) {
24
- const t = a, s = g(!1), n = g(U(8)), m = c(() => t.id ? t.id : Y(t.name) && t.name.length > 0 ? t.name.toLowerCase().replace(/ /g, "-") : n.value), h = () => {
25
- s.value = t.activeHash === t.hash, l("is-active", s.value);
23
+ setup(a, { emit: r }) {
24
+ const t = a, d = r, s = $(!1), p = $(U(8)), o = c(() => t.id ? t.id : Y(t.name) && t.name.length > 0 ? t.name.toLowerCase().replace(/ /g, "-") : p.value), h = () => {
25
+ s.value = t.activeHash === t.hash, d("is-active", s.value);
26
26
  };
27
- return $(() => t.activeHash, h), h(), (d, T) => s.value ? (r(), i("section", {
27
+ return k(() => t.activeHash, h), h(), (m, f) => s.value ? (i(), u("section", {
28
28
  key: 0,
29
29
  "data-lkt": "tab-content",
30
- id: u(m),
30
+ id: o.value,
31
31
  role: "tabpanel"
32
32
  }, [
33
- p(d.$slots, "default")
34
- ], 8, G)) : P("", !0);
33
+ v(m.$slots, "default")
34
+ ], 8, G)) : A("", !0);
35
35
  }
36
- });
37
- function S(a, l) {
38
- const t = {};
39
- let s = {};
40
- if (a && (s = Object.assign(s, a)), l) {
41
- for (const n in s)
42
- n.indexOf(l) === 0 && (t[n.replace(l, "")] = s[n]);
43
- return t;
44
- }
45
- for (const n in s)
46
- t[n] = s[n];
47
- return t;
48
- }
49
- const I = (a) => `lkt-tabs.${window.location.host}${window.location.pathname}.${a}`, Q = (a) => K(I(a)), R = (a, l, t) => {
50
- N(I(a), l, t * 60);
51
- }, W = { class: "lkt-tabs__list" }, X = ["href", "onClick"], Z = ["innerHTML", "onClick", "href"], tt = { "data-lkt": "tab" }, et = /* @__PURE__ */ B({
36
+ }), B = (a) => `lkt-tabs.${window.location.host}${window.location.pathname}.${a}`, Q = (a) => K(B(a)), R = (a, r, t) => {
37
+ N(B(a), r, t * 60);
38
+ }, W = { class: "lkt-tabs__list" }, X = ["href", "onClick"], Z = ["innerHTML", "onClick", "href"], ee = { "data-lkt": "tab" }, te = /* @__PURE__ */ H({
52
39
  __name: "LktTabs",
53
40
  props: {
54
41
  modelValue: { default: "" },
@@ -56,97 +43,106 @@ const I = (a) => `lkt-tabs.${window.location.host}${window.location.pathname}.${
56
43
  useSession: { type: Boolean, default: !1 },
57
44
  cacheLifetime: { default: 5 },
58
45
  contentPad: { default: "" },
59
- palette: { default: "" },
60
46
  titles: { default: () => ({}) }
61
47
  },
62
- emits: ["update:modelValue"],
63
- setup(a, { emit: l }) {
64
- const t = a, { ctx: s } = q(), n = g("");
65
- if (t.useSession) {
66
- t.id || console.warn("[LKT Tabs] You're trying to use session provided tabs without the required id. Please, add id attr");
67
- let e = Q(t.id);
68
- e && (n.value = e);
48
+ emits: [
49
+ "update:modelValue"
50
+ ],
51
+ setup(a, { emit: r }) {
52
+ const { ctx: t } = P(), d = j(), s = a, p = r, o = $("");
53
+ if (s.useSession) {
54
+ s.id || console.warn("[LKT Tabs] You're trying to use session provided tabs without the required id. Please, add id attr");
55
+ let e = Q(s.id);
56
+ e && (o.value = e);
69
57
  }
70
- $(() => t.modelValue, (e, f) => {
71
- typeof e == "string" && (n.value = e);
72
- }), $(n, (e, f) => {
73
- l("update:modelValue"), x(() => {
74
- s.$forceUpdate();
75
- }), t.useSession && R(s.id, e, t.cacheLifetime);
58
+ k(() => s.modelValue, (e, l) => {
59
+ typeof e == "string" && (o.value = e);
60
+ }), k(o, (e, l) => {
61
+ p("update:modelValue"), q(() => {
62
+ t.$forceUpdate();
63
+ }), s.useSession && R(t.id, e, s.cacheLifetime);
76
64
  });
77
- const m = c(() => {
65
+ const h = c(() => [].join(" ")), m = c(() => {
78
66
  let e = [];
79
- return t.palette && e.push(`lkt-tabs--${t.palette}`), e.join(" ");
80
- }), h = c(() => {
67
+ return s.contentPad && e.push(`padding: ${s.contentPad}`), e.join(";");
68
+ }), f = c(() => {
69
+ let e = [];
70
+ for (let l in d) l.indexOf("tab-") !== -1 && e.push(l);
71
+ return e;
72
+ }), x = c(() => {
81
73
  let e = [];
82
- return t.contentPad && e.push(`padding: ${t.contentPad}`), e.join(";");
83
- }), d = c(() => S(s.$slots, "tab-")), T = c(() => S(s.$slots, "title-")), M = c(() => S(s.$slots, "li-")), v = c(() => {
74
+ for (let l in d) l.indexOf("title-") !== -1 && e.push(l);
75
+ return e;
76
+ }), I = c(() => {
77
+ let e = [];
78
+ for (let l in d) l.indexOf("li-") !== -1 && e.push(l);
79
+ return e;
80
+ }), b = c(() => {
84
81
  let e = {};
85
- for (let f in s.$refs)
86
- e[f] = s.$refs[f].hash;
82
+ for (let l in t.$refs)
83
+ e[l] = t.$refs[l].hash;
87
84
  return e;
88
- }), j = c(() => Object.keys(d.value).length > 1), k = (e = "") => v.value.length > 0 && v.value[e] ? "#" + v.value[e] : "#", w = (e = "") => t.titles && t.titles[e] ? t.titles[e] : e, y = () => {
89
- s.$forceUpdate();
85
+ }), M = c(() => Object.keys(f.value).length > 1), T = (e = "") => b.value.length > 0 && b.value[e] ? "#" + b.value[e] : "#", w = (e = "") => s.titles && s.titles[e] ? s.titles[e] : e, O = () => {
86
+ t.$forceUpdate();
90
87
  };
91
- for (let e in d.value)
92
- n.value === "" && (n.value = e);
93
- return (e, f) => (r(), i("div", {
94
- class: L(["lkt-tabs", u(m)])
88
+ for (let e in f.value)
89
+ o.value === "" && (o.value = e);
90
+ return (e, l) => (i(), u("div", {
91
+ class: C(["lkt-tabs", h.value])
95
92
  }, [
96
- F(V("ul", W, [
97
- (r(!0), i(b, null, _(u(d), (C, o) => (r(), i("li", {
98
- key: o,
99
- class: L(["lkt-tab", { "is-active": o === n.value }]),
93
+ y(L("ul", W, [
94
+ (i(!0), u(S, null, g(f.value, (n) => (i(), u("li", {
95
+ key: n,
96
+ class: C(["lkt-tab", { "is-active": n === o.value }]),
100
97
  role: "presentation"
101
98
  }, [
102
- u(T)[o] ? (r(), i("a", {
99
+ x.value.includes(n) ? (i(), u("a", {
103
100
  key: 0,
104
- href: k(o),
105
- onClick: H((A) => n.value = o, ["prevent"]),
101
+ href: T(n),
102
+ onClick: V((_) => o.value = n, ["prevent"]),
106
103
  role: "tab"
107
104
  }, [
108
- p(e.$slots, "title-" + o)
109
- ], 8, X)) : (r(), i("a", {
105
+ v(e.$slots, "title-" + n)
106
+ ], 8, X)) : (i(), u("a", {
110
107
  key: 1,
111
- innerHTML: w(o),
112
- onClick: H((A) => n.value = o, ["prevent"]),
113
- href: k(o),
108
+ innerHTML: w(n),
109
+ onClick: V((_) => o.value = n, ["prevent"]),
110
+ href: T(n),
114
111
  role: "tab"
115
112
  }, null, 8, Z))
116
113
  ], 2))), 128)),
117
- (r(!0), i(b, null, _(u(M), (C, o) => (r(), i("li", tt, [
118
- p(e.$slots, "li-" + o)
114
+ (i(!0), u(S, null, g(I.value, (n, _) => (i(), u("li", ee, [
115
+ v(e.$slots, "li-" + _)
119
116
  ]))), 256))
120
117
  ], 512), [
121
- [O, u(j)]
118
+ [F, M.value]
122
119
  ]),
123
- V("div", {
120
+ L("div", {
124
121
  class: "lkt-tabs__content",
125
- style: z(u(h))
122
+ style: z(m.value)
126
123
  }, [
127
- (r(!0), i(b, null, _(u(d), (C, o) => (r(), D(J, {
124
+ (i(!0), u(S, null, g(f.value, (n) => (i(), D(J, {
128
125
  ref_for: !0,
129
- ref: o,
130
- hash: o,
131
- id: o,
132
- name: w(o),
133
- "active-hash": n.value,
134
- onIsActive: y
126
+ ref: n,
127
+ hash: n,
128
+ id: n,
129
+ name: w(n),
130
+ "active-hash": o.value,
131
+ onIsActive: O
135
132
  }, {
136
133
  default: E(() => [
137
- p(e.$slots, "tab-" + o)
134
+ v(e.$slots, "tab-" + n)
138
135
  ]),
139
136
  _: 2
140
137
  }, 1032, ["hash", "id", "name", "active-hash"]))), 256))
141
138
  ], 4)
142
139
  ], 2));
143
140
  }
144
- });
145
- const at = {
146
- install: (a, l) => {
147
- a.component("lkt-tabs", et);
141
+ }), ae = {
142
+ install: (a, r) => {
143
+ a.component("lkt-tabs", te);
148
144
  }
149
145
  };
150
146
  export {
151
- at as default
147
+ ae as default
152
148
  };
package/dist/lkt-tabs.umd.js CHANGED
@@ -1 +1 @@
1
- (function(t,i){typeof exports=="object"&&typeof module<"u"?module.exports=i(require("vue"),require("lkt-session")):typeof define=="function"&&define.amd?define(["vue","lkt-session"],i):(t=typeof globalThis<"u"?globalThis:t||self,t.LktTabs=i(t.Vue,t.LktSession))})(this,function(t,i){"use strict";function B(l=10){let a="";const e="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",o=e.length;for(let s=0;s<l;s++)a+=e.charAt(Math.floor(Math.random()*o));return a}function g(l){return typeof l=="string"}const $=["id"],T=t.defineComponent({__name:"LktTab",props:{id:{type:String,default:""},name:{type:String,required:!0},hash:{type:String,default:""},activeHash:{type:String,default:""},isDisabled:{type:Boolean,default:!1}},emits:["is-active"],setup(l,{emit:a}){const e=l,o=t.ref(!1),s=t.ref(B(8)),u=t.computed(()=>e.id?e.id:g(e.name)&&e.name.length>0?e.name.toLowerCase().replace(/ /g,"-"):s.value),f=()=>{o.value=e.activeHash===e.hash,a("is-active",o.value)};return t.watch(()=>e.activeHash,f),f(),(c,k)=>o.value?(t.openBlock(),t.createElementBlock("section",{key:0,"data-lkt":"tab-content",id:t.unref(u),role:"tabpanel"},[t.renderSlot(c.$slots,"default")],8,$)):t.createCommentVNode("",!0)}});function p(l,a){const e={};let o={};if(l&&(o=Object.assign(o,l)),a){for(const s in o)s.indexOf(a)===0&&(e[s.replace(a,"")]=o[s]);return e}for(const s in o)e[s]=o[s];return e}const m=l=>`lkt-tabs.${window.location.host}${window.location.pathname}.${l}`,L=l=>i.getSessionStorage(m(l)),w=(l,a,e)=>{i.setSessionStorage(m(l),a,e*60)},C={class:"lkt-tabs__list"},E=["href","onClick"],V=["innerHTML","onClick","href"],H={"data-lkt":"tab"},y=t.defineComponent({__name:"LktTabs",props:{modelValue:{default:""},id:{default:""},useSession:{type:Boolean,default:!1},cacheLifetime:{default:5},contentPad:{default:""},palette:{default:""},titles:{default:()=>({})}},emits:["update:modelValue"],setup(l,{emit:a}){const e=l,{ctx:o}=t.getCurrentInstance(),s=t.ref("");if(e.useSession){e.id||console.warn("[LKT Tabs] You're trying to use session provided tabs without the required id. Please, add id attr");let n=L(e.id);n&&(s.value=n)}t.watch(()=>e.modelValue,(n,d)=>{typeof n=="string"&&(s.value=n)}),t.watch(s,(n,d)=>{a("update:modelValue"),t.nextTick(()=>{o.$forceUpdate()}),e.useSession&&w(o.id,n,e.cacheLifetime)});const u=t.computed(()=>{let n=[];return e.palette&&n.push(`lkt-tabs--${e.palette}`),n.join(" ")}),f=t.computed(()=>{let n=[];return e.contentPad&&n.push(`padding: ${e.contentPad}`),n.join(";")}),c=t.computed(()=>p(o.$slots,"tab-")),k=t.computed(()=>p(o.$slots,"title-")),M=t.computed(()=>p(o.$slots,"li-")),h=t.computed(()=>{let n={};for(let d in o.$refs)n[d]=o.$refs[d].hash;return n}),j=t.computed(()=>Object.keys(c.value).length>1),b=(n="")=>h.value.length>0&&h.value[n]?"#"+h.value[n]:"#",_=(n="")=>e.titles&&e.titles[n]?e.titles[n]:n,q=()=>{o.$forceUpdate()};for(let n in c.value)s.value===""&&(s.value=n);return(n,d)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["lkt-tabs",t.unref(u)])},[t.withDirectives(t.createElementVNode("ul",C,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(t.unref(c),(S,r)=>(t.openBlock(),t.createElementBlock("li",{key:r,class:t.normalizeClass(["lkt-tab",{"is-active":r===s.value}]),role:"presentation"},[t.unref(k)[r]?(t.openBlock(),t.createElementBlock("a",{key:0,href:b(r),onClick:t.withModifiers(F=>s.value=r,["prevent"]),role:"tab"},[t.renderSlot(n.$slots,"title-"+r)],8,E)):(t.openBlock(),t.createElementBlock("a",{key:1,innerHTML:_(r),onClick:t.withModifiers(F=>s.value=r,["prevent"]),href:b(r),role:"tab"},null,8,V))],2))),128)),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(t.unref(M),(S,r)=>(t.openBlock(),t.createElementBlock("li",H,[t.renderSlot(n.$slots,"li-"+r)]))),256))],512),[[t.vShow,t.unref(j)]]),t.createElementVNode("div",{class:"lkt-tabs__content",style:t.normalizeStyle(t.unref(f))},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(t.unref(c),(S,r)=>(t.openBlock(),t.createBlock(T,{ref_for:!0,ref:r,hash:r,id:r,name:_(r),"active-hash":s.value,onIsActive:q},{default:t.withCtx(()=>[t.renderSlot(n.$slots,"tab-"+r)]),_:2},1032,["hash","id","name","active-hash"]))),256))],4)],2))}}),I="";return{install:(l,a)=>{l.component("lkt-tabs",y)}}});
1
+ (function(e,d){typeof exports=="object"&&typeof module<"u"?module.exports=d(require("vue"),require("lkt-session")):typeof define=="function"&&define.amd?define(["vue","lkt-session"],d):(e=typeof globalThis<"u"?globalThis:e||self,e.LktTabs=d(e.Vue,e.LktSession))})(this,function(e,d){"use strict";function B(l=10){let i="";const n="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",c=n.length;for(let o=0;o<l;o++)i+=n.charAt(Math.floor(Math.random()*c));return i}function g(l){return typeof l=="string"}const T=["id"],L=e.defineComponent({__name:"LktTab",props:{id:{type:String,default:""},name:{type:String,required:!0},hash:{type:String,default:""},activeHash:{type:String,default:""},isDisabled:{type:Boolean,default:!1}},emits:["is-active"],setup(l,{emit:i}){const n=l,c=i,o=e.ref(!1),p=e.ref(B(8)),r=e.computed(()=>n.id?n.id:g(n.name)&&n.name.length>0?n.name.toLowerCase().replace(/ /g,"-"):p.value),u=()=>{o.value=n.activeHash===n.hash,c("is-active",o.value)};return e.watch(()=>n.activeHash,u),u(),(m,f)=>o.value?(e.openBlock(),e.createElementBlock("section",{key:0,"data-lkt":"tab-content",id:r.value,role:"tabpanel"},[e.renderSlot(m.$slots,"default")],8,T)):e.createCommentVNode("",!0)}}),b=l=>`lkt-tabs.${window.location.host}${window.location.pathname}.${l}`,$=l=>d.getSessionStorage(b(l)),w=(l,i,n)=>{d.setSessionStorage(b(l),i,n*60)},C={class:"lkt-tabs__list"},E=["href","onClick"],V=["innerHTML","onClick","href"],H={"data-lkt":"tab"},x=e.defineComponent({__name:"LktTabs",props:{modelValue:{default:""},id:{default:""},useSession:{type:Boolean,default:!1},cacheLifetime:{default:5},contentPad:{default:""},titles:{default:()=>({})}},emits:["update:modelValue"],setup(l,{emit:i}){const{ctx:n}=e.getCurrentInstance(),c=e.useSlots(),o=l,p=i,r=e.ref("");if(o.useSession){o.id||console.warn("[LKT Tabs] You're trying to use session provided tabs without the required id. Please, add id attr");let t=$(o.id);t&&(r.value=t)}e.watch(()=>o.modelValue,(t,a)=>{typeof t=="string"&&(r.value=t)}),e.watch(r,(t,a)=>{p("update:modelValue"),e.nextTick(()=>{n.$forceUpdate()}),o.useSession&&w(n.id,t,o.cacheLifetime)});const u=e.computed(()=>[].join(" ")),m=e.computed(()=>{let t=[];return o.contentPad&&t.push(`padding: ${o.contentPad}`),t.join(";")}),f=e.computed(()=>{let t=[];for(let a in c)a.indexOf("tab-")!==-1&&t.push(a);return t}),M=e.computed(()=>{let t=[];for(let a in c)a.indexOf("title-")!==-1&&t.push(a);return t}),q=e.computed(()=>{let t=[];for(let a in c)a.indexOf("li-")!==-1&&t.push(a);return t}),h=e.computed(()=>{let t={};for(let a in n.$refs)t[a]=n.$refs[a].hash;return t}),y=e.computed(()=>Object.keys(f.value).length>1),S=(t="")=>h.value.length>0&&h.value[t]?"#"+h.value[t]:"#",_=(t="")=>o.titles&&o.titles[t]?o.titles[t]:t,F=()=>{n.$forceUpdate()};for(let t in f.value)r.value===""&&(r.value=t);return(t,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["lkt-tabs",u.value])},[e.withDirectives(e.createElementVNode("ul",C,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(f.value,s=>(e.openBlock(),e.createElementBlock("li",{key:s,class:e.normalizeClass(["lkt-tab",{"is-active":s===r.value}]),role:"presentation"},[M.value.includes(s)?(e.openBlock(),e.createElementBlock("a",{key:0,href:S(s),onClick:e.withModifiers(k=>r.value=s,["prevent"]),role:"tab"},[e.renderSlot(t.$slots,"title-"+s)],8,E)):(e.openBlock(),e.createElementBlock("a",{key:1,innerHTML:_(s),onClick:e.withModifiers(k=>r.value=s,["prevent"]),href:S(s),role:"tab"},null,8,V))],2))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(q.value,(s,k)=>(e.openBlock(),e.createElementBlock("li",H,[e.renderSlot(t.$slots,"li-"+k)]))),256))],512),[[e.vShow,y.value]]),e.createElementVNode("div",{class:"lkt-tabs__content",style:e.normalizeStyle(m.value)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(f.value,s=>(e.openBlock(),e.createBlock(L,{ref_for:!0,ref:s,hash:s,id:s,name:_(s),"active-hash":r.value,onIsActive:F},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"tab-"+s)]),_:2},1032,["hash","id","name","active-hash"]))),256))],4)],2))}});return{install:(l,i)=>{l.component("lkt-tabs",x)}}});
package/dist/src/components/LktTab.vue.d.ts CHANGED
@@ -1,125 +1,11 @@
1
- declare const _default: {
2
- new (...args: any[]): {
3
- $: import("vue").ComponentInternalInstance;
4
- $data: {};
5
- $props: Partial<{
6
- id: string;
7
- hash: string;
8
- activeHash: string;
9
- isDisabled: boolean;
10
- }> & Omit<Readonly<import("vue").ExtractPropTypes<{
11
- id: {
12
- type: StringConstructor;
13
- default: string;
14
- };
15
- name: {
16
- type: StringConstructor;
17
- required: true;
18
- };
19
- hash: {
20
- type: StringConstructor;
21
- default: string;
22
- };
23
- activeHash: {
24
- type: StringConstructor;
25
- default: string;
26
- };
27
- isDisabled: {
28
- type: BooleanConstructor;
29
- default: boolean;
30
- };
31
- }>> & {
32
- "onIs-active"?: ((...args: any[]) => any) | undefined;
33
- } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "id" | "hash" | "activeHash" | "isDisabled">;
34
- $attrs: {
35
- [x: string]: unknown;
36
- };
37
- $refs: {
38
- [x: string]: unknown;
39
- };
40
- $slots: Readonly<{
41
- [name: string]: import("vue").Slot | undefined;
42
- }>;
43
- $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
44
- $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
45
- $emit: (event: "is-active", ...args: any[]) => void;
46
- $el: any;
47
- $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
48
- id: {
49
- type: StringConstructor;
50
- default: string;
51
- };
52
- name: {
53
- type: StringConstructor;
54
- required: true;
55
- };
56
- hash: {
57
- type: StringConstructor;
58
- default: string;
59
- };
60
- activeHash: {
61
- type: StringConstructor;
62
- default: string;
63
- };
64
- isDisabled: {
65
- type: BooleanConstructor;
66
- default: boolean;
67
- };
68
- }>> & {
69
- "onIs-active"?: ((...args: any[]) => any) | undefined;
70
- }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "is-active"[], string, {
71
- id: string;
72
- hash: string;
73
- activeHash: string;
74
- isDisabled: boolean;
75
- }> & {
76
- beforeCreate?: ((() => void) | (() => void)[]) | undefined;
77
- created?: ((() => void) | (() => void)[]) | undefined;
78
- beforeMount?: ((() => void) | (() => void)[]) | undefined;
79
- mounted?: ((() => void) | (() => void)[]) | undefined;
80
- beforeUpdate?: ((() => void) | (() => void)[]) | undefined;
81
- updated?: ((() => void) | (() => void)[]) | undefined;
82
- activated?: ((() => void) | (() => void)[]) | undefined;
83
- deactivated?: ((() => void) | (() => void)[]) | undefined;
84
- beforeDestroy?: ((() => void) | (() => void)[]) | undefined;
85
- beforeUnmount?: ((() => void) | (() => void)[]) | undefined;
86
- destroyed?: ((() => void) | (() => void)[]) | undefined;
87
- unmounted?: ((() => void) | (() => void)[]) | undefined;
88
- renderTracked?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
89
- renderTriggered?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
90
- errorCaptured?: (((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void)[]) | undefined;
91
- };
92
- $forceUpdate: () => void;
93
- $nextTick: typeof import("vue").nextTick;
94
- $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
95
- } & Readonly<import("vue").ExtractPropTypes<{
96
- id: {
97
- type: StringConstructor;
98
- default: string;
99
- };
100
- name: {
101
- type: StringConstructor;
102
- required: true;
103
- };
104
- hash: {
105
- type: StringConstructor;
106
- default: string;
107
- };
108
- activeHash: {
109
- type: StringConstructor;
110
- default: string;
111
- };
112
- isDisabled: {
113
- type: BooleanConstructor;
114
- default: boolean;
115
- };
116
- }>> & {
117
- "onIs-active"?: ((...args: any[]) => any) | undefined;
118
- } & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties;
119
- __isFragment?: undefined;
120
- __isTeleport?: undefined;
121
- __isSuspense?: undefined;
122
- } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
1
+ declare const isActive: import("vue").Ref<boolean, boolean>;
2
+ declare const computedId: import("vue").ComputedRef<string>;
3
+ declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
4
+ declare var __VLS_1: {};
5
+ type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
6
+ default?: (props: typeof __VLS_1) => any;
7
+ }>;
8
+ declare const __VLS_self: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
123
9
  id: {
124
10
  type: StringConstructor;
125
11
  default: string;
@@ -140,16 +26,96 @@ declare const _default: {
140
26
  type: BooleanConstructor;
141
27
  default: boolean;
142
28
  };
143
- }>> & {
29
+ }>, {
30
+ isActive: typeof isActive;
31
+ computedId: typeof computedId;
32
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
33
+ "is-active": (...args: any[]) => void;
34
+ }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
35
+ id: {
36
+ type: StringConstructor;
37
+ default: string;
38
+ };
39
+ name: {
40
+ type: StringConstructor;
41
+ required: true;
42
+ };
43
+ hash: {
44
+ type: StringConstructor;
45
+ default: string;
46
+ };
47
+ activeHash: {
48
+ type: StringConstructor;
49
+ default: string;
50
+ };
51
+ isDisabled: {
52
+ type: BooleanConstructor;
53
+ default: boolean;
54
+ };
55
+ }>> & Readonly<{
144
56
  "onIs-active"?: ((...args: any[]) => any) | undefined;
145
- }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "is-active"[], "is-active", {
57
+ }>, {
146
58
  id: string;
147
59
  hash: string;
148
60
  activeHash: string;
149
61
  isDisabled: boolean;
150
- }> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
151
- $slots: {
152
- default: (_: {}) => any;
62
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
63
+ declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
64
+ id: {
65
+ type: StringConstructor;
66
+ default: string;
67
+ };
68
+ name: {
69
+ type: StringConstructor;
70
+ required: true;
71
+ };
72
+ hash: {
73
+ type: StringConstructor;
74
+ default: string;
153
75
  };
154
- });
76
+ activeHash: {
77
+ type: StringConstructor;
78
+ default: string;
79
+ };
80
+ isDisabled: {
81
+ type: BooleanConstructor;
82
+ default: boolean;
83
+ };
84
+ }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
85
+ "is-active": (...args: any[]) => void;
86
+ }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
87
+ id: {
88
+ type: StringConstructor;
89
+ default: string;
90
+ };
91
+ name: {
92
+ type: StringConstructor;
93
+ required: true;
94
+ };
95
+ hash: {
96
+ type: StringConstructor;
97
+ default: string;
98
+ };
99
+ activeHash: {
100
+ type: StringConstructor;
101
+ default: string;
102
+ };
103
+ isDisabled: {
104
+ type: BooleanConstructor;
105
+ default: boolean;
106
+ };
107
+ }>> & Readonly<{
108
+ "onIs-active"?: ((...args: any[]) => any) | undefined;
109
+ }>, {
110
+ id: string;
111
+ hash: string;
112
+ activeHash: string;
113
+ isDisabled: boolean;
114
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
115
+ declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
155
116
  export default _default;
117
+ type __VLS_WithSlots<T, S> = T & {
118
+ new (): {
119
+ $slots: S;
120
+ };
121
+ };
package/dist/src/lib-components/LktTabs.vue.d.ts CHANGED
@@ -1,158 +1,72 @@
1
- import { nextTick } from 'vue';
2
- import { LktObject } from "lkt-ts-interfaces";
3
- declare const _default: {
4
- new (...args: any[]): {
5
- $: import("vue").ComponentInternalInstance;
6
- $data: {};
7
- $props: Partial<{
8
- id: string;
9
- modelValue: string | number;
10
- useSession: boolean;
11
- cacheLifetime: number;
12
- contentPad: string;
13
- palette: string;
14
- titles: LktObject;
15
- }> & Omit<Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
16
- modelValue: string | number;
17
- id?: string | undefined;
18
- useSession?: boolean | undefined;
19
- cacheLifetime?: number | undefined;
20
- contentPad?: string | undefined;
21
- palette?: string | undefined;
22
- titles?: LktObject | undefined;
23
- }>, {
24
- modelValue: string;
25
- id: string;
26
- useSession: boolean;
27
- cacheLifetime: number;
28
- contentPad: string;
29
- palette: string;
30
- titles: () => {};
31
- }>>> & {
32
- "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
33
- } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "id" | "modelValue" | "useSession" | "cacheLifetime" | "contentPad" | "palette" | "titles">;
34
- $attrs: {
35
- [x: string]: unknown;
36
- };
37
- $refs: {
38
- [x: string]: unknown;
39
- };
40
- $slots: Readonly<{
41
- [name: string]: import("vue").Slot | undefined;
42
- }>;
43
- $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
44
- $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null;
45
- $emit: (event: "update:modelValue", ...args: any[]) => void;
46
- $el: any;
47
- $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
48
- modelValue: string | number;
49
- id?: string | undefined;
50
- useSession?: boolean | undefined;
51
- cacheLifetime?: number | undefined;
52
- contentPad?: string | undefined;
53
- palette?: string | undefined;
54
- titles?: LktObject | undefined;
55
- }>, {
56
- modelValue: string;
57
- id: string;
58
- useSession: boolean;
59
- cacheLifetime: number;
60
- contentPad: string;
61
- palette: string;
62
- titles: () => {};
63
- }>>> & {
64
- "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
65
- }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], string, {
66
- id: string;
67
- modelValue: string | number;
68
- useSession: boolean;
69
- cacheLifetime: number;
70
- contentPad: string;
71
- palette: string;
72
- titles: LktObject;
73
- }> & {
74
- beforeCreate?: ((() => void) | (() => void)[]) | undefined;
75
- created?: ((() => void) | (() => void)[]) | undefined;
76
- beforeMount?: ((() => void) | (() => void)[]) | undefined;
77
- mounted?: ((() => void) | (() => void)[]) | undefined;
78
- beforeUpdate?: ((() => void) | (() => void)[]) | undefined;
79
- updated?: ((() => void) | (() => void)[]) | undefined;
80
- activated?: ((() => void) | (() => void)[]) | undefined;
81
- deactivated?: ((() => void) | (() => void)[]) | undefined;
82
- beforeDestroy?: ((() => void) | (() => void)[]) | undefined;
83
- beforeUnmount?: ((() => void) | (() => void)[]) | undefined;
84
- destroyed?: ((() => void) | (() => void)[]) | undefined;
85
- unmounted?: ((() => void) | (() => void)[]) | undefined;
86
- renderTracked?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
87
- renderTriggered?: (((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[]) | undefined;
88
- errorCaptured?: (((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>> | null, info: string) => boolean | void)[]) | undefined;
89
- };
90
- $forceUpdate: () => void;
91
- $nextTick: typeof nextTick;
92
- $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
93
- } & Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
94
- modelValue: string | number;
95
- id?: string | undefined;
96
- useSession?: boolean | undefined;
97
- cacheLifetime?: number | undefined;
98
- contentPad?: string | undefined;
99
- palette?: string | undefined;
100
- titles?: LktObject | undefined;
101
- }>, {
102
- modelValue: string;
103
- id: string;
104
- useSession: boolean;
105
- cacheLifetime: number;
106
- contentPad: string;
107
- palette: string;
108
- titles: () => {};
109
- }>>> & {
110
- "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
111
- } & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties;
112
- __isFragment?: undefined;
113
- __isTeleport?: undefined;
114
- __isSuspense?: undefined;
115
- } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
1
+ import LktTab from "../components/LktTab.vue";
2
+ import { LktObject } from "lkt-vue-kernel";
3
+ type __VLS_Props = {
116
4
  modelValue: string | number;
117
- id?: string | undefined;
118
- useSession?: boolean | undefined;
119
- cacheLifetime?: number | undefined;
120
- contentPad?: string | undefined;
121
- palette?: string | undefined;
122
- titles?: LktObject | undefined;
5
+ id?: string;
6
+ useSession?: boolean;
7
+ cacheLifetime?: number;
8
+ contentPad?: string;
9
+ titles?: LktObject;
10
+ };
11
+ declare const Value: import("vue").Ref<string, string>;
12
+ declare const classes: import("vue").ComputedRef<string>;
13
+ declare const contentStyles: import("vue").ComputedRef<string>;
14
+ declare const tabsSlots: import("vue").ComputedRef<string[]>;
15
+ declare const titlesSlots: import("vue").ComputedRef<string[]>;
16
+ declare const liSlots: import("vue").ComputedRef<string[]>;
17
+ declare const displayButtons: import("vue").ComputedRef<boolean>;
18
+ declare const getTabHref: (key?: string | number) => string;
19
+ declare const getTabTitle: (key?: string | number) => any;
20
+ declare const refresh: () => void;
21
+ declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
22
+ declare var __VLS_2: string, __VLS_3: {}, __VLS_6: string, __VLS_7: {}, __VLS_17: string, __VLS_18: {};
23
+ type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
24
+ [K in NonNullable<typeof __VLS_2>]?: (props: typeof __VLS_3) => any;
25
+ } & {
26
+ [K in NonNullable<typeof __VLS_6>]?: (props: typeof __VLS_7) => any;
27
+ } & {
28
+ [K in NonNullable<typeof __VLS_17>]?: (props: typeof __VLS_18) => any;
29
+ }>;
30
+ declare const __VLS_self: import("vue").DefineComponent<__VLS_Props, {
31
+ LktTab: typeof LktTab;
32
+ Value: typeof Value;
33
+ classes: typeof classes;
34
+ contentStyles: typeof contentStyles;
35
+ tabsSlots: typeof tabsSlots;
36
+ titlesSlots: typeof titlesSlots;
37
+ liSlots: typeof liSlots;
38
+ displayButtons: typeof displayButtons;
39
+ getTabHref: typeof getTabHref;
40
+ getTabTitle: typeof getTabTitle;
41
+ refresh: typeof refresh;
42
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
43
+ "update:modelValue": (...args: any[]) => void;
44
+ }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
45
+ "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
123
46
  }>, {
124
- modelValue: string;
125
47
  id: string;
48
+ modelValue: string | number;
126
49
  useSession: boolean;
127
50
  cacheLifetime: number;
128
51
  contentPad: string;
129
- palette: string;
130
- titles: () => {};
131
- }>>> & {
52
+ titles: LktObject;
53
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
54
+ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
55
+ "update:modelValue": (...args: any[]) => void;
56
+ }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
132
57
  "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
133
- }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", {
58
+ }>, {
134
59
  id: string;
135
60
  modelValue: string | number;
136
61
  useSession: boolean;
137
62
  cacheLifetime: number;
138
63
  contentPad: string;
139
- palette: string;
140
64
  titles: LktObject;
141
- }> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
142
- $slots: Record<string, {}> & Record<string, {}> & Record<string, {}>;
143
- });
65
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
66
+ declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
144
67
  export default _default;
145
- declare type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
146
- declare type __VLS_TypePropsToRuntimeProps<T> = {
147
- [K in keyof T]-?: {} extends Pick<T, K> ? {
148
- type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
149
- } : {
150
- type: import('vue').PropType<T[K]>;
151
- required: true;
68
+ type __VLS_WithSlots<T, S> = T & {
69
+ new (): {
70
+ $slots: S;
152
71
  };
153
72
  };
154
- declare type __VLS_WithDefaults<P, D> = {
155
- [K in keyof Pick<P, keyof P>]: K extends keyof D ? P[K] & {
156
- default: D[K];
157
- } : P[K];
158
- };
package/dist/vite.config.d.ts CHANGED
@@ -1,35 +1,35 @@
1
1
  declare namespace _default {
2
- const plugins: import("vite").Plugin[];
2
+ let plugins: import("vite").Plugin<import("@vitejs/plugin-vue").Api>[];
3
3
  namespace resolve {
4
- const alias: {
4
+ let alias: {
5
5
  '@': string;
6
6
  '@test': string;
7
7
  };
8
8
  }
9
9
  namespace build {
10
10
  export namespace lib {
11
- const entry: string;
12
- const name: string;
11
+ let entry: string;
12
+ let name: string;
13
13
  function fileName(format: any): string;
14
14
  }
15
15
  export { outDir };
16
- export const minify: boolean;
16
+ export let minify: boolean;
17
17
  export namespace rollupOptions {
18
- const external: string[];
18
+ let external: string[];
19
19
  namespace output {
20
- const globals: {
20
+ let globals: {
21
21
  vue: string;
22
22
  "lkt-tools": string;
23
23
  "lkt-events": string;
24
24
  "lkt-session": string;
25
25
  };
26
- const sourcemapExcludeSources: boolean;
26
+ let sourcemapExcludeSources: boolean;
27
27
  }
28
28
  }
29
29
  }
30
30
  namespace test {
31
31
  namespace coverage {
32
- const reporter: string[];
32
+ let reporter: string[];
33
33
  }
34
34
  function resolveSnapshotPath(testPath: any, snapExtension: any): string;
35
35
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "lkt-tabs",
3
- "version": "1.0.8",
3
+ "version": "1.1.0",
4
4
  "description": "",
5
5
  "main": "src/index.ts",
6
6
  "module": "src/index.ts",
@@ -15,7 +15,7 @@
15
15
  "import": "./dist/lkt-tabs.es.js",
16
16
  "require": "./dist/lkt-tabs.umd.js"
17
17
  },
18
- "./dist/style.css": "./dist/style.css",
18
+ "./dist/style.css": "./dist/lkt-tabs.css",
19
19
  "./theme": "./theme/default.css",
20
20
  "./theme/default": "./theme/default.css"
21
21
  },
@@ -29,21 +29,24 @@
29
29
  "test-coverage": "vitest run --coverage"
30
30
  },
31
31
  "author": "Antonio Ibáñez",
32
+ "engines": {
33
+ "node": ">=18"
34
+ },
32
35
  "devDependencies": {
33
- "@babel/types": "^7.18.9",
34
- "@types/node": "^18.0.6",
35
- "@vitejs/plugin-vue": "^3.0.1",
36
- "vue-tsc": "^0.38.9"
36
+ "@babel/types": "^7.23.6",
37
+ "@types/node": "^20.11.19",
38
+ "@types/rollup": "^0.54.0",
39
+ "@vitejs/plugin-vue": "^5.0.4",
40
+ "rollup": "^4.34.8",
41
+ "typescript": "^5.7.3",
42
+ "vite": "^6.1.1",
43
+ "vue": "^3.3.0",
44
+ "vue-tsc": "^2.2.0"
37
45
  },
38
- "dependencies": {
39
- "lkt-events": "^1.0.4",
46
+ "peerDependencies": {
40
47
  "lkt-session": "^1.0.6",
41
- "lkt-string-tools": "^1.0.5",
42
- "lkt-ts-interfaces": "^1.0.5",
43
- "lkt-vue-tools": "^1.0.1",
48
+ "lkt-string-tools": "^1.0.8",
49
+ "lkt-vue-kernel": "^1.0.32",
44
50
  "vue": "^3.0.5"
45
- },
46
- "engines": {
47
- "node": ">=12"
48
51
  }
49
52
  }
package/src/lib-components/LktTabs.vue CHANGED
@@ -1,31 +1,32 @@
1
1
  <script lang="ts" setup>
2
2
  import LktTab from "../components/LktTab.vue";
3
- import {computed, getCurrentInstance, nextTick, ref, watch} from 'vue';
4
- import {getSlots} from "lkt-vue-tools";
3
+ import {computed, getCurrentInstance, nextTick, ref, useSlots, watch} from 'vue';
5
4
  import {loadSelectedTabFromSession, setSelectedTabFromSession} from "../functions/functions";
6
- import {LktObject} from "lkt-ts-interfaces";
5
+ import {LktObject} from "lkt-vue-kernel";
7
6
 
8
7
  const {ctx: _this}: any = getCurrentInstance();
9
8
 
9
+ const slots = useSlots();
10
+
10
11
  const props = withDefaults(defineProps<{
11
- modelValue: string|number,
12
- id?: string,
13
- useSession?: boolean,
14
- cacheLifetime?: number,
15
- contentPad?: string,
16
- palette?: string,
17
- titles?: LktObject,
12
+ modelValue: string|number
13
+ id?: string
14
+ useSession?: boolean
15
+ cacheLifetime?: number
16
+ contentPad?: string
17
+ titles?: LktObject
18
18
  }>(), {
19
19
  modelValue: '',
20
20
  id: '',
21
21
  useSession: false,
22
22
  cacheLifetime: 5,
23
23
  contentPad: '',
24
- palette: '',
25
24
  titles: () => ({}),
26
25
  });
27
26
 
28
- const emit = defineEmits(['update:modelValue'])
27
+ const emit = defineEmits([
28
+ 'update:modelValue'
29
+ ])
29
30
 
30
31
  const Value = ref('');
31
32
 
@@ -55,8 +56,7 @@ watch(Value, (newVal, oldVal) => {
55
56
  })
56
57
 
57
58
  const classes = computed(() => {
58
- let r = [];
59
- if (!!props.palette) r.push(`lkt-tabs--${props.palette}`);
59
+ let r: Array<string> = [];
60
60
  return r.join(' ');
61
61
  });
62
62
 
@@ -67,15 +67,21 @@ const contentStyles = computed(() => {
67
67
  });
68
68
 
69
69
  const tabsSlots = computed(() => {
70
- return getSlots(_this.$slots, 'tab-');
70
+ let r: string[] = [];
71
+ for (let k in slots) if (k.indexOf('tab-') !== -1) r.push(k);
72
+ return r;
71
73
  });
72
74
 
73
75
  const titlesSlots = computed(() => {
74
- return getSlots(_this.$slots, 'title-');
76
+ let r: string[] = [];
77
+ for (let k in slots) if (k.indexOf('title-') !== -1) r.push(k);
78
+ return r;
75
79
  });
76
80
 
77
81
  const liSlots = computed(() => {
78
- return getSlots(_this.$slots, 'li-');
82
+ let r: string[] = [];
83
+ for (let k in slots) if (k.indexOf('li-') !== -1) r.push(k);
84
+ return r;
79
85
  });
80
86
 
81
87
  const tabsHref = computed(() => {
@@ -117,18 +123,18 @@ for (let k in tabsSlots.value) {
117
123
  <div class="lkt-tabs" v-bind:class="classes">
118
124
  <ul class="lkt-tabs__list" v-show="displayButtons">
119
125
  <li
120
- v-for="(_, key) in tabsSlots"
126
+ v-for="key in tabsSlots"
121
127
  v-bind:key="key"
122
128
  class="lkt-tab"
123
129
  v-bind:class="{'is-active': key === Value}"
124
130
  role="presentation"
125
131
  >
126
- <template v-if="!!titlesSlots[key]">
132
+ <template v-if="titlesSlots.includes(key)">
127
133
  <a v-bind:href="getTabHref(key)"
128
134
  v-on:click.prevent="Value = key"
129
135
  role="tab"
130
136
  >
131
- <slot v-bind:name="'title-' + key"></slot>
137
+ <slot v-bind:name="'title-' + key"/>
132
138
  </a>
133
139
  </template>
134
140
  <template v-else>
@@ -145,7 +151,7 @@ for (let k in tabsSlots.value) {
145
151
  </ul>
146
152
  <div class="lkt-tabs__content" v-bind:style="contentStyles">
147
153
  <lkt-tab
148
- v-for="(_, key) in tabsSlots"
154
+ v-for="key in tabsSlots"
149
155
  v-bind:ref="key"
150
156
  v-bind:hash="key"
151
157
  v-bind:id="key"
@@ -153,7 +159,7 @@ for (let k in tabsSlots.value) {
153
159
  v-bind:active-hash="Value"
154
160
  v-on:is-active="refresh"
155
161
  >
156
- <slot v-bind:name="'tab-' + key"></slot>
162
+ <slot v-bind:name="'tab-' + key"/>
157
163
  </lkt-tab>
158
164
  </div>
159
165
  </div>
/package/dist/{style.css → lkt-tabs.css} RENAMED
File without changes