@1337exp/taoui 1.0.0

package/dist/index.cjs

@@ -0,0 +1,1745 @@
+(function(global, factory) {
+  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("vue")) : typeof define === "function" && define.amd ? define(["exports", "vue"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.TaoUI = {}, global.Vue));
+})(this, function(exports2, vue) {
+  "use strict";
+  const _hoisted_1$h = ["type", "disabled"];
+  const _hoisted_2$f = {
+    key: 0,
+    class: "tao-button__loader"
+  };
+  const _hoisted_3$9 = {
+    key: 1,
+    class: "tao-button__icon"
+  };
+  const _hoisted_4$6 = { class: "tao-button__content" };
+  const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoButton",
+    props: {
+      type: { default: "button" },
+      size: { default: "medium" },
+      variant: { default: "primary" },
+      disabled: { type: Boolean, default: false },
+      loading: { type: Boolean, default: false },
+      block: { type: Boolean, default: false },
+      icon: { default: "" }
+    },
+    emits: ["click"],
+    setup(__props, { emit: __emit }) {
+      const props = __props;
+      const emit = __emit;
+      function handleClick(event) {
+        if (!props.disabled && !props.loading) {
+          emit("click", event);
+        }
+      }
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("button", {
+          class: vue.normalizeClass(["tao-button", [
+            `tao-button--${__props.size}`,
+            `tao-button--${__props.variant}`,
+            {
+              "tao-button--disabled": __props.disabled,
+              "tao-button--loading": __props.loading,
+              "tao-button--block": __props.block,
+              "tao-button--icon": !!__props.icon
+            }
+          ]]),
+          type: __props.type,
+          disabled: __props.disabled || __props.loading,
+          onClick: handleClick
+        }, [
+          __props.loading ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$f)) : vue.createCommentVNode("", true),
+          __props.icon ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$9, vue.toDisplayString(__props.icon), 1)) : vue.createCommentVNode("", true),
+          vue.createElementVNode("span", _hoisted_4$6, [
+            vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+          ])
+        ], 10, _hoisted_1$h);
+      };
+    }
+  });
+  const _export_sfc = (sfc, props) => {
+    const target = sfc.__vccOpts || sfc;
+    for (const [key, val] of props) {
+      target[key] = val;
+    }
+    return target;
+  };
+  const TaoButton = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["__scopeId", "data-v-0e8431c3"]]);
+  const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoBlock",
+    props: {
+      padding: { default: 16 },
+      radius: { default: 8 },
+      shadow: { type: Boolean, default: true },
+      hover: { type: Boolean, default: false }
+    },
+    setup(__props) {
+      const props = __props;
+      const paddingStyle = vue.computed(() => {
+        if (Array.isArray(props.padding)) {
+          return {
+            padding: `${props.padding.map((p) => `${p}px`).join(" ")}`
+          };
+        }
+        return { padding: `${props.padding}px` };
+      });
+      const radiusStyle = vue.computed(() => ({
+        borderRadius: `${props.radius}px`
+      }));
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", {
+          class: vue.normalizeClass(["tao-block", { "tao-block--shadow": __props.shadow, "tao-block--hover": __props.hover }]),
+          style: vue.normalizeStyle([paddingStyle.value, radiusStyle.value])
+        }, [
+          vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+        ], 6);
+      };
+    }
+  });
+  const TaoBlock = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["__scopeId", "data-v-4d014dd0"]]);
+  const _hoisted_1$g = { class: "tao-input-wrapper" };
+  const _hoisted_2$e = {
+    key: 0,
+    class: "tao-input__label"
+  };
+  const _hoisted_3$8 = ["type", "value", "placeholder", "disabled"];
+  const _hoisted_4$5 = {
+    key: 1,
+    class: "tao-input__error"
+  };
+  const _sfc_main$o = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoInput",
+    props: {
+      modelValue: {},
+      type: { default: "text" },
+      placeholder: { default: "" },
+      disabled: { type: Boolean, default: false },
+      error: { type: Boolean, default: false },
+      errorMessage: { default: "" },
+      label: { default: "" }
+    },
+    emits: ["update:modelValue", "blur", "focus"],
+    setup(__props, { emit: __emit }) {
+      const emit = __emit;
+      function handleInput(event) {
+        const target = event.target;
+        emit("update:modelValue", target.value);
+      }
+      function handleBlur(event) {
+        emit("blur", event);
+      }
+      function handleFocus(event) {
+        emit("focus", event);
+      }
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$g, [
+          __props.label ? (vue.openBlock(), vue.createElementBlock("label", _hoisted_2$e, vue.toDisplayString(__props.label), 1)) : vue.createCommentVNode("", true),
+          vue.createElementVNode("input", {
+            class: vue.normalizeClass(["tao-input", { "tao-input--error": __props.error }]),
+            type: __props.type,
+            value: __props.modelValue,
+            placeholder: __props.placeholder,
+            disabled: __props.disabled,
+            onInput: handleInput,
+            onBlur: handleBlur,
+            onFocus: handleFocus
+          }, null, 42, _hoisted_3$8),
+          __props.error && __props.errorMessage ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$5, vue.toDisplayString(__props.errorMessage), 1)) : vue.createCommentVNode("", true)
+        ]);
+      };
+    }
+  });
+  const TaoInput = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["__scopeId", "data-v-c742d574"]]);
+  const _hoisted_1$f = {
+    key: 0,
+    class: "tao-card__cover"
+  };
+  const _hoisted_2$d = {
+    key: 0,
+    class: "tao-card__header-title"
+  };
+  const _hoisted_3$7 = { key: 0 };
+  const _hoisted_4$4 = {
+    key: 2,
+    class: "tao-card__title-block"
+  };
+  const _hoisted_5$2 = {
+    key: 0,
+    class: "tao-card__title"
+  };
+  const _hoisted_6$1 = {
+    key: 1,
+    class: "tao-card__sub"
+  };
+  const _hoisted_7 = {
+    key: 3,
+    class: "tao-card__body"
+  };
+  const _hoisted_8 = {
+    key: 4,
+    class: "tao-card__footer"
+  };
+  const _sfc_main$n = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoCard",
+    props: {
+      padding: { default: 20 },
+      radius: { default: 8 },
+      shadow: { type: Boolean, default: true },
+      shadowBottomOnly: { type: Boolean, default: false },
+      hover: { type: Boolean, default: false },
+      active: { type: Boolean, default: false },
+      overflow: { type: Boolean, default: false }
+    },
+    setup(__props) {
+      const props = __props;
+      const paddingStyle = vue.computed(() => {
+        if (Array.isArray(props.padding)) {
+          return { padding: `${props.padding.map((p) => `${p}px`).join(" ")}` };
+        }
+        return { padding: `${props.padding}px` };
+      });
+      const radiusStyle = vue.computed(() => ({ borderRadius: `${props.radius}px` }));
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", {
+          class: vue.normalizeClass(["tao-card", {
+            "tao-card--shadow": __props.shadow && !__props.shadowBottomOnly,
+            "tao-card--shadow-bottom": __props.shadowBottomOnly,
+            "tao-card--hover": __props.hover,
+            "tao-card--active": __props.active,
+            "tao-card--overflow": __props.overflow
+          }]),
+          style: vue.normalizeStyle(radiusStyle.value)
+        }, [
+          _ctx.$slots.cover ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$f, [
+            vue.renderSlot(_ctx.$slots, "cover", {}, void 0, true)
+          ])) : vue.createCommentVNode("", true),
+          vue.createElementVNode("div", {
+            class: "tao-card__content",
+            style: vue.normalizeStyle(paddingStyle.value)
+          }, [
+            _ctx.$slots.headerTitle ? (vue.openBlock(), vue.createElementBlock("h2", _hoisted_2$d, [
+              vue.renderSlot(_ctx.$slots, "headerTitle", {}, void 0, true)
+            ])) : vue.createCommentVNode("", true),
+            _ctx.$slots.header || _ctx.$slots.headerSecondary ? (vue.openBlock(), vue.createElementBlock("div", {
+              key: 1,
+              class: vue.normalizeClass(["tao-card__header", { "tao-card__header--between": _ctx.$slots.headerSecondary }])
+            }, [
+              vue.createElementVNode("span", null, [
+                vue.renderSlot(_ctx.$slots, "header", {}, void 0, true)
+              ]),
+              _ctx.$slots.headerSecondary ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$7, [
+                vue.renderSlot(_ctx.$slots, "headerSecondary", {}, void 0, true)
+              ])) : vue.createCommentVNode("", true)
+            ], 2)) : vue.createCommentVNode("", true),
+            _ctx.$slots.title || _ctx.$slots.sub ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$4, [
+              _ctx.$slots.title ? (vue.openBlock(), vue.createElementBlock("h2", _hoisted_5$2, [
+                vue.renderSlot(_ctx.$slots, "title", {}, void 0, true)
+              ])) : vue.createCommentVNode("", true),
+              _ctx.$slots.sub ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$1, [
+                vue.renderSlot(_ctx.$slots, "sub", {}, void 0, true)
+              ])) : vue.createCommentVNode("", true)
+            ])) : vue.createCommentVNode("", true),
+            _ctx.$slots.default ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7, [
+              vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+            ])) : vue.createCommentVNode("", true),
+            _ctx.$slots.footer ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_8, [
+              vue.renderSlot(_ctx.$slots, "footer", {}, void 0, true)
+            ])) : vue.createCommentVNode("", true)
+          ], 4)
+        ], 6);
+      };
+    }
+  });
+  const TaoCard = /* @__PURE__ */ _export_sfc(_sfc_main$n, [["__scopeId", "data-v-b752c7cb"]]);
+  const _hoisted_1$e = { class: "tao-modal" };
+  const _hoisted_2$c = {
+    key: 0,
+    class: "tao-modal__header"
+  };
+  const _hoisted_3$6 = { class: "tao-modal__title" };
+  const _hoisted_4$3 = { class: "tao-modal__content" };
+  const _hoisted_5$1 = {
+    key: 1,
+    class: "tao-modal__footer"
+  };
+  const _sfc_main$m = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoModal",
+    props: {
+      modelValue: { type: Boolean },
+      title: { default: "" },
+      closable: { type: Boolean, default: true }
+    },
+    emits: ["update:modelValue", "close"],
+    setup(__props, { emit: __emit }) {
+      const props = __props;
+      const emit = __emit;
+      function close() {
+        emit("update:modelValue", false);
+        emit("close");
+      }
+      let previousOverflow = "";
+      function lockBodyScroll() {
+        previousOverflow = document.body.style.overflow;
+        document.body.style.overflow = "hidden";
+      }
+      function unlockBodyScroll() {
+        document.body.style.overflow = previousOverflow;
+      }
+      vue.watch(
+        () => props.modelValue,
+        (isOpen) => {
+          if (isOpen) {
+            lockBodyScroll();
+          } else {
+            unlockBodyScroll();
+          }
+        },
+        { immediate: true }
+      );
+      vue.onBeforeUnmount(() => {
+        if (props.modelValue) {
+          unlockBodyScroll();
+        }
+      });
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createBlock(vue.Teleport, { to: "body" }, [
+          vue.createVNode(vue.Transition, { name: "tao-modal-fade" }, {
+            default: vue.withCtx(() => [
+              __props.modelValue ? (vue.openBlock(), vue.createElementBlock("div", {
+                key: 0,
+                class: "tao-modal-overlay",
+                onClick: _cache[0] || (_cache[0] = vue.withModifiers(($event) => __props.closable && close(), ["self"]))
+              }, [
+                vue.createElementVNode("div", _hoisted_1$e, [
+                  __props.title || _ctx.$slots.header ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$c, [
+                    vue.renderSlot(_ctx.$slots, "header", {}, () => [
+                      vue.createElementVNode("h2", _hoisted_3$6, vue.toDisplayString(__props.title), 1)
+                    ], true),
+                    __props.closable ? (vue.openBlock(), vue.createElementBlock("button", {
+                      key: 0,
+                      class: "tao-modal__close",
+                      onClick: close
+                    }, "×")) : vue.createCommentVNode("", true)
+                  ])) : vue.createCommentVNode("", true),
+                  vue.createElementVNode("div", _hoisted_4$3, [
+                    vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+                  ]),
+                  _ctx.$slots.footer ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$1, [
+                    vue.renderSlot(_ctx.$slots, "footer", {}, void 0, true)
+                  ])) : vue.createCommentVNode("", true)
+                ])
+              ])) : vue.createCommentVNode("", true)
+            ]),
+            _: 3
+          })
+        ]);
+      };
+    }
+  });
+  const TaoModal = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["__scopeId", "data-v-4746b5a3"]]);
+  const _hoisted_1$d = { class: "tao-tabs" };
+  const _hoisted_2$b = { class: "tao-tabs__list" };
+  const _hoisted_3$5 = ["onClick"];
+  const _hoisted_4$2 = { key: 0 };
+  const _hoisted_5 = { key: 1 };
+  const _hoisted_6 = { class: "tao-tabs__content" };
+  const _sfc_main$l = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoTabs",
+    props: {
+      tabs: {},
+      modelValue: {}
+    },
+    emits: ["update:modelValue"],
+    setup(__props, { emit: __emit }) {
+      const props = __props;
+      const emit = __emit;
+      function selectTab(key) {
+        const tab = props.tabs.find((t) => t.key === key);
+        if (tab && !tab.disabled) {
+          emit("update:modelValue", key);
+        }
+      }
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$d, [
+          vue.createElementVNode("ul", _hoisted_2$b, [
+            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.tabs, (tab) => {
+              return vue.openBlock(), vue.createElementBlock("li", {
+                key: tab.key,
+                class: vue.normalizeClass({ active: tab.key === __props.modelValue, disabled: tab.disabled }),
+                onClick: ($event) => selectTab(tab.key)
+              }, [
+                _ctx.$slots.label ? (vue.openBlock(), vue.createElementBlock("a", _hoisted_4$2, [
+                  vue.renderSlot(_ctx.$slots, "label", {
+                    text: tab.label,
+                    value: tab.key
+                  }, void 0, true)
+                ])) : (vue.openBlock(), vue.createElementBlock("a", _hoisted_5, vue.toDisplayString(tab.label), 1))
+              ], 10, _hoisted_3$5);
+            }), 128))
+          ]),
+          vue.createElementVNode("div", _hoisted_6, [
+            vue.renderSlot(_ctx.$slots, "default", { activeTab: __props.modelValue }, void 0, true)
+          ])
+        ]);
+      };
+    }
+  });
+  const TaoTabs = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__scopeId", "data-v-90a6a489"]]);
+  const _sfc_main$k = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoTooltip",
+    props: {
+      content: {},
+      position: { default: "top" }
+    },
+    setup(__props) {
+      const showTooltip = vue.ref(false);
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", {
+          class: "tao-tooltip-wrapper",
+          onMouseenter: _cache[0] || (_cache[0] = ($event) => showTooltip.value = true),
+          onMouseleave: _cache[1] || (_cache[1] = ($event) => showTooltip.value = false)
+        }, [
+          vue.renderSlot(_ctx.$slots, "default", {}, void 0, true),
+          vue.createVNode(vue.Transition, { name: "tao-tooltip-fade" }, {
+            default: vue.withCtx(() => [
+              showTooltip.value ? (vue.openBlock(), vue.createElementBlock("div", {
+                key: 0,
+                class: vue.normalizeClass(["tao-tooltip", [`tao-tooltip--${__props.position}`]])
+              }, vue.toDisplayString(__props.content), 3)) : vue.createCommentVNode("", true)
+            ]),
+            _: 1
+          })
+        ], 32);
+      };
+    }
+  });
+  const TaoTooltip = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-a22f010b"]]);
+  const _hoisted_1$c = { class: "tao-spoiler" };
+  const _hoisted_2$a = {
+    key: 0,
+    class: "tao-spoiler__title"
+  };
+  const _hoisted_3$4 = {
+    key: 0,
+    class: "tao-spoiler__content"
+  };
+  const _hoisted_4$1 = { class: "tao-spoiler__content-inner" };
+  const _sfc_main$j = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoSpoiler",
+    props: {
+      title: { default: "" },
+      defaultOpen: { type: Boolean, default: false }
+    },
+    setup(__props) {
+      const props = __props;
+      const isOpen = vue.ref(props.defaultOpen);
+      function toggle() {
+        isOpen.value = !isOpen.value;
+      }
+      function onBeforeEnter(el) {
+        el.style.height = "0";
+      }
+      function onEnter(el) {
+        const element = el;
+        requestAnimationFrame(() => {
+          element.style.height = `${element.scrollHeight}px`;
+        });
+      }
+      function onAfterEnter(el) {
+        el.style.height = "auto";
+      }
+      function onLeave(el) {
+        const element = el;
+        element.style.height = `${element.scrollHeight}px`;
+        requestAnimationFrame(() => {
+          element.style.height = "0";
+        });
+      }
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$c, [
+          vue.createElementVNode("button", {
+            class: "tao-spoiler__header",
+            onClick: toggle
+          }, [
+            vue.createElementVNode("span", {
+              class: vue.normalizeClass(["tao-spoiler__icon", { "tao-spoiler__icon--open": isOpen.value }])
+            }, "▶", 2),
+            __props.title || _ctx.$slots.title ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$a, [
+              vue.renderSlot(_ctx.$slots, "title", {}, () => [
+                vue.createTextVNode(vue.toDisplayString(__props.title), 1)
+              ], true)
+            ])) : vue.createCommentVNode("", true)
+          ]),
+          vue.createVNode(vue.Transition, {
+            name: "tao-spoiler-slide",
+            onBeforeEnter,
+            onEnter,
+            onAfterEnter,
+            onLeave
+          }, {
+            default: vue.withCtx(() => [
+              isOpen.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$4, [
+                vue.createElementVNode("div", _hoisted_4$1, [
+                  vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+                ])
+              ])) : vue.createCommentVNode("", true)
+            ]),
+            _: 3
+          })
+        ]);
+      };
+    }
+  });
+  const TaoSpoiler = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-061480fb"]]);
+  const _hoisted_1$b = { class: "tao-copy" };
+  const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoCopy",
+    props: {
+      text: {},
+      successMessage: { default: "Скопировано!" }
+    },
+    setup(__props) {
+      const props = __props;
+      const copied = vue.ref(false);
+      let timeoutId;
+      async function copy() {
+        try {
+          await navigator.clipboard.writeText(props.text);
+          copied.value = true;
+          clearTimeout(timeoutId);
+          timeoutId = setTimeout(() => {
+            copied.value = false;
+          }, 2e3);
+        } catch (err) {
+          console.error("Failed to copy:", err);
+        }
+      }
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$b, [
+          vue.renderSlot(_ctx.$slots, "default", {
+            copy,
+            copied: copied.value
+          }, () => [
+            vue.createElementVNode("button", {
+              class: vue.normalizeClass(["tao-copy__button", { "tao-copy__button--copied": copied.value }]),
+              onClick: copy
+            }, vue.toDisplayString(copied.value ? __props.successMessage : "Копировать"), 3)
+          ], true)
+        ]);
+      };
+    }
+  });
+  const TaoCopy = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-810f1bc7"]]);
+  const _sfc_main$h = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoContainer",
+    props: {
+      size: { default: "wide" },
+      free: { type: Boolean, default: false }
+    },
+    setup(__props) {
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", {
+          class: vue.normalizeClass(["tao-container", [`tao-container--${__props.size}`, { "tao-container--center": !__props.free }]])
+        }, [
+          vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+        ], 2);
+      };
+    }
+  });
+  const TaoContainer = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-e2ebdf8f"]]);
+  const _sfc_main$g = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoFlex",
+    props: {
+      tag: { default: "div" },
+      justify: { default: "flex-start" },
+      align: { default: "stretch" },
+      direction: { default: "row" },
+      wrap: { default: "nowrap" },
+      gap: { default: "0px" }
+    },
+    setup(__props) {
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(__props.tag), {
+          style: vue.normalizeStyle({
+            display: "flex",
+            justifyContent: __props.justify,
+            alignItems: __props.align,
+            flexDirection: __props.direction,
+            flexWrap: __props.wrap,
+            gap: __props.gap
+          })
+        }, {
+          default: vue.withCtx(() => [
+            vue.renderSlot(_ctx.$slots, "default")
+          ]),
+          _: 3
+        }, 8, ["style"]);
+      };
+    }
+  });
+  const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoSpace",
+    props: {
+      block: { type: Boolean, default: false },
+      expand: { type: Boolean, default: false },
+      vertical: { type: Boolean, default: false }
+    },
+    setup(__props) {
+      const props = __props;
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", {
+          class: vue.normalizeClass(["tao-space", { "tao-space--vertical": props.vertical }]),
+          style: vue.normalizeStyle([props.block ? "display: flex; flex-wrap: initial;" : "", props.expand ? "width: 100%" : ""])
+        }, [
+          vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+        ], 6);
+      };
+    }
+  });
+  const TaoSpace = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-4190f6ba"]]);
+  const _hoisted_1$a = { class: "tao-icon" };
+  const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoIcon",
+    props: {
+      name: {},
+      margin: { default: "0px" },
+      size: {},
+      invert: { type: Boolean }
+    },
+    setup(__props) {
+      vue.useCssVars((_ctx) => ({
+        "v2b130076": props.margin
+      }));
+      const props = __props;
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("span", _hoisted_1$a, [
+          vue.renderSlot(_ctx.$slots, "prefix", {}, void 0, true),
+          vue.createElementVNode("i", {
+            class: vue.normalizeClass(["tao-icon__value", [`icon-${props.name}`, { "tao-icon__value--invert": props.invert }]]),
+            style: vue.normalizeStyle(props.size ? `font-size: ${props.size}px` : "")
+          }, null, 6),
+          vue.renderSlot(_ctx.$slots, "postfix", {}, void 0, true)
+        ]);
+      };
+    }
+  });
+  const TaoIcon = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-b561364f"]]);
+  const _sfc_main$d = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoLoader",
+    props: {
+      color: { default: "var(--tao-color-accent)" },
+      size: { default: 80 },
+      inline: { type: Boolean, default: false }
+    },
+    setup(__props) {
+      vue.useCssVars((_ctx) => ({
+        "v052ed61b": positions.value.first,
+        "v05f388d2": positions.value.third,
+        "bdfc57e2": positions.value.fourth,
+        "v50ec8284": positions.value.animationDistance
+      }));
+      const props = __props;
+      const normalizedSize = vue.computed(() => {
+        if (typeof props.size === "number") {
+          return `${props.size}px`;
+        }
+        return props.size;
+      });
+      const dotSizeNumber = vue.computed(() => {
+        const baseSize = typeof props.size === "number" ? props.size : parseInt(props.size, 10) || 80;
+        return baseSize * 0.1625;
+      });
+      const dotSize = vue.computed(() => `${dotSizeNumber.value}px`);
+      const positions = vue.computed(() => {
+        const baseSize = typeof props.size === "number" ? props.size : parseInt(props.size, 10) || 80;
+        return {
+          first: `${baseSize * 0.1}px`,
+          third: `${baseSize * 0.4}px`,
+          fourth: `${baseSize * 0.7}px`,
+          animationDistance: `${baseSize * 0.3}px`
+        };
+      });
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", {
+          class: vue.normalizeClass(["tao-loader", { "tao-loader--inline": props.inline }])
+        }, [
+          vue.createElementVNode("div", {
+            class: "tao-loader__ellipsis",
+            style: vue.normalizeStyle({ width: normalizedSize.value, height: dotSize.value, marginLeft: `-${dotSizeNumber.value / 2}px` })
+          }, [
+            vue.createElementVNode("div", {
+              style: vue.normalizeStyle({ background: props.color, width: dotSize.value, height: dotSize.value })
+            }, null, 4),
+            vue.createElementVNode("div", {
+              style: vue.normalizeStyle({ background: props.color, width: dotSize.value, height: dotSize.value })
+            }, null, 4),
+            vue.createElementVNode("div", {
+              style: vue.normalizeStyle({ background: props.color, width: dotSize.value, height: dotSize.value })
+            }, null, 4),
+            vue.createElementVNode("div", {
+              style: vue.normalizeStyle({ background: props.color, width: dotSize.value, height: dotSize.value })
+            }, null, 4)
+          ], 4)
+        ], 2);
+      };
+    }
+  });
+  const TaoLoader = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-3a29f095"]]);
+  const _hoisted_1$9 = { class: "tao-image" };
+  const _hoisted_2$9 = ["src", "alt"];
+  const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoImage",
+    props: {
+      src: { default: "" },
+      alt: { default: "" },
+      pixelated: { type: Boolean, default: false }
+    },
+    emits: ["load", "error"],
+    setup(__props, { emit: __emit }) {
+      const props = __props;
+      const emit = __emit;
+      const isLoaded = vue.ref(false);
+      function handleLoad() {
+        isLoaded.value = true;
+        emit("load");
+      }
+      function handleError() {
+        isLoaded.value = false;
+        emit("error");
+      }
+      vue.watch(() => props.src, () => {
+        isLoaded.value = false;
+      });
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$9, [
+          __props.src ? (vue.openBlock(), vue.createElementBlock("img", {
+            key: 0,
+            class: vue.normalizeClass({ "tao-image__img--hidden": !isLoaded.value, "tao-image__img--pixelated": props.pixelated }),
+            src: __props.src,
+            alt: __props.alt,
+            draggable: "false",
+            onLoad: handleLoad,
+            onError: handleError
+          }, null, 42, _hoisted_2$9)) : vue.renderSlot(_ctx.$slots, "default", {}, () => [
+            _cache[0] || (_cache[0] = vue.createElementVNode("div", { class: "tao-image__placeholder" }, "No image available", -1))
+          ], true, 1)
+        ]);
+      };
+    }
+  });
+  const TaoImage = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["__scopeId", "data-v-8272e203"]]);
+  const _hoisted_1$8 = ["checked", "disabled"];
+  const _hoisted_2$8 = {
+    key: 0,
+    class: "tao-checkbox__label"
+  };
+  const _hoisted_3$3 = {
+    key: 1,
+    class: "tao-checkbox__label"
+  };
+  const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoCheckbox",
+    props: {
+      value: { type: Boolean, default: void 0 },
+      modelValue: { type: Boolean, default: void 0 },
+      label: { default: "" },
+      disabled: { type: Boolean, default: false }
+    },
+    emits: ["update:modelValue", "change"],
+    setup(__props, { emit: __emit }) {
+      const props = __props;
+      const emit = __emit;
+      const isChecked = vue.computed({
+        get: () => {
+          if (props.modelValue !== void 0) {
+            return props.modelValue;
+          }
+          return props.value;
+        },
+        set: (value) => {
+          if (props.modelValue !== void 0) {
+            emit("update:modelValue", value);
+          }
+          emit("change", value);
+        }
+      });
+      function onInputChange(event) {
+        if (props.disabled) {
+          return;
+        }
+        const target = event.target;
+        isChecked.value = target.checked;
+      }
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("label", {
+          class: vue.normalizeClass(["tao-checkbox", { "tao-checkbox--disabled": props.disabled }])
+        }, [
+          vue.renderSlot(_ctx.$slots, "pre", {
+            text: props.label
+          }, void 0, true),
+          vue.createElementVNode("input", {
+            class: "tao-checkbox__input",
+            type: "checkbox",
+            checked: isChecked.value,
+            disabled: props.disabled,
+            onChange: onInputChange
+          }, null, 40, _hoisted_1$8),
+          _cache[0] || (_cache[0] = vue.createElementVNode("span", { class: "tao-checkbox__box" }, null, -1)),
+          props.label ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$8, vue.toDisplayString(props.label), 1)) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$3, [
+            vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+          ])),
+          vue.renderSlot(_ctx.$slots, "post", {
+            text: props.label
+          }, void 0, true)
+        ], 2);
+      };
+    }
+  });
+  const TaoCheckbox = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-0ece6da0"]]);
+  const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoTag",
+    props: {
+      type: { default: "" },
+      color: {},
+      background: {},
+      borderColor: {},
+      pointer: { type: Boolean, default: false }
+    },
+    setup(__props) {
+      const props = __props;
+      const style = vue.computed(() => ({
+        color: props.color || "",
+        background: props.background || "",
+        "border-color": props.borderColor || ""
+      }));
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", {
+          class: vue.normalizeClass(["tao-tag", [props.pointer && "tao-tag--pointer", props.type ? `tao-tag--${props.type}` : ""]]),
+          style: vue.normalizeStyle(style.value)
+        }, [
+          vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+        ], 6);
+      };
+    }
+  });
+  const TaoTag = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-f615cf3c"]]);
+  const _hoisted_1$7 = {
+    key: 1,
+    class: "tao-divider-text"
+  };
+  const _hoisted_2$7 = { class: "tao-divider-text__value" };
+  const _hoisted_3$2 = {
+    key: 2,
+    class: "tao-divider-line"
+  };
+  const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoDivider",
+    props: {
+      variant: { default: "line" },
+      size: { default: "medium" }
+    },
+    setup(__props) {
+      return (_ctx, _cache) => {
+        return __props.variant === "gap" ? (vue.openBlock(), vue.createElementBlock("div", {
+          key: 0,
+          class: vue.normalizeClass(["tao-divider-gap", `tao-divider-gap--${__props.size}`])
+        }, null, 2)) : __props.variant === "text" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$7, [
+          _cache[0] || (_cache[0] = vue.createElementVNode("span", { class: "tao-divider-text__line tao-divider-text__line--left" }, null, -1)),
+          vue.createElementVNode("span", _hoisted_2$7, [
+            vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+          ]),
+          _cache[1] || (_cache[1] = vue.createElementVNode("span", { class: "tao-divider-text__line tao-divider-text__line--right" }, null, -1))
+        ])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$2));
+      };
+    }
+  });
+  const TaoDivider = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-9db02640"]]);
+  const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoAnimatedBorder",
+    props: {
+      borderWidth: { default: 3 },
+      speed: { default: 6 },
+      glow: { default: 16 },
+      light: { type: Boolean, default: false }
+    },
+    setup(__props) {
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", {
+          class: vue.normalizeClass(["tao-animated-border", { "tao-animated-border--light": __props.light }]),
+          style: vue.normalizeStyle({
+            "--tao-animated-border-width": `${__props.borderWidth}px`,
+            "--tao-animated-border-speed": `${__props.speed}s`,
+            "--tao-animated-border-glow": `${__props.glow}px`
+          })
+        }, [
+          vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+        ], 6);
+      };
+    }
+  });
+  const TaoAnimatedBorder = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-4ca22c09"]]);
+  const _hoisted_1$6 = {
+    key: 0,
+    class: "tao-textarea tao-textarea--dummy"
+  };
+  const _hoisted_2$6 = ["placeholder", "spellcheck", "autocomplete", "minlength", "maxlength", "disabled", "rows", "value"];
+  const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoTextarea",
+    props: {
+      placeholder: { default: "" },
+      spellcheck: { type: Boolean, default: true },
+      autocomplete: { default: "" },
+      minlength: { default: 0 },
+      maxlength: { default: void 0 },
+      disabled: { type: Boolean, default: false },
+      noSpace: { type: Boolean, default: false },
+      dummy: { type: Boolean, default: false },
+      rows: { default: 3 },
+      resize: { type: Boolean, default: true },
+      modelValue: { default: "" },
+      noBorder: { type: Boolean, default: false },
+      noBackground: { type: Boolean, default: false },
+      autoFocus: { type: Boolean, default: false },
+      borderInverse: { type: Boolean, default: false },
+      textCenter: { type: Boolean, default: false },
+      submitOnEnter: { type: Boolean, default: false }
+    },
+    emits: ["update:modelValue", "change", "focus", "blur", "keydown"],
+    setup(__props, { emit: __emit }) {
+      const props = __props;
+      const emit = __emit;
+      const textareaRef = vue.ref(null);
+      function onInput(e) {
+        const target = e.target;
+        emit("update:modelValue", target.value);
+        autoResize();
+      }
+      function onChange(e) {
+        emit("change", e.target.value);
+      }
+      function onFocus(e) {
+        emit("focus", e);
+      }
+      function onBlur(e) {
+        emit("blur", e);
+      }
+      function onKeydown(event) {
+        var _a;
+        emit("keydown", event);
+        if (props.submitOnEnter && event.key === "Enter" && !event.shiftKey) {
+          (_a = textareaRef.value) == null ? void 0 : _a.blur();
+          event.preventDefault();
+          return;
+        }
+        if (props.noSpace && event.key === " ") {
+          event.preventDefault();
+        }
+      }
+      function autoResize() {
+        const textarea = textareaRef.value;
+        if (!textarea) {
+          return;
+        }
+        textarea.style.height = "auto";
+        textarea.style.height = `${Math.min(textarea.scrollHeight, 500)}px`;
+      }
+      vue.watch(() => props.modelValue, () => {
+        vue.nextTick(autoResize);
+      });
+      vue.onMounted(() => {
+        var _a;
+        if (props.autoFocus) {
+          (_a = textareaRef.value) == null ? void 0 : _a.focus();
+        }
+        vue.nextTick(autoResize);
+      });
+      return (_ctx, _cache) => {
+        return props.dummy ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$6, vue.toDisplayString(props.modelValue), 1)) : (vue.openBlock(), vue.createElementBlock("textarea", {
+          key: 1,
+          ref_key: "textareaRef",
+          ref: textareaRef,
+          class: vue.normalizeClass(["tao-textarea", {
+            "tao-textarea--inverse": props.borderInverse,
+            "tao-textarea--center": props.textCenter,
+            "tao-textarea--no-border": props.noBorder,
+            "tao-textarea--no-background": props.noBackground,
+            "tao-textarea--no-resize": !props.resize
+          }]),
+          placeholder: props.placeholder,
+          spellcheck: props.spellcheck,
+          autocomplete: props.autocomplete,
+          minlength: props.minlength,
+          maxlength: props.maxlength,
+          disabled: props.disabled,
+          rows: props.rows,
+          value: props.modelValue,
+          draggable: "false",
+          onInput,
+          onChange,
+          onFocus,
+          onBlur,
+          onKeydown
+        }, null, 42, _hoisted_2$6));
+      };
+    }
+  });
+  const TaoTextarea = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-a56ad167"]]);
+  const _hoisted_1$5 = ["tabindex"];
+  const _hoisted_2$5 = { class: "tao-scroll-top__content" };
+  const RIPPLE_DURATION = 750;
+  const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoScrollTop",
+    props: {
+      size: { default: 40 },
+      right: { default: 24 },
+      bottom: { default: 24 },
+      zIndex: { default: 1e3 },
+      boundary: { default: 300 },
+      hasOutline: { type: Boolean, default: true },
+      tabindex: { default: 0 }
+    },
+    setup(__props) {
+      const props = __props;
+      const fmtProp = (value, unit = "px") => typeof value === "number" ? value + unit : value;
+      let prevPos = 0;
+      let activeBack = false;
+      const mainStyle = vue.reactive({
+        width: fmtProp(props.size),
+        height: fmtProp(props.size),
+        right: fmtProp(props.right),
+        bottom: fmtProp(props.bottom),
+        zIndex: props.zIndex
+      });
+      const rippleStyle = vue.reactive({
+        top: fmtProp(-1 * props.size),
+        left: fmtProp(-1 * props.size),
+        width: "200%",
+        height: "200%"
+      });
+      const isActive = vue.ref(false);
+      const isRippleActive = vue.ref(false);
+      function getScrollValue() {
+        if (typeof window.pageYOffset !== "undefined") {
+          return window.pageYOffset;
+        }
+        if (typeof document.compatMode !== "undefined" && document.compatMode !== "BackCompat") {
+          return document.documentElement.scrollTop;
+        }
+        return document.body.scrollTop;
+      }
+      function goToTop() {
+        const c = getScrollValue();
+        if (c > 0) {
+          window.requestAnimationFrame(goToTop);
+          window.scrollTo(0, c - Math.max(10, c / 8));
+        }
+      }
+      function onScroll() {
+        const pY = getScrollValue();
+        const tooFar = pY > props.boundary;
+        const goBack = prevPos > pY;
+        if (activeBack) {
+          if (!goBack && pY - prevPos > 15) {
+            activeBack = false;
+          }
+        } else {
+          activeBack = prevPos - pY >= 20;
+          if (activeBack && pY - props.boundary < 150) {
+            activeBack = false;
+          }
+        }
+        prevPos = pY;
+        isActive.value = tooFar && activeBack;
+      }
+      function onClick(e) {
+        if (!isRippleActive.value) {
+          const elTarget = e.currentTarget;
+          if (elTarget) {
+            const rect = elTarget.getBoundingClientRect();
+            const top = e.clientY - rect.top;
+            const left = e.clientX - rect.left;
+            rippleStyle.top = fmtProp(top - props.size);
+            rippleStyle.left = fmtProp(left - props.size);
+          }
+          isRippleActive.value = true;
+          setTimeout(() => {
+            isRippleActive.value = false;
+          }, RIPPLE_DURATION);
+        }
+        goToTop();
+      }
+      vue.onBeforeMount(() => {
+        window.addEventListener("scroll", onScroll);
+      });
+      vue.onBeforeUnmount(() => {
+        window.removeEventListener("scroll", onScroll);
+      });
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createBlock(vue.Transition, { name: "tao-scroll-top-fade" }, {
+          default: vue.withCtx(() => [
+            isActive.value ? (vue.openBlock(), vue.createElementBlock("button", {
+              key: 0,
+              style: vue.normalizeStyle(mainStyle),
+              tabindex: props.tabindex,
+              class: vue.normalizeClass(["tao-scroll-top", { "tao-scroll-top--no-outline": !props.hasOutline }]),
+              "aria-label": "Scroll to top",
+              onClick: vue.withModifiers(onClick, ["prevent"])
+            }, [
+              vue.createElementVNode("div", _hoisted_2$5, [
+                vue.createElementVNode("div", {
+                  class: vue.normalizeClass([{ "tao-scroll-top__ripple--active": isRippleActive.value }, "tao-scroll-top__ripple"]),
+                  style: vue.normalizeStyle(rippleStyle)
+                }, null, 6),
+                vue.renderSlot(_ctx.$slots, "default", {}, () => [
+                  _cache[0] || (_cache[0] = vue.createElementVNode("svg", {
+                    class: "tao-scroll-top__icon",
+                    viewBox: "0 0 24 24",
+                    width: "16",
+                    height: "16",
+                    fill: "currentColor"
+                  }, [
+                    vue.createElementVNode("path", { d: "M12 6l-7 7 1.4 1.4L12 8.8l5.6 5.6L19 13z" })
+                  ], -1))
+                ], true)
+              ])
+            ], 14, _hoisted_1$5)) : vue.createCommentVNode("", true)
+          ]),
+          _: 3
+        });
+      };
+    }
+  });
+  const TaoScrollTop = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-a6b96e61"]]);
+  const _hoisted_1$4 = { class: "tao-progress" };
+  const _hoisted_2$4 = {
+    key: 0,
+    class: "tao-progress__side"
+  };
+  const _hoisted_3$1 = { class: "tao-progress__side" };
+  const _hoisted_4 = {
+    key: 0,
+    class: "tao-progress__percentage"
+  };
+  const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoProgress",
+    props: {
+      min: { default: 200 },
+      max: { default: 400 },
+      progress: { default: 0 },
+      height: { default: 8 },
+      showPercentage: { type: Boolean, default: false },
+      animated: { type: Boolean, default: true }
+    },
+    setup(__props) {
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$4, [
+          vue.createElementVNode("div", {
+            class: "tao-progress__container",
+            style: vue.normalizeStyle({ minWidth: `${__props.min}px`, maxWidth: `${__props.max}px` })
+          }, [
+            _ctx.$slots.left ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$4, [
+              vue.renderSlot(_ctx.$slots, "left", {}, void 0, true)
+            ])) : vue.createCommentVNode("", true),
+            vue.createElementVNode("div", {
+              class: "tao-progress__track",
+              style: vue.normalizeStyle({ height: `${__props.height}px` })
+            }, [
+              vue.createElementVNode("div", {
+                class: vue.normalizeClass(["tao-progress__fill", { "tao-progress__fill--animated": __props.animated }]),
+                style: vue.normalizeStyle({ width: `${__props.progress}%` })
+              }, null, 6)
+            ], 4),
+            vue.createElementVNode("div", _hoisted_3$1, [
+              __props.showPercentage ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4, vue.toDisplayString(__props.progress) + "%", 1)) : vue.createCommentVNode("", true),
+              vue.renderSlot(_ctx.$slots, "right", {}, void 0, true)
+            ])
+          ], 4)
+        ]);
+      };
+    }
+  });
+  const TaoProgress = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-3780642d"]]);
+  const _hoisted_1$3 = ["placeholder"];
+  const _hoisted_2$3 = {
+    key: 1,
+    class: "tao-slider__value"
+  };
+  const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoSlider",
+    props: {
+      min: { default: 0 },
+      max: { default: 100 },
+      step: { default: 1 },
+      showValue: { type: Boolean, default: false },
+      placeholder: { default: "" },
+      modelValue: {}
+    },
+    emits: ["update:modelValue"],
+    setup(__props, { emit: __emit }) {
+      const props = __props;
+      const emit = __emit;
+      function packModelValue(value) {
+        return typeof props.modelValue === "string" ? `${value}` : value;
+      }
+      function unpackModelValue() {
+        return typeof props.modelValue === "string" ? parseFloat(props.modelValue) : props.modelValue;
+      }
+      const trackRef = vue.ref(null);
+      const isDragging = vue.ref(false);
+      const shadowInputRef = vue.ref(null);
+      const shadowModel = vue.ref("0");
+      const showShadowModel = vue.ref(false);
+      const progressPercent = vue.computed(() => {
+        const range = props.max - props.min;
+        return (unpackModelValue() - props.min) / range * 100;
+      });
+      function clampValue(v) {
+        return Math.min(Math.max(v, props.min), props.max);
+      }
+      function calculateValue(event) {
+        if (!trackRef.value) {
+          return props.min;
+        }
+        const rect = trackRef.value.getBoundingClientRect();
+        const clientX = "touches" in event ? event.touches[0].clientX : event.clientX;
+        const x = Math.min(Math.max(clientX - rect.left, 0), rect.width);
+        const ratio = x / rect.width;
+        const v = Math.round(props.min + ratio * (props.max - props.min));
+        return clampValue(Math.round((v - props.min) / props.step) * props.step + props.min);
+      }
+      function handleMove(event) {
+        emit("update:modelValue", packModelValue(calculateValue(event)));
+      }
+      function onMouseUp(event) {
+        const evBtn = "touches" in event ? void 0 : event.button;
+        if (typeof evBtn !== "undefined" && evBtn !== 0 || showShadowModel.value) {
+          return;
+        }
+        isDragging.value = false;
+      }
+      function onMouseDown(event) {
+        const evBtn = "touches" in event ? void 0 : event.button;
+        if (typeof evBtn !== "undefined" && evBtn !== 0 || showShadowModel.value) {
+          return;
+        }
+        isDragging.value = true;
+        handleMove(event);
+        event.preventDefault();
+      }
+      function onMouseMove(event) {
+        if (!isDragging.value) {
+          return;
+        }
+        handleMove(event);
+      }
+      function onBlurShadowModel() {
+        if (shadowModel.value) {
+          const newValue = packModelValue(clampValue(parseFloat(shadowModel.value) || 0));
+          shadowModel.value = `${newValue}`;
+          emit("update:modelValue", newValue);
+        }
+        showShadowModel.value = false;
+      }
+      function onShadowKeydown(event) {
+        var _a;
+        if (event.key === "Enter") {
+          (_a = shadowInputRef.value) == null ? void 0 : _a.blur();
+        }
+      }
+      function onContextMenu() {
+        if (props.showValue) {
+          shadowModel.value = `${props.modelValue}`;
+          showShadowModel.value = true;
+          requestAnimationFrame(() => {
+            var _a;
+            return (_a = shadowInputRef.value) == null ? void 0 : _a.focus();
+          });
+        }
+      }
+      vue.onMounted(() => {
+        window.addEventListener("mouseleave", onMouseUp);
+        window.addEventListener("mouseup", onMouseUp);
+        window.addEventListener("mousemove", onMouseMove);
+        window.addEventListener("touchend", onMouseUp);
+        window.addEventListener("touchmove", onMouseMove);
+      });
+      vue.onBeforeUnmount(() => {
+        window.removeEventListener("mouseleave", onMouseUp);
+        window.removeEventListener("mouseup", onMouseUp);
+        window.removeEventListener("mousemove", onMouseMove);
+        window.removeEventListener("touchend", onMouseUp);
+        window.removeEventListener("touchmove", onMouseMove);
+      });
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", {
+          ref_key: "trackRef",
+          ref: trackRef,
+          class: vue.normalizeClass(["tao-slider", { "tao-slider--show-value": __props.showValue }]),
+          onContextmenu: vue.withModifiers(onContextMenu, ["prevent"]),
+          onMousedown: onMouseDown,
+          onTouchstart: onMouseDown
+        }, [
+          _cache[2] || (_cache[2] = vue.createElementVNode("div", { class: "tao-slider__track" }, null, -1)),
+          vue.createElementVNode("div", {
+            class: "tao-slider__fill",
+            style: vue.normalizeStyle({ width: `${progressPercent.value}%` })
+          }, null, 4),
+          vue.createElementVNode("div", {
+            class: "tao-slider__thumb",
+            style: vue.normalizeStyle({ left: `${progressPercent.value}%` })
+          }, null, 4),
+          showShadowModel.value ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
+            key: 0,
+            ref_key: "shadowInputRef",
+            ref: shadowInputRef,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => shadowModel.value = $event),
+            type: "number",
+            inputmode: "numeric",
+            placeholder: __props.placeholder,
+            class: "tao-slider__shadow-input",
+            onBlur: onBlurShadowModel,
+            onKeydown: onShadowKeydown,
+            onMousedown: _cache[1] || (_cache[1] = vue.withModifiers(() => {
+            }, ["stop"]))
+          }, null, 40, _hoisted_1$3)), [
+            [vue.vModelText, shadowModel.value]
+          ]) : __props.showValue ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$3, [
+            vue.renderSlot(_ctx.$slots, "pre-value", {}, void 0, true),
+            vue.createTextVNode(vue.toDisplayString(__props.modelValue), 1),
+            vue.renderSlot(_ctx.$slots, "post-value", {}, void 0, true)
+          ])) : vue.createCommentVNode("", true)
+        ], 34);
+      };
+    }
+  });
+  const TaoSlider = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-9f531a81"]]);
+  const _hoisted_1$2 = { class: "tao-file-drop" };
+  const _hoisted_2$2 = ["accept", "multiple"];
+  const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoFileDrop",
+    props: {
+      modelValue: { default: () => [] },
+      size: { default: "medium" },
+      accept: { default: "*" },
+      multiple: { type: Boolean, default: false },
+      showClear: { type: Boolean, default: false }
+    },
+    emits: ["update:modelValue", "files", "clear-request"],
+    setup(__props, { emit: __emit }) {
+      const props = __props;
+      const emit = __emit;
+      const isDragging = vue.ref(false);
+      const fileInput = vue.ref(null);
+      function handleDragOver(event) {
+        event.preventDefault();
+        isDragging.value = true;
+      }
+      function handleDragLeave() {
+        isDragging.value = false;
+      }
+      function handleDrop(event) {
+        var _a;
+        event.preventDefault();
+        isDragging.value = false;
+        const files = (_a = event.dataTransfer) == null ? void 0 : _a.files;
+        if (files && files.length > 0) {
+          processFiles(files);
+        }
+      }
+      function handleFileSelect(event) {
+        const input = event.target;
+        if (input.files && input.files.length > 0) {
+          processFiles(input.files);
+        }
+      }
+      function requestClear() {
+        emit("clear-request");
+      }
+      function triggerFileInput() {
+        var _a;
+        (_a = fileInput.value) == null ? void 0 : _a.click();
+      }
+      function processFiles(fileList) {
+        const files = Array.from(fileList);
+        const result = !props.multiple && files.length > 1 ? [files[0]] : files;
+        emit("update:modelValue", result);
+        emit("files", result);
+        const el = fileInput.value;
+        if (el) {
+          el.type = "text";
+          el.type = "file";
+        }
+      }
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [
+          __props.showClear && __props.modelValue.length ? (vue.openBlock(), vue.createElementBlock("button", {
+            key: 0,
+            type: "button",
+            class: "tao-file-drop__clear",
+            onClick: requestClear
+          }, " ✕ ")) : vue.createCommentVNode("", true),
+          vue.createElementVNode("div", {
+            class: vue.normalizeClass(["tao-file-drop__zone", [`tao-file-drop__zone--${__props.size}`, { "tao-file-drop__zone--dragging": isDragging.value }]]),
+            onDragover: handleDragOver,
+            onDragleave: handleDragLeave,
+            onDrop: handleDrop,
+            onClick: triggerFileInput
+          }, [
+            vue.renderSlot(_ctx.$slots, "default", {}, () => [
+              _cache[0] || (_cache[0] = vue.createTextVNode("Drag & drop your file(s) here or click to select", -1))
+            ], true),
+            vue.createElementVNode("input", {
+              ref_key: "fileInput",
+              ref: fileInput,
+              type: "file",
+              hidden: "",
+              accept: __props.accept,
+              multiple: __props.multiple,
+              onChange: handleFileSelect
+            }, null, 40, _hoisted_2$2)
+          ], 34)
+        ]);
+      };
+    }
+  });
+  const TaoFileDrop = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-db5ffca4"]]);
+  const _hoisted_1$1 = { key: 1 };
+  const _hoisted_2$1 = ["onClick"];
+  const _hoisted_3 = { key: 1 };
+  const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoDropdownMenu",
+    props: {
+      actions: { default: () => [] }
+    },
+    emits: ["selected"],
+    setup(__props, { emit: __emit }) {
+      const emit = __emit;
+      let animationFrameId = 0;
+      const menuRef = vue.ref(null);
+      const listRef = vue.ref(null);
+      const isOpen = vue.ref(false);
+      const listPosition = vue.reactive({ top: "0", left: "0" });
+      function updatePosition() {
+        const elMenu = menuRef.value;
+        const elList = listRef.value;
+        if (elMenu && elList && isOpen.value) {
+          const rect = elMenu.getBoundingClientRect();
+          const rectList = elList.getBoundingClientRect();
+          let px = rect.right;
+          let py = rect.top;
+          if (px + rectList.width > window.innerWidth) {
+            px = rect.left - rectList.width;
+          }
+          if (py + rectList.height > window.innerHeight) {
+            py = rect.bottom - rectList.height;
+          }
+          listPosition.top = `${py + window.scrollY}px`;
+          listPosition.left = `${px}px`;
+        }
+      }
+      function toggleMenu() {
+        isOpen.value = !isOpen.value;
+        if (isOpen.value) {
+          animationFrameId = requestAnimationFrame(function render() {
+            updatePosition();
+            animationFrameId = requestAnimationFrame(render);
+          });
+        } else {
+          cancelAnimationFrame(animationFrameId);
+        }
+      }
+      function closeMenu(event) {
+        if (menuRef.value && !menuRef.value.contains(event.target)) {
+          isOpen.value = false;
+        }
+      }
+      function emitAction(id) {
+        isOpen.value = false;
+        emit("selected", id);
+      }
+      function onWinScroll() {
+        isOpen.value = false;
+      }
+      vue.onMounted(() => {
+        document.addEventListener("click", closeMenu);
+        window.addEventListener("scroll", onWinScroll);
+      });
+      vue.onUnmounted(() => {
+        document.removeEventListener("click", closeMenu);
+        window.removeEventListener("scroll", onWinScroll);
+        cancelAnimationFrame(animationFrameId);
+      });
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", {
+          ref_key: "menuRef",
+          ref: menuRef,
+          class: "tao-dropdown-menu"
+        }, [
+          vue.createElementVNode("div", {
+            class: "tao-dropdown-menu__button",
+            onClick: toggleMenu
+          }, [
+            _ctx.$slots.button ? vue.renderSlot(_ctx.$slots, "button", {}, void 0, true, 0) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_1$1, "⋮"))
+          ]),
+          (vue.openBlock(), vue.createBlock(vue.Teleport, { to: "body" }, [
+            isOpen.value ? (vue.openBlock(), vue.createElementBlock("div", {
+              key: 0,
+              ref_key: "listRef",
+              ref: listRef,
+              class: "tao-dropdown-menu__list",
+              style: vue.normalizeStyle(listPosition)
+            }, [
+              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.actions, (action) => {
+                return vue.openBlock(), vue.createElementBlock("div", {
+                  key: action.id,
+                  class: "tao-dropdown-menu__item",
+                  onClick: ($event) => emitAction(action.id)
+                }, [
+                  _ctx.$slots.item ? vue.renderSlot(_ctx.$slots, "item", {
+                    id: action.id,
+                    ico: action.ico,
+                    text: action.name
+                  }, void 0, true, 0) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_3, vue.toDisplayString(action.name), 1))
+                ], 8, _hoisted_2$1);
+              }), 128))
+            ], 4)) : vue.createCommentVNode("", true)
+          ]))
+        ], 512);
+      };
+    }
+  });
+  const TaoDropdownMenu = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-d54be7aa"]]);
+  const _hoisted_1 = { class: "tao-pin-code" };
+  const _hoisted_2 = ["value", "placeholder", "type", "inputmode", "pattern", "onInput", "onKeydown", "onFocus"];
+  const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoPinCode",
+    props: {
+      length: {},
+      hidden: { type: Boolean, default: false },
+      placeholder: { default: "" },
+      modelValue: {},
+      numbersOnly: { type: Boolean, default: false }
+    },
+    emits: ["update:modelValue", "change", "active", "blur"],
+    setup(__props, { emit: __emit }) {
+      const props = __props;
+      const emit = __emit;
+      let lastPinCode = NaN;
+      const numbers = vue.ref([]);
+      const inputRefs = vue.ref([]);
+      const activeNumber = vue.ref(-1);
+      function emitChange() {
+        const s = numbers.value.map((e) => e ? e : "0").join("");
+        const curPinCode = parseFloat(s);
+        if (lastPinCode !== curPinCode) {
+          lastPinCode = curPinCode;
+          emit("change", curPinCode);
+        }
+        emit("update:modelValue", s);
+      }
+      function emitBlur() {
+        activeNumber.value = -1;
+        emit("blur");
+      }
+      function init() {
+        numbers.value = [...Array(props.length)].map(() => "");
+        inputRefs.value = [];
+        activeNumber.value = -1;
+      }
+      function mutation(v, index) {
+        var _a, _b;
+        numbers.value = [...numbers.value];
+        if (v.length > 1) {
+          v = v[v.length - 1] ?? "";
+        }
+        if (props.numbersOnly && v && !/^[0-9]$/.test(v)) {
+          numbers.value[index] = numbers.value[index] ?? "";
+          return;
+        }
+        numbers.value[index] = v;
+        const getNextIdx = () => {
+          if (numbers.value.length >= index + 1) {
+            return numbers.value.findIndex((e) => e === "");
+          }
+          return index + 1;
+        };
+        const nextIndex = getNextIdx();
+        if (nextIndex !== -1 && !numbers.value[nextIndex]) {
+          const el = inputRefs.value[nextIndex];
+          if (el) {
+            el.focus();
+          } else {
+            (_a = inputRefs.value[index]) == null ? void 0 : _a.blur();
+            emitBlur();
+          }
+        } else {
+          (_b = inputRefs.value[index]) == null ? void 0 : _b.blur();
+          emitBlur();
+        }
+        emitChange();
+      }
+      function onFocus(index) {
+        numbers.value = [...numbers.value];
+        numbers.value[index] = "";
+        activeNumber.value = index;
+        emitChange();
+        emit("active", inputRefs.value[index], index);
+      }
+      function onChange(e, index) {
+        const v = e.target.value;
+        mutation(v, index);
+      }
+      function onKeydown(event, index) {
+        if (event.key !== "Backspace") {
+          return;
+        }
+        if (!numbers.value[index] && index > 0) {
+          event.preventDefault();
+          numbers.value = [...numbers.value];
+          numbers.value[index - 1] = "";
+          const prevEl = inputRefs.value[index - 1];
+          prevEl == null ? void 0 : prevEl.focus();
+          activeNumber.value = index - 1;
+          emitChange();
+        }
+      }
+      vue.watch(() => props.modelValue, (v) => {
+        if (!v.length) {
+          init();
+          emitChange();
+        }
+      });
+      init();
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(numbers.value, (num, index) => {
+            return vue.openBlock(), vue.createElementBlock("input", {
+              key: index,
+              ref_for: true,
+              ref: (el) => inputRefs.value[index] = el,
+              class: vue.normalizeClass(["tao-pin-code__value", { "tao-pin-code__value--active": activeNumber.value === index }]),
+              value: num,
+              placeholder: __props.placeholder,
+              type: __props.hidden ? "password" : "text",
+              inputmode: __props.numbersOnly ? "numeric" : "text",
+              pattern: __props.numbersOnly ? "[0-9]" : void 0,
+              maxlength: "1",
+              onInput: ($event) => onChange($event, index),
+              onKeydown: ($event) => onKeydown($event, index),
+              onFocus: ($event) => onFocus(index)
+            }, null, 42, _hoisted_2);
+          }), 128))
+        ]);
+      };
+    }
+  });
+  const TaoPinCode = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-b8c7bf2c"]]);
+  const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+    __name: "TaoLink",
+    props: {
+      to: { default: void 0 },
+      asNewTab: { type: Boolean, default: false },
+      private: { type: Boolean, default: false },
+      exactPath: { type: Boolean, default: false }
+    },
+    setup(__props) {
+      const props = __props;
+      const linkComponent = vue.computed(() => {
+        const resolved = vue.resolveComponent("NuxtLink");
+        return typeof resolved === "string" ? "a" : resolved;
+      });
+      const linkProps = vue.computed(() => {
+        const target = props.asNewTab ? "_blank" : void 0;
+        const rel = props.private && "noopener noreferrer" || props.asNewTab && "noopener" || void 0;
+        if (linkComponent.value === "a") {
+          return {
+            href: typeof props.to === "string" ? props.to : void 0,
+            target,
+            rel
+          };
+        }
+        return {
+          to: props.to,
+          target,
+          rel,
+          exactPath: props.exactPath
+        };
+      });
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(linkComponent.value), vue.mergeProps(linkProps.value, { draggable: "false" }), {
+          default: vue.withCtx(() => [
+            vue.renderSlot(_ctx.$slots, "default")
+          ]),
+          _: 3
+        }, 16);
+      };
+    }
+  });
+  const components = [
+    TaoButton,
+    TaoBlock,
+    TaoInput,
+    TaoCard,
+    TaoModal,
+    TaoTabs,
+    TaoTooltip,
+    TaoSpoiler,
+    TaoCopy,
+    TaoContainer,
+    _sfc_main$g,
+    TaoSpace,
+    TaoIcon,
+    TaoLoader,
+    TaoImage,
+    TaoCheckbox,
+    TaoTag,
+    TaoDivider,
+    TaoAnimatedBorder,
+    TaoTextarea,
+    TaoScrollTop,
+    TaoProgress,
+    TaoSlider,
+    TaoFileDrop,
+    TaoDropdownMenu,
+    TaoPinCode,
+    _sfc_main
+  ];
+  const TaoUI = {
+    install(app) {
+      components.forEach((component) => {
+        app.component(component.name, component);
+      });
+    }
+  };
+  exports2.TaoAnimatedBorder = TaoAnimatedBorder;
+  exports2.TaoBlock = TaoBlock;
+  exports2.TaoButton = TaoButton;
+  exports2.TaoCard = TaoCard;
+  exports2.TaoCheckbox = TaoCheckbox;
+  exports2.TaoContainer = TaoContainer;
+  exports2.TaoCopy = TaoCopy;
+  exports2.TaoDivider = TaoDivider;
+  exports2.TaoDropdownMenu = TaoDropdownMenu;
+  exports2.TaoFileDrop = TaoFileDrop;
+  exports2.TaoFlex = _sfc_main$g;
+  exports2.TaoIcon = TaoIcon;
+  exports2.TaoImage = TaoImage;
+  exports2.TaoInput = TaoInput;
+  exports2.TaoLink = _sfc_main;
+  exports2.TaoLoader = TaoLoader;
+  exports2.TaoModal = TaoModal;
+  exports2.TaoPinCode = TaoPinCode;
+  exports2.TaoProgress = TaoProgress;
+  exports2.TaoScrollTop = TaoScrollTop;
+  exports2.TaoSlider = TaoSlider;
+  exports2.TaoSpace = TaoSpace;
+  exports2.TaoSpoiler = TaoSpoiler;
+  exports2.TaoTabs = TaoTabs;
+  exports2.TaoTag = TaoTag;
+  exports2.TaoTextarea = TaoTextarea;
+  exports2.TaoTooltip = TaoTooltip;
+  exports2.TaoUI = TaoUI;
+  exports2.default = TaoUI;
+  Object.defineProperties(exports2, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+});
+//# sourceMappingURL=index.cjs.map