hamzus-ui 0.0.245 → 0.0.246

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "hamzus-ui",
-	"version": "0.0.245",
+	"version": "0.0.246",
 	"type": "module",
 	"main": "index.js",
 	"svelte": "index.js",

package/src/components/hamzus-ui/Readme/Readme.svelte

@@ -3,45 +3,28 @@
 	import IconButton from '..//IconButton/IconButton.svelte';
 
 	// ---------- État ----------
-	export let initialValue = `# Mon Projet
-
-> Une courte description qui donne envie de scroller.
-
-## Installation
-
-\`\`\`bash
-npm install mon-projet
-\`\`\`
-
-## Utilisation
-
-\`\`\`js
-import { run } from 'mon-projet'
-run()
-\`\`\`
-
-- [x] Setup du repo
-- [ ] Écrire les tests
-- [ ] Publier sur npm
-
-Voir la [documentation](https://example.com) pour plus de détails.
-`;
-
-	let source = initialValue;
+	export let value = ``;
+	export let onChange = ()=>{};
+    let previousValue = value;
 	let mode = 'split'; // 'edit' | 'split' | 'preview'
 	let filename = 'README.md';
 	let dirty = false;
 	let textareaEl;
 	let copied = false;
 
-	$: wordCount = (source.match(/\S+/g) || []).length;
-	$: charCount = source.length;
+	$: wordCount = (value.match(/\S+/g) || []).length;
+	$: charCount = value.length;
 	$: readMinutes = Math.max(1, Math.round(wordCount / 200));
-	$: html = renderMarkdown(source);
+	$: html = renderMarkdown(value);
 
 	function onInput(e) {
-		source = e.target.value;
+		value = e.target.value;
 		dirty = true;
+        if (previousValue !== value) {
+            onChange(value)
+        }
+
+        previousValue = value
 	}
 
 	// ---------- Petit moteur markdown (sans dépendance) ----------
@@ -186,9 +169,9 @@ Voir la [documentation](https://example.com) pour plus de détails.
 		if (!textareaEl) return;
 		const start = textareaEl.selectionStart;
 		const end = textareaEl.selectionEnd;
-		const selected = source.slice(start, end) || placeholder;
-		const next = source.slice(0, start) + before + selected + after + source.slice(end);
-		source = next;
+		const selected = value.slice(start, end) || placeholder;
+		const next = value.slice(0, start) + before + selected + after + value.slice(end);
+		value = next;
 		dirty = true;
 		requestAnimationFrame(() => {
 			textareaEl.focus();
@@ -200,8 +183,8 @@ Voir la [documentation](https://example.com) pour plus de détails.
 	function insertLinePrefix(prefix) {
 		if (!textareaEl) return;
 		const start = textareaEl.selectionStart;
-		const lineStart = source.lastIndexOf('\n', start - 1) + 1;
-		source = source.slice(0, lineStart) + prefix + source.slice(lineStart);
+		const lineStart = value.lastIndexOf('\n', start - 1) + 1;
+		value = value.slice(0, lineStart) + prefix + value.slice(lineStart);
 		dirty = true;
 		requestAnimationFrame(() => textareaEl.focus());
 	}
@@ -220,7 +203,7 @@ Voir la [documentation](https://example.com) pour plus de détails.
 
 	async function copyMarkdown() {
 		try {
-			await navigator.clipboard.writeText(source);
+			await navigator.clipboard.writeText(value);
 			copied = true;
 			setTimeout(() => (copied = false), 1600);
 		} catch (e) {
@@ -229,7 +212,7 @@ Voir la [documentation](https://example.com) pour plus de détails.
 	}
 
 	function downloadFile() {
-		const blob = new Blob([source], { type: 'text/markdown;charset=utf-8' });
+		const blob = new Blob([value], { type: 'text/markdown;charset=utf-8' });
 		const url = URL.createObjectURL(blob);
 		const a = document.createElement('a');
 		a.href = url;
@@ -262,7 +245,7 @@ Voir la [documentation](https://example.com) pour plus de détails.
 				bind:this={textareaEl}
 				class="editor-pane"
 				spellcheck="false"
-				value={source}
+				value={value}
 				on:input={onInput}
 				placeholder="Écris ton README en Markdown..."
 			></textarea>