Improve component loading.

dist/transformers/preview/component/api.d.ts

@@ -14,5 +14,5 @@ export declare const writeComponentMetadataApi: (id: string, summary: ComponentL
  * @param handoff
  * @param componentData
  */
-export declare const updateComponentSummaryApi: (handoff: Handoff, componentData: ComponentListObject[]) => Promise<void>;
+export declare const updateComponentSummaryApi: (handoff: Handoff, componentData: ComponentListObject[], isFullRebuild?: boolean) => Promise<void>;
 export default writeComponentSummaryAPI;

dist/transformers/preview/component/api.js

@@ -76,8 +76,13 @@ exports.writeComponentMetadataApi = writeComponentMetadataApi;
  * @param handoff
  * @param componentData
  */
-const updateComponentSummaryApi = (handoff, componentData // Partial list (may be empty)
-) => __awaiter(void 0, void 0, void 0, function* () {
+const updateComponentSummaryApi = (handoff_1, componentData_1, ...args_1) => __awaiter(void 0, [handoff_1, componentData_1, ...args_1], void 0, function* (handoff, componentData, isFullRebuild = false) {
+    if (isFullRebuild) {
+        // Full rebuild: replace the entire file
+        yield writeComponentSummaryAPI(handoff, componentData);
+        return;
+    }
+    // Partial update: merge with existing data
     const apiPath = path_1.default.resolve(handoff.workingPath, 'public/api/components.json');
     let existingData = [];
     if (fs_extra_1.default.existsSync(apiPath)) {

dist/transformers/preview/component/builder.js

@@ -125,7 +125,8 @@ function processComponents(handoff, id, segmentToProcess) {
             }
         }
         // Always merge and write summary file, even if no components processed
-        yield (0, api_1.updateComponentSummaryApi)(handoff, result);
+        const isFullRebuild = !id;
+        yield (0, api_1.updateComponentSummaryApi)(handoff, result, isFullRebuild);
         return result;
     });
 }

src/app/components/util/index.ts

@@ -252,7 +252,7 @@ export const staticBuildMenu = () => {
                 // The user wants to inject the component menu here
                 return {
                   title: sub.title,
-                  menu: staticBuildComponentMenu(sub.components),
+                  menu: staticBuildComponentMenu(),
                 };
               }
               if (sub.tokens) {
@@ -281,16 +281,13 @@ export const staticBuildMenu = () => {
   return sections.concat(custom).sort((a: SectionLink, b: SectionLink) => a.weight - b.weight);
 };
 
-const staticBuildComponentMenu = (type?: string) => {
+const staticBuildComponentMenu = () => {
   let menu = [];
   let components = fetchComponents();
-  if (type) {
-    components = components.filter((c) => c.type === type);
-  }
   // Build the submenu of exportables (components)
   const groupedComponents = groupBy(components, (e) => e.group ?? '');
   Object.keys(groupedComponents).forEach((group) => {
-    const menuGroup = { title: group, menu: [] };
+    const menuGroup = { title: group || 'Uncategorized', menu: [] };
     groupedComponents[group].forEach((component) => {
       const docs = fetchDocPageMetadataAndContent('docs/components/', component.id);
       let title = startCase(component.id);

src/transformers/preview/component/api.ts

@@ -3,6 +3,7 @@ import path from 'path';
 import Handoff from '../../../index';
 import { ComponentListObject, TransformComponentTokensResult } from '../types';
 
+
 function updateObject<T extends TransformComponentTokensResult>(target: T, source: Partial<T>): T {
   return Object.entries(source).reduce(
     (acc, [key, value]) => {
@@ -80,8 +81,16 @@ export const writeComponentMetadataApi = async (id: string, summary: ComponentLi
  */
 export const updateComponentSummaryApi = async (
   handoff: Handoff,
-  componentData: ComponentListObject[] // Partial list (may be empty)
+  componentData: ComponentListObject[],
+  isFullRebuild: boolean = false
 ) => {
+  if (isFullRebuild) {
+    // Full rebuild: replace the entire file
+    await writeComponentSummaryAPI(handoff, componentData);
+    return;
+  }
+
+  // Partial update: merge with existing data
   const apiPath = path.resolve(handoff.workingPath, 'public/api/components.json');
   let existingData: ComponentListObject[] = [];
 

src/transformers/preview/component/builder.ts

@@ -120,7 +120,8 @@ export async function processComponents(
   }
 
   // Always merge and write summary file, even if no components processed
-  await updateComponentSummaryApi(handoff, result);
+  const isFullRebuild = !id;
+  await updateComponentSummaryApi(handoff, result, isFullRebuild);
 
   return result;
 }