Config file updates. Agent, docs and instructions file clean up. Test fixes and javascript fixes

Author: ashleyshaw

.babelrc.json

@@ -1,3 +1,3 @@
 {
-	"presets": [ "@wordpress/babel-preset-default" ]
+	"presets": ["@wordpress/babel-preset-default"]
 }

.coderabbit.yml

@@ -1,111 +1,111 @@
 $schema: https://coderabbit.ai/integrations/coderabbit-overrides.v2.json
-language: "en"
+language: 'en'
 chat:
-  auto_reply: true
+    auto_reply: true
 reviews:
-  request_changes_workflow: true
-  high_level_summary: true
-  poem: false
-  review_status: true
-  collapse_walkthrough: true
+    request_changes_workflow: true
+    high_level_summary: true
+    poem: false
+    review_status: true
+    collapse_walkthrough: true
 path_filters:
-  - "!build/**"
-  - "!node_modules/**"
-  - "!assets/css/*.map"
-  - "!logs/**"
+    - '!build/**'
+    - '!node_modules/**'
+    - '!assets/css/*.map'
+    - '!logs/**'
 auto_review:
-  enabled: true
-  drafts: false
-  base_branches:
-    - "main"
-    - "develop"
-    - "feature/*"
-    - "fix/*"
-    - "update/*"
+    enabled: true
+    drafts: false
+    base_branches:
+        - 'main'
+        - 'develop'
+        - 'feature/*'
+        - 'fix/*'
+        - 'update/*'
 path_instructions:
-  - path: "**/theme.json"
-    instructions: |
-      Review theme.json configuration for WordPress block themes:
-        - Ensure JSON syntax is valid and properly formatted
-        - Verify color palettes use named tokens consistently (primary, secondary, accent)
-        - Check typography settings include complete font definitions with fluid clamp() values
-        - Validate spacing scales are consistent and use rem units
-        - Confirm layout settings define appropriate contentSize and wideSize values
-        - Ensure all settings follow WordPress block theme standards
-        - Check accessibility compliance with sufficient color contrast ratios (4.5:1 minimum)
-        - Verify compatibility with Full Site Editing (FSE) features
-        - Validate custom properties don't conflict with core block functionality
-  - path: "**/patterns/*.php"
-    instructions: |
-      Review WordPress block patterns for FSE compatibility:
-        - Ensure proper pattern registration using register_block_pattern() function
-        - Verify pattern naming follows lsx/[category]-[name] convention
-        - Check that patterns use theme.json variables exclusively for styling
-        - Validate proper heading hierarchy and accessibility compliance
-        - Ensure placeholder content is realistic and appropriate
-        - Check patterns maintain design integrity with different content lengths
-        - Verify patterns are responsive and work across all viewport sizes
-        - Confirm patterns avoid inline styles and use block variations appropriately
-        - Validate proper block nesting and semantic HTML structure
-        - Test that patterns follow WordPress coding standards for PHP
-  - path: "**/parts/*.html"
-    instructions: |
-      Review WordPress template parts for block theme compatibility:
-        - Ensure template parts follow WordPress HTML template structure
-        - Verify proper use of WordPress block markup
-        - Check semantic HTML elements and proper heading hierarchy
-        - Validate accessibility features (ARIA roles, alt attributes)
-        - Ensure template parts use theme.json variables for styling
-        - Check compatibility with Full Site Editing interface
-        - Verify proper block structure and nesting
-        - Validate responsive design across different screen sizes
-  - path: "**/templates/*.html"
-    instructions: |
-      Review WordPress block templates for FSE:
-        - Ensure templates follow WordPress block template structure
-        - Verify proper template hierarchy and naming conventions
-        - Check integration with template parts and patterns
-        - Validate proper query loop implementation for dynamic content
-        - Ensure templates maintain design consistency
-        - Check accessibility compliance throughout templates
-        - Verify responsive behavior and layout integrity
-  - path: "**/functions.php"
-    instructions: |
-      Review functions.php for WordPress block theme:
-        - Ensure theme setup follows WordPress block theme standards
-        - Verify proper theme support declarations for FSE features
-        - Check secure coding practices (sanitization, validation, escaping)
-        - Validate proper hook usage and WordPress coding standards
-        - Ensure compatibility with latest WordPress version
-        - Check for performance optimization in theme functions
-        - Verify proper asset enqueueing and dependency management
-        - Ensure functions don't conflict with block editor functionality
-  - path: "**/*.{css,scss}"
-    instructions: |
-      Review CSS/SCSS for WordPress block theme:
-        - Prefer theme.json configuration over custom CSS when possible
-        - Ensure CSS enhances rather than replaces theme.json settings
-        - Check for proper use of CSS custom properties from theme.json
-        - Validate responsive design using consistent breakpoints
-        - Ensure accessibility compliance in custom styles
-        - Check for performance optimization (minimal CSS, efficient selectors)
-        - Verify styles don't conflict with core WordPress block styles
-        - Ensure proper CSS organization and maintainability
-  - path: "**/e2e/*.{ts,js}"
-    instructions: |
-      Review Playwright end-to-end tests for WordPress block theme:
-        - Ensure tests cover accessibility validation across all pages
-        - Verify tests check responsive design at multiple breakpoints
-        - Check tests validate Full Site Editing functionality
-        - Ensure tests cover block pattern and template part functionality
-        - Verify proper test structure, setup, and teardown
-        - Ensure tests are reliable and not flaky
-  - path: "**/src/js/*.js"
-    instructions: |
-      Review JavaScript for WordPress block theme:
-        - Check for proper WordPress script enqueueing in functions.php
-        - Validate accessibility enhancements don't conflict with core features
-        - Ensure performance optimization and avoid unnecessary dependencies
-        - Check compatibility with WordPress script loading patterns
-        - Verify proper event handling and DOM manipulation
-        - Ensure scripts work with both frontend and editor interfaces
+    - path: '**/theme.json'
+      instructions: |
+          Review theme.json configuration for WordPress block themes:
+            - Ensure JSON syntax is valid and properly formatted
+            - Verify color palettes use named tokens consistently (primary, secondary, accent)
+            - Check typography settings include complete font definitions with fluid clamp() values
+            - Validate spacing scales are consistent and use rem units
+            - Confirm layout settings define appropriate contentSize and wideSize values
+            - Ensure all settings follow WordPress block theme standards
+            - Check accessibility compliance with sufficient color contrast ratios (4.5:1 minimum)
+            - Verify compatibility with Full Site Editing (FSE) features
+            - Validate custom properties don't conflict with core block functionality
+    - path: '**/patterns/*.php'
+      instructions: |
+          Review WordPress block patterns for FSE compatibility:
+            - Ensure proper pattern registration using register_block_pattern() function
+            - Verify pattern naming follows lsx/[category]-[name] convention
+            - Check that patterns use theme.json variables exclusively for styling
+            - Validate proper heading hierarchy and accessibility compliance
+            - Ensure placeholder content is realistic and appropriate
+            - Check patterns maintain design integrity with different content lengths
+            - Verify patterns are responsive and work across all viewport sizes
+            - Confirm patterns avoid inline styles and use block variations appropriately
+            - Validate proper block nesting and semantic HTML structure
+            - Test that patterns follow WordPress coding standards for PHP
+    - path: '**/parts/*.html'
+      instructions: |
+          Review WordPress template parts for block theme compatibility:
+            - Ensure template parts follow WordPress HTML template structure
+            - Verify proper use of WordPress block markup
+            - Check semantic HTML elements and proper heading hierarchy
+            - Validate accessibility features (ARIA roles, alt attributes)
+            - Ensure template parts use theme.json variables for styling
+            - Check compatibility with Full Site Editing interface
+            - Verify proper block structure and nesting
+            - Validate responsive design across different screen sizes
+    - path: '**/templates/*.html'
+      instructions: |
+          Review WordPress block templates for FSE:
+            - Ensure templates follow WordPress block template structure
+            - Verify proper template hierarchy and naming conventions
+            - Check integration with template parts and patterns
+            - Validate proper query loop implementation for dynamic content
+            - Ensure templates maintain design consistency
+            - Check accessibility compliance throughout templates
+            - Verify responsive behavior and layout integrity
+    - path: '**/functions.php'
+      instructions: |
+          Review functions.php for WordPress block theme:
+            - Ensure theme setup follows WordPress block theme standards
+            - Verify proper theme support declarations for FSE features
+            - Check secure coding practices (sanitization, validation, escaping)
+            - Validate proper hook usage and WordPress coding standards
+            - Ensure compatibility with latest WordPress version
+            - Check for performance optimization in theme functions
+            - Verify proper asset enqueueing and dependency management
+            - Ensure functions don't conflict with block editor functionality
+    - path: '**/*.{css,scss}'
+      instructions: |
+          Review CSS/SCSS for WordPress block theme:
+            - Prefer theme.json configuration over custom CSS when possible
+            - Ensure CSS enhances rather than replaces theme.json settings
+            - Check for proper use of CSS custom properties from theme.json
+            - Validate responsive design using consistent breakpoints
+            - Ensure accessibility compliance in custom styles
+            - Check for performance optimization (minimal CSS, efficient selectors)
+            - Verify styles don't conflict with core WordPress block styles
+            - Ensure proper CSS organization and maintainability
+    - path: '**/e2e/*.{ts,js}'
+      instructions: |
+          Review Playwright end-to-end tests for WordPress block theme:
+            - Ensure tests cover accessibility validation across all pages
+            - Verify tests check responsive design at multiple breakpoints
+            - Check tests validate Full Site Editing functionality
+            - Ensure tests cover block pattern and template part functionality
+            - Verify proper test structure, setup, and teardown
+            - Ensure tests are reliable and not flaky
+    - path: '**/src/js/*.js'
+      instructions: |
+          Review JavaScript for WordPress block theme:
+            - Check for proper WordPress script enqueueing in functions.php
+            - Validate accessibility enhancements don't conflict with core features
+            - Ensure performance optimization and avoid unnecessary dependencies
+            - Check compatibility with WordPress script loading patterns
+            - Verify proper event handling and DOM manipulation
+            - Ensure scripts work with both frontend and editor interfaces

.devcontainer/devcontainer.json

@@ -34,15 +34,8 @@
 				"[php]": {
 					"editor.defaultFormatter": "bmewburn.vscode-intelephense-client"
 				},
-				"eslint.validate": [
-					"javascript",
-					"javascriptreact"
-				],
-				"stylelint.validate": [
-					"css",
-					"scss",
-					"postcss"
-				],
+				"eslint.validate": ["javascript", "javascriptreact"],
+				"stylelint.validate": ["css", "scss", "postcss"],
 				"files.associations": {
 					"*.php": "php",
 					"*.html": "html"

.devcontainer/docker-compose.yml

@@ -1,83 +1,83 @@
 version: '3.8'
 
 services:
-  devcontainer:
-    build:
-      context: .
-      dockerfile: Dockerfile
-    volumes:
-      - ..:/workspace:cached
-      - wordpress-data:/var/www/html
-      - node-modules:/workspace/node_modules
-    command: sleep infinity
-    networks:
-      - wordpress-network
-    depends_on:
-      - db
+    devcontainer:
+        build:
+            context: .
+            dockerfile: Dockerfile
+        volumes:
+            - ..:/workspace:cached
+            - wordpress-data:/var/www/html
+            - node-modules:/workspace/node_modules
+        command: sleep infinity
+        networks:
+            - wordpress-network
+        depends_on:
+            - db
 
-  wordpress:
-    image: wordpress:latest
-    ports:
-      - "8080:80"
-    environment:
-      WORDPRESS_DB_HOST: db
-      WORDPRESS_DB_USER: wordpress
-      WORDPRESS_DB_PASSWORD: wordpress
-      WORDPRESS_DB_NAME: wordpress
-      WORDPRESS_DEBUG: "1"
-      WORDPRESS_CONFIG_EXTRA: |
-        define('WP_DEBUG_LOG', true);
-        define('WP_DEBUG_DISPLAY', false);
-        define('SCRIPT_DEBUG', true);
-        define('SAVEQUERIES', true);
-    volumes:
-      - wordpress-data:/var/www/html
-      - ..:/var/www/html/wp-content/themes/lswp-theme:cached
-    networks:
-      - wordpress-network
-    depends_on:
-      - db
+    wordpress:
+        image: wordpress:latest
+        ports:
+            - '8080:80'
+        environment:
+            WORDPRESS_DB_HOST: db
+            WORDPRESS_DB_USER: wordpress
+            WORDPRESS_DB_PASSWORD: wordpress
+            WORDPRESS_DB_NAME: wordpress
+            WORDPRESS_DEBUG: '1'
+            WORDPRESS_CONFIG_EXTRA: |
+                define('WP_DEBUG_LOG', true);
+                define('WP_DEBUG_DISPLAY', false);
+                define('SCRIPT_DEBUG', true);
+                define('SAVEQUERIES', true);
+        volumes:
+            - wordpress-data:/var/www/html
+            - ..:/var/www/html/wp-content/themes/lswp-theme:cached
+        networks:
+            - wordpress-network
+        depends_on:
+            - db
 
-  db:
-    image: mariadb:10.6
-    environment:
-      MYSQL_ROOT_PASSWORD: root
-      MYSQL_DATABASE: wordpress
-      MYSQL_USER: wordpress
-      MYSQL_PASSWORD: wordpress
-    volumes:
-      - db-data:/var/lib/mysql
-    networks:
-      - wordpress-network
-    ports:
-      - "3306:3306"
+    db:
+        image: mariadb:10.6
+        environment:
+            MYSQL_ROOT_PASSWORD: root
+            MYSQL_DATABASE: wordpress
+            MYSQL_USER: wordpress
+            MYSQL_PASSWORD: wordpress
+        volumes:
+            - db-data:/var/lib/mysql
+        networks:
+            - wordpress-network
+        ports:
+            - '3306:3306'
 
-  phpmyadmin:
-    image: phpmyadmin/phpmyadmin
-    environment:
-      PMA_HOST: db
-      PMA_USER: root
-      PMA_PASSWORD: root
-    ports:
-      - "8081:80"
-    networks:
-      - wordpress-network
-    depends_on:
-      - db
+    phpmyadmin:
+        image: phpmyadmin/phpmyadmin
+        environment:
+            PMA_HOST: db
+            PMA_USER: root
+            PMA_PASSWORD: root
+        ports:
+            - '8081:80'
+        networks:
+            - wordpress-network
+        depends_on:
+            - db
 
-  mailhog:
-    image: mailhog/mailhog
-    ports:
-      - "8025:8025"
-      - "1025:1025"
-    networks:
-      - wordpress-network
+    mailhog:
+        image: mailhog/mailhog
+        ports:
+            - '8025:8025'
+            - '1025:1025'
+        networks:
+            - wordpress-network
 
 volumes:
-  wordpress-data:
-  db-data:
-  node-modules:
+    wordpress-data:
+    db-data:
+    node-modules:
 
 networks:
-  wordpress-network:
-    driver: bridge
+    wordpress-network:
+        driver: bridge