@uxf/wysiwyg 11.58.1 → 11.60.1

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.
Files changed (15) hide show
  1. package/package.json +4 -4
  2. package/ui/toolbar/buttons/button-toolbar-button.d.ts +2 -2
  3. package/ui/toolbar/buttons/element-toolbar-button.d.ts +2 -2
  4. package/ui/toolbar/buttons/element-toolbar-button.js +1 -1
  5. package/ui/toolbar/buttons/image-toolbar-button.d.ts +2 -2
  6. package/ui/toolbar/buttons/link-toolbar-button.d.ts +2 -2
  7. package/ui/toolbar/buttons/list-toolbar-button.d.ts +2 -2
  8. package/ui/toolbar/buttons/mark-toolbar-button.d.ts +2 -2
  9. package/ui/toolbar/buttons/modal-toolbar-button.d.ts +2 -2
  10. package/ui/toolbar/buttons/toolbar-button.d.ts +2 -2
  11. package/ui/toolbar/buttons/video-toolbar-button.d.ts +2 -2
  12. package/ui/toolbar/toolbar.js +9 -8
  13. package/ui/toolbar/types.d.ts +1 -0
  14. package/wysiwyg-editor.d.ts +1 -0
  15. package/wysiwyg-editor.js +2 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uxf/wysiwyg",
3
- "version": "11.58.1",
3
+ "version": "11.60.1",
4
4
  "description": "UXF Wysiwyg editor",
5
5
  "author": "Robin Dvorak <dvorak@uxf.cz>",
6
6
  "homepage": "https://gitlab.com/uxf-npm/wysiwyg",
@@ -25,9 +25,9 @@
25
25
  "@udecode/plate-reset-node": "20.7.2",
26
26
  "@udecode/plate-select": "20.7.2",
27
27
  "@udecode/plate-trailing-block": "20.7.2",
28
- "@uxf/core": "11.58.0",
29
- "@uxf/core-react": "11.58.1",
30
- "@uxf/ui": "11.58.1",
28
+ "@uxf/core": "11.60.1",
29
+ "@uxf/core-react": "11.60.1",
30
+ "@uxf/ui": "11.60.1",
31
31
  "slate": "0.90.0",
32
32
  "slate-history": "0.86.0",
33
33
  "slate-hyperscript": "0.77.0",
package/ui/toolbar/buttons/button-toolbar-button.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  import { PlateId } from "@udecode/plate-core";
2
+ import { IconName } from "@uxf/ui/icon/types";
2
3
  import { FC } from "react";
3
- import { IconsSet } from "../../../config/icons";
4
4
  interface ButtonToolbarButtonProps {
5
5
  className?: string;
6
- iconName?: IconsSet;
6
+ iconName?: IconName;
7
7
  plateId: PlateId;
8
8
  }
9
9
  export declare const ButtonToolbarButton: FC<ButtonToolbarButtonProps>;
package/ui/toolbar/buttons/element-toolbar-button.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  import { PlateId } from "@udecode/plate-core";
2
+ import { IconName } from "@uxf/ui/icon/types";
2
3
  import { FC } from "react";
3
- import { IconsSet } from "../../../config/icons";
4
4
  interface ElementToolbarButtonProps {
5
5
  className?: string;
6
- icon: IconsSet;
6
+ iconName: IconName;
7
7
  plateId: PlateId;
8
8
  pluginKey: string;
9
9
  tooltipText: string;
package/ui/toolbar/buttons/element-toolbar-button.js CHANGED
@@ -20,6 +20,6 @@ const ElementToolbarButton = (props) => {
20
20
  activeType: type,
21
21
  });
22
22
  };
23
- return (react_1.default.createElement(toolbar_button_1.ToolbarButton, { className: `${CLASS_NAME} ${CLASS_NAME}-element ${(_a = props.className) !== null && _a !== void 0 ? _a : ""}`, editor: editor, iconName: props.icon, isActive: isActive, onMouseDown: onMouseDown, pluginKey: props.pluginKey, tooltipText: props.tooltipText }));
23
+ return (react_1.default.createElement(toolbar_button_1.ToolbarButton, { className: `${CLASS_NAME} ${CLASS_NAME}-element ${(_a = props.className) !== null && _a !== void 0 ? _a : ""}`, editor: editor, iconName: props.iconName, isActive: isActive, onMouseDown: onMouseDown, pluginKey: props.pluginKey, tooltipText: props.tooltipText }));
24
24
  };
25
25
  exports.ElementToolbarButton = ElementToolbarButton;
package/ui/toolbar/buttons/image-toolbar-button.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  import { PlateId } from "@udecode/plate-core";
2
+ import { IconName } from "@uxf/ui/icon/types";
2
3
  import { FC } from "react";
3
- import { IconsSet } from "../../../config/icons";
4
4
  interface ImageToolbarButtonProps {
5
5
  className?: string;
6
- iconName?: IconsSet;
6
+ iconName?: IconName;
7
7
  plateId: PlateId;
8
8
  }
9
9
  export declare const ImageToolbarButton: FC<ImageToolbarButtonProps>;
package/ui/toolbar/buttons/link-toolbar-button.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  import { PlateId } from "@udecode/plate-core";
2
+ import { IconName } from "@uxf/ui/icon/types";
2
3
  import { FC } from "react";
3
- import { IconsSet } from "../../../config/icons";
4
4
  interface LinkToolbarButtonProps {
5
5
  className?: string;
6
- iconName?: IconsSet;
6
+ iconName?: IconName;
7
7
  plateId: PlateId;
8
8
  }
9
9
  export declare const LinkToolbarButton: FC<LinkToolbarButtonProps>;
package/ui/toolbar/buttons/list-toolbar-button.d.ts CHANGED
@@ -1,10 +1,10 @@
1
1
  import { PlateId } from "@udecode/plate-core";
2
+ import { IconName } from "@uxf/ui/icon/types";
2
3
  import { FC } from "react";
3
- import { IconsSet } from "../../../config/icons";
4
4
  import { LIST_ORDERED_TYPE, LIST_UNORDERED_TYPE } from "../../../plugins/list/constants";
5
5
  interface ListToolbarButtonProps {
6
6
  className?: string;
7
- iconName: IconsSet;
7
+ iconName: IconName;
8
8
  plateId: PlateId;
9
9
  pluginKey: typeof LIST_UNORDERED_TYPE | typeof LIST_ORDERED_TYPE;
10
10
  tooltipText: string;
package/ui/toolbar/buttons/mark-toolbar-button.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  import { PlateId } from "@udecode/plate-core";
2
+ import { IconName } from "@uxf/ui/icon/types";
2
3
  import { FC } from "react";
3
- import { IconsSet } from "../../../config/icons";
4
4
  interface LeafToolbarButtonProps {
5
5
  className?: string;
6
- iconName: IconsSet;
6
+ iconName: IconName;
7
7
  iconSize?: number;
8
8
  plateId: PlateId;
9
9
  pluginKey: string;
package/ui/toolbar/buttons/modal-toolbar-button.d.ts CHANGED
@@ -1,10 +1,10 @@
1
1
  import type { DialogPanelWidth } from "@uxf/ui/dialog";
2
+ import { IconName } from "@uxf/ui/icon/types";
2
3
  import { FC, ReactNode } from "react";
3
- import { IconsSet } from "../../../config/icons";
4
4
  import { UxfEditor } from "../../../types";
5
5
  interface ModalToolbarButtonProps {
6
6
  className?: string;
7
- iconName: IconsSet;
7
+ iconName: IconName;
8
8
  modalWidth?: DialogPanelWidth;
9
9
  Modal: ReactNode;
10
10
  editor: UxfEditor;
package/ui/toolbar/buttons/toolbar-button.d.ts CHANGED
@@ -1,5 +1,5 @@
1
+ import { IconName } from "@uxf/ui/icon/types";
1
2
  import { FC, MouseEventHandler } from "react";
2
- import { IconsSet } from "../../../config/icons";
3
3
  import { UxfEditor } from "../../../types";
4
4
  interface ToolbarButtonProps {
5
5
  className?: string;
@@ -7,7 +7,7 @@ interface ToolbarButtonProps {
7
7
  isActive: boolean;
8
8
  pluginKey: string;
9
9
  onMouseDown: MouseEventHandler<HTMLAnchorElement>;
10
- iconName: IconsSet;
10
+ iconName: IconName;
11
11
  iconSize?: number;
12
12
  tooltipText: string;
13
13
  }
package/ui/toolbar/buttons/video-toolbar-button.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  import { PlateId } from "@udecode/plate-core";
2
+ import { IconName } from "@uxf/ui/icon/types";
2
3
  import { FC } from "react";
3
- import { IconsSet } from "../../../config/icons";
4
4
  interface EmbedMediaToolbarButtonProps {
5
5
  className?: string;
6
- iconName?: IconsSet;
6
+ iconName?: IconName;
7
7
  plateId: PlateId;
8
8
  }
9
9
  export declare const VideoToolbarButton: FC<EmbedMediaToolbarButtonProps>;
package/ui/toolbar/toolbar.js CHANGED
@@ -34,19 +34,19 @@ const BUTTON_GROUP_CLASS_NAME = `${CLASS_NAME}-button-group`;
34
34
  const Toolbar = (props) => {
35
35
  var _a;
36
36
  // eslint-disable-next-line react/destructuring-assignment
37
- const { leftElement, plateId, rightElement, ...restProps } = props;
37
+ const { customPluginsButtons, leftElement, plateId, rightElement, ...restProps } = props;
38
38
  const editor = (0, hooks_1.useUxfPlateEditorState)(props.plateId);
39
39
  const t = (0, context_1.useTranslation)();
40
40
  return (react_1.default.createElement("div", { ...restProps, className: `${CLASS_NAME} ${(_a = props.className) !== null && _a !== void 0 ? _a : ""}` },
41
41
  leftElement,
42
42
  react_1.default.createElement("div", { className: `${CLASS_NAME}-buttons` },
43
43
  (0, utils_1.isSomeOfPluginsEnabled)(editor, constants_1.KEYS_HEADING) && (react_1.default.createElement(button_group_1.ButtonGroup, { className: `${BUTTON_GROUP_CLASS_NAME} ${BUTTON_GROUP_CLASS_NAME}-headings` },
44
- react_1.default.createElement(element_toolbar_button_1.ElementToolbarButton, { icon: "h1", plateId: plateId, pluginKey: constants_1.ELEMENT_H1, tooltipText: t("wysiwyg:plugins.h1.tooltip") }),
45
- react_1.default.createElement(element_toolbar_button_1.ElementToolbarButton, { icon: "h2", plateId: plateId, pluginKey: constants_1.ELEMENT_H2, tooltipText: t("wysiwyg:plugins.h2.tooltip") }),
46
- react_1.default.createElement(element_toolbar_button_1.ElementToolbarButton, { icon: "h3", plateId: plateId, pluginKey: constants_1.ELEMENT_H3, tooltipText: t("wysiwyg:plugins.h3.tooltip") }),
47
- react_1.default.createElement(element_toolbar_button_1.ElementToolbarButton, { icon: "h4", plateId: plateId, pluginKey: constants_1.ELEMENT_H4, tooltipText: t("wysiwyg:plugins.h4.tooltip") }),
48
- react_1.default.createElement(element_toolbar_button_1.ElementToolbarButton, { icon: "h5", plateId: plateId, pluginKey: constants_1.ELEMENT_H5, tooltipText: t("wysiwyg:plugins.h5.tooltip") }),
49
- react_1.default.createElement(element_toolbar_button_1.ElementToolbarButton, { icon: "h6", plateId: plateId, pluginKey: constants_1.ELEMENT_H6, tooltipText: t("wysiwyg:plugins.h6.tooltip") }))),
44
+ react_1.default.createElement(element_toolbar_button_1.ElementToolbarButton, { iconName: "h1", plateId: plateId, pluginKey: constants_1.ELEMENT_H1, tooltipText: t("wysiwyg:plugins.h1.tooltip") }),
45
+ react_1.default.createElement(element_toolbar_button_1.ElementToolbarButton, { iconName: "h2", plateId: plateId, pluginKey: constants_1.ELEMENT_H2, tooltipText: t("wysiwyg:plugins.h2.tooltip") }),
46
+ react_1.default.createElement(element_toolbar_button_1.ElementToolbarButton, { iconName: "h3", plateId: plateId, pluginKey: constants_1.ELEMENT_H3, tooltipText: t("wysiwyg:plugins.h3.tooltip") }),
47
+ react_1.default.createElement(element_toolbar_button_1.ElementToolbarButton, { iconName: "h4", plateId: plateId, pluginKey: constants_1.ELEMENT_H4, tooltipText: t("wysiwyg:plugins.h4.tooltip") }),
48
+ react_1.default.createElement(element_toolbar_button_1.ElementToolbarButton, { iconName: "h5", plateId: plateId, pluginKey: constants_1.ELEMENT_H5, tooltipText: t("wysiwyg:plugins.h5.tooltip") }),
49
+ react_1.default.createElement(element_toolbar_button_1.ElementToolbarButton, { iconName: "h6", plateId: plateId, pluginKey: constants_1.ELEMENT_H6, tooltipText: t("wysiwyg:plugins.h6.tooltip") }))),
50
50
  (0, utils_1.isSomeOfPluginsEnabled)(editor, [
51
51
  types_4.BOLD_PLUGIN_KEY,
52
52
  types_6.ITALIC_PLUGIN_KEY,
@@ -60,7 +60,7 @@ const Toolbar = (props) => {
60
60
  react_1.default.createElement(mark_toolbar_button_1.MarkToolbarButton, { iconName: "code-simple", plateId: plateId, pluginKey: types_5.CODE_PLUGIN_KEY, tooltipText: t("wysiwyg:plugins.code.tooltip") }),
61
61
  react_1.default.createElement(mark_toolbar_button_1.MarkToolbarButton, { iconName: "highlighter-line", iconSize: 19, plateId: plateId, pluginKey: types_2.HIGHLIGHT_PLUGIN_KEY, tooltipText: t("wysiwyg:plugins.highlight.tooltip") }))),
62
62
  (0, utils_1.isSomeOfPluginsEnabled)(editor, [types_1.BLOCKQUOTE_PLUGIN_KEY]) && (react_1.default.createElement(button_group_1.ButtonGroup, { className: `${BUTTON_GROUP_CLASS_NAME} ${BUTTON_GROUP_CLASS_NAME}-blocks` },
63
- react_1.default.createElement(element_toolbar_button_1.ElementToolbarButton, { icon: "block-quote", plateId: plateId, pluginKey: types_1.BLOCKQUOTE_PLUGIN_KEY, tooltipText: t("wysiwyg:plugins.quote.tooltip") }))),
63
+ react_1.default.createElement(element_toolbar_button_1.ElementToolbarButton, { iconName: "block-quote", plateId: plateId, pluginKey: types_1.BLOCKQUOTE_PLUGIN_KEY, tooltipText: t("wysiwyg:plugins.quote.tooltip") }))),
64
64
  (0, utils_1.isSomeOfPluginsEnabled)(editor, [constants_3.LIST_UNORDERED_TYPE, constants_3.LIST_ORDERED_TYPE]) && (react_1.default.createElement(button_group_1.ButtonGroup, { className: `${BUTTON_GROUP_CLASS_NAME} ${BUTTON_GROUP_CLASS_NAME}-lists` },
65
65
  react_1.default.createElement(list_toolbar_button_1.ListToolbarButton, { iconName: "ul", plateId: plateId, pluginKey: constants_3.LIST_UNORDERED_TYPE, tooltipText: t("wysiwyg:plugins.ul.tooltip") }),
66
66
  react_1.default.createElement(list_toolbar_button_1.ListToolbarButton, { iconName: "ol", plateId: plateId, pluginKey: constants_3.LIST_ORDERED_TYPE, tooltipText: t("wysiwyg:plugins.ol.tooltip") }))),
@@ -70,6 +70,7 @@ const Toolbar = (props) => {
70
70
  (0, utils_1.isSomeOfPluginsEnabled)(editor, [types_3.IMAGE_PLUGIN_KEY, create_video_plugin_1.ELEMENT_VIDEO_EMBED]) && (react_1.default.createElement(button_group_1.ButtonGroup, { className: `${BUTTON_GROUP_CLASS_NAME} ${BUTTON_GROUP_CLASS_NAME}-media` },
71
71
  react_1.default.createElement(image_toolbar_button_1.ImageToolbarButton, { plateId: plateId }),
72
72
  react_1.default.createElement(video_toolbar_button_1.VideoToolbarButton, { plateId: plateId }))),
73
+ customPluginsButtons,
73
74
  react_1.default.createElement(undo_redo_button_group_1.UndoRedoButtonGroup, { plateId: plateId })),
74
75
  rightElement));
75
76
  };
package/ui/toolbar/types.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import { PlateId } from "@udecode/plate-core";
2
2
  import { HTMLAttributes, ReactNode } from "react";
3
3
  export interface ToolbarProps extends HTMLAttributes<HTMLDivElement> {
4
+ customPluginsButtons?: ReactNode;
4
5
  leftElement?: ReactNode;
5
6
  plateId: PlateId;
6
7
  rightElement?: ReactNode;
package/wysiwyg-editor.d.ts CHANGED
@@ -4,6 +4,7 @@ import { TranslationFunction } from "./translations/translations";
4
4
  import { UxfPlatePlugin, WysiwygContent } from "./types";
5
5
  export interface WysiwygEditorProps {
6
6
  className?: string;
7
+ customPluginsToolbarButtons?: ReactNode;
7
8
  editableProps?: TEditableProps<WysiwygContent>;
8
9
  id: string;
9
10
  initialValue: WysiwygContent | undefined;
package/wysiwyg-editor.js CHANGED
@@ -18,7 +18,7 @@ const Editor = (props) => {
18
18
  var _a, _b;
19
19
  const t = (0, context_1.useTranslation)();
20
20
  return (react_1.default.createElement(react_1.default.Fragment, null,
21
- react_1.default.createElement(toolbar_1.Toolbar, { leftElement: props.toolbarLeftElement, plateId: props.plateId, rightElement: props.toolbarRightElement }),
21
+ react_1.default.createElement(toolbar_1.Toolbar, { customPluginsButtons: props.customPluginsToolbarButtons, leftElement: props.toolbarLeftElement, plateId: props.plateId, rightElement: props.toolbarRightElement }),
22
22
  react_1.default.createElement("div", { className: `${CLASS_NAME}__content` },
23
23
  react_1.default.createElement(plate_core_1.Plate, { editableProps: {
24
24
  autoFocus: false,
@@ -39,6 +39,6 @@ const WysiwygEditor = (props) => {
39
39
  return (react_1.default.createElement("div", { className: `${CLASS_NAME} ${(_b = props.className) !== null && _b !== void 0 ? _b : ""}` },
40
40
  react_1.default.createElement(context_1.TranslationContextProvider, { value: (_c = props.t) !== null && _c !== void 0 ? _c : translations_1.defaultTranslationFunction },
41
41
  react_1.default.createElement(plate_core_1.PlateProvider, { id: props.id, initialValue: props.initialValue, onChange: props.onChange, plugins: props.plugins },
42
- react_1.default.createElement(Editor, { editableProps: props.editableProps, plateId: props.id, toolbarLeftElement: props.toolbarLeftElement, toolbarRightElement: props.toolbarRightElement })))));
42
+ react_1.default.createElement(Editor, { customPluginsToolbarButtons: props.customPluginsToolbarButtons, editableProps: props.editableProps, plateId: props.id, toolbarLeftElement: props.toolbarLeftElement, toolbarRightElement: props.toolbarRightElement })))));
43
43
  };
44
44
  exports.WysiwygEditor = WysiwygEditor;