element-plus
Version:
> TODO: description
216 lines (215 loc) • 6.77 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.stop = exports.getOffsetTopDistance = exports.getOffsetTop = exports.isInContainer = exports.getScrollContainer = exports.isScroll = exports.removeStyle = exports.setStyle = exports.getStyle = exports.removeClass = exports.addClass = exports.hasClass = exports.once = exports.off = exports.on = void 0;
const isServer_1 = __importDefault(require("./isServer"));
const util_1 = require("./util");
/* istanbul ignore next */
const trim = function (s) {
return (s || '').replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '');
};
/* istanbul ignore next */
const on = function (element, event, handler, useCapture = false) {
if (element && event && handler) {
element.addEventListener(event, handler, useCapture);
}
};
exports.on = on;
/* istanbul ignore next */
const off = function (element, event, handler, useCapture = false) {
if (element && event && handler) {
element.removeEventListener(event, handler, useCapture);
}
};
exports.off = off;
/* istanbul ignore next */
const once = function (el, event, fn) {
const listener = function (...args) {
if (fn) {
fn.apply(this, args);
}
exports.off(el, event, listener);
};
exports.on(el, event, listener);
};
exports.once = once;
/* istanbul ignore next */
function hasClass(el, cls) {
if (!el || !cls)
return false;
if (cls.indexOf(' ') !== -1)
throw new Error('className should not contain space.');
if (el.classList) {
return el.classList.contains(cls);
}
else {
return (' ' + el.className + ' ').indexOf(' ' + cls + ' ') > -1;
}
}
exports.hasClass = hasClass;
/* istanbul ignore next */
function addClass(el, cls) {
if (!el)
return;
let curClass = el.className;
const classes = (cls || '').split(' ');
for (let i = 0, j = classes.length; i < j; i++) {
const clsName = classes[i];
if (!clsName)
continue;
if (el.classList) {
el.classList.add(clsName);
}
else if (!hasClass(el, clsName)) {
curClass += ' ' + clsName;
}
}
if (!el.classList) {
el.className = curClass;
}
}
exports.addClass = addClass;
/* istanbul ignore next */
function removeClass(el, cls) {
if (!el || !cls)
return;
const classes = cls.split(' ');
let curClass = ' ' + el.className + ' ';
for (let i = 0, j = classes.length; i < j; i++) {
const clsName = classes[i];
if (!clsName)
continue;
if (el.classList) {
el.classList.remove(clsName);
}
else if (hasClass(el, clsName)) {
curClass = curClass.replace(' ' + clsName + ' ', ' ');
}
}
if (!el.classList) {
el.className = trim(curClass);
}
}
exports.removeClass = removeClass;
/* istanbul ignore next */
// Here I want to use the type CSSStyleDeclaration, but the definition for CSSStyleDeclaration
// has { [index: number]: string } in its type annotation, which does not satisfy the method
// camelize(s: string)
// Same as the return type
const getStyle = function (element, styleName) {
if (isServer_1.default)
return;
if (!element || !styleName)
return null;
styleName = util_1.camelize(styleName);
if (styleName === 'float') {
styleName = 'cssFloat';
}
try {
const style = element.style[styleName];
if (style)
return style;
const computed = document.defaultView.getComputedStyle(element, '');
return computed ? computed[styleName] : '';
}
catch (e) {
return element.style[styleName];
}
};
exports.getStyle = getStyle;
/* istanbul ignore next */
function setStyle(element, styleName, value) {
if (!element || !styleName)
return;
if (util_1.isObject(styleName)) {
Object.keys(styleName).forEach(prop => {
setStyle(element, prop, styleName[prop]);
});
}
else {
styleName = util_1.camelize(styleName);
element.style[styleName] = value;
}
}
exports.setStyle = setStyle;
function removeStyle(element, style) {
if (!element || !style)
return;
if (util_1.isObject(style)) {
Object.keys(style).forEach(prop => {
setStyle(element, prop, '');
});
}
else {
setStyle(element, style, '');
}
}
exports.removeStyle = removeStyle;
const isScroll = (el, isVertical) => {
if (isServer_1.default)
return;
const determinedDirection = isVertical === null || isVertical === undefined;
const overflow = determinedDirection
? exports.getStyle(el, 'overflow')
: isVertical
? exports.getStyle(el, 'overflow-y')
: exports.getStyle(el, 'overflow-x');
return overflow.match(/(scroll|auto|overlay)/);
};
exports.isScroll = isScroll;
const getScrollContainer = (el, isVertical) => {
if (isServer_1.default)
return;
let parent = el;
while (parent) {
if ([window, document, document.documentElement].includes(parent)) {
return window;
}
if (exports.isScroll(parent, isVertical)) {
return parent;
}
parent = parent.parentNode;
}
return parent;
};
exports.getScrollContainer = getScrollContainer;
const isInContainer = (el, container) => {
if (isServer_1.default || !el || !container)
return false;
const elRect = el.getBoundingClientRect();
let containerRect;
if ([window, document, document.documentElement, null, undefined].includes(container)) {
containerRect = {
top: 0,
right: window.innerWidth,
bottom: window.innerHeight,
left: 0,
};
}
else {
containerRect = container.getBoundingClientRect();
}
return (elRect.top < containerRect.bottom &&
elRect.bottom > containerRect.top &&
elRect.right > containerRect.left &&
elRect.left < containerRect.right);
};
exports.isInContainer = isInContainer;
const getOffsetTop = (el) => {
let offset = 0;
let parent = el;
while (parent) {
offset += parent.offsetTop;
parent = parent.offsetParent;
}
return offset;
};
exports.getOffsetTop = getOffsetTop;
const getOffsetTopDistance = (el, containerEl) => {
return Math.abs(exports.getOffsetTop(el) - exports.getOffsetTop(containerEl));
};
exports.getOffsetTopDistance = getOffsetTopDistance;
const stop = (e) => e.stopPropagation();
exports.stop = stop;