New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
@angular/elements
Advanced tools
@angular/elements - npm Package Compare versions
Comparing version 20.0.0-next.1 to 20.0.0-next.2
164
index.d.ts
| /** | ||
| * @license Angular v20.0.0-next.1 | ||
| * @license Angular v20.0.0-next.2 | ||
| * (c) 2010-2025 Google LLC. https://angular.io/ | ||
@@ -7,33 +7,58 @@ * License: MIT | ||
| import { Injector, Type, Version } from '@angular/core'; | ||
| import { Observable, Subscription } from 'rxjs'; | ||
| import { Injector } from '@angular/core'; | ||
| import { Observable } from 'rxjs'; | ||
| import { Subscription } from 'rxjs'; | ||
| import { Type } from '@angular/core'; | ||
| import { Version } from '@angular/core'; | ||
| /** | ||
| * @description Creates a custom element class based on an Angular component. | ||
| * Interface for the events emitted through the NgElementStrategy. | ||
| * | ||
| * Builds a class that encapsulates the functionality of the provided component and | ||
| * uses the configuration information to provide more context to the class. | ||
| * Takes the component factory's inputs and outputs to convert them to the proper | ||
| * custom element API and add hooks to input changes. | ||
| * @publicApi | ||
| */ | ||
| interface NgElementStrategyEvent { | ||
| name: string; | ||
| value: any; | ||
| } | ||
| /** | ||
| * Underlying strategy used by the NgElement to create/destroy the component and react to input | ||
| * changes. | ||
| * | ||
| * The configuration's injector is the initial injector set on the class, | ||
| * and used by default for each created instance.This behavior can be overridden with the | ||
| * static property to affect all newly created instances, or as a constructor argument for | ||
| * one-off creations. | ||
| * @publicApi | ||
| */ | ||
| interface NgElementStrategy { | ||
| events: Observable<NgElementStrategyEvent>; | ||
| connect(element: HTMLElement): void; | ||
| disconnect(): void; | ||
| getInputValue(propName: string): any; | ||
| setInputValue(propName: string, value: string, transform?: (value: any) => any): void; | ||
| } | ||
| /** | ||
| * Factory used to create new strategies for each NgElement instance. | ||
| * | ||
| * @publicApi | ||
| */ | ||
| interface NgElementStrategyFactory { | ||
| /** Creates a new instance to be used for an NgElement. */ | ||
| create(injector: Injector): NgElementStrategy; | ||
| } | ||
| /** | ||
| * Prototype for a class constructor based on an Angular component | ||
| * that can be used for custom element registration. Implemented and returned | ||
| * by the {@link createCustomElement createCustomElement() function}. | ||
| * | ||
| * @see [Angular Elements Overview](guide/elements "Turning Angular components into custom elements") | ||
| * | ||
| * @param component The component to transform. | ||
| * @param config A configuration that provides initialization information to the created class. | ||
| * @returns The custom-element construction class, which can be registered with | ||
| * a browser's `CustomElementRegistry`. | ||
| * | ||
| * @publicApi | ||
| */ | ||
| export declare function createCustomElement<P>(component: Type<any>, config: NgElementConfig): NgElementConstructor<P>; | ||
| interface NgElementConstructor<P> { | ||
| /** | ||
| * An array of observed attribute names for the custom element, | ||
| * derived by transforming input property names from the source component. | ||
| */ | ||
| readonly observedAttributes: string[]; | ||
| /** | ||
| * Initializes a constructor instance. | ||
| * @param injector If provided, overrides the configured injector. | ||
| */ | ||
| new (injector?: Injector): NgElement & WithProperties<P>; | ||
| } | ||
| /** | ||
@@ -44,3 +69,3 @@ * Implements the functionality needed for a custom element. | ||
| */ | ||
| export declare abstract class NgElement extends HTMLElement { | ||
| declare abstract class NgElement extends HTMLElement { | ||
| /** | ||
@@ -74,4 +99,13 @@ * The strategy that controls how a component is transformed in a custom element. | ||
| } | ||
| /** | ||
| * Additional type information that can be added to the NgElement class, | ||
| * for properties that are added based | ||
| * on the inputs and methods of the underlying component. | ||
| * | ||
| * @publicApi | ||
| */ | ||
| type WithProperties<P> = { | ||
| [property in keyof P]: P[property]; | ||
| }; | ||
| /** | ||
| * A configuration that initializes an NgElementConstructor with the | ||
@@ -83,3 +117,3 @@ * dependencies and strategy it needs to transform a component into | ||
| */ | ||
| export declare interface NgElementConfig { | ||
| interface NgElementConfig { | ||
| /** | ||
@@ -95,58 +129,25 @@ * The injector to use for retrieving the component's factory. | ||
| } | ||
| /** | ||
| * Prototype for a class constructor based on an Angular component | ||
| * that can be used for custom element registration. Implemented and returned | ||
| * by the {@link createCustomElement createCustomElement() function}. | ||
| * @description Creates a custom element class based on an Angular component. | ||
| * | ||
| * @see [Angular Elements Overview](guide/elements "Turning Angular components into custom elements") | ||
| * Builds a class that encapsulates the functionality of the provided component and | ||
| * uses the configuration information to provide more context to the class. | ||
| * Takes the component factory's inputs and outputs to convert them to the proper | ||
| * custom element API and add hooks to input changes. | ||
| * | ||
| * @publicApi | ||
| */ | ||
| export declare interface NgElementConstructor<P> { | ||
| /** | ||
| * An array of observed attribute names for the custom element, | ||
| * derived by transforming input property names from the source component. | ||
| */ | ||
| readonly observedAttributes: string[]; | ||
| /** | ||
| * Initializes a constructor instance. | ||
| * @param injector If provided, overrides the configured injector. | ||
| */ | ||
| new (injector?: Injector): NgElement & WithProperties<P>; | ||
| } | ||
| /** | ||
| * Underlying strategy used by the NgElement to create/destroy the component and react to input | ||
| * changes. | ||
| * The configuration's injector is the initial injector set on the class, | ||
| * and used by default for each created instance.This behavior can be overridden with the | ||
| * static property to affect all newly created instances, or as a constructor argument for | ||
| * one-off creations. | ||
| * | ||
| * @publicApi | ||
| */ | ||
| export declare interface NgElementStrategy { | ||
| events: Observable<NgElementStrategyEvent>; | ||
| connect(element: HTMLElement): void; | ||
| disconnect(): void; | ||
| getInputValue(propName: string): any; | ||
| setInputValue(propName: string, value: string, transform?: (value: any) => any): void; | ||
| } | ||
| /** | ||
| * Interface for the events emitted through the NgElementStrategy. | ||
| * @see [Angular Elements Overview](guide/elements "Turning Angular components into custom elements") | ||
| * | ||
| * @publicApi | ||
| */ | ||
| export declare interface NgElementStrategyEvent { | ||
| name: string; | ||
| value: any; | ||
| } | ||
| /** | ||
| * Factory used to create new strategies for each NgElement instance. | ||
| * @param component The component to transform. | ||
| * @param config A configuration that provides initialization information to the created class. | ||
| * @returns The custom-element construction class, which can be registered with | ||
| * a browser's `CustomElementRegistry`. | ||
| * | ||
| * @publicApi | ||
| */ | ||
| export declare interface NgElementStrategyFactory { | ||
| /** Creates a new instance to be used for an NgElement. */ | ||
| create(injector: Injector): NgElementStrategy; | ||
| } | ||
| declare function createCustomElement<P>(component: Type<any>, config: NgElementConfig): NgElementConstructor<P>; | ||
@@ -156,15 +157,4 @@ /** | ||
| */ | ||
| export declare const VERSION: Version; | ||
| declare const VERSION: Version; | ||
| /** | ||
| * Additional type information that can be added to the NgElement class, | ||
| * for properties that are added based | ||
| * on the inputs and methods of the underlying component. | ||
| * | ||
| * @publicApi | ||
| */ | ||
| export declare type WithProperties<P> = { | ||
| [property in keyof P]: P[property]; | ||
| }; | ||
| export { } | ||
| export { NgElement, type NgElementConfig, type NgElementConstructor, type NgElementStrategy, type NgElementStrategyEvent, type NgElementStrategyFactory, VERSION, type WithProperties, createCustomElement }; |
| { | ||
| "name": "@angular/elements", | ||
| "version": "20.0.0-next.1", | ||
| "version": "20.0.0-next.2", | ||
| "description": "Angular - library for using Angular Components as Custom Elements", | ||
@@ -14,3 +14,3 @@ "author": "angular", | ||
| "peerDependencies": { | ||
| "@angular/core": "20.0.0-next.1", | ||
| "@angular/core": "20.0.0-next.2", | ||
| "rxjs": "^6.5.3 || ^7.4.0" | ||
@@ -17,0 +17,0 @@ }, |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
No alert changes
Worsened metrics
- Total package byte prevSize
58659
-5.39%- Lines of code
558
-4.94%No dependency changes