This commit is contained in:
Rene
2021-04-18 18:15:04 +02:00
parent c827cf8e7e
commit 06ffd92758
15 changed files with 225 additions and 221 deletions
+2 -2
View File
@@ -59,8 +59,8 @@
"rollup-plugin-terser": "^6.1.0",
"rollup-plugin-typescript2": "^0.27.1",
"should": "^13.2.3",
"tslib": "^2.1.0",
"typescript": "^4.1.5",
"tslib": "^2.2.0",
"typescript": "^4.2.4",
"utf-8-validate": "^5.0.2"
},
"scripts": {
+75 -95
View File
@@ -432,6 +432,7 @@ const on = (target, eventNames, listener, options) => {
};
const stopPropagation = (evt) => evt.stopPropagation();
const preventDefault = (evt) => evt.preventDefault();
const stopAndPrevent = (evt) => stopPropagation(evt) || preventDefault(evt);
const equal = (a, b, props, propMutation) => {
if (a && b) {
@@ -1478,18 +1479,8 @@ const createOverflowLifecycle = (lifecycleHub) => {
const animationStartEventName = 'animationstart';
const scrollEventName = 'scroll';
const scrollAmount = 3333333;
const directionIsRTLMap = {
direction: ['rtl'],
};
const directionIsRTL = (elm) => {
let isRTL = false;
const styles = style(elm, ['direction']);
each(styles, (value, key) => {
isRTL = isRTL || indexOf(directionIsRTLMap[key], value) > -1;
});
return isRTL;
};
const directionIsRTL = (elm) => style(elm, 'direction') === 'rtl';
const domRectHasDimensions = (rect) => rect && (rect.height || rect.width);
@@ -1569,21 +1560,18 @@ const createSizeObserver = (target, onSizeChangedCallback, options) => {
currSize = offsetSize(listenerElement);
isDirty = !scrollEvent || !equalWH(currSize, cacheSize);
if (scrollEvent && isDirty && !rAFId) {
cAF(rAFId);
rAFId = rAF(onResized);
} else if (!scrollEvent) {
if (scrollEvent) {
stopAndPrevent(scrollEvent);
if (isDirty && !rAFId) {
cAF(rAFId);
rAFId = rAF(onResized);
}
} else {
onResized();
}
reset();
if (scrollEvent) {
preventDefault(scrollEvent);
stopPropagation(scrollEvent);
}
return false;
};
push(offListeners, [on(expandElement, scrollEventName, onScroll), on(shrinkElement, scrollEventName, onScroll)]);
@@ -1592,7 +1580,7 @@ const createSizeObserver = (target, onSizeChangedCallback, options) => {
height: scrollAmount,
});
reset();
appearCallback = observeAppearChange ? () => onScroll() : reset;
appearCallback = observeAppearChange ? onScroll.bind(0, false) : reset;
}
if (observeDirectionChange) {
@@ -1620,9 +1608,7 @@ const createSizeObserver = (target, onSizeChangedCallback, options) => {
onSizeChangedCallbackProxy(directionIsRTLCacheValues);
}
preventDefault(event);
stopPropagation(event);
return false;
stopAndPrevent(event);
})
);
}
@@ -1659,7 +1645,7 @@ const createSizeObserver = (target, onSizeChangedCallback, options) => {
};
const createTrinsicObserver = (target, onTrinsicChangedCallback) => {
const trinsicObserver = createDOM(`<div class="${classNameTrinsicObserver}"></div>`)[0];
const trinsicObserver = createDiv(classNameTrinsicObserver);
const offListeners = [];
const { _update: updateHeightIntrinsicCache, _current: getCurrentHeightIntrinsicCache } = createCache(
(ioEntryOrSize) => ioEntryOrSize.h === 0 || ioEntryOrSize.isIntersecting || ioEntryOrSize.intersectionRatio > 0,
@@ -1718,59 +1704,54 @@ const createTrinsicObserver = (target, onTrinsicChangedCallback) => {
};
};
const createEventContentChange = (target, eventContentChange, map, callback) => {
const createEventContentChange = (target, eventContentChange, callback) => {
let map;
let eventContentChangeRef;
const addEvent = (elm, eventName) => {
const entry = map.get(elm);
const newEntry = isUndefined(entry);
const registerEvent = () => {
map.set(elm, eventName);
on(elm, eventName, callback);
};
if (!newEntry && eventName !== entry) {
off(elm, entry, callback);
registerEvent();
} else if (newEntry) {
registerEvent();
const _destroy = () => {
if (map) {
map.forEach((eventName, elm) => off(elm, eventName, callback));
map.clear();
}
};
const _destroy = () => {
map.forEach((eventName, elm) => {
off(elm, eventName, callback);
});
map.clear();
};
const _updateElements = (getElements) => {
if (eventContentChangeRef) {
if (map && eventContentChangeRef) {
const eventElmList = eventContentChangeRef.reduce((arr, item) => {
if (item) {
const selector = item[0];
const eventName = item[1];
const elements = eventName && selector && (getElements ? getElements(selector) : find(selector, target));
const eventNames = item[1];
const elements = eventNames && selector && (getElements ? getElements(selector) : find(selector, target));
const parsedEventNames = isFunction(eventNames) ? eventNames(elements) : eventNames;
if (elements) {
push(arr, [elements, isFunction(eventName) ? eventName(elements) : eventName], true);
if (elements && elements.length && parsedEventNames && isString(parsedEventNames)) {
push(arr, [elements, parsedEventNames.trim()], true);
}
}
return arr;
}, []);
each(eventElmList, (item) => {
const elements = item[0];
const eventName = item[1];
each(elements, (elm) => {
addEvent(elm, eventName);
});
});
each(eventElmList, (item) =>
each(item[0], (elm) => {
const eventNames = item[1];
const registredEventNames = map.get(elm);
const newEntry = isUndefined(registredEventNames);
const changingExistingEntry = !newEntry && eventNames !== registredEventNames;
const finalEventNames = changingExistingEntry ? `${registredEventNames} ${eventNames}` : eventNames;
if (changingExistingEntry) {
off(elm, registredEventNames, callback);
}
map.set(elm, finalEventNames);
on(elm, finalEventNames, callback);
})
);
}
};
const _update = (newEventContentChange) => {
const _updateEventContentChange = (newEventContentChange) => {
map = map || new Map();
eventContentChangeRef = newEventContentChange;
_destroy();
@@ -1779,38 +1760,37 @@ const createEventContentChange = (target, eventContentChange, map, callback) =>
};
if (eventContentChange) {
_update(eventContentChange);
_updateEventContentChange(eventContentChange);
}
return {
_destroy,
_updateElements,
_update,
_updateEventContentChange,
};
};
const createDOMObserver = (target, callback, options) => {
const createDOMObserver = (target, isContentObserver, callback, options) => {
let isConnected = false;
const {
_observeContent,
_attributes,
_styleChangingAttributes,
_eventContentChange,
_nestedTargetSelector,
_ignoreTargetAttrChange: _ignoreTargetChange,
_ignoreTargetChange,
_ignoreNestedTargetChange,
_ignoreContentChange,
} = options || {};
const {
_updateElements: updateEventContentChangeElements,
_destroy: destroyEventContentChange,
_update: updateEventContentChange,
_updateElements: updateEventContentChangeElements,
_updateEventContentChange: updateEventContentChange,
} = createEventContentChange(
target,
_observeContent && _eventContentChange,
new Map(),
isContentObserver && _eventContentChange,
debounce(() => {
if (isConnected) {
callback([], false, true);
callback(true);
}
}, 84)
);
@@ -1819,7 +1799,7 @@ const createDOMObserver = (target, callback, options) => {
const observedAttributes = finalAttributes.concat(finalStyleChangingAttributes);
const observerCallback = (mutations) => {
const ignoreTargetChange = _ignoreTargetChange || noop;
const ignoreTargetChange = (isContentObserver ? _ignoreNestedTargetChange : _ignoreTargetChange) || noop;
const ignoreContentChange = _ignoreContentChange || noop;
const targetChangedAttrs = [];
const totalAddedNodes = [];
@@ -1833,20 +1813,11 @@ const createDOMObserver = (target, callback, options) => {
const targetIsMutationTarget = target === mutationTarget;
const attributeValue = isAttributesType && isString(attributeName) ? attr(mutationTarget, attributeName) : 0;
const attributeChanged = attributeValue !== 0 && oldValue !== attributeValue;
const targetAttrChanged =
attributeChanged &&
targetIsMutationTarget &&
!_observeContent &&
!ignoreTargetChange(mutationTarget, attributeName, oldValue, attributeValue);
const styleChangingAttrChanged = indexOf(finalStyleChangingAttributes, attributeName) > -1 && attributeChanged;
if (targetAttrChanged) {
push(targetChangedAttrs, attributeName);
}
if (_observeContent) {
if (isContentObserver && !targetIsMutationTarget) {
const notOnlyAttrChanged = !isAttributesType;
const contentAttrChanged = isAttributesType && styleChangingAttrChanged && !targetIsMutationTarget;
const contentAttrChanged = isAttributesType && styleChangingAttrChanged;
const isNestedTarget = contentAttrChanged && _nestedTargetSelector && is(mutationTarget, _nestedTargetSelector);
const baseAssertion = isNestedTarget
? !ignoreTargetChange(mutationTarget, attributeName, oldValue, attributeValue)
@@ -1857,7 +1828,15 @@ const createDOMObserver = (target, callback, options) => {
childListChanged = childListChanged || isChildListType;
}
targetStyleChanged = targetStyleChanged || (targetAttrChanged && styleChangingAttrChanged);
if (
!isContentObserver &&
targetIsMutationTarget &&
attributeChanged &&
!ignoreTargetChange(mutationTarget, attributeName, oldValue, attributeValue)
) {
push(targetChangedAttrs, attributeName);
targetStyleChanged = targetStyleChanged || styleChangingAttrChanged;
}
});
if (childListChanged && !isEmptyArray(totalAddedNodes)) {
@@ -1869,8 +1848,10 @@ const createDOMObserver = (target, callback, options) => {
);
}
if (!isEmptyArray(targetChangedAttrs) || targetStyleChanged || contentChanged) {
callback(targetChangedAttrs, targetStyleChanged, contentChanged);
if (isContentObserver) {
contentChanged && callback(contentChanged);
} else if (!isEmptyArray(targetChangedAttrs) || targetStyleChanged) {
callback(targetChangedAttrs, targetStyleChanged);
}
};
@@ -1879,13 +1860,13 @@ const createDOMObserver = (target, callback, options) => {
attributes: true,
attributeOldValue: true,
attributeFilter: observedAttributes,
subtree: _observeContent,
childList: _observeContent,
characterData: _observeContent,
subtree: isContentObserver,
childList: isContentObserver,
characterData: isContentObserver,
});
isConnected = true;
return {
_disconnect: () => {
_destroy: () => {
if (isConnected) {
destroyEventContentChange();
mutationObserver.disconnect();
@@ -1893,7 +1874,7 @@ const createDOMObserver = (target, callback, options) => {
}
},
_updateEventContentChange: (newEventContentChange) => {
updateEventContentChange(isConnected && _observeContent && newEventContentChange);
updateEventContentChange(isConnected && isContentObserver && newEventContentChange);
},
_update: () => {
if (isConnected) {
@@ -2077,12 +2058,11 @@ const createLifecycleHub = (options, structureSetup) => {
_appear: true,
_direction: !_nativeScrollbarStyling,
});
const hostMutationObserver = createDOMObserver(_host, onHostMutation, {
const hostMutationObserver = createDOMObserver(_host, false, onHostMutation, {
_styleChangingAttributes: attrs,
_attributes: attrs,
});
const contentMutationObserver = createDOMObserver(_content || _viewport, onContentMutation, {
_observeContent: true,
const contentMutationObserver = createDOMObserver(_content || _viewport, true, onContentMutation, {
_styleChangingAttributes: attrs,
_attributes: attrs,
_eventContentChange: options.updating.elementEvents,
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+76 -94
View File
@@ -490,6 +490,9 @@
var preventDefault = function preventDefault(evt) {
return evt.preventDefault();
};
var stopAndPrevent = function stopAndPrevent(evt) {
return stopPropagation(evt) || preventDefault(evt);
};
var equal = function equal(a, b, props, propMutation) {
if (a && b) {
@@ -1686,17 +1689,9 @@
var animationStartEventName = 'animationstart';
var scrollEventName = 'scroll';
var scrollAmount = 3333333;
var directionIsRTLMap = {
direction: ['rtl'],
};
var directionIsRTL = function directionIsRTL(elm) {
var isRTL = false;
var styles = style(elm, ['direction']);
each(styles, function (value, key) {
isRTL = isRTL || indexOf(directionIsRTLMap[key], value) > -1;
});
return isRTL;
return style(elm, 'direction') === 'rtl';
};
var domRectHasDimensions = function domRectHasDimensions(rect) {
@@ -1806,21 +1801,18 @@
currSize = offsetSize(listenerElement);
isDirty = !scrollEvent || !equalWH(currSize, cacheSize);
if (scrollEvent && isDirty && !rAFId) {
cAF(rAFId);
rAFId = rAF(onResized);
} else if (!scrollEvent) {
if (scrollEvent) {
stopAndPrevent(scrollEvent);
if (isDirty && !rAFId) {
cAF(rAFId);
rAFId = rAF(onResized);
}
} else {
onResized();
}
reset();
if (scrollEvent) {
preventDefault(scrollEvent);
stopPropagation(scrollEvent);
}
return false;
};
push(offListeners, [on(expandElement, scrollEventName, onScroll), on(shrinkElement, scrollEventName, onScroll)]);
@@ -1829,11 +1821,7 @@
height: scrollAmount,
});
reset();
appearCallback = observeAppearChange
? function () {
return onScroll();
}
: reset;
appearCallback = observeAppearChange ? onScroll.bind(0, false) : reset;
}
if (observeDirectionChange) {
@@ -1865,9 +1853,7 @@
onSizeChangedCallbackProxy(directionIsRTLCacheValues);
}
preventDefault(event);
stopPropagation(event);
return false;
stopAndPrevent(event);
})
);
}
@@ -1903,7 +1889,7 @@
};
var createTrinsicObserver = function createTrinsicObserver(target, onTrinsicChangedCallback) {
var trinsicObserver = createDOM('<div class="' + classNameTrinsicObserver + '"></div>')[0];
var trinsicObserver = createDiv(classNameTrinsicObserver);
var offListeners = [];
var _createCache = createCache(
@@ -1968,59 +1954,56 @@
};
};
var createEventContentChange = function createEventContentChange(target, eventContentChange, map, callback) {
var createEventContentChange = function createEventContentChange(target, eventContentChange, callback) {
var map;
var eventContentChangeRef;
var addEvent = function addEvent(elm, eventName) {
var entry = map.get(elm);
var newEntry = isUndefined(entry);
var registerEvent = function registerEvent() {
map.set(elm, eventName);
on(elm, eventName, callback);
};
if (!newEntry && eventName !== entry) {
off(elm, entry, callback);
registerEvent();
} else if (newEntry) {
registerEvent();
var _destroy = function _destroy() {
if (map) {
map.forEach(function (eventName, elm) {
return off(elm, eventName, callback);
});
map.clear();
}
};
var _destroy = function _destroy() {
map.forEach(function (eventName, elm) {
off(elm, eventName, callback);
});
map.clear();
};
var _updateElements = function _updateElements(getElements) {
if (eventContentChangeRef) {
if (map && eventContentChangeRef) {
var eventElmList = eventContentChangeRef.reduce(function (arr, item) {
if (item) {
var selector = item[0];
var eventName = item[1];
var elements = eventName && selector && (getElements ? getElements(selector) : find(selector, target));
var eventNames = item[1];
var elements = eventNames && selector && (getElements ? getElements(selector) : find(selector, target));
var parsedEventNames = isFunction(eventNames) ? eventNames(elements) : eventNames;
if (elements) {
push(arr, [elements, isFunction(eventName) ? eventName(elements) : eventName], true);
if (elements && elements.length && parsedEventNames && isString(parsedEventNames)) {
push(arr, [elements, parsedEventNames.trim()], true);
}
}
return arr;
}, []);
each(eventElmList, function (item) {
var elements = item[0];
var eventName = item[1];
each(elements, function (elm) {
addEvent(elm, eventName);
return each(item[0], function (elm) {
var eventNames = item[1];
var registredEventNames = map.get(elm);
var newEntry = isUndefined(registredEventNames);
var changingExistingEntry = !newEntry && eventNames !== registredEventNames;
var finalEventNames = changingExistingEntry ? registredEventNames + ' ' + eventNames : eventNames;
if (changingExistingEntry) {
off(elm, registredEventNames, callback);
}
map.set(elm, finalEventNames);
on(elm, finalEventNames, callback);
});
});
}
};
var _update = function _update(newEventContentChange) {
var _updateEventContentChange = function _updateEventContentChange(newEventContentChange) {
map = map || new Map();
eventContentChangeRef = newEventContentChange;
_destroy();
@@ -2029,48 +2012,47 @@
};
if (eventContentChange) {
_update(eventContentChange);
_updateEventContentChange(eventContentChange);
}
return {
_destroy: _destroy,
_updateElements: _updateElements,
_update: _update,
_updateEventContentChange: _updateEventContentChange,
};
};
var createDOMObserver = function createDOMObserver(target, callback, options) {
var createDOMObserver = function createDOMObserver(target, isContentObserver, callback, options) {
var isConnected = false;
var _ref = options || {},
_observeContent = _ref._observeContent,
_attributes = _ref._attributes,
_styleChangingAttributes = _ref._styleChangingAttributes,
_eventContentChange = _ref._eventContentChange,
_nestedTargetSelector = _ref._nestedTargetSelector,
_ignoreTargetChange = _ref._ignoreTargetAttrChange,
_ignoreTargetChange = _ref._ignoreTargetChange,
_ignoreNestedTargetChange = _ref._ignoreNestedTargetChange,
_ignoreContentChange = _ref._ignoreContentChange;
var _createEventContentCh = createEventContentChange(
target,
_observeContent && _eventContentChange,
new Map(),
isContentObserver && _eventContentChange,
debounce(function () {
if (isConnected) {
callback([], false, true);
callback(true);
}
}, 84)
),
updateEventContentChangeElements = _createEventContentCh._updateElements,
destroyEventContentChange = _createEventContentCh._destroy,
updateEventContentChange = _createEventContentCh._update;
updateEventContentChangeElements = _createEventContentCh._updateElements,
updateEventContentChange = _createEventContentCh._updateEventContentChange;
var finalAttributes = _attributes || [];
var finalStyleChangingAttributes = _styleChangingAttributes || [];
var observedAttributes = finalAttributes.concat(finalStyleChangingAttributes);
var observerCallback = function observerCallback(mutations) {
var ignoreTargetChange = _ignoreTargetChange || noop;
var ignoreTargetChange = (isContentObserver ? _ignoreNestedTargetChange : _ignoreTargetChange) || noop;
var ignoreContentChange = _ignoreContentChange || noop;
var targetChangedAttrs = [];
var totalAddedNodes = [];
@@ -2088,20 +2070,11 @@
var targetIsMutationTarget = target === mutationTarget;
var attributeValue = isAttributesType && isString(attributeName) ? attr(mutationTarget, attributeName) : 0;
var attributeChanged = attributeValue !== 0 && oldValue !== attributeValue;
var targetAttrChanged =
attributeChanged &&
targetIsMutationTarget &&
!_observeContent &&
!ignoreTargetChange(mutationTarget, attributeName, oldValue, attributeValue);
var styleChangingAttrChanged = indexOf(finalStyleChangingAttributes, attributeName) > -1 && attributeChanged;
if (targetAttrChanged) {
push(targetChangedAttrs, attributeName);
}
if (_observeContent) {
if (isContentObserver && !targetIsMutationTarget) {
var notOnlyAttrChanged = !isAttributesType;
var contentAttrChanged = isAttributesType && styleChangingAttrChanged && !targetIsMutationTarget;
var contentAttrChanged = isAttributesType && styleChangingAttrChanged;
var isNestedTarget = contentAttrChanged && _nestedTargetSelector && is(mutationTarget, _nestedTargetSelector);
var baseAssertion = isNestedTarget
? !ignoreTargetChange(mutationTarget, attributeName, oldValue, attributeValue)
@@ -2112,7 +2085,15 @@
childListChanged = childListChanged || isChildListType;
}
targetStyleChanged = targetStyleChanged || (targetAttrChanged && styleChangingAttrChanged);
if (
!isContentObserver &&
targetIsMutationTarget &&
attributeChanged &&
!ignoreTargetChange(mutationTarget, attributeName, oldValue, attributeValue)
) {
push(targetChangedAttrs, attributeName);
targetStyleChanged = targetStyleChanged || styleChangingAttrChanged;
}
});
if (childListChanged && !isEmptyArray(totalAddedNodes)) {
@@ -2124,8 +2105,10 @@
});
}
if (!isEmptyArray(targetChangedAttrs) || targetStyleChanged || contentChanged) {
callback(targetChangedAttrs, targetStyleChanged, contentChanged);
if (isContentObserver) {
contentChanged && callback(contentChanged);
} else if (!isEmptyArray(targetChangedAttrs) || targetStyleChanged) {
callback(targetChangedAttrs, targetStyleChanged);
}
};
@@ -2134,13 +2117,13 @@
attributes: true,
attributeOldValue: true,
attributeFilter: observedAttributes,
subtree: _observeContent,
childList: _observeContent,
characterData: _observeContent,
subtree: isContentObserver,
childList: isContentObserver,
characterData: isContentObserver,
});
isConnected = true;
return {
_disconnect: function _disconnect() {
_destroy: function _destroy() {
if (isConnected) {
destroyEventContentChange();
mutationObserver.disconnect();
@@ -2148,7 +2131,7 @@
}
},
_updateEventContentChange: function _updateEventContentChange(newEventContentChange) {
updateEventContentChange(isConnected && _observeContent && newEventContentChange);
updateEventContentChange(isConnected && isContentObserver && newEventContentChange);
},
_update: function _update() {
if (isConnected) {
@@ -2351,12 +2334,11 @@
_appear: true,
_direction: !_nativeScrollbarStyling,
});
var hostMutationObserver = createDOMObserver(_host, onHostMutation, {
var hostMutationObserver = createDOMObserver(_host, false, onHostMutation, {
_styleChangingAttributes: attrs,
_attributes: attrs,
});
var contentMutationObserver = createDOMObserver(_content || _viewport, onContentMutation, {
_observeContent: true,
var contentMutationObserver = createDOMObserver(_content || _viewport, true, onContentMutation, {
_styleChangingAttributes: attrs,
_attributes: attrs,
_eventContentChange: options.updating.elementEvents,
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+31 -10
View File
@@ -1,20 +1,41 @@
declare type StringNullUndefined = string | null | undefined;
export declare type DOMObserverEventContentChange = Array<[StringNullUndefined, ((elms: Node[]) => string) | StringNullUndefined] | null | undefined> | false | null | undefined;
export declare type DOMObserverIgnoreContentChange = (mutation: MutationRecord, isNestedTarget: boolean, domObserverTarget: HTMLElement, domObserverOptions: DOMObserverOptions | undefined) => boolean;
export declare type DOMObserverIgnoreTargetAttrChange = (target: Node, attributeName: string, oldAttributeValue: string | null, newAttributeValue: string | null) => boolean;
export interface DOMObserverOptions {
_observeContent?: boolean;
declare type DOMContentObserverCallback = (contentChanged: boolean) => any;
declare type DOMTargetObserverCallback = (targetChangedAttrs: string[], targetStyleChanged: boolean) => any;
interface DOMObserverOptionsBase {
_attributes?: string[];
_styleChangingAttributes?: string[];
}
interface DOMContentObserverOptions extends DOMObserverOptionsBase {
_eventContentChange?: DOMObserverEventContentChange;
_nestedTargetSelector?: string;
_ignoreTargetAttrChange?: DOMObserverIgnoreTargetAttrChange;
_ignoreContentChange?: DOMObserverIgnoreContentChange;
_ignoreNestedTargetChange?: DOMObserverIgnoreTargetChange;
}
export interface DOMObserver {
_disconnect: () => void;
_updateEventContentChange: (newEventContentChange?: DOMObserverEventContentChange) => void;
interface DOMTargetObserverOptions extends DOMObserverOptionsBase {
_ignoreTargetChange?: DOMObserverIgnoreTargetChange;
}
interface DOMObserverBase {
_destroy: () => void;
_update: () => void;
}
export declare const createDOMObserver: (target: HTMLElement, callback: (targetChangedAttrs: string[], targetStyleChanged: boolean, contentChanged: boolean) => any, options?: DOMObserverOptions | undefined) => DOMObserver;
interface DOMContentObserver extends DOMObserverBase {
_updateEventContentChange: (newEventContentChange?: DOMObserverEventContentChange) => void;
}
interface DOMTargetObserver extends DOMObserverBase {
}
export declare type DOMObserverEventContentChange = Array<[StringNullUndefined, ((elms: Node[]) => StringNullUndefined) | StringNullUndefined] | null | undefined> | false | null | undefined;
export declare type DOMObserverIgnoreContentChange = (mutation: MutationRecord, isNestedTarget: boolean, domObserverTarget: HTMLElement, domObserverOptions: DOMContentObserverOptions | undefined) => boolean;
export declare type DOMObserverIgnoreTargetChange = (target: Node, attributeName: string, oldAttributeValue: string | null, newAttributeValue: string | null) => boolean;
export declare type DOMObserverCallback<ContentObserver extends boolean> = ContentObserver extends true ? DOMContentObserverCallback : DOMTargetObserverCallback;
export declare type DOMObserverOptions<ContentObserver extends boolean> = ContentObserver extends true ? DOMContentObserverOptions : DOMTargetObserverOptions;
export declare type DOMObserver<ContentObserver extends boolean> = ContentObserver extends true ? DOMContentObserver : DOMTargetObserver;
/**
* Creates a DOM observer which observes DOM changes to either the target element or its children.
* @param target The element which shall be observed.
* @param isContentObserver Whether this observer is just observing the target or just the targets children. (not only direct children but also nested ones)
* @param callback The callback which gets called if a change was detected.
* @param options The options for DOM change detection.
* @returns A object which represents the instance of the DOM observer.
*/
export declare const createDOMObserver: <ContentObserver extends boolean>(target: HTMLElement, isContentObserver: ContentObserver, callback: DOMObserverCallback<ContentObserver>, options?: DOMObserverOptions<ContentObserver> | undefined) => DOMObserver<ContentObserver>;
export {};
@@ -9,4 +9,11 @@ export interface SizeObserver {
_directionIsRTL: CacheValues<boolean>;
};
}
/**
* Creates a size observer which observes any size, padding, margin and border changes of the target element. Depending on the options also direction and appear can be observed.
* @param target The target element which shall be observed.
* @param onSizeChangedCallback The callback which gets called after a size change was detected.
* @param options The options for size detection, whether to observe also direction and appear.
* @returns A object which represents the instance of the size observer.
*/
export declare const createSizeObserver: (target: HTMLElement, onSizeChangedCallback: (directionIsRTLCache?: CacheValues<boolean> | undefined) => any, options?: SizeObserverOptions | undefined) => SizeObserver;
@@ -5,4 +5,10 @@ export interface TrinsicObserver {
_heightIntrinsic: CacheValues<boolean>;
};
}
/**
* Creates a trinsic observer which observes changes to intrinsic or extrinsic sizing for the height of the target element.
* @param target The element which shall be observed.
* @param onTrinsicChangedCallback The callback which gets called after a change was detected.
* @returns A object which represents the instance of the trinsic observer.
*/
export declare const createTrinsicObserver: (target: HTMLElement, onTrinsicChangedCallback: (heightIntrinsic: CacheValues<boolean>) => any) => TrinsicObserver;
+1 -1
View File
@@ -63,4 +63,4 @@ export interface SizeChangedArgs {
export interface UpdatedArgs {
forced: boolean;
}
export declare const optionsTemplate: import("./support/options").OptionsTemplate<OSOptions>, defaultOptions: OSOptions;
export declare const optionsTemplate: import("support/options").OptionsTemplate<OSOptions>, defaultOptions: OSOptions;
@@ -6,6 +6,9 @@ export declare const IntersectionObserverConstructor: {
new (callback: IntersectionObserverCallback, options?: IntersectionObserverInit | undefined): IntersectionObserver;
prototype: IntersectionObserver;
} | undefined;
export declare const ResizeObserverConstructor: any | undefined;
export declare const ResizeObserverConstructor: {
new (callback: ResizeObserverCallback): ResizeObserver;
prototype: ResizeObserver;
} | undefined;
export declare const cAF: typeof cancelAnimationFrame | undefined;
export declare const rAF: typeof requestAnimationFrame | undefined;
@@ -29,3 +29,8 @@ export declare const stopPropagation: (evt: Event) => void;
* @param evt The event of which the preventDefault method shall be called.
*/
export declare const preventDefault: (evt: Event) => void;
/**
* Shorthand for the stopPropagation and preventDefault event Method.
* @param evt The event of which the stopPropagation and preventDefault methods shall be called.
*/
export declare const stopAndPrevent: (evt: Event) => void;
+6 -6
View File
@@ -7,12 +7,12 @@ declare type RunEachItem = ((...args: any) => any | any[]) | null | undefined;
* If the function returns true its treated like a "continue" statement.
* If the function returns false its treated like a "break" statement.
*/
export declare function each<T>(array: Array<T> | ReadonlyArray<T>, callback: (value: T, indexOrKey: number, source: Array<T>) => boolean | void): Array<T> | ReadonlyArray<T>;
export declare function each<T>(array: Array<T> | ReadonlyArray<T> | null | undefined, callback: (value: T, indexOrKey: number, source: Array<T>) => boolean | void): Array<T> | ReadonlyArray<T> | null | undefined;
export declare function each<T>(arrayLikeObject: ArrayLike<T>, callback: (value: T, indexOrKey: number, source: ArrayLike<T>) => boolean | void): ArrayLike<T>;
export declare function each<T>(arrayLikeObject: ArrayLike<T> | null | undefined, callback: (value: T, indexOrKey: number, source: ArrayLike<T>) => boolean | void): ArrayLike<T> | null | undefined;
export declare function each(obj: PlainObject, callback: (value: any, indexOrKey: string, source: PlainObject) => boolean | void): PlainObject;
export declare function each(obj: PlainObject | null | undefined, callback: (value: any, indexOrKey: string, source: PlainObject) => boolean | void): PlainObject | null | undefined;
export declare function each<T>(array: Array<T> | ReadonlyArray<T>, callback: (value: T, indexOrKey: number, source: Array<T>) => boolean | unknown): Array<T> | ReadonlyArray<T>;
export declare function each<T>(array: Array<T> | ReadonlyArray<T> | null | undefined, callback: (value: T, indexOrKey: number, source: Array<T>) => boolean | unknown): Array<T> | ReadonlyArray<T> | null | undefined;
export declare function each<T>(arrayLikeObject: ArrayLike<T>, callback: (value: T, indexOrKey: number, source: ArrayLike<T>) => boolean | unknown): ArrayLike<T>;
export declare function each<T>(arrayLikeObject: ArrayLike<T> | null | undefined, callback: (value: T, indexOrKey: number, source: ArrayLike<T>) => boolean | unknown): ArrayLike<T> | null | undefined;
export declare function each(obj: PlainObject, callback: (value: any, indexOrKey: string, source: PlainObject) => boolean | unknown): PlainObject;
export declare function each(obj: PlainObject | null | undefined, callback: (value: any, indexOrKey: string, source: PlainObject) => boolean | unknown): PlainObject | null | undefined;
/**
* Returns the index of the given inside the given array or -1 if the given item isn't part of the given array.
* @param arr The array.
+8 -8
View File
@@ -8662,10 +8662,10 @@ tslib@^1.8.1, tslib@^1.9.0:
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.13.0.tgz#c881e13cc7015894ed914862d276436fa9a47043"
integrity sha512-i/6DQjL8Xf3be4K/E6Wgpekn5Qasl1usyw++dAA35Ue5orEn65VIxOA+YvNNl9HV3qv70T7CNwjODHZrLwvd1Q==
tslib@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.1.0.tgz#da60860f1c2ecaa5703ab7d39bc05b6bf988b97a"
integrity sha512-hcVC3wYEziELGGmEEXue7D75zbwIIVUMWAVbHItGPx0ziyXxrOMQx4rQEVEV45Ut/1IotuEvwqPopzIOkDMf0A==
tslib@^2.2.0:
version "2.2.0"
resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.2.0.tgz#fb2c475977e35e241311ede2693cee1ec6698f5c"
integrity sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w==
tsutils@^3.17.1:
version "3.17.1"
@@ -8740,10 +8740,10 @@ typescript@^3.9.3:
resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.9.7.tgz#98d600a5ebdc38f40cb277522f12dc800e9e25fa"
integrity sha512-BLbiRkiBzAwsjut4x/dsibSTB6yWpwT5qWmC2OfuCg3GgVQCSgMs4vEctYPhsaGtd0AeuuHMkjZ2h2WG8MSzRw==
typescript@^4.1.5:
version "4.1.5"
resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.1.5.tgz#123a3b214aaff3be32926f0d8f1f6e704eb89a72"
integrity sha512-6OSu9PTIzmn9TCDiovULTnET6BgXtDYL4Gg4szY+cGsc3JP1dQL8qvE8kShTRx1NIw4Q9IBHlwODjkjWEtMUyA==
typescript@^4.2.4:
version "4.2.4"
resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.2.4.tgz#8610b59747de028fda898a8aef0e103f156d0961"
integrity sha512-V+evlYHZnQkaz8TRBuxTA92yZBPotr5H+WhQ7bD3hZUndx5tGOa1fuCgeSjxAzM1RiN5IzvadIXTVefuuwZCRg==
unicode-canonical-property-names-ecmascript@^1.0.4:
version "1.0.4"