@lvce-editor/explorer-view 2.37.0 → 2.38.0

package/dist/explorerViewWorkerMain.js

@@ -1653,6 +1653,7 @@ const cancelEditCreate = (state, keepFocus) => {
     focused: keepFocus,
     editingIndex: -1,
     editingValue: '',
+    editingErrorMessage: '',
     editingType: None$5,
     focus: List
   };
@@ -1689,6 +1690,7 @@ const cancelEditRename = (state, keepFocus) => {
     editingIndex: -1,
     editingValue: '',
     editingType: None$5,
+    editingErrorMessage: '',
     focus: List
   };
 };
@@ -4244,12 +4246,22 @@ const renderFocus = (oldState, newState) => {
   return [];
 };
 
+const getErrorMessagePosition = (itemHeight, focusedIndex, minLineY, depth, indent, fileIconWidth, padding) => {
+  const top = itemHeight * (focusedIndex - minLineY + 1);
+  const left = depth * indent + fileIconWidth + padding;
+  return {
+    top,
+    left
+  };
+};
+
 const Actions = 'Actions';
 const Button$2 = 'Button';
 const ButtonNarrow = 'ButtonNarrow';
 const ButtonPrimary = 'ButtonPrimary';
 const ButtonWide = 'ButtonWide';
 const Chevron = 'Chevron';
+const ExplorerErrorMessage = 'ExplorerErrorMessage';
 const Empty = '';
 const Explorer = 'Explorer';
 const ExplorerDropTarget = 'DropTarget';
@@ -4257,7 +4269,6 @@ const ExplorerInputBox = 'ExplorerInputBox';
 const FileIcon = 'FileIcon';
 const FocusOutline = 'FocusOutline';
 const IconButton = 'IconButton';
-const InputBox = 'InputBox';
 const InputValidationError = 'InputValidationError';
 const Label = 'Label';
 const ListItems = 'ListItems';
@@ -4284,20 +4295,6 @@ const WelcomeMessage = 'WelcomeMessage';
 // only numbers are compared. it could also make rendering faster,
 // since less data is transferred to renderer process
 
-const HandleClick = 'handleClick';
-const HandleClickOpenFolder = 'handleClickOpenFolder';
-const HandleContextMenu = 'handleContextMenu';
-const HandleDragLeave = 'handleDragLeave';
-const HandleDragOver = 'handleDragOver';
-const HandleDrop = 'handleDrop';
-const HandleEditingInput = 'handleEditingInput';
-const HandleInputBlur = 'handleInputBlur';
-const HandleInputClick = 'handleInputClick';
-const HandleListBlur = 'handleListBlur';
-const HandleListFocus = 'handleListFocus';
-const HandlePointerDown = 'handlePointerDown';
-const HandleWheel = 'handleWheel';
-
 const mergeClassNames = (...classNames) => {
   return classNames.filter(Boolean).join(' ');
 };
@@ -4322,6 +4319,33 @@ const Input = 6;
 const Img = 17;
 const P = 50;
 
+const getErrorMessageDom = (errorMessage, errorMessageLeft, errorMessageTop) => {
+  if (!errorMessage) {
+    return [];
+  }
+  const translateString = position(errorMessageLeft, errorMessageTop);
+  return [{
+    type: Div,
+    className: mergeClassNames(ExplorerErrorMessage),
+    childCount: 1,
+    translate: translateString
+  }, text(errorMessage)];
+};
+
+const HandleClick = 'handleClick';
+const HandleClickOpenFolder = 'handleClickOpenFolder';
+const HandleContextMenu = 'handleContextMenu';
+const HandleDragLeave = 'handleDragLeave';
+const HandleDragOver = 'handleDragOver';
+const HandleDrop = 'handleDrop';
+const HandleEditingInput = 'handleEditingInput';
+const HandleInputBlur = 'handleInputBlur';
+const HandleInputClick = 'handleInputClick';
+const HandleListBlur = 'handleListBlur';
+const HandleListFocus = 'handleListFocus';
+const HandlePointerDown = 'handlePointerDown';
+const HandleWheel = 'handleWheel';
+
 const getExplorerWelcomeVirtualDom = isWide => {
   return [{
     type: Div,
@@ -4378,9 +4402,9 @@ const getFileIconVirtualDom = icon => {
 
 const getInputClassName = hasEditingError => {
   if (hasEditingError) {
-    return mergeClassNames(InputBox, ExplorerInputBox, InputValidationError);
+    return mergeClassNames(ExplorerInputBox, InputValidationError);
   }
-  return mergeClassNames(InputBox, ExplorerInputBox);
+  return ExplorerInputBox;
 };
 
 const getInputDom = hasEditingError => {
@@ -4514,20 +4538,32 @@ const getScrollBarVirtualDom = (scrollBarHeight, scrollBarTop) => {
   }];
 };
 
-const parentNode = {
-  type: Div,
-  childCount: 2,
-  className: mergeClassNames(Viewlet, Explorer),
-  role: 'none'
+const getChildCount = (scrollBarDomLength, errorDomLength) => {
+  let childCount = 1;
+  if (scrollBarDomLength > 0) {
+    childCount++;
+  }
+  if (errorDomLength > 0) {
+    childCount++;
+  }
+  return childCount;
 };
-const getExplorerVirtualDom = (visibleItems, focusedIndex, root, isWide, focused, dropTargets, height, contentHeight, scrollTop) => {
+const getExplorerVirtualDom = (visibleItems, focusedIndex, root, isWide, focused, dropTargets, height, contentHeight, scrollTop, errorMessage, errorMessageTop, errorMessageLeft) => {
   if (!root) {
     return getExplorerWelcomeVirtualDom(isWide);
   }
   const scrollBarHeight = getScrollBarSize(height, contentHeight, 20);
   const scrollBarTop = Math.round(scrollTop / contentHeight * height);
   const scrollBarDom = getScrollBarVirtualDom(scrollBarHeight, scrollBarTop);
-  const dom = [parentNode, ...getListItemsVirtualDom(visibleItems, focusedIndex, focused, dropTargets), ...scrollBarDom];
+  const errorDom = getErrorMessageDom(errorMessage, errorMessageLeft, errorMessageTop);
+  const childCount = getChildCount(scrollBarDom.length, errorDom.length);
+  const parentNode = {
+    type: Div,
+    childCount,
+    className: mergeClassNames(Viewlet, Explorer),
+    role: 'none'
+  };
+  const dom = [parentNode, ...getListItemsVirtualDom(visibleItems, focusedIndex, focused, dropTargets), ...scrollBarDom, ...errorDom];
   return dom;
 };
 
@@ -4647,7 +4683,17 @@ const renderItems = (oldState, newState) => {
   const visibleDirents = getVisibleExplorerItems(newState.items, newState.minLineY, newState.maxLineY, newState.focusedIndex, newState.editingIndex, newState.editingType, newState.editingValue, newState.editingErrorMessage, newState.icons, newState.useChevrons, newState.dropTargets, newState.editingIcon);
   const isWide = newState.width > 450;
   const contentHeight = newState.items.length * newState.itemHeight;
-  const dom = getExplorerVirtualDom(visibleDirents, newState.focusedIndex, newState.root, isWide, newState.focused, newState.dropTargets, newState.height, contentHeight, newState.deltaY);
+  const depth = newState.items[newState.focusedIndex]?.depth || 0;
+  const indent = 8;
+  const padding = 10;
+  const fileIconWidth = 16;
+  const defaultPaddingLeft = 0;
+  const chevronSpace = 22;
+  const {
+    top,
+    left
+  } = getErrorMessagePosition(newState.itemHeight, newState.focusedIndex, newState.minLineY, depth, indent, fileIconWidth, padding + defaultPaddingLeft + chevronSpace);
+  const dom = getExplorerVirtualDom(visibleDirents, newState.focusedIndex, newState.root, isWide, newState.focused, newState.dropTargets, newState.height, contentHeight, newState.deltaY, newState.editingErrorMessage, top, left);
   return ['Viewlet.setDom2', dom];
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/explorer-view",
-  "version": "2.37.0",
+  "version": "2.38.0",
   "description": "Explorer Worker",
   "repository": {
     "type": "git",