@blackbyte/sugar 1.0.0-beta.28 → 1.0.0-beta.29

package/dist/js/dom/when/whenInteract/whenInteract.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"whenInteract.js","sourceRoot":"","sources":["../../../../../src/js/dom/when/whenInteract/whenInteract.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AAWH,MAAM,CAAC,OAAO,UAAU,YAAY,CAClC,GAAgB,EAChB,QAAyC;IAEzC,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;QACrC,MAAM,aAAa,mBACjB,WAAW,EAAE,IAAI,EACjB,UAAU,EAAE,IAAI,EAChB,WAAW,EAAE,IAAI,EACjB,UAAU,EAAE,IAAI,EAChB,QAAQ,EAAE,IAAI,EACd,KAAK,EAAE,IAAI,IACR,CAAC,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,EAAE,CAAC,CACpB,CAAC;QAEF,SAAS,UAAU,CAAC,WAAW;YAC7B,wBAAwB;YACxB,OAAO,CAAC,WAAW,CAAC,CAAC;YAErB,GAAG,CAAC,mBAAmB,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;YACpD,GAAG,CAAC,mBAAmB,CAAC,YAAY,EAAE,UAAU,CAAC,CAAC;YAClD,GAAG,CAAC,mBAAmB,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;YACpD,GAAG,CAAC,mBAAmB,CAAC,YAAY,EAAE,UAAU,CAAC,CAAC;YAClD,GAAG,CAAC,mBAAmB,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;YAC9C,GAAG,CAAC,mBAAmB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;YACxC,GAAG,CAAC,mBAAmB,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;QAC5C,CAAC;QAED,SAAS,WAAW,CAAC,CAAC;YACpB,UAAU,CAAC,aAAa,CAAC,CAAC;QAC5B,CAAC;QACD,IAAI,aAAa,CAAC,WAAW,EAAE,CAAC;YAC9B,GAAG,CAAC,gBAAgB,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;QACnD,CAAC;QAED,SAAS,UAAU,CAAC,CAAC;YACnB,UAAU,CAAC,YAAY,CAAC,CAAC;QAC3B,CAAC;QACD,IAAI,aAAa,CAAC,UAAU,EAAE,CAAC;YAC7B,GAAG,CAAC,gBAAgB,CAAC,YAAY,EAAE,UAAU,CAAC,CAAC;QACjD,CAAC;QAED,SAAS,WAAW,CAAC,CAAC;YACpB,UAAU,CAAC,aAAa,CAAC,CAAC;QAC5B,CAAC;QACD,IAAI,aAAa,CAAC,WAAW,EAAE,CAAC;YAC9B,GAAG,CAAC,gBAAgB,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;QACnD,CAAC;QAED,SAAS,UAAU,CAAC,CAAC;YACnB,UAAU,CAAC,YAAY,CAAC,CAAC;QAC3B,CAAC;QACD,IAAI,aAAa,CAAC,UAAU,EAAE,CAAC;YAC7B,GAAG,CAAC,gBAAgB,CAAC,YAAY,EAAE,UAAU,EAAE;gBAC7C,OAAO,EAAE,IAAI;aACd,CAAC,CAAC;QACL,CAAC;QAED,SAAS,QAAQ,CAAC,CAAC;YACjB,UAAU,CAAC,UAAU,CAAC,CAAC;QACzB,CAAC;QACD,IAAI,aAAa,CAAC,QAAQ,EAAE,CAAC;YAC3B,GAAG,CAAC,gBAAgB,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;QAC7C,CAAC;QAED,SAAS,KAAK,CAAC,CAAC;YACd,UAAU,CAAC,OAAO,CAAC,CAAC;QACtB,CAAC;QACD,IAAI,aAAa,CAAC,KAAK,KAAK,IAAI,EAAE,CAAC;YACjC,GAAG,CAAC,gBAAgB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;YACrC,GAAG,CAAC,gBAAgB,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;QACzC,CAAC;IACH,CAAC,CAAC,CAAC;AACL,CAAC"}

package/dist/js/dom/when/whenLinkLoaded/whenLinkLoaded.d.ts

@@ -0,0 +1 @@
+export default function whenLinkLoaded($link: HTMLLinkElement, cb?: Function): Promise<HTMLLinkElement>;

package/dist/js/dom/when/whenLinkLoaded/whenLinkLoaded.js

@@ -0,0 +1,73 @@
+/**
+ * @name            whenLinkLoaded
+ * @namespace       js.dom.when
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ *
+ * Wait until the passed HTMLLinkElement is fully loaded
+ *
+ * @feature       Promise based API
+ *
+ * @param 		{HTMLLinkElement} 			$link  		    The link tag to check the loading state
+ * @return 		{Promise} 								            The promise that will be resolved
+ *
+ * @todo      tests
+ *
+ * @snippet         whenLinkLoaded($1)
+ * whenLinkLoaded($1).then(\$elm => {
+ *   $2
+ * });
+ *
+ * @example  	js
+ * import { whenLinkLoaded } from '@blackbyte/sugar/dom'
+ * whenLinkLoaded($myCoolHTMLLinlElement).then($link => {
+ *   // do something when the link is loaded
+ * });
+ *
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+function alreadyLoaded(link) {
+    var _a;
+    const href = link.href;
+    let result = false;
+    for (let i = 0; i < document.styleSheets.length; i++) {
+        if (document.styleSheets[i].href &&
+            ((_a = document.styleSheets[i].href) === null || _a === void 0 ? void 0 : _a.match(href))) {
+            // the css is already loaded
+            result = true;
+        }
+        else if (i == document.styleSheets.length - 1) {
+            // Fallback. There is no request for the css file.
+        }
+    }
+    return result;
+}
+export default function whenLinkLoaded($link, cb) {
+    return new Promise((resolve, reject) => {
+        // check if image is already loaded
+        if (alreadyLoaded($link)) {
+            // resolve promise
+            resolve($link);
+            // call the cb if exist
+            cb === null || cb === void 0 ? void 0 : cb($link);
+        }
+        else {
+            const img = document.createElement('img');
+            // wait until loaded
+            // we load the css into an image
+            // when the image is in error more
+            // that mean that the css is loaded
+            img.addEventListener('error', (e) => {
+                // resolve the promise
+                resolve($link);
+                // cb if exist
+                cb === null || cb === void 0 ? void 0 : cb($link);
+            });
+            // set url
+            img.src = $link.href;
+        }
+    });
+}
+//# sourceMappingURL=whenLinkLoaded.js.map

package/dist/js/dom/when/whenLinkLoaded/whenLinkLoaded.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"whenLinkLoaded.js","sourceRoot":"","sources":["../../../../../src/js/dom/when/whenLinkLoaded/whenLinkLoaded.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,SAAS,aAAa,CAAC,IAAqB;;IAC1C,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;IACvB,IAAI,MAAM,GAAG,KAAK,CAAC;IACnB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,CAAC,WAAW,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QACrD,IACE,QAAQ,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,IAAI;aAC5B,MAAA,QAAQ,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,IAAI,0CAAE,KAAK,CAAC,IAAI,CAAC,CAAA,EACzC,CAAC;YACD,4BAA4B;YAC5B,MAAM,GAAG,IAAI,CAAC;QAChB,CAAC;aAAM,IAAI,CAAC,IAAI,QAAQ,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YAChD,kDAAkD;QACpD,CAAC;IACH,CAAC;IACD,OAAO,MAAM,CAAC;AAChB,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CACpC,KAAsB,EACtB,EAAa;IAEb,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;QACrC,mCAAmC;QACnC,IAAI,aAAa,CAAC,KAAK,CAAC,EAAE,CAAC;YACzB,kBAAkB;YAClB,OAAO,CAAC,KAAK,CAAC,CAAC;YACf,uBAAuB;YACvB,EAAE,aAAF,EAAE,uBAAF,EAAE,CAAG,KAAK,CAAC,CAAC;QACd,CAAC;aAAM,CAAC;YACN,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;YAE1C,oBAAoB;YAEpB,gCAAgC;YAChC,kCAAkC;YAClC,mCAAmC;YACnC,GAAG,CAAC,gBAAgB,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;gBAClC,sBAAsB;gBACtB,OAAO,CAAC,KAAK,CAAC,CAAC;gBACf,cAAc;gBACd,EAAE,aAAF,EAAE,uBAAF,EAAE,CAAG,KAAK,CAAC,CAAC;YACd,CAAC,CAAC,CAAC;YAEH,UAAU;YACV,GAAG,CAAC,GAAG,GAAG,KAAK,CAAC,IAAI,CAAC;QACvB,CAAC;IACH,CAAC,CAAC,CAAC;AACL,CAAC"}

package/dist/js/dom/when/whenNearViewport/whenNearViewport.d.ts

@@ -0,0 +1,39 @@
+/**
+ * @name            whenNearViewport
+ * @namespace       js.dom.when
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ * @async
+ *
+ * Monitor an HTMLElement to be notified when it is near (100vh before or after) the viewport, or in the viewport
+ *
+ * @feature       Promise based API
+ * @feature       Some settings available to tweak the behavior
+ *
+ * @param 		{HTMLElement} 				                        $elm 					    The element to monitor
+ * @param 		{Partial<TWhenNearViewportSettings>} 					[settings={}] 		Some settings to tweak the detection behavior
+ * @return 		(Promise<HTMLElement>) 											                    The promise that will be resolved when the element is in the viewport
+ *
+ * @setting         {String}            [offset=`${window.innerHeight}px ${window.innerWidth}px`]           Some offset
+ *
+ * @snippet         whenNearViewport($1)
+ * whenNearViewport($1).then(\$elm => {
+ *   $2
+ * });
+ *
+ * @todo      tests
+ *
+ * @example 	js
+ * import { whenNearViewport } from '@blackbyte/sugar/dom'
+ * whenNearViewport($myCoolHTMLElement).then($elm => {
+ *   // do something with your element that has entered the viewport...
+ * });
+ *
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export type TWhenNearViewportSettings = {
+    offset: string | number | undefined;
+};
+export default function whenNearViewport($elm: HTMLElement, settings?: Partial<TWhenNearViewportSettings>): Promise<HTMLElement>;

package/dist/js/dom/when/whenNearViewport/whenNearViewport.js

@@ -0,0 +1,58 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { closestScrollableElement } from '@blackbyte/sugar/dom';
+export default function whenNearViewport($elm, settings) {
+    function getRootMargin() {
+        return [
+            `${Math.round(window.innerHeight * 0.5)}px`,
+            `${Math.round(window.innerWidth * 0.5)}px`,
+            `${Math.round(window.innerHeight * 0.5)}px`,
+            `${Math.round(window.innerWidth * 0.5)}px`,
+        ].join(' ');
+    }
+    const finalSettings = Object.assign({ offset: undefined }, settings);
+    let observer, resizeTimeout;
+    const rootMargin = finalSettings.offset
+        ? `${finalSettings.offset}`
+        : getRootMargin();
+    let $closest = closestScrollableElement($elm);
+    if (($closest === null || $closest === void 0 ? void 0 : $closest.tagName) === 'HTML')
+        $closest = undefined;
+    return new Promise((resolve) => __awaiter(this, void 0, void 0, function* () {
+        const options = {
+            root: $closest, // relative to document viewport
+            rootMargin,
+            threshold: 0, // visible amount of item shown in relation to root
+        };
+        function onChange(changes, observer) {
+            changes.forEach((change) => {
+                var _a;
+                if (change.intersectionRatio > 0) {
+                    (_a = observer.disconnect) === null || _a === void 0 ? void 0 : _a.call(observer);
+                    resolve($elm);
+                }
+            });
+        }
+        observer = new IntersectionObserver(onChange, options);
+        observer.observe($elm);
+        window.addEventListener('resize', (e) => {
+            clearTimeout(resizeTimeout);
+            // @ts-ignore
+            resizeTimeout = setTimeout(() => {
+                var _a;
+                (_a = observer.disconnect) === null || _a === void 0 ? void 0 : _a.call(observer);
+                options.rootMargin = rootMargin;
+                observer = new IntersectionObserver(onChange, options);
+                observer.observe($elm);
+            }, 500);
+        });
+    }));
+}
+//# sourceMappingURL=whenNearViewport.js.map

package/dist/js/dom/when/whenNearViewport/whenNearViewport.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"whenNearViewport.js","sourceRoot":"","sources":["../../../../../src/js/dom/when/whenNearViewport/whenNearViewport.ts"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,wBAAwB,EAAE,MAAM,sBAAsB,CAAC;AA0ChE,MAAM,CAAC,OAAO,UAAU,gBAAgB,CACtC,IAAiB,EACjB,QAA6C;IAE7C,SAAS,aAAa;QACpB,OAAO;YACL,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,GAAG,GAAG,CAAC,IAAI;YAC3C,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU,GAAG,GAAG,CAAC,IAAI;YAC1C,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,WAAW,GAAG,GAAG,CAAC,IAAI;YAC3C,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU,GAAG,GAAG,CAAC,IAAI;SAC3C,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACd,CAAC;IAED,MAAM,aAAa,mBACjB,MAAM,EAAE,SAAS,IACd,QAAQ,CACZ,CAAC;IAEF,IAAI,QAA8B,EAAE,aAAqB,CAAC;IAE1D,MAAM,UAAU,GAAG,aAAa,CAAC,MAAM;QACrC,CAAC,CAAC,GAAG,aAAa,CAAC,MAAM,EAAE;QAC3B,CAAC,CAAC,aAAa,EAAE,CAAC;IAEpB,IAAI,QAAQ,GAAG,wBAAwB,CAAC,IAAI,CAAC,CAAC;IAC9C,IAAI,CAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,OAAO,MAAK,MAAM;QAAE,QAAQ,GAAG,SAAS,CAAC;IAEvD,OAAO,IAAI,OAAO,CAAC,CAAO,OAAO,EAAE,EAAE;QACnC,MAAM,OAAO,GAA6B;YACxC,IAAI,EAAE,QAAQ,EAAE,gCAAgC;YAChD,UAAU;YACV,SAAS,EAAE,CAAC,EAAE,mDAAmD;SAClE,CAAC;QAEF,SAAS,QAAQ,CAAC,OAAO,EAAE,QAAQ;YACjC,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE;;gBACzB,IAAI,MAAM,CAAC,iBAAiB,GAAG,CAAC,EAAE,CAAC;oBACjC,MAAA,QAAQ,CAAC,UAAU,wDAAI,CAAC;oBACxB,OAAO,CAAC,IAAI,CAAC,CAAC;gBAChB,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;QAED,QAAQ,GAAG,IAAI,oBAAoB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;QACvD,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;QAEvB,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;YACtC,YAAY,CAAC,aAAa,CAAC,CAAC;YAC5B,aAAa;YACb,aAAa,GAAG,UAAU,CAAC,GAAG,EAAE;;gBAC9B,MAAA,QAAQ,CAAC,UAAU,wDAAI,CAAC;gBACxB,OAAO,CAAC,UAAU,GAAG,UAAU,CAAC;gBAChC,QAAQ,GAAG,IAAI,oBAAoB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;gBACvD,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;YACzB,CAAC,EAAE,GAAG,CAAC,CAAC;QACV,CAAC,CAAC,CAAC;IACL,CAAC,CAAA,CAAC,CAAC;AACL,CAAC"}

package/dist/js/dom/when/whenOutOfViewport/whenOutOfViewport.d.ts

@@ -0,0 +1,39 @@
+/**
+ * @name            whenOutOfViewport
+ * @namespace       js.dom.when
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ * @async
+ *
+ * Monitor an HTMLElement to be notified when it exit the viewport
+ *
+ * @feature       Promise based API
+ * @feature       Some settings to tweak the detection behavior
+ *
+ * @param 		{HTMLElement} 				                          $elm 				        The element to monitor
+ * @param 		{Partial<TWhenOutOfViewportSettings>} 					[settings={}]       Some settings to tweak the detection behavior
+ * @return 		(Promise<HTMLElement>) 										                          The promise that will be resolved when the element exit the viewport
+ *
+ * @setting       {String}      [offset=10px]     An offset to detect sooner or later the element exits the viewport
+ *
+ * @snippet         whenOutOfViewport($1)
+ * whenOutOfViewport($1).then(\$$elm => {
+ *   $2
+ * });
+ *
+ * @todo      tests
+ *
+ * @example 	js
+ * import { whenOutOfViewport } from '@blackbyte/sugar/dom'
+ * whenOutOfViewport($myCoolHTMLElement).then(($elm) => {
+ *   // do something with your element that has exit the viewport...
+ * });
+ *
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export type TWhenOutOfViewportSettings = {
+    offset: string | number;
+};
+export default function whenOutOfViewport($elm: HTMLElement, settings?: Partial<TWhenOutOfViewportSettings>): Promise<unknown>;

package/dist/js/dom/when/whenOutOfViewport/whenOutOfViewport.js

@@ -0,0 +1,65 @@
+/**
+ * @name            whenOutOfViewport
+ * @namespace       js.dom.when
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ * @async
+ *
+ * Monitor an HTMLElement to be notified when it exit the viewport
+ *
+ * @feature       Promise based API
+ * @feature       Some settings to tweak the detection behavior
+ *
+ * @param 		{HTMLElement} 				                          $elm 				        The element to monitor
+ * @param 		{Partial<TWhenOutOfViewportSettings>} 					[settings={}]       Some settings to tweak the detection behavior
+ * @return 		(Promise<HTMLElement>) 										                          The promise that will be resolved when the element exit the viewport
+ *
+ * @setting       {String}      [offset=10px]     An offset to detect sooner or later the element exits the viewport
+ *
+ * @snippet         whenOutOfViewport($1)
+ * whenOutOfViewport($1).then(\$$elm => {
+ *   $2
+ * });
+ *
+ * @todo      tests
+ *
+ * @example 	js
+ * import { whenOutOfViewport } from '@blackbyte/sugar/dom'
+ * whenOutOfViewport($myCoolHTMLElement).then(($elm) => {
+ *   // do something with your element that has exit the viewport...
+ * });
+ *
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export default function whenOutOfViewport($elm, settings = {}) {
+    return new Promise((resolve, reject) => {
+        settings = Object.assign({ offset: '10px' }, settings);
+        let isInViewport = false;
+        const _cb = () => {
+            if (!isInViewport) {
+                observer.disconnect();
+                resolve($elm);
+            }
+        };
+        const observer = new IntersectionObserver((entries, observer) => {
+            if (!entries.length)
+                return;
+            const entry = entries[0];
+            if (entry.intersectionRatio > 0) {
+                isInViewport = true;
+            }
+            else {
+                isInViewport = false;
+            }
+            _cb();
+        }, {
+            root: null, // viewport
+            rootMargin: `${settings.offset}`,
+            threshold: [0, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1],
+        });
+        observer.observe($elm);
+    });
+}
+//# sourceMappingURL=whenOutOfViewport.js.map

package/dist/js/dom/when/whenOutOfViewport/whenOutOfViewport.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"whenOutOfViewport.js","sourceRoot":"","sources":["../../../../../src/js/dom/when/whenOutOfViewport/whenOutOfViewport.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAMH,MAAM,CAAC,OAAO,UAAU,iBAAiB,CACvC,IAAiB,EACjB,WAAgD,EAAE;IAElD,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;QACrC,QAAQ,mBACN,MAAM,EAAE,MAAM,IACX,QAAQ,CACZ,CAAC;QAEF,IAAI,YAAY,GAAG,KAAK,CAAC;QACzB,MAAM,GAAG,GAAG,GAAG,EAAE;YACf,IAAI,CAAC,YAAY,EAAE,CAAC;gBAClB,QAAQ,CAAC,UAAU,EAAE,CAAC;gBACtB,OAAO,CAAC,IAAI,CAAC,CAAC;YAChB,CAAC;QACH,CAAC,CAAC;QAEF,MAAM,QAAQ,GAAG,IAAI,oBAAoB,CACvC,CAAC,OAAO,EAAE,QAAQ,EAAE,EAAE;YACpB,IAAI,CAAC,OAAO,CAAC,MAAM;gBAAE,OAAO;YAC5B,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;YACzB,IAAI,KAAK,CAAC,iBAAiB,GAAG,CAAC,EAAE,CAAC;gBAChC,YAAY,GAAG,IAAI,CAAC;YACtB,CAAC;iBAAM,CAAC;gBACN,YAAY,GAAG,KAAK,CAAC;YACvB,CAAC;YACD,GAAG,EAAE,CAAC;QACR,CAAC,EACD;YACE,IAAI,EAAE,IAAI,EAAE,WAAW;YACvB,UAAU,EAAE,GAAG,QAAQ,CAAC,MAAM,EAAE;YAChC,SAAS,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;SAC/D,CACF,CAAC;QAEF,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;IACzB,CAAC,CAAC,CAAC;AACL,CAAC"}

package/dist/js/dom/when/whenRemoved/whenRemoved.d.ts

@@ -0,0 +1,34 @@
+/**
+ * @name            whenRemoved
+ * @namespace       js.dom.when
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ * @async
+ *
+ * Resolve a promise when the passed node has been removed from the dom
+ *
+ * @feature       Detect when the element has been removed from the dom
+ * @feature       Possibility to pass a check function to check if the attribute suits your needs
+ * @feature       Promise based API
+ *
+ * @param 		{HTMLElement} 				      $elm 				The HTMLElement on which to monitor
+ * @return 		(Promise<HTMLElement>) 									The promise that will be resolved when the attribute exist on the element (and that it passes the checkFn)
+ *
+ * @snippet         whenRemoved($1);
+ * whenRemoved($1).then(() => {
+ *   $2
+ * });
+ *
+ * @todo      tests
+ *
+ * @example 	js
+ * import { whenRemoved } from '@blackbyte/sugar/dom'
+ * whenRemoved($myCoolHTMLElement).then(() => {
+ *   // the element has been removed
+ * });
+ *
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export default function whenRemoved($elm: HTMLElement): Promise<HTMLElement>;

package/dist/js/dom/when/whenRemoved/whenRemoved.js

@@ -0,0 +1,53 @@
+/**
+ * @name            whenRemoved
+ * @namespace       js.dom.when
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ * @async
+ *
+ * Resolve a promise when the passed node has been removed from the dom
+ *
+ * @feature       Detect when the element has been removed from the dom
+ * @feature       Possibility to pass a check function to check if the attribute suits your needs
+ * @feature       Promise based API
+ *
+ * @param 		{HTMLElement} 				      $elm 				The HTMLElement on which to monitor
+ * @return 		(Promise<HTMLElement>) 									The promise that will be resolved when the attribute exist on the element (and that it passes the checkFn)
+ *
+ * @snippet         whenRemoved($1);
+ * whenRemoved($1).then(() => {
+ *   $2
+ * });
+ *
+ * @todo      tests
+ *
+ * @example 	js
+ * import { whenRemoved } from '@blackbyte/sugar/dom'
+ * whenRemoved($myCoolHTMLElement).then(() => {
+ *   // the element has been removed
+ * });
+ *
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export default function whenRemoved($elm) {
+    return new Promise((resolve, reject) => {
+        const observer = new MutationObserver(function (mutations) {
+            mutations.forEach(function (mutation) {
+                mutation.removedNodes.forEach(function (removedNode) {
+                    if (removedNode === $elm) {
+                        resolve($elm);
+                        observer.disconnect();
+                    }
+                });
+            });
+        });
+        // @ts-ignore
+        observer.observe($elm.parentElement, {
+            subtree: false,
+            childList: true,
+        });
+    });
+}
+//# sourceMappingURL=whenRemoved.js.map

package/dist/js/dom/when/whenRemoved/whenRemoved.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"whenRemoved.js","sourceRoot":"","sources":["../../../../../src/js/dom/when/whenRemoved/whenRemoved.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,IAAiB;IACnD,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;QACrC,MAAM,QAAQ,GAAG,IAAI,gBAAgB,CAAC,UAAU,SAAS;YACvD,SAAS,CAAC,OAAO,CAAC,UAAU,QAAQ;gBAClC,QAAQ,CAAC,YAAY,CAAC,OAAO,CAAC,UAAU,WAAW;oBACjD,IAAI,WAAW,KAAK,IAAI,EAAE,CAAC;wBACzB,OAAO,CAAC,IAAI,CAAC,CAAC;wBACd,QAAQ,CAAC,UAAU,EAAE,CAAC;oBACxB,CAAC;gBACH,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;QACH,aAAa;QACb,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,aAAa,EAAE;YACnC,OAAO,EAAE,KAAK;YACd,SAAS,EAAE,IAAI;SAChB,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC"}

package/dist/js/dom/when/whenScriptLoaded/whenScriptLoaded.d.ts

@@ -0,0 +1,33 @@
+/**
+ * @name            whenScriptLoaded
+ * @namespace       js.dom.when
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ *
+ * Detect when a script has been fully loaded
+ *
+ * @feature       Promise based API
+ * @feature       Callback support
+ *
+ * @param    {HTMLScriptElement}        $script         The script element to detect the loading state
+ * @param    {Function}                 [cb=null]       A callback if you prefer
+ * @return   {Promise}                                  The promise that will be resolved when the script is fully loaded
+ *
+ * @snippet         whenScriptLoaded($1)
+ * whenScriptLoaded($1).then(\$script => {
+ *      $2
+ * });
+ *
+ * @todo      tests
+ *
+ * @example    js
+ * import { whenScriptLoaded } from '@blackbyte/sugar/dom'
+ * whenScriptLoaded($script).then(($script) => {
+ *   // do something here
+ * })
+ *
+ * @since           1.0.0
+ * @author    Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export default function whenScriptLoaded($script: HTMLScriptElement, cb?: Function): Promise<HTMLScriptElement>;

package/dist/js/dom/when/whenScriptLoaded/whenScriptLoaded.js

@@ -0,0 +1,73 @@
+/**
+ * @name            whenScriptLoaded
+ * @namespace       js.dom.when
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ *
+ * Detect when a script has been fully loaded
+ *
+ * @feature       Promise based API
+ * @feature       Callback support
+ *
+ * @param    {HTMLScriptElement}        $script         The script element to detect the loading state
+ * @param    {Function}                 [cb=null]       A callback if you prefer
+ * @return   {Promise}                                  The promise that will be resolved when the script is fully loaded
+ *
+ * @snippet         whenScriptLoaded($1)
+ * whenScriptLoaded($1).then(\$script => {
+ *      $2
+ * });
+ *
+ * @todo      tests
+ *
+ * @example    js
+ * import { whenScriptLoaded } from '@blackbyte/sugar/dom'
+ * whenScriptLoaded($script).then(($script) => {
+ *   // do something here
+ * })
+ *
+ * @since           1.0.0
+ * @author    Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export default function whenScriptLoaded($script, cb) {
+    const promise = new Promise((resolve, reject) => {
+        let done = false;
+        $script.onload = handleLoad;
+        // @ts-ignore
+        $script.onreadystatechange = handleReadyStateChange;
+        $script.onerror = handleError;
+        function handleLoad() {
+            if (!done) {
+                done = true;
+                if (cb)
+                    cb($script);
+                resolve($script);
+            }
+        }
+        function handleReadyStateChange() {
+            let state;
+            if (!done) {
+                // @ts-ignore
+                state = $script.readyState;
+                if (state === 'complete') {
+                    handleLoad();
+                }
+            }
+        }
+        function handleError(e) {
+            if (!done) {
+                done = true;
+                reject(new Error(e));
+            }
+        }
+    });
+    promise.finally(() => {
+        $script.onload = null;
+        // @ts-ignore
+        $script.onreadystatechange = null;
+        $script.onerror = null;
+    }).catch(() => { });
+    return promise;
+}
+//# sourceMappingURL=whenScriptLoaded.js.map

package/dist/js/dom/when/whenScriptLoaded/whenScriptLoaded.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"whenScriptLoaded.js","sourceRoot":"","sources":["../../../../../src/js/dom/when/whenScriptLoaded/whenScriptLoaded.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,MAAM,CAAC,OAAO,UAAU,gBAAgB,CACtC,OAA0B,EAC1B,EAAa;IAEb,MAAM,OAAO,GAAG,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;QAC9C,IAAI,IAAI,GAAG,KAAK,CAAC;QAEjB,OAAO,CAAC,MAAM,GAAG,UAAU,CAAC;QAC5B,aAAa;QACb,OAAO,CAAC,kBAAkB,GAAG,sBAAsB,CAAC;QACpD,OAAO,CAAC,OAAO,GAAG,WAAW,CAAC;QAE9B,SAAS,UAAU;YACjB,IAAI,CAAC,IAAI,EAAE,CAAC;gBACV,IAAI,GAAG,IAAI,CAAC;gBACZ,IAAI,EAAE;oBAAE,EAAE,CAAC,OAAO,CAAC,CAAC;gBACpB,OAAO,CAAC,OAAO,CAAC,CAAC;YACnB,CAAC;QACH,CAAC;QAED,SAAS,sBAAsB;YAC7B,IAAI,KAAK,CAAC;YACV,IAAI,CAAC,IAAI,EAAE,CAAC;gBACV,aAAa;gBACb,KAAK,GAAG,OAAO,CAAC,UAAU,CAAC;gBAC3B,IAAI,KAAK,KAAK,UAAU,EAAE,CAAC;oBACzB,UAAU,EAAE,CAAC;gBACf,CAAC;YACH,CAAC;QACH,CAAC;QACD,SAAS,WAAW,CAAC,CAAC;YACpB,IAAI,CAAC,IAAI,EAAE,CAAC;gBACV,IAAI,GAAG,IAAI,CAAC;gBACZ,MAAM,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;YACvB,CAAC;QACH,CAAC;IACH,CAAC,CAAC,CAAC;IACH,OAAO,CAAC,OAAO,CAAC,GAAG,EAAE;QACnB,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC;QACtB,aAAa;QACb,OAAO,CAAC,kBAAkB,GAAG,IAAI,CAAC;QAClC,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC;IACzB,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;IAEnB,OAAO,OAAqC,CAAC;AAC/C,CAAC"}

package/dist/js/dom/when/whenStylesheetsReady/whenStylesheetsReady.d.ts

@@ -0,0 +1,36 @@
+/**
+ * @name            whenStylesheetsReady
+ * @namespace       js.dom.when
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ * @async
+ *
+ * Wait until all the HTMLLinkElement's are properly loaded
+ *
+ * @feature       Async promise based
+ * @feature       Multiple stylesheets elements listening
+ *
+ * @param 		{Array<HTMLLinkElement>} 		    [$links=null] 			The HTMLLinkElement tags to process. If not passed, take the local stylesheets links
+ * @return 		{Promise<void>} 										                The promise that will be resolved when all the links are loaded
+ *
+ * @todo      tests
+ *
+ * @snippet         whenStylesheetsReady($1)
+ * whenStylesheetsReady($1).then(stylesheets => {
+ *      $2
+ * });
+ *
+ * @example 	js
+ * import { whenStylesheetsReady } from '@blackbyte/sugar/dom'
+ * whenStylesheetsReady([
+ * 		$myHTMLLinkElement1,
+ * 		$myHTMLLinkElement2
+ * ]).then(stylesheets => {
+ *      // do something...
+ * });
+ *
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export default function whenStylesheetsReady($links?: HTMLLinkElement[]): Promise<HTMLLinkElement[]>;

package/dist/js/dom/when/whenStylesheetsReady/whenStylesheetsReady.js

@@ -0,0 +1,48 @@
+import whenLinkLoaded from '../whenLinkLoaded/whenLinkLoaded.js';
+/**
+ * @name            whenStylesheetsReady
+ * @namespace       js.dom.when
+ * @type            Function
+ * @platform        js
+ * @status          stable
+ * @async
+ *
+ * Wait until all the HTMLLinkElement's are properly loaded
+ *
+ * @feature       Async promise based
+ * @feature       Multiple stylesheets elements listening
+ *
+ * @param 		{Array<HTMLLinkElement>} 		    [$links=null] 			The HTMLLinkElement tags to process. If not passed, take the local stylesheets links
+ * @return 		{Promise<void>} 										                The promise that will be resolved when all the links are loaded
+ *
+ * @todo      tests
+ *
+ * @snippet         whenStylesheetsReady($1)
+ * whenStylesheetsReady($1).then(stylesheets => {
+ *      $2
+ * });
+ *
+ * @example 	js
+ * import { whenStylesheetsReady } from '@blackbyte/sugar/dom'
+ * whenStylesheetsReady([
+ * 		$myHTMLLinkElement1,
+ * 		$myHTMLLinkElement2
+ * ]).then(stylesheets => {
+ *      // do something...
+ * });
+ *
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export default function whenStylesheetsReady($links) {
+    if (!$links) {
+        $links = Array.from(document.querySelectorAll('link[rel="stylesheet"]'));
+    }
+    const promises = [];
+    [].forEach.call($links, ($link) => {
+        promises.push(whenLinkLoaded($link));
+    });
+    const allPromises = Promise.all(promises);
+    return allPromises;
+}
+//# sourceMappingURL=whenStylesheetsReady.js.map

package/dist/js/dom/when/whenStylesheetsReady/whenStylesheetsReady.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"whenStylesheetsReady.js","sourceRoot":"","sources":["../../../../../src/js/dom/when/whenStylesheetsReady/whenStylesheetsReady.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,qCAAqC,CAAC;AAEjE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAC1C,MAA0B;IAE1B,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,wBAAwB,CAAC,CAAC,CAAC;IAC3E,CAAC;IACD,MAAM,QAAQ,GAA+B,EAAE,CAAC;IAChD,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,EAAE;QAChC,QAAQ,CAAC,IAAI,CAAC,cAAc,CAAC,KAAwB,CAAC,CAAC,CAAC;IAC1D,CAAC,CAAC,CAAC;IACH,MAAM,WAAW,GAAG,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IAC1C,OAAO,WAAW,CAAC;AACrB,CAAC"}

package/dist/js/dom/when/whenStylesheetsReady.js

@@ -1,4 +1,4 @@
-import whenLinkLoaded from './whenLinkLoaded.js';
+import whenLinkLoaded from './whenLinkLoaded/whenLinkLoaded.js';
 /**
  * @name            whenStylesheetsReady
  * @namespace       js.dom.when

package/dist/js/dom/when/whenStylesheetsReady.js.map

@@ -1 +1 @@
-{"version":3,"file":"whenStylesheetsReady.js","sourceRoot":"","sources":["../../../../src/js/dom/when/whenStylesheetsReady.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,qBAAqB,CAAC;AAEjD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAC1C,MAA0B;IAE1B,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,wBAAwB,CAAC,CAAC,CAAC;IAC3E,CAAC;IACD,MAAM,QAAQ,GAA+B,EAAE,CAAC;IAChD,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,EAAE;QAChC,QAAQ,CAAC,IAAI,CAAC,cAAc,CAAC,KAAwB,CAAC,CAAC,CAAC;IAC1D,CAAC,CAAC,CAAC;IACH,MAAM,WAAW,GAAG,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IAC1C,OAAO,WAAW,CAAC;AACrB,CAAC"}
+{"version":3,"file":"whenStylesheetsReady.js","sourceRoot":"","sources":["../../../../src/js/dom/when/whenStylesheetsReady.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,oCAAoC,CAAC;AAEhE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAC1C,MAA0B;IAE1B,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAC,wBAAwB,CAAC,CAAC,CAAC;IAC3E,CAAC;IACD,MAAM,QAAQ,GAA+B,EAAE,CAAC;IAChD,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,EAAE;QAChC,QAAQ,CAAC,IAAI,CAAC,cAAc,CAAC,KAAwB,CAAC,CAAC,CAAC;IAC1D,CAAC,CAAC,CAAC;IACH,MAAM,WAAW,GAAG,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IAC1C,OAAO,WAAW,CAAC;AACrB,CAAC"}

package/dist/js/dom/when/whenTransitionEnd/whenTransitionEnd.d.ts

@@ -0,0 +1,30 @@
+/**
+ * @name                whenTransitionEnd
+ * @namespace           js.dom.when
+ * @type                Function
+ * @platform            js
+ * @status              stable
+ * @async
+ *
+ * Monitor an HTMLElement to be notified when his transition has ended
+ *
+ * @feature       Promise based API
+ *
+ * @param 		{HTMLElement} 				        $elm 		The element to monitor
+ * @return 		(Promise<HTMLElement>) 								The promise that will be resolved when the element transition has ended
+ *
+ * @snippet         whenTransitionEnd($1)
+ * whenTransitionEnd($1).then(\$elm => {
+ *      $2
+ * });
+ *
+ * @todo      tests
+ *
+ * @example 	js
+ * import { whenTransitionEnd } from '@blackbyte/sugar/dom'
+ * await whenTransitionEnd(myCoolHTMLElement);
+ *
+ * @since           1.0.0
+ * @author         Olivier Bossel <olivier.bossel@gmail.com> (https://blackbyte.space)
+ */
+export default function whenTransitionEnd($elm: HTMLElement): Promise<HTMLElement>;