improve code

This commit is contained in:
Rene
2022-07-17 22:00:15 +02:00
parent 733f990200
commit cd9c01a588
5 changed files with 35 additions and 34 deletions
@@ -252,7 +252,9 @@ export const scrollbarsHidingPlugin: Plugin<ScrollbarsHidingPluginInstance> = {
h: sizeNew.h - size.h,
};
if (deltaSize.w === 0 && deltaSize.h === 0) return;
if (deltaSize.w === 0 && deltaSize.h === 0) {
return;
}
const deltaAbsSize = {
w: abs(deltaSize.w),
@@ -17,6 +17,7 @@ import {
fractionalSize,
isFunction,
ResizeObserverConstructor,
closest,
} from 'support';
import { getEnvironment } from 'environment';
import {
@@ -24,6 +25,7 @@ import {
dataValueHostOverflowVisible,
classNameViewport,
classNameOverflowVisible,
classNameScrollbar,
} from 'classnames';
import { createSizeObserver, SizeObserverCallbackParams } from 'observers/sizeObserver';
import { createTrinsicObserver } from 'observers/trinsicObserver';
@@ -231,9 +233,13 @@ export const createStructureSetupObservers = (
const { target, attributeName } = mutation;
const ignore =
!isNestedTarget && attributeName
? liesBetween(target as Element, hostSelector, viewportSelector)
? liesBetween(target, hostSelector, viewportSelector)
: false;
return ignore || !!ignoreMutationFromOptions(mutation);
return (
ignore ||
!!closest(target, `.${classNameScrollbar}`) || // ignore explicitely all scrollbar elements
!!ignoreMutationFromOptions(mutation)
);
},
}
);
@@ -2,21 +2,25 @@ import { isString } from 'support/utils/types';
import { each } from 'support/utils/array';
import { keys } from 'support/utils/object';
type ClassContainingElement = Node | Element | false | null | undefined;
type ClassName = string | false | null | undefined;
const rnothtmlwhite = /[^\x20\t\r\n\f]+/g;
const classListAction = (
elm: Element | false | null | undefined,
className: string | false | null | undefined,
elm: ClassContainingElement,
className: ClassName,
action: (elmClassList: DOMTokenList, clazz: string) => boolean | void
): boolean => {
const classList = elm && (elm as Element).classList;
let clazz: string;
let i = 0;
let result = false;
if (elm && className && isString(className)) {
if (classList && className && isString(className)) {
const classes: Array<string> = className.match(rnothtmlwhite) || [];
result = classes.length > 0;
while ((clazz = classes[i++])) {
result = !!action(elm.classList, clazz) && result;
result = !!action(classList, clazz) && result;
}
}
return result;
@@ -27,20 +31,15 @@ const classListAction = (
* @param elm The element.
* @param className The class name(s).
*/
export const hasClass = (
elm: Element | false | null | undefined,
className: string | false | null | undefined
): boolean => classListAction(elm, className, (classList, clazz) => classList.contains(clazz));
export const hasClass = (elm: ClassContainingElement, className: ClassName): boolean =>
classListAction(elm, className, (classList, clazz) => classList.contains(clazz));
/**
* Removes the given class name(s) from the given element.
* @param elm The element.
* @param className The class name(s) which shall be removed. (separated by spaces)
*/
export const removeClass = (
elm: Element | false | null | undefined,
className: string | false | null | undefined
): void => {
export const removeClass = (elm: ClassContainingElement, className: ClassName): void => {
classListAction(elm, className, (classList, clazz) => classList.remove(clazz));
};
@@ -50,10 +49,7 @@ export const removeClass = (
* @param className The class name(s) which shall be added. (separated by spaces)
* @returns A function which removes the added class name(s).
*/
export const addClass = (
elm: Element | false | null | undefined,
className: string | false | null | undefined
): (() => void) => {
export const addClass = (elm: ClassContainingElement, className: ClassName): (() => void) => {
classListAction(elm, className, (classList, clazz) => classList.add(clazz));
return removeClass.bind(0, elm, className);
};
@@ -63,10 +59,7 @@ export const addClass = (
* @param classNameA ClassName A.
* @param classNameB ClassName B.
*/
export const diffClass = (
classNameA: string | null | undefined,
classNameB: string | null | undefined
) => {
export const diffClass = (classNameA: ClassName, classNameB: ClassName) => {
const classNameASplit = classNameA && classNameA.split(' ');
const classNameBSplit = classNameB && classNameB.split(' ');
const tempObj = {};
@@ -1,8 +1,8 @@
import { isElement } from 'support/utils/types';
import { push, from } from 'support/utils/array';
type InputElementType = Element | Node | false | null | undefined;
type OutputElementType = Element | null;
type InputElementType = Node | Element | Node | false | null | undefined;
type OutputElementType = Node | Element | null;
const elmPrototype = Element.prototype;
@@ -74,7 +74,7 @@ const contents = (elm: InputElementType): ReadonlyArray<ChildNode> =>
*/
const parent = (elm: InputElementType): OutputElementType => (elm ? elm.parentElement : null);
const closest = (elm: InputElementType, selector: string): OutputElementType => {
export const closest = (elm: InputElementType, selector: string): OutputElementType => {
if (isElement(elm)) {
const closestFn = elmPrototype.closest;
if (closestFn) {
@@ -15,29 +15,29 @@ export function each<T>(
callback: (value: T, indexOrKey: number, source: Array<T>) => boolean | unknown
): Array<T> | ReadonlyArray<T>;
export function each<T>(
array: Array<T> | ReadonlyArray<T> | null | undefined,
array: Array<T> | ReadonlyArray<T> | false | null | undefined,
callback: (value: T, indexOrKey: number, source: Array<T>) => boolean | unknown
): Array<T> | ReadonlyArray<T> | null | undefined;
): Array<T> | ReadonlyArray<T> | false | null | undefined;
export function each<T>(
arrayLikeObject: ArrayLike<T>,
callback: (value: T, indexOrKey: number, source: ArrayLike<T>) => boolean | unknown
): ArrayLike<T>;
export function each<T>(
arrayLikeObject: ArrayLike<T> | null | undefined,
arrayLikeObject: ArrayLike<T> | false | null | undefined,
callback: (value: T, indexOrKey: number, source: ArrayLike<T>) => boolean | unknown
): ArrayLike<T> | null | undefined;
): ArrayLike<T> | false | null | undefined;
export function each(
obj: PlainObject,
callback: (value: any, indexOrKey: string, source: PlainObject) => boolean | unknown
): PlainObject;
export function each(
obj: PlainObject | null | undefined,
obj: PlainObject | false | null | undefined,
callback: (value: any, indexOrKey: string, source: PlainObject) => boolean | unknown
): PlainObject | null | undefined;
): PlainObject | false | null | undefined;
export function each<T>(
source: Array<T> | ArrayLike<T> | ReadonlyArray<T> | PlainObject | null | undefined,
source: Array<T> | ArrayLike<T> | ReadonlyArray<T> | PlainObject | false | null | undefined,
callback: (value: T, indexOrKey: any, source: any) => boolean | unknown
): Array<T> | ArrayLike<T> | ReadonlyArray<T> | PlainObject | null | undefined {
): Array<T> | ArrayLike<T> | ReadonlyArray<T> | PlainObject | false | null | undefined {
if (isArrayLike(source)) {
for (let i = 0; i < source.length; i++) {
if (callback(source[i], i, source) === false) {