@lvce-editor/extension-detail-view 7.14.1 → 7.15.0

package/dist/extensionDetailViewWorkerMain.js

@@ -325,6 +325,7 @@ const featureActivationEventsEnabled = extension => {
   return Array.isArray(extension.activation);
 };
 
+const Alert = 'alert';
 const None$3 = 'none';
 const Panel = 'panel';
 const Tab = 'tab';
@@ -891,7 +892,7 @@ const getActivationEventVirtualDom = event => {
   if (!isValid) {
     return [{
       childCount: 1,
-      className: 'ListItem ListItemInvalid',
+      className: mergeClassNames('ListItem', 'ListItemInvalid'),
       title: errorMessage,
       type: Li
     }, code, text(stringValue)];
@@ -899,27 +900,32 @@ const getActivationEventVirtualDom = event => {
   return [li, code, text(stringValue)];
 };
 
+const featureContentHeadingNode = {
+  childCount: 1,
+  type: H1
+};
 const getFeatureContentHeadingVirtualDom = heading => {
-  return [{
-    childCount: 1,
-    type: H1
-  }, text(heading)];
+  return [featureContentHeadingNode, text(heading)];
 };
 
+const featureContentNode$7 = {
+  childCount: 2,
+  className: FeatureContent,
+  type: Div
+};
 const getFeatureActivationEventsVirtualDom = activationEvents$1 => {
   const heading = activationEvents();
-  return [{
-    childCount: 2,
-    className: FeatureContent,
-    type: Div
-  }, ...getFeatureContentHeadingVirtualDom(heading), {
+  return [featureContentNode$7, ...getFeatureContentHeadingVirtualDom(heading), {
     childCount: activationEvents$1.length,
     type: Ul
   }, ...activationEvents$1.flatMap(getActivationEventVirtualDom)];
 };
 
 const getActivationEventsVirtualDom = state => {
-  return getFeatureActivationEventsVirtualDom(state.activationEntries);
+  const {
+    activationEntries
+  } = state;
+  return getFeatureActivationEventsVirtualDom(activationEntries);
 };
 
 const Text = 1;
@@ -967,27 +973,35 @@ const getCommandTableEntries = rows => {
   };
 };
 
+const featureContentNode$6 = {
+  childCount: 2,
+  className: FeatureContent,
+  type: Div
+};
+const emptyCommandsNode = {
+  childCount: 1,
+  type: P
+};
 const getFeatureCommandsEmptyVirtualDom = () => {
   const heading = commands$1();
   const emptyCommandsArray$1 = emptyCommandsArray();
-  return [{
-    childCount: 2,
-    className: FeatureContent,
-    type: Div
-  }, ...getFeatureContentHeadingVirtualDom(heading), {
-    childCount: 1,
-    type: P
-  }, text(emptyCommandsArray$1)];
+  return [featureContentNode$6, ...getFeatureContentHeadingVirtualDom(heading), emptyCommandsNode, text(emptyCommandsArray$1)];
 };
 
+const tableHeadingNode = {
+  childCount: 1,
+  className: TableHeading,
+  type: Th
+};
 const getTableHeadingVirtualDom = heading => {
-  return [{
-    childCount: 1,
-    className: TableHeading,
-    type: Th
-  }, text(heading)];
+  return [tableHeadingNode, text(heading)];
 };
 
+const tableCellNode = {
+  childCount: 1,
+  className: TableCell,
+  type: Td
+};
 const getCheckedText = checked => {
   if (checked) {
     return 'yes';
@@ -999,18 +1013,15 @@ const getCellCheckMarkVirtualDom = (value, props) => {
     checked
   } = props;
   const checkedText = getCheckedText(checked);
-  return [{
-    childCount: 1,
-    className: TableCell,
-    type: Td
-  }, text(checkedText)];
+  return [tableCellNode, text(checkedText)];
 };
 
+const codeNode$1 = {
+  childCount: 1,
+  type: Code$2
+};
 const getListItemDom = item => {
-  return [{
-    childCount: 1,
-    type: Code$2
-  }, text(item)];
+  return [codeNode$1, text(item)];
 };
 const getCellCodeListVirtualDom = (value, props) => {
   const {
@@ -1023,8 +1034,12 @@ const getCellCodeListVirtualDom = (value, props) => {
   }, ...listItems.flatMap(getListItemDom)];
 };
 
+const codeNode = {
+  childCount: 1,
+  type: Code$2
+};
 const getCellCodeVirtualDom = (value, props) => {
-  const tdClassName = props?.className ? `${TableCell} ${props.className}` : TableCell;
+  const tdClassName = mergeClassNames(TableCell, props?.className || '');
   return [{
     childCount: 1,
     className: tdClassName,
@@ -1032,10 +1047,7 @@ const getCellCodeVirtualDom = (value, props) => {
     ...(props?.title && {
       title: props.title
     })
-  }, {
-    childCount: 1,
-    type: Code$2
-  }, text(value)];
+  }, codeNode, text(value)];
 };
 
 const getTitleProps = title => {
@@ -1047,7 +1059,7 @@ const getTitleProps = title => {
   return {};
 };
 const getCellLinkVirtualDom = (value, props) => {
-  const tdClassName = props?.className ? `${TableCell} ${props.className}` : TableCell;
+  const tdClassName = mergeClassNames(TableCell, props?.className || '');
   return [{
     childCount: 1,
     className: tdClassName,
@@ -1062,7 +1074,7 @@ const getCellLinkVirtualDom = (value, props) => {
 };
 
 const getCellTextVirtualDom = (value, props) => {
-  const tdClassName = props?.className ? `${TableCell} ${props.className}` : TableCell;
+  const tdClassName = mergeClassNames(TableCell, props?.className || '');
   return [{
     childCount: 1,
     className: tdClassName,
@@ -1107,19 +1119,21 @@ const getTableRowVirtualDom = entries => {
   }, ...entries.flatMap(getCellVirtualDom)];
 };
 
+const tableNode = {
+  childCount: 2,
+  className: Table,
+  type: Table$1
+};
+const tableHeadNode = {
+  childCount: 1,
+  type: THead
+};
 const getTableVirtualDom = tableInfo => {
   const {
     headings,
     rows
   } = tableInfo;
-  return [{
-    childCount: 2,
-    className: Table,
-    type: Table$1
-  }, {
-    childCount: 1,
-    type: THead
-  }, {
+  return [tableNode, tableHeadNode, {
     childCount: headings.length,
     type: Tr
   }, ...headings.flatMap(getTableHeadingVirtualDom), {
@@ -1128,6 +1142,12 @@ const getTableVirtualDom = tableInfo => {
   }, ...rows.flatMap(getTableRowVirtualDom)];
 };
 
+const featureContentNode$5 = {
+  childCount: 2,
+  className: FeatureContent,
+  type: Div
+};
+
 // TODO have typed view-model
 const getFeatureCommandsVirtualDom = commands => {
   if (commands.length === 0) {
@@ -1135,15 +1155,14 @@ const getFeatureCommandsVirtualDom = commands => {
   }
   const heading = commands$1();
   const tableInfo = getCommandTableEntries(commands);
-  return [{
-    childCount: 2,
-    className: FeatureContent,
-    type: Div
-  }, ...getFeatureContentHeadingVirtualDom(heading), ...getTableVirtualDom(tableInfo)];
+  return [featureContentNode$5, ...getFeatureContentHeadingVirtualDom(heading), ...getTableVirtualDom(tableInfo)];
 };
 
 const getCommandsVirtualDom = state => {
-  return getFeatureCommandsVirtualDom(state.commands);
+  const {
+    commands
+  } = state;
+  return getFeatureCommandsVirtualDom(commands);
 };
 
 const existsJson = async schemaUrl => {
@@ -1357,7 +1376,10 @@ const getFeatureJsonValidationVirtualDom = jsonValidation$1 => {
 };
 
 const getJsonValidationVirtualDom = state => {
-  return getFeatureJsonValidationVirtualDom(state.jsonValidation);
+  const {
+    jsonValidation
+  } = state;
+  return getFeatureJsonValidationVirtualDom(jsonValidation);
 };
 
 const getProgrammingLanguageTableEntry = programmingLanguage => {
@@ -1420,18 +1442,20 @@ const getProgrammingLanguagesTableEntries = rows => {
   };
 };
 
+const featureContentNode$4 = {
+  childCount: 2,
+  className: FeatureContent,
+  type: Div
+};
+const emptyProgrammingLanguagesNode = {
+  childCount: 1,
+  type: P
+};
 const getFeatureProgrammingLanguagesVirtualDom = programmingLanguages$1 => {
   const heading = programmingLanguages();
-  const top = [{
-    childCount: 2,
-    className: FeatureContent,
-    type: Div
-  }, ...getFeatureContentHeadingVirtualDom(heading)];
+  const top = [featureContentNode$4, ...getFeatureContentHeadingVirtualDom(heading)];
   if (programmingLanguages$1.length === 0) {
-    return [...top, {
-      childCount: 1,
-      type: P
-    }, text('Empty Array.')];
+    return [...top, emptyProgrammingLanguagesNode, text('Empty Array.')];
   }
   const tableInfo = getProgrammingLanguagesTableEntries(programmingLanguages$1);
   return [...top, ...getTableVirtualDom(tableInfo)];
@@ -1451,17 +1475,20 @@ class FeatureNotFoundError extends Error {
   }
 }
 
+const unsupportedFeatureNode = {
+  childCount: 2,
+  type: Div
+};
+const unsupportedFeatureHeadingNode = {
+  childCount: 1,
+  type: H1
+};
+const unsupportedFeatureMessageNode = {
+  childCount: 1,
+  type: P
+};
 const getFeatureUnsupportedVirtualDom = state => {
-  return [{
-    childCount: 2,
-    type: Div
-  }, {
-    childCount: 1,
-    type: H1
-  }, text(unsupportedFeature()), {
-    childCount: 1,
-    type: P
-  }, text(selectedFeatureUnknownOrUnsupported())];
+  return [unsupportedFeatureNode, unsupportedFeatureHeadingNode, text(unsupportedFeature()), unsupportedFeatureMessageNode, text(selectedFeatureUnknownOrUnsupported())];
 };
 
 const features = Object.create(null);
@@ -2801,7 +2828,6 @@ const getAllPreferences = async () => {
   return invoke$1('Preferences.getAll');
 };
 
-/* eslint-disable unicorn/prefer-export-from */
 const {
   getRuntimeStatus: getRuntimeStatus$1,
   set: set$4
@@ -2840,25 +2866,21 @@ const formatTime = time => {
   return time.toFixed(2) + 'ms';
 };
 
+const definitionTermNode = {
+  childCount: 1,
+  type: Dt
+};
+const definitionDescriptionNode = {
+  childCount: 1,
+  type: Dd
+};
 const getActivationTimeVirtualDom = (importTime$1, activationTime$1) => {
   if (!activationTime$1 && !importTime$1) {
     return [];
   }
   const formattedImportTime = formatTime(importTime$1);
   const formattedTime = formatTime(activationTime$1);
-  return [{
-    childCount: 1,
-    type: Dt
-  }, text(importTime()), {
-    childCount: 1,
-    type: Dd
-  }, text(formattedImportTime), {
-    childCount: 1,
-    type: Dt
-  }, text(activationTime()), {
-    childCount: 1,
-    type: Dd
-  }, text(formattedTime)];
+  return [definitionTermNode, text(importTime()), definitionDescriptionNode, text(formattedImportTime), definitionTermNode, text(activationTime()), definitionDescriptionNode, text(formattedTime)];
 };
 
 const None$1 = 0;
@@ -2900,6 +2922,11 @@ const getStatusVirtualDom = status$1 => {
   return [key, text(`${statusKey}: `), value, text(`${statusValue}`)];
 };
 
+const featureContentNode$3 = {
+  childCount: 2,
+  className: FeatureContent,
+  type: Div
+};
 const getChildCount$1 = (status, activationTime, importTime) => {
   let childCount = 0;
   childCount += 2; // status
@@ -2916,11 +2943,7 @@ const getRuntimeStatusVirtualDom = state => {
   } = state;
   const heading = runtimeStatus();
   const childCount = getChildCount$1(status, displayedActivationTime, displayedImportTime);
-  return [{
-    childCount: 2,
-    className: FeatureContent,
-    type: Div
-  }, ...getFeatureContentHeadingVirtualDom(heading), {
+  return [featureContentNode$3, ...getFeatureContentHeadingVirtualDom(heading), {
     childCount,
     className: 'RuntimeStatusDefinitionList',
     type: Dl
@@ -2966,18 +2989,22 @@ const getSettingsTableEntries = rows => {
   };
 };
 
+const featureContentNode$2 = {
+  childCount: 2,
+  className: FeatureContent,
+  type: Div
+};
 const getFeatureSettingsVirtualDom = rows => {
   const heading = settings();
   const tableInfo = getSettingsTableEntries(rows);
-  return [{
-    childCount: 2,
-    className: FeatureContent,
-    type: Div
-  }, ...getFeatureContentHeadingVirtualDom(heading), ...getTableVirtualDom(tableInfo)];
+  return [featureContentNode$2, ...getFeatureContentHeadingVirtualDom(heading), ...getTableVirtualDom(tableInfo)];
 };
 
 const getSettingsVirtualDom = state => {
-  return getFeatureSettingsVirtualDom(state.settings);
+  const {
+    settings
+  } = state;
+  return getFeatureSettingsVirtualDom(settings);
 };
 
 const HandleClickCategory = 1;
@@ -3054,7 +3081,6 @@ const getScrollToTopVirtualDom = scrollToTopButtonEnabled => {
   }];
 };
 
-/* eslint-disable unicorn/prefer-export-from */
 const {
   getVirtualDom,
   render,
@@ -3271,14 +3297,15 @@ const getVirtualDomChildCount = dom => {
   return stack.length;
 };
 
+const featureContentNode$1 = {
+  childCount: 2,
+  className: FeatureContent,
+  type: Div
+};
 const getFeatureThemesVirtualDom = themesDom => {
   const childCount = getVirtualDomChildCount(themesDom);
   const heading = theme();
-  return [{
-    childCount: 2,
-    className: FeatureContent,
-    type: Div
-  }, ...getFeatureContentHeadingVirtualDom(heading), {
+  return [featureContentNode$1, ...getFeatureContentHeadingVirtualDom(heading), {
     childCount,
     className: DefaultMarkdown,
     type: Div
@@ -3286,7 +3313,10 @@ const getFeatureThemesVirtualDom = themesDom => {
 };
 
 const getThemeVirtualDom = state => {
-  return getFeatureThemesVirtualDom(state.themesMarkdownDom);
+  const {
+    themesMarkdownDom
+  } = state;
+  return getFeatureThemesVirtualDom(themesMarkdownDom);
 };
 
 const toWebView = rawWebView => {
@@ -3338,6 +3368,11 @@ const item = {
   className: DefinitionListItem,
   type: Div
 };
+const featureWebViewNode = {
+  childCount: 4,
+  className: FeatureWebView,
+  type: Div
+};
 const getWebViewVirtualDom = webView => {
   const {
     contentSecurityPolicyString,
@@ -3349,27 +3384,27 @@ const getWebViewVirtualDom = webView => {
   const textSelector = selector();
   const textContentSecurityPolicy = contentSecurityPolicy();
   const textElements = elements();
-  return [{
-    childCount: 4,
-    className: FeatureWebView,
-    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)];
+  return [featureWebViewNode, 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 featureContentNode = {
+  childCount: 2,
+  className: FeatureContent,
+  type: Div
+};
 const getFeatureWebViewsVirtualDom = webViews$1 => {
   const heading = webViews();
-  return [{
-    childCount: 2,
-    className: FeatureContent,
-    type: Div
-  }, ...getFeatureContentHeadingVirtualDom(heading), {
+  return [featureContentNode, ...getFeatureContentHeadingVirtualDom(heading), {
     childCount: webViews$1.length,
     type: Div
   }, ...webViews$1.flatMap(getWebViewVirtualDom)];
 };
 
 const getWebViewsVirtualDom = state => {
-  return getFeatureWebViewsVirtualDom(state.webViews);
+  const {
+    webViews
+  } = state;
+  return getFeatureWebViewsVirtualDom(webViews);
 };
 
 const registerAllFeatures = () => {
@@ -3684,7 +3719,6 @@ const writeText = async text => {
   await writeText$1(text);
 };
 
-/* eslint-disable unicorn/prefer-export-from */
 const {
   exists,
   invoke,
@@ -4196,7 +4230,10 @@ const getExtension$1 = async (id, platform) => {
 const getExtensionNew = async id => {
   try {
     const rpc = get$2(ExtensionManagementWorker);
-    return await rpc.invoke('Extensions.getExtension', id);
+    const extension = await rpc.invoke('Extensions.getExtension', id);
+    if (extension) {
+      return extension;
+    }
   } catch {
     // ignore
   }
@@ -5474,12 +5511,13 @@ const handleImageContextMenu = async (state, eventX, eventY) => {
   return state;
 };
 
+const markdownImageErrorNode = {
+  childCount: 1,
+  className: MarkdownImageError,
+  type: Span
+};
 const getMarkdownImageErrorVirtualDom = () => {
-  return [{
-    childCount: 1,
-    className: MarkdownImageError,
-    type: Span
-  }, text(imageCannotBeLoaded())];
+  return [markdownImageErrorNode, text(imageCannotBeLoaded())];
 };
 
 const isMatchingImageSrc = (nodeSrc, failedSrc) => {
@@ -6182,22 +6220,24 @@ const getChangelogVirtualDom = changelogDom => {
   // TODO set tabpanel role
   return [{
     childCount: 1,
-    className: `${ExtensionDetailPanel} ${Changelog$1}`,
+    className: mergeClassNames(ExtensionDetailPanel, Changelog$1),
     role: Panel,
     type: Div
   }, ...changelogDom];
 };
 
+const additionalDetailsEntryNode = {
+  childCount: 2,
+  className: AdditionalDetailsEntry,
+  type: Div
+};
+const additionalDetailsTitleNode = {
+  childCount: 1,
+  className: AdditionalDetailsTitle,
+  type: Div
+};
 const getAdditionalDetailsEntryVirtualDom = (heading, items, renderer) => {
-  return [{
-    childCount: 2,
-    className: AdditionalDetailsEntry,
-    type: Div
-  }, {
-    childCount: 1,
-    className: AdditionalDetailsTitle,
-    type: Div
-  }, text(heading), ...renderer(items)];
+  return [additionalDetailsEntryNode, additionalDetailsTitleNode, text(heading), ...renderer(items)];
 };
 
 const getCategoryVirtualDom = category => {
@@ -6312,15 +6352,16 @@ const getMoreInfoVirtualDom = items => {
   }, ...items.flatMap(getMoreInfoEntryVirtualDom)];
 };
 
+const resourceIconNode = {
+  childCount: 1,
+  className: ResourceIcon,
+  type: Div
+};
 const getIconDom = icon => {
   if (!icon) {
     return [];
   }
-  return [{
-    childCount: 1,
-    className: ResourceIcon,
-    type: Div
-  }, {
+  return [resourceIconNode, {
     childCount: 0,
     className: mergeClassNames(MaskIcon, `MaskIcon${icon}`),
     type: Div
@@ -6370,31 +6411,35 @@ const getResourcesVirtualDom = resources => {
   }, ...resources.flatMap(getResourceVirtualDom)];
 };
 
+const Focusable = 0;
+
+const asideNode = {
+  childCount: 1,
+  className: Aside,
+  type: Aside$1
+};
 const getAdditionalDetailsVirtualDom = (showAdditionalDetails, firstHeading, entries, secondHeading, secondEntries, thirdHeading, categories, fourthHeading, resources) => {
   if (!showAdditionalDetails) {
     return [];
   }
   const sections = [...getAdditionalDetailsEntryVirtualDom(firstHeading, entries, getMoreInfoVirtualDom), ...(secondEntries.length > 0 ? getAdditionalDetailsEntryVirtualDom(secondHeading, secondEntries, getMoreInfoVirtualDom) : []), ...(categories.length > 0 ? getAdditionalDetailsEntryVirtualDom(thirdHeading, categories, getCategoriesDom) : []), ...getAdditionalDetailsEntryVirtualDom(fourthHeading, resources, getResourcesVirtualDom)];
   const childCount = 1 + (secondEntries.length > 0 ? 1 : 0) + (categories.length > 0 ? 1 : 0) + 1;
-  return [{
-    childCount: 1,
-    className: Aside,
-    type: Aside$1
-  }, {
+  return [asideNode, {
     childCount: childCount,
     className: AdditionalDetails,
     onContextMenu: HandleAdditionalDetailContextMenu,
-    tabIndex: 0,
+    tabIndex: Focusable,
     type: Div
   }, ...sections];
 };
 
+const noReadmeNode = {
+  childCount: 1,
+  className: Markdown,
+  type: Div
+};
 const getNoReadmeVirtualDom = () => {
-  return [{
-    childCount: 1,
-    className: Markdown,
-    type: Div
-  }, text(noReadmeFound())];
+  return [noReadmeNode, text(noReadmeFound())];
 };
 
 const getChildCount = (additionalDetails, scrollToTopEnabled) => {
@@ -6442,18 +6487,20 @@ const getFeatureListVirtualDom = features => {
     childCount: features.length,
     className: FeaturesList,
     onClick: HandleFeaturesClick,
+    role: None$3,
     // TODO use either list or tabs role
     type: Div
   }, ...features.flatMap(getFeatureListItemVirtualDom)];
 };
 
+const featuresNode$1 = {
+  childCount: 1,
+  className: Features$1,
+  type: Div
+};
 const getFeaturesEmptyVirtualDom = () => {
   const none$1 = none();
-  return [{
-    childCount: 1,
-    className: Features$1,
-    type: Div
-  }, text(none$1)];
+  return [featuresNode$1, text(none$1)];
 };
 
 const sash = {
@@ -6461,63 +6508,76 @@ const sash = {
   className: mergeClassNames(Sash, SashVertical),
   type: Div
 };
+const featuresNode = {
+  childCount: 3,
+  className: Features$1,
+  type: Div
+};
 const getFeaturesVirtualDom = (features, selectedFeature, state) => {
   if (features.length === 0) {
     return getFeaturesEmptyVirtualDom();
   }
   const fn = getFeatureVirtualDomHandler(selectedFeature);
   const featureVirtualDom = fn(state);
-  return [{
-    childCount: 3,
-    className: Features$1,
-    type: Div
-  }, ...getFeatureListVirtualDom(features), sash, ...featureVirtualDom];
+  return [featuresNode, ...getFeatureListVirtualDom(features), sash, ...featureVirtualDom];
 };
 
 const getExtensionDetailContentVirtualDom = (sanitizedReadmeHtml, selectedTab, width, scrollToTopButtonEnabled, categories, resources, breakpoint, changelogDom, state) => {
+  const {
+    features,
+    hasReadme,
+    installationEntries,
+    marketplaceEntries,
+    selectedFeature,
+    showSideBar
+  } = 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);
+      return getDetailsVirtualDom(sanitizedReadmeHtml, width, scrollToTopButtonEnabled, categories, resources, breakpoint, installationEntries, marketplaceEntries, hasReadme, showSideBar);
     case Features:
-      return getFeaturesVirtualDom(state.features, state.selectedFeature, state);
+      return getFeaturesVirtualDom(features, selectedFeature, state);
     default:
       return [];
   }
 };
 
+const extensionDetailErrorCardNode = {
+  childCount: 3,
+  className: ExtensionDetailErrorCard,
+  role: Alert,
+  type: Div
+};
+const extensionDetailErrorTitleNode = {
+  childCount: 1,
+  className: ExtensionDetailErrorTitle,
+  type: H1
+};
+const extensionDetailErrorMessageNode = {
+  childCount: 1,
+  className: ExtensionDetailErrorMessage,
+  type: P
+};
 const getExtensionDetailErrorVirtualDom = (title, message) => {
   return [{
     childCount: 1,
     className: mergeClassNames(Viewlet, ExtensionDetail, ExtensionDetailError),
     type: Div
-  }, {
-    childCount: 3,
-    className: ExtensionDetailErrorCard,
-    role: 'alert',
-    type: Div
-  }, {
+  }, extensionDetailErrorCardNode, {
     childCount: 0,
     className: mergeClassNames(MaskIcon, MaskIconWarning, ExtensionDetailErrorIcon),
     type: Div
-  }, {
-    childCount: 1,
-    className: ExtensionDetailErrorTitle,
-    type: H1
-  }, text(title), {
-    childCount: 1,
-    className: ExtensionDetailErrorMessage,
-    type: P
-  }, text(message)];
+  }, extensionDetailErrorTitleNode, text(title), extensionDetailErrorMessageNode, text(message)];
 };
 
+const extensionDetailDescriptionNode = {
+  childCount: 1,
+  className: ExtensionDetailDescription,
+  type: Div
+};
 const getExtensionDetailDescriptionVirtualDom = description => {
-  return [{
-    childCount: 1,
-    className: ExtensionDetailDescription,
-    type: Div
-  }, text(description)];
+  return [extensionDetailDescriptionNode, text(description)];
 };
 
 const className = mergeClassNames(Button, ButtonPrimary);
@@ -6538,23 +6598,25 @@ const getButtonVirtualDom = (message, onClick, name, onMouseEnter, onMouseLeave)
   return [button, text(message)];
 };
 
+const settingsButtonNode = {
+  childCount: 1,
+  className: SettingsButton,
+  name: Settings,
+  onClick: HandleClickSettings,
+  title: 'Settings',
+  type: Button$1
+};
+const settingsIconNode = {
+  childCount: 0,
+  className: SettingsIcon,
+  text: '⚙️',
+  type: Span
+};
 const getSettingsButtonVirtualDom = enabled => {
   if (!enabled) {
     return [];
   }
-  return [{
-    childCount: 1,
-    className: SettingsButton,
-    name: Settings,
-    onClick: HandleClickSettings,
-    title: 'Settings',
-    type: Button$1
-  }, {
-    childCount: 0,
-    className: SettingsIcon,
-    text: '⚙️',
-    type: Span
-  }];
+  return [settingsButtonNode, settingsIconNode];
 };
 
 const getExtensionDetailHeaderActionsVirtualDom = (buttonDefs, settingsButtonEnabled) => {
@@ -6606,33 +6668,37 @@ const getExtensionDetailMetadataVirtualDom = (downloadCount$1, rating$1) => {
   }, ...downloadCountDom, ...ratingDom];
 };
 
+const nameBadgeNode = {
+  childCount: 1,
+  className: ExtensionDetailNameBadge,
+  type: Span
+};
 const getNameBadgeVirtualDom = badge => {
   if (!badge) {
     return [];
   }
-  return [{
-    childCount: 1,
-    className: ExtensionDetailNameBadge,
-    type: Span
-  }, text(badge)];
+  return [nameBadgeNode, text(badge)];
 };
 
+const extensionDetailNameWithBadgeNode = {
+  childCount: 2,
+  className: ExtensionDetailName,
+  type: Div
+};
+const extensionDetailNameTextNode = {
+  childCount: 1,
+  type: Span
+};
+const extensionDetailNameNode = {
+  childCount: 1,
+  className: ExtensionDetailName,
+  type: Div
+};
 const getExtensionDetailNameWithBadgeVirtualDom = (name, badge) => {
-  return [{
-    childCount: 2,
-    className: ExtensionDetailName,
-    type: Div
-  }, {
-    childCount: 1,
-    type: Span
-  }, text(name), ...getNameBadgeVirtualDom(badge)];
+  return [extensionDetailNameWithBadgeNode, extensionDetailNameTextNode, text(name), ...getNameBadgeVirtualDom(badge)];
 };
 const getExtensionDetailNameDefaultVirtualDom = name => {
-  return [{
-    childCount: 1,
-    className: ExtensionDetailName,
-    type: Div
-  }, text(name)];
+  return [extensionDetailNameNode, text(name)];
 };
 const getExtensionDetailNameVirtualDom = (name, badge) => {
   if (badge) {
@@ -6641,13 +6707,14 @@ const getExtensionDetailNameVirtualDom = (name, badge) => {
   return getExtensionDetailNameDefaultVirtualDom(name);
 };
 
+const extensionDetailHeaderNode = {
+  childCount: 2,
+  className: ExtensionDetailHeader,
+  type: Div
+};
 const getExtensionDetailHeaderVirtualDom = (name, iconSrc, description, badge, buttonDefs, settingsButtonEnabled, downloadCount = 'n/a', rating = 'n/a') => {
   const metadataDom = getExtensionDetailMetadataVirtualDom(downloadCount, rating);
-  const dom = [{
-    childCount: 2,
-    className: ExtensionDetailHeader,
-    type: Div
-  }, getExtensionDetailIconVirtualDom(iconSrc), {
+  const dom = [extensionDetailHeaderNode, getExtensionDetailIconVirtualDom(iconSrc), {
     childCount: metadataDom.length > 0 ? 4 : 3,
     className: ExtensionDetailHeaderDetails,
     onContextMenu: HandleHeaderContextMenu,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/extension-detail-view",
-  "version": "7.14.1",
+  "version": "7.15.0",
   "description": "Extension Detail View Worker",
   "repository": {
     "type": "git",