@olddevs/ui 4.5.0 → 4.6.0

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 (213) hide show
  1. package/CHANGELOG.md +24 -0
  2. package/dist/editor/RichTextEditor.d.ts +2 -2
  3. package/dist/editor/RichTextEditor.d.ts.map +1 -1
  4. package/dist/editor/RichTextEditor.js +3 -0
  5. package/dist/editor/RichTextEditor.js.map +1 -1
  6. package/dist/editor/core/blockTypes.d.ts +2 -8
  7. package/dist/editor/core/blockTypes.d.ts.map +1 -1
  8. package/dist/editor/core/blockTypes.js +11 -54
  9. package/dist/editor/core/blockTypes.js.map +1 -1
  10. package/dist/editor/core/containers.d.ts.map +1 -1
  11. package/dist/editor/core/containers.js +1 -0
  12. package/dist/editor/core/containers.js.map +1 -1
  13. package/dist/editor/core/customMarkdown.js +1 -1
  14. package/dist/editor/core/customMarkdown.js.map +1 -1
  15. package/dist/editor/core/customTool.d.ts +6 -6
  16. package/dist/editor/core/customTool.d.ts.map +1 -1
  17. package/dist/editor/core/customToolEngine.d.ts +2 -2
  18. package/dist/editor/core/extensions.d.ts +7 -2
  19. package/dist/editor/core/extensions.d.ts.map +1 -1
  20. package/dist/editor/core/extensions.js +96 -64
  21. package/dist/editor/core/extensions.js.map +1 -1
  22. package/dist/editor/core/fieldNotice.d.ts +1 -1
  23. package/dist/editor/core/insertItems.d.ts +5 -28
  24. package/dist/editor/core/insertItems.d.ts.map +1 -1
  25. package/dist/editor/core/insertItems.js +3 -94
  26. package/dist/editor/core/insertItems.js.map +1 -1
  27. package/dist/editor/core/insertMenuTool.d.ts +13 -0
  28. package/dist/editor/core/insertMenuTool.d.ts.map +1 -0
  29. package/dist/editor/core/insertMenuTool.js +20 -0
  30. package/dist/editor/core/insertMenuTool.js.map +1 -0
  31. package/dist/editor/core/schema.d.ts +20 -5
  32. package/dist/editor/core/schema.d.ts.map +1 -1
  33. package/dist/editor/core/schema.js +18 -3
  34. package/dist/editor/core/schema.js.map +1 -1
  35. package/dist/editor/core/shortcuts.d.ts +56 -5
  36. package/dist/editor/core/shortcuts.d.ts.map +1 -1
  37. package/dist/editor/core/shortcuts.js +91 -156
  38. package/dist/editor/core/shortcuts.js.map +1 -1
  39. package/dist/editor/core/skeleton.d.ts +1 -1
  40. package/dist/editor/core/skeleton.d.ts.map +1 -1
  41. package/dist/editor/core/skeleton.js +1 -0
  42. package/dist/editor/core/skeleton.js.map +1 -1
  43. package/dist/editor/core/toolButtons.d.ts +3 -3
  44. package/dist/editor/core/toolDefinition.d.ts +3 -3
  45. package/dist/editor/core/toolDescriptor.d.ts +49 -30
  46. package/dist/editor/core/toolDescriptor.d.ts.map +1 -1
  47. package/dist/editor/core/toolDescriptor.js +2 -5
  48. package/dist/editor/core/toolDescriptor.js.map +1 -1
  49. package/dist/editor/core/toolLoader.d.ts +1 -1
  50. package/dist/editor/core/toolLoader.d.ts.map +1 -1
  51. package/dist/editor/core/toolOptions.d.ts +19 -2
  52. package/dist/editor/core/toolOptions.d.ts.map +1 -1
  53. package/dist/editor/core/toolOptions.js.map +1 -1
  54. package/dist/editor/core/tools.d.ts +10 -2
  55. package/dist/editor/core/tools.d.ts.map +1 -1
  56. package/dist/editor/core/tools.js +1 -0
  57. package/dist/editor/core/tools.js.map +1 -1
  58. package/dist/editor/features/builtins.d.ts +6 -8
  59. package/dist/editor/features/builtins.d.ts.map +1 -1
  60. package/dist/editor/features/builtins.js +48 -21
  61. package/dist/editor/features/builtins.js.map +1 -1
  62. package/dist/editor/features/code/codeBlockTool.d.ts +5 -6
  63. package/dist/editor/features/code/codeBlockTool.d.ts.map +1 -1
  64. package/dist/editor/features/code/codeBlockTool.js +10 -1
  65. package/dist/editor/features/code/codeBlockTool.js.map +1 -1
  66. package/dist/editor/features/color/colorTools.d.ts +14 -0
  67. package/dist/editor/features/color/colorTools.d.ts.map +1 -0
  68. package/dist/editor/features/color/colorTools.js +39 -0
  69. package/dist/editor/features/color/colorTools.js.map +1 -0
  70. package/dist/editor/features/details/details.d.ts +68 -0
  71. package/dist/editor/features/details/details.d.ts.map +1 -0
  72. package/dist/editor/features/details/details.js +237 -0
  73. package/dist/editor/features/details/details.js.map +1 -0
  74. package/dist/editor/features/details/detailsMarkdown.d.ts +17 -0
  75. package/dist/editor/features/details/detailsMarkdown.d.ts.map +1 -0
  76. package/dist/editor/features/details/detailsMarkdown.js +84 -0
  77. package/dist/editor/features/details/detailsMarkdown.js.map +1 -0
  78. package/dist/editor/features/details/detailsTool.d.ts +16 -0
  79. package/dist/editor/features/details/detailsTool.d.ts.map +1 -0
  80. package/dist/editor/features/details/detailsTool.js +39 -0
  81. package/dist/editor/features/details/detailsTool.js.map +1 -0
  82. package/dist/editor/features/emoji/emojiTool.d.ts +1 -1
  83. package/dist/editor/features/heading/headingTool.d.ts +18 -0
  84. package/dist/editor/features/heading/headingTool.d.ts.map +1 -0
  85. package/dist/editor/features/heading/headingTool.js +59 -0
  86. package/dist/editor/features/heading/headingTool.js.map +1 -0
  87. package/dist/editor/features/history/historyTool.d.ts +15 -0
  88. package/dist/editor/features/history/historyTool.d.ts.map +1 -0
  89. package/dist/editor/features/history/historyTool.js +28 -0
  90. package/dist/editor/features/history/historyTool.js.map +1 -0
  91. package/dist/editor/features/image/imageTool.d.ts +19 -0
  92. package/dist/editor/features/image/imageTool.d.ts.map +1 -0
  93. package/dist/editor/features/image/imageTool.js +28 -0
  94. package/dist/editor/features/image/imageTool.js.map +1 -0
  95. package/dist/editor/features/layout/layoutTool.d.ts +11 -0
  96. package/dist/editor/features/layout/layoutTool.d.ts.map +1 -0
  97. package/dist/editor/features/layout/layoutTool.js +20 -0
  98. package/dist/editor/features/layout/layoutTool.js.map +1 -0
  99. package/dist/editor/features/lists/listTools.d.ts +15 -0
  100. package/dist/editor/features/lists/listTools.d.ts.map +1 -0
  101. package/dist/editor/features/lists/listTools.js +78 -0
  102. package/dist/editor/features/lists/listTools.js.map +1 -0
  103. package/dist/editor/features/marks/markTools.d.ts +16 -0
  104. package/dist/editor/features/marks/markTools.d.ts.map +1 -0
  105. package/dist/editor/features/marks/markTools.js +43 -0
  106. package/dist/editor/features/marks/markTools.js.map +1 -0
  107. package/dist/editor/features/search/searchTool.d.ts +1 -1
  108. package/dist/editor/features/table/tableTool.d.ts +3 -3
  109. package/dist/editor/features/toc/RichTextToc.d.ts.map +1 -1
  110. package/dist/editor/features/toc/RichTextToc.js +9 -2
  111. package/dist/editor/features/toc/RichTextToc.js.map +1 -1
  112. package/dist/editor/features/wrapper/wrapperTool.d.ts +11 -0
  113. package/dist/editor/features/wrapper/wrapperTool.d.ts.map +1 -0
  114. package/dist/editor/features/wrapper/wrapperTool.js +32 -0
  115. package/dist/editor/features/wrapper/wrapperTool.js.map +1 -0
  116. package/dist/editor/index.d.ts +1 -1
  117. package/dist/editor/index.d.ts.map +1 -1
  118. package/dist/editor/index.js.map +1 -1
  119. package/dist/editor/schema-entry.d.ts +1 -1
  120. package/dist/editor/styles/prose.d.ts.map +1 -1
  121. package/dist/editor/styles/prose.js +26 -0
  122. package/dist/editor/styles/prose.js.map +1 -1
  123. package/dist/editor/ui/EditorToolbar.d.ts.map +1 -1
  124. package/dist/editor/ui/EditorToolbar.js +5 -38
  125. package/dist/editor/ui/EditorToolbar.js.map +1 -1
  126. package/dist/editor/ui/SelectionBubble.d.ts.map +1 -1
  127. package/dist/editor/ui/SelectionBubble.js +1 -1
  128. package/dist/editor/ui/SelectionBubble.js.map +1 -1
  129. package/dist/editor/ui/ToolButtonView.d.ts.map +1 -1
  130. package/dist/editor/ui/ToolButtonView.js +1 -1
  131. package/dist/editor/ui/ToolButtonView.js.map +1 -1
  132. package/dist/i18n/defaults.d.ts.map +1 -1
  133. package/dist/i18n/defaults.js +3 -0
  134. package/dist/i18n/defaults.js.map +1 -1
  135. package/dist/i18n/messages.d.ts +16 -1
  136. package/dist/i18n/messages.d.ts.map +1 -1
  137. package/dist/icons.d.ts +8 -1
  138. package/dist/icons.d.ts.map +1 -1
  139. package/dist/icons.js +1 -1
  140. package/dist/icons.js.map +1 -1
  141. package/dist/locales/ru.d.ts.map +1 -1
  142. package/dist/locales/ru.js +3 -0
  143. package/dist/locales/ru.js.map +1 -1
  144. package/docs/api/editor-extension.en.md +56 -56
  145. package/docs/api/editor-extension.md +55 -55
  146. package/docs/api/messages.en.md +4 -1
  147. package/docs/api/messages.md +3 -0
  148. package/docs/api/migration-notes.en.md +3 -3
  149. package/docs/api/migration-notes.md +2 -2
  150. package/docs/components/content/rich-text-view.en.md +18 -12
  151. package/docs/components/content/rich-text-view.md +17 -11
  152. package/docs/components/inputs/rich-text-editor.en.md +140 -87
  153. package/docs/components/inputs/rich-text-editor.md +139 -86
  154. package/docs/conventions.en.md +2 -2
  155. package/docs/conventions.md +1 -1
  156. package/docs/getting-started.en.md +9 -9
  157. package/docs/getting-started.md +8 -8
  158. package/docs/glossary.en.md +80 -52
  159. package/docs/glossary.md +79 -51
  160. package/docs/icons.en.md +4 -1
  161. package/docs/icons.md +3 -0
  162. package/package.json +2 -1
  163. package/src/editor/RichTextEditor.tsx +9 -6
  164. package/src/editor/core/atomText.ts +2 -2
  165. package/src/editor/core/blockTypes.ts +19 -83
  166. package/src/editor/core/containers.ts +4 -2
  167. package/src/editor/core/customMarkdown.ts +2 -2
  168. package/src/editor/core/customTool.ts +6 -6
  169. package/src/editor/core/customToolEngine.ts +9 -9
  170. package/src/editor/core/extensions.ts +165 -110
  171. package/src/editor/core/fieldNotice.ts +1 -1
  172. package/src/editor/core/handle.ts +2 -2
  173. package/src/editor/core/insertItems.ts +12 -158
  174. package/src/editor/core/insertMenuTool.ts +32 -0
  175. package/src/editor/core/jsonDocument.ts +1 -1
  176. package/src/editor/core/schema.ts +42 -7
  177. package/src/editor/core/shortcuts.ts +116 -177
  178. package/src/editor/core/skeleton.ts +4 -3
  179. package/src/editor/core/toolButtons.ts +3 -3
  180. package/src/editor/core/toolDefinition.ts +4 -4
  181. package/src/editor/core/toolDescriptor.ts +65 -52
  182. package/src/editor/core/toolLoader.ts +3 -3
  183. package/src/editor/core/toolOptions.ts +21 -2
  184. package/src/editor/core/tools.ts +10 -1
  185. package/src/editor/core/viewIsland.ts +1 -1
  186. package/src/editor/features/builtins.ts +76 -41
  187. package/src/editor/features/code/codeBlockTool.ts +16 -8
  188. package/src/editor/features/color/colorTools.ts +68 -0
  189. package/src/editor/features/details/details.ts +389 -0
  190. package/src/editor/features/details/detailsMarkdown.ts +158 -0
  191. package/src/editor/features/details/detailsTool.ts +69 -0
  192. package/src/editor/features/emoji/emojiTool.tsx +1 -1
  193. package/src/editor/features/heading/headingTool.ts +96 -0
  194. package/src/editor/features/history/historyTool.ts +42 -0
  195. package/src/editor/features/image/imageTool.ts +49 -0
  196. package/src/editor/features/layout/layoutTool.ts +40 -0
  197. package/src/editor/features/lists/listTools.ts +112 -0
  198. package/src/editor/features/marks/markTools.ts +78 -0
  199. package/src/editor/features/search/searchTool.ts +1 -1
  200. package/src/editor/features/table/tableTool.ts +3 -3
  201. package/src/editor/features/toc/RichTextToc.tsx +14 -3
  202. package/src/editor/features/toc/tocTool.ts +1 -1
  203. package/src/editor/features/wrapper/wrapperTool.ts +52 -0
  204. package/src/editor/index.ts +1 -0
  205. package/src/editor/schema-entry.ts +1 -1
  206. package/src/editor/styles/prose.ts +49 -0
  207. package/src/editor/ui/EditorToolbar.tsx +7 -50
  208. package/src/editor/ui/SelectionBubble.tsx +2 -5
  209. package/src/editor/ui/ToolButtonView.tsx +2 -1
  210. package/src/i18n/defaults.ts +3 -0
  211. package/src/i18n/messages.ts +14 -1
  212. package/src/icons.ts +7 -0
  213. package/src/locales/ru.ts +3 -0
@@ -1,5 +1,5 @@
1
1
  ---
2
- sourceHash: 84104315608a
2
+ sourceHash: 502667bd31f1
3
3
  ---
4
4
 
5
5
  # General conventions for `@olddevs/ui`
@@ -285,7 +285,7 @@ already catches itself. A violation after which the component cannot work is not
285
285
  (`vi.stubEnv`), and it stays silent on a correct call.
286
286
 
287
287
  **An error instead of a warning: `devError(message, cause?)`.** Use it when a violation breaks the whole component
288
- but not the page: the Tool set of `RichTextEditor` is built incorrectly, the loader of an engine part failed,
288
+ but not the page: the Tool set of `RichTextEditor` is built incorrectly, the loader of the Extensions failed,
289
289
  `rangeAt` of the Text card threw an exception. The field shows the author a catalog string on its own, and the
290
290
  cause goes to the developer through `console.error`, with the same rules as `devWarn`: in development, once per
291
291
  text, in English.
@@ -320,7 +320,7 @@ ADR-0034.
320
320
 
321
321
  **Ошибка вместо предупреждения — `devError(message, cause?)`.** Когда нарушение
322
322
  ломает компонент целиком, но не страницу: набор Инструментов `RichTextEditor`
323
- собран с ошибкой, Загрузчик Части для движка упал, `rangeAt` Карточки бросил
323
+ собран с ошибкой, Загрузчик Extensions упал, `rangeAt` Карточки бросил
324
324
  исключение. Поле само показывает автору строку каталога (`editor.toolsFailed`),
325
325
  а причина уходит разработчику через `console.error` — с теми же правилами, что у
326
326
  `devWarn`: в разработке, один раз на текст, по-английски.
@@ -1,5 +1,5 @@
1
1
  ---
2
- sourceHash: 340e1ec512cb
2
+ sourceHash: 45289d832ab0
3
3
  ---
4
4
 
5
5
  # Setting up `@olddevs/ui`
@@ -132,12 +132,12 @@ peer dependencies are treated as external, and the metric is gzip:
132
132
  | `cn` and `tableStateToParams` | 0.6 kB |
133
133
  | one `Button` | 1.6 kB |
134
134
  | `DataTable` | 9.0 kB |
135
- | the whole kit (`import *`) | 77.1 kB |
136
- | `RichTextEditor` from `@olddevs/ui/editor`, without the engine, "start" | 72.7 kB |
137
- | `RichTextEditor` with the Tiptap engine, "start" (static graph, `basic`) | 297.5 kB |
138
- | `RichTextEditor` with the Tiptap engine, "full" (with all lazy chunks, `full`) | 346.6 kB |
139
- | `RichTextView` from `@olddevs/ui/editor`, Tiptap engine included in the measurement | 12.3 kB |
140
- | `sanitizeRichText` and `richTextSanitizeConfig` from `@olddevs/ui/editor/schema`, Tiptap engine included | 3.9 kB |
135
+ | the whole kit (`import *`) | 77.2 kB |
136
+ | `RichTextEditor` from `@olddevs/ui/editor`, without the engine, "start" | 75.9 kB |
137
+ | `RichTextEditor` with the Tiptap engine, "start" (static graph, `basic`) | 305.3 kB |
138
+ | `RichTextEditor` with the Tiptap engine, "full" (with all lazy chunks, `full`) | 354.6 kB |
139
+ | `RichTextView` from `@olddevs/ui/editor`, Tiptap engine included in the measurement | 12.7 kB |
140
+ | `sanitizeRichText` and `richTextSanitizeConfig` from `@olddevs/ui/editor/schema`, Tiptap engine included | 4.0 kB |
141
141
  | `highlightCodeBlocks` from `@olddevs/ui/editor/highlight`, with lowlight | 22.6 kB |
142
142
  | `highlightCodeNodes` from `@olddevs/ui/editor/highlight`, with lowlight | 22.6 kB |
143
143
 
@@ -146,7 +146,7 @@ The last seven rows are separate Editor entry points with their own budgets
146
146
  them are scenarios (ADR-0058, item 11.7):
147
147
  **"start"** is the static graph, what ships immediately and what the `basic` Preset costs; **"full"** is the same
148
148
  plus all the lazy chunks of the entry point, what `full` ends up loading. The code Block and the table (absent from `basic`,
149
- and their Engine part weighs more than 10 kB) load lazily; until they arrive, an Editor that includes them shows a Skeleton.
149
+ and their Extensions weigh more than 10 kB) load lazily; until they arrive, an Editor that includes them shows a Skeleton.
150
150
  `npm run size` checks that their modules are not in "start". The kit's own code is measured at "start".
151
151
 
152
152
  In the scenarios the engine is **included in the measurement** on purpose: the consumer installs Tiptap, but
@@ -158,7 +158,7 @@ an app bundler with full minification produced about 133 kB (measured before the
158
158
  For `RichTextView`, Tiptap and lowlight are included in the measurement as a check. Its row contains only
159
159
  typography and the Island of the "Copy" button on code Blocks (the kit's button and tooltip, the message catalog),
160
160
  and the measurement proves that its graph contains neither the engine nor a highlighter. The lightweight
161
- `@olddevs/ui/editor/schema` entry point is measured the same way (3.9 kB): the Schema, `richTextSchema`, the
161
+ `@olddevs/ui/editor/schema` entry point is measured the same way (4.0 kB): the Schema, `richTextSchema`, the
162
162
  `sanitizeRichText` sanitizer with hooks for DOMPurify, including for the rules of custom Tools, and `markRange`.
163
163
 
164
164
  Server-side highlighting in `@olddevs/ui/editor/highlight` (22.6 kB — almost entirely the highlight.js core and
@@ -129,12 +129,12 @@ peer-зависимости внешние, метрика gzip:
129
129
  | `cn` и `tableStateToParams` | 0,6 кБ |
130
130
  | одна `Button` | 1,6 кБ |
131
131
  | `DataTable` | 9,0 кБ |
132
- | весь кит целиком (`import *`) | 77,1 кБ |
133
- | `RichTextEditor` из `@olddevs/ui/editor`, без движка, «старт» | 72,7 кБ |
134
- | `RichTextEditor` вместе с движком Tiptap, «старт» (статический граф, `basic`) | 297,5 кБ |
135
- | `RichTextEditor` вместе с движком Tiptap, «полный» (со всеми ленивыми чанками, `full`) | 346,6 кБ |
136
- | `RichTextView` из `@olddevs/ui/editor`, движок Tiptap в замер включён | 12,3 кБ |
137
- | `sanitizeRichText` и `richTextSanitizeConfig` из `@olddevs/ui/editor/schema`, движок Tiptap в замер включён | 3,9 кБ |
132
+ | весь кит целиком (`import *`) | 77,2 кБ |
133
+ | `RichTextEditor` из `@olddevs/ui/editor`, без движка, «старт» | 75,9 кБ |
134
+ | `RichTextEditor` вместе с движком Tiptap, «старт» (статический граф, `basic`) | 305,3 кБ |
135
+ | `RichTextEditor` вместе с движком Tiptap, «полный» (со всеми ленивыми чанками, `full`) | 354,6 кБ |
136
+ | `RichTextView` из `@olddevs/ui/editor`, движок Tiptap в замер включён | 12,7 кБ |
137
+ | `sanitizeRichText` и `richTextSanitizeConfig` из `@olddevs/ui/editor/schema`, движок Tiptap в замер включён | 4,0 кБ |
138
138
  | `highlightCodeBlocks` из `@olddevs/ui/editor/highlight`, вместе с lowlight | 22,6 кБ |
139
139
  | `highlightCodeNodes` из `@olddevs/ui/editor/highlight`, вместе с lowlight | 22,6 кБ |
140
140
 
@@ -143,7 +143,7 @@ peer-зависимости внешние, метрика gzip:
143
143
  них — сценарии (ADR-0058, п. 11.7):
144
144
  **«старт»** — статический граф, то, что едет сразу и что платит Пресет `basic`; **«полный»** — он же
145
145
  плюс все ленивые чанки входа, то, что в итоге грузит `full`. Блок кода и таблица (их нет в `basic`,
146
- а их Часть для движка тяжелее 10 кБ) грузятся лениво; до их прихода Редактор, в котором они есть,
146
+ а их Extensions тяжелее 10 кБ) грузятся лениво; до их прихода Редактор, в котором они есть,
147
147
  показывает Скелет. `npm run size` проверяет, что их модулей в «старте» нет. Код кита меряется на «старте».
148
148
 
149
149
  В сценариях движок **внесён в замер** намеренно: Tiptap ставит потребитель, но набор его расширений
@@ -155,7 +155,7 @@ peer-зависимости внешние, метрика gzip:
155
155
  У `RichTextView` Tiptap и lowlight внесены в замер ради проверки. В его строку входят только
156
156
  типографика и Остров кнопки «Копировать» у Блоков кода (кнопка и подсказка кита, каталог сообщений),
157
157
  и замер доказывает, что в графе нет ни движка, ни подсветчика. Так же меряется лёгкий вход
158
- `@olddevs/ui/editor/schema` (3,9 кБ): Схема, `richTextSchema`, очистка `sanitizeRichText` с хуками для
158
+ `@olddevs/ui/editor/schema` (4,0 кБ): Схема, `richTextSchema`, очистка `sanitizeRichText` с хуками для
159
159
  DOMPurify, в том числе по правилам своих Инструментов, и `markRange`.
160
160
 
161
161
  Серверная подсветка `@olddevs/ui/editor/highlight` (22,6 кБ — почти целиком ядро highlight.js и
@@ -1,5 +1,5 @@
1
1
  ---
2
- sourceHash: 5cc549fe1c76
2
+ sourceHash: 5d5024cab991
3
3
  ---
4
4
 
5
5
  # Glossary of `@olddevs/ui`
@@ -136,54 +136,82 @@ Terms of `RichTextEditor` and `RichTextView` (the `@olddevs/ui/editor` entry poi
136
136
  especially easy to borrow a word from a neighboring editor (plugin, service, node) — and that
137
137
  introduces a second meaning.
138
138
 
139
- | Term | Meaning | Not to be confused with |
140
- | ------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
141
- | **Editor** | `RichTextEditor` — a rich text input field | A code editor: the kit has none, code is displayed with `CodeView` |
142
- | **View** | `RichTextView` — read-only display of a saved Document | The Editor's `readOnly` mode: that one carries the engine, the View does not |
143
- | **Table of contents** | `RichTextToc`: the list of a Document's headings next to the View or the Editor. Collapsed, it is a strip of strokes; expanded, a list; a click on an item goes to the heading | The kit's `Heading` and the navigation of the documentation site |
144
- | **Document** | The Editor's value: an HTML string constrained by the Schema | The ProseMirror JSON tree in the engine — it is internal; it comes out only as a JSON envelope |
145
- | **JSON envelope** | A Document as JSON for a file and a template: `{ format: "olddevs-rich-text", version, doc }` (`getJSON()`, `setJSON()`, `defaultValue`), lossless and through the Schema | The Editor's value — the value stays HTML; the bare tree `editor.getJSON()` without an envelope |
146
- | **Schema** | An allowlist of Blocks, Marks and attributes that the Editor accepts and returns | Server-side sanitization — the consumer does it (`sanitizeRichText`) |
147
- | **Block** | A structural element of a Document: paragraph, heading, list, table, image… | A Mark |
148
- | **Mark** | Inline formatting inside a Block: bold, link, color… | A Block |
149
- | **Atom** | A Block or inline element that is selected, moved and deleted as a whole: an image (the caption inside it is editable), a divider, a soft break, a mention. Always makes the field non-empty | An empty Block: a paragraph without text is not an Atom and does not count as content |
150
- | **Atom text** | The string that represents an Atom in the Document's text: `getText` and `getSelectedText` return it, its length is the Atom's weight in `maxLength`, and it is how the Atom is exported to Markdown without rules of its own. For an image it is the caption text, for a divider an empty string | A Block attribute |
151
- | **Layout** | A Block of columns (the `layout` Tool): six variants — from one to four equal columns, 60/40 and 40/60. Top level only, does not nest into itself; a column for its Blocks is the same as a Document | A table: it has data rows and cells, while the columns of a Layout are the Document's page structure. The kit's `Grid`: a screen grid, not a Block |
152
- | **Wrapper** | A Block that gathers a group of Blocks (the `wrapper` Tool, a `div` with `data-block="wrapper"`): they are moved, duplicated and deleted as one Block. Without a Wrapper tone it has no look of its own — the dashed outline exists only in the Editor. Neither a Wrapper nor a Layout nests into a Wrapper | A quote: it has its own look and meaning in the Document, while a Wrapper without a tone is only grouping |
153
- | **Wrapper tone** | The styling of a Wrapper as a note (`data-tone`): a background and a stripe on the left in one of five tones of the `Tone` vocabulary — "Note", "Tip", "Important", "Warning", "Caution". Chosen in the "Tone ›" item of the Block handle, the same in the Editor and the View, exported to Markdown as a GitHub alert (what GitHub and Notion call a callout) | The tone of a Field notice (`status` or `error`). Meaning: the tone carries no roles or `aria-*`; the meaning of a note is written as a word in the text |
154
- | **Toolbar** | A set of formatting buttons; its look is set by `toolbar`. **Fixed** (`fixed`, the default) — above the field, sticks on scroll; **floating** (`floating`) — the same buttons above a non-empty selection. With `bubble` there is no Toolbar — the Selection menu takes its place, with `none` there is neither. On a touch screen the Toolbar is always fixed | The kit's `Toolbar` — the primitive that the Toolbar is built from |
155
- | **Insert menu** | The "Insert" and "Turn into" list: opens on `/` in the text and on the "+" button | The browser context menu |
156
- | **Selection menu** | A compact pill on an inverse surface above a non-empty selection: "", lists, bold, italic, underline, color, "…", link, emoji; its contents are fixed by the kit. Appears in place of the Toolbar with `toolbar="bubble"` and on top of the fixed Toolbar — there `selectionMenu={false}` turns it off. Absent on a touch screen | The floating Toolbar: it has the full set of buttons |
157
- | **Block handle** | The "⋮" on the Block that holds the caret, and its menu of actions on the whole Block: "Add ›", "Format ›", "Move up", "Move down", "Duplicate", "Delete" | The Toolbar: it works with the selection, not with a Block |
158
- | **Insert item** | A row of the Insert menu: inserts a Block or turns the current one into another. One item is visible on `/`, on "+" and in the Block handle | A Toolbar button |
159
- | **Block action** | An item of the Block handle menu that works with the whole Block, for example "Duplicate" | A button: it works with the selection |
160
- | **Shortcuts reference** | A read-only "command — shortcut" popover behind the last button of the fixed Toolbar. The rows are the commands of the enabled Tools, including custom ones; on a phone there is no button | The kit's `CommandPalette`: the rows of the Shortcuts reference are not clickable. The kit's `ShortcutsHelp`: it lists screen shortcuts, not Editor ones |
161
- | **HTML mode** | The mode of the `source` Tool: the "HTML" button on the fixed Toolbar replaces the Document with a field holding its HTML. The field text passes through the Schema and becomes the Document in a single edit — on leaving the mode, on `blur`, on form submit and on reading through the Handle | The HTML convention: that is the form of custom content in a Document, not a mode. `CodeView`: it displays code, while the HTML field is editable |
162
- | **Glass** | A semi-transparent background that blurs what is behind it on everything the Editor shows above the Document: the floating Toolbar, the Selection menu, menus, popovers, the Text card. The color is the token of its own surface; with `prefers-reduced-transparency`, `prefers-contrast: more` and on iOS the background is solid | The kit's `Menu` and `Popover` outside the Editor: they stay solid |
163
- | **UI contribution** | A UI element of a custom Tool, described as data: a button, an Insert item, a Block action or a Text card. The kit renders it in a Slot; a disabled Tool removes its UI contributions as well | A React node in the interface: arbitrary React is allowed only inside the content of a button popover and a Text card |
164
- | **Slot** | One place on a surface where the UI contributions of custom Tools appear, in `tools` order: the Toolbar group before "Undo", the end of an Insert menu section, the Block handle section before "Delete" | A position relative to a built-in button: the ids of built-ins are not public API |
165
- | **Preset** | A ready-made set of built-in Tools: `full` or `basic` (`RICH_TEXT_PRESETS`). Not a frozen list: a new built-in arrives in it in a minor version | An exact `tools` list: only the screen changes its composition |
166
- | **Tool** | One capability of the Editor: its Blocks and Marks, their rules in the Schema and their place in the UI, for example `table`. A built-in one is set by name, a custom one by a description | A button: disabling a Tool also removes its Block from the Schema. A Redactor plugin: that is a class of behavior over the DOM without a Schema |
167
- | **custom Tool** | A Tool that the consumer describes (`CustomTool`): Schema rules as data, an Engine part and UI contributions. Passed in `tools` mixed in with the kit's names | The kit's internal description: that is a superset of the public shape for built-ins and is not exported |
168
- | **Tool options** | What the screen sets on a Tool before the engine is created: the starting flags of Find, `offsetVar`, `levels` and `listWidth` of the Table of contents, the `defaults` of a custom Tool (`defineTool`). The screen sets them with a `tool(…)` entry and the kit reads them once, when the engine is created | `options` of a Tiptap extension: the extension's author sets those and the Engine part reads them, while Tool options are set by the screen and read by the kit. The Editor's props (`preset`, `maxHeight`): those configure the field, not a Tool |
169
- | **Configured Tool** | An entry of `tools` returned by `tool(name, options)` or `tool(definition, options)`: a Tool together with its options. It switches a Tool on without the name in `tools` and wins over a bare name from a Preset | A `defineTool` definition: that describes a Tool, while a Configured Tool is its activation with options. The description of a built-in Tool: it is not exported, and the entry only names the Tool and carries the options |
170
- | **Tool state** | A data snapshot the screen reads with the `useRichTextToolState(ref, name)` hook: for Find, whether the panel is open, the query, the number of matches and the current one; for the Table of contents, the headings and the current section. The screen re-renders only when the snapshot changes | `storage` of a Tiptap extension: that is a mutable store inside the engine, while Tool state is read-only. `useRichTextEditorState`: that takes a slice of the live Tiptap `editor`, not a Tool's contract |
171
- | **Tool commands** | What the screen calls on a Tool through `handle.tool(name)`: `tool("search")?.open()`, `tool("toc")?.jumpTo(2)`. Each returns a `boolean`; `null` instead of the commands object means the Tool is not in the set, has no commands, or the engine has not been created yet | Handle methods (`insertHTML`, `focus`): those are common to any `tools`, while Tool commands exist only while the Tool is enabled. `editor.commands` and `commands` in Tiptap: those are engine commands and follow its major |
172
- | **Consumer prefix** | The start of the name of everything custom — a Tool, its Blocks, Marks and attributes — up to the underscore: `acme_mergeTag`, `data-acme_size`. Kit names have no underscore, so custom names and built-in ones never collide, either in a set or in a Document | A Preset: that is a set of built-in Tools, not a namespace |
173
- | **HTML convention** | The form of custom content in a Document: a Block is a `div` or `span` with `data-block`, a Mark is a `span` with `data-mark`, attributes are `data-<prefix>_<name>`. Frozen: extended only by adding | The kit's Schema tags (`p`, `table`, `img`): a custom Block cannot take them |
174
- | **Block trait** | A Block property that only the kit understands, not the engine: "container" (children get their own handle), "can be turned into", "Atom without a formatting menu" | A Block attribute: that one is stored in the Document |
175
- | **Engine part** | The part of a Tool description needed only by the live Editor: Tiptap extensions and the node view. Supplied immediately or through a Loader | Schema rules: those are data, read by the server and the View without an engine |
176
- | **Loader** | A function with a dynamic import in place of the Engine part: `engine: () => import(…)`. The heavy built-ins outside `basic` load the same way — the code Block and the table | Preloading (`modulepreload`): the kit does not publish it, the consumer sets it up |
177
- | **Handle** | Imperative access from screen code to the Editor through `ref`: insert at the caret, read, focus, history, the commands of Tools (`tool(name)`) | Redactor services: those are engine internals, not screen API |
178
- | **Readiness** | The moment when the engine is created and the Loaders of all enabled Tools, custom and built-in, have finished: from then on Handle methods take effect instead of doing nothing. Happens once per mount; `onReady` reports it | Hydration: after it the engine may still be waiting for Loaders |
179
- | **Field focus** | Focus inside the Editor as a whole: the Document, the Toolbar, the kit's popovers, the HTML field. Moving between them does not lose Field focus; `onFocus` and `onBlur` are about it | Document focus (the engine's `focus` and `blur`): a click in the Toolbar removes it |
180
- | **Author edit** | A change to the Document equal to typing on a keyboard: a history step, `onChange` after a delay, the character limit applies. This also covers insert, undo and redo from the Handle | An External replacement |
181
- | **External replacement** | Replacing the whole Document (`value`, `clear()`, `setMarkdown()`, `setJSON()`): the character limit does not truncate it; `onChange` fires immediately for `clear()`, `setMarkdown()` and `setJSON()`, but not for a new `value` | An Author edit |
182
- | **Skeleton** | The Editor's look before Readiness: the field frame, a placeholder for the Toolbar and a Document: sanitized by the Schema, it is rendered as static HTML with the same class and rhythm as the engine's Document, without input. On the server — the frame without a Document. A Loader failure turns the Skeleton into a field error with "Retry" | The View: that is a separate read-only component, while the Skeleton is a state of the Editor that the engine replaces. The kit's `Skeleton` component: a loading placeholder |
183
- | **Status line** | A line inside the field frame under the Document: on the left the screen's content (`status`: word count, "Saved", co-author), on the right the kit's character counter | A Field notice: the line shows a lasting state of the screen, not an event |
184
- | **Field notice** | One event tied to the field (`showNotice`): tone `status` (only announced) or `error` (a visible line under the field until the next Author edit). A new one replaces the previous one | The kit's toast: that one is global and not tied to a field |
185
- | **Text card** | A non-modal card under a range of the Document, declared by a custom Tool (`textCards`): a comment, a hint from checking the text. Opens when the caret enters it or on click, focus stays in the text | A button popover: a button opens that one, while a Text card is opened by a place in the Document |
186
- | **Trigger character** | A character of a custom Tool (`trigger`) that opens a list of items at the caret when typed at the start of a Block or after a space, like `/`: `@` for mentions, `#` for tags. Picking an item replaces the typed `@query` with a custom node | The Insert menu on `/`: that one is built in, while a custom character is set by a Tool |
187
- | **Paper** | A light area of the Document in any app theme (`surface="paper"`) — for text that leaves the app on a light background: an email, print, PDF. The Toolbar, menus and field frame stay in the app theme; the View with the same `surface` shows the same Paper | The `light` theme: it changes the whole app, the Paper only the Document |
188
- | **Island** | A client-side piece of the View that, after mounting, brings a Block in already rendered HTML to life: the "Copy" button on a code Block, the `island` of a custom Block | A node view: it lives only in the Editor engine |
189
- | **Mount point** | A place in already rendered HTML where an Island mounts a live element: the code Block header that receives the "Copy" button | A Slot: that is a place in the Editor UI for the UI contributions of Tools |
139
+ | Term | Meaning | Not to be confused with |
140
+ | ------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
141
+ | **Editor** | `RichTextEditor` — a rich text input field | A code editor: the kit has none, code is displayed with `CodeView` |
142
+ | **View** | `RichTextView` — read-only display of a saved Document | The Editor's `readOnly` mode: that one carries the engine, the View does not |
143
+ | **Table of contents** | `RichTextToc`: the list of a Document's headings next to the View or the Editor. Collapsed, it is a strip of strokes; expanded, a list; a click on an item goes to the heading | The kit's `Heading` and the navigation of the documentation site |
144
+ | **Document** | The Editor's value: an HTML string constrained by the Schema | The ProseMirror JSON tree in the engine — it is internal; it comes out only as a JSON envelope |
145
+ | **JSON envelope** | A Document as JSON for a file and a template: `{ format: "olddevs-rich-text", version, doc }` (`getJSON()`, `setJSON()`, `defaultValue`), lossless and through the Schema | The Editor's value — the value stays HTML; the bare tree `editor.getJSON()` without an envelope |
146
+ | **Schema** | An allowlist of Blocks, Marks and attributes that the Editor accepts and returns | Server-side sanitization — the consumer does it (`sanitizeRichText`) |
147
+ | **Block** | A structural element of a Document: paragraph, heading, list, table, image… | A Mark |
148
+ | **Mark** | Inline formatting inside a Block: bold, link, color… | A Block |
149
+ | **Atom** | A Block or inline element that is selected, moved and deleted as a whole: an image (the caption inside it is editable), a divider, a soft break, a mention. Always makes the field non-empty | An empty Block: a paragraph without text is not an Atom and does not count as content |
150
+ | **Atom text** | The string that represents an Atom in the Document's text: `getText` and `getSelectedText` return it, its length is the Atom's weight in `maxLength`, and it is how the Atom is exported to Markdown without rules of its own. For an image it is the caption text, for a divider an empty string | A Block attribute |
151
+ | **Layout** | A Block of columns (the `layout` Tool): six variants — from one to four equal columns, 60/40 and 40/60. Top level only, does not nest into itself; a column for its Blocks is the same as a Document | A table: it has data rows and cells, while the columns of a Layout are the Document's page structure. The kit's `Grid`: a screen grid, not a Block |
152
+ | **Wrapper** | A Block that gathers a group of Blocks (the `wrapper` Tool, a `div` with `data-block="wrapper"`): they are moved, duplicated and deleted as one Block. Without a Wrapper tone it has no look of its own — the dashed outline exists only in the Editor. Neither a Wrapper nor a Layout nests into a Wrapper | A quote: it has its own look and meaning in the Document, while a Wrapper without a tone is only grouping |
153
+ | **Wrapper tone** | The styling of a Wrapper as a note (`data-tone`): a background and a stripe on the left in one of five tones of the `Tone` vocabulary — "Note", "Tip", "Important", "Warning", "Caution". Chosen in the "Tone ›" item of the Block handle, the same in the Editor and the View, exported to Markdown as a GitHub alert (what GitHub and Notion call a callout) | The tone of a Field notice (`status` or `error`). Meaning: the tone carries no roles or `aria-*`; the meaning of a note is written as a word in the text |
154
+ | **Collapsible block** | A Block made of a title and content that the reader opens and closes (the `details` Tool, the Details extension from Tiptap; the `details` and `summary` tags). The content is Blocks; there are no Layouts or Wrappers in it. Only the `persist` option writes the open state into the Document | A Wrapper: it groups Blocks and hides nothing. The kit's `Accordion`: that is a screen component, not a Block of the Document |
155
+ | **Toolbar** | A set of formatting buttons; its look is set by `toolbar`. **Fixed** (`fixed`, the default) — above the field, sticks on scroll; **floating** (`floating`) — the same buttons above a non-empty selection. With `bubble` there is no Toolbar — the Selection menu takes its place, with `none` there is neither. On a touch screen the Toolbar is always fixed | The kit's `Toolbar` — the primitive that the Toolbar is built from |
156
+ | **Insert menu** | The "Insert" and "Turn into" list: opens on `/` in the text and on the "+" button | The browser context menu |
157
+ | **Selection menu** | A compact pill on an inverse surface above a non-empty selection: "", lists, bold, italic, underline, color, "…", link, emoji; its contents are fixed by the kit. Appears in place of the Toolbar with `toolbar="bubble"` and on top of the fixed Toolbar — there `selectionMenu={false}` turns it off. Absent on a touch screen | The floating Toolbar: it has the full set of buttons |
158
+ | **Block handle** | The "⋮" on the Block that holds the caret, and its menu of actions on the whole Block: "Add ›", "Format ›", "Move up", "Move down", "Duplicate", "Delete" | The Toolbar: it works with the selection, not with a Block |
159
+ | **Insert item** | A row of the Insert menu: inserts a Block or turns the current one into another. One item is visible on `/`, on "+" and in the Block handle | A Toolbar button |
160
+ | **Block action** | An item of the Block handle menu that works with the whole Block, for example "Duplicate" | A button: it works with the selection |
161
+ | **Shortcuts reference** | A read-only "command — shortcut" popover behind the last button of the fixed Toolbar. The rows are the commands of the enabled Tools, including custom ones; on a phone there is no button | The kit's `CommandPalette`: the rows of the Shortcuts reference are not clickable. The kit's `ShortcutsHelp`: it lists screen shortcuts, not Editor ones |
162
+ | **HTML mode** | The mode of the `source` Tool: the "HTML" button on the fixed Toolbar replaces the Document with a field holding its HTML. The field text passes through the Schema and becomes the Document in a single edit — on leaving the mode, on `blur`, on form submit and on reading through the Handle | The HTML convention: that is the form of custom content in a Document, not a mode. `CodeView`: it displays code, while the HTML field is editable |
163
+ | **Glass** | A semi-transparent background that blurs what is behind it on everything the Editor shows above the Document: the floating Toolbar, the Selection menu, menus, popovers, the Text card. The color is the token of its own surface; with `prefers-reduced-transparency`, `prefers-contrast: more` and on iOS the background is solid | The kit's `Menu` and `Popover` outside the Editor: they stay solid |
164
+ | **UI contribution** | A UI element of a custom Tool, described as data: a button, an Insert item, a Block action or a Text card. The kit renders it in a Slot; a disabled Tool removes its UI contributions as well | A React node in the interface: arbitrary React is allowed only inside the content of a button popover and a Text card |
165
+ | **Slot** | One place on a surface where the UI contributions of custom Tools appear, in `tools` order: the Toolbar group before "Undo", the end of an Insert menu section, the Block handle section before "Delete" | A position relative to a built-in button: the ids of built-ins are not public API |
166
+ | **Preset** | A ready-made set of built-in Tools: `full` or `basic` (`RICH_TEXT_PRESETS`). Not a frozen list: a new built-in arrives in it in a minor version | An exact `tools` list: only the screen changes its composition |
167
+ | **Tool** | One capability of the Editor: its Blocks and Marks, their rules in the Schema and their place in the UI, for example `table`. A built-in one is set by name, a custom one by a description | A button: disabling a Tool also removes its Block from the Schema. A Redactor plugin: that is a class of behavior over the DOM without a Schema |
168
+ | **custom Tool** | A Tool that the consumer describes (`CustomTool`): Schema rules as data, Extensions and UI contributions. It is passed in `tools` mixed in with the kit's names | The kit's internal description: that is a superset of the public shape for built-ins and is not exported |
169
+ | **Tool options** | What the screen sets on a Tool before the engine is created: the starting flags of Find, `offsetVar`, `levels` and `listWidth` of the Table of contents, the `defaults` of a custom Tool (`defineTool`). The screen sets them with a `tool(…)` entry and the kit reads them once, when the engine is created | `options` of a Tiptap extension: the extension's author sets those and the extension itself reads them, while Tool options are set by the screen and read by the kit. The Editor's props (`preset`, `maxHeight`): those configure the field, not a Tool |
170
+ | **Configured Tool** | An entry of `tools` returned by `tool(name, options)` or `tool(definition, options)`: a Tool together with its options. It switches a Tool on without the name in `tools` and wins over a bare name from a Preset | A `defineTool` definition: that describes a Tool, while a Configured Tool is its activation with options. The description of a built-in Tool: it is not exported, and the entry only names the Tool and carries the options |
171
+ | **Tool state** | A data snapshot the screen reads with the `useRichTextToolState(ref, name)` hook: for Find, whether the panel is open, the query, the number of matches and the current one; for the Table of contents, the headings and the current section. The screen re-renders only when the snapshot changes | `storage` of a Tiptap extension: that is a mutable store inside the engine, while Tool state is read-only. `useRichTextEditorState`: that takes a slice of the live Tiptap `editor`, not a Tool's contract |
172
+ | **Tool commands** | What the screen calls on a Tool through `handle.tool(name)`: `tool("search")?.open()`, `tool("toc")?.jumpTo(2)`. Each returns a `boolean`; `null` instead of the commands object means the Tool is not in the set, has no commands, or the engine has not been created yet | Handle methods (`insertHTML`, `focus`): those are common to any `tools`, while Tool commands exist only while the Tool is enabled. `editor.commands` and `commands` in Tiptap: those are engine commands and follow its major |
173
+ | **Consumer prefix** | The start of the name of everything custom — a Tool, its Blocks, Marks and attributes — up to the underscore: `acme_mergeTag`, `data-acme_size`. Kit names have no underscore, so custom names and built-in ones never collide, either in a set or in a Document | A Preset: that is a set of built-in Tools, not a namespace |
174
+ | **HTML convention** | The form of custom content in a Document: a Block is a `div` or `span` with `data-block`, a Mark is a `span` with `data-mark`, attributes are `data-<prefix>_<name>`. Frozen: extended only by adding | The kit's Schema tags (`p`, `table`, `img`): a custom Block cannot take them |
175
+ | **Block trait** | A Block property that only the kit understands, not the engine: "container" (children get their own handle), "can be turned into", "Atom without a formatting menu" | A Block attribute: that one is stored in the Document |
176
+ | **Extensions** | The Tiptap extensions in a Tool description (the `engine` field): Node, Mark, Extension, ProseMirror plugins and NodeView. Supplied directly or through a Loader | Schema rules: those are data, read by the server and the View without an engine. "Engine part": the former name (ADR-0058 uses it) |
177
+ | **Loader** | A function with a dynamic import in place of the Extensions themselves: `engine: () => import(…)`. The heavy built-ins outside `basic` load the same way — the code Block and the table | Preloading (`modulepreload`): the kit does not publish it, the consumer sets it up |
178
+ | **Handle** | Imperative access from screen code to the Editor through `ref`: insert at the caret, read, focus, history, the commands of Tools (`tool(name)`) | Redactor services: those are engine internals, not screen API |
179
+ | **Readiness** | The moment when the engine is created and the Loaders of all enabled Tools, custom and built-in, have finished: from then on Handle methods take effect instead of doing nothing. Happens once per mount; `onReady` reports it | Hydration: after it the engine may still be waiting for Loaders |
180
+ | **Field focus** | Focus inside the Editor as a whole: the Document, the Toolbar, the kit's popovers, the HTML field. Moving between them does not lose Field focus; `onFocus` and `onBlur` are about it | Document focus (the engine's `focus` and `blur`): a click in the Toolbar removes it |
181
+ | **Author edit** | A change to the Document equal to typing on a keyboard: a history step, `onChange` after a delay, the character limit applies. This also covers insert, undo and redo from the Handle | An External replacement |
182
+ | **External replacement** | Replacing the whole Document (`value`, `clear()`, `setMarkdown()`, `setJSON()`): the character limit does not truncate it; `onChange` fires immediately for `clear()`, `setMarkdown()` and `setJSON()`, but not for a new `value` | An Author edit |
183
+ | **Skeleton** | The Editor's look before Readiness: the field frame, a placeholder for the Toolbar and a Document: sanitized by the Schema, it is rendered as static HTML with the same class and rhythm as the engine's Document, without input. On the server — the frame without a Document. A Loader failure turns the Skeleton into a field error with "Retry" | The View: that is a separate read-only component, while the Skeleton is a state of the Editor that the engine replaces. The kit's `Skeleton` component: a loading placeholder |
184
+ | **Status line** | A line inside the field frame under the Document: on the left the screen's content (`status`: word count, "Saved", co-author), on the right the kit's character counter | A Field notice: the line shows a lasting state of the screen, not an event |
185
+ | **Field notice** | One event tied to the field (`showNotice`): tone `status` (only announced) or `error` (a visible line under the field until the next Author edit). A new one replaces the previous one | The kit's toast: that one is global and not tied to a field |
186
+ | **Text card** | A non-modal card under a range of the Document, declared by a custom Tool (`textCards`): a comment, a hint from checking the text. Opens when the caret enters it or on click, focus stays in the text | A button popover: a button opens that one, while a Text card is opened by a place in the Document |
187
+ | **Trigger character** | A character of a custom Tool (`trigger`) that opens a list of items at the caret when typed at the start of a Block or after a space, like `/`: `@` for mentions, `#` for tags. Picking an item replaces the typed `@query` with a custom node | The Insert menu on `/`: that one is built in, while a custom character is set by a Tool |
188
+ | **Paper** | A light area of the Document in any app theme (`surface="paper"`) — for text that leaves the app on a light background: an email, print, PDF. The Toolbar, menus and field frame stay in the app theme; the View with the same `surface` shows the same Paper | The `light` theme: it changes the whole app, the Paper only the Document |
189
+ | **Island** | A client-side piece of the View that, after mounting, brings a Block in already rendered HTML to life: the "Copy" button on a code Block, the `island` of a custom Block | A node view: it lives only in the Editor engine |
190
+ | **Mount point** | A place in already rendered HTML where an Island mounts a live element: the code Block header that receives the "Copy" button | A Slot: that is a place in the Editor UI for the UI contributions of Tools |
191
+
192
+ ## Tiptap
193
+
194
+ Words of the [Tiptap](https://tiptap.dev) engine that the Editor is built on. They are kept as they
195
+ are in Tiptap's documentation: a synonym from another editor (plugin, service) would introduce a
196
+ second meaning next to Block and Tool. The author of a custom Tool writes Extensions in Tiptap
197
+ and reads Tiptap's documentation — the table connects the engine's word to the kit's. In the "Meaning"
198
+ column, first what the word means in Tiptap, then what corresponds to it in the kit.
199
+
200
+ | Term | Meaning | Not to be confused with |
201
+ | ------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
202
+ | **Extension** | A unit of the Tiptap engine: nodes, Marks, commands, keyboard shortcuts and ProseMirror plugins in one class (`Extension.create`; `Node` and `Mark` are its kinds). The kit uses the same word: the Extensions of a Tool are its Tiptap extensions, and a capability as a whole is a Tool. An Extension without a Schema is a Tool without a Block (`search`, `toc`) | A Tool: that one also carries Schema rules, Markdown, the View and UI contributions, while an Extension is only the engine. A Tiptap extension is not passed in `tools`: it goes into the Extensions of a custom Tool |
203
+ | **Node** | A node type in the Tiptap Schema: paragraph, heading, table, image; block or inline. In the kit a block node corresponds to a Block, and an inline node without content to an inline Atom (a mention) | A Block as a whole: a Block is Schema rules as data plus Block traits, which the server and the View read, while a Node is only one of its Extensions |
204
+ | **Mark** | Inline formatting in the Tiptap Schema: bold, link, color. In the kit it is a Mark: Schema rules as data and a `Mark` in the Extensions | The `mark` tag: only the `highlight` Mark renders it. Tiptap's Text Style (an empty `span` for styles) is the base of the `color` Mark, not a Tool of its own |
205
+ | **StarterKit**, **Kit** | A set of Tiptap extensions in one package: StarterKit, ListKit, TableKit, TextStyleKit; each extension of the set is configured or switched off by a key in `configure`. In the kit StarterKit is an internal detail of the engine build: the description of each built-in Tool contributes its share of keys (`starterKit`), the shares are merged into one `StarterKit.configure`, and a key with no share is switched off. What comes out to the screen is a Preset | A Preset (`full`, `basic`): that one is a set of Tools, not of engine extensions, and it is not frozen. The kit of this glossary — the `@olddevs/ui` design system: the word Kit in Tiptap's names has nothing to do with it. `StarterKit` cannot be enabled through `tools` |
206
+ | **options** (`configure`) | Settings of a Tiptap extension: its author declares them in `addOptions`, the consumer changes them with `configure({…})`. In the kit these are Tool options: `tool(name, options)` for `search` and `toc`, `defaults` and `tool(definition, options)` for a custom Tool (`defineTool`). Merging works as in Tiptap v3's `configure`: nested objects are merged, arrays and functions are replaced | The options of Tiptap extensions inside the Extensions: the kit assembles built-in ones itself and does not open them to the screen. The Editor's props (`preset`, `maxHeight`): those configure the field, not a Tool |
207
+ | **storage** | A mutable store of an extension inside the engine (`editor.storage.<name>`): search results, the character count. In the kit it is Tool state: a snapshot that the screen reads with the `useRichTextToolState(ref, name)` hook; a custom Tool declares it with the `state` function in `defineTool` | `editor.storage`: Tool state is read-only, while storage is changed by the extension itself. Storage is part of the engine and follows its major |
208
+ | **commands** | The commands of a Tiptap extension (`addCommands`): `editor.commands`, the `editor.chain()` chain, the `editor.can()` check. In the kit these are Tool commands: `handle.tool(name)`, each returns a `boolean`; a custom Tool declares them with the `commands` function in `defineTool` | `editor.commands` and `chain()`: those are engine commands and follow its major. Handle methods (`insertHTML`, `focus`): those are common to any `tools`, while Tool commands exist only while the Tool is enabled |
209
+ | **`extend`** | The way to change an existing Tiptap extension: `Bold.extend({…})`. The kit has no counterpart: a built-in Tool is not replaced (ADR-0058, item 1.5). If you need other behavior, switch the built-in one off and add your own under a name with the Consumer prefix | `configure`: that one changes options, not behavior; the kit has its counterpart — Tool options. A custom Tool "instead of" a built-in one: it has its own name, its own Blocks and Marks |
210
+ | **`priority`** | A number on a Tiptap extension: the larger it is, the earlier the extension stands in the queue and the earlier its plugins are asked. The kit has no number: the order of built-in Tools is set by the kit itself (the rank of Marks, and with it their nesting in HTML, paste and keys depend on it), and custom ones follow the built-in ones in `tools` order, so their paste and drop handlers are asked before the built-in ones | The order of entries in the Toolbar and the Insert menu: the kit sets it, while the UI contributions of custom Tools stand in a Slot in `tools` order. `priority` of a `parseHTML` rule: that one is the order of parse rules of a single node |
211
+ | **NodeView** | A custom look of a node in the Editor: instead of `renderHTML`, the node is drawn by JavaScript or React code. In the kit it is the node view in the Extensions; in the View, where there is no engine, an Island is its counterpart | An Island: that one brings a Block in already rendered HTML to life without an engine, while a NodeView lives only in the Editor. `renderHTML`: it produces the Document's HTML, while a NodeView is only the look on screen |
212
+ | **MarkView** | The same for a Mark: a custom look of a Mark in the Editor. In the kit it is the Mark's view in the Extensions; a Mark has no Island, and in the View it stays sanitized HTML | NodeView: that one draws a whole node, while a MarkView draws a stretch of text with a Mark. An Island: an Island exists only for a Block |
213
+ | **Decoration** | Styling on top of the Document that does not change it: a highlight, a class on a node, a widget (ProseMirror's `Decoration`). The kit uses the same word: a Decoration lives in the Extensions and does not enter the Document — this is how code highlighting, Find matches and the image upload marker work | A Mark: a Mark is stored in the Document and goes into `value`, a Decoration does not. A Block attribute |
214
+ | **Input rule** | An input rule: typed text matching a pattern is replaced with a node or a Mark (`# ` — a heading, `**…**` — bold). The kit has no separate term: the rule lives in the Extensions of a Block or Mark, and the author of the text sees it as a Markdown shortcut while typing | Markdown export (`getMarkdown`, `setMarkdown`): that converts the whole Document, while an input rule fires on the typed fragment. An Insert item |
215
+ | **Paste rule** | A paste rule: on paste or drop, text matching a pattern (most often a link) becomes a node or a Mark. The kit has the same: a rule in the Extensions of a Tool | Parsing a paste through the Schema: that cuts off what the Schema does not know, while a Paste rule turns matched text into a node. A `parseHTML` rule: that one is about HTML, not text |
216
+ | **Schema** | A description of the nodes and Marks allowed in ProseMirror: which exist and what goes inside what; Tiptap assembles it from extensions. In the kit the Schema has the same meaning plus the allowlist for the sanitizer and the View: the rules lie in a Tool's description as data, and the server and the View read them without an engine, while the engine's Schema is assembled from Extensions | Server-side sanitization: the consumer does it (`sanitizeRichText`). The ProseMirror JSON tree: it is internal |
217
+ | **Transaction** | One change of the ProseMirror engine state: steps over the Document, the selection and metadata; the `chain().run()` chain is one transaction. The kit has no word for it: Tool state is recomputed on every transaction, and an edit made by the `run` of a Block action is one transaction, that is, one undo | An Author edit: that is a change to the Document equal to typing, while a transaction can also happen without changing the Document (selection, metadata). Re-rendering: Tool state re-renders the screen only when the snapshot changed, not on every transaction |