@web-utils/component 2.0.13 → 2.2.0

package/x-input-tag/index.mjs

@@ -0,0 +1,203 @@
+var f = Object.defineProperty, _ = Object.defineProperties;
+var b = Object.getOwnPropertyDescriptors;
+var p = Object.getOwnPropertySymbols;
+var v = Object.prototype.hasOwnProperty, y = Object.prototype.propertyIsEnumerable;
+var h = (t, s, e) => s in t ? f(t, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[s] = e, d = (t, s) => {
+  for (var e in s || (s = {}))
+    v.call(s, e) && h(t, e, s[e]);
+  if (p)
+    for (var e of p(s))
+      y.call(s, e) && h(t, e, s[e]);
+  return t;
+}, c = (t, s) => _(t, b(s));
+var r = (t, s, e) => new Promise((a, n) => {
+  var o = (i) => {
+    try {
+      l(e.next(i));
+    } catch (u) {
+      n(u);
+    }
+  }, g = (i) => {
+    try {
+      l(e.throw(i));
+    } catch (u) {
+      n(u);
+    }
+  }, l = (i) => i.done ? a(i.value) : Promise.resolve(i.value).then(o, g);
+  l((e = e.apply(t, s)).next());
+});
+import { n as V } from "../chunks/vueComponentNormalizer.JwmUNtgn.mjs";
+var w = function() {
+  var t = this, s = t.$createElement, e = t._self._c || s;
+  return e("div", {
+    staticClass: "x-input-tag"
+  }, [t.tags && t.tags.length && t.tags[0] ? t._l(t.tags, function(a, n) {
+    return e("ElTag", {
+      key: a.id || a,
+      attrs: {
+        size: "medium",
+        "disable-transitions": "",
+        closable: !t.inputDisabled
+      },
+      on: {
+        close: function(o) {
+          return t.handleClose(a, n);
+        }
+      }
+    }, [t._v(" " + t._s(a.name || a) + " ")]);
+  }) : t.inputDisabled ? [e("span", {
+    staticStyle: {
+      color: "#b5b5b5"
+    }
+  }, [t._v("无")])] : t._e(), t.inputDisabled ? t._e() : e("ElInput", {
+    directives: [{
+      name: "show",
+      rawName: "v-show",
+      value: t.inputVisible,
+      expression: "inputVisible"
+    }],
+    ref: "saveTagInput",
+    staticClass: "input-new-tag",
+    attrs: {
+      size: "mini"
+    },
+    on: {
+      blur: t.handleInputConfirm
+    },
+    nativeOn: {
+      keyup: function(a) {
+        return !a.type.indexOf("key") && t._k(a.keyCode, "enter", 13, a.key, "Enter") ? null : t.handleInputConfirm.apply(null, arguments);
+      }
+    },
+    model: {
+      value: t.inputValue,
+      callback: function(a) {
+        t.inputValue = a;
+      },
+      expression: "inputValue"
+    }
+  }), !t.inputDisabled && !t.inputVisible ? e("ElButton", {
+    directives: [{
+      name: "show",
+      rawName: "v-show",
+      value: t.tags.length < t.maxTag,
+      expression: "tags.length < maxTag"
+    }],
+    staticClass: "button-new-tag",
+    attrs: {
+      size: "mini"
+    },
+    on: {
+      click: t.showInput
+    }
+  }, [t._v(" + 添加 ")]) : t._e(), t.count ? e("span", {
+    staticClass: "tags-count"
+  }, [t._v(t._s(t.tags.length && t.tags[0] ? t.tags.length : ""))]) : t._e()], 2);
+}, x = [];
+const C = {
+  name: "XInputTag",
+  inject: {
+    elForm: {
+      default: ""
+    },
+    elFormItem: {
+      default: ""
+    }
+  },
+  props: {
+    value: {
+      type: [Array, String],
+      default: () => []
+    },
+    disabled: Boolean,
+    separator: {
+      type: String,
+      default: ","
+    },
+    count: {
+      type: Boolean,
+      default: !0
+    },
+    arrayMode: {
+      type: Boolean,
+      default: !0
+    },
+    objectMode: {
+      type: Boolean,
+      default: !0
+    }
+  },
+  data() {
+    return {
+      inputVisible: !1,
+      inputValue: "",
+      maxTag: 20
+    };
+  },
+  computed: {
+    inputDisabled() {
+      return this.disabled || (this.elForm || {}).disabled;
+    },
+    tags: {
+      get() {
+        var t, s;
+        if (this.arrayMode)
+          return (t = this.value) != null && t.length ? this.objectMode ? this.value.map((e) => e.id > 0 ? e : c(d({}, e), { id: Math.random() })) : this.value : [];
+        {
+          const e = ((s = this.value) == null ? void 0 : s.split(this.separator)) || [];
+          return e.length && e[0] ? e.map((a) => this.objectMode ? { name: a, id: Math.random() } : a) : [];
+        }
+      }
+    }
+  },
+  methods: {
+    showInput() {
+      return r(this, null, function* () {
+        this.inputVisible = !0, yield this.$nextTick(), this.$refs.saveTagInput.$refs.input.focus();
+      });
+    },
+    handleClose(t) {
+      const s = this.tags.filter((e) => e !== t);
+      this.$emit("input", this.arrayMode ? s : s.map((e) => e.name || e).join(this.separator));
+    },
+    handleInputConfirm() {
+      return r(this, null, function* () {
+        var s;
+        if (this.tags.length >= this.maxTag) {
+          this.$message.warning({ message: "标签已达上限,请删除一些标签再添加！", showClose: !0 }), this.inputVisible = !1, this.inputValue = "";
+          return;
+        }
+        const t = this.inputValue;
+        if (t) {
+          if (this.tags.some((a) => (a.name || a) === t)) {
+            this.inputVisible = !1, this.inputValue = "", this.$message.warning({ message: "标签已存在！", showClose: !0 });
+            return;
+          }
+          const e = [...this.tags];
+          e.push(this.objectMode ? { id: Date.now(), name: this.inputValue } : this.inputValue), this.$emit("input", this.arrayMode ? e : e.map((a) => a.name || a).join(this.separator)), yield this.$nextTick(), (s = this.elFormItem) == null || s.clearValidate();
+        }
+        this.inputVisible = !1, this.inputValue = "";
+      });
+    }
+  }
+}, m = {};
+var I = /* @__PURE__ */ V(
+  C,
+  w,
+  x,
+  !1,
+  M,
+  null,
+  null,
+  null
+);
+function M(t) {
+  for (let s in m)
+    this[s] = m[s];
+}
+const j = /* @__PURE__ */ function() {
+  return I.exports;
+}();
+export {
+  j as default
+};

package/x-input-tag/style.css

@@ -0,0 +1 @@
+.el-form-item.is-error .x-input-tag{border-color:#f56c6c}.x-input-tag{border:1px solid var(--border-color);border-radius:4px;height:120px;padding-top:4px;padding-right:4px;line-height:0;overflow:auto}.x-input-tag .el-tag .el-tag__close:hover{background-color:#ee8677}.x-input-tag .el-tag,.x-input-tag .button-new-tag{margin-bottom:4px;margin-left:4px}.x-input-tag .el-input.input-new-tag{width:120px;margin-bottom:4px;margin-left:4px}.x-input-tag .tags-count{color:#b7b7b7;font-size:.9em;position:absolute;bottom:10px;right:6px}

package/README.md

@@ -1,27 +0,0 @@
-# web-component
-
-## usage
-
-```js
-import { defineConfig } from 'vite'
-import styleImport from "vite-plugin-style-import";
-
-export default defineConfig({
-  plugins: [
-    styleImport({
-      libs: [{
-        libraryName: '@web-utils/component',
-        base: '@web-utils/component/dist/base.css',
-        ensureStyleFile: true,
-        libraryNameChangeCase: 'pascalCase',
-        resolveStyle: name => {
-          return `@web-utils/component/dist/${name}.css`
-        },
-        resolveComponent: name => {
-          return `@web-utils/component/dist/${name}.js`
-        }
-      }]
-    })
-  ]
-}
-```

package/dist/chunks/3d28cc08.js

@@ -1,57 +0,0 @@
-function normalizeComponent(scriptExports, render, staticRenderFns, functionalTemplate, injectStyles, scopeId, moduleIdentifier, shadowMode) {
-  var options = typeof scriptExports === "function" ? scriptExports.options : scriptExports;
-  if (render) {
-    options.render = render;
-    options.staticRenderFns = staticRenderFns;
-    options._compiled = true;
-  }
-  if (functionalTemplate) {
-    options.functional = true;
-  }
-  if (scopeId) {
-    options._scopeId = "data-v-" + scopeId;
-  }
-  var hook;
-  if (moduleIdentifier) {
-    hook = function(context) {
-      context = context || this.$vnode && this.$vnode.ssrContext || this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext;
-      if (!context && typeof __VUE_SSR_CONTEXT__ !== "undefined") {
-        context = __VUE_SSR_CONTEXT__;
-      }
-      if (injectStyles) {
-        injectStyles.call(this, context);
-      }
-      if (context && context._registeredComponents) {
-        context._registeredComponents.add(moduleIdentifier);
-      }
-    };
-    options._ssrRegister = hook;
-  } else if (injectStyles) {
-    hook = shadowMode ? function() {
-      injectStyles.call(
-        this,
-        (options.functional ? this.parent : this).$root.$options.shadowRoot
-      );
-    } : injectStyles;
-  }
-  if (hook) {
-    if (options.functional) {
-      options._injectStyles = hook;
-      var originalRender = options.render;
-      options.render = function renderWithStyleInjection(h, context) {
-        hook.call(context);
-        return originalRender(h, context);
-      };
-    } else {
-      var existing = options.beforeCreate;
-      options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
-    }
-  }
-  return {
-    exports: scriptExports,
-    options
-  };
-}
-export {
-  normalizeComponent as n
-};

package/dist/chunks/5d33812d.js

@@ -1,147 +0,0 @@
-import { i as filterProperties } from "./c69d5628.js";
-import { Col, FormItem } from "element-ui";
-const elColManualBindKeys = ["span"];
-const elColKeys = [...Object.keys(Col.props)];
-const elColAutoBindKeys = elColKeys.filter((key) => !elColManualBindKeys.includes(key));
-const elFormItemManualBindKeys = ["label", "prop", "rules", "labelWidth", "required"];
-const elFormItemKeys = [...Object.keys(FormItem.props)];
-const elFormItemAutoBindKeys = elFormItemKeys.filter((key) => !elFormItemManualBindKeys.includes(key));
-const formItemAutoBindKeys = [
-  "wrapCol",
-  "wrapFormItem",
-  "unwrap",
-  "prefixConfig",
-  "block",
-  "placeholder",
-  "prefixPick",
-  "half",
-  ...elColKeys,
-  ...elFormItemKeys
-];
-const formItemMixin = {
-  inject: {
-    elForm: {
-      default: {}
-    },
-    formItemGroup: {
-      default: {}
-    }
-  },
-  props: {
-    disabled: Boolean,
-    wrapCol: {
-      type: Boolean,
-      default: true
-    },
-    wrapFormItem: {
-      type: Boolean,
-      default: true
-    },
-    unwrap: Boolean,
-    half: Boolean,
-    prefixConfig: Boolean,
-    block: Boolean,
-    placeholder: {
-      type: [Boolean, String],
-      default: true
-    },
-    formItemClass: String,
-    prefixPick: Boolean,
-    label: String,
-    labelWidth: String,
-    prop: String,
-    required: Boolean,
-    rules: [Object, Array],
-    error: String,
-    validateStatus: String,
-    for: String,
-    inlineMessage: {
-      type: [String, Boolean],
-      default: ""
-    },
-    showMessage: {
-      type: Boolean,
-      default: true
-    },
-    size: String,
-    span: {
-      type: Number,
-      default: 12
-    },
-    tag: {
-      type: String,
-      default: "div"
-    },
-    offset: Number,
-    pull: Number,
-    push: Number,
-    xs: [Number, Object],
-    sm: [Number, Object],
-    md: [Number, Object],
-    lg: [Number, Object],
-    xl: [Number, Object]
-  },
-  computed: {
-    prefix() {
-      if (this.prefixConfig) {
-        return "请配置";
-      } else if (this.prefixPick) {
-        return "请选择";
-      } else {
-        return "请输入";
-      }
-    },
-    message() {
-      var _a;
-      return `${this.prefix}${((_a = this.label) == null ? void 0 : _a.replace("：", "")) || ""}`;
-    },
-    computeRules() {
-      const rules = [...this.rules || []];
-      if (this.required) {
-        const requireRule = rules.find((value) => value.required);
-        if (requireRule) {
-          if (!requireRule.ref) {
-            requireRule.message = rules.message || this.message;
-          } else {
-            requireRule.label = requireRule.label || this.label;
-          }
-        } else {
-          rules.unshift(this.getRequireRule());
-        }
-      }
-      return rules.concat(this.getRules());
-    },
-    computeSpan() {
-      return this.block ? 24 : this.span;
-    },
-    formItemProps() {
-      return filterProperties({ ...this.$props, ...this.$attrs }, formItemAutoBindKeys);
-    },
-    elFormItemProps() {
-      return filterProperties({ ...this.$props, ...this.$attrs }, elFormItemAutoBindKeys);
-    },
-    elColProps() {
-      return filterProperties({ ...this.$props, ...this.$attrs }, elColAutoBindKeys);
-    }
-  },
-  watch: {
-    computeRules() {
-      var _a, _b;
-      (_b = (_a = this.elForm) == null ? void 0 : _a.clearValidate) == null ? void 0 : _b.call(_a, this.prop);
-    }
-  },
-  methods: {
-    getRules() {
-      return [];
-    },
-    getRequireRule() {
-      return {
-        required: true,
-        message: this.message
-      };
-    }
-  }
-};
-export {
-  formItemMixin as f
-};

package/dist/chunks/9d848bf6.js

@@ -1,99 +0,0 @@
-const parentMixin = {
-  mounted() {
-    if (this.value >= 0) {
-      this.currentIndex = this.value;
-    }
-    this.updateIndex();
-  },
-  methods: {
-    updateIndex() {
-      if (!this.$children || !this.$children.length) {
-        return;
-      }
-      this.number = this.$children.length;
-      const children = this.$children;
-      for (let i = 0; i < children.length; i++) {
-        children[i].currentIndex = i;
-        if (children[i].currentSelected) {
-          this.index = i;
-        }
-      }
-    }
-  },
-  props: {
-    value: Number
-  },
-  watch: {
-    currentIndex(val, oldVal) {
-      oldVal > -1 && this.$children[oldVal] && (this.$children[oldVal].currentSelected = false);
-      val > -1 && this.$children[val] && (this.$children[val].currentSelected = true);
-      this.$emit("input", val);
-      this.$emit("on-index-change", val, oldVal);
-    },
-    index(val) {
-      this.currentIndex = val;
-    },
-    value(val) {
-      this.index = val;
-    }
-  },
-  data() {
-    return {
-      index: -1,
-      currentIndex: this.index,
-      number: this.$children.length
-    };
-  }
-};
-const childMixin = {
-  props: {
-    selected: {
-      type: Boolean,
-      default: false
-    }
-  },
-  mounted() {
-    this.$parent.updateIndex();
-  },
-  beforeDestroy() {
-    const $parent = this.$parent;
-    this.$nextTick(() => {
-      $parent.updateIndex();
-    });
-  },
-  methods: {
-    onItemClick(hasLink) {
-      if (this.$parent.preventDefault) {
-        this.$parent.$emit("on-before-index-change", this.currentIndex);
-        return;
-      }
-      if (typeof this.disabled === "undefined" || this.disabled === false) {
-        this.currentSelected = true;
-        this.$parent.currentIndex = this.currentIndex;
-        this.$nextTick(() => {
-          this.$emit("on-item-click", this.currentIndex);
-        });
-      }
-    }
-  },
-  watch: {
-    currentSelected(val) {
-      if (val) {
-        this.$parent.index = this.currentIndex;
-      }
-    },
-    selected(val) {
-      this.currentSelected = val;
-    }
-  },
-  data() {
-    return {
-      currentIndex: -1,
-      currentSelected: this.selected
-    };
-  }
-};
-export {
-  childMixin as c,
-  parentMixin as p
-};

package/dist/chunks/a0bb327b.js

@@ -1,96 +0,0 @@
-import { MessageBox, Loading } from "element-ui";
-import { isFunction } from "@web-utils/core";
-async function onClick(e, props, listeners) {
-  const { stop, prevent, message, loadable, loadingText, confirmable, confirmType, confirmText } = props;
-  if (stop) {
-    e.stopPropagation();
-  }
-  if (prevent) {
-    e.preventDefault();
-  }
-  const { before, click, cancel, after } = listeners;
-  if (isFunction(click)) {
-    try {
-      let pass = true;
-      if (isFunction(before)) {
-        pass = await before(e);
-      }
-      if (pass === false) {
-        return;
-      }
-      if (confirmable) {
-        await MessageBox.confirm(message || confirmText, { type: confirmType });
-      }
-      let loadingInstance;
-      if (loadable) {
-        loadingInstance = Loading.service({ background: "rgba(0,0,0,0.3)", text: loadingText });
-      }
-      try {
-        await click(e);
-      } catch (e2) {
-      }
-      if (loadable) {
-        loadingInstance.close();
-      }
-      if (isFunction(after)) {
-        await after(e);
-      }
-    } catch (e2) {
-      if (isFunction(cancel)) {
-        await cancel(e2);
-      }
-    }
-  }
-}
-const confirmableMixin = {
-  functional: true,
-  props: {
-    stop: {
-      type: Boolean,
-      default: true
-    },
-    prevent: {
-      type: Boolean,
-      default: true
-    },
-    text: {
-      type: String,
-      default: ""
-    },
-    message: {
-      type: String,
-      default: "你确定要删除该记录吗？"
-    },
-    confirmable: {
-      type: Boolean,
-      default: true
-    },
-    confirmText: {
-      type: String,
-      default: "你确定要删除该记录吗？"
-    },
-    confirmType: {
-      type: String,
-      default: "warning"
-    },
-    loadable: Boolean,
-    loadingText: {
-      type: String,
-      default: "正在处理中请稍候..."
-    },
-    tag: {
-      type: String,
-      default: "i"
-    }
-  },
-  render(createElement, { props, data, children, listeners }) {
-    return createElement(props.tag, {
-      ...data,
-      on: { click: (e) => onClick(e, props, listeners) },
-      props
-    }, children || props.text);
-  }
-};
-export {
-  confirmableMixin as c
-};

package/dist/chunks/a8891d2c.js

@@ -1,30 +0,0 @@
-function secondsToStr(temp) {
-  const years = Math.floor(temp / 31536e3);
-  if (years) {
-    return `${years} 年${numberEnding(years)}`;
-  }
-  const days = Math.floor((temp %= 31536e3) / 86400);
-  if (days) {
-    return `${days} 天${numberEnding(days)}`;
-  }
-  const hours = Math.floor((temp %= 86400) / 3600);
-  if (hours) {
-    return `${hours} 时${numberEnding(hours)}`;
-  }
-  const minutes = Math.floor((temp %= 3600) / 60);
-  if (minutes) {
-    return `${minutes} 分${numberEnding(minutes)}`;
-  }
-  const seconds = temp % 60;
-  return `${seconds} 秒${numberEnding(seconds)}`;
-  function numberEnding(number) {
-    return number > 1 ? "" : "";
-  }
-}
-function kebabCase(s) {
-  return s.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);
-}
-export {
-  kebabCase as k,
-  secondsToStr as s
-};