@lvce-editor/extension-detail-view 3.7.0 → 3.9.0

package/dist/extensionDetailViewWorkerMain.js

@@ -767,12 +767,12 @@ const invokeAndTransfer = (ipc, method, ...params) => {
   return invokeHelper(ipc, method, params, true);
 };
 
-const commands = Object.create(null);
+const commands$1 = Object.create(null);
 const register = commandMap => {
-  Object.assign(commands, commandMap);
+  Object.assign(commands$1, commandMap);
 };
 const getCommand = key => {
-  return commands[key];
+  return commands$1[key];
 };
 const execute = (command, ...args) => {
   const fn = getCommand(command);
@@ -897,7 +897,10 @@ const Aside$2 = 'Aside';
 const Categories = 'Categories';
 const Category = 'Category';
 const Changelog$1 = 'Changelog';
+const FeatureProgrammingLanguages = 'FeatureProgrammingLanguages';
+const FeatureJsonValidation = 'FeatureJsonValidation';
 const ExtensionDetail = 'ExtensionDetail';
+const FeatureCommands = 'FeatureCommands';
 const ExtensionDetailDescription = 'ExtensionDetailDescription';
 const ExtensionDetailHeader = 'ExtensionDetailHeader';
 const ExtensionDetailHeaderDetails = 'ExtensionDetailHeaderDetails';
@@ -917,6 +920,7 @@ const MoreInfoEntryKey = 'MoreInfoEntryKey';
 const MoreInfoEntryValue = 'MoreInfoEntryValue';
 const Resource = 'Resource';
 const Resources = 'Resources';
+const Table$1 = 'Table';
 const Viewlet = 'Viewlet';
 
 const BYTE_UNITS = ['B', 'kB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
@@ -991,43 +995,49 @@ const getDisplaySize = size => {
   });
 };
 
+const A$1 = 53;
+const Abbr$1 = 54;
+const Article$1 = 27;
+const Aside$1 = 28;
+const Br$1 = 55;
 const Button = 1;
+const Cite$1 = 56;
+const Data$1 = 57;
+const Dd$1 = 43;
 const Div$1 = 4;
+const Dl$1 = 44;
+const Figcaption$1 = 45;
+const Figure$1 = 46;
+const Footer$1 = 29;
 const H1$1 = 5;
-const Span$1 = 8;
-const Text$1 = 12;
-const Img$1 = 17;
 const H2$1 = 22;
 const H3$1 = 23;
 const H4$1 = 24;
 const H5$1 = 25;
-const Article$1 = 27;
-const Aside$1 = 28;
-const Footer$1 = 29;
 const Header$1 = 30;
-const Nav$1 = 40;
-const Section$1 = 41;
-const Search$1 = 42;
-const Dd$1 = 43;
-const Dl$1 = 44;
-const Figcaption$1 = 45;
-const Figure$1 = 46;
 const Hr$1 = 47;
+const Img$1 = 17;
 const Li$1 = 48;
+const Nav$1 = 40;
 const Ol$1 = 49;
 const P$1 = 50;
 const Pre$1 = 51;
-const A$1 = 53;
-const Abbr$1 = 54;
-const Br$1 = 55;
-const Cite$1 = 56;
-const Data$1 = 57;
-const Time$1 = 58;
+const Search$1 = 42;
+const Section$1 = 41;
+const Span$1 = 8;
+const Table = 9;
+const TBody = 10;
+const Td = 11;
+const Text$2 = 12;
 const Tfoot$1 = 59;
+const Th = 13;
+const THead = 14;
+const Time$1 = 58;
+const Tr = 15;
 
 const text = data => {
   return {
-    type: Text$1,
+    type: Text$2,
     text: data,
     childCount: 0
   };
@@ -1329,7 +1339,7 @@ const Doctype = 16;
 const StartCommentDashes = 17;
 const Comment = 18;
 const EndCommentTag = 19;
-const Text = 20;
+const Text$1 = 20;
 const CommentStart = 21;
 
 const isSelfClosingTag = tag => {
@@ -1412,7 +1422,7 @@ const tokenizeHtml = text => {
           token = Content;
           state = State.TopLevelContent;
         } else if (next = part.match(RE_ANGLE_BRACKET_OPEN)) {
-          token = Text;
+          token = Text$1;
           state = State.TopLevelContent;
         } else {
           throw new UnexpectedTokenError();
@@ -1435,7 +1445,7 @@ const tokenizeHtml = text => {
           token = ExclamationMark;
           state = State.AfterExclamationMark;
         } else if (next = part.match(RE_ANY_TEXT)) {
-          token = Text;
+          token = Text$1;
           state = State.TopLevelContent;
         } else {
           text.slice(index); // ?
@@ -1474,7 +1484,7 @@ const tokenizeHtml = text => {
           token = WhitespaceInsideOpeningTag;
           state = State.InsideOpeningTagAfterWhitespace;
         } else if (next = part.match(RE_TAG_TEXT)) {
-          token = Text;
+          token = Text$1;
           state = State.TopLevelContent;
         } else {
           throw new UnexpectedTokenError();
@@ -1724,36 +1734,267 @@ const getDetailsVirtualDom = (sanitizedReadmeHtml, displaySize, extensionId, ext
   return dom;
 };
 
-const getFeatureListItemVirtualDom = feature => {
+const emptyObject = {};
+const RE_PLACEHOLDER = /\{(PH\d+)\}/g;
+const i18nString = (key, placeholders = emptyObject) => {
+  if (placeholders === emptyObject) {
+    return key;
+  }
+  const replacer = (match, rest) => {
+    return placeholders[rest];
+  };
+  return key.replaceAll(RE_PLACEHOLDER, replacer);
+};
+
+const Copy = 'Copy';
+const OpenInNewTab = 'Open in New Tab';
+const OpenImageInNewTab = 'Open Image in New Tab';
+const SaveImageAs = 'Save Image as';
+const FileMatch = 'File Match';
+const Schema = 'Schema';
+const Theme$1 = 'Theme';
+const Commands$1 = 'Commands';
+const JsonValidation$1 = 'Json Validation';
+const ProgrammingLanguages$1 = 'Programming Languages';
+const Settings$1 = 'Settings';
+
+const copy = () => {
+  return i18nString(Copy);
+};
+const openInNewTab = () => {
+  return i18nString(OpenInNewTab);
+};
+const openImageInNewTab = () => {
+  return i18nString(OpenImageInNewTab);
+};
+const saveImageAs = () => {
+  return i18nString(SaveImageAs);
+};
+const fileMatch = () => {
+  return i18nString(FileMatch);
+};
+const schema = () => {
+  return i18nString(Schema);
+};
+const theme = () => {
+  return i18nString(Theme$1);
+};
+const commands = () => {
+  return i18nString(Commands$1);
+};
+const jsonValidation = () => {
+  return i18nString(JsonValidation$1);
+};
+const programmingLanguages = () => {
+  return i18nString(ProgrammingLanguages$1);
+};
+const settings = () => {
+  return i18nString(Settings$1);
+};
+
+const Text = 1;
+const Code = 2;
+
+const getCommandTableEntry = command => {
+  // TODO watch out for command being null/undefined/number/string/array
   const {
-    label,
-    selected,
-    id
-  } = feature;
-  const className = selected ? 'Feature FeatureSelected' : Feature;
+    id,
+    label
+  } = command;
   return [{
-    // TODO use role list item or tab
-    type: Button,
-    name: id,
-    className,
+    type: Code,
+    value: id
+  }, {
+    type: Text,
+    value: label
+  }];
+};
+const getCommandTableEntries = extension => {
+  const commands = extension.commands || [];
+  const rows = commands.map(getCommandTableEntry);
+  return {
+    headings: ['ID', 'Label'],
+    rows
+  };
+};
+
+const getCellCodeVirtualDom = value => {
+  return [{
+    type: Td,
+    className: 'TableCell',
     childCount: 1
-  }, text(label)];
+  }, {
+    type: Div$1,
+    // TODO use code tag
+    childCount: 1
+  }, text(value)];
 };
 
-const getFeatureListVirtualDom = features => {
+const getCellTextVirtualDom = value => {
+  return [{
+    type: Td,
+    className: 'TableCell',
+    childCount: 1
+  }, text(value)];
+};
+
+const getCellRenderer = type => {
+  switch (type) {
+    case Code:
+      return getCellCodeVirtualDom;
+    case Text:
+      return getCellTextVirtualDom;
+    default:
+      throw new Error(`unexpected cell type ${type}`);
+  }
+};
+
+const getCellVirtualDom = entry => {
+  const {
+    value,
+    type
+  } = entry;
+  const fn = getCellRenderer(type);
+  return fn(value);
+};
+
+const getTableHeadingVirtualDom = heading => {
+  return [{
+    type: Th,
+    className: 'TableHeading',
+    childCount: 1
+  }, text(heading)];
+};
+
+const getTableRowVirtualDom = entries => {
+  return [{
+    type: Tr,
+    childCount: entries.length
+  }, ...entries.flatMap(getCellVirtualDom)];
+};
+const getTableVirtualDom = tableInfo => {
+  const {
+    headings,
+    rows
+  } = tableInfo;
+  return [{
+    type: Table,
+    className: Table$1,
+    childCount: 2
+  }, {
+    type: THead,
+    childCount: 1
+  }, {
+    type: Tr,
+    childCount: headings.length
+  }, ...headings.flatMap(getTableHeadingVirtualDom), {
+    type: TBody,
+    childCount: rows.length
+  }, ...rows.flatMap(getTableRowVirtualDom)];
+};
+
+const getFeatureCommandsVirtualDom = extension => {
+  const heading = commands();
+  const tableInfo = getCommandTableEntries(extension);
   return [{
-    // TODO use either list or tabs role
     type: Div$1,
-    className: FeaturesList,
-    childCount: features.length,
-    onClick: HandleFeaturesClick
-  }, ...features.flatMap(getFeatureListItemVirtualDom)];
+    className: FeatureCommands,
+    childCount: 2
+  }, {
+    type: H1$1,
+    childCount: 1
+  }, text(heading), ...getTableVirtualDom(tableInfo)];
+};
+
+const getJsonValidationTableEntry = validation => {
+  const {
+    fileMatch,
+    schema
+  } = validation;
+  return [{
+    type: Code,
+    value: fileMatch
+  }, {
+    type: Code,
+    value: schema
+  }];
+};
+
+const getJsonValidationTableEntries = extension => {
+  const validations = extension.jsonValidation || [];
+  const rows = validations.map(getJsonValidationTableEntry);
+  return {
+    headings: [fileMatch(), schema()],
+    rows
+  };
+};
+
+const getFeatureJsonValidationVirtualDom = extension => {
+  const heading = jsonValidation();
+  const tableInfo = getJsonValidationTableEntries(extension);
+  return [{
+    type: Div$1,
+    className: FeatureJsonValidation,
+    childCount: 2
+  }, {
+    type: H1$1,
+    childCount: 1
+  }, text(heading), ...getTableVirtualDom(tableInfo)];
+};
+
+const getFeatureProgrammingLanguagesVirtualDom = () => {
+  const heading = programmingLanguages();
+  // TODO
+  return [{
+    type: Div$1,
+    className: FeatureProgrammingLanguages,
+    childCount: 1
+  }, {
+    type: H1$1,
+    childCount: 1
+  }, text(heading)];
+};
+
+const getSettingsTableEntry = setting => {
+  const {
+    id,
+    label
+  } = setting;
+  // TODO watch out for  null/undefined/number/string/array
+  return [{
+    type: Text,
+    value: id
+  }, {
+    type: Text,
+    value: label
+  }];
+};
+const getSettingsTableEntries = extension => {
+  const settings = extension.settings || [];
+  const rows = settings.map(getSettingsTableEntry);
+  return {
+    headings: ['ID', 'Label'],
+    rows
+  };
+};
+
+const getFeatureSettingsVirtualDom = extension => {
+  const heading = settings();
+  const tableInfo = getSettingsTableEntries(extension);
+  return [{
+    type: Div$1,
+    className: 'FeatureSettings',
+    childCount: 2
+  }, {
+    type: H1$1,
+    childCount: 1
+  }, text(heading), ...getTableVirtualDom(tableInfo)];
 };
 
 const getFeatureThemesVirtualDom = themesHtml => {
   const markdownDom = getMarkdownVirtualDom(themesHtml);
   const childCount = getVirtualDomChildCount(markdownDom);
-  const heading = 'Themes';
+  const heading = theme();
   return [{
     type: Div$1,
     className: 'FeatureTheme',
@@ -1768,7 +2009,70 @@ const getFeatureThemesVirtualDom = themesHtml => {
   }, ...markdownDom];
 };
 
-const getFeaturesVirtualDom = (features, themesHtml) => {
+const Changelog = 'Changelog';
+const Commands = 'Commands';
+const Details = 'Details';
+const Features = 'Features';
+const JsonValidation = 'JsonValidation';
+const ProgrammingLanguages = 'ProgrammingLanguages';
+const Settings = 'Settings';
+const Theme = 'Theme';
+
+const getFeatureContentVirtualDom = (features, themesHtml, selectedFeature, extension) => {
+  switch (selectedFeature) {
+    case Theme:
+      return getFeatureThemesVirtualDom(themesHtml);
+    case Commands:
+      return getFeatureCommandsVirtualDom(extension);
+    case JsonValidation:
+      return getFeatureJsonValidationVirtualDom(extension);
+    case ProgrammingLanguages:
+      return getFeatureProgrammingLanguagesVirtualDom();
+    case Settings:
+      return getFeatureSettingsVirtualDom(extension);
+    default:
+      return [{
+        type: Div$1,
+        className: 'FeatureContent',
+        childCount: 1
+      }, text('Not Implemented')];
+  }
+};
+
+const getFeatureListItemVirtualDom = feature => {
+  const {
+    label,
+    selected,
+    id
+  } = feature;
+  const className = selected ? 'Feature FeatureSelected' : Feature;
+  return [{
+    // TODO use role list item or tab
+    type: Button,
+    name: id,
+    className,
+    childCount: 1
+  }, text(label)];
+};
+
+const getFeatureListVirtualDom = features => {
+  return [{
+    // TODO use either list or tabs role
+    type: Div$1,
+    className: FeaturesList,
+    childCount: features.length,
+    onClick: HandleFeaturesClick
+  }, ...features.flatMap(getFeatureListItemVirtualDom)];
+};
+
+const getFeaturesVirtualDom = (features, themesHtml, selectedFeature, extension) => {
+  if (features.length === 0) {
+    return [{
+      type: Div$1,
+      className: Features$1,
+      childCount: 3
+    }, text('None')];
+  }
   return [{
     type: Div$1,
     className: Features$1,
@@ -1777,24 +2081,15 @@ const getFeaturesVirtualDom = (features, themesHtml) => {
     type: Div$1,
     className: 'Sash SashVertical',
     childCount: 0
-  }, ...getFeatureThemesVirtualDom(themesHtml)];
+  }, ...getFeatureContentVirtualDom(features, themesHtml, selectedFeature, extension)];
 };
 
-const Changelog = 'Changelog';
-const Commands = 'Commands';
-const Details = 'Details';
-const Features = 'Features';
-const JsonValidation = 'JsonValidation';
-const ProgrammingLanguages = 'ProgrammingLanguages';
-const Settings = 'Settings';
-const Theme = 'Theme';
-
-const getExtensionDetailContentVirtualDom = (sanitizedReadmeHtml, themesHtml, selectedTab, features, displaySize, extensionId, extensionVersion) => {
+const getExtensionDetailContentVirtualDom = (sanitizedReadmeHtml, themesHtml, selectedTab, features, displaySize, extensionId, extensionVersion, selectedFeature, extension) => {
   switch (selectedTab) {
     case Details:
       return getDetailsVirtualDom(sanitizedReadmeHtml, displaySize, extensionId, extensionVersion);
     case Features:
-      return getFeaturesVirtualDom(features, themesHtml);
+      return getFeaturesVirtualDom(features, themesHtml, selectedFeature, extension);
     case Changelog:
       return getChangelogVirtualDom();
     default:
@@ -1835,28 +2130,36 @@ const getExtensionDetailHeaderVirtualDom = extensionDetail => {
   return dom;
 };
 
-const getFeatures = () => {
-  const features = [{
-    id: Theme,
-    label: 'Theme',
-    selected: true
-  }, {
-    id: Commands,
-    label: 'Commands',
-    selected: false
-  }, {
-    id: JsonValidation,
-    label: 'Json Validation',
-    selected: false
-  }, {
-    id: ProgrammingLanguages,
-    label: 'Programming Languages',
-    selected: false
-  }, {
-    id: Settings,
-    label: 'Settings',
-    selected: false
+const hasThemes = extension => {
+  return extension && (extension.colorThemes || extension.iconThemes || extension.productIconThemes);
+};
+const hasCommands = extension => {
+  return extension && extension.commands;
+};
+const hasJsonValidation = extension => {
+  return extension && extension.jsonValidation;
+};
+const hasProgrammingLanguages = extension => {
+  return extension && extension.programmingLanguages;
+};
+const hasSettings = extension => {
+  return extension && extension.settings;
+};
+const ifElseFeature = (id, label, isEnabled, selectedFeature, extension) => {
+  if (!isEnabled(extension)) {
+    return [];
+  }
+  return [{
+    id,
+    label,
+    selected: selectedFeature === id
   }];
+};
+const getFeatures = (selectedFeature, extension) => {
+  if (!selectedFeature) {
+    selectedFeature = Theme;
+  }
+  const features = [...ifElseFeature(Theme, 'Theme', hasThemes, selectedFeature, extension), ...ifElseFeature(Commands, 'Commands', hasCommands, selectedFeature, extension), ...ifElseFeature(JsonValidation, 'Json Validation', hasJsonValidation, selectedFeature, extension), ...ifElseFeature(ProgrammingLanguages, 'Programming Languages', hasProgrammingLanguages, selectedFeature, extension), ...ifElseFeature(Settings, 'Settings', hasSettings, selectedFeature, extension)];
   return features;
 };
 
@@ -1918,8 +2221,15 @@ const getTabsVirtualDom = tabs => {
 };
 
 const getExtensionDetailVirtualDom = (extensionDetail, sanitizedReadmeHtml, selectedTab, newState) => {
+  // TODO move this to view model so that rendering occurs like
+  // 1. state
+  // 2. view model
+  // 3. virtual dom
+  // 4. dom
   const themesHtml = newState?.selectedFeatureMarkdownDom || '';
-  const features = newState?.features || getFeatures();
+  const selectedFeature = newState?.selectedFeature || '';
+  const extension = newState?.extension || {};
+  const features = getFeatures(selectedFeature, extension);
   const size = newState.folderSize || 0;
   const extensionId = newState?.extension?.id || 'n/a';
   const extensionVersion = newState?.extension?.version || 'n/a';
@@ -1929,40 +2239,10 @@ const getExtensionDetailVirtualDom = (extensionDetail, sanitizedReadmeHtml, sele
     type: Div$1,
     className: mergeClassNames(Viewlet, ExtensionDetail),
     childCount: 3
-  }, ...getExtensionDetailHeaderVirtualDom(extensionDetail), ...getTabsVirtualDom(tabs), ...getExtensionDetailContentVirtualDom(sanitizedReadmeHtml, themesHtml, selectedTab, features, displaySize, extensionId, extensionVersion)];
+  }, ...getExtensionDetailHeaderVirtualDom(extensionDetail), ...getTabsVirtualDom(tabs), ...getExtensionDetailContentVirtualDom(sanitizedReadmeHtml, themesHtml, selectedTab, features, displaySize, extensionId, extensionVersion, selectedFeature, extension)];
   return dom;
 };
 
-const emptyObject = {};
-const RE_PLACEHOLDER = /\{(PH\d+)\}/g;
-const i18nString = (key, placeholders = emptyObject) => {
-  if (placeholders === emptyObject) {
-    return key;
-  }
-  const replacer = (match, rest) => {
-    return placeholders[rest];
-  };
-  return key.replaceAll(RE_PLACEHOLDER, replacer);
-};
-
-const Copy = 'Copy';
-const OpenInNewTab = 'Open in New Tab';
-const OpenImageInNewTab = 'Open Image in New Tab';
-const SaveImageAs = 'Save Image as';
-
-const copy = () => {
-  return i18nString(Copy);
-};
-const openInNewTab = () => {
-  return i18nString(OpenInNewTab);
-};
-const openImageInNewTab = () => {
-  return i18nString(OpenImageInNewTab);
-};
-const saveImageAs = () => {
-  return i18nString(SaveImageAs);
-};
-
 const None = 0;
 
 const getCopyMenuEntry = () => ({
@@ -4716,7 +4996,8 @@ const getAllExtensions = async platform => {
   }
   return invoke('ExtensionManagement.getAllExtensions');
 };
-const getExtension = async (id, platform) => {
+const getExtension$1 = async (id, platform) => {
+  // TODO only ask one extension from renderer worker instead of all
   const allExtensions = await getAllExtensions(platform);
   for (const extension of allExtensions) {
     if (extension.id === id) {
@@ -4726,6 +5007,17 @@ const getExtension = async (id, platform) => {
   return undefined;
 };
 
+const getExtensionNew = async id => {
+  return invoke('ExtensionManagement.getExtension', id);
+};
+const getExtension = async (id, platform) => {
+  try {
+    return await getExtensionNew(id);
+  } catch {
+    return getExtension$1(id, platform);
+  }
+};
+
 const getRemoteSrc = uri => {
   const src = `/remote${uri}`;
   return src;
@@ -4749,6 +5041,13 @@ const getFolderSize = async uri => {
   }
 };
 
+const getSavedSelectedFeature = savedState => {
+  if (savedState && typeof savedState === 'object' && 'selectedFeature' in savedState && typeof savedState.selectedFeature === 'string') {
+    return savedState.selectedFeature;
+  }
+  return Details;
+};
+
 const getSavedSelectedTab = savedState => {
   if (savedState && typeof savedState === 'object' && 'selectedTab' in savedState && typeof savedState.selectedTab === 'string') {
     return savedState.selectedTab;
@@ -4817,7 +5116,8 @@ const loadContent = async (state, platform, savedState) => {
   const name = getName(extension);
   const size = getViewletSize(width);
   const selectedTab = getSavedSelectedTab(savedState);
-  const features = getFeatures();
+  const selectedFeature = getSavedSelectedFeature(savedState);
+  const features = getFeatures(selectedFeature, extension);
   const folderSize = await getFolderSize(extension.uri);
   const entries = [{
     key: 'Identifier',
@@ -4874,10 +5174,12 @@ const loadContent = async (state, platform, savedState) => {
 
 const saveState = state => {
   const {
-    selectedTab
+    selectedTab,
+    selectedFeature
   } = state;
   return {
-    selectedTab
+    selectedTab,
+    selectedFeature
   };
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/extension-detail-view",
-  "version": "3.7.0",
+  "version": "3.9.0",
   "description": "Extension Detail View Worker",
   "keywords": [],
   "license": "MIT",