smartrte-react 0.2.2 → 0.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/ClassicEditor.d.ts +2 -2
- package/dist/components/ClassicEditor.js +1243 -622
- package/dist/components/MediaManager.js +4 -0
- package/dist/index.d.ts +4 -4
- package/dist/index.js +2 -2
- package/dist/standalone/classic-editor-embed.js +1 -1
- package/dist/theme.d.ts +1 -1
- package/dist/theme.js +25 -3
- package/package.json +1 -1
|
@@ -88,6 +88,8 @@ export function MediaManager(props) {
|
|
|
88
88
|
position: "fixed",
|
|
89
89
|
inset: 0,
|
|
90
90
|
background: "var(--srte-modal-backdrop)",
|
|
91
|
+
backdropFilter: "var(--srte-modal-backdrop-filter)",
|
|
92
|
+
WebkitBackdropFilter: "var(--srte-modal-backdrop-filter)",
|
|
91
93
|
display: "flex",
|
|
92
94
|
alignItems: "center",
|
|
93
95
|
justifyContent: "center",
|
|
@@ -195,6 +197,8 @@ export function MediaManager(props) {
|
|
|
195
197
|
position: "fixed",
|
|
196
198
|
inset: 0,
|
|
197
199
|
background: "var(--srte-modal-backdrop)",
|
|
200
|
+
backdropFilter: "var(--srte-modal-backdrop-filter)",
|
|
201
|
+
WebkitBackdropFilter: "var(--srte-modal-backdrop-filter)",
|
|
198
202
|
display: "flex",
|
|
199
203
|
alignItems: "center",
|
|
200
204
|
justifyContent: "center",
|
package/dist/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { ClassicEditor } from './components/ClassicEditor';
|
|
2
|
-
export type { MediaManagerAdapter, MediaItem, MediaSearchQuery } from './components/MediaManager';
|
|
3
|
-
export type { SrteTheme } from './theme';
|
|
4
|
-
export { SRTE_DEFAULT_CSS, ensureStyleSheet } from './theme';
|
|
1
|
+
export { ClassicEditor } from './components/ClassicEditor.js';
|
|
2
|
+
export type { MediaManagerAdapter, MediaItem, MediaSearchQuery } from './components/MediaManager.js';
|
|
3
|
+
export type { SrteTheme } from './theme.js';
|
|
4
|
+
export { SRTE_DEFAULT_CSS, ensureStyleSheet } from './theme.js';
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { ClassicEditor } from './components/ClassicEditor';
|
|
2
|
-
export { SRTE_DEFAULT_CSS, ensureStyleSheet } from './theme';
|
|
1
|
+
export { ClassicEditor } from './components/ClassicEditor.js';
|
|
2
|
+
export { SRTE_DEFAULT_CSS, ensureStyleSheet } from './theme.js';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import React, { useImperativeHandle, useRef, useState } from "react";
|
|
3
3
|
import { createRoot } from "react-dom/client";
|
|
4
|
-
import { ClassicEditor as ClassicEditorComponent } from "../components/ClassicEditor";
|
|
4
|
+
import { ClassicEditor as ClassicEditorComponent } from "../components/ClassicEditor.js";
|
|
5
5
|
function ClassicEditorHost(props, ref) {
|
|
6
6
|
const [html, setHtml] = useState(props.value || "");
|
|
7
7
|
const containerRef = useRef(null);
|
package/dist/theme.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export type SrteTheme = 'light' | 'dark';
|
|
2
|
-
export declare const SRTE_DEFAULT_CSS = "\n.srte-editor {\n --srte-bg: #ffffff;\n --srte-text: #111111;\n --srte-text-muted: #4b5563;\n --srte-border: #dddddd;\n --srte-border-light: #eeeeee;\n --srte-toolbar-bg: #ffffff;\n --srte-input-bg: #ffffff;\n --srte-input-text: #111111;\n --srte-input-border: #e5e7eb;\n --srte-modal-backdrop: rgba(0, 0, 0, 0.35);\n --srte-modal-bg: #ffffff;\n --srte-modal-text: #000000;\n --srte-menu-bg: #ffffff;\n --srte-menu-text: #111111;\n --srte-menu-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);\n --srte-accent: #1e90ff;\n --srte-accent-bg: rgba(30, 144, 255, 0.15);\n --srte-danger: #dc2626;\n --srte-primary: #2563eb;\n --srte-surface-subtle: #f3f4f6;\n --srte-on-primary: #ffffff;\n --srte-cancel-bg: #f3f4f6;\n}\n.srte-editor.srte-dark {\n --srte-bg: #1e1e1e;\n --srte-text: #e0e0e0;\n --srte-text-muted: #9ca3af;\n --srte-border: #3a3a3a;\n --srte-border-light: #2e2e2e;\n --srte-toolbar-bg: #252525;\n --srte-input-bg: #2a2a2a;\n --srte-input-text: #e0e0e0;\n --srte-input-border: #444444;\n --srte-modal-backdrop: rgba(0, 0, 0, 0.
|
|
2
|
+
export declare const SRTE_DEFAULT_CSS = "\n.srte-editor {\n --srte-bg: #ffffff;\n --srte-text: #111111;\n --srte-text-muted: #4b5563;\n --srte-border: #dddddd;\n --srte-border-light: #eeeeee;\n --srte-toolbar-bg: #ffffff;\n --srte-input-bg: #ffffff;\n --srte-input-text: #111111;\n --srte-input-border: #e5e7eb;\n --srte-modal-backdrop: rgba(0, 0, 0, 0.35);\n --srte-modal-backdrop-filter: blur(2px);\n --srte-modal-bg: #ffffff;\n --srte-modal-text: #000000;\n --srte-menu-bg: #ffffff;\n --srte-menu-text: #111111;\n --srte-menu-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);\n --srte-accent: #1e90ff;\n --srte-accent-bg: rgba(30, 144, 255, 0.15);\n --srte-danger: #dc2626;\n --srte-primary: #2563eb;\n --srte-surface-subtle: #f3f4f6;\n --srte-on-primary: #ffffff;\n --srte-cancel-bg: #f3f4f6;\n}\n.srte-editor.srte-dark {\n --srte-bg: #1e1e1e;\n --srte-text: #e0e0e0;\n --srte-text-muted: #9ca3af;\n --srte-border: #3a3a3a;\n --srte-border-light: #2e2e2e;\n --srte-toolbar-bg: #252525;\n --srte-input-bg: #2a2a2a;\n --srte-input-text: #e0e0e0;\n --srte-input-border: #444444;\n --srte-modal-backdrop: rgba(0, 0, 0, 0.22);\n --srte-modal-backdrop-filter: blur(10px) saturate(0.9);\n --srte-modal-bg: #1e293b;\n --srte-modal-text: #e0e0e0;\n --srte-menu-bg: #1e293b;\n --srte-menu-text: #e0e0e0;\n --srte-menu-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);\n --srte-accent: #3b9eff;\n --srte-accent-bg: rgba(59, 158, 255, 0.2);\n --srte-danger: #ef4444;\n --srte-primary: #3b82f6;\n --srte-surface-subtle: #333333;\n --srte-on-primary: #ffffff;\n --srte-cancel-bg: #333333;\n}\n.srte-editor [contenteditable] blockquote {\n border-left: 4px solid var(--srte-accent);\n margin: 0.75em 0;\n padding: 0.5em 1em;\n background: var(--srte-surface-subtle);\n color: var(--srte-text);\n}\n.srte-editor [contenteditable] ul {\n list-style-type: disc;\n list-style-position: outside;\n margin: 0.75em 0;\n padding-left: 1.75em;\n}\n.srte-editor [contenteditable] ol {\n list-style-type: decimal;\n list-style-position: outside;\n margin: 0.75em 0;\n padding-left: 1.75em;\n}\n.srte-editor [contenteditable] li {\n display: list-item;\n margin: 0.25em 0;\n padding-left: 0.25em;\n}\n.srte-editor [contenteditable] li::marker {\n color: currentColor;\n}\n.srte-editor.srte-dark [contenteditable] [style*=\"color\"]:not(.srte-preserve-colors):not(.srte-preserve-colors *),\n.srte-editor.srte-dark [contenteditable] [style*=\"background\"]:not(.srte-preserve-colors):not(.srte-preserve-colors *) {\n color: var(--srte-text) !important;\n background: transparent !important;\n background-color: transparent !important;\n}\n.srte-editor [contenteditable] sub,\n.srte-editor [contenteditable] sup {\n line-height: 0;\n}\n";
|
|
3
3
|
export declare function ensureStyleSheet(): void;
|
package/dist/theme.js
CHANGED
|
@@ -10,6 +10,7 @@ export const SRTE_DEFAULT_CSS = `
|
|
|
10
10
|
--srte-input-text: #111111;
|
|
11
11
|
--srte-input-border: #e5e7eb;
|
|
12
12
|
--srte-modal-backdrop: rgba(0, 0, 0, 0.35);
|
|
13
|
+
--srte-modal-backdrop-filter: blur(2px);
|
|
13
14
|
--srte-modal-bg: #ffffff;
|
|
14
15
|
--srte-modal-text: #000000;
|
|
15
16
|
--srte-menu-bg: #ffffff;
|
|
@@ -33,10 +34,11 @@ export const SRTE_DEFAULT_CSS = `
|
|
|
33
34
|
--srte-input-bg: #2a2a2a;
|
|
34
35
|
--srte-input-text: #e0e0e0;
|
|
35
36
|
--srte-input-border: #444444;
|
|
36
|
-
--srte-modal-backdrop: rgba(0, 0, 0, 0.
|
|
37
|
-
--srte-modal-
|
|
37
|
+
--srte-modal-backdrop: rgba(0, 0, 0, 0.22);
|
|
38
|
+
--srte-modal-backdrop-filter: blur(10px) saturate(0.9);
|
|
39
|
+
--srte-modal-bg: #1e293b;
|
|
38
40
|
--srte-modal-text: #e0e0e0;
|
|
39
|
-
--srte-menu-bg: #
|
|
41
|
+
--srte-menu-bg: #1e293b;
|
|
40
42
|
--srte-menu-text: #e0e0e0;
|
|
41
43
|
--srte-menu-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
|
|
42
44
|
--srte-accent: #3b9eff;
|
|
@@ -54,6 +56,26 @@ export const SRTE_DEFAULT_CSS = `
|
|
|
54
56
|
background: var(--srte-surface-subtle);
|
|
55
57
|
color: var(--srte-text);
|
|
56
58
|
}
|
|
59
|
+
.srte-editor [contenteditable] ul {
|
|
60
|
+
list-style-type: disc;
|
|
61
|
+
list-style-position: outside;
|
|
62
|
+
margin: 0.75em 0;
|
|
63
|
+
padding-left: 1.75em;
|
|
64
|
+
}
|
|
65
|
+
.srte-editor [contenteditable] ol {
|
|
66
|
+
list-style-type: decimal;
|
|
67
|
+
list-style-position: outside;
|
|
68
|
+
margin: 0.75em 0;
|
|
69
|
+
padding-left: 1.75em;
|
|
70
|
+
}
|
|
71
|
+
.srte-editor [contenteditable] li {
|
|
72
|
+
display: list-item;
|
|
73
|
+
margin: 0.25em 0;
|
|
74
|
+
padding-left: 0.25em;
|
|
75
|
+
}
|
|
76
|
+
.srte-editor [contenteditable] li::marker {
|
|
77
|
+
color: currentColor;
|
|
78
|
+
}
|
|
57
79
|
.srte-editor.srte-dark [contenteditable] [style*="color"]:not(.srte-preserve-colors):not(.srte-preserve-colors *),
|
|
58
80
|
.srte-editor.srte-dark [contenteditable] [style*="background"]:not(.srte-preserve-colors):not(.srte-preserve-colors *) {
|
|
59
81
|
color: var(--srte-text) !important;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "smartrte-react",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.4",
|
|
4
4
|
"description": "A powerful, feature-rich Rich Text Editor for React with support for tables, mathematical formulas (LaTeX/KaTeX), and media management",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.js",
|