bootstrap-vue-next
Version:
Seamless integration of Vue 3, Bootstrap 5, and TypeScript for modern, type-safe UI development
1,504 lines • 66.9 kB
JavaScript
require("./chunk-CoQrYLCe.js");
let vue = require("vue");
//#region ../../node_modules/.pnpm/@vueuse+shared@14.2.1_vue@3.5.31_typescript@5.9.3_/node_modules/@vueuse/shared/dist/index.js
/**
*
* @deprecated This function will be removed in future version.
*
* Note: If you are using Vue 3.4+, you can straight use computed instead.
* Because in Vue 3.4+, if computed new value does not change,
* computed, effect, watch, watchEffect, render dependencies will not be triggered.
* refer: https://github.com/vuejs/core/pull/5912
*
* @param fn effect function
* @param options WatchOptionsBase
* @returns readonly shallowRef
*/
function computedEager(fn, options) {
var _options$flush;
const result = (0, vue.shallowRef)();
(0, vue.watchEffect)(() => {
result.value = fn();
}, {
...options,
flush: (_options$flush = options === null || options === void 0 ? void 0 : options.flush) !== null && _options$flush !== void 0 ? _options$flush : "sync"
});
return (0, vue.readonly)(result);
}
/**
* Call onScopeDispose() if it's inside an effect scope lifecycle, if not, do nothing
*
* @param fn
*/
function tryOnScopeDispose(fn, failSilently) {
if ((0, vue.getCurrentScope)()) {
(0, vue.onScopeDispose)(fn, failSilently);
return true;
}
return false;
}
/**
* Utility for creating event hooks
*
* @see https://vueuse.org/createEventHook
*
* @__NO_SIDE_EFFECTS__
*/
function createEventHook() {
const fns = /* @__PURE__ */ new Set();
const off = (fn) => {
fns.delete(fn);
};
const clear = () => {
fns.clear();
};
const on = (fn) => {
fns.add(fn);
const offFn = () => off(fn);
tryOnScopeDispose(offFn);
return { off: offFn };
};
const trigger = (...args) => {
return Promise.all(Array.from(fns).map((fn) => fn(...args)));
};
return {
on,
off,
trigger,
clear
};
}
/**
* Keep states in the global scope to be reusable across Vue instances.
*
* @see https://vueuse.org/createGlobalState
* @param stateFactory A factory function to create the state
*
* @__NO_SIDE_EFFECTS__
*/
function createGlobalState(stateFactory) {
let initialized = false;
let state;
const scope = (0, vue.effectScope)(true);
return ((...args) => {
if (!initialized) {
state = scope.run(() => stateFactory(...args));
initialized = true;
}
return state;
});
}
var localProvidedStateMap = /* @__PURE__ */ new WeakMap();
/**
* On the basis of `inject`, it is allowed to directly call inject to obtain the value after call provide in the same component.
*
* @example
* ```ts
* injectLocal('MyInjectionKey', 1)
* const injectedValue = injectLocal('MyInjectionKey') // injectedValue === 1
* ```
*
* @__NO_SIDE_EFFECTS__
*/
var injectLocal = (...args) => {
var _getCurrentInstance;
const key = args[0];
const instance = (_getCurrentInstance = (0, vue.getCurrentInstance)()) === null || _getCurrentInstance === void 0 ? void 0 : _getCurrentInstance.proxy;
const owner = instance !== null && instance !== void 0 ? instance : (0, vue.getCurrentScope)();
if (owner == null && !(0, vue.hasInjectionContext)()) throw new Error("injectLocal must be called in setup");
if (owner && localProvidedStateMap.has(owner) && key in localProvidedStateMap.get(owner)) return localProvidedStateMap.get(owner)[key];
return (0, vue.inject)(...args);
};
var isClient = typeof window !== "undefined" && typeof document !== "undefined";
typeof WorkerGlobalScope !== "undefined" && globalThis instanceof WorkerGlobalScope;
var isDef = (val) => typeof val !== "undefined";
var notNullish = (val) => val != null;
var toString = Object.prototype.toString;
var isObject = (val) => toString.call(val) === "[object Object]";
var timestamp = () => +Date.now();
var noop = () => {};
var hasOwn = (val, key) => Object.prototype.hasOwnProperty.call(val, key);
var isIOS = /* @__PURE__ */ getIsIOS();
function getIsIOS() {
var _window, _window2, _window3;
return isClient && !!((_window = window) === null || _window === void 0 || (_window = _window.navigator) === null || _window === void 0 ? void 0 : _window.userAgent) && (/iP(?:ad|hone|od)/.test(window.navigator.userAgent) || ((_window2 = window) === null || _window2 === void 0 || (_window2 = _window2.navigator) === null || _window2 === void 0 ? void 0 : _window2.maxTouchPoints) > 2 && /iPad|Macintosh/.test((_window3 = window) === null || _window3 === void 0 ? void 0 : _window3.navigator.userAgent));
}
function toRef(...args) {
if (args.length !== 1) return (0, vue.toRef)(...args);
const r = args[0];
return typeof r === "function" ? (0, vue.readonly)((0, vue.customRef)(() => ({
get: r,
set: noop
}))) : (0, vue.ref)(r);
}
/**
* @internal
*/
function createFilterWrapper(filter, fn) {
function wrapper(...args) {
return new Promise((resolve, reject) => {
Promise.resolve(filter(() => fn.apply(this, args), {
fn,
thisArg: this,
args
})).then(resolve).catch(reject);
});
}
return wrapper;
}
var bypassFilter = (invoke$1) => {
return invoke$1();
};
function throttleFilter(...args) {
let lastExec = 0;
let timer;
let isLeading = true;
let lastRejector = noop;
let lastValue;
let ms;
let trailing;
let leading;
let rejectOnCancel;
if (!(0, vue.isRef)(args[0]) && typeof args[0] === "object") ({delay: ms, trailing = true, leading = true, rejectOnCancel = false} = args[0]);
else [ms, trailing = true, leading = true, rejectOnCancel = false] = args;
const clear = () => {
if (timer) {
clearTimeout(timer);
timer = void 0;
lastRejector();
lastRejector = noop;
}
};
const filter = (_invoke) => {
const duration = (0, vue.toValue)(ms);
const elapsed = Date.now() - lastExec;
const invoke$1 = () => {
return lastValue = _invoke();
};
clear();
if (duration <= 0) {
lastExec = Date.now();
return invoke$1();
}
if (elapsed > duration) {
lastExec = Date.now();
if (leading || !isLeading) invoke$1();
} else if (trailing) lastValue = new Promise((resolve, reject) => {
lastRejector = rejectOnCancel ? reject : resolve;
timer = setTimeout(() => {
lastExec = Date.now();
isLeading = true;
resolve(invoke$1());
clear();
}, Math.max(0, duration - elapsed));
});
if (!leading && !timer) timer = setTimeout(() => isLeading = true, duration);
isLeading = false;
return lastValue;
};
return filter;
}
/**
* EventFilter that gives extra controls to pause and resume the filter
*
* @param extendFilter Extra filter to apply when the PausableFilter is active, default to none
* @param options Options to configure the filter
*/
function pausableFilter(extendFilter = bypassFilter, options = {}) {
const { initialState = "active" } = options;
const isActive = toRef(initialState === "active");
function pause() {
isActive.value = false;
}
function resume() {
isActive.value = true;
}
const eventFilter = (...args) => {
if (isActive.value) extendFilter(...args);
};
return {
isActive: (0, vue.readonly)(isActive),
pause,
resume,
eventFilter
};
}
function increaseWithUnit(target, delta) {
var _target$match;
if (typeof target === "number") return target + delta;
const value = ((_target$match = target.match(/^-?\d+\.?\d*/)) === null || _target$match === void 0 ? void 0 : _target$match[0]) || "";
const unit = target.slice(value.length);
const result = Number.parseFloat(value) + delta;
if (Number.isNaN(result)) return target;
return result + unit;
}
/**
* Get a px value for SSR use, do not rely on this method outside of SSR as REM unit is assumed at 16px, which might not be the case on the client
*/
function pxValue(px) {
return px.endsWith("rem") ? Number.parseFloat(px) * 16 : Number.parseFloat(px);
}
function toArray(value) {
return Array.isArray(value) ? value : [value];
}
function cacheStringFunction(fn) {
const cache = Object.create(null);
return ((str) => {
return cache[str] || (cache[str] = fn(str));
});
}
var hyphenateRE = /\B([A-Z])/g;
cacheStringFunction((str) => str.replace(hyphenateRE, "-$1").toLowerCase());
var camelizeRE = /-(\w)/g;
var camelize = cacheStringFunction((str) => {
return str.replace(camelizeRE, (_, c) => c ? c.toUpperCase() : "");
});
function getLifeCycleTarget(target) {
return target || (0, vue.getCurrentInstance)();
}
/**
* Make a composable function usable with multiple Vue instances.
*
* @see https://vueuse.org/createSharedComposable
*
* @__NO_SIDE_EFFECTS__
*/
function createSharedComposable(composable) {
if (!isClient) return composable;
let subscribers = 0;
let state;
let scope;
const dispose = () => {
subscribers -= 1;
if (scope && subscribers <= 0) {
scope.stop();
state = void 0;
scope = void 0;
}
};
return ((...args) => {
subscribers += 1;
if (!scope) {
scope = (0, vue.effectScope)(true);
state = scope.run(() => composable(...args));
}
tryOnScopeDispose(dispose);
return state;
});
}
/* @__NO_SIDE_EFFECTS__ */
function makeDestructurable(obj, arr) {
if (typeof Symbol !== "undefined") {
const clone = { ...obj };
Object.defineProperty(clone, Symbol.iterator, {
enumerable: false,
value() {
let index = 0;
return { next: () => ({
value: arr[index++],
done: index > arr.length
}) };
}
});
return clone;
} else return Object.assign([...arr], obj);
}
/**
* Converts ref to reactive.
*
* @see https://vueuse.org/toReactive
* @param objectRef A ref of object
*/
function toReactive(objectRef) {
if (!(0, vue.isRef)(objectRef)) return (0, vue.reactive)(objectRef);
return (0, vue.reactive)(new Proxy({}, {
get(_, p, receiver) {
return (0, vue.unref)(Reflect.get(objectRef.value, p, receiver));
},
set(_, p, value) {
if ((0, vue.isRef)(objectRef.value[p]) && !(0, vue.isRef)(value)) objectRef.value[p].value = value;
else objectRef.value[p] = value;
return true;
},
deleteProperty(_, p) {
return Reflect.deleteProperty(objectRef.value, p);
},
has(_, p) {
return Reflect.has(objectRef.value, p);
},
ownKeys() {
return Object.keys(objectRef.value);
},
getOwnPropertyDescriptor() {
return {
enumerable: true,
configurable: true
};
}
}));
}
/**
* Computed reactive object.
*/
function reactiveComputed(fn) {
return toReactive((0, vue.computed)(fn));
}
/**
* Reactively omit fields from a reactive object
*
* @see https://vueuse.org/reactiveOmit
*/
function reactiveOmit(obj, ...keys) {
const flatKeys = keys.flat();
const predicate = flatKeys[0];
return reactiveComputed(() => typeof predicate === "function" ? Object.fromEntries(Object.entries((0, vue.toRefs)(obj)).filter(([k, v]) => !predicate((0, vue.toValue)(v), k))) : Object.fromEntries(Object.entries((0, vue.toRefs)(obj)).filter((e) => !flatKeys.includes(e[0]))));
}
/**
* Throttle execution of a function. Especially useful for rate limiting
* execution of handlers on events like resize and scroll.
*
* @param fn A function to be executed after delay milliseconds. The `this` context and all arguments are passed through, as-is,
* to `callback` when the throttled-function is executed.
* @param ms A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher) are most useful.
* (default value: 200)
*
* @param [trailing] if true, call fn again after the time is up (default value: false)
*
* @param [leading] if true, call fn on the leading edge of the ms timeout (default value: true)
*
* @param [rejectOnCancel] if true, reject the last call if it's been cancel (default value: false)
*
* @return A new, throttled, function.
*
* @__NO_SIDE_EFFECTS__
*/
function useThrottleFn(fn, ms = 200, trailing = false, leading = true, rejectOnCancel = false) {
return createFilterWrapper(throttleFilter(ms, trailing, leading, rejectOnCancel), fn);
}
function watchWithFilter(source, cb, options = {}) {
const { eventFilter = bypassFilter, ...watchOptions } = options;
return (0, vue.watch)(source, createFilterWrapper(eventFilter, cb), watchOptions);
}
/** @deprecated Use Vue's built-in `watch` instead. This function will be removed in future version. */
function watchPausable(source, cb, options = {}) {
const { eventFilter: filter, initialState = "active", ...watchOptions } = options;
const { eventFilter, pause, resume, isActive } = pausableFilter(filter, { initialState });
return {
stop: watchWithFilter(source, cb, {
...watchOptions,
eventFilter
}),
pause,
resume,
isActive
};
}
/**
* Two-way refs synchronization.
* From the set theory perspective to restrict the option's type
* Check in the following order:
* 1. L = R
* 2. L ∩ R ≠ ∅
* 3. L ⊆ R
* 4. L ∩ R = ∅
*/
function syncRef(left, right, ...[options]) {
const { flush = "sync", deep = false, immediate = true, direction = "both", transform = {} } = options || {};
const watchers = [];
const transformLTR = "ltr" in transform && transform.ltr || ((v) => v);
const transformRTL = "rtl" in transform && transform.rtl || ((v) => v);
if (direction === "both" || direction === "ltr") watchers.push(watchPausable(left, (newValue) => {
watchers.forEach((w) => w.pause());
right.value = transformLTR(newValue);
watchers.forEach((w) => w.resume());
}, {
flush,
deep,
immediate
}));
if (direction === "both" || direction === "rtl") watchers.push(watchPausable(right, (newValue) => {
watchers.forEach((w) => w.pause());
left.value = transformRTL(newValue);
watchers.forEach((w) => w.resume());
}, {
flush,
deep,
immediate
}));
const stop = () => {
watchers.forEach((w) => w.stop());
};
return stop;
}
/**
* Call onBeforeUnmount() if it's inside a component lifecycle, if not, do nothing
*
* @param fn
* @param target
*/
function tryOnBeforeUnmount(fn, target) {
if (getLifeCycleTarget(target)) (0, vue.onBeforeUnmount)(fn, target);
}
/**
* Call onMounted() if it's inside a component lifecycle, if not, just call the function
*
* @param fn
* @param sync if set to false, it will run in the nextTick() of Vue
* @param target
*/
function tryOnMounted(fn, sync = true, target) {
if (getLifeCycleTarget(target)) (0, vue.onMounted)(fn, target);
else if (sync) fn();
else (0, vue.nextTick)(fn);
}
/**
* Wrapper for `setInterval` with controls
*
* @see https://vueuse.org/useIntervalFn
* @param cb
* @param interval
* @param options
*/
function useIntervalFn(cb, interval = 1e3, options = {}) {
const { immediate = true, immediateCallback = false } = options;
let timer = null;
const isActive = (0, vue.shallowRef)(false);
function clean() {
if (timer) {
clearInterval(timer);
timer = null;
}
}
function pause() {
isActive.value = false;
clean();
}
function resume() {
const intervalValue = (0, vue.toValue)(interval);
if (intervalValue <= 0) return;
isActive.value = true;
if (immediateCallback) cb();
clean();
if (isActive.value) timer = setInterval(cb, intervalValue);
}
if (immediate && isClient) resume();
if ((0, vue.isRef)(interval) || typeof interval === "function") tryOnScopeDispose((0, vue.watch)(interval, () => {
if (isActive.value && isClient) resume();
}));
tryOnScopeDispose(pause);
return {
isActive: (0, vue.shallowReadonly)(isActive),
pause,
resume
};
}
/**
* Reactively convert a string ref to number.
*
* @__NO_SIDE_EFFECTS__
*/
function useToNumber(value, options = {}) {
const { method = "parseFloat", radix, nanToZero } = options;
return (0, vue.computed)(() => {
let resolved = (0, vue.toValue)(value);
if (typeof method === "function") resolved = method(resolved);
else if (typeof resolved === "string") resolved = Number[method](resolved, radix);
if (nanToZero && Number.isNaN(resolved)) resolved = 0;
return resolved;
});
}
/**
* Shorthand for watching value with {immediate: true}
*
* @see https://vueuse.org/watchImmediate
*/
function watchImmediate(source, cb, options) {
return (0, vue.watch)(source, cb, {
...options,
immediate: true
});
}
//#endregion
//#region ../../node_modules/.pnpm/@vueuse+core@14.2.1_vue@3.5.31_typescript@5.9.3_/node_modules/@vueuse/core/dist/index.js
/**
* This function creates `define` and `reuse` components in pair,
* It also allow to pass a generic to bind with type.
*
* @see https://vueuse.org/createReusableTemplate
*
* @__NO_SIDE_EFFECTS__
*/
function createReusableTemplate(options = {}) {
const { inheritAttrs = true } = options;
const render = (0, vue.shallowRef)();
const define = (0, vue.defineComponent)({ setup(_, { slots }) {
return () => {
render.value = slots.default;
};
} });
const reuse = (0, vue.defineComponent)({
inheritAttrs,
props: options.props,
setup(props, { attrs, slots }) {
return () => {
var _render$value;
if (!render.value && true) throw new Error("[VueUse] Failed to find the definition of reusable template");
const vnode = (_render$value = render.value) === null || _render$value === void 0 ? void 0 : _render$value.call(render, {
...options.props == null ? keysToCamelKebabCase(attrs) : props,
$slots: slots
});
return inheritAttrs && (vnode === null || vnode === void 0 ? void 0 : vnode.length) === 1 ? vnode[0] : vnode;
};
}
});
return /* @__PURE__ */ makeDestructurable({
define,
reuse
}, [define, reuse]);
}
function keysToCamelKebabCase(obj) {
const newObj = {};
for (const key in obj) newObj[camelize(key)] = obj[key];
return newObj;
}
var defaultWindow = isClient ? window : void 0;
var defaultDocument = isClient ? window.document : void 0;
isClient && window.navigator;
isClient && window.location;
/**
* Get the dom element of a ref of element or Vue component instance
*
* @param elRef
*/
function unrefElement(elRef) {
var _$el;
const plain = (0, vue.toValue)(elRef);
return (_$el = plain === null || plain === void 0 ? void 0 : plain.$el) !== null && _$el !== void 0 ? _$el : plain;
}
function useEventListener(...args) {
const register = (el, event, listener, options) => {
el.addEventListener(event, listener, options);
return () => el.removeEventListener(event, listener, options);
};
const firstParamTargets = (0, vue.computed)(() => {
const test = toArray((0, vue.toValue)(args[0])).filter((e) => e != null);
return test.every((e) => typeof e !== "string") ? test : void 0;
});
return watchImmediate(() => {
var _firstParamTargets$va, _firstParamTargets$va2;
return [
(_firstParamTargets$va = (_firstParamTargets$va2 = firstParamTargets.value) === null || _firstParamTargets$va2 === void 0 ? void 0 : _firstParamTargets$va2.map((e) => unrefElement(e))) !== null && _firstParamTargets$va !== void 0 ? _firstParamTargets$va : [defaultWindow].filter((e) => e != null),
toArray((0, vue.toValue)(firstParamTargets.value ? args[1] : args[0])),
toArray((0, vue.unref)(firstParamTargets.value ? args[2] : args[1])),
(0, vue.toValue)(firstParamTargets.value ? args[3] : args[2])
];
}, ([raw_targets, raw_events, raw_listeners, raw_options], _, onCleanup) => {
if (!(raw_targets === null || raw_targets === void 0 ? void 0 : raw_targets.length) || !(raw_events === null || raw_events === void 0 ? void 0 : raw_events.length) || !(raw_listeners === null || raw_listeners === void 0 ? void 0 : raw_listeners.length)) return;
const optionsClone = isObject(raw_options) ? { ...raw_options } : raw_options;
const cleanups = raw_targets.flatMap((el) => raw_events.flatMap((event) => raw_listeners.map((listener) => register(el, event, listener, optionsClone))));
onCleanup(() => {
cleanups.forEach((fn) => fn());
});
}, { flush: "post" });
}
var _iOSWorkaround = false;
function onClickOutside(target, handler, options = {}) {
const { window: window$1 = defaultWindow, ignore = [], capture = true, detectIframe = false, controls = false } = options;
if (!window$1) return controls ? {
stop: noop,
cancel: noop,
trigger: noop
} : noop;
if (isIOS && !_iOSWorkaround) {
_iOSWorkaround = true;
const listenerOptions = { passive: true };
Array.from(window$1.document.body.children).forEach((el) => el.addEventListener("click", noop, listenerOptions));
window$1.document.documentElement.addEventListener("click", noop, listenerOptions);
}
let shouldListen = true;
const shouldIgnore = (event) => {
return (0, vue.toValue)(ignore).some((target$1) => {
if (typeof target$1 === "string") return Array.from(window$1.document.querySelectorAll(target$1)).some((el) => el === event.target || event.composedPath().includes(el));
else {
const el = unrefElement(target$1);
return el && (event.target === el || event.composedPath().includes(el));
}
});
};
/**
* Determines if the given target has multiple root elements.
* Referenced from: https://github.com/vuejs/test-utils/blob/ccb460be55f9f6be05ab708500a41ec8adf6f4bc/src/vue-wrapper.ts#L21
*/
function hasMultipleRoots(target$1) {
const vm = (0, vue.toValue)(target$1);
return vm && vm.$.subTree.shapeFlag === 16;
}
function checkMultipleRoots(target$1, event) {
const vm = (0, vue.toValue)(target$1);
const children = vm.$.subTree && vm.$.subTree.children;
if (children == null || !Array.isArray(children)) return false;
return children.some((child) => child.el === event.target || event.composedPath().includes(child.el));
}
const listener = (event) => {
const el = unrefElement(target);
if (event.target == null) return;
if (!(el instanceof Element) && hasMultipleRoots(target) && checkMultipleRoots(target, event)) return;
if (!el || el === event.target || event.composedPath().includes(el)) return;
if ("detail" in event && event.detail === 0) shouldListen = !shouldIgnore(event);
if (!shouldListen) {
shouldListen = true;
return;
}
handler(event);
};
let isProcessingClick = false;
const cleanup = [
useEventListener(window$1, "click", (event) => {
if (!isProcessingClick) {
isProcessingClick = true;
setTimeout(() => {
isProcessingClick = false;
}, 0);
listener(event);
}
}, {
passive: true,
capture
}),
useEventListener(window$1, "pointerdown", (e) => {
const el = unrefElement(target);
shouldListen = !shouldIgnore(e) && !!(el && !e.composedPath().includes(el));
}, { passive: true }),
detectIframe && useEventListener(window$1, "blur", (event) => {
setTimeout(() => {
var _window$document$acti;
const el = unrefElement(target);
if (((_window$document$acti = window$1.document.activeElement) === null || _window$document$acti === void 0 ? void 0 : _window$document$acti.tagName) === "IFRAME" && !(el === null || el === void 0 ? void 0 : el.contains(window$1.document.activeElement))) handler(event);
}, 0);
}, { passive: true })
].filter(Boolean);
const stop = () => cleanup.forEach((fn) => fn());
if (controls) return {
stop,
cancel: () => {
shouldListen = false;
},
trigger: (event) => {
shouldListen = true;
listener(event);
shouldListen = false;
}
};
return stop;
}
/**
* Mounted state in ref.
*
* @see https://vueuse.org/useMounted
*
* @__NO_SIDE_EFFECTS__
*/
function useMounted() {
const isMounted = (0, vue.shallowRef)(false);
const instance = (0, vue.getCurrentInstance)();
if (instance) (0, vue.onMounted)(() => {
isMounted.value = true;
}, instance);
return isMounted;
}
/* @__NO_SIDE_EFFECTS__ */
function useSupported(callback) {
const isMounted = useMounted();
return (0, vue.computed)(() => {
isMounted.value;
return Boolean(callback());
});
}
/**
* Watch for changes being made to the DOM tree.
*
* @see https://vueuse.org/useMutationObserver
* @see https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver MutationObserver MDN
* @param target
* @param callback
* @param options
*/
function useMutationObserver(target, callback, options = {}) {
const { window: window$1 = defaultWindow, ...mutationOptions } = options;
let observer;
const isSupported = /* @__PURE__ */ useSupported(() => window$1 && "MutationObserver" in window$1);
const cleanup = () => {
if (observer) {
observer.disconnect();
observer = void 0;
}
};
const stopWatch = (0, vue.watch)((0, vue.computed)(() => {
const items = toArray((0, vue.toValue)(target)).map(unrefElement).filter(notNullish);
return new Set(items);
}), (newTargets) => {
cleanup();
if (isSupported.value && newTargets.size) {
observer = new MutationObserver(callback);
newTargets.forEach((el) => observer.observe(el, mutationOptions));
}
}, {
immediate: true,
flush: "post"
});
const takeRecords = () => {
return observer === null || observer === void 0 ? void 0 : observer.takeRecords();
};
const stop = () => {
stopWatch();
cleanup();
};
tryOnScopeDispose(stop);
return {
isSupported,
stop,
takeRecords
};
}
/**
* Fires when the element or any element containing it is removed.
*
* @param target
* @param callback
* @param options
*/
function onElementRemoval(target, callback, options = {}) {
const { window: window$1 = defaultWindow, document: document$1 = window$1 === null || window$1 === void 0 ? void 0 : window$1.document, flush = "sync" } = options;
if (!window$1 || !document$1) return noop;
let stopFn;
const cleanupAndUpdate = (fn) => {
stopFn === null || stopFn === void 0 || stopFn();
stopFn = fn;
};
const stopWatch = (0, vue.watchEffect)(() => {
const el = unrefElement(target);
if (el) {
const { stop } = useMutationObserver(document$1, (mutationsList) => {
if (mutationsList.map((mutation) => [...mutation.removedNodes]).flat().some((node) => node === el || node.contains(el))) callback(mutationsList);
}, {
window: window$1,
childList: true,
subtree: true
});
cleanupAndUpdate(stop);
}
}, { flush });
const stopHandle = () => {
stopWatch();
cleanupAndUpdate();
};
tryOnScopeDispose(stopHandle);
return stopHandle;
}
function createKeyPredicate(keyFilter) {
if (typeof keyFilter === "function") return keyFilter;
else if (typeof keyFilter === "string") return (event) => event.key === keyFilter;
else if (Array.isArray(keyFilter)) return (event) => keyFilter.includes(event.key);
return () => true;
}
function onKeyStroke(...args) {
let key;
let handler;
let options = {};
if (args.length === 3) {
key = args[0];
handler = args[1];
options = args[2];
} else if (args.length === 2) if (typeof args[1] === "object") {
key = true;
handler = args[0];
options = args[1];
} else {
key = args[0];
handler = args[1];
}
else {
key = true;
handler = args[0];
}
const { target = defaultWindow, eventName = "keydown", passive = false, dedupe = false } = options;
const predicate = createKeyPredicate(key);
const listener = (e) => {
if (e.repeat && (0, vue.toValue)(dedupe)) return;
if (predicate(e)) handler(e);
};
return useEventListener(target, eventName, listener, passive);
}
/**
* Call function on every `requestAnimationFrame`. With controls of pausing and resuming.
*
* @see https://vueuse.org/useRafFn
* @param fn
* @param options
*/
function useRafFn(fn, options = {}) {
const { immediate = true, fpsLimit = null, window: window$1 = defaultWindow, once = false } = options;
const isActive = (0, vue.shallowRef)(false);
const intervalLimit = (0, vue.computed)(() => {
const limit = (0, vue.toValue)(fpsLimit);
return limit ? 1e3 / limit : null;
});
let previousFrameTimestamp = 0;
let rafId = null;
function loop(timestamp$1) {
if (!isActive.value || !window$1) return;
if (!previousFrameTimestamp) previousFrameTimestamp = timestamp$1;
const delta = timestamp$1 - previousFrameTimestamp;
if (intervalLimit.value && delta < intervalLimit.value) {
rafId = window$1.requestAnimationFrame(loop);
return;
}
previousFrameTimestamp = timestamp$1;
fn({
delta,
timestamp: timestamp$1
});
if (once) {
isActive.value = false;
rafId = null;
return;
}
rafId = window$1.requestAnimationFrame(loop);
}
function resume() {
if (!isActive.value && window$1) {
isActive.value = true;
previousFrameTimestamp = 0;
rafId = window$1.requestAnimationFrame(loop);
}
}
function pause() {
isActive.value = false;
if (rafId != null && window$1) {
window$1.cancelAnimationFrame(rafId);
rafId = null;
}
}
if (immediate) resume();
tryOnScopeDispose(pause);
return {
isActive: (0, vue.readonly)(isActive),
pause,
resume
};
}
var ssrWidthSymbol = Symbol("vueuse-ssr-width");
/* @__NO_SIDE_EFFECTS__ */
function useSSRWidth() {
const ssrWidth = (0, vue.hasInjectionContext)() ? injectLocal(ssrWidthSymbol, null) : null;
return typeof ssrWidth === "number" ? ssrWidth : void 0;
}
/**
* Reactive Media Query.
*
* @see https://vueuse.org/useMediaQuery
* @param query
* @param options
*/
function useMediaQuery(query, options = {}) {
const { window: window$1 = defaultWindow, ssrWidth = /* @__PURE__ */ useSSRWidth() } = options;
const isSupported = /* @__PURE__ */ useSupported(() => window$1 && "matchMedia" in window$1 && typeof window$1.matchMedia === "function");
const ssrSupport = (0, vue.shallowRef)(typeof ssrWidth === "number");
const mediaQuery = (0, vue.shallowRef)();
const matches = (0, vue.shallowRef)(false);
const handler = (event) => {
matches.value = event.matches;
};
(0, vue.watchEffect)(() => {
if (ssrSupport.value) {
ssrSupport.value = !isSupported.value;
matches.value = (0, vue.toValue)(query).split(",").some((queryString) => {
const not = queryString.includes("not all");
const minWidth = queryString.match(/\(\s*min-width:\s*(-?\d+(?:\.\d*)?[a-z]+\s*)\)/);
const maxWidth = queryString.match(/\(\s*max-width:\s*(-?\d+(?:\.\d*)?[a-z]+\s*)\)/);
let res = Boolean(minWidth || maxWidth);
if (minWidth && res) res = ssrWidth >= pxValue(minWidth[1]);
if (maxWidth && res) res = ssrWidth <= pxValue(maxWidth[1]);
return not ? !res : res;
});
return;
}
if (!isSupported.value) return;
mediaQuery.value = window$1.matchMedia((0, vue.toValue)(query));
matches.value = mediaQuery.value.matches;
});
useEventListener(mediaQuery, "change", handler, { passive: true });
return (0, vue.computed)(() => matches.value);
}
/**
* Breakpoints from Bootstrap V5
*
* @see https://getbootstrap.com/docs/5.0/layout/breakpoints
*/
var breakpointsBootstrapV5 = {
xs: 0,
sm: 576,
md: 768,
lg: 992,
xl: 1200,
xxl: 1400
};
/**
* Reactively viewport breakpoints
*
* @see https://vueuse.org/useBreakpoints
*
* @__NO_SIDE_EFFECTS__
*/
function useBreakpoints(breakpoints, options = {}) {
function getValue$1(k, delta) {
let v = (0, vue.toValue)(breakpoints[(0, vue.toValue)(k)]);
if (delta != null) v = increaseWithUnit(v, delta);
if (typeof v === "number") v = `${v}px`;
return v;
}
const { window: window$1 = defaultWindow, strategy = "min-width", ssrWidth = /* @__PURE__ */ useSSRWidth() } = options;
const ssrSupport = typeof ssrWidth === "number";
const mounted = ssrSupport ? (0, vue.shallowRef)(false) : { value: true };
if (ssrSupport) tryOnMounted(() => mounted.value = !!window$1);
function match(query, size) {
if (!mounted.value && ssrSupport) return query === "min" ? ssrWidth >= pxValue(size) : ssrWidth <= pxValue(size);
if (!window$1) return false;
return window$1.matchMedia(`(${query}-width: ${size})`).matches;
}
const greaterOrEqual = (k) => {
return useMediaQuery(() => `(min-width: ${getValue$1(k)})`, options);
};
const smallerOrEqual = (k) => {
return useMediaQuery(() => `(max-width: ${getValue$1(k)})`, options);
};
const shortcutMethods = Object.keys(breakpoints).reduce((shortcuts, k) => {
Object.defineProperty(shortcuts, k, {
get: () => strategy === "min-width" ? greaterOrEqual(k) : smallerOrEqual(k),
enumerable: true,
configurable: true
});
return shortcuts;
}, {});
function current() {
const points = Object.keys(breakpoints).map((k) => [
k,
shortcutMethods[k],
pxValue(getValue$1(k))
]).sort((a, b) => a[2] - b[2]);
return (0, vue.computed)(() => points.filter(([, v]) => v.value).map(([k]) => k));
}
return Object.assign(shortcutMethods, {
greaterOrEqual,
smallerOrEqual,
greater(k) {
return useMediaQuery(() => `(min-width: ${getValue$1(k, .1)})`, options);
},
smaller(k) {
return useMediaQuery(() => `(max-width: ${getValue$1(k, -.1)})`, options);
},
between(a, b) {
return useMediaQuery(() => `(min-width: ${getValue$1(a)}) and (max-width: ${getValue$1(b, -.1)})`, options);
},
isGreater(k) {
return match("min", getValue$1(k, .1));
},
isGreaterOrEqual(k) {
return match("min", getValue$1(k));
},
isSmaller(k) {
return match("max", getValue$1(k, -.1));
},
isSmallerOrEqual(k) {
return match("max", getValue$1(k));
},
isInBetween(a, b) {
return match("min", getValue$1(a)) && match("max", getValue$1(b, -.1));
},
current,
active() {
const bps = current();
return (0, vue.computed)(() => bps.value.length === 0 ? "" : bps.value.at(strategy === "min-width" ? -1 : 0));
}
});
}
function cloneFnJSON(source) {
return JSON.parse(JSON.stringify(source));
}
var _global = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
var globalKey = "__vueuse_ssr_handlers__";
var handlers = /* @__PURE__ */ getHandlers();
function getHandlers() {
if (!(globalKey in _global)) _global[globalKey] = _global[globalKey] || {};
return _global[globalKey];
}
function getSSRHandler(key, fallback) {
return handlers[key] || fallback;
}
/**
* Reactive dark theme preference.
*
* @see https://vueuse.org/usePreferredDark
* @param [options]
*
* @__NO_SIDE_EFFECTS__
*/
function usePreferredDark(options) {
return useMediaQuery("(prefers-color-scheme: dark)", options);
}
function guessSerializerType(rawInit) {
return rawInit == null ? "any" : rawInit instanceof Set ? "set" : rawInit instanceof Map ? "map" : rawInit instanceof Date ? "date" : typeof rawInit === "boolean" ? "boolean" : typeof rawInit === "string" ? "string" : typeof rawInit === "object" ? "object" : !Number.isNaN(rawInit) ? "number" : "any";
}
var StorageSerializers = {
boolean: {
read: (v) => v === "true",
write: (v) => String(v)
},
object: {
read: (v) => JSON.parse(v),
write: (v) => JSON.stringify(v)
},
number: {
read: (v) => Number.parseFloat(v),
write: (v) => String(v)
},
any: {
read: (v) => v,
write: (v) => String(v)
},
string: {
read: (v) => v,
write: (v) => String(v)
},
map: {
read: (v) => new Map(JSON.parse(v)),
write: (v) => JSON.stringify(Array.from(v.entries()))
},
set: {
read: (v) => new Set(JSON.parse(v)),
write: (v) => JSON.stringify(Array.from(v))
},
date: {
read: (v) => new Date(v),
write: (v) => v.toISOString()
}
};
var customStorageEventName = "vueuse-storage";
/**
* Reactive LocalStorage/SessionStorage.
*
* @see https://vueuse.org/useStorage
*/
function useStorage(key, defaults$1, storage, options = {}) {
var _options$serializer;
const { flush = "pre", deep = true, listenToStorageChanges = true, writeDefaults = true, mergeDefaults = false, shallow, window: window$1 = defaultWindow, eventFilter, onError = (e) => {
console.error(e);
}, initOnMounted } = options;
const data = (shallow ? vue.shallowRef : vue.ref)(typeof defaults$1 === "function" ? defaults$1() : defaults$1);
const keyComputed = (0, vue.computed)(() => (0, vue.toValue)(key));
if (!storage) try {
storage = getSSRHandler("getDefaultStorage", () => defaultWindow === null || defaultWindow === void 0 ? void 0 : defaultWindow.localStorage)();
} catch (e) {
onError(e);
}
if (!storage) return data;
const rawInit = (0, vue.toValue)(defaults$1);
const type = guessSerializerType(rawInit);
const serializer = (_options$serializer = options.serializer) !== null && _options$serializer !== void 0 ? _options$serializer : StorageSerializers[type];
const { pause: pauseWatch, resume: resumeWatch } = watchPausable(data, (newValue) => write(newValue), {
flush,
deep,
eventFilter
});
(0, vue.watch)(keyComputed, () => update(), { flush });
let firstMounted = false;
const onStorageEvent = (ev) => {
if (initOnMounted && !firstMounted) return;
update(ev);
};
const onStorageCustomEvent = (ev) => {
if (initOnMounted && !firstMounted) return;
updateFromCustomEvent(ev);
};
/**
* The custom event is needed for same-document syncing when using custom
* storage backends, but it doesn't work across different documents.
*
* TODO: Consider implementing a BroadcastChannel-based solution that fixes this.
*/
if (window$1 && listenToStorageChanges) if (storage instanceof Storage) useEventListener(window$1, "storage", onStorageEvent, { passive: true });
else useEventListener(window$1, customStorageEventName, onStorageCustomEvent);
if (initOnMounted) tryOnMounted(() => {
firstMounted = true;
update();
});
else update();
function dispatchWriteEvent(oldValue, newValue) {
if (window$1) {
const payload = {
key: keyComputed.value,
oldValue,
newValue,
storageArea: storage
};
window$1.dispatchEvent(storage instanceof Storage ? new StorageEvent("storage", payload) : new CustomEvent(customStorageEventName, { detail: payload }));
}
}
function write(v) {
try {
const oldValue = storage.getItem(keyComputed.value);
if (v == null) {
dispatchWriteEvent(oldValue, null);
storage.removeItem(keyComputed.value);
} else {
const serialized = serializer.write(v);
if (oldValue !== serialized) {
storage.setItem(keyComputed.value, serialized);
dispatchWriteEvent(oldValue, serialized);
}
}
} catch (e) {
onError(e);
}
}
function read(event) {
const rawValue = event ? event.newValue : storage.getItem(keyComputed.value);
if (rawValue == null) {
if (writeDefaults && rawInit != null) storage.setItem(keyComputed.value, serializer.write(rawInit));
return rawInit;
} else if (!event && mergeDefaults) {
const value = serializer.read(rawValue);
if (typeof mergeDefaults === "function") return mergeDefaults(value, rawInit);
else if (type === "object" && !Array.isArray(value)) return {
...rawInit,
...value
};
return value;
} else if (typeof rawValue !== "string") return rawValue;
else return serializer.read(rawValue);
}
function update(event) {
if (event && event.storageArea !== storage) return;
if (event && event.key == null) {
data.value = rawInit;
return;
}
if (event && event.key !== keyComputed.value) return;
pauseWatch();
try {
const serializedData = serializer.write(data.value);
if (event === void 0 || (event === null || event === void 0 ? void 0 : event.newValue) !== serializedData) data.value = read(event);
} catch (e) {
onError(e);
} finally {
if (event) (0, vue.nextTick)(resumeWatch);
else resumeWatch();
}
}
function updateFromCustomEvent(event) {
update(event.detail);
}
return data;
}
var CSS_DISABLE_TRANS = "*,*::before,*::after{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}";
/**
* Reactive color mode with auto data persistence.
*
* @see https://vueuse.org/useColorMode
* @param options
*/
function useColorMode(options = {}) {
const { selector = "html", attribute = "class", initialValue = "auto", window: window$1 = defaultWindow, storage, storageKey = "vueuse-color-scheme", listenToStorageChanges = true, storageRef, emitAuto, disableTransition = true } = options;
const modes = {
auto: "",
light: "light",
dark: "dark",
...options.modes || {}
};
const preferredDark = usePreferredDark({ window: window$1 });
const system = (0, vue.computed)(() => preferredDark.value ? "dark" : "light");
const store = storageRef || (storageKey == null ? toRef(initialValue) : useStorage(storageKey, initialValue, storage, {
window: window$1,
listenToStorageChanges
}));
const state = (0, vue.computed)(() => store.value === "auto" ? system.value : store.value);
const updateHTMLAttrs = getSSRHandler("updateHTMLAttrs", (selector$1, attribute$1, value) => {
const el = typeof selector$1 === "string" ? window$1 === null || window$1 === void 0 ? void 0 : window$1.document.querySelector(selector$1) : unrefElement(selector$1);
if (!el) return;
const classesToAdd = /* @__PURE__ */ new Set();
const classesToRemove = /* @__PURE__ */ new Set();
let attributeToChange = null;
if (attribute$1 === "class") {
const current = value.split(/\s/g);
Object.values(modes).flatMap((i) => (i || "").split(/\s/g)).filter(Boolean).forEach((v) => {
if (current.includes(v)) classesToAdd.add(v);
else classesToRemove.add(v);
});
} else attributeToChange = {
key: attribute$1,
value
};
if (classesToAdd.size === 0 && classesToRemove.size === 0 && attributeToChange === null) return;
let style;
if (disableTransition) {
style = window$1.document.createElement("style");
style.appendChild(document.createTextNode(CSS_DISABLE_TRANS));
window$1.document.head.appendChild(style);
}
for (const c of classesToAdd) el.classList.add(c);
for (const c of classesToRemove) el.classList.remove(c);
if (attributeToChange) el.setAttribute(attributeToChange.key, attributeToChange.value);
if (disableTransition) {
window$1.getComputedStyle(style).opacity;
document.head.removeChild(style);
}
});
function defaultOnChanged(mode) {
var _modes$mode;
updateHTMLAttrs(selector, attribute, (_modes$mode = modes[mode]) !== null && _modes$mode !== void 0 ? _modes$mode : mode);
}
function onChanged(mode) {
if (options.onChanged) options.onChanged(mode, defaultOnChanged);
else defaultOnChanged(mode);
}
(0, vue.watch)(state, onChanged, {
flush: "post",
immediate: true
});
tryOnMounted(() => onChanged(state.value));
const auto = (0, vue.computed)({
get() {
return emitAuto ? store.value : state.value;
},
set(v) {
store.value = v;
}
});
return Object.assign(auto, {
store,
system,
state
});
}
/**
* Reactively track `document.visibilityState`.
*
* @see https://vueuse.org/useDocumentVisibility
*
* @__NO_SIDE_EFFECTS__
*/
function useDocumentVisibility(options = {}) {
const { document: document$1 = defaultDocument } = options;
if (!document$1) return (0, vue.shallowRef)("visible");
const visibility = (0, vue.shallowRef)(document$1.visibilityState);
useEventListener(document$1, "visibilitychange", () => {
visibility.value = document$1.visibilityState;
}, { passive: true });
return visibility;
}
function useDropZone(target, options = {}) {
const isOverDropZone = (0, vue.shallowRef)(false);
const files = (0, vue.shallowRef)(null);
let counter = 0;
let isValid = true;
if (isClient) {
var _options$multiple, _options$preventDefau;
const _options = typeof options === "function" ? { onDrop: options } : options;
const multiple = (_options$multiple = _options.multiple) !== null && _options$multiple !== void 0 ? _options$multiple : true;
const preventDefaultForUnhandled = (_options$preventDefau = _options.preventDefaultForUnhandled) !== null && _options$preventDefau !== void 0 ? _options$preventDefau : false;
const getFiles = (event) => {
var _event$dataTransfer$f, _event$dataTransfer;
const list = Array.from((_event$dataTransfer$f = (_event$dataTransfer = event.dataTransfer) === null || _event$dataTransfer === void 0 ? void 0 : _event$dataTransfer.files) !== null && _event$dataTransfer$f !== void 0 ? _event$dataTransfer$f : []);
return list.length === 0 ? null : multiple ? list : [list[0]];
};
const checkDataTypes = (types) => {
const dataTypes = (0, vue.unref)(_options.dataTypes);
if (typeof dataTypes === "function") return dataTypes(types);
if (!(dataTypes === null || dataTypes === void 0 ? void 0 : dataTypes.length)) return true;
if (types.length === 0) return false;
return types.every((type) => dataTypes.some((allowedType) => type.includes(allowedType)));
};
const checkValidity = (items) => {
if (_options.checkValidity) return _options.checkValidity(items);
const dataTypesValid = checkDataTypes(Array.from(items !== null && items !== void 0 ? items : []).map((item) => item.type));
const multipleFilesValid = multiple || items.length <= 1;
return dataTypesValid && multipleFilesValid;
};
const isSafari = () => /^(?:(?!chrome|android).)*safari/i.test(navigator.userAgent) && !("chrome" in window);
const handleDragEvent = (event, eventType) => {
var _event$dataTransfer2, _ref;
const dataTransferItemList = (_event$dataTransfer2 = event.dataTransfer) === null || _event$dataTransfer2 === void 0 ? void 0 : _event$dataTransfer2.items;
isValid = (_ref = dataTransferItemList && checkValidity(dataTransferItemList)) !== null && _ref !== void 0 ? _ref : false;
if (preventDefaultForUnhandled) event.preventDefault();
if (!isSafari() && !isValid) {
if (event.dataTransfer) event.dataTransfer.dropEffect = "none";
return;
}
event.preventDefault();
if (event.dataTransfer) event.dataTransfer.dropEffect = "copy";
const currentFiles = getFiles(event);
switch (eventType) {
case "enter":
var _options$onEnter;
counter += 1;
isOverDropZone.value = true;
(_options$onEnter = _options.onEnter) === null || _options$onEnter === void 0 || _options$onEnter.call(_options, null, event);
break;
case "over":
var _options$onOver;
(_options$onOver = _options.onOver) === null || _options$onOver === void 0 || _options$onOver.call(_options, null, event);
break;
case "leave":
var _options$onLeave;
counter -= 1;
if (counter === 0) isOverDropZone.value = false;
(_options$onLeave = _options.onLeave) === null || _options$onLeave === void 0 || _options$onLeave.call(_options, null, event);
break;
case "drop":
counter = 0;
isOverDropZone.value = false;
if (isValid) {
var _options$onDrop;
files.value = currentFiles;
(_options$onDrop = _options.onDrop) === null || _options$onDrop === void 0 || _options$onDrop.call(_options, currentFiles, event);
}
break;
}
};
useEventListener(target, "dragenter", (event) => handleDragEvent(event, "enter"));
useEventListener(target, "dragover", (event) => handleDragEvent(event, "over"));
useEventListener(target, "dragleave", (event) => handleDragEvent(event, "leave"));
useEventListener(target, "drop", (event) => handleDragEvent(event, "drop"));
}
return {
files,
isOverDropZone
};
}
function useElementHover(el, options = {}) {
const { delayEnter = 0, delayLeave = 0, triggerOnRemoval = false, window: window$1 = defaultWindow } = options;
const isHovered = (0, vue.shallowRef)(false);
let timer;
const toggle = (entering) => {
const delay = entering ? delayEnter : delayLeave;
if (timer) {
clearTimeout(timer);
timer = void 0;
}
if (delay) timer = setTimeout(() => isHovered.value = entering, delay);
else isHovered.value = entering;
};
if (!window$1) return isHovered;
useEventListener(el, "mouseenter", () => toggle(true), { passive: true });
useEventListener(el, "mouseleave", () => toggle(false), { passive: true });
if (triggerOnRemoval) onElementRemoval((0, vue.computed)(() => unrefElement(el)), () => toggle(false));
return isHovered;
}
/**
* Detects that a target element's visibility.
*
* @see https://vueuse.org/useIntersectionObserver
* @param target
* @param callback
* @param options
*/
function useIntersectionObserver(target, callback, options = {}) {
const { root, rootMargin, threshold = 0, window: window$1 = defaultWindow, immediate = true } = options;
const isSupported = /* @__PURE__ */ useSupported(() => window$1 && "IntersectionObserver" in window$1);
const targets = (0, vue.computed)(() => {
return toArray((0, vue.toValue)(target)).map(unrefElement).filter(notNullish);
});
let cleanup = noop;
const isActive = (0, vue.shallowRef)(immediate);
const stopWatch = isSupported.value ? (0, vue.watch)(() => [
targets.value,
unrefElement(root),
(0, vue.toValue)(rootMargin),
isActive.value
], ([targets$1, root$1, rootMargin$1]) => {
cleanup();
if (!isActive.value) return;
if (!targets$1.length) return;
const observer = new IntersectionObserver(callback, {
root: unrefElement(root$1),
rootMargin: rootMargin$1,
threshold
});
targets$1.forEach((el) => el && observer.observe(el));
cleanup = () => {
observer.disconnect();
cleanup = noop;
};
}, {
immediate,
flush: "post"
}) : noop;
const stop = () => {
cleanup();
stopWatch();
isActive.value = false;
};
tryOnScopeDispose(stop);
return {
isSupported,
isActive,
pause() {
cleanup();
isActive.value = false;
},
resume() {
isActive.value = true;
},
stop
};
}
var DEFAULT_OPTIONS = {
multiple: true,
accept: "*",
reset: false,
directory: false
};
function prepareInitialFiles(files) {
if (!files) return null;
if (files instanceof FileList) return files;
const dt = new DataTransfer();
for (const file of files) dt.items.add(file);
return dt.files;
}
/**
* Open file dialog with ease.
*
* @see https://vueuse.org/useFileDialog
* @param options
*/
function useFileDialog(options = {}) {
const { document: document$1 = defaultDocument } = options;
const files = (0, vue.ref)(prepareInitialFiles(options.initialFiles));
const { on: onChange, trigger: changeTrigger } = createEventHook();
const { on: onCancel, trigger: cancelTrigger } = createEventHook();
const inputRef = (0, vue.computed)(() => {
var _unrefElement;
const input = (_unrefElement = unrefElement(options.input)) !== null && _unrefElement !== void 0 ? _unrefElement : document$1 ? document$1.createElement("input") : void 0;
if (input) {
input.type = "file";
input.onchange = (event) => {
files.value = event.target.files;
changeTrigger(files.value);
};
input.oncancel = () => {
cancelTrigger();
};
}
return input;
});
const reset = () => {
files.value = null;
if (inputRef.value && inputRef.value.value) {
inputRef.value.value = "";
changeTrigger(null);
}
};
const applyOptions = (options$1) => {
const el = inputRef.value;
if (!el) return;
el.multiple = (0, vue.to