meno-core 1.0.53 → 1.0.54

package/lib/shared/elementClassName.test.ts

@@ -3,20 +3,20 @@
  * Tests for generating unique CSS class names for elements in pages and components
  */
 
-import { test, expect, describe } from "bun:test";
+import { test, expect, describe } from 'bun:test';
 import {
   generateElementClassName,
   isElementClassName,
   parseElementClassName,
   type ElementClassContext,
-} from "./elementClassName";
+} from './elementClassName';
 
-describe("generateElementClassName", () => {
-  describe("Page elements", () => {
-    test("should generate page class with p_ prefix", () => {
+describe('generateElementClassName', () => {
+  describe('Page elements', () => {
+    test('should generate page class with p_ prefix', () => {
       const ctx: ElementClassContext = {
-        fileType: "page",
-        fileName: "about",
+        fileType: 'page',
+        fileName: 'about',
         path: [0],
       };
 
@@ -25,10 +25,10 @@ describe("generateElementClassName", () => {
       expect(className).toMatch(/^p_about_/);
     });
 
-    test("should generate consistent hash for same path", () => {
+    test('should generate consistent hash for same path', () => {
       const ctx: ElementClassContext = {
-        fileType: "page",
-        fileName: "about",
+        fileType: 'page',
+        fileName: 'about',
         path: [0, 1, 2],
       };
 
@@ -38,16 +38,16 @@ describe("generateElementClassName", () => {
       expect(className1).toBe(className2);
     });
 
-    test("should generate different hashes for different paths", () => {
+    test('should generate different hashes for different paths', () => {
       // Use significantly different paths to avoid hash collisions
       const ctx1: ElementClassContext = {
-        fileType: "page",
-        fileName: "about",
+        fileType: 'page',
+        fileName: 'about',
         path: [0],
       };
       const ctx2: ElementClassContext = {
-        fileType: "page",
-        fileName: "about",
+        fileType: 'page',
+        fileName: 'about',
         path: [0, 1, 2, 3],
       };
 
@@ -57,36 +57,36 @@ describe("generateElementClassName", () => {
       expect(className1).not.toBe(className2);
     });
 
-    test("should use label when provided", () => {
+    test('should use label when provided', () => {
       const ctx: ElementClassContext = {
-        fileType: "page",
-        fileName: "about",
-        label: "header",
+        fileType: 'page',
+        fileName: 'about',
+        label: 'header',
         path: [0],
       };
 
       const className = generateElementClassName(ctx);
 
-      expect(className).toBe("p_about_header");
+      expect(className).toBe('p_about_header');
     });
 
-    test("should sanitize label", () => {
+    test('should sanitize label', () => {
       const ctx: ElementClassContext = {
-        fileType: "page",
-        fileName: "about",
-        label: "My Header Component",
+        fileType: 'page',
+        fileName: 'about',
+        label: 'My Header Component',
         path: [0],
       };
 
       const className = generateElementClassName(ctx);
 
-      expect(className).toBe("p_about_my_header_component");
+      expect(className).toBe('p_about_my_header_component');
     });
 
-    test("should handle index page path", () => {
+    test('should handle index page path', () => {
       const ctx: ElementClassContext = {
-        fileType: "page",
-        fileName: "index",
+        fileType: 'page',
+        fileName: 'index',
         path: [0],
       };
 
@@ -95,10 +95,10 @@ describe("generateElementClassName", () => {
       expect(className).toMatch(/^p_index_/);
     });
 
-    test("should handle nested page paths", () => {
+    test('should handle nested page paths', () => {
       const ctx: ElementClassContext = {
-        fileType: "page",
-        fileName: "blog_post",
+        fileType: 'page',
+        fileName: 'blog_post',
         path: [0, 1, 2],
       };
 
@@ -108,11 +108,11 @@ describe("generateElementClassName", () => {
     });
   });
 
-  describe("Component elements", () => {
-    test("should generate component class with c_ prefix", () => {
+  describe('Component elements', () => {
+    test('should generate component class with c_ prefix', () => {
       const ctx: ElementClassContext = {
-        fileType: "component",
-        fileName: "Navigation",
+        fileType: 'component',
+        fileName: 'Navigation',
         path: [0],
       };
 
@@ -121,23 +121,23 @@ describe("generateElementClassName", () => {
       expect(className).toMatch(/^c_navigation_/);
     });
 
-    test("should use label for named elements", () => {
+    test('should use label for named elements', () => {
       const ctx: ElementClassContext = {
-        fileType: "component",
-        fileName: "Navigation",
-        label: "hamburger",
+        fileType: 'component',
+        fileName: 'Navigation',
+        label: 'hamburger',
         path: [0],
       };
 
       const className = generateElementClassName(ctx);
 
-      expect(className).toBe("c_navigation_hamburger");
+      expect(className).toBe('c_navigation_hamburger');
     });
 
-    test("should generate consistent hash for same component path", () => {
+    test('should generate consistent hash for same component path', () => {
       const ctx: ElementClassContext = {
-        fileType: "component",
-        fileName: "Card",
+        fileType: 'component',
+        fileName: 'Card',
         path: [0, 0],
       };
 
@@ -147,15 +147,15 @@ describe("generateElementClassName", () => {
       expect(className1).toBe(className2);
     });
 
-    test("should generate different hash for different component paths", () => {
+    test('should generate different hash for different component paths', () => {
       const ctx1: ElementClassContext = {
-        fileType: "component",
-        fileName: "Card",
+        fileType: 'component',
+        fileName: 'Card',
         path: [0],
       };
       const ctx2: ElementClassContext = {
-        fileType: "component",
-        fileName: "Card",
+        fileType: 'component',
+        fileName: 'Card',
         path: [0, 0],
       };
 
@@ -165,23 +165,23 @@ describe("generateElementClassName", () => {
       expect(className1).not.toBe(className2);
     });
 
-    test("should generate different hashes for sibling paths (only last index differs)", () => {
+    test('should generate different hashes for sibling paths (only last index differs)', () => {
       // Regression: a 5-char hash truncated from the high-order digits
       // collapsed to one value when only the final path index changed,
       // making every set of siblings share a class in the Webflow export.
-      const base = ["Layout", [0, 0, 1, 0, 0]] as const;
+      const base = ['Layout', [0, 0, 1, 0, 0]] as const;
       const siblings = [0, 1, 2, 3, 4].map((i) =>
         generateElementClassName({
-          fileType: "component",
+          fileType: 'component',
           fileName: base[0],
           path: [...base[1], i],
-        })
+        }),
       );
       expect(new Set(siblings).size).toBe(siblings.length);
     });
   });
 
-  describe("Component-relative paths", () => {
+  describe('Component-relative paths', () => {
     /**
      * When a component is placed on a page at path [0, 2, 1],
      * its internal elements should use relative paths from the component root.
@@ -189,17 +189,17 @@ describe("generateElementClassName", () => {
      * This ensures the same class is generated regardless of where the component
      * is placed on the page.
      */
-    test("should generate same class for component elements regardless of page position", () => {
+    test('should generate same class for component elements regardless of page position', () => {
       // Component element at path [0] relative to component root
       const ctx1: ElementClassContext = {
-        fileType: "component",
-        fileName: "Card",
+        fileType: 'component',
+        fileName: 'Card',
         path: [0], // Relative path within component
       };
 
       const ctx2: ElementClassContext = {
-        fileType: "component",
-        fileName: "Card",
+        fileType: 'component',
+        fileName: 'Card',
         path: [0], // Same relative path
       };
 
@@ -211,16 +211,16 @@ describe("generateElementClassName", () => {
       expect(className1).toBe(className2);
     });
 
-    test("should generate unique classes for different component names with same path", () => {
+    test('should generate unique classes for different component names with same path', () => {
       const ctx1: ElementClassContext = {
-        fileType: "component",
-        fileName: "Card",
+        fileType: 'component',
+        fileName: 'Card',
         path: [0],
       };
 
       const ctx2: ElementClassContext = {
-        fileType: "component",
-        fileName: "Button",
+        fileType: 'component',
+        fileName: 'Button',
         path: [0],
       };
 
@@ -233,11 +233,11 @@ describe("generateElementClassName", () => {
     });
   });
 
-  describe("Edge cases", () => {
-    test("should handle empty path array", () => {
+  describe('Edge cases', () => {
+    test('should handle empty path array', () => {
       const ctx: ElementClassContext = {
-        fileType: "page",
-        fileName: "about",
+        fileType: 'page',
+        fileName: 'about',
         path: [],
       };
 
@@ -246,10 +246,10 @@ describe("generateElementClassName", () => {
       expect(className).toMatch(/^p_about_/);
     });
 
-    test("should handle deeply nested paths", () => {
+    test('should handle deeply nested paths', () => {
       const ctx: ElementClassContext = {
-        fileType: "page",
-        fileName: "index",
+        fileType: 'page',
+        fileName: 'index',
         path: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
       };
 
@@ -258,77 +258,77 @@ describe("generateElementClassName", () => {
       expect(className).toMatch(/^p_index_/);
     });
 
-    test("should handle special characters in fileName", () => {
+    test('should handle special characters in fileName', () => {
       const ctx: ElementClassContext = {
-        fileType: "page",
-        fileName: "My Page (v2)",
+        fileType: 'page',
+        fileName: 'My Page (v2)',
         path: [0],
       };
 
       const className = generateElementClassName(ctx);
 
       // Should sanitize special characters
-      expect(className).not.toContain("(");
-      expect(className).not.toContain(")");
-      expect(className).not.toContain(" ");
+      expect(className).not.toContain('(');
+      expect(className).not.toContain(')');
+      expect(className).not.toContain(' ');
     });
   });
 });
 
-describe("isElementClassName", () => {
-  test("should return true for valid page class", () => {
-    expect(isElementClassName("p_about_header")).toBe(true);
-    expect(isElementClassName("p_index_a42e3")).toBe(true);
+describe('isElementClassName', () => {
+  test('should return true for valid page class', () => {
+    expect(isElementClassName('p_about_header')).toBe(true);
+    expect(isElementClassName('p_index_a42e3')).toBe(true);
   });
 
-  test("should return true for valid component class", () => {
-    expect(isElementClassName("c_navigation_hamburger")).toBe(true);
-    expect(isElementClassName("c_card_b12f4")).toBe(true);
+  test('should return true for valid component class', () => {
+    expect(isElementClassName('c_navigation_hamburger')).toBe(true);
+    expect(isElementClassName('c_card_b12f4')).toBe(true);
   });
 
-  test("should return false for invalid classes", () => {
-    expect(isElementClassName("about_header")).toBe(false); // Missing prefix
-    expect(isElementClassName("p_about")).toBe(false); // Missing element name
-    expect(isElementClassName("x_about_header")).toBe(false); // Wrong prefix
-    expect(isElementClassName("flex")).toBe(false); // Utility class
-    expect(isElementClassName("p-10px")).toBe(false); // Utility class
+  test('should return false for invalid classes', () => {
+    expect(isElementClassName('about_header')).toBe(false); // Missing prefix
+    expect(isElementClassName('p_about')).toBe(false); // Missing element name
+    expect(isElementClassName('x_about_header')).toBe(false); // Wrong prefix
+    expect(isElementClassName('flex')).toBe(false); // Utility class
+    expect(isElementClassName('p-[10px]')).toBe(false); // Utility class
   });
 });
 
-describe("parseElementClassName", () => {
-  test("should parse page class correctly", () => {
-    const result = parseElementClassName("p_about_header");
+describe('parseElementClassName', () => {
+  test('should parse page class correctly', () => {
+    const result = parseElementClassName('p_about_header');
 
     expect(result).toEqual({
-      fileType: "page",
-      fileName: "about",
-      elementName: "header",
+      fileType: 'page',
+      fileName: 'about',
+      elementName: 'header',
     });
   });
 
-  test("should parse component class correctly", () => {
-    const result = parseElementClassName("c_navigation_hamburger");
+  test('should parse component class correctly', () => {
+    const result = parseElementClassName('c_navigation_hamburger');
 
     expect(result).toEqual({
-      fileType: "component",
-      fileName: "navigation",
-      elementName: "hamburger",
+      fileType: 'component',
+      fileName: 'navigation',
+      elementName: 'hamburger',
     });
   });
 
-  test("should parse class with hash correctly", () => {
-    const result = parseElementClassName("p_index_a42e3");
+  test('should parse class with hash correctly', () => {
+    const result = parseElementClassName('p_index_a42e3');
 
     expect(result).toEqual({
-      fileType: "page",
-      fileName: "index",
-      elementName: "a42e3",
+      fileType: 'page',
+      fileName: 'index',
+      elementName: 'a42e3',
     });
   });
 
-  test("should return null for invalid classes", () => {
-    expect(parseElementClassName("about_header")).toBeNull();
-    expect(parseElementClassName("p_about")).toBeNull();
-    expect(parseElementClassName("flex")).toBeNull();
+  test('should return null for invalid classes', () => {
+    expect(parseElementClassName('about_header')).toBeNull();
+    expect(parseElementClassName('p_about')).toBeNull();
+    expect(parseElementClassName('flex')).toBeNull();
   });
 });

package/lib/shared/elementClassName.ts

@@ -93,7 +93,7 @@ export function isElementClassName(className: string): boolean {
  * Returns null if not a valid element class name
  */
 export function parseElementClassName(
-  className: string
+  className: string,
 ): { fileType: 'component' | 'page'; fileName: string; elementName: string } | null {
   const match = className.match(/^([cp])_([a-z0-9_-]+)_([a-z0-9_-]+)$/);
   if (!match) return null;

package/lib/shared/elementUtils.ts

@@ -5,7 +5,7 @@
 
 /**
  * Find an element with data-element-path attribute by traversing up the DOM tree
- * 
+ *
  * @param element - Starting element to search from
  * @returns Element with data-element-path attribute, or null if not found
  */
@@ -25,41 +25,41 @@ export function findElementWithPath(element: HTMLElement | null): HTMLElement |
  * The component root is the topmost element (walking up) that:
  * 1. Has data-element-path (is selectable in the tree)
  * 2. Has data-parent-component matching the starting element's component
- * 
+ *
  * @param element - Starting element (should have data-parent-component attribute)
  * @returns Component instance root element, or null if not found
  */
 export function findComponentInstanceRoot(element: HTMLElement): HTMLElement | null {
   const componentName = element.getAttribute('data-parent-component');
   if (!componentName) return null;
-  
+
   let current: HTMLElement | null = element;
   let componentRoot: HTMLElement | null = null;
-  
+
   // Walk up the DOM tree
   while (current) {
     const currentComponentName = current.getAttribute('data-parent-component');
     const hasPath = current.hasAttribute('data-element-path');
-    
+
     // If this element has the same component name and has a path, remember it
     // We want the LAST (topmost) one we encounter while still in the component
     if (currentComponentName === componentName && hasPath) {
       componentRoot = current;
     }
-    
+
     // Stop if we've moved to a different component
     if (currentComponentName && currentComponentName !== componentName) {
       break;
     }
-    
+
     // If we've exited the component (no data-parent-component) and we found a root, stop
     if (!currentComponentName && componentRoot) {
       break;
     }
-    
+
     current = current.parentElement;
   }
-  
+
   return componentRoot;
 }
 
@@ -67,13 +67,13 @@ export function findComponentInstanceRoot(element: HTMLElement): HTMLElement | n
  * Alternative implementation: Find component root by walking up until we find
  * an element without data-parent-component (the component root)
  * This is used by elementHighlighter.ts
- * 
+ *
  * @param element - Starting element
  * @returns Component instance root element, or null if not found
  */
 export function findComponentInstanceRootByParent(element: HTMLElement): HTMLElement | null {
   let current: HTMLElement | null = element;
-  
+
   // Walk up until we find an element without data-parent-component (the component root)
   while (current) {
     if (!current.hasAttribute('data-parent-component')) {
@@ -81,10 +81,6 @@ export function findComponentInstanceRootByParent(element: HTMLElement): HTMLEle
     }
     current = current.parentElement;
   }
-  
+
   return null;
 }
-
-
-
-

package/lib/shared/errorLogger.ts

@@ -40,11 +40,7 @@ function isDevelopment(): boolean {
  * Log runtime error with context
  * Use for graceful degradation scenarios where error is handled but should be visible
  */
-export function logRuntimeError(
-  location: string,
-  error: unknown,
-  context?: Record<string, unknown>
-): void {
+export function logRuntimeError(location: string, error: unknown, context?: Record<string, unknown>): void {
   const entry: ErrorLogEntry = {
     location,
     category: 'runtime',
@@ -66,11 +62,7 @@ export function logRuntimeError(
 /**
  * Log network/API error
  */
-export function logNetworkError(
-  location: string,
-  error: unknown,
-  context?: Record<string, unknown>
-): void {
+export function logNetworkError(location: string, error: unknown, context?: Record<string, unknown>): void {
   const entry: ErrorLogEntry = {
     location,
     category: 'network',

package/lib/shared/errors.test.ts

@@ -27,23 +27,12 @@ describe('createError', () => {
 
   test('creates error with cause', () => {
     const cause = new Error('Original error');
-    const error = createError(
-      'internal',
-      'WRAPPED',
-      'Wrapped message',
-      undefined,
-      cause
-    );
+    const error = createError('internal', 'WRAPPED', 'Wrapped message', undefined, cause);
     expect(error.cause).toBe(cause);
   });
 
   test('creates error for each category', () => {
-    const categories = [
-      'validation',
-      'runtime',
-      'network',
-      'internal',
-    ] as const;
+    const categories = ['validation', 'runtime', 'network', 'internal'] as const;
     for (const category of categories) {
       const error = createError(category, 'CODE', 'message');
       expect(error.category).toBe(category);

package/lib/shared/errors.ts

@@ -31,7 +31,7 @@ export function createError(
   code: string,
   message: string,
   context?: Record<string, unknown>,
-  cause?: Error
+  cause?: Error,
 ): AppError {
   return { category, code, message, context, cause };
 }
@@ -40,11 +40,5 @@ export function createError(
  * Type guard for AppError
  */
 export function isAppError(error: unknown): error is AppError {
-  return (
-    typeof error === 'object' &&
-    error !== null &&
-    'category' in error &&
-    'code' in error &&
-    'message' in error
-  );
+  return typeof error === 'object' && error !== null && 'category' in error && 'code' in error && 'message' in error;
 }