@zsviczian/excalidraw 0.17.1-obsidian-29 → 0.17.1-obsidian-30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/dist/excalidraw.development.js +30 -30
  2. package/dist/excalidraw.production.min.js +1 -1
  3. package/package.json +1 -1
  4. package/types/excalidraw/components/App.d.ts +0 -8
  5. package/types/excalidraw/components/Stats/Angle.d.ts +7 -3
  6. package/types/excalidraw/components/Stats/Dimension.d.ts +6 -3
  7. package/types/excalidraw/components/Stats/DragInput.d.ts +15 -6
  8. package/types/excalidraw/components/Stats/FontSize.d.ts +8 -4
  9. package/types/excalidraw/components/Stats/MultiAngle.d.ts +5 -3
  10. package/types/excalidraw/components/Stats/MultiDimension.d.ts +5 -3
  11. package/types/excalidraw/components/Stats/MultiFontSize.d.ts +6 -3
  12. package/types/excalidraw/components/Stats/MultiPosition.d.ts +3 -1
  13. package/types/excalidraw/components/Stats/Position.d.ts +5 -1
  14. package/types/excalidraw/components/Stats/utils.d.ts +13 -3
  15. package/types/excalidraw/cursor.d.ts +1 -0
  16. package/types/excalidraw/element/binding.d.ts +5 -5
  17. package/types/excalidraw/element/mutateElement.d.ts +1 -1
  18. package/types/excalidraw/index.d.ts +2 -1
  19. package/types/excalidraw/obsidianUtils.d.ts +8 -5
  20. package/types/excalidraw/scene/types.d.ts +1 -4
  21. package/types/excalidraw/shapes.d.ts +7 -0
  22. package/types/excalidraw/types.d.ts +2 -3
  23. package/types/utils/export.d.ts +1 -0
package/dist/excalidraw.development.js CHANGED
@@ -496,7 +496,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
496
496
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
497
497
 
498
498
  "use strict";
499
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"actionFinalize\": () => (/* binding */ actionFinalize)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _keys__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../keys */ \"./keys.ts\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../element */ \"./element/index.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _components_ToolButton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../components/ToolButton */ \"./components/ToolButton.tsx\");\n/* harmony import */ var _components_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../components/icons */ \"./components/icons.tsx\");\n/* harmony import */ var _i18n__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../i18n */ \"./i18n.ts\");\n/* harmony import */ var _register__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./register */ \"./actions/register.ts\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../math */ \"./math.ts\");\n/* harmony import */ var _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../element/linearElementEditor */ \"./element/linearElementEditor.ts\");\n/* harmony import */ var _element_binding__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../element/binding */ \"./element/binding.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _cursor__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../cursor */ \"./cursor.ts\");\n/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../store */ \"./store.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nconst actionFinalize = (0,_register__WEBPACK_IMPORTED_MODULE_7__.register)({\n name: \"finalize\",\n label: \"\",\n trackEvent: false,\n perform: (elements, appState, _, app) => {\n var _a;\n\n const {\n interactiveCanvas,\n focusContainer,\n scene\n } = app;\n const elementsMap = scene.getNonDeletedElementsMap();\n\n if (appState.editingLinearElement) {\n const {\n elementId,\n startBindingElement,\n endBindingElement\n } = appState.editingLinearElement;\n const element = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_10__.LinearElementEditor.getElement(elementId, elementsMap);\n\n if (element) {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_12__.isBindingElement)(element)) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_11__.bindOrUnbindLinearElement)(element, startBindingElement, endBindingElement, elementsMap);\n }\n\n return {\n elements: element.points.length < 2 || (0,_element__WEBPACK_IMPORTED_MODULE_2__.isInvisiblySmallElement)(element) ? elements.filter(el => el.id !== element.id) : undefined,\n appState: Object.assign(Object.assign({}, appState), {\n cursorButton: \"up\",\n editingLinearElement: null,\n selectedLinearElement: null\n }),\n storeAction: _store__WEBPACK_IMPORTED_MODULE_14__.StoreAction.CAPTURE\n };\n }\n }\n\n let newElements = elements;\n const pendingImageElement = appState.pendingImageElementId && scene.getElement(appState.pendingImageElementId);\n\n if (pendingImageElement) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_8__.mutateElement)(pendingImageElement, {\n isDeleted: true\n }, false);\n }\n\n if (window.document.activeElement instanceof HTMLElement) {\n focusContainer();\n }\n\n const multiPointElement = appState.multiElement ? appState.multiElement : ((_a = appState.editingElement) === null || _a === void 0 ? void 0 : _a.type) === \"freedraw\" ? appState.editingElement : null;\n\n if (multiPointElement) {\n // pen and mouse have hover\n if (multiPointElement.type !== \"freedraw\" && appState.lastPointerDownWith !== \"touch\") {\n const {\n points,\n lastCommittedPoint\n } = multiPointElement;\n\n if (!lastCommittedPoint || points[points.length - 1] !== lastCommittedPoint) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_8__.mutateElement)(multiPointElement, {\n points: multiPointElement.points.slice(0, -1)\n });\n }\n }\n\n if ((0,_element__WEBPACK_IMPORTED_MODULE_2__.isInvisiblySmallElement)(multiPointElement)) {\n // TODO: #7348 in theory this gets recorded by the store, so the invisible elements could be restored by the undo/redo, which might be not what we would want\n newElements = newElements.filter(el => el.id !== multiPointElement.id);\n } // If the multi point line closes the loop,\n // set the last point to first point.\n // This ensures that loop remains closed at different scales.\n\n\n const isLoop = (0,_math__WEBPACK_IMPORTED_MODULE_9__.isPathALoop)(multiPointElement.points, appState.zoom.value);\n\n if (multiPointElement.type === \"line\") {\n //zsviczian multiPointElement.type === \"freedraw\"\n if (isLoop) {\n const linePoints = multiPointElement.points;\n const firstPoint = linePoints[0];\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_8__.mutateElement)(multiPointElement, {\n points: linePoints.map((point, index) => index === linePoints.length - 1 ? [firstPoint[0], firstPoint[1]] : point)\n });\n }\n }\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_12__.isBindingElement)(multiPointElement) && !isLoop && multiPointElement.points.length > 1) {\n const [x, y] = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_10__.LinearElementEditor.getPointAtIndexGlobalCoordinates(multiPointElement, -1, (0,_utils__WEBPACK_IMPORTED_MODULE_3__.arrayToMap)(elements));\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_11__.maybeBindLinearElement)(multiPointElement, appState, {\n x,\n y\n }, app);\n }\n }\n\n if (!appState.activeTool.locked && appState.activeTool.type !== \"freedraw\" || !multiPointElement) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_13__.resetCursor)(interactiveCanvas);\n }\n\n let activeTool;\n\n if (appState.activeTool.type === \"eraser\") {\n activeTool = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.updateActiveTool)(appState, Object.assign(Object.assign({}, appState.activeTool.lastActiveTool || {\n type: \"selection\"\n }), {\n lastActiveToolBeforeEraser: null\n }));\n } else {\n activeTool = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.updateActiveTool)(appState, {\n type: \"selection\"\n });\n }\n\n return {\n elements: newElements,\n appState: Object.assign(Object.assign({}, appState), {\n cursorButton: \"up\",\n activeTool: (appState.activeTool.locked || appState.activeTool.type === \"freedraw\") && multiPointElement ? appState.activeTool : activeTool,\n activeEmbeddable: null,\n draggingElement: null,\n multiElement: null,\n editingElement: null,\n startBoundElement: null,\n suggestedBindings: [],\n selectedElementIds: multiPointElement && !appState.activeTool.locked && appState.activeTool.type !== \"freedraw\" ? Object.assign(Object.assign({}, appState.selectedElementIds), {\n [multiPointElement.id]: true\n }) : appState.selectedElementIds,\n // To select the linear element when user has finished mutipoint editing\n selectedLinearElement: multiPointElement && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_12__.isLinearElement)(multiPointElement) ? new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_10__.LinearElementEditor(multiPointElement) : appState.selectedLinearElement,\n pendingImageElementId: null\n }),\n // TODO: #7348 we should not capture everything, but if we don't, it leads to incosistencies -> revisit\n storeAction: _store__WEBPACK_IMPORTED_MODULE_14__.StoreAction.CAPTURE\n };\n },\n keyTest: (event, appState) => event.key === _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.ESCAPE && (appState.editingLinearElement !== null || !appState.draggingElement && appState.multiElement === null) || (event.key === _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.ESCAPE || event.key === _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.ENTER) && appState.multiElement !== null,\n PanelComponent: ({\n appState,\n updateData,\n data\n }) => (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_ToolButton__WEBPACK_IMPORTED_MODULE_4__.ToolButton, {\n type: \"button\",\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_5__.done,\n title: (0,_i18n__WEBPACK_IMPORTED_MODULE_6__.t)(\"buttons.done\"),\n \"aria-label\": (0,_i18n__WEBPACK_IMPORTED_MODULE_6__.t)(\"buttons.done\"),\n onClick: updateData,\n visible: appState.multiElement != null,\n size: (data === null || data === void 0 ? void 0 : data.size) || \"medium\"\n })\n});\n\n//# sourceURL=webpack://ExcalidrawLib/./actions/actionFinalize.tsx?");
499
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"actionFinalize\": () => (/* binding */ actionFinalize)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _keys__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../keys */ \"./keys.ts\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../element */ \"./element/index.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _components_ToolButton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../components/ToolButton */ \"./components/ToolButton.tsx\");\n/* harmony import */ var _components_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../components/icons */ \"./components/icons.tsx\");\n/* harmony import */ var _i18n__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../i18n */ \"./i18n.ts\");\n/* harmony import */ var _register__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./register */ \"./actions/register.ts\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../math */ \"./math.ts\");\n/* harmony import */ var _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../element/linearElementEditor */ \"./element/linearElementEditor.ts\");\n/* harmony import */ var _element_binding__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../element/binding */ \"./element/binding.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _cursor__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../cursor */ \"./cursor.ts\");\n/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../store */ \"./store.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nconst actionFinalize = (0,_register__WEBPACK_IMPORTED_MODULE_7__.register)({\n name: \"finalize\",\n label: \"\",\n trackEvent: false,\n perform: (elements, appState, _, app) => {\n var _a;\n\n const {\n interactiveCanvas,\n focusContainer,\n scene\n } = app;\n const elementsMap = scene.getNonDeletedElementsMap();\n\n if (appState.editingLinearElement) {\n const {\n elementId,\n startBindingElement,\n endBindingElement\n } = appState.editingLinearElement;\n const element = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_10__.LinearElementEditor.getElement(elementId, elementsMap);\n\n if (element) {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_12__.isBindingElement)(element)) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_11__.bindOrUnbindLinearElement)(element, startBindingElement, endBindingElement, elementsMap);\n }\n\n return {\n elements: element.points.length < 2 || (0,_element__WEBPACK_IMPORTED_MODULE_2__.isInvisiblySmallElement)(element) ? elements.filter(el => el.id !== element.id) : undefined,\n appState: Object.assign(Object.assign({}, appState), {\n cursorButton: \"up\",\n editingLinearElement: null,\n selectedLinearElement: null\n }),\n storeAction: _store__WEBPACK_IMPORTED_MODULE_14__.StoreAction.CAPTURE\n };\n }\n }\n\n let newElements = elements;\n const pendingImageElement = appState.pendingImageElementId && scene.getElement(appState.pendingImageElementId);\n\n if (pendingImageElement) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_8__.mutateElement)(pendingImageElement, {\n isDeleted: true\n }, false);\n }\n\n if (window.document.activeElement instanceof HTMLElement) {\n focusContainer();\n }\n\n const multiPointElement = appState.multiElement ? appState.multiElement : ((_a = appState.editingElement) === null || _a === void 0 ? void 0 : _a.type) === \"freedraw\" ? appState.editingElement : null;\n\n if (multiPointElement) {\n // pen and mouse have hover\n if (multiPointElement.type !== \"freedraw\" && appState.lastPointerDownWith !== \"touch\") {\n const {\n points,\n lastCommittedPoint\n } = multiPointElement;\n\n if (!lastCommittedPoint || points[points.length - 1] !== lastCommittedPoint) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_8__.mutateElement)(multiPointElement, {\n points: multiPointElement.points.slice(0, -1)\n });\n }\n }\n\n if ((0,_element__WEBPACK_IMPORTED_MODULE_2__.isInvisiblySmallElement)(multiPointElement)) {\n // TODO: #7348 in theory this gets recorded by the store, so the invisible elements could be restored by the undo/redo, which might be not what we would want\n newElements = newElements.filter(el => el.id !== multiPointElement.id);\n } // If the multi point line closes the loop,\n // set the last point to first point.\n // This ensures that loop remains closed at different scales.\n\n\n const isLoop = (0,_math__WEBPACK_IMPORTED_MODULE_9__.isPathALoop)(multiPointElement.points, appState.zoom.value);\n\n if (multiPointElement.type === \"line\") {\n //zsviczian multiPointElement.type === \"freedraw\"\n if (isLoop) {\n const linePoints = multiPointElement.points;\n const firstPoint = linePoints[0];\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_8__.mutateElement)(multiPointElement, {\n points: linePoints.map((point, index) => index === linePoints.length - 1 ? [firstPoint[0], firstPoint[1]] : point)\n });\n }\n }\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_12__.isBindingElement)(multiPointElement) && !isLoop && multiPointElement.points.length > 1) {\n const [x, y] = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_10__.LinearElementEditor.getPointAtIndexGlobalCoordinates(multiPointElement, -1, (0,_utils__WEBPACK_IMPORTED_MODULE_3__.arrayToMap)(elements));\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_11__.maybeBindLinearElement)(multiPointElement, appState, {\n x,\n y\n }, elementsMap);\n }\n }\n\n if (!appState.activeTool.locked && appState.activeTool.type !== \"freedraw\" || !multiPointElement) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_13__.resetCursor)(interactiveCanvas);\n }\n\n let activeTool;\n\n if (appState.activeTool.type === \"eraser\") {\n activeTool = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.updateActiveTool)(appState, Object.assign(Object.assign({}, appState.activeTool.lastActiveTool || {\n type: \"selection\"\n }), {\n lastActiveToolBeforeEraser: null\n }));\n } else {\n activeTool = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.updateActiveTool)(appState, {\n type: \"selection\"\n });\n }\n\n return {\n elements: newElements,\n appState: Object.assign(Object.assign({}, appState), {\n cursorButton: \"up\",\n activeTool: (appState.activeTool.locked || appState.activeTool.type === \"freedraw\") && multiPointElement ? appState.activeTool : activeTool,\n activeEmbeddable: null,\n draggingElement: null,\n multiElement: null,\n editingElement: null,\n startBoundElement: null,\n suggestedBindings: [],\n selectedElementIds: multiPointElement && !appState.activeTool.locked && appState.activeTool.type !== \"freedraw\" ? Object.assign(Object.assign({}, appState.selectedElementIds), {\n [multiPointElement.id]: true\n }) : appState.selectedElementIds,\n // To select the linear element when user has finished mutipoint editing\n selectedLinearElement: multiPointElement && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_12__.isLinearElement)(multiPointElement) ? new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_10__.LinearElementEditor(multiPointElement) : appState.selectedLinearElement,\n pendingImageElementId: null\n }),\n // TODO: #7348 we should not capture everything, but if we don't, it leads to incosistencies -> revisit\n storeAction: _store__WEBPACK_IMPORTED_MODULE_14__.StoreAction.CAPTURE\n };\n },\n keyTest: (event, appState) => event.key === _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.ESCAPE && (appState.editingLinearElement !== null || !appState.draggingElement && appState.multiElement === null) || (event.key === _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.ESCAPE || event.key === _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.ENTER) && appState.multiElement !== null,\n PanelComponent: ({\n appState,\n updateData,\n data\n }) => (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_ToolButton__WEBPACK_IMPORTED_MODULE_4__.ToolButton, {\n type: \"button\",\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_5__.done,\n title: (0,_i18n__WEBPACK_IMPORTED_MODULE_6__.t)(\"buttons.done\"),\n \"aria-label\": (0,_i18n__WEBPACK_IMPORTED_MODULE_6__.t)(\"buttons.done\"),\n onClick: updateData,\n visible: appState.multiElement != null,\n size: (data === null || data === void 0 ? void 0 : data.size) || \"medium\"\n })\n});\n\n//# sourceURL=webpack://ExcalidrawLib/./actions/actionFinalize.tsx?");
500
500
 
501
501
  /***/ }),
502
502
 
@@ -507,7 +507,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
507
507
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
508
508
 
509
509
  "use strict";
510
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"actionFlipHorizontal\": () => (/* binding */ actionFlipHorizontal),\n/* harmony export */ \"actionFlipVertical\": () => (/* binding */ actionFlipVertical)\n/* harmony export */ });\n/* harmony import */ var _register__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./register */ \"./actions/register.ts\");\n/* harmony import */ var _scene__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../scene */ \"./scene/index.ts\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../element */ \"./element/index.ts\");\n/* harmony import */ var _element_resizeElements__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../element/resizeElements */ \"./element/resizeElements.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _keys__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../keys */ \"./keys.ts\");\n/* harmony import */ var _element_bounds__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../element/bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _element_binding__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../element/binding */ \"./element/binding.ts\");\n/* harmony import */ var _frame__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../frame */ \"./frame.ts\");\n/* harmony import */ var _components_icons__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../components/icons */ \"./components/icons.tsx\");\n/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../store */ \"./store.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../element/typeChecks */ \"./element/typeChecks.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\nconst actionFlipHorizontal = (0,_register__WEBPACK_IMPORTED_MODULE_0__.register)({\n name: \"flipHorizontal\",\n label: \"labels.flipHorizontal\",\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_9__.flipHorizontal,\n trackEvent: {\n category: \"element\"\n },\n perform: (elements, appState, _, app) => {\n return {\n elements: (0,_frame__WEBPACK_IMPORTED_MODULE_8__.updateFrameMembershipOfSelectedElements)(flipSelectedElements(elements, app.scene.getNonDeletedElementsMap(), appState, \"horizontal\", app), appState, app),\n appState,\n storeAction: _store__WEBPACK_IMPORTED_MODULE_10__.StoreAction.CAPTURE\n };\n },\n keyTest: event => event.shiftKey && event.code === _keys__WEBPACK_IMPORTED_MODULE_5__.CODES.H\n});\nconst actionFlipVertical = (0,_register__WEBPACK_IMPORTED_MODULE_0__.register)({\n name: \"flipVertical\",\n label: \"labels.flipVertical\",\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_9__.flipVertical,\n trackEvent: {\n category: \"element\"\n },\n perform: (elements, appState, _, app) => {\n return {\n elements: (0,_frame__WEBPACK_IMPORTED_MODULE_8__.updateFrameMembershipOfSelectedElements)(flipSelectedElements(elements, app.scene.getNonDeletedElementsMap(), appState, \"vertical\", app), appState, app),\n appState,\n storeAction: _store__WEBPACK_IMPORTED_MODULE_10__.StoreAction.CAPTURE\n };\n },\n keyTest: event => event.shiftKey && event.code === _keys__WEBPACK_IMPORTED_MODULE_5__.CODES.V && !event[_keys__WEBPACK_IMPORTED_MODULE_5__.KEYS.CTRL_OR_CMD]\n});\n\nconst flipSelectedElements = (elements, elementsMap, appState, flipDirection, app) => {\n const selectedElements = (0,_scene__WEBPACK_IMPORTED_MODULE_1__.getSelectedElements)((0,_element__WEBPACK_IMPORTED_MODULE_2__.getNonDeletedElements)(elements), appState, {\n includeBoundTextElement: true,\n includeElementsInFrames: true\n });\n const updatedElements = flipElements(selectedElements, elementsMap, appState, flipDirection, app);\n const updatedElementsMap = (0,_utils__WEBPACK_IMPORTED_MODULE_4__.arrayToMap)(updatedElements);\n return elements.map(element => updatedElementsMap.get(element.id) || element);\n};\n\nconst flipElements = (selectedElements, elementsMap, appState, flipDirection, app) => {\n const {\n minX,\n minY,\n maxX,\n maxY\n } = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_6__.getCommonBoundingBox)(selectedElements);\n (0,_element_resizeElements__WEBPACK_IMPORTED_MODULE_3__.resizeMultipleElements)(elementsMap, selectedElements, elementsMap, \"nw\", true, true, flipDirection === \"horizontal\" ? maxX : minX, flipDirection === \"horizontal\" ? minY : maxY);\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_7__.bindOrUnbindLinearElements)(selectedElements.filter(_element_typeChecks__WEBPACK_IMPORTED_MODULE_11__.isLinearElement), app, (0,_element_binding__WEBPACK_IMPORTED_MODULE_7__.isBindingEnabled)(appState), []);\n return selectedElements;\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./actions/actionFlip.ts?");
510
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"actionFlipHorizontal\": () => (/* binding */ actionFlipHorizontal),\n/* harmony export */ \"actionFlipVertical\": () => (/* binding */ actionFlipVertical)\n/* harmony export */ });\n/* harmony import */ var _register__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./register */ \"./actions/register.ts\");\n/* harmony import */ var _scene__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../scene */ \"./scene/index.ts\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../element */ \"./element/index.ts\");\n/* harmony import */ var _element_resizeElements__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../element/resizeElements */ \"./element/resizeElements.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _keys__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../keys */ \"./keys.ts\");\n/* harmony import */ var _element_bounds__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../element/bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _element_binding__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../element/binding */ \"./element/binding.ts\");\n/* harmony import */ var _frame__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../frame */ \"./frame.ts\");\n/* harmony import */ var _components_icons__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../components/icons */ \"./components/icons.tsx\");\n/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../store */ \"./store.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../element/typeChecks */ \"./element/typeChecks.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\nconst actionFlipHorizontal = (0,_register__WEBPACK_IMPORTED_MODULE_0__.register)({\n name: \"flipHorizontal\",\n label: \"labels.flipHorizontal\",\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_9__.flipHorizontal,\n trackEvent: {\n category: \"element\"\n },\n perform: (elements, appState, _, app) => {\n return {\n elements: (0,_frame__WEBPACK_IMPORTED_MODULE_8__.updateFrameMembershipOfSelectedElements)(flipSelectedElements(elements, app.scene.getNonDeletedElementsMap(), appState, \"horizontal\", app), appState, app),\n appState,\n storeAction: _store__WEBPACK_IMPORTED_MODULE_10__.StoreAction.CAPTURE\n };\n },\n keyTest: event => event.shiftKey && event.code === _keys__WEBPACK_IMPORTED_MODULE_5__.CODES.H\n});\nconst actionFlipVertical = (0,_register__WEBPACK_IMPORTED_MODULE_0__.register)({\n name: \"flipVertical\",\n label: \"labels.flipVertical\",\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_9__.flipVertical,\n trackEvent: {\n category: \"element\"\n },\n perform: (elements, appState, _, app) => {\n return {\n elements: (0,_frame__WEBPACK_IMPORTED_MODULE_8__.updateFrameMembershipOfSelectedElements)(flipSelectedElements(elements, app.scene.getNonDeletedElementsMap(), appState, \"vertical\", app), appState, app),\n appState,\n storeAction: _store__WEBPACK_IMPORTED_MODULE_10__.StoreAction.CAPTURE\n };\n },\n keyTest: event => event.shiftKey && event.code === _keys__WEBPACK_IMPORTED_MODULE_5__.CODES.V && !event[_keys__WEBPACK_IMPORTED_MODULE_5__.KEYS.CTRL_OR_CMD]\n});\n\nconst flipSelectedElements = (elements, elementsMap, appState, flipDirection, app) => {\n const selectedElements = (0,_scene__WEBPACK_IMPORTED_MODULE_1__.getSelectedElements)((0,_element__WEBPACK_IMPORTED_MODULE_2__.getNonDeletedElements)(elements), appState, {\n includeBoundTextElement: true,\n includeElementsInFrames: true\n });\n const updatedElements = flipElements(selectedElements, elementsMap, appState, flipDirection, app);\n const updatedElementsMap = (0,_utils__WEBPACK_IMPORTED_MODULE_4__.arrayToMap)(updatedElements);\n return elements.map(element => updatedElementsMap.get(element.id) || element);\n};\n\nconst flipElements = (selectedElements, elementsMap, appState, flipDirection, app) => {\n const {\n minX,\n minY,\n maxX,\n maxY\n } = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_6__.getCommonBoundingBox)(selectedElements);\n (0,_element_resizeElements__WEBPACK_IMPORTED_MODULE_3__.resizeMultipleElements)(elementsMap, selectedElements, elementsMap, \"nw\", true, true, flipDirection === \"horizontal\" ? maxX : minX, flipDirection === \"horizontal\" ? minY : maxY);\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_7__.bindOrUnbindLinearElements)(selectedElements.filter(_element_typeChecks__WEBPACK_IMPORTED_MODULE_11__.isLinearElement), elementsMap, (0,_element_binding__WEBPACK_IMPORTED_MODULE_7__.isBindingEnabled)(appState), []);\n return selectedElements;\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./actions/actionFlip.ts?");
511
511
 
512
512
  /***/ }),
513
513
 
@@ -760,7 +760,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
760
760
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
761
761
 
762
762
  "use strict";
763
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"trackEvent\": () => (/* binding */ trackEvent)\n/* harmony export */ });\n// place here categories that you want to track. We want to track just a\n// small subset of categories at a given time.\nconst ALLOWED_CATEGORIES_TO_TRACK = [\"ai\", \"command_palette\"];\nconst trackEvent = (category, action, label, value) => {\n try {\n // prettier-ignore\n if (typeof window === \"undefined\" || ({\"VITE_APP_BACKEND_V2_GET_URL\":\"https://json-dev.excalidraw.com/api/v2/\",\"VITE_APP_BACKEND_V2_POST_URL\":\"https://json-dev.excalidraw.com/api/v2/post/\",\"VITE_APP_LIBRARY_URL\":\"https://libraries.excalidraw.com\",\"VITE_APP_LIBRARY_BACKEND\":\"https://us-central1-excalidraw-room-persistence.cloudfunctions.net/libraries\",\"VITE_APP_WS_SERVER_URL\":\"http://localhost:3002\",\"VITE_APP_PLUS_LP\":\"https://plus.excalidraw.com\",\"VITE_APP_PLUS_APP\":\"https://app.excalidraw.com\",\"VITE_APP_AI_BACKEND\":\"http://localhost:3015\",\"VITE_APP_FIREBASE_CONFIG\":\"{\\\"apiKey\\\":\\\"AIzaSyCMkxA60XIW8KbqMYL7edC4qT5l4qHX2h8\\\",\\\"authDomain\\\":\\\"excalidraw-oss-dev.firebaseapp.com\\\",\\\"projectId\\\":\\\"excalidraw-oss-dev\\\",\\\"storageBucket\\\":\\\"excalidraw-oss-dev.appspot.com\\\",\\\"messagingSenderId\\\":\\\"664559512677\\\",\\\"appId\\\":\\\"1:664559512677:web:a385181f2928d328a7aa8c\\\"}\",\"VITE_APP_DEV_ENABLE_SW\":\"\",\"VITE_APP_DEV_DISABLE_LIVE_RELOAD\":\"\",\"VITE_APP_DISABLE_TRACKING\":\"true\",\"FAST_REFRESH\":\"false\",\"VITE_APP_PORT\":\"3000\",\"VITE_APP_DEBUG_ENABLE_TEXT_CONTAINER_BOUNDING_BOX\":\"\",\"VITE_APP_COLLAPSE_OVERLAY\":\"true\",\"VITE_APP_ENABLE_ESLINT\":\"true\",\"VITE_PKG_NAME\":\"@zsviczian/excalidraw\",\"VITE_PKG_VERSION\":\"0.17.1-obsidian-28\",\"VITE_IS_EXCALIDRAW_NPM_PACKAGE\":true}).VITE_WORKER_ID // comment out to debug locally\n || \"development\" === \"production\") {\n return;\n }\n\n if (!ALLOWED_CATEGORIES_TO_TRACK.includes(category)) {\n return;\n }\n\n if (true) {\n console.info(\"trackEvent\", {\n category,\n action,\n label,\n value\n });\n }\n\n if (window.sa_event) {\n window.sa_event(action, {\n category,\n label,\n value\n });\n }\n } catch (error) {\n console.error(\"error during analytics\", error);\n }\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./analytics.ts?");
763
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"trackEvent\": () => (/* binding */ trackEvent)\n/* harmony export */ });\n// place here categories that you want to track. We want to track just a\n// small subset of categories at a given time.\nconst ALLOWED_CATEGORIES_TO_TRACK = [\"ai\", \"command_palette\"];\nconst trackEvent = (category, action, label, value) => {\n try {\n // prettier-ignore\n if (typeof window === \"undefined\" || ({\"VITE_APP_BACKEND_V2_GET_URL\":\"https://json-dev.excalidraw.com/api/v2/\",\"VITE_APP_BACKEND_V2_POST_URL\":\"https://json-dev.excalidraw.com/api/v2/post/\",\"VITE_APP_LIBRARY_URL\":\"https://libraries.excalidraw.com\",\"VITE_APP_LIBRARY_BACKEND\":\"https://us-central1-excalidraw-room-persistence.cloudfunctions.net/libraries\",\"VITE_APP_WS_SERVER_URL\":\"http://localhost:3002\",\"VITE_APP_PLUS_LP\":\"https://plus.excalidraw.com\",\"VITE_APP_PLUS_APP\":\"https://app.excalidraw.com\",\"VITE_APP_AI_BACKEND\":\"http://localhost:3015\",\"VITE_APP_FIREBASE_CONFIG\":\"{\\\"apiKey\\\":\\\"AIzaSyCMkxA60XIW8KbqMYL7edC4qT5l4qHX2h8\\\",\\\"authDomain\\\":\\\"excalidraw-oss-dev.firebaseapp.com\\\",\\\"projectId\\\":\\\"excalidraw-oss-dev\\\",\\\"storageBucket\\\":\\\"excalidraw-oss-dev.appspot.com\\\",\\\"messagingSenderId\\\":\\\"664559512677\\\",\\\"appId\\\":\\\"1:664559512677:web:a385181f2928d328a7aa8c\\\"}\",\"VITE_APP_DEV_ENABLE_SW\":\"\",\"VITE_APP_DEV_DISABLE_LIVE_RELOAD\":\"\",\"VITE_APP_DISABLE_TRACKING\":\"true\",\"FAST_REFRESH\":\"false\",\"VITE_APP_PORT\":\"3000\",\"VITE_APP_DEBUG_ENABLE_TEXT_CONTAINER_BOUNDING_BOX\":\"\",\"VITE_APP_COLLAPSE_OVERLAY\":\"true\",\"VITE_APP_ENABLE_ESLINT\":\"true\",\"VITE_PKG_NAME\":\"@zsviczian/excalidraw\",\"VITE_PKG_VERSION\":\"0.17.1-obsidian-29\",\"VITE_IS_EXCALIDRAW_NPM_PACKAGE\":true}).VITE_WORKER_ID // comment out to debug locally\n || \"development\" === \"production\") {\n return;\n }\n\n if (!ALLOWED_CATEGORIES_TO_TRACK.includes(category)) {\n return;\n }\n\n if (true) {\n console.info(\"trackEvent\", {\n category,\n action,\n label,\n value\n });\n }\n\n if (window.sa_event) {\n window.sa_event(action, {\n category,\n label,\n value\n });\n }\n } catch (error) {\n console.error(\"error during analytics\", error);\n }\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./analytics.ts?");
764
764
 
765
765
  /***/ }),
766
766
 
@@ -881,7 +881,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
881
881
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
882
882
 
883
883
  "use strict";
884
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"ExcalidrawContainerContext\": () => (/* binding */ ExcalidrawContainerContext),\n/* harmony export */ \"createTestHook\": () => (/* binding */ createTestHook),\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__),\n/* harmony export */ \"hostPlugin\": () => (/* binding */ hostPlugin),\n/* harmony export */ \"showFourthFont\": () => (/* binding */ showFourthFont),\n/* harmony export */ \"useApp\": () => (/* binding */ useApp),\n/* harmony export */ \"useAppProps\": () => (/* binding */ useAppProps),\n/* harmony export */ \"useDevice\": () => (/* binding */ useDevice),\n/* harmony export */ \"useExcalidrawActionManager\": () => (/* binding */ useExcalidrawActionManager),\n/* harmony export */ \"useExcalidrawAppState\": () => (/* binding */ useExcalidrawAppState),\n/* harmony export */ \"useExcalidrawContainer\": () => (/* binding */ useExcalidrawContainer),\n/* harmony export */ \"useExcalidrawElements\": () => (/* binding */ useExcalidrawElements),\n/* harmony export */ \"useExcalidrawSetAppState\": () => (/* binding */ useExcalidrawSetAppState)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-dom */ \"react-dom\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var roughjs_bin_rough__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! roughjs/bin/rough */ \"../../node_modules/roughjs/bin/rough.js\");\n/* harmony import */ var clsx__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! clsx */ \"../../node_modules/clsx/dist/clsx.m.js\");\n/* harmony import */ var nanoid__WEBPACK_IMPORTED_MODULE_97__ = __webpack_require__(/*! nanoid */ \"./node_modules/nanoid/index.browser.js\");\n/* harmony import */ var _actions__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../actions */ \"./actions/index.ts\");\n/* harmony import */ var _actions_actionHistory__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../actions/actionHistory */ \"./actions/actionHistory.tsx\");\n/* harmony import */ var _actions_manager__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../actions/manager */ \"./actions/manager.tsx\");\n/* harmony import */ var _actions_register__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../actions/register */ \"./actions/register.ts\");\n/* harmony import */ var _analytics__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../analytics */ \"./analytics.ts\");\n/* harmony import */ var _appState__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../appState */ \"./appState.ts\");\n/* harmony import */ var _clipboard__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../clipboard */ \"./clipboard.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../constants */ \"./constants.ts\");\n/* harmony import */ var _data__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../data */ \"./data/index.ts\");\n/* harmony import */ var _data_library__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../data/library */ \"./data/library.ts\");\n/* harmony import */ var _data_restore__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../data/restore */ \"./data/restore.ts\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../element */ \"./element/index.ts\");\n/* harmony import */ var _element_binding__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../element/binding */ \"./element/binding.ts\");\n/* harmony import */ var _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../element/linearElementEditor */ \"./element/linearElementEditor.ts\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _element_newElement__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../element/newElement */ \"./element/newElement.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _gesture__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../gesture */ \"./gesture.ts\");\n/* harmony import */ var _groups__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../groups */ \"./groups.ts\");\n/* harmony import */ var _history__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../history */ \"./history.ts\");\n/* harmony import */ var _i18n__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ../i18n */ \"./i18n.ts\");\n/* harmony import */ var _keys__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ../keys */ \"./keys.ts\");\n/* harmony import */ var _element_sizeHelpers__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ../element/sizeHelpers */ \"./element/sizeHelpers.ts\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! ../math */ \"./math.ts\");\n/* harmony import */ var _scene__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! ../scene */ \"./scene/index.ts\");\n/* harmony import */ var _scene_Scene__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! ../scene/Scene */ \"./scene/Scene.ts\");\n/* harmony import */ var _scene_zoom__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! ../scene/zoom */ \"./scene/zoom.ts\");\n/* harmony import */ var _shapes__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! ../shapes */ \"./shapes.tsx\");\n/* harmony import */ var _utils_geometry_shape__WEBPACK_IMPORTED_MODULE_33__ = __webpack_require__(/*! ../../utils/geometry/shape */ \"../utils/geometry/shape.ts\");\n/* harmony import */ var _utils_collision__WEBPACK_IMPORTED_MODULE_34__ = __webpack_require__(/*! ../../utils/collision */ \"../utils/collision.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_35__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _element_embeddable__WEBPACK_IMPORTED_MODULE_36__ = __webpack_require__(/*! ../element/embeddable */ \"./element/embeddable.ts\");\n/* harmony import */ var _ContextMenu__WEBPACK_IMPORTED_MODULE_37__ = __webpack_require__(/*! ./ContextMenu */ \"./components/ContextMenu.tsx\");\n/* harmony import */ var _LayerUI__WEBPACK_IMPORTED_MODULE_38__ = __webpack_require__(/*! ./LayerUI */ \"./components/LayerUI.tsx\");\n/* harmony import */ var _Toast__WEBPACK_IMPORTED_MODULE_39__ = __webpack_require__(/*! ./Toast */ \"./components/Toast.tsx\");\n/* harmony import */ var _actions_actionToggleViewMode__WEBPACK_IMPORTED_MODULE_40__ = __webpack_require__(/*! ../actions/actionToggleViewMode */ \"./actions/actionToggleViewMode.tsx\");\n/* harmony import */ var _data_blob__WEBPACK_IMPORTED_MODULE_41__ = __webpack_require__(/*! ../data/blob */ \"./data/blob.ts\");\n/* harmony import */ var _element_image__WEBPACK_IMPORTED_MODULE_42__ = __webpack_require__(/*! ../element/image */ \"./element/image.ts\");\n/* harmony import */ var lodash_throttle__WEBPACK_IMPORTED_MODULE_43__ = __webpack_require__(/*! lodash.throttle */ \"../../node_modules/lodash.throttle/index.js\");\n/* harmony import */ var lodash_throttle__WEBPACK_IMPORTED_MODULE_43___default = /*#__PURE__*/__webpack_require__.n(lodash_throttle__WEBPACK_IMPORTED_MODULE_43__);\n/* harmony import */ var _data_filesystem__WEBPACK_IMPORTED_MODULE_44__ = __webpack_require__(/*! ../data/filesystem */ \"./data/filesystem.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_45__ = __webpack_require__(/*! ../element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _components_hyperlink_Hyperlink__WEBPACK_IMPORTED_MODULE_46__ = __webpack_require__(/*! ../components/hyperlink/Hyperlink */ \"./components/hyperlink/Hyperlink.tsx\");\n/* harmony import */ var _data_url__WEBPACK_IMPORTED_MODULE_47__ = __webpack_require__(/*! ../data/url */ \"./data/url.ts\");\n/* harmony import */ var _element_transformHandles__WEBPACK_IMPORTED_MODULE_48__ = __webpack_require__(/*! ../element/transformHandles */ \"./element/transformHandles.ts\");\n/* harmony import */ var _actions_actionElementLock__WEBPACK_IMPORTED_MODULE_49__ = __webpack_require__(/*! ../actions/actionElementLock */ \"./actions/actionElementLock.ts\");\n/* harmony import */ var _scene_Fonts__WEBPACK_IMPORTED_MODULE_50__ = __webpack_require__(/*! ../scene/Fonts */ \"./scene/Fonts.ts\");\n/* harmony import */ var _frame__WEBPACK_IMPORTED_MODULE_51__ = __webpack_require__(/*! ../frame */ \"./frame.ts\");\n/* harmony import */ var _scene_selection__WEBPACK_IMPORTED_MODULE_52__ = __webpack_require__(/*! ../scene/selection */ \"./scene/selection.ts\");\n/* harmony import */ var _actions_actionClipboard__WEBPACK_IMPORTED_MODULE_53__ = __webpack_require__(/*! ../actions/actionClipboard */ \"./actions/actionClipboard.tsx\");\n/* harmony import */ var _actions_actionFrame__WEBPACK_IMPORTED_MODULE_54__ = __webpack_require__(/*! ../actions/actionFrame */ \"./actions/actionFrame.ts\");\n/* harmony import */ var _actions_actionCanvas__WEBPACK_IMPORTED_MODULE_55__ = __webpack_require__(/*! ../actions/actionCanvas */ \"./actions/actionCanvas.tsx\");\n/* harmony import */ var _jotai__WEBPACK_IMPORTED_MODULE_56__ = __webpack_require__(/*! ../jotai */ \"./jotai.ts\");\n/* harmony import */ var _ActiveConfirmDialog__WEBPACK_IMPORTED_MODULE_57__ = __webpack_require__(/*! ./ActiveConfirmDialog */ \"./components/ActiveConfirmDialog.tsx\");\n/* harmony import */ var _errors__WEBPACK_IMPORTED_MODULE_58__ = __webpack_require__(/*! ../errors */ \"./errors.ts\");\n/* harmony import */ var _snapping__WEBPACK_IMPORTED_MODULE_59__ = __webpack_require__(/*! ../snapping */ \"./snapping.ts\");\n/* harmony import */ var _actions_actionBoundText__WEBPACK_IMPORTED_MODULE_60__ = __webpack_require__(/*! ../actions/actionBoundText */ \"./actions/actionBoundText.tsx\");\n/* harmony import */ var _BraveMeasureTextError__WEBPACK_IMPORTED_MODULE_61__ = __webpack_require__(/*! ./BraveMeasureTextError */ \"./components/BraveMeasureTextError.tsx\");\n/* harmony import */ var _EyeDropper__WEBPACK_IMPORTED_MODULE_62__ = __webpack_require__(/*! ./EyeDropper */ \"./components/EyeDropper.tsx\");\n/* harmony import */ var _data_transform__WEBPACK_IMPORTED_MODULE_63__ = __webpack_require__(/*! ../data/transform */ \"./data/transform.ts\");\n/* harmony import */ var _Sidebar_Sidebar__WEBPACK_IMPORTED_MODULE_64__ = __webpack_require__(/*! ./Sidebar/Sidebar */ \"./components/Sidebar/Sidebar.tsx\");\n/* harmony import */ var _canvases__WEBPACK_IMPORTED_MODULE_65__ = __webpack_require__(/*! ./canvases */ \"./components/canvases/index.tsx\");\n/* harmony import */ var _scene_Renderer__WEBPACK_IMPORTED_MODULE_66__ = __webpack_require__(/*! ../scene/Renderer */ \"./scene/Renderer.ts\");\n/* harmony import */ var _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_67__ = __webpack_require__(/*! ../scene/ShapeCache */ \"./scene/ShapeCache.ts\");\n/* harmony import */ var _SVGLayer__WEBPACK_IMPORTED_MODULE_68__ = __webpack_require__(/*! ./SVGLayer */ \"./components/SVGLayer.tsx\");\n/* harmony import */ var _cursor__WEBPACK_IMPORTED_MODULE_69__ = __webpack_require__(/*! ../cursor */ \"./cursor.ts\");\n/* harmony import */ var _emitter__WEBPACK_IMPORTED_MODULE_70__ = __webpack_require__(/*! ../emitter */ \"./emitter.ts\");\n/* harmony import */ var _element_ElementCanvasButtons__WEBPACK_IMPORTED_MODULE_71__ = __webpack_require__(/*! ../element/ElementCanvasButtons */ \"./element/ElementCanvasButtons.tsx\");\n/* harmony import */ var _data_magic__WEBPACK_IMPORTED_MODULE_72__ = __webpack_require__(/*! ../data/magic */ \"./data/magic.ts\");\n/* harmony import */ var _utils_export__WEBPACK_IMPORTED_MODULE_73__ = __webpack_require__(/*! ../../utils/export */ \"../utils/export.ts\");\n/* harmony import */ var _colors__WEBPACK_IMPORTED_MODULE_74__ = __webpack_require__(/*! ../colors */ \"./colors.ts\");\n/* harmony import */ var _MagicButton__WEBPACK_IMPORTED_MODULE_75__ = __webpack_require__(/*! ./MagicButton */ \"./components/MagicButton.tsx\");\n/* harmony import */ var _icons__WEBPACK_IMPORTED_MODULE_76__ = __webpack_require__(/*! ./icons */ \"./components/icons.tsx\");\n/* harmony import */ var _data_EditorLocalStorage__WEBPACK_IMPORTED_MODULE_77__ = __webpack_require__(/*! ../data/EditorLocalStorage */ \"./data/EditorLocalStorage.ts\");\n/* harmony import */ var _FollowMode_FollowMode__WEBPACK_IMPORTED_MODULE_78__ = __webpack_require__(/*! ./FollowMode/FollowMode */ \"./components/FollowMode/FollowMode.tsx\");\n/* harmony import */ var _actions_actionProperties__WEBPACK_IMPORTED_MODULE_79__ = __webpack_require__(/*! ../actions/actionProperties */ \"./actions/actionProperties.tsx\");\n/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_80__ = __webpack_require__(/*! ../store */ \"./store.ts\");\n/* harmony import */ var _animation_frame_handler__WEBPACK_IMPORTED_MODULE_81__ = __webpack_require__(/*! ../animation-frame-handler */ \"./animation-frame-handler.ts\");\n/* harmony import */ var _animated_trail__WEBPACK_IMPORTED_MODULE_82__ = __webpack_require__(/*! ../animated-trail */ \"./animated-trail.ts\");\n/* harmony import */ var _laser_trails__WEBPACK_IMPORTED_MODULE_83__ = __webpack_require__(/*! ../laser-trails */ \"./laser-trails.ts\");\n/* harmony import */ var _reactUtils__WEBPACK_IMPORTED_MODULE_84__ = __webpack_require__(/*! ../reactUtils */ \"./reactUtils.ts\");\n/* harmony import */ var _renderer_renderElement__WEBPACK_IMPORTED_MODULE_85__ = __webpack_require__(/*! ../renderer/renderElement */ \"./renderer/renderElement.ts\");\n/* harmony import */ var _obsidianUtils__WEBPACK_IMPORTED_MODULE_86__ = __webpack_require__(/*! ../obsidianUtils */ \"./obsidianUtils.ts\");\n/* harmony import */ var _element_collision__WEBPACK_IMPORTED_MODULE_87__ = __webpack_require__(/*! ../element/collision */ \"./element/collision.ts\");\n/* harmony import */ var _element_textWysiwyg__WEBPACK_IMPORTED_MODULE_88__ = __webpack_require__(/*! ../element/textWysiwyg */ \"./element/textWysiwyg.tsx\");\n/* harmony import */ var _scene_scrollbars__WEBPACK_IMPORTED_MODULE_89__ = __webpack_require__(/*! ../scene/scrollbars */ \"./scene/scrollbars.ts\");\n/* harmony import */ var _fractionalIndex__WEBPACK_IMPORTED_MODULE_90__ = __webpack_require__(/*! ../fractionalIndex */ \"./fractionalIndex.ts\");\n/* harmony import */ var _hyperlink_helpers__WEBPACK_IMPORTED_MODULE_91__ = __webpack_require__(/*! ./hyperlink/helpers */ \"./components/hyperlink/helpers.ts\");\n/* harmony import */ var _actions_shortcuts__WEBPACK_IMPORTED_MODULE_92__ = __webpack_require__(/*! ../actions/shortcuts */ \"./actions/shortcuts.ts\");\n/* harmony import */ var _element_resizeElements__WEBPACK_IMPORTED_MODULE_93__ = __webpack_require__(/*! ../element/resizeElements */ \"./element/resizeElements.ts\");\n/* harmony import */ var _actions_actionTextAutoResize__WEBPACK_IMPORTED_MODULE_94__ = __webpack_require__(/*! ../actions/actionTextAutoResize */ \"./actions/actionTextAutoResize.ts\");\n/* harmony import */ var _element_bounds__WEBPACK_IMPORTED_MODULE_95__ = __webpack_require__(/*! ../element/bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _mermaid__WEBPACK_IMPORTED_MODULE_96__ = __webpack_require__(/*! ../mermaid */ \"./mermaid.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n //zsviczian\n\n\n\n\nconst AppContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext(null);\nconst AppPropsContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext(null);\nlet showFourthFont = false; //zsviczian\n\nconst deviceContextInitialValue = {\n viewport: {\n isMobile: false,\n isLandscape: false\n },\n editor: {\n isMobile: false,\n canFitSidebar: false\n },\n isTouchScreen: false\n};\nconst DeviceContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext(deviceContextInitialValue);\nDeviceContext.displayName = \"DeviceContext\";\nconst ExcalidrawContainerContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext({\n container: null,\n id: null\n});\nExcalidrawContainerContext.displayName = \"ExcalidrawContainerContext\";\nconst ExcalidrawElementsContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext([]);\nExcalidrawElementsContext.displayName = \"ExcalidrawElementsContext\";\nconst ExcalidrawAppStateContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext(Object.assign(Object.assign({}, (0,_appState__WEBPACK_IMPORTED_MODULE_10__.getDefaultAppState)()), {\n width: 0,\n height: 0,\n offsetLeft: 0,\n offsetTop: 0\n}));\nExcalidrawAppStateContext.displayName = \"ExcalidrawAppStateContext\";\nconst ExcalidrawSetAppStateContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext(() => {\n console.warn(\"Uninitialized ExcalidrawSetAppStateContext context!\");\n});\nExcalidrawSetAppStateContext.displayName = \"ExcalidrawSetAppStateContext\";\nconst ExcalidrawActionManagerContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext(null);\nExcalidrawActionManagerContext.displayName = \"ExcalidrawActionManagerContext\";\nconst useApp = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(AppContext);\nconst useAppProps = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(AppPropsContext);\nconst useDevice = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(DeviceContext);\nconst useExcalidrawContainer = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(ExcalidrawContainerContext);\nconst useExcalidrawElements = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(ExcalidrawElementsContext);\nconst useExcalidrawAppState = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(ExcalidrawAppStateContext);\nconst useExcalidrawSetAppState = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(ExcalidrawSetAppStateContext);\nconst useExcalidrawActionManager = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(ExcalidrawActionManagerContext);\nlet didTapTwice = false;\nlet tappedTwiceTimer = 0;\nlet isHoldingSpace = false;\nlet isPanning = false;\nlet isDraggingScrollBar = false;\nlet currentScrollBars = {\n horizontal: null,\n vertical: null\n};\nlet touchTimeout = 0;\nlet invalidateContextMenu = false;\nlet hostPlugin; //zsviczian\n\n/**\r\n * Map of youtube embed video states\r\n */\n\nconst YOUTUBE_VIDEO_STATES = new Map();\nlet IS_PLAIN_PASTE = false;\nlet IS_PLAIN_PASTE_TIMER = 0;\nlet PLAIN_PASTE_TOAST_SHOWN = false;\nlet lastPointerUp = null;\nconst gesture = {\n pointers: new Map(),\n lastCenter: null,\n initialDistance: null,\n initialScale: null\n};\n\nclass App extends (react__WEBPACK_IMPORTED_MODULE_1___default().Component) {\n constructor(props) {\n super(props);\n this.interactiveCanvas = null;\n this.unmounted = false;\n this.device = deviceContextInitialValue;\n this.excalidrawContainerRef = react__WEBPACK_IMPORTED_MODULE_1___default().createRef();\n this.files = {};\n this.imageCache = new Map();\n this.iFrameRefs = new Map();\n /**\r\n * Indicates whether the embeddable's url has been validated for rendering.\r\n * If value not set, indicates that the validation is pending.\r\n * Initially or on url change the flag is not reset so that we can guarantee\r\n * the validation came from a trusted source (the editor).\r\n **/\n\n this.embedsValidationStatus = new Map();\n /** embeds that have been inserted to DOM (as a perf optim, we don't want to\r\n * insert to DOM before user initially scrolls to them) */\n\n this.initializedEmbeds = new Set();\n this.elementsPendingErasure = new Set();\n this.lastPointerDownEvent = null;\n this.lastPointerUpEvent = null;\n this.lastPointerMoveEvent = null;\n this.lastViewportPosition = {\n x: 0,\n y: 0\n };\n this.allowMobileMode = true; //zsviczian\n\n this.animationFrameHandler = new _animation_frame_handler__WEBPACK_IMPORTED_MODULE_81__.AnimationFrameHandler();\n this.laserTrails = new _laser_trails__WEBPACK_IMPORTED_MODULE_83__.LaserTrails(this.animationFrameHandler, this);\n this.eraserTrail = new _animated_trail__WEBPACK_IMPORTED_MODULE_82__.AnimatedTrail(this.animationFrameHandler, this, {\n streamline: 0.2,\n size: 5,\n keepHead: true,\n sizeMapping: c => {\n const DECAY_TIME = 200;\n const DECAY_LENGTH = 10;\n const t = Math.max(0, 1 - (performance.now() - c.pressure) / DECAY_TIME);\n const l = (DECAY_LENGTH - Math.min(DECAY_LENGTH, c.totalLength - c.currentIndex)) / DECAY_LENGTH;\n return Math.min((0,_utils__WEBPACK_IMPORTED_MODULE_35__.easeOut)(l), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.easeOut)(t));\n },\n fill: () => this.state.theme === _constants__WEBPACK_IMPORTED_MODULE_12__.THEME.LIGHT ? \"rgba(0, 0, 0, 0.2)\" : \"rgba(255, 255, 255, 0.2)\"\n });\n this.onChangeEmitter = new _emitter__WEBPACK_IMPORTED_MODULE_70__.Emitter();\n this.onPointerDownEmitter = new _emitter__WEBPACK_IMPORTED_MODULE_70__.Emitter();\n this.onPointerUpEmitter = new _emitter__WEBPACK_IMPORTED_MODULE_70__.Emitter();\n this.onUserFollowEmitter = new _emitter__WEBPACK_IMPORTED_MODULE_70__.Emitter();\n this.onScrollChangeEmitter = new _emitter__WEBPACK_IMPORTED_MODULE_70__.Emitter();\n this.missingPointerEventCleanupEmitter = new _emitter__WEBPACK_IMPORTED_MODULE_70__.Emitter();\n this.onRemoveEventListenersEmitter = new _emitter__WEBPACK_IMPORTED_MODULE_70__.Emitter();\n\n this.updateEmbedValidationStatus = (element, status) => {\n this.embedsValidationStatus.set(element.id, status);\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_67__.ShapeCache[\"delete\"](element);\n };\n\n this.updateEmbeddables = () => {\n const iframeLikes = new Set();\n let updated = false;\n this.scene.getNonDeletedElements().filter(element => {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(element)) {\n iframeLikes.add(element.id);\n\n if (!this.embedsValidationStatus.has(element.id)) {\n updated = true;\n const validated = (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.embeddableURLValidator)(element.link, this.props.validateEmbeddable);\n this.updateEmbedValidationStatus(element, validated);\n }\n } else if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeElement)(element)) {\n iframeLikes.add(element.id);\n }\n\n return false;\n });\n\n if (updated) {\n this.scene.triggerUpdate();\n } // GC\n\n\n this.iFrameRefs.forEach((ref, id) => {\n if (!iframeLikes.has(id)) {\n this.iFrameRefs.delete(id);\n }\n });\n };\n\n this.getFrameNameDOMId = frameElement => {\n return `${this.id}-frame-name-${frameElement.id}`;\n };\n\n this.frameNameBoundsCache = {\n get: frameElement => {\n let bounds = this.frameNameBoundsCache._cache.get(frameElement.id);\n\n if (!bounds || bounds.zoom !== this.state.zoom.value || bounds.versionNonce !== frameElement.versionNonce) {\n const frameNameDiv = document.getElementById(this.getFrameNameDOMId(frameElement));\n\n if (frameNameDiv) {\n const box = frameNameDiv.getBoundingClientRect();\n const boxSceneTopLeft = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX: box.x,\n clientY: box.y\n }, this.state);\n const boxSceneBottomRight = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX: box.right,\n clientY: box.bottom\n }, this.state);\n bounds = {\n x: boxSceneTopLeft.x,\n y: boxSceneTopLeft.y,\n width: boxSceneBottomRight.x - boxSceneTopLeft.x,\n height: boxSceneBottomRight.y - boxSceneTopLeft.y,\n angle: 0,\n zoom: this.state.zoom.value,\n versionNonce: frameElement.versionNonce\n };\n\n this.frameNameBoundsCache._cache.set(frameElement.id, bounds);\n\n return bounds;\n }\n\n return null;\n }\n\n return bounds;\n },\n\n /**\r\n * @private\r\n */\n _cache: new Map()\n };\n\n this.renderFrameNames = () => {\n if (!this.state.frameRendering.enabled || !this.state.frameRendering.name) {\n return null;\n }\n\n const isDarkTheme = this.state.theme === _constants__WEBPACK_IMPORTED_MODULE_12__.THEME.DARK;\n let frameIndex = 0;\n let magicFrameIndex = 0;\n return this.scene.getNonDeletedFramesLikes().map(f => {\n var _a, _b;\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameElement)(f)) {\n frameIndex++;\n } else {\n magicFrameIndex++;\n }\n\n if (!(0,_element_sizeHelpers__WEBPACK_IMPORTED_MODULE_27__.isElementInViewport)(f, this.canvas.width / window.devicePixelRatio, this.canvas.height / window.devicePixelRatio, {\n offsetLeft: this.state.offsetLeft,\n offsetTop: this.state.offsetTop,\n scrollX: this.state.scrollX,\n scrollY: this.state.scrollY,\n zoom: this.state.zoom\n }, this.scene.getNonDeletedElementsMap())) {\n // if frame not visible, don't render its name\n return null;\n }\n\n const {\n x: x1,\n y: y1\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.sceneCoordsToViewportCoords)({\n sceneX: f.x,\n sceneY: f.y\n }, this.state);\n const FRAME_NAME_EDIT_PADDING = 6;\n\n const reset = () => {\n var _a;\n\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(f, {\n name: ((_a = f.name) === null || _a === void 0 ? void 0 : _a.trim()) || null\n });\n this.setState({\n editingFrame: null\n });\n };\n\n let frameNameJSX;\n const frameName = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getFrameLikeTitle)(f, (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameElement)(f) ? frameIndex : magicFrameIndex);\n\n if (f.id === this.state.editingFrame) {\n const frameNameInEdit = frameName;\n frameNameJSX = (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"input\", {\n autoFocus: true,\n value: frameNameInEdit,\n onChange: e => {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(f, {\n name: e.target.value\n });\n },\n onFocus: e => e.target.select(),\n onBlur: () => reset(),\n onKeyDown: event => {\n // for some inexplicable reason, `onBlur` triggered on ESC\n // does not reset `state.editingFrame` despite being called,\n // and we need to reset it here as well\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ESCAPE || event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ENTER) {\n reset();\n }\n },\n style: {\n background: this.state.viewBackgroundColor,\n filter: isDarkTheme ? _constants__WEBPACK_IMPORTED_MODULE_12__.THEME_FILTER : \"none\",\n zIndex: 2,\n border: \"none\",\n display: \"block\",\n padding: `${FRAME_NAME_EDIT_PADDING}px`,\n borderRadius: 4,\n boxShadow: \"inset 0 0 0 2px var(--color-on-primary-container)\",\n fontFamily: \"Assistant\",\n fontSize: \"14px\",\n transform: `translate(-${FRAME_NAME_EDIT_PADDING}px, ${FRAME_NAME_EDIT_PADDING}px)`,\n color: \"var(--color-gray-80)\",\n overflow: \"hidden\",\n maxWidth: `${(0,_obsidianUtils__WEBPACK_IMPORTED_MODULE_86__.getExcalidrawContentEl)().clientWidth - x1 - FRAME_NAME_EDIT_PADDING //zsviczian was document.body\n }px`\n },\n size: frameNameInEdit.length + 1 || 1,\n dir: \"auto\",\n autoComplete: \"off\",\n autoCapitalize: \"off\",\n autoCorrect: \"off\"\n });\n } else {\n frameNameJSX = frameName;\n }\n\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n id: this.getFrameNameDOMId(f),\n style: {\n position: \"absolute\",\n // Positioning from bottom so that we don't to either\n // calculate text height or adjust using transform (which)\n // messes up input position when editing the frame name.\n // This makes the positioning deterministic and we can calculate\n // the same position when rendering to canvas / svg.\n bottom: `${this.state.height + _constants__WEBPACK_IMPORTED_MODULE_12__.FRAME_STYLE.nameOffsetY - y1 + this.state.offsetTop}px`,\n left: `${x1 - this.state.offsetLeft}px`,\n zIndex: 2,\n fontSize: _constants__WEBPACK_IMPORTED_MODULE_12__.FRAME_STYLE.nameFontSize,\n color: (_b = (_a = this.state.frameColor) === null || _a === void 0 ? void 0 : _a.nameColor) !== null && _b !== void 0 ? _b : isDarkTheme //zsviczian\n ? _constants__WEBPACK_IMPORTED_MODULE_12__.FRAME_STYLE.nameColorDarkTheme : _constants__WEBPACK_IMPORTED_MODULE_12__.FRAME_STYLE.nameColorLightTheme,\n lineHeight: _constants__WEBPACK_IMPORTED_MODULE_12__.FRAME_STYLE.nameLineHeight,\n width: \"max-content\",\n maxWidth: `${f.width}px`,\n overflow: f.id === this.state.editingFrame ? \"visible\" : \"hidden\",\n whiteSpace: \"nowrap\",\n textOverflow: \"ellipsis\",\n cursor: _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.MOVE,\n pointerEvents: this.state.viewModeEnabled ? _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_EVENTS.disabled : _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_EVENTS.enabled\n },\n onPointerDown: event => this.handleCanvasPointerDown(event),\n onWheel: event => this.handleWheel(event),\n onContextMenu: this.handleCanvasContextMenu,\n onDoubleClick: () => {\n this.setState({\n editingFrame: f.id\n });\n }\n }, {\n children: frameNameJSX\n }), f.id);\n });\n };\n\n this.focusContainer = () => {\n var _a;\n\n (_a = this.excalidrawContainerRef.current) === null || _a === void 0 ? void 0 : _a.focus();\n };\n\n this.getSceneElementsIncludingDeleted = () => {\n return this.scene.getElementsIncludingDeleted();\n };\n\n this.getSceneElements = () => {\n return this.scene.getNonDeletedElements();\n };\n\n this.onInsertElements = elements => {\n this.addElementsFromPasteOrLibrary({\n elements,\n position: \"center\",\n files: null\n });\n };\n\n this.onExportImage = async (type, elements, opts) => {\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"export\", type, \"ui\");\n const fileHandle = await (0,_data__WEBPACK_IMPORTED_MODULE_13__.exportCanvas)(type, elements, this.state, this.files, {\n exportBackground: this.state.exportBackground,\n name: this.getName(),\n viewBackgroundColor: this.state.viewBackgroundColor,\n exportingFrame: opts.exportingFrame\n }).catch(_utils__WEBPACK_IMPORTED_MODULE_35__.muteFSAbortError).catch(error => {\n console.error(error);\n this.setState({\n errorMessage: error.message\n });\n });\n\n if (this.state.exportEmbedScene && fileHandle && (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.isImageFileHandle)(fileHandle)) {\n this.setState({\n fileHandle\n });\n }\n };\n\n this.magicGenerations = new Map();\n\n this.updateMagicGeneration = ({\n frameElement,\n data\n }) => {\n if (data.status === \"pending\") {\n // We don't wanna persist pending state to storage. It should be in-app\n // state only.\n // Thus reset so that we prefer local cache (if there was some\n // generationData set previously)\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(frameElement, {\n customData: {\n generationData: undefined\n }\n }, false);\n } else {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(frameElement, {\n customData: {\n generationData: data\n }\n }, false);\n }\n\n this.magicGenerations.set(frameElement.id, data);\n this.triggerRender();\n };\n\n this.OPENAI_KEY_IS_PERSISTED = _data_EditorLocalStorage__WEBPACK_IMPORTED_MODULE_77__.EditorLocalStorage.has(_constants__WEBPACK_IMPORTED_MODULE_12__.EDITOR_LS_KEYS.OAI_API_KEY) || false;\n\n this.onOpenAIKeyChange = (openAIKey, shouldPersist) => {\n this.OPENAI_KEY = openAIKey || null;\n\n if (shouldPersist) {\n const didPersist = _data_EditorLocalStorage__WEBPACK_IMPORTED_MODULE_77__.EditorLocalStorage.set(_constants__WEBPACK_IMPORTED_MODULE_12__.EDITOR_LS_KEYS.OAI_API_KEY, openAIKey);\n this.OPENAI_KEY_IS_PERSISTED = didPersist;\n } else {\n this.OPENAI_KEY_IS_PERSISTED = false;\n }\n };\n\n this.onMagicSettingsConfirm = (apiKey, shouldPersist, source) => {\n this.OPENAI_KEY = apiKey || null;\n this.onOpenAIKeyChange(this.OPENAI_KEY, shouldPersist);\n\n if (source === \"settings\") {\n return;\n }\n\n const selectedElements = this.scene.getSelectedElements({\n selectedElementIds: this.state.selectedElementIds\n });\n\n if (apiKey) {\n if (selectedElements.length) {\n this.onMagicframeToolSelect();\n } else {\n this.setActiveTool({\n type: \"magicframe\"\n });\n }\n } else if (!(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isMagicFrameElement)(selectedElements[0])) {\n // even if user didn't end up setting api key, let's pick the tool\n // so they can draw up a frame and move forward\n this.setActiveTool({\n type: \"magicframe\"\n });\n }\n };\n\n this.onMagicframeToolSelect = () => {\n if (!this.OPENAI_KEY) {\n this.setToast({\n message: \"You must first configure your OpenAI API key in plugin settings\",\n duration: 5000\n });\n return;\n }\n\n const selectedElements = this.scene.getSelectedElements({\n selectedElementIds: this.state.selectedElementIds\n });\n\n if (selectedElements.length === 0) {\n this.setActiveTool({\n type: _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.magicframe\n });\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"ai\", \"tool-select (empty-selection)\", \"d2c\");\n } else {\n const selectedMagicFrame = selectedElements.length === 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isMagicFrameElement)(selectedElements[0]) && selectedElements[0]; // case: user selected elements containing frame-like(s) or are frame\n // members, we don't want to wrap into another magicframe\n // (unless the only selected element is a magic frame which we reuse)\n\n if (!selectedMagicFrame && selectedElements.some(el => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(el) || el.frameId)) {\n this.setActiveTool({\n type: _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.magicframe\n });\n return;\n }\n\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"ai\", \"tool-select (existing selection)\", \"d2c\");\n let frame;\n\n if (selectedMagicFrame) {\n // a single magicframe already selected -> use it\n frame = selectedMagicFrame;\n } else {\n // selected elements aren't wrapped in magic frame yet -> wrap now\n const [minX, minY, maxX, maxY] = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getCommonBounds)(selectedElements);\n const padding = 50;\n frame = (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.newMagicFrameElement)(Object.assign(Object.assign({}, _constants__WEBPACK_IMPORTED_MODULE_12__.FRAME_STYLE), {\n x: minX - padding,\n y: minY - padding,\n width: maxX - minX + padding * 2,\n height: maxY - minY + padding * 2,\n opacity: 100,\n locked: false\n }));\n this.scene.insertElement(frame);\n\n for (const child of selectedElements) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(child, {\n frameId: frame.id\n });\n }\n\n this.setState({\n selectedElementIds: {\n [frame.id]: true\n }\n });\n }\n\n this.onMagicFrameGenerate(frame, \"upstream\");\n }\n };\n\n this.openEyeDropper = ({\n type\n }) => {\n _jotai__WEBPACK_IMPORTED_MODULE_56__.jotaiStore.set(_EyeDropper__WEBPACK_IMPORTED_MODULE_62__.activeEyeDropperAtom, {\n swapPreviewOnAlt: true,\n colorPickerType: type === \"stroke\" ? \"elementStroke\" : \"elementBackground\",\n onSelect: (color, event) => {\n const shouldUpdateStrokeColor = type === \"background\" && event.altKey || type === \"stroke\" && !event.altKey;\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (!selectedElements.length || this.state.activeTool.type !== \"selection\") {\n if (shouldUpdateStrokeColor) {\n this.syncActionResult({\n appState: Object.assign(Object.assign({}, this.state), {\n currentItemStrokeColor: color\n }),\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.CAPTURE\n });\n } else {\n this.syncActionResult({\n appState: Object.assign(Object.assign({}, this.state), {\n currentItemBackgroundColor: color\n }),\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.CAPTURE\n });\n }\n } else {\n this.updateScene({\n elements: this.scene.getElementsIncludingDeleted().map(el => {\n if (this.state.selectedElementIds[el.id]) {\n return (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.newElementWith)(el, {\n [shouldUpdateStrokeColor ? \"strokeColor\" : \"backgroundColor\"]: color\n });\n }\n\n return el;\n }),\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.CAPTURE\n });\n }\n },\n keepOpenOnAlt: false\n });\n };\n\n this.syncActionResult = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(actionResult => {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j;\n\n if (this.unmounted || actionResult === false) {\n return;\n }\n\n if (actionResult.storeAction === _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.UPDATE) {\n this.store.shouldUpdateSnapshot();\n } else if (actionResult.storeAction === _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.CAPTURE) {\n this.store.shouldCaptureIncrement();\n }\n\n let didUpdate = false;\n let editingElement = null;\n\n if (actionResult.elements) {\n actionResult.elements.forEach(element => {\n var _a;\n\n if (((_a = this.state.editingElement) === null || _a === void 0 ? void 0 : _a.id) === element.id && this.state.editingElement !== element && (0,_element__WEBPACK_IMPORTED_MODULE_16__.isNonDeletedElement)(element)) {\n editingElement = element;\n }\n });\n this.scene.replaceAllElements(actionResult.elements);\n didUpdate = true;\n }\n\n if (actionResult.files) {\n this.files = actionResult.replaceFiles ? actionResult.files : Object.assign(Object.assign({}, this.files), actionResult.files);\n this.addNewImagesToImageCache();\n }\n\n if (actionResult.appState || editingElement || this.state.contextMenu) {\n let viewModeEnabled = ((_a = actionResult === null || actionResult === void 0 ? void 0 : actionResult.appState) === null || _a === void 0 ? void 0 : _a.viewModeEnabled) || false;\n let zenModeEnabled = ((_b = actionResult === null || actionResult === void 0 ? void 0 : actionResult.appState) === null || _b === void 0 ? void 0 : _b.zenModeEnabled) || false;\n let gridSize = ((_c = actionResult === null || actionResult === void 0 ? void 0 : actionResult.appState) === null || _c === void 0 ? void 0 : _c.gridSize) || null;\n const theme = ((_d = actionResult === null || actionResult === void 0 ? void 0 : actionResult.appState) === null || _d === void 0 ? void 0 : _d.theme) || this.props.theme || _constants__WEBPACK_IMPORTED_MODULE_12__.THEME.LIGHT;\n const name = (_f = (_e = actionResult === null || actionResult === void 0 ? void 0 : actionResult.appState) === null || _e === void 0 ? void 0 : _e.name) !== null && _f !== void 0 ? _f : this.state.name;\n const errorMessage = (_h = (_g = actionResult === null || actionResult === void 0 ? void 0 : actionResult.appState) === null || _g === void 0 ? void 0 : _g.errorMessage) !== null && _h !== void 0 ? _h : this.state.errorMessage;\n\n if (typeof this.props.viewModeEnabled !== \"undefined\") {\n viewModeEnabled = this.props.viewModeEnabled;\n }\n\n if (typeof this.props.zenModeEnabled !== \"undefined\") {\n zenModeEnabled = this.props.zenModeEnabled;\n }\n\n if (typeof this.props.gridModeEnabled !== \"undefined\") {\n gridSize = this.props.gridModeEnabled ? _constants__WEBPACK_IMPORTED_MODULE_12__.GRID_SIZE : null;\n }\n\n editingElement = editingElement || ((_j = actionResult.appState) === null || _j === void 0 ? void 0 : _j.editingElement) || null;\n\n if (editingElement === null || editingElement === void 0 ? void 0 : editingElement.isDeleted) {\n editingElement = null;\n }\n\n this.setState(state => {\n // using Object.assign instead of spread to fool TS 4.2.2+ into\n // regarding the resulting type as not containing undefined\n // (which the following expression will never contain)\n return Object.assign(actionResult.appState || {}, {\n // NOTE this will prevent opening context menu using an action\n // or programmatically from the host, so it will need to be\n // rewritten later\n contextMenu: null,\n editingElement,\n viewModeEnabled,\n zenModeEnabled,\n gridSize,\n theme,\n name,\n errorMessage\n });\n });\n didUpdate = true;\n }\n\n if (!didUpdate && actionResult.storeAction !== _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.NONE) {\n this.scene.triggerUpdate();\n }\n }); // Lifecycle\n\n this.onBlur = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(() => {\n isHoldingSpace = false;\n this.setState({\n isBindingEnabled: true\n });\n });\n\n this.onUnload = () => {\n this.onBlur();\n };\n\n this.disableEvent = event => {\n event.preventDefault();\n };\n\n this.resetHistory = () => {\n this.history.clear();\n };\n\n this.resetStore = () => {\n this.store.clear();\n };\n /**\r\n * Resets scene & history.\r\n * ! Do not use to clear scene user action !\r\n */\n\n\n this.resetScene = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(opts => {\n this.scene.replaceAllElements([]);\n this.setState(state => Object.assign(Object.assign({}, (0,_appState__WEBPACK_IMPORTED_MODULE_10__.getDefaultAppState)()), {\n isLoading: (opts === null || opts === void 0 ? void 0 : opts.resetLoadingState) ? false : state.isLoading,\n theme: this.state.theme\n }));\n this.resetStore();\n this.resetHistory();\n });\n\n this.initializeScene = async () => {\n var _a;\n\n if (\"launchQueue\" in window && \"LaunchParams\" in window) {\n window.launchQueue.setConsumer(async launchParams => {\n if (!launchParams.files.length) {\n return;\n }\n\n const fileHandle = launchParams.files[0];\n const blob = await fileHandle.getFile();\n this.loadFileToCanvas(new File([blob], blob.name || \"\", {\n type: blob.type\n }), fileHandle);\n });\n }\n\n if (this.props.theme) {\n this.setState({\n theme: this.props.theme\n });\n }\n\n if (!this.state.isLoading) {\n this.setState({\n isLoading: true\n });\n }\n\n let initialData = null;\n\n try {\n initialData = (await this.props.initialData) || null;\n\n if (initialData === null || initialData === void 0 ? void 0 : initialData.libraryItems) {\n this.library.updateLibrary({\n libraryItems: initialData.libraryItems,\n merge: true\n }).catch(error => {\n console.error(error);\n });\n }\n } catch (error) {\n console.error(error);\n initialData = {\n appState: {\n errorMessage: error.message || \"Encountered an error during importing or restoring scene data\"\n }\n };\n }\n\n const scene = (0,_data_restore__WEBPACK_IMPORTED_MODULE_15__.restore)(initialData, null, null, {\n repairBindings: true\n });\n scene.appState = Object.assign(Object.assign({}, scene.appState), {\n theme: this.props.theme || scene.appState.theme,\n // we're falling back to current (pre-init) state when deciding\n // whether to open the library, to handle a case where we\n // update the state outside of initialData (e.g. when loading the app\n // with a library install link, which should auto-open the library)\n openSidebar: ((_a = scene.appState) === null || _a === void 0 ? void 0 : _a.openSidebar) || this.state.openSidebar,\n activeTool: scene.appState.activeTool.type === \"image\" ? Object.assign(Object.assign({}, scene.appState.activeTool), {\n type: \"selection\"\n }) : scene.appState.activeTool,\n isLoading: false,\n toast: this.state.toast\n });\n\n if (initialData === null || initialData === void 0 ? void 0 : initialData.scrollToContent) {\n scene.appState = Object.assign(Object.assign({}, scene.appState), (0,_scene__WEBPACK_IMPORTED_MODULE_29__.calculateScrollCenter)(scene.elements, Object.assign(Object.assign({}, scene.appState), {\n width: this.state.width,\n height: this.state.height,\n offsetTop: this.state.offsetTop,\n offsetLeft: this.state.offsetLeft\n })));\n } // FontFaceSet loadingdone event we listen on may not always fire\n // (looking at you Safari), so on init we manually load fonts for current\n // text elements on canvas, and rerender them once done. This also\n // seems faster even in browsers that do fire the loadingdone event.\n\n\n this.fonts.loadFontsForElements(scene.elements);\n this.resetStore();\n this.resetHistory();\n this.syncActionResult(Object.assign(Object.assign({}, scene), {\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.UPDATE\n }));\n };\n\n this.isMobileBreakpoint = (width, height) => {\n return width !== 0 && //zsviczian changing tabs in Obsidian causes MobileMenu to be rendered\n this.allowMobileMode && ( //zsviczian\n width < _constants__WEBPACK_IMPORTED_MODULE_12__.MQ_MAX_WIDTH_PORTRAIT || height < _constants__WEBPACK_IMPORTED_MODULE_12__.MQ_MAX_HEIGHT_LANDSCAPE && width < _constants__WEBPACK_IMPORTED_MODULE_12__.MQ_MAX_WIDTH_LANDSCAPE);\n };\n\n this.refreshViewportBreakpoints = () => {\n const container = this.excalidrawContainerRef.current;\n\n if (!container) {\n return;\n }\n\n const {\n clientWidth: viewportWidth,\n clientHeight: viewportHeight\n } = (0,_obsidianUtils__WEBPACK_IMPORTED_MODULE_86__.getExcalidrawContentEl)(); //zsviczian was document.body;\n\n const prevViewportState = this.device.viewport;\n const nextViewportState = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateObject)(prevViewportState, {\n isLandscape: viewportWidth > viewportHeight,\n isMobile: this.isMobileBreakpoint(viewportWidth, viewportHeight)\n });\n\n if (prevViewportState !== nextViewportState) {\n this.device = Object.assign(Object.assign({}, this.device), {\n viewport: nextViewportState\n });\n return true;\n }\n\n return false;\n };\n\n this.refreshEditorBreakpoints = () => {\n const container = this.excalidrawContainerRef.current;\n\n if (!container) {\n return;\n }\n\n const {\n width: editorWidth,\n height: editorHeight\n } = container.getBoundingClientRect();\n const sidebarBreakpoint = this.props.UIOptions.dockedSidebarBreakpoint != null ? this.props.UIOptions.dockedSidebarBreakpoint : _constants__WEBPACK_IMPORTED_MODULE_12__.MQ_RIGHT_SIDEBAR_MIN_WIDTH;\n const prevEditorState = this.device.editor;\n const nextEditorState = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateObject)(prevEditorState, {\n isMobile: this.isMobileBreakpoint(editorWidth, editorHeight),\n canFitSidebar: editorWidth > sidebarBreakpoint\n });\n\n if (prevEditorState !== nextEditorState) {\n this.device = Object.assign(Object.assign({}, this.device), {\n editor: nextEditorState\n });\n return true;\n }\n\n return false;\n };\n\n this.onResize = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(() => {\n this.scene.getElementsIncludingDeleted().forEach(element => _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_67__.ShapeCache[\"delete\"](element));\n this.refreshViewportBreakpoints();\n this.updateDOMRect();\n\n if (!_constants__WEBPACK_IMPORTED_MODULE_12__.supportsResizeObserver) {\n this.refreshEditorBreakpoints();\n }\n\n this.setState({});\n });\n /** generally invoked only if fullscreen was invoked programmatically */\n\n this.onFullscreenChange = () => {\n var _a;\n\n if ( // points to the iframe element we fullscreened\n !document.fullscreenElement && ((_a = this.state.activeEmbeddable) === null || _a === void 0 ? void 0 : _a.state) === \"active\") {\n this.setState({\n activeEmbeddable: null\n });\n }\n };\n\n this.renderInteractiveSceneCallback = ({\n atLeastOneVisibleElement,\n scrollBars,\n elementsMap\n }) => {\n if (!document.querySelector(\".excalidraw\")) {\n return;\n } //zsviczian - address issue when moving excalidraw to a new window/document\n\n\n if (scrollBars) {\n currentScrollBars = scrollBars;\n }\n\n const scrolledOutside = // hide when editing text\n (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(this.state.editingElement) ? false : !atLeastOneVisibleElement && elementsMap.size > 0;\n\n if (this.state.scrolledOutside !== scrolledOutside) {\n this.setState({\n scrolledOutside\n });\n }\n\n this.scheduleImageRefresh();\n };\n\n this.onScroll = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.debounce)(() => {\n const {\n offsetTop,\n offsetLeft\n } = this.getCanvasOffsets();\n this.setState(state => {\n if (state.offsetLeft === offsetLeft && state.offsetTop === offsetTop) {\n return null;\n }\n\n return {\n offsetTop,\n offsetLeft\n };\n });\n }, _constants__WEBPACK_IMPORTED_MODULE_12__.SCROLL_TIMEOUT); // Copy/paste\n\n this.onCut = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n var _a;\n\n const isExcalidrawActive = (_a = this.excalidrawContainerRef.current) === null || _a === void 0 ? void 0 : _a.contains(document.activeElement);\n\n if (!isExcalidrawActive || (0,_utils__WEBPACK_IMPORTED_MODULE_35__.isWritableElement)(event.target)) {\n return;\n }\n\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionCut, \"keyboard\", event);\n event.preventDefault();\n event.stopPropagation();\n });\n this.onCopy = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n var _a;\n\n const isExcalidrawActive = (_a = this.excalidrawContainerRef.current) === null || _a === void 0 ? void 0 : _a.contains(document.activeElement);\n\n if (!isExcalidrawActive || (0,_utils__WEBPACK_IMPORTED_MODULE_35__.isWritableElement)(event.target)) {\n return;\n }\n\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionCopy, \"keyboard\", event);\n event.preventDefault();\n event.stopPropagation();\n });\n\n this.onTouchStart = event => {\n // fix for Apple Pencil Scribble (do not prevent for other devices)\n if (_constants__WEBPACK_IMPORTED_MODULE_12__.isIOS) {\n event.preventDefault();\n }\n\n if (!didTapTwice) {\n didTapTwice = true;\n clearTimeout(tappedTwiceTimer);\n tappedTwiceTimer = window.setTimeout(App.resetTapTwice, _constants__WEBPACK_IMPORTED_MODULE_12__.TAP_TWICE_TIMEOUT);\n return;\n } // insert text only if we tapped twice with a single finger\n // event.touches.length === 1 will also prevent inserting text when user's zooming\n\n\n if (didTapTwice && event.touches.length === 1) {\n const touch = event.touches[0]; // @ts-ignore\n\n this.handleCanvasDoubleClick({\n clientX: touch.clientX,\n clientY: touch.clientY\n });\n didTapTwice = false;\n clearTimeout(tappedTwiceTimer);\n }\n\n if (event.touches.length === 2) {\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n activeEmbeddable: null\n });\n }\n };\n\n this.onTouchEnd = event => {\n this.resetContextMenuTimer();\n\n if (event.touches.length > 0) {\n this.setState({\n previousSelectedElementIds: {},\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(this.state.previousSelectedElementIds, this.state)\n });\n } else {\n gesture.pointers.clear();\n }\n };\n\n this.pasteFromClipboard = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(async event => {\n var _a, _b;\n\n const isPlainPaste = !!IS_PLAIN_PASTE; // #686\n\n const target = document.activeElement;\n const isExcalidrawActive = (_a = this.excalidrawContainerRef.current) === null || _a === void 0 ? void 0 : _a.contains(target);\n\n if (event && !isExcalidrawActive) {\n return;\n }\n\n const elementUnderCursor = document.elementFromPoint(this.lastViewportPosition.x, this.lastViewportPosition.y);\n\n if (event && (!(elementUnderCursor instanceof HTMLCanvasElement) || (0,_utils__WEBPACK_IMPORTED_MODULE_35__.isWritableElement)(target))) {\n return;\n }\n\n const {\n x: sceneX,\n y: sceneY\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX: this.lastViewportPosition.x,\n clientY: this.lastViewportPosition.y\n }, this.state); // must be called in the same frame (thus before any awaits) as the paste\n // event else some browsers (FF...) will clear the clipboardData\n // (something something security)\n\n let file = (_b = event === null || event === void 0 ? void 0 : event.clipboardData) === null || _b === void 0 ? void 0 : _b.files[0];\n const data = await (0,_clipboard__WEBPACK_IMPORTED_MODULE_11__.parseClipboard)(event, isPlainPaste);\n\n if (!file && !isPlainPaste) {\n if (data.mixedContent) {\n return this.addElementsFromMixedContentPaste(data.mixedContent, {\n isPlainPaste,\n sceneX,\n sceneY\n });\n } else if (data.text) {\n const string = data.text.trim();\n\n if (string.startsWith(\"<svg\") && string.endsWith(\"</svg>\")) {\n // ignore SVG validation/normalization which will be done during image\n // initialization\n file = (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.SVGStringToFile)(string);\n }\n }\n } // prefer spreadsheet data over image file (MS Office/Libre Office)\n\n\n if ((0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.isSupportedImageFile)(file) && !data.spreadsheet) {\n if (!this.isToolSupported(\"image\")) {\n this.setState({\n errorMessage: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.imageToolNotSupported\")\n });\n return;\n }\n\n const imageElement = this.createImageElement({\n sceneX,\n sceneY\n });\n this.insertImageElement(imageElement, file);\n this.initializeImageDimensions(imageElement);\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({\n [imageElement.id]: true\n }, this.state)\n });\n return;\n }\n\n if (this.props.onPaste) {\n try {\n if ((await this.props.onPaste(data, event)) === false) {\n return;\n }\n } catch (error) {\n console.error(error);\n }\n }\n\n if (data.errorMessage) {\n this.setState({\n errorMessage: data.errorMessage\n });\n } else if (data.spreadsheet && !isPlainPaste) {\n this.setState({\n pasteDialog: {\n data: data.spreadsheet,\n shown: true\n }\n });\n } else if (data.elements) {\n const elements = data.programmaticAPI ? (0,_data_transform__WEBPACK_IMPORTED_MODULE_63__.convertToExcalidrawElements)(data.elements) : data.elements; // TODO remove formatting from elements if isPlainPaste\n\n this.addElementsFromPasteOrLibrary({\n elements,\n files: data.files || null,\n position: \"cursor\",\n retainSeed: isPlainPaste\n });\n } else if (data.text) {\n if (data.text && (0,_mermaid__WEBPACK_IMPORTED_MODULE_96__.isMaybeMermaidDefinition)(data.text)) {\n const api = await Promise.resolve(/*! import() */).then(__webpack_require__.bind(__webpack_require__, /*! @zsviczian/mermaid-to-excalidraw */ \"../../node_modules/@zsviczian/mermaid-to-excalidraw/dist/index.js\")); //zsviczian\n\n try {\n const {\n elements: skeletonElements,\n files\n } = await api.parseMermaidToExcalidraw(data.text, {\n fontSize: _constants__WEBPACK_IMPORTED_MODULE_12__.DEFAULT_FONT_SIZE\n });\n const elements = (0,_data_transform__WEBPACK_IMPORTED_MODULE_63__.convertToExcalidrawElements)(skeletonElements, {\n regenerateIds: true\n });\n this.addElementsFromPasteOrLibrary({\n elements,\n files,\n position: \"cursor\"\n });\n return;\n } catch (err) {\n console.warn(`parsing pasted text as mermaid definition failed: ${err.message}`);\n }\n }\n\n const nonEmptyLines = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.normalizeEOL)(data.text).split(/\\n+/).map(s => s.trim()).filter(Boolean);\n const embbeddableUrls = nonEmptyLines.map(str => (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.maybeParseEmbedSrc)(str)).filter(string => {\n var _a;\n\n return (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.embeddableURLValidator)(string, this.props.validateEmbeddable) && (/^(http|https):\\/\\/[^\\s/$.?#].[^\\s]*$/.test(string) || ((_a = (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.getEmbedLink)(string)) === null || _a === void 0 ? void 0 : _a.type) === \"video\");\n });\n\n if (!IS_PLAIN_PASTE && embbeddableUrls.length > 0 && // if there were non-embeddable text (lines) mixed in with embeddable\n // urls, ignore and paste as text\n embbeddableUrls.length === nonEmptyLines.length) {\n const embeddables = [];\n\n for (const url of embbeddableUrls) {\n const prevEmbeddable = embeddables[embeddables.length - 1];\n const embeddable = this.insertEmbeddableElement({\n sceneX: prevEmbeddable ? prevEmbeddable.x + prevEmbeddable.width + 20 : sceneX,\n sceneY,\n link: (0,_data_url__WEBPACK_IMPORTED_MODULE_47__.normalizeLink)(url)\n });\n\n if (embeddable) {\n embeddables.push(embeddable);\n }\n }\n\n if (embeddables.length) {\n this.setState({\n selectedElementIds: Object.fromEntries(embeddables.map(embeddable => [embeddable.id, true]))\n });\n }\n\n return;\n }\n\n this.addTextFromPaste(data.text, isPlainPaste);\n }\n\n this.setActiveTool({\n type: \"selection\"\n });\n event === null || event === void 0 ? void 0 : event.preventDefault();\n });\n\n this.addElementsFromPasteOrLibrary = opts => {\n const elements = (0,_data_restore__WEBPACK_IMPORTED_MODULE_15__.restoreElements)(opts.elements, null, undefined);\n const [minX, minY, maxX, maxY] = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getCommonBounds)(elements);\n const elementsCenterX = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.distance)(minX, maxX) / 2;\n const elementsCenterY = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.distance)(minY, maxY) / 2;\n const clientX = typeof opts.position === \"object\" ? opts.position.clientX : opts.position === \"cursor\" ? this.lastViewportPosition.x : this.state.width / 2 + this.state.offsetLeft;\n const clientY = typeof opts.position === \"object\" ? opts.position.clientY : opts.position === \"cursor\" ? this.lastViewportPosition.y : this.state.height / 2 + this.state.offsetTop;\n const {\n x,\n y\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX,\n clientY\n }, this.state);\n const dx = x - elementsCenterX;\n const dy = y - elementsCenterY;\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(dx, dy, this.state.gridSize);\n const newElements = (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.duplicateElements)(elements.map(element => {\n return (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.newElementWith)(element, {\n x: element.x + gridX - minX,\n y: element.y + gridY - minY\n });\n }), {\n randomizeSeed: !opts.retainSeed\n });\n const prevElements = this.scene.getElementsIncludingDeleted();\n const nextElements = [...prevElements, ...newElements];\n (0,_fractionalIndex__WEBPACK_IMPORTED_MODULE_90__.syncMovedIndices)(nextElements, (0,_utils__WEBPACK_IMPORTED_MODULE_35__.arrayToMap)(newElements));\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords({\n x,\n y\n });\n\n if (topLayerFrame) {\n const eligibleElements = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.filterElementsEligibleAsFrameChildren)(newElements, topLayerFrame);\n (0,_frame__WEBPACK_IMPORTED_MODULE_51__.addElementsToFrame)(nextElements, eligibleElements, topLayerFrame);\n }\n\n this.scene.replaceAllElements(nextElements);\n newElements.forEach(newElement => {\n if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(newElement) && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBoundToContainer)(newElement)) {\n const container = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getContainerElement)(newElement, this.scene.getElementsMapIncludingDeleted());\n (0,_element__WEBPACK_IMPORTED_MODULE_16__.redrawTextBoundingBox)(newElement, container, this.scene.getElementsMapIncludingDeleted());\n }\n });\n\n if (opts.files) {\n this.files = Object.assign(Object.assign({}, this.files), opts.files);\n }\n\n this.store.shouldCaptureIncrement();\n const nextElementsToSelect = (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.excludeElementsInFramesFromSelection)(newElements);\n this.setState(Object.assign(Object.assign(Object.assign({}, this.state), {\n // keep sidebar (presumably the library) open if it's docked and\n // can fit.\n //\n // Note, we should close the sidebar only if we're dropping items\n // from library, not when pasting from clipboard. Alas.\n openSidebar: this.state.openSidebar && this.device.editor.canFitSidebar && _jotai__WEBPACK_IMPORTED_MODULE_56__.jotaiStore.get(_Sidebar_Sidebar__WEBPACK_IMPORTED_MODULE_64__.isSidebarDockedAtom) ? this.state.openSidebar : null\n }), (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: null,\n selectedElementIds: nextElementsToSelect.reduce((acc, element) => {\n if (!(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBoundToContainer)(element)) {\n acc[element.id] = true;\n }\n\n return acc;\n }, {})\n }, this.scene.getNonDeletedElements(), this.state, this)), () => {\n if (opts.files) {\n this.addNewImagesToImageCache();\n }\n });\n this.setActiveTool({\n type: \"selection\"\n });\n\n if (opts.fitToContent) {\n this.scrollToContent(newElements, {\n fitToContent: true\n });\n }\n };\n\n this.setAppState = (state, callback) => {\n this.setState(state, callback);\n };\n\n this.removePointer = event => {\n if (touchTimeout) {\n this.resetContextMenuTimer();\n }\n\n gesture.pointers.delete(event.pointerId);\n };\n\n this.toggleLock = (source = \"ui\") => {\n if (!this.state.activeTool.locked) {\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"toolbar\", \"toggleLock\", `${source} (${this.device.editor.isMobile ? \"mobile\" : \"desktop\"})`);\n }\n\n this.setState(prevState => {\n return {\n activeTool: Object.assign(Object.assign(Object.assign({}, prevState.activeTool), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, prevState.activeTool.locked ? {\n type: \"selection\"\n } : prevState.activeTool)), {\n locked: !prevState.activeTool.locked\n })\n };\n });\n };\n\n this.updateFrameRendering = opts => {\n this.setState(prevState => {\n var _a, _b, _c, _d;\n\n const next = typeof opts === \"function\" ? opts(prevState.frameRendering) : opts;\n return {\n frameRendering: {\n enabled: (_a = next === null || next === void 0 ? void 0 : next.enabled) !== null && _a !== void 0 ? _a : prevState.frameRendering.enabled,\n clip: (_b = next === null || next === void 0 ? void 0 : next.clip) !== null && _b !== void 0 ? _b : prevState.frameRendering.clip,\n name: (_c = next === null || next === void 0 ? void 0 : next.name) !== null && _c !== void 0 ? _c : prevState.frameRendering.name,\n outline: (_d = next === null || next === void 0 ? void 0 : next.outline) !== null && _d !== void 0 ? _d : prevState.frameRendering.outline\n }\n };\n });\n };\n\n this.togglePenMode = force => {\n this.setState(prevState => {\n return {\n penMode: force !== null && force !== void 0 ? force : !prevState.penMode,\n penDetected: true\n };\n });\n };\n\n this.onHandToolToggle = () => {\n //zsviczian added timeout because button won't select otherwise\n setTimeout(() => this.actionManager.executeAction(_actions_actionCanvas__WEBPACK_IMPORTED_MODULE_55__.actionToggleHandTool));\n };\n /**\r\n * Zooms on canvas viewport center\r\n */\n\n\n this.zoomCanvas = (\n /** decimal fraction between 0.1 (10% zoom) and 30 (3000% zoom) */\n value) => {\n this.setState(Object.assign({}, (0,_scene_zoom__WEBPACK_IMPORTED_MODULE_31__.getStateForZoom)({\n viewportX: this.state.width / 2 + this.state.offsetLeft,\n viewportY: this.state.height / 2 + this.state.offsetTop,\n nextZoom: (0,_scene__WEBPACK_IMPORTED_MODULE_29__.getNormalizedZoom)(value)\n }, this.state)));\n };\n\n this.cancelInProgressAnimation = null;\n\n this.scrollToContent = (target = this.scene.getNonDeletedElements(), opts) => {\n var _a, _b;\n\n (_a = this.cancelInProgressAnimation) === null || _a === void 0 ? void 0 : _a.call(this); // convert provided target into ExcalidrawElement[] if necessary\n\n const targetElements = Array.isArray(target) ? target : [target];\n let zoom = this.state.zoom;\n let scrollX = this.state.scrollX;\n let scrollY = this.state.scrollY;\n\n if ((opts === null || opts === void 0 ? void 0 : opts.fitToContent) || (opts === null || opts === void 0 ? void 0 : opts.fitToViewport)) {\n const {\n appState\n } = (0,_actions_actionCanvas__WEBPACK_IMPORTED_MODULE_55__.zoomToFit)({\n targetElements,\n appState: this.state,\n fitToViewport: !!(opts === null || opts === void 0 ? void 0 : opts.fitToViewport),\n viewportZoomFactor: opts === null || opts === void 0 ? void 0 : opts.viewportZoomFactor\n });\n zoom = appState.zoom;\n scrollX = appState.scrollX;\n scrollY = appState.scrollY;\n } else {\n // compute only the viewport location, without any zoom adjustment\n const scroll = (0,_scene__WEBPACK_IMPORTED_MODULE_29__.calculateScrollCenter)(targetElements, this.state);\n scrollX = scroll.scrollX;\n scrollY = scroll.scrollY;\n } // when animating, we use RequestAnimationFrame to prevent the animation\n // from slowing down other processes\n\n\n if (opts === null || opts === void 0 ? void 0 : opts.animate) {\n const origScrollX = this.state.scrollX;\n const origScrollY = this.state.scrollY;\n const origZoom = this.state.zoom.value;\n const cancel = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.easeToValuesRAF)({\n fromValues: {\n scrollX: origScrollX,\n scrollY: origScrollY,\n zoom: origZoom\n },\n toValues: {\n scrollX,\n scrollY,\n zoom: zoom.value\n },\n interpolateValue: (from, to, progress, key) => {\n // for zoom, use different easing\n if (key === \"zoom\") {\n return from * Math.pow(to / from, (0,_utils__WEBPACK_IMPORTED_MODULE_35__.easeOut)(progress));\n } // handle using default\n\n\n return undefined;\n },\n onStep: ({\n scrollX,\n scrollY,\n zoom\n }) => {\n this.setState({\n scrollX,\n scrollY,\n zoom: {\n value: zoom\n }\n });\n },\n onStart: () => {\n this.setState({\n shouldCacheIgnoreZoom: true\n });\n },\n onEnd: () => {\n this.setState({\n shouldCacheIgnoreZoom: false\n });\n },\n onCancel: () => {\n this.setState({\n shouldCacheIgnoreZoom: false\n });\n },\n duration: (_b = opts === null || opts === void 0 ? void 0 : opts.duration) !== null && _b !== void 0 ? _b : 500\n });\n\n this.cancelInProgressAnimation = () => {\n cancel();\n this.cancelInProgressAnimation = null;\n };\n } else {\n this.setState({\n scrollX,\n scrollY,\n zoom\n });\n }\n };\n\n this.maybeUnfollowRemoteUser = () => {\n if (this.state.userToFollow) {\n this.setState({\n userToFollow: null\n });\n }\n };\n /** use when changing scrollX/scrollY/zoom based on user interaction */\n\n\n this.translateCanvas = state => {\n var _a;\n\n (_a = this.cancelInProgressAnimation) === null || _a === void 0 ? void 0 : _a.call(this);\n this.maybeUnfollowRemoteUser();\n this.setState(state);\n }; //zsviczian\n\n\n this.zoomToFit = (target = this.scene.getNonDeletedElements(), maxZoom = 1, //null will zoom to max based on viewport\n margin = 0.03) => {\n if (!target) {\n target = this.scene.getNonDeletedElements();\n }\n\n if (target.length === 0) {\n maxZoom = 1;\n }\n\n this.setState((0,_actions_actionCanvas__WEBPACK_IMPORTED_MODULE_55__.zoomToFitElements)(target, this.state, false, this, maxZoom, margin).appState);\n }; //zsviczian\n\n\n this.startLineEditor = (el, selectedPointsIndices = null) => {\n if (!el || !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(el)) {\n return;\n }\n\n const editingLinearElement = new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(el);\n this.setState({\n selectedLinearElement: editingLinearElement,\n editingLinearElement: Object.assign(Object.assign({}, editingLinearElement), {\n selectedPointsIndices\n })\n });\n }; //zsviczian\n\n\n this.updateContainerSize = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(containers => {\n containers.forEach(el => {\n const [x, y] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.rotate)(el.x + el.width, el.y + el.height, el.x + el.width / 2, el.y + el.height / 2, el.angle);\n (0,_element_resizeElements__WEBPACK_IMPORTED_MODULE_93__.resizeSingleElement)(new Map().set(el.id, el), false, el, this.scene.getElementsMapIncludingDeleted(), \"se\", true, x, y);\n });\n });\n\n this.setToast = toast => {\n this.setState({\n toast\n });\n };\n\n this.restoreFileFromShare = async () => {\n try {\n const webShareTargetCache = await caches.open(\"web-share-target\");\n const response = await webShareTargetCache.match(\"shared-file\");\n\n if (response) {\n const blob = await response.blob();\n const file = new File([blob], blob.name || \"\", {\n type: blob.type\n });\n this.loadFileToCanvas(file, null);\n await webShareTargetCache.delete(\"shared-file\");\n window.history.replaceState(null, _constants__WEBPACK_IMPORTED_MODULE_12__.APP_NAME, window.location.pathname);\n }\n } catch (error) {\n this.setState({\n errorMessage: error.message\n });\n }\n };\n /** adds supplied files to existing files in the appState */\n\n\n this.addFiles = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(files => {\n const filesMap = files.reduce((acc, fileData) => {\n acc.set(fileData.id, fileData);\n return acc;\n }, new Map());\n this.files = Object.assign(Object.assign({}, this.files), Object.fromEntries(filesMap));\n this.scene.getNonDeletedElements().forEach(element => {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isInitializedImageElement)(element) && filesMap.has(element.fileId)) {\n this.imageCache.delete(element.fileId);\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_67__.ShapeCache[\"delete\"](element);\n }\n });\n this.scene.triggerUpdate();\n this.addNewImagesToImageCache();\n }); //zsviczian https://github.com/zsviczian/excalibrain/issues/9\n\n this.setMobileModeAllowed = allow => {\n const {\n width: editorWidth,\n height: editorHeight\n } = this.excalidrawContainerRef.current.getBoundingClientRect();\n this.allowMobileMode = allow;\n const prevEditorState = this.device.editor;\n let nextEditorState;\n\n if (allow) {\n nextEditorState = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateObject)(prevEditorState, {\n isMobile: this.isMobileBreakpoint(editorWidth, editorHeight)\n });\n } else {\n nextEditorState = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateObject)(prevEditorState, {\n isMobile: false //must test this\n\n });\n }\n\n if (prevEditorState !== nextEditorState) {\n this.device = Object.assign(Object.assign({}, this.device), {\n editor: nextEditorState\n });\n this.forceUpdate();\n }\n }; //zsviczian\n\n\n this.setLocalFont = showOnPanel => {\n showFourthFont = showOnPanel;\n }; //zsviczian\n\n\n this.selectElements = elements => {\n this.updateScene({\n appState: Object.assign(Object.assign({}, this.state), {\n editingGroupId: null,\n selectedElementIds: elements.reduce((map, element) => {\n map[element.id] = true;\n return map;\n }, {})\n }),\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.NONE,\n forceFlushSync: true\n });\n };\n\n this.bringToFront = elements => {\n this.selectElements(elements);\n this.updateScene(_actions__WEBPACK_IMPORTED_MODULE_5__.actionBringToFront.perform(this.scene.getNonDeletedElements(), this.state));\n };\n\n this.bringForward = elements => {\n this.selectElements(elements);\n this.updateScene(_actions__WEBPACK_IMPORTED_MODULE_5__.actionBringForward.perform(this.scene.getNonDeletedElements(), this.state));\n };\n\n this.sendToBack = elements => {\n this.selectElements(elements);\n this.updateScene(_actions__WEBPACK_IMPORTED_MODULE_5__.actionSendToBack.perform(this.scene.getNonDeletedElements(), this.state));\n };\n\n this.sendBackward = elements => {\n this.selectElements(elements);\n this.updateScene(_actions__WEBPACK_IMPORTED_MODULE_5__.actionSendBackward.perform(this.scene.getNonDeletedElements(), this.state));\n };\n\n this.updateScene = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(sceneData => {\n var _a;\n\n const nextElements = (0,_fractionalIndex__WEBPACK_IMPORTED_MODULE_90__.syncInvalidIndices)((_a = sceneData.elements) !== null && _a !== void 0 ? _a : []);\n\n if (sceneData.storeAction && sceneData.storeAction !== _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.NONE) {\n const prevCommittedAppState = this.store.snapshot.appState;\n const prevCommittedElements = this.store.snapshot.elements;\n const nextCommittedAppState = sceneData.appState ? Object.assign({}, prevCommittedAppState, sceneData.appState) // new instance, with partial appstate applied to previously captured one, including hidden prop inside `prevCommittedAppState`\n : prevCommittedAppState;\n const nextCommittedElements = sceneData.elements ? this.store.filterUncomittedElements(this.scene.getElementsMapIncludingDeleted(), // Only used to detect uncomitted local elements\n (0,_utils__WEBPACK_IMPORTED_MODULE_35__.arrayToMap)(nextElements)) : prevCommittedElements; // WARN: store action always performs deep clone of changed elements, for ephemeral remote updates (i.e. remote dragging, resizing, drawing) we might consider doing something smarter\n // do NOT schedule store actions (execute after re-render), as it might cause unexpected concurrency issues if not handled well\n\n if (sceneData.storeAction === _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.CAPTURE) {\n this.store.captureIncrement(nextCommittedElements, nextCommittedAppState);\n } else if (sceneData.storeAction === _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.UPDATE) {\n this.store.updateSnapshot(nextCommittedElements, nextCommittedAppState);\n }\n } //zsviczian forceFlushSync is set to true in ExcalidrawView.updateScene.\n //without this e.g. text search did not select the elements\n\n\n if (sceneData.forceFlushSync === true) {\n (0,react_dom__WEBPACK_IMPORTED_MODULE_2__.flushSync)(() => {\n if (sceneData.appState) {\n this.setState(sceneData.appState);\n }\n });\n } else {\n if (sceneData.appState) {\n this.setState(sceneData.appState);\n }\n }\n\n if (sceneData.elements) {\n this.scene.replaceAllElements(nextElements);\n }\n\n if (sceneData.collaborators) {\n this.setState({\n collaborators: sceneData.collaborators\n });\n }\n });\n\n this.triggerRender = (\n /** force always re-renders canvas even if no change */\n force) => {\n if (force === true) {\n this.scene.triggerUpdate();\n } else {\n this.setState({});\n }\n };\n /**\r\n * @returns whether the menu was toggled on or off\r\n */\n\n\n this.toggleSidebar = ({\n name,\n tab,\n force\n }) => {\n var _a, _b;\n\n let nextName;\n\n if (force === undefined) {\n nextName = ((_a = this.state.openSidebar) === null || _a === void 0 ? void 0 : _a.name) === name && ((_b = this.state.openSidebar) === null || _b === void 0 ? void 0 : _b.tab) === tab ? null : name;\n } else {\n nextName = force ? name : null;\n }\n\n const nextState = nextName ? {\n name: nextName\n } : null;\n\n if (nextState && tab) {\n nextState.tab = tab;\n }\n\n this.setState({\n openSidebar: nextState\n });\n return !!nextName;\n };\n\n this.updateCurrentCursorPosition = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n this.lastViewportPosition.x = event.clientX;\n this.lastViewportPosition.y = event.clientY;\n }); // Input handling\n\n this.onKeyDown = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n if (this.state.activeTool.type === \"selection\" && this.state.resizingElement && (event.shiftKey || event.altKey)) {\n event.stopPropagation(); //zsviczian shift fires repeatedly causing slowdown when resizing sticky notes\n\n return;\n } // normalize `event.key` when CapsLock is pressed #2372\n\n\n if (\"Proxy\" in window && (!event.shiftKey && /^[A-Z]$/.test(event.key) || event.shiftKey && /^[a-z]$/.test(event.key))) {\n event = new Proxy(event, {\n get(ev, prop) {\n const value = ev[prop];\n\n if (typeof value === \"function\") {\n // fix for Proxies hijacking `this`\n return value.bind(ev);\n }\n\n return prop === \"key\" ? // CapsLock inverts capitalization based on ShiftKey, so invert\n // it back\n event.shiftKey ? ev.key.toUpperCase() : ev.key.toLowerCase() : value;\n }\n\n });\n }\n\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.P && !event.shiftKey && !event.altKey) {\n this.setToast({\n message: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"commandPalette.shortcutHint\", {\n shortcut: (0,_actions_shortcuts__WEBPACK_IMPORTED_MODULE_92__.getShortcutFromShortcutName)(\"commandPalette\")\n })\n });\n event.preventDefault();\n return;\n }\n\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && event.key.toLowerCase() === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.V) {\n IS_PLAIN_PASTE = event.shiftKey;\n clearTimeout(IS_PLAIN_PASTE_TIMER); // reset (100ms to be safe that we it runs after the ensuing\n // paste event). Though, technically unnecessary to reset since we\n // (re)set the flag before each paste event.\n\n IS_PLAIN_PASTE_TIMER = window.setTimeout(() => {\n IS_PLAIN_PASTE = false;\n }, 100);\n } // prevent browser zoom in input fields\n\n\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && (0,_utils__WEBPACK_IMPORTED_MODULE_35__.isWritableElement)(event.target)) {\n if (event.code === _keys__WEBPACK_IMPORTED_MODULE_26__.CODES.MINUS || event.code === _keys__WEBPACK_IMPORTED_MODULE_26__.CODES.EQUAL) {\n event.preventDefault();\n return;\n }\n } // bail if\n\n\n if ( // inside an input\n (0,_utils__WEBPACK_IMPORTED_MODULE_35__.isWritableElement)(event.target) && // unless pressing escape (finalize action)\n event.key !== _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ESCAPE || // or unless using arrows (to move between buttons)\n (0,_keys__WEBPACK_IMPORTED_MODULE_26__.isArrowKey)(event.key) && (0,_utils__WEBPACK_IMPORTED_MODULE_35__.isInputLike)(event.target)) {\n return;\n }\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.QUESTION_MARK) {\n this.setState({\n openDialog: {\n name: \"help\"\n }\n });\n return;\n } else if (event.key.toLowerCase() === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.E && event.shiftKey && event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) {\n event.preventDefault();\n this.setState({\n openDialog: {\n name: \"imageExport\"\n }\n });\n return;\n }\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.PAGE_UP || event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.PAGE_DOWN) {\n let offset = (event.shiftKey ? this.state.width : this.state.height) / this.state.zoom.value;\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.PAGE_DOWN) {\n offset = -offset;\n }\n\n if (event.shiftKey) {\n this.translateCanvas(state => ({\n scrollX: state.scrollX + offset\n }));\n } else {\n this.translateCanvas(state => ({\n scrollY: state.scrollY + offset\n }));\n }\n }\n\n if (this.actionManager.handleKeyDown(event)) {\n return;\n }\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.K && !event.altKey && !event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) {\n if ((0,_appState__WEBPACK_IMPORTED_MODULE_10__.isLaserPointerActive)(this.state)) {\n this.setActiveTool({\n type: \"selection\"\n });\n } else {\n this.setActiveTool({\n type: \"laser\"\n });\n }\n\n return;\n }\n\n if (this.state.viewModeEnabled) {\n //revert to hand in case a key is pressed (K is handled above)\n if (event.key !== _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.K) {\n this.setActiveTool({\n type: \"selection\"\n });\n }\n\n return;\n }\n\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && this.state.isBindingEnabled) {\n this.setState({\n isBindingEnabled: false\n });\n }\n\n if ((0,_keys__WEBPACK_IMPORTED_MODULE_26__.isArrowKey)(event.key)) {\n const step = this.state.gridSize && (event.shiftKey ? _constants__WEBPACK_IMPORTED_MODULE_12__.ELEMENT_TRANSLATE_AMOUNT : this.state.gridSize) || (event.shiftKey ? _constants__WEBPACK_IMPORTED_MODULE_12__.ELEMENT_SHIFT_TRANSLATE_AMOUNT : _constants__WEBPACK_IMPORTED_MODULE_12__.ELEMENT_TRANSLATE_AMOUNT);\n let offsetX = 0;\n let offsetY = 0;\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ARROW_LEFT) {\n offsetX = -step;\n } else if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ARROW_RIGHT) {\n offsetX = step;\n } else if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ARROW_UP) {\n offsetY = -step;\n } else if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ARROW_DOWN) {\n offsetY = step;\n }\n\n const selectedElements = this.scene.getSelectedElements({\n selectedElementIds: this.state.selectedElementIds,\n includeBoundTextElement: true,\n includeElementsInFrames: true\n });\n selectedElements.forEach(element => {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(element, {\n x: element.x + offsetX,\n y: element.y + offsetY\n });\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.updateBoundElements)(element, this.scene.getNonDeletedElementsMap(), {\n simultaneouslyUpdated: selectedElements\n });\n });\n this.setState({\n suggestedBindings: (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.getSuggestedBindingsForArrows)(selectedElements, this)\n });\n event.preventDefault();\n } else if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ENTER) {\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (selectedElements.length === 1) {\n const selectedElement = selectedElements[0];\n\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(selectedElement)) {\n if (!this.state.editingLinearElement || this.state.editingLinearElement.elementId !== selectedElements[0].id) {\n this.store.shouldCaptureIncrement();\n this.setState({\n editingLinearElement: new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(selectedElement)\n });\n }\n }\n } else if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(selectedElement) || (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.isValidTextContainer)(selectedElement)) {\n let container;\n\n if (!(0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(selectedElement)) {\n container = selectedElement;\n }\n\n const midPoint = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getContainerCenter)(selectedElement, this.state, this.scene.getNonDeletedElementsMap());\n const sceneX = midPoint.x;\n const sceneY = midPoint.y;\n this.startTextEditing({\n sceneX,\n sceneY,\n container\n });\n event.preventDefault();\n return;\n } else if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(selectedElement)) {\n this.setState({\n editingFrame: selectedElement.id\n });\n } else if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(selectedElement)) {\n //zsviczian\n this.setState({\n activeEmbeddable: {\n element: selectedElement,\n state: \"active\"\n }\n });\n }\n }\n } else if (!event.ctrlKey && !event.altKey && !event.metaKey && this.state.draggingElement === null) {\n const shape = (0,_shapes__WEBPACK_IMPORTED_MODULE_32__.findShapeByKey)(event.key);\n\n if (shape) {\n if (this.state.activeTool.type !== shape) {\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"toolbar\", shape, `keyboard (${this.device.editor.isMobile ? \"mobile\" : \"desktop\"})`);\n }\n\n this.setActiveTool({\n type: shape\n });\n event.stopPropagation();\n } else if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.Q) {\n this.toggleLock(\"keyboard\");\n event.stopPropagation();\n }\n }\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.SPACE && gesture.pointers.size === 0) {\n isHoldingSpace = true;\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.GRAB);\n event.preventDefault();\n }\n\n if ((event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.G || event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.S) && !event.altKey && !event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) {\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (this.state.activeTool.type === \"selection\" && !selectedElements.length) {\n return;\n }\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.G && ((0,_scene__WEBPACK_IMPORTED_MODULE_29__.hasBackground)(this.state.activeTool.type) || selectedElements.some(element => (0,_scene__WEBPACK_IMPORTED_MODULE_29__.hasBackground)(element.type)))) {\n this.setState({\n openPopup: \"elementBackground\"\n });\n event.stopPropagation();\n }\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.S) {\n this.setState({\n openPopup: \"elementStroke\"\n });\n event.stopPropagation();\n }\n }\n\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.BACKSPACE || event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.DELETE)) {\n _jotai__WEBPACK_IMPORTED_MODULE_56__.jotaiStore.set(_ActiveConfirmDialog__WEBPACK_IMPORTED_MODULE_57__.activeConfirmDialogAtom, \"clearCanvas\");\n } // eye dropper\n // -----------------------------------------------------------------------\n\n\n const lowerCased = event.key.toLocaleLowerCase();\n const isPickingStroke = lowerCased === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.S && event.shiftKey;\n const isPickingBackground = event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.I || lowerCased === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.G && event.shiftKey;\n\n if (isPickingStroke || isPickingBackground) {\n this.openEyeDropper({\n type: isPickingStroke ? \"stroke\" : \"background\"\n });\n } // -----------------------------------------------------------------------\n\n });\n this.onWheel = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n // prevent browser pinch zoom on DOM elements\n if (!(event.target instanceof HTMLCanvasElement) && event.ctrlKey) {\n event.preventDefault();\n }\n });\n this.onKeyUp = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n var _a, _b;\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.SPACE) {\n if (this.state.viewModeEnabled) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.GRAB);\n } else if (this.state.activeTool.type === \"selection\") {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n } else {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n selectedGroupIds: {},\n editingGroupId: null,\n activeEmbeddable: null\n });\n }\n\n isHoldingSpace = false;\n }\n\n if (!event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && !this.state.isBindingEnabled) {\n this.setState({\n isBindingEnabled: true\n });\n }\n\n if ((0,_keys__WEBPACK_IMPORTED_MODULE_26__.isArrowKey)(event.key)) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.bindOrUnbindLinearElements)(this.scene.getSelectedElements(this.state).filter(_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement), this, (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.isBindingEnabled)(this.state), (_b = (_a = this.state.selectedLinearElement) === null || _a === void 0 ? void 0 : _a.selectedPointsIndices) !== null && _b !== void 0 ? _b : []);\n this.setState({\n suggestedBindings: []\n });\n }\n }); // We purposely widen the `tool` type so this helper can be called with\n // any tool without having to type check it\n\n this.isToolSupported = tool => {\n var _a;\n\n return ((_a = this.props.UIOptions.tools) === null || _a === void 0 ? void 0 : _a[tool]) !== false;\n };\n\n this.setActiveTool = tool => {\n var _a;\n\n if (!this.isToolSupported(tool.type)) {\n console.warn(`\"${tool.type}\" tool is disabled via \"UIOptions.canvasActions.tools.${tool.type}\"`);\n return;\n }\n\n const nextActiveTool = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, tool);\n\n if (nextActiveTool.type === \"hand\") {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.GRAB);\n } else if (!isHoldingSpace) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n }\n\n if ((0,_utils__WEBPACK_IMPORTED_MODULE_35__.isToolIcon)(document.activeElement)) {\n this.focusContainer();\n }\n\n if (!(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElementType)(nextActiveTool.type)) {\n this.setState({\n suggestedBindings: []\n });\n }\n\n if (nextActiveTool.type === \"image\") {\n this.onImageAction({\n insertOnCanvasDirectly: (_a = tool.type === \"image\" && tool.insertOnCanvasDirectly) !== null && _a !== void 0 ? _a : false\n });\n }\n\n setTimeout(() => {\n this.setState(prevState => {\n const commonResets = {\n snapLines: prevState.snapLines.length ? [] : prevState.snapLines,\n originSnapOffset: null,\n activeEmbeddable: null\n };\n\n if (nextActiveTool.type === \"freedraw\") {\n this.store.shouldCaptureIncrement();\n }\n\n if (nextActiveTool.type !== \"selection\") {\n return Object.assign(Object.assign(Object.assign({}, prevState), {\n activeTool: nextActiveTool,\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(nextActiveTool.type === \"mermaid\" //zsviczian\n ? this.state.selectedElementIds : {}, prevState),\n selectedGroupIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, prevState),\n editingGroupId: null,\n multiElement: null\n }), commonResets);\n }\n\n return Object.assign(Object.assign(Object.assign({}, prevState), {\n activeTool: nextActiveTool\n }), commonResets);\n }); //zsviczian added timeout because button won't select otherwise\n });\n };\n\n this.setOpenDialog = dialogType => {\n this.setState({\n openDialog: dialogType\n });\n };\n\n this.setCursor = cursor => {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, cursor);\n };\n\n this.resetCursor = () => {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n };\n /**\r\n * returns whether user is making a gesture with >= 2 fingers (points)\r\n * on o touch screen (not on a trackpad). Currently only relates to Darwin\r\n * (iOS/iPadOS,MacOS), but may work on other devices in the future if\r\n * GestureEvent is standardized.\r\n */\n\n\n this.isTouchScreenMultiTouchGesture = () => {\n // we don't want to deselect when using trackpad, and multi-point gestures\n // only work on touch screens, so checking for >= pointers means we're on a\n // touchscreen\n return gesture.pointers.size >= 2;\n };\n\n this.getName = () => {\n return this.state.name || this.props.name || `${(0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"labels.untitled\")}-${(0,_utils__WEBPACK_IMPORTED_MODULE_35__.getDateTime)()}`;\n }; // fires only on Safari\n\n\n this.onGestureStart = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n event.preventDefault(); // we only want to deselect on touch screens because user may have selected\n // elements by mistake while zooming\n\n if (this.isTouchScreenMultiTouchGesture()) {\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n activeEmbeddable: null\n });\n }\n\n gesture.initialScale = this.state.zoom.value;\n }); // fires only on Safari\n\n this.onGestureChange = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n event.preventDefault(); // onGestureChange only has zoom factor but not the center.\n // If we're on iPad or iPhone, then we recognize multi-touch and will\n // zoom in at the right location in the touchmove handler\n // (handleCanvasPointerMove).\n //\n // On Macbook trackpad, we don't have those events so will zoom in at the\n // current location instead.\n //\n // As such, bail from this handler on touch devices.\n\n if (this.isTouchScreenMultiTouchGesture()) {\n return;\n }\n\n const initialScale = gesture.initialScale;\n\n if (initialScale) {\n this.setState(state => Object.assign({}, (0,_scene_zoom__WEBPACK_IMPORTED_MODULE_31__.getStateForZoom)({\n viewportX: this.lastViewportPosition.x,\n viewportY: this.lastViewportPosition.y,\n nextZoom: (0,_scene__WEBPACK_IMPORTED_MODULE_29__.getNormalizedZoom)(initialScale * event.scale)\n }, state)));\n }\n }); // fires only on Safari\n\n this.onGestureEnd = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n event.preventDefault(); // reselect elements only on touch screens (see onGestureStart)\n\n if (this.isTouchScreenMultiTouchGesture()) {\n this.setState({\n previousSelectedElementIds: {},\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(this.state.previousSelectedElementIds, this.state)\n });\n }\n\n gesture.initialScale = null;\n });\n\n this.startTextEditing = ({\n sceneX,\n sceneY,\n insertAtParentCenter = true,\n container,\n autoEdit = true\n }) => {\n var _a, _b;\n\n let shouldBindToContainer = false;\n let parentCenterPosition = insertAtParentCenter && this.getTextWysiwygSnappedToCenterPosition(sceneX, sceneY, this.state, container);\n\n if (container && parentCenterPosition) {\n const boundTextElementToContainer = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getBoundTextElement)(container, this.scene.getNonDeletedElementsMap());\n\n if (!boundTextElementToContainer) {\n shouldBindToContainer = true;\n }\n }\n\n let existingTextElement = null;\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (selectedElements.length === 1) {\n if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(selectedElements[0])) {\n existingTextElement = selectedElements[0];\n } else if (container) {\n existingTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getBoundTextElement)(selectedElements[0], this.scene.getNonDeletedElementsMap());\n } else {\n existingTextElement = this.getTextElementAtPosition(sceneX, sceneY);\n }\n } else {\n existingTextElement = this.getTextElementAtPosition(sceneX, sceneY);\n }\n\n const fontFamily = (existingTextElement === null || existingTextElement === void 0 ? void 0 : existingTextElement.fontFamily) || this.state.currentItemFontFamily;\n const lineHeight = (existingTextElement === null || existingTextElement === void 0 ? void 0 : existingTextElement.lineHeight) || (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getDefaultLineHeight)(fontFamily);\n const fontSize = (0,_actions_actionProperties__WEBPACK_IMPORTED_MODULE_79__.getFontSize)(this.state.currentItemFontSize, this.state.zoom.value); //zsviczian\n\n if (!existingTextElement && shouldBindToContainer && container && !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isArrowElement)(container)) {\n const fontString = {\n fontSize,\n fontFamily\n };\n const minWidth = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getApproxMinLineWidth)((0,_utils__WEBPACK_IMPORTED_MODULE_35__.getFontString)(fontString), lineHeight);\n const minHeight = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getApproxMinLineHeight)(fontSize, lineHeight);\n const newHeight = Math.max(container.height, minHeight);\n const newWidth = Math.max(container.width, minWidth);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(container, {\n height: newHeight,\n width: newWidth\n });\n sceneX = container.x + newWidth / 2;\n sceneY = container.y + newHeight / 2;\n\n if (parentCenterPosition) {\n parentCenterPosition = this.getTextWysiwygSnappedToCenterPosition(sceneX, sceneY, this.state, container);\n }\n }\n\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords({\n x: sceneX,\n y: sceneY\n });\n /*const shouldWrapText = !shouldBindToContainer && //zsviczian\r\n this.lastPointerDownEvent?.pointerType === \"pen\";\r\n const [x1, , x2] = getVisibleSceneBounds(this.state); //zsviczian\r\n const maxTextWidth = Math.max(Math.min((x2 - x1) * 0.85, 800), 200); //zsviczian*/\n\n const element = existingTextElement ? existingTextElement : (0,_element__WEBPACK_IMPORTED_MODULE_16__.newTextElement)({\n x: parentCenterPosition ? parentCenterPosition.elementCenterX : sceneX,\n y: parentCenterPosition ? parentCenterPosition.elementCenterY : sceneY,\n strokeColor: this.state.currentItemStrokeColor,\n backgroundColor: this.state.currentItemBackgroundColor,\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roughness: this.state.currentItemRoughness,\n opacity: this.state.currentItemOpacity,\n text: \"\",\n rawText: \"\",\n fontSize,\n fontFamily,\n textAlign: parentCenterPosition ? \"center\" : this.state.currentItemTextAlign,\n verticalAlign: parentCenterPosition ? _constants__WEBPACK_IMPORTED_MODULE_12__.VERTICAL_ALIGN.MIDDLE : _constants__WEBPACK_IMPORTED_MODULE_12__.DEFAULT_VERTICAL_ALIGN,\n containerId: shouldBindToContainer ? container === null || container === void 0 ? void 0 : container.id : undefined,\n groupIds: (_a = container === null || container === void 0 ? void 0 : container.groupIds) !== null && _a !== void 0 ? _a : [],\n lineHeight,\n angle: (_b = container === null || container === void 0 ? void 0 : container.angle) !== null && _b !== void 0 ? _b : 0,\n frameId: topLayerFrame ? topLayerFrame.id : null\n /*...shouldWrapText //zsviczian\r\n ? {\r\n width: maxTextWidth,\r\n autoResize: false,\r\n }\r\n : {},*/\n\n });\n\n if (!existingTextElement && shouldBindToContainer && container) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(container, {\n boundElements: (container.boundElements || []).concat({\n type: \"text\",\n id: element.id\n })\n });\n }\n\n this.setState({\n editingElement: element\n });\n\n if (!existingTextElement) {\n if (container && shouldBindToContainer) {\n const containerIndex = this.scene.getElementIndex(container.id);\n this.scene.insertElementAtIndex(element, containerIndex + 1);\n } else {\n this.scene.insertElement(element);\n }\n }\n\n if (autoEdit || existingTextElement || container) {\n this.handleTextWysiwyg(element, {\n isExistingElement: !!existingTextElement\n });\n } else {\n this.setState({\n draggingElement: element,\n multiElement: null\n });\n }\n };\n\n this.debounceDoubleClickTimestamp = 0; //zsviczian\n\n this.handleCanvasDoubleClick = event => {\n var _a; // case: double-clicking with arrow/line tool selected would both create\n // text and enter multiElement mode\n\n\n if (this.state.multiElement) {\n return;\n }\n\n if ( //zsviczian - double click eraser\n this.state.penMode && ((_a = this.lastPointerDownEvent) === null || _a === void 0 ? void 0 : _a.pointerType) === \"touch\" && this.state.activeTool.type !== \"selection\") {\n const now = Date.now();\n\n if (now - this.debounceDoubleClickTimestamp < 200) {\n //handleCanvasDoubleClick click fires twice in case of touch.\n //Once from the onTouchStart event handler, once from the double click event handler\n return;\n }\n\n this.debounceDoubleClickTimestamp = now;\n this.updateScene(_actions_actionCanvas__WEBPACK_IMPORTED_MODULE_55__.actionToggleEraserTool.perform([], this.state));\n return;\n } // zsviczian - end\n // we should only be able to double click when mode is selection\n\n\n if (this.state.activeTool.type !== \"selection\") {\n return;\n }\n\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (selectedElements.length === 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(selectedElements[0])) {\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && (!this.state.editingLinearElement || this.state.editingLinearElement.elementId !== selectedElements[0].id)) {\n this.store.shouldCaptureIncrement();\n this.setState({\n editingLinearElement: new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(selectedElements[0])\n });\n return;\n }\n }\n\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n let {\n x: sceneX,\n y: sceneY\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(event, this.state);\n const selectedGroupIds = (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getSelectedGroupIds)(this.state);\n\n if (selectedGroupIds.length > 0) {\n const hitElement = this.getElementAtPosition(sceneX, sceneY);\n const selectedGroupId = hitElement && (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getSelectedGroupIdForElement)(hitElement, this.state.selectedGroupIds);\n\n if (selectedGroupId) {\n this.store.shouldCaptureIncrement();\n this.setState(prevState => Object.assign(Object.assign({}, prevState), (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: selectedGroupId,\n selectedElementIds: {\n [hitElement.id]: true\n }\n }, this.scene.getNonDeletedElements(), prevState, this)));\n return;\n }\n }\n\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n\n if (!event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && !this.state.viewModeEnabled) {\n const hitElement = this.getElementAtPosition(sceneX, sceneY);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeLikeElement)(hitElement)) {\n this.setState({\n activeEmbeddable: {\n element: hitElement,\n state: \"active\"\n }\n });\n return;\n }\n\n const container = this.getTextBindableContainerAtPosition(sceneX, sceneY);\n\n if (container) {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.hasBoundTextElement)(container) || !(0,_utils__WEBPACK_IMPORTED_MODULE_35__.isTransparent)(container.backgroundColor) || (0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.hitElementItself)({\n x: sceneX,\n y: sceneY,\n element: container,\n shape: this.getElementShape(container),\n threshold: this.getElementHitThreshold()\n })) {\n const midPoint = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getContainerCenter)(container, this.state, this.scene.getNonDeletedElementsMap());\n sceneX = midPoint.x;\n sceneY = midPoint.y;\n }\n }\n\n this.startTextEditing({\n sceneX,\n sceneY,\n insertAtParentCenter: !event.altKey,\n container\n });\n }\n };\n\n this.getElementLinkAtPosition = (scenePointer, hitElement) => {\n // Reversing so we traverse the elements in decreasing order\n // of z-index\n const elements = this.scene.getNonDeletedElements().slice().reverse();\n let hitElementIndex = Infinity;\n return elements.find((element, index) => {\n if (hitElement && element.id === hitElement.id) {\n hitElementIndex = index;\n }\n\n return element.link && index <= hitElementIndex && (0,_hyperlink_helpers__WEBPACK_IMPORTED_MODULE_91__.isPointHittingLink)(element, this.scene.getNonDeletedElementsMap(), this.state, [scenePointer.x, scenePointer.y], this.device.editor.isMobile);\n });\n };\n\n this.redirectToLink = (event, isTouchScreen) => {\n const draggedDistance = (0,_math__WEBPACK_IMPORTED_MODULE_28__.distance2d)(this.lastPointerDownEvent.clientX, this.lastPointerDownEvent.clientY, this.lastPointerUpEvent.clientX, this.lastPointerUpEvent.clientY);\n\n if (!this.hitLinkElement || // For touch screen allow dragging threshold else strict check\n isTouchScreen && draggedDistance > _constants__WEBPACK_IMPORTED_MODULE_12__.DRAGGING_THRESHOLD || !isTouchScreen && draggedDistance !== 0) {\n return;\n }\n\n const lastPointerDownCoords = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(this.lastPointerDownEvent, this.state);\n const elementsMap = this.scene.getNonDeletedElementsMap();\n const lastPointerDownHittingLinkIcon = (0,_hyperlink_helpers__WEBPACK_IMPORTED_MODULE_91__.isPointHittingLink)(this.hitLinkElement, elementsMap, this.state, [lastPointerDownCoords.x, lastPointerDownCoords.y], this.device.editor.isMobile);\n const lastPointerUpCoords = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(this.lastPointerUpEvent, this.state);\n const lastPointerUpHittingLinkIcon = (0,_hyperlink_helpers__WEBPACK_IMPORTED_MODULE_91__.isPointHittingLink)(this.hitLinkElement, elementsMap, this.state, [lastPointerUpCoords.x, lastPointerUpCoords.y], this.device.editor.isMobile);\n\n if (lastPointerDownHittingLinkIcon && lastPointerUpHittingLinkIcon) {\n let url = this.hitLinkElement.link;\n\n if (url) {\n url = (0,_data_url__WEBPACK_IMPORTED_MODULE_47__.normalizeLink)(url);\n let customEvent;\n\n if (this.props.onLinkOpen) {\n customEvent = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.wrapEvent)(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.EXCALIDRAW_LINK, event.nativeEvent);\n this.props.onLinkOpen(Object.assign(Object.assign({}, this.hitLinkElement), {\n link: url\n }), customEvent);\n }\n\n if (!(customEvent === null || customEvent === void 0 ? void 0 : customEvent.defaultPrevented)) {\n const target = (0,_data_url__WEBPACK_IMPORTED_MODULE_47__.isLocalLink)(url) ? \"_self\" : \"_blank\";\n const newWindow = window.open(undefined, target); // https://mathiasbynens.github.io/rel-noopener/\n\n if (newWindow) {\n newWindow.opener = null;\n newWindow.location = url;\n }\n }\n }\n }\n };\n\n this.getTopLayerFrameAtSceneCoords = sceneCoords => {\n const elementsMap = this.scene.getNonDeletedElementsMap();\n const frames = this.scene.getNonDeletedFramesLikes().filter(frame => (0,_frame__WEBPACK_IMPORTED_MODULE_51__.isCursorInFrame)(sceneCoords, frame, elementsMap));\n return frames.length ? frames[frames.length - 1] : null;\n };\n\n this.handleCanvasPointerMove = event => {\n var _a, _b;\n\n this.savePointer(event.clientX, event.clientY, this.state.cursorButton);\n this.lastPointerMoveEvent = event.nativeEvent;\n\n if (gesture.pointers.has(event.pointerId)) {\n gesture.pointers.set(event.pointerId, {\n x: event.clientX,\n y: event.clientY\n });\n }\n\n const initialScale = gesture.initialScale;\n\n if (gesture.pointers.size === 2 && gesture.lastCenter && initialScale && gesture.initialDistance) {\n const center = (0,_gesture__WEBPACK_IMPORTED_MODULE_22__.getCenter)(gesture.pointers);\n const deltaX = center.x - gesture.lastCenter.x;\n const deltaY = center.y - gesture.lastCenter.y;\n gesture.lastCenter = center;\n const distance = (0,_gesture__WEBPACK_IMPORTED_MODULE_22__.getDistance)(Array.from(gesture.pointers.values()));\n const scaleFactor = !this.state.allowPinchZoom && //zsviczian\n this.state.activeTool.type === \"freedraw\" && this.state.penMode ? 1 : distance / gesture.initialDistance;\n const nextZoom = scaleFactor ? (0,_scene__WEBPACK_IMPORTED_MODULE_29__.getNormalizedZoom)(initialScale * scaleFactor) : this.state.zoom.value;\n this.setState(state => {\n const zoomState = (0,_scene_zoom__WEBPACK_IMPORTED_MODULE_31__.getStateForZoom)({\n viewportX: center.x,\n viewportY: center.y,\n nextZoom\n }, state);\n this.translateCanvas({\n zoom: zoomState.zoom,\n // 2x multiplier is just a magic number that makes this work correctly\n // on touchscreen devices (note: if we get report that panning is slower/faster\n // than actual movement, consider swapping with devicePixelRatio)\n scrollX: zoomState.scrollX + 2 * (deltaX / nextZoom),\n scrollY: zoomState.scrollY + 2 * (deltaY / nextZoom),\n shouldCacheIgnoreZoom: true\n });\n });\n this.resetShouldCacheIgnoreZoomDebounced();\n } else {\n gesture.lastCenter = gesture.initialDistance = gesture.initialScale = null;\n }\n\n if (isHoldingSpace || isPanning || isDraggingScrollBar || (0,_appState__WEBPACK_IMPORTED_MODULE_10__.isHandToolActive)(this.state)) {\n return;\n }\n\n const isPointerOverScrollBars = (0,_scene_scrollbars__WEBPACK_IMPORTED_MODULE_89__.isOverScrollBars)(currentScrollBars, event.clientX - this.state.offsetLeft, event.clientY - this.state.offsetTop);\n const isOverScrollBar = isPointerOverScrollBars.isOverEither;\n const isPenFreedraw = this.state.activeTool.type === \"freedraw\" && event.pointerType === \"pen\"; //zsviczian\n\n if (!this.state.draggingElement && !this.state.multiElement) {\n if (isOverScrollBar) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n } else if (isPenFreedraw && this.interactiveCanvas && (0,_obsidianUtils__WEBPACK_IMPORTED_MODULE_86__.hideFreedrawPenmodeCursor)()) {\n //zsviczian https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/1659\n this.interactiveCanvas.style.cursor = \"none\";\n } else {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n }\n }\n\n const scenePointer = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(event, this.state);\n const {\n x: scenePointerX,\n y: scenePointerY\n } = scenePointer;\n\n if (!this.state.draggingElement && (0,_snapping__WEBPACK_IMPORTED_MODULE_59__.isActiveToolNonLinearSnappable)(this.state.activeTool.type)) {\n const {\n originOffset,\n snapLines\n } = (0,_snapping__WEBPACK_IMPORTED_MODULE_59__.getSnapLinesAtPointer)(this.scene.getNonDeletedElements(), this.state, {\n x: scenePointerX,\n y: scenePointerY\n }, event, this.scene.getNonDeletedElementsMap());\n this.setState(prevState => {\n const nextSnapLines = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateStable)(prevState.snapLines, snapLines);\n const nextOriginOffset = prevState.originSnapOffset ? (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateStable)(prevState.originSnapOffset, originOffset) : originOffset;\n\n if (prevState.snapLines === nextSnapLines && prevState.originSnapOffset === nextOriginOffset) {\n return null;\n }\n\n return {\n snapLines: nextSnapLines,\n originSnapOffset: nextOriginOffset\n };\n });\n } else if (!this.state.draggingElement) {\n this.setState(prevState => {\n if (prevState.snapLines.length) {\n return {\n snapLines: []\n };\n }\n\n return null;\n });\n }\n\n if (this.state.editingLinearElement && !this.state.editingLinearElement.isDragging) {\n const editingLinearElement = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.handlePointerMove(event, scenePointerX, scenePointerY, this.state, this.scene.getNonDeletedElementsMap());\n\n if (editingLinearElement && editingLinearElement !== this.state.editingLinearElement) {\n // Since we are reading from previous state which is not possible with\n // automatic batching in React 18 hence using flush sync to synchronously\n // update the state. Check https://github.com/excalidraw/excalidraw/pull/5508 for more details.\n (0,react_dom__WEBPACK_IMPORTED_MODULE_2__.flushSync)(() => {\n this.setState({\n editingLinearElement\n });\n });\n }\n\n if ((editingLinearElement === null || editingLinearElement === void 0 ? void 0 : editingLinearElement.lastUncommittedPoint) != null) {\n this.maybeSuggestBindingAtCursor(scenePointer);\n } else {\n // causes stack overflow if not sync\n (0,react_dom__WEBPACK_IMPORTED_MODULE_2__.flushSync)(() => {\n this.setState({\n suggestedBindings: []\n });\n });\n }\n }\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBindingElementType)(this.state.activeTool.type)) {\n // Hovering with a selected tool or creating new linear element via click\n // and point\n const {\n draggingElement\n } = this.state;\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBindingElement)(draggingElement, false)) {\n this.maybeSuggestBindingsForLinearElementAtCoords(draggingElement, [scenePointer], this.state.startBoundElement);\n } else {\n this.maybeSuggestBindingAtCursor(scenePointer);\n }\n }\n\n if (this.state.multiElement) {\n const {\n multiElement\n } = this.state;\n const {\n x: rx,\n y: ry\n } = multiElement;\n const {\n points,\n lastCommittedPoint\n } = multiElement;\n const lastPoint = points[points.length - 1];\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n\n if (lastPoint === lastCommittedPoint) {\n // if we haven't yet created a temp point and we're beyond commit-zone\n // threshold, add a point\n if ((0,_math__WEBPACK_IMPORTED_MODULE_28__.distance2d)(scenePointerX - rx, scenePointerY - ry, lastPoint[0], lastPoint[1]) >= _constants__WEBPACK_IMPORTED_MODULE_12__.LINE_CONFIRM_THRESHOLD) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(multiElement, {\n points: [...points, [scenePointerX - rx, scenePointerY - ry]]\n });\n } else {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.POINTER); // in this branch, we're inside the commit zone, and no uncommitted\n // point exists. Thus do nothing (don't add/remove points).\n }\n } else if (points.length > 2 && lastCommittedPoint && (0,_math__WEBPACK_IMPORTED_MODULE_28__.distance2d)(scenePointerX - rx, scenePointerY - ry, lastCommittedPoint[0], lastCommittedPoint[1]) < _constants__WEBPACK_IMPORTED_MODULE_12__.LINE_CONFIRM_THRESHOLD) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.POINTER);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(multiElement, {\n points: points.slice(0, -1)\n });\n } else {\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(scenePointerX, scenePointerY, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize);\n const [lastCommittedX, lastCommittedY] = (_a = multiElement === null || multiElement === void 0 ? void 0 : multiElement.lastCommittedPoint) !== null && _a !== void 0 ? _a : [0, 0];\n let dxFromLastCommitted = gridX - rx - lastCommittedX;\n let dyFromLastCommitted = gridY - ry - lastCommittedY;\n\n if ((0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldRotateWithDiscreteAngle)(event)) {\n ({\n width: dxFromLastCommitted,\n height: dyFromLastCommitted\n } = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getLockedLinearCursorAlignSize)( // actual coordinate of the last committed point\n lastCommittedX + rx, lastCommittedY + ry, // cursor-grid coordinate\n gridX, gridY));\n }\n\n if ((0,_math__WEBPACK_IMPORTED_MODULE_28__.isPathALoop)(points, this.state.zoom.value)) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.POINTER);\n } // update last uncommitted point\n\n\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(multiElement, {\n points: [...points.slice(0, -1), [lastCommittedX + dxFromLastCommitted, lastCommittedY + dyFromLastCommitted]]\n });\n }\n\n return;\n }\n\n const hasDeselectedButton = Boolean(event.buttons);\n\n if (hasDeselectedButton || this.state.activeTool.type !== \"selection\" && this.state.activeTool.type !== \"text\" && this.state.activeTool.type !== \"eraser\") {\n return;\n }\n\n const elements = this.scene.getNonDeletedElements();\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (selectedElements.length === 1 && !isOverScrollBar && !this.state.editingLinearElement) {\n // for linear elements, we'd like to prioritize point dragging over edge resizing\n // therefore, we update and check hovered point index first\n if (this.state.selectedLinearElement) {\n this.handleHoverSelectedLinearElement(this.state.selectedLinearElement, scenePointerX, scenePointerY);\n }\n\n if (!this.state.selectedLinearElement || this.state.selectedLinearElement.hoverPointIndex === -1) {\n const elementWithTransformHandleType = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getElementWithTransformHandleType)(elements, this.state, scenePointerX, scenePointerY, this.state.zoom, event.pointerType, this.scene.getNonDeletedElementsMap(), this.device);\n\n if (elementWithTransformHandleType && elementWithTransformHandleType.transformHandleType) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, (0,_element__WEBPACK_IMPORTED_MODULE_16__.getCursorForResizingElement)(elementWithTransformHandleType));\n return;\n }\n }\n } else if (selectedElements.length > 1 && !isOverScrollBar) {\n const transformHandleType = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getTransformHandleTypeFromCoords)((0,_element__WEBPACK_IMPORTED_MODULE_16__.getCommonBounds)(selectedElements), scenePointerX, scenePointerY, this.state.zoom, event.pointerType, this.device);\n\n if (transformHandleType) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, (0,_element__WEBPACK_IMPORTED_MODULE_16__.getCursorForResizingElement)({\n transformHandleType\n }));\n return;\n }\n }\n\n const hitElement = this.getElementAtPosition(scenePointer.x, scenePointer.y);\n this.hitLinkElement = this.getElementLinkAtPosition(scenePointer, hitElement);\n\n if ((0,_appState__WEBPACK_IMPORTED_MODULE_10__.isEraserActive)(this.state)) {\n return;\n }\n\n if (this.hitLinkElement && !this.state.selectedElementIds[this.hitLinkElement.id]) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.POINTER);\n (0,_components_hyperlink_Hyperlink__WEBPACK_IMPORTED_MODULE_46__.showHyperlinkTooltip)(this.hitLinkElement, this.state, this.scene.getNonDeletedElementsMap());\n\n if (this.props.onLinkHover) {\n this.props.onLinkHover(this.hitLinkElement, event);\n } //zsviczian\n\n } else {\n (0,_components_hyperlink_Hyperlink__WEBPACK_IMPORTED_MODULE_46__.hideHyperlinkToolip)();\n\n if (hitElement && (hitElement.link || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(hitElement)) && this.state.selectedElementIds[hitElement.id] && !this.state.contextMenu && !this.state.showHyperlinkPopup) {\n this.setState({\n showHyperlinkPopup: \"info\"\n });\n } else if (this.state.activeTool.type === \"text\") {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(hitElement) ? _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.TEXT : _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.CROSSHAIR);\n } else if (this.state.viewModeEnabled) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.GRAB);\n } else if (isOverScrollBar) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.AUTO);\n } else if (this.state.selectedLinearElement) {\n this.handleHoverSelectedLinearElement(this.state.selectedLinearElement, scenePointerX, scenePointerY);\n } else if ( // if using cmd/ctrl, we're not dragging\n !event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) {\n if ((hitElement || this.isHittingCommonBoundingBoxOfSelectedElements(scenePointer, selectedElements)) && !(hitElement === null || hitElement === void 0 ? void 0 : hitElement.locked)) {\n if (hitElement && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeLikeElement)(hitElement) && this.isIframeLikeElementCenter(hitElement, event, scenePointerX, scenePointerY)) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.POINTER);\n this.setState({\n activeEmbeddable: {\n element: hitElement,\n state: \"hover\"\n }\n });\n } else {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.MOVE);\n\n if (((_b = this.state.activeEmbeddable) === null || _b === void 0 ? void 0 : _b.state) === \"hover\") {\n this.setState({\n activeEmbeddable: null\n });\n }\n }\n }\n } else {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.AUTO);\n }\n }\n };\n\n this.handleEraser = (event, pointerDownState, scenePointer) => {\n this.eraserTrail.addPointToPath(scenePointer.x, scenePointer.y);\n let didChange = false;\n const processedGroups = new Set();\n const nonDeletedElements = this.scene.getNonDeletedElements();\n\n const processElements = elements => {\n var _a;\n\n for (const element of elements) {\n if (element.locked) {\n return;\n }\n\n if (event.altKey) {\n if (this.elementsPendingErasure.delete(element.id)) {\n didChange = true;\n }\n } else if (!this.elementsPendingErasure.has(element.id)) {\n didChange = true;\n this.elementsPendingErasure.add(element.id);\n } // (un)erase groups atomically\n\n\n if (didChange && ((_a = element.groupIds) === null || _a === void 0 ? void 0 : _a.length)) {\n const shallowestGroupId = element.groupIds.at(-1);\n\n if (!processedGroups.has(shallowestGroupId)) {\n processedGroups.add(shallowestGroupId);\n const elems = (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getElementsInGroup)(nonDeletedElements, shallowestGroupId);\n\n for (const elem of elems) {\n if (event.altKey) {\n this.elementsPendingErasure.delete(elem.id);\n } else {\n this.elementsPendingErasure.add(elem.id);\n }\n }\n }\n }\n }\n };\n\n const distance = (0,_math__WEBPACK_IMPORTED_MODULE_28__.distance2d)(pointerDownState.lastCoords.x, pointerDownState.lastCoords.y, scenePointer.x, scenePointer.y);\n const threshold = this.getElementHitThreshold();\n const point = Object.assign({}, pointerDownState.lastCoords);\n let samplingInterval = 0;\n\n while (samplingInterval <= distance) {\n const hitElements = this.getElementsAtPosition(point.x, point.y);\n processElements(hitElements); // Exit since we reached current point\n\n if (samplingInterval === distance) {\n break;\n } // Calculate next point in the line at a distance of sampling interval\n\n\n samplingInterval = Math.min(samplingInterval + threshold, distance);\n const distanceRatio = samplingInterval / distance;\n const nextX = (1 - distanceRatio) * point.x + distanceRatio * scenePointer.x;\n const nextY = (1 - distanceRatio) * point.y + distanceRatio * scenePointer.y;\n point.x = nextX;\n point.y = nextY;\n }\n\n pointerDownState.lastCoords.x = scenePointer.x;\n pointerDownState.lastCoords.y = scenePointer.y;\n\n if (didChange) {\n for (const element of this.scene.getNonDeletedElements()) {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBoundToContainer)(element) && (this.elementsPendingErasure.has(element.id) || this.elementsPendingErasure.has(element.containerId))) {\n if (event.altKey) {\n this.elementsPendingErasure.delete(element.id);\n this.elementsPendingErasure.delete(element.containerId);\n } else {\n this.elementsPendingErasure.add(element.id);\n this.elementsPendingErasure.add(element.containerId);\n }\n }\n }\n\n this.elementsPendingErasure = new Set(this.elementsPendingErasure);\n this.triggerRender();\n }\n }; // set touch moving for mobile context menu\n\n\n this.handleTouchMove = event => {\n invalidateContextMenu = true;\n };\n\n this.handleCanvasPointerDown = event => {\n var _a, _b;\n\n this.focusContainer(); //zsviczian\n\n this.maybeCleanupAfterMissingPointerUp(event.nativeEvent);\n this.maybeUnfollowRemoteUser(); // since contextMenu options are potentially evaluated on each render,\n // and an contextMenu action may depend on selection state, we must\n // close the contextMenu before we update the selection on pointerDown\n // (e.g. resetting selection)\n\n if (this.state.contextMenu) {\n this.setState({\n contextMenu: null\n });\n }\n\n if (this.state.snapLines) {\n this.setAppState({\n snapLines: []\n });\n }\n\n this.updateGestureOnPointerDown(event); // if dragging element is freedraw and another pointerdown event occurs\n // a second finger is on the screen\n // discard the freedraw element if it is very short because it is likely\n // just a spike, otherwise finalize the freedraw element when the second\n // finger is lifted\n\n if (event.pointerType === \"touch\" && this.state.draggingElement && this.state.draggingElement.type === \"freedraw\") {\n const element = this.state.draggingElement;\n this.updateScene(Object.assign(Object.assign({}, element.points.length < 10 ? {\n elements: this.scene.getElementsIncludingDeleted().filter(el => el.id !== element.id)\n } : {}), {\n appState: {\n draggingElement: null,\n editingElement: null,\n startBoundElement: null,\n suggestedBindings: [],\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(Object.keys(this.state.selectedElementIds).filter(key => key !== element.id).reduce((obj, key) => {\n obj[key] = this.state.selectedElementIds[key];\n return obj;\n }, {}), this.state)\n },\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.UPDATE\n }));\n return;\n } // remove any active selection when we start to interact with canvas\n // (mainly, we care about removing selection outside the component which\n // would prevent our copy handling otherwise)\n\n\n const selection = document.getSelection();\n\n if (selection === null || selection === void 0 ? void 0 : selection.anchorNode) {\n selection.removeAllRanges();\n }\n\n this.maybeOpenContextMenuAfterPointerDownOnTouchDevices(event); //fires only once, if pen is detected, penMode is enabled\n //the user can disable this by toggling the penMode button\n\n if (!this.state.penDetected && event.pointerType === \"pen\") {\n this.setState(prevState => {\n return {\n penMode: true,\n penDetected: true\n };\n });\n }\n\n if (!this.device.isTouchScreen && [\"pen\", \"touch\"].includes(event.pointerType)) {\n this.device = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateObject)(this.device, {\n isTouchScreen: true\n });\n }\n\n if (isPanning) {\n return;\n }\n\n this.lastPointerDownEvent = event; // we must exit before we set `cursorButton` state and `savePointer`\n // else it will send pointer state & laser pointer events in collab when\n // panning\n\n /*if (this.handleCanvasPanUsingWheelOrSpaceDrag(event)) {\r\n return;\r\n }*/\n //zsviczian this broke on pointer down in onPointerUpdate\n\n this.setState({\n lastPointerDownWith: event.pointerType,\n cursorButton: \"down\"\n });\n this.savePointer(event.clientX, event.clientY, \"down\");\n\n if (this.handleCanvasPanUsingWheelOrSpaceDrag(event)) {\n return;\n } //zsviczian moved it here, because else pointer down in onPointerUpdate did not work\n\n\n if (event.button === _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_BUTTON.ERASER && this.state.activeTool.type !== _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.eraser) {\n this.setState({\n activeTool: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, {\n type: _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.eraser,\n lastActiveToolBeforeEraser: this.state.activeTool\n })\n }, () => {\n this.handleCanvasPointerDown(event);\n\n const onPointerUp = () => {\n unsubPointerUp();\n unsubCleanup === null || unsubCleanup === void 0 ? void 0 : unsubCleanup();\n\n if ((0,_appState__WEBPACK_IMPORTED_MODULE_10__.isEraserActive)(this.state)) {\n this.setState({\n activeTool: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, Object.assign(Object.assign({}, this.state.activeTool.lastActiveTool || {\n type: _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.selection\n }), {\n lastActiveToolBeforeEraser: null\n }))\n });\n }\n };\n\n const unsubPointerUp = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(window, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, onPointerUp, {\n once: true\n });\n let unsubCleanup; // subscribe inside rAF lest it'd be triggered on the same pointerdown\n // if we start erasing while coming from blurred document since\n // we cleanup pointer events on focus\n\n requestAnimationFrame(() => {\n unsubCleanup = this.missingPointerEventCleanupEmitter.once(onPointerUp);\n });\n });\n return;\n } // only handle left mouse button or touch\n\n\n if (event.button !== _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_BUTTON.MAIN && event.button !== _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_BUTTON.TOUCH && event.button !== _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_BUTTON.ERASER) {\n return;\n } // don't select while panning\n\n\n if (gesture.pointers.size > 1) {\n return;\n } // State for the duration of a pointer interaction, which starts with a\n // pointerDown event, ends with a pointerUp event (or another pointerDown)\n\n\n const pointerDownState = this.initialPointerDownState(event);\n this.setState({\n selectedElementsAreBeingDragged: false\n });\n\n if (this.handleDraggingScrollBar(event, pointerDownState)) {\n return;\n }\n\n this.clearSelectionIfNotUsingSelection();\n this.updateBindingEnabledOnPointerMove(event);\n\n if (this.handleSelectionOnPointerDown(event, pointerDownState)) {\n return;\n }\n\n const allowOnPointerDown = !this.state.penMode || event.pointerType !== \"touch\" || this.state.activeTool.type === \"selection\" || this.state.activeTool.type === \"text\" || this.state.activeTool.type === \"image\";\n\n if (!allowOnPointerDown) {\n return;\n }\n\n if (this.state.activeTool.type === \"text\") {\n this.handleTextOnPointerDown(event, pointerDownState);\n } else if (this.state.activeTool.type === \"arrow\" || this.state.activeTool.type === \"line\") {\n this.handleLinearElementOnPointerDown(event, this.state.activeTool.type, pointerDownState);\n } else if (this.state.activeTool.type === \"image\") {\n // reset image preview on pointerdown\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.CROSSHAIR); // retrieve the latest element as the state may be stale\n\n const pendingImageElement = this.state.pendingImageElementId && this.scene.getElement(this.state.pendingImageElementId);\n\n if (!pendingImageElement) {\n return;\n }\n\n this.setState({\n draggingElement: pendingImageElement,\n editingElement: pendingImageElement,\n pendingImageElementId: null,\n multiElement: null\n });\n const {\n x,\n y\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(event, this.state);\n const frame = this.getTopLayerFrameAtSceneCoords({\n x,\n y\n });\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(pendingImageElement, {\n x,\n y,\n frameId: frame ? frame.id : null\n });\n } else if (this.state.activeTool.type === \"freedraw\") {\n this.handleFreeDrawElementOnPointerDown(event, this.state.activeTool.type, pointerDownState);\n } else if (this.state.activeTool.type === \"custom\") {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n } else if (this.state.activeTool.type === _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.frame || this.state.activeTool.type === _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.magicframe) {\n this.createFrameElementOnPointerDown(pointerDownState, this.state.activeTool.type);\n } else if (this.state.activeTool.type === \"laser\") {\n this.laserTrails.startPath(pointerDownState.lastCoords.x, pointerDownState.lastCoords.y);\n } else if (this.state.activeTool.type !== \"eraser\" && this.state.activeTool.type !== \"hand\" && this.state.activeTool.type !== \"mermaid\") {\n this.createGenericElementOnPointerDown(this.state.activeTool.type, pointerDownState);\n }\n\n (_b = (_a = this.props) === null || _a === void 0 ? void 0 : _a.onPointerDown) === null || _b === void 0 ? void 0 : _b.call(_a, this.state.activeTool, pointerDownState);\n this.onPointerDownEmitter.trigger(this.state.activeTool, pointerDownState, event);\n\n if (this.state.activeTool.type === \"eraser\") {\n this.eraserTrail.startPath(pointerDownState.lastCoords.x, pointerDownState.lastCoords.y);\n }\n\n const onPointerMove = this.onPointerMoveFromPointerDownHandler(pointerDownState);\n const onPointerUp = this.onPointerUpFromPointerDownHandler(pointerDownState);\n const onKeyDown = this.onKeyDownFromPointerDownHandler(pointerDownState);\n const onKeyUp = this.onKeyUpFromPointerDownHandler(pointerDownState);\n this.missingPointerEventCleanupEmitter.once(_event => onPointerUp(_event || event.nativeEvent));\n\n if (!this.state.viewModeEnabled || this.state.activeTool.type === \"laser\") {\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_MOVE, onPointerMove);\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, onPointerUp);\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.KEYDOWN, onKeyDown);\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.KEYUP, onKeyUp);\n pointerDownState.eventListeners.onMove = onPointerMove;\n pointerDownState.eventListeners.onUp = onPointerUp;\n pointerDownState.eventListeners.onKeyUp = onKeyUp;\n pointerDownState.eventListeners.onKeyDown = onKeyDown;\n }\n };\n\n this.handleCanvasPointerUp = event => {\n var _a, _b;\n\n this.removePointer(event);\n this.lastPointerUpEvent = event;\n const scenePointer = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX: event.clientX,\n clientY: event.clientY\n }, this.state);\n const clicklength = event.timeStamp - ((_b = (_a = this.lastPointerDownEvent) === null || _a === void 0 ? void 0 : _a.timeStamp) !== null && _b !== void 0 ? _b : 0);\n\n if (this.device.editor.isMobile && clicklength < 300) {\n const hitElement = this.getElementAtPosition(scenePointer.x, scenePointer.y);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeLikeElement)(hitElement) && this.isIframeLikeElementCenter(hitElement, event, scenePointer.x, scenePointer.y)) {\n this.handleEmbeddableCenterClick(hitElement);\n return;\n }\n }\n\n if (this.device.isTouchScreen) {\n const hitElement = this.getElementAtPosition(scenePointer.x, scenePointer.y);\n this.hitLinkElement = this.getElementLinkAtPosition(scenePointer, hitElement);\n }\n\n if (this.hitLinkElement && !this.state.selectedElementIds[this.hitLinkElement.id]) {\n if (clicklength < 300 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeLikeElement)(this.hitLinkElement) && !(0,_hyperlink_helpers__WEBPACK_IMPORTED_MODULE_91__.isPointHittingLinkIcon)(this.hitLinkElement, this.scene.getNonDeletedElementsMap(), this.state, [scenePointer.x, scenePointer.y])) {\n this.handleEmbeddableCenterClick(this.hitLinkElement);\n } else {\n this.redirectToLink(event, this.device.isTouchScreen);\n }\n } else if (this.state.viewModeEnabled) {\n this.setState({\n activeEmbeddable: null,\n selectedElementIds: {}\n });\n }\n };\n\n this.maybeOpenContextMenuAfterPointerDownOnTouchDevices = event => {\n // deal with opening context menu on touch devices\n if (event.pointerType === \"touch\") {\n invalidateContextMenu = false;\n\n if (touchTimeout) {\n // If there's already a touchTimeout, this means that there's another\n // touch down and we are doing another touch, so we shouldn't open the\n // context menu.\n invalidateContextMenu = true;\n } else {\n // open the context menu with the first touch's clientX and clientY\n // if the touch is not moving\n touchTimeout = window.setTimeout(() => {\n touchTimeout = 0;\n\n if (!invalidateContextMenu) {\n this.handleCanvasContextMenu(event);\n }\n }, _constants__WEBPACK_IMPORTED_MODULE_12__.TOUCH_CTX_MENU_TIMEOUT);\n }\n }\n };\n\n this.resetContextMenuTimer = () => {\n clearTimeout(touchTimeout);\n touchTimeout = 0;\n invalidateContextMenu = false;\n };\n /**\r\n * pointerup may not fire in certian cases (user tabs away...), so in order\r\n * to properly cleanup pointerdown state, we need to fire any hanging\r\n * pointerup handlers manually\r\n */\n\n\n this.maybeCleanupAfterMissingPointerUp = event => {\n lastPointerUp === null || lastPointerUp === void 0 ? void 0 : lastPointerUp();\n this.missingPointerEventCleanupEmitter.trigger(event).clear();\n }; // Returns whether the event is a panning\n\n\n this.handleCanvasPanUsingWheelOrSpaceDrag = event => {\n if (!(gesture.pointers.size <= 1 && (event.button === _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_BUTTON.WHEEL || event.button === _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_BUTTON.MAIN && isHoldingSpace || (0,_appState__WEBPACK_IMPORTED_MODULE_10__.isHandToolActive)(this.state) || this.state.viewModeEnabled && !(0,_appState__WEBPACK_IMPORTED_MODULE_10__.isLaserPointerActive)(this.state))) || (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(this.state.editingElement)) {\n return false;\n }\n\n isPanning = true;\n event.preventDefault();\n let nextPastePrevented = false;\n const isLinux = typeof window === undefined ? false : /Linux/.test(window.navigator.platform);\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.GRABBING);\n let {\n clientX: lastX,\n clientY: lastY\n } = event;\n const onPointerMove = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdatesThrottled)(event => {\n const deltaX = lastX - event.clientX;\n const deltaY = lastY - event.clientY;\n lastX = event.clientX;\n lastY = event.clientY;\n /*\r\n * Prevent paste event if we move while middle clicking on Linux.\r\n * See issue #1383.\r\n */\n\n if (isLinux && !nextPastePrevented && (Math.abs(deltaX) > 1 || Math.abs(deltaY) > 1)) {\n nextPastePrevented = true;\n /* Prevent the next paste event */\n\n const preventNextPaste = event => {\n document.body.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.PASTE, preventNextPaste);\n event.stopPropagation();\n };\n /*\r\n * Reenable next paste in case of disabled middle click paste for\r\n * any reason:\r\n * - right click paste\r\n * - empty clipboard\r\n */\n\n\n const enableNextPaste = () => {\n setTimeout(() => {\n document.body.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.PASTE, preventNextPaste);\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, enableNextPaste);\n }, 100);\n };\n\n document.body.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.PASTE, preventNextPaste);\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, enableNextPaste);\n }\n\n this.translateCanvas({\n scrollX: this.state.scrollX - deltaX / this.state.zoom.value,\n scrollY: this.state.scrollY - deltaY / this.state.zoom.value\n });\n });\n const teardown = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(lastPointerUp = () => {\n lastPointerUp = null;\n isPanning = false;\n\n if (!isHoldingSpace) {\n if (this.state.viewModeEnabled) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.GRAB);\n } else {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n }\n }\n\n this.setState({\n cursorButton: \"up\"\n });\n this.savePointer(event.clientX, event.clientY, \"up\");\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_MOVE, onPointerMove);\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, teardown);\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.BLUR, teardown);\n onPointerMove.flush();\n });\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.BLUR, teardown);\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_MOVE, onPointerMove, {\n passive: true\n });\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, teardown);\n return true;\n };\n\n this.clearSelectionIfNotUsingSelection = () => {\n if (this.state.activeTool.type !== \"selection\") {\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n selectedGroupIds: {},\n editingGroupId: null,\n activeEmbeddable: null\n });\n }\n };\n /**\r\n * @returns whether the pointer event has been completely handled\r\n */\n\n\n this.handleSelectionOnPointerDown = (event, pointerDownState) => {\n var _a;\n\n if (this.state.activeTool.type === \"selection\") {\n const elements = this.scene.getNonDeletedElements();\n const elementsMap = this.scene.getNonDeletedElementsMap();\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (selectedElements.length === 1 && !this.state.editingLinearElement && !(this.state.selectedLinearElement && this.state.selectedLinearElement.hoverPointIndex !== -1)) {\n const elementWithTransformHandleType = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getElementWithTransformHandleType)(elements, this.state, pointerDownState.origin.x, pointerDownState.origin.y, this.state.zoom, event.pointerType, this.scene.getNonDeletedElementsMap(), this.device);\n\n if (elementWithTransformHandleType != null) {\n this.setState({\n resizingElement: elementWithTransformHandleType.element\n });\n pointerDownState.resize.handleType = elementWithTransformHandleType.transformHandleType;\n }\n } else if (selectedElements.length > 1) {\n pointerDownState.resize.handleType = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getTransformHandleTypeFromCoords)((0,_element__WEBPACK_IMPORTED_MODULE_16__.getCommonBounds)(selectedElements), pointerDownState.origin.x, pointerDownState.origin.y, this.state.zoom, event.pointerType, this.device);\n }\n\n if (pointerDownState.resize.handleType) {\n pointerDownState.resize.isResizing = true;\n pointerDownState.resize.offset = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.tupleToCoors)((0,_element__WEBPACK_IMPORTED_MODULE_16__.getResizeOffsetXY)(pointerDownState.resize.handleType, selectedElements, elementsMap, pointerDownState.origin.x, pointerDownState.origin.y));\n\n if (selectedElements.length === 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(selectedElements[0]) && selectedElements[0].points.length === 2) {\n pointerDownState.resize.arrowDirection = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getResizeArrowDirection)(pointerDownState.resize.handleType, selectedElements[0]);\n }\n } else {\n if (this.state.selectedLinearElement) {\n const linearElementEditor = this.state.editingLinearElement || this.state.selectedLinearElement;\n const ret = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.handlePointerDown(event, this.state, this.store, pointerDownState.origin, linearElementEditor, this);\n\n if (ret.hitElement) {\n pointerDownState.hit.element = ret.hitElement;\n }\n\n if (ret.linearElementEditor) {\n this.setState({\n selectedLinearElement: ret.linearElementEditor\n });\n\n if (this.state.editingLinearElement) {\n this.setState({\n editingLinearElement: ret.linearElementEditor\n });\n }\n }\n\n if (ret.didAddPoint) {\n return true;\n }\n } // hitElement may already be set above, so check first\n\n\n pointerDownState.hit.element = (_a = pointerDownState.hit.element) !== null && _a !== void 0 ? _a : this.getElementAtPosition(pointerDownState.origin.x, pointerDownState.origin.y);\n\n if (pointerDownState.hit.element) {\n // Early return if pointer is hitting link icon\n const hitLinkElement = this.getElementLinkAtPosition({\n x: pointerDownState.origin.x,\n y: pointerDownState.origin.y\n }, pointerDownState.hit.element);\n\n if (hitLinkElement) {\n return false;\n }\n } // For overlapped elements one position may hit\n // multiple elements\n\n\n pointerDownState.hit.allHitElements = this.getElementsAtPosition(pointerDownState.origin.x, pointerDownState.origin.y);\n const hitElement = pointerDownState.hit.element;\n const someHitElementIsSelected = pointerDownState.hit.allHitElements.some(element => this.isASelectedElement(element));\n\n if ((hitElement === null || !someHitElementIsSelected) && !event.shiftKey && !pointerDownState.hit.hasHitCommonBoundingBoxOfSelectedElements) {\n this.clearSelection(hitElement);\n }\n\n if (this.state.editingLinearElement) {\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({\n [this.state.editingLinearElement.elementId]: true\n }, this.state)\n }); // If we click on something\n } else if (hitElement != null) {\n // on CMD/CTRL, drill down to hit element regardless of groups etc.\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) {\n if (!this.state.selectedElementIds[hitElement.id]) {\n pointerDownState.hit.wasAddedToSelection = true;\n }\n\n this.setState(prevState => Object.assign(Object.assign({}, (0,_groups__WEBPACK_IMPORTED_MODULE_23__.editGroupForSelectedElement)(prevState, hitElement)), {\n previousSelectedElementIds: this.state.selectedElementIds\n })); // mark as not completely handled so as to allow dragging etc.\n\n return false;\n } // deselect if item is selected\n // if shift is not clicked, this will always return true\n // otherwise, it will trigger selection based on current\n // state of the box\n\n\n if (!this.state.selectedElementIds[hitElement.id]) {\n // if we are currently editing a group, exiting editing mode and deselect the group.\n if (this.state.editingGroupId && !(0,_groups__WEBPACK_IMPORTED_MODULE_23__.isElementInGroup)(hitElement, this.state.editingGroupId)) {\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n selectedGroupIds: {},\n editingGroupId: null,\n activeEmbeddable: null\n });\n } // Add hit element to selection. At this point if we're not holding\n // SHIFT the previously selected element(s) were deselected above\n // (make sure you use setState updater to use latest state)\n // With shift-selection, we want to make sure that frames and their containing\n // elements are not selected at the same time.\n\n\n if (!someHitElementIsSelected && !pointerDownState.hit.hasHitCommonBoundingBoxOfSelectedElements) {\n this.setState(prevState => {\n const nextSelectedElementIds = Object.assign(Object.assign({}, prevState.selectedElementIds), {\n [hitElement.id]: true\n });\n const previouslySelectedElements = [];\n Object.keys(prevState.selectedElementIds).forEach(id => {\n const element = this.scene.getElement(id);\n element && previouslySelectedElements.push(element);\n }); // if hitElement is frame-like, deselect all of its elements\n // if they are selected\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(hitElement)) {\n (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getFrameChildren)(previouslySelectedElements, hitElement.id).forEach(element => {\n delete nextSelectedElementIds[element.id];\n });\n } else if (hitElement.frameId) {\n // if hitElement is in a frame and its frame has been selected\n // disable selection for the given element\n if (nextSelectedElementIds[hitElement.frameId]) {\n delete nextSelectedElementIds[hitElement.id];\n }\n } else {\n // hitElement is neither a frame nor an element in a frame\n // but since hitElement could be in a group with some frames\n // this means selecting hitElement will have the frames selected as well\n // because we want to keep the invariant:\n // - frames and their elements are not selected at the same time\n // we deselect elements in those frames that were previously selected\n const groupIds = hitElement.groupIds;\n const framesInGroups = new Set(groupIds.flatMap(gid => (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getElementsInGroup)(this.scene.getNonDeletedElements(), gid)).filter(element => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(element)).map(frame => frame.id));\n\n if (framesInGroups.size > 0) {\n previouslySelectedElements.forEach(element => {\n if (element.frameId && framesInGroups.has(element.frameId)) {\n // deselect element and groups containing the element\n delete nextSelectedElementIds[element.id];\n element.groupIds.flatMap(gid => (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getElementsInGroup)(this.scene.getNonDeletedElements(), gid)).forEach(element => {\n delete nextSelectedElementIds[element.id];\n });\n }\n });\n }\n }\n\n return Object.assign(Object.assign({}, (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: prevState.editingGroupId,\n selectedElementIds: nextSelectedElementIds\n }, this.scene.getNonDeletedElements(), prevState, this)), {\n showHyperlinkPopup: hitElement.link || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(hitElement) ? \"info\" : false\n });\n });\n pointerDownState.hit.wasAddedToSelection = true;\n }\n }\n }\n\n this.setState({\n previousSelectedElementIds: this.state.selectedElementIds\n });\n }\n }\n\n return false;\n };\n\n this.handleTextOnPointerDown = (event, pointerDownState) => {\n // if we're currently still editing text, clicking outside\n // should only finalize it, not create another (irrespective\n // of state.activeTool.locked)\n if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(this.state.editingElement)) {\n return;\n }\n\n let sceneX = pointerDownState.origin.x;\n let sceneY = pointerDownState.origin.y;\n const element = this.getElementAtPosition(sceneX, sceneY, {\n includeBoundTextElement: true\n }); // FIXME\n\n let container = this.getTextBindableContainerAtPosition(sceneX, sceneY);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.hasBoundTextElement)(element)) {\n container = element;\n sceneX = element.x + element.width / 2;\n sceneY = element.y + element.height / 2;\n }\n\n this.startTextEditing({\n sceneX,\n sceneY,\n insertAtParentCenter: !event.altKey,\n container,\n autoEdit: false\n });\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n\n if (!this.state.activeTool.locked) {\n this.setState({\n activeTool: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, {\n type: \"selection\"\n })\n });\n }\n };\n\n this.handleFreeDrawElementOnPointerDown = (event, elementType, pointerDownState) => {\n // Begin a mark capture. This does not have to update state yet.\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerDownState.origin.x, pointerDownState.origin.y, null);\n const strokeOptions = this.state.currentStrokeOptions; //zsviczian\n\n const simulatePressure = (strokeOptions === null || strokeOptions === void 0 ? void 0 : strokeOptions.constantPressure) ? false : event.pressure === 0.5;\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords({\n x: gridX,\n y: gridY\n });\n const element = (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.newFreeDrawElement)(Object.assign(Object.assign({\n type: elementType,\n x: gridX,\n y: gridY,\n strokeColor: this.state.currentItemStrokeColor,\n backgroundColor: this.state.currentItemBackgroundColor,\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roughness: this.state.currentItemRoughness,\n opacity: this.state.currentItemOpacity,\n roundness: null,\n simulatePressure,\n locked: false\n }, strokeOptions //zsviczian\n ? {\n customData: {\n strokeOptions\n }\n } : {}), {\n frameId: topLayerFrame ? topLayerFrame.id : null\n }));\n this.setState(prevState => {\n const nextSelectedElementIds = Object.assign({}, prevState.selectedElementIds);\n delete nextSelectedElementIds[element.id];\n return {\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(nextSelectedElementIds, prevState)\n };\n });\n const pressures = element.simulatePressure ? element.pressures : [//zsviczian\n ...element.pressures, (strokeOptions === null || strokeOptions === void 0 ? void 0 : strokeOptions.constantPressure) ? 1 : event.pressure];\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(element, {\n points: [[0, 0]],\n pressures\n });\n const boundElement = (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.getHoveredElementForBinding)(pointerDownState.origin, this);\n\n if (strokeOptions === null || strokeOptions === void 0 ? void 0 : strokeOptions.highlighter) {\n //zsviczian\n this.scene.insertElement(element, 0);\n /* this.scene.replaceAllElements([\r\n element,\r\n ...this.scene.getElementsIncludingDeleted(),\r\n ]);*/\n } else {\n this.scene.insertElement(element);\n }\n\n this.setState({\n draggingElement: element,\n editingElement: element,\n startBoundElement: boundElement,\n suggestedBindings: []\n });\n };\n\n this.insertIframeElement = ({\n sceneX,\n sceneY,\n width,\n height\n }) => {\n var _a;\n\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(sceneX, sceneY, ((_a = this.lastPointerDownEvent) === null || _a === void 0 ? void 0 : _a[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) ? null : this.state.gridSize);\n const element = (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.newIframeElement)({\n type: \"iframe\",\n x: gridX,\n y: gridY,\n strokeColor: \"transparent\",\n backgroundColor: \"transparent\",\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roughness: this.state.currentItemRoughness,\n roundness: this.getCurrentItemRoundness(\"iframe\"),\n opacity: this.state.currentItemOpacity,\n locked: false,\n width,\n height\n });\n this.scene.insertElement(element);\n return element;\n }; //create rectangle element with youtube top left on nearest grid point width / hight 640/360\n\n\n this.insertEmbeddableElement = ({\n sceneX,\n sceneY,\n link\n }) => {\n var _a;\n\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(sceneX, sceneY, ((_a = this.lastPointerDownEvent) === null || _a === void 0 ? void 0 : _a[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) ? null : this.state.gridSize);\n const embedLink = (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.getEmbedLink)(link);\n\n if (!embedLink) {\n return;\n }\n\n if (embedLink.error instanceof URIError) {\n this.setToast({\n message: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"toast.unrecognizedLinkFormat\"),\n closable: true\n });\n }\n\n const element = (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.newEmbeddableElement)({\n type: \"embeddable\",\n x: gridX,\n y: gridY,\n strokeColor: \"transparent\",\n backgroundColor: \"transparent\",\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roughness: this.state.currentItemRoughness,\n roundness: this.getCurrentItemRoundness(\"embeddable\"),\n opacity: this.state.currentItemOpacity,\n locked: false,\n width: embedLink.intrinsicSize.w,\n height: embedLink.intrinsicSize.h,\n link\n });\n this.scene.insertElement(element);\n return element;\n };\n\n this.createImageElement = ({\n sceneX,\n sceneY,\n addToFrameUnderCursor = true\n }) => {\n var _a;\n\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(sceneX, sceneY, ((_a = this.lastPointerDownEvent) === null || _a === void 0 ? void 0 : _a[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) ? null : this.state.gridSize);\n const topLayerFrame = addToFrameUnderCursor ? this.getTopLayerFrameAtSceneCoords({\n x: gridX,\n y: gridY\n }) : null;\n const element = (0,_element__WEBPACK_IMPORTED_MODULE_16__.newImageElement)({\n type: \"image\",\n x: gridX,\n y: gridY,\n strokeColor: this.state.currentItemStrokeColor,\n backgroundColor: this.state.currentItemBackgroundColor,\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roughness: this.state.currentItemRoughness,\n roundness: null,\n opacity: this.state.currentItemOpacity,\n locked: false,\n frameId: topLayerFrame ? topLayerFrame.id : null\n });\n return element;\n };\n\n this.handleLinearElementOnPointerDown = (event, elementType, pointerDownState) => {\n if (this.state.multiElement) {\n const {\n multiElement\n } = this.state; // finalize if completing a loop\n\n if (multiElement.type === \"line\" && (0,_math__WEBPACK_IMPORTED_MODULE_28__.isPathALoop)(multiElement.points, this.state.zoom.value)) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(multiElement, {\n lastCommittedPoint: multiElement.points[multiElement.points.length - 1]\n });\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n return;\n }\n\n const {\n x: rx,\n y: ry,\n lastCommittedPoint\n } = multiElement; // clicking inside commit zone → finalize arrow\n\n if (multiElement.points.length > 1 && lastCommittedPoint && (0,_math__WEBPACK_IMPORTED_MODULE_28__.distance2d)(pointerDownState.origin.x - rx, pointerDownState.origin.y - ry, lastCommittedPoint[0], lastCommittedPoint[1]) < _constants__WEBPACK_IMPORTED_MODULE_12__.LINE_CONFIRM_THRESHOLD) {\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n return;\n }\n\n this.setState(prevState => ({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(Object.assign(Object.assign({}, prevState.selectedElementIds), {\n [multiElement.id]: true\n }), prevState)\n })); // clicking outside commit zone → update reference for last committed\n // point\n\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(multiElement, {\n lastCommittedPoint: multiElement.points[multiElement.points.length - 1]\n });\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.POINTER);\n } else {\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerDownState.origin.x, pointerDownState.origin.y, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize);\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords({\n x: gridX,\n y: gridY\n });\n /* If arrow is pre-arrowheads, it will have undefined for both start and end arrowheads.\r\n If so, we want it to be null for start and \"arrow\" for end. If the linear item is not\r\n an arrow, we want it to be null for both. Otherwise, we want it to use the\r\n values from appState. */\n\n const {\n currentItemStartArrowhead,\n currentItemEndArrowhead\n } = this.state;\n const [startArrowhead, endArrowhead] = elementType === \"arrow\" ? [currentItemStartArrowhead, currentItemEndArrowhead] : [null, null];\n const element = (0,_element__WEBPACK_IMPORTED_MODULE_16__.newLinearElement)({\n type: elementType,\n x: gridX,\n y: gridY,\n strokeColor: this.state.currentItemStrokeColor,\n backgroundColor: this.state.currentItemBackgroundColor,\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roughness: this.state.currentItemRoughness,\n opacity: this.state.currentItemOpacity,\n roundness: this.state.currentItemRoundness === \"round\" ? {\n type: _constants__WEBPACK_IMPORTED_MODULE_12__.ROUNDNESS.PROPORTIONAL_RADIUS\n } : null,\n startArrowhead,\n endArrowhead,\n locked: false,\n frameId: topLayerFrame ? topLayerFrame.id : null\n });\n this.setState(prevState => {\n const nextSelectedElementIds = Object.assign({}, prevState.selectedElementIds);\n delete nextSelectedElementIds[element.id];\n return {\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(nextSelectedElementIds, prevState)\n };\n });\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(element, {\n points: [...element.points, [0, 0]]\n });\n const boundElement = (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.getHoveredElementForBinding)(pointerDownState.origin, this);\n this.scene.insertElement(element);\n this.setState({\n draggingElement: element,\n editingElement: element,\n startBoundElement: boundElement,\n suggestedBindings: []\n });\n }\n };\n\n this.createGenericElementOnPointerDown = (elementType, pointerDownState) => {\n var _a;\n\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerDownState.origin.x, pointerDownState.origin.y, ((_a = this.lastPointerDownEvent) === null || _a === void 0 ? void 0 : _a[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) ? null : this.state.gridSize);\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords({\n x: gridX,\n y: gridY\n });\n const baseElementAttributes = {\n x: gridX,\n y: gridY,\n strokeColor: this.state.currentItemStrokeColor,\n backgroundColor: this.state.currentItemBackgroundColor,\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roughness: this.state.currentItemRoughness,\n opacity: this.state.currentItemOpacity,\n roundness: this.getCurrentItemRoundness(elementType),\n locked: false,\n frameId: topLayerFrame ? topLayerFrame.id : null\n };\n let element;\n\n if (elementType === \"embeddable\") {\n element = (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.newEmbeddableElement)(Object.assign({\n type: \"embeddable\"\n }, baseElementAttributes));\n } else {\n element = (0,_element__WEBPACK_IMPORTED_MODULE_16__.newElement)(Object.assign({\n type: elementType\n }, baseElementAttributes));\n }\n\n if (element.type === \"selection\") {\n this.setState({\n selectionElement: element,\n draggingElement: element\n });\n } else {\n this.scene.insertElement(element);\n this.setState({\n multiElement: null,\n draggingElement: element,\n editingElement: element\n });\n }\n };\n\n this.createFrameElementOnPointerDown = (pointerDownState, type) => {\n var _a;\n\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerDownState.origin.x, pointerDownState.origin.y, ((_a = this.lastPointerDownEvent) === null || _a === void 0 ? void 0 : _a[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) ? null : this.state.gridSize);\n const constructorOpts = Object.assign(Object.assign({\n x: gridX,\n y: gridY,\n opacity: this.state.currentItemOpacity,\n locked: false\n }, _constants__WEBPACK_IMPORTED_MODULE_12__.FRAME_STYLE), this.state.frameColor ? {\n //zsviczian\n customData: {\n frameColor: this.state.frameColor\n }\n } : {});\n const frame = type === _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.magicframe ? (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.newMagicFrameElement)(constructorOpts) : (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.newFrameElement)(constructorOpts);\n this.scene.insertElement(frame);\n this.setState({\n multiElement: null,\n draggingElement: frame,\n editingElement: frame\n });\n };\n\n this.restoreReadyToEraseElements = () => {\n this.elementsPendingErasure = new Set();\n this.triggerRender();\n };\n\n this.eraseElements = () => {\n let didChange = false;\n const elements = this.scene.getElementsIncludingDeleted().map(ele => {\n if (this.elementsPendingErasure.has(ele.id) || ele.frameId && this.elementsPendingErasure.has(ele.frameId) || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBoundToContainer)(ele) && this.elementsPendingErasure.has(ele.containerId)) {\n didChange = true;\n return (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.newElementWith)(ele, {\n isDeleted: true\n });\n }\n\n return ele;\n });\n this.elementsPendingErasure = new Set();\n\n if (didChange) {\n this.store.shouldCaptureIncrement();\n this.scene.replaceAllElements(elements);\n }\n };\n\n this.initializeImage = async ({\n imageFile,\n imageElement: _imageElement,\n showCursorImagePreview = false\n }) => {\n var _a, _b, _c, _d; // at this point this should be guaranteed image file, but we do this check\n // to satisfy TS down the line\n\n\n if (!(0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.isSupportedImageFile)(imageFile)) {\n throw new Error((0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.unsupportedFileType\"));\n }\n\n const mimeType = imageFile.type;\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, \"wait\");\n\n if (mimeType === _constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.svg) {\n try {\n imageFile = (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.SVGStringToFile)(await (0,_element_image__WEBPACK_IMPORTED_MODULE_42__.normalizeSVG)(await imageFile.text()), imageFile.name);\n } catch (error) {\n console.warn(error);\n throw new Error((0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.svgImageInsertError\"));\n }\n } // generate image id (by default the file digest) before any\n // resizing/compression takes place to keep it more portable\n\n\n const fileId = await (((_b = (_a = this.props).generateIdForFile) === null || _b === void 0 ? void 0 : _b.call(_a, imageFile)) || (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.generateIdFromFile)(imageFile));\n\n if (!fileId) {\n console.warn(\"Couldn't generate file id or the supplied `generateIdForFile` didn't resolve to one.\");\n throw new Error((0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.imageInsertError\"));\n }\n\n const existingFileData = this.files[fileId];\n\n if (!(existingFileData === null || existingFileData === void 0 ? void 0 : existingFileData.dataURL)) {\n try {\n imageFile = await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.resizeImageFile)(imageFile, {\n maxWidthOrHeight: _constants__WEBPACK_IMPORTED_MODULE_12__.DEFAULT_MAX_IMAGE_WIDTH_OR_HEIGHT\n });\n } catch (error) {\n console.error(\"Error trying to resizing image file on insertion\", error);\n }\n\n if (imageFile.size > _constants__WEBPACK_IMPORTED_MODULE_12__.MAX_ALLOWED_FILE_BYTES) {\n throw new Error((0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.fileTooBig\", {\n maxSize: `${Math.trunc(_constants__WEBPACK_IMPORTED_MODULE_12__.MAX_ALLOWED_FILE_BYTES / 1024 / 1024)}MB`\n }));\n }\n }\n\n if (showCursorImagePreview) {\n const dataURL = (_c = this.files[fileId]) === null || _c === void 0 ? void 0 : _c.dataURL; // optimization so that we don't unnecessarily resize the original\n // full-size file for cursor preview\n // (it's much faster to convert the resized dataURL to File)\n\n const resizedFile = dataURL && (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.dataURLToFile)(dataURL);\n this.setImagePreviewCursor(resizedFile || imageFile);\n }\n\n const dataURL = ((_d = this.files[fileId]) === null || _d === void 0 ? void 0 : _d.dataURL) || (await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.getDataURL)(imageFile));\n const imageElement = (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(_imageElement, {\n fileId\n }, false);\n return new Promise(async (resolve, reject) => {\n var _a;\n\n try {\n this.files = Object.assign(Object.assign({}, this.files), {\n [fileId]: {\n mimeType,\n id: fileId,\n dataURL,\n created: Date.now(),\n lastRetrieved: Date.now()\n }\n });\n const cachedImageData = this.imageCache.get(fileId);\n\n if (!cachedImageData) {\n this.addNewImagesToImageCache();\n await this.updateImageCache([imageElement]);\n }\n\n if ((cachedImageData === null || cachedImageData === void 0 ? void 0 : cachedImageData.image) instanceof Promise) {\n await cachedImageData.image;\n }\n\n if (this.state.pendingImageElementId !== imageElement.id && ((_a = this.state.draggingElement) === null || _a === void 0 ? void 0 : _a.id) !== imageElement.id) {\n this.initializeImageDimensions(imageElement, true);\n }\n\n resolve(imageElement);\n } catch (error) {\n console.error(error);\n reject(new Error((0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.imageInsertError\")));\n } finally {\n if (!showCursorImagePreview) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n }\n }\n });\n };\n /**\r\n * inserts image into elements array and rerenders\r\n */\n\n\n this.insertImageElement = async (imageElement, imageFile, showCursorImagePreview) => {\n // we should be handling all cases upstream, but in case we forget to handle\n // a future case, let's throw here\n if (!this.isToolSupported(\"image\")) {\n this.setState({\n errorMessage: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.imageToolNotSupported\")\n });\n return;\n }\n\n this.scene.insertElement(imageElement);\n\n try {\n return await this.initializeImage({\n imageFile,\n imageElement,\n showCursorImagePreview\n });\n } catch (error) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(imageElement, {\n isDeleted: true\n });\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n this.setState({\n errorMessage: error.message || (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.imageInsertError\")\n });\n return null;\n }\n };\n\n this.setImagePreviewCursor = async imageFile => {\n // mustn't be larger than 128 px\n // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Basic_User_Interface/Using_URL_values_for_the_cursor_property\n const cursorImageSizePx = 96;\n let imagePreview;\n\n try {\n imagePreview = await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.resizeImageFile)(imageFile, {\n maxWidthOrHeight: cursorImageSizePx\n });\n } catch (e) {\n if (e.cause === \"UNSUPPORTED\") {\n throw new Error((0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.unsupportedFileType\"));\n }\n\n throw e;\n }\n\n let previewDataURL = await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.getDataURL)(imagePreview); // SVG cannot be resized via `resizeImageFile` so we resize by rendering to\n // a small canvas\n\n if (imageFile.type === _constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.svg) {\n const img = await (0,_element_image__WEBPACK_IMPORTED_MODULE_42__.loadHTMLImageElement)(previewDataURL);\n let height = Math.min(img.height, cursorImageSizePx);\n let width = height * (img.width / img.height);\n\n if (width > cursorImageSizePx) {\n width = cursorImageSizePx;\n height = width * (img.height / img.width);\n }\n\n const canvas = document.createElement(\"canvas\");\n canvas.height = height;\n canvas.width = width;\n const context = canvas.getContext(\"2d\");\n context.drawImage(img, 0, 0, width, height);\n previewDataURL = canvas.toDataURL(_constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.svg);\n }\n\n if (this.state.pendingImageElementId) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, `url(${previewDataURL}) 4 4, auto`);\n }\n };\n\n this.onImageAction = async ({\n insertOnCanvasDirectly\n }) => {\n try {\n const clientX = this.state.width / 2 + this.state.offsetLeft;\n const clientY = this.state.height / 2 + this.state.offsetTop;\n const {\n x,\n y\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX,\n clientY\n }, this.state);\n const imageFile = await (0,_data_filesystem__WEBPACK_IMPORTED_MODULE_44__.fileOpen)({\n description: \"Image\",\n extensions: Object.keys(_constants__WEBPACK_IMPORTED_MODULE_12__.IMAGE_MIME_TYPES)\n });\n const imageElement = this.createImageElement({\n sceneX: x,\n sceneY: y,\n addToFrameUnderCursor: false\n });\n\n if (insertOnCanvasDirectly) {\n this.insertImageElement(imageElement, imageFile);\n this.initializeImageDimensions(imageElement);\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({\n [imageElement.id]: true\n }, this.state)\n }, () => {\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n });\n } else {\n this.setState({\n pendingImageElementId: imageElement.id\n }, () => {\n this.insertImageElement(imageElement, imageFile,\n /* showCursorImagePreview */\n true);\n });\n }\n } catch (error) {\n if (error.name !== \"AbortError\") {\n console.error(error);\n } else {\n console.warn(error);\n }\n\n this.setState({\n pendingImageElementId: null,\n editingElement: null,\n activeTool: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, {\n type: \"selection\"\n })\n }, () => {\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n });\n }\n };\n\n this.initializeImageDimensions = (imageElement, forceNaturalSize = false) => {\n var _a;\n\n const image = (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isInitializedImageElement)(imageElement) && ((_a = this.imageCache.get(imageElement.fileId)) === null || _a === void 0 ? void 0 : _a.image);\n\n if (!image || image instanceof Promise) {\n if (imageElement.width < _constants__WEBPACK_IMPORTED_MODULE_12__.DRAGGING_THRESHOLD / this.state.zoom.value && imageElement.height < _constants__WEBPACK_IMPORTED_MODULE_12__.DRAGGING_THRESHOLD / this.state.zoom.value) {\n const placeholderSize = 100 / this.state.zoom.value;\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(imageElement, {\n x: imageElement.x - placeholderSize / 2,\n y: imageElement.y - placeholderSize / 2,\n width: placeholderSize,\n height: placeholderSize\n });\n }\n\n return;\n }\n\n if (forceNaturalSize || // if user-created bounding box is below threshold, assume the\n // intention was to click instead of drag, and use the image's\n // intrinsic size\n imageElement.width < _constants__WEBPACK_IMPORTED_MODULE_12__.DRAGGING_THRESHOLD / this.state.zoom.value && imageElement.height < _constants__WEBPACK_IMPORTED_MODULE_12__.DRAGGING_THRESHOLD / this.state.zoom.value) {\n const minHeight = Math.max(this.state.height - 120, 160); // max 65% of canvas height, clamped to <300px, vh - 120px>\n\n const maxHeight = Math.min(minHeight, Math.floor(this.state.height * 0.5) / this.state.zoom.value);\n const height = Math.min(image.naturalHeight, maxHeight);\n const width = height * (image.naturalWidth / image.naturalHeight); // add current imageElement width/height to account for previous centering\n // of the placeholder image\n\n const x = imageElement.x + imageElement.width / 2 - width / 2;\n const y = imageElement.y + imageElement.height / 2 - height / 2;\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(imageElement, {\n x,\n y,\n width,\n height\n });\n }\n };\n /** updates image cache, refreshing updated elements and/or setting status\r\n to error for images that fail during <img> element creation */\n\n\n this.updateImageCache = async (elements, files = this.files) => {\n const {\n updatedFiles,\n erroredFiles\n } = await (0,_element_image__WEBPACK_IMPORTED_MODULE_42__.updateImageCache)({\n imageCache: this.imageCache,\n fileIds: elements.map(element => element.fileId),\n files\n });\n\n if (updatedFiles.size || erroredFiles.size) {\n for (const element of elements) {\n if (updatedFiles.has(element.fileId)) {\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_67__.ShapeCache[\"delete\"](element);\n }\n }\n }\n\n if (erroredFiles.size) {\n this.scene.replaceAllElements(this.scene.getElementsIncludingDeleted().map(element => {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isInitializedImageElement)(element) && erroredFiles.has(element.fileId)) {\n return (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.newElementWith)(element, {\n status: \"error\"\n });\n }\n\n return element;\n }));\n }\n\n return {\n updatedFiles,\n erroredFiles\n };\n };\n /** adds new images to imageCache and re-renders if needed */\n\n\n this.addNewImagesToImageCache = async (imageElements = (0,_element_image__WEBPACK_IMPORTED_MODULE_42__.getInitializedImageElements)(this.scene.getNonDeletedElements()), files = this.files) => {\n const uncachedImageElements = imageElements.filter(element => !element.isDeleted && !this.imageCache.has(element.fileId));\n\n if (uncachedImageElements.length) {\n const {\n updatedFiles\n } = await this.updateImageCache(uncachedImageElements, files);\n\n if (updatedFiles.size) {\n this.scene.triggerUpdate();\n }\n }\n };\n /** generally you should use `addNewImagesToImageCache()` directly if you need\r\n * to render new images. This is just a failsafe */\n\n\n this.scheduleImageRefresh = lodash_throttle__WEBPACK_IMPORTED_MODULE_43___default()(() => {\n this.addNewImagesToImageCache();\n }, _constants__WEBPACK_IMPORTED_MODULE_12__.IMAGE_RENDER_TIMEOUT);\n\n this.updateBindingEnabledOnPointerMove = event => {\n const shouldEnableBinding = (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.shouldEnableBindingForPointerEvent)(event);\n\n if (this.state.isBindingEnabled !== shouldEnableBinding) {\n this.setState({\n isBindingEnabled: shouldEnableBinding\n });\n }\n };\n\n this.maybeSuggestBindingAtCursor = pointerCoords => {\n const hoveredBindableElement = (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.getHoveredElementForBinding)(pointerCoords, this);\n this.setState({\n suggestedBindings: hoveredBindableElement != null ? [hoveredBindableElement] : []\n });\n };\n\n this.maybeSuggestBindingsForLinearElementAtCoords = (linearElement,\n /** scene coords */\n pointerCoords, // During line creation the start binding hasn't been written yet\n // into `linearElement`\n oppositeBindingBoundElement) => {\n if (!pointerCoords.length) {\n return;\n }\n\n const suggestedBindings = pointerCoords.reduce((acc, coords) => {\n const hoveredBindableElement = (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.getHoveredElementForBinding)(coords, this);\n\n if (hoveredBindableElement != null && !(0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.isLinearElementSimpleAndAlreadyBound)(linearElement, oppositeBindingBoundElement === null || oppositeBindingBoundElement === void 0 ? void 0 : oppositeBindingBoundElement.id, hoveredBindableElement)) {\n acc.push(hoveredBindableElement);\n }\n\n return acc;\n }, []);\n this.setState({\n suggestedBindings\n });\n };\n\n this.handleInteractiveCanvasRef = canvas => {\n var _a, _b, _c; // canvas is null when unmounting\n\n\n if (canvas !== null) {\n this.interactiveCanvas = canvas; // -----------------------------------------------------------------------\n // NOTE wheel, touchstart, touchend events must be registered outside\n // of react because react binds them them passively (so we can't prevent\n // default on them)\n\n this.interactiveCanvas.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.WHEEL, this.handleWheel);\n this.interactiveCanvas.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.TOUCH_START, this.onTouchStart);\n this.interactiveCanvas.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.TOUCH_END, this.onTouchEnd); // -----------------------------------------------------------------------\n } else {\n (_a = this.interactiveCanvas) === null || _a === void 0 ? void 0 : _a.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.WHEEL, this.handleWheel);\n (_b = this.interactiveCanvas) === null || _b === void 0 ? void 0 : _b.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.TOUCH_START, this.onTouchStart);\n (_c = this.interactiveCanvas) === null || _c === void 0 ? void 0 : _c.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.TOUCH_END, this.onTouchEnd);\n }\n };\n\n this.handleAppOnDrop = async event => {\n var _a, _b, _c, _d;\n\n if (this.props.onDrop) {\n try {\n if ((await this.props.onDrop(event)) === false) {\n return;\n }\n } catch (e) {\n console.error(e);\n }\n } // must be retrieved first, in the same frame\n\n\n const {\n file,\n fileHandle\n } = await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.getFileFromEvent)(event);\n const {\n x: sceneX,\n y: sceneY\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(event, this.state);\n\n try {\n // if image tool not supported, don't show an error here and let it fall\n // through so we still support importing scene data from images. If no\n // scene data encoded, we'll show an error then\n if ((0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.isSupportedImageFile)(file) && this.isToolSupported(\"image\")) {\n // first attempt to decode scene from the image if it's embedded\n // ---------------------------------------------------------------------\n if ((file === null || file === void 0 ? void 0 : file.type) === _constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.png || (file === null || file === void 0 ? void 0 : file.type) === _constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.svg) {\n try {\n const scene = await (0,_data__WEBPACK_IMPORTED_MODULE_13__.loadFromBlob)(file, this.state, this.scene.getElementsIncludingDeleted(), fileHandle);\n this.syncActionResult(Object.assign(Object.assign({}, scene), {\n appState: Object.assign(Object.assign({}, scene.appState || this.state), {\n isLoading: false\n }),\n replaceFiles: true,\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.CAPTURE\n }));\n return;\n } catch (error) {\n // Don't throw for image scene daa\n if (error.name !== \"EncodingError\") {\n throw new Error((0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"alerts.couldNotLoadInvalidFile\"));\n }\n }\n } // if no scene is embedded or we fail for whatever reason, fall back\n // to importing as regular image\n // ---------------------------------------------------------------------\n\n\n const imageElement = this.createImageElement({\n sceneX,\n sceneY\n });\n this.insertImageElement(imageElement, file);\n this.initializeImageDimensions(imageElement);\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({\n [imageElement.id]: true\n }, this.state)\n });\n return;\n }\n } catch (error) {\n return this.setState({\n isLoading: false,\n errorMessage: error.message\n });\n }\n\n const libraryJSON = event.dataTransfer.getData(_constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.excalidrawlib);\n\n if (libraryJSON && typeof libraryJSON === \"string\") {\n try {\n const libraryItems = (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.parseLibraryJSON)(libraryJSON);\n this.addElementsFromPasteOrLibrary({\n elements: (0,_data_library__WEBPACK_IMPORTED_MODULE_14__.distributeLibraryItemsOnSquareGrid)(libraryItems),\n position: event,\n files: null\n });\n } catch (error) {\n this.setState({\n errorMessage: error.message\n });\n }\n\n return;\n }\n\n if (file) {\n // Attempt to parse an excalidraw/excalidrawlib file\n await this.loadFileToCanvas(file, fileHandle);\n }\n\n if ((_b = (_a = event.dataTransfer) === null || _a === void 0 ? void 0 : _a.types) === null || _b === void 0 ? void 0 : _b.includes(\"text/plain\")) {\n const text = (_c = event.dataTransfer) === null || _c === void 0 ? void 0 : _c.getData(\"text\");\n\n if (text && (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.embeddableURLValidator)(text, this.props.validateEmbeddable) && (/^(http|https):\\/\\/[^\\s/$.?#].[^\\s]*$/.test(text) || ((_d = (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.getEmbedLink)(text)) === null || _d === void 0 ? void 0 : _d.type) === \"video\")) {\n const embeddable = this.insertEmbeddableElement({\n sceneX,\n sceneY,\n link: (0,_data_url__WEBPACK_IMPORTED_MODULE_47__.normalizeLink)(text)\n });\n\n if (embeddable) {\n this.setState({\n selectedElementIds: {\n [embeddable.id]: true\n }\n });\n }\n }\n }\n };\n\n this.loadFileToCanvas = async (file, fileHandle) => {\n file = await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.normalizeFile)(file);\n\n try {\n const elements = this.scene.getElementsIncludingDeleted();\n let ret;\n\n try {\n ret = await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.loadSceneOrLibraryFromBlob)(file, this.state, elements, fileHandle);\n } catch (error) {\n const imageSceneDataError = error instanceof _errors__WEBPACK_IMPORTED_MODULE_58__.ImageSceneDataError;\n\n if (imageSceneDataError && error.code === \"IMAGE_NOT_CONTAINS_SCENE_DATA\" && !this.isToolSupported(\"image\")) {\n this.setState({\n isLoading: false,\n errorMessage: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.imageToolNotSupported\")\n });\n return;\n }\n\n const errorMessage = imageSceneDataError ? (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"alerts.cannotRestoreFromImage\") : (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"alerts.couldNotLoadInvalidFile\");\n this.setState({\n isLoading: false,\n errorMessage\n });\n }\n\n if (!ret) {\n return;\n }\n\n if (ret.type === _constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.excalidraw) {\n // restore the fractional indices by mutating elements\n (0,_fractionalIndex__WEBPACK_IMPORTED_MODULE_90__.syncInvalidIndices)(elements.concat(ret.data.elements)); // update the store snapshot for old elements, otherwise we would end up with duplicated fractional indices on undo\n\n this.store.updateSnapshot((0,_utils__WEBPACK_IMPORTED_MODULE_35__.arrayToMap)(elements), this.state);\n this.setState({\n isLoading: true\n });\n this.syncActionResult(Object.assign(Object.assign({}, ret.data), {\n appState: Object.assign(Object.assign({}, ret.data.appState || this.state), {\n isLoading: false\n }),\n replaceFiles: true,\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.CAPTURE\n }));\n } else if (ret.type === _constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.excalidrawlib) {\n await this.library.updateLibrary({\n libraryItems: file,\n merge: true,\n openLibraryMenu: true\n }).catch(error => {\n console.error(error);\n this.setState({\n errorMessage: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.importLibraryError\")\n });\n });\n }\n } catch (error) {\n this.setState({\n isLoading: false,\n errorMessage: error.message\n });\n }\n };\n\n this.handleCanvasContextMenu = event => {\n event.preventDefault();\n\n if ((\"pointerType\" in event.nativeEvent && event.nativeEvent.pointerType === \"touch\" || \"pointerType\" in event.nativeEvent && event.nativeEvent.pointerType === \"pen\" && // always allow if user uses a pen secondary button\n event.button !== _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_BUTTON.SECONDARY) && this.state.activeTool.type !== \"selection\") {\n return;\n }\n\n const {\n x,\n y\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(event, this.state);\n const element = this.getElementAtPosition(x, y, {\n preferSelected: true,\n includeLockedElements: true\n });\n const selectedElements = this.scene.getSelectedElements(this.state);\n const isHittingCommonBoundBox = this.isHittingCommonBoundingBoxOfSelectedElements({\n x,\n y\n }, selectedElements);\n const type = element || isHittingCommonBoundBox ? \"element\" : \"canvas\";\n const container = this.excalidrawContainerRef.current;\n const {\n top: offsetTop,\n left: offsetLeft\n } = container.getBoundingClientRect();\n const left = event.clientX - offsetLeft;\n const top = event.clientY - offsetTop;\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"contextMenu\", \"openContextMenu\", type);\n this.setState(Object.assign(Object.assign({}, element && !this.state.selectedElementIds[element.id] ? Object.assign(Object.assign(Object.assign({}, this.state), (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: this.state.editingGroupId,\n selectedElementIds: {\n [element.id]: true\n }\n }, this.scene.getNonDeletedElements(), this.state, this)), {\n selectedLinearElement: (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(element) ? new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(element) : null\n }) : this.state), {\n showHyperlinkPopup: false\n }), () => {\n this.setState({\n contextMenu: {\n top,\n left,\n items: this.getContextMenuItems(type)\n }\n });\n });\n };\n\n this.maybeDragNewGenericElement = (pointerDownState, event) => {\n var _a, _b, _c, _d, _e;\n\n const draggingElement = this.state.draggingElement;\n const pointerCoords = pointerDownState.lastCoords;\n\n if (!draggingElement) {\n return;\n }\n\n if (draggingElement.type === \"selection\" && this.state.activeTool.type !== \"eraser\") {\n (0,_element__WEBPACK_IMPORTED_MODULE_16__.dragNewElement)(draggingElement, this.state.activeTool.type, pointerDownState.origin.x, pointerDownState.origin.y, pointerCoords.x, pointerCoords.y, (0,_utils__WEBPACK_IMPORTED_MODULE_35__.distance)(pointerDownState.origin.x, pointerCoords.x), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.distance)(pointerDownState.origin.y, pointerCoords.y), (0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldMaintainAspectRatio)(event), (0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldResizeFromCenter)(event), this.state.zoom.value);\n } else {\n let [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerCoords.x, pointerCoords.y, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize);\n const image = (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isInitializedImageElement)(draggingElement) && ((_a = this.imageCache.get(draggingElement.fileId)) === null || _a === void 0 ? void 0 : _a.image);\n const aspectRatio = image && !(image instanceof Promise) ? image.width / image.height : null;\n this.maybeCacheReferenceSnapPoints(event, [draggingElement]);\n const {\n snapOffset,\n snapLines\n } = (0,_snapping__WEBPACK_IMPORTED_MODULE_59__.snapNewElement)(draggingElement, this.state, event, {\n x: pointerDownState.originInGrid.x + ((_c = (_b = this.state.originSnapOffset) === null || _b === void 0 ? void 0 : _b.x) !== null && _c !== void 0 ? _c : 0),\n y: pointerDownState.originInGrid.y + ((_e = (_d = this.state.originSnapOffset) === null || _d === void 0 ? void 0 : _d.y) !== null && _e !== void 0 ? _e : 0)\n }, {\n x: gridX - pointerDownState.originInGrid.x,\n y: gridY - pointerDownState.originInGrid.y\n }, this.scene.getNonDeletedElementsMap());\n gridX += snapOffset.x;\n gridY += snapOffset.y;\n this.setState({\n snapLines\n });\n (0,_element__WEBPACK_IMPORTED_MODULE_16__.dragNewElement)(draggingElement, this.state.activeTool.type, pointerDownState.originInGrid.x, pointerDownState.originInGrid.y, gridX, gridY, (0,_utils__WEBPACK_IMPORTED_MODULE_35__.distance)(pointerDownState.originInGrid.x, gridX), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.distance)(pointerDownState.originInGrid.y, gridY), (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isImageElement)(draggingElement) ? !(0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldMaintainAspectRatio)(event) : (0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldMaintainAspectRatio)(event), (0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldResizeFromCenter)(event), this.state.zoom.value, aspectRatio, this.state.originSnapOffset); // highlight elements that are to be added to frames on frames creation\n\n if (this.state.activeTool.type === _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.frame || this.state.activeTool.type === _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.magicframe) {\n this.setState({\n elementsToHighlight: (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getElementsInResizingFrame)(this.scene.getNonDeletedElements(), draggingElement, this.state, this.scene.getNonDeletedElementsMap())\n });\n }\n }\n };\n\n this.maybeHandleResize = (pointerDownState, event) => {\n const selectedElements = this.scene.getSelectedElements(this.state);\n const selectedFrames = selectedElements.filter(element => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(element));\n const transformHandleType = pointerDownState.resize.handleType;\n\n if (selectedFrames.length > 0 && transformHandleType === \"rotation\") {\n return false;\n }\n\n this.setState({\n // TODO: rename this state field to \"isScaling\" to distinguish\n // it from the generic \"isResizing\" which includes scaling and\n // rotating\n isResizing: transformHandleType && transformHandleType !== \"rotation\",\n isRotating: transformHandleType === \"rotation\",\n activeEmbeddable: null\n });\n const pointerCoords = pointerDownState.lastCoords;\n let [resizeX, resizeY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerCoords.x - pointerDownState.resize.offset.x, pointerCoords.y - pointerDownState.resize.offset.y, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize);\n const frameElementsOffsetsMap = new Map();\n selectedFrames.forEach(frame => {\n const elementsInFrame = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getFrameChildren)(this.scene.getNonDeletedElements(), frame.id);\n elementsInFrame.forEach(element => {\n frameElementsOffsetsMap.set(frame.id + element.id, {\n x: element.x - frame.x,\n y: element.y - frame.y\n });\n });\n }); // check needed for avoiding flickering when a key gets pressed\n // during dragging\n\n if (!this.state.selectedElementsAreBeingDragged) {\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerCoords.x, pointerCoords.y, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize);\n const dragOffset = {\n x: gridX - pointerDownState.originInGrid.x,\n y: gridY - pointerDownState.originInGrid.y\n };\n const originalElements = [...pointerDownState.originalElements.values()];\n this.maybeCacheReferenceSnapPoints(event, selectedElements);\n const {\n snapOffset,\n snapLines\n } = (0,_snapping__WEBPACK_IMPORTED_MODULE_59__.snapResizingElements)(selectedElements, (0,_scene__WEBPACK_IMPORTED_MODULE_29__.getSelectedElements)(originalElements, this.state), this.state, event, dragOffset, transformHandleType);\n resizeX += snapOffset.x;\n resizeY += snapOffset.y;\n this.setState({\n snapLines\n });\n }\n\n if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.transformElements)(pointerDownState.originalElements, transformHandleType, selectedElements, this.scene.getElementsMapIncludingDeleted(), (0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldRotateWithDiscreteAngle)(event), (0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldResizeFromCenter)(event), selectedElements.some(element => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isImageElement)(element)) ? !(0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldMaintainAspectRatio)(event) : (0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldMaintainAspectRatio)(event), resizeX, resizeY, pointerDownState.resize.center.x, pointerDownState.resize.center.y)) {\n const suggestedBindings = (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.getSuggestedBindingsForArrows)(selectedElements, this);\n const elementsToHighlight = new Set();\n selectedFrames.forEach(frame => {\n (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getElementsInResizingFrame)(this.scene.getNonDeletedElements(), frame, this.state, this.scene.getNonDeletedElementsMap()).forEach(element => elementsToHighlight.add(element));\n });\n this.setState({\n elementsToHighlight: [...elementsToHighlight],\n suggestedBindings\n });\n return true;\n }\n\n return false;\n };\n\n this.getContextMenuItems = type => {\n const options = [];\n options.push(_actions__WEBPACK_IMPORTED_MODULE_5__.actionCopyAsPng, _actions__WEBPACK_IMPORTED_MODULE_5__.actionCopyAsSvg); // canvas contextMenu\n // -------------------------------------------------------------------------\n\n if (type === \"canvas\") {\n if (this.state.viewModeEnabled) {\n return [...options, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleGridMode, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleZenMode, _actions_actionToggleViewMode__WEBPACK_IMPORTED_MODULE_40__.actionToggleViewMode, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleStats, _actions_actionCanvas__WEBPACK_IMPORTED_MODULE_55__.actionToggleLaserPointer];\n }\n\n return [_actions_actionClipboard__WEBPACK_IMPORTED_MODULE_53__.actionPaste, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionCopyAsPng, _actions__WEBPACK_IMPORTED_MODULE_5__.actionCopyAsSvg, _actions__WEBPACK_IMPORTED_MODULE_5__.copyText, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionSelectAll, _actions_actionElementLock__WEBPACK_IMPORTED_MODULE_49__.actionUnlockAllElements, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleGridMode, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleObjectsSnapMode, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleZenMode, _actions_actionToggleViewMode__WEBPACK_IMPORTED_MODULE_40__.actionToggleViewMode, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleStats];\n } // element contextMenu\n // -------------------------------------------------------------------------\n\n\n options.push(_actions__WEBPACK_IMPORTED_MODULE_5__.copyText);\n\n if (this.state.viewModeEnabled) {\n return [_actions__WEBPACK_IMPORTED_MODULE_5__.actionCopy, ...options];\n }\n\n return [_ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionCut, _actions__WEBPACK_IMPORTED_MODULE_5__.actionCopy, _actions_actionClipboard__WEBPACK_IMPORTED_MODULE_53__.actionPaste, _actions_actionFrame__WEBPACK_IMPORTED_MODULE_54__.actionSelectAllElementsInFrame, _actions_actionFrame__WEBPACK_IMPORTED_MODULE_54__.actionRemoveAllElementsFromFrame, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, ...options, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionCopyStyles, _actions__WEBPACK_IMPORTED_MODULE_5__.actionPasteStyles, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionGroup, _actions_actionTextAutoResize__WEBPACK_IMPORTED_MODULE_94__.actionTextAutoResize, _actions__WEBPACK_IMPORTED_MODULE_5__.actionUnbindText, _actions__WEBPACK_IMPORTED_MODULE_5__.actionBindText, _actions_actionBoundText__WEBPACK_IMPORTED_MODULE_60__.actionWrapTextInContainer, _actions__WEBPACK_IMPORTED_MODULE_5__.actionUngroup, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionAddToLibrary, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionSendBackward, _actions__WEBPACK_IMPORTED_MODULE_5__.actionBringForward, _actions__WEBPACK_IMPORTED_MODULE_5__.actionSendToBack, _actions__WEBPACK_IMPORTED_MODULE_5__.actionBringToFront, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionFlipHorizontal, _actions__WEBPACK_IMPORTED_MODULE_5__.actionFlipVertical, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleLinearEditor, _actions__WEBPACK_IMPORTED_MODULE_5__.actionLink, _actions__WEBPACK_IMPORTED_MODULE_5__.actionDuplicateSelection, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleElementLock, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionDeleteSelected];\n };\n\n this.handleWheel = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n event.preventDefault();\n\n if (isPanning) {\n return;\n }\n\n const {\n deltaX,\n deltaY\n } = event; // note that event.ctrlKey is necessary to handle pinch zooming\n\n if ( //zsviczian\n (event.metaKey || event.ctrlKey) && !this.state.allowWheelZoom || !(event.metaKey || event.ctrlKey) && this.state.allowWheelZoom) {\n const sign = Math.sign(deltaY);\n const MAX_STEP = _constants__WEBPACK_IMPORTED_MODULE_12__.ZOOM_STEP * 100;\n const absDelta = Math.abs(deltaY);\n let delta = deltaY;\n\n if (absDelta > MAX_STEP) {\n delta = MAX_STEP * sign;\n }\n\n let newZoom = this.state.zoom.value - delta / 100; // increase zoom steps the more zoomed-in we are (applies to >100% only)\n\n newZoom += Math.log10(Math.max(1, this.state.zoom.value)) * -sign * // reduced amplification for small deltas (small movements on a trackpad)\n Math.min(1, absDelta / 20);\n this.translateCanvas(state => Object.assign(Object.assign({}, (0,_scene_zoom__WEBPACK_IMPORTED_MODULE_31__.getStateForZoom)({\n viewportX: this.lastViewportPosition.x,\n viewportY: this.lastViewportPosition.y,\n nextZoom: (0,_scene__WEBPACK_IMPORTED_MODULE_29__.getNormalizedZoom)(newZoom)\n }, state)), {\n shouldCacheIgnoreZoom: true\n }));\n this.resetShouldCacheIgnoreZoomDebounced();\n return;\n } // scroll horizontally when shift pressed\n\n\n if (event.shiftKey) {\n this.translateCanvas(({\n zoom,\n scrollX\n }) => ({\n // on Mac, shift+wheel tends to result in deltaX\n scrollX: scrollX - (deltaY || deltaX) / zoom.value\n }));\n return;\n }\n\n this.translateCanvas(({\n zoom,\n scrollX,\n scrollY\n }) => ({\n scrollX: scrollX - deltaX / zoom.value,\n scrollY: scrollY - deltaY / zoom.value\n }));\n });\n\n this.savePointer = (x, y, button) => {\n var _a, _b;\n\n if (!x || !y) {\n return;\n }\n\n const {\n x: sceneX,\n y: sceneY\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX: x,\n clientY: y\n }, this.state);\n\n if (isNaN(sceneX) || isNaN(sceneY)) {// sometimes the pointer goes off screen\n }\n\n const pointer = {\n x: sceneX,\n y: sceneY,\n tool: this.state.activeTool.type === \"laser\" ? \"laser\" : \"pointer\"\n };\n (_b = (_a = this.props).onPointerUpdate) === null || _b === void 0 ? void 0 : _b.call(_a, {\n pointer,\n button,\n pointersMap: gesture.pointers\n });\n };\n\n this.resetShouldCacheIgnoreZoomDebounced = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.debounce)(() => {\n if (!this.unmounted) {\n this.setState({\n shouldCacheIgnoreZoom: false\n });\n }\n }, 300);\n\n this.updateDOMRect = cb => {\n var _a;\n\n if ((_a = this.excalidrawContainerRef) === null || _a === void 0 ? void 0 : _a.current) {\n const excalidrawContainer = this.excalidrawContainerRef.current;\n const {\n width,\n height,\n left: offsetLeft,\n top: offsetTop\n } = excalidrawContainer.getBoundingClientRect();\n const {\n width: currentWidth,\n height: currentHeight,\n offsetTop: currentOffsetTop,\n offsetLeft: currentOffsetLeft\n } = this.state;\n\n if (width === currentWidth && height === currentHeight && offsetLeft === currentOffsetLeft && offsetTop === currentOffsetTop) {\n if (cb) {\n cb();\n }\n\n return;\n } //zsviczian\n\n\n if (width === 0 || height === 0) {\n if (cb) {\n cb();\n }\n\n return;\n }\n\n this.setState({\n width,\n height,\n offsetLeft,\n offsetTop\n }, () => {\n cb && cb();\n });\n }\n };\n\n this.refresh = () => {\n this.setState(Object.assign({}, this.getCanvasOffsets()));\n };\n\n const defaultAppState = (0,_appState__WEBPACK_IMPORTED_MODULE_10__.getDefaultAppState)();\n const {\n excalidrawAPI,\n viewModeEnabled = false,\n zenModeEnabled = false,\n gridModeEnabled = false,\n objectsSnapModeEnabled = false,\n theme = defaultAppState.theme,\n initState,\n //zsviczian\n obsidianHostPlugin,\n //zsviczian\n name = `${(0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"labels.untitled\")}-${(0,_utils__WEBPACK_IMPORTED_MODULE_35__.getDateTime)()}`\n } = props;\n this.state = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, defaultAppState), {\n theme,\n isLoading: true\n }), this.getCanvasOffsets()), {\n viewModeEnabled,\n zenModeEnabled,\n objectsSnapModeEnabled,\n gridSize: gridModeEnabled ? _constants__WEBPACK_IMPORTED_MODULE_12__.GRID_SIZE : null,\n name,\n width: window.innerWidth,\n height: window.innerHeight\n }), initState !== null && initState !== void 0 ? initState : {});\n this.id = (0,nanoid__WEBPACK_IMPORTED_MODULE_97__.nanoid)();\n hostPlugin = obsidianHostPlugin; //zsviczian\n\n this.library = new _data_library__WEBPACK_IMPORTED_MODULE_14__[\"default\"](this);\n this.actionManager = new _actions_manager__WEBPACK_IMPORTED_MODULE_7__.ActionManager(this.syncActionResult, () => this.state, () => this.scene.getElementsIncludingDeleted(), this);\n this.scene = new _scene_Scene__WEBPACK_IMPORTED_MODULE_30__[\"default\"]();\n this.canvas = document.createElement(\"canvas\");\n this.rc = roughjs_bin_rough__WEBPACK_IMPORTED_MODULE_3__[\"default\"].canvas(this.canvas);\n this.renderer = new _scene_Renderer__WEBPACK_IMPORTED_MODULE_66__.Renderer(this.scene);\n this.store = new _store__WEBPACK_IMPORTED_MODULE_80__.Store();\n this.history = new _history__WEBPACK_IMPORTED_MODULE_24__.History();\n\n if (excalidrawAPI) {\n const api = {\n updateScene: this.updateScene,\n updateLibrary: this.library.updateLibrary,\n addFiles: this.addFiles,\n resetScene: this.resetScene,\n getSceneElementsIncludingDeleted: this.getSceneElementsIncludingDeleted,\n history: {\n clear: this.resetHistory\n },\n scrollToContent: this.scrollToContent,\n zoomToFit: this.zoomToFit,\n startLineEditor: this.startLineEditor,\n getSceneElements: this.getSceneElements,\n getAppState: () => this.state,\n getFiles: () => this.files,\n getName: this.getName,\n registerAction: action => {\n this.actionManager.registerAction(action);\n },\n refresh: this.refresh,\n setToast: this.setToast,\n updateContainerSize: this.updateContainerSize,\n id: this.id,\n setLocalFont: this.setLocalFont,\n selectElements: this.selectElements,\n sendBackward: this.sendBackward,\n bringForward: this.bringForward,\n sendToBack: this.sendToBack,\n bringToFront: this.bringToFront,\n setMobileModeAllowed: this.setMobileModeAllowed,\n setActiveTool: this.setActiveTool,\n setCursor: this.setCursor,\n resetCursor: this.resetCursor,\n updateFrameRendering: this.updateFrameRendering,\n toggleSidebar: this.toggleSidebar,\n getHTMLIFrameElement: id => this.getHTMLIFrameElement(id),\n onChange: cb => this.onChangeEmitter.on(cb),\n onPointerDown: cb => this.onPointerDownEmitter.on(cb),\n onPointerUp: cb => this.onPointerUpEmitter.on(cb),\n onScrollChange: cb => this.onScrollChangeEmitter.on(cb),\n onUserFollow: cb => this.onUserFollowEmitter.on(cb)\n };\n\n if (typeof excalidrawAPI === \"function\") {\n excalidrawAPI(api);\n } else {\n console.error(\"excalidrawAPI should be a function!\");\n }\n }\n\n this.excalidrawContainerValue = {\n container: this.excalidrawContainerRef.current,\n id: this.id\n };\n this.fonts = new _scene_Fonts__WEBPACK_IMPORTED_MODULE_50__.Fonts({\n scene: this.scene\n });\n this.history = new _history__WEBPACK_IMPORTED_MODULE_24__.History();\n this.actionManager.registerAll(_actions_register__WEBPACK_IMPORTED_MODULE_8__.actions);\n this.actionManager.registerAction((0,_actions_actionHistory__WEBPACK_IMPORTED_MODULE_6__.createUndoAction)(this.history, this.store));\n this.actionManager.registerAction((0,_actions_actionHistory__WEBPACK_IMPORTED_MODULE_6__.createRedoAction)(this.history, this.store));\n }\n\n onWindowMessage(event) {\n if (event.origin !== \"https://player.vimeo.com\" && event.origin !== \"https://www.youtube.com\") {\n return;\n }\n\n let data = null;\n\n try {\n data = JSON.parse(event.data);\n } catch (e) {}\n\n if (!data) {\n return;\n }\n\n switch (event.origin) {\n case \"https://player.vimeo.com\":\n //Allowing for multiple instances of Excalidraw running in the window\n if (data.method === \"paused\") {\n let source = null;\n const iframes = document.body.querySelectorAll(\"iframe.excalidraw__embeddable\");\n\n if (!iframes) {\n break;\n }\n\n for (const iframe of iframes) {\n if (iframe.contentWindow === event.source) {\n source = iframe.contentWindow;\n }\n }\n\n source === null || source === void 0 ? void 0 : source.postMessage(JSON.stringify({\n method: data.value ? \"play\" : \"pause\",\n value: true\n }), \"*\");\n }\n\n break;\n\n case \"https://www.youtube.com\":\n if (data.event === \"infoDelivery\" && data.info && data.id && typeof data.info.playerState === \"number\") {\n const id = data.id;\n const playerState = data.info.playerState;\n\n if (Object.values(_constants__WEBPACK_IMPORTED_MODULE_12__.YOUTUBE_STATES).includes(playerState)) {\n YOUTUBE_VIDEO_STATES.set(id, playerState);\n }\n }\n\n break;\n }\n }\n\n cacheEmbeddableRef(element, ref) {\n if (ref) {\n this.iFrameRefs.set(element.id, ref);\n }\n }\n\n getHTMLIFrameElement(element) {\n if (typeof element === \"string\") {\n //zsviczian\n return this.iFrameRefs.get(element);\n }\n\n return this.iFrameRefs.get(element.id);\n }\n\n handleEmbeddableCenterClick(element) {\n var _a, _b, _c, _d;\n\n if (((_a = this.state.activeEmbeddable) === null || _a === void 0 ? void 0 : _a.element) === element && ((_b = this.state.activeEmbeddable) === null || _b === void 0 ? void 0 : _b.state) === \"active\") {\n return;\n } // The delay serves two purposes\n // 1. To prevent first click propagating to iframe on mobile,\n // else the click will immediately start and stop the video\n // 2. If the user double clicks the frame center to activate it\n // without the delay youtube will immediately open the video\n // in fullscreen mode\n\n\n setTimeout(() => {\n this.setState({\n activeEmbeddable: {\n element,\n state: \"active\"\n },\n selectedElementIds: {\n [element.id]: true\n },\n draggingElement: null,\n selectionElement: null\n });\n }, 100);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeElement)(element)) {\n return;\n }\n\n const iframe = this.getHTMLIFrameElement(element);\n\n if (!(iframe === null || iframe === void 0 ? void 0 : iframe.contentWindow)) {\n return;\n }\n\n if (iframe.src.includes(\"youtube\")) {\n const state = YOUTUBE_VIDEO_STATES.get(element.id);\n\n if (!state) {\n YOUTUBE_VIDEO_STATES.set(element.id, _constants__WEBPACK_IMPORTED_MODULE_12__.YOUTUBE_STATES.UNSTARTED);\n iframe.contentWindow.postMessage(JSON.stringify({\n event: \"listening\",\n id: element.id\n }), \"*\");\n }\n\n switch (state) {\n case _constants__WEBPACK_IMPORTED_MODULE_12__.YOUTUBE_STATES.PLAYING:\n case _constants__WEBPACK_IMPORTED_MODULE_12__.YOUTUBE_STATES.BUFFERING:\n (_c = iframe.contentWindow) === null || _c === void 0 ? void 0 : _c.postMessage(JSON.stringify({\n event: \"command\",\n func: \"pauseVideo\",\n args: \"\"\n }), \"*\");\n break;\n\n default:\n (_d = iframe.contentWindow) === null || _d === void 0 ? void 0 : _d.postMessage(JSON.stringify({\n event: \"command\",\n func: \"playVideo\",\n args: \"\"\n }), \"*\");\n }\n }\n\n if (iframe.src.includes(\"player.vimeo.com\")) {\n iframe.contentWindow.postMessage(JSON.stringify({\n method: \"paused\" //video play/pause in onWindowMessage handler\n\n }), \"*\");\n }\n }\n\n isIframeLikeElementCenter(el, event, sceneX, sceneY) {\n var _a, _b;\n\n return el && !event.altKey && !event.shiftKey && !event.metaKey && !event.ctrlKey && (((_a = this.state.activeEmbeddable) === null || _a === void 0 ? void 0 : _a.element) !== el || ((_b = this.state.activeEmbeddable) === null || _b === void 0 ? void 0 : _b.state) === \"hover\" || !this.state.activeEmbeddable) && sceneX >= el.x + el.width / 3 && sceneX <= el.x + 2 * el.width / 3 && sceneY >= el.y + el.height / 3 && sceneY <= el.y + 2 * el.height / 3;\n }\n\n renderEmbeddables() {\n const scale = this.state.zoom.value;\n const normalizedWidth = this.state.width;\n const normalizedHeight = this.state.height;\n const embeddableElements = this.scene.getNonDeletedElements().filter(el => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(el) && this.embedsValidationStatus.get(el.id) === true || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeElement)(el));\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {\n children: embeddableElements.map(el => {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;\n\n const {\n x,\n y\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.sceneCoordsToViewportCoords)({\n sceneX: el.x,\n sceneY: el.y\n }, this.state);\n const isVisible = (0,_element_sizeHelpers__WEBPACK_IMPORTED_MODULE_27__.isElementInViewport)(el, normalizedWidth, normalizedHeight, this.state, this.scene.getNonDeletedElementsMap());\n const hasBeenInitialized = this.initializedEmbeds.has(el.id);\n\n if (isVisible && !hasBeenInitialized) {\n this.initializedEmbeds.add(el.id);\n }\n\n const shouldRender = isVisible || hasBeenInitialized;\n\n if (!shouldRender) {\n return null;\n }\n\n let src;\n const embedLink = (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.getEmbedLink)((0,_data_url__WEBPACK_IMPORTED_MODULE_47__.toValidURL)(el.link || \"\")); //zsviczian\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeElement)(el)) {\n src = null;\n const data = ((_b = (_a = el.customData) === null || _a === void 0 ? void 0 : _a.generationData) !== null && _b !== void 0 ? _b : this.magicGenerations.get(el.id)) || {\n status: \"error\",\n message: \"No generation data\",\n code: \"ERR_NO_GENERATION_DATA\"\n };\n\n if (data.status === \"done\") {\n const html = data.html;\n src = {\n intrinsicSize: {\n w: el.width,\n h: el.height\n },\n type: \"document\",\n srcdoc: () => {\n return html;\n }\n };\n } else if (data.status === \"pending\") {\n src = {\n intrinsicSize: {\n w: el.width,\n h: el.height\n },\n type: \"document\",\n srcdoc: () => {\n return (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.createSrcDoc)(`\n <style>\n html, body {\n width: 100%;\n height: 100%;\n color: ${this.state.theme === _constants__WEBPACK_IMPORTED_MODULE_12__.THEME.DARK ? \"white\" : \"black\"};\n }\n body {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n gap: 1rem;\n }\n\n .Spinner {\n display: flex;\n align-items: center;\n justify-content: center;\n margin-left: auto;\n margin-right: auto;\n }\n\n .Spinner svg {\n animation: rotate 1.6s linear infinite;\n transform-origin: center center;\n width: 40px;\n height: 40px;\n }\n\n .Spinner circle {\n stroke: currentColor;\n animation: dash 1.6s linear 0s infinite;\n stroke-linecap: round;\n }\n\n @keyframes rotate {\n 100% {\n transform: rotate(360deg);\n }\n }\n\n @keyframes dash {\n 0% {\n stroke-dasharray: 1, 300;\n stroke-dashoffset: 0;\n }\n 50% {\n stroke-dasharray: 150, 300;\n stroke-dashoffset: -200;\n }\n 100% {\n stroke-dasharray: 1, 300;\n stroke-dashoffset: -280;\n }\n }\n </style>\n <div class=\"Spinner\">\n <svg\n viewBox=\"0 0 100 100\"\n >\n <circle\n cx=\"50\"\n cy=\"50\"\n r=\"46\"\n stroke-width=\"8\"\n fill=\"none\"\n stroke-miter-limit=\"10\"\n />\n </svg>\n </div>\n <div>Generating...</div>\n `);\n }\n };\n } else {\n let message;\n\n if (data.code === \"ERR_GENERATION_INTERRUPTED\") {\n message = \"Generation was interrupted...\";\n } else {\n message = data.message || \"Generation failed\";\n }\n\n src = {\n intrinsicSize: {\n w: el.width,\n h: el.height\n },\n type: \"document\",\n srcdoc: () => {\n return (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.createSrcDoc)(`\n <style>\n html, body {\n height: 100%;\n }\n body {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n color: ${_colors__WEBPACK_IMPORTED_MODULE_74__.COLOR_PALETTE.red[3]};\n }\n h1, h3 {\n margin-top: 0;\n margin-bottom: 0.5rem;\n }\n </style>\n <h1>Error!</h1>\n <h3>${message}</h3>\n `);\n }\n };\n }\n } else {\n src = embedLink; //zsviczian getEmbedLink(toValidURL(el.link || \"\"));\n }\n\n const isActive = ((_c = this.state.activeEmbeddable) === null || _c === void 0 ? void 0 : _c.element) === el && ((_d = this.state.activeEmbeddable) === null || _d === void 0 ? void 0 : _d.state) === \"active\";\n const isHovered = ((_e = this.state.activeEmbeddable) === null || _e === void 0 ? void 0 : _e.element) === el && ((_f = this.state.activeEmbeddable) === null || _f === void 0 ? void 0 : _f.state) === \"hover\";\n const isWebview = //zsviczian\n !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeElement)(el) && this.props.renderWebview && (embedLink === null || embedLink === void 0 ? void 0 : embedLink.type) !== \"document\" && !((_h = (_g = embedLink === null || embedLink === void 0 ? void 0 : embedLink.link) === null || _g === void 0 ? void 0 : _g.startsWith) === null || _h === void 0 ? void 0 : _h.call(_g, \"https://player.vimeo.com\")); // Modify the scale based on el.scale property\n\n const [xScale, yScale] = (_j = el.scale) !== null && _j !== void 0 ? _j : [1, 1]; //zsviczian\n\n const scaledTransform = `scale(${scale * xScale}, ${scale * yScale})`;\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: (0,clsx__WEBPACK_IMPORTED_MODULE_4__[\"default\"])(\"excalidraw__embeddable-container\", {\n \"is-hovered\": isHovered\n }),\n style: {\n transform: isVisible ? `translate(${x - this.state.offsetLeft}px, ${y - this.state.offsetTop}px) ${scaledTransform}` : \"none\",\n display: isVisible ? \"block\" : \"none\",\n opacity: (0,_renderer_renderElement__WEBPACK_IMPORTED_MODULE_85__.getRenderOpacity)(el, (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getContainingFrame)(el, this.scene.getNonDeletedElementsMap()), this.elementsPendingErasure),\n [\"--embeddable-radius\"]: `${(0,_math__WEBPACK_IMPORTED_MODULE_28__.getCornerRadius)(Math.min(el.width, el.height), el) / xScale //zsviczian\n }px`\n }\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n //this is a hack that addresses isse with embedded excalidraw.com embeddable\n //https://github.com/excalidraw/excalidraw/pull/6691#issuecomment-1607383938\n\n /*ref={(ref) => {\r\n if (!this.excalidrawContainerRef.current) {\r\n return;\r\n }\r\n const container = this.excalidrawContainerRef.current;\r\n const sh = container.scrollHeight;\r\n const ch = container.clientHeight;\r\n if (sh !== ch) {\r\n container.style.height = `${sh}px`;\r\n setTimeout(() => {\r\n container.style.height = `100%`;\r\n });\r\n }\r\n }}*/\n className: \"excalidraw__embeddable-container__inner\",\n style: {\n width: isVisible ? `${el.width / xScale}px` : 0,\n height: isVisible ? `${el.height / yScale}px` : 0,\n transform: isVisible ? `rotate(${el.angle}rad)` : \"none\",\n pointerEvents: isActive ? _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_EVENTS.enabled : _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_EVENTS.disabled\n }\n }, {\n children: [isHovered && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: \"excalidraw__embeddable-hint\"\n }, {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"buttons.embeddableInteractionButton\")\n })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: \"excalidraw__embeddable__outer\",\n style: {\n padding: `${el.strokeWidth / (4 * el.scale[0])}px` //zsviczian MDEmbeddable round border cutoff issue\n\n }\n }, {\n children: (_m = (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(el) ? (_l = (_k = this.props).renderEmbeddable) === null || _l === void 0 ? void 0 : _l.call(_k, el, this.state) //zsviczian\n : null) !== null && _m !== void 0 ? _m : isWebview ? //zsviczian\n (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"webview\", {\n ref: ref => this.cacheEmbeddableRef(el, ref),\n className: \"excalidraw__embeddable\",\n src: (embedLink === null || embedLink === void 0 ? void 0 : embedLink.type) === \"generic\" || (embedLink === null || embedLink === void 0 ? void 0 : embedLink.type) === \"video\" ? embedLink.link : \"\",\n title: \"Excalidraw Embedded Content\",\n allowFullScreen: true\n }) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"iframe\", {\n ref: ref => this.cacheEmbeddableRef(el, ref),\n className: \"excalidraw__embeddable\",\n srcDoc: (src === null || src === void 0 ? void 0 : src.type) === \"document\" ? src.srcdoc(this.state.theme) : undefined,\n src: (src === null || src === void 0 ? void 0 : src.type) !== \"document\" ? (_o = src === null || src === void 0 ? void 0 : src.link) !== null && _o !== void 0 ? _o : \"\" : undefined,\n // https://stackoverflow.com/q/18470015\n scrolling: \"no\",\n referrerPolicy: \"no-referrer-when-downgrade\",\n title: \"Excalidraw Embedded Content\",\n allow: \"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\",\n allowFullScreen: true,\n sandbox: `${((_p = src === null || src === void 0 ? void 0 : src.sandbox) === null || _p === void 0 ? void 0 : _p.allowSameOrigin) ? \"allow-same-origin\" : \"\"} allow-scripts allow-forms allow-popups allow-popups-to-escape-sandbox allow-presentation allow-downloads`\n })\n }))]\n }))\n }), el.id);\n })\n });\n }\n\n toggleOverscrollBehavior(event) {\n // when pointer inside editor, disable overscroll behavior to prevent\n // panning to trigger history back/forward on MacOS Chrome\n document.documentElement.style.overscrollBehaviorX = event.type === \"pointerenter\" ? \"none\" : \"auto\";\n }\n\n render() {\n var _a, _b, _c, _d, _e, _f, _g, _h;\n\n const selectedElements = this.scene.getSelectedElements(this.state);\n const {\n renderTopRightUI,\n renderCustomStats\n } = this.props;\n const sceneNonce = this.scene.getSceneNonce();\n const {\n elementsMap,\n visibleElements\n } = this.renderer.getRenderableElements({\n sceneNonce,\n zoom: this.state.zoom,\n offsetLeft: this.state.offsetLeft,\n offsetTop: this.state.offsetTop,\n scrollX: this.state.scrollX,\n scrollY: this.state.scrollY,\n height: this.state.height,\n width: this.state.width,\n editingElement: this.state.editingElement,\n pendingImageElementId: this.state.pendingImageElementId\n });\n const allElementsMap = this.scene.getNonDeletedElementsMap();\n const shouldBlockPointerEvents = !(this.state.editingElement && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(this.state.editingElement)) && (this.state.selectionElement || this.state.draggingElement || this.state.resizingElement || this.state.activeTool.type === \"laser\" && // technically we can just test on this once we make it more safe\n this.state.cursorButton === \"down\" || this.state.editingElement && !(0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(this.state.editingElement));\n const firstSelectedElement = selectedElements[0];\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: (0,clsx__WEBPACK_IMPORTED_MODULE_4__[\"default\"])(\"excalidraw excalidraw-container\", {\n \"excalidraw--view-mode\": this.state.viewModeEnabled,\n \"excalidraw--mobile\": this.device.editor.isMobile || !(this.state.viewModeEnabled || this.state.zenModeEnabled) && this.state.trayModeEnabled //zsviczian\n\n }),\n style: Object.assign({\n //zsviczian\n [\"--ui-pointerEvents\"]: shouldBlockPointerEvents ? _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_EVENTS.disabled : _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_EVENTS.enabled\n }, this.state.dynamicStyle),\n ref: this.excalidrawContainerRef,\n onDrop: this.handleAppOnDrop,\n tabIndex: 0,\n onKeyDown: this.props.handleKeyboardGlobally ? undefined : this.onKeyDown,\n onPointerEnter: this.toggleOverscrollBehavior,\n onPointerLeave: this.toggleOverscrollBehavior\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(AppContext.Provider, Object.assign({\n value: this\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(AppPropsContext.Provider, Object.assign({\n value: this.props\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(ExcalidrawContainerContext.Provider, Object.assign({\n value: this.excalidrawContainerValue\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(DeviceContext.Provider, Object.assign({\n value: this.device\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(ExcalidrawSetAppStateContext.Provider, Object.assign({\n value: this.setAppState\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(ExcalidrawAppStateContext.Provider, Object.assign({\n value: this.state\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(ExcalidrawElementsContext.Provider, Object.assign({\n value: this.scene.getNonDeletedElements()\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(ExcalidrawActionManagerContext.Provider, Object.assign({\n value: this.actionManager\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_LayerUI__WEBPACK_IMPORTED_MODULE_38__[\"default\"], Object.assign({\n canvas: this.canvas,\n appState: this.state,\n files: this.files,\n setAppState: this.setAppState,\n actionManager: this.actionManager,\n elements: this.scene.getNonDeletedElements(),\n onLockToggle: this.toggleLock,\n onPenModeToggle: this.togglePenMode,\n onHandToolToggle: this.onHandToolToggle,\n langCode: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.getLanguage)().code,\n renderTopRightUI: renderTopRightUI,\n renderCustomStats: renderCustomStats,\n showExitZenModeBtn: typeof ((_a = this.props) === null || _a === void 0 ? void 0 : _a.zenModeEnabled) === \"undefined\" && this.state.zenModeEnabled,\n UIOptions: this.props.UIOptions,\n onExportImage: this.onExportImage,\n renderWelcomeScreen: !this.state.isLoading && this.state.showWelcomeScreen && this.state.activeTool.type === \"selection\" && !this.state.zenModeEnabled && !this.scene.getElementsIncludingDeleted().length,\n app: this,\n isCollaborating: this.props.isCollaborating,\n openAIKey: this.OPENAI_KEY,\n isOpenAIKeyPersisted: this.OPENAI_KEY_IS_PERSISTED,\n onOpenAIAPIKeyChange: this.onOpenAIKeyChange,\n onMagicSettingsConfirm: this.onMagicSettingsConfirm\n }, {\n children: this.props.children\n })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", {\n className: \"excalidraw-textEditorContainer\"\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", {\n className: \"excalidraw-contextMenuContainer\"\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", {\n className: \"excalidraw-eye-dropper-container\"\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_SVGLayer__WEBPACK_IMPORTED_MODULE_68__.SVGLayer, {\n trails: [this.laserTrails, this.eraserTrail]\n }), selectedElements.length === 1 && this.state.showHyperlinkPopup && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_hyperlink_Hyperlink__WEBPACK_IMPORTED_MODULE_46__.Hyperlink, {\n element: firstSelectedElement,\n elementsMap: allElementsMap,\n setAppState: this.setAppState,\n onLinkOpen: this.props.onLinkOpen,\n setToast: this.setToast,\n updateEmbedValidationStatus: this.updateEmbedValidationStatus\n }, firstSelectedElement.id), this.props.aiEnabled !== false && selectedElements.length === 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isMagicFrameElement)(firstSelectedElement) && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_element_ElementCanvasButtons__WEBPACK_IMPORTED_MODULE_71__.ElementCanvasButtons, Object.assign({\n element: firstSelectedElement,\n elementsMap: elementsMap\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MagicButton__WEBPACK_IMPORTED_MODULE_75__.ElementCanvasButton, {\n title: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"labels.convertToCode\"),\n icon: _icons__WEBPACK_IMPORTED_MODULE_76__.MagicIcon,\n checked: false,\n onChange: () => this.onMagicFrameGenerate(firstSelectedElement, \"button\")\n })\n })), selectedElements.length === 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeElement)(firstSelectedElement) && ((_c = (_b = firstSelectedElement.customData) === null || _b === void 0 ? void 0 : _b.generationData) === null || _c === void 0 ? void 0 : _c.status) === \"done\" && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_element_ElementCanvasButtons__WEBPACK_IMPORTED_MODULE_71__.ElementCanvasButtons, Object.assign({\n element: firstSelectedElement,\n elementsMap: elementsMap\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MagicButton__WEBPACK_IMPORTED_MODULE_75__.ElementCanvasButton, {\n title: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"labels.copySource\"),\n icon: _icons__WEBPACK_IMPORTED_MODULE_76__.copyIcon,\n checked: false,\n onChange: () => this.onIframeSrcCopy(firstSelectedElement)\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MagicButton__WEBPACK_IMPORTED_MODULE_75__.ElementCanvasButton, {\n title: \"Enter fullscreen\",\n icon: _icons__WEBPACK_IMPORTED_MODULE_76__.fullscreenIcon,\n checked: false,\n onChange: () => {\n const iframe = this.getHTMLIFrameElement(firstSelectedElement);\n\n if (iframe) {\n try {\n iframe.requestFullscreen();\n this.setState({\n activeEmbeddable: {\n element: firstSelectedElement,\n state: \"active\"\n },\n selectedElementIds: {\n [firstSelectedElement.id]: true\n },\n draggingElement: null,\n selectionElement: null\n });\n } catch (err) {\n console.warn(err);\n this.setState({\n errorMessage: \"Couldn't enter fullscreen\"\n });\n }\n }\n }\n })]\n })), this.state.toast !== null && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Toast__WEBPACK_IMPORTED_MODULE_39__.Toast, {\n message: this.state.toast.message,\n onClose: () => this.setToast(null),\n duration: this.state.toast.duration,\n closable: this.state.toast.closable\n }), this.state.contextMenu && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ContextMenu__WEBPACK_IMPORTED_MODULE_37__.ContextMenu, {\n items: this.state.contextMenu.items,\n top: this.state.contextMenu.top,\n left: this.state.contextMenu.left,\n actionManager: this.actionManager,\n onClose: callback => {\n this.setState({\n contextMenu: null\n }, () => {\n this.focusContainer();\n callback === null || callback === void 0 ? void 0 : callback();\n });\n }\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_canvases__WEBPACK_IMPORTED_MODULE_65__.StaticCanvas, {\n canvas: this.canvas,\n rc: this.rc,\n elementsMap: elementsMap,\n allElementsMap: allElementsMap,\n visibleElements: visibleElements,\n sceneNonce: sceneNonce,\n selectionNonce: (_d = this.state.selectionElement) === null || _d === void 0 ? void 0 : _d.versionNonce,\n scale: window.devicePixelRatio,\n appState: this.state,\n renderConfig: {\n imageCache: this.imageCache,\n isExporting: false,\n renderGrid: true,\n canvasBackgroundColor: this.state.viewBackgroundColor,\n embedsValidationStatus: this.embedsValidationStatus,\n elementsPendingErasure: this.elementsPendingErasure\n }\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_canvases__WEBPACK_IMPORTED_MODULE_65__.InteractiveCanvas, {\n containerRef: this.excalidrawContainerRef,\n canvas: this.interactiveCanvas,\n elementsMap: elementsMap,\n visibleElements: visibleElements,\n allElementsMap: allElementsMap,\n selectedElements: selectedElements,\n sceneNonce: sceneNonce,\n selectionNonce: (_e = this.state.selectionElement) === null || _e === void 0 ? void 0 : _e.versionNonce,\n scale: window.devicePixelRatio,\n appState: this.state,\n device: this.device,\n renderInteractiveSceneCallback: this.renderInteractiveSceneCallback,\n handleCanvasRef: this.handleInteractiveCanvasRef,\n onContextMenu: this.handleCanvasContextMenu,\n onPointerMove: this.handleCanvasPointerMove,\n onPointerUp: this.handleCanvasPointerUp,\n onPointerCancel: this.removePointer,\n onTouchMove: this.handleTouchMove,\n onPointerDown: this.handleCanvasPointerDown,\n onDoubleClick: this.handleCanvasDoubleClick\n }), this.state.userToFollow && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_FollowMode_FollowMode__WEBPACK_IMPORTED_MODULE_78__[\"default\"], {\n width: this.state.width,\n height: this.state.height,\n userToFollow: this.state.userToFollow,\n onDisconnect: this.maybeUnfollowRemoteUser\n }), this.renderFrameNames(), ((_f = this.state.activeEmbeddable) === null || _f === void 0 ? void 0 : _f.state) === \"active\" && ( //zsviczian\n (_h = (_g = this.props).renderEmbeddableMenu) === null || _h === void 0 ? void 0 : _h.call(_g, this.state))]\n })), this.renderEmbeddables()]\n }))\n }))\n }))\n }))\n }))\n }))\n }))\n }));\n }\n\n getTextFromElements(elements) {\n const text = elements.reduce((acc, element) => {\n if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(element)) {\n acc.push(element.text);\n }\n\n return acc;\n }, []).join(\"\\n\\n\");\n return text;\n }\n\n async onMagicFrameGenerate(magicFrame, source) {\n var _a;\n\n if (!this.OPENAI_KEY) {\n this.setToast({\n message: \"You must first configure your OpenAI API key in plugin settings\",\n duration: 5000\n });\n return;\n this.setState({\n openDialog: {\n name: \"settings\",\n tab: \"diagram-to-code\",\n source: \"generation\"\n }\n });\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"ai\", \"generate (missing key)\", \"d2c\");\n return;\n }\n\n const magicFrameChildren = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getElementsOverlappingFrame)(this.scene.getNonDeletedElements(), magicFrame).filter(el => !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isMagicFrameElement)(el));\n\n if (!magicFrameChildren.length) {\n if (source === \"button\") {\n this.setState({\n errorMessage: \"Cannot generate from an empty frame\"\n });\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"ai\", \"generate (no-children)\", \"d2c\");\n } else {\n this.setActiveTool({\n type: \"magicframe\"\n });\n }\n\n return;\n }\n\n const frameElement = this.insertIframeElement({\n sceneX: magicFrame.x + magicFrame.width + 30,\n sceneY: magicFrame.y,\n width: magicFrame.width,\n height: magicFrame.height\n });\n\n if (!frameElement) {\n return;\n }\n\n this.updateMagicGeneration({\n frameElement,\n data: {\n status: \"pending\"\n }\n });\n this.setState({\n selectedElementIds: {\n [frameElement.id]: true\n }\n });\n const blob = await (0,_utils_export__WEBPACK_IMPORTED_MODULE_73__.exportToBlob)({\n elements: this.scene.getNonDeletedElements(),\n appState: Object.assign(Object.assign({}, this.state), {\n exportBackground: true,\n viewBackgroundColor: this.state.viewBackgroundColor\n }),\n exportingFrame: magicFrame,\n files: this.files\n });\n const dataURL = await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.getDataURL)(blob);\n const textFromFrameChildren = this.getTextFromElements(magicFrameChildren);\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"ai\", \"generate (start)\", \"d2c\");\n const result = await (0,_data_magic__WEBPACK_IMPORTED_MODULE_72__.diagramToHTML)({\n image: dataURL,\n apiKey: this.OPENAI_KEY,\n text: textFromFrameChildren,\n theme: this.state.theme\n });\n\n if (!result.ok) {\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"ai\", \"generate (failed)\", \"d2c\");\n console.error(result.error);\n this.updateMagicGeneration({\n frameElement,\n data: {\n status: \"error\",\n code: \"ERR_OAI\",\n message: ((_a = result.error) === null || _a === void 0 ? void 0 : _a.message) || \"Unknown error during generation\"\n }\n });\n return;\n }\n\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"ai\", \"generate (success)\", \"d2c\");\n\n if (result.choices[0].message.content == null) {\n this.updateMagicGeneration({\n frameElement,\n data: {\n status: \"error\",\n code: \"ERR_OAI\",\n message: \"Nothing genereated :(\"\n }\n });\n return;\n }\n\n const message = result.choices[0].message.content;\n const html = message.slice(message.indexOf(\"<!DOCTYPE html>\"), message.indexOf(\"</html>\") + \"</html>\".length);\n this.updateMagicGeneration({\n frameElement,\n data: {\n status: \"done\",\n html\n }\n });\n }\n\n onIframeSrcCopy(element) {\n var _a, _b;\n\n if (((_b = (_a = element.customData) === null || _a === void 0 ? void 0 : _a.generationData) === null || _b === void 0 ? void 0 : _b.status) === \"done\") {\n (0,_clipboard__WEBPACK_IMPORTED_MODULE_11__.copyTextToSystemClipboard)(element.customData.generationData.html);\n this.setToast({\n message: \"copied to clipboard\",\n closable: false,\n duration: 1500\n });\n }\n } //zsviczian - ugly hack\n\n\n get OPENAI_KEY() {\n var _a;\n\n return (_a = hostPlugin === null || hostPlugin === void 0 ? void 0 : hostPlugin.settings) === null || _a === void 0 ? void 0 : _a.openAIAPIToken;\n }\n\n set OPENAI_KEY(value) {\n return;\n }\n\n async componentDidMount() {\n var _a;\n\n this.unmounted = false;\n this.excalidrawContainerValue.container = this.excalidrawContainerRef.current;\n\n if (\"development\" === _constants__WEBPACK_IMPORTED_MODULE_12__.ENV.TEST || \"development\" !== \"production\") {\n const setState = this.setState.bind(this);\n Object.defineProperties(window.h, {\n state: {\n configurable: true,\n get: () => {\n return this.state;\n }\n },\n setState: {\n configurable: true,\n value: (...args) => {\n return this.setState(...args);\n }\n },\n app: {\n configurable: true,\n value: this\n },\n history: {\n configurable: true,\n value: this.history\n },\n store: {\n configurable: true,\n value: this.store\n }\n });\n }\n\n this.store.onStoreIncrementEmitter.on(increment => {\n this.history.record(increment.elementsChange, increment.appStateChange);\n });\n this.scene.onUpdate(this.triggerRender);\n this.addEventListeners();\n\n if (this.props.autoFocus && this.excalidrawContainerRef.current) {\n this.focusContainer();\n }\n\n if ( // bounding rects don't work in tests so updating\n // the state on init would result in making the test enviro run\n // in mobile breakpoint (0 width/height), making everything fail\n !(0,_utils__WEBPACK_IMPORTED_MODULE_35__.isTestEnv)()) {\n this.refreshViewportBreakpoints();\n this.refreshEditorBreakpoints();\n }\n\n if (_constants__WEBPACK_IMPORTED_MODULE_12__.supportsResizeObserver && this.excalidrawContainerRef.current) {\n this.resizeObserver = new ResizeObserver(() => {\n this.refreshEditorBreakpoints();\n this.updateDOMRect();\n });\n (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.observe(this.excalidrawContainerRef.current);\n }\n\n const searchParams = new URLSearchParams(window.location.search.slice(1));\n\n if (searchParams.has(\"web-share-target\")) {\n // Obtain a file that was shared via the Web Share Target API.\n this.restoreFileFromShare();\n } else {\n this.updateDOMRect(this.initializeScene);\n } // note that this check seems to always pass in localhost\n\n\n if ((0,_constants__WEBPACK_IMPORTED_MODULE_12__.isBrave)() && !(0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.isMeasureTextSupported)()) {\n this.setState({\n errorMessage: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_BraveMeasureTextError__WEBPACK_IMPORTED_MODULE_61__[\"default\"], {})\n });\n }\n }\n\n componentWillUnmount() {\n var _a;\n\n this.renderer.destroy();\n this.scene = new _scene_Scene__WEBPACK_IMPORTED_MODULE_30__[\"default\"]();\n this.fonts = new _scene_Fonts__WEBPACK_IMPORTED_MODULE_50__.Fonts({\n scene: this.scene\n });\n this.renderer = new _scene_Renderer__WEBPACK_IMPORTED_MODULE_66__.Renderer(this.scene);\n this.files = {};\n this.imageCache.clear();\n (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();\n this.unmounted = true;\n this.removeEventListeners();\n this.scene.destroy();\n this.library.destroy();\n this.laserTrails.stop();\n this.eraserTrail.stop();\n this.onChangeEmitter.clear();\n this.store.onStoreIncrementEmitter.clear();\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_67__.ShapeCache.destroy();\n _snapping__WEBPACK_IMPORTED_MODULE_59__.SnapCache.destroy();\n clearTimeout(touchTimeout);\n _scene__WEBPACK_IMPORTED_MODULE_29__.isSomeElementSelected.clearCache();\n _groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements.clearCache();\n touchTimeout = 0;\n document.documentElement.style.overscrollBehaviorX = \"\";\n }\n\n removeEventListeners() {\n this.onRemoveEventListenersEmitter.trigger();\n }\n\n addEventListeners() {\n // remove first as we can add event listeners multiple times\n this.removeEventListeners(); // -------------------------------------------------------------------------\n // view+edit mode listeners\n // -------------------------------------------------------------------------\n\n if (this.props.handleKeyboardGlobally) {\n this.onRemoveEventListenersEmitter.once((0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.KEYDOWN, this.onKeyDown, false));\n }\n\n this.onRemoveEventListenersEmitter.once((0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(this.excalidrawContainerRef.current, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.WHEEL, this.onWheel, {\n passive: false\n }), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(window, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.MESSAGE, this.onWindowMessage, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, this.removePointer), // #3553\n (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.COPY, this.onCopy), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.KEYUP, this.onKeyUp, {\n passive: true\n }), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_MOVE, this.updateCurrentCursorPosition), // rerender text elements on font load to fix #637 && #1553\n (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document.fonts, \"loadingdone\", event => {\n const loadedFontFaces = event.fontfaces;\n this.fonts.onFontsLoaded(loadedFontFaces);\n }), // Safari-only desktop pinch zoom\n (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.GESTURE_START, this.onGestureStart, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.GESTURE_CHANGE, this.onGestureChange, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.GESTURE_END, this.onGestureEnd, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(window, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.FOCUS, () => {\n this.maybeCleanupAfterMissingPointerUp(null); // browsers (chrome?) tend to free up memory a lot, which results\n // in canvas context being cleared. Thus re-render on focus.\n\n this.triggerRender(true);\n }));\n\n if (this.state.viewModeEnabled) {\n return;\n } // -------------------------------------------------------------------------\n // edit-mode listeners only\n // -------------------------------------------------------------------------\n\n\n this.onRemoveEventListenersEmitter.once((0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.FULLSCREENCHANGE, this.onFullscreenChange), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.PASTE, this.pasteFromClipboard), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.CUT, this.onCut), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(window, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.RESIZE, this.onResize, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(window, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.UNLOAD, this.onUnload, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(window, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.BLUR, this.onBlur, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(this.excalidrawContainerRef.current, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.DRAG_OVER, this.disableEvent, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(this.excalidrawContainerRef.current, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.DROP, this.disableEvent, false));\n\n if (this.props.detectScroll) {\n this.onRemoveEventListenersEmitter.once((0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)((0,_utils__WEBPACK_IMPORTED_MODULE_35__.getNearestScrollableContainer)(this.excalidrawContainerRef.current), _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.SCROLL, this.onScroll));\n }\n }\n\n componentDidUpdate(prevProps, prevState) {\n var _a, _b, _c, _d, _e, _f;\n\n this.updateEmbeddables();\n const elements = this.scene.getElementsIncludingDeleted();\n const elementsMap = this.scene.getElementsMapIncludingDeleted();\n const nonDeletedElementsMap = this.scene.getNonDeletedElementsMap();\n\n if (!this.state.showWelcomeScreen && !elements.length) {\n this.setState({\n showWelcomeScreen: true\n });\n }\n\n if (prevProps.UIOptions.dockedSidebarBreakpoint !== this.props.UIOptions.dockedSidebarBreakpoint) {\n this.refreshEditorBreakpoints();\n }\n\n const hasFollowedPersonLeft = prevState.userToFollow && !this.state.collaborators.has(prevState.userToFollow.socketId);\n\n if (hasFollowedPersonLeft) {\n this.maybeUnfollowRemoteUser();\n }\n\n if (prevState.zoom.value !== this.state.zoom.value || prevState.scrollX !== this.state.scrollX || prevState.scrollY !== this.state.scrollY) {\n (_b = (_a = this.props) === null || _a === void 0 ? void 0 : _a.onScrollChange) === null || _b === void 0 ? void 0 : _b.call(_a, this.state.scrollX, this.state.scrollY, this.state.zoom);\n this.onScrollChangeEmitter.trigger(this.state.scrollX, this.state.scrollY, this.state.zoom);\n }\n\n if (prevState.userToFollow !== this.state.userToFollow) {\n if (prevState.userToFollow) {\n this.onUserFollowEmitter.trigger({\n userToFollow: prevState.userToFollow,\n action: \"UNFOLLOW\"\n });\n }\n\n if (this.state.userToFollow) {\n this.onUserFollowEmitter.trigger({\n userToFollow: this.state.userToFollow,\n action: \"FOLLOW\"\n });\n }\n }\n\n if (Object.keys(this.state.selectedElementIds).length && (0,_appState__WEBPACK_IMPORTED_MODULE_10__.isEraserActive)(this.state)) {\n this.setState({\n activeTool: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, {\n type: \"selection\"\n })\n });\n }\n\n if (this.state.activeTool.type === \"eraser\" && prevState.theme !== this.state.theme) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setEraserCursor)(this.interactiveCanvas, this.state.theme);\n } // Hide hyperlink popup if shown when element type is not selection\n\n\n if (prevState.activeTool.type === \"selection\" && this.state.activeTool.type !== \"selection\" && this.state.showHyperlinkPopup) {\n this.setState({\n showHyperlinkPopup: false\n });\n }\n\n if (prevProps.langCode !== this.props.langCode) {\n this.updateLanguage();\n }\n\n if ((0,_appState__WEBPACK_IMPORTED_MODULE_10__.isEraserActive)(prevState) && !(0,_appState__WEBPACK_IMPORTED_MODULE_10__.isEraserActive)(this.state)) {\n this.eraserTrail.endPath();\n }\n\n if (prevProps.viewModeEnabled !== this.props.viewModeEnabled) {\n this.setState({\n viewModeEnabled: !!this.props.viewModeEnabled\n });\n }\n\n if (prevState.viewModeEnabled !== this.state.viewModeEnabled) {\n this.addEventListeners();\n this.deselectElements();\n }\n\n if (prevProps.zenModeEnabled !== this.props.zenModeEnabled) {\n this.setState({\n zenModeEnabled: !!this.props.zenModeEnabled\n });\n }\n\n if (prevProps.theme !== this.props.theme && this.props.theme) {\n this.setState({\n theme: this.props.theme\n });\n }\n\n if (prevProps.gridModeEnabled !== this.props.gridModeEnabled) {\n this.setState({\n gridSize: this.props.gridModeEnabled ? _constants__WEBPACK_IMPORTED_MODULE_12__.GRID_SIZE : null\n });\n }\n\n (_c = this.excalidrawContainerRef.current) === null || _c === void 0 ? void 0 : _c.classList.toggle(\"theme--dark\", this.state.theme === _constants__WEBPACK_IMPORTED_MODULE_12__.THEME.DARK);\n\n if (this.state.editingLinearElement && !this.state.selectedElementIds[this.state.editingLinearElement.elementId]) {\n // defer so that the storeAction flag isn't reset via current update\n setTimeout(() => {\n // execute only if the condition still holds when the deferred callback\n // executes (it can be scheduled multiple times depending on how\n // many times the component renders)\n this.state.editingLinearElement && this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n });\n } // failsafe in case the state is being updated in incorrect order resulting\n // in the editingElement being now a deleted element\n\n\n if ((_d = this.state.editingElement) === null || _d === void 0 ? void 0 : _d.isDeleted) {\n this.setState({\n editingElement: null\n });\n }\n\n if (this.state.selectedLinearElement && !this.state.selectedElementIds[this.state.selectedLinearElement.elementId]) {\n // To make sure `selectedLinearElement` is in sync with `selectedElementIds`, however this shouldn't be needed once\n // we have a single API to update `selectedElementIds`\n this.setState({\n selectedLinearElement: null\n });\n }\n\n const {\n multiElement\n } = prevState;\n\n if (prevState.activeTool !== this.state.activeTool && multiElement != null && (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.isBindingEnabled)(this.state) && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBindingElement)(multiElement, false)) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.maybeBindLinearElement)(multiElement, this.state, (0,_utils__WEBPACK_IMPORTED_MODULE_35__.tupleToCoors)(_element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.getPointAtIndexGlobalCoordinates(multiElement, -1, nonDeletedElementsMap)), this);\n }\n\n this.store.commit(elementsMap, this.state); // Do not notify consumers if we're still loading the scene. Among other\n // potential issues, this fixes a case where the tab isn't focused during\n // init, which would trigger onChange with empty elements, which would then\n // override whatever is in localStorage currently.\n\n if (!this.state.isLoading) {\n (_f = (_e = this.props).onChange) === null || _f === void 0 ? void 0 : _f.call(_e, elements, this.state, this.files);\n this.onChangeEmitter.trigger(elements, this.state, this.files);\n }\n }\n\n static resetTapTwice() {\n didTapTwice = false;\n } // TODO rewrite this to paste both text & images at the same time if\n // pasted data contains both\n\n\n async addElementsFromMixedContentPaste(mixedContent, {\n isPlainPaste,\n sceneX,\n sceneY\n }) {\n if (!isPlainPaste && mixedContent.some(node => node.type === \"imageUrl\") && this.isToolSupported(\"image\")) {\n const imageURLs = mixedContent.filter(node => node.type === \"imageUrl\").map(node => node.value);\n const responses = await Promise.all(imageURLs.map(async url => {\n try {\n return {\n file: await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.ImageURLToFile)(url)\n };\n } catch (error) {\n let errorMessage = error.message;\n\n if (error.cause === \"FETCH_ERROR\") {\n errorMessage = (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.failedToFetchImage\");\n } else if (error.cause === \"UNSUPPORTED\") {\n errorMessage = (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.unsupportedFileType\");\n }\n\n return {\n errorMessage\n };\n }\n }));\n let y = sceneY;\n let firstImageYOffsetDone = false;\n const nextSelectedIds = {};\n\n for (const response of responses) {\n if (response.file) {\n const imageElement = this.createImageElement({\n sceneX,\n sceneY: y\n });\n const initializedImageElement = await this.insertImageElement(imageElement, response.file);\n\n if (initializedImageElement) {\n // vertically center first image in the batch\n if (!firstImageYOffsetDone) {\n firstImageYOffsetDone = true;\n y -= initializedImageElement.height / 2;\n } // hack to reset the `y` coord because we vertically center during\n // insertImageElement\n\n\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(initializedImageElement, {\n y\n }, false);\n y = imageElement.y + imageElement.height + 25;\n nextSelectedIds[imageElement.id] = true;\n }\n }\n }\n\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(nextSelectedIds, this.state)\n });\n const error = responses.find(response => !!response.errorMessage);\n\n if (error && error.errorMessage) {\n this.setState({\n errorMessage: error.errorMessage\n });\n }\n } else {\n const textNodes = mixedContent.filter(node => node.type === \"text\");\n\n if (textNodes.length) {\n this.addTextFromPaste(textNodes.map(node => node.value).join(\"\\n\\n\"), isPlainPaste);\n }\n }\n }\n\n addTextFromPaste(text, isPlainPaste = false) {\n const {\n x,\n y\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX: this.lastViewportPosition.x,\n clientY: this.lastViewportPosition.y\n }, this.state);\n const textElementProps = {\n x,\n y,\n strokeColor: this.state.currentItemStrokeColor,\n backgroundColor: this.state.currentItemBackgroundColor,\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roundness: null,\n roughness: this.state.currentItemRoughness,\n opacity: this.state.currentItemOpacity,\n text,\n rawText: text,\n fontSize: (0,_actions_actionProperties__WEBPACK_IMPORTED_MODULE_79__.getFontSize)(this.state.currentItemFontSize, this.state.zoom.value),\n fontFamily: this.state.currentItemFontFamily,\n textAlign: _constants__WEBPACK_IMPORTED_MODULE_12__.DEFAULT_TEXT_ALIGN,\n verticalAlign: _constants__WEBPACK_IMPORTED_MODULE_12__.DEFAULT_VERTICAL_ALIGN,\n locked: false\n };\n const fontString = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.getFontString)({\n fontSize: textElementProps.fontSize,\n fontFamily: textElementProps.fontFamily\n });\n const lineHeight = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getDefaultLineHeight)(textElementProps.fontFamily);\n const [x1,, x2] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_95__.getVisibleSceneBounds)(this.state); // long texts should not go beyond 800 pixels in width nor should it go below 200 px\n\n const maxTextWidth = Math.max(Math.min((x2 - x1) * 0.5, 800), 200);\n const LINE_GAP = 10;\n let currentY = y;\n const lines = isPlainPaste ? [text] : text.split(\"\\n\");\n const textElements = lines.reduce((acc, line, idx) => {\n var _a;\n\n const originalText = line.trim();\n\n if (originalText.length) {\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords({\n x,\n y: currentY\n });\n let metrics = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.measureText)(originalText, fontString, lineHeight);\n const isTextWrapped = metrics.width > maxTextWidth;\n const text = isTextWrapped ? (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.wrapText)(originalText, fontString, maxTextWidth) : originalText;\n metrics = isTextWrapped ? (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.measureText)(text, fontString, lineHeight) : metrics;\n const startX = x - metrics.width / 2;\n const startY = currentY - metrics.height / 2;\n const element = (0,_element__WEBPACK_IMPORTED_MODULE_16__.newTextElement)(Object.assign(Object.assign({}, textElementProps), {\n x: startX,\n y: startY,\n text,\n rawText: originalText,\n //zsviczian\n originalText,\n lineHeight,\n autoResize: !isTextWrapped,\n frameId: topLayerFrame ? topLayerFrame.id : null\n }));\n acc.push(element);\n currentY += element.height + LINE_GAP;\n } else {\n const prevLine = (_a = lines[idx - 1]) === null || _a === void 0 ? void 0 : _a.trim(); // add paragraph only if previous line was not empty, IOW don't add\n // more than one empty line\n\n if (prevLine) {\n currentY += (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getLineHeightInPx)(textElementProps.fontSize, lineHeight) + LINE_GAP;\n }\n }\n\n return acc;\n }, []);\n\n if (textElements.length === 0) {\n return;\n }\n\n this.scene.insertElements(textElements);\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(Object.fromEntries(textElements.map(el => [el.id, true])), this.state)\n });\n\n if (!isPlainPaste && textElements.length > 1 && PLAIN_PASTE_TOAST_SHOWN === false && !this.device.editor.isMobile) {\n this.setToast({\n message: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"toast.pasteAsSingleElement\", {\n shortcut: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.getShortcutKey)(\"CtrlOrCmd+Shift+V\")\n }),\n duration: 5000\n });\n PLAIN_PASTE_TOAST_SHOWN = true;\n }\n\n this.store.shouldCaptureIncrement();\n }\n\n handleTextWysiwyg(element, {\n isExistingElement = false\n }) {\n const elementsMap = this.scene.getElementsMapIncludingDeleted();\n\n const updateElement = (nextOriginalText, isDeleted, rawText, //zsviczian\n link) => {\n this.scene.replaceAllElements([// Not sure why we include deleted elements as well hence using deleted elements map\n ...this.scene.getElementsIncludingDeleted().map(_element => {\n if (_element.id === element.id && (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(_element)) {\n return (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.newElementWith)(_element, Object.assign({\n originalText: nextOriginalText,\n rawText: rawText !== null && rawText !== void 0 ? rawText : nextOriginalText,\n //zsviczian\n link,\n isDeleted: isDeleted !== null && isDeleted !== void 0 ? isDeleted : _element.isDeleted\n }, (0,_element__WEBPACK_IMPORTED_MODULE_16__.refreshTextDimensions)(_element, (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getContainerElement)(_element, elementsMap), elementsMap, nextOriginalText)));\n }\n\n return _element;\n })]);\n }; //zsviczian\n\n\n if (isExistingElement && this.props.onBeforeTextEdit) {\n const text = this.props.onBeforeTextEdit(element);\n\n if (text && text !== element.originalText) {\n this.scene.replaceAllElements([...this.scene.getElementsIncludingDeleted().map(_element => {\n if (_element.id === element.id && (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(_element)) {\n //changing the value of element so this gets edited by textWysiwyg\n element = (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.newElementWith)(_element, Object.assign({\n originalText: text,\n rawText: text,\n isDeleted: false\n }, (0,_element__WEBPACK_IMPORTED_MODULE_16__.refreshTextDimensions)(_element, (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getContainerElement)(_element, elementsMap), elementsMap, text)));\n return element;\n }\n\n return _element;\n })]);\n }\n }\n\n (0,_element_textWysiwyg__WEBPACK_IMPORTED_MODULE_88__.textWysiwyg)({\n id: element.id,\n canvas: this.canvas,\n getViewportCoords: (x, y) => {\n const {\n x: viewportX,\n y: viewportY\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.sceneCoordsToViewportCoords)({\n sceneX: x,\n sceneY: y\n }, this.state);\n return [viewportX - this.state.offsetLeft, viewportY - this.state.offsetTop];\n },\n onChange: (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(nextOriginalText => {\n updateElement(nextOriginalText, false);\n\n if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.isNonDeletedElement)(element)) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.updateBoundElements)(element, elementsMap);\n }\n }),\n onSubmit: (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(({\n viaKeyboard,\n nextOriginalText\n }) => {\n var _a;\n\n const isDeleted = !nextOriginalText.trim(); //zsviczian insert start\n\n const rawText = nextOriginalText; //should this be originalText??\n\n let link = undefined;\n\n if (this.props.onBeforeTextSubmit) {\n const _element = this.scene.getElementsIncludingDeleted().find(el => el.id === element.id && (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(el));\n\n if (_element) {\n const dismensionsData = (0,_element__WEBPACK_IMPORTED_MODULE_16__.refreshTextDimensions)(_element, (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getContainerElement)(_element, elementsMap), elementsMap, nextOriginalText);\n const {\n updatedNextOriginalText,\n nextLink\n } = this.props.onBeforeTextSubmit(element, (_a = dismensionsData === null || dismensionsData === void 0 ? void 0 : dismensionsData.text) !== null && _a !== void 0 ? _a : nextOriginalText, //should never be undefined\n nextOriginalText, isDeleted);\n nextOriginalText = updatedNextOriginalText !== null && updatedNextOriginalText !== void 0 ? updatedNextOriginalText : nextOriginalText;\n link = nextLink;\n }\n } //zsviczian insert end\n\n\n updateElement(nextOriginalText, isDeleted, rawText, link); //zsviczian (added rawText, link, text)\n // select the created text element only if submitting via keyboard\n // (when submitting via click it should act as signal to deselect)\n\n if (!isDeleted && viaKeyboard) {\n const elementIdToSelect = element.containerId ? element.containerId : element.id;\n this.setState(prevState => ({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(Object.assign(Object.assign({}, prevState.selectedElementIds), {\n [elementIdToSelect]: true\n }), prevState)\n }));\n }\n\n if (isDeleted) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.fixBindingsAfterDeletion)(this.scene.getNonDeletedElements(), [element]);\n }\n\n if (!isDeleted || isExistingElement) {\n this.store.shouldCaptureIncrement();\n }\n\n this.setState({\n draggingElement: null,\n editingElement: null\n });\n\n if (this.state.activeTool.locked) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n }\n\n this.focusContainer();\n }),\n element,\n excalidrawContainer: this.excalidrawContainerRef.current,\n app: this,\n // when text is selected, it's hard (at least on iOS) to re-position the\n // caret (i.e. deselect). There's not much use for always selecting\n // the text on edit anyway (and users can select-all from contextmenu\n // if needed)\n autoSelect: !this.device.isTouchScreen\n }); // deselect all other elements when inserting text\n\n this.deselectElements(); // do an initial update to re-initialize element position since we were\n // modifying element's x/y for sake of editor (case: syncing to remote)\n\n updateElement(element.originalText, false);\n }\n\n deselectElements() {\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n selectedGroupIds: {},\n editingGroupId: null,\n activeEmbeddable: null\n });\n }\n\n getTextElementAtPosition(x, y) {\n const element = this.getElementAtPosition(x, y, {\n includeBoundTextElement: true\n });\n\n if (element && (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(element) && !element.isDeleted) {\n return element;\n }\n\n return null;\n }\n /**\r\n * get the pure geometric shape of an excalidraw element\r\n * which is then used for hit detection\r\n */\n\n\n getElementShape(element) {\n var _a, _b;\n\n switch (element.type) {\n case \"rectangle\":\n case \"diamond\":\n case \"frame\":\n case \"magicframe\":\n case \"embeddable\":\n case \"image\":\n case \"iframe\":\n case \"text\":\n case \"selection\":\n return (0,_utils_geometry_shape__WEBPACK_IMPORTED_MODULE_33__.getPolygonShape)(element);\n\n case \"arrow\":\n case \"line\":\n {\n const roughShape = (_b = (_a = _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_67__.ShapeCache.get(element)) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_67__.ShapeCache.generateElementShape(element, null)[0];\n const [,,,, cx, cy] = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getElementAbsoluteCoords)(element, this.scene.getNonDeletedElementsMap());\n return (0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.shouldTestInside)(element) ? (0,_utils_geometry_shape__WEBPACK_IMPORTED_MODULE_33__.getClosedCurveShape)(element, roughShape, [element.x, element.y], element.angle, [cx, cy]) : (0,_utils_geometry_shape__WEBPACK_IMPORTED_MODULE_33__.getCurveShape)(roughShape, [element.x, element.y], element.angle, [cx, cy]);\n }\n\n case \"ellipse\":\n return (0,_utils_geometry_shape__WEBPACK_IMPORTED_MODULE_33__.getEllipseShape)(element);\n\n case \"freedraw\":\n {\n const [,,,, cx, cy] = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getElementAbsoluteCoords)(element, this.scene.getNonDeletedElementsMap());\n return (0,_utils_geometry_shape__WEBPACK_IMPORTED_MODULE_33__.getFreedrawShape)(element, [cx, cy], (0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.shouldTestInside)(element));\n }\n }\n }\n\n getBoundTextShape(element) {\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getBoundTextElement)(element, this.scene.getNonDeletedElementsMap());\n\n if (boundTextElement) {\n if (element.type === \"arrow\") {\n return this.getElementShape(Object.assign(Object.assign({}, boundTextElement), _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.getBoundTextElementPosition(element, boundTextElement, this.scene.getNonDeletedElementsMap())));\n }\n\n return this.getElementShape(boundTextElement);\n }\n\n return null;\n }\n\n getElementAtPosition(x, y, opts) {\n const allHitElements = this.getElementsAtPosition(x, y, opts === null || opts === void 0 ? void 0 : opts.includeBoundTextElement, opts === null || opts === void 0 ? void 0 : opts.includeLockedElements);\n\n if (allHitElements.length > 1) {\n if (opts === null || opts === void 0 ? void 0 : opts.preferSelected) {\n for (let index = allHitElements.length - 1; index > -1; index--) {\n if (this.state.selectedElementIds[allHitElements[index].id]) {\n return allHitElements[index];\n }\n }\n }\n\n const elementWithHighestZIndex = allHitElements[allHitElements.length - 1]; // If we're hitting element with highest z-index only on its bounding box\n // while also hitting other element figure, the latter should be considered.\n\n return (0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.hitElementItself)({\n x,\n y,\n element: elementWithHighestZIndex,\n shape: this.getElementShape(elementWithHighestZIndex),\n // when overlapping, we would like to be more precise\n // this also avoids the need to update past tests\n threshold: this.getElementHitThreshold() / 2,\n frameNameBound: (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(elementWithHighestZIndex) ? this.frameNameBoundsCache.get(elementWithHighestZIndex) : null\n }) ? elementWithHighestZIndex : allHitElements[allHitElements.length - 2];\n }\n\n if (allHitElements.length === 1) {\n return allHitElements[0];\n }\n\n return null;\n }\n\n getElementsAtPosition(x, y, includeBoundTextElement = false, includeLockedElements = false) {\n const iframeLikes = [];\n const elementsMap = this.scene.getNonDeletedElementsMap();\n const elements = (includeBoundTextElement && includeLockedElements ? this.scene.getNonDeletedElements() : this.scene.getNonDeletedElements().filter(element => (includeLockedElements || !element.locked) && (includeBoundTextElement || !((0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(element) && element.containerId)))).filter(el => this.hitElement(x, y, el)).filter(element => {\n // hitting a frame's element from outside the frame is not considered a hit\n const containingFrame = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getContainingFrame)(element, elementsMap);\n return containingFrame && this.state.frameRendering.enabled && this.state.frameRendering.clip ? (0,_frame__WEBPACK_IMPORTED_MODULE_51__.isCursorInFrame)({\n x,\n y\n }, containingFrame, elementsMap) : true;\n }).filter(el => {\n // The parameter elements comes ordered from lower z-index to higher.\n // We want to preserve that order on the returned array.\n // Exception being embeddables which should be on top of everything else in\n // terms of hit testing.\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeElement)(el)) {\n iframeLikes.push(el);\n return false;\n }\n\n return true;\n }).concat(iframeLikes);\n return elements;\n }\n\n getElementHitThreshold() {\n return _constants__WEBPACK_IMPORTED_MODULE_12__.DEFAULT_COLLISION_THRESHOLD / this.state.zoom.value;\n }\n\n hitElement(x, y, element, considerBoundingBox = true) {\n // if the element is selected, then hit test is done against its bounding box\n if (considerBoundingBox && this.state.selectedElementIds[element.id] && (0,_element_transformHandles__WEBPACK_IMPORTED_MODULE_48__.shouldShowBoundingBox)([element], this.state)) {\n const selectionShape = (0,_utils_geometry_shape__WEBPACK_IMPORTED_MODULE_33__.getSelectionBoxShape)(element, this.scene.getNonDeletedElementsMap(), this.getElementHitThreshold());\n return (0,_utils_collision__WEBPACK_IMPORTED_MODULE_34__.isPointInShape)([x, y], selectionShape);\n } // take bound text element into consideration for hit collision as well\n\n\n const hitBoundTextOfElement = (0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.hitElementBoundText)(x, y, this.getBoundTextShape(element));\n\n if (hitBoundTextOfElement) {\n return true;\n }\n\n return (0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.hitElementItself)({\n x,\n y,\n element,\n shape: this.getElementShape(element),\n threshold: this.getElementHitThreshold(),\n frameNameBound: (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(element) ? this.frameNameBoundsCache.get(element) : null\n });\n }\n\n getTextBindableContainerAtPosition(x, y) {\n const elements = this.scene.getNonDeletedElements();\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (selectedElements.length === 1) {\n return (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isTextBindableContainer)(selectedElements[0], false) ? selectedElements[0] : null;\n }\n\n let hitElement = null; // We need to do hit testing from front (end of the array) to back (beginning of the array)\n\n for (let index = elements.length - 1; index >= 0; --index) {\n if (elements[index].isDeleted) {\n continue;\n }\n\n const [x1, y1, x2, y2] = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getElementAbsoluteCoords)(elements[index], this.scene.getNonDeletedElementsMap());\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isArrowElement)(elements[index]) && (0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.hitElementItself)({\n x,\n y,\n element: elements[index],\n shape: this.getElementShape(elements[index]),\n threshold: this.getElementHitThreshold()\n })) {\n hitElement = elements[index];\n break;\n } else if (x1 < x && x < x2 && y1 < y && y < y2) {\n hitElement = elements[index];\n break;\n }\n }\n\n return (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isTextBindableContainer)(hitElement, false) ? hitElement : null;\n }\n\n handleHoverSelectedLinearElement(linearElementEditor, scenePointerX, scenePointerY) {\n const elementsMap = this.scene.getNonDeletedElementsMap();\n const element = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.getElement(linearElementEditor.elementId, elementsMap);\n\n if (!element) {\n return;\n }\n\n if (this.state.selectedLinearElement) {\n let hoverPointIndex = -1;\n let segmentMidPointHoveredCoords = null;\n\n if ((0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.hitElementItself)({\n x: scenePointerX,\n y: scenePointerY,\n element,\n shape: this.getElementShape(element)\n })) {\n hoverPointIndex = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.getPointIndexUnderCursor(element, elementsMap, this.state.zoom, scenePointerX, scenePointerY);\n segmentMidPointHoveredCoords = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.getSegmentMidpointHitCoords(linearElementEditor, {\n x: scenePointerX,\n y: scenePointerY\n }, this.state, this.scene.getNonDeletedElementsMap());\n\n if (hoverPointIndex >= 0 || segmentMidPointHoveredCoords) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.POINTER);\n } else if (this.hitElement(scenePointerX, scenePointerY, element)) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.MOVE);\n }\n } else if (this.hitElement(scenePointerX, scenePointerY, element)) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.MOVE);\n }\n\n if (this.state.selectedLinearElement.hoverPointIndex !== hoverPointIndex) {\n this.setState({\n selectedLinearElement: Object.assign(Object.assign({}, this.state.selectedLinearElement), {\n hoverPointIndex\n })\n });\n }\n\n if (!_element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.arePointsEqual(this.state.selectedLinearElement.segmentMidPointHoveredCoords, segmentMidPointHoveredCoords)) {\n this.setState({\n selectedLinearElement: Object.assign(Object.assign({}, this.state.selectedLinearElement), {\n segmentMidPointHoveredCoords\n })\n });\n }\n } else {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.AUTO);\n }\n }\n\n updateGestureOnPointerDown(event) {\n gesture.pointers.set(event.pointerId, {\n x: event.clientX,\n y: event.clientY\n });\n\n if (gesture.pointers.size === 2) {\n gesture.lastCenter = (0,_gesture__WEBPACK_IMPORTED_MODULE_22__.getCenter)(gesture.pointers);\n gesture.initialScale = this.state.zoom.value;\n gesture.initialDistance = (0,_gesture__WEBPACK_IMPORTED_MODULE_22__.getDistance)(Array.from(gesture.pointers.values()));\n }\n }\n\n initialPointerDownState(event) {\n const origin = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(event, this.state);\n const selectedElements = this.scene.getSelectedElements(this.state);\n const [minX, minY, maxX, maxY] = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getCommonBounds)(selectedElements);\n return {\n origin,\n withCmdOrCtrl: event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD],\n originInGrid: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.tupleToCoors)((0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(origin.x, origin.y, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize)),\n scrollbars: (0,_scene_scrollbars__WEBPACK_IMPORTED_MODULE_89__.isOverScrollBars)(currentScrollBars, event.clientX - this.state.offsetLeft, event.clientY - this.state.offsetTop),\n // we need to duplicate because we'll be updating this state\n lastCoords: Object.assign({}, origin),\n originalElements: this.scene.getNonDeletedElements().reduce((acc, element) => {\n acc.set(element.id, (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.deepCopyElement)(element));\n return acc;\n }, new Map()),\n resize: {\n handleType: false,\n isResizing: false,\n offset: {\n x: 0,\n y: 0\n },\n arrowDirection: \"origin\",\n center: {\n x: (maxX + minX) / 2,\n y: (maxY + minY) / 2\n }\n },\n hit: {\n element: null,\n allHitElements: [],\n wasAddedToSelection: false,\n hasBeenDuplicated: false,\n hasHitCommonBoundingBoxOfSelectedElements: this.isHittingCommonBoundingBoxOfSelectedElements(origin, selectedElements)\n },\n drag: {\n hasOccurred: false,\n offset: null\n },\n eventListeners: {\n onMove: null,\n onUp: null,\n onKeyUp: null,\n onKeyDown: null\n },\n boxSelection: {\n hasOccurred: false\n }\n };\n } // Returns whether the event is a dragging a scrollbar\n\n\n handleDraggingScrollBar(event, pointerDownState) {\n if (!(pointerDownState.scrollbars.isOverEither && !this.state.multiElement)) {\n return false;\n }\n\n isDraggingScrollBar = true;\n pointerDownState.lastCoords.x = event.clientX;\n pointerDownState.lastCoords.y = event.clientY;\n const onPointerMove = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdatesThrottled)(event => {\n const target = event.target;\n\n if (!(target instanceof HTMLElement)) {\n return;\n }\n\n this.handlePointerMoveOverScrollbars(event, pointerDownState);\n });\n const onPointerUp = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(() => {\n lastPointerUp = null;\n isDraggingScrollBar = false;\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n this.setState({\n cursorButton: \"up\"\n });\n this.savePointer(event.clientX, event.clientY, \"up\");\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_MOVE, onPointerMove);\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, onPointerUp);\n onPointerMove.flush();\n });\n lastPointerUp = onPointerUp;\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_MOVE, onPointerMove);\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, onPointerUp);\n return true;\n }\n\n isASelectedElement(hitElement) {\n return hitElement != null && this.state.selectedElementIds[hitElement.id];\n }\n\n isHittingCommonBoundingBoxOfSelectedElements(point, selectedElements) {\n if (selectedElements.length < 2) {\n return false;\n } // How many pixels off the shape boundary we still consider a hit\n\n\n const threshold = this.getElementHitThreshold();\n const [x1, y1, x2, y2] = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getCommonBounds)(selectedElements);\n return point.x > x1 - threshold && point.x < x2 + threshold && point.y > y1 - threshold && point.y < y2 + threshold;\n }\n\n getCurrentItemRoundness(elementType) {\n return this.state.currentItemRoundness === \"round\" ? {\n type: (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isUsingAdaptiveRadius)(elementType) ? _constants__WEBPACK_IMPORTED_MODULE_12__.ROUNDNESS.ADAPTIVE_RADIUS : _constants__WEBPACK_IMPORTED_MODULE_12__.ROUNDNESS.PROPORTIONAL_RADIUS\n } : null;\n }\n\n maybeCacheReferenceSnapPoints(event, selectedElements, recomputeAnyways = false) {\n if ((0,_snapping__WEBPACK_IMPORTED_MODULE_59__.isSnappingEnabled)({\n event,\n appState: this.state,\n selectedElements\n }) && (recomputeAnyways || !_snapping__WEBPACK_IMPORTED_MODULE_59__.SnapCache.getReferenceSnapPoints())) {\n _snapping__WEBPACK_IMPORTED_MODULE_59__.SnapCache.setReferenceSnapPoints((0,_snapping__WEBPACK_IMPORTED_MODULE_59__.getReferenceSnapPoints)(this.scene.getNonDeletedElements(), selectedElements, this.state, this.scene.getNonDeletedElementsMap()));\n }\n }\n\n maybeCacheVisibleGaps(event, selectedElements, recomputeAnyways = false) {\n if ((0,_snapping__WEBPACK_IMPORTED_MODULE_59__.isSnappingEnabled)({\n event,\n appState: this.state,\n selectedElements\n }) && (recomputeAnyways || !_snapping__WEBPACK_IMPORTED_MODULE_59__.SnapCache.getVisibleGaps())) {\n _snapping__WEBPACK_IMPORTED_MODULE_59__.SnapCache.setVisibleGaps((0,_snapping__WEBPACK_IMPORTED_MODULE_59__.getVisibleGaps)(this.scene.getNonDeletedElements(), selectedElements, this.state, this.scene.getNonDeletedElementsMap()));\n }\n }\n\n onKeyDownFromPointerDownHandler(pointerDownState) {\n return (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n if (this.maybeHandleResize(pointerDownState, event)) {\n return;\n }\n\n this.maybeDragNewGenericElement(pointerDownState, event);\n });\n }\n\n onKeyUpFromPointerDownHandler(pointerDownState) {\n return (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n // Prevents focus from escaping excalidraw tab\n event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ALT && event.preventDefault();\n\n if (this.maybeHandleResize(pointerDownState, event)) {\n return;\n }\n\n this.maybeDragNewGenericElement(pointerDownState, event);\n });\n }\n\n onPointerMoveFromPointerDownHandler(pointerDownState) {\n return (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdatesThrottled)(event => {\n var _a, _b; //To avoid pointerMove canceling the selection of locked elements on mobile //zsviczian\n\n\n if (Boolean(this.state.contextMenu)) {\n return;\n } // We need to initialize dragOffsetXY only after we've updated\n // `state.selectedElementIds` on pointerDown. Doing it here in pointerMove\n // event handler should hopefully ensure we're already working with\n // the updated state.\n\n\n if (pointerDownState.drag.offset === null) {\n pointerDownState.drag.offset = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.tupleToCoors)((0,_element__WEBPACK_IMPORTED_MODULE_16__.getDragOffsetXY)(this.scene.getSelectedElements(this.state), pointerDownState.origin.x, pointerDownState.origin.y));\n }\n\n const target = event.target;\n\n if (!(target instanceof HTMLElement)) {\n return;\n }\n\n if (this.handlePointerMoveOverScrollbars(event, pointerDownState)) {\n return;\n }\n\n const pointerCoords = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(event, this.state);\n\n if ((0,_appState__WEBPACK_IMPORTED_MODULE_10__.isEraserActive)(this.state)) {\n this.handleEraser(event, pointerDownState, pointerCoords);\n return;\n }\n\n if (this.state.activeTool.type === \"laser\") {\n this.laserTrails.addPointToPath(pointerCoords.x, pointerCoords.y);\n }\n\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerCoords.x, pointerCoords.y, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize); // for arrows/lines, don't start dragging until a given threshold\n // to ensure we don't create a 2-point arrow by mistake when\n // user clicks mouse in a way that it moves a tiny bit (thus\n // triggering pointermove)\n\n if (!pointerDownState.drag.hasOccurred && (this.state.activeTool.type === \"arrow\" || this.state.activeTool.type === \"line\")) {\n if ((0,_math__WEBPACK_IMPORTED_MODULE_28__.distance2d)(pointerCoords.x, pointerCoords.y, pointerDownState.origin.x, pointerDownState.origin.y) < _constants__WEBPACK_IMPORTED_MODULE_12__.DRAGGING_THRESHOLD) {\n return;\n }\n }\n\n if (pointerDownState.resize.isResizing) {\n pointerDownState.lastCoords.x = pointerCoords.x;\n pointerDownState.lastCoords.y = pointerCoords.y;\n\n if (this.maybeHandleResize(pointerDownState, event)) {\n return true;\n }\n }\n\n const elementsMap = this.scene.getNonDeletedElementsMap();\n\n if (this.state.selectedLinearElement) {\n const linearElementEditor = this.state.editingLinearElement || this.state.selectedLinearElement;\n\n if (_element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.shouldAddMidpoint(this.state.selectedLinearElement, pointerCoords, this.state, elementsMap)) {\n const ret = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.addMidpoint(this.state.selectedLinearElement, pointerCoords, this.state, !event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD], elementsMap);\n\n if (!ret) {\n return;\n } // Since we are reading from previous state which is not possible with\n // automatic batching in React 18 hence using flush sync to synchronously\n // update the state. Check https://github.com/excalidraw/excalidraw/pull/5508 for more details.\n\n\n (0,react_dom__WEBPACK_IMPORTED_MODULE_2__.flushSync)(() => {\n if (this.state.selectedLinearElement) {\n this.setState({\n selectedLinearElement: Object.assign(Object.assign({}, this.state.selectedLinearElement), {\n pointerDownState: ret.pointerDownState,\n selectedPointsIndices: ret.selectedPointsIndices\n })\n });\n }\n\n if (this.state.editingLinearElement) {\n this.setState({\n editingLinearElement: Object.assign(Object.assign({}, this.state.editingLinearElement), {\n pointerDownState: ret.pointerDownState,\n selectedPointsIndices: ret.selectedPointsIndices\n })\n });\n }\n });\n return;\n } else if (linearElementEditor.pointerDownState.segmentMidpoint.value !== null && !linearElementEditor.pointerDownState.segmentMidpoint.added) {\n return;\n }\n\n const didDrag = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.handlePointDragging(event, this.state, pointerCoords.x, pointerCoords.y, (element, pointsSceneCoords) => {\n this.maybeSuggestBindingsForLinearElementAtCoords(element, pointsSceneCoords);\n }, linearElementEditor, this.scene.getNonDeletedElementsMap());\n\n if (didDrag) {\n pointerDownState.lastCoords.x = pointerCoords.x;\n pointerDownState.lastCoords.y = pointerCoords.y;\n pointerDownState.drag.hasOccurred = true;\n\n if (this.state.editingLinearElement && !this.state.editingLinearElement.isDragging) {\n this.setState({\n editingLinearElement: Object.assign(Object.assign({}, this.state.editingLinearElement), {\n isDragging: true\n })\n });\n }\n\n if (!this.state.selectedLinearElement.isDragging) {\n this.setState({\n selectedLinearElement: Object.assign(Object.assign({}, this.state.selectedLinearElement), {\n isDragging: true\n })\n });\n }\n\n return;\n }\n }\n\n const hasHitASelectedElement = pointerDownState.hit.allHitElements.some(element => this.isASelectedElement(element));\n const isSelectingPointsInLineEditor = this.state.editingLinearElement && event.shiftKey && this.state.editingLinearElement.elementId === ((_a = pointerDownState.hit.element) === null || _a === void 0 ? void 0 : _a.id);\n\n if ((hasHitASelectedElement || pointerDownState.hit.hasHitCommonBoundingBoxOfSelectedElements) && !isSelectingPointsInLineEditor) {\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (selectedElements.every(element => element.locked)) {\n return;\n }\n\n const selectedElementsHasAFrame = selectedElements.find(e => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(e));\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords(pointerCoords);\n this.setState({\n frameToHighlight: topLayerFrame && !selectedElementsHasAFrame ? topLayerFrame : null\n }); // Marking that click was used for dragging to check\n // if elements should be deselected on pointerup\n\n pointerDownState.drag.hasOccurred = true;\n this.setState({\n selectedElementsAreBeingDragged: true\n }); // prevent dragging even if we're no longer holding cmd/ctrl otherwise\n // it would have weird results (stuff jumping all over the screen)\n // Checking for editingElement to avoid jump while editing on mobile #6503\n\n if (selectedElements.length > 0 && !pointerDownState.withCmdOrCtrl && !this.state.editingElement && ((_b = this.state.activeEmbeddable) === null || _b === void 0 ? void 0 : _b.state) !== \"active\") {\n const dragOffset = {\n x: pointerCoords.x - pointerDownState.origin.x,\n y: pointerCoords.y - pointerDownState.origin.y\n };\n const originalElements = [...pointerDownState.originalElements.values()]; // We only drag in one direction if shift is pressed\n\n const lockDirection = event.shiftKey;\n\n if (lockDirection) {\n const distanceX = Math.abs(dragOffset.x);\n const distanceY = Math.abs(dragOffset.y);\n const lockX = lockDirection && distanceX < distanceY;\n const lockY = lockDirection && distanceX > distanceY;\n\n if (lockX) {\n dragOffset.x = 0;\n }\n\n if (lockY) {\n dragOffset.y = 0;\n }\n } // Snap cache *must* be synchronously popuplated before initial drag,\n // otherwise the first drag even will not snap, causing a jump before\n // it snaps to its position if previously snapped already.\n\n\n this.maybeCacheVisibleGaps(event, selectedElements);\n this.maybeCacheReferenceSnapPoints(event, selectedElements);\n const {\n snapOffset,\n snapLines\n } = (0,_snapping__WEBPACK_IMPORTED_MODULE_59__.snapDraggedElements)(originalElements, dragOffset, this.state, event, this.scene.getNonDeletedElementsMap());\n this.setState({\n snapLines\n }); // when we're editing the name of a frame, we want the user to be\n // able to select and interact with the text input\n\n !this.state.editingFrame && (0,_element__WEBPACK_IMPORTED_MODULE_16__.dragSelectedElements)(pointerDownState, selectedElements, dragOffset, this.state, this.scene, snapOffset, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize);\n this.setState({\n suggestedBindings: (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.getSuggestedBindingsForArrows)(selectedElements, this)\n }); // We duplicate the selected element if alt is pressed on pointer move\n\n if (event.altKey && !pointerDownState.hit.hasBeenDuplicated) {\n // Move the currently selected elements to the top of the z index stack, and\n // put the duplicates where the selected elements used to be.\n // (the origin point where the dragging started)\n pointerDownState.hit.hasBeenDuplicated = true;\n const nextElements = [];\n const elementsToAppend = [];\n const groupIdMap = new Map();\n const oldIdToDuplicatedId = new Map();\n const hitElement = pointerDownState.hit.element;\n const selectedElementIds = new Set(this.scene.getSelectedElements({\n selectedElementIds: this.state.selectedElementIds,\n includeBoundTextElement: true,\n includeElementsInFrames: true\n }).map(element => element.id));\n const elements = this.scene.getElementsIncludingDeleted();\n\n for (const element of elements) {\n if (selectedElementIds.has(element.id) || // case: the state.selectedElementIds might not have been\n // updated yet by the time this mousemove event is fired\n element.id === (hitElement === null || hitElement === void 0 ? void 0 : hitElement.id) && pointerDownState.hit.wasAddedToSelection) {\n const duplicatedElement = (0,_element__WEBPACK_IMPORTED_MODULE_16__.duplicateElement)(this.state.editingGroupId, groupIdMap, element);\n const origElement = pointerDownState.originalElements.get(element.id);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(duplicatedElement, {\n x: origElement.x,\n y: origElement.y\n }); // put duplicated element to pointerDownState.originalElements\n // so that we can snap to the duplicated element without releasing\n\n pointerDownState.originalElements.set(duplicatedElement.id, duplicatedElement);\n nextElements.push(duplicatedElement);\n elementsToAppend.push(element);\n oldIdToDuplicatedId.set(element.id, duplicatedElement.id);\n } else {\n nextElements.push(element);\n }\n }\n\n const nextSceneElements = [...nextElements, ...elementsToAppend];\n (0,_fractionalIndex__WEBPACK_IMPORTED_MODULE_90__.syncMovedIndices)(nextSceneElements, (0,_utils__WEBPACK_IMPORTED_MODULE_35__.arrayToMap)(elementsToAppend));\n (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.bindTextToShapeAfterDuplication)(nextElements, elementsToAppend, oldIdToDuplicatedId);\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.fixBindingsAfterDuplication)(nextSceneElements, elementsToAppend, oldIdToDuplicatedId, \"duplicatesServeAsOld\");\n (0,_frame__WEBPACK_IMPORTED_MODULE_51__.bindElementsToFramesAfterDuplication)(nextSceneElements, elementsToAppend, oldIdToDuplicatedId);\n this.scene.replaceAllElements(nextSceneElements);\n this.maybeCacheVisibleGaps(event, selectedElements, true);\n this.maybeCacheReferenceSnapPoints(event, selectedElements, true);\n }\n\n return;\n }\n } // It is very important to read this.state within each move event,\n // otherwise we would read a stale one!\n\n\n const draggingElement = this.state.draggingElement;\n\n if (!draggingElement) {\n return;\n }\n\n if (draggingElement.type === \"freedraw\") {\n const points = draggingElement.points;\n const dx = pointerCoords.x - draggingElement.x;\n const dy = pointerCoords.y - draggingElement.y;\n const lastPoint = points.length > 0 && points[points.length - 1];\n const discardPoint = lastPoint && lastPoint[0] === dx && lastPoint[1] === dy;\n\n if (!discardPoint) {\n const strokeOptions = this.state.currentStrokeOptions; //zsviczian\n\n const pressures = draggingElement.simulatePressure ? draggingElement.pressures : [//zsviczian\n ...draggingElement.pressures, (strokeOptions === null || strokeOptions === void 0 ? void 0 : strokeOptions.constantPressure) ? 1 : event.pressure];\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(draggingElement, {\n points: [...points, [dx, dy]],\n pressures\n });\n }\n } else if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(draggingElement)) {\n pointerDownState.drag.hasOccurred = true;\n this.setState({\n selectedElementsAreBeingDragged: true\n });\n const points = draggingElement.points;\n let dx = gridX - draggingElement.x;\n let dy = gridY - draggingElement.y;\n\n if ((0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldRotateWithDiscreteAngle)(event) && points.length === 2) {\n ({\n width: dx,\n height: dy\n } = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getLockedLinearCursorAlignSize)(draggingElement.x, draggingElement.y, pointerCoords.x, pointerCoords.y));\n }\n\n if (points.length === 1) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(draggingElement, {\n points: [...points, [dx, dy]]\n });\n } else if (points.length === 2) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(draggingElement, {\n points: [...points.slice(0, -1), [dx, dy]]\n });\n }\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBindingElement)(draggingElement, false)) {\n // When creating a linear element by dragging\n this.maybeSuggestBindingsForLinearElementAtCoords(draggingElement, [pointerCoords], this.state.startBoundElement);\n }\n } else {\n pointerDownState.lastCoords.x = pointerCoords.x;\n pointerDownState.lastCoords.y = pointerCoords.y;\n this.maybeDragNewGenericElement(pointerDownState, event);\n }\n\n if (this.state.activeTool.type === \"selection\") {\n pointerDownState.boxSelection.hasOccurred = true;\n const elements = this.scene.getNonDeletedElements(); // box-select line editor points\n\n if (this.state.editingLinearElement) {\n _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.handleBoxSelection(event, this.state, this.setState.bind(this), this.scene.getNonDeletedElementsMap()); // regular box-select\n } else {\n let shouldReuseSelection = true;\n\n if (!event.shiftKey && (0,_scene__WEBPACK_IMPORTED_MODULE_29__.isSomeElementSelected)(elements, this.state)) {\n if (pointerDownState.withCmdOrCtrl && pointerDownState.hit.element) {\n this.setState(prevState => (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)(Object.assign(Object.assign({}, prevState), {\n selectedElementIds: {\n [pointerDownState.hit.element.id]: true\n }\n }), this.scene.getNonDeletedElements(), prevState, this));\n } else {\n shouldReuseSelection = false;\n }\n }\n\n const elementsWithinSelection = (0,_scene__WEBPACK_IMPORTED_MODULE_29__.getElementsWithinSelection)(elements, draggingElement, this.scene.getNonDeletedElementsMap());\n this.setState(prevState => {\n const nextSelectedElementIds = Object.assign(Object.assign({}, shouldReuseSelection && prevState.selectedElementIds), elementsWithinSelection.reduce((acc, element) => {\n acc[element.id] = true;\n return acc;\n }, {}));\n\n if (pointerDownState.hit.element) {\n // if using ctrl/cmd, select the hitElement only if we\n // haven't box-selected anything else\n if (!elementsWithinSelection.length) {\n nextSelectedElementIds[pointerDownState.hit.element.id] = true;\n } else {\n delete nextSelectedElementIds[pointerDownState.hit.element.id];\n }\n }\n\n prevState = !shouldReuseSelection ? Object.assign(Object.assign({}, prevState), {\n selectedGroupIds: {},\n editingGroupId: null\n }) : prevState;\n return Object.assign(Object.assign({}, (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: prevState.editingGroupId,\n selectedElementIds: nextSelectedElementIds\n }, this.scene.getNonDeletedElements(), prevState, this)), {\n // select linear element only when we haven't box-selected anything else\n selectedLinearElement: elementsWithinSelection.length === 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(elementsWithinSelection[0]) ? new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(elementsWithinSelection[0]) : null,\n showHyperlinkPopup: elementsWithinSelection.length === 1 && (elementsWithinSelection[0].link || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(elementsWithinSelection[0])) ? \"info\" : false\n });\n });\n }\n }\n });\n } // Returns whether the pointer move happened over either scrollbar\n\n\n handlePointerMoveOverScrollbars(event, pointerDownState) {\n if (pointerDownState.scrollbars.isOverHorizontal) {\n const x = event.clientX;\n const dx = x - pointerDownState.lastCoords.x;\n this.translateCanvas({\n scrollX: this.state.scrollX - dx / this.state.zoom.value\n });\n pointerDownState.lastCoords.x = x;\n return true;\n }\n\n if (pointerDownState.scrollbars.isOverVertical) {\n const y = event.clientY;\n const dy = y - pointerDownState.lastCoords.y;\n this.translateCanvas({\n scrollY: this.state.scrollY - dy / this.state.zoom.value\n });\n pointerDownState.lastCoords.y = y;\n return true;\n }\n\n return false;\n }\n\n onPointerUpFromPointerDownHandler(pointerDownState) {\n return (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(childEvent => {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;\n\n this.removePointer(childEvent);\n\n if (pointerDownState.eventListeners.onMove) {\n pointerDownState.eventListeners.onMove.flush();\n }\n\n const {\n draggingElement,\n resizingElement,\n multiElement,\n activeTool,\n isResizing,\n isRotating\n } = this.state;\n this.setState(prevState => ({\n isResizing: false,\n isRotating: false,\n resizingElement: null,\n selectionElement: null,\n frameToHighlight: null,\n elementsToHighlight: null,\n cursorButton: \"up\",\n // text elements are reset on finalize, and resetting on pointerup\n // may cause issues with double taps\n editingElement: multiElement || (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(this.state.editingElement) ? this.state.editingElement : null,\n snapLines: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateStable)(prevState.snapLines, []),\n originSnapOffset: null\n }));\n _snapping__WEBPACK_IMPORTED_MODULE_59__.SnapCache.setReferenceSnapPoints(null);\n _snapping__WEBPACK_IMPORTED_MODULE_59__.SnapCache.setVisibleGaps(null);\n this.savePointer(childEvent.clientX, childEvent.clientY, \"up\");\n this.setState({\n selectedElementsAreBeingDragged: false\n });\n const elementsMap = this.scene.getNonDeletedElementsMap(); // Handle end of dragging a point of a linear element, might close a loop\n // and sets binding element\n\n if (this.state.editingLinearElement) {\n if (!pointerDownState.boxSelection.hasOccurred && ((_b = (_a = pointerDownState.hit) === null || _a === void 0 ? void 0 : _a.element) === null || _b === void 0 ? void 0 : _b.id) !== this.state.editingLinearElement.elementId) {\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n } else {\n const editingLinearElement = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.handlePointerUp(childEvent, this.state.editingLinearElement, this.state, this);\n\n if (editingLinearElement !== this.state.editingLinearElement) {\n this.setState({\n editingLinearElement,\n suggestedBindings: []\n });\n }\n }\n } else if (this.state.selectedLinearElement) {\n if (((_d = (_c = pointerDownState.hit) === null || _c === void 0 ? void 0 : _c.element) === null || _d === void 0 ? void 0 : _d.id) !== this.state.selectedLinearElement.elementId) {\n const selectedELements = this.scene.getSelectedElements(this.state); // set selectedLinearElement to null if there is more than one element selected since we don't want to show linear element handles\n\n if (selectedELements.length > 1) {\n this.setState({\n selectedLinearElement: null\n });\n }\n } else {\n const linearElementEditor = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.handlePointerUp(childEvent, this.state.selectedLinearElement, this.state, this);\n const {\n startBindingElement,\n endBindingElement\n } = linearElementEditor;\n const element = this.scene.getElement(linearElementEditor.elementId);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBindingElement)(element)) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.bindOrUnbindLinearElement)(element, startBindingElement, endBindingElement, elementsMap);\n }\n\n if (linearElementEditor !== this.state.selectedLinearElement) {\n this.setState({\n selectedLinearElement: Object.assign(Object.assign({}, linearElementEditor), {\n selectedPointsIndices: null\n }),\n suggestedBindings: []\n });\n }\n }\n }\n\n this.missingPointerEventCleanupEmitter.clear();\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_MOVE, pointerDownState.eventListeners.onMove);\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, pointerDownState.eventListeners.onUp);\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.KEYDOWN, pointerDownState.eventListeners.onKeyDown);\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.KEYUP, pointerDownState.eventListeners.onKeyUp);\n\n if (this.state.pendingImageElementId) {\n this.setState({\n pendingImageElementId: null\n });\n }\n\n (_f = (_e = this.props) === null || _e === void 0 ? void 0 : _e.onPointerUp) === null || _f === void 0 ? void 0 : _f.call(_e, activeTool, pointerDownState);\n this.onPointerUpEmitter.trigger(this.state.activeTool, pointerDownState, childEvent);\n\n if ((draggingElement === null || draggingElement === void 0 ? void 0 : draggingElement.type) === \"freedraw\") {\n const pointerCoords = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(childEvent, this.state);\n const points = draggingElement.points;\n let dx = pointerCoords.x - draggingElement.x;\n let dy = pointerCoords.y - draggingElement.y; // Allows dots to avoid being flagged as infinitely small\n\n if (dx === points[0][0] && dy === points[0][1]) {\n dy += 0.0001;\n dx += 0.0001;\n }\n\n const pressures = draggingElement.simulatePressure ? [] : [...draggingElement.pressures, childEvent.pressure];\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(draggingElement, {\n points: [...points, [dx, dy]],\n pressures,\n lastCommittedPoint: [dx, dy]\n });\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n return;\n }\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isImageElement)(draggingElement)) {\n const imageElement = draggingElement;\n\n try {\n this.initializeImageDimensions(imageElement);\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({\n [imageElement.id]: true\n }, this.state)\n }, () => {\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n });\n } catch (error) {\n console.error(error);\n this.scene.replaceAllElements(this.scene.getElementsIncludingDeleted().filter(el => el.id !== imageElement.id));\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n }\n\n return;\n }\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(draggingElement)) {\n if (draggingElement.points.length > 1) {\n this.store.shouldCaptureIncrement();\n }\n\n const pointerCoords = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(childEvent, this.state);\n\n if (!pointerDownState.drag.hasOccurred && draggingElement && !multiElement) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(draggingElement, {\n points: [...draggingElement.points, [pointerCoords.x - draggingElement.x, pointerCoords.y - draggingElement.y]]\n });\n this.setState({\n multiElement: draggingElement,\n editingElement: this.state.draggingElement\n });\n } else if (pointerDownState.drag.hasOccurred && !multiElement) {\n if ((0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.isBindingEnabled)(this.state) && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBindingElement)(draggingElement, false)) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.maybeBindLinearElement)(draggingElement, this.state, pointerCoords, this);\n }\n\n this.setState({\n suggestedBindings: [],\n startBoundElement: null\n });\n\n if (!activeTool.locked) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n this.setState(prevState => ({\n draggingElement: null,\n activeTool: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, {\n type: \"selection\"\n }),\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(Object.assign(Object.assign({}, prevState.selectedElementIds), {\n [draggingElement.id]: true\n }), prevState),\n selectedLinearElement: new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(draggingElement)\n }));\n } else {\n this.setState(prevState => ({\n draggingElement: null\n }));\n }\n }\n\n return;\n }\n\n if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(draggingElement)) {\n const minWidth = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getMinTextElementWidth)((0,_utils__WEBPACK_IMPORTED_MODULE_35__.getFontString)({\n fontSize: draggingElement.fontSize,\n fontFamily: draggingElement.fontFamily\n }), draggingElement.lineHeight);\n\n if (draggingElement.width < minWidth) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(draggingElement, {\n autoResize: true\n });\n }\n\n this.resetCursor();\n this.handleTextWysiwyg(draggingElement, {\n isExistingElement: true\n });\n }\n\n if (activeTool.type !== \"selection\" && draggingElement && (0,_element__WEBPACK_IMPORTED_MODULE_16__.isInvisiblySmallElement)(draggingElement)) {\n // remove invisible element which was added in onPointerDown\n // update the store snapshot, so that invisible elements are not captured by the store\n this.updateScene({\n elements: this.scene.getElementsIncludingDeleted().filter(el => el.id !== draggingElement.id),\n appState: {\n draggingElement: null\n },\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.UPDATE\n });\n return;\n }\n\n if (draggingElement) {\n if (pointerDownState.drag.hasOccurred) {\n const sceneCoords = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(childEvent, this.state); // when editing the points of a linear element, we check if the\n // linear element still is in the frame afterwards\n // if not, the linear element will be removed from its frame (if any)\n\n if (this.state.selectedLinearElement && this.state.selectedLinearElement.isDragging) {\n const linearElement = this.scene.getElement(this.state.selectedLinearElement.elementId);\n\n if (linearElement === null || linearElement === void 0 ? void 0 : linearElement.frameId) {\n const frame = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getContainingFrame)(linearElement, elementsMap);\n\n if (frame && linearElement) {\n if (!(0,_frame__WEBPACK_IMPORTED_MODULE_51__.elementOverlapsWithFrame)(linearElement, frame, this.scene.getNonDeletedElementsMap())) {\n // remove the linear element from all groups\n // before removing it from the frame as well\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(linearElement, {\n groupIds: []\n });\n (0,_frame__WEBPACK_IMPORTED_MODULE_51__.removeElementsFromFrame)([linearElement], this.scene.getNonDeletedElementsMap());\n this.scene.triggerUpdate();\n }\n }\n }\n } else {\n // update the relationships between selected elements and frames\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords(sceneCoords);\n const selectedElements = this.scene.getSelectedElements(this.state);\n let nextElements = this.scene.getElementsMapIncludingDeleted();\n\n const updateGroupIdsAfterEditingGroup = elements => {\n if (elements.length > 0) {\n for (const element of elements) {\n const index = element.groupIds.indexOf(this.state.editingGroupId);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(element, {\n groupIds: element.groupIds.slice(0, index)\n }, false);\n }\n\n nextElements.forEach(element => {\n if (element.groupIds.length && (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getElementsInGroup)(nextElements, element.groupIds[element.groupIds.length - 1]).length < 2) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(element, {\n groupIds: []\n }, false);\n }\n });\n this.setState({\n editingGroupId: null\n });\n }\n };\n\n if (topLayerFrame && !this.state.selectedElementIds[topLayerFrame.id]) {\n const elementsToAdd = selectedElements.filter(element => element.frameId !== topLayerFrame.id && (0,_frame__WEBPACK_IMPORTED_MODULE_51__.isElementInFrame)(element, nextElements, this.state));\n\n if (this.state.editingGroupId) {\n updateGroupIdsAfterEditingGroup(elementsToAdd);\n }\n\n nextElements = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.addElementsToFrame)(nextElements, elementsToAdd, topLayerFrame);\n } else if (!topLayerFrame) {\n if (this.state.editingGroupId) {\n const elementsToRemove = selectedElements.filter(element => element.frameId && !(0,_frame__WEBPACK_IMPORTED_MODULE_51__.isElementInFrame)(element, nextElements, this.state));\n updateGroupIdsAfterEditingGroup(elementsToRemove);\n }\n }\n\n nextElements = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.updateFrameMembershipOfSelectedElements)(nextElements, this.state, this);\n this.scene.replaceAllElements(nextElements);\n }\n }\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(draggingElement)) {\n const elementsInsideFrame = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getElementsInNewFrame)(this.scene.getElementsIncludingDeleted(), draggingElement, this.scene.getNonDeletedElementsMap());\n this.scene.replaceAllElements((0,_frame__WEBPACK_IMPORTED_MODULE_51__.addElementsToFrame)(this.scene.getElementsMapIncludingDeleted(), elementsInsideFrame, draggingElement));\n }\n\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(draggingElement, (0,_element__WEBPACK_IMPORTED_MODULE_16__.getNormalizedDimensions)(draggingElement));\n }\n\n if (resizingElement) {\n this.store.shouldCaptureIncrement();\n }\n\n if (resizingElement && (0,_element__WEBPACK_IMPORTED_MODULE_16__.isInvisiblySmallElement)(resizingElement)) {\n // update the store snapshot, so that invisible elements are not captured by the store\n this.updateScene({\n elements: this.scene.getElementsIncludingDeleted().filter(el => el.id !== resizingElement.id),\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.UPDATE\n });\n } // handle frame membership for resizing frames and/or selected elements\n\n\n if (pointerDownState.resize.isResizing) {\n let nextElements = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.updateFrameMembershipOfSelectedElements)(this.scene.getElementsIncludingDeleted(), this.state, this);\n const selectedFrames = this.scene.getSelectedElements(this.state).filter(element => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(element));\n\n for (const frame of selectedFrames) {\n nextElements = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.replaceAllElementsInFrame)(nextElements, (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getElementsInResizingFrame)(this.scene.getElementsIncludingDeleted(), frame, this.state, elementsMap), frame, this);\n }\n\n this.scene.replaceAllElements(nextElements);\n } // Code below handles selection when element(s) weren't\n // drag or added to selection on pointer down phase.\n\n\n const hitElement = pointerDownState.hit.element;\n\n if (((_g = this.state.selectedLinearElement) === null || _g === void 0 ? void 0 : _g.elementId) !== (hitElement === null || hitElement === void 0 ? void 0 : hitElement.id) && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(hitElement)) {\n const selectedELements = this.scene.getSelectedElements(this.state); // set selectedLinearElement when no other element selected except\n // the one we've hit\n\n if (selectedELements.length === 1) {\n this.setState({\n selectedLinearElement: new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(hitElement)\n });\n }\n }\n\n const pointerStart = this.lastPointerDownEvent;\n const pointerEnd = this.lastPointerUpEvent || this.lastPointerMoveEvent;\n\n if ((0,_appState__WEBPACK_IMPORTED_MODULE_10__.isEraserActive)(this.state) && pointerStart && pointerEnd) {\n this.eraserTrail.endPath();\n const draggedDistance = (0,_math__WEBPACK_IMPORTED_MODULE_28__.distance2d)(pointerStart.clientX, pointerStart.clientY, pointerEnd.clientX, pointerEnd.clientY);\n\n if (draggedDistance === 0) {\n const scenePointer = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX: pointerEnd.clientX,\n clientY: pointerEnd.clientY\n }, this.state);\n const hitElements = this.getElementsAtPosition(scenePointer.x, scenePointer.y);\n hitElements.forEach(hitElement => this.elementsPendingErasure.add(hitElement.id));\n }\n\n this.eraseElements();\n return;\n } else if (this.elementsPendingErasure.size) {\n this.restoreReadyToEraseElements();\n }\n\n if (hitElement && !pointerDownState.drag.hasOccurred && !pointerDownState.hit.wasAddedToSelection && ( // if we're editing a line, pointerup shouldn't switch selection if\n // box selected\n !this.state.editingLinearElement || !pointerDownState.boxSelection.hasOccurred)) {\n // when inside line editor, shift selects points instead\n if (childEvent.shiftKey && !this.state.editingLinearElement) {\n if (this.state.selectedElementIds[hitElement.id]) {\n if ((0,_groups__WEBPACK_IMPORTED_MODULE_23__.isSelectedViaGroup)(this.state, hitElement)) {\n this.setState(_prevState => {\n const nextSelectedElementIds = Object.assign({}, _prevState.selectedElementIds); // We want to unselect all groups hitElement is part of\n // as well as all elements that are part of the groups\n // hitElement is part of\n\n for (const groupedElement of hitElement.groupIds.flatMap(groupId => (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getElementsInGroup)(this.scene.getNonDeletedElements(), groupId))) {\n delete nextSelectedElementIds[groupedElement.id];\n }\n\n return {\n selectedGroupIds: Object.assign(Object.assign({}, _prevState.selectedElementIds), hitElement.groupIds.map(gId => ({\n [gId]: false\n })).reduce((prev, acc) => Object.assign(Object.assign({}, prev), acc), {})),\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(nextSelectedElementIds, _prevState)\n };\n }); // if not dragging a linear element point (outside editor)\n } else if (!((_h = this.state.selectedLinearElement) === null || _h === void 0 ? void 0 : _h.isDragging)) {\n // remove element from selection while\n // keeping prev elements selected\n this.setState(prevState => {\n const newSelectedElementIds = Object.assign({}, prevState.selectedElementIds);\n delete newSelectedElementIds[hitElement.id];\n const newSelectedElements = (0,_scene__WEBPACK_IMPORTED_MODULE_29__.getSelectedElements)(this.scene.getNonDeletedElements(), {\n selectedElementIds: newSelectedElementIds\n });\n return Object.assign(Object.assign({}, (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: prevState.editingGroupId,\n selectedElementIds: newSelectedElementIds\n }, this.scene.getNonDeletedElements(), prevState, this)), {\n // set selectedLinearElement only if thats the only element selected\n selectedLinearElement: newSelectedElements.length === 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(newSelectedElements[0]) ? new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(newSelectedElements[0]) : prevState.selectedLinearElement\n });\n });\n }\n } else if (hitElement.frameId && this.state.selectedElementIds[hitElement.frameId]) {\n // when hitElement is part of a selected frame, deselect the frame\n // to avoid frame and containing elements selected simultaneously\n this.setState(prevState => {\n var _a, _b;\n\n const nextSelectedElementIds = Object.assign(Object.assign({}, prevState.selectedElementIds), {\n [hitElement.id]: true\n }); // deselect the frame\n\n delete nextSelectedElementIds[hitElement.frameId]; // deselect groups containing the frame\n\n ((_b = (_a = this.scene.getElement(hitElement.frameId)) === null || _a === void 0 ? void 0 : _a.groupIds) !== null && _b !== void 0 ? _b : []).flatMap(gid => (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getElementsInGroup)(this.scene.getNonDeletedElements(), gid)).forEach(element => {\n delete nextSelectedElementIds[element.id];\n });\n return Object.assign(Object.assign({}, (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: prevState.editingGroupId,\n selectedElementIds: nextSelectedElementIds\n }, this.scene.getNonDeletedElements(), prevState, this)), {\n showHyperlinkPopup: hitElement.link || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(hitElement) ? \"info\" : false\n });\n });\n } else {\n // add element to selection while keeping prev elements selected\n this.setState(_prevState => ({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(Object.assign(Object.assign({}, _prevState.selectedElementIds), {\n [hitElement.id]: true\n }), _prevState)\n }));\n }\n } else {\n this.setState(prevState => {\n var _a;\n\n return Object.assign(Object.assign({}, (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: prevState.editingGroupId,\n selectedElementIds: {\n [hitElement.id]: true\n }\n }, this.scene.getNonDeletedElements(), prevState, this)), {\n selectedLinearElement: (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(hitElement) && // Don't set `selectedLinearElement` if its same as the hitElement, this is mainly to prevent resetting the `hoverPointIndex` to -1.\n // Future we should update the API to take care of setting the correct `hoverPointIndex` when initialized\n ((_a = prevState.selectedLinearElement) === null || _a === void 0 ? void 0 : _a.elementId) !== hitElement.id ? new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(hitElement) : prevState.selectedLinearElement\n });\n });\n }\n }\n\n if ( // not dragged\n !pointerDownState.drag.hasOccurred && // not resized\n !this.state.isResizing && ( // only hitting the bounding box of the previous hit element\n hitElement && (0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.hitElementBoundingBoxOnly)({\n x: pointerDownState.origin.x,\n y: pointerDownState.origin.y,\n element: hitElement,\n shape: this.getElementShape(hitElement),\n threshold: this.getElementHitThreshold(),\n frameNameBound: (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(hitElement) ? this.frameNameBoundsCache.get(hitElement) : null\n }, elementsMap) || !hitElement && pointerDownState.hit.hasHitCommonBoundingBoxOfSelectedElements)) {\n if (this.state.editingLinearElement) {\n this.setState({\n editingLinearElement: null\n });\n } else {\n // Deselect selected elements\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n selectedGroupIds: {},\n editingGroupId: null,\n activeEmbeddable: null\n });\n } // reset cursor\n\n\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.AUTO);\n return;\n }\n\n if (!activeTool.locked && activeTool.type !== \"freedraw\" && draggingElement && draggingElement.type !== \"selection\") {\n this.setState(prevState => ({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(Object.assign(Object.assign({}, prevState.selectedElementIds), {\n [draggingElement.id]: true\n }), prevState),\n showHyperlinkPopup: (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(draggingElement) && !draggingElement.link ? \"editor\" : prevState.showHyperlinkPopup\n }));\n }\n\n if (activeTool.type !== \"selection\" || (0,_scene__WEBPACK_IMPORTED_MODULE_29__.isSomeElementSelected)(this.scene.getNonDeletedElements(), this.state) || !(0,_utils__WEBPACK_IMPORTED_MODULE_35__.isShallowEqual)(this.state.previousSelectedElementIds, this.state.selectedElementIds)) {\n this.store.shouldCaptureIncrement();\n }\n\n if (pointerDownState.drag.hasOccurred || isResizing || isRotating) {\n // We only allow binding via linear elements, specifically via dragging\n // the endpoints (\"start\" or \"end\").\n const linearElements = this.scene.getSelectedElements(this.state).filter(_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement);\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.bindOrUnbindLinearElements)(linearElements, this, (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.isBindingEnabled)(this.state), (_k = (_j = this.state.selectedLinearElement) === null || _j === void 0 ? void 0 : _j.selectedPointsIndices) !== null && _k !== void 0 ? _k : []);\n }\n\n if (activeTool.type === \"laser\") {\n this.laserTrails.endPath();\n return;\n }\n\n if (!activeTool.locked && activeTool.type !== \"freedraw\") {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n this.setState({\n draggingElement: null,\n suggestedBindings: [],\n activeTool: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, {\n type: \"selection\"\n })\n });\n } else {\n this.setState({\n draggingElement: null,\n suggestedBindings: []\n });\n }\n\n if (hitElement && this.lastPointerUpEvent && this.lastPointerDownEvent && this.lastPointerUpEvent.timeStamp - this.lastPointerDownEvent.timeStamp < 300 && gesture.pointers.size <= 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeLikeElement)(hitElement) && this.isIframeLikeElementCenter(hitElement, this.lastPointerUpEvent, pointerDownState.origin.x, pointerDownState.origin.y)) {\n this.handleEmbeddableCenterClick(hitElement);\n }\n });\n } //zsviczian - published on API\n\n\n setSelection(elements) {\n const selectedElementIds = {};\n const selectedGroupIds = {};\n elements.forEach(ele => {\n if (ele.groupIds.length) {\n selectedElementIds[ele.id] = true;\n ele.groupIds.forEach(id => {\n selectedGroupIds[id] = true;\n });\n } // exclude bound text elements as we don't mark them as selected when\n // container is selected unless in group\n else if (!(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBoundToContainer)(ele)) {\n selectedElementIds[ele.id] = true;\n }\n });\n this.setState({\n previousSelectedElementIds: this.state.selectedElementIds,\n selectedElementIds,\n selectedGroupIds\n });\n }\n\n clearSelection(hitElement) {\n this.setState(prevState => ({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, prevState),\n activeEmbeddable: null,\n selectedGroupIds: {},\n // Continue editing the same group if the user selected a different\n // element from it\n editingGroupId: prevState.editingGroupId && hitElement != null && (0,_groups__WEBPACK_IMPORTED_MODULE_23__.isElementInGroup)(hitElement, prevState.editingGroupId) ? prevState.editingGroupId : null\n }));\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n activeEmbeddable: null,\n previousSelectedElementIds: this.state.selectedElementIds\n });\n }\n\n getTextWysiwygSnappedToCenterPosition(x, y, appState, container) {\n if (container) {\n let elementCenterX = container.x + container.width / 2;\n let elementCenterY = container.y + container.height / 2;\n const elementCenter = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getContainerCenter)(container, appState, this.scene.getNonDeletedElementsMap());\n\n if (elementCenter) {\n elementCenterX = elementCenter.x;\n elementCenterY = elementCenter.y;\n }\n\n const distanceToCenter = Math.hypot(x - elementCenterX, y - elementCenterY);\n const isSnappedToCenter = distanceToCenter < _constants__WEBPACK_IMPORTED_MODULE_12__.TEXT_TO_CENTER_SNAP_THRESHOLD;\n\n if (isSnappedToCenter) {\n const {\n x: viewportX,\n y: viewportY\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.sceneCoordsToViewportCoords)({\n sceneX: elementCenterX,\n sceneY: elementCenterY\n }, appState);\n return {\n viewportX,\n viewportY,\n elementCenterX,\n elementCenterY\n };\n }\n }\n }\n\n getCanvasOffsets() {\n var _a;\n\n if ((_a = this.excalidrawContainerRef) === null || _a === void 0 ? void 0 : _a.current) {\n const excalidrawContainer = this.excalidrawContainerRef.current;\n const {\n left,\n top\n } = excalidrawContainer.getBoundingClientRect();\n return {\n offsetLeft: left,\n offsetTop: top\n };\n }\n\n return {\n offsetLeft: 0,\n offsetTop: 0\n };\n }\n\n async updateLanguage() {\n const currentLang = _i18n__WEBPACK_IMPORTED_MODULE_25__.languages.find(lang => lang.code === this.props.langCode) || _i18n__WEBPACK_IMPORTED_MODULE_25__.defaultLang;\n await (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.setLanguage)(currentLang);\n this.setAppState({});\n }\n\n}\n\nconst createTestHook = () => {\n if (\"development\" === _constants__WEBPACK_IMPORTED_MODULE_12__.ENV.TEST || \"development\" !== \"production\") {\n window.h = window.h || {};\n Object.defineProperties(window.h, {\n elements: {\n configurable: true,\n\n get() {\n var _a;\n\n return (_a = this.app) === null || _a === void 0 ? void 0 : _a.scene.getElementsIncludingDeleted();\n },\n\n set(elements) {\n var _a;\n\n return (_a = this.app) === null || _a === void 0 ? void 0 : _a.scene.replaceAllElements((0,_fractionalIndex__WEBPACK_IMPORTED_MODULE_90__.syncInvalidIndices)(elements));\n }\n\n }\n });\n }\n};\ncreateTestHook();\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (App);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/App.tsx?");
884
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"ExcalidrawContainerContext\": () => (/* binding */ ExcalidrawContainerContext),\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__),\n/* harmony export */ \"showFourthFont\": () => (/* binding */ showFourthFont),\n/* harmony export */ \"useApp\": () => (/* binding */ useApp),\n/* harmony export */ \"useAppProps\": () => (/* binding */ useAppProps),\n/* harmony export */ \"useDevice\": () => (/* binding */ useDevice),\n/* harmony export */ \"useExcalidrawActionManager\": () => (/* binding */ useExcalidrawActionManager),\n/* harmony export */ \"useExcalidrawAppState\": () => (/* binding */ useExcalidrawAppState),\n/* harmony export */ \"useExcalidrawContainer\": () => (/* binding */ useExcalidrawContainer),\n/* harmony export */ \"useExcalidrawElements\": () => (/* binding */ useExcalidrawElements),\n/* harmony export */ \"useExcalidrawSetAppState\": () => (/* binding */ useExcalidrawSetAppState)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-dom */ \"react-dom\");\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_2__);\n/* harmony import */ var roughjs_bin_rough__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! roughjs/bin/rough */ \"../../node_modules/roughjs/bin/rough.js\");\n/* harmony import */ var clsx__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! clsx */ \"../../node_modules/clsx/dist/clsx.m.js\");\n/* harmony import */ var nanoid__WEBPACK_IMPORTED_MODULE_98__ = __webpack_require__(/*! nanoid */ \"./node_modules/nanoid/index.browser.js\");\n/* harmony import */ var _actions__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../actions */ \"./actions/index.ts\");\n/* harmony import */ var _actions_actionHistory__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../actions/actionHistory */ \"./actions/actionHistory.tsx\");\n/* harmony import */ var _actions_manager__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../actions/manager */ \"./actions/manager.tsx\");\n/* harmony import */ var _actions_register__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../actions/register */ \"./actions/register.ts\");\n/* harmony import */ var _analytics__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../analytics */ \"./analytics.ts\");\n/* harmony import */ var _appState__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../appState */ \"./appState.ts\");\n/* harmony import */ var _clipboard__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../clipboard */ \"./clipboard.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../constants */ \"./constants.ts\");\n/* harmony import */ var _data__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../data */ \"./data/index.ts\");\n/* harmony import */ var _data_library__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../data/library */ \"./data/library.ts\");\n/* harmony import */ var _data_restore__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../data/restore */ \"./data/restore.ts\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../element */ \"./element/index.ts\");\n/* harmony import */ var _element_binding__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../element/binding */ \"./element/binding.ts\");\n/* harmony import */ var _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../element/linearElementEditor */ \"./element/linearElementEditor.ts\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _element_newElement__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../element/newElement */ \"./element/newElement.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _gesture__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../gesture */ \"./gesture.ts\");\n/* harmony import */ var _groups__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../groups */ \"./groups.ts\");\n/* harmony import */ var _history__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../history */ \"./history.ts\");\n/* harmony import */ var _i18n__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ../i18n */ \"./i18n.ts\");\n/* harmony import */ var _keys__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ../keys */ \"./keys.ts\");\n/* harmony import */ var _element_sizeHelpers__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ../element/sizeHelpers */ \"./element/sizeHelpers.ts\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! ../math */ \"./math.ts\");\n/* harmony import */ var _scene__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! ../scene */ \"./scene/index.ts\");\n/* harmony import */ var _scene_Scene__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! ../scene/Scene */ \"./scene/Scene.ts\");\n/* harmony import */ var _scene_zoom__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! ../scene/zoom */ \"./scene/zoom.ts\");\n/* harmony import */ var _shapes__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! ../shapes */ \"./shapes.tsx\");\n/* harmony import */ var _utils_geometry_shape__WEBPACK_IMPORTED_MODULE_33__ = __webpack_require__(/*! ../../utils/geometry/shape */ \"../utils/geometry/shape.ts\");\n/* harmony import */ var _utils_collision__WEBPACK_IMPORTED_MODULE_34__ = __webpack_require__(/*! ../../utils/collision */ \"../utils/collision.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_35__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _element_embeddable__WEBPACK_IMPORTED_MODULE_36__ = __webpack_require__(/*! ../element/embeddable */ \"./element/embeddable.ts\");\n/* harmony import */ var _ContextMenu__WEBPACK_IMPORTED_MODULE_37__ = __webpack_require__(/*! ./ContextMenu */ \"./components/ContextMenu.tsx\");\n/* harmony import */ var _LayerUI__WEBPACK_IMPORTED_MODULE_38__ = __webpack_require__(/*! ./LayerUI */ \"./components/LayerUI.tsx\");\n/* harmony import */ var _Toast__WEBPACK_IMPORTED_MODULE_39__ = __webpack_require__(/*! ./Toast */ \"./components/Toast.tsx\");\n/* harmony import */ var _actions_actionToggleViewMode__WEBPACK_IMPORTED_MODULE_40__ = __webpack_require__(/*! ../actions/actionToggleViewMode */ \"./actions/actionToggleViewMode.tsx\");\n/* harmony import */ var _data_blob__WEBPACK_IMPORTED_MODULE_41__ = __webpack_require__(/*! ../data/blob */ \"./data/blob.ts\");\n/* harmony import */ var _element_image__WEBPACK_IMPORTED_MODULE_42__ = __webpack_require__(/*! ../element/image */ \"./element/image.ts\");\n/* harmony import */ var lodash_throttle__WEBPACK_IMPORTED_MODULE_43__ = __webpack_require__(/*! lodash.throttle */ \"../../node_modules/lodash.throttle/index.js\");\n/* harmony import */ var lodash_throttle__WEBPACK_IMPORTED_MODULE_43___default = /*#__PURE__*/__webpack_require__.n(lodash_throttle__WEBPACK_IMPORTED_MODULE_43__);\n/* harmony import */ var _data_filesystem__WEBPACK_IMPORTED_MODULE_44__ = __webpack_require__(/*! ../data/filesystem */ \"./data/filesystem.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_45__ = __webpack_require__(/*! ../element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _components_hyperlink_Hyperlink__WEBPACK_IMPORTED_MODULE_46__ = __webpack_require__(/*! ../components/hyperlink/Hyperlink */ \"./components/hyperlink/Hyperlink.tsx\");\n/* harmony import */ var _data_url__WEBPACK_IMPORTED_MODULE_47__ = __webpack_require__(/*! ../data/url */ \"./data/url.ts\");\n/* harmony import */ var _element_transformHandles__WEBPACK_IMPORTED_MODULE_48__ = __webpack_require__(/*! ../element/transformHandles */ \"./element/transformHandles.ts\");\n/* harmony import */ var _actions_actionElementLock__WEBPACK_IMPORTED_MODULE_49__ = __webpack_require__(/*! ../actions/actionElementLock */ \"./actions/actionElementLock.ts\");\n/* harmony import */ var _scene_Fonts__WEBPACK_IMPORTED_MODULE_50__ = __webpack_require__(/*! ../scene/Fonts */ \"./scene/Fonts.ts\");\n/* harmony import */ var _frame__WEBPACK_IMPORTED_MODULE_51__ = __webpack_require__(/*! ../frame */ \"./frame.ts\");\n/* harmony import */ var _scene_selection__WEBPACK_IMPORTED_MODULE_52__ = __webpack_require__(/*! ../scene/selection */ \"./scene/selection.ts\");\n/* harmony import */ var _actions_actionClipboard__WEBPACK_IMPORTED_MODULE_53__ = __webpack_require__(/*! ../actions/actionClipboard */ \"./actions/actionClipboard.tsx\");\n/* harmony import */ var _actions_actionFrame__WEBPACK_IMPORTED_MODULE_54__ = __webpack_require__(/*! ../actions/actionFrame */ \"./actions/actionFrame.ts\");\n/* harmony import */ var _actions_actionCanvas__WEBPACK_IMPORTED_MODULE_55__ = __webpack_require__(/*! ../actions/actionCanvas */ \"./actions/actionCanvas.tsx\");\n/* harmony import */ var _jotai__WEBPACK_IMPORTED_MODULE_56__ = __webpack_require__(/*! ../jotai */ \"./jotai.ts\");\n/* harmony import */ var _ActiveConfirmDialog__WEBPACK_IMPORTED_MODULE_57__ = __webpack_require__(/*! ./ActiveConfirmDialog */ \"./components/ActiveConfirmDialog.tsx\");\n/* harmony import */ var _errors__WEBPACK_IMPORTED_MODULE_58__ = __webpack_require__(/*! ../errors */ \"./errors.ts\");\n/* harmony import */ var _snapping__WEBPACK_IMPORTED_MODULE_59__ = __webpack_require__(/*! ../snapping */ \"./snapping.ts\");\n/* harmony import */ var _actions_actionBoundText__WEBPACK_IMPORTED_MODULE_60__ = __webpack_require__(/*! ../actions/actionBoundText */ \"./actions/actionBoundText.tsx\");\n/* harmony import */ var _BraveMeasureTextError__WEBPACK_IMPORTED_MODULE_61__ = __webpack_require__(/*! ./BraveMeasureTextError */ \"./components/BraveMeasureTextError.tsx\");\n/* harmony import */ var _EyeDropper__WEBPACK_IMPORTED_MODULE_62__ = __webpack_require__(/*! ./EyeDropper */ \"./components/EyeDropper.tsx\");\n/* harmony import */ var _data_transform__WEBPACK_IMPORTED_MODULE_63__ = __webpack_require__(/*! ../data/transform */ \"./data/transform.ts\");\n/* harmony import */ var _Sidebar_Sidebar__WEBPACK_IMPORTED_MODULE_64__ = __webpack_require__(/*! ./Sidebar/Sidebar */ \"./components/Sidebar/Sidebar.tsx\");\n/* harmony import */ var _canvases__WEBPACK_IMPORTED_MODULE_65__ = __webpack_require__(/*! ./canvases */ \"./components/canvases/index.tsx\");\n/* harmony import */ var _scene_Renderer__WEBPACK_IMPORTED_MODULE_66__ = __webpack_require__(/*! ../scene/Renderer */ \"./scene/Renderer.ts\");\n/* harmony import */ var _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_67__ = __webpack_require__(/*! ../scene/ShapeCache */ \"./scene/ShapeCache.ts\");\n/* harmony import */ var _SVGLayer__WEBPACK_IMPORTED_MODULE_68__ = __webpack_require__(/*! ./SVGLayer */ \"./components/SVGLayer.tsx\");\n/* harmony import */ var _cursor__WEBPACK_IMPORTED_MODULE_69__ = __webpack_require__(/*! ../cursor */ \"./cursor.ts\");\n/* harmony import */ var _emitter__WEBPACK_IMPORTED_MODULE_70__ = __webpack_require__(/*! ../emitter */ \"./emitter.ts\");\n/* harmony import */ var _element_ElementCanvasButtons__WEBPACK_IMPORTED_MODULE_71__ = __webpack_require__(/*! ../element/ElementCanvasButtons */ \"./element/ElementCanvasButtons.tsx\");\n/* harmony import */ var _data_magic__WEBPACK_IMPORTED_MODULE_72__ = __webpack_require__(/*! ../data/magic */ \"./data/magic.ts\");\n/* harmony import */ var _utils_export__WEBPACK_IMPORTED_MODULE_73__ = __webpack_require__(/*! ../../utils/export */ \"../utils/export.ts\");\n/* harmony import */ var _colors__WEBPACK_IMPORTED_MODULE_74__ = __webpack_require__(/*! ../colors */ \"./colors.ts\");\n/* harmony import */ var _MagicButton__WEBPACK_IMPORTED_MODULE_75__ = __webpack_require__(/*! ./MagicButton */ \"./components/MagicButton.tsx\");\n/* harmony import */ var _icons__WEBPACK_IMPORTED_MODULE_76__ = __webpack_require__(/*! ./icons */ \"./components/icons.tsx\");\n/* harmony import */ var _data_EditorLocalStorage__WEBPACK_IMPORTED_MODULE_77__ = __webpack_require__(/*! ../data/EditorLocalStorage */ \"./data/EditorLocalStorage.ts\");\n/* harmony import */ var _FollowMode_FollowMode__WEBPACK_IMPORTED_MODULE_78__ = __webpack_require__(/*! ./FollowMode/FollowMode */ \"./components/FollowMode/FollowMode.tsx\");\n/* harmony import */ var _actions_actionProperties__WEBPACK_IMPORTED_MODULE_79__ = __webpack_require__(/*! ../actions/actionProperties */ \"./actions/actionProperties.tsx\");\n/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_80__ = __webpack_require__(/*! ../store */ \"./store.ts\");\n/* harmony import */ var _animation_frame_handler__WEBPACK_IMPORTED_MODULE_81__ = __webpack_require__(/*! ../animation-frame-handler */ \"./animation-frame-handler.ts\");\n/* harmony import */ var _animated_trail__WEBPACK_IMPORTED_MODULE_82__ = __webpack_require__(/*! ../animated-trail */ \"./animated-trail.ts\");\n/* harmony import */ var _laser_trails__WEBPACK_IMPORTED_MODULE_83__ = __webpack_require__(/*! ../laser-trails */ \"./laser-trails.ts\");\n/* harmony import */ var _reactUtils__WEBPACK_IMPORTED_MODULE_84__ = __webpack_require__(/*! ../reactUtils */ \"./reactUtils.ts\");\n/* harmony import */ var _renderer_renderElement__WEBPACK_IMPORTED_MODULE_85__ = __webpack_require__(/*! ../renderer/renderElement */ \"./renderer/renderElement.ts\");\n/* harmony import */ var _obsidianUtils__WEBPACK_IMPORTED_MODULE_86__ = __webpack_require__(/*! ../obsidianUtils */ \"./obsidianUtils.ts\");\n/* harmony import */ var _element_collision__WEBPACK_IMPORTED_MODULE_87__ = __webpack_require__(/*! ../element/collision */ \"./element/collision.ts\");\n/* harmony import */ var _element_textWysiwyg__WEBPACK_IMPORTED_MODULE_88__ = __webpack_require__(/*! ../element/textWysiwyg */ \"./element/textWysiwyg.tsx\");\n/* harmony import */ var _scene_scrollbars__WEBPACK_IMPORTED_MODULE_89__ = __webpack_require__(/*! ../scene/scrollbars */ \"./scene/scrollbars.ts\");\n/* harmony import */ var _fractionalIndex__WEBPACK_IMPORTED_MODULE_90__ = __webpack_require__(/*! ../fractionalIndex */ \"./fractionalIndex.ts\");\n/* harmony import */ var _hyperlink_helpers__WEBPACK_IMPORTED_MODULE_91__ = __webpack_require__(/*! ./hyperlink/helpers */ \"./components/hyperlink/helpers.ts\");\n/* harmony import */ var _actions_shortcuts__WEBPACK_IMPORTED_MODULE_92__ = __webpack_require__(/*! ../actions/shortcuts */ \"./actions/shortcuts.ts\");\n/* harmony import */ var _element_resizeElements__WEBPACK_IMPORTED_MODULE_93__ = __webpack_require__(/*! ../element/resizeElements */ \"./element/resizeElements.ts\");\n/* harmony import */ var _actions_actionTextAutoResize__WEBPACK_IMPORTED_MODULE_94__ = __webpack_require__(/*! ../actions/actionTextAutoResize */ \"./actions/actionTextAutoResize.ts\");\n/* harmony import */ var _element_bounds__WEBPACK_IMPORTED_MODULE_95__ = __webpack_require__(/*! ../element/bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _mermaid__WEBPACK_IMPORTED_MODULE_96__ = __webpack_require__(/*! ../mermaid */ \"./mermaid.ts\");\n/* harmony import */ var _Tooltip__WEBPACK_IMPORTED_MODULE_97__ = __webpack_require__(/*! ./Tooltip */ \"./components/Tooltip.tsx\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n //zsviczian\n\n\n\n\n\nconst AppContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext(null);\nconst AppPropsContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext(null);\nlet showFourthFont = false; //zsviczian\n\nconst deviceContextInitialValue = {\n viewport: {\n isMobile: false,\n isLandscape: false\n },\n editor: {\n isMobile: false,\n canFitSidebar: false\n },\n isTouchScreen: false\n};\nconst DeviceContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext(deviceContextInitialValue);\nDeviceContext.displayName = \"DeviceContext\";\nconst ExcalidrawContainerContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext({\n container: null,\n id: null\n});\nExcalidrawContainerContext.displayName = \"ExcalidrawContainerContext\";\nconst ExcalidrawElementsContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext([]);\nExcalidrawElementsContext.displayName = \"ExcalidrawElementsContext\";\nconst ExcalidrawAppStateContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext(Object.assign(Object.assign({}, (0,_appState__WEBPACK_IMPORTED_MODULE_10__.getDefaultAppState)()), {\n width: 0,\n height: 0,\n offsetLeft: 0,\n offsetTop: 0\n}));\nExcalidrawAppStateContext.displayName = \"ExcalidrawAppStateContext\";\nconst ExcalidrawSetAppStateContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext(() => {\n console.warn(\"Uninitialized ExcalidrawSetAppStateContext context!\");\n});\nExcalidrawSetAppStateContext.displayName = \"ExcalidrawSetAppStateContext\";\nconst ExcalidrawActionManagerContext = react__WEBPACK_IMPORTED_MODULE_1___default().createContext(null);\nExcalidrawActionManagerContext.displayName = \"ExcalidrawActionManagerContext\";\nconst useApp = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(AppContext);\nconst useAppProps = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(AppPropsContext);\nconst useDevice = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(DeviceContext);\nconst useExcalidrawContainer = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(ExcalidrawContainerContext);\nconst useExcalidrawElements = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(ExcalidrawElementsContext);\nconst useExcalidrawAppState = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(ExcalidrawAppStateContext);\nconst useExcalidrawSetAppState = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(ExcalidrawSetAppStateContext);\nconst useExcalidrawActionManager = () => (0,react__WEBPACK_IMPORTED_MODULE_1__.useContext)(ExcalidrawActionManagerContext);\nlet didTapTwice = false;\nlet tappedTwiceTimer = 0;\nlet isHoldingSpace = false;\nlet isPanning = false;\nlet isDraggingScrollBar = false;\nlet currentScrollBars = {\n horizontal: null,\n vertical: null\n};\nlet touchTimeout = 0;\nlet invalidateContextMenu = false;\n/**\r\n * Map of youtube embed video states\r\n */\n\nconst YOUTUBE_VIDEO_STATES = new Map();\nlet IS_PLAIN_PASTE = false;\nlet IS_PLAIN_PASTE_TIMER = 0;\nlet PLAIN_PASTE_TOAST_SHOWN = false;\nlet lastPointerUp = null;\nconst gesture = {\n pointers: new Map(),\n lastCenter: null,\n initialDistance: null,\n initialScale: null\n};\n\nclass App extends (react__WEBPACK_IMPORTED_MODULE_1___default().Component) {\n constructor(props) {\n super(props);\n this.interactiveCanvas = null;\n this.unmounted = false;\n this.device = deviceContextInitialValue;\n this.excalidrawContainerRef = react__WEBPACK_IMPORTED_MODULE_1___default().createRef();\n this.files = {};\n this.imageCache = new Map();\n this.iFrameRefs = new Map();\n /**\r\n * Indicates whether the embeddable's url has been validated for rendering.\r\n * If value not set, indicates that the validation is pending.\r\n * Initially or on url change the flag is not reset so that we can guarantee\r\n * the validation came from a trusted source (the editor).\r\n **/\n\n this.embedsValidationStatus = new Map();\n /** embeds that have been inserted to DOM (as a perf optim, we don't want to\r\n * insert to DOM before user initially scrolls to them) */\n\n this.initializedEmbeds = new Set();\n this.elementsPendingErasure = new Set();\n this.lastPointerDownEvent = null;\n this.lastPointerUpEvent = null;\n this.lastPointerMoveEvent = null;\n this.lastViewportPosition = {\n x: 0,\n y: 0\n };\n this.allowMobileMode = true; //zsviczian\n\n this.animationFrameHandler = new _animation_frame_handler__WEBPACK_IMPORTED_MODULE_81__.AnimationFrameHandler();\n this.laserTrails = new _laser_trails__WEBPACK_IMPORTED_MODULE_83__.LaserTrails(this.animationFrameHandler, this);\n this.eraserTrail = new _animated_trail__WEBPACK_IMPORTED_MODULE_82__.AnimatedTrail(this.animationFrameHandler, this, {\n streamline: 0.2,\n size: 5,\n keepHead: true,\n sizeMapping: c => {\n const DECAY_TIME = 200;\n const DECAY_LENGTH = 10;\n const t = Math.max(0, 1 - (performance.now() - c.pressure) / DECAY_TIME);\n const l = (DECAY_LENGTH - Math.min(DECAY_LENGTH, c.totalLength - c.currentIndex)) / DECAY_LENGTH;\n return Math.min((0,_utils__WEBPACK_IMPORTED_MODULE_35__.easeOut)(l), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.easeOut)(t));\n },\n fill: () => this.state.theme === _constants__WEBPACK_IMPORTED_MODULE_12__.THEME.LIGHT ? \"rgba(0, 0, 0, 0.2)\" : \"rgba(255, 255, 255, 0.2)\"\n });\n this.onChangeEmitter = new _emitter__WEBPACK_IMPORTED_MODULE_70__.Emitter();\n this.onPointerDownEmitter = new _emitter__WEBPACK_IMPORTED_MODULE_70__.Emitter();\n this.onPointerUpEmitter = new _emitter__WEBPACK_IMPORTED_MODULE_70__.Emitter();\n this.onUserFollowEmitter = new _emitter__WEBPACK_IMPORTED_MODULE_70__.Emitter();\n this.onScrollChangeEmitter = new _emitter__WEBPACK_IMPORTED_MODULE_70__.Emitter();\n this.missingPointerEventCleanupEmitter = new _emitter__WEBPACK_IMPORTED_MODULE_70__.Emitter();\n this.onRemoveEventListenersEmitter = new _emitter__WEBPACK_IMPORTED_MODULE_70__.Emitter();\n\n this.updateEmbedValidationStatus = (element, status) => {\n this.embedsValidationStatus.set(element.id, status);\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_67__.ShapeCache[\"delete\"](element);\n };\n\n this.updateEmbeddables = () => {\n const iframeLikes = new Set();\n let updated = false;\n this.scene.getNonDeletedElements().filter(element => {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(element)) {\n iframeLikes.add(element.id);\n\n if (!this.embedsValidationStatus.has(element.id)) {\n updated = true;\n const validated = (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.embeddableURLValidator)(element.link, this.props.validateEmbeddable);\n this.updateEmbedValidationStatus(element, validated);\n }\n } else if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeElement)(element)) {\n iframeLikes.add(element.id);\n }\n\n return false;\n });\n\n if (updated) {\n this.scene.triggerUpdate();\n } // GC\n\n\n this.iFrameRefs.forEach((ref, id) => {\n if (!iframeLikes.has(id)) {\n this.iFrameRefs.delete(id);\n }\n });\n };\n\n this.getFrameNameDOMId = frameElement => {\n return `${this.id}-frame-name-${frameElement.id}`;\n };\n\n this.frameNameBoundsCache = {\n get: frameElement => {\n let bounds = this.frameNameBoundsCache._cache.get(frameElement.id);\n\n if (!bounds || bounds.zoom !== this.state.zoom.value || bounds.versionNonce !== frameElement.versionNonce) {\n const frameNameDiv = document.getElementById(this.getFrameNameDOMId(frameElement));\n\n if (frameNameDiv) {\n const box = frameNameDiv.getBoundingClientRect();\n const boxSceneTopLeft = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX: box.x,\n clientY: box.y\n }, this.state);\n const boxSceneBottomRight = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX: box.right,\n clientY: box.bottom\n }, this.state);\n bounds = {\n x: boxSceneTopLeft.x,\n y: boxSceneTopLeft.y,\n width: boxSceneBottomRight.x - boxSceneTopLeft.x,\n height: boxSceneBottomRight.y - boxSceneTopLeft.y,\n angle: 0,\n zoom: this.state.zoom.value,\n versionNonce: frameElement.versionNonce\n };\n\n this.frameNameBoundsCache._cache.set(frameElement.id, bounds);\n\n return bounds;\n }\n\n return null;\n }\n\n return bounds;\n },\n\n /**\r\n * @private\r\n */\n _cache: new Map()\n };\n\n this.renderFrameNames = () => {\n if (!this.state.frameRendering.enabled || !this.state.frameRendering.name) {\n return null;\n }\n\n const isDarkTheme = this.state.theme === _constants__WEBPACK_IMPORTED_MODULE_12__.THEME.DARK;\n let frameIndex = 0;\n let magicFrameIndex = 0;\n return this.scene.getNonDeletedFramesLikes().map(f => {\n var _a, _b;\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameElement)(f)) {\n frameIndex++;\n } else {\n magicFrameIndex++;\n }\n\n if (!(0,_element_sizeHelpers__WEBPACK_IMPORTED_MODULE_27__.isElementInViewport)(f, this.canvas.width / window.devicePixelRatio, this.canvas.height / window.devicePixelRatio, {\n offsetLeft: this.state.offsetLeft,\n offsetTop: this.state.offsetTop,\n scrollX: this.state.scrollX,\n scrollY: this.state.scrollY,\n zoom: this.state.zoom\n }, this.scene.getNonDeletedElementsMap())) {\n // if frame not visible, don't render its name\n return null;\n }\n\n const {\n x: x1,\n y: y1\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.sceneCoordsToViewportCoords)({\n sceneX: f.x,\n sceneY: f.y\n }, this.state);\n const FRAME_NAME_EDIT_PADDING = 6;\n\n const reset = () => {\n var _a;\n\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(f, {\n name: ((_a = f.name) === null || _a === void 0 ? void 0 : _a.trim()) || null\n });\n this.setState({\n editingFrame: null\n });\n };\n\n let frameNameJSX;\n const frameName = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getFrameLikeTitle)(f, (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameElement)(f) ? frameIndex : magicFrameIndex);\n\n if (f.id === this.state.editingFrame) {\n const frameNameInEdit = frameName;\n frameNameJSX = (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"input\", {\n autoFocus: true,\n value: frameNameInEdit,\n onChange: e => {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(f, {\n name: e.target.value\n });\n },\n onFocus: e => e.target.select(),\n onBlur: () => reset(),\n onKeyDown: event => {\n // for some inexplicable reason, `onBlur` triggered on ESC\n // does not reset `state.editingFrame` despite being called,\n // and we need to reset it here as well\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ESCAPE || event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ENTER) {\n reset();\n }\n },\n style: {\n background: this.state.viewBackgroundColor,\n filter: isDarkTheme ? _constants__WEBPACK_IMPORTED_MODULE_12__.THEME_FILTER : \"none\",\n zIndex: 2,\n border: \"none\",\n display: \"block\",\n padding: `${FRAME_NAME_EDIT_PADDING}px`,\n borderRadius: 4,\n boxShadow: \"inset 0 0 0 2px var(--color-on-primary-container)\",\n fontFamily: \"Assistant\",\n fontSize: \"14px\",\n transform: `translate(-${FRAME_NAME_EDIT_PADDING}px, ${FRAME_NAME_EDIT_PADDING}px)`,\n color: \"var(--color-gray-80)\",\n overflow: \"hidden\",\n maxWidth: `${(0,_obsidianUtils__WEBPACK_IMPORTED_MODULE_86__.getExcalidrawContentEl)().clientWidth - x1 - FRAME_NAME_EDIT_PADDING //zsviczian was document.body\n }px`\n },\n size: frameNameInEdit.length + 1 || 1,\n dir: \"auto\",\n autoComplete: \"off\",\n autoCapitalize: \"off\",\n autoCorrect: \"off\"\n });\n } else {\n frameNameJSX = frameName;\n }\n\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n id: this.getFrameNameDOMId(f),\n style: {\n position: \"absolute\",\n // Positioning from bottom so that we don't to either\n // calculate text height or adjust using transform (which)\n // messes up input position when editing the frame name.\n // This makes the positioning deterministic and we can calculate\n // the same position when rendering to canvas / svg.\n bottom: `${this.state.height + _constants__WEBPACK_IMPORTED_MODULE_12__.FRAME_STYLE.nameOffsetY - y1 + this.state.offsetTop}px`,\n left: `${x1 - this.state.offsetLeft}px`,\n zIndex: 2,\n fontSize: _constants__WEBPACK_IMPORTED_MODULE_12__.FRAME_STYLE.nameFontSize,\n color: (_b = (_a = this.state.frameColor) === null || _a === void 0 ? void 0 : _a.nameColor) !== null && _b !== void 0 ? _b : isDarkTheme //zsviczian\n ? _constants__WEBPACK_IMPORTED_MODULE_12__.FRAME_STYLE.nameColorDarkTheme : _constants__WEBPACK_IMPORTED_MODULE_12__.FRAME_STYLE.nameColorLightTheme,\n lineHeight: _constants__WEBPACK_IMPORTED_MODULE_12__.FRAME_STYLE.nameLineHeight,\n width: \"max-content\",\n maxWidth: `${f.width}px`,\n overflow: f.id === this.state.editingFrame ? \"visible\" : \"hidden\",\n whiteSpace: \"nowrap\",\n textOverflow: \"ellipsis\",\n cursor: _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.MOVE,\n pointerEvents: this.state.viewModeEnabled ? _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_EVENTS.disabled : _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_EVENTS.enabled\n },\n onPointerDown: event => this.handleCanvasPointerDown(event),\n onWheel: event => this.handleWheel(event),\n onContextMenu: this.handleCanvasContextMenu,\n onDoubleClick: () => {\n this.setState({\n editingFrame: f.id\n });\n }\n }, {\n children: frameNameJSX\n }), f.id);\n });\n };\n\n this.focusContainer = () => {\n var _a;\n\n (_a = this.excalidrawContainerRef.current) === null || _a === void 0 ? void 0 : _a.focus();\n };\n\n this.getSceneElementsIncludingDeleted = () => {\n return this.scene.getElementsIncludingDeleted();\n };\n\n this.getSceneElements = () => {\n return this.scene.getNonDeletedElements();\n };\n\n this.onInsertElements = elements => {\n this.addElementsFromPasteOrLibrary({\n elements,\n position: \"center\",\n files: null\n });\n };\n\n this.onExportImage = async (type, elements, opts) => {\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"export\", type, \"ui\");\n const fileHandle = await (0,_data__WEBPACK_IMPORTED_MODULE_13__.exportCanvas)(type, elements, this.state, this.files, {\n exportBackground: this.state.exportBackground,\n name: this.getName(),\n viewBackgroundColor: this.state.viewBackgroundColor,\n exportingFrame: opts.exportingFrame\n }).catch(_utils__WEBPACK_IMPORTED_MODULE_35__.muteFSAbortError).catch(error => {\n console.error(error);\n this.setState({\n errorMessage: error.message\n });\n });\n\n if (this.state.exportEmbedScene && fileHandle && (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.isImageFileHandle)(fileHandle)) {\n this.setState({\n fileHandle\n });\n }\n };\n\n this.magicGenerations = new Map();\n\n this.updateMagicGeneration = ({\n frameElement,\n data\n }) => {\n if (data.status === \"pending\") {\n // We don't wanna persist pending state to storage. It should be in-app\n // state only.\n // Thus reset so that we prefer local cache (if there was some\n // generationData set previously)\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(frameElement, {\n customData: {\n generationData: undefined\n }\n }, false);\n } else {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(frameElement, {\n customData: {\n generationData: data\n }\n }, false);\n }\n\n this.magicGenerations.set(frameElement.id, data);\n this.triggerRender();\n };\n\n this.OPENAI_KEY_IS_PERSISTED = _data_EditorLocalStorage__WEBPACK_IMPORTED_MODULE_77__.EditorLocalStorage.has(_constants__WEBPACK_IMPORTED_MODULE_12__.EDITOR_LS_KEYS.OAI_API_KEY) || false;\n\n this.onOpenAIKeyChange = (openAIKey, shouldPersist) => {\n this.OPENAI_KEY = openAIKey || null;\n\n if (shouldPersist) {\n const didPersist = _data_EditorLocalStorage__WEBPACK_IMPORTED_MODULE_77__.EditorLocalStorage.set(_constants__WEBPACK_IMPORTED_MODULE_12__.EDITOR_LS_KEYS.OAI_API_KEY, openAIKey);\n this.OPENAI_KEY_IS_PERSISTED = didPersist;\n } else {\n this.OPENAI_KEY_IS_PERSISTED = false;\n }\n };\n\n this.onMagicSettingsConfirm = (apiKey, shouldPersist, source) => {\n this.OPENAI_KEY = apiKey || null;\n this.onOpenAIKeyChange(this.OPENAI_KEY, shouldPersist);\n\n if (source === \"settings\") {\n return;\n }\n\n const selectedElements = this.scene.getSelectedElements({\n selectedElementIds: this.state.selectedElementIds\n });\n\n if (apiKey) {\n if (selectedElements.length) {\n this.onMagicframeToolSelect();\n } else {\n this.setActiveTool({\n type: \"magicframe\"\n });\n }\n } else if (!(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isMagicFrameElement)(selectedElements[0])) {\n // even if user didn't end up setting api key, let's pick the tool\n // so they can draw up a frame and move forward\n this.setActiveTool({\n type: \"magicframe\"\n });\n }\n };\n\n this.onMagicframeToolSelect = () => {\n if (!this.OPENAI_KEY) {\n this.setToast({\n message: \"You must first configure your OpenAI API key in plugin settings\",\n duration: 5000\n });\n return;\n }\n\n const selectedElements = this.scene.getSelectedElements({\n selectedElementIds: this.state.selectedElementIds\n });\n\n if (selectedElements.length === 0) {\n this.setActiveTool({\n type: _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.magicframe\n });\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"ai\", \"tool-select (empty-selection)\", \"d2c\");\n } else {\n const selectedMagicFrame = selectedElements.length === 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isMagicFrameElement)(selectedElements[0]) && selectedElements[0]; // case: user selected elements containing frame-like(s) or are frame\n // members, we don't want to wrap into another magicframe\n // (unless the only selected element is a magic frame which we reuse)\n\n if (!selectedMagicFrame && selectedElements.some(el => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(el) || el.frameId)) {\n this.setActiveTool({\n type: _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.magicframe\n });\n return;\n }\n\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"ai\", \"tool-select (existing selection)\", \"d2c\");\n let frame;\n\n if (selectedMagicFrame) {\n // a single magicframe already selected -> use it\n frame = selectedMagicFrame;\n } else {\n // selected elements aren't wrapped in magic frame yet -> wrap now\n const [minX, minY, maxX, maxY] = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getCommonBounds)(selectedElements);\n const padding = 50;\n frame = (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.newMagicFrameElement)(Object.assign(Object.assign({}, _constants__WEBPACK_IMPORTED_MODULE_12__.FRAME_STYLE), {\n x: minX - padding,\n y: minY - padding,\n width: maxX - minX + padding * 2,\n height: maxY - minY + padding * 2,\n opacity: 100,\n locked: false\n }));\n this.scene.insertElement(frame);\n\n for (const child of selectedElements) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(child, {\n frameId: frame.id\n });\n }\n\n this.setState({\n selectedElementIds: {\n [frame.id]: true\n }\n });\n }\n\n this.onMagicFrameGenerate(frame, \"upstream\");\n }\n };\n\n this.openEyeDropper = ({\n type\n }) => {\n _jotai__WEBPACK_IMPORTED_MODULE_56__.jotaiStore.set(_EyeDropper__WEBPACK_IMPORTED_MODULE_62__.activeEyeDropperAtom, {\n swapPreviewOnAlt: true,\n colorPickerType: type === \"stroke\" ? \"elementStroke\" : \"elementBackground\",\n onSelect: (color, event) => {\n const shouldUpdateStrokeColor = type === \"background\" && event.altKey || type === \"stroke\" && !event.altKey;\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (!selectedElements.length || this.state.activeTool.type !== \"selection\") {\n if (shouldUpdateStrokeColor) {\n this.syncActionResult({\n appState: Object.assign(Object.assign({}, this.state), {\n currentItemStrokeColor: color\n }),\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.CAPTURE\n });\n } else {\n this.syncActionResult({\n appState: Object.assign(Object.assign({}, this.state), {\n currentItemBackgroundColor: color\n }),\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.CAPTURE\n });\n }\n } else {\n this.updateScene({\n elements: this.scene.getElementsIncludingDeleted().map(el => {\n if (this.state.selectedElementIds[el.id]) {\n return (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.newElementWith)(el, {\n [shouldUpdateStrokeColor ? \"strokeColor\" : \"backgroundColor\"]: color\n });\n }\n\n return el;\n }),\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.CAPTURE\n });\n }\n },\n keepOpenOnAlt: false\n });\n };\n\n this.syncActionResult = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(actionResult => {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j;\n\n if (this.unmounted || actionResult === false) {\n return;\n }\n\n if (actionResult.storeAction === _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.UPDATE) {\n this.store.shouldUpdateSnapshot();\n } else if (actionResult.storeAction === _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.CAPTURE) {\n this.store.shouldCaptureIncrement();\n }\n\n let didUpdate = false;\n let editingElement = null;\n\n if (actionResult.elements) {\n actionResult.elements.forEach(element => {\n var _a;\n\n if (((_a = this.state.editingElement) === null || _a === void 0 ? void 0 : _a.id) === element.id && this.state.editingElement !== element && (0,_element__WEBPACK_IMPORTED_MODULE_16__.isNonDeletedElement)(element)) {\n editingElement = element;\n }\n });\n this.scene.replaceAllElements(actionResult.elements);\n didUpdate = true;\n }\n\n if (actionResult.files) {\n this.files = actionResult.replaceFiles ? actionResult.files : Object.assign(Object.assign({}, this.files), actionResult.files);\n this.addNewImagesToImageCache();\n }\n\n if (actionResult.appState || editingElement || this.state.contextMenu) {\n let viewModeEnabled = ((_a = actionResult === null || actionResult === void 0 ? void 0 : actionResult.appState) === null || _a === void 0 ? void 0 : _a.viewModeEnabled) || false;\n let zenModeEnabled = ((_b = actionResult === null || actionResult === void 0 ? void 0 : actionResult.appState) === null || _b === void 0 ? void 0 : _b.zenModeEnabled) || false;\n let gridSize = ((_c = actionResult === null || actionResult === void 0 ? void 0 : actionResult.appState) === null || _c === void 0 ? void 0 : _c.gridSize) || null;\n const theme = ((_d = actionResult === null || actionResult === void 0 ? void 0 : actionResult.appState) === null || _d === void 0 ? void 0 : _d.theme) || this.props.theme || _constants__WEBPACK_IMPORTED_MODULE_12__.THEME.LIGHT;\n const name = (_f = (_e = actionResult === null || actionResult === void 0 ? void 0 : actionResult.appState) === null || _e === void 0 ? void 0 : _e.name) !== null && _f !== void 0 ? _f : this.state.name;\n const errorMessage = (_h = (_g = actionResult === null || actionResult === void 0 ? void 0 : actionResult.appState) === null || _g === void 0 ? void 0 : _g.errorMessage) !== null && _h !== void 0 ? _h : this.state.errorMessage;\n\n if (typeof this.props.viewModeEnabled !== \"undefined\") {\n viewModeEnabled = this.props.viewModeEnabled;\n }\n\n if (typeof this.props.zenModeEnabled !== \"undefined\") {\n zenModeEnabled = this.props.zenModeEnabled;\n }\n\n if (typeof this.props.gridModeEnabled !== \"undefined\") {\n gridSize = this.props.gridModeEnabled ? _constants__WEBPACK_IMPORTED_MODULE_12__.GRID_SIZE : null;\n }\n\n editingElement = editingElement || ((_j = actionResult.appState) === null || _j === void 0 ? void 0 : _j.editingElement) || null;\n\n if (editingElement === null || editingElement === void 0 ? void 0 : editingElement.isDeleted) {\n editingElement = null;\n }\n\n this.setState(state => {\n // using Object.assign instead of spread to fool TS 4.2.2+ into\n // regarding the resulting type as not containing undefined\n // (which the following expression will never contain)\n return Object.assign(actionResult.appState || {}, {\n // NOTE this will prevent opening context menu using an action\n // or programmatically from the host, so it will need to be\n // rewritten later\n contextMenu: null,\n editingElement,\n viewModeEnabled,\n zenModeEnabled,\n gridSize,\n theme,\n name,\n errorMessage\n });\n });\n didUpdate = true;\n }\n\n if (!didUpdate && actionResult.storeAction !== _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.NONE) {\n this.scene.triggerUpdate();\n }\n }); // Lifecycle\n\n this.onBlur = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(() => {\n isHoldingSpace = false;\n this.setState({\n isBindingEnabled: true\n });\n });\n\n this.onUnload = () => {\n this.onBlur();\n };\n\n this.disableEvent = event => {\n event.preventDefault();\n };\n\n this.resetHistory = () => {\n this.history.clear();\n };\n\n this.resetStore = () => {\n this.store.clear();\n };\n /**\r\n * Resets scene & history.\r\n * ! Do not use to clear scene user action !\r\n */\n\n\n this.resetScene = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(opts => {\n this.scene.replaceAllElements([]);\n this.setState(state => Object.assign(Object.assign({}, (0,_appState__WEBPACK_IMPORTED_MODULE_10__.getDefaultAppState)()), {\n isLoading: (opts === null || opts === void 0 ? void 0 : opts.resetLoadingState) ? false : state.isLoading,\n theme: this.state.theme\n }));\n this.resetStore();\n this.resetHistory();\n });\n\n this.initializeScene = async () => {\n var _a;\n\n if (\"launchQueue\" in window && \"LaunchParams\" in window) {\n window.launchQueue.setConsumer(async launchParams => {\n if (!launchParams.files.length) {\n return;\n }\n\n const fileHandle = launchParams.files[0];\n const blob = await fileHandle.getFile();\n this.loadFileToCanvas(new File([blob], blob.name || \"\", {\n type: blob.type\n }), fileHandle);\n });\n }\n\n if (this.props.theme) {\n this.setState({\n theme: this.props.theme\n });\n }\n\n if (!this.state.isLoading) {\n this.setState({\n isLoading: true\n });\n }\n\n let initialData = null;\n\n try {\n if (typeof this.props.initialData === \"function\") {\n initialData = (await this.props.initialData()) || null;\n } else {\n initialData = (await this.props.initialData) || null;\n }\n\n if (initialData === null || initialData === void 0 ? void 0 : initialData.libraryItems) {\n this.library.updateLibrary({\n libraryItems: initialData.libraryItems,\n merge: true\n }).catch(error => {\n console.error(error);\n });\n }\n } catch (error) {\n console.error(error);\n initialData = {\n appState: {\n errorMessage: error.message || \"Encountered an error during importing or restoring scene data\"\n }\n };\n }\n\n const scene = (0,_data_restore__WEBPACK_IMPORTED_MODULE_15__.restore)(initialData, null, null, {\n repairBindings: true\n });\n scene.appState = Object.assign(Object.assign({}, scene.appState), {\n theme: this.props.theme || scene.appState.theme,\n // we're falling back to current (pre-init) state when deciding\n // whether to open the library, to handle a case where we\n // update the state outside of initialData (e.g. when loading the app\n // with a library install link, which should auto-open the library)\n openSidebar: ((_a = scene.appState) === null || _a === void 0 ? void 0 : _a.openSidebar) || this.state.openSidebar,\n activeTool: scene.appState.activeTool.type === \"image\" ? Object.assign(Object.assign({}, scene.appState.activeTool), {\n type: \"selection\"\n }) : scene.appState.activeTool,\n isLoading: false,\n toast: this.state.toast\n });\n\n if (initialData === null || initialData === void 0 ? void 0 : initialData.scrollToContent) {\n scene.appState = Object.assign(Object.assign({}, scene.appState), (0,_scene__WEBPACK_IMPORTED_MODULE_29__.calculateScrollCenter)(scene.elements, Object.assign(Object.assign({}, scene.appState), {\n width: this.state.width,\n height: this.state.height,\n offsetTop: this.state.offsetTop,\n offsetLeft: this.state.offsetLeft\n })));\n } // FontFaceSet loadingdone event we listen on may not always fire\n // (looking at you Safari), so on init we manually load fonts for current\n // text elements on canvas, and rerender them once done. This also\n // seems faster even in browsers that do fire the loadingdone event.\n\n\n this.fonts.loadFontsForElements(scene.elements);\n this.resetStore();\n this.resetHistory();\n this.syncActionResult(Object.assign(Object.assign({}, scene), {\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.UPDATE\n }));\n };\n\n this.isMobileBreakpoint = (width, height) => {\n return width !== 0 && //zsviczian changing tabs in Obsidian causes MobileMenu to be rendered\n this.allowMobileMode && ( //zsviczian\n width < _constants__WEBPACK_IMPORTED_MODULE_12__.MQ_MAX_WIDTH_PORTRAIT || height < _constants__WEBPACK_IMPORTED_MODULE_12__.MQ_MAX_HEIGHT_LANDSCAPE && width < _constants__WEBPACK_IMPORTED_MODULE_12__.MQ_MAX_WIDTH_LANDSCAPE);\n };\n\n this.refreshViewportBreakpoints = () => {\n const container = this.excalidrawContainerRef.current;\n\n if (!container) {\n return;\n }\n\n const {\n clientWidth: viewportWidth,\n clientHeight: viewportHeight\n } = (0,_obsidianUtils__WEBPACK_IMPORTED_MODULE_86__.getExcalidrawContentEl)(); //zsviczian was document.body;\n\n const prevViewportState = this.device.viewport;\n const nextViewportState = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateObject)(prevViewportState, {\n isLandscape: viewportWidth > viewportHeight,\n isMobile: this.isMobileBreakpoint(viewportWidth, viewportHeight)\n });\n\n if (prevViewportState !== nextViewportState) {\n this.device = Object.assign(Object.assign({}, this.device), {\n viewport: nextViewportState\n });\n return true;\n }\n\n return false;\n };\n\n this.refreshEditorBreakpoints = () => {\n const container = this.excalidrawContainerRef.current;\n\n if (!container) {\n return;\n }\n\n const {\n width: editorWidth,\n height: editorHeight\n } = container.getBoundingClientRect();\n const sidebarBreakpoint = this.props.UIOptions.dockedSidebarBreakpoint != null ? this.props.UIOptions.dockedSidebarBreakpoint : _constants__WEBPACK_IMPORTED_MODULE_12__.MQ_RIGHT_SIDEBAR_MIN_WIDTH;\n const prevEditorState = this.device.editor;\n const nextEditorState = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateObject)(prevEditorState, {\n isMobile: this.isMobileBreakpoint(editorWidth, editorHeight),\n canFitSidebar: editorWidth > sidebarBreakpoint\n });\n\n if (prevEditorState !== nextEditorState) {\n this.device = Object.assign(Object.assign({}, this.device), {\n editor: nextEditorState\n });\n return true;\n }\n\n return false;\n };\n\n this.onResize = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(() => {\n this.scene.getElementsIncludingDeleted().forEach(element => _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_67__.ShapeCache[\"delete\"](element));\n this.refreshViewportBreakpoints();\n this.updateDOMRect();\n\n if (!_constants__WEBPACK_IMPORTED_MODULE_12__.supportsResizeObserver) {\n this.refreshEditorBreakpoints();\n }\n\n this.setState({});\n });\n /** generally invoked only if fullscreen was invoked programmatically */\n\n this.onFullscreenChange = () => {\n var _a;\n\n if ( // points to the iframe element we fullscreened\n !document.fullscreenElement && ((_a = this.state.activeEmbeddable) === null || _a === void 0 ? void 0 : _a.state) === \"active\") {\n this.setState({\n activeEmbeddable: null\n });\n }\n };\n\n this.renderInteractiveSceneCallback = ({\n atLeastOneVisibleElement,\n scrollBars,\n elementsMap\n }) => {\n if (!document.querySelector(\".excalidraw\")) {\n return;\n } //zsviczian - address issue when moving excalidraw to a new window/document\n\n\n if (scrollBars) {\n currentScrollBars = scrollBars;\n }\n\n const scrolledOutside = // hide when editing text\n (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(this.state.editingElement) ? false : !atLeastOneVisibleElement && elementsMap.size > 0;\n\n if (this.state.scrolledOutside !== scrolledOutside) {\n this.setState({\n scrolledOutside\n });\n }\n\n this.scheduleImageRefresh();\n };\n\n this.onScroll = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.debounce)(() => {\n const {\n offsetTop,\n offsetLeft\n } = this.getCanvasOffsets();\n this.setState(state => {\n if (state.offsetLeft === offsetLeft && state.offsetTop === offsetTop) {\n return null;\n }\n\n return {\n offsetTop,\n offsetLeft\n };\n });\n }, _constants__WEBPACK_IMPORTED_MODULE_12__.SCROLL_TIMEOUT); // Copy/paste\n\n this.onCut = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n var _a;\n\n const isExcalidrawActive = (_a = this.excalidrawContainerRef.current) === null || _a === void 0 ? void 0 : _a.contains(document.activeElement);\n\n if (!isExcalidrawActive || (0,_utils__WEBPACK_IMPORTED_MODULE_35__.isWritableElement)(event.target)) {\n return;\n }\n\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionCut, \"keyboard\", event);\n event.preventDefault();\n event.stopPropagation();\n });\n this.onCopy = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n var _a;\n\n const isExcalidrawActive = (_a = this.excalidrawContainerRef.current) === null || _a === void 0 ? void 0 : _a.contains(document.activeElement);\n\n if (!isExcalidrawActive || (0,_utils__WEBPACK_IMPORTED_MODULE_35__.isWritableElement)(event.target)) {\n return;\n }\n\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionCopy, \"keyboard\", event);\n event.preventDefault();\n event.stopPropagation();\n });\n\n this.onTouchStart = event => {\n // fix for Apple Pencil Scribble (do not prevent for other devices)\n if (_constants__WEBPACK_IMPORTED_MODULE_12__.isIOS) {\n event.preventDefault();\n }\n\n if (!didTapTwice) {\n didTapTwice = true;\n clearTimeout(tappedTwiceTimer);\n tappedTwiceTimer = window.setTimeout(App.resetTapTwice, _constants__WEBPACK_IMPORTED_MODULE_12__.TAP_TWICE_TIMEOUT);\n return;\n } // insert text only if we tapped twice with a single finger\n // event.touches.length === 1 will also prevent inserting text when user's zooming\n\n\n if (didTapTwice && event.touches.length === 1) {\n const touch = event.touches[0]; // @ts-ignore\n\n this.handleCanvasDoubleClick({\n clientX: touch.clientX,\n clientY: touch.clientY\n });\n didTapTwice = false;\n clearTimeout(tappedTwiceTimer);\n }\n\n if (event.touches.length === 2) {\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n activeEmbeddable: null\n });\n }\n };\n\n this.onTouchEnd = event => {\n this.resetContextMenuTimer();\n\n if (event.touches.length > 0) {\n this.setState({\n previousSelectedElementIds: {},\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(this.state.previousSelectedElementIds, this.state)\n });\n } else {\n gesture.pointers.clear();\n }\n };\n\n this.pasteFromClipboard = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(async event => {\n var _a, _b;\n\n const isPlainPaste = !!IS_PLAIN_PASTE; // #686\n\n const target = document.activeElement;\n const isExcalidrawActive = (_a = this.excalidrawContainerRef.current) === null || _a === void 0 ? void 0 : _a.contains(target);\n\n if (event && !isExcalidrawActive) {\n return;\n }\n\n const elementUnderCursor = document.elementFromPoint(this.lastViewportPosition.x, this.lastViewportPosition.y);\n\n if (event && (!(elementUnderCursor instanceof HTMLCanvasElement) || (0,_utils__WEBPACK_IMPORTED_MODULE_35__.isWritableElement)(target))) {\n return;\n }\n\n const {\n x: sceneX,\n y: sceneY\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX: this.lastViewportPosition.x,\n clientY: this.lastViewportPosition.y\n }, this.state); // must be called in the same frame (thus before any awaits) as the paste\n // event else some browsers (FF...) will clear the clipboardData\n // (something something security)\n\n let file = (_b = event === null || event === void 0 ? void 0 : event.clipboardData) === null || _b === void 0 ? void 0 : _b.files[0];\n const data = await (0,_clipboard__WEBPACK_IMPORTED_MODULE_11__.parseClipboard)(event, isPlainPaste);\n\n if (!file && !isPlainPaste) {\n if (data.mixedContent) {\n return this.addElementsFromMixedContentPaste(data.mixedContent, {\n isPlainPaste,\n sceneX,\n sceneY\n });\n } else if (data.text) {\n const string = data.text.trim();\n\n if (string.startsWith(\"<svg\") && string.endsWith(\"</svg>\")) {\n // ignore SVG validation/normalization which will be done during image\n // initialization\n file = (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.SVGStringToFile)(string);\n }\n }\n } // prefer spreadsheet data over image file (MS Office/Libre Office)\n\n\n if ((0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.isSupportedImageFile)(file) && !data.spreadsheet) {\n if (!this.isToolSupported(\"image\")) {\n this.setState({\n errorMessage: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.imageToolNotSupported\")\n });\n return;\n }\n\n const imageElement = this.createImageElement({\n sceneX,\n sceneY\n });\n this.insertImageElement(imageElement, file);\n this.initializeImageDimensions(imageElement);\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({\n [imageElement.id]: true\n }, this.state)\n });\n return;\n }\n\n if (this.props.onPaste) {\n try {\n if ((await this.props.onPaste(data, event)) === false) {\n return;\n }\n } catch (error) {\n console.error(error);\n }\n }\n\n if (data.errorMessage) {\n this.setState({\n errorMessage: data.errorMessage\n });\n } else if (data.spreadsheet && !isPlainPaste) {\n this.setState({\n pasteDialog: {\n data: data.spreadsheet,\n shown: true\n }\n });\n } else if (data.elements) {\n const elements = data.programmaticAPI ? (0,_data_transform__WEBPACK_IMPORTED_MODULE_63__.convertToExcalidrawElements)(data.elements) : data.elements; // TODO remove formatting from elements if isPlainPaste\n\n this.addElementsFromPasteOrLibrary({\n elements,\n files: data.files || null,\n position: \"cursor\",\n retainSeed: isPlainPaste\n });\n } else if (data.text) {\n if (data.text && (0,_mermaid__WEBPACK_IMPORTED_MODULE_96__.isMaybeMermaidDefinition)(data.text)) {\n const api = await Promise.resolve(/*! import() */).then(__webpack_require__.bind(__webpack_require__, /*! @zsviczian/mermaid-to-excalidraw */ \"../../node_modules/@zsviczian/mermaid-to-excalidraw/dist/index.js\")); //zsviczian\n\n try {\n const {\n elements: skeletonElements,\n files\n } = await api.parseMermaidToExcalidraw(data.text, {\n fontSize: _constants__WEBPACK_IMPORTED_MODULE_12__.DEFAULT_FONT_SIZE\n });\n const elements = (0,_data_transform__WEBPACK_IMPORTED_MODULE_63__.convertToExcalidrawElements)(skeletonElements, {\n regenerateIds: true\n });\n this.addElementsFromPasteOrLibrary({\n elements,\n files,\n position: \"cursor\"\n });\n return;\n } catch (err) {\n console.warn(`parsing pasted text as mermaid definition failed: ${err.message}`);\n }\n }\n\n const nonEmptyLines = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.normalizeEOL)(data.text).split(/\\n+/).map(s => s.trim()).filter(Boolean);\n const embbeddableUrls = nonEmptyLines.map(str => (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.maybeParseEmbedSrc)(str)).filter(string => {\n var _a;\n\n return (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.embeddableURLValidator)(string, this.props.validateEmbeddable) && (/^(http|https):\\/\\/[^\\s/$.?#].[^\\s]*$/.test(string) || ((_a = (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.getEmbedLink)(string)) === null || _a === void 0 ? void 0 : _a.type) === \"video\");\n });\n\n if (!IS_PLAIN_PASTE && embbeddableUrls.length > 0 && // if there were non-embeddable text (lines) mixed in with embeddable\n // urls, ignore and paste as text\n embbeddableUrls.length === nonEmptyLines.length) {\n const embeddables = [];\n\n for (const url of embbeddableUrls) {\n const prevEmbeddable = embeddables[embeddables.length - 1];\n const embeddable = this.insertEmbeddableElement({\n sceneX: prevEmbeddable ? prevEmbeddable.x + prevEmbeddable.width + 20 : sceneX,\n sceneY,\n link: (0,_data_url__WEBPACK_IMPORTED_MODULE_47__.normalizeLink)(url)\n });\n\n if (embeddable) {\n embeddables.push(embeddable);\n }\n }\n\n if (embeddables.length) {\n this.setState({\n selectedElementIds: Object.fromEntries(embeddables.map(embeddable => [embeddable.id, true]))\n });\n }\n\n return;\n }\n\n this.addTextFromPaste(data.text, isPlainPaste);\n }\n\n this.setActiveTool({\n type: \"selection\"\n });\n event === null || event === void 0 ? void 0 : event.preventDefault();\n });\n\n this.addElementsFromPasteOrLibrary = opts => {\n const elements = (0,_data_restore__WEBPACK_IMPORTED_MODULE_15__.restoreElements)(opts.elements, null, undefined);\n const [minX, minY, maxX, maxY] = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getCommonBounds)(elements);\n const elementsCenterX = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.distance)(minX, maxX) / 2;\n const elementsCenterY = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.distance)(minY, maxY) / 2;\n const clientX = typeof opts.position === \"object\" ? opts.position.clientX : opts.position === \"cursor\" ? this.lastViewportPosition.x : this.state.width / 2 + this.state.offsetLeft;\n const clientY = typeof opts.position === \"object\" ? opts.position.clientY : opts.position === \"cursor\" ? this.lastViewportPosition.y : this.state.height / 2 + this.state.offsetTop;\n const {\n x,\n y\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX,\n clientY\n }, this.state);\n const dx = x - elementsCenterX;\n const dy = y - elementsCenterY;\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(dx, dy, this.state.gridSize);\n const newElements = (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.duplicateElements)(elements.map(element => {\n return (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.newElementWith)(element, {\n x: element.x + gridX - minX,\n y: element.y + gridY - minY\n });\n }), {\n randomizeSeed: !opts.retainSeed\n });\n const prevElements = this.scene.getElementsIncludingDeleted();\n const nextElements = [...prevElements, ...newElements];\n (0,_fractionalIndex__WEBPACK_IMPORTED_MODULE_90__.syncMovedIndices)(nextElements, (0,_utils__WEBPACK_IMPORTED_MODULE_35__.arrayToMap)(newElements));\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords({\n x,\n y\n });\n\n if (topLayerFrame) {\n const eligibleElements = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.filterElementsEligibleAsFrameChildren)(newElements, topLayerFrame);\n (0,_frame__WEBPACK_IMPORTED_MODULE_51__.addElementsToFrame)(nextElements, eligibleElements, topLayerFrame);\n }\n\n this.scene.replaceAllElements(nextElements);\n newElements.forEach(newElement => {\n if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(newElement) && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBoundToContainer)(newElement)) {\n const container = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getContainerElement)(newElement, this.scene.getElementsMapIncludingDeleted());\n (0,_element__WEBPACK_IMPORTED_MODULE_16__.redrawTextBoundingBox)(newElement, container, this.scene.getElementsMapIncludingDeleted());\n }\n });\n\n if (opts.files) {\n this.files = Object.assign(Object.assign({}, this.files), opts.files);\n }\n\n this.store.shouldCaptureIncrement();\n const nextElementsToSelect = (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.excludeElementsInFramesFromSelection)(newElements);\n this.setState(Object.assign(Object.assign(Object.assign({}, this.state), {\n // keep sidebar (presumably the library) open if it's docked and\n // can fit.\n //\n // Note, we should close the sidebar only if we're dropping items\n // from library, not when pasting from clipboard. Alas.\n openSidebar: this.state.openSidebar && this.device.editor.canFitSidebar && _jotai__WEBPACK_IMPORTED_MODULE_56__.jotaiStore.get(_Sidebar_Sidebar__WEBPACK_IMPORTED_MODULE_64__.isSidebarDockedAtom) ? this.state.openSidebar : null\n }), (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: null,\n selectedElementIds: nextElementsToSelect.reduce((acc, element) => {\n if (!(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBoundToContainer)(element)) {\n acc[element.id] = true;\n }\n\n return acc;\n }, {})\n }, this.scene.getNonDeletedElements(), this.state, this)), () => {\n if (opts.files) {\n this.addNewImagesToImageCache();\n }\n });\n this.setActiveTool({\n type: \"selection\"\n });\n\n if (opts.fitToContent) {\n this.scrollToContent(newElements, {\n fitToContent: true\n });\n }\n };\n\n this.setAppState = (state, callback) => {\n this.setState(state, callback);\n };\n\n this.removePointer = event => {\n if (touchTimeout) {\n this.resetContextMenuTimer();\n }\n\n gesture.pointers.delete(event.pointerId);\n };\n\n this.toggleLock = (source = \"ui\") => {\n if (!this.state.activeTool.locked) {\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"toolbar\", \"toggleLock\", `${source} (${this.device.editor.isMobile ? \"mobile\" : \"desktop\"})`);\n }\n\n this.setState(prevState => {\n return {\n activeTool: Object.assign(Object.assign(Object.assign({}, prevState.activeTool), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, prevState.activeTool.locked ? {\n type: \"selection\"\n } : prevState.activeTool)), {\n locked: !prevState.activeTool.locked\n })\n };\n });\n };\n\n this.updateFrameRendering = opts => {\n this.setState(prevState => {\n var _a, _b, _c, _d;\n\n const next = typeof opts === \"function\" ? opts(prevState.frameRendering) : opts;\n return {\n frameRendering: {\n enabled: (_a = next === null || next === void 0 ? void 0 : next.enabled) !== null && _a !== void 0 ? _a : prevState.frameRendering.enabled,\n clip: (_b = next === null || next === void 0 ? void 0 : next.clip) !== null && _b !== void 0 ? _b : prevState.frameRendering.clip,\n name: (_c = next === null || next === void 0 ? void 0 : next.name) !== null && _c !== void 0 ? _c : prevState.frameRendering.name,\n outline: (_d = next === null || next === void 0 ? void 0 : next.outline) !== null && _d !== void 0 ? _d : prevState.frameRendering.outline\n }\n };\n });\n };\n\n this.togglePenMode = force => {\n this.setState(prevState => {\n return {\n penMode: force !== null && force !== void 0 ? force : !prevState.penMode,\n penDetected: true\n };\n });\n };\n\n this.onHandToolToggle = () => {\n //zsviczian added timeout because button won't select otherwise\n setTimeout(() => this.actionManager.executeAction(_actions_actionCanvas__WEBPACK_IMPORTED_MODULE_55__.actionToggleHandTool));\n };\n /**\r\n * Zooms on canvas viewport center\r\n */\n\n\n this.zoomCanvas = (\n /** decimal fraction between 0.1 (10% zoom) and 30 (3000% zoom) */\n value) => {\n this.setState(Object.assign({}, (0,_scene_zoom__WEBPACK_IMPORTED_MODULE_31__.getStateForZoom)({\n viewportX: this.state.width / 2 + this.state.offsetLeft,\n viewportY: this.state.height / 2 + this.state.offsetTop,\n nextZoom: (0,_scene__WEBPACK_IMPORTED_MODULE_29__.getNormalizedZoom)(value)\n }, this.state)));\n };\n\n this.cancelInProgressAnimation = null;\n\n this.scrollToContent = (target = this.scene.getNonDeletedElements(), opts) => {\n var _a, _b;\n\n (_a = this.cancelInProgressAnimation) === null || _a === void 0 ? void 0 : _a.call(this); // convert provided target into ExcalidrawElement[] if necessary\n\n const targetElements = Array.isArray(target) ? target : [target];\n let zoom = this.state.zoom;\n let scrollX = this.state.scrollX;\n let scrollY = this.state.scrollY;\n\n if ((opts === null || opts === void 0 ? void 0 : opts.fitToContent) || (opts === null || opts === void 0 ? void 0 : opts.fitToViewport)) {\n const {\n appState\n } = (0,_actions_actionCanvas__WEBPACK_IMPORTED_MODULE_55__.zoomToFit)({\n targetElements,\n appState: this.state,\n fitToViewport: !!(opts === null || opts === void 0 ? void 0 : opts.fitToViewport),\n viewportZoomFactor: opts === null || opts === void 0 ? void 0 : opts.viewportZoomFactor\n });\n zoom = appState.zoom;\n scrollX = appState.scrollX;\n scrollY = appState.scrollY;\n } else {\n // compute only the viewport location, without any zoom adjustment\n const scroll = (0,_scene__WEBPACK_IMPORTED_MODULE_29__.calculateScrollCenter)(targetElements, this.state);\n scrollX = scroll.scrollX;\n scrollY = scroll.scrollY;\n } // when animating, we use RequestAnimationFrame to prevent the animation\n // from slowing down other processes\n\n\n if (opts === null || opts === void 0 ? void 0 : opts.animate) {\n const origScrollX = this.state.scrollX;\n const origScrollY = this.state.scrollY;\n const origZoom = this.state.zoom.value;\n const cancel = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.easeToValuesRAF)({\n fromValues: {\n scrollX: origScrollX,\n scrollY: origScrollY,\n zoom: origZoom\n },\n toValues: {\n scrollX,\n scrollY,\n zoom: zoom.value\n },\n interpolateValue: (from, to, progress, key) => {\n // for zoom, use different easing\n if (key === \"zoom\") {\n return from * Math.pow(to / from, (0,_utils__WEBPACK_IMPORTED_MODULE_35__.easeOut)(progress));\n } // handle using default\n\n\n return undefined;\n },\n onStep: ({\n scrollX,\n scrollY,\n zoom\n }) => {\n this.setState({\n scrollX,\n scrollY,\n zoom: {\n value: zoom\n }\n });\n },\n onStart: () => {\n this.setState({\n shouldCacheIgnoreZoom: true\n });\n },\n onEnd: () => {\n this.setState({\n shouldCacheIgnoreZoom: false\n });\n },\n onCancel: () => {\n this.setState({\n shouldCacheIgnoreZoom: false\n });\n },\n duration: (_b = opts === null || opts === void 0 ? void 0 : opts.duration) !== null && _b !== void 0 ? _b : 500\n });\n\n this.cancelInProgressAnimation = () => {\n cancel();\n this.cancelInProgressAnimation = null;\n };\n } else {\n this.setState({\n scrollX,\n scrollY,\n zoom\n });\n }\n };\n\n this.maybeUnfollowRemoteUser = () => {\n if (this.state.userToFollow) {\n this.setState({\n userToFollow: null\n });\n }\n };\n /** use when changing scrollX/scrollY/zoom based on user interaction */\n\n\n this.translateCanvas = state => {\n var _a;\n\n (_a = this.cancelInProgressAnimation) === null || _a === void 0 ? void 0 : _a.call(this);\n this.maybeUnfollowRemoteUser();\n this.setState(state);\n }; //zsviczian\n\n\n this.zoomToFit = (target = this.scene.getNonDeletedElements(), maxZoom = 1, //null will zoom to max based on viewport\n margin = 0.03) => {\n if (!target) {\n target = this.scene.getNonDeletedElements();\n }\n\n if (target.length === 0) {\n maxZoom = 1;\n }\n\n this.setState((0,_actions_actionCanvas__WEBPACK_IMPORTED_MODULE_55__.zoomToFitElements)(target, this.state, false, this, maxZoom, margin).appState);\n }; //zsviczian\n\n\n this.startLineEditor = (el, selectedPointsIndices = null) => {\n if (!el || !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(el)) {\n return;\n }\n\n const editingLinearElement = new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(el);\n this.setState({\n selectedLinearElement: editingLinearElement,\n editingLinearElement: Object.assign(Object.assign({}, editingLinearElement), {\n selectedPointsIndices\n })\n });\n }; //zsviczian\n\n\n this.updateContainerSize = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(containers => {\n containers.forEach(el => {\n const [x, y] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.rotate)(el.x + el.width, el.y + el.height, el.x + el.width / 2, el.y + el.height / 2, el.angle);\n (0,_element_resizeElements__WEBPACK_IMPORTED_MODULE_93__.resizeSingleElement)(new Map().set(el.id, el), false, el, this.scene.getElementsMapIncludingDeleted(), \"se\", true, x, y);\n });\n });\n\n this.setToast = toast => {\n this.setState({\n toast\n });\n };\n\n this.restoreFileFromShare = async () => {\n try {\n const webShareTargetCache = await caches.open(\"web-share-target\");\n const response = await webShareTargetCache.match(\"shared-file\");\n\n if (response) {\n const blob = await response.blob();\n const file = new File([blob], blob.name || \"\", {\n type: blob.type\n });\n this.loadFileToCanvas(file, null);\n await webShareTargetCache.delete(\"shared-file\");\n window.history.replaceState(null, _constants__WEBPACK_IMPORTED_MODULE_12__.APP_NAME, window.location.pathname);\n }\n } catch (error) {\n this.setState({\n errorMessage: error.message\n });\n }\n };\n /** adds supplied files to existing files in the appState */\n\n\n this.addFiles = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(files => {\n const filesMap = files.reduce((acc, fileData) => {\n acc.set(fileData.id, fileData);\n return acc;\n }, new Map());\n this.files = Object.assign(Object.assign({}, this.files), Object.fromEntries(filesMap));\n this.scene.getNonDeletedElements().forEach(element => {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isInitializedImageElement)(element) && filesMap.has(element.fileId)) {\n this.imageCache.delete(element.fileId);\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_67__.ShapeCache[\"delete\"](element);\n }\n });\n this.scene.triggerUpdate();\n this.addNewImagesToImageCache();\n }); //zsviczian https://github.com/zsviczian/excalibrain/issues/9\n\n this.setMobileModeAllowed = allow => {\n const {\n width: editorWidth,\n height: editorHeight\n } = this.excalidrawContainerRef.current.getBoundingClientRect();\n this.allowMobileMode = allow;\n const prevEditorState = this.device.editor;\n let nextEditorState;\n\n if (allow) {\n nextEditorState = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateObject)(prevEditorState, {\n isMobile: this.isMobileBreakpoint(editorWidth, editorHeight)\n });\n } else {\n nextEditorState = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateObject)(prevEditorState, {\n isMobile: false //must test this\n\n });\n }\n\n if (prevEditorState !== nextEditorState) {\n this.device = Object.assign(Object.assign({}, this.device), {\n editor: nextEditorState\n });\n this.forceUpdate();\n }\n }; //zsviczian\n\n\n this.setLocalFont = showOnPanel => {\n showFourthFont = showOnPanel;\n }; //zsviczian\n\n\n this.selectElements = elements => {\n this.updateScene({\n appState: Object.assign(Object.assign({}, this.state), {\n editingGroupId: null,\n selectedElementIds: elements.reduce((map, element) => {\n map[element.id] = true;\n return map;\n }, {})\n }),\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.NONE,\n forceFlushSync: true\n });\n };\n\n this.bringToFront = elements => {\n this.selectElements(elements);\n this.updateScene(_actions__WEBPACK_IMPORTED_MODULE_5__.actionBringToFront.perform(this.scene.getNonDeletedElements(), this.state));\n };\n\n this.bringForward = elements => {\n this.selectElements(elements);\n this.updateScene(_actions__WEBPACK_IMPORTED_MODULE_5__.actionBringForward.perform(this.scene.getNonDeletedElements(), this.state));\n };\n\n this.sendToBack = elements => {\n this.selectElements(elements);\n this.updateScene(_actions__WEBPACK_IMPORTED_MODULE_5__.actionSendToBack.perform(this.scene.getNonDeletedElements(), this.state));\n };\n\n this.sendBackward = elements => {\n this.selectElements(elements);\n this.updateScene(_actions__WEBPACK_IMPORTED_MODULE_5__.actionSendBackward.perform(this.scene.getNonDeletedElements(), this.state));\n };\n\n this.updateScene = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(sceneData => {\n var _a;\n\n const nextElements = (0,_fractionalIndex__WEBPACK_IMPORTED_MODULE_90__.syncInvalidIndices)((_a = sceneData.elements) !== null && _a !== void 0 ? _a : []);\n\n if (sceneData.storeAction && sceneData.storeAction !== _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.NONE) {\n const prevCommittedAppState = this.store.snapshot.appState;\n const prevCommittedElements = this.store.snapshot.elements;\n const nextCommittedAppState = sceneData.appState ? Object.assign({}, prevCommittedAppState, sceneData.appState) // new instance, with partial appstate applied to previously captured one, including hidden prop inside `prevCommittedAppState`\n : prevCommittedAppState;\n const nextCommittedElements = sceneData.elements ? this.store.filterUncomittedElements(this.scene.getElementsMapIncludingDeleted(), // Only used to detect uncomitted local elements\n (0,_utils__WEBPACK_IMPORTED_MODULE_35__.arrayToMap)(nextElements)) : prevCommittedElements; // WARN: store action always performs deep clone of changed elements, for ephemeral remote updates (i.e. remote dragging, resizing, drawing) we might consider doing something smarter\n // do NOT schedule store actions (execute after re-render), as it might cause unexpected concurrency issues if not handled well\n\n if (sceneData.storeAction === _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.CAPTURE) {\n this.store.captureIncrement(nextCommittedElements, nextCommittedAppState);\n } else if (sceneData.storeAction === _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.UPDATE) {\n this.store.updateSnapshot(nextCommittedElements, nextCommittedAppState);\n }\n } //zsviczian forceFlushSync is set to true in ExcalidrawView.updateScene.\n //without this e.g. text search did not select the elements\n\n\n if (sceneData.forceFlushSync === true) {\n (0,react_dom__WEBPACK_IMPORTED_MODULE_2__.flushSync)(() => {\n if (sceneData.appState) {\n this.setState(sceneData.appState);\n }\n });\n } else {\n if (sceneData.appState) {\n this.setState(sceneData.appState);\n }\n }\n\n if (sceneData.elements) {\n this.scene.replaceAllElements(nextElements);\n }\n\n if (sceneData.collaborators) {\n this.setState({\n collaborators: sceneData.collaborators\n });\n }\n });\n\n this.triggerRender = (\n /** force always re-renders canvas even if no change */\n force) => {\n if (force === true) {\n this.scene.triggerUpdate();\n } else {\n this.setState({});\n }\n };\n /**\r\n * @returns whether the menu was toggled on or off\r\n */\n\n\n this.toggleSidebar = ({\n name,\n tab,\n force\n }) => {\n var _a, _b;\n\n let nextName;\n\n if (force === undefined) {\n nextName = ((_a = this.state.openSidebar) === null || _a === void 0 ? void 0 : _a.name) === name && ((_b = this.state.openSidebar) === null || _b === void 0 ? void 0 : _b.tab) === tab ? null : name;\n } else {\n nextName = force ? name : null;\n }\n\n const nextState = nextName ? {\n name: nextName\n } : null;\n\n if (nextState && tab) {\n nextState.tab = tab;\n }\n\n this.setState({\n openSidebar: nextState\n });\n return !!nextName;\n };\n\n this.updateCurrentCursorPosition = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n this.lastViewportPosition.x = event.clientX;\n this.lastViewportPosition.y = event.clientY;\n }); // Input handling\n\n this.onKeyDown = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n if (this.state.activeTool.type === \"selection\" && this.state.resizingElement && (event.shiftKey || event.altKey)) {\n event.stopPropagation(); //zsviczian shift fires repeatedly causing slowdown when resizing sticky notes\n\n return;\n } // normalize `event.key` when CapsLock is pressed #2372\n\n\n if (\"Proxy\" in window && (!event.shiftKey && /^[A-Z]$/.test(event.key) || event.shiftKey && /^[a-z]$/.test(event.key))) {\n event = new Proxy(event, {\n get(ev, prop) {\n const value = ev[prop];\n\n if (typeof value === \"function\") {\n // fix for Proxies hijacking `this`\n return value.bind(ev);\n }\n\n return prop === \"key\" ? // CapsLock inverts capitalization based on ShiftKey, so invert\n // it back\n event.shiftKey ? ev.key.toUpperCase() : ev.key.toLowerCase() : value;\n }\n\n });\n }\n\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.P && !event.shiftKey && !event.altKey) {\n this.setToast({\n message: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"commandPalette.shortcutHint\", {\n shortcut: (0,_actions_shortcuts__WEBPACK_IMPORTED_MODULE_92__.getShortcutFromShortcutName)(\"commandPalette\")\n })\n });\n event.preventDefault();\n return;\n }\n\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && event.key.toLowerCase() === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.V) {\n IS_PLAIN_PASTE = event.shiftKey;\n clearTimeout(IS_PLAIN_PASTE_TIMER); // reset (100ms to be safe that we it runs after the ensuing\n // paste event). Though, technically unnecessary to reset since we\n // (re)set the flag before each paste event.\n\n IS_PLAIN_PASTE_TIMER = window.setTimeout(() => {\n IS_PLAIN_PASTE = false;\n }, 100);\n } // prevent browser zoom in input fields\n\n\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && (0,_utils__WEBPACK_IMPORTED_MODULE_35__.isWritableElement)(event.target)) {\n if (event.code === _keys__WEBPACK_IMPORTED_MODULE_26__.CODES.MINUS || event.code === _keys__WEBPACK_IMPORTED_MODULE_26__.CODES.EQUAL) {\n event.preventDefault();\n return;\n }\n } // bail if\n\n\n if ( // inside an input\n (0,_utils__WEBPACK_IMPORTED_MODULE_35__.isWritableElement)(event.target) && // unless pressing escape (finalize action)\n event.key !== _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ESCAPE || // or unless using arrows (to move between buttons)\n (0,_keys__WEBPACK_IMPORTED_MODULE_26__.isArrowKey)(event.key) && (0,_utils__WEBPACK_IMPORTED_MODULE_35__.isInputLike)(event.target)) {\n return;\n }\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.QUESTION_MARK) {\n this.setState({\n openDialog: {\n name: \"help\"\n }\n });\n return;\n } else if (event.key.toLowerCase() === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.E && event.shiftKey && event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) {\n event.preventDefault();\n this.setState({\n openDialog: {\n name: \"imageExport\"\n }\n });\n return;\n }\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.PAGE_UP || event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.PAGE_DOWN) {\n let offset = (event.shiftKey ? this.state.width : this.state.height) / this.state.zoom.value;\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.PAGE_DOWN) {\n offset = -offset;\n }\n\n if (event.shiftKey) {\n this.translateCanvas(state => ({\n scrollX: state.scrollX + offset\n }));\n } else {\n this.translateCanvas(state => ({\n scrollY: state.scrollY + offset\n }));\n }\n }\n\n if (this.actionManager.handleKeyDown(event)) {\n return;\n }\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.K && !event.altKey && !event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) {\n if ((0,_appState__WEBPACK_IMPORTED_MODULE_10__.isLaserPointerActive)(this.state)) {\n this.setActiveTool({\n type: \"selection\"\n });\n } else {\n this.setActiveTool({\n type: \"laser\"\n });\n }\n\n return;\n }\n\n if (this.state.viewModeEnabled) {\n //revert to hand in case a key is pressed (K is handled above)\n if (event.key !== _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.K) {\n this.setActiveTool({\n type: \"selection\"\n });\n }\n\n return;\n }\n\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && this.state.isBindingEnabled) {\n this.setState({\n isBindingEnabled: false\n });\n }\n\n if ((0,_keys__WEBPACK_IMPORTED_MODULE_26__.isArrowKey)(event.key)) {\n const step = this.state.gridSize && (event.shiftKey ? _constants__WEBPACK_IMPORTED_MODULE_12__.ELEMENT_TRANSLATE_AMOUNT : this.state.gridSize) || (event.shiftKey ? _constants__WEBPACK_IMPORTED_MODULE_12__.ELEMENT_SHIFT_TRANSLATE_AMOUNT : _constants__WEBPACK_IMPORTED_MODULE_12__.ELEMENT_TRANSLATE_AMOUNT);\n let offsetX = 0;\n let offsetY = 0;\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ARROW_LEFT) {\n offsetX = -step;\n } else if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ARROW_RIGHT) {\n offsetX = step;\n } else if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ARROW_UP) {\n offsetY = -step;\n } else if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ARROW_DOWN) {\n offsetY = step;\n }\n\n const selectedElements = this.scene.getSelectedElements({\n selectedElementIds: this.state.selectedElementIds,\n includeBoundTextElement: true,\n includeElementsInFrames: true\n });\n selectedElements.forEach(element => {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(element, {\n x: element.x + offsetX,\n y: element.y + offsetY\n });\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.updateBoundElements)(element, this.scene.getNonDeletedElementsMap(), {\n simultaneouslyUpdated: selectedElements\n });\n });\n this.setState({\n suggestedBindings: (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.getSuggestedBindingsForArrows)(selectedElements, this.scene.getNonDeletedElementsMap())\n });\n event.preventDefault();\n } else if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ENTER) {\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (selectedElements.length === 1) {\n const selectedElement = selectedElements[0];\n\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(selectedElement)) {\n if (!this.state.editingLinearElement || this.state.editingLinearElement.elementId !== selectedElements[0].id) {\n this.store.shouldCaptureIncrement();\n this.setState({\n editingLinearElement: new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(selectedElement)\n });\n }\n }\n } else if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(selectedElement) || (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.isValidTextContainer)(selectedElement)) {\n let container;\n\n if (!(0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(selectedElement)) {\n container = selectedElement;\n }\n\n const midPoint = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getContainerCenter)(selectedElement, this.state, this.scene.getNonDeletedElementsMap());\n const sceneX = midPoint.x;\n const sceneY = midPoint.y;\n this.startTextEditing({\n sceneX,\n sceneY,\n container\n });\n event.preventDefault();\n return;\n } else if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(selectedElement)) {\n this.setState({\n editingFrame: selectedElement.id\n });\n } else if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(selectedElement)) {\n //zsviczian\n this.setState({\n activeEmbeddable: {\n element: selectedElement,\n state: \"active\"\n }\n });\n }\n }\n } else if (!event.ctrlKey && !event.altKey && !event.metaKey && this.state.draggingElement === null) {\n const shape = (0,_shapes__WEBPACK_IMPORTED_MODULE_32__.findShapeByKey)(event.key);\n\n if (shape) {\n if (this.state.activeTool.type !== shape) {\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"toolbar\", shape, `keyboard (${this.device.editor.isMobile ? \"mobile\" : \"desktop\"})`);\n }\n\n this.setActiveTool({\n type: shape\n });\n event.stopPropagation();\n } else if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.Q) {\n this.toggleLock(\"keyboard\");\n event.stopPropagation();\n }\n }\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.SPACE && gesture.pointers.size === 0) {\n isHoldingSpace = true;\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.GRAB);\n event.preventDefault();\n }\n\n if ((event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.G || event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.S) && !event.altKey && !event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) {\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (this.state.activeTool.type === \"selection\" && !selectedElements.length) {\n return;\n }\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.G && ((0,_scene__WEBPACK_IMPORTED_MODULE_29__.hasBackground)(this.state.activeTool.type) || selectedElements.some(element => (0,_scene__WEBPACK_IMPORTED_MODULE_29__.hasBackground)(element.type)))) {\n this.setState({\n openPopup: \"elementBackground\"\n });\n event.stopPropagation();\n }\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.S) {\n this.setState({\n openPopup: \"elementStroke\"\n });\n event.stopPropagation();\n }\n }\n\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.BACKSPACE || event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.DELETE)) {\n _jotai__WEBPACK_IMPORTED_MODULE_56__.jotaiStore.set(_ActiveConfirmDialog__WEBPACK_IMPORTED_MODULE_57__.activeConfirmDialogAtom, \"clearCanvas\");\n } // eye dropper\n // -----------------------------------------------------------------------\n\n\n const lowerCased = event.key.toLocaleLowerCase();\n const isPickingStroke = lowerCased === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.S && event.shiftKey;\n const isPickingBackground = event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.I || lowerCased === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.G && event.shiftKey;\n\n if (isPickingStroke || isPickingBackground) {\n this.openEyeDropper({\n type: isPickingStroke ? \"stroke\" : \"background\"\n });\n } // -----------------------------------------------------------------------\n\n });\n this.onWheel = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n // prevent browser pinch zoom on DOM elements\n if (!(event.target instanceof HTMLCanvasElement) && event.ctrlKey) {\n event.preventDefault();\n }\n });\n this.onKeyUp = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n var _a, _b;\n\n if (event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.SPACE) {\n if (this.state.viewModeEnabled) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.GRAB);\n } else if (this.state.activeTool.type === \"selection\") {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n } else {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n selectedGroupIds: {},\n editingGroupId: null,\n activeEmbeddable: null\n });\n }\n\n isHoldingSpace = false;\n }\n\n if (!event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && !this.state.isBindingEnabled) {\n this.setState({\n isBindingEnabled: true\n });\n }\n\n if ((0,_keys__WEBPACK_IMPORTED_MODULE_26__.isArrowKey)(event.key)) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.bindOrUnbindLinearElements)(this.scene.getSelectedElements(this.state).filter(_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement), this.scene.getNonDeletedElementsMap(), (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.isBindingEnabled)(this.state), (_b = (_a = this.state.selectedLinearElement) === null || _a === void 0 ? void 0 : _a.selectedPointsIndices) !== null && _b !== void 0 ? _b : []);\n this.setState({\n suggestedBindings: []\n });\n }\n }); // We purposely widen the `tool` type so this helper can be called with\n // any tool without having to type check it\n\n this.isToolSupported = tool => {\n var _a;\n\n return ((_a = this.props.UIOptions.tools) === null || _a === void 0 ? void 0 : _a[tool]) !== false;\n };\n\n this.setActiveTool = tool => {\n var _a;\n\n if (!this.isToolSupported(tool.type)) {\n console.warn(`\"${tool.type}\" tool is disabled via \"UIOptions.canvasActions.tools.${tool.type}\"`);\n return;\n }\n\n const nextActiveTool = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, tool);\n\n if (nextActiveTool.type === \"hand\") {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.GRAB);\n } else if (!isHoldingSpace) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n }\n\n if ((0,_utils__WEBPACK_IMPORTED_MODULE_35__.isToolIcon)(document.activeElement)) {\n this.focusContainer();\n }\n\n if (!(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElementType)(nextActiveTool.type)) {\n this.setState({\n suggestedBindings: []\n });\n }\n\n if (nextActiveTool.type === \"image\") {\n this.onImageAction({\n insertOnCanvasDirectly: (_a = tool.type === \"image\" && tool.insertOnCanvasDirectly) !== null && _a !== void 0 ? _a : false\n });\n }\n\n setTimeout(() => {\n this.setState(prevState => {\n const commonResets = {\n snapLines: prevState.snapLines.length ? [] : prevState.snapLines,\n originSnapOffset: null,\n activeEmbeddable: null\n };\n\n if (nextActiveTool.type === \"freedraw\") {\n this.store.shouldCaptureIncrement();\n }\n\n if (nextActiveTool.type !== \"selection\") {\n return Object.assign(Object.assign(Object.assign({}, prevState), {\n activeTool: nextActiveTool,\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(nextActiveTool.type === \"mermaid\" //zsviczian\n ? this.state.selectedElementIds : {}, prevState),\n selectedGroupIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, prevState),\n editingGroupId: null,\n multiElement: null\n }), commonResets);\n }\n\n return Object.assign(Object.assign(Object.assign({}, prevState), {\n activeTool: nextActiveTool\n }), commonResets);\n }); //zsviczian added timeout because button won't select otherwise\n });\n };\n\n this.setOpenDialog = dialogType => {\n this.setState({\n openDialog: dialogType\n });\n };\n\n this.setCursor = cursor => {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, cursor);\n };\n\n this.resetCursor = () => {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n };\n /**\r\n * returns whether user is making a gesture with >= 2 fingers (points)\r\n * on o touch screen (not on a trackpad). Currently only relates to Darwin\r\n * (iOS/iPadOS,MacOS), but may work on other devices in the future if\r\n * GestureEvent is standardized.\r\n */\n\n\n this.isTouchScreenMultiTouchGesture = () => {\n // we don't want to deselect when using trackpad, and multi-point gestures\n // only work on touch screens, so checking for >= pointers means we're on a\n // touchscreen\n return gesture.pointers.size >= 2;\n };\n\n this.getName = () => {\n return this.state.name || this.props.name || `${(0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"labels.untitled\")}-${(0,_utils__WEBPACK_IMPORTED_MODULE_35__.getDateTime)()}`;\n }; // fires only on Safari\n\n\n this.onGestureStart = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n event.preventDefault(); // we only want to deselect on touch screens because user may have selected\n // elements by mistake while zooming\n\n if (this.isTouchScreenMultiTouchGesture()) {\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n activeEmbeddable: null\n });\n }\n\n gesture.initialScale = this.state.zoom.value;\n }); // fires only on Safari\n\n this.onGestureChange = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n event.preventDefault(); // onGestureChange only has zoom factor but not the center.\n // If we're on iPad or iPhone, then we recognize multi-touch and will\n // zoom in at the right location in the touchmove handler\n // (handleCanvasPointerMove).\n //\n // On Macbook trackpad, we don't have those events so will zoom in at the\n // current location instead.\n //\n // As such, bail from this handler on touch devices.\n\n if (this.isTouchScreenMultiTouchGesture()) {\n return;\n }\n\n const initialScale = gesture.initialScale;\n\n if (initialScale) {\n this.setState(state => Object.assign({}, (0,_scene_zoom__WEBPACK_IMPORTED_MODULE_31__.getStateForZoom)({\n viewportX: this.lastViewportPosition.x,\n viewportY: this.lastViewportPosition.y,\n nextZoom: (0,_scene__WEBPACK_IMPORTED_MODULE_29__.getNormalizedZoom)(initialScale * event.scale)\n }, state)));\n }\n }); // fires only on Safari\n\n this.onGestureEnd = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n event.preventDefault(); // reselect elements only on touch screens (see onGestureStart)\n\n if (this.isTouchScreenMultiTouchGesture()) {\n this.setState({\n previousSelectedElementIds: {},\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(this.state.previousSelectedElementIds, this.state)\n });\n }\n\n gesture.initialScale = null;\n });\n\n this.startTextEditing = ({\n sceneX,\n sceneY,\n insertAtParentCenter = true,\n container,\n autoEdit = true\n }) => {\n var _a, _b;\n\n let shouldBindToContainer = false;\n let parentCenterPosition = insertAtParentCenter && this.getTextWysiwygSnappedToCenterPosition(sceneX, sceneY, this.state, container);\n\n if (container && parentCenterPosition) {\n const boundTextElementToContainer = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getBoundTextElement)(container, this.scene.getNonDeletedElementsMap());\n\n if (!boundTextElementToContainer) {\n shouldBindToContainer = true;\n }\n }\n\n let existingTextElement = null;\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (selectedElements.length === 1) {\n if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(selectedElements[0])) {\n existingTextElement = selectedElements[0];\n } else if (container) {\n existingTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getBoundTextElement)(selectedElements[0], this.scene.getNonDeletedElementsMap());\n } else {\n existingTextElement = this.getTextElementAtPosition(sceneX, sceneY);\n }\n } else {\n existingTextElement = this.getTextElementAtPosition(sceneX, sceneY);\n }\n\n const fontFamily = (existingTextElement === null || existingTextElement === void 0 ? void 0 : existingTextElement.fontFamily) || this.state.currentItemFontFamily;\n const lineHeight = (existingTextElement === null || existingTextElement === void 0 ? void 0 : existingTextElement.lineHeight) || (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getDefaultLineHeight)(fontFamily);\n const fontSize = (0,_actions_actionProperties__WEBPACK_IMPORTED_MODULE_79__.getFontSize)(this.state.currentItemFontSize, this.state.zoom.value); //zsviczian\n\n if (!existingTextElement && shouldBindToContainer && container && !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isArrowElement)(container)) {\n const fontString = {\n fontSize,\n fontFamily\n };\n const minWidth = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getApproxMinLineWidth)((0,_utils__WEBPACK_IMPORTED_MODULE_35__.getFontString)(fontString), lineHeight);\n const minHeight = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getApproxMinLineHeight)(fontSize, lineHeight);\n const newHeight = Math.max(container.height, minHeight);\n const newWidth = Math.max(container.width, minWidth);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(container, {\n height: newHeight,\n width: newWidth\n });\n sceneX = container.x + newWidth / 2;\n sceneY = container.y + newHeight / 2;\n\n if (parentCenterPosition) {\n parentCenterPosition = this.getTextWysiwygSnappedToCenterPosition(sceneX, sceneY, this.state, container);\n }\n }\n\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords({\n x: sceneX,\n y: sceneY\n });\n /*const shouldWrapText = !shouldBindToContainer && //zsviczian\r\n this.lastPointerDownEvent?.pointerType === \"pen\";\r\n const [x1, , x2] = getVisibleSceneBounds(this.state); //zsviczian\r\n const maxTextWidth = Math.max(Math.min((x2 - x1) * 0.85, 800), 200); //zsviczian*/\n\n const element = existingTextElement ? existingTextElement : (0,_element__WEBPACK_IMPORTED_MODULE_16__.newTextElement)({\n x: parentCenterPosition ? parentCenterPosition.elementCenterX : sceneX,\n y: parentCenterPosition ? parentCenterPosition.elementCenterY : sceneY,\n strokeColor: this.state.currentItemStrokeColor,\n backgroundColor: this.state.currentItemBackgroundColor,\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roughness: this.state.currentItemRoughness,\n opacity: this.state.currentItemOpacity,\n text: \"\",\n rawText: \"\",\n fontSize,\n fontFamily,\n textAlign: parentCenterPosition ? \"center\" : this.state.currentItemTextAlign,\n verticalAlign: parentCenterPosition ? _constants__WEBPACK_IMPORTED_MODULE_12__.VERTICAL_ALIGN.MIDDLE : _constants__WEBPACK_IMPORTED_MODULE_12__.DEFAULT_VERTICAL_ALIGN,\n containerId: shouldBindToContainer ? container === null || container === void 0 ? void 0 : container.id : undefined,\n groupIds: (_a = container === null || container === void 0 ? void 0 : container.groupIds) !== null && _a !== void 0 ? _a : [],\n lineHeight,\n angle: (_b = container === null || container === void 0 ? void 0 : container.angle) !== null && _b !== void 0 ? _b : 0,\n frameId: topLayerFrame ? topLayerFrame.id : null\n /*...shouldWrapText //zsviczian\r\n ? {\r\n width: maxTextWidth,\r\n autoResize: false,\r\n }\r\n : {},*/\n\n });\n\n if (!existingTextElement && shouldBindToContainer && container) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(container, {\n boundElements: (container.boundElements || []).concat({\n type: \"text\",\n id: element.id\n })\n });\n }\n\n this.setState({\n editingElement: element\n });\n\n if (!existingTextElement) {\n if (container && shouldBindToContainer) {\n const containerIndex = this.scene.getElementIndex(container.id);\n this.scene.insertElementAtIndex(element, containerIndex + 1);\n } else {\n this.scene.insertElement(element);\n }\n }\n\n if (autoEdit || existingTextElement || container) {\n this.handleTextWysiwyg(element, {\n isExistingElement: !!existingTextElement\n });\n } else {\n this.setState({\n draggingElement: element,\n multiElement: null\n });\n }\n };\n\n this.debounceDoubleClickTimestamp = 0; //zsviczian\n\n this.handleCanvasDoubleClick = event => {\n var _a; // case: double-clicking with arrow/line tool selected would both create\n // text and enter multiElement mode\n\n\n if (this.state.multiElement) {\n return;\n }\n\n if ( //zsviczian - double click eraser\n this.state.penMode && ((_a = this.lastPointerDownEvent) === null || _a === void 0 ? void 0 : _a.pointerType) === \"touch\" && this.state.activeTool.type !== \"selection\") {\n const now = Date.now();\n\n if (now - this.debounceDoubleClickTimestamp < 200) {\n //handleCanvasDoubleClick click fires twice in case of touch.\n //Once from the onTouchStart event handler, once from the double click event handler\n return;\n }\n\n this.debounceDoubleClickTimestamp = now;\n this.updateScene(_actions_actionCanvas__WEBPACK_IMPORTED_MODULE_55__.actionToggleEraserTool.perform([], this.state));\n return;\n } // zsviczian - end\n // we should only be able to double click when mode is selection\n\n\n if (this.state.activeTool.type !== \"selection\") {\n return;\n }\n\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (selectedElements.length === 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(selectedElements[0])) {\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && (!this.state.editingLinearElement || this.state.editingLinearElement.elementId !== selectedElements[0].id)) {\n this.store.shouldCaptureIncrement();\n this.setState({\n editingLinearElement: new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(selectedElements[0])\n });\n return;\n }\n }\n\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n let {\n x: sceneX,\n y: sceneY\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(event, this.state);\n const selectedGroupIds = (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getSelectedGroupIds)(this.state);\n\n if (selectedGroupIds.length > 0) {\n const hitElement = this.getElementAtPosition(sceneX, sceneY);\n const selectedGroupId = hitElement && (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getSelectedGroupIdForElement)(hitElement, this.state.selectedGroupIds);\n\n if (selectedGroupId) {\n this.store.shouldCaptureIncrement();\n this.setState(prevState => Object.assign(Object.assign({}, prevState), (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: selectedGroupId,\n selectedElementIds: {\n [hitElement.id]: true\n }\n }, this.scene.getNonDeletedElements(), prevState, this)));\n return;\n }\n }\n\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n\n if (!event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] && !this.state.viewModeEnabled) {\n const hitElement = this.getElementAtPosition(sceneX, sceneY);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeLikeElement)(hitElement)) {\n this.setState({\n activeEmbeddable: {\n element: hitElement,\n state: \"active\"\n }\n });\n return;\n }\n\n const container = this.getTextBindableContainerAtPosition(sceneX, sceneY);\n\n if (container) {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.hasBoundTextElement)(container) || !(0,_utils__WEBPACK_IMPORTED_MODULE_35__.isTransparent)(container.backgroundColor) || (0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.hitElementItself)({\n x: sceneX,\n y: sceneY,\n element: container,\n shape: (0,_shapes__WEBPACK_IMPORTED_MODULE_32__.getElementShape)(container, this.scene.getNonDeletedElementsMap()),\n threshold: this.getElementHitThreshold()\n })) {\n const midPoint = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getContainerCenter)(container, this.state, this.scene.getNonDeletedElementsMap());\n sceneX = midPoint.x;\n sceneY = midPoint.y;\n }\n }\n\n this.startTextEditing({\n sceneX,\n sceneY,\n insertAtParentCenter: !event.altKey,\n container\n });\n }\n };\n\n this.getElementLinkAtPosition = (scenePointer, hitElement) => {\n // Reversing so we traverse the elements in decreasing order\n // of z-index\n const elements = this.scene.getNonDeletedElements().slice().reverse();\n let hitElementIndex = Infinity;\n return elements.find((element, index) => {\n if (hitElement && element.id === hitElement.id) {\n hitElementIndex = index;\n }\n\n return element.link && index <= hitElementIndex && (0,_hyperlink_helpers__WEBPACK_IMPORTED_MODULE_91__.isPointHittingLink)(element, this.scene.getNonDeletedElementsMap(), this.state, [scenePointer.x, scenePointer.y], this.device.editor.isMobile);\n });\n };\n\n this.redirectToLink = (event, isTouchScreen) => {\n const draggedDistance = (0,_math__WEBPACK_IMPORTED_MODULE_28__.distance2d)(this.lastPointerDownEvent.clientX, this.lastPointerDownEvent.clientY, this.lastPointerUpEvent.clientX, this.lastPointerUpEvent.clientY);\n\n if (!this.hitLinkElement || // For touch screen allow dragging threshold else strict check\n isTouchScreen && draggedDistance > _constants__WEBPACK_IMPORTED_MODULE_12__.DRAGGING_THRESHOLD || !isTouchScreen && draggedDistance !== 0) {\n return;\n }\n\n const lastPointerDownCoords = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(this.lastPointerDownEvent, this.state);\n const elementsMap = this.scene.getNonDeletedElementsMap();\n const lastPointerDownHittingLinkIcon = (0,_hyperlink_helpers__WEBPACK_IMPORTED_MODULE_91__.isPointHittingLink)(this.hitLinkElement, elementsMap, this.state, [lastPointerDownCoords.x, lastPointerDownCoords.y], this.device.editor.isMobile);\n const lastPointerUpCoords = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(this.lastPointerUpEvent, this.state);\n const lastPointerUpHittingLinkIcon = (0,_hyperlink_helpers__WEBPACK_IMPORTED_MODULE_91__.isPointHittingLink)(this.hitLinkElement, elementsMap, this.state, [lastPointerUpCoords.x, lastPointerUpCoords.y], this.device.editor.isMobile);\n\n if (lastPointerDownHittingLinkIcon && lastPointerUpHittingLinkIcon) {\n let url = this.hitLinkElement.link;\n\n if (url) {\n url = (0,_data_url__WEBPACK_IMPORTED_MODULE_47__.normalizeLink)(url);\n let customEvent;\n\n if (this.props.onLinkOpen) {\n customEvent = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.wrapEvent)(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.EXCALIDRAW_LINK, event.nativeEvent);\n this.props.onLinkOpen(Object.assign(Object.assign({}, this.hitLinkElement), {\n link: url\n }), customEvent);\n }\n\n if (!(customEvent === null || customEvent === void 0 ? void 0 : customEvent.defaultPrevented)) {\n const target = (0,_data_url__WEBPACK_IMPORTED_MODULE_47__.isLocalLink)(url) ? \"_self\" : \"_blank\";\n const newWindow = window.open(undefined, target); // https://mathiasbynens.github.io/rel-noopener/\n\n if (newWindow) {\n newWindow.opener = null;\n newWindow.location = url;\n }\n }\n }\n }\n };\n\n this.getTopLayerFrameAtSceneCoords = sceneCoords => {\n const elementsMap = this.scene.getNonDeletedElementsMap();\n const frames = this.scene.getNonDeletedFramesLikes().filter(frame => (0,_frame__WEBPACK_IMPORTED_MODULE_51__.isCursorInFrame)(sceneCoords, frame, elementsMap));\n return frames.length ? frames[frames.length - 1] : null;\n };\n\n this.handleCanvasPointerMove = event => {\n var _a, _b;\n\n this.savePointer(event.clientX, event.clientY, this.state.cursorButton);\n this.lastPointerMoveEvent = event.nativeEvent;\n\n if (gesture.pointers.has(event.pointerId)) {\n gesture.pointers.set(event.pointerId, {\n x: event.clientX,\n y: event.clientY\n });\n }\n\n const initialScale = gesture.initialScale;\n\n if (gesture.pointers.size === 2 && gesture.lastCenter && initialScale && gesture.initialDistance) {\n const center = (0,_gesture__WEBPACK_IMPORTED_MODULE_22__.getCenter)(gesture.pointers);\n const deltaX = center.x - gesture.lastCenter.x;\n const deltaY = center.y - gesture.lastCenter.y;\n gesture.lastCenter = center;\n const distance = (0,_gesture__WEBPACK_IMPORTED_MODULE_22__.getDistance)(Array.from(gesture.pointers.values()));\n const scaleFactor = !this.state.allowPinchZoom && //zsviczian\n this.state.activeTool.type === \"freedraw\" && this.state.penMode ? 1 : distance / gesture.initialDistance;\n const nextZoom = scaleFactor ? (0,_scene__WEBPACK_IMPORTED_MODULE_29__.getNormalizedZoom)(initialScale * scaleFactor) : this.state.zoom.value;\n this.setState(state => {\n const zoomState = (0,_scene_zoom__WEBPACK_IMPORTED_MODULE_31__.getStateForZoom)({\n viewportX: center.x,\n viewportY: center.y,\n nextZoom\n }, state);\n this.translateCanvas({\n zoom: zoomState.zoom,\n // 2x multiplier is just a magic number that makes this work correctly\n // on touchscreen devices (note: if we get report that panning is slower/faster\n // than actual movement, consider swapping with devicePixelRatio)\n scrollX: zoomState.scrollX + 2 * (deltaX / nextZoom),\n scrollY: zoomState.scrollY + 2 * (deltaY / nextZoom),\n shouldCacheIgnoreZoom: true\n });\n });\n this.resetShouldCacheIgnoreZoomDebounced();\n } else {\n gesture.lastCenter = gesture.initialDistance = gesture.initialScale = null;\n }\n\n if (isHoldingSpace || isPanning || isDraggingScrollBar || (0,_appState__WEBPACK_IMPORTED_MODULE_10__.isHandToolActive)(this.state)) {\n return;\n }\n\n const isPointerOverScrollBars = (0,_scene_scrollbars__WEBPACK_IMPORTED_MODULE_89__.isOverScrollBars)(currentScrollBars, event.clientX - this.state.offsetLeft, event.clientY - this.state.offsetTop);\n const isOverScrollBar = isPointerOverScrollBars.isOverEither;\n const isPenFreedraw = this.state.activeTool.type === \"freedraw\" && event.pointerType === \"pen\"; //zsviczian\n\n if (!this.state.draggingElement && !this.state.multiElement) {\n if (isOverScrollBar) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n } else if (isPenFreedraw && this.interactiveCanvas && (0,_obsidianUtils__WEBPACK_IMPORTED_MODULE_86__.hideFreedrawPenmodeCursor)()) {\n //zsviczian https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/1659\n this.interactiveCanvas.style.cursor = \"none\";\n } else {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n }\n }\n\n const scenePointer = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(event, this.state);\n const {\n x: scenePointerX,\n y: scenePointerY\n } = scenePointer;\n\n if (!this.state.draggingElement && (0,_snapping__WEBPACK_IMPORTED_MODULE_59__.isActiveToolNonLinearSnappable)(this.state.activeTool.type)) {\n const {\n originOffset,\n snapLines\n } = (0,_snapping__WEBPACK_IMPORTED_MODULE_59__.getSnapLinesAtPointer)(this.scene.getNonDeletedElements(), this.state, {\n x: scenePointerX,\n y: scenePointerY\n }, event, this.scene.getNonDeletedElementsMap());\n this.setState(prevState => {\n const nextSnapLines = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateStable)(prevState.snapLines, snapLines);\n const nextOriginOffset = prevState.originSnapOffset ? (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateStable)(prevState.originSnapOffset, originOffset) : originOffset;\n\n if (prevState.snapLines === nextSnapLines && prevState.originSnapOffset === nextOriginOffset) {\n return null;\n }\n\n return {\n snapLines: nextSnapLines,\n originSnapOffset: nextOriginOffset\n };\n });\n } else if (!this.state.draggingElement) {\n this.setState(prevState => {\n if (prevState.snapLines.length) {\n return {\n snapLines: []\n };\n }\n\n return null;\n });\n }\n\n if (this.state.editingLinearElement && !this.state.editingLinearElement.isDragging) {\n const editingLinearElement = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.handlePointerMove(event, scenePointerX, scenePointerY, this.state, this.scene.getNonDeletedElementsMap());\n\n if (editingLinearElement && editingLinearElement !== this.state.editingLinearElement) {\n // Since we are reading from previous state which is not possible with\n // automatic batching in React 18 hence using flush sync to synchronously\n // update the state. Check https://github.com/excalidraw/excalidraw/pull/5508 for more details.\n (0,react_dom__WEBPACK_IMPORTED_MODULE_2__.flushSync)(() => {\n this.setState({\n editingLinearElement\n });\n });\n }\n\n if ((editingLinearElement === null || editingLinearElement === void 0 ? void 0 : editingLinearElement.lastUncommittedPoint) != null) {\n this.maybeSuggestBindingAtCursor(scenePointer);\n } else {\n // causes stack overflow if not sync\n (0,react_dom__WEBPACK_IMPORTED_MODULE_2__.flushSync)(() => {\n this.setState({\n suggestedBindings: []\n });\n });\n }\n }\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBindingElementType)(this.state.activeTool.type)) {\n // Hovering with a selected tool or creating new linear element via click\n // and point\n const {\n draggingElement\n } = this.state;\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBindingElement)(draggingElement, false)) {\n this.maybeSuggestBindingsForLinearElementAtCoords(draggingElement, [scenePointer], this.state.startBoundElement);\n } else {\n this.maybeSuggestBindingAtCursor(scenePointer);\n }\n }\n\n if (this.state.multiElement) {\n const {\n multiElement\n } = this.state;\n const {\n x: rx,\n y: ry\n } = multiElement;\n const {\n points,\n lastCommittedPoint\n } = multiElement;\n const lastPoint = points[points.length - 1];\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n\n if (lastPoint === lastCommittedPoint) {\n // if we haven't yet created a temp point and we're beyond commit-zone\n // threshold, add a point\n if ((0,_math__WEBPACK_IMPORTED_MODULE_28__.distance2d)(scenePointerX - rx, scenePointerY - ry, lastPoint[0], lastPoint[1]) >= _constants__WEBPACK_IMPORTED_MODULE_12__.LINE_CONFIRM_THRESHOLD) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(multiElement, {\n points: [...points, [scenePointerX - rx, scenePointerY - ry]]\n });\n } else {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.POINTER); // in this branch, we're inside the commit zone, and no uncommitted\n // point exists. Thus do nothing (don't add/remove points).\n }\n } else if (points.length > 2 && lastCommittedPoint && (0,_math__WEBPACK_IMPORTED_MODULE_28__.distance2d)(scenePointerX - rx, scenePointerY - ry, lastCommittedPoint[0], lastCommittedPoint[1]) < _constants__WEBPACK_IMPORTED_MODULE_12__.LINE_CONFIRM_THRESHOLD) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.POINTER);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(multiElement, {\n points: points.slice(0, -1)\n });\n } else {\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(scenePointerX, scenePointerY, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize);\n const [lastCommittedX, lastCommittedY] = (_a = multiElement === null || multiElement === void 0 ? void 0 : multiElement.lastCommittedPoint) !== null && _a !== void 0 ? _a : [0, 0];\n let dxFromLastCommitted = gridX - rx - lastCommittedX;\n let dyFromLastCommitted = gridY - ry - lastCommittedY;\n\n if ((0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldRotateWithDiscreteAngle)(event)) {\n ({\n width: dxFromLastCommitted,\n height: dyFromLastCommitted\n } = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getLockedLinearCursorAlignSize)( // actual coordinate of the last committed point\n lastCommittedX + rx, lastCommittedY + ry, // cursor-grid coordinate\n gridX, gridY));\n }\n\n if ((0,_math__WEBPACK_IMPORTED_MODULE_28__.isPathALoop)(points, this.state.zoom.value)) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.POINTER);\n } // update last uncommitted point\n\n\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(multiElement, {\n points: [...points.slice(0, -1), [lastCommittedX + dxFromLastCommitted, lastCommittedY + dyFromLastCommitted]]\n });\n }\n\n return;\n }\n\n const hasDeselectedButton = Boolean(event.buttons);\n\n if (hasDeselectedButton || this.state.activeTool.type !== \"selection\" && this.state.activeTool.type !== \"text\" && this.state.activeTool.type !== \"eraser\") {\n return;\n }\n\n const elements = this.scene.getNonDeletedElements();\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (selectedElements.length === 1 && !isOverScrollBar && !this.state.editingLinearElement) {\n // for linear elements, we'd like to prioritize point dragging over edge resizing\n // therefore, we update and check hovered point index first\n if (this.state.selectedLinearElement) {\n this.handleHoverSelectedLinearElement(this.state.selectedLinearElement, scenePointerX, scenePointerY);\n }\n\n if (!this.state.selectedLinearElement || this.state.selectedLinearElement.hoverPointIndex === -1) {\n const elementWithTransformHandleType = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getElementWithTransformHandleType)(elements, this.state, scenePointerX, scenePointerY, this.state.zoom, event.pointerType, this.scene.getNonDeletedElementsMap(), this.device);\n\n if (elementWithTransformHandleType && elementWithTransformHandleType.transformHandleType) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, (0,_element__WEBPACK_IMPORTED_MODULE_16__.getCursorForResizingElement)(elementWithTransformHandleType));\n return;\n }\n }\n } else if (selectedElements.length > 1 && !isOverScrollBar) {\n const transformHandleType = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getTransformHandleTypeFromCoords)((0,_element__WEBPACK_IMPORTED_MODULE_16__.getCommonBounds)(selectedElements), scenePointerX, scenePointerY, this.state.zoom, event.pointerType, this.device);\n\n if (transformHandleType) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, (0,_element__WEBPACK_IMPORTED_MODULE_16__.getCursorForResizingElement)({\n transformHandleType\n }));\n return;\n }\n }\n\n const hitElement = this.getElementAtPosition(scenePointer.x, scenePointer.y);\n this.hitLinkElement = this.getElementLinkAtPosition(scenePointer, hitElement);\n\n if ((0,_appState__WEBPACK_IMPORTED_MODULE_10__.isEraserActive)(this.state)) {\n return;\n }\n\n if (this.hitLinkElement && !this.state.selectedElementIds[this.hitLinkElement.id]) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.POINTER);\n (0,_components_hyperlink_Hyperlink__WEBPACK_IMPORTED_MODULE_46__.showHyperlinkTooltip)(this.hitLinkElement, this.state, this.scene.getNonDeletedElementsMap());\n\n if (this.props.onLinkHover) {\n this.props.onLinkHover(this.hitLinkElement, event);\n } //zsviczian\n\n } else {\n (0,_components_hyperlink_Hyperlink__WEBPACK_IMPORTED_MODULE_46__.hideHyperlinkToolip)();\n\n if (hitElement && (hitElement.link || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(hitElement)) && this.state.selectedElementIds[hitElement.id] && !this.state.contextMenu && !this.state.showHyperlinkPopup) {\n this.setState({\n showHyperlinkPopup: \"info\"\n });\n } else if (this.state.activeTool.type === \"text\") {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(hitElement) ? _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.TEXT : _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.CROSSHAIR);\n } else if (this.state.viewModeEnabled) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.GRAB);\n } else if (isOverScrollBar) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.AUTO);\n } else if (this.state.selectedLinearElement) {\n this.handleHoverSelectedLinearElement(this.state.selectedLinearElement, scenePointerX, scenePointerY);\n } else if ( // if using cmd/ctrl, we're not dragging\n !event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) {\n if ((hitElement || this.isHittingCommonBoundingBoxOfSelectedElements(scenePointer, selectedElements)) && !(hitElement === null || hitElement === void 0 ? void 0 : hitElement.locked)) {\n if (hitElement && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeLikeElement)(hitElement) && this.isIframeLikeElementCenter(hitElement, event, scenePointerX, scenePointerY)) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.POINTER);\n this.setState({\n activeEmbeddable: {\n element: hitElement,\n state: \"hover\"\n }\n });\n } else {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.MOVE);\n\n if (((_b = this.state.activeEmbeddable) === null || _b === void 0 ? void 0 : _b.state) === \"hover\") {\n this.setState({\n activeEmbeddable: null\n });\n }\n }\n }\n } else {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.AUTO);\n }\n }\n };\n\n this.handleEraser = (event, pointerDownState, scenePointer) => {\n this.eraserTrail.addPointToPath(scenePointer.x, scenePointer.y);\n let didChange = false;\n const processedGroups = new Set();\n const nonDeletedElements = this.scene.getNonDeletedElements();\n\n const processElements = elements => {\n var _a;\n\n for (const element of elements) {\n if (element.locked) {\n return;\n }\n\n if (event.altKey) {\n if (this.elementsPendingErasure.delete(element.id)) {\n didChange = true;\n }\n } else if (!this.elementsPendingErasure.has(element.id)) {\n didChange = true;\n this.elementsPendingErasure.add(element.id);\n } // (un)erase groups atomically\n\n\n if (didChange && ((_a = element.groupIds) === null || _a === void 0 ? void 0 : _a.length)) {\n const shallowestGroupId = element.groupIds.at(-1);\n\n if (!processedGroups.has(shallowestGroupId)) {\n processedGroups.add(shallowestGroupId);\n const elems = (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getElementsInGroup)(nonDeletedElements, shallowestGroupId);\n\n for (const elem of elems) {\n if (event.altKey) {\n this.elementsPendingErasure.delete(elem.id);\n } else {\n this.elementsPendingErasure.add(elem.id);\n }\n }\n }\n }\n }\n };\n\n const distance = (0,_math__WEBPACK_IMPORTED_MODULE_28__.distance2d)(pointerDownState.lastCoords.x, pointerDownState.lastCoords.y, scenePointer.x, scenePointer.y);\n const threshold = this.getElementHitThreshold();\n const point = Object.assign({}, pointerDownState.lastCoords);\n let samplingInterval = 0;\n\n while (samplingInterval <= distance) {\n const hitElements = this.getElementsAtPosition(point.x, point.y);\n processElements(hitElements); // Exit since we reached current point\n\n if (samplingInterval === distance) {\n break;\n } // Calculate next point in the line at a distance of sampling interval\n\n\n samplingInterval = Math.min(samplingInterval + threshold, distance);\n const distanceRatio = samplingInterval / distance;\n const nextX = (1 - distanceRatio) * point.x + distanceRatio * scenePointer.x;\n const nextY = (1 - distanceRatio) * point.y + distanceRatio * scenePointer.y;\n point.x = nextX;\n point.y = nextY;\n }\n\n pointerDownState.lastCoords.x = scenePointer.x;\n pointerDownState.lastCoords.y = scenePointer.y;\n\n if (didChange) {\n for (const element of this.scene.getNonDeletedElements()) {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBoundToContainer)(element) && (this.elementsPendingErasure.has(element.id) || this.elementsPendingErasure.has(element.containerId))) {\n if (event.altKey) {\n this.elementsPendingErasure.delete(element.id);\n this.elementsPendingErasure.delete(element.containerId);\n } else {\n this.elementsPendingErasure.add(element.id);\n this.elementsPendingErasure.add(element.containerId);\n }\n }\n }\n\n this.elementsPendingErasure = new Set(this.elementsPendingErasure);\n this.triggerRender();\n }\n }; // set touch moving for mobile context menu\n\n\n this.handleTouchMove = event => {\n invalidateContextMenu = true;\n };\n\n this.handleCanvasPointerDown = event => {\n var _a, _b;\n\n this.focusContainer(); //zsviczian\n\n this.maybeCleanupAfterMissingPointerUp(event.nativeEvent);\n this.maybeUnfollowRemoteUser(); // since contextMenu options are potentially evaluated on each render,\n // and an contextMenu action may depend on selection state, we must\n // close the contextMenu before we update the selection on pointerDown\n // (e.g. resetting selection)\n\n if (this.state.contextMenu) {\n this.setState({\n contextMenu: null\n });\n }\n\n if (this.state.snapLines) {\n this.setAppState({\n snapLines: []\n });\n }\n\n this.updateGestureOnPointerDown(event); // if dragging element is freedraw and another pointerdown event occurs\n // a second finger is on the screen\n // discard the freedraw element if it is very short because it is likely\n // just a spike, otherwise finalize the freedraw element when the second\n // finger is lifted\n\n if (event.pointerType === \"touch\" && this.state.draggingElement && this.state.draggingElement.type === \"freedraw\") {\n const element = this.state.draggingElement;\n this.updateScene(Object.assign(Object.assign({}, element.points.length < 10 ? {\n elements: this.scene.getElementsIncludingDeleted().filter(el => el.id !== element.id)\n } : {}), {\n appState: {\n draggingElement: null,\n editingElement: null,\n startBoundElement: null,\n suggestedBindings: [],\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(Object.keys(this.state.selectedElementIds).filter(key => key !== element.id).reduce((obj, key) => {\n obj[key] = this.state.selectedElementIds[key];\n return obj;\n }, {}), this.state)\n },\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.UPDATE\n }));\n return;\n } // remove any active selection when we start to interact with canvas\n // (mainly, we care about removing selection outside the component which\n // would prevent our copy handling otherwise)\n\n\n const selection = document.getSelection();\n\n if (selection === null || selection === void 0 ? void 0 : selection.anchorNode) {\n selection.removeAllRanges();\n }\n\n this.maybeOpenContextMenuAfterPointerDownOnTouchDevices(event); //fires only once, if pen is detected, penMode is enabled\n //the user can disable this by toggling the penMode button\n\n if (!this.state.penDetected && event.pointerType === \"pen\") {\n this.setState(prevState => {\n return {\n penMode: true,\n penDetected: true\n };\n });\n }\n\n if (!this.device.isTouchScreen && [\"pen\", \"touch\"].includes(event.pointerType)) {\n this.device = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateObject)(this.device, {\n isTouchScreen: true\n });\n }\n\n if (isPanning) {\n return;\n }\n\n this.lastPointerDownEvent = event; // we must exit before we set `cursorButton` state and `savePointer`\n // else it will send pointer state & laser pointer events in collab when\n // panning\n\n /*if (this.handleCanvasPanUsingWheelOrSpaceDrag(event)) {\r\n return;\r\n }*/\n //zsviczian this broke on pointer down in onPointerUpdate\n\n this.setState({\n lastPointerDownWith: event.pointerType,\n cursorButton: \"down\"\n });\n this.savePointer(event.clientX, event.clientY, \"down\");\n\n if (this.handleCanvasPanUsingWheelOrSpaceDrag(event)) {\n return;\n } //zsviczian moved it here, because else pointer down in onPointerUpdate did not work\n\n\n if (event.button === _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_BUTTON.ERASER && this.state.activeTool.type !== _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.eraser) {\n this.setState({\n activeTool: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, {\n type: _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.eraser,\n lastActiveToolBeforeEraser: this.state.activeTool\n })\n }, () => {\n this.handleCanvasPointerDown(event);\n\n const onPointerUp = () => {\n unsubPointerUp();\n unsubCleanup === null || unsubCleanup === void 0 ? void 0 : unsubCleanup();\n\n if ((0,_appState__WEBPACK_IMPORTED_MODULE_10__.isEraserActive)(this.state)) {\n this.setState({\n activeTool: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, Object.assign(Object.assign({}, this.state.activeTool.lastActiveTool || {\n type: _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.selection\n }), {\n lastActiveToolBeforeEraser: null\n }))\n });\n }\n };\n\n const unsubPointerUp = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(window, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, onPointerUp, {\n once: true\n });\n let unsubCleanup; // subscribe inside rAF lest it'd be triggered on the same pointerdown\n // if we start erasing while coming from blurred document since\n // we cleanup pointer events on focus\n\n requestAnimationFrame(() => {\n unsubCleanup = this.missingPointerEventCleanupEmitter.once(onPointerUp);\n });\n });\n return;\n } // only handle left mouse button or touch\n\n\n if (event.button !== _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_BUTTON.MAIN && event.button !== _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_BUTTON.TOUCH && event.button !== _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_BUTTON.ERASER) {\n return;\n } // don't select while panning\n\n\n if (gesture.pointers.size > 1) {\n return;\n } // State for the duration of a pointer interaction, which starts with a\n // pointerDown event, ends with a pointerUp event (or another pointerDown)\n\n\n const pointerDownState = this.initialPointerDownState(event);\n this.setState({\n selectedElementsAreBeingDragged: false\n });\n\n if (this.handleDraggingScrollBar(event, pointerDownState)) {\n return;\n }\n\n this.clearSelectionIfNotUsingSelection();\n this.updateBindingEnabledOnPointerMove(event);\n\n if (this.handleSelectionOnPointerDown(event, pointerDownState)) {\n return;\n }\n\n const allowOnPointerDown = !this.state.penMode || event.pointerType !== \"touch\" || this.state.activeTool.type === \"selection\" || this.state.activeTool.type === \"text\" || this.state.activeTool.type === \"image\";\n\n if (!allowOnPointerDown) {\n return;\n }\n\n if (this.state.activeTool.type === \"text\") {\n this.handleTextOnPointerDown(event, pointerDownState);\n } else if (this.state.activeTool.type === \"arrow\" || this.state.activeTool.type === \"line\") {\n this.handleLinearElementOnPointerDown(event, this.state.activeTool.type, pointerDownState);\n } else if (this.state.activeTool.type === \"image\") {\n // reset image preview on pointerdown\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.CROSSHAIR); // retrieve the latest element as the state may be stale\n\n const pendingImageElement = this.state.pendingImageElementId && this.scene.getElement(this.state.pendingImageElementId);\n\n if (!pendingImageElement) {\n return;\n }\n\n this.setState({\n draggingElement: pendingImageElement,\n editingElement: pendingImageElement,\n pendingImageElementId: null,\n multiElement: null\n });\n const {\n x,\n y\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(event, this.state);\n const frame = this.getTopLayerFrameAtSceneCoords({\n x,\n y\n });\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(pendingImageElement, {\n x,\n y,\n frameId: frame ? frame.id : null\n });\n } else if (this.state.activeTool.type === \"freedraw\") {\n this.handleFreeDrawElementOnPointerDown(event, this.state.activeTool.type, pointerDownState);\n } else if (this.state.activeTool.type === \"custom\") {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n } else if (this.state.activeTool.type === _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.frame || this.state.activeTool.type === _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.magicframe) {\n this.createFrameElementOnPointerDown(pointerDownState, this.state.activeTool.type);\n } else if (this.state.activeTool.type === \"laser\") {\n this.laserTrails.startPath(pointerDownState.lastCoords.x, pointerDownState.lastCoords.y);\n } else if (this.state.activeTool.type !== \"eraser\" && this.state.activeTool.type !== \"hand\" && this.state.activeTool.type !== \"mermaid\") {\n this.createGenericElementOnPointerDown(this.state.activeTool.type, pointerDownState);\n }\n\n (_b = (_a = this.props) === null || _a === void 0 ? void 0 : _a.onPointerDown) === null || _b === void 0 ? void 0 : _b.call(_a, this.state.activeTool, pointerDownState);\n this.onPointerDownEmitter.trigger(this.state.activeTool, pointerDownState, event);\n\n if (this.state.activeTool.type === \"eraser\") {\n this.eraserTrail.startPath(pointerDownState.lastCoords.x, pointerDownState.lastCoords.y);\n }\n\n const onPointerMove = this.onPointerMoveFromPointerDownHandler(pointerDownState);\n const onPointerUp = this.onPointerUpFromPointerDownHandler(pointerDownState);\n const onKeyDown = this.onKeyDownFromPointerDownHandler(pointerDownState);\n const onKeyUp = this.onKeyUpFromPointerDownHandler(pointerDownState);\n this.missingPointerEventCleanupEmitter.once(_event => onPointerUp(_event || event.nativeEvent));\n\n if (!this.state.viewModeEnabled || this.state.activeTool.type === \"laser\") {\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_MOVE, onPointerMove);\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, onPointerUp);\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.KEYDOWN, onKeyDown);\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.KEYUP, onKeyUp);\n pointerDownState.eventListeners.onMove = onPointerMove;\n pointerDownState.eventListeners.onUp = onPointerUp;\n pointerDownState.eventListeners.onKeyUp = onKeyUp;\n pointerDownState.eventListeners.onKeyDown = onKeyDown;\n }\n };\n\n this.handleCanvasPointerUp = event => {\n var _a, _b;\n\n this.removePointer(event);\n this.lastPointerUpEvent = event;\n const scenePointer = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX: event.clientX,\n clientY: event.clientY\n }, this.state);\n const clicklength = event.timeStamp - ((_b = (_a = this.lastPointerDownEvent) === null || _a === void 0 ? void 0 : _a.timeStamp) !== null && _b !== void 0 ? _b : 0);\n\n if (this.device.editor.isMobile && clicklength < 300) {\n const hitElement = this.getElementAtPosition(scenePointer.x, scenePointer.y);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeLikeElement)(hitElement) && this.isIframeLikeElementCenter(hitElement, event, scenePointer.x, scenePointer.y)) {\n this.handleEmbeddableCenterClick(hitElement);\n return;\n }\n }\n\n if (this.device.isTouchScreen) {\n const hitElement = this.getElementAtPosition(scenePointer.x, scenePointer.y);\n this.hitLinkElement = this.getElementLinkAtPosition(scenePointer, hitElement);\n }\n\n if (this.hitLinkElement && !this.state.selectedElementIds[this.hitLinkElement.id]) {\n if (clicklength < 300 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeLikeElement)(this.hitLinkElement) && !(0,_hyperlink_helpers__WEBPACK_IMPORTED_MODULE_91__.isPointHittingLinkIcon)(this.hitLinkElement, this.scene.getNonDeletedElementsMap(), this.state, [scenePointer.x, scenePointer.y])) {\n this.handleEmbeddableCenterClick(this.hitLinkElement);\n } else {\n this.redirectToLink(event, this.device.isTouchScreen);\n }\n } else if (this.state.viewModeEnabled) {\n this.setState({\n activeEmbeddable: null,\n selectedElementIds: {}\n });\n }\n };\n\n this.maybeOpenContextMenuAfterPointerDownOnTouchDevices = event => {\n // deal with opening context menu on touch devices\n if (event.pointerType === \"touch\") {\n invalidateContextMenu = false;\n\n if (touchTimeout) {\n // If there's already a touchTimeout, this means that there's another\n // touch down and we are doing another touch, so we shouldn't open the\n // context menu.\n invalidateContextMenu = true;\n } else {\n // open the context menu with the first touch's clientX and clientY\n // if the touch is not moving\n touchTimeout = window.setTimeout(() => {\n touchTimeout = 0;\n\n if (!invalidateContextMenu) {\n this.handleCanvasContextMenu(event);\n }\n }, _constants__WEBPACK_IMPORTED_MODULE_12__.TOUCH_CTX_MENU_TIMEOUT);\n }\n }\n };\n\n this.resetContextMenuTimer = () => {\n clearTimeout(touchTimeout);\n touchTimeout = 0;\n invalidateContextMenu = false;\n };\n /**\r\n * pointerup may not fire in certian cases (user tabs away...), so in order\r\n * to properly cleanup pointerdown state, we need to fire any hanging\r\n * pointerup handlers manually\r\n */\n\n\n this.maybeCleanupAfterMissingPointerUp = event => {\n lastPointerUp === null || lastPointerUp === void 0 ? void 0 : lastPointerUp();\n this.missingPointerEventCleanupEmitter.trigger(event).clear();\n }; // Returns whether the event is a panning\n\n\n this.handleCanvasPanUsingWheelOrSpaceDrag = event => {\n if (!(gesture.pointers.size <= 1 && (event.button === _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_BUTTON.WHEEL || event.button === _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_BUTTON.MAIN && isHoldingSpace || (0,_appState__WEBPACK_IMPORTED_MODULE_10__.isHandToolActive)(this.state) || this.state.viewModeEnabled && !(0,_appState__WEBPACK_IMPORTED_MODULE_10__.isLaserPointerActive)(this.state))) || (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(this.state.editingElement)) {\n return false;\n }\n\n isPanning = true;\n event.preventDefault();\n let nextPastePrevented = false;\n const isLinux = typeof window === undefined ? false : /Linux/.test(window.navigator.platform);\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.GRABBING);\n let {\n clientX: lastX,\n clientY: lastY\n } = event;\n const onPointerMove = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdatesThrottled)(event => {\n const deltaX = lastX - event.clientX;\n const deltaY = lastY - event.clientY;\n lastX = event.clientX;\n lastY = event.clientY;\n /*\r\n * Prevent paste event if we move while middle clicking on Linux.\r\n * See issue #1383.\r\n */\n\n if (isLinux && !nextPastePrevented && (Math.abs(deltaX) > 1 || Math.abs(deltaY) > 1)) {\n nextPastePrevented = true;\n /* Prevent the next paste event */\n\n const preventNextPaste = event => {\n document.body.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.PASTE, preventNextPaste);\n event.stopPropagation();\n };\n /*\r\n * Reenable next paste in case of disabled middle click paste for\r\n * any reason:\r\n * - right click paste\r\n * - empty clipboard\r\n */\n\n\n const enableNextPaste = () => {\n setTimeout(() => {\n document.body.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.PASTE, preventNextPaste);\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, enableNextPaste);\n }, 100);\n };\n\n document.body.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.PASTE, preventNextPaste);\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, enableNextPaste);\n }\n\n this.translateCanvas({\n scrollX: this.state.scrollX - deltaX / this.state.zoom.value,\n scrollY: this.state.scrollY - deltaY / this.state.zoom.value\n });\n });\n const teardown = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(lastPointerUp = () => {\n lastPointerUp = null;\n isPanning = false;\n\n if (!isHoldingSpace) {\n if (this.state.viewModeEnabled) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.GRAB);\n } else {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n }\n }\n\n this.setState({\n cursorButton: \"up\"\n });\n this.savePointer(event.clientX, event.clientY, \"up\");\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_MOVE, onPointerMove);\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, teardown);\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.BLUR, teardown);\n onPointerMove.flush();\n });\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.BLUR, teardown);\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_MOVE, onPointerMove, {\n passive: true\n });\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, teardown);\n return true;\n };\n\n this.clearSelectionIfNotUsingSelection = () => {\n if (this.state.activeTool.type !== \"selection\") {\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n selectedGroupIds: {},\n editingGroupId: null,\n activeEmbeddable: null\n });\n }\n };\n /**\r\n * @returns whether the pointer event has been completely handled\r\n */\n\n\n this.handleSelectionOnPointerDown = (event, pointerDownState) => {\n var _a;\n\n if (this.state.activeTool.type === \"selection\") {\n const elements = this.scene.getNonDeletedElements();\n const elementsMap = this.scene.getNonDeletedElementsMap();\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (selectedElements.length === 1 && !this.state.editingLinearElement && !(this.state.selectedLinearElement && this.state.selectedLinearElement.hoverPointIndex !== -1)) {\n const elementWithTransformHandleType = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getElementWithTransformHandleType)(elements, this.state, pointerDownState.origin.x, pointerDownState.origin.y, this.state.zoom, event.pointerType, this.scene.getNonDeletedElementsMap(), this.device);\n\n if (elementWithTransformHandleType != null) {\n this.setState({\n resizingElement: elementWithTransformHandleType.element\n });\n pointerDownState.resize.handleType = elementWithTransformHandleType.transformHandleType;\n }\n } else if (selectedElements.length > 1) {\n pointerDownState.resize.handleType = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getTransformHandleTypeFromCoords)((0,_element__WEBPACK_IMPORTED_MODULE_16__.getCommonBounds)(selectedElements), pointerDownState.origin.x, pointerDownState.origin.y, this.state.zoom, event.pointerType, this.device);\n }\n\n if (pointerDownState.resize.handleType) {\n pointerDownState.resize.isResizing = true;\n pointerDownState.resize.offset = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.tupleToCoors)((0,_element__WEBPACK_IMPORTED_MODULE_16__.getResizeOffsetXY)(pointerDownState.resize.handleType, selectedElements, elementsMap, pointerDownState.origin.x, pointerDownState.origin.y));\n\n if (selectedElements.length === 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(selectedElements[0]) && selectedElements[0].points.length === 2) {\n pointerDownState.resize.arrowDirection = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getResizeArrowDirection)(pointerDownState.resize.handleType, selectedElements[0]);\n }\n } else {\n if (this.state.selectedLinearElement) {\n const linearElementEditor = this.state.editingLinearElement || this.state.selectedLinearElement;\n const ret = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.handlePointerDown(event, this.state, this.store, pointerDownState.origin, linearElementEditor, this);\n\n if (ret.hitElement) {\n pointerDownState.hit.element = ret.hitElement;\n }\n\n if (ret.linearElementEditor) {\n this.setState({\n selectedLinearElement: ret.linearElementEditor\n });\n\n if (this.state.editingLinearElement) {\n this.setState({\n editingLinearElement: ret.linearElementEditor\n });\n }\n }\n\n if (ret.didAddPoint) {\n return true;\n }\n } // hitElement may already be set above, so check first\n\n\n pointerDownState.hit.element = (_a = pointerDownState.hit.element) !== null && _a !== void 0 ? _a : this.getElementAtPosition(pointerDownState.origin.x, pointerDownState.origin.y);\n\n if (pointerDownState.hit.element) {\n // Early return if pointer is hitting link icon\n const hitLinkElement = this.getElementLinkAtPosition({\n x: pointerDownState.origin.x,\n y: pointerDownState.origin.y\n }, pointerDownState.hit.element);\n\n if (hitLinkElement) {\n return false;\n }\n } // For overlapped elements one position may hit\n // multiple elements\n\n\n pointerDownState.hit.allHitElements = this.getElementsAtPosition(pointerDownState.origin.x, pointerDownState.origin.y);\n const hitElement = pointerDownState.hit.element;\n const someHitElementIsSelected = pointerDownState.hit.allHitElements.some(element => this.isASelectedElement(element));\n\n if ((hitElement === null || !someHitElementIsSelected) && !event.shiftKey && !pointerDownState.hit.hasHitCommonBoundingBoxOfSelectedElements) {\n this.clearSelection(hitElement);\n }\n\n if (this.state.editingLinearElement) {\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({\n [this.state.editingLinearElement.elementId]: true\n }, this.state)\n }); // If we click on something\n } else if (hitElement != null) {\n // on CMD/CTRL, drill down to hit element regardless of groups etc.\n if (event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) {\n if (!this.state.selectedElementIds[hitElement.id]) {\n pointerDownState.hit.wasAddedToSelection = true;\n }\n\n this.setState(prevState => Object.assign(Object.assign({}, (0,_groups__WEBPACK_IMPORTED_MODULE_23__.editGroupForSelectedElement)(prevState, hitElement)), {\n previousSelectedElementIds: this.state.selectedElementIds\n })); // mark as not completely handled so as to allow dragging etc.\n\n return false;\n } // deselect if item is selected\n // if shift is not clicked, this will always return true\n // otherwise, it will trigger selection based on current\n // state of the box\n\n\n if (!this.state.selectedElementIds[hitElement.id]) {\n // if we are currently editing a group, exiting editing mode and deselect the group.\n if (this.state.editingGroupId && !(0,_groups__WEBPACK_IMPORTED_MODULE_23__.isElementInGroup)(hitElement, this.state.editingGroupId)) {\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n selectedGroupIds: {},\n editingGroupId: null,\n activeEmbeddable: null\n });\n } // Add hit element to selection. At this point if we're not holding\n // SHIFT the previously selected element(s) were deselected above\n // (make sure you use setState updater to use latest state)\n // With shift-selection, we want to make sure that frames and their containing\n // elements are not selected at the same time.\n\n\n if (!someHitElementIsSelected && !pointerDownState.hit.hasHitCommonBoundingBoxOfSelectedElements) {\n this.setState(prevState => {\n const nextSelectedElementIds = Object.assign(Object.assign({}, prevState.selectedElementIds), {\n [hitElement.id]: true\n });\n const previouslySelectedElements = [];\n Object.keys(prevState.selectedElementIds).forEach(id => {\n const element = this.scene.getElement(id);\n element && previouslySelectedElements.push(element);\n }); // if hitElement is frame-like, deselect all of its elements\n // if they are selected\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(hitElement)) {\n (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getFrameChildren)(previouslySelectedElements, hitElement.id).forEach(element => {\n delete nextSelectedElementIds[element.id];\n });\n } else if (hitElement.frameId) {\n // if hitElement is in a frame and its frame has been selected\n // disable selection for the given element\n if (nextSelectedElementIds[hitElement.frameId]) {\n delete nextSelectedElementIds[hitElement.id];\n }\n } else {\n // hitElement is neither a frame nor an element in a frame\n // but since hitElement could be in a group with some frames\n // this means selecting hitElement will have the frames selected as well\n // because we want to keep the invariant:\n // - frames and their elements are not selected at the same time\n // we deselect elements in those frames that were previously selected\n const groupIds = hitElement.groupIds;\n const framesInGroups = new Set(groupIds.flatMap(gid => (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getElementsInGroup)(this.scene.getNonDeletedElements(), gid)).filter(element => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(element)).map(frame => frame.id));\n\n if (framesInGroups.size > 0) {\n previouslySelectedElements.forEach(element => {\n if (element.frameId && framesInGroups.has(element.frameId)) {\n // deselect element and groups containing the element\n delete nextSelectedElementIds[element.id];\n element.groupIds.flatMap(gid => (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getElementsInGroup)(this.scene.getNonDeletedElements(), gid)).forEach(element => {\n delete nextSelectedElementIds[element.id];\n });\n }\n });\n }\n }\n\n return Object.assign(Object.assign({}, (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: prevState.editingGroupId,\n selectedElementIds: nextSelectedElementIds\n }, this.scene.getNonDeletedElements(), prevState, this)), {\n showHyperlinkPopup: hitElement.link || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(hitElement) ? \"info\" : false\n });\n });\n pointerDownState.hit.wasAddedToSelection = true;\n }\n }\n }\n\n this.setState({\n previousSelectedElementIds: this.state.selectedElementIds\n });\n }\n }\n\n return false;\n };\n\n this.handleTextOnPointerDown = (event, pointerDownState) => {\n // if we're currently still editing text, clicking outside\n // should only finalize it, not create another (irrespective\n // of state.activeTool.locked)\n if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(this.state.editingElement)) {\n return;\n }\n\n let sceneX = pointerDownState.origin.x;\n let sceneY = pointerDownState.origin.y;\n const element = this.getElementAtPosition(sceneX, sceneY, {\n includeBoundTextElement: true\n }); // FIXME\n\n let container = this.getTextBindableContainerAtPosition(sceneX, sceneY);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.hasBoundTextElement)(element)) {\n container = element;\n sceneX = element.x + element.width / 2;\n sceneY = element.y + element.height / 2;\n }\n\n this.startTextEditing({\n sceneX,\n sceneY,\n insertAtParentCenter: !event.altKey,\n container,\n autoEdit: false\n });\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n\n if (!this.state.activeTool.locked) {\n this.setState({\n activeTool: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, {\n type: \"selection\"\n })\n });\n }\n };\n\n this.handleFreeDrawElementOnPointerDown = (event, elementType, pointerDownState) => {\n // Begin a mark capture. This does not have to update state yet.\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerDownState.origin.x, pointerDownState.origin.y, null);\n const strokeOptions = this.state.currentStrokeOptions; //zsviczian\n\n const simulatePressure = (strokeOptions === null || strokeOptions === void 0 ? void 0 : strokeOptions.constantPressure) ? false : event.pressure === 0.5;\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords({\n x: gridX,\n y: gridY\n });\n const element = (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.newFreeDrawElement)(Object.assign(Object.assign({\n type: elementType,\n x: gridX,\n y: gridY,\n strokeColor: this.state.currentItemStrokeColor,\n backgroundColor: this.state.currentItemBackgroundColor,\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roughness: this.state.currentItemRoughness,\n opacity: this.state.currentItemOpacity,\n roundness: null,\n simulatePressure,\n locked: false\n }, strokeOptions //zsviczian\n ? {\n customData: {\n strokeOptions\n }\n } : {}), {\n frameId: topLayerFrame ? topLayerFrame.id : null\n }));\n this.setState(prevState => {\n const nextSelectedElementIds = Object.assign({}, prevState.selectedElementIds);\n delete nextSelectedElementIds[element.id];\n return {\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(nextSelectedElementIds, prevState)\n };\n });\n const pressures = element.simulatePressure ? element.pressures : [//zsviczian\n ...element.pressures, (strokeOptions === null || strokeOptions === void 0 ? void 0 : strokeOptions.constantPressure) ? 1 : event.pressure];\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(element, {\n points: [[0, 0]],\n pressures\n });\n const boundElement = (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.getHoveredElementForBinding)(pointerDownState.origin, this.scene.getNonDeletedElementsMap());\n\n if (strokeOptions === null || strokeOptions === void 0 ? void 0 : strokeOptions.highlighter) {\n //zsviczian\n this.scene.insertElement(element, 0);\n /* this.scene.replaceAllElements([\r\n element,\r\n ...this.scene.getElementsIncludingDeleted(),\r\n ]);*/\n } else {\n this.scene.insertElement(element);\n }\n\n this.setState({\n draggingElement: element,\n editingElement: element,\n startBoundElement: boundElement,\n suggestedBindings: []\n });\n };\n\n this.insertIframeElement = ({\n sceneX,\n sceneY,\n width,\n height\n }) => {\n var _a;\n\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(sceneX, sceneY, ((_a = this.lastPointerDownEvent) === null || _a === void 0 ? void 0 : _a[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) ? null : this.state.gridSize);\n const element = (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.newIframeElement)({\n type: \"iframe\",\n x: gridX,\n y: gridY,\n strokeColor: \"transparent\",\n backgroundColor: \"transparent\",\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roughness: this.state.currentItemRoughness,\n roundness: this.getCurrentItemRoundness(\"iframe\"),\n opacity: this.state.currentItemOpacity,\n locked: false,\n width,\n height\n });\n this.scene.insertElement(element);\n return element;\n }; //create rectangle element with youtube top left on nearest grid point width / hight 640/360\n\n\n this.insertEmbeddableElement = ({\n sceneX,\n sceneY,\n link\n }) => {\n var _a;\n\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(sceneX, sceneY, ((_a = this.lastPointerDownEvent) === null || _a === void 0 ? void 0 : _a[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) ? null : this.state.gridSize);\n const embedLink = (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.getEmbedLink)(link);\n\n if (!embedLink) {\n return;\n }\n\n if (embedLink.error instanceof URIError) {\n this.setToast({\n message: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"toast.unrecognizedLinkFormat\"),\n closable: true\n });\n }\n\n const element = (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.newEmbeddableElement)({\n type: \"embeddable\",\n x: gridX,\n y: gridY,\n strokeColor: \"transparent\",\n backgroundColor: \"transparent\",\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roughness: this.state.currentItemRoughness,\n roundness: this.getCurrentItemRoundness(\"embeddable\"),\n opacity: this.state.currentItemOpacity,\n locked: false,\n width: embedLink.intrinsicSize.w,\n height: embedLink.intrinsicSize.h,\n link\n });\n this.scene.insertElement(element);\n return element;\n };\n\n this.createImageElement = ({\n sceneX,\n sceneY,\n addToFrameUnderCursor = true\n }) => {\n var _a;\n\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(sceneX, sceneY, ((_a = this.lastPointerDownEvent) === null || _a === void 0 ? void 0 : _a[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) ? null : this.state.gridSize);\n const topLayerFrame = addToFrameUnderCursor ? this.getTopLayerFrameAtSceneCoords({\n x: gridX,\n y: gridY\n }) : null;\n const element = (0,_element__WEBPACK_IMPORTED_MODULE_16__.newImageElement)({\n type: \"image\",\n x: gridX,\n y: gridY,\n strokeColor: this.state.currentItemStrokeColor,\n backgroundColor: this.state.currentItemBackgroundColor,\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roughness: this.state.currentItemRoughness,\n roundness: null,\n opacity: this.state.currentItemOpacity,\n locked: false,\n frameId: topLayerFrame ? topLayerFrame.id : null\n });\n return element;\n };\n\n this.handleLinearElementOnPointerDown = (event, elementType, pointerDownState) => {\n if (this.state.multiElement) {\n const {\n multiElement\n } = this.state; // finalize if completing a loop\n\n if (multiElement.type === \"line\" && (0,_math__WEBPACK_IMPORTED_MODULE_28__.isPathALoop)(multiElement.points, this.state.zoom.value)) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(multiElement, {\n lastCommittedPoint: multiElement.points[multiElement.points.length - 1]\n });\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n return;\n }\n\n const {\n x: rx,\n y: ry,\n lastCommittedPoint\n } = multiElement; // clicking inside commit zone → finalize arrow\n\n if (multiElement.points.length > 1 && lastCommittedPoint && (0,_math__WEBPACK_IMPORTED_MODULE_28__.distance2d)(pointerDownState.origin.x - rx, pointerDownState.origin.y - ry, lastCommittedPoint[0], lastCommittedPoint[1]) < _constants__WEBPACK_IMPORTED_MODULE_12__.LINE_CONFIRM_THRESHOLD) {\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n return;\n }\n\n this.setState(prevState => ({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(Object.assign(Object.assign({}, prevState.selectedElementIds), {\n [multiElement.id]: true\n }), prevState)\n })); // clicking outside commit zone → update reference for last committed\n // point\n\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(multiElement, {\n lastCommittedPoint: multiElement.points[multiElement.points.length - 1]\n });\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.POINTER);\n } else {\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerDownState.origin.x, pointerDownState.origin.y, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize);\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords({\n x: gridX,\n y: gridY\n });\n /* If arrow is pre-arrowheads, it will have undefined for both start and end arrowheads.\r\n If so, we want it to be null for start and \"arrow\" for end. If the linear item is not\r\n an arrow, we want it to be null for both. Otherwise, we want it to use the\r\n values from appState. */\n\n const {\n currentItemStartArrowhead,\n currentItemEndArrowhead\n } = this.state;\n const [startArrowhead, endArrowhead] = elementType === \"arrow\" ? [currentItemStartArrowhead, currentItemEndArrowhead] : [null, null];\n const element = (0,_element__WEBPACK_IMPORTED_MODULE_16__.newLinearElement)({\n type: elementType,\n x: gridX,\n y: gridY,\n strokeColor: this.state.currentItemStrokeColor,\n backgroundColor: this.state.currentItemBackgroundColor,\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roughness: this.state.currentItemRoughness,\n opacity: this.state.currentItemOpacity,\n roundness: this.state.currentItemRoundness === \"round\" ? {\n type: _constants__WEBPACK_IMPORTED_MODULE_12__.ROUNDNESS.PROPORTIONAL_RADIUS\n } : null,\n startArrowhead,\n endArrowhead,\n locked: false,\n frameId: topLayerFrame ? topLayerFrame.id : null\n });\n this.setState(prevState => {\n const nextSelectedElementIds = Object.assign({}, prevState.selectedElementIds);\n delete nextSelectedElementIds[element.id];\n return {\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(nextSelectedElementIds, prevState)\n };\n });\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(element, {\n points: [...element.points, [0, 0]]\n });\n const boundElement = (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.getHoveredElementForBinding)(pointerDownState.origin, this.scene.getNonDeletedElementsMap());\n this.scene.insertElement(element);\n this.setState({\n draggingElement: element,\n editingElement: element,\n startBoundElement: boundElement,\n suggestedBindings: []\n });\n }\n };\n\n this.createGenericElementOnPointerDown = (elementType, pointerDownState) => {\n var _a;\n\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerDownState.origin.x, pointerDownState.origin.y, ((_a = this.lastPointerDownEvent) === null || _a === void 0 ? void 0 : _a[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) ? null : this.state.gridSize);\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords({\n x: gridX,\n y: gridY\n });\n const baseElementAttributes = {\n x: gridX,\n y: gridY,\n strokeColor: this.state.currentItemStrokeColor,\n backgroundColor: this.state.currentItemBackgroundColor,\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roughness: this.state.currentItemRoughness,\n opacity: this.state.currentItemOpacity,\n roundness: this.getCurrentItemRoundness(elementType),\n locked: false,\n frameId: topLayerFrame ? topLayerFrame.id : null\n };\n let element;\n\n if (elementType === \"embeddable\") {\n element = (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.newEmbeddableElement)(Object.assign({\n type: \"embeddable\"\n }, baseElementAttributes));\n } else {\n element = (0,_element__WEBPACK_IMPORTED_MODULE_16__.newElement)(Object.assign({\n type: elementType\n }, baseElementAttributes));\n }\n\n if (element.type === \"selection\") {\n this.setState({\n selectionElement: element,\n draggingElement: element\n });\n } else {\n this.scene.insertElement(element);\n this.setState({\n multiElement: null,\n draggingElement: element,\n editingElement: element\n });\n }\n };\n\n this.createFrameElementOnPointerDown = (pointerDownState, type) => {\n var _a;\n\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerDownState.origin.x, pointerDownState.origin.y, ((_a = this.lastPointerDownEvent) === null || _a === void 0 ? void 0 : _a[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD]) ? null : this.state.gridSize);\n const constructorOpts = Object.assign(Object.assign({\n x: gridX,\n y: gridY,\n opacity: this.state.currentItemOpacity,\n locked: false\n }, _constants__WEBPACK_IMPORTED_MODULE_12__.FRAME_STYLE), this.state.frameColor ? {\n //zsviczian\n customData: {\n frameColor: this.state.frameColor\n }\n } : {});\n const frame = type === _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.magicframe ? (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.newMagicFrameElement)(constructorOpts) : (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.newFrameElement)(constructorOpts);\n this.scene.insertElement(frame);\n this.setState({\n multiElement: null,\n draggingElement: frame,\n editingElement: frame\n });\n };\n\n this.restoreReadyToEraseElements = () => {\n this.elementsPendingErasure = new Set();\n this.triggerRender();\n };\n\n this.eraseElements = () => {\n let didChange = false;\n const elements = this.scene.getElementsIncludingDeleted().map(ele => {\n if (this.elementsPendingErasure.has(ele.id) || ele.frameId && this.elementsPendingErasure.has(ele.frameId) || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBoundToContainer)(ele) && this.elementsPendingErasure.has(ele.containerId)) {\n didChange = true;\n return (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.newElementWith)(ele, {\n isDeleted: true\n });\n }\n\n return ele;\n });\n this.elementsPendingErasure = new Set();\n\n if (didChange) {\n this.store.shouldCaptureIncrement();\n this.scene.replaceAllElements(elements);\n }\n };\n\n this.initializeImage = async ({\n imageFile,\n imageElement: _imageElement,\n showCursorImagePreview = false\n }) => {\n var _a, _b, _c, _d; // at this point this should be guaranteed image file, but we do this check\n // to satisfy TS down the line\n\n\n if (!(0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.isSupportedImageFile)(imageFile)) {\n throw new Error((0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.unsupportedFileType\"));\n }\n\n const mimeType = imageFile.type;\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, \"wait\");\n\n if (mimeType === _constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.svg) {\n try {\n imageFile = (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.SVGStringToFile)(await (0,_element_image__WEBPACK_IMPORTED_MODULE_42__.normalizeSVG)(await imageFile.text()), imageFile.name);\n } catch (error) {\n console.warn(error);\n throw new Error((0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.svgImageInsertError\"));\n }\n } // generate image id (by default the file digest) before any\n // resizing/compression takes place to keep it more portable\n\n\n const fileId = await (((_b = (_a = this.props).generateIdForFile) === null || _b === void 0 ? void 0 : _b.call(_a, imageFile)) || (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.generateIdFromFile)(imageFile));\n\n if (!fileId) {\n console.warn(\"Couldn't generate file id or the supplied `generateIdForFile` didn't resolve to one.\");\n throw new Error((0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.imageInsertError\"));\n }\n\n const existingFileData = this.files[fileId];\n\n if (!(existingFileData === null || existingFileData === void 0 ? void 0 : existingFileData.dataURL)) {\n try {\n imageFile = await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.resizeImageFile)(imageFile, {\n maxWidthOrHeight: _constants__WEBPACK_IMPORTED_MODULE_12__.DEFAULT_MAX_IMAGE_WIDTH_OR_HEIGHT\n });\n } catch (error) {\n console.error(\"Error trying to resizing image file on insertion\", error);\n }\n\n if (imageFile.size > _constants__WEBPACK_IMPORTED_MODULE_12__.MAX_ALLOWED_FILE_BYTES) {\n throw new Error((0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.fileTooBig\", {\n maxSize: `${Math.trunc(_constants__WEBPACK_IMPORTED_MODULE_12__.MAX_ALLOWED_FILE_BYTES / 1024 / 1024)}MB`\n }));\n }\n }\n\n if (showCursorImagePreview) {\n const dataURL = (_c = this.files[fileId]) === null || _c === void 0 ? void 0 : _c.dataURL; // optimization so that we don't unnecessarily resize the original\n // full-size file for cursor preview\n // (it's much faster to convert the resized dataURL to File)\n\n const resizedFile = dataURL && (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.dataURLToFile)(dataURL);\n this.setImagePreviewCursor(resizedFile || imageFile);\n }\n\n const dataURL = ((_d = this.files[fileId]) === null || _d === void 0 ? void 0 : _d.dataURL) || (await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.getDataURL)(imageFile));\n const imageElement = (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(_imageElement, {\n fileId\n }, false);\n return new Promise(async (resolve, reject) => {\n var _a;\n\n try {\n this.files = Object.assign(Object.assign({}, this.files), {\n [fileId]: {\n mimeType,\n id: fileId,\n dataURL,\n created: Date.now(),\n lastRetrieved: Date.now()\n }\n });\n const cachedImageData = this.imageCache.get(fileId);\n\n if (!cachedImageData) {\n this.addNewImagesToImageCache();\n await this.updateImageCache([imageElement]);\n }\n\n if ((cachedImageData === null || cachedImageData === void 0 ? void 0 : cachedImageData.image) instanceof Promise) {\n await cachedImageData.image;\n }\n\n if (this.state.pendingImageElementId !== imageElement.id && ((_a = this.state.draggingElement) === null || _a === void 0 ? void 0 : _a.id) !== imageElement.id) {\n this.initializeImageDimensions(imageElement, true);\n }\n\n resolve(imageElement);\n } catch (error) {\n console.error(error);\n reject(new Error((0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.imageInsertError\")));\n } finally {\n if (!showCursorImagePreview) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n }\n }\n });\n };\n /**\r\n * inserts image into elements array and rerenders\r\n */\n\n\n this.insertImageElement = async (imageElement, imageFile, showCursorImagePreview) => {\n // we should be handling all cases upstream, but in case we forget to handle\n // a future case, let's throw here\n if (!this.isToolSupported(\"image\")) {\n this.setState({\n errorMessage: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.imageToolNotSupported\")\n });\n return;\n }\n\n this.scene.insertElement(imageElement);\n\n try {\n return await this.initializeImage({\n imageFile,\n imageElement,\n showCursorImagePreview\n });\n } catch (error) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(imageElement, {\n isDeleted: true\n });\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n this.setState({\n errorMessage: error.message || (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.imageInsertError\")\n });\n return null;\n }\n };\n\n this.setImagePreviewCursor = async imageFile => {\n // mustn't be larger than 128 px\n // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Basic_User_Interface/Using_URL_values_for_the_cursor_property\n const cursorImageSizePx = 96;\n let imagePreview;\n\n try {\n imagePreview = await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.resizeImageFile)(imageFile, {\n maxWidthOrHeight: cursorImageSizePx\n });\n } catch (e) {\n if (e.cause === \"UNSUPPORTED\") {\n throw new Error((0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.unsupportedFileType\"));\n }\n\n throw e;\n }\n\n let previewDataURL = await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.getDataURL)(imagePreview); // SVG cannot be resized via `resizeImageFile` so we resize by rendering to\n // a small canvas\n\n if (imageFile.type === _constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.svg) {\n const img = await (0,_element_image__WEBPACK_IMPORTED_MODULE_42__.loadHTMLImageElement)(previewDataURL);\n let height = Math.min(img.height, cursorImageSizePx);\n let width = height * (img.width / img.height);\n\n if (width > cursorImageSizePx) {\n width = cursorImageSizePx;\n height = width * (img.height / img.width);\n }\n\n const canvas = document.createElement(\"canvas\");\n canvas.height = height;\n canvas.width = width;\n const context = canvas.getContext(\"2d\");\n context.drawImage(img, 0, 0, width, height);\n previewDataURL = canvas.toDataURL(_constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.svg);\n }\n\n if (this.state.pendingImageElementId) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, `url(${previewDataURL}) 4 4, auto`);\n }\n };\n\n this.onImageAction = async ({\n insertOnCanvasDirectly\n }) => {\n try {\n const clientX = this.state.width / 2 + this.state.offsetLeft;\n const clientY = this.state.height / 2 + this.state.offsetTop;\n const {\n x,\n y\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX,\n clientY\n }, this.state);\n const imageFile = await (0,_data_filesystem__WEBPACK_IMPORTED_MODULE_44__.fileOpen)({\n description: \"Image\",\n extensions: Object.keys(_constants__WEBPACK_IMPORTED_MODULE_12__.IMAGE_MIME_TYPES)\n });\n const imageElement = this.createImageElement({\n sceneX: x,\n sceneY: y,\n addToFrameUnderCursor: false\n });\n\n if (insertOnCanvasDirectly) {\n this.insertImageElement(imageElement, imageFile);\n this.initializeImageDimensions(imageElement);\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({\n [imageElement.id]: true\n }, this.state)\n }, () => {\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n });\n } else {\n this.setState({\n pendingImageElementId: imageElement.id\n }, () => {\n this.insertImageElement(imageElement, imageFile,\n /* showCursorImagePreview */\n true);\n });\n }\n } catch (error) {\n if (error.name !== \"AbortError\") {\n console.error(error);\n } else {\n console.warn(error);\n }\n\n this.setState({\n pendingImageElementId: null,\n editingElement: null,\n activeTool: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, {\n type: \"selection\"\n })\n }, () => {\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n });\n }\n };\n\n this.initializeImageDimensions = (imageElement, forceNaturalSize = false) => {\n var _a;\n\n const image = (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isInitializedImageElement)(imageElement) && ((_a = this.imageCache.get(imageElement.fileId)) === null || _a === void 0 ? void 0 : _a.image);\n\n if (!image || image instanceof Promise) {\n if (imageElement.width < _constants__WEBPACK_IMPORTED_MODULE_12__.DRAGGING_THRESHOLD / this.state.zoom.value && imageElement.height < _constants__WEBPACK_IMPORTED_MODULE_12__.DRAGGING_THRESHOLD / this.state.zoom.value) {\n const placeholderSize = 100 / this.state.zoom.value;\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(imageElement, {\n x: imageElement.x - placeholderSize / 2,\n y: imageElement.y - placeholderSize / 2,\n width: placeholderSize,\n height: placeholderSize\n });\n }\n\n return;\n }\n\n if (forceNaturalSize || // if user-created bounding box is below threshold, assume the\n // intention was to click instead of drag, and use the image's\n // intrinsic size\n imageElement.width < _constants__WEBPACK_IMPORTED_MODULE_12__.DRAGGING_THRESHOLD / this.state.zoom.value && imageElement.height < _constants__WEBPACK_IMPORTED_MODULE_12__.DRAGGING_THRESHOLD / this.state.zoom.value) {\n const minHeight = Math.max(this.state.height - 120, 160); // max 65% of canvas height, clamped to <300px, vh - 120px>\n\n const maxHeight = Math.min(minHeight, Math.floor(this.state.height * 0.5) / this.state.zoom.value);\n const height = Math.min(image.naturalHeight, maxHeight);\n const width = height * (image.naturalWidth / image.naturalHeight); // add current imageElement width/height to account for previous centering\n // of the placeholder image\n\n const x = imageElement.x + imageElement.width / 2 - width / 2;\n const y = imageElement.y + imageElement.height / 2 - height / 2;\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(imageElement, {\n x,\n y,\n width,\n height\n });\n }\n };\n /** updates image cache, refreshing updated elements and/or setting status\r\n to error for images that fail during <img> element creation */\n\n\n this.updateImageCache = async (elements, files = this.files) => {\n const {\n updatedFiles,\n erroredFiles\n } = await (0,_element_image__WEBPACK_IMPORTED_MODULE_42__.updateImageCache)({\n imageCache: this.imageCache,\n fileIds: elements.map(element => element.fileId),\n files\n });\n\n if (updatedFiles.size || erroredFiles.size) {\n for (const element of elements) {\n if (updatedFiles.has(element.fileId)) {\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_67__.ShapeCache[\"delete\"](element);\n }\n }\n }\n\n if (erroredFiles.size) {\n this.scene.replaceAllElements(this.scene.getElementsIncludingDeleted().map(element => {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isInitializedImageElement)(element) && erroredFiles.has(element.fileId)) {\n return (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.newElementWith)(element, {\n status: \"error\"\n });\n }\n\n return element;\n }));\n }\n\n return {\n updatedFiles,\n erroredFiles\n };\n };\n /** adds new images to imageCache and re-renders if needed */\n\n\n this.addNewImagesToImageCache = async (imageElements = (0,_element_image__WEBPACK_IMPORTED_MODULE_42__.getInitializedImageElements)(this.scene.getNonDeletedElements()), files = this.files) => {\n const uncachedImageElements = imageElements.filter(element => !element.isDeleted && !this.imageCache.has(element.fileId));\n\n if (uncachedImageElements.length) {\n const {\n updatedFiles\n } = await this.updateImageCache(uncachedImageElements, files);\n\n if (updatedFiles.size) {\n this.scene.triggerUpdate();\n }\n }\n };\n /** generally you should use `addNewImagesToImageCache()` directly if you need\r\n * to render new images. This is just a failsafe */\n\n\n this.scheduleImageRefresh = lodash_throttle__WEBPACK_IMPORTED_MODULE_43___default()(() => {\n this.addNewImagesToImageCache();\n }, _constants__WEBPACK_IMPORTED_MODULE_12__.IMAGE_RENDER_TIMEOUT);\n\n this.updateBindingEnabledOnPointerMove = event => {\n const shouldEnableBinding = (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.shouldEnableBindingForPointerEvent)(event);\n\n if (this.state.isBindingEnabled !== shouldEnableBinding) {\n this.setState({\n isBindingEnabled: shouldEnableBinding\n });\n }\n };\n\n this.maybeSuggestBindingAtCursor = pointerCoords => {\n const hoveredBindableElement = (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.getHoveredElementForBinding)(pointerCoords, this.scene.getNonDeletedElementsMap());\n this.setState({\n suggestedBindings: hoveredBindableElement != null ? [hoveredBindableElement] : []\n });\n };\n\n this.maybeSuggestBindingsForLinearElementAtCoords = (linearElement,\n /** scene coords */\n pointerCoords, // During line creation the start binding hasn't been written yet\n // into `linearElement`\n oppositeBindingBoundElement) => {\n if (!pointerCoords.length) {\n return;\n }\n\n const suggestedBindings = pointerCoords.reduce((acc, coords) => {\n const hoveredBindableElement = (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.getHoveredElementForBinding)(coords, this.scene.getNonDeletedElementsMap());\n\n if (hoveredBindableElement != null && !(0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.isLinearElementSimpleAndAlreadyBound)(linearElement, oppositeBindingBoundElement === null || oppositeBindingBoundElement === void 0 ? void 0 : oppositeBindingBoundElement.id, hoveredBindableElement)) {\n acc.push(hoveredBindableElement);\n }\n\n return acc;\n }, []);\n this.setState({\n suggestedBindings\n });\n };\n\n this.handleInteractiveCanvasRef = canvas => {\n var _a, _b, _c; // canvas is null when unmounting\n\n\n if (canvas !== null) {\n this.interactiveCanvas = canvas; // -----------------------------------------------------------------------\n // NOTE wheel, touchstart, touchend events must be registered outside\n // of react because react binds them them passively (so we can't prevent\n // default on them)\n\n this.interactiveCanvas.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.WHEEL, this.handleWheel);\n this.interactiveCanvas.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.TOUCH_START, this.onTouchStart);\n this.interactiveCanvas.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.TOUCH_END, this.onTouchEnd); // -----------------------------------------------------------------------\n } else {\n (_a = this.interactiveCanvas) === null || _a === void 0 ? void 0 : _a.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.WHEEL, this.handleWheel);\n (_b = this.interactiveCanvas) === null || _b === void 0 ? void 0 : _b.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.TOUCH_START, this.onTouchStart);\n (_c = this.interactiveCanvas) === null || _c === void 0 ? void 0 : _c.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.TOUCH_END, this.onTouchEnd);\n }\n };\n\n this.handleAppOnDrop = async event => {\n var _a, _b, _c, _d;\n\n if (this.props.onDrop) {\n try {\n if ((await this.props.onDrop(event)) === false) {\n return;\n }\n } catch (e) {\n console.error(e);\n }\n } // must be retrieved first, in the same frame\n\n\n const {\n file,\n fileHandle\n } = await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.getFileFromEvent)(event);\n const {\n x: sceneX,\n y: sceneY\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(event, this.state);\n\n try {\n // if image tool not supported, don't show an error here and let it fall\n // through so we still support importing scene data from images. If no\n // scene data encoded, we'll show an error then\n if ((0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.isSupportedImageFile)(file) && this.isToolSupported(\"image\")) {\n // first attempt to decode scene from the image if it's embedded\n // ---------------------------------------------------------------------\n if ((file === null || file === void 0 ? void 0 : file.type) === _constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.png || (file === null || file === void 0 ? void 0 : file.type) === _constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.svg) {\n try {\n const scene = await (0,_data__WEBPACK_IMPORTED_MODULE_13__.loadFromBlob)(file, this.state, this.scene.getElementsIncludingDeleted(), fileHandle);\n this.syncActionResult(Object.assign(Object.assign({}, scene), {\n appState: Object.assign(Object.assign({}, scene.appState || this.state), {\n isLoading: false\n }),\n replaceFiles: true,\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.CAPTURE\n }));\n return;\n } catch (error) {\n // Don't throw for image scene daa\n if (error.name !== \"EncodingError\") {\n throw new Error((0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"alerts.couldNotLoadInvalidFile\"));\n }\n }\n } // if no scene is embedded or we fail for whatever reason, fall back\n // to importing as regular image\n // ---------------------------------------------------------------------\n\n\n const imageElement = this.createImageElement({\n sceneX,\n sceneY\n });\n this.insertImageElement(imageElement, file);\n this.initializeImageDimensions(imageElement);\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({\n [imageElement.id]: true\n }, this.state)\n });\n return;\n }\n } catch (error) {\n return this.setState({\n isLoading: false,\n errorMessage: error.message\n });\n }\n\n const libraryJSON = event.dataTransfer.getData(_constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.excalidrawlib);\n\n if (libraryJSON && typeof libraryJSON === \"string\") {\n try {\n const libraryItems = (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.parseLibraryJSON)(libraryJSON);\n this.addElementsFromPasteOrLibrary({\n elements: (0,_data_library__WEBPACK_IMPORTED_MODULE_14__.distributeLibraryItemsOnSquareGrid)(libraryItems),\n position: event,\n files: null\n });\n } catch (error) {\n this.setState({\n errorMessage: error.message\n });\n }\n\n return;\n }\n\n if (file) {\n // Attempt to parse an excalidraw/excalidrawlib file\n await this.loadFileToCanvas(file, fileHandle);\n }\n\n if ((_b = (_a = event.dataTransfer) === null || _a === void 0 ? void 0 : _a.types) === null || _b === void 0 ? void 0 : _b.includes(\"text/plain\")) {\n const text = (_c = event.dataTransfer) === null || _c === void 0 ? void 0 : _c.getData(\"text\");\n\n if (text && (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.embeddableURLValidator)(text, this.props.validateEmbeddable) && (/^(http|https):\\/\\/[^\\s/$.?#].[^\\s]*$/.test(text) || ((_d = (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.getEmbedLink)(text)) === null || _d === void 0 ? void 0 : _d.type) === \"video\")) {\n const embeddable = this.insertEmbeddableElement({\n sceneX,\n sceneY,\n link: (0,_data_url__WEBPACK_IMPORTED_MODULE_47__.normalizeLink)(text)\n });\n\n if (embeddable) {\n this.setState({\n selectedElementIds: {\n [embeddable.id]: true\n }\n });\n }\n }\n }\n };\n\n this.loadFileToCanvas = async (file, fileHandle) => {\n file = await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.normalizeFile)(file);\n\n try {\n const elements = this.scene.getElementsIncludingDeleted();\n let ret;\n\n try {\n ret = await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.loadSceneOrLibraryFromBlob)(file, this.state, elements, fileHandle);\n } catch (error) {\n const imageSceneDataError = error instanceof _errors__WEBPACK_IMPORTED_MODULE_58__.ImageSceneDataError;\n\n if (imageSceneDataError && error.code === \"IMAGE_NOT_CONTAINS_SCENE_DATA\" && !this.isToolSupported(\"image\")) {\n this.setState({\n isLoading: false,\n errorMessage: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.imageToolNotSupported\")\n });\n return;\n }\n\n const errorMessage = imageSceneDataError ? (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"alerts.cannotRestoreFromImage\") : (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"alerts.couldNotLoadInvalidFile\");\n this.setState({\n isLoading: false,\n errorMessage\n });\n }\n\n if (!ret) {\n return;\n }\n\n if (ret.type === _constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.excalidraw) {\n // restore the fractional indices by mutating elements\n (0,_fractionalIndex__WEBPACK_IMPORTED_MODULE_90__.syncInvalidIndices)(elements.concat(ret.data.elements)); // update the store snapshot for old elements, otherwise we would end up with duplicated fractional indices on undo\n\n this.store.updateSnapshot((0,_utils__WEBPACK_IMPORTED_MODULE_35__.arrayToMap)(elements), this.state);\n this.setState({\n isLoading: true\n });\n this.syncActionResult(Object.assign(Object.assign({}, ret.data), {\n appState: Object.assign(Object.assign({}, ret.data.appState || this.state), {\n isLoading: false\n }),\n replaceFiles: true,\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.CAPTURE\n }));\n } else if (ret.type === _constants__WEBPACK_IMPORTED_MODULE_12__.MIME_TYPES.excalidrawlib) {\n await this.library.updateLibrary({\n libraryItems: file,\n merge: true,\n openLibraryMenu: true\n }).catch(error => {\n console.error(error);\n this.setState({\n errorMessage: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.importLibraryError\")\n });\n });\n }\n } catch (error) {\n this.setState({\n isLoading: false,\n errorMessage: error.message\n });\n }\n };\n\n this.handleCanvasContextMenu = event => {\n event.preventDefault();\n\n if ((\"pointerType\" in event.nativeEvent && event.nativeEvent.pointerType === \"touch\" || \"pointerType\" in event.nativeEvent && event.nativeEvent.pointerType === \"pen\" && // always allow if user uses a pen secondary button\n event.button !== _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_BUTTON.SECONDARY) && this.state.activeTool.type !== \"selection\") {\n return;\n }\n\n const {\n x,\n y\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(event, this.state);\n const element = this.getElementAtPosition(x, y, {\n preferSelected: true,\n includeLockedElements: true\n });\n const selectedElements = this.scene.getSelectedElements(this.state);\n const isHittingCommonBoundBox = this.isHittingCommonBoundingBoxOfSelectedElements({\n x,\n y\n }, selectedElements);\n const type = element || isHittingCommonBoundBox ? \"element\" : \"canvas\";\n const container = this.excalidrawContainerRef.current;\n const {\n top: offsetTop,\n left: offsetLeft\n } = container.getBoundingClientRect();\n const left = event.clientX - offsetLeft;\n const top = event.clientY - offsetTop;\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"contextMenu\", \"openContextMenu\", type);\n this.setState(Object.assign(Object.assign({}, element && !this.state.selectedElementIds[element.id] ? Object.assign(Object.assign(Object.assign({}, this.state), (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: this.state.editingGroupId,\n selectedElementIds: {\n [element.id]: true\n }\n }, this.scene.getNonDeletedElements(), this.state, this)), {\n selectedLinearElement: (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(element) ? new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(element) : null\n }) : this.state), {\n showHyperlinkPopup: false\n }), () => {\n this.setState({\n contextMenu: {\n top,\n left,\n items: this.getContextMenuItems(type)\n }\n });\n });\n };\n\n this.maybeDragNewGenericElement = (pointerDownState, event) => {\n var _a, _b, _c, _d, _e;\n\n const draggingElement = this.state.draggingElement;\n const pointerCoords = pointerDownState.lastCoords;\n\n if (!draggingElement) {\n return;\n }\n\n if (draggingElement.type === \"selection\" && this.state.activeTool.type !== \"eraser\") {\n (0,_element__WEBPACK_IMPORTED_MODULE_16__.dragNewElement)(draggingElement, this.state.activeTool.type, pointerDownState.origin.x, pointerDownState.origin.y, pointerCoords.x, pointerCoords.y, (0,_utils__WEBPACK_IMPORTED_MODULE_35__.distance)(pointerDownState.origin.x, pointerCoords.x), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.distance)(pointerDownState.origin.y, pointerCoords.y), (0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldMaintainAspectRatio)(event), (0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldResizeFromCenter)(event), this.state.zoom.value);\n } else {\n let [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerCoords.x, pointerCoords.y, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize);\n const image = (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isInitializedImageElement)(draggingElement) && ((_a = this.imageCache.get(draggingElement.fileId)) === null || _a === void 0 ? void 0 : _a.image);\n const aspectRatio = image && !(image instanceof Promise) ? image.width / image.height : null;\n this.maybeCacheReferenceSnapPoints(event, [draggingElement]);\n const {\n snapOffset,\n snapLines\n } = (0,_snapping__WEBPACK_IMPORTED_MODULE_59__.snapNewElement)(draggingElement, this.state, event, {\n x: pointerDownState.originInGrid.x + ((_c = (_b = this.state.originSnapOffset) === null || _b === void 0 ? void 0 : _b.x) !== null && _c !== void 0 ? _c : 0),\n y: pointerDownState.originInGrid.y + ((_e = (_d = this.state.originSnapOffset) === null || _d === void 0 ? void 0 : _d.y) !== null && _e !== void 0 ? _e : 0)\n }, {\n x: gridX - pointerDownState.originInGrid.x,\n y: gridY - pointerDownState.originInGrid.y\n }, this.scene.getNonDeletedElementsMap());\n gridX += snapOffset.x;\n gridY += snapOffset.y;\n this.setState({\n snapLines\n });\n (0,_element__WEBPACK_IMPORTED_MODULE_16__.dragNewElement)(draggingElement, this.state.activeTool.type, pointerDownState.originInGrid.x, pointerDownState.originInGrid.y, gridX, gridY, (0,_utils__WEBPACK_IMPORTED_MODULE_35__.distance)(pointerDownState.originInGrid.x, gridX), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.distance)(pointerDownState.originInGrid.y, gridY), (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isImageElement)(draggingElement) ? !(0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldMaintainAspectRatio)(event) : (0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldMaintainAspectRatio)(event), (0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldResizeFromCenter)(event), this.state.zoom.value, aspectRatio, this.state.originSnapOffset); // highlight elements that are to be added to frames on frames creation\n\n if (this.state.activeTool.type === _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.frame || this.state.activeTool.type === _constants__WEBPACK_IMPORTED_MODULE_12__.TOOL_TYPE.magicframe) {\n this.setState({\n elementsToHighlight: (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getElementsInResizingFrame)(this.scene.getNonDeletedElements(), draggingElement, this.state, this.scene.getNonDeletedElementsMap())\n });\n }\n }\n };\n\n this.maybeHandleResize = (pointerDownState, event) => {\n const selectedElements = this.scene.getSelectedElements(this.state);\n const selectedFrames = selectedElements.filter(element => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(element));\n const transformHandleType = pointerDownState.resize.handleType;\n\n if (selectedFrames.length > 0 && transformHandleType === \"rotation\") {\n return false;\n }\n\n this.setState({\n // TODO: rename this state field to \"isScaling\" to distinguish\n // it from the generic \"isResizing\" which includes scaling and\n // rotating\n isResizing: transformHandleType && transformHandleType !== \"rotation\",\n isRotating: transformHandleType === \"rotation\",\n activeEmbeddable: null\n });\n const pointerCoords = pointerDownState.lastCoords;\n let [resizeX, resizeY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerCoords.x - pointerDownState.resize.offset.x, pointerCoords.y - pointerDownState.resize.offset.y, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize);\n const frameElementsOffsetsMap = new Map();\n selectedFrames.forEach(frame => {\n const elementsInFrame = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getFrameChildren)(this.scene.getNonDeletedElements(), frame.id);\n elementsInFrame.forEach(element => {\n frameElementsOffsetsMap.set(frame.id + element.id, {\n x: element.x - frame.x,\n y: element.y - frame.y\n });\n });\n }); // check needed for avoiding flickering when a key gets pressed\n // during dragging\n\n if (!this.state.selectedElementsAreBeingDragged) {\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerCoords.x, pointerCoords.y, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize);\n const dragOffset = {\n x: gridX - pointerDownState.originInGrid.x,\n y: gridY - pointerDownState.originInGrid.y\n };\n const originalElements = [...pointerDownState.originalElements.values()];\n this.maybeCacheReferenceSnapPoints(event, selectedElements);\n const {\n snapOffset,\n snapLines\n } = (0,_snapping__WEBPACK_IMPORTED_MODULE_59__.snapResizingElements)(selectedElements, (0,_scene__WEBPACK_IMPORTED_MODULE_29__.getSelectedElements)(originalElements, this.state), this.state, event, dragOffset, transformHandleType);\n resizeX += snapOffset.x;\n resizeY += snapOffset.y;\n this.setState({\n snapLines\n });\n }\n\n if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.transformElements)(pointerDownState.originalElements, transformHandleType, selectedElements, this.scene.getElementsMapIncludingDeleted(), (0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldRotateWithDiscreteAngle)(event), (0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldResizeFromCenter)(event), selectedElements.some(element => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isImageElement)(element)) ? !(0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldMaintainAspectRatio)(event) : (0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldMaintainAspectRatio)(event), resizeX, resizeY, pointerDownState.resize.center.x, pointerDownState.resize.center.y)) {\n const suggestedBindings = (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.getSuggestedBindingsForArrows)(selectedElements, this.scene.getNonDeletedElementsMap());\n const elementsToHighlight = new Set();\n selectedFrames.forEach(frame => {\n (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getElementsInResizingFrame)(this.scene.getNonDeletedElements(), frame, this.state, this.scene.getNonDeletedElementsMap()).forEach(element => elementsToHighlight.add(element));\n });\n this.setState({\n elementsToHighlight: [...elementsToHighlight],\n suggestedBindings\n });\n return true;\n }\n\n return false;\n };\n\n this.getContextMenuItems = type => {\n const options = [];\n options.push(_actions__WEBPACK_IMPORTED_MODULE_5__.actionCopyAsPng, _actions__WEBPACK_IMPORTED_MODULE_5__.actionCopyAsSvg); // canvas contextMenu\n // -------------------------------------------------------------------------\n\n if (type === \"canvas\") {\n if (this.state.viewModeEnabled) {\n return [...options, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleGridMode, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleZenMode, _actions_actionToggleViewMode__WEBPACK_IMPORTED_MODULE_40__.actionToggleViewMode, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleStats, _actions_actionCanvas__WEBPACK_IMPORTED_MODULE_55__.actionToggleLaserPointer];\n }\n\n return [_actions_actionClipboard__WEBPACK_IMPORTED_MODULE_53__.actionPaste, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionCopyAsPng, _actions__WEBPACK_IMPORTED_MODULE_5__.actionCopyAsSvg, _actions__WEBPACK_IMPORTED_MODULE_5__.copyText, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionSelectAll, _actions_actionElementLock__WEBPACK_IMPORTED_MODULE_49__.actionUnlockAllElements, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleGridMode, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleObjectsSnapMode, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleZenMode, _actions_actionToggleViewMode__WEBPACK_IMPORTED_MODULE_40__.actionToggleViewMode, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleStats];\n } // element contextMenu\n // -------------------------------------------------------------------------\n\n\n options.push(_actions__WEBPACK_IMPORTED_MODULE_5__.copyText);\n\n if (this.state.viewModeEnabled) {\n return [_actions__WEBPACK_IMPORTED_MODULE_5__.actionCopy, ...options];\n }\n\n return [_ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionCut, _actions__WEBPACK_IMPORTED_MODULE_5__.actionCopy, _actions_actionClipboard__WEBPACK_IMPORTED_MODULE_53__.actionPaste, _actions_actionFrame__WEBPACK_IMPORTED_MODULE_54__.actionSelectAllElementsInFrame, _actions_actionFrame__WEBPACK_IMPORTED_MODULE_54__.actionRemoveAllElementsFromFrame, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, ...options, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionCopyStyles, _actions__WEBPACK_IMPORTED_MODULE_5__.actionPasteStyles, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionGroup, _actions_actionTextAutoResize__WEBPACK_IMPORTED_MODULE_94__.actionTextAutoResize, _actions__WEBPACK_IMPORTED_MODULE_5__.actionUnbindText, _actions__WEBPACK_IMPORTED_MODULE_5__.actionBindText, _actions_actionBoundText__WEBPACK_IMPORTED_MODULE_60__.actionWrapTextInContainer, _actions__WEBPACK_IMPORTED_MODULE_5__.actionUngroup, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionAddToLibrary, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionSendBackward, _actions__WEBPACK_IMPORTED_MODULE_5__.actionBringForward, _actions__WEBPACK_IMPORTED_MODULE_5__.actionSendToBack, _actions__WEBPACK_IMPORTED_MODULE_5__.actionBringToFront, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionFlipHorizontal, _actions__WEBPACK_IMPORTED_MODULE_5__.actionFlipVertical, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleLinearEditor, _actions__WEBPACK_IMPORTED_MODULE_5__.actionLink, _actions__WEBPACK_IMPORTED_MODULE_5__.actionDuplicateSelection, _actions__WEBPACK_IMPORTED_MODULE_5__.actionToggleElementLock, _ContextMenu__WEBPACK_IMPORTED_MODULE_37__.CONTEXT_MENU_SEPARATOR, _actions__WEBPACK_IMPORTED_MODULE_5__.actionDeleteSelected];\n };\n\n this.handleWheel = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n event.preventDefault();\n\n if (isPanning) {\n return;\n }\n\n const {\n deltaX,\n deltaY\n } = event; // note that event.ctrlKey is necessary to handle pinch zooming\n\n if ( //zsviczian\n (event.metaKey || event.ctrlKey) && !this.state.allowWheelZoom || !(event.metaKey || event.ctrlKey) && this.state.allowWheelZoom) {\n const sign = Math.sign(deltaY);\n const MAX_STEP = _constants__WEBPACK_IMPORTED_MODULE_12__.ZOOM_STEP * 100;\n const absDelta = Math.abs(deltaY);\n let delta = deltaY;\n\n if (absDelta > MAX_STEP) {\n delta = MAX_STEP * sign;\n }\n\n let newZoom = this.state.zoom.value - delta / 100; // increase zoom steps the more zoomed-in we are (applies to >100% only)\n\n newZoom += Math.log10(Math.max(1, this.state.zoom.value)) * -sign * // reduced amplification for small deltas (small movements on a trackpad)\n Math.min(1, absDelta / 20);\n this.translateCanvas(state => Object.assign(Object.assign({}, (0,_scene_zoom__WEBPACK_IMPORTED_MODULE_31__.getStateForZoom)({\n viewportX: this.lastViewportPosition.x,\n viewportY: this.lastViewportPosition.y,\n nextZoom: (0,_scene__WEBPACK_IMPORTED_MODULE_29__.getNormalizedZoom)(newZoom)\n }, state)), {\n shouldCacheIgnoreZoom: true\n }));\n this.resetShouldCacheIgnoreZoomDebounced();\n return;\n } // scroll horizontally when shift pressed\n\n\n if (event.shiftKey) {\n this.translateCanvas(({\n zoom,\n scrollX\n }) => ({\n // on Mac, shift+wheel tends to result in deltaX\n scrollX: scrollX - (deltaY || deltaX) / zoom.value\n }));\n return;\n }\n\n this.translateCanvas(({\n zoom,\n scrollX,\n scrollY\n }) => ({\n scrollX: scrollX - deltaX / zoom.value,\n scrollY: scrollY - deltaY / zoom.value\n }));\n });\n\n this.savePointer = (x, y, button) => {\n var _a, _b;\n\n if (!x || !y) {\n return;\n }\n\n const {\n x: sceneX,\n y: sceneY\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX: x,\n clientY: y\n }, this.state);\n\n if (isNaN(sceneX) || isNaN(sceneY)) {// sometimes the pointer goes off screen\n }\n\n const pointer = {\n x: sceneX,\n y: sceneY,\n tool: this.state.activeTool.type === \"laser\" ? \"laser\" : \"pointer\"\n };\n (_b = (_a = this.props).onPointerUpdate) === null || _b === void 0 ? void 0 : _b.call(_a, {\n pointer,\n button,\n pointersMap: gesture.pointers\n });\n };\n\n this.resetShouldCacheIgnoreZoomDebounced = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.debounce)(() => {\n if (!this.unmounted) {\n this.setState({\n shouldCacheIgnoreZoom: false\n });\n }\n }, 300);\n\n this.updateDOMRect = cb => {\n var _a;\n\n if ((_a = this.excalidrawContainerRef) === null || _a === void 0 ? void 0 : _a.current) {\n const excalidrawContainer = this.excalidrawContainerRef.current;\n const {\n width,\n height,\n left: offsetLeft,\n top: offsetTop\n } = excalidrawContainer.getBoundingClientRect();\n const {\n width: currentWidth,\n height: currentHeight,\n offsetTop: currentOffsetTop,\n offsetLeft: currentOffsetLeft\n } = this.state;\n\n if (width === currentWidth && height === currentHeight && offsetLeft === currentOffsetLeft && offsetTop === currentOffsetTop) {\n if (cb) {\n cb();\n }\n\n return;\n } //zsviczian\n\n\n if (width === 0 || height === 0) {\n if (cb) {\n cb();\n }\n\n return;\n }\n\n this.setState({\n width,\n height,\n offsetLeft,\n offsetTop\n }, () => {\n cb && cb();\n });\n }\n };\n\n this.refresh = () => {\n this.setState(Object.assign({}, this.getCanvasOffsets()));\n };\n\n const defaultAppState = (0,_appState__WEBPACK_IMPORTED_MODULE_10__.getDefaultAppState)();\n const {\n excalidrawAPI,\n viewModeEnabled = false,\n zenModeEnabled = false,\n gridModeEnabled = false,\n objectsSnapModeEnabled = false,\n theme = defaultAppState.theme,\n initState,\n //zsviczian\n obsidianHostPlugin,\n //zsviczian\n name = `${(0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"labels.untitled\")}-${(0,_utils__WEBPACK_IMPORTED_MODULE_35__.getDateTime)()}`\n } = props;\n this.state = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, defaultAppState), {\n theme,\n isLoading: true\n }), this.getCanvasOffsets()), {\n viewModeEnabled,\n zenModeEnabled,\n objectsSnapModeEnabled,\n gridSize: gridModeEnabled ? _constants__WEBPACK_IMPORTED_MODULE_12__.GRID_SIZE : null,\n name,\n width: window.innerWidth,\n height: window.innerHeight\n }), initState !== null && initState !== void 0 ? initState : {});\n this.id = (0,nanoid__WEBPACK_IMPORTED_MODULE_98__.nanoid)();\n (0,_obsidianUtils__WEBPACK_IMPORTED_MODULE_86__.initializeObsidianUtils)(obsidianHostPlugin.deref()); //zsviczian\n\n this.library = new _data_library__WEBPACK_IMPORTED_MODULE_14__[\"default\"](this);\n this.actionManager = new _actions_manager__WEBPACK_IMPORTED_MODULE_7__.ActionManager(this.syncActionResult, () => this.state, () => this.scene.getElementsIncludingDeleted(), this);\n this.scene = new _scene_Scene__WEBPACK_IMPORTED_MODULE_30__[\"default\"]();\n this.canvas = document.createElement(\"canvas\");\n this.rc = roughjs_bin_rough__WEBPACK_IMPORTED_MODULE_3__[\"default\"].canvas(this.canvas);\n this.renderer = new _scene_Renderer__WEBPACK_IMPORTED_MODULE_66__.Renderer(this.scene);\n this.store = new _store__WEBPACK_IMPORTED_MODULE_80__.Store();\n this.history = new _history__WEBPACK_IMPORTED_MODULE_24__.History();\n\n if (excalidrawAPI) {\n const api = {\n updateScene: this.updateScene,\n updateLibrary: this.library.updateLibrary,\n addFiles: this.addFiles,\n resetScene: this.resetScene,\n getSceneElementsIncludingDeleted: this.getSceneElementsIncludingDeleted,\n history: {\n clear: this.resetHistory\n },\n scrollToContent: this.scrollToContent,\n zoomToFit: this.zoomToFit,\n startLineEditor: this.startLineEditor,\n getSceneElements: this.getSceneElements,\n getAppState: () => this.state,\n getFiles: () => this.files,\n getName: this.getName,\n registerAction: action => {\n this.actionManager.registerAction(action);\n },\n refresh: this.refresh,\n setToast: this.setToast,\n updateContainerSize: this.updateContainerSize,\n id: this.id,\n setLocalFont: this.setLocalFont,\n selectElements: this.selectElements,\n sendBackward: this.sendBackward,\n bringForward: this.bringForward,\n sendToBack: this.sendToBack,\n bringToFront: this.bringToFront,\n setMobileModeAllowed: this.setMobileModeAllowed,\n setActiveTool: this.setActiveTool,\n setCursor: this.setCursor,\n resetCursor: this.resetCursor,\n updateFrameRendering: this.updateFrameRendering,\n toggleSidebar: this.toggleSidebar,\n getHTMLIFrameElement: id => this.getHTMLIFrameElement(id),\n onChange: cb => this.onChangeEmitter.on(cb),\n onPointerDown: cb => this.onPointerDownEmitter.on(cb),\n onPointerUp: cb => this.onPointerUpEmitter.on(cb),\n onScrollChange: cb => this.onScrollChangeEmitter.on(cb),\n onUserFollow: cb => this.onUserFollowEmitter.on(cb)\n };\n\n if (typeof excalidrawAPI === \"function\") {\n excalidrawAPI(api);\n } else {\n console.error(\"excalidrawAPI should be a function!\");\n }\n }\n\n this.excalidrawContainerValue = {\n container: this.excalidrawContainerRef.current,\n id: this.id\n };\n this.fonts = new _scene_Fonts__WEBPACK_IMPORTED_MODULE_50__.Fonts({\n scene: this.scene\n });\n this.history = new _history__WEBPACK_IMPORTED_MODULE_24__.History();\n this.actionManager.registerAll(_actions_register__WEBPACK_IMPORTED_MODULE_8__.actions);\n this.actionManager.registerAction((0,_actions_actionHistory__WEBPACK_IMPORTED_MODULE_6__.createUndoAction)(this.history, this.store));\n this.actionManager.registerAction((0,_actions_actionHistory__WEBPACK_IMPORTED_MODULE_6__.createRedoAction)(this.history, this.store));\n }\n\n onWindowMessage(event) {\n if (event.origin !== \"https://player.vimeo.com\" && event.origin !== \"https://www.youtube.com\") {\n return;\n }\n\n let data = null;\n\n try {\n data = JSON.parse(event.data);\n } catch (e) {}\n\n if (!data) {\n return;\n }\n\n switch (event.origin) {\n case \"https://player.vimeo.com\":\n //Allowing for multiple instances of Excalidraw running in the window\n if (data.method === \"paused\") {\n let source = null;\n const iframes = document.body.querySelectorAll(\"iframe.excalidraw__embeddable\");\n\n if (!iframes) {\n break;\n }\n\n for (const iframe of iframes) {\n if (iframe.contentWindow === event.source) {\n source = iframe.contentWindow;\n }\n }\n\n source === null || source === void 0 ? void 0 : source.postMessage(JSON.stringify({\n method: data.value ? \"play\" : \"pause\",\n value: true\n }), \"*\");\n }\n\n break;\n\n case \"https://www.youtube.com\":\n if (data.event === \"infoDelivery\" && data.info && data.id && typeof data.info.playerState === \"number\") {\n const id = data.id;\n const playerState = data.info.playerState;\n\n if (Object.values(_constants__WEBPACK_IMPORTED_MODULE_12__.YOUTUBE_STATES).includes(playerState)) {\n YOUTUBE_VIDEO_STATES.set(id, playerState);\n }\n }\n\n break;\n }\n }\n\n cacheEmbeddableRef(element, ref) {\n if (ref) {\n this.iFrameRefs.set(element.id, ref);\n }\n }\n\n getHTMLIFrameElement(element) {\n if (typeof element === \"string\") {\n //zsviczian\n return this.iFrameRefs.get(element);\n }\n\n return this.iFrameRefs.get(element.id);\n }\n\n handleEmbeddableCenterClick(element) {\n var _a, _b, _c, _d;\n\n if (((_a = this.state.activeEmbeddable) === null || _a === void 0 ? void 0 : _a.element) === element && ((_b = this.state.activeEmbeddable) === null || _b === void 0 ? void 0 : _b.state) === \"active\") {\n return;\n } // The delay serves two purposes\n // 1. To prevent first click propagating to iframe on mobile,\n // else the click will immediately start and stop the video\n // 2. If the user double clicks the frame center to activate it\n // without the delay youtube will immediately open the video\n // in fullscreen mode\n\n\n setTimeout(() => {\n this.setState({\n activeEmbeddable: {\n element,\n state: \"active\"\n },\n selectedElementIds: {\n [element.id]: true\n },\n draggingElement: null,\n selectionElement: null\n });\n }, 100);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeElement)(element)) {\n return;\n }\n\n const iframe = this.getHTMLIFrameElement(element);\n\n if (!(iframe === null || iframe === void 0 ? void 0 : iframe.contentWindow)) {\n return;\n }\n\n if (iframe.src.includes(\"youtube\")) {\n const state = YOUTUBE_VIDEO_STATES.get(element.id);\n\n if (!state) {\n YOUTUBE_VIDEO_STATES.set(element.id, _constants__WEBPACK_IMPORTED_MODULE_12__.YOUTUBE_STATES.UNSTARTED);\n iframe.contentWindow.postMessage(JSON.stringify({\n event: \"listening\",\n id: element.id\n }), \"*\");\n }\n\n switch (state) {\n case _constants__WEBPACK_IMPORTED_MODULE_12__.YOUTUBE_STATES.PLAYING:\n case _constants__WEBPACK_IMPORTED_MODULE_12__.YOUTUBE_STATES.BUFFERING:\n (_c = iframe.contentWindow) === null || _c === void 0 ? void 0 : _c.postMessage(JSON.stringify({\n event: \"command\",\n func: \"pauseVideo\",\n args: \"\"\n }), \"*\");\n break;\n\n default:\n (_d = iframe.contentWindow) === null || _d === void 0 ? void 0 : _d.postMessage(JSON.stringify({\n event: \"command\",\n func: \"playVideo\",\n args: \"\"\n }), \"*\");\n }\n }\n\n if (iframe.src.includes(\"player.vimeo.com\")) {\n iframe.contentWindow.postMessage(JSON.stringify({\n method: \"paused\" //video play/pause in onWindowMessage handler\n\n }), \"*\");\n }\n }\n\n isIframeLikeElementCenter(el, event, sceneX, sceneY) {\n var _a, _b;\n\n return el && !event.altKey && !event.shiftKey && !event.metaKey && !event.ctrlKey && (((_a = this.state.activeEmbeddable) === null || _a === void 0 ? void 0 : _a.element) !== el || ((_b = this.state.activeEmbeddable) === null || _b === void 0 ? void 0 : _b.state) === \"hover\" || !this.state.activeEmbeddable) && sceneX >= el.x + el.width / 3 && sceneX <= el.x + 2 * el.width / 3 && sceneY >= el.y + el.height / 3 && sceneY <= el.y + 2 * el.height / 3;\n }\n\n renderEmbeddables() {\n const scale = this.state.zoom.value;\n const normalizedWidth = this.state.width;\n const normalizedHeight = this.state.height;\n const embeddableElements = this.scene.getNonDeletedElements().filter(el => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(el) && this.embedsValidationStatus.get(el.id) === true || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeElement)(el));\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {\n children: embeddableElements.map(el => {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;\n\n const {\n x,\n y\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.sceneCoordsToViewportCoords)({\n sceneX: el.x,\n sceneY: el.y\n }, this.state);\n const isVisible = (0,_element_sizeHelpers__WEBPACK_IMPORTED_MODULE_27__.isElementInViewport)(el, normalizedWidth, normalizedHeight, this.state, this.scene.getNonDeletedElementsMap());\n const hasBeenInitialized = this.initializedEmbeds.has(el.id);\n\n if (isVisible && !hasBeenInitialized) {\n this.initializedEmbeds.add(el.id);\n }\n\n const shouldRender = isVisible || hasBeenInitialized;\n\n if (!shouldRender) {\n return null;\n }\n\n let src;\n const embedLink = (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.getEmbedLink)((0,_data_url__WEBPACK_IMPORTED_MODULE_47__.toValidURL)(el.link || \"\")); //zsviczian\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeElement)(el)) {\n src = null;\n const data = ((_b = (_a = el.customData) === null || _a === void 0 ? void 0 : _a.generationData) !== null && _b !== void 0 ? _b : this.magicGenerations.get(el.id)) || {\n status: \"error\",\n message: \"No generation data\",\n code: \"ERR_NO_GENERATION_DATA\"\n };\n\n if (data.status === \"done\") {\n const html = data.html;\n src = {\n intrinsicSize: {\n w: el.width,\n h: el.height\n },\n type: \"document\",\n srcdoc: () => {\n return html;\n }\n };\n } else if (data.status === \"pending\") {\n src = {\n intrinsicSize: {\n w: el.width,\n h: el.height\n },\n type: \"document\",\n srcdoc: () => {\n return (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.createSrcDoc)(`\n <style>\n html, body {\n width: 100%;\n height: 100%;\n color: ${this.state.theme === _constants__WEBPACK_IMPORTED_MODULE_12__.THEME.DARK ? \"white\" : \"black\"};\n }\n body {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n gap: 1rem;\n }\n\n .Spinner {\n display: flex;\n align-items: center;\n justify-content: center;\n margin-left: auto;\n margin-right: auto;\n }\n\n .Spinner svg {\n animation: rotate 1.6s linear infinite;\n transform-origin: center center;\n width: 40px;\n height: 40px;\n }\n\n .Spinner circle {\n stroke: currentColor;\n animation: dash 1.6s linear 0s infinite;\n stroke-linecap: round;\n }\n\n @keyframes rotate {\n 100% {\n transform: rotate(360deg);\n }\n }\n\n @keyframes dash {\n 0% {\n stroke-dasharray: 1, 300;\n stroke-dashoffset: 0;\n }\n 50% {\n stroke-dasharray: 150, 300;\n stroke-dashoffset: -200;\n }\n 100% {\n stroke-dasharray: 1, 300;\n stroke-dashoffset: -280;\n }\n }\n </style>\n <div class=\"Spinner\">\n <svg\n viewBox=\"0 0 100 100\"\n >\n <circle\n cx=\"50\"\n cy=\"50\"\n r=\"46\"\n stroke-width=\"8\"\n fill=\"none\"\n stroke-miter-limit=\"10\"\n />\n </svg>\n </div>\n <div>Generating...</div>\n `);\n }\n };\n } else {\n let message;\n\n if (data.code === \"ERR_GENERATION_INTERRUPTED\") {\n message = \"Generation was interrupted...\";\n } else {\n message = data.message || \"Generation failed\";\n }\n\n src = {\n intrinsicSize: {\n w: el.width,\n h: el.height\n },\n type: \"document\",\n srcdoc: () => {\n return (0,_element_embeddable__WEBPACK_IMPORTED_MODULE_36__.createSrcDoc)(`\n <style>\n html, body {\n height: 100%;\n }\n body {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n color: ${_colors__WEBPACK_IMPORTED_MODULE_74__.COLOR_PALETTE.red[3]};\n }\n h1, h3 {\n margin-top: 0;\n margin-bottom: 0.5rem;\n }\n </style>\n <h1>Error!</h1>\n <h3>${message}</h3>\n `);\n }\n };\n }\n } else {\n src = embedLink; //zsviczian getEmbedLink(toValidURL(el.link || \"\"));\n }\n\n const isActive = ((_c = this.state.activeEmbeddable) === null || _c === void 0 ? void 0 : _c.element) === el && ((_d = this.state.activeEmbeddable) === null || _d === void 0 ? void 0 : _d.state) === \"active\";\n const isHovered = ((_e = this.state.activeEmbeddable) === null || _e === void 0 ? void 0 : _e.element) === el && ((_f = this.state.activeEmbeddable) === null || _f === void 0 ? void 0 : _f.state) === \"hover\";\n const isWebview = //zsviczian\n !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeElement)(el) && this.props.renderWebview && (embedLink === null || embedLink === void 0 ? void 0 : embedLink.type) !== \"document\" && !((_h = (_g = embedLink === null || embedLink === void 0 ? void 0 : embedLink.link) === null || _g === void 0 ? void 0 : _g.startsWith) === null || _h === void 0 ? void 0 : _h.call(_g, \"https://player.vimeo.com\")); // Modify the scale based on el.scale property\n\n const [xScale, yScale] = (_j = el.scale) !== null && _j !== void 0 ? _j : [1, 1]; //zsviczian\n\n const scaledTransform = `scale(${scale * xScale}, ${scale * yScale})`;\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: (0,clsx__WEBPACK_IMPORTED_MODULE_4__[\"default\"])(\"excalidraw__embeddable-container\", {\n \"is-hovered\": isHovered\n }),\n style: {\n transform: isVisible ? `translate(${x - this.state.offsetLeft}px, ${y - this.state.offsetTop}px) ${scaledTransform}` : \"none\",\n display: isVisible ? \"block\" : \"none\",\n opacity: (0,_renderer_renderElement__WEBPACK_IMPORTED_MODULE_85__.getRenderOpacity)(el, (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getContainingFrame)(el, this.scene.getNonDeletedElementsMap()), this.elementsPendingErasure),\n [\"--embeddable-radius\"]: `${(0,_math__WEBPACK_IMPORTED_MODULE_28__.getCornerRadius)(Math.min(el.width, el.height), el) / xScale //zsviczian\n }px`\n }\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n //this is a hack that addresses isse with embedded excalidraw.com embeddable\n //https://github.com/excalidraw/excalidraw/pull/6691#issuecomment-1607383938\n\n /*ref={(ref) => {\r\n if (!this.excalidrawContainerRef.current) {\r\n return;\r\n }\r\n const container = this.excalidrawContainerRef.current;\r\n const sh = container.scrollHeight;\r\n const ch = container.clientHeight;\r\n if (sh !== ch) {\r\n container.style.height = `${sh}px`;\r\n setTimeout(() => {\r\n container.style.height = `100%`;\r\n });\r\n }\r\n }}*/\n className: \"excalidraw__embeddable-container__inner\",\n style: {\n width: isVisible ? `${el.width / xScale}px` : 0,\n height: isVisible ? `${el.height / yScale}px` : 0,\n transform: isVisible ? `rotate(${el.angle}rad)` : \"none\",\n pointerEvents: isActive ? _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_EVENTS.enabled : _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_EVENTS.disabled\n }\n }, {\n children: [isHovered && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: \"excalidraw__embeddable-hint\"\n }, {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"buttons.embeddableInteractionButton\")\n })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: \"excalidraw__embeddable__outer\",\n style: {\n padding: `${el.strokeWidth / (4 * el.scale[0])}px` //zsviczian MDEmbeddable round border cutoff issue\n\n }\n }, {\n children: (_m = (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(el) ? (_l = (_k = this.props).renderEmbeddable) === null || _l === void 0 ? void 0 : _l.call(_k, el, this.state) //zsviczian\n : null) !== null && _m !== void 0 ? _m : isWebview ? //zsviczian\n (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"webview\", {\n ref: ref => this.cacheEmbeddableRef(el, ref),\n className: \"excalidraw__embeddable\",\n src: (embedLink === null || embedLink === void 0 ? void 0 : embedLink.type) === \"generic\" || (embedLink === null || embedLink === void 0 ? void 0 : embedLink.type) === \"video\" ? embedLink.link : \"\",\n title: \"Excalidraw Embedded Content\",\n allowFullScreen: true\n }) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"iframe\", {\n ref: ref => this.cacheEmbeddableRef(el, ref),\n className: \"excalidraw__embeddable\",\n srcDoc: (src === null || src === void 0 ? void 0 : src.type) === \"document\" ? src.srcdoc(this.state.theme) : undefined,\n src: (src === null || src === void 0 ? void 0 : src.type) !== \"document\" ? (_o = src === null || src === void 0 ? void 0 : src.link) !== null && _o !== void 0 ? _o : \"\" : undefined,\n // https://stackoverflow.com/q/18470015\n scrolling: \"no\",\n referrerPolicy: \"no-referrer-when-downgrade\",\n title: \"Excalidraw Embedded Content\",\n allow: \"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\",\n allowFullScreen: true,\n sandbox: `${((_p = src === null || src === void 0 ? void 0 : src.sandbox) === null || _p === void 0 ? void 0 : _p.allowSameOrigin) ? \"allow-same-origin\" : \"\"} allow-scripts allow-forms allow-popups allow-popups-to-escape-sandbox allow-presentation allow-downloads`\n })\n }))]\n }))\n }), el.id);\n })\n });\n }\n\n toggleOverscrollBehavior(event) {\n // when pointer inside editor, disable overscroll behavior to prevent\n // panning to trigger history back/forward on MacOS Chrome\n document.documentElement.style.overscrollBehaviorX = event.type === \"pointerenter\" ? \"none\" : \"auto\";\n }\n\n render() {\n var _a, _b, _c, _d, _e, _f, _g, _h;\n\n const selectedElements = this.scene.getSelectedElements(this.state);\n const {\n renderTopRightUI,\n renderCustomStats\n } = this.props;\n const sceneNonce = this.scene.getSceneNonce();\n const {\n elementsMap,\n visibleElements\n } = this.renderer.getRenderableElements({\n sceneNonce,\n zoom: this.state.zoom,\n offsetLeft: this.state.offsetLeft,\n offsetTop: this.state.offsetTop,\n scrollX: this.state.scrollX,\n scrollY: this.state.scrollY,\n height: this.state.height,\n width: this.state.width,\n editingElement: this.state.editingElement,\n pendingImageElementId: this.state.pendingImageElementId\n });\n const allElementsMap = this.scene.getNonDeletedElementsMap();\n const shouldBlockPointerEvents = !(this.state.editingElement && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(this.state.editingElement)) && (this.state.selectionElement || this.state.draggingElement || this.state.resizingElement || this.state.activeTool.type === \"laser\" && // technically we can just test on this once we make it more safe\n this.state.cursorButton === \"down\" || this.state.editingElement && !(0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(this.state.editingElement));\n const firstSelectedElement = selectedElements[0];\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: (0,clsx__WEBPACK_IMPORTED_MODULE_4__[\"default\"])(\"excalidraw excalidraw-container\", {\n \"excalidraw--view-mode\": this.state.viewModeEnabled,\n \"excalidraw--mobile\": this.device.editor.isMobile || !(this.state.viewModeEnabled || this.state.zenModeEnabled) && this.state.trayModeEnabled //zsviczian\n\n }),\n style: Object.assign({\n //zsviczian\n [\"--ui-pointerEvents\"]: shouldBlockPointerEvents ? _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_EVENTS.disabled : _constants__WEBPACK_IMPORTED_MODULE_12__.POINTER_EVENTS.enabled\n }, this.state.dynamicStyle),\n ref: this.excalidrawContainerRef,\n onDrop: this.handleAppOnDrop,\n tabIndex: 0,\n onKeyDown: this.props.handleKeyboardGlobally ? undefined : this.onKeyDown,\n onPointerEnter: this.toggleOverscrollBehavior,\n onPointerLeave: this.toggleOverscrollBehavior\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(AppContext.Provider, Object.assign({\n value: this\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(AppPropsContext.Provider, Object.assign({\n value: this.props\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(ExcalidrawContainerContext.Provider, Object.assign({\n value: this.excalidrawContainerValue\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(DeviceContext.Provider, Object.assign({\n value: this.device\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(ExcalidrawSetAppStateContext.Provider, Object.assign({\n value: this.setAppState\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(ExcalidrawAppStateContext.Provider, Object.assign({\n value: this.state\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(ExcalidrawElementsContext.Provider, Object.assign({\n value: this.scene.getNonDeletedElements()\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(ExcalidrawActionManagerContext.Provider, Object.assign({\n value: this.actionManager\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_LayerUI__WEBPACK_IMPORTED_MODULE_38__[\"default\"], Object.assign({\n canvas: this.canvas,\n appState: this.state,\n files: this.files,\n setAppState: this.setAppState,\n actionManager: this.actionManager,\n elements: this.scene.getNonDeletedElements(),\n onLockToggle: this.toggleLock,\n onPenModeToggle: this.togglePenMode,\n onHandToolToggle: this.onHandToolToggle,\n langCode: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.getLanguage)().code,\n renderTopRightUI: renderTopRightUI,\n renderCustomStats: renderCustomStats,\n showExitZenModeBtn: typeof ((_a = this.props) === null || _a === void 0 ? void 0 : _a.zenModeEnabled) === \"undefined\" && this.state.zenModeEnabled,\n UIOptions: this.props.UIOptions,\n onExportImage: this.onExportImage,\n renderWelcomeScreen: !this.state.isLoading && this.state.showWelcomeScreen && this.state.activeTool.type === \"selection\" && !this.state.zenModeEnabled && !this.scene.getElementsIncludingDeleted().length,\n app: this,\n isCollaborating: this.props.isCollaborating,\n openAIKey: this.OPENAI_KEY,\n isOpenAIKeyPersisted: this.OPENAI_KEY_IS_PERSISTED,\n onOpenAIAPIKeyChange: this.onOpenAIKeyChange,\n onMagicSettingsConfirm: this.onMagicSettingsConfirm\n }, {\n children: this.props.children\n })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", {\n className: \"excalidraw-textEditorContainer\"\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", {\n className: \"excalidraw-contextMenuContainer\"\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", {\n className: \"excalidraw-eye-dropper-container\"\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_SVGLayer__WEBPACK_IMPORTED_MODULE_68__.SVGLayer, {\n trails: [this.laserTrails, this.eraserTrail]\n }), selectedElements.length === 1 && this.state.showHyperlinkPopup && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_hyperlink_Hyperlink__WEBPACK_IMPORTED_MODULE_46__.Hyperlink, {\n element: firstSelectedElement,\n elementsMap: allElementsMap,\n setAppState: this.setAppState,\n onLinkOpen: this.props.onLinkOpen,\n setToast: this.setToast,\n updateEmbedValidationStatus: this.updateEmbedValidationStatus\n }, firstSelectedElement.id), this.props.aiEnabled !== false && selectedElements.length === 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isMagicFrameElement)(firstSelectedElement) && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_element_ElementCanvasButtons__WEBPACK_IMPORTED_MODULE_71__.ElementCanvasButtons, Object.assign({\n element: firstSelectedElement,\n elementsMap: elementsMap\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MagicButton__WEBPACK_IMPORTED_MODULE_75__.ElementCanvasButton, {\n title: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"labels.convertToCode\"),\n icon: _icons__WEBPACK_IMPORTED_MODULE_76__.MagicIcon,\n checked: false,\n onChange: () => this.onMagicFrameGenerate(firstSelectedElement, \"button\")\n })\n })), selectedElements.length === 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeElement)(firstSelectedElement) && ((_c = (_b = firstSelectedElement.customData) === null || _b === void 0 ? void 0 : _b.generationData) === null || _c === void 0 ? void 0 : _c.status) === \"done\" && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_element_ElementCanvasButtons__WEBPACK_IMPORTED_MODULE_71__.ElementCanvasButtons, Object.assign({\n element: firstSelectedElement,\n elementsMap: elementsMap\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MagicButton__WEBPACK_IMPORTED_MODULE_75__.ElementCanvasButton, {\n title: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"labels.copySource\"),\n icon: _icons__WEBPACK_IMPORTED_MODULE_76__.copyIcon,\n checked: false,\n onChange: () => this.onIframeSrcCopy(firstSelectedElement)\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MagicButton__WEBPACK_IMPORTED_MODULE_75__.ElementCanvasButton, {\n title: \"Enter fullscreen\",\n icon: _icons__WEBPACK_IMPORTED_MODULE_76__.fullscreenIcon,\n checked: false,\n onChange: () => {\n const iframe = this.getHTMLIFrameElement(firstSelectedElement);\n\n if (iframe) {\n try {\n iframe.requestFullscreen();\n this.setState({\n activeEmbeddable: {\n element: firstSelectedElement,\n state: \"active\"\n },\n selectedElementIds: {\n [firstSelectedElement.id]: true\n },\n draggingElement: null,\n selectionElement: null\n });\n } catch (err) {\n console.warn(err);\n this.setState({\n errorMessage: \"Couldn't enter fullscreen\"\n });\n }\n }\n }\n })]\n })), this.state.toast !== null && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Toast__WEBPACK_IMPORTED_MODULE_39__.Toast, {\n message: this.state.toast.message,\n onClose: () => this.setToast(null),\n duration: this.state.toast.duration,\n closable: this.state.toast.closable\n }), this.state.contextMenu && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_ContextMenu__WEBPACK_IMPORTED_MODULE_37__.ContextMenu, {\n items: this.state.contextMenu.items,\n top: this.state.contextMenu.top,\n left: this.state.contextMenu.left,\n actionManager: this.actionManager,\n onClose: callback => {\n this.setState({\n contextMenu: null\n }, () => {\n this.focusContainer();\n callback === null || callback === void 0 ? void 0 : callback();\n });\n }\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_canvases__WEBPACK_IMPORTED_MODULE_65__.StaticCanvas, {\n canvas: this.canvas,\n rc: this.rc,\n elementsMap: elementsMap,\n allElementsMap: allElementsMap,\n visibleElements: visibleElements,\n sceneNonce: sceneNonce,\n selectionNonce: (_d = this.state.selectionElement) === null || _d === void 0 ? void 0 : _d.versionNonce,\n scale: window.devicePixelRatio,\n appState: this.state,\n renderConfig: {\n imageCache: this.imageCache,\n isExporting: false,\n renderGrid: true,\n canvasBackgroundColor: this.state.viewBackgroundColor,\n embedsValidationStatus: this.embedsValidationStatus,\n elementsPendingErasure: this.elementsPendingErasure\n }\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_canvases__WEBPACK_IMPORTED_MODULE_65__.InteractiveCanvas, {\n containerRef: this.excalidrawContainerRef,\n canvas: this.interactiveCanvas,\n elementsMap: elementsMap,\n visibleElements: visibleElements,\n allElementsMap: allElementsMap,\n selectedElements: selectedElements,\n sceneNonce: sceneNonce,\n selectionNonce: (_e = this.state.selectionElement) === null || _e === void 0 ? void 0 : _e.versionNonce,\n scale: window.devicePixelRatio,\n appState: this.state,\n device: this.device,\n renderInteractiveSceneCallback: this.renderInteractiveSceneCallback,\n handleCanvasRef: this.handleInteractiveCanvasRef,\n onContextMenu: this.handleCanvasContextMenu,\n onPointerMove: this.handleCanvasPointerMove,\n onPointerUp: this.handleCanvasPointerUp,\n onPointerCancel: this.removePointer,\n onTouchMove: this.handleTouchMove,\n onPointerDown: this.handleCanvasPointerDown,\n onDoubleClick: this.handleCanvasDoubleClick\n }), this.state.userToFollow && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_FollowMode_FollowMode__WEBPACK_IMPORTED_MODULE_78__[\"default\"], {\n width: this.state.width,\n height: this.state.height,\n userToFollow: this.state.userToFollow,\n onDisconnect: this.maybeUnfollowRemoteUser\n }), this.renderFrameNames(), ((_f = this.state.activeEmbeddable) === null || _f === void 0 ? void 0 : _f.state) === \"active\" && ( //zsviczian\n (_h = (_g = this.props).renderEmbeddableMenu) === null || _h === void 0 ? void 0 : _h.call(_g, this.state))]\n })), this.renderEmbeddables()]\n }))\n }))\n }))\n }))\n }))\n }))\n }))\n }));\n }\n\n getTextFromElements(elements) {\n const text = elements.reduce((acc, element) => {\n if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(element)) {\n acc.push(element.text);\n }\n\n return acc;\n }, []).join(\"\\n\\n\");\n return text;\n }\n\n async onMagicFrameGenerate(magicFrame, source) {\n var _a;\n\n if (!this.OPENAI_KEY) {\n this.setToast({\n message: \"You must first configure your OpenAI API key in plugin settings\",\n duration: 5000\n });\n return;\n this.setState({\n openDialog: {\n name: \"settings\",\n tab: \"diagram-to-code\",\n source: \"generation\"\n }\n });\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"ai\", \"generate (missing key)\", \"d2c\");\n return;\n }\n\n const magicFrameChildren = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getElementsOverlappingFrame)(this.scene.getNonDeletedElements(), magicFrame).filter(el => !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isMagicFrameElement)(el));\n\n if (!magicFrameChildren.length) {\n if (source === \"button\") {\n this.setState({\n errorMessage: \"Cannot generate from an empty frame\"\n });\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"ai\", \"generate (no-children)\", \"d2c\");\n } else {\n this.setActiveTool({\n type: \"magicframe\"\n });\n }\n\n return;\n }\n\n const frameElement = this.insertIframeElement({\n sceneX: magicFrame.x + magicFrame.width + 30,\n sceneY: magicFrame.y,\n width: magicFrame.width,\n height: magicFrame.height\n });\n\n if (!frameElement) {\n return;\n }\n\n this.updateMagicGeneration({\n frameElement,\n data: {\n status: \"pending\"\n }\n });\n this.setState({\n selectedElementIds: {\n [frameElement.id]: true\n }\n });\n const blob = await (0,_utils_export__WEBPACK_IMPORTED_MODULE_73__.exportToBlob)({\n elements: this.scene.getNonDeletedElements(),\n appState: Object.assign(Object.assign({}, this.state), {\n exportBackground: true,\n viewBackgroundColor: this.state.viewBackgroundColor\n }),\n exportingFrame: magicFrame,\n files: this.files\n });\n const dataURL = await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.getDataURL)(blob);\n const textFromFrameChildren = this.getTextFromElements(magicFrameChildren);\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"ai\", \"generate (start)\", \"d2c\");\n const result = await (0,_data_magic__WEBPACK_IMPORTED_MODULE_72__.diagramToHTML)({\n image: dataURL,\n apiKey: this.OPENAI_KEY,\n text: textFromFrameChildren,\n theme: this.state.theme\n });\n\n if (!result.ok) {\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"ai\", \"generate (failed)\", \"d2c\");\n console.error(result.error);\n this.updateMagicGeneration({\n frameElement,\n data: {\n status: \"error\",\n code: \"ERR_OAI\",\n message: ((_a = result.error) === null || _a === void 0 ? void 0 : _a.message) || \"Unknown error during generation\"\n }\n });\n return;\n }\n\n (0,_analytics__WEBPACK_IMPORTED_MODULE_9__.trackEvent)(\"ai\", \"generate (success)\", \"d2c\");\n\n if (result.choices[0].message.content == null) {\n this.updateMagicGeneration({\n frameElement,\n data: {\n status: \"error\",\n code: \"ERR_OAI\",\n message: \"Nothing genereated :(\"\n }\n });\n return;\n }\n\n const message = result.choices[0].message.content;\n const html = message.slice(message.indexOf(\"<!DOCTYPE html>\"), message.indexOf(\"</html>\") + \"</html>\".length);\n this.updateMagicGeneration({\n frameElement,\n data: {\n status: \"done\",\n html\n }\n });\n }\n\n onIframeSrcCopy(element) {\n var _a, _b;\n\n if (((_b = (_a = element.customData) === null || _a === void 0 ? void 0 : _a.generationData) === null || _b === void 0 ? void 0 : _b.status) === \"done\") {\n (0,_clipboard__WEBPACK_IMPORTED_MODULE_11__.copyTextToSystemClipboard)(element.customData.generationData.html);\n this.setToast({\n message: \"copied to clipboard\",\n closable: false,\n duration: 1500\n });\n }\n } //zsviczian - ugly hack\n\n\n get OPENAI_KEY() {\n return _obsidianUtils__WEBPACK_IMPORTED_MODULE_86__.hostPlugin.settings.openAIAPIToken;\n }\n\n set OPENAI_KEY(value) {\n return;\n }\n\n async componentDidMount() {\n var _a;\n\n this.unmounted = false;\n this.excalidrawContainerValue.container = this.excalidrawContainerRef.current;\n\n if (\"development\" === _constants__WEBPACK_IMPORTED_MODULE_12__.ENV.TEST || \"development\" !== \"production\") {\n const setState = this.setState.bind(this);\n Object.defineProperties(window.h, {\n state: {\n configurable: true,\n get: () => {\n return this.state;\n }\n },\n setState: {\n configurable: true,\n value: (...args) => {\n return this.setState(...args);\n }\n },\n app: {\n configurable: true,\n value: this\n },\n history: {\n configurable: true,\n value: this.history\n },\n store: {\n configurable: true,\n value: this.store\n }\n });\n }\n\n this.store.onStoreIncrementEmitter.on(increment => {\n this.history.record(increment.elementsChange, increment.appStateChange);\n });\n this.scene.onUpdate(this.triggerRender);\n this.addEventListeners();\n\n if (this.props.autoFocus && this.excalidrawContainerRef.current) {\n this.focusContainer();\n }\n\n if ( // bounding rects don't work in tests so updating\n // the state on init would result in making the test enviro run\n // in mobile breakpoint (0 width/height), making everything fail\n !(0,_utils__WEBPACK_IMPORTED_MODULE_35__.isTestEnv)()) {\n this.refreshViewportBreakpoints();\n this.refreshEditorBreakpoints();\n }\n\n if (_constants__WEBPACK_IMPORTED_MODULE_12__.supportsResizeObserver && this.excalidrawContainerRef.current) {\n this.resizeObserver = new ResizeObserver(() => {\n this.refreshEditorBreakpoints();\n this.updateDOMRect();\n });\n (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.observe(this.excalidrawContainerRef.current);\n }\n\n const searchParams = new URLSearchParams(window.location.search.slice(1));\n\n if (searchParams.has(\"web-share-target\")) {\n // Obtain a file that was shared via the Web Share Target API.\n this.restoreFileFromShare();\n } else {\n this.updateDOMRect(this.initializeScene);\n } // note that this check seems to always pass in localhost\n\n\n if ((0,_constants__WEBPACK_IMPORTED_MODULE_12__.isBrave)() && !(0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.isMeasureTextSupported)()) {\n this.setState({\n errorMessage: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_BraveMeasureTextError__WEBPACK_IMPORTED_MODULE_61__[\"default\"], {})\n });\n }\n }\n\n componentWillUnmount() {\n var _a, _b;\n\n (_a = window.launchQueue) === null || _a === void 0 ? void 0 : _a.setConsumer(() => {});\n this.renderer.destroy();\n this.scene.destroy();\n this.scene = new _scene_Scene__WEBPACK_IMPORTED_MODULE_30__[\"default\"]();\n this.fonts = new _scene_Fonts__WEBPACK_IMPORTED_MODULE_50__.Fonts({\n scene: this.scene\n });\n this.renderer = new _scene_Renderer__WEBPACK_IMPORTED_MODULE_66__.Renderer(this.scene);\n this.files = {};\n this.imageCache.clear();\n (_b = this.resizeObserver) === null || _b === void 0 ? void 0 : _b.disconnect();\n this.unmounted = true;\n this.removeEventListeners();\n this.library.destroy();\n this.laserTrails.stop();\n this.eraserTrail.stop();\n this.onChangeEmitter.clear();\n this.store.onStoreIncrementEmitter.clear();\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_67__.ShapeCache.destroy();\n _snapping__WEBPACK_IMPORTED_MODULE_59__.SnapCache.destroy();\n clearTimeout(touchTimeout);\n _scene__WEBPACK_IMPORTED_MODULE_29__.isSomeElementSelected.clearCache();\n _groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements.clearCache();\n touchTimeout = 0;\n document.documentElement.style.overscrollBehaviorX = \"\";\n document.body.removeChild((0,_Tooltip__WEBPACK_IMPORTED_MODULE_97__.getTooltipDiv)()); //clearRenderCache(); //zsviczian\n\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.clearEraserCanvasCache)(); //zsviczian\n\n this.interactiveCanvas = null; //zsviczian\n\n this.iFrameRefs.clear(); //zsviczian\n //@ts-ignore\n\n this.iFrameRefs = null; //zsviczian\n\n this.embedsValidationStatus.clear(); //zsviczian\n //@ts-ignore\n\n this.embedsValidationStatus = null; //zsviczian\n\n this.initializedEmbeds.clear(); //zsviczian\n //@ts-ignore\n\n this.initializedEmbeds = null; //zsviczian\n\n this.elementsPendingErasure.clear(); //zsviczian \n //@ts-ignore\n\n this.elementsPendingErasure = null; //zsviczian \n\n this.lastPointerDownEvent = null; //zsviczian\n\n this.lastPointerUpEvent = null; //zsviczian\n\n this.lastPointerMoveEvent = null; //zsviczian\n //@ts-ignore\n\n this.actionManager.app = null; //zsviczian\n\n this.actionManager.actions = {}; //zsviczian\n\n this.history.clear(); //zsviczian\n\n this.store.clear(); //zsviczian\n //@ts-ignore\n\n this.store = null; //zsviczian\n //@ts-ignore\n\n this.library = null; //zsviczian\n //@ts-ignore\n\n this.canvas = null; //zsviczian\n //@ts-ignore\n\n this.rc = null; //zsviczian\n //@ts-ignore\n\n this.excalidrawContainerRef.current = undefined; //zsviczian\n\n this.nearestScrollableContainer = undefined; //zsviczian\n\n this.excalidrawContainerValue = {\n container: null,\n id: \"unknown\"\n }; //zsviczian\n //@ts-ignore\n // this.laserTrails.terminate(); //zsviczian\n // this.eraserTrail.terminate(); //zsviczian\n\n /*\r\n Object.keys(this).forEach((key) => {\r\n //@ts-ignore\r\n delete this[key];\r\n });*/\n }\n\n removeEventListeners() {\n this.onRemoveEventListenersEmitter.trigger();\n }\n\n addEventListeners() {\n // remove first as we can add event listeners multiple times\n this.removeEventListeners(); // -------------------------------------------------------------------------\n // view+edit mode listeners\n // -------------------------------------------------------------------------\n\n if (this.props.handleKeyboardGlobally) {\n this.onRemoveEventListenersEmitter.once((0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.KEYDOWN, this.onKeyDown, false));\n }\n\n this.onRemoveEventListenersEmitter.once((0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(this.excalidrawContainerRef.current, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.WHEEL, this.onWheel, {\n passive: false\n }), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(window, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.MESSAGE, this.onWindowMessage, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, this.removePointer), // #3553\n (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.COPY, this.onCopy), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.KEYUP, this.onKeyUp, {\n passive: true\n }), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(window, \"focus\", () => this.triggerRender(true), {\n passive: true\n }), //zsviczian\n (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_MOVE, this.updateCurrentCursorPosition), // rerender text elements on font load to fix #637 && #1553\n // zsviczian In Obsidian this is not needed as I manage font load separately\n\n /*addEventListener(document.fonts, \"loadingdone\", (event) => {\r\n const loadedFontFaces = (event as FontFaceSetLoadEvent).fontfaces;\r\n this.fonts.onFontsLoaded(loadedFontFaces);\r\n }),*/\n // Safari-only desktop pinch zoom\n (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.GESTURE_START, this.onGestureStart, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.GESTURE_CHANGE, this.onGestureChange, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.GESTURE_END, this.onGestureEnd, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(window, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.FOCUS, () => {\n this.maybeCleanupAfterMissingPointerUp(null); // browsers (chrome?) tend to free up memory a lot, which results\n // in canvas context being cleared. Thus re-render on focus.\n\n this.triggerRender(true);\n }));\n\n if (this.state.viewModeEnabled) {\n return;\n } // -------------------------------------------------------------------------\n // edit-mode listeners only\n // -------------------------------------------------------------------------\n\n\n this.onRemoveEventListenersEmitter.once((0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.FULLSCREENCHANGE, this.onFullscreenChange), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.PASTE, this.pasteFromClipboard), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(document, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.CUT, this.onCut), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(window, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.RESIZE, this.onResize, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(window, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.UNLOAD, this.onUnload, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(window, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.BLUR, this.onBlur, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(this.excalidrawContainerRef.current, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.DRAG_OVER, this.disableEvent, false), (0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)(this.excalidrawContainerRef.current, _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.DROP, this.disableEvent, false));\n\n if (this.props.detectScroll) {\n this.onRemoveEventListenersEmitter.once((0,_utils__WEBPACK_IMPORTED_MODULE_35__.addEventListener)((0,_utils__WEBPACK_IMPORTED_MODULE_35__.getNearestScrollableContainer)(this.excalidrawContainerRef.current), _constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.SCROLL, this.onScroll));\n }\n }\n\n componentDidUpdate(prevProps, prevState) {\n var _a, _b, _c, _d, _e, _f;\n\n this.updateEmbeddables();\n const elements = this.scene.getElementsIncludingDeleted();\n const elementsMap = this.scene.getElementsMapIncludingDeleted();\n const nonDeletedElementsMap = this.scene.getNonDeletedElementsMap();\n\n if (!this.state.showWelcomeScreen && !elements.length) {\n this.setState({\n showWelcomeScreen: true\n });\n }\n\n if (prevProps.UIOptions.dockedSidebarBreakpoint !== this.props.UIOptions.dockedSidebarBreakpoint) {\n this.refreshEditorBreakpoints();\n }\n\n const hasFollowedPersonLeft = prevState.userToFollow && !this.state.collaborators.has(prevState.userToFollow.socketId);\n\n if (hasFollowedPersonLeft) {\n this.maybeUnfollowRemoteUser();\n }\n\n if (prevState.zoom.value !== this.state.zoom.value || prevState.scrollX !== this.state.scrollX || prevState.scrollY !== this.state.scrollY) {\n (_b = (_a = this.props) === null || _a === void 0 ? void 0 : _a.onScrollChange) === null || _b === void 0 ? void 0 : _b.call(_a, this.state.scrollX, this.state.scrollY, this.state.zoom);\n this.onScrollChangeEmitter.trigger(this.state.scrollX, this.state.scrollY, this.state.zoom);\n }\n\n if (prevState.userToFollow !== this.state.userToFollow) {\n if (prevState.userToFollow) {\n this.onUserFollowEmitter.trigger({\n userToFollow: prevState.userToFollow,\n action: \"UNFOLLOW\"\n });\n }\n\n if (this.state.userToFollow) {\n this.onUserFollowEmitter.trigger({\n userToFollow: this.state.userToFollow,\n action: \"FOLLOW\"\n });\n }\n }\n\n if (Object.keys(this.state.selectedElementIds).length && (0,_appState__WEBPACK_IMPORTED_MODULE_10__.isEraserActive)(this.state)) {\n this.setState({\n activeTool: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, {\n type: \"selection\"\n })\n });\n }\n\n if (this.state.activeTool.type === \"eraser\" && prevState.theme !== this.state.theme) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setEraserCursor)(this.interactiveCanvas, this.state.theme);\n } // Hide hyperlink popup if shown when element type is not selection\n\n\n if (prevState.activeTool.type === \"selection\" && this.state.activeTool.type !== \"selection\" && this.state.showHyperlinkPopup) {\n this.setState({\n showHyperlinkPopup: false\n });\n }\n\n if (prevProps.langCode !== this.props.langCode) {\n this.updateLanguage();\n }\n\n if ((0,_appState__WEBPACK_IMPORTED_MODULE_10__.isEraserActive)(prevState) && !(0,_appState__WEBPACK_IMPORTED_MODULE_10__.isEraserActive)(this.state)) {\n this.eraserTrail.endPath();\n }\n\n if (prevProps.viewModeEnabled !== this.props.viewModeEnabled) {\n this.setState({\n viewModeEnabled: !!this.props.viewModeEnabled\n });\n }\n\n if (prevState.viewModeEnabled !== this.state.viewModeEnabled) {\n this.addEventListeners();\n this.deselectElements();\n }\n\n if (prevProps.zenModeEnabled !== this.props.zenModeEnabled) {\n this.setState({\n zenModeEnabled: !!this.props.zenModeEnabled\n });\n }\n\n if (prevProps.theme !== this.props.theme && this.props.theme) {\n this.setState({\n theme: this.props.theme\n });\n }\n\n if (prevProps.gridModeEnabled !== this.props.gridModeEnabled) {\n this.setState({\n gridSize: this.props.gridModeEnabled ? _constants__WEBPACK_IMPORTED_MODULE_12__.GRID_SIZE : null\n });\n }\n\n (_c = this.excalidrawContainerRef.current) === null || _c === void 0 ? void 0 : _c.classList.toggle(\"theme--dark\", this.state.theme === _constants__WEBPACK_IMPORTED_MODULE_12__.THEME.DARK);\n\n if (this.state.editingLinearElement && !this.state.selectedElementIds[this.state.editingLinearElement.elementId]) {\n // defer so that the storeAction flag isn't reset via current update\n setTimeout(() => {\n // execute only if the condition still holds when the deferred callback\n // executes (it can be scheduled multiple times depending on how\n // many times the component renders)\n this.state.editingLinearElement && this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n });\n } // failsafe in case the state is being updated in incorrect order resulting\n // in the editingElement being now a deleted element\n\n\n if ((_d = this.state.editingElement) === null || _d === void 0 ? void 0 : _d.isDeleted) {\n this.setState({\n editingElement: null\n });\n }\n\n if (this.state.selectedLinearElement && !this.state.selectedElementIds[this.state.selectedLinearElement.elementId]) {\n // To make sure `selectedLinearElement` is in sync with `selectedElementIds`, however this shouldn't be needed once\n // we have a single API to update `selectedElementIds`\n this.setState({\n selectedLinearElement: null\n });\n }\n\n const {\n multiElement\n } = prevState;\n\n if (prevState.activeTool !== this.state.activeTool && multiElement != null && (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.isBindingEnabled)(this.state) && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBindingElement)(multiElement, false)) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.maybeBindLinearElement)(multiElement, this.state, (0,_utils__WEBPACK_IMPORTED_MODULE_35__.tupleToCoors)(_element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.getPointAtIndexGlobalCoordinates(multiElement, -1, nonDeletedElementsMap)), this.scene.getNonDeletedElementsMap());\n }\n\n this.store.commit(elementsMap, this.state); // Do not notify consumers if we're still loading the scene. Among other\n // potential issues, this fixes a case where the tab isn't focused during\n // init, which would trigger onChange with empty elements, which would then\n // override whatever is in localStorage currently.\n\n if (!this.state.isLoading) {\n (_f = (_e = this.props).onChange) === null || _f === void 0 ? void 0 : _f.call(_e, elements, this.state, this.files);\n this.onChangeEmitter.trigger(elements, this.state, this.files);\n }\n }\n\n static resetTapTwice() {\n didTapTwice = false;\n } // TODO rewrite this to paste both text & images at the same time if\n // pasted data contains both\n\n\n async addElementsFromMixedContentPaste(mixedContent, {\n isPlainPaste,\n sceneX,\n sceneY\n }) {\n if (!isPlainPaste && mixedContent.some(node => node.type === \"imageUrl\") && this.isToolSupported(\"image\")) {\n const imageURLs = mixedContent.filter(node => node.type === \"imageUrl\").map(node => node.value);\n const responses = await Promise.all(imageURLs.map(async url => {\n try {\n return {\n file: await (0,_data_blob__WEBPACK_IMPORTED_MODULE_41__.ImageURLToFile)(url)\n };\n } catch (error) {\n let errorMessage = error.message;\n\n if (error.cause === \"FETCH_ERROR\") {\n errorMessage = (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.failedToFetchImage\");\n } else if (error.cause === \"UNSUPPORTED\") {\n errorMessage = (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"errors.unsupportedFileType\");\n }\n\n return {\n errorMessage\n };\n }\n }));\n let y = sceneY;\n let firstImageYOffsetDone = false;\n const nextSelectedIds = {};\n\n for (const response of responses) {\n if (response.file) {\n const imageElement = this.createImageElement({\n sceneX,\n sceneY: y\n });\n const initializedImageElement = await this.insertImageElement(imageElement, response.file);\n\n if (initializedImageElement) {\n // vertically center first image in the batch\n if (!firstImageYOffsetDone) {\n firstImageYOffsetDone = true;\n y -= initializedImageElement.height / 2;\n } // hack to reset the `y` coord because we vertically center during\n // insertImageElement\n\n\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(initializedImageElement, {\n y\n }, false);\n y = imageElement.y + imageElement.height + 25;\n nextSelectedIds[imageElement.id] = true;\n }\n }\n }\n\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(nextSelectedIds, this.state)\n });\n const error = responses.find(response => !!response.errorMessage);\n\n if (error && error.errorMessage) {\n this.setState({\n errorMessage: error.errorMessage\n });\n }\n } else {\n const textNodes = mixedContent.filter(node => node.type === \"text\");\n\n if (textNodes.length) {\n this.addTextFromPaste(textNodes.map(node => node.value).join(\"\\n\\n\"), isPlainPaste);\n }\n }\n }\n\n addTextFromPaste(text, isPlainPaste = false) {\n const {\n x,\n y\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX: this.lastViewportPosition.x,\n clientY: this.lastViewportPosition.y\n }, this.state);\n const textElementProps = {\n x,\n y,\n strokeColor: this.state.currentItemStrokeColor,\n backgroundColor: this.state.currentItemBackgroundColor,\n fillStyle: this.state.currentItemFillStyle,\n strokeWidth: this.state.currentItemStrokeWidth,\n strokeStyle: this.state.currentItemStrokeStyle,\n roundness: null,\n roughness: this.state.currentItemRoughness,\n opacity: this.state.currentItemOpacity,\n text,\n rawText: text,\n fontSize: (0,_actions_actionProperties__WEBPACK_IMPORTED_MODULE_79__.getFontSize)(this.state.currentItemFontSize, this.state.zoom.value),\n fontFamily: this.state.currentItemFontFamily,\n textAlign: _constants__WEBPACK_IMPORTED_MODULE_12__.DEFAULT_TEXT_ALIGN,\n verticalAlign: _constants__WEBPACK_IMPORTED_MODULE_12__.DEFAULT_VERTICAL_ALIGN,\n locked: false\n };\n const fontString = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.getFontString)({\n fontSize: textElementProps.fontSize,\n fontFamily: textElementProps.fontFamily\n });\n const lineHeight = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getDefaultLineHeight)(textElementProps.fontFamily);\n const [x1,, x2] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_95__.getVisibleSceneBounds)(this.state); // long texts should not go beyond 800 pixels in width nor should it go below 200 px\n\n const maxTextWidth = Math.max(Math.min((x2 - x1) * 0.5, 800), 200);\n const LINE_GAP = 10;\n let currentY = y;\n const lines = isPlainPaste ? [text] : text.split(\"\\n\");\n const textElements = lines.reduce((acc, line, idx) => {\n var _a;\n\n const originalText = line.trim();\n\n if (originalText.length) {\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords({\n x,\n y: currentY\n });\n let metrics = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.measureText)(originalText, fontString, lineHeight);\n const isTextWrapped = metrics.width > maxTextWidth;\n const text = isTextWrapped ? (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.wrapText)(originalText, fontString, maxTextWidth) : originalText;\n metrics = isTextWrapped ? (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.measureText)(text, fontString, lineHeight) : metrics;\n const startX = x - metrics.width / 2;\n const startY = currentY - metrics.height / 2;\n const element = (0,_element__WEBPACK_IMPORTED_MODULE_16__.newTextElement)(Object.assign(Object.assign({}, textElementProps), {\n x: startX,\n y: startY,\n text,\n rawText: originalText,\n //zsviczian\n originalText,\n lineHeight,\n autoResize: !isTextWrapped,\n frameId: topLayerFrame ? topLayerFrame.id : null\n }));\n acc.push(element);\n currentY += element.height + LINE_GAP;\n } else {\n const prevLine = (_a = lines[idx - 1]) === null || _a === void 0 ? void 0 : _a.trim(); // add paragraph only if previous line was not empty, IOW don't add\n // more than one empty line\n\n if (prevLine) {\n currentY += (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getLineHeightInPx)(textElementProps.fontSize, lineHeight) + LINE_GAP;\n }\n }\n\n return acc;\n }, []);\n\n if (textElements.length === 0) {\n return;\n }\n\n this.scene.insertElements(textElements);\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(Object.fromEntries(textElements.map(el => [el.id, true])), this.state)\n });\n\n if (!isPlainPaste && textElements.length > 1 && PLAIN_PASTE_TOAST_SHOWN === false && !this.device.editor.isMobile) {\n this.setToast({\n message: (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.t)(\"toast.pasteAsSingleElement\", {\n shortcut: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.getShortcutKey)(\"CtrlOrCmd+Shift+V\")\n }),\n duration: 5000\n });\n PLAIN_PASTE_TOAST_SHOWN = true;\n }\n\n this.store.shouldCaptureIncrement();\n }\n\n handleTextWysiwyg(element, {\n isExistingElement = false\n }) {\n const elementsMap = this.scene.getElementsMapIncludingDeleted();\n\n const updateElement = (nextOriginalText, isDeleted, rawText, //zsviczian\n link) => {\n this.scene.replaceAllElements([// Not sure why we include deleted elements as well hence using deleted elements map\n ...this.scene.getElementsIncludingDeleted().map(_element => {\n if (_element.id === element.id && (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(_element)) {\n return (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.newElementWith)(_element, Object.assign({\n originalText: nextOriginalText,\n rawText: rawText !== null && rawText !== void 0 ? rawText : nextOriginalText,\n //zsviczian\n link,\n isDeleted: isDeleted !== null && isDeleted !== void 0 ? isDeleted : _element.isDeleted\n }, (0,_element__WEBPACK_IMPORTED_MODULE_16__.refreshTextDimensions)(_element, (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getContainerElement)(_element, elementsMap), elementsMap, nextOriginalText)));\n }\n\n return _element;\n })]);\n }; //zsviczian\n\n\n if (isExistingElement && this.props.onBeforeTextEdit) {\n const text = this.props.onBeforeTextEdit(element);\n\n if (text && text !== element.originalText) {\n this.scene.replaceAllElements([...this.scene.getElementsIncludingDeleted().map(_element => {\n if (_element.id === element.id && (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(_element)) {\n //changing the value of element so this gets edited by textWysiwyg\n element = (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.newElementWith)(_element, Object.assign({\n originalText: text,\n rawText: text,\n isDeleted: false\n }, (0,_element__WEBPACK_IMPORTED_MODULE_16__.refreshTextDimensions)(_element, (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getContainerElement)(_element, elementsMap), elementsMap, text)));\n return element;\n }\n\n return _element;\n })]);\n }\n }\n\n (0,_element_textWysiwyg__WEBPACK_IMPORTED_MODULE_88__.textWysiwyg)({\n id: element.id,\n canvas: this.canvas,\n getViewportCoords: (x, y) => {\n const {\n x: viewportX,\n y: viewportY\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.sceneCoordsToViewportCoords)({\n sceneX: x,\n sceneY: y\n }, this.state);\n return [viewportX - this.state.offsetLeft, viewportY - this.state.offsetTop];\n },\n onChange: (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(nextOriginalText => {\n updateElement(nextOriginalText, false);\n\n if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.isNonDeletedElement)(element)) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.updateBoundElements)(element, elementsMap);\n }\n }),\n onSubmit: (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(({\n viaKeyboard,\n nextOriginalText\n }) => {\n var _a;\n\n const isDeleted = !nextOriginalText.trim(); //zsviczian insert start\n\n const rawText = nextOriginalText; //should this be originalText??\n\n let link = undefined;\n\n if (this.props.onBeforeTextSubmit) {\n const _element = this.scene.getElementsIncludingDeleted().find(el => el.id === element.id && (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(el));\n\n if (_element) {\n const dismensionsData = (0,_element__WEBPACK_IMPORTED_MODULE_16__.refreshTextDimensions)(_element, (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getContainerElement)(_element, elementsMap), elementsMap, nextOriginalText);\n const {\n updatedNextOriginalText,\n nextLink\n } = this.props.onBeforeTextSubmit(element, (_a = dismensionsData === null || dismensionsData === void 0 ? void 0 : dismensionsData.text) !== null && _a !== void 0 ? _a : nextOriginalText, //should never be undefined\n nextOriginalText, isDeleted);\n nextOriginalText = updatedNextOriginalText !== null && updatedNextOriginalText !== void 0 ? updatedNextOriginalText : nextOriginalText;\n link = nextLink;\n }\n } //zsviczian insert end\n\n\n updateElement(nextOriginalText, isDeleted, rawText, link); //zsviczian (added rawText, link, text)\n // select the created text element only if submitting via keyboard\n // (when submitting via click it should act as signal to deselect)\n\n if (!isDeleted && viaKeyboard) {\n const elementIdToSelect = element.containerId ? element.containerId : element.id;\n this.setState(prevState => ({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(Object.assign(Object.assign({}, prevState.selectedElementIds), {\n [elementIdToSelect]: true\n }), prevState)\n }));\n }\n\n if (isDeleted) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.fixBindingsAfterDeletion)(this.scene.getNonDeletedElements(), [element]);\n }\n\n if (!isDeleted || isExistingElement) {\n this.store.shouldCaptureIncrement();\n }\n\n this.setState({\n draggingElement: null,\n editingElement: null\n });\n\n if (this.state.activeTool.locked) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n }\n\n this.focusContainer();\n }),\n element,\n excalidrawContainer: this.excalidrawContainerRef.current,\n app: this,\n // when text is selected, it's hard (at least on iOS) to re-position the\n // caret (i.e. deselect). There's not much use for always selecting\n // the text on edit anyway (and users can select-all from contextmenu\n // if needed)\n autoSelect: !this.device.isTouchScreen\n }); // deselect all other elements when inserting text\n\n this.deselectElements(); // do an initial update to re-initialize element position since we were\n // modifying element's x/y for sake of editor (case: syncing to remote)\n\n updateElement(element.originalText, false);\n }\n\n deselectElements() {\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n selectedGroupIds: {},\n editingGroupId: null,\n activeEmbeddable: null\n });\n }\n\n getTextElementAtPosition(x, y) {\n const element = this.getElementAtPosition(x, y, {\n includeBoundTextElement: true\n });\n\n if (element && (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(element) && !element.isDeleted) {\n return element;\n }\n\n return null;\n }\n\n getBoundTextShape(element) {\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getBoundTextElement)(element, this.scene.getNonDeletedElementsMap());\n\n if (boundTextElement) {\n if (element.type === \"arrow\") {\n return (0,_shapes__WEBPACK_IMPORTED_MODULE_32__.getElementShape)(Object.assign(Object.assign({}, boundTextElement), _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.getBoundTextElementPosition(element, boundTextElement, this.scene.getNonDeletedElementsMap())), this.scene.getNonDeletedElementsMap());\n }\n\n return (0,_shapes__WEBPACK_IMPORTED_MODULE_32__.getElementShape)(boundTextElement, this.scene.getNonDeletedElementsMap());\n }\n\n return null;\n }\n\n getElementAtPosition(x, y, opts) {\n const allHitElements = this.getElementsAtPosition(x, y, opts === null || opts === void 0 ? void 0 : opts.includeBoundTextElement, opts === null || opts === void 0 ? void 0 : opts.includeLockedElements);\n\n if (allHitElements.length > 1) {\n if (opts === null || opts === void 0 ? void 0 : opts.preferSelected) {\n for (let index = allHitElements.length - 1; index > -1; index--) {\n if (this.state.selectedElementIds[allHitElements[index].id]) {\n return allHitElements[index];\n }\n }\n }\n\n const elementWithHighestZIndex = allHitElements[allHitElements.length - 1]; // If we're hitting element with highest z-index only on its bounding box\n // while also hitting other element figure, the latter should be considered.\n\n return (0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.hitElementItself)({\n x,\n y,\n element: elementWithHighestZIndex,\n shape: (0,_shapes__WEBPACK_IMPORTED_MODULE_32__.getElementShape)(elementWithHighestZIndex, this.scene.getNonDeletedElementsMap()),\n // when overlapping, we would like to be more precise\n // this also avoids the need to update past tests\n threshold: this.getElementHitThreshold() / 2,\n frameNameBound: (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(elementWithHighestZIndex) ? this.frameNameBoundsCache.get(elementWithHighestZIndex) : null\n }) ? elementWithHighestZIndex : allHitElements[allHitElements.length - 2];\n }\n\n if (allHitElements.length === 1) {\n return allHitElements[0];\n }\n\n return null;\n }\n\n getElementsAtPosition(x, y, includeBoundTextElement = false, includeLockedElements = false) {\n const iframeLikes = [];\n const elementsMap = this.scene.getNonDeletedElementsMap();\n const elements = (includeBoundTextElement && includeLockedElements ? this.scene.getNonDeletedElements() : this.scene.getNonDeletedElements().filter(element => (includeLockedElements || !element.locked) && (includeBoundTextElement || !((0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(element) && element.containerId)))).filter(el => this.hitElement(x, y, el)).filter(element => {\n // hitting a frame's element from outside the frame is not considered a hit\n const containingFrame = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getContainingFrame)(element, elementsMap);\n return containingFrame && this.state.frameRendering.enabled && this.state.frameRendering.clip ? (0,_frame__WEBPACK_IMPORTED_MODULE_51__.isCursorInFrame)({\n x,\n y\n }, containingFrame, elementsMap) : true;\n }).filter(el => {\n // The parameter elements comes ordered from lower z-index to higher.\n // We want to preserve that order on the returned array.\n // Exception being embeddables which should be on top of everything else in\n // terms of hit testing.\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeElement)(el)) {\n iframeLikes.push(el);\n return false;\n }\n\n return true;\n }).concat(iframeLikes);\n return elements;\n }\n\n getElementHitThreshold() {\n return _constants__WEBPACK_IMPORTED_MODULE_12__.DEFAULT_COLLISION_THRESHOLD / this.state.zoom.value;\n }\n\n hitElement(x, y, element, considerBoundingBox = true) {\n // if the element is selected, then hit test is done against its bounding box\n if (considerBoundingBox && this.state.selectedElementIds[element.id] && (0,_element_transformHandles__WEBPACK_IMPORTED_MODULE_48__.shouldShowBoundingBox)([element], this.state)) {\n const selectionShape = (0,_utils_geometry_shape__WEBPACK_IMPORTED_MODULE_33__.getSelectionBoxShape)(element, this.scene.getNonDeletedElementsMap(), this.getElementHitThreshold());\n return (0,_utils_collision__WEBPACK_IMPORTED_MODULE_34__.isPointInShape)([x, y], selectionShape);\n } // take bound text element into consideration for hit collision as well\n\n\n const hitBoundTextOfElement = (0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.hitElementBoundText)(x, y, this.getBoundTextShape(element));\n\n if (hitBoundTextOfElement) {\n return true;\n }\n\n return (0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.hitElementItself)({\n x,\n y,\n element,\n shape: (0,_shapes__WEBPACK_IMPORTED_MODULE_32__.getElementShape)(element, this.scene.getNonDeletedElementsMap()),\n threshold: this.getElementHitThreshold(),\n frameNameBound: (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(element) ? this.frameNameBoundsCache.get(element) : null\n });\n }\n\n getTextBindableContainerAtPosition(x, y) {\n const elements = this.scene.getNonDeletedElements();\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (selectedElements.length === 1) {\n return (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isTextBindableContainer)(selectedElements[0], false) ? selectedElements[0] : null;\n }\n\n let hitElement = null; // We need to do hit testing from front (end of the array) to back (beginning of the array)\n\n for (let index = elements.length - 1; index >= 0; --index) {\n if (elements[index].isDeleted) {\n continue;\n }\n\n const [x1, y1, x2, y2] = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getElementAbsoluteCoords)(elements[index], this.scene.getNonDeletedElementsMap());\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isArrowElement)(elements[index]) && (0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.hitElementItself)({\n x,\n y,\n element: elements[index],\n shape: (0,_shapes__WEBPACK_IMPORTED_MODULE_32__.getElementShape)(elements[index], this.scene.getNonDeletedElementsMap()),\n threshold: this.getElementHitThreshold()\n })) {\n hitElement = elements[index];\n break;\n } else if (x1 < x && x < x2 && y1 < y && y < y2) {\n hitElement = elements[index];\n break;\n }\n }\n\n return (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isTextBindableContainer)(hitElement, false) ? hitElement : null;\n }\n\n handleHoverSelectedLinearElement(linearElementEditor, scenePointerX, scenePointerY) {\n const elementsMap = this.scene.getNonDeletedElementsMap();\n const element = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.getElement(linearElementEditor.elementId, elementsMap);\n\n if (!element) {\n return;\n }\n\n if (this.state.selectedLinearElement) {\n let hoverPointIndex = -1;\n let segmentMidPointHoveredCoords = null;\n\n if ((0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.hitElementItself)({\n x: scenePointerX,\n y: scenePointerY,\n element,\n shape: (0,_shapes__WEBPACK_IMPORTED_MODULE_32__.getElementShape)(element, this.scene.getNonDeletedElementsMap())\n })) {\n hoverPointIndex = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.getPointIndexUnderCursor(element, elementsMap, this.state.zoom, scenePointerX, scenePointerY);\n segmentMidPointHoveredCoords = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.getSegmentMidpointHitCoords(linearElementEditor, {\n x: scenePointerX,\n y: scenePointerY\n }, this.state, this.scene.getNonDeletedElementsMap());\n\n if (hoverPointIndex >= 0 || segmentMidPointHoveredCoords) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.POINTER);\n } else if (this.hitElement(scenePointerX, scenePointerY, element)) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.MOVE);\n }\n } else if (this.hitElement(scenePointerX, scenePointerY, element)) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.MOVE);\n }\n\n if (this.state.selectedLinearElement.hoverPointIndex !== hoverPointIndex) {\n this.setState({\n selectedLinearElement: Object.assign(Object.assign({}, this.state.selectedLinearElement), {\n hoverPointIndex\n })\n });\n }\n\n if (!_element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.arePointsEqual(this.state.selectedLinearElement.segmentMidPointHoveredCoords, segmentMidPointHoveredCoords)) {\n this.setState({\n selectedLinearElement: Object.assign(Object.assign({}, this.state.selectedLinearElement), {\n segmentMidPointHoveredCoords\n })\n });\n }\n } else {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.AUTO);\n }\n }\n\n updateGestureOnPointerDown(event) {\n gesture.pointers.set(event.pointerId, {\n x: event.clientX,\n y: event.clientY\n });\n\n if (gesture.pointers.size === 2) {\n gesture.lastCenter = (0,_gesture__WEBPACK_IMPORTED_MODULE_22__.getCenter)(gesture.pointers);\n gesture.initialScale = this.state.zoom.value;\n gesture.initialDistance = (0,_gesture__WEBPACK_IMPORTED_MODULE_22__.getDistance)(Array.from(gesture.pointers.values()));\n }\n }\n\n initialPointerDownState(event) {\n const origin = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(event, this.state);\n const selectedElements = this.scene.getSelectedElements(this.state);\n const [minX, minY, maxX, maxY] = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getCommonBounds)(selectedElements);\n return {\n origin,\n withCmdOrCtrl: event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD],\n originInGrid: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.tupleToCoors)((0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(origin.x, origin.y, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize)),\n scrollbars: (0,_scene_scrollbars__WEBPACK_IMPORTED_MODULE_89__.isOverScrollBars)(currentScrollBars, event.clientX - this.state.offsetLeft, event.clientY - this.state.offsetTop),\n // we need to duplicate because we'll be updating this state\n lastCoords: Object.assign({}, origin),\n originalElements: this.scene.getNonDeletedElements().reduce((acc, element) => {\n acc.set(element.id, (0,_element_newElement__WEBPACK_IMPORTED_MODULE_20__.deepCopyElement)(element));\n return acc;\n }, new Map()),\n resize: {\n handleType: false,\n isResizing: false,\n offset: {\n x: 0,\n y: 0\n },\n arrowDirection: \"origin\",\n center: {\n x: (maxX + minX) / 2,\n y: (maxY + minY) / 2\n }\n },\n hit: {\n element: null,\n allHitElements: [],\n wasAddedToSelection: false,\n hasBeenDuplicated: false,\n hasHitCommonBoundingBoxOfSelectedElements: this.isHittingCommonBoundingBoxOfSelectedElements(origin, selectedElements)\n },\n drag: {\n hasOccurred: false,\n offset: null\n },\n eventListeners: {\n onMove: null,\n onUp: null,\n onKeyUp: null,\n onKeyDown: null\n },\n boxSelection: {\n hasOccurred: false\n }\n };\n } // Returns whether the event is a dragging a scrollbar\n\n\n handleDraggingScrollBar(event, pointerDownState) {\n if (!(pointerDownState.scrollbars.isOverEither && !this.state.multiElement)) {\n return false;\n }\n\n isDraggingScrollBar = true;\n pointerDownState.lastCoords.x = event.clientX;\n pointerDownState.lastCoords.y = event.clientY;\n const onPointerMove = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdatesThrottled)(event => {\n const target = event.target;\n\n if (!(target instanceof HTMLElement)) {\n return;\n }\n\n this.handlePointerMoveOverScrollbars(event, pointerDownState);\n });\n const onPointerUp = (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(() => {\n lastPointerUp = null;\n isDraggingScrollBar = false;\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursorForShape)(this.interactiveCanvas, this.state);\n this.setState({\n cursorButton: \"up\"\n });\n this.savePointer(event.clientX, event.clientY, \"up\");\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_MOVE, onPointerMove);\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, onPointerUp);\n onPointerMove.flush();\n });\n lastPointerUp = onPointerUp;\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_MOVE, onPointerMove);\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, onPointerUp);\n return true;\n }\n\n isASelectedElement(hitElement) {\n return hitElement != null && this.state.selectedElementIds[hitElement.id];\n }\n\n isHittingCommonBoundingBoxOfSelectedElements(point, selectedElements) {\n if (selectedElements.length < 2) {\n return false;\n } // How many pixels off the shape boundary we still consider a hit\n\n\n const threshold = this.getElementHitThreshold();\n const [x1, y1, x2, y2] = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getCommonBounds)(selectedElements);\n return point.x > x1 - threshold && point.x < x2 + threshold && point.y > y1 - threshold && point.y < y2 + threshold;\n }\n\n getCurrentItemRoundness(elementType) {\n return this.state.currentItemRoundness === \"round\" ? {\n type: (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isUsingAdaptiveRadius)(elementType) ? _constants__WEBPACK_IMPORTED_MODULE_12__.ROUNDNESS.ADAPTIVE_RADIUS : _constants__WEBPACK_IMPORTED_MODULE_12__.ROUNDNESS.PROPORTIONAL_RADIUS\n } : null;\n }\n\n maybeCacheReferenceSnapPoints(event, selectedElements, recomputeAnyways = false) {\n if ((0,_snapping__WEBPACK_IMPORTED_MODULE_59__.isSnappingEnabled)({\n event,\n appState: this.state,\n selectedElements\n }) && (recomputeAnyways || !_snapping__WEBPACK_IMPORTED_MODULE_59__.SnapCache.getReferenceSnapPoints())) {\n _snapping__WEBPACK_IMPORTED_MODULE_59__.SnapCache.setReferenceSnapPoints((0,_snapping__WEBPACK_IMPORTED_MODULE_59__.getReferenceSnapPoints)(this.scene.getNonDeletedElements(), selectedElements, this.state, this.scene.getNonDeletedElementsMap()));\n }\n }\n\n maybeCacheVisibleGaps(event, selectedElements, recomputeAnyways = false) {\n if ((0,_snapping__WEBPACK_IMPORTED_MODULE_59__.isSnappingEnabled)({\n event,\n appState: this.state,\n selectedElements\n }) && (recomputeAnyways || !_snapping__WEBPACK_IMPORTED_MODULE_59__.SnapCache.getVisibleGaps())) {\n _snapping__WEBPACK_IMPORTED_MODULE_59__.SnapCache.setVisibleGaps((0,_snapping__WEBPACK_IMPORTED_MODULE_59__.getVisibleGaps)(this.scene.getNonDeletedElements(), selectedElements, this.state, this.scene.getNonDeletedElementsMap()));\n }\n }\n\n onKeyDownFromPointerDownHandler(pointerDownState) {\n return (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n if (this.maybeHandleResize(pointerDownState, event)) {\n return;\n }\n\n this.maybeDragNewGenericElement(pointerDownState, event);\n });\n }\n\n onKeyUpFromPointerDownHandler(pointerDownState) {\n return (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(event => {\n // Prevents focus from escaping excalidraw tab\n event.key === _keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.ALT && event.preventDefault();\n\n if (this.maybeHandleResize(pointerDownState, event)) {\n return;\n }\n\n this.maybeDragNewGenericElement(pointerDownState, event);\n });\n }\n\n onPointerMoveFromPointerDownHandler(pointerDownState) {\n return (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdatesThrottled)(event => {\n var _a, _b; //To avoid pointerMove canceling the selection of locked elements on mobile //zsviczian\n\n\n if (Boolean(this.state.contextMenu)) {\n return;\n } // We need to initialize dragOffsetXY only after we've updated\n // `state.selectedElementIds` on pointerDown. Doing it here in pointerMove\n // event handler should hopefully ensure we're already working with\n // the updated state.\n\n\n if (pointerDownState.drag.offset === null) {\n pointerDownState.drag.offset = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.tupleToCoors)((0,_element__WEBPACK_IMPORTED_MODULE_16__.getDragOffsetXY)(this.scene.getSelectedElements(this.state), pointerDownState.origin.x, pointerDownState.origin.y));\n }\n\n const target = event.target;\n\n if (!(target instanceof HTMLElement)) {\n return;\n }\n\n if (this.handlePointerMoveOverScrollbars(event, pointerDownState)) {\n return;\n }\n\n const pointerCoords = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(event, this.state);\n\n if ((0,_appState__WEBPACK_IMPORTED_MODULE_10__.isEraserActive)(this.state)) {\n this.handleEraser(event, pointerDownState, pointerCoords);\n return;\n }\n\n if (this.state.activeTool.type === \"laser\") {\n this.laserTrails.addPointToPath(pointerCoords.x, pointerCoords.y);\n }\n\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_28__.getGridPoint)(pointerCoords.x, pointerCoords.y, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize); // for arrows/lines, don't start dragging until a given threshold\n // to ensure we don't create a 2-point arrow by mistake when\n // user clicks mouse in a way that it moves a tiny bit (thus\n // triggering pointermove)\n\n if (!pointerDownState.drag.hasOccurred && (this.state.activeTool.type === \"arrow\" || this.state.activeTool.type === \"line\")) {\n if ((0,_math__WEBPACK_IMPORTED_MODULE_28__.distance2d)(pointerCoords.x, pointerCoords.y, pointerDownState.origin.x, pointerDownState.origin.y) < _constants__WEBPACK_IMPORTED_MODULE_12__.DRAGGING_THRESHOLD) {\n return;\n }\n }\n\n if (pointerDownState.resize.isResizing) {\n pointerDownState.lastCoords.x = pointerCoords.x;\n pointerDownState.lastCoords.y = pointerCoords.y;\n\n if (this.maybeHandleResize(pointerDownState, event)) {\n return true;\n }\n }\n\n const elementsMap = this.scene.getNonDeletedElementsMap();\n\n if (this.state.selectedLinearElement) {\n const linearElementEditor = this.state.editingLinearElement || this.state.selectedLinearElement;\n\n if (_element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.shouldAddMidpoint(this.state.selectedLinearElement, pointerCoords, this.state, elementsMap)) {\n const ret = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.addMidpoint(this.state.selectedLinearElement, pointerCoords, this.state, !event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD], elementsMap);\n\n if (!ret) {\n return;\n } // Since we are reading from previous state which is not possible with\n // automatic batching in React 18 hence using flush sync to synchronously\n // update the state. Check https://github.com/excalidraw/excalidraw/pull/5508 for more details.\n\n\n (0,react_dom__WEBPACK_IMPORTED_MODULE_2__.flushSync)(() => {\n if (this.state.selectedLinearElement) {\n this.setState({\n selectedLinearElement: Object.assign(Object.assign({}, this.state.selectedLinearElement), {\n pointerDownState: ret.pointerDownState,\n selectedPointsIndices: ret.selectedPointsIndices\n })\n });\n }\n\n if (this.state.editingLinearElement) {\n this.setState({\n editingLinearElement: Object.assign(Object.assign({}, this.state.editingLinearElement), {\n pointerDownState: ret.pointerDownState,\n selectedPointsIndices: ret.selectedPointsIndices\n })\n });\n }\n });\n return;\n } else if (linearElementEditor.pointerDownState.segmentMidpoint.value !== null && !linearElementEditor.pointerDownState.segmentMidpoint.added) {\n return;\n }\n\n const didDrag = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.handlePointDragging(event, this.state, pointerCoords.x, pointerCoords.y, (element, pointsSceneCoords) => {\n this.maybeSuggestBindingsForLinearElementAtCoords(element, pointsSceneCoords);\n }, linearElementEditor, this.scene.getNonDeletedElementsMap());\n\n if (didDrag) {\n pointerDownState.lastCoords.x = pointerCoords.x;\n pointerDownState.lastCoords.y = pointerCoords.y;\n pointerDownState.drag.hasOccurred = true;\n\n if (this.state.editingLinearElement && !this.state.editingLinearElement.isDragging) {\n this.setState({\n editingLinearElement: Object.assign(Object.assign({}, this.state.editingLinearElement), {\n isDragging: true\n })\n });\n }\n\n if (!this.state.selectedLinearElement.isDragging) {\n this.setState({\n selectedLinearElement: Object.assign(Object.assign({}, this.state.selectedLinearElement), {\n isDragging: true\n })\n });\n }\n\n return;\n }\n }\n\n const hasHitASelectedElement = pointerDownState.hit.allHitElements.some(element => this.isASelectedElement(element));\n const isSelectingPointsInLineEditor = this.state.editingLinearElement && event.shiftKey && this.state.editingLinearElement.elementId === ((_a = pointerDownState.hit.element) === null || _a === void 0 ? void 0 : _a.id);\n\n if ((hasHitASelectedElement || pointerDownState.hit.hasHitCommonBoundingBoxOfSelectedElements) && !isSelectingPointsInLineEditor) {\n const selectedElements = this.scene.getSelectedElements(this.state);\n\n if (selectedElements.every(element => element.locked)) {\n return;\n }\n\n const selectedElementsHasAFrame = selectedElements.find(e => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(e));\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords(pointerCoords);\n this.setState({\n frameToHighlight: topLayerFrame && !selectedElementsHasAFrame ? topLayerFrame : null\n }); // Marking that click was used for dragging to check\n // if elements should be deselected on pointerup\n\n pointerDownState.drag.hasOccurred = true;\n this.setState({\n selectedElementsAreBeingDragged: true\n }); // prevent dragging even if we're no longer holding cmd/ctrl otherwise\n // it would have weird results (stuff jumping all over the screen)\n // Checking for editingElement to avoid jump while editing on mobile #6503\n\n if (selectedElements.length > 0 && !pointerDownState.withCmdOrCtrl && !this.state.editingElement && ((_b = this.state.activeEmbeddable) === null || _b === void 0 ? void 0 : _b.state) !== \"active\") {\n const dragOffset = {\n x: pointerCoords.x - pointerDownState.origin.x,\n y: pointerCoords.y - pointerDownState.origin.y\n };\n const originalElements = [...pointerDownState.originalElements.values()]; // We only drag in one direction if shift is pressed\n\n const lockDirection = event.shiftKey;\n\n if (lockDirection) {\n const distanceX = Math.abs(dragOffset.x);\n const distanceY = Math.abs(dragOffset.y);\n const lockX = lockDirection && distanceX < distanceY;\n const lockY = lockDirection && distanceX > distanceY;\n\n if (lockX) {\n dragOffset.x = 0;\n }\n\n if (lockY) {\n dragOffset.y = 0;\n }\n } // Snap cache *must* be synchronously popuplated before initial drag,\n // otherwise the first drag even will not snap, causing a jump before\n // it snaps to its position if previously snapped already.\n\n\n this.maybeCacheVisibleGaps(event, selectedElements);\n this.maybeCacheReferenceSnapPoints(event, selectedElements);\n const {\n snapOffset,\n snapLines\n } = (0,_snapping__WEBPACK_IMPORTED_MODULE_59__.snapDraggedElements)(originalElements, dragOffset, this.state, event, this.scene.getNonDeletedElementsMap());\n this.setState({\n snapLines\n }); // when we're editing the name of a frame, we want the user to be\n // able to select and interact with the text input\n\n !this.state.editingFrame && (0,_element__WEBPACK_IMPORTED_MODULE_16__.dragSelectedElements)(pointerDownState, selectedElements, dragOffset, this.state, this.scene, snapOffset, event[_keys__WEBPACK_IMPORTED_MODULE_26__.KEYS.CTRL_OR_CMD] ? null : this.state.gridSize);\n this.setState({\n suggestedBindings: (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.getSuggestedBindingsForArrows)(selectedElements, this.scene.getNonDeletedElementsMap())\n }); // We duplicate the selected element if alt is pressed on pointer move\n\n if (event.altKey && !pointerDownState.hit.hasBeenDuplicated) {\n // Move the currently selected elements to the top of the z index stack, and\n // put the duplicates where the selected elements used to be.\n // (the origin point where the dragging started)\n pointerDownState.hit.hasBeenDuplicated = true;\n const nextElements = [];\n const elementsToAppend = [];\n const groupIdMap = new Map();\n const oldIdToDuplicatedId = new Map();\n const hitElement = pointerDownState.hit.element;\n const selectedElementIds = new Set(this.scene.getSelectedElements({\n selectedElementIds: this.state.selectedElementIds,\n includeBoundTextElement: true,\n includeElementsInFrames: true\n }).map(element => element.id));\n const elements = this.scene.getElementsIncludingDeleted();\n\n for (const element of elements) {\n if (selectedElementIds.has(element.id) || // case: the state.selectedElementIds might not have been\n // updated yet by the time this mousemove event is fired\n element.id === (hitElement === null || hitElement === void 0 ? void 0 : hitElement.id) && pointerDownState.hit.wasAddedToSelection) {\n const duplicatedElement = (0,_element__WEBPACK_IMPORTED_MODULE_16__.duplicateElement)(this.state.editingGroupId, groupIdMap, element);\n const origElement = pointerDownState.originalElements.get(element.id);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(duplicatedElement, {\n x: origElement.x,\n y: origElement.y\n }); // put duplicated element to pointerDownState.originalElements\n // so that we can snap to the duplicated element without releasing\n\n pointerDownState.originalElements.set(duplicatedElement.id, duplicatedElement);\n nextElements.push(duplicatedElement);\n elementsToAppend.push(element);\n oldIdToDuplicatedId.set(element.id, duplicatedElement.id);\n } else {\n nextElements.push(element);\n }\n }\n\n const nextSceneElements = [...nextElements, ...elementsToAppend];\n (0,_fractionalIndex__WEBPACK_IMPORTED_MODULE_90__.syncMovedIndices)(nextSceneElements, (0,_utils__WEBPACK_IMPORTED_MODULE_35__.arrayToMap)(elementsToAppend));\n (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.bindTextToShapeAfterDuplication)(nextElements, elementsToAppend, oldIdToDuplicatedId);\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.fixBindingsAfterDuplication)(nextSceneElements, elementsToAppend, oldIdToDuplicatedId, \"duplicatesServeAsOld\");\n (0,_frame__WEBPACK_IMPORTED_MODULE_51__.bindElementsToFramesAfterDuplication)(nextSceneElements, elementsToAppend, oldIdToDuplicatedId);\n this.scene.replaceAllElements(nextSceneElements);\n this.maybeCacheVisibleGaps(event, selectedElements, true);\n this.maybeCacheReferenceSnapPoints(event, selectedElements, true);\n }\n\n return;\n }\n } // It is very important to read this.state within each move event,\n // otherwise we would read a stale one!\n\n\n const draggingElement = this.state.draggingElement;\n\n if (!draggingElement) {\n return;\n }\n\n if (draggingElement.type === \"freedraw\") {\n const points = draggingElement.points;\n const dx = pointerCoords.x - draggingElement.x;\n const dy = pointerCoords.y - draggingElement.y;\n const lastPoint = points.length > 0 && points[points.length - 1];\n const discardPoint = lastPoint && lastPoint[0] === dx && lastPoint[1] === dy;\n\n if (!discardPoint) {\n const strokeOptions = this.state.currentStrokeOptions; //zsviczian\n\n const pressures = draggingElement.simulatePressure ? draggingElement.pressures : [//zsviczian\n ...draggingElement.pressures, (strokeOptions === null || strokeOptions === void 0 ? void 0 : strokeOptions.constantPressure) ? 1 : event.pressure];\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(draggingElement, {\n points: [...points, [dx, dy]],\n pressures\n });\n }\n } else if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(draggingElement)) {\n pointerDownState.drag.hasOccurred = true;\n this.setState({\n selectedElementsAreBeingDragged: true\n });\n const points = draggingElement.points;\n let dx = gridX - draggingElement.x;\n let dy = gridY - draggingElement.y;\n\n if ((0,_keys__WEBPACK_IMPORTED_MODULE_26__.shouldRotateWithDiscreteAngle)(event) && points.length === 2) {\n ({\n width: dx,\n height: dy\n } = (0,_element__WEBPACK_IMPORTED_MODULE_16__.getLockedLinearCursorAlignSize)(draggingElement.x, draggingElement.y, pointerCoords.x, pointerCoords.y));\n }\n\n if (points.length === 1) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(draggingElement, {\n points: [...points, [dx, dy]]\n });\n } else if (points.length === 2) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(draggingElement, {\n points: [...points.slice(0, -1), [dx, dy]]\n });\n }\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBindingElement)(draggingElement, false)) {\n // When creating a linear element by dragging\n this.maybeSuggestBindingsForLinearElementAtCoords(draggingElement, [pointerCoords], this.state.startBoundElement);\n }\n } else {\n pointerDownState.lastCoords.x = pointerCoords.x;\n pointerDownState.lastCoords.y = pointerCoords.y;\n this.maybeDragNewGenericElement(pointerDownState, event);\n }\n\n if (this.state.activeTool.type === \"selection\") {\n pointerDownState.boxSelection.hasOccurred = true;\n const elements = this.scene.getNonDeletedElements(); // box-select line editor points\n\n if (this.state.editingLinearElement) {\n _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.handleBoxSelection(event, this.state, this.setState.bind(this), this.scene.getNonDeletedElementsMap()); // regular box-select\n } else {\n let shouldReuseSelection = true;\n\n if (!event.shiftKey && (0,_scene__WEBPACK_IMPORTED_MODULE_29__.isSomeElementSelected)(elements, this.state)) {\n if (pointerDownState.withCmdOrCtrl && pointerDownState.hit.element) {\n this.setState(prevState => (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)(Object.assign(Object.assign({}, prevState), {\n selectedElementIds: {\n [pointerDownState.hit.element.id]: true\n }\n }), this.scene.getNonDeletedElements(), prevState, this));\n } else {\n shouldReuseSelection = false;\n }\n }\n\n const elementsWithinSelection = (0,_scene__WEBPACK_IMPORTED_MODULE_29__.getElementsWithinSelection)(elements, draggingElement, this.scene.getNonDeletedElementsMap());\n this.setState(prevState => {\n const nextSelectedElementIds = Object.assign(Object.assign({}, shouldReuseSelection && prevState.selectedElementIds), elementsWithinSelection.reduce((acc, element) => {\n acc[element.id] = true;\n return acc;\n }, {}));\n\n if (pointerDownState.hit.element) {\n // if using ctrl/cmd, select the hitElement only if we\n // haven't box-selected anything else\n if (!elementsWithinSelection.length) {\n nextSelectedElementIds[pointerDownState.hit.element.id] = true;\n } else {\n delete nextSelectedElementIds[pointerDownState.hit.element.id];\n }\n }\n\n prevState = !shouldReuseSelection ? Object.assign(Object.assign({}, prevState), {\n selectedGroupIds: {},\n editingGroupId: null\n }) : prevState;\n return Object.assign(Object.assign({}, (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: prevState.editingGroupId,\n selectedElementIds: nextSelectedElementIds\n }, this.scene.getNonDeletedElements(), prevState, this)), {\n // select linear element only when we haven't box-selected anything else\n selectedLinearElement: elementsWithinSelection.length === 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(elementsWithinSelection[0]) ? new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(elementsWithinSelection[0]) : null,\n showHyperlinkPopup: elementsWithinSelection.length === 1 && (elementsWithinSelection[0].link || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(elementsWithinSelection[0])) ? \"info\" : false\n });\n });\n }\n }\n });\n } // Returns whether the pointer move happened over either scrollbar\n\n\n handlePointerMoveOverScrollbars(event, pointerDownState) {\n if (pointerDownState.scrollbars.isOverHorizontal) {\n const x = event.clientX;\n const dx = x - pointerDownState.lastCoords.x;\n this.translateCanvas({\n scrollX: this.state.scrollX - dx / this.state.zoom.value\n });\n pointerDownState.lastCoords.x = x;\n return true;\n }\n\n if (pointerDownState.scrollbars.isOverVertical) {\n const y = event.clientY;\n const dy = y - pointerDownState.lastCoords.y;\n this.translateCanvas({\n scrollY: this.state.scrollY - dy / this.state.zoom.value\n });\n pointerDownState.lastCoords.y = y;\n return true;\n }\n\n return false;\n }\n\n onPointerUpFromPointerDownHandler(pointerDownState) {\n return (0,_reactUtils__WEBPACK_IMPORTED_MODULE_84__.withBatchedUpdates)(childEvent => {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;\n\n this.removePointer(childEvent);\n\n if (pointerDownState.eventListeners.onMove) {\n pointerDownState.eventListeners.onMove.flush();\n }\n\n const {\n draggingElement,\n resizingElement,\n multiElement,\n activeTool,\n isResizing,\n isRotating\n } = this.state;\n this.setState(prevState => ({\n isResizing: false,\n isRotating: false,\n resizingElement: null,\n selectionElement: null,\n frameToHighlight: null,\n elementsToHighlight: null,\n cursorButton: \"up\",\n // text elements are reset on finalize, and resetting on pointerup\n // may cause issues with double taps\n editingElement: multiElement || (0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(this.state.editingElement) ? this.state.editingElement : null,\n snapLines: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateStable)(prevState.snapLines, []),\n originSnapOffset: null\n }));\n _snapping__WEBPACK_IMPORTED_MODULE_59__.SnapCache.setReferenceSnapPoints(null);\n _snapping__WEBPACK_IMPORTED_MODULE_59__.SnapCache.setVisibleGaps(null);\n this.savePointer(childEvent.clientX, childEvent.clientY, \"up\");\n this.setState({\n selectedElementsAreBeingDragged: false\n });\n const elementsMap = this.scene.getNonDeletedElementsMap(); // Handle end of dragging a point of a linear element, might close a loop\n // and sets binding element\n\n if (this.state.editingLinearElement) {\n if (!pointerDownState.boxSelection.hasOccurred && ((_b = (_a = pointerDownState.hit) === null || _a === void 0 ? void 0 : _a.element) === null || _b === void 0 ? void 0 : _b.id) !== this.state.editingLinearElement.elementId) {\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n } else {\n const editingLinearElement = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.handlePointerUp(childEvent, this.state.editingLinearElement, this.state, this);\n\n if (editingLinearElement !== this.state.editingLinearElement) {\n this.setState({\n editingLinearElement,\n suggestedBindings: []\n });\n }\n }\n } else if (this.state.selectedLinearElement) {\n if (((_d = (_c = pointerDownState.hit) === null || _c === void 0 ? void 0 : _c.element) === null || _d === void 0 ? void 0 : _d.id) !== this.state.selectedLinearElement.elementId) {\n const selectedELements = this.scene.getSelectedElements(this.state); // set selectedLinearElement to null if there is more than one element selected since we don't want to show linear element handles\n\n if (selectedELements.length > 1) {\n this.setState({\n selectedLinearElement: null\n });\n }\n } else {\n const linearElementEditor = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor.handlePointerUp(childEvent, this.state.selectedLinearElement, this.state, this);\n const {\n startBindingElement,\n endBindingElement\n } = linearElementEditor;\n const element = this.scene.getElement(linearElementEditor.elementId);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBindingElement)(element)) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.bindOrUnbindLinearElement)(element, startBindingElement, endBindingElement, elementsMap);\n }\n\n if (linearElementEditor !== this.state.selectedLinearElement) {\n this.setState({\n selectedLinearElement: Object.assign(Object.assign({}, linearElementEditor), {\n selectedPointsIndices: null\n }),\n suggestedBindings: []\n });\n }\n }\n }\n\n this.missingPointerEventCleanupEmitter.clear();\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_MOVE, pointerDownState.eventListeners.onMove);\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.POINTER_UP, pointerDownState.eventListeners.onUp);\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.KEYDOWN, pointerDownState.eventListeners.onKeyDown);\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_12__.EVENT.KEYUP, pointerDownState.eventListeners.onKeyUp);\n\n if (this.state.pendingImageElementId) {\n this.setState({\n pendingImageElementId: null\n });\n }\n\n (_f = (_e = this.props) === null || _e === void 0 ? void 0 : _e.onPointerUp) === null || _f === void 0 ? void 0 : _f.call(_e, activeTool, pointerDownState);\n this.onPointerUpEmitter.trigger(this.state.activeTool, pointerDownState, childEvent);\n\n if ((draggingElement === null || draggingElement === void 0 ? void 0 : draggingElement.type) === \"freedraw\") {\n const pointerCoords = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(childEvent, this.state);\n const points = draggingElement.points;\n let dx = pointerCoords.x - draggingElement.x;\n let dy = pointerCoords.y - draggingElement.y; // Allows dots to avoid being flagged as infinitely small\n\n if (dx === points[0][0] && dy === points[0][1]) {\n dy += 0.0001;\n dx += 0.0001;\n }\n\n const pressures = draggingElement.simulatePressure ? [] : [...draggingElement.pressures, childEvent.pressure];\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(draggingElement, {\n points: [...points, [dx, dy]],\n pressures,\n lastCommittedPoint: [dx, dy]\n });\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n return;\n }\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isImageElement)(draggingElement)) {\n const imageElement = draggingElement;\n\n try {\n this.initializeImageDimensions(imageElement);\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({\n [imageElement.id]: true\n }, this.state)\n }, () => {\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n });\n } catch (error) {\n console.error(error);\n this.scene.replaceAllElements(this.scene.getElementsIncludingDeleted().filter(el => el.id !== imageElement.id));\n this.actionManager.executeAction(_actions__WEBPACK_IMPORTED_MODULE_5__.actionFinalize);\n }\n\n return;\n }\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(draggingElement)) {\n if (draggingElement.points.length > 1) {\n this.store.shouldCaptureIncrement();\n }\n\n const pointerCoords = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(childEvent, this.state);\n\n if (!pointerDownState.drag.hasOccurred && draggingElement && !multiElement) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(draggingElement, {\n points: [...draggingElement.points, [pointerCoords.x - draggingElement.x, pointerCoords.y - draggingElement.y]]\n });\n this.setState({\n multiElement: draggingElement,\n editingElement: this.state.draggingElement\n });\n } else if (pointerDownState.drag.hasOccurred && !multiElement) {\n if ((0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.isBindingEnabled)(this.state) && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBindingElement)(draggingElement, false)) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.maybeBindLinearElement)(draggingElement, this.state, pointerCoords, this.scene.getNonDeletedElementsMap());\n }\n\n this.setState({\n suggestedBindings: [],\n startBoundElement: null\n });\n\n if (!activeTool.locked) {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n this.setState(prevState => ({\n draggingElement: null,\n activeTool: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, {\n type: \"selection\"\n }),\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(Object.assign(Object.assign({}, prevState.selectedElementIds), {\n [draggingElement.id]: true\n }), prevState),\n selectedLinearElement: new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(draggingElement)\n }));\n } else {\n this.setState(prevState => ({\n draggingElement: null\n }));\n }\n }\n\n return;\n }\n\n if ((0,_element__WEBPACK_IMPORTED_MODULE_16__.isTextElement)(draggingElement)) {\n const minWidth = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getMinTextElementWidth)((0,_utils__WEBPACK_IMPORTED_MODULE_35__.getFontString)({\n fontSize: draggingElement.fontSize,\n fontFamily: draggingElement.fontFamily\n }), draggingElement.lineHeight);\n\n if (draggingElement.width < minWidth) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(draggingElement, {\n autoResize: true\n });\n }\n\n this.resetCursor();\n this.handleTextWysiwyg(draggingElement, {\n isExistingElement: true\n });\n }\n\n if (activeTool.type !== \"selection\" && draggingElement && (0,_element__WEBPACK_IMPORTED_MODULE_16__.isInvisiblySmallElement)(draggingElement)) {\n // remove invisible element which was added in onPointerDown\n // update the store snapshot, so that invisible elements are not captured by the store\n this.updateScene({\n elements: this.scene.getElementsIncludingDeleted().filter(el => el.id !== draggingElement.id),\n appState: {\n draggingElement: null\n },\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.UPDATE\n });\n return;\n }\n\n if (draggingElement) {\n if (pointerDownState.drag.hasOccurred) {\n const sceneCoords = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)(childEvent, this.state); // when editing the points of a linear element, we check if the\n // linear element still is in the frame afterwards\n // if not, the linear element will be removed from its frame (if any)\n\n if (this.state.selectedLinearElement && this.state.selectedLinearElement.isDragging) {\n const linearElement = this.scene.getElement(this.state.selectedLinearElement.elementId);\n\n if (linearElement === null || linearElement === void 0 ? void 0 : linearElement.frameId) {\n const frame = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getContainingFrame)(linearElement, elementsMap);\n\n if (frame && linearElement) {\n if (!(0,_frame__WEBPACK_IMPORTED_MODULE_51__.elementOverlapsWithFrame)(linearElement, frame, this.scene.getNonDeletedElementsMap())) {\n // remove the linear element from all groups\n // before removing it from the frame as well\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(linearElement, {\n groupIds: []\n });\n (0,_frame__WEBPACK_IMPORTED_MODULE_51__.removeElementsFromFrame)([linearElement], this.scene.getNonDeletedElementsMap());\n this.scene.triggerUpdate();\n }\n }\n }\n } else {\n // update the relationships between selected elements and frames\n const topLayerFrame = this.getTopLayerFrameAtSceneCoords(sceneCoords);\n const selectedElements = this.scene.getSelectedElements(this.state);\n let nextElements = this.scene.getElementsMapIncludingDeleted();\n\n const updateGroupIdsAfterEditingGroup = elements => {\n if (elements.length > 0) {\n for (const element of elements) {\n const index = element.groupIds.indexOf(this.state.editingGroupId);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(element, {\n groupIds: element.groupIds.slice(0, index)\n }, false);\n }\n\n nextElements.forEach(element => {\n if (element.groupIds.length && (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getElementsInGroup)(nextElements, element.groupIds[element.groupIds.length - 1]).length < 2) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(element, {\n groupIds: []\n }, false);\n }\n });\n this.setState({\n editingGroupId: null\n });\n }\n };\n\n if (topLayerFrame && !this.state.selectedElementIds[topLayerFrame.id]) {\n const elementsToAdd = selectedElements.filter(element => element.frameId !== topLayerFrame.id && (0,_frame__WEBPACK_IMPORTED_MODULE_51__.isElementInFrame)(element, nextElements, this.state));\n\n if (this.state.editingGroupId) {\n updateGroupIdsAfterEditingGroup(elementsToAdd);\n }\n\n nextElements = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.addElementsToFrame)(nextElements, elementsToAdd, topLayerFrame);\n } else if (!topLayerFrame) {\n if (this.state.editingGroupId) {\n const elementsToRemove = selectedElements.filter(element => element.frameId && !(0,_frame__WEBPACK_IMPORTED_MODULE_51__.isElementInFrame)(element, nextElements, this.state));\n updateGroupIdsAfterEditingGroup(elementsToRemove);\n }\n }\n\n nextElements = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.updateFrameMembershipOfSelectedElements)(nextElements, this.state, this);\n this.scene.replaceAllElements(nextElements);\n }\n }\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(draggingElement)) {\n const elementsInsideFrame = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getElementsInNewFrame)(this.scene.getElementsIncludingDeleted(), draggingElement, this.scene.getNonDeletedElementsMap());\n this.scene.replaceAllElements((0,_frame__WEBPACK_IMPORTED_MODULE_51__.addElementsToFrame)(this.scene.getElementsMapIncludingDeleted(), elementsInsideFrame, draggingElement));\n }\n\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_19__.mutateElement)(draggingElement, (0,_element__WEBPACK_IMPORTED_MODULE_16__.getNormalizedDimensions)(draggingElement));\n }\n\n if (resizingElement) {\n this.store.shouldCaptureIncrement();\n }\n\n if (resizingElement && (0,_element__WEBPACK_IMPORTED_MODULE_16__.isInvisiblySmallElement)(resizingElement)) {\n // update the store snapshot, so that invisible elements are not captured by the store\n this.updateScene({\n elements: this.scene.getElementsIncludingDeleted().filter(el => el.id !== resizingElement.id),\n storeAction: _store__WEBPACK_IMPORTED_MODULE_80__.StoreAction.UPDATE\n });\n } // handle frame membership for resizing frames and/or selected elements\n\n\n if (pointerDownState.resize.isResizing) {\n let nextElements = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.updateFrameMembershipOfSelectedElements)(this.scene.getElementsIncludingDeleted(), this.state, this);\n const selectedFrames = this.scene.getSelectedElements(this.state).filter(element => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(element));\n\n for (const frame of selectedFrames) {\n nextElements = (0,_frame__WEBPACK_IMPORTED_MODULE_51__.replaceAllElementsInFrame)(nextElements, (0,_frame__WEBPACK_IMPORTED_MODULE_51__.getElementsInResizingFrame)(this.scene.getElementsIncludingDeleted(), frame, this.state, elementsMap), frame, this);\n }\n\n this.scene.replaceAllElements(nextElements);\n } // Code below handles selection when element(s) weren't\n // drag or added to selection on pointer down phase.\n\n\n const hitElement = pointerDownState.hit.element;\n\n if (((_g = this.state.selectedLinearElement) === null || _g === void 0 ? void 0 : _g.elementId) !== (hitElement === null || hitElement === void 0 ? void 0 : hitElement.id) && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(hitElement)) {\n const selectedELements = this.scene.getSelectedElements(this.state); // set selectedLinearElement when no other element selected except\n // the one we've hit\n\n if (selectedELements.length === 1) {\n this.setState({\n selectedLinearElement: new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(hitElement)\n });\n }\n }\n\n const pointerStart = this.lastPointerDownEvent;\n const pointerEnd = this.lastPointerUpEvent || this.lastPointerMoveEvent;\n\n if ((0,_appState__WEBPACK_IMPORTED_MODULE_10__.isEraserActive)(this.state) && pointerStart && pointerEnd) {\n this.eraserTrail.endPath();\n const draggedDistance = (0,_math__WEBPACK_IMPORTED_MODULE_28__.distance2d)(pointerStart.clientX, pointerStart.clientY, pointerEnd.clientX, pointerEnd.clientY);\n\n if (draggedDistance === 0) {\n const scenePointer = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.viewportCoordsToSceneCoords)({\n clientX: pointerEnd.clientX,\n clientY: pointerEnd.clientY\n }, this.state);\n const hitElements = this.getElementsAtPosition(scenePointer.x, scenePointer.y);\n hitElements.forEach(hitElement => this.elementsPendingErasure.add(hitElement.id));\n }\n\n this.eraseElements();\n return;\n } else if (this.elementsPendingErasure.size) {\n this.restoreReadyToEraseElements();\n }\n\n if (hitElement && !pointerDownState.drag.hasOccurred && !pointerDownState.hit.wasAddedToSelection && ( // if we're editing a line, pointerup shouldn't switch selection if\n // box selected\n !this.state.editingLinearElement || !pointerDownState.boxSelection.hasOccurred)) {\n // when inside line editor, shift selects points instead\n if (childEvent.shiftKey && !this.state.editingLinearElement) {\n if (this.state.selectedElementIds[hitElement.id]) {\n if ((0,_groups__WEBPACK_IMPORTED_MODULE_23__.isSelectedViaGroup)(this.state, hitElement)) {\n this.setState(_prevState => {\n const nextSelectedElementIds = Object.assign({}, _prevState.selectedElementIds); // We want to unselect all groups hitElement is part of\n // as well as all elements that are part of the groups\n // hitElement is part of\n\n for (const groupedElement of hitElement.groupIds.flatMap(groupId => (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getElementsInGroup)(this.scene.getNonDeletedElements(), groupId))) {\n delete nextSelectedElementIds[groupedElement.id];\n }\n\n return {\n selectedGroupIds: Object.assign(Object.assign({}, _prevState.selectedElementIds), hitElement.groupIds.map(gId => ({\n [gId]: false\n })).reduce((prev, acc) => Object.assign(Object.assign({}, prev), acc), {})),\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(nextSelectedElementIds, _prevState)\n };\n }); // if not dragging a linear element point (outside editor)\n } else if (!((_h = this.state.selectedLinearElement) === null || _h === void 0 ? void 0 : _h.isDragging)) {\n // remove element from selection while\n // keeping prev elements selected\n this.setState(prevState => {\n const newSelectedElementIds = Object.assign({}, prevState.selectedElementIds);\n delete newSelectedElementIds[hitElement.id];\n const newSelectedElements = (0,_scene__WEBPACK_IMPORTED_MODULE_29__.getSelectedElements)(this.scene.getNonDeletedElements(), {\n selectedElementIds: newSelectedElementIds\n });\n return Object.assign(Object.assign({}, (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: prevState.editingGroupId,\n selectedElementIds: newSelectedElementIds\n }, this.scene.getNonDeletedElements(), prevState, this)), {\n // set selectedLinearElement only if thats the only element selected\n selectedLinearElement: newSelectedElements.length === 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(newSelectedElements[0]) ? new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(newSelectedElements[0]) : prevState.selectedLinearElement\n });\n });\n }\n } else if (hitElement.frameId && this.state.selectedElementIds[hitElement.frameId]) {\n // when hitElement is part of a selected frame, deselect the frame\n // to avoid frame and containing elements selected simultaneously\n this.setState(prevState => {\n var _a, _b;\n\n const nextSelectedElementIds = Object.assign(Object.assign({}, prevState.selectedElementIds), {\n [hitElement.id]: true\n }); // deselect the frame\n\n delete nextSelectedElementIds[hitElement.frameId]; // deselect groups containing the frame\n\n ((_b = (_a = this.scene.getElement(hitElement.frameId)) === null || _a === void 0 ? void 0 : _a.groupIds) !== null && _b !== void 0 ? _b : []).flatMap(gid => (0,_groups__WEBPACK_IMPORTED_MODULE_23__.getElementsInGroup)(this.scene.getNonDeletedElements(), gid)).forEach(element => {\n delete nextSelectedElementIds[element.id];\n });\n return Object.assign(Object.assign({}, (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: prevState.editingGroupId,\n selectedElementIds: nextSelectedElementIds\n }, this.scene.getNonDeletedElements(), prevState, this)), {\n showHyperlinkPopup: hitElement.link || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(hitElement) ? \"info\" : false\n });\n });\n } else {\n // add element to selection while keeping prev elements selected\n this.setState(_prevState => ({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(Object.assign(Object.assign({}, _prevState.selectedElementIds), {\n [hitElement.id]: true\n }), _prevState)\n }));\n }\n } else {\n this.setState(prevState => {\n var _a;\n\n return Object.assign(Object.assign({}, (0,_groups__WEBPACK_IMPORTED_MODULE_23__.selectGroupsForSelectedElements)({\n editingGroupId: prevState.editingGroupId,\n selectedElementIds: {\n [hitElement.id]: true\n }\n }, this.scene.getNonDeletedElements(), prevState, this)), {\n selectedLinearElement: (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement)(hitElement) && // Don't set `selectedLinearElement` if its same as the hitElement, this is mainly to prevent resetting the `hoverPointIndex` to -1.\n // Future we should update the API to take care of setting the correct `hoverPointIndex` when initialized\n ((_a = prevState.selectedLinearElement) === null || _a === void 0 ? void 0 : _a.elementId) !== hitElement.id ? new _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_18__.LinearElementEditor(hitElement) : prevState.selectedLinearElement\n });\n });\n }\n }\n\n if ( // not dragged\n !pointerDownState.drag.hasOccurred && // not resized\n !this.state.isResizing && ( // only hitting the bounding box of the previous hit element\n hitElement && (0,_element_collision__WEBPACK_IMPORTED_MODULE_87__.hitElementBoundingBoxOnly)({\n x: pointerDownState.origin.x,\n y: pointerDownState.origin.y,\n element: hitElement,\n shape: (0,_shapes__WEBPACK_IMPORTED_MODULE_32__.getElementShape)(hitElement, this.scene.getNonDeletedElementsMap()),\n threshold: this.getElementHitThreshold(),\n frameNameBound: (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isFrameLikeElement)(hitElement) ? this.frameNameBoundsCache.get(hitElement) : null\n }, elementsMap) || !hitElement && pointerDownState.hit.hasHitCommonBoundingBoxOfSelectedElements)) {\n if (this.state.editingLinearElement) {\n this.setState({\n editingLinearElement: null\n });\n } else {\n // Deselect selected elements\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n selectedGroupIds: {},\n editingGroupId: null,\n activeEmbeddable: null\n });\n } // reset cursor\n\n\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.setCursor)(this.interactiveCanvas, _constants__WEBPACK_IMPORTED_MODULE_12__.CURSOR_TYPE.AUTO);\n return;\n }\n\n if (!activeTool.locked && activeTool.type !== \"freedraw\" && draggingElement && draggingElement.type !== \"selection\") {\n this.setState(prevState => ({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)(Object.assign(Object.assign({}, prevState.selectedElementIds), {\n [draggingElement.id]: true\n }), prevState),\n showHyperlinkPopup: (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isEmbeddableElement)(draggingElement) && !draggingElement.link ? \"editor\" : prevState.showHyperlinkPopup\n }));\n }\n\n if (activeTool.type !== \"selection\" || (0,_scene__WEBPACK_IMPORTED_MODULE_29__.isSomeElementSelected)(this.scene.getNonDeletedElements(), this.state) || !(0,_utils__WEBPACK_IMPORTED_MODULE_35__.isShallowEqual)(this.state.previousSelectedElementIds, this.state.selectedElementIds)) {\n this.store.shouldCaptureIncrement();\n }\n\n if (pointerDownState.drag.hasOccurred || isResizing || isRotating) {\n // We only allow binding via linear elements, specifically via dragging\n // the endpoints (\"start\" or \"end\").\n const linearElements = this.scene.getSelectedElements(this.state).filter(_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isLinearElement);\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.bindOrUnbindLinearElements)(linearElements, this.scene.getNonDeletedElementsMap(), (0,_element_binding__WEBPACK_IMPORTED_MODULE_17__.isBindingEnabled)(this.state), (_k = (_j = this.state.selectedLinearElement) === null || _j === void 0 ? void 0 : _j.selectedPointsIndices) !== null && _k !== void 0 ? _k : []);\n }\n\n if (activeTool.type === \"laser\") {\n this.laserTrails.endPath();\n return;\n }\n\n if (!activeTool.locked && activeTool.type !== \"freedraw\") {\n (0,_cursor__WEBPACK_IMPORTED_MODULE_69__.resetCursor)(this.interactiveCanvas);\n this.setState({\n draggingElement: null,\n suggestedBindings: [],\n activeTool: (0,_utils__WEBPACK_IMPORTED_MODULE_35__.updateActiveTool)(this.state, {\n type: \"selection\"\n })\n });\n } else {\n this.setState({\n draggingElement: null,\n suggestedBindings: []\n });\n }\n\n if (hitElement && this.lastPointerUpEvent && this.lastPointerDownEvent && this.lastPointerUpEvent.timeStamp - this.lastPointerDownEvent.timeStamp < 300 && gesture.pointers.size <= 1 && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isIframeLikeElement)(hitElement) && this.isIframeLikeElementCenter(hitElement, this.lastPointerUpEvent, pointerDownState.origin.x, pointerDownState.origin.y)) {\n this.handleEmbeddableCenterClick(hitElement);\n }\n });\n } //zsviczian - published on API\n\n\n setSelection(elements) {\n const selectedElementIds = {};\n const selectedGroupIds = {};\n elements.forEach(ele => {\n if (ele.groupIds.length) {\n selectedElementIds[ele.id] = true;\n ele.groupIds.forEach(id => {\n selectedGroupIds[id] = true;\n });\n } // exclude bound text elements as we don't mark them as selected when\n // container is selected unless in group\n else if (!(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_21__.isBoundToContainer)(ele)) {\n selectedElementIds[ele.id] = true;\n }\n });\n this.setState({\n previousSelectedElementIds: this.state.selectedElementIds,\n selectedElementIds,\n selectedGroupIds\n });\n }\n\n clearSelection(hitElement) {\n this.setState(prevState => ({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, prevState),\n activeEmbeddable: null,\n selectedGroupIds: {},\n // Continue editing the same group if the user selected a different\n // element from it\n editingGroupId: prevState.editingGroupId && hitElement != null && (0,_groups__WEBPACK_IMPORTED_MODULE_23__.isElementInGroup)(hitElement, prevState.editingGroupId) ? prevState.editingGroupId : null\n }));\n this.setState({\n selectedElementIds: (0,_scene_selection__WEBPACK_IMPORTED_MODULE_52__.makeNextSelectedElementIds)({}, this.state),\n activeEmbeddable: null,\n previousSelectedElementIds: this.state.selectedElementIds\n });\n }\n\n getTextWysiwygSnappedToCenterPosition(x, y, appState, container) {\n if (container) {\n let elementCenterX = container.x + container.width / 2;\n let elementCenterY = container.y + container.height / 2;\n const elementCenter = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_45__.getContainerCenter)(container, appState, this.scene.getNonDeletedElementsMap());\n\n if (elementCenter) {\n elementCenterX = elementCenter.x;\n elementCenterY = elementCenter.y;\n }\n\n const distanceToCenter = Math.hypot(x - elementCenterX, y - elementCenterY);\n const isSnappedToCenter = distanceToCenter < _constants__WEBPACK_IMPORTED_MODULE_12__.TEXT_TO_CENTER_SNAP_THRESHOLD;\n\n if (isSnappedToCenter) {\n const {\n x: viewportX,\n y: viewportY\n } = (0,_utils__WEBPACK_IMPORTED_MODULE_35__.sceneCoordsToViewportCoords)({\n sceneX: elementCenterX,\n sceneY: elementCenterY\n }, appState);\n return {\n viewportX,\n viewportY,\n elementCenterX,\n elementCenterY\n };\n }\n }\n }\n\n getCanvasOffsets() {\n var _a;\n\n if ((_a = this.excalidrawContainerRef) === null || _a === void 0 ? void 0 : _a.current) {\n const excalidrawContainer = this.excalidrawContainerRef.current;\n const {\n left,\n top\n } = excalidrawContainer.getBoundingClientRect();\n return {\n offsetLeft: left,\n offsetTop: top\n };\n }\n\n return {\n offsetLeft: 0,\n offsetTop: 0\n };\n }\n\n async updateLanguage() {\n const currentLang = _i18n__WEBPACK_IMPORTED_MODULE_25__.languages.find(lang => lang.code === this.props.langCode) || _i18n__WEBPACK_IMPORTED_MODULE_25__.defaultLang;\n await (0,_i18n__WEBPACK_IMPORTED_MODULE_25__.setLanguage)(currentLang);\n this.setAppState({});\n }\n\n}\n/* //zsviczian\r\nexport const createTestHook = () => {\r\n if (import.meta.env.MODE === ENV.TEST || import.meta.env.DEV) {\r\n window.h = window.h || ({} as Window[\"h\"]);\r\n\r\n Object.defineProperties(window.h, {\r\n elements: {\r\n configurable: true,\r\n get() {\r\n return this.app?.scene.getElementsIncludingDeleted();\r\n },\r\n set(elements: ExcalidrawElement[]) {\r\n return this.app?.scene.replaceAllElements(\r\n syncInvalidIndices(elements),\r\n );\r\n },\r\n },\r\n });\r\n }\r\n};\r\n\r\ncreateTestHook();*/\n\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (App);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/App.tsx?");
885
885
 
886
886
  /***/ }),
887
887
 
@@ -1750,7 +1750,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
1750
1750
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
1751
1751
 
1752
1752
  "use strict";
1753
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../math */ \"./math.ts\");\n/* harmony import */ var _icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../icons */ \"./components/icons.tsx\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n\n\n\n\n\n\n\n\nconst STEP_SIZE = 15;\n\nconst Angle = ({\n element,\n elementsMap\n}) => {\n const handleDegreeChange = ({\n accumulatedChange,\n originalElements,\n shouldChangeByStepSize,\n nextValue\n }) => {\n const origElement = originalElements[0];\n\n if (origElement) {\n if (nextValue !== undefined) {\n const nextAngle = (0,_math__WEBPACK_IMPORTED_MODULE_4__.degreeToRadian)(nextValue);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(element, {\n angle: nextAngle\n });\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_2__.getBoundTextElement)(element, elementsMap);\n\n if (boundTextElement && !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_3__.isArrowElement)(element)) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(boundTextElement, {\n angle: nextAngle\n });\n }\n\n return;\n }\n\n const originalAngleInDegrees = Math.round((0,_math__WEBPACK_IMPORTED_MODULE_4__.radianToDegree)(origElement.angle) * 100) / 100;\n const changeInDegrees = Math.round(accumulatedChange);\n let nextAngleInDegrees = (originalAngleInDegrees + changeInDegrees) % 360;\n\n if (shouldChangeByStepSize) {\n nextAngleInDegrees = (0,_utils__WEBPACK_IMPORTED_MODULE_7__.getStepSizedValue)(nextAngleInDegrees, STEP_SIZE);\n }\n\n nextAngleInDegrees = nextAngleInDegrees < 0 ? nextAngleInDegrees + 360 : nextAngleInDegrees;\n const nextAngle = (0,_math__WEBPACK_IMPORTED_MODULE_4__.degreeToRadian)(nextAngleInDegrees);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(element, {\n angle: nextAngle\n });\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_2__.getBoundTextElement)(element, elementsMap);\n\n if (boundTextElement && !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_3__.isArrowElement)(element)) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(boundTextElement, {\n angle: nextAngle\n });\n }\n }\n };\n\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n label: \"A\",\n icon: _icons__WEBPACK_IMPORTED_MODULE_5__.angleIcon,\n value: Math.round((0,_math__WEBPACK_IMPORTED_MODULE_4__.radianToDegree)(element.angle) % 360 * 100) / 100,\n elements: [element],\n dragInputCallback: handleDegreeChange,\n editable: (0,_utils__WEBPACK_IMPORTED_MODULE_7__.isPropertyEditable)(element, \"angle\")\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Angle);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/Angle.tsx?");
1753
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../math */ \"./math.ts\");\n/* harmony import */ var _icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../icons */ \"./components/icons.tsx\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n\n\n\n\n\n\n\n\nconst STEP_SIZE = 15;\n\nconst handleDegreeChange = ({\n accumulatedChange,\n originalElements,\n shouldChangeByStepSize,\n nextValue,\n scene\n}) => {\n const elementsMap = scene.getNonDeletedElementsMap();\n const origElement = originalElements[0];\n\n if (origElement) {\n const latestElement = elementsMap.get(origElement.id);\n\n if (!latestElement) {\n return;\n }\n\n if (nextValue !== undefined) {\n const nextAngle = (0,_math__WEBPACK_IMPORTED_MODULE_4__.degreeToRadian)(nextValue);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(latestElement, {\n angle: nextAngle\n });\n (0,_utils__WEBPACK_IMPORTED_MODULE_7__.updateBindings)(latestElement, elementsMap);\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_2__.getBoundTextElement)(latestElement, elementsMap);\n\n if (boundTextElement && !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_3__.isArrowElement)(latestElement)) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(boundTextElement, {\n angle: nextAngle\n });\n }\n\n return;\n }\n\n const originalAngleInDegrees = Math.round((0,_math__WEBPACK_IMPORTED_MODULE_4__.radianToDegree)(origElement.angle) * 100) / 100;\n const changeInDegrees = Math.round(accumulatedChange);\n let nextAngleInDegrees = (originalAngleInDegrees + changeInDegrees) % 360;\n\n if (shouldChangeByStepSize) {\n nextAngleInDegrees = (0,_utils__WEBPACK_IMPORTED_MODULE_7__.getStepSizedValue)(nextAngleInDegrees, STEP_SIZE);\n }\n\n nextAngleInDegrees = nextAngleInDegrees < 0 ? nextAngleInDegrees + 360 : nextAngleInDegrees;\n const nextAngle = (0,_math__WEBPACK_IMPORTED_MODULE_4__.degreeToRadian)(nextAngleInDegrees);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(latestElement, {\n angle: nextAngle\n });\n (0,_utils__WEBPACK_IMPORTED_MODULE_7__.updateBindings)(latestElement, elementsMap);\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_2__.getBoundTextElement)(latestElement, elementsMap);\n\n if (boundTextElement && !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_3__.isArrowElement)(latestElement)) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(boundTextElement, {\n angle: nextAngle\n });\n }\n }\n};\n\nconst Angle = ({\n element,\n scene,\n appState,\n property\n}) => {\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n label: \"A\",\n icon: _icons__WEBPACK_IMPORTED_MODULE_5__.angleIcon,\n value: Math.round((0,_math__WEBPACK_IMPORTED_MODULE_4__.radianToDegree)(element.angle) % 360 * 100) / 100,\n elements: [element],\n dragInputCallback: handleDegreeChange,\n editable: (0,_utils__WEBPACK_IMPORTED_MODULE_7__.isPropertyEditable)(element, \"angle\"),\n scene: scene,\n appState: appState,\n property: property\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Angle);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/Angle.tsx?");
1754
1754
 
1755
1755
  /***/ }),
1756
1756
 
@@ -1772,7 +1772,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
1772
1772
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
1773
1773
 
1774
1774
  "use strict";
1775
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../constants */ \"./constants.ts\");\n\n\n\n\nconst STEP_SIZE = 10;\n\nconst _shouldKeepAspectRatio = element => {\n return element.type === \"image\";\n};\n\nconst DimensionDragInput = ({\n property,\n element,\n elementsMap\n}) => {\n const handleDimensionChange = ({\n accumulatedChange,\n originalElements,\n originalElementsMap,\n shouldKeepAspectRatio,\n shouldChangeByStepSize,\n nextValue\n }) => {\n const origElement = originalElements[0];\n\n if (origElement) {\n const keepAspectRatio = shouldKeepAspectRatio || _shouldKeepAspectRatio(element);\n\n const aspectRatio = origElement.width / origElement.height;\n\n if (nextValue !== undefined) {\n const nextWidth = Math.max(property === \"width\" ? nextValue : keepAspectRatio ? nextValue * aspectRatio : origElement.width, _constants__WEBPACK_IMPORTED_MODULE_3__.MIN_WIDTH_OR_HEIGHT);\n const nextHeight = Math.max(property === \"height\" ? nextValue : keepAspectRatio ? nextValue / aspectRatio : origElement.height, _constants__WEBPACK_IMPORTED_MODULE_3__.MIN_WIDTH_OR_HEIGHT);\n (0,_utils__WEBPACK_IMPORTED_MODULE_2__.resizeElement)(nextWidth, nextHeight, keepAspectRatio, element, origElement, elementsMap, originalElementsMap);\n return;\n }\n\n const changeInWidth = property === \"width\" ? accumulatedChange : 0;\n const changeInHeight = property === \"height\" ? accumulatedChange : 0;\n let nextWidth = Math.max(0, origElement.width + changeInWidth);\n\n if (property === \"width\") {\n if (shouldChangeByStepSize) {\n nextWidth = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getStepSizedValue)(nextWidth, STEP_SIZE);\n } else {\n nextWidth = Math.round(nextWidth);\n }\n }\n\n let nextHeight = Math.max(0, origElement.height + changeInHeight);\n\n if (property === \"height\") {\n if (shouldChangeByStepSize) {\n nextHeight = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getStepSizedValue)(nextHeight, STEP_SIZE);\n } else {\n nextHeight = Math.round(nextHeight);\n }\n }\n\n if (keepAspectRatio) {\n if (property === \"width\") {\n nextHeight = Math.round(nextWidth / aspectRatio * 100) / 100;\n } else {\n nextWidth = Math.round(nextHeight * aspectRatio * 100) / 100;\n }\n }\n\n nextHeight = Math.max(_constants__WEBPACK_IMPORTED_MODULE_3__.MIN_WIDTH_OR_HEIGHT, nextHeight);\n nextWidth = Math.max(_constants__WEBPACK_IMPORTED_MODULE_3__.MIN_WIDTH_OR_HEIGHT, nextWidth);\n (0,_utils__WEBPACK_IMPORTED_MODULE_2__.resizeElement)(nextWidth, nextHeight, keepAspectRatio, element, origElement, elementsMap, originalElementsMap);\n }\n };\n\n const value = Math.round((property === \"width\" ? element.width : element.height) * 100) / 100;\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n label: property === \"width\" ? \"W\" : \"H\",\n elements: [element],\n dragInputCallback: handleDimensionChange,\n value: value,\n editable: (0,_utils__WEBPACK_IMPORTED_MODULE_2__.isPropertyEditable)(element, property)\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (DimensionDragInput);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/Dimension.tsx?");
1775
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../constants */ \"./constants.ts\");\n\n\n\n\nconst STEP_SIZE = 10;\n\nconst _shouldKeepAspectRatio = element => {\n return element.type === \"image\";\n};\n\nconst handleDimensionChange = ({\n accumulatedChange,\n originalElements,\n originalElementsMap,\n shouldKeepAspectRatio,\n shouldChangeByStepSize,\n nextValue,\n property,\n scene\n}) => {\n const elementsMap = scene.getNonDeletedElementsMap();\n const origElement = originalElements[0];\n\n if (origElement) {\n const keepAspectRatio = shouldKeepAspectRatio || _shouldKeepAspectRatio(origElement);\n\n const aspectRatio = origElement.width / origElement.height;\n\n if (nextValue !== undefined) {\n const nextWidth = Math.max(property === \"width\" ? nextValue : keepAspectRatio ? nextValue * aspectRatio : origElement.width, _constants__WEBPACK_IMPORTED_MODULE_3__.MIN_WIDTH_OR_HEIGHT);\n const nextHeight = Math.max(property === \"height\" ? nextValue : keepAspectRatio ? nextValue / aspectRatio : origElement.height, _constants__WEBPACK_IMPORTED_MODULE_3__.MIN_WIDTH_OR_HEIGHT);\n (0,_utils__WEBPACK_IMPORTED_MODULE_2__.resizeElement)(nextWidth, nextHeight, keepAspectRatio, origElement, elementsMap);\n return;\n }\n\n const changeInWidth = property === \"width\" ? accumulatedChange : 0;\n const changeInHeight = property === \"height\" ? accumulatedChange : 0;\n let nextWidth = Math.max(0, origElement.width + changeInWidth);\n\n if (property === \"width\") {\n if (shouldChangeByStepSize) {\n nextWidth = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getStepSizedValue)(nextWidth, STEP_SIZE);\n } else {\n nextWidth = Math.round(nextWidth);\n }\n }\n\n let nextHeight = Math.max(0, origElement.height + changeInHeight);\n\n if (property === \"height\") {\n if (shouldChangeByStepSize) {\n nextHeight = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getStepSizedValue)(nextHeight, STEP_SIZE);\n } else {\n nextHeight = Math.round(nextHeight);\n }\n }\n\n if (keepAspectRatio) {\n if (property === \"width\") {\n nextHeight = Math.round(nextWidth / aspectRatio * 100) / 100;\n } else {\n nextWidth = Math.round(nextHeight * aspectRatio * 100) / 100;\n }\n }\n\n nextHeight = Math.max(_constants__WEBPACK_IMPORTED_MODULE_3__.MIN_WIDTH_OR_HEIGHT, nextHeight);\n nextWidth = Math.max(_constants__WEBPACK_IMPORTED_MODULE_3__.MIN_WIDTH_OR_HEIGHT, nextWidth);\n (0,_utils__WEBPACK_IMPORTED_MODULE_2__.resizeElement)(nextWidth, nextHeight, keepAspectRatio, origElement, elementsMap);\n }\n};\n\nconst DimensionDragInput = ({\n property,\n element,\n scene,\n appState\n}) => {\n const value = Math.round((property === \"width\" ? element.width : element.height) * 100) / 100;\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n label: property === \"width\" ? \"W\" : \"H\",\n elements: [element],\n dragInputCallback: handleDimensionChange,\n value: value,\n editable: (0,_utils__WEBPACK_IMPORTED_MODULE_2__.isPropertyEditable)(element, property),\n scene: scene,\n appState: appState,\n property: property\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (DimensionDragInput);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/Dimension.tsx?");
1776
1776
 
1777
1777
  /***/ }),
1778
1778
 
@@ -1783,7 +1783,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
1783
1783
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
1784
1784
 
1785
1785
  "use strict";
1786
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../constants */ \"./constants.ts\");\n/* harmony import */ var _keys__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../keys */ \"./keys.ts\");\n/* harmony import */ var _element_newElement__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../element/newElement */ \"./element/newElement.ts\");\n/* harmony import */ var _DragInput_scss__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./DragInput.scss */ \"./components/Stats/DragInput.scss\");\n/* harmony import */ var clsx__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! clsx */ \"../../node_modules/clsx/dist/clsx.m.js\");\n/* harmony import */ var _App__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../App */ \"./components/App.tsx\");\n/* harmony import */ var _InlineIcon__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../InlineIcon */ \"./components/InlineIcon.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ \"./store.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\nconst StatsDragInput = ({\n label,\n icon,\n dragInputCallback,\n value,\n elements,\n editable = true,\n shouldKeepAspectRatio\n}) => {\n const app = (0,_App__WEBPACK_IMPORTED_MODULE_7__.useApp)();\n const inputRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);\n const labelRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);\n const [inputValue, setInputValue] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(value.toString());\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {\n setInputValue(value.toString());\n }, [value, elements]);\n\n const handleInputValue = v => {\n const parsed = Number(v);\n\n if (isNaN(parsed)) {\n setInputValue(value.toString());\n return;\n }\n\n const rounded = Number(parsed.toFixed(2));\n const original = Number(value); // only update when\n // 1. original was \"Mixed\" and we have a new value\n // 2. original was not \"Mixed\" and the difference between a new value and previous value is greater\n // than the smallest delta allowed, which is 0.01\n // reason: idempotent to avoid unnecessary\n\n if (isNaN(original) || Math.abs(rounded - original) >= _utils__WEBPACK_IMPORTED_MODULE_9__.SMALLEST_DELTA) {\n dragInputCallback({\n accumulatedChange: 0,\n instantChange: 0,\n originalElements: elements,\n originalElementsMap: app.scene.getNonDeletedElementsMap(),\n shouldKeepAspectRatio: shouldKeepAspectRatio,\n shouldChangeByStepSize: false,\n nextValue: rounded\n });\n app.syncActionResult({\n storeAction: _store__WEBPACK_IMPORTED_MODULE_10__.StoreAction.CAPTURE\n });\n }\n };\n\n const handleInputValueRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(handleInputValue);\n handleInputValueRef.current = handleInputValue; // make sure that clicking on canvas (which umounts the component)\n // updates current input value (blur isn't triggered)\n\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {\n const input = inputRef.current;\n return () => {\n const nextValue = input === null || input === void 0 ? void 0 : input.value;\n\n if (nextValue) {\n handleInputValueRef.current(nextValue);\n }\n };\n }, []);\n return editable ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n className: (0,clsx__WEBPACK_IMPORTED_MODULE_6__[\"default\"])(\"drag-input-container\", !editable && \"disabled\"),\n \"data-testid\": label\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: \"drag-input-label\",\n ref: labelRef,\n onPointerDown: event => {\n if (inputRef.current && editable) {\n let startValue = Number(inputRef.current.value);\n\n if (isNaN(startValue)) {\n startValue = 0;\n }\n\n let lastPointer = null;\n let originalElements = null;\n let originalElementsMap = null;\n let accumulatedChange = null;\n document.body.classList.add(\"excalidraw-cursor-resize\");\n\n const onPointerMove = event => {\n if (!originalElementsMap) {\n originalElementsMap = app.scene.getNonDeletedElements().reduce((acc, element) => {\n acc.set(element.id, (0,_element_newElement__WEBPACK_IMPORTED_MODULE_4__.deepCopyElement)(element));\n return acc;\n }, new Map());\n }\n\n if (!originalElements) {\n originalElements = elements.map(element => originalElementsMap.get(element.id));\n }\n\n if (!accumulatedChange) {\n accumulatedChange = 0;\n }\n\n if (lastPointer && originalElementsMap !== null && accumulatedChange !== null) {\n const instantChange = event.clientX - lastPointer.x;\n accumulatedChange += instantChange;\n dragInputCallback({\n accumulatedChange,\n instantChange,\n originalElements,\n originalElementsMap,\n shouldKeepAspectRatio: shouldKeepAspectRatio,\n shouldChangeByStepSize: event.shiftKey\n });\n }\n\n lastPointer = {\n x: event.clientX,\n y: event.clientY\n };\n };\n\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_2__.EVENT.POINTER_MOVE, onPointerMove, false);\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_2__.EVENT.POINTER_UP, () => {\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_2__.EVENT.POINTER_MOVE, onPointerMove, false);\n app.syncActionResult({\n storeAction: _store__WEBPACK_IMPORTED_MODULE_10__.StoreAction.CAPTURE\n });\n lastPointer = null;\n accumulatedChange = null;\n originalElements = null;\n originalElementsMap = null;\n document.body.classList.remove(\"excalidraw-cursor-resize\");\n }, false);\n }\n },\n onPointerEnter: () => {\n if (labelRef.current) {\n labelRef.current.style.cursor = \"ew-resize\";\n }\n }\n }, {\n children: icon ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_InlineIcon__WEBPACK_IMPORTED_MODULE_8__.InlineIcon, {\n icon: icon\n }) : label\n })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"input\", {\n className: \"drag-input\",\n autoComplete: \"off\",\n spellCheck: \"false\",\n onKeyDown: event => {\n if (editable) {\n const eventTarget = event.target;\n\n if (eventTarget instanceof HTMLInputElement && event.key === _keys__WEBPACK_IMPORTED_MODULE_3__.KEYS.ENTER) {\n handleInputValue(eventTarget.value);\n app.focusContainer();\n }\n }\n },\n ref: inputRef,\n value: inputValue,\n onChange: event => {\n setInputValue(event.target.value);\n },\n onFocus: event => {\n event.target.select();\n },\n onBlur: event => {\n if (!inputValue) {\n setInputValue(value.toString());\n } else if (editable) {\n handleInputValue(event.target.value);\n }\n },\n disabled: !editable\n })]\n })) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {});\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (StatsDragInput);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/DragInput.tsx?");
1786
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../constants */ \"./constants.ts\");\n/* harmony import */ var _keys__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../keys */ \"./keys.ts\");\n/* harmony import */ var _element_newElement__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../element/newElement */ \"./element/newElement.ts\");\n/* harmony import */ var clsx__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! clsx */ \"../../node_modules/clsx/dist/clsx.m.js\");\n/* harmony import */ var _App__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../App */ \"./components/App.tsx\");\n/* harmony import */ var _InlineIcon__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../InlineIcon */ \"./components/InlineIcon.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ \"./store.ts\");\n/* harmony import */ var _DragInput_scss__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./DragInput.scss */ \"./components/Stats/DragInput.scss\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../utils */ \"./utils.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\n\nconst StatsDragInput = ({\n label,\n icon,\n dragInputCallback,\n value,\n elements,\n editable = true,\n shouldKeepAspectRatio,\n property,\n scene,\n appState\n}) => {\n const app = (0,_App__WEBPACK_IMPORTED_MODULE_6__.useApp)();\n const inputRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);\n const labelRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);\n const [inputValue, setInputValue] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(value.toString());\n const stateRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);\n\n if (!stateRef.current) {\n stateRef.current = {\n originalAppState: (0,_utils__WEBPACK_IMPORTED_MODULE_11__.cloneJSON)(appState),\n originalElements: elements,\n lastUpdatedValue: inputValue,\n updatePending: false\n };\n }\n\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {\n const inputValue = value.toString();\n setInputValue(inputValue);\n stateRef.current.lastUpdatedValue = inputValue;\n }, [value]);\n\n const handleInputValue = (updatedValue, elements, appState) => {\n if (!stateRef.current.updatePending) {\n return false;\n }\n\n stateRef.current.updatePending = false;\n const parsed = Number(updatedValue);\n\n if (isNaN(parsed)) {\n setInputValue(value.toString());\n return;\n }\n\n const rounded = Number(parsed.toFixed(2));\n const original = Number(value); // only update when\n // 1. original was \"Mixed\" and we have a new value\n // 2. original was not \"Mixed\" and the difference between a new value and previous value is greater\n // than the smallest delta allowed, which is 0.01\n // reason: idempotent to avoid unnecessary\n\n if (isNaN(original) || Math.abs(rounded - original) >= _utils__WEBPACK_IMPORTED_MODULE_8__.SMALLEST_DELTA) {\n stateRef.current.lastUpdatedValue = updatedValue;\n dragInputCallback({\n accumulatedChange: 0,\n instantChange: 0,\n originalElements: elements,\n originalElementsMap: app.scene.getNonDeletedElementsMap(),\n shouldKeepAspectRatio: shouldKeepAspectRatio,\n shouldChangeByStepSize: false,\n nextValue: rounded,\n property,\n scene,\n originalAppState: appState\n });\n app.syncActionResult({\n storeAction: _store__WEBPACK_IMPORTED_MODULE_9__.StoreAction.CAPTURE\n });\n }\n };\n\n const handleInputValueRef = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(handleInputValue);\n handleInputValueRef.current = handleInputValue; // make sure that clicking on canvas (which umounts the component)\n // updates current input value (blur isn't triggered)\n\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {\n const input = inputRef.current;\n return () => {\n const nextValue = input === null || input === void 0 ? void 0 : input.value;\n\n if (nextValue) {\n handleInputValueRef.current(nextValue, stateRef.current.originalElements, stateRef.current.originalAppState);\n }\n };\n }, [// we need to track change of `editable` state as mount/unmount\n // because react doesn't trigger `blur` when a an input is blurred due\n // to being disabled (https://github.com/facebook/react/issues/9142).\n // As such, if we keep rendering disabled inputs, then change in selection\n // to an element that has a given property as non-editable would not trigger\n // blur/unmount and wouldn't update the value.\n editable]);\n\n if (!editable) {\n return null;\n }\n\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n className: (0,clsx__WEBPACK_IMPORTED_MODULE_5__[\"default\"])(\"drag-input-container\", !editable && \"disabled\"),\n \"data-testid\": label\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: \"drag-input-label\",\n ref: labelRef,\n onPointerDown: event => {\n if (inputRef.current && editable) {\n let startValue = Number(inputRef.current.value);\n\n if (isNaN(startValue)) {\n startValue = 0;\n }\n\n let lastPointer = null;\n let originalElementsMap = app.scene.getNonDeletedElements().reduce((acc, element) => {\n acc.set(element.id, (0,_element_newElement__WEBPACK_IMPORTED_MODULE_4__.deepCopyElement)(element));\n return acc;\n }, new Map());\n let originalElements = elements.map(element => originalElementsMap.get(element.id));\n const originalAppState = (0,_utils__WEBPACK_IMPORTED_MODULE_11__.cloneJSON)(appState);\n let accumulatedChange = null;\n document.body.classList.add(\"excalidraw-cursor-resize\");\n\n const onPointerMove = event => {\n if (!accumulatedChange) {\n accumulatedChange = 0;\n }\n\n if (lastPointer && originalElementsMap !== null && originalElements !== null && accumulatedChange !== null) {\n const instantChange = event.clientX - lastPointer.x;\n accumulatedChange += instantChange;\n dragInputCallback({\n accumulatedChange,\n instantChange,\n originalElements,\n originalElementsMap,\n shouldKeepAspectRatio: shouldKeepAspectRatio,\n shouldChangeByStepSize: event.shiftKey,\n property,\n scene,\n originalAppState\n });\n }\n\n lastPointer = {\n x: event.clientX,\n y: event.clientY\n };\n };\n\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_2__.EVENT.POINTER_MOVE, onPointerMove, false);\n window.addEventListener(_constants__WEBPACK_IMPORTED_MODULE_2__.EVENT.POINTER_UP, () => {\n window.removeEventListener(_constants__WEBPACK_IMPORTED_MODULE_2__.EVENT.POINTER_MOVE, onPointerMove, false);\n app.syncActionResult({\n storeAction: _store__WEBPACK_IMPORTED_MODULE_9__.StoreAction.CAPTURE\n });\n lastPointer = null;\n accumulatedChange = null;\n originalElements = null;\n originalElementsMap = null;\n document.body.classList.remove(\"excalidraw-cursor-resize\");\n }, false);\n }\n },\n onPointerEnter: () => {\n if (labelRef.current) {\n labelRef.current.style.cursor = \"ew-resize\";\n }\n }\n }, {\n children: icon ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_InlineIcon__WEBPACK_IMPORTED_MODULE_7__.InlineIcon, {\n icon: icon\n }) : label\n })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"input\", {\n className: \"drag-input\",\n autoComplete: \"off\",\n spellCheck: \"false\",\n onKeyDown: event => {\n if (editable) {\n const eventTarget = event.target;\n\n if (eventTarget instanceof HTMLInputElement && event.key === _keys__WEBPACK_IMPORTED_MODULE_3__.KEYS.ENTER) {\n handleInputValue(eventTarget.value, elements, appState);\n app.focusContainer();\n }\n }\n },\n ref: inputRef,\n value: inputValue,\n onChange: event => {\n stateRef.current.updatePending = true;\n setInputValue(event.target.value);\n },\n onFocus: event => {\n event.target.select();\n stateRef.current.originalElements = elements;\n stateRef.current.originalAppState = (0,_utils__WEBPACK_IMPORTED_MODULE_11__.cloneJSON)(appState);\n },\n onBlur: event => {\n if (!inputValue) {\n setInputValue(value.toString());\n } else if (editable) {\n handleInputValue(event.target.value, stateRef.current.originalElements, stateRef.current.originalAppState);\n }\n },\n disabled: !editable\n })]\n }));\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (StatsDragInput);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/DragInput.tsx?");
1787
1787
 
1788
1788
  /***/ }),
1789
1789
 
@@ -1794,7 +1794,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
1794
1794
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
1795
1795
 
1796
1796
  "use strict";
1797
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _element_newElement__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../element/newElement */ \"./element/newElement.ts\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n/* harmony import */ var _icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../icons */ \"./components/icons.tsx\");\n\n\n\n\n\n\nconst MIN_FONT_SIZE = 4;\nconst STEP_SIZE = 4;\n\nconst FontSize = ({\n element,\n elementsMap\n}) => {\n const handleFontSizeChange = ({\n accumulatedChange,\n originalElements,\n shouldChangeByStepSize,\n nextValue\n }) => {\n const origElement = originalElements[0];\n\n if (origElement) {\n if (nextValue !== undefined) {\n const nextFontSize = Math.max(Math.round(nextValue), MIN_FONT_SIZE);\n const newElement = Object.assign(Object.assign({}, element), {\n fontSize: nextFontSize\n });\n const updates = (0,_element_newElement__WEBPACK_IMPORTED_MODULE_1__.refreshTextDimensions)(newElement, null, elementsMap);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_3__.mutateElement)(element, Object.assign(Object.assign({}, updates), {\n fontSize: nextFontSize\n }));\n return;\n }\n\n if (origElement.type === \"text\") {\n const originalFontSize = Math.round(origElement.fontSize);\n const changeInFontSize = Math.round(accumulatedChange);\n let nextFontSize = Math.max(originalFontSize + changeInFontSize, MIN_FONT_SIZE);\n\n if (shouldChangeByStepSize) {\n nextFontSize = (0,_utils__WEBPACK_IMPORTED_MODULE_4__.getStepSizedValue)(nextFontSize, STEP_SIZE);\n }\n\n const newElement = Object.assign(Object.assign({}, element), {\n fontSize: nextFontSize\n });\n const updates = (0,_element_newElement__WEBPACK_IMPORTED_MODULE_1__.refreshTextDimensions)(newElement, null, elementsMap);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_3__.mutateElement)(element, Object.assign(Object.assign({}, updates), {\n fontSize: nextFontSize\n }));\n }\n }\n };\n\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n label: \"F\",\n value: Math.round(element.fontSize * 10) / 10,\n elements: [element],\n dragInputCallback: handleFontSizeChange,\n icon: _icons__WEBPACK_IMPORTED_MODULE_5__.fontSizeIcon\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FontSize);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/FontSize.tsx?");
1797
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n/* harmony import */ var _icons__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../icons */ \"./components/icons.tsx\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../element */ \"./element/index.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../element/textElement */ \"./element/textElement.ts\");\n\n\n\n\n\n\n\n\nconst MIN_FONT_SIZE = 4;\nconst STEP_SIZE = 4;\n\nconst handleFontSizeChange = ({\n accumulatedChange,\n originalElements,\n shouldChangeByStepSize,\n nextValue,\n scene\n}) => {\n const elementsMap = scene.getNonDeletedElementsMap();\n const origElement = originalElements[0];\n\n if (origElement) {\n const latestElement = elementsMap.get(origElement.id);\n\n if (!latestElement || !(0,_element__WEBPACK_IMPORTED_MODULE_5__.isTextElement)(latestElement)) {\n return;\n }\n\n let nextFontSize;\n\n if (nextValue !== undefined) {\n nextFontSize = Math.max(Math.round(nextValue), MIN_FONT_SIZE);\n } else if (origElement.type === \"text\") {\n const originalFontSize = Math.round(origElement.fontSize);\n const changeInFontSize = Math.round(accumulatedChange);\n nextFontSize = Math.max(originalFontSize + changeInFontSize, MIN_FONT_SIZE);\n\n if (shouldChangeByStepSize) {\n nextFontSize = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getStepSizedValue)(nextFontSize, STEP_SIZE);\n }\n }\n\n if (nextFontSize) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_2__.mutateElement)(latestElement, {\n fontSize: nextFontSize\n });\n (0,_element__WEBPACK_IMPORTED_MODULE_5__.redrawTextBoundingBox)(latestElement, scene.getContainerElement(latestElement), scene.getNonDeletedElementsMap());\n }\n }\n};\n\nconst FontSize = ({\n element,\n scene,\n appState,\n property\n}) => {\n const _element = (0,_element__WEBPACK_IMPORTED_MODULE_5__.isTextElement)(element) ? element : (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_6__.hasBoundTextElement)(element) ? (0,_element_textElement__WEBPACK_IMPORTED_MODULE_7__.getBoundTextElement)(element, scene.getNonDeletedElementsMap()) : null;\n\n if (!_element) {\n return null;\n }\n\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n label: \"F\",\n value: Math.round(_element.fontSize * 10) / 10,\n elements: [_element],\n dragInputCallback: handleFontSizeChange,\n icon: _icons__WEBPACK_IMPORTED_MODULE_4__.fontSizeIcon,\n appState: appState,\n scene: scene,\n property: property\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FontSize);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/FontSize.tsx?");
1798
1798
 
1799
1799
  /***/ }),
1800
1800
 
@@ -1805,7 +1805,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
1805
1805
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
1806
1806
 
1807
1807
  "use strict";
1808
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _groups__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../groups */ \"./groups.ts\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../math */ \"./math.ts\");\n/* harmony import */ var _icons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../icons */ \"./components/icons.tsx\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n\n\n\n\n\n\n\n\n\nconst STEP_SIZE = 15;\n\nconst MultiAngle = ({\n elements,\n elementsMap,\n scene\n}) => {\n const handleDegreeChange = ({\n accumulatedChange,\n originalElements,\n shouldChangeByStepSize,\n nextValue\n }) => {\n const editableLatestIndividualElements = elements.filter(el => !(0,_groups__WEBPACK_IMPORTED_MODULE_4__.isInGroup)(el) && (0,_utils__WEBPACK_IMPORTED_MODULE_8__.isPropertyEditable)(el, \"angle\"));\n const editableOriginalIndividualElements = originalElements.filter(el => !(0,_groups__WEBPACK_IMPORTED_MODULE_4__.isInGroup)(el) && (0,_utils__WEBPACK_IMPORTED_MODULE_8__.isPropertyEditable)(el, \"angle\"));\n\n if (nextValue !== undefined) {\n const nextAngle = (0,_math__WEBPACK_IMPORTED_MODULE_5__.degreeToRadian)(nextValue);\n\n for (const element of editableLatestIndividualElements) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(element, {\n angle: nextAngle\n }, false);\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_2__.getBoundTextElement)(element, elementsMap);\n\n if (boundTextElement && !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_3__.isArrowElement)(element)) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(boundTextElement, {\n angle: nextAngle\n }, false);\n }\n }\n\n scene.triggerUpdate();\n return;\n }\n\n for (let i = 0; i < editableLatestIndividualElements.length; i++) {\n const latestElement = editableLatestIndividualElements[i];\n const originalElement = editableOriginalIndividualElements[i];\n const originalAngleInDegrees = Math.round((0,_math__WEBPACK_IMPORTED_MODULE_5__.radianToDegree)(originalElement.angle) * 100) / 100;\n const changeInDegrees = Math.round(accumulatedChange);\n let nextAngleInDegrees = (originalAngleInDegrees + changeInDegrees) % 360;\n\n if (shouldChangeByStepSize) {\n nextAngleInDegrees = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getStepSizedValue)(nextAngleInDegrees, STEP_SIZE);\n }\n\n nextAngleInDegrees = nextAngleInDegrees < 0 ? nextAngleInDegrees + 360 : nextAngleInDegrees;\n const nextAngle = (0,_math__WEBPACK_IMPORTED_MODULE_5__.degreeToRadian)(nextAngleInDegrees);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(latestElement, {\n angle: nextAngle\n }, false);\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_2__.getBoundTextElement)(latestElement, elementsMap);\n\n if (boundTextElement && !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_3__.isArrowElement)(latestElement)) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(boundTextElement, {\n angle: nextAngle\n }, false);\n }\n }\n\n scene.triggerUpdate();\n };\n\n const editableLatestIndividualElements = elements.filter(el => !(0,_groups__WEBPACK_IMPORTED_MODULE_4__.isInGroup)(el) && (0,_utils__WEBPACK_IMPORTED_MODULE_8__.isPropertyEditable)(el, \"angle\"));\n const angles = editableLatestIndividualElements.map(el => Math.round((0,_math__WEBPACK_IMPORTED_MODULE_5__.radianToDegree)(el.angle) % 360 * 100) / 100);\n const value = new Set(angles).size === 1 ? angles[0] : \"Mixed\";\n const editable = editableLatestIndividualElements.some(el => (0,_utils__WEBPACK_IMPORTED_MODULE_8__.isPropertyEditable)(el, \"angle\"));\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n label: \"A\",\n icon: _icons__WEBPACK_IMPORTED_MODULE_6__.angleIcon,\n value: value,\n elements: elements,\n dragInputCallback: handleDegreeChange,\n editable: editable\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MultiAngle);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/MultiAngle.tsx?");
1808
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _groups__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../groups */ \"./groups.ts\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../math */ \"./math.ts\");\n/* harmony import */ var _icons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../icons */ \"./components/icons.tsx\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n\n\n\n\n\n\n\n\n\nconst STEP_SIZE = 15;\n\nconst handleDegreeChange = ({\n accumulatedChange,\n originalElements,\n shouldChangeByStepSize,\n nextValue,\n property,\n scene\n}) => {\n const elementsMap = scene.getNonDeletedElementsMap();\n const editableLatestIndividualElements = originalElements.map(el => elementsMap.get(el.id)).filter(el => el && !(0,_groups__WEBPACK_IMPORTED_MODULE_4__.isInGroup)(el) && (0,_utils__WEBPACK_IMPORTED_MODULE_8__.isPropertyEditable)(el, property));\n const editableOriginalIndividualElements = originalElements.filter(el => !(0,_groups__WEBPACK_IMPORTED_MODULE_4__.isInGroup)(el) && (0,_utils__WEBPACK_IMPORTED_MODULE_8__.isPropertyEditable)(el, property));\n\n if (nextValue !== undefined) {\n const nextAngle = (0,_math__WEBPACK_IMPORTED_MODULE_5__.degreeToRadian)(nextValue);\n\n for (const element of editableLatestIndividualElements) {\n if (!element) {\n continue;\n }\n\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(element, {\n angle: nextAngle\n }, false);\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_2__.getBoundTextElement)(element, elementsMap);\n\n if (boundTextElement && !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_3__.isArrowElement)(element)) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(boundTextElement, {\n angle: nextAngle\n }, false);\n }\n }\n\n scene.triggerUpdate();\n return;\n }\n\n for (let i = 0; i < editableLatestIndividualElements.length; i++) {\n const latestElement = editableLatestIndividualElements[i];\n\n if (!latestElement) {\n continue;\n }\n\n const originalElement = editableOriginalIndividualElements[i];\n const originalAngleInDegrees = Math.round((0,_math__WEBPACK_IMPORTED_MODULE_5__.radianToDegree)(originalElement.angle) * 100) / 100;\n const changeInDegrees = Math.round(accumulatedChange);\n let nextAngleInDegrees = (originalAngleInDegrees + changeInDegrees) % 360;\n\n if (shouldChangeByStepSize) {\n nextAngleInDegrees = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getStepSizedValue)(nextAngleInDegrees, STEP_SIZE);\n }\n\n nextAngleInDegrees = nextAngleInDegrees < 0 ? nextAngleInDegrees + 360 : nextAngleInDegrees;\n const nextAngle = (0,_math__WEBPACK_IMPORTED_MODULE_5__.degreeToRadian)(nextAngleInDegrees);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(latestElement, {\n angle: nextAngle\n }, false);\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_2__.getBoundTextElement)(latestElement, elementsMap);\n\n if (boundTextElement && !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_3__.isArrowElement)(latestElement)) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(boundTextElement, {\n angle: nextAngle\n }, false);\n }\n }\n\n scene.triggerUpdate();\n};\n\nconst MultiAngle = ({\n elements,\n scene,\n appState,\n property\n}) => {\n const editableLatestIndividualElements = elements.filter(el => !(0,_groups__WEBPACK_IMPORTED_MODULE_4__.isInGroup)(el) && (0,_utils__WEBPACK_IMPORTED_MODULE_8__.isPropertyEditable)(el, \"angle\"));\n const angles = editableLatestIndividualElements.map(el => Math.round((0,_math__WEBPACK_IMPORTED_MODULE_5__.radianToDegree)(el.angle) % 360 * 100) / 100);\n const value = new Set(angles).size === 1 ? angles[0] : \"Mixed\";\n const editable = editableLatestIndividualElements.some(el => (0,_utils__WEBPACK_IMPORTED_MODULE_8__.isPropertyEditable)(el, \"angle\"));\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n label: \"A\",\n icon: _icons__WEBPACK_IMPORTED_MODULE_6__.angleIcon,\n value: value,\n elements: elements,\n dragInputCallback: handleDegreeChange,\n editable: editable,\n appState: appState,\n scene: scene,\n property: property\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MultiAngle);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/MultiAngle.tsx?");
1809
1809
 
1810
1810
  /***/ }),
1811
1811
 
@@ -1816,7 +1816,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
1816
1816
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
1817
1817
 
1818
1818
  "use strict";
1819
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../element */ \"./element/index.ts\");\n/* harmony import */ var _element_binding__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../element/binding */ \"./element/binding.ts\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _element_resizeElements__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../element/resizeElements */ \"./element/resizeElements.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../constants */ \"./constants.ts\");\n\n\n\n\n\n\n\n\n\n\n\nconst STEP_SIZE = 10;\n\nconst getResizedUpdates = (anchorX, anchorY, scale, origElement) => {\n const offsetX = origElement.x - anchorX;\n const offsetY = origElement.y - anchorY;\n const nextWidth = origElement.width * scale;\n const nextHeight = origElement.height * scale;\n const x = anchorX + offsetX * scale;\n const y = anchorY + offsetY * scale;\n return Object.assign(Object.assign({\n width: nextWidth,\n height: nextHeight,\n x,\n y\n }, (0,_element_resizeElements__WEBPACK_IMPORTED_MODULE_5__.rescalePointsInElement)(origElement, nextWidth, nextHeight, false)), (0,_element__WEBPACK_IMPORTED_MODULE_2__.isTextElement)(origElement) ? {\n fontSize: origElement.fontSize * scale\n } : {});\n};\n\nconst resizeElementInGroup = (anchorX, anchorY, property, scale, latestElement, origElement, elementsMap, originalElementsMap) => {\n const updates = getResizedUpdates(anchorX, anchorY, scale, origElement);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_4__.mutateElement)(latestElement, updates, false);\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_6__.getBoundTextElement)(origElement, originalElementsMap);\n\n if (boundTextElement) {\n const newFontSize = boundTextElement.fontSize * scale;\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_3__.updateBoundElements)(latestElement, elementsMap, {\n newSize: {\n width: updates.width,\n height: updates.height\n }\n });\n const latestBoundTextElement = elementsMap.get(boundTextElement.id);\n\n if (latestBoundTextElement && (0,_element__WEBPACK_IMPORTED_MODULE_2__.isTextElement)(latestBoundTextElement)) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_4__.mutateElement)(latestBoundTextElement, {\n fontSize: newFontSize\n }, false);\n (0,_element_textElement__WEBPACK_IMPORTED_MODULE_6__.handleBindTextResize)(latestElement, elementsMap, property === \"width\" ? \"e\" : \"s\", true);\n }\n }\n};\n\nconst resizeGroup = (nextWidth, nextHeight, initialHeight, aspectRatio, anchor, property, latestElements, originalElements, elementsMap, originalElementsMap) => {\n // keep aspect ratio for groups\n if (property === \"width\") {\n nextHeight = Math.round(nextWidth / aspectRatio * 100) / 100;\n } else {\n nextWidth = Math.round(nextHeight * aspectRatio * 100) / 100;\n }\n\n const scale = nextHeight / initialHeight;\n\n for (let i = 0; i < originalElements.length; i++) {\n const origElement = originalElements[i];\n const latestElement = latestElements[i];\n resizeElementInGroup(anchor[0], anchor[1], property, scale, latestElement, origElement, elementsMap, originalElementsMap);\n }\n};\n\nconst MultiDimension = ({\n property,\n elements,\n elementsMap,\n atomicUnits,\n scene\n}) => {\n const sizes = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(() => atomicUnits.map(atomicUnit => {\n const elementsInUnit = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getElementsInAtomicUnit)(atomicUnit, elementsMap);\n\n if (elementsInUnit.length > 1) {\n const [x1, y1, x2, y2] = (0,_element__WEBPACK_IMPORTED_MODULE_2__.getCommonBounds)(elementsInUnit.map(el => el.latest));\n return Math.round((property === \"width\" ? x2 - x1 : y2 - y1) * 100) / 100;\n }\n\n const [el] = elementsInUnit;\n return Math.round((property === \"width\" ? el.latest.width : el.latest.height) * 100) / 100;\n }), [elementsMap, atomicUnits, property]);\n const value = new Set(sizes).size === 1 ? Math.round(sizes[0] * 100) / 100 : \"Mixed\";\n const editable = sizes.length > 0;\n\n const handleDimensionChange = ({\n accumulatedChange,\n originalElementsMap,\n shouldChangeByStepSize,\n nextValue\n }) => {\n if (nextValue !== undefined) {\n for (const atomicUnit of atomicUnits) {\n const elementsInUnit = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getElementsInAtomicUnit)(atomicUnit, elementsMap, originalElementsMap);\n\n if (elementsInUnit.length > 1) {\n const latestElements = elementsInUnit.map(el => el.latest);\n const originalElements = elementsInUnit.map(el => el.original);\n const [x1, y1, x2, y2] = (0,_element__WEBPACK_IMPORTED_MODULE_2__.getCommonBounds)(originalElements);\n const initialWidth = x2 - x1;\n const initialHeight = y2 - y1;\n const aspectRatio = initialWidth / initialHeight;\n const nextWidth = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, property === \"width\" ? Math.max(0, nextValue) : initialWidth);\n const nextHeight = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, property === \"height\" ? Math.max(0, nextValue) : initialHeight);\n resizeGroup(nextWidth, nextHeight, initialHeight, aspectRatio, [x1, y1], property, latestElements, originalElements, elementsMap, originalElementsMap);\n } else {\n const [el] = elementsInUnit;\n const latestElement = el === null || el === void 0 ? void 0 : el.latest;\n const origElement = el === null || el === void 0 ? void 0 : el.original;\n\n if (latestElement && origElement && (0,_utils__WEBPACK_IMPORTED_MODULE_8__.isPropertyEditable)(latestElement, property)) {\n let nextWidth = property === \"width\" ? Math.max(0, nextValue) : latestElement.width;\n\n if (property === \"width\") {\n if (shouldChangeByStepSize) {\n nextWidth = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getStepSizedValue)(nextWidth, STEP_SIZE);\n } else {\n nextWidth = Math.round(nextWidth);\n }\n }\n\n let nextHeight = property === \"height\" ? Math.max(0, nextValue) : latestElement.height;\n\n if (property === \"height\") {\n if (shouldChangeByStepSize) {\n nextHeight = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getStepSizedValue)(nextHeight, STEP_SIZE);\n } else {\n nextHeight = Math.round(nextHeight);\n }\n }\n\n nextWidth = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, nextWidth);\n nextHeight = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, nextHeight);\n (0,_utils__WEBPACK_IMPORTED_MODULE_8__.resizeElement)(nextWidth, nextHeight, false, latestElement, origElement, elementsMap, originalElementsMap, false);\n }\n }\n }\n\n scene.triggerUpdate();\n return;\n }\n\n const changeInWidth = property === \"width\" ? accumulatedChange : 0;\n const changeInHeight = property === \"height\" ? accumulatedChange : 0;\n\n for (const atomicUnit of atomicUnits) {\n const elementsInUnit = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getElementsInAtomicUnit)(atomicUnit, elementsMap, originalElementsMap);\n\n if (elementsInUnit.length > 1) {\n const latestElements = elementsInUnit.map(el => el.latest);\n const originalElements = elementsInUnit.map(el => el.original);\n const [x1, y1, x2, y2] = (0,_element__WEBPACK_IMPORTED_MODULE_2__.getCommonBounds)(originalElements);\n const initialWidth = x2 - x1;\n const initialHeight = y2 - y1;\n const aspectRatio = initialWidth / initialHeight;\n let nextWidth = Math.max(0, initialWidth + changeInWidth);\n\n if (property === \"width\") {\n if (shouldChangeByStepSize) {\n nextWidth = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getStepSizedValue)(nextWidth, STEP_SIZE);\n } else {\n nextWidth = Math.round(nextWidth);\n }\n }\n\n let nextHeight = Math.max(0, initialHeight + changeInHeight);\n\n if (property === \"height\") {\n if (shouldChangeByStepSize) {\n nextHeight = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getStepSizedValue)(nextHeight, STEP_SIZE);\n } else {\n nextHeight = Math.round(nextHeight);\n }\n }\n\n nextWidth = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, nextWidth);\n nextHeight = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, nextHeight);\n resizeGroup(nextWidth, nextHeight, initialHeight, aspectRatio, [x1, y1], property, latestElements, originalElements, elementsMap, originalElementsMap);\n } else {\n const [el] = elementsInUnit;\n const latestElement = el === null || el === void 0 ? void 0 : el.latest;\n const origElement = el === null || el === void 0 ? void 0 : el.original;\n\n if (latestElement && origElement && (0,_utils__WEBPACK_IMPORTED_MODULE_8__.isPropertyEditable)(latestElement, property)) {\n let nextWidth = Math.max(0, origElement.width + changeInWidth);\n\n if (property === \"width\") {\n if (shouldChangeByStepSize) {\n nextWidth = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getStepSizedValue)(nextWidth, STEP_SIZE);\n } else {\n nextWidth = Math.round(nextWidth);\n }\n }\n\n let nextHeight = Math.max(0, origElement.height + changeInHeight);\n\n if (property === \"height\") {\n if (shouldChangeByStepSize) {\n nextHeight = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getStepSizedValue)(nextHeight, STEP_SIZE);\n } else {\n nextHeight = Math.round(nextHeight);\n }\n }\n\n nextWidth = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, nextWidth);\n nextHeight = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, nextHeight);\n (0,_utils__WEBPACK_IMPORTED_MODULE_8__.resizeElement)(nextWidth, nextHeight, false, latestElement, origElement, elementsMap, originalElementsMap);\n }\n }\n }\n\n scene.triggerUpdate();\n };\n\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n label: property === \"width\" ? \"W\" : \"H\",\n elements: elements,\n dragInputCallback: handleDimensionChange,\n value: value,\n editable: editable\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MultiDimension);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/MultiDimension.tsx?");
1819
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../element */ \"./element/index.ts\");\n/* harmony import */ var _element_binding__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../element/binding */ \"./element/binding.ts\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _element_resizeElements__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../element/resizeElements */ \"./element/resizeElements.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../constants */ \"./constants.ts\");\n\n\n\n\n\n\n\n\n\n\n\nconst STEP_SIZE = 10;\n\nconst getResizedUpdates = (anchorX, anchorY, scale, origElement) => {\n const offsetX = origElement.x - anchorX;\n const offsetY = origElement.y - anchorY;\n const nextWidth = origElement.width * scale;\n const nextHeight = origElement.height * scale;\n const x = anchorX + offsetX * scale;\n const y = anchorY + offsetY * scale;\n return Object.assign(Object.assign({\n width: nextWidth,\n height: nextHeight,\n x,\n y\n }, (0,_element_resizeElements__WEBPACK_IMPORTED_MODULE_5__.rescalePointsInElement)(origElement, nextWidth, nextHeight, false)), (0,_element__WEBPACK_IMPORTED_MODULE_2__.isTextElement)(origElement) ? {\n fontSize: origElement.fontSize * scale\n } : {});\n};\n\nconst resizeElementInGroup = (anchorX, anchorY, property, scale, latestElement, origElement, elementsMap, originalElementsMap) => {\n const updates = getResizedUpdates(anchorX, anchorY, scale, origElement);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_4__.mutateElement)(latestElement, updates, false);\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_6__.getBoundTextElement)(origElement, originalElementsMap);\n\n if (boundTextElement) {\n const newFontSize = boundTextElement.fontSize * scale;\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_3__.updateBoundElements)(latestElement, elementsMap, {\n newSize: {\n width: updates.width,\n height: updates.height\n }\n });\n const latestBoundTextElement = elementsMap.get(boundTextElement.id);\n\n if (latestBoundTextElement && (0,_element__WEBPACK_IMPORTED_MODULE_2__.isTextElement)(latestBoundTextElement)) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_4__.mutateElement)(latestBoundTextElement, {\n fontSize: newFontSize\n }, false);\n (0,_element_textElement__WEBPACK_IMPORTED_MODULE_6__.handleBindTextResize)(latestElement, elementsMap, property === \"width\" ? \"e\" : \"s\", true);\n }\n }\n};\n\nconst resizeGroup = (nextWidth, nextHeight, initialHeight, aspectRatio, anchor, property, latestElements, originalElements, elementsMap, originalElementsMap) => {\n // keep aspect ratio for groups\n if (property === \"width\") {\n nextHeight = Math.round(nextWidth / aspectRatio * 100) / 100;\n } else {\n nextWidth = Math.round(nextHeight * aspectRatio * 100) / 100;\n }\n\n const scale = nextHeight / initialHeight;\n\n for (let i = 0; i < originalElements.length; i++) {\n const origElement = originalElements[i];\n const latestElement = latestElements[i];\n resizeElementInGroup(anchor[0], anchor[1], property, scale, latestElement, origElement, elementsMap, originalElementsMap);\n }\n};\n\nconst handleDimensionChange = ({\n accumulatedChange,\n originalElements,\n originalElementsMap,\n originalAppState,\n shouldChangeByStepSize,\n nextValue,\n scene,\n property\n}) => {\n const elementsMap = scene.getNonDeletedElementsMap();\n const atomicUnits = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getAtomicUnits)(originalElements, originalAppState);\n\n if (nextValue !== undefined) {\n for (const atomicUnit of atomicUnits) {\n const elementsInUnit = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getElementsInAtomicUnit)(atomicUnit, elementsMap, originalElementsMap);\n\n if (elementsInUnit.length > 1) {\n const latestElements = elementsInUnit.map(el => el.latest);\n const originalElements = elementsInUnit.map(el => el.original);\n const [x1, y1, x2, y2] = (0,_element__WEBPACK_IMPORTED_MODULE_2__.getCommonBounds)(originalElements);\n const initialWidth = x2 - x1;\n const initialHeight = y2 - y1;\n const aspectRatio = initialWidth / initialHeight;\n const nextWidth = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, property === \"width\" ? Math.max(0, nextValue) : initialWidth);\n const nextHeight = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, property === \"height\" ? Math.max(0, nextValue) : initialHeight);\n resizeGroup(nextWidth, nextHeight, initialHeight, aspectRatio, [x1, y1], property, latestElements, originalElements, elementsMap, originalElementsMap);\n } else {\n const [el] = elementsInUnit;\n const latestElement = el === null || el === void 0 ? void 0 : el.latest;\n const origElement = el === null || el === void 0 ? void 0 : el.original;\n\n if (latestElement && origElement && (0,_utils__WEBPACK_IMPORTED_MODULE_8__.isPropertyEditable)(latestElement, property)) {\n let nextWidth = property === \"width\" ? Math.max(0, nextValue) : latestElement.width;\n\n if (property === \"width\") {\n if (shouldChangeByStepSize) {\n nextWidth = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getStepSizedValue)(nextWidth, STEP_SIZE);\n } else {\n nextWidth = Math.round(nextWidth);\n }\n }\n\n let nextHeight = property === \"height\" ? Math.max(0, nextValue) : latestElement.height;\n\n if (property === \"height\") {\n if (shouldChangeByStepSize) {\n nextHeight = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getStepSizedValue)(nextHeight, STEP_SIZE);\n } else {\n nextHeight = Math.round(nextHeight);\n }\n }\n\n nextWidth = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, nextWidth);\n nextHeight = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, nextHeight);\n (0,_utils__WEBPACK_IMPORTED_MODULE_8__.resizeElement)(nextWidth, nextHeight, false, origElement, elementsMap, false);\n }\n }\n }\n\n scene.triggerUpdate();\n return;\n }\n\n const changeInWidth = property === \"width\" ? accumulatedChange : 0;\n const changeInHeight = property === \"height\" ? accumulatedChange : 0;\n\n for (const atomicUnit of atomicUnits) {\n const elementsInUnit = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getElementsInAtomicUnit)(atomicUnit, elementsMap, originalElementsMap);\n\n if (elementsInUnit.length > 1) {\n const latestElements = elementsInUnit.map(el => el.latest);\n const originalElements = elementsInUnit.map(el => el.original);\n const [x1, y1, x2, y2] = (0,_element__WEBPACK_IMPORTED_MODULE_2__.getCommonBounds)(originalElements);\n const initialWidth = x2 - x1;\n const initialHeight = y2 - y1;\n const aspectRatio = initialWidth / initialHeight;\n let nextWidth = Math.max(0, initialWidth + changeInWidth);\n\n if (property === \"width\") {\n if (shouldChangeByStepSize) {\n nextWidth = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getStepSizedValue)(nextWidth, STEP_SIZE);\n } else {\n nextWidth = Math.round(nextWidth);\n }\n }\n\n let nextHeight = Math.max(0, initialHeight + changeInHeight);\n\n if (property === \"height\") {\n if (shouldChangeByStepSize) {\n nextHeight = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getStepSizedValue)(nextHeight, STEP_SIZE);\n } else {\n nextHeight = Math.round(nextHeight);\n }\n }\n\n nextWidth = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, nextWidth);\n nextHeight = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, nextHeight);\n resizeGroup(nextWidth, nextHeight, initialHeight, aspectRatio, [x1, y1], property, latestElements, originalElements, elementsMap, originalElementsMap);\n } else {\n const [el] = elementsInUnit;\n const latestElement = el === null || el === void 0 ? void 0 : el.latest;\n const origElement = el === null || el === void 0 ? void 0 : el.original;\n\n if (latestElement && origElement && (0,_utils__WEBPACK_IMPORTED_MODULE_8__.isPropertyEditable)(latestElement, property)) {\n let nextWidth = Math.max(0, origElement.width + changeInWidth);\n\n if (property === \"width\") {\n if (shouldChangeByStepSize) {\n nextWidth = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getStepSizedValue)(nextWidth, STEP_SIZE);\n } else {\n nextWidth = Math.round(nextWidth);\n }\n }\n\n let nextHeight = Math.max(0, origElement.height + changeInHeight);\n\n if (property === \"height\") {\n if (shouldChangeByStepSize) {\n nextHeight = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getStepSizedValue)(nextHeight, STEP_SIZE);\n } else {\n nextHeight = Math.round(nextHeight);\n }\n }\n\n nextWidth = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, nextWidth);\n nextHeight = Math.max(_constants__WEBPACK_IMPORTED_MODULE_9__.MIN_WIDTH_OR_HEIGHT, nextHeight);\n (0,_utils__WEBPACK_IMPORTED_MODULE_8__.resizeElement)(nextWidth, nextHeight, false, origElement, elementsMap);\n }\n }\n }\n\n scene.triggerUpdate();\n};\n\nconst MultiDimension = ({\n property,\n elements,\n elementsMap,\n atomicUnits,\n scene,\n appState\n}) => {\n const sizes = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(() => atomicUnits.map(atomicUnit => {\n const elementsInUnit = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getElementsInAtomicUnit)(atomicUnit, elementsMap);\n\n if (elementsInUnit.length > 1) {\n const [x1, y1, x2, y2] = (0,_element__WEBPACK_IMPORTED_MODULE_2__.getCommonBounds)(elementsInUnit.map(el => el.latest));\n return Math.round((property === \"width\" ? x2 - x1 : y2 - y1) * 100) / 100;\n }\n\n const [el] = elementsInUnit;\n return Math.round((property === \"width\" ? el.latest.width : el.latest.height) * 100) / 100;\n }), [elementsMap, atomicUnits, property]);\n const value = new Set(sizes).size === 1 ? Math.round(sizes[0] * 100) / 100 : \"Mixed\";\n const editable = sizes.length > 0;\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n label: property === \"width\" ? \"W\" : \"H\",\n elements: elements,\n dragInputCallback: handleDimensionChange,\n value: value,\n editable: editable,\n appState: appState,\n property: property,\n scene: scene\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MultiDimension);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/MultiDimension.tsx?");
1820
1820
 
1821
1821
  /***/ }),
1822
1822
 
@@ -1827,7 +1827,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
1827
1827
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
1828
1828
 
1829
1829
  "use strict";
1830
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../element */ \"./element/index.ts\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _groups__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../groups */ \"./groups.ts\");\n/* harmony import */ var _icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../icons */ \"./components/icons.tsx\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n\n\n\n\n\n\n\n\nconst MIN_FONT_SIZE = 4;\nconst STEP_SIZE = 4;\n\nconst MultiFontSize = ({\n elements,\n elementsMap,\n scene\n}) => {\n const latestTextElements = elements.filter(el => !(0,_groups__WEBPACK_IMPORTED_MODULE_4__.isInGroup)(el) && (0,_element__WEBPACK_IMPORTED_MODULE_1__.isTextElement)(el) && !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_3__.isBoundToContainer)(el));\n const fontSizes = latestTextElements.map(textEl => Math.round(textEl.fontSize * 10) / 10);\n const value = new Set(fontSizes).size === 1 ? fontSizes[0] : \"Mixed\";\n const editable = fontSizes.length > 0;\n\n const handleFontSizeChange = ({\n accumulatedChange,\n originalElements,\n shouldChangeByStepSize,\n nextValue\n }) => {\n if (nextValue) {\n const nextFontSize = Math.max(Math.round(nextValue), MIN_FONT_SIZE);\n\n for (const textElement of latestTextElements) {\n const newElement = Object.assign(Object.assign({}, textElement), {\n fontSize: nextFontSize\n });\n const updates = (0,_element__WEBPACK_IMPORTED_MODULE_1__.refreshTextDimensions)(newElement, null, elementsMap);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_2__.mutateElement)(textElement, Object.assign(Object.assign({}, updates), {\n fontSize: nextFontSize\n }), false);\n }\n\n scene.triggerUpdate();\n return;\n }\n\n const originalTextElements = originalElements.filter(el => !(0,_groups__WEBPACK_IMPORTED_MODULE_4__.isInGroup)(el) && (0,_element__WEBPACK_IMPORTED_MODULE_1__.isTextElement)(el) && !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_3__.isBoundToContainer)(el));\n\n for (let i = 0; i < latestTextElements.length; i++) {\n const latestElement = latestTextElements[i];\n const originalElement = originalTextElements[i];\n const originalFontSize = Math.round(originalElement.fontSize);\n const changeInFontSize = Math.round(accumulatedChange);\n let nextFontSize = Math.max(originalFontSize + changeInFontSize, MIN_FONT_SIZE);\n\n if (shouldChangeByStepSize) {\n nextFontSize = (0,_utils__WEBPACK_IMPORTED_MODULE_7__.getStepSizedValue)(nextFontSize, STEP_SIZE);\n }\n\n const newElement = Object.assign(Object.assign({}, latestElement), {\n fontSize: nextFontSize\n });\n const updates = (0,_element__WEBPACK_IMPORTED_MODULE_1__.refreshTextDimensions)(newElement, null, elementsMap);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_2__.mutateElement)(latestElement, Object.assign(Object.assign({}, updates), {\n fontSize: nextFontSize\n }), false);\n }\n\n scene.triggerUpdate();\n };\n\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n label: \"F\",\n icon: _icons__WEBPACK_IMPORTED_MODULE_5__.fontSizeIcon,\n elements: elements,\n dragInputCallback: handleFontSizeChange,\n value: value,\n editable: editable\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MultiFontSize);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/MultiFontSize.tsx?");
1830
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../element */ \"./element/index.ts\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _groups__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../groups */ \"./groups.ts\");\n/* harmony import */ var _icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../icons */ \"./components/icons.tsx\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../element/textElement */ \"./element/textElement.ts\");\n\n\n\n\n\n\n\n\n\nconst MIN_FONT_SIZE = 4;\nconst STEP_SIZE = 4;\n\nconst getApplicableTextElements = (elements, elementsMap) => elements.reduce((acc, el) => {\n if (!el || (0,_groups__WEBPACK_IMPORTED_MODULE_4__.isInGroup)(el)) {\n return acc;\n }\n\n if ((0,_element__WEBPACK_IMPORTED_MODULE_1__.isTextElement)(el)) {\n acc.push(el);\n return acc;\n }\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_3__.hasBoundTextElement)(el)) {\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(el, elementsMap);\n\n if (boundTextElement) {\n acc.push(boundTextElement);\n return acc;\n }\n }\n\n return acc;\n}, []);\n\nconst handleFontSizeChange = ({\n accumulatedChange,\n originalElements,\n shouldChangeByStepSize,\n nextValue,\n scene\n}) => {\n const elementsMap = scene.getNonDeletedElementsMap();\n const latestTextElements = originalElements.map(el => elementsMap.get(el.id));\n let nextFontSize;\n\n if (nextValue) {\n nextFontSize = Math.max(Math.round(nextValue), MIN_FONT_SIZE);\n\n for (const textElement of latestTextElements) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_2__.mutateElement)(textElement, {\n fontSize: nextFontSize\n }, false);\n (0,_element__WEBPACK_IMPORTED_MODULE_1__.redrawTextBoundingBox)(textElement, scene.getContainerElement(textElement), elementsMap, false);\n }\n\n scene.triggerUpdate();\n } else {\n const originalTextElements = originalElements;\n\n for (let i = 0; i < latestTextElements.length; i++) {\n const latestElement = latestTextElements[i];\n const originalElement = originalTextElements[i];\n const originalFontSize = Math.round(originalElement.fontSize);\n const changeInFontSize = Math.round(accumulatedChange);\n let nextFontSize = Math.max(originalFontSize + changeInFontSize, MIN_FONT_SIZE);\n\n if (shouldChangeByStepSize) {\n nextFontSize = (0,_utils__WEBPACK_IMPORTED_MODULE_7__.getStepSizedValue)(nextFontSize, STEP_SIZE);\n }\n\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_2__.mutateElement)(latestElement, {\n fontSize: nextFontSize\n }, false);\n (0,_element__WEBPACK_IMPORTED_MODULE_1__.redrawTextBoundingBox)(latestElement, scene.getContainerElement(latestElement), elementsMap, false);\n }\n\n scene.triggerUpdate();\n }\n};\n\nconst MultiFontSize = ({\n elements,\n scene,\n appState,\n property,\n elementsMap\n}) => {\n const latestTextElements = getApplicableTextElements(elements, elementsMap);\n\n if (!latestTextElements.length) {\n return null;\n }\n\n const fontSizes = latestTextElements.map(textEl => Math.round(textEl.fontSize * 10) / 10);\n const value = new Set(fontSizes).size === 1 ? fontSizes[0] : \"Mixed\";\n const editable = fontSizes.length > 0;\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n label: \"F\",\n icon: _icons__WEBPACK_IMPORTED_MODULE_5__.fontSizeIcon,\n elements: latestTextElements,\n dragInputCallback: handleFontSizeChange,\n value: value,\n editable: editable,\n scene: scene,\n property: property,\n appState: appState\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MultiFontSize);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/MultiFontSize.tsx?");
1831
1831
 
1832
1832
  /***/ }),
1833
1833
 
@@ -1838,7 +1838,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
1838
1838
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
1839
1839
 
1840
1840
  "use strict";
1841
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../math */ \"./math.ts\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../element */ \"./element/index.ts\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_5__);\n\n\n\n\n\n\n\nconst STEP_SIZE = 10;\n\nconst moveElements = (property, changeInTopX, changeInTopY, elements, originalElements, elementsMap, originalElementsMap) => {\n for (let i = 0; i < elements.length; i++) {\n const origElement = originalElements[i];\n const latestElement = elements[i];\n const [cx, cy] = [origElement.x + origElement.width / 2, origElement.y + origElement.height / 2];\n const [topLeftX, topLeftY] = (0,_math__WEBPACK_IMPORTED_MODULE_1__.rotate)(origElement.x, origElement.y, cx, cy, origElement.angle);\n const newTopLeftX = property === \"x\" ? Math.round(topLeftX + changeInTopX) : topLeftX;\n const newTopLeftY = property === \"y\" ? Math.round(topLeftY + changeInTopY) : topLeftY;\n (0,_utils__WEBPACK_IMPORTED_MODULE_3__.moveElement)(newTopLeftX, newTopLeftY, latestElement, origElement, elementsMap, originalElementsMap, false);\n }\n};\n\nconst moveGroupTo = (nextX, nextY, latestElements, originalElements, elementsMap, originalElementsMap) => {\n const [x1, y1,,] = (0,_element__WEBPACK_IMPORTED_MODULE_4__.getCommonBounds)(originalElements);\n const offsetX = nextX - x1;\n const offsetY = nextY - y1;\n\n for (let i = 0; i < latestElements.length; i++) {\n const origElement = originalElements[i];\n const latestElement = latestElements[i]; // bound texts are moved with their containers\n\n if (!(0,_element__WEBPACK_IMPORTED_MODULE_4__.isTextElement)(latestElement) || !latestElement.containerId) {\n const [cx, cy] = [latestElement.x + latestElement.width / 2, latestElement.y + latestElement.height / 2];\n const [topLeftX, topLeftY] = (0,_math__WEBPACK_IMPORTED_MODULE_1__.rotate)(latestElement.x, latestElement.y, cx, cy, latestElement.angle);\n (0,_utils__WEBPACK_IMPORTED_MODULE_3__.moveElement)(topLeftX + offsetX, topLeftY + offsetY, latestElement, origElement, elementsMap, originalElementsMap, false);\n }\n }\n};\n\nconst MultiPosition = ({\n property,\n elements,\n elementsMap,\n atomicUnits,\n scene\n}) => {\n const positions = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(() => atomicUnits.map(atomicUnit => {\n const elementsInUnit = Object.keys(atomicUnit).map(id => elementsMap.get(id)).filter(el => el !== undefined); // we're dealing with a group\n\n if (elementsInUnit.length > 1) {\n const [x1, y1] = (0,_element__WEBPACK_IMPORTED_MODULE_4__.getCommonBounds)(elementsInUnit);\n return Math.round((property === \"x\" ? x1 : y1) * 100) / 100;\n }\n\n const [el] = elementsInUnit;\n const [cx, cy] = [el.x + el.width / 2, el.y + el.height / 2];\n const [topLeftX, topLeftY] = (0,_math__WEBPACK_IMPORTED_MODULE_1__.rotate)(el.x, el.y, cx, cy, el.angle);\n return Math.round((property === \"x\" ? topLeftX : topLeftY) * 100) / 100;\n }), [atomicUnits, elementsMap, property]);\n const value = new Set(positions).size === 1 ? positions[0] : \"Mixed\";\n\n const handlePositionChange = ({\n accumulatedChange,\n originalElements,\n originalElementsMap,\n shouldChangeByStepSize,\n nextValue\n }) => {\n var _a, _b;\n\n if (nextValue !== undefined) {\n for (const atomicUnit of atomicUnits) {\n const elementsInUnit = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getElementsInAtomicUnit)(atomicUnit, elementsMap, originalElementsMap);\n\n if (elementsInUnit.length > 1) {\n const [x1, y1,,] = (0,_element__WEBPACK_IMPORTED_MODULE_4__.getCommonBounds)(elementsInUnit.map(el => el.latest));\n const newTopLeftX = property === \"x\" ? nextValue : x1;\n const newTopLeftY = property === \"y\" ? nextValue : y1;\n moveGroupTo(newTopLeftX, newTopLeftY, elementsInUnit.map(el => el.latest), elementsInUnit.map(el => el.original), elementsMap, originalElementsMap);\n } else {\n const origElement = (_a = elementsInUnit[0]) === null || _a === void 0 ? void 0 : _a.original;\n const latestElement = (_b = elementsInUnit[0]) === null || _b === void 0 ? void 0 : _b.latest;\n\n if (origElement && latestElement && (0,_utils__WEBPACK_IMPORTED_MODULE_3__.isPropertyEditable)(latestElement, property)) {\n const [cx, cy] = [origElement.x + origElement.width / 2, origElement.y + origElement.height / 2];\n const [topLeftX, topLeftY] = (0,_math__WEBPACK_IMPORTED_MODULE_1__.rotate)(origElement.x, origElement.y, cx, cy, origElement.angle);\n const newTopLeftX = property === \"x\" ? nextValue : topLeftX;\n const newTopLeftY = property === \"y\" ? nextValue : topLeftY;\n (0,_utils__WEBPACK_IMPORTED_MODULE_3__.moveElement)(newTopLeftX, newTopLeftY, latestElement, origElement, elementsMap, originalElementsMap, false);\n }\n }\n }\n\n scene.triggerUpdate();\n return;\n }\n\n const change = shouldChangeByStepSize ? (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getStepSizedValue)(accumulatedChange, STEP_SIZE) : accumulatedChange;\n const changeInTopX = property === \"x\" ? change : 0;\n const changeInTopY = property === \"y\" ? change : 0;\n moveElements(property, changeInTopX, changeInTopY, elements, originalElements, elementsMap, originalElementsMap);\n scene.triggerUpdate();\n };\n\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n label: property === \"x\" ? \"X\" : \"Y\",\n elements: elements,\n dragInputCallback: handlePositionChange,\n value: value\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MultiPosition);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/MultiPosition.tsx?");
1841
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../math */ \"./math.ts\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../element */ \"./element/index.ts\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_5__);\n\n\n\n\n\n\n\nconst STEP_SIZE = 10;\n\nconst moveElements = (property, changeInTopX, changeInTopY, elements, originalElements, elementsMap, originalElementsMap) => {\n for (let i = 0; i < elements.length; i++) {\n const origElement = originalElements[i];\n const [cx, cy] = [origElement.x + origElement.width / 2, origElement.y + origElement.height / 2];\n const [topLeftX, topLeftY] = (0,_math__WEBPACK_IMPORTED_MODULE_1__.rotate)(origElement.x, origElement.y, cx, cy, origElement.angle);\n const newTopLeftX = property === \"x\" ? Math.round(topLeftX + changeInTopX) : topLeftX;\n const newTopLeftY = property === \"y\" ? Math.round(topLeftY + changeInTopY) : topLeftY;\n (0,_utils__WEBPACK_IMPORTED_MODULE_3__.moveElement)(newTopLeftX, newTopLeftY, origElement, elementsMap, originalElementsMap, false);\n }\n};\n\nconst moveGroupTo = (nextX, nextY, originalElements, elementsMap, originalElementsMap, scene) => {\n const [x1, y1,,] = (0,_element__WEBPACK_IMPORTED_MODULE_4__.getCommonBounds)(originalElements);\n const offsetX = nextX - x1;\n const offsetY = nextY - y1;\n\n for (let i = 0; i < originalElements.length; i++) {\n const origElement = originalElements[i];\n const latestElement = elementsMap.get(origElement.id);\n\n if (!latestElement) {\n continue;\n } // bound texts are moved with their containers\n\n\n if (!(0,_element__WEBPACK_IMPORTED_MODULE_4__.isTextElement)(latestElement) || !latestElement.containerId) {\n const [cx, cy] = [latestElement.x + latestElement.width / 2, latestElement.y + latestElement.height / 2];\n const [topLeftX, topLeftY] = (0,_math__WEBPACK_IMPORTED_MODULE_1__.rotate)(latestElement.x, latestElement.y, cx, cy, latestElement.angle);\n (0,_utils__WEBPACK_IMPORTED_MODULE_3__.moveElement)(topLeftX + offsetX, topLeftY + offsetY, origElement, elementsMap, originalElementsMap, false);\n }\n }\n};\n\nconst handlePositionChange = ({\n accumulatedChange,\n originalElements,\n originalElementsMap,\n shouldChangeByStepSize,\n nextValue,\n property,\n scene,\n originalAppState\n}) => {\n var _a, _b;\n\n const elementsMap = scene.getNonDeletedElementsMap();\n\n if (nextValue !== undefined) {\n for (const atomicUnit of (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getAtomicUnits)(originalElements, originalAppState)) {\n const elementsInUnit = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getElementsInAtomicUnit)(atomicUnit, elementsMap, originalElementsMap);\n\n if (elementsInUnit.length > 1) {\n const [x1, y1,,] = (0,_element__WEBPACK_IMPORTED_MODULE_4__.getCommonBounds)(elementsInUnit.map(el => el.latest));\n const newTopLeftX = property === \"x\" ? nextValue : x1;\n const newTopLeftY = property === \"y\" ? nextValue : y1;\n moveGroupTo(newTopLeftX, newTopLeftY, elementsInUnit.map(el => el.original), elementsMap, originalElementsMap, scene);\n } else {\n const origElement = (_a = elementsInUnit[0]) === null || _a === void 0 ? void 0 : _a.original;\n const latestElement = (_b = elementsInUnit[0]) === null || _b === void 0 ? void 0 : _b.latest;\n\n if (origElement && latestElement && (0,_utils__WEBPACK_IMPORTED_MODULE_3__.isPropertyEditable)(latestElement, property)) {\n const [cx, cy] = [origElement.x + origElement.width / 2, origElement.y + origElement.height / 2];\n const [topLeftX, topLeftY] = (0,_math__WEBPACK_IMPORTED_MODULE_1__.rotate)(origElement.x, origElement.y, cx, cy, origElement.angle);\n const newTopLeftX = property === \"x\" ? nextValue : topLeftX;\n const newTopLeftY = property === \"y\" ? nextValue : topLeftY;\n (0,_utils__WEBPACK_IMPORTED_MODULE_3__.moveElement)(newTopLeftX, newTopLeftY, origElement, elementsMap, originalElementsMap, false);\n }\n }\n }\n\n scene.triggerUpdate();\n return;\n }\n\n const change = shouldChangeByStepSize ? (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getStepSizedValue)(accumulatedChange, STEP_SIZE) : accumulatedChange;\n const changeInTopX = property === \"x\" ? change : 0;\n const changeInTopY = property === \"y\" ? change : 0;\n moveElements(property, changeInTopX, changeInTopY, originalElements, originalElements, elementsMap, originalElementsMap);\n scene.triggerUpdate();\n};\n\nconst MultiPosition = ({\n property,\n elements,\n elementsMap,\n atomicUnits,\n scene,\n appState\n}) => {\n const positions = (0,react__WEBPACK_IMPORTED_MODULE_5__.useMemo)(() => atomicUnits.map(atomicUnit => {\n const elementsInUnit = Object.keys(atomicUnit).map(id => elementsMap.get(id)).filter(el => el !== undefined); // we're dealing with a group\n\n if (elementsInUnit.length > 1) {\n const [x1, y1] = (0,_element__WEBPACK_IMPORTED_MODULE_4__.getCommonBounds)(elementsInUnit);\n return Math.round((property === \"x\" ? x1 : y1) * 100) / 100;\n }\n\n const [el] = elementsInUnit;\n const [cx, cy] = [el.x + el.width / 2, el.y + el.height / 2];\n const [topLeftX, topLeftY] = (0,_math__WEBPACK_IMPORTED_MODULE_1__.rotate)(el.x, el.y, cx, cy, el.angle);\n return Math.round((property === \"x\" ? topLeftX : topLeftY) * 100) / 100;\n }), [atomicUnits, elementsMap, property]);\n const value = new Set(positions).size === 1 ? positions[0] : \"Mixed\";\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n label: property === \"x\" ? \"X\" : \"Y\",\n elements: elements,\n dragInputCallback: handlePositionChange,\n value: value,\n property: property,\n scene: scene,\n appState: appState\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MultiPosition);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/MultiPosition.tsx?");
1842
1842
 
1843
1843
  /***/ }),
1844
1844
 
@@ -1849,7 +1849,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
1849
1849
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
1850
1850
 
1851
1851
  "use strict";
1852
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../math */ \"./math.ts\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n\n\n\n\nconst STEP_SIZE = 10;\n\nconst Position = ({\n property,\n element,\n elementsMap\n}) => {\n const [topLeftX, topLeftY] = (0,_math__WEBPACK_IMPORTED_MODULE_1__.rotate)(element.x, element.y, element.x + element.width / 2, element.y + element.height / 2, element.angle);\n const value = Math.round((property === \"x\" ? topLeftX : topLeftY) * 100) / 100;\n\n const handlePositionChange = ({\n accumulatedChange,\n originalElements,\n originalElementsMap,\n shouldChangeByStepSize,\n nextValue\n }) => {\n const origElement = originalElements[0];\n const [cx, cy] = [origElement.x + origElement.width / 2, origElement.y + origElement.height / 2];\n const [topLeftX, topLeftY] = (0,_math__WEBPACK_IMPORTED_MODULE_1__.rotate)(origElement.x, origElement.y, cx, cy, origElement.angle);\n\n if (nextValue !== undefined) {\n const newTopLeftX = property === \"x\" ? nextValue : topLeftX;\n const newTopLeftY = property === \"y\" ? nextValue : topLeftY;\n (0,_utils__WEBPACK_IMPORTED_MODULE_3__.moveElement)(newTopLeftX, newTopLeftY, element, origElement, elementsMap, originalElementsMap);\n return;\n }\n\n const changeInTopX = property === \"x\" ? accumulatedChange : 0;\n const changeInTopY = property === \"y\" ? accumulatedChange : 0;\n const newTopLeftX = property === \"x\" ? Math.round(shouldChangeByStepSize ? (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getStepSizedValue)(origElement.x + changeInTopX, STEP_SIZE) : topLeftX + changeInTopX) : topLeftX;\n const newTopLeftY = property === \"y\" ? Math.round(shouldChangeByStepSize ? (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getStepSizedValue)(origElement.y + changeInTopY, STEP_SIZE) : topLeftY + changeInTopY) : topLeftY;\n (0,_utils__WEBPACK_IMPORTED_MODULE_3__.moveElement)(newTopLeftX, newTopLeftY, element, origElement, elementsMap, originalElementsMap);\n };\n\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n label: property === \"x\" ? \"X\" : \"Y\",\n elements: [element],\n dragInputCallback: handlePositionChange,\n value: value\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Position);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/Position.tsx?");
1852
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../math */ \"./math.ts\");\n/* harmony import */ var _DragInput__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./DragInput */ \"./components/Stats/DragInput.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n\n\n\n\nconst STEP_SIZE = 10;\n\nconst handlePositionChange = ({\n accumulatedChange,\n originalElements,\n originalElementsMap,\n shouldChangeByStepSize,\n nextValue,\n property,\n scene\n}) => {\n const elementsMap = scene.getNonDeletedElementsMap();\n const origElement = originalElements[0];\n const [cx, cy] = [origElement.x + origElement.width / 2, origElement.y + origElement.height / 2];\n const [topLeftX, topLeftY] = (0,_math__WEBPACK_IMPORTED_MODULE_1__.rotate)(origElement.x, origElement.y, cx, cy, origElement.angle);\n\n if (nextValue !== undefined) {\n const newTopLeftX = property === \"x\" ? nextValue : topLeftX;\n const newTopLeftY = property === \"y\" ? nextValue : topLeftY;\n (0,_utils__WEBPACK_IMPORTED_MODULE_3__.moveElement)(newTopLeftX, newTopLeftY, origElement, elementsMap, originalElementsMap);\n return;\n }\n\n const changeInTopX = property === \"x\" ? accumulatedChange : 0;\n const changeInTopY = property === \"y\" ? accumulatedChange : 0;\n const newTopLeftX = property === \"x\" ? Math.round(shouldChangeByStepSize ? (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getStepSizedValue)(origElement.x + changeInTopX, STEP_SIZE) : topLeftX + changeInTopX) : topLeftX;\n const newTopLeftY = property === \"y\" ? Math.round(shouldChangeByStepSize ? (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getStepSizedValue)(origElement.y + changeInTopY, STEP_SIZE) : topLeftY + changeInTopY) : topLeftY;\n (0,_utils__WEBPACK_IMPORTED_MODULE_3__.moveElement)(newTopLeftX, newTopLeftY, origElement, elementsMap, originalElementsMap);\n};\n\nconst Position = ({\n property,\n element,\n elementsMap,\n scene,\n appState\n}) => {\n const [topLeftX, topLeftY] = (0,_math__WEBPACK_IMPORTED_MODULE_1__.rotate)(element.x, element.y, element.x + element.width / 2, element.y + element.height / 2, element.angle);\n const value = Math.round((property === \"x\" ? topLeftX : topLeftY) * 100) / 100;\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DragInput__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n label: property === \"x\" ? \"X\" : \"Y\",\n elements: [element],\n dragInputCallback: handlePositionChange,\n value: value,\n property: property,\n scene: scene,\n appState: appState\n });\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Position);\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/Position.tsx?");
1853
1853
 
1854
1854
  /***/ }),
1855
1855
 
@@ -1860,7 +1860,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
1860
1860
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
1861
1861
 
1862
1862
  "use strict";
1863
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"Stats\": () => (/* binding */ Stats),\n/* harmony export */ \"StatsInner\": () => (/* binding */ StatsInner)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _element_bounds__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../element/bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../i18n */ \"./i18n.ts\");\n/* harmony import */ var _icons__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../icons */ \"./components/icons.tsx\");\n/* harmony import */ var _Island__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Island */ \"./components/Island.tsx\");\n/* harmony import */ var lodash__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! lodash */ \"../../node_modules/lodash/lodash.js\");\n/* harmony import */ var lodash__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(lodash__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var _Dimension__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Dimension */ \"./components/Stats/Dimension.tsx\");\n/* harmony import */ var _Angle__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Angle */ \"./components/Stats/Angle.tsx\");\n/* harmony import */ var _FontSize__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./FontSize */ \"./components/Stats/FontSize.tsx\");\n/* harmony import */ var _MultiDimension__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./MultiDimension */ \"./components/Stats/MultiDimension.tsx\");\n/* harmony import */ var _groups__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../groups */ \"./groups.ts\");\n/* harmony import */ var _MultiAngle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./MultiAngle */ \"./components/Stats/MultiAngle.tsx\");\n/* harmony import */ var _MultiFontSize__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./MultiFontSize */ \"./components/Stats/MultiFontSize.tsx\");\n/* harmony import */ var _Position__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./Position */ \"./components/Stats/Position.tsx\");\n/* harmony import */ var _MultiPosition__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./MultiPosition */ \"./components/Stats/MultiPosition.tsx\");\n/* harmony import */ var _Collapsible__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./Collapsible */ \"./components/Stats/Collapsible.tsx\");\n/* harmony import */ var _App__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../App */ \"./components/App.tsx\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../constants */ \"./constants.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nconst STATS_TIMEOUT = 50;\nconst Stats = props => {\n const appState = (0,_App__WEBPACK_IMPORTED_MODULE_17__.useExcalidrawAppState)();\n const sceneNonce = props.scene.getSceneNonce() || 1;\n const selectedElements = props.scene.getSelectedElements({\n selectedElementIds: appState.selectedElementIds,\n includeBoundTextElement: false\n });\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(StatsInner, Object.assign({}, props, {\n appState: appState,\n sceneNonce: sceneNonce,\n selectedElements: selectedElements\n }));\n};\nconst StatsInner = (0,react__WEBPACK_IMPORTED_MODULE_1__.memo)(({\n scene,\n onClose,\n renderCustomStats,\n selectedElements,\n appState,\n sceneNonce\n}) => {\n const elements = scene.getNonDeletedElements();\n const elementsMap = scene.getNonDeletedElementsMap();\n const setAppState = (0,_App__WEBPACK_IMPORTED_MODULE_17__.useExcalidrawSetAppState)();\n const singleElement = selectedElements.length === 1 ? selectedElements[0] : null;\n const multipleElements = selectedElements.length > 1 ? selectedElements : null;\n const [sceneDimension, setSceneDimension] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)({\n width: 0,\n height: 0\n });\n const throttledSetSceneDimension = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(() => (0,lodash__WEBPACK_IMPORTED_MODULE_6__.throttle)(elements => {\n const boundingBox = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_2__.getCommonBounds)(elements);\n setSceneDimension({\n width: Math.round(boundingBox[2]) - Math.round(boundingBox[0]),\n height: Math.round(boundingBox[3]) - Math.round(boundingBox[1])\n });\n }, STATS_TIMEOUT), []);\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {\n throttledSetSceneDimension(elements);\n }, [sceneNonce, elements, throttledSetSceneDimension]);\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => () => throttledSetSceneDimension.cancel(), [throttledSetSceneDimension]);\n const atomicUnits = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(() => {\n const selectedGroupIds = (0,_groups__WEBPACK_IMPORTED_MODULE_11__.getSelectedGroupIds)(appState);\n\n const _atomicUnits = selectedGroupIds.map(gid => {\n return (0,_groups__WEBPACK_IMPORTED_MODULE_11__.getElementsInGroup)(selectedElements, gid).reduce((acc, el) => {\n acc[el.id] = true;\n return acc;\n }, {});\n });\n\n selectedElements.filter(el => !(0,_groups__WEBPACK_IMPORTED_MODULE_11__.isInGroup)(el)).forEach(el => {\n _atomicUnits.push({\n [el.id]: true\n });\n });\n return _atomicUnits;\n }, [selectedElements, appState]);\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: \"Stats\"\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_Island__WEBPACK_IMPORTED_MODULE_5__.Island, Object.assign({\n padding: 3\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n className: \"title\"\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"h2\", {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.title\")\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: \"close\",\n onClick: onClose\n }, {\n children: _icons__WEBPACK_IMPORTED_MODULE_4__.CloseIcon\n }))]\n })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Collapsible__WEBPACK_IMPORTED_MODULE_16__[\"default\"], Object.assign({\n label: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"h3\", {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.generalStats\")\n }),\n open: !!(appState.stats.panels & _constants__WEBPACK_IMPORTED_MODULE_18__.STATS_PANELS.generalStats),\n openTrigger: () => setAppState(state => {\n return Object.assign(Object.assign({}, state), {\n stats: {\n open: true,\n panels: state.stats.panels ^ _constants__WEBPACK_IMPORTED_MODULE_18__.STATS_PANELS.generalStats\n }\n });\n })\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"table\", {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"tbody\", {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"tr\", {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"th\", Object.assign({\n colSpan: 2\n }, {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.scene\")\n }))\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"tr\", {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"td\", {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.elements\")\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"td\", {\n children: elements.length\n })]\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"tr\", {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"td\", {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.width\")\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"td\", {\n children: sceneDimension.width\n })]\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"tr\", {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"td\", {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.height\")\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"td\", {\n children: sceneDimension.height\n })]\n }), renderCustomStats === null || renderCustomStats === void 0 ? void 0 : renderCustomStats(elements, appState)]\n })\n })\n })), selectedElements.length > 0 && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n id: \"elementStats\",\n style: {\n marginTop: 12\n }\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_Collapsible__WEBPACK_IMPORTED_MODULE_16__[\"default\"], Object.assign({\n label: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"h3\", {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.elementProperties\")\n }),\n open: !!(appState.stats.panels & _constants__WEBPACK_IMPORTED_MODULE_18__.STATS_PANELS.elementProperties),\n openTrigger: () => setAppState(state => {\n return Object.assign(Object.assign({}, state), {\n stats: {\n open: true,\n panels: state.stats.panels ^ _constants__WEBPACK_IMPORTED_MODULE_18__.STATS_PANELS.elementProperties\n }\n });\n })\n }, {\n children: [singleElement && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n className: \"sectionContent\"\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: \"elementType\"\n }, {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(`element.${singleElement.type}`)\n })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n className: \"statsItem\"\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Position__WEBPACK_IMPORTED_MODULE_14__[\"default\"], {\n element: singleElement,\n property: \"x\",\n elementsMap: elementsMap\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Position__WEBPACK_IMPORTED_MODULE_14__[\"default\"], {\n element: singleElement,\n property: \"y\",\n elementsMap: elementsMap\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Dimension__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n property: \"width\",\n element: singleElement,\n elementsMap: elementsMap\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Dimension__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n property: \"height\",\n element: singleElement,\n elementsMap: elementsMap\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Angle__WEBPACK_IMPORTED_MODULE_8__[\"default\"], {\n element: singleElement,\n elementsMap: elementsMap\n }), singleElement.type === \"text\" && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_FontSize__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n element: singleElement,\n elementsMap: elementsMap\n })]\n }))]\n })), multipleElements && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n className: \"sectionContent\"\n }, {\n children: [(0,_groups__WEBPACK_IMPORTED_MODULE_11__.elementsAreInSameGroup)(multipleElements) && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: \"elementType\"\n }, {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"element.group\")\n })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n className: \"elementsCount\"\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.elements\")\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", {\n children: selectedElements.length\n })]\n })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n className: \"statsItem\"\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MultiPosition__WEBPACK_IMPORTED_MODULE_15__[\"default\"], {\n property: \"x\",\n elements: multipleElements,\n elementsMap: elementsMap,\n atomicUnits: atomicUnits,\n scene: scene\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MultiPosition__WEBPACK_IMPORTED_MODULE_15__[\"default\"], {\n property: \"y\",\n elements: multipleElements,\n elementsMap: elementsMap,\n atomicUnits: atomicUnits,\n scene: scene\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MultiDimension__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n property: \"width\",\n elements: multipleElements,\n elementsMap: elementsMap,\n atomicUnits: atomicUnits,\n scene: scene\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MultiDimension__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n property: \"height\",\n elements: multipleElements,\n elementsMap: elementsMap,\n atomicUnits: atomicUnits,\n scene: scene\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MultiAngle__WEBPACK_IMPORTED_MODULE_12__[\"default\"], {\n elements: multipleElements,\n elementsMap: elementsMap,\n scene: scene\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MultiFontSize__WEBPACK_IMPORTED_MODULE_13__[\"default\"], {\n elements: multipleElements,\n elementsMap: elementsMap,\n scene: scene\n })]\n }))]\n }))]\n }))\n }))]\n }))\n }));\n}, (prev, next) => {\n return prev.sceneNonce === next.sceneNonce && prev.selectedElements === next.selectedElements && prev.appState.stats.panels === next.appState.stats.panels;\n});\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/index.tsx?");
1863
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"Stats\": () => (/* binding */ Stats),\n/* harmony export */ \"StatsInner\": () => (/* binding */ StatsInner)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _element_bounds__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../element/bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../i18n */ \"./i18n.ts\");\n/* harmony import */ var _icons__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../icons */ \"./components/icons.tsx\");\n/* harmony import */ var _Island__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Island */ \"./components/Island.tsx\");\n/* harmony import */ var lodash__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! lodash */ \"../../node_modules/lodash/lodash.js\");\n/* harmony import */ var lodash__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(lodash__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var _Dimension__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Dimension */ \"./components/Stats/Dimension.tsx\");\n/* harmony import */ var _Angle__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Angle */ \"./components/Stats/Angle.tsx\");\n/* harmony import */ var _FontSize__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./FontSize */ \"./components/Stats/FontSize.tsx\");\n/* harmony import */ var _MultiDimension__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./MultiDimension */ \"./components/Stats/MultiDimension.tsx\");\n/* harmony import */ var _groups__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../groups */ \"./groups.ts\");\n/* harmony import */ var _MultiAngle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./MultiAngle */ \"./components/Stats/MultiAngle.tsx\");\n/* harmony import */ var _MultiFontSize__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./MultiFontSize */ \"./components/Stats/MultiFontSize.tsx\");\n/* harmony import */ var _Position__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./Position */ \"./components/Stats/Position.tsx\");\n/* harmony import */ var _MultiPosition__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./MultiPosition */ \"./components/Stats/MultiPosition.tsx\");\n/* harmony import */ var _Collapsible__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./Collapsible */ \"./components/Stats/Collapsible.tsx\");\n/* harmony import */ var _App__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../App */ \"./components/App.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./utils */ \"./components/Stats/utils.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../constants */ \"./constants.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nconst STATS_TIMEOUT = 50;\nconst Stats = props => {\n const appState = (0,_App__WEBPACK_IMPORTED_MODULE_17__.useExcalidrawAppState)();\n const sceneNonce = props.scene.getSceneNonce() || 1;\n const selectedElements = props.scene.getSelectedElements({\n selectedElementIds: appState.selectedElementIds,\n includeBoundTextElement: false\n });\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(StatsInner, Object.assign({}, props, {\n appState: appState,\n sceneNonce: sceneNonce,\n selectedElements: selectedElements\n }));\n};\nconst StatsInner = (0,react__WEBPACK_IMPORTED_MODULE_1__.memo)(({\n scene,\n onClose,\n renderCustomStats,\n selectedElements,\n appState,\n sceneNonce\n}) => {\n const elements = scene.getNonDeletedElements();\n const elementsMap = scene.getNonDeletedElementsMap();\n const setAppState = (0,_App__WEBPACK_IMPORTED_MODULE_17__.useExcalidrawSetAppState)();\n const singleElement = selectedElements.length === 1 ? selectedElements[0] : null;\n const multipleElements = selectedElements.length > 1 ? selectedElements : null;\n const [sceneDimension, setSceneDimension] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)({\n width: 0,\n height: 0\n });\n const throttledSetSceneDimension = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(() => (0,lodash__WEBPACK_IMPORTED_MODULE_6__.throttle)(elements => {\n const boundingBox = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_2__.getCommonBounds)(elements);\n setSceneDimension({\n width: Math.round(boundingBox[2]) - Math.round(boundingBox[0]),\n height: Math.round(boundingBox[3]) - Math.round(boundingBox[1])\n });\n }, STATS_TIMEOUT), []);\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {\n throttledSetSceneDimension(elements);\n }, [sceneNonce, elements, throttledSetSceneDimension]);\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => () => throttledSetSceneDimension.cancel(), [throttledSetSceneDimension]);\n const atomicUnits = (0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)(() => {\n return (0,_utils__WEBPACK_IMPORTED_MODULE_18__.getAtomicUnits)(selectedElements, appState);\n }, [selectedElements, appState]);\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: \"Stats\"\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_Island__WEBPACK_IMPORTED_MODULE_5__.Island, Object.assign({\n padding: 3\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n className: \"title\"\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"h2\", {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.title\")\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: \"close\",\n onClick: onClose\n }, {\n children: _icons__WEBPACK_IMPORTED_MODULE_4__.CloseIcon\n }))]\n })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Collapsible__WEBPACK_IMPORTED_MODULE_16__[\"default\"], Object.assign({\n label: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"h3\", {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.generalStats\")\n }),\n open: !!(appState.stats.panels & _constants__WEBPACK_IMPORTED_MODULE_19__.STATS_PANELS.generalStats),\n openTrigger: () => setAppState(state => {\n return Object.assign(Object.assign({}, state), {\n stats: {\n open: true,\n panels: state.stats.panels ^ _constants__WEBPACK_IMPORTED_MODULE_19__.STATS_PANELS.generalStats\n }\n });\n })\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"table\", {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"tbody\", {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"tr\", {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"th\", Object.assign({\n colSpan: 2\n }, {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.scene\")\n }))\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"tr\", {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"td\", {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.elements\")\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"td\", {\n children: elements.length\n })]\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"tr\", {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"td\", {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.width\")\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"td\", {\n children: sceneDimension.width\n })]\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"tr\", {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"td\", {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.height\")\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"td\", {\n children: sceneDimension.height\n })]\n }), renderCustomStats === null || renderCustomStats === void 0 ? void 0 : renderCustomStats(elements, appState)]\n })\n })\n })), selectedElements.length > 0 && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n id: \"elementStats\",\n style: {\n marginTop: 12\n }\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_Collapsible__WEBPACK_IMPORTED_MODULE_16__[\"default\"], Object.assign({\n label: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"h3\", {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.elementProperties\")\n }),\n open: !!(appState.stats.panels & _constants__WEBPACK_IMPORTED_MODULE_19__.STATS_PANELS.elementProperties),\n openTrigger: () => setAppState(state => {\n return Object.assign(Object.assign({}, state), {\n stats: {\n open: true,\n panels: state.stats.panels ^ _constants__WEBPACK_IMPORTED_MODULE_19__.STATS_PANELS.elementProperties\n }\n });\n })\n }, {\n children: [singleElement && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n className: \"sectionContent\"\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: \"elementType\"\n }, {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(`element.${singleElement.type}`)\n })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n className: \"statsItem\"\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Position__WEBPACK_IMPORTED_MODULE_14__[\"default\"], {\n element: singleElement,\n property: \"x\",\n elementsMap: elementsMap,\n scene: scene,\n appState: appState\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Position__WEBPACK_IMPORTED_MODULE_14__[\"default\"], {\n element: singleElement,\n property: \"y\",\n elementsMap: elementsMap,\n scene: scene,\n appState: appState\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Dimension__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n property: \"width\",\n element: singleElement,\n scene: scene,\n appState: appState\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Dimension__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n property: \"height\",\n element: singleElement,\n scene: scene,\n appState: appState\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_Angle__WEBPACK_IMPORTED_MODULE_8__[\"default\"], {\n property: \"angle\",\n element: singleElement,\n scene: scene,\n appState: appState\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_FontSize__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n property: \"fontSize\",\n element: singleElement,\n scene: scene,\n appState: appState\n })]\n }))]\n })), multipleElements && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n className: \"sectionContent\"\n }, {\n children: [(0,_groups__WEBPACK_IMPORTED_MODULE_11__.elementsAreInSameGroup)(multipleElements) && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", Object.assign({\n className: \"elementType\"\n }, {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"element.group\")\n })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n className: \"elementsCount\"\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", {\n children: (0,_i18n__WEBPACK_IMPORTED_MODULE_3__.t)(\"stats.elements\")\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(\"div\", {\n children: selectedElements.length\n })]\n })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(\"div\", Object.assign({\n className: \"statsItem\"\n }, {\n children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MultiPosition__WEBPACK_IMPORTED_MODULE_15__[\"default\"], {\n property: \"x\",\n elements: multipleElements,\n elementsMap: elementsMap,\n atomicUnits: atomicUnits,\n scene: scene,\n appState: appState\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MultiPosition__WEBPACK_IMPORTED_MODULE_15__[\"default\"], {\n property: \"y\",\n elements: multipleElements,\n elementsMap: elementsMap,\n atomicUnits: atomicUnits,\n scene: scene,\n appState: appState\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MultiDimension__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n property: \"width\",\n elements: multipleElements,\n elementsMap: elementsMap,\n atomicUnits: atomicUnits,\n scene: scene,\n appState: appState\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MultiDimension__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n property: \"height\",\n elements: multipleElements,\n elementsMap: elementsMap,\n atomicUnits: atomicUnits,\n scene: scene,\n appState: appState\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MultiAngle__WEBPACK_IMPORTED_MODULE_12__[\"default\"], {\n property: \"angle\",\n elements: multipleElements,\n scene: scene,\n appState: appState\n }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_MultiFontSize__WEBPACK_IMPORTED_MODULE_13__[\"default\"], {\n property: \"fontSize\",\n elements: multipleElements,\n scene: scene,\n appState: appState,\n elementsMap: elementsMap\n })]\n }))]\n }))]\n }))\n }))]\n }))\n }));\n}, (prev, next) => {\n return prev.sceneNonce === next.sceneNonce && prev.selectedElements === next.selectedElements && prev.appState.stats.panels === next.appState.stats.panels;\n});\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/index.tsx?");
1864
1864
 
1865
1865
  /***/ }),
1866
1866
 
@@ -1871,7 +1871,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
1871
1871
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
1872
1872
 
1873
1873
  "use strict";
1874
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"SMALLEST_DELTA\": () => (/* binding */ SMALLEST_DELTA),\n/* harmony export */ \"getElementsInAtomicUnit\": () => (/* binding */ getElementsInAtomicUnit),\n/* harmony export */ \"getStepSizedValue\": () => (/* binding */ getStepSizedValue),\n/* harmony export */ \"isPropertyEditable\": () => (/* binding */ isPropertyEditable),\n/* harmony export */ \"moveElement\": () => (/* binding */ moveElement),\n/* harmony export */ \"newOrigin\": () => (/* binding */ newOrigin),\n/* harmony export */ \"resizeElement\": () => (/* binding */ resizeElement)\n/* harmony export */ });\n/* harmony import */ var _element_binding__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../element/binding */ \"./element/binding.ts\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _element_resizeElements__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../element/resizeElements */ \"./element/resizeElements.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../math */ \"./math.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../utils */ \"./utils.ts\");\n\n\n\n\n\n\n\nconst SMALLEST_DELTA = 0.01;\nconst isPropertyEditable = (element, property) => {\n if (property === \"height\" && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_4__.isTextElement)(element)) {\n return false;\n }\n\n if (property === \"width\" && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_4__.isTextElement)(element)) {\n return false;\n }\n\n if (property === \"angle\" && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_4__.isFrameLikeElement)(element)) {\n return false;\n }\n\n return true;\n};\nconst getStepSizedValue = (value, stepSize) => {\n const v = value + stepSize / 2;\n return v - v % stepSize;\n};\nconst getElementsInAtomicUnit = (atomicUnit, elementsMap, originalElementsMap) => {\n return Object.keys(atomicUnit).map(id => ({\n original: (originalElementsMap !== null && originalElementsMap !== void 0 ? originalElementsMap : elementsMap).get(id),\n latest: elementsMap.get(id)\n })).filter(el => el.original !== undefined && el.latest !== undefined);\n};\nconst newOrigin = (x1, y1, w1, h1, w2, h2, angle) => {\n /**\r\n * The formula below is the result of solving\r\n * rotate(x1, y1, cx1, cy1, angle) = rotate(x2, y2, cx2, cy2, angle)\r\n * where rotate is the function defined in math.ts\r\n *\r\n * This is so that the new origin (x2, y2),\r\n * when rotated against the new center (cx2, cy2),\r\n * coincides with (x1, y1) rotated against (cx1, cy1)\r\n *\r\n * The reason for doing this computation is so the element's top left corner\r\n * on the canvas remains fixed after any changes in its dimension.\r\n */\n return {\n x: x1 + (w1 - w2) / 2 + (w2 - w1) / 2 * Math.cos(angle) + (h1 - h2) / 2 * Math.sin(angle),\n y: y1 + (h1 - h2) / 2 + (w2 - w1) / 2 * Math.sin(angle) + (h2 - h1) / 2 * Math.cos(angle)\n };\n};\nconst resizeElement = (nextWidth, nextHeight, keepAspectRatio, latestElement, origElement, elementsMap, originalElementsMap, shouldInformMutation = true) => {\n var _a;\n\n let boundTextFont = {};\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_3__.getBoundTextElement)(latestElement, elementsMap);\n\n if (boundTextElement) {\n const minWidth = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_3__.getApproxMinLineWidth)((0,_utils__WEBPACK_IMPORTED_MODULE_6__.getFontString)(boundTextElement), boundTextElement.lineHeight);\n const minHeight = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_3__.getApproxMinLineHeight)(boundTextElement.fontSize, boundTextElement.lineHeight);\n nextWidth = Math.max(nextWidth, minWidth);\n nextHeight = Math.max(nextHeight, minHeight);\n }\n\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(latestElement, Object.assign(Object.assign(Object.assign({}, newOrigin(latestElement.x, latestElement.y, latestElement.width, latestElement.height, nextWidth, nextHeight, latestElement.angle)), {\n width: nextWidth,\n height: nextHeight\n }), (0,_element_resizeElements__WEBPACK_IMPORTED_MODULE_2__.rescalePointsInElement)(origElement, nextWidth, nextHeight, true)), shouldInformMutation);\n\n if (boundTextElement) {\n boundTextFont = {\n fontSize: boundTextElement.fontSize\n };\n\n if (keepAspectRatio) {\n const updatedElement = Object.assign(Object.assign({}, latestElement), {\n width: nextWidth,\n height: nextHeight\n });\n const nextFont = (0,_element_resizeElements__WEBPACK_IMPORTED_MODULE_2__.measureFontSizeFromWidth)(boundTextElement, elementsMap, (0,_element_textElement__WEBPACK_IMPORTED_MODULE_3__.getBoundTextMaxWidth)(updatedElement, boundTextElement));\n boundTextFont = {\n fontSize: (_a = nextFont === null || nextFont === void 0 ? void 0 : nextFont.size) !== null && _a !== void 0 ? _a : boundTextElement.fontSize\n };\n }\n }\n\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_0__.updateBoundElements)(latestElement, elementsMap, {\n newSize: {\n width: nextWidth,\n height: nextHeight\n }\n });\n\n if (boundTextElement && boundTextFont) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(boundTextElement, {\n fontSize: boundTextFont.fontSize\n });\n }\n\n (0,_element_textElement__WEBPACK_IMPORTED_MODULE_3__.handleBindTextResize)(latestElement, elementsMap, \"e\", keepAspectRatio);\n};\nconst moveElement = (newTopLeftX, newTopLeftY, latestElement, originalElement, elementsMap, originalElementsMap, shouldInformMutation = true) => {\n const [cx, cy] = [originalElement.x + originalElement.width / 2, originalElement.y + originalElement.height / 2];\n const [topLeftX, topLeftY] = (0,_math__WEBPACK_IMPORTED_MODULE_5__.rotate)(originalElement.x, originalElement.y, cx, cy, originalElement.angle);\n const changeInX = newTopLeftX - topLeftX;\n const changeInY = newTopLeftY - topLeftY;\n const [x, y] = (0,_math__WEBPACK_IMPORTED_MODULE_5__.rotate)(newTopLeftX, newTopLeftY, cx + changeInX, cy + changeInY, -originalElement.angle);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(latestElement, {\n x,\n y\n }, shouldInformMutation);\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_3__.getBoundTextElement)(originalElement, originalElementsMap);\n\n if (boundTextElement) {\n const latestBoundTextElement = elementsMap.get(boundTextElement.id);\n latestBoundTextElement && (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(latestBoundTextElement, {\n x: boundTextElement.x + changeInX,\n y: boundTextElement.y + changeInY\n }, shouldInformMutation);\n }\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/utils.ts?");
1874
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"SMALLEST_DELTA\": () => (/* binding */ SMALLEST_DELTA),\n/* harmony export */ \"getAtomicUnits\": () => (/* binding */ getAtomicUnits),\n/* harmony export */ \"getElementsInAtomicUnit\": () => (/* binding */ getElementsInAtomicUnit),\n/* harmony export */ \"getStepSizedValue\": () => (/* binding */ getStepSizedValue),\n/* harmony export */ \"isPropertyEditable\": () => (/* binding */ isPropertyEditable),\n/* harmony export */ \"moveElement\": () => (/* binding */ moveElement),\n/* harmony export */ \"newOrigin\": () => (/* binding */ newOrigin),\n/* harmony export */ \"resizeElement\": () => (/* binding */ resizeElement),\n/* harmony export */ \"updateBindings\": () => (/* binding */ updateBindings)\n/* harmony export */ });\n/* harmony import */ var _element_binding__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../element/binding */ \"./element/binding.ts\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _element_resizeElements__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../element/resizeElements */ \"./element/resizeElements.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _groups__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../groups */ \"./groups.ts\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../math */ \"./math.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../utils */ \"./utils.ts\");\n\n\n\n\n\n\n\n\nconst SMALLEST_DELTA = 0.01;\nconst isPropertyEditable = (element, property) => {\n if (property === \"height\" && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_4__.isTextElement)(element)) {\n return false;\n }\n\n if (property === \"width\" && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_4__.isTextElement)(element)) {\n return false;\n }\n\n if (property === \"angle\" && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_4__.isFrameLikeElement)(element)) {\n return false;\n }\n\n return true;\n};\nconst getStepSizedValue = (value, stepSize) => {\n const v = value + stepSize / 2;\n return v - v % stepSize;\n};\nconst getElementsInAtomicUnit = (atomicUnit, elementsMap, originalElementsMap) => {\n return Object.keys(atomicUnit).map(id => ({\n original: (originalElementsMap !== null && originalElementsMap !== void 0 ? originalElementsMap : elementsMap).get(id),\n latest: elementsMap.get(id)\n })).filter(el => el.original !== undefined && el.latest !== undefined);\n};\nconst newOrigin = (x1, y1, w1, h1, w2, h2, angle) => {\n /**\r\n * The formula below is the result of solving\r\n * rotate(x1, y1, cx1, cy1, angle) = rotate(x2, y2, cx2, cy2, angle)\r\n * where rotate is the function defined in math.ts\r\n *\r\n * This is so that the new origin (x2, y2),\r\n * when rotated against the new center (cx2, cy2),\r\n * coincides with (x1, y1) rotated against (cx1, cy1)\r\n *\r\n * The reason for doing this computation is so the element's top left corner\r\n * on the canvas remains fixed after any changes in its dimension.\r\n */\n return {\n x: x1 + (w1 - w2) / 2 + (w2 - w1) / 2 * Math.cos(angle) + (h1 - h2) / 2 * Math.sin(angle),\n y: y1 + (h1 - h2) / 2 + (w2 - w1) / 2 * Math.sin(angle) + (h2 - h1) / 2 * Math.cos(angle)\n };\n};\nconst resizeElement = (nextWidth, nextHeight, keepAspectRatio, origElement, elementsMap, shouldInformMutation = true) => {\n var _a;\n\n const latestElement = elementsMap.get(origElement.id);\n\n if (!latestElement) {\n return;\n }\n\n let boundTextFont = {};\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_3__.getBoundTextElement)(latestElement, elementsMap);\n\n if (boundTextElement) {\n const minWidth = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_3__.getApproxMinLineWidth)((0,_utils__WEBPACK_IMPORTED_MODULE_7__.getFontString)(boundTextElement), boundTextElement.lineHeight);\n const minHeight = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_3__.getApproxMinLineHeight)(boundTextElement.fontSize, boundTextElement.lineHeight);\n nextWidth = Math.max(nextWidth, minWidth);\n nextHeight = Math.max(nextHeight, minHeight);\n }\n\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(latestElement, Object.assign(Object.assign(Object.assign({}, newOrigin(latestElement.x, latestElement.y, latestElement.width, latestElement.height, nextWidth, nextHeight, latestElement.angle)), {\n width: nextWidth,\n height: nextHeight\n }), (0,_element_resizeElements__WEBPACK_IMPORTED_MODULE_2__.rescalePointsInElement)(origElement, nextWidth, nextHeight, true)), shouldInformMutation);\n updateBindings(latestElement, elementsMap, {\n newSize: {\n width: nextWidth,\n height: nextHeight\n }\n });\n\n if (boundTextElement) {\n boundTextFont = {\n fontSize: boundTextElement.fontSize\n };\n\n if (keepAspectRatio) {\n const updatedElement = Object.assign(Object.assign({}, latestElement), {\n width: nextWidth,\n height: nextHeight\n });\n const nextFont = (0,_element_resizeElements__WEBPACK_IMPORTED_MODULE_2__.measureFontSizeFromWidth)(boundTextElement, elementsMap, (0,_element_textElement__WEBPACK_IMPORTED_MODULE_3__.getBoundTextMaxWidth)(updatedElement, boundTextElement));\n boundTextFont = {\n fontSize: (_a = nextFont === null || nextFont === void 0 ? void 0 : nextFont.size) !== null && _a !== void 0 ? _a : boundTextElement.fontSize\n };\n }\n }\n\n if (boundTextElement && boundTextFont) {\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(boundTextElement, {\n fontSize: boundTextFont.fontSize\n });\n }\n\n (0,_element_textElement__WEBPACK_IMPORTED_MODULE_3__.handleBindTextResize)(latestElement, elementsMap, \"e\", keepAspectRatio);\n};\nconst moveElement = (newTopLeftX, newTopLeftY, originalElement, elementsMap, originalElementsMap, shouldInformMutation = true) => {\n const latestElement = elementsMap.get(originalElement.id);\n\n if (!latestElement) {\n return;\n }\n\n const [cx, cy] = [originalElement.x + originalElement.width / 2, originalElement.y + originalElement.height / 2];\n const [topLeftX, topLeftY] = (0,_math__WEBPACK_IMPORTED_MODULE_6__.rotate)(originalElement.x, originalElement.y, cx, cy, originalElement.angle);\n const changeInX = newTopLeftX - topLeftX;\n const changeInY = newTopLeftY - topLeftY;\n const [x, y] = (0,_math__WEBPACK_IMPORTED_MODULE_6__.rotate)(newTopLeftX, newTopLeftY, cx + changeInX, cy + changeInY, -originalElement.angle);\n (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(latestElement, {\n x,\n y\n }, shouldInformMutation);\n updateBindings(latestElement, elementsMap);\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_3__.getBoundTextElement)(originalElement, originalElementsMap);\n\n if (boundTextElement) {\n const latestBoundTextElement = elementsMap.get(boundTextElement.id);\n latestBoundTextElement && (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.mutateElement)(latestBoundTextElement, {\n x: boundTextElement.x + changeInX,\n y: boundTextElement.y + changeInY\n }, shouldInformMutation);\n }\n};\nconst getAtomicUnits = (targetElements, appState) => {\n const selectedGroupIds = (0,_groups__WEBPACK_IMPORTED_MODULE_5__.getSelectedGroupIds)(appState);\n\n const _atomicUnits = selectedGroupIds.map(gid => {\n return (0,_groups__WEBPACK_IMPORTED_MODULE_5__.getElementsInGroup)(targetElements, gid).reduce((acc, el) => {\n acc[el.id] = true;\n return acc;\n }, {});\n });\n\n targetElements.filter(el => !(0,_groups__WEBPACK_IMPORTED_MODULE_5__.isInGroup)(el)).forEach(el => {\n _atomicUnits.push({\n [el.id]: true\n });\n });\n return _atomicUnits;\n};\nconst updateBindings = (latestElement, elementsMap, options) => {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_4__.isLinearElement)(latestElement)) {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_0__.bindOrUnbindLinearElements)([latestElement], elementsMap, true, []);\n } else {\n (0,_element_binding__WEBPACK_IMPORTED_MODULE_0__.updateBoundElements)(latestElement, elementsMap, options);\n }\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./components/Stats/utils.ts?");
1875
1875
 
1876
1876
  /***/ }),
1877
1877
 
@@ -2432,7 +2432,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
2432
2432
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
2433
2433
 
2434
2434
  "use strict";
2435
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"resetCursor\": () => (/* binding */ resetCursor),\n/* harmony export */ \"setCursor\": () => (/* binding */ setCursor),\n/* harmony export */ \"setCursorForShape\": () => (/* binding */ setCursorForShape),\n/* harmony export */ \"setEraserCursor\": () => (/* binding */ setEraserCursor)\n/* harmony export */ });\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./constants */ \"./constants.ts\");\n/* harmony import */ var open_color__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! open-color */ \"../../node_modules/open-color/open-color.json\");\n/* harmony import */ var _appState__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./appState */ \"./appState.ts\");\n\n\n\nconst laserPointerCursorSVG_tag = `<svg viewBox=\"0 0 24 24\" stroke-width=\"1\" width=\"28\" height=\"28\" xmlns=\"http://www.w3.org/2000/svg\">`;\nconst laserPointerCursorBackgroundSVG = `<path d=\"M6.164 11.755a5.314 5.314 0 0 1-4.932-5.298 5.314 5.314 0 0 1 5.311-5.311 5.314 5.314 0 0 1 5.307 5.113l8.773 8.773a3.322 3.322 0 0 1 0 4.696l-.895.895a3.322 3.322 0 0 1-4.696 0l-8.868-8.868Z\" style=\"fill:#fff\"/>`;\nconst laserPointerCursorIconSVG = `<path stroke=\"#1b1b1f\" fill=\"#fff\" d=\"m7.868 11.113 7.773 7.774a2.359 2.359 0 0 0 1.667.691 2.368 2.368 0 0 0 2.357-2.358c0-.625-.248-1.225-.69-1.667L11.201 7.78 9.558 9.469l-1.69 1.643v.001Zm10.273 3.606-3.333 3.333m-3.25-6.583 2 2m-7-7 3 3M3.664 3.625l1 1M2.529 6.922l1.407-.144m5.735-2.932-1.118.866M4.285 9.823l.758-1.194m1.863-6.207-.13 1.408\"/>`;\nconst laserPointerCursorDataURL_lightMode = `data:${_constants__WEBPACK_IMPORTED_MODULE_0__.MIME_TYPES.svg},${encodeURIComponent(`${laserPointerCursorSVG_tag}${laserPointerCursorIconSVG}</svg>`)}`;\nconst laserPointerCursorDataURL_darkMode = `data:${_constants__WEBPACK_IMPORTED_MODULE_0__.MIME_TYPES.svg},${encodeURIComponent(`${laserPointerCursorSVG_tag}${laserPointerCursorBackgroundSVG}${laserPointerCursorIconSVG}</svg>`)}`;\nconst resetCursor = interactiveCanvas => {\n if (interactiveCanvas) {\n interactiveCanvas.style.cursor = \"\";\n }\n};\nconst setCursor = (interactiveCanvas, cursor) => {\n if (interactiveCanvas) {\n interactiveCanvas.style.cursor = cursor;\n }\n};\nlet eraserCanvasCache;\nlet previewDataURL;\nconst setEraserCursor = (interactiveCanvas, theme) => {\n const cursorImageSizePx = 20;\n\n const drawCanvas = () => {\n const isDarkTheme = theme === _constants__WEBPACK_IMPORTED_MODULE_0__.THEME.DARK;\n eraserCanvasCache = document.createElement(\"canvas\");\n eraserCanvasCache.theme = theme;\n eraserCanvasCache.height = cursorImageSizePx;\n eraserCanvasCache.width = cursorImageSizePx;\n const context = eraserCanvasCache.getContext(\"2d\");\n context.lineWidth = 1;\n context.beginPath();\n context.arc(eraserCanvasCache.width / 2, eraserCanvasCache.height / 2, 5, 0, 2 * Math.PI);\n context.fillStyle = isDarkTheme ? open_color__WEBPACK_IMPORTED_MODULE_1__.black : open_color__WEBPACK_IMPORTED_MODULE_1__.white;\n context.fill();\n context.strokeStyle = isDarkTheme ? open_color__WEBPACK_IMPORTED_MODULE_1__.white : open_color__WEBPACK_IMPORTED_MODULE_1__.black;\n context.stroke();\n previewDataURL = eraserCanvasCache.toDataURL(_constants__WEBPACK_IMPORTED_MODULE_0__.MIME_TYPES.svg);\n };\n\n if (!eraserCanvasCache || eraserCanvasCache.theme !== theme) {\n drawCanvas();\n }\n\n setCursor(interactiveCanvas, `url(${previewDataURL}) ${cursorImageSizePx / 2} ${cursorImageSizePx / 2}, auto`);\n};\nconst setCursorForShape = (interactiveCanvas, appState) => {\n if (!interactiveCanvas) {\n return;\n }\n\n if (appState.activeTool.type === \"selection\") {\n resetCursor(interactiveCanvas);\n } else if ((0,_appState__WEBPACK_IMPORTED_MODULE_2__.isHandToolActive)(appState)) {\n interactiveCanvas.style.cursor = _constants__WEBPACK_IMPORTED_MODULE_0__.CURSOR_TYPE.GRAB;\n } else if ((0,_appState__WEBPACK_IMPORTED_MODULE_2__.isEraserActive)(appState)) {\n setEraserCursor(interactiveCanvas, appState.theme); // do nothing if image tool is selected which suggests there's\n // a image-preview set as the cursor\n // Ignore custom type as well and let host decide\n } else if (appState.activeTool.type === \"laser\") {\n const url = appState.theme === _constants__WEBPACK_IMPORTED_MODULE_0__.THEME.LIGHT ? laserPointerCursorDataURL_lightMode : laserPointerCursorDataURL_darkMode;\n interactiveCanvas.style.cursor = `url(${url}), auto`;\n } else if (![\"image\", \"custom\"].includes(appState.activeTool.type)) {\n interactiveCanvas.style.cursor = _constants__WEBPACK_IMPORTED_MODULE_0__.CURSOR_TYPE.CROSSHAIR;\n } else if (appState.activeTool.type !== \"image\") {\n interactiveCanvas.style.cursor = _constants__WEBPACK_IMPORTED_MODULE_0__.CURSOR_TYPE.AUTO;\n }\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./cursor.ts?");
2435
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"clearEraserCanvasCache\": () => (/* binding */ clearEraserCanvasCache),\n/* harmony export */ \"resetCursor\": () => (/* binding */ resetCursor),\n/* harmony export */ \"setCursor\": () => (/* binding */ setCursor),\n/* harmony export */ \"setCursorForShape\": () => (/* binding */ setCursorForShape),\n/* harmony export */ \"setEraserCursor\": () => (/* binding */ setEraserCursor)\n/* harmony export */ });\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./constants */ \"./constants.ts\");\n/* harmony import */ var open_color__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! open-color */ \"../../node_modules/open-color/open-color.json\");\n/* harmony import */ var _appState__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./appState */ \"./appState.ts\");\n\n\n\nconst laserPointerCursorSVG_tag = `<svg viewBox=\"0 0 24 24\" stroke-width=\"1\" width=\"28\" height=\"28\" xmlns=\"http://www.w3.org/2000/svg\">`;\nconst laserPointerCursorBackgroundSVG = `<path d=\"M6.164 11.755a5.314 5.314 0 0 1-4.932-5.298 5.314 5.314 0 0 1 5.311-5.311 5.314 5.314 0 0 1 5.307 5.113l8.773 8.773a3.322 3.322 0 0 1 0 4.696l-.895.895a3.322 3.322 0 0 1-4.696 0l-8.868-8.868Z\" style=\"fill:#fff\"/>`;\nconst laserPointerCursorIconSVG = `<path stroke=\"#1b1b1f\" fill=\"#fff\" d=\"m7.868 11.113 7.773 7.774a2.359 2.359 0 0 0 1.667.691 2.368 2.368 0 0 0 2.357-2.358c0-.625-.248-1.225-.69-1.667L11.201 7.78 9.558 9.469l-1.69 1.643v.001Zm10.273 3.606-3.333 3.333m-3.25-6.583 2 2m-7-7 3 3M3.664 3.625l1 1M2.529 6.922l1.407-.144m5.735-2.932-1.118.866M4.285 9.823l.758-1.194m1.863-6.207-.13 1.408\"/>`;\nconst laserPointerCursorDataURL_lightMode = `data:${_constants__WEBPACK_IMPORTED_MODULE_0__.MIME_TYPES.svg},${encodeURIComponent(`${laserPointerCursorSVG_tag}${laserPointerCursorIconSVG}</svg>`)}`;\nconst laserPointerCursorDataURL_darkMode = `data:${_constants__WEBPACK_IMPORTED_MODULE_0__.MIME_TYPES.svg},${encodeURIComponent(`${laserPointerCursorSVG_tag}${laserPointerCursorBackgroundSVG}${laserPointerCursorIconSVG}</svg>`)}`;\nconst resetCursor = interactiveCanvas => {\n if (interactiveCanvas) {\n interactiveCanvas.style.cursor = \"\";\n }\n};\nconst setCursor = (interactiveCanvas, cursor) => {\n if (interactiveCanvas) {\n interactiveCanvas.style.cursor = cursor;\n }\n};\nlet eraserCanvasCache;\nconst clearEraserCanvasCache = () => {\n eraserCanvasCache = null;\n};\nlet previewDataURL;\nconst setEraserCursor = (interactiveCanvas, theme) => {\n const cursorImageSizePx = 20;\n\n const drawCanvas = () => {\n const isDarkTheme = theme === _constants__WEBPACK_IMPORTED_MODULE_0__.THEME.DARK;\n eraserCanvasCache = document.createElement(\"canvas\");\n eraserCanvasCache.theme = theme;\n eraserCanvasCache.height = cursorImageSizePx;\n eraserCanvasCache.width = cursorImageSizePx;\n const context = eraserCanvasCache.getContext(\"2d\");\n context.lineWidth = 1;\n context.beginPath();\n context.arc(eraserCanvasCache.width / 2, eraserCanvasCache.height / 2, 5, 0, 2 * Math.PI);\n context.fillStyle = isDarkTheme ? open_color__WEBPACK_IMPORTED_MODULE_1__.black : open_color__WEBPACK_IMPORTED_MODULE_1__.white;\n context.fill();\n context.strokeStyle = isDarkTheme ? open_color__WEBPACK_IMPORTED_MODULE_1__.white : open_color__WEBPACK_IMPORTED_MODULE_1__.black;\n context.stroke();\n previewDataURL = eraserCanvasCache.toDataURL(_constants__WEBPACK_IMPORTED_MODULE_0__.MIME_TYPES.svg);\n };\n\n if (!eraserCanvasCache || eraserCanvasCache.theme !== theme) {\n drawCanvas();\n }\n\n setCursor(interactiveCanvas, `url(${previewDataURL}) ${cursorImageSizePx / 2} ${cursorImageSizePx / 2}, auto`);\n};\nconst setCursorForShape = (interactiveCanvas, appState) => {\n if (!interactiveCanvas) {\n return;\n }\n\n if (appState.activeTool.type === \"selection\") {\n resetCursor(interactiveCanvas);\n } else if ((0,_appState__WEBPACK_IMPORTED_MODULE_2__.isHandToolActive)(appState)) {\n interactiveCanvas.style.cursor = _constants__WEBPACK_IMPORTED_MODULE_0__.CURSOR_TYPE.GRAB;\n } else if ((0,_appState__WEBPACK_IMPORTED_MODULE_2__.isEraserActive)(appState)) {\n setEraserCursor(interactiveCanvas, appState.theme); // do nothing if image tool is selected which suggests there's\n // a image-preview set as the cursor\n // Ignore custom type as well and let host decide\n } else if (appState.activeTool.type === \"laser\") {\n const url = appState.theme === _constants__WEBPACK_IMPORTED_MODULE_0__.THEME.LIGHT ? laserPointerCursorDataURL_lightMode : laserPointerCursorDataURL_darkMode;\n interactiveCanvas.style.cursor = `url(${url}), auto`;\n } else if (![\"image\", \"custom\"].includes(appState.activeTool.type)) {\n interactiveCanvas.style.cursor = _constants__WEBPACK_IMPORTED_MODULE_0__.CURSOR_TYPE.CROSSHAIR;\n } else if (appState.activeTool.type !== \"image\") {\n interactiveCanvas.style.cursor = _constants__WEBPACK_IMPORTED_MODULE_0__.CURSOR_TYPE.AUTO;\n }\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./cursor.ts?");
2436
2436
 
2437
2437
  /***/ }),
2438
2438
 
@@ -2454,7 +2454,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
2454
2454
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
2455
2455
 
2456
2456
  "use strict";
2457
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"ImageURLToFile\": () => (/* binding */ ImageURLToFile),\n/* harmony export */ \"SVGStringToFile\": () => (/* binding */ SVGStringToFile),\n/* harmony export */ \"blobToArrayBuffer\": () => (/* binding */ blobToArrayBuffer),\n/* harmony export */ \"canvasToBlob\": () => (/* binding */ canvasToBlob),\n/* harmony export */ \"createFile\": () => (/* binding */ createFile),\n/* harmony export */ \"dataURLToFile\": () => (/* binding */ dataURLToFile),\n/* harmony export */ \"generateIdFromFile\": () => (/* binding */ generateIdFromFile),\n/* harmony export */ \"getDataURL\": () => (/* binding */ getDataURL),\n/* harmony export */ \"getFileFromEvent\": () => (/* binding */ getFileFromEvent),\n/* harmony export */ \"getFileHandle\": () => (/* binding */ getFileHandle),\n/* harmony export */ \"getFileHandleType\": () => (/* binding */ getFileHandleType),\n/* harmony export */ \"getMimeType\": () => (/* binding */ getMimeType),\n/* harmony export */ \"isImageFileHandle\": () => (/* binding */ isImageFileHandle),\n/* harmony export */ \"isImageFileHandleType\": () => (/* binding */ isImageFileHandleType),\n/* harmony export */ \"isSupportedImageFile\": () => (/* binding */ isSupportedImageFile),\n/* harmony export */ \"loadFromBlob\": () => (/* binding */ loadFromBlob),\n/* harmony export */ \"loadLibraryFromBlob\": () => (/* binding */ loadLibraryFromBlob),\n/* harmony export */ \"loadSceneOrLibraryFromBlob\": () => (/* binding */ loadSceneOrLibraryFromBlob),\n/* harmony export */ \"normalizeFile\": () => (/* binding */ normalizeFile),\n/* harmony export */ \"parseLibraryJSON\": () => (/* binding */ parseLibraryJSON),\n/* harmony export */ \"resizeImageFile\": () => (/* binding */ resizeImageFile)\n/* harmony export */ });\n/* harmony import */ var nanoid__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! nanoid */ \"./node_modules/nanoid/index.browser.js\");\n/* harmony import */ var _appState__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../appState */ \"./appState.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../constants */ \"./constants.ts\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../element */ \"./element/index.ts\");\n/* harmony import */ var _errors__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../errors */ \"./errors.ts\");\n/* harmony import */ var _scene__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../scene */ \"./scene/index.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _filesystem__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./filesystem */ \"./data/filesystem.ts\");\n/* harmony import */ var _json__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./json */ \"./data/json.ts\");\n/* harmony import */ var _restore__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./restore */ \"./data/restore.ts\");\n\n\n\n\n\n\n\n\n\n\n\nconst parseFileContents = async blob => {\n let contents;\n\n if (blob.type === _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.png) {\n try {\n return await (await Promise.resolve(/*! import() */).then(__webpack_require__.bind(__webpack_require__, /*! ./image */ \"./data/image.ts\"))).decodePngMetadata(blob);\n } catch (error) {\n if (error.message === \"INVALID\") {\n throw new _errors__WEBPACK_IMPORTED_MODULE_3__.ImageSceneDataError(\"Image doesn't contain scene\", \"IMAGE_NOT_CONTAINS_SCENE_DATA\");\n } else {\n throw new _errors__WEBPACK_IMPORTED_MODULE_3__.ImageSceneDataError(\"Error: cannot restore image\");\n }\n }\n } else {\n if (\"text\" in Blob) {\n contents = await blob.text();\n } else {\n contents = await new Promise(resolve => {\n const reader = new FileReader();\n reader.readAsText(blob, \"utf8\");\n\n reader.onloadend = () => {\n if (reader.readyState === FileReader.DONE) {\n resolve(reader.result);\n }\n };\n });\n }\n\n if (blob.type === _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.svg) {\n try {\n return await (await Promise.resolve(/*! import() */).then(__webpack_require__.bind(__webpack_require__, /*! ./image */ \"./data/image.ts\"))).decodeSvgMetadata({\n svg: contents\n });\n } catch (error) {\n if (error.message === \"INVALID\") {\n throw new _errors__WEBPACK_IMPORTED_MODULE_3__.ImageSceneDataError(\"Image doesn't contain scene\", \"IMAGE_NOT_CONTAINS_SCENE_DATA\");\n } else {\n throw new _errors__WEBPACK_IMPORTED_MODULE_3__.ImageSceneDataError(\"Error: cannot restore image\");\n }\n }\n }\n }\n\n return contents;\n};\n\nconst getMimeType = blob => {\n let name;\n\n if (typeof blob === \"string\") {\n name = blob;\n } else {\n if (blob.type) {\n return blob.type;\n }\n\n name = blob.name || \"\";\n }\n\n if (/\\.(excalidraw|json)$/.test(name)) {\n return _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.json;\n } else if (/\\.png$/.test(name)) {\n return _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.png;\n } else if (/\\.jpe?g$/.test(name)) {\n return _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.jpg;\n } else if (/\\.svg$/.test(name)) {\n return _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.svg;\n }\n\n return \"\";\n};\nconst getFileHandleType = handle => {\n var _a;\n\n if (!handle) {\n return null;\n }\n\n return ((_a = handle.name.match(/\\.(json|excalidraw|png|svg)$/)) === null || _a === void 0 ? void 0 : _a[1]) || null;\n};\nconst isImageFileHandleType = type => {\n return type === \"png\" || type === \"svg\";\n};\nconst isImageFileHandle = handle => {\n const type = getFileHandleType(handle);\n return type === \"png\" || type === \"svg\";\n};\nconst isSupportedImageFile = blob => {\n const {\n type\n } = blob || {};\n return !!type && Object.values(_constants__WEBPACK_IMPORTED_MODULE_1__.IMAGE_MIME_TYPES).includes(type);\n};\nconst loadSceneOrLibraryFromBlob = async (blob,\n/** @see restore.localAppState */\nlocalAppState, localElements,\n/** FileSystemHandle. Defaults to `blob.handle` if defined, otherwise null. */\nfileHandle) => {\n const contents = await parseFileContents(blob);\n let data;\n\n try {\n try {\n data = JSON.parse(contents);\n } catch (error) {\n if (isSupportedImageFile(blob)) {\n throw new _errors__WEBPACK_IMPORTED_MODULE_3__.ImageSceneDataError(\"Image doesn't contain scene\", \"IMAGE_NOT_CONTAINS_SCENE_DATA\");\n }\n\n throw error;\n }\n\n if ((0,_json__WEBPACK_IMPORTED_MODULE_7__.isValidExcalidrawData)(data)) {\n return {\n type: _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.excalidraw,\n data: (0,_restore__WEBPACK_IMPORTED_MODULE_8__.restore)({\n elements: (0,_element__WEBPACK_IMPORTED_MODULE_2__.clearElementsForExport)(data.elements || []),\n appState: Object.assign(Object.assign({\n theme: localAppState === null || localAppState === void 0 ? void 0 : localAppState.theme,\n fileHandle: fileHandle || blob.handle || null\n }, (0,_appState__WEBPACK_IMPORTED_MODULE_0__.cleanAppStateForExport)(data.appState || {})), localAppState ? (0,_scene__WEBPACK_IMPORTED_MODULE_4__.calculateScrollCenter)(data.elements || [], localAppState) : {}),\n files: data.files\n }, localAppState, localElements, {\n repairBindings: true,\n refreshDimensions: false\n })\n };\n } else if ((0,_json__WEBPACK_IMPORTED_MODULE_7__.isValidLibrary)(data)) {\n return {\n type: _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.excalidrawlib,\n data\n };\n }\n\n throw new Error(\"Error: invalid file\");\n } catch (error) {\n if (error instanceof _errors__WEBPACK_IMPORTED_MODULE_3__.ImageSceneDataError) {\n throw error;\n }\n\n throw new Error(\"Error: invalid file\");\n }\n};\nconst loadFromBlob = async (blob,\n/** @see restore.localAppState */\nlocalAppState, localElements,\n/** FileSystemHandle. Defaults to `blob.handle` if defined, otherwise null. */\nfileHandle) => {\n const ret = await loadSceneOrLibraryFromBlob(blob, localAppState, localElements, fileHandle);\n\n if (ret.type !== _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.excalidraw) {\n throw new Error(\"Error: invalid file\");\n }\n\n return ret.data;\n};\nconst parseLibraryJSON = (json, defaultStatus = \"unpublished\") => {\n const data = JSON.parse(json);\n\n if (!(0,_json__WEBPACK_IMPORTED_MODULE_7__.isValidLibrary)(data)) {\n throw new Error(\"Invalid library\");\n }\n\n const libraryItems = data.libraryItems || data.library;\n return (0,_restore__WEBPACK_IMPORTED_MODULE_8__.restoreLibraryItems)(libraryItems, defaultStatus);\n};\nconst loadLibraryFromBlob = async (blob, defaultStatus = \"unpublished\") => {\n return parseLibraryJSON(await parseFileContents(blob), defaultStatus);\n};\nconst canvasToBlob = async canvas => {\n return new Promise(async (resolve, reject) => {\n try {\n if ((0,_utils__WEBPACK_IMPORTED_MODULE_5__.isPromiseLike)(canvas)) {\n canvas = await canvas;\n }\n\n canvas.toBlob(blob => {\n if (!blob) {\n return reject(new _errors__WEBPACK_IMPORTED_MODULE_3__.CanvasError(\"Error: Canvas too big\", \"CANVAS_POSSIBLY_TOO_BIG\"));\n }\n\n resolve(blob);\n });\n } catch (error) {\n reject(error);\n }\n });\n};\n/** generates SHA-1 digest from supplied file (if not supported, falls back\r\n to a 40-char base64 random id) */\n\nconst generateIdFromFile = async file => {\n try {\n const hashBuffer = await window.crypto.subtle.digest(\"SHA-1\", await blobToArrayBuffer(file));\n return (0,_utils__WEBPACK_IMPORTED_MODULE_5__.bytesToHexString)(new Uint8Array(hashBuffer));\n } catch (error) {\n console.error(error); // length 40 to align with the HEX length of SHA-1 (which is 160 bit)\n\n return (0,nanoid__WEBPACK_IMPORTED_MODULE_9__.nanoid)(40);\n }\n};\nconst getDataURL = async file => {\n return new Promise((resolve, reject) => {\n const reader = new FileReader();\n\n reader.onload = () => {\n const dataURL = reader.result;\n resolve(dataURL);\n };\n\n reader.onerror = error => reject(error);\n\n reader.readAsDataURL(file);\n });\n};\nconst dataURLToFile = (dataURL, filename = \"\") => {\n const dataIndexStart = dataURL.indexOf(\",\");\n const byteString = atob(dataURL.slice(dataIndexStart + 1));\n const mimeType = dataURL.slice(0, dataIndexStart).split(\":\")[1].split(\";\")[0];\n const ab = new ArrayBuffer(byteString.length);\n const ia = new Uint8Array(ab);\n\n for (let i = 0; i < byteString.length; i++) {\n ia[i] = byteString.charCodeAt(i);\n }\n\n return new File([ab], filename, {\n type: mimeType\n });\n};\nconst resizeImageFile = async (file, opts) => {\n // SVG files shouldn't a can't be resized\n if (file.type === _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.svg) {\n return file;\n }\n\n const [pica, imageBlobReduce] = await Promise.all([Promise.resolve(/*! import() */).then(__webpack_require__.t.bind(__webpack_require__, /*! pica */ \"../../node_modules/pica/dist/pica.js\", 23)).then(res => res.default), // a wrapper for pica for better API\n Promise.resolve(/*! import() */).then(__webpack_require__.bind(__webpack_require__, /*! image-blob-reduce */ \"../../node_modules/image-blob-reduce/dist/image-blob-reduce.esm.mjs\")).then(res => res.default)]); // CRA's minification settings break pica in WebWorkers, so let's disable\n // them for now\n // https://github.com/nodeca/image-blob-reduce/issues/21#issuecomment-757365513\n\n const reduce = imageBlobReduce({\n pica: pica({\n features: [\"js\", \"wasm\"]\n })\n });\n\n if (opts.outputType) {\n const {\n outputType\n } = opts;\n\n reduce._create_blob = function (env) {\n return this.pica.toBlob(env.out_canvas, outputType, 0.8).then(blob => {\n env.out_blob = blob;\n return env;\n });\n };\n }\n\n if (!isSupportedImageFile(file)) {\n throw new Error(\"Error: unsupported file type\", {\n cause: \"UNSUPPORTED\"\n });\n }\n\n return new File([await reduce.toBlob(file, {\n max: opts.maxWidthOrHeight\n })], file.name, {\n type: opts.outputType || file.type\n });\n};\nconst SVGStringToFile = (SVGString, filename = \"\") => {\n return new File([new TextEncoder().encode(SVGString)], filename, {\n type: _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.svg\n });\n};\nconst ImageURLToFile = async (imageUrl, filename = \"\") => {\n let response;\n\n try {\n response = await fetch(imageUrl);\n } catch (error) {\n throw new Error(\"Error: failed to fetch image\", {\n cause: \"FETCH_ERROR\"\n });\n }\n\n if (!response.ok) {\n throw new Error(\"Error: failed to fetch image\", {\n cause: \"FETCH_ERROR\"\n });\n }\n\n const blob = await response.blob();\n\n if (blob.type && isSupportedImageFile(blob)) {\n const name = filename || blob.name || \"\";\n return new File([blob], name, {\n type: blob.type\n });\n }\n\n throw new Error(\"Error: unsupported file type\", {\n cause: \"UNSUPPORTED\"\n });\n};\nconst getFileFromEvent = async event => {\n const file = event.dataTransfer.files.item(0);\n const fileHandle = await getFileHandle(event);\n return {\n file: file ? await normalizeFile(file) : null,\n fileHandle\n };\n};\nconst getFileHandle = async event => {\n if (_filesystem__WEBPACK_IMPORTED_MODULE_6__.nativeFileSystemSupported) {\n try {\n const item = event.dataTransfer.items[0];\n const handle = (await item.getAsFileSystemHandle()) || null;\n return handle;\n } catch (error) {\n console.warn(error.name, error.message);\n return null;\n }\n }\n\n return null;\n};\n/**\r\n * attempts to detect if a buffer is a valid image by checking its leading bytes\r\n */\n\nconst getActualMimeTypeFromImage = buffer => {\n let mimeType = null;\n const first8Bytes = `${[...new Uint8Array(buffer).slice(0, 8)].join(\" \")} `; // uint8 leading bytes\n\n const headerBytes = {\n // https://en.wikipedia.org/wiki/Portable_Network_Graphics#File_header\n png: \"137 80 78 71 13 10 26 10 \",\n // https://en.wikipedia.org/wiki/JPEG#Syntax_and_structure\n // jpg is a bit wonky. Checking the first three bytes should be enough,\n // but may yield false positives. (https://stackoverflow.com/a/23360709/927631)\n jpg: \"255 216 255 \",\n // https://en.wikipedia.org/wiki/GIF#Example_GIF_file\n gif: \"71 73 70 56 57 97 \"\n };\n\n if (first8Bytes === headerBytes.png) {\n mimeType = _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.png;\n } else if (first8Bytes.startsWith(headerBytes.jpg)) {\n mimeType = _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.jpg;\n } else if (first8Bytes.startsWith(headerBytes.gif)) {\n mimeType = _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.gif;\n }\n\n return mimeType;\n};\n\nconst createFile = (blob, mimeType, name) => {\n return new File([blob], name || \"\", {\n type: mimeType\n });\n};\n/** attempts to detect correct mimeType if none is set, or if an image\r\n * has an incorrect extension.\r\n * Note: doesn't handle missing .excalidraw/.excalidrawlib extension */\n\nconst normalizeFile = async file => {\n var _a, _b;\n\n if (!file.type) {\n if ((_a = file === null || file === void 0 ? void 0 : file.name) === null || _a === void 0 ? void 0 : _a.endsWith(\".excalidrawlib\")) {\n file = createFile(await blobToArrayBuffer(file), _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.excalidrawlib, file.name);\n } else if ((_b = file === null || file === void 0 ? void 0 : file.name) === null || _b === void 0 ? void 0 : _b.endsWith(\".excalidraw\")) {\n file = createFile(await blobToArrayBuffer(file), _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.excalidraw, file.name);\n } else {\n const buffer = await blobToArrayBuffer(file);\n const mimeType = getActualMimeTypeFromImage(buffer);\n\n if (mimeType) {\n file = createFile(buffer, mimeType, file.name);\n }\n } // when the file is an image, make sure the extension corresponds to the\n // actual mimeType (this is an edge case, but happens sometime)\n\n } else if (isSupportedImageFile(file)) {\n const buffer = await blobToArrayBuffer(file);\n const mimeType = getActualMimeTypeFromImage(buffer);\n\n if (mimeType && mimeType !== file.type) {\n file = createFile(buffer, mimeType, file.name);\n }\n }\n\n return file;\n};\nconst blobToArrayBuffer = blob => {\n if (\"arrayBuffer\" in blob) {\n return blob.arrayBuffer();\n } // Safari\n\n\n return new Promise((resolve, reject) => {\n const reader = new FileReader();\n\n reader.onload = event => {\n var _a;\n\n if (!((_a = event.target) === null || _a === void 0 ? void 0 : _a.result)) {\n return reject(new Error(\"Couldn't convert blob to ArrayBuffer\"));\n }\n\n resolve(event.target.result);\n };\n\n reader.readAsArrayBuffer(blob);\n });\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./data/blob.ts?");
2457
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"ImageURLToFile\": () => (/* binding */ ImageURLToFile),\n/* harmony export */ \"SVGStringToFile\": () => (/* binding */ SVGStringToFile),\n/* harmony export */ \"blobToArrayBuffer\": () => (/* binding */ blobToArrayBuffer),\n/* harmony export */ \"canvasToBlob\": () => (/* binding */ canvasToBlob),\n/* harmony export */ \"createFile\": () => (/* binding */ createFile),\n/* harmony export */ \"dataURLToFile\": () => (/* binding */ dataURLToFile),\n/* harmony export */ \"generateIdFromFile\": () => (/* binding */ generateIdFromFile),\n/* harmony export */ \"getDataURL\": () => (/* binding */ getDataURL),\n/* harmony export */ \"getFileFromEvent\": () => (/* binding */ getFileFromEvent),\n/* harmony export */ \"getFileHandle\": () => (/* binding */ getFileHandle),\n/* harmony export */ \"getFileHandleType\": () => (/* binding */ getFileHandleType),\n/* harmony export */ \"getMimeType\": () => (/* binding */ getMimeType),\n/* harmony export */ \"isImageFileHandle\": () => (/* binding */ isImageFileHandle),\n/* harmony export */ \"isImageFileHandleType\": () => (/* binding */ isImageFileHandleType),\n/* harmony export */ \"isSupportedImageFile\": () => (/* binding */ isSupportedImageFile),\n/* harmony export */ \"loadFromBlob\": () => (/* binding */ loadFromBlob),\n/* harmony export */ \"loadLibraryFromBlob\": () => (/* binding */ loadLibraryFromBlob),\n/* harmony export */ \"loadSceneOrLibraryFromBlob\": () => (/* binding */ loadSceneOrLibraryFromBlob),\n/* harmony export */ \"normalizeFile\": () => (/* binding */ normalizeFile),\n/* harmony export */ \"parseLibraryJSON\": () => (/* binding */ parseLibraryJSON),\n/* harmony export */ \"resizeImageFile\": () => (/* binding */ resizeImageFile)\n/* harmony export */ });\n/* harmony import */ var nanoid__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! nanoid */ \"./node_modules/nanoid/index.browser.js\");\n/* harmony import */ var _appState__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../appState */ \"./appState.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../constants */ \"./constants.ts\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../element */ \"./element/index.ts\");\n/* harmony import */ var _errors__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../errors */ \"./errors.ts\");\n/* harmony import */ var _scene__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../scene */ \"./scene/index.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _filesystem__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./filesystem */ \"./data/filesystem.ts\");\n/* harmony import */ var _json__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./json */ \"./data/json.ts\");\n/* harmony import */ var _restore__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./restore */ \"./data/restore.ts\");\n\n\n\n\n\n\n\n\n\n\n\nconst parseFileContents = async blob => {\n let contents;\n\n if (blob.type === _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.png) {\n try {\n return await (await Promise.resolve(/*! import() */).then(__webpack_require__.bind(__webpack_require__, /*! ./image */ \"./data/image.ts\"))).decodePngMetadata(blob);\n } catch (error) {\n if (error.message === \"INVALID\") {\n throw new _errors__WEBPACK_IMPORTED_MODULE_3__.ImageSceneDataError(\"Image doesn't contain scene\", \"IMAGE_NOT_CONTAINS_SCENE_DATA\");\n } else {\n throw new _errors__WEBPACK_IMPORTED_MODULE_3__.ImageSceneDataError(\"Error: cannot restore image\");\n }\n }\n } else {\n if (\"text\" in Blob) {\n contents = await blob.text();\n } else {\n contents = await new Promise(resolve => {\n const reader = new FileReader();\n reader.readAsText(blob, \"utf8\");\n\n reader.onloadend = () => {\n if (reader.readyState === FileReader.DONE) {\n resolve(reader.result);\n }\n };\n });\n }\n\n if (blob.type === _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.svg) {\n try {\n return await (await Promise.resolve(/*! import() */).then(__webpack_require__.bind(__webpack_require__, /*! ./image */ \"./data/image.ts\"))).decodeSvgMetadata({\n svg: contents\n });\n } catch (error) {\n if (error.message === \"INVALID\") {\n throw new _errors__WEBPACK_IMPORTED_MODULE_3__.ImageSceneDataError(\"Image doesn't contain scene\", \"IMAGE_NOT_CONTAINS_SCENE_DATA\");\n } else {\n throw new _errors__WEBPACK_IMPORTED_MODULE_3__.ImageSceneDataError(\"Error: cannot restore image\");\n }\n }\n }\n }\n\n return contents;\n};\n\nconst getMimeType = blob => {\n let name;\n\n if (typeof blob === \"string\") {\n name = blob;\n } else {\n if (blob.type) {\n return blob.type;\n }\n\n name = blob.name || \"\";\n }\n\n if (/\\.(excalidraw|json)$/.test(name)) {\n return _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.json;\n } else if (/\\.png$/.test(name)) {\n return _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.png;\n } else if (/\\.jpe?g$/.test(name)) {\n return _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.jpg;\n } else if (/\\.svg$/.test(name)) {\n return _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.svg;\n }\n\n return \"\";\n};\nconst getFileHandleType = handle => {\n var _a;\n\n if (!handle) {\n return null;\n }\n\n return ((_a = handle.name.match(/\\.(json|excalidraw|png|svg)$/)) === null || _a === void 0 ? void 0 : _a[1]) || null;\n};\nconst isImageFileHandleType = type => {\n return type === \"png\" || type === \"svg\";\n};\nconst isImageFileHandle = handle => {\n const type = getFileHandleType(handle);\n return type === \"png\" || type === \"svg\";\n};\nconst isSupportedImageFile = blob => {\n const {\n type\n } = blob || {};\n return !!type && Object.values(_constants__WEBPACK_IMPORTED_MODULE_1__.IMAGE_MIME_TYPES).includes(type);\n};\nconst loadSceneOrLibraryFromBlob = async (blob,\n/** @see restore.localAppState */\nlocalAppState, localElements,\n/** FileSystemHandle. Defaults to `blob.handle` if defined, otherwise null. */\nfileHandle) => {\n const contents = await parseFileContents(blob);\n let data;\n\n try {\n try {\n data = JSON.parse(contents);\n } catch (error) {\n if (isSupportedImageFile(blob)) {\n throw new _errors__WEBPACK_IMPORTED_MODULE_3__.ImageSceneDataError(\"Image doesn't contain scene\", \"IMAGE_NOT_CONTAINS_SCENE_DATA\");\n }\n\n throw error;\n }\n\n if ((0,_json__WEBPACK_IMPORTED_MODULE_7__.isValidExcalidrawData)(data)) {\n return {\n type: _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.excalidraw,\n data: (0,_restore__WEBPACK_IMPORTED_MODULE_8__.restore)({\n elements: (0,_element__WEBPACK_IMPORTED_MODULE_2__.clearElementsForExport)(data.elements || []),\n appState: Object.assign(Object.assign({\n theme: localAppState === null || localAppState === void 0 ? void 0 : localAppState.theme,\n fileHandle: fileHandle || blob.handle || null\n }, (0,_appState__WEBPACK_IMPORTED_MODULE_0__.cleanAppStateForExport)(data.appState || {})), localAppState ? (0,_scene__WEBPACK_IMPORTED_MODULE_4__.calculateScrollCenter)(data.elements || [], localAppState) : {}),\n files: data.files\n }, localAppState, localElements, {\n repairBindings: true,\n refreshDimensions: false\n })\n };\n } else if ((0,_json__WEBPACK_IMPORTED_MODULE_7__.isValidLibrary)(data)) {\n return {\n type: _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.excalidrawlib,\n data\n };\n }\n\n throw new Error(\"Error: invalid file\");\n } catch (error) {\n if (error instanceof _errors__WEBPACK_IMPORTED_MODULE_3__.ImageSceneDataError) {\n throw error;\n }\n\n throw new Error(\"Error: invalid file\");\n }\n};\nconst loadFromBlob = async (blob,\n/** @see restore.localAppState */\nlocalAppState, localElements,\n/** FileSystemHandle. Defaults to `blob.handle` if defined, otherwise null. */\nfileHandle) => {\n const ret = await loadSceneOrLibraryFromBlob(blob, localAppState, localElements, fileHandle);\n\n if (ret.type !== _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.excalidraw) {\n throw new Error(\"Error: invalid file\");\n }\n\n return ret.data;\n};\nconst parseLibraryJSON = (json, defaultStatus = \"unpublished\") => {\n const data = JSON.parse(json);\n\n if (!(0,_json__WEBPACK_IMPORTED_MODULE_7__.isValidLibrary)(data)) {\n throw new Error(\"Invalid library\");\n }\n\n const libraryItems = data.libraryItems || data.library;\n return (0,_restore__WEBPACK_IMPORTED_MODULE_8__.restoreLibraryItems)(libraryItems, defaultStatus);\n};\nconst loadLibraryFromBlob = async (blob, defaultStatus = \"unpublished\") => {\n return parseLibraryJSON(await parseFileContents(blob), defaultStatus);\n};\nconst canvasToBlob = async canvas => {\n return new Promise(async (resolve, reject) => {\n try {\n if ((0,_utils__WEBPACK_IMPORTED_MODULE_5__.isPromiseLike)(canvas)) {\n canvas = await canvas;\n }\n\n canvas.toBlob(blob => {\n if (!blob) {\n return reject(new _errors__WEBPACK_IMPORTED_MODULE_3__.CanvasError(\"Error: Canvas too big\", \"CANVAS_POSSIBLY_TOO_BIG\"));\n }\n\n resolve(blob);\n });\n } catch (error) {\n reject(error);\n }\n });\n};\n/** generates SHA-1 digest from supplied file (if not supported, falls back\r\n to a 40-char base64 random id) */\n\nconst generateIdFromFile = async file => {\n try {\n const hashBuffer = await window.crypto.subtle.digest(\"SHA-1\", await blobToArrayBuffer(file));\n return (0,_utils__WEBPACK_IMPORTED_MODULE_5__.bytesToHexString)(new Uint8Array(hashBuffer));\n } catch (error) {\n console.error(error); // length 40 to align with the HEX length of SHA-1 (which is 160 bit)\n\n return (0,nanoid__WEBPACK_IMPORTED_MODULE_9__.nanoid)(40);\n }\n};\nconst getDataURL = async file => {\n return new Promise((resolve, reject) => {\n const reader = new FileReader();\n\n reader.onload = () => {\n const dataURL = reader.result;\n resolve(dataURL);\n };\n\n reader.onerror = error => reject(error);\n\n reader.readAsDataURL(file);\n });\n};\nconst dataURLToFile = (dataURL, filename = \"\") => {\n const dataIndexStart = dataURL.indexOf(\",\");\n const byteString = atob(dataURL.slice(dataIndexStart + 1));\n const mimeType = dataURL.slice(0, dataIndexStart).split(\":\")[1].split(\";\")[0];\n const ab = new ArrayBuffer(byteString.length);\n const ia = new Uint8Array(ab);\n\n for (let i = 0; i < byteString.length; i++) {\n ia[i] = byteString.charCodeAt(i);\n }\n\n return new File([ab], filename, {\n type: mimeType\n });\n};\nconst resizeImageFile = async (file, opts) => {\n // SVG files shouldn't a can't be resized\n if (file.type === _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.svg) {\n return file;\n }\n\n const [pica, imageBlobReduce] = await Promise.all([Promise.resolve(/*! import() */).then(__webpack_require__.t.bind(__webpack_require__, /*! pica */ \"../../node_modules/pica/dist/pica.js\", 23)).then(res => res.default), // a wrapper for pica for better API\n Promise.resolve(/*! import() */).then(__webpack_require__.bind(__webpack_require__, /*! image-blob-reduce */ \"../../node_modules/image-blob-reduce/dist/image-blob-reduce.esm.mjs\")).then(res => res.default)]); // CRA's minification settings break pica in WebWorkers, so let's disable\n // them for now\n // https://github.com/nodeca/image-blob-reduce/issues/21#issuecomment-757365513\n\n const reduce = imageBlobReduce({\n pica: pica({\n features: [\"js\", \"wasm\"]\n })\n });\n\n if (opts.outputType) {\n const {\n outputType\n } = opts;\n\n reduce._create_blob = function (env) {\n return this.pica.toBlob(env.out_canvas, outputType, 0.8).then(blob => {\n env.out_blob = blob;\n return env;\n });\n };\n }\n\n if (!isSupportedImageFile(file)) {\n throw new Error(\"Error: unsupported file type\", {\n cause: \"UNSUPPORTED\"\n });\n }\n\n return new File([await reduce.toBlob(file, {\n max: opts.maxWidthOrHeight\n })], file.name, {\n type: opts.outputType || file.type\n });\n};\nconst SVGStringToFile = (SVGString, filename = \"\") => {\n return new File([new TextEncoder().encode(SVGString)], filename, {\n type: _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.svg\n });\n};\nconst ImageURLToFile = async (imageUrl, filename = \"\") => {\n let response;\n\n try {\n response = await fetch(imageUrl);\n } catch (error) {\n throw new Error(\"Error: failed to fetch image\", {\n cause: \"FETCH_ERROR\"\n });\n }\n\n if (!response.ok) {\n throw new Error(\"Error: failed to fetch image\", {\n cause: \"FETCH_ERROR\"\n });\n }\n\n const blob = await response.blob();\n\n if (blob.type && isSupportedImageFile(blob)) {\n const name = filename || blob.name || \"\";\n return new File([blob], name, {\n type: blob.type\n });\n }\n\n throw new Error(\"Error: unsupported file type\", {\n cause: \"UNSUPPORTED\"\n });\n};\nconst getFileFromEvent = async event => {\n const file = event.dataTransfer.files.item(0);\n const fileHandle = await getFileHandle(event);\n return {\n file: file ? await normalizeFile(file) : null,\n fileHandle\n };\n};\nconst getFileHandle = async event => {\n if (_filesystem__WEBPACK_IMPORTED_MODULE_6__.nativeFileSystemSupported) {\n try {\n const item = event.dataTransfer.items[0];\n\n if (!item) {\n //zsviczian (Obsidian move tab to new pane generates a drop event without an item)\n return null;\n }\n\n const handle = (await item.getAsFileSystemHandle()) || null;\n return handle;\n } catch (error) {\n console.warn(error.name, error.message);\n return null;\n }\n }\n\n return null;\n};\n/**\r\n * attempts to detect if a buffer is a valid image by checking its leading bytes\r\n */\n\nconst getActualMimeTypeFromImage = buffer => {\n let mimeType = null;\n const first8Bytes = `${[...new Uint8Array(buffer).slice(0, 8)].join(\" \")} `; // uint8 leading bytes\n\n const headerBytes = {\n // https://en.wikipedia.org/wiki/Portable_Network_Graphics#File_header\n png: \"137 80 78 71 13 10 26 10 \",\n // https://en.wikipedia.org/wiki/JPEG#Syntax_and_structure\n // jpg is a bit wonky. Checking the first three bytes should be enough,\n // but may yield false positives. (https://stackoverflow.com/a/23360709/927631)\n jpg: \"255 216 255 \",\n // https://en.wikipedia.org/wiki/GIF#Example_GIF_file\n gif: \"71 73 70 56 57 97 \"\n };\n\n if (first8Bytes === headerBytes.png) {\n mimeType = _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.png;\n } else if (first8Bytes.startsWith(headerBytes.jpg)) {\n mimeType = _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.jpg;\n } else if (first8Bytes.startsWith(headerBytes.gif)) {\n mimeType = _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.gif;\n }\n\n return mimeType;\n};\n\nconst createFile = (blob, mimeType, name) => {\n return new File([blob], name || \"\", {\n type: mimeType\n });\n};\n/** attempts to detect correct mimeType if none is set, or if an image\r\n * has an incorrect extension.\r\n * Note: doesn't handle missing .excalidraw/.excalidrawlib extension */\n\nconst normalizeFile = async file => {\n var _a, _b;\n\n if (!file.type) {\n if ((_a = file === null || file === void 0 ? void 0 : file.name) === null || _a === void 0 ? void 0 : _a.endsWith(\".excalidrawlib\")) {\n file = createFile(await blobToArrayBuffer(file), _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.excalidrawlib, file.name);\n } else if ((_b = file === null || file === void 0 ? void 0 : file.name) === null || _b === void 0 ? void 0 : _b.endsWith(\".excalidraw\")) {\n file = createFile(await blobToArrayBuffer(file), _constants__WEBPACK_IMPORTED_MODULE_1__.MIME_TYPES.excalidraw, file.name);\n } else {\n const buffer = await blobToArrayBuffer(file);\n const mimeType = getActualMimeTypeFromImage(buffer);\n\n if (mimeType) {\n file = createFile(buffer, mimeType, file.name);\n }\n } // when the file is an image, make sure the extension corresponds to the\n // actual mimeType (this is an edge case, but happens sometime)\n\n } else if (isSupportedImageFile(file)) {\n const buffer = await blobToArrayBuffer(file);\n const mimeType = getActualMimeTypeFromImage(buffer);\n\n if (mimeType && mimeType !== file.type) {\n file = createFile(buffer, mimeType, file.name);\n }\n }\n\n return file;\n};\nconst blobToArrayBuffer = blob => {\n if (\"arrayBuffer\" in blob) {\n return blob.arrayBuffer();\n } // Safari\n\n\n return new Promise((resolve, reject) => {\n const reader = new FileReader();\n\n reader.onload = event => {\n var _a;\n\n if (!((_a = event.target) === null || _a === void 0 ? void 0 : _a.result)) {\n return reject(new Error(\"Couldn't convert blob to ArrayBuffer\"));\n }\n\n resolve(event.target.result);\n };\n\n reader.readAsArrayBuffer(blob);\n });\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./data/blob.ts?");
2458
2458
 
2459
2459
  /***/ }),
2460
2460
 
@@ -2641,7 +2641,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
2641
2641
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
2642
2642
 
2643
2643
  "use strict";
2644
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"BindableElement\": () => (/* binding */ BindableElement),\n/* harmony export */ \"BoundElement\": () => (/* binding */ BoundElement),\n/* harmony export */ \"bindLinearElement\": () => (/* binding */ bindLinearElement),\n/* harmony export */ \"bindOrUnbindLinearElement\": () => (/* binding */ bindOrUnbindLinearElement),\n/* harmony export */ \"bindOrUnbindLinearElements\": () => (/* binding */ bindOrUnbindLinearElements),\n/* harmony export */ \"bindingProperties\": () => (/* binding */ bindingProperties),\n/* harmony export */ \"determineFocusDistance\": () => (/* binding */ determineFocusDistance),\n/* harmony export */ \"fixBindingsAfterDeletion\": () => (/* binding */ fixBindingsAfterDeletion),\n/* harmony export */ \"fixBindingsAfterDuplication\": () => (/* binding */ fixBindingsAfterDuplication),\n/* harmony export */ \"getHoveredElementForBinding\": () => (/* binding */ getHoveredElementForBinding),\n/* harmony export */ \"getSuggestedBindingsForArrows\": () => (/* binding */ getSuggestedBindingsForArrows),\n/* harmony export */ \"intersectElementWithLine\": () => (/* binding */ intersectElementWithLine),\n/* harmony export */ \"isBindingEnabled\": () => (/* binding */ isBindingEnabled),\n/* harmony export */ \"isLinearElementSimpleAndAlreadyBound\": () => (/* binding */ isLinearElementSimpleAndAlreadyBound),\n/* harmony export */ \"maxBindingGap\": () => (/* binding */ maxBindingGap),\n/* harmony export */ \"maybeBindLinearElement\": () => (/* binding */ maybeBindLinearElement),\n/* harmony export */ \"shouldEnableBindingForPointerEvent\": () => (/* binding */ shouldEnableBindingForPointerEvent),\n/* harmony export */ \"updateBoundElements\": () => (/* binding */ updateBoundElements)\n/* harmony export */ });\n/* harmony import */ var _ga__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../ga */ \"./ga.ts\");\n/* harmony import */ var _gapoints__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../gapoints */ \"./gapoints.ts\");\n/* harmony import */ var _gadirections__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../gadirections */ \"./gadirections.ts\");\n/* harmony import */ var _galines__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../galines */ \"./galines.ts\");\n/* harmony import */ var _gatransforms__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../gatransforms */ \"./gatransforms.ts\");\n/* harmony import */ var _bounds__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _utils_collision__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../utils/collision */ \"../utils/collision.ts\");\n/* harmony import */ var _scene__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../scene */ \"./scene/index.ts\");\n/* harmony import */ var _typeChecks__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _mutateElement__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _scene_Scene__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../scene/Scene */ \"./scene/Scene.ts\");\n/* harmony import */ var _linearElementEditor__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./linearElementEditor */ \"./element/linearElementEditor.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _keys__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../keys */ \"./keys.ts\");\n/* harmony import */ var _textElement__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./textElement */ \"./element/textElement.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nconst shouldEnableBindingForPointerEvent = event => {\n return !event[_keys__WEBPACK_IMPORTED_MODULE_13__.KEYS.CTRL_OR_CMD];\n};\nconst isBindingEnabled = appState => {\n return appState.invertBindingBehaviour //zsviczian\n ? !appState.isBindingEnabled : appState.isBindingEnabled;\n};\n\nconst getNonDeletedElements = (scene, ids) => {\n const result = [];\n ids.forEach(id => {\n const element = scene.getNonDeletedElement(id);\n\n if (element != null) {\n result.push(element);\n }\n });\n return result;\n};\n\nconst bindOrUnbindLinearElement = (linearElement, startBindingElement, endBindingElement, elementsMap) => {\n const boundToElementIds = new Set();\n const unboundFromElementIds = new Set();\n bindOrUnbindLinearElementEdge(linearElement, startBindingElement, endBindingElement, \"start\", boundToElementIds, unboundFromElementIds, elementsMap);\n bindOrUnbindLinearElementEdge(linearElement, endBindingElement, startBindingElement, \"end\", boundToElementIds, unboundFromElementIds, elementsMap);\n const onlyUnbound = Array.from(unboundFromElementIds).filter(id => !boundToElementIds.has(id));\n getNonDeletedElements(_scene_Scene__WEBPACK_IMPORTED_MODULE_10__[\"default\"].getScene(linearElement), onlyUnbound).forEach(element => {\n var _a;\n\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement)(element, {\n boundElements: (_a = element.boundElements) === null || _a === void 0 ? void 0 : _a.filter(element => element.type !== \"arrow\" || element.id !== linearElement.id)\n });\n });\n};\n\nconst bindOrUnbindLinearElementEdge = (linearElement, bindableElement, otherEdgeBindableElement, startOrEnd, // Is mutated\nboundToElementIds, // Is mutated\nunboundFromElementIds, elementsMap) => {\n // \"keep\" is for method chaining convenience, a \"no-op\", so just bail out\n if (bindableElement === \"keep\") {\n return;\n } // null means break the bind, so nothing to consider here\n\n\n if (bindableElement === null) {\n const unbound = unbindLinearElement(linearElement, startOrEnd);\n\n if (unbound != null) {\n unboundFromElementIds.add(unbound);\n }\n\n return;\n } // While complext arrows can do anything, simple arrow with both ends trying\n // to bind to the same bindable should not be allowed, start binding takes\n // precedence\n\n\n if (isLinearElementSimple(linearElement)) {\n if (otherEdgeBindableElement == null || (otherEdgeBindableElement === \"keep\" ? // TODO: Refactor - Needlessly complex\n !isLinearElementSimpleAndAlreadyBoundOnOppositeEdge(linearElement, bindableElement, startOrEnd) : startOrEnd === \"start\" || otherEdgeBindableElement.id !== bindableElement.id)) {\n bindLinearElement(linearElement, bindableElement, startOrEnd, elementsMap);\n boundToElementIds.add(bindableElement.id);\n }\n } else {\n bindLinearElement(linearElement, bindableElement, startOrEnd, elementsMap);\n boundToElementIds.add(bindableElement.id);\n }\n};\n\nconst getOriginalBindingIfStillCloseOfLinearElementEdge = (linearElement, edge, app) => {\n var _a, _b;\n\n const elementsMap = app.scene.getNonDeletedElementsMap();\n const coors = getLinearElementEdgeCoors(linearElement, edge, elementsMap);\n const elementId = edge === \"start\" ? (_a = linearElement.startBinding) === null || _a === void 0 ? void 0 : _a.elementId : (_b = linearElement.endBinding) === null || _b === void 0 ? void 0 : _b.elementId;\n\n if (elementId) {\n const element = elementsMap.get(elementId);\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isBindableElement)(element) && bindingBorderTest(element, coors, app)) {\n return element;\n }\n }\n\n return null;\n};\n\nconst getOriginalBindingsIfStillCloseToArrowEnds = (linearElement, app) => [\"start\", \"end\"].map(edge => getOriginalBindingIfStillCloseOfLinearElementEdge(linearElement, edge, app));\n\nconst getBindingStrategyForDraggingArrowEndpoints = (selectedElement, isBindingEnabled, draggingPoints, app) => {\n const startIdx = 0;\n const endIdx = selectedElement.points.length - 1;\n const startDragged = draggingPoints.findIndex(i => i === startIdx) > -1;\n const endDragged = draggingPoints.findIndex(i => i === endIdx) > -1;\n const start = startDragged ? isBindingEnabled ? getElligibleElementForBindingElement(selectedElement, \"start\", app) : null // If binding is disabled and start is dragged, break all binds\n : // We have to update the focus and gap of the binding, so let's rebind\n getElligibleElementForBindingElement(selectedElement, \"start\", app);\n const end = endDragged ? isBindingEnabled ? getElligibleElementForBindingElement(selectedElement, \"end\", app) : null // If binding is disabled and end is dragged, break all binds\n : // We have to update the focus and gap of the binding, so let's rebind\n getElligibleElementForBindingElement(selectedElement, \"end\", app);\n return [start, end];\n};\n\nconst getBindingStrategyForDraggingArrowOrJoints = (selectedElement, app, isBindingEnabled) => {\n const [startIsClose, endIsClose] = getOriginalBindingsIfStillCloseToArrowEnds(selectedElement, app);\n const start = startIsClose ? isBindingEnabled ? getElligibleElementForBindingElement(selectedElement, \"start\", app) : null : null;\n const end = endIsClose ? isBindingEnabled ? getElligibleElementForBindingElement(selectedElement, \"end\", app) : null : null;\n return [start, end];\n};\n\nconst bindOrUnbindLinearElements = (selectedElements, app, isBindingEnabled, draggingPoints) => {\n selectedElements.forEach(selectedElement => {\n const [start, end] = (draggingPoints === null || draggingPoints === void 0 ? void 0 : draggingPoints.length) ? // The arrow edge points are dragged (i.e. start, end)\n getBindingStrategyForDraggingArrowEndpoints(selectedElement, isBindingEnabled, draggingPoints !== null && draggingPoints !== void 0 ? draggingPoints : [], app) : // The arrow itself (the shaft) or the inner joins are dragged\n getBindingStrategyForDraggingArrowOrJoints(selectedElement, app, isBindingEnabled);\n bindOrUnbindLinearElement(selectedElement, start, end, app.scene.getNonDeletedElementsMap());\n });\n};\nconst getSuggestedBindingsForArrows = (selectedElements, app) => {\n // HOT PATH: Bail out if selected elements list is too large\n if (selectedElements.length > 50) {\n return [];\n }\n\n return selectedElements.filter(_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isLinearElement).flatMap(element => getOriginalBindingsIfStillCloseToArrowEnds(element, app)).filter(element => element !== null) // Filter out bind candidates which are in the\n // same selection / group with the arrow\n //\n // TODO: Is it worth turning the list into a set to avoid dupes?\n .filter(element => selectedElements.filter(selected => selected.id === (element === null || element === void 0 ? void 0 : element.id)).length === 0);\n};\nconst maybeBindLinearElement = (linearElement, appState, pointerCoords, app) => {\n if (appState.startBoundElement != null) {\n bindLinearElement(linearElement, appState.startBoundElement, \"start\", app.scene.getNonDeletedElementsMap());\n }\n\n const hoveredElement = getHoveredElementForBinding(pointerCoords, app);\n\n if (hoveredElement != null && !isLinearElementSimpleAndAlreadyBoundOnOppositeEdge(linearElement, hoveredElement, \"end\")) {\n bindLinearElement(linearElement, hoveredElement, \"end\", app.scene.getNonDeletedElementsMap());\n }\n};\nconst bindLinearElement = (linearElement, hoveredElement, startOrEnd, elementsMap) => {\n if (!(0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isArrowElement)(linearElement)) {\n return;\n }\n\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement)(linearElement, {\n [startOrEnd === \"start\" ? \"startBinding\" : \"endBinding\"]: Object.assign({\n elementId: hoveredElement.id\n }, calculateFocusAndGap(linearElement, hoveredElement, startOrEnd, elementsMap))\n });\n const boundElementsMap = (0,_utils__WEBPACK_IMPORTED_MODULE_12__.arrayToMap)(hoveredElement.boundElements || []);\n\n if (!boundElementsMap.has(linearElement.id)) {\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement)(hoveredElement, {\n boundElements: (hoveredElement.boundElements || []).concat({\n id: linearElement.id,\n type: \"arrow\"\n })\n });\n }\n}; // Don't bind both ends of a simple segment\n\nconst isLinearElementSimpleAndAlreadyBoundOnOppositeEdge = (linearElement, bindableElement, startOrEnd) => {\n const otherBinding = linearElement[startOrEnd === \"start\" ? \"endBinding\" : \"startBinding\"];\n return isLinearElementSimpleAndAlreadyBound(linearElement, otherBinding === null || otherBinding === void 0 ? void 0 : otherBinding.elementId, bindableElement);\n};\n\nconst isLinearElementSimpleAndAlreadyBound = (linearElement, alreadyBoundToId, bindableElement) => {\n return alreadyBoundToId === bindableElement.id && isLinearElementSimple(linearElement);\n};\n\nconst isLinearElementSimple = linearElement => linearElement.points.length < 3;\n\nconst unbindLinearElement = (linearElement, startOrEnd) => {\n const field = startOrEnd === \"start\" ? \"startBinding\" : \"endBinding\";\n const binding = linearElement[field];\n\n if (binding == null) {\n return null;\n }\n\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement)(linearElement, {\n [field]: null\n });\n return binding.elementId;\n};\n\nconst getHoveredElementForBinding = (pointerCoords, app) => {\n const hoveredElement = (0,_scene__WEBPACK_IMPORTED_MODULE_7__.getElementAtPosition)(app.scene.getNonDeletedElements(), element => (0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isBindableElement)(element, false) && bindingBorderTest(element, pointerCoords, app));\n return hoveredElement;\n};\n\nconst calculateFocusAndGap = (linearElement, hoveredElement, startOrEnd, elementsMap) => {\n const direction = startOrEnd === \"start\" ? -1 : 1;\n const edgePointIndex = direction === -1 ? 0 : linearElement.points.length - 1;\n const adjacentPointIndex = edgePointIndex - direction;\n const edgePoint = _linearElementEditor__WEBPACK_IMPORTED_MODULE_11__.LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, edgePointIndex, elementsMap);\n const adjacentPoint = _linearElementEditor__WEBPACK_IMPORTED_MODULE_11__.LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, adjacentPointIndex, elementsMap);\n return {\n focus: determineFocusDistance(hoveredElement, adjacentPoint, edgePoint, elementsMap),\n gap: Math.max(1, distanceToBindableElement(hoveredElement, edgePoint, elementsMap))\n };\n}; // Supports translating, rotating and scaling `changedElement` with bound\n// linear elements.\n// Because scaling involves moving the focus points as well, it is\n// done before the `changedElement` is updated, and the `newSize` is passed\n// in explicitly.\n\n\nconst updateBoundElements = (changedElement, elementsMap, options) => {\n const {\n newSize,\n simultaneouslyUpdated\n } = options !== null && options !== void 0 ? options : {};\n const simultaneouslyUpdatedElementIds = getSimultaneouslyUpdatedElementIds(simultaneouslyUpdated);\n\n if (!(0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isBindableElement)(changedElement)) {\n return;\n }\n\n boundElementsVisitor(elementsMap, changedElement, element => {\n if (!(0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isLinearElement)(element) || element.isDeleted) {\n return;\n } // In case the boundElements are stale\n\n\n if (!doesNeedUpdate(element, changedElement)) {\n return;\n }\n\n const bindings = {\n startBinding: maybeCalculateNewGapWhenScaling(changedElement, element.startBinding, newSize),\n endBinding: maybeCalculateNewGapWhenScaling(changedElement, element.endBinding, newSize)\n }; // `linearElement` is being moved/scaled already, just update the binding\n\n if (simultaneouslyUpdatedElementIds.has(element.id)) {\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement)(element, bindings);\n return;\n }\n\n bindableElementsVisitor(elementsMap, element, (bindableElement, bindingProp) => {\n if (bindableElement && (0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isBindableElement)(bindableElement) && (bindingProp === \"startBinding\" || bindingProp === \"endBinding\")) {\n updateBoundPoint(element, bindingProp, bindings[bindingProp], bindableElement, elementsMap);\n }\n });\n const boundText = (0,_textElement__WEBPACK_IMPORTED_MODULE_14__.getBoundTextElement)(element, elementsMap);\n\n if (boundText && !boundText.isDeleted) {\n (0,_textElement__WEBPACK_IMPORTED_MODULE_14__.handleBindTextResize)(element, elementsMap, false);\n }\n });\n};\n\nconst doesNeedUpdate = (boundElement, changedElement) => {\n var _a, _b;\n\n return ((_a = boundElement.startBinding) === null || _a === void 0 ? void 0 : _a.elementId) === changedElement.id || ((_b = boundElement.endBinding) === null || _b === void 0 ? void 0 : _b.elementId) === changedElement.id;\n};\n\nconst getSimultaneouslyUpdatedElementIds = simultaneouslyUpdated => {\n return new Set((simultaneouslyUpdated || []).map(element => element.id));\n};\n\nconst updateBoundPoint = (linearElement, startOrEnd, binding, bindableElement, elementsMap) => {\n if (binding == null || // We only need to update the other end if this is a 2 point line element\n binding.elementId !== bindableElement.id && linearElement.points.length > 2) {\n return;\n }\n\n const direction = startOrEnd === \"startBinding\" ? -1 : 1;\n const edgePointIndex = direction === -1 ? 0 : linearElement.points.length - 1;\n const adjacentPointIndex = edgePointIndex - direction;\n const adjacentPoint = _linearElementEditor__WEBPACK_IMPORTED_MODULE_11__.LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, adjacentPointIndex, elementsMap);\n const focusPointAbsolute = determineFocusPoint(bindableElement, binding.focus, adjacentPoint, elementsMap);\n let newEdgePoint; // The linear element was not originally pointing inside the bound shape,\n // we can point directly at the focus point\n\n if (binding.gap === 0) {\n newEdgePoint = focusPointAbsolute;\n } else {\n const intersections = intersectElementWithLine(bindableElement, adjacentPoint, focusPointAbsolute, binding.gap, elementsMap);\n\n if (intersections.length === 0) {\n // This should never happen, since focusPoint should always be\n // inside the element, but just in case, bail out\n newEdgePoint = focusPointAbsolute;\n } else {\n // Guaranteed to intersect because focusPoint is always inside the shape\n newEdgePoint = intersections[0];\n }\n }\n\n _linearElementEditor__WEBPACK_IMPORTED_MODULE_11__.LinearElementEditor.movePoints(linearElement, [{\n index: edgePointIndex,\n point: _linearElementEditor__WEBPACK_IMPORTED_MODULE_11__.LinearElementEditor.pointFromAbsoluteCoords(linearElement, newEdgePoint, elementsMap)\n }], {\n [startOrEnd]: binding\n });\n};\n\nconst maybeCalculateNewGapWhenScaling = (changedElement, currentBinding, newSize) => {\n if (currentBinding == null || newSize == null) {\n return currentBinding;\n }\n\n const {\n gap,\n focus,\n elementId\n } = currentBinding;\n const {\n width: newWidth,\n height: newHeight\n } = newSize;\n const {\n width,\n height\n } = changedElement;\n const newGap = Math.max(1, Math.min(maxBindingGap(changedElement, newWidth, newHeight), gap * (newWidth < newHeight ? newWidth / width : newHeight / height)));\n return {\n elementId,\n gap: newGap,\n focus\n };\n};\n\nconst getElligibleElementForBindingElement = (linearElement, startOrEnd, app) => {\n return getHoveredElementForBinding(getLinearElementEdgeCoors(linearElement, startOrEnd, app.scene.getNonDeletedElementsMap()), app);\n};\n\nconst getLinearElementEdgeCoors = (linearElement, startOrEnd, elementsMap) => {\n const index = startOrEnd === \"start\" ? 0 : -1;\n return (0,_utils__WEBPACK_IMPORTED_MODULE_12__.tupleToCoors)(_linearElementEditor__WEBPACK_IMPORTED_MODULE_11__.LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, index, elementsMap));\n}; // We need to:\n// 1: Update elements not selected to point to duplicated elements\n// 2: Update duplicated elements to point to other duplicated elements\n\n\nconst fixBindingsAfterDuplication = (sceneElements, oldElements, oldIdToDuplicatedId, // There are three copying mechanisms: Copy-paste, duplication and alt-drag.\n// Only when alt-dragging the new \"duplicates\" act as the \"old\", while\n// the \"old\" elements act as the \"new copy\" - essentially working reverse\n// to the other two.\nduplicatesServeAsOld) => {\n // First collect all the binding/bindable elements, so we only update\n // each once, regardless of whether they were duplicated or not.\n const allBoundElementIds = new Set();\n const allBindableElementIds = new Set();\n const shouldReverseRoles = duplicatesServeAsOld === \"duplicatesServeAsOld\";\n oldElements.forEach(oldElement => {\n const {\n boundElements\n } = oldElement;\n\n if (boundElements != null && boundElements.length > 0) {\n boundElements.forEach(boundElement => {\n if (shouldReverseRoles && !oldIdToDuplicatedId.has(boundElement.id)) {\n allBoundElementIds.add(boundElement.id);\n }\n });\n allBindableElementIds.add(oldIdToDuplicatedId.get(oldElement.id));\n }\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isBindingElement)(oldElement)) {\n if (oldElement.startBinding != null) {\n const {\n elementId\n } = oldElement.startBinding;\n\n if (shouldReverseRoles && !oldIdToDuplicatedId.has(elementId)) {\n allBindableElementIds.add(elementId);\n }\n }\n\n if (oldElement.endBinding != null) {\n const {\n elementId\n } = oldElement.endBinding;\n\n if (shouldReverseRoles && !oldIdToDuplicatedId.has(elementId)) {\n allBindableElementIds.add(elementId);\n }\n }\n\n if (oldElement.startBinding != null || oldElement.endBinding != null) {\n allBoundElementIds.add(oldIdToDuplicatedId.get(oldElement.id));\n }\n }\n }); // Update the linear elements\n\n sceneElements.filter(({\n id\n }) => allBoundElementIds.has(id)).forEach(element => {\n const {\n startBinding,\n endBinding\n } = element;\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement)(element, {\n startBinding: newBindingAfterDuplication(startBinding, oldIdToDuplicatedId),\n endBinding: newBindingAfterDuplication(endBinding, oldIdToDuplicatedId)\n });\n }); // Update the bindable shapes\n\n sceneElements.filter(({\n id\n }) => allBindableElementIds.has(id)).forEach(bindableElement => {\n const {\n boundElements\n } = bindableElement;\n\n if (boundElements != null && boundElements.length > 0) {\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement)(bindableElement, {\n boundElements: boundElements.map(boundElement => oldIdToDuplicatedId.has(boundElement.id) ? {\n id: oldIdToDuplicatedId.get(boundElement.id),\n type: boundElement.type\n } : boundElement)\n });\n }\n });\n};\n\nconst newBindingAfterDuplication = (binding, oldIdToDuplicatedId) => {\n var _a;\n\n if (binding == null) {\n return null;\n }\n\n const {\n elementId,\n focus,\n gap\n } = binding;\n return {\n focus,\n gap,\n elementId: (_a = oldIdToDuplicatedId.get(elementId)) !== null && _a !== void 0 ? _a : elementId\n };\n};\n\nconst fixBindingsAfterDeletion = (sceneElements, deletedElements) => {\n const elements = (0,_utils__WEBPACK_IMPORTED_MODULE_12__.arrayToMap)(sceneElements);\n\n for (const element of deletedElements) {\n BoundElement.unbindAffected(elements, element, _mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement);\n BindableElement.unbindAffected(elements, element, _mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement);\n }\n};\n\nconst newBoundElements = (boundElements, idsToRemove, elementsToAdd = []) => {\n if (!boundElements) {\n return null;\n }\n\n const nextBoundElements = boundElements.filter(boundElement => !idsToRemove.has(boundElement.id));\n nextBoundElements.push(...elementsToAdd.map(x => ({\n id: x.id,\n type: x.type\n })));\n return nextBoundElements;\n};\n\nconst bindingBorderTest = (element, {\n x,\n y\n}, app) => {\n const threshold = maxBindingGap(element, element.width, element.height);\n const shape = app.getElementShape(element);\n return (0,_utils_collision__WEBPACK_IMPORTED_MODULE_6__.isPointOnShape)([x, y], shape, threshold);\n};\n\nconst maxBindingGap = (element, elementWidth, elementHeight) => {\n // Aligns diamonds with rectangles\n const shapeRatio = element.type === \"diamond\" ? 1 / Math.sqrt(2) : 1;\n const smallerDimension = shapeRatio * Math.min(elementWidth, elementHeight); // We make the bindable boundary bigger for bigger elements\n\n return Math.max(16, Math.min(0.25 * smallerDimension, 32));\n};\n\nconst distanceToBindableElement = (element, point, elementsMap) => {\n switch (element.type) {\n case \"rectangle\":\n case \"image\":\n case \"text\":\n case \"iframe\":\n case \"embeddable\":\n case \"frame\":\n case \"magicframe\":\n return distanceToRectangle(element, point, elementsMap);\n\n case \"diamond\":\n return distanceToDiamond(element, point, elementsMap);\n\n case \"ellipse\":\n return distanceToEllipse(element, point, elementsMap);\n }\n};\n\nconst distanceToRectangle = (element, point, elementsMap) => {\n const [, pointRel, hwidth, hheight] = pointRelativeToElement(element, point, elementsMap);\n return Math.max(_gapoints__WEBPACK_IMPORTED_MODULE_1__.distanceToLine(pointRel, _galines__WEBPACK_IMPORTED_MODULE_3__.equation(0, 1, -hheight)), _gapoints__WEBPACK_IMPORTED_MODULE_1__.distanceToLine(pointRel, _galines__WEBPACK_IMPORTED_MODULE_3__.equation(1, 0, -hwidth)));\n};\n\nconst distanceToDiamond = (element, point, elementsMap) => {\n const [, pointRel, hwidth, hheight] = pointRelativeToElement(element, point, elementsMap);\n const side = _galines__WEBPACK_IMPORTED_MODULE_3__.equation(hheight, hwidth, -hheight * hwidth);\n return _gapoints__WEBPACK_IMPORTED_MODULE_1__.distanceToLine(pointRel, side);\n};\n\nconst distanceToEllipse = (element, point, elementsMap) => {\n const [pointRel, tangent] = ellipseParamsForTest(element, point, elementsMap);\n return -_galines__WEBPACK_IMPORTED_MODULE_3__.sign(tangent) * _gapoints__WEBPACK_IMPORTED_MODULE_1__.distanceToLine(pointRel, tangent);\n};\n\nconst ellipseParamsForTest = (element, point, elementsMap) => {\n const [, pointRel, hwidth, hheight] = pointRelativeToElement(element, point, elementsMap);\n const [px, py] = _gapoints__WEBPACK_IMPORTED_MODULE_1__.toTuple(pointRel); // We're working in positive quadrant, so start with `t = 45deg`, `tx=cos(t)`\n\n let tx = 0.707;\n let ty = 0.707;\n const a = hwidth;\n const b = hheight; // This is a numerical method to find the params tx, ty at which\n // the ellipse has the closest point to the given point\n\n [0, 1, 2, 3].forEach(_ => {\n const xx = a * tx;\n const yy = b * ty;\n const ex = (a * a - b * b) * tx ** 3 / a;\n const ey = (b * b - a * a) * ty ** 3 / b;\n const rx = xx - ex;\n const ry = yy - ey;\n const qx = px - ex;\n const qy = py - ey;\n const r = Math.hypot(ry, rx);\n const q = Math.hypot(qy, qx);\n tx = Math.min(1, Math.max(0, (qx * r / q + ex) / a));\n ty = Math.min(1, Math.max(0, (qy * r / q + ey) / b));\n const t = Math.hypot(ty, tx);\n tx /= t;\n ty /= t;\n });\n const closestPoint = _ga__WEBPACK_IMPORTED_MODULE_0__.point(a * tx, b * ty);\n const tangent = _galines__WEBPACK_IMPORTED_MODULE_3__.orthogonalThrough(pointRel, closestPoint);\n return [pointRel, tangent];\n}; // Returns:\n// 1. the point relative to the elements (x, y) position\n// 2. the point relative to the element's center with positive (x, y)\n// 3. half element width\n// 4. half element height\n//\n// Note that for linear elements the (x, y) position is not at the\n// top right corner of their boundary.\n//\n// Rectangles, diamonds and ellipses are symmetrical over axes,\n// and other elements have a rectangular boundary,\n// so we only need to perform hit tests for the positive quadrant.\n\n\nconst pointRelativeToElement = (element, pointTuple, elementsMap) => {\n const point = _gapoints__WEBPACK_IMPORTED_MODULE_1__.from(pointTuple);\n const [x1, y1, x2, y2] = (0,_bounds__WEBPACK_IMPORTED_MODULE_5__.getElementAbsoluteCoords)(element, elementsMap);\n const center = coordsCenter(x1, y1, x2, y2); // GA has angle orientation opposite to `rotate`\n\n const rotate = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.rotation(center, element.angle);\n const pointRotated = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(rotate, point);\n const pointRelToCenter = _ga__WEBPACK_IMPORTED_MODULE_0__.sub(pointRotated, _gadirections__WEBPACK_IMPORTED_MODULE_2__.from(center));\n const pointRelToCenterAbs = _gapoints__WEBPACK_IMPORTED_MODULE_1__.abs(pointRelToCenter);\n const elementPos = _ga__WEBPACK_IMPORTED_MODULE_0__.offset(element.x, element.y);\n const pointRelToPos = _ga__WEBPACK_IMPORTED_MODULE_0__.sub(pointRotated, elementPos);\n const halfWidth = (x2 - x1) / 2;\n const halfHeight = (y2 - y1) / 2;\n return [pointRelToPos, pointRelToCenterAbs, halfWidth, halfHeight];\n};\n\nconst relativizationToElementCenter = (element, elementsMap) => {\n const [x1, y1, x2, y2] = (0,_bounds__WEBPACK_IMPORTED_MODULE_5__.getElementAbsoluteCoords)(element, elementsMap);\n const center = coordsCenter(x1, y1, x2, y2); // GA has angle orientation opposite to `rotate`\n\n const rotate = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.rotation(center, element.angle);\n const translate = _ga__WEBPACK_IMPORTED_MODULE_0__.reverse(_gatransforms__WEBPACK_IMPORTED_MODULE_4__.translation(_gadirections__WEBPACK_IMPORTED_MODULE_2__.from(center)));\n return _gatransforms__WEBPACK_IMPORTED_MODULE_4__.compose(rotate, translate);\n};\n\nconst coordsCenter = (x1, y1, x2, y2) => {\n return _ga__WEBPACK_IMPORTED_MODULE_0__.point((x1 + x2) / 2, (y1 + y2) / 2);\n}; // The focus distance is the oriented ratio between the size of\n// the `element` and the \"focus image\" of the element on which\n// all focus points lie, so it's a number between -1 and 1.\n// The line going through `a` and `b` is a tangent to the \"focus image\"\n// of the element.\n\n\nconst determineFocusDistance = ( //zsviczian added export\nelement, // Point on the line, in absolute coordinates\na, // Another point on the line, in absolute coordinates (closer to element)\nb, elementsMap) => {\n const relateToCenter = relativizationToElementCenter(element, elementsMap);\n const aRel = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(relateToCenter, _gapoints__WEBPACK_IMPORTED_MODULE_1__.from(a));\n const bRel = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(relateToCenter, _gapoints__WEBPACK_IMPORTED_MODULE_1__.from(b));\n const line = _galines__WEBPACK_IMPORTED_MODULE_3__.through(aRel, bRel);\n const q = element.height / element.width;\n const hwidth = element.width / 2;\n const hheight = element.height / 2;\n const n = line[2];\n const m = line[3];\n const c = line[1];\n const mabs = Math.abs(m);\n const nabs = Math.abs(n);\n let ret;\n\n switch (element.type) {\n case \"rectangle\":\n case \"image\":\n case \"text\":\n case \"iframe\":\n case \"embeddable\":\n case \"frame\":\n case \"magicframe\":\n ret = c / (hwidth * (nabs + q * mabs));\n break;\n\n case \"diamond\":\n ret = mabs < nabs ? c / (nabs * hwidth) : c / (mabs * hheight);\n break;\n\n case \"ellipse\":\n ret = c / (hwidth * Math.sqrt(n ** 2 + q ** 2 * m ** 2));\n break;\n }\n\n return ret || 0;\n};\n\nconst determineFocusPoint = (element, // The oriented, relative distance from the center of `element` of the\n// returned focusPoint\nfocus, adjecentPoint, elementsMap) => {\n if (focus === 0) {\n const [x1, y1, x2, y2] = (0,_bounds__WEBPACK_IMPORTED_MODULE_5__.getElementAbsoluteCoords)(element, elementsMap);\n const center = coordsCenter(x1, y1, x2, y2);\n return _gapoints__WEBPACK_IMPORTED_MODULE_1__.toTuple(center);\n }\n\n const relateToCenter = relativizationToElementCenter(element, elementsMap);\n const adjecentPointRel = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(relateToCenter, _gapoints__WEBPACK_IMPORTED_MODULE_1__.from(adjecentPoint));\n const reverseRelateToCenter = _ga__WEBPACK_IMPORTED_MODULE_0__.reverse(relateToCenter);\n let point;\n\n switch (element.type) {\n case \"rectangle\":\n case \"image\":\n case \"text\":\n case \"diamond\":\n case \"iframe\":\n case \"embeddable\":\n case \"frame\":\n case \"magicframe\":\n point = findFocusPointForRectangulars(element, focus, adjecentPointRel);\n break;\n\n case \"ellipse\":\n point = findFocusPointForEllipse(element, focus, adjecentPointRel);\n break;\n }\n\n return _gapoints__WEBPACK_IMPORTED_MODULE_1__.toTuple(_gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(reverseRelateToCenter, point));\n}; // Returns 2 or 0 intersection points between line going through `a` and `b`\n// and the `element`, in ascending order of distance from `a`.\n\n\nconst intersectElementWithLine = ( //zsviczian added export\nelement, // Point on the line, in absolute coordinates\na, // Another point on the line, in absolute coordinates\nb, // If given, the element is inflated by this value\ngap = 0, elementsMap) => {\n const relateToCenter = relativizationToElementCenter(element, elementsMap);\n const aRel = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(relateToCenter, _gapoints__WEBPACK_IMPORTED_MODULE_1__.from(a));\n const bRel = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(relateToCenter, _gapoints__WEBPACK_IMPORTED_MODULE_1__.from(b));\n const line = _galines__WEBPACK_IMPORTED_MODULE_3__.through(aRel, bRel);\n const reverseRelateToCenter = _ga__WEBPACK_IMPORTED_MODULE_0__.reverse(relateToCenter);\n const intersections = getSortedElementLineIntersections(element, line, aRel, gap);\n return intersections.map(point => _gapoints__WEBPACK_IMPORTED_MODULE_1__.toTuple(_gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(reverseRelateToCenter, point)));\n};\n\nconst getSortedElementLineIntersections = (element, // Relative to element center\nline, // Relative to element center\nnearPoint, gap = 0) => {\n let intersections;\n\n switch (element.type) {\n case \"rectangle\":\n case \"image\":\n case \"text\":\n case \"diamond\":\n case \"iframe\":\n case \"embeddable\":\n case \"frame\":\n case \"magicframe\":\n const corners = getCorners(element);\n intersections = corners.flatMap((point, i) => {\n const edge = [point, corners[(i + 1) % 4]];\n return intersectSegment(line, offsetSegment(edge, gap));\n }).concat(corners.flatMap(point => getCircleIntersections(point, gap, line)));\n break;\n\n case \"ellipse\":\n intersections = getEllipseIntersections(element, gap, line);\n break;\n }\n\n if (intersections.length < 2) {\n // Ignore the \"edge\" case of only intersecting with a single corner\n return [];\n }\n\n const sortedIntersections = intersections.sort((i1, i2) => _gapoints__WEBPACK_IMPORTED_MODULE_1__.distance(i1, nearPoint) - _gapoints__WEBPACK_IMPORTED_MODULE_1__.distance(i2, nearPoint));\n return [sortedIntersections[0], sortedIntersections[sortedIntersections.length - 1]];\n};\n\nconst getCorners = (element, scale = 1) => {\n const hx = scale * element.width / 2;\n const hy = scale * element.height / 2;\n\n switch (element.type) {\n case \"rectangle\":\n case \"image\":\n case \"text\":\n case \"iframe\":\n case \"embeddable\":\n case \"frame\":\n case \"magicframe\":\n return [_ga__WEBPACK_IMPORTED_MODULE_0__.point(hx, hy), _ga__WEBPACK_IMPORTED_MODULE_0__.point(hx, -hy), _ga__WEBPACK_IMPORTED_MODULE_0__.point(-hx, -hy), _ga__WEBPACK_IMPORTED_MODULE_0__.point(-hx, hy)];\n\n case \"diamond\":\n return [_ga__WEBPACK_IMPORTED_MODULE_0__.point(0, hy), _ga__WEBPACK_IMPORTED_MODULE_0__.point(hx, 0), _ga__WEBPACK_IMPORTED_MODULE_0__.point(0, -hy), _ga__WEBPACK_IMPORTED_MODULE_0__.point(-hx, 0)];\n }\n}; // Returns intersection of `line` with `segment`, with `segment` moved by\n// `gap` in its polar direction.\n// If intersection coincides with second segment point returns empty array.\n\n\nconst intersectSegment = (line, segment) => {\n const [a, b] = segment;\n const aDist = _gapoints__WEBPACK_IMPORTED_MODULE_1__.distanceToLine(a, line);\n const bDist = _gapoints__WEBPACK_IMPORTED_MODULE_1__.distanceToLine(b, line);\n\n if (aDist * bDist >= 0) {\n // The intersection is outside segment `(a, b)`\n return [];\n }\n\n return [_gapoints__WEBPACK_IMPORTED_MODULE_1__.intersect(line, _galines__WEBPACK_IMPORTED_MODULE_3__.through(a, b))];\n};\n\nconst offsetSegment = (segment, distance) => {\n const [a, b] = segment;\n const offset = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.translationOrthogonal(_gadirections__WEBPACK_IMPORTED_MODULE_2__.fromTo(a, b), distance);\n return [_gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(offset, a), _gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(offset, b)];\n};\n\nconst getEllipseIntersections = (element, gap, line) => {\n const a = element.width / 2 + gap;\n const b = element.height / 2 + gap;\n const m = line[2];\n const n = line[3];\n const c = line[1];\n const squares = a * a * m * m + b * b * n * n;\n const discr = squares - c * c;\n\n if (squares === 0 || discr <= 0) {\n return [];\n }\n\n const discrRoot = Math.sqrt(discr);\n const xn = -a * a * m * c;\n const yn = -b * b * n * c;\n return [_ga__WEBPACK_IMPORTED_MODULE_0__.point((xn + a * b * n * discrRoot) / squares, (yn - a * b * m * discrRoot) / squares), _ga__WEBPACK_IMPORTED_MODULE_0__.point((xn - a * b * n * discrRoot) / squares, (yn + a * b * m * discrRoot) / squares)];\n};\n\nconst getCircleIntersections = (center, radius, line) => {\n if (radius === 0) {\n return _gapoints__WEBPACK_IMPORTED_MODULE_1__.distanceToLine(line, center) === 0 ? [center] : [];\n }\n\n const m = line[2];\n const n = line[3];\n const c = line[1];\n const [a, b] = _gapoints__WEBPACK_IMPORTED_MODULE_1__.toTuple(center);\n const r = radius;\n const squares = m * m + n * n;\n const discr = r * r * squares - (m * a + n * b + c) ** 2;\n\n if (squares === 0 || discr <= 0) {\n return [];\n }\n\n const discrRoot = Math.sqrt(discr);\n const xn = a * n * n - b * m * n - m * c;\n const yn = b * m * m - a * m * n - n * c;\n return [_ga__WEBPACK_IMPORTED_MODULE_0__.point((xn + n * discrRoot) / squares, (yn - m * discrRoot) / squares), _ga__WEBPACK_IMPORTED_MODULE_0__.point((xn - n * discrRoot) / squares, (yn + m * discrRoot) / squares)];\n}; // The focus point is the tangent point of the \"focus image\" of the\n// `element`, where the tangent goes through `point`.\n\n\nconst findFocusPointForEllipse = (ellipse, // Between -1 and 1 (not 0) the relative size of the \"focus image\" of\n// the element on which the focus point lies\nrelativeDistance, // The point for which we're trying to find the focus point, relative\n// to the ellipse center.\npoint) => {\n const relativeDistanceAbs = Math.abs(relativeDistance);\n const a = ellipse.width * relativeDistanceAbs / 2;\n const b = ellipse.height * relativeDistanceAbs / 2;\n const orientation = Math.sign(relativeDistance);\n const [px, pyo] = _gapoints__WEBPACK_IMPORTED_MODULE_1__.toTuple(point); // The calculation below can't handle py = 0\n\n const py = pyo === 0 ? 0.0001 : pyo;\n const squares = px ** 2 * b ** 2 + py ** 2 * a ** 2; // Tangent mx + ny + 1 = 0\n\n const m = (-px * b ** 2 + orientation * py * Math.sqrt(Math.max(0, squares - a ** 2 * b ** 2))) / squares;\n let n = (-m * px - 1) / py;\n\n if (n === 0) {\n // if zero {-0, 0}, fall back to a same-sign value in the similar range\n n = (Object.is(n, -0) ? -1 : 1) * 0.01;\n }\n\n const x = -(a ** 2 * m) / (n ** 2 * b ** 2 + m ** 2 * a ** 2);\n return _ga__WEBPACK_IMPORTED_MODULE_0__.point(x, (-m * x - 1) / (n === 0 ? 0.0001 : n)); //zsviczian https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/1054\n};\n\nconst findFocusPointForRectangulars = (element, // Between -1 and 1 for how far away should the focus point be relative\n// to the size of the element. Sign determines orientation.\nrelativeDistance, // The point for which we're trying to find the focus point, relative\n// to the element center.\npoint) => {\n const relativeDistanceAbs = Math.abs(relativeDistance);\n const orientation = Math.sign(relativeDistance);\n const corners = getCorners(element, relativeDistanceAbs);\n let maxDistance = 0;\n let tangentPoint = null;\n corners.forEach(corner => {\n const distance = orientation * _galines__WEBPACK_IMPORTED_MODULE_3__.through(point, corner)[1];\n\n if (distance > maxDistance) {\n maxDistance = distance;\n tangentPoint = corner;\n }\n });\n return tangentPoint;\n};\n\nconst bindingProperties = new Set([\"boundElements\", \"frameId\", \"containerId\", \"startBinding\", \"endBinding\"]);\n/**\r\n * Tries to visit each bound element (does not have to be found).\r\n */\n\nconst boundElementsVisitor = (elements, element, visit) => {\n var _a, _b;\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isBindableElement)(element)) {\n // create new instance so that possible mutations won't play a role in visiting order\n const boundElements = (_b = (_a = element.boundElements) === null || _a === void 0 ? void 0 : _a.slice()) !== null && _b !== void 0 ? _b : []; // last added text should be the one we keep (~previous are duplicates)\n\n boundElements.forEach(({\n id\n }) => {\n visit(elements.get(id), \"boundElements\", id);\n });\n }\n};\n/**\r\n * Tries to visit each bindable element (does not have to be found).\r\n */\n\n\nconst bindableElementsVisitor = (elements, element, visit) => {\n if (element.frameId) {\n const id = element.frameId;\n visit(elements.get(id), \"frameId\", id);\n }\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isBoundToContainer)(element)) {\n const id = element.containerId;\n visit(elements.get(id), \"containerId\", id);\n }\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isArrowElement)(element)) {\n if (element.startBinding) {\n const id = element.startBinding.elementId;\n visit(elements.get(id), \"startBinding\", id);\n }\n\n if (element.endBinding) {\n const id = element.endBinding.elementId;\n visit(elements.get(id), \"endBinding\", id);\n }\n }\n};\n/**\r\n * Bound element containing bindings to `frameId`, `containerId`, `startBinding` or `endBinding`.\r\n */\n\n\nclass BoundElement {\n /**\r\n * Unbind the affected non deleted bindable elements (removing element from `boundElements`).\r\n * - iterates non deleted bindable elements (`containerId` | `startBinding.elementId` | `endBinding.elementId`) of the current element\r\n * - prepares updates to unbind each bindable element's `boundElements` from the current element\r\n */\n static unbindAffected(elements, boundElement, updateElementWith) {\n if (!boundElement) {\n return;\n }\n\n bindableElementsVisitor(elements, boundElement, bindableElement => {\n // bindable element is deleted, this is fine\n if (!bindableElement || bindableElement.isDeleted) {\n return;\n }\n\n boundElementsVisitor(elements, bindableElement, (_, __, boundElementId) => {\n if (boundElementId === boundElement.id) {\n updateElementWith(bindableElement, {\n boundElements: newBoundElements(bindableElement.boundElements, new Set([boundElementId]))\n });\n }\n });\n });\n }\n\n}\n/**\r\n * Rebind the next affected non deleted bindable elements (adding element to `boundElements`).\r\n * - iterates non deleted bindable elements (`containerId` | `startBinding.elementId` | `endBinding.elementId`) of the current element\r\n * - prepares updates to rebind each bindable element's `boundElements` to the current element\r\n *\r\n * NOTE: rebind expects that affected elements were previously unbound with `BoundElement.unbindAffected`\r\n */\n\nBoundElement.rebindAffected = (elements, boundElement, updateElementWith) => {\n // don't try to rebind element that is deleted\n if (!boundElement || boundElement.isDeleted) {\n return;\n }\n\n bindableElementsVisitor(elements, boundElement, (bindableElement, bindingProp) => {\n var _a, _b; // unbind from bindable elements, as bindings from non deleted elements into deleted elements are incorrect\n\n\n if (!bindableElement || bindableElement.isDeleted) {\n updateElementWith(boundElement, {\n [bindingProp]: null\n });\n return;\n } // frame bindings are unidirectional, there is nothing to rebind\n\n\n if (bindingProp === \"frameId\") {\n return;\n }\n\n if ((_a = bindableElement.boundElements) === null || _a === void 0 ? void 0 : _a.find(x => x.id === boundElement.id)) {\n return;\n }\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isArrowElement)(boundElement)) {\n // rebind if not found!\n updateElementWith(bindableElement, {\n boundElements: newBoundElements(bindableElement.boundElements, new Set(), new Array(boundElement))\n });\n }\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isTextElement)(boundElement)) {\n if (!((_b = bindableElement.boundElements) === null || _b === void 0 ? void 0 : _b.find(x => x.type === \"text\"))) {\n // rebind only if there is no other text bound already\n updateElementWith(bindableElement, {\n boundElements: newBoundElements(bindableElement.boundElements, new Set(), new Array(boundElement))\n });\n } else {\n // unbind otherwise\n updateElementWith(boundElement, {\n [bindingProp]: null\n });\n }\n }\n });\n};\n/**\r\n * Bindable element containing bindings to `boundElements`.\r\n */\n\n\nclass BindableElement {\n /**\r\n * Unbind the affected non deleted bound elements (resetting `containerId`, `startBinding`, `endBinding` to `null`).\r\n * - iterates through non deleted `boundElements` of the current element\r\n * - prepares updates to unbind each bound element from the current element\r\n */\n static unbindAffected(elements, bindableElement, updateElementWith) {\n if (!bindableElement) {\n return;\n }\n\n boundElementsVisitor(elements, bindableElement, boundElement => {\n // bound element is deleted, this is fine\n if (!boundElement || boundElement.isDeleted) {\n return;\n }\n\n bindableElementsVisitor(elements, boundElement, (_, bindingProp, bindableElementId) => {\n // making sure there is an element to be unbound\n if (bindableElementId === bindableElement.id) {\n updateElementWith(boundElement, {\n [bindingProp]: null\n });\n }\n });\n });\n }\n\n}\n/**\r\n * Rebind the affected non deleted bound elements (for now setting only `containerId`, as we cannot rebind arrows atm).\r\n * - iterates through non deleted `boundElements` of the current element\r\n * - prepares updates to rebind each bound element to the current element or unbind it from `boundElements` in case of conflicts\r\n *\r\n * NOTE: rebind expects that affected elements were previously unbound with `BindaleElement.unbindAffected`\r\n */\n\nBindableElement.rebindAffected = (elements, bindableElement, updateElementWith) => {\n // don't try to rebind element that is deleted (i.e. updated as deleted)\n if (!bindableElement || bindableElement.isDeleted) {\n return;\n }\n\n boundElementsVisitor(elements, bindableElement, (boundElement, _, boundElementId) => {\n var _a, _b, _c; // unbind from bindable elements, as bindings from non deleted elements into deleted elements are incorrect\n\n\n if (!boundElement || boundElement.isDeleted) {\n updateElementWith(bindableElement, {\n boundElements: newBoundElements(bindableElement.boundElements, new Set([boundElementId]))\n });\n return;\n }\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isTextElement)(boundElement)) {\n const boundElements = (_b = (_a = bindableElement.boundElements) === null || _a === void 0 ? void 0 : _a.slice()) !== null && _b !== void 0 ? _b : []; // check if this is the last element in the array, if not, there is an previously bound text which should be unbound\n\n if (((_c = boundElements.reverse().find(x => x.type === \"text\")) === null || _c === void 0 ? void 0 : _c.id) === boundElement.id) {\n if (boundElement.containerId !== bindableElement.id) {\n // rebind if not bound already!\n updateElementWith(boundElement, {\n containerId: bindableElement.id\n });\n }\n } else {\n if (boundElement.containerId !== null) {\n // unbind if not unbound already\n updateElementWith(boundElement, {\n containerId: null\n });\n } // unbind from boundElements as the element got bound to some other element in the meantime\n\n\n updateElementWith(bindableElement, {\n boundElements: newBoundElements(bindableElement.boundElements, new Set([boundElement.id]))\n });\n }\n }\n });\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./element/binding.ts?");
2644
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"BindableElement\": () => (/* binding */ BindableElement),\n/* harmony export */ \"BoundElement\": () => (/* binding */ BoundElement),\n/* harmony export */ \"bindLinearElement\": () => (/* binding */ bindLinearElement),\n/* harmony export */ \"bindOrUnbindLinearElement\": () => (/* binding */ bindOrUnbindLinearElement),\n/* harmony export */ \"bindOrUnbindLinearElements\": () => (/* binding */ bindOrUnbindLinearElements),\n/* harmony export */ \"bindingProperties\": () => (/* binding */ bindingProperties),\n/* harmony export */ \"determineFocusDistance\": () => (/* binding */ determineFocusDistance),\n/* harmony export */ \"fixBindingsAfterDeletion\": () => (/* binding */ fixBindingsAfterDeletion),\n/* harmony export */ \"fixBindingsAfterDuplication\": () => (/* binding */ fixBindingsAfterDuplication),\n/* harmony export */ \"getHoveredElementForBinding\": () => (/* binding */ getHoveredElementForBinding),\n/* harmony export */ \"getSuggestedBindingsForArrows\": () => (/* binding */ getSuggestedBindingsForArrows),\n/* harmony export */ \"intersectElementWithLine\": () => (/* binding */ intersectElementWithLine),\n/* harmony export */ \"isBindingEnabled\": () => (/* binding */ isBindingEnabled),\n/* harmony export */ \"isLinearElementSimpleAndAlreadyBound\": () => (/* binding */ isLinearElementSimpleAndAlreadyBound),\n/* harmony export */ \"maxBindingGap\": () => (/* binding */ maxBindingGap),\n/* harmony export */ \"maybeBindLinearElement\": () => (/* binding */ maybeBindLinearElement),\n/* harmony export */ \"shouldEnableBindingForPointerEvent\": () => (/* binding */ shouldEnableBindingForPointerEvent),\n/* harmony export */ \"updateBoundElements\": () => (/* binding */ updateBoundElements)\n/* harmony export */ });\n/* harmony import */ var _ga__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../ga */ \"./ga.ts\");\n/* harmony import */ var _gapoints__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../gapoints */ \"./gapoints.ts\");\n/* harmony import */ var _gadirections__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../gadirections */ \"./gadirections.ts\");\n/* harmony import */ var _galines__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../galines */ \"./galines.ts\");\n/* harmony import */ var _gatransforms__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../gatransforms */ \"./gatransforms.ts\");\n/* harmony import */ var _bounds__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _utils_collision__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../utils/collision */ \"../utils/collision.ts\");\n/* harmony import */ var _scene__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../scene */ \"./scene/index.ts\");\n/* harmony import */ var _typeChecks__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _mutateElement__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _scene_Scene__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../scene/Scene */ \"./scene/Scene.ts\");\n/* harmony import */ var _linearElementEditor__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./linearElementEditor */ \"./element/linearElementEditor.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _keys__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../keys */ \"./keys.ts\");\n/* harmony import */ var _textElement__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _shapes__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../shapes */ \"./shapes.tsx\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nconst shouldEnableBindingForPointerEvent = event => {\n return !event[_keys__WEBPACK_IMPORTED_MODULE_13__.KEYS.CTRL_OR_CMD];\n};\nconst isBindingEnabled = appState => {\n return appState.invertBindingBehaviour //zsviczian\n ? !appState.isBindingEnabled : appState.isBindingEnabled;\n};\n\nconst getNonDeletedElements = (scene, ids) => {\n const result = [];\n ids.forEach(id => {\n const element = scene.getNonDeletedElement(id);\n\n if (element != null) {\n result.push(element);\n }\n });\n return result;\n};\n\nconst bindOrUnbindLinearElement = (linearElement, startBindingElement, endBindingElement, elementsMap) => {\n const boundToElementIds = new Set();\n const unboundFromElementIds = new Set();\n bindOrUnbindLinearElementEdge(linearElement, startBindingElement, endBindingElement, \"start\", boundToElementIds, unboundFromElementIds, elementsMap);\n bindOrUnbindLinearElementEdge(linearElement, endBindingElement, startBindingElement, \"end\", boundToElementIds, unboundFromElementIds, elementsMap);\n const onlyUnbound = Array.from(unboundFromElementIds).filter(id => !boundToElementIds.has(id));\n getNonDeletedElements(_scene_Scene__WEBPACK_IMPORTED_MODULE_10__[\"default\"].getScene(linearElement), onlyUnbound).forEach(element => {\n var _a;\n\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement)(element, {\n boundElements: (_a = element.boundElements) === null || _a === void 0 ? void 0 : _a.filter(element => element.type !== \"arrow\" || element.id !== linearElement.id)\n });\n });\n};\n\nconst bindOrUnbindLinearElementEdge = (linearElement, bindableElement, otherEdgeBindableElement, startOrEnd, // Is mutated\nboundToElementIds, // Is mutated\nunboundFromElementIds, elementsMap) => {\n // \"keep\" is for method chaining convenience, a \"no-op\", so just bail out\n if (bindableElement === \"keep\") {\n return;\n } // null means break the bind, so nothing to consider here\n\n\n if (bindableElement === null) {\n const unbound = unbindLinearElement(linearElement, startOrEnd);\n\n if (unbound != null) {\n unboundFromElementIds.add(unbound);\n }\n\n return;\n } // While complext arrows can do anything, simple arrow with both ends trying\n // to bind to the same bindable should not be allowed, start binding takes\n // precedence\n\n\n if (isLinearElementSimple(linearElement)) {\n if (otherEdgeBindableElement == null || (otherEdgeBindableElement === \"keep\" ? // TODO: Refactor - Needlessly complex\n !isLinearElementSimpleAndAlreadyBoundOnOppositeEdge(linearElement, bindableElement, startOrEnd) : startOrEnd === \"start\" || otherEdgeBindableElement.id !== bindableElement.id)) {\n bindLinearElement(linearElement, bindableElement, startOrEnd, elementsMap);\n boundToElementIds.add(bindableElement.id);\n }\n } else {\n bindLinearElement(linearElement, bindableElement, startOrEnd, elementsMap);\n boundToElementIds.add(bindableElement.id);\n }\n};\n\nconst getOriginalBindingIfStillCloseOfLinearElementEdge = (linearElement, edge, elementsMap) => {\n var _a, _b;\n\n const coors = getLinearElementEdgeCoors(linearElement, edge, elementsMap);\n const elementId = edge === \"start\" ? (_a = linearElement.startBinding) === null || _a === void 0 ? void 0 : _a.elementId : (_b = linearElement.endBinding) === null || _b === void 0 ? void 0 : _b.elementId;\n\n if (elementId) {\n const element = elementsMap.get(elementId);\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isBindableElement)(element) && bindingBorderTest(element, coors, elementsMap)) {\n return element;\n }\n }\n\n return null;\n};\n\nconst getOriginalBindingsIfStillCloseToArrowEnds = (linearElement, elementsMap) => [\"start\", \"end\"].map(edge => getOriginalBindingIfStillCloseOfLinearElementEdge(linearElement, edge, elementsMap));\n\nconst getBindingStrategyForDraggingArrowEndpoints = (selectedElement, isBindingEnabled, draggingPoints, elementsMap) => {\n const startIdx = 0;\n const endIdx = selectedElement.points.length - 1;\n const startDragged = draggingPoints.findIndex(i => i === startIdx) > -1;\n const endDragged = draggingPoints.findIndex(i => i === endIdx) > -1;\n const start = startDragged ? isBindingEnabled ? getElligibleElementForBindingElement(selectedElement, \"start\", elementsMap) : null // If binding is disabled and start is dragged, break all binds\n : // We have to update the focus and gap of the binding, so let's rebind\n getElligibleElementForBindingElement(selectedElement, \"start\", elementsMap);\n const end = endDragged ? isBindingEnabled ? getElligibleElementForBindingElement(selectedElement, \"end\", elementsMap) : null // If binding is disabled and end is dragged, break all binds\n : // We have to update the focus and gap of the binding, so let's rebind\n getElligibleElementForBindingElement(selectedElement, \"end\", elementsMap);\n return [start, end];\n};\n\nconst getBindingStrategyForDraggingArrowOrJoints = (selectedElement, elementsMap, isBindingEnabled) => {\n const [startIsClose, endIsClose] = getOriginalBindingsIfStillCloseToArrowEnds(selectedElement, elementsMap);\n const start = startIsClose ? isBindingEnabled ? getElligibleElementForBindingElement(selectedElement, \"start\", elementsMap) : null : null;\n const end = endIsClose ? isBindingEnabled ? getElligibleElementForBindingElement(selectedElement, \"end\", elementsMap) : null : null;\n return [start, end];\n};\n\nconst bindOrUnbindLinearElements = (selectedElements, elementsMap, isBindingEnabled, draggingPoints) => {\n selectedElements.forEach(selectedElement => {\n const [start, end] = (draggingPoints === null || draggingPoints === void 0 ? void 0 : draggingPoints.length) ? // The arrow edge points are dragged (i.e. start, end)\n getBindingStrategyForDraggingArrowEndpoints(selectedElement, isBindingEnabled, draggingPoints !== null && draggingPoints !== void 0 ? draggingPoints : [], elementsMap) : // The arrow itself (the shaft) or the inner joins are dragged\n getBindingStrategyForDraggingArrowOrJoints(selectedElement, elementsMap, isBindingEnabled);\n bindOrUnbindLinearElement(selectedElement, start, end, elementsMap);\n });\n};\nconst getSuggestedBindingsForArrows = (selectedElements, elementsMap) => {\n // HOT PATH: Bail out if selected elements list is too large\n if (selectedElements.length > 50) {\n return [];\n }\n\n return selectedElements.filter(_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isLinearElement).flatMap(element => getOriginalBindingsIfStillCloseToArrowEnds(element, elementsMap)).filter(element => element !== null) // Filter out bind candidates which are in the\n // same selection / group with the arrow\n //\n // TODO: Is it worth turning the list into a set to avoid dupes?\n .filter(element => selectedElements.filter(selected => selected.id === (element === null || element === void 0 ? void 0 : element.id)).length === 0);\n};\nconst maybeBindLinearElement = (linearElement, appState, pointerCoords, elementsMap) => {\n if (appState.startBoundElement != null) {\n bindLinearElement(linearElement, appState.startBoundElement, \"start\", elementsMap);\n }\n\n const hoveredElement = getHoveredElementForBinding(pointerCoords, elementsMap);\n\n if (hoveredElement != null && !isLinearElementSimpleAndAlreadyBoundOnOppositeEdge(linearElement, hoveredElement, \"end\")) {\n bindLinearElement(linearElement, hoveredElement, \"end\", elementsMap);\n }\n};\nconst bindLinearElement = (linearElement, hoveredElement, startOrEnd, elementsMap) => {\n if (!(0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isArrowElement)(linearElement)) {\n return;\n }\n\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement)(linearElement, {\n [startOrEnd === \"start\" ? \"startBinding\" : \"endBinding\"]: Object.assign({\n elementId: hoveredElement.id\n }, calculateFocusAndGap(linearElement, hoveredElement, startOrEnd, elementsMap))\n });\n const boundElementsMap = (0,_utils__WEBPACK_IMPORTED_MODULE_12__.arrayToMap)(hoveredElement.boundElements || []);\n\n if (!boundElementsMap.has(linearElement.id)) {\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement)(hoveredElement, {\n boundElements: (hoveredElement.boundElements || []).concat({\n id: linearElement.id,\n type: \"arrow\"\n })\n });\n }\n}; // Don't bind both ends of a simple segment\n\nconst isLinearElementSimpleAndAlreadyBoundOnOppositeEdge = (linearElement, bindableElement, startOrEnd) => {\n const otherBinding = linearElement[startOrEnd === \"start\" ? \"endBinding\" : \"startBinding\"];\n return isLinearElementSimpleAndAlreadyBound(linearElement, otherBinding === null || otherBinding === void 0 ? void 0 : otherBinding.elementId, bindableElement);\n};\n\nconst isLinearElementSimpleAndAlreadyBound = (linearElement, alreadyBoundToId, bindableElement) => {\n return alreadyBoundToId === bindableElement.id && isLinearElementSimple(linearElement);\n};\n\nconst isLinearElementSimple = linearElement => linearElement.points.length < 3;\n\nconst unbindLinearElement = (linearElement, startOrEnd) => {\n const field = startOrEnd === \"start\" ? \"startBinding\" : \"endBinding\";\n const binding = linearElement[field];\n\n if (binding == null) {\n return null;\n }\n\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement)(linearElement, {\n [field]: null\n });\n return binding.elementId;\n};\n\nconst getHoveredElementForBinding = (pointerCoords, elementsMap) => {\n const hoveredElement = (0,_scene__WEBPACK_IMPORTED_MODULE_7__.getElementAtPosition)([...elementsMap].map(([_, value]) => value), element => (0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isBindableElement)(element, false) && bindingBorderTest(element, pointerCoords, elementsMap));\n return hoveredElement;\n};\n\nconst calculateFocusAndGap = (linearElement, hoveredElement, startOrEnd, elementsMap) => {\n const direction = startOrEnd === \"start\" ? -1 : 1;\n const edgePointIndex = direction === -1 ? 0 : linearElement.points.length - 1;\n const adjacentPointIndex = edgePointIndex - direction;\n const edgePoint = _linearElementEditor__WEBPACK_IMPORTED_MODULE_11__.LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, edgePointIndex, elementsMap);\n const adjacentPoint = _linearElementEditor__WEBPACK_IMPORTED_MODULE_11__.LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, adjacentPointIndex, elementsMap);\n return {\n focus: determineFocusDistance(hoveredElement, adjacentPoint, edgePoint, elementsMap),\n gap: Math.max(1, distanceToBindableElement(hoveredElement, edgePoint, elementsMap))\n };\n}; // Supports translating, rotating and scaling `changedElement` with bound\n// linear elements.\n// Because scaling involves moving the focus points as well, it is\n// done before the `changedElement` is updated, and the `newSize` is passed\n// in explicitly.\n\n\nconst updateBoundElements = (changedElement, elementsMap, options) => {\n const {\n newSize,\n simultaneouslyUpdated\n } = options !== null && options !== void 0 ? options : {};\n const simultaneouslyUpdatedElementIds = getSimultaneouslyUpdatedElementIds(simultaneouslyUpdated);\n\n if (!(0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isBindableElement)(changedElement)) {\n return;\n }\n\n boundElementsVisitor(elementsMap, changedElement, element => {\n if (!(0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isLinearElement)(element) || element.isDeleted) {\n return;\n } // In case the boundElements are stale\n\n\n if (!doesNeedUpdate(element, changedElement)) {\n return;\n }\n\n const bindings = {\n startBinding: maybeCalculateNewGapWhenScaling(changedElement, element.startBinding, newSize),\n endBinding: maybeCalculateNewGapWhenScaling(changedElement, element.endBinding, newSize)\n }; // `linearElement` is being moved/scaled already, just update the binding\n\n if (simultaneouslyUpdatedElementIds.has(element.id)) {\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement)(element, bindings);\n return;\n }\n\n bindableElementsVisitor(elementsMap, element, (bindableElement, bindingProp) => {\n if (bindableElement && (0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isBindableElement)(bindableElement) && (bindingProp === \"startBinding\" || bindingProp === \"endBinding\")) {\n updateBoundPoint(element, bindingProp, bindings[bindingProp], bindableElement, elementsMap);\n }\n });\n const boundText = (0,_textElement__WEBPACK_IMPORTED_MODULE_14__.getBoundTextElement)(element, elementsMap);\n\n if (boundText && !boundText.isDeleted) {\n (0,_textElement__WEBPACK_IMPORTED_MODULE_14__.handleBindTextResize)(element, elementsMap, false);\n }\n });\n};\n\nconst doesNeedUpdate = (boundElement, changedElement) => {\n var _a, _b;\n\n return ((_a = boundElement.startBinding) === null || _a === void 0 ? void 0 : _a.elementId) === changedElement.id || ((_b = boundElement.endBinding) === null || _b === void 0 ? void 0 : _b.elementId) === changedElement.id;\n};\n\nconst getSimultaneouslyUpdatedElementIds = simultaneouslyUpdated => {\n return new Set((simultaneouslyUpdated || []).map(element => element.id));\n};\n\nconst updateBoundPoint = (linearElement, startOrEnd, binding, bindableElement, elementsMap) => {\n if (binding == null || // We only need to update the other end if this is a 2 point line element\n binding.elementId !== bindableElement.id && linearElement.points.length > 2) {\n return;\n }\n\n const direction = startOrEnd === \"startBinding\" ? -1 : 1;\n const edgePointIndex = direction === -1 ? 0 : linearElement.points.length - 1;\n const adjacentPointIndex = edgePointIndex - direction;\n const adjacentPoint = _linearElementEditor__WEBPACK_IMPORTED_MODULE_11__.LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, adjacentPointIndex, elementsMap);\n const focusPointAbsolute = determineFocusPoint(bindableElement, binding.focus, adjacentPoint, elementsMap);\n let newEdgePoint; // The linear element was not originally pointing inside the bound shape,\n // we can point directly at the focus point\n\n if (binding.gap === 0) {\n newEdgePoint = focusPointAbsolute;\n } else {\n const intersections = intersectElementWithLine(bindableElement, adjacentPoint, focusPointAbsolute, binding.gap, elementsMap);\n\n if (intersections.length === 0) {\n // This should never happen, since focusPoint should always be\n // inside the element, but just in case, bail out\n newEdgePoint = focusPointAbsolute;\n } else {\n // Guaranteed to intersect because focusPoint is always inside the shape\n newEdgePoint = intersections[0];\n }\n }\n\n _linearElementEditor__WEBPACK_IMPORTED_MODULE_11__.LinearElementEditor.movePoints(linearElement, [{\n index: edgePointIndex,\n point: _linearElementEditor__WEBPACK_IMPORTED_MODULE_11__.LinearElementEditor.pointFromAbsoluteCoords(linearElement, newEdgePoint, elementsMap)\n }], {\n [startOrEnd]: binding\n });\n};\n\nconst maybeCalculateNewGapWhenScaling = (changedElement, currentBinding, newSize) => {\n if (currentBinding == null || newSize == null) {\n return currentBinding;\n }\n\n const {\n gap,\n focus,\n elementId\n } = currentBinding;\n const {\n width: newWidth,\n height: newHeight\n } = newSize;\n const {\n width,\n height\n } = changedElement;\n const newGap = Math.max(1, Math.min(maxBindingGap(changedElement, newWidth, newHeight), gap * (newWidth < newHeight ? newWidth / width : newHeight / height)));\n return {\n elementId,\n gap: newGap,\n focus\n };\n};\n\nconst getElligibleElementForBindingElement = (linearElement, startOrEnd, elementsMap) => {\n return getHoveredElementForBinding(getLinearElementEdgeCoors(linearElement, startOrEnd, elementsMap), elementsMap);\n};\n\nconst getLinearElementEdgeCoors = (linearElement, startOrEnd, elementsMap) => {\n const index = startOrEnd === \"start\" ? 0 : -1;\n return (0,_utils__WEBPACK_IMPORTED_MODULE_12__.tupleToCoors)(_linearElementEditor__WEBPACK_IMPORTED_MODULE_11__.LinearElementEditor.getPointAtIndexGlobalCoordinates(linearElement, index, elementsMap));\n}; // We need to:\n// 1: Update elements not selected to point to duplicated elements\n// 2: Update duplicated elements to point to other duplicated elements\n\n\nconst fixBindingsAfterDuplication = (sceneElements, oldElements, oldIdToDuplicatedId, // There are three copying mechanisms: Copy-paste, duplication and alt-drag.\n// Only when alt-dragging the new \"duplicates\" act as the \"old\", while\n// the \"old\" elements act as the \"new copy\" - essentially working reverse\n// to the other two.\nduplicatesServeAsOld) => {\n // First collect all the binding/bindable elements, so we only update\n // each once, regardless of whether they were duplicated or not.\n const allBoundElementIds = new Set();\n const allBindableElementIds = new Set();\n const shouldReverseRoles = duplicatesServeAsOld === \"duplicatesServeAsOld\";\n const duplicateIdToOldId = new Map([...oldIdToDuplicatedId].map(([key, value]) => [value, key]));\n oldElements.forEach(oldElement => {\n const {\n boundElements\n } = oldElement;\n\n if (boundElements != null && boundElements.length > 0) {\n boundElements.forEach(boundElement => {\n if (shouldReverseRoles && !oldIdToDuplicatedId.has(boundElement.id)) {\n allBoundElementIds.add(boundElement.id);\n }\n });\n allBindableElementIds.add(oldIdToDuplicatedId.get(oldElement.id));\n }\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isBindingElement)(oldElement)) {\n if (oldElement.startBinding != null) {\n const {\n elementId\n } = oldElement.startBinding;\n\n if (shouldReverseRoles && !oldIdToDuplicatedId.has(elementId)) {\n allBindableElementIds.add(elementId);\n }\n }\n\n if (oldElement.endBinding != null) {\n const {\n elementId\n } = oldElement.endBinding;\n\n if (shouldReverseRoles && !oldIdToDuplicatedId.has(elementId)) {\n allBindableElementIds.add(elementId);\n }\n }\n\n if (oldElement.startBinding != null || oldElement.endBinding != null) {\n allBoundElementIds.add(oldIdToDuplicatedId.get(oldElement.id));\n }\n }\n }); // Update the linear elements\n\n sceneElements.filter(({\n id\n }) => allBoundElementIds.has(id)).forEach(element => {\n const {\n startBinding,\n endBinding\n } = element;\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement)(element, {\n startBinding: newBindingAfterDuplication(startBinding, oldIdToDuplicatedId),\n endBinding: newBindingAfterDuplication(endBinding, oldIdToDuplicatedId)\n });\n }); // Update the bindable shapes\n\n sceneElements.filter(({\n id\n }) => allBindableElementIds.has(id)).forEach(bindableElement => {\n const oldElementId = duplicateIdToOldId.get(bindableElement.id);\n const {\n boundElements\n } = sceneElements.find(({\n id\n }) => id === oldElementId);\n\n if (boundElements != null && boundElements.length > 0) {\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement)(bindableElement, {\n boundElements: boundElements.map(boundElement => oldIdToDuplicatedId.has(boundElement.id) ? {\n id: oldIdToDuplicatedId.get(boundElement.id),\n type: boundElement.type\n } : boundElement)\n });\n }\n });\n};\n\nconst newBindingAfterDuplication = (binding, oldIdToDuplicatedId) => {\n var _a;\n\n if (binding == null) {\n return null;\n }\n\n const {\n elementId,\n focus,\n gap\n } = binding;\n return {\n focus,\n gap,\n elementId: (_a = oldIdToDuplicatedId.get(elementId)) !== null && _a !== void 0 ? _a : elementId\n };\n};\n\nconst fixBindingsAfterDeletion = (sceneElements, deletedElements) => {\n const elements = (0,_utils__WEBPACK_IMPORTED_MODULE_12__.arrayToMap)(sceneElements);\n\n for (const element of deletedElements) {\n BoundElement.unbindAffected(elements, element, _mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement);\n BindableElement.unbindAffected(elements, element, _mutateElement__WEBPACK_IMPORTED_MODULE_9__.mutateElement);\n }\n};\n\nconst newBoundElements = (boundElements, idsToRemove, elementsToAdd = []) => {\n if (!boundElements) {\n return null;\n }\n\n const nextBoundElements = boundElements.filter(boundElement => !idsToRemove.has(boundElement.id));\n nextBoundElements.push(...elementsToAdd.map(x => ({\n id: x.id,\n type: x.type\n })));\n return nextBoundElements;\n};\n\nconst bindingBorderTest = (element, {\n x,\n y\n}, elementsMap) => {\n const threshold = maxBindingGap(element, element.width, element.height);\n const shape = (0,_shapes__WEBPACK_IMPORTED_MODULE_15__.getElementShape)(element, elementsMap);\n return (0,_utils_collision__WEBPACK_IMPORTED_MODULE_6__.isPointOnShape)([x, y], shape, threshold);\n};\n\nconst maxBindingGap = (element, elementWidth, elementHeight) => {\n // Aligns diamonds with rectangles\n const shapeRatio = element.type === \"diamond\" ? 1 / Math.sqrt(2) : 1;\n const smallerDimension = shapeRatio * Math.min(elementWidth, elementHeight); // We make the bindable boundary bigger for bigger elements\n\n return Math.max(16, Math.min(0.25 * smallerDimension, 32));\n};\n\nconst distanceToBindableElement = (element, point, elementsMap) => {\n switch (element.type) {\n case \"rectangle\":\n case \"image\":\n case \"text\":\n case \"iframe\":\n case \"embeddable\":\n case \"frame\":\n case \"magicframe\":\n return distanceToRectangle(element, point, elementsMap);\n\n case \"diamond\":\n return distanceToDiamond(element, point, elementsMap);\n\n case \"ellipse\":\n return distanceToEllipse(element, point, elementsMap);\n }\n};\n\nconst distanceToRectangle = (element, point, elementsMap) => {\n const [, pointRel, hwidth, hheight] = pointRelativeToElement(element, point, elementsMap);\n return Math.max(_gapoints__WEBPACK_IMPORTED_MODULE_1__.distanceToLine(pointRel, _galines__WEBPACK_IMPORTED_MODULE_3__.equation(0, 1, -hheight)), _gapoints__WEBPACK_IMPORTED_MODULE_1__.distanceToLine(pointRel, _galines__WEBPACK_IMPORTED_MODULE_3__.equation(1, 0, -hwidth)));\n};\n\nconst distanceToDiamond = (element, point, elementsMap) => {\n const [, pointRel, hwidth, hheight] = pointRelativeToElement(element, point, elementsMap);\n const side = _galines__WEBPACK_IMPORTED_MODULE_3__.equation(hheight, hwidth, -hheight * hwidth);\n return _gapoints__WEBPACK_IMPORTED_MODULE_1__.distanceToLine(pointRel, side);\n};\n\nconst distanceToEllipse = (element, point, elementsMap) => {\n const [pointRel, tangent] = ellipseParamsForTest(element, point, elementsMap);\n return -_galines__WEBPACK_IMPORTED_MODULE_3__.sign(tangent) * _gapoints__WEBPACK_IMPORTED_MODULE_1__.distanceToLine(pointRel, tangent);\n};\n\nconst ellipseParamsForTest = (element, point, elementsMap) => {\n const [, pointRel, hwidth, hheight] = pointRelativeToElement(element, point, elementsMap);\n const [px, py] = _gapoints__WEBPACK_IMPORTED_MODULE_1__.toTuple(pointRel); // We're working in positive quadrant, so start with `t = 45deg`, `tx=cos(t)`\n\n let tx = 0.707;\n let ty = 0.707;\n const a = hwidth;\n const b = hheight; // This is a numerical method to find the params tx, ty at which\n // the ellipse has the closest point to the given point\n\n [0, 1, 2, 3].forEach(_ => {\n const xx = a * tx;\n const yy = b * ty;\n const ex = (a * a - b * b) * tx ** 3 / a;\n const ey = (b * b - a * a) * ty ** 3 / b;\n const rx = xx - ex;\n const ry = yy - ey;\n const qx = px - ex;\n const qy = py - ey;\n const r = Math.hypot(ry, rx);\n const q = Math.hypot(qy, qx);\n tx = Math.min(1, Math.max(0, (qx * r / q + ex) / a));\n ty = Math.min(1, Math.max(0, (qy * r / q + ey) / b));\n const t = Math.hypot(ty, tx);\n tx /= t;\n ty /= t;\n });\n const closestPoint = _ga__WEBPACK_IMPORTED_MODULE_0__.point(a * tx, b * ty);\n const tangent = _galines__WEBPACK_IMPORTED_MODULE_3__.orthogonalThrough(pointRel, closestPoint);\n return [pointRel, tangent];\n}; // Returns:\n// 1. the point relative to the elements (x, y) position\n// 2. the point relative to the element's center with positive (x, y)\n// 3. half element width\n// 4. half element height\n//\n// Note that for linear elements the (x, y) position is not at the\n// top right corner of their boundary.\n//\n// Rectangles, diamonds and ellipses are symmetrical over axes,\n// and other elements have a rectangular boundary,\n// so we only need to perform hit tests for the positive quadrant.\n\n\nconst pointRelativeToElement = (element, pointTuple, elementsMap) => {\n const point = _gapoints__WEBPACK_IMPORTED_MODULE_1__.from(pointTuple);\n const [x1, y1, x2, y2] = (0,_bounds__WEBPACK_IMPORTED_MODULE_5__.getElementAbsoluteCoords)(element, elementsMap);\n const center = coordsCenter(x1, y1, x2, y2); // GA has angle orientation opposite to `rotate`\n\n const rotate = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.rotation(center, element.angle);\n const pointRotated = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(rotate, point);\n const pointRelToCenter = _ga__WEBPACK_IMPORTED_MODULE_0__.sub(pointRotated, _gadirections__WEBPACK_IMPORTED_MODULE_2__.from(center));\n const pointRelToCenterAbs = _gapoints__WEBPACK_IMPORTED_MODULE_1__.abs(pointRelToCenter);\n const elementPos = _ga__WEBPACK_IMPORTED_MODULE_0__.offset(element.x, element.y);\n const pointRelToPos = _ga__WEBPACK_IMPORTED_MODULE_0__.sub(pointRotated, elementPos);\n const halfWidth = (x2 - x1) / 2;\n const halfHeight = (y2 - y1) / 2;\n return [pointRelToPos, pointRelToCenterAbs, halfWidth, halfHeight];\n};\n\nconst relativizationToElementCenter = (element, elementsMap) => {\n const [x1, y1, x2, y2] = (0,_bounds__WEBPACK_IMPORTED_MODULE_5__.getElementAbsoluteCoords)(element, elementsMap);\n const center = coordsCenter(x1, y1, x2, y2); // GA has angle orientation opposite to `rotate`\n\n const rotate = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.rotation(center, element.angle);\n const translate = _ga__WEBPACK_IMPORTED_MODULE_0__.reverse(_gatransforms__WEBPACK_IMPORTED_MODULE_4__.translation(_gadirections__WEBPACK_IMPORTED_MODULE_2__.from(center)));\n return _gatransforms__WEBPACK_IMPORTED_MODULE_4__.compose(rotate, translate);\n};\n\nconst coordsCenter = (x1, y1, x2, y2) => {\n return _ga__WEBPACK_IMPORTED_MODULE_0__.point((x1 + x2) / 2, (y1 + y2) / 2);\n}; // The focus distance is the oriented ratio between the size of\n// the `element` and the \"focus image\" of the element on which\n// all focus points lie, so it's a number between -1 and 1.\n// The line going through `a` and `b` is a tangent to the \"focus image\"\n// of the element.\n\n\nconst determineFocusDistance = ( //zsviczian added export\nelement, // Point on the line, in absolute coordinates\na, // Another point on the line, in absolute coordinates (closer to element)\nb, elementsMap) => {\n const relateToCenter = relativizationToElementCenter(element, elementsMap);\n const aRel = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(relateToCenter, _gapoints__WEBPACK_IMPORTED_MODULE_1__.from(a));\n const bRel = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(relateToCenter, _gapoints__WEBPACK_IMPORTED_MODULE_1__.from(b));\n const line = _galines__WEBPACK_IMPORTED_MODULE_3__.through(aRel, bRel);\n const q = element.height / element.width;\n const hwidth = element.width / 2;\n const hheight = element.height / 2;\n const n = line[2];\n const m = line[3];\n const c = line[1];\n const mabs = Math.abs(m);\n const nabs = Math.abs(n);\n let ret;\n\n switch (element.type) {\n case \"rectangle\":\n case \"image\":\n case \"text\":\n case \"iframe\":\n case \"embeddable\":\n case \"frame\":\n case \"magicframe\":\n ret = c / (hwidth * (nabs + q * mabs));\n break;\n\n case \"diamond\":\n ret = mabs < nabs ? c / (nabs * hwidth) : c / (mabs * hheight);\n break;\n\n case \"ellipse\":\n ret = c / (hwidth * Math.sqrt(n ** 2 + q ** 2 * m ** 2));\n break;\n }\n\n return ret || 0;\n};\n\nconst determineFocusPoint = (element, // The oriented, relative distance from the center of `element` of the\n// returned focusPoint\nfocus, adjecentPoint, elementsMap) => {\n if (focus === 0) {\n const [x1, y1, x2, y2] = (0,_bounds__WEBPACK_IMPORTED_MODULE_5__.getElementAbsoluteCoords)(element, elementsMap);\n const center = coordsCenter(x1, y1, x2, y2);\n return _gapoints__WEBPACK_IMPORTED_MODULE_1__.toTuple(center);\n }\n\n const relateToCenter = relativizationToElementCenter(element, elementsMap);\n const adjecentPointRel = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(relateToCenter, _gapoints__WEBPACK_IMPORTED_MODULE_1__.from(adjecentPoint));\n const reverseRelateToCenter = _ga__WEBPACK_IMPORTED_MODULE_0__.reverse(relateToCenter);\n let point;\n\n switch (element.type) {\n case \"rectangle\":\n case \"image\":\n case \"text\":\n case \"diamond\":\n case \"iframe\":\n case \"embeddable\":\n case \"frame\":\n case \"magicframe\":\n point = findFocusPointForRectangulars(element, focus, adjecentPointRel);\n break;\n\n case \"ellipse\":\n point = findFocusPointForEllipse(element, focus, adjecentPointRel);\n break;\n }\n\n return _gapoints__WEBPACK_IMPORTED_MODULE_1__.toTuple(_gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(reverseRelateToCenter, point));\n}; // Returns 2 or 0 intersection points between line going through `a` and `b`\n// and the `element`, in ascending order of distance from `a`.\n\n\nconst intersectElementWithLine = ( //zsviczian added export\nelement, // Point on the line, in absolute coordinates\na, // Another point on the line, in absolute coordinates\nb, // If given, the element is inflated by this value\ngap = 0, elementsMap) => {\n const relateToCenter = relativizationToElementCenter(element, elementsMap);\n const aRel = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(relateToCenter, _gapoints__WEBPACK_IMPORTED_MODULE_1__.from(a));\n const bRel = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(relateToCenter, _gapoints__WEBPACK_IMPORTED_MODULE_1__.from(b));\n const line = _galines__WEBPACK_IMPORTED_MODULE_3__.through(aRel, bRel);\n const reverseRelateToCenter = _ga__WEBPACK_IMPORTED_MODULE_0__.reverse(relateToCenter);\n const intersections = getSortedElementLineIntersections(element, line, aRel, gap);\n return intersections.map(point => _gapoints__WEBPACK_IMPORTED_MODULE_1__.toTuple(_gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(reverseRelateToCenter, point)));\n};\n\nconst getSortedElementLineIntersections = (element, // Relative to element center\nline, // Relative to element center\nnearPoint, gap = 0) => {\n let intersections;\n\n switch (element.type) {\n case \"rectangle\":\n case \"image\":\n case \"text\":\n case \"diamond\":\n case \"iframe\":\n case \"embeddable\":\n case \"frame\":\n case \"magicframe\":\n const corners = getCorners(element);\n intersections = corners.flatMap((point, i) => {\n const edge = [point, corners[(i + 1) % 4]];\n return intersectSegment(line, offsetSegment(edge, gap));\n }).concat(corners.flatMap(point => getCircleIntersections(point, gap, line)));\n break;\n\n case \"ellipse\":\n intersections = getEllipseIntersections(element, gap, line);\n break;\n }\n\n if (intersections.length < 2) {\n // Ignore the \"edge\" case of only intersecting with a single corner\n return [];\n }\n\n const sortedIntersections = intersections.sort((i1, i2) => _gapoints__WEBPACK_IMPORTED_MODULE_1__.distance(i1, nearPoint) - _gapoints__WEBPACK_IMPORTED_MODULE_1__.distance(i2, nearPoint));\n return [sortedIntersections[0], sortedIntersections[sortedIntersections.length - 1]];\n};\n\nconst getCorners = (element, scale = 1) => {\n const hx = scale * element.width / 2;\n const hy = scale * element.height / 2;\n\n switch (element.type) {\n case \"rectangle\":\n case \"image\":\n case \"text\":\n case \"iframe\":\n case \"embeddable\":\n case \"frame\":\n case \"magicframe\":\n return [_ga__WEBPACK_IMPORTED_MODULE_0__.point(hx, hy), _ga__WEBPACK_IMPORTED_MODULE_0__.point(hx, -hy), _ga__WEBPACK_IMPORTED_MODULE_0__.point(-hx, -hy), _ga__WEBPACK_IMPORTED_MODULE_0__.point(-hx, hy)];\n\n case \"diamond\":\n return [_ga__WEBPACK_IMPORTED_MODULE_0__.point(0, hy), _ga__WEBPACK_IMPORTED_MODULE_0__.point(hx, 0), _ga__WEBPACK_IMPORTED_MODULE_0__.point(0, -hy), _ga__WEBPACK_IMPORTED_MODULE_0__.point(-hx, 0)];\n }\n}; // Returns intersection of `line` with `segment`, with `segment` moved by\n// `gap` in its polar direction.\n// If intersection coincides with second segment point returns empty array.\n\n\nconst intersectSegment = (line, segment) => {\n const [a, b] = segment;\n const aDist = _gapoints__WEBPACK_IMPORTED_MODULE_1__.distanceToLine(a, line);\n const bDist = _gapoints__WEBPACK_IMPORTED_MODULE_1__.distanceToLine(b, line);\n\n if (aDist * bDist >= 0) {\n // The intersection is outside segment `(a, b)`\n return [];\n }\n\n return [_gapoints__WEBPACK_IMPORTED_MODULE_1__.intersect(line, _galines__WEBPACK_IMPORTED_MODULE_3__.through(a, b))];\n};\n\nconst offsetSegment = (segment, distance) => {\n const [a, b] = segment;\n const offset = _gatransforms__WEBPACK_IMPORTED_MODULE_4__.translationOrthogonal(_gadirections__WEBPACK_IMPORTED_MODULE_2__.fromTo(a, b), distance);\n return [_gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(offset, a), _gatransforms__WEBPACK_IMPORTED_MODULE_4__.apply(offset, b)];\n};\n\nconst getEllipseIntersections = (element, gap, line) => {\n const a = element.width / 2 + gap;\n const b = element.height / 2 + gap;\n const m = line[2];\n const n = line[3];\n const c = line[1];\n const squares = a * a * m * m + b * b * n * n;\n const discr = squares - c * c;\n\n if (squares === 0 || discr <= 0) {\n return [];\n }\n\n const discrRoot = Math.sqrt(discr);\n const xn = -a * a * m * c;\n const yn = -b * b * n * c;\n return [_ga__WEBPACK_IMPORTED_MODULE_0__.point((xn + a * b * n * discrRoot) / squares, (yn - a * b * m * discrRoot) / squares), _ga__WEBPACK_IMPORTED_MODULE_0__.point((xn - a * b * n * discrRoot) / squares, (yn + a * b * m * discrRoot) / squares)];\n};\n\nconst getCircleIntersections = (center, radius, line) => {\n if (radius === 0) {\n return _gapoints__WEBPACK_IMPORTED_MODULE_1__.distanceToLine(line, center) === 0 ? [center] : [];\n }\n\n const m = line[2];\n const n = line[3];\n const c = line[1];\n const [a, b] = _gapoints__WEBPACK_IMPORTED_MODULE_1__.toTuple(center);\n const r = radius;\n const squares = m * m + n * n;\n const discr = r * r * squares - (m * a + n * b + c) ** 2;\n\n if (squares === 0 || discr <= 0) {\n return [];\n }\n\n const discrRoot = Math.sqrt(discr);\n const xn = a * n * n - b * m * n - m * c;\n const yn = b * m * m - a * m * n - n * c;\n return [_ga__WEBPACK_IMPORTED_MODULE_0__.point((xn + n * discrRoot) / squares, (yn - m * discrRoot) / squares), _ga__WEBPACK_IMPORTED_MODULE_0__.point((xn - n * discrRoot) / squares, (yn + m * discrRoot) / squares)];\n}; // The focus point is the tangent point of the \"focus image\" of the\n// `element`, where the tangent goes through `point`.\n\n\nconst findFocusPointForEllipse = (ellipse, // Between -1 and 1 (not 0) the relative size of the \"focus image\" of\n// the element on which the focus point lies\nrelativeDistance, // The point for which we're trying to find the focus point, relative\n// to the ellipse center.\npoint) => {\n const relativeDistanceAbs = Math.abs(relativeDistance);\n const a = ellipse.width * relativeDistanceAbs / 2;\n const b = ellipse.height * relativeDistanceAbs / 2;\n const orientation = Math.sign(relativeDistance);\n const [px, pyo] = _gapoints__WEBPACK_IMPORTED_MODULE_1__.toTuple(point); // The calculation below can't handle py = 0\n\n const py = pyo === 0 ? 0.0001 : pyo;\n const squares = px ** 2 * b ** 2 + py ** 2 * a ** 2; // Tangent mx + ny + 1 = 0\n\n const m = (-px * b ** 2 + orientation * py * Math.sqrt(Math.max(0, squares - a ** 2 * b ** 2))) / squares;\n let n = (-m * px - 1) / py;\n\n if (n === 0) {\n // if zero {-0, 0}, fall back to a same-sign value in the similar range\n n = (Object.is(n, -0) ? -1 : 1) * 0.01;\n }\n\n const x = -(a ** 2 * m) / (n ** 2 * b ** 2 + m ** 2 * a ** 2);\n return _ga__WEBPACK_IMPORTED_MODULE_0__.point(x, (-m * x - 1) / (n === 0 ? 0.0001 : n)); //zsviczian https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/1054\n};\n\nconst findFocusPointForRectangulars = (element, // Between -1 and 1 for how far away should the focus point be relative\n// to the size of the element. Sign determines orientation.\nrelativeDistance, // The point for which we're trying to find the focus point, relative\n// to the element center.\npoint) => {\n const relativeDistanceAbs = Math.abs(relativeDistance);\n const orientation = Math.sign(relativeDistance);\n const corners = getCorners(element, relativeDistanceAbs);\n let maxDistance = 0;\n let tangentPoint = null;\n corners.forEach(corner => {\n const distance = orientation * _galines__WEBPACK_IMPORTED_MODULE_3__.through(point, corner)[1];\n\n if (distance > maxDistance) {\n maxDistance = distance;\n tangentPoint = corner;\n }\n });\n return tangentPoint;\n};\n\nconst bindingProperties = new Set([\"boundElements\", \"frameId\", \"containerId\", \"startBinding\", \"endBinding\"]);\n/**\r\n * Tries to visit each bound element (does not have to be found).\r\n */\n\nconst boundElementsVisitor = (elements, element, visit) => {\n var _a, _b;\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isBindableElement)(element)) {\n // create new instance so that possible mutations won't play a role in visiting order\n const boundElements = (_b = (_a = element.boundElements) === null || _a === void 0 ? void 0 : _a.slice()) !== null && _b !== void 0 ? _b : []; // last added text should be the one we keep (~previous are duplicates)\n\n boundElements.forEach(({\n id\n }) => {\n visit(elements.get(id), \"boundElements\", id);\n });\n }\n};\n/**\r\n * Tries to visit each bindable element (does not have to be found).\r\n */\n\n\nconst bindableElementsVisitor = (elements, element, visit) => {\n if (element.frameId) {\n const id = element.frameId;\n visit(elements.get(id), \"frameId\", id);\n }\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isBoundToContainer)(element)) {\n const id = element.containerId;\n visit(elements.get(id), \"containerId\", id);\n }\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isArrowElement)(element)) {\n if (element.startBinding) {\n const id = element.startBinding.elementId;\n visit(elements.get(id), \"startBinding\", id);\n }\n\n if (element.endBinding) {\n const id = element.endBinding.elementId;\n visit(elements.get(id), \"endBinding\", id);\n }\n }\n};\n/**\r\n * Bound element containing bindings to `frameId`, `containerId`, `startBinding` or `endBinding`.\r\n */\n\n\nclass BoundElement {\n /**\r\n * Unbind the affected non deleted bindable elements (removing element from `boundElements`).\r\n * - iterates non deleted bindable elements (`containerId` | `startBinding.elementId` | `endBinding.elementId`) of the current element\r\n * - prepares updates to unbind each bindable element's `boundElements` from the current element\r\n */\n static unbindAffected(elements, boundElement, updateElementWith) {\n if (!boundElement) {\n return;\n }\n\n bindableElementsVisitor(elements, boundElement, bindableElement => {\n // bindable element is deleted, this is fine\n if (!bindableElement || bindableElement.isDeleted) {\n return;\n }\n\n boundElementsVisitor(elements, bindableElement, (_, __, boundElementId) => {\n if (boundElementId === boundElement.id) {\n updateElementWith(bindableElement, {\n boundElements: newBoundElements(bindableElement.boundElements, new Set([boundElementId]))\n });\n }\n });\n });\n }\n\n}\n/**\r\n * Rebind the next affected non deleted bindable elements (adding element to `boundElements`).\r\n * - iterates non deleted bindable elements (`containerId` | `startBinding.elementId` | `endBinding.elementId`) of the current element\r\n * - prepares updates to rebind each bindable element's `boundElements` to the current element\r\n *\r\n * NOTE: rebind expects that affected elements were previously unbound with `BoundElement.unbindAffected`\r\n */\n\nBoundElement.rebindAffected = (elements, boundElement, updateElementWith) => {\n // don't try to rebind element that is deleted\n if (!boundElement || boundElement.isDeleted) {\n return;\n }\n\n bindableElementsVisitor(elements, boundElement, (bindableElement, bindingProp) => {\n var _a, _b; // unbind from bindable elements, as bindings from non deleted elements into deleted elements are incorrect\n\n\n if (!bindableElement || bindableElement.isDeleted) {\n updateElementWith(boundElement, {\n [bindingProp]: null\n });\n return;\n } // frame bindings are unidirectional, there is nothing to rebind\n\n\n if (bindingProp === \"frameId\") {\n return;\n }\n\n if ((_a = bindableElement.boundElements) === null || _a === void 0 ? void 0 : _a.find(x => x.id === boundElement.id)) {\n return;\n }\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isArrowElement)(boundElement)) {\n // rebind if not found!\n updateElementWith(bindableElement, {\n boundElements: newBoundElements(bindableElement.boundElements, new Set(), new Array(boundElement))\n });\n }\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isTextElement)(boundElement)) {\n if (!((_b = bindableElement.boundElements) === null || _b === void 0 ? void 0 : _b.find(x => x.type === \"text\"))) {\n // rebind only if there is no other text bound already\n updateElementWith(bindableElement, {\n boundElements: newBoundElements(bindableElement.boundElements, new Set(), new Array(boundElement))\n });\n } else {\n // unbind otherwise\n updateElementWith(boundElement, {\n [bindingProp]: null\n });\n }\n }\n });\n};\n/**\r\n * Bindable element containing bindings to `boundElements`.\r\n */\n\n\nclass BindableElement {\n /**\r\n * Unbind the affected non deleted bound elements (resetting `containerId`, `startBinding`, `endBinding` to `null`).\r\n * - iterates through non deleted `boundElements` of the current element\r\n * - prepares updates to unbind each bound element from the current element\r\n */\n static unbindAffected(elements, bindableElement, updateElementWith) {\n if (!bindableElement) {\n return;\n }\n\n boundElementsVisitor(elements, bindableElement, boundElement => {\n // bound element is deleted, this is fine\n if (!boundElement || boundElement.isDeleted) {\n return;\n }\n\n bindableElementsVisitor(elements, boundElement, (_, bindingProp, bindableElementId) => {\n // making sure there is an element to be unbound\n if (bindableElementId === bindableElement.id) {\n updateElementWith(boundElement, {\n [bindingProp]: null\n });\n }\n });\n });\n }\n\n}\n/**\r\n * Rebind the affected non deleted bound elements (for now setting only `containerId`, as we cannot rebind arrows atm).\r\n * - iterates through non deleted `boundElements` of the current element\r\n * - prepares updates to rebind each bound element to the current element or unbind it from `boundElements` in case of conflicts\r\n *\r\n * NOTE: rebind expects that affected elements were previously unbound with `BindaleElement.unbindAffected`\r\n */\n\nBindableElement.rebindAffected = (elements, bindableElement, updateElementWith) => {\n // don't try to rebind element that is deleted (i.e. updated as deleted)\n if (!bindableElement || bindableElement.isDeleted) {\n return;\n }\n\n boundElementsVisitor(elements, bindableElement, (boundElement, _, boundElementId) => {\n var _a, _b, _c; // unbind from bindable elements, as bindings from non deleted elements into deleted elements are incorrect\n\n\n if (!boundElement || boundElement.isDeleted) {\n updateElementWith(bindableElement, {\n boundElements: newBoundElements(bindableElement.boundElements, new Set([boundElementId]))\n });\n return;\n }\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_8__.isTextElement)(boundElement)) {\n const boundElements = (_b = (_a = bindableElement.boundElements) === null || _a === void 0 ? void 0 : _a.slice()) !== null && _b !== void 0 ? _b : []; // check if this is the last element in the array, if not, there is an previously bound text which should be unbound\n\n if (((_c = boundElements.reverse().find(x => x.type === \"text\")) === null || _c === void 0 ? void 0 : _c.id) === boundElement.id) {\n if (boundElement.containerId !== bindableElement.id) {\n // rebind if not bound already!\n updateElementWith(boundElement, {\n containerId: bindableElement.id\n });\n }\n } else {\n if (boundElement.containerId !== null) {\n // unbind if not unbound already\n updateElementWith(boundElement, {\n containerId: null\n });\n } // unbind from boundElements as the element got bound to some other element in the meantime\n\n\n updateElementWith(bindableElement, {\n boundElements: newBoundElements(bindableElement.boundElements, new Set([boundElement.id]))\n });\n }\n }\n });\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./element/binding.ts?");
2645
2645
 
2646
2646
  /***/ }),
2647
2647
 
@@ -2729,7 +2729,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
2729
2729
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
2730
2730
 
2731
2731
  "use strict";
2732
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"LinearElementEditor\": () => (/* binding */ LinearElementEditor)\n/* harmony export */ });\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../math */ \"./math.ts\");\n/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! . */ \"./element/index.ts\");\n/* harmony import */ var _bounds__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _mutateElement__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _binding__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./binding */ \"./element/binding.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _typeChecks__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _keys__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../keys */ \"./keys.ts\");\n/* harmony import */ var _textElement__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../constants */ \"./constants.ts\");\n/* harmony import */ var _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../scene/ShapeCache */ \"./scene/ShapeCache.ts\");\n\n\n\n\n\n\n\n\n\n\n\nconst editorMidPointsCache = {\n version: null,\n points: [],\n zoom: null\n};\nclass LinearElementEditor {\n constructor(element) {\n this.elementId = element.id;\n LinearElementEditor.normalizePoints(element);\n this.selectedPointsIndices = null;\n this.lastUncommittedPoint = null;\n this.isDragging = false;\n this.pointerOffset = {\n x: 0,\n y: 0\n };\n this.startBindingElement = \"keep\";\n this.endBindingElement = \"keep\";\n this.pointerDownState = {\n prevSelectedPointsIndices: null,\n lastClickedPoint: -1,\n origin: null,\n segmentMidpoint: {\n value: null,\n index: null,\n added: false\n }\n };\n this.hoverPointIndex = -1;\n this.segmentMidPointHoveredCoords = null;\n }\n /**\r\n * @param id the `elementId` from the instance of this class (so that we can\r\n * statically guarantee this method returns an ExcalidrawLinearElement)\r\n */\n\n\n static getElement(id, elementsMap) {\n const element = elementsMap.get(id);\n\n if (element) {\n return element;\n }\n\n return null;\n }\n\n static handleBoxSelection(event, appState, setState, elementsMap) {\n var _a;\n\n if (!appState.editingLinearElement || ((_a = appState.draggingElement) === null || _a === void 0 ? void 0 : _a.type) !== \"selection\") {\n return false;\n }\n\n const {\n editingLinearElement\n } = appState;\n const {\n selectedPointsIndices,\n elementId\n } = editingLinearElement;\n const element = LinearElementEditor.getElement(elementId, elementsMap);\n\n if (!element) {\n return false;\n }\n\n const [selectionX1, selectionY1, selectionX2, selectionY2] = (0,___WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(appState.draggingElement, elementsMap);\n const pointsSceneCoords = LinearElementEditor.getPointsGlobalCoordinates(element, elementsMap);\n const nextSelectedPoints = pointsSceneCoords.reduce((acc, point, index) => {\n if (point[0] >= selectionX1 && point[0] <= selectionX2 && point[1] >= selectionY1 && point[1] <= selectionY2 || event.shiftKey && (selectedPointsIndices === null || selectedPointsIndices === void 0 ? void 0 : selectedPointsIndices.includes(index))) {\n acc.push(index);\n }\n\n return acc;\n }, []);\n setState({\n editingLinearElement: Object.assign(Object.assign({}, editingLinearElement), {\n selectedPointsIndices: nextSelectedPoints.length ? nextSelectedPoints : null\n })\n });\n }\n /** @returns whether point was dragged */\n\n\n static handlePointDragging(event, appState, scenePointerX, scenePointerY, maybeSuggestBinding, linearElementEditor, elementsMap) {\n if (!linearElementEditor) {\n return false;\n }\n\n const {\n selectedPointsIndices,\n elementId\n } = linearElementEditor;\n const element = LinearElementEditor.getElement(elementId, elementsMap);\n\n if (!element) {\n return false;\n } // point that's being dragged (out of all selected points)\n\n\n const draggingPoint = element.points[linearElementEditor.pointerDownState.lastClickedPoint];\n\n if (selectedPointsIndices && draggingPoint) {\n if ((0,_keys__WEBPACK_IMPORTED_MODULE_7__.shouldRotateWithDiscreteAngle)(event) && selectedPointsIndices.length === 1 && element.points.length > 1) {\n const selectedIndex = selectedPointsIndices[0];\n const referencePoint = element.points[selectedIndex === 0 ? 1 : selectedIndex - 1];\n\n const [width, height] = LinearElementEditor._getShiftLockedDelta(element, elementsMap, referencePoint, [scenePointerX, scenePointerY], event[_keys__WEBPACK_IMPORTED_MODULE_7__.KEYS.CTRL_OR_CMD] ? null : appState.gridSize);\n\n LinearElementEditor.movePoints(element, [{\n index: selectedIndex,\n point: [width + referencePoint[0], height + referencePoint[1]],\n isDragging: selectedIndex === linearElementEditor.pointerDownState.lastClickedPoint\n }]);\n } else {\n const newDraggingPointPosition = LinearElementEditor.createPointAt(element, elementsMap, scenePointerX - linearElementEditor.pointerOffset.x, scenePointerY - linearElementEditor.pointerOffset.y, event[_keys__WEBPACK_IMPORTED_MODULE_7__.KEYS.CTRL_OR_CMD] ? null : appState.gridSize);\n const deltaX = newDraggingPointPosition[0] - draggingPoint[0];\n const deltaY = newDraggingPointPosition[1] - draggingPoint[1];\n LinearElementEditor.movePoints(element, selectedPointsIndices.map(pointIndex => {\n const newPointPosition = pointIndex === linearElementEditor.pointerDownState.lastClickedPoint ? LinearElementEditor.createPointAt(element, elementsMap, scenePointerX - linearElementEditor.pointerOffset.x, scenePointerY - linearElementEditor.pointerOffset.y, event[_keys__WEBPACK_IMPORTED_MODULE_7__.KEYS.CTRL_OR_CMD] ? null : appState.gridSize) : [element.points[pointIndex][0] + deltaX, element.points[pointIndex][1] + deltaY];\n return {\n index: pointIndex,\n point: newPointPosition,\n isDragging: pointIndex === linearElementEditor.pointerDownState.lastClickedPoint\n };\n }));\n }\n\n const boundTextElement = (0,_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(element, elementsMap);\n\n if (boundTextElement) {\n (0,_textElement__WEBPACK_IMPORTED_MODULE_8__.handleBindTextResize)(element, elementsMap, false);\n } // suggest bindings for first and last point if selected\n\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_6__.isBindingElement)(element, false)) {\n const coords = [];\n const firstSelectedIndex = selectedPointsIndices[0];\n\n if (firstSelectedIndex === 0) {\n coords.push((0,_utils__WEBPACK_IMPORTED_MODULE_5__.tupleToCoors)(LinearElementEditor.getPointGlobalCoordinates(element, element.points[0], elementsMap)));\n }\n\n const lastSelectedIndex = selectedPointsIndices[selectedPointsIndices.length - 1];\n\n if (lastSelectedIndex === element.points.length - 1) {\n coords.push((0,_utils__WEBPACK_IMPORTED_MODULE_5__.tupleToCoors)(LinearElementEditor.getPointGlobalCoordinates(element, element.points[lastSelectedIndex], elementsMap)));\n }\n\n if (coords.length) {\n maybeSuggestBinding(element, coords);\n }\n }\n\n return true;\n }\n\n return false;\n }\n\n static handlePointerUp(event, editingLinearElement, appState, app) {\n var _a;\n\n const elementsMap = app.scene.getNonDeletedElementsMap();\n const {\n elementId,\n selectedPointsIndices,\n isDragging,\n pointerDownState\n } = editingLinearElement;\n const element = LinearElementEditor.getElement(elementId, elementsMap);\n\n if (!element) {\n return editingLinearElement;\n }\n\n const bindings = {};\n\n if (isDragging && selectedPointsIndices) {\n for (const selectedPoint of selectedPointsIndices) {\n if (selectedPoint === 0 || selectedPoint === element.points.length - 1) {\n if ((0,_math__WEBPACK_IMPORTED_MODULE_0__.isPathALoop)(element.points, appState.zoom.value)) {\n LinearElementEditor.movePoints(element, [{\n index: selectedPoint,\n point: selectedPoint === 0 ? element.points[element.points.length - 1] : element.points[0]\n }]);\n }\n\n const bindingElement = (0,_binding__WEBPACK_IMPORTED_MODULE_4__.isBindingEnabled)(appState) ? (0,_binding__WEBPACK_IMPORTED_MODULE_4__.getHoveredElementForBinding)((0,_utils__WEBPACK_IMPORTED_MODULE_5__.tupleToCoors)(LinearElementEditor.getPointAtIndexGlobalCoordinates(element, selectedPoint, elementsMap)), app) : null;\n bindings[selectedPoint === 0 ? \"startBindingElement\" : \"endBindingElement\"] = bindingElement;\n }\n }\n }\n\n return Object.assign(Object.assign(Object.assign({}, editingLinearElement), bindings), {\n // if clicking without previously dragging a point(s), and not holding\n // shift, deselect all points except the one clicked. If holding shift,\n // toggle the point.\n selectedPointsIndices: isDragging || event.shiftKey ? !isDragging && event.shiftKey && ((_a = pointerDownState.prevSelectedPointsIndices) === null || _a === void 0 ? void 0 : _a.includes(pointerDownState.lastClickedPoint)) ? selectedPointsIndices && selectedPointsIndices.filter(pointIndex => pointIndex !== pointerDownState.lastClickedPoint) : selectedPointsIndices : (selectedPointsIndices === null || selectedPointsIndices === void 0 ? void 0 : selectedPointsIndices.includes(pointerDownState.lastClickedPoint)) ? [pointerDownState.lastClickedPoint] : selectedPointsIndices,\n isDragging: false,\n pointerOffset: {\n x: 0,\n y: 0\n }\n });\n }\n\n static isSegmentTooShort(element, startPoint, endPoint, zoom) {\n let distance = (0,_math__WEBPACK_IMPORTED_MODULE_0__.distance2d)(startPoint[0], startPoint[1], endPoint[0], endPoint[1]);\n\n if (element.points.length > 2 && element.roundness) {\n distance = (0,_math__WEBPACK_IMPORTED_MODULE_0__.getBezierCurveLength)(element, endPoint);\n }\n\n return distance * zoom.value < LinearElementEditor.POINT_HANDLE_SIZE * 4;\n }\n\n static getSegmentMidPoint(element, startPoint, endPoint, endPointIndex, elementsMap) {\n let segmentMidPoint = (0,_math__WEBPACK_IMPORTED_MODULE_0__.centerPoint)(startPoint, endPoint);\n\n if (element.points.length > 2 && element.roundness) {\n const controlPoints = (0,_math__WEBPACK_IMPORTED_MODULE_0__.getControlPointsForBezierCurve)(element, element.points[endPointIndex]);\n\n if (controlPoints) {\n const t = (0,_math__WEBPACK_IMPORTED_MODULE_0__.mapIntervalToBezierT)(element, element.points[endPointIndex], 0.5);\n const [tx, ty] = (0,_math__WEBPACK_IMPORTED_MODULE_0__.getBezierXY)(controlPoints[0], controlPoints[1], controlPoints[2], controlPoints[3], t);\n segmentMidPoint = LinearElementEditor.getPointGlobalCoordinates(element, [tx, ty], elementsMap);\n }\n }\n\n return segmentMidPoint;\n }\n\n static getSegmentMidPointIndex(linearElementEditor, appState, midPoint, elementsMap) {\n const element = LinearElementEditor.getElement(linearElementEditor.elementId, elementsMap);\n\n if (!element) {\n return -1;\n }\n\n const midPoints = LinearElementEditor.getEditorMidPoints(element, elementsMap, appState);\n let index = 0;\n\n while (index < midPoints.length) {\n if (LinearElementEditor.arePointsEqual(midPoint, midPoints[index])) {\n return index + 1;\n }\n\n index++;\n }\n\n return -1;\n }\n\n static handlePointerDown(event, appState, store, scenePointer, linearElementEditor, app) {\n var _a;\n\n const elementsMap = app.scene.getNonDeletedElementsMap();\n const ret = {\n didAddPoint: false,\n hitElement: null,\n linearElementEditor: null\n };\n\n if (!linearElementEditor) {\n return ret;\n }\n\n const {\n elementId\n } = linearElementEditor;\n const element = LinearElementEditor.getElement(elementId, elementsMap);\n\n if (!element) {\n return ret;\n }\n\n const segmentMidpoint = LinearElementEditor.getSegmentMidpointHitCoords(linearElementEditor, scenePointer, appState, elementsMap);\n let segmentMidpointIndex = null;\n\n if (segmentMidpoint) {\n segmentMidpointIndex = LinearElementEditor.getSegmentMidPointIndex(linearElementEditor, appState, segmentMidpoint, elementsMap);\n }\n\n if (event.altKey && appState.editingLinearElement) {\n if (linearElementEditor.lastUncommittedPoint == null) {\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_3__.mutateElement)(element, {\n points: [...element.points, LinearElementEditor.createPointAt(element, elementsMap, scenePointer.x, scenePointer.y, event[_keys__WEBPACK_IMPORTED_MODULE_7__.KEYS.CTRL_OR_CMD] ? null : appState.gridSize)]\n });\n ret.didAddPoint = true;\n }\n\n store.shouldCaptureIncrement();\n ret.linearElementEditor = Object.assign(Object.assign({}, linearElementEditor), {\n pointerDownState: {\n prevSelectedPointsIndices: linearElementEditor.selectedPointsIndices,\n lastClickedPoint: -1,\n origin: {\n x: scenePointer.x,\n y: scenePointer.y\n },\n segmentMidpoint: {\n value: segmentMidpoint,\n index: segmentMidpointIndex,\n added: false\n }\n },\n selectedPointsIndices: [element.points.length - 1],\n lastUncommittedPoint: null,\n endBindingElement: (0,_binding__WEBPACK_IMPORTED_MODULE_4__.getHoveredElementForBinding)(scenePointer, app)\n });\n ret.didAddPoint = true;\n return ret;\n }\n\n const clickedPointIndex = LinearElementEditor.getPointIndexUnderCursor(element, elementsMap, appState.zoom, scenePointer.x, scenePointer.y); // if we clicked on a point, set the element as hitElement otherwise\n // it would get deselected if the point is outside the hitbox area\n\n if (clickedPointIndex >= 0 || segmentMidpoint) {\n ret.hitElement = element;\n } else {\n // You might be wandering why we are storing the binding elements on\n // LinearElementEditor and passing them in, instead of calculating them\n // from the end points of the `linearElement` - this is to allow disabling\n // binding (which needs to happen at the point the user finishes moving\n // the point).\n const {\n startBindingElement,\n endBindingElement\n } = linearElementEditor;\n\n if ((0,_binding__WEBPACK_IMPORTED_MODULE_4__.isBindingEnabled)(appState) && (0,_typeChecks__WEBPACK_IMPORTED_MODULE_6__.isBindingElement)(element)) {\n (0,_binding__WEBPACK_IMPORTED_MODULE_4__.bindOrUnbindLinearElement)(element, startBindingElement, endBindingElement, elementsMap);\n }\n }\n\n const [x1, y1, x2, y2] = (0,___WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n const targetPoint = clickedPointIndex > -1 && (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(element.x + element.points[clickedPointIndex][0], element.y + element.points[clickedPointIndex][1], cx, cy, element.angle);\n const nextSelectedPointsIndices = clickedPointIndex > -1 || event.shiftKey ? event.shiftKey || ((_a = linearElementEditor.selectedPointsIndices) === null || _a === void 0 ? void 0 : _a.includes(clickedPointIndex)) ? normalizeSelectedPoints([...(linearElementEditor.selectedPointsIndices || []), clickedPointIndex]) : [clickedPointIndex] : null;\n ret.linearElementEditor = Object.assign(Object.assign({}, linearElementEditor), {\n pointerDownState: {\n prevSelectedPointsIndices: linearElementEditor.selectedPointsIndices,\n lastClickedPoint: clickedPointIndex,\n origin: {\n x: scenePointer.x,\n y: scenePointer.y\n },\n segmentMidpoint: {\n value: segmentMidpoint,\n index: segmentMidpointIndex,\n added: false\n }\n },\n selectedPointsIndices: nextSelectedPointsIndices,\n pointerOffset: targetPoint ? {\n x: scenePointer.x - targetPoint[0],\n y: scenePointer.y - targetPoint[1]\n } : {\n x: 0,\n y: 0\n }\n });\n return ret;\n }\n\n static arePointsEqual(point1, point2) {\n if (!point1 && !point2) {\n return true;\n }\n\n if (!point1 || !point2) {\n return false;\n }\n\n return (0,_math__WEBPACK_IMPORTED_MODULE_0__.arePointsEqual)(point1, point2);\n }\n\n static handlePointerMove(event, scenePointerX, scenePointerY, appState, elementsMap) {\n if (!appState.editingLinearElement) {\n return null;\n }\n\n const {\n elementId,\n lastUncommittedPoint\n } = appState.editingLinearElement;\n const element = LinearElementEditor.getElement(elementId, elementsMap);\n\n if (!element) {\n return appState.editingLinearElement;\n }\n\n const {\n points\n } = element;\n const lastPoint = points[points.length - 1];\n\n if (!event.altKey) {\n if (lastPoint === lastUncommittedPoint) {\n LinearElementEditor.deletePoints(element, [points.length - 1]);\n }\n\n return Object.assign(Object.assign({}, appState.editingLinearElement), {\n lastUncommittedPoint: null\n });\n }\n\n let newPoint;\n\n if ((0,_keys__WEBPACK_IMPORTED_MODULE_7__.shouldRotateWithDiscreteAngle)(event) && points.length >= 2) {\n const lastCommittedPoint = points[points.length - 2];\n\n const [width, height] = LinearElementEditor._getShiftLockedDelta(element, elementsMap, lastCommittedPoint, [scenePointerX, scenePointerY], event[_keys__WEBPACK_IMPORTED_MODULE_7__.KEYS.CTRL_OR_CMD] ? null : appState.gridSize);\n\n newPoint = [width + lastCommittedPoint[0], height + lastCommittedPoint[1]];\n } else {\n newPoint = LinearElementEditor.createPointAt(element, elementsMap, scenePointerX - appState.editingLinearElement.pointerOffset.x, scenePointerY - appState.editingLinearElement.pointerOffset.y, event[_keys__WEBPACK_IMPORTED_MODULE_7__.KEYS.CTRL_OR_CMD] ? null : appState.gridSize);\n }\n\n if (lastPoint === lastUncommittedPoint) {\n LinearElementEditor.movePoints(element, [{\n index: element.points.length - 1,\n point: newPoint\n }]);\n } else {\n LinearElementEditor.addPoints(element, appState, [{\n point: newPoint\n }]);\n }\n\n return Object.assign(Object.assign({}, appState.editingLinearElement), {\n lastUncommittedPoint: element.points[element.points.length - 1]\n });\n }\n /** scene coords */\n\n\n static getPointGlobalCoordinates(element, point, elementsMap) {\n const [x1, y1, x2, y2] = (0,___WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n let {\n x,\n y\n } = element;\n [x, y] = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(x + point[0], y + point[1], cx, cy, element.angle);\n return [x, y];\n }\n /** scene coords */\n\n\n static getPointsGlobalCoordinates(element, elementsMap) {\n const [x1, y1, x2, y2] = (0,___WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n return element.points.map(point => {\n let {\n x,\n y\n } = element;\n [x, y] = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(x + point[0], y + point[1], cx, cy, element.angle);\n return [x, y];\n });\n }\n\n static getPointAtIndexGlobalCoordinates(element, indexMaybeFromEnd, // -1 for last element\n elementsMap) {\n const index = indexMaybeFromEnd < 0 ? element.points.length + indexMaybeFromEnd : indexMaybeFromEnd;\n const [x1, y1, x2, y2] = (0,___WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n const point = element.points[index];\n const {\n x,\n y\n } = element;\n return point ? (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(x + point[0], y + point[1], cx, cy, element.angle) : (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(x, y, cx, cy, element.angle);\n }\n\n static pointFromAbsoluteCoords(element, absoluteCoords, elementsMap) {\n const [x1, y1, x2, y2] = (0,___WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n const [x, y] = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(absoluteCoords[0], absoluteCoords[1], cx, cy, -element.angle);\n return [x - element.x, y - element.y];\n }\n\n static getPointIndexUnderCursor(element, elementsMap, zoom, x, y) {\n const pointHandles = LinearElementEditor.getPointsGlobalCoordinates(element, elementsMap);\n let idx = pointHandles.length; // loop from right to left because points on the right are rendered over\n // points on the left, thus should take precedence when clicking, if they\n // overlap\n\n while (--idx > -1) {\n const point = pointHandles[idx];\n\n if ((0,_math__WEBPACK_IMPORTED_MODULE_0__.distance2d)(x, y, point[0], point[1]) * zoom.value < // +1px to account for outline stroke\n LinearElementEditor.POINT_HANDLE_SIZE + 1) {\n return idx;\n }\n }\n\n return -1;\n }\n\n static createPointAt(element, elementsMap, scenePointerX, scenePointerY, gridSize) {\n const pointerOnGrid = (0,_math__WEBPACK_IMPORTED_MODULE_0__.getGridPoint)(scenePointerX, scenePointerY, gridSize);\n const [x1, y1, x2, y2] = (0,___WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n const [rotatedX, rotatedY] = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(pointerOnGrid[0], pointerOnGrid[1], cx, cy, -element.angle);\n return [rotatedX - element.x, rotatedY - element.y];\n }\n /**\r\n * Normalizes line points so that the start point is at [0,0]. This is\r\n * expected in various parts of the codebase. Also returns new x/y to account\r\n * for the potential normalization.\r\n */\n\n\n static getNormalizedPoints(element) {\n const {\n points\n } = element;\n const offsetX = points[0][0];\n const offsetY = points[0][1];\n return {\n points: points.map((point, _idx) => {\n return [point[0] - offsetX, point[1] - offsetY];\n }),\n x: element.x + offsetX,\n y: element.y + offsetY\n };\n } // element-mutating methods\n // ---------------------------------------------------------------------------\n\n\n static normalizePoints(element) {\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_3__.mutateElement)(element, LinearElementEditor.getNormalizedPoints(element));\n }\n\n static duplicateSelectedPoints(appState, elementsMap) {\n if (!appState.editingLinearElement) {\n return false;\n }\n\n const {\n selectedPointsIndices,\n elementId\n } = appState.editingLinearElement;\n const element = LinearElementEditor.getElement(elementId, elementsMap);\n\n if (!element || selectedPointsIndices === null) {\n return false;\n }\n\n const {\n points\n } = element;\n const nextSelectedIndices = [];\n let pointAddedToEnd = false;\n let indexCursor = -1;\n const nextPoints = points.reduce((acc, point, index) => {\n ++indexCursor;\n acc.push(point);\n const isSelected = selectedPointsIndices.includes(index);\n\n if (isSelected) {\n const nextPoint = points[index + 1];\n\n if (!nextPoint) {\n pointAddedToEnd = true;\n }\n\n acc.push(nextPoint ? [(point[0] + nextPoint[0]) / 2, (point[1] + nextPoint[1]) / 2] : [point[0], point[1]]);\n nextSelectedIndices.push(indexCursor + 1);\n ++indexCursor;\n }\n\n return acc;\n }, []);\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_3__.mutateElement)(element, {\n points: nextPoints\n }); // temp hack to ensure the line doesn't move when adding point to the end,\n // potentially expanding the bounding box\n\n if (pointAddedToEnd) {\n const lastPoint = element.points[element.points.length - 1];\n LinearElementEditor.movePoints(element, [{\n index: element.points.length - 1,\n point: [lastPoint[0] + 30, lastPoint[1] + 30]\n }]);\n }\n\n return {\n appState: Object.assign(Object.assign({}, appState), {\n editingLinearElement: Object.assign(Object.assign({}, appState.editingLinearElement), {\n selectedPointsIndices: nextSelectedIndices\n })\n })\n };\n }\n\n static deletePoints(element, pointIndices) {\n let offsetX = 0;\n let offsetY = 0;\n const isDeletingOriginPoint = pointIndices.includes(0); // if deleting first point, make the next to be [0,0] and recalculate\n // positions of the rest with respect to it\n\n if (isDeletingOriginPoint) {\n const firstNonDeletedPoint = element.points.find((point, idx) => {\n return !pointIndices.includes(idx);\n });\n\n if (firstNonDeletedPoint) {\n offsetX = firstNonDeletedPoint[0];\n offsetY = firstNonDeletedPoint[1];\n }\n }\n\n const nextPoints = element.points.reduce((acc, point, idx) => {\n if (!pointIndices.includes(idx)) {\n acc.push(!acc.length ? [0, 0] : [point[0] - offsetX, point[1] - offsetY]);\n }\n\n return acc;\n }, []);\n\n LinearElementEditor._updatePoints(element, nextPoints, offsetX, offsetY);\n }\n\n static addPoints(element, appState, targetPoints) {\n const offsetX = 0;\n const offsetY = 0;\n const nextPoints = [...element.points, ...targetPoints.map(x => x.point)];\n\n LinearElementEditor._updatePoints(element, nextPoints, offsetX, offsetY);\n }\n\n static movePoints(element, targetPoints, otherUpdates) {\n const {\n points\n } = element; // in case we're moving start point, instead of modifying its position\n // which would break the invariant of it being at [0,0], we move\n // all the other points in the opposite direction by delta to\n // offset it. We do the same with actual element.x/y position, so\n // this hacks are completely transparent to the user.\n\n let offsetX = 0;\n let offsetY = 0;\n const selectedOriginPoint = targetPoints.find(({\n index\n }) => index === 0);\n\n if (selectedOriginPoint) {\n offsetX = selectedOriginPoint.point[0] + points[selectedOriginPoint.index][0];\n offsetY = selectedOriginPoint.point[1] + points[selectedOriginPoint.index][1];\n }\n\n const nextPoints = points.map((point, idx) => {\n const selectedPointData = targetPoints.find(p => p.index === idx);\n\n if (selectedPointData) {\n if (selectedOriginPoint) {\n return point;\n }\n\n const deltaX = selectedPointData.point[0] - points[selectedPointData.index][0];\n const deltaY = selectedPointData.point[1] - points[selectedPointData.index][1];\n return [point[0] + deltaX, point[1] + deltaY];\n }\n\n return offsetX || offsetY ? [point[0] - offsetX, point[1] - offsetY] : point;\n });\n\n LinearElementEditor._updatePoints(element, nextPoints, offsetX, offsetY, otherUpdates);\n }\n\n static shouldAddMidpoint(linearElementEditor, pointerCoords, appState, elementsMap) {\n const element = LinearElementEditor.getElement(linearElementEditor.elementId, elementsMap);\n\n if (!element) {\n return false;\n }\n\n const {\n segmentMidpoint\n } = linearElementEditor.pointerDownState;\n\n if (segmentMidpoint.added || segmentMidpoint.value === null || segmentMidpoint.index === null || linearElementEditor.pointerDownState.origin === null) {\n return false;\n }\n\n const origin = linearElementEditor.pointerDownState.origin;\n const dist = (0,_math__WEBPACK_IMPORTED_MODULE_0__.distance2d)(origin.x, origin.y, pointerCoords.x, pointerCoords.y);\n\n if (!appState.editingLinearElement && dist < _constants__WEBPACK_IMPORTED_MODULE_9__.DRAGGING_THRESHOLD / appState.zoom.value) {\n return false;\n }\n\n return true;\n }\n\n static addMidpoint(linearElementEditor, pointerCoords, appState, snapToGrid, elementsMap) {\n const element = LinearElementEditor.getElement(linearElementEditor.elementId, elementsMap);\n\n if (!element) {\n return;\n }\n\n const {\n segmentMidpoint\n } = linearElementEditor.pointerDownState;\n const ret = {\n pointerDownState: linearElementEditor.pointerDownState,\n selectedPointsIndices: linearElementEditor.selectedPointsIndices\n };\n const midpoint = LinearElementEditor.createPointAt(element, elementsMap, pointerCoords.x, pointerCoords.y, snapToGrid ? appState.gridSize : null);\n const points = [...element.points.slice(0, segmentMidpoint.index), midpoint, ...element.points.slice(segmentMidpoint.index)];\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_3__.mutateElement)(element, {\n points\n });\n ret.pointerDownState = Object.assign(Object.assign({}, linearElementEditor.pointerDownState), {\n segmentMidpoint: Object.assign(Object.assign({}, linearElementEditor.pointerDownState.segmentMidpoint), {\n added: true\n }),\n lastClickedPoint: segmentMidpoint.index\n });\n ret.selectedPointsIndices = [segmentMidpoint.index];\n return ret;\n }\n\n static _updatePoints(element, nextPoints, offsetX, offsetY, otherUpdates) {\n const nextCoords = (0,_bounds__WEBPACK_IMPORTED_MODULE_2__.getElementPointsCoords)(element, nextPoints);\n const prevCoords = (0,_bounds__WEBPACK_IMPORTED_MODULE_2__.getElementPointsCoords)(element, element.points);\n const nextCenterX = (nextCoords[0] + nextCoords[2]) / 2;\n const nextCenterY = (nextCoords[1] + nextCoords[3]) / 2;\n const prevCenterX = (prevCoords[0] + prevCoords[2]) / 2;\n const prevCenterY = (prevCoords[1] + prevCoords[3]) / 2;\n const dX = prevCenterX - nextCenterX;\n const dY = prevCenterY - nextCenterY;\n const rotated = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(offsetX, offsetY, dX, dY, element.angle);\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_3__.mutateElement)(element, Object.assign(Object.assign({}, otherUpdates), {\n points: nextPoints,\n x: element.x + rotated[0],\n y: element.y + rotated[1]\n }));\n }\n\n static _getShiftLockedDelta(element, elementsMap, referencePoint, scenePointer, gridSize) {\n const referencePointCoords = LinearElementEditor.getPointGlobalCoordinates(element, referencePoint, elementsMap);\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_0__.getGridPoint)(scenePointer[0], scenePointer[1], gridSize);\n const {\n width,\n height\n } = (0,___WEBPACK_IMPORTED_MODULE_1__.getLockedLinearCursorAlignSize)(referencePointCoords[0], referencePointCoords[1], gridX, gridY);\n return (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotatePoint)([width, height], [0, 0], -element.angle);\n }\n\n} // ---------------------------------------------------------------------------\n// static methods\n// ---------------------------------------------------------------------------\n\nLinearElementEditor.POINT_HANDLE_SIZE = 10;\n\nLinearElementEditor.getEditorMidPoints = (element, elementsMap, appState) => {\n const boundText = (0,_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(element, elementsMap); // Since its not needed outside editor unless 2 pointer lines or bound text\n\n if (!appState.editingLinearElement && element.points.length > 2 && !boundText) {\n return [];\n }\n\n if (editorMidPointsCache.version === element.version && editorMidPointsCache.zoom === appState.zoom.value) {\n return editorMidPointsCache.points;\n }\n\n LinearElementEditor.updateEditorMidPointsCache(element, elementsMap, appState);\n return editorMidPointsCache.points;\n};\n\nLinearElementEditor.updateEditorMidPointsCache = (element, elementsMap, appState) => {\n const points = LinearElementEditor.getPointsGlobalCoordinates(element, elementsMap);\n let index = 0;\n const midpoints = [];\n\n while (index < points.length - 1) {\n if (LinearElementEditor.isSegmentTooShort(element, element.points[index], element.points[index + 1], appState.zoom)) {\n midpoints.push(null);\n index++;\n continue;\n }\n\n const segmentMidPoint = LinearElementEditor.getSegmentMidPoint(element, points[index], points[index + 1], index + 1, elementsMap);\n midpoints.push(segmentMidPoint);\n index++;\n }\n\n editorMidPointsCache.points = midpoints;\n editorMidPointsCache.version = element.version;\n editorMidPointsCache.zoom = appState.zoom.value;\n};\n\nLinearElementEditor.getSegmentMidpointHitCoords = (linearElementEditor, scenePointer, appState, elementsMap) => {\n const {\n elementId\n } = linearElementEditor;\n const element = LinearElementEditor.getElement(elementId, elementsMap);\n\n if (!element) {\n return null;\n }\n\n const clickedPointIndex = LinearElementEditor.getPointIndexUnderCursor(element, elementsMap, appState.zoom, scenePointer.x, scenePointer.y);\n\n if (clickedPointIndex >= 0) {\n return null;\n }\n\n const points = LinearElementEditor.getPointsGlobalCoordinates(element, elementsMap);\n\n if (points.length >= 3 && !appState.editingLinearElement) {\n return null;\n }\n\n const threshold = LinearElementEditor.POINT_HANDLE_SIZE / appState.zoom.value;\n const existingSegmentMidpointHitCoords = linearElementEditor.segmentMidPointHoveredCoords;\n\n if (existingSegmentMidpointHitCoords) {\n const distance = (0,_math__WEBPACK_IMPORTED_MODULE_0__.distance2d)(existingSegmentMidpointHitCoords[0], existingSegmentMidpointHitCoords[1], scenePointer.x, scenePointer.y);\n\n if (distance <= threshold) {\n return existingSegmentMidpointHitCoords;\n }\n }\n\n let index = 0;\n const midPoints = LinearElementEditor.getEditorMidPoints(element, elementsMap, appState);\n\n while (index < midPoints.length) {\n if (midPoints[index] !== null) {\n const distance = (0,_math__WEBPACK_IMPORTED_MODULE_0__.distance2d)(midPoints[index][0], midPoints[index][1], scenePointer.x, scenePointer.y);\n\n if (distance <= threshold) {\n return midPoints[index];\n }\n }\n\n index++;\n }\n\n return null;\n};\n\nLinearElementEditor.getBoundTextElementPosition = (element, boundTextElement, elementsMap) => {\n const points = LinearElementEditor.getPointsGlobalCoordinates(element, elementsMap);\n\n if (points.length < 2) {\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_3__.mutateElement)(boundTextElement, {\n isDeleted: true\n });\n }\n\n let x = 0;\n let y = 0;\n\n if (element.points.length % 2 === 1) {\n const index = Math.floor(element.points.length / 2);\n const midPoint = LinearElementEditor.getPointGlobalCoordinates(element, element.points[index], elementsMap);\n x = midPoint[0] - boundTextElement.width / 2;\n y = midPoint[1] - boundTextElement.height / 2;\n } else {\n const index = element.points.length / 2 - 1;\n let midSegmentMidpoint = editorMidPointsCache.points[index];\n\n if (element.points.length === 2) {\n midSegmentMidpoint = (0,_math__WEBPACK_IMPORTED_MODULE_0__.centerPoint)(points[0], points[1]);\n }\n\n if (!midSegmentMidpoint || editorMidPointsCache.version !== element.version) {\n midSegmentMidpoint = LinearElementEditor.getSegmentMidPoint(element, points[index], points[index + 1], index + 1, elementsMap);\n }\n\n x = midSegmentMidpoint[0] - boundTextElement.width / 2;\n y = midSegmentMidpoint[1] - boundTextElement.height / 2;\n }\n\n return {\n x,\n y\n };\n};\n\nLinearElementEditor.getMinMaxXYWithBoundText = (element, elementsMap, elementBounds, boundTextElement) => {\n let [x1, y1, x2, y2] = elementBounds;\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n const {\n x: boundTextX1,\n y: boundTextY1\n } = LinearElementEditor.getBoundTextElementPosition(element, boundTextElement, elementsMap);\n const boundTextX2 = boundTextX1 + boundTextElement.width;\n const boundTextY2 = boundTextY1 + boundTextElement.height;\n const topLeftRotatedPoint = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotatePoint)([x1, y1], [cx, cy], element.angle);\n const topRightRotatedPoint = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotatePoint)([x2, y1], [cx, cy], element.angle);\n const counterRotateBoundTextTopLeft = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotatePoint)([boundTextX1, boundTextY1], [cx, cy], -element.angle);\n const counterRotateBoundTextTopRight = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotatePoint)([boundTextX2, boundTextY1], [cx, cy], -element.angle);\n const counterRotateBoundTextBottomLeft = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotatePoint)([boundTextX1, boundTextY2], [cx, cy], -element.angle);\n const counterRotateBoundTextBottomRight = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotatePoint)([boundTextX2, boundTextY2], [cx, cy], -element.angle);\n\n if (topLeftRotatedPoint[0] < topRightRotatedPoint[0] && topLeftRotatedPoint[1] >= topRightRotatedPoint[1]) {\n x1 = Math.min(x1, counterRotateBoundTextBottomLeft[0]);\n x2 = Math.max(x2, Math.max(counterRotateBoundTextTopRight[0], counterRotateBoundTextBottomRight[0]));\n y1 = Math.min(y1, counterRotateBoundTextTopLeft[1]);\n y2 = Math.max(y2, counterRotateBoundTextBottomRight[1]);\n } else if (topLeftRotatedPoint[0] >= topRightRotatedPoint[0] && topLeftRotatedPoint[1] > topRightRotatedPoint[1]) {\n x1 = Math.min(x1, counterRotateBoundTextBottomRight[0]);\n x2 = Math.max(x2, Math.max(counterRotateBoundTextTopLeft[0], counterRotateBoundTextTopRight[0]));\n y1 = Math.min(y1, counterRotateBoundTextBottomLeft[1]);\n y2 = Math.max(y2, counterRotateBoundTextTopRight[1]);\n } else if (topLeftRotatedPoint[0] >= topRightRotatedPoint[0]) {\n x1 = Math.min(x1, counterRotateBoundTextTopRight[0]);\n x2 = Math.max(x2, counterRotateBoundTextBottomLeft[0]);\n y1 = Math.min(y1, counterRotateBoundTextBottomRight[1]);\n y2 = Math.max(y2, counterRotateBoundTextTopLeft[1]);\n } else if (topLeftRotatedPoint[1] <= topRightRotatedPoint[1]) {\n x1 = Math.min(x1, Math.min(counterRotateBoundTextTopRight[0], counterRotateBoundTextTopLeft[0]));\n x2 = Math.max(x2, counterRotateBoundTextBottomRight[0]);\n y1 = Math.min(y1, counterRotateBoundTextTopRight[1]);\n y2 = Math.max(y2, counterRotateBoundTextBottomLeft[1]);\n }\n\n return [x1, y1, x2, y2, cx, cy];\n};\n\nLinearElementEditor.getElementAbsoluteCoords = (element, elementsMap, includeBoundText = false) => {\n let coords;\n let x1;\n let y1;\n let x2;\n let y2;\n\n if (element.points.length < 2 || !_scene_ShapeCache__WEBPACK_IMPORTED_MODULE_10__.ShapeCache.get(element)) {\n // XXX this is just a poor estimate and not very useful\n const {\n minX,\n minY,\n maxX,\n maxY\n } = element.points.reduce((limits, [x, y]) => {\n limits.minY = Math.min(limits.minY, y);\n limits.minX = Math.min(limits.minX, x);\n limits.maxX = Math.max(limits.maxX, x);\n limits.maxY = Math.max(limits.maxY, y);\n return limits;\n }, {\n minX: Infinity,\n minY: Infinity,\n maxX: -Infinity,\n maxY: -Infinity\n });\n x1 = minX + element.x;\n y1 = minY + element.y;\n x2 = maxX + element.x;\n y2 = maxY + element.y;\n } else {\n const shape = _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_10__.ShapeCache.generateElementShape(element, null); // first element is always the curve\n\n const ops = (0,_bounds__WEBPACK_IMPORTED_MODULE_2__.getCurvePathOps)(shape[0]);\n const [minX, minY, maxX, maxY] = (0,_bounds__WEBPACK_IMPORTED_MODULE_2__.getMinMaxXYFromCurvePathOps)(ops);\n x1 = minX + element.x;\n y1 = minY + element.y;\n x2 = maxX + element.x;\n y2 = maxY + element.y;\n }\n\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n coords = [x1, y1, x2, y2, cx, cy];\n\n if (!includeBoundText) {\n return coords;\n }\n\n const boundTextElement = (0,_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(element, elementsMap);\n\n if (boundTextElement) {\n coords = LinearElementEditor.getMinMaxXYWithBoundText(element, elementsMap, [x1, y1, x2, y2], boundTextElement);\n }\n\n return coords;\n};\n\nconst normalizeSelectedPoints = points => {\n let nextPoints = [...new Set(points.filter(p => p !== null && p !== -1))];\n nextPoints = nextPoints.sort((a, b) => a - b);\n return nextPoints.length ? nextPoints : null;\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./element/linearElementEditor.ts?");
2732
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"LinearElementEditor\": () => (/* binding */ LinearElementEditor)\n/* harmony export */ });\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../math */ \"./math.ts\");\n/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! . */ \"./element/index.ts\");\n/* harmony import */ var _bounds__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _mutateElement__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _binding__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./binding */ \"./element/binding.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _typeChecks__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _keys__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../keys */ \"./keys.ts\");\n/* harmony import */ var _textElement__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../constants */ \"./constants.ts\");\n/* harmony import */ var _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../scene/ShapeCache */ \"./scene/ShapeCache.ts\");\n\n\n\n\n\n\n\n\n\n\n\nconst editorMidPointsCache = {\n version: null,\n points: [],\n zoom: null\n};\nclass LinearElementEditor {\n constructor(element) {\n this.elementId = element.id;\n LinearElementEditor.normalizePoints(element);\n this.selectedPointsIndices = null;\n this.lastUncommittedPoint = null;\n this.isDragging = false;\n this.pointerOffset = {\n x: 0,\n y: 0\n };\n this.startBindingElement = \"keep\";\n this.endBindingElement = \"keep\";\n this.pointerDownState = {\n prevSelectedPointsIndices: null,\n lastClickedPoint: -1,\n origin: null,\n segmentMidpoint: {\n value: null,\n index: null,\n added: false\n }\n };\n this.hoverPointIndex = -1;\n this.segmentMidPointHoveredCoords = null;\n }\n /**\r\n * @param id the `elementId` from the instance of this class (so that we can\r\n * statically guarantee this method returns an ExcalidrawLinearElement)\r\n */\n\n\n static getElement(id, elementsMap) {\n const element = elementsMap.get(id);\n\n if (element) {\n return element;\n }\n\n return null;\n }\n\n static handleBoxSelection(event, appState, setState, elementsMap) {\n var _a;\n\n if (!appState.editingLinearElement || ((_a = appState.draggingElement) === null || _a === void 0 ? void 0 : _a.type) !== \"selection\") {\n return false;\n }\n\n const {\n editingLinearElement\n } = appState;\n const {\n selectedPointsIndices,\n elementId\n } = editingLinearElement;\n const element = LinearElementEditor.getElement(elementId, elementsMap);\n\n if (!element) {\n return false;\n }\n\n const [selectionX1, selectionY1, selectionX2, selectionY2] = (0,___WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(appState.draggingElement, elementsMap);\n const pointsSceneCoords = LinearElementEditor.getPointsGlobalCoordinates(element, elementsMap);\n const nextSelectedPoints = pointsSceneCoords.reduce((acc, point, index) => {\n if (point[0] >= selectionX1 && point[0] <= selectionX2 && point[1] >= selectionY1 && point[1] <= selectionY2 || event.shiftKey && (selectedPointsIndices === null || selectedPointsIndices === void 0 ? void 0 : selectedPointsIndices.includes(index))) {\n acc.push(index);\n }\n\n return acc;\n }, []);\n setState({\n editingLinearElement: Object.assign(Object.assign({}, editingLinearElement), {\n selectedPointsIndices: nextSelectedPoints.length ? nextSelectedPoints : null\n })\n });\n }\n /** @returns whether point was dragged */\n\n\n static handlePointDragging(event, appState, scenePointerX, scenePointerY, maybeSuggestBinding, linearElementEditor, elementsMap) {\n if (!linearElementEditor) {\n return false;\n }\n\n const {\n selectedPointsIndices,\n elementId\n } = linearElementEditor;\n const element = LinearElementEditor.getElement(elementId, elementsMap);\n\n if (!element) {\n return false;\n } // point that's being dragged (out of all selected points)\n\n\n const draggingPoint = element.points[linearElementEditor.pointerDownState.lastClickedPoint];\n\n if (selectedPointsIndices && draggingPoint) {\n if ((0,_keys__WEBPACK_IMPORTED_MODULE_7__.shouldRotateWithDiscreteAngle)(event) && selectedPointsIndices.length === 1 && element.points.length > 1) {\n const selectedIndex = selectedPointsIndices[0];\n const referencePoint = element.points[selectedIndex === 0 ? 1 : selectedIndex - 1];\n\n const [width, height] = LinearElementEditor._getShiftLockedDelta(element, elementsMap, referencePoint, [scenePointerX, scenePointerY], event[_keys__WEBPACK_IMPORTED_MODULE_7__.KEYS.CTRL_OR_CMD] ? null : appState.gridSize);\n\n LinearElementEditor.movePoints(element, [{\n index: selectedIndex,\n point: [width + referencePoint[0], height + referencePoint[1]],\n isDragging: selectedIndex === linearElementEditor.pointerDownState.lastClickedPoint\n }]);\n } else {\n const newDraggingPointPosition = LinearElementEditor.createPointAt(element, elementsMap, scenePointerX - linearElementEditor.pointerOffset.x, scenePointerY - linearElementEditor.pointerOffset.y, event[_keys__WEBPACK_IMPORTED_MODULE_7__.KEYS.CTRL_OR_CMD] ? null : appState.gridSize);\n const deltaX = newDraggingPointPosition[0] - draggingPoint[0];\n const deltaY = newDraggingPointPosition[1] - draggingPoint[1];\n LinearElementEditor.movePoints(element, selectedPointsIndices.map(pointIndex => {\n const newPointPosition = pointIndex === linearElementEditor.pointerDownState.lastClickedPoint ? LinearElementEditor.createPointAt(element, elementsMap, scenePointerX - linearElementEditor.pointerOffset.x, scenePointerY - linearElementEditor.pointerOffset.y, event[_keys__WEBPACK_IMPORTED_MODULE_7__.KEYS.CTRL_OR_CMD] ? null : appState.gridSize) : [element.points[pointIndex][0] + deltaX, element.points[pointIndex][1] + deltaY];\n return {\n index: pointIndex,\n point: newPointPosition,\n isDragging: pointIndex === linearElementEditor.pointerDownState.lastClickedPoint\n };\n }));\n }\n\n const boundTextElement = (0,_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(element, elementsMap);\n\n if (boundTextElement) {\n (0,_textElement__WEBPACK_IMPORTED_MODULE_8__.handleBindTextResize)(element, elementsMap, false);\n } // suggest bindings for first and last point if selected\n\n\n if ((0,_typeChecks__WEBPACK_IMPORTED_MODULE_6__.isBindingElement)(element, false)) {\n const coords = [];\n const firstSelectedIndex = selectedPointsIndices[0];\n\n if (firstSelectedIndex === 0) {\n coords.push((0,_utils__WEBPACK_IMPORTED_MODULE_5__.tupleToCoors)(LinearElementEditor.getPointGlobalCoordinates(element, element.points[0], elementsMap)));\n }\n\n const lastSelectedIndex = selectedPointsIndices[selectedPointsIndices.length - 1];\n\n if (lastSelectedIndex === element.points.length - 1) {\n coords.push((0,_utils__WEBPACK_IMPORTED_MODULE_5__.tupleToCoors)(LinearElementEditor.getPointGlobalCoordinates(element, element.points[lastSelectedIndex], elementsMap)));\n }\n\n if (coords.length) {\n maybeSuggestBinding(element, coords);\n }\n }\n\n return true;\n }\n\n return false;\n }\n\n static handlePointerUp(event, editingLinearElement, appState, app) {\n var _a;\n\n const elementsMap = app.scene.getNonDeletedElementsMap();\n const {\n elementId,\n selectedPointsIndices,\n isDragging,\n pointerDownState\n } = editingLinearElement;\n const element = LinearElementEditor.getElement(elementId, elementsMap);\n\n if (!element) {\n return editingLinearElement;\n }\n\n const bindings = {};\n\n if (isDragging && selectedPointsIndices) {\n for (const selectedPoint of selectedPointsIndices) {\n if (selectedPoint === 0 || selectedPoint === element.points.length - 1) {\n if ((0,_math__WEBPACK_IMPORTED_MODULE_0__.isPathALoop)(element.points, appState.zoom.value)) {\n LinearElementEditor.movePoints(element, [{\n index: selectedPoint,\n point: selectedPoint === 0 ? element.points[element.points.length - 1] : element.points[0]\n }]);\n }\n\n const bindingElement = (0,_binding__WEBPACK_IMPORTED_MODULE_4__.isBindingEnabled)(appState) ? (0,_binding__WEBPACK_IMPORTED_MODULE_4__.getHoveredElementForBinding)((0,_utils__WEBPACK_IMPORTED_MODULE_5__.tupleToCoors)(LinearElementEditor.getPointAtIndexGlobalCoordinates(element, selectedPoint, elementsMap)), elementsMap) : null;\n bindings[selectedPoint === 0 ? \"startBindingElement\" : \"endBindingElement\"] = bindingElement;\n }\n }\n }\n\n return Object.assign(Object.assign(Object.assign({}, editingLinearElement), bindings), {\n // if clicking without previously dragging a point(s), and not holding\n // shift, deselect all points except the one clicked. If holding shift,\n // toggle the point.\n selectedPointsIndices: isDragging || event.shiftKey ? !isDragging && event.shiftKey && ((_a = pointerDownState.prevSelectedPointsIndices) === null || _a === void 0 ? void 0 : _a.includes(pointerDownState.lastClickedPoint)) ? selectedPointsIndices && selectedPointsIndices.filter(pointIndex => pointIndex !== pointerDownState.lastClickedPoint) : selectedPointsIndices : (selectedPointsIndices === null || selectedPointsIndices === void 0 ? void 0 : selectedPointsIndices.includes(pointerDownState.lastClickedPoint)) ? [pointerDownState.lastClickedPoint] : selectedPointsIndices,\n isDragging: false,\n pointerOffset: {\n x: 0,\n y: 0\n }\n });\n }\n\n static isSegmentTooShort(element, startPoint, endPoint, zoom) {\n let distance = (0,_math__WEBPACK_IMPORTED_MODULE_0__.distance2d)(startPoint[0], startPoint[1], endPoint[0], endPoint[1]);\n\n if (element.points.length > 2 && element.roundness) {\n distance = (0,_math__WEBPACK_IMPORTED_MODULE_0__.getBezierCurveLength)(element, endPoint);\n }\n\n return distance * zoom.value < LinearElementEditor.POINT_HANDLE_SIZE * 4;\n }\n\n static getSegmentMidPoint(element, startPoint, endPoint, endPointIndex, elementsMap) {\n let segmentMidPoint = (0,_math__WEBPACK_IMPORTED_MODULE_0__.centerPoint)(startPoint, endPoint);\n\n if (element.points.length > 2 && element.roundness) {\n const controlPoints = (0,_math__WEBPACK_IMPORTED_MODULE_0__.getControlPointsForBezierCurve)(element, element.points[endPointIndex]);\n\n if (controlPoints) {\n const t = (0,_math__WEBPACK_IMPORTED_MODULE_0__.mapIntervalToBezierT)(element, element.points[endPointIndex], 0.5);\n const [tx, ty] = (0,_math__WEBPACK_IMPORTED_MODULE_0__.getBezierXY)(controlPoints[0], controlPoints[1], controlPoints[2], controlPoints[3], t);\n segmentMidPoint = LinearElementEditor.getPointGlobalCoordinates(element, [tx, ty], elementsMap);\n }\n }\n\n return segmentMidPoint;\n }\n\n static getSegmentMidPointIndex(linearElementEditor, appState, midPoint, elementsMap) {\n const element = LinearElementEditor.getElement(linearElementEditor.elementId, elementsMap);\n\n if (!element) {\n return -1;\n }\n\n const midPoints = LinearElementEditor.getEditorMidPoints(element, elementsMap, appState);\n let index = 0;\n\n while (index < midPoints.length) {\n if (LinearElementEditor.arePointsEqual(midPoint, midPoints[index])) {\n return index + 1;\n }\n\n index++;\n }\n\n return -1;\n }\n\n static handlePointerDown(event, appState, store, scenePointer, linearElementEditor, app) {\n var _a;\n\n const elementsMap = app.scene.getNonDeletedElementsMap();\n const ret = {\n didAddPoint: false,\n hitElement: null,\n linearElementEditor: null\n };\n\n if (!linearElementEditor) {\n return ret;\n }\n\n const {\n elementId\n } = linearElementEditor;\n const element = LinearElementEditor.getElement(elementId, elementsMap);\n\n if (!element) {\n return ret;\n }\n\n const segmentMidpoint = LinearElementEditor.getSegmentMidpointHitCoords(linearElementEditor, scenePointer, appState, elementsMap);\n let segmentMidpointIndex = null;\n\n if (segmentMidpoint) {\n segmentMidpointIndex = LinearElementEditor.getSegmentMidPointIndex(linearElementEditor, appState, segmentMidpoint, elementsMap);\n }\n\n if (event.altKey && appState.editingLinearElement) {\n if (linearElementEditor.lastUncommittedPoint == null) {\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_3__.mutateElement)(element, {\n points: [...element.points, LinearElementEditor.createPointAt(element, elementsMap, scenePointer.x, scenePointer.y, event[_keys__WEBPACK_IMPORTED_MODULE_7__.KEYS.CTRL_OR_CMD] ? null : appState.gridSize)]\n });\n ret.didAddPoint = true;\n }\n\n store.shouldCaptureIncrement();\n ret.linearElementEditor = Object.assign(Object.assign({}, linearElementEditor), {\n pointerDownState: {\n prevSelectedPointsIndices: linearElementEditor.selectedPointsIndices,\n lastClickedPoint: -1,\n origin: {\n x: scenePointer.x,\n y: scenePointer.y\n },\n segmentMidpoint: {\n value: segmentMidpoint,\n index: segmentMidpointIndex,\n added: false\n }\n },\n selectedPointsIndices: [element.points.length - 1],\n lastUncommittedPoint: null,\n endBindingElement: (0,_binding__WEBPACK_IMPORTED_MODULE_4__.getHoveredElementForBinding)(scenePointer, elementsMap)\n });\n ret.didAddPoint = true;\n return ret;\n }\n\n const clickedPointIndex = LinearElementEditor.getPointIndexUnderCursor(element, elementsMap, appState.zoom, scenePointer.x, scenePointer.y); // if we clicked on a point, set the element as hitElement otherwise\n // it would get deselected if the point is outside the hitbox area\n\n if (clickedPointIndex >= 0 || segmentMidpoint) {\n ret.hitElement = element;\n } else {\n // You might be wandering why we are storing the binding elements on\n // LinearElementEditor and passing them in, instead of calculating them\n // from the end points of the `linearElement` - this is to allow disabling\n // binding (which needs to happen at the point the user finishes moving\n // the point).\n const {\n startBindingElement,\n endBindingElement\n } = linearElementEditor;\n\n if ((0,_binding__WEBPACK_IMPORTED_MODULE_4__.isBindingEnabled)(appState) && (0,_typeChecks__WEBPACK_IMPORTED_MODULE_6__.isBindingElement)(element)) {\n (0,_binding__WEBPACK_IMPORTED_MODULE_4__.bindOrUnbindLinearElement)(element, startBindingElement, endBindingElement, elementsMap);\n }\n }\n\n const [x1, y1, x2, y2] = (0,___WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n const targetPoint = clickedPointIndex > -1 && (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(element.x + element.points[clickedPointIndex][0], element.y + element.points[clickedPointIndex][1], cx, cy, element.angle);\n const nextSelectedPointsIndices = clickedPointIndex > -1 || event.shiftKey ? event.shiftKey || ((_a = linearElementEditor.selectedPointsIndices) === null || _a === void 0 ? void 0 : _a.includes(clickedPointIndex)) ? normalizeSelectedPoints([...(linearElementEditor.selectedPointsIndices || []), clickedPointIndex]) : [clickedPointIndex] : null;\n ret.linearElementEditor = Object.assign(Object.assign({}, linearElementEditor), {\n pointerDownState: {\n prevSelectedPointsIndices: linearElementEditor.selectedPointsIndices,\n lastClickedPoint: clickedPointIndex,\n origin: {\n x: scenePointer.x,\n y: scenePointer.y\n },\n segmentMidpoint: {\n value: segmentMidpoint,\n index: segmentMidpointIndex,\n added: false\n }\n },\n selectedPointsIndices: nextSelectedPointsIndices,\n pointerOffset: targetPoint ? {\n x: scenePointer.x - targetPoint[0],\n y: scenePointer.y - targetPoint[1]\n } : {\n x: 0,\n y: 0\n }\n });\n return ret;\n }\n\n static arePointsEqual(point1, point2) {\n if (!point1 && !point2) {\n return true;\n }\n\n if (!point1 || !point2) {\n return false;\n }\n\n return (0,_math__WEBPACK_IMPORTED_MODULE_0__.arePointsEqual)(point1, point2);\n }\n\n static handlePointerMove(event, scenePointerX, scenePointerY, appState, elementsMap) {\n if (!appState.editingLinearElement) {\n return null;\n }\n\n const {\n elementId,\n lastUncommittedPoint\n } = appState.editingLinearElement;\n const element = LinearElementEditor.getElement(elementId, elementsMap);\n\n if (!element) {\n return appState.editingLinearElement;\n }\n\n const {\n points\n } = element;\n const lastPoint = points[points.length - 1];\n\n if (!event.altKey) {\n if (lastPoint === lastUncommittedPoint) {\n LinearElementEditor.deletePoints(element, [points.length - 1]);\n }\n\n return Object.assign(Object.assign({}, appState.editingLinearElement), {\n lastUncommittedPoint: null\n });\n }\n\n let newPoint;\n\n if ((0,_keys__WEBPACK_IMPORTED_MODULE_7__.shouldRotateWithDiscreteAngle)(event) && points.length >= 2) {\n const lastCommittedPoint = points[points.length - 2];\n\n const [width, height] = LinearElementEditor._getShiftLockedDelta(element, elementsMap, lastCommittedPoint, [scenePointerX, scenePointerY], event[_keys__WEBPACK_IMPORTED_MODULE_7__.KEYS.CTRL_OR_CMD] ? null : appState.gridSize);\n\n newPoint = [width + lastCommittedPoint[0], height + lastCommittedPoint[1]];\n } else {\n newPoint = LinearElementEditor.createPointAt(element, elementsMap, scenePointerX - appState.editingLinearElement.pointerOffset.x, scenePointerY - appState.editingLinearElement.pointerOffset.y, event[_keys__WEBPACK_IMPORTED_MODULE_7__.KEYS.CTRL_OR_CMD] ? null : appState.gridSize);\n }\n\n if (lastPoint === lastUncommittedPoint) {\n LinearElementEditor.movePoints(element, [{\n index: element.points.length - 1,\n point: newPoint\n }]);\n } else {\n LinearElementEditor.addPoints(element, appState, [{\n point: newPoint\n }]);\n }\n\n return Object.assign(Object.assign({}, appState.editingLinearElement), {\n lastUncommittedPoint: element.points[element.points.length - 1]\n });\n }\n /** scene coords */\n\n\n static getPointGlobalCoordinates(element, point, elementsMap) {\n const [x1, y1, x2, y2] = (0,___WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n let {\n x,\n y\n } = element;\n [x, y] = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(x + point[0], y + point[1], cx, cy, element.angle);\n return [x, y];\n }\n /** scene coords */\n\n\n static getPointsGlobalCoordinates(element, elementsMap) {\n const [x1, y1, x2, y2] = (0,___WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n return element.points.map(point => {\n let {\n x,\n y\n } = element;\n [x, y] = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(x + point[0], y + point[1], cx, cy, element.angle);\n return [x, y];\n });\n }\n\n static getPointAtIndexGlobalCoordinates(element, indexMaybeFromEnd, // -1 for last element\n elementsMap) {\n const index = indexMaybeFromEnd < 0 ? element.points.length + indexMaybeFromEnd : indexMaybeFromEnd;\n const [x1, y1, x2, y2] = (0,___WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n const point = element.points[index];\n const {\n x,\n y\n } = element;\n return point ? (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(x + point[0], y + point[1], cx, cy, element.angle) : (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(x, y, cx, cy, element.angle);\n }\n\n static pointFromAbsoluteCoords(element, absoluteCoords, elementsMap) {\n const [x1, y1, x2, y2] = (0,___WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n const [x, y] = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(absoluteCoords[0], absoluteCoords[1], cx, cy, -element.angle);\n return [x - element.x, y - element.y];\n }\n\n static getPointIndexUnderCursor(element, elementsMap, zoom, x, y) {\n const pointHandles = LinearElementEditor.getPointsGlobalCoordinates(element, elementsMap);\n let idx = pointHandles.length; // loop from right to left because points on the right are rendered over\n // points on the left, thus should take precedence when clicking, if they\n // overlap\n\n while (--idx > -1) {\n const point = pointHandles[idx];\n\n if ((0,_math__WEBPACK_IMPORTED_MODULE_0__.distance2d)(x, y, point[0], point[1]) * zoom.value < // +1px to account for outline stroke\n LinearElementEditor.POINT_HANDLE_SIZE + 1) {\n return idx;\n }\n }\n\n return -1;\n }\n\n static createPointAt(element, elementsMap, scenePointerX, scenePointerY, gridSize) {\n const pointerOnGrid = (0,_math__WEBPACK_IMPORTED_MODULE_0__.getGridPoint)(scenePointerX, scenePointerY, gridSize);\n const [x1, y1, x2, y2] = (0,___WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n const [rotatedX, rotatedY] = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(pointerOnGrid[0], pointerOnGrid[1], cx, cy, -element.angle);\n return [rotatedX - element.x, rotatedY - element.y];\n }\n /**\r\n * Normalizes line points so that the start point is at [0,0]. This is\r\n * expected in various parts of the codebase. Also returns new x/y to account\r\n * for the potential normalization.\r\n */\n\n\n static getNormalizedPoints(element) {\n const {\n points\n } = element;\n const offsetX = points[0][0];\n const offsetY = points[0][1];\n return {\n points: points.map((point, _idx) => {\n return [point[0] - offsetX, point[1] - offsetY];\n }),\n x: element.x + offsetX,\n y: element.y + offsetY\n };\n } // element-mutating methods\n // ---------------------------------------------------------------------------\n\n\n static normalizePoints(element) {\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_3__.mutateElement)(element, LinearElementEditor.getNormalizedPoints(element));\n }\n\n static duplicateSelectedPoints(appState, elementsMap) {\n if (!appState.editingLinearElement) {\n return false;\n }\n\n const {\n selectedPointsIndices,\n elementId\n } = appState.editingLinearElement;\n const element = LinearElementEditor.getElement(elementId, elementsMap);\n\n if (!element || selectedPointsIndices === null) {\n return false;\n }\n\n const {\n points\n } = element;\n const nextSelectedIndices = [];\n let pointAddedToEnd = false;\n let indexCursor = -1;\n const nextPoints = points.reduce((acc, point, index) => {\n ++indexCursor;\n acc.push(point);\n const isSelected = selectedPointsIndices.includes(index);\n\n if (isSelected) {\n const nextPoint = points[index + 1];\n\n if (!nextPoint) {\n pointAddedToEnd = true;\n }\n\n acc.push(nextPoint ? [(point[0] + nextPoint[0]) / 2, (point[1] + nextPoint[1]) / 2] : [point[0], point[1]]);\n nextSelectedIndices.push(indexCursor + 1);\n ++indexCursor;\n }\n\n return acc;\n }, []);\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_3__.mutateElement)(element, {\n points: nextPoints\n }); // temp hack to ensure the line doesn't move when adding point to the end,\n // potentially expanding the bounding box\n\n if (pointAddedToEnd) {\n const lastPoint = element.points[element.points.length - 1];\n LinearElementEditor.movePoints(element, [{\n index: element.points.length - 1,\n point: [lastPoint[0] + 30, lastPoint[1] + 30]\n }]);\n }\n\n return {\n appState: Object.assign(Object.assign({}, appState), {\n editingLinearElement: Object.assign(Object.assign({}, appState.editingLinearElement), {\n selectedPointsIndices: nextSelectedIndices\n })\n })\n };\n }\n\n static deletePoints(element, pointIndices) {\n let offsetX = 0;\n let offsetY = 0;\n const isDeletingOriginPoint = pointIndices.includes(0); // if deleting first point, make the next to be [0,0] and recalculate\n // positions of the rest with respect to it\n\n if (isDeletingOriginPoint) {\n const firstNonDeletedPoint = element.points.find((point, idx) => {\n return !pointIndices.includes(idx);\n });\n\n if (firstNonDeletedPoint) {\n offsetX = firstNonDeletedPoint[0];\n offsetY = firstNonDeletedPoint[1];\n }\n }\n\n const nextPoints = element.points.reduce((acc, point, idx) => {\n if (!pointIndices.includes(idx)) {\n acc.push(!acc.length ? [0, 0] : [point[0] - offsetX, point[1] - offsetY]);\n }\n\n return acc;\n }, []);\n\n LinearElementEditor._updatePoints(element, nextPoints, offsetX, offsetY);\n }\n\n static addPoints(element, appState, targetPoints) {\n const offsetX = 0;\n const offsetY = 0;\n const nextPoints = [...element.points, ...targetPoints.map(x => x.point)];\n\n LinearElementEditor._updatePoints(element, nextPoints, offsetX, offsetY);\n }\n\n static movePoints(element, targetPoints, otherUpdates) {\n const {\n points\n } = element; // in case we're moving start point, instead of modifying its position\n // which would break the invariant of it being at [0,0], we move\n // all the other points in the opposite direction by delta to\n // offset it. We do the same with actual element.x/y position, so\n // this hacks are completely transparent to the user.\n\n let offsetX = 0;\n let offsetY = 0;\n const selectedOriginPoint = targetPoints.find(({\n index\n }) => index === 0);\n\n if (selectedOriginPoint) {\n offsetX = selectedOriginPoint.point[0] + points[selectedOriginPoint.index][0];\n offsetY = selectedOriginPoint.point[1] + points[selectedOriginPoint.index][1];\n }\n\n const nextPoints = points.map((point, idx) => {\n const selectedPointData = targetPoints.find(p => p.index === idx);\n\n if (selectedPointData) {\n if (selectedPointData.index === 0) {\n return point;\n }\n\n const deltaX = selectedPointData.point[0] - points[selectedPointData.index][0];\n const deltaY = selectedPointData.point[1] - points[selectedPointData.index][1];\n return [point[0] + deltaX - offsetX, point[1] + deltaY - offsetY];\n }\n\n return offsetX || offsetY ? [point[0] - offsetX, point[1] - offsetY] : point;\n });\n\n LinearElementEditor._updatePoints(element, nextPoints, offsetX, offsetY, otherUpdates);\n }\n\n static shouldAddMidpoint(linearElementEditor, pointerCoords, appState, elementsMap) {\n const element = LinearElementEditor.getElement(linearElementEditor.elementId, elementsMap);\n\n if (!element) {\n return false;\n }\n\n const {\n segmentMidpoint\n } = linearElementEditor.pointerDownState;\n\n if (segmentMidpoint.added || segmentMidpoint.value === null || segmentMidpoint.index === null || linearElementEditor.pointerDownState.origin === null) {\n return false;\n }\n\n const origin = linearElementEditor.pointerDownState.origin;\n const dist = (0,_math__WEBPACK_IMPORTED_MODULE_0__.distance2d)(origin.x, origin.y, pointerCoords.x, pointerCoords.y);\n\n if (!appState.editingLinearElement && dist < _constants__WEBPACK_IMPORTED_MODULE_9__.DRAGGING_THRESHOLD / appState.zoom.value) {\n return false;\n }\n\n return true;\n }\n\n static addMidpoint(linearElementEditor, pointerCoords, appState, snapToGrid, elementsMap) {\n const element = LinearElementEditor.getElement(linearElementEditor.elementId, elementsMap);\n\n if (!element) {\n return;\n }\n\n const {\n segmentMidpoint\n } = linearElementEditor.pointerDownState;\n const ret = {\n pointerDownState: linearElementEditor.pointerDownState,\n selectedPointsIndices: linearElementEditor.selectedPointsIndices\n };\n const midpoint = LinearElementEditor.createPointAt(element, elementsMap, pointerCoords.x, pointerCoords.y, snapToGrid ? appState.gridSize : null);\n const points = [...element.points.slice(0, segmentMidpoint.index), midpoint, ...element.points.slice(segmentMidpoint.index)];\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_3__.mutateElement)(element, {\n points\n });\n ret.pointerDownState = Object.assign(Object.assign({}, linearElementEditor.pointerDownState), {\n segmentMidpoint: Object.assign(Object.assign({}, linearElementEditor.pointerDownState.segmentMidpoint), {\n added: true\n }),\n lastClickedPoint: segmentMidpoint.index\n });\n ret.selectedPointsIndices = [segmentMidpoint.index];\n return ret;\n }\n\n static _updatePoints(element, nextPoints, offsetX, offsetY, otherUpdates) {\n const nextCoords = (0,_bounds__WEBPACK_IMPORTED_MODULE_2__.getElementPointsCoords)(element, nextPoints);\n const prevCoords = (0,_bounds__WEBPACK_IMPORTED_MODULE_2__.getElementPointsCoords)(element, element.points);\n const nextCenterX = (nextCoords[0] + nextCoords[2]) / 2;\n const nextCenterY = (nextCoords[1] + nextCoords[3]) / 2;\n const prevCenterX = (prevCoords[0] + prevCoords[2]) / 2;\n const prevCenterY = (prevCoords[1] + prevCoords[3]) / 2;\n const dX = prevCenterX - nextCenterX;\n const dY = prevCenterY - nextCenterY;\n const rotated = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotate)(offsetX, offsetY, dX, dY, element.angle);\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_3__.mutateElement)(element, Object.assign(Object.assign({}, otherUpdates), {\n points: nextPoints,\n x: element.x + rotated[0],\n y: element.y + rotated[1]\n }));\n }\n\n static _getShiftLockedDelta(element, elementsMap, referencePoint, scenePointer, gridSize) {\n const referencePointCoords = LinearElementEditor.getPointGlobalCoordinates(element, referencePoint, elementsMap);\n const [gridX, gridY] = (0,_math__WEBPACK_IMPORTED_MODULE_0__.getGridPoint)(scenePointer[0], scenePointer[1], gridSize);\n const {\n width,\n height\n } = (0,___WEBPACK_IMPORTED_MODULE_1__.getLockedLinearCursorAlignSize)(referencePointCoords[0], referencePointCoords[1], gridX, gridY);\n return (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotatePoint)([width, height], [0, 0], -element.angle);\n }\n\n} // ---------------------------------------------------------------------------\n// static methods\n// ---------------------------------------------------------------------------\n\nLinearElementEditor.POINT_HANDLE_SIZE = 10;\n\nLinearElementEditor.getEditorMidPoints = (element, elementsMap, appState) => {\n const boundText = (0,_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(element, elementsMap); // Since its not needed outside editor unless 2 pointer lines or bound text\n\n if (!appState.editingLinearElement && element.points.length > 2 && !boundText) {\n return [];\n }\n\n if (editorMidPointsCache.version === element.version && editorMidPointsCache.zoom === appState.zoom.value) {\n return editorMidPointsCache.points;\n }\n\n LinearElementEditor.updateEditorMidPointsCache(element, elementsMap, appState);\n return editorMidPointsCache.points;\n};\n\nLinearElementEditor.updateEditorMidPointsCache = (element, elementsMap, appState) => {\n const points = LinearElementEditor.getPointsGlobalCoordinates(element, elementsMap);\n let index = 0;\n const midpoints = [];\n\n while (index < points.length - 1) {\n if (LinearElementEditor.isSegmentTooShort(element, element.points[index], element.points[index + 1], appState.zoom)) {\n midpoints.push(null);\n index++;\n continue;\n }\n\n const segmentMidPoint = LinearElementEditor.getSegmentMidPoint(element, points[index], points[index + 1], index + 1, elementsMap);\n midpoints.push(segmentMidPoint);\n index++;\n }\n\n editorMidPointsCache.points = midpoints;\n editorMidPointsCache.version = element.version;\n editorMidPointsCache.zoom = appState.zoom.value;\n};\n\nLinearElementEditor.getSegmentMidpointHitCoords = (linearElementEditor, scenePointer, appState, elementsMap) => {\n const {\n elementId\n } = linearElementEditor;\n const element = LinearElementEditor.getElement(elementId, elementsMap);\n\n if (!element) {\n return null;\n }\n\n const clickedPointIndex = LinearElementEditor.getPointIndexUnderCursor(element, elementsMap, appState.zoom, scenePointer.x, scenePointer.y);\n\n if (clickedPointIndex >= 0) {\n return null;\n }\n\n const points = LinearElementEditor.getPointsGlobalCoordinates(element, elementsMap);\n\n if (points.length >= 3 && !appState.editingLinearElement) {\n return null;\n }\n\n const threshold = LinearElementEditor.POINT_HANDLE_SIZE / appState.zoom.value;\n const existingSegmentMidpointHitCoords = linearElementEditor.segmentMidPointHoveredCoords;\n\n if (existingSegmentMidpointHitCoords) {\n const distance = (0,_math__WEBPACK_IMPORTED_MODULE_0__.distance2d)(existingSegmentMidpointHitCoords[0], existingSegmentMidpointHitCoords[1], scenePointer.x, scenePointer.y);\n\n if (distance <= threshold) {\n return existingSegmentMidpointHitCoords;\n }\n }\n\n let index = 0;\n const midPoints = LinearElementEditor.getEditorMidPoints(element, elementsMap, appState);\n\n while (index < midPoints.length) {\n if (midPoints[index] !== null) {\n const distance = (0,_math__WEBPACK_IMPORTED_MODULE_0__.distance2d)(midPoints[index][0], midPoints[index][1], scenePointer.x, scenePointer.y);\n\n if (distance <= threshold) {\n return midPoints[index];\n }\n }\n\n index++;\n }\n\n return null;\n};\n\nLinearElementEditor.getBoundTextElementPosition = (element, boundTextElement, elementsMap) => {\n const points = LinearElementEditor.getPointsGlobalCoordinates(element, elementsMap);\n\n if (points.length < 2) {\n (0,_mutateElement__WEBPACK_IMPORTED_MODULE_3__.mutateElement)(boundTextElement, {\n isDeleted: true\n });\n }\n\n let x = 0;\n let y = 0;\n\n if (element.points.length % 2 === 1) {\n const index = Math.floor(element.points.length / 2);\n const midPoint = LinearElementEditor.getPointGlobalCoordinates(element, element.points[index], elementsMap);\n x = midPoint[0] - boundTextElement.width / 2;\n y = midPoint[1] - boundTextElement.height / 2;\n } else {\n const index = element.points.length / 2 - 1;\n let midSegmentMidpoint = editorMidPointsCache.points[index];\n\n if (element.points.length === 2) {\n midSegmentMidpoint = (0,_math__WEBPACK_IMPORTED_MODULE_0__.centerPoint)(points[0], points[1]);\n }\n\n if (!midSegmentMidpoint || editorMidPointsCache.version !== element.version) {\n midSegmentMidpoint = LinearElementEditor.getSegmentMidPoint(element, points[index], points[index + 1], index + 1, elementsMap);\n }\n\n x = midSegmentMidpoint[0] - boundTextElement.width / 2;\n y = midSegmentMidpoint[1] - boundTextElement.height / 2;\n }\n\n return {\n x,\n y\n };\n};\n\nLinearElementEditor.getMinMaxXYWithBoundText = (element, elementsMap, elementBounds, boundTextElement) => {\n let [x1, y1, x2, y2] = elementBounds;\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n const {\n x: boundTextX1,\n y: boundTextY1\n } = LinearElementEditor.getBoundTextElementPosition(element, boundTextElement, elementsMap);\n const boundTextX2 = boundTextX1 + boundTextElement.width;\n const boundTextY2 = boundTextY1 + boundTextElement.height;\n const topLeftRotatedPoint = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotatePoint)([x1, y1], [cx, cy], element.angle);\n const topRightRotatedPoint = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotatePoint)([x2, y1], [cx, cy], element.angle);\n const counterRotateBoundTextTopLeft = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotatePoint)([boundTextX1, boundTextY1], [cx, cy], -element.angle);\n const counterRotateBoundTextTopRight = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotatePoint)([boundTextX2, boundTextY1], [cx, cy], -element.angle);\n const counterRotateBoundTextBottomLeft = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotatePoint)([boundTextX1, boundTextY2], [cx, cy], -element.angle);\n const counterRotateBoundTextBottomRight = (0,_math__WEBPACK_IMPORTED_MODULE_0__.rotatePoint)([boundTextX2, boundTextY2], [cx, cy], -element.angle);\n\n if (topLeftRotatedPoint[0] < topRightRotatedPoint[0] && topLeftRotatedPoint[1] >= topRightRotatedPoint[1]) {\n x1 = Math.min(x1, counterRotateBoundTextBottomLeft[0]);\n x2 = Math.max(x2, Math.max(counterRotateBoundTextTopRight[0], counterRotateBoundTextBottomRight[0]));\n y1 = Math.min(y1, counterRotateBoundTextTopLeft[1]);\n y2 = Math.max(y2, counterRotateBoundTextBottomRight[1]);\n } else if (topLeftRotatedPoint[0] >= topRightRotatedPoint[0] && topLeftRotatedPoint[1] > topRightRotatedPoint[1]) {\n x1 = Math.min(x1, counterRotateBoundTextBottomRight[0]);\n x2 = Math.max(x2, Math.max(counterRotateBoundTextTopLeft[0], counterRotateBoundTextTopRight[0]));\n y1 = Math.min(y1, counterRotateBoundTextBottomLeft[1]);\n y2 = Math.max(y2, counterRotateBoundTextTopRight[1]);\n } else if (topLeftRotatedPoint[0] >= topRightRotatedPoint[0]) {\n x1 = Math.min(x1, counterRotateBoundTextTopRight[0]);\n x2 = Math.max(x2, counterRotateBoundTextBottomLeft[0]);\n y1 = Math.min(y1, counterRotateBoundTextBottomRight[1]);\n y2 = Math.max(y2, counterRotateBoundTextTopLeft[1]);\n } else if (topLeftRotatedPoint[1] <= topRightRotatedPoint[1]) {\n x1 = Math.min(x1, Math.min(counterRotateBoundTextTopRight[0], counterRotateBoundTextTopLeft[0]));\n x2 = Math.max(x2, counterRotateBoundTextBottomRight[0]);\n y1 = Math.min(y1, counterRotateBoundTextTopRight[1]);\n y2 = Math.max(y2, counterRotateBoundTextBottomLeft[1]);\n }\n\n return [x1, y1, x2, y2, cx, cy];\n};\n\nLinearElementEditor.getElementAbsoluteCoords = (element, elementsMap, includeBoundText = false) => {\n let coords;\n let x1;\n let y1;\n let x2;\n let y2;\n\n if (element.points.length < 2 || !_scene_ShapeCache__WEBPACK_IMPORTED_MODULE_10__.ShapeCache.get(element)) {\n // XXX this is just a poor estimate and not very useful\n const {\n minX,\n minY,\n maxX,\n maxY\n } = element.points.reduce((limits, [x, y]) => {\n limits.minY = Math.min(limits.minY, y);\n limits.minX = Math.min(limits.minX, x);\n limits.maxX = Math.max(limits.maxX, x);\n limits.maxY = Math.max(limits.maxY, y);\n return limits;\n }, {\n minX: Infinity,\n minY: Infinity,\n maxX: -Infinity,\n maxY: -Infinity\n });\n x1 = minX + element.x;\n y1 = minY + element.y;\n x2 = maxX + element.x;\n y2 = maxY + element.y;\n } else {\n const shape = _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_10__.ShapeCache.generateElementShape(element, null); // first element is always the curve\n\n const ops = (0,_bounds__WEBPACK_IMPORTED_MODULE_2__.getCurvePathOps)(shape[0]);\n const [minX, minY, maxX, maxY] = (0,_bounds__WEBPACK_IMPORTED_MODULE_2__.getMinMaxXYFromCurvePathOps)(ops);\n x1 = minX + element.x;\n y1 = minY + element.y;\n x2 = maxX + element.x;\n y2 = maxY + element.y;\n }\n\n const cx = (x1 + x2) / 2;\n const cy = (y1 + y2) / 2;\n coords = [x1, y1, x2, y2, cx, cy];\n\n if (!includeBoundText) {\n return coords;\n }\n\n const boundTextElement = (0,_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(element, elementsMap);\n\n if (boundTextElement) {\n coords = LinearElementEditor.getMinMaxXYWithBoundText(element, elementsMap, [x1, y1, x2, y2], boundTextElement);\n }\n\n return coords;\n};\n\nconst normalizeSelectedPoints = points => {\n let nextPoints = [...new Set(points.filter(p => p !== null && p !== -1))];\n nextPoints = nextPoints.sort((a, b) => a - b);\n return nextPoints.length ? nextPoints : null;\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./element/linearElementEditor.ts?");
2733
2733
 
2734
2734
  /***/ }),
2735
2735
 
@@ -2740,7 +2740,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
2740
2740
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
2741
2741
 
2742
2742
  "use strict";
2743
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"bumpVersion\": () => (/* binding */ bumpVersion),\n/* harmony export */ \"mutateElement\": () => (/* binding */ mutateElement),\n/* harmony export */ \"newElementWith\": () => (/* binding */ newElementWith)\n/* harmony export */ });\n/* harmony import */ var _scene_Scene__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../scene/Scene */ \"./scene/Scene.ts\");\n/* harmony import */ var _points__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../points */ \"./points.ts\");\n/* harmony import */ var _random__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../random */ \"./random.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../scene/ShapeCache */ \"./scene/ShapeCache.ts\");\n\n\n\n\n // This function tracks updates of text elements for the purposes for collaboration.\n// The version is used to compare updates when more than one user is working in\n// the same drawing. Note: this will trigger the component to update. Make sure you\n// are calling it either from a React event handler or within unstable_batchedUpdates().\n\nconst mutateElement = (element, updates, informMutation = true) => {\n var _a;\n\n let didChange = false; // casting to any because can't use `in` operator\n // (see https://github.com/microsoft/TypeScript/issues/21732)\n\n const {\n points,\n fileId\n } = updates;\n\n if (typeof points !== \"undefined\") {\n updates = Object.assign(Object.assign({}, (0,_points__WEBPACK_IMPORTED_MODULE_1__.getSizeFromPoints)(points)), updates);\n }\n\n for (const key in updates) {\n const value = updates[key];\n\n if (typeof value !== \"undefined\") {\n if (element[key] === value && ( // if object, always update because its attrs could have changed\n // (except for specific keys we handle below)\n typeof value !== \"object\" || value === null || key === \"groupIds\" || key === \"scale\")) {\n continue;\n }\n\n if (key === \"scale\") {\n const prevScale = element[key];\n const nextScale = value;\n\n if (prevScale[0] === nextScale[0] && prevScale[1] === nextScale[1]) {\n continue;\n }\n } else if (key === \"points\") {\n const prevPoints = element[key];\n const nextPoints = value;\n\n if (prevPoints.length === nextPoints.length) {\n let didChangePoints = false;\n let index = prevPoints.length;\n\n while (--index) {\n const prevPoint = prevPoints[index];\n const nextPoint = nextPoints[index];\n\n if (prevPoint[0] !== nextPoint[0] || prevPoint[1] !== nextPoint[1]) {\n didChangePoints = true;\n break;\n }\n }\n\n if (!didChangePoints) {\n continue;\n }\n }\n }\n\n element[key] = value;\n didChange = true;\n }\n }\n\n if (!didChange) {\n return element;\n }\n\n if (typeof updates.height !== \"undefined\" || typeof updates.width !== \"undefined\" || typeof fileId != \"undefined\" || typeof points !== \"undefined\") {\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_4__.ShapeCache[\"delete\"](element);\n }\n\n element.version++;\n element.versionNonce = (0,_random__WEBPACK_IMPORTED_MODULE_2__.randomInteger)();\n element.updated = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getUpdatedTimestamp)();\n\n if (informMutation) {\n (_a = _scene_Scene__WEBPACK_IMPORTED_MODULE_0__[\"default\"].getScene(element)) === null || _a === void 0 ? void 0 : _a.triggerUpdate();\n }\n\n return element;\n};\nconst newElementWith = (element, updates,\n/** pass `true` to always regenerate */\nforce = false) => {\n let didChange = false;\n\n for (const key in updates) {\n const value = updates[key];\n\n if (typeof value !== \"undefined\") {\n if (element[key] === value && ( // if object, always update because its attrs could have changed\n typeof value !== \"object\" || value === null)) {\n continue;\n }\n\n didChange = true;\n }\n }\n\n if (!didChange && !force) {\n return element;\n }\n\n return Object.assign(Object.assign(Object.assign({}, element), updates), {\n updated: (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getUpdatedTimestamp)(),\n version: element.version + 1,\n versionNonce: (0,_random__WEBPACK_IMPORTED_MODULE_2__.randomInteger)()\n });\n};\n/**\r\n * Mutates element, bumping `version`, `versionNonce`, and `updated`.\r\n *\r\n * NOTE: does not trigger re-render.\r\n */\n\nconst bumpVersion = (element, version) => {\n element.version = (version !== null && version !== void 0 ? version : element.version) + 1;\n element.versionNonce = (0,_random__WEBPACK_IMPORTED_MODULE_2__.randomInteger)();\n element.updated = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getUpdatedTimestamp)();\n return element;\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./element/mutateElement.ts?");
2743
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"bumpVersion\": () => (/* binding */ bumpVersion),\n/* harmony export */ \"mutateElement\": () => (/* binding */ mutateElement),\n/* harmony export */ \"newElementWith\": () => (/* binding */ newElementWith)\n/* harmony export */ });\n/* harmony import */ var _scene_Scene__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../scene/Scene */ \"./scene/Scene.ts\");\n/* harmony import */ var _points__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../points */ \"./points.ts\");\n/* harmony import */ var _random__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../random */ \"./random.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../scene/ShapeCache */ \"./scene/ShapeCache.ts\");\n\n\n\n\n // This function tracks updates of text elements for the purposes for collaboration.\n// The version is used to compare updates when more than one user is working in\n// the same drawing. Note: this will trigger the component to update. Make sure you\n// are calling it either from a React event handler or within unstable_batchedUpdates().\n\nconst mutateElement = (element, updates, informMutation = true) => {\n var _a;\n\n let didChange = false; // casting to any because can't use `in` operator\n // (see https://github.com/microsoft/TypeScript/issues/21732)\n\n const {\n points,\n fileId\n } = updates;\n\n if (typeof points !== \"undefined\") {\n updates = Object.assign(Object.assign({}, (0,_points__WEBPACK_IMPORTED_MODULE_1__.getSizeFromPoints)(points)), updates);\n }\n\n for (const key in updates) {\n const value = updates[key];\n\n if (typeof value !== \"undefined\") {\n if (element[key] === value && ( // if object, always update because its attrs could have changed\n // (except for specific keys we handle below)\n typeof value !== \"object\" || value === null || key === \"groupIds\" || key === \"scale\")) {\n continue;\n }\n\n if (key === \"scale\") {\n const prevScale = element[key];\n const nextScale = value;\n\n if (prevScale[0] === nextScale[0] && prevScale[1] === nextScale[1]) {\n continue;\n }\n } else if (key === \"points\") {\n const prevPoints = element[key];\n const nextPoints = value;\n\n if (prevPoints.length === nextPoints.length) {\n let didChangePoints = false;\n let index = prevPoints.length;\n\n while (--index) {\n const prevPoint = prevPoints[index];\n const nextPoint = nextPoints[index];\n\n if (prevPoint[0] !== nextPoint[0] || prevPoint[1] !== nextPoint[1]) {\n didChangePoints = true;\n break;\n }\n }\n\n if (!didChangePoints) {\n continue;\n }\n }\n }\n\n element[key] = value;\n didChange = true;\n }\n }\n\n if (!didChange) {\n return element;\n }\n\n if (typeof updates.height !== \"undefined\" || typeof updates.width !== \"undefined\" || typeof fileId != \"undefined\" || typeof points !== \"undefined\") {\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_4__.ShapeCache[\"delete\"](element);\n }\n\n element.version++;\n element.versionNonce = (0,_random__WEBPACK_IMPORTED_MODULE_2__.randomInteger)();\n element.updated = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getUpdatedTimestamp)();\n\n if (informMutation) {\n (_a = _scene_Scene__WEBPACK_IMPORTED_MODULE_0__[\"default\"].getScene(element)) === null || _a === void 0 ? void 0 : _a.triggerUpdate();\n }\n\n return element;\n};\nconst newElementWith = (element, updates) => {\n let didChange = false;\n\n for (const key in updates) {\n const value = updates[key];\n\n if (typeof value !== \"undefined\") {\n if (element[key] === value && ( // if object, always update because its attrs could have changed\n typeof value !== \"object\" || value === null)) {\n continue;\n }\n\n didChange = true;\n }\n }\n\n if (!didChange) {\n return element;\n }\n\n return Object.assign(Object.assign(Object.assign({}, element), updates), {\n updated: (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getUpdatedTimestamp)(),\n version: element.version + 1,\n versionNonce: (0,_random__WEBPACK_IMPORTED_MODULE_2__.randomInteger)()\n });\n};\n/**\r\n * Mutates element, bumping `version`, `versionNonce`, and `updated`.\r\n *\r\n * NOTE: does not trigger re-render.\r\n */\n\nconst bumpVersion = (element, version) => {\n element.version = (version !== null && version !== void 0 ? version : element.version) + 1;\n element.versionNonce = (0,_random__WEBPACK_IMPORTED_MODULE_2__.randomInteger)();\n element.updated = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getUpdatedTimestamp)();\n return element;\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./element/mutateElement.ts?");
2744
2744
 
2745
2745
  /***/ }),
2746
2746
 
@@ -2872,7 +2872,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
2872
2872
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
2873
2873
 
2874
2874
  "use strict";
2875
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"Button\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.Button),\n/* harmony export */ \"DEFAULT_LASER_COLOR\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.DEFAULT_LASER_COLOR),\n/* harmony export */ \"DefaultSidebar\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.DefaultSidebar),\n/* harmony export */ \"Excalidraw\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.Excalidraw),\n/* harmony export */ \"FONT_FAMILY\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.FONT_FAMILY),\n/* harmony export */ \"Footer\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.Footer),\n/* harmony export */ \"LiveCollaborationTrigger\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.LiveCollaborationTrigger),\n/* harmony export */ \"MIME_TYPES\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES),\n/* harmony export */ \"MainMenu\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.MainMenu),\n/* harmony export */ \"ROUNDNESS\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.ROUNDNESS),\n/* harmony export */ \"Sidebar\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.Sidebar),\n/* harmony export */ \"StoreAction\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.StoreAction),\n/* harmony export */ \"THEME\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.THEME),\n/* harmony export */ \"TTDDialog\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.TTDDialog),\n/* harmony export */ \"TTDDialogTrigger\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.TTDDialogTrigger),\n/* harmony export */ \"WelcomeScreen\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.WelcomeScreen),\n/* harmony export */ \"bumpVersion\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.bumpVersion),\n/* harmony export */ \"convertToExcalidrawElements\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.convertToExcalidrawElements),\n/* harmony export */ \"defaultLang\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.defaultLang),\n/* harmony export */ \"determineFocusDistance\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.determineFocusDistance),\n/* harmony export */ \"elementPartiallyOverlapsWithOrContainsBBox\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.elementPartiallyOverlapsWithOrContainsBBox),\n/* harmony export */ \"elementsOverlappingBBox\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.elementsOverlappingBBox),\n/* harmony export */ \"exportToBlob\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.exportToBlob),\n/* harmony export */ \"exportToCanvas\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.exportToCanvas),\n/* harmony export */ \"exportToClipboard\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.exportToClipboard),\n/* harmony export */ \"exportToSvg\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.exportToSvg),\n/* harmony export */ \"getBoundTextMaxWidth\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getBoundTextMaxWidth),\n/* harmony export */ \"getCommonBoundingBox\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getCommonBoundingBox),\n/* harmony export */ \"getCommonBounds\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getCommonBounds),\n/* harmony export */ \"getContainerElement\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getContainerElement),\n/* harmony export */ \"getDefaultLineHeight\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getDefaultLineHeight),\n/* harmony export */ \"getEmbedLink\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getEmbedLink),\n/* harmony export */ \"getFontString\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getFontString),\n/* harmony export */ \"getFreeDrawSvgPath\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getFreeDrawSvgPath),\n/* harmony export */ \"getLibraryItemsHash\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getLibraryItemsHash),\n/* harmony export */ \"getMaximumGroups\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getMaximumGroups),\n/* harmony export */ \"getNonDeletedElements\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getNonDeletedElements),\n/* harmony export */ \"getSceneVersion\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getSceneVersion),\n/* harmony export */ \"getVisibleSceneBounds\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getVisibleSceneBounds),\n/* harmony export */ \"hashElementsVersion\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.hashElementsVersion),\n/* harmony export */ \"hashString\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.hashString),\n/* harmony export */ \"intersectElementWithLine\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.intersectElementWithLine),\n/* harmony export */ \"isElementInsideBBox\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.isElementInsideBBox),\n/* harmony export */ \"isInvisiblySmallElement\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.isInvisiblySmallElement),\n/* harmony export */ \"isLinearElement\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.isLinearElement),\n/* harmony export */ \"languages\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.languages),\n/* harmony export */ \"loadFromBlob\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.loadFromBlob),\n/* harmony export */ \"loadLibraryFromBlob\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.loadLibraryFromBlob),\n/* harmony export */ \"loadSceneOrLibraryFromBlob\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.loadSceneOrLibraryFromBlob),\n/* harmony export */ \"measureText\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.measureText),\n/* harmony export */ \"mergeLibraryItems\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.mergeLibraryItems),\n/* harmony export */ \"mermaidToExcalidraw\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.mermaidToExcalidraw),\n/* harmony export */ \"mutateElement\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.mutateElement),\n/* harmony export */ \"newElementWith\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.newElementWith),\n/* harmony export */ \"normalizeLink\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.normalizeLink),\n/* harmony export */ \"parseLibraryTokensFromUrl\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.parseLibraryTokensFromUrl),\n/* harmony export */ \"reconcileElements\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.reconcileElements),\n/* harmony export */ \"refreshTextDimensions\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.refreshTextDimensions),\n/* harmony export */ \"restore\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.restore),\n/* harmony export */ \"restoreAppState\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.restoreAppState),\n/* harmony export */ \"restoreElements\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.restoreElements),\n/* harmony export */ \"restoreLibraryItems\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.restoreLibraryItems),\n/* harmony export */ \"sceneCoordsToViewportCoords\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.sceneCoordsToViewportCoords),\n/* harmony export */ \"serializeAsJSON\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.serializeAsJSON),\n/* harmony export */ \"serializeLibraryAsJSON\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.serializeLibraryAsJSON),\n/* harmony export */ \"useDevice\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.useDevice),\n/* harmony export */ \"useHandleLibrary\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.useHandleLibrary),\n/* harmony export */ \"useI18n\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.useI18n),\n/* harmony export */ \"viewportCoordsToSceneCoords\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.viewportCoordsToSceneCoords),\n/* harmony export */ \"wrapText\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.wrapText),\n/* harmony export */ \"zoomToFitBounds\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.zoomToFitBounds)\n/* harmony export */ });\n/* harmony import */ var _publicPath__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./publicPath */ \"./publicPath.js\");\n/* harmony import */ var _polyfill__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./polyfill */ \"./polyfill.ts\");\n/* harmony import */ var _public_fonts_fonts_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../public/fonts/fonts.css */ \"../../public/fonts/fonts.css\");\n/* harmony import */ var _index__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./index */ \"./index.tsx\");\n\n\n\n(0,_polyfill__WEBPACK_IMPORTED_MODULE_1__[\"default\"])();\n\n\n//# sourceURL=webpack://ExcalidrawLib/./entry.js?");
2875
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"Button\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.Button),\n/* harmony export */ \"DEFAULT_LASER_COLOR\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.DEFAULT_LASER_COLOR),\n/* harmony export */ \"DefaultSidebar\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.DefaultSidebar),\n/* harmony export */ \"Excalidraw\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.Excalidraw),\n/* harmony export */ \"FONT_FAMILY\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.FONT_FAMILY),\n/* harmony export */ \"Footer\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.Footer),\n/* harmony export */ \"LiveCollaborationTrigger\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.LiveCollaborationTrigger),\n/* harmony export */ \"MIME_TYPES\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES),\n/* harmony export */ \"MainMenu\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.MainMenu),\n/* harmony export */ \"ROUNDNESS\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.ROUNDNESS),\n/* harmony export */ \"Sidebar\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.Sidebar),\n/* harmony export */ \"StoreAction\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.StoreAction),\n/* harmony export */ \"THEME\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.THEME),\n/* harmony export */ \"TTDDialog\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.TTDDialog),\n/* harmony export */ \"TTDDialogTrigger\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.TTDDialogTrigger),\n/* harmony export */ \"WelcomeScreen\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.WelcomeScreen),\n/* harmony export */ \"bumpVersion\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.bumpVersion),\n/* harmony export */ \"convertToExcalidrawElements\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.convertToExcalidrawElements),\n/* harmony export */ \"defaultLang\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.defaultLang),\n/* harmony export */ \"destroyObsidianUtils\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.destroyObsidianUtils),\n/* harmony export */ \"determineFocusDistance\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.determineFocusDistance),\n/* harmony export */ \"elementPartiallyOverlapsWithOrContainsBBox\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.elementPartiallyOverlapsWithOrContainsBBox),\n/* harmony export */ \"elementsOverlappingBBox\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.elementsOverlappingBBox),\n/* harmony export */ \"exportToBlob\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.exportToBlob),\n/* harmony export */ \"exportToCanvas\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.exportToCanvas),\n/* harmony export */ \"exportToClipboard\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.exportToClipboard),\n/* harmony export */ \"exportToSvg\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.exportToSvg),\n/* harmony export */ \"getBoundTextMaxWidth\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getBoundTextMaxWidth),\n/* harmony export */ \"getCommonBoundingBox\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getCommonBoundingBox),\n/* harmony export */ \"getCommonBounds\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getCommonBounds),\n/* harmony export */ \"getContainerElement\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getContainerElement),\n/* harmony export */ \"getDefaultLineHeight\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getDefaultLineHeight),\n/* harmony export */ \"getEmbedLink\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getEmbedLink),\n/* harmony export */ \"getFontString\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getFontString),\n/* harmony export */ \"getFreeDrawSvgPath\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getFreeDrawSvgPath),\n/* harmony export */ \"getLibraryItemsHash\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getLibraryItemsHash),\n/* harmony export */ \"getMaximumGroups\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getMaximumGroups),\n/* harmony export */ \"getNonDeletedElements\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getNonDeletedElements),\n/* harmony export */ \"getSceneVersion\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getSceneVersion),\n/* harmony export */ \"getVisibleSceneBounds\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.getVisibleSceneBounds),\n/* harmony export */ \"hashElementsVersion\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.hashElementsVersion),\n/* harmony export */ \"hashString\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.hashString),\n/* harmony export */ \"intersectElementWithLine\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.intersectElementWithLine),\n/* harmony export */ \"isElementInsideBBox\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.isElementInsideBBox),\n/* harmony export */ \"isInvisiblySmallElement\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.isInvisiblySmallElement),\n/* harmony export */ \"isLinearElement\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.isLinearElement),\n/* harmony export */ \"languages\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.languages),\n/* harmony export */ \"loadFromBlob\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.loadFromBlob),\n/* harmony export */ \"loadLibraryFromBlob\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.loadLibraryFromBlob),\n/* harmony export */ \"loadSceneOrLibraryFromBlob\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.loadSceneOrLibraryFromBlob),\n/* harmony export */ \"measureText\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.measureText),\n/* harmony export */ \"mergeLibraryItems\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.mergeLibraryItems),\n/* harmony export */ \"mermaidToExcalidraw\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.mermaidToExcalidraw),\n/* harmony export */ \"mutateElement\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.mutateElement),\n/* harmony export */ \"newElementWith\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.newElementWith),\n/* harmony export */ \"normalizeLink\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.normalizeLink),\n/* harmony export */ \"parseLibraryTokensFromUrl\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.parseLibraryTokensFromUrl),\n/* harmony export */ \"reconcileElements\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.reconcileElements),\n/* harmony export */ \"refreshTextDimensions\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.refreshTextDimensions),\n/* harmony export */ \"restore\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.restore),\n/* harmony export */ \"restoreAppState\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.restoreAppState),\n/* harmony export */ \"restoreElements\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.restoreElements),\n/* harmony export */ \"restoreLibraryItems\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.restoreLibraryItems),\n/* harmony export */ \"sceneCoordsToViewportCoords\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.sceneCoordsToViewportCoords),\n/* harmony export */ \"serializeAsJSON\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.serializeAsJSON),\n/* harmony export */ \"serializeLibraryAsJSON\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.serializeLibraryAsJSON),\n/* harmony export */ \"useDevice\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.useDevice),\n/* harmony export */ \"useHandleLibrary\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.useHandleLibrary),\n/* harmony export */ \"useI18n\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.useI18n),\n/* harmony export */ \"viewportCoordsToSceneCoords\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.viewportCoordsToSceneCoords),\n/* harmony export */ \"wrapText\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.wrapText),\n/* harmony export */ \"zoomToFitBounds\": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_3__.zoomToFitBounds)\n/* harmony export */ });\n/* harmony import */ var _publicPath__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./publicPath */ \"./publicPath.js\");\n/* harmony import */ var _polyfill__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./polyfill */ \"./polyfill.ts\");\n/* harmony import */ var _public_fonts_fonts_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../public/fonts/fonts.css */ \"../../public/fonts/fonts.css\");\n/* harmony import */ var _index__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./index */ \"./index.tsx\");\n\n\n\n(0,_polyfill__WEBPACK_IMPORTED_MODULE_1__[\"default\"])();\n\n\n//# sourceURL=webpack://ExcalidrawLib/./entry.js?");
2876
2876
 
2877
2877
  /***/ }),
2878
2878
 
@@ -3114,7 +3114,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
3114
3114
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
3115
3115
 
3116
3116
  "use strict";
3117
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"Button\": () => (/* reexport safe */ _components_Button__WEBPACK_IMPORTED_MODULE_32__.Button),\n/* harmony export */ \"DEFAULT_LASER_COLOR\": () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_10__.DEFAULT_LASER_COLOR),\n/* harmony export */ \"DefaultSidebar\": () => (/* reexport safe */ _components_DefaultSidebar__WEBPACK_IMPORTED_MODULE_33__.DefaultSidebar),\n/* harmony export */ \"Excalidraw\": () => (/* binding */ Excalidraw),\n/* harmony export */ \"FONT_FAMILY\": () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_10__.FONT_FAMILY),\n/* harmony export */ \"Footer\": () => (/* reexport safe */ _components_footer_FooterCenter__WEBPACK_IMPORTED_MODULE_12__[\"default\"]),\n/* harmony export */ \"LiveCollaborationTrigger\": () => (/* reexport safe */ _components_live_collaboration_LiveCollaborationTrigger__WEBPACK_IMPORTED_MODULE_15__[\"default\"]),\n/* harmony export */ \"MIME_TYPES\": () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_10__.MIME_TYPES),\n/* harmony export */ \"MainMenu\": () => (/* reexport safe */ _components_main_menu_MainMenu__WEBPACK_IMPORTED_MODULE_13__[\"default\"]),\n/* harmony export */ \"ROUNDNESS\": () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_10__.ROUNDNESS),\n/* harmony export */ \"Sidebar\": () => (/* reexport safe */ _components_Sidebar_Sidebar__WEBPACK_IMPORTED_MODULE_31__.Sidebar),\n/* harmony export */ \"StoreAction\": () => (/* reexport safe */ _store__WEBPACK_IMPORTED_MODULE_29__.StoreAction),\n/* harmony export */ \"THEME\": () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_10__.THEME),\n/* harmony export */ \"TTDDialog\": () => (/* reexport safe */ _components_TTDDialog_TTDDialog__WEBPACK_IMPORTED_MODULE_34__.TTDDialog),\n/* harmony export */ \"TTDDialogTrigger\": () => (/* reexport safe */ _components_TTDDialog_TTDDialogTrigger__WEBPACK_IMPORTED_MODULE_35__.TTDDialogTrigger),\n/* harmony export */ \"WelcomeScreen\": () => (/* reexport safe */ _components_welcome_screen_WelcomeScreen__WEBPACK_IMPORTED_MODULE_14__[\"default\"]),\n/* harmony export */ \"bumpVersion\": () => (/* reexport safe */ _element_mutateElement__WEBPACK_IMPORTED_MODULE_28__.bumpVersion),\n/* harmony export */ \"convertToExcalidrawElements\": () => (/* reexport safe */ _data_transform__WEBPACK_IMPORTED_MODULE_38__.convertToExcalidrawElements),\n/* harmony export */ \"defaultLang\": () => (/* reexport safe */ _i18n__WEBPACK_IMPORTED_MODULE_9__.defaultLang),\n/* harmony export */ \"determineFocusDistance\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.determineFocusDistance),\n/* harmony export */ \"elementPartiallyOverlapsWithOrContainsBBox\": () => (/* reexport safe */ _utils_withinBounds__WEBPACK_IMPORTED_MODULE_40__.elementPartiallyOverlapsWithOrContainsBBox),\n/* harmony export */ \"elementsOverlappingBBox\": () => (/* reexport safe */ _utils_withinBounds__WEBPACK_IMPORTED_MODULE_40__.elementsOverlappingBBox),\n/* harmony export */ \"exportToBlob\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.exportToBlob),\n/* harmony export */ \"exportToCanvas\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.exportToCanvas),\n/* harmony export */ \"exportToClipboard\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.exportToClipboard),\n/* harmony export */ \"exportToSvg\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.exportToSvg),\n/* harmony export */ \"getBoundTextMaxWidth\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.getBoundTextMaxWidth),\n/* harmony export */ \"getCommonBoundingBox\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.getCommonBoundingBox),\n/* harmony export */ \"getCommonBounds\": () => (/* reexport safe */ _element_bounds__WEBPACK_IMPORTED_MODULE_39__.getCommonBounds),\n/* harmony export */ \"getContainerElement\": () => (/* reexport safe */ _element_textElement__WEBPACK_IMPORTED_MODULE_22__.getContainerElement),\n/* harmony export */ \"getDefaultLineHeight\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.getDefaultLineHeight),\n/* harmony export */ \"getEmbedLink\": () => (/* reexport safe */ _element_embeddable__WEBPACK_IMPORTED_MODULE_30__.getEmbedLink),\n/* harmony export */ \"getFontString\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.getFontString),\n/* harmony export */ \"getFreeDrawSvgPath\": () => (/* reexport safe */ _renderer_renderElement__WEBPACK_IMPORTED_MODULE_25__.getFreeDrawSvgPath),\n/* harmony export */ \"getLibraryItemsHash\": () => (/* reexport safe */ _data_library__WEBPACK_IMPORTED_MODULE_26__.getLibraryItemsHash),\n/* harmony export */ \"getMaximumGroups\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.getMaximumGroups),\n/* harmony export */ \"getNonDeletedElements\": () => (/* reexport safe */ _element__WEBPACK_IMPORTED_MODULE_17__.getNonDeletedElements),\n/* harmony export */ \"getSceneVersion\": () => (/* reexport safe */ _element__WEBPACK_IMPORTED_MODULE_17__.getSceneVersion),\n/* harmony export */ \"getVisibleSceneBounds\": () => (/* reexport safe */ _element_bounds__WEBPACK_IMPORTED_MODULE_39__.getVisibleSceneBounds),\n/* harmony export */ \"hashElementsVersion\": () => (/* reexport safe */ _element__WEBPACK_IMPORTED_MODULE_17__.hashElementsVersion),\n/* harmony export */ \"hashString\": () => (/* reexport safe */ _element__WEBPACK_IMPORTED_MODULE_17__.hashString),\n/* harmony export */ \"intersectElementWithLine\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.intersectElementWithLine),\n/* harmony export */ \"isElementInsideBBox\": () => (/* reexport safe */ _utils_withinBounds__WEBPACK_IMPORTED_MODULE_40__.isElementInsideBBox),\n/* harmony export */ \"isInvisiblySmallElement\": () => (/* reexport safe */ _element__WEBPACK_IMPORTED_MODULE_17__.isInvisiblySmallElement),\n/* harmony export */ \"isLinearElement\": () => (/* reexport safe */ _element_typeChecks__WEBPACK_IMPORTED_MODULE_27__.isLinearElement),\n/* harmony export */ \"languages\": () => (/* reexport safe */ _i18n__WEBPACK_IMPORTED_MODULE_9__.languages),\n/* harmony export */ \"loadFromBlob\": () => (/* reexport safe */ _data_blob__WEBPACK_IMPORTED_MODULE_24__.loadFromBlob),\n/* harmony export */ \"loadLibraryFromBlob\": () => (/* reexport safe */ _data_blob__WEBPACK_IMPORTED_MODULE_24__.loadLibraryFromBlob),\n/* harmony export */ \"loadSceneOrLibraryFromBlob\": () => (/* reexport safe */ _data_blob__WEBPACK_IMPORTED_MODULE_24__.loadSceneOrLibraryFromBlob),\n/* harmony export */ \"measureText\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.measureText),\n/* harmony export */ \"mergeLibraryItems\": () => (/* reexport safe */ _data_library__WEBPACK_IMPORTED_MODULE_26__.mergeLibraryItems),\n/* harmony export */ \"mermaidToExcalidraw\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.mermaidToExcalidraw),\n/* harmony export */ \"mutateElement\": () => (/* reexport safe */ _element_mutateElement__WEBPACK_IMPORTED_MODULE_28__.mutateElement),\n/* harmony export */ \"newElementWith\": () => (/* reexport safe */ _element_mutateElement__WEBPACK_IMPORTED_MODULE_28__.newElementWith),\n/* harmony export */ \"normalizeLink\": () => (/* reexport safe */ _data_url__WEBPACK_IMPORTED_MODULE_36__.normalizeLink),\n/* harmony export */ \"parseLibraryTokensFromUrl\": () => (/* reexport safe */ _data_library__WEBPACK_IMPORTED_MODULE_26__.parseLibraryTokensFromUrl),\n/* harmony export */ \"reconcileElements\": () => (/* reexport safe */ _data_reconcile__WEBPACK_IMPORTED_MODULE_19__.reconcileElements),\n/* harmony export */ \"refreshTextDimensions\": () => (/* reexport safe */ _element_newElement__WEBPACK_IMPORTED_MODULE_21__.refreshTextDimensions),\n/* harmony export */ \"restore\": () => (/* reexport safe */ _data_restore__WEBPACK_IMPORTED_MODULE_18__.restore),\n/* harmony export */ \"restoreAppState\": () => (/* reexport safe */ _data_restore__WEBPACK_IMPORTED_MODULE_18__.restoreAppState),\n/* harmony export */ \"restoreElements\": () => (/* reexport safe */ _data_restore__WEBPACK_IMPORTED_MODULE_18__.restoreElements),\n/* harmony export */ \"restoreLibraryItems\": () => (/* reexport safe */ _data_restore__WEBPACK_IMPORTED_MODULE_18__.restoreLibraryItems),\n/* harmony export */ \"sceneCoordsToViewportCoords\": () => (/* reexport safe */ _utils__WEBPACK_IMPORTED_MODULE_4__.sceneCoordsToViewportCoords),\n/* harmony export */ \"serializeAsJSON\": () => (/* reexport safe */ _data_json__WEBPACK_IMPORTED_MODULE_23__.serializeAsJSON),\n/* harmony export */ \"serializeLibraryAsJSON\": () => (/* reexport safe */ _data_json__WEBPACK_IMPORTED_MODULE_23__.serializeLibraryAsJSON),\n/* harmony export */ \"useDevice\": () => (/* reexport safe */ _components_App__WEBPACK_IMPORTED_MODULE_3__.useDevice),\n/* harmony export */ \"useHandleLibrary\": () => (/* reexport safe */ _data_library__WEBPACK_IMPORTED_MODULE_26__.useHandleLibrary),\n/* harmony export */ \"useI18n\": () => (/* reexport safe */ _i18n__WEBPACK_IMPORTED_MODULE_9__.useI18n),\n/* harmony export */ \"viewportCoordsToSceneCoords\": () => (/* reexport safe */ _utils__WEBPACK_IMPORTED_MODULE_4__.viewportCoordsToSceneCoords),\n/* harmony export */ \"wrapText\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.wrapText),\n/* harmony export */ \"zoomToFitBounds\": () => (/* reexport safe */ _actions_actionCanvas__WEBPACK_IMPORTED_MODULE_37__.zoomToFitBounds)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _components_InitializeApp__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./components/InitializeApp */ \"./components/InitializeApp.tsx\");\n/* harmony import */ var _components_App__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./components/App */ \"./components/App.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./utils */ \"./utils.ts\");\n/* harmony import */ var _css_app_scss__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./css/app.scss */ \"./css/app.scss\");\n/* harmony import */ var _css_styles_scss__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./css/styles.scss */ \"./css/styles.scss\");\n/* harmony import */ var _public_fonts_fonts_css__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../public/fonts/fonts.css */ \"../../public/fonts/fonts.css\");\n/* harmony import */ var _polyfill__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./polyfill */ \"./polyfill.ts\");\n/* harmony import */ var _i18n__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./i18n */ \"./i18n.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./constants */ \"./constants.ts\");\n/* harmony import */ var jotai__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! jotai */ \"../../node_modules/jotai/esm/index.mjs\");\n/* harmony import */ var _jotai__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./jotai */ \"./jotai.ts\");\n/* harmony import */ var _components_footer_FooterCenter__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./components/footer/FooterCenter */ \"./components/footer/FooterCenter.tsx\");\n/* harmony import */ var _components_main_menu_MainMenu__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./components/main-menu/MainMenu */ \"./components/main-menu/MainMenu.tsx\");\n/* harmony import */ var _components_welcome_screen_WelcomeScreen__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./components/welcome-screen/WelcomeScreen */ \"./components/welcome-screen/WelcomeScreen.tsx\");\n/* harmony import */ var _components_live_collaboration_LiveCollaborationTrigger__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./components/live-collaboration/LiveCollaborationTrigger */ \"./components/live-collaboration/LiveCollaborationTrigger.tsx\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./element */ \"./element/index.ts\");\n/* harmony import */ var _data_restore__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./data/restore */ \"./data/restore.ts\");\n/* harmony import */ var _data_reconcile__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./data/reconcile */ \"./data/reconcile.ts\");\n/* harmony import */ var _utils_export__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../utils/export */ \"../utils/export.ts\");\n/* harmony import */ var _element_newElement__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ./element/newElement */ \"./element/newElement.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _data_json__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./data/json */ \"./data/json.ts\");\n/* harmony import */ var _data_blob__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ./data/blob */ \"./data/blob.ts\");\n/* harmony import */ var _renderer_renderElement__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ./renderer/renderElement */ \"./renderer/renderElement.ts\");\n/* harmony import */ var _data_library__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ./data/library */ \"./data/library.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ./element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! ./element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! ./store */ \"./store.ts\");\n/* harmony import */ var _element_embeddable__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! ./element/embeddable */ \"./element/embeddable.ts\");\n/* harmony import */ var _components_Sidebar_Sidebar__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! ./components/Sidebar/Sidebar */ \"./components/Sidebar/Sidebar.tsx\");\n/* harmony import */ var _components_Button__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! ./components/Button */ \"./components/Button.tsx\");\n/* harmony import */ var _components_DefaultSidebar__WEBPACK_IMPORTED_MODULE_33__ = __webpack_require__(/*! ./components/DefaultSidebar */ \"./components/DefaultSidebar.tsx\");\n/* harmony import */ var _components_TTDDialog_TTDDialog__WEBPACK_IMPORTED_MODULE_34__ = __webpack_require__(/*! ./components/TTDDialog/TTDDialog */ \"./components/TTDDialog/TTDDialog.tsx\");\n/* harmony import */ var _components_TTDDialog_TTDDialogTrigger__WEBPACK_IMPORTED_MODULE_35__ = __webpack_require__(/*! ./components/TTDDialog/TTDDialogTrigger */ \"./components/TTDDialog/TTDDialogTrigger.tsx\");\n/* harmony import */ var _data_url__WEBPACK_IMPORTED_MODULE_36__ = __webpack_require__(/*! ./data/url */ \"./data/url.ts\");\n/* harmony import */ var _actions_actionCanvas__WEBPACK_IMPORTED_MODULE_37__ = __webpack_require__(/*! ./actions/actionCanvas */ \"./actions/actionCanvas.tsx\");\n/* harmony import */ var _data_transform__WEBPACK_IMPORTED_MODULE_38__ = __webpack_require__(/*! ./data/transform */ \"./data/transform.ts\");\n/* harmony import */ var _element_bounds__WEBPACK_IMPORTED_MODULE_39__ = __webpack_require__(/*! ./element/bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _utils_withinBounds__WEBPACK_IMPORTED_MODULE_40__ = __webpack_require__(/*! ../utils/withinBounds */ \"../utils/withinBounds.ts\");\nvar __rest = undefined && undefined.__rest || function (s, e) {\n var t = {};\n\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];\n\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\n if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];\n }\n return t;\n};\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n(0,_polyfill__WEBPACK_IMPORTED_MODULE_8__[\"default\"])();\n\nconst ExcalidrawBase = props => {\n var _a, _b, _c, _d, _e, _f;\n\n const {\n onChange,\n initialData,\n excalidrawAPI,\n isCollaborating = false,\n onPointerUpdate,\n renderTopRightUI,\n langCode = _i18n__WEBPACK_IMPORTED_MODULE_9__.defaultLang.code,\n viewModeEnabled,\n zenModeEnabled,\n gridModeEnabled,\n initState,\n //zsviczian\n libraryReturnUrl,\n theme,\n name,\n renderCustomStats,\n onPaste,\n onDrop,\n //zsviczian\n detectScroll = true,\n handleKeyboardGlobally = false,\n onLibraryChange,\n autoFocus = false,\n onBeforeTextEdit,\n //zsviczian\n onBeforeTextSubmit,\n //zsviczian\n generateIdForFile,\n onThemeChange,\n //zsviczian\n onLinkOpen,\n onLinkHover,\n //zsviczian\n onViewModeChange,\n //zsviczian\n onPointerDown,\n onPointerUp,\n onScrollChange,\n children,\n validateEmbeddable,\n renderEmbeddable,\n renderWebview,\n //zsviczian\n renderEmbeddableMenu,\n //zsviczian\n renderMermaid,\n //zsviczian\n onContextMenu,\n //zsviczian\n aiEnabled,\n obsidianHostPlugin\n } = props;\n const canvasActions = (_a = props.UIOptions) === null || _a === void 0 ? void 0 : _a.canvasActions; // FIXME normalize/set defaults in parent component so that the memo resolver\n // compares the same values\n\n const UIOptions = Object.assign(Object.assign({}, props.UIOptions), {\n canvasActions: Object.assign(Object.assign({}, _constants__WEBPACK_IMPORTED_MODULE_10__.DEFAULT_UI_OPTIONS.canvasActions), canvasActions),\n tools: {\n image: (_d = (_c = (_b = props.UIOptions) === null || _b === void 0 ? void 0 : _b.tools) === null || _c === void 0 ? void 0 : _c.image) !== null && _d !== void 0 ? _d : true\n }\n });\n\n if (canvasActions === null || canvasActions === void 0 ? void 0 : canvasActions.export) {\n UIOptions.canvasActions.export.saveFileToDisk = (_f = (_e = canvasActions.export) === null || _e === void 0 ? void 0 : _e.saveFileToDisk) !== null && _f !== void 0 ? _f : _constants__WEBPACK_IMPORTED_MODULE_10__.DEFAULT_UI_OPTIONS.canvasActions[\"export\"].saveFileToDisk;\n }\n\n if (UIOptions.canvasActions.toggleTheme === null && typeof theme === \"undefined\") {\n UIOptions.canvasActions.toggleTheme = true;\n }\n\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {\n const importPolyfill = async () => {\n //@ts-ignore\n await Promise.resolve(/*! import() */).then(__webpack_require__.t.bind(__webpack_require__, /*! canvas-roundrect-polyfill */ \"../../node_modules/canvas-roundrect-polyfill/roundRect.js\", 23));\n };\n\n importPolyfill(); // Block pinch-zooming on iOS outside of the content area\n\n const handleTouchMove = event => {\n // @ts-ignore\n if (typeof event.scale === \"number\" && event.scale !== 1) {\n event.preventDefault();\n }\n };\n\n document.addEventListener(\"touchmove\", handleTouchMove, {\n passive: false\n });\n return () => {\n document.removeEventListener(\"touchmove\", handleTouchMove);\n };\n }, []);\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(jotai__WEBPACK_IMPORTED_MODULE_16__.Provider, Object.assign({\n unstable_createStore: () => _jotai__WEBPACK_IMPORTED_MODULE_11__.jotaiStore,\n scope: _jotai__WEBPACK_IMPORTED_MODULE_11__.jotaiScope\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_InitializeApp__WEBPACK_IMPORTED_MODULE_2__.InitializeApp, Object.assign({\n langCode: langCode,\n theme: theme\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_App__WEBPACK_IMPORTED_MODULE_3__[\"default\"], Object.assign({\n onChange: onChange,\n initialData: initialData,\n excalidrawAPI: excalidrawAPI,\n isCollaborating: isCollaborating,\n onPointerUpdate: onPointerUpdate,\n renderTopRightUI: renderTopRightUI,\n langCode: langCode,\n viewModeEnabled: viewModeEnabled,\n zenModeEnabled: zenModeEnabled,\n gridModeEnabled: gridModeEnabled,\n initState: initState,\n libraryReturnUrl: libraryReturnUrl,\n theme: theme,\n name: name,\n renderCustomStats: renderCustomStats,\n UIOptions: UIOptions,\n onPaste: onPaste,\n onDrop: onDrop,\n detectScroll: detectScroll,\n handleKeyboardGlobally: handleKeyboardGlobally,\n onLibraryChange: onLibraryChange,\n autoFocus: autoFocus,\n onBeforeTextEdit: onBeforeTextEdit,\n onBeforeTextSubmit: onBeforeTextSubmit,\n generateIdForFile: generateIdForFile,\n onThemeChange: onThemeChange,\n onLinkOpen: onLinkOpen,\n onLinkHover: onLinkHover,\n onViewModeChange: onViewModeChange,\n onPointerDown: onPointerDown,\n onPointerUp: onPointerUp,\n onScrollChange: onScrollChange,\n validateEmbeddable: validateEmbeddable,\n renderEmbeddable: renderEmbeddable,\n renderWebview: renderWebview,\n renderEmbeddableMenu: renderEmbeddableMenu,\n renderMermaid: renderMermaid,\n onContextMenu: onContextMenu,\n aiEnabled: aiEnabled !== false,\n obsidianHostPlugin: obsidianHostPlugin\n }, {\n children: children\n }))\n }))\n }));\n};\n\nconst areEqual = (prevProps, nextProps) => {\n // short-circuit early\n if (prevProps.children !== nextProps.children) {\n return false;\n }\n\n const {\n initialData: prevInitialData,\n UIOptions: prevUIOptions = {}\n } = prevProps,\n prev = __rest(prevProps, [\"initialData\", \"UIOptions\"]);\n\n const {\n initialData: nextInitialData,\n UIOptions: nextUIOptions = {}\n } = nextProps,\n next = __rest(nextProps, [\"initialData\", \"UIOptions\"]); // comparing UIOptions\n\n\n const prevUIOptionsKeys = Object.keys(prevUIOptions);\n const nextUIOptionsKeys = Object.keys(nextUIOptions);\n\n if (prevUIOptionsKeys.length !== nextUIOptionsKeys.length) {\n return false;\n }\n\n const isUIOptionsSame = prevUIOptionsKeys.every(key => {\n if (key === \"canvasActions\") {\n const canvasOptionKeys = Object.keys(prevUIOptions.canvasActions);\n return canvasOptionKeys.every(key => {\n var _a, _b, _c, _d;\n\n if (key === \"export\" && ((_a = prevUIOptions === null || prevUIOptions === void 0 ? void 0 : prevUIOptions.canvasActions) === null || _a === void 0 ? void 0 : _a.export) && ((_b = nextUIOptions === null || nextUIOptions === void 0 ? void 0 : nextUIOptions.canvasActions) === null || _b === void 0 ? void 0 : _b.export)) {\n return prevUIOptions.canvasActions.export.saveFileToDisk === nextUIOptions.canvasActions.export.saveFileToDisk;\n }\n\n return ((_c = prevUIOptions === null || prevUIOptions === void 0 ? void 0 : prevUIOptions.canvasActions) === null || _c === void 0 ? void 0 : _c[key]) === ((_d = nextUIOptions === null || nextUIOptions === void 0 ? void 0 : nextUIOptions.canvasActions) === null || _d === void 0 ? void 0 : _d[key]);\n });\n }\n\n return prevUIOptions[key] === nextUIOptions[key];\n });\n return isUIOptionsSame && (0,_utils__WEBPACK_IMPORTED_MODULE_4__.isShallowEqual)(prev, next);\n};\n\nconst Excalidraw = react__WEBPACK_IMPORTED_MODULE_1___default().memo(ExcalidrawBase, areEqual);\nExcalidraw.displayName = \"Excalidraw\";\n\n\n\n\n\n //zsviczian\n\n //zsviczian\n\n\n\n\n\n\n\n\n\n\n\n //zsviczian - not sure if I use it any more\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n//# sourceURL=webpack://ExcalidrawLib/./index.tsx?");
3117
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"Button\": () => (/* reexport safe */ _components_Button__WEBPACK_IMPORTED_MODULE_32__.Button),\n/* harmony export */ \"DEFAULT_LASER_COLOR\": () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_10__.DEFAULT_LASER_COLOR),\n/* harmony export */ \"DefaultSidebar\": () => (/* reexport safe */ _components_DefaultSidebar__WEBPACK_IMPORTED_MODULE_33__.DefaultSidebar),\n/* harmony export */ \"Excalidraw\": () => (/* binding */ Excalidraw),\n/* harmony export */ \"FONT_FAMILY\": () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_10__.FONT_FAMILY),\n/* harmony export */ \"Footer\": () => (/* reexport safe */ _components_footer_FooterCenter__WEBPACK_IMPORTED_MODULE_12__[\"default\"]),\n/* harmony export */ \"LiveCollaborationTrigger\": () => (/* reexport safe */ _components_live_collaboration_LiveCollaborationTrigger__WEBPACK_IMPORTED_MODULE_15__[\"default\"]),\n/* harmony export */ \"MIME_TYPES\": () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_10__.MIME_TYPES),\n/* harmony export */ \"MainMenu\": () => (/* reexport safe */ _components_main_menu_MainMenu__WEBPACK_IMPORTED_MODULE_13__[\"default\"]),\n/* harmony export */ \"ROUNDNESS\": () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_10__.ROUNDNESS),\n/* harmony export */ \"Sidebar\": () => (/* reexport safe */ _components_Sidebar_Sidebar__WEBPACK_IMPORTED_MODULE_31__.Sidebar),\n/* harmony export */ \"StoreAction\": () => (/* reexport safe */ _store__WEBPACK_IMPORTED_MODULE_29__.StoreAction),\n/* harmony export */ \"THEME\": () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_10__.THEME),\n/* harmony export */ \"TTDDialog\": () => (/* reexport safe */ _components_TTDDialog_TTDDialog__WEBPACK_IMPORTED_MODULE_34__.TTDDialog),\n/* harmony export */ \"TTDDialogTrigger\": () => (/* reexport safe */ _components_TTDDialog_TTDDialogTrigger__WEBPACK_IMPORTED_MODULE_35__.TTDDialogTrigger),\n/* harmony export */ \"WelcomeScreen\": () => (/* reexport safe */ _components_welcome_screen_WelcomeScreen__WEBPACK_IMPORTED_MODULE_14__[\"default\"]),\n/* harmony export */ \"bumpVersion\": () => (/* reexport safe */ _element_mutateElement__WEBPACK_IMPORTED_MODULE_28__.bumpVersion),\n/* harmony export */ \"convertToExcalidrawElements\": () => (/* reexport safe */ _data_transform__WEBPACK_IMPORTED_MODULE_38__.convertToExcalidrawElements),\n/* harmony export */ \"defaultLang\": () => (/* reexport safe */ _i18n__WEBPACK_IMPORTED_MODULE_9__.defaultLang),\n/* harmony export */ \"destroyObsidianUtils\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.destroyObsidianUtils),\n/* harmony export */ \"determineFocusDistance\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.determineFocusDistance),\n/* harmony export */ \"elementPartiallyOverlapsWithOrContainsBBox\": () => (/* reexport safe */ _utils_withinBounds__WEBPACK_IMPORTED_MODULE_40__.elementPartiallyOverlapsWithOrContainsBBox),\n/* harmony export */ \"elementsOverlappingBBox\": () => (/* reexport safe */ _utils_withinBounds__WEBPACK_IMPORTED_MODULE_40__.elementsOverlappingBBox),\n/* harmony export */ \"exportToBlob\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.exportToBlob),\n/* harmony export */ \"exportToCanvas\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.exportToCanvas),\n/* harmony export */ \"exportToClipboard\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.exportToClipboard),\n/* harmony export */ \"exportToSvg\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.exportToSvg),\n/* harmony export */ \"getBoundTextMaxWidth\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.getBoundTextMaxWidth),\n/* harmony export */ \"getCommonBoundingBox\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.getCommonBoundingBox),\n/* harmony export */ \"getCommonBounds\": () => (/* reexport safe */ _element_bounds__WEBPACK_IMPORTED_MODULE_39__.getCommonBounds),\n/* harmony export */ \"getContainerElement\": () => (/* reexport safe */ _element_textElement__WEBPACK_IMPORTED_MODULE_22__.getContainerElement),\n/* harmony export */ \"getDefaultLineHeight\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.getDefaultLineHeight),\n/* harmony export */ \"getEmbedLink\": () => (/* reexport safe */ _element_embeddable__WEBPACK_IMPORTED_MODULE_30__.getEmbedLink),\n/* harmony export */ \"getFontString\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.getFontString),\n/* harmony export */ \"getFreeDrawSvgPath\": () => (/* reexport safe */ _renderer_renderElement__WEBPACK_IMPORTED_MODULE_25__.getFreeDrawSvgPath),\n/* harmony export */ \"getLibraryItemsHash\": () => (/* reexport safe */ _data_library__WEBPACK_IMPORTED_MODULE_26__.getLibraryItemsHash),\n/* harmony export */ \"getMaximumGroups\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.getMaximumGroups),\n/* harmony export */ \"getNonDeletedElements\": () => (/* reexport safe */ _element__WEBPACK_IMPORTED_MODULE_17__.getNonDeletedElements),\n/* harmony export */ \"getSceneVersion\": () => (/* reexport safe */ _element__WEBPACK_IMPORTED_MODULE_17__.getSceneVersion),\n/* harmony export */ \"getVisibleSceneBounds\": () => (/* reexport safe */ _element_bounds__WEBPACK_IMPORTED_MODULE_39__.getVisibleSceneBounds),\n/* harmony export */ \"hashElementsVersion\": () => (/* reexport safe */ _element__WEBPACK_IMPORTED_MODULE_17__.hashElementsVersion),\n/* harmony export */ \"hashString\": () => (/* reexport safe */ _element__WEBPACK_IMPORTED_MODULE_17__.hashString),\n/* harmony export */ \"intersectElementWithLine\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.intersectElementWithLine),\n/* harmony export */ \"isElementInsideBBox\": () => (/* reexport safe */ _utils_withinBounds__WEBPACK_IMPORTED_MODULE_40__.isElementInsideBBox),\n/* harmony export */ \"isInvisiblySmallElement\": () => (/* reexport safe */ _element__WEBPACK_IMPORTED_MODULE_17__.isInvisiblySmallElement),\n/* harmony export */ \"isLinearElement\": () => (/* reexport safe */ _element_typeChecks__WEBPACK_IMPORTED_MODULE_27__.isLinearElement),\n/* harmony export */ \"languages\": () => (/* reexport safe */ _i18n__WEBPACK_IMPORTED_MODULE_9__.languages),\n/* harmony export */ \"loadFromBlob\": () => (/* reexport safe */ _data_blob__WEBPACK_IMPORTED_MODULE_24__.loadFromBlob),\n/* harmony export */ \"loadLibraryFromBlob\": () => (/* reexport safe */ _data_blob__WEBPACK_IMPORTED_MODULE_24__.loadLibraryFromBlob),\n/* harmony export */ \"loadSceneOrLibraryFromBlob\": () => (/* reexport safe */ _data_blob__WEBPACK_IMPORTED_MODULE_24__.loadSceneOrLibraryFromBlob),\n/* harmony export */ \"measureText\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.measureText),\n/* harmony export */ \"mergeLibraryItems\": () => (/* reexport safe */ _data_library__WEBPACK_IMPORTED_MODULE_26__.mergeLibraryItems),\n/* harmony export */ \"mermaidToExcalidraw\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.mermaidToExcalidraw),\n/* harmony export */ \"mutateElement\": () => (/* reexport safe */ _element_mutateElement__WEBPACK_IMPORTED_MODULE_28__.mutateElement),\n/* harmony export */ \"newElementWith\": () => (/* reexport safe */ _element_mutateElement__WEBPACK_IMPORTED_MODULE_28__.newElementWith),\n/* harmony export */ \"normalizeLink\": () => (/* reexport safe */ _data_url__WEBPACK_IMPORTED_MODULE_36__.normalizeLink),\n/* harmony export */ \"parseLibraryTokensFromUrl\": () => (/* reexport safe */ _data_library__WEBPACK_IMPORTED_MODULE_26__.parseLibraryTokensFromUrl),\n/* harmony export */ \"reconcileElements\": () => (/* reexport safe */ _data_reconcile__WEBPACK_IMPORTED_MODULE_19__.reconcileElements),\n/* harmony export */ \"refreshTextDimensions\": () => (/* reexport safe */ _element_newElement__WEBPACK_IMPORTED_MODULE_21__.refreshTextDimensions),\n/* harmony export */ \"restore\": () => (/* reexport safe */ _data_restore__WEBPACK_IMPORTED_MODULE_18__.restore),\n/* harmony export */ \"restoreAppState\": () => (/* reexport safe */ _data_restore__WEBPACK_IMPORTED_MODULE_18__.restoreAppState),\n/* harmony export */ \"restoreElements\": () => (/* reexport safe */ _data_restore__WEBPACK_IMPORTED_MODULE_18__.restoreElements),\n/* harmony export */ \"restoreLibraryItems\": () => (/* reexport safe */ _data_restore__WEBPACK_IMPORTED_MODULE_18__.restoreLibraryItems),\n/* harmony export */ \"sceneCoordsToViewportCoords\": () => (/* reexport safe */ _utils__WEBPACK_IMPORTED_MODULE_4__.sceneCoordsToViewportCoords),\n/* harmony export */ \"serializeAsJSON\": () => (/* reexport safe */ _data_json__WEBPACK_IMPORTED_MODULE_23__.serializeAsJSON),\n/* harmony export */ \"serializeLibraryAsJSON\": () => (/* reexport safe */ _data_json__WEBPACK_IMPORTED_MODULE_23__.serializeLibraryAsJSON),\n/* harmony export */ \"useDevice\": () => (/* reexport safe */ _components_App__WEBPACK_IMPORTED_MODULE_3__.useDevice),\n/* harmony export */ \"useHandleLibrary\": () => (/* reexport safe */ _data_library__WEBPACK_IMPORTED_MODULE_26__.useHandleLibrary),\n/* harmony export */ \"useI18n\": () => (/* reexport safe */ _i18n__WEBPACK_IMPORTED_MODULE_9__.useI18n),\n/* harmony export */ \"viewportCoordsToSceneCoords\": () => (/* reexport safe */ _utils__WEBPACK_IMPORTED_MODULE_4__.viewportCoordsToSceneCoords),\n/* harmony export */ \"wrapText\": () => (/* reexport safe */ _utils_export__WEBPACK_IMPORTED_MODULE_20__.wrapText),\n/* harmony export */ \"zoomToFitBounds\": () => (/* reexport safe */ _actions_actionCanvas__WEBPACK_IMPORTED_MODULE_37__.zoomToFitBounds)\n/* harmony export */ });\n/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ \"../../node_modules/react/jsx-runtime.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _components_InitializeApp__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./components/InitializeApp */ \"./components/InitializeApp.tsx\");\n/* harmony import */ var _components_App__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./components/App */ \"./components/App.tsx\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./utils */ \"./utils.ts\");\n/* harmony import */ var _css_app_scss__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./css/app.scss */ \"./css/app.scss\");\n/* harmony import */ var _css_styles_scss__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./css/styles.scss */ \"./css/styles.scss\");\n/* harmony import */ var _public_fonts_fonts_css__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../public/fonts/fonts.css */ \"../../public/fonts/fonts.css\");\n/* harmony import */ var _polyfill__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./polyfill */ \"./polyfill.ts\");\n/* harmony import */ var _i18n__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./i18n */ \"./i18n.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./constants */ \"./constants.ts\");\n/* harmony import */ var jotai__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! jotai */ \"../../node_modules/jotai/esm/index.mjs\");\n/* harmony import */ var _jotai__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./jotai */ \"./jotai.ts\");\n/* harmony import */ var _components_footer_FooterCenter__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./components/footer/FooterCenter */ \"./components/footer/FooterCenter.tsx\");\n/* harmony import */ var _components_main_menu_MainMenu__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./components/main-menu/MainMenu */ \"./components/main-menu/MainMenu.tsx\");\n/* harmony import */ var _components_welcome_screen_WelcomeScreen__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./components/welcome-screen/WelcomeScreen */ \"./components/welcome-screen/WelcomeScreen.tsx\");\n/* harmony import */ var _components_live_collaboration_LiveCollaborationTrigger__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./components/live-collaboration/LiveCollaborationTrigger */ \"./components/live-collaboration/LiveCollaborationTrigger.tsx\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./element */ \"./element/index.ts\");\n/* harmony import */ var _data_restore__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./data/restore */ \"./data/restore.ts\");\n/* harmony import */ var _data_reconcile__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./data/reconcile */ \"./data/reconcile.ts\");\n/* harmony import */ var _utils_export__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../utils/export */ \"../utils/export.ts\");\n/* harmony import */ var _element_newElement__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ./element/newElement */ \"./element/newElement.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _data_json__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./data/json */ \"./data/json.ts\");\n/* harmony import */ var _data_blob__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ./data/blob */ \"./data/blob.ts\");\n/* harmony import */ var _renderer_renderElement__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ./renderer/renderElement */ \"./renderer/renderElement.ts\");\n/* harmony import */ var _data_library__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ./data/library */ \"./data/library.ts\");\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ./element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! ./element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! ./store */ \"./store.ts\");\n/* harmony import */ var _element_embeddable__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! ./element/embeddable */ \"./element/embeddable.ts\");\n/* harmony import */ var _components_Sidebar_Sidebar__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! ./components/Sidebar/Sidebar */ \"./components/Sidebar/Sidebar.tsx\");\n/* harmony import */ var _components_Button__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! ./components/Button */ \"./components/Button.tsx\");\n/* harmony import */ var _components_DefaultSidebar__WEBPACK_IMPORTED_MODULE_33__ = __webpack_require__(/*! ./components/DefaultSidebar */ \"./components/DefaultSidebar.tsx\");\n/* harmony import */ var _components_TTDDialog_TTDDialog__WEBPACK_IMPORTED_MODULE_34__ = __webpack_require__(/*! ./components/TTDDialog/TTDDialog */ \"./components/TTDDialog/TTDDialog.tsx\");\n/* harmony import */ var _components_TTDDialog_TTDDialogTrigger__WEBPACK_IMPORTED_MODULE_35__ = __webpack_require__(/*! ./components/TTDDialog/TTDDialogTrigger */ \"./components/TTDDialog/TTDDialogTrigger.tsx\");\n/* harmony import */ var _data_url__WEBPACK_IMPORTED_MODULE_36__ = __webpack_require__(/*! ./data/url */ \"./data/url.ts\");\n/* harmony import */ var _actions_actionCanvas__WEBPACK_IMPORTED_MODULE_37__ = __webpack_require__(/*! ./actions/actionCanvas */ \"./actions/actionCanvas.tsx\");\n/* harmony import */ var _data_transform__WEBPACK_IMPORTED_MODULE_38__ = __webpack_require__(/*! ./data/transform */ \"./data/transform.ts\");\n/* harmony import */ var _element_bounds__WEBPACK_IMPORTED_MODULE_39__ = __webpack_require__(/*! ./element/bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _utils_withinBounds__WEBPACK_IMPORTED_MODULE_40__ = __webpack_require__(/*! ../utils/withinBounds */ \"../utils/withinBounds.ts\");\nvar __rest = undefined && undefined.__rest || function (s, e) {\n var t = {};\n\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];\n\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\n if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];\n }\n return t;\n};\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n(0,_polyfill__WEBPACK_IMPORTED_MODULE_8__[\"default\"])();\n\nconst ExcalidrawBase = props => {\n var _a, _b, _c, _d, _e, _f;\n\n const {\n onChange,\n initialData,\n excalidrawAPI,\n isCollaborating = false,\n onPointerUpdate,\n renderTopRightUI,\n langCode = _i18n__WEBPACK_IMPORTED_MODULE_9__.defaultLang.code,\n viewModeEnabled,\n zenModeEnabled,\n gridModeEnabled,\n initState,\n //zsviczian\n libraryReturnUrl,\n theme,\n name,\n renderCustomStats,\n onPaste,\n onDrop,\n //zsviczian\n detectScroll = true,\n handleKeyboardGlobally = false,\n onLibraryChange,\n autoFocus = false,\n onBeforeTextEdit,\n //zsviczian\n onBeforeTextSubmit,\n //zsviczian\n generateIdForFile,\n onThemeChange,\n //zsviczian\n onLinkOpen,\n onLinkHover,\n //zsviczian\n onViewModeChange,\n //zsviczian\n onPointerDown,\n onPointerUp,\n onScrollChange,\n children,\n validateEmbeddable,\n renderEmbeddable,\n renderWebview,\n //zsviczian\n renderEmbeddableMenu,\n //zsviczian\n renderMermaid,\n //zsviczian\n onContextMenu,\n //zsviczian\n aiEnabled,\n obsidianHostPlugin\n } = props;\n const canvasActions = (_a = props.UIOptions) === null || _a === void 0 ? void 0 : _a.canvasActions; // FIXME normalize/set defaults in parent component so that the memo resolver\n // compares the same values\n\n const UIOptions = Object.assign(Object.assign({}, props.UIOptions), {\n canvasActions: Object.assign(Object.assign({}, _constants__WEBPACK_IMPORTED_MODULE_10__.DEFAULT_UI_OPTIONS.canvasActions), canvasActions),\n tools: {\n image: (_d = (_c = (_b = props.UIOptions) === null || _b === void 0 ? void 0 : _b.tools) === null || _c === void 0 ? void 0 : _c.image) !== null && _d !== void 0 ? _d : true\n }\n });\n\n if (canvasActions === null || canvasActions === void 0 ? void 0 : canvasActions.export) {\n UIOptions.canvasActions.export.saveFileToDisk = (_f = (_e = canvasActions.export) === null || _e === void 0 ? void 0 : _e.saveFileToDisk) !== null && _f !== void 0 ? _f : _constants__WEBPACK_IMPORTED_MODULE_10__.DEFAULT_UI_OPTIONS.canvasActions[\"export\"].saveFileToDisk;\n }\n\n if (UIOptions.canvasActions.toggleTheme === null && typeof theme === \"undefined\") {\n UIOptions.canvasActions.toggleTheme = true;\n }\n\n (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {\n const importPolyfill = async () => {\n //@ts-ignore\n await Promise.resolve(/*! import() */).then(__webpack_require__.t.bind(__webpack_require__, /*! canvas-roundrect-polyfill */ \"../../node_modules/canvas-roundrect-polyfill/roundRect.js\", 23));\n };\n\n importPolyfill(); // Block pinch-zooming on iOS outside of the content area\n\n const handleTouchMove = event => {\n // @ts-ignore\n if (typeof event.scale === \"number\" && event.scale !== 1) {\n event.preventDefault();\n }\n };\n\n document.addEventListener(\"touchmove\", handleTouchMove, {\n passive: false\n });\n return () => {\n document.removeEventListener(\"touchmove\", handleTouchMove);\n };\n }, []);\n return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(jotai__WEBPACK_IMPORTED_MODULE_16__.Provider, Object.assign({\n unstable_createStore: () => _jotai__WEBPACK_IMPORTED_MODULE_11__.jotaiStore,\n scope: _jotai__WEBPACK_IMPORTED_MODULE_11__.jotaiScope\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_InitializeApp__WEBPACK_IMPORTED_MODULE_2__.InitializeApp, Object.assign({\n langCode: langCode,\n theme: theme\n }, {\n children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_App__WEBPACK_IMPORTED_MODULE_3__[\"default\"], Object.assign({\n onChange: onChange,\n initialData: initialData,\n excalidrawAPI: excalidrawAPI,\n isCollaborating: isCollaborating,\n onPointerUpdate: onPointerUpdate,\n renderTopRightUI: renderTopRightUI,\n langCode: langCode,\n viewModeEnabled: viewModeEnabled,\n zenModeEnabled: zenModeEnabled,\n gridModeEnabled: gridModeEnabled,\n initState: initState,\n libraryReturnUrl: libraryReturnUrl,\n theme: theme,\n name: name,\n renderCustomStats: renderCustomStats,\n UIOptions: UIOptions,\n onPaste: onPaste,\n onDrop: onDrop,\n detectScroll: detectScroll,\n handleKeyboardGlobally: handleKeyboardGlobally,\n onLibraryChange: onLibraryChange,\n autoFocus: autoFocus,\n onBeforeTextEdit: onBeforeTextEdit,\n onBeforeTextSubmit: onBeforeTextSubmit,\n generateIdForFile: generateIdForFile,\n onThemeChange: onThemeChange,\n onLinkOpen: onLinkOpen,\n onLinkHover: onLinkHover,\n onViewModeChange: onViewModeChange,\n onPointerDown: onPointerDown,\n onPointerUp: onPointerUp,\n onScrollChange: onScrollChange,\n validateEmbeddable: validateEmbeddable,\n renderEmbeddable: renderEmbeddable,\n renderWebview: renderWebview,\n renderEmbeddableMenu: renderEmbeddableMenu,\n renderMermaid: renderMermaid,\n onContextMenu: onContextMenu,\n aiEnabled: aiEnabled !== false,\n obsidianHostPlugin: obsidianHostPlugin\n }, {\n children: children\n }))\n }))\n }));\n};\n\nconst areEqual = (prevProps, nextProps) => {\n // short-circuit early\n if (prevProps.children !== nextProps.children) {\n return false;\n }\n\n const {\n initialData: prevInitialData,\n UIOptions: prevUIOptions = {}\n } = prevProps,\n prev = __rest(prevProps, [\"initialData\", \"UIOptions\"]);\n\n const {\n initialData: nextInitialData,\n UIOptions: nextUIOptions = {}\n } = nextProps,\n next = __rest(nextProps, [\"initialData\", \"UIOptions\"]); // comparing UIOptions\n\n\n const prevUIOptionsKeys = Object.keys(prevUIOptions);\n const nextUIOptionsKeys = Object.keys(nextUIOptions);\n\n if (prevUIOptionsKeys.length !== nextUIOptionsKeys.length) {\n return false;\n }\n\n const isUIOptionsSame = prevUIOptionsKeys.every(key => {\n if (key === \"canvasActions\") {\n const canvasOptionKeys = Object.keys(prevUIOptions.canvasActions);\n return canvasOptionKeys.every(key => {\n var _a, _b, _c, _d;\n\n if (key === \"export\" && ((_a = prevUIOptions === null || prevUIOptions === void 0 ? void 0 : prevUIOptions.canvasActions) === null || _a === void 0 ? void 0 : _a.export) && ((_b = nextUIOptions === null || nextUIOptions === void 0 ? void 0 : nextUIOptions.canvasActions) === null || _b === void 0 ? void 0 : _b.export)) {\n return prevUIOptions.canvasActions.export.saveFileToDisk === nextUIOptions.canvasActions.export.saveFileToDisk;\n }\n\n return ((_c = prevUIOptions === null || prevUIOptions === void 0 ? void 0 : prevUIOptions.canvasActions) === null || _c === void 0 ? void 0 : _c[key]) === ((_d = nextUIOptions === null || nextUIOptions === void 0 ? void 0 : nextUIOptions.canvasActions) === null || _d === void 0 ? void 0 : _d[key]);\n });\n }\n\n return prevUIOptions[key] === nextUIOptions[key];\n });\n return isUIOptionsSame && (0,_utils__WEBPACK_IMPORTED_MODULE_4__.isShallowEqual)(prev, next);\n};\n\nconst Excalidraw = react__WEBPACK_IMPORTED_MODULE_1___default().memo(ExcalidrawBase, areEqual);\nExcalidraw.displayName = \"Excalidraw\";\n\n\n\n\n\n //zsviczian\n\n //zsviczian\n\n\n\n\n\n\n\n\n\n\n\n //zsviczian - not sure if I use it any more\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n//# sourceURL=webpack://ExcalidrawLib/./index.tsx?");
3118
3118
 
3119
3119
  /***/ }),
3120
3120
 
@@ -3180,7 +3180,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
3180
3180
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
3181
3181
 
3182
3182
  "use strict";
3183
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"getAreaLimit\": () => (/* binding */ getAreaLimit),\n/* harmony export */ \"getExcalidrawContentEl\": () => (/* binding */ getExcalidrawContentEl),\n/* harmony export */ \"getWidthHeightLimit\": () => (/* binding */ getWidthHeightLimit),\n/* harmony export */ \"hideFreedrawPenmodeCursor\": () => (/* binding */ hideFreedrawPenmodeCursor),\n/* harmony export */ \"isExcaliBrainView\": () => (/* binding */ isExcaliBrainView)\n/* harmony export */ });\n//zsviczian, my dirty little secrets. These are hacks I am not proud of...\nlet OBSIDIAN_PLUGIN;\nlet EXCALIDRAW_CONFIG;\n\nconst setObsidianPlugin = () => {\n var _a, _b; //@ts-ignore\n\n\n OBSIDIAN_PLUGIN = (_b = (_a = app === null || app === void 0 ? void 0 : app.plugins) === null || _a === void 0 ? void 0 : _a.plugins) === null || _b === void 0 ? void 0 : _b[\"obsidian-excalidraw-plugin\"];\n EXCALIDRAW_CONFIG = OBSIDIAN_PLUGIN === null || OBSIDIAN_PLUGIN === void 0 ? void 0 : OBSIDIAN_PLUGIN.excalidrawConfig;\n};\n\nconst getAreaLimit = () => {\n var _a;\n\n if (!OBSIDIAN_PLUGIN) {\n setObsidianPlugin();\n }\n\n return (_a = EXCALIDRAW_CONFIG === null || EXCALIDRAW_CONFIG === void 0 ? void 0 : EXCALIDRAW_CONFIG.areaLimit) !== null && _a !== void 0 ? _a : 16777216;\n};\nconst getWidthHeightLimit = () => {\n var _a;\n\n if (!OBSIDIAN_PLUGIN) {\n setObsidianPlugin();\n }\n\n return (_a = EXCALIDRAW_CONFIG === null || EXCALIDRAW_CONFIG === void 0 ? void 0 : EXCALIDRAW_CONFIG.widthHeightLimit) !== null && _a !== void 0 ? _a : 32767;\n};\nconst isExcaliBrainView = () => {\n if (!OBSIDIAN_PLUGIN) {\n setObsidianPlugin();\n }\n\n const excalidrawView = OBSIDIAN_PLUGIN === null || OBSIDIAN_PLUGIN === void 0 ? void 0 : OBSIDIAN_PLUGIN.activeExcalidrawView;\n if (!excalidrawView) return false;\n return excalidrawView.linksAlwaysOpenInANewPane && excalidrawView.allowFrameButtonsInViewMode;\n};\nconst getExcalidrawContentEl = () => {\n if (!OBSIDIAN_PLUGIN) {\n setObsidianPlugin();\n }\n\n const excalidrawView = OBSIDIAN_PLUGIN === null || OBSIDIAN_PLUGIN === void 0 ? void 0 : OBSIDIAN_PLUGIN.activeExcalidrawView;\n if (!excalidrawView) return document.body;\n return excalidrawView.contentEl;\n};\nconst hideFreedrawPenmodeCursor = () => {\n if (!OBSIDIAN_PLUGIN) {\n setObsidianPlugin();\n }\n\n if (!OBSIDIAN_PLUGIN) return true;\n return !OBSIDIAN_PLUGIN.settings.penModeCrosshairVisible;\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./obsidianUtils.ts?");
3183
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"destroyObsidianUtils\": () => (/* binding */ destroyObsidianUtils),\n/* harmony export */ \"getAreaLimit\": () => (/* binding */ getAreaLimit),\n/* harmony export */ \"getExcalidrawContentEl\": () => (/* binding */ getExcalidrawContentEl),\n/* harmony export */ \"getWidthHeightLimit\": () => (/* binding */ getWidthHeightLimit),\n/* harmony export */ \"hideFreedrawPenmodeCursor\": () => (/* binding */ hideFreedrawPenmodeCursor),\n/* harmony export */ \"hostPlugin\": () => (/* binding */ hostPlugin),\n/* harmony export */ \"initializeObsidianUtils\": () => (/* binding */ initializeObsidianUtils),\n/* harmony export */ \"isExcaliBrainView\": () => (/* binding */ isExcaliBrainView)\n/* harmony export */ });\n//zsviczian, my dirty little secrets. These are hacks I am not proud of...\nlet hostPlugin = null;\nfunction destroyObsidianUtils() {\n hostPlugin = null;\n}\nfunction initializeObsidianUtils(obsidianPlugin) {\n hostPlugin = obsidianPlugin;\n}\nfunction getAreaLimit() {\n var _a;\n\n return (_a = hostPlugin.excalidrawConfig.areaLimit) !== null && _a !== void 0 ? _a : 16777216;\n}\nfunction getWidthHeightLimit() {\n var _a;\n\n return (_a = hostPlugin.excalidrawConfig.widthHeightLimit) !== null && _a !== void 0 ? _a : 32767;\n}\nfunction isExcaliBrainView() {\n const excalidrawView = hostPlugin.activeExcalidrawView;\n if (!excalidrawView) return false;\n return excalidrawView.linksAlwaysOpenInANewPane && excalidrawView.allowFrameButtonsInViewMode;\n}\nfunction getExcalidrawContentEl() {\n const excalidrawView = hostPlugin.activeExcalidrawView;\n if (!excalidrawView) return document.body;\n return excalidrawView.contentEl;\n}\nfunction hideFreedrawPenmodeCursor() {\n return !hostPlugin.settings.penModeCrosshairVisible;\n}\n\n//# sourceURL=webpack://ExcalidrawLib/./obsidianUtils.ts?");
3184
3184
 
3185
3185
  /***/ }),
3186
3186
 
@@ -3213,7 +3213,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
3213
3213
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
3214
3214
 
3215
3215
  "use strict";
3216
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./constants */ \"./constants.ts\");\n\n\nif (\"development\" !== _constants__WEBPACK_IMPORTED_MODULE_0__.ENV.TEST) {\n /* eslint-disable */\n\n /* global __webpack_public_path__:writable */\n __webpack_require__.p = window.EXCALIDRAW_ASSET_PATH || `https://unpkg.com/${\"@zsviczian/excalidraw\"}@${\"0.17.1-obsidian-28\"}/dist/`;\n}\n\n//# sourceURL=webpack://ExcalidrawLib/./publicPath.js?");
3216
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./constants */ \"./constants.ts\");\n\n\nif (\"development\" !== _constants__WEBPACK_IMPORTED_MODULE_0__.ENV.TEST) {\n /* eslint-disable */\n\n /* global __webpack_public_path__:writable */\n __webpack_require__.p = window.EXCALIDRAW_ASSET_PATH || `https://unpkg.com/${\"@zsviczian/excalidraw\"}@${\"0.17.1-obsidian-29\"}/dist/`;\n}\n\n//# sourceURL=webpack://ExcalidrawLib/./publicPath.js?");
3217
3217
 
3218
3218
  /***/ }),
3219
3219
 
@@ -3290,7 +3290,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
3290
3290
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
3291
3291
 
3292
3292
  "use strict";
3293
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"DEFAULT_LINK_SIZE\": () => (/* binding */ DEFAULT_LINK_SIZE),\n/* harmony export */ \"IMAGE_INVERT_FILTER\": () => (/* binding */ IMAGE_INVERT_FILTER),\n/* harmony export */ \"elementWithCanvasCache\": () => (/* binding */ elementWithCanvasCache),\n/* harmony export */ \"generateFreeDrawShape\": () => (/* binding */ generateFreeDrawShape),\n/* harmony export */ \"getFreeDrawPath2D\": () => (/* binding */ getFreeDrawPath2D),\n/* harmony export */ \"getFreeDrawSvgPath\": () => (/* binding */ getFreeDrawSvgPath),\n/* harmony export */ \"getRenderOpacity\": () => (/* binding */ getRenderOpacity),\n/* harmony export */ \"pathsCache\": () => (/* binding */ pathsCache),\n/* harmony export */ \"renderElement\": () => (/* binding */ renderElement),\n/* harmony export */ \"renderSelectionElement\": () => (/* binding */ renderSelectionElement)\n/* harmony export */ });\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _element_bounds__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../element/bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../math */ \"./math.ts\");\n/* harmony import */ var roughjs_bin_rough__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! roughjs/bin/rough */ \"../../node_modules/roughjs/bin/rough.js\");\n/* harmony import */ var _appState__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../appState */ \"./appState.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../constants */ \"./constants.ts\");\n/* harmony import */ var perfect_freehand__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! perfect-freehand */ \"../../node_modules/perfect-freehand/dist/esm/index.js\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../element/linearElementEditor */ \"./element/linearElementEditor.ts\");\n/* harmony import */ var _easingFunctions__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./easingFunctions */ \"./renderer/easingFunctions.ts\");\n/* harmony import */ var _frame__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../frame */ \"./frame.ts\");\n/* harmony import */ var _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../scene/ShapeCache */ \"./scene/ShapeCache.ts\");\n/* harmony import */ var _obsidianUtils__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../obsidianUtils */ \"./obsidianUtils.ts\");\n\n\n\n\n\n\n\n\n\n\n //zsviczian\n\n\n\n // using a stronger invert (100% vs our regular 93%) and saturate\n// as a temp hack to make images in dark theme look closer to original\n// color scheme (it's still not quite there and the colors look slightly\n// desatured, alas...)\n\nconst IMAGE_INVERT_FILTER = \"invert(100%) hue-rotate(180deg) saturate(1.25)\";\nconst defaultAppState = (0,_appState__WEBPACK_IMPORTED_MODULE_5__.getDefaultAppState)();\n\nconst isPendingImageElement = (element, renderConfig) => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isInitializedImageElement)(element) && !renderConfig.imageCache.has(element.fileId);\n\nconst shouldResetImageFilter = (element, renderConfig, appState) => {\n var _a;\n\n return appState.theme === _constants__WEBPACK_IMPORTED_MODULE_6__.THEME.DARK && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isInitializedImageElement)(element) && !isPendingImageElement(element, renderConfig) && ((_a = renderConfig.imageCache.get(element.fileId)) === null || _a === void 0 ? void 0 : _a.mimeType) !== _constants__WEBPACK_IMPORTED_MODULE_6__.MIME_TYPES.svg;\n};\n\nconst getCanvasPadding = element => element.type === \"freedraw\" ? element.strokeWidth * 12 : 20;\n\nconst getRenderOpacity = (element, containingFrame, elementsPendingErasure) => {\n var _a; // multiplying frame opacity with element opacity to combine them\n // (e.g. frame 50% and element 50% opacity should result in 25% opacity)\n\n\n let opacity = ((_a = containingFrame === null || containingFrame === void 0 ? void 0 : containingFrame.opacity) !== null && _a !== void 0 ? _a : 100) * element.opacity / 10000; // if pending erasure, multiply again to combine further\n // (so that erasing always results in lower opacity than original)\n\n if (elementsPendingErasure.has(element.id) || containingFrame && elementsPendingErasure.has(containingFrame.id)) {\n opacity *= _constants__WEBPACK_IMPORTED_MODULE_6__.ELEMENT_READY_TO_ERASE_OPACITY / 100;\n }\n\n return opacity;\n};\n\nconst cappedElementCanvasSize = (element, elementsMap, zoom) => {\n // these limits are ballpark, they depend on specific browsers and device.\n // We've chosen lower limits to be safe. We might want to change these limits\n // based on browser/device type, if we get reports of low quality rendering\n // on zoom.\n //\n // ~ safari mobile canvas area limit\n const AREA_LIMIT = (0,_obsidianUtils__WEBPACK_IMPORTED_MODULE_13__.getAreaLimit)(); //zsviczian\n // ~ safari width/height limit based on developer.mozilla.org.\n\n const WIDTH_HEIGHT_LIMIT = (0,_obsidianUtils__WEBPACK_IMPORTED_MODULE_13__.getWidthHeightLimit)(); //zsviczian\n\n const padding = getCanvasPadding(element);\n const [x1, y1, x2, y2] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const elementWidth = (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isLinearElement)(element) || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isFreeDrawElement)(element) ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(x1, x2) : element.width;\n const elementHeight = (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isLinearElement)(element) || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isFreeDrawElement)(element) ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(y1, y2) : element.height;\n let width = elementWidth * window.devicePixelRatio + padding * 2;\n let height = elementHeight * window.devicePixelRatio + padding * 2;\n let scale = zoom.value; // rescale to ensure width and height is within limits\n\n if (width * scale > WIDTH_HEIGHT_LIMIT || height * scale > WIDTH_HEIGHT_LIMIT) {\n scale = Math.min(WIDTH_HEIGHT_LIMIT / width, WIDTH_HEIGHT_LIMIT / height);\n } // rescale to ensure canvas area is within limits\n\n\n if (width * height * scale * scale > AREA_LIMIT) {\n scale = Math.sqrt(AREA_LIMIT / (width * height));\n }\n\n width = Math.floor(width * scale);\n height = Math.floor(height * scale);\n return {\n width,\n height,\n scale\n };\n};\n\nconst generateElementCanvas = (element, elementsMap, zoom, renderConfig, appState) => {\n var _a, _b;\n\n const canvas = document.createElement(\"canvas\");\n const context = canvas.getContext(\"2d\");\n const padding = getCanvasPadding(element);\n const {\n width,\n height,\n scale\n } = cappedElementCanvasSize(element, elementsMap, zoom);\n canvas.width = width;\n canvas.height = height;\n let canvasOffsetX = 0;\n let canvasOffsetY = 0;\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isLinearElement)(element) || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isFreeDrawElement)(element)) {\n const [x1, y1] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n canvasOffsetX = element.x > x1 ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(element.x, x1) * window.devicePixelRatio * scale : 0;\n canvasOffsetY = element.y > y1 ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(element.y, y1) * window.devicePixelRatio * scale : 0;\n context.translate(canvasOffsetX, canvasOffsetY);\n }\n\n context.save();\n context.translate(padding * scale, padding * scale);\n context.scale(window.devicePixelRatio * scale, window.devicePixelRatio * scale);\n const rc = roughjs_bin_rough__WEBPACK_IMPORTED_MODULE_4__[\"default\"].canvas(canvas); // in dark theme, revert the image color filter\n\n if (shouldResetImageFilter(element, renderConfig, appState)) {\n context.filter = IMAGE_INVERT_FILTER;\n }\n\n drawElementOnCanvas(element, rc, context, renderConfig, appState);\n context.restore();\n return {\n element,\n canvas,\n theme: appState.theme,\n scale,\n zoomValue: zoom.value,\n canvasOffsetX,\n canvasOffsetY,\n boundTextElementVersion: ((_a = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(element, elementsMap)) === null || _a === void 0 ? void 0 : _a.version) || null,\n containingFrameOpacity: ((_b = (0,_frame__WEBPACK_IMPORTED_MODULE_11__.getContainingFrame)(element, elementsMap)) === null || _b === void 0 ? void 0 : _b.opacity) || 100\n };\n};\n\nconst DEFAULT_LINK_SIZE = 14;\nconst IMAGE_PLACEHOLDER_IMG = document.createElement(\"img\");\nIMAGE_PLACEHOLDER_IMG.src = `data:${_constants__WEBPACK_IMPORTED_MODULE_6__.MIME_TYPES.svg},${encodeURIComponent(`<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"image\" class=\"svg-inline--fa fa-image fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"#888\" d=\"M464 448H48c-26.51 0-48-21.49-48-48V112c0-26.51 21.49-48 48-48h416c26.51 0 48 21.49 48 48v288c0 26.51-21.49 48-48 48zM112 120c-30.928 0-56 25.072-56 56s25.072 56 56 56 56-25.072 56-56-25.072-56-56-56zM64 384h384V272l-87.515-87.515c-4.686-4.686-12.284-4.686-16.971 0L208 320l-55.515-55.515c-4.686-4.686-12.284-4.686-16.971 0L64 336v48z\"></path></svg>`)}`;\nconst IMAGE_ERROR_PLACEHOLDER_IMG = document.createElement(\"img\");\nIMAGE_ERROR_PLACEHOLDER_IMG.src = `data:${_constants__WEBPACK_IMPORTED_MODULE_6__.MIME_TYPES.svg},${encodeURIComponent(`<svg viewBox=\"0 0 668 668\" xmlns=\"http://www.w3.org/2000/svg\" xml:space=\"preserve\" style=\"fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2\"><path d=\"M464 448H48c-26.51 0-48-21.49-48-48V112c0-26.51 21.49-48 48-48h416c26.51 0 48 21.49 48 48v288c0 26.51-21.49 48-48 48ZM112 120c-30.928 0-56 25.072-56 56s25.072 56 56 56 56-25.072 56-56-25.072-56-56-56ZM64 384h384V272l-87.515-87.515c-4.686-4.686-12.284-4.686-16.971 0L208 320l-55.515-55.515c-4.686-4.686-12.284-4.686-16.971 0L64 336v48Z\" style=\"fill:#888;fill-rule:nonzero\" transform=\"matrix(.81709 0 0 .81709 124.825 145.825)\"/><path d=\"M256 8C119.034 8 8 119.033 8 256c0 136.967 111.034 248 248 248s248-111.034 248-248S392.967 8 256 8Zm130.108 117.892c65.448 65.448 70 165.481 20.677 235.637L150.47 105.216c70.204-49.356 170.226-44.735 235.638 20.676ZM125.892 386.108c-65.448-65.448-70-165.481-20.677-235.637L361.53 406.784c-70.203 49.356-170.226 44.736-235.638-20.676Z\" style=\"fill:#888;fill-rule:nonzero\" transform=\"matrix(.30366 0 0 .30366 506.822 60.065)\"/></svg>`)}`;\n\nconst drawImagePlaceholder = (element, context) => {\n context.fillStyle = \"#E7E7E7\";\n context.fillRect(0, 0, element.width, element.height);\n const imageMinWidthOrHeight = Math.min(element.width, element.height);\n const size = Math.min(imageMinWidthOrHeight, Math.min(imageMinWidthOrHeight * 0.4, 100));\n context.drawImage(element.status === \"error\" ? IMAGE_ERROR_PLACEHOLDER_IMG : IMAGE_PLACEHOLDER_IMG, element.width / 2 - size / 2, element.height / 2 - size / 2, size, size);\n};\n\nconst drawElementOnCanvas = (element, rc, context, renderConfig, appState) => {\n var _a, _b, _c, _d;\n\n switch (element.type) {\n case \"rectangle\":\n case \"iframe\":\n case \"embeddable\":\n case \"diamond\":\n case \"ellipse\":\n {\n context.lineJoin = \"round\";\n context.lineCap = \"round\";\n rc.draw(_scene_ShapeCache__WEBPACK_IMPORTED_MODULE_12__.ShapeCache.get(element));\n break;\n }\n\n case \"arrow\":\n case \"line\":\n {\n context.lineJoin = \"round\";\n context.lineCap = \"round\";\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_12__.ShapeCache.get(element).forEach(shape => {\n rc.draw(shape);\n });\n break;\n }\n\n case \"freedraw\":\n {\n // Draw directly to canvas\n context.save();\n context.fillStyle = element.strokeColor;\n const path = getFreeDrawPath2D(element);\n const fillShape = _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_12__.ShapeCache.get(element);\n\n if (fillShape) {\n rc.draw(fillShape);\n } //zsviczian\n\n\n if ((_b = (_a = element.customData) === null || _a === void 0 ? void 0 : _a.strokeOptions) === null || _b === void 0 ? void 0 : _b.hasOutline) {\n context.lineWidth = element.strokeWidth * ((_c = element.customData.strokeOptions.outlineWidth) !== null && _c !== void 0 ? _c : 1);\n context.strokeStyle = element.strokeColor;\n context.stroke(path);\n context.fillStyle = element.backgroundColor;\n } else {\n context.fillStyle = element.strokeColor;\n }\n\n context.fill(path);\n context.restore();\n break;\n }\n\n case \"image\":\n {\n const img = (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isInitializedImageElement)(element) ? (_d = renderConfig.imageCache.get(element.fileId)) === null || _d === void 0 ? void 0 : _d.image : undefined;\n\n if (img != null && !(img instanceof Promise)) {\n if (element.roundness && context.roundRect) {\n context.beginPath();\n context.roundRect(0, 0, element.width, element.height, (0,_math__WEBPACK_IMPORTED_MODULE_3__.getCornerRadius)(Math.min(element.width, element.height), element));\n context.clip();\n }\n\n context.drawImage(img, 0\n /* hardcoded for the selection box*/\n , 0, element.width, element.height);\n } else {\n drawImagePlaceholder(element, context);\n }\n\n break;\n }\n\n default:\n {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isTextElement)(element)) {\n const rtl = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.isRTL)(element.text);\n const shouldTemporarilyAttach = rtl && !context.canvas.isConnected;\n\n if (shouldTemporarilyAttach) {\n // to correctly render RTL text mixed with LTR, we have to append it\n // to the DOM\n document.body.appendChild(context.canvas);\n }\n\n context.canvas.setAttribute(\"dir\", rtl ? \"rtl\" : \"ltr\");\n context.save();\n context.font = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getFontString)(element);\n context.fillStyle = element.strokeColor;\n context.textAlign = element.textAlign; // Canvas does not support multiline text by default\n\n const lines = element.text.replace(/\\r\\n?/g, \"\\n\").split(\"\\n\");\n const horizontalOffset = element.textAlign === \"center\" ? element.width / 2 : element.textAlign === \"right\" ? element.width : 0;\n const lineHeightPx = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getLineHeightInPx)(element.fontSize, element.lineHeight);\n const verticalOffset = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getVerticalOffset)(element.fontFamily, element.fontSize, lineHeightPx);\n\n for (let index = 0; index < lines.length; index++) {\n context.fillText(lines[index], horizontalOffset, index * lineHeightPx + verticalOffset);\n }\n\n context.restore();\n\n if (shouldTemporarilyAttach) {\n context.canvas.remove();\n }\n } else {\n throw new Error(`Unimplemented type ${element.type}`);\n }\n }\n }\n};\n\nconst elementWithCanvasCache = new WeakMap();\n\nconst generateElementWithCanvas = (element, elementsMap, renderConfig, appState) => {\n var _a, _b;\n\n const zoom = renderConfig ? appState.zoom : defaultAppState.zoom;\n const prevElementWithCanvas = elementWithCanvasCache.get(element);\n const shouldRegenerateBecauseZoom = prevElementWithCanvas && prevElementWithCanvas.zoomValue !== zoom.value && !(appState === null || appState === void 0 ? void 0 : appState.shouldCacheIgnoreZoom);\n const boundTextElementVersion = ((_a = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(element, elementsMap)) === null || _a === void 0 ? void 0 : _a.version) || null;\n const containingFrameOpacity = ((_b = (0,_frame__WEBPACK_IMPORTED_MODULE_11__.getContainingFrame)(element, elementsMap)) === null || _b === void 0 ? void 0 : _b.opacity) || 100;\n\n if (!prevElementWithCanvas || shouldRegenerateBecauseZoom || prevElementWithCanvas.theme !== appState.theme || prevElementWithCanvas.boundTextElementVersion !== boundTextElementVersion || prevElementWithCanvas.containingFrameOpacity !== containingFrameOpacity) {\n const elementWithCanvas = generateElementCanvas(element, elementsMap, zoom, renderConfig, appState);\n elementWithCanvasCache.set(element, elementWithCanvas);\n return elementWithCanvas;\n }\n\n return prevElementWithCanvas;\n};\n\nconst drawElementFromCanvas = (elementWithCanvas, context, renderConfig, appState, allElementsMap) => {\n const element = elementWithCanvas.element;\n const padding = getCanvasPadding(element);\n const zoom = elementWithCanvas.scale;\n let [x1, y1, x2, y2] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, allElementsMap); // Free draw elements will otherwise \"shuffle\" as the min x and y change\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isFreeDrawElement)(element)) {\n x1 = Math.floor(x1);\n x2 = Math.ceil(x2);\n y1 = Math.floor(y1);\n y2 = Math.ceil(y2);\n }\n\n const cx = ((x1 + x2) / 2 + appState.scrollX) * window.devicePixelRatio;\n const cy = ((y1 + y2) / 2 + appState.scrollY) * window.devicePixelRatio;\n context.save();\n context.scale(1 / window.devicePixelRatio, 1 / window.devicePixelRatio);\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(element, allElementsMap);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isArrowElement)(element) && boundTextElement) {\n const tempCanvas = document.createElement(\"canvas\");\n const tempCanvasContext = tempCanvas.getContext(\"2d\"); // Take max dimensions of arrow canvas so that when canvas is rotated\n // the arrow doesn't get clipped\n\n const maxDim = Math.max((0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(x1, x2), (0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(y1, y2));\n tempCanvas.width = maxDim * window.devicePixelRatio * zoom + padding * elementWithCanvas.scale * 10;\n tempCanvas.height = maxDim * window.devicePixelRatio * zoom + padding * elementWithCanvas.scale * 10;\n const offsetX = (tempCanvas.width - elementWithCanvas.canvas.width) / 2;\n const offsetY = (tempCanvas.height - elementWithCanvas.canvas.height) / 2;\n tempCanvasContext.translate(tempCanvas.width / 2, tempCanvas.height / 2);\n tempCanvasContext.rotate(element.angle);\n tempCanvasContext.drawImage(elementWithCanvas.canvas, -elementWithCanvas.canvas.width / 2, -elementWithCanvas.canvas.height / 2, elementWithCanvas.canvas.width, elementWithCanvas.canvas.height);\n const [,,,, boundTextCx, boundTextCy] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(boundTextElement, allElementsMap);\n tempCanvasContext.rotate(-element.angle); // Shift the canvas to the center of the bound text element\n\n const shiftX = tempCanvas.width / 2 - (boundTextCx - x1) * window.devicePixelRatio * zoom - offsetX - padding * zoom;\n const shiftY = tempCanvas.height / 2 - (boundTextCy - y1) * window.devicePixelRatio * zoom - offsetY - padding * zoom;\n tempCanvasContext.translate(-shiftX, -shiftY); // Clear the bound text area\n\n tempCanvasContext.clearRect(-(boundTextElement.width / 2 + _constants__WEBPACK_IMPORTED_MODULE_6__.BOUND_TEXT_PADDING) * window.devicePixelRatio * zoom, -(boundTextElement.height / 2 + _constants__WEBPACK_IMPORTED_MODULE_6__.BOUND_TEXT_PADDING) * window.devicePixelRatio * zoom, (boundTextElement.width + _constants__WEBPACK_IMPORTED_MODULE_6__.BOUND_TEXT_PADDING * 2) * window.devicePixelRatio * zoom, (boundTextElement.height + _constants__WEBPACK_IMPORTED_MODULE_6__.BOUND_TEXT_PADDING * 2) * window.devicePixelRatio * zoom);\n context.translate(cx, cy);\n context.drawImage(tempCanvas, -(x2 - x1) / 2 * window.devicePixelRatio - offsetX / zoom - padding, -(y2 - y1) / 2 * window.devicePixelRatio - offsetY / zoom - padding, tempCanvas.width / zoom, tempCanvas.height / zoom);\n } else {\n // we translate context to element center so that rotation and scale\n // originates from the element center\n context.translate(cx, cy);\n context.rotate(element.angle);\n\n if (\"scale\" in elementWithCanvas.element && !isPendingImageElement(element, renderConfig) && !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isIframeLikeElement)(element) //zsviczian\n ) {\n context.scale(elementWithCanvas.element.scale[0], elementWithCanvas.element.scale[1]);\n } // revert afterwards we don't have account for it during drawing\n\n\n context.translate(-cx, -cy);\n context.drawImage(elementWithCanvas.canvas, (x1 + appState.scrollX) * window.devicePixelRatio - padding * elementWithCanvas.scale / elementWithCanvas.scale, (y1 + appState.scrollY) * window.devicePixelRatio - padding * elementWithCanvas.scale / elementWithCanvas.scale, elementWithCanvas.canvas.width / elementWithCanvas.scale, elementWithCanvas.canvas.height / elementWithCanvas.scale);\n\n if (false) {}\n }\n\n context.restore(); // Clear the nested element we appended to the DOM\n};\n\nconst renderSelectionElement = (element, context, appState, selectionColor) => {\n context.save();\n context.translate(element.x + appState.scrollX, element.y + appState.scrollY);\n context.fillStyle = \"rgba(0, 0, 200, 0.04)\"; // render from 0.5px offset to get 1px wide line\n // https://stackoverflow.com/questions/7530593/html5-canvas-and-line-width/7531540#7531540\n // TODO can be be improved by offseting to the negative when user selects\n // from right to left\n\n const offset = 0.5 / appState.zoom.value;\n context.fillRect(offset, offset, element.width, element.height);\n context.lineWidth = 1 / appState.zoom.value;\n context.strokeStyle = selectionColor;\n context.strokeRect(offset, offset, element.width, element.height);\n context.restore();\n};\nconst renderElement = (element, elementsMap, allElementsMap, rc, context, renderConfig, appState) => {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;\n\n context.globalAlpha = getRenderOpacity(element, (0,_frame__WEBPACK_IMPORTED_MODULE_11__.getContainingFrame)(element, elementsMap), renderConfig.elementsPendingErasure);\n\n switch (element.type) {\n case \"magicframe\":\n case \"frame\":\n {\n if (appState.frameRendering.enabled && appState.frameRendering.outline) {\n context.save();\n context.translate(element.x + appState.scrollX, element.y + appState.scrollY);\n context.fillStyle = (_e = (_c = (_b = (_a = element.customData) === null || _a === void 0 ? void 0 : _a.frameColor) === null || _b === void 0 ? void 0 : _b.fill) !== null && _c !== void 0 ? _c : (_d = appState === null || appState === void 0 ? void 0 : appState.frameColor) === null || _d === void 0 ? void 0 : _d.fill) !== null && _e !== void 0 ? _e : \"rgba(0, 0, 200, 0.04)\"; //zsviczian\n\n context.lineWidth = _constants__WEBPACK_IMPORTED_MODULE_6__.FRAME_STYLE.strokeWidth / appState.zoom.value;\n context.strokeStyle = (_k = (_h = (_g = (_f = element.customData) === null || _f === void 0 ? void 0 : _f.frameColor) === null || _g === void 0 ? void 0 : _g.stroke) !== null && _h !== void 0 ? _h : (_j = appState === null || appState === void 0 ? void 0 : appState.frameColor) === null || _j === void 0 ? void 0 : _j.stroke) !== null && _k !== void 0 ? _k : _constants__WEBPACK_IMPORTED_MODULE_6__.FRAME_STYLE.strokeColor; //zsviczian\n // TODO change later to only affect AI frames\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isMagicFrameElement)(element)) {\n context.strokeStyle = appState.theme === _constants__WEBPACK_IMPORTED_MODULE_6__.THEME.LIGHT ? \"#7affd7\" : \"#1d8264\";\n }\n\n if (_constants__WEBPACK_IMPORTED_MODULE_6__.FRAME_STYLE.radius && context.roundRect) {\n context.beginPath();\n context.roundRect(0, 0, element.width, element.height, _constants__WEBPACK_IMPORTED_MODULE_6__.FRAME_STYLE.radius / appState.zoom.value);\n context.stroke();\n context.closePath();\n } else {\n context.strokeRect(0, 0, element.width, element.height);\n }\n\n context.restore();\n }\n\n break;\n }\n\n case \"freedraw\":\n {\n // TODO investigate if we can do this in situ. Right now we need to call\n // beforehand because math helpers (such as getElementAbsoluteCoords)\n // rely on existing shapes\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_12__.ShapeCache.generateElementShape(element, null);\n\n if (renderConfig.isExporting) {\n const [x1, y1, x2, y2] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2 + appState.scrollX;\n const cy = (y1 + y2) / 2 + appState.scrollY;\n const shiftX = (x2 - x1) / 2 - (element.x - x1);\n const shiftY = (y2 - y1) / 2 - (element.y - y1);\n context.save();\n context.translate(cx, cy);\n context.rotate(element.angle);\n context.translate(-shiftX, -shiftY);\n drawElementOnCanvas(element, rc, context, renderConfig, appState);\n context.restore();\n } else {\n const elementWithCanvas = generateElementWithCanvas(element, elementsMap, renderConfig, appState);\n drawElementFromCanvas(elementWithCanvas, context, renderConfig, appState, allElementsMap);\n }\n\n break;\n }\n\n case \"rectangle\":\n case \"diamond\":\n case \"ellipse\":\n case \"line\":\n case \"arrow\":\n case \"image\":\n case \"text\":\n case \"iframe\":\n case \"embeddable\":\n {\n // TODO investigate if we can do this in situ. Right now we need to call\n // beforehand because math helpers (such as getElementAbsoluteCoords)\n // rely on existing shapes\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_12__.ShapeCache.generateElementShape(element, renderConfig);\n\n if (renderConfig.isExporting) {\n const [x1, y1, x2, y2] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2 + appState.scrollX;\n const cy = (y1 + y2) / 2 + appState.scrollY;\n let shiftX = (x2 - x1) / 2 - (element.x - x1);\n let shiftY = (y2 - y1) / 2 - (element.y - y1);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isTextElement)(element)) {\n const container = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getContainerElement)(element, elementsMap);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isArrowElement)(container)) {\n const boundTextCoords = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_9__.LinearElementEditor.getBoundTextElementPosition(container, element, elementsMap);\n shiftX = (x2 - x1) / 2 - (boundTextCoords.x - x1);\n shiftY = (y2 - y1) / 2 - (boundTextCoords.y - y1);\n }\n }\n\n context.save();\n context.translate(cx, cy);\n\n if (shouldResetImageFilter(element, renderConfig, appState)) {\n context.filter = \"none\";\n }\n\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(element, elementsMap);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isArrowElement)(element) && boundTextElement) {\n const tempCanvas = document.createElement(\"canvas\");\n const tempCanvasContext = tempCanvas.getContext(\"2d\"); // Take max dimensions of arrow canvas so that when canvas is rotated\n // the arrow doesn't get clipped\n\n const maxDim = Math.max((0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(x1, x2), (0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(y1, y2));\n const padding = getCanvasPadding(element);\n tempCanvas.width = maxDim * appState.exportScale + padding * 10 * appState.exportScale;\n tempCanvas.height = maxDim * appState.exportScale + padding * 10 * appState.exportScale;\n tempCanvasContext.translate(tempCanvas.width / 2, tempCanvas.height / 2);\n tempCanvasContext.scale(appState.exportScale, appState.exportScale); // Shift the canvas to left most point of the arrow\n\n shiftX = element.width / 2 - (element.x - x1);\n shiftY = element.height / 2 - (element.y - y1);\n tempCanvasContext.rotate(element.angle);\n const tempRc = roughjs_bin_rough__WEBPACK_IMPORTED_MODULE_4__[\"default\"].canvas(tempCanvas);\n tempCanvasContext.translate(-shiftX, -shiftY);\n drawElementOnCanvas(element, tempRc, tempCanvasContext, renderConfig, appState);\n tempCanvasContext.translate(shiftX, shiftY);\n tempCanvasContext.rotate(-element.angle); // Shift the canvas to center of bound text\n\n const [,,,, boundTextCx, boundTextCy] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(boundTextElement, elementsMap);\n const boundTextShiftX = (x1 + x2) / 2 - boundTextCx;\n const boundTextShiftY = (y1 + y2) / 2 - boundTextCy;\n tempCanvasContext.translate(-boundTextShiftX, -boundTextShiftY); // Clear the bound text area\n\n tempCanvasContext.clearRect(-boundTextElement.width / 2, -boundTextElement.height / 2, boundTextElement.width, boundTextElement.height);\n context.scale(1 / appState.exportScale, 1 / appState.exportScale);\n context.drawImage(tempCanvas, -tempCanvas.width / 2, -tempCanvas.height / 2, tempCanvas.width, tempCanvas.height);\n } else {\n context.rotate(element.angle);\n\n if (element.type === \"image\") {\n // note: scale must be applied *after* rotating\n context.scale(element.scale[0], element.scale[1]);\n }\n\n context.translate(-shiftX, -shiftY);\n drawElementOnCanvas(element, rc, context, renderConfig, appState);\n }\n\n context.restore(); // not exporting → optimized rendering (cache & render from element\n // canvases)\n } else {\n const elementWithCanvas = generateElementWithCanvas(element, elementsMap, renderConfig, appState);\n const currentImageSmoothingStatus = context.imageSmoothingEnabled;\n\n if ( // do not disable smoothing during zoom as blurry shapes look better\n // on low resolution (while still zooming in) than sharp ones\n !(appState === null || appState === void 0 ? void 0 : appState.shouldCacheIgnoreZoom) && ( // angle is 0 -> always disable smoothing\n !element.angle || // or check if angle is a right angle in which case we can still\n // disable smoothing without adversely affecting the result\n (0,_math__WEBPACK_IMPORTED_MODULE_3__.isRightAngle)(element.angle))) {\n // Disabling smoothing makes output much sharper, especially for\n // text. Unless for non-right angles, where the aliasing is really\n // terrible on Chromium.\n //\n // Note that `context.imageSmoothingQuality=\"high\"` has almost\n // zero effect.\n //\n context.imageSmoothingEnabled = false;\n }\n\n drawElementFromCanvas(elementWithCanvas, context, renderConfig, appState, allElementsMap); // reset\n\n context.imageSmoothingEnabled = currentImageSmoothingStatus;\n }\n\n break;\n }\n\n default:\n {\n // @ts-ignore\n throw new Error(`Unimplemented type ${element.type}`);\n }\n }\n\n context.globalAlpha = 1;\n};\nconst pathsCache = new WeakMap([]);\nfunction generateFreeDrawShape(element) {\n const svgPathData = getFreeDrawSvgPath(element);\n const path = new Path2D(svgPathData);\n pathsCache.set(element, path);\n return path;\n}\nfunction getFreeDrawPath2D(element) {\n return pathsCache.get(element);\n}\nfunction getFreeDrawSvgPath(element) {\n var _a, _b, _c, _d, _e, _f, _g, _h; // If input points are empty (should they ever be?) return a dot\n\n\n const inputPoints = element.simulatePressure ? element.points : element.points.length ? element.points.map(([x, y], i) => [x, y, element.pressures[i]]) : [[0, 0, 0.5]]; // Consider changing the options for simulated pressure vs real pressure\n\n const customOptions = (_b = (_a = element.customData) === null || _a === void 0 ? void 0 : _a.strokeOptions) === null || _b === void 0 ? void 0 : _b.options; //zsviczian\n\n const options = customOptions //zsviczian\n ? Object.assign(Object.assign(Object.assign(Object.assign({}, customOptions), {\n simulatePressure: (_c = customOptions.simulatePressure) !== null && _c !== void 0 ? _c : element.simulatePressure,\n size: element.strokeWidth * 4.25,\n last: !!element.lastCommittedPoint,\n easing: (_d = _easingFunctions__WEBPACK_IMPORTED_MODULE_10__[\"default\"][customOptions.easing]) !== null && _d !== void 0 ? _d : t => t\n }), ((_e = customOptions.start) === null || _e === void 0 ? void 0 : _e.easing) ? {\n start: Object.assign(Object.assign({}, customOptions.start), {\n easing: (_f = _easingFunctions__WEBPACK_IMPORTED_MODULE_10__[\"default\"][customOptions.start.easing]) !== null && _f !== void 0 ? _f : t => t\n })\n } : {\n start: customOptions.start\n }), ((_g = customOptions.end) === null || _g === void 0 ? void 0 : _g.easing) ? {\n end: Object.assign(Object.assign({}, customOptions.end), {\n easing: (_h = _easingFunctions__WEBPACK_IMPORTED_MODULE_10__[\"default\"][customOptions.end.easing]) !== null && _h !== void 0 ? _h : t => t\n })\n } : {\n end: customOptions.end\n }) : {\n simulatePressure: element.simulatePressure,\n size: element.strokeWidth * 4.25,\n thinning: 0.6,\n smoothing: 0.5,\n streamline: 0.5,\n easing: _easingFunctions__WEBPACK_IMPORTED_MODULE_10__[\"default\"].easeOutSine,\n last: !!element.lastCommittedPoint // LastCommittedPoint is added on pointerup\n\n };\n return getSvgPathFromStroke((0,perfect_freehand__WEBPACK_IMPORTED_MODULE_7__.getStroke)(inputPoints, options));\n}\n\nfunction med(A, B) {\n return [(A[0] + B[0]) / 2, (A[1] + B[1]) / 2];\n} // Trim SVG path data so number are each two decimal points. This\n// improves SVG exports, and prevents rendering errors on points\n// with long decimals.\n\n\nconst TO_FIXED_PRECISION = /(\\s?[A-Z]?,?-?[0-9]*\\.[0-9]{0,2})(([0-9]|e|-)*)/g;\n\nfunction getSvgPathFromStroke(points) {\n if (!points.length) {\n return \"\";\n }\n\n const max = points.length - 1;\n return points.reduce((acc, point, i, arr) => {\n if (i === max) {\n acc.push(point, med(point, arr[0]), \"L\", arr[0], \"Z\");\n } else {\n acc.push(point, med(point, arr[i + 1]));\n }\n\n return acc;\n }, [\"M\", points[0], \"Q\"]).join(\" \").replace(TO_FIXED_PRECISION, \"$1\");\n}\n\n//# sourceURL=webpack://ExcalidrawLib/./renderer/renderElement.ts?");
3293
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"DEFAULT_LINK_SIZE\": () => (/* binding */ DEFAULT_LINK_SIZE),\n/* harmony export */ \"IMAGE_INVERT_FILTER\": () => (/* binding */ IMAGE_INVERT_FILTER),\n/* harmony export */ \"elementWithCanvasCache\": () => (/* binding */ elementWithCanvasCache),\n/* harmony export */ \"generateFreeDrawShape\": () => (/* binding */ generateFreeDrawShape),\n/* harmony export */ \"getFreeDrawPath2D\": () => (/* binding */ getFreeDrawPath2D),\n/* harmony export */ \"getFreeDrawSvgPath\": () => (/* binding */ getFreeDrawSvgPath),\n/* harmony export */ \"getRenderOpacity\": () => (/* binding */ getRenderOpacity),\n/* harmony export */ \"pathsCache\": () => (/* binding */ pathsCache),\n/* harmony export */ \"renderElement\": () => (/* binding */ renderElement),\n/* harmony export */ \"renderSelectionElement\": () => (/* binding */ renderSelectionElement)\n/* harmony export */ });\n/* harmony import */ var _element_typeChecks__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../element/typeChecks */ \"./element/typeChecks.ts\");\n/* harmony import */ var _element_bounds__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../element/bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _math__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../math */ \"./math.ts\");\n/* harmony import */ var roughjs_bin_rough__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! roughjs/bin/rough */ \"../../node_modules/roughjs/bin/rough.js\");\n/* harmony import */ var _appState__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../appState */ \"./appState.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../constants */ \"./constants.ts\");\n/* harmony import */ var perfect_freehand__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! perfect-freehand */ \"../../node_modules/perfect-freehand/dist/esm/index.js\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../element/linearElementEditor */ \"./element/linearElementEditor.ts\");\n/* harmony import */ var _easingFunctions__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./easingFunctions */ \"./renderer/easingFunctions.ts\");\n/* harmony import */ var _frame__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../frame */ \"./frame.ts\");\n/* harmony import */ var _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../scene/ShapeCache */ \"./scene/ShapeCache.ts\");\n/* harmony import */ var _obsidianUtils__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../obsidianUtils */ \"./obsidianUtils.ts\");\n\n\n\n\n\n\n\n\n\n\n //zsviczian\n\n\n\n // using a stronger invert (100% vs our regular 93%) and saturate\n// as a temp hack to make images in dark theme look closer to original\n// color scheme (it's still not quite there and the colors look slightly\n// desatured, alas...)\n\nconst IMAGE_INVERT_FILTER = \"invert(100%) hue-rotate(180deg) saturate(1.25)\";\nconst defaultAppState = (0,_appState__WEBPACK_IMPORTED_MODULE_5__.getDefaultAppState)();\n\nconst isPendingImageElement = (element, renderConfig) => (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isInitializedImageElement)(element) && !renderConfig.imageCache.has(element.fileId);\n\nconst shouldResetImageFilter = (element, renderConfig, appState) => {\n var _a;\n\n return appState.theme === _constants__WEBPACK_IMPORTED_MODULE_6__.THEME.DARK && (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isInitializedImageElement)(element) && !isPendingImageElement(element, renderConfig) && ((_a = renderConfig.imageCache.get(element.fileId)) === null || _a === void 0 ? void 0 : _a.mimeType) !== _constants__WEBPACK_IMPORTED_MODULE_6__.MIME_TYPES.svg;\n};\n\nconst getCanvasPadding = element => element.type === \"freedraw\" ? element.strokeWidth * 12 : 200;\n\nconst getRenderOpacity = (element, containingFrame, elementsPendingErasure) => {\n var _a; // multiplying frame opacity with element opacity to combine them\n // (e.g. frame 50% and element 50% opacity should result in 25% opacity)\n\n\n let opacity = ((_a = containingFrame === null || containingFrame === void 0 ? void 0 : containingFrame.opacity) !== null && _a !== void 0 ? _a : 100) * element.opacity / 10000; // if pending erasure, multiply again to combine further\n // (so that erasing always results in lower opacity than original)\n\n if (elementsPendingErasure.has(element.id) || containingFrame && elementsPendingErasure.has(containingFrame.id)) {\n opacity *= _constants__WEBPACK_IMPORTED_MODULE_6__.ELEMENT_READY_TO_ERASE_OPACITY / 100;\n }\n\n return opacity;\n};\n\nconst cappedElementCanvasSize = (element, elementsMap, zoom) => {\n // these limits are ballpark, they depend on specific browsers and device.\n // We've chosen lower limits to be safe. We might want to change these limits\n // based on browser/device type, if we get reports of low quality rendering\n // on zoom.\n //\n // ~ safari mobile canvas area limit\n const AREA_LIMIT = (0,_obsidianUtils__WEBPACK_IMPORTED_MODULE_13__.getAreaLimit)(); //zsviczian\n // ~ safari width/height limit based on developer.mozilla.org.\n\n const WIDTH_HEIGHT_LIMIT = (0,_obsidianUtils__WEBPACK_IMPORTED_MODULE_13__.getWidthHeightLimit)(); //zsviczian\n\n const padding = getCanvasPadding(element);\n const [x1, y1, x2, y2] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const elementWidth = (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isLinearElement)(element) || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isFreeDrawElement)(element) ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(x1, x2) : element.width;\n const elementHeight = (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isLinearElement)(element) || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isFreeDrawElement)(element) ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(y1, y2) : element.height;\n let width = elementWidth * window.devicePixelRatio + padding * 2;\n let height = elementHeight * window.devicePixelRatio + padding * 2;\n let scale = zoom.value; // rescale to ensure width and height is within limits\n\n if (width * scale > WIDTH_HEIGHT_LIMIT || height * scale > WIDTH_HEIGHT_LIMIT) {\n scale = Math.min(WIDTH_HEIGHT_LIMIT / width, WIDTH_HEIGHT_LIMIT / height);\n } // rescale to ensure canvas area is within limits\n\n\n if (width * height * scale * scale > AREA_LIMIT) {\n scale = Math.sqrt(AREA_LIMIT / (width * height));\n }\n\n width = Math.floor(width * scale);\n height = Math.floor(height * scale);\n return {\n width,\n height,\n scale\n };\n};\n\nconst generateElementCanvas = (element, elementsMap, zoom, renderConfig, appState) => {\n var _a, _b;\n\n const canvas = document.createElement(\"canvas\");\n const context = canvas.getContext(\"2d\");\n const padding = getCanvasPadding(element);\n const {\n width,\n height,\n scale\n } = cappedElementCanvasSize(element, elementsMap, zoom);\n canvas.width = width;\n canvas.height = height;\n let canvasOffsetX = 0;\n let canvasOffsetY = 0;\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isLinearElement)(element) || (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isFreeDrawElement)(element)) {\n const [x1, y1] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n canvasOffsetX = element.x > x1 ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(element.x, x1) * window.devicePixelRatio * scale : 0;\n canvasOffsetY = element.y > y1 ? (0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(element.y, y1) * window.devicePixelRatio * scale : 0;\n context.translate(canvasOffsetX, canvasOffsetY);\n }\n\n context.save();\n context.translate(padding * scale, padding * scale);\n context.scale(window.devicePixelRatio * scale, window.devicePixelRatio * scale);\n const rc = roughjs_bin_rough__WEBPACK_IMPORTED_MODULE_4__[\"default\"].canvas(canvas); // in dark theme, revert the image color filter\n\n if (shouldResetImageFilter(element, renderConfig, appState)) {\n context.filter = IMAGE_INVERT_FILTER;\n }\n\n drawElementOnCanvas(element, rc, context, renderConfig, appState);\n context.restore();\n return {\n element,\n canvas,\n theme: appState.theme,\n scale,\n zoomValue: zoom.value,\n canvasOffsetX,\n canvasOffsetY,\n boundTextElementVersion: ((_a = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(element, elementsMap)) === null || _a === void 0 ? void 0 : _a.version) || null,\n containingFrameOpacity: ((_b = (0,_frame__WEBPACK_IMPORTED_MODULE_11__.getContainingFrame)(element, elementsMap)) === null || _b === void 0 ? void 0 : _b.opacity) || 100\n };\n};\n\nconst DEFAULT_LINK_SIZE = 14;\nconst IMAGE_PLACEHOLDER_IMG = document.createElement(\"img\");\nIMAGE_PLACEHOLDER_IMG.src = `data:${_constants__WEBPACK_IMPORTED_MODULE_6__.MIME_TYPES.svg},${encodeURIComponent(`<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"image\" class=\"svg-inline--fa fa-image fa-w-16\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path fill=\"#888\" d=\"M464 448H48c-26.51 0-48-21.49-48-48V112c0-26.51 21.49-48 48-48h416c26.51 0 48 21.49 48 48v288c0 26.51-21.49 48-48 48zM112 120c-30.928 0-56 25.072-56 56s25.072 56 56 56 56-25.072 56-56-25.072-56-56-56zM64 384h384V272l-87.515-87.515c-4.686-4.686-12.284-4.686-16.971 0L208 320l-55.515-55.515c-4.686-4.686-12.284-4.686-16.971 0L64 336v48z\"></path></svg>`)}`;\nconst IMAGE_ERROR_PLACEHOLDER_IMG = document.createElement(\"img\");\nIMAGE_ERROR_PLACEHOLDER_IMG.src = `data:${_constants__WEBPACK_IMPORTED_MODULE_6__.MIME_TYPES.svg},${encodeURIComponent(`<svg viewBox=\"0 0 668 668\" xmlns=\"http://www.w3.org/2000/svg\" xml:space=\"preserve\" style=\"fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2\"><path d=\"M464 448H48c-26.51 0-48-21.49-48-48V112c0-26.51 21.49-48 48-48h416c26.51 0 48 21.49 48 48v288c0 26.51-21.49 48-48 48ZM112 120c-30.928 0-56 25.072-56 56s25.072 56 56 56 56-25.072 56-56-25.072-56-56-56ZM64 384h384V272l-87.515-87.515c-4.686-4.686-12.284-4.686-16.971 0L208 320l-55.515-55.515c-4.686-4.686-12.284-4.686-16.971 0L64 336v48Z\" style=\"fill:#888;fill-rule:nonzero\" transform=\"matrix(.81709 0 0 .81709 124.825 145.825)\"/><path d=\"M256 8C119.034 8 8 119.033 8 256c0 136.967 111.034 248 248 248s248-111.034 248-248S392.967 8 256 8Zm130.108 117.892c65.448 65.448 70 165.481 20.677 235.637L150.47 105.216c70.204-49.356 170.226-44.735 235.638 20.676ZM125.892 386.108c-65.448-65.448-70-165.481-20.677-235.637L361.53 406.784c-70.203 49.356-170.226 44.736-235.638-20.676Z\" style=\"fill:#888;fill-rule:nonzero\" transform=\"matrix(.30366 0 0 .30366 506.822 60.065)\"/></svg>`)}`;\n\nconst drawImagePlaceholder = (element, context) => {\n context.fillStyle = \"#E7E7E7\";\n context.fillRect(0, 0, element.width, element.height);\n const imageMinWidthOrHeight = Math.min(element.width, element.height);\n const size = Math.min(imageMinWidthOrHeight, Math.min(imageMinWidthOrHeight * 0.4, 100));\n context.drawImage(element.status === \"error\" ? IMAGE_ERROR_PLACEHOLDER_IMG : IMAGE_PLACEHOLDER_IMG, element.width / 2 - size / 2, element.height / 2 - size / 2, size, size);\n};\n\nconst drawElementOnCanvas = (element, rc, context, renderConfig, appState) => {\n var _a, _b, _c, _d;\n\n switch (element.type) {\n case \"rectangle\":\n case \"iframe\":\n case \"embeddable\":\n case \"diamond\":\n case \"ellipse\":\n {\n context.lineJoin = \"round\";\n context.lineCap = \"round\";\n rc.draw(_scene_ShapeCache__WEBPACK_IMPORTED_MODULE_12__.ShapeCache.get(element));\n break;\n }\n\n case \"arrow\":\n case \"line\":\n {\n context.lineJoin = \"round\";\n context.lineCap = \"round\";\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_12__.ShapeCache.get(element).forEach(shape => {\n rc.draw(shape);\n });\n break;\n }\n\n case \"freedraw\":\n {\n // Draw directly to canvas\n context.save();\n context.fillStyle = element.strokeColor;\n const path = getFreeDrawPath2D(element);\n const fillShape = _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_12__.ShapeCache.get(element);\n\n if (fillShape) {\n rc.draw(fillShape);\n } //zsviczian\n\n\n if ((_b = (_a = element.customData) === null || _a === void 0 ? void 0 : _a.strokeOptions) === null || _b === void 0 ? void 0 : _b.hasOutline) {\n context.lineWidth = element.strokeWidth * ((_c = element.customData.strokeOptions.outlineWidth) !== null && _c !== void 0 ? _c : 1);\n context.strokeStyle = element.strokeColor;\n context.stroke(path);\n context.fillStyle = element.backgroundColor;\n } else {\n context.fillStyle = element.strokeColor;\n }\n\n context.fill(path);\n context.restore();\n break;\n }\n\n case \"image\":\n {\n const img = (0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isInitializedImageElement)(element) ? (_d = renderConfig.imageCache.get(element.fileId)) === null || _d === void 0 ? void 0 : _d.image : undefined;\n\n if (img != null && !(img instanceof Promise)) {\n if (element.roundness && context.roundRect) {\n context.beginPath();\n context.roundRect(0, 0, element.width, element.height, (0,_math__WEBPACK_IMPORTED_MODULE_3__.getCornerRadius)(Math.min(element.width, element.height), element));\n context.clip();\n }\n\n context.drawImage(img, 0\n /* hardcoded for the selection box*/\n , 0, element.width, element.height);\n } else {\n drawImagePlaceholder(element, context);\n }\n\n break;\n }\n\n default:\n {\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isTextElement)(element)) {\n const rtl = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.isRTL)(element.text);\n const shouldTemporarilyAttach = rtl && !context.canvas.isConnected;\n\n if (shouldTemporarilyAttach) {\n // to correctly render RTL text mixed with LTR, we have to append it\n // to the DOM\n document.body.appendChild(context.canvas);\n }\n\n context.canvas.setAttribute(\"dir\", rtl ? \"rtl\" : \"ltr\");\n context.save();\n context.font = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getFontString)(element);\n context.fillStyle = element.strokeColor;\n context.textAlign = element.textAlign; // Canvas does not support multiline text by default\n\n const lines = element.text.replace(/\\r\\n?/g, \"\\n\").split(\"\\n\");\n const horizontalOffset = element.textAlign === \"center\" ? element.width / 2 : element.textAlign === \"right\" ? element.width : 0;\n const lineHeightPx = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getLineHeightInPx)(element.fontSize, element.lineHeight);\n const verticalOffset = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getVerticalOffset)(element.fontFamily, element.fontSize, lineHeightPx);\n\n for (let index = 0; index < lines.length; index++) {\n context.fillText(lines[index], horizontalOffset, index * lineHeightPx + verticalOffset);\n }\n\n context.restore();\n\n if (shouldTemporarilyAttach) {\n context.canvas.remove();\n }\n } else {\n throw new Error(`Unimplemented type ${element.type}`);\n }\n }\n }\n};\n\nconst elementWithCanvasCache = new WeakMap();\n\nconst generateElementWithCanvas = (element, elementsMap, renderConfig, appState) => {\n var _a, _b;\n\n const zoom = renderConfig ? appState.zoom : defaultAppState.zoom;\n const prevElementWithCanvas = elementWithCanvasCache.get(element);\n const shouldRegenerateBecauseZoom = prevElementWithCanvas && prevElementWithCanvas.zoomValue !== zoom.value && !(appState === null || appState === void 0 ? void 0 : appState.shouldCacheIgnoreZoom);\n const boundTextElementVersion = ((_a = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(element, elementsMap)) === null || _a === void 0 ? void 0 : _a.version) || null;\n const containingFrameOpacity = ((_b = (0,_frame__WEBPACK_IMPORTED_MODULE_11__.getContainingFrame)(element, elementsMap)) === null || _b === void 0 ? void 0 : _b.opacity) || 100;\n\n if (!prevElementWithCanvas || shouldRegenerateBecauseZoom || prevElementWithCanvas.theme !== appState.theme || prevElementWithCanvas.boundTextElementVersion !== boundTextElementVersion || prevElementWithCanvas.containingFrameOpacity !== containingFrameOpacity) {\n const elementWithCanvas = generateElementCanvas(element, elementsMap, zoom, renderConfig, appState);\n elementWithCanvasCache.set(element, elementWithCanvas);\n return elementWithCanvas;\n }\n\n return prevElementWithCanvas;\n};\n\nconst drawElementFromCanvas = (elementWithCanvas, context, renderConfig, appState, allElementsMap) => {\n const element = elementWithCanvas.element;\n const padding = getCanvasPadding(element);\n const zoom = elementWithCanvas.scale;\n let [x1, y1, x2, y2] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, allElementsMap); // Free draw elements will otherwise \"shuffle\" as the min x and y change\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isFreeDrawElement)(element)) {\n x1 = Math.floor(x1);\n x2 = Math.ceil(x2);\n y1 = Math.floor(y1);\n y2 = Math.ceil(y2);\n }\n\n const cx = ((x1 + x2) / 2 + appState.scrollX) * window.devicePixelRatio;\n const cy = ((y1 + y2) / 2 + appState.scrollY) * window.devicePixelRatio;\n context.save();\n context.scale(1 / window.devicePixelRatio, 1 / window.devicePixelRatio);\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(element, allElementsMap);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isArrowElement)(element) && boundTextElement) {\n const tempCanvas = document.createElement(\"canvas\");\n const tempCanvasContext = tempCanvas.getContext(\"2d\"); // Take max dimensions of arrow canvas so that when canvas is rotated\n // the arrow doesn't get clipped\n\n const maxDim = Math.max((0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(x1, x2), (0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(y1, y2));\n tempCanvas.width = maxDim * window.devicePixelRatio * zoom + padding * elementWithCanvas.scale * 10;\n tempCanvas.height = maxDim * window.devicePixelRatio * zoom + padding * elementWithCanvas.scale * 10;\n const offsetX = (tempCanvas.width - elementWithCanvas.canvas.width) / 2;\n const offsetY = (tempCanvas.height - elementWithCanvas.canvas.height) / 2;\n tempCanvasContext.translate(tempCanvas.width / 2, tempCanvas.height / 2);\n tempCanvasContext.rotate(element.angle);\n tempCanvasContext.drawImage(elementWithCanvas.canvas, -elementWithCanvas.canvas.width / 2, -elementWithCanvas.canvas.height / 2, elementWithCanvas.canvas.width, elementWithCanvas.canvas.height);\n const [,,,, boundTextCx, boundTextCy] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(boundTextElement, allElementsMap);\n tempCanvasContext.rotate(-element.angle); // Shift the canvas to the center of the bound text element\n\n const shiftX = tempCanvas.width / 2 - (boundTextCx - x1) * window.devicePixelRatio * zoom - offsetX - padding * zoom;\n const shiftY = tempCanvas.height / 2 - (boundTextCy - y1) * window.devicePixelRatio * zoom - offsetY - padding * zoom;\n tempCanvasContext.translate(-shiftX, -shiftY); // Clear the bound text area\n\n tempCanvasContext.clearRect(-(boundTextElement.width / 2 + _constants__WEBPACK_IMPORTED_MODULE_6__.BOUND_TEXT_PADDING) * window.devicePixelRatio * zoom, -(boundTextElement.height / 2 + _constants__WEBPACK_IMPORTED_MODULE_6__.BOUND_TEXT_PADDING) * window.devicePixelRatio * zoom, (boundTextElement.width + _constants__WEBPACK_IMPORTED_MODULE_6__.BOUND_TEXT_PADDING * 2) * window.devicePixelRatio * zoom, (boundTextElement.height + _constants__WEBPACK_IMPORTED_MODULE_6__.BOUND_TEXT_PADDING * 2) * window.devicePixelRatio * zoom);\n context.translate(cx, cy);\n context.drawImage(tempCanvas, -(x2 - x1) / 2 * window.devicePixelRatio - offsetX / zoom - padding, -(y2 - y1) / 2 * window.devicePixelRatio - offsetY / zoom - padding, tempCanvas.width / zoom, tempCanvas.height / zoom);\n } else {\n // we translate context to element center so that rotation and scale\n // originates from the element center\n context.translate(cx, cy);\n context.rotate(element.angle);\n\n if (\"scale\" in elementWithCanvas.element && !isPendingImageElement(element, renderConfig) && !(0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isIframeLikeElement)(element) //zsviczian\n ) {\n context.scale(elementWithCanvas.element.scale[0], elementWithCanvas.element.scale[1]);\n } // revert afterwards we don't have account for it during drawing\n\n\n context.translate(-cx, -cy);\n context.drawImage(elementWithCanvas.canvas, (x1 + appState.scrollX) * window.devicePixelRatio - padding * elementWithCanvas.scale / elementWithCanvas.scale, (y1 + appState.scrollY) * window.devicePixelRatio - padding * elementWithCanvas.scale / elementWithCanvas.scale, elementWithCanvas.canvas.width / elementWithCanvas.scale, elementWithCanvas.canvas.height / elementWithCanvas.scale);\n\n if (false) {}\n }\n\n context.restore(); // Clear the nested element we appended to the DOM\n};\n\nconst renderSelectionElement = (element, context, appState, selectionColor) => {\n context.save();\n context.translate(element.x + appState.scrollX, element.y + appState.scrollY);\n context.fillStyle = \"rgba(0, 0, 200, 0.04)\"; // render from 0.5px offset to get 1px wide line\n // https://stackoverflow.com/questions/7530593/html5-canvas-and-line-width/7531540#7531540\n // TODO can be be improved by offseting to the negative when user selects\n // from right to left\n\n const offset = 0.5 / appState.zoom.value;\n context.fillRect(offset, offset, element.width, element.height);\n context.lineWidth = 1 / appState.zoom.value;\n context.strokeStyle = selectionColor;\n context.strokeRect(offset, offset, element.width, element.height);\n context.restore();\n};\nconst renderElement = (element, elementsMap, allElementsMap, rc, context, renderConfig, appState) => {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;\n\n context.globalAlpha = getRenderOpacity(element, (0,_frame__WEBPACK_IMPORTED_MODULE_11__.getContainingFrame)(element, elementsMap), renderConfig.elementsPendingErasure);\n\n switch (element.type) {\n case \"magicframe\":\n case \"frame\":\n {\n if (appState.frameRendering.enabled && appState.frameRendering.outline) {\n context.save();\n context.translate(element.x + appState.scrollX, element.y + appState.scrollY);\n context.fillStyle = (_e = (_c = (_b = (_a = element.customData) === null || _a === void 0 ? void 0 : _a.frameColor) === null || _b === void 0 ? void 0 : _b.fill) !== null && _c !== void 0 ? _c : (_d = appState === null || appState === void 0 ? void 0 : appState.frameColor) === null || _d === void 0 ? void 0 : _d.fill) !== null && _e !== void 0 ? _e : \"rgba(0, 0, 200, 0.04)\"; //zsviczian\n\n context.lineWidth = _constants__WEBPACK_IMPORTED_MODULE_6__.FRAME_STYLE.strokeWidth / appState.zoom.value;\n context.strokeStyle = (_k = (_h = (_g = (_f = element.customData) === null || _f === void 0 ? void 0 : _f.frameColor) === null || _g === void 0 ? void 0 : _g.stroke) !== null && _h !== void 0 ? _h : (_j = appState === null || appState === void 0 ? void 0 : appState.frameColor) === null || _j === void 0 ? void 0 : _j.stroke) !== null && _k !== void 0 ? _k : _constants__WEBPACK_IMPORTED_MODULE_6__.FRAME_STYLE.strokeColor; //zsviczian\n // TODO change later to only affect AI frames\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isMagicFrameElement)(element)) {\n context.strokeStyle = appState.theme === _constants__WEBPACK_IMPORTED_MODULE_6__.THEME.LIGHT ? \"#7affd7\" : \"#1d8264\";\n }\n\n if (_constants__WEBPACK_IMPORTED_MODULE_6__.FRAME_STYLE.radius && context.roundRect) {\n context.beginPath();\n context.roundRect(0, 0, element.width, element.height, _constants__WEBPACK_IMPORTED_MODULE_6__.FRAME_STYLE.radius / appState.zoom.value);\n context.stroke();\n context.closePath();\n } else {\n context.strokeRect(0, 0, element.width, element.height);\n }\n\n context.restore();\n }\n\n break;\n }\n\n case \"freedraw\":\n {\n // TODO investigate if we can do this in situ. Right now we need to call\n // beforehand because math helpers (such as getElementAbsoluteCoords)\n // rely on existing shapes\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_12__.ShapeCache.generateElementShape(element, null);\n\n if (renderConfig.isExporting) {\n const [x1, y1, x2, y2] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2 + appState.scrollX;\n const cy = (y1 + y2) / 2 + appState.scrollY;\n const shiftX = (x2 - x1) / 2 - (element.x - x1);\n const shiftY = (y2 - y1) / 2 - (element.y - y1);\n context.save();\n context.translate(cx, cy);\n context.rotate(element.angle);\n context.translate(-shiftX, -shiftY);\n drawElementOnCanvas(element, rc, context, renderConfig, appState);\n context.restore();\n } else {\n const elementWithCanvas = generateElementWithCanvas(element, elementsMap, renderConfig, appState);\n drawElementFromCanvas(elementWithCanvas, context, renderConfig, appState, allElementsMap);\n }\n\n break;\n }\n\n case \"rectangle\":\n case \"diamond\":\n case \"ellipse\":\n case \"line\":\n case \"arrow\":\n case \"image\":\n case \"text\":\n case \"iframe\":\n case \"embeddable\":\n {\n // TODO investigate if we can do this in situ. Right now we need to call\n // beforehand because math helpers (such as getElementAbsoluteCoords)\n // rely on existing shapes\n _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_12__.ShapeCache.generateElementShape(element, renderConfig);\n\n if (renderConfig.isExporting) {\n const [x1, y1, x2, y2] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(element, elementsMap);\n const cx = (x1 + x2) / 2 + appState.scrollX;\n const cy = (y1 + y2) / 2 + appState.scrollY;\n let shiftX = (x2 - x1) / 2 - (element.x - x1);\n let shiftY = (y2 - y1) / 2 - (element.y - y1);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isTextElement)(element)) {\n const container = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getContainerElement)(element, elementsMap);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isArrowElement)(container)) {\n const boundTextCoords = _element_linearElementEditor__WEBPACK_IMPORTED_MODULE_9__.LinearElementEditor.getBoundTextElementPosition(container, element, elementsMap);\n shiftX = (x2 - x1) / 2 - (boundTextCoords.x - x1);\n shiftY = (y2 - y1) / 2 - (boundTextCoords.y - y1);\n }\n }\n\n context.save();\n context.translate(cx, cy);\n\n if (shouldResetImageFilter(element, renderConfig, appState)) {\n context.filter = \"none\";\n }\n\n const boundTextElement = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_8__.getBoundTextElement)(element, elementsMap);\n\n if ((0,_element_typeChecks__WEBPACK_IMPORTED_MODULE_0__.isArrowElement)(element) && boundTextElement) {\n const tempCanvas = document.createElement(\"canvas\");\n const tempCanvasContext = tempCanvas.getContext(\"2d\"); // Take max dimensions of arrow canvas so that when canvas is rotated\n // the arrow doesn't get clipped\n\n const maxDim = Math.max((0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(x1, x2), (0,_utils__WEBPACK_IMPORTED_MODULE_2__.distance)(y1, y2));\n const padding = getCanvasPadding(element);\n tempCanvas.width = maxDim * appState.exportScale + padding * 10 * appState.exportScale;\n tempCanvas.height = maxDim * appState.exportScale + padding * 10 * appState.exportScale;\n tempCanvasContext.translate(tempCanvas.width / 2, tempCanvas.height / 2);\n tempCanvasContext.scale(appState.exportScale, appState.exportScale); // Shift the canvas to left most point of the arrow\n\n shiftX = element.width / 2 - (element.x - x1);\n shiftY = element.height / 2 - (element.y - y1);\n tempCanvasContext.rotate(element.angle);\n const tempRc = roughjs_bin_rough__WEBPACK_IMPORTED_MODULE_4__[\"default\"].canvas(tempCanvas);\n tempCanvasContext.translate(-shiftX, -shiftY);\n drawElementOnCanvas(element, tempRc, tempCanvasContext, renderConfig, appState);\n tempCanvasContext.translate(shiftX, shiftY);\n tempCanvasContext.rotate(-element.angle); // Shift the canvas to center of bound text\n\n const [,,,, boundTextCx, boundTextCy] = (0,_element_bounds__WEBPACK_IMPORTED_MODULE_1__.getElementAbsoluteCoords)(boundTextElement, elementsMap);\n const boundTextShiftX = (x1 + x2) / 2 - boundTextCx;\n const boundTextShiftY = (y1 + y2) / 2 - boundTextCy;\n tempCanvasContext.translate(-boundTextShiftX, -boundTextShiftY); // Clear the bound text area\n\n tempCanvasContext.clearRect(-boundTextElement.width / 2, -boundTextElement.height / 2, boundTextElement.width, boundTextElement.height);\n context.scale(1 / appState.exportScale, 1 / appState.exportScale);\n context.drawImage(tempCanvas, -tempCanvas.width / 2, -tempCanvas.height / 2, tempCanvas.width, tempCanvas.height);\n } else {\n context.rotate(element.angle);\n\n if (element.type === \"image\") {\n // note: scale must be applied *after* rotating\n context.scale(element.scale[0], element.scale[1]);\n }\n\n context.translate(-shiftX, -shiftY);\n drawElementOnCanvas(element, rc, context, renderConfig, appState);\n }\n\n context.restore(); // not exporting → optimized rendering (cache & render from element\n // canvases)\n } else {\n const elementWithCanvas = generateElementWithCanvas(element, elementsMap, renderConfig, appState);\n const currentImageSmoothingStatus = context.imageSmoothingEnabled;\n\n if ( // do not disable smoothing during zoom as blurry shapes look better\n // on low resolution (while still zooming in) than sharp ones\n !(appState === null || appState === void 0 ? void 0 : appState.shouldCacheIgnoreZoom) && ( // angle is 0 -> always disable smoothing\n !element.angle || // or check if angle is a right angle in which case we can still\n // disable smoothing without adversely affecting the result\n (0,_math__WEBPACK_IMPORTED_MODULE_3__.isRightAngle)(element.angle))) {\n // Disabling smoothing makes output much sharper, especially for\n // text. Unless for non-right angles, where the aliasing is really\n // terrible on Chromium.\n //\n // Note that `context.imageSmoothingQuality=\"high\"` has almost\n // zero effect.\n //\n context.imageSmoothingEnabled = false;\n }\n\n drawElementFromCanvas(elementWithCanvas, context, renderConfig, appState, allElementsMap); // reset\n\n context.imageSmoothingEnabled = currentImageSmoothingStatus;\n }\n\n break;\n }\n\n default:\n {\n // @ts-ignore\n throw new Error(`Unimplemented type ${element.type}`);\n }\n }\n\n context.globalAlpha = 1;\n};\nconst pathsCache = new WeakMap([]);\nfunction generateFreeDrawShape(element) {\n const svgPathData = getFreeDrawSvgPath(element);\n const path = new Path2D(svgPathData);\n pathsCache.set(element, path);\n return path;\n}\nfunction getFreeDrawPath2D(element) {\n return pathsCache.get(element);\n}\nfunction getFreeDrawSvgPath(element) {\n var _a, _b, _c, _d, _e, _f, _g, _h; // If input points are empty (should they ever be?) return a dot\n\n\n const inputPoints = element.simulatePressure ? element.points : element.points.length ? element.points.map(([x, y], i) => [x, y, element.pressures[i]]) : [[0, 0, 0.5]]; // Consider changing the options for simulated pressure vs real pressure\n\n const customOptions = (_b = (_a = element.customData) === null || _a === void 0 ? void 0 : _a.strokeOptions) === null || _b === void 0 ? void 0 : _b.options; //zsviczian\n\n const options = customOptions //zsviczian\n ? Object.assign(Object.assign(Object.assign(Object.assign({}, customOptions), {\n simulatePressure: (_c = customOptions.simulatePressure) !== null && _c !== void 0 ? _c : element.simulatePressure,\n size: element.strokeWidth * 4.25,\n last: !!element.lastCommittedPoint,\n easing: (_d = _easingFunctions__WEBPACK_IMPORTED_MODULE_10__[\"default\"][customOptions.easing]) !== null && _d !== void 0 ? _d : t => t\n }), ((_e = customOptions.start) === null || _e === void 0 ? void 0 : _e.easing) ? {\n start: Object.assign(Object.assign({}, customOptions.start), {\n easing: (_f = _easingFunctions__WEBPACK_IMPORTED_MODULE_10__[\"default\"][customOptions.start.easing]) !== null && _f !== void 0 ? _f : t => t\n })\n } : {\n start: customOptions.start\n }), ((_g = customOptions.end) === null || _g === void 0 ? void 0 : _g.easing) ? {\n end: Object.assign(Object.assign({}, customOptions.end), {\n easing: (_h = _easingFunctions__WEBPACK_IMPORTED_MODULE_10__[\"default\"][customOptions.end.easing]) !== null && _h !== void 0 ? _h : t => t\n })\n } : {\n end: customOptions.end\n }) : {\n simulatePressure: element.simulatePressure,\n size: element.strokeWidth * 4.25,\n thinning: 0.6,\n smoothing: 0.5,\n streamline: 0.5,\n easing: _easingFunctions__WEBPACK_IMPORTED_MODULE_10__[\"default\"].easeOutSine,\n last: !!element.lastCommittedPoint // LastCommittedPoint is added on pointerup\n\n };\n return getSvgPathFromStroke((0,perfect_freehand__WEBPACK_IMPORTED_MODULE_7__.getStroke)(inputPoints, options));\n}\n\nfunction med(A, B) {\n return [(A[0] + B[0]) / 2, (A[1] + B[1]) / 2];\n} // Trim SVG path data so number are each two decimal points. This\n// improves SVG exports, and prevents rendering errors on points\n// with long decimals.\n\n\nconst TO_FIXED_PRECISION = /(\\s?[A-Z]?,?-?[0-9]*\\.[0-9]{0,2})(([0-9]|e|-)*)/g;\n\nfunction getSvgPathFromStroke(points) {\n if (!points.length) {\n return \"\";\n }\n\n const max = points.length - 1;\n return points.reduce((acc, point, i, arr) => {\n if (i === max) {\n acc.push(point, med(point, arr[0]), \"L\", arr[0], \"Z\");\n } else {\n acc.push(point, med(point, arr[i + 1]));\n }\n\n return acc;\n }, [\"M\", points[0], \"Q\"]).join(\" \").replace(TO_FIXED_PRECISION, \"$1\");\n}\n\n//# sourceURL=webpack://ExcalidrawLib/./renderer/renderElement.ts?");
3294
3294
 
3295
3295
  /***/ }),
3296
3296
 
@@ -3345,7 +3345,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
3345
3345
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
3346
3346
 
3347
3347
  "use strict";
3348
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"Fonts\": () => (/* binding */ Fonts)\n/* harmony export */ });\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../element */ \"./element/index.ts\");\n/* harmony import */ var _element_mutateElement__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../element/mutateElement */ \"./element/mutateElement.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _ShapeCache__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./ShapeCache */ \"./scene/ShapeCache.ts\");\n\n\n\n\nclass Fonts {\n constructor({\n scene\n }) {\n /**\r\n * if we load a (new) font, it's likely that text elements using it have\r\n * already been rendered using a fallback font. Thus, we want invalidate\r\n * their shapes and rerender. See #637.\r\n *\r\n * Invalidates text elements and rerenders scene, provided that at least one\r\n * of the supplied fontFaces has not already been processed.\r\n */\n this.onFontsLoaded = fontFaces => {\n if ( // bail if all fonts with have been processed. We're checking just a\n // subset of the font properties (though it should be enough), so it\n // can technically bail on a false positive.\n fontFaces.every(fontFace => {\n const sig = `${fontFace.family}-${fontFace.style}-${fontFace.weight}`;\n\n if (Fonts.loadedFontFaces.has(sig)) {\n return true;\n }\n\n Fonts.loadedFontFaces.add(sig);\n return false;\n })) {\n return false;\n }\n\n let didUpdate = false;\n this.scene.mapElements(element => {\n if ((0,_element__WEBPACK_IMPORTED_MODULE_0__.isTextElement)(element)) {\n didUpdate = true;\n _ShapeCache__WEBPACK_IMPORTED_MODULE_3__.ShapeCache[\"delete\"](element);\n return (0,_element_mutateElement__WEBPACK_IMPORTED_MODULE_1__.newElementWith)(element, {}, true);\n }\n\n return element;\n });\n\n if (didUpdate) {\n this.scene.triggerUpdate();\n }\n };\n\n this.loadFontsForElements = async elements => {\n const fontFaces = await Promise.all([...new Set(elements.filter(element => (0,_element__WEBPACK_IMPORTED_MODULE_0__.isTextElement)(element)).map(element => element.fontFamily))].map(fontFamily => {\n var _a, _b, _c, _d;\n\n const fontString = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getFontString)({\n fontFamily,\n fontSize: 16\n });\n\n if (!((_b = (_a = document.fonts) === null || _a === void 0 ? void 0 : _a.check) === null || _b === void 0 ? void 0 : _b.call(_a, fontString))) {\n return (_d = (_c = document.fonts) === null || _c === void 0 ? void 0 : _c.load) === null || _d === void 0 ? void 0 : _d.call(_c, fontString);\n }\n\n return undefined;\n }));\n this.onFontsLoaded(fontFaces.flat().filter(Boolean));\n };\n\n this.scene = scene;\n }\n\n} // it's ok to track fonts across multiple instances only once, so let's use\n// a static member to reduce memory footprint\n\nFonts.loadedFontFaces = new Set();\n\n//# sourceURL=webpack://ExcalidrawLib/./scene/Fonts.ts?");
3348
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"Fonts\": () => (/* binding */ Fonts)\n/* harmony export */ });\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../element */ \"./element/index.ts\");\n/* harmony import */ var _element_textElement__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils */ \"./utils.ts\");\n/* harmony import */ var _ShapeCache__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./ShapeCache */ \"./scene/ShapeCache.ts\");\n\n\n\n\nclass Fonts {\n constructor({\n scene\n }) {\n /**\r\n * if we load a (new) font, it's likely that text elements using it have\r\n * already been rendered using a fallback font. Thus, we want invalidate\r\n * their shapes and rerender. See #637.\r\n *\r\n * Invalidates text elements and rerenders scene, provided that at least one\r\n * of the supplied fontFaces has not already been processed.\r\n */\n this.onFontsLoaded = fontFaces => {\n if ( // bail if all fonts with have been processed. We're checking just a\n // subset of the font properties (though it should be enough), so it\n // can technically bail on a false positive.\n fontFaces.every(fontFace => {\n const sig = `${fontFace.family}-${fontFace.style}-${fontFace.weight}`;\n\n if (Fonts.loadedFontFaces.has(sig)) {\n return true;\n }\n\n Fonts.loadedFontFaces.add(sig);\n return false;\n })) {\n return false;\n }\n\n let didUpdate = false;\n const elementsMap = this.scene.getNonDeletedElementsMap();\n\n for (const element of this.scene.getNonDeletedElements()) {\n if ((0,_element__WEBPACK_IMPORTED_MODULE_0__.isTextElement)(element)) {\n didUpdate = true;\n _ShapeCache__WEBPACK_IMPORTED_MODULE_3__.ShapeCache[\"delete\"](element);\n const container = (0,_element_textElement__WEBPACK_IMPORTED_MODULE_1__.getContainerElement)(element, elementsMap);\n\n if (container) {\n _ShapeCache__WEBPACK_IMPORTED_MODULE_3__.ShapeCache[\"delete\"](container);\n }\n }\n }\n\n if (didUpdate) {\n this.scene.triggerUpdate();\n }\n };\n\n this.loadFontsForElements = async elements => {\n const fontFaces = await Promise.all([...new Set(elements.filter(element => (0,_element__WEBPACK_IMPORTED_MODULE_0__.isTextElement)(element)).map(element => element.fontFamily))].map(fontFamily => {\n var _a, _b, _c, _d;\n\n const fontString = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.getFontString)({\n fontFamily,\n fontSize: 16\n });\n\n if (!((_b = (_a = document.fonts) === null || _a === void 0 ? void 0 : _a.check) === null || _b === void 0 ? void 0 : _b.call(_a, fontString))) {\n return (_d = (_c = document.fonts) === null || _c === void 0 ? void 0 : _c.load) === null || _d === void 0 ? void 0 : _d.call(_c, fontString);\n }\n\n return undefined;\n }));\n this.onFontsLoaded(fontFaces.flat().filter(Boolean));\n };\n\n this.scene = scene;\n }\n\n} // it's ok to track fonts across multiple instances only once, so let's use\n// a static member to reduce memory footprint\n\nFonts.loadedFontFaces = new Set();\n\n//# sourceURL=webpack://ExcalidrawLib/./scene/Fonts.ts?");
3349
3349
 
3350
3350
  /***/ }),
3351
3351
 
@@ -3389,7 +3389,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
3389
3389
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
3390
3390
 
3391
3391
  "use strict";
3392
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"ShapeCache\": () => (/* binding */ ShapeCache)\n/* harmony export */ });\n/* harmony import */ var roughjs_bin_generator__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! roughjs/bin/generator */ \"../../node_modules/roughjs/bin/generator.js\");\n/* harmony import */ var _renderer_renderElement__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../renderer/renderElement */ \"./renderer/renderElement.ts\");\n/* harmony import */ var _Shape__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Shape */ \"./scene/Shape.ts\");\n/* harmony import */ var _colors__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../colors */ \"./colors.ts\");\n\n\n\n\nclass ShapeCache {}\nShapeCache.rg = new roughjs_bin_generator__WEBPACK_IMPORTED_MODULE_0__.RoughGenerator();\nShapeCache.cache = new WeakMap();\n/**\r\n * Retrieves shape from cache if available. Use this only if shape\r\n * is optional and you have a fallback in case it's not cached.\r\n */\n\nShapeCache.get = element => {\n return ShapeCache.cache.get(element);\n};\n\nShapeCache.set = (element, shape) => ShapeCache.cache.set(element, shape);\n\nShapeCache.delete = element => ShapeCache.cache.delete(element);\n\nShapeCache.destroy = () => {\n ShapeCache.cache = new WeakMap();\n};\n/**\r\n * Generates & caches shape for element if not already cached, otherwise\r\n * returns cached shape.\r\n */\n\n\nShapeCache.generateElementShape = (element, renderConfig) => {\n // when exporting, always regenerated to guarantee the latest shape\n const cachedShape = (renderConfig === null || renderConfig === void 0 ? void 0 : renderConfig.isExporting) ? undefined : ShapeCache.get(element); // `null` indicates no rc shape applicable for this element type,\n // but it's considered a valid cache value (= do not regenerate)\n\n if (cachedShape !== undefined) {\n return cachedShape;\n }\n\n _renderer_renderElement__WEBPACK_IMPORTED_MODULE_1__.elementWithCanvasCache[\"delete\"](element);\n\n const shape = (0,_Shape__WEBPACK_IMPORTED_MODULE_2__._generateElementShape)(element, ShapeCache.rg, renderConfig || {\n isExporting: false,\n canvasBackgroundColor: _colors__WEBPACK_IMPORTED_MODULE_3__.COLOR_PALETTE.white,\n embedsValidationStatus: null\n });\n\n ShapeCache.cache.set(element, shape);\n return shape;\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./scene/ShapeCache.ts?");
3392
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"ShapeCache\": () => (/* binding */ ShapeCache)\n/* harmony export */ });\n/* harmony import */ var roughjs_bin_generator__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! roughjs/bin/generator */ \"../../node_modules/roughjs/bin/generator.js\");\n/* harmony import */ var _renderer_renderElement__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../renderer/renderElement */ \"./renderer/renderElement.ts\");\n/* harmony import */ var _Shape__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Shape */ \"./scene/Shape.ts\");\n/* harmony import */ var _colors__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../colors */ \"./colors.ts\");\n\n\n\n\nclass ShapeCache {}\nShapeCache.rg = new roughjs_bin_generator__WEBPACK_IMPORTED_MODULE_0__.RoughGenerator();\nShapeCache.cache = new WeakMap();\n/**\r\n * Retrieves shape from cache if available. Use this only if shape\r\n * is optional and you have a fallback in case it's not cached.\r\n */\n\nShapeCache.get = element => {\n return ShapeCache.cache.get(element);\n};\n\nShapeCache.set = (element, shape) => ShapeCache.cache.set(element, shape);\n\nShapeCache.delete = element => ShapeCache.cache.delete(element);\n\nShapeCache.destroy = () => {\n ShapeCache.cache = new WeakMap();\n\n if (_renderer_renderElement__WEBPACK_IMPORTED_MODULE_1__.elementWithCanvasCache) {\n //zsviczian\n Object.values(_renderer_renderElement__WEBPACK_IMPORTED_MODULE_1__.elementWithCanvasCache).forEach(value => {\n _renderer_renderElement__WEBPACK_IMPORTED_MODULE_1__.elementWithCanvasCache[\"delete\"](value);\n });\n }\n};\n/**\r\n * Generates & caches shape for element if not already cached, otherwise\r\n * returns cached shape.\r\n */\n\n\nShapeCache.generateElementShape = (element, renderConfig) => {\n // when exporting, always regenerated to guarantee the latest shape\n const cachedShape = (renderConfig === null || renderConfig === void 0 ? void 0 : renderConfig.isExporting) ? undefined : ShapeCache.get(element); // `null` indicates no rc shape applicable for this element type,\n // but it's considered a valid cache value (= do not regenerate)\n\n if (cachedShape !== undefined) {\n return cachedShape;\n }\n\n _renderer_renderElement__WEBPACK_IMPORTED_MODULE_1__.elementWithCanvasCache[\"delete\"](element);\n\n const shape = (0,_Shape__WEBPACK_IMPORTED_MODULE_2__._generateElementShape)(element, ShapeCache.rg, renderConfig || {\n isExporting: false,\n canvasBackgroundColor: _colors__WEBPACK_IMPORTED_MODULE_3__.COLOR_PALETTE.white,\n embedsValidationStatus: null\n });\n\n ShapeCache.cache.set(element, shape);\n return shape;\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./scene/ShapeCache.ts?");
3393
3393
 
3394
3394
  /***/ }),
3395
3395
 
@@ -3477,7 +3477,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
3477
3477
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
3478
3478
 
3479
3479
  "use strict";
3480
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"SHAPES\": () => (/* binding */ SHAPES),\n/* harmony export */ \"findShapeByKey\": () => (/* binding */ findShapeByKey)\n/* harmony export */ });\n/* harmony import */ var _components_icons__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./components/icons */ \"./components/icons.tsx\");\n/* harmony import */ var _keys__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./keys */ \"./keys.ts\");\n\n\nconst SHAPES = [{\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_0__.SelectionIcon,\n value: \"selection\",\n key: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.V,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS[1],\n fillable: true\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_0__.RectangleIcon,\n value: \"rectangle\",\n key: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.R,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS[2],\n fillable: true\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_0__.DiamondIcon,\n value: \"diamond\",\n key: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.D,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS[3],\n fillable: true\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_0__.EllipseIcon,\n value: \"ellipse\",\n key: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.O,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS[4],\n fillable: true\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_0__.ArrowIcon,\n value: \"arrow\",\n key: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.A,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS[5],\n fillable: true\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_0__.LineIcon,\n value: \"line\",\n key: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.L,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS[6],\n fillable: true\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_0__.FreedrawIcon,\n value: \"freedraw\",\n key: [_keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.P, _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.X],\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS[7],\n fillable: false\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_0__.TextIcon,\n value: \"text\",\n key: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.T,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS[8],\n fillable: false\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_0__.ImageIcon,\n value: \"image\",\n key: null,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS[9],\n fillable: false\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_0__.EraserIcon,\n value: \"eraser\",\n key: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS.E,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_1__.KEYS[0],\n fillable: false\n}];\nconst findShapeByKey = key => {\n const shape = SHAPES.find((shape, index) => {\n return shape.numericKey != null && key === shape.numericKey.toString() || shape.key && (typeof shape.key === \"string\" ? shape.key === key : shape.key.includes(key));\n });\n return (shape === null || shape === void 0 ? void 0 : shape.value) || null;\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./shapes.tsx?");
3480
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"SHAPES\": () => (/* binding */ SHAPES),\n/* harmony export */ \"findShapeByKey\": () => (/* binding */ findShapeByKey),\n/* harmony export */ \"getElementShape\": () => (/* binding */ getElementShape)\n/* harmony export */ });\n/* harmony import */ var _utils_geometry_shape__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils/geometry/shape */ \"../utils/geometry/shape.ts\");\n/* harmony import */ var _components_icons__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./components/icons */ \"./components/icons.tsx\");\n/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./element */ \"./element/index.ts\");\n/* harmony import */ var _element_collision__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./element/collision */ \"./element/collision.ts\");\n/* harmony import */ var _keys__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./keys */ \"./keys.ts\");\n/* harmony import */ var _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./scene/ShapeCache */ \"./scene/ShapeCache.ts\");\n\n\n\n\n\n\nconst SHAPES = [{\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_1__.SelectionIcon,\n value: \"selection\",\n key: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS.V,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS[1],\n fillable: true\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_1__.RectangleIcon,\n value: \"rectangle\",\n key: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS.R,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS[2],\n fillable: true\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_1__.DiamondIcon,\n value: \"diamond\",\n key: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS.D,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS[3],\n fillable: true\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_1__.EllipseIcon,\n value: \"ellipse\",\n key: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS.O,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS[4],\n fillable: true\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_1__.ArrowIcon,\n value: \"arrow\",\n key: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS.A,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS[5],\n fillable: true\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_1__.LineIcon,\n value: \"line\",\n key: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS.L,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS[6],\n fillable: true\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_1__.FreedrawIcon,\n value: \"freedraw\",\n key: [_keys__WEBPACK_IMPORTED_MODULE_4__.KEYS.P, _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS.X],\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS[7],\n fillable: false\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_1__.TextIcon,\n value: \"text\",\n key: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS.T,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS[8],\n fillable: false\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_1__.ImageIcon,\n value: \"image\",\n key: null,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS[9],\n fillable: false\n}, {\n icon: _components_icons__WEBPACK_IMPORTED_MODULE_1__.EraserIcon,\n value: \"eraser\",\n key: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS.E,\n numericKey: _keys__WEBPACK_IMPORTED_MODULE_4__.KEYS[0],\n fillable: false\n}];\nconst findShapeByKey = key => {\n const shape = SHAPES.find((shape, index) => {\n return shape.numericKey != null && key === shape.numericKey.toString() || shape.key && (typeof shape.key === \"string\" ? shape.key === key : shape.key.includes(key));\n });\n return (shape === null || shape === void 0 ? void 0 : shape.value) || null;\n};\n/**\r\n * get the pure geometric shape of an excalidraw element\r\n * which is then used for hit detection\r\n */\n\nconst getElementShape = (element, elementsMap) => {\n var _a, _b;\n\n switch (element.type) {\n case \"rectangle\":\n case \"diamond\":\n case \"frame\":\n case \"magicframe\":\n case \"embeddable\":\n case \"image\":\n case \"iframe\":\n case \"text\":\n case \"selection\":\n return (0,_utils_geometry_shape__WEBPACK_IMPORTED_MODULE_0__.getPolygonShape)(element);\n\n case \"arrow\":\n case \"line\":\n {\n const roughShape = (_b = (_a = _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_5__.ShapeCache.get(element)) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : _scene_ShapeCache__WEBPACK_IMPORTED_MODULE_5__.ShapeCache.generateElementShape(element, null)[0];\n const [,,,, cx, cy] = (0,_element__WEBPACK_IMPORTED_MODULE_2__.getElementAbsoluteCoords)(element, elementsMap);\n return (0,_element_collision__WEBPACK_IMPORTED_MODULE_3__.shouldTestInside)(element) ? (0,_utils_geometry_shape__WEBPACK_IMPORTED_MODULE_0__.getClosedCurveShape)(element, roughShape, [element.x, element.y], element.angle, [cx, cy]) : (0,_utils_geometry_shape__WEBPACK_IMPORTED_MODULE_0__.getCurveShape)(roughShape, [element.x, element.y], element.angle, [cx, cy]);\n }\n\n case \"ellipse\":\n return (0,_utils_geometry_shape__WEBPACK_IMPORTED_MODULE_0__.getEllipseShape)(element);\n\n case \"freedraw\":\n {\n const [,,,, cx, cy] = (0,_element__WEBPACK_IMPORTED_MODULE_2__.getElementAbsoluteCoords)(element, elementsMap);\n return (0,_utils_geometry_shape__WEBPACK_IMPORTED_MODULE_0__.getFreedrawShape)(element, [cx, cy], (0,_element_collision__WEBPACK_IMPORTED_MODULE_3__.shouldTestInside)(element));\n }\n }\n};\n\n//# sourceURL=webpack://ExcalidrawLib/./shapes.tsx?");
3481
3481
 
3482
3482
  /***/ }),
3483
3483
 
@@ -3565,7 +3565,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
3565
3565
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
3566
3566
 
3567
3567
  "use strict";
3568
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"MIME_TYPES\": () => (/* reexport safe */ _excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES),\n/* harmony export */ \"determineFocusDistance\": () => (/* reexport safe */ _excalidraw_element_binding__WEBPACK_IMPORTED_MODULE_9__.determineFocusDistance),\n/* harmony export */ \"exportToBlob\": () => (/* binding */ exportToBlob),\n/* harmony export */ \"exportToCanvas\": () => (/* binding */ exportToCanvas),\n/* harmony export */ \"exportToClipboard\": () => (/* binding */ exportToClipboard),\n/* harmony export */ \"exportToSvg\": () => (/* binding */ exportToSvg),\n/* harmony export */ \"getBoundTextMaxWidth\": () => (/* reexport safe */ _excalidraw_element_textElement__WEBPACK_IMPORTED_MODULE_10__.getBoundTextMaxWidth),\n/* harmony export */ \"getCommonBoundingBox\": () => (/* reexport safe */ _excalidraw_element_bounds__WEBPACK_IMPORTED_MODULE_7__.getCommonBoundingBox),\n/* harmony export */ \"getDefaultLineHeight\": () => (/* reexport safe */ _excalidraw_element_textElement__WEBPACK_IMPORTED_MODULE_10__.getDefaultLineHeight),\n/* harmony export */ \"getFontString\": () => (/* reexport safe */ _excalidraw_utils__WEBPACK_IMPORTED_MODULE_11__.getFontString),\n/* harmony export */ \"getMaximumGroups\": () => (/* reexport safe */ _excalidraw_groups__WEBPACK_IMPORTED_MODULE_8__.getMaximumGroups),\n/* harmony export */ \"intersectElementWithLine\": () => (/* reexport safe */ _excalidraw_element_binding__WEBPACK_IMPORTED_MODULE_9__.intersectElementWithLine),\n/* harmony export */ \"measureText\": () => (/* reexport safe */ _excalidraw_element_textElement__WEBPACK_IMPORTED_MODULE_10__.measureText),\n/* harmony export */ \"mermaidToExcalidraw\": () => (/* reexport safe */ _excalidraw_components_TTDDialog_MermaidToExcalidraw__WEBPACK_IMPORTED_MODULE_12__.mermaidToExcalidraw),\n/* harmony export */ \"wrapText\": () => (/* reexport safe */ _excalidraw_element_textElement__WEBPACK_IMPORTED_MODULE_10__.wrapText)\n/* harmony export */ });\n/* harmony import */ var _excalidraw_scene_export__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../excalidraw/scene/export */ \"./scene/export.ts\");\n/* harmony import */ var _excalidraw_appState__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../excalidraw/appState */ \"./appState.ts\");\n/* harmony import */ var _excalidraw_data_restore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../excalidraw/data/restore */ \"./data/restore.ts\");\n/* harmony import */ var _excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../excalidraw/constants */ \"./constants.ts\");\n/* harmony import */ var _excalidraw_data_image__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../excalidraw/data/image */ \"./data/image.ts\");\n/* harmony import */ var _excalidraw_data_json__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../excalidraw/data/json */ \"./data/json.ts\");\n/* harmony import */ var _excalidraw_clipboard__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../excalidraw/clipboard */ \"./clipboard.ts\");\n/* harmony import */ var _excalidraw_element_bounds__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../excalidraw/element/bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _excalidraw_groups__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../excalidraw/groups */ \"./groups.ts\");\n/* harmony import */ var _excalidraw_element_binding__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../excalidraw/element/binding */ \"./element/binding.ts\");\n/* harmony import */ var _excalidraw_element_textElement__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../excalidraw/element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _excalidraw_utils__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../excalidraw/utils */ \"./utils.ts\");\n/* harmony import */ var _excalidraw_components_TTDDialog_MermaidToExcalidraw__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../excalidraw/components/TTDDialog/MermaidToExcalidraw */ \"./components/TTDDialog/MermaidToExcalidraw.tsx\");\n\n\n\n\n\n\n\n\nconst exportToCanvas = ({\n elements,\n appState,\n files,\n maxWidthOrHeight,\n getDimensions,\n exportPadding,\n exportingFrame\n}) => {\n const {\n elements: restoredElements,\n appState: restoredAppState\n } = (0,_excalidraw_data_restore__WEBPACK_IMPORTED_MODULE_2__.restore)({\n elements,\n appState\n }, null, null);\n const {\n exportBackground,\n viewBackgroundColor\n } = restoredAppState;\n return (0,_excalidraw_scene_export__WEBPACK_IMPORTED_MODULE_0__.exportToCanvas)(restoredElements, Object.assign(Object.assign({}, restoredAppState), {\n offsetTop: 0,\n offsetLeft: 0,\n width: 0,\n height: 0\n }), files || {}, {\n exportBackground,\n exportPadding,\n viewBackgroundColor,\n exportingFrame\n }, (width, height) => {\n var _a, _b;\n\n const canvas = document.createElement(\"canvas\");\n\n if (maxWidthOrHeight) {\n if (typeof getDimensions === \"function\") {\n console.warn(\"`getDimensions()` is ignored when `maxWidthOrHeight` is supplied.\");\n }\n\n const max = Math.max(width, height); // if content is less then maxWidthOrHeight, fallback on supplied scale\n\n const scale = maxWidthOrHeight < max ? maxWidthOrHeight / max : (_a = appState === null || appState === void 0 ? void 0 : appState.exportScale) !== null && _a !== void 0 ? _a : 1;\n canvas.width = width * scale;\n canvas.height = height * scale;\n return {\n canvas,\n scale\n };\n }\n\n const ret = (getDimensions === null || getDimensions === void 0 ? void 0 : getDimensions(width, height)) || {\n width,\n height\n };\n canvas.width = ret.width;\n canvas.height = ret.height;\n return {\n canvas,\n scale: (_b = ret.scale) !== null && _b !== void 0 ? _b : 1\n };\n });\n};\nconst exportToBlob = async opts => {\n var _a;\n\n let {\n mimeType = _excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES.png,\n quality\n } = opts;\n\n if (mimeType === _excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES.png && typeof quality === \"number\") {\n console.warn(`\"quality\" will be ignored for \"${_excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES.png}\" mimeType`);\n } // typo in MIME type (should be \"jpeg\")\n\n\n if (mimeType === \"image/jpg\") {\n mimeType = _excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES.jpg;\n }\n\n if (mimeType === _excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES.jpg && !((_a = opts.appState) === null || _a === void 0 ? void 0 : _a.exportBackground)) {\n console.warn(`Defaulting \"exportBackground\" to \"true\" for \"${_excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES.jpg}\" mimeType`);\n opts = Object.assign(Object.assign({}, opts), {\n appState: Object.assign(Object.assign({}, opts.appState), {\n exportBackground: true\n })\n });\n }\n\n const canvas = await exportToCanvas(opts);\n quality = quality ? quality : /image\\/jpe?g/.test(mimeType) ? 0.92 : 0.8;\n return new Promise((resolve, reject) => {\n canvas.toBlob(async blob => {\n var _a;\n\n if (!blob) {\n return reject(new Error(\"couldn't export to blob\"));\n }\n\n if (blob && mimeType === _excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES.png && ((_a = opts.appState) === null || _a === void 0 ? void 0 : _a.exportEmbedScene)) {\n blob = await (0,_excalidraw_data_image__WEBPACK_IMPORTED_MODULE_4__.encodePngMetadata)({\n blob,\n metadata: (0,_excalidraw_data_json__WEBPACK_IMPORTED_MODULE_5__.serializeAsJSON)( // NOTE as long as we're using the Scene hack, we need to ensure\n // we pass the original, uncloned elements when serializing\n // so that we keep ids stable\n opts.elements, opts.appState, opts.files || {}, \"local\")\n });\n }\n\n resolve(blob);\n }, mimeType, quality);\n });\n};\nconst exportToSvg = async ({\n elements,\n appState = (0,_excalidraw_appState__WEBPACK_IMPORTED_MODULE_1__.getDefaultAppState)(),\n files = {},\n exportPadding,\n renderEmbeddables,\n exportingFrame\n}) => {\n const {\n elements: restoredElements,\n appState: restoredAppState\n } = (0,_excalidraw_data_restore__WEBPACK_IMPORTED_MODULE_2__.restore)({\n elements,\n appState\n }, null, null);\n const exportAppState = Object.assign(Object.assign({}, restoredAppState), {\n exportPadding\n });\n return (0,_excalidraw_scene_export__WEBPACK_IMPORTED_MODULE_0__.exportToSvg)(restoredElements, exportAppState, files, {\n exportingFrame,\n renderEmbeddables\n });\n};\nconst exportToClipboard = async opts => {\n if (opts.type === \"svg\") {\n const svg = await exportToSvg(opts);\n await (0,_excalidraw_clipboard__WEBPACK_IMPORTED_MODULE_6__.copyTextToSystemClipboard)(svg.outerHTML);\n } else if (opts.type === \"png\") {\n await (0,_excalidraw_clipboard__WEBPACK_IMPORTED_MODULE_6__.copyBlobToClipboardAsPng)(exportToBlob(opts));\n } else if (opts.type === \"json\") {\n await (0,_excalidraw_clipboard__WEBPACK_IMPORTED_MODULE_6__.copyToClipboard)(opts.elements, opts.files);\n } else {\n throw new Error(\"Invalid export type\");\n }\n};\n //zsviczian\n\n //zsviczian\n\n //zsviczian\n\n //zsviczian\n\n //zsviczian\n\n //zsviczian\n\n //zsviczian\n\n //zsviczian\n\n//# sourceURL=webpack://ExcalidrawLib/../utils/export.ts?");
3568
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"MIME_TYPES\": () => (/* reexport safe */ _excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES),\n/* harmony export */ \"destroyObsidianUtils\": () => (/* reexport safe */ _excalidraw_obsidianUtils__WEBPACK_IMPORTED_MODULE_13__.destroyObsidianUtils),\n/* harmony export */ \"determineFocusDistance\": () => (/* reexport safe */ _excalidraw_element_binding__WEBPACK_IMPORTED_MODULE_9__.determineFocusDistance),\n/* harmony export */ \"exportToBlob\": () => (/* binding */ exportToBlob),\n/* harmony export */ \"exportToCanvas\": () => (/* binding */ exportToCanvas),\n/* harmony export */ \"exportToClipboard\": () => (/* binding */ exportToClipboard),\n/* harmony export */ \"exportToSvg\": () => (/* binding */ exportToSvg),\n/* harmony export */ \"getBoundTextMaxWidth\": () => (/* reexport safe */ _excalidraw_element_textElement__WEBPACK_IMPORTED_MODULE_10__.getBoundTextMaxWidth),\n/* harmony export */ \"getCommonBoundingBox\": () => (/* reexport safe */ _excalidraw_element_bounds__WEBPACK_IMPORTED_MODULE_7__.getCommonBoundingBox),\n/* harmony export */ \"getDefaultLineHeight\": () => (/* reexport safe */ _excalidraw_element_textElement__WEBPACK_IMPORTED_MODULE_10__.getDefaultLineHeight),\n/* harmony export */ \"getFontString\": () => (/* reexport safe */ _excalidraw_utils__WEBPACK_IMPORTED_MODULE_11__.getFontString),\n/* harmony export */ \"getMaximumGroups\": () => (/* reexport safe */ _excalidraw_groups__WEBPACK_IMPORTED_MODULE_8__.getMaximumGroups),\n/* harmony export */ \"intersectElementWithLine\": () => (/* reexport safe */ _excalidraw_element_binding__WEBPACK_IMPORTED_MODULE_9__.intersectElementWithLine),\n/* harmony export */ \"measureText\": () => (/* reexport safe */ _excalidraw_element_textElement__WEBPACK_IMPORTED_MODULE_10__.measureText),\n/* harmony export */ \"mermaidToExcalidraw\": () => (/* reexport safe */ _excalidraw_components_TTDDialog_MermaidToExcalidraw__WEBPACK_IMPORTED_MODULE_12__.mermaidToExcalidraw),\n/* harmony export */ \"wrapText\": () => (/* reexport safe */ _excalidraw_element_textElement__WEBPACK_IMPORTED_MODULE_10__.wrapText)\n/* harmony export */ });\n/* harmony import */ var _excalidraw_scene_export__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../excalidraw/scene/export */ \"./scene/export.ts\");\n/* harmony import */ var _excalidraw_appState__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../excalidraw/appState */ \"./appState.ts\");\n/* harmony import */ var _excalidraw_data_restore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../excalidraw/data/restore */ \"./data/restore.ts\");\n/* harmony import */ var _excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../excalidraw/constants */ \"./constants.ts\");\n/* harmony import */ var _excalidraw_data_image__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../excalidraw/data/image */ \"./data/image.ts\");\n/* harmony import */ var _excalidraw_data_json__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../excalidraw/data/json */ \"./data/json.ts\");\n/* harmony import */ var _excalidraw_clipboard__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../excalidraw/clipboard */ \"./clipboard.ts\");\n/* harmony import */ var _excalidraw_element_bounds__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../excalidraw/element/bounds */ \"./element/bounds.ts\");\n/* harmony import */ var _excalidraw_groups__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../excalidraw/groups */ \"./groups.ts\");\n/* harmony import */ var _excalidraw_element_binding__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../excalidraw/element/binding */ \"./element/binding.ts\");\n/* harmony import */ var _excalidraw_element_textElement__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../excalidraw/element/textElement */ \"./element/textElement.ts\");\n/* harmony import */ var _excalidraw_utils__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../excalidraw/utils */ \"./utils.ts\");\n/* harmony import */ var _excalidraw_components_TTDDialog_MermaidToExcalidraw__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../excalidraw/components/TTDDialog/MermaidToExcalidraw */ \"./components/TTDDialog/MermaidToExcalidraw.tsx\");\n/* harmony import */ var _excalidraw_obsidianUtils__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../excalidraw/obsidianUtils */ \"./obsidianUtils.ts\");\n\n\n\n\n\n\n\n\nconst exportToCanvas = ({\n elements,\n appState,\n files,\n maxWidthOrHeight,\n getDimensions,\n exportPadding,\n exportingFrame\n}) => {\n const {\n elements: restoredElements,\n appState: restoredAppState\n } = (0,_excalidraw_data_restore__WEBPACK_IMPORTED_MODULE_2__.restore)({\n elements,\n appState\n }, null, null);\n const {\n exportBackground,\n viewBackgroundColor\n } = restoredAppState;\n return (0,_excalidraw_scene_export__WEBPACK_IMPORTED_MODULE_0__.exportToCanvas)(restoredElements, Object.assign(Object.assign({}, restoredAppState), {\n offsetTop: 0,\n offsetLeft: 0,\n width: 0,\n height: 0\n }), files || {}, {\n exportBackground,\n exportPadding,\n viewBackgroundColor,\n exportingFrame\n }, (width, height) => {\n var _a, _b;\n\n const canvas = document.createElement(\"canvas\");\n\n if (maxWidthOrHeight) {\n if (typeof getDimensions === \"function\") {\n console.warn(\"`getDimensions()` is ignored when `maxWidthOrHeight` is supplied.\");\n }\n\n const max = Math.max(width, height); // if content is less then maxWidthOrHeight, fallback on supplied scale\n\n const scale = maxWidthOrHeight < max ? maxWidthOrHeight / max : (_a = appState === null || appState === void 0 ? void 0 : appState.exportScale) !== null && _a !== void 0 ? _a : 1;\n canvas.width = width * scale;\n canvas.height = height * scale;\n return {\n canvas,\n scale\n };\n }\n\n const ret = (getDimensions === null || getDimensions === void 0 ? void 0 : getDimensions(width, height)) || {\n width,\n height\n };\n canvas.width = ret.width;\n canvas.height = ret.height;\n return {\n canvas,\n scale: (_b = ret.scale) !== null && _b !== void 0 ? _b : 1\n };\n });\n};\nconst exportToBlob = async opts => {\n var _a;\n\n let {\n mimeType = _excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES.png,\n quality\n } = opts;\n\n if (mimeType === _excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES.png && typeof quality === \"number\") {\n console.warn(`\"quality\" will be ignored for \"${_excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES.png}\" mimeType`);\n } // typo in MIME type (should be \"jpeg\")\n\n\n if (mimeType === \"image/jpg\") {\n mimeType = _excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES.jpg;\n }\n\n if (mimeType === _excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES.jpg && !((_a = opts.appState) === null || _a === void 0 ? void 0 : _a.exportBackground)) {\n console.warn(`Defaulting \"exportBackground\" to \"true\" for \"${_excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES.jpg}\" mimeType`);\n opts = Object.assign(Object.assign({}, opts), {\n appState: Object.assign(Object.assign({}, opts.appState), {\n exportBackground: true\n })\n });\n }\n\n const canvas = await exportToCanvas(opts);\n quality = quality ? quality : /image\\/jpe?g/.test(mimeType) ? 0.92 : 0.8;\n return new Promise((resolve, reject) => {\n canvas.toBlob(async blob => {\n var _a;\n\n if (!blob) {\n return reject(new Error(\"couldn't export to blob\"));\n }\n\n if (blob && mimeType === _excalidraw_constants__WEBPACK_IMPORTED_MODULE_3__.MIME_TYPES.png && ((_a = opts.appState) === null || _a === void 0 ? void 0 : _a.exportEmbedScene)) {\n blob = await (0,_excalidraw_data_image__WEBPACK_IMPORTED_MODULE_4__.encodePngMetadata)({\n blob,\n metadata: (0,_excalidraw_data_json__WEBPACK_IMPORTED_MODULE_5__.serializeAsJSON)( // NOTE as long as we're using the Scene hack, we need to ensure\n // we pass the original, uncloned elements when serializing\n // so that we keep ids stable\n opts.elements, opts.appState, opts.files || {}, \"local\")\n });\n }\n\n resolve(blob);\n }, mimeType, quality);\n });\n};\nconst exportToSvg = async ({\n elements,\n appState = (0,_excalidraw_appState__WEBPACK_IMPORTED_MODULE_1__.getDefaultAppState)(),\n files = {},\n exportPadding,\n renderEmbeddables,\n exportingFrame\n}) => {\n const {\n elements: restoredElements,\n appState: restoredAppState\n } = (0,_excalidraw_data_restore__WEBPACK_IMPORTED_MODULE_2__.restore)({\n elements,\n appState\n }, null, null);\n const exportAppState = Object.assign(Object.assign({}, restoredAppState), {\n exportPadding\n });\n return (0,_excalidraw_scene_export__WEBPACK_IMPORTED_MODULE_0__.exportToSvg)(restoredElements, exportAppState, files, {\n exportingFrame,\n renderEmbeddables\n });\n};\nconst exportToClipboard = async opts => {\n if (opts.type === \"svg\") {\n const svg = await exportToSvg(opts);\n await (0,_excalidraw_clipboard__WEBPACK_IMPORTED_MODULE_6__.copyTextToSystemClipboard)(svg.outerHTML);\n } else if (opts.type === \"png\") {\n await (0,_excalidraw_clipboard__WEBPACK_IMPORTED_MODULE_6__.copyBlobToClipboardAsPng)(exportToBlob(opts));\n } else if (opts.type === \"json\") {\n await (0,_excalidraw_clipboard__WEBPACK_IMPORTED_MODULE_6__.copyToClipboard)(opts.elements, opts.files);\n } else {\n throw new Error(\"Invalid export type\");\n }\n};\n //zsviczian\n\n //zsviczian\n\n //zsviczian\n\n //zsviczian\n\n //zsviczian\n\n //zsviczian\n\n //zsviczian\n\n //zsviczian\n\n //zsviczian\n\n//# sourceURL=webpack://ExcalidrawLib/../utils/export.ts?");
3569
3569
 
3570
3570
  /***/ }),
3571
3571
 
@@ -3598,7 +3598,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
3598
3598
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
3599
3599
 
3600
3600
  "use strict";
3601
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"MIME_TYPES\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.MIME_TYPES),\n/* harmony export */ \"crossProduct\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.crossProduct),\n/* harmony export */ \"determineFocusDistance\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.determineFocusDistance),\n/* harmony export */ \"doBBoxesIntersect\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.doBBoxesIntersect),\n/* harmony export */ \"doLineSegmentsIntersect\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.doLineSegmentsIntersect),\n/* harmony export */ \"elementPartiallyOverlapsWithOrContainsBBox\": () => (/* reexport safe */ _withinBounds__WEBPACK_IMPORTED_MODULE_1__.elementPartiallyOverlapsWithOrContainsBBox),\n/* harmony export */ \"elementsOverlappingBBox\": () => (/* reexport safe */ _withinBounds__WEBPACK_IMPORTED_MODULE_1__.elementsOverlappingBBox),\n/* harmony export */ \"exportToBlob\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.exportToBlob),\n/* harmony export */ \"exportToCanvas\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.exportToCanvas),\n/* harmony export */ \"exportToClipboard\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.exportToClipboard),\n/* harmony export */ \"exportToSvg\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.exportToSvg),\n/* harmony export */ \"getBBox\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.getBBox),\n/* harmony export */ \"getBoundTextMaxWidth\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.getBoundTextMaxWidth),\n/* harmony export */ \"getCommonBoundingBox\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.getCommonBoundingBox),\n/* harmony export */ \"getDefaultLineHeight\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.getDefaultLineHeight),\n/* harmony export */ \"getFontString\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.getFontString),\n/* harmony export */ \"getMaximumGroups\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.getMaximumGroups),\n/* harmony export */ \"intersectElementWithLine\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.intersectElementWithLine),\n/* harmony export */ \"isElementInsideBBox\": () => (/* reexport safe */ _withinBounds__WEBPACK_IMPORTED_MODULE_1__.isElementInsideBBox),\n/* harmony export */ \"isLineSegmentTouchingOrCrossingLine\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.isLineSegmentTouchingOrCrossingLine),\n/* harmony export */ \"isPointOnLine\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.isPointOnLine),\n/* harmony export */ \"isPointRightOfLine\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.isPointRightOfLine),\n/* harmony export */ \"measureText\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.measureText),\n/* harmony export */ \"mermaidToExcalidraw\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.mermaidToExcalidraw),\n/* harmony export */ \"translate\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.translate),\n/* harmony export */ \"wrapText\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.wrapText)\n/* harmony export */ });\n/* harmony import */ var _export__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./export */ \"../utils/export.ts\");\n/* harmony import */ var _withinBounds__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./withinBounds */ \"../utils/withinBounds.ts\");\n/* harmony import */ var _bbox__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./bbox */ \"../utils/bbox.ts\");\n\n\n\n\n//# sourceURL=webpack://ExcalidrawLib/../utils/index.ts?");
3601
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"MIME_TYPES\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.MIME_TYPES),\n/* harmony export */ \"crossProduct\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.crossProduct),\n/* harmony export */ \"destroyObsidianUtils\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.destroyObsidianUtils),\n/* harmony export */ \"determineFocusDistance\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.determineFocusDistance),\n/* harmony export */ \"doBBoxesIntersect\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.doBBoxesIntersect),\n/* harmony export */ \"doLineSegmentsIntersect\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.doLineSegmentsIntersect),\n/* harmony export */ \"elementPartiallyOverlapsWithOrContainsBBox\": () => (/* reexport safe */ _withinBounds__WEBPACK_IMPORTED_MODULE_1__.elementPartiallyOverlapsWithOrContainsBBox),\n/* harmony export */ \"elementsOverlappingBBox\": () => (/* reexport safe */ _withinBounds__WEBPACK_IMPORTED_MODULE_1__.elementsOverlappingBBox),\n/* harmony export */ \"exportToBlob\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.exportToBlob),\n/* harmony export */ \"exportToCanvas\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.exportToCanvas),\n/* harmony export */ \"exportToClipboard\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.exportToClipboard),\n/* harmony export */ \"exportToSvg\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.exportToSvg),\n/* harmony export */ \"getBBox\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.getBBox),\n/* harmony export */ \"getBoundTextMaxWidth\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.getBoundTextMaxWidth),\n/* harmony export */ \"getCommonBoundingBox\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.getCommonBoundingBox),\n/* harmony export */ \"getDefaultLineHeight\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.getDefaultLineHeight),\n/* harmony export */ \"getFontString\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.getFontString),\n/* harmony export */ \"getMaximumGroups\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.getMaximumGroups),\n/* harmony export */ \"intersectElementWithLine\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.intersectElementWithLine),\n/* harmony export */ \"isElementInsideBBox\": () => (/* reexport safe */ _withinBounds__WEBPACK_IMPORTED_MODULE_1__.isElementInsideBBox),\n/* harmony export */ \"isLineSegmentTouchingOrCrossingLine\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.isLineSegmentTouchingOrCrossingLine),\n/* harmony export */ \"isPointOnLine\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.isPointOnLine),\n/* harmony export */ \"isPointRightOfLine\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.isPointRightOfLine),\n/* harmony export */ \"measureText\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.measureText),\n/* harmony export */ \"mermaidToExcalidraw\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.mermaidToExcalidraw),\n/* harmony export */ \"translate\": () => (/* reexport safe */ _bbox__WEBPACK_IMPORTED_MODULE_2__.translate),\n/* harmony export */ \"wrapText\": () => (/* reexport safe */ _export__WEBPACK_IMPORTED_MODULE_0__.wrapText)\n/* harmony export */ });\n/* harmony import */ var _export__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./export */ \"../utils/export.ts\");\n/* harmony import */ var _withinBounds__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./withinBounds */ \"../utils/withinBounds.ts\");\n/* harmony import */ var _bbox__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./bbox */ \"../utils/bbox.ts\");\n\n\n\n\n//# sourceURL=webpack://ExcalidrawLib/../utils/index.ts?");
3602
3602
 
3603
3603
  /***/ }),
3604
3604