@sparrowengg/twigs-editor-react 0.0.2 → 0.0.3
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/cjs/editor.js +3 -2
- package/dist/cjs/editor.js.map +1 -1
- package/dist/es/editor.js +3 -2
- package/dist/es/editor.js.map +1 -1
- package/dist/index.d.ts +9 -4
- package/package.json +1 -1
package/dist/cjs/editor.js
CHANGED
|
@@ -111,7 +111,8 @@ const Editor = ({
|
|
|
111
111
|
features,
|
|
112
112
|
children,
|
|
113
113
|
initialEditorState,
|
|
114
|
-
dataManagementRef
|
|
114
|
+
dataManagementRef,
|
|
115
|
+
onChangePluginProps
|
|
115
116
|
}) => {
|
|
116
117
|
const supportedFeatures = react.useMemo(() => {
|
|
117
118
|
if (features) {
|
|
@@ -138,7 +139,7 @@ const Editor = ({
|
|
|
138
139
|
/* @__PURE__ */ jsxRuntime.jsx(LexicalClearEditorPlugin.ClearEditorPlugin, {}),
|
|
139
140
|
/* @__PURE__ */ jsxRuntime.jsx(index.DataManagementPlugin, { ref: dataManagementRef }),
|
|
140
141
|
/* @__PURE__ */ jsxRuntime.jsx(index$1.TabFocusPlugin, {}),
|
|
141
|
-
/* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: onChange && /* @__PURE__ */ jsxRuntime.jsx(LexicalOnChangePlugin.OnChangePlugin, { onChange }) }),
|
|
142
|
+
/* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: onChange && /* @__PURE__ */ jsxRuntime.jsx(LexicalOnChangePlugin.OnChangePlugin, __spreadValues({ onChange }, onChangePluginProps)) }),
|
|
142
143
|
/* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: supportedFeatures.components.map((comp) => {
|
|
143
144
|
const ToolComponent = comp.component;
|
|
144
145
|
if (ToolComponent) {
|
package/dist/cjs/editor.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"editor.js","sources":["../../src/editor.tsx"],"sourcesContent":["import { AutoLinkNode, LinkNode } from '@lexical/link';\nimport { ListItemNode, ListNode } from '@lexical/list';\nimport { ClearEditorPlugin } from '@lexical/react/LexicalClearEditorPlugin';\nimport {\n InitialConfigType,\n InitialEditorStateType,\n LexicalComposer\n} from '@lexical/react/LexicalComposer';\nimport { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin';\nimport { ListPlugin } from '@lexical/react/LexicalListPlugin';\nimport { OnChangePlugin } from '@lexical/react/LexicalOnChangePlugin';\nimport { HeadingNode } from '@lexical/rich-text';\n\nimport { CodeNode } from '@lexical/code';\nimport { EditorState, LexicalEditor } from 'lexical';\nimport {\n Fragment, ReactNode, RefObject, useMemo\n} from 'react';\nimport {\n AutoLinkPlugin,\n DataManagementPlugin,\n DataManagementPluginHandle,\n LinkPlugin,\n TabFocusPlugin\n} from './plugins';\n\nimport { ToolbarContextPlugin } from './components';\n\nconst initialConfig: InitialConfigType = {\n namespace: 'TwigsEditor',\n theme: {\n text: {\n bold: 'text-bold',\n italic: 'text-italic',\n underline: 'text-underline',\n code: 'text-code',\n base: 'text-base',\n highlight: 'text-highlight',\n strikethrough: 'text-strikethrough',\n subscript: 'text-subscript',\n superscript: 'text-superscript',\n underlineStrikethrough: 'text-underline-strikethrough'\n },\n code: 'block-code',\n quote: 'block-quote',\n heading: {\n h1: 'block-h1',\n h2: 'block-h2',\n h3: 'block-h3',\n h4: 'block-h4',\n h5: 'block-h5',\n h6: 'block-h6'\n },\n list: {\n ol: 'block-ol',\n ul: 'block-ul',\n listitem: 'block-listitem'\n }\n },\n onError: (err) => {\n // eslint-disable-next-line no-console\n console.error(err);\n }\n};\n\nlet featureId = 0;\n\nconst featuresToNodeMapping = {\n heading: {\n node: HeadingNode,\n component: null\n },\n list: {\n node: [ListNode, ListItemNode],\n component: ListPlugin\n },\n link: {\n node: [LinkNode, AutoLinkNode],\n component: [AutoLinkPlugin, LinkPlugin]\n },\n code: {\n node: [CodeNode],\n component: null\n }\n};\n\nexport
|
|
1
|
+
{"version":3,"file":"editor.js","sources":["../../src/editor.tsx"],"sourcesContent":["import { AutoLinkNode, LinkNode } from '@lexical/link';\nimport { ListItemNode, ListNode } from '@lexical/list';\nimport { ClearEditorPlugin } from '@lexical/react/LexicalClearEditorPlugin';\nimport {\n InitialConfigType,\n InitialEditorStateType,\n LexicalComposer\n} from '@lexical/react/LexicalComposer';\nimport { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin';\nimport { ListPlugin } from '@lexical/react/LexicalListPlugin';\nimport { OnChangePlugin } from '@lexical/react/LexicalOnChangePlugin';\nimport { HeadingNode } from '@lexical/rich-text';\n\nimport { CodeNode } from '@lexical/code';\nimport { EditorState, LexicalEditor } from 'lexical';\nimport {\n Fragment, ReactNode, RefObject, useMemo\n} from 'react';\nimport {\n AutoLinkPlugin,\n DataManagementPlugin,\n DataManagementPluginHandle,\n LinkPlugin,\n TabFocusPlugin\n} from './plugins';\n\nimport { ToolbarContextPlugin } from './components';\n\nconst initialConfig: InitialConfigType = {\n namespace: 'TwigsEditor',\n theme: {\n text: {\n bold: 'text-bold',\n italic: 'text-italic',\n underline: 'text-underline',\n code: 'text-code',\n base: 'text-base',\n highlight: 'text-highlight',\n strikethrough: 'text-strikethrough',\n subscript: 'text-subscript',\n superscript: 'text-superscript',\n underlineStrikethrough: 'text-underline-strikethrough'\n },\n code: 'block-code',\n quote: 'block-quote',\n heading: {\n h1: 'block-h1',\n h2: 'block-h2',\n h3: 'block-h3',\n h4: 'block-h4',\n h5: 'block-h5',\n h6: 'block-h6'\n },\n list: {\n ol: 'block-ol',\n ul: 'block-ul',\n listitem: 'block-listitem'\n }\n },\n onError: (err) => {\n // eslint-disable-next-line no-console\n console.error(err);\n }\n};\n\nlet featureId = 0;\n\nconst featuresToNodeMapping = {\n heading: {\n node: HeadingNode,\n component: null\n },\n list: {\n node: [ListNode, ListItemNode],\n component: ListPlugin\n },\n link: {\n node: [LinkNode, AutoLinkNode],\n component: [AutoLinkPlugin, LinkPlugin]\n },\n code: {\n node: [CodeNode],\n component: null\n }\n};\n\nexport interface EditorProps {\n initialEditorState?: InitialEditorStateType;\n onChange?: (\n newEditorState: EditorState,\n editor: LexicalEditor,\n tags: Set<string>\n ) => void;\n editable?: boolean;\n children?: ReactNode;\n nodes?: InitialConfigType['nodes'];\n features?: (keyof typeof featuresToNodeMapping)[];\n dataManagementRef?: RefObject<DataManagementPluginHandle>;\n onChangePluginProps?: {\n ignoreHistoryMergeTagChange?: boolean;\n ignoreSelectionChange?: boolean;\n };\n}\n\nexport const Editor = ({\n nodes,\n onChange,\n editable,\n features,\n children,\n initialEditorState,\n dataManagementRef,\n onChangePluginProps\n}: EditorProps) => {\n const supportedFeatures = useMemo(() => {\n if (features) {\n const selectedNodes = features\n .map((item) => featuresToNodeMapping[item].node)\n .flat();\n\n const selectedPlugins = features\n .map((item) => featuresToNodeMapping[item].component)\n .flat()\n .map((item) => ({ component: item, id: featureId++ }));\n\n return { nodes: selectedNodes, components: selectedPlugins };\n }\n\n const defaultFeatures = {\n nodes: Object.values(featuresToNodeMapping)\n .map((item) => item.node)\n .flat(),\n components: Object.values(featuresToNodeMapping)\n .map((item) => item.component)\n .flat()\n .map((item) => ({ component: item, id: featureId++ }))\n };\n\n return defaultFeatures;\n }, [features]);\n\n return (\n <LexicalComposer\n initialConfig={{\n ...initialConfig,\n editorState: initialEditorState,\n editable,\n nodes: [...supportedFeatures.nodes, ...(nodes ?? [])]\n }}\n >\n <ToolbarContextPlugin>\n <HistoryPlugin />\n <ClearEditorPlugin />\n <DataManagementPlugin ref={dataManagementRef} />\n <TabFocusPlugin />\n <>\n {onChange && (\n <OnChangePlugin onChange={onChange} {...onChangePluginProps} />\n )}\n </>\n <>\n {supportedFeatures.components.map((comp) => {\n const ToolComponent = comp.component;\n if (ToolComponent) {\n return <ToolComponent key={comp.id} />;\n }\n\n return <Fragment key={comp.id} />;\n })}\n </>\n <>{children}</>\n </ToolbarContextPlugin>\n </LexicalComposer>\n );\n};\n"],"names":["HeadingNode","ListNode","ListItemNode","ListPlugin","LinkNode","AutoLinkNode","AutoLinkPlugin","LinkPlugin","CodeNode","useMemo","jsx","LexicalComposer","ToolbarContextPlugin","HistoryPlugin","ClearEditorPlugin","DataManagementPlugin","TabFocusPlugin","OnChangePlugin","Fragment"],"mappings":"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"}
|
package/dist/es/editor.js
CHANGED
|
@@ -109,7 +109,8 @@ const Editor = ({
|
|
|
109
109
|
features,
|
|
110
110
|
children,
|
|
111
111
|
initialEditorState,
|
|
112
|
-
dataManagementRef
|
|
112
|
+
dataManagementRef,
|
|
113
|
+
onChangePluginProps
|
|
113
114
|
}) => {
|
|
114
115
|
const supportedFeatures = useMemo(() => {
|
|
115
116
|
if (features) {
|
|
@@ -136,7 +137,7 @@ const Editor = ({
|
|
|
136
137
|
/* @__PURE__ */ jsx(ClearEditorPlugin, {}),
|
|
137
138
|
/* @__PURE__ */ jsx(DataManagementPlugin, { ref: dataManagementRef }),
|
|
138
139
|
/* @__PURE__ */ jsx(TabFocusPlugin, {}),
|
|
139
|
-
/* @__PURE__ */ jsx(Fragment, { children: onChange && /* @__PURE__ */ jsx(OnChangePlugin, { onChange }) }),
|
|
140
|
+
/* @__PURE__ */ jsx(Fragment, { children: onChange && /* @__PURE__ */ jsx(OnChangePlugin, __spreadValues({ onChange }, onChangePluginProps)) }),
|
|
140
141
|
/* @__PURE__ */ jsx(Fragment, { children: supportedFeatures.components.map((comp) => {
|
|
141
142
|
const ToolComponent = comp.component;
|
|
142
143
|
if (ToolComponent) {
|
package/dist/es/editor.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"editor.js","sources":["../../src/editor.tsx"],"sourcesContent":["import { AutoLinkNode, LinkNode } from '@lexical/link';\nimport { ListItemNode, ListNode } from '@lexical/list';\nimport { ClearEditorPlugin } from '@lexical/react/LexicalClearEditorPlugin';\nimport {\n InitialConfigType,\n InitialEditorStateType,\n LexicalComposer\n} from '@lexical/react/LexicalComposer';\nimport { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin';\nimport { ListPlugin } from '@lexical/react/LexicalListPlugin';\nimport { OnChangePlugin } from '@lexical/react/LexicalOnChangePlugin';\nimport { HeadingNode } from '@lexical/rich-text';\n\nimport { CodeNode } from '@lexical/code';\nimport { EditorState, LexicalEditor } from 'lexical';\nimport {\n Fragment, ReactNode, RefObject, useMemo\n} from 'react';\nimport {\n AutoLinkPlugin,\n DataManagementPlugin,\n DataManagementPluginHandle,\n LinkPlugin,\n TabFocusPlugin\n} from './plugins';\n\nimport { ToolbarContextPlugin } from './components';\n\nconst initialConfig: InitialConfigType = {\n namespace: 'TwigsEditor',\n theme: {\n text: {\n bold: 'text-bold',\n italic: 'text-italic',\n underline: 'text-underline',\n code: 'text-code',\n base: 'text-base',\n highlight: 'text-highlight',\n strikethrough: 'text-strikethrough',\n subscript: 'text-subscript',\n superscript: 'text-superscript',\n underlineStrikethrough: 'text-underline-strikethrough'\n },\n code: 'block-code',\n quote: 'block-quote',\n heading: {\n h1: 'block-h1',\n h2: 'block-h2',\n h3: 'block-h3',\n h4: 'block-h4',\n h5: 'block-h5',\n h6: 'block-h6'\n },\n list: {\n ol: 'block-ol',\n ul: 'block-ul',\n listitem: 'block-listitem'\n }\n },\n onError: (err) => {\n // eslint-disable-next-line no-console\n console.error(err);\n }\n};\n\nlet featureId = 0;\n\nconst featuresToNodeMapping = {\n heading: {\n node: HeadingNode,\n component: null\n },\n list: {\n node: [ListNode, ListItemNode],\n component: ListPlugin\n },\n link: {\n node: [LinkNode, AutoLinkNode],\n component: [AutoLinkPlugin, LinkPlugin]\n },\n code: {\n node: [CodeNode],\n component: null\n }\n};\n\nexport
|
|
1
|
+
{"version":3,"file":"editor.js","sources":["../../src/editor.tsx"],"sourcesContent":["import { AutoLinkNode, LinkNode } from '@lexical/link';\nimport { ListItemNode, ListNode } from '@lexical/list';\nimport { ClearEditorPlugin } from '@lexical/react/LexicalClearEditorPlugin';\nimport {\n InitialConfigType,\n InitialEditorStateType,\n LexicalComposer\n} from '@lexical/react/LexicalComposer';\nimport { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin';\nimport { ListPlugin } from '@lexical/react/LexicalListPlugin';\nimport { OnChangePlugin } from '@lexical/react/LexicalOnChangePlugin';\nimport { HeadingNode } from '@lexical/rich-text';\n\nimport { CodeNode } from '@lexical/code';\nimport { EditorState, LexicalEditor } from 'lexical';\nimport {\n Fragment, ReactNode, RefObject, useMemo\n} from 'react';\nimport {\n AutoLinkPlugin,\n DataManagementPlugin,\n DataManagementPluginHandle,\n LinkPlugin,\n TabFocusPlugin\n} from './plugins';\n\nimport { ToolbarContextPlugin } from './components';\n\nconst initialConfig: InitialConfigType = {\n namespace: 'TwigsEditor',\n theme: {\n text: {\n bold: 'text-bold',\n italic: 'text-italic',\n underline: 'text-underline',\n code: 'text-code',\n base: 'text-base',\n highlight: 'text-highlight',\n strikethrough: 'text-strikethrough',\n subscript: 'text-subscript',\n superscript: 'text-superscript',\n underlineStrikethrough: 'text-underline-strikethrough'\n },\n code: 'block-code',\n quote: 'block-quote',\n heading: {\n h1: 'block-h1',\n h2: 'block-h2',\n h3: 'block-h3',\n h4: 'block-h4',\n h5: 'block-h5',\n h6: 'block-h6'\n },\n list: {\n ol: 'block-ol',\n ul: 'block-ul',\n listitem: 'block-listitem'\n }\n },\n onError: (err) => {\n // eslint-disable-next-line no-console\n console.error(err);\n }\n};\n\nlet featureId = 0;\n\nconst featuresToNodeMapping = {\n heading: {\n node: HeadingNode,\n component: null\n },\n list: {\n node: [ListNode, ListItemNode],\n component: ListPlugin\n },\n link: {\n node: [LinkNode, AutoLinkNode],\n component: [AutoLinkPlugin, LinkPlugin]\n },\n code: {\n node: [CodeNode],\n component: null\n }\n};\n\nexport interface EditorProps {\n initialEditorState?: InitialEditorStateType;\n onChange?: (\n newEditorState: EditorState,\n editor: LexicalEditor,\n tags: Set<string>\n ) => void;\n editable?: boolean;\n children?: ReactNode;\n nodes?: InitialConfigType['nodes'];\n features?: (keyof typeof featuresToNodeMapping)[];\n dataManagementRef?: RefObject<DataManagementPluginHandle>;\n onChangePluginProps?: {\n ignoreHistoryMergeTagChange?: boolean;\n ignoreSelectionChange?: boolean;\n };\n}\n\nexport const Editor = ({\n nodes,\n onChange,\n editable,\n features,\n children,\n initialEditorState,\n dataManagementRef,\n onChangePluginProps\n}: EditorProps) => {\n const supportedFeatures = useMemo(() => {\n if (features) {\n const selectedNodes = features\n .map((item) => featuresToNodeMapping[item].node)\n .flat();\n\n const selectedPlugins = features\n .map((item) => featuresToNodeMapping[item].component)\n .flat()\n .map((item) => ({ component: item, id: featureId++ }));\n\n return { nodes: selectedNodes, components: selectedPlugins };\n }\n\n const defaultFeatures = {\n nodes: Object.values(featuresToNodeMapping)\n .map((item) => item.node)\n .flat(),\n components: Object.values(featuresToNodeMapping)\n .map((item) => item.component)\n .flat()\n .map((item) => ({ component: item, id: featureId++ }))\n };\n\n return defaultFeatures;\n }, [features]);\n\n return (\n <LexicalComposer\n initialConfig={{\n ...initialConfig,\n editorState: initialEditorState,\n editable,\n nodes: [...supportedFeatures.nodes, ...(nodes ?? [])]\n }}\n >\n <ToolbarContextPlugin>\n <HistoryPlugin />\n <ClearEditorPlugin />\n <DataManagementPlugin ref={dataManagementRef} />\n <TabFocusPlugin />\n <>\n {onChange && (\n <OnChangePlugin onChange={onChange} {...onChangePluginProps} />\n )}\n </>\n <>\n {supportedFeatures.components.map((comp) => {\n const ToolComponent = comp.component;\n if (ToolComponent) {\n return <ToolComponent key={comp.id} />;\n }\n\n return <Fragment key={comp.id} />;\n })}\n </>\n <>{children}</>\n </ToolbarContextPlugin>\n </LexicalComposer>\n );\n};\n"],"names":["Fragment"],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
|
@@ -335,15 +335,20 @@ declare const featuresToNodeMapping: {
|
|
|
335
335
|
component: null;
|
|
336
336
|
};
|
|
337
337
|
};
|
|
338
|
-
|
|
338
|
+
interface EditorProps {
|
|
339
339
|
initialEditorState?: InitialEditorStateType;
|
|
340
340
|
onChange?: (newEditorState: EditorState, editor: LexicalEditor, tags: Set<string>) => void;
|
|
341
341
|
editable?: boolean;
|
|
342
342
|
children?: ReactNode;
|
|
343
|
-
nodes?: InitialConfigType[
|
|
343
|
+
nodes?: InitialConfigType['nodes'];
|
|
344
344
|
features?: (keyof typeof featuresToNodeMapping)[];
|
|
345
345
|
dataManagementRef?: RefObject<DataManagementPluginHandle>;
|
|
346
|
-
|
|
346
|
+
onChangePluginProps?: {
|
|
347
|
+
ignoreHistoryMergeTagChange?: boolean;
|
|
348
|
+
ignoreSelectionChange?: boolean;
|
|
349
|
+
};
|
|
350
|
+
}
|
|
351
|
+
declare const Editor: ({ nodes, onChange, editable, features, children, initialEditorState, dataManagementRef, onChangePluginProps }: EditorProps) => react_jsx_runtime.JSX.Element;
|
|
347
352
|
|
|
348
353
|
type SerializedHashTagNode = Spread<{
|
|
349
354
|
hashTagName: string;
|
|
@@ -442,4 +447,4 @@ declare class EmojiNode extends TextNode {
|
|
|
442
447
|
declare function $isEmojiNode(node: LexicalNode | null | undefined): node is EmojiNode;
|
|
443
448
|
declare function $createEmojiNode(className: string, emojiText: string): EmojiNode;
|
|
444
449
|
|
|
445
|
-
export { $createEmojiNode, $createHashTagNode, $createImageNode, $createKudosNode, $createMentionNode, $createVariableNode, $isEmojiNode, $isHashTagNode, $isImageNode, $isKudosNode, $isMentionNode, $isVariableNode, AutoLinkPlugin, BoldTool, CodeBlockTool, CodeTool, ConvertSelectionToLinkOnPastePlugin, DataManagementPlugin, type DataManagementPluginHandle, type DefaultToolbarTools, DialogLinkEditor, type DialogLinkEditorOptions, Editor, EditorFloatingToolbar, EditorLookupDropdownBase, type EditorLookupDropdownBaseProps, EditorToolbar, EmojiNode, EmojiPlugin, type FloatingToolbarProperties, type FloatingToolbarTools, FormatTool, type FormatToolProps, HashTagNode, HashTagPlugin, ImageNode, type ImagePayload, ImagesPlugin, type InsertImagePayload, ItalicTool, KudosNode, LinkPlugin, LinkTool, MentionNode, MentionsPlugin, OrderedListTool, RichEditor, type SerializedEmojiNode, type SerializedHashTagNode, type SerializedImageNode, type SerializedKudosNode, type SerializedMentionNode, type SerializedVariableNode, TabFocusPlugin, TextAlignTool, ToolbarContextConsumer, ToolbarContextPlugin, ToolbarStoreProvider, type ToolbarTools, type TypeaheadMenuData, UnderlineTool, UnorderedListTool, VariableNode, useToolbarStore };
|
|
450
|
+
export { $createEmojiNode, $createHashTagNode, $createImageNode, $createKudosNode, $createMentionNode, $createVariableNode, $isEmojiNode, $isHashTagNode, $isImageNode, $isKudosNode, $isMentionNode, $isVariableNode, AutoLinkPlugin, BoldTool, CodeBlockTool, CodeTool, ConvertSelectionToLinkOnPastePlugin, DataManagementPlugin, type DataManagementPluginHandle, type DefaultToolbarTools, DialogLinkEditor, type DialogLinkEditorOptions, Editor, EditorFloatingToolbar, EditorLookupDropdownBase, type EditorLookupDropdownBaseProps, type EditorProps, EditorToolbar, EmojiNode, EmojiPlugin, type FloatingToolbarProperties, type FloatingToolbarTools, FormatTool, type FormatToolProps, HashTagNode, HashTagPlugin, ImageNode, type ImagePayload, ImagesPlugin, type InsertImagePayload, ItalicTool, KudosNode, LinkPlugin, LinkTool, MentionNode, MentionsPlugin, OrderedListTool, RichEditor, type SerializedEmojiNode, type SerializedHashTagNode, type SerializedImageNode, type SerializedKudosNode, type SerializedMentionNode, type SerializedVariableNode, TabFocusPlugin, TextAlignTool, ToolbarContextConsumer, ToolbarContextPlugin, ToolbarStoreProvider, type ToolbarTools, type TypeaheadMenuData, UnderlineTool, UnorderedListTool, VariableNode, useToolbarStore };
|