tanxin-ui 0.2.0

package/lib/table/src/table.js

@@ -0,0 +1,410 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+var vue = require("vue");
+var type = require("../../utils/type.js");
+var context = require("./context.js");
+var useConfig = require("../../utils/hooks/useConfig.js");
+var common = require("../../utils/common.js");
+var index = require("../../loading/index.js");
+var tableHeader = require("./table-header.js");
+var tableBody = require("./table-body.js");
+var nanoid = require("nanoid");
+var cloneDeep = require("lodash-es/cloneDeep");
+function _interopDefaultLegacy(e) {
+  return e && typeof e === "object" && "default" in e ? e : { "default": e };
+}
+var cloneDeep__default = /* @__PURE__ */ _interopDefaultLegacy(cloneDeep);
+const tableProps = {
+  size: type.PropTypes.oneOf(["xs", "sm", "md", "lg", "xl"]).def("md"),
+  columns: {
+    type: Array,
+    default: () => []
+  },
+  data: {
+    type: Array,
+    default: () => []
+  },
+  borderX: type.PropTypes.bool.def(false),
+  borderY: type.PropTypes.bool.def(false),
+  borderZ: type.PropTypes.bool.def(false),
+  border: type.PropTypes.bool.def(false),
+  borderAll: type.PropTypes.bool.def(false),
+  striped: type.PropTypes.bool.def(false),
+  loading: type.PropTypes.bool.def(false),
+  width: [String, Number],
+  maxHeight: [String, Number],
+  rowHeight: {
+    type: [String, Number]
+  },
+  fixed: type.PropTypes.bool.def(false),
+  headerFixed: type.PropTypes.bool.def(false),
+  virtualList: type.PropTypes.bool.def(false),
+  hoverLight: type.PropTypes.bool.def(true),
+  focusLight: type.PropTypes.bool.def(true),
+  clickSelect: type.PropTypes.bool.def(false),
+  dblclickSelect: type.PropTypes.bool.def(false),
+  rowKey: type.PropTypes.string.def("__key"),
+  multipleSelect: type.PropTypes.bool.def(false),
+  selectedRowKeys: [String, Number, Array],
+  disableRowKeys: {
+    type: Array,
+    default: () => []
+  },
+  showHeader: type.PropTypes.bool.def(true)
+};
+var Table = vue.defineComponent({
+  name: "TTable",
+  components: {
+    TTableHeader: tableHeader["default"],
+    TTableBody: tableBody["default"],
+    TLoading: index.TLoading
+  },
+  inheritAttrs: false,
+  props: tableProps,
+  emits: ["selectedRowChange", "allSelectedChange", "sortChange"],
+  setup(props, {
+    slots,
+    emit,
+    attrs
+  }) {
+    const {
+      prefixCls
+    } = useConfig.useConfig("table", props);
+    const classes = vue.computed(() => {
+      return [[`${prefixCls.value}`], {
+        [`is-striped`]: props.striped,
+        [`is-hover-light`]: props.hoverLight,
+        [`is-focus-light`]: props.focusLight,
+        [`size-${props.size}`]: props.size
+      }];
+    });
+    const headerTableclasses = vue.computed(() => {
+      return [[`${prefixCls.value}-header`], {
+        [`is-fixed`]: props.headerFixed,
+        [`size-${props.size}`]: props.size
+      }];
+    });
+    const allSelected = vue.ref(false);
+    const selectedRowKeys = vue.ref([]);
+    const refContainer = vue.ref();
+    const refVirtualList = vue.ref();
+    const refTable = vue.ref();
+    const refHeader = vue.ref();
+    const dataList = vue.ref([]);
+    const visibleDataList = vue.ref([]);
+    const containerClasses = vue.computed(() => {
+      return [[`${prefixCls.value}-container`], {
+        [`border-z`]: props.borderZ || props.borderAll || props.border,
+        [`border-x`]: props.borderX || props.borderAll || props.border,
+        [`border-y`]: props.borderY || props.borderAll,
+        [`is-fixed`]: props.headerFixed
+      }];
+    });
+    const originStartIndex = vue.ref(null);
+    const startIndex = vue.ref(0);
+    const endIndex = vue.ref(0);
+    const limit = 10;
+    const defaultRowHeight = {
+      xs: 32,
+      sm: 40,
+      md: 46,
+      lg: 56,
+      xg: 66
+    };
+    const rowHeight = vue.computed(() => {
+      if (props.rowHeight)
+        return common.getLengthNumber(props.rowHeight);
+      return defaultRowHeight[props.size];
+    });
+    const bufferSize = 0;
+    const visibleTotal = vue.ref(null);
+    const currIndex = vue.ref(0);
+    const getIndexRange = (currIndex2 = 0) => {
+      if (originStartIndex.value !== currIndex2) {
+        originStartIndex.value = currIndex2;
+        startIndex.value = Math.max(currIndex2 - bufferSize, 0);
+        endIndex.value = Math.min(currIndex2 + limit + bufferSize, visibleTotal.value - 1);
+      }
+    };
+    const handleScroll = (event) => {
+      const {
+        scrollTop
+      } = event.target;
+      currIndex.value = Math.floor(scrollTop / rowHeight.value);
+      getIndexRange(currIndex.value);
+      getDisplayDataList();
+      let offset = scrollTop - scrollTop % rowHeight.value;
+      if (props.virtualList && !props.headerFixed && currIndex.value >= 1) {
+        offset = offset - rowHeight.value;
+      }
+      refTable.value.style.transform = `translateY(${offset}px)`;
+    };
+    const initSelection = () => {
+      if (!props.selectedRowKeys)
+        return;
+      if (type.isArray(props.selectedRowKeys))
+        selectedRowKeys.value = cloneDeep__default["default"](props.selectedRowKeys);
+      else
+        selectedRowKeys.value.push(props.selectedRowKeys);
+    };
+    vue.onMounted(() => {
+      initSelection();
+      initData();
+      if (props.virtualList)
+        refContainer.value.addEventListener("scroll", handleScroll, true);
+    });
+    vue.onBeforeUnmount(() => {
+      if (props.virtualList)
+        refContainer.value.removeEventListener("scroll", handleScroll, true);
+    });
+    const fullData = () => {
+      dataList.value.map((item) => {
+        if (props.rowKey == "__key")
+          item["__key"] = item["key"] || nanoid.nanoid(10);
+      });
+    };
+    const initData = () => {
+      dataList.value = props.data;
+      fullData();
+      visibleDataList.value = dataList.value;
+      visibleTotal.value = visibleDataList.value.length;
+      if (props.virtualList) {
+        getIndexRange();
+        originStartIndex.value = null;
+      }
+      getDisplayDataList();
+    };
+    vue.watch(() => props.data, () => {
+      initData();
+    });
+    const displayDataList = vue.ref([]);
+    const getDisplayDataList = () => {
+      if (!props.virtualList) {
+        displayDataList.value = visibleDataList.value;
+        return;
+      }
+      displayDataList.value = visibleDataList.value.slice(startIndex.value, endIndex.value + 1);
+    };
+    const setAllSelected = (checked = true) => {
+      if (!props.multipleSelect) {
+        return;
+      }
+      if (checked) {
+        const items = visibleDataList.value.map((data) => {
+          const value = data[props.rowKey];
+          if (!props.disableRowKeys.includes(value))
+            return value;
+        }).filter((value) => value);
+        selectedRowKeys.value = items;
+      } else {
+        selectedRowKeys.value.length = 0;
+      }
+      updateAllSelected();
+      allSelected.value = checked;
+      emit("allSelectedChange", {
+        checked,
+        selectedRowKeys: getSelectedRowKeys()
+      });
+    };
+    const updateAllSelected = () => {
+      allSelected.value = selectedRowKeys.value.length == visibleDataList.value.length;
+      indeterminate.value = !allSelected.value && selectedRowKeys.value.length > 0;
+      return allSelected.value;
+    };
+    const queryAllSelected = () => allSelected.value;
+    const setSelectedRowKeys = (rowKeys) => {
+      if (type.isArray) {
+        if (props.multipleSelect)
+          selectedRowKeys.value = rowKeys;
+        else
+          selectedRowKeys.value = [rowKeys[0]];
+      } else {
+        selectedRowKeys.value = [rowKeys];
+      }
+      updateAllSelected();
+    };
+    const getSelectedRowKeys = () => {
+      return props.multipleSelect ? selectedRowKeys.value : selectedRowKeys.value.length > 0 ? selectedRowKeys.value[0] : void 0;
+    };
+    const getSelectedRows = () => {
+      const rows = visibleDataList.value.filter((rowData) => {
+        return selectedRowKeys.value.includes(rowData[props.rowKey]);
+      });
+      if (rows.length <= 0)
+        return props.multipleSelect ? [] : void 0;
+      const source = cloneDeep__default["default"](rows);
+      if (props.multipleSelect)
+        return source.map((rowData) => {
+          return deleteAddition(rowData);
+        });
+      else {
+        return source.length > 0 ? deleteAddition(source[0]) : void 0;
+      }
+    };
+    const deleteAddition = (rowData) => {
+      if (rowData["__key"])
+        delete rowData["__key"];
+      return rowData;
+    };
+    const setRowSelected = (checked, rowData) => {
+      const rowKey = rowData[props.rowKey];
+      if (checked) {
+        if (!selectedRowKeys.value.includes(rowKey)) {
+          if (!props.multipleSelect)
+            selectedRowKeys.value.length = 0;
+          selectedRowKeys.value.push(rowKey);
+        }
+      } else {
+        const index2 = selectedRowKeys.value.indexOf(rowKey);
+        if (index2 >= 0)
+          selectedRowKeys.value.splice(index2, 1);
+      }
+      console.log("selectedRowKeys.value=", selectedRowKeys.value);
+      updateAllSelected();
+      emit("selectedRowChange", {
+        rowData,
+        checked,
+        selectedRowKeys: getSelectedRowKeys()
+      });
+    };
+    const scrollTo = () => {
+      console.log("refContainer.value.documentElement", refContainer.value);
+      refContainer.value.scrollTo({
+        top: 1e3,
+        left: 0,
+        behavior: "smooth"
+      });
+    };
+    const indeterminate = vue.ref(false);
+    const dataSort = (sorter, direction) => {
+      visibleDataList.value.sort((a, b) => {
+        const result = sorter(a, b);
+        console.log("result", result);
+        return direction == "desc" ? -result : result;
+      });
+      console.log(visibleDataList.value);
+    };
+    const remoteSort = (column) => {
+      emit("sortChange", column);
+    };
+    context.provideTable({
+      allSelected: vue.computed(() => allSelected.value),
+      displayDataList: vue.computed(() => displayDataList.value),
+      selectedRowKeys: vue.computed(() => selectedRowKeys.value),
+      indeterminate: vue.computed(() => indeterminate.value),
+      setAllSelected,
+      setSelectedRowKeys,
+      setRowSelected,
+      queryAllSelected,
+      dataSort,
+      remoteSort
+    });
+    const render = () => {
+      const styles = vue.computed(() => {
+        const styles2 = {};
+        if (props.fixed)
+          styles2["table-layout"] = "fixed";
+        return styles2;
+      });
+      const getvirtualListHeight = () => {
+        let height = rowHeight.value * visibleTotal.value || rowHeight.value;
+        if (!props.virtualList)
+          height = height + rowHeight.value;
+        else if (!props.headerFixed && currIndex.value !== 0)
+          height = height - rowHeight.value;
+        return height;
+      };
+      const virtualListStyles = vue.computed(() => {
+        const styles2 = {};
+        if (props.headerFixed || props.virtualList)
+          styles2["height"] = `${getvirtualListHeight()}px`;
+        return styles2;
+      });
+      const containerStyles = vue.computed(() => {
+        const styles2 = {};
+        if (props.width)
+          styles2["width"] = common.getLength(props.width);
+        if (props.maxHeight)
+          styles2["max-height"] = common.getLength(props.maxHeight);
+        return styles2;
+      });
+      const bodyProps = __spreadProps(__spreadValues({}, props), {
+        tableSlots: slots
+      });
+      return vue.createVNode(vue.Fragment, null, [vue.createVNode("div", vue.mergeProps({
+        "ref": refContainer,
+        "class": containerClasses.value
+      }, attrs, {
+        "style": containerStyles.value
+      }), [props.virtualList ? vue.createVNode(vue.Fragment, null, [vue.createVNode(vue.resolveComponent("t-loading"), {
+        "loading": props.loading,
+        "show-text": false
+      }, {
+        default: () => {
+          var _a;
+          return [vue.createVNode("table", {
+            "style": styles.value,
+            "class": headerTableclasses.value
+          }, [vue.createVNode(vue.resolveComponent("t-table-header"), vue.mergeProps({
+            "ref": refHeader
+          }, props), null)]), vue.createVNode("div", {
+            "ref": refVirtualList,
+            "style": virtualListStyles.value
+          }, [vue.createVNode("table", {
+            "ref": refTable,
+            "style": styles.value,
+            "class": classes.value
+          }, [(_a = refHeader.value) == null ? void 0 : _a.colgroupElements, vue.createVNode(vue.resolveComponent("t-table-body"), vue.mergeProps(bodyProps, {
+            "startIndex": startIndex.value,
+            "endIndex": endIndex.value
+          }), null)])])];
+        }
+      })]) : vue.createVNode(vue.resolveComponent("t-loading"), {
+        "loading": props.loading,
+        "show-text": false
+      }, {
+        default: () => [vue.createVNode("div", {
+          "ref": refVirtualList,
+          "style": virtualListStyles.value
+        }, [vue.createVNode("table", {
+          "ref": refTable,
+          "style": styles.value,
+          "class": classes.value
+        }, [vue.createVNode(vue.resolveComponent("t-table-header"), props, null), vue.createVNode(vue.resolveComponent("t-table-body"), bodyProps, null)])])]
+      })])]);
+    };
+    return {
+      render,
+      selectAll: setAllSelected,
+      isAllSelected: () => allSelected.value,
+      getSelectedRowKeys,
+      setSelectedRowKeys,
+      getSelectedRows,
+      scrollTo
+    };
+  },
+  render() {
+    return this.render();
+  }
+});
+exports["default"] = Table;
+exports.tableProps = tableProps;

package/lib/tabs/index.d.ts

@@ -0,0 +1,240 @@
+declare const TTabs: {
+    new (...args: any[]): {
+        $: import("vue").ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            type: string;
+            gutter: string | number;
+            justified: boolean;
+        }> & Omit<Readonly<import("vue").ExtractPropTypes<{
+            current: import("vue-types").VueTypeDef<string | number>;
+            type: import("vue-types").VueTypeDef<string> & {
+                default: string;
+            };
+            justified: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+            gutter: import("vue-types").VueTypeDef<string | number> & {
+                default: string | number;
+            };
+        }>> & {
+            onChange?: (...args: any[]) => any;
+            "onUpdate:current"?: (...args: any[]) => any;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "type" | "gutter" | "justified">;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        };
+        $slots: Readonly<{
+            [name: string]: import("vue").Slot;
+        }>;
+        $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>;
+        $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>;
+        $emit: (event: "change" | "update:current", ...args: any[]) => void;
+        $el: any;
+        $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+            current: import("vue-types").VueTypeDef<string | number>;
+            type: import("vue-types").VueTypeDef<string> & {
+                default: string;
+            };
+            justified: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+            gutter: import("vue-types").VueTypeDef<string | number> & {
+                default: string | number;
+            };
+        }>> & {
+            onChange?: (...args: any[]) => any;
+            "onUpdate:current"?: (...args: any[]) => any;
+        }, {
+            render: () => JSX.Element;
+        }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:current")[], string, {
+            type: string;
+            gutter: string | number;
+            justified: boolean;
+        }> & {
+            beforeCreate?: (() => void) | (() => void)[];
+            created?: (() => void) | (() => void)[];
+            beforeMount?: (() => void) | (() => void)[];
+            mounted?: (() => void) | (() => void)[];
+            beforeUpdate?: (() => void) | (() => void)[];
+            updated?: (() => void) | (() => void)[];
+            activated?: (() => void) | (() => void)[];
+            deactivated?: (() => void) | (() => void)[];
+            beforeDestroy?: (() => void) | (() => void)[];
+            beforeUnmount?: (() => void) | (() => void)[];
+            destroyed?: (() => void) | (() => void)[];
+            unmounted?: (() => void) | (() => void)[];
+            renderTracked?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
+            renderTriggered?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
+            errorCaptured?: ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>, info: string) => boolean | void)[];
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import("vue").nextTick;
+        $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean>): import("vue").WatchStopHandle;
+    } & Readonly<import("vue").ExtractPropTypes<{
+        current: import("vue-types").VueTypeDef<string | number>;
+        type: import("vue-types").VueTypeDef<string> & {
+            default: string;
+        };
+        justified: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
+        gutter: import("vue-types").VueTypeDef<string | number> & {
+            default: string | number;
+        };
+    }>> & {
+        onChange?: (...args: any[]) => any;
+        "onUpdate:current"?: (...args: any[]) => any;
+    } & import("vue").ShallowUnwrapRef<{
+        render: () => JSX.Element;
+    }> & {} & import("vue").ComponentCustomProperties;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+    current: import("vue-types").VueTypeDef<string | number>;
+    type: import("vue-types").VueTypeDef<string> & {
+        default: string;
+    };
+    justified: import("vue-types").VueTypeValidableDef<boolean> & {
+        default: boolean;
+    } & {
+        default: boolean;
+    };
+    gutter: import("vue-types").VueTypeDef<string | number> & {
+        default: string | number;
+    };
+}>> & {
+    onChange?: (...args: any[]) => any;
+    "onUpdate:current"?: (...args: any[]) => any;
+}, {
+    render: () => JSX.Element;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:current")[], "change" | "update:current", {
+    type: string;
+    gutter: string | number;
+    justified: boolean;
+}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("@vue/runtime-core").Plugin;
+export { TTabs };
+declare const TTab: {
+    new (...args: any[]): {
+        $: import("vue").ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            title: import("../utils/type").VueNode | (() => import("../utils/type").VueNode);
+            disabled: boolean;
+            value: string;
+        }> & Omit<Readonly<import("vue").ExtractPropTypes<{
+            title: {
+                type: import("vue").PropType<import("../utils/type").VueNode | (() => import("../utils/type").VueNode)>;
+                default: string;
+            };
+            value: import("vue-types").VueTypeValidableDef<string> & {
+                default: string;
+            };
+            disabled: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+        }>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "title" | "disabled" | "value">;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        };
+        $slots: Readonly<{
+            [name: string]: import("vue").Slot;
+        }>;
+        $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>;
+        $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>;
+        $emit: (event: string, ...args: any[]) => void;
+        $el: any;
+        $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+            title: {
+                type: import("vue").PropType<import("../utils/type").VueNode | (() => import("../utils/type").VueNode)>;
+                default: string;
+            };
+            value: import("vue-types").VueTypeValidableDef<string> & {
+                default: string;
+            };
+            disabled: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+        }>>, {
+            render: () => JSX.Element;
+        }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {
+            title: import("../utils/type").VueNode | (() => import("../utils/type").VueNode);
+            disabled: boolean;
+            value: string;
+        }> & {
+            beforeCreate?: (() => void) | (() => void)[];
+            created?: (() => void) | (() => void)[];
+            beforeMount?: (() => void) | (() => void)[];
+            mounted?: (() => void) | (() => void)[];
+            beforeUpdate?: (() => void) | (() => void)[];
+            updated?: (() => void) | (() => void)[];
+            activated?: (() => void) | (() => void)[];
+            deactivated?: (() => void) | (() => void)[];
+            beforeDestroy?: (() => void) | (() => void)[];
+            beforeUnmount?: (() => void) | (() => void)[];
+            destroyed?: (() => void) | (() => void)[];
+            unmounted?: (() => void) | (() => void)[];
+            renderTracked?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
+            renderTriggered?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
+            errorCaptured?: ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>, info: string) => boolean | void)[];
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import("vue").nextTick;
+        $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean>): import("vue").WatchStopHandle;
+    } & Readonly<import("vue").ExtractPropTypes<{
+        title: {
+            type: import("vue").PropType<import("../utils/type").VueNode | (() => import("../utils/type").VueNode)>;
+            default: string;
+        };
+        value: import("vue-types").VueTypeValidableDef<string> & {
+            default: string;
+        };
+        disabled: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
+    }>> & import("vue").ShallowUnwrapRef<{
+        render: () => JSX.Element;
+    }> & {} & import("vue").ComponentCustomProperties;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+    title: {
+        type: import("vue").PropType<import("../utils/type").VueNode | (() => import("../utils/type").VueNode)>;
+        default: string;
+    };
+    value: import("vue-types").VueTypeValidableDef<string> & {
+        default: string;
+    };
+    disabled: import("vue-types").VueTypeValidableDef<boolean> & {
+        default: boolean;
+    } & {
+        default: boolean;
+    };
+}>>, {
+    render: () => JSX.Element;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {
+    title: import("../utils/type").VueNode | (() => import("../utils/type").VueNode);
+    disabled: boolean;
+    value: string;
+}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("@vue/runtime-core").Plugin;
+export { TTab };

package/lib/tabs/index.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+var type = require("../utils/type.js");
+var tabs = require("./src/tabs.js");
+var tab = require("./src/tab.js");
+const TTabs = type.withInstall(tabs["default"]);
+const TTab = type.withInstall(tab["default"]);
+exports.TTab = TTab;
+exports.TTabs = TTabs;

package/lib/tabs/src/context.d.ts

@@ -0,0 +1,8 @@
+import type { InjectionKey, ComputedRef } from 'vue';
+export interface TabsContext {
+    current: ComputedRef<string | number>;
+}
+export declare const TabsContextKey: InjectionKey<TabsContext>;
+declare const provideTabs: (data: TabsContext) => void;
+declare const injectTabs: () => TabsContext;
+export { injectTabs, provideTabs };

package/lib/tabs/src/context.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+var vue = require("vue");
+const TabsContextKey = Symbol("TabsContextKey");
+const provideTabs = (data) => {
+  vue.provide(TabsContextKey, data);
+};
+const injectTabs = () => {
+  return vue.inject(TabsContextKey);
+};
+exports.TabsContextKey = TabsContextKey;
+exports.injectTabs = injectTabs;
+exports.provideTabs = provideTabs;