完全跑通1.0版本

This commit is contained in:
2026-05-26 12:56:03 +08:00
parent 2ece5174a7
commit 93c714a93b
11557 changed files with 1648225 additions and 36 deletions

View File

@@ -0,0 +1,29 @@
//#region ../../packages/utils/dom/aria.d.ts
declare const isShadowRoot: (e: unknown) => e is ShadowRoot;
/**
* Determine if the testing element is visible on screen no matter if its on the viewport or not
*/
declare const isVisible: (element: HTMLElement) => boolean;
declare const obtainAllFocusableElements: (element: HTMLElement) => HTMLElement[];
/**
* @desc Determine if target element is focusable
* @param element {HTMLElement}
* @returns {Boolean} true if it is focusable
*/
declare const isFocusable: (element: HTMLElement) => boolean;
/**
* Trigger an event
* mouseenter, mouseleave, mouseover, keyup, change, click, etc.
* @param {HTMLElement} elm
* @param {String} name
* @param {*} opts
*/
declare const triggerEvent: (elm: HTMLElement, name: string, ...opts: Array<boolean>) => HTMLElement;
declare const isLeaf: (el: HTMLElement) => boolean;
declare const getSibling: (el: HTMLElement, distance: number, elClass: string) => Element | null;
declare const focusElement: (el?: HTMLElement | {
focus: () => void;
} | null, options?: FocusOptions) => void;
declare const focusNode: (el: HTMLElement) => void;
//#endregion
export { focusElement, focusNode, getSibling, isFocusable, isLeaf, isShadowRoot, isVisible, obtainAllFocusableElements, triggerEvent };

View File

@@ -0,0 +1,89 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
//#region ../../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])`;
const isShadowRoot = (e) => {
if (typeof ShadowRoot === "undefined") return false;
return e instanceof ShadowRoot;
};
const isHTMLElement = (e) => {
if (typeof Element === "undefined") return false;
return e instanceof Element;
};
/**
* 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;
}
};
/**
* 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 focusElement = (el, options) => {
if (!el || !el.focus) return;
let cleanup = false;
if (isHTMLElement(el) && !isFocusable(el) && !el.getAttribute("tabindex")) {
el.setAttribute("tabindex", "-1");
cleanup = true;
}
el.focus(options);
if (isHTMLElement(el) && cleanup) el.removeAttribute("tabindex");
};
const focusNode = (el) => {
if (!el) return;
focusElement(el);
!isLeaf(el) && el.click();
};
//#endregion
exports.focusElement = focusElement;
exports.focusNode = focusNode;
exports.getSibling = getSibling;
exports.isFocusable = isFocusable;
exports.isLeaf = isLeaf;
exports.isShadowRoot = isShadowRoot;
exports.isVisible = isVisible;
exports.obtainAllFocusableElements = obtainAllFocusableElements;
exports.triggerEvent = triggerEvent;
//# sourceMappingURL=aria.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,5 @@
//#region ../../packages/utils/dom/element.d.ts
type GetElement = <T extends string | HTMLElement | Window | null | undefined>(target: T) => T extends string ? HTMLElement | null : T;
declare const getElement: GetElement;
//#endregion
export { getElement };

View File

@@ -0,0 +1,18 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
require("../../_virtual/_rolldown/runtime.js");
let _vueuse_core = require("@vueuse/core");
let _vue_shared = require("@vue/shared");
//#region ../../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
exports.getElement = getElement;
//# sourceMappingURL=element.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"element.js","names":["isClient"],"sources":["../../../../../packages/utils/dom/element.ts"],"sourcesContent":["import { isString } from '../types'\nimport { isClient } from '../browser'\n\ntype GetElement = <T extends string | HTMLElement | Window | null | undefined>(\n target: T\n) => T extends string ? HTMLElement | null : T\n\nexport const getElement = ((\n target: string | HTMLElement | Window | null | undefined\n) => {\n if (!isClient || target === '') return null\n if (isString(target)) {\n try {\n return document.querySelector<HTMLElement>(target)\n } catch {\n return null\n }\n }\n return target\n}) as GetElement\n"],"mappings":";;;;;AAOA,MAAa,eACX,WACG;CACH,IAAI,CAACA,aAAAA,YAAY,WAAW,IAAI,OAAO;CACvC,KAAA,GAAA,YAAA,UAAa,OAAO,EAClB,IAAI;EACF,OAAO,SAAS,cAA2B,OAAO;SAC5C;EACN,OAAO;;CAGX,OAAO"}

View File

@@ -0,0 +1,12 @@
//#region ../../packages/utils/dom/event.d.ts
declare const composeEventHandlers: <E>(theirsHandler?: (event: E) => boolean | void, oursHandler?: (event: E) => void, {
checkForDefaultPrevented
}?: {
checkForDefaultPrevented?: boolean | undefined;
}) => (event: E) => void;
type WhenMouseHandler = (e: PointerEvent) => any;
declare const whenMouse: (handler: WhenMouseHandler) => WhenMouseHandler;
declare const getEventCode: (event: KeyboardEvent) => string;
declare const getEventKey: (event: KeyboardEvent) => string;
//#endregion
export { composeEventHandlers, getEventCode, getEventKey, whenMouse };

View File

@@ -0,0 +1,41 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const require_aria = require("../../constants/aria.js");
const require_browser = require("../browser.js");
//#region ../../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;
};
const getEventCode = (event) => {
if (event.code && event.code !== "Unidentified") return event.code;
const key = getEventKey(event);
if (key) {
if (Object.values(require_aria.EVENT_CODE).includes(key)) return key;
switch (key) {
case " ": return require_aria.EVENT_CODE.space;
default: return "";
}
}
return "";
};
const getEventKey = (event) => {
let key = event.key && event.key !== "Unidentified" ? event.key : "";
if (!key && event.type === "keyup" && require_browser.isAndroid()) {
const target = event.target;
key = target.value.charAt(target.selectionStart - 1);
}
return key;
};
//#endregion
exports.composeEventHandlers = composeEventHandlers;
exports.getEventCode = getEventCode;
exports.getEventKey = getEventKey;
exports.whenMouse = whenMouse;
//# sourceMappingURL=event.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"event.js","names":["EVENT_CODE","isAndroid"],"sources":["../../../../../packages/utils/dom/event.ts"],"sourcesContent":["import { EVENT_CODE } from '@element-plus/constants'\nimport { isAndroid } from '../browser'\n\nexport const composeEventHandlers = <E>(\n theirsHandler?: (event: E) => boolean | void,\n oursHandler?: (event: E) => void,\n { checkForDefaultPrevented = true } = {}\n) => {\n const handleEvent = (event: E) => {\n const shouldPrevent = theirsHandler?.(event)\n\n if (checkForDefaultPrevented === false || !shouldPrevent) {\n return oursHandler?.(event)\n }\n }\n return handleEvent\n}\n\ntype WhenMouseHandler = (e: PointerEvent) => any\nexport const whenMouse = (handler: WhenMouseHandler): WhenMouseHandler => {\n return (e: PointerEvent) =>\n e.pointerType === 'mouse' ? handler(e) : undefined\n}\n\nexport const getEventCode = (event: KeyboardEvent): string => {\n if (event.code && event.code !== 'Unidentified') return event.code\n // On android, event.code is always '' (see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/code#browser_compatibility)\n const key = getEventKey(event)\n\n if (key) {\n if (Object.values(EVENT_CODE).includes(key)) return key\n\n switch (key) {\n case ' ':\n return EVENT_CODE.space\n default:\n return ''\n }\n }\n\n return ''\n}\n\nexport const getEventKey = (event: KeyboardEvent): string => {\n let key = event.key && event.key !== 'Unidentified' ? event.key : ''\n\n // On Android, event.key and event.code may not be useful when entering characters or space\n // So here we directly get the last character of the input\n // **only takes effect in the keyup event**\n if (!key && event.type === 'keyup' && isAndroid()) {\n const target = event.target as HTMLInputElement\n key = target.value.charAt(target.selectionStart! - 1)\n }\n\n return key\n}\n"],"mappings":";;;;AAGA,MAAa,wBACX,eACA,aACA,EAAE,2BAA2B,SAAS,EAAE,KACrC;CACH,MAAM,eAAe,UAAa;EAChC,MAAM,gBAAgB,gBAAgB,MAAM;EAE5C,IAAI,6BAA6B,SAAS,CAAC,eACzC,OAAO,cAAc,MAAM;;CAG/B,OAAO;;AAIT,MAAa,aAAa,YAAgD;CACxE,QAAQ,MACN,EAAE,gBAAgB,UAAU,QAAQ,EAAE,GAAG,KAAA;;AAG7C,MAAa,gBAAgB,UAAiC;CAC5D,IAAI,MAAM,QAAQ,MAAM,SAAS,gBAAgB,OAAO,MAAM;CAE9D,MAAM,MAAM,YAAY,MAAM;CAE9B,IAAI,KAAK;EACP,IAAI,OAAO,OAAOA,aAAAA,WAAW,CAAC,SAAS,IAAI,EAAE,OAAO;EAEpD,QAAQ,KAAR;GACE,KAAK,KACH,OAAOA,aAAAA,WAAW;GACpB,SACE,OAAO;;;CAIb,OAAO;;AAGT,MAAa,eAAe,UAAiC;CAC3D,IAAI,MAAM,MAAM,OAAO,MAAM,QAAQ,iBAAiB,MAAM,MAAM;CAKlE,IAAI,CAAC,OAAO,MAAM,SAAS,WAAWC,gBAAAA,WAAW,EAAE;EACjD,MAAM,SAAS,MAAM;EACrB,MAAM,OAAO,MAAM,OAAO,OAAO,iBAAkB,EAAE;;CAGvD,OAAO"}

View File

@@ -0,0 +1,7 @@
import { focusElement, focusNode, getSibling, isFocusable, isLeaf, isShadowRoot, isVisible, obtainAllFocusableElements, triggerEvent } from "./aria.js";
import { composeEventHandlers, getEventCode, getEventKey, whenMouse } from "./event.js";
import { getClientXY, getOffsetTop, getOffsetTopDistance, isInContainer } from "./position.js";
import { animateScrollTo, getScrollBarWidth, getScrollContainer, getScrollElement, getScrollTop, isScroll, scrollIntoView } from "./scroll.js";
import { addClass, addUnit, classNameToArray, getStyle, hasClass, removeClass, removeStyle, setStyle } from "./style.js";
import { getElement } from "./element.js";
export { addClass, addUnit, animateScrollTo, classNameToArray, composeEventHandlers, focusElement, focusNode, getClientXY, getElement, getEventCode, getEventKey, getOffsetTop, getOffsetTopDistance, getScrollBarWidth, getScrollContainer, getScrollElement, getScrollTop, getSibling, getStyle, hasClass, isFocusable, isInContainer, isLeaf, isScroll, isShadowRoot, isVisible, obtainAllFocusableElements, removeClass, removeStyle, scrollIntoView, setStyle, triggerEvent, whenMouse };

View File

@@ -0,0 +1,40 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const require_aria = require("./aria.js");
const require_event = require("./event.js");
const require_position = require("./position.js");
const require_style = require("./style.js");
const require_scroll = require("./scroll.js");
const require_element = require("./element.js");
exports.addClass = require_style.addClass;
exports.addUnit = require_style.addUnit;
exports.animateScrollTo = require_scroll.animateScrollTo;
exports.classNameToArray = require_style.classNameToArray;
exports.composeEventHandlers = require_event.composeEventHandlers;
exports.focusElement = require_aria.focusElement;
exports.focusNode = require_aria.focusNode;
exports.getClientXY = require_position.getClientXY;
exports.getElement = require_element.getElement;
exports.getEventCode = require_event.getEventCode;
exports.getEventKey = require_event.getEventKey;
exports.getOffsetTop = require_position.getOffsetTop;
exports.getOffsetTopDistance = require_position.getOffsetTopDistance;
exports.getScrollBarWidth = require_scroll.getScrollBarWidth;
exports.getScrollContainer = require_scroll.getScrollContainer;
exports.getScrollElement = require_scroll.getScrollElement;
exports.getScrollTop = require_scroll.getScrollTop;
exports.getSibling = require_aria.getSibling;
exports.getStyle = require_style.getStyle;
exports.hasClass = require_style.hasClass;
exports.isFocusable = require_aria.isFocusable;
exports.isInContainer = require_position.isInContainer;
exports.isLeaf = require_aria.isLeaf;
exports.isScroll = require_scroll.isScroll;
exports.isShadowRoot = require_aria.isShadowRoot;
exports.isVisible = require_aria.isVisible;
exports.obtainAllFocusableElements = require_aria.obtainAllFocusableElements;
exports.removeClass = require_style.removeClass;
exports.removeStyle = require_style.removeStyle;
exports.scrollIntoView = require_scroll.scrollIntoView;
exports.setStyle = require_style.setStyle;
exports.triggerEvent = require_aria.triggerEvent;
exports.whenMouse = require_event.whenMouse;

View File

@@ -0,0 +1,10 @@
//#region ../../packages/utils/dom/position.d.ts
declare const isInContainer: (el?: Element, container?: Element | Window) => boolean;
declare const getOffsetTop: (el: HTMLElement) => number;
declare const getOffsetTopDistance: (el: HTMLElement, containerEl: HTMLElement) => number;
declare const getClientXY: (event: MouseEvent | TouchEvent) => {
clientX: number;
clientY: number;
};
//#endregion
export { getClientXY, getOffsetTop, getOffsetTopDistance, isInContainer };

View File

@@ -0,0 +1,54 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
require("../../_virtual/_rolldown/runtime.js");
let _vueuse_core = require("@vueuse/core");
//#region ../../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
exports.getClientXY = getClientXY;
exports.getOffsetTop = getOffsetTop;
exports.getOffsetTopDistance = getOffsetTopDistance;
exports.isInContainer = isInContainer;
//# sourceMappingURL=position.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"position.js","names":["isClient"],"sources":["../../../../../packages/utils/dom/position.ts"],"sourcesContent":["import { isClient } from '../browser'\n\nexport const isInContainer = (\n el?: Element,\n container?: Element | Window\n): boolean => {\n if (!isClient || !el || !container) return false\n\n const elRect = el.getBoundingClientRect()\n\n let containerRect: Pick<DOMRect, 'top' | 'bottom' | 'left' | 'right'>\n if (container instanceof Element) {\n containerRect = container.getBoundingClientRect()\n } else {\n containerRect = {\n top: 0,\n right: window.innerWidth,\n bottom: window.innerHeight,\n left: 0,\n }\n }\n return (\n elRect.top < containerRect.bottom &&\n elRect.bottom > containerRect.top &&\n elRect.right > containerRect.left &&\n elRect.left < containerRect.right\n )\n}\n\nexport const getOffsetTop = (el: HTMLElement) => {\n let offset = 0\n let parent = el\n\n while (parent) {\n offset += parent.offsetTop\n parent = parent.offsetParent as HTMLElement\n }\n\n return offset\n}\n\nexport const getOffsetTopDistance = (\n el: HTMLElement,\n containerEl: HTMLElement\n) => {\n return Math.abs(getOffsetTop(el) - getOffsetTop(containerEl))\n}\n\nexport const getClientXY = (event: MouseEvent | TouchEvent) => {\n let clientX: number\n let clientY: number\n if (event.type === 'touchend') {\n clientY = (event as TouchEvent).changedTouches[0].clientY\n clientX = (event as TouchEvent).changedTouches[0].clientX\n } else if (event.type.startsWith('touch')) {\n clientY = (event as TouchEvent).touches[0].clientY\n clientX = (event as TouchEvent).touches[0].clientX\n } else {\n clientY = (event as MouseEvent).clientY\n clientX = (event as MouseEvent).clientX\n }\n return {\n clientX,\n clientY,\n }\n}\n"],"mappings":";;;;AAEA,MAAa,iBACX,IACA,cACY;CACZ,IAAI,CAACA,aAAAA,YAAY,CAAC,MAAM,CAAC,WAAW,OAAO;CAE3C,MAAM,SAAS,GAAG,uBAAuB;CAEzC,IAAI;CACJ,IAAI,qBAAqB,SACvB,gBAAgB,UAAU,uBAAuB;MAEjD,gBAAgB;EACd,KAAK;EACL,OAAO,OAAO;EACd,QAAQ,OAAO;EACf,MAAM;EACP;CAEH,OACE,OAAO,MAAM,cAAc,UAC3B,OAAO,SAAS,cAAc,OAC9B,OAAO,QAAQ,cAAc,QAC7B,OAAO,OAAO,cAAc;;AAIhC,MAAa,gBAAgB,OAAoB;CAC/C,IAAI,SAAS;CACb,IAAI,SAAS;CAEb,OAAO,QAAQ;EACb,UAAU,OAAO;EACjB,SAAS,OAAO;;CAGlB,OAAO;;AAGT,MAAa,wBACX,IACA,gBACG;CACH,OAAO,KAAK,IAAI,aAAa,GAAG,GAAG,aAAa,YAAY,CAAC;;AAG/D,MAAa,eAAe,UAAmC;CAC7D,IAAI;CACJ,IAAI;CACJ,IAAI,MAAM,SAAS,YAAY;EAC7B,UAAW,MAAqB,eAAe,GAAG;EAClD,UAAW,MAAqB,eAAe,GAAG;QAC7C,IAAI,MAAM,KAAK,WAAW,QAAQ,EAAE;EACzC,UAAW,MAAqB,QAAQ,GAAG;EAC3C,UAAW,MAAqB,QAAQ,GAAG;QACtC;EACL,UAAW,MAAqB;EAChC,UAAW,MAAqB;;CAElC,OAAO;EACL;EACA;EACD"}

View File

@@ -0,0 +1,14 @@
//#region ../../packages/utils/dom/scroll.d.ts
declare const isScroll: (el: HTMLElement, isVertical?: boolean) => boolean;
declare const getScrollContainer: (el: HTMLElement, isVertical?: boolean) => Window | HTMLElement | undefined;
declare const getScrollBarWidth: (namespace: string) => number;
/**
* Scroll with in the container element, positioning the **selected** element at the top
* of the container
*/
declare function scrollIntoView(container: HTMLElement, selected: HTMLElement): void;
declare function animateScrollTo(container: HTMLElement | Window, from: number, to: number, duration: number, callback?: unknown): () => void;
declare const getScrollElement: (target: HTMLElement, container: HTMLElement | Window) => HTMLElement;
declare const getScrollTop: (container: HTMLElement | Window) => number;
//#endregion
export { animateScrollTo, getScrollBarWidth, getScrollContainer, getScrollElement, getScrollTop, isScroll, scrollIntoView };

View File

@@ -0,0 +1,117 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
require("../../_virtual/_rolldown/runtime.js");
const require_aria = require("./aria.js");
const require_easings = require("../easings.js");
const require_types = require("../types.js");
const require_raf = require("../raf.js");
const require_style = require("./style.js");
let _vueuse_core = require("@vueuse/core");
let _vue_shared = require("@vue/shared");
//#region ../../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 = require_style.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;
if (require_aria.isShadowRoot(parent)) parent = parent.host;
else 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 = require_easings.easeInOutCubic(time > duration ? duration : time, from, to, duration);
if (require_types.isWindow(container)) container.scrollTo(window.pageXOffset, nextScrollTop);
else container.scrollTop = nextScrollTop;
if (time < duration) handle = require_raf.rAF(scroll);
else if ((0, _vue_shared.isFunction)(callback)) callback();
};
scroll();
return () => {
handle && require_raf.cAF(handle);
};
}
const getScrollElement = (target, container) => {
if (require_types.isWindow(container)) return target.ownerDocument.documentElement;
return container;
};
const getScrollTop = (container) => {
if (require_types.isWindow(container)) return window.scrollY;
return container.scrollTop;
};
//#endregion
exports.animateScrollTo = animateScrollTo;
exports.getScrollBarWidth = getScrollBarWidth;
exports.getScrollContainer = getScrollContainer;
exports.getScrollElement = getScrollElement;
exports.getScrollTop = getScrollTop;
exports.isScroll = isScroll;
exports.scrollIntoView = scrollIntoView;
//# sourceMappingURL=scroll.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,13 @@
import { CSSProperties } from "vue";
//#region ../../packages/utils/dom/style.d.ts
declare const classNameToArray: (cls?: string) => string[];
declare const hasClass: (el: Element, cls: string) => boolean;
declare const addClass: (el: Element, cls: string) => void;
declare const removeClass: (el: Element, cls: string) => void;
declare const getStyle: (element: HTMLElement, styleName: keyof CSSProperties) => string;
declare const setStyle: (element: HTMLElement, styleName: CSSProperties | keyof CSSProperties, value?: string | number) => void;
declare const removeStyle: (element: HTMLElement, style: CSSProperties | keyof CSSProperties) => void;
declare function addUnit(value?: string | number, defaultUnit?: string): string | undefined;
//#endregion
export { addClass, addUnit, classNameToArray, getStyle, hasClass, removeClass, removeStyle, setStyle };

View File

@@ -0,0 +1,67 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
require("../../_virtual/_rolldown/runtime.js");
const require_aria = require("./aria.js");
const require_types = require("../types.js");
const require_objects = require("../objects.js");
const require_error = require("../error.js");
let _vueuse_core = require("@vueuse/core");
let _vue_shared = require("@vue/shared");
//#region ../../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 || require_aria.isShadowRoot(element)) 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 && value !== 0) return "";
if (require_types.isNumber(value) || require_types.isStringNumber(value)) return `${value}${defaultUnit}`;
else if ((0, _vue_shared.isString)(value)) return value;
require_error.debugWarn(SCOPE, "binding value must be a string or number");
}
//#endregion
exports.addClass = addClass;
exports.addUnit = addUnit;
exports.classNameToArray = classNameToArray;
exports.getStyle = getStyle;
exports.hasClass = hasClass;
exports.removeClass = removeClass;
exports.removeStyle = removeStyle;
exports.setStyle = setStyle;
//# sourceMappingURL=style.js.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"style.js","names":["isClient","isShadowRoot","isNumber","isStringNumber"],"sources":["../../../../../packages/utils/dom/style.ts"],"sourcesContent":["import { isNumber, isObject, isString, isStringNumber } from '../types'\nimport { isClient } from '../browser'\nimport { camelize } from '../strings'\nimport { entriesOf, keysOf } from '../objects'\nimport { debugWarn } from '../error'\nimport { isShadowRoot } from './aria'\n\nimport type { CSSProperties } from 'vue'\n\nconst SCOPE = 'utils/dom/style'\n\nexport const classNameToArray = (cls = '') =>\n cls.split(' ').filter((item) => !!item.trim())\n\nexport const hasClass = (el: Element, cls: string): boolean => {\n if (!el || !cls) return false\n if (cls.includes(' ')) throw new Error('className should not contain space.')\n return el.classList.contains(cls)\n}\n\nexport const addClass = (el: Element, cls: string) => {\n if (!el || !cls.trim()) return\n el.classList.add(...classNameToArray(cls))\n}\n\nexport const removeClass = (el: Element, cls: string) => {\n if (!el || !cls.trim()) return\n el.classList.remove(...classNameToArray(cls))\n}\n\nexport const getStyle = (\n element: HTMLElement,\n styleName: keyof CSSProperties\n): string => {\n if (!isClient || !element || !styleName || isShadowRoot(element)) return ''\n\n let key = camelize(styleName)\n if (key === 'float') key = 'cssFloat'\n try {\n const style = (element.style as any)[key]\n if (style) return style\n const computed: any = document.defaultView?.getComputedStyle(element, '')\n return computed ? computed[key] : ''\n } catch {\n return (element.style as any)[key]\n }\n}\n\nexport const setStyle = (\n element: HTMLElement,\n styleName: CSSProperties | keyof CSSProperties,\n value?: string | number\n) => {\n if (!element || !styleName) return\n\n if (isObject(styleName)) {\n entriesOf(styleName).forEach(([prop, value]) =>\n setStyle(element, prop, value)\n )\n } else {\n const key: any = camelize(styleName)\n element.style[key] = value as any\n }\n}\n\nexport const removeStyle = (\n element: HTMLElement,\n style: CSSProperties | keyof CSSProperties\n) => {\n if (!element || !style) return\n\n if (isObject(style)) {\n keysOf(style).forEach((prop) => removeStyle(element, prop))\n } else {\n setStyle(element, style, '')\n }\n}\n\nexport function addUnit(value?: string | number, defaultUnit = 'px') {\n if (!value && value !== 0) return ''\n if (isNumber(value) || isStringNumber(value)) {\n return `${value}${defaultUnit}`\n } else if (isString(value)) {\n return value\n }\n debugWarn(SCOPE, 'binding value must be a string or number')\n}\n"],"mappings":";;;;;;;;;AASA,MAAM,QAAQ;AAEd,MAAa,oBAAoB,MAAM,OACrC,IAAI,MAAM,IAAI,CAAC,QAAQ,SAAS,CAAC,CAAC,KAAK,MAAM,CAAC;AAEhD,MAAa,YAAY,IAAa,QAAyB;CAC7D,IAAI,CAAC,MAAM,CAAC,KAAK,OAAO;CACxB,IAAI,IAAI,SAAS,IAAI,EAAE,MAAM,IAAI,MAAM,sCAAsC;CAC7E,OAAO,GAAG,UAAU,SAAS,IAAI;;AAGnC,MAAa,YAAY,IAAa,QAAgB;CACpD,IAAI,CAAC,MAAM,CAAC,IAAI,MAAM,EAAE;CACxB,GAAG,UAAU,IAAI,GAAG,iBAAiB,IAAI,CAAC;;AAG5C,MAAa,eAAe,IAAa,QAAgB;CACvD,IAAI,CAAC,MAAM,CAAC,IAAI,MAAM,EAAE;CACxB,GAAG,UAAU,OAAO,GAAG,iBAAiB,IAAI,CAAC;;AAG/C,MAAa,YACX,SACA,cACW;CACX,IAAI,CAACA,aAAAA,YAAY,CAAC,WAAW,CAAC,aAAaC,aAAAA,aAAa,QAAQ,EAAE,OAAO;CAEzE,IAAI,OAAA,GAAA,YAAA,UAAe,UAAU;CAC7B,IAAI,QAAQ,SAAS,MAAM;CAC3B,IAAI;EACF,MAAM,QAAS,QAAQ,MAAc;EACrC,IAAI,OAAO,OAAO;EAClB,MAAM,WAAgB,SAAS,aAAa,iBAAiB,SAAS,GAAG;EACzE,OAAO,WAAW,SAAS,OAAO;SAC5B;EACN,OAAQ,QAAQ,MAAc;;;AAIlC,MAAa,YACX,SACA,WACA,UACG;CACH,IAAI,CAAC,WAAW,CAAC,WAAW;CAE5B,KAAA,GAAA,YAAA,UAAa,UAAU,EACrB,gBAAA,UAAU,UAAU,CAAC,SAAS,CAAC,MAAM,WACnC,SAAS,SAAS,MAAM,MAAM,CAC/B;MACI;EACL,MAAM,OAAA,GAAA,YAAA,UAAoB,UAAU;EACpC,QAAQ,MAAM,OAAO;;;AAIzB,MAAa,eACX,SACA,UACG;CACH,IAAI,CAAC,WAAW,CAAC,OAAO;CAExB,KAAA,GAAA,YAAA,UAAa,MAAM,EACjB,gBAAA,OAAO,MAAM,CAAC,SAAS,SAAS,YAAY,SAAS,KAAK,CAAC;MAE3D,SAAS,SAAS,OAAO,GAAG;;AAIhC,SAAgB,QAAQ,OAAyB,cAAc,MAAM;CACnE,IAAI,CAAC,SAAS,UAAU,GAAG,OAAO;CAClC,IAAIC,cAAAA,SAAS,MAAM,IAAIC,cAAAA,eAAe,MAAM,EAC1C,OAAO,GAAG,QAAQ;MACb,KAAA,GAAA,YAAA,UAAa,MAAM,EACxB,OAAO;CAET,cAAA,UAAU,OAAO,2CAA2C"}