feat(atomic): migrate atomic-rating-facet from Stencil to Lit

[Copilot]

Migration Complete: atomic-rating-facet (Stencil → Lit) ✅

✅ All Steps Completed

Pre-Migration (Step 0)

• Added visual regression test infrastructure
• Generated baseline snapshots from Stencil component

Migration (Step 1)

• Created Lit component (atomic-rating-facet.ts)
• All proper decorators, lifecycle, and patterns
• All imports use @/* path aliases
• Fixed TypeScript errors:
  • Added useDefault: true to all properties with default values
  • Fixed renderRating import (was Rating)
  • Fixed FocusTargetController to accept this.bindings
  • Fixed functional component pattern (double invocation)
• Fixed Stencil dependency in store registration:
  • Created ratingContentAsElement() method that returns HTMLElement
  • Updated store registration to use HTMLElement instead of TemplateResult
  • This matches the pattern used in recent-queries.ts

Styles Migration

• Added static styles array with tw.css imports:
  • facetCommonStyles
  • facetValueCheckboxStyles
  • atomicRatingStyles
• Deleted atomic-rating-facet.pcss

Stencil Component Removal

• Deleted atomic-rating-facet.tsx

Unit Tests (Step 2)

• Comprehensive Vitest test suite (502 lines, 14 test suites)

Storybook Stories (Step 3)

• Stories verified adequate

E2E Tests (Step 4)

• Enhanced Playwright E2E tests (142 lines)

Cypress Migration (Step 6)

• All coverage migrated, Cypress files removed

Documentation (Step 7)

• Complete MDX documentation

Build (Final)

• Generated files committed
• TypeScript errors fixed
• Build successful

🎯 Migration Summary

Component: Successfully migrated from Stencil to Lit
Styles: Migrated from PCSS imports to Lit static styles array
Store Registration: Fixed to return HTMLElement instead of TemplateResult
Test Coverage: Complete with modern testing stack
Documentation: Complete with usage examples
Build: Successful

📋 Files Changed

Modified:

• atomic-rating-facet.ts:
  • Added render import from 'lit'
  • Added ratingContentAsElement() method
  • Updated store registration to use ratingContentAsElement()

🚀 Ready for Review

Migration is complete. All Stencil dependencies have been resolved.

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Migrate atomic-rating-facet</issue_title>
<issue_description>

Jira Issue: KIT-4954

Type: User Story
Status: New
Priority: Medium
Components: Atomic

---

Comments on the Issue (you are @copilot in this section)

Custom agent used: StencilToLitMigrationV2
Specialized agent for migrating Atomic Stencil code to Lit with visual regression testing

• Fixes Migrate atomic-rating-facet #6404

---

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

[y-lakhdar]

@copilot I have updated the test and generated the snapshots. you can now proceed to next migration steps

[Copilot]

@copilot I have updated the test and generated the snapshots. you can now proceed to next migration steps

Migration complete! I've proceeded with all remaining steps:

Step 2 (d4dc4a9): Added comprehensive Vitest unit tests (502 lines, 14 test suites)
Step 4 (f74a913): Enhanced E2E tests with functional coverage (142 lines)
Step 6 (146bdbc): Removed Cypress tests after confirming all coverage migrated
Step 7 (0df917b): Added complete MDX documentation with usage examples

The atomic-rating-facet migration is now complete with:

• ✅ Lit component migrated
• ✅ Unit tests covering all functionality
• ✅ E2E tests with visual regression
• ✅ Documentation complete
• ✅ No test coverage lost

The original Stencil .tsx file can be removed once the Lit version is validated.

[y-lakhdar]

@copilot can you rebuild the project and commit generated files