Skip to content

feat(web_core, lit): implement createComponentImplementation and refactor basic catalog components - #2313

Draft
josemontespg wants to merge 1 commit into
react-universal-componentsfrom
lit-create-component-implementation
Draft

feat(web_core, lit): implement createComponentImplementation and refactor basic catalog components#2313
josemontespg wants to merge 1 commit into
react-universal-componentsfrom
lit-create-component-implementation

Conversation

@josemontespg

@josemontespg josemontespg commented Aug 17, 2026

Copy link
Copy Markdown
Collaborator

Description

This PR implements the createComponentImplementation helper function in @a2ui/web_core/v0_9 and re-exports it in @a2ui/lit/v0_9. It also refactors all 18 basic Lit components in renderers/web_core/src/v0_9/basic_catalog/components/ to use this new pattern.

Key Changes

  • @a2ui/web_core/v0_9: Implement createComponentImplementation which pairs a ComponentApi definition, element constructor, and custom element tag name into a WebComponentImplementation.
  • @a2ui/web_core/v0_9 basic catalog components: Refactor AudioPlayer, Button, Card, CheckBox, ChoicePicker, Column, DateTimeInput, Divider, Icon, Image, List, Modal, Row, Slider, Tabs, Text, TextField, and Video to export definitions using createComponentImplementation.
  • @a2ui/lit/v0_9: Re-export createComponentImplementation from root index.
  • Unit Tests: Added test suite in web_core/src/v0_9/catalog/types.test.ts verifying pairing of ComponentApi with tag names.

Testing

  • Unit tests: passed (yarn --cwd renderers/web_core test, yarn --cwd renderers/lit test)
  • Browser tests: passed (Karma headless)
  • Explorer tests: passed (yarn --cwd renderers/lit/a2ui_explorer test:ci)
  • Linters: passed (yarn --cwd renderers/web_core lint, yarn --cwd renderers/lit lint, yarn --cwd renderers/lit/a2ui_explorer lint)

@gemini-code-assist gemini-code-assist Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request introduces the createComponentImplementation helper function in @a2ui/web_core/v0_9 and refactors all basic catalog components to use it instead of manually defining their implementations. It also updates the Lit renderer to re-export this helper and refactors the corresponding test suite. A review comment points out a potential runtime TypeError in createComponentImplementation if apiOrImpl is null, since typeof null evaluates to 'object' and would crash on the 'tagName' in apiOrImpl check. A defensive guard is suggested to prevent this crash.

Comment thread renderers/web_core/src/v0_9/catalog/types.ts Outdated
@josemontespg
josemontespg marked this pull request as draft August 18, 2026 00:03
Comment thread renderers/lit/src/v0_9/tests/basic-catalog-a2ui-lit-element.test.ts Outdated
Comment thread renderers/lit/src/v0_9/types.ts Outdated
Comment thread renderers/web_core/src/v0_9/catalog/types.ts Outdated
@josemontespg
josemontespg force-pushed the lit-create-component-implementation branch 2 times, most recently from b17e8be to 66c96b4 Compare August 18, 2026 00:28
@josemontespg

Copy link
Copy Markdown
Collaborator Author

All comments addressed:

  1. Reverted test changes: Reverted all changes to basic-catalog-a2ui-lit-element.test.ts so it remains completely untouched in this PR.
  2. Types export: Removed createComponentImplementation from renderers/lit/src/v0_9/types.ts, keeping it exported only in index.ts.
  3. Simplified createComponentImplementation: Streamlined the function to a clean 2-argument signature createComponentImplementation(api, element) with no options parameter. The tag name is derived automatically via customElements.getName(element) (with a2ui-${api.name.toLowerCase()} fallback) and registered in customElements.

* @param element The CustomElementConstructor implementing the component.
* @returns A WebComponentImplementation ready to be registered in a Catalog.
*/
export function createComponentImplementation<Schema extends z.ZodTypeAny = z.ZodTypeAny>(

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Extract this function to its own file

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Extracted createComponentImplementation to its own dedicated file: renderers/web_core/src/v0_9/catalog/create_component_implementation.ts with unit tests in create_component_implementation.test.ts.

@josemontespg
josemontespg force-pushed the lit-create-component-implementation branch from 66c96b4 to f8fe3b2 Compare August 18, 2026 00:40
@josemontespg
josemontespg force-pushed the lit-create-component-implementation branch from f8fe3b2 to 0f465b3 Compare August 18, 2026 18:52
@josemontespg
josemontespg force-pushed the lit-create-component-implementation branch from 0f465b3 to df457f9 Compare August 18, 2026 21:35
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.

1 participant