@profitliga/ui 1.2.90 → 2.0.1

package/dist/components/InputNumber/InputNumber.vue2.js

@@ -0,0 +1,137 @@
+import { defineComponent as D, useModel as N, ref as F, computed as o, watch as z, onMounted as A, openBlock as d, createElementBlock as c, normalizeClass as P, withModifiers as f, createVNode as r, unref as s, createCommentVNode as b, createElementVNode as x, createBlock as $, resolveDynamicComponent as E, withDirectives as H, vModelText as O, mergeModels as B } from "vue";
+import q from "../../icons/monochrome/CloseRoundedIcon.vue.js";
+import R from "../../icons/monochrome/MinusIcon.vue.js";
+import T from "../../icons/monochrome/PlusIcon.vue.js";
+const U = ["disabled"], j = { class: "input-number__wrapper" }, G = ["max", "min", "readonly", "disabled"], J = ["disabled"], W = /* @__PURE__ */ D({
+  __name: "InputNumber",
+  props: /* @__PURE__ */ B({
+    viewButtons: { type: Boolean, default: !1 },
+    max: {},
+    min: { default: 0 },
+    step: {},
+    icon: {},
+    iconPosition: { default: "left" },
+    formatter: { type: Function },
+    selectOnFocus: { type: Boolean, default: !1 },
+    size: { default: "medium" },
+    readonly: { type: Boolean },
+    disabled: { type: Boolean },
+    error: { type: Boolean, default: !1 },
+    allowClear: { type: Boolean, default: !1 },
+    disableBlur: { type: Boolean, default: !1 },
+    disableActions: { type: Boolean, default: !1 }
+  }, {
+    modelValue: { required: !0 },
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ B(["change", "increment", "decrement"], ["update:modelValue"]),
+  setup(e, { emit: g }) {
+    const n = N(e, "modelValue"), i = g, m = F(
+      e.formatter ? e.formatter(n.value) : n.value
+    ), h = o(
+      () => n.value === (e.step && e.step > e.min ? e.step : (e.step && e.step < e.min, e.min)) || e.disabled || e.readonly
+    ), w = o(
+      () => !!e.max && n.value === e.max || e.disabled || e.readonly
+    ), C = (t) => {
+      e.selectOnFocus && t.target.select();
+    }, M = (t) => {
+      let u = t.target.value;
+      if (e.disableBlur) {
+        n.value = +u, i("change", Number(u));
+        return;
+      }
+      if (u.length === 0) {
+        const y = e.step || e.min;
+        n.value = y, i("change", y);
+        return;
+      }
+      u = u.replace(/(?!^)-|[^\d-]/g, "");
+      let l = parseInt(u);
+      const v = e.step || e.min;
+      l < v && (l = v), e.max && l > e.max && (l = e.max), e.step && l % e.step !== 0 && (l = Math.floor(l / e.step) * e.step + e.step), m.value = e.formatter ? e.formatter(l) : l, n.value = l, i("change", l);
+    }, V = () => {
+      if (e.disableActions) {
+        i("increment");
+        return;
+      }
+      if (e.max && n.value === e.max) return;
+      let t = e.step ? n.value + e.step : n.value + 1;
+      e.max && t > e.max && (t = e.max), n.value = t, i("change", t);
+    }, k = () => {
+      if (e.disableActions) {
+        i("decrement");
+        return;
+      }
+      const t = e.step || e.min;
+      if (n.value === t) return;
+      let a = e.step ? n.value - e.step : n.value - 1;
+      a < t && (a = t), n.value = a, i("change", a);
+    }, I = o(() => [
+      "input-number",
+      `input-number--${e.size}`,
+      {
+        "input-number--view-buttons": e.viewButtons,
+        "input-number--error": e.error,
+        "input-number--disabled": e.disabled,
+        "input-number--readonly": e.readonly,
+        [`input-number--icon-${e.iconPosition}`]: e.icon
+      }
+    ]);
+    return z(n, (t) => {
+      m.value = e.formatter ? e.formatter(t) : t;
+    }), A(() => {
+      let t = n.value;
+      const a = e.step || e.min;
+      t < a && (t = a), e.max && t > e.max && (t = e.max), e.step && t % e.step !== 0 && (t = Math.floor(t / e.step) * e.step + e.step), t !== n.value && (n.value = t, i("change", t)), m.value = e.formatter ? e.formatter(n.value) : n.value;
+    }), (t, a) => (d(), c("div", {
+      class: P(I.value)
+    }, [
+      e.viewButtons ? (d(), c("button", {
+        key: 0,
+        class: "input-number__button input-number__button--decrement",
+        disabled: h.value,
+        onClick: f(k, ["stop"])
+      }, [
+        r(s(R))
+      ], 8, U)) : b("", !0),
+      x("div", j, [
+        (d(), $(E(e.icon))),
+        H(x("input", {
+          id: "input-number",
+          "onUpdate:modelValue": a[0] || (a[0] = (u) => m.value = u),
+          type: "number",
+          name: "input-number",
+          class: "input-number__input",
+          max: e.max,
+          min: e.min,
+          readonly: e.readonly,
+          disabled: e.disabled,
+          onBlur: M,
+          onClick: a[1] || (a[1] = f(() => {
+          }, ["stop"])),
+          onFocus: C
+        }, null, 40, G), [
+          [O, m.value]
+        ]),
+        e.allowClear && n.value > e.min ? (d(), c("button", {
+          key: 0,
+          class: "input-number__clear",
+          onClick: a[2] || (a[2] = (u) => n.value = e.min)
+        }, [
+          r(s(q))
+        ])) : b("", !0)
+      ]),
+      e.viewButtons ? (d(), c("button", {
+        key: 1,
+        class: "input-number__button input-number__button--increment",
+        disabled: w.value,
+        onClick: f(V, ["stop"])
+      }, [
+        r(s(T))
+      ], 8, J)) : b("", !0)
+    ], 2));
+  }
+});
+export {
+  W as default
+};

package/dist/components/InputText/InputText.css

@@ -0,0 +1 @@
+.input{flex-direction:column;gap:4px;width:100%;height:auto;display:flex;position:relative}.input__wrapper{height:var(--input-height);background-color:var(--theme-neutral-0);border:1px solid var(--input-border-color);border-radius:8px;align-items:center;gap:4px;padding:0 8px;display:flex;position:relative}.input__wrapper:hover{border-color:var(--theme-primary-300)}.input__wrapper:focus-within{border-color:var(--theme-primary-500)}.input__field{width:100%;height:100%;font-size:var(--input-font-size);color:var(--input-color-text);-webkit-line-clamp:1;text-overflow:ellipsis;outline:none;-webkit-box-orient:vertical;justify-content:flex-start;align-items:center;line-height:120%;display:-webkit-box;overflow:hidden}.input__field::placeholder{font-size:var(--input-font-size);color:var(--input-color-placeholder);-webkit-line-clamp:1;text-overflow:ellipsis;-webkit-box-orient:vertical;line-height:120%;display:-webkit-box;overflow:hidden}.input__actions{justify-content:center;align-items:center;width:max-content;height:100%;display:flex}.input__clear{width:12px;height:12px;color:var(--theme-neutral-text-caption);background-color:#0000;justify-content:center;align-items:center;display:flex}.input__clear svg{width:100%}.input__clear:hover{color:var(--theme-primary-500)}.input__eye{color:var(--theme-neutral-text-caption);justify-content:center;align-items:center;display:flex}.input__count-char{text-align:end;color:var(--theme-neutral-text-caption);padding:4px 8px;font-size:10px;position:absolute;bottom:-23px;right:0}.input.input--small .input__wrapper{height:var(--input-height-small)}.input.input--small .input__field,.input.input--small .input__field::placeholder{font-size:var(--input-font-size-small);line-height:150%}.input.input--large .input__wrapper{height:var(--input-height-large)}.input.input--large .input__clear{width:20px;height:20px}.input.input--large .input__field,.input.input--large .input__field::placeholder{font-size:var(--input-font-size-large);line-height:130%}.input.input--error .input__wrapper{border-color:var(--input-color-error)}.input.input--disabled .input__wrapper{border-color:var(--theme-neutral-border-disabled);background-color:var(--theme-neutral-50)}.input.input--disabled .input__field,.input.input--disabled .input__field::placeholder{color:var(--input-color-disabled)}.input.input--readonly .input__wrapper{background-color:var(--theme-neutral-50)}

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

@@ -1,22 +1,27 @@
 import { InputTextProps } from './InputText.types';
 import { DefineComponent, ShallowRef, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
 type __VLS_Props = InputTextProps;
-type __VLS_ModelProps = {
+type __VLS_PublicProps = {
     modelValue?: string;
+} & __VLS_Props;
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        prefix?(_: {}): any;
+        suffix?(_: {}): any;
+    };
+    refs: {
+        inputRef: HTMLInputElement;
+    };
+    rootEl: HTMLDivElement;
 };
-type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare var __VLS_1: {}, __VLS_3: {};
-type __VLS_Slots = {} & {
-    prefix?: (props: typeof __VLS_1) => any;
-} & {
-    suffix?: (props: typeof __VLS_3) => any;
-};
-declare const __VLS_base: DefineComponent<__VLS_PublicProps, {
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: DefineComponent<__VLS_PublicProps, {
     el: Readonly< ShallowRef<HTMLInputElement | null>>;
     focus: () => void | undefined;
     blur: () => void | undefined;
 }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
-    "update:modelValue": (value: string | undefined) => any;
+    "update:modelValue": (value: string) => any;
 } & {
     input: (value: Event) => any;
     clear: () => any;
@@ -27,16 +32,17 @@ declare const __VLS_base: DefineComponent<__VLS_PublicProps, {
 }, string, PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     onInput?: ((value: Event) => any) | undefined;
     onClear?: (() => any) | undefined;
-    "onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
     onBlur?: ((value: FocusEvent) => any) | undefined;
     onFocus?: ((value: FocusEvent) => any) | undefined;
     onPaste?: ((value: ClipboardEvent) => any) | undefined;
     onEnter?: ((value: Event) => any) | undefined;
-}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-declare const _default: typeof __VLS_export;
+}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {
+    inputRef: HTMLInputElement;
+}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
-type __VLS_WithSlots<T, S> = T & {
+type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
     };

package/dist/components/InputText/InputText.vue.js

@@ -0,0 +1,112 @@
+import './InputText.css';
+import { defineComponent as E, useTemplateRef as P, useModel as S, computed as y, ref as z, openBlock as u, createElementBlock as m, normalizeClass as N, createElementVNode as p, renderSlot as h, createCommentVNode as s, withDirectives as T, withKeys as H, vModelDynamic as K, createVNode as L, unref as v, withModifiers as F, createBlock as b, toDisplayString as k, mergeModels as x } from "vue";
+import { useId as U } from "reka-ui";
+import j from "../../icons/monochrome/CloseRoundedIcon.vue.js";
+import A from "../../icons/monochrome/EyeCloseIcon.vue.js";
+import G from "../../icons/monochrome/EyeIcon.vue.js";
+import { phoneMask as J } from "../../utils/phoneMask.util.js";
+const O = { class: "input__wrapper" }, Q = ["id", "placeholder", "name", "disabled", "type", "required", "readonly", "maxlength"], W = { class: "input__actions" }, X = {
+  key: 0,
+  class: "input__count-char"
+}, oe = /* @__PURE__ */ E({
+  __name: "InputText",
+  props: /* @__PURE__ */ x({
+    placeholder: {},
+    allowClear: { type: Boolean },
+    name: {},
+    disabled: { type: Boolean },
+    error: { type: Boolean },
+    type: { default: "text" },
+    size: { default: "default" },
+    inputId: {},
+    required: { type: Boolean, default: !1 },
+    full: { type: Boolean },
+    readonly: { type: Boolean, default: !1 },
+    maxlength: {},
+    showMaxLength: { type: Boolean, default: !1 }
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ x(["blur", "input", "enter", "paste", "focus", "clear"], ["update:modelValue"]),
+  setup(e, { expose: w, emit: C }) {
+    const a = C, r = P("inputRef"), n = S(e, "modelValue"), B = y(() => e.inputId ?? U()), d = z(!1), V = y(() => [
+      "input",
+      `input--${e.size}`,
+      {
+        "input--full": e.full,
+        "input--disabled": e.disabled,
+        "input--error": e.error,
+        "input--readonly": e.readonly
+      }
+    ]), I = y(() => e.type === "password" ? d.value ? "text" : "password" : e.type === "phone" ? "text" : e.type), M = () => {
+      e.disabled || (n.value = "", a("clear"));
+    }, D = (o) => {
+      if (a("input", o), e.type !== "phone") return;
+      const t = o.target, l = t.value, R = t.selectionStart ?? l.length, $ = l.slice(0, R).replace(/\D/g, "").length, q = l.replace(/\D/g, "").slice(0, 11), i = J(q);
+      n.value = i, t.value = i;
+      let g = 0, c = i.length;
+      for (let f = 0; f < i.length; f++)
+        if (/\d/.test(i[f]) && (g++, g === $)) {
+          c = f + 1;
+          break;
+        }
+      t.setSelectionRange(c, c);
+    };
+    return w({
+      el: r,
+      focus: () => r.value?.focus(),
+      blur: () => r.value?.blur()
+    }), (o, t) => (u(), m("div", {
+      class: N(V.value)
+    }, [
+      p("div", O, [
+        o.$slots.prefix ? h(o.$slots, "prefix", { key: 0 }) : s("", !0),
+        T(p("input", {
+          id: B.value,
+          ref_key: "inputRef",
+          ref: r,
+          "onUpdate:modelValue": t[0] || (t[0] = (l) => n.value = l),
+          placeholder: e.placeholder,
+          name: e.name,
+          class: "input__field",
+          disabled: e.disabled,
+          type: I.value,
+          autocomplete: "off",
+          required: e.required,
+          readonly: e.readonly,
+          maxlength: e.maxlength,
+          onBlur: t[1] || (t[1] = (l) => a("blur", l)),
+          onInput: t[2] || (t[2] = (l) => D(l)),
+          onPaste: t[3] || (t[3] = (l) => a("paste", l)),
+          onFocus: t[4] || (t[4] = (l) => a("focus", l)),
+          onKeydown: t[5] || (t[5] = H((l) => a("enter", l), ["enter"]))
+        }, null, 40, Q), [
+          [K, n.value]
+        ]),
+        p("div", W, [
+          o.$slots.suffix ? h(o.$slots, "suffix", { key: 0 }) : s("", !0),
+          e.type === "text" && e.allowClear && n.value && n.value.length > 0 ? (u(), m("button", {
+            key: 1,
+            class: "input__clear",
+            onClick: M
+          }, [
+            L(v(j))
+          ])) : s("", !0),
+          e.type === "password" ? (u(), m("button", {
+            key: 2,
+            type: "button",
+            class: "input__eye",
+            onClick: t[6] || (t[6] = F((l) => d.value = !d.value, ["prevent"]))
+          }, [
+            d.value ? (u(), b(v(G), { key: 0 })) : (u(), b(v(A), { key: 1 }))
+          ])) : s("", !0)
+        ])
+      ]),
+      e.showMaxLength ? (u(), m("div", X, k(n.value ? n.value.length : 0) + " / " + k(e.maxlength), 1)) : s("", !0)
+    ], 2));
+  }
+});
+export {
+  oe as default
+};

package/dist/components/InputText/InputText.vue3.js

@@ -0,0 +1,5 @@
+import o from "./InputText.vue.js";
+/* empty css               */
+export {
+  o as default
+};

package/dist/components/InputText/index.js

@@ -0,0 +1,6 @@
+import a from "./InputText.vue.js";
+/* empty css               */
+export {
+  a as InputText,
+  a as default
+};

package/dist/components/Label/Label.css

@@ -0,0 +1 @@
+.label[data-v-e40d9bf8]{color:var(--theme-neutral-text-body);font-size:1rem;line-height:120%}.label.label--with-item[data-v-e40d9bf8]{cursor:pointer}

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

@@ -1,14 +1,18 @@
 import { LabelProps } from 'reka-ui';
 import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
-declare var __VLS_8: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_8) => any;
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
 };
-declare const __VLS_base: DefineComponent<LabelProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<LabelProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-declare const _default: typeof __VLS_export;
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: DefineComponent<LabelProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<LabelProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
-type __VLS_WithSlots<T, S> = T & {
+type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
     };

package/dist/components/Label/Label.vue.js

@@ -0,0 +1,8 @@
+import './Label.css';
+import o from "./Label.vue2.js";
+/* empty css           */
+import t from "../../_virtual/_plugin-vue_export-helper.js";
+const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-e40d9bf8"]]);
+export {
+  f as default
+};

package/dist/components/Label/Label.vue2.js

@@ -0,0 +1,24 @@
+import { defineComponent as s, openBlock as l, createBlock as n, unref as o, mergeProps as p, withCtx as c, renderSlot as f } from "vue";
+import { useForwardProps as d, Label as i } from "reka-ui";
+const b = /* @__PURE__ */ s({
+  __name: "Label",
+  props: {
+    for: {},
+    asChild: { type: Boolean },
+    as: {}
+  },
+  setup(r) {
+    const e = r, t = d(e);
+    return (a, m) => (l(), n(o(i), p(o(t), {
+      class: ["label", { "label--with-item": e.for }]
+    }), {
+      default: c(() => [
+        f(a.$slots, "default", {}, void 0, !0)
+      ]),
+      _: 3
+    }, 16, ["class"]));
+  }
+});
+export {
+  b as default
+};

package/dist/components/Message/Message.css

@@ -0,0 +1 @@
+.message[data-v-1037aad7]{--message-border-color:transparent;--message-bg-color:transparent;--message-icon-bg:transparent;--message-icon-shadow:transparent;--message-title-color:var(--color-neutral-900);--message-text-color:var(--color-neutral-900);background-color:var(--message-bg-color);border:1px solid var(--message-border-color);border-radius:12px;grid-template-columns:1fr;gap:12px;width:100%;height:auto;padding:16px;display:grid}.message.message--view-icon[data-v-1037aad7]{grid-template-columns:44px 1fr}.message__icon[data-v-1037aad7]{background-color:var(--message-icon-bg);width:44px;height:44px;color:var(--color-neutral-0);box-shadow:-1px 1px 10px 0px var(--message-icon-shadow);border-radius:12px;justify-content:center;align-items:center;display:flex}.message__content[data-v-1037aad7]{flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:4px;width:100%;height:auto;display:flex}.message__title[data-v-1037aad7]{color:var(--message-title-color);font-size:16px;font-weight:600;line-height:120%}.message__text[data-v-1037aad7]{color:var(--message-text-color);font-size:14px;line-height:20px}.message.message--warning[data-v-1037aad7]{--message-bg-color:var(--theme-warn-100);--message-icon-bg:var(--theme-warn-600);--message-icon-shadow:#d47d16b2;--message-border-color:var(--theme-warn-200);--message-title-color:var(--theme-warn-800);--message-text-color:var(--theme-warn-700)}.message.message--error[data-v-1037aad7]{--message-bg-color:var(--theme-error-50);--message-icon-bg:var(--theme-error-600);--message-icon-shadow:#bd2429b2;--message-border-color:var(--theme-error-200);--message-title-color:var(--theme-error-800);--message-text-color:var(--theme-error-700)}.message.message--success[data-v-1037aad7]{--message-bg-color:var(--theme-primary-50);--message-icon-bg:var(--theme-primary-600);--message-icon-shadow:#008925b2;--message-border-color:var(--theme-primary-200);--message-title-color:var(--theme-primary-800);--message-text-color:var(--theme-primary-700)}.message.message--info[data-v-1037aad7]{--message-bg-color:var(--theme-info-100);--message-icon-bg:var(--theme-info-600);--message-icon-shadow:#02538fb2;--message-border-color:var(--theme-info-200);--message-title-color:var(--theme-info-800);--message-text-color:var(--theme-info-700)}

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

@@ -1,9 +1,14 @@
 import { PropType, DefineComponent, ExtractPropTypes, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
-declare var __VLS_6: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_6) => any;
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
 };
-declare const __VLS_base: DefineComponent<ExtractPropTypes<{
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: DefineComponent<ExtractPropTypes<{
     type: {
         type: PropType<"error" | "warning" | "info" | "success">;
         default: string;
@@ -42,11 +47,10 @@ declare const __VLS_base: DefineComponent<ExtractPropTypes<{
     title: string;
     message: string;
     viewIcon: boolean;
-}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-declare const _default: typeof __VLS_export;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
-type __VLS_WithSlots<T, S> = T & {
+type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
     };

package/dist/components/Message/Message.vue.js

@@ -0,0 +1,8 @@
+import './Message.css';
+import o from "./Message.vue2.js";
+/* empty css             */
+import a from "../../_virtual/_plugin-vue_export-helper.js";
+const e = /* @__PURE__ */ a(o, [["__scopeId", "data-v-1037aad7"]]);
+export {
+  e as default
+};

package/dist/components/Message/Message.vue2.js

@@ -0,0 +1,64 @@
+import { defineComponent as r, computed as m, reactive as d, openBlock as t, createElementBlock as s, normalizeClass as g, createBlock as u, resolveDynamicComponent as f, createCommentVNode as o, createElementVNode as v, renderSlot as y, Fragment as p, toDisplayString as i } from "vue";
+import { Info as _, CircleAlert as k, Ban as h, CircleCheck as C } from "@lucide/vue";
+const w = {
+  key: 0,
+  class: "message__icon"
+}, B = { class: "message__content" }, I = {
+  key: 0,
+  class: "message__title"
+}, S = {
+  key: 1,
+  class: "message__text"
+}, E = /* @__PURE__ */ r({
+  __name: "Message",
+  props: {
+    type: {
+      type: String,
+      default: "info"
+    },
+    title: {
+      type: String,
+      default: void 0
+    },
+    message: {
+      type: String,
+      default: void 0
+    },
+    viewIcon: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(e) {
+    const a = e, c = m(() => [
+      "message",
+      `message--${a.type}`,
+      { "message--view-icon": a.viewIcon }
+    ]), l = d({
+      success: C,
+      error: h,
+      warning: k,
+      info: _
+    });
+    return (n, $) => (t(), s("div", {
+      class: g(c.value)
+    }, [
+      e.viewIcon ? (t(), s("div", w, [
+        (t(), u(f(l[a.type]), {
+          size: 28,
+          "stroke-width": 2
+        }))
+      ])) : o("", !0),
+      v("div", B, [
+        y(n.$slots, "default", {}, void 0, !0),
+        n.$slots.default ? o("", !0) : (t(), s(p, { key: 0 }, [
+          e.title ? (t(), s("h4", I, i(e.title), 1)) : o("", !0),
+          e.message ? (t(), s("p", S, i(e.message), 1)) : o("", !0)
+        ], 64))
+      ])
+    ], 2));
+  }
+});
+export {
+  E as default
+};

package/dist/components/OTPCode/OTPCode.css

@@ -0,0 +1 @@
+.otp{--field-size:40px;flex-direction:row;align-items:center;gap:8px;width:100%;height:auto;display:flex;position:relative}.otp__field{aspect-ratio:1;width:var(--field-size);height:var(--field-size);text-align:center;font-size:var(--input-font-size);color:var(--input-color-text);background-color:var(--theme-neutral-0);border:1px solid var(--input-border-color);border-radius:8px;outline:none;justify-content:center;align-items:center;line-height:120%;display:flex}.otp__field:hover:not(:disabled){border-color:var(--theme-primary-300)}.otp__field:focus-visible{border-color:var(--theme-primary-500);outline:none}.otp__field:disabled{cursor:not-allowed}.otp__field:read-only{cursor:default}.otp__error{color:var(--input-color-error);padding:4px 8px;font-size:10px;line-height:1;position:absolute;bottom:-18px;left:0}.otp.otp--error .otp__field{border-color:var(--input-color-error);color:var(--input-color-error)}.otp.otp--disabled .otp__field{pointer-events:none;border-color:var(--input-border-color-disabled);background-color:var(--theme-neutral-100);color:var(--input-color-disabled)}.otp.otp--readonly .otp__field{pointer-events:none}.otp.otp--small .otp__field{--field-size:36px;font-size:var(--input-font-size-small)}.otp.otp--large .otp__field{--field-size:44px;font-size:var(--input-font-size-large)}.otp.otp--full{width:100%}.otp.otp--full .otp__field{aspect-ratio:auto;width:100%}

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

@@ -1,11 +1,10 @@
 import { OTPCodeProps } from './OTPCode.types';
 import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
 type __VLS_Props = OTPCodeProps;
-type __VLS_ModelProps = {
+type __VLS_PublicProps = {
     modelValue?: string;
-};
-type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare const __VLS_export: DefineComponent<__VLS_PublicProps, {
+} & __VLS_Props;
+declare const _default: DefineComponent<__VLS_PublicProps, {
     $els: HTMLInputElement[];
     focus: () => void;
 }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
@@ -28,6 +27,7 @@ declare const __VLS_export: DefineComponent<__VLS_PublicProps, {
     required: boolean;
     error: boolean;
     readonly: boolean;
-}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
-declare const _default: typeof __VLS_export;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {
+    inputRefs: HTMLInputElement[];
+}, HTMLDivElement>;
 export default _default;

package/dist/components/OTPCode/OTPCode.vue.js

@@ -0,0 +1,102 @@
+import './OTPCode.css';
+import { defineComponent as C, useModel as F, ref as h, computed as y, watch as g, openBlock as p, createElementBlock as v, normalizeClass as I, Fragment as P, renderList as z, withDirectives as K, vModelText as L, mergeModels as B, nextTick as i } from "vue";
+const R = ["id", "onUpdate:modelValue", "disabled", "readonly", "onInput", "onKeydown", "onPaste", "onFocus", "onBlur"], E = /* @__PURE__ */ C({
+  __name: "OTPCode",
+  props: /* @__PURE__ */ B({
+    length: { default: 5 },
+    disabled: { type: Boolean, default: !1 },
+    readonly: { type: Boolean, default: !1 },
+    error: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 },
+    size: { default: "default" },
+    full: { type: Boolean }
+  }, {
+    modelValue: { default: "" },
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ B(["change", "complete", "focus", "blur"], ["update:modelValue"]),
+  setup(c, { expose: b, emit: k }) {
+    const n = c, f = k, d = F(c, "modelValue"), u = h([]), s = h([]), o = y(() => n.length);
+    g(
+      () => d.value,
+      (e) => {
+        s.value = e.split("").concat(
+          Array(Math.max(0, o.value - e.length)).fill("")
+        );
+      },
+      { immediate: !0 }
+    ), g(
+      s,
+      (e) => {
+        const l = e.join("").slice(0, o.value);
+        l !== d.value && (d.value = l, f("change", l), l.length === o.value && l.replace(/\s/g, "").length === o.value && f("complete", l));
+      },
+      { deep: !0 }
+    );
+    const D = y(() => [
+      "otp",
+      `otp--${n.size}`,
+      {
+        "otp--error": n.error,
+        "otp--disabled": n.disabled,
+        "otp--readonly": n.readonly,
+        "otp--full": n.full
+      }
+    ]), w = (e, l) => {
+      const r = l.target, t = r.value;
+      t.length > 1 && (r.value = t.slice(0, 1)), s.value[e] = r.value, r.value && e < o.value - 1 && i(() => {
+        u.value[e + 1]?.focus();
+      });
+    }, _ = (e, l) => {
+      l.key === "Backspace" && !s.value[e] && e > 0 && i(() => {
+        u.value[e - 1]?.focus();
+      }), l.key === "ArrowLeft" && e > 0 && (l.preventDefault(), u.value[e - 1]?.focus()), l.key === "ArrowRight" && e < o.value - 1 && (l.preventDefault(), u.value[e + 1]?.focus());
+    }, M = (e, l) => {
+      l.preventDefault();
+      const t = (l.clipboardData?.getData("text") || "").slice(0, o.value - e).split("");
+      t.forEach((A, m) => {
+        e + m < o.value && (s.value[e + m] = A);
+      });
+      const a = Math.min(e + t.length, o.value - 1);
+      i(() => {
+        u.value[a]?.focus();
+      });
+    }, V = (e) => {
+      f("focus", e);
+    }, $ = (e) => {
+      f("blur", e);
+    };
+    return b({
+      $els: u.value,
+      focus: () => u.value[0]?.focus()
+    }), (e, l) => (p(), v("div", {
+      class: I(D.value)
+    }, [
+      (p(!0), v(P, null, z(o.value, (r, t) => K((p(), v("input", {
+        id: `otp-${t}`,
+        key: t,
+        ref_for: !0,
+        ref_key: "inputRefs",
+        ref: u,
+        "onUpdate:modelValue": (a) => s.value[t] = a,
+        class: "otp__field",
+        type: "text",
+        maxlength: "1",
+        disabled: c.disabled,
+        readonly: c.readonly,
+        inputmode: "numeric",
+        pattern: "[0-9]*",
+        onInput: (a) => w(t, a),
+        onKeydown: (a) => _(t, a),
+        onPaste: (a) => M(t, a),
+        onFocus: (a) => V(t),
+        onBlur: (a) => $(t)
+      }, null, 40, R)), [
+        [L, s.value[t]]
+      ])), 128))
+    ], 2));
+  }
+});
+export {
+  E as default
+};

package/dist/components/OTPCode/OTPCode.vue3.js

@@ -0,0 +1,5 @@
+import o from "./OTPCode.vue.js";
+/* empty css             */
+export {
+  o as default
+};

package/dist/components/OverlayBadge/OverlayBadge.css

@@ -0,0 +1 @@
+.overlay-badge{width:max-content;height:max-content;position:relative}.overlay-badge.overlay-badge--right .overlay-badge__badge{left:calc(100% - 5px)}.overlay-badge.overlay-badge--left .overlay-badge__badge{left:-4px}.overlay-badge__badge{position:absolute;top:-4px}