Skip to content
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions renderers/angular/src/lib/catalog/default.ts
Original file line number Diff line number Diff line change
Expand Up @@ -61,6 +61,7 @@ export const DEFAULT_CATALOG: Catalog = {
return [
inputBinding('url', () => properties.url),
inputBinding('usageHint', () => properties.usageHint),
inputBinding('altText', () => properties.altText),
];
},
},
Expand Down
4 changes: 4 additions & 0 deletions renderers/angular/src/lib/catalog/icon.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,10 @@ import * as Primitives from '@a2ui/web_core/types/primitives';

@Component({
selector: 'a2ui-icon',
host: {
'aria-hidden': 'true',
tabindex: '-1',
},
changeDetection: ChangeDetectionStrategy.Eager,
styles: `
:host {
Expand Down
8 changes: 7 additions & 1 deletion renderers/angular/src/lib/catalog/image.ts
Original file line number Diff line number Diff line change
Expand Up @@ -40,19 +40,25 @@ import { DynamicComponent } from '../rendering/dynamic-component';
`,
template: `
@let resolvedUrl = this.resolvedUrl();
@let resolvedAltText = this.resolvedAltText();

@if (resolvedUrl) {
<section [class]="classes()" [style]="theme.additionalStyles?.Image">
<img [src]="resolvedUrl" />
<img [src]="resolvedUrl" [alt]="resolvedAltText || ''" />
</section>
}
`,
})
export class Image extends DynamicComponent {
readonly url = input.required<Primitives.StringValue | null>();
readonly usageHint = input.required<Types.ResolvedImage['usageHint'] | null>();
readonly altText = input.required<Primitives.StringValue | null>();

protected readonly resolvedUrl = computed(() => this.resolvePrimitive(this.url()));
protected readonly resolvedAltText = computed(() => {
const raw = this.altText();
return raw ? this.resolvePrimitive(raw) : '';
});

protected classes = computed(() => {
const usageHint = this.usageHint();
Expand Down
1 change: 1 addition & 0 deletions renderers/web_core/src/v0_8/types/components.ts
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,7 @@ export interface Image {
| "largeFeature"
| "header";
fit?: "contain" | "cover" | "fill" | "none" | "scale-down";
altText: string;
}

export interface Icon {
Expand Down
Loading