@thebuoyant-tsdev/mui-ts-library 2.0.0 → 2.1.0

package/README.de.md

@@ -4,8 +4,6 @@
 
 Eine typsichere React-Komponentenbibliothek auf Basis von **TypeScript** und **MUI (Material UI v9)**. Die Komponenten folgen MUI's Design-Sprache, unterstützen Dark Mode und Theming von Haus aus und werden mit vollständigen TypeScript-Typen, Storybook-Stories und Unit-Tests ausgeliefert.
 
-**[→ Live-Storybook](https://thebuoyant.github.io/mui-ts-library/)** — interaktive Demos für jede Komponente und jedes Feature, immer aktuell mit `main`.
-
 ---
 
 ## Komponenten
@@ -16,7 +14,7 @@ Eine typsichere React-Komponentenbibliothek auf Basis von **TypeScript** und **M
 | [`GanttChart`](#ganttchart) | Projekt-Timeline mit hierarchischen Aufgaben, Meilensteinen, Drag & Drop, Ctrl+Scroll-Zoom, Heute-Chip und integrierten CRUD-Dialogen | [Vollständiges Manual →](user-manuals/GanttChart.de.md) |
 | [`TagSelection`](#tagselection) | Multi-Tag-Auswahlfeld mit Autocomplete, freier Tag-Erstellung, Overflow-Chips und MUI-Theme-Farben | [Vollständiges Manual →](user-manuals/TagSelection.de.md) |
 | [`PasswordStrengthMeter`](#passwordstrengthmeter) | Passwort-Eingabe mit animiertem Stärke-Meter, segmentierter Balkenanzeige, eigenen Anforderungen und Anforderungsliste | [Vollständiges Manual →](user-manuals/PasswordStrengthMeter.de.md) |
-| [`RichTextEditor`](#richtexteditor) | WYSIWYG-Editor (TipTap v3) mit Toolbar, Link-Dialog, Textfarbe, Hervorhebung, Wörter-Zähler, Vollbild-Modus und Markdown-Einfügen | [Vollständiges Manual →](user-manuals/RichTextEditor.de.md) |
+| [`RichTextEditor`](#richtexteditor) | WYSIWYG-Editor (TipTap v3) mit Toolbar, Link-Dialog, Textfarbe, Hervorhebung, Wörter-Zähler, Vollbild-Modus, Markdown-Einfügen, Tabellen-Bearbeitung, Bild-Embed und Emoji-Picker | [Vollständiges Manual →](user-manuals/RichTextEditor.de.md) |
 | [`SqlEditor`](#sqleditor) | SQL-Code-Editor (CodeMirror 6) mit Syntax-Highlighting, Multi-Dialekt, Autocomplete, Linting und `Cmd+Enter`-Ausführen-Shortcut | [Vollständiges Manual →](user-manuals/SqlEditor.de.md) |
 | [`JsonEditor`](#jsoneditor) | JSON-Code-Editor (CodeMirror 6) mit Echtzeit-Validierung, Format- und Komprimieren-Schaltfläche sowie optionaler Minimap | [Vollständiges Manual →](user-manuals/JsonEditor.de.md) |
 

package/README.md

@@ -4,8 +4,6 @@
 
 A type-safe React component library built on **TypeScript** and **MUI (Material UI v9)**. Components follow MUI's design language, support dark mode and theming out of the box, and ship with complete TypeScript types, Storybook stories, and unit tests.
 
-**[→ Live Storybook](https://thebuoyant.github.io/mui-ts-library/)** — interactive demos for every component and feature, always up to date with `main`.
-
 ---
 
 ## Components
@@ -16,7 +14,7 @@ A type-safe React component library built on **TypeScript** and **MUI (Material
 | [`GanttChart`](#ganttchart) | Project timeline with hierarchical tasks, milestones, drag & drop, Ctrl+Scroll zoom, today chip, and built-in CRUD dialogs | [Full Manual →](user-manuals/GanttChart.md) |
 | [`TagSelection`](#tagselection) | Multi-tag selector with autocomplete, free tag creation, overflow chips, and MUI theme colors | [Full Manual →](user-manuals/TagSelection.md) |
 | [`PasswordStrengthMeter`](#passwordstrengthmeter) | Password input with animated strength meter, segmented bar, custom requirements, and requirements checklist | [Full Manual →](user-manuals/PasswordStrengthMeter.md) |
-| [`RichTextEditor`](#richtexteditor) | WYSIWYG editor (TipTap v3) with toolbar, link dialog, text color, highlight, word count, fullscreen mode, and Markdown paste | [Full Manual →](user-manuals/RichTextEditor.md) |
+| [`RichTextEditor`](#richtexteditor) | WYSIWYG editor (TipTap v3) with toolbar, link dialog, text color, highlight, word count, fullscreen mode, Markdown paste, table editing, image embed, and emoji picker | [Full Manual →](user-manuals/RichTextEditor.md) |
 | [`SqlEditor`](#sqleditor) | SQL code editor (CodeMirror 6) with syntax highlighting, multi-dialect, autocomplete, linting, and `Cmd+Enter` execute shortcut | [Full Manual →](user-manuals/SqlEditor.md) |
 | [`JsonEditor`](#jsoneditor) | JSON code editor (CodeMirror 6) with real-time validation, Format, Compact buttons, and optional minimap | [Full Manual →](user-manuals/JsonEditor.md) |
 

package/dist/components/json-editor/JsonEditorToolbar.d.ts

@@ -1,11 +1,11 @@
 import type { EditorView } from "@codemirror/view";
 import type { JsonEditorToolbarConfig, JsonEditorTranslation } from "./JsonEditor.types";
 type JsonEditorToolbarProps = {
-    viewRef: React.MutableRefObject<EditorView | null>;
+    editorView: EditorView | null;
     toolbarConfig: Required<JsonEditorToolbarConfig>;
     translation: JsonEditorTranslation;
     indent: number;
     disabled?: boolean;
 };
-export declare function JsonEditorToolbar({ viewRef, toolbarConfig: tc, translation: t, indent, disabled, }: JsonEditorToolbarProps): import("react/jsx-runtime").JSX.Element;
+export declare function JsonEditorToolbar({ editorView, toolbarConfig: tc, translation: t, indent, disabled, }: JsonEditorToolbarProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/rich-text-editor/RichTextEditor.types.d.ts

@@ -18,6 +18,12 @@ export type RichTextEditorToolbarConfig = {
     showClearFormat?: boolean;
     /** Fullscreen-Button in der Toolbar — standardmäßig deaktiviert (opt-in) */
     showFullscreenButton?: boolean;
+    /** Tabellen einfügen + Zeilen/Spalten verwalten — standardmäßig deaktiviert (opt-in) */
+    showTableButton?: boolean;
+    /** Bilder per URL einfügen — standardmäßig deaktiviert (opt-in) */
+    showImageButton?: boolean;
+    /** Emoji-Picker — standardmäßig deaktiviert (opt-in) */
+    showEmojiButton?: boolean;
 };
 export declare const DEFAULT_RICH_TEXT_EDITOR_TOOLBAR_CONFIG: Required<RichTextEditorToolbarConfig>;
 export type RichTextEditorTranslation = {
@@ -54,6 +60,23 @@ export type RichTextEditorTranslation = {
     fullscreen: string;
     /** Tooltip für den Exit-Fullscreen-Button */
     exitFullscreen: string;
+    table: string;
+    insertTable: string;
+    addRowBefore: string;
+    addRowAfter: string;
+    deleteRow: string;
+    addColumnBefore: string;
+    addColumnAfter: string;
+    deleteColumn: string;
+    deleteTable: string;
+    image: string;
+    imageDialogTitle: string;
+    imageDialogUrlLabel: string;
+    imageDialogAltLabel: string;
+    imageDialogSave: string;
+    imageDialogCancel: string;
+    emoji: string;
+    emojiSearchPlaceholder: string;
 };
 export declare const DEFAULT_RICH_TEXT_EDITOR_TRANSLATION: RichTextEditorTranslation;
 export type RichTextEditorProps = {

package/dist/components/rich-text-editor/RichTextEditorEmojiPicker.d.ts

@@ -0,0 +1,10 @@
+import { type RichTextEditorTranslation } from "./RichTextEditor.types";
+type RichTextEditorEmojiPickerProps = {
+    anchorEl: HTMLElement | null;
+    open: boolean;
+    onClose: () => void;
+    onSelect: (emoji: string) => void;
+    translation: RichTextEditorTranslation;
+};
+export declare function RichTextEditorEmojiPicker({ anchorEl, open, onClose, onSelect, translation: t, }: RichTextEditorEmojiPickerProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/rich-text-editor/RichTextEditorImageDialog.d.ts

@@ -0,0 +1,10 @@
+import { type Editor } from "@tiptap/react";
+import { type RichTextEditorTranslation } from "./RichTextEditor.types";
+type RichTextEditorImageDialogProps = {
+    open: boolean;
+    onClose: () => void;
+    editor: Editor;
+    translation: RichTextEditorTranslation;
+};
+export declare function RichTextEditorImageDialog({ open, onClose, editor, translation: t, }: RichTextEditorImageDialogProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/rich-text-editor/RichTextEditorTableMenu.d.ts

@@ -0,0 +1,9 @@
+import { type Editor } from "@tiptap/react";
+import { type RichTextEditorTranslation } from "./RichTextEditor.types";
+type RichTextEditorTableMenuProps = {
+    editor: Editor | null;
+    translation: RichTextEditorTranslation;
+    disabled?: boolean;
+};
+export declare function RichTextEditorTableMenu({ editor, translation: t, disabled, }: RichTextEditorTableMenuProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/rich-text-editor/util/emojis.d.ts

@@ -0,0 +1,9 @@
+export type EmojiEntry = {
+    emoji: string;
+    name: string;
+};
+export type EmojiCategory = {
+    label: string;
+    emojis: EmojiEntry[];
+};
+export declare const EMOJI_CATEGORIES: EmojiCategory[];

package/dist/components/sql-editor/SqlEditorToolbar.d.ts

@@ -1,12 +1,12 @@
 import type { EditorView } from "@codemirror/view";
 import type { SqlEditorDialect, SqlEditorToolbarConfig, SqlEditorTranslation } from "./SqlEditor.types";
 type SqlEditorToolbarProps = {
-    viewRef: React.MutableRefObject<EditorView | null>;
+    editorView: EditorView | null;
     toolbarConfig: Required<SqlEditorToolbarConfig>;
     translation: SqlEditorTranslation;
     dialect: SqlEditorDialect;
     disabled?: boolean;
     onExecute?: (sql: string) => void;
 };
-export declare function SqlEditorToolbar({ viewRef, toolbarConfig: tc, translation: t, dialect, disabled, onExecute, }: SqlEditorToolbarProps): import("react/jsx-runtime").JSX.Element;
+export declare function SqlEditorToolbar({ editorView, toolbarConfig: tc, translation: t, dialect, disabled, onExecute, }: SqlEditorToolbarProps): import("react/jsx-runtime").JSX.Element;
 export {};