@maple-design/use 0.0.0-stage → 1.1.0

package/lib/index.cjs

@@ -0,0 +1,871 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+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 = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  keyInProvides: () => keyInProvides,
+  onSmartMounted: () => onSmartMounted,
+  onSmartUnmounted: () => onSmartUnmounted,
+  onWindowResize: () => onWindowResize,
+  provideDirection: () => provideDirection,
+  readingDirectionKey: () => readingDirectionKey,
+  resolveDirection: () => resolveDirection,
+  useAsyncData: () => useAsyncData,
+  useChildren: () => useChildren,
+  useClickOutside: () => useClickOutside,
+  useClientId: () => useClientId,
+  useDirection: () => useDirection,
+  useEventListener: () => useEventListener,
+  useId: () => useId2,
+  useInitialized: () => useInitialized,
+  useMotion: () => useMotion,
+  useParent: () => useParent,
+  useTouch: () => useTouch,
+  useVModel: () => useVModel,
+  useWindowSize: () => useWindowSize
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/useEventListener.ts
+var import_vue2 = require("vue");
+var import_shared = require("@maple-design/shared");
+
+// src/onSmartMounted.ts
+var import_vue = require("vue");
+function onSmartMounted(hook) {
+  let isMounted = false;
+  (0, import_vue.onMounted)(() => {
+    hook();
+    (0, import_vue.nextTick)(() => {
+      isMounted = true;
+    });
+  });
+  (0, import_vue.onActivated)(() => {
+    if (!isMounted) {
+      return;
+    }
+    hook();
+  });
+}
+
+// src/useEventListener.ts
+function useEventListener(target, type, listener, options = {}) {
+  if (!(0, import_shared.inBrowser)()) {
+    return () => {
+    };
+  }
+  const { passive = false, capture = false } = options;
+  let boundTarget;
+  let active = false;
+  let cleaned = false;
+  let stop;
+  const resolveTarget = () => {
+    var _a;
+    return (_a = (0, import_shared.isFunction)(target) ? target() : (0, import_vue2.unref)(target)) != null ? _a : void 0;
+  };
+  const detach = () => {
+    boundTarget == null ? void 0 : boundTarget.removeEventListener(type, listener, { capture });
+    boundTarget = void 0;
+  };
+  const bind = () => {
+    if (!active || cleaned) {
+      return;
+    }
+    const next = resolveTarget();
+    if (next === boundTarget) {
+      return;
+    }
+    detach();
+    next == null ? void 0 : next.addEventListener(type, listener, { passive, capture });
+    boundTarget = next;
+  };
+  const cleanup = () => {
+    if (cleaned) {
+      return;
+    }
+    cleaned = true;
+    active = false;
+    stop == null ? void 0 : stop();
+    detach();
+  };
+  if ((0, import_vue2.isRef)(target) || (0, import_shared.isFunction)(target)) {
+    stop = (0, import_vue2.watch)(resolveTarget, bind);
+  }
+  onSmartMounted(() => {
+    active = true;
+    bind();
+  });
+  (0, import_vue2.onDeactivated)(() => {
+    active = false;
+    detach();
+  });
+  (0, import_vue2.onBeforeUnmount)(cleanup);
+  return cleanup;
+}
+
+// src/useClickOutside.ts
+var import_vue3 = require("vue");
+var import_shared2 = require("@maple-design/shared");
+function useClickOutside(target, type, listener) {
+  if (!(0, import_shared2.inBrowser)()) {
+    return;
+  }
+  const handler = (event) => {
+    const element = (0, import_shared2.isFunction)(target) ? target() : (0, import_vue3.unref)(target);
+    if (element && !event.composedPath().includes(element) && !element.contains(event.target)) {
+      listener(event);
+    }
+  };
+  useEventListener(document, type, handler);
+}
+
+// src/onSmartUnmounted.ts
+var import_vue4 = require("vue");
+function onSmartUnmounted(hook) {
+  let keepalive = false;
+  (0, import_vue4.onDeactivated)(() => {
+    keepalive = true;
+    hook();
+  });
+  (0, import_vue4.onUnmounted)(() => {
+    if (keepalive) {
+      return;
+    }
+    hook();
+  });
+}
+
+// src/useParent.ts
+var import_vue5 = require("vue");
+function keyInProvides(key) {
+  const instance = (0, import_vue5.getCurrentInstance)();
+  return key in instance.provides;
+}
+function useParent(key) {
+  if (!keyInProvides(key)) {
+    return {
+      index: null,
+      parentProvider: null,
+      bindParent: null
+    };
+  }
+  const provider = (0, import_vue5.inject)(key);
+  const _a = provider, { childInstances, collect, clear } = _a, parentProvider = __objRest(_a, ["childInstances", "collect", "clear"]);
+  const childInstance = (0, import_vue5.getCurrentInstance)();
+  const index = (0, import_vue5.computed)(() => childInstances.indexOf(childInstance));
+  const bindParent = (childProvider) => {
+    let active = false;
+    let registered = false;
+    const add = () => {
+      active = true;
+      (0, import_vue5.nextTick)(() => {
+        if (active && !registered) {
+          collect(childInstance, childProvider);
+          registered = true;
+        }
+      });
+    };
+    const remove = () => {
+      active = false;
+      if (registered) {
+        clear(childInstance, childProvider);
+        registered = false;
+      }
+    };
+    (0, import_vue5.onMounted)(add);
+    (0, import_vue5.onActivated)(add);
+    (0, import_vue5.onDeactivated)(remove);
+    (0, import_vue5.onBeforeUnmount)(remove);
+  };
+  return {
+    index,
+    parentProvider,
+    bindParent
+  };
+}
+
+// src/useChildren.ts
+var import_vue6 = require("vue");
+var import_shared3 = require("@maple-design/shared");
+function flatVNodes(subTree) {
+  const vNodes = [];
+  const flat = (subTree2) => {
+    if (subTree2 == null ? void 0 : subTree2.component) {
+      flat(subTree2 == null ? void 0 : subTree2.component.subTree);
+      return;
+    }
+    if ((0, import_shared3.isArray)(subTree2 == null ? void 0 : subTree2.children)) {
+      subTree2.children.forEach((child) => {
+        if ((0, import_vue6.isVNode)(child)) {
+          vNodes.push(child);
+          flat(child);
+        }
+      });
+    }
+  };
+  flat(subTree);
+  return vNodes;
+}
+function useChildren(key) {
+  const parentInstance = (0, import_vue6.getCurrentInstance)();
+  const childInstances = (0, import_vue6.reactive)([]);
+  const childProviders = [];
+  const length = (0, import_vue6.computed)(() => childInstances.length);
+  const sortInstances = () => {
+    const vNodes = flatVNodes(parentInstance.subTree);
+    const sorted = [...childInstances].sort((a, b) => vNodes.indexOf(a.vnode) - vNodes.indexOf(b.vnode));
+    if (sorted.every((instance, index) => instance === childInstances[index])) {
+      return;
+    }
+    const providers = sorted.map((instance) => childProviders[childInstances.indexOf(instance)]);
+    childInstances.splice(0, childInstances.length, ...sorted);
+    childProviders.splice(0, childProviders.length, ...providers);
+  };
+  (0, import_vue6.onUpdated)(sortInstances);
+  const collect = (childInstance, childProvider) => {
+    if (childInstances.includes(childInstance)) {
+      return;
+    }
+    childInstances.push(childInstance);
+    childProviders.push(childProvider);
+    sortInstances();
+  };
+  const clear = (childInstance, childProvider) => {
+    (0, import_shared3.removeItem)(childInstances, childInstance);
+    (0, import_shared3.removeItem)(childProviders, childProvider);
+  };
+  const bindChildren = (parentProvider) => {
+    (0, import_vue6.provide)(key, __spreadValues({
+      childInstances,
+      collect,
+      clear
+    }, parentProvider));
+  };
+  return {
+    length,
+    childProviders,
+    bindChildren
+  };
+}
+
+// src/onWindowResize.ts
+function onWindowResize(listener) {
+  useEventListener(() => window, "resize", listener, { passive: true });
+  useEventListener(() => window, "orientationchange", listener, { passive: true });
+}
+
+// src/useInitialized.ts
+var import_vue7 = require("vue");
+function useInitialized(source, value) {
+  const initialized = (0, import_vue7.ref)(false);
+  (0, import_vue7.watch)(
+    source,
+    (newValue) => {
+      if (value === newValue) {
+        initialized.value = true;
+      }
+    },
+    { immediate: true }
+  );
+  return initialized;
+}
+
+// src/useTouch.ts
+var import_vue8 = require("vue");
+var import_shared4 = require("@maple-design/shared");
+function getDirection(x, y) {
+  if (x > y) {
+    return "horizontal";
+  }
+  if (y > x) {
+    return "vertical";
+  }
+}
+function useTouch() {
+  const startX = (0, import_vue8.ref)(0);
+  const startY = (0, import_vue8.ref)(0);
+  const deltaX = (0, import_vue8.ref)(0);
+  const deltaY = (0, import_vue8.ref)(0);
+  const offsetX = (0, import_vue8.ref)(0);
+  const offsetY = (0, import_vue8.ref)(0);
+  const prevX = (0, import_vue8.ref)(0);
+  const prevY = (0, import_vue8.ref)(0);
+  const moveX = (0, import_vue8.ref)(0);
+  const moveY = (0, import_vue8.ref)(0);
+  const direction = (0, import_vue8.ref)();
+  const touching = (0, import_vue8.ref)(false);
+  const dragging = (0, import_vue8.ref)(false);
+  const startTime = (0, import_vue8.ref)(0);
+  const distance = (0, import_vue8.ref)(0);
+  let draggingAnimationFrame = null;
+  const cancelFrame = () => {
+    if (draggingAnimationFrame !== null && typeof window !== "undefined") {
+      window.cancelAnimationFrame(draggingAnimationFrame);
+    }
+    draggingAnimationFrame = null;
+  };
+  const resetTouch = () => {
+    cancelFrame();
+    startX.value = 0;
+    startY.value = 0;
+    deltaX.value = 0;
+    deltaY.value = 0;
+    offsetX.value = 0;
+    offsetY.value = 0;
+    prevX.value = 0;
+    prevY.value = 0;
+    moveX.value = 0;
+    moveY.value = 0;
+    direction.value = void 0;
+    touching.value = false;
+    dragging.value = false;
+    startTime.value = 0;
+    distance.value = 0;
+  };
+  const startTouch = (event) => {
+    resetTouch();
+    if (!event.touches.length) {
+      return;
+    }
+    const { clientX: x, clientY: y } = event.touches[0];
+    startX.value = x;
+    startY.value = y;
+    prevX.value = x;
+    prevY.value = y;
+    touching.value = true;
+    startTime.value = performance.now();
+    dragging.value = false;
+    if (draggingAnimationFrame) {
+      window.cancelAnimationFrame(draggingAnimationFrame);
+    }
+  };
+  const moveTouch = (event) => {
+    if (!event.touches.length) {
+      return;
+    }
+    const { clientX: x, clientY: y } = event.touches[0];
+    dragging.value = true;
+    deltaX.value = x - startX.value;
+    deltaY.value = y - startY.value;
+    offsetX.value = Math.abs(deltaX.value);
+    offsetY.value = Math.abs(deltaY.value);
+    distance.value = Math.sqrt(offsetX.value ** 2 + offsetY.value ** 2);
+    moveX.value = x - prevX.value;
+    moveY.value = y - prevY.value;
+    if (!direction.value) {
+      direction.value = getDirection(offsetX.value, offsetY.value);
+    }
+    prevX.value = x;
+    prevY.value = y;
+  };
+  const endTouch = () => {
+    touching.value = false;
+    cancelFrame();
+    if (typeof window === "undefined") {
+      dragging.value = false;
+      return;
+    }
+    draggingAnimationFrame = window.requestAnimationFrame(() => {
+      draggingAnimationFrame = null;
+      dragging.value = false;
+    });
+  };
+  const isReachTop = (element) => {
+    const scrollTop = (0, import_shared4.getScrollTop)(element);
+    return scrollTop === 0 && deltaY.value > 0;
+  };
+  const isReachBottom = (element, offset = 1) => {
+    const { scrollHeight, clientHeight, scrollTop } = element;
+    const offsetBottom = Math.abs(scrollHeight - scrollTop - clientHeight);
+    return deltaY.value < 0 && offsetBottom <= offset;
+  };
+  (0, import_vue8.onBeforeUnmount)(resetTouch);
+  (0, import_vue8.onDeactivated)(resetTouch);
+  return {
+    startX,
+    startY,
+    deltaX,
+    deltaY,
+    offsetX,
+    offsetY,
+    prevX,
+    prevY,
+    moveX,
+    moveY,
+    direction,
+    touching,
+    dragging,
+    startTime,
+    distance,
+    resetTouch,
+    startTouch,
+    moveTouch,
+    endTouch,
+    isReachTop,
+    isReachBottom
+  };
+}
+
+// src/useId.ts
+var Vue = __toESM(require("vue"), 1);
+var import_shared5 = require("@maple-design/shared");
+function useId2() {
+  var _a, _b;
+  const instance = Vue.getCurrentInstance();
+  const name = (0, import_shared5.kebabCase)((_a = instance.type.name) != null ? _a : "component");
+  const nativeId = (_b = Vue.useId) == null ? void 0 : _b();
+  const id = Vue.ref();
+  id.value = process.env.NODE_ENV === "test" ? `${name}-mock-id` : nativeId ? `${name}-${nativeId}` : void 0;
+  Vue.onMounted(() => {
+    if (id.value === void 0) {
+      id.value = `${name}-${instance.uid}`;
+    }
+  });
+  return id;
+}
+
+// src/useClientId.ts
+var import_vue9 = require("vue");
+var import_shared6 = require("@maple-design/shared");
+function useClientId() {
+  const instance = (0, import_vue9.getCurrentInstance)();
+  const name = (0, import_shared6.kebabCase)(instance.type.name);
+  const id = (0, import_vue9.ref)(process.env.NODE_ENV === "test" ? `${name}-mock-id` : void 0);
+  (0, import_vue9.onMounted)(() => {
+    if (process.env.NODE_ENV !== "test") {
+      id.value = `${name}-${instance.uid}`;
+    }
+  });
+  return id;
+}
+
+// src/useWindowSize.ts
+var import_vue10 = require("vue");
+var import_shared7 = require("@maple-design/shared");
+function useWindowSize(options = {}) {
+  const { initialWidth = 0, initialHeight = 0 } = options;
+  const width = (0, import_vue10.ref)(initialWidth);
+  const height = (0, import_vue10.ref)(initialHeight);
+  const update = () => {
+    if (!(0, import_shared7.inBrowser)()) {
+      return;
+    }
+    width.value = window.innerWidth;
+    height.value = window.innerHeight;
+  };
+  onSmartMounted(update);
+  onWindowResize(update);
+  return {
+    width,
+    height
+  };
+}
+
+// src/useVModel.ts
+var import_vue11 = require("vue");
+var import_shared8 = require("@maple-design/shared");
+function useVModel(props, key, options = {}) {
+  const { passive = true, eventName, defaultValue, emit } = options;
+  const event = eventName != null ? eventName : `${emit ? "update" : "onUpdate"}:${key.toString()}`;
+  const getValue = () => {
+    var _a;
+    return (_a = props[key]) != null ? _a : defaultValue;
+  };
+  if (!passive) {
+    return (0, import_vue11.computed)({
+      get() {
+        return getValue();
+      },
+      set(value) {
+        emit ? emit(event, value) : (0, import_shared8.call)(props[event], value);
+      }
+    });
+  }
+  const proxy = (0, import_vue11.ref)(getValue());
+  let shouldEmit = true;
+  (0, import_vue11.watch)(
+    () => props[key],
+    () => {
+      shouldEmit = false;
+      proxy.value = getValue();
+      (0, import_vue11.nextTick)(() => {
+        shouldEmit = true;
+      });
+    }
+  );
+  (0, import_vue11.watch)(
+    () => proxy.value,
+    (newValue) => {
+      if (!shouldEmit) {
+        return;
+      }
+      emit ? emit(event, newValue) : (0, import_shared8.call)(props[event], newValue);
+    }
+  );
+  return proxy;
+}
+
+// src/useMotion.ts
+var import_vue12 = require("vue");
+var import_shared9 = require("@maple-design/shared");
+function useMotion(options) {
+  const value = (0, import_vue12.ref)(getter(options.from));
+  const state = (0, import_vue12.ref)("pending");
+  let ctx = createMotionContext();
+  function getter(value2) {
+    return (0, import_shared9.isFunction)(value2) ? value2() : value2;
+  }
+  function reset() {
+    ctx.reset();
+    value.value = getter(options.from);
+    state.value = "pending";
+    ctx = createMotionContext();
+  }
+  function start() {
+    ctx.start();
+  }
+  function pause() {
+    ctx.pause();
+  }
+  function createMotionContext() {
+    return (0, import_shared9.motion)({
+      from: getter(options.from),
+      to: getter(options.to),
+      duration: options.duration === void 0 ? 300 : getter(options.duration),
+      timingFunction: options.timingFunction,
+      onStateChange(newState) {
+        state.value = newState;
+      },
+      frame({ value: newValue, done }) {
+        var _a;
+        value.value = newValue;
+        if (done) {
+          (_a = options.onFinished) == null ? void 0 : _a.call(options, value.value);
+        }
+      }
+    });
+  }
+  return {
+    value,
+    state,
+    start,
+    pause,
+    reset
+  };
+}
+
+// src/useAsyncData.ts
+var import_vue13 = require("vue");
+function useAsyncData(loader, options) {
+  const data = (0, import_vue13.shallowRef)(options.initialData);
+  const loading = (0, import_vue13.ref)(false);
+  const error = (0, import_vue13.shallowRef)();
+  const initialKey = Symbol("initial");
+  const cache = /* @__PURE__ */ new Map();
+  let active;
+  let last = {};
+  let disposed = false;
+  let started = false;
+  function cancel() {
+    const task = active;
+    active = void 0;
+    if (task) {
+      clearTimeout(task.timer);
+      task.controller.abort();
+      task.settle({ status: "cancelled" });
+    }
+    loading.value = false;
+  }
+  function run(request, delay) {
+    var _a, _b, _c;
+    cancel();
+    if (disposed) {
+      return Promise.resolve({ status: "cancelled" });
+    }
+    started = true;
+    last = request;
+    error.value = void 0;
+    const currentLoader = (_a = request.loader) != null ? _a : loader;
+    const key = (_b = request.cacheKey) != null ? _b : request.loader ? void 0 : initialKey;
+    const ttl = (_c = options.cacheTime) != null ? _c : 0;
+    const cached = key === void 0 ? void 0 : cache.get(key);
+    if (!request.force && ttl > 0 && cached && cached.expires > Date.now()) {
+      data.value = cached.data;
+      return Promise.resolve({ status: "success", data: cached.data });
+    }
+    if (key !== void 0) {
+      cache.delete(key);
+    }
+    loading.value = true;
+    return new Promise((settle) => {
+      const task = {
+        controller: new AbortController(),
+        settle,
+        timer: void 0
+      };
+      active = task;
+      const start = () => __async(this, null, function* () {
+        try {
+          const value = yield currentLoader({ signal: task.controller.signal });
+          if (active !== task) {
+            return;
+          }
+          data.value = value;
+          if (ttl > 0 && key !== void 0) {
+            if (cache.size >= 50) {
+              cache.delete(cache.keys().next().value);
+            }
+            cache.set(key, { data: value, expires: Date.now() + ttl });
+          }
+          settle({ status: "success", data: value });
+        } catch (cause) {
+          if (active !== task) {
+            return;
+          }
+          error.value = cause;
+          settle({ status: "error", error: cause });
+        } finally {
+          if (active === task) {
+            active = void 0;
+            loading.value = false;
+          }
+        }
+      });
+      if (delay > 0) {
+        task.timer = setTimeout(start, delay);
+      } else {
+        void start();
+      }
+    });
+  }
+  const execute = (request = {}) => {
+    var _a;
+    return run(request, (_a = options.debounce) != null ? _a : 0);
+  };
+  const refresh = () => run(__spreadProps(__spreadValues({}, last), { force: true }), 0);
+  const initialize = () => {
+    if (!started && !disposed && options.immediate !== false) {
+      void run({}, 0);
+    }
+  };
+  if ((0, import_vue13.getCurrentInstance)()) {
+    (0, import_vue13.onMounted)(initialize);
+  } else {
+    initialize();
+  }
+  if ((0, import_vue13.getCurrentScope)()) {
+    (0, import_vue13.onScopeDispose)(() => {
+      disposed = true;
+      cancel();
+      cache.clear();
+    });
+  }
+  return {
+    data,
+    loading: (0, import_vue13.readonly)(loading),
+    error: (0, import_vue13.readonly)(error),
+    execute,
+    refresh,
+    cancel,
+    clearCache: () => cache.clear()
+  };
+}
+
+// src/useDirection.ts
+var import_vue14 = require("vue");
+var readingDirectionKey = Symbol("reading-direction");
+function provideDirection(direction) {
+  (0, import_vue14.provide)(readingDirectionKey, direction);
+}
+function resolveDirection(element, fallback = "ltr") {
+  var _a, _b;
+  const scope = element == null ? void 0 : element.closest("[dir]");
+  const value = (_a = scope == null ? void 0 : scope.getAttribute("dir")) == null ? void 0 : _a.toLowerCase();
+  if (value === "ltr" || value === "rtl") {
+    return value;
+  }
+  if (value === "auto" && scope) {
+    return ((_b = scope.ownerDocument.defaultView) == null ? void 0 : _b.getComputedStyle(scope).direction) === "rtl" ? "rtl" : "ltr";
+  }
+  return fallback;
+}
+var documents = /* @__PURE__ */ new WeakMap();
+function useDirection(target, explicit) {
+  const inherited = (0, import_vue14.inject)(readingDirectionKey, void 0);
+  const instance = (0, import_vue14.getCurrentInstance)();
+  const element = (0, import_vue14.shallowRef)();
+  const version = (0, import_vue14.shallowRef)();
+  let release;
+  let active = false;
+  function observe(node) {
+    var _a;
+    if (node === element.value && release) {
+      return;
+    }
+    release == null ? void 0 : release();
+    release = void 0;
+    element.value = node != null ? node : void 0;
+    version.value = void 0;
+    const doc = node == null ? void 0 : node.ownerDocument;
+    const Observer = (_a = doc == null ? void 0 : doc.defaultView) == null ? void 0 : _a.MutationObserver;
+    if (!doc || !Observer) {
+      return;
+    }
+    let state = documents.get(doc);
+    if (!state) {
+      const counter = (0, import_vue14.ref)(0);
+      const observer = new Observer(() => {
+        counter.value++;
+      });
+      observer.observe(doc.documentElement, { subtree: true, attributes: true, attributeFilter: ["dir"] });
+      state = { version: counter, observer, users: 0 };
+      documents.set(doc, state);
+    }
+    state.users++;
+    version.value = state.version;
+    const current = state;
+    release = () => {
+      if (--current.users === 0) {
+        current.observer.disconnect();
+        documents.delete(doc);
+      }
+    };
+  }
+  function refresh() {
+    const node = target ? target() : instance == null ? void 0 : instance.vnode.el;
+    observe((node == null ? void 0 : node.nodeType) === 1 ? node : node == null ? void 0 : node.parentElement);
+  }
+  function start() {
+    active = true;
+    refresh();
+  }
+  function stop() {
+    active = false;
+    release == null ? void 0 : release();
+    release = void 0;
+    version.value = void 0;
+  }
+  (0, import_vue14.onMounted)(start);
+  (0, import_vue14.onActivated)(start);
+  (0, import_vue14.onDeactivated)(stop);
+  (0, import_vue14.onScopeDispose)(stop);
+  (0, import_vue14.watchPostEffect)(() => {
+    const node = target == null ? void 0 : target();
+    if (active) {
+      if (target) {
+        observe(node);
+      } else {
+        refresh();
+      }
+    }
+  });
+  const dir = (0, import_vue14.computed)(() => {
+    var _a, _b;
+    void ((_a = version.value) == null ? void 0 : _a.value);
+    const value = explicit == null ? void 0 : explicit();
+    if (value === "ltr" || value === "rtl") {
+      return value;
+    }
+    return resolveDirection(element.value, (_b = inherited == null ? void 0 : inherited.value) != null ? _b : "ltr");
+  });
+  return { dir, isRtl: (0, import_vue14.computed)(() => dir.value === "rtl") };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  keyInProvides,
+  onSmartMounted,
+  onSmartUnmounted,
+  onWindowResize,
+  provideDirection,
+  readingDirectionKey,
+  resolveDirection,
+  useAsyncData,
+  useChildren,
+  useClickOutside,
+  useClientId,
+  useDirection,
+  useEventListener,
+  useId,
+  useInitialized,
+  useMotion,
+  useParent,
+  useTouch,
+  useVModel,
+  useWindowSize
+});