@factoringplus/pl-components-pack-v3 0.5.30-pre-1 → 0.5.30-pre-2

package/dist/pl-components-pack-v3.es.js

@@ -2177,7 +2177,7 @@ var export_helper_default = (sfc, props) => {
 var arrow_down_vue_vue_type_script_lang_default = {
   name: "ArrowDown"
 };
-var _hoisted_16$3 = {
+var _hoisted_16$4 = {
   viewBox: "0 0 1024 1024",
   xmlns: "http://www.w3.org/2000/svg"
 }, _hoisted_26$1 = /* @__PURE__ */ createElementVNode("path", {
@@ -2187,13 +2187,13 @@ var _hoisted_16$3 = {
   _hoisted_26$1
 ];
 function _sfc_render6(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("svg", _hoisted_16$3, _hoisted_36);
+  return openBlock(), createElementBlock("svg", _hoisted_16$4, _hoisted_36);
 }
 var arrow_down_default = /* @__PURE__ */ export_helper_default(arrow_down_vue_vue_type_script_lang_default, [["render", _sfc_render6], ["__file", "arrow-down.vue"]]);
 var arrow_left_vue_vue_type_script_lang_default = {
   name: "ArrowLeft"
 };
-var _hoisted_18$2 = {
+var _hoisted_18$3 = {
   viewBox: "0 0 1024 1024",
   xmlns: "http://www.w3.org/2000/svg"
 }, _hoisted_28$1 = /* @__PURE__ */ createElementVNode("path", {
@@ -2203,7 +2203,7 @@ var _hoisted_18$2 = {
   _hoisted_28$1
 ];
 function _sfc_render8(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("svg", _hoisted_18$2, _hoisted_38);
+  return openBlock(), createElementBlock("svg", _hoisted_18$3, _hoisted_38);
 }
 var arrow_left_default = /* @__PURE__ */ export_helper_default(arrow_left_vue_vue_type_script_lang_default, [["render", _sfc_render8], ["__file", "arrow-left.vue"]]);
 var arrow_right_vue_vue_type_script_lang_default = {
@@ -3833,12 +3833,12 @@ const _sfc_main$1v = /* @__PURE__ */ defineComponent({
     const props = __props;
     const ns2 = useNamespace("icon");
     const style = computed$1(() => {
-      const { size, color } = props;
-      if (!size && !color)
+      const { size, color: color2 } = props;
+      if (!size && !color2)
         return {};
       return {
         fontSize: isUndefined$1(size) ? void 0 : addUnit(size),
-        "--color": color
+        "--color": color2
       };
     });
     return (_ctx, _cache) => {
@@ -7238,11 +7238,11 @@ function convertHexToDecimal(h2) {
 function parseIntFromHex(val) {
   return parseInt(val, 16);
 }
-function numberInputToObject(color) {
+function numberInputToObject(color2) {
   return {
-    r: color >> 16,
-    g: (color & 65280) >> 8,
-    b: color & 255
+    r: color2 >> 16,
+    g: (color2 & 65280) >> 8,
+    b: color2 & 255
   };
 }
 var names = {
@@ -7395,7 +7395,7 @@ var names = {
   yellow: "#ffff00",
   yellowgreen: "#9acd32"
 };
-function inputToRGB(color) {
+function inputToRGB(color2) {
   var rgb = { r: 0, g: 0, b: 0 };
   var a2 = 1;
   var s2 = null;
@@ -7403,35 +7403,35 @@ function inputToRGB(color) {
   var l2 = null;
   var ok = false;
   var format2 = false;
-  if (typeof color === "string") {
-    color = stringInputToObject(color);
+  if (typeof color2 === "string") {
+    color2 = stringInputToObject(color2);
   }
-  if (typeof color === "object") {
-    if (isValidCSSUnit(color.r) && isValidCSSUnit(color.g) && isValidCSSUnit(color.b)) {
-      rgb = rgbToRgb(color.r, color.g, color.b);
+  if (typeof color2 === "object") {
+    if (isValidCSSUnit(color2.r) && isValidCSSUnit(color2.g) && isValidCSSUnit(color2.b)) {
+      rgb = rgbToRgb(color2.r, color2.g, color2.b);
       ok = true;
-      format2 = String(color.r).substr(-1) === "%" ? "prgb" : "rgb";
-    } else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.v)) {
-      s2 = convertToPercentage(color.s);
-      v2 = convertToPercentage(color.v);
-      rgb = hsvToRgb(color.h, s2, v2);
+      format2 = String(color2.r).substr(-1) === "%" ? "prgb" : "rgb";
+    } else if (isValidCSSUnit(color2.h) && isValidCSSUnit(color2.s) && isValidCSSUnit(color2.v)) {
+      s2 = convertToPercentage(color2.s);
+      v2 = convertToPercentage(color2.v);
+      rgb = hsvToRgb(color2.h, s2, v2);
       ok = true;
       format2 = "hsv";
-    } else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.l)) {
-      s2 = convertToPercentage(color.s);
-      l2 = convertToPercentage(color.l);
-      rgb = hslToRgb(color.h, s2, l2);
+    } else if (isValidCSSUnit(color2.h) && isValidCSSUnit(color2.s) && isValidCSSUnit(color2.l)) {
+      s2 = convertToPercentage(color2.s);
+      l2 = convertToPercentage(color2.l);
+      rgb = hslToRgb(color2.h, s2, l2);
       ok = true;
       format2 = "hsl";
     }
-    if (Object.prototype.hasOwnProperty.call(color, "a")) {
-      a2 = color.a;
+    if (Object.prototype.hasOwnProperty.call(color2, "a")) {
+      a2 = color2.a;
     }
   }
   a2 = boundAlpha(a2);
   return {
     ok,
-    format: color.format || format2,
+    format: color2.format || format2,
     r: Math.min(255, Math.max(rgb.r, 0)),
     g: Math.min(255, Math.max(rgb.g, 0)),
     b: Math.min(255, Math.max(rgb.b, 0)),
@@ -7456,43 +7456,43 @@ var matchers = {
   hex4: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
   hex8: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/
 };
-function stringInputToObject(color) {
-  color = color.trim().toLowerCase();
-  if (color.length === 0) {
+function stringInputToObject(color2) {
+  color2 = color2.trim().toLowerCase();
+  if (color2.length === 0) {
     return false;
   }
   var named = false;
-  if (names[color]) {
-    color = names[color];
+  if (names[color2]) {
+    color2 = names[color2];
     named = true;
-  } else if (color === "transparent") {
+  } else if (color2 === "transparent") {
     return { r: 0, g: 0, b: 0, a: 0, format: "name" };
   }
-  var match = matchers.rgb.exec(color);
+  var match = matchers.rgb.exec(color2);
   if (match) {
     return { r: match[1], g: match[2], b: match[3] };
   }
-  match = matchers.rgba.exec(color);
+  match = matchers.rgba.exec(color2);
   if (match) {
     return { r: match[1], g: match[2], b: match[3], a: match[4] };
   }
-  match = matchers.hsl.exec(color);
+  match = matchers.hsl.exec(color2);
   if (match) {
     return { h: match[1], s: match[2], l: match[3] };
   }
-  match = matchers.hsla.exec(color);
+  match = matchers.hsla.exec(color2);
   if (match) {
     return { h: match[1], s: match[2], l: match[3], a: match[4] };
   }
-  match = matchers.hsv.exec(color);
+  match = matchers.hsv.exec(color2);
   if (match) {
     return { h: match[1], s: match[2], v: match[3] };
   }
-  match = matchers.hsva.exec(color);
+  match = matchers.hsva.exec(color2);
   if (match) {
     return { h: match[1], s: match[2], v: match[3], a: match[4] };
   }
-  match = matchers.hex8.exec(color);
+  match = matchers.hex8.exec(color2);
   if (match) {
     return {
       r: parseIntFromHex(match[1]),
@@ -7502,7 +7502,7 @@ function stringInputToObject(color) {
       format: named ? "name" : "hex8"
     };
   }
-  match = matchers.hex6.exec(color);
+  match = matchers.hex6.exec(color2);
   if (match) {
     return {
       r: parseIntFromHex(match[1]),
@@ -7511,7 +7511,7 @@ function stringInputToObject(color) {
       format: named ? "name" : "hex"
     };
   }
-  match = matchers.hex4.exec(color);
+  match = matchers.hex4.exec(color2);
   if (match) {
     return {
       r: parseIntFromHex(match[1] + match[1]),
@@ -7521,7 +7521,7 @@ function stringInputToObject(color) {
       format: named ? "name" : "hex8"
     };
   }
-  match = matchers.hex3.exec(color);
+  match = matchers.hex3.exec(color2);
   if (match) {
     return {
       r: parseIntFromHex(match[1] + match[1]),
@@ -7532,27 +7532,27 @@ function stringInputToObject(color) {
   }
   return false;
 }
-function isValidCSSUnit(color) {
-  return Boolean(matchers.CSS_UNIT.exec(String(color)));
+function isValidCSSUnit(color2) {
+  return Boolean(matchers.CSS_UNIT.exec(String(color2)));
 }
 var TinyColor = function() {
-  function TinyColor2(color, opts) {
-    if (color === void 0) {
-      color = "";
+  function TinyColor2(color2, opts) {
+    if (color2 === void 0) {
+      color2 = "";
     }
     if (opts === void 0) {
       opts = {};
     }
     var _a2;
-    if (color instanceof TinyColor2) {
-      return color;
+    if (color2 instanceof TinyColor2) {
+      return color2;
     }
-    if (typeof color === "number") {
-      color = numberInputToObject(color);
+    if (typeof color2 === "number") {
+      color2 = numberInputToObject(color2);
     }
-    this.originalInput = color;
-    var rgb = inputToRGB(color);
-    this.originalInput = color;
+    this.originalInput = color2;
+    var rgb = inputToRGB(color2);
+    this.originalInput = color2;
     this.r = rgb.r;
     this.g = rgb.g;
     this.b = rgb.b;
@@ -7821,12 +7821,12 @@ var TinyColor = function() {
     hsl.h = hue < 0 ? 360 + hue : hue;
     return new TinyColor2(hsl);
   };
-  TinyColor2.prototype.mix = function(color, amount) {
+  TinyColor2.prototype.mix = function(color2, amount) {
     if (amount === void 0) {
       amount = 50;
     }
     var rgb1 = this.toRgb();
-    var rgb2 = new TinyColor2(color).toRgb();
+    var rgb2 = new TinyColor2(color2).toRgb();
     var p2 = amount / 100;
     var rgba = {
       r: (rgb2.r - rgb1.r) * p2 + rgb1.r,
@@ -7907,13 +7907,13 @@ var TinyColor = function() {
     }
     return result;
   };
-  TinyColor2.prototype.equals = function(color) {
-    return this.toRgbString() === new TinyColor2(color).toRgbString();
+  TinyColor2.prototype.equals = function(color2) {
+    return this.toRgbString() === new TinyColor2(color2).toRgbString();
   };
   return TinyColor2;
 }();
-function darken(color, amount = 20) {
-  return color.mix("#141414", amount).toString();
+function darken(color2, amount = 20) {
+  return color2.mix("#141414", amount).toString();
 }
 function useButtonCustomStyle(props) {
   const _disabled = useDisabled();
@@ -7922,13 +7922,13 @@ function useButtonCustomStyle(props) {
     let styles = {};
     const buttonColor = props.color;
     if (buttonColor) {
-      const color = new TinyColor(buttonColor);
-      const activeBgColor = props.dark ? color.tint(20).toString() : darken(color, 20);
+      const color2 = new TinyColor(buttonColor);
+      const activeBgColor = props.dark ? color2.tint(20).toString() : darken(color2, 20);
       if (props.plain) {
         styles = ns2.cssVarBlock({
-          "bg-color": props.dark ? darken(color, 90) : color.tint(90).toString(),
+          "bg-color": props.dark ? darken(color2, 90) : color2.tint(90).toString(),
           "text-color": buttonColor,
-          "border-color": props.dark ? darken(color, 50) : color.tint(50).toString(),
+          "border-color": props.dark ? darken(color2, 50) : color2.tint(50).toString(),
           "hover-text-color": `var(${ns2.cssVarName("color-white")})`,
           "hover-bg-color": buttonColor,
           "hover-border-color": buttonColor,
@@ -7937,13 +7937,13 @@ function useButtonCustomStyle(props) {
           "active-border-color": activeBgColor
         });
         if (_disabled.value) {
-          styles[ns2.cssVarBlockName("disabled-bg-color")] = props.dark ? darken(color, 90) : color.tint(90).toString();
-          styles[ns2.cssVarBlockName("disabled-text-color")] = props.dark ? darken(color, 50) : color.tint(50).toString();
-          styles[ns2.cssVarBlockName("disabled-border-color")] = props.dark ? darken(color, 80) : color.tint(80).toString();
+          styles[ns2.cssVarBlockName("disabled-bg-color")] = props.dark ? darken(color2, 90) : color2.tint(90).toString();
+          styles[ns2.cssVarBlockName("disabled-text-color")] = props.dark ? darken(color2, 50) : color2.tint(50).toString();
+          styles[ns2.cssVarBlockName("disabled-border-color")] = props.dark ? darken(color2, 80) : color2.tint(80).toString();
         }
       } else {
-        const hoverBgColor = props.dark ? darken(color, 30) : color.tint(30).toString();
-        const textColor = color.isDark() ? `var(${ns2.cssVarName("color-white")})` : `var(${ns2.cssVarName("color-black")})`;
+        const hoverBgColor = props.dark ? darken(color2, 30) : color2.tint(30).toString();
+        const textColor = color2.isDark() ? `var(${ns2.cssVarName("color-white")})` : `var(${ns2.cssVarName("color-black")})`;
         styles = ns2.cssVarBlock({
           "bg-color": buttonColor,
           "text-color": textColor,
@@ -7955,7 +7955,7 @@ function useButtonCustomStyle(props) {
           "active-border-color": activeBgColor
         });
         if (_disabled.value) {
-          const disabledButtonColor = props.dark ? darken(color, 50) : color.tint(50).toString();
+          const disabledButtonColor = props.dark ? darken(color2, 50) : color2.tint(50).toString();
           styles[ns2.cssVarBlockName("disabled-bg-color")] = disabledButtonColor;
           styles[ns2.cssVarBlockName("disabled-text-color")] = props.dark ? "rgba(255, 255, 255, 0.5)" : `var(${ns2.cssVarName("color-white")})`;
           styles[ns2.cssVarBlockName("disabled-border-color")] = disabledButtonColor;
@@ -18249,9 +18249,9 @@ const _sfc_main$P = /* @__PURE__ */ defineComponent({
       return props.type === "line" ? 12 + props.strokeWidth * 0.4 : props.width * 0.111111 + 2;
     });
     const content = computed$1(() => props.format(props.percentage));
-    function getColors(color) {
-      const span = 100 / color.length;
-      const seriesColors = color.map((seriesColor, index) => {
+    function getColors(color2) {
+      const span = 100 / color2.length;
+      const seriesColors = color2.map((seriesColor, index) => {
         if (isString$1(seriesColor)) {
           return {
             color: seriesColor,
@@ -18264,16 +18264,16 @@ const _sfc_main$P = /* @__PURE__ */ defineComponent({
     }
     const getCurrentColor = (percentage) => {
       var _a2;
-      const { color } = props;
-      if (isFunction$1(color)) {
-        return color(percentage);
-      } else if (isString$1(color)) {
-        return color;
+      const { color: color2 } = props;
+      if (isFunction$1(color2)) {
+        return color2(percentage);
+      } else if (isString$1(color2)) {
+        return color2;
       } else {
-        const colors = getColors(color);
-        for (const color2 of colors) {
-          if (color2.percentage > percentage)
-            return color2.color;
+        const colors = getColors(color2);
+        for (const color22 of colors) {
+          if (color22.percentage > percentage)
+            return color22.color;
         }
         return (_a2 = colors[colors.length - 1]) == null ? void 0 : _a2.color;
       }
@@ -25376,7 +25376,7 @@ const _sfc_main$E = {
     const { model, rules: rules2 } = toRefs(props);
     const errorsState = ref([]);
     provide("errorsState", errorsState);
-    const validate = async (callback) => {
+    const validate = (callback) => {
       return new Promise((resolve, reject) => {
         const validator2 = new Schema(rules2.value);
         validator2.validate(model.value, (errors, fields) => {
@@ -25392,6 +25392,19 @@ const _sfc_main$E = {
         });
       });
     };
+    const validateField = (prop) => {
+      const rulesValidate = {};
+      const source2 = {};
+      rulesValidate[prop] = rules2.value[prop];
+      source2[prop] = model.value[prop];
+      const validator2 = new Schema(rulesValidate);
+      validator2.validate(source2, (errors, fields) => {
+        errorsState.value = errorsState.value.filter((error2) => error2.field !== prop);
+        if (errors) {
+          errorsState.value = errorsState.value.concat(errors);
+        }
+      });
+    };
     const clearValidate = (props2 = []) => {
       if (Array.isArray(props2) && props2.length > 0) {
         props2.forEach((prop) => {
@@ -25413,25 +25426,12 @@ const _sfc_main$E = {
         clearValidate(props2);
         model.value[props2] = null;
       } else {
+        clearValidate(props2);
         for (let prop in model.value) {
           model.value[prop] = null;
         }
-        clearValidate(props2);
       }
     };
-    const validateField = (prop) => {
-      const rulesValidate = {};
-      const source2 = {};
-      rulesValidate[prop] = rules2.value[prop];
-      source2[prop] = model.value[prop];
-      const validator2 = new Schema(rulesValidate);
-      validator2.validate(source2, (errors, fields) => {
-        errorsState.value = errorsState.value.filter((error2) => error2.field !== prop);
-        if (errors) {
-          errorsState.value = errorsState.value.concat(errors);
-        }
-      });
-    };
     const plFormRef = ref(null);
     onMounted(() => {
       const ref2 = plFormRef.value;
@@ -25901,7 +25901,7 @@ var _export_sfc = (sfc, props) => {
   }
   return target;
 };
-const _withScopeId$1 = (n2) => (pushScopeId("data-v-50fa79da"), n2 = n2(), popScopeId(), n2);
+const _withScopeId$1 = (n2) => (pushScopeId("data-v-71920af7"), n2 = n2(), popScopeId(), n2);
 const _hoisted_1$y = { class: "pl-input__container" };
 const _hoisted_2$t = {
   key: 0,
@@ -25911,20 +25911,45 @@ const _hoisted_3$o = {
   key: 1,
   class: "pl-input__optional"
 };
-const _hoisted_4$i = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ createElementVNode("span", { class: "pl-input__currency" }, "\u20BD", -1));
+const _hoisted_4$i = { class: "pl-input__wrapper" };
 const _hoisted_5$c = {
+  key: 0,
+  class: "pl-input__prefix"
+};
+const _hoisted_6$8 = ["disabled"];
+const _hoisted_7$6 = {
+  key: 1,
+  class: "pl-input__suffix"
+};
+const _hoisted_8$5 = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ createElementVNode("span", { class: "pl-input__currency" }, "\u20BD", -1));
+const _hoisted_9$5 = [
+  _hoisted_8$5
+];
+const _hoisted_10$4 = { class: "pl-input__wrapper" };
+const _hoisted_11$4 = {
+  key: 0,
+  class: "pl-input__prefix"
+};
+const _hoisted_12$4 = ["type", "disabled"];
+const _hoisted_13$4 = {
   key: 1,
-  class: "el-input"
+  class: "pl-input__suffix"
 };
-const _hoisted_6$8 = { class: "el-input__wrapper" };
-const _hoisted_7$6 = ["type"];
-const _hoisted_8$5 = {
+const _hoisted_14$4 = {
   key: 0,
   class: "pl-input__eye-container"
 };
-const _hoisted_9$5 = { class: "pl-input__helpertext" };
-const _hoisted_10$4 = { key: 0 };
-const _hoisted_11$4 = { key: 1 };
+const _hoisted_15$3 = {
+  key: 2,
+  class: "pl-input__count"
+};
+const _hoisted_16$3 = { class: "pl-input__count-inner" };
+const _hoisted_17$2 = { class: "pl-input__helpertext" };
+const _hoisted_18$2 = {
+  key: 0,
+  class: "pl-form-item__error"
+};
+const _hoisted_19$2 = { key: 1 };
 const _sfc_main$B = {
   __name: "pl-input-plus",
   props: {
@@ -25986,20 +26011,30 @@ const _sfc_main$B = {
     currencyInputOptions: {
       type: Object,
       default: () => ({})
+    },
+    "show-word-limit": {
+      type: Boolean,
+      default: false
+    },
+    disabled: {
+      type: Boolean,
+      default: false
     }
   },
   emits: ["update:modelValue"],
   setup(__props, { emit: emit2 }) {
     const props = __props;
     useCssVars((_ctx) => ({
-      "56b7b87d": props.width
+      "e2f9bf06": props.width
     }));
     const attrs = useAttrs$1();
     const errors = ref([]);
-    const errorsState = inject("errorsState");
-    watch(errorsState, () => {
-      errors.value = errorsState.value.filter((error2) => error2.field === props.prop);
-    }, { deep: true });
+    if (props.prop) {
+      const errorsState = inject("errorsState");
+      watch(errorsState, () => {
+        errors.value = errorsState.value.filter((error2) => error2.field === props.prop);
+      }, { deep: true });
+    }
     const id = `id-${Math.random()}`;
     const options = reactive({
       currency: "RUB",
@@ -26030,10 +26065,9 @@ const _sfc_main$B = {
       }
       hiddenPassword.value = !hiddenPassword.value;
     };
-    const showRightIcon = computed$1(() => !("show-word-limit" in attrs) && props.rightIcon);
+    const showRightIcon = computed$1(() => !props.showWordLimit && props.rightIcon);
     return (_ctx, _cache) => {
       const _component_inline_svg = resolveComponent("inline-svg");
-      const _component_el_input = ElInput;
       return openBlock(), createElementBlock("div", _hoisted_1$y, [
         createElementVNode("label", {
           class: "pl-input__label-container",
@@ -26055,48 +26089,54 @@ const _sfc_main$B = {
             _: 1
           }, 8, ["modelValue"])) : createCommentVNode("", true)
         ]),
-        props.currency ? (openBlock(), createBlock(_component_el_input, mergeProps({
+        props.currency ? (openBlock(), createElementBlock("div", {
           key: 0,
-          ref_key: "inputRef",
-          ref: inputRef,
-          id,
-          name: id
-        }, unref(attrs), {
-          modelValue: unref(formattedValue),
-          "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(formattedValue) ? formattedValue.value = $event : null)
-        }), createSlots({ _: 2 }, [
-          props.leftIcon ? {
-            name: "prefix",
-            fn: withCtx(() => [
+          class: normalizeClass(["pl-input", { "is-disabled": props.disabled }])
+        }, [
+          createElementVNode("div", _hoisted_4$i, [
+            props.leftIcon ? (openBlock(), createElementBlock("div", _hoisted_5$c, [
               createVNode(_component_inline_svg, {
                 src: props.leftIcon
               }, null, 8, ["src"])
-            ])
-          } : void 0,
-          props.currency ? {
-            name: "suffix",
-            fn: withCtx(() => [
-              _hoisted_4$i
-            ])
-          } : void 0
-        ]), 1040, ["modelValue"])) : (openBlock(), createElementBlock("div", _hoisted_5$c, [
-          createElementVNode("div", _hoisted_6$8, [
-            props.leftIcon ? (openBlock(), createBlock(_component_inline_svg, {
-              key: 0,
-              src: props.leftIcon
-            }, null, 8, ["src"])) : createCommentVNode("", true),
+            ])) : createCommentVNode("", true),
+            withDirectives(createElementVNode("input", mergeProps({
+              class: "pl-input__inner",
+              ref_key: "inputRef",
+              ref: inputRef,
+              id,
+              name: id
+            }, unref(attrs), {
+              "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(formattedValue) ? formattedValue.value = $event : null),
+              disabled: props.disabled
+            }), null, 16, _hoisted_6$8), [
+              [vModelDynamic, unref(formattedValue)]
+            ]),
+            props.currency ? (openBlock(), createElementBlock("div", _hoisted_7$6, _hoisted_9$5)) : createCommentVNode("", true)
+          ])
+        ], 2)) : (openBlock(), createElementBlock("div", {
+          key: 1,
+          class: normalizeClass(["pl-input", { "is-disabled": props.disabled }])
+        }, [
+          createElementVNode("div", _hoisted_10$4, [
+            props.leftIcon ? (openBlock(), createElementBlock("div", _hoisted_11$4, [
+              createVNode(_component_inline_svg, {
+                src: props.leftIcon
+              }, null, 8, ["src"])
+            ])) : createCommentVNode("", true),
             withDirectives(createElementVNode("input", mergeProps({
+              class: "pl-input__inner",
               id,
               name: id,
               type: unref(passwordType) ? "password" : "text"
             }, unref(attrs), {
-              "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(modelValue) ? modelValue.value = $event : null)
-            }), null, 16, _hoisted_7$6), [
+              "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(modelValue) ? modelValue.value = $event : null),
+              disabled: props.disabled
+            }), null, 16, _hoisted_12$4), [
               [vModelDynamic, unref(modelValue)]
             ]),
-            props.password || unref(showRightIcon) ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-              props.password ? (openBlock(), createElementBlock("div", _hoisted_8$5, [
-                createVNode(Transition, { name: "el-zoom-in-top" }, {
+            props.password || unref(showRightIcon) ? (openBlock(), createElementBlock("div", _hoisted_13$4, [
+              props.password ? (openBlock(), createElementBlock("div", _hoisted_14$4, [
+                createVNode(Transition, { name: "pl-zoom-in-top" }, {
                   default: withCtx(() => [
                     unref(passwordType) ? (openBlock(), createBlock(_component_inline_svg, {
                       key: 0,
@@ -26107,7 +26147,7 @@ const _sfc_main$B = {
                   ]),
                   _: 1
                 }),
-                createVNode(Transition, { name: "el-zoom-in-top" }, {
+                createVNode(Transition, { name: "pl-zoom-in-top" }, {
                   default: withCtx(() => [
                     !unref(passwordType) ? (openBlock(), createBlock(_component_inline_svg, {
                       key: 0,
@@ -26122,11 +26162,13 @@ const _sfc_main$B = {
                 key: 1,
                 src: props.rightIcon
               }, null, 8, ["src"])) : createCommentVNode("", true)
-            ], 64)) : createCommentVNode("", true)
+            ])) : props.showWordLimit ? (openBlock(), createElementBlock("div", _hoisted_15$3, [
+              createElementVNode("span", _hoisted_16$3, toDisplayString(unref(modelValue).length) + "/" + toDisplayString(unref(attrs).maxlength), 1)
+            ])) : createCommentVNode("", true)
           ])
-        ])),
-        withDirectives(createElementVNode("span", _hoisted_9$5, [
-          errors.value.length > 0 ? (openBlock(), createElementBlock("span", _hoisted_10$4, toDisplayString(errors.value[0].message), 1)) : props.helpertext ? (openBlock(), createElementBlock("span", _hoisted_11$4, toDisplayString(props.helpertext), 1)) : createCommentVNode("", true)
+        ], 2)),
+        withDirectives(createElementVNode("span", _hoisted_17$2, [
+          errors.value.length > 0 ? (openBlock(), createElementBlock("span", _hoisted_18$2, toDisplayString(errors.value[0].message), 1)) : props.helpertext ? (openBlock(), createElementBlock("span", _hoisted_19$2, toDisplayString(props.helpertext), 1)) : createCommentVNode("", true)
         ], 512), [
           [vShow, props.helpertext || errors.value.length > 0]
         ])
@@ -26134,7 +26176,7 @@ const _sfc_main$B = {
     };
   }
 };
-var PlInputPlus = /* @__PURE__ */ _export_sfc(_sfc_main$B, [["__scopeId", "data-v-50fa79da"]]);
+var PlInputPlus = /* @__PURE__ */ _export_sfc(_sfc_main$B, [["__scopeId", "data-v-71920af7"]]);
 const PlInputPlusPlugin = {
   install(app) {
     app.component("PlInputPlus", PlInputPlus);
@@ -39026,7 +39068,7 @@ const _hoisted_4$b = { class: "demo-progress" };
 const _sfc_main$k = /* @__PURE__ */ defineComponent({
   __name: "pl-form-progress",
   setup(__props) {
-    const color = "#FF7D1F";
+    const color2 = "#FF7D1F";
     return (_ctx, _cache) => {
       const _component_el_progress = ElProgress;
       return openBlock(), createElementBlock("div", _hoisted_1$k, [
@@ -39034,7 +39076,7 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
           _hoisted_3$g,
           createElementVNode("div", _hoisted_4$b, [
             createVNode(_component_el_progress, {
-              color,
+              color: color2,
               percentage: 50
             })
           ])
@@ -42909,6 +42951,7 @@ const PlTooltipPlugin = {
 var bootstrapCustom = "";
 var root = "";
 var inter = "";
+var color = "";
 const PlPlugin = {
   install(app) {
     var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t2, _u, _v, _w;