Files
atomic-design-poc/src/app/molecules/data-row/data-row.component.ts
Claude 033d6f0317 Atomic-design POC: BIG-register self-service portal (Angular + Rijkshuisstijl)
Atoms/molecules/organisms/templates/pages composing the NL Design System
(Utrecht) CSS themed Rijkshuisstijl via @rijkshuisstijl-community tokens.
Login -> dashboard -> registration detail, mock JSON over HttpClient, Storybook
organized by atomic layer.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-06-25 14:23:11 +02:00

18 lines
561 B
TypeScript

import { Component, input } from '@angular/core';
/** Molecule: one key/value row inside an RHC data-summary.
Wrap several of these in .rhc-data-summary (see registration-summary). */
@Component({
selector: 'app-data-row',
template: `
<div class="rhc-data-summary__item">
<dt class="rhc-data-summary__item-key">{{ key() }}</dt>
<dd class="rhc-data-summary__item-value"><ng-content>{{ value() }}</ng-content></dd>
</div>
`,
})
export class DataRowComponent {
key = input.required<string>();
value = input<string | null>('');
}