@cbutep_n/pico-ui 0.0.9 → 0.0.11

package/dist/components/base/PCheckboxInput/PCheckboxInput.vue.d.ts

@@ -1,5 +1,6 @@
 export interface PCheckboxInputProps {
     disabled?: boolean;
+    isChecked?: boolean;
 }
 type __VLS_Props = PCheckboxInputProps;
 type __VLS_PublicProps = {

package/dist/components/base/PRadioInput/PRadioInput.vue.d.ts

@@ -1,19 +1,11 @@
 export interface PRadioInputProps {
     disabled?: boolean;
     name: string;
-    options: PRadioOptionItem[];
+    isChecked?: boolean;
 }
 export type PRadioOptionItem = {
     value: string;
     label: string;
 };
-type __VLS_Props = PRadioInputProps;
-type __VLS_PublicProps = {
-    modelValue?: string;
-} & __VLS_Props;
-declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (value: string) => any;
-}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: import('vue').DefineComponent<PRadioInputProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<PRadioInputProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 export default _default;

package/dist/components/base/PTextInput/PTextInput.vue.d.ts

@@ -7,9 +7,25 @@ type __VLS_Props = PTextInputProps;
 type __VLS_PublicProps = {
     modelValue?: any;
 } & __VLS_Props;
-declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        start?(_: {}): any;
+        end?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:modelValue": (value: any) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: any) => any) | undefined;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLInputElement>;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/base/PToastRenderer.vue/PToastRenderer.vue.d.ts

@@ -1,2 +1,6 @@
-declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+export type ToastPlacement = "top-left" | "top-right" | "bottom-left" | "bottom-right" | "top-center" | "bottom-center";
+export interface PToastRendererProps {
+    placement?: ToastPlacement;
+}
+declare const _default: import('vue').DefineComponent<PToastRendererProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<PToastRendererProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 export default _default;

package/dist/index.d.ts

@@ -15,9 +15,10 @@ import { default as PSlider } from './components/base/PSlider/PSlider.vue';
 import { useToast } from './composables/useToast';
 import { default as PTabs } from './components/base/PTabs/PTabs.vue';
 import { default as PTab } from './components/base/PTabs/components/PTab.vue';
-export { PCard, PButton, PCheckboxInput, PDivider, PFormItem, PIcon, PPlane, PRadioInput, PSkeleton, PSwitchInput, PTextInput, PBackgroud, useToast, PSlider, PSpinner, PTabs, PTab };
+import { default as PToastRenderer } from './components/base/PToastRenderer.vue/PToastRenderer.vue';
+export { PCard, PButton, PCheckboxInput, PDivider, PFormItem, PIcon, PPlane, PRadioInput, PSkeleton, PSwitchInput, PTextInput, PBackgroud, useToast, PSlider, PSpinner, PTabs, PTab, PToastRenderer, };
 export { PicoIcons, type PicoIconsNames } from './utils/IconsEnum';
-export type { PButtonVariants, PButtonSizes, PButtonProps } from './components/base/PButton/PButton.vue';
+export type { PButtonVariants, PButtonSizes, PButtonProps, } from './components/base/PButton/PButton.vue';
 export type { PCheckboxInputProps } from './components/base/PCheckboxInput/PCheckboxInput.vue';
 export type { PDividerProps } from './components/base/PDivider/PDivider.vue';
 export type { PFormItemProps } from './components/base/PFormItem/PFormItem.vue';
@@ -27,3 +28,4 @@ export type { PTextInputProps } from './components/base/PTextInput/PTextInput.vu
 export type { PTabsProps } from './components/base/PTabs/PTabs.vue';
 export type { PTabProps } from './components/base/PTabs/components/PTab.vue';
 export type { PSliderProps } from './components/base/PSlider/PSlider.vue';
+export type { PToastRendererProps, ToastPlacement, } from './components/base/PToastRenderer.vue/PToastRenderer.vue';

package/dist/pico-ui.es.js

@@ -1,6 +1,6 @@
-import { defineComponent as d, openBlock as n, createElementBlock as l, normalizeClass as u, renderSlot as x, createElementVNode as i, createBlock as _, resolveDynamicComponent as k, unref as m, useModel as p, withDirectives as b, vModelCheckbox as T, createVNode as M, mergeModels as f, toDisplayString as y, createCommentVNode as $, mergeProps as B, isRef as S, Fragment as V, renderList as P, vModelRadio as N, vModelText as C, createStaticVNode as z, computed as j, normalizeStyle as D, reactive as O, readonly as A, onMounted as U } from "vue";
-import { useField as F } from "vee-validate";
-const Ve = /* @__PURE__ */ d({
+import { defineComponent as d, openBlock as n, createElementBlock as s, normalizeClass as c, renderSlot as f, createElementVNode as l, createBlock as h, resolveDynamicComponent as C, unref as u, useModel as x, withDirectives as k, vModelCheckbox as B, createVNode as P, mergeModels as y, toDisplayString as _, createCommentVNode as b, mergeProps as V, isRef as z, vModelDynamic as S, createStaticVNode as N, computed as D, vModelText as j, normalizeStyle as w, reactive as A, readonly as O, onMounted as R, Fragment as T, renderList as I, TransitionGroup as F, withCtx as U } from "vue";
+import { useField as E } from "vee-validate";
+const Be = /* @__PURE__ */ d({
   __name: "PButton",
   props: {
     variant: { default: "primary" },
@@ -11,47 +11,51 @@ const Ve = /* @__PURE__ */ d({
       primary: ["bg-pico-primary", "text-white", "shadow-primary"],
       secondary: ["bg-pico-secondary", "text-white", "shadow-secondary"],
       outline: ["outline-2", "outline-pico-primary", "text-pico-primary"],
-      ghost: ["text-pico-gray", "border-dashed border-2 border-pico-gray/50"],
+      ghost: [
+        "text-pico-text-secondary",
+        "border-dashed border-2 border-pico-text-secondary/50"
+      ],
       soft: ["bg-pico-primary/20", "text-pico-primary"]
-    }, a = {
+    }, o = {
       large: ["text-lg", "py-3.5", "px-8.5"],
       medium: ["text-md", "py-2.5", "px-6"],
       small: ["text-sm", "py-1.5", "px-4"]
     };
-    return (s, o) => (n(), l("button", {
-      class: u(["w-max h-max rounded-lg font-semibold hover:brightness-80 duration-300", [t[e.variant], a[e.size]]])
+    return (a, i) => (n(), s("button", {
+      class: c(["w-max h-max rounded-lg font-semibold hover:brightness-80 duration-300", [t[e.variant], o[e.size]]])
     }, [
-      x(s.$slots, "default")
+      f(a.$slots, "default")
     ], 2));
   }
-}), R = {
+}), L = {
   xmlns: "http://www.w3.org/2000/svg",
   width: "12",
   height: "9",
   fill: "none"
 };
-function E(e, t) {
-  return n(), l("svg", R, [...t[0] || (t[0] = [
-    i("path", {
+function q(e, t) {
+  return n(), s("svg", L, [...t[0] || (t[0] = [
+    l("path", {
       fill: "currentColor",
       d: "M10.868.366a1.25 1.25 0 0 1 0 1.767l-6.25 6.25a1.25 1.25 0 0 1-1.767 0l-2.5-2.5a1.25 1.25 0 0 1 1.767-1.767l1.617 1.616L9.1.366a1.25 1.25 0 0 1 1.767 0"
     }, null, -1)
   ])]);
 }
-const L = { render: E }, q = {
-  checkmark: L
-}, I = /* @__PURE__ */ d({
+const G = { render: q }, H = {
+  checkmark: G
+}, M = /* @__PURE__ */ d({
   __name: "PIcon",
   props: {
     name: {}
   },
   setup(e) {
-    return (t, a) => (n(), _(k(m(q)[e.name])));
+    return (t, o) => (n(), h(C(u(H)[e.name])));
   }
-}), G = ["disabled"], Pe = /* @__PURE__ */ d({
+}), J = ["disabled"], ze = /* @__PURE__ */ d({
   __name: "PCheckboxInput",
-  props: /* @__PURE__ */ f({
-    disabled: { type: Boolean, default: !1 }
+  props: /* @__PURE__ */ y({
+    disabled: { type: Boolean, default: !1 },
+    isChecked: { type: Boolean, default: !1 }
   }, {
     modelValue: { type: Boolean },
     modelModifiers: {}
@@ -61,25 +65,27 @@ const L = { render: E }, q = {
     const t = /* @__PURE__ */ new Map([
       [!1, ["outline-2"]],
       [!0, ["bg-pico-primary"]]
-    ]), a = p(e, "modelValue");
-    return (s, o) => (n(), l("div", {
-      class: u([m(t).get(!!a.value), "outline-pico-stroke-neutral min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-sm"])
+    ]), o = x(e, "modelValue");
+    return (a, i) => (n(), s("div", {
+      class: c([u(t).get(e.isChecked), "outline-pico-border min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-sm"])
     }, [
-      b(i("input", {
+      k(l("input", {
         class: "opacity-0 inset-0 absolute",
         disabled: e.disabled,
         type: "checkbox",
-        "onUpdate:modelValue": o[0] || (o[0] = (r) => a.value = r)
-      }, null, 8, G), [
-        [T, a.value]
+        "onUpdate:modelValue": i[0] || (i[0] = (r) => o.value = r)
+      }, null, 8, J), [
+        [B, o.value]
       ]),
-      M(I, {
+      P(M, {
         name: "checkmark",
-        class: "text-white"
-      })
+        class: c(["text-white pointer-events-none", {
+          "opacity-0": !e.isChecked
+        }])
+      }, null, 8, ["class"])
     ], 2));
   }
-}), Ce = /* @__PURE__ */ d({
+}), Se = /* @__PURE__ */ d({
   __name: "PDivider",
   props: {
     orientation: { default: "horizontal" }
@@ -89,11 +95,11 @@ const L = { render: E }, q = {
       vertical: ["w-2px", "h-full"],
       horizontal: ["h-2px", "w-full"]
     };
-    return (a, s) => (n(), l("div", {
-      class: u(["bg-pico-stroke-neutral", t[e.orientation]])
+    return (o, a) => (n(), s("div", {
+      class: c(["bg-pico-border", t[e.orientation]])
     }, null, 2));
   }
-}), H = { class: "flex flex-col items-start" }, Ie = /* @__PURE__ */ d({
+}), K = { class: "flex flex-col items-start" }, Ne = /* @__PURE__ */ d({
   __name: "PFormItem",
   props: {
     component: {},
@@ -103,71 +109,64 @@ const L = { render: E }, q = {
     errorClass: {}
   },
   setup(e) {
-    const { value: t, errorMessage: a } = F(e.name, {});
-    return (s, o) => (n(), l("div", H, [
-      m(a) ? (n(), l("span", {
+    const { value: t, errorMessage: o } = E(e.name, {});
+    return (a, i) => (n(), s("div", K, [
+      u(o) ? (n(), s("span", {
         key: 0,
-        class: u([e.errorClass, "text-pico-red text-xs max-w-full mb-1"])
-      }, y(m(a)), 3)) : $("", !0),
-      (n(), _(k(e.component), B({
+        class: c([e.errorClass, "text-pico-error text-xs max-w-full mb-1"])
+      }, _(u(o)), 3)) : b("", !0),
+      (n(), h(C(e.component), V({
         class: [e.inputClass, "max-w-max"],
-        "is-invalid": !!m(a),
-        modelValue: m(t),
-        "onUpdate:modelValue": o[0] || (o[0] = (r) => S(t) ? t.value = r : null),
+        "is-invalid": !!u(o),
+        modelValue: u(t),
+        "onUpdate:modelValue": i[0] || (i[0] = (r) => z(t) ? t.value = r : null),
         name: e.name
       }, e.props), null, 16, ["class", "is-invalid", "modelValue", "name"]))
     ]));
   }
-}), v = (e, t) => {
-  const a = e.__vccOpts || e;
-  for (const [s, o] of t)
-    a[s] = o;
-  return a;
-}, J = {}, K = { class: "rounded-lg p-8 bg-white outline-pico-stroke-neutral outline-2" };
-function Q(e, t) {
-  return n(), l("div", K, [
-    x(e.$slots, "default")
+}), p = (e, t) => {
+  const o = e.__vccOpts || e;
+  for (const [a, i] of t)
+    o[a] = i;
+  return o;
+}, Q = {}, W = { class: "rounded-lg p-8 bg-pico-bg-elevated outline-pico-border outline-2" };
+function X(e, t) {
+  return n(), s("div", W, [
+    f(e.$slots, "default")
   ]);
 }
-const Te = /* @__PURE__ */ v(J, [["render", Q]]), W = { class: "flex gap-2" }, X = ["value", "disabled"], Me = /* @__PURE__ */ d({
+const De = /* @__PURE__ */ p(Q, [["render", X]]), Y = ["disabled"], je = /* @__PURE__ */ d({
   __name: "PRadioInput",
-  props: /* @__PURE__ */ f({
+  props: {
     disabled: { type: Boolean, default: !1 },
     name: {},
-    options: {}
-  }, {
-    modelValue: {},
-    modelModifiers: {}
-  }),
-  emits: ["update:modelValue"],
+    isChecked: { type: Boolean, default: !1 }
+  },
   setup(e) {
     const t = /* @__PURE__ */ new Map([
       [!1, ["outline-2 -outline-offset-2"]],
       [!0, ["bg-pico-primary"]]
-    ]), a = p(e, "modelValue");
-    return (s, o) => (n(!0), l(V, null, P(e.options, (r) => (n(), l("div", W, [
-      i("div", {
-        class: u([m(t).get(a.value === r.value), "outline-pico-stroke-neutral min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-full"])
-      }, [
-        b(i("input", {
-          type: "radio",
-          value: r.value,
-          class: "opacity-0 inset-0 absolute",
-          disabled: e.disabled,
-          "onUpdate:modelValue": o[0] || (o[0] = (c) => a.value = c)
-        }, null, 8, X), [
-          [N, a.value]
-        ]),
-        o[1] || (o[1] = i("div", { class: "w-2 h-2 bg-white rounded-full" }, null, -1))
-      ], 2),
-      i("p", null, y(r.label), 1)
-    ]))), 256));
+    ]);
+    return (o, a) => (n(), s("div", {
+      class: c([u(t).get(e.isChecked), "outline-pico-border min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-full"])
+    }, [
+      l("input", {
+        type: "radio",
+        class: "opacity-0 inset-0 absolute",
+        disabled: e.disabled
+      }, null, 8, Y),
+      l("div", {
+        class: c(["w-2 h-2 bg-white rounded-full pointer-events-none", {
+          "opacity-0": !e.isChecked
+        }])
+      }, null, 2)
+    ], 2));
   }
-}), Y = {}, Z = { class: "w-full h-full rounded-sm pico-skeleton" };
-function ee(e, t) {
-  return n(), l("div", Z);
+}), Z = {}, ee = { class: "w-full h-full rounded-sm pico-skeleton" };
+function te(e, t) {
+  return n(), s("div", ee);
 }
-const Be = /* @__PURE__ */ v(Y, [["render", ee], ["__scopeId", "data-v-7ff1dee9"]]), Se = /* @__PURE__ */ d({
+const Ae = /* @__PURE__ */ p(Z, [["render", te], ["__scopeId", "data-v-caab53ad"]]), Oe = /* @__PURE__ */ d({
   __name: "PSwitchInput",
   props: {
     modelValue: { type: Boolean },
@@ -178,27 +177,28 @@ const Be = /* @__PURE__ */ v(Y, [["render", ee], ["__scopeId", "data-v-7ff1dee9"
     const t = /* @__PURE__ */ new Map([
       [!1, [""]],
       [!0, ["translate-x-[calc(100%-2px)]"]]
-    ]), a = /* @__PURE__ */ new Map([
-      [!1, ["bg-pico-stroke-neutral "]],
+    ]), o = /* @__PURE__ */ new Map([
+      [!1, ["bg-pico-border "]],
       [!0, ["bg-pico-primary"]]
-    ]), s = p(e, "modelValue"), o = () => {
-      s.value = !s.value;
+    ]), a = x(e, "modelValue"), i = () => {
+      a.value = !a.value;
     };
-    return (r, c) => (n(), l("div", {
-      onClick: o,
-      class: u([m(a).get(!!s.value), "p-0.5 duration-300 min-w-10.5 rounded-full"])
+    return (r, m) => (n(), s("div", {
+      onClick: i,
+      class: c([u(o).get(!!a.value), "p-0.5 duration-300 min-w-10.5 rounded-full"])
     }, [
-      i("div", {
-        class: u([m(t).get(!!s.value), "w-5 duration-300 will-change-transform aspect-square rounded-full bg-white"])
+      l("div", {
+        class: c([u(t).get(!!a.value), "w-5 duration-300 will-change-transform aspect-square rounded-full bg-white"])
       }, null, 2)
     ], 2));
   }
-}), te = ["disabled", "placeholder"], Ne = /* @__PURE__ */ d({
+}), oe = ["disabled", "placeholder"], Re = /* @__PURE__ */ d({
+  inheritAttrs: !1,
   __name: "PTextInput",
-  props: /* @__PURE__ */ f({
+  props: /* @__PURE__ */ y({
     placeholder: {},
-    isInvalid: { type: Boolean, default: !1 },
-    disabled: { type: Boolean, default: !1 }
+    isInvalid: { type: Boolean },
+    disabled: { type: Boolean }
   }, {
     modelValue: {},
     modelModifiers: {}
@@ -206,44 +206,55 @@ const Be = /* @__PURE__ */ v(Y, [["render", ee], ["__scopeId", "data-v-7ff1dee9"
   emits: ["update:modelValue"],
   setup(e) {
     const t = /* @__PURE__ */ new Map([
-      [!0, ["outline-pico-red! text-pico-red! bg-pico-light-red!"]],
+      [!0, ["outline-pico-error! text-pico-error! bg-pico-error-bg!"]],
       [!1, []]
-    ]), a = p(e, "modelValue");
-    return (s, o) => b((n(), l("input", {
-      disabled: e.disabled,
-      type: "text",
-      "onUpdate:modelValue": o[0] || (o[0] = (r) => a.value = r),
-      placeholder: e.placeholder,
-      class: u([m(t).get(e.isInvalid), "outline-pico-stroke-neutral outline-1 disabled:text-pico-caption/70 disabled:cursor-not-allowed text-pico-caption focus:text-pico-text bg-pico-light focus:bg-pico-white duration-300 focus:outline-pico-primary px-3 py-2 rounded-lg"])
-    }, null, 10, te)), [
-      [C, a.value]
-    ]);
+    ]), o = x(e, "modelValue");
+    return (a, i) => (n(), s("div", {
+      tabindex: "0",
+      class: c(["outline-pico-border outline-1 focus-within:outline-pico-primary text-pico-text-secondary focus-within:text-pico-text bg-pico-input-bg duration-300 focus-within:outline-pico-primary px-3 py-2 rounded-lg", [
+        u(t).get(e.isInvalid),
+        {
+          "cursor-not-allowed! text-pico-text-secondary/70!": e.disabled
+        }
+      ]])
+    }, [
+      a.$slots.start ? f(a.$slots, "start", { key: 0 }) : b("", !0),
+      k(l("input", V(a.$attrs, {
+        disabled: e.disabled,
+        "onUpdate:modelValue": i[0] || (i[0] = (r) => o.value = r),
+        placeholder: e.placeholder,
+        class: "group outline-0!"
+      }), null, 16, oe), [
+        [S, o.value]
+      ]),
+      a.$slots.end ? f(a.$slots, "end", { key: 1 }) : b("", !0)
+    ], 2));
   }
-}), ae = {}, oe = { class: "bg-pico-light w-full h-full" };
-function ne(e, t) {
-  return n(), l("div", oe, [
-    x(e.$slots, "default")
+}), ae = {}, ne = { class: "bg-pico-bg w-full h-full" };
+function se(e, t) {
+  return n(), s("div", ne, [
+    f(e.$slots, "default")
   ]);
 }
-const ze = /* @__PURE__ */ v(ae, [["render", ne]]), se = {}, le = { class: "shadow-dark rounded-lg p-4 bg-white" };
-function ie(e, t) {
-  return n(), l("div", le, [
-    x(e.$slots, "default")
+const Fe = /* @__PURE__ */ p(ae, [["render", se]]), ie = {}, le = { class: "rounded-lg p-4 bg-pico-bg-elevated" };
+function re(e, t) {
+  return n(), s("div", le, [
+    f(e.$slots, "default")
   ]);
 }
-const je = /* @__PURE__ */ v(se, [["render", ie]]), re = {}, ce = {
+const Ue = /* @__PURE__ */ p(ie, [["render", re]]), ce = {}, de = {
   class: "h-25 w-25",
   viewBox: "0 0 50 50",
   xmlns: "http://www.w3.org/2000/svg"
 };
 function ue(e, t) {
-  return n(), l("svg", ce, [...t[0] || (t[0] = [
-    z('<circle cx="25" cy="25" r="20" fill="none" stroke="#3b82f6" stroke-width="4" stroke-linecap="round" stroke-dasharray="90 150" stroke-dashoffset="0"><animateTransform attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="1.5s" repeatCount="indefinite"></animateTransform><animate attributeName="stroke-dasharray" values="1, 200; 90, 150; 90, 150" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate><animate attributeName="stroke-dashoffset" values="0; -100; -124" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate></circle><circle cx="25" cy="25" r="20" fill="none" stroke="#13c8ec" stroke-width="4" stroke-linecap="round" stroke-dasharray="90 150" stroke-dashoffset="0"><animateTransform attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="1.5s" repeatCount="indefinite"></animateTransform><animate attributeName="stroke-dasharray" values="1, 200; 90, 150; 90, 150" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate><animate attributeName="stroke-dashoffset" values="0; -35; -124" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate></circle>', 2)
+  return n(), s("svg", de, [...t[0] || (t[0] = [
+    N('<circle cx="25" cy="25" r="20" fill="none" stroke="var(--color-pico-secondary)" stroke-width="4" stroke-linecap="round" stroke-dasharray="90 150" stroke-dashoffset="0"><animateTransform attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="1.5s" repeatCount="indefinite"></animateTransform><animate attributeName="stroke-dasharray" values="1, 200; 90, 150; 90, 150" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate><animate attributeName="stroke-dashoffset" values="0; -100; -124" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate></circle><circle cx="25" cy="25" r="20" fill="none" stroke="var(--color-pico-primary)" stroke-width="4" stroke-linecap="round" stroke-dasharray="90 150" stroke-dashoffset="0"><animateTransform attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="1.5s" repeatCount="indefinite"></animateTransform><animate attributeName="stroke-dasharray" values="1, 200; 90, 150; 90, 150" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate><animate attributeName="stroke-dashoffset" values="0; -35; -124" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate></circle>', 2)
   ])]);
 }
-const De = /* @__PURE__ */ v(re, [["render", ue]]), de = { class: "w-40 flex group" }, me = { class: "h-2 rounded-xl w-full bg-pico-stroke-neutral relative" }, pe = ["min", "max", "step"], fe = { class: "relative w-full h-full flex justify-end items-center pointer-events-none" }, ve = { class: "absolute h-5 w-5 border-2 border-white translate-x-1/2 transition-colors duration-200 bg-pico-primary rounded-full" }, he = { class: "relative w-full h-full flex justify-center" }, xe = { class: "absolute bottom-[calc(100%+5px)] group-hover:opacity-100 opacity-0 duration-200 transition-opacity bg-pico-caption text-white px-2 rounded-lg text-xs py-0.5" }, Oe = /* @__PURE__ */ d({
+const Ee = /* @__PURE__ */ p(ce, [["render", ue]]), me = { class: "w-40 flex group" }, pe = { class: "h-2 rounded-xl w-full bg-pico-border relative" }, fe = ["min", "max", "step"], he = { class: "relative w-full h-full flex justify-end items-center pointer-events-none" }, xe = { class: "absolute h-5 w-5 border-2 border-white translate-x-1/2 transition-colors duration-200 bg-pico-primary rounded-full" }, ve = { class: "relative w-full h-full flex justify-center" }, be = { class: "absolute bottom-[calc(100%+5px)] group-hover:opacity-100 opacity-0 duration-200 transition-opacity bg-pico-text-secondary text-white px-2 rounded-lg text-xs py-0.5" }, Le = /* @__PURE__ */ d({
   __name: "PSlider",
-  props: /* @__PURE__ */ f({
+  props: /* @__PURE__ */ y({
     min: {},
     max: {},
     step: {}
@@ -253,29 +264,29 @@ const De = /* @__PURE__ */ v(re, [["render", ue]]), de = { class: "w-40 flex gro
   }),
   emits: ["update:modelValue"],
   setup(e) {
-    const t = e, a = p(e, "modelValue"), s = j(() => (a.value - t.min) / (t.max - t.min) * 100);
-    return (o, r) => (n(), l("div", de, [
-      i("div", me, [
-        b(i("input", {
+    const t = e, o = x(e, "modelValue"), a = D(() => (o.value - t.min) / (t.max - t.min) * 100);
+    return (i, r) => (n(), s("div", me, [
+      l("div", pe, [
+        k(l("input", {
           min: e.min,
           max: e.max,
           step: e.step,
-          "onUpdate:modelValue": r[0] || (r[0] = (c) => a.value = c),
+          "onUpdate:modelValue": r[0] || (r[0] = (m) => o.value = m),
           type: "range",
           class: "h-full opacity-0 absolute inset-y-0 -inset-x-2"
-        }, null, 8, pe), [
-          [C, a.value]
+        }, null, 8, fe), [
+          [j, o.value]
         ]),
-        i("div", {
+        l("div", {
           class: "h-2 rounded-xl bg-pico-primary group-hover:bg-pico-primary/70 transition-colors duration-200 absolute left-0 pointer-events-none",
-          style: D({
-            width: s.value + "%"
+          style: w({
+            width: a.value + "%"
           })
         }, [
-          i("div", fe, [
-            i("div", ve, [
-              i("div", he, [
-                i("div", xe, y(a.value), 1)
+          l("div", he, [
+            l("div", xe, [
+              l("div", ve, [
+                l("div", be, _(o.value), 1)
               ])
             ])
           ])
@@ -283,24 +294,24 @@ const De = /* @__PURE__ */ v(re, [["render", ue]]), de = { class: "w-40 flex gro
       ])
     ]));
   }
-}), h = O([]);
-let w = 1e3;
-const Ae = () => {
-  const e = (t, a = 3e3) => {
-    const s = Date.now() + Math.random();
-    w++;
-    const o = w;
-    h.push({ id: s, message: t, zIndex: o, duration: a });
+}), v = A([]);
+let $ = 1e3;
+const ye = () => {
+  const e = (t, o = 3e3) => {
+    const a = Date.now() + Math.random();
+    $++;
+    const i = $;
+    v.push({ id: a, message: t, zIndex: i, duration: o });
     const r = setTimeout(() => {
-      const c = h.findIndex((g) => g.id === s);
-      c !== -1 && h.splice(c, 1), clearTimeout(r);
-    }, a);
+      const m = v.findIndex((g) => g.id === a);
+      m !== -1 && v.splice(m, 1), clearTimeout(r);
+    }, o);
   };
   return {
-    stack: A(h),
+    stack: O(v),
     addToast: e
   };
-}, _e = { class: "duration-200 flex flex-col items-center justify-center cursor-pointer select-none gap-3" }, be = { class: "flex w-full gap-2 justify-center items-center" }, ye = /* @__PURE__ */ d({
+}, _e = { class: "duration-200 flex flex-col items-center justify-center cursor-pointer select-none gap-3" }, ge = { class: "flex w-full gap-2 justify-center items-center" }, we = /* @__PURE__ */ d({
   __name: "PTab",
   props: {
     isActive: { type: Boolean },
@@ -308,32 +319,32 @@ const Ae = () => {
     icon: {}
   },
   setup(e) {
-    return (t, a) => (n(), l("div", _e, [
-      i("div", be, [
-        e.icon ? (n(), _(I, {
+    return (t, o) => (n(), s("div", _e, [
+      l("div", ge, [
+        e.icon ? (n(), h(M, {
           key: 0,
           name: e.icon,
-          class: u(["duration-200", {
+          class: c(["duration-200", {
             "text-pico-primary!": e.isActive,
-            "text-pico-stroke-neutral": !e.isActive
+            "text-pico-border": !e.isActive
           }])
-        }, null, 8, ["name", "class"])) : $("", !0),
-        i("p", {
-          class: u(["text-sm/none duration-200", {
-            "text-pico-caption!": !e.isActive
+        }, null, 8, ["name", "class"])) : b("", !0),
+        l("p", {
+          class: c(["text-sm/none text-pico-text duration-200", {
+            "text-pico-text-secondary!": !e.isActive
           }])
-        }, y(e.label), 3)
+        }, _(e.label), 3)
       ]),
-      i("div", {
-        class: u(["bg-pico-primary duration-200 h-0.5 rounded-full w-0", {
+      l("div", {
+        class: c(["bg-pico-primary duration-200 h-0.5 rounded-full w-0", {
           "w-full!": e.isActive
         }])
       }, null, 2)
     ]));
   }
-}), ge = { class: "flex bg-white gap-6" }, Ue = /* @__PURE__ */ d({
+}), ke = { class: "flex gap-6" }, qe = /* @__PURE__ */ d({
   __name: "PTabs",
-  props: /* @__PURE__ */ f({
+  props: /* @__PURE__ */ y({
     options: {},
     defaultOption: {}
   }, {
@@ -342,40 +353,86 @@ const Ae = () => {
   }),
   emits: ["update:modelValue"],
   setup(e) {
-    const t = e, a = p(e, "modelValue"), s = (o) => {
-      a.value = o;
+    const t = e, o = x(e, "modelValue"), a = (i) => {
+      o.value = i;
     };
-    return U(() => {
-      t.defaultOption ? a.value = t.defaultOption : a.value = t?.options[0]?.value;
-    }), (o, r) => (n(), l("div", ge, [
-      (n(!0), l(V, null, P(e.options, (c, g) => (n(), _(ye, {
+    return R(() => {
+      t.defaultOption ? o.value = t.defaultOption : o.value = t?.options[0]?.value;
+    }), (i, r) => (n(), s("div", ke, [
+      (n(!0), s(T, null, I(e.options, (m, g) => (n(), h(we, {
         key: g,
-        "is-active": c.value === a.value,
-        label: c.label,
-        onClick: (we) => s(c.value),
-        icon: c.icon
+        "is-active": m.value === o.value,
+        label: m.label,
+        onClick: (Te) => a(m.value),
+        icon: m.icon
       }, null, 8, ["is-active", "label", "onClick", "icon"]))), 128))
     ]));
   }
-});
+}), $e = { class: "line-clamp-2 max-w-[300px] select-none" }, Ce = /* @__PURE__ */ d({
+  __name: "PToast",
+  props: {
+    toast: {}
+  },
+  setup(e) {
+    return (t, o) => (n(), s("div", {
+      class: "rounded-lg p-2 bg-pico-bg-elevated outline-pico-border text-pico-text/90 outline-2 flex flex-col max-w-max gap-1 pointer-events-auto",
+      style: w({ zIndex: e.toast.zIndex })
+    }, [
+      l("div", $e, _(e.toast.message), 1),
+      l("div", {
+        class: "h-1 bg-pico-primary pico-toast rounded-full",
+        style: w({ "--toast-duration": e.toast.duration + "ms" })
+      }, null, 4)
+    ], 4));
+  }
+}), Pe = /* @__PURE__ */ p(Ce, [["__scopeId", "data-v-b851dd3c"]]), Ve = /* @__PURE__ */ d({
+  __name: "PToastRenderer",
+  props: {
+    placement: { default: "top-right" }
+  },
+  setup(e) {
+    const { stack: t } = ye(), o = {
+      "top-left": "top-5 left-5",
+      "top-right": "top-5 right-5",
+      "bottom-left": "bottom-5 left-5",
+      "bottom-right": "bottom-5 right-5",
+      "top-center": "top-5 left-1/2 -translate-x-1/2",
+      "bottom-center": "bottom-5 left-1/2 -translate-x-1/2"
+    };
+    return (a, i) => (n(), s("div", {
+      class: c(["fixed z-9999 flex flex-col items-end gap-2 pointer-events-none", o[e.placement]])
+    }, [
+      P(F, { name: "list" }, {
+        default: U(() => [
+          (n(!0), s(T, null, I(u(t), (r) => (n(), h(Pe, {
+            key: r.id,
+            toast: r
+          }, null, 8, ["toast"]))), 128))
+        ]),
+        _: 1
+      })
+    ], 2));
+  }
+}), Ge = /* @__PURE__ */ p(Ve, [["__scopeId", "data-v-421b01f2"]]);
 export {
-  ze as PBackgroud,
-  Ve as PButton,
-  je as PCard,
-  Pe as PCheckboxInput,
-  Ce as PDivider,
-  Ie as PFormItem,
-  I as PIcon,
-  Te as PPlane,
-  Me as PRadioInput,
-  Be as PSkeleton,
-  Oe as PSlider,
-  De as PSpinner,
-  Se as PSwitchInput,
-  ye as PTab,
-  Ue as PTabs,
-  Ne as PTextInput,
-  q as PicoIcons,
-  Ae as useToast
+  Fe as PBackgroud,
+  Be as PButton,
+  Ue as PCard,
+  ze as PCheckboxInput,
+  Se as PDivider,
+  Ne as PFormItem,
+  M as PIcon,
+  De as PPlane,
+  je as PRadioInput,
+  Ae as PSkeleton,
+  Le as PSlider,
+  Ee as PSpinner,
+  Oe as PSwitchInput,
+  we as PTab,
+  qe as PTabs,
+  Re as PTextInput,
+  Ge as PToastRenderer,
+  H as PicoIcons,
+  ye as useToast
 };
 //# sourceMappingURL=pico-ui.es.js.map

package/dist/pico-ui.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"pico-ui.es.js","sources":["../src/components/base/PButton/PButton.vue","../src/assets/checkmark.svg","../src/utils/IconsEnum.ts","../src/components/base/PIcon/PIcon.vue","../src/components/base/PCheckboxInput/PCheckboxInput.vue","../src/components/base/PDivider/PDivider.vue","../src/components/base/PFormItem/PFormItem.vue","../src/components/base/PPlane/PPlane.vue","../src/components/base/PRadioInput/PRadioInput.vue","../src/components/base/PSkeleton/PSkeleton.vue","../src/components/base/PSwitchInput/PSwitchInput.vue","../src/components/base/PTextInput/PTextInput.vue","../src/components/PBackground/PBackgroud.vue","../src/components/base/PCard/PCard.vue","../src/components/base/PSpinner/PSpinner.vue","../src/components/base/PSlider/PSlider.vue","../src/composables/useToast.ts","../src/components/base/PTabs/components/PTab.vue","../src/components/base/PTabs/PTabs.vue"],"sourcesContent":["<script setup lang=\"ts\">\nconst { variant = \"primary\", size = \"medium\" } = defineProps<PButtonProps>();\n\nexport interface PButtonProps {\n  variant?: PButtonVariants;\n  size?: PButtonSizes;\n}\nexport type PButtonVariants = \"primary\" | \"secondary\" | \"outline\" | \"ghost\" | \"soft\";\nexport type PButtonSizes = \"large\" | \"medium\" | \"small\";\n\nconst computedVariant: Record<PButtonVariants, string[]> = {\n  primary: [\"bg-pico-primary\", \"text-white\", \"shadow-primary\"],\n  secondary: [\"bg-pico-secondary\", \"text-white\", \"shadow-secondary\"],\n  outline: [\"outline-2\", \"outline-pico-primary\", \"text-pico-primary\"],\n  ghost: [\"text-pico-gray\", \"border-dashed border-2 border-pico-gray/50\"],\n  soft: [\"bg-pico-primary/20\", \"text-pico-primary\"],\n};\n\nconst computedSize: Record<PButtonSizes, string[]> = {\n  large: [\"text-lg\", \"py-3.5\", \"px-8.5\"],\n  medium: [\"text-md\", \"py-2.5\", \"px-6\"],\n  small: [\"text-sm\", \"py-1.5\", \"px-4\"],\n};\n</script>\n\n<template>\n  <button\n    class=\"w-max h-max rounded-lg font-semibold hover:brightness-80 duration-300\"\n    :class=\"[computedVariant[variant], computedSize[size]]\"\n  >\n    <slot />\n  </button>\n</template>\n\n<style lang=\"css\" scoped></style>\n","import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nconst _hoisted_1 = {\n  xmlns: \"http://www.w3.org/2000/svg\",\n  width: \"12\",\n  height: \"9\",\n  fill: \"none\"\n}\n\nexport function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", _hoisted_1, [...(_cache[0] || (_cache[0] = [\n    _createElementVNode(\"path\", {\n      fill: \"currentColor\",\n      d: \"M10.868.366a1.25 1.25 0 0 1 0 1.767l-6.25 6.25a1.25 1.25 0 0 1-1.767 0l-2.5-2.5a1.25 1.25 0 0 1 1.767-1.767l1.617 1.616L9.1.366a1.25 1.25 0 0 1 1.767 0\"\n    }, null, -1)\n  ]))]))\n}\nexport default { render: render }","import type { Component } from 'vue'\nimport CheckmarkIcon from '@/assets/checkmark.svg'\nexport type PicoIconsNames = 'checkmark'\n\nexport const PicoIcons: Record<PicoIconsNames, Component | string> = {\n  checkmark: CheckmarkIcon\n}\n","<script setup lang=\"ts\">\nimport { PicoIcons, type PicoIconsNames } from \"../../../utils/IconsEnum\";\nexport interface PIconProps {\n  name: PicoIconsNames;\n}\n\ndefineProps<PIconProps>();\n</script>\n\n<template>\n  <component :is=\"PicoIcons[name]\" />\n</template>\n\n<style lang=\"css\" scoped></style>\n","<script setup lang=\"ts\">\r\nimport PIcon from \"../PIcon/PIcon.vue\";\r\n\r\nexport interface PCheckboxInputProps {\r\n  disabled?: boolean;\r\n}\r\n\r\nconst { disabled = false } = defineProps<PCheckboxInputProps>();\r\nconst computedClasses = new Map([\r\n  [false, [\"outline-2\"]],\r\n  [true, [\"bg-pico-primary\"]],\r\n]);\r\nconst model = defineModel<boolean>();\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    :class=\"computedClasses.get(!!model)\"\r\n    class=\"outline-pico-stroke-neutral min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-sm\"\r\n  >\r\n    <input\r\n      class=\"opacity-0 inset-0 absolute\"\r\n      :disabled=\"disabled\"\r\n      type=\"checkbox\"\r\n      v-model=\"model\"\r\n    />\r\n    <PIcon name=\"checkmark\" class=\"text-white\" />\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\">\nconst { orientation = \"horizontal\" } = defineProps<PDividerProps>();\n\nexport interface PDividerProps {\n  orientation?: \"vertical\" | \"horizontal\";\n}\n\nexport type PDividerOrientation = \"vertical\" | \"horizontal\";\n\nconst computedClasses: Record<PDividerOrientation, string[]> = {\n  vertical: [\"w-2px\", \"h-full\"],\n  horizontal: [\"h-2px\", \"w-full\"],\n};\n</script>\n\n<template>\n  <div\n    class=\"bg-pico-stroke-neutral\"\n    :class=\"computedClasses[orientation]\"\n  ></div>\n</template>\n\n<style lang=\"css\" scoped></style>\n","<script setup lang=\"ts\">\nimport { useField } from \"vee-validate\";\nimport type { Component } from \"vue\";\n\nexport interface PFormItemProps {\n  component: Component;\n  props: Record<string, unknown>;\n  name: string;\n  inputClass?: string;\n  errorClass?: string;\n}\nconst { name } = defineProps<PFormItemProps>();\n\nconst { value, errorMessage } = useField(name, {});\n</script>\n\n<template>\n  <div class=\"flex flex-col items-start\">\n    <span\n      v-if=\"errorMessage\"\n      :class=\"errorClass\"\n      class=\"text-pico-red text-xs max-w-full mb-1\"\n      >{{ errorMessage }}</span\n    >\n    <component\n      :class=\"inputClass\"\n      class=\"max-w-max\"\n      :is-invalid=\"!!errorMessage\"\n      v-model=\"value\"\n      :is=\"component\"\n      :name=\"name\"\n      v-bind=\"props\"\n    ></component>\n  </div>\n</template>\n\n<style lang=\"css\" scoped></style>\n","<script setup lang=\"ts\"></script>\n\n<template>\n  <div class=\"rounded-lg p-8 bg-white outline-pico-stroke-neutral outline-2\">\n    <slot />\n  </div>\n</template>\n\n<style lang=\"css\" scoped></style>\n","<script setup lang=\"ts\">\nexport interface PRadioInputProps {\n  disabled?: boolean;\n  name: string;\n  options: PRadioOptionItem[];\n}\n\nexport type PRadioOptionItem = { value: string; label: string };\n\nconst { disabled = false } = defineProps<PRadioInputProps>();\nconst computedClasses = new Map([\n  [false, [\"outline-2 -outline-offset-2\"]],\n  [true, [\"bg-pico-primary\"]],\n]);\nconst model = defineModel<string>();\n</script>\n\n<template>\n  <div v-for=\"option in options\" class=\"flex gap-2\">\n    <div\n      :class=\"computedClasses.get(model === option.value)\"\n      class=\"outline-pico-stroke-neutral min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-full\"\n    >\n      <input\n        type=\"radio\"\n        :value=\"option.value\"\n        class=\"opacity-0 inset-0 absolute\"\n        :disabled=\"disabled\"\n        v-model=\"model\"\n      />\n      <div class=\"w-2 h-2 bg-white rounded-full\"></div>\n    </div>\n    <p>\n      {{ option.label }}\n    </p>\n  </div>\n</template>\n\n<style lang=\"css\" scoped></style>\n","<template>\n  <div class=\"w-full h-full rounded-sm pico-skeleton\" />\n</template>\n\n<style lang=\"css\" scoped>\n.pico-skeleton {\n  background: linear-gradient(\n    70deg,\n    var(--color-pico-stroke-neutral) 30%,\n    var(--color-pico-light),\n    var(--color-pico-stroke-neutral) 70%\n  );\n  background-size: 200% 100%;\n  animation: skeleton 1.5s infinite linear;\n}\n\n@keyframes skeleton {\n  0% {\n    background-position: 100% 0;\n  }\n  100% {\n    background-position: -100% 0;\n  }\n}\n</style>\n","<script setup lang=\"ts\">\nconst computedThumbClasses = new Map([\n  [false, [\"\"]],\n  [true, [\"translate-x-[calc(100%-2px)]\"]],\n]);\n\nconst computedTrackClasses = new Map([\n  [false, [\"bg-pico-stroke-neutral \"]],\n  [true, [\"bg-pico-primary\"]],\n]);\n\nconst modelValue = defineModel<boolean>();\n\nconst toggleSwitch = () => {\n  modelValue.value = !modelValue.value;\n};\n</script>\n\n<template>\n  <div\n    @click=\"toggleSwitch\"\n    :class=\"computedTrackClasses.get(!!modelValue)\"\n    class=\"p-0.5 duration-300 min-w-10.5 rounded-full\"\n  >\n    <div\n      :class=\"computedThumbClasses.get(!!modelValue)\"\n      class=\"w-5 duration-300 will-change-transform aspect-square rounded-full bg-white\"\n    ></div>\n  </div>\n</template>\n\n<style lang=\"css\" scoped></style>\n","<script setup lang=\"ts\">\nexport interface PTextInputProps {\n  placeholder?: string;\n  isInvalid?: boolean;\n  disabled?: boolean;\n}\n\nconst { isInvalid = false, disabled = false } = defineProps<PTextInputProps>();\nconst computedClasses = new Map([\n  [true, [\"outline-pico-red! text-pico-red! bg-pico-light-red!\"]],\n  [false, []],\n]);\nconst model = defineModel();\n</script>\n\n<template>\n  <input\n    :disabled=\"disabled\"\n    type=\"text\"\n    v-model=\"model\"\n    :placeholder=\"placeholder\"\n    :class=\"computedClasses.get(isInvalid)\"\n    class=\"outline-pico-stroke-neutral outline-1 disabled:text-pico-caption/70 disabled:cursor-not-allowed text-pico-caption focus:text-pico-text bg-pico-light focus:bg-pico-white duration-300 focus:outline-pico-primary px-3 py-2 rounded-lg\"\n  />\n</template>\n\n<style lang=\"css\" scoped></style>\n","<template>\n  <div class=\"bg-pico-light w-full h-full\">\n    <slot />\n  </div>\n</template>\n","<script setup lang=\"ts\"></script>\r\n\r\n<template>\r\n  <div class=\"shadow-dark rounded-lg p-4 bg-white\">\r\n    <slot />\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped>\r\n\r\n</style>\r\n","\r\n<template>\r\n    <svg class=\"h-25 w-25 \"  viewBox=\"0 0 50 50\" xmlns=\"http://www.w3.org/2000/svg\">\r\n    <circle cx=\"25\" cy=\"25\" r=\"20\" fill=\"none\" stroke=\"#3b82f6\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-dasharray=\"90 150\" stroke-dashoffset=\"0\">\r\n    <animateTransform attributeName=\"transform\" type=\"rotate\" from=\"0 25 25\" to=\"360 25 25\" dur=\"1.5s\" repeatCount=\"indefinite\" />\r\n    <animate attributeName=\"stroke-dasharray\" values=\"1, 200; 90, 150; 90, 150\" keyTimes=\"0; 0.5; 1\" dur=\"2s\" repeatCount=\"indefinite\" />\r\n    <animate attributeName=\"stroke-dashoffset\" values=\"0; -100; -124\" keyTimes=\"0; 0.5; 1\" dur=\"2s\" repeatCount=\"indefinite\" />\r\n  </circle>\r\n  <circle cx=\"25\" cy=\"25\" r=\"20\" fill=\"none\" stroke=\"#13c8ec\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-dasharray=\"90 150\" stroke-dashoffset=\"0\">\r\n    <animateTransform attributeName=\"transform\" type=\"rotate\" from=\"0 25 25\" to=\"360 25 25\" dur=\"1.5s\" repeatCount=\"indefinite\" />\r\n    <animate attributeName=\"stroke-dasharray\" values=\"1, 200; 90, 150; 90, 150\" keyTimes=\"0; 0.5; 1\" dur=\"2s\" repeatCount=\"indefinite\" />\r\n    <animate attributeName=\"stroke-dashoffset\" values=\"0; -35; -124\" keyTimes=\"0; 0.5; 1\" dur=\"2s\" repeatCount=\"indefinite\" />\r\n  </circle>\r\n</svg>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport { computed } from 'vue';\r\nexport interface PSliderProps{\r\n    min: number,\r\n    max: number,\r\n    step: number\r\n}\r\nconst props = defineProps<PSliderProps>()\r\n\r\nconst value = defineModel({default: 0})\r\nconst percentage = computed(() => {\r\n  return ((value.value - props.min) / (props.max - props.min)) * 100;\r\n});\r\n</script>\r\n\r\n<template>\r\n        <div class=\"w-40 flex group  \">\r\n            <div class=\"h-2 rounded-xl w-full bg-pico-stroke-neutral relative\">\r\n                <input :min :max :step v-model=\"value\" type=\"range\" class=\" h-full opacity-0 absolute inset-y-0 -inset-x-2\"/>\r\n\r\n                <div class=\"h-2 rounded-xl bg-pico-primary  group-hover:bg-pico-primary/70 transition-colors duration-200 absolute left-0 pointer-events-none \" :style=\"{\r\n                width: percentage + '%'\r\n            }\" >\r\n            <div class=\"relative w-full h-full flex justify-end items-center pointer-events-none\">\r\n                <div class=\" absolute  h-5 w-5 border-2 border-white translate-x-1/2 transition-colors duration-200 bg-pico-primary rounded-full\">\r\n                    <div class=\"relative w-full h-full flex justify-center\">\r\n                        <div class=\"absolute bottom-[calc(100%+5px)] group-hover:opacity-100 opacity-0 duration-200 transition-opacity bg-pico-caption text-white px-2 rounded-lg text-xs py-0.5\">\r\n                            {{ value }}\r\n                        </div>\r\n\r\n                    </div>\r\n                </div>\r\n\r\n            </div>    \r\n        </div>\r\n            </div>\r\n            \r\n        </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped>\r\n\r\n</style>","import { reactive, readonly } from \"vue\"\r\n\r\n\r\nconst stack = reactive<{id: number, message: string, zIndex: number, duration: number}[]>([])\r\nlet zIndex = 1000\r\nexport const useToast = () => {\r\n\r\n    const addToast = (message: string, duration=3000) => {\r\n        const id = Date.now() + Math.random()\r\n        zIndex++\r\n        const savedIndex = zIndex\r\n        stack.push({id, message, zIndex:savedIndex, duration}) \r\n        const timeout = setTimeout(() => {\r\n            const index = stack.findIndex(t => t.id === id);\r\n            if (index !== -1) stack.splice(index, 1);\r\n            clearTimeout(timeout)\r\n        }, duration);\r\n    }\r\n    return {\r\n    stack: readonly(stack),\r\n    addToast,\r\n}\r\n\r\n}\r\n","<script setup lang=\"ts\">\r\nimport PIcon from '@/components/base/PIcon/PIcon.vue';\r\nimport type { PicoIconsNames } from '@/utils/IconsEnum';\r\n\r\nexport interface PTabProps {\r\n    isActive: boolean\r\n    label: string\r\n    icon?: PicoIconsNames\r\n    \r\n    \r\n}\r\nconst props = defineProps<PTabProps>()\r\n</script>\r\n\r\n<template>\r\n    \r\n    <div class=\"duration-200 flex flex-col   items-center justify-center cursor-pointer  select-none gap-3   \"\r\n    >\r\n       <div class=\"flex w-full gap-2 justify-center items-center\">\r\n        <PIcon v-if=\"icon\" :name=\"icon\" class=\"duration-200\" :class=\"{\r\n            'text-pico-primary!': isActive,\r\n            'text-pico-stroke-neutral': !isActive\r\n        }\" />\r\n        <p class=\"text-sm/none duration-200\" :class=\"{\r\n            'text-pico-caption!': !isActive,\r\n        }\"> {{ label }}</p>\r\n        \r\n       </div>\r\n       <div class=\" bg-pico-primary duration-200  h-0.5 rounded-full w-0\" \r\n         :class=\"{\r\n            'w-full!': isActive,\r\n\r\n         }\"></div>\r\n        \r\n</div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped>\r\n\r\n</style>","<script setup lang=\"ts\">\r\nimport PTab from '@/components/base/PTabs/components/PTab.vue';\r\nimport type { PicoIconsNames } from '@/utils/IconsEnum';\r\nimport { onMounted } from 'vue';\r\n\r\nexport interface TabOption {\r\n    value: number | string,\r\n    label: string\r\n    icon?: PicoIconsNames\r\n}\r\nexport interface PTabsProps {\r\n    options: TabOption[],\r\n    defaultOption?: string | number\r\n}\r\nconst props = defineProps<PTabsProps>()\r\n\r\nconst activeOption = defineModel<number | string>()\r\nconst changeOption = (value: number | string ) => {\r\n    activeOption.value = value\r\n}\r\nonMounted(() => {\r\n    if (props.defaultOption){\r\n        activeOption.value = props.defaultOption\r\n    }\r\n    else{\r\n        activeOption.value = props?.options[0]?.value\r\n    }\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n    <div class=\"flex   bg-white  gap-6  \">\r\n        <template v-for=\"option, _index in options\" :key=\"_index\">\r\n            <PTab  :is-active=\"option.value === activeOption\"  :label=\"option.label\" @click=\"changeOption(option.value)\" :icon=\"option.icon\" />\r\n        </template>\r\n    </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped>\r\n\r\n</style>"],"names":["computedVariant","computedSize","_createElementBlock","_normalizeClass","__props","_renderSlot","_ctx","_hoisted_1","render","_cache","_openBlock","_createElementVNode","CheckmarkIcon","PicoIcons","_createBlock","_resolveDynamicComponent","_unref","computedClasses","model","_useModel","$event","_createVNode","PIcon","value","errorMessage","useField","_mergeProps","_Fragment","_renderList","option","_toDisplayString","computedThumbClasses","computedTrackClasses","modelValue","toggleSwitch","props","percentage","computed","_hoisted_2","_normalizeStyle","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","stack","reactive","zIndex","useToast","addToast","message","duration","id","savedIndex","timeout","index","t","readonly","activeOption","changeOption","onMounted","_index","PTab"],"mappings":"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"}
+{"version":3,"file":"pico-ui.es.js","sources":["../src/components/base/PButton/PButton.vue","../src/assets/checkmark.svg","../src/utils/IconsEnum.ts","../src/components/base/PIcon/PIcon.vue","../src/components/base/PCheckboxInput/PCheckboxInput.vue","../src/components/base/PDivider/PDivider.vue","../src/components/base/PFormItem/PFormItem.vue","../src/components/base/PPlane/PPlane.vue","../src/components/base/PRadioInput/PRadioInput.vue","../src/components/base/PSkeleton/PSkeleton.vue","../src/components/base/PSwitchInput/PSwitchInput.vue","../src/components/base/PTextInput/PTextInput.vue","../src/components/PBackground/PBackgroud.vue","../src/components/base/PCard/PCard.vue","../src/components/base/PSpinner/PSpinner.vue","../src/components/base/PSlider/PSlider.vue","../src/composables/useToast.ts","../src/components/base/PTabs/components/PTab.vue","../src/components/base/PTabs/PTabs.vue","../src/components/base/PToastRenderer.vue/PToast.vue","../src/components/base/PToastRenderer.vue/PToastRenderer.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nconst { variant = \"primary\", size = \"medium\" } = defineProps<PButtonProps>();\r\n\r\nexport interface PButtonProps {\r\n  variant?: PButtonVariants;\r\n  size?: PButtonSizes;\r\n}\r\nexport type PButtonVariants =\r\n  | \"primary\"\r\n  | \"secondary\"\r\n  | \"outline\"\r\n  | \"ghost\"\r\n  | \"soft\";\r\nexport type PButtonSizes = \"large\" | \"medium\" | \"small\";\r\n\r\nconst computedVariant: Record<PButtonVariants, string[]> = {\r\n  primary: [\"bg-pico-primary\", \"text-white\", \"shadow-primary\"],\r\n  secondary: [\"bg-pico-secondary\", \"text-white\", \"shadow-secondary\"],\r\n  outline: [\"outline-2\", \"outline-pico-primary\", \"text-pico-primary\"],\r\n  ghost: [\r\n    \"text-pico-text-secondary\",\r\n    \"border-dashed border-2 border-pico-text-secondary/50\",\r\n  ],\r\n  soft: [\"bg-pico-primary/20\", \"text-pico-primary\"],\r\n};\r\n\r\nconst computedSize: Record<PButtonSizes, string[]> = {\r\n  large: [\"text-lg\", \"py-3.5\", \"px-8.5\"],\r\n  medium: [\"text-md\", \"py-2.5\", \"px-6\"],\r\n  small: [\"text-sm\", \"py-1.5\", \"px-4\"],\r\n};\r\n</script>\r\n\r\n<template>\r\n  <button\r\n    class=\"w-max h-max rounded-lg font-semibold hover:brightness-80 duration-300\"\r\n    :class=\"[computedVariant[variant], computedSize[size]]\"\r\n  >\r\n    <slot />\r\n  </button>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nconst _hoisted_1 = {\n  xmlns: \"http://www.w3.org/2000/svg\",\n  width: \"12\",\n  height: \"9\",\n  fill: \"none\"\n}\n\nexport function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", _hoisted_1, [...(_cache[0] || (_cache[0] = [\n    _createElementVNode(\"path\", {\n      fill: \"currentColor\",\n      d: \"M10.868.366a1.25 1.25 0 0 1 0 1.767l-6.25 6.25a1.25 1.25 0 0 1-1.767 0l-2.5-2.5a1.25 1.25 0 0 1 1.767-1.767l1.617 1.616L9.1.366a1.25 1.25 0 0 1 1.767 0\"\n    }, null, -1)\n  ]))]))\n}\nexport default { render: render }","import type { Component } from 'vue'\nimport CheckmarkIcon from '@/assets/checkmark.svg'\nexport type PicoIconsNames = 'checkmark'\n\nexport const PicoIcons: Record<PicoIconsNames, Component | string> = {\n  checkmark: CheckmarkIcon\n}\n","<script setup lang=\"ts\">\nimport { PicoIcons, type PicoIconsNames } from \"../../../utils/IconsEnum\";\nexport interface PIconProps {\n  name: PicoIconsNames;\n}\n\ndefineProps<PIconProps>();\n</script>\n\n<template>\n  <component :is=\"PicoIcons[name]\" />\n</template>\n\n<style lang=\"css\" scoped></style>\n","<script setup lang=\"ts\">\r\nimport PIcon from \"../PIcon/PIcon.vue\";\r\n\r\nexport interface PCheckboxInputProps {\r\n  disabled?: boolean;\r\n  isChecked?: boolean;\r\n}\r\n\r\nconst { disabled = false, isChecked = false } =\r\n  defineProps<PCheckboxInputProps>();\r\nconst computedClasses = new Map([\r\n  [false, [\"outline-2\"]],\r\n  [true, [\"bg-pico-primary\"]],\r\n]);\r\nconst model = defineModel<boolean>();\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    :class=\"computedClasses.get(isChecked)\"\r\n    class=\"outline-pico-border min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-sm\"\r\n  >\r\n    <input\r\n      class=\"opacity-0 inset-0 absolute\"\r\n      :disabled=\"disabled\"\r\n      type=\"checkbox\"\r\n      v-model=\"model\"\r\n    />\r\n    <PIcon\r\n      name=\"checkmark\"\r\n      class=\"text-white pointer-events-none\"\r\n      :class=\"{\r\n        'opacity-0': !isChecked,\r\n      }\"\r\n    />\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\">\r\nconst { orientation = \"horizontal\" } = defineProps<PDividerProps>();\r\n\r\nexport interface PDividerProps {\r\n  orientation?: \"vertical\" | \"horizontal\";\r\n}\r\n\r\nexport type PDividerOrientation = \"vertical\" | \"horizontal\";\r\n\r\nconst computedClasses: Record<PDividerOrientation, string[]> = {\r\n  vertical: [\"w-2px\", \"h-full\"],\r\n  horizontal: [\"h-2px\", \"w-full\"],\r\n};\r\n</script>\r\n\r\n<template>\r\n  <div class=\"bg-pico-border\" :class=\"computedClasses[orientation]\"></div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\">\r\nimport { useField } from \"vee-validate\";\r\nimport type { Component } from \"vue\";\r\n\r\nexport interface PFormItemProps {\r\n  component: Component;\r\n  props: Record<string, unknown>;\r\n  name: string;\r\n  inputClass?: string;\r\n  errorClass?: string;\r\n}\r\nconst { name } = defineProps<PFormItemProps>();\r\n\r\nconst { value, errorMessage } = useField(name, {});\r\n</script>\r\n\r\n<template>\r\n  <div class=\"flex flex-col items-start\">\r\n    <span\r\n      v-if=\"errorMessage\"\r\n      :class=\"errorClass\"\r\n      class=\"text-pico-error text-xs max-w-full mb-1\"\r\n      >{{ errorMessage }}</span\r\n    >\r\n    <component\r\n      :class=\"inputClass\"\r\n      class=\"max-w-max\"\r\n      :is-invalid=\"!!errorMessage\"\r\n      v-model=\"value\"\r\n      :is=\"component\"\r\n      :name=\"name\"\r\n      v-bind=\"props\"\r\n    ></component>\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\"></script>\r\n\r\n<template>\r\n  <div class=\"rounded-lg p-8 bg-pico-bg-elevated outline-pico-border outline-2\">\r\n    <slot />\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\">\r\nexport interface PRadioInputProps {\r\n  disabled?: boolean;\r\n  name: string;\r\n  isChecked?: boolean;\r\n}\r\n\r\nexport type PRadioOptionItem = { value: string; label: string };\r\n\r\nconst { disabled = false, isChecked = false } = defineProps<PRadioInputProps>();\r\nconst computedClasses = new Map([\r\n  [false, [\"outline-2 -outline-offset-2\"]],\r\n  [true, [\"bg-pico-primary\"]],\r\n]);\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    :class=\"computedClasses.get(isChecked)\"\r\n    class=\"outline-pico-border min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-full\"\r\n  >\r\n    <input\r\n      type=\"radio\"\r\n      class=\"opacity-0 inset-0 absolute\"\r\n      :disabled=\"disabled\"\r\n    />\r\n    <div\r\n      class=\"w-2 h-2 bg-white rounded-full pointer-events-none\"\r\n      :class=\"{\r\n        'opacity-0': !isChecked,\r\n      }\"\r\n    />\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<template>\r\n  <div class=\"w-full h-full rounded-sm pico-skeleton\" />\r\n</template>\r\n\r\n<style lang=\"css\" scoped>\r\n.pico-skeleton {\r\n  background: linear-gradient(\r\n    70deg,\r\n    var(--color-pico-border) 30%,\r\n    var(--color-pico-skeleton-glow),\r\n    var(--color-pico-border) 70%\r\n  );\r\n  background-size: 200% 100%;\r\n  animation: skeleton 1.5s infinite linear;\r\n}\r\n\r\n@keyframes skeleton {\r\n  0% {\r\n    background-position: 100% 0;\r\n  }\r\n  100% {\r\n    background-position: -100% 0;\r\n  }\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\nconst computedThumbClasses = new Map([\r\n  [false, [\"\"]],\r\n  [true, [\"translate-x-[calc(100%-2px)]\"]],\r\n]);\r\n\r\nconst computedTrackClasses = new Map([\r\n  [false, [\"bg-pico-border \"]],\r\n  [true, [\"bg-pico-primary\"]],\r\n]);\r\n\r\nconst modelValue = defineModel<boolean>();\r\n\r\nconst toggleSwitch = () => {\r\n  modelValue.value = !modelValue.value;\r\n};\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    @click=\"toggleSwitch\"\r\n    :class=\"computedTrackClasses.get(!!modelValue)\"\r\n    class=\"p-0.5 duration-300 min-w-10.5 rounded-full\"\r\n  >\r\n    <div\r\n      :class=\"computedThumbClasses.get(!!modelValue)\"\r\n      class=\"w-5 duration-300 will-change-transform aspect-square rounded-full bg-white\"\r\n    ></div>\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\">\r\nexport interface PTextInputProps {\r\n  placeholder?: string;\r\n  isInvalid?: boolean;\r\n  disabled?: boolean;\r\n}\r\ndefineOptions({ inheritAttrs: false });\r\n\r\nconst props = defineProps<PTextInputProps>();\r\nconst computedClasses = new Map([\r\n  [true, [\"outline-pico-error! text-pico-error! bg-pico-error-bg!\"]],\r\n  [false, []],\r\n]);\r\nconst model = defineModel();\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    tabindex=\"0\"\r\n    class=\"outline-pico-border outline-1 focus-within:outline-pico-primary text-pico-text-secondary focus-within:text-pico-text bg-pico-input-bg duration-300 focus-within:outline-pico-primary px-3 py-2 rounded-lg\"\r\n    :class=\"[\r\n      computedClasses.get(isInvalid),\r\n      {\r\n        'cursor-not-allowed! text-pico-text-secondary/70!': disabled,\r\n      },\r\n    ]\"\r\n  >\r\n    <slot v-if=\"$slots.start\" name=\"start\" />\r\n    <input\r\n      v-bind=\"$attrs\"\r\n      :disabled=\"disabled\"\r\n      v-model=\"model\"\r\n      :placeholder=\"placeholder\"\r\n      class=\"group outline-0!\"\r\n    />\r\n    <slot v-if=\"$slots.end\" name=\"end\" />\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<template>\r\n  <div class=\"bg-pico-bg w-full h-full\">\r\n    <slot />\r\n  </div>\r\n</template>\r\n","<script setup lang=\"ts\"></script>\r\n\r\n<template>\r\n  <div class=\"rounded-lg p-4 bg-pico-bg-elevated\">\r\n    <slot />\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<template>\r\n  <svg class=\"h-25 w-25\" viewBox=\"0 0 50 50\" xmlns=\"http://www.w3.org/2000/svg\">\r\n    <circle\r\n      cx=\"25\"\r\n      cy=\"25\"\r\n      r=\"20\"\r\n      fill=\"none\"\r\n      stroke=\"var(--color-pico-secondary)\"\r\n      stroke-width=\"4\"\r\n      stroke-linecap=\"round\"\r\n      stroke-dasharray=\"90 150\"\r\n      stroke-dashoffset=\"0\"\r\n    >\r\n      <animateTransform\r\n        attributeName=\"transform\"\r\n        type=\"rotate\"\r\n        from=\"0 25 25\"\r\n        to=\"360 25 25\"\r\n        dur=\"1.5s\"\r\n        repeatCount=\"indefinite\"\r\n      />\r\n      <animate\r\n        attributeName=\"stroke-dasharray\"\r\n        values=\"1, 200; 90, 150; 90, 150\"\r\n        keyTimes=\"0; 0.5; 1\"\r\n        dur=\"2s\"\r\n        repeatCount=\"indefinite\"\r\n      />\r\n      <animate\r\n        attributeName=\"stroke-dashoffset\"\r\n        values=\"0; -100; -124\"\r\n        keyTimes=\"0; 0.5; 1\"\r\n        dur=\"2s\"\r\n        repeatCount=\"indefinite\"\r\n      />\r\n    </circle>\r\n    <circle\r\n      cx=\"25\"\r\n      cy=\"25\"\r\n      r=\"20\"\r\n      fill=\"none\"\r\n      stroke=\"var(--color-pico-primary)\"\r\n      stroke-width=\"4\"\r\n      stroke-linecap=\"round\"\r\n      stroke-dasharray=\"90 150\"\r\n      stroke-dashoffset=\"0\"\r\n    >\r\n      <animateTransform\r\n        attributeName=\"transform\"\r\n        type=\"rotate\"\r\n        from=\"0 25 25\"\r\n        to=\"360 25 25\"\r\n        dur=\"1.5s\"\r\n        repeatCount=\"indefinite\"\r\n      />\r\n      <animate\r\n        attributeName=\"stroke-dasharray\"\r\n        values=\"1, 200; 90, 150; 90, 150\"\r\n        keyTimes=\"0; 0.5; 1\"\r\n        dur=\"2s\"\r\n        repeatCount=\"indefinite\"\r\n      />\r\n      <animate\r\n        attributeName=\"stroke-dashoffset\"\r\n        values=\"0; -35; -124\"\r\n        keyTimes=\"0; 0.5; 1\"\r\n        dur=\"2s\"\r\n        repeatCount=\"indefinite\"\r\n      />\r\n    </circle>\r\n  </svg>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport { computed } from \"vue\";\r\nexport interface PSliderProps {\r\n  min: number;\r\n  max: number;\r\n  step: number;\r\n}\r\nconst props = defineProps<PSliderProps>();\r\n\r\nconst value = defineModel({ default: 0 });\r\nconst percentage = computed(() => {\r\n  return ((value.value - props.min) / (props.max - props.min)) * 100;\r\n});\r\n</script>\r\n\r\n<template>\r\n  <div class=\"w-40 flex group\">\r\n    <div class=\"h-2 rounded-xl w-full bg-pico-border relative\">\r\n      <input\r\n        :min\r\n        :max\r\n        :step\r\n        v-model=\"value\"\r\n        type=\"range\"\r\n        class=\"h-full opacity-0 absolute inset-y-0 -inset-x-2\"\r\n      />\r\n\r\n      <div\r\n        class=\"h-2 rounded-xl bg-pico-primary group-hover:bg-pico-primary/70 transition-colors duration-200 absolute left-0 pointer-events-none\"\r\n        :style=\"{\r\n          width: percentage + '%',\r\n        }\"\r\n      >\r\n        <div\r\n          class=\"relative w-full h-full flex justify-end items-center pointer-events-none\"\r\n        >\r\n          <div\r\n            class=\"absolute h-5 w-5 border-2 border-white translate-x-1/2 transition-colors duration-200 bg-pico-primary rounded-full\"\r\n          >\r\n            <div class=\"relative w-full h-full flex justify-center\">\r\n              <div\r\n                class=\"absolute bottom-[calc(100%+5px)] group-hover:opacity-100 opacity-0 duration-200 transition-opacity bg-pico-text-secondary text-white px-2 rounded-lg text-xs py-0.5\"\r\n              >\r\n                {{ value }}\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","import { reactive, readonly } from \"vue\"\r\n\r\n\r\nconst stack = reactive<{id: number, message: string, zIndex: number, duration: number}[]>([])\r\nlet zIndex = 1000\r\nexport const useToast = () => {\r\n\r\n    const addToast = (message: string, duration=3000) => {\r\n        const id = Date.now() + Math.random()\r\n        zIndex++\r\n        const savedIndex = zIndex\r\n        stack.push({id, message, zIndex:savedIndex, duration}) \r\n        const timeout = setTimeout(() => {\r\n            const index = stack.findIndex(t => t.id === id);\r\n            if (index !== -1) stack.splice(index, 1);\r\n            clearTimeout(timeout)\r\n        }, duration);\r\n    }\r\n    return {\r\n    stack: readonly(stack),\r\n    addToast,\r\n}\r\n\r\n}\r\n","<script setup lang=\"ts\">\r\nimport PIcon from \"@/components/base/PIcon/PIcon.vue\";\r\nimport type { PicoIconsNames } from \"@/utils/IconsEnum\";\r\n\r\nexport interface PTabProps {\r\n  isActive: boolean;\r\n  label: string;\r\n  icon?: PicoIconsNames;\r\n}\r\nconst props = defineProps<PTabProps>();\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    class=\"duration-200 flex flex-col items-center justify-center cursor-pointer select-none gap-3\"\r\n  >\r\n    <div class=\"flex w-full gap-2 justify-center items-center\">\r\n      <PIcon\r\n        v-if=\"icon\"\r\n        :name=\"icon\"\r\n        class=\"duration-200\"\r\n        :class=\"{\r\n          'text-pico-primary!': isActive,\r\n          'text-pico-border': !isActive,\r\n        }\"\r\n      />\r\n      <p\r\n        class=\"text-sm/none text-pico-text duration-200\"\r\n        :class=\"{\r\n          'text-pico-text-secondary!': !isActive,\r\n        }\"\r\n      >\r\n        {{ label }}\r\n      </p>\r\n    </div>\r\n    <div\r\n      class=\"bg-pico-primary duration-200 h-0.5 rounded-full w-0\"\r\n      :class=\"{\r\n        'w-full!': isActive,\r\n      }\"\r\n    ></div>\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\">\r\nimport PTab from \"@/components/base/PTabs/components/PTab.vue\";\r\nimport type { PicoIconsNames } from \"@/utils/IconsEnum\";\r\nimport { onMounted } from \"vue\";\r\n\r\nexport interface TabOption {\r\n  value: number | string;\r\n  label: string;\r\n  icon?: PicoIconsNames;\r\n}\r\nexport interface PTabsProps {\r\n  options: TabOption[];\r\n  defaultOption?: string | number;\r\n}\r\nconst props = defineProps<PTabsProps>();\r\n\r\nconst activeOption = defineModel<number | string>();\r\nconst changeOption = (value: number | string) => {\r\n  activeOption.value = value;\r\n};\r\nonMounted(() => {\r\n  if (props.defaultOption) {\r\n    activeOption.value = props.defaultOption;\r\n  } else {\r\n    activeOption.value = props?.options[0]?.value;\r\n  }\r\n});\r\n</script>\r\n\r\n<template>\r\n  <div class=\"flex gap-6\">\r\n    <template v-for=\"(option, _index) in options\" :key=\"_index\">\r\n      <PTab\r\n        :is-active=\"option.value === activeOption\"\r\n        :label=\"option.label\"\r\n        @click=\"changeOption(option.value)\"\r\n        :icon=\"option.icon\"\r\n      />\r\n    </template>\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\">\r\ndefineProps<{\r\n  toast: {\r\n    id: number;\r\n    message: string;\r\n    zIndex: number;\r\n    duration: number;\r\n  };\r\n}>();\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    class=\"rounded-lg p-2 bg-pico-bg-elevated outline-pico-border text-pico-text/90 outline-2 flex flex-col max-w-max gap-1 pointer-events-auto\"\r\n    :style=\"{ zIndex: toast.zIndex }\"\r\n  >\r\n    <div class=\"line-clamp-2 max-w-[300px] select-none\">\r\n      {{ toast.message }}\r\n    </div>\r\n    <div\r\n      class=\"h-1 bg-pico-primary pico-toast rounded-full\"\r\n      :style=\"{ '--toast-duration': toast.duration + 'ms' }\"\r\n    ></div>\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped>\r\n.pico-toast {\r\n  animation: 1 alternate var(--toast-duration) toast;\r\n}\r\n@keyframes toast {\r\n  from {\r\n    width: 0px;\r\n  }\r\n  to {\r\n    width: 100%;\r\n  }\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\nimport PToast from \"@/components/base/PToastRenderer.vue/PToast.vue\";\r\nimport { useToast } from \"@/composables/useToast\";\r\n\r\nconst { stack } = useToast();\r\n\r\nexport type ToastPlacement =\r\n  | \"top-left\"\r\n  | \"top-right\"\r\n  | \"bottom-left\"\r\n  | \"bottom-right\"\r\n  | \"top-center\"\r\n  | \"bottom-center\";\r\n\r\nexport interface PToastRendererProps {\r\n  placement?: ToastPlacement;\r\n}\r\nconst stackPlacementMap: Record<ToastPlacement, string> = {\r\n  \"top-left\": \"top-5 left-5\",\r\n  \"top-right\": \"top-5 right-5\",\r\n  \"bottom-left\": \"bottom-5 left-5\",\r\n  \"bottom-right\": \"bottom-5 right-5\",\r\n  \"top-center\": \"top-5 left-1/2 -translate-x-1/2\",\r\n  \"bottom-center\": \"bottom-5 left-1/2 -translate-x-1/2\",\r\n};\r\n\r\nconst { placement = \"top-right\" } = defineProps<PToastRendererProps>();\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    class=\"fixed z-9999 flex flex-col items-end gap-2 pointer-events-none\"\r\n    :class=\"stackPlacementMap[placement]\"\r\n  >\r\n    <TransitionGroup name=\"list\">\r\n      <PToast v-for=\"toast in stack\" :key=\"toast.id\" :toast=\"toast\" />\r\n    </TransitionGroup>\r\n  </div>\r\n</template>\r\n\r\n<style scoped>\r\n.list-move,\r\n.list-enter-active,\r\n.list-leave-active {\r\n  transition: all 0.5s ease;\r\n}\r\n\r\n.list-enter-from,\r\n.list-leave-to {\r\n  opacity: 0;\r\n  transform: translateX(30px);\r\n}\r\n\r\n.list-leave-active {\r\n  position: absolute;\r\n}\r\n</style>\r\n"],"names":["computedVariant","computedSize","_createElementBlock","_normalizeClass","__props","_renderSlot","_ctx","_hoisted_1","render","_cache","_openBlock","_createElementVNode","CheckmarkIcon","PicoIcons","_createBlock","_resolveDynamicComponent","_unref","computedClasses","model","_useModel","$event","_createVNode","PIcon","value","errorMessage","useField","_mergeProps","computedThumbClasses","computedTrackClasses","modelValue","toggleSwitch","$slots","props","percentage","computed","_hoisted_2","_normalizeStyle","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_toDisplayString","stack","reactive","zIndex","useToast","addToast","message","duration","id","savedIndex","timeout","index","t","readonly","activeOption","changeOption","onMounted","_Fragment","_renderList","option","_index","PTab","stackPlacementMap","_TransitionGroup","toast","PToast"],"mappings":"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"}

package/dist/pico-ui.umd.js

@@ -1,2 +1,2 @@
-(function(l,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("vee-validate")):typeof define=="function"&&define.amd?define(["exports","vue","vee-validate"],e):(l=typeof globalThis<"u"?globalThis:l||self,e(l["pico-ui"]={},l.Vue,l.veeValidate))})(this,(function(l,e,k){"use strict";const y=e.defineComponent({__name:"PButton",props:{variant:{default:"primary"},size:{default:"medium"}},setup(t){const o={primary:["bg-pico-primary","text-white","shadow-primary"],secondary:["bg-pico-secondary","text-white","shadow-secondary"],outline:["outline-2","outline-pico-primary","text-pico-primary"],ghost:["text-pico-gray","border-dashed border-2 border-pico-gray/50"],soft:["bg-pico-primary/20","text-pico-primary"]},n={large:["text-lg","py-3.5","px-8.5"],medium:["text-md","py-2.5","px-6"],small:["text-sm","py-1.5","px-4"]};return(s,a)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["w-max h-max rounded-lg font-semibold hover:brightness-80 duration-300",[o[t.variant],n[t.size]]])},[e.renderSlot(s.$slots,"default")],2))}}),b={xmlns:"http://www.w3.org/2000/svg",width:"12",height:"9",fill:"none"};function g(t,o){return e.openBlock(),e.createElementBlock("svg",b,[...o[0]||(o[0]=[e.createElementVNode("path",{fill:"currentColor",d:"M10.868.366a1.25 1.25 0 0 1 0 1.767l-6.25 6.25a1.25 1.25 0 0 1-1.767 0l-2.5-2.5a1.25 1.25 0 0 1 1.767-1.767l1.617 1.616L9.1.366a1.25 1.25 0 0 1 1.767 0"},null,-1)])])}const u={checkmark:{render:g}},m=e.defineComponent({__name:"PIcon",props:{name:{}},setup(t){return(o,n)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(u)[t.name])))}}),x=["disabled"],_=e.defineComponent({__name:"PCheckboxInput",props:e.mergeModels({disabled:{type:Boolean,default:!1}},{modelValue:{type:Boolean},modelModifiers:{}}),emits:["update:modelValue"],setup(t){const o=new Map([[!1,["outline-2"]],[!0,["bg-pico-primary"]]]),n=e.useModel(t,"modelValue");return(s,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([e.unref(o).get(!!n.value),"outline-pico-stroke-neutral min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-sm"])},[e.withDirectives(e.createElementVNode("input",{class:"opacity-0 inset-0 absolute",disabled:t.disabled,type:"checkbox","onUpdate:modelValue":a[0]||(a[0]=i=>n.value=i)},null,8,x),[[e.vModelCheckbox,n.value]]),e.createVNode(m,{name:"checkmark",class:"text-white"})],2))}}),w=e.defineComponent({__name:"PDivider",props:{orientation:{default:"horizontal"}},setup(t){const o={vertical:["w-2px","h-full"],horizontal:["h-2px","w-full"]};return(n,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["bg-pico-stroke-neutral",o[t.orientation]])},null,2))}}),B={class:"flex flex-col items-start"},C=e.defineComponent({__name:"PFormItem",props:{component:{},props:{},name:{},inputClass:{},errorClass:{}},setup(t){const{value:o,errorMessage:n}=k.useField(t.name,{});return(s,a)=>(e.openBlock(),e.createElementBlock("div",B,[e.unref(n)?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass([t.errorClass,"text-pico-red text-xs max-w-full mb-1"])},e.toDisplayString(e.unref(n)),3)):e.createCommentVNode("",!0),(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.component),e.mergeProps({class:[t.inputClass,"max-w-max"],"is-invalid":!!e.unref(n),modelValue:e.unref(o),"onUpdate:modelValue":a[0]||(a[0]=i=>e.isRef(o)?o.value=i:null),name:t.name},t.props),null,16,["class","is-invalid","modelValue","name"]))]))}}),c=(t,o)=>{const n=t.__vccOpts||t;for(const[s,a]of o)n[s]=a;return n},V={},P={class:"rounded-lg p-8 bg-white outline-pico-stroke-neutral outline-2"};function $(t,o){return e.openBlock(),e.createElementBlock("div",P,[e.renderSlot(t.$slots,"default")])}const E=c(V,[["render",$]]),M={class:"flex gap-2"},N=["value","disabled"],T=e.defineComponent({__name:"PRadioInput",props:e.mergeModels({disabled:{type:Boolean,default:!1},name:{},options:{}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(t){const o=new Map([[!1,["outline-2 -outline-offset-2"]],[!0,["bg-pico-primary"]]]),n=e.useModel(t,"modelValue");return(s,a)=>(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,i=>(e.openBlock(),e.createElementBlock("div",M,[e.createElementVNode("div",{class:e.normalizeClass([e.unref(o).get(n.value===i.value),"outline-pico-stroke-neutral min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-full"])},[e.withDirectives(e.createElementVNode("input",{type:"radio",value:i.value,class:"opacity-0 inset-0 absolute",disabled:t.disabled,"onUpdate:modelValue":a[0]||(a[0]=r=>n.value=r)},null,8,N),[[e.vModelRadio,n.value]]),a[1]||(a[1]=e.createElementVNode("div",{class:"w-2 h-2 bg-white rounded-full"},null,-1))],2),e.createElementVNode("p",null,e.toDisplayString(i.label),1)]))),256))}}),I={},S={class:"w-full h-full rounded-sm pico-skeleton"};function z(t,o){return e.openBlock(),e.createElementBlock("div",S)}const D=c(I,[["render",z],["__scopeId","data-v-7ff1dee9"]]),j=e.defineComponent({__name:"PSwitchInput",props:{modelValue:{type:Boolean},modelModifiers:{}},emits:["update:modelValue"],setup(t){const o=new Map([[!1,[""]],[!0,["translate-x-[calc(100%-2px)]"]]]),n=new Map([[!1,["bg-pico-stroke-neutral "]],[!0,["bg-pico-primary"]]]),s=e.useModel(t,"modelValue"),a=()=>{s.value=!s.value};return(i,r)=>(e.openBlock(),e.createElementBlock("div",{onClick:a,class:e.normalizeClass([e.unref(n).get(!!s.value),"p-0.5 duration-300 min-w-10.5 rounded-full"])},[e.createElementVNode("div",{class:e.normalizeClass([e.unref(o).get(!!s.value),"w-5 duration-300 will-change-transform aspect-square rounded-full bg-white"])},null,2)],2))}}),O=["disabled","placeholder"],A=e.defineComponent({__name:"PTextInput",props:e.mergeModels({placeholder:{},isInvalid:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(t){const o=new Map([[!0,["outline-pico-red! text-pico-red! bg-pico-light-red!"]],[!1,[]]]),n=e.useModel(t,"modelValue");return(s,a)=>e.withDirectives((e.openBlock(),e.createElementBlock("input",{disabled:t.disabled,type:"text","onUpdate:modelValue":a[0]||(a[0]=i=>n.value=i),placeholder:t.placeholder,class:e.normalizeClass([e.unref(o).get(t.isInvalid),"outline-pico-stroke-neutral outline-1 disabled:text-pico-caption/70 disabled:cursor-not-allowed text-pico-caption focus:text-pico-text bg-pico-light focus:bg-pico-white duration-300 focus:outline-pico-primary px-3 py-2 rounded-lg"])},null,10,O)),[[e.vModelText,n.value]])}}),F={},U={class:"bg-pico-light w-full h-full"};function R(t,o){return e.openBlock(),e.createElementBlock("div",U,[e.renderSlot(t.$slots,"default")])}const q=c(F,[["render",R]]),L={},G={class:"shadow-dark rounded-lg p-4 bg-white"};function H(t,o){return e.openBlock(),e.createElementBlock("div",G,[e.renderSlot(t.$slots,"default")])}const J=c(L,[["render",H]]),K={},Q={class:"h-25 w-25",viewBox:"0 0 50 50",xmlns:"http://www.w3.org/2000/svg"};function W(t,o){return e.openBlock(),e.createElementBlock("svg",Q,[...o[0]||(o[0]=[e.createStaticVNode('<circle cx="25" cy="25" r="20" fill="none" stroke="#3b82f6" stroke-width="4" stroke-linecap="round" stroke-dasharray="90 150" stroke-dashoffset="0"><animateTransform attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="1.5s" repeatCount="indefinite"></animateTransform><animate attributeName="stroke-dasharray" values="1, 200; 90, 150; 90, 150" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate><animate attributeName="stroke-dashoffset" values="0; -100; -124" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate></circle><circle cx="25" cy="25" r="20" fill="none" stroke="#13c8ec" stroke-width="4" stroke-linecap="round" stroke-dasharray="90 150" stroke-dashoffset="0"><animateTransform attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="1.5s" repeatCount="indefinite"></animateTransform><animate attributeName="stroke-dasharray" values="1, 200; 90, 150; 90, 150" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate><animate attributeName="stroke-dashoffset" values="0; -35; -124" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate></circle>',2)])])}const X=c(K,[["render",W]]),Y={class:"w-40 flex group"},Z={class:"h-2 rounded-xl w-full bg-pico-stroke-neutral relative"},v=["min","max","step"],ee={class:"relative w-full h-full flex justify-end items-center pointer-events-none"},te={class:"absolute h-5 w-5 border-2 border-white translate-x-1/2 transition-colors duration-200 bg-pico-primary rounded-full"},oe={class:"relative w-full h-full flex justify-center"},ne={class:"absolute bottom-[calc(100%+5px)] group-hover:opacity-100 opacity-0 duration-200 transition-opacity bg-pico-caption text-white px-2 rounded-lg text-xs py-0.5"},le=e.defineComponent({__name:"PSlider",props:e.mergeModels({min:{},max:{},step:{}},{modelValue:{default:0},modelModifiers:{}}),emits:["update:modelValue"],setup(t){const o=t,n=e.useModel(t,"modelValue"),s=e.computed(()=>(n.value-o.min)/(o.max-o.min)*100);return(a,i)=>(e.openBlock(),e.createElementBlock("div",Y,[e.createElementVNode("div",Z,[e.withDirectives(e.createElementVNode("input",{min:t.min,max:t.max,step:t.step,"onUpdate:modelValue":i[0]||(i[0]=r=>n.value=r),type:"range",class:"h-full opacity-0 absolute inset-y-0 -inset-x-2"},null,8,v),[[e.vModelText,n.value]]),e.createElementVNode("div",{class:"h-2 rounded-xl bg-pico-primary group-hover:bg-pico-primary/70 transition-colors duration-200 absolute left-0 pointer-events-none",style:e.normalizeStyle({width:s.value+"%"})},[e.createElementVNode("div",ee,[e.createElementVNode("div",te,[e.createElementVNode("div",oe,[e.createElementVNode("div",ne,e.toDisplayString(n.value),1)])])])],4)])]))}}),d=e.reactive([]);let f=1e3;const ae=()=>{const t=(o,n=3e3)=>{const s=Date.now()+Math.random();f++;const a=f;d.push({id:s,message:o,zIndex:a,duration:n});const i=setTimeout(()=>{const r=d.findIndex(p=>p.id===s);r!==-1&&d.splice(r,1),clearTimeout(i)},n)};return{stack:e.readonly(d),addToast:t}},se={class:"duration-200 flex flex-col items-center justify-center cursor-pointer select-none gap-3"},ie={class:"flex w-full gap-2 justify-center items-center"},h=e.defineComponent({__name:"PTab",props:{isActive:{type:Boolean},label:{},icon:{}},setup(t){return(o,n)=>(e.openBlock(),e.createElementBlock("div",se,[e.createElementVNode("div",ie,[t.icon?(e.openBlock(),e.createBlock(m,{key:0,name:t.icon,class:e.normalizeClass(["duration-200",{"text-pico-primary!":t.isActive,"text-pico-stroke-neutral":!t.isActive}])},null,8,["name","class"])):e.createCommentVNode("",!0),e.createElementVNode("p",{class:e.normalizeClass(["text-sm/none duration-200",{"text-pico-caption!":!t.isActive}])},e.toDisplayString(t.label),3)]),e.createElementVNode("div",{class:e.normalizeClass(["bg-pico-primary duration-200 h-0.5 rounded-full w-0",{"w-full!":t.isActive}])},null,2)]))}}),re={class:"flex bg-white gap-6"},ce=e.defineComponent({__name:"PTabs",props:e.mergeModels({options:{},defaultOption:{}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(t){const o=t,n=e.useModel(t,"modelValue"),s=a=>{n.value=a};return e.onMounted(()=>{o.defaultOption?n.value=o.defaultOption:n.value=o?.options[0]?.value}),(a,i)=>(e.openBlock(),e.createElementBlock("div",re,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,(r,p)=>(e.openBlock(),e.createBlock(h,{key:p,"is-active":r.value===n.value,label:r.label,onClick:me=>s(r.value),icon:r.icon},null,8,["is-active","label","onClick","icon"]))),128))]))}});l.PBackgroud=q,l.PButton=y,l.PCard=J,l.PCheckboxInput=_,l.PDivider=w,l.PFormItem=C,l.PIcon=m,l.PPlane=E,l.PRadioInput=T,l.PSkeleton=D,l.PSlider=le,l.PSpinner=X,l.PSwitchInput=j,l.PTab=h,l.PTabs=ce,l.PTextInput=A,l.PicoIcons=u,l.useToast=ae,Object.defineProperty(l,Symbol.toStringTag,{value:"Module"})}));
+(function(a,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("vee-validate")):typeof define=="function"&&define.amd?define(["exports","vue","vee-validate"],e):(a=typeof globalThis<"u"?globalThis:a||self,e(a["pico-ui"]={},a.Vue,a.veeValidate))})(this,(function(a,e,b){"use strict";const y=e.defineComponent({__name:"PButton",props:{variant:{default:"primary"},size:{default:"medium"}},setup(t){const o={primary:["bg-pico-primary","text-white","shadow-primary"],secondary:["bg-pico-secondary","text-white","shadow-secondary"],outline:["outline-2","outline-pico-primary","text-pico-primary"],ghost:["text-pico-text-secondary","border-dashed border-2 border-pico-text-secondary/50"],soft:["bg-pico-primary/20","text-pico-primary"]},n={large:["text-lg","py-3.5","px-8.5"],medium:["text-md","py-2.5","px-6"],small:["text-sm","py-1.5","px-4"]};return(l,s)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["w-max h-max rounded-lg font-semibold hover:brightness-80 duration-300",[o[t.variant],n[t.size]]])},[e.renderSlot(l.$slots,"default")],2))}}),x={xmlns:"http://www.w3.org/2000/svg",width:"12",height:"9",fill:"none"};function g(t,o){return e.openBlock(),e.createElementBlock("svg",x,[...o[0]||(o[0]=[e.createElementVNode("path",{fill:"currentColor",d:"M10.868.366a1.25 1.25 0 0 1 0 1.767l-6.25 6.25a1.25 1.25 0 0 1-1.767 0l-2.5-2.5a1.25 1.25 0 0 1 1.767-1.767l1.617 1.616L9.1.366a1.25 1.25 0 0 1 1.767 0"},null,-1)])])}const f={checkmark:{render:g}},m=e.defineComponent({__name:"PIcon",props:{name:{}},setup(t){return(o,n)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(f)[t.name])))}}),_=["disabled"],C=e.defineComponent({__name:"PCheckboxInput",props:e.mergeModels({disabled:{type:Boolean,default:!1},isChecked:{type:Boolean,default:!1}},{modelValue:{type:Boolean},modelModifiers:{}}),emits:["update:modelValue"],setup(t){const o=new Map([[!1,["outline-2"]],[!0,["bg-pico-primary"]]]),n=e.useModel(t,"modelValue");return(l,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([e.unref(o).get(t.isChecked),"outline-pico-border min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-sm"])},[e.withDirectives(e.createElementVNode("input",{class:"opacity-0 inset-0 absolute",disabled:t.disabled,type:"checkbox","onUpdate:modelValue":s[0]||(s[0]=r=>n.value=r)},null,8,_),[[e.vModelCheckbox,n.value]]),e.createVNode(m,{name:"checkmark",class:e.normalizeClass(["text-white pointer-events-none",{"opacity-0":!t.isChecked}])},null,8,["class"])],2))}}),B=e.defineComponent({__name:"PDivider",props:{orientation:{default:"horizontal"}},setup(t){const o={vertical:["w-2px","h-full"],horizontal:["h-2px","w-full"]};return(n,l)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["bg-pico-border",o[t.orientation]])},null,2))}}),w={class:"flex flex-col items-start"},V=e.defineComponent({__name:"PFormItem",props:{component:{},props:{},name:{},inputClass:{},errorClass:{}},setup(t){const{value:o,errorMessage:n}=b.useField(t.name,{});return(l,s)=>(e.openBlock(),e.createElementBlock("div",w,[e.unref(n)?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass([t.errorClass,"text-pico-error text-xs max-w-full mb-1"])},e.toDisplayString(e.unref(n)),3)):e.createCommentVNode("",!0),(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.component),e.mergeProps({class:[t.inputClass,"max-w-max"],"is-invalid":!!e.unref(n),modelValue:e.unref(o),"onUpdate:modelValue":s[0]||(s[0]=r=>e.isRef(o)?o.value=r:null),name:t.name},t.props),null,16,["class","is-invalid","modelValue","name"]))]))}}),c=(t,o)=>{const n=t.__vccOpts||t;for(const[l,s]of o)n[l]=s;return n},$={},P={class:"rounded-lg p-8 bg-pico-bg-elevated outline-pico-border outline-2"};function E(t,o){return e.openBlock(),e.createElementBlock("div",P,[e.renderSlot(t.$slots,"default")])}const N=c($,[["render",E]]),T=["disabled"],M=e.defineComponent({__name:"PRadioInput",props:{disabled:{type:Boolean,default:!1},name:{},isChecked:{type:Boolean,default:!1}},setup(t){const o=new Map([[!1,["outline-2 -outline-offset-2"]],[!0,["bg-pico-primary"]]]);return(n,l)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([e.unref(o).get(t.isChecked),"outline-pico-border min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-full"])},[e.createElementVNode("input",{type:"radio",class:"opacity-0 inset-0 absolute",disabled:t.disabled},null,8,T),e.createElementVNode("div",{class:e.normalizeClass(["w-2 h-2 bg-white rounded-full pointer-events-none",{"opacity-0":!t.isChecked}])},null,2)],2))}}),z={},I={class:"w-full h-full rounded-sm pico-skeleton"};function S(t,o){return e.openBlock(),e.createElementBlock("div",I)}const D=c(z,[["render",S],["__scopeId","data-v-caab53ad"]]),j=e.defineComponent({__name:"PSwitchInput",props:{modelValue:{type:Boolean},modelModifiers:{}},emits:["update:modelValue"],setup(t){const o=new Map([[!1,[""]],[!0,["translate-x-[calc(100%-2px)]"]]]),n=new Map([[!1,["bg-pico-border "]],[!0,["bg-pico-primary"]]]),l=e.useModel(t,"modelValue"),s=()=>{l.value=!l.value};return(r,i)=>(e.openBlock(),e.createElementBlock("div",{onClick:s,class:e.normalizeClass([e.unref(n).get(!!l.value),"p-0.5 duration-300 min-w-10.5 rounded-full"])},[e.createElementVNode("div",{class:e.normalizeClass([e.unref(o).get(!!l.value),"w-5 duration-300 will-change-transform aspect-square rounded-full bg-white"])},null,2)],2))}}),O=["disabled","placeholder"],A=e.defineComponent({inheritAttrs:!1,__name:"PTextInput",props:e.mergeModels({placeholder:{},isInvalid:{type:Boolean},disabled:{type:Boolean}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(t){const o=new Map([[!0,["outline-pico-error! text-pico-error! bg-pico-error-bg!"]],[!1,[]]]),n=e.useModel(t,"modelValue");return(l,s)=>(e.openBlock(),e.createElementBlock("div",{tabindex:"0",class:e.normalizeClass(["outline-pico-border outline-1 focus-within:outline-pico-primary text-pico-text-secondary focus-within:text-pico-text bg-pico-input-bg duration-300 focus-within:outline-pico-primary px-3 py-2 rounded-lg",[e.unref(o).get(t.isInvalid),{"cursor-not-allowed! text-pico-text-secondary/70!":t.disabled}]])},[l.$slots.start?e.renderSlot(l.$slots,"start",{key:0}):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("input",e.mergeProps(l.$attrs,{disabled:t.disabled,"onUpdate:modelValue":s[0]||(s[0]=r=>n.value=r),placeholder:t.placeholder,class:"group outline-0!"}),null,16,O),[[e.vModelDynamic,n.value]]),l.$slots.end?e.renderSlot(l.$slots,"end",{key:1}):e.createCommentVNode("",!0)],2))}}),R={},F={class:"bg-pico-bg w-full h-full"};function U(t,o){return e.openBlock(),e.createElementBlock("div",F,[e.renderSlot(t.$slots,"default")])}const q=c(R,[["render",U]]),L={},G={class:"rounded-lg p-4 bg-pico-bg-elevated"};function H(t,o){return e.openBlock(),e.createElementBlock("div",G,[e.renderSlot(t.$slots,"default")])}const J=c(L,[["render",H]]),K={},Q={class:"h-25 w-25",viewBox:"0 0 50 50",xmlns:"http://www.w3.org/2000/svg"};function W(t,o){return e.openBlock(),e.createElementBlock("svg",Q,[...o[0]||(o[0]=[e.createStaticVNode('<circle cx="25" cy="25" r="20" fill="none" stroke="var(--color-pico-secondary)" stroke-width="4" stroke-linecap="round" stroke-dasharray="90 150" stroke-dashoffset="0"><animateTransform attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="1.5s" repeatCount="indefinite"></animateTransform><animate attributeName="stroke-dasharray" values="1, 200; 90, 150; 90, 150" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate><animate attributeName="stroke-dashoffset" values="0; -100; -124" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate></circle><circle cx="25" cy="25" r="20" fill="none" stroke="var(--color-pico-primary)" stroke-width="4" stroke-linecap="round" stroke-dasharray="90 150" stroke-dashoffset="0"><animateTransform attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="1.5s" repeatCount="indefinite"></animateTransform><animate attributeName="stroke-dasharray" values="1, 200; 90, 150; 90, 150" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate><animate attributeName="stroke-dashoffset" values="0; -35; -124" keyTimes="0; 0.5; 1" dur="2s" repeatCount="indefinite"></animate></circle>',2)])])}const X=c(K,[["render",W]]),Y={class:"w-40 flex group"},Z={class:"h-2 rounded-xl w-full bg-pico-border relative"},v=["min","max","step"],ee={class:"relative w-full h-full flex justify-end items-center pointer-events-none"},te={class:"absolute h-5 w-5 border-2 border-white translate-x-1/2 transition-colors duration-200 bg-pico-primary rounded-full"},oe={class:"relative w-full h-full flex justify-center"},ne={class:"absolute bottom-[calc(100%+5px)] group-hover:opacity-100 opacity-0 duration-200 transition-opacity bg-pico-text-secondary text-white px-2 rounded-lg text-xs py-0.5"},ae=e.defineComponent({__name:"PSlider",props:e.mergeModels({min:{},max:{},step:{}},{modelValue:{default:0},modelModifiers:{}}),emits:["update:modelValue"],setup(t){const o=t,n=e.useModel(t,"modelValue"),l=e.computed(()=>(n.value-o.min)/(o.max-o.min)*100);return(s,r)=>(e.openBlock(),e.createElementBlock("div",Y,[e.createElementVNode("div",Z,[e.withDirectives(e.createElementVNode("input",{min:t.min,max:t.max,step:t.step,"onUpdate:modelValue":r[0]||(r[0]=i=>n.value=i),type:"range",class:"h-full opacity-0 absolute inset-y-0 -inset-x-2"},null,8,v),[[e.vModelText,n.value]]),e.createElementVNode("div",{class:"h-2 rounded-xl bg-pico-primary group-hover:bg-pico-primary/70 transition-colors duration-200 absolute left-0 pointer-events-none",style:e.normalizeStyle({width:l.value+"%"})},[e.createElementVNode("div",ee,[e.createElementVNode("div",te,[e.createElementVNode("div",oe,[e.createElementVNode("div",ne,e.toDisplayString(n.value),1)])])])],4)])]))}}),d=e.reactive([]);let u=1e3;const h=()=>{const t=(o,n=3e3)=>{const l=Date.now()+Math.random();u++;const s=u;d.push({id:l,message:o,zIndex:s,duration:n});const r=setTimeout(()=>{const i=d.findIndex(p=>p.id===l);i!==-1&&d.splice(i,1),clearTimeout(r)},n)};return{stack:e.readonly(d),addToast:t}},le={class:"duration-200 flex flex-col items-center justify-center cursor-pointer select-none gap-3"},se={class:"flex w-full gap-2 justify-center items-center"},k=e.defineComponent({__name:"PTab",props:{isActive:{type:Boolean},label:{},icon:{}},setup(t){return(o,n)=>(e.openBlock(),e.createElementBlock("div",le,[e.createElementVNode("div",se,[t.icon?(e.openBlock(),e.createBlock(m,{key:0,name:t.icon,class:e.normalizeClass(["duration-200",{"text-pico-primary!":t.isActive,"text-pico-border":!t.isActive}])},null,8,["name","class"])):e.createCommentVNode("",!0),e.createElementVNode("p",{class:e.normalizeClass(["text-sm/none text-pico-text duration-200",{"text-pico-text-secondary!":!t.isActive}])},e.toDisplayString(t.label),3)]),e.createElementVNode("div",{class:e.normalizeClass(["bg-pico-primary duration-200 h-0.5 rounded-full w-0",{"w-full!":t.isActive}])},null,2)]))}}),re={class:"flex gap-6"},ie=e.defineComponent({__name:"PTabs",props:e.mergeModels({options:{},defaultOption:{}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(t){const o=t,n=e.useModel(t,"modelValue"),l=s=>{n.value=s};return e.onMounted(()=>{o.defaultOption?n.value=o.defaultOption:n.value=o?.options[0]?.value}),(s,r)=>(e.openBlock(),e.createElementBlock("div",re,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,(i,p)=>(e.openBlock(),e.createBlock(k,{key:p,"is-active":i.value===n.value,label:i.label,onClick:he=>l(i.value),icon:i.icon},null,8,["is-active","label","onClick","icon"]))),128))]))}}),ce={class:"line-clamp-2 max-w-[300px] select-none"},de=c(e.defineComponent({__name:"PToast",props:{toast:{}},setup(t){return(o,n)=>(e.openBlock(),e.createElementBlock("div",{class:"rounded-lg p-2 bg-pico-bg-elevated outline-pico-border text-pico-text/90 outline-2 flex flex-col max-w-max gap-1 pointer-events-auto",style:e.normalizeStyle({zIndex:t.toast.zIndex})},[e.createElementVNode("div",ce,e.toDisplayString(t.toast.message),1),e.createElementVNode("div",{class:"h-1 bg-pico-primary pico-toast rounded-full",style:e.normalizeStyle({"--toast-duration":t.toast.duration+"ms"})},null,4)],4))}}),[["__scopeId","data-v-b851dd3c"]]),me=c(e.defineComponent({__name:"PToastRenderer",props:{placement:{default:"top-right"}},setup(t){const{stack:o}=h(),n={"top-left":"top-5 left-5","top-right":"top-5 right-5","bottom-left":"bottom-5 left-5","bottom-right":"bottom-5 right-5","top-center":"top-5 left-1/2 -translate-x-1/2","bottom-center":"bottom-5 left-1/2 -translate-x-1/2"};return(l,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["fixed z-9999 flex flex-col items-end gap-2 pointer-events-none",n[t.placement]])},[e.createVNode(e.TransitionGroup,{name:"list"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(o),r=>(e.openBlock(),e.createBlock(de,{key:r.id,toast:r},null,8,["toast"]))),128))]),_:1})],2))}}),[["__scopeId","data-v-421b01f2"]]);a.PBackgroud=q,a.PButton=y,a.PCard=J,a.PCheckboxInput=C,a.PDivider=B,a.PFormItem=V,a.PIcon=m,a.PPlane=N,a.PRadioInput=M,a.PSkeleton=D,a.PSlider=ae,a.PSpinner=X,a.PSwitchInput=j,a.PTab=k,a.PTabs=ie,a.PTextInput=A,a.PToastRenderer=me,a.PicoIcons=f,a.useToast=h,Object.defineProperty(a,Symbol.toStringTag,{value:"Module"})}));
 //# sourceMappingURL=pico-ui.umd.js.map

package/dist/pico-ui.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"pico-ui.umd.js","sources":["../src/components/base/PButton/PButton.vue","../src/assets/checkmark.svg","../src/utils/IconsEnum.ts","../src/components/base/PIcon/PIcon.vue","../src/components/base/PCheckboxInput/PCheckboxInput.vue","../src/components/base/PDivider/PDivider.vue","../src/components/base/PFormItem/PFormItem.vue","../src/components/base/PPlane/PPlane.vue","../src/components/base/PRadioInput/PRadioInput.vue","../src/components/base/PSkeleton/PSkeleton.vue","../src/components/base/PSwitchInput/PSwitchInput.vue","../src/components/base/PTextInput/PTextInput.vue","../src/components/PBackground/PBackgroud.vue","../src/components/base/PCard/PCard.vue","../src/components/base/PSpinner/PSpinner.vue","../src/components/base/PSlider/PSlider.vue","../src/composables/useToast.ts","../src/components/base/PTabs/components/PTab.vue","../src/components/base/PTabs/PTabs.vue"],"sourcesContent":["<script setup lang=\"ts\">\nconst { variant = \"primary\", size = \"medium\" } = defineProps<PButtonProps>();\n\nexport interface PButtonProps {\n  variant?: PButtonVariants;\n  size?: PButtonSizes;\n}\nexport type PButtonVariants = \"primary\" | \"secondary\" | \"outline\" | \"ghost\" | \"soft\";\nexport type PButtonSizes = \"large\" | \"medium\" | \"small\";\n\nconst computedVariant: Record<PButtonVariants, string[]> = {\n  primary: [\"bg-pico-primary\", \"text-white\", \"shadow-primary\"],\n  secondary: [\"bg-pico-secondary\", \"text-white\", \"shadow-secondary\"],\n  outline: [\"outline-2\", \"outline-pico-primary\", \"text-pico-primary\"],\n  ghost: [\"text-pico-gray\", \"border-dashed border-2 border-pico-gray/50\"],\n  soft: [\"bg-pico-primary/20\", \"text-pico-primary\"],\n};\n\nconst computedSize: Record<PButtonSizes, string[]> = {\n  large: [\"text-lg\", \"py-3.5\", \"px-8.5\"],\n  medium: [\"text-md\", \"py-2.5\", \"px-6\"],\n  small: [\"text-sm\", \"py-1.5\", \"px-4\"],\n};\n</script>\n\n<template>\n  <button\n    class=\"w-max h-max rounded-lg font-semibold hover:brightness-80 duration-300\"\n    :class=\"[computedVariant[variant], computedSize[size]]\"\n  >\n    <slot />\n  </button>\n</template>\n\n<style lang=\"css\" scoped></style>\n","import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nconst _hoisted_1 = {\n  xmlns: \"http://www.w3.org/2000/svg\",\n  width: \"12\",\n  height: \"9\",\n  fill: \"none\"\n}\n\nexport function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", _hoisted_1, [...(_cache[0] || (_cache[0] = [\n    _createElementVNode(\"path\", {\n      fill: \"currentColor\",\n      d: \"M10.868.366a1.25 1.25 0 0 1 0 1.767l-6.25 6.25a1.25 1.25 0 0 1-1.767 0l-2.5-2.5a1.25 1.25 0 0 1 1.767-1.767l1.617 1.616L9.1.366a1.25 1.25 0 0 1 1.767 0\"\n    }, null, -1)\n  ]))]))\n}\nexport default { render: render }","import type { Component } from 'vue'\nimport CheckmarkIcon from '@/assets/checkmark.svg'\nexport type PicoIconsNames = 'checkmark'\n\nexport const PicoIcons: Record<PicoIconsNames, Component | string> = {\n  checkmark: CheckmarkIcon\n}\n","<script setup lang=\"ts\">\nimport { PicoIcons, type PicoIconsNames } from \"../../../utils/IconsEnum\";\nexport interface PIconProps {\n  name: PicoIconsNames;\n}\n\ndefineProps<PIconProps>();\n</script>\n\n<template>\n  <component :is=\"PicoIcons[name]\" />\n</template>\n\n<style lang=\"css\" scoped></style>\n","<script setup lang=\"ts\">\r\nimport PIcon from \"../PIcon/PIcon.vue\";\r\n\r\nexport interface PCheckboxInputProps {\r\n  disabled?: boolean;\r\n}\r\n\r\nconst { disabled = false } = defineProps<PCheckboxInputProps>();\r\nconst computedClasses = new Map([\r\n  [false, [\"outline-2\"]],\r\n  [true, [\"bg-pico-primary\"]],\r\n]);\r\nconst model = defineModel<boolean>();\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    :class=\"computedClasses.get(!!model)\"\r\n    class=\"outline-pico-stroke-neutral min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-sm\"\r\n  >\r\n    <input\r\n      class=\"opacity-0 inset-0 absolute\"\r\n      :disabled=\"disabled\"\r\n      type=\"checkbox\"\r\n      v-model=\"model\"\r\n    />\r\n    <PIcon name=\"checkmark\" class=\"text-white\" />\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\">\nconst { orientation = \"horizontal\" } = defineProps<PDividerProps>();\n\nexport interface PDividerProps {\n  orientation?: \"vertical\" | \"horizontal\";\n}\n\nexport type PDividerOrientation = \"vertical\" | \"horizontal\";\n\nconst computedClasses: Record<PDividerOrientation, string[]> = {\n  vertical: [\"w-2px\", \"h-full\"],\n  horizontal: [\"h-2px\", \"w-full\"],\n};\n</script>\n\n<template>\n  <div\n    class=\"bg-pico-stroke-neutral\"\n    :class=\"computedClasses[orientation]\"\n  ></div>\n</template>\n\n<style lang=\"css\" scoped></style>\n","<script setup lang=\"ts\">\nimport { useField } from \"vee-validate\";\nimport type { Component } from \"vue\";\n\nexport interface PFormItemProps {\n  component: Component;\n  props: Record<string, unknown>;\n  name: string;\n  inputClass?: string;\n  errorClass?: string;\n}\nconst { name } = defineProps<PFormItemProps>();\n\nconst { value, errorMessage } = useField(name, {});\n</script>\n\n<template>\n  <div class=\"flex flex-col items-start\">\n    <span\n      v-if=\"errorMessage\"\n      :class=\"errorClass\"\n      class=\"text-pico-red text-xs max-w-full mb-1\"\n      >{{ errorMessage }}</span\n    >\n    <component\n      :class=\"inputClass\"\n      class=\"max-w-max\"\n      :is-invalid=\"!!errorMessage\"\n      v-model=\"value\"\n      :is=\"component\"\n      :name=\"name\"\n      v-bind=\"props\"\n    ></component>\n  </div>\n</template>\n\n<style lang=\"css\" scoped></style>\n","<script setup lang=\"ts\"></script>\n\n<template>\n  <div class=\"rounded-lg p-8 bg-white outline-pico-stroke-neutral outline-2\">\n    <slot />\n  </div>\n</template>\n\n<style lang=\"css\" scoped></style>\n","<script setup lang=\"ts\">\nexport interface PRadioInputProps {\n  disabled?: boolean;\n  name: string;\n  options: PRadioOptionItem[];\n}\n\nexport type PRadioOptionItem = { value: string; label: string };\n\nconst { disabled = false } = defineProps<PRadioInputProps>();\nconst computedClasses = new Map([\n  [false, [\"outline-2 -outline-offset-2\"]],\n  [true, [\"bg-pico-primary\"]],\n]);\nconst model = defineModel<string>();\n</script>\n\n<template>\n  <div v-for=\"option in options\" class=\"flex gap-2\">\n    <div\n      :class=\"computedClasses.get(model === option.value)\"\n      class=\"outline-pico-stroke-neutral min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-full\"\n    >\n      <input\n        type=\"radio\"\n        :value=\"option.value\"\n        class=\"opacity-0 inset-0 absolute\"\n        :disabled=\"disabled\"\n        v-model=\"model\"\n      />\n      <div class=\"w-2 h-2 bg-white rounded-full\"></div>\n    </div>\n    <p>\n      {{ option.label }}\n    </p>\n  </div>\n</template>\n\n<style lang=\"css\" scoped></style>\n","<template>\n  <div class=\"w-full h-full rounded-sm pico-skeleton\" />\n</template>\n\n<style lang=\"css\" scoped>\n.pico-skeleton {\n  background: linear-gradient(\n    70deg,\n    var(--color-pico-stroke-neutral) 30%,\n    var(--color-pico-light),\n    var(--color-pico-stroke-neutral) 70%\n  );\n  background-size: 200% 100%;\n  animation: skeleton 1.5s infinite linear;\n}\n\n@keyframes skeleton {\n  0% {\n    background-position: 100% 0;\n  }\n  100% {\n    background-position: -100% 0;\n  }\n}\n</style>\n","<script setup lang=\"ts\">\nconst computedThumbClasses = new Map([\n  [false, [\"\"]],\n  [true, [\"translate-x-[calc(100%-2px)]\"]],\n]);\n\nconst computedTrackClasses = new Map([\n  [false, [\"bg-pico-stroke-neutral \"]],\n  [true, [\"bg-pico-primary\"]],\n]);\n\nconst modelValue = defineModel<boolean>();\n\nconst toggleSwitch = () => {\n  modelValue.value = !modelValue.value;\n};\n</script>\n\n<template>\n  <div\n    @click=\"toggleSwitch\"\n    :class=\"computedTrackClasses.get(!!modelValue)\"\n    class=\"p-0.5 duration-300 min-w-10.5 rounded-full\"\n  >\n    <div\n      :class=\"computedThumbClasses.get(!!modelValue)\"\n      class=\"w-5 duration-300 will-change-transform aspect-square rounded-full bg-white\"\n    ></div>\n  </div>\n</template>\n\n<style lang=\"css\" scoped></style>\n","<script setup lang=\"ts\">\nexport interface PTextInputProps {\n  placeholder?: string;\n  isInvalid?: boolean;\n  disabled?: boolean;\n}\n\nconst { isInvalid = false, disabled = false } = defineProps<PTextInputProps>();\nconst computedClasses = new Map([\n  [true, [\"outline-pico-red! text-pico-red! bg-pico-light-red!\"]],\n  [false, []],\n]);\nconst model = defineModel();\n</script>\n\n<template>\n  <input\n    :disabled=\"disabled\"\n    type=\"text\"\n    v-model=\"model\"\n    :placeholder=\"placeholder\"\n    :class=\"computedClasses.get(isInvalid)\"\n    class=\"outline-pico-stroke-neutral outline-1 disabled:text-pico-caption/70 disabled:cursor-not-allowed text-pico-caption focus:text-pico-text bg-pico-light focus:bg-pico-white duration-300 focus:outline-pico-primary px-3 py-2 rounded-lg\"\n  />\n</template>\n\n<style lang=\"css\" scoped></style>\n","<template>\n  <div class=\"bg-pico-light w-full h-full\">\n    <slot />\n  </div>\n</template>\n","<script setup lang=\"ts\"></script>\r\n\r\n<template>\r\n  <div class=\"shadow-dark rounded-lg p-4 bg-white\">\r\n    <slot />\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped>\r\n\r\n</style>\r\n","\r\n<template>\r\n    <svg class=\"h-25 w-25 \"  viewBox=\"0 0 50 50\" xmlns=\"http://www.w3.org/2000/svg\">\r\n    <circle cx=\"25\" cy=\"25\" r=\"20\" fill=\"none\" stroke=\"#3b82f6\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-dasharray=\"90 150\" stroke-dashoffset=\"0\">\r\n    <animateTransform attributeName=\"transform\" type=\"rotate\" from=\"0 25 25\" to=\"360 25 25\" dur=\"1.5s\" repeatCount=\"indefinite\" />\r\n    <animate attributeName=\"stroke-dasharray\" values=\"1, 200; 90, 150; 90, 150\" keyTimes=\"0; 0.5; 1\" dur=\"2s\" repeatCount=\"indefinite\" />\r\n    <animate attributeName=\"stroke-dashoffset\" values=\"0; -100; -124\" keyTimes=\"0; 0.5; 1\" dur=\"2s\" repeatCount=\"indefinite\" />\r\n  </circle>\r\n  <circle cx=\"25\" cy=\"25\" r=\"20\" fill=\"none\" stroke=\"#13c8ec\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-dasharray=\"90 150\" stroke-dashoffset=\"0\">\r\n    <animateTransform attributeName=\"transform\" type=\"rotate\" from=\"0 25 25\" to=\"360 25 25\" dur=\"1.5s\" repeatCount=\"indefinite\" />\r\n    <animate attributeName=\"stroke-dasharray\" values=\"1, 200; 90, 150; 90, 150\" keyTimes=\"0; 0.5; 1\" dur=\"2s\" repeatCount=\"indefinite\" />\r\n    <animate attributeName=\"stroke-dashoffset\" values=\"0; -35; -124\" keyTimes=\"0; 0.5; 1\" dur=\"2s\" repeatCount=\"indefinite\" />\r\n  </circle>\r\n</svg>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport { computed } from 'vue';\r\nexport interface PSliderProps{\r\n    min: number,\r\n    max: number,\r\n    step: number\r\n}\r\nconst props = defineProps<PSliderProps>()\r\n\r\nconst value = defineModel({default: 0})\r\nconst percentage = computed(() => {\r\n  return ((value.value - props.min) / (props.max - props.min)) * 100;\r\n});\r\n</script>\r\n\r\n<template>\r\n        <div class=\"w-40 flex group  \">\r\n            <div class=\"h-2 rounded-xl w-full bg-pico-stroke-neutral relative\">\r\n                <input :min :max :step v-model=\"value\" type=\"range\" class=\" h-full opacity-0 absolute inset-y-0 -inset-x-2\"/>\r\n\r\n                <div class=\"h-2 rounded-xl bg-pico-primary  group-hover:bg-pico-primary/70 transition-colors duration-200 absolute left-0 pointer-events-none \" :style=\"{\r\n                width: percentage + '%'\r\n            }\" >\r\n            <div class=\"relative w-full h-full flex justify-end items-center pointer-events-none\">\r\n                <div class=\" absolute  h-5 w-5 border-2 border-white translate-x-1/2 transition-colors duration-200 bg-pico-primary rounded-full\">\r\n                    <div class=\"relative w-full h-full flex justify-center\">\r\n                        <div class=\"absolute bottom-[calc(100%+5px)] group-hover:opacity-100 opacity-0 duration-200 transition-opacity bg-pico-caption text-white px-2 rounded-lg text-xs py-0.5\">\r\n                            {{ value }}\r\n                        </div>\r\n\r\n                    </div>\r\n                </div>\r\n\r\n            </div>    \r\n        </div>\r\n            </div>\r\n            \r\n        </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped>\r\n\r\n</style>","import { reactive, readonly } from \"vue\"\r\n\r\n\r\nconst stack = reactive<{id: number, message: string, zIndex: number, duration: number}[]>([])\r\nlet zIndex = 1000\r\nexport const useToast = () => {\r\n\r\n    const addToast = (message: string, duration=3000) => {\r\n        const id = Date.now() + Math.random()\r\n        zIndex++\r\n        const savedIndex = zIndex\r\n        stack.push({id, message, zIndex:savedIndex, duration}) \r\n        const timeout = setTimeout(() => {\r\n            const index = stack.findIndex(t => t.id === id);\r\n            if (index !== -1) stack.splice(index, 1);\r\n            clearTimeout(timeout)\r\n        }, duration);\r\n    }\r\n    return {\r\n    stack: readonly(stack),\r\n    addToast,\r\n}\r\n\r\n}\r\n","<script setup lang=\"ts\">\r\nimport PIcon from '@/components/base/PIcon/PIcon.vue';\r\nimport type { PicoIconsNames } from '@/utils/IconsEnum';\r\n\r\nexport interface PTabProps {\r\n    isActive: boolean\r\n    label: string\r\n    icon?: PicoIconsNames\r\n    \r\n    \r\n}\r\nconst props = defineProps<PTabProps>()\r\n</script>\r\n\r\n<template>\r\n    \r\n    <div class=\"duration-200 flex flex-col   items-center justify-center cursor-pointer  select-none gap-3   \"\r\n    >\r\n       <div class=\"flex w-full gap-2 justify-center items-center\">\r\n        <PIcon v-if=\"icon\" :name=\"icon\" class=\"duration-200\" :class=\"{\r\n            'text-pico-primary!': isActive,\r\n            'text-pico-stroke-neutral': !isActive\r\n        }\" />\r\n        <p class=\"text-sm/none duration-200\" :class=\"{\r\n            'text-pico-caption!': !isActive,\r\n        }\"> {{ label }}</p>\r\n        \r\n       </div>\r\n       <div class=\" bg-pico-primary duration-200  h-0.5 rounded-full w-0\" \r\n         :class=\"{\r\n            'w-full!': isActive,\r\n\r\n         }\"></div>\r\n        \r\n</div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped>\r\n\r\n</style>","<script setup lang=\"ts\">\r\nimport PTab from '@/components/base/PTabs/components/PTab.vue';\r\nimport type { PicoIconsNames } from '@/utils/IconsEnum';\r\nimport { onMounted } from 'vue';\r\n\r\nexport interface TabOption {\r\n    value: number | string,\r\n    label: string\r\n    icon?: PicoIconsNames\r\n}\r\nexport interface PTabsProps {\r\n    options: TabOption[],\r\n    defaultOption?: string | number\r\n}\r\nconst props = defineProps<PTabsProps>()\r\n\r\nconst activeOption = defineModel<number | string>()\r\nconst changeOption = (value: number | string ) => {\r\n    activeOption.value = value\r\n}\r\nonMounted(() => {\r\n    if (props.defaultOption){\r\n        activeOption.value = props.defaultOption\r\n    }\r\n    else{\r\n        activeOption.value = props?.options[0]?.value\r\n    }\r\n})\r\n\r\n</script>\r\n\r\n<template>\r\n    <div class=\"flex   bg-white  gap-6  \">\r\n        <template v-for=\"option, _index in options\" :key=\"_index\">\r\n            <PTab  :is-active=\"option.value === activeOption\"  :label=\"option.label\" @click=\"changeOption(option.value)\" :icon=\"option.icon\" />\r\n        </template>\r\n    </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped>\r\n\r\n</style>"],"names":["computedVariant","computedSize","_createElementBlock","_normalizeClass","__props","_renderSlot","_ctx","_hoisted_1","render","_cache","_openBlock","_createElementVNode","PicoIcons","_createBlock","_resolveDynamicComponent","_unref","computedClasses","model","_useModel","$event","_createVNode","PIcon","value","errorMessage","useField","_mergeProps","_Fragment","_renderList","option","_toDisplayString","computedThumbClasses","computedTrackClasses","modelValue","toggleSwitch","props","percentage","computed","_hoisted_2","_normalizeStyle","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","stack","reactive","zIndex","useToast","addToast","message","duration","id","savedIndex","timeout","index","t","readonly","activeOption","changeOption","onMounted","_index","PTab"],"mappings":"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"}
+{"version":3,"file":"pico-ui.umd.js","sources":["../src/components/base/PButton/PButton.vue","../src/assets/checkmark.svg","../src/utils/IconsEnum.ts","../src/components/base/PIcon/PIcon.vue","../src/components/base/PCheckboxInput/PCheckboxInput.vue","../src/components/base/PDivider/PDivider.vue","../src/components/base/PFormItem/PFormItem.vue","../src/components/base/PPlane/PPlane.vue","../src/components/base/PRadioInput/PRadioInput.vue","../src/components/base/PSkeleton/PSkeleton.vue","../src/components/base/PSwitchInput/PSwitchInput.vue","../src/components/base/PTextInput/PTextInput.vue","../src/components/PBackground/PBackgroud.vue","../src/components/base/PCard/PCard.vue","../src/components/base/PSpinner/PSpinner.vue","../src/components/base/PSlider/PSlider.vue","../src/composables/useToast.ts","../src/components/base/PTabs/components/PTab.vue","../src/components/base/PTabs/PTabs.vue","../src/components/base/PToastRenderer.vue/PToast.vue","../src/components/base/PToastRenderer.vue/PToastRenderer.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nconst { variant = \"primary\", size = \"medium\" } = defineProps<PButtonProps>();\r\n\r\nexport interface PButtonProps {\r\n  variant?: PButtonVariants;\r\n  size?: PButtonSizes;\r\n}\r\nexport type PButtonVariants =\r\n  | \"primary\"\r\n  | \"secondary\"\r\n  | \"outline\"\r\n  | \"ghost\"\r\n  | \"soft\";\r\nexport type PButtonSizes = \"large\" | \"medium\" | \"small\";\r\n\r\nconst computedVariant: Record<PButtonVariants, string[]> = {\r\n  primary: [\"bg-pico-primary\", \"text-white\", \"shadow-primary\"],\r\n  secondary: [\"bg-pico-secondary\", \"text-white\", \"shadow-secondary\"],\r\n  outline: [\"outline-2\", \"outline-pico-primary\", \"text-pico-primary\"],\r\n  ghost: [\r\n    \"text-pico-text-secondary\",\r\n    \"border-dashed border-2 border-pico-text-secondary/50\",\r\n  ],\r\n  soft: [\"bg-pico-primary/20\", \"text-pico-primary\"],\r\n};\r\n\r\nconst computedSize: Record<PButtonSizes, string[]> = {\r\n  large: [\"text-lg\", \"py-3.5\", \"px-8.5\"],\r\n  medium: [\"text-md\", \"py-2.5\", \"px-6\"],\r\n  small: [\"text-sm\", \"py-1.5\", \"px-4\"],\r\n};\r\n</script>\r\n\r\n<template>\r\n  <button\r\n    class=\"w-max h-max rounded-lg font-semibold hover:brightness-80 duration-300\"\r\n    :class=\"[computedVariant[variant], computedSize[size]]\"\r\n  >\r\n    <slot />\r\n  </button>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nconst _hoisted_1 = {\n  xmlns: \"http://www.w3.org/2000/svg\",\n  width: \"12\",\n  height: \"9\",\n  fill: \"none\"\n}\n\nexport function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", _hoisted_1, [...(_cache[0] || (_cache[0] = [\n    _createElementVNode(\"path\", {\n      fill: \"currentColor\",\n      d: \"M10.868.366a1.25 1.25 0 0 1 0 1.767l-6.25 6.25a1.25 1.25 0 0 1-1.767 0l-2.5-2.5a1.25 1.25 0 0 1 1.767-1.767l1.617 1.616L9.1.366a1.25 1.25 0 0 1 1.767 0\"\n    }, null, -1)\n  ]))]))\n}\nexport default { render: render }","import type { Component } from 'vue'\nimport CheckmarkIcon from '@/assets/checkmark.svg'\nexport type PicoIconsNames = 'checkmark'\n\nexport const PicoIcons: Record<PicoIconsNames, Component | string> = {\n  checkmark: CheckmarkIcon\n}\n","<script setup lang=\"ts\">\nimport { PicoIcons, type PicoIconsNames } from \"../../../utils/IconsEnum\";\nexport interface PIconProps {\n  name: PicoIconsNames;\n}\n\ndefineProps<PIconProps>();\n</script>\n\n<template>\n  <component :is=\"PicoIcons[name]\" />\n</template>\n\n<style lang=\"css\" scoped></style>\n","<script setup lang=\"ts\">\r\nimport PIcon from \"../PIcon/PIcon.vue\";\r\n\r\nexport interface PCheckboxInputProps {\r\n  disabled?: boolean;\r\n  isChecked?: boolean;\r\n}\r\n\r\nconst { disabled = false, isChecked = false } =\r\n  defineProps<PCheckboxInputProps>();\r\nconst computedClasses = new Map([\r\n  [false, [\"outline-2\"]],\r\n  [true, [\"bg-pico-primary\"]],\r\n]);\r\nconst model = defineModel<boolean>();\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    :class=\"computedClasses.get(isChecked)\"\r\n    class=\"outline-pico-border min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-sm\"\r\n  >\r\n    <input\r\n      class=\"opacity-0 inset-0 absolute\"\r\n      :disabled=\"disabled\"\r\n      type=\"checkbox\"\r\n      v-model=\"model\"\r\n    />\r\n    <PIcon\r\n      name=\"checkmark\"\r\n      class=\"text-white pointer-events-none\"\r\n      :class=\"{\r\n        'opacity-0': !isChecked,\r\n      }\"\r\n    />\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\">\r\nconst { orientation = \"horizontal\" } = defineProps<PDividerProps>();\r\n\r\nexport interface PDividerProps {\r\n  orientation?: \"vertical\" | \"horizontal\";\r\n}\r\n\r\nexport type PDividerOrientation = \"vertical\" | \"horizontal\";\r\n\r\nconst computedClasses: Record<PDividerOrientation, string[]> = {\r\n  vertical: [\"w-2px\", \"h-full\"],\r\n  horizontal: [\"h-2px\", \"w-full\"],\r\n};\r\n</script>\r\n\r\n<template>\r\n  <div class=\"bg-pico-border\" :class=\"computedClasses[orientation]\"></div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\">\r\nimport { useField } from \"vee-validate\";\r\nimport type { Component } from \"vue\";\r\n\r\nexport interface PFormItemProps {\r\n  component: Component;\r\n  props: Record<string, unknown>;\r\n  name: string;\r\n  inputClass?: string;\r\n  errorClass?: string;\r\n}\r\nconst { name } = defineProps<PFormItemProps>();\r\n\r\nconst { value, errorMessage } = useField(name, {});\r\n</script>\r\n\r\n<template>\r\n  <div class=\"flex flex-col items-start\">\r\n    <span\r\n      v-if=\"errorMessage\"\r\n      :class=\"errorClass\"\r\n      class=\"text-pico-error text-xs max-w-full mb-1\"\r\n      >{{ errorMessage }}</span\r\n    >\r\n    <component\r\n      :class=\"inputClass\"\r\n      class=\"max-w-max\"\r\n      :is-invalid=\"!!errorMessage\"\r\n      v-model=\"value\"\r\n      :is=\"component\"\r\n      :name=\"name\"\r\n      v-bind=\"props\"\r\n    ></component>\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\"></script>\r\n\r\n<template>\r\n  <div class=\"rounded-lg p-8 bg-pico-bg-elevated outline-pico-border outline-2\">\r\n    <slot />\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\">\r\nexport interface PRadioInputProps {\r\n  disabled?: boolean;\r\n  name: string;\r\n  isChecked?: boolean;\r\n}\r\n\r\nexport type PRadioOptionItem = { value: string; label: string };\r\n\r\nconst { disabled = false, isChecked = false } = defineProps<PRadioInputProps>();\r\nconst computedClasses = new Map([\r\n  [false, [\"outline-2 -outline-offset-2\"]],\r\n  [true, [\"bg-pico-primary\"]],\r\n]);\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    :class=\"computedClasses.get(isChecked)\"\r\n    class=\"outline-pico-border min-w-5.5 duration-300 h-5.5 flex relative justify-center items-center rounded-full\"\r\n  >\r\n    <input\r\n      type=\"radio\"\r\n      class=\"opacity-0 inset-0 absolute\"\r\n      :disabled=\"disabled\"\r\n    />\r\n    <div\r\n      class=\"w-2 h-2 bg-white rounded-full pointer-events-none\"\r\n      :class=\"{\r\n        'opacity-0': !isChecked,\r\n      }\"\r\n    />\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<template>\r\n  <div class=\"w-full h-full rounded-sm pico-skeleton\" />\r\n</template>\r\n\r\n<style lang=\"css\" scoped>\r\n.pico-skeleton {\r\n  background: linear-gradient(\r\n    70deg,\r\n    var(--color-pico-border) 30%,\r\n    var(--color-pico-skeleton-glow),\r\n    var(--color-pico-border) 70%\r\n  );\r\n  background-size: 200% 100%;\r\n  animation: skeleton 1.5s infinite linear;\r\n}\r\n\r\n@keyframes skeleton {\r\n  0% {\r\n    background-position: 100% 0;\r\n  }\r\n  100% {\r\n    background-position: -100% 0;\r\n  }\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\nconst computedThumbClasses = new Map([\r\n  [false, [\"\"]],\r\n  [true, [\"translate-x-[calc(100%-2px)]\"]],\r\n]);\r\n\r\nconst computedTrackClasses = new Map([\r\n  [false, [\"bg-pico-border \"]],\r\n  [true, [\"bg-pico-primary\"]],\r\n]);\r\n\r\nconst modelValue = defineModel<boolean>();\r\n\r\nconst toggleSwitch = () => {\r\n  modelValue.value = !modelValue.value;\r\n};\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    @click=\"toggleSwitch\"\r\n    :class=\"computedTrackClasses.get(!!modelValue)\"\r\n    class=\"p-0.5 duration-300 min-w-10.5 rounded-full\"\r\n  >\r\n    <div\r\n      :class=\"computedThumbClasses.get(!!modelValue)\"\r\n      class=\"w-5 duration-300 will-change-transform aspect-square rounded-full bg-white\"\r\n    ></div>\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\">\r\nexport interface PTextInputProps {\r\n  placeholder?: string;\r\n  isInvalid?: boolean;\r\n  disabled?: boolean;\r\n}\r\ndefineOptions({ inheritAttrs: false });\r\n\r\nconst props = defineProps<PTextInputProps>();\r\nconst computedClasses = new Map([\r\n  [true, [\"outline-pico-error! text-pico-error! bg-pico-error-bg!\"]],\r\n  [false, []],\r\n]);\r\nconst model = defineModel();\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    tabindex=\"0\"\r\n    class=\"outline-pico-border outline-1 focus-within:outline-pico-primary text-pico-text-secondary focus-within:text-pico-text bg-pico-input-bg duration-300 focus-within:outline-pico-primary px-3 py-2 rounded-lg\"\r\n    :class=\"[\r\n      computedClasses.get(isInvalid),\r\n      {\r\n        'cursor-not-allowed! text-pico-text-secondary/70!': disabled,\r\n      },\r\n    ]\"\r\n  >\r\n    <slot v-if=\"$slots.start\" name=\"start\" />\r\n    <input\r\n      v-bind=\"$attrs\"\r\n      :disabled=\"disabled\"\r\n      v-model=\"model\"\r\n      :placeholder=\"placeholder\"\r\n      class=\"group outline-0!\"\r\n    />\r\n    <slot v-if=\"$slots.end\" name=\"end\" />\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<template>\r\n  <div class=\"bg-pico-bg w-full h-full\">\r\n    <slot />\r\n  </div>\r\n</template>\r\n","<script setup lang=\"ts\"></script>\r\n\r\n<template>\r\n  <div class=\"rounded-lg p-4 bg-pico-bg-elevated\">\r\n    <slot />\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<template>\r\n  <svg class=\"h-25 w-25\" viewBox=\"0 0 50 50\" xmlns=\"http://www.w3.org/2000/svg\">\r\n    <circle\r\n      cx=\"25\"\r\n      cy=\"25\"\r\n      r=\"20\"\r\n      fill=\"none\"\r\n      stroke=\"var(--color-pico-secondary)\"\r\n      stroke-width=\"4\"\r\n      stroke-linecap=\"round\"\r\n      stroke-dasharray=\"90 150\"\r\n      stroke-dashoffset=\"0\"\r\n    >\r\n      <animateTransform\r\n        attributeName=\"transform\"\r\n        type=\"rotate\"\r\n        from=\"0 25 25\"\r\n        to=\"360 25 25\"\r\n        dur=\"1.5s\"\r\n        repeatCount=\"indefinite\"\r\n      />\r\n      <animate\r\n        attributeName=\"stroke-dasharray\"\r\n        values=\"1, 200; 90, 150; 90, 150\"\r\n        keyTimes=\"0; 0.5; 1\"\r\n        dur=\"2s\"\r\n        repeatCount=\"indefinite\"\r\n      />\r\n      <animate\r\n        attributeName=\"stroke-dashoffset\"\r\n        values=\"0; -100; -124\"\r\n        keyTimes=\"0; 0.5; 1\"\r\n        dur=\"2s\"\r\n        repeatCount=\"indefinite\"\r\n      />\r\n    </circle>\r\n    <circle\r\n      cx=\"25\"\r\n      cy=\"25\"\r\n      r=\"20\"\r\n      fill=\"none\"\r\n      stroke=\"var(--color-pico-primary)\"\r\n      stroke-width=\"4\"\r\n      stroke-linecap=\"round\"\r\n      stroke-dasharray=\"90 150\"\r\n      stroke-dashoffset=\"0\"\r\n    >\r\n      <animateTransform\r\n        attributeName=\"transform\"\r\n        type=\"rotate\"\r\n        from=\"0 25 25\"\r\n        to=\"360 25 25\"\r\n        dur=\"1.5s\"\r\n        repeatCount=\"indefinite\"\r\n      />\r\n      <animate\r\n        attributeName=\"stroke-dasharray\"\r\n        values=\"1, 200; 90, 150; 90, 150\"\r\n        keyTimes=\"0; 0.5; 1\"\r\n        dur=\"2s\"\r\n        repeatCount=\"indefinite\"\r\n      />\r\n      <animate\r\n        attributeName=\"stroke-dashoffset\"\r\n        values=\"0; -35; -124\"\r\n        keyTimes=\"0; 0.5; 1\"\r\n        dur=\"2s\"\r\n        repeatCount=\"indefinite\"\r\n      />\r\n    </circle>\r\n  </svg>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport { computed } from \"vue\";\r\nexport interface PSliderProps {\r\n  min: number;\r\n  max: number;\r\n  step: number;\r\n}\r\nconst props = defineProps<PSliderProps>();\r\n\r\nconst value = defineModel({ default: 0 });\r\nconst percentage = computed(() => {\r\n  return ((value.value - props.min) / (props.max - props.min)) * 100;\r\n});\r\n</script>\r\n\r\n<template>\r\n  <div class=\"w-40 flex group\">\r\n    <div class=\"h-2 rounded-xl w-full bg-pico-border relative\">\r\n      <input\r\n        :min\r\n        :max\r\n        :step\r\n        v-model=\"value\"\r\n        type=\"range\"\r\n        class=\"h-full opacity-0 absolute inset-y-0 -inset-x-2\"\r\n      />\r\n\r\n      <div\r\n        class=\"h-2 rounded-xl bg-pico-primary group-hover:bg-pico-primary/70 transition-colors duration-200 absolute left-0 pointer-events-none\"\r\n        :style=\"{\r\n          width: percentage + '%',\r\n        }\"\r\n      >\r\n        <div\r\n          class=\"relative w-full h-full flex justify-end items-center pointer-events-none\"\r\n        >\r\n          <div\r\n            class=\"absolute h-5 w-5 border-2 border-white translate-x-1/2 transition-colors duration-200 bg-pico-primary rounded-full\"\r\n          >\r\n            <div class=\"relative w-full h-full flex justify-center\">\r\n              <div\r\n                class=\"absolute bottom-[calc(100%+5px)] group-hover:opacity-100 opacity-0 duration-200 transition-opacity bg-pico-text-secondary text-white px-2 rounded-lg text-xs py-0.5\"\r\n              >\r\n                {{ value }}\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","import { reactive, readonly } from \"vue\"\r\n\r\n\r\nconst stack = reactive<{id: number, message: string, zIndex: number, duration: number}[]>([])\r\nlet zIndex = 1000\r\nexport const useToast = () => {\r\n\r\n    const addToast = (message: string, duration=3000) => {\r\n        const id = Date.now() + Math.random()\r\n        zIndex++\r\n        const savedIndex = zIndex\r\n        stack.push({id, message, zIndex:savedIndex, duration}) \r\n        const timeout = setTimeout(() => {\r\n            const index = stack.findIndex(t => t.id === id);\r\n            if (index !== -1) stack.splice(index, 1);\r\n            clearTimeout(timeout)\r\n        }, duration);\r\n    }\r\n    return {\r\n    stack: readonly(stack),\r\n    addToast,\r\n}\r\n\r\n}\r\n","<script setup lang=\"ts\">\r\nimport PIcon from \"@/components/base/PIcon/PIcon.vue\";\r\nimport type { PicoIconsNames } from \"@/utils/IconsEnum\";\r\n\r\nexport interface PTabProps {\r\n  isActive: boolean;\r\n  label: string;\r\n  icon?: PicoIconsNames;\r\n}\r\nconst props = defineProps<PTabProps>();\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    class=\"duration-200 flex flex-col items-center justify-center cursor-pointer select-none gap-3\"\r\n  >\r\n    <div class=\"flex w-full gap-2 justify-center items-center\">\r\n      <PIcon\r\n        v-if=\"icon\"\r\n        :name=\"icon\"\r\n        class=\"duration-200\"\r\n        :class=\"{\r\n          'text-pico-primary!': isActive,\r\n          'text-pico-border': !isActive,\r\n        }\"\r\n      />\r\n      <p\r\n        class=\"text-sm/none text-pico-text duration-200\"\r\n        :class=\"{\r\n          'text-pico-text-secondary!': !isActive,\r\n        }\"\r\n      >\r\n        {{ label }}\r\n      </p>\r\n    </div>\r\n    <div\r\n      class=\"bg-pico-primary duration-200 h-0.5 rounded-full w-0\"\r\n      :class=\"{\r\n        'w-full!': isActive,\r\n      }\"\r\n    ></div>\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\">\r\nimport PTab from \"@/components/base/PTabs/components/PTab.vue\";\r\nimport type { PicoIconsNames } from \"@/utils/IconsEnum\";\r\nimport { onMounted } from \"vue\";\r\n\r\nexport interface TabOption {\r\n  value: number | string;\r\n  label: string;\r\n  icon?: PicoIconsNames;\r\n}\r\nexport interface PTabsProps {\r\n  options: TabOption[];\r\n  defaultOption?: string | number;\r\n}\r\nconst props = defineProps<PTabsProps>();\r\n\r\nconst activeOption = defineModel<number | string>();\r\nconst changeOption = (value: number | string) => {\r\n  activeOption.value = value;\r\n};\r\nonMounted(() => {\r\n  if (props.defaultOption) {\r\n    activeOption.value = props.defaultOption;\r\n  } else {\r\n    activeOption.value = props?.options[0]?.value;\r\n  }\r\n});\r\n</script>\r\n\r\n<template>\r\n  <div class=\"flex gap-6\">\r\n    <template v-for=\"(option, _index) in options\" :key=\"_index\">\r\n      <PTab\r\n        :is-active=\"option.value === activeOption\"\r\n        :label=\"option.label\"\r\n        @click=\"changeOption(option.value)\"\r\n        :icon=\"option.icon\"\r\n      />\r\n    </template>\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped></style>\r\n","<script setup lang=\"ts\">\r\ndefineProps<{\r\n  toast: {\r\n    id: number;\r\n    message: string;\r\n    zIndex: number;\r\n    duration: number;\r\n  };\r\n}>();\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    class=\"rounded-lg p-2 bg-pico-bg-elevated outline-pico-border text-pico-text/90 outline-2 flex flex-col max-w-max gap-1 pointer-events-auto\"\r\n    :style=\"{ zIndex: toast.zIndex }\"\r\n  >\r\n    <div class=\"line-clamp-2 max-w-[300px] select-none\">\r\n      {{ toast.message }}\r\n    </div>\r\n    <div\r\n      class=\"h-1 bg-pico-primary pico-toast rounded-full\"\r\n      :style=\"{ '--toast-duration': toast.duration + 'ms' }\"\r\n    ></div>\r\n  </div>\r\n</template>\r\n\r\n<style lang=\"css\" scoped>\r\n.pico-toast {\r\n  animation: 1 alternate var(--toast-duration) toast;\r\n}\r\n@keyframes toast {\r\n  from {\r\n    width: 0px;\r\n  }\r\n  to {\r\n    width: 100%;\r\n  }\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\nimport PToast from \"@/components/base/PToastRenderer.vue/PToast.vue\";\r\nimport { useToast } from \"@/composables/useToast\";\r\n\r\nconst { stack } = useToast();\r\n\r\nexport type ToastPlacement =\r\n  | \"top-left\"\r\n  | \"top-right\"\r\n  | \"bottom-left\"\r\n  | \"bottom-right\"\r\n  | \"top-center\"\r\n  | \"bottom-center\";\r\n\r\nexport interface PToastRendererProps {\r\n  placement?: ToastPlacement;\r\n}\r\nconst stackPlacementMap: Record<ToastPlacement, string> = {\r\n  \"top-left\": \"top-5 left-5\",\r\n  \"top-right\": \"top-5 right-5\",\r\n  \"bottom-left\": \"bottom-5 left-5\",\r\n  \"bottom-right\": \"bottom-5 right-5\",\r\n  \"top-center\": \"top-5 left-1/2 -translate-x-1/2\",\r\n  \"bottom-center\": \"bottom-5 left-1/2 -translate-x-1/2\",\r\n};\r\n\r\nconst { placement = \"top-right\" } = defineProps<PToastRendererProps>();\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    class=\"fixed z-9999 flex flex-col items-end gap-2 pointer-events-none\"\r\n    :class=\"stackPlacementMap[placement]\"\r\n  >\r\n    <TransitionGroup name=\"list\">\r\n      <PToast v-for=\"toast in stack\" :key=\"toast.id\" :toast=\"toast\" />\r\n    </TransitionGroup>\r\n  </div>\r\n</template>\r\n\r\n<style scoped>\r\n.list-move,\r\n.list-enter-active,\r\n.list-leave-active {\r\n  transition: all 0.5s ease;\r\n}\r\n\r\n.list-enter-from,\r\n.list-leave-to {\r\n  opacity: 0;\r\n  transform: translateX(30px);\r\n}\r\n\r\n.list-leave-active {\r\n  position: absolute;\r\n}\r\n</style>\r\n"],"names":["computedVariant","computedSize","_createElementBlock","_normalizeClass","__props","_renderSlot","_ctx","_hoisted_1","render","_cache","_openBlock","_createElementVNode","PicoIcons","_createBlock","_resolveDynamicComponent","_unref","computedClasses","model","_useModel","$event","_createVNode","PIcon","value","errorMessage","useField","_mergeProps","computedThumbClasses","computedTrackClasses","modelValue","toggleSwitch","$slots","props","percentage","computed","_hoisted_2","_normalizeStyle","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_toDisplayString","stack","reactive","zIndex","useToast","addToast","message","duration","id","savedIndex","timeout","index","t","readonly","activeOption","changeOption","onMounted","_Fragment","_renderList","option","_index","PTab","stackPlacementMap","_TransitionGroup","toast","PToast"],"mappings":"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"}

package/dist/style.css

@@ -1 +1 @@
-@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";@layer components;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-duration:initial;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--font-weight-semibold:600;--radius-sm:.25rem;--radius-lg:.5rem;--radius-xl:.75rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-pico-primary:#13c8ec;--color-pico-secondary:#3b82f6;--color-pico-light:#f6f8f8;--color-pico-neutral:#f1f5f9;--color-pico-dark:#101f22;--color-pico-gray:#64748b;--color-pico-stroke-neutral:#e2e8f0;--color-pico-text:#1e293b;--color-pico-caption:#64748b;--color-pico-red:#ef4444;--color-pico-light-red:#fef2f2;--text-md:1rem;--spacing-2px:2px}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:calc(var(--spacing)*0)}.-inset-x-2{inset-inline:calc(var(--spacing)*-2)}.inset-y-0{inset-block:calc(var(--spacing)*0)}.right-5{right:calc(var(--spacing)*5)}.bottom-5{bottom:calc(var(--spacing)*5)}.bottom-\[calc\(100\%\+5px\)\]{bottom:calc(100% + 5px)}.left-0{left:calc(var(--spacing)*0)}.z-9999{z-index:9999}.mb-1{margin-bottom:calc(var(--spacing)*1)}.line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.block{display:block}.flex{display:flex}.aspect-square{aspect-ratio:1}.h-0\.5{height:calc(var(--spacing)*.5)}.h-1{height:calc(var(--spacing)*1)}.h-2{height:calc(var(--spacing)*2)}.h-2px{height:var(--spacing-2px)}.h-5{height:calc(var(--spacing)*5)}.h-5\!{height:calc(var(--spacing)*5)!important}.h-5\.5{height:calc(var(--spacing)*5.5)}.h-12\!{height:calc(var(--spacing)*12)!important}.h-12\.5\!{height:calc(var(--spacing)*12.5)!important}.h-25{height:calc(var(--spacing)*25)}.h-\[1em\]\!{height:1em!important}.h-full{height:100%}.h-max{height:max-content}.min-h-screen{min-height:100vh}.w-0{width:calc(var(--spacing)*0)}.w-2{width:calc(var(--spacing)*2)}.w-2px{width:var(--spacing-2px)}.w-4\/5{width:80%}.w-5{width:calc(var(--spacing)*5)}.w-5\!{width:calc(var(--spacing)*5)!important}.w-12\!{width:calc(var(--spacing)*12)!important}.w-12\.5\!{width:calc(var(--spacing)*12.5)!important}.w-25{width:calc(var(--spacing)*25)}.w-40{width:calc(var(--spacing)*40)}.w-\[120px\]\!{width:120px!important}.w-\[256px\]\!{width:256px!important}.w-full{width:100%}.w-full\!{width:100%!important}.w-max{width:max-content}.max-w-200{max-width:calc(var(--spacing)*200)}.max-w-\[300px\]{max-width:300px}.max-w-full{max-width:100%}.max-w-max{max-width:max-content}.min-w-5\.5{min-width:calc(var(--spacing)*5.5)}.min-w-10\.5{min-width:calc(var(--spacing)*10.5)}.translate-x-1\/2{--tw-translate-x: 50% ;translate:var(--tw-translate-x)var(--tw-translate-y)}.translate-x-\[calc\(100\%-2px\)\]{--tw-translate-x: calc(100% - 2px) ;translate:var(--tw-translate-x)var(--tw-translate-y)}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-evenly{justify-content:space-evenly}.gap-1{gap:calc(var(--spacing)*1)}.gap-2{gap:calc(var(--spacing)*2)}.gap-3{gap:calc(var(--spacing)*3)}.gap-4{gap:calc(var(--spacing)*4)}.gap-5{gap:calc(var(--spacing)*5)}.gap-6{gap:calc(var(--spacing)*6)}.self-start{align-self:flex-start}.rounded-full{border-radius:3.40282e38px}.rounded-full\!{border-radius:3.40282e38px!important}.rounded-lg{border-radius:var(--radius-lg)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-l-5{border-left-style:var(--tw-border-style);border-left-width:5px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\[\#13DAEC\]{border-color:#13daec}.border-pico-gray\/50{border-color:#64748b80}@supports (color:color-mix(in lab,red,red)){.border-pico-gray\/50{border-color:color-mix(in oklab,var(--color-pico-gray)50%,transparent)}}.border-white{border-color:var(--color-white)}.bg-pico-caption{background-color:var(--color-pico-caption)}.bg-pico-light{background-color:var(--color-pico-light)}.bg-pico-light-red\!{background-color:var(--color-pico-light-red)!important}.bg-pico-primary{background-color:var(--color-pico-primary)}.bg-pico-primary\/20{background-color:#13c8ec33}@supports (color:color-mix(in lab,red,red)){.bg-pico-primary\/20{background-color:color-mix(in oklab,var(--color-pico-primary)20%,transparent)}}.bg-pico-secondary{background-color:var(--color-pico-secondary)}.bg-pico-stroke-neutral{background-color:var(--color-pico-stroke-neutral)}.bg-white{background-color:var(--color-white)}.p-0\.5{padding:calc(var(--spacing)*.5)}.p-2{padding:calc(var(--spacing)*2)}.p-4{padding:calc(var(--spacing)*4)}.p-8{padding:calc(var(--spacing)*8)}.p-10{padding:calc(var(--spacing)*10)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.px-8\.5{padding-inline:calc(var(--spacing)*8.5)}.py-0\.5{padding-block:calc(var(--spacing)*.5)}.py-1\.5{padding-block:calc(var(--spacing)*1.5)}.py-2{padding-block:calc(var(--spacing)*2)}.py-2\.5{padding-block:calc(var(--spacing)*2.5)}.py-3\.5{padding-block:calc(var(--spacing)*3.5)}.text-center{text-align:center}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-sm\/none{font-size:var(--text-sm);line-height:1}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-md{font-size:var(--text-md)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-pico-caption{color:var(--color-pico-caption)}.text-pico-caption\!{color:var(--color-pico-caption)!important}.text-pico-dark\/90{color:#101f22e6}@supports (color:color-mix(in lab,red,red)){.text-pico-dark\/90{color:color-mix(in oklab,var(--color-pico-dark)90%,transparent)}}.text-pico-gray{color:var(--color-pico-gray)}.text-pico-primary{color:var(--color-pico-primary)}.text-pico-primary\!{color:var(--color-pico-primary)!important}.text-pico-red{color:var(--color-pico-red)}.text-pico-red\!{color:var(--color-pico-red)!important}.text-pico-stroke-neutral{color:var(--color-pico-stroke-neutral)}.text-white{color:var(--color-white)}.opacity-0{opacity:0}.shadow-dark{--tw-shadow:0px 2px 8px var(--tw-shadow-color,-3px)#101f2233}@supports (color:color-mix(in lab,red,red)){.shadow-dark{--tw-shadow:0px 2px 8px var(--tw-shadow-color,-3px)color-mix(in srgb,var(--color-pico-dark)20%,transparent)}}.shadow-dark{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-primary{--tw-shadow:0px 10px 15px var(--tw-shadow-color,-3px)#13c8ec33}@supports (color:color-mix(in lab,red,red)){.shadow-primary{--tw-shadow:0px 10px 15px var(--tw-shadow-color,-3px)color-mix(in srgb,var(--color-pico-primary)20%,transparent)}}.shadow-primary{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-secondary{--tw-shadow:0px 10px 15px var(--tw-shadow-color,-3px)#3b82f633}@supports (color:color-mix(in lab,red,red)){.shadow-secondary{--tw-shadow:0px 10px 15px var(--tw-shadow-color,-3px)color-mix(in srgb,var(--color-pico-secondary)20%,transparent)}}.shadow-secondary{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.outline,.outline-1{outline-style:var(--tw-outline-style);outline-width:1px}.outline-2{outline-style:var(--tw-outline-style);outline-width:2px}.-outline-offset-2{outline-offset:-2px}.outline-pico-primary{outline-color:var(--color-pico-primary)}.outline-pico-red\!{outline-color:var(--color-pico-red)!important}.outline-pico-stroke-neutral{outline-color:var(--color-pico-stroke-neutral)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-300{--tw-duration:.3s;transition-duration:.3s}.will-change-transform{will-change:transform}.select-none{-webkit-user-select:none;user-select:none}@media(hover:hover){.group-hover\:bg-pico-primary\/70:is(:where(.group):hover *){background-color:#13c8ecb3}@supports (color:color-mix(in lab,red,red)){.group-hover\:bg-pico-primary\/70:is(:where(.group):hover *){background-color:color-mix(in oklab,var(--color-pico-primary)70%,transparent)}}.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}.hover\:bg-pico-light:hover{background-color:var(--color-pico-light)}.hover\:brightness-80:hover{--tw-brightness:brightness(80%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}}.focus\:text-pico-text:focus{color:var(--color-pico-text)}.focus\:outline-pico-primary:focus{outline-color:var(--color-pico-primary)}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:text-pico-caption\/70:disabled{color:#64748bb3}@supports (color:color-mix(in lab,red,red)){.disabled\:text-pico-caption\/70:disabled{color:color-mix(in oklab,var(--color-pico-caption)70%,transparent)}}.pico-header-1{color:var(--color-pico-text);font-size:3rem;font-weight:700;line-height:1.2}.pico-header-2{color:var(--color-pico-text);font-size:2.25rem;font-weight:600;line-height:1.2}.pico-header-3{color:var(--color-pico-text);font-size:1.875rem;font-weight:400;line-height:1.2}.pico-text-large{color:var(--color-pico-text);font-size:1.125rem;font-weight:400;line-height:1.25}.pico-text-medium{color:var(--color-pico-text);font-size:1rem;font-weight:400;line-height:1.25}.pico-text-small{color:var(--color-pico-text);font-size:.875rem;font-weight:400;line-height:1.25}.pico-text-caption{color:var(--color-pico-caption);font-size:.75rem;font-weight:400;line-height:1.25}}body{font-family:Inter,sans-serif}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-duration{syntax:"*";inherits:false}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}.pico-skeleton[data-v-7ff1dee9]{background:linear-gradient(70deg,var(--color-pico-stroke-neutral) 30%,var(--color-pico-light),var(--color-pico-stroke-neutral) 70%);background-size:200% 100%;animation:skeleton-7ff1dee9 1.5s infinite linear}@keyframes skeleton-7ff1dee9{0%{background-position:100% 0}to{background-position:-100% 0}}
+@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";@layer components;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-duration:initial;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--font-weight-semibold:600;--radius-sm:.25rem;--radius-lg:.5rem;--radius-xl:.75rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-pico-primary:#13c8ec;--color-pico-secondary:#3b82f6;--color-pico-skeleton-glow:#fafcff;--color-pico-bg:#c4d0db;--color-pico-bg-elevated:#fafcff;--color-pico-border:#dce5ee;--color-pico-text:#17212b;--color-pico-text-secondary:#526377;--color-pico-input-bg:#fafcff;--color-pico-error:#ef4444;--color-pico-error-bg:#fee2e2;--text-md:1rem;--spacing-2px:2px}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:calc(var(--spacing)*0)}.-inset-x-2{inset-inline:calc(var(--spacing)*-2)}.inset-y-0{inset-block:calc(var(--spacing)*0)}.top-5{top:calc(var(--spacing)*5)}.right-5{right:calc(var(--spacing)*5)}.bottom-5{bottom:calc(var(--spacing)*5)}.bottom-\[calc\(100\%\+5px\)\]{bottom:calc(100% + 5px)}.left-0{left:calc(var(--spacing)*0)}.left-1\/2{left:50%}.left-5{left:calc(var(--spacing)*5)}.z-9999{z-index:9999}.mb-1{margin-bottom:calc(var(--spacing)*1)}.line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.block{display:block}.flex{display:flex}.aspect-square{aspect-ratio:1}.h-0\.5{height:calc(var(--spacing)*.5)}.h-1{height:calc(var(--spacing)*1)}.h-2{height:calc(var(--spacing)*2)}.h-2px{height:var(--spacing-2px)}.h-5{height:calc(var(--spacing)*5)}.h-5\!{height:calc(var(--spacing)*5)!important}.h-5\.5{height:calc(var(--spacing)*5.5)}.h-12\!{height:calc(var(--spacing)*12)!important}.h-12\.5\!{height:calc(var(--spacing)*12.5)!important}.h-25{height:calc(var(--spacing)*25)}.h-\[1em\]\!{height:1em!important}.h-full{height:100%}.h-max{height:max-content}.min-h-screen{min-height:100vh}.w-0{width:calc(var(--spacing)*0)}.w-2{width:calc(var(--spacing)*2)}.w-2px{width:var(--spacing-2px)}.w-4\/5{width:80%}.w-5{width:calc(var(--spacing)*5)}.w-5\!{width:calc(var(--spacing)*5)!important}.w-12\!{width:calc(var(--spacing)*12)!important}.w-12\.5\!{width:calc(var(--spacing)*12.5)!important}.w-25{width:calc(var(--spacing)*25)}.w-40{width:calc(var(--spacing)*40)}.w-\[120px\]\!{width:120px!important}.w-\[256px\]\!{width:256px!important}.w-full{width:100%}.w-full\!{width:100%!important}.w-max{width:max-content}.max-w-200{max-width:calc(var(--spacing)*200)}.max-w-\[300px\]{max-width:300px}.max-w-full{max-width:100%}.max-w-max{max-width:max-content}.min-w-5\.5{min-width:calc(var(--spacing)*5.5)}.min-w-10\.5{min-width:calc(var(--spacing)*10.5)}.-translate-x-1\/2{--tw-translate-x: -50% ;translate:var(--tw-translate-x)var(--tw-translate-y)}.translate-x-1\/2{--tw-translate-x: 50% ;translate:var(--tw-translate-x)var(--tw-translate-y)}.translate-x-\[calc\(100\%-2px\)\]{--tw-translate-x: calc(100% - 2px) ;translate:var(--tw-translate-x)var(--tw-translate-y)}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.cursor-not-allowed\!{cursor:not-allowed!important}.cursor-pointer{cursor:pointer}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-evenly{justify-content:space-evenly}.gap-1{gap:calc(var(--spacing)*1)}.gap-2{gap:calc(var(--spacing)*2)}.gap-3{gap:calc(var(--spacing)*3)}.gap-4{gap:calc(var(--spacing)*4)}.gap-5{gap:calc(var(--spacing)*5)}.gap-6{gap:calc(var(--spacing)*6)}.self-start{align-self:flex-start}.rounded-full{border-radius:3.40282e38px}.rounded-full\!{border-radius:3.40282e38px!important}.rounded-lg{border-radius:var(--radius-lg)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-l-5{border-left-style:var(--tw-border-style);border-left-width:5px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\[\#13DAEC\]{border-color:#13daec}.border-pico-text-secondary\/50{border-color:#52637780}@supports (color:color-mix(in lab,red,red)){.border-pico-text-secondary\/50{border-color:color-mix(in oklab,var(--color-pico-text-secondary)50%,transparent)}}.border-white{border-color:var(--color-white)}.bg-pico-bg{background-color:var(--color-pico-bg)}.bg-pico-bg-elevated{background-color:var(--color-pico-bg-elevated)}.bg-pico-bg-elevated\!{background-color:var(--color-pico-bg-elevated)!important}.bg-pico-border{background-color:var(--color-pico-border)}.bg-pico-error-bg\!{background-color:var(--color-pico-error-bg)!important}.bg-pico-input-bg{background-color:var(--color-pico-input-bg)}.bg-pico-primary{background-color:var(--color-pico-primary)}.bg-pico-primary\/20{background-color:#13c8ec33}@supports (color:color-mix(in lab,red,red)){.bg-pico-primary\/20{background-color:color-mix(in oklab,var(--color-pico-primary)20%,transparent)}}.bg-pico-secondary{background-color:var(--color-pico-secondary)}.bg-pico-text-secondary{background-color:var(--color-pico-text-secondary)}.bg-white{background-color:var(--color-white)}.p-0\.5{padding:calc(var(--spacing)*.5)}.p-2{padding:calc(var(--spacing)*2)}.p-4{padding:calc(var(--spacing)*4)}.p-8{padding:calc(var(--spacing)*8)}.p-10{padding:calc(var(--spacing)*10)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.px-8\.5{padding-inline:calc(var(--spacing)*8.5)}.py-0\.5{padding-block:calc(var(--spacing)*.5)}.py-1\.5{padding-block:calc(var(--spacing)*1.5)}.py-2{padding-block:calc(var(--spacing)*2)}.py-2\.5{padding-block:calc(var(--spacing)*2.5)}.py-3\.5{padding-block:calc(var(--spacing)*3.5)}.text-center{text-align:center}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-sm\/none{font-size:var(--text-sm);line-height:1}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-md{font-size:var(--text-md)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-pico-border{color:var(--color-pico-border)}.text-pico-error{color:var(--color-pico-error)}.text-pico-error\!{color:var(--color-pico-error)!important}.text-pico-primary{color:var(--color-pico-primary)}.text-pico-primary\!{color:var(--color-pico-primary)!important}.text-pico-text{color:var(--color-pico-text)}.text-pico-text-secondary{color:var(--color-pico-text-secondary)}.text-pico-text-secondary\!{color:var(--color-pico-text-secondary)!important}.text-pico-text-secondary\/70\!{color:#526377b3!important}@supports (color:color-mix(in lab,red,red)){.text-pico-text-secondary\/70\!{color:color-mix(in oklab,var(--color-pico-text-secondary)70%,transparent)!important}}.text-pico-text\/90{color:#17212be6}@supports (color:color-mix(in lab,red,red)){.text-pico-text\/90{color:color-mix(in oklab,var(--color-pico-text)90%,transparent)}}.text-white{color:var(--color-white)}.opacity-0{opacity:0}.shadow-primary{--tw-shadow:0px 10px 15px var(--tw-shadow-color,-3px)#13c8ec33}@supports (color:color-mix(in lab,red,red)){.shadow-primary{--tw-shadow:0px 10px 15px var(--tw-shadow-color,-3px)color-mix(in srgb,var(--color-pico-primary)20%,transparent)}}.shadow-primary{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-secondary{--tw-shadow:0px 10px 15px var(--tw-shadow-color,-3px)#3b82f633}@supports (color:color-mix(in lab,red,red)){.shadow-secondary{--tw-shadow:0px 10px 15px var(--tw-shadow-color,-3px)color-mix(in srgb,var(--color-pico-secondary)20%,transparent)}}.shadow-secondary{box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.outline-0\!{outline-style:var(--tw-outline-style)!important;outline-width:0!important}.outline-1{outline-style:var(--tw-outline-style);outline-width:1px}.outline-2{outline-style:var(--tw-outline-style);outline-width:2px}.-outline-offset-2{outline-offset:-2px}.outline-pico-border{outline-color:var(--color-pico-border)}.outline-pico-error\!{outline-color:var(--color-pico-error)!important}.outline-pico-primary{outline-color:var(--color-pico-primary)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-300{--tw-duration:.3s;transition-duration:.3s}.will-change-transform{will-change:transform}.select-none{-webkit-user-select:none;user-select:none}@media(hover:hover){.group-hover\:bg-pico-primary\/70:is(:where(.group):hover *){background-color:#13c8ecb3}@supports (color:color-mix(in lab,red,red)){.group-hover\:bg-pico-primary\/70:is(:where(.group):hover *){background-color:color-mix(in oklab,var(--color-pico-primary)70%,transparent)}}.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}.focus-within\:text-pico-text:focus-within{color:var(--color-pico-text)}.focus-within\:outline-pico-primary:focus-within{outline-color:var(--color-pico-primary)}@media(hover:hover){.hover\:brightness-80:hover{--tw-brightness:brightness(80%);filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}}.pico-header-1{color:var(--color-pico-text);font-size:3rem;font-weight:700;line-height:1.2}.pico-header-2{color:var(--color-pico-text);font-size:2.25rem;font-weight:600;line-height:1.2}.pico-header-3{color:var(--color-pico-text);font-size:1.875rem;font-weight:400;line-height:1.2}.pico-text-large{color:var(--color-pico-text);font-size:1.125rem;font-weight:400;line-height:1.25}.pico-text-medium{color:var(--color-pico-text);font-size:1rem;font-weight:400;line-height:1.25}.pico-text-small{color:var(--color-pico-text);font-size:.875rem;font-weight:400;line-height:1.25}.pico-text-caption{color:var(--color-pico-text-secondary);font-size:.75rem;font-weight:400;line-height:1.25}}.pico-dark-theme{--color-pico-skeleton-glow:#3b3d41!important;--color-pico-bg:#050505!important;--color-pico-bg-secondary:#0d0d0d!important;--color-pico-bg-tertiary:#141414!important;--color-pico-bg-elevated:#1a1a1a!important;--color-pico-border:#242424!important;--color-pico-border-hover:#303030!important;--color-pico-text:#d4d4d4!important;--color-pico-text-secondary:#a3a3a3!important;--color-pico-text-muted:#7a7a7a!important;--color-pico-text-disabled:#525252!important;--color-pico-input-bg:#101010!important;--color-pico-input-border:#242424!important;--color-pico-input-focus:#3b82f6!important;--color-pico-success:#22c55e!important;--color-pico-warning:#f59e0b!important;--color-pico-error:#ef4444!important;--color-pico-info:#38bdf8!important;--color-pico-error-bg:#1f1c1c!important;--color-pico-overlay:#0009!important}body{font-family:Inter,sans-serif}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-duration{syntax:"*";inherits:false}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}.pico-skeleton[data-v-caab53ad]{background:linear-gradient(70deg,var(--color-pico-border) 30%,var(--color-pico-skeleton-glow),var(--color-pico-border) 70%);background-size:200% 100%;animation:skeleton-caab53ad 1.5s infinite linear}@keyframes skeleton-caab53ad{0%{background-position:100% 0}to{background-position:-100% 0}}.pico-toast[data-v-b851dd3c]{animation:1 alternate var(--toast-duration) toast-b851dd3c}@keyframes toast-b851dd3c{0%{width:0px}to{width:100%}}.list-move[data-v-421b01f2],.list-enter-active[data-v-421b01f2],.list-leave-active[data-v-421b01f2]{transition:all .5s ease}.list-enter-from[data-v-421b01f2],.list-leave-to[data-v-421b01f2]{opacity:0;transform:translate(30px)}.list-leave-active[data-v-421b01f2]{position:absolute}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cbutep_n/pico-ui",
   "private": false,
-  "version": "0.0.9",
+  "version": "0.0.11",
   "publishConfig": {
     "access": "public"
   },
@@ -48,7 +48,8 @@
     "tailwindcss": "^4.1.18",
     "valibot": "^1.2.0",
     "vee-validate": "^4.15.1",
-    "vue": "^3.5.25"
+    "vue": "^3.5.25",
+    "@vueuse/core": "^14.3.0"
   },
   "devDependencies": {
     "@types/node": "^24.10.1",