svelte-colourpicker 0.0.1 → 0.0.3

package/ColourPicker.svelte

@@ -184,12 +184,15 @@ import { fade, fly } from "svelte/transition";
 export let value = "rgba(255, 0, 0, 1)";
 const dispatch = createEventDispatcher();
 let c = colour(value);
-$: value = c.rgba;
+$: c && onColourChanged();
+function onColourChanged() {
+    value = c.rgba;
+    dispatch("change", { rgb: { r: c.r, b: c.b, g: c.g }, hsv: { h: c.h, s: c.s, v: c.v }, hex: c.hex, a: c.a });
+}
 $: value && onValueChanged();
 function onValueChanged() {
     if (value != c.rgba) {
         c = colour(value);
-        dispatch("change", { rgb: { r: c.r, b: c.b, g: c.g }, hsv: { h: c.h, s: c.s, v: c.v }, a: c.a });
     }
 }
 let open = false;

package/ColourPicker.svelte.d.ts

@@ -22,6 +22,7 @@ declare const __propDef: {
         change: CustomEvent<{
             rgb: RGB;
             hsv: HSV;
+            hex: `#${string}`;
         } & A>;
     } & {
         [evt: string]: CustomEvent<any>;

package/README.md

@@ -1,5 +1,17 @@
 # Svelte Colour Picker
 
+Svelte Colour Picker
+
+### [Demo](https://svelte-colourpicker.vercel.app/)
+
+Installation:
+
+```
+npm i svelte-colourpicker
+```
+
+Usage:
+
 ```html
 <script>
     let value = "rgba(255, 0, 0, 1)"

package/package.json

@@ -1,6 +1,18 @@
 {
   "name": "svelte-colourpicker",
-  "version": "0.0.1",
+  "version": "0.0.3",
+  "description": "Svelte colour picker component",
+  "keywords": [
+    "color",
+    "colour",
+    "picker",
+    "svelte"
+  ],
+  "homepage": "https://github.com/cooolbros/svelte-colourpicker#readme",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/cooolbros/svelte-colourpicker.git"
+  },
   "devDependencies": {
     "@sveltejs/adapter-auto": "next",
     "@sveltejs/kit": "next",