feat: vue3 renderer and some vue3 samples

[shawnwang15]

Description

This PR adds complete Vue 3 support to A2UI by implementing a new Vue 3 renderer and sample applications with vue3 composition api, and aligning with the existing Angular and Lit implementations. Remaining Angular samples will be added in subsequent updates.

What's Changed

• Vue 3 Renderer
• Sample Applications: Restaurant Finder、Gallery

I am deeply interested in the intersection of AI and front-end engineering, and I look forward to contributing to the long-term maintenance of this project

[gemini-code-assist]

Code Review

This pull request introduces a comprehensive Vue 3 renderer for A2UI, complete with core components, a message processor, and sample applications. The implementation is well-structured, leveraging modern Vue 3 features like the Composition API and <script setup>. The separation between rendering logic, data handling, and component definitions is clean. My review focuses on improving robustness, ensuring consistency with the specifications, and enhancing maintainability. I've identified a few areas for improvement, including incomplete feature implementation in an input component and opportunities to make the code more resilient and consistent. Overall, this is a very strong contribution that significantly expands the project's capabilities.

[gemini-code-assist]

The type attribute for the <input> element is not fully implemented according to the ResolvedTextField type definition. The current implementation only distinguishes between number and text, while the type also supports email, password, tel, and url. This limits the functionality of the TextField component.

        :type="inputType || 'text'"

[shawnwang15]

This implementation aligns with the Angular counterpart.

[gemini-code-assist]

Using a non-null assertion (!) on surfaceId can introduce a risk of runtime errors if this composable is ever used in a context where surfaceId could be null. To make the function more robust, it would be safer to add a guard clause that checks for the existence of surfaceId before proceeding to dispatch the action.

Suggested change

	surfaceId: surfaceId!,
	surfaceId: surfaceId,

[shawnwang15]

This follows the same implementation logic as in Angular.

[gemini-code-assist]

The HintedStyles interface is missing the h6 property, but the areHintedStyles type guard on line 118 checks for it. This discrepancy can lead to incorrect type assertions. To ensure type safety and consistency, the h6 property should be added to the interface.

interface HintedStyles {
  h1: Record<string, string>;
  h2: Record<string, string>;
  h3: Record<string, string>;
  h4: Record<string, string>;
  h5: Record<string, string>;
  h6: Record<string, string>;
  body: Record<string, string>;
  caption: Record<string, string>;
}

[shawnwang15]

This follows the same implementation logic as in Angular.

[gemini-code-assist]

The component type Heading is not defined in the DEFAULT_CATALOG, which will cause a console warning and prevent the component from rendering. To display a heading, you should use the Text component with the appropriate usageHint, such as 'h1'.

        createComponent('Text', { text: { literalString: 'Heading Text' }, usageHint: 'h1' }),

[shawnwang15]

This follows the same implementation logic as in Angular.