@milaboratories/uikit 2.3.25 → 2.3.26

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,18 +1,21 @@
1
- (function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode(".mi-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}.mi-number-field ::placeholder{color:#cfd1db;opacity:1}.mi-number-field__main-wrapper{height:40px;position:relative}.mi-number-field__wrapper{padding-left:12px;border-radius:6px}.mi-number-field__wrapper.withoutArrows{padding-right:12px}.mi-number-field__icons{width:40px;border-radius:0 6px 6px 0;border-left:1px solid var(--contour-color)}.mi-number-field__icon{line-height:0}.mi-number-field__icon.disabled{cursor:not-allowed;position:relative;z-index:1}.mi-number-field__icon.disabled svg path{fill:#cfd1db}.mi-number-field__icon:hover{background-color:#9babcc29}.mi-number-field__icon:first-child{border-bottom:1px solid var(--contour-color)}.mi-number-field__hint{margin-top:3px;color:var(--color-hint)}.mi-number-field input{outline:none;border:none;width:100%;background:unset;text-overflow:ellipsis}.mi-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}.mi-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)}.mi-number-field:focus-within.error{--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--color-error-shadow)}.mi-number-field.error{--contour-color: var(--txt-error);--label-color: var(--txt-error);--color-hint: var(--txt-error)}.mi-number-field.disabled{--contour-color: var(--color-dis-01);--control-mask-fill: var(--color-dis-01);cursor:not-allowed}.mi-number-field.disabled label,.mi-number-field.disabled .mi-number-field__hint,.mi-number-field.disabled input{color:var(--contour-color)}.mi-number-field.disabled svg path{fill:var(--contour-color)}.mi-number-field.disabled .mi-number-field__icons{pointer-events:none}.mi-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}.mi-number-field label .required{display:inline-block;font-weight:500;font-size:12px;line-height:16px;color:var(--txt-error);margin-right:4px}")),document.head.appendChild(r)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
2
- import { defineComponent as F, mergeModels as I, useModel as A, ref as v, useSlots as T, computed as s, watch as P, createElementBlock as m, openBlock as f, normalizeClass as c, createElementVNode as n, createCommentVNode as p, createVNode as U, withDirectives as j, createTextVNode as K, createBlock as R, toDisplayString as C, unref as E, withCtx as Z, renderSlot as q, vModelText as z } from "vue";
1
+ (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}")),document.head.appendChild(r)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
2
+ import { defineComponent as S, mergeModels as A, useModel as R, useSlots as F, ref as f, computed as i, watch as $, createElementBlock as c, openBlock as d, normalizeClass as p, createElementVNode as r, createCommentVNode as m, createVNode as j, withDirectives as T, createTextVNode as U, createBlock as K, toDisplayString as _, unref as C, withCtx as P, renderSlot as Z, vModelText as q } from "vue";
3
3
 
4
- import G from "../../utils/DoubleContour.vue.js";
5
- import { useLabelNotch as X } from "../../utils/useLabelNotch.js";
4
+ import z from "../../utils/DoubleContour.vue.js";
5
+ import { useLabelNotch as G } from "../../utils/useLabelNotch.js";
6
6
  import H from "../PlTooltip/PlTooltip.vue.js";
7
- const J = { class: "mi-number-field__main-wrapper d-flex" }, Q = {
7
+ import { parseNumber as M } from "./parseNumber.js";
8
+ const J = { class: "pl-number-field__main-wrapper d-flex" }, Q = {
8
9
  key: 0,
9
10
  class: "text-description"
10
- }, W = ["disabled", "placeholder"], Y = {
11
+ }, W = ["disabled", "placeholder"], X = {
11
12
  key: 0,
12
- class: "mi-number-field__hint text-description"
13
- }, ne = /* @__PURE__ */ F({
14
- __name: "PlNumberField",
15
- props: /* @__PURE__ */ I({
13
+ class: "pl-number-field__error"
14
+ }, Y = {
15
+ name: "PlNumberField"
16
+ }, ue = /* @__PURE__ */ S({
17
+ ...Y,
18
+ props: /* @__PURE__ */ A({
16
19
  disabled: { type: Boolean },
17
20
  label: { default: void 0 },
18
21
  placeholder: { default: void 0 },
@@ -28,144 +31,129 @@ const J = { class: "mi-number-field__main-wrapper d-flex" }, Q = {
28
31
  modelModifiers: {}
29
32
  }),
30
33
  emits: ["update:modelValue"],
31
- setup(w) {
32
- const t = w, a = A(w, "modelValue"), g = v(), D = T(), d = v();
33
- X(g);
34
- function V(e) {
35
- return e === void 0 ? "" : String(+e);
36
- }
37
- function h(e) {
38
- return e === "." || e === "," || e === "-";
39
- }
34
+ setup(g) {
35
+ const t = g, n = R(g, "modelValue"), D = F(), V = f(), v = f();
36
+ G(V);
40
37
  function x(e) {
41
- if (e === "")
42
- return;
43
- if (h(e))
44
- return 0;
45
- let l = e;
46
- return l = l.replace(",", "."), l = l.replace("−", "-"), l = l.replace("–", "-"), l = l.replace("+", ""), parseFloat(l);
38
+ return e === void 0 ? "" : String(+e);
47
39
  }
48
- const o = v(V(a.value)), r = s(() => x(o.value));
49
- P(() => a.value, (e) => {
50
- parseFloat(o.value) !== e && (o.value = V(e));
40
+ const u = i(() => M(t, s.value)), w = f(void 0), O = () => w.value = void 0;
41
+ $(n, (e) => {
42
+ const l = u.value;
43
+ (l.error || e !== l.value) && O();
51
44
  });
52
- const O = /^[-−–+]?(\d+)?[\\.,]?(\d+)?$/, y = s({
45
+ const s = i({
53
46
  get() {
54
- return o.value;
47
+ return w.value ?? x(n.value);
55
48
  },
56
49
  set(e) {
57
- const l = x(e);
58
- l === void 0 || e.match(O) && !isNaN(l) ? (o.value = e, !t.updateOnEnterOrClickOutside && !h(e) && B()) : d.value && (d.value.value = o.value);
50
+ const l = M(t, e);
51
+ w.value = l.cleanInput, l.error || t.updateOnEnterOrClickOutside ? v.value.value = l.cleanInput : n.value = l.value;
59
52
  }
60
- }), k = v(!1);
61
- function B() {
62
- if (o.value === "") {
63
- a.value = void 0;
64
- return;
65
- }
66
- a.value = r.value;
53
+ }), h = f(!1);
54
+ function E() {
55
+ u.value.error === void 0 && (n.value = u.value.value);
67
56
  }
68
- const b = s(() => {
57
+ const b = i(() => {
69
58
  let e = [];
70
59
  t.errorMessage && e.push(t.errorMessage);
71
- const l = r.value;
72
- if (l !== void 0 && isNaN(l))
73
- e.push("Value is not a number");
74
- else if (t.validate && l !== void 0) {
75
- const i = t.validate(l);
76
- i && e.push(i);
77
- } else
78
- t.minValue !== void 0 && l !== void 0 && l < t.minValue && e.push(`Value must be higher than ${t.minValue}`), t.maxValue !== void 0 && l !== void 0 && l > t.maxValue && e.push(`Value must be less than ${t.maxValue}`);
60
+ const l = u.value;
61
+ if (l.error)
62
+ e.push(l.error.message);
63
+ else if (t.validate && l.value !== void 0) {
64
+ const o = t.validate(l.value);
65
+ o && e.push(o);
66
+ }
79
67
  return e = [...e], e.join(" ");
80
- }), M = s(() => {
81
- const e = r.value;
82
- return t.maxValue !== void 0 && e !== void 0 ? e >= t.maxValue : !1;
83
- }), L = s(() => {
84
- const e = r.value;
85
- return t.minValue !== void 0 && e !== void 0 ? e <= t.minValue : !1;
86
- }), u = s(
68
+ }), y = i(() => {
69
+ const e = u.value;
70
+ return t.maxValue !== void 0 && e.value !== void 0 ? e.value >= t.maxValue : !1;
71
+ }), k = i(() => {
72
+ const e = u.value;
73
+ return t.minValue !== void 0 && e.value !== void 0 ? e.value <= t.minValue : !1;
74
+ }), a = i(
87
75
  () => {
88
76
  var e;
89
77
  return 10 ** (((e = t.step.toString().split(".").at(1)) == null ? void 0 : e.length) ?? 0);
90
78
  }
91
79
  );
92
- function N() {
93
- const e = r.value;
94
- if (!M.value) {
95
- let l;
96
- e === void 0 ? l = t.minValue ? t.minValue : 0 : l = ((e || 0) * u.value + t.step * u.value) / u.value, a.value = t.maxValue !== void 0 ? Math.min(t.maxValue, l) : l;
80
+ function B() {
81
+ const l = u.value.value;
82
+ if (!y.value) {
83
+ let o;
84
+ l === void 0 ? o = t.minValue ? t.minValue : 0 : o = ((l || 0) * a.value + t.step * a.value) / a.value, n.value = t.maxValue !== void 0 ? Math.min(t.maxValue, o) : o;
97
85
  }
98
86
  }
99
- function _() {
100
- const e = r.value;
101
- if (!L.value) {
102
- let l;
103
- e === void 0 ? l = 0 : l = ((e || 0) * u.value - t.step * u.value) / u.value, a.value = t.minValue !== void 0 ? Math.max(t.minValue, l) : l;
87
+ function L() {
88
+ const l = u.value.value;
89
+ if (!k.value) {
90
+ let o;
91
+ l === void 0 ? o = 0 : o = ((l || 0) * a.value - t.step * a.value) / a.value, n.value = t.minValue !== void 0 ? Math.max(t.minValue, o) : o;
104
92
  }
105
93
  }
106
- function S(e) {
107
- var l, i;
108
- t.updateOnEnterOrClickOutside && (e.code === "Escape" && (o.value = V(a.value), (l = d.value) == null || l.blur()), e.code === "Enter" && ((i = d.value) == null || i.blur())), e.code === "Enter" && (o.value = String(a.value)), ["ArrowDown", "ArrowUp"].includes(e.code) && e.preventDefault(), t.useIncrementButtons && e.code === "ArrowUp" && N(), t.useIncrementButtons && e.code === "ArrowDown" && _();
94
+ function I(e) {
95
+ var l, o;
96
+ t.updateOnEnterOrClickOutside && (e.code === "Escape" && (s.value = x(n.value), (l = v.value) == null || l.blur()), e.code === "Enter" && ((o = v.value) == null || o.blur())), e.code === "Enter" && (s.value = String(n.value)), ["ArrowDown", "ArrowUp"].includes(e.code) && e.preventDefault(), t.useIncrementButtons && e.code === "ArrowUp" && B(), t.useIncrementButtons && e.code === "ArrowDown" && L();
109
97
  }
110
- const $ = (e) => {
98
+ const N = (e) => {
111
99
  e.detail > 1 && e.preventDefault();
112
100
  };
113
- return (e, l) => (f(), m("div", {
114
- ref_key: "root",
115
- ref: g,
116
- class: c([{ error: !!b.value.trim(), disabled: e.disabled }, "mi-number-field d-flex-column"]),
117
- onKeydown: l[3] || (l[3] = (i) => S(i))
101
+ return (e, l) => (d(), c("div", {
102
+ ref_key: "rootRef",
103
+ ref: V,
104
+ class: p([{ error: !!b.value.trim(), disabled: e.disabled }, "pl-number-field d-flex-column"]),
105
+ onKeydown: l[3] || (l[3] = (o) => I(o))
118
106
  }, [
119
- n("div", J, [
120
- U(G, { class: "mi-number-field__contour" }),
121
- n("div", {
122
- class: c(["mi-number-field__wrapper flex-grow d-flex flex-align-center", { withoutArrows: !e.useIncrementButtons }])
107
+ r("div", J, [
108
+ j(z, { class: "pl-number-field__contour" }),
109
+ r("div", {
110
+ class: p(["pl-number-field__wrapper flex-grow d-flex flex-align-center", { withoutArrows: !e.useIncrementButtons }])
123
111
  }, [
124
- e.label ? (f(), m("label", Q, [
125
- K(C(e.label) + " ", 1),
126
- E(D).tooltip ? (f(), R(E(H), {
112
+ e.label ? (d(), c("label", Q, [
113
+ U(_(e.label) + " ", 1),
114
+ C(D).tooltip ? (d(), K(C(H), {
127
115
  key: 0,
128
116
  class: "info",
129
117
  position: "top"
130
118
  }, {
131
- tooltip: Z(() => [
132
- q(e.$slots, "tooltip")
119
+ tooltip: P(() => [
120
+ Z(e.$slots, "tooltip")
133
121
  ]),
134
122
  _: 3
135
- })) : p("", !0)
136
- ])) : p("", !0),
137
- j(n("input", {
138
- ref_key: "input",
139
- ref: d,
140
- "onUpdate:modelValue": l[0] || (l[0] = (i) => y.value = i),
123
+ })) : m("", !0)
124
+ ])) : m("", !0),
125
+ T(r("input", {
126
+ ref_key: "inputRef",
127
+ ref: v,
128
+ "onUpdate:modelValue": l[0] || (l[0] = (o) => s.value = o),
141
129
  disabled: e.disabled,
142
130
  placeholder: e.placeholder,
143
131
  class: "text-s flex-grow",
144
- onFocusin: l[1] || (l[1] = (i) => k.value = !0),
145
- onFocusout: l[2] || (l[2] = (i) => {
146
- k.value = !1, B();
132
+ onFocusin: l[1] || (l[1] = (o) => h.value = !0),
133
+ onFocusout: l[2] || (l[2] = (o) => {
134
+ h.value = !1, E();
147
135
  })
148
136
  }, null, 40, W), [
149
- [z, y.value]
137
+ [q, s.value]
150
138
  ])
151
139
  ], 2),
152
- e.useIncrementButtons ? (f(), m("div", {
140
+ e.useIncrementButtons ? (d(), c("div", {
153
141
  key: 0,
154
- class: "mi-number-field__icons d-flex-column",
155
- onMousedown: $
142
+ class: "pl-number-field__icons d-flex-column",
143
+ onMousedown: N
156
144
  }, [
157
- n("div", {
158
- class: c([{ disabled: M.value }, "mi-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center"]),
159
- onClick: N
145
+ r("div", {
146
+ class: p([{ disabled: y.value }, "pl-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center"]),
147
+ onClick: B
160
148
  }, l[4] || (l[4] = [
161
- n("svg", {
149
+ r("svg", {
162
150
  xmlns: "http://www.w3.org/2000/svg",
163
151
  width: "16",
164
152
  height: "16",
165
153
  viewBox: "0 0 16 16",
166
154
  fill: "none"
167
155
  }, [
168
- n("path", {
156
+ r("path", {
169
157
  "fill-rule": "evenodd",
170
158
  "clip-rule": "evenodd",
171
159
  d: "M8 4.93933L13.5303 10.4697L12.4697 11.5303L8 7.06065L3.53033 11.5303L2.46967 10.4697L8 4.93933Z",
@@ -173,18 +161,18 @@ const J = { class: "mi-number-field__main-wrapper d-flex" }, Q = {
173
161
  })
174
162
  ], -1)
175
163
  ]), 2),
176
- n("div", {
177
- class: c([{ disabled: L.value }, "mi-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center"]),
178
- onClick: _
164
+ r("div", {
165
+ class: p([{ disabled: k.value }, "pl-number-field__icon d-flex flex-justify-center uc-pointer flex-grow flex-align-center"]),
166
+ onClick: L
179
167
  }, l[5] || (l[5] = [
180
- n("svg", {
168
+ r("svg", {
181
169
  xmlns: "http://www.w3.org/2000/svg",
182
170
  width: "16",
183
171
  height: "16",
184
172
  viewBox: "0 0 16 16",
185
173
  fill: "none"
186
174
  }, [
187
- n("path", {
175
+ r("path", {
188
176
  "fill-rule": "evenodd",
189
177
  "clip-rule": "evenodd",
190
178
  d: "M2.46967 6.53033L3.53033 5.46967L8 9.93934L12.4697 5.46967L13.5303 6.53033L8 12.0607L2.46967 6.53033Z",
@@ -192,13 +180,13 @@ const J = { class: "mi-number-field__main-wrapper d-flex" }, Q = {
192
180
  })
193
181
  ], -1)
194
182
  ]), 2)
195
- ], 32)) : p("", !0)
183
+ ], 32)) : m("", !0)
196
184
  ]),
197
- b.value.trim() ? (f(), m("div", Y, C(b.value), 1)) : p("", !0)
185
+ b.value.trim() ? (d(), c("div", X, _(b.value), 1)) : m("", !0)
198
186
  ], 34));
199
187
  }
200
188
  });
201
189
  export {
202
- ne as default
190
+ ue as default
203
191
  };
204
192
  //# sourceMappingURL=PlNumberField.vue.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"PlNumberField.vue.js","sources":["../../../src/components/PlNumberField/PlNumberField.vue"],"sourcesContent":["<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';\n\ntype NumberInputProps = {\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};\n\nconst props = withDefaults(defineProps<NumberInputProps>(), {\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});\n\nconst modelValue = defineModel<number | undefined>({ required: true });\n\nconst root = ref<HTMLElement>();\nconst slots = useSlots();\nconst input = ref<HTMLInputElement>();\n\nuseLabelNotch(root);\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\nfunction isPartial(v: string) {\n return v === '.' || v === ',' || v === '-';\n}\nfunction stringToModel(v: string) {\n if (v === '') {\n return undefined;\n }\n if (isPartial(v)) {\n return 0;\n }\n let forParsing = v;\n forParsing = forParsing.replace(',', '.');\n forParsing = forParsing.replace('−', '-'); // minus, replacing for the case of input the whole copied value\n forParsing = forParsing.replace('–', '-'); // dash, replacing for the case of input the whole copied value\n forParsing = forParsing.replace('+', '');\n return parseFloat(forParsing);\n}\n\nconst innerTextValue = ref(modelToString(modelValue.value));\nconst innerNumberValue = computed(() => stringToModel(innerTextValue.value));\n\nwatch(() => modelValue.value, (outerValue) => { // update inner value if outer value is changed\n if (parseFloat(innerTextValue.value) !== outerValue) {\n innerTextValue.value = modelToString(outerValue);\n }\n});\n\nconst NUMBER_REGEX = /^[-−–+]?(\\d+)?[\\\\.,]?(\\d+)?$/; // parseFloat works without errors on strings with multiple dots, or letters in value\nconst inputValue = computed({\n get() {\n return innerTextValue.value;\n },\n set(nextValue: string) {\n const parsedValue = stringToModel(nextValue);\n // we allow to set empty value or valid numeric value, otherwise reset input value to previous valid\n if (parsedValue === undefined\n || (nextValue.match(NUMBER_REGEX) && !isNaN(parsedValue))\n ) {\n innerTextValue.value = nextValue;\n if (!props.updateOnEnterOrClickOutside && !isPartial(nextValue)) { // to avoid applying '-' or '.'\n applyChanges();\n }\n } else if (input.value) {\n input.value.value = innerTextValue.value;\n }\n },\n});\nconst focused = ref(false);\n\nfunction applyChanges() {\n if (innerTextValue.value === '') {\n modelValue.value = undefined;\n return;\n }\n modelValue.value = innerNumberValue.value;\n}\n\nconst errors = computed(() => {\n let ers: string[] = [];\n if (props.errorMessage) {\n ers.push(props.errorMessage);\n }\n const parsedValue = innerNumberValue.value;\n if (parsedValue !== undefined && isNaN(parsedValue)) {\n ers.push('Value is not a number');\n } else if (props.validate && parsedValue !== undefined) {\n const error = props.validate(parsedValue);\n if (error) {\n ers.push(error);\n }\n } else {\n if (props.minValue !== undefined && parsedValue !== undefined && parsedValue < props.minValue) {\n ers.push(`Value must be higher than ${props.minValue}`);\n }\n if (props.maxValue !== undefined && parsedValue !== undefined && parsedValue > props.maxValue) {\n ers.push(`Value must be less than ${props.maxValue}`);\n }\n }\n\n ers = [...ers];\n\n return ers.join(' ');\n});\n\nconst isIncrementDisabled = computed(() => {\n const parsedValue = innerNumberValue.value;\n if (props.maxValue !== undefined && parsedValue !== undefined) {\n return parsedValue >= props.maxValue;\n }\n return false;\n});\n\nconst isDecrementDisabled = computed(() => {\n const parsedValue = innerNumberValue.value;\n if (props.minValue !== undefined && parsedValue !== undefined) {\n return parsedValue <= props.minValue;\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 parsedValue = innerNumberValue.value;\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 parsedValue = innerNumberValue.value;\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 innerTextValue.value = modelToString(modelValue.value);\n input.value?.blur();\n }\n if (e.code === 'Enter') {\n input.value?.blur();\n }\n }\n\n if (e.code === 'Enter') {\n innerTextValue.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 if (props.useIncrementButtons && e.code === 'ArrowUp') {\n increment();\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=\"root\"\n :class=\"{ error: !!errors.trim(), disabled: disabled }\"\n class=\"mi-number-field d-flex-column\"\n @keydown=\"handleKeyPress($event)\"\n >\n <div class=\"mi-number-field__main-wrapper d-flex\">\n <DoubleContour class=\"mi-number-field__contour\"/>\n <div\n class=\"mi-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=\"input\"\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=\"mi-number-field__icons d-flex-column\" @mousedown=\"onMousedown\">\n <div\n :class=\"{ disabled: isIncrementDisabled }\"\n class=\"mi-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=\"mi-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=\"mi-number-field__hint text-description\">\n {{ errors }}\n </div>\n </div>\n</template>\n"],"names":["props","__props","modelValue","_useModel","root","ref","slots","useSlots","input","useLabelNotch","modelToString","v","isPartial","stringToModel","forParsing","innerTextValue","innerNumberValue","computed","watch","outerValue","NUMBER_REGEX","inputValue","nextValue","parsedValue","applyChanges","focused","errors","ers","error","isIncrementDisabled","isDecrementDisabled","multiplier","_a","increment","nV","decrement","handleKeyPress","_b","onMousedown","ev"],"mappings":"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"}
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}>(), {\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});\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\"/>\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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"}
@@ -0,0 +1,12 @@
1
+ type ParseResult = {
2
+ error?: Error;
3
+ value?: number;
4
+ cleanInput: string;
5
+ };
6
+ export declare function parseNumber(props: {
7
+ minValue?: number;
8
+ maxValue?: number;
9
+ validate?: (v: number) => string | undefined;
10
+ }, str: string): ParseResult;
11
+ export {};
12
+ //# sourceMappingURL=parseNumber.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"parseNumber.d.ts","sourceRoot":"","sources":["../../../src/components/PlNumberField/parseNumber.ts"],"names":[],"mappings":"AAAA,KAAK,WAAW,GAAG;IACjB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AA8CF,wBAAgB,WAAW,CAAC,KAAK,EAAE;IACjC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;CAC9C,EAAE,GAAG,EAAE,MAAM,GAAG,WAAW,CAkE3B"}
@@ -0,0 +1,77 @@
1
+ const a = /^[-−–+]?(\d+)?[.,]?(\d+)?$/;
2
+ function i(r) {
3
+ return r === "." || r === "," || r === "-";
4
+ }
5
+ function l(r) {
6
+ return r = r.trim(), r = r.replace(",", "."), r = r.replace("−", "-"), r = r.replace("–", "-"), r = r.replace("+", ""), r;
7
+ }
8
+ function o(r) {
9
+ return parseFloat(l(r));
10
+ }
11
+ function c(r) {
12
+ if (r = r.trim(), i(r))
13
+ return r;
14
+ if (/^-[^0-9.]/.test(r))
15
+ return "-";
16
+ const n = r.match(/^(.*)[.,][^0-9].*$/);
17
+ if (n)
18
+ return n[1] + ".";
19
+ if (r.match(a))
20
+ return l(r);
21
+ const e = o(r);
22
+ return isNaN(e) ? "" : String(+e);
23
+ }
24
+ function m(r, n) {
25
+ n = n.trim();
26
+ const e = c(n);
27
+ if (n === "")
28
+ return {
29
+ value: void 0,
30
+ cleanInput: e
31
+ };
32
+ if (!n.match(a))
33
+ return {
34
+ error: Error("Value is not a number"),
35
+ cleanInput: e
36
+ };
37
+ if (i(n))
38
+ return {
39
+ error: Error("Enter a number"),
40
+ cleanInput: e
41
+ };
42
+ const t = o(n);
43
+ if (isNaN(t))
44
+ return {
45
+ error: Error("Value is not a number"),
46
+ cleanInput: e
47
+ };
48
+ if (r.minValue !== void 0 && t < r.minValue)
49
+ return {
50
+ error: Error(`Value must be higher than ${r.minValue}`),
51
+ value: t,
52
+ cleanInput: e
53
+ };
54
+ if (r.maxValue !== void 0 && t > r.maxValue)
55
+ return {
56
+ error: Error(`Value must be less than ${r.maxValue}`),
57
+ value: t,
58
+ cleanInput: e
59
+ };
60
+ if (r.validate) {
61
+ const u = r.validate(t);
62
+ if (u)
63
+ return {
64
+ error: Error(u),
65
+ value: t,
66
+ cleanInput: e
67
+ };
68
+ }
69
+ return {
70
+ value: t,
71
+ cleanInput: e
72
+ };
73
+ }
74
+ export {
75
+ m as parseNumber
76
+ };
77
+ //# sourceMappingURL=parseNumber.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"parseNumber.js","sources":["../../../src/components/PlNumberField/parseNumber.ts"],"sourcesContent":["type ParseResult = {\n error?: Error;\n value?: number;\n cleanInput: string;\n};\n\nconst NUMBER_REGEX = /^[-−–+]?(\\d+)?[.,]?(\\d+)?$/; // parseFloat works without errors on strings with multiple dots, or letters in value\n\nfunction isPartial(v: string) {\n return v === '.' || v === ',' || v === '-';\n}\n\nfunction clearNumericValue(v: string) {\n v = v.trim();\n v = v.replace(',', '.');\n v = v.replace('−', '-'); // minus, replacing for the case of input the whole copied value\n v = v.replace('–', '-'); // dash, replacing for the case of input the whole copied value\n v = v.replace('+', '');\n return v;\n}\n\nfunction stringToNumber(v: string) {\n return parseFloat(clearNumericValue(v));\n}\n\nfunction clearInput(v: string): string {\n v = v.trim();\n\n if (isPartial(v)) {\n return v;\n }\n\n if (/^-[^0-9.]/.test(v)) {\n return '-';\n }\n\n const match = v.match(/^(.*)[.,][^0-9].*$/);\n if (match) {\n return match[1] + '.';\n }\n\n if (v.match(NUMBER_REGEX)) {\n return clearNumericValue(v);\n }\n\n const n = stringToNumber(v);\n\n return isNaN(n) ? '' : String(+n);\n}\n\nexport function parseNumber(props: {\n minValue?: number;\n maxValue?: number;\n validate?: (v: number) => string | undefined;\n}, str: string): ParseResult {\n str = str.trim();\n\n const cleanInput = clearInput(str);\n\n if (str === '') {\n return {\n value: undefined,\n cleanInput,\n };\n }\n\n if (!str.match(NUMBER_REGEX)) {\n return {\n error: Error('Value is not a number'),\n cleanInput,\n };\n }\n\n if (isPartial(str)) {\n return {\n error: Error('Enter a number'),\n cleanInput,\n };\n }\n\n const value = stringToNumber(str);\n\n if (isNaN(value)) {\n return {\n error: Error('Value is not a number'),\n cleanInput,\n };\n }\n\n if (props.minValue !== undefined && value < props.minValue) {\n return {\n error: Error(`Value must be higher than ${props.minValue}`),\n value,\n cleanInput,\n };\n }\n\n if (props.maxValue !== undefined && value > props.maxValue) {\n return {\n error: Error(`Value must be less than ${props.maxValue}`),\n value,\n cleanInput,\n };\n }\n\n if (props.validate) {\n const error = props.validate(value);\n if (error) {\n return {\n error: Error(error),\n value,\n cleanInput,\n };\n }\n }\n\n return {\n value,\n cleanInput,\n };\n}\n"],"names":["NUMBER_REGEX","isPartial","v","clearNumericValue","stringToNumber","clearInput","match","n","parseNumber","props","str","cleanInput","value","error"],"mappings":"AAMA,MAAMA,IAAe;AAErB,SAASC,EAAUC,GAAW;AAC5B,SAAOA,MAAM,OAAOA,MAAM,OAAOA,MAAM;AACzC;AAEA,SAASC,EAAkBD,GAAW;AACpC,SAAAA,IAAIA,EAAE,KAAK,GACPA,IAAAA,EAAE,QAAQ,KAAK,GAAG,GAClBA,IAAAA,EAAE,QAAQ,KAAK,GAAG,GAClBA,IAAAA,EAAE,QAAQ,KAAK,GAAG,GAClBA,IAAAA,EAAE,QAAQ,KAAK,EAAE,GACdA;AACT;AAEA,SAASE,EAAeF,GAAW;AAC1B,SAAA,WAAWC,EAAkBD,CAAC,CAAC;AACxC;AAEA,SAASG,EAAWH,GAAmB;AAGjC,MAFJA,IAAIA,EAAE,KAAK,GAEPD,EAAUC,CAAC;AACN,WAAAA;AAGL,MAAA,YAAY,KAAKA,CAAC;AACb,WAAA;AAGH,QAAAI,IAAQJ,EAAE,MAAM,oBAAoB;AAC1C,MAAII;AACK,WAAAA,EAAM,CAAC,IAAI;AAGhB,MAAAJ,EAAE,MAAMF,CAAY;AACtB,WAAOG,EAAkBD,CAAC;AAGtB,QAAAK,IAAIH,EAAeF,CAAC;AAE1B,SAAO,MAAMK,CAAC,IAAI,KAAK,OAAO,CAACA,CAAC;AAClC;AAEgB,SAAAC,EAAYC,GAIzBC,GAA0B;AAC3B,EAAAA,IAAMA,EAAI,KAAK;AAET,QAAAC,IAAaN,EAAWK,CAAG;AAEjC,MAAIA,MAAQ;AACH,WAAA;AAAA,MACL,OAAO;AAAA,MACP,YAAAC;AAAA,IACF;AAGF,MAAI,CAACD,EAAI,MAAMV,CAAY;AAClB,WAAA;AAAA,MACL,OAAO,MAAM,uBAAuB;AAAA,MACpC,YAAAW;AAAA,IACF;AAGE,MAAAV,EAAUS,CAAG;AACR,WAAA;AAAA,MACL,OAAO,MAAM,gBAAgB;AAAA,MAC7B,YAAAC;AAAA,IACF;AAGI,QAAAC,IAAQR,EAAeM,CAAG;AAE5B,MAAA,MAAME,CAAK;AACN,WAAA;AAAA,MACL,OAAO,MAAM,uBAAuB;AAAA,MACpC,YAAAD;AAAA,IACF;AAGF,MAAIF,EAAM,aAAa,UAAaG,IAAQH,EAAM;AACzC,WAAA;AAAA,MACL,OAAO,MAAM,6BAA6BA,EAAM,QAAQ,EAAE;AAAA,MAC1D,OAAAG;AAAA,MACA,YAAAD;AAAA,IACF;AAGF,MAAIF,EAAM,aAAa,UAAaG,IAAQH,EAAM;AACzC,WAAA;AAAA,MACL,OAAO,MAAM,2BAA2BA,EAAM,QAAQ,EAAE;AAAA,MACxD,OAAAG;AAAA,MACA,YAAAD;AAAA,IACF;AAGF,MAAIF,EAAM,UAAU;AACZ,UAAAI,IAAQJ,EAAM,SAASG,CAAK;AAClC,QAAIC;AACK,aAAA;AAAA,QACL,OAAO,MAAMA,CAAK;AAAA,QAClB,OAAAD;AAAA,QACA,YAAAD;AAAA,MACF;AAAA,EACF;AAGK,SAAA;AAAA,IACL,OAAAC;AAAA,IACA,YAAAD;AAAA,EACF;AACF;"}
@@ -32,7 +32,7 @@
32
32
  .resizable-input{position:relative;box-sizing:border-box;padding:0 8px;display:inline-block;max-width:100%;text-overflow:ellipsis;overflow:hidden}.resizable-input__size-span{font-family:inherit;white-space:pre;display:inline-block;font-size:inherit;line-height:inherit;box-sizing:border-box;position:relative;left:0;opacity:0;min-width:2px;-webkit-user-select:none;user-select:none;vertical-align:top}.resizable-input input{border:none;outline:none;height:100%;text-overflow:ellipsis;font-family:inherit;background:none;color:inherit;top:0;left:0;right:0;font-size:inherit;line-height:inherit;position:absolute;box-sizing:border-box}
33
33
  .pl-dropdown-multi{--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);position:relative;outline:none;min-height:var(--control-height);border-radius:6px;font-family:var(--font-family-base);font-size:var(--font-size-base);font-weight:var(--font-weigh-base)}[data-theme=dark] .pl-dropdown-multi{--options-bg: #1B1B1F}.pl-dropdown-multi__envelope{font-family:var(--control-font-family);min-width:160px}.pl-dropdown-multi label{display:flex;align-items:center;gap:4px;position:absolute;top:0;transform:translateY(-60%);left:var(--label-offset-left-x);padding:0 4px;max-width:calc(100% - 16px);overflow:hidden;white-space:pre;text-overflow:ellipsis;cursor:inherit;color:var(--label-color);font-size:12px;font-weight:500;border-bottom-right-radius:4px;border-bottom-left-radius:4px;background:var(--bg-elevated-01)}.pl-dropdown-multi label>span{overflow:hidden;white-space:pre;text-overflow:ellipsis}.pl-dropdown-multi__container{position:absolute;top:0;left:0;right:0;border-radius:6px;min-height:var(--control-height);padding:1px;color:var(--txt-01)}.pl-dropdown-multi__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}.pl-dropdown-multi__options{position:absolute;top:0;z-index:var(--z-dropdown-options);border:1px solid var(--border-color-div-grey);background-color:var(--pl-dropdown-options-bg);border-radius:6px;max-height:244px;box-shadow:0 4px 12px -2px #0f244d14,0 6px 24px -2px #0f244d14;--thumb-color: var(--ic-02);overflow-y:auto}.pl-dropdown-multi__options::-webkit-scrollbar{width:var(--scrollbar-width, 6px);height:5px;background-color:transparent;display:block}.pl-dropdown-multi__options::-webkit-scrollbar-thumb{background:var(--thumb-color);border-radius:5px}.pl-dropdown-multi__options::-webkit-scrollbar-thumb:hover{--thumb-color: var(--border-color-focus)}.pl-dropdown-multi__options .nothing-found{padding:0 10px;height:var(--control-height);line-height:20px;background-color:#fff;opacity:.5;font-style:italic}.pl-dropdown-multi__options .option{position:relative;padding:0 10px;height:var(--control-height);line-height:20px;cursor:pointer;-webkit-user-select:none;user-select:none;display:flex;align-items:center;gap:12px;--base-icon: url("data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M19.5%204.5H4.5L4.5%2019.5H19.5V4.5ZM4.5%203C3.67157%203%203%203.67157%203%204.5V19.5C3%2020.3284%203.67157%2021%204.5%2021H19.5C20.3284%2021%2021%2020.3284%2021%2019.5V4.5C21%203.67157%2020.3284%203%2019.5%203H4.5Z'%20fill='%23110529'/%3e%3c/svg%3e");--checked-icon: url("data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20x='3'%20y='3'%20width='18'%20height='18'%20rx='2'%20fill='%23110529'/%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M17.5431%208.51739L10.3333%2016.0877L6.45691%2012.0174L7.54312%2010.9829L10.3333%2013.9127L16.4569%207.48291L17.5431%208.51739Z'%20fill='white'/%3e%3c/svg%3e")}.pl-dropdown-multi__options .option .pl-dropdown-multi__checkmark{cursor:pointer;outline:none;border-radius:4px;background:var(--base-icon) no-repeat center;width:24px;height:24px}[data-theme=dark] .pl-dropdown-multi__options .option .pl-dropdown-multi__checkmark{--base-icon: url("data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M19.5%204.5H4.5L4.5%2019.5H19.5V4.5ZM4.5%203C3.67157%203%203%203.67157%203%204.5V19.5C3%2020.3284%203.67157%2021%204.5%2021H19.5C20.3284%2021%2021%2020.3284%2021%2019.5V4.5C21%203.67157%2020.3284%203%2019.5%203H4.5Z'%20fill='white'/%3e%3c/svg%3e");--checked-icon: url("data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20x='3'%20y='3'%20width='18'%20height='18'%20rx='2'%20fill='white'/%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M17.5431%208.51739L10.3333%2016.0877L6.45691%2012.0174L7.54312%2010.9829L10.3333%2013.9127L16.4569%207.48291L17.5431%208.51739Z'%20fill='%23110529'/%3e%3c/svg%3e")}.pl-dropdown-multi__options .option>span{display:block;overflow:hidden;white-space:nowrap;max-width:100%;text-overflow:ellipsis}.pl-dropdown-multi__options .option.selected{background-color:var(--color-active-select)}.pl-dropdown-multi__options .option.selected .pl-dropdown-multi__checkmark{background:var(--checked-icon) no-repeat center;width:24px;height:24px}.pl-dropdown-multi__options .option.active:not(.selected){background-color:var(--option-hover-bg)}.pl-dropdown-multi__options .option:hover{background-color:var(--option-hover-bg)}.pl-dropdown-multi__field{position:relative;border-radius:6px;overflow:hidden;background:transparent;padding-left:11px;min-height:var(--control-height);line-height:20px;cursor:pointer;display:flex;flex-direction:row;align-items:center}.pl-dropdown-multi__field .chips-container{position:absolute;top:0;left:0;bottom:0;right:30px;overflow:hidden;padding:0 60px 0 11px;line-height:20px;color:var(--contour-color);display:flex;gap:8px;align-items:center}.pl-dropdown-multi__field input{min-height:calc(var(--control-height) - 2px);line-height:20px;font-family:inherit;font-size:inherit;background-color:transparent;border:none;padding:0;width:calc(100% - 20px);color:var(--txt-01);caret-color:var(--border-color-focus)}.pl-dropdown-multi__field input:focus{outline:none}.pl-dropdown-multi__field input:placeholder-shown{text-overflow:ellipsis}.pl-dropdown-multi__field input::placeholder{color:var(--color-placeholder)}.pl-dropdown-multi__field:hover .clear{display:block}.pl-dropdown-multi__controls{display:flex;flex-direction:row;align-items:center;gap:6px;margin-left:auto}.pl-dropdown-multi__controls .mask-16,.pl-dropdown-multi__controls .mask-24{--icon-color: var(--control-mask-fill);cursor:pointer}.pl-dropdown-multi__controls .mask-loading{--icon-color: var(--ic-accent);animation:spin 2.5s linear infinite}.pl-dropdown-multi__arrow-wrapper{display:flex;align-items:center;min-height:var(--control-height);padding-right:11px}.pl-dropdown-multi .arrow-icon{cursor:pointer}.pl-dropdown-multi .arrow-icon.arrow-icon-default{transition:transform .2s;background-color:var(--control-mask-fill);mask-image:url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M2.46967%206.53033L3.53033%205.46967L8%209.93934L12.4697%205.46967L13.5303%206.53033L8%2012.0607L2.46967%206.53033Z'%20fill='%23110529'/%3e%3c/svg%3e");-webkit-mask-image:url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M2.46967%206.53033L3.53033%205.46967L8%209.93934L12.4697%205.46967L13.5303%206.53033L8%2012.0607L2.46967%206.53033Z'%20fill='%23110529'/%3e%3c/svg%3e");mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:center;-webkit-mask-position:center;mask-size:16px;-webkit-mask-size:16px;width:16px;height:16px}.pl-dropdown-multi__helper{font-size:12px;color:var(--txt-03);padding:2px 0 0;white-space:pre-wrap;text-overflow:ellipsis;font-weight:500;line-height:16px;margin-top:6px}.pl-dropdown-multi__error{font-size:12px;color:var(--txt-error);padding:2px 0 0;white-space:pre-wrap;text-overflow:ellipsis;font-weight:500;line-height:16px;margin-top:6px}.pl-dropdown-multi.open .arrow-icon.arrow-icon-default{background-color:var(--control-mask-fill);transform:rotate(-180deg)}.pl-dropdown-multi .clear{display:none;position:absolute;top:50%;transform:translateY(-50%);right:36px;z-index:1;background:url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_586_7851)'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M8%2016C12.4183%2016%2016%2012.4183%2016%208C16%203.58172%2012.4183%200%208%200C3.58172%200%200%203.58172%200%208C0%2012.4183%203.58172%2016%208%2016ZM4.46967%205.53033L6.93934%208L4.46967%2010.4697L5.53033%2011.5303L8%209.06066L10.4697%2011.5303L11.5303%2010.4697L9.06066%208L11.5303%205.53033L10.4697%204.46967L8%206.93934L5.53033%204.46967L4.46967%205.53033Z'%20fill='%23CFD1DB'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_586_7851'%3e%3crect%20width='16'%20height='16'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e") no-repeat center;width:16px;height:16px;cursor:pointer}.pl-dropdown-multi.open,.pl-dropdown-multi:focus-within{z-index:1}.pl-dropdown-multi.open .pl-dropdown-multi__container .label,.pl-dropdown-multi:focus-within .pl-dropdown-multi__container .label{color:var(--txt-focus)}.pl-dropdown-multi.open .pl-dropdown-multi__container{z-index:1000}.pl-dropdown-multi.open .pl-dropdown-multi__field{border-radius:6px 6px 0 0}.pl-dropdown-multi.open .arrow{background-color:var(--control-mask-fill);mask-image:url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M8%204.93933L13.5303%2010.4697L12.4697%2011.5303L8%207.06065L3.53033%2011.5303L2.46967%2010.4697L8%204.93933Z'%20fill='%23110529'/%3e%3c/svg%3e");-webkit-mask-image:url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M8%204.93933L13.5303%2010.4697L12.4697%2011.5303L8%207.06065L3.53033%2011.5303L2.46967%2010.4697L8%204.93933Z'%20fill='%23110529'/%3e%3c/svg%3e");mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:center;-webkit-mask-position:center;mask-size:16px;-webkit-mask-size:16px;width:16px;height:16px}.pl-dropdown-multi:hover{--contour-color: var(--control-hover-color)}.pl-dropdown-multi: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-dropdown-multi:focus-within.error{--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--color-error-shadow)}.pl-dropdown-multi.error{--contour-color: var(--txt-error);--label-color: var(--txt-error)}.pl-dropdown-multi.disabled{--contour-color: var(--color-dis-01);--control-mask-fill: var(--color-dis-01);--label-color: var(--color-dis-01);cursor:not-allowed;pointer-events:none}.pl-dropdown-multi.disabled .mask-loading{animation:spin 2.5s linear infinite;--icon-color: var(--ic-accent)}.pl-dropdown-multi__open-chips-container{padding:12px}.pl-dropdown-multi__open-chips-container .pl-chip{margin-right:4px;margin-bottom:4px}
34
34
  .pl-log-view{--log-background: var(--bg-base-light);--contour-color: var(--txt-01);--contour-border-width: 1px;--label-offset-left-x: 8px;--label-offset-right-x: 8px;--border-color-log-view: var(--border-color-div-grey);height:100%;max-height:calc(100% - var(--contour-offset));max-width:calc(100% - var(--contour-offset));border-radius:6px;background:var(--log-background);display:flex;position:relative;min-height:44px;padding-right:40px}.pl-log-view__contour{position:absolute;top:0;left:0;right:0;bottom:0;border-radius:var(--border-radius-control);border-width:var(--contour-border-width);border-color:var(--border-color-log-view);border-style:solid;box-shadow:none;z-index:0;pointer-events:none}.pl-log-view label{display:flex;align-items:center;gap:4px;position:absolute;top:0;transform:translateY(-60%);left:var(--label-offset-left-x);padding:0 4px;max-width:calc(100% - 16px);overflow:hidden;white-space:pre;text-overflow:ellipsis;cursor:inherit;color:var(--label-color);font-size:12px;font-weight:500;border-bottom-right-radius:4px;border-bottom-left-radius:4px;background:var(--bg-elevated-01)}.pl-log-view label>span{overflow:hidden;white-space:pre;text-overflow:ellipsis}.pl-log-view.has-error{--log-background: linear-gradient(90deg, #FFEBEB 0%, #FFFFFF 100%);--border-color-log-view: var(--border-color-error)}.pl-log-view__copy{position:absolute;top:12px;right:12px;cursor:pointer}.pl-log-view__copy .mask-24{--icon-color: var(--ic-02)}.pl-log-view__copy:hover .mask-24{--icon-color: var(--txt-01)}.pl-log-view__content{margin:12px;max-height:100%;max-width:100%;flex:1;color:var(--txt-01);font-feature-settings:"ss11" on,"ss15" on,"ss17" on;font-family:var(--font-family-monospace);white-space:pre;font-size:14px;font-weight:400;line-height:20px;--thumb-color: var(--ic-02);overflow-y:auto;overflow-x:auto}.pl-log-view__content::-webkit-scrollbar{width:var(--scrollbar-width, 6px);height:5px;background-color:transparent;display:block}.pl-log-view__content::-webkit-scrollbar-thumb{background:var(--thumb-color);border-radius:5px}.pl-log-view__content::-webkit-scrollbar-thumb:hover{--thumb-color: var(--border-color-focus)}.pl-log-view__error{margin:12px;max-height:100%;max-width:100%;flex:1;color:var(--txt-01);font-feature-settings:"ss11" on,"ss15" on,"ss17" on;font-family:var(--font-family-monospace);white-space:pre;font-size:14px;font-weight:400;line-height:20px;--thumb-color: var(--ic-02);overflow-y:auto;overflow-x:auto}.pl-log-view__error::-webkit-scrollbar{width:var(--scrollbar-width, 6px);height:5px;background-color:transparent;display:block}.pl-log-view__error::-webkit-scrollbar-thumb{background:var(--thumb-color);border-radius:5px}.pl-log-view__error::-webkit-scrollbar-thumb:hover{--thumb-color: var(--border-color-focus)}
35
- .mi-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}.mi-number-field ::placeholder{color:#cfd1db;opacity:1}.mi-number-field__main-wrapper{height:40px;position:relative}.mi-number-field__wrapper{padding-left:12px;border-radius:6px}.mi-number-field__wrapper.withoutArrows{padding-right:12px}.mi-number-field__icons{width:40px;border-radius:0 6px 6px 0;border-left:1px solid var(--contour-color)}.mi-number-field__icon{line-height:0}.mi-number-field__icon.disabled{cursor:not-allowed;position:relative;z-index:1}.mi-number-field__icon.disabled svg path{fill:#cfd1db}.mi-number-field__icon:hover{background-color:#9babcc29}.mi-number-field__icon:first-child{border-bottom:1px solid var(--contour-color)}.mi-number-field__hint{margin-top:3px;color:var(--color-hint)}.mi-number-field input{outline:none;border:none;width:100%;background:unset;text-overflow:ellipsis}.mi-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}.mi-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)}.mi-number-field:focus-within.error{--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--color-error-shadow)}.mi-number-field.error{--contour-color: var(--txt-error);--label-color: var(--txt-error);--color-hint: var(--txt-error)}.mi-number-field.disabled{--contour-color: var(--color-dis-01);--control-mask-fill: var(--color-dis-01);cursor:not-allowed}.mi-number-field.disabled label,.mi-number-field.disabled .mi-number-field__hint,.mi-number-field.disabled input{color:var(--contour-color)}.mi-number-field.disabled svg path{fill:var(--contour-color)}.mi-number-field.disabled .mi-number-field__icons{pointer-events:none}.mi-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}.mi-number-field label .required{display:inline-block;font-weight:500;font-size:12px;line-height:16px;color:var(--txt-error);margin-right:4px}
35
+ .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}
36
36
  .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%)}}
37
37
  .pl-status-tag{border-radius:4px;border:1px solid var(--txt-01);padding:2px 8px;width:fit-content;height:24px}.pl-status-tag.ok{background:var(--notification-success)}.pl-status-tag.warn{background:var(--notification-warning)}.pl-status-tag.alert{background:var(--notification-error)}.pl-status-tag.hold{background:var(--notification-neutral)}
38
38
  .ui-text-area{--contour-color: var(--txt-01);--label-color: var(--txt-01);--contour-border-width: 1px;--contour-box-shadow: none;--label-offset-left-x: 8px;--label-offset-right-x: 8px;--prefix-color: var(--color-placeholder);width:100%;min-height:var(--control-height);position:relative;border-radius:var(--border-radius-control);display:flex;flex-direction:row;align-items:center;outline:none}.ui-text-area__envelope{font-family:var(--font-family-base)}.ui-text-area textarea{min-height:calc(var(--control-height) - 2px);width:100%;padding:10px 12px;border:none;font-size:inherit;background-color:transparent;color:var(--txt-01);caret-color:var(--border-color-focus);cursor:inherit;resize:none;--thumb-color: var(--ic-02);overflow-y:auto}.ui-text-area textarea::-webkit-scrollbar{width:var(--scrollbar-width, 6px);height:5px;background-color:transparent;display:block}.ui-text-area textarea::-webkit-scrollbar-thumb{background:var(--thumb-color);border-radius:5px}.ui-text-area textarea::-webkit-scrollbar-thumb:hover{--thumb-color: var(--border-color-focus)}.ui-text-area textarea:focus{outline:none}.ui-text-area textarea::placeholder{color:var(--color-placeholder)}.ui-text-area label{display:flex;align-items:center;gap:4px;position:absolute;top:0;transform:translateY(-60%);left:var(--label-offset-left-x);padding:0 4px;max-width:calc(100% - 16px);overflow:hidden;white-space:pre;text-overflow:ellipsis;cursor:inherit;color:var(--label-color);font-size:12px;font-weight:500;border-bottom-right-radius:4px;border-bottom-left-radius:4px;background:var(--bg-elevated-01)}.ui-text-area label>span{overflow:hidden;white-space:pre;text-overflow:ellipsis}.ui-text-area__contour{position:absolute;top:0;left:0;right:0;bottom:0;border-radius:var(--border-radius-control);border-width:var(--contour-border-width);border-color:var(--contour-color);border-style:solid;box-shadow:var(--contour-box-shadow);z-index:0;pointer-events:none}.ui-text-area__append{display:flex;flex-direction:row;align-items:center;gap:4px}.ui-text-area__helper{font-size:12px;color:var(--txt-03);padding:2px 0 0;white-space:pre-wrap;text-overflow:ellipsis;font-weight:500;line-height:16px;margin-top:6px}.ui-text-area__error{font-size:12px;color:var(--txt-error);padding:2px 0 0;white-space:pre-wrap;text-overflow:ellipsis;font-weight:500;line-height:16px;margin-top:6px}.ui-text-area:hover{--contour-color: var(--control-hover-color)}.ui-text-area: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)}.ui-text-area:focus-within.error{--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--color-error-shadow)}.ui-text-area.dashed .ui-text-area__contour{border-style:dashed}.ui-text-area.nonEmpty{--prefix-color: var(--txt-01)}.ui-text-area.error{--contour-color: var(--txt-error)}.ui-text-area.disabled{--contour-color: var(--color-dis-01);cursor:not-allowed;pointer-events:none}.ui-text-area.disabled *{color:var(--contour-color)}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@milaboratories/uikit",
3
- "version": "2.3.25",
3
+ "version": "2.3.26",
4
4
  "type": "module",
5
5
  "main": "dist/index.js",
6
6
  "exports": {
@@ -41,9 +41,9 @@
41
41
  "vue-tsc": "^2.2.10",
42
42
  "yarpm": "^1.2.0",
43
43
  "svgo": "^3.3.2",
44
- "@milaboratories/eslint-config": "^1.0.4",
45
44
  "@milaboratories/ts-configs": "1.0.5",
46
- "@milaboratories/build-configs": "1.0.5"
45
+ "@milaboratories/build-configs": "1.0.5",
46
+ "@milaboratories/eslint-config": "^1.0.4"
47
47
  },
48
48
  "scripts": {
49
49
  "dev": "vite",