mirror of
https://github.com/tenrok/OverlayScrollbars.git
synced 2026-06-08 03:02:26 +03:00
build
This commit is contained in:
+2
-2
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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;
|
||||
|
||||
@@ -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.
|
||||
|
||||
@@ -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"
|
||||
|
||||
Reference in New Issue
Block a user