feat(WP-67): merge behandelportal into this repo as a monorepo

Restructures into apps/ssp + apps/behandelportal (two Angular projects)
plus libs/shared + libs/beheer (cross-app libraries), replacing WP-61's
separate sibling repo. That split had already produced real drift: a
hand-vendored copy of the backend's OpenAPI doc, a shared/ui+layout tree
forked and silently diverging (7 files), and beheer + the styles.scss
token bridge duplicated byte-for-byte across both repos.

- git mv the SSP's src/app/* into apps/ssp/; fold shared/, beheer/,
  environments/, the Storybook docs/*.mdx, and styles.scss into
  libs/shared + libs/beheer (all confirmed identical between the two
  repos before merging). auth stays deliberately duplicated per
  ADR-0002 (actor-specific, expected to diverge) - amended there.
- One generated API client (libs/shared), no more vendored swagger.json.
- .dependency-cruiser split into a base factory + one config per app,
  and Storybook into .storybook-ssp/.storybook-behandelportal - both
  forced by the @auth/* alias resolving to different directories per app.
- SiteHeaderComponent/ShellComponent gained HEADER_NAV_ITEMS/
  HEADER_ADMIN_LINKS/DEBUG_PANEL injection tokens so each app supplies
  its own nav/admin-links/dev-panel instead of one being hardcoded.
- CLAUDE.md, ARCHITECTURE.md, dependencies.md, and ADR-0002 updated;
  WP-67 backlog entry documents the full decision trail.

npm run ci green (lint, dep:check x2, 360 tests across ssp/
behandelportal/shared/beheer, both localized builds, backend tests,
snippet + api-client drift); both dev servers, both Storybook
instances, and docker compose verified working.

The old sibling repo (/home/eho/repos/behandelportal) is left
untouched, not deleted.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

libs/shared/src/ui/form-field/form-field.component.ts

@@ -0,0 +1,35 @@
+import { Component, booleanAttribute, input } from '@angular/core';
+
+/** Molecule: form field = label + projected control + optional error/description,
+    in the CIBG Huisstijl horizontal `form-group row` layout (label `col-md-4`,
+    control `col-md-8`). The required asterisk comes from
+    `.form-group.required>.col-form-label::after` — no separate "(verplicht)" text.
+    Reused by the login form, the change-request form, and every wizard step. */
+@Component({
+  selector: 'app-form-field',
+  template: `
+    <div class="form-group row" [class.required]="required()">
+      <label class="col-md-4 col-form-label" [id]="fieldId() + '-label'" [for]="fieldId()">{{
+        label()
+      }}</label>
+      <div class="col-md-8 col-control">
+        @if (description()) {
+          <div class="form-text" [id]="fieldId() + '-desc'">{{ description() }}</div>
+        }
+        <ng-content />
+        @if (error()) {
+          <div [id]="fieldId() + '-error'" role="alert">
+            <span class="errortext">{{ error() }}</span>
+          </div>
+        }
+      </div>
+    </div>
+  `,
+})
+export class FormFieldComponent {
+  label = input.required<string>();
+  fieldId = input.required<string>();
+  description = input<string>();
+  error = input<string>();
+  required = input(false, { transform: booleanAttribute });
+}

libs/shared/src/ui/form-field/form-field.stories.ts

@@ -0,0 +1,61 @@
+import type { Meta, StoryObj } from '@storybook/angular';
+import { moduleMetadata } from '@storybook/angular';
+import { expect, within } from 'storybook/test';
+import { FormFieldComponent } from './form-field.component';
+import { TextInputComponent } from '@shared/ui/text-input/text-input.component';
+
+const meta: Meta<FormFieldComponent> = {
+  title: 'Design System/Molecules/Form Field',
+  component: FormFieldComponent,
+  decorators: [moduleMetadata({ imports: [TextInputComponent] })],
+  render: (args) => ({
+    props: args,
+    // form-horizontal + .row context, same as every real caller (wizard-shell, login-form, …).
+    template: `
+      <form class="form-horizontal">
+        <app-form-field [label]="label" [fieldId]="fieldId" [description]="description" [error]="error" [required]="required">
+          <app-text-input [inputId]="fieldId" [hasDescription]="!!description" [invalid]="!!error" placeholder="Vul in" />
+        </app-form-field>
+      </form>`,
+  }),
+};
+export default meta;
+type Story = StoryObj<FormFieldComponent>;
+
+export const Default: Story = {
+  args: { label: 'BSN', fieldId: 'bsn', description: '9 cijfers', required: true },
+  // Composition contract: fieldId must equal the input's id — enforced here, not by DI
+  // (see WP-16). Catches drift in the description→aria-describedby wiring.
+  play: async ({ canvasElement }) => {
+    const canvas = within(canvasElement);
+    const input = canvas.getByRole('textbox');
+    await expect(input).toHaveAttribute('aria-describedby', 'bsn-desc');
+  },
+};
+export const WithError: Story = {
+  args: {
+    label: 'Straat en huisnummer',
+    fieldId: 'street',
+    error: 'Dit veld is verplicht.',
+    required: true,
+  },
+  play: async ({ canvasElement }) => {
+    const canvas = within(canvasElement);
+    const input = canvas.getByRole('textbox');
+    await expect(input).toHaveAttribute('aria-describedby', 'street-error');
+  },
+};
+export const WithDescriptionAndError: Story = {
+  args: {
+    label: 'BSN',
+    fieldId: 'bsn',
+    description: '9 cijfers',
+    error: 'Ongeldig BSN.',
+    required: true,
+  },
+  play: async ({ canvasElement }) => {
+    const canvas = within(canvasElement);
+    const input = canvas.getByRole('textbox');
+    await expect(input).toHaveAttribute('aria-describedby', 'bsn-desc bsn-error');
+  },
+};