directix 1.0.0 → 1.1.0

package/dist/index.iife.js

@@ -1,142 +1,16 @@
 /*!
- * directix v1.0.0
+ * directix v1.1.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,38 +57,119 @@ var __async = (__this, __arguments, generator) => {
   });
 };
 /*!
- * directix v1.0.0
+ * directix v1.1.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;
+  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");
-      if ((_a = vue == null ? void 0 : vue.version) == null ? void 0 : _a.startsWith("2")) {
+      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;
-      } else if ((_b = vue == null ? void 0 : vue.version) == null ? void 0 : _b.startsWith("3")) {
+        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;
       }
-    } 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."
+          "[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;
   }
-  const isVue2 = () => getVueVersion() === 2;
-  const isVue3 = () => getVueVersion() === 3;
+  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";
   };
@@ -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;
     }
-    return createVue3Directive(wrappedHooks);
+    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 {
+      // 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;
@@ -441,17 +422,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$k(options);
     target.addEventListener(event, handler, opts);
   }
   function off(target, event, handler, options = false) {
     if (!isBrowser()) return;
-    const opts = normalizeOptions$5(options);
+    const opts = normalizeOptions$k(options);
     target.removeEventListener(event, handler, opts);
   }
-  function normalizeOptions$5(options) {
+  function normalizeOptions$k(options) {
     if (typeof options === "boolean") {
       return options;
     }
@@ -461,6 +454,22 @@ 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";
   }
@@ -658,7 +667,7 @@ var __async = (__this, __arguments, generator) => {
       prevent: false
     },
     mounted(el, binding) {
-      const options = normalizeOptions$4(binding.value);
+      const options = normalizeOptions$j(binding.value);
       if (options.disabled) return;
       const state = {
         options,
@@ -693,7 +702,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$j(binding.value);
       if (oldOptions.disabled !== newOptions.disabled) {
         if (newOptions.disabled) {
           state.handlers.forEach((handler, eventType) => {
@@ -730,7 +739,7 @@ var __async = (__this, __arguments, generator) => {
       delete el.__clickOutside;
     }
   });
-  function normalizeOptions$4(binding) {
+  function normalizeOptions$j(binding) {
     var _a, _b, _c, _d, _e;
     if (typeof binding === "function") {
       return {
@@ -807,7 +816,7 @@ var __async = (__this, __arguments, generator) => {
     name: "copy",
     ssr: false,
     mounted(el, binding) {
-      const options = normalizeOptions$3(binding.value);
+      const options = normalizeOptions$i(binding.value);
       if (options.disabled) return;
       if (options.title) {
         el.setAttribute("title", options.title);
@@ -843,7 +852,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$i(binding.value);
       if (state.options.title) {
         el.setAttribute("title", state.options.title);
       }
@@ -855,7 +864,7 @@ var __async = (__this, __arguments, generator) => {
       delete el.__copy;
     }
   });
-  function normalizeOptions$3(binding) {
+  function normalizeOptions$i(binding) {
     if (typeof binding === "string") {
       return { value: binding };
     }
@@ -863,14 +872,15 @@ var __async = (__this, __arguments, generator) => {
   }
   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 options = normalizeOptions$h(binding.value, binding);
       const eventType = getEventTypeFromModifiers$1(binding.modifiers) || getEventType$1(el);
       const debouncedFn = debounce(options.handler, options.wait, {
         leading: options.leading,
@@ -886,7 +896,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$h(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,7 +922,7 @@ var __async = (__this, __arguments, generator) => {
       delete el.__debounce;
     }
   });
-  function normalizeOptions$2(binding, directiveBinding) {
+  function normalizeOptions$h(binding, directiveBinding) {
     const wait = parseTime(directiveBinding.arg) || 300;
     if (typeof binding === "function") {
       return { handler: binding, wait };
@@ -956,14 +966,15 @@ var __async = (__this, __arguments, generator) => {
   }
   const vThrottle = defineDirective({
     name: "throttle",
-    ssr: false,
+    ssr: true,
+    // SSR safe - event binding is skipped on server
     defaults: {
       wait: 300,
       leading: true,
       trailing: true
     },
     mounted(el, binding) {
-      const options = normalizeOptions$1(binding.value, binding);
+      const options = normalizeOptions$g(binding.value, binding);
       const eventType = getEventTypeFromModifiers(binding.modifiers) || getEventType(el);
       const throttledFn = throttle(options.handler, options.wait, {
         leading: options.leading,
@@ -979,7 +990,7 @@ var __async = (__this, __arguments, generator) => {
     updated(el, binding) {
       const state = el.__throttle;
       if (!state) return;
-      const newOptions = normalizeOptions$1(binding.value, binding);
+      const newOptions = normalizeOptions$g(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, {
@@ -1005,7 +1016,7 @@ var __async = (__this, __arguments, generator) => {
       delete el.__throttle;
     }
   });
-  function normalizeOptions$1(binding, directiveBinding) {
+  function normalizeOptions$g(binding, directiveBinding) {
     const wait = parseTime(directiveBinding.arg) || 300;
     if (typeof binding === "function") {
       return { handler: binding, wait };
@@ -1060,13 +1071,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$f(binding.value);
       if (!options.focus || !isFocusable(el)) {
         if (options.focus) {
           console.warn("[Directix] v-focus: Element is not focusable");
@@ -1094,7 +1107,7 @@ var __async = (__this, __arguments, generator) => {
     updated(el, binding) {
       const state = el.__focus;
       if (!state) return;
-      const newOptions = normalizeOptions(binding.value);
+      const newOptions = normalizeOptions$f(binding.value);
       if (newOptions.onFocus !== state.options.onFocus) {
         el.removeEventListener("focus", state.handleFocus);
         state.handleFocus = () => {
@@ -1126,7 +1139,7 @@ var __async = (__this, __arguments, generator) => {
       delete el.__focus;
     }
   });
-  function normalizeOptions(binding) {
+  function normalizeOptions$f(binding) {
     if (typeof binding === "boolean") {
       return { focus: binding, refocus: false };
     }
@@ -1149,14 +1162,1935 @@ var __async = (__this, __arguments, generator) => {
     }
     return false;
   }
-  const allDirectives = {
-    "click-outside": vClickOutside,
-    copy: vCopy,
-    debounce: vDebounce,
-    throttle: vThrottle,
-    focus: vFocus
-  };
-  const install = (app, options = {}) => {
+  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$e(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$e(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$e(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;
+    }
+  });
+  const STATE_KEY$3 = "__intersect";
+  function normalizeOptions$d(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$d(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$d(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];
+    }
+  });
+  function normalizeOptions$c(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$c(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$c(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);
+    }
+  }
+  function normalizeOptions$b(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$b(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$b(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 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$a(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$a(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$a(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;
+    }
+  });
+  function normalizeOptions$9(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$9(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$9(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$2 = "__sticky";
+  function normalizeOptions$8(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 = Number.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$8(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$2] = 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$2];
+      if (!state) return;
+      state.options = normalizeOptions$8(binding.value);
+      checkSticky(el, state);
+    },
+    unmounted(el) {
+      var _a, _b;
+      const state = el[STATE_KEY$2];
+      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$2];
+    }
+  });
+  function normalizeOptions$7(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(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$7(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(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$7(binding.value);
+        if (!options.disabled) {
+          el.__longPress = null;
+        }
+        return;
+      }
+      state.options = normalizeOptions$7(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 normalizeOptions$6(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$6(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$6(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);
+  }
+  function normalizeOptions$5(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$5(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$5(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 STATE_KEY$1 = "__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$4(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$4(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$1] = { 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$1];
+      if (!state) return;
+      state.options = normalizeOptions$4(binding.value);
+      state.tokens = parseMask(state.options.mask, state.placeholder);
+    },
+    unmounted(el) {
+      const state = el[STATE_KEY$1];
+      if (!state) return;
+      off(el, "input", state.inputHandler);
+      off(el, "focus", state.focusHandler);
+      off(el, "blur", state.blurHandler);
+      delete el[STATE_KEY$1];
+    }
+  });
+  const STATE_KEY = "__permission";
+  const WILDCARD = "*";
+  let globalConfig = null;
+  function configurePermission(config) {
+    globalConfig = config;
+  }
+  function getPermissionConfig() {
+    return globalConfig;
+  }
+  function normalizeOptions$3(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]) {
+      el[STATE_KEY] = {
+        options: { value: "" },
+        originalDisplay: "",
+        originalDisabled: false,
+        parentNode: null,
+        placeholder: null
+      };
+    }
+    return el[STATE_KEY];
+  }
+  function checkPermission(el, binding) {
+    var _a, _b;
+    const state = getState(el);
+    state.options = normalizeOptions$3(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];
+    if ((state == null ? void 0 : state.placeholder) && state.parentNode) {
+      state.parentNode.removeChild(state.placeholder);
+    }
+    delete el[STATE_KEY];
+  }
+  const vPermission = defineDirective({
+    name: "permission",
+    ssr: true,
+    mounted(el, binding) {
+      checkPermission(el, binding);
+    },
+    updated(el, binding) {
+      checkPermission(el, binding);
+    },
+    unmounted(el) {
+      cleanup(el);
+    }
+  });
+  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$2(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$2(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$2(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 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$1(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$1(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$1(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(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(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(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 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
+  };
+  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]) => {
@@ -1180,6 +3114,7 @@ var __async = (__this, __arguments, generator) => {
   exports.addCleanupVue2 = addCleanup$1;
   exports.addCleanupVue3 = addCleanup;
   exports.clickOutside = vClickOutside;
+  exports.configurePermission = configurePermission;
   exports.copy = vCopy;
   exports.createVue2Directive = createVue2Directive;
   exports.createVue3Directive = createVue3Directive;
@@ -1192,7 +3127,11 @@ var __async = (__this, __arguments, generator) => {
   exports.focus = vFocus;
   exports.generateId = generateId;
   exports.get = get;
+  exports.getPermissionConfig = getPermissionConfig;
   exports.getVueVersion = getVueVersion;
+  exports.hover = vHover;
+  exports.infiniteScroll = vInfiniteScroll;
+  exports.intersect = vIntersect;
   exports.isArray = isArray;
   exports.isBoolean = isBoolean;
   exports.isBrowser = isBrowser;
@@ -1204,9 +3143,23 @@ 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.mask = vMask;
+  exports.mutation = vMutation;
   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;
@@ -1218,7 +3171,23 @@ var __async = (__this, __arguments, generator) => {
   exports.vCopy = vCopy;
   exports.vDebounce = vDebounce;
   exports.vFocus = vFocus;
+  exports.vHover = vHover;
+  exports.vInfiniteScroll = vInfiniteScroll;
+  exports.vIntersect = vIntersect;
+  exports.vLazy = vLazy;
+  exports.vLoading = vLoading;
+  exports.vLongPress = vLongPress;
+  exports.vMask = vMask;
+  exports.vMutation = vMutation;
+  exports.vPermission = vPermission;
+  exports.vResize = vResize;
+  exports.vRipple = vRipple;
+  exports.vSanitize = vSanitize;
+  exports.vScroll = vScroll;
+  exports.vSticky = vSticky;
   exports.vThrottle = vThrottle;
+  exports.vVisible = vVisible;
+  exports.visible = vVisible;
   Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 })(this.Directix = this.Directix || {});
 //# sourceMappingURL=index.iife.js.map