@lvce-editor/extension-detail-view 5.7.0 → 5.8.0

package/dist/extensionDetailViewWorkerMain.js

@@ -247,22 +247,22 @@ const invalidLink = () => {
 const getActivationEntry = value => {
   if (typeof value !== 'string') {
     return {
+      errorMessage: propertyMustBeOfTypeString(),
       isValid: false,
-      stringValue: JSON.stringify(value),
-      errorMessage: propertyMustBeOfTypeString()
+      stringValue: JSON.stringify(value)
     };
   }
   if (!value) {
     return {
+      errorMessage: stringMustNotBeEmpty(),
       isValid: false,
-      stringValue: '',
-      errorMessage: stringMustNotBeEmpty()
+      stringValue: ''
     };
   }
   return {
+    errorMessage: '',
     isValid: true,
-    stringValue: value,
-    errorMessage: ''
+    stringValue: value
   };
 };
 const getActivationEntries = activation => {
@@ -273,8 +273,8 @@ const getActivationEventsDetails = async extension => {
   const activationEvents = extension.activation || [];
   const activationEntries = getActivationEntries(activationEvents);
   return {
-    activationEvents,
-    activationEntries
+    activationEntries,
+    activationEvents
   };
 };
 
@@ -410,25 +410,25 @@ const TableHeading = 'TableHeading';
 const Viewlet = 'Viewlet';
 
 const li = {
-  type: Li,
-  childCount: 1
+  childCount: 1,
+  type: Li
 };
 const code = {
-  type: Code$2,
-  childCount: 1
+  childCount: 1,
+  type: Code$2
 };
 const getActivationEventVirtualDom = event => {
   const {
-    stringValue,
     errorMessage,
-    isValid
+    isValid,
+    stringValue
   } = event;
   if (!isValid) {
     return [{
-      type: Li,
       childCount: 1,
+      className: 'ListItem ListItemInvalid',
       title: errorMessage,
-      className: 'ListItem ListItemInvalid'
+      type: Li
     }, code, text(stringValue)];
   }
   return [li, code, text(stringValue)];
@@ -436,20 +436,20 @@ const getActivationEventVirtualDom = event => {
 
 const getFeatureContentHeadingVirtualDom = heading => {
   return [{
-    type: H1,
-    childCount: 1
+    childCount: 1,
+    type: H1
   }, text(heading)];
 };
 
 const getFeatureActivationEventsVirtualDom = activationEvents$1 => {
   const heading = activationEvents();
   return [{
-    type: Div,
+    childCount: 2,
     className: FeatureContent,
-    childCount: 2
+    type: Div
   }, ...getFeatureContentHeadingVirtualDom(heading), {
-    type: Ul,
-    childCount: activationEvents$1.length
+    childCount: activationEvents$1.length,
+    type: Ul
   }, ...activationEvents$1.flatMap(getActivationEventVirtualDom)];
 };
 
@@ -506,20 +506,20 @@ const getFeatureCommandsEmptyVirtualDom = () => {
   const heading = commands$1();
   const emptyCommandsArray$1 = emptyCommandsArray();
   return [{
-    type: Div,
+    childCount: 2,
     className: FeatureContent,
-    childCount: 2
+    type: Div
   }, ...getFeatureContentHeadingVirtualDom(heading), {
-    type: P,
-    childCount: 1
+    childCount: 1,
+    type: P
   }, text(emptyCommandsArray$1)];
 };
 
 const getTableHeadingVirtualDom = heading => {
   return [{
-    type: Th,
+    childCount: 1,
     className: TableHeading,
-    childCount: 1
+    type: Th
   }, text(heading)];
 };
 
@@ -535,16 +535,16 @@ const getCellCheckMarkVirtualDom = (value, props) => {
   } = props;
   const checkedText = getCheckedText(checked);
   return [{
-    type: Td,
+    childCount: 1,
     className: TableCell,
-    childCount: 1
+    type: Td
   }, text(checkedText)];
 };
 
 const getListItemDom = item => {
   return [{
-    type: Code$2,
-    childCount: 1
+    childCount: 1,
+    type: Code$2
   }, text(item)];
 };
 const getCellCodeListVirtualDom = (value, props) => {
@@ -552,24 +552,24 @@ const getCellCodeListVirtualDom = (value, props) => {
     listItems
   } = props;
   return [{
-    type: Td,
+    childCount: listItems.length,
     className: TableCell,
-    childCount: listItems.length
+    type: Td
   }, ...listItems.flatMap(getListItemDom)];
 };
 
 const getCellCodeVirtualDom = (value, props) => {
   const tdClassName = props?.className ? `${TableCell} ${props.className}` : TableCell;
   return [{
-    type: Td,
-    className: tdClassName,
     childCount: 1,
+    className: tdClassName,
+    type: Td,
     ...(props?.title ? {
       title: props.title
     } : {})
   }, {
-    type: Code$2,
-    childCount: 1
+    childCount: 1,
+    type: Code$2
   }, text(value)];
 };
 
@@ -584,24 +584,24 @@ const getTitleProps = title => {
 const getCellLinkVirtualDom = (value, props) => {
   const tdClassName = props?.className ? `${TableCell} ${props.className}` : TableCell;
   return [{
-    type: Td,
-    className: tdClassName,
     childCount: 1,
+    className: tdClassName,
+    type: Td,
     ...getTitleProps(props?.title)
   }, {
-    type: A,
+    childCount: 1,
     className: Link$1,
     href: props?.href,
-    childCount: 1
+    type: A
   }, text(value)];
 };
 
 const getCellTextVirtualDom = (value, props) => {
   const tdClassName = props?.className ? `${TableCell} ${props.className}` : TableCell;
   return [{
-    type: Td,
-    className: tdClassName,
     childCount: 1,
+    className: tdClassName,
+    type: Td,
     ...(props?.title ? {
       title: props.title
     } : {})
@@ -610,16 +610,16 @@ const getCellTextVirtualDom = (value, props) => {
 
 const getCellRenderer = type => {
   switch (type) {
+    case CheckMark:
+      return getCellCheckMarkVirtualDom;
     case Code:
       return getCellCodeVirtualDom;
-    case Text:
-      return getCellTextVirtualDom;
-    case Link:
-      return getCellLinkVirtualDom;
     case CodeList:
       return getCellCodeListVirtualDom;
-    case CheckMark:
-      return getCellCheckMarkVirtualDom;
+    case Link:
+      return getCellLinkVirtualDom;
+    case Text:
+      return getCellTextVirtualDom;
     default:
       throw new Error(`unexpected cell type ${type}`);
   }
@@ -627,8 +627,8 @@ const getCellRenderer = type => {
 
 const getCellVirtualDom = entry => {
   const {
-    value,
     type,
+    value,
     ...props
   } = entry;
   const fn = getCellRenderer(type);
@@ -637,8 +637,8 @@ const getCellVirtualDom = entry => {
 
 const getTableRowVirtualDom = entries => {
   return [{
-    type: Tr,
-    childCount: entries.length
+    childCount: entries.length,
+    type: Tr
   }, ...entries.flatMap(getCellVirtualDom)];
 };
 
@@ -648,18 +648,18 @@ const getTableVirtualDom = tableInfo => {
     rows
   } = tableInfo;
   return [{
-    type: Table$1,
+    childCount: 2,
     className: Table,
-    childCount: 2
+    type: Table$1
   }, {
-    type: THead,
-    childCount: 1
+    childCount: 1,
+    type: THead
   }, {
-    type: Tr,
-    childCount: headings.length
+    childCount: headings.length,
+    type: Tr
   }, ...headings.flatMap(getTableHeadingVirtualDom), {
-    type: TBody,
-    childCount: rows.length
+    childCount: rows.length,
+    type: TBody
   }, ...rows.flatMap(getTableRowVirtualDom)];
 };
 
@@ -671,9 +671,9 @@ const getFeatureCommandsVirtualDom = commands => {
   const heading = commands$1();
   const tableInfo = getCommandTableEntries(commands);
   return [{
-    type: Div,
+    childCount: 2,
     className: FeatureContent,
-    childCount: 2
+    type: Div
   }, ...getFeatureContentHeadingVirtualDom(heading), ...getTableVirtualDom(tableInfo)];
 };
 
@@ -763,46 +763,46 @@ const getJsonValidationInfos = async (extensionUri, validations) => {
     } = validation;
     if (typeof schema !== 'string') {
       validationInfos.push({
+        errorMessage: propertyMustBeOfTypeString(),
+        fileMatch,
         isValid: false,
-        stringValue: JSON.stringify(schema),
         schemaUrl: '',
-        errorMessage: propertyMustBeOfTypeString(),
-        fileMatch
+        stringValue: JSON.stringify(schema)
       });
     } else if (schema && !schemaLinkUrl) {
       validationInfos.push({
+        errorMessage: invalidLink(),
+        fileMatch,
         isValid: false,
-        stringValue: schema,
         schemaUrl: schemaLinkUrl,
-        errorMessage: invalidLink(),
-        fileMatch
+        stringValue: schema
       });
     } else if (schemaLinkUrl) {
       // TODO maybe better use filesystem.exists
       if (await existsJson(schemaLinkUrl)) {
         validationInfos.push({
+          errorMessage: '',
+          fileMatch,
           isValid: true,
-          stringValue: schema,
           schemaUrl: schemaLinkUrl,
-          errorMessage: '',
-          fileMatch
+          stringValue: schema
         });
       } else {
         validationInfos.push({
+          errorMessage: schemaNotFound(),
+          fileMatch,
           isValid: false,
-          stringValue: schema,
           schemaUrl: schemaLinkUrl,
-          errorMessage: schemaNotFound(),
-          fileMatch
+          stringValue: schema
         });
       }
     } else {
       validationInfos.push({
+        errorMessage: '',
+        fileMatch,
         isValid: true,
-        stringValue: schema,
         schemaUrl: schemaLinkUrl,
-        errorMessage: '',
-        fileMatch
+        stringValue: schema
       });
     }
   }
@@ -811,22 +811,22 @@ const getJsonValidationInfos = async (extensionUri, validations) => {
 
 const getJsonValidationTableEntry = validationInfo => {
   const {
-    isValid,
     errorMessage,
+    fileMatch,
+    isValid,
     schemaUrl,
-    stringValue,
-    fileMatch
+    stringValue
   } = validationInfo;
   if (!isValid && schemaUrl) {
     return [{
       type: Code,
       value: fileMatch
     }, {
-      type: Link,
-      value: stringValue,
-      href: schemaUrl,
       className: TableCellInvalid,
-      title: errorMessage
+      href: schemaUrl,
+      title: errorMessage,
+      type: Link,
+      value: stringValue
     }];
   }
   if (!isValid) {
@@ -834,10 +834,10 @@ const getJsonValidationTableEntry = validationInfo => {
       type: Text,
       value: fileMatch
     }, {
-      type: Text,
-      value: stringValue,
       className: TableCellInvalid,
-      title: errorMessage
+      title: errorMessage,
+      type: Text,
+      value: stringValue
     }];
   }
   if (schemaUrl) {
@@ -845,9 +845,9 @@ const getJsonValidationTableEntry = validationInfo => {
       type: Code,
       value: fileMatch
     }, {
+      href: schemaUrl,
       type: Link,
-      value: stringValue,
-      href: schemaUrl
+      value: stringValue
     }];
   }
   return [{
@@ -884,9 +884,9 @@ const getJsonValidationTableEntries = rows => {
 };
 
 const parentNode$1 = {
-  type: Div,
+  childCount: 2,
   className: FeatureContent,
-  childCount: 2
+  type: Div
 };
 const getFeatureJsonValidationVirtualDom = jsonValidation$1 => {
   const heading = jsonValidation();
@@ -900,9 +900,9 @@ const getJsonValidationVirtualDom = state => {
 
 const getProgrammingLanguageTableEntry = programmingLanguage => {
   const {
-    id,
     configuration,
-    extensions
+    extensions,
+    id
   } = programmingLanguage;
   const name = ''; // TODO
   const snippets = ''; // TODO
@@ -913,17 +913,17 @@ const getProgrammingLanguageTableEntry = programmingLanguage => {
     type: Text,
     value: name
   }, {
+    listItems: extensions,
     type: CodeList,
-    value: '',
-    listItems: extensions
+    value: ''
   }, {
+    checked: Boolean(configuration),
     type: CheckMark,
-    value: '',
-    checked: Boolean(configuration)
+    value: ''
   }, {
+    checked: Boolean(snippets),
     type: CheckMark,
-    value: '',
-    checked: Boolean(snippets)
+    value: ''
   }];
 };
 
@@ -962,9 +962,9 @@ const getFeatureProgrammingLanguagesVirtualDom = programmingLanguages$1 => {
   const heading = programmingLanguages();
   const tableInfo = getProgrammingLanguagesTableEntries(programmingLanguages$1);
   return [{
-    type: Div,
+    childCount: 2,
     className: FeatureContent,
-    childCount: 2
+    type: Div
   }, ...getFeatureContentHeadingVirtualDom(heading), ...getTableVirtualDom(tableInfo)];
 };
 
@@ -984,14 +984,14 @@ class FeatureNotFoundError extends Error {
 
 const getFeatureUnsupportedVirtualDom = state => {
   return [{
-    type: Div,
-    childCount: 2
+    childCount: 2,
+    type: Div
   }, {
-    type: H1,
-    childCount: 1
+    childCount: 1,
+    type: H1
   }, text(unsupportedFeature()), {
-    type: P,
-    childCount: 1
+    childCount: 1,
+    type: P
   }, text(selectedFeatureUnknownOrUnsupported())];
 };
 
@@ -2318,8 +2318,9 @@ const openUrl$1 = async uri => {
 /* eslint-disable unicorn/prefer-export-from */
 
 const {
-  set: set$4,
-  getRuntimeStatus: getRuntimeStatus$1} = ExtensionHost;
+  getRuntimeStatus: getRuntimeStatus$1,
+  set: set$4
+} = ExtensionHost;
 
 const getRuntimeStatus = async extensionId => {
   // @ts-ignore
@@ -2331,15 +2332,15 @@ const getRuntimeStatus = async extensionId => {
 const getRuntimeStatusDetails = async extension => {
   const {
     activationEvent,
-    status,
     activationTime,
-    importTime
+    importTime,
+    status
   } = await getRuntimeStatus(extension.id);
   return {
-    wasActivatedByEvent: activationEvent,
     activationTime,
+    importTime,
     status,
-    importTime
+    wasActivatedByEvent: activationEvent
   };
 };
 
@@ -2364,17 +2365,17 @@ const getActivationTimeVirtualDom = (importTime$1, activationTime$1) => {
   const formattedImportTime = formatTime(importTime$1);
   const formattedTime = formatTime(activationTime$1);
   return [{
-    type: Dt,
-    childCount: 1
+    childCount: 1,
+    type: Dt
   }, text(importTime()), {
-    type: Dd,
-    childCount: 1
+    childCount: 1,
+    type: Dd
   }, text(formattedImportTime), {
-    type: Dt,
-    childCount: 1
+    childCount: 1,
+    type: Dt
   }, text(activationTime()), {
-    type: Dd,
-    childCount: 1
+    childCount: 1,
+    type: Dd
   }, text(formattedTime)];
 };
 
@@ -2388,28 +2389,28 @@ const getStatusMessage = statusType => {
   switch (statusType) {
     case Activated:
       return 'activated';
-    case None$1:
-      return 'none';
     case Activating:
       return 'Activating';
     case Error$1:
       return 'error';
     case Importing:
       return 'importing';
+    case None$1:
+      return 'none';
     default:
       return 'unknown';
   }
 };
 
 const key = {
-  type: Dt,
   childCount: 1,
-  className: 'RuntimeStatusDefinitionListKey'
+  className: 'RuntimeStatusDefinitionListKey',
+  type: Dt
 };
 const value = {
-  type: Dd,
+  childCount: 1,
   className: 'RuntimeStatusDefinitionListValue',
-  childCount: 1
+  type: Dd
 };
 const getStatusVirtualDom = status$1 => {
   const statusKey = status();
@@ -2427,20 +2428,20 @@ const getChildCount$1 = (status, activationTime, importTime) => {
 };
 const getRuntimeStatusVirtualDom = state => {
   const {
-    status,
     activationTime,
-    importTime
+    importTime,
+    status
   } = state;
   const heading = runtimeStatus();
   const childCount = getChildCount$1(status, activationTime, importTime);
   return [{
-    type: Div,
+    childCount: 2,
     className: FeatureContent,
-    childCount: 2
+    type: Div
   }, ...getFeatureContentHeadingVirtualDom(heading), {
-    type: Dl,
+    childCount,
     className: 'RuntimeStatusDefinitionList',
-    childCount
+    type: Dl
   }, ...getStatusVirtualDom(status), ...getActivationTimeVirtualDom(activationTime, importTime)];
 };
 
@@ -2487,9 +2488,9 @@ const getFeatureSettingsVirtualDom = rows => {
   const heading = settings();
   const tableInfo = getSettingsTableEntries(rows);
   return [{
-    type: Div,
+    childCount: 2,
     className: FeatureContent,
-    childCount: 2
+    type: Div
   }, ...getFeatureContentHeadingVirtualDom(heading), ...getTableVirtualDom(tableInfo)];
 };
 
@@ -2534,26 +2535,27 @@ const WebViews = 'WebViews';
 
 const getScrollToTopVirtualDom = scrollToTopButtonEnabled => {
   return [{
-    type: Button$1,
-    className: ScrollToTopButton,
+    ariaLabel: scrollToTop(),
     childCount: 1,
+    className: ScrollToTopButton,
+    name: ScrollToTop,
     onClick: HandleClickScrollToTop,
-    ariaLabel: scrollToTop(),
-    name: ScrollToTop
+    type: Button$1
   }, {
-    type: Div,
-    className: mergeClassNames(MaskIcon, MaskIconChevronUp),
     childCount: 0,
-    role: None$3
+    className: mergeClassNames(MaskIcon, MaskIconChevronUp),
+    role: None$3,
+    type: Div
   }];
 };
 
 /* eslint-disable unicorn/prefer-export-from */
 
 const {
-  set: set$3,
   getVirtualDom,
-  render} = MarkdownWorker;
+  render,
+  set: set$3
+} = MarkdownWorker;
 
 const getMarkdownVirtualDom = async (html, options) => {
   string(html);
@@ -2563,9 +2565,9 @@ const getMarkdownVirtualDom = async (html, options) => {
     const extraDom = getScrollToTopVirtualDom();
     return [{
       ...firstNode,
-      onScroll: HandleReadmeScroll,
       childCount: firstNode.childCount + 1,
       onClick: HandleReadmeClick,
+      onScroll: HandleReadmeScroll,
       onSelectionChange: HandleSelectionChange
     }, ...extraDom, ...rest];
   }
@@ -2653,9 +2655,8 @@ const getCacheInternal = async cacheName => {
   const twoWeeks = 14 * 24 * 60 * 60 * 1000;
   // @ts-ignore
   const bucket = await navigator.storageBuckets.open(bucketName, {
-    quota: 20 * 1024 * 1024,
-    // 20MB
-    expires: Date.now() + twoWeeks
+    expires: Date.now() + twoWeeks,
+    quota: 20 * 1024 * 1024 // 20MB
   });
   const cache = await bucket.caches.open(cacheName);
   return cache;
@@ -2684,8 +2685,8 @@ const set$2 = async (key, value) => {
   const cache = await getCache(cacheName);
   await cache.put(key, new Response(value, {
     headers: {
-      'Content-Type': 'application/markdown',
-      'Content-Length': `${value.length}`
+      'Content-Length': `${value.length}`,
+      'Content-Type': 'application/markdown'
     }
   }));
 };
@@ -2766,13 +2767,13 @@ const getFeatureThemesVirtualDom = themesDom => {
   const childCount = getVirtualDomChildCount(themesDom);
   const heading = theme();
   return [{
-    type: Div,
+    childCount: 2,
     className: FeatureContent,
-    childCount: 2
+    type: Div
   }, ...getFeatureContentHeadingVirtualDom(heading), {
-    type: Div,
+    childCount,
     className: DefaultMarkdown,
-    childCount
+    type: Div
   }, ...themesDom];
 };
 
@@ -2782,16 +2783,16 @@ const getThemeVirtualDom = state => {
 
 const toWebView = rawWebView => {
   const {
-    id,
-    selector,
     contentSecurityPolicy,
-    elements
+    elements,
+    id,
+    selector
   } = rawWebView;
   return {
-    id,
-    selectorString: JSON.stringify(selector),
     contentSecurityPolicyString: JSON.stringify(contentSecurityPolicy),
-    elementsString: JSON.stringify(elements, null, 2)
+    elementsString: JSON.stringify(elements, null, 2),
+    id,
+    selectorString: JSON.stringify(selector)
   };
 };
 
@@ -2815,47 +2816,47 @@ const featureWebViewsEnabled = extension => {
 };
 
 const heading = {
-  type: H2,
+  childCount: 1,
   className: DefinitionListItemHeading,
-  childCount: 1
+  type: H2
 };
 const pre = {
-  type: Pre,
+  childCount: 1,
   className: DefinitionListItemValue,
-  childCount: 1
+  type: Pre
 };
 const item = {
-  type: Div,
+  childCount: 2,
   className: DefinitionListItem,
-  childCount: 2
+  type: Div
 };
 const getWebViewVirtualDom = webView => {
   const {
-    id,
-    selectorString,
     contentSecurityPolicyString,
-    elementsString
+    elementsString,
+    id,
+    selectorString
   } = webView;
   const textId = id$1();
   const textSelector = selector();
   const textContentSecurityPolicy = contentSecurityPolicy();
   const textElements = elements();
   return [{
-    type: Div,
+    childCount: 4,
     className: FeatureWebView,
-    childCount: 4
+    type: Div
   }, item, heading, text(textId), pre, text(id), item, heading, text(textSelector), pre, text(selectorString), item, heading, text(textContentSecurityPolicy), pre, text(contentSecurityPolicyString), item, heading, text(textElements), pre, text(elementsString)];
 };
 
 const getFeatureWebViewsVirtualDom = webViews$1 => {
   const heading = webViews();
   return [{
-    type: Div,
+    childCount: 2,
     className: FeatureContent,
-    childCount: 2
+    type: Div
   }, ...getFeatureContentHeadingVirtualDom(heading), {
-    type: Div,
-    childCount: webViews$1.length
+    childCount: webViews$1.length,
+    type: Div
   }, ...webViews$1.flatMap(getWebViewVirtualDom)];
 };
 
@@ -2865,60 +2866,60 @@ const getWebViewsVirtualDom = state => {
 
 const registerAllFeatures = () => {
   register$1({
-    id: Theme,
-    getLabel: theme,
-    isEnabled: featureThemeEnabled,
     getDetails: getThemeDetails,
-    getVirtualDom: getThemeVirtualDom
+    getLabel: theme,
+    getVirtualDom: getThemeVirtualDom,
+    id: Theme,
+    isEnabled: featureThemeEnabled
   });
   register$1({
-    id: Commands,
-    getLabel: commands$1,
-    isEnabled: featureCommandsEnabled,
     getDetails: getCommandsDetails,
-    getVirtualDom: getCommandsVirtualDom
+    getLabel: commands$1,
+    getVirtualDom: getCommandsVirtualDom,
+    id: Commands,
+    isEnabled: featureCommandsEnabled
   });
   register$1({
-    id: Settings,
-    getLabel: settings,
-    isEnabled: featureSettingsEnabled,
     getDetails: getSettingsDetails,
-    getVirtualDom: getSettingsVirtualDom
+    getLabel: settings,
+    getVirtualDom: getSettingsVirtualDom,
+    id: Settings,
+    isEnabled: featureSettingsEnabled
   });
   register$1({
-    id: JsonValidation,
-    getLabel: jsonValidation,
-    isEnabled: featureJsonValidationEnabled,
     getDetails: getJsonValidationDetails,
-    getVirtualDom: getJsonValidationVirtualDom
+    getLabel: jsonValidation,
+    getVirtualDom: getJsonValidationVirtualDom,
+    id: JsonValidation,
+    isEnabled: featureJsonValidationEnabled
   });
   register$1({
-    id: ProgrammingLanguages,
-    getLabel: programmingLanguages,
-    isEnabled: featureProgrammingLanguagesEnabled,
     getDetails: getFeatureDetailsProgrammingLanguages,
-    getVirtualDom: getProgrammingLanguagesVirtualDom
+    getLabel: programmingLanguages,
+    getVirtualDom: getProgrammingLanguagesVirtualDom,
+    id: ProgrammingLanguages,
+    isEnabled: featureProgrammingLanguagesEnabled
   });
   register$1({
-    id: WebViews,
-    getLabel: webViews,
-    isEnabled: featureWebViewsEnabled,
     getDetails: getWebViewsDetails,
-    getVirtualDom: getWebViewsVirtualDom
+    getLabel: webViews,
+    getVirtualDom: getWebViewsVirtualDom,
+    id: WebViews,
+    isEnabled: featureWebViewsEnabled
   });
   register$1({
-    id: ActivationEvents,
-    getLabel: activationEvents,
-    isEnabled: featureActivationEventsEnabled,
     getDetails: getActivationEventsDetails,
-    getVirtualDom: getActivationEventsVirtualDom
+    getLabel: activationEvents,
+    getVirtualDom: getActivationEventsVirtualDom,
+    id: ActivationEvents,
+    isEnabled: featureActivationEventsEnabled
   });
   register$1({
-    id: RuntimeStatus,
-    getLabel: runtimeStatus,
-    isEnabled: featureRuntimeStatusEnabled,
     getDetails: getRuntimeStatusDetails,
-    getVirtualDom: getRuntimeStatusVirtualDom
+    getLabel: runtimeStatus,
+    getVirtualDom: getRuntimeStatusVirtualDom,
+    id: RuntimeStatus,
+    isEnabled: featureRuntimeStatusEnabled
   });
 };
 
@@ -2955,10 +2956,11 @@ const create$1 = () => {
     wrapCommand(fn) {
       const wrapped = async (uid, ...args) => {
         const {
+          oldState,
           newState
         } = states[uid];
         const newerState = await fn(newState, ...args);
-        if (newState === newerState) {
+        if (oldState === newerState || newState === newerState) {
           return;
         }
         const latest = states[uid];
@@ -3016,10 +3018,11 @@ const writeText = async text => {
 /* eslint-disable unicorn/prefer-export-from */
 
 const {
-  set: set$1,
   exists,
+  invoke,
   readFile: readFile$1,
-  invoke} = FileSystemWorker;
+  set: set$1
+} = FileSystemWorker;
 const readFileAsBlob = async uri => {
   // TODO maybe readAsObjectUrl?
   // @ts-ignore
@@ -3059,13 +3062,13 @@ const copyReadmeLink = async (state, href) => {
 };
 
 const {
+  dispose: dispose$1,
   get,
+  getCommandIds,
+  registerCommands,
   set,
-  dispose: dispose$1,
   wrapCommand,
-  wrapGetter,
-  getCommandIds,
-  registerCommands
+  wrapGetter
 } = create$1();
 
 const create = (uid, uri, x, y, width, height, platform, assetDir) => {
@@ -3120,6 +3123,7 @@ const create = (uid, uri, x, y, width, height, platform, assetDir) => {
     settingsButtonEnabled: false,
     showAdditionalDetailsBreakpoint: 700,
     showSideBar: true,
+    showSizeLink: false,
     sideBarWidth: 0,
     sizeOnDisk: 0,
     sizeValue: 0,
@@ -3130,8 +3134,7 @@ const create = (uid, uri, x, y, width, height, platform, assetDir) => {
     uri,
     wasActivatedByEvent: '',
     webViews: [],
-    width,
-    showSizeLink: false
+    width
   };
   set(uid, state, state);
 };
@@ -3165,8 +3168,8 @@ const numbers = [RenderItems, RenderFocus, RenderScrollTop, RenderCss];
 
 const diff2 = uid => {
   const {
-    oldState,
-    newState
+    newState,
+    oldState
   } = get(uid);
   const diffResult = [];
   for (let i = 0; i < modules.length; i++) {
@@ -3191,17 +3194,17 @@ const executeCopy = async state => {
 
 const getMenuEntriesImage = (state, props) => {
   return [{
-    id: 'copyImage',
-    label: copyImage$1(),
-    flags: None$2,
+    args: [],
     command: 'ExtensionDetail.copyImage',
-    args: []
-  }, {
-    id: 'copyImage',
-    label: copyImageUrl$1(),
     flags: None$2,
+    id: 'copyImage',
+    label: copyImage$1()
+  }, {
+    args: [],
     command: 'ExtensionDetail.copyImageUrl',
-    args: []
+    flags: None$2,
+    id: 'copyImage',
+    label: copyImageUrl$1()
   }];
 };
 
@@ -3210,21 +3213,21 @@ const getMenuEntries2 = (state, props) => {
     return getMenuEntriesImage();
   }
   return [{
-    id: 'copy',
-    label: copy$1(),
-    flags: None$2,
+    args: [],
     command: 'ExtensionDetail.executeCopy',
-    args: []
+    flags: None$2,
+    id: 'copy',
+    label: copy$1()
   }];
 };
 
 const None = 0;
 
 const getCopyMenuEntry = () => ({
-  id: 'copy',
-  label: copy$1(),
+  command: 'ClipBoard.execCopy',
   flags: None,
-  command: 'ClipBoard.execCopy'
+  id: 'copy',
+  label: copy$1()
 });
 
 const getImageMenuEntries = props => {
@@ -3232,17 +3235,17 @@ const getImageMenuEntries = props => {
     return [];
   }
   return [{
-    id: 'openImageInNewTab',
-    label: openImageInNewTab$1(),
-    flags: None,
+    args: [props.url || ''],
     command: 'Open.openUrl',
-    args: [props.url || '']
-  }, {
-    id: 'saveImageAs',
-    label: saveImageAs(),
     flags: None,
+    id: 'openImageInNewTab',
+    label: openImageInNewTab$1()
+  }, {
+    args: ['image.png', props.url || ''],
     command: 'SaveFileAs.saveFileAs',
-    args: ['image.png', props.url || '']
+    flags: None,
+    id: 'saveImageAs',
+    label: saveImageAs()
   }];
 };
 
@@ -3251,11 +3254,11 @@ const getLinkMenuEntries = props => {
     return [];
   }
   return [{
-    id: 'openInNewTab',
-    label: openInNewTab(),
-    flags: None,
+    args: [props.url || ''],
     command: 'Open.openUrl',
-    args: [props.url || '']
+    flags: None,
+    id: 'openInNewTab',
+    label: openInNewTab()
   }];
 };
 
@@ -3267,39 +3270,39 @@ const getMenuIds = () => {
 };
 
 const getMenuEntriesReadme = () => [{
-  id: 'copy',
-  label: copy$1(),
-  flags: None$2,
+  args: [],
   command: 'ExtensionDetail.copyReadmeText',
-  args: []
+  flags: None$2,
+  id: 'copy',
+  label: copy$1()
 }];
 
 const ExtensionDetailIconContextMenu$1 = 4091;
 const getMenus = () => {
   return [{
-    id: ExtensionDetailReadme,
-    entries: getMenuEntriesReadme()
+    entries: getMenuEntriesReadme(),
+    id: ExtensionDetailReadme
   }, {
-    id: ExtensionDetailIconContextMenu$1,
     entries: [{
-      id: 'openImageInNewTab',
-      label: openImageInNewTab$1(),
-      flags: None,
+      args: [],
       command: 'ExtensionDetail.openImageInNewTab',
-      args: []
-    }, {
-      id: 'copyImage',
-      label: copyImage$1(),
       flags: None,
-      command: 'ExtensionDetail.copyImage',
-      args: []
+      id: 'openImageInNewTab',
+      label: openImageInNewTab$1()
     }, {
-      id: 'copyImageUrl',
-      label: copyImageUrl$1(),
+      args: [],
+      command: 'ExtensionDetail.copyImage',
       flags: None,
+      id: 'copyImage',
+      label: copyImage$1()
+    }, {
+      args: [],
       command: 'ExtensionDetail.copyImageUrl',
-      args: []
-    }]
+      flags: None,
+      id: 'copyImageUrl',
+      label: copyImageUrl$1()
+    }],
+    id: ExtensionDetailIconContextMenu$1
   }];
 };
 
@@ -3364,25 +3367,25 @@ const getExtension = async (id, platform) => {
 
 const getExtensionDetailButtons = (hasColorTheme, isBuiltin, isDisabled) => {
   const allActions = [{
-    label: setColorTheme$2(),
-    onClick: HandleClickSetColorTheme,
     enabled: hasColorTheme,
-    name: SetColorTheme
+    label: setColorTheme$2(),
+    name: SetColorTheme,
+    onClick: HandleClickSetColorTheme
   }, {
-    label: enable(),
-    onClick: HandleClickEnable,
     enabled: isDisabled,
-    name: Enable
+    label: enable(),
+    name: Enable,
+    onClick: HandleClickEnable
   }, {
-    label: disable(),
-    onClick: HandleClickDisable,
     enabled: !isDisabled,
-    name: Disable
+    label: disable(),
+    name: Disable,
+    onClick: HandleClickDisable
   }, {
-    label: uninstall(),
-    onClick: HandleClickUninstall,
     enabled: !isBuiltin,
-    name: Uninstall
+    label: uninstall(),
+    name: Uninstall,
+    onClick: HandleClickUninstall
   }];
   const filteredButtons = allActions.filter(button => button.enabled);
   return filteredButtons;
@@ -3391,8 +3394,8 @@ const getExtensionDetailButtons = (hasColorTheme, isBuiltin, isDisabled) => {
 const updateExtensionStatus = async (state, updateFunction) => {
   const {
     extensionId,
-    platform,
-    hasColorTheme
+    hasColorTheme,
+    platform
   } = state;
   const error = await updateFunction(extensionId);
   if (error) {
@@ -3403,8 +3406,8 @@ const updateExtensionStatus = async (state, updateFunction) => {
   const buttons = getExtensionDetailButtons(hasColorTheme, false, disabled);
   return {
     ...state,
-    disabled: extension?.disabled,
-    buttons
+    buttons,
+    disabled: extension?.disabled
   };
 };
 
@@ -3425,9 +3428,9 @@ const selectFeature = async (state, name) => {
     return state;
   }
   const {
-    features,
-    extension,
     baseUrl,
+    extension,
+    features,
     locationProtocol
   } = state;
   const newFeatures = features.map(feature => {
@@ -3447,8 +3450,8 @@ const selectFeature = async (state, name) => {
   return {
     ...state,
     ...partialNewState,
-    selectedFeature: name,
-    features: newFeatures
+    features: newFeatures,
+    selectedFeature: name
   };
 };
 
@@ -3536,8 +3539,8 @@ const extensionTheme = assetDir => {
 
 const handleIconError = state => {
   const {
-    iconSrc,
-    assetDir
+    assetDir,
+    iconSrc
   } = state;
   if (iconSrc === extensionDefaultIcon(assetDir)) {
     return state;
@@ -3585,9 +3588,9 @@ const handleReadmeContextMenu = async (state, x, y, nodeName, href) => {
   } = state;
   // TODO maybe also pass other args
   await show2(uid, ExtensionDetailReadme, x, y, {
+    href,
     menuId: ExtensionDetailReadme,
-    nodeName,
-    href
+    nodeName
   });
   // TODO
   return state;
@@ -3643,10 +3646,10 @@ const loadChangelogContent = async path => {
 
 const selectTabChangelog = async state => {
   const {
-    extension,
     baseUrl,
-    tabs,
-    locationProtocol
+    extension,
+    locationProtocol,
+    tabs
   } = state;
   const changelogContent = await loadChangelogContent(extension.path); // TODO use uri
   const changelogMarkdownHtml = await renderMarkdown(changelogContent, {
@@ -3662,8 +3665,8 @@ const selectTabChangelog = async state => {
   });
   return {
     ...state,
-    selectedTab: Changelog,
     changelogVirtualDom: changelogDom,
+    selectedTab: Changelog,
     tabs: newTabs
   };
 };
@@ -3690,9 +3693,9 @@ const loadReadmeContent = async readmeUrl => {
 const selectTabDetails = async state => {
   const {
     baseUrl,
+    locationProtocol,
     readmeUrl,
-    tabs,
-    locationProtocol
+    tabs
   } = state;
   const readmeContent = await loadReadmeContent(readmeUrl);
   const readmeHtml = await renderMarkdown(readmeContent, {
@@ -3709,20 +3712,20 @@ const selectTabDetails = async state => {
   });
   return {
     ...state,
-    selectedTab: Details,
     detailsVirtualDom: detailsDom,
+    selectedTab: Details,
     tabs: newTabs
   };
 };
 
 const selectTabFeatures = async state => {
   const {
-    extension,
     baseUrl,
-    selectedFeature,
+    extension,
     features,
-    tabs,
-    locationProtocol
+    locationProtocol,
+    selectedFeature,
+    tabs
   } = state;
   if (features.length === 0) {
     return state;
@@ -3738,8 +3741,8 @@ const selectTabFeatures = async state => {
   });
   return {
     ...state,
-    selectedTab: Features,
     selectedFeature: features[0].id || '',
+    selectedTab: Features,
     tabs: newTabs,
     ...partialNewState
   };
@@ -3747,12 +3750,12 @@ const selectTabFeatures = async state => {
 
 const getSelectTabHandler = name => {
   switch (name) {
+    case Changelog:
+      return selectTabChangelog;
     case Details:
       return selectTabDetails;
     case Features:
       return selectTabFeatures;
-    case Changelog:
-      return selectTabChangelog;
     default:
       return selectTabDefault;
   }
@@ -3773,27 +3776,26 @@ const getSizeEntries = (showSizeLink, displaySize, extensionUri) => {
   }
   return [{
     key: size(),
-    value: displaySize,
     onClick: HandleClickSize,
-    title: extensionUri
+    title: extensionUri,
+    value: displaySize
   }];
 };
 
 const getInstallationEntries = (displaySize, extensionId, extensionVersion, extensionUri, showSizeLink) => {
   const entries = [{
+    code: true,
     key: identifier(),
-    value: extensionId,
     odd: true,
-    code: true
+    value: extensionId
   }, {
+    code: true,
     key: version(),
-    value: extensionVersion,
-    code: true
+    value: extensionVersion
   }, {
     key: lastUpdated(),
-    value: 'n/a',
-    // TODO get this from somewhere
-    odd: true
+    odd: true,
+    value: 'n/a' // TODO get this from somewhere
   }, ...getSizeEntries(showSizeLink, displaySize, extensionUri)];
   return entries;
 };
@@ -3802,8 +3804,8 @@ const hideSizeLink = state => {
   const {
     displaySize,
     extensionId,
-    extensionVersion,
-    extensionUri
+    extensionUri,
+    extensionVersion
   } = state;
   const newShowSizeLink = false;
   const installationEntries = getInstallationEntries(displaySize, extensionId, extensionVersion, extensionUri, newShowSizeLink);
@@ -3904,8 +3906,8 @@ const getRemoteSrc = uri => {
 
 const getBaseUrl = (extensionPath, platform) => {
   switch (platform) {
-    case Remote:
     case Electron:
+    case Remote:
       return getRemoteSrc(extensionPath + '/');
     default:
       return extensionPath;
@@ -3951,20 +3953,20 @@ const getSideBarWidth = width => {
 
 const getTabs = (selectedTab, hasReadme, hasFeatures, hasChangelog) => {
   const tabs = [{
+    enabled: hasReadme,
     label: details(),
     name: Details,
-    selected: selectedTab === Details,
-    enabled: hasReadme
+    selected: selectedTab === Details
   }, {
+    enabled: hasFeatures,
     label: features$1(),
     name: Features,
-    selected: selectedTab === Features,
-    enabled: hasFeatures
+    selected: selectedTab === Features
   }, {
+    enabled: hasChangelog,
     label: changelog(),
     name: Changelog,
-    selected: selectedTab === Changelog,
-    enabled: hasChangelog
+    selected: selectedTab === Changelog
   }];
   return tabs;
 };
@@ -4271,8 +4273,8 @@ const getMarketplaceEntries = isBuiltin => {
   }
   return [{
     key: published(),
-    value: 'n/a',
-    odd: true
+    odd: true,
+    value: 'n/a'
   }, {
     key: lastReleased(),
     value: 'n/a'
@@ -4314,21 +4316,21 @@ const getResources = (isBuiltin, extension) => {
   const licenseLink = getLicenseLink();
   // TODO
   return [{
+    icon: 'LinkExternal',
     label: marketplace(),
-    url: '#',
-    icon: 'LinkExternal'
+    url: '#'
   }, {
+    icon: 'LinkExternal',
     label: issues(),
-    url: '#',
-    icon: 'LinkExternal'
+    url: '#'
   }, {
+    icon: 'Repo',
     label: repository(),
-    url: repositoryLink,
-    icon: 'Repo'
+    url: repositoryLink
   }, {
+    icon: 'LinkExternal',
     label: license(),
-    url: licenseLink,
-    icon: 'LinkExternal'
+    url: licenseLink
   }];
 };
 
@@ -4383,10 +4385,10 @@ const restoreState = savedState => {
   const readmeScrollTop = getSavedReadmeScrollTop(savedState);
   const changelogScrollTop = getSavedChangelogScrollTop(savedState);
   return {
-    selectedFeature,
-    selectedTab,
+    changelogScrollTop,
     readmeScrollTop,
-    changelogScrollTop
+    selectedFeature,
+    selectedTab
   };
 };
 
@@ -4395,8 +4397,8 @@ const loadContent = async (state, platform, savedState, isTest = false) => {
     savedState = undefined;
   }
   const {
-    width,
-    uri
+    uri,
+    width
   } = state;
   const id = getExtensionIdFromUri(uri);
   const extension = await getExtension(id, platform);
@@ -4435,10 +4437,10 @@ const loadContent = async (state, platform, savedState, isTest = false) => {
   const buttons = getExtensionDetailButtons(hasColorTheme, isBuiltin, disabled);
   const size = getViewletSize(width);
   const {
-    selectedFeature,
-    selectedTab,
+    changelogScrollTop,
     readmeScrollTop,
-    changelogScrollTop
+    selectedFeature,
+    selectedTab
   } = restoreState(savedState);
   const features = getFeatures(selectedFeature || Theme, extension);
   const hasFeatures = features.length > 0;
@@ -4447,12 +4449,12 @@ const loadContent = async (state, platform, savedState, isTest = false) => {
   const sizeValue = getViewletSize(width || 0);
   const showSizeLink = platform !== Web$1;
   const {
+    categories,
+    displaySize,
+    folderSize,
     installationEntries,
     marketplaceEntries,
-    displaySize,
-    categories,
-    resources,
-    folderSize
+    resources
   } = await loadSideBarContent(extensionId, extensionVersion, extensionUri, isBuiltin, extension, showSizeLink);
   const padding = getPadding(width);
   const sideBarWidth = getSideBarWidth(width);
@@ -4525,16 +4527,16 @@ const createCss = object => {
 
 const renderCss = (oldState, newState) => {
   const {
-    uid,
     paddingLeft,
     paddingRight,
-    sideBarWidth
+    sideBarWidth,
+    uid
   } = newState;
   const css = createCss({
+    ExtensionDetailMaxWidth: 1250,
     ExtensionDetailPaddingLeft: paddingLeft,
     ExtensionDetailPaddingRight: paddingRight,
-    ExtensionDetailSideBarWidth: sideBarWidth,
-    ExtensionDetailMaxWidth: 1250
+    ExtensionDetailSideBarWidth: sideBarWidth
   });
   return ['Viewlet.setCss', uid, css];
 };
@@ -4543,21 +4545,21 @@ const getChangelogVirtualDom = changelogDom => {
   // const notImplemented = ExtensionDetailStrings.notImplemented()
   // TODO set tabpanel role
   return [{
-    type: Div,
+    childCount: 1,
     className: Changelog$1,
-    childCount: 1
+    type: Div
   }, ...changelogDom];
 };
 
 const getAdditionalDetailsEntryVirtualDom = (heading, items, renderer) => {
   return [{
-    type: Div,
+    childCount: 2,
     className: AdditionalDetailsEntry,
-    childCount: 2
+    type: Div
   }, {
-    type: Div,
+    childCount: 1,
     className: AdditionalDetailsTitle,
-    childCount: 1
+    type: Div
   }, text(heading), ...renderer(items)];
 };
 
@@ -4567,26 +4569,26 @@ const getCategoryVirtualDom = category => {
     label
   } = category;
   return [{
-    type: Button$1,
-    className: Category,
     childCount: 1,
+    className: Category,
+    name: id,
     onClick: HandleClickCategory,
-    name: id
+    type: Button$1
   }, text(label)];
 };
 
 const getCategoriesDom = categories => {
   return [{
-    type: Div,
+    childCount: categories.length,
     className: Categories,
-    childCount: categories.length
+    type: Div
   }, ...categories.flatMap(getCategoryVirtualDom)];
 };
 
 const parentNode = {
-  type: Dt,
+  childCount: 1,
   className: MoreInfoEntryKey,
-  childCount: 1
+  type: Dt
 };
 const getMoreInfoEntryKeyVirtualDom = item => {
   const {
@@ -4629,32 +4631,32 @@ const getExtraProps = (title, onClick) => {
 };
 const getMoreInfoEntryValueVirtualDom = item => {
   const {
-    value,
-    onClick,
     code,
-    title
+    onClick,
+    title,
+    value
   } = item;
   const type = getMoreInfoEntryValueTag(onClick, code);
   const className = getMoreInfoEntryValueClassName(onClick, code);
   const extraProps = getExtraProps(title, onClick);
   return [{
-    type,
-    className,
     childCount: 1,
+    className,
     onClick,
+    type,
     ...extraProps
   }, text(value)];
 };
 
 const parentNodeEven = {
-  type: Div,
+  childCount: 2,
   className: MoreInfoEntry,
-  childCount: 2
+  type: Div
 };
 const parentNodeOdd = {
-  type: Div,
+  childCount: 2,
   className: mergeClassNames(MoreInfoEntry, MoreInfoEntryOdd),
-  childCount: 2
+  type: Div
 };
 const getMoreInfoEntryVirtualDom = item => {
   const {
@@ -4666,9 +4668,9 @@ const getMoreInfoEntryVirtualDom = item => {
 
 const getMoreInfoVirtualDom = items => {
   return [{
-    type: Dl,
+    childCount: items.length,
     className: MoreInfo,
-    childCount: items.length
+    type: Dl
   }, ...items.flatMap(getMoreInfoEntryVirtualDom)];
 };
 
@@ -4677,38 +4679,38 @@ const getIconDom = icon => {
     return [];
   }
   return [{
-    type: Div,
+    childCount: 1,
     className: ResourceIcon,
-    childCount: 1
+    type: Div
   }, {
-    type: Div,
+    childCount: 0,
     className: mergeClassNames(MaskIcon, `MaskIcon${icon}`),
-    childCount: 0
+    type: Div
   }];
 };
 const getResourceLinkVirtualDom = resource => {
   const {
+    icon,
     label,
-    url,
-    icon
+    url
   } = resource;
   const iconDom = getIconDom(icon);
   const iconDomCount = iconDom.length > 0 ? 1 : 0;
   return [{
-    type: A,
-    className: Resource,
     childCount: 1 + iconDomCount,
-    target: '_blank',
+    className: Resource,
+    href: url,
     rel: 'noopener noreferrer',
-    href: url
+    target: '_blank',
+    type: A
   }, ...iconDom, text(label)];
 };
 
 const resourceNode = {
-  // TODO use link with url
-  type: Div,
+  childCount: 1,
   className: Resource,
-  childCount: 1
+  // TODO use link with url
+  type: Div
 };
 const getResourceVirtualDom = resource => {
   const {
@@ -4723,9 +4725,9 @@ const getResourceVirtualDom = resource => {
 
 const getResourcesVirtualDom = resources => {
   return [{
-    type: Div,
+    childCount: resources.length,
     className: Resources,
-    childCount: resources.length
+    type: Div
   }, ...resources.flatMap(getResourceVirtualDom)];
 };
 
@@ -4734,23 +4736,23 @@ const getAdditionalDetailsVirtualDom = (showAdditionalDetails, firstHeading, ent
     return [];
   }
   return [{
-    type: Aside$1,
+    childCount: 1,
     className: Aside,
-    childCount: 1
+    type: Aside$1
   }, {
-    type: Div,
+    childCount: 4,
     className: AdditionalDetails,
+    onClick: HandleAdditionalDetailContextMenu,
     tabIndex: 0,
-    childCount: 4,
-    onClick: HandleAdditionalDetailContextMenu
+    type: Div
   }, ...getAdditionalDetailsEntryVirtualDom(firstHeading, entries, getMoreInfoVirtualDom), ...getAdditionalDetailsEntryVirtualDom(secondHeading, secondEntries, getMoreInfoVirtualDom), ...getAdditionalDetailsEntryVirtualDom(thirdHeading, categories, getCategoriesDom), ...getAdditionalDetailsEntryVirtualDom(fourthHeading, resources, getResourcesVirtualDom)];
 };
 
 const getNoReadmeVirtualDom = () => {
   return [{
-    type: Div,
     childCount: 1,
-    className: Markdown
+    className: Markdown,
+    type: Div
   }, text(noReadmeFound())];
 };
 
@@ -4770,53 +4772,53 @@ const getDetailsVirtualDom = (sanitizedReadmeHtml, width, scrollToTopButtonEnabl
   const childCount = getChildCount(showAdditionalDetails);
   const contentDom = hasReadme ? sanitizedReadmeHtml : getNoReadmeVirtualDom();
   const dom = [{
-    type: Div,
-    className: ExtensionDetailPanel,
     childCount: childCount,
-    role: Panel
+    className: ExtensionDetailPanel,
+    role: Panel,
+    type: Div
   }, ...contentDom, ...getAdditionalDetailsVirtualDom(showAdditionalDetails, firstHeading, installationEntries, secondHeading, marketplaceEntries, thirdHeading, categories$1, fourthHeading, resources$1)];
   return dom;
 };
 
 const getFeatureListItemVirtualDom = feature => {
   const {
+    id,
     label,
-    selected,
-    id
+    selected
   } = feature;
   const className = selected ? 'Feature FeatureSelected' : Feature;
   return [{
-    // TODO use role list item or tab
-    type: Button$1,
-    name: id,
+    childCount: 1,
     className,
-    childCount: 1
+    name: id,
+    // TODO use role list item or tab
+    type: Button$1
   }, text(label)];
 };
 
 const getFeatureListVirtualDom = features => {
   return [{
-    // TODO use either list or tabs role
-    type: Div,
-    className: FeaturesList,
     childCount: features.length,
-    onClick: HandleFeaturesClick
+    className: FeaturesList,
+    onClick: HandleFeaturesClick,
+    // TODO use either list or tabs role
+    type: Div
   }, ...features.flatMap(getFeatureListItemVirtualDom)];
 };
 
 const getFeaturesEmptyVirtualDom = () => {
   const none$1 = none();
   return [{
-    type: Div,
+    childCount: 1,
     className: Features$1,
-    childCount: 1
+    type: Div
   }, text(none$1)];
 };
 
 const sash = {
-  type: Div,
+  childCount: 0,
   className: mergeClassNames(Sash, SashVertical),
-  childCount: 0
+  type: Div
 };
 const getFeaturesVirtualDom = (features, selectedFeature, state) => {
   if (features.length === 0) {
@@ -4825,20 +4827,20 @@ const getFeaturesVirtualDom = (features, selectedFeature, state) => {
   const fn = getFeatureVirtualDomHandler(selectedFeature);
   const featureVirtualDom = fn(state);
   return [{
-    type: Div,
+    childCount: 3,
     className: Features$1,
-    childCount: 3
+    type: Div
   }, ...getFeatureListVirtualDom(features), sash, ...featureVirtualDom];
 };
 
 const getExtensionDetailContentVirtualDom = (sanitizedReadmeHtml, selectedTab, width, scrollToTopButtonEnabled, categories, resources, breakpoint, changelogDom, state) => {
   switch (selectedTab) {
+    case Changelog:
+      return getChangelogVirtualDom(changelogDom);
     case Details:
       return getDetailsVirtualDom(sanitizedReadmeHtml, width, scrollToTopButtonEnabled, categories, resources, breakpoint, state.installationEntries, state.marketplaceEntries, state.hasReadme, state.showSideBar);
     case Features:
       return getFeaturesVirtualDom(state.features, state.selectedFeature, state);
-    case Changelog:
-      return getChangelogVirtualDom(changelogDom);
     default:
       return [];
   }
@@ -4846,19 +4848,19 @@ const getExtensionDetailContentVirtualDom = (sanitizedReadmeHtml, selectedTab, w
 
 const getExtensionDetailDescriptionVirtualDom = description => {
   return [{
-    type: Div,
+    childCount: 1,
     className: ExtensionDetailDescription,
-    childCount: 1
+    type: Div
   }, text(description)];
 };
 
 const getButtonVirtualDom = (message, onClick, name) => {
   return [{
-    type: Button$1,
+    childCount: 1,
     className: mergeClassNames(Button, ButtonPrimary),
-    onClick,
     name,
-    childCount: 1
+    onClick,
+    type: Button$1
   }, text(message)];
 };
 
@@ -4867,17 +4869,17 @@ const getSettingsButtonVirtualDom = enabled => {
     return [];
   }
   return [{
-    type: Button$1,
+    childCount: 1,
     className: SettingsButton,
+    name: Settings,
     onClick: HandleClickSettings,
-    childCount: 1,
     title: 'Settings',
-    name: Settings
+    type: Button$1
   }, {
-    type: Span,
-    className: SettingsIcon,
     childCount: 0,
-    text: '⚙️'
+    className: SettingsIcon,
+    text: '⚙️',
+    type: Span
   }];
 };
 
@@ -4886,22 +4888,22 @@ const getExtensionDetailHeaderActionsVirtualDom = (buttonDefs, settingsButtonEna
   const buttons = enabledButtons.flatMap(btn => getButtonVirtualDom(btn.label, btn.onClick, btn.name));
   const settingsButton = getSettingsButtonVirtualDom(settingsButtonEnabled);
   const dom = [{
-    type: Div,
+    childCount: enabledButtons.length + settingsButton.length,
     className: ExtensionDetailHeaderActions,
-    childCount: enabledButtons.length + settingsButton.length
+    type: Div
   }, ...buttons, ...settingsButton];
   return dom;
 };
 
 const getExtensionDetailIconVirtualDom = iconSrc => {
   return {
-    type: Img,
-    className: ExtensionDetailIcon,
     alt: '',
     childCount: 0,
+    className: ExtensionDetailIcon,
     draggable: false,
     onContextMenu: HandleImageContextMenu,
-    src: iconSrc
+    src: iconSrc,
+    type: Img
   };
 };
 
@@ -4910,29 +4912,29 @@ const getNameBadgeVirtualDom = badge => {
     return [];
   }
   return [{
-    type: Span,
+    childCount: 1,
     className: ExtensionDetailNameBadge,
-    childCount: 1
+    type: Span
   }, text(badge)];
 };
 
 const getExtensionDetailNameVirtualDom = (name, badge) => {
   return [{
-    type: Div,
+    childCount: badge ? 2 : 1,
     className: ExtensionDetailName,
-    childCount: badge ? 2 : 1
+    type: Div
   }, text(name), ...getNameBadgeVirtualDom(badge)];
 };
 
 const getExtensionDetailHeaderVirtualDom = (name, iconSrc, description, badge, buttonDefs, settingsButtonEnabled) => {
   const dom = [{
-    type: Div,
+    childCount: 2,
     className: ExtensionDetailHeader,
-    childCount: 2
+    type: Div
   }, getExtensionDetailIconVirtualDom(iconSrc), {
-    type: Div,
+    childCount: 3,
     className: ExtensionDetailHeaderDetails,
-    childCount: 3
+    type: Div
   }, ...getExtensionDetailNameVirtualDom(name, badge), ...getExtensionDetailDescriptionVirtualDom(description), ...getExtensionDetailHeaderActionsVirtualDom(buttonDefs, settingsButtonEnabled)];
   return dom;
 };
@@ -4946,41 +4948,41 @@ const getTabClassName = isSelected => {
 const getTabVirtualDom = tab => {
   const {
     label,
-    selected,
-    name
+    name,
+    selected
   } = tab;
   const className = getTabClassName(selected);
   const ariaSelected = selected;
   return [{
-    type: Button$1,
-    role: Tab,
-    name,
-    className,
+    ariaSelected,
     childCount: 1,
+    className,
+    name,
+    role: Tab,
     tabIndex: -1,
-    ariaSelected
+    type: Button$1
   }, text(label)];
 };
 
 const getTabsVirtualDom = tabs => {
   return [{
-    type: Div,
-    className: ExtensionDetailTabs,
     childCount: tabs.length,
-    role: TabList,
+    className: ExtensionDetailTabs,
     onClick: HandleTabsClick,
-    tabIndex: 0
+    role: TabList,
+    tabIndex: 0,
+    type: Div
   }, ...tabs.flatMap(getTabVirtualDom)];
 };
 
 const getClassNames = size => {
   switch (size) {
-    case Small:
-      return Small$1;
-    case Normal:
-      return Normal$1;
     case Large:
       return Large$1;
+    case Normal:
+      return Normal$1;
+    case Small:
+      return Small$1;
     default:
       return '';
   }
@@ -5011,9 +5013,9 @@ const getExtensionDetailVirtualDom = (newState, selectedTab) => {
   const width = newState?.width || 500;
   const sizeClass = getClassNames(sizeValue);
   const dom = [{
-    type: Div,
+    childCount: 3,
     className: mergeClassNames(Viewlet, ExtensionDetail, sizeClass),
-    childCount: 3
+    type: Div
   }, ...getExtensionDetailHeaderVirtualDom(name, iconSrc, description, badge, buttons, settingsButtonEnabled), ...getTabsVirtualDom(tabs), ...getExtensionDetailContentVirtualDom(detailsVirtualDom, selectedTab, width, scrollToTopButtonEnabled, categories, resources, showAdditionalDetailsBreakpoint, changelogVirtualDom, newState)];
   return dom;
 };
@@ -5040,10 +5042,10 @@ const renderScrollTop = (oldState, newState) => {
   const selector = '.ExtensionDetailPanel .Markdown';
   const property = 'scrollTop';
   const {
-    uid,
-    readmeScrollTop,
     changelogScrollTop,
-    selectedTab
+    readmeScrollTop,
+    selectedTab,
+    uid
   } = newState;
   const scrollTop = getScrollTop(selectedTab, readmeScrollTop, changelogScrollTop);
   if (scrollTop === -1) {
@@ -5054,14 +5056,14 @@ const renderScrollTop = (oldState, newState) => {
 
 const getRenderer = diffType => {
   switch (diffType) {
-    case RenderItems:
-      return renderDom;
+    case RenderCss:
+      return renderCss;
     case RenderFocus:
       return renderFocus;
+    case RenderItems:
+      return renderDom;
     case RenderScrollTop:
       return renderScrollTop;
-    case RenderCss:
-      return renderCss;
     default:
       throw new Error('unknown renderer');
   }
@@ -5081,8 +5083,8 @@ const applyRender = (oldState, newState, diffResult) => {
 
 const render2 = (uid, diffResult) => {
   const {
-    oldState,
-    newState
+    newState,
+    oldState
   } = get(uid);
   set(uid, newState, newState);
   const commands = applyRender(oldState, newState, diffResult);
@@ -5154,25 +5156,25 @@ const resize = (state, dimensions) => {
   return {
     ...state,
     ...dimensions,
-    showSideBar,
     paddingLeft: padding,
     paddingRight: padding,
+    showSideBar,
     sideBarWidth
   };
 };
 
 const saveState = state => {
   const {
-    selectedTab,
-    selectedFeature,
+    changelogScrollTop,
     readmeScrollTop,
-    changelogScrollTop
+    selectedFeature,
+    selectedTab
   } = state;
   return {
-    selectedTab,
-    selectedFeature,
+    changelogScrollTop,
     readmeScrollTop,
-    changelogScrollTop
+    selectedFeature,
+    selectedTab
   };
 };