@lvce-editor/extension-detail-view 7.23.2 → 7.24.1

package/dist/extensionDetailViewWorkerMain.js

@@ -1545,11 +1545,13 @@ const register$1 = feature => {
 const getFeatures = (selectedFeature, extension) => {
   const allFeatures = Object.values(features);
   const enabledFeatures = allFeatures.filter(item => item.isEnabled(extension));
+  const hasSelectedFeature = enabledFeatures.some(item => item.id === selectedFeature);
+  const actualSelectedFeature = hasSelectedFeature ? selectedFeature : enabledFeatures[0]?.id;
   const converted = enabledFeatures.map(item => {
     return {
       id: item.id,
       label: item.getLabel(),
-      selected: item.id === selectedFeature
+      selected: item.id === actualSelectedFeature
     };
   });
   return converted;
@@ -3907,6 +3909,49 @@ const {
   wrapGetter
 } = create$1();
 
+const interpolate = (value, inMin, inMax, outMin, outMax) => {
+  const clamped = Math.min(Math.max(value, inMin), inMax);
+  const ratio = (clamped - inMin) / (inMax - inMin);
+  const mapped = outMin + ratio * (outMax - outMin);
+  return Math.round(mapped);
+};
+
+const getPadding = width => {
+  if (width < 600) {
+    return 10;
+  }
+  if (width < 800) {
+    return 10;
+  }
+  if (width < 1200) {
+    return interpolate(width, 800, 1200, 10, 30);
+  }
+  return 30;
+};
+const getSideBarWidth = width => {
+  if (width < 490) {
+    return 0;
+  }
+  if (width < 650) {
+    return Math.max(175 + Math.round(20 * (width / 100)), Math.round(width / 4));
+  }
+  if (width < 800) {
+    return Math.max(175 + Math.round(20 * (width / 100)), Math.round(width / 4));
+  }
+  return Math.max(175 + Math.round(20 * (width / 100)), Math.round(width / 4));
+};
+
+const getResponsiveLayout = width => {
+  const padding = getPadding(width);
+  const sideBarWidth = getSideBarWidth(width);
+  return {
+    paddingLeft: padding,
+    paddingRight: padding,
+    showSideBar: sideBarWidth > 0,
+    sideBarWidth
+  };
+};
+
 const create = (uid, uri, x, y, width, height, platform, assetDir) => {
   const state = {
     activationEntries: [],
@@ -3955,8 +4000,7 @@ const create = (uid, uri, x, y, width, height, platform, assetDir) => {
     locationProtocol: '',
     marketplaceEntries: [],
     name: '',
-    paddingLeft: 0,
-    paddingRight: 0,
+    ...getResponsiveLayout(width),
     platform,
     programmingLanguages: [],
     rating: 'n/a',
@@ -3970,9 +4014,7 @@ const create = (uid, uri, x, y, width, height, platform, assetDir) => {
     settings: [],
     settingsButtonEnabled: false,
     showAdditionalDetailsBreakpoint: 700,
-    showSideBar: true,
     showSizeLink: false,
-    sideBarWidth: 0,
     sizeOnDisk: 0,
     sizeValue: 0,
     status: 0,
@@ -4770,38 +4812,6 @@ const getLinkProtectionEnabled = async () => {
   }
 };
 
-const interpolate = (value, inMin, inMax, outMin, outMax) => {
-  const clamped = Math.min(Math.max(value, inMin), inMax);
-  const ratio = (clamped - inMin) / (inMax - inMin);
-  const mapped = outMin + ratio * (outMax - outMin);
-  return Math.round(mapped);
-};
-
-const getPadding = width => {
-  if (width < 600) {
-    return 10;
-  }
-  if (width < 800) {
-    return 10;
-  }
-  if (width < 1200) {
-    return interpolate(width, 800, 1200, 10, 30);
-  }
-  return 30;
-};
-const getSideBarWidth = width => {
-  if (width < 490) {
-    return 0;
-  }
-  if (width < 650) {
-    return Math.max(175 + Math.round(20 * (width / 100)), Math.round(width / 4));
-  }
-  if (width < 800) {
-    return Math.max(175 + Math.round(20 * (width / 100)), Math.round(width / 4));
-  }
-  return Math.max(175 + Math.round(20 * (width / 100)), Math.round(width / 4));
-};
-
 const getStringArray = value => {
   if (!Array.isArray(value)) {
     return undefined;
@@ -5582,6 +5592,7 @@ const loadContentInternal = async (state, platform, savedState, isTest = false)
     selectedTab
   } = restoreState(savedState);
   const features = getFeatures(selectedFeature || Theme, extension);
+  const actualSelectedFeature = features.find(feature => feature.selected)?.id || '';
   const hasFeatures = features.length > 0;
   const hasGithubReleases = Boolean(getGithubRepository(extension));
   const tabs = getTabs(selectedTab, hasReadme, hasFeatures, hasChangelog || hasGithubReleases);
@@ -5598,9 +5609,6 @@ const loadContentInternal = async (state, platform, savedState, isTest = false)
     marketplaceEntries,
     resources
   } = await loadSideBarContent(extensionId, extensionVersion, extensionUri, isBuiltin, extension, showSizeLink, created, lastUpdated);
-  const padding = getPadding(width);
-  const sideBarWidth = getSideBarWidth(width);
-  const showSideBar = sideBarWidth > 0;
   const linkProtectionEnabled = await getLinkProtectionEnabled();
   return {
     ...state,
@@ -5638,8 +5646,7 @@ const loadContentInternal = async (state, platform, savedState, isTest = false)
     locationProtocol,
     marketplaceEntries,
     name,
-    paddingLeft: padding,
-    paddingRight: padding,
+    ...getResponsiveLayout(width),
     platform,
     rating,
     readmeScrollTop,
@@ -5647,11 +5654,10 @@ const loadContentInternal = async (state, platform, savedState, isTest = false)
     resources,
     scrollSource: Script,
     scrollToTopButtonEnabled: true,
+    selectedFeature: actualSelectedFeature,
     selectedTab,
     settingsButtonEnabled: true,
-    showSideBar,
     showSizeLink,
-    sideBarWidth,
     sizeOnDisk: size,
     sizeValue,
     tabs: enabledTabs
@@ -6360,11 +6366,25 @@ const hideSizeLink = state => {
   };
 };
 
+const applyLatestResponsiveLayout = state => {
+  const {
+    uid
+  } = state;
+  const {
+    width
+  } = get$1(uid).newState;
+  return {
+    ...state,
+    ...getResponsiveLayout(width),
+    width
+  };
+};
 const loadContent2 = async (state, savedState, isTest = false) => {
   const {
     platform
   } = state;
-  return loadContent(state, platform, savedState, isTest);
+  const loadedState = await loadContent(state, platform, savedState, isTest);
+  return applyLatestResponsiveLayout(loadedState);
 };
 
 const openImageInNewTab = async state => {
@@ -7205,16 +7225,10 @@ const renderTitle = state => {
 };
 
 const resize = (state, dimensions) => {
-  const padding = getPadding(dimensions.width);
-  const sideBarWidth = getSideBarWidth(dimensions.width);
-  const showSideBar = sideBarWidth > 0;
   return {
     ...state,
     ...dimensions,
-    paddingLeft: padding,
-    paddingRight: padding,
-    showSideBar,
-    sideBarWidth
+    ...getResponsiveLayout(dimensions.width)
   };
 };
 

package/package.json

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