yc-design-vue 1.7.6 → 1.7.8

package/es/Tabs/Tabs.vue.js

@@ -1,7 +1,211 @@
-import _sfc_main from "./Tabs.vue2.js";
-/* empty css          */
-import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
-const _Tabs = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-d4474e51"]]);
+import { defineComponent, useSlots, ref, computed, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, createCommentVNode, createBlock, withCtx, createVNode, normalizeStyle, Fragment, renderList, renderSlot, resolveDynamicComponent, nextTick } from "vue";
+import "../node_modules/tinycolor2/esm/tinycolor.js";
+import { valueToPx } from "../_shared/utils/dom.js";
+import "../_shared/utils/time.js";
+import { findComponentsFromVnodes } from "../_shared/utils/vue-utils.js";
+import "../Empty/index.js";
+/* empty css                             */
+import _sfc_main$3 from "../_shared/icons/IconArrowRight.vue.js";
+import _sfc_main$6 from "../_shared/icons/IconPlus.vue.js";
+import useContext from "./hooks/useContext.js";
+import useTabsScroll from "./hooks/useTabsScroll.js";
+import _sfc_main$1 from "./TabPane.vue.js";
+/* empty css             */
+import _sfc_main$4 from "./TabsTab.vue.js";
+/* empty css             */
+import _sfc_main$5 from "./TabsNavInk.vue.js";
+/* empty css                */
+import _sfc_main$2 from "./TabButton.vue.js";
+/* empty css               */
+const _hoisted_1 = { class: "yc-tabs-nav" };
+const _hoisted_2 = {
+  key: 3,
+  class: "yc-tabs-nav-extra"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "Tabs"
+  },
+  __name: "Tabs",
+  props: {
+    activeKey: { default: void 0 },
+    defaultActiveKey: { default: "" },
+    position: { default: void 0 },
+    size: { default: void 0 },
+    type: { default: "line" },
+    direction: { default: "horizontal" },
+    editable: { type: Boolean, default: false },
+    showAddButton: { type: Boolean, default: false },
+    destoryOnHide: { type: Boolean, default: false },
+    justify: { type: Boolean, default: false },
+    animation: { type: Boolean, default: false },
+    headerPadding: { type: Boolean, default: true },
+    autoSwitch: { type: Boolean, default: false },
+    hideContent: { type: Boolean, default: false },
+    trigger: { default: "click" }
+  },
+  emits: ["update:activeKey", "change", "tab-click", "add", "delete"],
+  setup(__props, { emit: __emit }) {
+    const slots = useSlots();
+    const props = __props;
+    const emits = __emit;
+    const listRef = ref();
+    const { computedActiveKey, size, direction, autoSwitch, position } = useContext().provide(props, emits, listRef);
+    const tabPanes = computed(
+      () => {
+        var _a;
+        return findComponentsFromVnodes(((_a = slots.default) == null ? void 0 : _a.call(slots)) || [], _sfc_main$1.name);
+      }
+    );
+    const panes = computed(() => {
+      return tabPanes.value.map((item) => {
+        return {
+          title: "",
+          path: "",
+          disabled: false,
+          ...item.props || {},
+          slots: item.children
+        };
+      });
+    });
+    const showAddButton = computed(() => {
+      return props.showAddButton && ["line", "card", "card-gutter"].includes(props.type);
+    });
+    const curIndex = computed(() => {
+      const index = panes.value.findIndex((item) => {
+        return item.path == computedActiveKey.value;
+      });
+      return index < 0 ? 0 : index;
+    });
+    const {
+      scrollDis,
+      isScrollable,
+      preDisabled,
+      nextDisabled,
+      navHeight,
+      handleScroll
+    } = useTabsScroll({
+      listRef,
+      panes,
+      direction
+    });
+    const handleAdd = async () => {
+      emits("add");
+      if (!autoSwitch.value) return;
+      await nextTick();
+      computedActiveKey.value = panes.value[panes.value.length - 1].path;
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([
+          "yc-tabs",
+          `yc-tabs-${unref(direction)}`,
+          `yc-tabs-type-${_ctx.type}`,
+          `yc-tabs-size-${unref(size)}`,
+          {
+            "yc-tabs-animation": _ctx.animation,
+            "yc-tabs-justify": unref(direction) == "horizontal" && _ctx.justify,
+            "yc-tabs-no-padding": _ctx.headerPadding && ["line", "text"].includes(_ctx.type) && props.direction === "horizontal",
+            [`yc-tabs-${unref(position)}`]: unref(position)
+          }
+        ])
+      }, [
+        createElementVNode("div", _hoisted_1, [
+          unref(isScrollable) ? (openBlock(), createBlock(_sfc_main$2, {
+            key: 0,
+            disabled: unref(preDisabled),
+            direction: unref(direction) == "horizontal" ? "left" : "up",
+            onClick: _cache[0] || (_cache[0] = ($event) => unref(handleScroll)("pre"))
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(_sfc_main$3), {
+                rotate: unref(direction) == "horizontal" ? 180 : -90,
+                size: 14
+              }, null, 8, ["rotate"])
+            ]),
+            _: 1
+          }, 8, ["disabled", "direction"])) : createCommentVNode("", true),
+          createElementVNode("div", {
+            class: normalizeClass([
+              "yc-tabs-nav-tab",
+              {
+                "yc-tabs-nav-tab-scroll": unref(isScrollable)
+              }
+            ])
+          }, [
+            createElementVNode("div", {
+              class: "yc-tabs-nav-tab-list",
+              style: normalizeStyle({
+                transform: `translate${unref(direction) == "horizontal" ? "X" : "Y"}(${unref(valueToPx)(unref(scrollDis))})`
+              }),
+              ref_key: "listRef",
+              ref: listRef
+            }, [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(panes.value, (item, i) => {
+                return openBlock(), createBlock(_sfc_main$4, {
+                  key: i,
+                  index: i,
+                  node: item
+                }, null, 8, ["index", "node"]);
+              }), 128)),
+              _ctx.type == "line" ? (openBlock(), createBlock(_sfc_main$5, {
+                key: 0,
+                "cur-index": curIndex.value,
+                panes: panes.value
+              }, null, 8, ["cur-index", "panes"])) : createCommentVNode("", true)
+            ], 4)
+          ], 2),
+          unref(isScrollable) ? (openBlock(), createBlock(_sfc_main$2, {
+            key: 1,
+            disabled: unref(nextDisabled),
+            direction: unref(direction) == "horizontal" ? "right" : "down",
+            onClick: _cache[1] || (_cache[1] = ($event) => unref(handleScroll)("next"))
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(_sfc_main$3), {
+                rotate: unref(direction) == "horizontal" ? 0 : 90,
+                size: 14
+              }, null, 8, ["rotate"])
+            ]),
+            _: 1
+          }, 8, ["disabled", "direction"])) : createCommentVNode("", true),
+          showAddButton.value ? (openBlock(), createBlock(_sfc_main$2, {
+            key: 2,
+            type: "add",
+            size: "12",
+            onClick: handleAdd
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(_sfc_main$6), { size: 12 })
+            ]),
+            _: 1
+          })) : createCommentVNode("", true),
+          _ctx.$slots.extra ? (openBlock(), createElementBlock("div", _hoisted_2, [
+            renderSlot(_ctx.$slots, "extra")
+          ])) : createCommentVNode("", true)
+        ]),
+        !_ctx.hideContent ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: "yc-tabs-content",
+          style: normalizeStyle({
+            height: unref(direction) == "vertical" ? `${unref(valueToPx)(unref(navHeight))}` : ""
+          })
+        }, [
+          createElementVNode("div", {
+            class: "yc-tabs-content-list",
+            style: normalizeStyle({
+              transform: `translate${unref(direction) == "horizontal" ? "X" : "Y"}(${-curIndex.value * 100}%)`
+            })
+          }, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(tabPanes.value, (node, i) => {
+              return openBlock(), createBlock(resolveDynamicComponent(node), { key: i });
+            }), 128))
+          ], 4)
+        ], 4)) : createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
 export {
-  _Tabs as default
+  _sfc_main as default
 };

package/es/Tabs/Tabs.vue3.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./Tabs.vue.js";
+/* empty css          */
+export {
+  _sfc_main as default
+};

package/es/Tabs/TabsNavInk.vue.js

@@ -1,7 +1,62 @@
-import _sfc_main from "./TabsNavInk.vue2.js";
-/* empty css                */
-import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
-const TabsNavInk = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-cb869c14"]]);
+import { defineComponent, toRefs, computed, createElementBlock, openBlock, normalizeStyle } from "vue";
+import "../node_modules/tinycolor2/esm/tinycolor.js";
+import { valueToPx } from "../_shared/utils/dom.js";
+import { isUndefined } from "../_shared/utils/is.js";
+import "../_shared/utils/time.js";
+import "../Empty/index.js";
+/* empty css                             */
+import useContext from "./hooks/useContext.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "TabsNavInk",
+  props: {
+    curIndex: {},
+    panes: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const { curIndex, panes } = toRefs(props);
+    const { titleRefs, listRef, direction, editable } = useContext().inject();
+    const sliderStyle = computed(() => {
+      var _a, _b, _c;
+      const curPane = panes.value[curIndex.value];
+      const closeWidth = editable.value && (isUndefined(curPane.closable) || curPane.closable) ? 22 : 0;
+      const titleRef = titleRefs.value[curIndex.value];
+      const { left, top } = ((_b = (_a = listRef.value) == null ? void 0 : _a.getBoundingClientRect) == null ? void 0 : _b.call(_a)) ?? {
+        left: 0,
+        top: 0
+      };
+      const { scrollLeft, scrollTop } = listRef.value ?? {
+        scrollLeft: 0,
+        scrollTop: 0
+      };
+      const { left: curLeft, top: curTop } = ((_c = titleRef == null ? void 0 : titleRef.getBoundingClientRect) == null ? void 0 : _c.call(titleRef)) ?? {
+        left: 0,
+        top: 0
+      };
+      const { offsetHeight, offsetWidth } = titleRef ?? {
+        offsetHeight: 0,
+        offsetWidth: 0
+      };
+      if (direction.value == "horizontal") {
+        return {
+          width: valueToPx(offsetWidth + closeWidth),
+          left: valueToPx(curLeft - left + scrollLeft)
+        };
+      } else {
+        return {
+          height: valueToPx(offsetHeight),
+          top: valueToPx(curTop - top + scrollTop)
+        };
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: "yc-tabs-nav-ink",
+        style: normalizeStyle(sliderStyle.value)
+      }, null, 4);
+    };
+  }
+});
 export {
-  TabsNavInk as default
+  _sfc_main as default
 };

package/es/Tabs/TabsNavInk.vue3.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./TabsNavInk.vue.js";
+/* empty css                */
+export {
+  _sfc_main as default
+};

package/es/Tabs/TabsTab.vue.js

@@ -1,7 +1,92 @@
-import _sfc_main from "./TabsTab.vue2.js";
-/* empty css             */
-import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
-const TabsTab = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-ef3205ae"]]);
+import { defineComponent, toRefs, onMounted, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, createBlock, createCommentVNode, resolveDynamicComponent } from "vue";
+import useContext from "./hooks/useContext.js";
+import "../node_modules/tinycolor2/esm/tinycolor.js";
+import "../_shared/utils/dom.js";
+import { isUndefined } from "../_shared/utils/is.js";
+import "../_shared/utils/time.js";
+import "../Empty/index.js";
+/* empty css                             */
+import _sfc_main$1 from "./TabButton.vue.js";
+/* empty css               */
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "TabsTab",
+  props: {
+    node: {},
+    index: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const { node, index } = toRefs(props);
+    const {
+      computedActiveKey,
+      titleRefs,
+      tabRefs,
+      trigger,
+      editable,
+      type,
+      direction,
+      position,
+      headerPadding,
+      size,
+      emits
+    } = useContext().inject();
+    const renderTitle = (node2) => {
+      const { slots, title } = node2;
+      return slots.title ?? (() => title);
+    };
+    const handleChange = (node2, triggerType) => {
+      const { disabled, path } = node2;
+      if (computedActiveKey.value == path || disabled || triggerType != trigger.value) {
+        return;
+      }
+      computedActiveKey.value = path;
+      emits("change", path);
+      emits("tab-click", path);
+    };
+    const handleDel = async (node2) => {
+      emits("delete", node2.path);
+    };
+    onMounted(() => {
+      if (computedActiveKey.value != node.value.path) {
+        if (computedActiveKey.value || index.value) return;
+        computedActiveKey.value = node.value.path;
+        return;
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        tabindex: "0",
+        class: normalizeClass([
+          "yc-tabs-tab",
+          `yc-tabs-tab-type-${unref(type)}`,
+          `yc-tabs-tab-${unref(direction)}`,
+          `yc-tabs-tab-size-${unref(size)}`,
+          {
+            [`yc-tabs-tab-${unref(position)}`]: unref(position),
+            "yc-tabs-tab-no-padding": !unref(headerPadding) && unref(direction) == "horizontal" && ["line", "text"].includes(unref(type)),
+            "yc-tabs-tab-active": unref(computedActiveKey) == unref(node).path,
+            "yc-tabs-tab-disabled": unref(node).disabled
+          }
+        ]),
+        ref: (el) => unref(tabRefs)[unref(index)] = el,
+        onMouseenter: _cache[1] || (_cache[1] = ($event) => handleChange(unref(node), "hover")),
+        onClick: _cache[2] || (_cache[2] = ($event) => handleChange(unref(node), "click"))
+      }, [
+        createElementVNode("span", {
+          class: "yc-tabs-tab-title",
+          ref: (el) => unref(titleRefs)[unref(index)] = el
+        }, [
+          (openBlock(), createBlock(resolveDynamicComponent(renderTitle(unref(node)))))
+        ], 512),
+        unref(editable) && (unref(isUndefined)(unref(node).closable) || unref(node).closable) ? (openBlock(), createBlock(_sfc_main$1, {
+          key: 0,
+          type: "close",
+          onClick: _cache[0] || (_cache[0] = ($event) => handleDel(unref(node)))
+        })) : createCommentVNode("", true)
+      ], 34);
+    };
+  }
+});
 export {
-  TabsTab as default
+  _sfc_main as default
 };

package/es/Tabs/TabsTab.vue3.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./TabsTab.vue.js";
+/* empty css             */
+export {
+  _sfc_main as default
+};

package/es/Tabs/index.js

@@ -1,13 +1,14 @@
-import _Tabs from "./Tabs.vue.js";
-import _sfc_main from "./TabPane.vue.js";
+import _sfc_main from "./Tabs.vue.js";
+/* empty css          */
+import _sfc_main$1 from "./TabPane.vue.js";
 /* empty css             */
-const Tabs = Object.assign(_Tabs, {
+const Tabs = Object.assign(_sfc_main, {
   install: (app) => {
-    app.component("Yc" + _Tabs.name, _Tabs);
     app.component("Yc" + _sfc_main.name, _sfc_main);
+    app.component("Yc" + _sfc_main$1.name, _sfc_main$1);
   }
 });
 export {
-  _sfc_main as TabPane,
+  _sfc_main$1 as TabPane,
   Tabs as default
 };

package/es/Tag/index.js

@@ -1,7 +1,8 @@
-import _Tag from "./index.vue.js";
-const Tag = Object.assign(_Tag, {
+import _sfc_main from "./index.vue.js";
+/* empty css           */
+const Tag = Object.assign(_sfc_main, {
   install: (app) => {
-    app.component("Yc" + _Tag.name, _Tag);
+    app.component("Yc" + _sfc_main.name, _sfc_main);
   }
 });
 export {

package/es/Tag/index.vue.js

@@ -1,7 +1,114 @@
-import _sfc_main from "./index.vue2.js";
-/* empty css           */
-import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
-const _Tag = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-1f61a919"]]);
+import { defineComponent, toRefs, computed, createElementBlock, createCommentVNode, unref, openBlock, normalizeStyle, normalizeClass, createElementVNode, createBlock, renderSlot, withCtx } from "vue";
+import { TAG_PRESET_COLORS } from "../_shared/constants/index.js";
+import "../node_modules/tinycolor2/esm/tinycolor.js";
+import "../_shared/utils/dom.js";
+import "../_shared/utils/time.js";
+import { getGlobalConfig } from "../_shared/utils/global-config.js";
+import useControlValue from "../_shared/utils/control.js";
+import Spin from "../Spin/index.js";
+import _sfc_main$1 from "../_shared/components/IconButton.vue.js";
+/* empty css                                    */
+/* empty css                                         */
+/* empty css                             */
+const _hoisted_1 = {
+  key: 0,
+  class: "yc-tag-icon"
+};
+const _hoisted_2 = { class: "yc-tag-label" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "Tag"
+  },
+  __name: "index",
+  props: {
+    color: { default: "default" },
+    size: { default: void 0 },
+    bordered: { type: Boolean, default: false },
+    visible: { type: Boolean, default: void 0 },
+    defaultVisible: { type: Boolean, default: true },
+    loading: { type: Boolean, default: false },
+    closable: { type: Boolean, default: false },
+    checkable: { type: Boolean, default: false },
+    checked: { type: Boolean, default: void 0 },
+    defaultChecked: { type: Boolean, default: true },
+    nowrap: { type: Boolean, default: false }
+  },
+  emits: ["update:visible", "update:checked", "close", "check"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emits = __emit;
+    const { visible, defaultVisible, checked, defaultChecked, checkable, color } = toRefs(props);
+    const { size } = getGlobalConfig(props);
+    const computedVisible = useControlValue(
+      visible,
+      defaultVisible.value,
+      (val) => emits("update:visible", val)
+    );
+    const computedChecked = useControlValue(
+      checked,
+      defaultChecked.value,
+      (val) => emits("update:checked", val)
+    );
+    const background = computed(() => {
+      return TAG_PRESET_COLORS.includes(color.value) ? "" : color.value;
+    });
+    const handleEvent = (type, ev) => {
+      if (type == "close") {
+        computedVisible.value = false;
+        emits("close", ev);
+      } else if (type == "check" && checkable.value) {
+        computedChecked.value = !computedChecked.value;
+        emits("check", computedChecked.value, ev);
+      }
+    };
+    return (_ctx, _cache) => {
+      return unref(computedVisible) ? (openBlock(), createElementBlock("label", {
+        key: 0,
+        class: normalizeClass([
+          "yc-tag",
+          `yc-tag-color-${unref(color)}`,
+          `yc-tag-size-${["small", "medium", "large"].includes(unref(size)) ? unref(size) : "medium"}`,
+          unref(TAG_PRESET_COLORS).includes(unref(color)) ? "yc-tag-preset-color" : "yc-tag-custom-color",
+          _ctx.nowrap ? "yc-tag-no-wrap" : "yc-tag-wrap",
+          {
+            "yc-tag-loading": _ctx.loading,
+            "yc-tag-bordered": _ctx.bordered,
+            "yc-tag-checked": unref(computedChecked),
+            "yc-tag-checkable": unref(checkable)
+          }
+        ]),
+        style: normalizeStyle({
+          background: background.value
+        }),
+        onClick: _cache[1] || (_cache[1] = ($event) => handleEvent("check", $event))
+      }, [
+        _ctx.$slots.icon ? (openBlock(), createElementBlock("div", _hoisted_1, [
+          renderSlot(_ctx.$slots, "icon")
+        ])) : createCommentVNode("", true),
+        createElementVNode("span", _hoisted_2, [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _ctx.closable ? (openBlock(), createBlock(unref(_sfc_main$1), {
+          key: 1,
+          "hover-size": 16,
+          "hover-color": "rgba(255, 255, 255, 0.2)",
+          class: "yc-tag-close-button",
+          onClick: _cache[0] || (_cache[0] = ($event) => handleEvent("close", $event))
+        }, {
+          default: withCtx(() => [
+            _ctx.$slots["close-icon"] ? renderSlot(_ctx.$slots, "close-icon", { key: 0 }) : createCommentVNode("", true)
+          ]),
+          _: 3
+        })) : createCommentVNode("", true),
+        _ctx.loading ? (openBlock(), createBlock(unref(Spin), {
+          key: 2,
+          size: 12,
+          class: "yc-tag-loading-icon"
+        })) : createCommentVNode("", true)
+      ], 6)) : createCommentVNode("", true);
+    };
+  }
+});
 export {
-  _Tag as default
+  _sfc_main as default
 };

package/es/Tag/index.vue3.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./index.vue.js";
+/* empty css           */
+export {
+  _sfc_main as default
+};

package/es/Textarea/index.js

@@ -1,7 +1,8 @@
-import _Textarea from "./index.vue.js";
-const Textarea = Object.assign(_Textarea, {
+import _sfc_main from "./index.vue.js";
+/* empty css           */
+const Textarea = Object.assign(_sfc_main, {
   install: (app) => {
-    app.component("Yc" + _Textarea.name, _Textarea);
+    app.component("Yc" + _sfc_main.name, _sfc_main);
   }
 });
 export {