@squiz/formatted-text-editor 1.21.1-alpha.3 → 1.21.1-alpha.30

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 (168) hide show
  1. package/demo/App.tsx +45 -10
  2. package/demo/index.scss +11 -10
  3. package/jest.config.ts +0 -2
  4. package/lib/Editor/Editor.d.ts +1 -0
  5. package/lib/Editor/Editor.js +45 -7
  6. package/lib/Editor/EditorContext.d.ts +10 -0
  7. package/lib/Editor/EditorContext.js +15 -0
  8. package/lib/EditorToolbar/FloatingToolbar.d.ts +1 -0
  9. package/lib/EditorToolbar/FloatingToolbar.js +11 -5
  10. package/lib/EditorToolbar/Toolbar.d.ts +1 -0
  11. package/lib/EditorToolbar/Toolbar.js +3 -1
  12. package/lib/EditorToolbar/Tools/Bold/BoldButton.d.ts +1 -0
  13. package/lib/EditorToolbar/Tools/Bold/BoldButton.js +2 -2
  14. package/lib/EditorToolbar/Tools/Image/Form/ImageForm.d.ts +17 -0
  15. package/lib/EditorToolbar/Tools/Image/Form/ImageForm.js +82 -0
  16. package/lib/EditorToolbar/Tools/Image/ImageButton.d.ts +6 -0
  17. package/lib/EditorToolbar/Tools/Image/ImageButton.js +77 -0
  18. package/lib/EditorToolbar/Tools/Image/ImageModal.d.ts +9 -0
  19. package/lib/EditorToolbar/Tools/Image/ImageModal.js +16 -0
  20. package/lib/EditorToolbar/Tools/Italic/ItalicButton.d.ts +1 -0
  21. package/lib/EditorToolbar/Tools/Italic/ItalicButton.js +2 -2
  22. package/lib/EditorToolbar/Tools/Link/Form/LinkForm.d.ts +14 -5
  23. package/lib/EditorToolbar/Tools/Link/Form/LinkForm.js +67 -15
  24. package/lib/EditorToolbar/Tools/Link/LinkButton.d.ts +1 -0
  25. package/lib/EditorToolbar/Tools/Link/LinkButton.js +22 -14
  26. package/lib/EditorToolbar/Tools/Link/LinkModal.d.ts +1 -0
  27. package/lib/EditorToolbar/Tools/Link/LinkModal.js +12 -5
  28. package/lib/EditorToolbar/Tools/Link/RemoveLinkButton.d.ts +1 -0
  29. package/lib/EditorToolbar/Tools/Link/RemoveLinkButton.js +2 -9
  30. package/lib/EditorToolbar/Tools/Redo/RedoButton.d.ts +1 -0
  31. package/lib/EditorToolbar/Tools/Redo/RedoButton.js +2 -2
  32. package/lib/EditorToolbar/Tools/TextAlign/CenterAlign/CenterAlignButton.d.ts +1 -0
  33. package/lib/EditorToolbar/Tools/TextAlign/CenterAlign/CenterAlignButton.js +2 -2
  34. package/lib/EditorToolbar/Tools/TextAlign/JustifyAlign/JustifyAlignButton.d.ts +1 -0
  35. package/lib/EditorToolbar/Tools/TextAlign/JustifyAlign/JustifyAlignButton.js +2 -2
  36. package/lib/EditorToolbar/Tools/TextAlign/LeftAlign/LeftAlignButton.d.ts +1 -0
  37. package/lib/EditorToolbar/Tools/TextAlign/LeftAlign/LeftAlignButton.js +2 -2
  38. package/lib/EditorToolbar/Tools/TextAlign/RightAlign/RightAlignButton.d.ts +1 -0
  39. package/lib/EditorToolbar/Tools/TextAlign/RightAlign/RightAlignButton.js +2 -2
  40. package/lib/EditorToolbar/Tools/TextAlign/TextAlignButtons.d.ts +1 -0
  41. package/lib/EditorToolbar/Tools/TextType/Heading/HeadingButton.d.ts +1 -0
  42. package/lib/EditorToolbar/Tools/TextType/Paragraph/ParagraphButton.d.ts +1 -0
  43. package/lib/EditorToolbar/Tools/TextType/Preformatted/PreformattedButton.d.ts +1 -0
  44. package/lib/EditorToolbar/Tools/TextType/TextTypeDropdown.d.ts +1 -0
  45. package/lib/EditorToolbar/Tools/Underline/UnderlineButton.d.ts +1 -0
  46. package/lib/EditorToolbar/Tools/Underline/UnderlineButton.js +2 -2
  47. package/lib/EditorToolbar/Tools/Undo/UndoButton.d.ts +1 -0
  48. package/lib/EditorToolbar/Tools/Undo/UndoButton.js +2 -2
  49. package/lib/Extensions/CommandsExtension/CommandsExtension.d.ts +20 -0
  50. package/lib/Extensions/CommandsExtension/CommandsExtension.js +52 -0
  51. package/lib/Extensions/Extensions.d.ts +7 -4
  52. package/lib/Extensions/Extensions.js +32 -19
  53. package/lib/Extensions/ImageExtension/ImageExtension.d.ts +10 -0
  54. package/lib/Extensions/ImageExtension/ImageExtension.js +92 -0
  55. package/lib/Extensions/LinkExtension/AssetLinkExtension.d.ts +26 -0
  56. package/lib/Extensions/LinkExtension/AssetLinkExtension.js +102 -0
  57. package/lib/Extensions/LinkExtension/LinkExtension.d.ts +21 -12
  58. package/lib/Extensions/LinkExtension/LinkExtension.js +63 -65
  59. package/lib/Extensions/LinkExtension/common.d.ts +7 -0
  60. package/lib/Extensions/LinkExtension/common.js +14 -0
  61. package/lib/Extensions/PreformattedExtension/PreformattedExtension.d.ts +1 -1
  62. package/lib/hooks/index.d.ts +1 -0
  63. package/lib/hooks/index.js +1 -0
  64. package/lib/hooks/useExpandedSelection.d.ts +23 -0
  65. package/lib/hooks/useExpandedSelection.js +37 -0
  66. package/lib/index.css +159 -74
  67. package/lib/index.d.ts +5 -2
  68. package/lib/index.js +9 -3
  69. package/lib/types.d.ts +3 -0
  70. package/lib/types.js +2 -0
  71. package/lib/ui/Button/Button.d.ts +11 -0
  72. package/lib/ui/{ToolbarButton/ToolbarButton.js → Button/Button.js} +6 -3
  73. package/lib/ui/Fields/Input/Input.d.ts +5 -0
  74. package/lib/ui/{Inputs/Text/TextInput.js → Fields/Input/Input.js} +10 -5
  75. package/lib/ui/{Inputs → Fields}/Select/Select.d.ts +1 -0
  76. package/lib/ui/Modal/Modal.js +5 -3
  77. package/lib/ui/ToolbarDropdown/ToolbarDropdown.d.ts +1 -0
  78. package/lib/ui/ToolbarDropdownButton/ToolbarDropdownButton.d.ts +1 -0
  79. package/lib/utils/converters/remirrorNodeToSquizNode/remirrorNodeToSquizNode.d.ts +9 -0
  80. package/lib/utils/converters/remirrorNodeToSquizNode/remirrorNodeToSquizNode.js +165 -0
  81. package/lib/utils/converters/squizNodeToRemirrorNode/squizNodeToRemirrorNode.d.ts +9 -0
  82. package/lib/utils/converters/squizNodeToRemirrorNode/squizNodeToRemirrorNode.js +129 -0
  83. package/lib/utils/undefinedIfEmpty.d.ts +1 -0
  84. package/lib/utils/undefinedIfEmpty.js +7 -0
  85. package/package.json +11 -4
  86. package/src/Editor/Editor.spec.tsx +78 -18
  87. package/src/Editor/Editor.tsx +28 -9
  88. package/src/Editor/EditorContext.spec.tsx +26 -0
  89. package/src/Editor/EditorContext.ts +19 -0
  90. package/src/Editor/_editor.scss +20 -51
  91. package/src/EditorToolbar/FloatingToolbar.spec.tsx +2 -3
  92. package/src/EditorToolbar/FloatingToolbar.tsx +15 -6
  93. package/src/EditorToolbar/Toolbar.tsx +2 -0
  94. package/src/EditorToolbar/Tools/Bold/BoldButton.spec.tsx +1 -1
  95. package/src/EditorToolbar/Tools/Bold/BoldButton.tsx +2 -2
  96. package/src/EditorToolbar/Tools/Image/Form/ImageForm.spec.tsx +77 -0
  97. package/src/EditorToolbar/Tools/Image/Form/ImageForm.tsx +90 -0
  98. package/src/EditorToolbar/Tools/Image/ImageButton.spec.tsx +135 -0
  99. package/src/EditorToolbar/Tools/Image/ImageButton.tsx +72 -0
  100. package/src/EditorToolbar/Tools/Image/ImageModal.spec.tsx +83 -0
  101. package/src/EditorToolbar/Tools/Image/ImageModal.tsx +24 -0
  102. package/src/EditorToolbar/Tools/Italic/ItalicButton.spec.tsx +1 -1
  103. package/src/EditorToolbar/Tools/Italic/ItalicButton.tsx +2 -2
  104. package/src/EditorToolbar/Tools/Link/Form/LinkForm.spec.tsx +37 -9
  105. package/src/EditorToolbar/Tools/Link/Form/LinkForm.tsx +97 -27
  106. package/src/EditorToolbar/Tools/Link/LinkButton.spec.tsx +104 -26
  107. package/src/EditorToolbar/Tools/Link/LinkButton.tsx +30 -21
  108. package/src/EditorToolbar/Tools/Link/LinkModal.tsx +13 -6
  109. package/src/EditorToolbar/Tools/Link/RemoveLinkButton.spec.tsx +26 -26
  110. package/src/EditorToolbar/Tools/Link/RemoveLinkButton.tsx +4 -12
  111. package/src/EditorToolbar/Tools/Redo/RedoButton.tsx +2 -2
  112. package/src/EditorToolbar/Tools/TextAlign/CenterAlign/CenterAlignButton.tsx +2 -2
  113. package/src/EditorToolbar/Tools/TextAlign/JustifyAlign/JustifyAlignButton.tsx +2 -2
  114. package/src/EditorToolbar/Tools/TextAlign/LeftAlign/LeftAlignButton.tsx +2 -2
  115. package/src/EditorToolbar/Tools/TextAlign/RightAlign/RightAlignButton.tsx +2 -2
  116. package/src/EditorToolbar/Tools/Underline/Underline.spec.tsx +1 -1
  117. package/src/EditorToolbar/Tools/Underline/UnderlineButton.tsx +2 -2
  118. package/src/EditorToolbar/Tools/Undo/UndoButton.spec.tsx +22 -1
  119. package/src/EditorToolbar/Tools/Undo/UndoButton.tsx +2 -2
  120. package/src/EditorToolbar/_floating-toolbar.scss +5 -0
  121. package/src/EditorToolbar/_toolbar.scss +11 -5
  122. package/src/Extensions/CommandsExtension/CommandsExtension.ts +54 -0
  123. package/src/Extensions/Extensions.ts +32 -17
  124. package/src/Extensions/ImageExtension/ImageExtension.ts +112 -0
  125. package/src/Extensions/LinkExtension/AssetLinkExtension.spec.ts +104 -0
  126. package/src/Extensions/LinkExtension/AssetLinkExtension.ts +128 -0
  127. package/src/Extensions/LinkExtension/LinkExtension.spec.ts +68 -0
  128. package/src/Extensions/LinkExtension/LinkExtension.ts +88 -82
  129. package/src/Extensions/LinkExtension/common.ts +10 -0
  130. package/src/hooks/index.ts +1 -0
  131. package/src/hooks/useExpandedSelection.ts +44 -0
  132. package/src/index.scss +2 -2
  133. package/src/index.ts +5 -2
  134. package/src/types.ts +5 -0
  135. package/src/ui/Button/Button.spec.tsx +44 -0
  136. package/src/ui/Button/Button.tsx +29 -0
  137. package/src/ui/{_buttons.scss → Button/_button.scss} +19 -1
  138. package/src/ui/{Inputs/Text/TextInput.spec.tsx → Fields/Input/Input.spec.tsx} +8 -8
  139. package/src/ui/Fields/Input/Input.tsx +34 -0
  140. package/src/ui/Modal/Modal.spec.tsx +15 -0
  141. package/src/ui/Modal/Modal.tsx +8 -4
  142. package/src/ui/ToolbarDropdown/_toolbar-dropdown.scss +1 -1
  143. package/src/ui/_forms.scss +14 -0
  144. package/src/ui/_typography.scss +46 -0
  145. package/src/utils/converters/mocks/squizNodeJson.mock.ts +252 -0
  146. package/src/utils/converters/remirrorNodeToSquizNode/remirrorNodeToSquizNode.spec.ts +480 -0
  147. package/src/utils/converters/remirrorNodeToSquizNode/remirrorNodeToSquizNode.ts +202 -0
  148. package/src/utils/converters/squizNodeToRemirrorNode/squizNodeToRemirrorNode.spec.ts +329 -0
  149. package/src/utils/converters/squizNodeToRemirrorNode/squizNodeToRemirrorNode.ts +151 -0
  150. package/src/utils/undefinedIfEmpty.spec.ts +12 -0
  151. package/src/utils/undefinedIfEmpty.ts +3 -0
  152. package/tailwind.config.cjs +3 -0
  153. package/tests/renderWithEditor.tsx +28 -15
  154. package/tsconfig.json +1 -1
  155. package/lib/FormattedTextEditor.d.ts +0 -2
  156. package/lib/FormattedTextEditor.js +0 -7
  157. package/lib/ui/Inputs/Text/TextInput.d.ts +0 -4
  158. package/lib/ui/ToolbarButton/ToolbarButton.d.ts +0 -10
  159. package/src/Editor/Editor.mock.tsx +0 -43
  160. package/src/FormattedTextEditor.spec.tsx +0 -10
  161. package/src/FormattedTextEditor.tsx +0 -3
  162. package/src/ui/Inputs/Text/TextInput.tsx +0 -20
  163. package/src/ui/ToolbarButton/ToolbarButton.tsx +0 -26
  164. package/src/ui/ToolbarButton/_toolbar-button.scss +0 -17
  165. /package/lib/ui/{Inputs → Fields}/Select/Select.js +0 -0
  166. /package/src/ui/{Inputs → Fields}/Select/Select.spec.tsx +0 -0
  167. /package/src/ui/{Inputs → Fields}/Select/Select.tsx +0 -0
  168. /package/tests/{select.tsx → select.ts} +0 -0
@@ -1,3 +0,0 @@
1
- import Editor from './Editor/Editor';
2
-
3
- export default Editor;
@@ -1,20 +0,0 @@
1
- import React, { ForwardedRef, forwardRef, InputHTMLAttributes } from 'react';
2
-
3
- type TextInputProps = InputHTMLAttributes<HTMLInputElement> & {
4
- label?: string;
5
- };
6
-
7
- const TextInputInternal = ({ name, label, ...rest }: TextInputProps, ref: ForwardedRef<HTMLInputElement>) => {
8
- return (
9
- <>
10
- {label && (
11
- <label htmlFor={name} className="squiz-fte-form-label">
12
- {label}
13
- </label>
14
- )}
15
- <input ref={ref} id={name} name={name} type="text" className="squiz-fte-form-control" {...rest} />
16
- </>
17
- );
18
- };
19
-
20
- export const TextInput = forwardRef(TextInputInternal);
@@ -1,26 +0,0 @@
1
- import React, { ReactElement } from 'react';
2
-
3
- type ToolbarButtonProps = {
4
- handleOnClick: () => void;
5
- isDisabled?: boolean;
6
- isActive: boolean;
7
- icon: ReactElement;
8
- label: string;
9
- };
10
-
11
- const ToolbarButton = ({ handleOnClick, isDisabled, isActive, icon, label }: ToolbarButtonProps) => {
12
- return (
13
- <button
14
- aria-label={label}
15
- title={label}
16
- type="button"
17
- onClick={handleOnClick}
18
- disabled={isDisabled}
19
- className={`squiz-fte-btn toolbar-button ${isActive ? 'is-active' : ''}`}
20
- >
21
- {icon}
22
- </button>
23
- );
24
- };
25
-
26
- export default ToolbarButton;
@@ -1,17 +0,0 @@
1
- .toolbar-button {
2
- @apply bg-white text-gray-600 p-1;
3
-
4
- ~ .toolbar-button {
5
- margin-left: 2px;
6
- }
7
-
8
- &:hover,
9
- &:focus {
10
- background-color: rgba(black, 0.04);
11
- }
12
-
13
- &.is-active,
14
- &:active {
15
- @apply text-blue-300 bg-blue-100;
16
- }
17
- }
File without changes
File without changes
File without changes