@lvce-editor/server 0.0.29 → 0.0.32

package/static/{bf7d47a → 37d2807}/packages/renderer-worker/src/parts/ViewletExplorer/ViewletExplorer.js

@@ -13,8 +13,6 @@ import * as Workspace from '../Workspace/Workspace.js'
 // viewlet: creating | refreshing | done | disposed
 // TODO recycle viewlets (maybe)
 
-const ITEM_HEIGHT = 22 // TODO handle zoom
-
 export const name = 'Explorer'
 
 const getParentStartIndex = (dirents, index) => {
@@ -119,6 +117,7 @@ export const create = (id, uri, left, top, width, height) => {
     pathSeparator: '',
     version: 0,
     editingIndex: -1,
+    itemHeight: 22,
   }
 }
 
@@ -130,11 +129,12 @@ export const loadContent = async (state) => {
   const root = Workspace.state.workspacePath
   const pathSeparator = await getPathSeparator(root) // TODO only load path separator once
   const dirents = await getTopLevelDirents(root, pathSeparator)
+  const { itemHeight, height } = state
   return {
     ...state,
     root,
     dirents,
-    maxLineY: Math.round(state.height / ITEM_HEIGHT),
+    maxLineY: Math.round(height / itemHeight),
     pathSeparator,
   }
 }
@@ -217,16 +217,17 @@ const getVisible = (state) => {
 }
 
 export const setDeltaY = (state, deltaY) => {
+  const { itemHeight, height, dirents } = state
   if (deltaY < 0) {
     deltaY = 0
-  } else if (deltaY > state.dirents.length * ITEM_HEIGHT - state.height) {
-    deltaY = Math.max(state.dirents.length * ITEM_HEIGHT - state.height, 0)
+  } else if (deltaY > dirents.length * itemHeight - height) {
+    deltaY = Math.max(dirents.length * itemHeight - height, 0)
   }
   if (state.deltaY === deltaY) {
     return state
   }
-  const minLineY = Math.round(deltaY / ITEM_HEIGHT)
-  const maxLineY = minLineY + Math.round(state.height / ITEM_HEIGHT)
+  const minLineY = Math.round(deltaY / itemHeight)
+  const maxLineY = minLineY + Math.round(height / itemHeight)
   return {
     ...state,
     deltaY,
@@ -239,15 +240,20 @@ export const handleWheel = (state, deltaY) => {
   return setDeltaY(state, state.deltaY + deltaY)
 }
 
-export const handleContextMenu = async (state, x, y, index) => {
-  state.focusedIndex = index
+export const handleContextMenu = async (state, x, y, index, button) => {
+  if (button === -1) {
+    index = state.focusedIndex
+  }
   await Command.execute(
     /* ContextMenu.show */ 'ContextMenu.show',
     /* x */ x,
     /* y */ y,
     /* id */ 'explorer'
   )
-  return state
+  return {
+    ...state,
+    focusedIndex: index,
+  }
 }
 
 export const getFocusedDirent = (state) => {
@@ -503,8 +509,21 @@ export const copyPath = async (state) => {
   await Command.execute(/* ClipBoard.writeText */ 241, /* text */ path)
 }
 
+const getContaingingFolder = (root, dirents, focusedIndex, pathSeparator) => {
+  if (focusedIndex < 0) {
+    return root
+  }
+  const dirent = dirents[focusedIndex]
+  const direntPath = dirent.path
+  const direntParentPath = direntPath.slice(0, -(dirent.name.length + 1))
+  const path = `${direntParentPath}`
+  return path
+}
+
 export const openContainingFolder = async (state) => {
-  await Command.execute('Open.openNativeFolder', /* path */ state.root)
+  const { focusedIndex, root, dirents, pathSeparator } = state
+  const path = getContaingingFolder(root, dirents, focusedIndex, pathSeparator)
+  await Command.execute('Open.openNativeFolder', /* path */ path)
   return state
 }
 
@@ -758,10 +777,36 @@ export const focusNone = (state) => {
 }
 
 export const handleClickCurrent = (state) => {
-  return handleClick(state, state.focusedIndex)
+  return handleClick(state, state.focusedIndex - state.minLineY)
 }
 
 export const focusIndex = (state, index) => {
+  if (index < state.minLineY) {
+    if (index < 0) {
+      return {
+        ...state,
+        focusedIndex: index,
+        focused: true,
+      }
+    }
+    const diff = state.maxLineY - state.minLineY
+    return {
+      ...state,
+      focusedIndex: index,
+      focused: true,
+      minLineY: index,
+      maxLineY: index + diff,
+    }
+  } else if (index >= state.maxLineY) {
+    const diff = state.maxLineY - state.minLineY
+    return {
+      ...state,
+      focusedIndex: index,
+      focused: true,
+      minLineY: index + 1 - diff,
+      maxLineY: index + 1,
+    }
+  }
   return {
     ...state,
     focusedIndex: index,
@@ -948,13 +993,14 @@ export const handleMouseEnter = async (state, index) => {
     // TODO preload content maybe when it is a long hover
     return state
   }
-  const uri = `${state.root}${dirent.path}`
-  const top = state.top + index * ITEM_HEIGHT
-  const right = state.left
+  const { top, itemHeight, left, root } = state
+  const uri = `${root}${dirent.path}`
+  const newTop = top + index * itemHeight
+  const right = left
   await Command.execute(
     /* ImagePreview.show */ 9081,
     /* uri */ uri,
-    /* top */ top,
+    /* top */ newTop,
     /* right */ right
   )
 }
@@ -1107,7 +1153,8 @@ export const handlePaste = async (state) => {
 export const hasFunctionalResize = true
 
 export const resize = (state, dimensions) => {
-  const maxLineY = state.minLineY + Math.round(dimensions.height / ITEM_HEIGHT)
+  const { minLineY, itemHeight } = state
+  const maxLineY = minLineY + Math.round(dimensions.height / itemHeight)
   return {
     ...state,
     ...dimensions,
@@ -1415,8 +1462,12 @@ const renderFocusedIndex = {
     )
   },
   apply(oldState, newState) {
-    const oldFocusedIndex = oldState.focused ? oldState.focusedIndex : -2
-    const newFocusedIndex = newState.focused ? newState.focusedIndex : -2
+    const oldFocusedIndex = oldState.focused
+      ? oldState.focusedIndex - oldState.minLineY
+      : -2
+    const newFocusedIndex = newState.focused
+      ? newState.focusedIndex - newState.minLineY
+      : -2
     return [
       /* Viewlet.send */ 'Viewlet.send',
       /* id */ 'Explorer',

package/static/{bf7d47a → 37d2807}/packages/renderer-worker/src/parts/ViewletMain/ViewletMain.js

@@ -66,10 +66,13 @@ const restoreEditors = async (state) => {
   //   Command.execute(/* Developer.openPerf */ 820)
   //   return
   // }
+  // @ts-ignore
   await openUri(state, restoredEditor.uri)
 }
 
 const handleTokenizeChange = (languageId) => {
+  // @ts-ignore
+
   const instances = ViewletState.getAllInstances()
   if (instances.EditorText) {
     const instance = instances.EditorText
@@ -171,6 +174,8 @@ const getRestoredEditors = async () => {
 
 export const loadContent = async (state) => {
   const editors = await getRestoredEditors()
+  // @ts-ignore
+
   LifeCycle.once(LifeCycle.PHASE_TWELVE, hydrateLazy)
   return {
     ...state,
@@ -208,6 +213,8 @@ export const contentLoaded = async (state) => {
     /* tabTitle */ tabTitle
   )
   // TODO race condition: Viewlet may have been resized before it has loaded
+  // @ts-ignore
+
   await ViewletManager.load(instance)
 }
 
@@ -231,6 +238,8 @@ export const openUri = async (state, uri) => {
         width,
         height
       )
+      // @ts-ignore
+
       await ViewletManager.load(instance)
       return
     }
@@ -259,6 +268,8 @@ export const openUri = async (state, uri) => {
     /* tabTitle */ tabTitle,
     /* oldActiveIndex */ oldActiveIndex
   )
+  // @ts-ignore
+
   return ViewletManager.load(instance)
 }
 
@@ -417,6 +428,7 @@ export const focusIndex = (state, index) => {
     /* unFocusIndex */ oldActiveIndex,
     /* focusIndex */ state.activeIndex
   )
+  // @ts-ignore
   return ViewletManager.load(viewlet)
 }
 

package/static/{bf7d47a → 37d2807}/packages/renderer-worker/src/parts/ViewletManager/ViewletManager.js

@@ -161,10 +161,17 @@ export const load = async (viewlet, focus = false) => {
     }
     state = ViewletState.ContentLoaded
 
-    await RendererProcess.invoke(
-      /* Viewlet.load */ 'Viewlet.load',
-      /* id */ viewlet.id
-    )
+    if (viewlet.show === false) {
+      await RendererProcess.invoke(
+        /* Viewlet.load */ 'Viewlet.loadModule',
+        /* id */ viewlet.id
+      )
+    } else {
+      await RendererProcess.invoke(
+        /* Viewlet.load */ 'Viewlet.load',
+        /* id */ viewlet.id
+      )
+    }
     if (viewlet.disposed) {
       // TODO unload the module from renderer process
       return
@@ -206,6 +213,13 @@ export const load = async (viewlet, focus = false) => {
       } else {
         commands = module.render(viewletState, newState)
       }
+      if (viewlet.show === false) {
+        return [
+          ['Viewlet.create', viewlet.id],
+          ...commands,
+          ['Viewlet.show', viewlet.id],
+        ]
+      }
       await RendererProcess.invoke(
         /* Viewlet.sendMultiple */ 'Viewlet.sendMultiple',
         /* commands */ commands

package/static/{bf7d47a → 37d2807}/packages/renderer-worker/src/parts/ViewletQuickPick/ViewletQuickPick.ipc.js

@@ -12,6 +12,7 @@ export const Commands = {
   'QuickPick.focusNext': Viewlet.wrapViewletCommand('QuickPick', ViewletQuickPick.focusNext),
   'QuickPick.handleBlur': Viewlet.wrapViewletCommand('QuickPick', ViewletQuickPick.handleBlur),
   'QuickPick.handleBeforeInput': Viewlet.wrapViewletCommand('QuickPick', ViewletQuickPick.handleBeforeInput),
+  'QuickPick.handleWheel': Viewlet.wrapViewletCommand('QuickPick', ViewletQuickPick.handleWheel),
 }
 
 export * from './ViewletQuickPick.js'

package/static/{bf7d47a → 37d2807}/packages/renderer-worker/src/parts/ViewletQuickPick/ViewletQuickPick.js

@@ -1,8 +1,7 @@
-import * as RendererProcess from '../RendererProcess/RendererProcess.js'
-import * as FuzzySearch from '../FuzzySearch/FuzzySearch.js'
 import * as Assert from '../Assert/Assert.js'
-import * as Command from '../Command/Command.js'
+import * as FuzzySearch from '../FuzzySearch/FuzzySearch.js'
 import * as QuickPickEveryThing from '../QuickPick/QuickPickEverything.js'
+import * as RendererProcess from '../RendererProcess/RendererProcess.js'
 import * as Viewlet from '../Viewlet/Viewlet.js'
 // TODO send open signal to renderer process before items are ready
 // that way user can already type while items are still loading
@@ -31,7 +30,7 @@ export const create = (id, uri, top, left, width, height) => {
   return {
     state: QuickPickState.Default,
     picks: [],
-    filteredPicks: [],
+    items: [],
     recentPicks: [],
     recentPickIds: new Map(), // TODO use object.create(null) instead
     versionId: 0,
@@ -44,6 +43,9 @@ export const create = (id, uri, top, left, width, height) => {
     maxVisibleItems: 10,
     uri,
     cursorOffset: 0,
+    deltaY: 0,
+    itemHeight: 22,
+    height: 300,
   }
 }
 
@@ -66,7 +68,7 @@ const filterPicks = (state, picks, exclude, value) => {
     }
     // TODO also filtering for aliases might be expensive
     // TODO maybe only filter for aliases if prefix is longer than 4-5 characters
-    // otherwise both will be found anyway
+    // otherwise both will be found anywayf
     // e.g. "Relo" matches  "Window Reload"  and "Reload Window"
     // But "Reload Win" only matches "Reload Window"
     if (pick.aliases) {
@@ -78,39 +80,35 @@ const filterPicks = (state, picks, exclude, value) => {
     }
     return false
   }
-  const filteredPicks = picks.filter(filterPick)
-  return filteredPicks
-}
-
-const slicePicks = (filteredPicks) => {
-  return filteredPicks.slice(0, 10)
-}
-
-const toDisplayPicks = (picks) => {
-  const toDisplayPick = (pick, index) => {
-    return {
-      label: pick.label,
-      posInSet: index + 1,
-      setSize: picks.length,
-    }
+  const items = picks.filter(filterPick)
+  return items
+}
+
+const getVisible = (items, minLineY, maxLineY) => {
+  const visibleItems = []
+  const setSize = items.length
+  const max = Math.min(items.length, maxLineY)
+  for (let i = minLineY; i < max; i++) {
+    const item = items[i]
+    visibleItems.push({
+      label: item.label,
+      posInSet: i + 1,
+      setSize,
+    })
   }
-  return picks.map(toDisplayPick)
+  return visibleItems
 }
 
-const getVisiblePicks = (state, picks, filterValue) => {
+const getFilteredItems = (state, picks, filterValue) => {
   Assert.object(state)
   Assert.array(picks)
   Assert.string(filterValue)
-  const filteredPicks = filterPicks(
-    state,
-    picks,
-    state.recentPickIds,
-    filterValue
-  )
+  const items = filterPicks(state, picks, state.recentPickIds, filterValue)
+  return items
   // TODO avoid mutation
-  state.filteredPicks = filteredPicks
-  const slicedPicks = slicePicks(filteredPicks)
-  return toDisplayPicks(slicedPicks)
+  // state.items = items
+  // const slicedPicks = slicePicks(items)
+  // return toDisplayPicks(slicedPicks)
 }
 
 const getProvider = (uri) => {
@@ -167,7 +165,7 @@ export const loadContent = async (state) => {
     return
   }
   const filterValue = provider.getFilterValue(value)
-  const visiblePicks = getVisiblePicks(state, newPicks, filterValue)
+  const items = getFilteredItems(state, newPicks, filterValue)
   const placeholder = provider.getPlaceholder()
   const label = provider.getLabel()
   const minLineY = 0
@@ -178,12 +176,13 @@ export const loadContent = async (state) => {
   return {
     ...state,
     picks: newPicks,
-    visiblePicks,
+    items,
     focusedIndex: 0,
     state: QuickPickState.Finished,
     minLineY,
     maxLineY,
     value,
+    cursorOffset: value.length,
   }
 }
 
@@ -194,6 +193,7 @@ export const dispose = (state) => {
 }
 
 export const handleBlur = async (state) => {
+  console.log('quickpick blur')
   await Viewlet.closeWidget('QuickPick')
   return state
 }
@@ -205,15 +205,20 @@ const getPick = (state, index) => {
   //   return state.recentPicks[index]
   // }
   // index -= state.recentPicks.length
-  if (index < state.filteredPicks.length) {
-    return state.filteredPicks[index]
+  if (index < state.items.length) {
+    return state.items[index]
   }
   console.warn('no pick matching index', index)
 }
 
 export const selectIndex = async (state, index, button = /* left */ 0) => {
-  const pick = getPick(state, index)
-  const selectPickResult = await state.provider.selectPick(pick, index, button)
+  const actualIndex = index + state.minLineY
+  const pick = getPick(state, actualIndex)
+  const selectPickResult = await state.provider.selectPick(
+    pick,
+    actualIndex,
+    button
+  )
   Assert.object(selectPickResult)
   Assert.string(selectPickResult.command)
   const { command } = selectPickResult
@@ -236,8 +241,8 @@ export const selectIndex = async (state, index, button = /* left */ 0) => {
   // }
 }
 
-export const selectCurrentIndex = async (state) => {
-  await selectIndex(state, state.focusedIndex)
+export const selectCurrentIndex = (state) => {
+  return selectIndex(state, state.focusedIndex)
 }
 
 // TODO when user types letters -> no need to query provider again -> just filter existing results
@@ -247,13 +252,14 @@ export const handleInput = async (state, value, cursorOffset) => {
   }
   const newPicks = await state.provider.getPicks(value)
   const filterValue = state.provider.getFilterValue(value)
-  const visiblePicks = getVisiblePicks(state, newPicks, filterValue)
+  const items = getFilteredItems(state, newPicks, filterValue)
+  const focusedIndex = items.length === 0 ? -1 : 0
   return {
     ...state,
     value,
     picks: newPicks,
-    visiblePicks,
-    focusedIndex: 0,
+    items,
+    focusedIndex,
     cursorOffset,
   }
 }
@@ -433,27 +439,19 @@ export const focusIndex = async (state, index) => {
   // @ts-ignore
   if (state.provider.focusPick) {
     // @ts-ignore
-    await state.provider.focusPick(state.filteredPicks[index])
+    await state.provider.focusPick(state.items[index])
   }
   if (index < state.minLineY) {
     const minLineY = index
     const maxLineY = Math.min(
       index + state.maxVisibleItems,
-      state.filteredPicks.length - 1
-    )
-    const slicedPicks = state.filteredPicks.slice(
-      state.minLineY,
-      state.maxLineY
+      state.items.length - 1
     )
-    const displayPicks = toDisplayPicks(slicedPicks)
-    const relativeFocusIndex = index - state.minLineY
-    const relativeUnFocusIndex = state.focusedIndex - state.minLineY
     // TODO need to scroll up
     return {
       ...state,
       minLineY,
       maxLineY,
-      displayPicks,
       focusedIndex: index,
     }
   }
@@ -462,18 +460,10 @@ export const focusIndex = async (state, index) => {
     const minLineY = Math.max(0, index - state.maxVisibleItems)
     const maxLineY = Math.min(
       index + state.maxVisibleItems - 1,
-      state.filteredPicks.length - 1
+      state.items.length - 1
     )
-    const slicedPicks = state.filteredPicks.slice(
-      state.minLineY,
-      state.maxLineY
-    )
-    const displayPicks = toDisplayPicks(slicedPicks)
-    const relativeFocusIndex = index - state.minLineY
-    const relativeUnFocusIndex = state.focusedIndex - state.minLineY
     return {
       ...state,
-      displayPicks,
       minLineY,
       maxLineY,
       focusedIndex: index,
@@ -490,22 +480,51 @@ export const focusFirst = (state) => {
 }
 
 export const focusLast = (state) => {
-  return focusIndex(state, state.filteredPicks.length - 1)
+  return focusIndex(state, state.items.length - 1)
 }
 
 export const focusPrevious = (state) => {
   const previousIndex =
-    state.focusedIndex === 0
-      ? state.filteredPicks.length - 1
-      : state.focusedIndex - 1
+    state.focusedIndex === 0 ? state.items.length - 1 : state.focusedIndex - 1
   return focusIndex(state, previousIndex)
 }
 
 export const focusNext = (state) => {
-  const nextIndex = (state.focusedIndex + 1) % state.filteredPicks.length
+  const nextIndex = (state.focusedIndex + 1) % state.items.length
   return focusIndex(state, nextIndex)
 }
 
+export const setDeltaY = (state, deltaY) => {
+  Assert.object(state)
+  Assert.number(deltaY)
+  const { itemHeight, items, height } = state
+  const itemsLength = items.length
+  if (deltaY < 0) {
+    deltaY = 0
+  } else if (deltaY > itemsLength * itemHeight - height) {
+    deltaY = Math.max(itemsLength * itemHeight - height, 0)
+  }
+  if (state.deltaY === deltaY) {
+    return state
+  }
+  const minLineY = Math.round(deltaY / itemHeight)
+  const maxLineY = minLineY + Math.round(height / itemHeight)
+  Assert.number(minLineY)
+  Assert.number(maxLineY)
+  return {
+    ...state,
+    deltaY,
+    minLineY,
+    maxLineY,
+  }
+}
+
+export const handleWheel = (state, deltaY) => {
+  Assert.object(state)
+  Assert.number(deltaY)
+  return setDeltaY(state, state.deltaY + deltaY)
+}
+
 export const hasFunctionalRender = true
 
 const renderValue = {
@@ -539,15 +558,30 @@ const renderCursorOffset = {
 
 const renderItems = {
   isEqual(oldState, newState) {
-    return oldState.visiblePicks === newState.visiblePicks
+    return (
+      oldState.items === newState.items &&
+      oldState.minLineY === newState.minLineY &&
+      oldState.maxLineY === newState.maxLineY
+    )
   },
   apply(oldState, newState) {
-    // TODO compute visible picks here from filteredPicks and minLineY / maxLineY, maybe also do filtering here
+    if (newState.items.length === 0) {
+      return [
+        /* Viewlet.send */ 'Viewlet.send',
+        /* id */ 'QuickPick',
+        /* method */ 'showNoResults',
+      ]
+    }
+    const visibleItems = getVisible(
+      newState.items,
+      newState.minLineY,
+      newState.maxLineY
+    )
     return [
       /* Viewlet.send */ 'Viewlet.send',
       /* id */ 'QuickPick',
       /* method */ 'setVisiblePicks',
-      /* visiblePicks */ newState.visiblePicks,
+      /* visiblePicks */ visibleItems,
     ]
   },
 }
@@ -568,8 +602,8 @@ const renderFocusedIndex = {
 }
 
 export const render = [
-  renderFocusedIndex,
-  renderCursorOffset,
   renderItems,
   renderValue,
+  renderCursorOffset,
+  renderFocusedIndex,
 ]