js-draw 1.21.2 → 1.22.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (421) hide show
  1. package/README.md +103 -75
  2. package/build-config.json +2 -2
  3. package/dist/Editor.css +29 -16
  4. package/dist/bundle.js +2 -2
  5. package/dist/bundledStyles.js +1 -1
  6. package/dist/cjs/Editor.js +36 -22
  7. package/dist/cjs/EventDispatcher.js +1 -1
  8. package/dist/cjs/Pointer.js +3 -3
  9. package/dist/cjs/SVGLoader/SVGLoader.js +13 -6
  10. package/dist/cjs/UndoRedoHistory.js +1 -1
  11. package/dist/cjs/Viewport.js +4 -2
  12. package/dist/cjs/commands/Command.js +7 -5
  13. package/dist/cjs/commands/Duplicate.js +2 -2
  14. package/dist/cjs/commands/Erase.js +3 -4
  15. package/dist/cjs/commands/invertCommand.js +4 -4
  16. package/dist/cjs/commands/lib.d.ts +1 -1
  17. package/dist/cjs/commands/uniteCommands.js +4 -4
  18. package/dist/cjs/components/AbstractComponent.d.ts +1 -1
  19. package/dist/cjs/components/AbstractComponent.js +3 -3
  20. package/dist/cjs/components/BackgroundComponent.js +8 -6
  21. package/dist/cjs/components/ImageComponent.js +12 -5
  22. package/dist/cjs/components/RestylableComponent.js +1 -1
  23. package/dist/cjs/components/SVGGlobalAttributesObject.js +1 -2
  24. package/dist/cjs/components/Stroke.js +37 -24
  25. package/dist/cjs/components/TextComponent.js +13 -10
  26. package/dist/cjs/components/UnknownSVGObject.js +2 -3
  27. package/dist/cjs/components/builders/ArrowBuilder.d.ts +6 -0
  28. package/dist/cjs/components/builders/ArrowBuilder.js +9 -3
  29. package/dist/cjs/components/builders/CircleBuilder.d.ts +6 -0
  30. package/dist/cjs/components/builders/CircleBuilder.js +11 -4
  31. package/dist/cjs/components/builders/FreehandLineBuilder.d.ts +6 -0
  32. package/dist/cjs/components/builders/FreehandLineBuilder.js +10 -4
  33. package/dist/cjs/components/builders/LineBuilder.d.ts +6 -0
  34. package/dist/cjs/components/builders/LineBuilder.js +8 -4
  35. package/dist/cjs/components/builders/PolylineBuilder.d.ts +4 -1
  36. package/dist/cjs/components/builders/PolylineBuilder.js +9 -5
  37. package/dist/cjs/components/builders/PressureSensitiveFreehandLineBuilder.js +16 -10
  38. package/dist/cjs/components/builders/RectangleBuilder.d.ts +12 -0
  39. package/dist/cjs/components/builders/RectangleBuilder.js +17 -3
  40. package/dist/cjs/components/builders/autocorrect/makeShapeFitAutocorrect.js +5 -8
  41. package/dist/cjs/components/builders/autocorrect/makeSnapToGridAutocorrect.js +1 -1
  42. package/dist/cjs/components/builders/lib.d.ts +7 -0
  43. package/dist/cjs/components/builders/lib.js +18 -0
  44. package/dist/cjs/components/lib.d.ts +1 -4
  45. package/dist/cjs/components/lib.js +2 -9
  46. package/dist/cjs/components/util/StrokeSmoother.js +5 -6
  47. package/dist/cjs/dialogs/makeAboutDialog.js +1 -1
  48. package/dist/cjs/dialogs/makeMessageDialog.js +2 -2
  49. package/dist/cjs/image/EditorImage.js +13 -15
  50. package/dist/cjs/image/export/editorImageToSVG.js +1 -1
  51. package/dist/cjs/inputEvents.js +3 -3
  52. package/dist/cjs/lib.d.ts +2 -2
  53. package/dist/cjs/localizations/de.js +2 -2
  54. package/dist/cjs/localizations/es.js +7 -3
  55. package/dist/cjs/rendering/Display.js +7 -3
  56. package/dist/cjs/rendering/RenderablePathSpec.js +26 -11
  57. package/dist/cjs/rendering/RenderingStyle.js +22 -15
  58. package/dist/cjs/rendering/TextRenderingStyle.js +1 -1
  59. package/dist/cjs/rendering/caching/CacheRecord.js +1 -1
  60. package/dist/cjs/rendering/caching/CacheRecordManager.js +1 -1
  61. package/dist/cjs/rendering/caching/RenderingCache.js +1 -1
  62. package/dist/cjs/rendering/caching/RenderingCacheNode.js +26 -15
  63. package/dist/cjs/rendering/caching/testUtils.js +2 -2
  64. package/dist/cjs/rendering/renderers/AbstractRenderer.js +3 -1
  65. package/dist/cjs/rendering/renderers/CanvasRenderer.js +4 -3
  66. package/dist/cjs/rendering/renderers/DummyRenderer.js +1 -1
  67. package/dist/cjs/rendering/renderers/SVGRenderer.js +37 -19
  68. package/dist/cjs/rendering/renderers/TextOnlyRenderer.js +13 -15
  69. package/dist/cjs/shortcuts/KeyBinding.js +6 -12
  70. package/dist/cjs/shortcuts/KeyboardShortcutManager.js +2 -2
  71. package/dist/cjs/testing/createEditor.js +6 -1
  72. package/dist/cjs/testing/findNodeWithText.d.ts +4 -1
  73. package/dist/cjs/testing/findNodeWithText.js +12 -3
  74. package/dist/cjs/testing/getUniquePointerId.js +1 -1
  75. package/dist/cjs/testing/sendHtmlSwipe.js +7 -3
  76. package/dist/cjs/testing/sendPenEvent.js +1 -3
  77. package/dist/cjs/testing/sendTouchEvent.js +1 -4
  78. package/dist/cjs/testing/startPinchGesture.js +3 -1
  79. package/dist/cjs/toolbar/AbstractToolbar.js +7 -11
  80. package/dist/cjs/toolbar/EdgeToolbar.js +11 -15
  81. package/dist/cjs/toolbar/IconProvider.js +5 -3
  82. package/dist/cjs/toolbar/localization.js +3 -3
  83. package/dist/cjs/toolbar/utils/HelpDisplay.js +8 -6
  84. package/dist/cjs/toolbar/utils/makeDraggable.js +4 -7
  85. package/dist/cjs/toolbar/widgets/BaseToolWidget.js +3 -2
  86. package/dist/cjs/toolbar/widgets/BaseWidget.js +7 -7
  87. package/dist/cjs/toolbar/widgets/DocumentPropertiesWidget.js +2 -2
  88. package/dist/cjs/toolbar/widgets/EraserToolWidget.js +5 -3
  89. package/dist/cjs/toolbar/widgets/HandToolWidget.js +8 -6
  90. package/dist/cjs/toolbar/widgets/InsertImageWidget/InsertImageWidget.js +9 -10
  91. package/dist/cjs/toolbar/widgets/PenToolWidget.js +22 -13
  92. package/dist/cjs/toolbar/widgets/SelectionToolWidget.js +2 -2
  93. package/dist/cjs/toolbar/widgets/TextToolWidget.js +5 -5
  94. package/dist/cjs/toolbar/widgets/components/makeFileInput.js +7 -7
  95. package/dist/cjs/toolbar/widgets/components/makeGridSelector.js +5 -5
  96. package/dist/cjs/toolbar/widgets/components/makeSnappedList.js +9 -5
  97. package/dist/cjs/toolbar/widgets/keybindings.js +2 -2
  98. package/dist/cjs/toolbar/widgets/layout/DropdownLayoutManager.js +6 -6
  99. package/dist/cjs/tools/BaseTool.d.ts +61 -0
  100. package/dist/cjs/tools/BaseTool.js +181 -0
  101. package/dist/cjs/tools/Eraser.d.ts +60 -0
  102. package/dist/cjs/tools/Eraser.js +304 -0
  103. package/dist/cjs/tools/Eraser.test.d.ts +1 -0
  104. package/dist/cjs/tools/FindTool.d.ts +21 -0
  105. package/dist/cjs/tools/FindTool.js +137 -0
  106. package/dist/cjs/tools/FindTool.test.d.ts +1 -0
  107. package/dist/cjs/tools/InputFilter/ContextMenuRecognizer.d.ts +17 -0
  108. package/dist/cjs/tools/InputFilter/ContextMenuRecognizer.js +103 -0
  109. package/dist/cjs/tools/InputFilter/ContextMenuRecognizer.test.d.ts +1 -0
  110. package/dist/cjs/tools/InputFilter/FunctionMapper.d.ts +12 -0
  111. package/dist/cjs/tools/InputFilter/FunctionMapper.js +21 -0
  112. package/dist/cjs/tools/InputFilter/InputMapper.d.ts +23 -0
  113. package/dist/cjs/tools/InputFilter/InputMapper.js +38 -0
  114. package/dist/cjs/tools/InputFilter/InputPipeline.d.ts +15 -0
  115. package/dist/cjs/tools/InputFilter/InputPipeline.js +54 -0
  116. package/dist/cjs/tools/InputFilter/InputPipeline.test.d.ts +1 -0
  117. package/dist/cjs/tools/InputFilter/InputStabilizer.d.ts +29 -0
  118. package/dist/cjs/tools/InputFilter/InputStabilizer.js +188 -0
  119. package/dist/cjs/tools/InputFilter/StrokeKeyboardControl.d.ts +21 -0
  120. package/dist/cjs/tools/InputFilter/StrokeKeyboardControl.js +87 -0
  121. package/dist/cjs/tools/PanZoom.d.ts +125 -0
  122. package/dist/cjs/tools/PanZoom.js +522 -0
  123. package/dist/cjs/tools/PanZoom.test.d.ts +1 -0
  124. package/dist/cjs/tools/PasteHandler.d.ts +23 -0
  125. package/dist/cjs/tools/PasteHandler.js +115 -0
  126. package/dist/cjs/tools/Pen.d.ts +54 -0
  127. package/dist/cjs/tools/Pen.js +343 -0
  128. package/dist/cjs/tools/Pen.test.d.ts +1 -0
  129. package/dist/cjs/tools/PipetteTool.d.ts +28 -0
  130. package/dist/cjs/tools/PipetteTool.js +69 -0
  131. package/dist/cjs/tools/ScrollbarTool.d.ts +18 -0
  132. package/dist/cjs/tools/ScrollbarTool.js +86 -0
  133. package/dist/cjs/tools/SelectionTool/SelectAllShortcutHandler.d.ts +9 -0
  134. package/dist/cjs/tools/SelectionTool/SelectAllShortcutHandler.js +32 -0
  135. package/dist/cjs/tools/SelectionTool/Selection.d.ts +72 -0
  136. package/dist/cjs/tools/SelectionTool/Selection.js +638 -0
  137. package/dist/cjs/tools/SelectionTool/SelectionHandle.d.ts +62 -0
  138. package/dist/cjs/tools/SelectionTool/SelectionHandle.js +144 -0
  139. package/dist/cjs/tools/SelectionTool/SelectionMenuShortcut.d.ts +32 -0
  140. package/dist/cjs/tools/SelectionTool/SelectionMenuShortcut.js +88 -0
  141. package/dist/cjs/tools/SelectionTool/SelectionTool.d.ts +42 -0
  142. package/dist/cjs/tools/SelectionTool/SelectionTool.js +509 -0
  143. package/dist/cjs/tools/SelectionTool/SelectionTool.selecting.test.d.ts +1 -0
  144. package/dist/cjs/tools/SelectionTool/SelectionTool.test.d.ts +1 -0
  145. package/dist/cjs/tools/SelectionTool/ToPointerAutoscroller.d.ts +23 -0
  146. package/dist/cjs/tools/SelectionTool/ToPointerAutoscroller.js +83 -0
  147. package/dist/cjs/tools/SelectionTool/TransformMode.d.ts +42 -0
  148. package/dist/cjs/tools/SelectionTool/TransformMode.js +154 -0
  149. package/dist/cjs/tools/SelectionTool/keybindings.d.ts +15 -0
  150. package/dist/cjs/tools/SelectionTool/keybindings.js +38 -0
  151. package/dist/cjs/tools/SelectionTool/types.d.ts +35 -0
  152. package/dist/cjs/tools/SelectionTool/types.js +14 -0
  153. package/dist/cjs/tools/SelectionTool/util/makeClipboardErrorHandlers.d.ts +6 -0
  154. package/dist/cjs/tools/SelectionTool/util/makeClipboardErrorHandlers.js +71 -0
  155. package/dist/cjs/tools/SelectionTool/util/showSelectionContextMenu.d.ts +5 -0
  156. package/dist/cjs/tools/SelectionTool/util/showSelectionContextMenu.js +52 -0
  157. package/dist/cjs/tools/SoundUITool.d.ts +26 -0
  158. package/dist/cjs/tools/SoundUITool.js +173 -0
  159. package/dist/cjs/tools/TextTool.d.ts +36 -0
  160. package/dist/cjs/tools/TextTool.js +287 -0
  161. package/dist/cjs/tools/TextTool.test.d.ts +1 -0
  162. package/dist/cjs/tools/ToolController.d.ts +73 -0
  163. package/dist/cjs/tools/ToolController.js +310 -0
  164. package/dist/cjs/tools/ToolController.test.d.ts +1 -0
  165. package/dist/cjs/tools/ToolEnabledGroup.d.ts +6 -0
  166. package/dist/cjs/tools/ToolEnabledGroup.js +13 -0
  167. package/dist/cjs/tools/ToolSwitcherShortcut.d.ts +16 -0
  168. package/dist/cjs/tools/ToolSwitcherShortcut.js +40 -0
  169. package/dist/cjs/tools/ToolbarShortcutHandler.d.ts +12 -0
  170. package/dist/cjs/tools/ToolbarShortcutHandler.js +34 -0
  171. package/dist/cjs/tools/UndoRedoShortcut.d.ts +8 -0
  172. package/dist/cjs/tools/UndoRedoShortcut.js +27 -0
  173. package/dist/cjs/tools/UndoRedoShortcut.test.d.ts +1 -0
  174. package/dist/cjs/tools/keybindings.d.ts +16 -0
  175. package/dist/cjs/tools/keybindings.js +58 -0
  176. package/dist/cjs/tools/lib.d.ts +14 -0
  177. package/dist/cjs/tools/lib.js +36 -0
  178. package/dist/cjs/tools/localization.d.ts +45 -0
  179. package/dist/cjs/tools/localization.js +47 -0
  180. package/dist/cjs/tools/util/StationaryPenDetector.d.ts +25 -0
  181. package/dist/cjs/tools/util/StationaryPenDetector.js +107 -0
  182. package/dist/cjs/tools/util/createMenuOverlay.d.ts +10 -0
  183. package/dist/cjs/tools/util/createMenuOverlay.js +126 -0
  184. package/dist/cjs/tools/util/createMenuOverlay.test.d.ts +1 -0
  185. package/dist/cjs/util/ClipboardHandler.d.ts +1 -1
  186. package/dist/cjs/util/ClipboardHandler.js +19 -18
  187. package/dist/cjs/util/ReactiveValue.js +16 -12
  188. package/dist/cjs/util/adjustEditorThemeForContrast.js +6 -2
  189. package/dist/cjs/util/guessKeyCodeFromKey.js +1 -1
  190. package/dist/cjs/util/listenForKeyboardEventsFrom.js +8 -6
  191. package/dist/cjs/util/waitForAll.js +3 -3
  192. package/dist/cjs/util/waitForImageLoaded.js +3 -3
  193. package/dist/cjs/util/waitForTimeout.js +1 -1
  194. package/dist/cjs/version.js +1 -1
  195. package/dist/mjs/Editor.mjs +37 -23
  196. package/dist/mjs/EventDispatcher.mjs +1 -1
  197. package/dist/mjs/Pointer.mjs +3 -3
  198. package/dist/mjs/SVGLoader/SVGLoader.mjs +14 -7
  199. package/dist/mjs/UndoRedoHistory.mjs +1 -1
  200. package/dist/mjs/Viewport.mjs +4 -2
  201. package/dist/mjs/commands/Command.mjs +7 -5
  202. package/dist/mjs/commands/Duplicate.mjs +2 -2
  203. package/dist/mjs/commands/Erase.mjs +3 -4
  204. package/dist/mjs/commands/invertCommand.mjs +4 -4
  205. package/dist/mjs/commands/lib.d.ts +1 -1
  206. package/dist/mjs/commands/lib.mjs +1 -1
  207. package/dist/mjs/commands/uniteCommands.mjs +4 -4
  208. package/dist/mjs/components/AbstractComponent.d.ts +1 -1
  209. package/dist/mjs/components/AbstractComponent.mjs +3 -3
  210. package/dist/mjs/components/BackgroundComponent.mjs +10 -8
  211. package/dist/mjs/components/ImageComponent.mjs +12 -5
  212. package/dist/mjs/components/RestylableComponent.mjs +2 -2
  213. package/dist/mjs/components/SVGGlobalAttributesObject.mjs +1 -2
  214. package/dist/mjs/components/Stroke.mjs +40 -27
  215. package/dist/mjs/components/TextComponent.mjs +15 -12
  216. package/dist/mjs/components/UnknownSVGObject.mjs +2 -3
  217. package/dist/mjs/components/builders/ArrowBuilder.d.ts +6 -0
  218. package/dist/mjs/components/builders/ArrowBuilder.mjs +9 -3
  219. package/dist/mjs/components/builders/CircleBuilder.d.ts +6 -0
  220. package/dist/mjs/components/builders/CircleBuilder.mjs +11 -4
  221. package/dist/mjs/components/builders/FreehandLineBuilder.d.ts +6 -0
  222. package/dist/mjs/components/builders/FreehandLineBuilder.mjs +10 -4
  223. package/dist/mjs/components/builders/LineBuilder.d.ts +6 -0
  224. package/dist/mjs/components/builders/LineBuilder.mjs +8 -4
  225. package/dist/mjs/components/builders/PolylineBuilder.d.ts +4 -1
  226. package/dist/mjs/components/builders/PolylineBuilder.mjs +10 -6
  227. package/dist/mjs/components/builders/PressureSensitiveFreehandLineBuilder.mjs +17 -11
  228. package/dist/mjs/components/builders/RectangleBuilder.d.ts +12 -0
  229. package/dist/mjs/components/builders/RectangleBuilder.mjs +17 -3
  230. package/dist/mjs/components/builders/autocorrect/makeShapeFitAutocorrect.mjs +5 -8
  231. package/dist/mjs/components/builders/autocorrect/makeSnapToGridAutocorrect.mjs +1 -1
  232. package/dist/mjs/components/builders/lib.d.ts +7 -0
  233. package/dist/mjs/components/builders/lib.mjs +7 -0
  234. package/dist/mjs/components/lib.d.ts +1 -4
  235. package/dist/mjs/components/lib.mjs +2 -5
  236. package/dist/mjs/components/util/StrokeSmoother.mjs +5 -6
  237. package/dist/mjs/dialogs/makeAboutDialog.mjs +1 -1
  238. package/dist/mjs/dialogs/makeMessageDialog.mjs +2 -2
  239. package/dist/mjs/image/EditorImage.mjs +13 -15
  240. package/dist/mjs/image/export/editorImageToSVG.mjs +1 -1
  241. package/dist/mjs/inputEvents.mjs +3 -3
  242. package/dist/mjs/lib.d.ts +2 -2
  243. package/dist/mjs/lib.mjs +2 -2
  244. package/dist/mjs/localization.mjs +2 -2
  245. package/dist/mjs/localizations/de.mjs +2 -2
  246. package/dist/mjs/localizations/es.mjs +7 -3
  247. package/dist/mjs/rendering/Display.mjs +7 -3
  248. package/dist/mjs/rendering/RenderablePathSpec.mjs +26 -11
  249. package/dist/mjs/rendering/RenderingStyle.mjs +22 -15
  250. package/dist/mjs/rendering/TextRenderingStyle.mjs +1 -1
  251. package/dist/mjs/rendering/caching/CacheRecord.mjs +1 -1
  252. package/dist/mjs/rendering/caching/CacheRecordManager.mjs +1 -1
  253. package/dist/mjs/rendering/caching/RenderingCache.mjs +1 -1
  254. package/dist/mjs/rendering/caching/RenderingCacheNode.mjs +26 -15
  255. package/dist/mjs/rendering/caching/testUtils.mjs +2 -2
  256. package/dist/mjs/rendering/renderers/AbstractRenderer.mjs +3 -1
  257. package/dist/mjs/rendering/renderers/CanvasRenderer.mjs +4 -3
  258. package/dist/mjs/rendering/renderers/DummyRenderer.mjs +1 -1
  259. package/dist/mjs/rendering/renderers/SVGRenderer.mjs +38 -20
  260. package/dist/mjs/rendering/renderers/TextOnlyRenderer.mjs +13 -15
  261. package/dist/mjs/shortcuts/KeyBinding.mjs +6 -12
  262. package/dist/mjs/shortcuts/KeyboardShortcutManager.mjs +2 -2
  263. package/dist/mjs/testing/createEditor.mjs +6 -1
  264. package/dist/mjs/testing/findNodeWithText.d.ts +4 -1
  265. package/dist/mjs/testing/findNodeWithText.mjs +12 -3
  266. package/dist/mjs/testing/getUniquePointerId.mjs +1 -1
  267. package/dist/mjs/testing/sendHtmlSwipe.mjs +7 -3
  268. package/dist/mjs/testing/sendPenEvent.mjs +1 -3
  269. package/dist/mjs/testing/sendTouchEvent.mjs +1 -4
  270. package/dist/mjs/testing/startPinchGesture.mjs +3 -1
  271. package/dist/mjs/toolbar/AbstractToolbar.mjs +7 -11
  272. package/dist/mjs/toolbar/EdgeToolbar.mjs +11 -15
  273. package/dist/mjs/toolbar/IconProvider.mjs +5 -3
  274. package/dist/mjs/toolbar/localization.mjs +3 -3
  275. package/dist/mjs/toolbar/utils/HelpDisplay.mjs +8 -6
  276. package/dist/mjs/toolbar/utils/makeDraggable.mjs +4 -7
  277. package/dist/mjs/toolbar/widgets/BaseToolWidget.mjs +3 -2
  278. package/dist/mjs/toolbar/widgets/BaseWidget.mjs +8 -8
  279. package/dist/mjs/toolbar/widgets/DocumentPropertiesWidget.mjs +2 -2
  280. package/dist/mjs/toolbar/widgets/EraserToolWidget.mjs +5 -3
  281. package/dist/mjs/toolbar/widgets/HandToolWidget.mjs +8 -6
  282. package/dist/mjs/toolbar/widgets/InsertImageWidget/InsertImageWidget.mjs +9 -10
  283. package/dist/mjs/toolbar/widgets/PenToolWidget.mjs +23 -14
  284. package/dist/mjs/toolbar/widgets/SelectionToolWidget.mjs +2 -2
  285. package/dist/mjs/toolbar/widgets/TextToolWidget.mjs +5 -5
  286. package/dist/mjs/toolbar/widgets/components/makeFileInput.mjs +7 -7
  287. package/dist/mjs/toolbar/widgets/components/makeGridSelector.mjs +5 -5
  288. package/dist/mjs/toolbar/widgets/components/makeSnappedList.mjs +9 -5
  289. package/dist/mjs/toolbar/widgets/keybindings.mjs +2 -2
  290. package/dist/mjs/toolbar/widgets/layout/DropdownLayoutManager.mjs +6 -6
  291. package/dist/mjs/tools/BaseTool.d.ts +61 -0
  292. package/dist/mjs/tools/BaseTool.mjs +179 -0
  293. package/dist/mjs/tools/Eraser.d.ts +60 -0
  294. package/dist/mjs/tools/Eraser.mjs +297 -0
  295. package/dist/mjs/tools/Eraser.test.d.ts +1 -0
  296. package/dist/mjs/tools/FindTool.d.ts +21 -0
  297. package/dist/mjs/tools/FindTool.mjs +131 -0
  298. package/dist/mjs/tools/FindTool.test.d.ts +1 -0
  299. package/dist/mjs/tools/InputFilter/ContextMenuRecognizer.d.ts +17 -0
  300. package/dist/mjs/tools/InputFilter/ContextMenuRecognizer.mjs +74 -0
  301. package/dist/mjs/tools/InputFilter/ContextMenuRecognizer.test.d.ts +1 -0
  302. package/dist/mjs/tools/InputFilter/FunctionMapper.d.ts +12 -0
  303. package/dist/mjs/tools/InputFilter/FunctionMapper.mjs +15 -0
  304. package/dist/mjs/tools/InputFilter/InputMapper.d.ts +23 -0
  305. package/dist/mjs/tools/InputFilter/InputMapper.mjs +36 -0
  306. package/dist/mjs/tools/InputFilter/InputPipeline.d.ts +15 -0
  307. package/dist/mjs/tools/InputFilter/InputPipeline.mjs +49 -0
  308. package/dist/mjs/tools/InputFilter/InputPipeline.test.d.ts +1 -0
  309. package/dist/mjs/tools/InputFilter/InputStabilizer.d.ts +29 -0
  310. package/dist/mjs/tools/InputFilter/InputStabilizer.mjs +182 -0
  311. package/dist/mjs/tools/InputFilter/StrokeKeyboardControl.d.ts +21 -0
  312. package/dist/mjs/tools/InputFilter/StrokeKeyboardControl.mjs +81 -0
  313. package/dist/mjs/tools/PanZoom.d.ts +125 -0
  314. package/dist/mjs/tools/PanZoom.mjs +515 -0
  315. package/dist/mjs/tools/PanZoom.test.d.ts +1 -0
  316. package/dist/mjs/tools/PasteHandler.d.ts +23 -0
  317. package/dist/mjs/tools/PasteHandler.mjs +109 -0
  318. package/dist/mjs/tools/Pen.d.ts +54 -0
  319. package/dist/mjs/tools/Pen.mjs +314 -0
  320. package/dist/mjs/tools/Pen.test.d.ts +1 -0
  321. package/dist/mjs/tools/PipetteTool.d.ts +28 -0
  322. package/dist/mjs/tools/PipetteTool.mjs +63 -0
  323. package/dist/mjs/tools/ScrollbarTool.d.ts +18 -0
  324. package/dist/mjs/tools/ScrollbarTool.mjs +80 -0
  325. package/dist/mjs/tools/SelectionTool/SelectAllShortcutHandler.d.ts +9 -0
  326. package/dist/mjs/tools/SelectionTool/SelectAllShortcutHandler.mjs +26 -0
  327. package/dist/mjs/tools/SelectionTool/Selection.d.ts +72 -0
  328. package/dist/mjs/tools/SelectionTool/Selection.mjs +610 -0
  329. package/dist/mjs/tools/SelectionTool/SelectionHandle.d.ts +62 -0
  330. package/dist/mjs/tools/SelectionTool/SelectionHandle.mjs +140 -0
  331. package/dist/mjs/tools/SelectionTool/SelectionMenuShortcut.d.ts +32 -0
  332. package/dist/mjs/tools/SelectionTool/SelectionMenuShortcut.mjs +85 -0
  333. package/dist/mjs/tools/SelectionTool/SelectionTool.d.ts +42 -0
  334. package/dist/mjs/tools/SelectionTool/SelectionTool.mjs +502 -0
  335. package/dist/mjs/tools/SelectionTool/SelectionTool.selecting.test.d.ts +1 -0
  336. package/dist/mjs/tools/SelectionTool/SelectionTool.test.d.ts +1 -0
  337. package/dist/mjs/tools/SelectionTool/ToPointerAutoscroller.d.ts +23 -0
  338. package/dist/mjs/tools/SelectionTool/ToPointerAutoscroller.mjs +77 -0
  339. package/dist/mjs/tools/SelectionTool/TransformMode.d.ts +42 -0
  340. package/dist/mjs/tools/SelectionTool/TransformMode.mjs +145 -0
  341. package/dist/mjs/tools/SelectionTool/keybindings.d.ts +15 -0
  342. package/dist/mjs/tools/SelectionTool/keybindings.mjs +32 -0
  343. package/dist/mjs/tools/SelectionTool/types.d.ts +35 -0
  344. package/dist/mjs/tools/SelectionTool/types.mjs +11 -0
  345. package/dist/mjs/tools/SelectionTool/util/makeClipboardErrorHandlers.d.ts +6 -0
  346. package/dist/mjs/tools/SelectionTool/util/makeClipboardErrorHandlers.mjs +66 -0
  347. package/dist/mjs/tools/SelectionTool/util/showSelectionContextMenu.d.ts +5 -0
  348. package/dist/mjs/tools/SelectionTool/util/showSelectionContextMenu.mjs +47 -0
  349. package/dist/mjs/tools/SoundUITool.d.ts +26 -0
  350. package/dist/mjs/tools/SoundUITool.mjs +167 -0
  351. package/dist/mjs/tools/TextTool.d.ts +36 -0
  352. package/dist/mjs/tools/TextTool.mjs +281 -0
  353. package/dist/mjs/tools/TextTool.test.d.ts +1 -0
  354. package/dist/mjs/tools/ToolController.d.ts +73 -0
  355. package/dist/mjs/tools/ToolController.mjs +281 -0
  356. package/dist/mjs/tools/ToolController.test.d.ts +1 -0
  357. package/dist/mjs/tools/ToolEnabledGroup.d.ts +6 -0
  358. package/dist/mjs/tools/ToolEnabledGroup.mjs +10 -0
  359. package/dist/mjs/tools/ToolSwitcherShortcut.d.ts +16 -0
  360. package/dist/mjs/tools/ToolSwitcherShortcut.mjs +34 -0
  361. package/dist/mjs/tools/ToolbarShortcutHandler.d.ts +12 -0
  362. package/dist/mjs/tools/ToolbarShortcutHandler.mjs +28 -0
  363. package/dist/mjs/tools/UndoRedoShortcut.d.ts +8 -0
  364. package/dist/mjs/tools/UndoRedoShortcut.mjs +21 -0
  365. package/dist/mjs/tools/UndoRedoShortcut.test.d.ts +1 -0
  366. package/dist/mjs/tools/keybindings.d.ts +16 -0
  367. package/dist/mjs/tools/keybindings.mjs +38 -0
  368. package/dist/mjs/tools/lib.d.ts +14 -0
  369. package/dist/mjs/tools/lib.mjs +14 -0
  370. package/dist/mjs/tools/localization.d.ts +45 -0
  371. package/dist/mjs/tools/localization.mjs +44 -0
  372. package/dist/mjs/tools/util/StationaryPenDetector.d.ts +25 -0
  373. package/dist/mjs/tools/util/StationaryPenDetector.mjs +103 -0
  374. package/dist/mjs/tools/util/createMenuOverlay.d.ts +10 -0
  375. package/dist/mjs/tools/util/createMenuOverlay.mjs +121 -0
  376. package/dist/mjs/tools/util/createMenuOverlay.test.d.ts +1 -0
  377. package/dist/mjs/util/ClipboardHandler.d.ts +1 -1
  378. package/dist/mjs/util/ClipboardHandler.mjs +19 -18
  379. package/dist/mjs/util/ReactiveValue.mjs +16 -12
  380. package/dist/mjs/util/adjustEditorThemeForContrast.mjs +6 -2
  381. package/dist/mjs/util/guessKeyCodeFromKey.mjs +1 -1
  382. package/dist/mjs/util/listenForKeyboardEventsFrom.mjs +8 -6
  383. package/dist/mjs/util/waitForAll.mjs +3 -3
  384. package/dist/mjs/util/waitForImageLoaded.mjs +3 -3
  385. package/dist/mjs/util/waitForTimeout.mjs +1 -1
  386. package/dist/mjs/version.mjs +1 -1
  387. package/package.json +88 -88
  388. package/src/Coloris.css +6 -6
  389. package/src/Editor.scss +7 -5
  390. package/src/dialogs/dialogs.scss +3 -4
  391. package/src/dialogs/makeAboutDialog.scss +2 -2
  392. package/src/dialogs/makeMessageDialog.scss +11 -7
  393. package/src/styles.js +1 -1
  394. package/src/toolbar/AbstractToolbar.scss +20 -12
  395. package/src/toolbar/DropdownToolbar.scss +5 -4
  396. package/src/toolbar/EdgeToolbar.scss +65 -31
  397. package/src/toolbar/toolbar.scss +5 -5
  398. package/src/toolbar/utils/HelpDisplay.scss +48 -25
  399. package/src/toolbar/utils/labelVisibleOnHover.scss +39 -16
  400. package/src/toolbar/widgets/DocumentPropertiesWidget.scss +0 -1
  401. package/src/toolbar/widgets/HandToolWidget.scss +0 -1
  402. package/src/toolbar/widgets/InsertImageWidget/InsertImageWidget.scss +2 -3
  403. package/src/toolbar/widgets/OverflowWidget.css +1 -2
  404. package/src/toolbar/widgets/PenToolWidget.scss +0 -2
  405. package/src/toolbar/widgets/SelectionToolWidget.scss +1 -2
  406. package/src/toolbar/widgets/components/components.scss +6 -6
  407. package/src/toolbar/widgets/components/makeColorInput.scss +0 -2
  408. package/src/toolbar/widgets/components/makeFileInput.scss +5 -7
  409. package/src/toolbar/widgets/components/makeGridSelector.scss +6 -9
  410. package/src/toolbar/widgets/components/makeSnappedList.scss +3 -4
  411. package/src/toolbar/widgets/components/makeThicknessSlider.scss +1 -2
  412. package/src/toolbar/widgets/widgets.scss +7 -7
  413. package/src/tools/FindTool.css +6 -0
  414. package/src/tools/ScrollbarTool.scss +61 -0
  415. package/src/tools/SelectionTool/SelectionTool.scss +173 -0
  416. package/src/tools/SelectionTool/util/makeClipboardErrorHandlers.scss +14 -0
  417. package/src/tools/SoundUITool.scss +22 -0
  418. package/src/tools/tools.scss +5 -0
  419. package/src/tools/util/createMenuOverlay.scss +73 -0
  420. package/tsconfig.json +1 -3
  421. package/typedoc.json +1 -1
@@ -0,0 +1,304 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.EraserMode = void 0;
7
+ const types_1 = require("../types");
8
+ const BaseTool_1 = __importDefault(require("./BaseTool"));
9
+ const math_1 = require("@js-draw/math");
10
+ const Erase_1 = __importDefault(require("../commands/Erase"));
11
+ const Pointer_1 = require("../Pointer");
12
+ const keybindings_1 = require("./keybindings");
13
+ const ReactiveValue_1 = require("../util/ReactiveValue");
14
+ const EditorImage_1 = __importDefault(require("../image/EditorImage"));
15
+ const uniteCommands_1 = __importDefault(require("../commands/uniteCommands"));
16
+ const RenderablePathSpec_1 = require("../rendering/RenderablePathSpec");
17
+ var EraserMode;
18
+ (function (EraserMode) {
19
+ EraserMode["PartialStroke"] = "partial-stroke";
20
+ EraserMode["FullStroke"] = "full-stroke";
21
+ })(EraserMode || (exports.EraserMode = EraserMode = {}));
22
+ /** Handles switching from other primary tools to the eraser and back */
23
+ class EraserSwitcher extends BaseTool_1.default {
24
+ constructor(editor, eraser) {
25
+ super(editor.notifier, editor.localization.changeTool);
26
+ this.editor = editor;
27
+ this.eraser = eraser;
28
+ }
29
+ onPointerDown(event) {
30
+ if (event.allPointers.length === 1 && event.current.device === Pointer_1.PointerDevice.Eraser) {
31
+ const toolController = this.editor.toolController;
32
+ const enabledPrimaryTools = toolController
33
+ .getPrimaryTools()
34
+ .filter((tool) => tool.isEnabled());
35
+ if (enabledPrimaryTools.length) {
36
+ this.previousEnabledTool = enabledPrimaryTools[0];
37
+ }
38
+ else {
39
+ this.previousEnabledTool = null;
40
+ }
41
+ this.previousEraserEnabledState = this.eraser.isEnabled();
42
+ this.eraser.setEnabled(true);
43
+ if (this.eraser.onPointerDown(event)) {
44
+ return true;
45
+ }
46
+ else {
47
+ this.restoreOriginalTool();
48
+ }
49
+ }
50
+ return false;
51
+ }
52
+ onPointerMove(event) {
53
+ this.eraser.onPointerMove(event);
54
+ }
55
+ restoreOriginalTool() {
56
+ this.eraser.setEnabled(this.previousEraserEnabledState);
57
+ if (this.previousEnabledTool) {
58
+ this.previousEnabledTool.setEnabled(true);
59
+ }
60
+ }
61
+ onPointerUp(event) {
62
+ this.eraser.onPointerUp(event);
63
+ this.restoreOriginalTool();
64
+ }
65
+ onGestureCancel(event) {
66
+ this.eraser.onGestureCancel(event);
67
+ this.restoreOriginalTool();
68
+ }
69
+ }
70
+ /**
71
+ * A tool that allows a user to erase parts of an image.
72
+ */
73
+ class Eraser extends BaseTool_1.default {
74
+ constructor(editor, description, options) {
75
+ super(editor.notifier, description);
76
+ this.editor = editor;
77
+ this.lastPoint = null;
78
+ this.isFirstEraseEvt = true;
79
+ this.toAdd = new Set();
80
+ // Commands that each remove one element
81
+ this.eraseCommands = [];
82
+ this.addCommands = [];
83
+ this.thickness = options?.thickness ?? 10;
84
+ this.thicknessValue = ReactiveValue_1.ReactiveValue.fromInitialValue(this.thickness);
85
+ this.thicknessValue.onUpdate((value) => {
86
+ this.thickness = value;
87
+ this.editor.notifier.dispatch(types_1.EditorEventType.ToolUpdated, {
88
+ kind: types_1.EditorEventType.ToolUpdated,
89
+ tool: this,
90
+ });
91
+ });
92
+ this.modeValue = ReactiveValue_1.ReactiveValue.fromInitialValue(options?.mode ?? EraserMode.FullStroke);
93
+ this.modeValue.onUpdate((_value) => {
94
+ this.editor.notifier.dispatch(types_1.EditorEventType.ToolUpdated, {
95
+ kind: types_1.EditorEventType.ToolUpdated,
96
+ tool: this,
97
+ });
98
+ });
99
+ }
100
+ /**
101
+ * @returns a tool that briefly enables the eraser when a physical eraser is used.
102
+ * This tool should be added to the tool list after the primary tools.
103
+ */
104
+ makeEraserSwitcherTool() {
105
+ return new EraserSwitcher(this.editor, this);
106
+ }
107
+ clearPreview() {
108
+ this.editor.clearWetInk();
109
+ }
110
+ getSizeOnCanvas() {
111
+ return this.thickness / this.editor.viewport.getScaleFactor();
112
+ }
113
+ drawPreviewAt(point) {
114
+ this.clearPreview();
115
+ const size = this.getSizeOnCanvas();
116
+ const renderer = this.editor.display.getWetInkRenderer();
117
+ const rect = this.getEraserRect(point);
118
+ const rect2 = this.getEraserRect(this.lastPoint ?? point);
119
+ const fill = {
120
+ fill: math_1.Color4.transparent,
121
+ stroke: { width: size / 10, color: math_1.Color4.gray },
122
+ };
123
+ renderer.drawPath((0, RenderablePathSpec_1.pathToRenderable)(math_1.Path.fromConvexHullOf([...rect.corners, ...rect2.corners]), fill));
124
+ }
125
+ /**
126
+ * @returns the eraser rectangle in canvas coordinates.
127
+ *
128
+ * For now, all erasers are rectangles or points.
129
+ */
130
+ getEraserRect(centerPoint) {
131
+ const size = this.getSizeOnCanvas();
132
+ const halfSize = math_1.Vec2.of(size / 2, size / 2);
133
+ return math_1.Rect2.fromCorners(centerPoint.minus(halfSize), centerPoint.plus(halfSize));
134
+ }
135
+ /** Erases in a line from the last point to the current. */
136
+ eraseTo(currentPoint) {
137
+ if (!this.isFirstEraseEvt && currentPoint.distanceTo(this.lastPoint) === 0) {
138
+ return;
139
+ }
140
+ this.isFirstEraseEvt = false;
141
+ // Currently only objects within eraserRect or that intersect a straight line
142
+ // from the center of the current rect to the previous are erased. TODO: Erase
143
+ // all objects as if there were pointerMove events between the two points.
144
+ const eraserRect = this.getEraserRect(currentPoint);
145
+ const line = new math_1.LineSegment2(this.lastPoint, currentPoint);
146
+ const region = math_1.Rect2.union(line.bbox, eraserRect);
147
+ const intersectingElems = this.editor.image
148
+ .getElementsIntersectingRegion(region)
149
+ .filter((component) => {
150
+ return component.intersects(line) || component.intersectsRect(eraserRect);
151
+ });
152
+ // Only erase components that could be selected (and thus interacted with)
153
+ // by the user.
154
+ const eraseableElems = intersectingElems.filter((elem) => elem.isSelectable());
155
+ if (this.modeValue.get() === EraserMode.FullStroke) {
156
+ // Remove any intersecting elements.
157
+ this.toRemove.push(...eraseableElems);
158
+ // Create new Erase commands for the now-to-be-erased elements and apply them.
159
+ const newPartialCommands = eraseableElems.map((elem) => new Erase_1.default([elem]));
160
+ newPartialCommands.forEach((cmd) => cmd.apply(this.editor));
161
+ this.eraseCommands.push(...newPartialCommands);
162
+ }
163
+ else {
164
+ const toErase = [];
165
+ const toAdd = [];
166
+ for (const targetElem of eraseableElems) {
167
+ toErase.push(targetElem);
168
+ // Completely delete items that can't be divided.
169
+ if (!targetElem.withRegionErased) {
170
+ continue;
171
+ }
172
+ // Completely delete items that are completely or almost completely
173
+ // contained within the eraser.
174
+ const grownRect = eraserRect.grownBy(eraserRect.maxDimension / 3);
175
+ if (grownRect.containsRect(targetElem.getExactBBox())) {
176
+ continue;
177
+ }
178
+ // Join the current and previous rectangles so that points between events are also
179
+ // erased.
180
+ const erasePath = math_1.Path.fromConvexHullOf([
181
+ ...eraserRect.corners,
182
+ ...this.getEraserRect(this.lastPoint ?? currentPoint).corners,
183
+ ].map((p) => this.editor.viewport.roundPoint(p)));
184
+ toAdd.push(...targetElem.withRegionErased(erasePath, this.editor.viewport));
185
+ }
186
+ const eraseCommand = new Erase_1.default(toErase);
187
+ const newAddCommands = toAdd.map((elem) => EditorImage_1.default.addElement(elem));
188
+ eraseCommand.apply(this.editor);
189
+ newAddCommands.forEach((command) => command.apply(this.editor));
190
+ const finalToErase = [];
191
+ for (const item of toErase) {
192
+ if (this.toAdd.has(item)) {
193
+ this.toAdd.delete(item);
194
+ }
195
+ else {
196
+ finalToErase.push(item);
197
+ }
198
+ }
199
+ this.toRemove.push(...finalToErase);
200
+ for (const item of toAdd) {
201
+ this.toAdd.add(item);
202
+ }
203
+ this.eraseCommands.push(new Erase_1.default(finalToErase));
204
+ this.addCommands.push(...newAddCommands);
205
+ }
206
+ this.drawPreviewAt(currentPoint);
207
+ this.lastPoint = currentPoint;
208
+ }
209
+ onPointerDown(event) {
210
+ if (event.allPointers.length === 1 || event.current.device === Pointer_1.PointerDevice.Eraser) {
211
+ this.lastPoint = event.current.canvasPos;
212
+ this.toRemove = [];
213
+ this.toAdd.clear();
214
+ this.isFirstEraseEvt = true;
215
+ this.drawPreviewAt(event.current.canvasPos);
216
+ return true;
217
+ }
218
+ return false;
219
+ }
220
+ onPointerMove(event) {
221
+ const currentPoint = event.current.canvasPos;
222
+ this.eraseTo(currentPoint);
223
+ }
224
+ onPointerUp(event) {
225
+ this.eraseTo(event.current.canvasPos);
226
+ const commands = [];
227
+ if (this.addCommands.length > 0) {
228
+ this.addCommands.forEach((cmd) => cmd.unapply(this.editor));
229
+ // Remove items from toAdd that are also present in toRemove -- adding, then
230
+ // removing these does nothing, and can break undo/redo.
231
+ for (const item of this.toAdd) {
232
+ if (this.toRemove.includes(item)) {
233
+ this.toAdd.delete(item);
234
+ this.toRemove = this.toRemove.filter((other) => other !== item);
235
+ }
236
+ }
237
+ for (const item of this.toRemove) {
238
+ if (this.toAdd.has(item)) {
239
+ this.toAdd.delete(item);
240
+ this.toRemove = this.toRemove.filter((other) => other !== item);
241
+ }
242
+ }
243
+ commands.push(...[...this.toAdd].map((a) => EditorImage_1.default.addElement(a)));
244
+ this.addCommands = [];
245
+ }
246
+ if (this.eraseCommands.length > 0) {
247
+ // Undo commands for each individual component and unite into a single command.
248
+ this.eraseCommands.forEach((cmd) => cmd.unapply(this.editor));
249
+ this.eraseCommands = [];
250
+ const command = new Erase_1.default(this.toRemove);
251
+ commands.push(command);
252
+ }
253
+ if (commands.length === 1) {
254
+ this.editor.dispatch(commands[0]); // dispatch: Makes undo-able.
255
+ }
256
+ else {
257
+ this.editor.dispatch((0, uniteCommands_1.default)(commands));
258
+ }
259
+ this.clearPreview();
260
+ }
261
+ onGestureCancel(_event) {
262
+ this.addCommands.forEach((cmd) => cmd.unapply(this.editor));
263
+ this.eraseCommands.forEach((cmd) => cmd.unapply(this.editor));
264
+ this.eraseCommands = [];
265
+ this.addCommands = [];
266
+ this.clearPreview();
267
+ }
268
+ onKeyPress(event) {
269
+ const shortcuts = this.editor.shortcuts;
270
+ let newThickness;
271
+ if (shortcuts.matchesShortcut(keybindings_1.decreaseSizeKeyboardShortcutId, event)) {
272
+ newThickness = (this.getThickness() * 2) / 3;
273
+ }
274
+ else if (shortcuts.matchesShortcut(keybindings_1.increaseSizeKeyboardShortcutId, event)) {
275
+ newThickness = (this.getThickness() * 3) / 2;
276
+ }
277
+ if (newThickness !== undefined) {
278
+ newThickness = Math.min(Math.max(1, newThickness), 200);
279
+ this.setThickness(newThickness);
280
+ return true;
281
+ }
282
+ return false;
283
+ }
284
+ /** Returns the side-length of the tip of this eraser. */
285
+ getThickness() {
286
+ return this.thickness;
287
+ }
288
+ /** Sets the side-length of this' tip. */
289
+ setThickness(thickness) {
290
+ this.thicknessValue.set(thickness);
291
+ }
292
+ /**
293
+ * Returns a {@link MutableReactiveValue} that can be used to watch
294
+ * this tool's thickness.
295
+ */
296
+ getThicknessValue() {
297
+ return this.thicknessValue;
298
+ }
299
+ /** @returns An object that allows switching between a full stroke and a partial stroke eraser. */
300
+ getModeValue() {
301
+ return this.modeValue;
302
+ }
303
+ }
304
+ exports.default = Eraser;
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,21 @@
1
+ import Editor from '../Editor';
2
+ import { KeyPressEvent } from '../inputEvents';
3
+ import BaseTool from './BaseTool';
4
+ export default class FindTool extends BaseTool {
5
+ private editor;
6
+ private overlay;
7
+ private searchInput;
8
+ private currentMatchIdx;
9
+ constructor(editor: Editor);
10
+ canReceiveInputInReadOnlyEditor(): boolean;
11
+ private getMatches;
12
+ private focusCurrentMatch;
13
+ private toNextMatch;
14
+ private toPrevMatch;
15
+ private fillOverlay;
16
+ private isVisible;
17
+ private setVisible;
18
+ private toggleVisible;
19
+ onKeyPress(event: KeyPressEvent): boolean;
20
+ setEnabled(enabled: boolean): void;
21
+ }
@@ -0,0 +1,137 @@
1
+ "use strict";
2
+ // Displays a find dialog that allows the user to search for and focus text.
3
+ //
4
+ // @packageDocumentation
5
+ var __importDefault = (this && this.__importDefault) || function (mod) {
6
+ return (mod && mod.__esModule) ? mod : { "default": mod };
7
+ };
8
+ Object.defineProperty(exports, "__esModule", { value: true });
9
+ const TextComponent_1 = __importDefault(require("../components/TextComponent"));
10
+ const ImageComponent_1 = __importDefault(require("../components/ImageComponent"));
11
+ const BaseTool_1 = __importDefault(require("./BaseTool"));
12
+ const keybindings_1 = require("./keybindings");
13
+ const cssPrefix = 'find-tool';
14
+ class FindTool extends BaseTool_1.default {
15
+ constructor(editor) {
16
+ super(editor.notifier, editor.localization.findLabel);
17
+ this.editor = editor;
18
+ this.currentMatchIdx = 0;
19
+ this.overlay = document.createElement('div');
20
+ this.fillOverlay();
21
+ editor.createHTMLOverlay(this.overlay);
22
+ this.overlay.style.display = 'none';
23
+ this.overlay.classList.add(`${cssPrefix}-overlay`);
24
+ }
25
+ canReceiveInputInReadOnlyEditor() {
26
+ return true;
27
+ }
28
+ getMatches(searchFor) {
29
+ const lowerSearchFor = searchFor.toLocaleLowerCase();
30
+ const matchingComponents = this.editor.image.getAllElements().filter((component) => {
31
+ let text = '';
32
+ if (component instanceof TextComponent_1.default) {
33
+ text = component.getText();
34
+ }
35
+ else if (component instanceof ImageComponent_1.default) {
36
+ text = component.getAltText() ?? '';
37
+ }
38
+ else {
39
+ return false;
40
+ }
41
+ const hasLowercaseMatch = text.toLocaleLowerCase().indexOf(lowerSearchFor) !== -1;
42
+ const hasSameCaseMatch = text.indexOf(searchFor) !== -1;
43
+ return hasLowercaseMatch || hasSameCaseMatch;
44
+ });
45
+ return matchingComponents.map((match) => match.getBBox());
46
+ }
47
+ focusCurrentMatch() {
48
+ const matches = this.getMatches(this.searchInput.value);
49
+ let matchIdx = this.currentMatchIdx % matches.length;
50
+ if (matchIdx < 0) {
51
+ matchIdx = matches.length + matchIdx;
52
+ }
53
+ if (matchIdx < matches.length) {
54
+ const undoable = false;
55
+ void this.editor.dispatch(this.editor.viewport.zoomTo(matches[matchIdx], true, true), undoable);
56
+ this.editor.announceForAccessibility(this.editor.localization.focusedFoundText(matchIdx + 1, matches.length));
57
+ }
58
+ }
59
+ toNextMatch() {
60
+ this.currentMatchIdx++;
61
+ this.focusCurrentMatch();
62
+ }
63
+ toPrevMatch() {
64
+ this.currentMatchIdx--;
65
+ this.focusCurrentMatch();
66
+ }
67
+ fillOverlay() {
68
+ const label = document.createElement('label');
69
+ this.searchInput = document.createElement('input');
70
+ const nextBtn = document.createElement('button');
71
+ const closeBtn = document.createElement('button');
72
+ // Math.random() ensures that the ID is unique (to allow us to refer to it
73
+ // with an htmlFor).
74
+ this.searchInput.setAttribute('id', `${cssPrefix}-searchInput-${Math.random()}`);
75
+ label.htmlFor = this.searchInput.getAttribute('id');
76
+ label.innerText = this.editor.localization.findLabel;
77
+ nextBtn.innerText = this.editor.localization.toNextMatch;
78
+ closeBtn.innerText = this.editor.localization.closeDialog;
79
+ this.searchInput.onkeydown = (ev) => {
80
+ if (ev.key === 'Enter') {
81
+ if (ev.shiftKey) {
82
+ this.toPrevMatch();
83
+ }
84
+ else {
85
+ this.toNextMatch();
86
+ }
87
+ }
88
+ else if (ev.key === 'Escape') {
89
+ this.setVisible(false);
90
+ }
91
+ else if (this.editor.shortcuts.matchesShortcut(keybindings_1.toggleFindVisibleShortcutId, ev)) {
92
+ ev.preventDefault();
93
+ this.toggleVisible();
94
+ }
95
+ };
96
+ nextBtn.onclick = () => {
97
+ this.toNextMatch();
98
+ };
99
+ closeBtn.onclick = () => {
100
+ this.setVisible(false);
101
+ };
102
+ this.overlay.replaceChildren(label, this.searchInput, nextBtn, closeBtn);
103
+ }
104
+ isVisible() {
105
+ return this.overlay.style.display !== 'none';
106
+ }
107
+ setVisible(visible) {
108
+ if (visible !== this.isVisible()) {
109
+ this.overlay.style.display = visible ? 'block' : 'none';
110
+ if (visible) {
111
+ this.searchInput.focus();
112
+ this.editor.announceForAccessibility(this.editor.localization.findDialogShown);
113
+ }
114
+ else {
115
+ this.editor.focus();
116
+ this.editor.announceForAccessibility(this.editor.localization.findDialogHidden);
117
+ }
118
+ }
119
+ }
120
+ toggleVisible() {
121
+ this.setVisible(!this.isVisible());
122
+ }
123
+ onKeyPress(event) {
124
+ if (this.editor.shortcuts.matchesShortcut(keybindings_1.toggleFindVisibleShortcutId, event)) {
125
+ this.toggleVisible();
126
+ return true;
127
+ }
128
+ return false;
129
+ }
130
+ setEnabled(enabled) {
131
+ super.setEnabled(enabled);
132
+ if (this.isEnabled()) {
133
+ this.setVisible(false);
134
+ }
135
+ }
136
+ }
137
+ exports.default = FindTool;
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,17 @@
1
+ import { InputEvt } from '../../inputEvents';
2
+ import InputMapper from './InputMapper';
3
+ export default class ContextMenuRecognizer extends InputMapper {
4
+ private canShowContextMenu;
5
+ private contextMenuTriggerPointer;
6
+ private contextMenuStartPoint;
7
+ private stationaryDetector;
8
+ private clickTolerance;
9
+ constructor();
10
+ /**
11
+ * In general, only certain events (i.e. touchscreens) are expected to be able to
12
+ * create long-press menus. This method checks whether `event` was generated by
13
+ * one such device.
14
+ */
15
+ private canMakeLongPressMenuEvent;
16
+ onEvent(event: InputEvt): boolean;
17
+ }
@@ -0,0 +1,103 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ var __importDefault = (this && this.__importDefault) || function (mod) {
26
+ return (mod && mod.__esModule) ? mod : { "default": mod };
27
+ };
28
+ Object.defineProperty(exports, "__esModule", { value: true });
29
+ const inputEvents_1 = require("../../inputEvents");
30
+ const InputMapper_1 = __importDefault(require("./InputMapper"));
31
+ const StationaryPenDetector_1 = __importStar(require("../util/StationaryPenDetector"));
32
+ const Pointer_1 = require("../../Pointer");
33
+ class ContextMenuRecognizer extends InputMapper_1.default {
34
+ constructor() {
35
+ super();
36
+ this.canShowContextMenu = false;
37
+ this.stationaryDetector = null;
38
+ this.clickTolerance = 12;
39
+ }
40
+ /**
41
+ * In general, only certain events (i.e. touchscreens) are expected to be able to
42
+ * create long-press menus. This method checks whether `event` was generated by
43
+ * one such device.
44
+ */
45
+ canMakeLongPressMenuEvent(event) {
46
+ const allowedDevices = [Pointer_1.PointerDevice.Touch];
47
+ return event.allPointers.length === 1 && allowedDevices.includes(event.current.device);
48
+ }
49
+ onEvent(event) {
50
+ const sendContextMenuEvent = () => {
51
+ if (!(0, inputEvents_1.isPointerEvt)(event))
52
+ return false;
53
+ if (this.canShowContextMenu) {
54
+ const eventHandled = this.emit({
55
+ kind: inputEvents_1.InputEvtType.ContextMenu,
56
+ screenPos: event.current.screenPos,
57
+ canvasPos: event.current.canvasPos,
58
+ });
59
+ if (eventHandled) {
60
+ this.emit({
61
+ kind: inputEvents_1.InputEvtType.GestureCancelEvt,
62
+ });
63
+ return true;
64
+ }
65
+ }
66
+ return false;
67
+ };
68
+ if (event.kind === inputEvents_1.InputEvtType.PointerDownEvt) {
69
+ if (event.allPointers.length === 1) {
70
+ this.canShowContextMenu = true;
71
+ this.contextMenuTriggerPointer = event.current;
72
+ this.contextMenuStartPoint = event.current.screenPos;
73
+ if (this.canMakeLongPressMenuEvent(event)) {
74
+ this.stationaryDetector = new StationaryPenDetector_1.default(event.current, StationaryPenDetector_1.defaultStationaryDetectionConfig, sendContextMenuEvent);
75
+ }
76
+ }
77
+ else {
78
+ this.canShowContextMenu = false;
79
+ }
80
+ }
81
+ else if (event.kind === inputEvents_1.InputEvtType.PointerMoveEvt) {
82
+ if (this.canShowContextMenu) {
83
+ this.stationaryDetector?.onPointerMove(event.current);
84
+ // Only clicks/stationary long presses can create context menu events.
85
+ const deltaPosition = event.current.screenPos.minus(this.contextMenuStartPoint);
86
+ const threshold = this.clickTolerance;
87
+ if (deltaPosition.length() > threshold) {
88
+ this.canShowContextMenu = false;
89
+ }
90
+ }
91
+ }
92
+ else if (event.kind === inputEvents_1.InputEvtType.PointerUpEvt) {
93
+ this.stationaryDetector?.destroy();
94
+ if (this.contextMenuTriggerPointer?.id === event.current.id &&
95
+ this.contextMenuTriggerPointer.device === Pointer_1.PointerDevice.RightButtonMouse &&
96
+ sendContextMenuEvent()) {
97
+ return true;
98
+ }
99
+ }
100
+ return this.emit(event);
101
+ }
102
+ }
103
+ exports.default = ContextMenuRecognizer;
@@ -0,0 +1,12 @@
1
+ import { InputEvt } from '../../inputEvents';
2
+ import InputMapper from './InputMapper';
3
+ /**
4
+ * An `InputMapper` that applies a function to all events it receives.
5
+ *
6
+ * Useful for automated testing.
7
+ */
8
+ export default class FunctionMapper extends InputMapper {
9
+ private fn;
10
+ constructor(fn: (event: InputEvt) => InputEvt);
11
+ onEvent(event: InputEvt): boolean;
12
+ }
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ const InputMapper_1 = __importDefault(require("./InputMapper"));
7
+ /**
8
+ * An `InputMapper` that applies a function to all events it receives.
9
+ *
10
+ * Useful for automated testing.
11
+ */
12
+ class FunctionMapper extends InputMapper_1.default {
13
+ constructor(fn) {
14
+ super();
15
+ this.fn = fn;
16
+ }
17
+ onEvent(event) {
18
+ return this.emit(this.fn(event));
19
+ }
20
+ }
21
+ exports.default = FunctionMapper;
@@ -0,0 +1,23 @@
1
+ import { InputEvt } from '../../inputEvents';
2
+ type OnEventCallback = (event: InputEvt) => boolean;
3
+ export interface InputEventListener {
4
+ onEvent: OnEventCallback;
5
+ }
6
+ /**
7
+ * Accepts input events and emits input events.
8
+ */
9
+ export default abstract class InputMapper implements InputEventListener {
10
+ #private;
11
+ constructor();
12
+ setEmitListener(listener: InputEventListener | OnEventCallback | null): void;
13
+ protected emit(event: InputEvt): boolean;
14
+ /**
15
+ * @returns true if the given `event` should be considered "handled" by the app and thus not
16
+ * forwarded to other targets. For example, returning "true" for a touchpad pinch event prevents
17
+ * the pinch event from zooming the webpage.
18
+ *
19
+ * Generally, this should return the result of calling `this.emit` with some event.
20
+ */
21
+ abstract onEvent(event: InputEvt): boolean;
22
+ }
23
+ export {};