gwchq-textjam 0.3.13 → 0.3.15

package/dist/index.js

@@ -68492,8 +68492,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
 /* harmony export */ });
-/* harmony import */ var _Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(89379);
-/* harmony import */ var _Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(53986);
+/* harmony import */ var _Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(89379);
+/* harmony import */ var _Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(53986);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(51649);
 /* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(14062);
 /* harmony import */ var _redux_EditorSlice__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(68512);
@@ -68514,7 +68514,7 @@ var DraggableTab = _ref => {
       draggableId,
       onTabClick
     } = _ref,
-    otherProps = (0,_Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .A)(_ref, _excluded);
+    otherProps = (0,_Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .A)(_ref, _excluded);
   var openedTabs = (0,react_redux__WEBPACK_IMPORTED_MODULE_1__.useSelector)(state => state.editor.openedTabs);
   var openFilesCount = openedTabs.filter(t => t && t.type === "file").length || 1;
   var dispatch = (0,react_redux__WEBPACK_IMPORTED_MODULE_1__.useDispatch)();
@@ -68532,7 +68532,7 @@ var DraggableTab = _ref => {
       switchToFileTab((fileIndex + openFilesCount - 1) % openFilesCount);
     }
   };
-  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Tabs_DraggableTabWrapper__WEBPACK_IMPORTED_MODULE_5__["default"], (0,_Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .A)((0,_Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .A)({
+  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Tabs_DraggableTabWrapper__WEBPACK_IMPORTED_MODULE_5__["default"], (0,_Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .A)((0,_Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .A)({
     draggableId: draggableId,
     index: fileIndex,
     onClick: e => {
@@ -68556,8 +68556,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
 /* harmony export */ });
-/* harmony import */ var _Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(89379);
-/* harmony import */ var _Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(53986);
+/* harmony import */ var _Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(89379);
+/* harmony import */ var _Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(53986);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(51649);
 /* harmony import */ var _hello_pangea_dnd__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(98850);
 /* harmony import */ var react_tabs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(39243);
@@ -68576,8 +68576,8 @@ var DroppableTabList = _ref => {
       children: _children,
       index
     } = _ref,
-    otherProps = (0,_Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .A)(_ref, _excluded);
-  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_tabs__WEBPACK_IMPORTED_MODULE_1__.TabList, (0,_Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)((0,_Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)({}, otherProps), {}, {
+    otherProps = (0,_Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .A)(_ref, _excluded);
+  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_tabs__WEBPACK_IMPORTED_MODULE_1__.TabList, (0,_Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)((0,_Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)({}, otherProps), {}, {
     children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_hello_pangea_dnd__WEBPACK_IMPORTED_MODULE_6__.Droppable, {
       direction: "horizontal",
       droppableId: index.toString(),
@@ -68587,7 +68587,7 @@ var DroppableTabList = _ref => {
           droppableProps,
           placeholder
         } = _ref2;
-        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", (0,_Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)((0,_Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)({
+        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", (0,_Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)((0,_Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .A)({
           className: "droppable-tab-list"
         }, droppableProps), {}, {
           ref: innerRef,
@@ -101977,8 +101977,8 @@ var EditorPanel = _ref => {
   } = (0,es.useTranslation)();
   var settings = (0,external_react_.useContext)(utils_settings.SettingsContext);
   var [characterLimitExceeded, setCharacterLimitExceeded] = (0,external_react_.useState)(false);
-  var [line, setLine] = (0,external_react_.useState)(0);
-  var [position, setPosition] = (0,external_react_.useState)(0);
+  var [line, setLine] = (0,external_react_.useState)(1);
+  var [position, setPosition] = (0,external_react_.useState)(1);
   var updateStoredProject = c(content => {
     dispatch((0,EditorSlice.updateProjectComponent)((0,objectSpread2/* default */.A)((0,objectSpread2/* default */.A)({}, file), {}, {
       content
@@ -102013,6 +102013,10 @@ var EditorPanel = _ref => {
     });
     editorViewRef.current = view;
 
+    // New view starts at line 1
+    setLine(1);
+    setPosition(1);
+
     // 'aria-hidden' to fix keyboard access accessibility error
     view.scrollDOM.setAttribute("aria-hidden", "true");
 
@@ -103160,7 +103164,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
 /* harmony export */ });
-/* harmony import */ var _Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(89379);
+/* harmony import */ var _Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(89379);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(51649);
 /* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(14062);
 /* harmony import */ var _redux_EditorSlice__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(68512);
@@ -103276,7 +103280,7 @@ var ProjectName = _ref => {
       id: "project_name_label",
       className: _styles_module_scss__WEBPACK_IMPORTED_MODULE_3__["default"].projectLabel,
       children: "Project Name"
-    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", (0,_Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)((0,_Users_ruslanmatkovskyi_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)({
+    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", (0,_Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)((0,_Users_valeriya_projects_gwc_gwchq_textjam_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .A)({
       className: classnames__WEBPACK_IMPORTED_MODULE_2___default()(_styles_module_scss__WEBPACK_IMPORTED_MODULE_3__["default"].projectName, className)
     }, hoverProps), {}, {
       children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)((components_Tooltip_Tooltip__WEBPACK_IMPORTED_MODULE_8___default()), {
@@ -369154,7 +369158,7 @@ const EditorInput = () => {
     if (!project || !project.components) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)(dnd_1.DragDropContext, { onDragStart: (input) => onDragStart(input), onDragEnd: (result) => onDragEnd(result), children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.tabbedPanel, children: (0, jsx_runtime_1.jsxs)(react_tabs_1.Tabs, { selectedIndex: fileTabFocusIndex, onSelect: selectFileTab, children: [(0, jsx_runtime_1.jsxs)("div", { className: "tabContainer", children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.scrollWrapper, children: (0, jsx_runtime_1.jsx)(DroppableTabList_1.default, { index: 0, children: openedFiles.map((file, fileIndex) => ((0, jsx_runtime_1.jsxs)(DraggableTab_1.default, { draggableId: `file-${file.id}`, fileIndex: fileIndex, onTabClick: selectFileTab, onMouseEnter: showTabTooltip(file.path), onMouseLeave: hideTabTooltip, "aria-label": file.fullName, children: [(0, jsx_runtime_1.jsxs)(Text_1.Text, { size: 12, weight: "medium", className: "tabText", ref: tabRefs.current[projectFiles.findIndex((projectFile) => projectFile.id === file.id)], children: [(0, jsx_runtime_1.jsx)(FileIcon_1.default, { ext: file.extension }), (0, projectHelpers_1.truncateFileName)(file.fullName)] }), (0, projectHelpers_1.isFileClosable)(file.fullName, defaultFileName) && ((0, jsx_runtime_1.jsx)(Button_1.default, { className: styles_module_scss_1.default.closeBtn, label: "close", onClickHandler: (e) => closeFileTab(e, file), ButtonIcon: () => (0, jsx_runtime_1.jsx)(CloseIcon_1.default, { scaleFactor: 0.85 }) }))] }, file.id))) }) }), isMobile && (0, jsx_runtime_1.jsx)(RunnerControls_1.default, {})] }), openedFiles.map((file) => ((0, jsx_runtime_1.jsxs)(react_tabs_1.TabPanel, { children: [(0, jsx_runtime_1.jsx)(ReadOnlyBanner_1.default, {}), (0, jsx_runtime_1.jsx)(EditorPanel_1.default, { file: file }, file.id)] }, file.id)))] }) }), tabTooltip && ((0, jsx_runtime_1.jsx)(Tooltip_1.default, { className: styles_module_scss_1.default.tabTooltip, message: tabTooltip.message, position: "bottom", strategy: "fixed", visible: true, style: {
+    return ((0, jsx_runtime_1.jsxs)(dnd_1.DragDropContext, { onDragStart: (input) => onDragStart(input), onDragEnd: (result) => onDragEnd(result), children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.tabbedPanel, children: (0, jsx_runtime_1.jsxs)(react_tabs_1.Tabs, { selectedIndex: fileTabFocusIndex, onSelect: selectFileTab, children: [(0, jsx_runtime_1.jsxs)("div", { className: "tabContainer", children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.scrollWrapper, children: (0, jsx_runtime_1.jsx)(DroppableTabList_1.default, { index: 0, children: openedFiles.map((file, fileIndex) => ((0, jsx_runtime_1.jsxs)(DraggableTab_1.default, { draggableId: `file-${file.id}`, fileIndex: fileIndex, onTabClick: selectFileTab, onMouseEnter: showTabTooltip(file.path), onMouseLeave: hideTabTooltip, "aria-label": file.fullName, children: [(0, jsx_runtime_1.jsxs)(Text_1.Text, { size: 12, weight: "medium", className: "tabText", ref: tabRefs.current[projectFiles.findIndex((projectFile) => projectFile.id === file.id)], children: [(0, jsx_runtime_1.jsx)(FileIcon_1.default, { ext: file.extension }), (0, projectHelpers_1.truncateFileName)(file.fullName)] }), (0, projectHelpers_1.isFileClosable)(file.fullName, defaultFileName) && ((0, jsx_runtime_1.jsx)(Button_1.default, { className: styles_module_scss_1.default.closeBtn, label: "close", onClickHandler: (e) => closeFileTab(e, file), ButtonIcon: () => (0, jsx_runtime_1.jsx)(CloseIcon_1.default, { scaleFactor: 0.85 }) }))] }, file.id))) }) }), isMobile && (0, jsx_runtime_1.jsx)(RunnerControls_1.default, {})] }), openedFiles.map((file) => ((0, jsx_runtime_1.jsxs)(react_tabs_1.TabPanel, { children: [(0, jsx_runtime_1.jsx)(ReadOnlyBanner_1.default, {}), (0, jsx_runtime_1.jsx)(EditorPanel_1.default, { file: file }, file.id)] }, file.id)))] }) }), tabTooltip && ((0, jsx_runtime_1.jsx)(Tooltip_1.default, { className: styles_module_scss_1.default.tabTooltip, message: tabTooltip.message, position: "bottom", size: "fit", strategy: "fixed", visible: true, style: {
                     top: tabTooltip.top,
                     left: tabTooltip.left,
                     transform: "translateX(-50%)",
@@ -372361,7 +372365,7 @@ const styles_module_scss_1 = __importDefault(__webpack_require__(44502));
 const FileTabHeader = ({ file, defaultFileName, onClose, }) => {
     const fullName = (0, projectHelpers_1.getFullComponentName)(file);
     const isClosable = (0, projectHelpers_1.isFileClosable)(fullName, defaultFileName);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(Text_1.Text, { size: 12, weight: "medium", className: "tabText", tooltip: fullName, children: [(0, jsx_runtime_1.jsx)(FileIcon_1.default, { ext: file.extension }), (0, projectHelpers_1.truncateFileName)(fullName)] }), isClosable && ((0, jsx_runtime_1.jsx)(Button_1.default, { className: styles_module_scss_1.default.closeBtn, label: "close", onClickHandler: (e) => onClose(e, file.id), ButtonIcon: () => (0, jsx_runtime_1.jsx)(CloseIcon_1.default, { scaleFactor: 0.85 }) }))] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(Text_1.Text, { size: 12, weight: "medium", className: "tabText", children: [(0, jsx_runtime_1.jsx)(FileIcon_1.default, { ext: file.extension }), (0, projectHelpers_1.truncateFileName)(fullName)] }), isClosable && ((0, jsx_runtime_1.jsx)(Button_1.default, { className: styles_module_scss_1.default.closeBtn, label: "close", onClickHandler: (e) => onClose(e, file.id), ButtonIcon: () => (0, jsx_runtime_1.jsx)(CloseIcon_1.default, { scaleFactor: 0.85 }) }))] }));
 };
 exports["default"] = FileTabHeader;
 
@@ -372512,16 +372516,19 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", ({ value: true }));
 const jsx_runtime_1 = __webpack_require__(74848);
+const dnd_1 = __webpack_require__(98850);
 const react_1 = __webpack_require__(51649);
 const react_redux_1 = __webpack_require__(14062);
 const react_tabs_1 = __webpack_require__(39243);
-const dnd_1 = __webpack_require__(98850);
-const EditorSlice_1 = __webpack_require__(68512);
+const Tooltip_1 = __importDefault(__webpack_require__(26982));
 const stores_1 = __webpack_require__(32132);
 const EditorTypes_1 = __webpack_require__(42108);
 const ProjectTypes_1 = __webpack_require__(27130);
 const projectHelpers_1 = __webpack_require__(2610);
+const EditorSlice_1 = __webpack_require__(68512);
 const DroppableTabList_1 = __importDefault(__webpack_require__(48339));
+const useTabTooltip_1 = __importDefault(__webpack_require__(58149));
+const styles_module_scss_1 = __importDefault(__webpack_require__(44502));
 const DraggableTabWrapper_1 = __importDefault(__webpack_require__(46963));
 const TabbedPanel_1 = __importStar(__webpack_require__(60596));
 const TabHeader_1 = __importDefault(__webpack_require__(33682));
@@ -372529,6 +372536,7 @@ const TabsContainer = ({ tabs, renderOutput, outputMeta, }) => {
     const dispatch = (0, react_redux_1.useDispatch)();
     const project = (0, stores_1.useAppSelector)((state) => state.editor.project);
     const focussedTabIndex = (0, stores_1.useAppSelector)((state) => state.editor.focussedFileIndex);
+    const { tabTooltip, showTabTooltip, hideTabTooltip } = (0, useTabTooltip_1.default)();
     const projectFiles = (0, react_1.useMemo)(() => (project.components ?? []).filter((component) => component.type === ProjectTypes_1.ProjectComponentType.FILE), [project.components]);
     const defaultFileName = (0, projectHelpers_1.getDefaultFileName)(project);
     const hasFileTabs = (0, react_1.useMemo)(() => tabs.some((t) => t.type === EditorTypes_1.OpenedTabType.FILE), [tabs]);
@@ -372543,6 +372551,7 @@ const TabsContainer = ({ tabs, renderOutput, outputMeta, }) => {
     // previously active tab loses its white "selected" background immediately and we
     // never show two active-looking tabs mid-drag.
     const handleDragStart = (start) => {
+        hideTabTooltip();
         dispatch((0, EditorSlice_1.setFocussedFileIndex)(start.source.index));
     };
     const handleDragEnd = (result) => {
@@ -372559,23 +372568,33 @@ const TabsContainer = ({ tabs, renderOutput, outputMeta, }) => {
     };
     const isTabRenderable = (tab) => tab.type === EditorTypes_1.OpenedTabType.OUTPUT ||
         projectFiles.some((f) => f.id === tab.id);
+    const filePathForTab = (tab) => tab.type === EditorTypes_1.OpenedTabType.FILE
+        ? projectFiles.find((file) => file.id === tab.id)?.path
+        : undefined;
     const tabHeader = (tab) => ((0, jsx_runtime_1.jsx)(TabHeader_1.default, { tab: tab, outputMeta: outputMeta, projectFiles: projectFiles, defaultFileName: defaultFileName, onCloseFile: handleCloseFile }));
     const renderDraggableTab = (tab, index) => {
         if (!isTabRenderable(tab))
             return null;
+        const filePath = filePathForTab(tab);
         return ((0, jsx_runtime_1.jsx)(DraggableTabWrapper_1.default, { draggableId: (0, TabbedPanel_1.tabKey)(tab), index: index, onClick: (e) => {
                 e.stopPropagation();
                 handleSelect(index);
-            }, children: tabHeader(tab) }, (0, TabbedPanel_1.tabKey)(tab)));
+            }, onMouseEnter: showTabTooltip(filePath), onMouseLeave: hideTabTooltip, onFocus: showTabTooltip(filePath), onBlur: hideTabTooltip, onKeyDown: hideTabTooltip, children: tabHeader(tab) }, (0, TabbedPanel_1.tabKey)(tab)));
     };
     const renderPlainTab = (tab) => {
         if (!isTabRenderable(tab))
             return null;
-        return (0, jsx_runtime_1.jsx)(react_tabs_1.Tab, { children: tabHeader(tab) }, (0, TabbedPanel_1.tabKey)(tab));
+        const filePath = filePathForTab(tab);
+        return ((0, jsx_runtime_1.jsx)(react_tabs_1.Tab, { onMouseEnter: showTabTooltip(filePath), onMouseLeave: hideTabTooltip, onFocus: showTabTooltip(filePath), onBlur: hideTabTooltip, onKeyDown: hideTabTooltip, children: tabHeader(tab) }, (0, TabbedPanel_1.tabKey)(tab)));
     };
     const tabListMarkup = hasFileTabs ? ((0, jsx_runtime_1.jsx)(DroppableTabList_1.default, { index: 0, children: tabs.map((tab, index) => renderDraggableTab(tab, index)) })) : ((0, jsx_runtime_1.jsx)(react_tabs_1.TabList, { children: tabs.map((tab) => renderPlainTab(tab)) }));
     const tabsMarkup = ((0, jsx_runtime_1.jsx)(TabbedPanel_1.default, { tabs: tabs, selectedIndex: focussedTabIndex, onSelect: handleSelect, tabList: tabListMarkup, projectFiles: projectFiles, renderOutput: renderOutput }));
-    return hasFileTabs ? ((0, jsx_runtime_1.jsx)(dnd_1.DragDropContext, { onDragStart: handleDragStart, onDragEnd: handleDragEnd, children: tabsMarkup })) : (tabsMarkup);
+    const tabTooltipMarkup = tabTooltip ? ((0, jsx_runtime_1.jsx)(Tooltip_1.default, { className: styles_module_scss_1.default.tabTooltip, message: tabTooltip.message, visible: true, position: "bottom", strategy: "fixed", size: "fit", style: {
+            top: tabTooltip.top,
+            left: tabTooltip.left,
+            transform: "translateX(-50%)",
+        } })) : null;
+    return hasFileTabs ? ((0, jsx_runtime_1.jsxs)(dnd_1.DragDropContext, { onDragStart: handleDragStart, onDragEnd: handleDragEnd, children: [tabsMarkup, tabTooltipMarkup] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [tabsMarkup, tabTooltipMarkup] }));
 };
 exports["default"] = TabsContainer;
 
@@ -376238,7 +376257,7 @@ const EditorSlice_1 = __webpack_require__(68512);
 const types_1 = __webpack_require__(92932);
 const stores_1 = __webpack_require__(32132);
 const sendToast_1 = __webpack_require__(50068);
-const SUCCESS_MESSAGE = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["All set! Your project is back to the old version.", (0, jsx_runtime_1.jsx)("br", {}), "Click ", (0, jsx_runtime_1.jsx)("b", { children: "Save" }), " to apply changes to server."] }));
+const SUCCESS_MESSAGE = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["All set! Your project is back to the old version.", (0, jsx_runtime_1.jsx)("br", {}), "After your first edit, ", (0, jsx_runtime_1.jsx)("b", { children: "Save" }), " will be enabled so you can apply changes to the server."] }));
 const ERROR_MESSAGE = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Oops! The version couldn't be restored.", (0, jsx_runtime_1.jsx)("br", {}), "Please try again."] }));
 /**
  * Fires a success or error toast when a user-triggered version revert completes.
@@ -376878,15 +376897,15 @@ exports["default"] = exports.UserSlice.reducer;
 
 Object.defineProperty(exports, "__esModule", ({ value: true }));
 exports.fsImportFolder = exports.fsImportFiles = exports.fsRemove = exports.fsAdd = exports.fsMove = exports.fsRename = void 0;
+const sendToast_1 = __webpack_require__(50068);
+const fileValidation_1 = __webpack_require__(59615);
 const planners_1 = __webpack_require__(5819);
-const EditorTypes_1 = __webpack_require__(42108);
-const EditorSlice_1 = __webpack_require__(68512);
-const ProjectTypes_1 = __webpack_require__(27130);
 const utils_1 = __webpack_require__(33321);
-const sendToast_1 = __webpack_require__(50068);
 const constants_1 = __webpack_require__(16287);
-const fileValidation_1 = __webpack_require__(59615);
+const EditorTypes_1 = __webpack_require__(42108);
+const ProjectTypes_1 = __webpack_require__(27130);
 const macSystemFiles_1 = __webpack_require__(18213);
+const EditorSlice_1 = __webpack_require__(68512);
 const selectComponents = (state) => {
     return state.editor.project.components ?? [];
 };
@@ -376968,9 +376987,6 @@ const fsImportFiles = ({ files, parentId }) => async (dispatch, getState) => {
     }
     const { validFiles, importErrors } = (0, fileValidation_1.validateFiles)(importableFiles);
     const hasDuplicates = hasCaseInsensitiveDuplicateNames(validFiles);
-    for (const error of importErrors) {
-        (0, sendToast_1.showError)(error.reason);
-    }
     if (validFiles.length > 0) {
         (0, sendToast_1.showSuccess)(`Selected files uploaded successfully.\n${validFiles.length} of ${importableFiles.length} file(s) uploaded.`);
         if (hasDuplicates) {
@@ -376979,6 +376995,11 @@ const fsImportFiles = ({ files, parentId }) => async (dispatch, getState) => {
     }
     else {
         (0, sendToast_1.showError)(`Selected files couldn’t be uploaded.\n${importableFiles.length} file(s) failed to upload.`);
+    }
+    for (const error of importErrors) {
+        (0, sendToast_1.showError)(error.reason);
+    }
+    if (validFiles.length === 0) {
         return;
     }
     const componentsMap = (0, utils_1.buildComponentsById)(components);
@@ -377006,9 +377027,6 @@ const fsImportFolder = ({ files, parentId }) => async (dispatch, getState) => {
     const folderName = importableFiles[0]?.webkitRelativePath?.split("/")[0];
     const { validFiles, importErrors } = (0, fileValidation_1.validateFiles)(importableFiles);
     const hasDuplicates = hasCaseInsensitiveDuplicateNames(validFiles);
-    for (const error of importErrors) {
-        (0, sendToast_1.showError)(error.reason);
-    }
     if (validFiles.length > 0) {
         (0, sendToast_1.showSuccess)(`Folder '${folderName}' upload complete.\n${validFiles.length} of ${importableFiles.length} file(s) uploaded successfully.`);
         if (hasDuplicates) {
@@ -377017,6 +377035,11 @@ const fsImportFolder = ({ files, parentId }) => async (dispatch, getState) => {
     }
     else {
         (0, sendToast_1.showError)(`'${folderName}' folder couldn't be uploaded.\n${importableFiles.length} file(s) failed to upload.`);
+    }
+    for (const error of importErrors) {
+        (0, sendToast_1.showError)(error.reason);
+    }
+    if (validFiles.length === 0) {
         return;
     }
     const componentsMap = (0, utils_1.buildComponentsById)(components);

package/dist/style.css

@@ -693,7 +693,7 @@
 :root{--rpf-white: #ffffff}.styles-module__editorStatistic--EyK0S{display:flex;justify-content:space-between;align-items:center;inline-size:100%;border-block-start:1px solid #e5e5e5;padding:calc(.625rem*var(--scale-factor, 1)) calc(.75rem*var(--scale-factor, 1));font-weight:400;font-size:calc(.75rem*var(--scale-factor, 1));line-height:calc(1.5rem*var(--scale-factor, 1))}.styles-module__editorStatistic--EyK0S .styles-module__contentType--Sb4eE{text-transform:uppercase}
 .styles-module__previewContainer--gHB-N{block-size:100%;display:flex;align-items:center;justify-content:center}
 :root{--rpf-white: #ffffff}.styles-module__readOnlyContainer--GooG6{display:flex;justify-content:flex-end;margin:8px 4px 4px 4px}.styles-module__readOnlyContainerLeft--D6yHv{justify-content:flex-start}.styles-module__readOnlyBanner--b4PPC{background-color:#e5e5e5;padding:4px 8px;border-radius:12px;font-weight:400;font-size:calc(.5rem*var(--scale-factor, 1));line-height:calc(1rem*var(--scale-factor, 1));display:flex;gap:4px;align-items:center;color:#69746d}
-:root{--rpf-white: #ffffff}.styles-module__tabbedPanel--Sovmr{display:flex;flex-direction:column;block-size:100%;inline-size:100%}.styles-module__tabbedPanel--Sovmr .styles-module__viewOnlyBanner--vSOaw{font-weight:700;padding:var(--space-0-5) var(--space-1);border-block-end:1px solid var(--editor-color-outline)}.styles-module__tabbedPanel--Sovmr .styles-module__scrollWrapper--Q8zaL{position:absolute;inset:0;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-color:HSL(0, 0%, 14%, 30%) rgba(0,0,0,0);scrollbar-width:none;-ms-overflow-style:none}.styles-module__tabbedPanel--Sovmr .styles-module__scrollWrapper--Q8zaL::-webkit-scrollbar{block-size:0;transition:height .2s ease}.styles-module__tabbedPanel--Sovmr .styles-module__scrollWrapper--Q8zaL:hover{scrollbar-width:thin}.styles-module__tabbedPanel--Sovmr .styles-module__scrollWrapper--Q8zaL:hover::-webkit-scrollbar{block-size:calc(.25rem*var(--scale-factor, 1))}.styles-module__tabbedPanel--Sovmr .styles-module__closeBtn--g8-AM{block-size:100%;padding:0;padding-inline-start:calc(1rem*var(--scale-factor, 1));background-color:rgba(0,0,0,0)}.styles-module__tabbedPanel--Sovmr .styles-module__closeBtn--g8-AM:focus-visible{border:0}.styles-module__tabTooltip--DO-Hr{margin-block-start:0}.tabContainer{border-block-end:1px solid #e5e5e5;background-color:#e5f6f1;position:relative;block-size:calc(2.625rem*var(--scale-factor, 1));overflow:hidden}.tabText{display:flex;align-items:center;block-size:fit-content;inline-size:fit-content;margin:0;gap:calc(.5rem*var(--scale-factor, 1));line-height:calc(1rem*var(--scale-factor, 1));white-space:nowrap}.react-tabs{flex:1;display:flex;flex-flow:column;overflow:hidden;position:relative;border-radius:calc(.5rem*var(--scale-factor, 1)) calc(.5rem*var(--scale-factor, 1)) calc(.25rem*var(--scale-factor, 1)) calc(.25rem*var(--scale-factor, 1))}.react-tabs__tab{border:none;background-color:rgba(0,0,0,0);padding:0 calc(1rem*var(--scale-factor, 1));margin:0;inset-block-start:0;inset-block-end:0;min-block-size:calc(2.625rem*var(--scale-factor, 1));display:flex;align-items:center;justify-content:center;font-weight:700;color:#33625e;border-inline-end:1px solid #e5e5e5;flex:0 0 auto}.react-tabs__tab--selected{border-radius:0;background-color:#fff}.react-tabs__tab:focus{box-shadow:none;border-color:#e5e5e5}.react-tabs__tab:focus-visible{outline-offset:-3px}.react-tabs__tab:focus:after{display:none}.react-tabs__tab-list{border-block-end:none;box-sizing:border-box;display:inline-flex;align-items:center;flex-wrap:nowrap;margin:0;min-inline-size:100%}.react-tabs__tab-panel--selected{flex:1;display:flex;flex-direction:column;overflow-y:auto;background-color:#fff}
+:root{--rpf-white: #ffffff}.styles-module__tabbedPanel--Sovmr{display:flex;flex-direction:column;block-size:100%;inline-size:100%}.styles-module__tabbedPanel--Sovmr .styles-module__viewOnlyBanner--vSOaw{font-weight:700;padding:var(--space-0-5) var(--space-1);border-block-end:1px solid var(--editor-color-outline)}.styles-module__tabbedPanel--Sovmr .styles-module__scrollWrapper--Q8zaL{position:absolute;inset:0;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-color:HSL(0, 0%, 14%, 30%) rgba(0,0,0,0);scrollbar-width:none;-ms-overflow-style:none}.styles-module__tabbedPanel--Sovmr .styles-module__scrollWrapper--Q8zaL::-webkit-scrollbar{block-size:0;transition:height .2s ease}.styles-module__tabbedPanel--Sovmr .styles-module__scrollWrapper--Q8zaL:hover{scrollbar-width:thin}.styles-module__tabbedPanel--Sovmr .styles-module__scrollWrapper--Q8zaL:hover::-webkit-scrollbar{block-size:calc(.25rem*var(--scale-factor, 1))}.styles-module__tabbedPanel--Sovmr .styles-module__closeBtn--g8-AM{block-size:100%;padding:0;padding-inline-start:calc(1rem*var(--scale-factor, 1));background-color:rgba(0,0,0,0)}.styles-module__tabbedPanel--Sovmr .styles-module__closeBtn--g8-AM:focus-visible{border:0}.styles-module__tabTooltip--DO-Hr{min-inline-size:auto;inline-size:max-content;max-inline-size:min(90vw,32rem);margin-block-start:0}.tabContainer{border-block-end:1px solid #e5e5e5;background-color:#e5f6f1;position:relative;block-size:calc(2.625rem*var(--scale-factor, 1));overflow:hidden}.tabText{display:flex;align-items:center;block-size:fit-content;inline-size:fit-content;margin:0;gap:calc(.5rem*var(--scale-factor, 1));line-height:calc(1rem*var(--scale-factor, 1));white-space:nowrap}.react-tabs{flex:1;display:flex;flex-flow:column;overflow:hidden;position:relative;border-radius:calc(.5rem*var(--scale-factor, 1)) calc(.5rem*var(--scale-factor, 1)) calc(.25rem*var(--scale-factor, 1)) calc(.25rem*var(--scale-factor, 1))}.react-tabs__tab{border:none;background-color:rgba(0,0,0,0);padding:0 calc(1rem*var(--scale-factor, 1));margin:0;inset-block-start:0;inset-block-end:0;min-block-size:calc(2.625rem*var(--scale-factor, 1));display:flex;align-items:center;justify-content:center;font-weight:700;color:#33625e;border-inline-end:1px solid #e5e5e5;flex:0 0 auto}.react-tabs__tab--selected{border-radius:0;background-color:#fff}.react-tabs__tab:focus{box-shadow:none;border-color:#e5e5e5}.react-tabs__tab:focus-visible{outline-offset:-3px}.react-tabs__tab:focus:after{display:none}.react-tabs__tab-list{border-block-end:none;box-sizing:border-box;display:inline-flex;align-items:center;flex-wrap:nowrap;margin:0;min-inline-size:100%}.react-tabs__tab-panel--selected{flex:1;display:flex;flex-direction:column;overflow-y:auto;background-color:#fff}
 :root{--rpf-white: #ffffff}.styles-module__proj--ZFm0o{display:flex;flex-flow:column;overflow:hidden;block-size:100%}.styles-module__projContainer--foKo4{display:flex;flex-direction:row;overflow-y:hidden;margin:0 8px 6px 0px;block-size:100%}.styles-module__projContainer--foKo4 .styles-module__projectWrapper--Yq8Yr{container-type:inline-size;display:flex;flex-direction:column;flex:1 1 auto;overflow:hidden}.styles-module__projContainer--foKo4 .styles-module__projEditorWrapper--SISJR{display:flex;flex:0 1 auto;flex-flow:column;grid-gap:calc(.625rem*var(--scale-factor, 1));overflow:hidden;block-size:100%;inline-size:100%}@container (min-width: 720px){.styles-module__projContainer--foKo4 .styles-module__projEditorWrapper--SISJR{flex-flow:row}.styles-module__projContainer--foKo4 .styles-module__projEditorContainer--jWAlR{max-block-size:100% !important}}.styles-module__projContainer--foKo4 .styles-module__projEditorContainer--jWAlR{display:flex;box-sizing:border-box;background-color:#fff;min-block-size:30%;max-block-size:70%;border-radius:8px}.styles-module__projContainer--foKo4 .styles-module__projEditorContainer--jWAlR .styles-module__react-tabs__tab-panel--selected--RwR-m{overflow-y:hidden}.styles-module__projContainer--foKo4 .styles-module__projEditorContainer--jWAlR .styles-module__react-tabs__tab-list--gM7uT{flex:1}.styles-module__projContainer--foKo4 .styles-module__projEditorContainer--jWAlR .styles-module__react-tabs__tab-container--ycENl .styles-module__btn--run--u9TgZ,.styles-module__projContainer--foKo4 .styles-module__projEditorContainer--jWAlR .styles-module__react-tabs__tab-container--ycENl .styles-module__btn--stop--gJCsY{margin-block-start:0;margin-block-end:0}
 :root{--rpf-white: #ffffff}.styles-module__viewSwitcher--h0ODR{display:flex}.styles-module__viewSwitcherBtn--v6-ir{inline-size:calc(2.75rem*var(--scale-factor, 1));block-size:calc(2.75rem*var(--scale-factor, 1));cursor:pointer;transition:background-color .15s ease}.styles-module__viewSwitcherBtnWrapper--OarYg{position:relative;display:flex}.styles-module__viewSwitcherBtnWrapper--OarYg:first-child .styles-module__viewSwitcherBtn--v6-ir{border-radius:calc(.75rem*var(--scale-factor, 1)) 0 0 calc(.75rem*var(--scale-factor, 1))}.styles-module__viewSwitcherBtnWrapper--OarYg:last-child .styles-module__viewSwitcherBtn--v6-ir{border-radius:0 calc(.75rem*var(--scale-factor, 1)) calc(.75rem*var(--scale-factor, 1)) 0}.styles-module__viewSwitcherBtnActive--m2JP-{background-color:#fff}
 :root{--rpf-white: #ffffff}.styles-module__container--uYbdi{color:#e0201c;padding:calc(.75rem*var(--scale-factor, 1)) calc(1.25rem*var(--scale-factor, 1));overflow-y:auto;display:flex;flex-direction:column;gap:calc(1rem*var(--scale-factor, 1));min-block-size:fit-content}.styles-module__message--hNGZt{padding:0;margin:0;white-space:pre-wrap;word-break:break-word;font-size:13px;line-height:18px;font-family:"Roboto Mono",source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}.styles-module__infoBox--Ti35B{inline-size:100%;overflow-wrap:break-word;padding:calc(.5rem*var(--scale-factor, 1));background-color:#ffd5ce;color:#520e0e;display:flex;flex-direction:row;align-items:start;justify-content:flex-start;border:1px solid #e0201c;border-radius:calc(.5rem*var(--scale-factor, 1));gap:calc(.25rem*var(--scale-factor, 1))}.styles-module__infoBox--Ti35B svg{color:#e0201c}.styles-module__infoText--jXz2P{display:flex;flex-direction:column;align-items:flex-start;gap:calc(.3125rem*var(--scale-factor, 1))}.styles-module__notFoundContainer--YfNdr{inline-size:100%;block-size:100%;display:flex;flex-direction:column;align-items:center;gap:calc(2rem*var(--scale-factor, 1));padding:calc(2rem*var(--scale-factor, 1)) calc(1rem*var(--scale-factor, 1));overflow:scroll;justify-content:space-evenly}.styles-module__notFoundText--q6EKC{display:flex;flex-direction:column;align-items:center;gap:calc(1rem*var(--scale-factor, 1))}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "gwchq-textjam",
   "description": "Embeddable React editor used in Raspberry Pi text-based projects.",
-  "version": "0.3.13",
+  "version": "0.3.15",
   "license": "Apache-2.0",
   "homepage": "https://github.com/GirlsFirst/gwchq-textjam",
   "author": "Girls Who Code HQ",
@@ -47,7 +47,7 @@
     "*.scss"
   ],
   "dependencies": {
-    "@babel/core": "^7.17.10",
+    "@babel/core": "^7.29.7",
     "@codemirror/commands": "^6.1.1",
     "@codemirror/lang-css": "^6.0.0",
     "@codemirror/lang-html": "^6.1.2",
@@ -61,11 +61,11 @@
     "@juggle/resize-observer": "^3.3.1",
     "@lezer/highlight": "^1.0.0",
     "@raspberrypifoundation/design-system-react": "^2.7.0",
-    "@reduxjs/toolkit": "^1.6.2",
+    "@reduxjs/toolkit": "^2.12.0",
     "@replit/codemirror-indentation-markers": "^6.1.0",
     "@szhsin/react-menu": "^4.5.1",
     "assert": "^2.1.0",
-    "axios": "^0.24.0",
+    "axios": "^1.18.0",
     "classnames": "^2.5.1",
     "codemirror": "^6.0.1",
     "date-fns": "^4.1.0",
@@ -81,9 +81,9 @@
     "jszip-utils": "^0.1.0",
     "marked": "^15.0.6",
     "mime-types": "^2.1.35",
-    "node-html-parser": "^6.1.5",
-    "plotly.js": "^3.0.2",
-    "prismjs": "^1.29.0",
+    "node-html-parser": "^7.1.0",
+    "plotly.js": "^3.6.0",
+    "prismjs": "^1.30.0",
     "process": "^0.11.10",
     "prop-types": "^15.8.1",
     "rc-resize-observer": "^1.3.1",
@@ -97,7 +97,7 @@
     "react-redux": "^7.2.5",
     "react-refresh": "^0.8.3",
     "react-responsive": "^9.0.2",
-    "react-router-dom": "^6.7.0",
+    "react-router-dom": "^6.30.4",
     "react-tabs": "^4.2.1",
     "react-timer-hook": "^3.0.5",
     "react-toastify": "^8.1.0",
@@ -123,7 +123,7 @@
     "@babel/preset-env": "^7.17.10",
     "@babel/preset-typescript": "^7.28.5",
     "@pmmmwh/react-refresh-webpack-plugin": "0.4.3",
-    "@svgr/webpack": "5.5.0",
+    "@svgr/webpack": "8.1.0",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "14.3.1",
     "@testing-library/user-event": "^12.1.10",
@@ -180,7 +180,6 @@
     "lint-staged": "^16.3.2",
     "mini-css-extract-plugin": "^2.9.4",
     "mock-match-media": "^0.4.3",
-    "optimize-css-assets-webpack-plugin": "5.0.4",
     "path-browserify": "^1.0.1",
     "pnp-webpack-plugin": "1.6.4",
     "postcss-flexbugs-fixes": "4.2.1",
@@ -192,7 +191,7 @@
     "prettier": "^2.8.8",
     "react": "^18.1.0",
     "react-app-polyfill": "^3.0.0",
-    "react-dev-utils": "^11.0.3",
+    "react-dev-utils": "^12.0.1",
     "react-dom": "^18.1.0",
     "react-test-renderer": "^18.1.0",
     "redux-mock-store": "^1.5.4",
@@ -297,5 +296,12 @@
     "resetMocks": true,
     "coverageDirectory": "./coverage"
   },
+  "resolutions": {
+    "@babel/core": "7.29.7",
+    "form-data@~2.3.2": "2.5.6",
+    "form-data@^4.0.0": "4.0.6",
+    "form-data@^4.0.5": "4.0.6",
+    "protocol-buffers-schema@^3.3.1": "3.6.1"
+  },
   "packageManager": "yarn@3.4.1"
 }