suneditor 3.0.0-beta.2 → 3.0.0-beta.20

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 (177) hide show
  1. package/CONTRIBUTING.md +186 -184
  2. package/LICENSE +21 -21
  3. package/README.md +157 -180
  4. package/dist/suneditor.min.css +1 -1
  5. package/dist/suneditor.min.js +1 -1
  6. package/package.json +126 -123
  7. package/src/assets/design/color.css +131 -121
  8. package/src/assets/design/index.css +3 -3
  9. package/src/assets/design/size.css +37 -35
  10. package/src/assets/design/typography.css +37 -37
  11. package/src/assets/icons/defaultIcons.js +247 -232
  12. package/src/assets/suneditor-contents.css +779 -778
  13. package/src/assets/suneditor.css +43 -35
  14. package/src/core/base/eventHandlers/handler_toolbar.js +135 -135
  15. package/src/core/base/eventHandlers/handler_ww_clipboard.js +56 -56
  16. package/src/core/base/eventHandlers/handler_ww_dragDrop.js +115 -113
  17. package/src/core/base/eventHandlers/handler_ww_key_input.js +1200 -1200
  18. package/src/core/base/eventHandlers/handler_ww_mouse.js +194 -194
  19. package/src/core/base/eventManager.js +1550 -1484
  20. package/src/core/base/history.js +355 -355
  21. package/src/core/class/char.js +163 -162
  22. package/src/core/class/component.js +856 -842
  23. package/src/core/class/format.js +3433 -3422
  24. package/src/core/class/html.js +1927 -1890
  25. package/src/core/class/menu.js +357 -346
  26. package/src/core/class/nodeTransform.js +424 -424
  27. package/src/core/class/offset.js +858 -891
  28. package/src/core/class/selection.js +710 -620
  29. package/src/core/class/shortcuts.js +98 -98
  30. package/src/core/class/toolbar.js +438 -430
  31. package/src/core/class/ui.js +424 -422
  32. package/src/core/class/viewer.js +750 -750
  33. package/src/core/editor.js +1810 -1708
  34. package/src/core/section/actives.js +268 -241
  35. package/src/core/section/constructor.js +1348 -1661
  36. package/src/core/section/context.js +102 -102
  37. package/src/core/section/documentType.js +582 -561
  38. package/src/core/section/options.js +367 -0
  39. package/src/core/util/instanceCheck.js +59 -0
  40. package/src/editorInjector/_classes.js +36 -36
  41. package/src/editorInjector/_core.js +92 -92
  42. package/src/editorInjector/index.js +75 -75
  43. package/src/events.js +634 -622
  44. package/src/helper/clipboard.js +59 -59
  45. package/src/helper/converter.js +586 -564
  46. package/src/helper/dom/domCheck.js +304 -304
  47. package/src/helper/dom/domQuery.js +677 -669
  48. package/src/helper/dom/domUtils.js +618 -557
  49. package/src/helper/dom/index.js +12 -12
  50. package/src/helper/env.js +249 -240
  51. package/src/helper/index.js +25 -25
  52. package/src/helper/keyCodeMap.js +183 -183
  53. package/src/helper/numbers.js +72 -72
  54. package/src/helper/unicode.js +47 -47
  55. package/src/langs/ckb.js +231 -231
  56. package/src/langs/cs.js +231 -231
  57. package/src/langs/da.js +231 -231
  58. package/src/langs/de.js +231 -231
  59. package/src/langs/en.js +230 -230
  60. package/src/langs/es.js +231 -231
  61. package/src/langs/fa.js +231 -231
  62. package/src/langs/fr.js +231 -231
  63. package/src/langs/he.js +231 -231
  64. package/src/langs/hu.js +230 -230
  65. package/src/langs/index.js +28 -28
  66. package/src/langs/it.js +231 -231
  67. package/src/langs/ja.js +230 -230
  68. package/src/langs/km.js +230 -230
  69. package/src/langs/ko.js +230 -230
  70. package/src/langs/lv.js +231 -231
  71. package/src/langs/nl.js +231 -231
  72. package/src/langs/pl.js +231 -231
  73. package/src/langs/pt_br.js +231 -231
  74. package/src/langs/ro.js +231 -231
  75. package/src/langs/ru.js +231 -231
  76. package/src/langs/se.js +231 -231
  77. package/src/langs/tr.js +231 -231
  78. package/src/langs/uk.js +231 -231
  79. package/src/langs/ur.js +231 -231
  80. package/src/langs/zh_cn.js +231 -231
  81. package/src/modules/ApiManager.js +191 -191
  82. package/src/modules/Browser.js +669 -667
  83. package/src/modules/ColorPicker.js +364 -362
  84. package/src/modules/Controller.js +474 -454
  85. package/src/modules/Figure.js +1620 -1617
  86. package/src/modules/FileManager.js +359 -359
  87. package/src/modules/HueSlider.js +577 -565
  88. package/src/modules/Modal.js +346 -346
  89. package/src/modules/ModalAnchorEditor.js +643 -643
  90. package/src/modules/SelectMenu.js +549 -549
  91. package/src/modules/_DragHandle.js +17 -17
  92. package/src/modules/index.js +14 -14
  93. package/src/plugins/browser/audioGallery.js +83 -83
  94. package/src/plugins/browser/fileBrowser.js +103 -103
  95. package/src/plugins/browser/fileGallery.js +83 -83
  96. package/src/plugins/browser/imageGallery.js +81 -81
  97. package/src/plugins/browser/videoGallery.js +103 -103
  98. package/src/plugins/command/blockquote.js +61 -60
  99. package/src/plugins/command/exportPDF.js +134 -134
  100. package/src/plugins/command/fileUpload.js +456 -456
  101. package/src/plugins/command/list_bulleted.js +149 -148
  102. package/src/plugins/command/list_numbered.js +152 -151
  103. package/src/plugins/dropdown/align.js +157 -155
  104. package/src/plugins/dropdown/backgroundColor.js +108 -104
  105. package/src/plugins/dropdown/font.js +141 -137
  106. package/src/plugins/dropdown/fontColor.js +109 -105
  107. package/src/plugins/dropdown/formatBlock.js +170 -178
  108. package/src/plugins/dropdown/hr.js +152 -152
  109. package/src/plugins/dropdown/layout.js +83 -83
  110. package/src/plugins/dropdown/lineHeight.js +131 -130
  111. package/src/plugins/dropdown/list.js +123 -122
  112. package/src/plugins/dropdown/paragraphStyle.js +138 -138
  113. package/src/plugins/dropdown/table.js +4110 -4000
  114. package/src/plugins/dropdown/template.js +83 -83
  115. package/src/plugins/dropdown/textStyle.js +149 -149
  116. package/src/plugins/field/mention.js +242 -242
  117. package/src/plugins/index.js +120 -120
  118. package/src/plugins/input/fontSize.js +414 -410
  119. package/src/plugins/input/pageNavigator.js +71 -70
  120. package/src/plugins/modal/audio.js +677 -677
  121. package/src/plugins/modal/drawing.js +537 -531
  122. package/src/plugins/modal/embed.js +886 -886
  123. package/src/plugins/modal/image.js +1377 -1376
  124. package/src/plugins/modal/link.js +248 -240
  125. package/src/plugins/modal/math.js +563 -563
  126. package/src/plugins/modal/video.js +1226 -1226
  127. package/src/plugins/popup/anchor.js +224 -222
  128. package/src/suneditor.js +114 -107
  129. package/src/themes/dark.css +132 -122
  130. package/src/typedef.js +132 -130
  131. package/types/assets/icons/defaultIcons.d.ts +8 -0
  132. package/types/core/base/eventManager.d.ts +29 -4
  133. package/types/core/class/char.d.ts +2 -1
  134. package/types/core/class/component.d.ts +1 -2
  135. package/types/core/class/format.d.ts +8 -1
  136. package/types/core/class/html.d.ts +8 -0
  137. package/types/core/class/menu.d.ts +8 -0
  138. package/types/core/class/offset.d.ts +24 -26
  139. package/types/core/class/selection.d.ts +2 -0
  140. package/types/core/class/toolbar.d.ts +6 -0
  141. package/types/core/class/ui.d.ts +1 -1
  142. package/types/core/editor.d.ts +34 -12
  143. package/types/core/section/constructor.d.ts +5 -638
  144. package/types/core/section/documentType.d.ts +12 -2
  145. package/types/core/section/options.d.ts +740 -0
  146. package/types/core/util/instanceCheck.d.ts +50 -0
  147. package/types/editorInjector/_core.d.ts +5 -5
  148. package/types/editorInjector/index.d.ts +2 -2
  149. package/types/events.d.ts +2 -0
  150. package/types/helper/converter.d.ts +9 -0
  151. package/types/helper/dom/domQuery.d.ts +5 -5
  152. package/types/helper/dom/domUtils.d.ts +8 -0
  153. package/types/helper/env.d.ts +6 -1
  154. package/types/helper/index.d.ts +4 -1
  155. package/types/index.d.ts +122 -120
  156. package/types/langs/_Lang.d.ts +194 -194
  157. package/types/modules/ColorPicker.d.ts +5 -1
  158. package/types/modules/Controller.d.ts +8 -4
  159. package/types/modules/Figure.d.ts +2 -1
  160. package/types/modules/HueSlider.d.ts +4 -1
  161. package/types/modules/SelectMenu.d.ts +1 -1
  162. package/types/plugins/command/blockquote.d.ts +1 -0
  163. package/types/plugins/command/list_bulleted.d.ts +1 -0
  164. package/types/plugins/command/list_numbered.d.ts +1 -0
  165. package/types/plugins/dropdown/align.d.ts +1 -0
  166. package/types/plugins/dropdown/backgroundColor.d.ts +1 -0
  167. package/types/plugins/dropdown/font.d.ts +1 -0
  168. package/types/plugins/dropdown/fontColor.d.ts +1 -0
  169. package/types/plugins/dropdown/formatBlock.d.ts +3 -2
  170. package/types/plugins/dropdown/lineHeight.d.ts +1 -0
  171. package/types/plugins/dropdown/list.d.ts +1 -0
  172. package/types/plugins/dropdown/table.d.ts +6 -0
  173. package/types/plugins/input/fontSize.d.ts +1 -0
  174. package/types/plugins/modal/drawing.d.ts +4 -0
  175. package/types/plugins/modal/link.d.ts +32 -15
  176. package/types/suneditor.d.ts +13 -9
  177. package/types/typedef.d.ts +8 -0
@@ -117,648 +117,15 @@ export function CreateToolBar(
117
117
  key: string;
118
118
  }>;
119
119
  };
120
+ export default Constructor;
121
+ export type EditorFrameOptions = import('./options').EditorFrameOptions;
122
+ export type EditorInitOptions = import('./options').EditorInitOptions;
120
123
  /**
121
- * @typedef {Object} EditorFrameOptions
122
- * @property {string} [value=""] - Initial value for the editor.
123
- * @property {string} [placeholder=""] - Placeholder text.
124
- * @property {Object<string, string>} [editableFrameAttributes={}] - Attributes for the editable frame[.sun-editor-editable]. (e.g. [key]: value)
125
- * @property {string} [width="100%"] - Width for the editor.
126
- * @property {string} [minWidth=""] - Min width for the editor.
127
- * @property {string} [maxWidth=""] - Max width for the editor.
128
- * @property {string} [height="auto"] - Height for the editor.
129
- * @property {string} [minHeight=""] - Min height for the editor.
130
- * @property {string} [maxHeight=""] - Max height for the editor.
131
- * @property {string} [editorStyle=""] - Style string of the top frame of the editor. (e.g. "border: 1px solid #ccc;").
132
- * @property {boolean} [iframe=false] - Content will be placed in an iframe and isolated from the rest of the page.
133
- * @property {boolean} [iframe_fullPage=false] - Allows the usage of HTML, HEAD, BODY tags and DOCTYPE declaration on the "iframe".
134
- * @property {Object<string, string>} [iframe_attributes={}] - Attributes of the "iframe". (e.g. {'scrolling': 'no'})
135
- * @property {string} [iframe_cssFileName="suneditor"] - Name or Array of the CSS file to apply inside the iframe.
136
- * - You can also use regular expressions.
137
- * - Applied by searching by filename in the link tag of document,
138
- * - or put the URL value (".css" can be omitted).
139
- * @property {boolean} [statusbar=true] - Enables the status bar.
140
- * @property {boolean} [statusbar_showPathLabel=true] - Displays the current node structure to status bar.
141
- * @property {boolean} [statusbar_resizeEnable=true] - Enables resize function of bottom status bar
142
- * @property {boolean} [charCounter=false] - Shows the number of characters in the editor.
143
- * - If the maxCharCount option has a value, it becomes true.
144
- * @property {number} [charCounter_max] - The maximum number of characters allowed to be inserted into the editor.
145
- * @property {string} [charCounter_label] - Text to be displayed in the "charCounter" area of the bottom bar. (e.g. "Characters : 20/200")
146
- * @property {"char"|"byte"|"byte-html"} [charCounter_type="char"] - Defines the calculation method of the "charCounter" option.
147
- * - 'char': Characters length.
148
- * - 'byte': Binary data size of characters.
149
- * - 'byte-html': Binary data size of the full HTML string.
150
- */
151
- /**
152
- * @typedef {Object} EditorBaseOptions
153
- * @property {Object<string, *>|Array<Object<string, *>>} [plugins] - Plugin configuration.
154
- * @property {Array<string>} [excludedPlugins] - Plugin configuration.
155
- * @property {Array<string[]|string>} [buttonList] - List of toolbar buttons, grouped by sub-arrays.
156
- * @property {boolean} [v2Migration=false] - Enables migration mode for SunEditor v2.
157
- * @property {boolean|{tagFilter: boolean, formatFilter: boolean, classFilter: boolean, styleNodeFilter: boolean, attrFilter: boolean, styleFilter: boolean}} [strictMode=true] - Enables strict filtering of tags, attributes, and styles.
158
- * @property {"classic"|"inline"|"balloon"|"balloon-always"} [mode="classic"] - Toolbar mode: "classic", "inline", "balloon", "balloon-always".
159
- * @property {string} [type=""] - Editor type: "document:header,page".
160
- * @property {string} [theme=""] - Editor theme.
161
- * @property {Object<string, string>} [lang] - Language configuration.
162
- * @property {Array<string>} [fontSizeUnits=["px", "pt", "em", "rem"]] - Allowed font size units.
163
- * @property {string} [allowedClassName] - Allowed class names.
164
- * @property {boolean} [closeModalOutsideClick=false] - Closes modals when clicking outside.
165
- * @property {boolean} [copyFormatKeepOn=false] - Keeps the format of the copied content.
166
- * @property {boolean} [syncTabIndent=true] - Synchronizes tab indent with spaces.
167
- * @property {boolean} [tabDisable=false] - Disables tab key input.
168
- * @property {boolean} [autoLinkify] - Automatically converts URLs into hyperlinks. ("Link" plugin required)
169
- * @property {Array<string>} [autoStyleify=["bold", "underline", "italic", "strike"]] - Styles applied automatically on text input.
170
- * @property {Object<string, string|number>} [scrollToOptions={behavior: "auto", block: "nearest"}] - Configuration for scroll behavior when navigating editor content.
171
- * @property {Object<string, string|number>} [componentScrollToOptions={behavior: "smooth", block: "center"}] - Configuration for scroll behavior when navigating components.
172
- * @property {"repeat"|"always"|"none"} [retainStyleMode="repeat"] - This option determines how inline elements (such as <span>, <strong>, etc.) are handled when deleting text.
173
- * - "repeat": Inline styles are retained unless the backspace key is repeatedly pressed. If the user continuously presses backspace, the styles will eventually be removed.
174
- * - "none": Inline styles are not retained at all. When deleting text, the associated inline elements are immediately removed along with it.
175
- * - "always": Inline styles persist indefinitely unless explicitly removed. Even if all text inside an inline element is deleted, the element itself remains until manually removed.
176
- * @property {Object<string, boolean>} [allowedExtraTags={script: false, style: false, meta: false, link: false, "[a-z]+:[a-z]+": false}] - Specifies extra allowed or disallowed tags.
177
- * @property {Object<string, (...args: *) => *>} [events={}] - Custom event handlers.
178
- * @property {string} [__textStyleTags="strong|span|font|b|var|i|em|u|ins|s|strike|del|sub|sup|mark|a|label|code|summary"] - The basic tags that serves as the base for "textStyleTags"
179
- * @property {string} [textStyleTags="strong|span|font|b|var|i|em|u|ins|s|strike|del|sub|sup|mark|a|label|code|summary"] - Additional text style tags.
180
- * @property {Object<string, string>} [convertTextTags={bold: "strong", underline: "u", italic: "em", strike: "del", subscript: "sub", superscript: "sup"}] - Maps text styles to specific HTML tags.
181
- * @property {Object<string, string>} [__tagStyles={'table|th|td': 'border|border-[a-z]+|background-color|text-align|float|font-weight|text-decoration|font-style', 'ol|ul': 'list-style-type'}] - The basic tags that serves as the base for "tagStyles"
182
- * @property {Object<string, string>} [tagStyles={}] - Specifies allowed styles for HTML tags.
183
- * @property {string} [spanStyles="font-family|font-size|color|background-color"] - Specifies allowed styles for the "span" tag.
184
- * @property {string} [lineStyles="text-align|margin-left|margin-right|line-height"] - Specifies allowed styles for the "line" element (p..).
185
- * @property {string} [textDirection="ltr"] - Text direction: "ltr" or "rtl".
186
- * @property {Array<string>} [reverseButtons=['indent-outdent']] - An array of command pairs whose shortcut icons should be opposite each other, depending on the "textDirection" mode.
187
- * @property {number} [historyStackDelayTime=400] - Delay time for history stack updates (ms).
188
- * @property {string} [lineAttrReset=""] - Line properties that should be reset when changing lines (e.g. "id|name").
189
- * @property {string} [printClass=""] - Class name for printing.
190
- * @property {string} [defaultLine="p"] - Default line element when inserting new lines.
191
- * @property {"line"|"br"} [defaultLineBreakFormat="line"] - Specifies the default line break format.
192
- * - [Recommended] "line" : is a line break that is divided into general tags.
193
- * - [Not recommended] "br" : Line breaks are treated as <br> on the same line. (like shift+enter)
194
- * - Line breaks are handled as <br> within "line".
195
- * - You can create a new "line" by entering a line break twice in a row.
196
- * - Formats that include "line", such as "Quote", still operate on a "line" basis.
197
- * - ● suneditor processes work in "line" units.
198
- * - ● When set to "br", performance may decrease when editing a lot of data.
199
- * @property {Array<string>} [scopeSelectionTags=["td", "table", "li", "ol", "ul", "pre", "figcaption", "blockquote", "dl", "dt", "dd"]] - Tags treated as whole units when selecting all content.
200
- * @property {string} [__defaultElementWhitelist="br|div"] - Default allowed HTML elements. The default values are maintained.
201
- * @property {string} [elementWhitelist=""] - Allowed HTML elements. Delimiter: "|" (e.g. "p|div", "*").
202
- * @property {string} [elementBlacklist=""] - Disallowed HTML elements. Delimiter: "|" (e.g. "script|style").
203
- * @property {string} [__defaultAttributeWhitelist] - Allowed attributes. Delimiter: "|" (e.g. "href|target").
204
- * @property {Object<string, string>} [attributeWhitelist=""] - Allowed attributes. (e.g. {a: "href|target", img: "src|alt"}).
205
- * @property {Object<string, string>} [attributeBlacklist=""] - Disallowed attributes. (e.g. {a: "href|target", img: "src|alt"}).
206
- * @property {string} [__defaultFormatLine="P|DIV|H[1-6]|LI|TH|TD|DETAILS"] - Overrides the editor's default "line" element.
207
- * @property {string} [formatLine="P|DIV|H[1-6]|LI|TH|TD|DETAILS"] - Specifies the editor's "line" elements.
208
- * - (P, DIV, H[1-6], PRE, LI | class="__se__format__line_xxx")
209
- * - "line" element also contain "brLine" element
210
- * @property {string} [__defaultFormatBrLine="PRE"] - Overrides the editor's default "brLine" element.
211
- * @property {string} [formatBrLine="PRE"] - Specifies the editor's "brLine" elements. (e.g. "PRE").
212
- * - (PRE | class="__se__format__br_line_xxx")
213
- * - "brLine" elements is included in the "line" element.
214
- * - "brLine" elements's line break is "BR" tag.
215
- * ※ Entering the Enter key in the space on the last line ends "brLine" and appends "line".
216
- * @property {string} [__defaultFormatClosureBrLine=""] - Overrides the editor's default "closureBrLine" element.
217
- * @property {string} [formatClosureBrLine=""] - Specifies the editor's "closureBrLine" elements.
218
- * - (class="__se__format__br_line__closure_xxx")
219
- * - "closureBrLine" elements is included in the "brLine".
220
- * - "closureBrLine" elements's line break is "BR" tag.
221
- * - ※ You cannot exit this format with the Enter key or Backspace key.
222
- * - ※ Use it only in special cases. ([ex] format of table cells)
223
- * @property {string} [__defaultFormatBlock="BLOCKQUOTE|OL|UL|FIGCAPTION|TABLE|THEAD|TBODY|TR|CAPTION|DETAILS"] - Overrides the editor's default "block" element.
224
- * @property {string} [formatBlock="BLOCKQUOTE|OL|UL|FIGCAPTION|TABLE|THEAD|TBODY|TR|CAPTION|DETAILS"] - Specifies the editor's "block" elements.
225
- * - (BLOCKQUOTE, OL, UL, FIGCAPTION, TABLE, THEAD, TBODY, TR, TH, TD | class="__se__format__block_xxx")
226
- * - "block" is wrap the "line" and "component"
227
- * @property {string} [__defaultFormatClosureBlock="TH|TD"] - Overrides the editor's default "closureBlock" element.
228
- * @property {string} [formatClosureBlock="TH|TD"] - Specifies the editor's "closureBlock" elements.
229
- * - (TH, TD | class="__se__format__block_closure_xxx")
230
- * - "closureBlock" elements is included in the "block".
231
- * - "closureBlock" element is wrap the "line" and "component"
232
- * - ※ You cannot exit this format with the Enter key or Backspace key.
233
- * - ※ Use it only in special cases. ([ex] format of table cells)
234
- * @property {string} [allowedEmptyTags=".se-component, pre, blockquote, hr, li, table, img, iframe, video, audio, canvas, details"] - Allowed empty tags.
235
- * @property {number|string} [toolbar_width="auto"] - Toolbar width.
236
- * @property {Element|string} [toolbar_container] - Container element for the toolbar.
237
- * @property {number} [toolbar_sticky=0] - Enables sticky toolbar with optional offset.
238
- * @property {boolean} [toolbar_hide=false] - Hides toolbar initially.
239
- * @property {Object} [subToolbar] - Sub-toolbar configuration.
240
- * @property {Array<Array<string>>} [subToolbar.buttonList] - List of Sub-toolbar buttons, grouped by sub-arrays.
241
- * @property {"balloon"|"balloon-always"} [subToolbar.mode="balloon"] - Sub-toolbar mode: "balloon", "balloon-always".
242
- * @property {number|string} [subToolbar.width="auto"] - Sub-toolbar width.
243
- * @property {Element|string} [statusbar_container] - Container element for the status bar.
244
- * @property {boolean} [shortcutsHint=true] - Displays shortcut hints in tooltips.
245
- * @property {boolean} [shortcutsDisable=false] - Disables keyboard shortcuts.
246
- * @property {Object<string, Array<string>>} [shortcuts] - Custom keyboard shortcuts.
247
- * @property {number} [fullScreenOffset=0] - Offset applied when entering fullscreen mode.
248
- * @property {string} [previewTemplate] - Custom template for preview mode.
249
- * @property {string} [printTemplate] - Custom template for print mode.
250
- * @property {boolean} [componentAutoSelect=false] - Enables automatic selection of inserted components.
251
- * @property {string} [defaultUrlProtocol] - Default URL protocol for links.
252
- * @property {string} [allUsedStyles] - Specifies additional styles to the list of allowed styles. Delimiter: "|" (e.g. "color|background-color").
253
- * @property {Object<"copy", number>} [toastMessageTime] - {"copy": 1500} - Duration for displaying toast messages.
254
- * @property {Object<string, string>} [icons] - Overrides the default icons.
255
- * @property {string} [freeCodeViewMode=false] - Enables free code view mode.
256
- * @property {boolean} [__lineFormatFilter=true] - Line format filter configuration.
257
- * @property {boolean} [__pluginRetainFilter=true] - Plugin retain filter configuration.
258
- * @property {Array<string>} [__listCommonStyle=["fontSize", "color", "fontFamily", "fontWeight", "fontStyle"]] - Defines the list of styles that are applied directly to the `<li>` element
259
- * - when a text style is applied to the entire list item.
260
- * - For example, when changing the font size or color of a list item (`<li>`),
261
- * - these styles will be applied to the `<li>` tag instead of wrapping the content inside additional tags.
262
- * @property {Object<string, *>} [externalLibs] - External libraries like CodeMirror or MathJax.
263
- *
264
- * @property {Object<string, *>} [Dynamic_pluginOptions] - Dynamic plugin options, where the key is the plugin name and the value is its configuration.
265
- */
266
- /**
267
- * @typedef {EditorBaseOptions & EditorFrameOptions} EditorInitOptions
124
+ * @typedef {import('./options').EditorFrameOptions} EditorFrameOptions
268
125
  */
269
126
  /**
270
- * @description For all EditorInitOptions keys, only boolean | null values are allowed.
271
- * - 'fixed' → Immutable / null → Resettable.
272
- * @type {Partial<Record<keyof EditorInitOptions, "fixed" | true>>}
127
+ * @typedef {import('./options').EditorInitOptions} EditorInitOptions
273
128
  */
274
- export const OPTION_FIXED_FLAG: Partial<Record<keyof EditorInitOptions, 'fixed' | true>>;
275
- export default Constructor;
276
- export type EditorFrameOptions = {
277
- /**
278
- * - Initial value for the editor.
279
- */
280
- value?: string;
281
- /**
282
- * - Placeholder text.
283
- */
284
- placeholder?: string;
285
- /**
286
- * - Attributes for the editable frame[.sun-editor-editable]. (e.g. [key]: value)
287
- */
288
- editableFrameAttributes?: {
289
- [x: string]: string;
290
- };
291
- /**
292
- * - Width for the editor.
293
- */
294
- width?: string;
295
- /**
296
- * - Min width for the editor.
297
- */
298
- minWidth?: string;
299
- /**
300
- * - Max width for the editor.
301
- */
302
- maxWidth?: string;
303
- /**
304
- * - Height for the editor.
305
- */
306
- height?: string;
307
- /**
308
- * - Min height for the editor.
309
- */
310
- minHeight?: string;
311
- /**
312
- * - Max height for the editor.
313
- */
314
- maxHeight?: string;
315
- /**
316
- * - Style string of the top frame of the editor. (e.g. "border: 1px solid #ccc;").
317
- */
318
- editorStyle?: string;
319
- /**
320
- * - Content will be placed in an iframe and isolated from the rest of the page.
321
- */
322
- iframe?: boolean;
323
- /**
324
- * - Allows the usage of HTML, HEAD, BODY tags and DOCTYPE declaration on the "iframe".
325
- */
326
- iframe_fullPage?: boolean;
327
- /**
328
- * - Attributes of the "iframe". (e.g. {'scrolling': 'no'})
329
- */
330
- iframe_attributes?: {
331
- [x: string]: string;
332
- };
333
- /**
334
- * - Name or Array of the CSS file to apply inside the iframe.
335
- * - You can also use regular expressions.
336
- * - Applied by searching by filename in the link tag of document,
337
- * - or put the URL value (".css" can be omitted).
338
- */
339
- iframe_cssFileName?: string;
340
- /**
341
- * - Enables the status bar.
342
- */
343
- statusbar?: boolean;
344
- /**
345
- * - Displays the current node structure to status bar.
346
- */
347
- statusbar_showPathLabel?: boolean;
348
- /**
349
- * - Enables resize function of bottom status bar
350
- */
351
- statusbar_resizeEnable?: boolean;
352
- /**
353
- * - Shows the number of characters in the editor.
354
- * - If the maxCharCount option has a value, it becomes true.
355
- */
356
- charCounter?: boolean;
357
- /**
358
- * - The maximum number of characters allowed to be inserted into the editor.
359
- */
360
- charCounter_max?: number;
361
- /**
362
- * - Text to be displayed in the "charCounter" area of the bottom bar. (e.g. "Characters : 20/200")
363
- */
364
- charCounter_label?: string;
365
- /**
366
- * - Defines the calculation method of the "charCounter" option.
367
- * - 'char': Characters length.
368
- * - 'byte': Binary data size of characters.
369
- * - 'byte-html': Binary data size of the full HTML string.
370
- */
371
- charCounter_type?: 'char' | 'byte' | 'byte-html';
372
- };
373
- export type EditorBaseOptions = {
374
- /**
375
- * - Plugin configuration.
376
- */
377
- plugins?:
378
- | {
379
- [x: string]: any;
380
- }
381
- | Array<{
382
- [x: string]: any;
383
- }>;
384
- /**
385
- * - Plugin configuration.
386
- */
387
- excludedPlugins?: Array<string>;
388
- /**
389
- * - List of toolbar buttons, grouped by sub-arrays.
390
- */
391
- buttonList?: Array<string[] | string>;
392
- /**
393
- * - Enables migration mode for SunEditor v2.
394
- */
395
- v2Migration?: boolean;
396
- /**
397
- * - Enables strict filtering of tags, attributes, and styles.
398
- */
399
- strictMode?:
400
- | boolean
401
- | {
402
- tagFilter: boolean;
403
- formatFilter: boolean;
404
- classFilter: boolean;
405
- styleNodeFilter: boolean;
406
- attrFilter: boolean;
407
- styleFilter: boolean;
408
- };
409
- /**
410
- * - Toolbar mode: "classic", "inline", "balloon", "balloon-always".
411
- */
412
- mode?: 'classic' | 'inline' | 'balloon' | 'balloon-always';
413
- /**
414
- * - Editor type: "document:header,page".
415
- */
416
- type?: string;
417
- /**
418
- * - Editor theme.
419
- */
420
- theme?: string;
421
- /**
422
- * - Language configuration.
423
- */
424
- lang?: {
425
- [x: string]: string;
426
- };
427
- /**
428
- * - Allowed font size units.
429
- */
430
- fontSizeUnits?: Array<string>;
431
- /**
432
- * - Allowed class names.
433
- */
434
- allowedClassName?: string;
435
- /**
436
- * - Closes modals when clicking outside.
437
- */
438
- closeModalOutsideClick?: boolean;
439
- /**
440
- * - Keeps the format of the copied content.
441
- */
442
- copyFormatKeepOn?: boolean;
443
- /**
444
- * - Synchronizes tab indent with spaces.
445
- */
446
- syncTabIndent?: boolean;
447
- /**
448
- * - Disables tab key input.
449
- */
450
- tabDisable?: boolean;
451
- /**
452
- * - Automatically converts URLs into hyperlinks. ("Link" plugin required)
453
- */
454
- autoLinkify?: boolean;
455
- /**
456
- * - Styles applied automatically on text input.
457
- */
458
- autoStyleify?: Array<string>;
459
- /**
460
- * - Configuration for scroll behavior when navigating editor content.
461
- */
462
- scrollToOptions?: {
463
- [x: string]: string | number;
464
- };
465
- /**
466
- * - Configuration for scroll behavior when navigating components.
467
- */
468
- componentScrollToOptions?: {
469
- [x: string]: string | number;
470
- };
471
- /**
472
- * - This option determines how inline elements (such as <span>, <strong>, etc.) are handled when deleting text.
473
- * - "repeat": Inline styles are retained unless the backspace key is repeatedly pressed. If the user continuously presses backspace, the styles will eventually be removed.
474
- * - "none": Inline styles are not retained at all. When deleting text, the associated inline elements are immediately removed along with it.
475
- * - "always": Inline styles persist indefinitely unless explicitly removed. Even if all text inside an inline element is deleted, the element itself remains until manually removed.
476
- */
477
- retainStyleMode?: 'repeat' | 'always' | 'none';
478
- /**
479
- * - Specifies extra allowed or disallowed tags.
480
- */
481
- allowedExtraTags?: {
482
- [x: string]: boolean;
483
- };
484
- /**
485
- * - Custom event handlers.
486
- */
487
- events?: {
488
- [x: string]: (...args: any) => any;
489
- };
490
- /**
491
- * - The basic tags that serves as the base for "textStyleTags"
492
- */
493
- __textStyleTags?: string;
494
- /**
495
- * - Additional text style tags.
496
- */
497
- textStyleTags?: string;
498
- /**
499
- * - Maps text styles to specific HTML tags.
500
- */
501
- convertTextTags?: {
502
- [x: string]: string;
503
- };
504
- /**
505
- * - The basic tags that serves as the base for "tagStyles"
506
- */
507
- __tagStyles?: {
508
- [x: string]: string;
509
- };
510
- /**
511
- * - Specifies allowed styles for HTML tags.
512
- */
513
- tagStyles?: {
514
- [x: string]: string;
515
- };
516
- /**
517
- * - Specifies allowed styles for the "span" tag.
518
- */
519
- spanStyles?: string;
520
- /**
521
- * - Specifies allowed styles for the "line" element (p..).
522
- */
523
- lineStyles?: string;
524
- /**
525
- * - Text direction: "ltr" or "rtl".
526
- */
527
- textDirection?: string;
528
- /**
529
- * - An array of command pairs whose shortcut icons should be opposite each other, depending on the "textDirection" mode.
530
- */
531
- reverseButtons?: Array<string>;
532
- /**
533
- * - Delay time for history stack updates (ms).
534
- */
535
- historyStackDelayTime?: number;
536
- /**
537
- * - Line properties that should be reset when changing lines (e.g. "id|name").
538
- */
539
- lineAttrReset?: string;
540
- /**
541
- * - Class name for printing.
542
- */
543
- printClass?: string;
544
- /**
545
- * - Default line element when inserting new lines.
546
- */
547
- defaultLine?: string;
548
- /**
549
- * - Specifies the default line break format.
550
- * - [Recommended] "line" : is a line break that is divided into general tags.
551
- * - [Not recommended] "br" : Line breaks are treated as <br> on the same line. (like shift+enter)
552
- * - Line breaks are handled as <br> within "line".
553
- * - You can create a new "line" by entering a line break twice in a row.
554
- * - Formats that include "line", such as "Quote", still operate on a "line" basis.
555
- * - ● suneditor processes work in "line" units.
556
- * - ● When set to "br", performance may decrease when editing a lot of data.
557
- */
558
- defaultLineBreakFormat?: 'line' | 'br';
559
- /**
560
- * - Tags treated as whole units when selecting all content.
561
- */
562
- scopeSelectionTags?: Array<string>;
563
- /**
564
- * - Default allowed HTML elements. The default values are maintained.
565
- */
566
- __defaultElementWhitelist?: string;
567
- /**
568
- * - Allowed HTML elements. Delimiter: "|" (e.g. "p|div", "*").
569
- */
570
- elementWhitelist?: string;
571
- /**
572
- * - Disallowed HTML elements. Delimiter: "|" (e.g. "script|style").
573
- */
574
- elementBlacklist?: string;
575
- /**
576
- * - Allowed attributes. Delimiter: "|" (e.g. "href|target").
577
- */
578
- __defaultAttributeWhitelist?: string;
579
- /**
580
- * - Allowed attributes. (e.g. {a: "href|target", img: "src|alt"}).
581
- */
582
- attributeWhitelist?: {
583
- [x: string]: string;
584
- };
585
- /**
586
- * - Disallowed attributes. (e.g. {a: "href|target", img: "src|alt"}).
587
- */
588
- attributeBlacklist?: {
589
- [x: string]: string;
590
- };
591
- /**
592
- * - Overrides the editor's default "line" element.
593
- */
594
- __defaultFormatLine?: string;
595
- /**
596
- * - Specifies the editor's "line" elements.
597
- * - (P, DIV, H[1-6], PRE, LI | class="__se__format__line_xxx")
598
- * - "line" element also contain "brLine" element
599
- */
600
- formatLine?: string;
601
- /**
602
- * - Overrides the editor's default "brLine" element.
603
- */
604
- __defaultFormatBrLine?: string;
605
- /**
606
- * - Specifies the editor's "brLine" elements. (e.g. "PRE").
607
- * - (PRE | class="__se__format__br_line_xxx")
608
- * - "brLine" elements is included in the "line" element.
609
- * - "brLine" elements's line break is "BR" tag.
610
- * ※ Entering the Enter key in the space on the last line ends "brLine" and appends "line".
611
- */
612
- formatBrLine?: string;
613
- /**
614
- * - Overrides the editor's default "closureBrLine" element.
615
- */
616
- __defaultFormatClosureBrLine?: string;
617
- /**
618
- * - Specifies the editor's "closureBrLine" elements.
619
- * - (class="__se__format__br_line__closure_xxx")
620
- * - "closureBrLine" elements is included in the "brLine".
621
- * - "closureBrLine" elements's line break is "BR" tag.
622
- * - ※ You cannot exit this format with the Enter key or Backspace key.
623
- * - ※ Use it only in special cases. ([ex] format of table cells)
624
- */
625
- formatClosureBrLine?: string;
626
- /**
627
- * - Overrides the editor's default "block" element.
628
- */
629
- __defaultFormatBlock?: string;
630
- /**
631
- * - Specifies the editor's "block" elements.
632
- * - (BLOCKQUOTE, OL, UL, FIGCAPTION, TABLE, THEAD, TBODY, TR, TH, TD | class="__se__format__block_xxx")
633
- * - "block" is wrap the "line" and "component"
634
- */
635
- formatBlock?: string;
636
- /**
637
- * - Overrides the editor's default "closureBlock" element.
638
- */
639
- __defaultFormatClosureBlock?: string;
640
- /**
641
- * - Specifies the editor's "closureBlock" elements.
642
- * - (TH, TD | class="__se__format__block_closure_xxx")
643
- * - "closureBlock" elements is included in the "block".
644
- * - "closureBlock" element is wrap the "line" and "component"
645
- * - ※ You cannot exit this format with the Enter key or Backspace key.
646
- * - ※ Use it only in special cases. ([ex] format of table cells)
647
- */
648
- formatClosureBlock?: string;
649
- /**
650
- * - Allowed empty tags.
651
- */
652
- allowedEmptyTags?: string;
653
- /**
654
- * - Toolbar width.
655
- */
656
- toolbar_width?: number | string;
657
- /**
658
- * - Container element for the toolbar.
659
- */
660
- toolbar_container?: Element | string;
661
- /**
662
- * - Enables sticky toolbar with optional offset.
663
- */
664
- toolbar_sticky?: number;
665
- /**
666
- * - Hides toolbar initially.
667
- */
668
- toolbar_hide?: boolean;
669
- /**
670
- * - Sub-toolbar configuration.
671
- */
672
- subToolbar?: {
673
- buttonList?: Array<Array<string>>;
674
- mode?: 'balloon' | 'balloon-always';
675
- width?: number | string;
676
- };
677
- /**
678
- * - Container element for the status bar.
679
- */
680
- statusbar_container?: Element | string;
681
- /**
682
- * - Displays shortcut hints in tooltips.
683
- */
684
- shortcutsHint?: boolean;
685
- /**
686
- * - Disables keyboard shortcuts.
687
- */
688
- shortcutsDisable?: boolean;
689
- /**
690
- * - Custom keyboard shortcuts.
691
- */
692
- shortcuts?: {
693
- [x: string]: string[];
694
- };
695
- /**
696
- * - Offset applied when entering fullscreen mode.
697
- */
698
- fullScreenOffset?: number;
699
- /**
700
- * - Custom template for preview mode.
701
- */
702
- previewTemplate?: string;
703
- /**
704
- * - Custom template for print mode.
705
- */
706
- printTemplate?: string;
707
- /**
708
- * - Enables automatic selection of inserted components.
709
- */
710
- componentAutoSelect?: boolean;
711
- /**
712
- * - Default URL protocol for links.
713
- */
714
- defaultUrlProtocol?: string;
715
- /**
716
- * - Specifies additional styles to the list of allowed styles. Delimiter: "|" (e.g. "color|background-color").
717
- */
718
- allUsedStyles?: string;
719
- /**
720
- * - {"copy": 1500} - Duration for displaying toast messages.
721
- */
722
- toastMessageTime?: any;
723
- /**
724
- * - Overrides the default icons.
725
- */
726
- icons?: {
727
- [x: string]: string;
728
- };
729
- /**
730
- * - Enables free code view mode.
731
- */
732
- freeCodeViewMode?: string;
733
- /**
734
- * - Line format filter configuration.
735
- */
736
- __lineFormatFilter?: boolean;
737
- /**
738
- * - Plugin retain filter configuration.
739
- */
740
- __pluginRetainFilter?: boolean;
741
- /**
742
- * - Defines the list of styles that are applied directly to the `<li>` element
743
- * - when a text style is applied to the entire list item.
744
- * - For example, when changing the font size or color of a list item (`<li>`),
745
- * - these styles will be applied to the `<li>` tag instead of wrapping the content inside additional tags.
746
- */
747
- __listCommonStyle?: Array<string>;
748
- /**
749
- * - External libraries like CodeMirror or MathJax.
750
- */
751
- externalLibs?: {
752
- [x: string]: any;
753
- };
754
- /**
755
- * - Dynamic plugin options, where the key is the plugin name and the value is its configuration.
756
- */
757
- Dynamic_pluginOptions?: {
758
- [x: string]: any;
759
- };
760
- };
761
- export type EditorInitOptions = EditorBaseOptions & EditorFrameOptions;
762
129
  /**
763
130
  * @description Creates a new SunEditor instance with specified options.
764
131
  * @param {Array<{target: Element, key: *, options: EditorFrameOptions}>} editorTargets - Target element or multi-root object.
@@ -57,6 +57,16 @@ declare class DocumentType {
57
57
  * @returns {Promise<void>}
58
58
  */
59
59
  rePage(force: boolean): Promise<void>;
60
+ /**
61
+ * @private
62
+ * @description Calculates and compensates for the vertical gap between the rendered content (current page)
63
+ * - and the mirrored preview page due to differences in width and layout.
64
+ * @param {number} t - The initial top position value to be adjusted.
65
+ * @param {HTMLElement[]} chr - The elements array in the current (main) page.
66
+ * @param {HTMLElement[]} mChr - The elements array in the mirrored page.
67
+ * @returns {number|null} - The adjusted top value.
68
+ */
69
+ _calcPageBreakTop(t: number, chr: HTMLElement[], mChr: HTMLElement[]): number | null;
60
70
  /**
61
71
  * @private
62
72
  * @description Initializes the cache for document elements.
@@ -67,7 +77,7 @@ declare class DocumentType {
67
77
  * @private
68
78
  * @description Retrieves the element at a given position.
69
79
  * @param {number} pageTop - The vertical position to check.
70
- * @param {NodeList} mChr - List of mirrored elements.
80
+ * @param {HTMLElement[]} mChr - List of mirrored elements.
71
81
  * @returns {{ci: number, cm: number, ch: number}} The closest element and its related data.
72
82
  * - ci: The index of the closest element.
73
83
  * - cm: The distance between the top of the closest element and the given position.
@@ -75,7 +85,7 @@ declare class DocumentType {
75
85
  */
76
86
  _getElementAtPosition(
77
87
  pageTop: number,
78
- mChr: NodeList
88
+ mChr: HTMLElement[]
79
89
  ): {
80
90
  ci: number;
81
91
  cm: number;