eco-vue-js 0.8.35 → 0.8.36

package/dist/components/Modal/WModalStepper.vue.d.ts

@@ -10,6 +10,8 @@ declare function __VLS_template(): {
             slots?: import('vue').VNode[];
             lessTransitions?: boolean;
             initTab?: number;
+            side?: boolean;
+            disableMinHeight?: boolean;
         }> & Readonly<{
             "onUpdate:has-changes"?: ((value: boolean) => any) | undefined;
             "onUpdate:current"?: ((value: number) => any) | undefined;
@@ -39,6 +41,8 @@ declare function __VLS_template(): {
             slots?: import('vue').VNode[];
             lessTransitions?: boolean;
             initTab?: number;
+            side?: boolean;
+            disableMinHeight?: boolean;
         }> & Readonly<{
             "onUpdate:has-changes"?: ((value: boolean) => any) | undefined;
             "onUpdate:current"?: ((value: number) => any) | undefined;

package/dist/components/Modal/WModalStepper.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WModalStepper.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/WModalStepper.vue"],"names":[],"mappings":"AAuNA,iBAAS,cAAc;;uBA6MI,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;WAUhB,OAAO,IAA6B;EAEjD;AAyBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;YAzTX,MAAM,EAAE;cACN,OAAO;eACN,OAAO;mBACH,OAAO;;gBA2BP,IAAI;oBANA,IAAI;;;;;;;;;YAxBf,MAAM,EAAE;cACN,OAAO;eACN,OAAO;mBACH,OAAO;;;;;;;;kFAqUtB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAWpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"WModalStepper.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/WModalStepper.vue"],"names":[],"mappings":"AAuNA,iBAAS,cAAc;;uBA6MI,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;WAUhB,OAAO,IAA6B;EAEjD;AAyBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;YAzTX,MAAM,EAAE;cACN,OAAO;eACN,OAAO;mBACH,OAAO;;gBA2BP,IAAI;oBANA,IAAI;;;;;;;;;YAxBf,MAAM,EAAE;cACN,OAAO;eACN,OAAO;mBACH,OAAO;;;;;;;;kFAqUtB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAWpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/Tabs/WTabs.vue.d.ts

@@ -7,6 +7,8 @@ declare const _default: import('vue').DefineComponent<{
     slots?: VNode[];
     lessTransitions?: boolean;
     initTab?: number;
+    side?: boolean;
+    disableMinHeight?: boolean;
 }, {
     updateIndex: (value: number) => void;
     next: () => void;
@@ -26,6 +28,8 @@ declare const _default: import('vue').DefineComponent<{
     slots?: VNode[];
     lessTransitions?: boolean;
     initTab?: number;
+    side?: boolean;
+    disableMinHeight?: boolean;
 }> & Readonly<{
     "onUpdate:has-changes"?: ((value: boolean) => any) | undefined;
     "onUpdate:current"?: ((value: number) => any) | undefined;

package/dist/components/Tabs/WTabs.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WTabs.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/WTabs.vue"],"names":[],"mappings":"AA4OA,OAAO,EAAkC,KAAK,KAAK,EAAoD,MAAM,KAAK,CAAA;AAElH,OAAO,KAAK,MAAM,6BAA6B,CAAA;;YAOrC,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;gBAC7B,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;YACrC,YAAY,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC;YAC7C,KAAK,EAAE;sBACG,OAAO;cACf,MAAM;;yBAyCU,MAAM;gBAajB,IAAI;oBAIA,IAAI;sBAuBA,MAAM,6GAAqE,UAAU,CAAC,iBAAiB,CAAC,OAAO,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC;wBAIhI,MAAM;;UAAuE,UAAU,CAAC,iBAAiB,CAAC,OAAO,KAAK,CAAC,CAAC,YAAY,CAAC,CAAC;uBAIvI,MAAM,KAAsE,UAAU,CAAC,iBAAiB,CAAC,OAAO,KAAK,CAAC,CAAC,WAAW,CAAC,CAAC;;;;;YA9FpJ,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;gBAC7B,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;YACrC,YAAY,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC;YAC7C,KAAK,EAAE;sBACG,OAAO;cACf,MAAM;;;;;AAoZlB,wBAWG"}
+{"version":3,"file":"WTabs.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/WTabs.vue"],"names":[],"mappings":"AAqQA,OAAO,EAAkC,KAAK,KAAK,EAAoD,MAAM,KAAK,CAAA;AAElH,OAAO,KAAK,MAAM,6BAA6B,CAAA;;YAOrC,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;gBAC7B,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;YACrC,YAAY,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC;YAC7C,KAAK,EAAE;sBACG,OAAO;cACf,MAAM;WACT,OAAO;uBACK,OAAO;;yBAyCA,MAAM;gBAajB,IAAI;oBAIA,IAAI;sBAkCA,MAAM,6GAAqE,UAAU,CAAC,iBAAiB,CAAC,OAAO,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC;wBAIhI,MAAM;;UAAuE,UAAU,CAAC,iBAAiB,CAAC,OAAO,KAAK,CAAC,CAAC,YAAY,CAAC,CAAC;uBAIvI,MAAM,KAAsE,UAAU,CAAC,iBAAiB,CAAC,OAAO,KAAK,CAAC,CAAC,WAAW,CAAC,CAAC;;;;;YA3GpJ,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;gBAC7B,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;YACrC,YAAY,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC;YAC7C,KAAK,EAAE;sBACG,OAAO;cACf,MAAM;WACT,OAAO;uBACK,OAAO;;;;;AAmb5B,wBAWG"}

package/dist/components/Tabs/WTabs.vue.js

@@ -1,16 +1,11 @@
-import { defineComponent, useSlots, computed, ref, reactive, inject, watch, onMounted, onUnmounted, openBlock, createElementBlock, Fragment, renderList, normalizeClass, unref, createElementVNode, createBlock, resolveDynamicComponent, createCommentVNode, createTextVNode, toDisplayString, createVNode, Transition, withCtx, normalizeStyle, TransitionGroup, nextTick } from 'vue';
+import { defineComponent, useSlots, computed, ref, reactive, inject, watch, onMounted, onUnmounted, openBlock, createElementBlock, normalizeClass, Fragment, renderList, unref, createElementVNode, createBlock, resolveDynamicComponent, createCommentVNode, createTextVNode, toDisplayString, createVNode, Transition, withCtx, normalizeStyle, TransitionGroup, nextTick } from 'vue';
 import _sfc_main$1 from './components/TabItem.vue.js';
 import _sfc_main$2 from '../Form/WForm.vue.js';
 import { throttle, debounce } from '../../utils/utils.js';
 import { wTabItemListener, wTabItemUnlistener } from './models/injection.js';
 
-const _hoisted_1 = { class: "mb-8" };
-const _hoisted_2 = {
-  key: 0,
-  class: "relative flex mb-4 overflow-x-auto overscroll-x-contain no-scrollbar snap-x snap-always snap-mandatory"
-};
-const _hoisted_3 = ["onClick"];
-const _hoisted_4 = { class: "relative whitespace-nowrap px-4" };
+const _hoisted_1 = ["onClick"];
+const _hoisted_2 = { class: "relative whitespace-nowrap px-4" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "WTabs",
   props: {
@@ -19,7 +14,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     icons: {},
     slots: {},
     lessTransitions: { type: Boolean },
-    initTab: {}
+    initTab: {},
+    side: { type: Boolean },
+    disableMinHeight: { type: Boolean }
   },
   emits: ["update:current", "update:has-changes"],
   setup(__props, { expose: __expose, emit: __emit }) {
@@ -66,10 +63,21 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       if (!props.names) return;
       const element = button.value[current.value];
       if (!element || !element.offsetWidth) return;
-      indicatorStyle.value = {
-        width: element.offsetWidth + "px",
-        left: element.offsetLeft + "px"
-      };
+      if (props.side) {
+        indicatorStyle.value = {
+          height: element.offsetHeight + "px",
+          top: element.offsetTop + "px",
+          left: "0",
+          width: "0.25rem"
+        };
+      } else {
+        indicatorStyle.value = {
+          width: element.offsetWidth + "px",
+          left: element.offsetLeft + "px",
+          bottom: "0",
+          height: "0.25rem"
+        };
+      }
     };
     const updateHeight = (value) => {
       if (minHeight.value >= value) return;
@@ -111,22 +119,34 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       initModel
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1, [
-        _ctx.names ? (openBlock(), createElementBlock("div", _hoisted_2, [
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["mb-8 grid gap-4", {
+          "grid grid-cols-1": !_ctx.side,
+          "grid grid-cols-[auto,1fr] items-start": _ctx.side
+        }])
+      }, [
+        _ctx.names ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: normalizeClass(["relative flex overflow-x-auto overscroll-x-contain no-scrollbar snap-x snap-always snap-mandatory", {
+            "flex-col": _ctx.side
+          }])
+        }, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(defaultSlots.value, (_, index) => {
             return openBlock(), createElementBlock("button", {
               ref_for: true,
               ref_key: "button",
               ref: button,
               key: index,
-              class: normalizeClass(["flex-1 font-semibold flex items-center justify-center h-10 cursor-pointer snap-center relative w-ripple w-ripple-hover select-none transition-colors duration-500 outline-none", {
+              class: normalizeClass(["flex-1 font-semibold flex items-center cursor-pointer snap-center relative w-ripple w-ripple-hover select-none transition-colors duration-500 outline-none", {
                 "text-description": current.value !== index && isValidMap[index] !== false,
                 "text-primary-default dark:text-primary-dark": current.value === index && isValidMap[index] !== false,
-                "text-negative dark:text-negative-dark": isValidMap[index] === false
+                "text-negative dark:text-negative-dark": isValidMap[index] === false,
+                "h-10 text-center justify-center": !_ctx.side,
+                "py-3 text-start pr-4": _ctx.side
               }]),
               onClick: ($event) => unref(switchTab)(index)
             }, [
-              createElementVNode("div", _hoisted_4, [
+              createElementVNode("div", _hoisted_2, [
                 _ctx.icons?.[index] ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.icons?.[index]), {
                   key: 0,
                   class: "inline -mt-1"
@@ -141,7 +161,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   default: withCtx(() => [
                     hasChangesMap[index] ? (openBlock(), createElementBlock("div", {
                       key: 0,
-                      class: normalizeClass(["absolute top-0 -right-4 square-2 rounded-full transition-colors duration-500", {
+                      class: normalizeClass(["absolute top-0 right-0 square-2 rounded-full transition-colors duration-500", {
                         "bg-info dark:bg-info-dark": isValidMap[index] !== false,
                         "bg-negative dark:bg-negative-dark": isValidMap[index] === false
                       }])
@@ -150,26 +170,27 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   _: 2
                 }, 1024)
               ])
-            ], 10, _hoisted_3);
+            ], 10, _hoisted_1);
           }), 128)),
           createElementVNode("div", {
-            class: normalizeClass(["absolute bottom-0 h-1 rounded-sm duration-500", {
+            class: normalizeClass(["absolute rounded-sm duration-500", {
               "bg-primary-default dark:bg-primary-dark": isValidMap[current.value] !== false,
               "bg-negative dark:bg-negative-dark": isValidMap[current.value] === false,
-              "transition-[left,width,background-color]": indicatorStyle.value !== void 0
+              "transition-[left,width,background-color]": !_ctx.side && indicatorStyle.value !== void 0,
+              "transition-[top,height,background-color]": _ctx.side && indicatorStyle.value !== void 0
             }]),
             style: normalizeStyle(indicatorStyle.value)
           }, null, 6)
-        ])) : createCommentVNode("", true),
+        ], 2)) : createCommentVNode("", true),
         createElementVNode("div", {
           class: "relative transition-[min-height] h-full duration-300",
           style: normalizeStyle({ minHeight: minHeight.value ? minHeight.value + "px" : "auto", "--direction-factor": isDirect.value ? "1" : "-1" })
         }, [
           createVNode(TransitionGroup, {
-            "enter-active-class": "transition-transform duration-[250ms] w-full",
-            "leave-active-class": "transition-transform duration-[250ms] w-full absolute top-0",
-            "enter-from-class": _ctx.lessTransitions ? "opacity-0" : "translate-x-[calc((100%+var(--inner-margin))*var(--direction-factor))]",
-            "leave-to-class": _ctx.lessTransitions ? "opacity-0" : "translate-x-[calc((100%+var(--inner-margin))*var(--direction-factor)*-1)]"
+            "enter-active-class": "transition-[transform,opacity] duration-[250ms] w-full",
+            "leave-active-class": "transition-[transform,opacity] duration-[250ms] w-full absolute top-0",
+            "enter-from-class": _ctx.lessTransitions || _ctx.side ? "opacity-0" : "translate-x-[calc((100%+var(--inner-margin))*var(--direction-factor))]",
+            "leave-to-class": _ctx.lessTransitions || _ctx.side ? "opacity-0" : "translate-x-[calc((100%+var(--inner-margin))*var(--direction-factor)*-1)]"
           }, {
             default: withCtx(() => [
               (openBlock(true), createElementBlock(Fragment, null, renderList(defaultSlots.value, (slot, index) => {
@@ -180,7 +201,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   key: index,
                   "is-active": index === current.value,
                   class: "width-full",
-                  "onUpdate:height": updateHeight
+                  "onUpdate:height": _cache[0] || (_cache[0] = ($event) => !_ctx.disableMinHeight && updateHeight($event))
                 }, {
                   default: withCtx(() => [
                     createVNode(_sfc_main$2, {
@@ -205,7 +226,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             _: 1
           }, 8, ["enter-from-class", "leave-to-class"])
         ], 4)
-      ]);
+      ], 2);
     };
   }
 });

package/package.json

@@ -4,7 +4,7 @@
     "type": "git",
     "url": "https://github.com/rsmple/eco-vue-js.git"
   },
-  "version": "0.8.35",
+  "version": "0.8.36",
   "scripts": {
     "dev": "vite",
     "build": "run-p type-check build-only",