directix 1.0.0 → 1.2.0

package/dist/index.iife.js

@@ -1,142 +1,16 @@
 /*!
- * directix v1.0.0
+ * directix v1.2.0
  * A comprehensive, easy-to-use, and high-performance Vue custom directives library supporting both Vue 2 and Vue 3
  * (c) 2021-present saqqdy <https://github.com/saqqdy>
  * Released under the MIT License.
  */
-var _VueDemiGlobal = typeof globalThis !== 'undefined' 
-  ? globalThis
-  : typeof global !== 'undefined'
-    ? global
-    : typeof self !== 'undefined'
-      ? self
-      : this
-var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
-  if (VueDemi.install) {
-    return VueDemi
-  }
-  if (!Vue) {
-    console.error('[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`.')
-    return VueDemi
-  }
-
-  // Vue 2.7
-  if (Vue.version.slice(0, 4) === '2.7.') {
-    for (var key in Vue) {
-      VueDemi[key] = Vue[key]
-    }
-    VueDemi.isVue2 = true
-    VueDemi.isVue3 = false
-    VueDemi.install = function () {}
-    VueDemi.Vue = Vue
-    VueDemi.Vue2 = Vue
-    VueDemi.version = Vue.version
-    VueDemi.warn = Vue.util.warn
-    VueDemi.hasInjectionContext = function() {
-      return !!VueDemi.getCurrentInstance()
-    }
-    function createApp(rootComponent, rootProps) {
-      var vm
-      var provide = {}
-      var app = {
-        config: Vue.config,
-        use: Vue.use.bind(Vue),
-        mixin: Vue.mixin.bind(Vue),
-        component: Vue.component.bind(Vue),
-        provide: function (key, value) {
-          provide[key] = value
-          return this
-        },
-        directive: function (name, dir) {
-          if (dir) {
-            Vue.directive(name, dir)
-            return app
-          } else {
-            return Vue.directive(name)
-          }
-        },
-        mount: function (el, hydrating) {
-          if (!vm) {
-            vm = new Vue(Object.assign({ propsData: rootProps }, rootComponent, { provide: Object.assign(provide, rootComponent.provide) }))
-            vm.$mount(el, hydrating)
-            return vm
-          } else {
-            return vm
-          }
-        },
-        unmount: function () {
-          if (vm) {
-            vm.$destroy()
-            vm = undefined
-          }
-        },
-      }
-      return app
-    }
-    VueDemi.createApp = createApp
-  }
-  // Vue 2.6.x
-  else if (Vue.version.slice(0, 2) === '2.') {
-    if (VueCompositionAPI) {
-      for (var key in VueCompositionAPI) {
-        VueDemi[key] = VueCompositionAPI[key]
-      }
-      VueDemi.isVue2 = true
-      VueDemi.isVue3 = false
-      VueDemi.install = function () {}
-      VueDemi.Vue = Vue
-      VueDemi.Vue2 = Vue
-      VueDemi.version = Vue.version
-      VueDemi.hasInjectionContext = function() {
-        return !!VueDemi.getCurrentInstance()
-      }
-    } else {
-      console.error('[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.')
-    }
-  }
-  // Vue 3
-  else if (Vue.version.slice(0, 2) === '3.') {
-    for (var key in Vue) {
-      VueDemi[key] = Vue[key]
-    }
-    VueDemi.isVue2 = false
-    VueDemi.isVue3 = true
-    VueDemi.install = function () {}
-    VueDemi.Vue = Vue
-    VueDemi.Vue2 = undefined
-    VueDemi.version = Vue.version
-    VueDemi.set = function (target, key, val) {
-      if (Array.isArray(target)) {
-        target.length = Math.max(target.length, key)
-        target.splice(key, 1, val)
-        return val
-      }
-      target[key] = val
-      return val
-    }
-    VueDemi.del = function (target, key) {
-      if (Array.isArray(target)) {
-        target.splice(key, 1)
-        return
-      }
-      delete target[key]
-    }
-  } else {
-    console.error('[vue-demi] Vue version ' + Vue.version + ' is unsupported.')
-  }
-  return VueDemi
-})(
-  (_VueDemiGlobal.VueDemi = _VueDemiGlobal.VueDemi || (typeof VueDemi !== 'undefined' ? VueDemi : {})),
-  _VueDemiGlobal.Vue || (typeof Vue !== 'undefined' ? Vue : undefined),
-  _VueDemiGlobal.VueCompositionAPI || (typeof VueCompositionAPI !== 'undefined' ? VueCompositionAPI : undefined)
-);
-
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
 var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __pow = Math.pow;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __spreadValues = (a, b) => {
   for (var prop in b || (b = {}))
@@ -183,71 +57,13 @@ var __async = (__this, __arguments, generator) => {
   });
 };
 /*!
- * directix v1.0.0
+ * directix v1.2.0
  * A comprehensive, easy-to-use, and high-performance Vue custom directives library supporting both Vue 2 and Vue 3
  * (c) 2021-present saqqdy <https://github.com/saqqdy>
  * Released under the MIT License.
  */
 (function(exports) {
   "use strict";
-  let _vueVersion = null;
-  function getVueVersion() {
-    var _a, _b;
-    if (_vueVersion !== null) return _vueVersion;
-    try {
-      const vue = require("vue");
-      if ((_a = vue == null ? void 0 : vue.version) == null ? void 0 : _a.startsWith("2")) {
-        _vueVersion = 2;
-      } else if ((_b = vue == null ? void 0 : vue.version) == null ? void 0 : _b.startsWith("3")) {
-        _vueVersion = 3;
-      }
-    } catch (e) {
-    }
-    if (_vueVersion === null) {
-      if (typeof window !== "undefined") {
-        console.warn(
-          "[Directix] Unable to detect Vue version, defaulting to Vue 3. Please ensure Vue is installed correctly."
-        );
-      }
-      _vueVersion = 3;
-    }
-    return _vueVersion;
-  }
-  const isVue2 = () => getVueVersion() === 2;
-  const isVue3 = () => getVueVersion() === 3;
-  const isBrowser = () => {
-    return typeof window !== "undefined" && typeof document !== "undefined";
-  };
-  const isSSR = () => !isBrowser();
-  const supportsPassive = () => {
-    if (!isBrowser()) return false;
-    let supports = false;
-    try {
-      const options = {
-        get passive() {
-          supports = true;
-          return false;
-        }
-      };
-      window.addEventListener("test", null, options);
-      window.removeEventListener("test", null, options);
-    } catch (e) {
-      supports = false;
-    }
-    return supports;
-  };
-  const supportsIntersectionObserver = () => {
-    return isBrowser() && "IntersectionObserver" in window;
-  };
-  const supportsResizeObserver = () => {
-    return isBrowser() && "ResizeObserver" in window;
-  };
-  const supportsClipboard = () => {
-    return isBrowser() && "clipboard" in navigator;
-  };
-  const supportsMutationObserver = () => {
-    return isBrowser() && "MutationObserver" in window;
-  };
   function createVue2Directive(hooks) {
     const directive = {
       bind(el, binding, vnode) {
@@ -376,6 +192,145 @@ var __async = (__this, __arguments, generator) => {
       state.cleanup.push(fn);
     }
   }
+  let _vueVersion = null, _isVue2 = null, _isVue27 = null, _isVue3 = null;
+  function parseVersion(version) {
+    if (version.startsWith("2.7")) return 2.7;
+    if (version.startsWith("2")) return 2;
+    if (version.startsWith("3")) return 3;
+    return null;
+  }
+  function getVueVersion() {
+    var _a, _b;
+    if (_vueVersion !== null) return _vueVersion;
+    if (typeof process !== "undefined") {
+      const envVersion = process.env.DIRECTIX_VUE_VERSION;
+      if (envVersion === "2.7") {
+        _vueVersion = 2.7;
+        return _vueVersion;
+      }
+      if (envVersion === "2") {
+        _vueVersion = 2;
+        return _vueVersion;
+      }
+      if (envVersion === "3") {
+        _vueVersion = 3;
+        return _vueVersion;
+      }
+    }
+    try {
+      const vue = require("vue");
+      const version = parseVersion(vue == null ? void 0 : vue.version);
+      if (version !== null) {
+        _vueVersion = version;
+        return _vueVersion;
+      }
+    } catch (e) {
+    }
+    if (typeof window !== "undefined") {
+      const win = window;
+      const vue = win.Vue;
+      if (vue == null ? void 0 : vue.version) {
+        const version = parseVersion(vue.version);
+        if (version !== null) {
+          _vueVersion = version;
+          return _vueVersion;
+        }
+      }
+      if (typeof (vue == null ? void 0 : vue.observable) === "function") {
+        _vueVersion = 2;
+        return _vueVersion;
+      }
+      if (typeof (vue == null ? void 0 : vue.createApp) === "function" && typeof (vue == null ? void 0 : vue.observable) !== "function") {
+        _vueVersion = 3;
+        return _vueVersion;
+      }
+      const devtools = win.__VUE_DEVTOOLS_GLOBAL_HOOK__;
+      if ((_a = devtools == null ? void 0 : devtools.Vue) == null ? void 0 : _a.version) {
+        const version = parseVersion(devtools.Vue.version);
+        if (version !== null) {
+          _vueVersion = version;
+          return _vueVersion;
+        }
+      }
+      if ((_b = devtools == null ? void 0 : devtools.apps) == null ? void 0 : _b.length) {
+        _vueVersion = 3;
+        return _vueVersion;
+      }
+    }
+    if (_vueVersion === null) {
+      if (typeof window !== "undefined") {
+        console.warn(
+          "[Directix] Unable to detect Vue version, defaulting to Vue 3. Set DIRECTIX_VUE_VERSION=2 or call setVueVersion(2) if using Vue 2."
+        );
+      }
+      _vueVersion = 3;
+    }
+    return _vueVersion;
+  }
+  function setVueVersion(version) {
+    _vueVersion = version;
+    _isVue2 = version === 2 || version === 2.7;
+    _isVue27 = version === 2.7;
+    _isVue3 = version === 3;
+  }
+  function resetVueVersion() {
+    _vueVersion = null;
+    _isVue2 = null;
+    _isVue27 = null;
+    _isVue3 = null;
+  }
+  function isVue2() {
+    if (_isVue2 === null) {
+      const version = getVueVersion();
+      _isVue2 = version === 2 || version === 2.7;
+    }
+    return _isVue2;
+  }
+  function isVue27() {
+    if (_isVue27 === null) {
+      _isVue27 = getVueVersion() === 2.7;
+    }
+    return _isVue27;
+  }
+  function isVue3() {
+    if (_isVue3 === null) {
+      _isVue3 = getVueVersion() === 3;
+    }
+    return _isVue3;
+  }
+  const isBrowser = () => {
+    return typeof window !== "undefined" && typeof document !== "undefined";
+  };
+  const isSSR = () => !isBrowser();
+  const supportsPassive = () => {
+    if (!isBrowser()) return false;
+    let supports = false;
+    try {
+      const options = {
+        get passive() {
+          supports = true;
+          return false;
+        }
+      };
+      window.addEventListener("test", null, options);
+      window.removeEventListener("test", null, options);
+    } catch (e) {
+      supports = false;
+    }
+    return supports;
+  };
+  const supportsIntersectionObserver = () => {
+    return isBrowser() && "IntersectionObserver" in window;
+  };
+  const supportsResizeObserver = () => {
+    return isBrowser() && "ResizeObserver" in window;
+  };
+  const supportsClipboard = () => {
+    return isBrowser() && "clipboard" in navigator;
+  };
+  const supportsMutationObserver = () => {
+    return isBrowser() && "MutationObserver" in window;
+  };
   function defineDirective(definition) {
     var _b;
     const _a = definition, { name, version, ssr, defaults } = _a, hooks = __objRest(_a, ["name", "version", "ssr", "defaults"]);
@@ -389,19 +344,45 @@ var __async = (__this, __arguments, generator) => {
     }
     const wrappedHooks = {
       mounted: hooks.mounted ? (el, binding, vnode) => {
-        const mergedBinding = applyDefaults(binding, defaults);
-        hooks.mounted(el, mergedBinding, vnode);
+        hooks.mounted(el, applyDefaults(binding, defaults), vnode);
       } : void 0,
       updated: hooks.updated ? (el, binding, vnode, prevBinding, prevVnode) => {
-        const mergedBinding = applyDefaults(binding, defaults);
-        hooks.updated(el, mergedBinding, vnode, prevBinding, prevVnode);
+        hooks.updated(el, applyDefaults(binding, defaults), vnode, prevBinding, prevVnode);
       } : void 0,
       unmounted: hooks.unmounted
     };
-    if (isVue2()) {
-      return createVue2Directive(wrappedHooks);
+    return createLazyDirective(wrappedHooks);
+  }
+  function createLazyDirective(hooks) {
+    let cachedDirective = null;
+    function getDirective() {
+      if (!cachedDirective) {
+        cachedDirective = getVueVersion() === 2 ? createVue2Directive(hooks) : createVue3Directive(hooks);
+      }
+      return cachedDirective;
+    }
+    function createHook(hookName) {
+      return function(el, binding, vnode, prevVnode) {
+        var _a, _b;
+        (_b = (_a = getDirective())[hookName]) == null ? void 0 : _b.call(_a, el, binding, vnode, prevVnode);
+      };
     }
-    return createVue3Directive(wrappedHooks);
+    return {
+      // Vue 2 hooks
+      bind: createHook("bind"),
+      inserted: createHook("inserted"),
+      update: createHook("update"),
+      componentUpdated: createHook("componentUpdated"),
+      unbind: createHook("unbind"),
+      // Vue 3 hooks
+      created: createHook("created"),
+      beforeMount: createHook("beforeMount"),
+      mounted: createHook("mounted"),
+      beforeUpdate: createHook("beforeUpdate"),
+      updated: createHook("updated"),
+      beforeUnmount: createHook("beforeUnmount"),
+      unmounted: createHook("unmounted")
+    };
   }
   function applyDefaults(binding, defaults) {
     if (!defaults) return binding;
@@ -430,6 +411,120 @@ var __async = (__this, __arguments, generator) => {
       }
     };
   }
+  function setupTextTransformInput(el, options, transformFn) {
+    if (!options.onInput) {
+      return () => {
+      };
+    }
+    const handler = () => {
+      const start = el.selectionStart;
+      const end = el.selectionEnd;
+      const originalValue = el.value;
+      const transformed = transformFn(originalValue);
+      if (originalValue !== transformed) {
+        el.value = transformed;
+        if (start !== null && end !== null) {
+          el.setSelectionRange(start, end);
+        }
+        el.dispatchEvent(new Event("input", { bubbles: true }));
+      }
+    };
+    el.addEventListener("input", handler);
+    el.value = transformFn(el.value);
+    return () => {
+      el.removeEventListener("input", handler);
+    };
+  }
+  function transformTextContent(el, transformFn) {
+    const text = el.textContent || "";
+    el.textContent = transformFn(text);
+  }
+  function isInputElement(el) {
+    return el.tagName === "INPUT" || el.tagName === "TEXTAREA";
+  }
+  const DEFAULT_KEEP_LOWER = [
+    "a",
+    "an",
+    "the",
+    "and",
+    "but",
+    "or",
+    "for",
+    "nor",
+    "on",
+    "at",
+    "to",
+    "from",
+    "by",
+    "in",
+    "of",
+    "with",
+    "as"
+  ];
+  function capitalizeText(text, options) {
+    if (!text) return text;
+    const { every = true, keepLower = DEFAULT_KEEP_LOWER } = options;
+    if (every) {
+      const words = text.toLowerCase().split(/\s+/);
+      return words.map((word, index) => {
+        if (index === 0) {
+          return capitalizeWord(word);
+        }
+        if (keepLower.includes(word.toLowerCase())) {
+          return word.toLowerCase();
+        }
+        return capitalizeWord(word);
+      }).join(" ");
+    } else {
+      return capitalizeWord(text);
+    }
+  }
+  function capitalizeWord(word) {
+    if (!word) return word;
+    return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();
+  }
+  function normalizeOptions$t(binding) {
+    var _a, _b, _c;
+    if (binding === void 0 || binding === true) {
+      return { every: true, onInput: true };
+    }
+    if (binding === false) {
+      return { every: false, onInput: false };
+    }
+    return {
+      every: (_a = binding.every) != null ? _a : true,
+      keepLower: (_b = binding.keepLower) != null ? _b : DEFAULT_KEEP_LOWER,
+      onInput: (_c = binding.onInput) != null ? _c : true
+    };
+  }
+  const vCapitalcase = defineDirective({
+    name: "capitalcase",
+    ssr: true,
+    mounted(el, binding) {
+      const options = normalizeOptions$t(binding.value);
+      if (isInputElement(el)) {
+        const cleanup2 = setupTextTransformInput(el, options, (text) => capitalizeText(text, options));
+        el.__capitalcaseCleanup = cleanup2;
+      } else {
+        transformTextContent(el, (text) => capitalizeText(text, options));
+      }
+    },
+    updated(el, binding) {
+      const options = normalizeOptions$t(binding.value);
+      if (isInputElement(el)) {
+        if (options.onInput) {
+          el.value = capitalizeText(el.value, options);
+        }
+      } else {
+        transformTextContent(el, (text) => capitalizeText(text, options));
+      }
+    },
+    unmounted(el) {
+      const cleanup2 = el.__capitalcaseCleanup;
+      cleanup2 == null ? void 0 : cleanup2();
+      delete el.__capitalcaseCleanup;
+    }
+  });
   function isElement(value) {
     return value instanceof Element;
   }
@@ -441,17 +536,29 @@ var __async = (__this, __arguments, generator) => {
     }
     return isElement(target) ? target : null;
   }
+  function getScrollParent(el) {
+    if (!isBrowser()) return window;
+    let parent = el.parentElement;
+    while (parent) {
+      const { overflow, overflowX, overflowY } = getComputedStyle(parent);
+      if (/(auto|scroll)/.test(overflow + overflowX + overflowY)) {
+        return parent;
+      }
+      parent = parent.parentElement;
+    }
+    return window;
+  }
   function on(target, event, handler, options = false) {
     if (!isBrowser()) return;
-    const opts = normalizeOptions$5(options);
+    const opts = normalizeOptions$s(options);
     target.addEventListener(event, handler, opts);
   }
   function off(target, event, handler, options = false) {
     if (!isBrowser()) return;
-    const opts = normalizeOptions$5(options);
+    const opts = normalizeOptions$s(options);
     target.removeEventListener(event, handler, opts);
   }
-  function normalizeOptions$5(options) {
+  function normalizeOptions$s(options) {
     if (typeof options === "boolean") {
       return options;
     }
@@ -461,11 +568,27 @@ var __async = (__this, __arguments, generator) => {
     }
     return capture;
   }
+  function getEventPosition(e) {
+    let clientX = 0, clientY = 0;
+    if ("touches" in e && e.touches.length > 0) {
+      clientX = e.touches[0].clientX;
+      clientY = e.touches[0].clientY;
+    } else if ("clientX" in e) {
+      clientX = e.clientX;
+      clientY = e.clientY;
+    }
+    return {
+      x: clientX,
+      y: clientY,
+      clientX,
+      clientY
+    };
+  }
   function isString(value) {
     return typeof value === "string";
   }
   function isNumber(value) {
-    return typeof value === "number" && !Number.isNaN(value);
+    return typeof value === "number" && !isNaN(value);
   }
   function isBoolean(value) {
     return typeof value === "boolean";
@@ -636,13 +759,13 @@ var __async = (__this, __arguments, generator) => {
   function parseTime(arg) {
     if (!arg) return null;
     if (arg.endsWith("ms")) {
-      return Number.parseInt(arg, 10);
+      return parseInt(arg, 10);
     }
     if (arg.endsWith("s")) {
-      return Number.parseFloat(arg) * 1e3;
+      return parseFloat(arg) * 1e3;
     }
-    const num = Number.parseInt(arg, 10);
-    return Number.isNaN(num) ? null : num;
+    const num = parseInt(arg, 10);
+    return isNaN(num) ? null : num;
   }
   function generateId(prefix = "") {
     return `${prefix}${Date.now().toString(36)}${Math.random().toString(36).slice(2, 9)}`;
@@ -658,7 +781,7 @@ var __async = (__this, __arguments, generator) => {
       prevent: false
     },
     mounted(el, binding) {
-      const options = normalizeOptions$4(binding.value);
+      const options = normalizeOptions$r(binding.value);
       if (options.disabled) return;
       const state = {
         options,
@@ -693,7 +816,7 @@ var __async = (__this, __arguments, generator) => {
       const state = el.__clickOutside;
       if (!state) return;
       const oldOptions = state.options;
-      const newOptions = normalizeOptions$4(binding.value);
+      const newOptions = normalizeOptions$r(binding.value);
       if (oldOptions.disabled !== newOptions.disabled) {
         if (newOptions.disabled) {
           state.handlers.forEach((handler, eventType) => {
@@ -730,7 +853,7 @@ var __async = (__this, __arguments, generator) => {
       delete el.__clickOutside;
     }
   });
-  function normalizeOptions$4(binding) {
+  function normalizeOptions$r(binding) {
     var _a, _b, _c, _d, _e;
     if (typeof binding === "function") {
       return {
@@ -807,7 +930,7 @@ var __async = (__this, __arguments, generator) => {
     name: "copy",
     ssr: false,
     mounted(el, binding) {
-      const options = normalizeOptions$3(binding.value);
+      const options = normalizeOptions$q(binding.value);
       if (options.disabled) return;
       if (options.title) {
         el.setAttribute("title", options.title);
@@ -843,7 +966,7 @@ var __async = (__this, __arguments, generator) => {
     updated(el, binding) {
       const state = el.__copy;
       if (!state) return;
-      state.options = normalizeOptions$3(binding.value);
+      state.options = normalizeOptions$q(binding.value);
       if (state.options.title) {
         el.setAttribute("title", state.options.title);
       }
@@ -855,23 +978,66 @@ var __async = (__this, __arguments, generator) => {
       delete el.__copy;
     }
   });
-  function normalizeOptions$3(binding) {
+  function normalizeOptions$q(binding) {
     if (typeof binding === "string") {
       return { value: binding };
     }
     return binding;
   }
+  const EVENT_MODIFIERS = [
+    "click",
+    "input",
+    "change",
+    "submit",
+    "scroll",
+    "resize",
+    "mouseenter",
+    "mouseleave",
+    "mousemove",
+    "mousedown",
+    "mouseup",
+    "keydown",
+    "keyup",
+    "focus",
+    "blur",
+    "touchstart",
+    "touchmove",
+    "touchend"
+  ];
+  function getEventTypeFromModifiers(modifiers) {
+    for (const modifier of EVENT_MODIFIERS) {
+      if (modifiers[modifier]) {
+        return modifier;
+      }
+    }
+    return null;
+  }
+  function getDefaultEventType(el) {
+    const tagName = el.tagName.toLowerCase();
+    if (tagName === "input" || tagName === "textarea") {
+      return "input";
+    }
+    return "click";
+  }
+  function normalizeOptions$p(binding, directiveBinding) {
+    const wait = parseTime(directiveBinding.arg) || 300;
+    if (typeof binding === "function") {
+      return { handler: binding, wait };
+    }
+    return __spreadProps(__spreadValues({}, binding), { wait: binding.wait || wait });
+  }
   const vDebounce = defineDirective({
     name: "debounce",
-    ssr: false,
+    ssr: true,
+    // SSR safe - event binding is skipped on server
     defaults: {
       wait: 300,
       leading: false,
       trailing: true
     },
     mounted(el, binding) {
-      const options = normalizeOptions$2(binding.value, binding);
-      const eventType = getEventTypeFromModifiers$1(binding.modifiers) || getEventType$1(el);
+      const options = normalizeOptions$p(binding.value, binding);
+      const eventType = getEventTypeFromModifiers(binding.modifiers) || getDefaultEventType(el);
       const debouncedFn = debounce(options.handler, options.wait, {
         leading: options.leading,
         trailing: options.trailing
@@ -886,7 +1052,7 @@ var __async = (__this, __arguments, generator) => {
     updated(el, binding) {
       const state = el.__debounce;
       if (!state) return;
-      const newOptions = normalizeOptions$2(binding.value, binding);
+      const newOptions = normalizeOptions$p(binding.value, binding);
       if (newOptions.wait !== state.options.wait || newOptions.leading !== state.options.leading || newOptions.trailing !== state.options.trailing) {
         state.debouncedFn.cancel();
         const debouncedFn = debounce(newOptions.handler, newOptions.wait, {
@@ -912,141 +1078,183 @@ var __async = (__this, __arguments, generator) => {
       delete el.__debounce;
     }
   });
-  function normalizeOptions$2(binding, directiveBinding) {
-    const wait = parseTime(directiveBinding.arg) || 300;
-    if (typeof binding === "function") {
-      return { handler: binding, wait };
+  function getBoundary(_el, boundary) {
+    var _a, _b;
+    if (!boundary) return null;
+    if (typeof boundary === "function") {
+      const boundaryEl = boundary();
+      return (_a = boundaryEl == null ? void 0 : boundaryEl.getBoundingClientRect()) != null ? _a : null;
     }
-    return __spreadProps(__spreadValues({}, binding), { wait: binding.wait || wait });
+    if (typeof boundary === "string") {
+      const boundaryEl = document.querySelector(boundary);
+      return (_b = boundaryEl == null ? void 0 : boundaryEl.getBoundingClientRect()) != null ? _b : null;
+    }
+    return boundary.getBoundingClientRect();
   }
-  function getEventType$1(el) {
-    const tagName = el.tagName.toLowerCase();
-    if (tagName === "input" || tagName === "textarea") {
-      return "input";
+  function getClientCoords(e) {
+    if (e.type.startsWith("touch")) {
+      const touch = e.touches[0];
+      return { clientX: touch.clientX, clientY: touch.clientY };
     }
-    return "click";
+    const mouseEvent = e;
+    return { clientX: mouseEvent.clientX, clientY: mouseEvent.clientY };
   }
-  const EVENT_MODIFIERS$1 = [
-    "click",
-    "input",
-    "change",
-    "submit",
-    "scroll",
-    "resize",
-    "mouseenter",
-    "mouseleave",
-    "mousemove",
-    "mousedown",
-    "mouseup",
-    "keydown",
-    "keyup",
-    "focus",
-    "blur",
-    "touchstart",
-    "touchmove",
-    "touchend"
-  ];
-  function getEventTypeFromModifiers$1(modifiers) {
-    for (const modifier of EVENT_MODIFIERS$1) {
-      if (modifiers[modifier]) {
-        return modifier;
-      }
+  function parseTranslate(transform) {
+    const match = transform.match(/translate\(([-\d.]+)px,\s*([-\d.]+)px\)/);
+    if (match) {
+      return { x: parseFloat(match[1]), y: parseFloat(match[2]) };
     }
-    return null;
+    return { x: 0, y: 0 };
   }
-  const vThrottle = defineDirective({
-    name: "throttle",
+  function normalizeOptions$o(binding) {
+    var _a, _b, _c;
+    if (binding === void 0 || binding === true) {
+      return { axis: "both", constrain: false, disabled: false };
+    }
+    if (binding === false) {
+      return { axis: "both", constrain: false, disabled: true };
+    }
+    return {
+      axis: (_a = binding.axis) != null ? _a : "both",
+      constrain: (_b = binding.constrain) != null ? _b : false,
+      boundary: binding.boundary,
+      handle: binding.handle,
+      disabled: (_c = binding.disabled) != null ? _c : false,
+      grid: binding.grid,
+      onStart: binding.onStart,
+      onDrag: binding.onDrag,
+      onEnd: binding.onEnd
+    };
+  }
+  const vDraggable = defineDirective({
+    name: "draggable",
     ssr: false,
-    defaults: {
-      wait: 300,
-      leading: true,
-      trailing: true
-    },
     mounted(el, binding) {
-      const options = normalizeOptions$1(binding.value, binding);
-      const eventType = getEventTypeFromModifiers(binding.modifiers) || getEventType(el);
-      const throttledFn = throttle(options.handler, options.wait, {
-        leading: options.leading,
-        trailing: options.trailing
-      });
-      el.addEventListener(eventType, throttledFn);
-      el.__throttle = {
-        throttledFn,
-        eventType,
-        options
+      const options = normalizeOptions$o(binding.value);
+      if (options.disabled) return;
+      if (getComputedStyle(el).position === "static") {
+        el.style.position = "absolute";
+      }
+      const state = {
+        options,
+        isDragging: false,
+        startX: 0,
+        startY: 0,
+        offsetX: 0,
+        offsetY: 0,
+        initialLeft: 0,
+        initialTop: 0,
+        boundaryWidth: 0,
+        boundaryHeight: 0,
+        elWidth: 0,
+        elHeight: 0,
+        handleEl: options.handle ? el.querySelector(options.handle) : null,
+        moveHandler: null,
+        endHandler: null
       };
+      el.__draggable = state;
+      const targetEl = state.handleEl || el;
+      targetEl.addEventListener("mousedown", startDrag);
+      targetEl.addEventListener("touchstart", startDrag, { passive: false });
+      function startDrag(e) {
+        var _a, _b, _c;
+        if (state.options.disabled) return;
+        if (e.type === "touchstart") {
+          e.preventDefault();
+        }
+        const { clientX, clientY } = getClientCoords(e);
+        state.isDragging = true;
+        state.startX = clientX;
+        state.startY = clientY;
+        const { x, y } = parseTranslate(el.style.transform);
+        state.offsetX = x;
+        state.offsetY = y;
+        if (state.options.constrain || state.options.boundary) {
+          const boundary = state.options.boundary ? getBoundary(el, state.options.boundary) : (_a = el.parentElement) == null ? void 0 : _a.getBoundingClientRect();
+          if (boundary) {
+            const elRect = el.getBoundingClientRect();
+            state.initialLeft = elRect.left - boundary.left;
+            state.initialTop = elRect.top - boundary.top;
+            state.boundaryWidth = boundary.width;
+            state.boundaryHeight = boundary.height;
+            state.elWidth = elRect.width;
+            state.elHeight = elRect.height;
+          }
+        }
+        el.classList.add("v-draggable--dragging");
+        state.moveHandler = (moveEvent) => {
+          var _a2, _b2;
+          if (!state.isDragging) return;
+          const { clientX: moveX, clientY: moveY } = getClientCoords(moveEvent);
+          let deltaX = moveX - state.startX, deltaY = moveY - state.startY;
+          if (state.options.axis === "x") {
+            deltaY = 0;
+          } else if (state.options.axis === "y") {
+            deltaX = 0;
+          }
+          if (state.options.grid) {
+            deltaX = Math.round(deltaX / state.options.grid[0]) * state.options.grid[0];
+            deltaY = Math.round(deltaY / state.options.grid[1]) * state.options.grid[1];
+          }
+          let newX = state.offsetX + deltaX, newY = state.offsetY + deltaY;
+          if (state.options.constrain || state.options.boundary) {
+            const newLeft = state.initialLeft + deltaX;
+            const newTop = state.initialTop + deltaY;
+            const maxLeft = state.boundaryWidth - state.elWidth;
+            const maxTop = state.boundaryHeight - state.elHeight;
+            const constrainedLeft = Math.max(0, Math.min(newLeft, maxLeft));
+            const constrainedTop = Math.max(0, Math.min(newTop, maxTop));
+            newX = state.offsetX + (constrainedLeft - state.initialLeft);
+            newY = state.offsetY + (constrainedTop - state.initialTop);
+          }
+          el.style.transform = `translate(${newX}px, ${newY}px)`;
+          (_b2 = (_a2 = state.options).onDrag) == null ? void 0 : _b2.call(_a2, { x: newX, y: newY }, moveEvent);
+        };
+        state.endHandler = () => {
+          var _a2, _b2;
+          if (!state.isDragging) return;
+          state.isDragging = false;
+          el.classList.remove("v-draggable--dragging");
+          if (state.moveHandler) {
+            document.removeEventListener("mousemove", state.moveHandler);
+            document.removeEventListener("touchmove", state.moveHandler);
+          }
+          if (state.endHandler) {
+            document.removeEventListener("mouseup", state.endHandler);
+            document.removeEventListener("touchend", state.endHandler);
+          }
+          const { x: finalX, y: finalY } = parseTranslate(el.style.transform);
+          (_b2 = (_a2 = state.options).onEnd) == null ? void 0 : _b2.call(_a2, { x: finalX, y: finalY }, new MouseEvent("mouseup"));
+        };
+        document.addEventListener("mousemove", state.moveHandler);
+        document.addEventListener("touchmove", state.moveHandler, { passive: false });
+        document.addEventListener("mouseup", state.endHandler);
+        document.addEventListener("touchend", state.endHandler);
+        (_c = (_b = state.options).onStart) == null ? void 0 : _c.call(_b, { x: state.offsetX, y: state.offsetY }, e);
+      }
     },
     updated(el, binding) {
-      const state = el.__throttle;
+      const state = el.__draggable;
       if (!state) return;
-      const newOptions = normalizeOptions$1(binding.value, binding);
-      if (newOptions.wait !== state.options.wait || newOptions.leading !== state.options.leading || newOptions.trailing !== state.options.trailing) {
-        state.throttledFn.cancel();
-        const throttledFn = throttle(newOptions.handler, newOptions.wait, {
-          leading: newOptions.leading,
-          trailing: newOptions.trailing
-        });
-        el.removeEventListener(state.eventType, state.throttledFn);
-        el.addEventListener(state.eventType, throttledFn);
-        el.__throttle = {
-          throttledFn,
-          eventType: state.eventType,
-          options: newOptions
-        };
-      } else if (newOptions.handler !== state.options.handler) {
-        state.options.handler = newOptions.handler;
+      state.options = normalizeOptions$o(binding.value);
+      if (state.options.handle) {
+        state.handleEl = el.querySelector(state.options.handle);
       }
     },
     unmounted(el) {
-      const state = el.__throttle;
+      const state = el.__draggable;
       if (!state) return;
-      state.throttledFn.cancel();
-      el.removeEventListener(state.eventType, state.throttledFn);
-      delete el.__throttle;
-    }
-  });
-  function normalizeOptions$1(binding, directiveBinding) {
-    const wait = parseTime(directiveBinding.arg) || 300;
-    if (typeof binding === "function") {
-      return { handler: binding, wait };
-    }
-    return __spreadProps(__spreadValues({}, binding), { wait: binding.wait || wait });
-  }
-  function getEventType(el) {
-    const tagName = el.tagName.toLowerCase();
-    if (tagName === "input" || tagName === "textarea") {
-      return "input";
-    }
-    return "click";
-  }
-  const EVENT_MODIFIERS = [
-    "click",
-    "input",
-    "change",
-    "submit",
-    "scroll",
-    "resize",
-    "mouseenter",
-    "mouseleave",
-    "mousemove",
-    "mousedown",
-    "mouseup",
-    "keydown",
-    "keyup",
-    "focus",
-    "blur",
-    "touchstart",
-    "touchmove",
-    "touchend"
-  ];
-  function getEventTypeFromModifiers(modifiers) {
-    for (const modifier of EVENT_MODIFIERS) {
-      if (modifiers[modifier]) {
-        return modifier;
+      if (state.moveHandler) {
+        document.removeEventListener("mousemove", state.moveHandler);
+        document.removeEventListener("touchmove", state.moveHandler);
+      }
+      if (state.endHandler) {
+        document.removeEventListener("mouseup", state.endHandler);
+        document.removeEventListener("touchend", state.endHandler);
       }
+      delete el.__draggable;
     }
-    return null;
-  }
+  });
   const FOCUSABLE_TAGS = /* @__PURE__ */ new Set(["input", "textarea", "select", "button"]);
   function isEqual(a, b) {
     if (a === b) return true;
@@ -1060,13 +1268,15 @@ var __async = (__this, __arguments, generator) => {
   }
   const vFocus = defineDirective({
     name: "focus",
-    ssr: false,
+    ssr: true,
+    // SSR safe - will skip focus on server
     defaults: {
       focus: true,
       refocus: false
     },
     mounted(el, binding) {
-      const options = normalizeOptions(binding.value);
+      if (!isBrowser()) return;
+      const options = normalizeOptions$n(binding.value);
       if (!options.focus || !isFocusable(el)) {
         if (options.focus) {
           console.warn("[Directix] v-focus: Element is not focusable");
@@ -1094,7 +1304,7 @@ var __async = (__this, __arguments, generator) => {
     updated(el, binding) {
       const state = el.__focus;
       if (!state) return;
-      const newOptions = normalizeOptions(binding.value);
+      const newOptions = normalizeOptions$n(binding.value);
       if (newOptions.onFocus !== state.options.onFocus) {
         el.removeEventListener("focus", state.handleFocus);
         state.handleFocus = () => {
@@ -1126,7 +1336,7 @@ var __async = (__this, __arguments, generator) => {
       delete el.__focus;
     }
   });
-  function normalizeOptions(binding) {
+  function normalizeOptions$n(binding) {
     if (typeof binding === "boolean") {
       return { focus: binding, refocus: false };
     }
@@ -1149,14 +1359,3483 @@ var __async = (__this, __arguments, generator) => {
     }
     return false;
   }
-  const allDirectives = {
-    "click-outside": vClickOutside,
-    copy: vCopy,
-    debounce: vDebounce,
-    throttle: vThrottle,
-    focus: vFocus
+  function normalizeOptions$m(binding) {
+    if (typeof binding === "function") {
+      return { handler: binding, class: "v-hover" };
+    }
+    return __spreadValues({
+      class: "v-hover",
+      disabled: false,
+      enterDelay: 0,
+      leaveDelay: 0
+    }, binding);
+  }
+  const vHover = defineDirective({
+    name: "hover",
+    ssr: false,
+    defaults: {
+      class: "v-hover",
+      disabled: false,
+      enterDelay: 0,
+      leaveDelay: 0
+    },
+    mounted(el, binding) {
+      const options = normalizeOptions$m(binding.value);
+      if (options.disabled || !isBrowser()) return;
+      const state = {
+        options,
+        isHovering: false,
+        enterTimerId: null,
+        leaveTimerId: null,
+        enterHandler: () => {
+        },
+        leaveHandler: () => {
+        }
+      };
+      state.enterHandler = (e) => {
+        const event = e;
+        if (state.leaveTimerId) {
+          clearTimeout(state.leaveTimerId);
+          state.leaveTimerId = null;
+        }
+        if (state.isHovering) return;
+        if (options.enterDelay && options.enterDelay > 0) {
+          state.enterTimerId = setTimeout(() => {
+            state.isHovering = true;
+            applyHoverState(el, state, event);
+          }, options.enterDelay);
+        } else {
+          state.isHovering = true;
+          applyHoverState(el, state, event);
+        }
+      };
+      state.leaveHandler = (e) => {
+        const event = e;
+        if (state.enterTimerId) {
+          clearTimeout(state.enterTimerId);
+          state.enterTimerId = null;
+        }
+        if (!state.isHovering) return;
+        if (options.leaveDelay && options.leaveDelay > 0) {
+          state.leaveTimerId = setTimeout(() => {
+            state.isHovering = false;
+            applyLeaveState(el, state, event);
+          }, options.leaveDelay);
+        } else {
+          state.isHovering = false;
+          applyLeaveState(el, state, event);
+        }
+      };
+      el.__hover = state;
+      on(el, "mouseenter", state.enterHandler);
+      on(el, "mouseleave", state.leaveHandler);
+    },
+    updated(el, binding) {
+      const state = el.__hover;
+      if (!state) return;
+      const newOptions = normalizeOptions$m(binding.value);
+      if (newOptions.disabled && !state.options.disabled) {
+        el.classList.remove(state.options.class || "v-hover");
+      } else if (!newOptions.disabled && state.options.disabled) ;
+      state.options = newOptions;
+    },
+    unmounted(el) {
+      const state = el.__hover;
+      if (!state) return;
+      if (state.enterTimerId) {
+        clearTimeout(state.enterTimerId);
+      }
+      if (state.leaveTimerId) {
+        clearTimeout(state.leaveTimerId);
+      }
+      off(el, "mouseenter", state.enterHandler);
+      off(el, "mouseleave", state.leaveHandler);
+      el.classList.remove(state.options.class || "v-hover");
+      delete el.__hover;
+    }
+  });
+  function applyHoverState(el, state, e) {
+    var _a, _b;
+    const { options } = state;
+    if (options.class) {
+      el.classList.add(options.class);
+    }
+    el.dispatchEvent(new CustomEvent("hover:enter", { detail: { event: e } }));
+    (_a = options.onEnter) == null ? void 0 : _a.call(options, e);
+    (_b = options.handler) == null ? void 0 : _b.call(options, true, e);
+  }
+  function applyLeaveState(el, state, e) {
+    var _a, _b;
+    const { options } = state;
+    if (options.class) {
+      el.classList.remove(options.class);
+    }
+    el.dispatchEvent(new CustomEvent("hover:leave", { detail: { event: e } }));
+    (_a = options.onLeave) == null ? void 0 : _a.call(options, e);
+    (_b = options.handler) == null ? void 0 : _b.call(options, false, e);
+  }
+  const DEFAULTS = {
+    minScale: 0.5,
+    maxScale: 5,
+    doubleTapZoom: 2.5,
+    tapTimeout: 300,
+    animationDuration: 300,
+    hintDuration: 3e3,
+    zoomIndicatorDuration: 1500
   };
-  const install = (app, options = {}) => {
+  let globalZIndex = 9999;
+  function getDistance$2(x1, y1, x2, y2) {
+    return Math.sqrt(__pow(x2 - x1, 2) + __pow(y2 - y1, 2));
+  }
+  function clamp(value, min, max) {
+    return Math.max(min, Math.min(max, value));
+  }
+  function createOverlay(options) {
+    var _a;
+    const zIndex = (_a = options.zIndex) != null ? _a : ++globalZIndex;
+    const overlay = document.createElement("div");
+    overlay.className = "v-image-preview-overlay";
+    if (options.class) overlay.classList.add(options.class);
+    Object.assign(overlay.style, {
+      position: "fixed",
+      inset: "0",
+      background: "rgba(0, 0, 0, 0.95)",
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      zIndex: String(zIndex),
+      cursor: "zoom-out",
+      opacity: "0",
+      transition: "opacity 0.3s",
+      touchAction: "none",
+      overflow: "hidden"
+    });
+    const imageContainer = document.createElement("div");
+    Object.assign(imageContainer.style, {
+      position: "relative",
+      transformOrigin: "center center",
+      transition: "transform 0.1s ease-out",
+      willChange: "transform"
+    });
+    const image = document.createElement("img");
+    image.src = options.previewSrc || options.src || "";
+    image.alt = options.alt || "";
+    Object.assign(image.style, {
+      maxWidth: "95vw",
+      maxHeight: "90vh",
+      objectFit: "contain",
+      cursor: "grab",
+      userSelect: "none",
+      WebkitUserDrag: "none"
+    });
+    image.addEventListener("dragstart", (e) => e.preventDefault());
+    imageContainer.appendChild(image);
+    if (options.showCloseButton !== false) {
+      const closeBtn = document.createElement("button");
+      closeBtn.className = "v-image-preview-close";
+      closeBtn.innerHTML = "×";
+      closeBtn.setAttribute("aria-label", "Close preview");
+      Object.assign(closeBtn.style, {
+        position: "fixed",
+        top: "16px",
+        right: "16px",
+        width: "44px",
+        height: "44px",
+        border: "none",
+        background: "rgba(255, 255, 255, 0.15)",
+        color: "white",
+        fontSize: "28px",
+        cursor: "pointer",
+        borderRadius: "50%",
+        transition: "background 0.2s, transform 0.2s",
+        zIndex: String(zIndex + 1),
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        backdropFilter: "blur(10px)",
+        WebkitBackdropFilter: "blur(10px)"
+      });
+      const setBtnStyle = (bg, scale) => {
+        closeBtn.style.background = bg;
+        closeBtn.style.transform = scale;
+      };
+      closeBtn.addEventListener("mouseenter", () => setBtnStyle("rgba(255, 255, 255, 0.25)", "scale(1.1)"));
+      closeBtn.addEventListener("mouseleave", () => setBtnStyle("rgba(255, 255, 255, 0.15)", "scale(1)"));
+      closeBtn.addEventListener("touchstart", () => setBtnStyle("rgba(255, 255, 255, 0.35)", "scale(1.15)"), { passive: true });
+      closeBtn.addEventListener("touchend", () => setBtnStyle("rgba(255, 255, 255, 0.15)", "scale(1)"), { passive: true });
+      overlay.appendChild(closeBtn);
+    }
+    if (options.showZoomIndicator !== false) {
+      const zoomIndicator = document.createElement("div");
+      zoomIndicator.className = "v-image-preview-zoom";
+      zoomIndicator.textContent = "100%";
+      Object.assign(zoomIndicator.style, {
+        position: "fixed",
+        bottom: "24px",
+        left: "50%",
+        transform: "translateX(-50%)",
+        background: "rgba(0, 0, 0, 0.6)",
+        color: "white",
+        padding: "8px 16px",
+        borderRadius: "20px",
+        fontSize: "14px",
+        fontWeight: "500",
+        opacity: "0",
+        transition: "opacity 0.3s",
+        zIndex: String(zIndex + 1),
+        backdropFilter: "blur(10px)",
+        WebkitBackdropFilter: "blur(10px)"
+      });
+      overlay.appendChild(zoomIndicator);
+    }
+    const hint = document.createElement("div");
+    hint.className = "v-image-preview-hint";
+    hint.textContent = "Pinch to zoom • Double tap • Swipe up to close";
+    Object.assign(hint.style, {
+      position: "fixed",
+      bottom: "60px",
+      left: "50%",
+      transform: "translateX(-50%)",
+      color: "rgba(255, 255, 255, 0.6)",
+      fontSize: "12px",
+      opacity: "1",
+      transition: "opacity 0.5s",
+      zIndex: String(zIndex + 1),
+      pointerEvents: "none"
+    });
+    overlay.appendChild(hint);
+    setTimeout(() => hint.style.opacity = "0", DEFAULTS.hintDuration);
+    overlay.appendChild(imageContainer);
+    return { overlay, imageContainer, image };
+  }
+  function createTransformManager(state) {
+    const updateTransform = (animate = false) => {
+      var _a;
+      if (!state.imageContainer) return;
+      const { scale, translateX, translateY } = state.transform;
+      state.imageContainer.style.transition = animate ? "transform 0.2s ease-out" : "none";
+      state.imageContainer.style.transform = `translate(${translateX}px, ${translateY}px) scale(${scale})`;
+      const zoomIndicator = (_a = state.overlay) == null ? void 0 : _a.querySelector(".v-image-preview-zoom");
+      if (zoomIndicator) {
+        zoomIndicator.textContent = `${Math.round(scale * 100)}%`;
+        zoomIndicator.style.opacity = "1";
+        clearTimeout(zoomIndicator._hideTimer);
+        zoomIndicator._hideTimer = setTimeout(() => {
+          zoomIndicator.style.opacity = "0";
+        }, DEFAULTS.zoomIndicatorDuration);
+      }
+    };
+    const resetTransform = () => {
+      state.transform = { scale: 1, translateX: 0, translateY: 0 };
+      updateTransform(true);
+    };
+    const constrainScale = (newScale) => {
+      const { minScale = DEFAULTS.minScale, maxScale = DEFAULTS.maxScale } = state.options;
+      return clamp(newScale, minScale, maxScale);
+    };
+    const constrainTranslate = (x, y) => {
+      const { scale } = state.transform;
+      if (!state.image || scale <= 1) return { x: 0, y: 0 };
+      const rect = state.image.getBoundingClientRect();
+      const maxX = rect.width * (scale - 1) / 2;
+      const maxY = rect.height * (scale - 1) / 2;
+      return {
+        x: clamp(x, -maxX, maxX),
+        y: clamp(y, -maxY, maxY)
+      };
+    };
+    return { updateTransform, resetTransform, constrainScale, constrainTranslate };
+  }
+  function createGestureHandlers(state, transformManager, closePreview) {
+    const { updateTransform, resetTransform, constrainScale, constrainTranslate } = transformManager;
+    const handleTouchStart = (e) => {
+      if (!state.imageContainer) return;
+      const now = Date.now();
+      const { gesture, transform, options } = state;
+      if (e.touches.length === 1) {
+        if (options.enableDoubleTap !== false && now - gesture.lastTapTime < DEFAULTS.tapTimeout) {
+          e.preventDefault();
+          transform.scale = transform.scale > 1 ? 1 : constrainScale(DEFAULTS.doubleTapZoom);
+          gesture.lastTapTime = 0;
+          updateTransform(true);
+          return;
+        }
+        gesture.lastTapTime = now;
+        gesture.isDragging = true;
+        gesture.startX = e.touches[0].clientX - transform.translateX;
+        gesture.startY = e.touches[0].clientY - transform.translateY;
+        gesture.swipeStartY = e.touches[0].clientY;
+      } else if (e.touches.length === 2 && options.enablePinchZoom !== false) {
+        gesture.isDragging = false;
+        gesture.startDistance = getDistance$2(
+          e.touches[0].clientX,
+          e.touches[0].clientY,
+          e.touches[1].clientX,
+          e.touches[1].clientY
+        );
+        gesture.startScale = transform.scale;
+      }
+    };
+    const handleTouchMove = (e) => {
+      if (!state.imageContainer) return;
+      e.preventDefault();
+      const { gesture, transform, options } = state;
+      if (e.touches.length === 1 && gesture.isDragging) {
+        const newX = e.touches[0].clientX - gesture.startX;
+        const newY = e.touches[0].clientY - gesture.startY;
+        const constrained = constrainTranslate(newX, newY);
+        transform.translateX = constrained.x;
+        transform.translateY = constrained.y;
+        updateTransform(false);
+      } else if (e.touches.length === 2 && options.enablePinchZoom !== false) {
+        const currentDistance = getDistance$2(
+          e.touches[0].clientX,
+          e.touches[0].clientY,
+          e.touches[1].clientX,
+          e.touches[1].clientY
+        );
+        transform.scale = constrainScale(gesture.startScale * (currentDistance / gesture.startDistance));
+        updateTransform(false);
+      }
+    };
+    const handleTouchEnd = (e) => {
+      const { gesture, transform, options } = state;
+      gesture.isDragging = false;
+      if (options.enableSwipeClose !== false && e.changedTouches.length === 1 && transform.scale <= 1) {
+        const deltaY = e.changedTouches[0].clientY - gesture.swipeStartY;
+        if (deltaY < -100) {
+          closePreview();
+          return;
+        }
+      }
+      if (transform.scale < 1) {
+        resetTransform();
+      }
+    };
+    const handleMouseDown = (e) => {
+      if (!state.imageContainer) return;
+      state.gesture.isDragging = true;
+      state.gesture.startX = e.clientX - state.transform.translateX;
+      state.gesture.startY = e.clientY - state.transform.translateY;
+      state.imageContainer.style.cursor = "grabbing";
+    };
+    const handleMouseMove = (e) => {
+      if (!state.gesture.isDragging || !state.imageContainer) return;
+      const newX = e.clientX - state.gesture.startX;
+      const newY = e.clientY - state.gesture.startY;
+      const constrained = constrainTranslate(newX, newY);
+      state.transform.translateX = constrained.x;
+      state.transform.translateY = constrained.y;
+      updateTransform(false);
+    };
+    const handleMouseUp = () => {
+      state.gesture.isDragging = false;
+      if (state.imageContainer) {
+        state.imageContainer.style.cursor = "grab";
+      }
+    };
+    const handleWheel = (e) => {
+      if (!state.imageContainer || state.options.enablePinchZoom === false) return;
+      e.preventDefault();
+      const delta = e.deltaY > 0 ? 0.9 : 1.1;
+      state.transform.scale = constrainScale(state.transform.scale * delta);
+      updateTransform(false);
+      if (state.transform.scale < 0.8) {
+        setTimeout(resetTransform, 100);
+      }
+    };
+    return { handleTouchStart, handleTouchMove, handleTouchEnd, handleMouseDown, handleMouseMove, handleMouseUp, handleWheel };
+  }
+  function normalizeOptions$l(binding, el) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
+    const elSrc = el.tagName === "IMG" ? el.src : void 0;
+    const elPreviewSrc = el.getAttribute("data-preview") || void 0;
+    const elAlt = el.tagName === "IMG" ? el.alt : el.getAttribute("alt") || void 0;
+    if (typeof binding === "string") {
+      return {
+        src: binding,
+        previewSrc: elPreviewSrc,
+        alt: elAlt,
+        enablePinchZoom: true,
+        enableDoubleTap: true,
+        enableSwipeClose: true,
+        showZoomIndicator: true,
+        showCloseButton: true,
+        closeOnClickOutside: true,
+        closeOnEsc: true,
+        minScale: DEFAULTS.minScale,
+        maxScale: DEFAULTS.maxScale
+      };
+    }
+    return {
+      src: (binding == null ? void 0 : binding.src) || elSrc,
+      previewSrc: (binding == null ? void 0 : binding.previewSrc) || elPreviewSrc,
+      alt: (binding == null ? void 0 : binding.alt) || elAlt,
+      disabled: (_a = binding == null ? void 0 : binding.disabled) != null ? _a : false,
+      closeOnClickOutside: (_b = binding == null ? void 0 : binding.closeOnClickOutside) != null ? _b : true,
+      closeOnEsc: (_c = binding == null ? void 0 : binding.closeOnEsc) != null ? _c : true,
+      showCloseButton: (_d = binding == null ? void 0 : binding.showCloseButton) != null ? _d : true,
+      zIndex: binding == null ? void 0 : binding.zIndex,
+      class: binding == null ? void 0 : binding.class,
+      enablePinchZoom: (_e = binding == null ? void 0 : binding.enablePinchZoom) != null ? _e : true,
+      enableDoubleTap: (_f = binding == null ? void 0 : binding.enableDoubleTap) != null ? _f : true,
+      enableSwipeClose: (_g = binding == null ? void 0 : binding.enableSwipeClose) != null ? _g : true,
+      showZoomIndicator: (_h = binding == null ? void 0 : binding.showZoomIndicator) != null ? _h : true,
+      minScale: (_i = binding == null ? void 0 : binding.minScale) != null ? _i : DEFAULTS.minScale,
+      maxScale: (_j = binding == null ? void 0 : binding.maxScale) != null ? _j : DEFAULTS.maxScale,
+      onOpen: binding == null ? void 0 : binding.onOpen,
+      onClose: binding == null ? void 0 : binding.onClose
+    };
+  }
+  const vImagePreview = defineDirective({
+    name: "image-preview",
+    ssr: false,
+    mounted(el, binding) {
+      const options = normalizeOptions$l(binding.value, el);
+      const state = {
+        options,
+        overlay: null,
+        imageContainer: null,
+        image: null,
+        isOpen: false,
+        transform: { scale: 1, translateX: 0, translateY: 0 },
+        gesture: {
+          isDragging: false,
+          startX: 0,
+          startY: 0,
+          startDistance: 0,
+          startScale: 1,
+          lastTapTime: 0,
+          swipeStartY: 0
+        },
+        handlers: {
+          click: () => {
+          },
+          esc: null,
+          touchStart: null,
+          touchMove: null,
+          touchEnd: null,
+          mouseDown: null,
+          mouseMove: null,
+          mouseUp: null,
+          wheel: null
+        }
+      };
+      el.__imagePreview = state;
+      if (options.disabled) return;
+      el.style.cursor = "zoom-in";
+      const transformManager = createTransformManager(state);
+      const closePreview = () => {
+        if (!state.isOpen || !state.overlay) return;
+        state.overlay.style.opacity = "0";
+        setTimeout(() => {
+          var _a, _b;
+          if (!state.overlay) return;
+          state.overlay.remove();
+          state.overlay = null;
+          state.imageContainer = null;
+          state.image = null;
+          state.isOpen = false;
+          state.transform = { scale: 1, translateX: 0, translateY: 0 };
+          document.body.style.overflow = "";
+          const { handlers } = state;
+          if (handlers.esc) document.removeEventListener("keydown", handlers.esc);
+          if (handlers.touchStart) document.removeEventListener("touchstart", handlers.touchStart);
+          if (handlers.touchMove) document.removeEventListener("touchmove", handlers.touchMove);
+          if (handlers.touchEnd) document.removeEventListener("touchend", handlers.touchEnd);
+          if (handlers.mouseDown) document.removeEventListener("mousedown", handlers.mouseDown);
+          if (handlers.mouseMove) document.removeEventListener("mousemove", handlers.mouseMove);
+          if (handlers.mouseUp) document.removeEventListener("mouseup", handlers.mouseUp);
+          if (handlers.wheel) document.removeEventListener("wheel", handlers.wheel);
+          (_b = (_a = state.options).onClose) == null ? void 0 : _b.call(_a);
+        }, DEFAULTS.animationDuration);
+      };
+      const gestureHandlers = createGestureHandlers(state, transformManager, closePreview);
+      const openPreview = () => {
+        var _a, _b, _c;
+        if (state.isOpen || state.options.disabled) return;
+        const { overlay, imageContainer, image } = createOverlay(state.options);
+        state.overlay = overlay;
+        state.imageContainer = imageContainer;
+        state.image = image;
+        state.isOpen = true;
+        document.body.appendChild(overlay);
+        document.body.style.overflow = "hidden";
+        requestAnimationFrame(() => overlay.style.opacity = "1");
+        state.handlers.touchStart = gestureHandlers.handleTouchStart;
+        state.handlers.touchMove = gestureHandlers.handleTouchMove;
+        state.handlers.touchEnd = gestureHandlers.handleTouchEnd;
+        state.handlers.mouseDown = gestureHandlers.handleMouseDown;
+        state.handlers.mouseMove = gestureHandlers.handleMouseMove;
+        state.handlers.mouseUp = gestureHandlers.handleMouseUp;
+        state.handlers.wheel = gestureHandlers.handleWheel;
+        overlay.addEventListener("touchstart", gestureHandlers.handleTouchStart, { passive: false });
+        overlay.addEventListener("touchmove", gestureHandlers.handleTouchMove, { passive: false });
+        overlay.addEventListener("touchend", gestureHandlers.handleTouchEnd, { passive: true });
+        image.addEventListener("mousedown", gestureHandlers.handleMouseDown);
+        document.addEventListener("mousemove", gestureHandlers.handleMouseMove);
+        document.addEventListener("mouseup", gestureHandlers.handleMouseUp);
+        overlay.addEventListener("wheel", gestureHandlers.handleWheel, { passive: false });
+        (_a = overlay.querySelector(".v-image-preview-close")) == null ? void 0 : _a.addEventListener("click", (e) => {
+          e.stopPropagation();
+          closePreview();
+        });
+        if (state.options.closeOnClickOutside !== false) {
+          overlay.addEventListener("click", () => {
+            if (state.transform.scale <= 1) {
+              closePreview();
+            } else {
+              transformManager.resetTransform();
+            }
+          });
+        }
+        if (state.options.closeOnEsc !== false) {
+          state.handlers.esc = (e) => {
+            if (e.key === "Escape") {
+              state.transform.scale > 1 ? transformManager.resetTransform() : closePreview();
+            }
+          };
+          document.addEventListener("keydown", state.handlers.esc);
+        }
+        (_c = (_b = state.options).onOpen) == null ? void 0 : _c.call(_b);
+      };
+      state.handlers.click = openPreview;
+      el.addEventListener("click", openPreview);
+    },
+    updated(el, binding) {
+      const state = el.__imagePreview;
+      if (!state) return;
+      state.options = normalizeOptions$l(binding.value, el);
+      el.style.cursor = state.options.disabled ? "" : "zoom-in";
+    },
+    unmounted(el) {
+      const state = el.__imagePreview;
+      if (!state) return;
+      el.removeEventListener("click", state.handlers.click);
+      if (state.isOpen && state.overlay) {
+        state.overlay.remove();
+        document.body.style.overflow = "";
+      }
+      if (state.handlers.esc) document.removeEventListener("keydown", state.handlers.esc);
+      if (state.handlers.touchStart) document.removeEventListener("touchstart", state.handlers.touchStart);
+      if (state.handlers.touchMove) document.removeEventListener("touchmove", state.handlers.touchMove);
+      if (state.handlers.touchEnd) document.removeEventListener("touchend", state.handlers.touchEnd);
+      if (state.handlers.mouseDown) document.removeEventListener("mousedown", state.handlers.mouseDown);
+      if (state.handlers.mouseMove) document.removeEventListener("mousemove", state.handlers.mouseMove);
+      if (state.handlers.mouseUp) document.removeEventListener("mouseup", state.handlers.mouseUp);
+      if (state.handlers.wheel) document.removeEventListener("wheel", state.handlers.wheel);
+      delete el.__imagePreview;
+    }
+  });
+  function normalizeOptions$k(binding) {
+    if (typeof binding === "function") {
+      return { handler: binding, distance: 0, throttle: 200, useIntersection: true };
+    }
+    if (!binding) {
+      throw new Error("[Directix] v-infinite-scroll: handler is required");
+    }
+    return __spreadValues({
+      distance: 0,
+      disabled: false,
+      loading: false,
+      useIntersection: true,
+      throttle: 200
+    }, binding);
+  }
+  const vInfiniteScroll = defineDirective({
+    name: "infinite-scroll",
+    ssr: false,
+    defaults: {
+      distance: 0,
+      disabled: false,
+      loading: false,
+      useIntersection: true,
+      throttle: 200
+    },
+    mounted(el, binding) {
+      const options = normalizeOptions$k(binding.value);
+      if (options.disabled || !isBrowser()) return;
+      let container;
+      if (options.container) {
+        if (typeof options.container === "string") {
+          const found = document.querySelector(options.container);
+          container = found || getScrollParent(el);
+        } else {
+          container = options.container;
+        }
+      } else {
+        container = getScrollParent(el);
+      }
+      const state = {
+        options,
+        container,
+        sentinel: null,
+        observer: null,
+        throttleTimer: null,
+        isLoading: false,
+        scrollHandler: (_e) => __async(null, null, function* () {
+          if (state.isLoading || state.options.disabled || state.options.loading) {
+            return;
+          }
+          if (state.throttleTimer) {
+            return;
+          }
+          state.throttleTimer = setTimeout(() => {
+            state.throttleTimer = null;
+          }, options.throttle);
+          const shouldLoad = checkShouldLoad(container, el, options.distance || 0);
+          if (shouldLoad) {
+            yield triggerLoad(state, el);
+          }
+        })
+      };
+      el.__infiniteScroll = state;
+      if (options.useIntersection && supportsIntersectionObserver()) {
+        setupIntersectionObserver(el, state);
+      } else {
+        on(container, "scroll", state.scrollHandler, { passive: true });
+      }
+    },
+    updated(el, binding) {
+      const state = el.__infiniteScroll;
+      if (!state) return;
+      state.options = normalizeOptions$k(binding.value);
+    },
+    unmounted(el) {
+      const state = el.__infiniteScroll;
+      if (!state) return;
+      if (state.throttleTimer) {
+        clearTimeout(state.throttleTimer);
+      }
+      if (state.observer) {
+        state.observer.disconnect();
+      }
+      if (state.sentinel && state.sentinel.parentNode) {
+        state.sentinel.parentNode.removeChild(state.sentinel);
+      }
+      off(state.container, "scroll", state.scrollHandler);
+      delete el.__infiniteScroll;
+    }
+  });
+  function checkShouldLoad(container, _el, distance) {
+    if (container === window) {
+      const scrollTop2 = window.scrollY || document.documentElement.scrollTop;
+      const scrollHeight2 = document.documentElement.scrollHeight;
+      const clientHeight2 = window.innerHeight;
+      return scrollTop2 + clientHeight2 >= scrollHeight2 - distance;
+    }
+    const el = container;
+    const scrollTop = el.scrollTop;
+    const scrollHeight = el.scrollHeight;
+    const clientHeight = el.clientHeight;
+    return scrollTop + clientHeight >= scrollHeight - distance;
+  }
+  function triggerLoad(state, el) {
+    return __async(this, null, function* () {
+      var _a, _b, _c, _d, _e, _f;
+      state.isLoading = true;
+      (_b = (_a = state.options).onLoadStart) == null ? void 0 : _b.call(_a);
+      el.classList.add("v-infinite-scroll--loading");
+      try {
+        yield state.options.handler();
+      } catch (err) {
+        (_d = (_c = state.options).onError) == null ? void 0 : _d.call(_c, err);
+      } finally {
+        state.isLoading = false;
+        (_f = (_e = state.options).onLoadEnd) == null ? void 0 : _f.call(_e);
+        el.classList.remove("v-infinite-scroll--loading");
+      }
+    });
+  }
+  function setupIntersectionObserver(el, state) {
+    const sentinel = document.createElement("div");
+    sentinel.className = "v-infinite-scroll__sentinel";
+    sentinel.style.cssText = `
+    height: 1px;
+    width: 100%;
+    clear: both;
+  `;
+    el.appendChild(sentinel);
+    state.sentinel = sentinel;
+    state.observer = new IntersectionObserver(
+      (entries) => __async(null, null, function* () {
+        for (const entry of entries) {
+          if (entry.isIntersecting) {
+            if (!state.isLoading && !state.options.disabled && !state.options.loading) {
+              yield triggerLoad(state, el);
+            }
+          }
+        }
+      }),
+      {
+        root: state.container === window ? null : state.container,
+        rootMargin: `${state.options.distance || 0}px`,
+        threshold: 0
+      }
+    );
+    state.observer.observe(sentinel);
+  }
+  const STATE_KEY$3 = "__intersect";
+  function normalizeOptions$j(binding) {
+    const options = typeof binding === "function" ? { handler: binding } : __spreadValues({}, binding);
+    if (options.root !== null && typeof options.root === "object" && "value" in options.root) {
+      options.root = options.root.value;
+    }
+    return options;
+  }
+  function createObserverCallback(el, state, options) {
+    return (entries) => {
+      var _a, _b, _c, _d;
+      for (const entry of entries) {
+        if (options.once && state.hasTriggeredOnce) continue;
+        const { isIntersecting } = entry;
+        (_a = options.handler) == null ? void 0 : _a.call(options, entry, state.observer);
+        (_b = options.onChange) == null ? void 0 : _b.call(options, isIntersecting, entry);
+        if (isIntersecting) {
+          (_c = options.onEnter) == null ? void 0 : _c.call(options, entry, state.observer);
+          if (options.once) state.hasTriggeredOnce = true;
+        } else {
+          (_d = options.onLeave) == null ? void 0 : _d.call(options, entry, state.observer);
+        }
+        el.dispatchEvent(new CustomEvent("intersect", { detail: { isIntersecting, entry } }));
+      }
+    };
+  }
+  function createObserver(el, state, options) {
+    return new IntersectionObserver(createObserverCallback(el, state, options), {
+      root: options.root,
+      rootMargin: options.rootMargin,
+      threshold: options.threshold
+    });
+  }
+  const vIntersect = defineDirective({
+    name: "intersect",
+    ssr: false,
+    defaults: {
+      disabled: false,
+      once: false,
+      rootMargin: "0px",
+      threshold: 0
+    },
+    mounted(el, binding) {
+      const options = normalizeOptions$j(binding.value);
+      if (options.disabled || !isBrowser() || !supportsIntersectionObserver()) {
+        if (!supportsIntersectionObserver()) {
+          console.warn("[Directix] v-intersect: IntersectionObserver not supported");
+        }
+        return;
+      }
+      const state = {
+        options,
+        observer: null,
+        hasTriggeredOnce: false
+      };
+      state.observer = createObserver(el, state, options);
+      el[STATE_KEY$3] = state;
+      state.observer.observe(el);
+    },
+    updated(el, binding) {
+      var _a, _b, _c;
+      const state = el[STATE_KEY$3];
+      if (!state) return;
+      const newOptions = normalizeOptions$j(binding.value);
+      const observerOptionsChanged = newOptions.root !== state.options.root || newOptions.rootMargin !== state.options.rootMargin || newOptions.threshold !== state.options.threshold;
+      if (newOptions.disabled !== state.options.disabled) {
+        if (newOptions.disabled) {
+          (_a = state.observer) == null ? void 0 : _a.disconnect();
+        } else {
+          (_b = state.observer) == null ? void 0 : _b.observe(el);
+        }
+      }
+      if (observerOptionsChanged) {
+        (_c = state.observer) == null ? void 0 : _c.disconnect();
+        state.observer = createObserver(el, state, newOptions);
+        state.observer.observe(el);
+      }
+      state.options = newOptions;
+    },
+    unmounted(el) {
+      var _a;
+      const state = el[STATE_KEY$3];
+      if (!state) return;
+      (_a = state.observer) == null ? void 0 : _a.disconnect();
+      delete el[STATE_KEY$3];
+    }
+  });
+  let globalObserver = null;
+  function getGlobalObserver(preload) {
+    if (globalObserver) return globalObserver;
+    globalObserver = new IntersectionObserver(
+      (entries) => {
+        entries.forEach((entry) => {
+          if (entry.isIntersecting) {
+            load(entry.target);
+            globalObserver == null ? void 0 : globalObserver.unobserve(entry.target);
+          }
+        });
+      },
+      {
+        rootMargin: `${preload}px`
+      }
+    );
+    return globalObserver;
+  }
+  function setSrc(el, src) {
+    if (el.tagName === "IMG") {
+      el.src = src;
+    } else {
+      el.style.backgroundImage = `url("${src}")`;
+    }
+  }
+  function setLazyState(el, state) {
+    el.dataset.lazyState = state;
+  }
+  function getLazyState(el) {
+    return el.dataset.lazyState || "pending";
+  }
+  function load(el) {
+    const state = el.__lazy;
+    if (!state || !state.options.src) return;
+    if (state.options.filter && !state.options.filter(state.options.src)) {
+      return;
+    }
+    setLazyState(el, "loading");
+    state.attempt++;
+    el.classList.add("v-lazy--loading");
+    const img = new Image();
+    img.onload = () => {
+      var _a, _b;
+      setSrc(el, state.options.src);
+      setLazyState(el, "loaded");
+      el.classList.remove("v-lazy--loading");
+      el.classList.add("v-lazy--loaded");
+      (_b = (_a = state.options).onLoad) == null ? void 0 : _b.call(_a, el);
+    };
+    img.onerror = () => {
+      var _a, _b;
+      el.classList.remove("v-lazy--loading");
+      if (state.attempt < (state.options.attempt || 1)) {
+        setTimeout(() => load(el), 1e3 * state.attempt);
+        return;
+      }
+      if (state.options.error) {
+        setSrc(el, state.options.error);
+      }
+      setLazyState(el, "error");
+      el.classList.add("v-lazy--error");
+      (_b = (_a = state.options).onError) == null ? void 0 : _b.call(_a, el, new Error("Failed to load image"));
+    };
+    img.src = state.options.src;
+  }
+  function observe(el) {
+    const state = el.__lazy;
+    if (!state) return;
+    if (!supportsIntersectionObserver()) {
+      load(el);
+      return;
+    }
+    if (state.options.observer) {
+      state.observer = state.options.observer;
+      state.observer.observe(el);
+    } else {
+      const observer = getGlobalObserver(state.options.preload || 0);
+      state.observer = observer;
+      observer.observe(el);
+    }
+  }
+  function unobserve(el) {
+    const state = el.__lazy;
+    if (!state) return;
+    if (state.observer) {
+      state.observer.unobserve(el);
+    } else if (globalObserver) {
+      globalObserver.unobserve(el);
+    }
+  }
+  function normalizeOptions$i(binding) {
+    if (typeof binding === "string") {
+      return { src: binding };
+    }
+    return binding || {};
+  }
+  const vLazy = defineDirective({
+    name: "lazy",
+    ssr: false,
+    defaults: {
+      preload: 0,
+      attempt: 1,
+      disabled: false
+    },
+    mounted(el, binding) {
+      const options = normalizeOptions$i(binding.value);
+      if (options.disabled) return;
+      if (!options.src) {
+        console.warn("[Directix] v-lazy: No source provided");
+        return;
+      }
+      setLazyState(el, "pending");
+      if (options.placeholder) {
+        setSrc(el, options.placeholder);
+      }
+      el.classList.add("v-lazy");
+      const state = {
+        options,
+        attempt: 0
+      };
+      el.__lazy = state;
+      observe(el);
+    },
+    updated(el, binding) {
+      const state = el.__lazy;
+      if (!state) return;
+      const newOptions = normalizeOptions$i(binding.value);
+      if (newOptions.disabled) {
+        unobserve(el);
+        return;
+      }
+      if (newOptions.src !== state.options.src) {
+        state.options = newOptions;
+        state.attempt = 0;
+        if (getLazyState(el) !== "pending") {
+          setLazyState(el, "pending");
+          el.classList.remove("v-lazy--loaded", "v-lazy--error");
+          if (newOptions.placeholder) {
+            setSrc(el, newOptions.placeholder);
+          }
+          observe(el);
+        }
+      }
+    },
+    unmounted(el) {
+      unobserve(el);
+      delete el.__lazy;
+    }
+  });
+  function normalizeOptions$h(binding) {
+    if (typeof binding === "boolean") {
+      return { value: binding };
+    }
+    return __spreadValues({
+      value: true,
+      loadingClass: "v-loading",
+      spinnerClass: "v-loading__spinner",
+      textClass: "v-loading__text",
+      background: "rgba(255, 255, 255, 0.9)",
+      lock: false,
+      disabled: false
+    }, binding);
+  }
+  const DEFAULT_SPINNER = `
+<svg class="v-loading__circular" viewBox="25 25 50 50">
+  <circle class="v-loading__path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10"/>
+</svg>
+`;
+  function createLoadingOverlay(options) {
+    const overlay = document.createElement("div");
+    overlay.className = options.loadingClass || "v-loading";
+    overlay.style.cssText = `
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 1000;
+    background: ${options.background || "rgba(255, 255, 255, 0.9)"};
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+  `;
+    const spinnerHtml = options.spinner || DEFAULT_SPINNER;
+    const spinnerContainer = document.createElement("div");
+    spinnerContainer.className = options.spinnerClass || "v-loading__spinner";
+    spinnerContainer.innerHTML = spinnerHtml;
+    overlay.appendChild(spinnerContainer);
+    if (options.text) {
+      const textEl = document.createElement("div");
+      textEl.className = options.textClass || "v-loading__text";
+      textEl.textContent = options.text;
+      overlay.appendChild(textEl);
+    }
+    return overlay;
+  }
+  const vLoading = defineDirective({
+    name: "loading",
+    ssr: true,
+    // SSR safe - will skip DOM manipulation on server
+    defaults: {
+      value: true,
+      loadingClass: "v-loading",
+      spinnerClass: "v-loading__spinner",
+      textClass: "v-loading__text",
+      background: "rgba(255, 255, 255, 0.9)",
+      lock: false,
+      disabled: false
+    },
+    mounted(el, binding) {
+      if (!isBrowser()) return;
+      const options = normalizeOptions$h(binding.value);
+      if (options.disabled) return;
+      const computedStyle = getComputedStyle(el);
+      const originalPosition = el.style.position;
+      const originalOverflow = el.style.overflow;
+      const state = {
+        options,
+        loadingOverlay: null,
+        originalPosition,
+        originalOverflow
+      };
+      el.__loading = state;
+      if (computedStyle.position === "static") {
+        el.style.position = "relative";
+      }
+      if (options.value) {
+        showLoading(el, state);
+      }
+    },
+    updated(el, binding) {
+      const state = el.__loading;
+      if (!state) return;
+      const newOptions = normalizeOptions$h(binding.value);
+      if (newOptions.disabled) {
+        hideLoading(el, state);
+        return;
+      }
+      if (newOptions.value && !state.options.value) {
+        showLoading(el, state);
+      } else if (!newOptions.value && state.options.value) {
+        hideLoading(el, state);
+      }
+      if (state.loadingOverlay && newOptions.text !== state.options.text) {
+        const textEl = state.loadingOverlay.querySelector(`.${state.options.textClass}`);
+        if (textEl) {
+          textEl.textContent = newOptions.text || "";
+        }
+      }
+      state.options = newOptions;
+    },
+    unmounted(el) {
+      const state = el.__loading;
+      if (!state) return;
+      hideLoading(el, state);
+      el.style.position = state.originalPosition;
+      el.style.overflow = state.originalOverflow;
+      delete el.__loading;
+    }
+  });
+  function showLoading(el, state) {
+    if (state.loadingOverlay) return;
+    state.loadingOverlay = createLoadingOverlay(state.options);
+    el.appendChild(state.loadingOverlay);
+    if (state.options.lock) {
+      el.style.overflow = "hidden";
+    }
+    el.classList.add("v-loading--active");
+  }
+  function hideLoading(el, state) {
+    if (!state.loadingOverlay) return;
+    state.loadingOverlay.remove();
+    state.loadingOverlay = null;
+    if (state.options.lock) {
+      el.style.overflow = state.originalOverflow;
+    }
+    el.classList.remove("v-loading--active");
+  }
+  function normalizeOptions$g(binding) {
+    if (typeof binding === "function") {
+      return { handler: binding, duration: 500, distance: 10 };
+    }
+    if (!binding) {
+      throw new Error("[Directix] v-long-press: handler is required");
+    }
+    return __spreadValues({
+      duration: 500,
+      distance: 10,
+      disabled: false,
+      prevent: true,
+      stop: false,
+      tickInterval: 100
+    }, binding);
+  }
+  function getDistance$1(p1, p2) {
+    return Math.sqrt(__pow(p2.x - p1.x, 2) + __pow(p2.y - p1.y, 2));
+  }
+  const vLongPress = defineDirective({
+    name: "long-press",
+    ssr: false,
+    defaults: {
+      duration: 500,
+      distance: 10,
+      disabled: false,
+      prevent: true,
+      stop: false,
+      tickInterval: 100
+    },
+    mounted(el, binding) {
+      const options = normalizeOptions$g(binding.value);
+      if (options.disabled || !isBrowser()) return;
+      const state = {
+        options,
+        timerId: null,
+        tickTimerId: null,
+        startTime: 0,
+        startPos: { x: 0, y: 0 },
+        startHandler: () => {
+        },
+        endHandler: () => {
+        },
+        moveHandler: () => {
+        }
+      };
+      state.startHandler = (e) => {
+        var _a;
+        const event = e;
+        if (options.prevent) {
+          event.preventDefault();
+        }
+        if (options.stop) {
+          event.stopPropagation();
+        }
+        if (state.timerId) {
+          clearTimeout(state.timerId);
+          state.timerId = null;
+        }
+        if (state.tickTimerId) {
+          clearInterval(state.tickTimerId);
+          state.tickTimerId = null;
+        }
+        const pos = getEventPosition(event);
+        state.startPos = { x: pos.x, y: pos.y };
+        state.startTime = Date.now();
+        (_a = options.onStart) == null ? void 0 : _a.call(options, event);
+        if (options.onTick) {
+          let remaining = options.duration;
+          state.tickTimerId = setInterval(() => {
+            var _a2;
+            remaining -= options.tickInterval;
+            (_a2 = options.onTick) == null ? void 0 : _a2.call(options, Math.max(0, remaining));
+          }, options.tickInterval);
+        }
+        state.timerId = setTimeout(() => {
+          if (state.tickTimerId) {
+            clearInterval(state.tickTimerId);
+            state.tickTimerId = null;
+          }
+          options.handler(event);
+        }, options.duration);
+      };
+      state.endHandler = (e) => {
+        var _a;
+        const event = e;
+        if (state.timerId) {
+          clearTimeout(state.timerId);
+          state.timerId = null;
+        }
+        if (state.tickTimerId) {
+          clearInterval(state.tickTimerId);
+          state.tickTimerId = null;
+        }
+        if (state.startTime > 0) {
+          (_a = options.onCancel) == null ? void 0 : _a.call(options, event);
+        }
+        state.startTime = 0;
+      };
+      state.moveHandler = (e) => {
+        var _a;
+        if (!state.timerId) return;
+        const event = e;
+        const pos = getEventPosition(event);
+        const distance = getDistance$1(state.startPos, { x: pos.x, y: pos.y });
+        if (distance > (options.distance || 10)) {
+          if (state.timerId) {
+            clearTimeout(state.timerId);
+            state.timerId = null;
+          }
+          if (state.tickTimerId) {
+            clearInterval(state.tickTimerId);
+            state.tickTimerId = null;
+          }
+          (_a = options.onCancel) == null ? void 0 : _a.call(options, event);
+          state.startTime = 0;
+        }
+      };
+      el.__longPress = state;
+      on(el, "mousedown", state.startHandler);
+      on(el, "mouseup", state.endHandler);
+      on(el, "mouseleave", state.endHandler);
+      on(el, "mousemove", state.moveHandler);
+      on(el, "touchstart", state.startHandler, { passive: !options.prevent });
+      on(el, "touchend", state.endHandler);
+      on(el, "touchcancel", state.endHandler);
+      on(el, "touchmove", state.moveHandler, { passive: true });
+    },
+    updated(el, binding) {
+      const state = el.__longPress;
+      if (!state) {
+        const options = normalizeOptions$g(binding.value);
+        if (!options.disabled) {
+          el.__longPress = null;
+        }
+        return;
+      }
+      state.options = normalizeOptions$g(binding.value);
+    },
+    unmounted(el) {
+      const state = el.__longPress;
+      if (!state) return;
+      if (state.timerId) {
+        clearTimeout(state.timerId);
+      }
+      if (state.tickTimerId) {
+        clearInterval(state.tickTimerId);
+      }
+      off(el, "mousedown", state.startHandler);
+      off(el, "mouseup", state.endHandler);
+      off(el, "mouseleave", state.endHandler);
+      off(el, "mousemove", state.moveHandler);
+      off(el, "touchstart", state.startHandler);
+      off(el, "touchend", state.endHandler);
+      off(el, "touchcancel", state.endHandler);
+      off(el, "touchmove", state.moveHandler);
+      delete el.__longPress;
+    }
+  });
+  function transformText$1(text, options) {
+    if (!text) return text;
+    if (options.first) {
+      return text.charAt(0).toLowerCase() + text.slice(1);
+    }
+    return text.toLowerCase();
+  }
+  function normalizeOptions$f(binding) {
+    var _a, _b;
+    if (binding === void 0 || binding === true) {
+      return { first: false, onInput: true };
+    }
+    if (binding === false) {
+      return { first: false, onInput: false };
+    }
+    return {
+      first: (_a = binding.first) != null ? _a : false,
+      onInput: (_b = binding.onInput) != null ? _b : true
+    };
+  }
+  const vLowercase = defineDirective({
+    name: "lowercase",
+    ssr: true,
+    mounted(el, binding) {
+      const options = normalizeOptions$f(binding.value);
+      if (isInputElement(el)) {
+        const cleanup2 = setupTextTransformInput(el, options, (text) => transformText$1(text, options));
+        el.__lowercaseCleanup = cleanup2;
+      } else {
+        transformTextContent(el, (text) => transformText$1(text, options));
+      }
+    },
+    updated(el, binding) {
+      const options = normalizeOptions$f(binding.value);
+      if (isInputElement(el)) {
+        if (options.onInput) {
+          el.value = transformText$1(el.value, options);
+        }
+      } else {
+        transformTextContent(el, (text) => transformText$1(text, options));
+      }
+    },
+    unmounted(el) {
+      const cleanup2 = el.__lowercaseCleanup;
+      cleanup2 == null ? void 0 : cleanup2();
+      delete el.__lowercaseCleanup;
+    }
+  });
+  const STATE_KEY$2 = "__mask";
+  const TOKEN_PATTERNS = {
+    "#": /\d/,
+    A: /[A-Za-z]/,
+    N: /[A-Za-z0-9]/,
+    X: /./
+  };
+  function parseMask(mask, placeholder) {
+    return [...mask].map((char) => {
+      const pattern = TOKEN_PATTERNS[char];
+      return pattern ? { pattern, placeholder, isLiteral: false } : { pattern: new RegExp(`\\${char}`), placeholder: char, isLiteral: true };
+    });
+  }
+  function normalizeOptions$e(binding) {
+    if (typeof binding === "string") return { mask: binding, placeholder: "_", showPlaceholder: true };
+    if (!(binding == null ? void 0 : binding.mask)) throw new Error("[Directix] v-mask: mask is required");
+    return __spreadValues({ placeholder: "_", showPlaceholder: true, showMaskOnBlur: false, clearIncomplete: false, disabled: false }, binding);
+  }
+  function isInput(el) {
+    return el.tagName === "INPUT" || el.tagName === "TEXTAREA";
+  }
+  function formatValue(value, tokens, placeholder, showPlaceholder) {
+    let result = "", valueIndex = 0;
+    for (const token of tokens) {
+      if (valueIndex >= value.length) {
+        result += token.isLiteral ? token.placeholder : showPlaceholder ? placeholder : "";
+        continue;
+      }
+      const inputChar = value[valueIndex];
+      if (token.isLiteral) {
+        if (inputChar === token.placeholder) valueIndex++;
+        result += token.placeholder;
+      } else if (token.pattern.test(inputChar)) {
+        result += inputChar;
+        valueIndex++;
+      } else if (inputChar === placeholder) {
+        result += showPlaceholder ? placeholder : "";
+        valueIndex++;
+      } else {
+        valueIndex++;
+      }
+    }
+    return result;
+  }
+  function getRawValue(value, tokens, placeholder) {
+    let raw = "";
+    for (let i = 0; i < value.length && i < tokens.length; i++) {
+      if (!tokens[i].isLiteral && value[i] !== placeholder) {
+        raw += value[i];
+      }
+    }
+    return raw;
+  }
+  function isComplete(value, tokens, placeholder) {
+    for (let i = 0; i < tokens.length; i++) {
+      if (!tokens[i].isLiteral && (i >= value.length || value[i] === placeholder)) {
+        return false;
+      }
+    }
+    return true;
+  }
+  function getCursorPos(tokens, rawCursorPos) {
+    let pos = rawCursorPos;
+    while (pos < tokens.length && tokens[pos].isLiteral) {
+      pos++;
+    }
+    return Math.min(pos, tokens.length);
+  }
+  const vMask = defineDirective({
+    name: "mask",
+    ssr: false,
+    defaults: { placeholder: "_", showPlaceholder: true, showMaskOnBlur: false, clearIncomplete: false, disabled: false },
+    mounted(el, binding) {
+      var _a;
+      if (!isInput(el)) {
+        console.warn("[Directix] v-mask: directive must be used on input or textarea elements");
+        return;
+      }
+      const options = normalizeOptions$e(binding.value);
+      if (options.disabled || !isBrowser()) return;
+      const placeholder = options.placeholder || "_";
+      const tokens = parseMask(options.mask, placeholder);
+      const inputHandler = (e) => {
+        var _a2, _b, _c;
+        const target = e.target;
+        const rawValue = target.value;
+        const cursorPos = target.selectionStart || 0;
+        const formatted = formatValue(rawValue, tokens, placeholder, (_a2 = options.showPlaceholder) != null ? _a2 : true);
+        if (formatted !== rawValue) {
+          target.value = formatted;
+          target.setSelectionRange(getCursorPos(tokens, cursorPos), getCursorPos(tokens, cursorPos));
+          target.dispatchEvent(new Event("input", { bubbles: true }));
+          return;
+        }
+        (_b = options.onChange) == null ? void 0 : _b.call(options, formatted, getRawValue(formatted, tokens, placeholder));
+        if (isComplete(formatted, tokens, placeholder)) {
+          (_c = options.onComplete) == null ? void 0 : _c.call(options, formatted);
+        }
+      };
+      const focusHandler = () => {
+        if (!el.value && options.showPlaceholder) {
+          el.value = formatValue("", tokens, placeholder, true);
+        }
+      };
+      const blurHandler = () => {
+        if (!options.showMaskOnBlur && !isComplete(el.value, tokens, placeholder) && options.clearIncomplete) {
+          el.value = "";
+        }
+      };
+      on(el, "input", inputHandler);
+      on(el, "focus", focusHandler);
+      on(el, "blur", blurHandler);
+      el[STATE_KEY$2] = { options, tokens, placeholder, inputHandler, focusHandler, blurHandler };
+      if (el.value) {
+        el.value = formatValue(el.value, tokens, placeholder, (_a = options.showPlaceholder) != null ? _a : true);
+      }
+    },
+    updated(el, binding) {
+      const state = el[STATE_KEY$2];
+      if (!state) return;
+      state.options = normalizeOptions$e(binding.value);
+      state.tokens = parseMask(state.options.mask, state.placeholder);
+    },
+    unmounted(el) {
+      const state = el[STATE_KEY$2];
+      if (!state) return;
+      off(el, "input", state.inputHandler);
+      off(el, "focus", state.focusHandler);
+      off(el, "blur", state.blurHandler);
+      delete el[STATE_KEY$2];
+    }
+  });
+  function formatNumber(value, options) {
+    const { precision = 0, separator = ",", decimal = ".", prefix = "", suffix = "" } = options;
+    const fixed = value.toFixed(precision);
+    const [intPart, decPart] = fixed.split(".");
+    const formattedInt = intPart.replace(/\B(?=(\d{3})+(?!\d))/g, separator);
+    let result = formattedInt;
+    if (precision > 0 && decPart) {
+      result += decimal + decPart;
+    }
+    return prefix + result + suffix;
+  }
+  function parseToNumber(value, decimal) {
+    const cleaned = value.replace(/[^\d.-]/g, "").replace(decimal, ".");
+    const num = Number.parseFloat(cleaned);
+    return isNaN(num) ? null : num;
+  }
+  function clampValue(value, options) {
+    var _a;
+    let result = value;
+    const allowNegative = (_a = options.allowNegative) != null ? _a : true;
+    if (!allowNegative && result < 0) {
+      result = Math.abs(result);
+    }
+    if (options.min !== void 0) result = Math.max(options.min, result);
+    if (options.max !== void 0) result = Math.min(options.max, result);
+    return result;
+  }
+  function calculateCursorPosition(rawValue, formatted, cursorPos, startOffset = 0) {
+    let digitsBeforeCursor = 0, digitCount = 0;
+    for (let i = 0; i < cursorPos && i < rawValue.length; i++) {
+      if (/\d/.test(rawValue[i])) {
+        digitsBeforeCursor++;
+      }
+    }
+    for (let i = startOffset; i < formatted.length; i++) {
+      if (/\d/.test(formatted[i])) {
+        digitCount++;
+      }
+      if (digitCount >= digitsBeforeCursor) {
+        return i + 1;
+      }
+    }
+    return formatted.length;
+  }
+  function setupNumberInput(el, options, formatFn) {
+    const { decimal = ".", prefix = "" } = options;
+    let isFormatting = false;
+    const onInput = () => {
+      if (isFormatting) return;
+      const rawValue = el.value;
+      const cursorPos = el.selectionStart || 0;
+      if (!rawValue || rawValue === "-") {
+        return;
+      }
+      const num = parseToNumber(rawValue, decimal);
+      if (num === null) {
+        isFormatting = true;
+        el.value = "";
+        el.dispatchEvent(new Event("input", { bubbles: true }));
+        isFormatting = false;
+        return;
+      }
+      const clamped = clampValue(num, options);
+      const formatted = formatFn(clamped, options);
+      if (formatted !== rawValue) {
+        isFormatting = true;
+        const startOffset = prefix.length;
+        const newCursorPos = calculateCursorPosition(rawValue, formatted, cursorPos, startOffset);
+        el.value = formatted;
+        el.setSelectionRange(newCursorPos, newCursorPos);
+        el.dispatchEvent(new Event("input", { bubbles: true }));
+        isFormatting = false;
+      }
+    };
+    const onBlur = () => {
+      if (!el.value || el.value === "-") return;
+      const num = parseToNumber(el.value, decimal);
+      if (num !== null) {
+        const clamped = clampValue(num, options);
+        const formatted = formatFn(clamped, options);
+        isFormatting = true;
+        el.value = formatted;
+        el.dispatchEvent(new Event("input", { bubbles: true }));
+        isFormatting = false;
+      }
+    };
+    el.addEventListener("input", onInput);
+    el.addEventListener("blur", onBlur);
+    if (el.value) {
+      const num = parseToNumber(el.value, decimal);
+      if (num !== null) {
+        const formatted = formatFn(clampValue(num, options), options);
+        isFormatting = true;
+        el.value = formatted;
+        el.dispatchEvent(new Event("input", { bubbles: true }));
+        isFormatting = false;
+      }
+    }
+    return () => {
+      el.removeEventListener("input", onInput);
+      el.removeEventListener("blur", onBlur);
+    };
+  }
+  function formatMoney(value, options) {
+    const { precision = 2, separator = ",", decimal = ".", symbol = "$", symbolPosition = "before" } = options;
+    const fixed = value.toFixed(precision);
+    const [intPart, decPart] = fixed.split(".");
+    const formattedInt = intPart.replace(/\B(?=(\d{3})+(?!\d))/g, separator);
+    let result = formattedInt;
+    if (precision > 0 && decPart) {
+      result += decimal + decPart;
+    }
+    return symbolPosition === "before" ? symbol + result : result + symbol;
+  }
+  const vMoney = defineDirective({
+    name: "money",
+    ssr: true,
+    mounted(el, binding) {
+      var _a, _b, _c;
+      const options = typeof binding.value === "string" ? { symbol: binding.value } : (_a = binding.value) != null ? _a : {};
+      options.precision = (_b = options.precision) != null ? _b : 2;
+      if (el.tagName === "INPUT" || el.tagName === "TEXTAREA") {
+        const { symbol = "$", symbolPosition = "before" } = options;
+        const prefix = symbolPosition === "before" ? symbol : "";
+        const cleanup2 = setupNumberInput(el, __spreadProps(__spreadValues({}, options), { prefix }), formatMoney);
+        el.__money = { options, cleanup: cleanup2 };
+        requestAnimationFrame(() => {
+          const inputEl = el;
+          if (inputEl.value) {
+            const num = parseToNumber(inputEl.value, options.decimal || ".");
+            if (num !== null) {
+              const formatted = formatMoney(clampValue(num, options), options);
+              if (formatted !== inputEl.value) {
+                inputEl.value = formatted;
+                inputEl.dispatchEvent(new Event("input", { bubbles: true }));
+              }
+            }
+          }
+        });
+      } else {
+        let value = null;
+        if (binding.value && typeof binding.value === "object" && "value" in binding.value) {
+          value = binding.value.value;
+        } else {
+          const textContent = (_c = el.textContent) == null ? void 0 : _c.trim();
+          if (textContent) {
+            value = parseToNumber(textContent, options.decimal || ".");
+          }
+        }
+        if (value !== null) {
+          el.textContent = formatMoney(clampValue(value, options), options);
+        }
+      }
+    },
+    updated(el, binding) {
+      var _a, _b;
+      const options = typeof binding.value === "string" ? { symbol: binding.value } : (_a = binding.value) != null ? _a : {};
+      options.precision = (_b = options.precision) != null ? _b : 2;
+      const state = el.__money;
+      if (state) {
+        state.options = options;
+      } else if (!(el.tagName === "INPUT" || el.tagName === "TEXTAREA")) {
+        let value = null;
+        if (binding.value && typeof binding.value === "object" && "value" in binding.value) {
+          value = binding.value.value;
+        }
+        if (value !== null) {
+          el.textContent = formatMoney(clampValue(value, options), options);
+        }
+      }
+    },
+    unmounted(el) {
+      const state = el.__money;
+      state == null ? void 0 : state.cleanup();
+      delete el.__money;
+    }
+  });
+  function normalizeOptions$d(binding) {
+    if (typeof binding === "function") {
+      return { handler: binding, childList: true };
+    }
+    if (!binding || !binding.handler) {
+      throw new Error("[Directix] v-mutation: handler is required");
+    }
+    return __spreadValues({
+      attributes: false,
+      childList: true,
+      subtree: false,
+      characterData: false,
+      attributeOldValue: false,
+      characterDataOldValue: false,
+      disabled: false
+    }, binding);
+  }
+  const vMutation = defineDirective({
+    name: "mutation",
+    ssr: false,
+    defaults: {
+      attributes: false,
+      childList: true,
+      subtree: false,
+      characterData: false,
+      attributeOldValue: false,
+      characterDataOldValue: false,
+      disabled: false
+    },
+    mounted(el, binding) {
+      const options = normalizeOptions$d(binding.value);
+      if (options.disabled || !isBrowser()) return;
+      if (!supportsMutationObserver()) {
+        console.warn("[Directix] v-mutation: MutationObserver not supported");
+        return;
+      }
+      const state = {
+        options,
+        observer: null
+      };
+      state.observer = new MutationObserver((mutations, observer) => {
+        options.handler(mutations, observer);
+      });
+      state.observer.observe(el, {
+        attributes: options.attributes,
+        attributeFilter: options.attributeFilter,
+        childList: options.childList,
+        subtree: options.subtree,
+        characterData: options.characterData,
+        attributeOldValue: options.attributeOldValue,
+        characterDataOldValue: options.characterDataOldValue
+      });
+      el.__mutation = state;
+    },
+    updated(el, binding) {
+      const state = el.__mutation;
+      if (!state) return;
+      const newOptions = normalizeOptions$d(binding.value);
+      if (newOptions.disabled && !state.options.disabled) {
+        if (state.observer) {
+          state.observer.disconnect();
+        }
+      } else if (!newOptions.disabled && state.options.disabled) {
+        if (state.observer) {
+          state.observer.observe(el, {
+            attributes: newOptions.attributes,
+            attributeFilter: newOptions.attributeFilter,
+            childList: newOptions.childList,
+            subtree: newOptions.subtree,
+            characterData: newOptions.characterData,
+            attributeOldValue: newOptions.attributeOldValue,
+            characterDataOldValue: newOptions.characterDataOldValue
+          });
+        }
+      } else if (!newOptions.disabled) {
+        if (newOptions.attributes !== state.options.attributes || newOptions.childList !== state.options.childList || newOptions.subtree !== state.options.subtree || newOptions.characterData !== state.options.characterData) {
+          if (state.observer) {
+            state.observer.disconnect();
+            state.observer.observe(el, {
+              attributes: newOptions.attributes,
+              attributeFilter: newOptions.attributeFilter,
+              childList: newOptions.childList,
+              subtree: newOptions.subtree,
+              characterData: newOptions.characterData,
+              attributeOldValue: newOptions.attributeOldValue,
+              characterDataOldValue: newOptions.characterDataOldValue
+            });
+          }
+        }
+      }
+      state.options = newOptions;
+    },
+    unmounted(el) {
+      const state = el.__mutation;
+      if (!state) return;
+      if (state.observer) {
+        state.observer.disconnect();
+      }
+      delete el.__mutation;
+    }
+  });
+  const vNumber = defineDirective({
+    name: "number",
+    ssr: true,
+    mounted(el, binding) {
+      var _a, _b;
+      const options = typeof binding.value === "number" ? { precision: binding.value } : (_a = binding.value) != null ? _a : {};
+      if (el.tagName === "INPUT" || el.tagName === "TEXTAREA") {
+        const cleanup2 = setupNumberInput(el, options, formatNumber);
+        el.__number = { options, cleanup: cleanup2 };
+        requestAnimationFrame(() => {
+          const inputEl = el;
+          if (inputEl.value) {
+            const num = parseToNumber(inputEl.value, options.decimal || ".");
+            if (num !== null) {
+              const formatted = formatNumber(clampValue(num, options), options);
+              if (formatted !== inputEl.value) {
+                inputEl.value = formatted;
+                inputEl.dispatchEvent(new Event("input", { bubbles: true }));
+              }
+            }
+          }
+        });
+      } else {
+        let value = null;
+        if (typeof binding.value === "number") {
+          value = binding.value;
+        } else if (binding.value && typeof binding.value === "object" && "value" in binding.value) {
+          value = binding.value.value;
+        } else {
+          const textContent = (_b = el.textContent) == null ? void 0 : _b.trim();
+          if (textContent) {
+            value = parseToNumber(textContent, options.decimal || ".");
+          }
+        }
+        if (value !== null) {
+          el.textContent = formatNumber(clampValue(value, options), options);
+        }
+      }
+    },
+    updated(el, binding) {
+      var _a;
+      const options = typeof binding.value === "number" ? { precision: binding.value } : (_a = binding.value) != null ? _a : {};
+      const state = el.__number;
+      if (state) {
+        state.options = options;
+      } else if (!(el.tagName === "INPUT" || el.tagName === "TEXTAREA")) {
+        let value = null;
+        if (typeof binding.value === "number") {
+          value = binding.value;
+        } else if (binding.value && typeof binding.value === "object" && "value" in binding.value) {
+          value = binding.value.value;
+        }
+        if (value !== null) {
+          el.textContent = formatNumber(clampValue(value, options), options);
+        }
+      }
+    },
+    unmounted(el) {
+      const state = el.__number;
+      state == null ? void 0 : state.cleanup();
+      delete el.__number;
+    }
+  });
+  const STATE_KEY$1 = "__permission";
+  const WILDCARD = "*";
+  let globalConfig = null;
+  function configurePermission(config) {
+    globalConfig = config;
+  }
+  function getPermissionConfig() {
+    return globalConfig;
+  }
+  function normalizeOptions$c(binding) {
+    if (!binding) {
+      throw new Error("[Directix] v-permission: permission value is required");
+    }
+    if (typeof binding === "string") {
+      return { value: binding };
+    }
+    if (Array.isArray(binding)) {
+      return { value: binding };
+    }
+    return binding;
+  }
+  function hasPermission(required, permissions) {
+    return permissions.includes(WILDCARD) || permissions.includes(required);
+  }
+  function verifyPermission(options) {
+    var _a;
+    if (options.check) {
+      return options.check(options.value, options.mode || "some");
+    }
+    if (!globalConfig) {
+      console.warn("[Directix] v-permission: No permission config provided");
+      return true;
+    }
+    const permissions = globalConfig.getPermissions();
+    const roles = ((_a = globalConfig.getRoles) == null ? void 0 : _a.call(globalConfig)) || [];
+    const roleMap = globalConfig.roleMap || {};
+    const required = Array.isArray(options.value) ? options.value : [options.value];
+    const mode = options.mode || "some";
+    function checkSingle(value) {
+      if (value in roleMap) {
+        return roles.includes(value);
+      }
+      if (hasPermission(value, permissions)) {
+        return true;
+      }
+      for (const role of roles) {
+        const rolePermissions = roleMap[role] || [];
+        if (hasPermission(value, rolePermissions)) {
+          return true;
+        }
+      }
+      return false;
+    }
+    return mode === "every" ? required.every(checkSingle) : required.some(checkSingle);
+  }
+  function handleDenied(el, action, state) {
+    var _a, _b;
+    switch (action) {
+      case "remove":
+        state.parentNode = el.parentNode;
+        state.placeholder = document.createComment("v-permission");
+        (_a = el.parentNode) == null ? void 0 : _a.insertBefore(state.placeholder, el);
+        (_b = el.parentNode) == null ? void 0 : _b.removeChild(el);
+        break;
+      case "disable":
+        state.originalDisabled = el.getAttribute("disabled") || false;
+        el.setAttribute("disabled", "true");
+        el.classList.add("v-permission--disabled");
+        break;
+      case "hide":
+        state.originalDisplay = el.style.display;
+        el.style.display = "none";
+        el.classList.add("v-permission--hidden");
+        break;
+    }
+  }
+  function handleGranted(el, action, state) {
+    switch (action) {
+      case "remove":
+        if (state.placeholder && state.parentNode) {
+          state.parentNode.insertBefore(el, state.placeholder);
+          state.parentNode.removeChild(state.placeholder);
+          state.placeholder = null;
+        }
+        break;
+      case "disable":
+        if (state.originalDisabled === false) {
+          el.removeAttribute("disabled");
+        } else if (state.originalDisabled) {
+          el.setAttribute("disabled", state.originalDisabled);
+        }
+        el.classList.remove("v-permission--disabled");
+        break;
+      case "hide":
+        el.style.display = state.originalDisplay || "";
+        el.classList.remove("v-permission--hidden");
+        break;
+    }
+  }
+  function getState(el) {
+    if (!el[STATE_KEY$1]) {
+      el[STATE_KEY$1] = {
+        options: { value: "" },
+        originalDisplay: "",
+        originalDisabled: false,
+        parentNode: null,
+        placeholder: null
+      };
+    }
+    return el[STATE_KEY$1];
+  }
+  function checkPermission(el, binding) {
+    var _a, _b;
+    const state = getState(el);
+    state.options = normalizeOptions$c(binding.value);
+    const granted = verifyPermission(state.options);
+    (_b = (_a = state.options).onChange) == null ? void 0 : _b.call(_a, granted);
+    const action = state.options.action || "remove";
+    if (granted) {
+      handleGranted(el, action, state);
+    } else {
+      handleDenied(el, action, state);
+    }
+  }
+  function cleanup(el) {
+    const state = el[STATE_KEY$1];
+    if ((state == null ? void 0 : state.placeholder) && state.parentNode) {
+      state.parentNode.removeChild(state.placeholder);
+    }
+    delete el[STATE_KEY$1];
+  }
+  const vPermission = defineDirective({
+    name: "permission",
+    ssr: true,
+    mounted(el, binding) {
+      checkPermission(el, binding);
+    },
+    updated(el, binding) {
+      checkPermission(el, binding);
+    },
+    unmounted(el) {
+      cleanup(el);
+    }
+  });
+  function getResizeInfo(entry) {
+    return {
+      width: entry.contentRect.width,
+      height: entry.contentRect.height,
+      contentRect: entry.contentRect,
+      borderBoxSize: entry.borderBoxSize,
+      contentBoxSize: entry.contentBoxSize,
+      devicePixelContentBoxSize: entry.devicePixelContentBoxSize
+    };
+  }
+  function normalizeOptions$b(binding) {
+    if (typeof binding === "function") {
+      return { handler: binding };
+    }
+    if (!binding) {
+      throw new Error("[Directix] v-resize: handler is required");
+    }
+    return __spreadValues({
+      disabled: false,
+      box: "content-box",
+      debounce: 0
+    }, binding);
+  }
+  function createFallbackResize(el, callback) {
+    const iframe = document.createElement("iframe");
+    iframe.style.cssText = `
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    border: none;
+    pointer-events: none;
+    opacity: 0;
+  `;
+    el.appendChild(iframe);
+    const iWindow = iframe.contentWindow;
+    if (iWindow) {
+      iWindow.addEventListener("resize", callback);
+    }
+    return {
+      iframe,
+      cleanup: () => {
+        if (iWindow) {
+          iWindow.removeEventListener("resize", callback);
+        }
+        iframe.remove();
+      }
+    };
+  }
+  const vResize = defineDirective({
+    name: "resize",
+    ssr: false,
+    defaults: {
+      disabled: false,
+      box: "content-box",
+      debounce: 0
+    },
+    mounted(el, binding) {
+      const options = normalizeOptions$b(binding.value);
+      if (options.disabled || !isBrowser()) return;
+      const computedStyle = getComputedStyle(el);
+      if (computedStyle.position === "static") {
+        el.style.position = "relative";
+      }
+      const state = {
+        options,
+        observer: null,
+        debounceTimer: null,
+        pendingEntry: null,
+        fallbackIframe: null,
+        handler: (entry) => {
+          if (options.debounce && options.debounce > 0) {
+            state.pendingEntry = entry;
+            if (!state.debounceTimer) {
+              state.debounceTimer = setTimeout(() => {
+                if (state.pendingEntry) {
+                  options.handler(state.pendingEntry);
+                }
+                state.debounceTimer = null;
+                state.pendingEntry = null;
+              }, options.debounce);
+            }
+          } else {
+            options.handler(entry);
+          }
+        }
+      };
+      el.__resize = state;
+      if (supportsResizeObserver()) {
+        state.observer = new ResizeObserver((entries) => {
+          for (const entry of entries) {
+            state.handler(entry);
+          }
+        });
+        state.observer.observe(el, { box: options.box });
+      } else {
+        console.warn("[Directix] v-resize: ResizeObserver not supported, using fallback");
+        const { iframe, cleanup: cleanup2 } = createFallbackResize(el, () => {
+          const rect = el.getBoundingClientRect();
+          const entry = {
+            target: el,
+            contentRect: rect,
+            borderBoxSize: [],
+            contentBoxSize: [],
+            devicePixelContentBoxSize: []
+          };
+          state.handler(entry);
+          if (options.onFallback) {
+            options.onFallback(getResizeInfo(entry));
+          }
+        });
+        state.fallbackIframe = iframe;
+        el.__resizeCleanup = cleanup2;
+      }
+    },
+    updated(el, binding) {
+      const state = el.__resize;
+      if (!state) return;
+      state.options = normalizeOptions$b(binding.value);
+    },
+    unmounted(el) {
+      const state = el.__resize;
+      if (!state) return;
+      if (state.debounceTimer) {
+        clearTimeout(state.debounceTimer);
+      }
+      if (state.observer) {
+        state.observer.disconnect();
+      }
+      const cleanup2 = el.__resizeCleanup;
+      if (cleanup2) {
+        cleanup2();
+      }
+      delete el.__resize;
+      delete el.__resizeCleanup;
+    }
+  });
+  function normalizeOptions$a(binding) {
+    if (binding === false) {
+      return { disabled: true, color: "currentColor", duration: 600 };
+    }
+    if (typeof binding === "string") {
+      return { color: binding, duration: 600 };
+    }
+    const base = {
+      color: "currentColor",
+      duration: 600,
+      disabled: false,
+      initialScale: 0,
+      finalScale: 2
+    };
+    return binding && typeof binding === "object" ? __spreadValues(__spreadValues({}, base), binding) : base;
+  }
+  function createRipple(event, el, options) {
+    const rect = el.getBoundingClientRect();
+    const x = event.clientX - rect.left;
+    const y = event.clientY - rect.top;
+    const size = Math.max(rect.width, rect.height) * 2;
+    const ripple = document.createElement("span");
+    ripple.className = "v-ripple__wave";
+    ripple.style.cssText = `
+    position: absolute;
+    border-radius: 50%;
+    pointer-events: none;
+    background-color: ${options.color};
+    width: ${size}px;
+    height: ${size}px;
+    left: ${x - size / 2}px;
+    top: ${y - size / 2}px;
+    transform: scale(${options.initialScale});
+    opacity: 0.3;
+    z-index: 0;
+  `;
+    return ripple;
+  }
+  function animateRipple(ripple, options) {
+    const duration = options.duration || 600;
+    const initialScale = options.initialScale || 0;
+    const finalScale = options.finalScale || 2;
+    if (typeof ripple.animate === "function") {
+      ripple.animate(
+        [
+          { transform: `scale(${initialScale})`, opacity: 0.3 },
+          { transform: `scale(${finalScale})`, opacity: 0 }
+        ],
+        {
+          duration,
+          easing: "ease-out",
+          fill: "forwards"
+        }
+      ).onfinish = () => {
+        ripple.remove();
+      };
+    } else {
+      ripple.style.transition = `transform ${duration}ms ease-out, opacity ${duration}ms ease-out`;
+      String(ripple.offsetHeight);
+      ripple.style.transform = `scale(${finalScale})`;
+      ripple.style.opacity = "0";
+      setTimeout(() => {
+        ripple.remove();
+      }, duration);
+    }
+  }
+  const vRipple = defineDirective({
+    name: "ripple",
+    ssr: false,
+    defaults: {
+      color: "currentColor",
+      duration: 600,
+      disabled: false,
+      initialScale: 0,
+      finalScale: 2
+    },
+    mounted(el, binding) {
+      const options = normalizeOptions$a(binding.value);
+      if (options.disabled || !isBrowser()) return;
+      const computedStyle = getComputedStyle(el);
+      if (computedStyle.position === "static") {
+        el.style.position = "relative";
+      }
+      if (computedStyle.overflow === "visible") {
+        el.style.overflow = "hidden";
+      }
+      el.classList.add("v-ripple");
+      const state = {
+        options,
+        clickHandler: (e) => {
+          if (state.options.disabled) return;
+          const mouseEvent = e;
+          const ripple = createRipple(mouseEvent, el, state.options);
+          if (ripple) {
+            el.appendChild(ripple);
+            animateRipple(ripple, state.options);
+          }
+        }
+      };
+      el.__ripple = state;
+      on(el, "click", state.clickHandler);
+    },
+    updated(el, binding) {
+      const state = el.__ripple;
+      if (!state) return;
+      state.options = normalizeOptions$a(binding.value);
+    },
+    unmounted(el) {
+      const state = el.__ripple;
+      if (!state) return;
+      off(el, "click", state.clickHandler);
+      el.classList.remove("v-ripple");
+      delete el.__ripple;
+    }
+  });
+  const DEFAULT_ALLOWED_TAGS = ["b", "i", "u", "strong", "em", "br", "p", "span", "div"];
+  const DEFAULT_ALLOWED_ATTRIBUTES = ["title", "alt", "href", "src"];
+  const DANGEROUS_TAGS = ["script", "iframe", "object", "embed", "form", "input", "style", "link", "meta", "base"];
+  const DANGEROUS_ATTRIBUTES = ["onclick", "onerror", "onload", "onmouseover", "onfocus", "onblur", "onchange", "onsubmit"];
+  function normalizeOptions$9(binding) {
+    if (binding === false) {
+      return { disabled: true };
+    }
+    if (binding === true) {
+      return {
+        allowedTags: DEFAULT_ALLOWED_TAGS,
+        allowedAttributes: DEFAULT_ALLOWED_ATTRIBUTES
+      };
+    }
+    return __spreadValues({
+      allowedTags: DEFAULT_ALLOWED_TAGS,
+      allowedAttributes: DEFAULT_ALLOWED_ATTRIBUTES,
+      allowDataUrls: false,
+      allowStyles: false,
+      allowClass: false,
+      allowId: false,
+      disabled: false,
+      sanitizeOnUpdate: true
+    }, binding);
+  }
+  function sanitizeHtml(html, options) {
+    var _a;
+    if (options.handler) {
+      return options.handler(html);
+    }
+    const temp = document.createElement("div");
+    temp.innerHTML = html;
+    for (const tag of DANGEROUS_TAGS) {
+      const elements = temp.getElementsByTagName(tag);
+      while (elements.length > 0) {
+        (_a = elements[0].parentNode) == null ? void 0 : _a.removeChild(elements[0]);
+      }
+    }
+    const processElement = (el) => {
+      var _a2;
+      const tagName = el.tagName.toLowerCase();
+      if (options.allowedTags && !options.allowedTags.includes(tagName)) {
+        const text = document.createTextNode(el.textContent || "");
+        (_a2 = el.parentNode) == null ? void 0 : _a2.replaceChild(text, el);
+        return;
+      }
+      for (const attr of DANGEROUS_ATTRIBUTES) {
+        el.removeAttribute(attr);
+      }
+      const href = el.getAttribute("href");
+      if (href && href.toLowerCase().startsWith("javascript:")) {
+        el.removeAttribute("href");
+      }
+      if (!options.allowDataUrls) {
+        const src = el.getAttribute("src");
+        if (src && src.toLowerCase().startsWith("data:")) {
+          el.removeAttribute("src");
+        }
+      }
+      if (options.allowedAttributes) {
+        const attrs = Array.from(el.attributes);
+        for (const attr of attrs) {
+          const isAllowed = options.allowedAttributes.includes(attr.name.toLowerCase());
+          const isClass = attr.name === "class" && options.allowClass;
+          const isId = attr.name === "id" && options.allowId;
+          const isStyle = attr.name === "style" && options.allowStyles;
+          if (!isAllowed && !isClass && !isId && !isStyle) {
+            el.removeAttribute(attr.name);
+          }
+        }
+      }
+      for (const child of Array.from(el.children)) {
+        processElement(child);
+      }
+    };
+    for (const child of Array.from(temp.children)) {
+      processElement(child);
+    }
+    return temp.innerHTML;
+  }
+  const vSanitize = defineDirective({
+    name: "sanitize",
+    ssr: true,
+    defaults: {
+      allowedTags: DEFAULT_ALLOWED_TAGS,
+      allowedAttributes: DEFAULT_ALLOWED_ATTRIBUTES,
+      allowDataUrls: false,
+      allowStyles: false,
+      allowClass: false,
+      allowId: false,
+      disabled: false,
+      sanitizeOnUpdate: true
+    },
+    mounted(el, binding) {
+      if (!isBrowser()) return;
+      const options = normalizeOptions$9(binding.value);
+      if (options.disabled) return;
+      el.__sanitize = { options };
+      const content = el.innerHTML;
+      if (content) {
+        el.innerHTML = sanitizeHtml(content, options);
+      }
+    },
+    updated(el, binding) {
+      const state = el.__sanitize;
+      if (!state) return;
+      state.options = normalizeOptions$9(binding.value);
+      if (state.options.disabled || !state.options.sanitizeOnUpdate) return;
+      const content = el.innerHTML;
+      if (content) {
+        el.innerHTML = sanitizeHtml(content, state.options);
+      }
+    },
+    unmounted(el) {
+      delete el.__sanitize;
+    }
+  });
+  function getScrollInfo(container, lastScrollLeft, lastScrollTop) {
+    let scrollLeft = 0, scrollTop = 0, scrollLeftMax = 0, scrollTopMax = 0;
+    if (container === window) {
+      scrollLeft = window.scrollX || document.documentElement.scrollLeft;
+      scrollTop = window.scrollY || document.documentElement.scrollTop;
+      scrollLeftMax = document.documentElement.scrollWidth - window.innerWidth;
+      scrollTopMax = document.documentElement.scrollHeight - window.innerHeight;
+    } else {
+      const el = container;
+      scrollLeft = el.scrollLeft;
+      scrollTop = el.scrollTop;
+      scrollLeftMax = el.scrollWidth - el.clientWidth;
+      scrollTopMax = el.scrollHeight - el.clientHeight;
+    }
+    const progressX = scrollLeftMax > 0 ? scrollLeft / scrollLeftMax : 0;
+    const progressY = scrollTopMax > 0 ? scrollTop / scrollTopMax : 0;
+    const directionX = scrollLeft !== lastScrollLeft ? scrollLeft > lastScrollLeft ? 1 : -1 : 0;
+    const directionY = scrollTop !== lastScrollTop ? scrollTop > lastScrollTop ? 1 : -1 : 0;
+    return {
+      scrollLeft,
+      scrollTop,
+      scrollLeftMax,
+      scrollTopMax,
+      progressX,
+      progressY,
+      directionX,
+      directionY,
+      container
+    };
+  }
+  function normalizeOptions$8(binding) {
+    if (typeof binding === "function") {
+      return { handler: binding, passive: true };
+    }
+    if (!binding) {
+      throw new Error("[Directix] v-scroll: handler is required");
+    }
+    return __spreadValues({
+      passive: true,
+      throttle: 0,
+      disabled: false
+    }, binding);
+  }
+  const vScroll = defineDirective({
+    name: "scroll",
+    ssr: false,
+    defaults: {
+      passive: true,
+      throttle: 0,
+      disabled: false
+    },
+    mounted(el, binding) {
+      const options = normalizeOptions$8(binding.value);
+      if (options.disabled || !isBrowser()) return;
+      let container;
+      if (options.container) {
+        if (options.container === window) {
+          container = window;
+        } else if (typeof options.container === "string") {
+          const found = document.querySelector(options.container);
+          container = found || getScrollParent(el);
+        } else {
+          container = options.container;
+        }
+      } else {
+        const { overflow, overflowX, overflowY } = getComputedStyle(el);
+        const isSelfScrollable = /(auto|scroll)/.test(overflow + overflowX + overflowY);
+        container = isSelfScrollable ? el : getScrollParent(el);
+      }
+      const state = {
+        options,
+        container,
+        lastScrollLeft: 0,
+        lastScrollTop: 0,
+        throttleTimer: null,
+        pendingEvent: null,
+        scrollHandler: (e) => {
+          if (options.throttle && options.throttle > 0) {
+            state.pendingEvent = e;
+            if (!state.throttleTimer) {
+              state.throttleTimer = setTimeout(() => {
+                if (state.pendingEvent) {
+                  const info = getScrollInfo(container, state.lastScrollLeft, state.lastScrollTop);
+                  state.lastScrollLeft = info.scrollLeft;
+                  state.lastScrollTop = info.scrollTop;
+                  options.handler(state.pendingEvent, info);
+                }
+                state.throttleTimer = null;
+                state.pendingEvent = null;
+              }, options.throttle);
+            }
+          } else {
+            const info = getScrollInfo(container, state.lastScrollLeft, state.lastScrollTop);
+            state.lastScrollLeft = info.scrollLeft;
+            state.lastScrollTop = info.scrollTop;
+            options.handler(e, info);
+          }
+        }
+      };
+      const initialInfo = getScrollInfo(container, 0, 0);
+      state.lastScrollLeft = initialInfo.scrollLeft;
+      state.lastScrollTop = initialInfo.scrollTop;
+      el.__scroll = state;
+      on(container, "scroll", state.scrollHandler, { passive: options.passive });
+    },
+    updated(el, binding) {
+      const state = el.__scroll;
+      if (!state) return;
+      state.options = normalizeOptions$8(binding.value);
+    },
+    unmounted(el) {
+      const state = el.__scroll;
+      if (!state) return;
+      if (state.throttleTimer) {
+        clearTimeout(state.throttleTimer);
+      }
+      off(state.container, "scroll", state.scrollHandler);
+      delete el.__scroll;
+    }
+  });
+  const STATE_KEY = "__sticky";
+  function normalizeOptions$7(binding) {
+    if (binding === false) return { disabled: true, top: 0, zIndex: 100 };
+    if (typeof binding === "number") return { top: binding, zIndex: 100 };
+    return __spreadValues({
+      top: 0,
+      zIndex: 100,
+      stickyClass: "v-sticky--fixed",
+      disabled: false
+    }, binding && typeof binding === "object" ? binding : {});
+  }
+  function parseOffset(value) {
+    if (value === void 0) return "0";
+    return typeof value === "number" ? `${value}px` : value;
+  }
+  function getScrollContainer(el, customContainer) {
+    if (customContainer) {
+      if (typeof customContainer === "string") {
+        return document.querySelector(customContainer) || getScrollParent(el);
+      }
+      return customContainer;
+    }
+    const parent = el.parentElement;
+    if (parent) {
+      const { overflow, overflowX, overflowY } = getComputedStyle(parent);
+      if (/(auto|scroll)/.test(overflow + overflowX + overflowY)) {
+        return parent;
+      }
+    }
+    return getScrollParent(el);
+  }
+  function checkSticky(el, state) {
+    if (state.options.disabled) {
+      unsetSticky(el, state);
+      return;
+    }
+    const topOffset = parseFloat(parseOffset(state.options.top));
+    const containerRect = state.container === window ? { top: 0 } : state.container.getBoundingClientRect();
+    const referenceEl = state.placeholder || el;
+    const rect = referenceEl.getBoundingClientRect();
+    const elementTopRelativeToContainer = rect.top - containerRect.top;
+    const shouldSticky = elementTopRelativeToContainer <= topOffset;
+    if (shouldSticky && !state.isSticky) {
+      setSticky(el, state, topOffset, containerRect.top);
+    } else if (!shouldSticky && state.isSticky) {
+      unsetSticky(el, state);
+    }
+  }
+  function setSticky(el, state, topOffset, containerTop) {
+    var _a, _b, _c;
+    state.isSticky = true;
+    const placeholder = document.createElement("div");
+    placeholder.style.cssText = `width:${el.offsetWidth}px;height:${el.offsetHeight}px`;
+    (_a = el.parentNode) == null ? void 0 : _a.insertBefore(placeholder, el);
+    state.placeholder = placeholder;
+    const fixedTop = state.container === window ? topOffset : containerTop + topOffset;
+    el.style.position = "fixed";
+    el.style.top = `${fixedTop}px`;
+    el.style.zIndex = String(state.options.zIndex || 100);
+    el.style.width = `${el.offsetWidth}px`;
+    if (state.options.bottom !== void 0) {
+      el.style.bottom = parseOffset(state.options.bottom);
+    }
+    state.options.stickyClass && el.classList.add(state.options.stickyClass);
+    el.dispatchEvent(new CustomEvent("sticky:change", { detail: { isSticky: true } }));
+    (_c = (_b = state.options).onChange) == null ? void 0 : _c.call(_b, true);
+  }
+  function unsetSticky(el, state) {
+    var _a, _b, _c, _d;
+    if (!state.isSticky) return;
+    state.isSticky = false;
+    (_b = (_a = state.placeholder) == null ? void 0 : _a.parentNode) == null ? void 0 : _b.removeChild(state.placeholder);
+    state.placeholder = null;
+    Object.assign(el.style, state.originalStyles);
+    state.options.stickyClass && el.classList.remove(state.options.stickyClass);
+    el.dispatchEvent(new CustomEvent("sticky:change", { detail: { isSticky: false } }));
+    (_d = (_c = state.options).onChange) == null ? void 0 : _d.call(_c, false);
+  }
+  const vSticky = defineDirective({
+    name: "sticky",
+    ssr: false,
+    defaults: { top: 0, zIndex: 100, stickyClass: "v-sticky--fixed", disabled: false },
+    mounted(el, binding) {
+      const options = normalizeOptions$7(binding.value);
+      if (options.disabled || !isBrowser()) return;
+      const container = getScrollContainer(el, options.container);
+      const state = {
+        options,
+        placeholder: null,
+        originalStyles: {
+          position: el.style.position,
+          top: el.style.top,
+          bottom: el.style.bottom,
+          zIndex: el.style.zIndex,
+          width: el.style.width
+        },
+        isSticky: false,
+        container,
+        scrollHandler: () => checkSticky(el, state),
+        resizeHandler: () => checkSticky(el, state)
+      };
+      el.classList.add("v-sticky");
+      el[STATE_KEY] = state;
+      on(container, "scroll", state.scrollHandler, { passive: true });
+      on(window, "resize", state.resizeHandler, { passive: true });
+      checkSticky(el, state);
+    },
+    updated(el, binding) {
+      const state = el[STATE_KEY];
+      if (!state) return;
+      state.options = normalizeOptions$7(binding.value);
+      checkSticky(el, state);
+    },
+    unmounted(el) {
+      var _a, _b;
+      const state = el[STATE_KEY];
+      if (!state) return;
+      (_b = (_a = state.placeholder) == null ? void 0 : _a.parentNode) == null ? void 0 : _b.removeChild(state.placeholder);
+      Object.assign(el.style, state.originalStyles);
+      el.classList.remove("v-sticky", state.options.stickyClass || "v-sticky--fixed");
+      off(state.container, "scroll", state.scrollHandler);
+      off(window, "resize", state.resizeHandler);
+      delete el[STATE_KEY];
+    }
+  });
+  function normalizeOptions$6(binding, directiveBinding) {
+    const wait = parseTime(directiveBinding.arg) || 300;
+    if (typeof binding === "function") {
+      return { handler: binding, wait };
+    }
+    return __spreadProps(__spreadValues({}, binding), { wait: binding.wait || wait });
+  }
+  const vThrottle = defineDirective({
+    name: "throttle",
+    ssr: true,
+    // SSR safe - event binding is skipped on server
+    defaults: {
+      wait: 300,
+      leading: true,
+      trailing: true
+    },
+    mounted(el, binding) {
+      const options = normalizeOptions$6(binding.value, binding);
+      const eventType = getEventTypeFromModifiers(binding.modifiers) || getDefaultEventType(el);
+      const throttledFn = throttle(options.handler, options.wait, {
+        leading: options.leading,
+        trailing: options.trailing
+      });
+      el.addEventListener(eventType, throttledFn);
+      el.__throttle = {
+        throttledFn,
+        eventType,
+        options
+      };
+    },
+    updated(el, binding) {
+      const state = el.__throttle;
+      if (!state) return;
+      const newOptions = normalizeOptions$6(binding.value, binding);
+      if (newOptions.wait !== state.options.wait || newOptions.leading !== state.options.leading || newOptions.trailing !== state.options.trailing) {
+        state.throttledFn.cancel();
+        const throttledFn = throttle(newOptions.handler, newOptions.wait, {
+          leading: newOptions.leading,
+          trailing: newOptions.trailing
+        });
+        el.removeEventListener(state.eventType, state.throttledFn);
+        el.addEventListener(state.eventType, throttledFn);
+        el.__throttle = {
+          throttledFn,
+          eventType: state.eventType,
+          options: newOptions
+        };
+      } else if (newOptions.handler !== state.options.handler) {
+        state.options.handler = newOptions.handler;
+      }
+    },
+    unmounted(el) {
+      const state = el.__throttle;
+      if (!state) return;
+      state.throttledFn.cancel();
+      el.removeEventListener(state.eventType, state.throttledFn);
+      delete el.__throttle;
+    }
+  });
+  const TOOLTIP_STYLES = {
+    padding: "8px 12px",
+    background: "#333",
+    color: "#fff",
+    borderRadius: "6px",
+    fontSize: "14px",
+    lineHeight: "1.5",
+    minWidth: "96px",
+    maxWidth: "320px",
+    boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)"
+  };
+  let tooltipContainer = null;
+  function getTooltipContainer() {
+    if (!tooltipContainer && typeof document !== "undefined") {
+      tooltipContainer = document.createElement("div");
+      tooltipContainer.id = "directix-tooltip-container";
+      tooltipContainer.style.cssText = "position: fixed; top: 0; left: 0; pointer-events: none; z-index: 9999;";
+      document.body.appendChild(tooltipContainer);
+    }
+    return tooltipContainer;
+  }
+  function createTooltip(options) {
+    const tooltip = document.createElement("div");
+    tooltip.className = `v-tooltip v-tooltip--${options.placement || "top"}`;
+    if (options.class) tooltip.classList.add(options.class);
+    const maxWidth = options.maxWidth ? typeof options.maxWidth === "number" ? `${options.maxWidth}px` : options.maxWidth : TOOLTIP_STYLES.maxWidth;
+    tooltip.style.cssText = [
+      "position: absolute",
+      `padding: ${TOOLTIP_STYLES.padding}`,
+      `background: ${TOOLTIP_STYLES.background}`,
+      `color: ${TOOLTIP_STYLES.color}`,
+      `border-radius: ${TOOLTIP_STYLES.borderRadius}`,
+      `font-size: ${TOOLTIP_STYLES.fontSize}`,
+      `line-height: ${TOOLTIP_STYLES.lineHeight}`,
+      `min-width: ${TOOLTIP_STYLES.minWidth}`,
+      `max-width: ${maxWidth}`,
+      "word-wrap: break-word",
+      `box-shadow: ${TOOLTIP_STYLES.boxShadow}`,
+      "pointer-events: none",
+      "opacity: 0",
+      "transition: opacity 0.2s ease",
+      `z-index: ${options.zIndex || 9999}`
+    ].join(";");
+    if (options.arrow !== false) {
+      const arrow = document.createElement("div");
+      arrow.className = "v-tooltip__arrow";
+      arrow.style.cssText = "position: absolute; width: 8px; height: 8px; background: #333; transform: rotate(45deg);";
+      tooltip.appendChild(arrow);
+    }
+    const content = document.createElement("div");
+    content.className = "v-tooltip__content";
+    content.textContent = options.content;
+    tooltip.appendChild(content);
+    return tooltip;
+  }
+  function positionTooltip(tooltip, el, placement, offset) {
+    const elRect = el.getBoundingClientRect();
+    const tooltipRect = tooltip.getBoundingClientRect();
+    let top = 0, left = 0;
+    switch (placement) {
+      case "top":
+        top = elRect.top - tooltipRect.height - offset;
+        left = elRect.left + (elRect.width - tooltipRect.width) / 2;
+        break;
+      case "bottom":
+        top = elRect.bottom + offset;
+        left = elRect.left + (elRect.width - tooltipRect.width) / 2;
+        break;
+      case "left":
+        top = elRect.top + (elRect.height - tooltipRect.height) / 2;
+        left = elRect.left - tooltipRect.width - offset;
+        break;
+      case "right":
+        top = elRect.top + (elRect.height - tooltipRect.height) / 2;
+        left = elRect.right + offset;
+        break;
+    }
+    const viewportWidth = window.innerWidth;
+    const viewportHeight = window.innerHeight;
+    if (left < 0) left = 8;
+    if (left + tooltipRect.width > viewportWidth) left = viewportWidth - tooltipRect.width - 8;
+    if (top < 0) top = 8;
+    if (top + tooltipRect.height > viewportHeight) top = viewportHeight - tooltipRect.height - 8;
+    tooltip.style.top = `${top}px`;
+    tooltip.style.left = `${left}px`;
+    const arrow = tooltip.querySelector(".v-tooltip__arrow");
+    if (arrow) {
+      const halfArrow = 4;
+      switch (placement) {
+        case "top":
+          Object.assign(arrow.style, { bottom: `-${halfArrow}px`, left: "50%", transform: "translateX(-50%) rotate(45deg)" });
+          break;
+        case "bottom":
+          Object.assign(arrow.style, { top: `-${halfArrow}px`, left: "50%", transform: "translateX(-50%) rotate(45deg)" });
+          break;
+        case "left":
+          Object.assign(arrow.style, { right: `-${halfArrow}px`, top: "50%", transform: "translateY(-50%) rotate(45deg)" });
+          break;
+        case "right":
+          Object.assign(arrow.style, { left: `-${halfArrow}px`, top: "50%", transform: "translateY(-50%) rotate(45deg)" });
+          break;
+      }
+    }
+  }
+  function showTooltip(el, state) {
+    if (state.isVisible || state.options.disabled) return;
+    if (state.hideTimeout) {
+      clearTimeout(state.hideTimeout);
+      state.hideTimeout = null;
+    }
+    const doShow = () => {
+      var _a, _b;
+      const tooltip = createTooltip(state.options);
+      state.tooltip = tooltip;
+      getTooltipContainer().appendChild(tooltip);
+      requestAnimationFrame(() => {
+        positionTooltip(tooltip, el, state.options.placement || "top", state.options.offset || 8);
+        requestAnimationFrame(() => {
+          tooltip.style.opacity = "1";
+        });
+      });
+      state.isVisible = true;
+      (_b = (_a = state.options).onShow) == null ? void 0 : _b.call(_a);
+    };
+    if (state.options.delay && state.options.delay > 0) {
+      state.showTimeout = setTimeout(doShow, state.options.delay);
+    } else {
+      doShow();
+    }
+  }
+  function hideTooltip(state) {
+    if (!state.isVisible) return;
+    if (state.showTimeout) {
+      clearTimeout(state.showTimeout);
+      state.showTimeout = null;
+    }
+    const doHide = () => {
+      var _a, _b;
+      if (state.tooltip) {
+        state.tooltip.style.opacity = "0";
+        setTimeout(() => {
+          var _a2;
+          (_a2 = state.tooltip) == null ? void 0 : _a2.remove();
+          state.tooltip = null;
+        }, 200);
+      }
+      state.isVisible = false;
+      (_b = (_a = state.options).onHide) == null ? void 0 : _b.call(_a);
+    };
+    if (state.options.hideDelay && state.options.hideDelay > 0) {
+      state.hideTimeout = setTimeout(doHide, state.options.hideDelay);
+    } else {
+      doHide();
+    }
+  }
+  function setupTriggerHandlers(el, state) {
+    const { trigger = "hover" } = state.options;
+    const show = () => showTooltip(el, state);
+    const hide = () => hideTooltip(state);
+    const toggle = () => state.isVisible ? hide() : show();
+    state.handlers = { show, hide, toggle };
+    switch (trigger) {
+      case "hover":
+        el.addEventListener("mouseenter", show);
+        el.addEventListener("mouseleave", hide);
+        break;
+      case "click":
+        el.addEventListener("click", toggle);
+        document.addEventListener("click", state.handlers.docHide = (e) => {
+          if (state.isVisible && !el.contains(e.target)) hide();
+        });
+        break;
+      case "focus":
+        el.addEventListener("focus", show);
+        el.addEventListener("blur", hide);
+        break;
+    }
+  }
+  function removeTriggerHandlers(el, state) {
+    const { show, hide, toggle, docHide } = state.handlers;
+    if (show) {
+      el.removeEventListener("mouseenter", show);
+      el.removeEventListener("focus", show);
+    }
+    if (hide) {
+      el.removeEventListener("mouseleave", hide);
+      el.removeEventListener("blur", hide);
+    }
+    if (toggle) {
+      el.removeEventListener("click", toggle);
+    }
+    if (docHide) {
+      document.removeEventListener("click", docHide);
+    }
+  }
+  function normalizeOptions$5(binding) {
+    var _a, _b, _c, _d, _e, _f, _g, _h;
+    if (typeof binding === "string") {
+      return { content: binding, placement: "top", trigger: "hover" };
+    }
+    if (!binding) {
+      return { content: "", placement: "top", trigger: "hover" };
+    }
+    return {
+      content: binding.content,
+      placement: (_a = binding.placement) != null ? _a : "top",
+      trigger: (_b = binding.trigger) != null ? _b : "hover",
+      delay: (_c = binding.delay) != null ? _c : 0,
+      hideDelay: (_d = binding.hideDelay) != null ? _d : 0,
+      offset: (_e = binding.offset) != null ? _e : 8,
+      class: binding.class,
+      arrow: (_f = binding.arrow) != null ? _f : true,
+      disabled: (_g = binding.disabled) != null ? _g : false,
+      maxWidth: binding.maxWidth,
+      zIndex: (_h = binding.zIndex) != null ? _h : 9999,
+      onShow: binding.onShow,
+      onHide: binding.onHide
+    };
+  }
+  function createState(options) {
+    return {
+      options,
+      tooltip: null,
+      showTimeout: null,
+      hideTimeout: null,
+      isVisible: false,
+      handlers: {}
+    };
+  }
+  const vTooltip = defineDirective({
+    name: "tooltip",
+    ssr: false,
+    mounted(el, binding) {
+      const options = normalizeOptions$5(binding.value);
+      if (options.disabled || !options.content) return;
+      const state = createState(options);
+      el.__tooltip = state;
+      setupTriggerHandlers(el, state);
+      el.setAttribute("aria-describedby", "v-tooltip");
+    },
+    updated(el, binding) {
+      const state = el.__tooltip;
+      const newOptions = normalizeOptions$5(binding.value);
+      if (!state) {
+        if (!newOptions.disabled && newOptions.content) {
+          const newState = createState(newOptions);
+          el.__tooltip = newState;
+          setupTriggerHandlers(el, newState);
+          if (newOptions.trigger === "manual") {
+            showTooltip(el, newState);
+          }
+        }
+        return;
+      }
+      if (newOptions.trigger === "manual") {
+        const oldDisabled = state.options.disabled;
+        state.options = newOptions;
+        if (newOptions.disabled && !oldDisabled) {
+          hideTooltip(state);
+        } else if (!newOptions.disabled && oldDisabled) {
+          showTooltip(el, state);
+        }
+        return;
+      }
+      if (state.tooltip && state.isVisible) {
+        const content = state.tooltip.querySelector(".v-tooltip__content");
+        if (content) content.textContent = newOptions.content;
+      }
+      state.options = newOptions;
+    },
+    unmounted(el) {
+      var _a;
+      const state = el.__tooltip;
+      if (!state) return;
+      if (state.showTimeout) clearTimeout(state.showTimeout);
+      if (state.hideTimeout) clearTimeout(state.hideTimeout);
+      (_a = state.tooltip) == null ? void 0 : _a.remove();
+      removeTriggerHandlers(el, state);
+      delete el.__tooltip;
+    }
+  });
+  const getDistance = (x1, y1, x2, y2) => Math.sqrt(__pow(x2 - x1, 2) + __pow(y2 - y1, 2));
+  const getAngle = (x1, y1, x2, y2) => Math.atan2(y2 - y1, x2 - x1) * 180 / Math.PI;
+  const MOUSE_IGNORE_DURATION = 400;
+  const vTouch = defineDirective({
+    name: "touch",
+    ssr: false,
+    mounted(el, binding) {
+      const options = normalizeOptions$4(binding.value);
+      const state = {
+        options,
+        startX: 0,
+        startY: 0,
+        startTime: 0,
+        startDistance: 0,
+        startAngle: 0,
+        lastScale: 1,
+        lastAngle: 0,
+        longPressTimer: null,
+        isLongPress: false,
+        isMouseDown: false,
+        lastTouchEndTime: 0,
+        handlers: { touchStart: () => {
+        }, touchMove: () => {
+        }, touchEnd: () => {
+        } }
+      };
+      el.__touch = state;
+      const clearLongPressTimer = () => {
+        if (state.longPressTimer) {
+          clearTimeout(state.longPressTimer);
+          state.longPressTimer = null;
+        }
+      };
+      const startLongPressTimer = (event) => {
+        clearLongPressTimer();
+        if (state.options.enableLongPress && state.options.onLongPress) {
+          state.longPressTimer = setTimeout(() => {
+            state.isLongPress = true;
+            state.options.onLongPress(event);
+          }, state.options.longPressTimeout || 500);
+        }
+      };
+      const exceedsThreshold = (x, y) => {
+        const threshold = state.options.tapThreshold || 10;
+        return Math.abs(x - state.startX) > threshold || Math.abs(y - state.startY) > threshold;
+      };
+      const handleGestureEnd = (endX, endY, event) => {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
+        if (state.isLongPress) return;
+        const duration = Date.now() - state.startTime;
+        const deltaX = endX - state.startX;
+        const deltaY = endY - state.startY;
+        const distance = Math.sqrt(__pow(deltaX, 2) + __pow(deltaY, 2));
+        if (state.options.enableSwipe && distance >= (state.options.swipeThreshold || 30) && duration <= (state.options.swipeTimeout || 500)) {
+          const direction = Math.abs(deltaX) > Math.abs(deltaY) ? deltaX > 0 ? "right" : "left" : deltaY > 0 ? "down" : "up";
+          (_b = (_a = state.options).onSwipe) == null ? void 0 : _b.call(_a, direction, event);
+          if (direction === "left") (_d = (_c = state.options).onSwipeLeft) == null ? void 0 : _d.call(_c, event);
+          else if (direction === "right") (_f = (_e = state.options).onSwipeRight) == null ? void 0 : _f.call(_e, event);
+          else if (direction === "up") (_h = (_g = state.options).onSwipeUp) == null ? void 0 : _h.call(_g, event);
+          else (_j = (_i = state.options).onSwipeDown) == null ? void 0 : _j.call(_i, event);
+        } else if (state.options.enableTap && distance < (state.options.tapThreshold || 10) && duration < (state.options.tapTimeout || 250)) {
+          (_l = (_k = state.options).onTap) == null ? void 0 : _l.call(_k, event);
+        }
+      };
+      const handleTouchStart = (e) => {
+        var _a, _b;
+        if (e.touches.length > 1) {
+          e.preventDefault();
+        }
+        state.startTime = Date.now();
+        state.isLongPress = false;
+        if (e.touches.length === 1) {
+          state.startX = e.touches[0].clientX;
+          state.startY = e.touches[0].clientY;
+          startLongPressTimer(e);
+        } else if (e.touches.length === 2) {
+          clearLongPressTimer();
+          const [t1, t2] = e.touches;
+          state.startDistance = getDistance(t1.clientX, t1.clientY, t2.clientX, t2.clientY);
+          state.startAngle = getAngle(t1.clientX, t1.clientY, t2.clientX, t2.clientY);
+          state.lastScale = 1;
+          state.lastAngle = 0;
+        }
+        (_b = (_a = state.options).onTouchStart) == null ? void 0 : _b.call(_a, e);
+      };
+      const handleTouchMove = (e) => {
+        var _a, _b;
+        if (e.touches.length >= 1) {
+          e.preventDefault();
+        }
+        if (state.longPressTimer && e.touches.length === 1 && exceedsThreshold(e.touches[0].clientX, e.touches[0].clientY)) {
+          clearLongPressTimer();
+        }
+        if (e.touches.length === 2) {
+          const [t1, t2] = e.touches;
+          const currentDistance = getDistance(t1.clientX, t1.clientY, t2.clientX, t2.clientY);
+          const currentAngle = getAngle(t1.clientX, t1.clientY, t2.clientX, t2.clientY);
+          if (state.options.enablePinch && state.options.onPinch) {
+            const scale = currentDistance / state.startDistance;
+            if (Math.abs(scale - state.lastScale) >= (state.options.pinchThreshold || 0.1)) {
+              state.options.onPinch(scale, e);
+              state.lastScale = scale;
+            }
+          }
+          if (state.options.enableRotate && state.options.onRotate) {
+            const angleDiff = currentAngle - state.startAngle;
+            if (Math.abs(angleDiff - state.lastAngle) > 5) {
+              state.options.onRotate(angleDiff, e);
+              state.lastAngle = angleDiff;
+            }
+          }
+        }
+        (_b = (_a = state.options).onTouchMove) == null ? void 0 : _b.call(_a, e);
+      };
+      const handleTouchEnd = (e) => {
+        var _a, _b;
+        clearLongPressTimer();
+        if (e.touches.length === 0) {
+          state.lastTouchEndTime = Date.now();
+          const touch = e.changedTouches[0];
+          handleGestureEnd(touch.clientX, touch.clientY, e);
+        }
+        (_b = (_a = state.options).onTouchEnd) == null ? void 0 : _b.call(_a, e);
+      };
+      const handleMouseDown = (e) => {
+        var _a, _b;
+        if (!state.options.enableMouse) return;
+        if (Date.now() - state.lastTouchEndTime < MOUSE_IGNORE_DURATION) return;
+        e.preventDefault();
+        state.isMouseDown = true;
+        state.startTime = Date.now();
+        state.startX = e.clientX;
+        state.startY = e.clientY;
+        state.isLongPress = false;
+        startLongPressTimer(e);
+        (_b = (_a = state.options).onTouchStart) == null ? void 0 : _b.call(_a, e);
+      };
+      const handleMouseMove = (e) => {
+        var _a, _b;
+        if (!state.isMouseDown || !state.options.enableMouse) return;
+        if (state.longPressTimer && exceedsThreshold(e.clientX, e.clientY)) {
+          clearLongPressTimer();
+        }
+        (_b = (_a = state.options).onTouchMove) == null ? void 0 : _b.call(_a, e);
+      };
+      const handleMouseUp = (e) => {
+        var _a, _b;
+        if (!state.isMouseDown || !state.options.enableMouse) return;
+        state.isMouseDown = false;
+        clearLongPressTimer();
+        if (!state.isLongPress) {
+          handleGestureEnd(e.clientX, e.clientY, e);
+        }
+        (_b = (_a = state.options).onTouchEnd) == null ? void 0 : _b.call(_a, e);
+      };
+      state.handlers = { touchStart: handleTouchStart, touchMove: handleTouchMove, touchEnd: handleTouchEnd, mouseDown: handleMouseDown, mouseMove: handleMouseMove, mouseUp: handleMouseUp };
+      el.addEventListener("touchstart", handleTouchStart, { passive: false });
+      el.addEventListener("touchmove", handleTouchMove, { passive: false });
+      el.addEventListener("touchend", handleTouchEnd);
+      el.addEventListener("touchcancel", handleTouchEnd);
+      if (options.enableMouse) {
+        el.addEventListener("mousedown", handleMouseDown);
+        document.addEventListener("mousemove", handleMouseMove);
+        document.addEventListener("mouseup", handleMouseUp);
+      }
+    },
+    updated(el, binding) {
+      const state = el.__touch;
+      if (state) state.options = normalizeOptions$4(binding.value);
+    },
+    unmounted(el) {
+      const state = el.__touch;
+      if (state == null ? void 0 : state.longPressTimer) clearTimeout(state.longPressTimer);
+      if (state == null ? void 0 : state.handlers) {
+        el.removeEventListener("touchstart", state.handlers.touchStart);
+        el.removeEventListener("touchmove", state.handlers.touchMove);
+        el.removeEventListener("touchend", state.handlers.touchEnd);
+        el.removeEventListener("touchcancel", state.handlers.touchEnd);
+        if (state.handlers.mouseDown) el.removeEventListener("mousedown", state.handlers.mouseDown);
+        if (state.handlers.mouseMove) document.removeEventListener("mousemove", state.handlers.mouseMove);
+        if (state.handlers.mouseUp) document.removeEventListener("mouseup", state.handlers.mouseUp);
+      }
+      delete el.__touch;
+    }
+  });
+  function normalizeOptions$4(binding) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
+    return {
+      swipeThreshold: (_a = binding == null ? void 0 : binding.swipeThreshold) != null ? _a : 30,
+      swipeTimeout: (_b = binding == null ? void 0 : binding.swipeTimeout) != null ? _b : 500,
+      pinchThreshold: (_c = binding == null ? void 0 : binding.pinchThreshold) != null ? _c : 0.1,
+      enableSwipe: (_d = binding == null ? void 0 : binding.enableSwipe) != null ? _d : true,
+      enablePinch: (_e = binding == null ? void 0 : binding.enablePinch) != null ? _e : true,
+      enableRotate: (_f = binding == null ? void 0 : binding.enableRotate) != null ? _f : true,
+      enableTap: (_g = binding == null ? void 0 : binding.enableTap) != null ? _g : true,
+      tapTimeout: (_h = binding == null ? void 0 : binding.tapTimeout) != null ? _h : 250,
+      tapThreshold: (_i = binding == null ? void 0 : binding.tapThreshold) != null ? _i : 10,
+      enableLongPress: (_j = binding == null ? void 0 : binding.enableLongPress) != null ? _j : true,
+      longPressTimeout: (_k = binding == null ? void 0 : binding.longPressTimeout) != null ? _k : 500,
+      enableMouse: (_l = binding == null ? void 0 : binding.enableMouse) != null ? _l : true,
+      onSwipe: binding == null ? void 0 : binding.onSwipe,
+      onSwipeLeft: binding == null ? void 0 : binding.onSwipeLeft,
+      onSwipeRight: binding == null ? void 0 : binding.onSwipeRight,
+      onSwipeUp: binding == null ? void 0 : binding.onSwipeUp,
+      onSwipeDown: binding == null ? void 0 : binding.onSwipeDown,
+      onPinch: binding == null ? void 0 : binding.onPinch,
+      onRotate: binding == null ? void 0 : binding.onRotate,
+      onTap: binding == null ? void 0 : binding.onTap,
+      onLongPress: binding == null ? void 0 : binding.onLongPress,
+      onTouchStart: binding == null ? void 0 : binding.onTouchStart,
+      onTouchMove: binding == null ? void 0 : binding.onTouchMove,
+      onTouchEnd: binding == null ? void 0 : binding.onTouchEnd
+    };
+  }
+  function trimText(text, options) {
+    const { position = "both", chars } = options;
+    const charPattern = chars ? `[\\s${escapeRegex(chars)}]` : "\\s";
+    switch (position) {
+      case "start":
+        return text.replace(new RegExp(`^${charPattern}+`, "g"), "");
+      case "end":
+        return text.replace(new RegExp(`${charPattern}+$`, "g"), "");
+      case "both":
+      default:
+        return text.replace(new RegExp(`^${charPattern}+|${charPattern}+$`, "g"), "");
+    }
+  }
+  function escapeRegex(str) {
+    return str.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+  }
+  const vTrim = defineDirective({
+    name: "trim",
+    ssr: true,
+    mounted(el, binding) {
+      const options = normalizeOptions$3(binding.value);
+      if (el.tagName === "INPUT" || el.tagName === "TEXTAREA") {
+        setupInputElement(el, options);
+      } else {
+        const text = el.textContent || "";
+        el.textContent = trimText(text, options);
+      }
+    },
+    updated(el, binding) {
+      const options = normalizeOptions$3(binding.value);
+      const state = el.__trim;
+      if (el.tagName === "INPUT" || el.tagName === "TEXTAREA") {
+        if (state) {
+          state.options = options;
+        }
+      } else {
+        const text = el.textContent || "";
+        el.textContent = trimText(text, options);
+      }
+    },
+    unmounted(el) {
+      const state = el.__trim;
+      if (state == null ? void 0 : state.inputHandler) {
+        el.removeEventListener("input", state.inputHandler);
+      }
+      if (state == null ? void 0 : state.blurHandler) {
+        el.removeEventListener("blur", state.blurHandler);
+      }
+      delete el.__trim;
+    }
+  });
+  function setupInputElement(el, options) {
+    const state = { options };
+    el.__trim = state;
+    const performTrim = () => {
+      const originalValue = el.value;
+      const trimmed = trimText(originalValue, options);
+      if (originalValue !== trimmed) {
+        el.value = trimmed;
+        el.dispatchEvent(new Event("input", { bubbles: true }));
+      }
+    };
+    if (options.onInput) {
+      const inputHandler = () => {
+        const originalValue = el.value;
+        const cursorPos = el.selectionStart;
+        const trimmed = originalValue.replace(/\s+$/g, "");
+        if (originalValue !== trimmed) {
+          el.value = trimmed;
+          if (cursorPos !== null) {
+            const newCursorPos = Math.min(cursorPos, trimmed.length);
+            el.setSelectionRange(newCursorPos, newCursorPos);
+          }
+        }
+      };
+      el.addEventListener("input", inputHandler);
+      state.inputHandler = inputHandler;
+    }
+    if (options.onBlur) {
+      const blurHandler = () => performTrim();
+      el.addEventListener("blur", blurHandler);
+      state.blurHandler = blurHandler;
+    }
+    if (el.value) {
+      performTrim();
+    }
+  }
+  function normalizeOptions$3(binding) {
+    var _a, _b, _c;
+    if (binding === void 0 || binding === true) {
+      return { position: "both", onInput: true, onBlur: true };
+    }
+    if (binding === false) {
+      return { position: "both", onInput: false, onBlur: false };
+    }
+    if (typeof binding === "string") {
+      return { position: binding, onInput: true, onBlur: true };
+    }
+    return {
+      position: (_a = binding.position) != null ? _a : "both",
+      onInput: (_b = binding.onInput) != null ? _b : true,
+      onBlur: (_c = binding.onBlur) != null ? _c : true,
+      chars: binding.chars
+    };
+  }
+  function truncateText(text, options) {
+    const { length = 100, position = "end", ellipsis = "..." } = options;
+    if (text.length <= length) {
+      return text;
+    }
+    switch (position) {
+      case "start":
+        return ellipsis + text.slice(-(length - ellipsis.length));
+      case "middle": {
+        const startLen = Math.ceil((length - ellipsis.length) / 2);
+        const endLen = Math.floor((length - ellipsis.length) / 2);
+        return text.slice(0, startLen) + ellipsis + text.slice(-endLen);
+      }
+      case "end":
+      default:
+        return text.slice(0, length - ellipsis.length) + ellipsis;
+    }
+  }
+  const vTruncate = defineDirective({
+    name: "truncate",
+    ssr: true,
+    mounted(el, binding) {
+      const options = normalizeOptions$2(binding.value);
+      const text = el.textContent || "";
+      const state = {
+        originalText: text,
+        options
+      };
+      el.__truncate = state;
+      applyTruncation(el, text, options);
+    },
+    updated(el, binding) {
+      const state = el.__truncate;
+      const newOptions = normalizeOptions$2(binding.value);
+      if (state) {
+        const originalText = state.originalText;
+        if (JSON.stringify(newOptions) !== JSON.stringify(state.options)) {
+          state.options = newOptions;
+          applyTruncation(el, originalText, newOptions);
+        }
+      } else {
+        const text = el.textContent || "";
+        el.__truncate = {
+          originalText: text,
+          options: newOptions
+        };
+        applyTruncation(el, text, newOptions);
+      }
+    },
+    unmounted(el) {
+      delete el.__truncate;
+    }
+  });
+  function applyTruncation(el, text, options) {
+    const { useCss, showTitle = true } = options;
+    if (useCss) {
+      el.style.overflow = "hidden";
+      el.style.textOverflow = "ellipsis";
+      el.style.whiteSpace = "nowrap";
+      if (showTitle && text) {
+        el.setAttribute("title", text);
+      }
+    } else {
+      const truncated = truncateText(text, options);
+      el.textContent = truncated;
+      if (showTitle && text && text !== truncated) {
+        el.setAttribute("title", text);
+      }
+    }
+  }
+  function normalizeOptions$2(binding) {
+    var _a, _b, _c, _d, _e;
+    if (typeof binding === "number") {
+      return {
+        length: binding,
+        position: "end",
+        ellipsis: "...",
+        useCss: false,
+        showTitle: true
+      };
+    }
+    return {
+      length: (_a = binding == null ? void 0 : binding.length) != null ? _a : 100,
+      position: (_b = binding == null ? void 0 : binding.position) != null ? _b : "end",
+      ellipsis: (_c = binding == null ? void 0 : binding.ellipsis) != null ? _c : "...",
+      useCss: (_d = binding == null ? void 0 : binding.useCss) != null ? _d : false,
+      showTitle: (_e = binding == null ? void 0 : binding.showTitle) != null ? _e : true
+    };
+  }
+  function transformText(text, options) {
+    if (!text) return text;
+    if (options.first) {
+      return text.charAt(0).toUpperCase() + text.slice(1);
+    }
+    return text.toUpperCase();
+  }
+  function normalizeOptions$1(binding) {
+    var _a, _b;
+    if (binding === void 0 || binding === true) {
+      return { first: false, onInput: true };
+    }
+    if (binding === false) {
+      return { first: false, onInput: false };
+    }
+    return {
+      first: (_a = binding.first) != null ? _a : false,
+      onInput: (_b = binding.onInput) != null ? _b : true
+    };
+  }
+  const vUppercase = defineDirective({
+    name: "uppercase",
+    ssr: true,
+    mounted(el, binding) {
+      const options = normalizeOptions$1(binding.value);
+      if (isInputElement(el)) {
+        const cleanup2 = setupTextTransformInput(el, options, (text) => transformText(text, options));
+        el.__uppercaseCleanup = cleanup2;
+      } else {
+        transformTextContent(el, (text) => transformText(text, options));
+      }
+    },
+    updated(el, binding) {
+      const options = normalizeOptions$1(binding.value);
+      if (isInputElement(el)) {
+        if (options.onInput) {
+          el.value = transformText(el.value, options);
+        }
+      } else {
+        transformTextContent(el, (text) => transformText(text, options));
+      }
+    },
+    unmounted(el) {
+      const cleanup2 = el.__uppercaseCleanup;
+      cleanup2 == null ? void 0 : cleanup2();
+      delete el.__uppercaseCleanup;
+    }
+  });
+  function normalizeOptions(binding) {
+    if (typeof binding === "boolean") {
+      return { initial: binding };
+    }
+    return __spreadValues({
+      initial: true,
+      disabled: false,
+      useHidden: false
+    }, binding);
+  }
+  const vVisible = defineDirective({
+    name: "visible",
+    ssr: true,
+    // SSR safe - will set initial visibility on server
+    defaults: {
+      initial: true,
+      disabled: false,
+      useHidden: false
+    },
+    mounted(el, binding) {
+      var _a, _b;
+      if (!isBrowser()) return;
+      const options = normalizeOptions(binding.value);
+      const originalDisplay = el.style.display;
+      const originalVisibility = el.style.visibility;
+      const state = {
+        options,
+        isVisible: (_a = options.initial) != null ? _a : true,
+        originalDisplay,
+        originalVisibility,
+        transitionEndHandler: (e) => {
+          if (e.propertyName === "opacity" || e.propertyName === "visibility") {
+            el.dispatchEvent(new CustomEvent("visible:transition-end", {
+              detail: { isVisible: state.isVisible }
+            }));
+          }
+        }
+      };
+      el.__visible = state;
+      on(el, "transitionend", state.transitionEndHandler);
+      applyVisibility(el, state, (_b = options.initial) != null ? _b : true);
+    },
+    updated(el, binding) {
+      var _a;
+      const state = el.__visible;
+      if (!state) return;
+      const newOptions = normalizeOptions(binding.value);
+      let newVisibility;
+      if (typeof binding.value === "boolean") {
+        newVisibility = binding.value;
+      } else {
+        newVisibility = (_a = newOptions.initial) != null ? _a : true;
+      }
+      if (state.isVisible !== newVisibility) {
+        applyVisibility(el, state, newVisibility);
+      }
+      state.options = newOptions;
+    },
+    unmounted(el) {
+      const state = el.__visible;
+      if (!state) return;
+      off(el, "transitionend", state.transitionEndHandler);
+      el.style.display = state.originalDisplay;
+      el.style.visibility = state.originalVisibility;
+      delete el.__visible;
+    }
+  });
+  function applyVisibility(el, state, isVisible) {
+    const previousVisibility = state.isVisible;
+    state.isVisible = isVisible;
+    if (isVisible) {
+      el.classList.remove("v-hidden");
+      el.classList.add("v-visible");
+    } else {
+      el.classList.remove("v-visible");
+      el.classList.add("v-hidden");
+    }
+    if (state.options.useHidden) {
+      if (isVisible) {
+        el.style.visibility = state.originalVisibility || "visible";
+      } else {
+        const computedStyle = getComputedStyle(el);
+        const hasTransition = computedStyle.transitionDuration !== "0s";
+        if (hasTransition) {
+          const handleTransitionEnd = (e) => {
+            if (e.target === el && (e.propertyName === "opacity" || e.propertyName === "transform")) {
+              if (!state.isVisible) {
+                el.style.visibility = "hidden";
+              }
+              el.removeEventListener("transitionend", handleTransitionEnd);
+            }
+          };
+          el.addEventListener("transitionend", handleTransitionEnd);
+        } else {
+          el.style.visibility = "hidden";
+        }
+      }
+    } else {
+      el.style.display = isVisible ? state.originalDisplay : "none";
+    }
+    el.dispatchEvent(new CustomEvent("visible:change", {
+      detail: { isVisible, previousVisibility }
+    }));
+    if (state.options.handler && previousVisibility !== isVisible) {
+      state.options.handler(isVisible);
+    }
+  }
+  const allDirectives = {
+    "click-outside": vClickOutside,
+    copy: vCopy,
+    debounce: vDebounce,
+    throttle: vThrottle,
+    focus: vFocus,
+    lazy: vLazy,
+    intersect: vIntersect,
+    visible: vVisible,
+    loading: vLoading,
+    scroll: vScroll,
+    "infinite-scroll": vInfiniteScroll,
+    sticky: vSticky,
+    "long-press": vLongPress,
+    hover: vHover,
+    ripple: vRipple,
+    mask: vMask,
+    permission: vPermission,
+    sanitize: vSanitize,
+    resize: vResize,
+    mutation: vMutation,
+    truncate: vTruncate,
+    uppercase: vUppercase,
+    lowercase: vLowercase,
+    capitalcase: vCapitalcase,
+    number: vNumber,
+    money: vMoney,
+    trim: vTrim,
+    tooltip: vTooltip,
+    draggable: vDraggable,
+    touch: vTouch,
+    "image-preview": vImagePreview
+  };
+  const install = (app, options = {}) => {
+    var _a, _b, _c, _d, _e, _f, _g;
+    let vueVersion = null;
+    if (typeof app === "function" && ((_a = app.version) == null ? void 0 : _a.startsWith("2"))) {
+      vueVersion = 2;
+    } else if ((app == null ? void 0 : app.config) && ((_b = app == null ? void 0 : app.version) == null ? void 0 : _b.startsWith("3"))) {
+      vueVersion = 3;
+    } else if (typeof (app == null ? void 0 : app.directive) === "function" && typeof (app == null ? void 0 : app.mixin) === "function" && ((_c = app.version) == null ? void 0 : _c.startsWith("2"))) {
+      vueVersion = 2;
+    } else if (typeof window !== "undefined") {
+      const win = window;
+      if ((_e = (_d = win.Vue) == null ? void 0 : _d.version) == null ? void 0 : _e.startsWith("2")) {
+        vueVersion = 2;
+      } else if ((_g = (_f = win.Vue) == null ? void 0 : _f.version) == null ? void 0 : _g.startsWith("3")) {
+        vueVersion = 3;
+      }
+    }
+    if (vueVersion) {
+      setVueVersion(vueVersion);
+    }
     const { directives, all = false } = options;
     if (all || !directives) {
       Object.entries(allDirectives).forEach(([name, directive]) => {
@@ -1179,7 +4858,9 @@ var __async = (__this, __arguments, generator) => {
   exports.Directix = Directix;
   exports.addCleanupVue2 = addCleanup$1;
   exports.addCleanupVue3 = addCleanup;
+  exports.capitalcase = vCapitalcase;
   exports.clickOutside = vClickOutside;
+  exports.configurePermission = configurePermission;
   exports.copy = vCopy;
   exports.createVue2Directive = createVue2Directive;
   exports.createVue3Directive = createVue3Directive;
@@ -1189,10 +4870,16 @@ var __async = (__this, __arguments, generator) => {
   exports.deepMerge = deepMerge;
   exports.defineDirective = defineDirective;
   exports.defineDirectiveGroup = defineDirectiveGroup;
+  exports.draggable = vDraggable;
   exports.focus = vFocus;
   exports.generateId = generateId;
   exports.get = get;
+  exports.getPermissionConfig = getPermissionConfig;
   exports.getVueVersion = getVueVersion;
+  exports.hover = vHover;
+  exports.imagePreview = vImagePreview;
+  exports.infiniteScroll = vInfiniteScroll;
+  exports.intersect = vIntersect;
   exports.isArray = isArray;
   exports.isBoolean = isBoolean;
   exports.isBrowser = isBrowser;
@@ -1204,9 +4891,26 @@ var __async = (__this, __arguments, generator) => {
   exports.isSSR = isSSR;
   exports.isString = isString;
   exports.isVue2 = isVue2;
+  exports.isVue27 = isVue27;
   exports.isVue3 = isVue3;
+  exports.lazy = vLazy;
+  exports.loading = vLoading;
+  exports.longPress = vLongPress;
+  exports.lowercase = vLowercase;
+  exports.mask = vMask;
+  exports.money = vMoney;
+  exports.mutation = vMutation;
+  exports.number = vNumber;
   exports.parseTime = parseTime;
+  exports.permission = vPermission;
+  exports.resetVueVersion = resetVueVersion;
+  exports.resize = vResize;
+  exports.ripple = vRipple;
+  exports.sanitize = vSanitize;
+  exports.scroll = vScroll;
   exports.set = set;
+  exports.setVueVersion = setVueVersion;
+  exports.sticky = vSticky;
   exports.supportsClipboard = supportsClipboard;
   exports.supportsIntersectionObserver = supportsIntersectionObserver;
   exports.supportsMutationObserver = supportsMutationObserver;
@@ -1214,11 +4918,43 @@ var __async = (__this, __arguments, generator) => {
   exports.supportsResizeObserver = supportsResizeObserver;
   exports.throttle = vThrottle;
   exports.throttleFn = throttle;
+  exports.tooltip = vTooltip;
+  exports.touch = vTouch;
+  exports.trim = vTrim;
+  exports.truncate = vTruncate;
+  exports.uppercase = vUppercase;
+  exports.vCapitalcase = vCapitalcase;
   exports.vClickOutside = vClickOutside;
   exports.vCopy = vCopy;
   exports.vDebounce = vDebounce;
+  exports.vDraggable = vDraggable;
   exports.vFocus = vFocus;
+  exports.vHover = vHover;
+  exports.vImagePreview = vImagePreview;
+  exports.vInfiniteScroll = vInfiniteScroll;
+  exports.vIntersect = vIntersect;
+  exports.vLazy = vLazy;
+  exports.vLoading = vLoading;
+  exports.vLongPress = vLongPress;
+  exports.vLowercase = vLowercase;
+  exports.vMask = vMask;
+  exports.vMoney = vMoney;
+  exports.vMutation = vMutation;
+  exports.vNumber = vNumber;
+  exports.vPermission = vPermission;
+  exports.vResize = vResize;
+  exports.vRipple = vRipple;
+  exports.vSanitize = vSanitize;
+  exports.vScroll = vScroll;
+  exports.vSticky = vSticky;
   exports.vThrottle = vThrottle;
+  exports.vTooltip = vTooltip;
+  exports.vTouch = vTouch;
+  exports.vTrim = vTrim;
+  exports.vTruncate = vTruncate;
+  exports.vUppercase = vUppercase;
+  exports.vVisible = vVisible;
+  exports.visible = vVisible;
   Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 })(this.Directix = this.Directix || {});
 //# sourceMappingURL=index.iife.js.map