diff --git a/packages/fossflow-lib/dist/components/ContextMenu/ContextMenu.d.ts b/packages/fossflow-lib/dist/components/ContextMenu/ContextMenu.d.ts index 51d8033..51480ee 100644 --- a/packages/fossflow-lib/dist/components/ContextMenu/ContextMenu.d.ts +++ b/packages/fossflow-lib/dist/components/ContextMenu/ContextMenu.d.ts @@ -1,13 +1,11 @@ -import { Coords } from '../../types'; interface MenuItemI { label: string; onClick: () => void; } interface Props { onClose: () => void; - position: Coords; - anchorEl?: HTMLElement; + anchorEl?: HTMLElement | null; menuItems: MenuItemI[]; } -export declare const ContextMenu: ({ onClose, position, anchorEl, menuItems }: Props) => import("react/jsx-runtime").JSX.Element; +export declare const ContextMenu: ({ onClose, anchorEl, menuItems }: Props) => import("react/jsx-runtime").JSX.Element; export {}; diff --git a/packages/fossflow-lib/dist/components/ContextMenu/ContextMenuManager.d.ts b/packages/fossflow-lib/dist/components/ContextMenu/ContextMenuManager.d.ts index b1ca3d1..e353891 100644 --- a/packages/fossflow-lib/dist/components/ContextMenu/ContextMenuManager.d.ts +++ b/packages/fossflow-lib/dist/components/ContextMenu/ContextMenuManager.d.ts @@ -1,5 +1,5 @@ interface Props { - anchorEl?: HTMLElement; + anchorEl?: HTMLElement | null; } -export declare const ContextMenuManager: ({ anchorEl }: Props) => import("react/jsx-runtime").JSX.Element | null; +export declare const ContextMenuManager: ({ anchorEl }: Props) => import("react/jsx-runtime").JSX.Element; export {}; diff --git a/packages/fossflow-lib/dist/i18n/index.d.ts b/packages/fossflow-lib/dist/i18n/index.d.ts index 7c7b773..c2f6a07 100644 --- a/packages/fossflow-lib/dist/i18n/index.d.ts +++ b/packages/fossflow-lib/dist/i18n/index.d.ts @@ -8,5 +8,7 @@ declare const locales: { 'bn-BD': import("../types").LocaleProps; 'ru-RU': import("../types").LocaleProps; 'pl-PL': import("../types").LocaleProps; + 'id-ID': import("../types").LocaleProps; + 'it-IT': import("../types").LocaleProps; }; export default locales; diff --git a/packages/fossflow-lib/dist/index.js b/packages/fossflow-lib/dist/index.js index 9a29656..bf47ca2 100644 --- a/packages/fossflow-lib/dist/index.js +++ b/packages/fossflow-lib/dist/index.js @@ -9007,7 +9007,7 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ ContextMenu: () => (/* binding */ ContextMenu)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/Menu/Menu.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/MenuItem/MenuItem.js\");\n\n\nvar ContextMenu = function ContextMenu(_ref) {\n var onClose = _ref.onClose,\n position = _ref.position,\n anchorEl = _ref.anchorEl,\n menuItems = _ref.menuItems;\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n open: true,\n anchorEl: anchorEl,\n style: {\n left: position.x,\n top: position.y\n },\n onClose: onClose\n }, menuItems.map(function (item, index) {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n key: index,\n onClick: item.onClick\n }, item.label);\n }));\n};\n\n//# sourceURL=webpack://fossflow/./src/components/ContextMenu/ContextMenu.tsx?\n}"); +eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ ContextMenu: () => (/* binding */ ContextMenu)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/Menu/Menu.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/MenuItem/MenuItem.js\");\n\n\nvar ContextMenu = function ContextMenu(_ref) {\n var onClose = _ref.onClose,\n anchorEl = _ref.anchorEl,\n menuItems = _ref.menuItems;\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n open: !!anchorEl,\n anchorEl: anchorEl,\n onClose: onClose\n }, menuItems.map(function (item, index) {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n key: index,\n onClick: item.onClick\n }, item.label);\n }));\n};\n\n//# sourceURL=webpack://fossflow/./src/components/ContextMenu/ContextMenu.tsx?\n}"); /***/ }), @@ -9018,7 +9018,7 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ ContextMenuManager: () => (/* binding */ ContextMenuManager)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! src/stores/uiStateStore */ \"./src/stores/uiStateStore.tsx\");\n/* harmony import */ var src_utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! src/utils */ \"./src/utils/index.ts\");\n/* harmony import */ var src_hooks_useScene__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! src/hooks/useScene */ \"./src/hooks/useScene.ts\");\n/* harmony import */ var src_stores_modelStore__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! src/stores/modelStore */ \"./src/stores/modelStore.tsx\");\n/* harmony import */ var src_config__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! src/config */ \"./src/config.ts\");\n/* harmony import */ var _ContextMenu__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./ContextMenu */ \"./src/components/ContextMenu/ContextMenu.tsx\");\nfunction _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\n\n\n\n\n\n\n\nvar ContextMenuManager = function ContextMenuManager(_ref) {\n var anchorEl = _ref.anchorEl;\n var scene = (0,src_hooks_useScene__WEBPACK_IMPORTED_MODULE_3__.useScene)();\n var model = (0,src_stores_modelStore__WEBPACK_IMPORTED_MODULE_4__.useModelStore)(function (state) {\n return state;\n });\n var zoom = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_1__.useUiStateStore)(function (state) {\n return state.zoom;\n });\n var contextMenu = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_1__.useUiStateStore)(function (state) {\n return state.contextMenu;\n });\n var uiStateActions = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_1__.useUiStateStore)(function (state) {\n return state.actions;\n });\n var onClose = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () {\n uiStateActions.setContextMenu(null);\n }, [uiStateActions]);\n if (!contextMenu) {\n return null;\n }\n if (contextMenu.type === 'EMPTY') {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ContextMenu__WEBPACK_IMPORTED_MODULE_6__.ContextMenu, {\n anchorEl: anchorEl,\n onClose: onClose,\n position: src_utils__WEBPACK_IMPORTED_MODULE_2__.CoordsUtils.multiply((0,src_utils__WEBPACK_IMPORTED_MODULE_2__.getTilePosition)({\n tile: contextMenu.tile\n }), zoom),\n menuItems: [{\n label: 'Add Node',\n onClick: function onClick() {\n if (model.icons.length > 0) {\n var modelItemId = (0,src_utils__WEBPACK_IMPORTED_MODULE_2__.generateId)();\n var firstIcon = model.icons[0];\n\n // Find nearest unoccupied tile (should return the same tile since context menu is for empty tiles)\n var targetTile = (0,src_utils__WEBPACK_IMPORTED_MODULE_2__.findNearestUnoccupiedTile)(contextMenu.tile, scene) || contextMenu.tile;\n scene.placeIcon({\n modelItem: {\n id: modelItemId,\n name: 'Untitled',\n icon: firstIcon.id\n },\n viewItem: _objectSpread(_objectSpread({}, src_config__WEBPACK_IMPORTED_MODULE_5__.VIEW_ITEM_DEFAULTS), {}, {\n id: modelItemId,\n tile: targetTile\n })\n });\n }\n onClose();\n }\n }, {\n label: 'Add Rectangle',\n onClick: function onClick() {\n if (model.colors.length > 0) {\n scene.createRectangle({\n id: (0,src_utils__WEBPACK_IMPORTED_MODULE_2__.generateId)(),\n color: model.colors[0].id,\n from: contextMenu.tile,\n to: contextMenu.tile\n });\n }\n onClose();\n }\n }]\n });\n }\n\n // Remove ITEM context menu since layer ordering only works for rectangles\n // and provides no value for regular diagram items\n\n return null;\n};\n\n//# sourceURL=webpack://fossflow/./src/components/ContextMenu/ContextMenuManager.tsx?\n}"); +eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ ContextMenuManager: () => (/* binding */ ContextMenuManager)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! src/stores/uiStateStore */ \"./src/stores/uiStateStore.tsx\");\n/* harmony import */ var src_utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! src/utils */ \"./src/utils/index.ts\");\n/* harmony import */ var src_hooks_useScene__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! src/hooks/useScene */ \"./src/hooks/useScene.ts\");\n/* harmony import */ var src_stores_modelStore__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! src/stores/modelStore */ \"./src/stores/modelStore.tsx\");\n/* harmony import */ var src_config__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! src/config */ \"./src/config.ts\");\n/* harmony import */ var _ContextMenu__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./ContextMenu */ \"./src/components/ContextMenu/ContextMenu.tsx\");\nfunction _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\n\n\n\n\n\n\n\nvar ContextMenuManager = function ContextMenuManager(_ref) {\n var anchorEl = _ref.anchorEl;\n var scene = (0,src_hooks_useScene__WEBPACK_IMPORTED_MODULE_3__.useScene)();\n var model = (0,src_stores_modelStore__WEBPACK_IMPORTED_MODULE_4__.useModelStore)(function (state) {\n return state;\n });\n var contextMenu = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_1__.useUiStateStore)(function (state) {\n return state.contextMenu;\n });\n var uiStateActions = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_1__.useUiStateStore)(function (state) {\n return state.actions;\n });\n var onClose = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () {\n uiStateActions.setContextMenu(null);\n }, [uiStateActions]);\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ContextMenu__WEBPACK_IMPORTED_MODULE_6__.ContextMenu, {\n anchorEl: anchorEl,\n onClose: onClose,\n menuItems: [{\n label: 'Add Node',\n onClick: function onClick() {\n if (!contextMenu) return;\n if (model.icons.length > 0) {\n var modelItemId = (0,src_utils__WEBPACK_IMPORTED_MODULE_2__.generateId)();\n var firstIcon = model.icons[0];\n\n // Find nearest unoccupied tile (should return the same tile since context menu is for empty tiles)\n var targetTile = (0,src_utils__WEBPACK_IMPORTED_MODULE_2__.findNearestUnoccupiedTile)(contextMenu.tile, scene) || contextMenu.tile;\n scene.placeIcon({\n modelItem: {\n id: modelItemId,\n name: 'Untitled',\n icon: firstIcon.id\n },\n viewItem: _objectSpread(_objectSpread({}, src_config__WEBPACK_IMPORTED_MODULE_5__.VIEW_ITEM_DEFAULTS), {}, {\n id: modelItemId,\n tile: targetTile\n })\n });\n }\n onClose();\n }\n }, {\n label: 'Add Rectangle',\n onClick: function onClick() {\n if (!contextMenu) return;\n if (model.colors.length > 0) {\n scene.createRectangle({\n id: (0,src_utils__WEBPACK_IMPORTED_MODULE_2__.generateId)(),\n color: model.colors[0].id,\n from: contextMenu.tile,\n to: contextMenu.tile\n });\n }\n onClose();\n }\n }]\n });\n\n // Remove ITEM context menu since layer ordering only works for rectangles\n // and provides no value for regular diagram items\n};\n\n//# sourceURL=webpack://fossflow/./src/components/ContextMenu/ContextMenuManager.tsx?\n}"); /***/ }), @@ -9348,7 +9348,7 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ ControlsContainer: () => (/* binding */ ControlsContainer)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/Box/Box.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/Divider/Divider.js\");\n\n\nvar ControlsContainer = function ControlsContainer(_ref) {\n var header = _ref.header,\n children = _ref.children;\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n position: 'relative',\n height: '100%',\n width: '100%',\n display: 'flex',\n flexDirection: 'column',\n pb: 2\n }\n }, header && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n width: '100%',\n zIndex: 1,\n position: 'sticky',\n bgcolor: 'background.paper',\n top: 0\n }\n }, header, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_2__[\"default\"], null)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n width: '100%',\n flexGrow: 1\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n width: '100%'\n }\n }, children)));\n};\n\n//# sourceURL=webpack://fossflow/./src/components/ItemControls/components/ControlsContainer.tsx?\n}"); +eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ ControlsContainer: () => (/* binding */ ControlsContainer)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/Box/Box.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/Divider/Divider.js\");\n\n\nvar ControlsContainer = function ControlsContainer(_ref) {\n var header = _ref.header,\n children = _ref.children;\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n onMouseDown: function onMouseDown(e) {\n return e.stopPropagation();\n },\n onContextMenu: function onContextMenu(e) {\n return e.stopPropagation();\n },\n sx: {\n position: 'relative',\n height: '100%',\n width: '100%',\n display: 'flex',\n flexDirection: 'column',\n pb: 2\n }\n }, header && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n width: '100%',\n zIndex: 1,\n position: 'sticky',\n bgcolor: 'background.paper',\n top: 0\n }\n }, header, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_2__[\"default\"], null)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n width: '100%',\n flexGrow: 1\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n width: '100%'\n }\n }, children)));\n};\n\n//# sourceURL=webpack://fossflow/./src/components/ItemControls/components/ControlsContainer.tsx?\n}"); /***/ }), @@ -9788,7 +9788,7 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ UiOverlay: () => (/* binding */ UiOverlay)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/Box/Box.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/Stack/Stack.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/Typography/Typography.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/styles/useTheme.js\");\n/* harmony import */ var _mui_icons_material__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @mui/icons-material */ \"../../node_modules/@mui/icons-material/esm/ChevronRight.js\");\n/* harmony import */ var src_types__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! src/types */ \"./src/types/index.ts\");\n/* harmony import */ var components_UiElement_UiElement__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! components/UiElement/UiElement */ \"./src/components/UiElement/UiElement.tsx\");\n/* harmony import */ var src_components_SceneLayer_SceneLayer__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! src/components/SceneLayer/SceneLayer */ \"./src/components/SceneLayer/SceneLayer.tsx\");\n/* harmony import */ var src_components_DragAndDrop_DragAndDrop__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! src/components/DragAndDrop/DragAndDrop */ \"./src/components/DragAndDrop/DragAndDrop.tsx\");\n/* harmony import */ var src_components_ItemControls_ItemControlsManager__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! src/components/ItemControls/ItemControlsManager */ \"./src/components/ItemControls/ItemControlsManager.tsx\");\n/* harmony import */ var src_components_ToolMenu_ToolMenu__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! src/components/ToolMenu/ToolMenu */ \"./src/components/ToolMenu/ToolMenu.tsx\");\n/* harmony import */ var src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! src/stores/uiStateStore */ \"./src/stores/uiStateStore.tsx\");\n/* harmony import */ var src_components_MainMenu_MainMenu__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! src/components/MainMenu/MainMenu */ \"./src/components/MainMenu/MainMenu.tsx\");\n/* harmony import */ var src_components_ZoomControls_ZoomControls__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! src/components/ZoomControls/ZoomControls */ \"./src/components/ZoomControls/ZoomControls.tsx\");\n/* harmony import */ var src_components_DebugUtils_DebugUtils__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! src/components/DebugUtils/DebugUtils */ \"./src/components/DebugUtils/DebugUtils.tsx\");\n/* harmony import */ var src_hooks_useResizeObserver__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! src/hooks/useResizeObserver */ \"./src/hooks/useResizeObserver.ts\");\n/* harmony import */ var src_components_ContextMenu_ContextMenuManager__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! src/components/ContextMenu/ContextMenuManager */ \"./src/components/ContextMenu/ContextMenuManager.tsx\");\n/* harmony import */ var src_hooks_useScene__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! src/hooks/useScene */ \"./src/hooks/useScene.ts\");\n/* harmony import */ var src_stores_modelStore__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! src/stores/modelStore */ \"./src/stores/modelStore.tsx\");\n/* harmony import */ var _ExportImageDialog_ExportImageDialog__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../ExportImageDialog/ExportImageDialog */ \"./src/components/ExportImageDialog/ExportImageDialog.tsx\");\n/* harmony import */ var _HelpDialog_HelpDialog__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../HelpDialog/HelpDialog */ \"./src/components/HelpDialog/HelpDialog.tsx\");\n/* harmony import */ var _SettingsDialog_SettingsDialog__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../SettingsDialog/SettingsDialog */ \"./src/components/SettingsDialog/SettingsDialog.tsx\");\n/* harmony import */ var _ConnectorHintTooltip_ConnectorHintTooltip__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../ConnectorHintTooltip/ConnectorHintTooltip */ \"./src/components/ConnectorHintTooltip/ConnectorHintTooltip.tsx\");\n/* harmony import */ var _ConnectorEmptySpaceTooltip_ConnectorEmptySpaceTooltip__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../ConnectorEmptySpaceTooltip/ConnectorEmptySpaceTooltip */ \"./src/components/ConnectorEmptySpaceTooltip/ConnectorEmptySpaceTooltip.tsx\");\n/* harmony import */ var _ConnectorRerouteTooltip_ConnectorRerouteTooltip__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ../ConnectorRerouteTooltip/ConnectorRerouteTooltip */ \"./src/components/ConnectorRerouteTooltip/ConnectorRerouteTooltip.tsx\");\n/* harmony import */ var _ImportHintTooltip_ImportHintTooltip__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ../ImportHintTooltip/ImportHintTooltip */ \"./src/components/ImportHintTooltip/ImportHintTooltip.tsx\");\n/* harmony import */ var _LassoHintTooltip_LassoHintTooltip__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ../LassoHintTooltip/LassoHintTooltip */ \"./src/components/LassoHintTooltip/LassoHintTooltip.tsx\");\n/* harmony import */ var _LazyLoadingWelcomeNotification_LazyLoadingWelcomeNotification__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! ../LazyLoadingWelcomeNotification/LazyLoadingWelcomeNotification */ \"./src/components/LazyLoadingWelcomeNotification/LazyLoadingWelcomeNotification.tsx\");\nfunction _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nfunction _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\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\nvar ToolsEnum = {\n MAIN_MENU: 'MAIN_MENU',\n ZOOM_CONTROLS: 'ZOOM_CONTROLS',\n TOOL_MENU: 'TOOL_MENU',\n ITEM_CONTROLS: 'ITEM_CONTROLS',\n VIEW_TITLE: 'VIEW_TITLE'\n};\nvar EDITOR_MODE_MAPPING = _defineProperty(_defineProperty(_defineProperty({}, src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.EDITABLE, ['ITEM_CONTROLS', 'ZOOM_CONTROLS', 'TOOL_MENU', 'MAIN_MENU', 'VIEW_TITLE']), src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.EXPLORABLE_READONLY, ['ZOOM_CONTROLS', 'VIEW_TITLE']), src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.NON_INTERACTIVE, []);\nvar getEditorModeMapping = function getEditorModeMapping(editorMode) {\n var availableUiFeatures = EDITOR_MODE_MAPPING[editorMode];\n return availableUiFeatures;\n};\nvar UiOverlay = function UiOverlay() {\n var theme = (0,_mui_material__WEBPACK_IMPORTED_MODULE_4__[\"default\"])();\n var contextMenuAnchorRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)();\n var toolMenuRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);\n var appPadding = theme.customVars.appPadding;\n var spacing = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function (multiplier) {\n return parseInt(theme.spacing(multiplier), 10);\n }, [theme]);\n var uiStateActions = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.actions;\n });\n var enableDebugTools = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.enableDebugTools;\n });\n var mode = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.mode;\n });\n var mouse = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.mouse;\n });\n var dialog = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.dialog;\n });\n var itemControls = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.itemControls;\n });\n var _useScene = (0,src_hooks_useScene__WEBPACK_IMPORTED_MODULE_18__.useScene)(),\n currentView = _useScene.currentView;\n var editorMode = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.editorMode;\n });\n var availableTools = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(function () {\n return getEditorModeMapping(editorMode);\n }, [editorMode]);\n var rendererEl = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.rendererEl;\n });\n var title = (0,src_stores_modelStore__WEBPACK_IMPORTED_MODULE_19__.useModelStore)(function (state) {\n return state.title;\n });\n var iconPackManager = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.iconPackManager;\n });\n var _useResizeObserver = (0,src_hooks_useResizeObserver__WEBPACK_IMPORTED_MODULE_16__.useResizeObserver)(rendererEl),\n rendererSize = _useResizeObserver.size;\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n position: 'absolute',\n width: 0,\n height: 0,\n top: 0,\n left: 0\n }\n }, availableTools.includes('ITEM_CONTROLS') && itemControls && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(components_UiElement_UiElement__WEBPACK_IMPORTED_MODULE_7__.UiElement, {\n sx: {\n position: 'absolute',\n width: '360px',\n overflowY: 'scroll',\n '&::-webkit-scrollbar': {\n display: 'none'\n }\n },\n style: {\n left: appPadding.x,\n top: appPadding.y * 2 + spacing(2),\n maxHeight: rendererSize.height - appPadding.y * 6\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_ItemControls_ItemControlsManager__WEBPACK_IMPORTED_MODULE_10__.ItemControlsManager, null)), availableTools.includes('TOOL_MENU') && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n ref: toolMenuRef,\n sx: {\n position: 'absolute',\n transform: 'translateX(-100%)'\n },\n style: {\n left: rendererSize.width - appPadding.x,\n top: appPadding.y\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_ToolMenu_ToolMenu__WEBPACK_IMPORTED_MODULE_11__.ToolMenu, null)), availableTools.includes('ZOOM_CONTROLS') && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n position: 'absolute',\n transformOrigin: 'bottom left'\n },\n style: {\n top: rendererSize.height - appPadding.y * 2,\n left: appPadding.x\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_ZoomControls_ZoomControls__WEBPACK_IMPORTED_MODULE_14__.ZoomControls, null)), availableTools.includes('MAIN_MENU') && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n position: 'absolute'\n },\n style: {\n top: appPadding.y,\n left: appPadding.x\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_MainMenu_MainMenu__WEBPACK_IMPORTED_MODULE_13__.MainMenu, null)), availableTools.includes('VIEW_TITLE') && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n position: 'absolute',\n display: 'flex',\n justifyContent: 'center',\n transform: 'translateX(-50%)',\n pointerEvents: 'none'\n },\n style: {\n left: rendererSize.width / 2,\n top: rendererSize.height - appPadding.y * 2,\n width: rendererSize.width - 500,\n height: appPadding.y\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(components_UiElement_UiElement__WEBPACK_IMPORTED_MODULE_7__.UiElement, {\n sx: {\n display: 'inline-flex',\n px: 2,\n alignItems: 'center',\n height: '100%'\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n direction: \"row\",\n alignItems: \"center\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n fontWeight: 600,\n color: \"text.secondary\"\n }, title), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_icons_material__WEBPACK_IMPORTED_MODULE_5__[\"default\"], null), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n fontWeight: 600,\n color: \"text.secondary\"\n }, currentView.name)))), enableDebugTools && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(components_UiElement_UiElement__WEBPACK_IMPORTED_MODULE_7__.UiElement, {\n sx: {\n position: 'absolute',\n width: 350,\n transform: 'translateY(-100%)'\n },\n style: {\n maxWidth: \"calc(\".concat(rendererSize.width, \" - \").concat(appPadding.x * 2, \"px)\"),\n left: appPadding.x,\n top: rendererSize.height - appPadding.y * 2 - spacing(1)\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_DebugUtils_DebugUtils__WEBPACK_IMPORTED_MODULE_15__.DebugUtils, null))), mode.type === 'PLACE_ICON' && mode.id && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_SceneLayer_SceneLayer__WEBPACK_IMPORTED_MODULE_8__.SceneLayer, {\n disableAnimation: true\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_DragAndDrop_DragAndDrop__WEBPACK_IMPORTED_MODULE_9__.DragAndDrop, {\n iconId: mode.id,\n tile: mouse.position.tile\n })), dialog === src_types__WEBPACK_IMPORTED_MODULE_6__.DialogTypeEnum.EXPORT_IMAGE && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ExportImageDialog_ExportImageDialog__WEBPACK_IMPORTED_MODULE_20__.ExportImageDialog, {\n onClose: function onClose() {\n return uiStateActions.setDialog(null);\n }\n }), dialog === src_types__WEBPACK_IMPORTED_MODULE_6__.DialogTypeEnum.HELP && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_HelpDialog_HelpDialog__WEBPACK_IMPORTED_MODULE_21__.HelpDialog, null), dialog === src_types__WEBPACK_IMPORTED_MODULE_6__.DialogTypeEnum.SETTINGS && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_SettingsDialog_SettingsDialog__WEBPACK_IMPORTED_MODULE_22__.SettingsDialog, {\n iconPackManager: iconPackManager || undefined\n }), editorMode === src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.EDITABLE && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ConnectorHintTooltip_ConnectorHintTooltip__WEBPACK_IMPORTED_MODULE_23__.ConnectorHintTooltip, {\n toolMenuRef: toolMenuRef\n }), editorMode === src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.EDITABLE && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ConnectorEmptySpaceTooltip_ConnectorEmptySpaceTooltip__WEBPACK_IMPORTED_MODULE_24__.ConnectorEmptySpaceTooltip, null), editorMode === src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.EDITABLE && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ConnectorRerouteTooltip_ConnectorRerouteTooltip__WEBPACK_IMPORTED_MODULE_25__.ConnectorRerouteTooltip, null), editorMode === src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.EDITABLE && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ImportHintTooltip_ImportHintTooltip__WEBPACK_IMPORTED_MODULE_26__.ImportHintTooltip, null), editorMode === src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.EDITABLE && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_LassoHintTooltip_LassoHintTooltip__WEBPACK_IMPORTED_MODULE_27__.LassoHintTooltip, {\n toolMenuRef: toolMenuRef\n }), iconPackManager && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_LazyLoadingWelcomeNotification_LazyLoadingWelcomeNotification__WEBPACK_IMPORTED_MODULE_28__.LazyLoadingWelcomeNotification, null), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_SceneLayer_SceneLayer__WEBPACK_IMPORTED_MODULE_8__.SceneLayer, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n ref: contextMenuAnchorRef\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_ContextMenu_ContextMenuManager__WEBPACK_IMPORTED_MODULE_17__.ContextMenuManager, {\n anchorEl: contextMenuAnchorRef.current\n })));\n};\n\n//# sourceURL=webpack://fossflow/./src/components/UiOverlay/UiOverlay.tsx?\n}"); +eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ UiOverlay: () => (/* binding */ UiOverlay)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"react\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/Box/Box.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/Stack/Stack.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/Typography/Typography.js\");\n/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @mui/material */ \"../../node_modules/@mui/material/styles/useTheme.js\");\n/* harmony import */ var _mui_icons_material__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @mui/icons-material */ \"../../node_modules/@mui/icons-material/esm/ChevronRight.js\");\n/* harmony import */ var src_types__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! src/types */ \"./src/types/index.ts\");\n/* harmony import */ var components_UiElement_UiElement__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! components/UiElement/UiElement */ \"./src/components/UiElement/UiElement.tsx\");\n/* harmony import */ var src_components_SceneLayer_SceneLayer__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! src/components/SceneLayer/SceneLayer */ \"./src/components/SceneLayer/SceneLayer.tsx\");\n/* harmony import */ var src_components_DragAndDrop_DragAndDrop__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! src/components/DragAndDrop/DragAndDrop */ \"./src/components/DragAndDrop/DragAndDrop.tsx\");\n/* harmony import */ var src_components_ItemControls_ItemControlsManager__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! src/components/ItemControls/ItemControlsManager */ \"./src/components/ItemControls/ItemControlsManager.tsx\");\n/* harmony import */ var src_components_ToolMenu_ToolMenu__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! src/components/ToolMenu/ToolMenu */ \"./src/components/ToolMenu/ToolMenu.tsx\");\n/* harmony import */ var src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! src/stores/uiStateStore */ \"./src/stores/uiStateStore.tsx\");\n/* harmony import */ var src_components_MainMenu_MainMenu__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! src/components/MainMenu/MainMenu */ \"./src/components/MainMenu/MainMenu.tsx\");\n/* harmony import */ var src_components_ZoomControls_ZoomControls__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! src/components/ZoomControls/ZoomControls */ \"./src/components/ZoomControls/ZoomControls.tsx\");\n/* harmony import */ var src_components_DebugUtils_DebugUtils__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! src/components/DebugUtils/DebugUtils */ \"./src/components/DebugUtils/DebugUtils.tsx\");\n/* harmony import */ var src_hooks_useResizeObserver__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! src/hooks/useResizeObserver */ \"./src/hooks/useResizeObserver.ts\");\n/* harmony import */ var src_components_ContextMenu_ContextMenuManager__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! src/components/ContextMenu/ContextMenuManager */ \"./src/components/ContextMenu/ContextMenuManager.tsx\");\n/* harmony import */ var src_hooks_useScene__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! src/hooks/useScene */ \"./src/hooks/useScene.ts\");\n/* harmony import */ var src_stores_modelStore__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! src/stores/modelStore */ \"./src/stores/modelStore.tsx\");\n/* harmony import */ var _ExportImageDialog_ExportImageDialog__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../ExportImageDialog/ExportImageDialog */ \"./src/components/ExportImageDialog/ExportImageDialog.tsx\");\n/* harmony import */ var _HelpDialog_HelpDialog__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../HelpDialog/HelpDialog */ \"./src/components/HelpDialog/HelpDialog.tsx\");\n/* harmony import */ var _SettingsDialog_SettingsDialog__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../SettingsDialog/SettingsDialog */ \"./src/components/SettingsDialog/SettingsDialog.tsx\");\n/* harmony import */ var _ConnectorHintTooltip_ConnectorHintTooltip__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../ConnectorHintTooltip/ConnectorHintTooltip */ \"./src/components/ConnectorHintTooltip/ConnectorHintTooltip.tsx\");\n/* harmony import */ var _ConnectorEmptySpaceTooltip_ConnectorEmptySpaceTooltip__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../ConnectorEmptySpaceTooltip/ConnectorEmptySpaceTooltip */ \"./src/components/ConnectorEmptySpaceTooltip/ConnectorEmptySpaceTooltip.tsx\");\n/* harmony import */ var _ConnectorRerouteTooltip_ConnectorRerouteTooltip__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ../ConnectorRerouteTooltip/ConnectorRerouteTooltip */ \"./src/components/ConnectorRerouteTooltip/ConnectorRerouteTooltip.tsx\");\n/* harmony import */ var _ImportHintTooltip_ImportHintTooltip__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ../ImportHintTooltip/ImportHintTooltip */ \"./src/components/ImportHintTooltip/ImportHintTooltip.tsx\");\n/* harmony import */ var _LassoHintTooltip_LassoHintTooltip__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ../LassoHintTooltip/LassoHintTooltip */ \"./src/components/LassoHintTooltip/LassoHintTooltip.tsx\");\n/* harmony import */ var _LazyLoadingWelcomeNotification_LazyLoadingWelcomeNotification__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! ../LazyLoadingWelcomeNotification/LazyLoadingWelcomeNotification */ \"./src/components/LazyLoadingWelcomeNotification/LazyLoadingWelcomeNotification.tsx\");\n/* harmony import */ var src_utils__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! src/utils */ \"./src/utils/index.ts\");\nfunction _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nfunction _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\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\nvar ToolsEnum = {\n MAIN_MENU: 'MAIN_MENU',\n ZOOM_CONTROLS: 'ZOOM_CONTROLS',\n TOOL_MENU: 'TOOL_MENU',\n ITEM_CONTROLS: 'ITEM_CONTROLS',\n VIEW_TITLE: 'VIEW_TITLE'\n};\nvar EDITOR_MODE_MAPPING = _defineProperty(_defineProperty(_defineProperty({}, src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.EDITABLE, ['ITEM_CONTROLS', 'ZOOM_CONTROLS', 'TOOL_MENU', 'MAIN_MENU', 'VIEW_TITLE']), src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.EXPLORABLE_READONLY, ['ZOOM_CONTROLS', 'VIEW_TITLE']), src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.NON_INTERACTIVE, []);\nvar getEditorModeMapping = function getEditorModeMapping(editorMode) {\n var availableUiFeatures = EDITOR_MODE_MAPPING[editorMode];\n return availableUiFeatures;\n};\nvar UiOverlay = function UiOverlay() {\n var theme = (0,_mui_material__WEBPACK_IMPORTED_MODULE_4__[\"default\"])();\n var contextMenuAnchorRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)();\n var toolMenuRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);\n var appPadding = theme.customVars.appPadding;\n var spacing = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function (multiplier) {\n return parseInt(theme.spacing(multiplier), 10);\n }, [theme]);\n var uiStateActions = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.actions;\n });\n var enableDebugTools = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.enableDebugTools;\n });\n var mode = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.mode;\n });\n var mouse = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.mouse;\n });\n var dialog = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.dialog;\n });\n var itemControls = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.itemControls;\n });\n var _useScene = (0,src_hooks_useScene__WEBPACK_IMPORTED_MODULE_18__.useScene)(),\n currentView = _useScene.currentView;\n var editorMode = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.editorMode;\n });\n var availableTools = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(function () {\n return getEditorModeMapping(editorMode);\n }, [editorMode]);\n var rendererEl = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.rendererEl;\n });\n var title = (0,src_stores_modelStore__WEBPACK_IMPORTED_MODULE_19__.useModelStore)(function (state) {\n return state.title;\n });\n var iconPackManager = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.iconPackManager;\n });\n var contextMenu = (0,src_stores_uiStateStore__WEBPACK_IMPORTED_MODULE_12__.useUiStateStore)(function (state) {\n return state.contextMenu;\n });\n var _useResizeObserver = (0,src_hooks_useResizeObserver__WEBPACK_IMPORTED_MODULE_16__.useResizeObserver)(rendererEl),\n rendererSize = _useResizeObserver.size;\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n position: 'absolute',\n width: 0,\n height: 0,\n top: 0,\n left: 0\n }\n }, availableTools.includes('ITEM_CONTROLS') && itemControls && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(components_UiElement_UiElement__WEBPACK_IMPORTED_MODULE_7__.UiElement, {\n sx: {\n position: 'absolute',\n width: '360px',\n overflowY: 'scroll',\n '&::-webkit-scrollbar': {\n display: 'none'\n }\n },\n style: {\n left: appPadding.x,\n top: appPadding.y * 2 + spacing(2),\n maxHeight: rendererSize.height - appPadding.y * 6\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_ItemControls_ItemControlsManager__WEBPACK_IMPORTED_MODULE_10__.ItemControlsManager, null)), availableTools.includes('TOOL_MENU') && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n ref: toolMenuRef,\n sx: {\n position: 'absolute',\n transform: 'translateX(-100%)'\n },\n style: {\n left: rendererSize.width - appPadding.x,\n top: appPadding.y\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_ToolMenu_ToolMenu__WEBPACK_IMPORTED_MODULE_11__.ToolMenu, null)), availableTools.includes('ZOOM_CONTROLS') && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n position: 'absolute',\n transformOrigin: 'bottom left'\n },\n style: {\n top: rendererSize.height - appPadding.y * 2,\n left: appPadding.x\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_ZoomControls_ZoomControls__WEBPACK_IMPORTED_MODULE_14__.ZoomControls, null)), availableTools.includes('MAIN_MENU') && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n position: 'absolute'\n },\n style: {\n top: appPadding.y,\n left: appPadding.x\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_MainMenu_MainMenu__WEBPACK_IMPORTED_MODULE_13__.MainMenu, null)), availableTools.includes('VIEW_TITLE') && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n sx: {\n position: 'absolute',\n display: 'flex',\n justifyContent: 'center',\n transform: 'translateX(-50%)',\n pointerEvents: 'none'\n },\n style: {\n left: rendererSize.width / 2,\n top: rendererSize.height - appPadding.y * 2,\n width: rendererSize.width - 500,\n height: appPadding.y\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(components_UiElement_UiElement__WEBPACK_IMPORTED_MODULE_7__.UiElement, {\n sx: {\n display: 'inline-flex',\n px: 2,\n alignItems: 'center',\n height: '100%'\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n direction: \"row\",\n alignItems: \"center\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n fontWeight: 600,\n color: \"text.secondary\"\n }, title), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_icons_material__WEBPACK_IMPORTED_MODULE_5__[\"default\"], null), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n fontWeight: 600,\n color: \"text.secondary\"\n }, currentView.name)))), enableDebugTools && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(components_UiElement_UiElement__WEBPACK_IMPORTED_MODULE_7__.UiElement, {\n sx: {\n position: 'absolute',\n width: 350,\n transform: 'translateY(-100%)'\n },\n style: {\n maxWidth: \"calc(\".concat(rendererSize.width, \" - \").concat(appPadding.x * 2, \"px)\"),\n left: appPadding.x,\n top: rendererSize.height - appPadding.y * 2 - spacing(1)\n }\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_DebugUtils_DebugUtils__WEBPACK_IMPORTED_MODULE_15__.DebugUtils, null))), mode.type === 'PLACE_ICON' && mode.id && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_SceneLayer_SceneLayer__WEBPACK_IMPORTED_MODULE_8__.SceneLayer, {\n disableAnimation: true\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_DragAndDrop_DragAndDrop__WEBPACK_IMPORTED_MODULE_9__.DragAndDrop, {\n iconId: mode.id,\n tile: mouse.position.tile\n })), dialog === src_types__WEBPACK_IMPORTED_MODULE_6__.DialogTypeEnum.EXPORT_IMAGE && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ExportImageDialog_ExportImageDialog__WEBPACK_IMPORTED_MODULE_20__.ExportImageDialog, {\n onClose: function onClose() {\n return uiStateActions.setDialog(null);\n }\n }), dialog === src_types__WEBPACK_IMPORTED_MODULE_6__.DialogTypeEnum.HELP && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_HelpDialog_HelpDialog__WEBPACK_IMPORTED_MODULE_21__.HelpDialog, null), dialog === src_types__WEBPACK_IMPORTED_MODULE_6__.DialogTypeEnum.SETTINGS && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_SettingsDialog_SettingsDialog__WEBPACK_IMPORTED_MODULE_22__.SettingsDialog, {\n iconPackManager: iconPackManager || undefined\n }), editorMode === src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.EDITABLE && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ConnectorHintTooltip_ConnectorHintTooltip__WEBPACK_IMPORTED_MODULE_23__.ConnectorHintTooltip, {\n toolMenuRef: toolMenuRef\n }), editorMode === src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.EDITABLE && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ConnectorEmptySpaceTooltip_ConnectorEmptySpaceTooltip__WEBPACK_IMPORTED_MODULE_24__.ConnectorEmptySpaceTooltip, null), editorMode === src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.EDITABLE && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ConnectorRerouteTooltip_ConnectorRerouteTooltip__WEBPACK_IMPORTED_MODULE_25__.ConnectorRerouteTooltip, null), editorMode === src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.EDITABLE && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ImportHintTooltip_ImportHintTooltip__WEBPACK_IMPORTED_MODULE_26__.ImportHintTooltip, null), editorMode === src_types__WEBPACK_IMPORTED_MODULE_6__.EditorModeEnum.EDITABLE && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_LassoHintTooltip_LassoHintTooltip__WEBPACK_IMPORTED_MODULE_27__.LassoHintTooltip, {\n toolMenuRef: toolMenuRef\n }), iconPackManager && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_LazyLoadingWelcomeNotification_LazyLoadingWelcomeNotification__WEBPACK_IMPORTED_MODULE_28__.LazyLoadingWelcomeNotification, null), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_SceneLayer_SceneLayer__WEBPACK_IMPORTED_MODULE_8__.SceneLayer, null, contextMenu && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_mui_material__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n ref: contextMenuAnchorRef,\n sx: {\n position: 'absolute',\n left: (0,src_utils__WEBPACK_IMPORTED_MODULE_29__.getTilePosition)({\n tile: contextMenu.tile\n }).x,\n top: (0,src_utils__WEBPACK_IMPORTED_MODULE_29__.getTilePosition)({\n tile: contextMenu.tile\n }).y\n }\n }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(src_components_ContextMenu_ContextMenuManager__WEBPACK_IMPORTED_MODULE_17__.ContextMenuManager, {\n anchorEl: contextMenu && contextMenu.type === \"EMPTY\" ? contextMenuAnchorRef.current : null\n })));\n};\n\n//# sourceURL=webpack://fossflow/./src/components/UiOverlay/UiOverlay.tsx?\n}"); /***/ }), @@ -10096,7 +10096,7 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\nvar locale = {\n common: {\n exampleText: \"Este es un texto de ejemplo\"\n },\n mainMenu: {\n undo: \"Deshacer\",\n redo: \"Rehacer\",\n open: \"Abrir\",\n exportJson: \"Exportar como JSON\",\n exportCompactJson: \"Exportar como JSON compacto\",\n exportImage: \"Exportar como imagen\",\n clearCanvas: \"Limpiar el lienzo\",\n settings: \"Configuración\",\n gitHub: \"GitHub\"\n },\n helpDialog: {\n title: \"Atajos de teclado y ayuda\",\n close: \"Cerrar\",\n keyboardShortcuts: \"Atajos de teclado\",\n mouseInteractions: \"Interacciones del ratón\",\n action: \"Acción\",\n shortcut: \"Atajo\",\n method: \"Método\",\n description: \"Descripción\",\n note: \"Nota:\",\n noteContent: \"Los atajos de teclado se desactivan al escribir en campos de entrada, áreas de texto o elementos editables para evitar conflictos.\",\n // Keyboard shortcuts\n undoAction: \"Deshacer\",\n undoDescription: \"Deshacer la última acción\",\n redoAction: \"Rehacer\",\n redoDescription: \"Rehacer la última acción deshecha\",\n redoAltAction: \"Rehacer (Alternativo)\",\n redoAltDescription: \"Atajo alternativo para rehacer\",\n helpAction: \"Ayuda\",\n helpDescription: \"Abrir diálogo de ayuda con atajos de teclado\",\n zoomInAction: \"Acercar\",\n zoomInShortcut: \"Rueda del ratón hacia arriba\",\n zoomInDescription: \"Acercar en el lienzo\",\n zoomOutAction: \"Alejar\",\n zoomOutShortcut: \"Rueda del ratón hacia abajo\",\n zoomOutDescription: \"Alejar del lienzo\",\n panCanvasAction: \"Desplazar lienzo\",\n panCanvasShortcut: \"Clic izquierdo + Arrastrar\",\n panCanvasDescription: \"Desplazar el lienzo en modo desplazamiento\",\n contextMenuAction: \"Menú contextual\",\n contextMenuShortcut: \"Clic derecho\",\n contextMenuDescription: \"Abrir menú contextual para elementos o espacio vacío\",\n // Mouse interactions\n selectToolAction: \"Herramienta de selección\",\n selectToolShortcut: \"Clic en botón Seleccionar\",\n selectToolDescription: \"Cambiar al modo de selección\",\n panToolAction: \"Herramienta de desplazamiento\",\n panToolShortcut: \"Clic en botón Desplazar\",\n panToolDescription: \"Cambiar al modo de desplazamiento para mover el lienzo\",\n addItemAction: \"Añadir elemento\",\n addItemShortcut: \"Clic en botón Añadir elemento\",\n addItemDescription: \"Abrir selector de iconos para añadir nuevos elementos\",\n drawRectangleAction: \"Dibujar rectángulo\",\n drawRectangleShortcut: \"Clic en botón Rectángulo\",\n drawRectangleDescription: \"Cambiar al modo de dibujo de rectángulos\",\n createConnectorAction: \"Crear conector\",\n createConnectorShortcut: \"Clic en botón Conector\",\n createConnectorDescription: \"Cambiar al modo de conector\",\n addTextAction: \"Añadir texto\",\n addTextShortcut: \"Clic en botón Texto\",\n addTextDescription: \"Crear un nuevo cuadro de texto\"\n },\n connectorHintTooltip: {\n tipCreatingConnectors: \"Consejo: Crear conectores\",\n tipConnectorTools: \"Consejo: Herramientas de conectores\",\n clickInstructionStart: \"Haz clic\",\n clickInstructionMiddle: \"en el primer nodo o punto, luego\",\n clickInstructionEnd: \"en el segundo nodo o punto para crear una conexión.\",\n nowClickTarget: \"Ahora haz clic en el objetivo para completar la conexión.\",\n dragStart: \"Arrastra\",\n dragEnd: \"desde el primer nodo al segundo nodo para crear una conexión.\",\n rerouteStart: \"Para cambiar la ruta de un conector,\",\n rerouteMiddle: \"haz clic izquierdo\",\n rerouteEnd: \"en cualquier punto a lo largo de la línea del conector y arrastra para crear o mover puntos de anclaje.\"\n },\n lassoHintTooltip: {\n tipLasso: \"Consejo: Selección de lazo\",\n tipFreehandLasso: \"Consejo: Selección de lazo libre\",\n lassoDragStart: \"Haz clic y arrastra\",\n lassoDragEnd: \"para dibujar un cuadro de selección rectangular alrededor de los elementos que deseas seleccionar.\",\n freehandDragStart: \"Haz clic y arrastra\",\n freehandDragMiddle: \"para dibujar una\",\n freehandDragEnd: \"forma libre\",\n freehandComplete: \"alrededor de los elementos. Suelta para seleccionar todos los elementos dentro de la forma.\",\n moveStart: \"Una vez seleccionados,\",\n moveMiddle: \"haz clic dentro de la selección\",\n moveEnd: \"y arrastra para mover todos los elementos seleccionados juntos.\"\n },\n importHintTooltip: {\n title: \"Importar diagramas\",\n instructionStart: \"Para importar diagramas, haz clic en el\",\n menuButton: \"botón de menú\",\n instructionMiddle: \"(☰) en la esquina superior izquierda, luego selecciona\",\n openButton: \"\\\"Abrir\\\"\",\n instructionEnd: \"para cargar tus archivos de diagrama.\"\n },\n connectorRerouteTooltip: {\n title: \"Consejo: Cambiar ruta de conectores\",\n instructionStart: \"Una vez que tus conectores estén colocados, puedes cambiar su ruta como desees.\",\n instructionSelect: \"Selecciona el conector\",\n instructionMiddle: \"primero, luego\",\n instructionClick: \"haz clic en la ruta del conector\",\n instructionAnd: \"y\",\n instructionDrag: \"arrastra\",\n instructionEnd: \"para cambiarlo!\"\n },\n settings: {\n zoom: {\n description: \"Configura el comportamiento del zoom al usar la rueda del ratón.\",\n zoomToCursor: \"Zoom al cursor\",\n zoomToCursorDesc: \"Cuando está habilitado, el zoom se centra en la posición del cursor del ratón. Cuando está deshabilitado, el zoom se centra en el lienzo.\"\n },\n hotkeys: {\n title: \"Configuración de atajos\",\n profile: \"Perfil de atajos\",\n profileQwerty: \"QWERTY (Q, W, E, R, T, Y)\",\n profileSmnrct: \"SMNRCT (S, M, N, R, C, T)\",\n profileNone: \"Sin atajos\",\n tool: \"Herramienta\",\n hotkey: \"Atajo\",\n toolSelect: \"Seleccionar\",\n toolPan: \"Desplazar\",\n toolAddItem: \"Añadir elemento\",\n toolRectangle: \"Rectángulo\",\n toolConnector: \"Conector\",\n toolText: \"Texto\",\n note: \"Nota: Los atajos funcionan cuando no estás escribiendo en campos de texto\"\n },\n pan: {\n title: \"Configuración de desplazamiento\",\n mousePanOptions: \"Opciones de desplazamiento con ratón\",\n emptyAreaClickPan: \"Clic y arrastrar en área vacía\",\n middleClickPan: \"Clic central y arrastrar\",\n rightClickPan: \"Clic derecho y arrastrar\",\n ctrlClickPan: \"Ctrl + clic y arrastrar\",\n altClickPan: \"Alt + clic y arrastrar\",\n keyboardPanOptions: \"Opciones de desplazamiento con teclado\",\n arrowKeys: \"Teclas de flechas\",\n wasdKeys: \"Teclas WASD\",\n ijklKeys: \"Teclas IJKL\",\n keyboardPanSpeed: \"Velocidad de desplazamiento con teclado\",\n note: \"Nota: Las opciones de desplazamiento funcionan además de la herramienta de desplazamiento dedicada\"\n },\n connector: {\n title: \"Configuración de conectores\",\n connectionMode: \"Modo de creación de conexiones\",\n clickMode: \"Modo clic (Recomendado)\",\n clickModeDesc: \"Haz clic en el primer nodo, luego haz clic en el segundo nodo para crear una conexión\",\n dragMode: \"Modo arrastrar\",\n dragModeDesc: \"Haz clic y arrastra desde el primer nodo hasta el segundo nodo\",\n note: \"Nota: Puedes cambiar esta configuración en cualquier momento. El modo seleccionado se usará cuando la herramienta de conector esté activa.\"\n },\n iconPacks: {\n title: \"Gestión de Paquetes de Iconos\",\n lazyLoading: \"Activar Carga Diferida\",\n lazyLoadingDesc: \"Cargar paquetes de iconos bajo demanda para un inicio más rápido\",\n availablePacks: \"Paquetes de Iconos Disponibles\",\n coreIsoflow: \"Core Isoflow (Siempre Cargado)\",\n alwaysEnabled: \"Siempre activado\",\n awsPack: \"Iconos AWS\",\n gcpPack: \"Iconos Google Cloud\",\n azurePack: \"Iconos Azure\",\n kubernetesPack: \"Iconos Kubernetes\",\n loading: \"Cargando...\",\n loaded: \"Cargado\",\n notLoaded: \"No cargado\",\n iconCount: \"{count} iconos\",\n lazyLoadingDisabledNote: \"La carga diferida está desactivada. Todos los paquetes de iconos se cargan al iniciar.\",\n note: \"Los paquetes de iconos se pueden activar o desactivar según tus necesidades. Los paquetes desactivados reducirán el uso de memoria y mejorarán el rendimiento.\"\n }\n },\n lazyLoadingWelcome: {\n title: \"Nueva Funcionalidad: ¡Carga Diferida!\",\n message: \"¡Hola! Después de la demanda popular, hemos implementado la Carga Diferida de iconos, así que ahora si quieres activar paquetes de iconos no estándar puedes activarlos en la sección 'Configuración'.\",\n configPath: \"Haz clic en el icono de Hamburguesa\",\n configPath2: \"en la esquina superior izquierda para acceder a la Configuración.\",\n canDisable: \"Puedes desactivar este comportamiento si lo deseas.\",\n signature: \"-Stan\"\n }\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (locale);\n\n//# sourceURL=webpack://fossflow/./src/i18n/es-ES.ts?\n}"); +eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\nvar locale = {\n common: {\n exampleText: \"Este es un texto de ejemplo\"\n },\n mainMenu: {\n undo: \"Deshacer\",\n redo: \"Rehacer\",\n open: \"Abrir\",\n exportJson: \"Exportar como JSON\",\n exportCompactJson: \"Exportar como JSON compacto\",\n exportImage: \"Exportar como imagen\",\n clearCanvas: \"Limpiar el lienzo\",\n settings: \"Configuración\",\n gitHub: \"GitHub\"\n },\n helpDialog: {\n title: \"Atajos de teclado y ayuda\",\n close: \"Cerrar\",\n keyboardShortcuts: \"Atajos de teclado\",\n mouseInteractions: \"Interacciones del ratón\",\n action: \"Acción\",\n shortcut: \"Atajo\",\n method: \"Método\",\n description: \"Descripción\",\n note: \"Nota:\",\n noteContent: \"Los atajos de teclado se desactivan al escribir en campos de entrada, áreas de texto o elementos editables para evitar conflictos.\",\n // Keyboard shortcuts\n undoAction: \"Deshacer\",\n undoDescription: \"Deshacer la última acción\",\n redoAction: \"Rehacer\",\n redoDescription: \"Rehacer la última acción deshecha\",\n redoAltAction: \"Rehacer (Alternativo)\",\n redoAltDescription: \"Atajo alternativo para rehacer\",\n helpAction: \"Ayuda\",\n helpDescription: \"Abrir diálogo de ayuda con atajos de teclado\",\n zoomInAction: \"Acercar\",\n zoomInShortcut: \"Rueda del ratón hacia arriba\",\n zoomInDescription: \"Acercar en el lienzo\",\n zoomOutAction: \"Alejar\",\n zoomOutShortcut: \"Rueda del ratón hacia abajo\",\n zoomOutDescription: \"Alejar del lienzo\",\n panCanvasAction: \"Desplazar lienzo\",\n panCanvasShortcut: \"Clic izquierdo + Arrastrar\",\n panCanvasDescription: \"Desplazar el lienzo en modo desplazamiento\",\n contextMenuAction: \"Menú contextual\",\n contextMenuShortcut: \"Clic derecho\",\n contextMenuDescription: \"Abrir menú contextual para elementos o espacio vacío\",\n // Mouse interactions\n selectToolAction: \"Herramienta de selección\",\n selectToolShortcut: \"Clic en botón Seleccionar\",\n selectToolDescription: \"Cambiar al modo de selección\",\n panToolAction: \"Herramienta de desplazamiento\",\n panToolShortcut: \"Clic en botón Desplazar\",\n panToolDescription: \"Cambiar al modo de desplazamiento para mover el lienzo\",\n addItemAction: \"Añadir elemento\",\n addItemShortcut: \"Clic en botón Añadir elemento\",\n addItemDescription: \"Abrir selector de iconos para añadir nuevos elementos\",\n drawRectangleAction: \"Dibujar rectángulo\",\n drawRectangleShortcut: \"Clic en botón Rectángulo\",\n drawRectangleDescription: \"Cambiar al modo de dibujo de rectángulos\",\n createConnectorAction: \"Crear conector\",\n createConnectorShortcut: \"Clic en botón Conector\",\n createConnectorDescription: \"Cambiar al modo de conector\",\n addTextAction: \"Añadir texto\",\n addTextShortcut: \"Clic en botón Texto\",\n addTextDescription: \"Crear un nuevo cuadro de texto\"\n },\n connectorHintTooltip: {\n tipCreatingConnectors: \"Consejo: Crear conectores\",\n tipConnectorTools: \"Consejo: Herramientas de conectores\",\n clickInstructionStart: \"Haz clic\",\n clickInstructionMiddle: \"en el primer nodo o punto, luego\",\n clickInstructionEnd: \"en el segundo nodo o punto para crear una conexión.\",\n nowClickTarget: \"Ahora haz clic en el objetivo para completar la conexión.\",\n dragStart: \"Arrastra\",\n dragEnd: \"desde el primer nodo al segundo nodo para crear una conexión.\",\n rerouteStart: \"Para cambiar la ruta de un conector,\",\n rerouteMiddle: \"haz clic izquierdo\",\n rerouteEnd: \"en cualquier punto a lo largo de la línea del conector y arrastra para crear o mover puntos de anclaje.\"\n },\n lassoHintTooltip: {\n tipLasso: \"Consejo: Selección de lazo\",\n tipFreehandLasso: \"Consejo: Selección de lazo libre\",\n lassoDragStart: \"Haz clic y arrastra\",\n lassoDragEnd: \"para dibujar un cuadro de selección rectangular alrededor de los elementos que deseas seleccionar.\",\n freehandDragStart: \"Haz clic y arrastra\",\n freehandDragMiddle: \"para dibujar una\",\n freehandDragEnd: \"forma libre\",\n freehandComplete: \"alrededor de los elementos. Suelta para seleccionar todos los elementos dentro de la forma.\",\n moveStart: \"Una vez seleccionados,\",\n moveMiddle: \"haz clic dentro de la selección\",\n moveEnd: \"y arrastra para mover todos los elementos seleccionados juntos.\"\n },\n importHintTooltip: {\n title: \"Importar diagramas\",\n instructionStart: \"Para importar diagramas, haz clic en el\",\n menuButton: \"botón de menú\",\n instructionMiddle: \"(☰) en la esquina superior izquierda, luego selecciona\",\n openButton: \"\\\"Abrir\\\"\",\n instructionEnd: \"para cargar tus archivos de diagrama.\"\n },\n connectorRerouteTooltip: {\n title: \"Consejo: Cambiar ruta de conectores\",\n instructionStart: \"Una vez que tus conectores estén colocados, puedes cambiar su ruta como desees.\",\n instructionSelect: \"Selecciona el conector\",\n instructionMiddle: \"primero, luego\",\n instructionClick: \"haz clic en la ruta del conector\",\n instructionAnd: \"y\",\n instructionDrag: \"arrastra\",\n instructionEnd: \"para cambiarlo!\"\n },\n connectorEmptySpaceTooltip: {\n message: \"Para conectar este conector a un nodo,\",\n instruction: \"haz clic izquierdo en el extremo del conector y arrástralo al nodo deseado.\"\n },\n settings: {\n zoom: {\n description: \"Configura el comportamiento del zoom al usar la rueda del ratón.\",\n zoomToCursor: \"Zoom al cursor\",\n zoomToCursorDesc: \"Cuando está habilitado, el zoom se centra en la posición del cursor del ratón. Cuando está deshabilitado, el zoom se centra en el lienzo.\"\n },\n hotkeys: {\n title: \"Configuración de atajos\",\n profile: \"Perfil de atajos\",\n profileQwerty: \"QWERTY (Q, W, E, R, T, Y)\",\n profileSmnrct: \"SMNRCT (S, M, N, R, C, T)\",\n profileNone: \"Sin atajos\",\n tool: \"Herramienta\",\n hotkey: \"Atajo\",\n toolSelect: \"Seleccionar\",\n toolPan: \"Desplazar\",\n toolAddItem: \"Añadir elemento\",\n toolRectangle: \"Rectángulo\",\n toolConnector: \"Conector\",\n toolText: \"Texto\",\n note: \"Nota: Los atajos funcionan cuando no estás escribiendo en campos de texto\"\n },\n pan: {\n title: \"Configuración de desplazamiento\",\n mousePanOptions: \"Opciones de desplazamiento con ratón\",\n emptyAreaClickPan: \"Clic y arrastrar en área vacía\",\n middleClickPan: \"Clic central y arrastrar\",\n rightClickPan: \"Clic derecho y arrastrar\",\n ctrlClickPan: \"Ctrl + clic y arrastrar\",\n altClickPan: \"Alt + clic y arrastrar\",\n keyboardPanOptions: \"Opciones de desplazamiento con teclado\",\n arrowKeys: \"Teclas de flechas\",\n wasdKeys: \"Teclas WASD\",\n ijklKeys: \"Teclas IJKL\",\n keyboardPanSpeed: \"Velocidad de desplazamiento con teclado\",\n note: \"Nota: Las opciones de desplazamiento funcionan además de la herramienta de desplazamiento dedicada\"\n },\n connector: {\n title: \"Configuración de conectores\",\n connectionMode: \"Modo de creación de conexiones\",\n clickMode: \"Modo clic (Recomendado)\",\n clickModeDesc: \"Haz clic en el primer nodo, luego haz clic en el segundo nodo para crear una conexión\",\n dragMode: \"Modo arrastrar\",\n dragModeDesc: \"Haz clic y arrastra desde el primer nodo hasta el segundo nodo\",\n note: \"Nota: Puedes cambiar esta configuración en cualquier momento. El modo seleccionado se usará cuando la herramienta de conector esté activa.\"\n },\n iconPacks: {\n title: \"Gestión de Paquetes de Iconos\",\n lazyLoading: \"Activar Carga Diferida\",\n lazyLoadingDesc: \"Cargar paquetes de iconos bajo demanda para un inicio más rápido\",\n availablePacks: \"Paquetes de Iconos Disponibles\",\n coreIsoflow: \"Core Isoflow (Siempre Cargado)\",\n alwaysEnabled: \"Siempre activado\",\n awsPack: \"Iconos AWS\",\n gcpPack: \"Iconos Google Cloud\",\n azurePack: \"Iconos Azure\",\n kubernetesPack: \"Iconos Kubernetes\",\n loading: \"Cargando...\",\n loaded: \"Cargado\",\n notLoaded: \"No cargado\",\n iconCount: \"{count} iconos\",\n lazyLoadingDisabledNote: \"La carga diferida está desactivada. Todos los paquetes de iconos se cargan al iniciar.\",\n note: \"Los paquetes de iconos se pueden activar o desactivar según tus necesidades. Los paquetes desactivados reducirán el uso de memoria y mejorarán el rendimiento.\"\n }\n },\n lazyLoadingWelcome: {\n title: \"Nueva Funcionalidad: ¡Carga Diferida!\",\n message: \"¡Hola! Después de la demanda popular, hemos implementado la Carga Diferida de iconos, así que ahora si quieres activar paquetes de iconos no estándar puedes activarlos en la sección 'Configuración'.\",\n configPath: \"Haz clic en el icono de Hamburguesa\",\n configPath2: \"en la esquina superior izquierda para acceder a la Configuración.\",\n canDisable: \"Puedes desactivar este comportamiento si lo deseas.\",\n signature: \"-Stan\"\n }\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (locale);\n\n//# sourceURL=webpack://fossflow/./src/i18n/es-ES.ts?\n}"); /***/ }), diff --git a/packages/fossflow-lib/dist/types/isoflowProps.d.ts b/packages/fossflow-lib/dist/types/isoflowProps.d.ts index 0f12b61..3451c47 100644 --- a/packages/fossflow-lib/dist/types/isoflowProps.d.ts +++ b/packages/fossflow-lib/dist/types/isoflowProps.d.ts @@ -114,6 +114,10 @@ export interface LocaleProps { instructionDrag: string; instructionEnd: string; }; + connectorEmptySpaceTooltip: { + message: string; + instruction: string; + }; settings: { zoom: { description: string; diff --git a/packages/fossflow-lib/src/i18n/es-ES.ts b/packages/fossflow-lib/src/i18n/es-ES.ts index 52c8be5..3e376ba 100644 --- a/packages/fossflow-lib/src/i18n/es-ES.ts +++ b/packages/fossflow-lib/src/i18n/es-ES.ts @@ -111,6 +111,10 @@ const locale: LocaleProps = { instructionDrag: "arrastra", instructionEnd: "para cambiarlo!" }, + connectorEmptySpaceTooltip: { + message: "Para conectar este conector a un nodo,", + instruction: "haz clic izquierdo en el extremo del conector y arrástralo al nodo deseado." + }, settings: { zoom: { description: "Configura el comportamiento del zoom al usar la rueda del ratón.",