@teambit/preview 1.0.114 → 1.0.116

package/preview-modules.tsx

@@ -1,28 +1 @@
-import type { PreviewModule, ModuleFile } from './types/preview-module';
-
-type ModuleId = string;
-
-export class PreviewModules extends Map<ModuleId, PreviewModule> {
-  onSet = new Set<() => void>();
-
-  override set(id: ModuleId, preview: PreviewModule) {
-    super.set(id, preview);
-    this.onSet.forEach((callback) => callback());
-    return this;
-  }
-
-  loadComponentPreviews(compId: string, previews: Record<string, ModuleFile[]>) {
-    Object.entries(previews).forEach(([previewName, moduleFile]) => {
-      const preview = this.get(previewName);
-      if (!preview) return; // TODO - ok for now
-
-      preview.componentMap[compId] = moduleFile;
-    });
-  }
-}
-
-export const PREVIEW_MODULES = new PreviewModules();
-
-export function linkModules(previewName: string, previewModule: PreviewModule) {
-  PREVIEW_MODULES.set(previewName, previewModule);
-}
+export { PreviewModules, linkModules, PREVIEW_MODULES } from '@teambit/preview.modules.preview-modules';

package/preview.main.runtime.tsx

@@ -119,6 +119,16 @@ export type PreviewAnyComponentData = {
    */
   splitComponentBundle?: boolean;
 
+  /**
+   * don't allow other aspects implementing a preview definition to be included in your preview.
+   */
+  onlyOverview?: boolean;
+
+  /**
+   * use name query params to select a specific composition to render.
+   */
+  useNameParam?: boolean;
+
   /**
    * don't allow other aspects implementing a preview definition to be included in your preview.
    */
@@ -130,6 +140,8 @@ export type PreviewAnyComponentData = {
  */
 export type PreviewEnvComponentData = {
   isScaling?: boolean;
+  supportsOnlyOverview?: boolean;
+  supportsUseNameParam?: boolean;
 };
 
 export type PreviewConfig = {
@@ -141,6 +153,7 @@ export type PreviewConfig = {
    * default - no limit.
    */
   maxChunkSize?: number;
+  onlyOverview?: boolean;
 };
 
 export type EnvPreviewConfig = {
@@ -244,6 +257,42 @@ export class PreviewMain {
     return previewData;
   }
 
+  /**
+   * check if the current version of env component supports skipping other included previews
+   * @param envComponent
+   * @returns
+   */
+  doesEnvIncludesOnlyOverview(envComponent: Component): boolean {
+    const previewData = this.getPreviewData(envComponent);
+    return !!previewData?.supportsOnlyOverview;
+  }
+
+  /**
+   * check if the current version of env component supports name query param
+   * @param envComponent
+   * @returns
+   */
+  doesEnvUseNameParam(envComponent: Component): boolean {
+    const previewData = this.getPreviewData(envComponent);
+    return !!previewData?.supportsUseNameParam;
+  }
+
+  private async calculateIncludeOnlyOverview(component: Component): Promise<boolean> {
+    if (this.envs.isUsingCoreEnv(component)) {
+      return true;
+    }
+    const envComponent = await this.envs.getEnvComponent(component);
+    return this.doesEnvIncludesOnlyOverview(envComponent);
+  }
+
+  private async calculateUseNameParam(component: Component): Promise<boolean> {
+    if (this.envs.isUsingCoreEnv(component)) {
+      return true;
+    }
+    const envComponent = await this.envs.getEnvComponent(component);
+    return this.doesEnvUseNameParam(envComponent);
+  }
+
   /**
    * Calculate preview data on component load
    * @param component
@@ -253,8 +302,13 @@ export class PreviewMain {
     const doesScaling = await this.calcDoesScalingForComponent(component);
     const dataFromEnv = await this.calcPreviewDataFromEnv(component);
     const envData = (await this.calculateDataForEnvComponent(component)) || {};
+    const onlyOverview = await this.calculateIncludeOnlyOverview(component);
+    const useNameParam = await this.calculateUseNameParam(component);
+
     const data: PreviewComponentData = {
       doesScaling,
+      onlyOverview,
+      useNameParam,
       ...dataFromEnv,
       ...envData,
     };
@@ -268,7 +322,7 @@ export class PreviewMain {
    */
   async calcPreviewDataFromEnv(
     component: Component
-  ): Promise<Omit<PreviewAnyComponentData, 'doesScaling'> | undefined> {
+  ): Promise<Omit<PreviewAnyComponentData, 'doesScaling' | 'onlyOverview' | 'useNameParam'> | undefined> {
     // Prevent infinite loop that caused by the fact that the env of the aspect env or the env env is the same as the component
     // so we can't load it since during load we are trying to get env component and load it again
     if (
@@ -297,15 +351,17 @@ export class PreviewMain {
    */
   private async calculateDataForEnvComponent(envComponent: Component): Promise<PreviewEnvComponentData | undefined> {
     const isEnv = this.envs.isEnv(envComponent);
+
     // If the component is not an env, we don't want to store anything in the data
     if (!isEnv) return undefined;
+
     const previewAspectConfig = this.getPreviewAspectConfig(envComponent);
 
     const data = {
       // default to true if the env doesn't have a preview config
       isScaling: previewAspectConfig?.isScaling ?? true,
-      // disalbe it for now, we will re-enable it later
-      // skipIncludes: true,
+      supportsOnlyOverview: true,
+      supportsUseNameParam: true,
     };
     return data;
   }
@@ -429,6 +485,8 @@ export class PreviewMain {
   }
 
   async isSupportSkipIncludes(component: Component) {
+    if (!this.config.onlyOverview) return false;
+
     const isCore = this.envs.isUsingCoreEnv(component);
     if (isCore) return false;
 
@@ -437,6 +495,23 @@ export class PreviewMain {
     return !!previewData?.skipIncludes;
   }
 
+  /**
+   * check if the component preview should only include the overview (skipping rendering of the compostions and properties table)
+   */
+  async getOnlyOverview(component: Component): Promise<boolean> {
+    if (!this.config.onlyOverview) return false;
+    const previewData = this.getPreviewData(component);
+    return previewData?.onlyOverview ?? false;
+  }
+
+  /**
+   * check if the component preview should include the name query param
+   */
+  async getUseNameParam(component: Component): Promise<boolean> {
+    const previewData = this.getPreviewData(component);
+    return previewData?.useNameParam ?? false;
+  }
+
   /**
    * This function is calculate the isScaling support flag for the component preview.
    * This is calculated only for the env component and not for the component itself.
@@ -815,6 +890,7 @@ export class PreviewMain {
 
   static defaultConfig = {
     disabled: false,
+    onlyOverview: false,
   };
 
   static async provider(

package/preview.preview.runtime.tsx

@@ -104,11 +104,10 @@ export class PreviewPreview {
       })
     );
 
-    // remove `includes` (including compositions) when skipIncludes = true.
     const query = this.getQuery();
-    const skipIncludes = this.getParam(query, 'skipIncludes');
+    const onlyOverview = this.getParam(query, 'onlyOverview');
 
-    const includes = skipIncludes === 'true' ? [] : includesAll.filter((module) => !!module);
+    const includes = onlyOverview === 'true' ? [] : includesAll.filter((module) => !!module);
     // during build / tag, the component is isolated, so all aspects are relevant, and do not require filtering
     const componentAspects = this.isDev ? await this.getComponentAspects(componentId.toString()) : undefined;
     const previewModule = await this.getPreviewModule(name, componentId);

package/types/preview-module.ts

@@ -1,32 +1 @@
-type MainModuleExports = {
-  (...args: any[]): void;
-  apiObject?: boolean;
-};
-
-/**
- * A full index of the preview data
- */
-export type PreviewModule<T = any> = {
-  /** Dictionary mapping components to their module files. */
-  componentMap: Record<string, ModuleFile<T>[]>;
-
-  /**
-   * Dictionary mapping components to their preview metadata
-   */
-  componentMapMetadata: Record<string, unknown>;
-
-  /** The 'main file' for this Preview type */
-  modulesMap: {
-    default: {
-      default: MainModuleExports;
-    };
-    [envId: string]: {
-      default: MainModuleExports;
-    };
-  };
-
-  isSplitComponentBundle?: boolean;
-};
-
-/** single preview module, e.g. compositions file */
-export type ModuleFile<T = any> = Record<string, T>;
+export type { PreviewModule, ModuleFile } from '@teambit/preview.modules.preview-modules';