From f3b1863f093124309963c3ad7c275142cd370b0f Mon Sep 17 00:00:00 2001
From: Corentin Thomasset <corentin.thomasset74@gmail.com>
Date: Sun, 26 Mar 2023 19:04:42 +0200
Subject: feat(new-tool): html wysiwyg editor

---
 src/tools/html-wysiwyg-editor/html-wysiwyg-editor.vue | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)
 create mode 100644 src/tools/html-wysiwyg-editor/html-wysiwyg-editor.vue

(limited to 'src/tools/html-wysiwyg-editor/html-wysiwyg-editor.vue')

diff --git a/src/tools/html-wysiwyg-editor/html-wysiwyg-editor.vue b/src/tools/html-wysiwyg-editor/html-wysiwyg-editor.vue
new file mode 100644
index 0000000..b153769
--- /dev/null
+++ b/src/tools/html-wysiwyg-editor/html-wysiwyg-editor.vue
@@ -0,0 +1,17 @@
+<template>
+  <editor v-model:html="html" />
+  <textarea-copyable :value="format(html, { parser: 'html', plugins: [htmlParser] })" language="html" />
+</template>
+
+<script setup lang="ts">
+import TextareaCopyable from '@/components/TextareaCopyable.vue';
+import { ref } from 'vue';
+import { format } from 'prettier';
+import htmlParser from 'prettier/parser-html';
+import { useStorage } from '@vueuse/core';
+import Editor from './editor/editor.vue';
+
+const html = useStorage('html-wysiwyg-editor--html', '<h1>Hey!</h1><p>Welcome to this html wysiwyg editor</p>');
+</script>
+
+<style lang="less" scoped></style>
-- 
cgit v1.2.3

