extend_component
Generate a properly subclassed TypeScript component extending an existing web component, with correct inheritance, annotations, and style encapsulation warnings.
Instructions
Generates a properly subclassed TypeScript component extending an existing web component. Produces the correct inheritance chain (class NewClass extends ParentClass), CEM @customElement annotation, CSS part forwarding guidance (exportparts), inherited slot documentation, TypeScript HTMLElementTagNameMap declaration, and Shadow DOM style encapsulation warnings. Prevents common extension anti-patterns such as broken inheritance chains, missing exportparts declarations, and style isolation surprises.
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| libraryId | No | Optional library ID to target a specific loaded library instead of the default. | |
| parentTagName | Yes | Tag name of the existing parent component to extend (e.g. "hx-button"). | |
| newTagName | Yes | Tag name for the new subclass component (e.g. "my-custom-button"). Must contain a hyphen. | |
| newClassName | No | Optional explicit class name for the new subclass. Defaults to PascalCase derived from newTagName (e.g. "MyCustomButton"). |