@cldemo/ui-kit 1.1.1 → 1.1.3

package/buildLibs/utils/Shared/Index.vue_vue_type_script_setup_true_lang-D_XMW7K4.js

@@ -0,0 +1,415 @@
+import { defineComponent as Y, useTemplateRef as Z, computed as d, openBlock as s, createElementBlock as r, normalizeClass as O, unref as _, createElementVNode as P, mergeProps as ie, toDisplayString as ee, createCommentVNode as re, createBlock as ne, withKeys as Q, withModifiers as R, Fragment as k, renderSlot as I, ref as B, onMounted as ce, onBeforeUnmount as de, watch as pe, normalizeStyle as fe, createVNode as me, createSlots as W, withCtx as V, nextTick as ye } from "vue";
+/* empty css               */
+/* empty css                   */
+import u from "@cldemo/ui-kit/common/base";
+import ge from "@cldemo/ui-kit/common/Element";
+import { _ as X } from "./Index.vue_vue_type_script_setup_true_lang-C2LGy18j.js";
+const ve = ["id"], he = ["type", "inputmode", "name", "value", "placeholder", "disabled", "readonly"], Ce = {
+  key: 0,
+  class: "input-floating-label"
+}, Se = {
+  key: 3,
+  class: "input-suffix"
+}, N = /* @__PURE__ */ Y({
+  name: "ClInputContainer",
+  components: {
+    ClIconFont: X
+  },
+  __name: "Container",
+  props: {
+    id: String,
+    // desc: 唯一标识
+    name: String,
+    // desc: 输入框名称
+    value: [String, Number],
+    // desc: 输入值
+    inputType: {
+      type: String,
+      default: "text"
+      // desc: 输入框类型
+    },
+    inputmode: {
+      type: String,
+      default: ""
+      // desc: 输入模式（移动端键盘类型，如 numeric / decimal）
+    },
+    autocomplete: {
+      type: String,
+      default: "off"
+      // desc: 原生 autocomplete 属性（验证码输入建议传 one-time-code 触发系统短信自动填充）
+    },
+    placeholder: String,
+    // desc: 占位提示文本
+    label: String,
+    // desc: 浮动标签文字（配合 isFloating 使用）
+    isFloating: {
+      type: Boolean,
+      default: !1
+      // desc: 是否启用浮动标签
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+      // desc: 是否禁用
+    },
+    isReadonly: {
+      type: Boolean,
+      default: !1
+      // desc: 是否只读
+    },
+    isClean: {
+      type: Boolean,
+      default: !0
+      // desc: 是否显示清除按钮
+    },
+    isShowSuffix: {
+      type: Boolean,
+      default: !1
+      // desc: 是否显示后缀插槽
+    }
+  },
+  emits: ["onInputText", "onKeydown", "onKeyup", "onFocus", "onBlur", "onClear"],
+  setup(t, { expose: E, emit: F }) {
+    const n = t, o = F, T = n.id, p = Z("refElInput"), C = d(() => {
+      let l = n.name;
+      return u.isEmpty(l) && (l = `input_${u.getRandom(8)}`), l;
+    }), v = d(() => u.isEmpty(n.inputmode) ? void 0 : n.inputmode), a = d(() => {
+      const l = {};
+      return u.isNonEmptyString(n.autocomplete) && (l.autocomplete = n.autocomplete), l;
+    }), f = d(() => n.isClean && !n.disabled && !n.isReadonly), S = d(() => f.value && !u.isEmpty(n.value)), c = d(() => n.isFloating ? n.label || n.placeholder : ""), y = d(() => ({
+      "input-container": !0,
+      // input-clean 与 disabled 解耦：类只决定清除按钮占位 padding（恒定 24px），
+      // disabled 时按钮显示由 optIsShowClean 单独控制 → 文字/数字位置不随禁用态跳动
+      "input-clean": n.isClean,
+      "input-suffix": n.isShowSuffix,
+      "input-floating": n.isFloating
+    })), K = (l) => {
+      const x = l.target;
+      x && o("onInputText", x.value);
+    }, D = (l) => {
+      o("onKeydown", l);
+    }, $ = (l) => {
+      o("onKeyup", l);
+    }, h = () => {
+      o("onFocus");
+    }, w = () => {
+      o("onBlur");
+    }, b = () => {
+      o("onClear");
+    };
+    return E({
+      getInputElement: () => p.value,
+      focus: () => {
+        p.value?.focus();
+      }
+    }), (l, x) => (s(), r("div", {
+      id: _(T),
+      class: O(y.value)
+    }, [
+      P("input", ie({
+        ref_key: "refElInput",
+        ref: p,
+        type: t.inputType,
+        inputmode: v.value,
+        name: C.value
+      }, a.value, {
+        class: "form-control",
+        value: t.value,
+        placeholder: t.placeholder,
+        disabled: t.disabled,
+        readonly: t.isReadonly,
+        onInput: K,
+        onKeydown: D,
+        onKeyup: $,
+        onFocus: h,
+        onBlur: w
+      }), null, 16, he),
+      c.value ? (s(), r("label", Ce, ee(c.value), 1)) : re("", !0),
+      S.value ? (s(), ne(X, {
+        key: 1,
+        name: "close-circle-fill",
+        class: "input-clear-icon",
+        "aria-label": "清除输入内容",
+        role: "button",
+        tabindex: "-1",
+        onClick: R(b, ["stop"]),
+        onKeydown: [
+          Q(R(b, ["stop"]), ["enter"]),
+          Q(R(b, ["stop", "prevent"]), ["space"])
+        ]
+      }, null, 8, ["onKeydown"])) : (s(), r(k, { key: 2 }, [], 64)),
+      t.isShowSuffix ? (s(), r("div", Se, [
+        I(l.$slots, "suffix")
+      ])) : (s(), r(k, { key: 4 }, [], 64))
+    ], 10, ve));
+  }
+}), be = ["id"], xe = {
+  key: 0,
+  class: "cl-plaintext-value"
+}, Ie = {
+  key: 0,
+  class: "input-group-prepend"
+}, ke = { class: "input-group-text" }, we = {
+  key: 2,
+  class: "input-group-append"
+}, Be = { class: "input-group-text" }, Oe = /* @__PURE__ */ Y({
+  name: "ClInput",
+  components: {
+    ClInputContainer: N
+  },
+  __name: "Index",
+  props: {
+    id: String,
+    // desc: 唯一标识
+    name: String,
+    // desc: 输入框名称
+    value: [String, Number],
+    // desc: 输入值
+    className: String,
+    // desc: 自定义CSS类名
+    disabled: {
+      type: Boolean,
+      default: !1
+      // desc: 是否禁用
+    },
+    theme: {
+      type: String,
+      default: "default"
+      // desc: 主题 | enum: default, icon, bottomLine (可自定义)
+    },
+    inputType: String,
+    // desc: 输入框类型
+    inputmode: {
+      type: String,
+      default: ""
+      // desc: 输入模式（移动端键盘类型，如 numeric / decimal）
+    },
+    autocomplete: {
+      type: String,
+      default: "off"
+      // desc: 原生 autocomplete 属性（验证码输入建议传 one-time-code 触发系统短信自动填充）
+    },
+    width: String,
+    // desc: 宽度
+    placeholder: String,
+    // desc: 占位提示文本
+    label: String,
+    // desc: 浮动标签文字（配合 isFloating 使用）
+    isFloating: {
+      type: Boolean,
+      default: !1
+      // desc: 是否启用浮动标签
+    },
+    isReadonly: {
+      type: Boolean,
+      default: !1
+      // desc: 是否只读
+    },
+    isClean: {
+      type: Boolean,
+      default: !0
+      // desc: 是否显示清除按钮
+    },
+    isPlaintext: {
+      type: Boolean,
+      default: !1
+      // desc: 是否纯文本只读模式，只渲染文本不挂载输入控件（不渲染 prepend/append/suffix 插槽）
+    },
+    changeDelayTime: {
+      type: Number,
+      default: 200
+      // desc: 延迟变更时间（毫秒）
+    }
+  },
+  emits: ["update:value", "update:modelValue", "onChange", "onFocus", "onBlur", "onChangeBlur", "onKeyupEnter", "onClear", "onInit", "onKeydown", "onKeyup", "onChangeDelay"],
+  setup(t, { expose: E, emit: F }) {
+    const n = t, o = F, T = n.id, p = Z("refElContainer"), C = B(!1), v = u.isString(n.value) ? n.value : n.value !== void 0 && u.isNumber(n.value) && u.isFinite(n.value) ? n.value.toString() : "", a = B(v), f = B(v), S = B(v), c = {
+      prevDelayValue: v,
+      valueDelayRun: !1
+    };
+    let y = null;
+    const K = d(() => {
+      let e = {
+        "panel-input": !0,
+        "input-disabled": n.disabled,
+        "input-readonly": n.isReadonly
+      };
+      return e = u.getJsonMerge(e, ge.getClassNameJson(n.className)), u.isEmpty(n.theme, "default") || (e[`input-${n.theme}`] = !0), e;
+    }), D = d(() => {
+      const e = {};
+      return u.isNonEmptyString(n.width) && (e.width = n.width), e;
+    }), $ = (e) => {
+      h(), c.valueDelayRun = !0, y = setTimeout(() => {
+        y = null, f.value === e && (c.valueDelayRun = !1, c.prevDelayValue !== e && (c.prevDelayValue = e, o("onChangeDelay", e)));
+      }, n.changeDelayTime);
+    }, h = () => {
+      y && (clearTimeout(y), y = null), c.valueDelayRun = !1;
+    }, w = (e) => {
+      if (e !== f.value) {
+        f.value = e;
+        const i = m(e);
+        o("update:value", i), o("update:modelValue", i), o("onChange", i), $(i);
+      }
+    }, b = (e) => {
+      C.value = !0, S.value = e, o("onFocus", e);
+    }, M = (e) => {
+      C.value = !1, o("onBlur", e), e !== S.value && (S.value = e, o("onChangeBlur", e));
+    }, z = (e) => {
+      o("onKeyupEnter", e);
+    }, l = (e) => {
+      o("onKeydown", e);
+    }, x = (e) => {
+      o("onKeyup", e);
+    }, te = () => {
+      o("onClear");
+    }, oe = () => {
+      ye(() => {
+        o("onInit");
+      });
+    }, m = (e) => u.isString(e) || u.isNumber(e) && u.isFinite(e) ? e.toString() : "", J = () => {
+      p.value?.focus();
+    }, le = () => {
+      const e = m(n.value);
+      u.isEmpty(e) || (a.value = e, f.value = e), oe();
+    };
+    ce(() => {
+      le();
+    }), de(() => {
+      h();
+    }), pe(
+      () => n.value,
+      (e) => {
+        const i = m(e);
+        i !== a.value && (a.value = i, f.value = i, c.prevDelayValue = i, c.valueDelayRun && h());
+      }
+    );
+    const L = (e) => {
+      a.value = e, w(e);
+    }, U = (e) => {
+      l(e);
+    }, A = (e) => {
+      const i = e.key, g = e.keyCode;
+      if (i === "Enter" || g === 13) {
+        const ue = e.target, se = m(ue.value);
+        z(se);
+      } else
+        x(e);
+    }, j = () => {
+      const e = m(a.value);
+      b(e);
+    }, q = () => {
+      const e = m(a.value);
+      M(e);
+    }, G = () => {
+      a.value = "", w(""), te(), J();
+    }, ae = () => {
+      const e = p.value;
+      return e ? e.getInputElement() : null;
+    }, H = () => m(a.value);
+    return E({
+      getValue: H,
+      getValueData: () => ({ value: H(), show: a.value }),
+      setValue: (e, i) => {
+        const g = m(e);
+        a.value = g, f.value = g, c.prevDelayValue = g, c.valueDelayRun && h(), i && (o("update:value", g), o("update:modelValue", g));
+      },
+      focus: () => {
+        J();
+      },
+      getInputElement: ae
+    }), (e, i) => (s(), r("div", {
+      id: _(T),
+      class: O(K.value),
+      style: fe(D.value)
+    }, [
+      t.isPlaintext ? (s(), r("div", xe, ee(a.value), 1)) : (s(), r(k, { key: 1 }, [
+        e.$slots.prepend || e.$slots.append ? (s(), r("div", {
+          key: 0,
+          class: O({ "input-group": !0, "input-group-focus": C.value })
+        }, [
+          e.$slots.prepend ? (s(), r("div", Ie, [
+            P("span", ke, [
+              I(e.$slots, "prepend")
+            ])
+          ])) : (s(), r(k, { key: 1 }, [], 64)),
+          me(N, {
+            ref_key: "refElContainer",
+            ref: p,
+            value: a.value,
+            inputType: t.inputType,
+            inputmode: t.inputmode,
+            autocomplete: t.autocomplete,
+            name: t.name,
+            placeholder: t.placeholder,
+            disabled: t.disabled,
+            isReadonly: t.isReadonly,
+            isClean: t.isClean,
+            isShowSuffix: !!e.$slots.suffix,
+            label: t.label,
+            isFloating: t.isFloating,
+            onOnInputText: L,
+            onOnKeydown: U,
+            onOnKeyup: A,
+            onOnFocus: j,
+            onOnBlur: q,
+            onOnClear: G
+          }, W({ _: 2 }, [
+            e.$slots.suffix ? {
+              name: "suffix",
+              fn: V(() => [
+                I(e.$slots, "suffix")
+              ]),
+              key: "0"
+            } : {
+              name: "suffix",
+              fn: V(() => []),
+              key: "1"
+            }
+          ]), 1032, ["value", "inputType", "inputmode", "autocomplete", "name", "placeholder", "disabled", "isReadonly", "isClean", "isShowSuffix", "label", "isFloating"]),
+          e.$slots.append ? (s(), r("div", we, [
+            P("span", Be, [
+              I(e.$slots, "append")
+            ])
+          ])) : (s(), r(k, { key: 3 }, [], 64))
+        ], 2)) : (s(), ne(N, {
+          key: 1,
+          ref_key: "refElContainer",
+          ref: p,
+          value: a.value,
+          inputType: t.inputType,
+          inputmode: t.inputmode,
+          autocomplete: t.autocomplete,
+          name: t.name,
+          placeholder: t.placeholder,
+          disabled: t.disabled,
+          isReadonly: t.isReadonly,
+          isClean: t.isClean,
+          isShowSuffix: !!e.$slots.suffix,
+          label: t.label,
+          isFloating: t.isFloating,
+          onOnInputText: L,
+          onOnKeydown: U,
+          onOnKeyup: A,
+          onOnFocus: j,
+          onOnBlur: q,
+          onOnClear: G
+        }, W({ _: 2 }, [
+          e.$slots.suffix ? {
+            name: "suffix",
+            fn: V(() => [
+              I(e.$slots, "suffix")
+            ]),
+            key: "0"
+          } : {
+            name: "suffix",
+            fn: V(() => []),
+            key: "1"
+          }
+        ]), 1032, ["value", "inputType", "inputmode", "autocomplete", "name", "placeholder", "disabled", "isReadonly", "isClean", "isShowSuffix", "label", "isFloating"]))
+      ], 64))
+    ], 14, be));
+  }
+});
+export {
+  Oe as _
+};

package/buildLibs/utils/Shared/Index.vue_vue_type_script_setup_true_lang-D_YbdXMB.js

@@ -0,0 +1 @@
+"use strict";const e=require("vue"),ee=require("@cldemo/ui-kit/common/log"),l=require("@cldemo/ui-kit/common/base"),T=require("@cldemo/ui-kit/common/Element"),L=require("./Index.vue_vue_type_script_setup_true_lang-CZNVHUR1.js"),te=require("./Index.vue_vue_type_script_setup_true_lang-uhKZpiAd.js"),oe=require("./Index.vue_vue_type_script_setup_true_lang-CFZ5jK-q.js"),le=require("./index-CcHdm5g3.js");;/* empty css              */const ne=["id"],ae=["disabled","aria-label"],re={key:2,class:"btn-label"},se={key:0,class:"btn-loading"},ce={class:"btn-body-backdrop-container"},ie={class:"btn-body-backdrop-text"},ue=e.defineComponent({name:"ClButton",directives:{clwaves:le.wavesBind},__name:"Index",props:{id:String,className:String,disabled:{type:Boolean,default:!1},classBtn:String,label:String,icon:String,iconName:String,color:{type:String,default:"default"},size:{type:String,validator:n=>n===void 0||["large","small","xl"].indexOf(n)!==-1},isShowLoad:{type:Boolean,default:!1},loadPos:{type:String,default:"right",validator:n=>["right","zoom-out","fixedCenter"].indexOf(n)!==-1},loadTheme:{type:String,default:"rotaryLine"},loadColor:String,loadDrift:{type:Boolean,default:!0},loadText:{type:String,default:"加载中"},isShowBackDrop:{type:Boolean,default:!1},teleportTarget:{type:String,default:""},backdropOpacity:{type:Number,default:.02,validator:n=>n>=0&&n<=1},isShowWaves:{type:Boolean,default:!0},wavesColor:{type:String,default:"white"},loadStatusIsIng:{type:[Boolean,null],default:null}},emits:{onClick:()=>!0},setup(n,{expose:N,emit:I}){const t=n,D=I,R=t.id,_=e.useSlots(),a=e.ref(!1),i=e.ref(!1),f=e.ref(!1),r=e.useTemplateRef("refElBtn"),m=e.useTemplateRef("refElContent"),v=e.ref(!1),w=e.ref("");let s=null,g=!1,u=null;typeof window<"u"&&l.isEmpty(t.label)&&l.isEmpty(t.icon)&&l.isEmpty(t.iconName)&&!_.default&&ee.warn("ClButton","警告：label、icon、iconName 或默认插槽必须传一个值");const b=e.computed(()=>!l.isEmpty(t.label)||!!_.default),k=e.computed(()=>{const o=t.icon||t.iconName;return l.isNonEmptyString(o)?o:""}),V=e.computed(()=>b.value&&t.label||"按钮"),q=e.computed(()=>t.disabled?!0:a.value),d=e.computed(()=>t.loadPos==="fixedCenter"),O=e.computed(()=>t.loadColor||"var(--cl-bg, #ffffff)"),W=e.computed(()=>t.loadColor||w.value),F=e.computed(()=>`rgba(0, 0, 0, ${t.backdropOpacity})`),$=e.computed(()=>{let o=t.wavesColor||"white";return(l.isExistValue(t.color,"white")||l.isExistValue(t.color,"grayLight")||l.isExistValue(t.color,"text"))&&(o="black"),o}),P=e.computed(()=>t.isShowWaves?{color:$.value}:!1),B=e.computed(()=>{let o=t.loadPos||"right";return l.isExistValue(t.classBtn,"btn-circle")&&l.isExistValue(o,"right")&&(o="zoom-out"),o}),S=e.computed(()=>{let o="";switch(t.loadTheme){case"rotaryLine":o=l.isExistValue(t.classBtn,"btn-circle")?"":"large";break;case"circleNotch":default:o="large";break;case"circleBubble":o="";break}return o}),J=e.computed(()=>{const o={"panel-button":!0};return l.getJsonMerge(o,T.getClassNameJson(t.className))}),M=e.computed(()=>{let o={"btn-parent":!0,btn:!0};return l.isEmpty(t.color)||(o[`btn-${t.color}`]=!0),o=l.getJsonMerge(o,T.getClassNameJson(t.classBtn)),l.isEmpty(t.size)||(o[`btn-${t.size}`]=!0),o["btn-load-ing"]=a.value,a.value&&(o[`btn-load-${B.value}`]=!0,o[`btn-load-${t.loadTheme}`]=!0,o["btn-load-nodrift"]=!t.loadDrift||B.value==="right"&&v.value),o}),A=e.computed(()=>{const o=a.value&&d.value;return{"btn-body-backdrop-main":!0,animated:!0,zoomIn:o,zoomOut:!o}}),U=e.computed(()=>{const o={};return(b.value||k.value)&&B.value==="zoom-out"&&a.value&&!d.value&&(o.opacity=0),o}),j=()=>{D("onClick")},G=()=>{if(l.isExistValue(t.classBtn,"btn-circle"))return 20;switch(t.loadTheme){case"circleNotch":return 24;case"circleBubble":return 30;case"rotaryLine":default:return t.size==="small"?20:30}},E=()=>{if(typeof window>"u"||!r.value)return;const o=r.value.querySelector(".btn-label")||r.value.querySelector(".btn-icon")||r.value,p=window.getComputedStyle(o).color;l.isEmpty(p)||(w.value=p)},h=()=>{if(typeof window>"u"||!r.value||!m.value||a.value)return;const o=r.value,c=m.value.children;if(!c.length){v.value=!0;return}const Q=o.getBoundingClientRect(),z=c[c.length-1].getBoundingClientRect(),X=z.right-c[0].getBoundingClientRect().left,Y=Q.right-z.right,Z=G()+6+5;v.value=Y>=Z&&X>0},H=()=>{C(),!(typeof window>"u"||!r.value||!window.ResizeObserver)&&(u=new window.ResizeObserver(()=>{h()}),u.observe(r.value))},C=()=>{u&&(u.disconnect(),u=null)},y=()=>{a.value||(s&&(clearTimeout(s),s=null),t.isShowBackDrop&&(i.value=!0,f.value=!0),a.value=!0)},x=()=>{t.isShowBackDrop&&(d.value?e.nextTick(()=>{g||(s=setTimeout(()=>{g||(i.value=!1,f.value=!1,s=null)},200))}):i.value=!1),a.value=!1};e.onMounted(()=>{e.nextTick(()=>{E(),h(),H()})}),e.onBeforeUnmount(()=>{g=!0,C(),s&&(clearTimeout(s),s=null)}),e.watch(()=>[t.label,t.icon,t.iconName,t.size,t.loadTheme,t.classBtn,t.loadDrift,t.color],()=>{e.nextTick(()=>{E(),h()})}),e.watch(()=>t.loadStatusIsIng,o=>{l.isBoolean(o)&&(o?y():x())},{immediate:!0});const K=()=>{t.disabled||(t.isShowLoad&&y(),j())};return N({loadStart:()=>{y()},loadStop:()=>{x()}}),(o,p)=>{const c=e.resolveDirective("clwaves");return e.openBlock(),e.createElementBlock("span",{id:e.unref(R),class:e.normalizeClass(J.value)},[e.withDirectives((e.openBlock(),e.createElementBlock("button",{type:"button",class:e.normalizeClass(M.value),disabled:q.value,"aria-label":V.value,ref_key:"refElBtn",ref:r,onClick:K},[e.createElementVNode("span",{style:e.normalizeStyle(U.value),ref_key:"refElContent",ref:m},[k.value?(e.openBlock(),e.createBlock(oe._sfc_main,{key:0,name:k.value,className:"btn-icon"},null,8,["name"])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[],64)),b.value?(e.openBlock(),e.createElementBlock("span",re,[e.renderSlot(o.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(n.label),1)])])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:3},[],64))],4),a.value&&!d.value?(e.openBlock(),e.createElementBlock("span",se,[e.createVNode(L._sfc_main,{theme:n.loadTheme,size:S.value,color:W.value},null,8,["theme","size","color"])])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[],64))],10,ae)),[[c,P.value]]),i.value?(e.openBlock(),e.createBlock(te._sfc_main,{key:0,show:i.value,zIndex:1000001,duration:0,isLockScroll:!1,background:F.value,teleportTarget:n.teleportTarget},{default:e.withCtx(()=>[d.value&&f.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(A.value)},[e.createElementVNode("div",ce,[e.createVNode(L._sfc_main,{theme:n.loadTheme,size:S.value,color:O.value},null,8,["theme","size","color"]),e.createElementVNode("div",ie,e.toDisplayString(n.loadText||"加载中"),1)])],2)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[],64))]),_:1},8,["show","background","teleportTarget"])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[],64))],10,ne)}}});exports._sfc_main=ue;