duck-vue-components 0.0.0

package/dist/dom-DS4YqkjW.cjs

@@ -0,0 +1,580 @@
+require("./chunk-CZWwpsFl.cjs");
+const require_objects = require("./objects-o7u5s_lI.cjs");
+let _vueuse_core = require("@vueuse/core");
+let _vue_shared = require("@vue/shared");
+//#region src/packages/utils/dom/aria.ts
+const FOCUSABLE_ELEMENT_SELECTORS = `a[href],button:not([disabled]),button:not([hidden]),:not([tabindex="-1"]),input:not([disabled]),input:not([type="hidden"]),select:not([disabled]),textarea:not([disabled])`;
+/**
+* Determine if the testing element is visible on screen no matter if its on the viewport or not
+*/
+const isVisible = (element) => {
+	if (process?.env?.NODE_ENV === "test") return true;
+	return getComputedStyle(element).position === "fixed" ? false : element.offsetParent !== null;
+};
+const obtainAllFocusableElements = (element) => {
+	return Array.from(element.querySelectorAll(FOCUSABLE_ELEMENT_SELECTORS)).filter((item) => isFocusable(item) && isVisible(item));
+};
+/**
+* @desc Determine if target element is focusable
+* @param element {HTMLElement}
+* @returns {Boolean} true if it is focusable
+*/
+const isFocusable = (element) => {
+	if (element.tabIndex > 0 || element.tabIndex === 0 && element.getAttribute("tabIndex") !== null) return true;
+	if (element.tabIndex < 0 || element.hasAttribute("disabled") || element.getAttribute("aria-disabled") === "true") return false;
+	switch (element.nodeName) {
+		case "A": return !!element.href && element.rel !== "ignore";
+		case "INPUT": return !(element.type === "hidden" || element.type === "file");
+		case "BUTTON":
+		case "SELECT":
+		case "TEXTAREA": return true;
+		default: return false;
+	}
+};
+/**
+* @desc Set Attempt to set focus on the current node.
+* @param element
+*          The node to attempt to focus on.
+* @returns
+*  true if element is focused.
+*/
+const attemptFocus = (element) => {
+	if (!isFocusable(element)) return false;
+	element.focus?.();
+	return document.activeElement === element;
+};
+/**
+* Trigger an event
+* mouseenter, mouseleave, mouseover, keyup, change, click, etc.
+* @param  {HTMLElement} elm
+* @param  {String} name
+* @param  {*} opts
+*/
+const triggerEvent = function(elm, name, ...opts) {
+	let eventName;
+	if (name.includes("mouse") || name.includes("click")) eventName = "MouseEvents";
+	else if (name.includes("key")) eventName = "KeyboardEvent";
+	else eventName = "HTMLEvents";
+	const evt = document.createEvent(eventName);
+	evt.initEvent(name, ...opts);
+	elm.dispatchEvent(evt);
+	return elm;
+};
+const isLeaf = (el) => !el.getAttribute("aria-owns");
+const getSibling = (el, distance, elClass) => {
+	const { parentNode } = el;
+	if (!parentNode) return null;
+	const siblings = parentNode.querySelectorAll(elClass);
+	return siblings[Array.prototype.indexOf.call(siblings, el) + distance] || null;
+};
+const focusNode = (el) => {
+	if (!el) return;
+	el.focus();
+	!isLeaf(el) && el.click();
+};
+//#endregion
+//#region src/packages/utils/dom/event.ts
+const composeEventHandlers = (theirsHandler, oursHandler, { checkForDefaultPrevented = true } = {}) => {
+	const handleEvent = (event) => {
+		const shouldPrevent = theirsHandler?.(event);
+		if (checkForDefaultPrevented === false || !shouldPrevent) return oursHandler?.(event);
+	};
+	return handleEvent;
+};
+const whenMouse = (handler) => {
+	return (e) => e.pointerType === "mouse" ? handler(e) : void 0;
+};
+//#endregion
+//#region src/packages/utils/browser.ts
+const isFirefox = () => _vueuse_core.isClient && /firefox/i.test(window.navigator.userAgent);
+const loadScript = (src, options = {}) => {
+	const { async = true, type = "text/javascript", defer = true } = options;
+	return new Promise((resolve, reject) => {
+		const script = document.createElement("script");
+		script.src = src;
+		script.type = type;
+		script.async = async;
+		script.defer = defer;
+		script.onload = () => {
+			resolve();
+		};
+		script.onerror = () => {
+			reject();
+		};
+		document.body.appendChild(script);
+	});
+};
+//#endregion
+//#region src/packages/utils/dom/position.ts
+const isInContainer = (el, container) => {
+	if (!_vueuse_core.isClient || !el || !container) return false;
+	const elRect = el.getBoundingClientRect();
+	let containerRect;
+	if (container instanceof Element) containerRect = container.getBoundingClientRect();
+	else containerRect = {
+		top: 0,
+		right: window.innerWidth,
+		bottom: window.innerHeight,
+		left: 0
+	};
+	return elRect.top < containerRect.bottom && elRect.bottom > containerRect.top && elRect.right > containerRect.left && elRect.left < containerRect.right;
+};
+const getOffsetTop = (el) => {
+	let offset = 0;
+	let parent = el;
+	while (parent) {
+		offset += parent.offsetTop;
+		parent = parent.offsetParent;
+	}
+	return offset;
+};
+const getOffsetTopDistance = (el, containerEl) => {
+	return Math.abs(getOffsetTop(el) - getOffsetTop(containerEl));
+};
+const getClientXY = (event) => {
+	let clientX;
+	let clientY;
+	if (event.type === "touchend") {
+		clientY = event.changedTouches[0].clientY;
+		clientX = event.changedTouches[0].clientX;
+	} else if (event.type.startsWith("touch")) {
+		clientY = event.touches[0].clientY;
+		clientX = event.touches[0].clientX;
+	} else {
+		clientY = event.clientY;
+		clientX = event.clientX;
+	}
+	return {
+		clientX,
+		clientY
+	};
+};
+//#endregion
+//#region src/packages/utils/easings.ts
+function easeInOutCubic(t, b, c, d) {
+	const cc = c - b;
+	t /= d / 2;
+	if (t < 1) return cc / 2 * t * t * t + b;
+	return cc / 2 * ((t -= 2) * t * t + 2) + b;
+}
+//#endregion
+//#region src/packages/utils/raf.ts
+const rAF = (fn) => _vueuse_core.isClient ? window.requestAnimationFrame(fn) : setTimeout(fn, 16);
+const cAF = (handle) => _vueuse_core.isClient ? window.cancelAnimationFrame(handle) : clearTimeout(handle);
+//#endregion
+//#region src/packages/utils/strings.ts
+/**
+* fork from {@link https://github.com/sindresorhus/escape-string-regexp}
+*/
+const escapeStringRegexp = (string = "") => string.replace(/[|\\{}()[\]^$+*?.]/g, "\\$&").replace(/-/g, "\\x2d");
+const capitalize = (str) => (0, _vue_shared.capitalize)(str);
+//#endregion
+//#region src/packages/utils/error.ts
+var ElementPlusError = class extends Error {
+	constructor(m) {
+		super(m);
+		this.name = "ElementPlusError";
+	}
+};
+function throwError(scope, m) {
+	throw new ElementPlusError(`[${scope}] ${m}`);
+}
+function debugWarn(scope, message) {
+	if (process?.env?.NODE_ENV !== "production") {
+		const error = (0, _vue_shared.isString)(scope) ? new ElementPlusError(`[${scope}] ${message}`) : scope;
+		console.warn(error);
+	}
+}
+//#endregion
+//#region src/packages/utils/dom/style.ts
+const SCOPE = "utils/dom/style";
+const classNameToArray = (cls = "") => cls.split(" ").filter((item) => !!item.trim());
+const hasClass = (el, cls) => {
+	if (!el || !cls) return false;
+	if (cls.includes(" ")) throw new Error("className should not contain space.");
+	return el.classList.contains(cls);
+};
+const addClass = (el, cls) => {
+	if (!el || !cls.trim()) return;
+	el.classList.add(...classNameToArray(cls));
+};
+const removeClass = (el, cls) => {
+	if (!el || !cls.trim()) return;
+	el.classList.remove(...classNameToArray(cls));
+};
+const getStyle = (element, styleName) => {
+	if (!_vueuse_core.isClient || !element || !styleName) return "";
+	let key = (0, _vue_shared.camelize)(styleName);
+	if (key === "float") key = "cssFloat";
+	try {
+		const style = element.style[key];
+		if (style) return style;
+		const computed = document.defaultView?.getComputedStyle(element, "");
+		return computed ? computed[key] : "";
+	} catch {
+		return element.style[key];
+	}
+};
+const setStyle = (element, styleName, value) => {
+	if (!element || !styleName) return;
+	if ((0, _vue_shared.isObject)(styleName)) require_objects.entriesOf(styleName).forEach(([prop, value]) => setStyle(element, prop, value));
+	else {
+		const key = (0, _vue_shared.camelize)(styleName);
+		element.style[key] = value;
+	}
+};
+const removeStyle = (element, style) => {
+	if (!element || !style) return;
+	if ((0, _vue_shared.isObject)(style)) require_objects.keysOf(style).forEach((prop) => removeStyle(element, prop));
+	else setStyle(element, style, "");
+};
+function addUnit(value, defaultUnit = "px") {
+	if (!value) return "";
+	if (require_objects.isNumber(value) || require_objects.isStringNumber(value)) return `${value}${defaultUnit}`;
+	else if ((0, _vue_shared.isString)(value)) return value;
+	debugWarn(SCOPE, "binding value must be a string or number");
+}
+//#endregion
+//#region src/packages/utils/dom/scroll.ts
+const isScroll = (el, isVertical) => {
+	if (!_vueuse_core.isClient) return false;
+	const key = {
+		undefined: "overflow",
+		true: "overflow-y",
+		false: "overflow-x"
+	}[String(isVertical)];
+	const overflow = getStyle(el, key);
+	return [
+		"scroll",
+		"auto",
+		"overlay"
+	].some((s) => overflow.includes(s));
+};
+const getScrollContainer = (el, isVertical) => {
+	if (!_vueuse_core.isClient) return;
+	let parent = el;
+	while (parent) {
+		if ([
+			window,
+			document,
+			document.documentElement
+		].includes(parent)) return window;
+		if (isScroll(parent, isVertical)) return parent;
+		parent = parent.parentNode;
+	}
+	return parent;
+};
+let scrollBarWidth;
+const getScrollBarWidth = (namespace) => {
+	if (!_vueuse_core.isClient) return 0;
+	if (scrollBarWidth !== void 0) return scrollBarWidth;
+	const outer = document.createElement("div");
+	outer.className = `${namespace}-scrollbar__wrap`;
+	outer.style.visibility = "hidden";
+	outer.style.width = "100px";
+	outer.style.position = "absolute";
+	outer.style.top = "-9999px";
+	document.body.appendChild(outer);
+	const widthNoScroll = outer.offsetWidth;
+	outer.style.overflow = "scroll";
+	const inner = document.createElement("div");
+	inner.style.width = "100%";
+	outer.appendChild(inner);
+	const widthWithScroll = inner.offsetWidth;
+	outer.parentNode?.removeChild(outer);
+	scrollBarWidth = widthNoScroll - widthWithScroll;
+	return scrollBarWidth;
+};
+/**
+* Scroll with in the container element, positioning the **selected** element at the top
+* of the container
+*/
+function scrollIntoView(container, selected) {
+	if (!_vueuse_core.isClient) return;
+	if (!selected) {
+		container.scrollTop = 0;
+		return;
+	}
+	const offsetParents = [];
+	let pointer = selected.offsetParent;
+	while (pointer !== null && container !== pointer && container.contains(pointer)) {
+		offsetParents.push(pointer);
+		pointer = pointer.offsetParent;
+	}
+	const top = selected.offsetTop + offsetParents.reduce((prev, curr) => prev + curr.offsetTop, 0);
+	const bottom = top + selected.offsetHeight;
+	const viewRectTop = container.scrollTop;
+	const viewRectBottom = viewRectTop + container.clientHeight;
+	if (top < viewRectTop) container.scrollTop = top;
+	else if (bottom > viewRectBottom) container.scrollTop = bottom - container.clientHeight;
+}
+function animateScrollTo(container, from, to, duration, callback) {
+	const startTime = Date.now();
+	let handle;
+	const scroll = () => {
+		const time = Date.now() - startTime;
+		const nextScrollTop = easeInOutCubic(time > duration ? duration : time, from, to, duration);
+		if (require_objects.isWindow(container)) container.scrollTo(window.pageXOffset, nextScrollTop);
+		else container.scrollTop = nextScrollTop;
+		if (time < duration) handle = rAF(scroll);
+		else if ((0, _vue_shared.isFunction)(callback)) callback();
+	};
+	scroll();
+	return () => {
+		handle && cAF(handle);
+	};
+}
+const getScrollElement = (target, container) => {
+	if (require_objects.isWindow(container)) return target.ownerDocument.documentElement;
+	return container;
+};
+const getScrollTop = (container) => {
+	if (require_objects.isWindow(container)) return window.scrollY;
+	return container.scrollTop;
+};
+//#endregion
+//#region src/packages/utils/dom/element.ts
+const getElement = ((target) => {
+	if (!_vueuse_core.isClient || target === "") return null;
+	if ((0, _vue_shared.isString)(target)) try {
+		return document.querySelector(target);
+	} catch {
+		return null;
+	}
+	return target;
+});
+//#endregion
+Object.defineProperty(exports, "addClass", {
+	enumerable: true,
+	get: function() {
+		return addClass;
+	}
+});
+Object.defineProperty(exports, "addUnit", {
+	enumerable: true,
+	get: function() {
+		return addUnit;
+	}
+});
+Object.defineProperty(exports, "animateScrollTo", {
+	enumerable: true,
+	get: function() {
+		return animateScrollTo;
+	}
+});
+Object.defineProperty(exports, "attemptFocus", {
+	enumerable: true,
+	get: function() {
+		return attemptFocus;
+	}
+});
+Object.defineProperty(exports, "cAF", {
+	enumerable: true,
+	get: function() {
+		return cAF;
+	}
+});
+Object.defineProperty(exports, "capitalize", {
+	enumerable: true,
+	get: function() {
+		return capitalize;
+	}
+});
+Object.defineProperty(exports, "classNameToArray", {
+	enumerable: true,
+	get: function() {
+		return classNameToArray;
+	}
+});
+Object.defineProperty(exports, "composeEventHandlers", {
+	enumerable: true,
+	get: function() {
+		return composeEventHandlers;
+	}
+});
+Object.defineProperty(exports, "debugWarn", {
+	enumerable: true,
+	get: function() {
+		return debugWarn;
+	}
+});
+Object.defineProperty(exports, "easeInOutCubic", {
+	enumerable: true,
+	get: function() {
+		return easeInOutCubic;
+	}
+});
+Object.defineProperty(exports, "escapeStringRegexp", {
+	enumerable: true,
+	get: function() {
+		return escapeStringRegexp;
+	}
+});
+Object.defineProperty(exports, "focusNode", {
+	enumerable: true,
+	get: function() {
+		return focusNode;
+	}
+});
+Object.defineProperty(exports, "getClientXY", {
+	enumerable: true,
+	get: function() {
+		return getClientXY;
+	}
+});
+Object.defineProperty(exports, "getElement", {
+	enumerable: true,
+	get: function() {
+		return getElement;
+	}
+});
+Object.defineProperty(exports, "getOffsetTop", {
+	enumerable: true,
+	get: function() {
+		return getOffsetTop;
+	}
+});
+Object.defineProperty(exports, "getOffsetTopDistance", {
+	enumerable: true,
+	get: function() {
+		return getOffsetTopDistance;
+	}
+});
+Object.defineProperty(exports, "getScrollBarWidth", {
+	enumerable: true,
+	get: function() {
+		return getScrollBarWidth;
+	}
+});
+Object.defineProperty(exports, "getScrollContainer", {
+	enumerable: true,
+	get: function() {
+		return getScrollContainer;
+	}
+});
+Object.defineProperty(exports, "getScrollElement", {
+	enumerable: true,
+	get: function() {
+		return getScrollElement;
+	}
+});
+Object.defineProperty(exports, "getScrollTop", {
+	enumerable: true,
+	get: function() {
+		return getScrollTop;
+	}
+});
+Object.defineProperty(exports, "getSibling", {
+	enumerable: true,
+	get: function() {
+		return getSibling;
+	}
+});
+Object.defineProperty(exports, "getStyle", {
+	enumerable: true,
+	get: function() {
+		return getStyle;
+	}
+});
+Object.defineProperty(exports, "hasClass", {
+	enumerable: true,
+	get: function() {
+		return hasClass;
+	}
+});
+Object.defineProperty(exports, "isFirefox", {
+	enumerable: true,
+	get: function() {
+		return isFirefox;
+	}
+});
+Object.defineProperty(exports, "isFocusable", {
+	enumerable: true,
+	get: function() {
+		return isFocusable;
+	}
+});
+Object.defineProperty(exports, "isInContainer", {
+	enumerable: true,
+	get: function() {
+		return isInContainer;
+	}
+});
+Object.defineProperty(exports, "isLeaf", {
+	enumerable: true,
+	get: function() {
+		return isLeaf;
+	}
+});
+Object.defineProperty(exports, "isScroll", {
+	enumerable: true,
+	get: function() {
+		return isScroll;
+	}
+});
+Object.defineProperty(exports, "isVisible", {
+	enumerable: true,
+	get: function() {
+		return isVisible;
+	}
+});
+Object.defineProperty(exports, "loadScript", {
+	enumerable: true,
+	get: function() {
+		return loadScript;
+	}
+});
+Object.defineProperty(exports, "obtainAllFocusableElements", {
+	enumerable: true,
+	get: function() {
+		return obtainAllFocusableElements;
+	}
+});
+Object.defineProperty(exports, "rAF", {
+	enumerable: true,
+	get: function() {
+		return rAF;
+	}
+});
+Object.defineProperty(exports, "removeClass", {
+	enumerable: true,
+	get: function() {
+		return removeClass;
+	}
+});
+Object.defineProperty(exports, "removeStyle", {
+	enumerable: true,
+	get: function() {
+		return removeStyle;
+	}
+});
+Object.defineProperty(exports, "scrollIntoView", {
+	enumerable: true,
+	get: function() {
+		return scrollIntoView;
+	}
+});
+Object.defineProperty(exports, "setStyle", {
+	enumerable: true,
+	get: function() {
+		return setStyle;
+	}
+});
+Object.defineProperty(exports, "throwError", {
+	enumerable: true,
+	get: function() {
+		return throwError;
+	}
+});
+Object.defineProperty(exports, "triggerEvent", {
+	enumerable: true,
+	get: function() {
+		return triggerEvent;
+	}
+});
+Object.defineProperty(exports, "whenMouse", {
+	enumerable: true,
+	get: function() {
+		return whenMouse;
+	}
+});