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>

src/app/organisms/login-form/login-form.component.ts

@@ -0,0 +1,35 @@
+import { Component, output } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+import { FormFieldComponent } from '../../molecules/form-field/form-field.component';
+import { TextInputComponent } from '../../atoms/text-input/text-input.component';
+import { ButtonComponent } from '../../atoms/button/button.component';
+import { HeadingComponent } from '../../atoms/heading/heading.component';
+
+/** Organism: DigiD-style mock login. No real auth — just composes atoms/molecules. */
+@Component({
+  selector: 'app-login-form',
+  imports: [FormsModule, FormFieldComponent, TextInputComponent, ButtonComponent, HeadingComponent],
+  template: `
+    <form (ngSubmit)="submit.emit()" style="max-width:24rem">
+      <app-heading [level]="1">Inloggen</app-heading>
+      <p class="rhc-paragraph">Log in op uw persoonlijke BIG-register omgeving.</p>
+
+      <app-form-field label="BSN" fieldId="bsn" description="9 cijfers (demo: vul iets in)">
+        <app-text-input inputId="bsn" [(ngModel)]="bsn" name="bsn" placeholder="123456789" />
+      </app-form-field>
+
+      <app-form-field label="Wachtwoord" fieldId="pw">
+        <app-text-input inputId="pw" type="password" [(ngModel)]="password" name="pw" />
+      </app-form-field>
+
+      <div style="margin-top:1rem">
+        <app-button type="submit" variant="primary">Inloggen met DigiD</app-button>
+      </div>
+    </form>
+  `,
+})
+export class LoginFormComponent {
+  bsn = '';
+  password = '';
+  submit = output<void>();
+}