@milaboratories/uikit 2.6.2 → 2.6.4

package/dist/components/PlNotificationAlert/PlNotificationAlert.vue.js

@@ -1,14 +1,14 @@
 (function(){"use strict";try{if(typeof document<"u"){var t=document.createElement("style");t.appendChild(document.createTextNode(".pl-notification-alert{padding:12px;position:relative;border-radius:6px;border:1px solid var(--border-color-default);min-height:40px;width:256px;max-height:100%;overflow:auto}.pl-notification-alert .ui-btn-ghost{position:absolute;right:0;top:0}.pl-notification-alert__close{width:32px;min-width:28px}.pl-notification-alert__close .pl-btn-ghost{position:absolute;top:0;right:0;width:40px!important;height:40px!important}.pl-notification-alert__wrapper{flex-grow:1;overflow:auto}.pl-notification-alert.neutral{background:var(--notification-neutral)}.pl-notification-alert.error{background:var(--notification-error)}.pl-notification-alert.success{background:var(--notification-success)}.pl-notification-alert.warning{background:var(--notification-warning)}")),document.head.appendChild(t)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})();
-import { defineComponent as d, mergeModels as f, useModel as p, createElementBlock as t, createCommentVNode as o, openBlock as l, normalizeStyle as m, normalizeClass as u, createElementVNode as i, renderSlot as n, createVNode as _, unref as h, withModifiers as y } from "vue";
+import { defineComponent as r, mergeModels as f, useModel as m, createElementBlock as o, createCommentVNode as l, openBlock as a, normalizeStyle as u, normalizeClass as p, createElementVNode as s, renderSlot as n, createVNode as _, unref as h, withModifiers as y } from "vue";
 import v from "../PlBtnGhost/PlBtnGhost.vue.js";
 
-const k = { class: "pl-notification-alert__wrapper d-flex text-s" }, w = { class: "pl-notification-alert__content flex-grow-1" }, V = {
+const k = { class: "pl-notification-alert__wrapper d-flex text-s" }, w = { class: "pl-notification-alert__content flex-grow-1" }, x = {
   key: 0,
   class: "pl-notification-alert__close"
-}, $ = {
+}, V = {
   key: 0,
   class: "pl-notification-alert__actions d-flex"
-}, b = /* @__PURE__ */ d({
+}, N = /* @__PURE__ */ r({
   __name: "PlNotificationAlert",
   props: /* @__PURE__ */ f({
     type: { default: "neutral" },
@@ -19,34 +19,34 @@ const k = { class: "pl-notification-alert__wrapper d-flex text-s" }, w = { class
     modelModifiers: {}
   }),
   emits: ["update:modelValue"],
-  setup(s) {
-    const r = s, a = p(s, "modelValue");
-    function c() {
-      r.closable && (a.value = !1);
+  setup(e) {
+    const c = e, i = m(e, "modelValue");
+    function d() {
+      c.closable && (i.value = !1);
     }
-    return (e, B) => a.value ? (l(), t("div", {
+    return (t, $) => i.value ? (a(), o("div", {
       key: 0,
-      class: u([e.type, "pl-notification-alert d-flex flex-column gap-16"]),
-      style: m({ width: `${e.width}` })
+      class: p([e.type, "pl-notification-alert d-flex flex-column gap-16"]),
+      style: u({ width: `${e.width}` })
     }, [
-      i("div", k, [
-        i("div", w, [
-          n(e.$slots, "default")
+      s("div", k, [
+        s("div", w, [
+          n(t.$slots, "default")
         ]),
-        e.closable ? (l(), t("div", V, [
+        e.closable ? (a(), o("div", x, [
           _(h(v), {
             icon: "close",
-            onClick: y(c, ["stop"])
+            onClick: y(d, ["stop"])
           })
-        ])) : o("", !0)
+        ])) : l("", !0)
       ]),
-      e.$slots.actions ? (l(), t("div", $, [
-        n(e.$slots, "actions")
-      ])) : o("", !0)
-    ], 6)) : o("", !0);
+      t.$slots.actions ? (a(), o("div", V, [
+        n(t.$slots, "actions")
+      ])) : l("", !0)
+    ], 6)) : l("", !0);
   }
 });
 export {
-  b as default
+  N as default
 };
 //# sourceMappingURL=PlNotificationAlert.vue.js.map

package/dist/components/PlNotificationAlert/PlNotificationAlert.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlNotificationAlert.vue.js","sources":["../../../src/components/PlNotificationAlert/PlNotificationAlert.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { PlBtnGhost } from '../PlBtnGhost';\nimport './pl-notification-alert.scss';\n\nconst props = withDefaults(\n  defineProps<{\n    type?: 'success' | 'error' | 'warning' | 'neutral';\n    width?: string;\n    closable?: boolean;\n  }>(),\n  { type: 'neutral', width: '256px' },\n);\n\nconst model = defineModel({ type: Boolean, default: true });\n\nfunction closeAlert() {\n  if (props.closable) {\n    model.value = false;\n  }\n}\n</script>\n\n<template>\n  <div v-if=\"model\" :class=\"type\" :style=\"{ width: `${width}` }\" class=\"pl-notification-alert d-flex flex-column gap-16\">\n    <div class=\"pl-notification-alert__wrapper d-flex text-s\">\n      <div class=\"pl-notification-alert__content flex-grow-1\">\n        <slot />\n      </div>\n      <div v-if=\"closable\" class=\"pl-notification-alert__close\">\n        <PlBtnGhost icon=\"close\" @click.stop=\"closeAlert\" />\n      </div>\n    </div>\n\n    <div v-if=\"!!$slots.actions\" class=\"pl-notification-alert__actions d-flex\">\n      <slot name=\"actions\" />\n    </div>\n  </div>\n</template>\n"],"names":["props","__props","model","_useModel","closeAlert"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAIA,UAAMA,IAAQC,GASRC,IAAQC,iBAA4C;AAE1D,aAASC,IAAa;AACpB,MAAIJ,EAAM,aACRE,EAAM,QAAQ;AAAA,IAElB;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"PlNotificationAlert.vue.js","sources":["../../../src/components/PlNotificationAlert/PlNotificationAlert.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { PlBtnGhost } from '../PlBtnGhost';\nimport './pl-notification-alert.scss';\n\nconst props = withDefaults(\n  defineProps<{\n    type?: 'success' | 'error' | 'warning' | 'neutral';\n    width?: string;\n    closable?: boolean;\n  }>(),\n  { type: 'neutral', width: '256px' },\n);\n\nconst model = defineModel({ type: Boolean, default: true });\n\nfunction closeAlert() {\n  if (props.closable) {\n    model.value = false;\n  }\n}\n</script>\n\n<template>\n  <div v-if=\"model\" :class=\"type\" :style=\"{ width: `${width}` }\" class=\"pl-notification-alert d-flex flex-column gap-16\">\n    <div class=\"pl-notification-alert__wrapper d-flex text-s\">\n      <div class=\"pl-notification-alert__content flex-grow-1\">\n        <slot />\n      </div>\n      <div v-if=\"closable\" class=\"pl-notification-alert__close\">\n        <PlBtnGhost icon=\"close\" @click.stop=\"closeAlert\" />\n      </div>\n    </div>\n\n    <div v-if=\"!!$slots.actions\" class=\"pl-notification-alert__actions d-flex\">\n      <slot name=\"actions\" />\n    </div>\n  </div>\n</template>\n"],"names":["props","__props","model","_useModel","closeAlert","_createElementBlock","_normalizeClass","_createElementVNode","_hoisted_1","_hoisted_2","_renderSlot","_ctx","_openBlock","_hoisted_3","_createVNode","_unref","PlBtnGhost","$slots","_hoisted_4"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAIA,UAAMA,IAAQC,GASRC,IAAQC,iBAA4C;AAE1D,aAASC,IAAa;AACpB,MAAIJ,EAAM,aACRE,EAAM,QAAQ;AAAA,IAElB;qBAIaA,EAAA,cAAXG,EAaM,OAAA;AAAA;MAba,OAAKC,EAAA,CAAEL,EAAA,MAA2C,iDAAiD,CAAA;AAAA,MAArF,qBAAmBA,EAAA,KAAK,IAAA;AAAA,IAAA;MACvDM,EAOM,OAPNC,GAOM;AAAA,QANJD,EAEM,OAFNE,GAEM;AAAA,UADJC,EAAQC,EAAA,QAAA,SAAA;AAAA,QAAA;QAECV,EAAA,YAAXW,EAAA,GAAAP,EAEM,OAFNQ,GAEM;AAAA,UADJC,EAAoDC,EAAAC,CAAA,GAAA;AAAA,YAAxC,MAAK;AAAA,YAAS,WAAYZ,GAAU,CAAA,MAAA,CAAA;AAAA,UAAA;;;MAIvCa,EAAAA,OAAO,WAApBL,EAAA,GAAAP,EAEM,OAFNa,GAEM;AAAA,QADJR,EAAuBC,EAAA,QAAA,SAAA;AAAA,MAAA;;;;"}

package/dist/components/PlNumberField/PlNumberField.vue.d.ts

@@ -68,9 +68,9 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
     "onUpdate:modelValue"?: ((value: number | undefined) => any) | undefined;
 }>, {
     label: string;
+    placeholder: string;
     step: number;
     groupPosition: "top" | "bottom" | "left" | "right" | "top-left" | "top-right" | "bottom-left" | "bottom-right" | "middle";
-    placeholder: string;
     minValue: number;
     maxValue: number;
     useIncrementButtons: boolean;

package/dist/components/PlNumberField/PlNumberField.vue.js

@@ -1,12 +1,12 @@
 (function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode(`.pl-number-field{--contour-color: var(--txt-01);--contour-border-width: 1px;--options-bg: #fff;--option-hover-bg: var(--btn-sec-hover-grey);--label-offset-left-x: 8px;--label-offset-right-x: 8px;--label-color: var(--txt-01);--color-hint: #9d9eae}.pl-number-field ::placeholder{color:#cfd1db;opacity:1}.pl-number-field__main-wrapper{height:40px;position:relative}.pl-number-field__wrapper{padding-left:12px;border-radius:6px}.pl-number-field__wrapper.withoutArrows{padding-right:12px}.pl-number-field__icons{width:40px;border-radius:0 6px 6px 0;border-left:1px solid var(--contour-color)}.pl-number-field__icon{line-height:0}.pl-number-field__icon.disabled{cursor:not-allowed;position:relative;z-index:1}.pl-number-field__icon.disabled svg path{fill:#cfd1db}.pl-number-field__icon:hover{background-color:#9babcc29}.pl-number-field__icon:first-child{border-bottom:1px solid var(--contour-color)}.pl-number-field__hint{margin-top:3px;color:var(--color-hint)}.pl-number-field__error{margin-top:3px;color:var(--txt-error);font-size:12px;font-weight:500;line-height:16px}.pl-number-field input{outline:none;border:none;width:100%;background:unset;text-overflow:ellipsis}.pl-number-field__contour{border-radius:var(--border-radius-control);border:var(--contour-border-width) solid var(--contour-color);box-shadow:var(--contour-box-shadow);z-index:0;pointer-events:none;transition:all .3s}.pl-number-field:focus-within:not(.error){--label-color: var(--txt-focus);--contour-color: var(--border-color-focus);--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--border-color-focus-shadow)}.pl-number-field:focus-within.error{--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--color-error-shadow)}.pl-number-field.error{--contour-color: var(--txt-error);--label-color: var(--txt-error);--color-hint: var(--txt-error)}.pl-number-field.disabled{--contour-color: var(--color-dis-01);--control-mask-fill: var(--color-dis-01);cursor:not-allowed}.pl-number-field.disabled label,.pl-number-field.disabled .mi-number-field__hint,.pl-number-field.disabled input{color:var(--contour-color)}.pl-number-field.disabled svg path{fill:var(--contour-color)}.pl-number-field.disabled .mi-number-field__icons{pointer-events:none}.pl-number-field label{position:absolute;top:0;transform:translateY(-60%);left:var(--label-offset-left-x);display:flex;align-items:center;padding:0 4px;overflow:hidden;white-space:pre;text-overflow:ellipsis;cursor:inherit;color:var(--label-color);transition:color .3s}.pl-number-field label .required{display:inline-block;font-weight:500;font-size:12px;line-height:16px;color:var(--txt-error);margin-right:4px}
 .double-contour.top>div{border-bottom-right-radius:0;border-bottom-left-radius:0}.double-contour.bottom>div{border-top-right-radius:0;border-top-left-radius:0}.double-contour.left>div{border-top-right-radius:0;border-bottom-right-radius:0}.double-contour.right>div{border-top-left-radius:0;border-bottom-left-radius:0}.double-contour.top-left>div{border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.double-contour.top-right>div{border-bottom-right-radius:0;border-top-left-radius:0;border-top-right-radius:0}.double-contour.bottom-left>div{border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:0}.double-contour.bottom-right>div{border-top-right-radius:0;border-bottom-left-radius:0;border-top-left-radius:0}.double-contour.middle>div{border-radius:0}`)),document.head.appendChild(r)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
-import { defineComponent as S, mergeModels as A, useModel as R, useSlots as $, ref as f, computed as a, watch as F, createElementBlock as p, openBlock as d, normalizeClass as c, createElementVNode as r, createCommentVNode as m, createVNode as P, withDirectives as j, createTextVNode as T, createBlock as U, toDisplayString as L, unref as M, withCtx as K, renderSlot as Z, vModelText as q } from "vue";
+import { defineComponent as _, mergeModels as A, useModel as R, useSlots as $, ref as c, computed as s, watch as F, createElementBlock as m, openBlock as v, normalizeClass as p, createElementVNode as r, createCommentVNode as g, createVNode as P, withDirectives as j, createTextVNode as T, createBlock as U, toDisplayString as M, unref as C, withCtx as K, renderSlot as Z, vModelText as q } from "vue";
 
 import z from "../../utils/DoubleContour.vue.js";
 
 import { useLabelNotch as G } from "../../utils/useLabelNotch.js";
 import H from "../PlTooltip/PlTooltip.vue.js";
-import { parseNumber as C } from "./parseNumber.js";
+import { parseNumber as D } from "./parseNumber.js";
 const J = { class: "pl-number-field__main-wrapper d-flex" }, Q = {
   key: 0,
   class: "text-description"
@@ -15,7 +15,7 @@ const J = { class: "pl-number-field__main-wrapper d-flex" }, Q = {
   class: "pl-number-field__error"
 }, Y = {
   name: "PlNumberField"
-}, ie = /* @__PURE__ */ S({
+}, ie = /* @__PURE__ */ _({
   ...Y,
   props: /* @__PURE__ */ A({
     disabled: { type: Boolean },
@@ -34,90 +34,90 @@ const J = { class: "pl-number-field__main-wrapper d-flex" }, Q = {
     modelModifiers: {}
   }),
   emits: ["update:modelValue"],
-  setup(V) {
-    const o = V, n = R(V, "modelValue"), D = $(), b = f(), v = f();
-    G(b);
-    function x(e) {
+  setup(n) {
+    const t = n, u = R(n, "modelValue"), O = $(), V = c(), f = c();
+    G(V);
+    function b(e) {
       return e === void 0 ? "" : String(+e);
     }
-    const u = a(() => C(o, s.value)), g = f(void 0), O = () => g.value = void 0;
-    F(n, (e) => {
-      const l = u.value;
-      (l.error || e !== l.value) && O();
+    const i = s(() => D(t, d.value)), w = c(void 0), E = () => w.value = void 0;
+    F(u, (e) => {
+      const l = i.value;
+      (l.error || e !== l.value) && E();
     });
-    const s = a({
+    const d = s({
       get() {
-        return g.value ?? x(n.value);
+        return w.value ?? b(u.value);
       },
       set(e) {
-        const l = C(o, e);
-        g.value = l.cleanInput, l.error || o.updateOnEnterOrClickOutside ? v.value.value = l.cleanInput : n.value = l.value;
+        const l = D(t, e);
+        w.value = l.cleanInput, l.error || t.updateOnEnterOrClickOutside ? f.value.value = l.cleanInput : u.value = l.value;
       }
-    }), h = f(!1);
-    function E() {
-      u.value.error === void 0 && (n.value = u.value.value);
+    }), h = c(!1);
+    function I() {
+      i.value.error === void 0 && (u.value = i.value.value);
     }
-    const w = a(() => {
+    const x = s(() => {
       let e = [];
-      o.errorMessage && e.push(o.errorMessage);
-      const l = u.value;
+      t.errorMessage && e.push(t.errorMessage);
+      const l = i.value;
       if (l.error)
         e.push(l.error.message);
-      else if (o.validate && l.value !== void 0) {
-        const t = o.validate(l.value);
-        t && e.push(t);
+      else if (t.validate && l.value !== void 0) {
+        const o = t.validate(l.value);
+        o && e.push(o);
       }
       return e = [...e], e.join(" ");
-    }), y = a(() => {
-      const e = u.value;
-      return o.maxValue !== void 0 && e.value !== void 0 ? e.value >= o.maxValue : !1;
-    }), k = a(() => {
-      const e = u.value;
-      return o.minValue !== void 0 && e.value !== void 0 ? e.value <= o.minValue : !1;
-    }), i = a(
+    }), y = s(() => {
+      const e = i.value;
+      return t.maxValue !== void 0 && e.value !== void 0 ? e.value >= t.maxValue : !1;
+    }), k = s(() => {
+      const e = i.value;
+      return t.minValue !== void 0 && e.value !== void 0 ? e.value <= t.minValue : !1;
+    }), a = s(
       () => {
         var e;
-        return 10 ** (((e = o.step.toString().split(".").at(1)) == null ? void 0 : e.length) ?? 0);
+        return 10 ** (((e = t.step.toString().split(".").at(1)) == null ? void 0 : e.length) ?? 0);
       }
     );
-    function _() {
-      const l = u.value.value;
+    function B() {
+      const l = i.value.value;
       if (!y.value) {
-        let t;
-        l === void 0 ? t = o.minValue ? o.minValue : 0 : t = ((l || 0) * i.value + o.step * i.value) / i.value, n.value = o.maxValue !== void 0 ? Math.min(o.maxValue, t) : t;
+        let o;
+        l === void 0 ? o = t.minValue ? t.minValue : 0 : o = ((l || 0) * a.value + t.step * a.value) / a.value, u.value = t.maxValue !== void 0 ? Math.min(t.maxValue, o) : o;
       }
     }
-    function B() {
-      const l = u.value.value;
+    function L() {
+      const l = i.value.value;
       if (!k.value) {
-        let t;
-        l === void 0 ? t = 0 : t = ((l || 0) * i.value - o.step * i.value) / i.value, n.value = o.minValue !== void 0 ? Math.max(o.minValue, t) : t;
+        let o;
+        l === void 0 ? o = 0 : o = ((l || 0) * a.value - t.step * a.value) / a.value, u.value = t.minValue !== void 0 ? Math.max(t.minValue, o) : o;
       }
     }
-    function I(e) {
-      var l, t;
-      o.updateOnEnterOrClickOutside && (e.code === "Escape" && (s.value = x(n.value), (l = v.value) == null || l.blur()), e.code === "Enter" && ((t = v.value) == null || t.blur())), e.code === "Enter" && (s.value = String(n.value)), ["ArrowDown", "ArrowUp"].includes(e.code) && e.preventDefault(), o.useIncrementButtons && e.code === "ArrowUp" && _(), o.useIncrementButtons && e.code === "ArrowDown" && B();
+    function N(e) {
+      var l, o;
+      t.updateOnEnterOrClickOutside && (e.code === "Escape" && (d.value = b(u.value), (l = f.value) == null || l.blur()), e.code === "Enter" && ((o = f.value) == null || o.blur())), e.code === "Enter" && (d.value = String(u.value)), ["ArrowDown", "ArrowUp"].includes(e.code) && e.preventDefault(), t.useIncrementButtons && e.code === "ArrowUp" && B(), t.useIncrementButtons && e.code === "ArrowDown" && L();
     }
-    const N = (e) => {
+    const S = (e) => {
       e.detail > 1 && e.preventDefault();
     };
-    return (e, l) => (d(), p("div", {
+    return (e, l) => (v(), m("div", {
       ref_key: "rootRef",
-      ref: b,
-      class: c([{ error: !!w.value.trim(), disabled: e.disabled }, "pl-number-field d-flex-column"]),
-      onKeydown: l[3] || (l[3] = (t) => I(t))
+      ref: V,
+      class: p([{ error: !!x.value.trim(), disabled: n.disabled }, "pl-number-field d-flex-column"]),
+      onKeydown: l[3] || (l[3] = (o) => N(o))
     }, [
       r("div", J, [
         P(z, {
           class: "pl-number-field__contour",
-          "group-position": e.groupPosition
+          "group-position": n.groupPosition
         }, null, 8, ["group-position"]),
         r("div", {
-          class: c(["pl-number-field__wrapper flex-grow d-flex flex-align-center", { withoutArrows: !e.useIncrementButtons }])
+          class: p(["pl-number-field__wrapper flex-grow d-flex flex-align-center", { withoutArrows: !n.useIncrementButtons }])
         }, [
-          e.label ? (d(), p("label", Q, [
-            T(L(e.label) + " ", 1),
-            M(D).tooltip ? (d(), U(M(H), {
+          n.label ? (v(), m("label", Q, [
+            T(M(n.label) + " ", 1),
+            C(O).tooltip ? (v(), U(C(H), {
               key: 0,
               class: "info",
               position: "top"
@@ -126,32 +126,32 @@ const J = { class: "pl-number-field__main-wrapper d-flex" }, Q = {
                 Z(e.$slots, "tooltip")
               ]),
               _: 3
-            })) : m("", !0)
-          ])) : m("", !0),
+            })) : g("", !0)
+          ])) : g("", !0),
           j(r("input", {
             ref_key: "inputRef",
-            ref: v,
-            "onUpdate:modelValue": l[0] || (l[0] = (t) => s.value = t),
-            disabled: e.disabled,
-            placeholder: e.placeholder,
+            ref: f,
+            "onUpdate:modelValue": l[0] || (l[0] = (o) => d.value = o),
+            disabled: n.disabled,
+            placeholder: n.placeholder,
             class: "text-s flex-grow",
-            onFocusin: l[1] || (l[1] = (t) => h.value = !0),
-            onFocusout: l[2] || (l[2] = (t) => {
-              h.value = !1, E();
+            onFocusin: l[1] || (l[1] = (o) => h.value = !0),
+            onFocusout: l[2] || (l[2] = (o) => {
+              h.value = !1, I();
             })
           }, null, 40, W), [
-            [q, s.value]
+            [q, d.value]
           ])
         ], 2),
-        e.useIncrementButtons ? (d(), p("div", {
+        n.useIncrementButtons ? (v(), m("div", {
           key: 0,
           class: "pl-number-field__icons d-flex-column",
-          onMousedown: N
+          onMousedown: S
         }, [
           r("div", {
-            class: c([{ disabled: y.value }, "pl-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center"]),
-            onClick: _
-          }, l[4] || (l[4] = [
+            class: p([{ disabled: y.value }, "pl-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center"]),
+            onClick: B
+          }, [...l[4] || (l[4] = [
             r("svg", {
               xmlns: "http://www.w3.org/2000/svg",
               width: "16",
@@ -166,11 +166,11 @@ const J = { class: "pl-number-field__main-wrapper d-flex" }, Q = {
                 fill: "#110529"
               })
             ], -1)
-          ]), 2),
+          ])], 2),
           r("div", {
-            class: c([{ disabled: k.value }, "pl-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center"]),
-            onClick: B
-          }, l[5] || (l[5] = [
+            class: p([{ disabled: k.value }, "pl-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center"]),
+            onClick: L
+          }, [...l[5] || (l[5] = [
             r("svg", {
               xmlns: "http://www.w3.org/2000/svg",
               width: "16",
@@ -185,10 +185,10 @@ const J = { class: "pl-number-field__main-wrapper d-flex" }, Q = {
                 fill: "#110529"
               })
             ], -1)
-          ]), 2)
-        ], 32)) : m("", !0)
+          ])], 2)
+        ], 32)) : g("", !0)
       ]),
-      w.value.trim() ? (d(), p("div", X, L(w.value), 1)) : m("", !0)
+      x.value.trim() ? (v(), m("div", X, M(x.value), 1)) : g("", !0)
     ], 34));
   }
 });

package/dist/components/PlNumberField/PlNumberField.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlNumberField.vue.js","sources":["../../../src/components/PlNumberField/PlNumberField.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Number input field with increment/decrement buttons, validation, and min/max constraints.\n *\n * @example\n * <PlNumberField v-model=\"price\" :step=\"0.01\" :min-value=\"0\" label=\"Price\" />\n *\n * @example\n * <PlNumberField\n *   v-model=\"evenNumber\"\n *   :validate=\"(v) => v % 2 !== 0 ? 'Number must be even' : undefined\"\n *   :update-on-enter-or-click-outside=\"true\"\n *   label=\"Even Number\"\n * />\n */\nexport default {\n  name: 'PlNumberField',\n};\n</script>\n\n<script setup lang=\"ts\">\nimport './pl-number-field.scss';\nimport DoubleContour from '../../utils/DoubleContour.vue';\nimport { useLabelNotch } from '../../utils/useLabelNotch';\nimport { computed, ref, useSlots, watch } from 'vue';\nimport { PlTooltip } from '../PlTooltip';\nimport { parseNumber } from './parseNumber';\n\nconst props = withDefaults(defineProps<{\n  /** Input is disabled if true */\n  disabled?: boolean;\n  /** Label on the top border of the field, empty by default */\n  label?: string;\n  /** Input placeholder, empty by default */\n  placeholder?: string;\n  /** Step for increment/decrement buttons, 1 by default */\n  step?: number;\n  /** If defined - show an error if value is lower  */\n  minValue?: number;\n  /** If defined - show an error if value is higher */\n  maxValue?: number;\n  /** If false - remove buttons on the right */\n  useIncrementButtons?: boolean;\n  /** If true - changes do not apply immediately, they apply only by removing focus from the input (by click enter or by click outside)  */\n  updateOnEnterOrClickOutside?: boolean;\n  /** Error message that shows always when it's provided, without other checks */\n  errorMessage?: string;\n  /** Additional validity check for input value that must return an error text if failed */\n  validate?: (v: number) => string | undefined;\n  /** Makes some of corners not rounded */\n  groupPosition?: 'top' | 'bottom' | 'left' | 'right' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'middle';\n}>(), {\n  step: 1,\n  label: undefined,\n  placeholder: undefined,\n  minValue: undefined,\n  maxValue: undefined,\n  useIncrementButtons: true,\n  updateOnEnter: false,\n  errorMessage: undefined,\n  validate: undefined,\n  groupPosition: undefined,\n});\n\nconst modelValue = defineModel<number | undefined>({ required: true });\n\nconst slots = useSlots();\n\nconst rootRef = ref<HTMLElement>();\nconst inputRef = ref<HTMLInputElement>();\n\nuseLabelNotch(rootRef);\n\nfunction modelToString(v: number | undefined) {\n  return v === undefined ? '' : String(+v); // (+v) to avoid staying in input non-number values if they are provided in model\n}\n\nconst parsedResult = computed(() => parseNumber(props, inputValue.value));\n\nconst cachedValue = ref<string | undefined>(undefined);\n\nconst resetCachedValue = () => cachedValue.value = undefined;\n\nwatch(modelValue, (n) => {\n  const r = parsedResult.value;\n  if (r.error || n !== r.value) {\n    resetCachedValue();\n  }\n});\n\nconst inputValue = computed({\n  get() {\n    return cachedValue.value ?? modelToString(modelValue.value);\n  },\n  set(nextValue: string) {\n    const r = parseNumber(props, nextValue);\n\n    cachedValue.value = r.cleanInput;\n\n    if (r.error || props.updateOnEnterOrClickOutside) {\n      inputRef.value!.value = r.cleanInput;\n    } else {\n      modelValue.value = r.value;\n    }\n  },\n});\n\nconst focused = ref(false);\n\nfunction applyChanges() {\n  if (parsedResult.value.error === undefined) {\n    modelValue.value = parsedResult.value.value;\n  }\n}\n\nconst errors = computed(() => {\n  let ers: string[] = [];\n\n  if (props.errorMessage) {\n    ers.push(props.errorMessage);\n  }\n\n  const r = parsedResult.value;\n\n  if (r.error) {\n    ers.push(r.error.message);\n  } else if (props.validate && r.value !== undefined) {\n    const error = props.validate(r.value);\n    if (error) {\n      ers.push(error);\n    }\n  }\n\n  ers = [...ers];\n\n  return ers.join(' ');\n});\n\nconst isIncrementDisabled = computed(() => {\n  const r = parsedResult.value;\n\n  if (props.maxValue !== undefined && r.value !== undefined) {\n    return r.value >= props.maxValue;\n  }\n\n  return false;\n});\n\nconst isDecrementDisabled = computed(() => {\n  const r = parsedResult.value;\n\n  if (props.minValue !== undefined && r.value !== undefined) {\n    return r.value <= props.minValue;\n  }\n\n  return false;\n});\n\nconst multiplier = computed(() =>\n  10 ** (props.step.toString().split('.').at(1)?.length ?? 0),\n);\n\nfunction increment() {\n  const r = parsedResult.value;\n\n  const parsedValue = r.value;\n\n  if (!isIncrementDisabled.value) {\n    let nV;\n    if (parsedValue === undefined) {\n      nV = props.minValue ? props.minValue : 0;\n    } else {\n      nV = ((parsedValue || 0) * multiplier.value\n        + props.step * multiplier.value)\n      / multiplier.value;\n    }\n    modelValue.value = props.maxValue !== undefined ? Math.min(props.maxValue, nV) : nV;\n  }\n}\n\nfunction decrement() {\n  const r = parsedResult.value;\n\n  const parsedValue = r.value;\n\n  if (!isDecrementDisabled.value) {\n    let nV;\n    if (parsedValue === undefined) {\n      nV = 0;\n    } else {\n      nV = ((parsedValue || 0) * multiplier.value\n        - props.step * multiplier.value)\n      / multiplier.value;\n    }\n    modelValue.value = props.minValue !== undefined ? Math.max(props.minValue, nV) : nV;\n  }\n}\n\nfunction handleKeyPress(e: { code: string; preventDefault(): void }) {\n  if (props.updateOnEnterOrClickOutside) {\n    if (e.code === 'Escape') {\n      inputValue.value = modelToString(modelValue.value);\n      inputRef.value?.blur();\n    }\n    if (e.code === 'Enter') {\n      inputRef.value?.blur();\n    }\n  }\n\n  if (e.code === 'Enter') {\n    inputValue.value = String(modelValue.value); // to make .1 => 0.1, 10.00 => 10, remove leading zeros etc\n  }\n\n  if (['ArrowDown', 'ArrowUp'].includes(e.code)) {\n    e.preventDefault();\n  }\n\n  if (props.useIncrementButtons && e.code === 'ArrowUp') {\n    increment();\n  }\n\n  if (props.useIncrementButtons && e.code === 'ArrowDown') {\n    decrement();\n  }\n}\n\n// https://stackoverflow.com/questions/880512/prevent-text-selection-after-double-click#:~:text=If%20you%20encounter%20a%20situation,none%3B%20to%20the%20summary%20element.\n// this prevents selecting of more than input content in some cases,\n// but also disable selecting input content by double-click (useful feature)\nconst onMousedown = (ev: MouseEvent) => {\n  if (ev.detail > 1) {\n    ev.preventDefault();\n  }\n};\n</script>\n\n<template>\n  <div\n    ref=\"rootRef\"\n    :class=\"{ error: !!errors.trim(), disabled: disabled }\"\n    class=\"pl-number-field d-flex-column\"\n    @keydown=\"handleKeyPress($event)\"\n  >\n    <div class=\"pl-number-field__main-wrapper d-flex\">\n      <DoubleContour class=\"pl-number-field__contour\" :group-position=\"groupPosition\"/>\n      <div\n        class=\"pl-number-field__wrapper flex-grow d-flex flex-align-center\"\n        :class=\"{withoutArrows: !useIncrementButtons}\"\n      >\n        <label v-if=\"label\" class=\"text-description\">\n          {{ label }}\n          <PlTooltip v-if=\"slots.tooltip\" class=\"info\" position=\"top\">\n            <template #tooltip>\n              <slot name=\"tooltip\"/>\n            </template>\n          </PlTooltip>\n        </label>\n        <input\n          ref=\"inputRef\"\n          v-model=\"inputValue\"\n          :disabled=\"disabled\"\n          :placeholder=\"placeholder\"\n          class=\"text-s flex-grow\"\n          @focusin=\"focused = true\"\n          @focusout=\"focused = false; applyChanges()\"\n        />\n      </div>\n      <div v-if=\"useIncrementButtons\" class=\"pl-number-field__icons d-flex-column\" @mousedown=\"onMousedown\">\n        <div\n          :class=\"{ disabled: isIncrementDisabled }\"\n          class=\"pl-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center\"\n          @click=\"increment\"\n        >\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n            <path\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n              d=\"M8 4.93933L13.5303 10.4697L12.4697 11.5303L8 7.06065L3.53033 11.5303L2.46967 10.4697L8 4.93933Z\"\n              fill=\"#110529\"\n            />\n          </svg>\n        </div>\n        <div\n          :class=\"{ disabled: isDecrementDisabled }\"\n          class=\"pl-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center\"\n          @click=\"decrement\"\n        >\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n            <path\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n              d=\"M2.46967 6.53033L3.53033 5.46967L8 9.93934L12.4697 5.46967L13.5303 6.53033L8 12.0607L2.46967 6.53033Z\"\n              fill=\"#110529\"\n            />\n          </svg>\n        </div>\n      </div>\n    </div>\n    <div v-if=\"errors.trim()\" class=\"pl-number-field__error\">\n      {{ errors }}\n    </div>\n  </div>\n</template>\n"],"names":["__default__","props","__props","modelValue","_useModel","slots","useSlots","rootRef","ref","inputRef","useLabelNotch","modelToString","v","parsedResult","computed","parseNumber","inputValue","cachedValue","resetCachedValue","watch","n","r","nextValue","focused","applyChanges","errors","ers","error","isIncrementDisabled","isDecrementDisabled","multiplier","_a","increment","parsedValue","nV","decrement","handleKeyPress","_b","onMousedown","ev"],"mappings":"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"}
+{"version":3,"file":"PlNumberField.vue.js","sources":["../../../src/components/PlNumberField/PlNumberField.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Number input field with increment/decrement buttons, validation, and min/max constraints.\n *\n * @example\n * <PlNumberField v-model=\"price\" :step=\"0.01\" :min-value=\"0\" label=\"Price\" />\n *\n * @example\n * <PlNumberField\n *   v-model=\"evenNumber\"\n *   :validate=\"(v) => v % 2 !== 0 ? 'Number must be even' : undefined\"\n *   :update-on-enter-or-click-outside=\"true\"\n *   label=\"Even Number\"\n * />\n */\nexport default {\n  name: 'PlNumberField',\n};\n</script>\n\n<script setup lang=\"ts\">\nimport './pl-number-field.scss';\nimport DoubleContour from '../../utils/DoubleContour.vue';\nimport { useLabelNotch } from '../../utils/useLabelNotch';\nimport { computed, ref, useSlots, watch } from 'vue';\nimport { PlTooltip } from '../PlTooltip';\nimport { parseNumber } from './parseNumber';\n\nconst props = withDefaults(defineProps<{\n  /** Input is disabled if true */\n  disabled?: boolean;\n  /** Label on the top border of the field, empty by default */\n  label?: string;\n  /** Input placeholder, empty by default */\n  placeholder?: string;\n  /** Step for increment/decrement buttons, 1 by default */\n  step?: number;\n  /** If defined - show an error if value is lower  */\n  minValue?: number;\n  /** If defined - show an error if value is higher */\n  maxValue?: number;\n  /** If false - remove buttons on the right */\n  useIncrementButtons?: boolean;\n  /** If true - changes do not apply immediately, they apply only by removing focus from the input (by click enter or by click outside)  */\n  updateOnEnterOrClickOutside?: boolean;\n  /** Error message that shows always when it's provided, without other checks */\n  errorMessage?: string;\n  /** Additional validity check for input value that must return an error text if failed */\n  validate?: (v: number) => string | undefined;\n  /** Makes some of corners not rounded */\n  groupPosition?: 'top' | 'bottom' | 'left' | 'right' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'middle';\n}>(), {\n  step: 1,\n  label: undefined,\n  placeholder: undefined,\n  minValue: undefined,\n  maxValue: undefined,\n  useIncrementButtons: true,\n  updateOnEnter: false,\n  errorMessage: undefined,\n  validate: undefined,\n  groupPosition: undefined,\n});\n\nconst modelValue = defineModel<number | undefined>({ required: true });\n\nconst slots = useSlots();\n\nconst rootRef = ref<HTMLElement>();\nconst inputRef = ref<HTMLInputElement>();\n\nuseLabelNotch(rootRef);\n\nfunction modelToString(v: number | undefined) {\n  return v === undefined ? '' : String(+v); // (+v) to avoid staying in input non-number values if they are provided in model\n}\n\nconst parsedResult = computed(() => parseNumber(props, inputValue.value));\n\nconst cachedValue = ref<string | undefined>(undefined);\n\nconst resetCachedValue = () => cachedValue.value = undefined;\n\nwatch(modelValue, (n) => {\n  const r = parsedResult.value;\n  if (r.error || n !== r.value) {\n    resetCachedValue();\n  }\n});\n\nconst inputValue = computed({\n  get() {\n    return cachedValue.value ?? modelToString(modelValue.value);\n  },\n  set(nextValue: string) {\n    const r = parseNumber(props, nextValue);\n\n    cachedValue.value = r.cleanInput;\n\n    if (r.error || props.updateOnEnterOrClickOutside) {\n      inputRef.value!.value = r.cleanInput;\n    } else {\n      modelValue.value = r.value;\n    }\n  },\n});\n\nconst focused = ref(false);\n\nfunction applyChanges() {\n  if (parsedResult.value.error === undefined) {\n    modelValue.value = parsedResult.value.value;\n  }\n}\n\nconst errors = computed(() => {\n  let ers: string[] = [];\n\n  if (props.errorMessage) {\n    ers.push(props.errorMessage);\n  }\n\n  const r = parsedResult.value;\n\n  if (r.error) {\n    ers.push(r.error.message);\n  } else if (props.validate && r.value !== undefined) {\n    const error = props.validate(r.value);\n    if (error) {\n      ers.push(error);\n    }\n  }\n\n  ers = [...ers];\n\n  return ers.join(' ');\n});\n\nconst isIncrementDisabled = computed(() => {\n  const r = parsedResult.value;\n\n  if (props.maxValue !== undefined && r.value !== undefined) {\n    return r.value >= props.maxValue;\n  }\n\n  return false;\n});\n\nconst isDecrementDisabled = computed(() => {\n  const r = parsedResult.value;\n\n  if (props.minValue !== undefined && r.value !== undefined) {\n    return r.value <= props.minValue;\n  }\n\n  return false;\n});\n\nconst multiplier = computed(() =>\n  10 ** (props.step.toString().split('.').at(1)?.length ?? 0),\n);\n\nfunction increment() {\n  const r = parsedResult.value;\n\n  const parsedValue = r.value;\n\n  if (!isIncrementDisabled.value) {\n    let nV;\n    if (parsedValue === undefined) {\n      nV = props.minValue ? props.minValue : 0;\n    } else {\n      nV = ((parsedValue || 0) * multiplier.value\n        + props.step * multiplier.value)\n      / multiplier.value;\n    }\n    modelValue.value = props.maxValue !== undefined ? Math.min(props.maxValue, nV) : nV;\n  }\n}\n\nfunction decrement() {\n  const r = parsedResult.value;\n\n  const parsedValue = r.value;\n\n  if (!isDecrementDisabled.value) {\n    let nV;\n    if (parsedValue === undefined) {\n      nV = 0;\n    } else {\n      nV = ((parsedValue || 0) * multiplier.value\n        - props.step * multiplier.value)\n      / multiplier.value;\n    }\n    modelValue.value = props.minValue !== undefined ? Math.max(props.minValue, nV) : nV;\n  }\n}\n\nfunction handleKeyPress(e: { code: string; preventDefault(): void }) {\n  if (props.updateOnEnterOrClickOutside) {\n    if (e.code === 'Escape') {\n      inputValue.value = modelToString(modelValue.value);\n      inputRef.value?.blur();\n    }\n    if (e.code === 'Enter') {\n      inputRef.value?.blur();\n    }\n  }\n\n  if (e.code === 'Enter') {\n    inputValue.value = String(modelValue.value); // to make .1 => 0.1, 10.00 => 10, remove leading zeros etc\n  }\n\n  if (['ArrowDown', 'ArrowUp'].includes(e.code)) {\n    e.preventDefault();\n  }\n\n  if (props.useIncrementButtons && e.code === 'ArrowUp') {\n    increment();\n  }\n\n  if (props.useIncrementButtons && e.code === 'ArrowDown') {\n    decrement();\n  }\n}\n\n// https://stackoverflow.com/questions/880512/prevent-text-selection-after-double-click#:~:text=If%20you%20encounter%20a%20situation,none%3B%20to%20the%20summary%20element.\n// this prevents selecting of more than input content in some cases,\n// but also disable selecting input content by double-click (useful feature)\nconst onMousedown = (ev: MouseEvent) => {\n  if (ev.detail > 1) {\n    ev.preventDefault();\n  }\n};\n</script>\n\n<template>\n  <div\n    ref=\"rootRef\"\n    :class=\"{ error: !!errors.trim(), disabled: disabled }\"\n    class=\"pl-number-field d-flex-column\"\n    @keydown=\"handleKeyPress($event)\"\n  >\n    <div class=\"pl-number-field__main-wrapper d-flex\">\n      <DoubleContour class=\"pl-number-field__contour\" :group-position=\"groupPosition\"/>\n      <div\n        class=\"pl-number-field__wrapper flex-grow d-flex flex-align-center\"\n        :class=\"{withoutArrows: !useIncrementButtons}\"\n      >\n        <label v-if=\"label\" class=\"text-description\">\n          {{ label }}\n          <PlTooltip v-if=\"slots.tooltip\" class=\"info\" position=\"top\">\n            <template #tooltip>\n              <slot name=\"tooltip\"/>\n            </template>\n          </PlTooltip>\n        </label>\n        <input\n          ref=\"inputRef\"\n          v-model=\"inputValue\"\n          :disabled=\"disabled\"\n          :placeholder=\"placeholder\"\n          class=\"text-s flex-grow\"\n          @focusin=\"focused = true\"\n          @focusout=\"focused = false; applyChanges()\"\n        />\n      </div>\n      <div v-if=\"useIncrementButtons\" class=\"pl-number-field__icons d-flex-column\" @mousedown=\"onMousedown\">\n        <div\n          :class=\"{ disabled: isIncrementDisabled }\"\n          class=\"pl-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center\"\n          @click=\"increment\"\n        >\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n            <path\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n              d=\"M8 4.93933L13.5303 10.4697L12.4697 11.5303L8 7.06065L3.53033 11.5303L2.46967 10.4697L8 4.93933Z\"\n              fill=\"#110529\"\n            />\n          </svg>\n        </div>\n        <div\n          :class=\"{ disabled: isDecrementDisabled }\"\n          class=\"pl-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center\"\n          @click=\"decrement\"\n        >\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\n            <path\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n              d=\"M2.46967 6.53033L3.53033 5.46967L8 9.93934L12.4697 5.46967L13.5303 6.53033L8 12.0607L2.46967 6.53033Z\"\n              fill=\"#110529\"\n            />\n          </svg>\n        </div>\n      </div>\n    </div>\n    <div v-if=\"errors.trim()\" class=\"pl-number-field__error\">\n      {{ errors }}\n    </div>\n  </div>\n</template>\n"],"names":["__default__","props","__props","modelValue","_useModel","slots","useSlots","rootRef","ref","inputRef","useLabelNotch","modelToString","v","parsedResult","computed","parseNumber","inputValue","cachedValue","resetCachedValue","watch","n","r","nextValue","focused","applyChanges","errors","ers","error","isIncrementDisabled","isDecrementDisabled","multiplier","_a","increment","parsedValue","nV","decrement","handleKeyPress","_b","onMousedown","ev","_createElementBlock","_cache","$event","_createElementVNode","_hoisted_1","_createVNode","DoubleContour","_normalizeClass","_openBlock","_hoisted_2","_createTextVNode","_toDisplayString","_unref","_createBlock","PlTooltip","_renderSlot","_ctx","_hoisted_4"],"mappings":"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"}

package/dist/components/PlProgressBar/PlProgressBar.vue.js

@@ -1,26 +1,26 @@
-import { defineComponent as l, computed as n, createElementBlock as p, createCommentVNode as i, openBlock as c, createElementVNode as e, normalizeStyle as d, toDisplayString as o } from "vue";
-const g = {
+import { defineComponent as a, computed as l, createElementBlock as n, createCommentVNode as c, openBlock as i, createElementVNode as s, normalizeStyle as d, toDisplayString as o } from "vue";
+const p = {
   key: 0,
   class: "ui-progress-bar"
-}, _ = { class: "ui-progress-bar__messages d-flex align-center pl-6 pr-6" }, m = { class: "ui-progress-bar__message flex-grow-1" }, u = { class: "ui-progress-bar__percent" }, v = /* @__PURE__ */ l({
+}, g = { class: "ui-progress-bar__messages d-flex align-center pl-6 pr-6" }, m = { class: "ui-progress-bar__message flex-grow-1" }, _ = { class: "ui-progress-bar__percent" }, v = /* @__PURE__ */ a({
   __name: "PlProgressBar",
   props: {
     loading: { type: Boolean },
     progress: { default: 0 },
     completeMessage: { default: "Completed" }
   },
-  setup(t) {
-    const r = t, a = n(() => r.progress === 100 ? r.completeMessage : "");
-    return (s, f) => s.loading ? (c(), p("div", g, [
-      e("div", {
+  setup(e) {
+    const r = e, t = l(() => r.progress === 100 ? r.completeMessage : "");
+    return (u, f) => e.loading ? (i(), n("div", p, [
+      s("div", {
         class: "ui-progress-bar__indicator",
-        style: d({ width: s.progress + "%" })
+        style: d({ width: e.progress + "%" })
       }, null, 4),
-      e("div", _, [
-        e("div", m, o(a.value), 1),
-        e("div", u, o(s.progress + "%"), 1)
+      s("div", g, [
+        s("div", m, o(t.value), 1),
+        s("div", _, o(e.progress + "%"), 1)
       ])
-    ])) : i("", !0);
+    ])) : c("", !0);
   }
 });
 export {

package/dist/components/PlProgressBar/PlProgressBar.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlProgressBar.vue.js","sources":["../../../src/components/PlProgressBar/PlProgressBar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue';\n\nconst props = withDefaults(\n  defineProps<{\n    loading: boolean;\n    progress: number;\n    completeMessage: string;\n  }>(),\n  { progress: 0, completeMessage: 'Completed' },\n);\n\nconst readyMsg = computed(() => (props.progress === 100 ? props.completeMessage : ''));\n</script>\n\n<template>\n  <div v-if=\"loading\" class=\"ui-progress-bar\">\n    <div class=\"ui-progress-bar__indicator\" :style=\"{ width: progress + '%' }\"/>\n    <div class=\"ui-progress-bar__messages d-flex align-center pl-6 pr-6\">\n      <div class=\"ui-progress-bar__message flex-grow-1\">{{ readyMsg }}</div>\n      <div class=\"ui-progress-bar__percent\">{{ progress + '%' }}</div>\n    </div>\n  </div>\n</template>\n"],"names":["props","__props","readyMsg","computed"],"mappings":";;;;;;;;;;;;AAGA,UAAMA,IAAQC,GASRC,IAAWC,EAAS,MAAOH,EAAM,aAAa,MAAMA,EAAM,kBAAkB,EAAG;;;;;;;;;;;;;"}
+{"version":3,"file":"PlProgressBar.vue.js","sources":["../../../src/components/PlProgressBar/PlProgressBar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue';\n\nconst props = withDefaults(\n  defineProps<{\n    loading: boolean;\n    progress: number;\n    completeMessage: string;\n  }>(),\n  { progress: 0, completeMessage: 'Completed' },\n);\n\nconst readyMsg = computed(() => (props.progress === 100 ? props.completeMessage : ''));\n</script>\n\n<template>\n  <div v-if=\"loading\" class=\"ui-progress-bar\">\n    <div class=\"ui-progress-bar__indicator\" :style=\"{ width: progress + '%' }\"/>\n    <div class=\"ui-progress-bar__messages d-flex align-center pl-6 pr-6\">\n      <div class=\"ui-progress-bar__message flex-grow-1\">{{ readyMsg }}</div>\n      <div class=\"ui-progress-bar__percent\">{{ progress + '%' }}</div>\n    </div>\n  </div>\n</template>\n"],"names":["props","__props","readyMsg","computed","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_hoisted_3","_toDisplayString","_hoisted_4"],"mappings":";;;;;;;;;;;;AAGA,UAAMA,IAAQC,GASRC,IAAWC,EAAS,MAAOH,EAAM,aAAa,MAAMA,EAAM,kBAAkB,EAAG;qBAIxEC,EAAA,WAAXG,EAAA,GAAAC,EAMM,OANNC,GAMM;AAAA,MALJC,EAA4E,OAAA;AAAA,QAAvE,OAAM;AAAA,QAA8B,kBAAgBN,EAAA,WAAQ,KAAA;AAAA,MAAA;MACjEM,EAGM,OAHNC,GAGM;AAAA,QAFJD,EAAsE,OAAtEE,GAAsEC,EAAjBR,EAAA,KAAQ,GAAA,CAAA;AAAA,QAC7DK,EAAgE,OAAhEI,GAAgED,EAAvBT,EAAA,WAAQ,GAAA,GAAA,CAAA;AAAA,MAAA;;;;"}

package/dist/components/PlProgressCell/PlProgressCell.vue.js

@@ -1,12 +1,12 @@
 (function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(".progress-cell{background-color:transparent;height:100%;position:relative;width:100%;overflow:hidden;border-radius:2px}.progress-cell .mask-error{--icon-color: var(--txt-error)}.progress-cell.not-started *{color:var(--txt-03)!important}.progress-cell.error *{color:var(--txt-error)!important}.progress-cell__white-bg{background-color:#fff}.progress-cell__indicator{position:absolute;height:100%;transition:width .4s ease-in-out;background:linear-gradient(90deg,#fff,#d8fac8);transition:width .2s ease-in-out}.progress-cell__body{padding:0 15px;display:flex;gap:12px;align-items:center;height:100%;width:100%;position:absolute;z-index:1}.progress-cell__stage{overflow:hidden;text-overflow:ellipsis;flex-shrink:1;text-wrap:nowrap}.progress-cell__percentage{flex-grow:1;flex-shrink:0;text-align:right}.progress-cell__stage--queued{color:var(--txt-03)}.progress-cell__infinity-loader{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;animation:move-gradient 2s linear infinite}.progress-cell__infinity-gradient{width:50%;height:100%;background:linear-gradient(90deg,#fff,#d8fac8,#fff)}@keyframes move-gradient{0%{transform:translate(-50%)}to{transform:translate(100%)}}")),document.head.appendChild(e)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}})();
-import { defineComponent as _, computed as n, createElementBlock as t, openBlock as s, normalizeClass as m, createCommentVNode as o, createElementVNode as l, normalizeStyle as f, toDisplayString as d, unref as g, createBlock as v, Fragment as y, createTextVNode as h } from "vue";
+import { defineComponent as m, computed as n, createElementBlock as s, openBlock as t, normalizeClass as f, createCommentVNode as o, createElementVNode as l, normalizeStyle as p, toDisplayString as c, unref as d, createBlock as v, Fragment as _, createTextVNode as y } from "vue";
 
-import k from "../PlIcon24/PlIcon24.vue.js";
-import { getErrorMessage as S } from "../../helpers/error.js";
-const w = {
+import h from "../PlIcon24/PlIcon24.vue.js";
+import { getErrorMessage as k } from "../../helpers/error.js";
+const x = {
   key: 0,
   class: "progress-cell__infinity-loader"
-}, B = { class: "progress-cell__body" }, C = { class: "progress-cell__stage text-s" }, P = { class: "progress-cell__percentage text-s d-flex align-center justify-end" }, b = /* @__PURE__ */ _({
+}, S = { class: "progress-cell__body" }, w = { class: "progress-cell__stage text-s" }, B = { class: "progress-cell__percentage text-s d-flex align-center justify-end" }, V = /* @__PURE__ */ m({
   __name: "PlProgressCell",
   props: {
     stage: { default: "not_started" },
@@ -15,28 +15,28 @@ const w = {
     progress: { default: void 0 },
     error: { default: void 0 }
   },
-  setup(c) {
-    const e = c, p = n(() => e.stage !== "not_started"), u = n(() => e.stage === "done" ? 100 : Math.min(100, e.progress || 0)), a = n(() => e.progress === void 0 && e.stage !== "done" && e.stage !== "not_started" && !e.error);
-    return (r, i) => (s(), t("div", {
-      class: m({ "progress-cell": !0, "progress-cell__white-bg": p.value, error: r.error, "not-started": e.stage === "not_started" })
+  setup(e) {
+    const r = e, g = n(() => r.stage !== "not_started"), u = n(() => r.stage === "done" ? 100 : Math.min(100, r.progress || 0)), a = n(() => r.progress === void 0 && r.stage !== "done" && r.stage !== "not_started" && !r.error);
+    return (C, i) => (t(), s("div", {
+      class: f({ "progress-cell": !0, "progress-cell__white-bg": g.value, error: e.error, "not-started": r.stage === "not_started" })
     }, [
-      a.value ? (s(), t("div", w, i[0] || (i[0] = [
+      a.value ? (t(), s("div", x, [...i[0] || (i[0] = [
         l("div", { class: "progress-cell__infinity-gradient" }, null, -1)
-      ]))) : o("", !0),
-      !a.value && !r.error ? (s(), t("div", {
+      ])])) : o("", !0),
+      !a.value && !e.error ? (t(), s("div", {
         key: 1,
         class: "progress-cell__indicator",
-        style: f({ width: u.value + "%" })
+        style: p({ width: u.value + "%" })
       }, null, 4)) : o("", !0),
-      l("div", B, [
-        l("div", C, d(r.error ? g(S)(r.error) : r.step), 1),
-        l("div", P, [
-          r.error ? (s(), v(g(k), {
+      l("div", S, [
+        l("div", w, c(e.error ? d(k)(e.error) : e.step), 1),
+        l("div", B, [
+          e.error ? (t(), v(d(h), {
             key: 0,
             name: "error"
           })) : o("", !0),
-          r.error ? o("", !0) : (s(), t(y, { key: 1 }, [
-            h(d(r.progressString), 1)
+          e.error ? o("", !0) : (t(), s(_, { key: 1 }, [
+            y(c(e.progressString), 1)
           ], 64))
         ])
       ])
@@ -44,6 +44,6 @@ const w = {
   }
 });
 export {
-  b as default
+  V as default
 };
 //# sourceMappingURL=PlProgressCell.vue.js.map

package/dist/components/PlProgressCell/PlProgressCell.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlProgressCell.vue.js","sources":["../../../src/components/PlProgressCell/PlProgressCell.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport './pl-progress-cell.scss';\nimport { computed } from 'vue';\nimport { PlMaskIcon24 } from '../PlMaskIcon24';\nimport type { PlProgressCellProps } from './types';\nimport { getErrorMessage } from '../../helpers/error.ts';\n\nconst props = withDefaults(defineProps<PlProgressCellProps>(), {\n  stage: 'not_started',\n  step: '', // main text (left)\n  progressString: '', // appended text on the right side (right)\n  progress: undefined,\n  error: undefined,\n});\n\nconst canShowWhiteBg = computed(() => props.stage !== 'not_started');\n\nconst currentProgress = computed(() => props.stage === 'done' ? 100 : Math.min(100, props.progress || 0));\n\nconst canShowInfinityLoader = computed(() => props.progress === undefined && props.stage !== 'done' && props.stage !== 'not_started' && !props.error);\n</script>\n\n<template>\n  <div :class=\"{'progress-cell':true, 'progress-cell__white-bg': canShowWhiteBg, error, 'not-started': props.stage === 'not_started' }\">\n    <div v-if=\"canShowInfinityLoader\" class=\"progress-cell__infinity-loader\">\n      <div class=\"progress-cell__infinity-gradient\"/>\n    </div>\n    <div v-if=\"!canShowInfinityLoader && !error\" class=\"progress-cell__indicator\" :style=\"{ width: currentProgress + '%' }\"/>\n    <div class=\"progress-cell__body\">\n      <div class=\"progress-cell__stage text-s\">\n        {{ error ? getErrorMessage(error) : step }}\n      </div>\n      <div class=\"progress-cell__percentage text-s d-flex align-center justify-end\">\n        <PlMaskIcon24 v-if=\"error\" name=\"error\" />\n        <template v-if=\"!error\">\n          {{ progressString }}\n        </template>\n      </div>\n    </div>\n  </div>\n</template>\n"],"names":["props","__props","canShowWhiteBg","computed","currentProgress","canShowInfinityLoader"],"mappings":";;;;;;;;;;;;;;;;;AAOA,UAAMA,IAAQC,GAQRC,IAAiBC,EAAS,MAAMH,EAAM,UAAU,aAAa,GAE7DI,IAAkBD,EAAS,MAAMH,EAAM,UAAU,SAAS,MAAM,KAAK,IAAI,KAAKA,EAAM,YAAY,CAAC,CAAC,GAElGK,IAAwBF,EAAS,MAAMH,EAAM,aAAa,UAAaA,EAAM,UAAU,UAAUA,EAAM,UAAU,iBAAiB,CAACA,EAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"PlProgressCell.vue.js","sources":["../../../src/components/PlProgressCell/PlProgressCell.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport './pl-progress-cell.scss';\nimport { computed } from 'vue';\nimport { PlMaskIcon24 } from '../PlMaskIcon24';\nimport type { PlProgressCellProps } from './types';\nimport { getErrorMessage } from '../../helpers/error.ts';\n\nconst props = withDefaults(defineProps<PlProgressCellProps>(), {\n  stage: 'not_started',\n  step: '', // main text (left)\n  progressString: '', // appended text on the right side (right)\n  progress: undefined,\n  error: undefined,\n});\n\nconst canShowWhiteBg = computed(() => props.stage !== 'not_started');\n\nconst currentProgress = computed(() => props.stage === 'done' ? 100 : Math.min(100, props.progress || 0));\n\nconst canShowInfinityLoader = computed(() => props.progress === undefined && props.stage !== 'done' && props.stage !== 'not_started' && !props.error);\n</script>\n\n<template>\n  <div :class=\"{'progress-cell':true, 'progress-cell__white-bg': canShowWhiteBg, error, 'not-started': props.stage === 'not_started' }\">\n    <div v-if=\"canShowInfinityLoader\" class=\"progress-cell__infinity-loader\">\n      <div class=\"progress-cell__infinity-gradient\"/>\n    </div>\n    <div v-if=\"!canShowInfinityLoader && !error\" class=\"progress-cell__indicator\" :style=\"{ width: currentProgress + '%' }\"/>\n    <div class=\"progress-cell__body\">\n      <div class=\"progress-cell__stage text-s\">\n        {{ error ? getErrorMessage(error) : step }}\n      </div>\n      <div class=\"progress-cell__percentage text-s d-flex align-center justify-end\">\n        <PlMaskIcon24 v-if=\"error\" name=\"error\" />\n        <template v-if=\"!error\">\n          {{ progressString }}\n        </template>\n      </div>\n    </div>\n  </div>\n</template>\n"],"names":["props","__props","canShowWhiteBg","computed","currentProgress","canShowInfinityLoader","_createElementBlock","_openBlock","_hoisted_1","_cache","_createElementVNode","_hoisted_2","_hoisted_3","_toDisplayString","_unref","getErrorMessage","_hoisted_4","_createBlock","PlMaskIcon24","_Fragment"],"mappings":";;;;;;;;;;;;;;;;;AAOA,UAAMA,IAAQC,GAQRC,IAAiBC,EAAS,MAAMH,EAAM,UAAU,aAAa,GAE7DI,IAAkBD,EAAS,MAAMH,EAAM,UAAU,SAAS,MAAM,KAAK,IAAI,KAAKA,EAAM,YAAY,CAAC,CAAC,GAElGK,IAAwBF,EAAS,MAAMH,EAAM,aAAa,UAAaA,EAAM,UAAU,UAAUA,EAAM,UAAU,iBAAiB,CAACA,EAAM,KAAK;2BAIlJM,EAgBM,OAAA;AAAA,MAhBA,2DAAyDJ,EAAA,OAAc,OAAED,SAAK,eAAiBD,EAAM,UAAK,eAAA;AAAA,IAAA;MACnGK,EAAA,SAAXE,KAAAD,EAEM,OAFNE,GAEM,CAAA,GAAAC,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA;AAAA,QADJC,EAA+C,OAAA,EAA1C,OAAM,mCAAA,GAAkC,MAAA,EAAA;AAAA,MAAA;MAEnC,CAAAL,EAAA,UAA0BJ,EAAA,cAAtCK,EAAyH,OAAA;AAAA;QAA5E,OAAM;AAAA,QAA4B,kBAAgBF,EAAA,QAAe,KAAA;AAAA,MAAA;MAC9GM,EAUM,OAVNC,GAUM;AAAA,QATJD,EAEM,OAFNE,GAEMC,EADDZ,EAAA,QAAQa,EAAAC,CAAA,EAAgBd,EAAA,KAAK,IAAIA,EAAA,IAAI,GAAA,CAAA;AAAA,QAE1CS,EAKM,OALNM,GAKM;AAAA,UAJgBf,EAAA,cAApBgB,EAA0CH,EAAAI,CAAA,GAAA;AAAA;YAAf,MAAK;AAAA,UAAA;UACfjB,EAAA,0BAAjBK,EAEWa,GAAA,EAAA,KAAA,KAAA;AAAA,gBADNlB,EAAA,cAAc,GAAA,CAAA;AAAA,UAAA;;;;;;"}

package/dist/components/PlRadio/PlRadio.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlRadio.vue2.js","sources":["../../../src/components/PlRadio/PlRadio.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"M\">\nimport { inject } from 'vue';\nimport { radioGroupModelKey, radioGroupNameKey } from './keys';\n// eslint-disable-next-line @typescript-eslint/no-unused-vars -- used by the props documentation\nimport type PlRadioGroup from './PlRadioGroup.vue';\n\nconst standaloneModel = defineModel<M>();\n\nconst { name: standaloneName, ...props } = defineProps<{\n  /** Used to group multiple radio controls. Will be ignored if this component is a descendant of a {@link PlRadioGroup}. */\n  name?: string;\n  /** Value that goes into `v-model`. */\n  value?: M;\n  /** Whether the radio control is disabled. */\n  disabled?: boolean;\n}>();\n\ndefineSlots<{\n  /** Label of the radio control. */\n  default?(): unknown;\n}>();\n\nconst name = inject(radioGroupNameKey, standaloneName);\nconst model = inject<typeof standaloneModel>(radioGroupModelKey, standaloneModel);\n</script>\n\n<template>\n  <label :class=\"$style.container\">\n    <input v-model=\"model\" :class=\"$style.input\" type=\"radio\" :name v-bind=\"props\" />\n    <span :class=\"$style.label\"><slot /></span>\n  </label>\n</template>\n\n<style module>\n  .container {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    padding: 4px;\n    border-radius: 6px;\n    transition: all 200ms ease-in-out;\n    color: var(--txt-01);\n    user-select: none;\n    &:hover:not(:has(:disabled)) {\n      background: var(--btn-sec-hover-grey);\n    }\n    &:has(:disabled) {\n      color: var(--dis-01);\n    }\n  }\n\n  .input {\n    appearance: none;\n    position: relative;\n    block-size: 24px;\n    aspect-ratio: 1;\n    margin: 0;\n    border-radius: 50%;\n    outline: 2px solid transparent;\n    color: inherit;\n    transition: inherit;\n    &:focus {\n      outline-color: var(--border-color-focus);\n    }\n    &::before {\n      content: \"\";\n      position: absolute;\n      inset: 2px;\n      border-radius: 50%;\n      border: 2px solid;\n    }\n    &::after {\n      content: \"\";\n      position: absolute;\n      inset: 7.5px;\n      border-radius: 50%;\n      background-color: currentColor;\n      scale: 0;\n      transition: inherit;\n    }\n    &:checked::after {\n      scale: 1;\n    }\n  }\n\n  .label {\n    padding-inline: 4px;\n    line-height: calc(20 / 14);\n    font-weight: 500;\n    text-box: trim-both cap alphabetic;\n  }\n</style>\n"],"names":["standaloneModel","_useModel","__props","props","_createPropsRestProxy","name","inject","radioGroupNameKey","model","radioGroupModelKey"],"mappings":";;;;;;;;;;;;;;AAMA,UAAMA,IAAkBC,EAAcC,GAAA,YAAC,GAEjCC,IAAqCC,EAAAF,GAAA,CAAA,MAAA,CAAA,GAcrCG,IAAOC,EAAOC,GAAmBL,MAAc,GAC/CM,IAAQF,EAA+BG,GAAoBT,CAAe;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"PlRadio.vue2.js","sources":["../../../src/components/PlRadio/PlRadio.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"M\">\nimport { inject } from 'vue';\nimport { radioGroupModelKey, radioGroupNameKey } from './keys';\n// eslint-disable-next-line @typescript-eslint/no-unused-vars -- used by the props documentation\nimport type PlRadioGroup from './PlRadioGroup.vue';\n\nconst standaloneModel = defineModel<M>();\n\nconst { name: standaloneName, ...props } = defineProps<{\n  /** Used to group multiple radio controls. Will be ignored if this component is a descendant of a {@link PlRadioGroup}. */\n  name?: string;\n  /** Value that goes into `v-model`. */\n  value?: M;\n  /** Whether the radio control is disabled. */\n  disabled?: boolean;\n}>();\n\ndefineSlots<{\n  /** Label of the radio control. */\n  default?(): unknown;\n}>();\n\nconst name = inject(radioGroupNameKey, standaloneName);\nconst model = inject<typeof standaloneModel>(radioGroupModelKey, standaloneModel);\n</script>\n\n<template>\n  <label :class=\"$style.container\">\n    <input v-model=\"model\" :class=\"$style.input\" type=\"radio\" :name v-bind=\"props\" />\n    <span :class=\"$style.label\"><slot /></span>\n  </label>\n</template>\n\n<style module>\n  .container {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    padding: 4px;\n    border-radius: 6px;\n    transition: all 200ms ease-in-out;\n    color: var(--txt-01);\n    user-select: none;\n    &:hover:not(:has(:disabled)) {\n      background: var(--btn-sec-hover-grey);\n    }\n    &:has(:disabled) {\n      color: var(--dis-01);\n    }\n  }\n\n  .input {\n    appearance: none;\n    position: relative;\n    block-size: 24px;\n    aspect-ratio: 1;\n    margin: 0;\n    border-radius: 50%;\n    outline: 2px solid transparent;\n    color: inherit;\n    transition: inherit;\n    &:focus {\n      outline-color: var(--border-color-focus);\n    }\n    &::before {\n      content: \"\";\n      position: absolute;\n      inset: 2px;\n      border-radius: 50%;\n      border: 2px solid;\n    }\n    &::after {\n      content: \"\";\n      position: absolute;\n      inset: 7.5px;\n      border-radius: 50%;\n      background-color: currentColor;\n      scale: 0;\n      transition: inherit;\n    }\n    &:checked::after {\n      scale: 1;\n    }\n  }\n\n  .label {\n    padding-inline: 4px;\n    line-height: calc(20 / 14);\n    font-weight: 500;\n    text-box: trim-both cap alphabetic;\n  }\n</style>\n"],"names":["standaloneModel","_useModel","__props","props","_createPropsRestProxy","name","inject","radioGroupNameKey","model","radioGroupModelKey","_createElementBlock","_normalizeClass","$style","_withDirectives","_createElementVNode","_mergeProps","$event","_unref","_hoisted_1","_renderSlot","_ctx"],"mappings":";;;;;;;;;;;;;;AAMA,UAAMA,IAAkBC,EAAcC,GAAA,YAAC,GAEjCC,IAAqCC,EAAAF,GAAA,CAAA,MAAA,CAAA,GAcrCG,IAAOC,EAAOC,GAAmBL,MAAc,GAC/CM,IAAQF,EAA+BG,GAAoBT,CAAe;2BAI9EU,EAGQ,SAAA;AAAA,MAHA,OAAKC,EAAEC,EAAAA,OAAO,SAAS;AAAA,IAAA;MAC7BC,EAAAC,EAAiF,SAAjFC,EAAiF;AAAA,6DAAjEP,EAAK,QAAAQ,IAAA;AAAA,QAAG,OAAOJ,EAAAA,OAAO;AAAA,QAAO,MAAK;AAAA,QAAS,MAAAK,EAAAZ,CAAA;AAAA,MAAA,GAAaF,CAAK,GAAA,MAAA,IAAAe,CAAA,GAAA;AAAA,YAA7DD,EAAAT,CAAA,CAAK;AAAA,MAAA;MACrBM,EAA2C,QAAA;AAAA,QAApC,OAAKH,EAAEC,EAAAA,OAAO,KAAK;AAAA,MAAA;QAAEO,EAAQC,EAAA,QAAA,SAAA;AAAA,MAAA;;;;"}