@shjjs/visual-ui 1.0.23 → 1.0.24

package/es/components/interaction/tabs/index.vue.mjs

@@ -0,0 +1,88 @@
+import { defineComponent as k, ref as i, onMounted as E, createElementBlock as a, openBlock as c, normalizeStyle as u, unref as v, createCommentVNode as h, Fragment as O, renderList as w, withModifiers as L, normalizeClass as V, createVNode as B, nextTick as D } from "vue";
+import { useResizeObserver as N } from "@vueuse/core";
+import { useTabsWatch as T } from "./hooks/useTabsWatch.mjs";
+import { SHJDatasourceV2 as W } from "../../../commons/plugins/datasource/index.mjs";
+import { SHJParseEvent as H } from "../../../commons/plugins/event/index.mjs";
+import { Utils as f } from "../../../commons/utils/utils.mjs";
+import I from "../../../commons/components/text.vue.mjs";
+const J = ["onClick"], M = k({ name: "shj-tabs" }), K = /* @__PURE__ */ k({
+  ...M,
+  props: {
+    option: {},
+    sources: {},
+    useEvents: {},
+    uuid: {}
+  },
+  emits: ["on-change"],
+  setup(x, { expose: g, emit: y }) {
+    const e = x, _ = y, l = i([]), o = i(e.option.value), r = () => {
+      W.parse({
+        tId: e.uuid,
+        sources: e.sources,
+        callback: ({ data: t }) => {
+          if (!t) {
+            l.value = [];
+            return;
+          }
+          l.value = t[0].data, !o.value && l.value.length > 0 && (o.value = l.value[0].value), b();
+        }
+      });
+    };
+    E(() => r());
+    const C = (t) => {
+      t.value !== o.value && (_("on-change", { data: t.label }), H.parseEvents(e.useEvents, "on-change", { data: t.label })), o.value = t.value;
+    };
+    T(e, r, o, l), g({
+      refresh: () => r(),
+      refreshView: () => {
+      },
+      // 刷新视图 无需刷新
+      refreshData: () => r()
+    });
+    const s = i(null), d = 150, p = i(!1), b = () => {
+      D(() => {
+        if (s.value) {
+          const { scrollWidth: t, clientWidth: m } = s.value;
+          p.value = t > m;
+        }
+      });
+    }, j = () => {
+      s.value && (s.value.scrollLeft -= d);
+    }, S = () => {
+      s.value && (s.value.scrollLeft += d);
+    };
+    return N(s, (t) => b()), (t, m) => (c(), a("div", {
+      ref_key: "tabsContainer",
+      ref: s,
+      class: "height-100 flex overflow-hidden scroll-behavior-smooth",
+      style: u(v(f).json2cssObject(e.option.css.tab))
+    }, [
+      p.value ? (c(), a("button", {
+        key: 0,
+        class: "flex-none cursor-pointer position-absolute translate-center-left-active-scale-095 top-50 background-size-cover",
+        style: u(v(f).json2cssObject(e.option.css.nav.left)),
+        onClick: j
+      }, null, 4)) : h("", !0),
+      (c(!0), a(O, null, w(l.value, (n, z) => (c(), a("div", {
+        key: z,
+        class: V(["flex flex-none cursor-pointer transition-color-background-color background-size-cover", { selected: n.value === o.value }]),
+        style: u(v(f).json2cssObject(n.value === o.value ? e.option.css.item.selected : e.option.css.item)),
+        onClick: L((R) => C(n), ["stop"])
+      }, [
+        B(I, {
+          "text-style": n.value === o.value ? e.option.css.item.selected.textStyle : e.option.css.item.textStyle,
+          text: n.label
+        }, null, 8, ["text-style", "text"])
+      ], 14, J))), 128)),
+      p.value ? (c(), a("button", {
+        key: 1,
+        class: "flex-none cursor-pointer position-absolute translate-center-right-active-scale-095 top-50 background-size-cover",
+        style: u(v(f).json2cssObject(e.option.css.nav.right)),
+        onClick: S
+      }, null, 4)) : h("", !0)
+    ], 4));
+  }
+});
+export {
+  K as default
+};

package/es/components/interaction/tabs/index.vue2.mjs

@@ -0,0 +1,4 @@
+import f from "./index.vue.mjs";
+export {
+  f as default
+};

package/es/components/interaction/tabs/templates/basic/index.d.ts

@@ -0,0 +1,52 @@
+export declare const ZvInteractionTabs: import("../../../../../commons/utils/typescript").SFCWithInstall<import("vue").DefineComponent<{
+    basicOption: {
+        type: any;
+        required: true;
+    };
+    useEvents: {
+        type: ArrayConstructor;
+        required: true;
+    };
+}, {
+    baseTemplate: import("vue").DefineComponent<{
+        basicOption: {
+            type: ObjectConstructor;
+            required: true;
+        };
+        useEvents: {
+            type: ArrayConstructor;
+            required: true;
+        };
+    }, {
+        emit: (event: "on-change" | "on-click-item", ...args: any[]) => void;
+        props: any;
+        tabList: import("vue").Ref<any[]>;
+        handleEvent: (item: any) => void;
+        readonly Utils: typeof import("../../../../../commons/utils/utils").Utils;
+    }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("on-change" | "on-click-item")[], "on-change" | "on-click-item", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+        basicOption: {
+            type: ObjectConstructor;
+            required: true;
+        };
+        useEvents: {
+            type: ArrayConstructor;
+            required: true;
+        };
+    }>> & {
+        "onOn-change"?: (...args: any[]) => any;
+        "onOn-click-item"?: (...args: any[]) => any;
+    }, {}, {}>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("on-change" | "on-click-item")[], "on-change" | "on-click-item", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    basicOption: {
+        type: any;
+        required: true;
+    };
+    useEvents: {
+        type: ArrayConstructor;
+        required: true;
+    };
+}>> & {
+    "onOn-change"?: (...args: any[]) => any;
+    "onOn-click-item"?: (...args: any[]) => any;
+}, {}, {}>> & Record<string, any>;
+export default ZvInteractionTabs;

package/es/components/interaction/tabs/templates/basic/index.mjs

@@ -0,0 +1,7 @@
+import t from "./index.vue.mjs";
+import { withInstall as o } from "../../../../../commons/utils/install.mjs";
+const i = o(t);
+export {
+  i as ZvInteractionTabs,
+  i as default
+};

package/es/components/interaction/tabs/templates/basic/index.vue.d.ts

@@ -0,0 +1,52 @@
+declare const _sfc_main: import("vue").DefineComponent<{
+    basicOption: {
+        type: any;
+        required: true;
+    };
+    useEvents: {
+        type: ArrayConstructor;
+        required: true;
+    };
+}, {
+    baseTemplate: import("vue").DefineComponent<{
+        basicOption: {
+            type: ObjectConstructor;
+            required: true;
+        };
+        useEvents: {
+            type: ArrayConstructor;
+            required: true;
+        };
+    }, {
+        emit: (event: "on-change" | "on-click-item", ...args: any[]) => void;
+        props: any;
+        tabList: import("vue").Ref<any[]>;
+        handleEvent: (item: any) => void;
+        readonly Utils: typeof import("../../../../../commons/utils/utils").Utils;
+    }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("on-change" | "on-click-item")[], "on-change" | "on-click-item", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+        basicOption: {
+            type: ObjectConstructor;
+            required: true;
+        };
+        useEvents: {
+            type: ArrayConstructor;
+            required: true;
+        };
+    }>> & {
+        "onOn-change"?: (...args: any[]) => any;
+        "onOn-click-item"?: (...args: any[]) => any;
+    }, {}, {}>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("on-change" | "on-click-item")[], "on-change" | "on-click-item", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    basicOption: {
+        type: any;
+        required: true;
+    };
+    useEvents: {
+        type: ArrayConstructor;
+        required: true;
+    };
+}>> & {
+    "onOn-change"?: (...args: any[]) => any;
+    "onOn-click-item"?: (...args: any[]) => any;
+}, {}, {}>;
+export default _sfc_main;

package/es/components/interaction/tabs/templates/basic/index.vue.mjs

@@ -0,0 +1,19 @@
+import { defineComponent as t, createBlock as i, openBlock as r, mergeProps as m } from "vue";
+import p from "../../base.vue.mjs";
+const s = t({ name: "zv-interaction-tabs" }), u = /* @__PURE__ */ t({
+  ...s,
+  props: {
+    basicOption: {},
+    useEvents: {}
+  },
+  emits: ["on-click-item", "on-change"],
+  setup(a) {
+    return (n, e) => (r(), i(p, m(n.$props, {
+      onOnClickItem: e[0] || (e[0] = (o) => n.$emit("on-click-item", o)),
+      onOnChange: e[1] || (e[1] = (o) => n.$emit("on-change", o))
+    }), null, 16));
+  }
+});
+export {
+  u as default
+};

package/es/components/interaction/tabs/templates/basic/index.vue2.mjs

@@ -0,0 +1,4 @@
+import f from "./index.vue.mjs";
+export {
+  f as default
+};

package/es/components/interaction/tabs/templates/v2/index.d.ts

@@ -0,0 +1,52 @@
+export declare const ZvInteractionTabs2: import("../../../../../commons/utils/typescript").SFCWithInstall<import("vue").DefineComponent<{
+    basicOption: {
+        type: any;
+        required: true;
+    };
+    useEvents: {
+        type: ArrayConstructor;
+        required: true;
+    };
+}, {
+    baseTemplate: import("vue").DefineComponent<{
+        basicOption: {
+            type: ObjectConstructor;
+            required: true;
+        };
+        useEvents: {
+            type: ArrayConstructor;
+            required: true;
+        };
+    }, {
+        emit: (event: "on-change" | "on-click-item", ...args: any[]) => void;
+        props: any;
+        tabList: import("vue").Ref<any[]>;
+        handleEvent: (item: any) => void;
+        readonly Utils: typeof import("../../../../../commons/utils/utils").Utils;
+    }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("on-change" | "on-click-item")[], "on-change" | "on-click-item", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+        basicOption: {
+            type: ObjectConstructor;
+            required: true;
+        };
+        useEvents: {
+            type: ArrayConstructor;
+            required: true;
+        };
+    }>> & {
+        "onOn-change"?: (...args: any[]) => any;
+        "onOn-click-item"?: (...args: any[]) => any;
+    }, {}, {}>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("on-change" | "on-click-item")[], "on-change" | "on-click-item", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    basicOption: {
+        type: any;
+        required: true;
+    };
+    useEvents: {
+        type: ArrayConstructor;
+        required: true;
+    };
+}>> & {
+    "onOn-change"?: (...args: any[]) => any;
+    "onOn-click-item"?: (...args: any[]) => any;
+}, {}, {}>> & Record<string, any>;
+export default ZvInteractionTabs2;

package/es/components/interaction/tabs/templates/v2/index.mjs

@@ -0,0 +1,7 @@
+import t from "./index.vue.mjs";
+import { withInstall as o } from "../../../../../commons/utils/install.mjs";
+const i = o(t);
+export {
+  i as ZvInteractionTabs2,
+  i as default
+};

package/es/components/interaction/tabs/templates/v2/index.vue.d.ts

@@ -0,0 +1,52 @@
+declare const _sfc_main: import("vue").DefineComponent<{
+    basicOption: {
+        type: any;
+        required: true;
+    };
+    useEvents: {
+        type: ArrayConstructor;
+        required: true;
+    };
+}, {
+    baseTemplate: import("vue").DefineComponent<{
+        basicOption: {
+            type: ObjectConstructor;
+            required: true;
+        };
+        useEvents: {
+            type: ArrayConstructor;
+            required: true;
+        };
+    }, {
+        emit: (event: "on-change" | "on-click-item", ...args: any[]) => void;
+        props: any;
+        tabList: import("vue").Ref<any[]>;
+        handleEvent: (item: any) => void;
+        readonly Utils: typeof import("../../../../../commons/utils/utils").Utils;
+    }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("on-change" | "on-click-item")[], "on-change" | "on-click-item", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+        basicOption: {
+            type: ObjectConstructor;
+            required: true;
+        };
+        useEvents: {
+            type: ArrayConstructor;
+            required: true;
+        };
+    }>> & {
+        "onOn-change"?: (...args: any[]) => any;
+        "onOn-click-item"?: (...args: any[]) => any;
+    }, {}, {}>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("on-change" | "on-click-item")[], "on-change" | "on-click-item", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    basicOption: {
+        type: any;
+        required: true;
+    };
+    useEvents: {
+        type: ArrayConstructor;
+        required: true;
+    };
+}>> & {
+    "onOn-change"?: (...args: any[]) => any;
+    "onOn-click-item"?: (...args: any[]) => any;
+}, {}, {}>;
+export default _sfc_main;

package/es/components/interaction/tabs/templates/v2/index.vue.mjs

@@ -0,0 +1,19 @@
+import { defineComponent as t, createBlock as i, openBlock as r, mergeProps as m } from "vue";
+import p from "../../base.vue.mjs";
+const s = t({ name: "zv-interaction-tabs2" }), u = /* @__PURE__ */ t({
+  ...s,
+  props: {
+    basicOption: {},
+    useEvents: {}
+  },
+  emits: ["on-click-item", "on-change"],
+  setup(a) {
+    return (n, e) => (r(), i(p, m(n.$props, {
+      onOnClickItem: e[0] || (e[0] = (o) => n.$emit("on-click-item", o)),
+      onOnChange: e[1] || (e[1] = (o) => n.$emit("on-change", o))
+    }), null, 16));
+  }
+});
+export {
+  u as default
+};

package/es/components/interaction/tabs/templates/v2/index.vue2.mjs

@@ -0,0 +1,4 @@
+import f from "./index.vue.mjs";
+export {
+  f as default
+};

package/es/components/interaction/tabs/types.d.ts

@@ -0,0 +1,16 @@
+import type { IFlex } from '../../../commons/types/flex';
+import type { IBaseSize, IBaseSizeTextStyle } from '../../../commons/types/base';
+export interface ITabsOption {
+    css: {
+        tab: IFlex;
+        item: IBaseSizeTextStyle & {
+            selected: IBaseSizeTextStyle;
+        };
+        nav: {
+            left: IBaseSize;
+            right: IBaseSize;
+        };
+    };
+    value: string;
+    version: string;
+}

package/es/components/interaction-input/index.d.ts

@@ -22,14 +22,7 @@ export declare const ZvInteractionInput: import("../../commons/utils/typescript"
         key: import("vue").Ref<string>;
         init: () => void;
         rendererDomStyle: (css: any) => {
-            constructor: Function;
-            toString(): string;
-            toLocaleString(): string;
-            valueOf(): Object;
-            hasOwnProperty(v: PropertyKey): boolean;
-            isPrototypeOf(v: Object): boolean;
-            propertyIsEnumerable(v: PropertyKey): boolean;
-            hasOwn(o: object, v: PropertyKey): boolean;
+            [x: string]: string;
         };
         inputRef: import("vue").Ref<any>;
         inputValue: import("vue").Ref<string>;
@@ -37,14 +30,7 @@ export declare const ZvInteractionInput: import("../../commons/utils/typescript"
     key: import("vue").Ref<string>;
     init: () => void;
     rendererDomStyle: (css: any) => {
-        constructor: Function;
-        toString(): string;
-        toLocaleString(): string;
-        valueOf(): Object;
-        hasOwnProperty(v: PropertyKey): boolean;
-        isPrototypeOf(v: Object): boolean;
-        propertyIsEnumerable(v: PropertyKey): boolean;
-        hasOwn(o: object, v: PropertyKey): boolean;
+        [x: string]: string;
     };
     inputRef: import("vue").Ref<any>;
     inputValue: import("vue").Ref<string>;

package/es/components/interaction-input/index.vue.d.ts

@@ -22,14 +22,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
         key: import("vue").Ref<string>;
         init: () => void;
         rendererDomStyle: (css: any) => {
-            constructor: Function;
-            toString(): string;
-            toLocaleString(): string;
-            valueOf(): Object;
-            hasOwnProperty(v: PropertyKey): boolean;
-            isPrototypeOf(v: Object): boolean;
-            propertyIsEnumerable(v: PropertyKey): boolean;
-            hasOwn(o: object, v: PropertyKey): boolean;
+            [x: string]: string;
         };
         inputRef: import("vue").Ref<any>;
         inputValue: import("vue").Ref<string>;
@@ -37,14 +30,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
     key: import("vue").Ref<string>;
     init: () => void;
     rendererDomStyle: (css: any) => {
-        constructor: Function;
-        toString(): string;
-        toLocaleString(): string;
-        valueOf(): Object;
-        hasOwnProperty(v: PropertyKey): boolean;
-        isPrototypeOf(v: Object): boolean;
-        propertyIsEnumerable(v: PropertyKey): boolean;
-        hasOwn(o: object, v: PropertyKey): boolean;
+        [x: string]: string;
     };
     inputRef: import("vue").Ref<any>;
     inputValue: import("vue").Ref<string>;

package/es/components/interaction-select/index.d.ts

@@ -28,14 +28,6 @@ export declare const ZvInteractionSelect: import("../../commons/utils/typescript
         selectRef: import("vue").Ref<any>;
         rendererSelectInput: (inputCss: any) => {};
         rendererSelectOption: (optionCss: any) => {
-            constructor: Function;
-            toString(): string;
-            toLocaleString(): string;
-            valueOf(): Object;
-            hasOwnProperty(v: PropertyKey): boolean;
-            isPrototypeOf(v: Object): boolean;
-            propertyIsEnumerable(v: PropertyKey): boolean;
-            hasOwn(o: object, v: PropertyKey): boolean;
             padding: string;
         };
         rendererSelectDropdown: (dropdownCss: any) => {
@@ -43,58 +35,21 @@ export declare const ZvInteractionSelect: import("../../commons/utils/typescript
             marginTop: string;
             boxShadow: string;
             padding: string;
-            constructor: Function;
-            toString(): string;
-            toLocaleString(): string;
-            valueOf(): Object;
-            hasOwnProperty(v: PropertyKey): boolean;
-            isPrototypeOf(v: Object): boolean;
-            propertyIsEnumerable(v: PropertyKey): boolean;
-            hasOwn(o: object, v: PropertyKey): boolean;
         } | {
             bottom: string;
             marginBottom: string;
             boxShadow: string;
             padding: string;
-            constructor: Function;
-            toString(): string;
-            toLocaleString(): string;
-            valueOf(): Object;
-            hasOwnProperty(v: PropertyKey): boolean;
-            isPrototypeOf(v: Object): boolean;
-            propertyIsEnumerable(v: PropertyKey): boolean;
-            hasOwn(o: object, v: PropertyKey): boolean;
         };
         rendererSelectSelected: (selectedCss: any) => {
-            constructor: Function;
-            toString(): string;
-            toLocaleString(): string;
-            valueOf(): Object;
-            hasOwnProperty(v: PropertyKey): boolean;
-            isPrototypeOf(v: Object): boolean;
-            propertyIsEnumerable(v: PropertyKey): boolean;
-            hasOwn(o: object, v: PropertyKey): boolean;
+            [x: string]: string;
         };
         rendererSelectPlaceholder: (placeholderCss: any) => {
-            constructor: Function;
-            toString(): string;
-            toLocaleString(): string;
-            valueOf(): Object;
-            hasOwnProperty(v: PropertyKey): boolean;
-            isPrototypeOf(v: Object): boolean;
-            propertyIsEnumerable(v: PropertyKey): boolean;
-            hasOwn(o: object, v: PropertyKey): boolean;
+            [x: string]: string;
         };
         rendererPrefixIcon: (type: string, prefixs: any[]) => any;
         rendererPrefixIconCss: (type: string, prefixs: any[]) => {
-            constructor: Function;
-            toString(): string;
-            toLocaleString(): string;
-            valueOf(): Object;
-            hasOwnProperty(v: PropertyKey): boolean;
-            isPrototypeOf(v: Object): boolean;
-            propertyIsEnumerable(v: PropertyKey): boolean;
-            hasOwn(o: object, v: PropertyKey): boolean;
+            [x: string]: string;
         };
     };
     modelValue: import("vue").Ref<string | number>;
@@ -115,14 +70,6 @@ export declare const ZvInteractionSelect: import("../../commons/utils/typescript
     selectRef: import("vue").Ref<any>;
     rendererSelectInput: (inputCss: any) => {};
     rendererSelectOption: (optionCss: any) => {
-        constructor: Function;
-        toString(): string;
-        toLocaleString(): string;
-        valueOf(): Object;
-        hasOwnProperty(v: PropertyKey): boolean;
-        isPrototypeOf(v: Object): boolean;
-        propertyIsEnumerable(v: PropertyKey): boolean;
-        hasOwn(o: object, v: PropertyKey): boolean;
         padding: string;
     };
     rendererSelectDropdown: (dropdownCss: any) => {
@@ -130,58 +77,21 @@ export declare const ZvInteractionSelect: import("../../commons/utils/typescript
         marginTop: string;
         boxShadow: string;
         padding: string;
-        constructor: Function;
-        toString(): string;
-        toLocaleString(): string;
-        valueOf(): Object;
-        hasOwnProperty(v: PropertyKey): boolean;
-        isPrototypeOf(v: Object): boolean;
-        propertyIsEnumerable(v: PropertyKey): boolean;
-        hasOwn(o: object, v: PropertyKey): boolean;
     } | {
         bottom: string;
         marginBottom: string;
         boxShadow: string;
         padding: string;
-        constructor: Function;
-        toString(): string;
-        toLocaleString(): string;
-        valueOf(): Object;
-        hasOwnProperty(v: PropertyKey): boolean;
-        isPrototypeOf(v: Object): boolean;
-        propertyIsEnumerable(v: PropertyKey): boolean;
-        hasOwn(o: object, v: PropertyKey): boolean;
     };
     rendererSelectSelected: (selectedCss: any) => {
-        constructor: Function;
-        toString(): string;
-        toLocaleString(): string;
-        valueOf(): Object;
-        hasOwnProperty(v: PropertyKey): boolean;
-        isPrototypeOf(v: Object): boolean;
-        propertyIsEnumerable(v: PropertyKey): boolean;
-        hasOwn(o: object, v: PropertyKey): boolean;
+        [x: string]: string;
     };
     rendererSelectPlaceholder: (placeholderCss: any) => {
-        constructor: Function;
-        toString(): string;
-        toLocaleString(): string;
-        valueOf(): Object;
-        hasOwnProperty(v: PropertyKey): boolean;
-        isPrototypeOf(v: Object): boolean;
-        propertyIsEnumerable(v: PropertyKey): boolean;
-        hasOwn(o: object, v: PropertyKey): boolean;
+        [x: string]: string;
     };
     rendererPrefixIcon: (type: string, prefixs: any[]) => any;
     rendererPrefixIconCss: (type: string, prefixs: any[]) => {
-        constructor: Function;
-        toString(): string;
-        toLocaleString(): string;
-        valueOf(): Object;
-        hasOwnProperty(v: PropertyKey): boolean;
-        isPrototypeOf(v: Object): boolean;
-        propertyIsEnumerable(v: PropertyKey): boolean;
-        hasOwn(o: object, v: PropertyKey): boolean;
+        [x: string]: string;
     };
     readonly vClickOutSide: {
         beforeMount(el: any, binding: any): void;