@responsive-ui/button - npm Package Compare versions

Comparing version 1.0.4-alpha to 1.0.7-alpha.0

lib/cjs/index.js

@@ -57,4 +57,3 @@ 'use strict';
 }
-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);
+function update_slot_base(slot, slot_definition, ctx, $$scope, slot_changes, get_slot_context_fn) {
     if (slot_changes) {
@@ -65,2 +64,13 @@ const slot_context = get_slot_context(slot_definition, ctx, $$scope, get_slot_context_fn);
 }
+function get_all_dirty_from_scope($$scope) {
+    if ($$scope.ctx.length > 32) {
+        const dirty = [];
+        const length = $$scope.ctx.length / 32;
+        for (let i = 0; i < length; i++) {
+            dirty[i] = -1;
+        }
+        return dirty;
+    }
+    return -1;
+}
 function exclude_internal_props(props) {
@@ -146,3 +156,4 @@ const result = {};
     if (callbacks) {
-        callbacks.slice().forEach(fn => fn(event));
+        // @ts-ignore
+        callbacks.slice().forEach(fn => fn.call(this, event));
     }
@@ -311,3 +322,3 @@ }
 }
-function init(component, options, instance, create_fragment, not_equal, props, dirty = [-1]) {
+function init(component, options, instance, create_fragment, not_equal, props, append_styles, dirty = [-1]) {
     const parent_component = current_component;
@@ -329,8 +340,10 @@ set_current_component(component);
         after_update: [],
-        context: new Map(parent_component ? parent_component.$$.context : options.context || []),
+        context: new Map(options.context || (parent_component ? parent_component.$$.context : [])),
         // everything else
         callbacks: blank_object(),
         dirty,
-        skip_bound: false
+        skip_bound: false,
+        root: options.target || parent_component.$$.root
     };
+    append_styles && append_styles($$.root);
     let ready = false;
@@ -398,3 +411,3 @@ $$.ctx = instance
 
-/* components/button/src/Button.svelte generated by Svelte v3.38.2 */
+/* components/button/src/Button.svelte generated by Svelte v3.44.0 */
 
@@ -406,3 +419,3 @@ function fallback_block(ctx) {
 		c() {
-			t = text(/*label*/ ctx[2]);
+			t = text(/*label*/ ctx[4]);
 		},
@@ -413,3 +426,3 @@ m(target, anchor) {
 		p(ctx, dirty) {
-			if (dirty & /*label*/ 4) set_data(t, /*label*/ ctx[2]);
+			if (dirty & /*label*/ 16) set_data(t, /*label*/ ctx[4]);
 		},
@@ -428,13 +441,14 @@ d(detaching) {
 	let dispose;
-	const default_slot_template = /*#slots*/ ctx[8].default;
-	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[7], null);
+	const default_slot_template = /*#slots*/ ctx[10].default;
+	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[9], null);
 	const default_slot_or_fallback = default_slot || fallback_block(ctx);
 
 	let button_levels = [
-		/*$$restProps*/ ctx[6],
+		/*$$restProps*/ ctx[8],
 		{
-			class: button_class_value = "responsive-ui-button " + /*className*/ ctx[1]
+			class: button_class_value = "resp-button resp-button--" + /*variant*/ ctx[2] + " resp-button--" + /*size*/ ctx[3] + " " + /*className*/ ctx[1]
 		},
-		{ type: /*type*/ ctx[3] },
-		{ disabled: /*disabled*/ ctx[5] }
+		{ role: "button" },
+		{ type: /*type*/ ctx[5] },
+		{ disabled: /*disabled*/ ctx[7] }
 	];
@@ -453,4 +467,4 @@
 			set_attributes(button, button_data);
-			toggle_class(button, "responsive-ui-button--outline", /*outline*/ ctx[4]);
-			toggle_class(button, "svelte-1mli4mm", true);
+			toggle_class(button, "resp-button--outline", /*outline*/ ctx[6]);
+			toggle_class(button, "svelte-1vt8bqq", true);
 		},
@@ -464,7 +478,8 @@ m(target, anchor) {
 
-			/*button_binding*/ ctx[10](button);
+			if (button.autofocus) button.focus();
+			/*button_binding*/ ctx[12](button);
 			current = true;
 
 			if (!mounted) {
-				dispose = listen(button, "click", /*click_handler*/ ctx[9]);
+				dispose = listen(button, "click", /*click_handler*/ ctx[11]);
 				mounted = true;
@@ -475,8 +490,17 @@ }
 			if (default_slot) {
-				if (default_slot.p && (!current || dirty & /*$$scope*/ 128)) {
-					update_slot(default_slot, default_slot_template, ctx, /*$$scope*/ ctx[7], dirty, null, null);
+				if (default_slot.p && (!current || dirty & /*$$scope*/ 512)) {
+					update_slot_base(
+						default_slot,
+						default_slot_template,
+						ctx,
+						/*$$scope*/ ctx[9],
+						!current
+						? get_all_dirty_from_scope(/*$$scope*/ ctx[9])
+						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[9], dirty, null),
+						null
+					);
 				}
 			} else {
-				if (default_slot_or_fallback && default_slot_or_fallback.p && dirty & /*label*/ 4) {
-					default_slot_or_fallback.p(ctx, dirty);
+				if (default_slot_or_fallback && default_slot_or_fallback.p && (!current || dirty & /*label*/ 16)) {
+					default_slot_or_fallback.p(ctx, !current ? -1 : dirty);
 				}
@@ -486,10 +510,11 @@ }
 			set_attributes(button, button_data = get_spread_update(button_levels, [
-				dirty & /*$$restProps*/ 64 && /*$$restProps*/ ctx[6],
-				(!current || dirty & /*className*/ 2 && button_class_value !== (button_class_value = "responsive-ui-button " + /*className*/ ctx[1])) && { class: button_class_value },
-				(!current || dirty & /*type*/ 8) && { type: /*type*/ ctx[3] },
-				(!current || dirty & /*disabled*/ 32) && { disabled: /*disabled*/ ctx[5] }
+				dirty & /*$$restProps*/ 256 && /*$$restProps*/ ctx[8],
+				(!current || dirty & /*variant, size, className*/ 14 && button_class_value !== (button_class_value = "resp-button resp-button--" + /*variant*/ ctx[2] + " resp-button--" + /*size*/ ctx[3] + " " + /*className*/ ctx[1])) && { class: button_class_value },
+				{ role: "button" },
+				(!current || dirty & /*type*/ 32) && { type: /*type*/ ctx[5] },
+				(!current || dirty & /*disabled*/ 128) && { disabled: /*disabled*/ ctx[7] }
 			]));
 
-			toggle_class(button, "responsive-ui-button--outline", /*outline*/ ctx[4]);
-			toggle_class(button, "svelte-1mli4mm", true);
+			toggle_class(button, "resp-button--outline", /*outline*/ ctx[6]);
+			toggle_class(button, "svelte-1vt8bqq", true);
 		},
@@ -508,3 +533,3 @@ i(local) {
 			if (default_slot_or_fallback) default_slot_or_fallback.d(detaching);
-			/*button_binding*/ ctx[10](null);
+			/*button_binding*/ ctx[12](null);
 			mounted = false;
@@ -517,6 +542,8 @@ dispose();
 function instance($$self, $$props, $$invalidate) {
-	const omit_props_names = ["class","ref","label","type","outline","disabled"];
+	const omit_props_names = ["class","variant","size","ref","label","type","outline","disabled"];
 	let $$restProps = compute_rest_props($$props, omit_props_names);
 	let { $$slots: slots = {}, $$scope } = $$props;
 	let { class: className = "" } = $$props;
+	let { variant = "default" } = $$props;
+	let { size = "medium" } = $$props;
 	let { ref = null } = $$props;
@@ -529,7 +556,7 @@ let { label = "" } = $$props;
 	function click_handler(event) {
-		bubble($$self, event);
+		bubble.call(this, $$self, event);
 	}
 
 	function button_binding($$value) {
-		binding_callbacks[$$value ? "unshift" : "push"](() => {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
 			ref = $$value;
@@ -542,10 +569,12 @@ $$invalidate(0, ref);
 		$$props = assign(assign({}, $$props), exclude_internal_props($$new_props));
-		$$invalidate(6, $$restProps = compute_rest_props($$props, omit_props_names));
-		if ("class" in $$new_props) $$invalidate(1, className = $$new_props.class);
-		if ("ref" in $$new_props) $$invalidate(0, ref = $$new_props.ref);
-		if ("label" in $$new_props) $$invalidate(2, label = $$new_props.label);
-		if ("type" in $$new_props) $$invalidate(3, type = $$new_props.type);
-		if ("outline" in $$new_props) $$invalidate(4, outline = $$new_props.outline);
-		if ("disabled" in $$new_props) $$invalidate(5, disabled = $$new_props.disabled);
-		if ("$$scope" in $$new_props) $$invalidate(7, $$scope = $$new_props.$$scope);
+		$$invalidate(8, $$restProps = compute_rest_props($$props, omit_props_names));
+		if ('class' in $$new_props) $$invalidate(1, className = $$new_props.class);
+		if ('variant' in $$new_props) $$invalidate(2, variant = $$new_props.variant);
+		if ('size' in $$new_props) $$invalidate(3, size = $$new_props.size);
+		if ('ref' in $$new_props) $$invalidate(0, ref = $$new_props.ref);
+		if ('label' in $$new_props) $$invalidate(4, label = $$new_props.label);
+		if ('type' in $$new_props) $$invalidate(5, type = $$new_props.type);
+		if ('outline' in $$new_props) $$invalidate(6, outline = $$new_props.outline);
+		if ('disabled' in $$new_props) $$invalidate(7, disabled = $$new_props.disabled);
+		if ('$$scope' in $$new_props) $$invalidate(9, $$scope = $$new_props.$$scope);
 	};
@@ -556,2 +585,4 @@
 		className,
+		variant,
+		size,
 		label,
@@ -575,7 +606,9 @@ type,
 			class: 1,
+			variant: 2,
+			size: 3,
 			ref: 0,
-			label: 2,
-			type: 3,
-			outline: 4,
-			disabled: 5
+			label: 4,
+			type: 5,
+			outline: 6,
+			disabled: 7
 		});
@@ -582,0 +615,0 @@ }

lib/esm/index.js

@@ -55,4 +55,3 @@ function noop() { }
 }
-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);
+function update_slot_base(slot, slot_definition, ctx, $$scope, slot_changes, get_slot_context_fn) {
     if (slot_changes) {
@@ -63,2 +62,13 @@ const slot_context = get_slot_context(slot_definition, ctx, $$scope, get_slot_context_fn);
 }
+function get_all_dirty_from_scope($$scope) {
+    if ($$scope.ctx.length > 32) {
+        const dirty = [];
+        const length = $$scope.ctx.length / 32;
+        for (let i = 0; i < length; i++) {
+            dirty[i] = -1;
+        }
+        return dirty;
+    }
+    return -1;
+}
 function exclude_internal_props(props) {
@@ -144,3 +154,4 @@ const result = {};
     if (callbacks) {
-        callbacks.slice().forEach(fn => fn(event));
+        // @ts-ignore
+        callbacks.slice().forEach(fn => fn.call(this, event));
     }
@@ -309,3 +320,3 @@ }
 }
-function init(component, options, instance, create_fragment, not_equal, props, dirty = [-1]) {
+function init(component, options, instance, create_fragment, not_equal, props, append_styles, dirty = [-1]) {
     const parent_component = current_component;
@@ -327,8 +338,10 @@ set_current_component(component);
         after_update: [],
-        context: new Map(parent_component ? parent_component.$$.context : options.context || []),
+        context: new Map(options.context || (parent_component ? parent_component.$$.context : [])),
         // everything else
         callbacks: blank_object(),
         dirty,
-        skip_bound: false
+        skip_bound: false,
+        root: options.target || parent_component.$$.root
     };
+    append_styles && append_styles($$.root);
     let ready = false;
@@ -396,3 +409,3 @@ $$.ctx = instance
 
-/* components/button/src/Button.svelte generated by Svelte v3.38.2 */
+/* components/button/src/Button.svelte generated by Svelte v3.44.0 */
 
@@ -404,3 +417,3 @@ function fallback_block(ctx) {
 		c() {
-			t = text(/*label*/ ctx[2]);
+			t = text(/*label*/ ctx[4]);
 		},
@@ -411,3 +424,3 @@ m(target, anchor) {
 		p(ctx, dirty) {
-			if (dirty & /*label*/ 4) set_data(t, /*label*/ ctx[2]);
+			if (dirty & /*label*/ 16) set_data(t, /*label*/ ctx[4]);
 		},
@@ -426,13 +439,14 @@ d(detaching) {
 	let dispose;
-	const default_slot_template = /*#slots*/ ctx[8].default;
-	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[7], null);
+	const default_slot_template = /*#slots*/ ctx[10].default;
+	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[9], null);
 	const default_slot_or_fallback = default_slot || fallback_block(ctx);
 
 	let button_levels = [
-		/*$$restProps*/ ctx[6],
+		/*$$restProps*/ ctx[8],
 		{
-			class: button_class_value = "responsive-ui-button " + /*className*/ ctx[1]
+			class: button_class_value = "resp-button resp-button--" + /*variant*/ ctx[2] + " resp-button--" + /*size*/ ctx[3] + " " + /*className*/ ctx[1]
 		},
-		{ type: /*type*/ ctx[3] },
-		{ disabled: /*disabled*/ ctx[5] }
+		{ role: "button" },
+		{ type: /*type*/ ctx[5] },
+		{ disabled: /*disabled*/ ctx[7] }
 	];
@@ -451,4 +465,4 @@
 			set_attributes(button, button_data);
-			toggle_class(button, "responsive-ui-button--outline", /*outline*/ ctx[4]);
-			toggle_class(button, "svelte-1mli4mm", true);
+			toggle_class(button, "resp-button--outline", /*outline*/ ctx[6]);
+			toggle_class(button, "svelte-1vt8bqq", true);
 		},
@@ -462,7 +476,8 @@ m(target, anchor) {
 
-			/*button_binding*/ ctx[10](button);
+			if (button.autofocus) button.focus();
+			/*button_binding*/ ctx[12](button);
 			current = true;
 
 			if (!mounted) {
-				dispose = listen(button, "click", /*click_handler*/ ctx[9]);
+				dispose = listen(button, "click", /*click_handler*/ ctx[11]);
 				mounted = true;
@@ -473,8 +488,17 @@ }
 			if (default_slot) {
-				if (default_slot.p && (!current || dirty & /*$$scope*/ 128)) {
-					update_slot(default_slot, default_slot_template, ctx, /*$$scope*/ ctx[7], dirty, null, null);
+				if (default_slot.p && (!current || dirty & /*$$scope*/ 512)) {
+					update_slot_base(
+						default_slot,
+						default_slot_template,
+						ctx,
+						/*$$scope*/ ctx[9],
+						!current
+						? get_all_dirty_from_scope(/*$$scope*/ ctx[9])
+						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[9], dirty, null),
+						null
+					);
 				}
 			} else {
-				if (default_slot_or_fallback && default_slot_or_fallback.p && dirty & /*label*/ 4) {
-					default_slot_or_fallback.p(ctx, dirty);
+				if (default_slot_or_fallback && default_slot_or_fallback.p && (!current || dirty & /*label*/ 16)) {
+					default_slot_or_fallback.p(ctx, !current ? -1 : dirty);
 				}
@@ -484,10 +508,11 @@ }
 			set_attributes(button, button_data = get_spread_update(button_levels, [
-				dirty & /*$$restProps*/ 64 && /*$$restProps*/ ctx[6],
-				(!current || dirty & /*className*/ 2 && button_class_value !== (button_class_value = "responsive-ui-button " + /*className*/ ctx[1])) && { class: button_class_value },
-				(!current || dirty & /*type*/ 8) && { type: /*type*/ ctx[3] },
-				(!current || dirty & /*disabled*/ 32) && { disabled: /*disabled*/ ctx[5] }
+				dirty & /*$$restProps*/ 256 && /*$$restProps*/ ctx[8],
+				(!current || dirty & /*variant, size, className*/ 14 && button_class_value !== (button_class_value = "resp-button resp-button--" + /*variant*/ ctx[2] + " resp-button--" + /*size*/ ctx[3] + " " + /*className*/ ctx[1])) && { class: button_class_value },
+				{ role: "button" },
+				(!current || dirty & /*type*/ 32) && { type: /*type*/ ctx[5] },
+				(!current || dirty & /*disabled*/ 128) && { disabled: /*disabled*/ ctx[7] }
 			]));
 
-			toggle_class(button, "responsive-ui-button--outline", /*outline*/ ctx[4]);
-			toggle_class(button, "svelte-1mli4mm", true);
+			toggle_class(button, "resp-button--outline", /*outline*/ ctx[6]);
+			toggle_class(button, "svelte-1vt8bqq", true);
 		},
@@ -506,3 +531,3 @@ i(local) {
 			if (default_slot_or_fallback) default_slot_or_fallback.d(detaching);
-			/*button_binding*/ ctx[10](null);
+			/*button_binding*/ ctx[12](null);
 			mounted = false;
@@ -515,6 +540,8 @@ dispose();
 function instance($$self, $$props, $$invalidate) {
-	const omit_props_names = ["class","ref","label","type","outline","disabled"];
+	const omit_props_names = ["class","variant","size","ref","label","type","outline","disabled"];
 	let $$restProps = compute_rest_props($$props, omit_props_names);
 	let { $$slots: slots = {}, $$scope } = $$props;
 	let { class: className = "" } = $$props;
+	let { variant = "default" } = $$props;
+	let { size = "medium" } = $$props;
 	let { ref = null } = $$props;
@@ -527,7 +554,7 @@ let { label = "" } = $$props;
 	function click_handler(event) {
-		bubble($$self, event);
+		bubble.call(this, $$self, event);
 	}
 
 	function button_binding($$value) {
-		binding_callbacks[$$value ? "unshift" : "push"](() => {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
 			ref = $$value;
@@ -540,10 +567,12 @@ $$invalidate(0, ref);
 		$$props = assign(assign({}, $$props), exclude_internal_props($$new_props));
-		$$invalidate(6, $$restProps = compute_rest_props($$props, omit_props_names));
-		if ("class" in $$new_props) $$invalidate(1, className = $$new_props.class);
-		if ("ref" in $$new_props) $$invalidate(0, ref = $$new_props.ref);
-		if ("label" in $$new_props) $$invalidate(2, label = $$new_props.label);
-		if ("type" in $$new_props) $$invalidate(3, type = $$new_props.type);
-		if ("outline" in $$new_props) $$invalidate(4, outline = $$new_props.outline);
-		if ("disabled" in $$new_props) $$invalidate(5, disabled = $$new_props.disabled);
-		if ("$$scope" in $$new_props) $$invalidate(7, $$scope = $$new_props.$$scope);
+		$$invalidate(8, $$restProps = compute_rest_props($$props, omit_props_names));
+		if ('class' in $$new_props) $$invalidate(1, className = $$new_props.class);
+		if ('variant' in $$new_props) $$invalidate(2, variant = $$new_props.variant);
+		if ('size' in $$new_props) $$invalidate(3, size = $$new_props.size);
+		if ('ref' in $$new_props) $$invalidate(0, ref = $$new_props.ref);
+		if ('label' in $$new_props) $$invalidate(4, label = $$new_props.label);
+		if ('type' in $$new_props) $$invalidate(5, type = $$new_props.type);
+		if ('outline' in $$new_props) $$invalidate(6, outline = $$new_props.outline);
+		if ('disabled' in $$new_props) $$invalidate(7, disabled = $$new_props.disabled);
+		if ('$$scope' in $$new_props) $$invalidate(9, $$scope = $$new_props.$$scope);
 	};
@@ -554,2 +583,4 @@
 		className,
+		variant,
+		size,
 		label,
@@ -573,7 +604,9 @@ type,
 			class: 1,
+			variant: 2,
+			size: 3,
 			ref: 0,
-			label: 2,
-			type: 3,
-			outline: 4,
-			disabled: 5
+			label: 4,
+			type: 5,
+			outline: 6,
+			disabled: 7
 		});
@@ -583,2 +616,2 @@ }
 
-export default Button;
+export { Button as default };

lib/index.js

@@ -58,4 +58,3 @@ var Button = (function () {
     }
-    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);
+    function update_slot_base(slot, slot_definition, ctx, $$scope, slot_changes, get_slot_context_fn) {
         if (slot_changes) {
@@ -66,2 +65,13 @@ const slot_context = get_slot_context(slot_definition, ctx, $$scope, get_slot_context_fn);
     }
+    function get_all_dirty_from_scope($$scope) {
+        if ($$scope.ctx.length > 32) {
+            const dirty = [];
+            const length = $$scope.ctx.length / 32;
+            for (let i = 0; i < length; i++) {
+                dirty[i] = -1;
+            }
+            return dirty;
+        }
+        return -1;
+    }
     function exclude_internal_props(props) {
@@ -147,3 +157,4 @@ const result = {};
         if (callbacks) {
-            callbacks.slice().forEach(fn => fn(event));
+            // @ts-ignore
+            callbacks.slice().forEach(fn => fn.call(this, event));
         }
@@ -312,3 +323,3 @@ }
     }
-    function init(component, options, instance, create_fragment, not_equal, props, dirty = [-1]) {
+    function init(component, options, instance, create_fragment, not_equal, props, append_styles, dirty = [-1]) {
         const parent_component = current_component;
@@ -330,8 +341,10 @@ set_current_component(component);
             after_update: [],
-            context: new Map(parent_component ? parent_component.$$.context : options.context || []),
+            context: new Map(options.context || (parent_component ? parent_component.$$.context : [])),
             // everything else
             callbacks: blank_object(),
             dirty,
-            skip_bound: false
+            skip_bound: false,
+            root: options.target || parent_component.$$.root
         };
+        append_styles && append_styles($$.root);
         let ready = false;
@@ -399,3 +412,3 @@ $$.ctx = instance
 
-    /* components/button/src/Button.svelte generated by Svelte v3.38.2 */
+    /* components/button/src/Button.svelte generated by Svelte v3.44.0 */
 
@@ -407,3 +420,3 @@ function fallback_block(ctx) {
     		c() {
-    			t = text(/*label*/ ctx[2]);
+    			t = text(/*label*/ ctx[4]);
     		},
@@ -414,3 +427,3 @@ m(target, anchor) {
     		p(ctx, dirty) {
-    			if (dirty & /*label*/ 4) set_data(t, /*label*/ ctx[2]);
+    			if (dirty & /*label*/ 16) set_data(t, /*label*/ ctx[4]);
     		},
@@ -429,13 +442,14 @@ d(detaching) {
     	let dispose;
-    	const default_slot_template = /*#slots*/ ctx[8].default;
-    	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[7], null);
+    	const default_slot_template = /*#slots*/ ctx[10].default;
+    	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[9], null);
     	const default_slot_or_fallback = default_slot || fallback_block(ctx);
 
     	let button_levels = [
-    		/*$$restProps*/ ctx[6],
+    		/*$$restProps*/ ctx[8],
     		{
-    			class: button_class_value = "responsive-ui-button " + /*className*/ ctx[1]
+    			class: button_class_value = "resp-button resp-button--" + /*variant*/ ctx[2] + " resp-button--" + /*size*/ ctx[3] + " " + /*className*/ ctx[1]
     		},
-    		{ type: /*type*/ ctx[3] },
-    		{ disabled: /*disabled*/ ctx[5] }
+    		{ role: "button" },
+    		{ type: /*type*/ ctx[5] },
+    		{ disabled: /*disabled*/ ctx[7] }
     	];
@@ -454,4 +468,4 @@
     			set_attributes(button, button_data);
-    			toggle_class(button, "responsive-ui-button--outline", /*outline*/ ctx[4]);
-    			toggle_class(button, "svelte-1mli4mm", true);
+    			toggle_class(button, "resp-button--outline", /*outline*/ ctx[6]);
+    			toggle_class(button, "svelte-1vt8bqq", true);
     		},
@@ -465,7 +479,8 @@ m(target, anchor) {
 
-    			/*button_binding*/ ctx[10](button);
+    			if (button.autofocus) button.focus();
+    			/*button_binding*/ ctx[12](button);
     			current = true;
 
     			if (!mounted) {
-    				dispose = listen(button, "click", /*click_handler*/ ctx[9]);
+    				dispose = listen(button, "click", /*click_handler*/ ctx[11]);
     				mounted = true;
@@ -476,8 +491,17 @@ }
     			if (default_slot) {
-    				if (default_slot.p && (!current || dirty & /*$$scope*/ 128)) {
-    					update_slot(default_slot, default_slot_template, ctx, /*$$scope*/ ctx[7], dirty, null, null);
+    				if (default_slot.p && (!current || dirty & /*$$scope*/ 512)) {
+    					update_slot_base(
+    						default_slot,
+    						default_slot_template,
+    						ctx,
+    						/*$$scope*/ ctx[9],
+    						!current
+    						? get_all_dirty_from_scope(/*$$scope*/ ctx[9])
+    						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[9], dirty, null),
+    						null
+    					);
     				}
     			} else {
-    				if (default_slot_or_fallback && default_slot_or_fallback.p && dirty & /*label*/ 4) {
-    					default_slot_or_fallback.p(ctx, dirty);
+    				if (default_slot_or_fallback && default_slot_or_fallback.p && (!current || dirty & /*label*/ 16)) {
+    					default_slot_or_fallback.p(ctx, !current ? -1 : dirty);
     				}
@@ -487,10 +511,11 @@ }
     			set_attributes(button, button_data = get_spread_update(button_levels, [
-    				dirty & /*$$restProps*/ 64 && /*$$restProps*/ ctx[6],
-    				(!current || dirty & /*className*/ 2 && button_class_value !== (button_class_value = "responsive-ui-button " + /*className*/ ctx[1])) && { class: button_class_value },
-    				(!current || dirty & /*type*/ 8) && { type: /*type*/ ctx[3] },
-    				(!current || dirty & /*disabled*/ 32) && { disabled: /*disabled*/ ctx[5] }
+    				dirty & /*$$restProps*/ 256 && /*$$restProps*/ ctx[8],
+    				(!current || dirty & /*variant, size, className*/ 14 && button_class_value !== (button_class_value = "resp-button resp-button--" + /*variant*/ ctx[2] + " resp-button--" + /*size*/ ctx[3] + " " + /*className*/ ctx[1])) && { class: button_class_value },
+    				{ role: "button" },
+    				(!current || dirty & /*type*/ 32) && { type: /*type*/ ctx[5] },
+    				(!current || dirty & /*disabled*/ 128) && { disabled: /*disabled*/ ctx[7] }
     			]));
 
-    			toggle_class(button, "responsive-ui-button--outline", /*outline*/ ctx[4]);
-    			toggle_class(button, "svelte-1mli4mm", true);
+    			toggle_class(button, "resp-button--outline", /*outline*/ ctx[6]);
+    			toggle_class(button, "svelte-1vt8bqq", true);
     		},
@@ -509,3 +534,3 @@ i(local) {
     			if (default_slot_or_fallback) default_slot_or_fallback.d(detaching);
-    			/*button_binding*/ ctx[10](null);
+    			/*button_binding*/ ctx[12](null);
     			mounted = false;
@@ -518,6 +543,8 @@ dispose();
     function instance($$self, $$props, $$invalidate) {
-    	const omit_props_names = ["class","ref","label","type","outline","disabled"];
+    	const omit_props_names = ["class","variant","size","ref","label","type","outline","disabled"];
     	let $$restProps = compute_rest_props($$props, omit_props_names);
     	let { $$slots: slots = {}, $$scope } = $$props;
     	let { class: className = "" } = $$props;
+    	let { variant = "default" } = $$props;
+    	let { size = "medium" } = $$props;
     	let { ref = null } = $$props;
@@ -530,7 +557,7 @@ let { label = "" } = $$props;
     	function click_handler(event) {
-    		bubble($$self, event);
+    		bubble.call(this, $$self, event);
     	}
 
     	function button_binding($$value) {
-    		binding_callbacks[$$value ? "unshift" : "push"](() => {
+    		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
     			ref = $$value;
@@ -543,10 +570,12 @@ $$invalidate(0, ref);
     		$$props = assign(assign({}, $$props), exclude_internal_props($$new_props));
-    		$$invalidate(6, $$restProps = compute_rest_props($$props, omit_props_names));
-    		if ("class" in $$new_props) $$invalidate(1, className = $$new_props.class);
-    		if ("ref" in $$new_props) $$invalidate(0, ref = $$new_props.ref);
-    		if ("label" in $$new_props) $$invalidate(2, label = $$new_props.label);
-    		if ("type" in $$new_props) $$invalidate(3, type = $$new_props.type);
-    		if ("outline" in $$new_props) $$invalidate(4, outline = $$new_props.outline);
-    		if ("disabled" in $$new_props) $$invalidate(5, disabled = $$new_props.disabled);
-    		if ("$$scope" in $$new_props) $$invalidate(7, $$scope = $$new_props.$$scope);
+    		$$invalidate(8, $$restProps = compute_rest_props($$props, omit_props_names));
+    		if ('class' in $$new_props) $$invalidate(1, className = $$new_props.class);
+    		if ('variant' in $$new_props) $$invalidate(2, variant = $$new_props.variant);
+    		if ('size' in $$new_props) $$invalidate(3, size = $$new_props.size);
+    		if ('ref' in $$new_props) $$invalidate(0, ref = $$new_props.ref);
+    		if ('label' in $$new_props) $$invalidate(4, label = $$new_props.label);
+    		if ('type' in $$new_props) $$invalidate(5, type = $$new_props.type);
+    		if ('outline' in $$new_props) $$invalidate(6, outline = $$new_props.outline);
+    		if ('disabled' in $$new_props) $$invalidate(7, disabled = $$new_props.disabled);
+    		if ('$$scope' in $$new_props) $$invalidate(9, $$scope = $$new_props.$$scope);
     	};
@@ -557,2 +586,4 @@
     		className,
+    		variant,
+    		size,
     		label,
@@ -576,7 +607,9 @@ type,
     			class: 1,
+    			variant: 2,
+    			size: 3,
     			ref: 0,
-    			label: 2,
-    			type: 3,
-    			outline: 4,
-    			disabled: 5
+    			label: 4,
+    			type: 5,
+    			outline: 6,
+    			disabled: 7
     		});
@@ -588,2 +621,2 @@ }
 
-}());
+})();

lib/index.min.js

@@ -1,1 +0,1 @@
-!function(){function t(t,n){if(!(t instanceof n))throw new TypeError("Cannot call a class as a function")}function n(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function e(t,n){return(e=Object.setPrototypeOf||function(t,n){return t.__proto__=n,t})(t,n)}function r(t){return(r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function o(t,e){return!e||"object"!==r(e)&&"function"!=typeof e?n(t):e}function i(t){return(i=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function u(t,n){(null==n||n>t.length)&&(n=t.length);for(var e=0,r=new Array(n);e<n;e++)r[e]=t[e];return r}function f(t,n){if(t){if("string"==typeof t)return u(t,n);var e=Object.prototype.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?u(t,n):void 0}}function c(t,n){return function(t){if(Array.isArray(t))return t}(t)||function(t,n){var e=t&&("undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"]);if(null!=e){var r,o,i=[],u=!0,f=!1;try{for(e=e.call(t);!(u=(r=e.next()).done)&&(i.push(r.value),!n||i.length!==n);u=!0);}catch(t){f=!0,o=t}finally{try{u||null==e.return||e.return()}finally{if(f)throw o}}return i}}(t,n)||f(t,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function a(t){return function(t){if(Array.isArray(t))return u(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||f(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function l(t,n){for(var e=0;e<n.length;e++){var r=n[e];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}function s(){}function d(t,n){for(var e in n)t[e]=n[e];return t}function v(t){return t()}function p(){return Object.create(null)}function y(t){t.forEach(v)}function b(t){return"function"==typeof t}function m(t,n){return t!=t?n==n:t!==n||t&&"object"===r(t)||"function"==typeof t}function h(t,n,e,r){return t[1]&&r?d(e.ctx.slice(),t[1](r(n))):e.ctx}function $(t,n,e,o,i,u,f){var c=function(t,n,e,o){if(t[2]&&o){var i=t[2](o(e));if(void 0===n.dirty)return i;if("object"===r(i)){for(var u=[],f=Math.max(n.dirty.length,i.length),c=0;c<f;c+=1)u[c]=n.dirty[c]|i[c];return u}return n.dirty|i}return n.dirty}(n,o,i,u);if(c){var a=h(n,e,o,f);t.p(a,c)}}function g(t,n){var e={};for(var r in n=new Set(n),t)n.has(r)||"$"===r[0]||(e[r]=t[r]);return e}function _(t,n,e){t.insertBefore(n,e||null)}function w(t){t.parentNode.removeChild(t)}function S(t,n,e){null==e?t.removeAttribute(n):t.getAttribute(n)!==e&&t.setAttribute(n,e)}function O(t,n){var e=Object.getOwnPropertyDescriptors(t.__proto__);for(var r in n)null==n[r]?t.removeAttribute(r):"style"===r?t.style.cssText=n[r]:"__value"===r?t.value=t[r]=n[r]:e[r]&&e[r].set?t[r]=n[r]:S(t,r,n[r])}function j(t){return Array.from(t.childNodes)}function A(t,n,e){t.classList[e?"add":"remove"](n)}var E;function x(t){E=t}var P=[],R=[],T=[],I=[],k=Promise.resolve(),B=!1;function C(t){T.push(t)}var L=!1,N=new Set;function M(){if(!L){L=!0;do{for(var t=0;t<P.length;t+=1){var n=P[t];x(n),D(n.$$)}for(x(null),P.length=0;R.length;)R.pop()();for(var e=0;e<T.length;e+=1){var r=T[e];N.has(r)||(N.add(r),r())}T.length=0}while(P.length);for(;I.length;)I.pop()();B=!1,L=!1,N.clear()}}function D(t){if(null!==t.fragment){t.update(),y(t.before_update);var n=t.dirty;t.dirty=[-1],t.fragment&&t.fragment.p(t.ctx,n),t.after_update.forEach(C)}}var U=new Set;function q(t,n){t&&t.i&&(U.delete(t),t.i(n))}function z(t,n,e,r){var o=t.$$,i=o.fragment,u=o.on_mount,f=o.on_destroy,c=o.after_update;i&&i.m(n,e),r||C((function(){var n=u.map(v).filter(b);f?f.push.apply(f,a(n)):y(n),t.$$.on_mount=[]})),c.forEach(C)}function F(t,n){-1===t.$$.dirty[0]&&(P.push(t),B||(B=!0,k.then(M)),t.$$.dirty.fill(0)),t.$$.dirty[n/31|0]|=1<<n%31}function G(t){var n=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(t){return!1}}();return function(){var e,r=i(t);if(n){var u=i(this).constructor;e=Reflect.construct(r,arguments,u)}else e=r.apply(this,arguments);return o(this,e)}}function H(t){var n;return{c:function(){var e;e=t[2],n=document.createTextNode(e)},m:function(t,e){_(t,n,e)},p:function(t,e){4&e&&function(t,n){n=""+n,t.wholeText!==n&&(t.data=n)}(n,t[2])},d:function(t){t&&w(n)}}}function J(t){for(var n,e,r,o,i,u=t[8].default,f=function(t,n,e,r){if(t){var o=h(t,n,e,r);return t[0](o)}}(u,t,t[7],null),a=f||H(t),l=[t[6],{class:e="responsive-ui-button "+t[1]},{type:t[3]},{disabled:t[5]}],s={},v=0;v<l.length;v+=1)s=d(s,l[v]);return{c:function(){var e;e="button",n=document.createElement(e),a&&a.c(),O(n,s),A(n,"responsive-ui-button--outline",t[4]),A(n,"svelte-1mli4mm",!0)},m:function(e,u){var f,c,l,s;_(e,n,u),a&&a.m(n,null),t[10](n),r=!0,o||(f=n,c="click",l=t[9],f.addEventListener(c,l,s),i=function(){return f.removeEventListener(c,l,s)},o=!0)},p:function(t,o){var i=c(o,1)[0];f?f.p&&(!r||128&i)&&$(f,u,t,t[7],i,null,null):a&&a.p&&4&i&&a.p(t,i),O(n,s=function(t,n){for(var e={},r={},o={$$scope:1},i=t.length;i--;){var u=t[i],f=n[i];if(f){for(var c in u)c in f||(r[c]=1);for(var a in f)o[a]||(e[a]=f[a],o[a]=1);t[i]=f}else for(var l in u)o[l]=1}for(var s in r)s in e||(e[s]=void 0);return e}(l,[64&i&&t[6],(!r||2&i&&e!==(e="responsive-ui-button "+t[1]))&&{class:e},(!r||8&i)&&{type:t[3]},(!r||32&i)&&{disabled:t[5]}])),A(n,"responsive-ui-button--outline",t[4]),A(n,"svelte-1mli4mm",!0)},i:function(t){r||(q(a,t),r=!0)},o:function(t){!function(t,n,e,r){if(t&&t.o){if(U.has(t))return;U.add(t),(void 0).c.push((function(){U.delete(t),r&&(e&&t.d(1),r())})),t.o(n)}}(a,t),r=!1},d:function(e){e&&w(n),a&&a.d(e),t[10](null),o=!1,i()}}}function K(t,n,e){var r=["class","ref","label","type","outline","disabled"],o=g(n,r),i=n,u=i.$$slots,f=void 0===u?{}:u,c=i.$$scope,a=n.class,l=void 0===a?"":a,s=n.ref,v=void 0===s?null:s,p=n.label,y=void 0===p?"":p,b=n.type,m=void 0===b?"button":b,h=n.outline,$=void 0!==h&&h,_=n.disabled,w=void 0!==_&&_;return t.$$set=function(t){n=d(d({},n),function(t){var n={};for(var e in t)"$"!==e[0]&&(n[e]=t[e]);return n}(t)),e(6,o=g(n,r)),"class"in t&&e(1,l=t.class),"ref"in t&&e(0,v=t.ref),"label"in t&&e(2,y=t.label),"type"in t&&e(3,m=t.type),"outline"in t&&e(4,$=t.outline),"disabled"in t&&e(5,w=t.disabled),"$$scope"in t&&e(7,c=t.$$scope)},[v,l,y,m,$,w,o,c,f,function(n){!function(t,n){var e=t.$$.callbacks[n.type];e&&e.slice().forEach((function(t){return t(n)}))}(t,n)},function(t){R[t?"unshift":"push"]((function(){e(0,v=t)}))}]}}();
+!function(){function t(t,n){if(!(t instanceof n))throw new TypeError("Cannot call a class as a function")}function n(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function e(t,n){return e=Object.setPrototypeOf||function(t,n){return t.__proto__=n,t},e(t,n)}function r(t){return r="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},r(t)}function o(t,e){if(e&&("object"===r(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return n(t)}function i(t){return i=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)},i(t)}function u(t,n){(null==n||n>t.length)&&(n=t.length);for(var e=0,r=new Array(n);e<n;e++)r[e]=t[e];return r}function a(t,n){if(t){if("string"==typeof t)return u(t,n);var e=Object.prototype.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?u(t,n):void 0}}function c(t,n){return function(t){if(Array.isArray(t))return t}(t)||function(t,n){var e=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=e){var r,o,i=[],u=!0,a=!1;try{for(e=e.call(t);!(u=(r=e.next()).done)&&(i.push(r.value),!n||i.length!==n);u=!0);}catch(t){a=!0,o=t}finally{try{u||null==e.return||e.return()}finally{if(a)throw o}}return i}}(t,n)||a(t,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function f(t){return function(t){if(Array.isArray(t))return u(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||a(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function l(t,n){for(var e=0;e<n.length;e++){var r=n[e];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}function s(){}function d(t,n){for(var e in n)t[e]=n[e];return t}function p(t){return t()}function v(){return Object.create(null)}function y(t){t.forEach(p)}function b(t){return"function"==typeof t}function h(t,n){return t!=t?n==n:t!==n||t&&"object"===r(t)||"function"==typeof t}function m(t,n,e,r){return t[1]&&r?d(e.ctx.slice(),t[1](r(n))):e.ctx}function $(t,n){var e={};for(var r in n=new Set(n),t)n.has(r)||"$"===r[0]||(e[r]=t[r]);return e}function g(t,n,e){t.insertBefore(n,e||null)}function _(t){t.parentNode.removeChild(t)}function w(t,n,e){null==e?t.removeAttribute(n):t.getAttribute(n)!==e&&t.setAttribute(n,e)}function x(t,n){var e=Object.getOwnPropertyDescriptors(t.__proto__);for(var r in n)null==n[r]?t.removeAttribute(r):"style"===r?t.style.cssText=n[r]:"__value"===r?t.value=t[r]=n[r]:e[r]&&e[r].set?t[r]=n[r]:w(t,r,n[r])}function O(t){return Array.from(t.childNodes)}function j(t,n,e){t.classList[e?"add":"remove"](n)}var S;function E(t){S=t}function k(t,n){var e=this,r=t.$$.callbacks[n.type];r&&r.slice().forEach((function(t){return t.call(e,n)}))}var A=[],P=[],T=[],R=[],q=Promise.resolve(),z=!1;function I(t){T.push(t)}var B=!1,C=new Set;function L(){if(!B){B=!0;do{for(var t=0;t<A.length;t+=1){var n=A[t];E(n),M(n.$$)}for(E(null),A.length=0;P.length;)P.pop()();for(var e=0;e<T.length;e+=1){var r=T[e];C.has(r)||(C.add(r),r())}T.length=0}while(A.length);for(;R.length;)R.pop()();z=!1,B=!1,C.clear()}}function M(t){if(null!==t.fragment){t.update(),y(t.before_update);var n=t.dirty;t.dirty=[-1],t.fragment&&t.fragment.p(t.ctx,n),t.after_update.forEach(I)}}var N=new Set;function D(t,n){t&&t.i&&(N.delete(t),t.i(n))}function U(t,n,e,r){var o=t.$$,i=o.fragment,u=o.on_mount,a=o.on_destroy,c=o.after_update;i&&i.m(n,e),r||I((function(){var n=u.map(p).filter(b);a?a.push.apply(a,f(n)):y(n),t.$$.on_mount=[]})),c.forEach(I)}function F(t,n){-1===t.$$.dirty[0]&&(A.push(t),z||(z=!0,q.then(L)),t.$$.dirty.fill(0)),t.$$.dirty[n/31|0]|=1<<n%31}function G(t){var n=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(t){return!1}}();return function(){var e,r=i(t);if(n){var u=i(this).constructor;e=Reflect.construct(r,arguments,u)}else e=r.apply(this,arguments);return o(this,e)}}function H(t){var n;return{c:function(){var e;e=t[4],n=document.createTextNode(e)},m:function(t,e){g(t,n,e)},p:function(t,e){16&e&&function(t,n){n=""+n,t.wholeText!==n&&(t.data=n)}(n,t[4])},d:function(t){t&&_(n)}}}function J(t){for(var n,e,o,i,u,a=t[10].default,f=function(t,n,e,r){if(t){var o=m(t,n,e,r);return t[0](o)}}(a,t,t[9],null),l=f||H(t),s=[t[8],{class:e="resp-button resp-button--"+t[2]+" resp-button--"+t[3]+" "+t[1]},{role:"button"},{type:t[5]},{disabled:t[7]}],p={},v=0;v<s.length;v+=1)p=d(p,s[v]);return{c:function(){var e;e="button",n=document.createElement(e),l&&l.c(),x(n,p),j(n,"resp-button--outline",t[6]),j(n,"svelte-1vt8bqq",!0)},m:function(e,r){var a,c,f,s;g(e,n,r),l&&l.m(n,null),n.autofocus&&n.focus(),t[12](n),o=!0,i||(a=n,c="click",f=t[11],a.addEventListener(c,f,s),u=function(){return a.removeEventListener(c,f,s)},i=!0)},p:function(t,i){var u=c(i,1)[0];f?f.p&&(!o||512&u)&&function(t,n,e,r,o,i){if(o){var u=m(n,e,r,i);t.p(u,o)}}(f,a,t,t[9],o?function(t,n,e,o){if(t[2]&&o){var i=t[2](o(e));if(void 0===n.dirty)return i;if("object"===r(i)){for(var u=[],a=Math.max(n.dirty.length,i.length),c=0;c<a;c+=1)u[c]=n.dirty[c]|i[c];return u}return n.dirty|i}return n.dirty}(a,t[9],u,null):function(t){if(t.ctx.length>32){for(var n=[],e=t.ctx.length/32,r=0;r<e;r++)n[r]=-1;return n}return-1}(t[9]),null):l&&l.p&&(!o||16&u)&&l.p(t,o?u:-1),x(n,p=function(t,n){for(var e={},r={},o={$$scope:1},i=t.length;i--;){var u=t[i],a=n[i];if(a){for(var c in u)c in a||(r[c]=1);for(var f in a)o[f]||(e[f]=a[f],o[f]=1);t[i]=a}else for(var l in u)o[l]=1}for(var s in r)s in e||(e[s]=void 0);return e}(s,[256&u&&t[8],(!o||14&u&&e!==(e="resp-button resp-button--"+t[2]+" resp-button--"+t[3]+" "+t[1]))&&{class:e},{role:"button"},(!o||32&u)&&{type:t[5]},(!o||128&u)&&{disabled:t[7]}])),j(n,"resp-button--outline",t[6]),j(n,"svelte-1vt8bqq",!0)},i:function(t){o||(D(l,t),o=!0)},o:function(t){!function(t,n,e,r){if(t&&t.o){if(N.has(t))return;N.add(t),(void 0).c.push((function(){N.delete(t),r&&(e&&t.d(1),r())})),t.o(n)}}(l,t),o=!1},d:function(e){e&&_(n),l&&l.d(e),t[12](null),i=!1,u()}}}function K(t,n,e){var r=["class","variant","size","ref","label","type","outline","disabled"],o=$(n,r),i=n,u=i.$$slots,a=void 0===u?{}:u,c=i.$$scope,f=n.class,l=void 0===f?"":f,s=n.variant,p=void 0===s?"default":s,v=n.size,y=void 0===v?"medium":v,b=n.ref,h=void 0===b?null:b,m=n.label,g=void 0===m?"":m,_=n.type,w=void 0===_?"button":_,x=n.outline,O=void 0!==x&&x,j=n.disabled,S=void 0!==j&&j;return t.$$set=function(t){n=d(d({},n),function(t){var n={};for(var e in t)"$"!==e[0]&&(n[e]=t[e]);return n}(t)),e(8,o=$(n,r)),"class"in t&&e(1,l=t.class),"variant"in t&&e(2,p=t.variant),"size"in t&&e(3,y=t.size),"ref"in t&&e(0,h=t.ref),"label"in t&&e(4,g=t.label),"type"in t&&e(5,w=t.type),"outline"in t&&e(6,O=t.outline),"disabled"in t&&e(7,S=t.disabled),"$$scope"in t&&e(9,c=t.$$scope)},[h,l,p,y,g,w,O,S,o,c,a,function(n){k.call(this,t,n)},function(t){P[t?"unshift":"push"]((function(){e(0,h=t)}))}]}var Q=function(r){!function(t,n){if("function"!=typeof n&&null!==n)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(n&&n.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),n&&e(t,n)}(i,r);var o=G(i);function i(e){var r;return t(this,i),function(t,n,e,r,o,i,u){var a=arguments.length>7&&void 0!==arguments[7]?arguments[7]:[-1],c=S;E(t);var f=t.$$={fragment:null,ctx:null,props:i,update:s,not_equal:o,bound:v(),on_mount:[],on_destroy:[],on_disconnect:[],before_update:[],after_update:[],context:new Map(n.context||(c?c.$$.context:[])),callbacks:v(),dirty:a,skip_bound:!1,root:n.target||c.$$.root};u&&u(f.root);var l=!1;if(f.ctx=e?e(t,n.props||{},(function(n,e){var r=!(arguments.length<=2)&&arguments.length-2?arguments.length<=2?void 0:arguments[2]:e;return f.ctx&&o(f.ctx[n],f.ctx[n]=r)&&(!f.skip_bound&&f.bound[n]&&f.bound[n](r),l&&F(t,n)),e})):[],f.update(),l=!0,y(f.before_update),f.fragment=!!r&&r(f.ctx),n.target){if(n.hydrate){var d=O(n.target);f.fragment&&f.fragment.l(d),d.forEach(_)}else f.fragment&&f.fragment.c();n.intro&&D(t.$$.fragment),U(t,n.target,n.anchor,n.customElement),L()}E(c)}(n(r=o.call(this)),e,K,J,h,{class:1,variant:2,size:3,ref:0,label:4,type:5,outline:6,disabled:7}),r}return i}(function(){function n(){t(this,n)}var e,r,o;return e=n,(r=[{key:"$destroy",value:function(){var t,n;t=1,null!==(n=this.$$).fragment&&(y(n.on_destroy),n.fragment&&n.fragment.d(t),n.on_destroy=n.fragment=null,n.ctx=[]),this.$destroy=s}},{key:"$on",value:function(t,n){var e=this.$$.callbacks[t]||(this.$$.callbacks[t]=[]);return e.push(n),function(){var t=e.indexOf(n);-1!==t&&e.splice(t,1)}}},{key:"$set",value:function(t){var n;this.$$set&&(n=t,0!==Object.keys(n).length)&&(this.$$.skip_bound=!0,this.$$set(t),this.$$.skip_bound=!1)}}])&&l(e.prototype,r),o&&l(e,o),n}())}();

package.json

 {
   "name": "@responsive-ui/button",
-  "version": "1.0.4-alpha",
+  "version": "1.0.7-alpha.0",
   "description": "A button component of responsive-ui.",
   "author": "Si3nLoong <[e-mail]> (https://github.com/si3nloong)",
-  "homepage": "https://github.com/wetix/responsive-ui/blob/master/components/button#README.md",
+  "homepage": "https://github.com/wetix/responsive-ui/blob/main/components/button#README.md",
   "license": "MIT",
@@ -48,3 +48,3 @@ "main": "lib/cjs/index.js",
   },
-  "gitHead": "0b68dfad9c872a1058b926f61ae5b7a33c441e22"
+  "gitHead": "3fde8242766d6298122a874e2415ced21cd78f27"
 }

README.md

@@ -0,1 +1,2 @@
+
 # @responsive-ui/button
@@ -9,9 +10,9 @@
 [![npm](https://img.shields.io/npm/v/@responsive-ui/button.svg)](https://www.npmjs.com/package/@responsive-ui/button)
-[![Bundle Size](https://badgen.net/bundlephobia/minzip/%40responsive-ui%2Fbutton)](https://bundlephobia.com/result?p=@responsive-ui/button)
+[![Bundle Size](https://badgen.net/bundlephobia/minzip/%40responsive-ui%2Fbutton)](https://bundlephobia.com/result?p=%40responsive-ui%2Fbutton)
 [![download](https://img.shields.io/npm/dw/@responsive-ui/button.svg)](https://www.npmjs.com/package/@responsive-ui/button)
-[![LICENCE](https://img.shields.io/github/license/wetix/responsive-ui)](https://github.com/wetix/responsive-ui/blob/master/LICENSE)
+[![LICENCE](https://img.shields.io/github/license/wetix/responsive-ui)](https://github.com/wetix/responsive-ui/blob/main/LICENSE)
 
 </p>
 
-## Install
+## 🔨 Install
 
@@ -28,61 +29,12 @@ ```console
 
-## Look and Feel
+## 🔋 Sponsors
 
-<img src="https://user-images.githubusercontent.com/28108597/104029132-92224b80-5204-11eb-9bc0-032449eb8053.png"
-alt="@responsive-ui/button" />
+<img src="https://asset.wetix.my/images/logo/wetix.png" alt="WeTix" width="200px">
 
-## Properties, Events & Slots
+## 📄 License
 
-```ts
-interface ButtonProps {
-  label?: string;
-  name?: string;
-  type?: "button" | "submit" | "reset";
-  class?: string;
-  disabled?: boolean;
-  form?: string;
-  style?: string;
-}
+[@responsive-ui/accordion](https://github.com/wetix/responsive-ui/tree/main/components/accordion) is 100% free and open-source, under the [MIT license](https://github.com/wetix/responsive-ui/blob/main/LICENSE).
 
-interface ButtonEvents {
-  click?: any;
-}
+## 🎉 Big Thanks To
 
-interface ButtonSlots {
-  default: {};
-}
-
-declare class Button extends SvelteComponentTyped<
-  ButtonProps,
-  ButtonEvents,
-  ButtonSlots
-> {}
-```
-
-## Example
-
-```svelte
-<script>
-  import Button from '@responsive-ui/button';
-
-  const onClick = () => {
-    console.log("clicked!");
-  }
-</script>
-
-<Button label="Click me" on:click={onClick}></Button>
-```
-
-[Try it yourself in Svelte Repl](https://svelte.dev/repl/d21567c5cfb24e7ea136ebfc0a269bfe?version=latest)
-
-## Sponsors
-
-<img src="https://asset.wetix.my/images/logo/wetix.png" alt="WeTix" width="240px">
-
-## License
-
-[@responsive-ui/button](https://github.com/wetix/responsive-ui/tree/master/components/button) is 100% free and open-source, under the [MIT license](https://github.com/wetix/responsive-ui/blob/master/LICENSE).
-
-## Big Thanks To
-
 Thanks to these awesome companies for their support of Open Source developers ❤
@@ -89,0 +41,0 @@

types/index.d.ts

@@ -5,2 +5,4 @@ import type { SvelteComponentTyped } from "svelte/internal";
   id?: string;
+  size?: "small" | "medium" | "large";
+  variant?: "default" | "primary" | "link";
   ref?: null | HTMLButtonElement;
@@ -7,0 +9,0 @@ label?: string;

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

72304

increased by9.19%

Lines of code

1788

increased by6.56%

Worsened metrics

Number of lines in readme file

42

decreased by-53.33%

No dependency changes