@melv1c/rich-text-editor 1.0.1 → 1.0.2
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/index.d.mts +0 -6
- package/dist/index.mjs +11 -24
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -108,28 +108,24 @@ declare function BoldButton({
|
|
|
108
108
|
children,
|
|
109
109
|
className,
|
|
110
110
|
variant,
|
|
111
|
-
size,
|
|
112
111
|
...props
|
|
113
112
|
}: FormattingButtonProps): react_jsx_runtime0.JSX.Element;
|
|
114
113
|
declare function ItalicButton({
|
|
115
114
|
children,
|
|
116
115
|
className,
|
|
117
116
|
variant,
|
|
118
|
-
size,
|
|
119
117
|
...props
|
|
120
118
|
}: FormattingButtonProps): react_jsx_runtime0.JSX.Element;
|
|
121
119
|
declare function StrikethroughButton({
|
|
122
120
|
children,
|
|
123
121
|
className,
|
|
124
122
|
variant,
|
|
125
|
-
size,
|
|
126
123
|
...props
|
|
127
124
|
}: FormattingButtonProps): react_jsx_runtime0.JSX.Element;
|
|
128
125
|
declare function CodeButton({
|
|
129
126
|
children,
|
|
130
127
|
className,
|
|
131
128
|
variant,
|
|
132
|
-
size,
|
|
133
129
|
...props
|
|
134
130
|
}: FormattingButtonProps): react_jsx_runtime0.JSX.Element;
|
|
135
131
|
//#endregion
|
|
@@ -175,14 +171,12 @@ declare function BulletListButton({
|
|
|
175
171
|
children,
|
|
176
172
|
className,
|
|
177
173
|
variant,
|
|
178
|
-
size,
|
|
179
174
|
...props
|
|
180
175
|
}: ListButtonProps): react_jsx_runtime0.JSX.Element;
|
|
181
176
|
declare function OrderedListButton({
|
|
182
177
|
children,
|
|
183
178
|
className,
|
|
184
179
|
variant,
|
|
185
|
-
size,
|
|
186
180
|
...props
|
|
187
181
|
}: ListButtonProps): react_jsx_runtime0.JSX.Element;
|
|
188
182
|
//#endregion
|
package/dist/index.mjs
CHANGED
|
@@ -70,7 +70,7 @@ function RichTextEditor({ children, className, value, defaultValue, onValueChang
|
|
|
70
70
|
|
|
71
71
|
//#endregion
|
|
72
72
|
//#region src/toolbar/formatting-buttons.tsx
|
|
73
|
-
function BoldButton({ children, className, variant = "outline",
|
|
73
|
+
function BoldButton({ children, className, variant = "outline", ...props }) {
|
|
74
74
|
const { editor } = useRichTextEditor();
|
|
75
75
|
const isActive = useEditorState({
|
|
76
76
|
editor,
|
|
@@ -82,13 +82,12 @@ function BoldButton({ children, className, variant = "outline", size = "sm", ...
|
|
|
82
82
|
disabled: editor ? !editor.can().chain().focus().toggleBold().run() : true,
|
|
83
83
|
onPressedChange: () => editor?.chain().focus().toggleBold().run(),
|
|
84
84
|
variant,
|
|
85
|
-
size,
|
|
86
85
|
className: cn("shadow-none", className),
|
|
87
86
|
...props,
|
|
88
87
|
children: children ?? /* @__PURE__ */ jsx(Bold, {})
|
|
89
88
|
});
|
|
90
89
|
}
|
|
91
|
-
function ItalicButton({ children, className, variant = "outline",
|
|
90
|
+
function ItalicButton({ children, className, variant = "outline", ...props }) {
|
|
92
91
|
const { editor } = useRichTextEditor();
|
|
93
92
|
const isActive = useEditorState({
|
|
94
93
|
editor,
|
|
@@ -100,13 +99,12 @@ function ItalicButton({ children, className, variant = "outline", size = "sm", .
|
|
|
100
99
|
disabled: editor ? !editor.can().chain().focus().toggleItalic().run() : true,
|
|
101
100
|
onPressedChange: () => editor?.chain().focus().toggleItalic().run(),
|
|
102
101
|
variant,
|
|
103
|
-
size,
|
|
104
102
|
className: cn("shadow-none", className),
|
|
105
103
|
...props,
|
|
106
104
|
children: children ?? /* @__PURE__ */ jsx(Italic, {})
|
|
107
105
|
});
|
|
108
106
|
}
|
|
109
|
-
function StrikethroughButton({ children, className, variant = "outline",
|
|
107
|
+
function StrikethroughButton({ children, className, variant = "outline", ...props }) {
|
|
110
108
|
const { editor } = useRichTextEditor();
|
|
111
109
|
const isActive = useEditorState({
|
|
112
110
|
editor,
|
|
@@ -118,13 +116,12 @@ function StrikethroughButton({ children, className, variant = "outline", size =
|
|
|
118
116
|
disabled: editor ? !editor.can().chain().focus().toggleStrike().run() : true,
|
|
119
117
|
onPressedChange: () => editor?.chain().focus().toggleStrike().run(),
|
|
120
118
|
variant,
|
|
121
|
-
size,
|
|
122
119
|
className: cn("shadow-none", className),
|
|
123
120
|
...props,
|
|
124
121
|
children: children ?? /* @__PURE__ */ jsx(Strikethrough, {})
|
|
125
122
|
});
|
|
126
123
|
}
|
|
127
|
-
function CodeButton({ children, className, variant = "outline",
|
|
124
|
+
function CodeButton({ children, className, variant = "outline", ...props }) {
|
|
128
125
|
const { editor } = useRichTextEditor();
|
|
129
126
|
const isActive = useEditorState({
|
|
130
127
|
editor,
|
|
@@ -136,7 +133,6 @@ function CodeButton({ children, className, variant = "outline", size = "sm", ...
|
|
|
136
133
|
disabled: editor ? !editor.can().chain().focus().toggleCode().run() : true,
|
|
137
134
|
onPressedChange: () => editor?.chain().focus().toggleCode().run(),
|
|
138
135
|
variant,
|
|
139
|
-
size,
|
|
140
136
|
className: cn("shadow-none", className),
|
|
141
137
|
...props,
|
|
142
138
|
children: children ?? /* @__PURE__ */ jsx(Code, {})
|
|
@@ -160,7 +156,7 @@ const HEADING_LABELS = {
|
|
|
160
156
|
2: "Heading 2",
|
|
161
157
|
3: "Heading 3"
|
|
162
158
|
};
|
|
163
|
-
function HeadingButton({ level, children, className, variant = "outline",
|
|
159
|
+
function HeadingButton({ level, children, className, variant = "outline", ...props }) {
|
|
164
160
|
const { editor } = useRichTextEditor();
|
|
165
161
|
const Icon = HEADING_ICONS[level];
|
|
166
162
|
const isActive = useEditorState({
|
|
@@ -173,7 +169,6 @@ function HeadingButton({ level, children, className, variant = "outline", size =
|
|
|
173
169
|
disabled: editor ? !editor.can().chain().focus().toggleHeading({ level }).run() : true,
|
|
174
170
|
onPressedChange: () => editor?.chain().focus().toggleHeading({ level }).run(),
|
|
175
171
|
variant,
|
|
176
|
-
size,
|
|
177
172
|
className: cn("shadow-none", className),
|
|
178
173
|
...props,
|
|
179
174
|
children: children ?? /* @__PURE__ */ jsx(Icon, {})
|
|
@@ -233,7 +228,6 @@ function RichTextEditorHeadingSelect({ levels, includeParagraphOption = true, pa
|
|
|
233
228
|
},
|
|
234
229
|
children: [/* @__PURE__ */ jsx(SelectTrigger, {
|
|
235
230
|
"aria-label": "Heading levels",
|
|
236
|
-
size: "sm",
|
|
237
231
|
disabled: !editor,
|
|
238
232
|
className: "shadow-none",
|
|
239
233
|
children: /* @__PURE__ */ jsx(SelectValue, { placeholder: selectPlaceholder })
|
|
@@ -247,7 +241,7 @@ function RichTextEditorHeadingSelect({ levels, includeParagraphOption = true, pa
|
|
|
247
241
|
|
|
248
242
|
//#endregion
|
|
249
243
|
//#region src/toolbar/history-buttons.tsx
|
|
250
|
-
function UndoButton({ children, className, variant = "outline", size = "icon
|
|
244
|
+
function UndoButton({ children, className, variant = "outline", size = "icon", ...props }) {
|
|
251
245
|
const { editor } = useRichTextEditor();
|
|
252
246
|
return /* @__PURE__ */ jsx(Button, {
|
|
253
247
|
"aria-label": "Undo",
|
|
@@ -260,7 +254,7 @@ function UndoButton({ children, className, variant = "outline", size = "icon-sm"
|
|
|
260
254
|
children: children ?? /* @__PURE__ */ jsx(Undo2, {})
|
|
261
255
|
});
|
|
262
256
|
}
|
|
263
|
-
function RedoButton({ children, className, variant = "outline", size = "icon
|
|
257
|
+
function RedoButton({ children, className, variant = "outline", size = "icon", ...props }) {
|
|
264
258
|
const { editor } = useRichTextEditor();
|
|
265
259
|
return /* @__PURE__ */ jsx(Button, {
|
|
266
260
|
"aria-label": "Redo",
|
|
@@ -276,7 +270,7 @@ function RedoButton({ children, className, variant = "outline", size = "icon-sm"
|
|
|
276
270
|
|
|
277
271
|
//#endregion
|
|
278
272
|
//#region src/toolbar/list-buttons.tsx
|
|
279
|
-
function BulletListButton({ children, className, variant = "outline",
|
|
273
|
+
function BulletListButton({ children, className, variant = "outline", ...props }) {
|
|
280
274
|
const { editor } = useRichTextEditor();
|
|
281
275
|
const isActive = useEditorState({
|
|
282
276
|
editor,
|
|
@@ -288,13 +282,12 @@ function BulletListButton({ children, className, variant = "outline", size = "sm
|
|
|
288
282
|
disabled: editor ? !editor.can().chain().focus().toggleBulletList().run() : true,
|
|
289
283
|
onPressedChange: () => editor?.chain().focus().toggleBulletList().run(),
|
|
290
284
|
variant,
|
|
291
|
-
size,
|
|
292
285
|
className: cn("shadow-none", className),
|
|
293
286
|
...props,
|
|
294
287
|
children: children ?? /* @__PURE__ */ jsx(List, {})
|
|
295
288
|
});
|
|
296
289
|
}
|
|
297
|
-
function OrderedListButton({ children, className, variant = "outline",
|
|
290
|
+
function OrderedListButton({ children, className, variant = "outline", ...props }) {
|
|
298
291
|
const { editor } = useRichTextEditor();
|
|
299
292
|
const isActive = useEditorState({
|
|
300
293
|
editor,
|
|
@@ -306,7 +299,6 @@ function OrderedListButton({ children, className, variant = "outline", size = "s
|
|
|
306
299
|
disabled: editor ? !editor.can().chain().focus().toggleOrderedList().run() : true,
|
|
307
300
|
onPressedChange: () => editor?.chain().focus().toggleOrderedList().run(),
|
|
308
301
|
variant,
|
|
309
|
-
size,
|
|
310
302
|
className: cn("shadow-none", className),
|
|
311
303
|
...props,
|
|
312
304
|
children: children ?? /* @__PURE__ */ jsx(ListOrdered, {})
|
|
@@ -346,17 +338,12 @@ function RichTextEditorBuiltIn({ className, contentClassName, toolbarClassName,
|
|
|
346
338
|
className: toolbarClassName,
|
|
347
339
|
children: [
|
|
348
340
|
(preset === "complete" || preset === "simple") && /* @__PURE__ */ jsxs(ButtonGroup, { children: [/* @__PURE__ */ jsx(UndoButton, {}), /* @__PURE__ */ jsx(RedoButton, {})] }),
|
|
349
|
-
preset === "simple" && /* @__PURE__ */ jsx(RichTextEditorHeadingSelect, {}),
|
|
350
|
-
preset === "complete" && /* @__PURE__ */ jsxs(ButtonGroup, { children: [
|
|
351
|
-
/* @__PURE__ */ jsx(Heading1Button, {}),
|
|
352
|
-
/* @__PURE__ */ jsx(Heading2Button, {}),
|
|
353
|
-
/* @__PURE__ */ jsx(Heading3Button, {})
|
|
354
|
-
] }),
|
|
341
|
+
(preset === "complete" || preset === "simple") && /* @__PURE__ */ jsx(RichTextEditorHeadingSelect, {}),
|
|
355
342
|
/* @__PURE__ */ jsxs(ButtonGroup, { children: [
|
|
356
343
|
/* @__PURE__ */ jsx(BoldButton, {}),
|
|
357
344
|
/* @__PURE__ */ jsx(ItalicButton, {}),
|
|
358
345
|
/* @__PURE__ */ jsx(StrikethroughButton, {}),
|
|
359
|
-
/* @__PURE__ */ jsx(CodeButton, {})
|
|
346
|
+
preset === "complete" && /* @__PURE__ */ jsx(CodeButton, {})
|
|
360
347
|
] }),
|
|
361
348
|
preset === "complete" && /* @__PURE__ */ jsxs(ButtonGroup, { children: [/* @__PURE__ */ jsx(BulletListButton, {}), /* @__PURE__ */ jsx(OrderedListButton, {})] })
|
|
362
349
|
]
|