svelte-infinite-loading - npm Package Compare versions

Comparing version 1.3.8 to 1.4.0

dist/svelte-infinite-loading.js

@@ -101,2 +101,3 @@ (function (global, factory) {
         append(node.head || node, style);
+        return style.sheet;
     }
@@ -107,3 +108,5 @@ function insert(target, node, anchor) {
     function detach(node) {
-        node.parentNode.removeChild(node);
+        if (node.parentNode) {
+            node.parentNode.removeChild(node);
+        }
     }
@@ -135,5 +138,5 @@ function element(name) {
     }
-    function custom_event(type, detail, bubbles = false) {
+    function custom_event(type, detail, { bubbles = false, cancelable = false } = {}) {
         const e = document.createEvent('CustomEvent');
-        e.initCustomEvent(type, bubbles, false, detail);
+        e.initCustomEvent(type, bubbles, cancelable, detail);
         return e;
@@ -151,11 +154,40 @@ }
     }
+    /**
+     * The `onMount` function schedules a callback to run as soon as the component has been mounted to the DOM.
+     * It must be called during the component's initialisation (but doesn't need to live *inside* the component;
+     * it can be called from an external module).
+     *
+     * `onMount` does not run inside a [server-side component](/docs#run-time-server-side-component-api).
+     *
+     * https://svelte.dev/docs#run-time-svelte-onmount
+     */
     function onMount(fn) {
         get_current_component().$$.on_mount.push(fn);
     }
+    /**
+     * Schedules a callback to run immediately before the component is unmounted.
+     *
+     * Out of `onMount`, `beforeUpdate`, `afterUpdate` and `onDestroy`, this is the
+     * only one that runs inside a server-side component.
+     *
+     * https://svelte.dev/docs#run-time-svelte-ondestroy
+     */
     function onDestroy(fn) {
         get_current_component().$$.on_destroy.push(fn);
     }
+    /**
+     * Creates an event dispatcher that can be used to dispatch [component events](/docs#template-syntax-component-directives-on-eventname).
+     * Event dispatchers are functions that can take two arguments: `name` and `detail`.
+     *
+     * Component events created with `createEventDispatcher` create a
+     * [CustomEvent](https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent).
+     * These events do not [bubble](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events#Event_bubbling_and_capture).
+     * The `detail` argument corresponds to the [CustomEvent.detail](https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/detail)
+     * property and can contain any type of data.
+     *
+     * https://svelte.dev/docs#run-time-svelte-createeventdispatcher
+     */
     function createEventDispatcher() {
         const component = get_current_component();
-        return (type, detail) => {
+        return (type, detail, { cancelable = false } = {}) => {
             const callbacks = component.$$.callbacks[type];
@@ -165,7 +197,9 @@ if (callbacks) {
                 // in a server (non-DOM) environment?
-                const event = custom_event(type, detail);
+                const event = custom_event(type, detail, { cancelable });
                 callbacks.slice().forEach(fn => {
                     fn.call(component, event);
                 });
+                return !event.defaultPrevented;
             }
+            return true;
         };
@@ -176,5 +210,5 @@ }
     const binding_callbacks = [];
-    const render_callbacks = [];
+    let render_callbacks = [];
     const flush_callbacks = [];
-    const resolved_promise = Promise.resolve();
+    const resolved_promise = /* @__PURE__ */ Promise.resolve();
     let update_scheduled = false;
@@ -194,18 +228,50 @@ function schedule_update() {
     }
-    let flushing = false;
+    // flush() calls callbacks in this order:
+    // 1. All beforeUpdate callbacks, in order: parents before children
+    // 2. All bind:this callbacks, in reverse order: children before parents.
+    // 3. All afterUpdate callbacks, in order: parents before children. EXCEPT
+    //    for afterUpdates called during the initial onMount, which are called in
+    //    reverse order: children before parents.
+    // Since callbacks might update component values, which could trigger another
+    // call to flush(), the following steps guard against this:
+    // 1. During beforeUpdate, any updated components will be added to the
+    //    dirty_components array and will cause a reentrant call to flush(). Because
+    //    the flush index is kept outside the function, the reentrant call will pick
+    //    up where the earlier call left off and go through all dirty components. The
+    //    current_component value is saved and restored so that the reentrant call will
+    //    not interfere with the "parent" flush() call.
+    // 2. bind:this callbacks cannot trigger new flush() calls.
+    // 3. During afterUpdate, any updated components will NOT have their afterUpdate
+    //    callback called a second time; the seen_callbacks set, outside the flush()
+    //    function, guarantees this behavior.
     const seen_callbacks = new Set();
+    let flushidx = 0; // Do *not* move this inside the flush() function
     function flush() {
-        if (flushing)
+        // Do not reenter flush while dirty components are updated, as this can
+        // result in an infinite loop. Instead, let the inner flush handle it.
+        // Reentrancy is ok afterwards for bindings etc.
+        if (flushidx !== 0) {
             return;
-        flushing = true;
+        }
+        const saved_component = current_component;
         do {
             // first, call beforeUpdate functions
             // and update components
-            for (let i = 0; i < dirty_components.length; i += 1) {
-                const component = dirty_components[i];
-                set_current_component(component);
-                update(component.$$);
+            try {
+                while (flushidx < dirty_components.length) {
+                    const component = dirty_components[flushidx];
+                    flushidx++;
+                    set_current_component(component);
+                    update(component.$$);
+                }
             }
+            catch (e) {
+                // reset dirty state to not end up in a deadlocked state and then rethrow
+                dirty_components.length = 0;
+                flushidx = 0;
+                throw e;
+            }
             set_current_component(null);
             dirty_components.length = 0;
+            flushidx = 0;
             while (binding_callbacks.length)
@@ -230,4 +296,4 @@ binding_callbacks.pop()();
         update_scheduled = false;
-        flushing = false;
         seen_callbacks.clear();
+        set_current_component(saved_component);
     }
@@ -244,2 +310,12 @@ function update($$) {
     }
+    /**
+     * Useful for example to execute remaining `afterUpdate` callbacks before executing `destroy`.
+     */
+    function flush_render_callbacks(fns) {
+        const filtered = [];
+        const targets = [];
+        render_callbacks.forEach((c) => fns.indexOf(c) === -1 ? filtered.push(c) : targets.push(c));
+        targets.forEach((c) => c());
+        render_callbacks = filtered;
+    }
     const outroing = new Set();
@@ -281,2 +357,5 @@ let outros;
         }
+        else if (callback) {
+            callback();
+        }
     }
@@ -287,3 +366,3 @@ function create_component(block) {
     function mount_component(component, target, anchor, customElement) {
-        const { fragment, on_mount, on_destroy, after_update } = component.$$;
+        const { fragment, after_update } = component.$$;
         fragment && fragment.m(target, anchor);
@@ -293,5 +372,8 @@ if (!customElement) {
             add_render_callback(() => {
-                const new_on_destroy = on_mount.map(run).filter(is_function);
-                if (on_destroy) {
-                    on_destroy.push(...new_on_destroy);
+                const new_on_destroy = component.$$.on_mount.map(run).filter(is_function);
+                // if the component was destroyed immediately
+                // it will update the `$$.on_destroy` reference to `null`.
+                // the destructured on_destroy may still reference to the old array
+                if (component.$$.on_destroy) {
+                    component.$$.on_destroy.push(...new_on_destroy);
                 }
@@ -311,2 +393,3 @@ else {
         if ($$.fragment !== null) {
+            flush_render_callbacks($$.after_update);
             run_all($$.on_destroy);
@@ -333,3 +416,3 @@ $$.fragment && $$.fragment.d(detaching);
             fragment: null,
-            ctx: null,
+            ctx: [],
             // state
@@ -399,2 +482,5 @@ props,
         $on(type, callback) {
+            if (!is_function(callback)) {
+                return noop;
+            }
             const callbacks = (this.$$.callbacks[type] || (this.$$.callbacks[type] = []));
@@ -417,3 +503,3 @@ callbacks.push(callback);
 
-    /* src/Spinner.svelte generated by Svelte v3.43.0 */
+    /* src/Spinner.svelte generated by Svelte v3.59.2 */
 
@@ -601,3 +687,3 @@ function add_css$1(target) {
 
-    /* src/InfiniteLoading.svelte generated by Svelte v3.43.0 */
+    /* src/InfiniteLoading.svelte generated by Svelte v3.59.2 */
 
@@ -1292,3 +1378,3 @@ function add_css(target) {
     		},
-    		reset: async () => {
+    		reset: () => {
     			$$invalidate(12, status = STATUS.READY);
@@ -1295,0 +1381,0 @@ $$invalidate(1, isFirstLoad = true);

package.json

 {
   "name": "svelte-infinite-loading",
-  "version": "1.3.8",
+  "version": "1.4.0",
   "description": "An infinite scroll component for Svelte apps",
@@ -14,3 +14,3 @@ "svelte": "src/index.js",
     "test:watch": "npm run test -- --watch",
-    "prepublishOnly": "npm run build"
+    "prepublishOnly": "npm run lint && npm run test && npm run build"
   },
@@ -29,2 +29,3 @@ "devDependencies": {
   },
+  "packageManager": "npm@10.8.0+sha512.c21f77b91733829ec70e73cc88b5dc0a4bf685a81d252d3327d293ff7d5dd05a173f4dbeaa037600ec29696f397f14569229e5dab10b7cfc3e0a30575b8f3f8d",
   "files": [
@@ -35,2 +36,9 @@ "src",
   ],
+  "exports": {
+    ".": {
+      "types": "./types/index.d.ts",
+      "svelte": "./src/index.js",
+      "default": "./dist/svelte-infinite-loading.js"
+    }
+  },
   "keywords": [
@@ -47,5 +55,5 @@ "svelte",
   "author": {
-    "name": "Skayo",
-    "email": "[e-mail]",
-    "url": "https://skayo.dev"
+    "name": "Jonas Geiler",
+    "email": "[e-mail]",
+    "url": "https://jonasgeiler.com"
   },
@@ -55,8 +63,8 @@ "license": "MIT",
     "type": "git",
-    "url": "git+https://github.com/Skayo/svelte-infinite-loading.git"
+    "url": "git+https://github.com/jonasgeiler/svelte-infinite-loading.git"
   },
   "bugs": {
-    "url": "https://github.com/Skayo/svelte-infinite-loading/issues"
+    "url": "https://github.com/jonasgeiler/svelte-infinite-loading/issues"
   },
-  "homepage": "https://github.com/Skayo/svelte-infinite-loading"
+  "homepage": "https://github.com/jonasgeiler/svelte-infinite-loading"
 }

README.md

@@ -1,2 +0,2 @@
-<p align="center"><img src="https://raw.githubusercontent.com/Skayo/svelte-infinite-loading/master/assets/InfiniteLogo.svg" alt="InfiniteLogo" width="225"></p>
+<p align="center"><img src="https://raw.githubusercontent.com/jonasgeiler/svelte-infinite-loading/master/assets/InfiniteLogo.svg" alt="InfiniteLogo" width="225"></p>
 <h2 align="center">svelte-infinite-loading</h2>
@@ -68,3 +68,3 @@ <p align="center">An infinite scroll component for Svelte apps</p>
 
-For more information on how to use this library, check the [documentation](https://github.com/Skayo/svelte-infinite-loading/wiki)!
+For more information on how to use this library, check the [documentation](https://github.com/jonasgeiler/svelte-infinite-loading/wiki)!
 
@@ -74,3 +74,3 @@
 
-You can find the documentation in the [repository wiki](https://github.com/Skayo/svelte-infinite-loading/wiki)
+You can find the documentation in the [repository wiki](https://github.com/jonasgeiler/svelte-infinite-loading/wiki)
 
@@ -80,2 +80,2 @@
 
-[MIT License](https://github.com/Skayo/svelte-infinite-loading/blob/master/LICENSE)
+[MIT License](https://github.com/jonasgeiler/svelte-infinite-loading/blob/master/LICENSE)

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

137320

increased by7.31%

Lines of code

3037

increased by6%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes