@lvce-editor/static-server 0.45.24 → 0.45.26

package/static/{20bc754 → 3aa4ece}/packages/file-search-worker/dist/fileSearchWorkerMain.js

@@ -82,12 +82,30 @@ const getType = value => {
       return 'unknown';
   }
 };
+const object = value => {
+  const type = getType(value);
+  if (type !== 'object') {
+    throw new AssertionError('expected value to be of type object');
+  }
+};
+const number = value => {
+  const type = getType(value);
+  if (type !== 'number') {
+    throw new AssertionError('expected value to be of type number');
+  }
+};
 const array = value => {
   const type = getType(value);
   if (type !== 'array') {
     throw new AssertionError('expected value to be of type array');
   }
 };
+const string = value => {
+  const type = getType(value);
+  if (type !== 'string') {
+    throw new AssertionError('expected value to be of type string');
+  }
+};
 
 const isMessagePort = value => {
   return value && value instanceof MessagePort;
@@ -416,7 +434,7 @@ const IpcChildWithModuleWorkerAndMessagePort$1 = {
 };
 
 const Two = '2.0';
-const create$4 = (method, params) => {
+const create$4$1 = (method, params) => {
   return {
     jsonrpc: Two,
     method,
@@ -424,10 +442,10 @@ const create$4 = (method, params) => {
   };
 };
 const callbacks = Object.create(null);
-const set$1 = (id, fn) => {
+const set$2 = (id, fn) => {
   callbacks[id] = fn;
 };
-const get$1 = id => {
+const get$2 = id => {
   return callbacks[id];
 };
 const remove$2 = id => {
@@ -443,7 +461,7 @@ const registerPromise = () => {
     resolve,
     promise
   } = Promise.withResolvers();
-  set$1(id, resolve);
+  set$2(id, resolve);
   return {
     id,
     promise
@@ -600,7 +618,7 @@ const warn$1 = (...args) => {
   console.warn(...args);
 };
 const resolve = (id, response) => {
-  const fn = get$1(id);
+  const fn = get$2(id);
   if (!fn) {
     console.log(response);
     warn$1(`callback ${id} may already be disposed`);
@@ -751,7 +769,7 @@ const invokeHelper = async (ipc, method, params, useSendAndTransfer) => {
   return unwrapJsonRpcResult(responseMessage);
 };
 const send = (transport, method, ...params) => {
-  const message = create$4(method, params);
+  const message = create$4$1(method, params);
   transport.send(message);
 };
 const invoke$2 = (ipc, method, ...params) => {
@@ -825,7 +843,7 @@ const listen$1 = async (module, options) => {
   const ipc = module.wrap(rawIpc);
   return ipc;
 };
-const create$3 = async ({
+const create$4 = async ({
   commandMap
 }) => {
   // TODO create a commandMap per rpc instance
@@ -837,7 +855,7 @@ const create$3 = async ({
 };
 const WebWorkerRpcClient = {
   __proto__: null,
-  create: create$3
+  create: create$4
 };
 
 const User = 1;
@@ -845,19 +863,50 @@ const Script = 2;
 
 const minimumSliderSize = 20;
 
+const RendererWorker = 1;
+
+const rpcs = Object.create(null);
+const set$1 = (id, rpc) => {
+  rpcs[id] = rpc;
+};
+const get$1 = id => {
+  return rpcs[id];
+};
+
+const invoke$1 = (method, ...params) => {
+  const rpc = get$1(RendererWorker);
+  // @ts-ignore
+  return rpc.invoke(method, ...params);
+};
+
 const handleError = async (error, notify = true, prefix = '') => {
   console.error(error);
 };
-const showErrorDialog = async () => {};
+const showErrorDialog = async error => {
+  const code = error.code;
+  const message = error.message;
+  const stack = error.stack;
+  const name = error.name;
+  const errorInfo = {
+    code,
+    message,
+    stack,
+    name
+  };
+  await invoke$1('ErrorHandling.showErrorDialog', errorInfo);
+};
 const warn = (...args) => {
   console.warn(...args);
 };
 
-const state$5 = {
+const state$4 = {
   menuEntries: []
 };
 const getAll = () => {
-  return state$5.menuEntries;
+  return state$4.menuEntries;
+};
+const add = menuEntries => {
+  state$4.menuEntries = [...state$4.menuEntries, ...menuEntries];
 };
 
 const Hide = 'hide';
@@ -875,77 +924,58 @@ const i18nString = (key, placeholders = emptyObject) => {
   return key.replaceAll(RE_PLACEHOLDER, replacer);
 };
 
-/**
- * @enum {string}
- */
-const UiStrings = {
-  Files: 'Files',
-  GoToFile: 'Go to file',
-  NoMatchingColorThemesFound: 'No matching color themes found',
-  NoMatchingResults: 'No matching results',
-  NoRecentlyOpenedFoldersFound: 'No recently opened folders found',
-  NoResults: 'No Results',
-  NoSymbolFound: 'No symbol found',
-  NoWorkspaceSymbolsFound: 'no workspace symbols found',
-  OpenRecent: 'Open Recent',
-  SelectColorTheme: 'Select Color Theme',
-  SelectToOpen: 'Select to open',
-  ShowAndRunCommands: 'Show And Run Commands',
-  TypeNameOfCommandToRun: 'Type the name of a command to run.',
-  TypeTheNameOfAViewToOpen: 'Type the name of a view, output channel or terminal to open.'
-};
+const Files = 'Files';
+const GoToFile = 'Go to file';
+const NoMatchingColorThemesFound = 'No matching color themes found';
+const NoMatchingResults = 'No matching results';
+const NoRecentlyOpenedFoldersFound = 'No recently opened folders found';
+const NoResults = 'No Results';
+const NoSymbolFound = 'No symbol found';
+const NoWorkspaceSymbolsFound = 'no workspace symbols found';
+const OpenRecent = 'Open Recent';
+const SelectColorTheme = 'Select Color Theme';
+const SelectToOpen = 'Select to open';
+const ShowAndRunCommands = 'Show And Run Commands';
+const TypeNameOfCommandToRun = 'Type the name of a command to run.';
+
 const noMatchingColorThemesFound = () => {
-  return i18nString(UiStrings.NoMatchingColorThemesFound);
+  return i18nString(NoMatchingColorThemesFound);
 };
 const selectColorTheme = () => {
-  return i18nString(UiStrings.SelectColorTheme);
+  return i18nString(SelectColorTheme);
 };
 const typeNameofCommandToRun = () => {
-  return i18nString(UiStrings.TypeNameOfCommandToRun);
+  return i18nString(TypeNameOfCommandToRun);
 };
 const showAndRunCommands = () => {
-  return i18nString(UiStrings.ShowAndRunCommands);
+  return i18nString(ShowAndRunCommands);
 };
 const noMatchingResults = () => {
-  return i18nString(UiStrings.NoMatchingResults);
+  return i18nString(NoMatchingResults);
 };
 const files = () => {
-  return i18nString(UiStrings.Files);
+  return i18nString(Files);
 };
 const goToFile = () => {
-  return i18nString(UiStrings.GoToFile);
+  return i18nString(GoToFile);
 };
 const noResults = () => {
-  return i18nString(UiStrings.NoResults);
+  return i18nString(NoResults);
 };
 const selectToOpen = () => {
-  return i18nString(UiStrings.SelectToOpen);
+  return i18nString(SelectToOpen);
 };
 const openRecent = () => {
-  return i18nString(UiStrings.OpenRecent);
+  return i18nString(OpenRecent);
 };
 const noRecentlyOpenedFoldersFound = () => {
-  return i18nString(UiStrings.NoRecentlyOpenedFoldersFound);
+  return i18nString(NoRecentlyOpenedFoldersFound);
 };
 const noSymbolFound = () => {
-  return i18nString(UiStrings.NoSymbolFound);
+  return i18nString(NoSymbolFound);
 };
 const noWorkspaceSymbolsFound = () => {
-  return i18nString(UiStrings.NoWorkspaceSymbolsFound);
-};
-
-const state$4 = {
-  rpc: undefined
-};
-
-// TODO use rpc registry
-const invoke$1 = (method, ...params) => {
-  const rpc = state$4.rpc;
-  // @ts-ignore
-  return rpc.invoke(method, ...params);
-};
-const setRpc = rpc => {
-  state$4.rpc = rpc;
+  return i18nString(NoWorkspaceSymbolsFound);
 };
 
 const name$8 = 'command';
@@ -988,7 +1018,7 @@ const prefixIdWithExt = item => {
 const getExtensionPicks = async () => {
   try {
     // TODO don't call this every time
-    const extensionPicks = await invoke$1('ExtensionHostCommands.getCommands');
+    const extensionPicks = await invoke$1('ExtensionHost.getCommands');
     if (!extensionPicks) {
       return [];
     }
@@ -1029,11 +1059,10 @@ const selectPickBuiltin = async item => {
 const selectPickExtension = async item => {
   const id = item.id.slice(4); // TODO lots of string allocation with 'ext.' find a better way to separate builtin commands from extension commands
   try {
-    await invoke$1('ExtensionHostCommands.executeCommand', id);
+    await invoke$1('ExtensionHost.executeCommand', id);
   } catch (error) {
     await handleError(error, false);
-    // @ts-ignore
-    await showErrorDialog();
+    await showErrorDialog(error);
   }
   return {
     command: Hide
@@ -1077,6 +1106,9 @@ const execute = async (method, ...params) => {
   // TODO
 };
 
+const Directory$1 = 3;
+const File$2 = 7;
+
 const RE_PROTOCOL = /^([a-z-]+):\/\//;
 const getProtocol = uri => {
   const protocolMatch = uri.match(RE_PROTOCOL);
@@ -1090,9 +1122,6 @@ const Memfs = 'memfs';
 const Html = 'html';
 const Fetch = 'fetch';
 
-const Directory$1 = 3;
-const File$2 = 7;
-
 class FileNotFoundError extends Error {
   constructor(uri) {
     super(`File not found: ${uri}`);
@@ -1281,7 +1310,7 @@ const getFiles = () => {
   return state$3.files;
 };
 
-const searchFile$4 = async () => {
+const searchFile$5 = async () => {
   const files = await getFiles();
   const keys = Object.keys(files);
   return keys;
@@ -1289,10 +1318,10 @@ const searchFile$4 = async () => {
 
 const SearchFileMemfs = {
   __proto__: null,
-  searchFile: searchFile$4
+  searchFile: searchFile$5
 };
 
-const assetDir = '/20bc754';
+const assetDir = '/3aa4ece';
 
 const fileMapUrl = `${assetDir}/config/fileMap.json`;
 
@@ -1319,7 +1348,7 @@ const removeLeadingSlash = path => {
 // TODO simplify code
 // 1. don't have playground prefix in fileMap json
 // 2. remove code here that removes the prefix
-const searchFile$3 = async path => {
+const searchFile$4 = async path => {
   const fileList = await getJson(fileMapUrl);
   const result = fileList.map(removeLeadingSlash);
   const prefixLength = path.length - 'file:///'.length;
@@ -1332,7 +1361,7 @@ const searchFile$3 = async path => {
 
 const SearchFileFetch = {
   __proto__: null,
-  searchFile: searchFile$3
+  searchFile: searchFile$4
 };
 
 const Directory = 'directory';
@@ -1616,11 +1645,7 @@ replaceTraps(oldTraps => ({
 }));
 
 const state$2 = {
-  databases: Object.create(null),
-  eventId: 0,
-  dbVersion: 1,
-  cachedDb: undefined
-};
+  dbVersion: 1};
 
 // TODO high memory usage in idb because of transactionDoneMap
 
@@ -1683,7 +1708,7 @@ const searchFilesRecursively = async (all, parent, handle) => {
   }
   await Promise.all(promises);
 };
-const searchFile$2 = async uri => {
+const searchFile$3 = async uri => {
   const path = uri.slice('html://'.length);
   const handle = await getDirectoryHandle(path);
   if (!handle) {
@@ -1697,7 +1722,7 @@ const searchFile$2 = async uri => {
 
 const SearchFileHtml = {
   __proto__: null,
-  searchFile: searchFile$2
+  searchFile: searchFile$3
 };
 
 const emptyMatches = [];
@@ -1868,18 +1893,34 @@ const filterQuickPickItem = (pattern, word) => {
   return matches;
 };
 
-const getBaseName = path => {
+// TODO this should be in FileSystem module
+const pathBaseName = path => {
   return path.slice(path.lastIndexOf('/') + 1);
 };
 
-const filterQuickPickItems = (items, value) => {
+// TODO this should be in FileSystem module
+const pathDirName = path => {
+  const pathSeparator = '/';
+  const index = path.lastIndexOf(pathSeparator);
+  if (index === -1) {
+    return '';
+  }
+  return path.slice(0, index);
+};
+
+const filterQuickPickItems = (items, value, provider) => {
   if (!value) {
     return items.map(convertToPick);
   }
   const results = [];
   for (const item of items) {
-    const baseName = getBaseName(item);
-    const matches = filterQuickPickItem(value, baseName);
+    let filterValue = '';
+    if (provider) {
+      filterValue = provider.getPickLabel(item);
+    } else {
+      filterValue = pathBaseName(item);
+    }
+    const matches = filterQuickPickItem(value, filterValue);
     if (matches.length > 0) {
       results.push({
         pick: item,
@@ -1908,7 +1949,7 @@ const splitLines = lines => {
 
 // TODO create direct connection from electron to file search worker using message ports
 
-const searchFile$1 = async (path, value, prepare) => {
+const searchFile$2 = async (path, value, prepare) => {
   const ripGrepArgs = getFileSearchRipGrepArgs();
   const options = {
     ripGrepArgs,
@@ -1926,7 +1967,7 @@ const searchFile$1 = async (path, value, prepare) => {
 
 const SearchFileRipGrep = {
   __proto__: null,
-  searchFile: searchFile$1
+  searchFile: searchFile$2
 };
 
 const getModule = protocol => {
@@ -1941,7 +1982,8 @@ const getModule = protocol => {
       return SearchFileRipGrep;
   }
 };
-const searchFile = async (path, value, prepare, assetDir) => {
+
+const searchFile$1 = async (path, value, prepare, assetDir) => {
   const protocol = getProtocol(path);
   // TODO call different providers depending on protocol
   const module = await getModule(protocol);
@@ -1949,21 +1991,12 @@ const searchFile = async (path, value, prepare, assetDir) => {
   return result;
 };
 
-// TODO this should be in FileSystem module
-const pathBaseName = path => {
-  return path.slice(path.lastIndexOf('/') + 1);
-};
-
-// TODO this should be in FileSystem module
-const pathDirName = path => {
-  const pathSeparator = '/';
-  const index = path.lastIndexOf(pathSeparator);
-  if (index === -1) {
-    return '';
-  }
-  return path.slice(0, index);
+const searchFile = async (path, value) => {
+  const prepare = true;
+  // @ts-ignore
+  const files = await searchFile$1(/* path */path, /* searchTerm */value, prepare);
+  return files;
 };
-
 const name$7 = 'file';
 const getPlaceholder$a = () => {
   return '';
@@ -1985,9 +2018,14 @@ const getNoResults$9 = () => {
   };
 };
 const getPicks$a = async searchValue => {
-  {
+  // TODO cache workspace path
+  const workspace = await invoke$1('Workspace.getPath');
+  if (!workspace) {
     return [];
   }
+  const files = await searchFile(workspace, searchValue);
+  // const picks = files.map(toPick)
+  return files;
 };
 const selectPick$a = async pick => {
   if (typeof pick === 'object') {
@@ -2016,7 +2054,7 @@ const getPickLabel$4 = pick => {
   const baseName = pathBaseName(pick);
   return baseName;
 };
-const getPickDescription$3 = pick => {
+const getPickDescription$4 = pick => {
   if (typeof pick === 'object') {
     pick = pick.pick;
   }
@@ -2027,7 +2065,17 @@ const getPickIcon$4 = () => {
   return '';
 };
 const getPickFileIcon$2 = pick => {
-  return '';
+  if (typeof pick === 'object') {
+    pick = pick.pick;
+  }
+  if (typeof pick === 'object') {
+    pick = pick.pick;
+  }
+  const baseName = pathBaseName(pick);
+  return {
+    type: File$2,
+    name: baseName
+  };
 };
 const isPrepared$1 = () => {
   const workspace = '';
@@ -2042,7 +2090,7 @@ const QuickPickEntriesFile = {
   getHelpEntries: getHelpEntries$9,
   getLabel: getLabel$4,
   getNoResults: getNoResults$9,
-  getPickDescription: getPickDescription$3,
+  getPickDescription: getPickDescription$4,
   getPickFileIcon: getPickFileIcon$2,
   getPickFilterValue: getPickFilterValue$5,
   getPickIcon: getPickIcon$4,
@@ -2254,7 +2302,7 @@ const Symbol$2 = '@';
 const WorkspaceSymbol$1 = '#';
 const GoToLine = ':';
 const View$1 = 'view ';
-const None$1 = '';
+const None$2 = '';
 
 // TODO avoid global variable
 
@@ -2296,7 +2344,7 @@ const getPrefix = value => {
   if (value.startsWith(View$1)) {
     return View$1;
   }
-  return None$1;
+  return None$2;
 };
 const getQuickPickProvider = prefix => {
   // TODO could use enum for prefix
@@ -2351,7 +2399,7 @@ const getPickFilterValue$3 = pick => {
   } = state$1;
   return provider.getPickFilterValue(pick);
 };
-const getPickDescription$2 = pick => {
+const getPickDescription$3 = pick => {
   const {
     provider
   } = state$1;
@@ -2405,7 +2453,7 @@ const QuickPickEntriesEverything = {
   getHelpEntries: getHelpEntries$3,
   getLabel: getLabel$3,
   getNoResults: getNoResults$4,
-  getPickDescription: getPickDescription$2,
+  getPickDescription: getPickDescription$3,
   getPickFileIcon: getPickFileIcon$1,
   getPickFilterValue: getPickFilterValue$3,
   getPickIcon: getPickIcon$3,
@@ -2423,7 +2471,7 @@ const QuickPickEntriesEverything = {
 const Default = 0;
 const Finished = 2;
 
-const create$2 = () => {
+const create$3 = () => {
   const states = Object.create(null);
   return {
     get(uid) {
@@ -2441,9 +2489,9 @@ const create$2 = () => {
 const {
   get,
   set
-} = create$2();
+} = create$3();
 
-const create$1 = ({
+const create$2 = ({
   itemHeight,
   headerHeight = 0,
   minimumSliderSize = 20
@@ -2465,6 +2513,82 @@ const create$1 = ({
     scrollBarActive: false
   };
 };
+const getListHeight = (height, headerHeight) => {
+  if (headerHeight) {
+    return height - headerHeight;
+  }
+  return headerHeight;
+};
+const setDeltaY = (state, deltaY) => {
+  object(state);
+  number(deltaY);
+  const {
+    itemHeight,
+    items,
+    height,
+    headerHeight
+  } = state;
+  const listHeight = getListHeight(height, headerHeight);
+  const itemsLength = items.length;
+  const finalDeltaY = itemsLength * itemHeight - listHeight;
+  if (deltaY < 0) {
+    deltaY = 0;
+  } else if (deltaY > finalDeltaY) {
+    deltaY = Math.max(finalDeltaY, 0);
+  }
+  if (state.deltaY === deltaY) {
+    return state;
+  }
+  const minLineY = Math.round(deltaY / itemHeight);
+  const maxLineY = minLineY + Math.round(listHeight / itemHeight);
+  number(minLineY);
+  number(maxLineY);
+  return {
+    ...state,
+    deltaY,
+    minLineY,
+    maxLineY
+  };
+};
+const handleWheel = (state, deltaMode, deltaY) => {
+  object(state);
+  number(deltaMode);
+  number(deltaY);
+  return setDeltaY(state, state.deltaY + deltaY);
+};
+
+const create$1 = (uid, uri, listItemHeight, x, y, width, height, platform, args) => {
+  const state = {
+    uid,
+    state: Default,
+    picks: [],
+    recentPicks: [],
+    recentPickIds: new Map(),
+    // TODO use object.create(null) instead
+    versionId: 0,
+    provider: QuickPickEntriesEverything,
+    // TODO make this dynamic again
+    warned: [],
+    visiblePicks: [],
+    maxVisibleItems: 10,
+    uri,
+    cursorOffset: 0,
+    height: 300,
+    top: 50,
+    width: 600,
+    ...create$2({
+      itemHeight: listItemHeight,
+      headerHeight: 30,
+      minimumSliderSize: minimumSliderSize
+    }),
+    inputSource: User,
+    args,
+    focused: false,
+    platform,
+    value: ''
+  };
+  set(uid, state, state);
+};
 
 const create = (uid, uri, listItemHeight, x, y, width, height, platform, args) => {
   const state = {
@@ -2485,7 +2609,7 @@ const create = (uid, uri, listItemHeight, x, y, width, height, platform, args) =
     height: 300,
     top: 50,
     width: 600,
-    ...create$1({
+    ...create$2({
       itemHeight: listItemHeight,
       headerHeight: 30,
       minimumSliderSize: minimumSliderSize
@@ -2576,6 +2700,95 @@ const getBlob = async (uri, type) => {
   return blob;
 };
 
+const focusIndex = async (state, index) => {
+  const {
+    provider,
+    maxVisibleItems,
+    items,
+    minLineY,
+    maxLineY
+  } = state;
+  // TODO get types working
+  // @ts-ignore
+  if (provider.focusPick) {
+    // @ts-ignore
+    await provider.focusPick(items[index].pick);
+  }
+  if (index < minLineY + 1) {
+    const minLineY = index;
+    const maxLineY = Math.min(index + maxVisibleItems, items.length - 1);
+    // TODO need to scroll up
+    return {
+      ...state,
+      minLineY,
+      maxLineY,
+      focusedIndex: index
+    };
+  }
+  if (index >= maxLineY - 1) {
+    // TODO need to scroll down
+    const maxLineY = index + 1;
+    const minLineY = Math.max(maxLineY - maxVisibleItems, 0);
+    return {
+      ...state,
+      minLineY,
+      maxLineY,
+      focusedIndex: index
+    };
+  }
+  return {
+    ...state,
+    focusedIndex: index
+  };
+};
+
+const first = () => {
+  return 0;
+};
+const last = items => {
+  return items.length - 1;
+};
+const next = (items, index) => {
+  return (index + 1) % items.length;
+};
+const previous = (items, index) => {
+  return index === 0 ? items.length - 1 : index - 1;
+};
+
+const focusFirst = state => {
+  return focusIndex(state, first());
+};
+
+const focusLast = state => {
+  const {
+    items
+  } = state;
+  return focusIndex(state, last(items));
+};
+
+const focusNext = state => {
+  const {
+    items,
+    focusedIndex
+  } = state;
+  const nextIndex = next(items, focusedIndex);
+  return focusIndex(state, nextIndex);
+};
+
+const focusPrevious = state => {
+  const {
+    items,
+    focusedIndex
+  } = state;
+  const previousIndex = previous(items, focusedIndex);
+  return focusIndex(state, previousIndex);
+};
+
+const commandIds = ['handleBlur', 'handleClickAt', 'handleWheel', 'selectCurrentIndex', 'selectIndex', 'selectItem', 'focusFirst', 'focusIndex', 'focusLast', 'focusNext', 'focusPrevious', 'handleInput', 'handleBeforeInput'];
+const getCommandIds = () => {
+  return commandIds;
+};
+
 const Enter = 3;
 const Escape = 8;
 const PageUp = 10;
@@ -2614,6 +2827,191 @@ const getKeyBindings = () => {
   }];
 };
 
+const InsertText = 'insertText';
+const DeleteContentBackward = 'deleteContentBackward';
+const DeleteContentForward = 'deleteContentForward';
+const DeleteWordForward = 'deleteWordForward';
+const DeleteWordBackward = 'deleteWordBackward';
+const InsertLineBreak = 'insertLineBreak';
+const InsertCompositionText = 'insertCompositionText';
+const InsertFromPaste = 'insertFromPaste';
+
+const getNewValueInsertText = (value, selectionStart, selectionEnd, data) => {
+  if (selectionStart === value.length) {
+    const newValue = value + data;
+    return {
+      newValue,
+      cursorOffset: newValue.length
+    };
+  }
+  const before = value.slice(0, selectionStart);
+  const after = value.slice(selectionEnd);
+  const newValue = before + data + after;
+  return {
+    newValue,
+    cursorOffset: selectionStart + data.length
+  };
+};
+const getNewValueDeleteContentBackward = (value, selectionStart, selectionEnd, data) => {
+  const after = value.slice(selectionEnd);
+  if (selectionStart === selectionEnd) {
+    const before = value.slice(0, selectionStart - 1);
+    const newValue = before + after;
+    return {
+      newValue,
+      cursorOffset: before.length
+    };
+  }
+  const before = value.slice(0, selectionStart);
+  const newValue = before + after;
+  return {
+    newValue,
+    cursorOffset: selectionStart
+  };
+};
+const RE_ALPHA_NUMERIC = /[a-z\d]/i;
+const isAlphaNumeric = character => {
+  return RE_ALPHA_NUMERIC.test(character);
+};
+const getNewValueDeleteWordBackward = (value, selectionStart, selectionEnd, data) => {
+  const after = value.slice(selectionEnd);
+  if (selectionStart === selectionEnd) {
+    let startIndex = Math.max(selectionStart - 1, 0);
+    while (startIndex > 0 && isAlphaNumeric(value[startIndex])) {
+      startIndex--;
+    }
+    const before = value.slice(0, startIndex);
+    const newValue = before + after;
+    return {
+      newValue,
+      cursorOffset: before.length
+    };
+  }
+  const before = value.slice(0, selectionStart);
+  const newValue = before + after;
+  return {
+    newValue,
+    cursorOffset: selectionStart
+  };
+};
+const getNewValueDeleteContentForward = (value, selectionStart, selectionEnd, data) => {
+  const before = value.slice(0, selectionStart);
+  if (selectionStart === selectionEnd) {
+    const after = value.slice(selectionEnd + 1);
+    const newValue = before + after;
+    return {
+      newValue,
+      cursorOffset: selectionStart
+    };
+  }
+  const after = value.slice(selectionEnd);
+  const newValue = before + after;
+  return {
+    newValue,
+    cursorOffset: selectionStart
+  };
+};
+const getNewValueDeleteWordForward = (value, selectionStart, selectionEnd, data) => {
+  const before = value.slice(0, selectionStart);
+  if (selectionStart === selectionEnd) {
+    let startIndex = Math.min(selectionStart + 1, value.length - 1);
+    while (startIndex < value.length && isAlphaNumeric(value[startIndex])) {
+      startIndex++;
+    }
+    const after = value.slice(startIndex);
+    const newValue = before + after;
+    return {
+      newValue,
+      cursorOffset: before.length
+    };
+  }
+  const after = value.slice(selectionEnd);
+  const newValue = before + after;
+  return {
+    newValue,
+    cursorOffset: selectionStart
+  };
+};
+const getNewValueInsertCompositionText = (value, selectionStart, selectionEnd, data) => {
+  return getNewValueInsertText(value, selectionStart, selectionEnd, data);
+};
+const getNewValueInsertLineBreak = (value, selectionStart, selectionEnd, data) => {
+  return {
+    newValue: value,
+    cursorOffset: selectionEnd
+  };
+};
+const getFn = inputType => {
+  switch (inputType) {
+    case InsertFromPaste:
+    case InsertText:
+      return getNewValueInsertText;
+    case DeleteContentBackward:
+      return getNewValueDeleteContentBackward;
+    case DeleteContentForward:
+      return getNewValueDeleteContentForward;
+    case DeleteWordForward:
+      return getNewValueDeleteWordForward;
+    case DeleteWordBackward:
+      return getNewValueDeleteWordBackward;
+    case InsertLineBreak:
+      return getNewValueInsertLineBreak;
+    case InsertCompositionText:
+      return getNewValueInsertCompositionText;
+    default:
+      throw new Error(`unsupported input type ${inputType}`);
+  }
+};
+const getNewValue = (value, inputType, data, selectionStart, selectionEnd) => {
+  const fn = getFn(inputType);
+  return fn(value, selectionStart, selectionEnd, data);
+};
+
+// TODO when user types letters -> no need to query provider again -> just filter existing results
+const handleInput = async (state, newValue, cursorOffset, inputSource = Script) => {
+  if (state.value === newValue) {
+    return state;
+  }
+  // @ts-ignore
+  state.value = newValue;
+  // @ts-ignore
+  state.inputSource = inputSource;
+  const newPicks = await state.provider.getPicks(newValue);
+  const filterValue = state.provider.getFilterValue(newValue);
+  const items = filterQuickPickItems(newPicks, filterValue, state.provider);
+  const focusedIndex = items.length === 0 ? -1 : 0;
+  return {
+    ...state,
+    picks: newPicks,
+    items,
+    focusedIndex,
+    cursorOffset
+  };
+};
+
+const handleBeforeInput = (state, inputType, data, selectionStart, selectionEnd) => {
+  string(inputType);
+  number(selectionStart);
+  number(selectionEnd);
+  const {
+    value
+  } = state;
+  const {
+    newValue,
+    cursorOffset
+  } = getNewValue(value, inputType, data, selectionStart, selectionEnd);
+  return handleInput(state, newValue, cursorOffset, User);
+};
+
+const closeWidget = async id => {
+  await invoke$1('Viewlet.closeWidget', id);
+};
+
+const handleBlur = async state => {
+  await closeWidget(state.uid);
+  return state;
+};
+
 const getDefaultValue = uri => {
   switch (uri) {
     case 'quickPick://everything':
@@ -2685,7 +3083,7 @@ const QuickPickEntriesColorTheme = {
 const Tag$1 = 'Tag';
 const Cloud$1 = 'Cloud';
 const SourceControl$1 = 'SourceControl';
-const None = '';
+const None$1 = '';
 
 const SourceControl = 1;
 const Cloud = 2;
@@ -2737,7 +3135,7 @@ const getPickFilterValue$1 = pick => {
 const getPickLabel$1 = pick => {
   return pick.label;
 };
-const getPickDescription$1 = pick => {
+const getPickDescription$2 = pick => {
   return pick.description || '';
 };
 const convertIcon = icon => {
@@ -2749,7 +3147,7 @@ const convertIcon = icon => {
     case Tag:
       return Tag$1;
     default:
-      return None;
+      return None$1;
   }
 };
 const getPickIcon$1 = pick => {
@@ -2762,7 +3160,7 @@ const QuickPickEntriesCustom = {
   getHelpEntries: getHelpEntries$2,
   getLabel: getLabel$1,
   getNoResults: getNoResults$2,
-  getPickDescription: getPickDescription$1,
+  getPickDescription: getPickDescription$2,
   getPickFilterValue: getPickFilterValue$1,
   getPickIcon: getPickIcon$1,
   getPickLabel: getPickLabel$1,
@@ -2826,11 +3224,6 @@ const QuickPickEntriesNumber = {
   selectPick: selectPick$1
 };
 
-// TODO support file icons
-const getFolderIcon = () => {
-  return '';
-};
-
 const getRecentlyOpened = () => {
   return invoke$1(/* RecentlyOpened.getRecentlyOpened */'RecentlyOpened.getRecentlyOpened');
 };
@@ -2879,14 +3272,23 @@ const getPickFilterValue = pick => {
 const getPickLabel = pick => {
   return pathBaseName(pick);
 };
-const getPickDescription = pick => {
+const getPickDescription$1 = pick => {
   return pathDirName(pick);
 };
 const getPickIcon = () => {
   return '';
 };
-const getPickFileIcon = () => {
-  return getFolderIcon();
+const getPickFileIcon = pick => {
+  if (typeof pick === 'object') {
+    pick = pick.pick;
+  }
+  if (typeof pick === 'object') {
+    pick = pick.pick;
+  }
+  return {
+    type: Directory$1,
+    name: pick
+  };
 };
 
 const QuickPickEntriesOpenRecent = {
@@ -2895,7 +3297,7 @@ const QuickPickEntriesOpenRecent = {
   getHelpEntries,
   getLabel,
   getNoResults,
-  getPickDescription,
+  getPickDescription: getPickDescription$1,
   getPickFileIcon,
   getPickFilterValue,
   getPickIcon,
@@ -2956,7 +3358,7 @@ const loadContent = async state => {
   array(newPicks);
   // @ts-ignore
   const filterValue = provider.getFilterValue(value);
-  const items = filterQuickPickItems(state.items, filterValue);
+  const items = filterQuickPickItems(newPicks, filterValue, provider);
   // @ts-ignore
   provider.getLabel();
   const minLineY = 0;
@@ -2986,7 +3388,473 @@ const loadQuickPickEntries = moduleId => {
   }
 };
 
+const getIconRequests = (items, provider) => {
+  const iconRequests = [];
+  for (let i = 0; i < items.length; i++) {
+    const pick = items[i];
+    const iconObject = provider.getPickFileIcon(pick);
+    iconRequests.push({
+      name: iconObject?.name,
+      path: '',
+      type: iconObject?.type
+    });
+  }
+  return iconRequests;
+};
+
+const requestFileIcons = async requests => {
+  const promises = requests.map(request => {
+    if (!request.name) {
+      return '';
+    }
+    return request.type === File$2 ? invoke$1('IconTheme.getFileIcon', {
+      name: request.name
+    }) : invoke$1('IconTheme.getFolderIcon', {
+      name: request.name
+    });
+  });
+  return Promise.all(promises);
+};
+
+const getPickDescription = (provider, pick) => {
+  if (provider.getPickDescription) {
+    return provider.getPickDescription(pick);
+  }
+  return '';
+};
+const getVisible = async (provider, items, minLineY, maxLineY, focusedIndex) => {
+  const visibleItems = [];
+  const setSize = items.length;
+  const max = Math.min(setSize, maxLineY);
+  const iconsRequests = getIconRequests(items.slice(minLineY, maxLineY), provider);
+  const icons = await requestFileIcons(iconsRequests);
+  let iconIndex = 0;
+  for (let i = minLineY; i < max; i++) {
+    const item = items[i];
+    const pick = item.pick;
+    const label = provider.getPickLabel(pick);
+    const description = getPickDescription(provider, pick);
+    const icon = provider.getPickIcon(pick);
+    const fileIcon = icons[iconIndex++];
+    visibleItems.push({
+      label,
+      description,
+      icon,
+      fileIcon,
+      posInSet: i + 1,
+      setSize,
+      isActive: i === focusedIndex,
+      matches: item.matches
+    });
+  }
+  return visibleItems;
+};
+
+const createQuickPickViewModel = async (oldState, newState) => {
+  const visibleItems = await getVisible(newState.provider, newState.items, newState.minLineY, newState.maxLineY, newState.focusedIndex);
+  const oldFocusedIndex = oldState.focusedIndex - oldState.minLineY;
+  const newFocusedIndex = newState.focusedIndex - newState.minLineY;
+  const maxLineY = Math.min(newState.maxLineY, newState.items.length);
+  const itemCount = maxLineY - newState.minLineY;
+  const height = itemCount * newState.itemHeight;
+  return {
+    visibleItems,
+    value: newState.value,
+    cursorOffset: newState.cursorOffset,
+    focused: newState.focused,
+    height,
+    oldFocusedIndex,
+    newFocusedIndex,
+    uid: newState.uid
+  };
+};
+
+const RenderItems = 1;
+const RenderFocus = 2;
+const RenderValue = 3;
+const RenderCursorOffset = 7;
+const RenderFocusedIndex = 8;
+const Height = 9;
+
+const SetCursorOffset = 'setCursorOffset';
+const SetFocusedIndex = 'setFocusedIndex';
+const SetItemsHeight = 'setItemsHeight';
+const SetValue = 'setValue';
+
+const renderCursorOffset = newState => {
+  return ['Viewlet.send', newState.uid, /* method */SetCursorOffset, /* cursorOffset */newState.cursorOffset];
+};
+
+const renderFocus = newState => {
+  const selector = newState.focused ? '.InputBox' : '';
+  return ['Viewlet.focusSelector', selector];
+};
+
+const renderFocusedIndex = newState => {
+  return ['Viewlet.send', newState.uid, /* method */SetFocusedIndex, /* oldFocusedIndex */newState.oldFocusedIndex, /* newFocusedIndex */newState.newFocusedIndex];
+};
+
+const renderHeight = newState => {
+  if (newState.height === 0) {
+    return ['Viewlet.send', newState.uid, /* method */SetItemsHeight, /* height */20];
+  }
+  return ['Viewlet.send', newState.uid, /* method */SetItemsHeight, /* height */newState.height];
+};
+
+const FileIcon = 'FileIcon';
+const Label = 'Label';
+const QuickPickHighlight = 'QuickPickHighlight';
+const QuickPickItem = 'QuickPickItem';
+const QuickPickItemActive = 'QuickPickItemActive';
+const QuickPickItemDescription = 'QuickPickItemDescription';
+const QuickPickItemLabel = 'QuickPickItemLabel';
+
+const None = 'none';
+const Option = 'option';
+
+const Div = 4;
+const Span = 8;
+const Text = 12;
+const Img = 17;
+
+const getFileIconVirtualDom = icon => {
+  return {
+    type: Img,
+    className: FileIcon,
+    src: icon,
+    role: None,
+    childCount: 0
+  };
+};
+
+const text = data => {
+  return {
+    type: Text,
+    text: data,
+    childCount: 0
+  };
+};
+
+const quickPickHighlight = {
+  type: Span,
+  className: QuickPickHighlight,
+  childCount: 1
+};
+const addHighlights = (dom, highlights, label) => {
+  const labelDom = {
+    type: Div,
+    className: QuickPickItemLabel,
+    childCount: 0
+  };
+  dom.push(labelDom);
+  let position = 0;
+  for (let i = 0; i < highlights.length; i += 2) {
+    const highlightStart = highlights[i];
+    const highlightEnd = highlights[i + 1];
+    if (position < highlightStart) {
+      const beforeText = label.slice(position, highlightStart);
+      labelDom.childCount++;
+      dom.push(text(beforeText));
+    }
+    const highlightText = label.slice(highlightStart, highlightEnd);
+    labelDom.childCount++;
+    dom.push(quickPickHighlight, text(highlightText));
+    position = highlightEnd;
+  }
+  if (position < label.length) {
+    const afterText = label.slice(position);
+    labelDom.childCount++;
+    dom.push(text(afterText));
+  }
+};
+const getQuickPickItemVirtualDom = visibleItem => {
+  const {
+    posInSet,
+    label,
+    setSize,
+    isActive,
+    description,
+    icon,
+    matches,
+    fileIcon
+  } = visibleItem;
+  const highlights = matches.slice(1);
+  const dom = [];
+  dom.push({
+    type: Div,
+    className: QuickPickItem,
+    role: Option,
+    ariaPosInSet: posInSet,
+    ariaSetSize: setSize,
+    childCount: 1
+  });
+  const parent = dom[0];
+  if (isActive) {
+    // @ts-ignore
+    parent.id = 'QuickPickItemActive';
+    parent.className += ' ' + QuickPickItemActive;
+  }
+  if (fileIcon) {
+    parent.childCount++;
+    dom.push(getFileIconVirtualDom(fileIcon));
+  } else if (icon) {
+    parent.childCount++;
+    dom.push({
+      type: Div,
+      className: `QuickPickMaskIcon MaskIcon MaskIcon${icon}`,
+      childCount: 0
+    });
+  }
+  addHighlights(dom, highlights, label);
+  if (description) {
+    parent.childCount++;
+    dom.push({
+      type: Div,
+      className: QuickPickItemDescription,
+      childCount: 1
+    }, text(description));
+  }
+  return dom;
+};
+
+const getQuickPickItemsVirtualDom = visibleItems => {
+  if (visibleItems.length === 0) {
+    return [{
+      type: Div,
+      className: 'QuickPickItem QuickPickItemActive QuickPickStatus',
+      childCount: 1
+    }, {
+      type: Div,
+      className: Label,
+      childCount: 1
+    }, text('No Results')];
+  }
+  const dom = visibleItems.flatMap(getQuickPickItemVirtualDom);
+  return dom;
+};
+
+const renderItems = newState => {
+  const dom = getQuickPickItemsVirtualDom(newState.visibleItems);
+  return ['Viewlet.send', newState.uid, /* method */'setItemsDom', dom];
+};
+
+const renderValue = newState => {
+  return ['Viewlet.send', newState.uid, /* method */SetValue, /* value */newState.value];
+};
+
+const getRenderer = diffType => {
+  switch (diffType) {
+    case RenderValue:
+      return renderValue;
+    case RenderCursorOffset:
+      return renderCursorOffset;
+    case RenderItems:
+      return renderItems;
+    case RenderFocusedIndex:
+      return renderFocusedIndex;
+    case Height:
+      return renderHeight;
+    case RenderFocus:
+      return renderFocus;
+    default:
+      throw new Error('unknown renderer');
+  }
+};
+
+const applyRender = async (oldState, newState, diffResult) => {
+  const commands = [];
+  const viewModel = await createQuickPickViewModel(oldState, newState);
+  for (const item of diffResult) {
+    const fn = getRenderer(item);
+    commands.push(fn(viewModel));
+  }
+  return commands;
+};
+
+const diffType$4 = RenderFocus;
+const isEqual$4 = (oldState, newState) => {
+  return oldState.focused === newState.focused;
+};
+
+const DiffFocus = {
+  __proto__: null,
+  diffType: diffType$4,
+  isEqual: isEqual$4
+};
+
+const diffType$3 = RenderFocusedIndex;
+const isEqual$3 = (oldState, newState) => {
+  return oldState.focusedIndex === newState.focusedIndex;
+};
+
+const DiffFocusedIndex = {
+  __proto__: null,
+  diffType: diffType$3,
+  isEqual: isEqual$3
+};
+
+const diffType$2 = Height;
+const isEqual$2 = (oldState, newState) => {
+  return oldState.items.length === newState.items.length;
+};
+
+const DiffHeight = {
+  __proto__: null,
+  diffType: diffType$2,
+  isEqual: isEqual$2
+};
+
+const diffType$1 = RenderItems;
+const isEqual$1 = (oldState, newState) => {
+  return oldState.items === newState.items && oldState.minLineY === newState.minLineY && oldState.maxLineY === newState.maxLineY && oldState.focusedIndex === newState.focusedIndex;
+};
+
+const DiffItems = {
+  __proto__: null,
+  diffType: diffType$1,
+  isEqual: isEqual$1
+};
+
+const diffType = RenderValue;
+const isEqual = (oldState, newState) => {
+  return newState.inputSource === User || oldState.value === newState.value;
+};
+
+const DiffValue = {
+  __proto__: null,
+  diffType,
+  isEqual
+};
+
+const modules = [DiffHeight, DiffItems, DiffFocus, DiffFocus, DiffValue, DiffFocusedIndex];
+
+const diff = (oldState, newState) => {
+  const diffResult = [];
+  for (const module of modules) {
+    if (!module.isEqual(oldState, newState)) {
+      diffResult.push(module.diffType);
+    }
+  }
+  return diffResult;
+};
+
+const doRender = async uid => {
+  const {
+    oldState,
+    newState
+  } = get(uid);
+  const diffResult = diff(oldState, newState);
+  return applyRender(oldState, newState, diffResult);
+};
+
+const getPick = (items, index) => {
+  array(items);
+  number(index);
+  // if (index < state.recentPicks.length) {
+  //   return state.recentPicks[index]
+  // }
+  // index -= state.recentPicks.length
+  if (index < items.length) {
+    return items[index].pick;
+  }
+  console.warn('no pick matching index', index);
+};
+
+const selectIndex = async (state, index, button = /* left */0) => {
+  const {
+    minLineY,
+    provider,
+    items
+  } = state;
+  const actualIndex = index + minLineY;
+  const pick = getPick(items, actualIndex);
+  const selectPickResult = await provider.selectPick(pick, actualIndex, button);
+  object(selectPickResult);
+  string(selectPickResult.command);
+  const {
+    command
+  } = selectPickResult;
+  switch (command) {
+    case Hide:
+      await closeWidget(state.uid);
+      return state;
+    default:
+      return state;
+  }
+
+  // TODO recent picks should be per provider
+  // if (!state.recentPickIds.has(pick.id)) {
+  //   state.recentPicks.unshift(pick)
+  //   state.recentPickIds.add(pick.id)
+  // }
+  // if (state.recentPicks.length > RECENT_PICKS_MAX_SIZE) {
+  //   const last = state.recentPicks.pop()
+  //   state.recentPickIds.delete(last.id)
+  // }
+};
+
+const selectCurrentIndex = state => {
+  return selectIndex(state, state.focusedIndex);
+};
+
+const findLabelIndex = (items, label) => {
+  for (let i = 0; i < items.length; i++) {
+    if (items[i].pick.label === label) {
+      return i;
+    }
+  }
+  return -1;
+};
+
+const selectItem = async (state, label) => {
+  string(label);
+  const index = findLabelIndex(state.items, label);
+  if (index === -1) {
+    return state;
+  }
+  return selectIndex(state, index);
+};
+
+const wrapCommand = fn => {
+  const wrapped = async (uid, ...args) => {
+    const {
+      newState
+    } = get(uid);
+    const newerState = await fn(newState, ...args);
+    set(uid, newState, newerState);
+  };
+  return wrapped;
+};
+
 const commandMap = {
+  'QuickPick.create2': create$1,
+  'QuickPick.handleInput': wrapCommand(handleInput),
+  'QuickPick.focusFirst': wrapCommand(focusFirst),
+  'QuickPick.focusIndex': wrapCommand(focusIndex),
+  'QuickPick.focusLast': wrapCommand(focusLast),
+  'QuickPick.focusNext': wrapCommand(focusNext),
+  'QuickPick.focusPrevious': wrapCommand(focusPrevious),
+  'QuickPick.getCommandIds': getCommandIds,
+  'QuickPick.getKeyBindings': getKeyBindings,
+  'QuickPick.handleBeforeInput': wrapCommand(handleBeforeInput),
+  'QuickPick.handleBlur': wrapCommand(handleBlur),
+  'QuickPick.handleWheel': wrapCommand(handleWheel),
+  'QuickPick.loadContent': wrapCommand(loadContent),
+  'QuickPick.loadEntries2': load,
+  'QuickPick.render': doRender,
+  'QuickPick.selectCurrentIndex': wrapCommand(selectCurrentIndex),
+  'QuickPick.selectIndex': wrapCommand(selectIndex),
+  'QuickPick.selectItem': wrapCommand(selectItem),
+  'QuickPick.setDeltaY': wrapCommand(setDeltaY),
+  'QuickPick.addMenuEntries': add,
+  'SearchFile.filter': filterQuickPickItems,
+  'SearchFile.searchFile': searchFile$1,
+  'SearchFile.searchFileWithFetch': searchFile$4,
+  'SearchFile.searchFileWithHtml': searchFile$3,
+  'SearchFile.searchFileWithRipGrep': searchFile$2,
+  // deprecated
+  'QuickPick.create': create,
+  'QuickPick.loadEntries': loadQuickPickEntries,
   'FileSystemFetch.chmod': chmod,
   'FileSystemFetch.getBlob': getBlob,
   'FileSystemFetch.mkdir': mkdir,
@@ -3002,24 +3870,14 @@ const commandMap = {
   'FileSystemMemory.readDirWithFileTypes': readDirWithFileTypes$1,
   'FileSystemMemory.readFile': readFile$1,
   'FileSystemMemory.remove': remove$1,
-  'FileSystemMemory.writeFile': writeFile$1,
-  'QuickPick.create': create,
-  'QuickPick.getKeyBindings': getKeyBindings,
-  'QuickPick.loadContent': loadContent,
-  'QuickPick.loadEntries': loadQuickPickEntries,
-  'QuickPick.loadEntries2': load,
-  'SearchFile.filter': filterQuickPickItems,
-  'SearchFile.searchFile': searchFile,
-  'SearchFile.searchFileWithFetch': searchFile$3,
-  'SearchFile.searchFileWithHtml': searchFile$2,
-  'SearchFile.searchFileWithRipGrep': searchFile$1
+  'FileSystemMemory.writeFile': writeFile$1
 };
 
 const listen = async () => {
   const rpc = await WebWorkerRpcClient.create({
     commandMap: commandMap
   });
-  setRpc(rpc);
+  set$1(RendererWorker, rpc);
 };
 
 const main = async () => {