lkt-tabs 1.3.2 → 2.0.1

package/dist/build.css

@@ -0,0 +1 @@
+.lkt-tabs{max-width:100%}.lkt-tab--content{padding:var(--lkt-tab--content--padding);width:100%;height:100%}

package/dist/build.d.ts

@@ -0,0 +1,4 @@
+export { ue as default };
+declare namespace ue {
+    function install(e: any, t: any): void;
+}

package/dist/build.js

@@ -0,0 +1,198 @@
+import { defineComponent as E, ref as O, computed as k, watch as v, createElementBlock as m, createCommentVNode as P, openBlock as d, unref as B, normalizeClass as y, renderSlot as V, Fragment as _, renderList as A, createBlock as $, resolveDynamicComponent as R, mergeProps as h, mergeDefaults as K, onMounted as I, resolveComponent as N, createVNode as M, createElementVNode as U, withDirectives as F, withCtx as G, vShow as z } from "vue";
+import { TabType as w, MenuEntryType as S, ButtonType as j, MenuType as q, getDefaultValues as H, Tabs as J } from "lkt-vue-kernel";
+import { generateRandomString as L, trim as C } from "lkt-string-tools";
+import { secondsToMilliseconds as Y } from "lkt-date-tools";
+const Q = ["id"], W = /* @__PURE__ */ E({
+  __name: "LktTab",
+  props: {
+    tab: {},
+    isActive: { type: Boolean },
+    identifier: {}
+  },
+  setup(e) {
+    const t = e, o = L(8), r = O(t.isActive), l = k(() => t.tab.type === w.Always ? !0 : t.tab.type === w.Lazy ? r.value : t.isActive);
+    return v(() => t.isActive, (n) => {
+      n && (r.value = !0);
+    }), (n, u) => l.value ? (d(), m("section", {
+      key: 0,
+      class: y(["lkt-tab--content", e.tab.containerClass]),
+      role: "tabpanel",
+      id: `lkt-tabs-${B(o)}-${e.tab.key}`
+    }, [
+      (d(!0), m(_, null, A(e.tab.content, (i) => (d(), $(R(i.tag), h({
+        class: i.class
+      }, { ref_for: !0 }, i.props, {
+        modelValue: i.vModels.modelValue,
+        "onUpdate:modelValue": (a) => i.vModels.modelValue = a
+      }), null, 16, ["class", "modelValue", "onUpdate:modelValue"]))), 256)),
+      V(n.$slots, "default")
+    ], 10, Q)) : P("", !0);
+  }
+});
+class X {
+  constructor(t) {
+    t || (t = !0), this.value = t;
+  }
+  enabled() {
+    return this.value;
+  }
+}
+class c {
+}
+c.SUPPORTS_LOCAL_STORAGE = !1;
+c.SUPPORTS_SESSION_STORAGE = !1;
+c.COOKIE_FALLBACK = new X();
+const Z = (e, t, o) => {
+  const r = /* @__PURE__ */ new Date(), l = r.getTime() + Y(o);
+  r.setTime(l);
+  const n = `expires=${r.toUTCString()}`;
+  document.cookie = `${e}=${t}, ${n}`;
+}, ee = (e) => {
+  const t = `${e}=`, o = document.cookie.split(","), r = document.cookie.split("expires="), l = C(r[1]);
+  let n = new Date(l);
+  if (l && (n = new Date(l)) && n < /* @__PURE__ */ new Date()) {
+    x(e);
+    return;
+  }
+  for (let u = 0; u < o.length; u++) {
+    const i = C(o[u]);
+    if (i.indexOf(t) == 0)
+      return i.substring(t.length, i.length);
+  }
+  return "";
+}, x = (e) => {
+  Z(e, "", -1);
+}, te = (e) => {
+  if (!c.SUPPORTS_SESSION_STORAGE) {
+    if (!c.COOKIE_FALLBACK.enabled())
+      throw new Error("Browser doesn't support sessionStorage and cookies fallback is disabled");
+    return ee(e);
+  }
+  const t = JSON.parse(sessionStorage.getItem(e));
+  if (!t)
+    return;
+  const o = typeof t.expires == "string" && t.expires.length > 0;
+  let r;
+  if (o && (r = new Date(t.expires)) && r < /* @__PURE__ */ new Date()) {
+    se(e);
+    return;
+  }
+  return t.value;
+}, se = (e) => {
+  if (!c.SUPPORTS_SESSION_STORAGE) {
+    if (!c.COOKIE_FALLBACK.enabled())
+      throw new Error("Browser doesn't support sessionStorage and cookies fallback is disabled");
+    return x(e);
+  }
+  return sessionStorage.removeItem(e);
+}, oe = (e) => `lkt-tabs.${window.location.host}${window.location.pathname}.${e}`, ne = (e) => te(oe(e)), ae = /* @__PURE__ */ E({
+  __name: "LktTabs",
+  props: /* @__PURE__ */ K({
+    modelValue: {},
+    id: {},
+    class: {},
+    contentClass: {},
+    useSession: { type: Boolean },
+    cacheLifetime: {},
+    tabs: {},
+    navStartButtons: {},
+    navEndButtons: {},
+    navPostEndButtonsElements: {}
+  }, H(J)),
+  emits: [
+    "update:modelValue"
+  ],
+  setup(e, { emit: t }) {
+    const o = e, r = t, l = L(8), n = O("");
+    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 a = ne(o.id);
+      a && (n.value = a);
+    }
+    v(() => o.modelValue, (a, p) => {
+      typeof a == "string" && (n.value = a);
+    }), v(n, (a, p) => {
+      r("update:modelValue");
+    });
+    const u = k(() => {
+      let a = [];
+      return o.class && a.push(o.class), a.join(" ");
+    }), i = k(() => {
+      var p, f;
+      let a = [];
+      return (p = o.navStartButtons) == null || p.forEach((s) => {
+        a.push({
+          type: S.Button,
+          button: s
+        });
+      }), o.tabs.map((s) => {
+        const b = n.value === s.key;
+        return {
+          key: s.key,
+          type: S.Button,
+          button: {
+            ...s.button,
+            type: j.Tab,
+            text: s.button.text ?? s.key,
+            class: b ? "is-active-tab" : "",
+            anchor: {
+              to: s.hash ? `#${s.hash}` : void 0
+            },
+            aria: {
+              controls: `lkt-tabs-${l}-${s.key}`,
+              selected: b
+            },
+            events: {
+              click: (D) => {
+                var g, T;
+                typeof ((g = s.button.events) == null ? void 0 : g.click) == "function" && ((T = s.button.events) == null || T.click(D)), n.value = s.key;
+              }
+            }
+          }
+        };
+      }).forEach((s) => a.push(s)), (f = o.navEndButtons) == null || f.forEach((s) => {
+        a.push({
+          type: S.Button,
+          button: s
+        });
+      }), {
+        menuKey: `tabs-menu-${o.id}`,
+        type: q.TabList,
+        modelValue: a
+      };
+    });
+    return I(() => {
+      !n.value && o.tabs.length > 0 && (n.value = o.tabs[0].key);
+    }), (a, p) => {
+      const f = N("lkt-menu");
+      return d(), m("div", {
+        class: y(["lkt-tabs", u.value])
+      }, [
+        M(f, h(i.value, { class: "lkt-tabs--list" }), null, 16),
+        U("div", {
+          class: y(["lkt-tabs--content", e.contentClass])
+        }, [
+          (d(!0), m(_, null, A(e.tabs, (s) => F((d(), $(W, h({ ref_for: !0 }, {
+            tab: s,
+            isActive: n.value === s.key,
+            identifier: B(l)
+          }), {
+            default: G(() => [
+              V(a.$slots, "tab-" + s.key)
+            ]),
+            _: 2
+          }, 1040)), [
+            [z, n.value === s.key]
+          ])), 256))
+        ], 2)
+      ], 2);
+    };
+  }
+}), ue = {
+  install: (e, t) => {
+    e.component("lkt-tabs", ae);
+  }
+};
+export {
+  ue as default
+};

package/dist/components/LktTab.vue.d.ts

@@ -0,0 +1,18 @@
+import { TabConfig } from "lkt-vue-kernel";
+type __VLS_Props = {
+    tab: TabConfig;
+    isActive: boolean;
+    identifier: string;
+};
+declare var __VLS_5: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_5) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/lib-components/LktTabs.vue.d.ts

@@ -0,0 +1,25 @@
+import { TabConfig, TabsConfig, ValidTabKey } from "lkt-vue-kernel";
+declare var __VLS_9: string, __VLS_10: {};
+type __VLS_Slots = {} & {
+    [K in NonNullable<typeof __VLS_9>]?: (props: typeof __VLS_10) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<TabsConfig, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<TabsConfig> & Readonly<{
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}>, {
+    id: string;
+    modelValue: ValidTabKey;
+    navStartButtons: Array<import("lkt-vue-kernel").ButtonConfig>;
+    navEndButtons: Array<import("lkt-vue-kernel").ButtonConfig>;
+    useSession: boolean;
+    cacheLifetime: number;
+    tabs: Array<TabConfig>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/package.json

@@ -1,33 +1,27 @@
 {
   "name": "lkt-tabs",
-  "version": "1.3.2",
+  "type": "module",
+  "version": "2.0.1",
   "description": "",
-  "main": "src/index.ts",
-  "module": "src/index.ts",
-  "files": [
-    "dist/*",
-    "src/**/*.vue",
-    "theme/**/*.css"
-  ],
   "sideEffects": false,
+  "module": "./dist/build.js",
   "exports": {
     ".": {
-      "import": "./dist/lkt-tabs.es.js",
-      "require": "./dist/lkt-tabs.umd.js"
+      "import": "./dist/build.js"
     },
-    "./styles": "./dist/lkt-tabs.css",
-    "./dist/style.css": "./dist/lkt-tabs.css",
+    "./styles": "./dist/build.css",
     "./theme": "./theme/default.css",
     "./theme/default": "./theme/default.css"
   },
-  "types": "./dist/types/index.d.ts",
+  "types": "./dist/build.d.ts",
+  "files": [
+    "dist/*",
+    "src/**/*.vue",
+    "theme/**/*.css"
+  ],
   "scripts": {
-    "serve": "vite",
-    "build": "vite build && vue-tsc --emitDeclarationOnly --project tsconfig.json && mv dist/src dist/types && rm dist/README.md.d.ts && rm dist/vite.config.d.ts",
-    "build2": "vite build",
-    "preview": "vite preview",
-    "test": "vitest",
-    "test-coverage": "vitest run --coverage"
+    "build": "vue-tsc --declaration --emitDeclarationOnly; vite build; tsc --project tsconfig.build.json; cp build/* dist/",
+    "rebuild": "rm -rf dist/*; vue-tsc --declaration --emitDeclarationOnly; vite build; tsc --project tsconfig.build.json; cp build/* dist/"
   },
   "author": "Antonio Ibáñez",
   "engines": {
@@ -37,17 +31,16 @@
     "@babel/types": "^7.23.6",
     "@types/node": "^20.11.19",
     "@types/rollup": "^0.54.0",
-    "@vitejs/plugin-vue": "^5.0.4",
+    "@vitejs/plugin-vue": "^5.2.1",
     "rollup": "^4.34.8",
     "typescript": "^5.7.3",
     "vite": "^6.1.1",
-    "vue": "^3.3.0",
     "vue-tsc": "^2.2.0"
   },
   "peerDependencies": {
     "lkt-session": "^1.0.6",
     "lkt-string-tools": "^1.1.0",
-    "lkt-vue-kernel": "^1.0.51",
+    "lkt-vue-kernel": "^1.1.4",
     "vue": "^3.0.5"
   }
 }

package/src/components/LktTab.vue

@@ -1,47 +1,47 @@
 <script lang="ts" setup>
+import {TabConfig, TabType} from "lkt-vue-kernel";
+import {generateRandomString} from "lkt-string-tools";
 import {computed, ref, watch} from "vue";
-import {generateRandomString, isString} from "lkt-string-tools";
 
-const props = defineProps({
-    id: {type: String, default: ''},
-    name: {type: String, required: true},
-    hash: {type: String, default: ''},
-    activeHash: {type: String, default: ''},
-    isDisabled: {type: Boolean, default: false},
-});
-
-const emit = defineEmits(['is-active']);
+const props = withDefaults(defineProps<{
+    tab: TabConfig
+    isActive: boolean
+    identifier: string
+}>(), {})
 
-const isActive = ref(false),
-    uniqueId = ref(generateRandomString(8));
+const identifier = generateRandomString(8);
+const lazyloaded = ref(props.isActive);
 
+const computedCanRender = computed(() => {
+    if (props.tab.type === TabType.Always) return true;
 
-const computedId = computed(() => {
-    if (props.id) return props.id;
-    if (isString(props.name) && props.name.length > 0) {
-        return props.name.toLowerCase().replace(/ /g, '-');
+    if (props.tab.type === TabType.Lazy) {
+        return lazyloaded.value;
     }
-    return uniqueId.value;
-})
-
-const checkIsActive = () => {
-    isActive.value = props.activeHash === props.hash;
-    emit('is-active', isActive.value);
-}
-
-watch(() => props.activeHash, checkIsActive);
-
-checkIsActive();
+    return props.isActive;
+});
 
+watch(() => props.isActive, (v) => {
+    if (v) lazyloaded.value = true;
+})
 </script>
 
 <template>
     <section
-        data-lkt="tab-content"
-        v-if="isActive"
-        v-bind:id="computedId"
+        v-if="computedCanRender"
+        class="lkt-tab--content"
+        :class="tab.containerClass"
         role="tabpanel"
+        :id="`lkt-tabs-${identifier}-${tab.key}`"
     >
+        <template v-for="element in tab.content">
+            <component
+                :is="element.tag"
+                :class="element.class"
+                v-bind="element.props"
+                v-model="element.vModels.modelValue"
+            />
+        </template>
         <slot/>
     </section>
 </template>

package/src/lib-components/LktTabs.vue

@@ -1,12 +1,21 @@
 <script lang="ts" setup>
 import LktTab from "../components/LktTab.vue";
-import {computed, getCurrentInstance, nextTick, ref, useSlots, watch} from 'vue';
-import {loadSelectedTabFromSession, setSelectedTabFromSession} from "../functions/functions";
-import {getDefaultValues, LktObject, Tabs, TabsConfig} from "lkt-vue-kernel";
-
-const {ctx: _this}: any = getCurrentInstance();
-
-const slots = useSlots();
+import {computed, onMounted, ref, watch} from 'vue';
+import {loadSelectedTabFromSession} from "../functions/functions";
+import {
+    ButtonType,
+    ClickEventArgs,
+    getDefaultValues,
+    MenuConfig,
+    MenuEntryConfig,
+    MenuEntryType,
+    MenuType,
+    TabConfig,
+    Tabs,
+    TabsConfig,
+    ValidTabKey
+} from "lkt-vue-kernel";
+import {generateRandomString} from "lkt-string-tools";
 
 const props = withDefaults(defineProps<TabsConfig>(), getDefaultValues(Tabs));
 
@@ -14,7 +23,9 @@ const emit = defineEmits([
     'update:modelValue'
 ])
 
-const Value = ref('');
+const identifier = generateRandomString(8);
+
+const Value = ref(<ValidTabKey>'');
 
 if (props.useSession) {
     if (!props.id) {
@@ -33,120 +44,94 @@ watch(() => props.modelValue, (newVal, oldVal) => {
 
 watch(Value, (newVal, oldVal) => {
     emit('update:modelValue');
-    nextTick(() => {
-        _this.$forceUpdate()
-    });
-    if (props.useSession) {
-        setSelectedTabFromSession(_this.id, newVal, props.cacheLifetime);
-    }
 })
 
 const classes = computed(() => {
     let r: Array<string> = [];
+    if (props.class) r.push(props.class);
     return r.join(' ');
 });
 
-const contentStyles = computed(() => {
-    let r = [];
-    if (!!props.contentPad) r.push(`padding: ${props.contentPad}`);
-    return r.join(';');
-});
+const computedMenuConfig = computed(() => {
 
-const tabsSlots = computed(() => {
-    let r: string[] = [];
-    for (let k in slots) if (k.indexOf('tab-') !== -1) r.push(k);
-    return r;
-});
+    let modelValue: Array<MenuEntryConfig> = [];
 
-const titlesSlots = computed(() => {
-    let r: string[] = [];
-    for (let k in slots) if (k.indexOf('title-') !== -1) r.push(k);
-    return r;
-});
-
-const liSlots = computed(() => {
-    let r: string[] = [];
-    for (let k in slots) if (k.indexOf('li-') !== -1) r.push(k);
-    return r;
-});
-
-const tabsHref = computed(() => {
-    let r: LktObject = {};
-    for (let k in _this.$refs) {
-        r[k] = _this.$refs[k].hash;
-    }
+    props.navStartButtons?.forEach(button => {
+        modelValue.push({
+            type: MenuEntryType.Button,
+            button,
+        })
+    });
 
-    return r;
-});
+    props.tabs.map((tab: TabConfig) => {
+        const selected = Value.value === tab.key;
+        return <MenuEntryConfig>{
+            key: tab.key,
+            type: MenuEntryType.Button,
+            button: {
+                ...tab.button,
+                type: ButtonType.Tab,
+                text: tab.button.text ?? tab.key,
+                class: selected ? 'is-active-tab' : '',
+                anchor: {
+                    to: tab.hash ? `#${tab.hash}` : undefined
+                },
+                aria: {
+                    controls: `lkt-tabs-${identifier}-${tab.key}`,
+                    selected,
+                },
+                events: {
+                    click: (args: ClickEventArgs) => {
+                        if (typeof tab.button.events?.click === 'function') {
+                            tab.button.events?.click(args);
+                        }
+
+                        Value.value = tab.key
+                    }
+                }
+            }
+        }
+    }).forEach(entry => modelValue.push(entry));
+
+    props.navEndButtons?.forEach(button => {
+        modelValue.push({
+            type: MenuEntryType.Button,
+            button,
+        })
+    });
 
-const displayButtons = computed(() => {
-    return Object.keys(tabsSlots.value).length > 1;
-});
 
-const getTabHref = (key: string|number = '') => {
-    if (tabsHref.value.length > 0 && tabsHref.value[key]) {
-        return '#' + tabsHref.value[key];
+    return <MenuConfig>{
+        menuKey: `tabs-menu-${props.id}`,
+        type: MenuType.TabList,
+        modelValue,
     }
-    return '#';
-}
-
-const getTabTitle = (key: string|number = '') => {
-    if (props.titles && props.titles[key]) return props.titles[key];
-    return key;
-}
-
-const refresh = () => {
-    _this.$forceUpdate();
-}
+})
 
-for (let k in tabsSlots.value) {
-    if (Value.value === '') Value.value = k;
-}
+onMounted(() => {
+    if (!Value.value && props.tabs.length > 0) {
+        Value.value = props.tabs[0].key;
+    }
+})
 </script>
 
 
 <template>
     <div class="lkt-tabs" v-bind:class="classes">
-        <ul class="lkt-tabs__list" v-show="displayButtons">
-            <li
-                v-for="key in tabsSlots"
-                v-bind:key="key"
-                class="lkt-tab"
-                v-bind:class="{'is-active': key === Value}"
-                role="presentation"
-            >
-                <template v-if="titlesSlots.includes(key)">
-                    <a v-bind:href="getTabHref(key)"
-                       v-on:click.prevent="Value = key"
-                       role="tab"
-                    >
-                        <slot v-bind:name="'title-' + key"/>
-                    </a>
-                </template>
-                <template v-else>
-                    <a v-html="getTabTitle(key)"
-                       v-on:click.prevent="Value = key"
-                       v-bind:href="getTabHref(key)"
-                       role="tab"
-                    ></a>
-                </template>
-            </li>
-            <li v-for="(_, key) in liSlots" data-lkt="tab">
-                <slot v-bind:name="'li-' + key"/>
-            </li>
-        </ul>
-        <div class="lkt-tabs__content" v-bind:style="contentStyles">
-            <lkt-tab
-                v-for="key in tabsSlots"
-                v-bind:ref="key"
-                v-bind:hash="key"
-                v-bind:id="key"
-                v-bind:name="getTabTitle(key)"
-                v-bind:active-hash="Value"
-                v-on:is-active="refresh"
-            >
-                <slot v-bind:name="'tab-' + key"/>
-            </lkt-tab>
+        <lkt-menu v-bind="computedMenuConfig" class="lkt-tabs--list"/>
+        <div class="lkt-tabs--content" :class="contentClass">
+            <template v-for="tab in tabs">
+                <lkt-tab
+                    v-show="Value === tab.key"
+                    v-bind="{
+                        tab,
+                        isActive: Value === tab.key,
+                        identifier
+                    }"
+                >
+                    <slot v-bind:name="'tab-' + tab.key"/>
+                </lkt-tab>
+            </template>
         </div>
     </div>
 </template>

package/theme/default.css

@@ -1,33 +1,4 @@
 .lkt-tabs {
-    --lkt-tab--display: inline-flex;
-    --lkt-tab--align-items: center;
-    --lkt-tab--justify-content: center;
-    --lkt-tab--font-family: system-ui, Helvetica;
-    --lkt-tab--font-size: 16px;
-    --lkt-tab--font-weight: 300;
-    --lkt-tab--line-height: 1.425;
-    --lkt-tab--text-align: left;
-    --lkt-tab--min-width: 100%;
-    --lkt-tab--min-height: 35px;
-    --lkt-tab--padding: 7px 15px;
-    --lkt-tab--gap: 15px;
-    --lkt-tab--border-radius: 5px;
-    --lkt-tab--border-width: 1px;
-    --lkt-tab--border-style: solid;
-    --lkt-tab--color: #444444;
-    --lkt-tab--background: #e1e1e1;
-    --lkt-tab--border-color: #ddd;
-    --lkt-tab--shadow: none;
-    --lkt-tab--transition: all linear 100ms;
-
-    /** Element: List */
-    --lkt-tab--list--display: flex;
-
-    /** State: Active */
-    --lkt-tab--active--background: #444444;
-    --lkt-tab--active--color: #e1e1e1;
-
-    /** State: Hover */
-    --lkt-tab--hover--background: #444444;
-    --lkt-tab--hover-color: #e1e1e1;
+    /** Element: Content */
+    --lkt-tab--content--padding: 0;
 }

package/dist/lkt-tabs.css

@@ -1 +0,0 @@
-.lkt-tabs{max-width:100%}.lkt-tabs__list{gap:var(--lkt-tab--gap);border-bottom:var(--lkt-tab--border-width) var(--lkt-tab--border-style) var(--lkt-tab--border-color);padding:var(--lkt-tab--padding);display:var(--lkt-tab--list--display);overflow-x:auto}.lkt-tab{background:var(--lkt-tab--background);color:var(--lkt-tab--color);border:var(--lkt-tab--border-width) var(--lkt-tab--border-style) var(--lkt-tab--border-color);border-radius:var(--lkt-tab--border-radius);font-size:var(--lkt-tab--font-size);line-height:var(--lkt-tab--line-height);transition:var(--lkt-tab--transition);display:var(--lkt-tab--display);align-items:var(--lkt-tab--align-items);justify-content:var(--lkt-tab--justify-content);cursor:pointer}.lkt-tab.is-active{background:var(--lkt-tab--active--background);color:var(--lkt-tab--active--color)}.lkt-tab:hover{background:var(--lkt-tab--hover--background);color:var(--lkt-tab--hover-color)}.lkt-tab a{color:inherit;padding:var(--lkt-tab--padding)}

package/dist/lkt-tabs.es.js

@@ -1,183 +0,0 @@
-var $ = Object.defineProperty;
-var H = (e, a, r) => a in e ? $(e, a, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[a] = r;
-var i = (e, a, r) => H(e, typeof a != "symbol" ? a + "" : a, r);
-import { defineComponent as D, ref as y, computed as h, watch as L, createElementBlock as m, createCommentVNode as R, openBlock as d, renderSlot as v, mergeDefaults as z, getCurrentInstance as O, useSlots as F, nextTick as U, normalizeClass as T, withDirectives as q, createElementVNode as I, Fragment as k, renderList as w, withModifiers as A, vShow as j, normalizeStyle as K, createBlock as Q, withCtx as Y } from "vue";
-import { getSessionStorage as G, setSessionStorage as J } from "lkt-session";
-function W(e = 10) {
-  let a = "", r = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789", s = r.length;
-  for (let n = 0; n < e; n++) a += r.charAt(Math.floor(Math.random() * s));
-  return a;
-}
-function X(e) {
-  return typeof e == "string";
-}
-const Z = ["id"], ee = /* @__PURE__ */ D({
-  __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(e, { emit: a }) {
-    const r = e, s = a, n = y(!1), b = y(W(8)), u = h(() => r.id ? r.id : X(r.name) && r.name.length > 0 ? r.name.toLowerCase().replace(/ /g, "-") : b.value), f = () => {
-      n.value = r.activeHash === r.hash, s("is-active", n.value);
-    };
-    return L(() => r.activeHash, f), f(), (g, p) => n.value ? (d(), m("section", {
-      key: 0,
-      "data-lkt": "tab-content",
-      id: u.value,
-      role: "tabpanel"
-    }, [
-      v(g.$slots, "default")
-    ], 8, Z)) : R("", !0);
-  }
-}), _ = (e) => `lkt-tabs.${window.location.host}${window.location.pathname}.${e}`, te = (e) => G(_(e)), ae = (e, a, r) => {
-  J(_(e), a, r * 60);
-};
-var re = ((e) => (e.Button = "button", e.Submit = "submit", e.Reset = "reset", e.Anchor = "anchor", e.Content = "content", e.Switch = "switch", e.HiddenSwitch = "hidden-switch", e.Split = "split", e.SplitLazy = "split-lazy", e.SplitEver = "split-ever", e.Tooltip = "tooltip", e.TooltipLazy = "tooltip-lazy", e.TooltipEver = "tooltip-ever", e.FileUpload = "file-upload", e.ImageUpload = "image-upload", e))(re || {}), ne = ((e) => (e.Text = "text", e.Email = "email", e.Tel = "tel", e.Password = "password", e.Search = "search", e.Number = "number", e.Color = "color", e.Range = "range", e.Textarea = "textarea", e.Html = "html", e.Date = "date", e.File = "file", e.Image = "image", e.Select = "select", e.Check = "check", e.Switch = "switch", e.Calc = "calc", e.Card = "card", e.Elements = "elements", e))(ne || {}), le = ["lktDateProps", "lktStrictItem", "lktExcludedProps"], c, oe = (c = class {
-  constructor(a) {
-  }
-  feed(a = {}, r = this) {
-    if (typeof a == "object") for (let [s, n] of Object.entries(a)) r.assignProp(s, n);
-  }
-  assignProp(a, r) {
-    if (!(le.includes(a) || c.lktExcludedProps.includes(a))) {
-      if (c.lktDateProps.includes(a)) {
-        this[a] = new Date(r);
-        return;
-      }
-      this[a] = r;
-    }
-  }
-}, i(c, "lktAllowUndefinedProps", []), i(c, "lktExcludedProps", []), i(c, "lktDateProps", []), i(c, "lktStrictItem", !1), i(c, "lktDefaultValues", []), c), se = ((e) => (e.Auto = "auto", e.Always = "always", e.Lazy = "lazy", e.Ever = "ever", e))(se || {}), ie = ((e) => (e.Transform = "transform", e.Height = "height", e.Display = "display", e))(ie || {}), ce = ((e) => (e.Href = "href", e.RouterLink = "router-link", e.RouterLinkBack = "router-link-back", e.Mail = "mail", e.Tel = "tel", e.Tab = "tab", e.Download = "download", e.Action = "action", e.Legacy = "", e))(ce || {}), ue = ((e) => (e.None = "", e.Field = "field", e.Button = "button", e.Anchor = "anchor", e))(ue || {}), de = ((e) => (e.List = "list", e.Inline = "inline", e.Count = "count", e))(de || {}), me = ((e) => (e.MinStringLength = "min-str", e.MinNumber = "min-num", e.MaxStringLength = "max-str", e.MaxNumber = "max-num", e.Email = "email", e.Empty = "empty", e.EqualTo = "equal-to", e.MinNumbers = "min-numbers", e.MaxNumbers = "max-numbers", e.MinChars = "min-chars", e.MaxChars = "max-chars", e.MinUpperChars = "min-upper-chars", e.MaxUpperChars = "max-upper-chars", e.MinLowerChars = "min-lower-chars", e.MaxLowerChars = "max-lower-chars", e.MinSpecialChars = "min-special-chars", e.MaxSpecialChars = "max-special-chars", e))(me || {}), he = ((e) => (e.Ok = "ok", e.Ko = "ko", e.Info = "info", e))(he || {}), pe = ((e) => (e.NotDefined = "", e.Button = "button", e))(pe || {}), fe = ((e) => (e.Start = "start", e.End = "end", e))(fe || {}), ve = ((e) => (e.Create = "create", e.Update = "update", e.Read = "read", e))(ve || {}), be = ((e) => (e.Inline = "inline", e.Modal = "modal", e))(be || {}), ge = ((e) => (e.Top = "top", e.Bottom = "bottom", e))(ge || {}), Ce = ((e) => (e.Changed = "changed", e.Always = "always", e.Never = "never", e))(Ce || {}), Se = ((e) => (e.Manual = "manual", e.Auto = "auto", e.Delay = "delay", e))(Se || {}), ke = ((e) => (e.Toast = "toast", e.Inline = "inline", e))(ke || {}), we = ((e) => (e.Anchor = "anchor", e.Button = "button", e.Entry = "entry", e))(we || {}), xe = ((e) => (e.Modal = "modal", e.Confirm = "confirm", e))(xe || {}), ye = ((e) => (e.Pages = "pages", e.PrevNext = "prev-next", e.PagesPrevNext = "pages-prev-next", e.PagesPrevNextFirstLast = "pages-prev-next-first-last", e.LoadMore = "load-more", e.Infinite = "infinite", e))(ye || {}), Le = ((e) => (e.None = "", e.Incremental = "incremental", e.Decremental = "decremental", e))(Le || {}), Me = ((e) => (e.NotDefined = "", e.Hidden = "hidden", e.Integer = "integer", e.Decimal = "decimal", e.Auto = "auto", e))(Me || {}), Pe = ((e) => (e.Table = "table", e.Item = "item", e.Ul = "ul", e.Ol = "ol", e.Carousel = "carousel", e))(Pe || {}), Te = ((e) => (e[e.Auto = 0] = "Auto", e[e.PreferItem = 1] = "PreferItem", e[e.PreferCustomItem = 2] = "PreferCustomItem", e[e.PreferColumns = 3] = "PreferColumns", e))(Te || {}), x, Ie = (x = class extends oe {
-  constructor(a = {}) {
-    super();
-    i(this, "modelValue", "");
-    i(this, "id", "");
-    i(this, "useSession", !1);
-    i(this, "cacheLifetime", 5);
-    i(this, "contentPad");
-    i(this, "titles");
-    this.feed(a);
-  }
-}, i(x, "lktDefaultValues", ["modelValue", "id", "useSession", "cacheLifetime", "contentPad", "titles"]), x), Ae = ((e) => (e.NotDefined = "", e.ActionIcon = "action-icon", e))(Ae || {}), De = ((e) => (e.Message = "message", e.Button = "button", e))(De || {}), _e = ((e) => (e.Left = "left", e.Center = "center", e.Right = "right", e))(_e || {}), Ee = ((e) => (e.Fixed = "fixed", e.Absolute = "absolute", e))(Ee || {}), Ne = ((e) => (e.Top = "top", e.Bottom = "bottom", e.Center = "center", e.ReferrerCenter = "referrer-center", e))(Ne || {}), Ve = ((e) => (e.Left = "left", e.Right = "right", e.Center = "center", e.LeftCorner = "left-corner", e.RightCorner = "right-corner", e))(Ve || {}), Be = ((e) => (e.None = "", e.Focus = "focus", e.Blur = "blur", e.Always = "always", e))(Be || {}), $e = ((e) => (e.Auto = "auto", e.Local = "local", e.Remote = "remote", e))($e || {}), He = ((e) => (e.Refresh = "refresh", e.Close = "close", e.ReOpen = "reOpen", e.Exec = "exec", e.Open = "open", e))(He || {}), Re = ((e) => (e.Asc = "asc", e.Desc = "desc", e))(Re || {}), ze = ((e) => (e.Create = "create", e.Update = "update", e.Edit = "edit", e.Drop = "drop", e.Sort = "sort", e.SwitchEditMode = "switch-edit-mode", e.InlineEdit = "inline-edit", e.InlineCreate = "inline-create", e.ModalCreate = "modal-create", e.InlineCreateEver = "inline-create-ever", e))(ze || {}), Oe = ((e) => (e.Lazy = "lazy", e.Ever = "ever", e))(Oe || {}), Fe = ((e) => (e.Quick = "quick", e.Full = "full", e))(Fe || {});
-function Ue(e) {
-  let a = new e(), r = {};
-  if (!Array.isArray(e.lktDefaultValues)) throw new Error("lktDefaultValues must be a keys array.");
-  for (let s of e.lktDefaultValues) s in a && (r[s] = a[s]);
-  return r;
-}
-const qe = { class: "lkt-tabs__list" }, je = ["href", "onClick"], Ke = ["innerHTML", "onClick", "href"], Qe = { "data-lkt": "tab" }, Ye = /* @__PURE__ */ D({
-  __name: "LktTabs",
-  props: /* @__PURE__ */ z({
-    modelValue: {},
-    id: {},
-    useSession: { type: Boolean },
-    cacheLifetime: {},
-    contentPad: {},
-    titles: {}
-  }, Ue(Ie)),
-  emits: [
-    "update:modelValue"
-  ],
-  setup(e, { emit: a }) {
-    const { ctx: r } = O(), s = F(), n = e, b = a, u = y("");
-    if (n.useSession) {
-      n.id || console.warn("[LKT Tabs] You're trying to use session provided tabs without the required id. Please, add id attr");
-      let t = te(n.id);
-      t && (u.value = t);
-    }
-    L(() => n.modelValue, (t, o) => {
-      typeof t == "string" && (u.value = t);
-    }), L(u, (t, o) => {
-      b("update:modelValue"), U(() => {
-        r.$forceUpdate();
-      }), n.useSession && ae(r.id, t, n.cacheLifetime);
-    });
-    const f = h(() => [].join(" ")), g = h(() => {
-      let t = [];
-      return n.contentPad && t.push(`padding: ${n.contentPad}`), t.join(";");
-    }), p = h(() => {
-      let t = [];
-      for (let o in s) o.indexOf("tab-") !== -1 && t.push(o);
-      return t;
-    }), E = h(() => {
-      let t = [];
-      for (let o in s) o.indexOf("title-") !== -1 && t.push(o);
-      return t;
-    }), N = h(() => {
-      let t = [];
-      for (let o in s) o.indexOf("li-") !== -1 && t.push(o);
-      return t;
-    }), C = h(() => {
-      let t = {};
-      for (let o in r.$refs)
-        t[o] = r.$refs[o].hash;
-      return t;
-    }), V = h(() => Object.keys(p.value).length > 1), M = (t = "") => C.value.length > 0 && C.value[t] ? "#" + C.value[t] : "#", P = (t = "") => n.titles && n.titles[t] ? n.titles[t] : t, B = () => {
-      r.$forceUpdate();
-    };
-    for (let t in p.value)
-      u.value === "" && (u.value = t);
-    return (t, o) => (d(), m("div", {
-      class: T(["lkt-tabs", f.value])
-    }, [
-      q(I("ul", qe, [
-        (d(!0), m(k, null, w(p.value, (l) => (d(), m("li", {
-          key: l,
-          class: T(["lkt-tab", { "is-active": l === u.value }]),
-          role: "presentation"
-        }, [
-          E.value.includes(l) ? (d(), m("a", {
-            key: 0,
-            href: M(l),
-            onClick: A((S) => u.value = l, ["prevent"]),
-            role: "tab"
-          }, [
-            v(t.$slots, "title-" + l)
-          ], 8, je)) : (d(), m("a", {
-            key: 1,
-            innerHTML: P(l),
-            onClick: A((S) => u.value = l, ["prevent"]),
-            href: M(l),
-            role: "tab"
-          }, null, 8, Ke))
-        ], 2))), 128)),
-        (d(!0), m(k, null, w(N.value, (l, S) => (d(), m("li", Qe, [
-          v(t.$slots, "li-" + S)
-        ]))), 256))
-      ], 512), [
-        [j, V.value]
-      ]),
-      I("div", {
-        class: "lkt-tabs__content",
-        style: K(g.value)
-      }, [
-        (d(!0), m(k, null, w(p.value, (l) => (d(), Q(ee, {
-          ref_for: !0,
-          ref: l,
-          hash: l,
-          id: l,
-          name: P(l),
-          "active-hash": u.value,
-          onIsActive: B
-        }, {
-          default: Y(() => [
-            v(t.$slots, "tab-" + l)
-          ]),
-          _: 2
-        }, 1032, ["hash", "id", "name", "active-hash"]))), 256))
-      ], 4)
-    ], 2));
-  }
-}), Xe = {
-  install: (e, a) => {
-    e.component("lkt-tabs", Ye);
-  }
-};
-export {
-  Xe as default
-};

package/dist/lkt-tabs.umd.js

@@ -1 +0,0 @@
-(function(t,s){typeof exports=="object"&&typeof module<"u"?module.exports=s(require("vue"),require("lkt-session")):typeof define=="function"&&define.amd?define(["vue","lkt-session"],s):(t=typeof globalThis<"u"?globalThis:t||self,t.LktTabs=s(t.Vue,t.LktSession))})(this,function(t,s){"use strict";var ye=Object.defineProperty;var Be=(t,s,p)=>s in t?ye(t,s,{enumerable:!0,configurable:!0,writable:!0,value:p}):t[s]=p;var d=(t,s,p)=>Be(t,typeof s!="symbol"?s+"":s,p);var u,k;function p(e=10){let n="",r="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",c=r.length;for(let o=0;o<e;o++)n+=r.charAt(Math.floor(Math.random()*c));return n}function L(e){return typeof e=="string"}const y=["id"],B=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(e,{emit:n}){const r=e,c=n,o=t.ref(!1),b=t.ref(p(8)),m=t.computed(()=>r.id?r.id:L(r.name)&&r.name.length>0?r.name.toLowerCase().replace(/ /g,"-"):b.value),f=()=>{o.value=r.activeHash===r.hash,c("is-active",o.value)};return t.watch(()=>r.activeHash,f),f(),(g,h)=>o.value?(t.openBlock(),t.createElementBlock("section",{key:0,"data-lkt":"tab-content",id:m.value,role:"tabpanel"},[t.renderSlot(g.$slots,"default")],8,y)):t.createCommentVNode("",!0)}}),v=e=>`lkt-tabs.${window.location.host}${window.location.pathname}.${e}`,E=e=>s.getSessionStorage(v(e)),T=(e,n,r)=>{s.setSessionStorage(v(e),n,r*60)};var M=(e=>(e.Button="button",e.Submit="submit",e.Reset="reset",e.Anchor="anchor",e.Content="content",e.Switch="switch",e.HiddenSwitch="hidden-switch",e.Split="split",e.SplitLazy="split-lazy",e.SplitEver="split-ever",e.Tooltip="tooltip",e.TooltipLazy="tooltip-lazy",e.TooltipEver="tooltip-ever",e.FileUpload="file-upload",e.ImageUpload="image-upload",e))(M||{}),P=(e=>(e.Text="text",e.Email="email",e.Tel="tel",e.Password="password",e.Search="search",e.Number="number",e.Color="color",e.Range="range",e.Textarea="textarea",e.Html="html",e.Date="date",e.File="file",e.Image="image",e.Select="select",e.Check="check",e.Switch="switch",e.Calc="calc",e.Card="card",e.Elements="elements",e))(P||{}),I=["lktDateProps","lktStrictItem","lktExcludedProps"],A=(u=class{constructor(n){}feed(n={},r=this){if(typeof n=="object")for(let[c,o]of Object.entries(n))r.assignProp(c,o)}assignProp(n,r){if(!(I.includes(n)||u.lktExcludedProps.includes(n))){if(u.lktDateProps.includes(n)){this[n]=new Date(r);return}this[n]=r}}},d(u,"lktAllowUndefinedProps",[]),d(u,"lktExcludedProps",[]),d(u,"lktDateProps",[]),d(u,"lktStrictItem",!1),d(u,"lktDefaultValues",[]),u),D=(e=>(e.Auto="auto",e.Always="always",e.Lazy="lazy",e.Ever="ever",e))(D||{}),_=(e=>(e.Transform="transform",e.Height="height",e.Display="display",e))(_||{}),V=(e=>(e.Href="href",e.RouterLink="router-link",e.RouterLinkBack="router-link-back",e.Mail="mail",e.Tel="tel",e.Tab="tab",e.Download="download",e.Action="action",e.Legacy="",e))(V||{}),N=(e=>(e.None="",e.Field="field",e.Button="button",e.Anchor="anchor",e))(N||{}),$=(e=>(e.List="list",e.Inline="inline",e.Count="count",e))($||{}),H=(e=>(e.MinStringLength="min-str",e.MinNumber="min-num",e.MaxStringLength="max-str",e.MaxNumber="max-num",e.Email="email",e.Empty="empty",e.EqualTo="equal-to",e.MinNumbers="min-numbers",e.MaxNumbers="max-numbers",e.MinChars="min-chars",e.MaxChars="max-chars",e.MinUpperChars="min-upper-chars",e.MaxUpperChars="max-upper-chars",e.MinLowerChars="min-lower-chars",e.MaxLowerChars="max-lower-chars",e.MinSpecialChars="min-special-chars",e.MaxSpecialChars="max-special-chars",e))(H||{}),z=(e=>(e.Ok="ok",e.Ko="ko",e.Info="info",e))(z||{}),F=(e=>(e.NotDefined="",e.Button="button",e))(F||{}),R=(e=>(e.Start="start",e.End="end",e))(R||{}),O=(e=>(e.Create="create",e.Update="update",e.Read="read",e))(O||{}),U=(e=>(e.Inline="inline",e.Modal="modal",e))(U||{}),q=(e=>(e.Top="top",e.Bottom="bottom",e))(q||{}),j=(e=>(e.Changed="changed",e.Always="always",e.Never="never",e))(j||{}),K=(e=>(e.Manual="manual",e.Auto="auto",e.Delay="delay",e))(K||{}),Q=(e=>(e.Toast="toast",e.Inline="inline",e))(Q||{}),Y=(e=>(e.Anchor="anchor",e.Button="button",e.Entry="entry",e))(Y||{}),G=(e=>(e.Modal="modal",e.Confirm="confirm",e))(G||{}),J=(e=>(e.Pages="pages",e.PrevNext="prev-next",e.PagesPrevNext="pages-prev-next",e.PagesPrevNextFirstLast="pages-prev-next-first-last",e.LoadMore="load-more",e.Infinite="infinite",e))(J||{}),W=(e=>(e.None="",e.Incremental="incremental",e.Decremental="decremental",e))(W||{}),X=(e=>(e.NotDefined="",e.Hidden="hidden",e.Integer="integer",e.Decimal="decimal",e.Auto="auto",e))(X||{}),Z=(e=>(e.Table="table",e.Item="item",e.Ul="ul",e.Ol="ol",e.Carousel="carousel",e))(Z||{}),ee=(e=>(e[e.Auto=0]="Auto",e[e.PreferItem=1]="PreferItem",e[e.PreferCustomItem=2]="PreferCustomItem",e[e.PreferColumns=3]="PreferColumns",e))(ee||{}),te=(k=class extends A{constructor(n={}){super();d(this,"modelValue","");d(this,"id","");d(this,"useSession",!1);d(this,"cacheLifetime",5);d(this,"contentPad");d(this,"titles");this.feed(n)}},d(k,"lktDefaultValues",["modelValue","id","useSession","cacheLifetime","contentPad","titles"]),k),ae=(e=>(e.NotDefined="",e.ActionIcon="action-icon",e))(ae||{}),re=(e=>(e.Message="message",e.Button="button",e))(re||{}),ne=(e=>(e.Left="left",e.Center="center",e.Right="right",e))(ne||{}),oe=(e=>(e.Fixed="fixed",e.Absolute="absolute",e))(oe||{}),le=(e=>(e.Top="top",e.Bottom="bottom",e.Center="center",e.ReferrerCenter="referrer-center",e))(le||{}),se=(e=>(e.Left="left",e.Right="right",e.Center="center",e.LeftCorner="left-corner",e.RightCorner="right-corner",e))(se||{}),ie=(e=>(e.None="",e.Focus="focus",e.Blur="blur",e.Always="always",e))(ie||{}),ce=(e=>(e.Auto="auto",e.Local="local",e.Remote="remote",e))(ce||{}),de=(e=>(e.Refresh="refresh",e.Close="close",e.ReOpen="reOpen",e.Exec="exec",e.Open="open",e))(de||{}),ue=(e=>(e.Asc="asc",e.Desc="desc",e))(ue||{}),me=(e=>(e.Create="create",e.Update="update",e.Edit="edit",e.Drop="drop",e.Sort="sort",e.SwitchEditMode="switch-edit-mode",e.InlineEdit="inline-edit",e.InlineCreate="inline-create",e.ModalCreate="modal-create",e.InlineCreateEver="inline-create-ever",e))(me||{}),pe=(e=>(e.Lazy="lazy",e.Ever="ever",e))(pe||{}),he=(e=>(e.Quick="quick",e.Full="full",e))(he||{});function fe(e){let n=new e,r={};if(!Array.isArray(e.lktDefaultValues))throw new Error("lktDefaultValues must be a keys array.");for(let c of e.lktDefaultValues)c in n&&(r[c]=n[c]);return r}const ke={class:"lkt-tabs__list"},be=["href","onClick"],ge=["innerHTML","onClick","href"],Ce={"data-lkt":"tab"},Se=t.defineComponent({__name:"LktTabs",props:t.mergeDefaults({modelValue:{},id:{},useSession:{type:Boolean},cacheLifetime:{},contentPad:{},titles:{}},fe(te)),emits:["update:modelValue"],setup(e,{emit:n}){const{ctx:r}=t.getCurrentInstance(),c=t.useSlots(),o=e,b=n,m=t.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 a=E(o.id);a&&(m.value=a)}t.watch(()=>o.modelValue,(a,i)=>{typeof a=="string"&&(m.value=a)}),t.watch(m,(a,i)=>{b("update:modelValue"),t.nextTick(()=>{r.$forceUpdate()}),o.useSession&&T(r.id,a,o.cacheLifetime)});const f=t.computed(()=>[].join(" ")),g=t.computed(()=>{let a=[];return o.contentPad&&a.push(`padding: ${o.contentPad}`),a.join(";")}),h=t.computed(()=>{let a=[];for(let i in c)i.indexOf("tab-")!==-1&&a.push(i);return a}),ve=t.computed(()=>{let a=[];for(let i in c)i.indexOf("title-")!==-1&&a.push(i);return a}),we=t.computed(()=>{let a=[];for(let i in c)i.indexOf("li-")!==-1&&a.push(i);return a}),C=t.computed(()=>{let a={};for(let i in r.$refs)a[i]=r.$refs[i].hash;return a}),xe=t.computed(()=>Object.keys(h.value).length>1),w=(a="")=>C.value.length>0&&C.value[a]?"#"+C.value[a]:"#",x=(a="")=>o.titles&&o.titles[a]?o.titles[a]:a,Le=()=>{r.$forceUpdate()};for(let a in h.value)m.value===""&&(m.value=a);return(a,i)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["lkt-tabs",f.value])},[t.withDirectives(t.createElementVNode("ul",ke,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(h.value,l=>(t.openBlock(),t.createElementBlock("li",{key:l,class:t.normalizeClass(["lkt-tab",{"is-active":l===m.value}]),role:"presentation"},[ve.value.includes(l)?(t.openBlock(),t.createElementBlock("a",{key:0,href:w(l),onClick:t.withModifiers(S=>m.value=l,["prevent"]),role:"tab"},[t.renderSlot(a.$slots,"title-"+l)],8,be)):(t.openBlock(),t.createElementBlock("a",{key:1,innerHTML:x(l),onClick:t.withModifiers(S=>m.value=l,["prevent"]),href:w(l),role:"tab"},null,8,ge))],2))),128)),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(we.value,(l,S)=>(t.openBlock(),t.createElementBlock("li",Ce,[t.renderSlot(a.$slots,"li-"+S)]))),256))],512),[[t.vShow,xe.value]]),t.createElementVNode("div",{class:"lkt-tabs__content",style:t.normalizeStyle(g.value)},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(h.value,l=>(t.openBlock(),t.createBlock(B,{ref_for:!0,ref:l,hash:l,id:l,name:x(l),"active-hash":m.value,onIsActive:Le},{default:t.withCtx(()=>[t.renderSlot(a.$slots,"tab-"+l)]),_:2},1032,["hash","id","name","active-hash"]))),256))],4)],2))}});return{install:(e,n)=>{e.component("lkt-tabs",Se)}}});

package/dist/src/components/LktTab.vue.d.ts

@@ -1,121 +0,0 @@
-declare const isActive: import("vue").Ref<boolean, boolean>;
-declare const computedId: import("vue").ComputedRef<string>;
-declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
-declare var __VLS_1: {};
-type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
-    default?: (props: typeof __VLS_1) => any;
-}>;
-declare const __VLS_self: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    id: {
-        type: StringConstructor;
-        default: string;
-    };
-    name: {
-        type: StringConstructor;
-        required: true;
-    };
-    hash: {
-        type: StringConstructor;
-        default: string;
-    };
-    activeHash: {
-        type: StringConstructor;
-        default: string;
-    };
-    isDisabled: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>, {
-    isActive: typeof isActive;
-    computedId: typeof computedId;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "is-active": (...args: any[]) => void;
-}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    id: {
-        type: StringConstructor;
-        default: string;
-    };
-    name: {
-        type: StringConstructor;
-        required: true;
-    };
-    hash: {
-        type: StringConstructor;
-        default: string;
-    };
-    activeHash: {
-        type: StringConstructor;
-        default: string;
-    };
-    isDisabled: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>> & Readonly<{
-    "onIs-active"?: ((...args: any[]) => any) | undefined;
-}>, {
-    id: string;
-    hash: string;
-    activeHash: string;
-    isDisabled: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    id: {
-        type: StringConstructor;
-        default: string;
-    };
-    name: {
-        type: StringConstructor;
-        required: true;
-    };
-    hash: {
-        type: StringConstructor;
-        default: string;
-    };
-    activeHash: {
-        type: StringConstructor;
-        default: string;
-    };
-    isDisabled: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "is-active": (...args: any[]) => void;
-}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    id: {
-        type: StringConstructor;
-        default: string;
-    };
-    name: {
-        type: StringConstructor;
-        required: true;
-    };
-    hash: {
-        type: StringConstructor;
-        default: string;
-    };
-    activeHash: {
-        type: StringConstructor;
-        default: string;
-    };
-    isDisabled: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>> & Readonly<{
-    "onIs-active"?: ((...args: any[]) => any) | undefined;
-}>, {
-    id: string;
-    hash: string;
-    activeHash: string;
-    isDisabled: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
-export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/dist/src/lib-components/LktTabs.vue.d.ts

@@ -1,64 +0,0 @@
-import LktTab from "../components/LktTab.vue";
-import { LktObject, TabsConfig } from "lkt-vue-kernel";
-declare const Value: import("vue").Ref<string, string>;
-declare const classes: import("vue").ComputedRef<string>;
-declare const contentStyles: import("vue").ComputedRef<string>;
-declare const tabsSlots: import("vue").ComputedRef<string[]>;
-declare const titlesSlots: import("vue").ComputedRef<string[]>;
-declare const liSlots: import("vue").ComputedRef<string[]>;
-declare const displayButtons: import("vue").ComputedRef<boolean>;
-declare const getTabHref: (key?: string | number) => string;
-declare const getTabTitle: (key?: string | number) => any;
-declare const refresh: () => void;
-declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
-declare var __VLS_2: string, __VLS_3: {}, __VLS_6: string, __VLS_7: {}, __VLS_17: string, __VLS_18: {};
-type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
-    [K in NonNullable<typeof __VLS_2>]?: (props: typeof __VLS_3) => any;
-} & {
-    [K in NonNullable<typeof __VLS_6>]?: (props: typeof __VLS_7) => any;
-} & {
-    [K in NonNullable<typeof __VLS_17>]?: (props: typeof __VLS_18) => any;
-}>;
-declare const __VLS_self: import("vue").DefineComponent<TabsConfig, {
-    LktTab: typeof LktTab;
-    Value: typeof Value;
-    classes: typeof classes;
-    contentStyles: typeof contentStyles;
-    tabsSlots: typeof tabsSlots;
-    titlesSlots: typeof titlesSlots;
-    liSlots: typeof liSlots;
-    displayButtons: typeof displayButtons;
-    getTabHref: typeof getTabHref;
-    getTabTitle: typeof getTabTitle;
-    refresh: typeof refresh;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (...args: any[]) => void;
-}, string, import("vue").PublicProps, Readonly<TabsConfig> & Readonly<{
-    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
-}>, {
-    id: string;
-    modelValue: string | number;
-    useSession: boolean;
-    cacheLifetime: number;
-    contentPad: string;
-    titles: LktObject;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const __VLS_component: import("vue").DefineComponent<TabsConfig, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (...args: any[]) => void;
-}, string, import("vue").PublicProps, Readonly<TabsConfig> & Readonly<{
-    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
-}>, {
-    id: string;
-    modelValue: string | number;
-    useSession: boolean;
-    cacheLifetime: number;
-    contentPad: string;
-    titles: LktObject;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
-export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/dist/vite.config.d.ts

@@ -1,38 +0,0 @@
-declare namespace _default {
-    let plugins: import("vite").Plugin<import("@vitejs/plugin-vue").Api>[];
-    namespace resolve {
-        let alias: {
-            '@': string;
-            '@test': string;
-        };
-    }
-    namespace build {
-        export namespace lib {
-            let entry: string;
-            let name: string;
-            function fileName(format: any): string;
-        }
-        export { outDir };
-        export let minify: boolean;
-        export namespace rollupOptions {
-            let external: string[];
-            namespace output {
-                let globals: {
-                    vue: string;
-                    "lkt-tools": string;
-                    "lkt-events": string;
-                    "lkt-session": string;
-                };
-                let sourcemapExcludeSources: boolean;
-            }
-        }
-    }
-    namespace test {
-        namespace coverage {
-            let reporter: string[];
-        }
-        function resolveSnapshotPath(testPath: any, snapExtension: any): string;
-    }
-}
-export default _default;
-declare const outDir: string;

package/src/index.ts

@@ -1,12 +0,0 @@
-/* eslint-disable import/prefer-default-export */
-import {default as tabs} from "./lib-components/LktTabs.vue";
-import {App} from "vue";
-import "../style.css";
-
-const LktTabs = {
-    install: (app: App, options: any) => {
-        app.component('lkt-tabs', tabs);
-    },
-};
-
-export default LktTabs;