From ec2baeacf443709fa08ee270e8b851c65288e6a6 Mon Sep 17 00:00:00 2001 From: zbeyens Date: Mon, 22 Nov 2021 15:56:53 +0100 Subject: [PATCH] docs --- .changeset/align-ma.md | 6 + .changeset/align-mi.md | 6 + .changeset/basic-ma.md | 5 + .changeset/basic-marks-ma.md | 5 + .changeset/basic-marks-mi.md | 6 + .changeset/code-block-ma.md | 7 + .changeset/core-ma.md | 246 ++++++++++++++++-- .changeset/core-mi.md | 172 +++++++++++- .changeset/csv-ma.md | 7 + .changeset/find-replace-ma.md | 6 + .changeset/heading-ma.md | 6 + .changeset/image-mi.md | 6 + .changeset/indent-list-ma.md | 6 +- .changeset/ma-renames.md | 5 - .changeset/md-ma.md | 11 + .changeset/mention-ma.md | 8 + .changeset/plate-ma.md | 41 ++- .changeset/plate-mi.md | 11 + .../utils/htmlElementToLeaf.ts | 5 - .../plate/selectors/usePlateEditorRef.ts | 7 - packages/core/src/utils/createPlateEditor.ts | 8 +- .../core/src/utils/createPluginFactory.ts | 4 +- packages/core/src/utils/createPlugins.tsx | 5 + packages/core/src/utils/getInjectedPlugins.ts | 4 + packages/core/src/utils/mergeDeepPlugins.ts | 2 +- .../CodeBlockToolbarButton.tsx | 5 +- .../code-block/src/insertFragmentCodeBlock.ts | 13 +- .../src/options/getCodeBlockType.ts | 5 - .../elements/code-block/src/options/index.ts | 1 - .../src/transforms/insertCodeBlock.ts | 8 +- .../src/transforms/toggleCodeBlock.ts | 12 +- .../src/transforms/unwrapCodeBlock.ts | 7 +- 32 files changed, 571 insertions(+), 75 deletions(-) create mode 100644 .changeset/align-ma.md create mode 100644 .changeset/align-mi.md create mode 100644 .changeset/basic-ma.md create mode 100644 .changeset/basic-marks-ma.md create mode 100644 .changeset/basic-marks-mi.md create mode 100644 .changeset/code-block-ma.md create mode 100644 .changeset/csv-ma.md create mode 100644 .changeset/find-replace-ma.md create mode 100644 .changeset/heading-ma.md create mode 100644 .changeset/image-mi.md delete mode 100644 .changeset/ma-renames.md create mode 100644 .changeset/md-ma.md create mode 100644 .changeset/mention-ma.md create mode 100644 .changeset/plate-mi.md delete mode 100644 packages/elements/code-block/src/options/getCodeBlockType.ts diff --git a/.changeset/align-ma.md b/.changeset/align-ma.md new file mode 100644 index 0000000000..4a9bb6ec51 --- /dev/null +++ b/.changeset/align-ma.md @@ -0,0 +1,6 @@ +--- +'@udecode/plate-alignment': major +--- + +- `setAlign` + - moved param 3 to param 2 as `setNodesOptions` \ No newline at end of file diff --git a/.changeset/align-mi.md b/.changeset/align-mi.md new file mode 100644 index 0000000000..6392d47928 --- /dev/null +++ b/.changeset/align-mi.md @@ -0,0 +1,6 @@ +--- +'@udecode/plate-alignment-ui': minor +--- + +- `AlignToolbarButtonProps` extended: + - `pluginKey` \ No newline at end of file diff --git a/.changeset/basic-ma.md b/.changeset/basic-ma.md new file mode 100644 index 0000000000..673b04ddd3 --- /dev/null +++ b/.changeset/basic-ma.md @@ -0,0 +1,5 @@ +--- +'@udecode/plate-basic-elements': major +--- + +- renamed `createBasicElementPlugins` to `createBasicElementsPlugin` \ No newline at end of file diff --git a/.changeset/basic-marks-ma.md b/.changeset/basic-marks-ma.md new file mode 100644 index 0000000000..0672fcf800 --- /dev/null +++ b/.changeset/basic-marks-ma.md @@ -0,0 +1,5 @@ +--- +'@udecode/plate-basic-marks': major +--- + +- renamed `createBasicMarkPlugins` to `createBasicMarksPlugin` \ No newline at end of file diff --git a/.changeset/basic-marks-mi.md b/.changeset/basic-marks-mi.md new file mode 100644 index 0000000000..5da7380e79 --- /dev/null +++ b/.changeset/basic-marks-mi.md @@ -0,0 +1,6 @@ +--- +'@udecode/plate-basic-marks': minor +--- + +- `bold` plugin `deserializeHtml` + - added `B` as valid node name \ No newline at end of file diff --git a/.changeset/code-block-ma.md b/.changeset/code-block-ma.md new file mode 100644 index 0000000000..cf5cac7deb --- /dev/null +++ b/.changeset/code-block-ma.md @@ -0,0 +1,7 @@ +--- +'@udecode/plate-code-block': major +--- + +Removed: +- `getCodeBlockPluginOptions` for `getPlugin` +- `getCodeLinePluginOptions` for `getPlugin` \ No newline at end of file diff --git a/.changeset/core-ma.md b/.changeset/core-ma.md index 6218fe9329..61c076c587 100644 --- a/.changeset/core-ma.md +++ b/.changeset/core-ma.md @@ -4,31 +4,247 @@ Breaking changes: +### `Plate` + +- removed `components` prop: +```tsx +// Before + + +// After +// option 1: use the plugin factory +let plugins = [ + createParagraphPlugin({ + component: ParagraphElement, + }) +]; + +// option 2: use createPlugins +plugins = createPlugins(plugins, { + components: { + [ELEMENT_PARAGRAPH]: ParagraphElement + } +}); + + +``` + +- removed `options` prop: +```tsx +// Before + + +// After +// option 1: use the plugin factory +let plugins = [ + createParagraphPlugin({ + type: 'paragraph', + }) +]; + +// option 2: use createPlugins +plugins = createPlugins(plugins, { + overrideByKey: { + [ELEMENT_PARAGRAPH]: { + type: 'paragraph', + } + } +}); + + +``` + ### `PlatePlugin` -- handlers (all fields starting by `on...`) are moved to `handlers` field. -```ts + +- `key` + - replacing `pluginKey` + - is now required: each plugin needs a key to be retrieved by key. +- all handlers have `plugin` as a second parameter: +```tsx // Before -onDrop: (editor) => () => editor.isDragging - +export type X = ( + editor: PlateEditor, +) => Y + // After -handlers: { - onDrop: (editor) => () => editor.isDragging -} +export type X = ( + editor: PlateEditor, + plugin: WithPlatePlugin +) => Y ``` --> `injectChildComponent` +- `serialize` no longer has `element` and `leaf` properties: ```ts -// Before -injectChildComponent: getIndentListInjectComponent() +type SerializeHtml = RenderFunction< + PlateRenderElementProps | PlateRenderLeafProps +>; +``` + +Renamed: +- `injectParentComponent` to `inject.aboveComponent` +- `injectChildComponent` to `inject.belowComponent` +- `overrideProps` to `inject.props` + - `transformClassName`, `transformNodeValue`, `transformStyle` first parameter is no longer `editor` as it's provided by `then` if needed. + - the previously `getOverrideProps` is now the core behavior if `inject.props` is defined. +- `serialize` to `serializeHtml` +- `deserialize` to `deserializeHtml` + - can be an array + - the old deserializer options are merged to `deserializeHtml` +```tsx +type DeserializeHtml = { + /** + * List of HTML attribute names to store their values in `node.attributes`. + */ + attributeNames?: string[]; + + /** + * Deserialize an element. + * Use this instead of plugin.isElement if you don't want the plugin to renderElement. + * @default plugin.isElement + */ + isElement?: boolean; + + /** + * Deserialize a leaf. + * Use this instead of plugin.isLeaf if you don't want the plugin to renderLeaf. + * @default plugin.isLeaf + */ + isLeaf?: boolean; + + /** + * Deserialize html element to slate node. + */ + getNode?: (element: HTMLElement) => AnyObject | undefined; + + query?: (element: HTMLElement) => boolean; + /** + * Deserialize an element: + * - if this option (string) is in the element attribute names. + * - if this option (object) values match the element attributes. + */ + validAttribute?: string | { [key: string]: string | string[] }; + + /** + * Valid element `className`. + */ + validClassName?: string; + + /** + * Valid element `nodeName`. + * Set '*' to allow any node name. + */ + validNodeName?: string | string[]; + + /** + * Valid element style values. + * Can be a list of string (only one match is needed). + */ + validStyle?: Partial< + Record + >; + + /** + * Whether or not to include deserialized children on this node + */ + withoutChildren?: boolean; +}; +``` + +- handlers starting by `on...` are moved to `handlers` field. +```ts +// Before +onDrop: handler + // After -inject: { - belowComponent: injectIndentListComponent +handlers: { + onDrop: handler } ``` --> `WithOverride` +Removed: +- `renderElement` is favor of: + - `isElement` is a boolean that enables element rendering. + - the previously `getRenderElement` is now the core behavior. +- `renderLeaf` is favor of: + - `isLeaf` is a boolean that enables leaf rendering. + - the previously `getRenderLeaf` is now the core behavior. +- `inlineTypes` and `voidTypes` for: + - `isInline` is a boolean that enables inline rendering. + - `isVoid` is a boolean that enables void rendering. + +### General + +- `plugins` is not a parameter anymore as it can be retrieved in `editor.plugins` +- `withInlineVoid` is now using plugins `isInline` and `isVoid` plugin fields. + +Renamed: +- `getPlatePluginType` to `getPluginType` +- `getEditorOptions` to `getPlugins` +- `getPlatePluginOptions` to `getPlugin` +- `pipeOverrideProps` to `pipeInjectProps` +- `getOverrideProps` to `pluginInjectProps` +- `serializeHTMLFromNodes` to `serializeHtml` + - `getLeaf` to `leafToHtml` + - `getNode` to `elementToHtml` +- `xDeserializerId` to `KEY_DESERIALIZE_X` +- `deserializeHTMLToText` to `htmlTextNodeToString` +- `deserializeHTMLToMarks` to `htmlElementToLeaf` and `pipeDeserializeHtmlLeaf` +- `deserializeHTMLToElement` to `htmlElementToElement` and `pipeDeserializeHtmlElement` +- `deserializeHTMLToFragment` to `htmlBodyToFragment` +- `deserializeHTMLToDocumentFragment` to `deserializeHtml` +- `deserializeHTMLToBreak` to `htmlBrToNewLine` +- `deserializeHTMLNode` to `deserializeHtmlNode` +- `deserializeHTMLElement` to `deserializeHtmlElement` + +Removed: +- `usePlateKeys`, `getPlateKeys` +- `usePlateOptions` for `getPlugin` +- `getPlateSelection` for `getPlateEditorRef().selection` +- `flatMapByKey` +- `getEditableRenderElement` and `getRenderElement` for `pipeRenderElement` and `pluginRenderElement` +- `getEditableRenderLeaf` and `getRenderLeaf` for `pipeRenderLeaf` and `pluginRenderLeaf` +- `getInlineTypes` +- `getVoidTypes` +- `getPlatePluginTypes` +- `getPlatePluginWithOverrides` +- `mapPlatePluginKeysToOptions` +- `withDeserializeX` for `PlatePlugin.editor.insertData` + +Changed types: +- `PlateEditor`: + - removed `options` for `pluginsByKey` +- `WithOverride` is not returning an extended editor anymore (input and output editors are assumed to be the same types for simplicity). +- `PlateState` + - renamed `keyChange` to `keyEditor` + - removed `plugins` for `editor.plugins` + - removed `pluginKeys` + - removed `selection` for `editor.selection` + - actions: + - removed `setSelection`, `setPlugins`, `setPluginKeys` + - removed `incrementKeyChange` for -### Rename +Renamed types: +- `XHTMLY` to `XHtmlY` +- `Deserialize` to `DeseralizeHtml` -- `getPlatePluginType` to `getPluginType` \ No newline at end of file +Removed types: +- `PlatePluginOptions`: + - `type` to `PlatePlugin.type` + - `component` to `PlatePlugin.component` + - `deserialize` to `PlatePlugin.deserializeHtml` + - `getNodeProps` to `PlatePlugin.props.nodeProps` + - `hotkey` to `HotkeyPlugin` + - `clear` to `ToggleMarkPlugin` + - `defaultType` is hardcoded to `p.type` +- `OverrideProps` for `PlatePlugin.inject.props` +- `Serialize` for `PlatePlugin.serializeHtml` +- `NodeProps` for `AnyObject` +- `OnKeyDownElementOptions` for `HotkeyPlugin` +- `OnKeyDownMarkOptions` for `ToggleMarkPlugin` +- `WithInlineVoidOptions` +- `GetNodeProps` for `PlatePluginProps` +- `DeserializeOptions`, `GetLeafDeserializerOptions`, `GetElementDeserializerOptions`, `GetNodeDeserializerOptions`, `GetNodeDeserializerRule`, `DeserializeNode` for `PlatePlugin.deserializeHtml` +- `PlateOptions` +- `RenderNodeOptions` +- `DeserializedHTMLElement` diff --git a/.changeset/core-mi.md b/.changeset/core-mi.md index 51cec6d6ff..f7ade565ef 100644 --- a/.changeset/core-mi.md +++ b/.changeset/core-mi.md @@ -2,5 +2,175 @@ '@udecode/plate-core': minor --- +`PlatePlugin` extended: +- These fields are used by `withInsertData` plugin. +```tsx +interface PlatePlugin { + editor?: Nullable<{ + insertData?: { + /** + * Format to get data. Example data types are text/plain and text/uri-list. + */ + format?: string; + + /** + * Query to skip this plugin. + */ + query?: (options: PlatePluginInsertDataOptions) => boolean; + + /** + * Deserialize data to fragment + */ + getFragment?: ( + options: PlatePluginInsertDataOptions + ) => TDescendant[] | undefined; + + // injected + + /** + * Function called on `editor.insertData` just before `editor.insertFragment`. + * Default: if the block above the selection is empty and the first fragment node type is not inline, + * set the selected node type to the first fragment node type. + * @return if true, the next handlers will be skipped. + */ + preInsert?: ( + fragment: TDescendant[], + options: PlatePluginInsertDataOptions + ) => HandlerReturnType; + + /** + * Transform the inserted data. + */ + transformData?: ( + data: string, + options: { dataTransfer: DataTransfer } + ) => string; + + /** + * Transform the fragment to insert. + */ + transformFragment?: ( + fragment: TDescendant[], + options: PlatePluginInsertDataOptions + ) => TDescendant[]; + } + }>; +} +``` + +- `inject.pluginsByKey`: +```tsx +interface PlatePlugin { + inject?: { + /** + * Any plugin can use this field to inject code into a stack. + * For example, if multiple plugins have defined + * `inject.editor.insertData.transformData` for `key=KEY_DESERIALIZE_HTML`, + * `insertData` plugin will call all of these `transformData` for `KEY_DESERIALIZE_HTML` plugin. + * Differs from `overrideByKey` as this is not overriding any plugin. + */ + pluginsByKey?: Record>>; + } +} +``` + +- `options`: any plugin can use the second generic type to type this field. It means that each plugin can be extended using this field. +- `type` is now optional +- `component`: no longer need of `options` to customize the component. +- `overrideByKey`: a plugin can override other plugins by key (deep merge). +- `plugins`: + - Can be used to pack multiple plugins, like the heading plugin. + - Plate eventually flats all the plugins into `editor.plugins`. + - nesting support (recursive) +- `props`: Override node `component` props. Props object or function with props parameters returning the new props. Previously done by `overrideProps` and `getNodeProps` options. +- `then`: a function that is called after the plugin is loaded. + - this is very powerful as it allows you to have plugin fields derived from the editor and/or the loaded plugin. + - nesting support (recursive) +```ts +interface PlatePlugin { + /** + * Recursive plugin merging. + * Can be used to derive plugin fields from `editor`, `plugin`. + * The returned value will be deeply merged to the plugin. + */ + then?: ( + editor: PlateEditor, + plugin: WithPlatePlugin + ) => Partial>; +} +``` + + +New plugins: +- `createEventEditorPlugin` (core) +- `createInsertDataPlugin` + - `withInsertData` + - all plugins using `editor.insertData` field will be used here + - it first gets the data with `format` + - then it pipes `query` + - then it pipes `transformData` + - then it calls `getFragment` + - then it pipes `transformFragment` + - then it pipes `insertFragment` + +New utils: - `@udecode/plate-common` has been merged into this package as both packages were dependencies of the exact same packages. -- \ No newline at end of file +- `@udecode/plate-html-serializer` has been merged into this package. +- `@udecode/plate-ast-serializer` has been merged into this package. +- `@udecode/plate-serializer` has been merged into this package. +- `createPlateEditor`: Create a plate editor with: + - `createEditor` or custom `editor` + - `withPlate` + - custom `components` +- `createPluginFactory`: Create plugin factory with a default plugin. + - The plugin factory: + - param 1 `override` can be used to (deeply) override the default plugin. + - param 2 `overrideByKey` can be used to (deeply) override a nested plugin (in plugin.plugins) by key. +- `createPlugins`: Creates a new array of plugins by overriding the plugins in the original array. + - Components can be overridden by key using `components` in the second param. + - Any other properties can be overridden by key using `overrideByKey` in the second param. +- `findHtmlParentElement` +- `flattenDeepPlugins`: Recursively merge `plugin.plugins` into `editor.plugins` and `editor.pluginsByKey` +- `mergeDeepPlugins`: Recursively merge nested plugins into the root plugins. +- `getInjectedPlugins`: + - Get all plugins having a defined `inject.pluginsByKey[plugin.key]`. + - It includes `plugin` itself. +- `getPluginInjectProps` +- `getPluginOptions` +- `getPluginsByKey` +- `mockPlugin` +- `overridePluginsByKey`: Recursive deep merge of each plugin from `overrideByKey` into plugin with same key (`plugin` > `plugin.plugins`). +- `pipeInsertDataQuery` +- `pipeInsertFragment` +- `pipeTransformData` +- `pipeTransformFragment` +- `setDefaultPlugin` +- `setPlatePlugins`: Flatten deep plugins then set editor.plugins and editor.pluginsByKey +- `deserializeHtmlNodeChildren` +- `isHtmlComment` +- `isHtmlElement` +- `isHtmlText` +- `pluginDeserializeHtml` + +New selectors: +- `usePlateKey` + +New types: +- `HotkeyPlugin` – `hotkey` +- `ToggleMarkPlugin` – `hotkey`, `mark` +- `OverrideByKey` +- `WithPlatePlugin`: + - `PlatePlugin` with required `type`, `options`, `inject` and `editor`. + - `Plate` will create default values if not defined. + +Extended types: +- `PlateEditor`: + - `plugins`: list of the editor plugins + - `pluginsByKey`: map of the editor plugins +- `PlateState`: + - `keyPlugins`: A key that is incremented on each `editor.plugins` change. + - `keySelection`: A key that is incremented on each `editor.selection` change. +- `WithPlateOptions`: + - `disableCorePlugins` + - disable core plugins if you'd prefer to have more control over the plugins order. + diff --git a/.changeset/csv-ma.md b/.changeset/csv-ma.md new file mode 100644 index 0000000000..a86ba97b79 --- /dev/null +++ b/.changeset/csv-ma.md @@ -0,0 +1,7 @@ +--- +'@udecode/plate-csv-serializer': major +--- + +Renamed: +- `createDeserializeCSVPlugin` to `createDeserializeCsvPlugin` +- `deserializeCSV` to `deserializeCsv` diff --git a/.changeset/find-replace-ma.md b/.changeset/find-replace-ma.md new file mode 100644 index 0000000000..7f66493393 --- /dev/null +++ b/.changeset/find-replace-ma.md @@ -0,0 +1,6 @@ +--- +'@udecode/plate-find-replace': major +--- + +Removed: +- `useFindReplacePlugin` for `createFindReplacePlugin` \ No newline at end of file diff --git a/.changeset/heading-ma.md b/.changeset/heading-ma.md new file mode 100644 index 0000000000..a63d5e2253 --- /dev/null +++ b/.changeset/heading-ma.md @@ -0,0 +1,6 @@ +--- +'@udecode/plate-heading': major +--- + +Renamed: +- `HeadingPluginOptions` to `HeadingsPlugin` \ No newline at end of file diff --git a/.changeset/image-mi.md b/.changeset/image-mi.md new file mode 100644 index 0000000000..6fecbc71dc --- /dev/null +++ b/.changeset/image-mi.md @@ -0,0 +1,6 @@ +--- +'@udecode/plate-image': minor +--- + +- `withImageUpload`: + - pipes injected plugins `editor.insertData.query` so it can be disabled \ No newline at end of file diff --git a/.changeset/indent-list-ma.md b/.changeset/indent-list-ma.md index 28bada33ab..c6c36698f1 100644 --- a/.changeset/indent-list-ma.md +++ b/.changeset/indent-list-ma.md @@ -2,8 +2,8 @@ '@udecode/plate-indent-list': major --- -- removed `IndentListPluginOptions` in favor of `PlatePlugin` - -### Rename +Removed: +- `IndentListPluginOptions` for `PlatePlugin` +Rename: - `getIndentListInjectComponent` to `injectIndentListComponent` \ No newline at end of file diff --git a/.changeset/ma-renames.md b/.changeset/ma-renames.md deleted file mode 100644 index a56618e3ea..0000000000 --- a/.changeset/ma-renames.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@udecode/plate-indent': major ---- - - diff --git a/.changeset/md-ma.md b/.changeset/md-ma.md new file mode 100644 index 0000000000..c0b15a425e --- /dev/null +++ b/.changeset/md-ma.md @@ -0,0 +1,11 @@ +--- +'@udecode/plate-md-serializer': major +--- + +- `createDeserializeMdPlugin`: + - is now disabled if there is html data in the data transfer. + +Renamed: +- `createDeserializeMDPlugin` to `createDeserializeMdPlugin` +- `deserializeMD` to `deserializeMd` + diff --git a/.changeset/mention-ma.md b/.changeset/mention-ma.md new file mode 100644 index 0000000000..24f4b9c734 --- /dev/null +++ b/.changeset/mention-ma.md @@ -0,0 +1,8 @@ +--- +'@udecode/plate-mention': major +--- + +Removed: +- `getMentionInputPluginOptions` for `getPlugin` +- `getMentionInputType` for `getPluginType` +- `COMBOBOX_TRIGGER_MENTION` \ No newline at end of file diff --git a/.changeset/plate-ma.md b/.changeset/plate-ma.md index 7122656b17..3dd7b2dbd1 100644 --- a/.changeset/plate-ma.md +++ b/.changeset/plate-ma.md @@ -4,16 +4,39 @@ Breaking changes: -### Deps +- all plugins options are now defined in the plugin itself +- plugins which now have nested plugins instead of array: + - `createBasicElementsPlugin` + - `createCodeBlockPlugin` + - `createHeadingPlugin` + - `createListPlugin` + - `createTablePlugin` + - `createBasicMarksPlugin` -- updated: - - `"slate": "0.70.0"` - - `"slate-react": "0.70.1"` -- removed: - - `plate-common` +Removed: +- `createEditorPlugins` for `createPlateEditor` (without components) and `createPlateEditorUI` (with Plate components) +- `createPlateOptions` for `createPlugins` +- all `DEFAULTS_X`: these are defined in the plugins +- all `getXDeserialize`: these are defined in the plugins +- all `WithXOptions` for extended plugins +- all `getXRenderElement` +- some plugin option types are removed for `PlatePlugin` -### Rename +Renamed: +- `createPlateComponents` to `createPlateUI` +- all `getXY` handlers to `yX` (e.g. `getXOnKeyDown` to `onKeyDownX`) +- all `XPluginOptions` to `XPlugin` +- all `pluginKey` parameter to `key` except in components -- `getXOnKeyDown` to `onKeyDownX` -- `XPluginOptions` to `XPlugin` +Renamed types: +- `DecorateSearchHighlightOptions` to `FindReplacePlugin` +Updated deps: +- `"slate": "0.70.0"` +- `"slate-react": "0.70.1"` + +Removed deps (merged to core): +- `plate-common` +- `plate-ast-serializer` +- `plate-html-serializer` +- `plate-serializer` \ No newline at end of file diff --git a/.changeset/plate-mi.md b/.changeset/plate-mi.md new file mode 100644 index 0000000000..962e747608 --- /dev/null +++ b/.changeset/plate-mi.md @@ -0,0 +1,11 @@ +--- +'@udecode/plate': minor +--- + +New package: +- `plate-docx-serializer` + - `createDeserializeDocxPlugin` + - deserialize docx inserted data: + - clean the html first + - marks + - lists to plate indent lists (no support yet for plate lists) \ No newline at end of file diff --git a/packages/core/src/plugins/html-deserializer/utils/htmlElementToLeaf.ts b/packages/core/src/plugins/html-deserializer/utils/htmlElementToLeaf.ts index 2ccd67299f..1e245812c2 100644 --- a/packages/core/src/plugins/html-deserializer/utils/htmlElementToLeaf.ts +++ b/packages/core/src/plugins/html-deserializer/utils/htmlElementToLeaf.ts @@ -4,14 +4,9 @@ import { PlateEditor } from '../../../types/PlateEditor'; import { TDescendant } from '../../../types/slate/TDescendant'; import { isElement } from '../../../types/slate/TElement'; import { mergeDeepToNodes } from '../../../utils/mergeDeepToNodes'; -import { DeserializeHtmlChildren } from '../types'; import { deserializeHtmlNodeChildren } from './deserializeHtmlNodeChildren'; import { pipeDeserializeHtmlLeaf } from './pipeDeserializeHtmlLeaf'; -export interface HtmlElementToLeafOptions { - children: DeserializeHtmlChildren[]; -} - /** * Deserialize HTML to TDescendant[] with marks on Text. * Build the leaf from the leaf deserializers of each plugin. diff --git a/packages/core/src/stores/plate/selectors/usePlateEditorRef.ts b/packages/core/src/stores/plate/selectors/usePlateEditorRef.ts index 99b9c20c49..833cf5a7de 100644 --- a/packages/core/src/stores/plate/selectors/usePlateEditorRef.ts +++ b/packages/core/src/stores/plate/selectors/usePlateEditorRef.ts @@ -9,10 +9,3 @@ export const getPlateEditorRef = (id?: string | null) => */ export const usePlateEditorRef = (id?: string | null) => usePlateStore(() => getPlateEditorRef(id)); - -/** - * Get plate editor ref updating on plugins change. - */ -export const usePlateEditorWithPlugins = (id?: string | null) => { - return usePlateStore(() => getPlateEditorRef(id)); -}; diff --git a/packages/core/src/utils/createPlateEditor.ts b/packages/core/src/utils/createPlateEditor.ts index 4a627f7b56..4a8a35f8c5 100644 --- a/packages/core/src/utils/createPlateEditor.ts +++ b/packages/core/src/utils/createPlateEditor.ts @@ -16,11 +16,9 @@ export interface CreatePlateEditorOptions /** * Create a plate editor with: - * - createEditor or `editor` param - * - withPlate - * - createReactPlugin - * - createHistoryPlugin - * - components + * - `createEditor` or custom `editor` + * - `withPlate` + * - custom `components` */ export const createPlateEditor = ({ editor = createEditor(), diff --git a/packages/core/src/utils/createPluginFactory.ts b/packages/core/src/utils/createPluginFactory.ts index 40f85f22e8..bc0afec951 100644 --- a/packages/core/src/utils/createPluginFactory.ts +++ b/packages/core/src/utils/createPluginFactory.ts @@ -6,8 +6,8 @@ import { overridePluginsByKey } from './overridePluginsByKey'; /** * Create plugin factory with a default plugin. * The plugin factory: - * - first param can be used to (deeply) override the default plugin. - * - second param can be used to (deeply) override a nested plugin (plugin.plugins) by key. + * - param 1 `override` can be used to (deeply) override the default plugin. + * - param 2 `overrideByKey` can be used to (deeply) override a nested plugin (in plugin.plugins) by key. */ export const createPluginFactory =

( defaultPlugin: PlatePlugin<{}, NoInfer

> diff --git a/packages/core/src/utils/createPlugins.tsx b/packages/core/src/utils/createPlugins.tsx index e7b9390510..f0e0f905b2 100644 --- a/packages/core/src/utils/createPlugins.tsx +++ b/packages/core/src/utils/createPlugins.tsx @@ -4,6 +4,11 @@ import { PlatePlugin } from '../types/plugins/PlatePlugin'; import { PlatePluginComponent } from '../types/plugins/PlatePluginComponent'; import { overridePluginsByKey } from './overridePluginsByKey'; +/** + * Creates a new array of plugins by overriding the plugins in the original array. + * Components can be overridden by key using `components` in the second param. + * Any other properties can be overridden by key using `overrideByKey` in the second param. + */ export const createPlugins = ( plugins: PlatePlugin[], { diff --git a/packages/core/src/utils/getInjectedPlugins.ts b/packages/core/src/utils/getInjectedPlugins.ts index fd7010b396..5174dbf57e 100644 --- a/packages/core/src/utils/getInjectedPlugins.ts +++ b/packages/core/src/utils/getInjectedPlugins.ts @@ -3,6 +3,10 @@ import { PlatePlugin, WithPlatePlugin } from '../types/plugins/PlatePlugin'; export type InjectedPlugin = Partial>; +/** + * Get all plugins having a defined `inject.pluginsByKey[plugin.key]`. + * It includes `plugin` itself. + */ export const getInjectedPlugins = ( editor: PlateEditor, plugin: WithPlatePlugin diff --git a/packages/core/src/utils/mergeDeepPlugins.ts b/packages/core/src/utils/mergeDeepPlugins.ts index 5db93a4aa0..1d289a44a8 100644 --- a/packages/core/src/utils/mergeDeepPlugins.ts +++ b/packages/core/src/utils/mergeDeepPlugins.ts @@ -6,7 +6,7 @@ import { PlateEditor } from '../types/PlateEditor'; import { WithPlatePlugin } from '../types/plugins/PlatePlugin'; /** - * Recursively merge nested plugins into the the root plugins + * Recursively merge nested plugins into the root plugins */ export const mergeDeepPlugins = < T = {}, diff --git a/packages/elements/code-block-ui/src/CodeBlockToolbarButton/CodeBlockToolbarButton.tsx b/packages/elements/code-block-ui/src/CodeBlockToolbarButton/CodeBlockToolbarButton.tsx index 7e1b700814..cfd7e6a357 100644 --- a/packages/elements/code-block-ui/src/CodeBlockToolbarButton/CodeBlockToolbarButton.tsx +++ b/packages/elements/code-block-ui/src/CodeBlockToolbarButton/CodeBlockToolbarButton.tsx @@ -1,10 +1,11 @@ import React from 'react'; import { CodeBlockInsertOptions, - getCodeBlockType, + ELEMENT_CODE_BLOCK, insertEmptyCodeBlock, } from '@udecode/plate-code-block'; import { + getPluginType, getPreventDefaultHandler, usePlateEditorState, } from '@udecode/plate-core'; @@ -23,7 +24,7 @@ export const CodeBlockToolbarButton = ({ return ( { const { insertFragment } = editor; - const codeBlockType = getCodeBlockType(editor); - const codeLineType = getCodeLineType(editor); + const codeBlockType = getPluginType(editor, ELEMENT_CODE_BLOCK); + const codeLineType = getPluginType(editor, ELEMENT_CODE_LINE); function convertNodeToCodeLine(node: TDescendant) { return { diff --git a/packages/elements/code-block/src/options/getCodeBlockType.ts b/packages/elements/code-block/src/options/getCodeBlockType.ts deleted file mode 100644 index 390f54b5fa..0000000000 --- a/packages/elements/code-block/src/options/getCodeBlockType.ts +++ /dev/null @@ -1,5 +0,0 @@ -import { getPluginType, PlateEditor } from '@udecode/plate-core'; -import { ELEMENT_CODE_BLOCK } from '../constants'; - -export const getCodeBlockType = (editor: PlateEditor): string => - getPluginType(editor, ELEMENT_CODE_BLOCK); diff --git a/packages/elements/code-block/src/options/index.ts b/packages/elements/code-block/src/options/index.ts index 88cb08c98d..749c470fba 100644 --- a/packages/elements/code-block/src/options/index.ts +++ b/packages/elements/code-block/src/options/index.ts @@ -2,5 +2,4 @@ * @file Automatically generated by barrelsby. */ -export * from './getCodeBlockType'; export * from './getCodeLineType'; diff --git a/packages/elements/code-block/src/transforms/insertCodeBlock.ts b/packages/elements/code-block/src/transforms/insertCodeBlock.ts index a580ae30ac..2eafc5d01e 100644 --- a/packages/elements/code-block/src/transforms/insertCodeBlock.ts +++ b/packages/elements/code-block/src/transforms/insertCodeBlock.ts @@ -1,4 +1,5 @@ import { + getPluginType, InsertNodesOptions, isExpanded, isSelectionAtBlockStart, @@ -8,7 +9,8 @@ import { TElement, wrapNodes, } from '@udecode/plate-core'; -import { getCodeBlockType, getCodeLineType } from '../options'; +import { ELEMENT_CODE_BLOCK } from '../constants'; +import { getCodeLineType } from '../options'; /** * Insert a code block: set the node to code line and wrap it with a code block. @@ -21,7 +23,7 @@ export const insertCodeBlock = ( if (!editor.selection || isExpanded(editor.selection)) return; const matchCodeElements = (node: TElement) => - node.type === getCodeBlockType(editor) || + node.type === getPluginType(editor, ELEMENT_CODE_BLOCK) || node.type === getCodeLineType(editor); if ( @@ -48,7 +50,7 @@ export const insertCodeBlock = ( wrapNodes( editor, { - type: getCodeBlockType(editor), + type: getPluginType(editor, ELEMENT_CODE_BLOCK), children: [], }, insertNodesOptions diff --git a/packages/elements/code-block/src/transforms/toggleCodeBlock.ts b/packages/elements/code-block/src/transforms/toggleCodeBlock.ts index bc119e8423..62f33ade97 100644 --- a/packages/elements/code-block/src/transforms/toggleCodeBlock.ts +++ b/packages/elements/code-block/src/transforms/toggleCodeBlock.ts @@ -1,19 +1,23 @@ import { getNodes, + getPluginType, PlateEditor, setNodes, someNode, TElement, wrapNodes, } from '@udecode/plate-core'; -import { getCodeBlockType, getCodeLineType } from '../options'; +import { ELEMENT_CODE_BLOCK } from '../constants'; +import { getCodeLineType } from '../options'; import { unwrapCodeBlock } from './unwrapCodeBlock'; export const toggleCodeBlock = (editor: PlateEditor) => { if (!editor.selection) return; + const codeBlockType = getPluginType(editor, ELEMENT_CODE_BLOCK); + const isActive = someNode(editor, { - match: { type: getCodeBlockType(editor) }, + match: { type: codeBlockType }, }); unwrapCodeBlock(editor); @@ -24,7 +28,7 @@ export const toggleCodeBlock = (editor: PlateEditor) => { if (!isActive) { const codeBlock = { - type: getCodeBlockType(editor), + type: codeBlockType, children: [], }; wrapNodes(editor, codeBlock); @@ -36,7 +40,7 @@ export const toggleCodeBlock = (editor: PlateEditor) => { ]; const codeLine = { - type: getCodeBlockType(editor), + type: codeBlockType, children: [], }; diff --git a/packages/elements/code-block/src/transforms/unwrapCodeBlock.ts b/packages/elements/code-block/src/transforms/unwrapCodeBlock.ts index 2bb89a5bc9..bfb9c42b78 100644 --- a/packages/elements/code-block/src/transforms/unwrapCodeBlock.ts +++ b/packages/elements/code-block/src/transforms/unwrapCodeBlock.ts @@ -1,12 +1,13 @@ -import { PlateEditor, unwrapNodes } from '@udecode/plate-core'; -import { getCodeBlockType, getCodeLineType } from '../options'; +import { getPluginType, PlateEditor, unwrapNodes } from '@udecode/plate-core'; +import { ELEMENT_CODE_BLOCK } from '../constants'; +import { getCodeLineType } from '../options'; export const unwrapCodeBlock = (editor: PlateEditor) => { unwrapNodes(editor, { match: { type: getCodeLineType(editor) }, }); unwrapNodes(editor, { - match: { type: getCodeBlockType(editor) }, + match: { type: getPluginType(editor, ELEMENT_CODE_BLOCK) }, split: true, }); };