svelte-fast-marquee - npm Package Compare versions

Comparing version 0.1.1 to 0.2.0

dist/index.js

 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
     typeof define === 'function' && define.amd ? define(factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.Name = factory());
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global['svelte-fast-marquee'] = factory());
 }(this, (function () { 'use strict';
 
     function noop() { }
+    function assign(tar, src) {
+        // @ts-ignore
+        for (const k in src)
+            tar[k] = src[k];
+        return tar;
+    }
     function run(fn) {
@@ -26,5 +32,84 @@ return fn();
     }
+    function create_slot(definition, ctx, $$scope, fn) {
+        if (definition) {
+            const slot_ctx = get_slot_context(definition, ctx, $$scope, fn);
+            return definition[0](slot_ctx);
+        }
+    }
+    function get_slot_context(definition, ctx, $$scope, fn) {
+        return definition[1] && fn
+            ? assign($$scope.ctx.slice(), definition[1](fn(ctx)))
+            : $$scope.ctx;
+    }
+    function get_slot_changes(definition, $$scope, dirty, fn) {
+        if (definition[2] && fn) {
+            const lets = definition[2](fn(dirty));
+            if ($$scope.dirty === undefined) {
+                return lets;
+            }
+            if (typeof lets === 'object') {
+                const merged = [];
+                const len = Math.max($$scope.dirty.length, lets.length);
+                for (let i = 0; i < len; i += 1) {
+                    merged[i] = $$scope.dirty[i] | lets[i];
+                }
+                return merged;
+            }
+            return $$scope.dirty | lets;
+        }
+        return $$scope.dirty;
+    }
+    function update_slot(slot, slot_definition, ctx, $$scope, dirty, get_slot_changes_fn, get_slot_context_fn) {
+        const slot_changes = get_slot_changes(slot_definition, $$scope, dirty, get_slot_changes_fn);
+        if (slot_changes) {
+            const slot_context = get_slot_context(slot_definition, ctx, $$scope, get_slot_context_fn);
+            slot.p(slot_context, slot_changes);
+        }
+    }
+    function append(target, node) {
+        target.appendChild(node);
+    }
+    function append_styles(target, style_sheet_id, styles) {
+        var _a;
+        const append_styles_to = get_root_for_styles(target);
+        if (!((_a = append_styles_to) === null || _a === void 0 ? void 0 : _a.getElementById(style_sheet_id))) {
+            const style = element('style');
+            style.id = style_sheet_id;
+            style.textContent = styles;
+            append_stylesheet(append_styles_to, style);
+        }
+    }
+    function get_root_for_node(node) {
+        if (!node)
+            return document;
+        return (node.getRootNode ? node.getRootNode() : node.ownerDocument); // check for getRootNode because IE is still supported
+    }
+    function get_root_for_styles(node) {
+        const root = get_root_for_node(node);
+        return root.host ? root : root;
+    }
+    function append_stylesheet(node, style) {
+        append(node.head || node, style);
+    }
+    function insert(target, node, anchor) {
+        target.insertBefore(node, anchor || null);
+    }
     function detach(node) {
         node.parentNode.removeChild(node);
     }
+    function element(name) {
+        return document.createElement(name);
+    }
+    function text(data) {
+        return document.createTextNode(data);
+    }
+    function space() {
+        return text(' ');
+    }
+    function attr(node, attribute, value) {
+        if (value == null)
+            node.removeAttribute(attribute);
+        else if (node.getAttribute(attribute) !== value)
+            node.setAttribute(attribute, value);
+    }
     function children(element) {
@@ -103,2 +188,3 @@ return Array.from(element.childNodes);
     const outroing = new Set();
+    let outros;
     function transition_in(block, local) {
@@ -110,2 +196,18 @@ if (block && block.i) {
     }
+    function transition_out(block, local, detach, callback) {
+        if (block && block.o) {
+            if (outroing.has(block))
+                return;
+            outroing.add(block);
+            outros.c.push(() => {
+                outroing.delete(block);
+                if (callback) {
+                    if (detach)
+                        block.d(1);
+                    callback();
+                }
+            });
+            block.o(local);
+        }
+    }
     function mount_component(component, target, anchor, customElement) {
@@ -239,6 +341,92 @@ const { fragment, on_mount, on_destroy, after_update } = component.$$;
 
+    function add_css(target) {
+    	append_styles(target, "svelte-15w3e7g", ".marquee-container.svelte-15w3e7g{display:flex;width:100%;overflow-x:hidden;flex-direction:row;position:relative}.marquee.svelte-15w3e7g{flex:0 0 auto;min-width:100%;z-index:1;display:flex;flex-direction:row;align-items:center;animation:svelte-15w3e7g-scroll 10s linear 0s infinite;animation-play-state:running;animation-direction:normal}@keyframes svelte-15w3e7g-scroll{0%{transform:translateX(0%)}100%{transform:translateX(-100%)}}");
+    }
+
+    function create_fragment(ctx) {
+    	let div2;
+    	let div0;
+    	let t;
+    	let div1;
+    	let current;
+    	const default_slot_template = /*#slots*/ ctx[1].default;
+    	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[0], null);
+    	const default_slot_template_1 = /*#slots*/ ctx[1].default;
+    	const default_slot_1 = create_slot(default_slot_template_1, ctx, /*$$scope*/ ctx[0], null);
+
+    	return {
+    		c() {
+    			div2 = element("div");
+    			div0 = element("div");
+    			if (default_slot) default_slot.c();
+    			t = space();
+    			div1 = element("div");
+    			if (default_slot_1) default_slot_1.c();
+    			attr(div0, "class", "marquee svelte-15w3e7g");
+    			attr(div1, "class", "marquee svelte-15w3e7g");
+    			attr(div2, "class", "marquee-container svelte-15w3e7g");
+    		},
+    		m(target, anchor) {
+    			insert(target, div2, anchor);
+    			append(div2, div0);
+
+    			if (default_slot) {
+    				default_slot.m(div0, null);
+    			}
+
+    			append(div2, t);
+    			append(div2, div1);
+
+    			if (default_slot_1) {
+    				default_slot_1.m(div1, null);
+    			}
+
+    			current = true;
+    		},
+    		p(ctx, [dirty]) {
+    			if (default_slot) {
+    				if (default_slot.p && (!current || dirty & /*$$scope*/ 1)) {
+    					update_slot(default_slot, default_slot_template, ctx, /*$$scope*/ ctx[0], !current ? -1 : dirty, null, null);
+    				}
+    			}
+
+    			if (default_slot_1) {
+    				if (default_slot_1.p && (!current || dirty & /*$$scope*/ 1)) {
+    					update_slot(default_slot_1, default_slot_template_1, ctx, /*$$scope*/ ctx[0], !current ? -1 : dirty, null, null);
+    				}
+    			}
+    		},
+    		i(local) {
+    			if (current) return;
+    			transition_in(default_slot, local);
+    			transition_in(default_slot_1, local);
+    			current = true;
+    		},
+    		o(local) {
+    			transition_out(default_slot, local);
+    			transition_out(default_slot_1, local);
+    			current = false;
+    		},
+    		d(detaching) {
+    			if (detaching) detach(div2);
+    			if (default_slot) default_slot.d(detaching);
+    			if (default_slot_1) default_slot_1.d(detaching);
+    		}
+    	};
+    }
+
+    function instance($$self, $$props, $$invalidate) {
+    	let { $$slots: slots = {}, $$scope } = $$props;
+
+    	$$self.$$set = $$props => {
+    		if ('$$scope' in $$props) $$invalidate(0, $$scope = $$props.$$scope);
+    	};
+
+    	return [$$scope, slots];
+    }
+
     class Marquee extends SvelteComponent {
     	constructor(options) {
     		super();
-    		init(this, options, null, null, safe_not_equal, {});
+    		init(this, options, instance, create_fragment, safe_not_equal, {}, add_css);
     	}
@@ -245,0 +433,0 @@ }

package.json

 {
 	"name": "svelte-fast-marquee",
-	"version": "0.1.1",
+	"version": "0.2.0",
 	"description": "A Marquee component for Svelte inspired by react-fast-marquee.",
@@ -8,6 +8,7 @@ "main": "dist/index.js",
 	"svelte": "src/index.js",
+	"type": "module",
 	"scripts": {
 		"build": "rollup -c",
-		"dev": "rollup -c -w",
-		"prepublish": "npm run build"
+		"build:watch": "rollup -c -w",
+		"prepublishOnly": "npm run build"
 	},
@@ -18,2 +19,3 @@ "keywords": [
 		"svelte-component",
+		"component",
 		"fast-marquee"
@@ -35,4 +37,4 @@ ],
 	"devDependencies": {
+		"@rollup/plugin-node-resolve": "^13.0.4",
 		"rollup": "^2.53.3",
-		"rollup-plugin-node-resolve": "^5.2.0",
 		"rollup-plugin-svelte": "^7.1.0",
@@ -39,0 +41,0 @@ "svelte": "^3.40.2"

rollup.config.js

 import svelte from 'rollup-plugin-svelte';
-import resolve from 'rollup-plugin-node-resolve';
+import resolve from '@rollup/plugin-node-resolve';
 
@@ -7,11 +7,11 @@ const pkg = require('./package.json');
 export default {
-    input: 'src/Marquee.svelte',
+    input: 'src/index.js',
     output: [
         { file: pkg.module, 'format': 'es' },
-        { file: pkg.main, 'format': 'umd', name: 'Name' }
+        { file: pkg.main, 'format': 'umd', name: pkg.name }
     ],
     plugins: [
-        svelte(),
+        svelte({  emitCss: false }),
         resolve()
     ],
 };

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

31425

increased by72.43%

Lines of code

839

increased by73.71%

Is type module

Yes

No dependency changes