✨ Notebook-widget (#962)

* ⬆️ Add required dependencies

* ✨ Add basic widget definition for `notebook`

* 🌐 Add basic translations for `notebook` widget

* 🐛 Fix `WidgetMenu` zIndex property

* ⚡️ Use dynamic import for the `notebook` widget

* 🌐 Update translations

* 🚨 Disable eslint `no-param-reassign` rule

* ✨ Add `notebook` widget

* ➕ Add `immer` as a dependency

* fix: currentConfig not loaded in useEffect callback 

fixes #1249

* ♻️ Notebook widget UI (#1266)

* ♻️ Refactor note widget

* 🐛 Fix translations

* 💄 Widget styling changes

* 🔒 Fix lockfile

* 💄 Remove primary color from edit button

* 💄 Fix css

* ✨ Add the ability to hide an option

* 🔥 Remove aria-labels

* ♻️ Address pull request feedback

* 🐛 Remove wrong description from default value

---------

Co-authored-by: gnattu <gnattu@users.noreply.github.com>
Co-authored-by: Manuel <manuel.ruwe@bluewin.ch>
Co-authored-by: Tagaishi <Tagaishi@hotmail.ch>
Co-authored-by: Meier Lukas <meierschlumpf@gmail.com>

src/widgets/notebook/NotebookWidgetTile.tsx

@@ -0,0 +1,45 @@
+import { IconNotes } from '@tabler/icons-react';
+import { useTranslation } from 'next-i18next';
+import dynamic from 'next/dynamic';
+
+import { defineWidget } from '../helper';
+import { IWidget } from '../widgets';
+
+const Editor = dynamic(() => import('./NotebookEditor').then((module) => module.Editor), {
+  ssr: false,
+});
+
+const definition = defineWidget({
+  id: 'notebook',
+  icon: IconNotes,
+  options: {
+    showToolbar: {
+      type: 'switch',
+      defaultValue: true,
+    },
+    content: {
+      type: 'text',
+      hide: true,
+      defaultValue: `<h2>Welcome to <strong>Homarr's</strong> notebook widget</h2><p>The <code>notebook</code> widget focuses on usability and is designed to be as simple as possible to bring a familiar editing experience to regular users. It is based on <a target="_blank" rel="noopener noreferrer nofollow" href="https://tiptap.dev/">Tiptap.dev</a> and supports all of its features:</p><ul><li><p>General text formatting: <strong>bold</strong>, <em>italic</em>, underline, <s>strike-through</s></p></li><li><p>Headings (h1-h6)</p></li><li><p>Sub and super scripts (&lt;sup /&gt; and &lt;sub /&gt; tags)</p></li><li><p>Ordered and bullet lists</p></li><li><p>Text align&nbsp;</p></li></ul><h3>Widget options</h3><p>This widget has two options :</p><ul><li><p>Show toolbar : Shows the toolbar when the widget is in the local edit mode.</p></li></ul>`,
+    },
+  },
+  gridstack: {
+    minWidth: 3,
+    minHeight: 2,
+    maxWidth: 12,
+    maxHeight: 12,
+  },
+  component: NotebookWidget,
+});
+
+export default definition;
+
+export type INotebookWidget = IWidget<(typeof definition)['id'], typeof definition>;
+
+interface NotebookWidgetProps {
+  widget: INotebookWidget;
+}
+
+function NotebookWidget(props: NotebookWidgetProps) {
+  return <Editor widget={props.widget} />;
+}