Skip to content

Conversation

Copy link
Contributor

Copilot AI commented Nov 27, 2025

  • Analyze atomic-tab-manager Stencil component and structure
  • Identify migration type as Component Migration (Custom Element)
  • Check for existing E2E tests (found) and Cypress tests (none found)
  • Review similar migrated Lit components (atomic-breadbox, atomic-result)
  • Step 0: Add visual tests and generate baseline snapshots from Stencil
  • Step 1: Migrate component from Stencil to Lit
  • Step 2: Create comprehensive unit tests for Lit component
  • Step 3: Update Storybook stories (if needed)
  • Step 4: Enhance E2E tests with additional functional tests
  • Step 5: Validate visual tests pass with Lit component
  • Step 6: Analyze Cypress tests (none found for this component)
  • Step 7: Create/update MDX documentation
  • Export Lit component in search/index.ts

Migration Summary

  • Created new Lit component atomic-tab-manager.ts with:
    • @customElement, @bindings(), @withTailwindStyles decorators
    • bindStateToController for TabManager state
    • Proper Lit property declarations
    • HTML template with lit-html
  • Renamed original Stencil component to stencil-atomic-tab-manager.tsx for backward compatibility
  • Fixed import paths after moving component from tabs/atomic-tab-manager to atomic-tab-manager
  • Added component exports to auto-generated index files

Fixes #6374

Original prompt

This section details on the original issue you should resolve

<issue_title>Migrate atomic-tab-manager</issue_title>
<issue_description>

Jira Issue: KIT-5027

Type: User Story
Status: New
Priority: Medium


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


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

Co-authored-by: alexprudhomme <78121423+alexprudhomme@users.noreply.github.com>
@alexprudhomme
Copy link
Contributor

@copilot Keep going !

- Create new Lit component (atomic-tab-manager.ts)
- Rename original Stencil component with stencil- prefix
- Fix import paths after moving from tabs/ subdirectory
- Add component exports to search/index.ts and lazy-index.ts
- Convert Tailwind @apply directives to plain CSS for compatibility

Co-authored-by: alexprudhomme <78121423+alexprudhomme@users.noreply.github.com>
Copy link
Contributor Author

Copilot AI commented Nov 28, 2025

@copilot Keep going !

Continuing the migration! Just committed the core component migration (1d6f52a). The Lit component is now created with proper decorators, the Stencil component is renamed with stencil- prefix, and exports are added to the index files.

Working on verifying tests and completing remaining steps.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Migrate atomic-tab-manager

2 participants