Files
breadcrumb-the-shire/.agents/skills/core-guardrails/references/boundaries-ui.md
fs 4dd6d451f6 refactor: relocate agent-system/ to .agents/ with 7-role workflow restructure
Moves the agent workflow system from agent-system/ to .agents/ (dotfile convention).
Restructured from 5-role to 7-role pipeline: adds Analyst and splits Reviewer into
Code Reviewer + Security Reviewer. Removes all old workflow run artifacts.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-19 18:23:04 +01:00

3.4 KiB

UI Boundaries (MUST / MUST NOT)

Listen-Standard

  1. MUST Listen ueber initStandardListPage(...) initialisieren.
  2. MUST Filter-Toolbar ueber zentrale Helper/Partials rendern.
  3. MUST aktive Chips/Drawer-Verhalten ueber Standard-Contracts laufen lassen.
  4. MUST NOT direkt gridFiltersFromSchema(...) oder initListFilterExperience(...) in Listen-Templates verwenden.
  5. MUST NOT Legacy-Filter-Toggle-Markup (data-toolbar-toggle, data-filter-overflow, data-filter-toggle) neu einbauen.
  6. MUST rowInteraction-Standard fuer Listen mit Row-Navigation beibehalten (sichtbare Action-Spalte + Enter + Doppelklick-Fallback).
  7. MUST pageSize-Standard beibehalten (10/25/50/100, Toolbar rechts, URL > localStorage > default).

Detailseiten-Standard

  1. MUST Hauptformular mit data-standard-detail-form="1" markieren.
  2. MUST Unsaved/Shortcut/Dirty-State ueber initStandardDetailPage(...) nutzen.
  3. MUST Detail-Aktionen ueber Action-Policy-Contract (data-detail-action-policy, data-detail-action-kind, data-detail-confirm-message) steuern.
  4. MUST NOT inline confirm(...) (onclick / onsubmit) auf standardisierten Detailseiten nutzen.

Confirm + Telemetry Standard

  1. MUST Confirm-Dialoge zentral ueber den globalen Confirm-Service abwickeln.
  2. MUST NOT window.confirm(...) in App-JS oder inline HTML-Handlern verwenden.
  3. MUST relevante Frontend-Warnpfade zentral ueber Frontend-Telemetrie erfassen.
  4. MUST NOT relevante UX-/Fehlerpfade nur als Console-Warnung implementieren.

Frontend Page-Module Hard Cut

  1. MUST Seiteninitialisierung ueber dedizierte Module unter web/js/pages/* umsetzen.
  2. MUST Page-Config ueber script[type="application/json"] + readPageConfig(...) bereitstellen/lesen.
  3. MUST alle JS-src in pages/** und templates/** ueber assetVersion('...js...') laden.
  4. MUST NOT inline <script type="module">...</script> in pages/** oder templates/** verwenden.

Component Lifecycle Runtime

  1. MUST migrierte Komponenten ueber init(root, config) + destroy() standardisieren.
  2. MUST NOT migrierte Komponenten per DOMContentLoaded/Module-Sideeffect selbst auto-initialisieren.
  3. MUST Listener, Timer und Observer, die in init(...) entstehen, in destroy() wieder abbauen.
  4. MUST Runtime-Konfiguration ueber Page-Config (readPageConfig(...)) beziehen, keine verteilten Ad-hoc-Globals.
  5. MUST host-gebundene UI-Komponenten ueber explizite data-app-component-Hosts im Markup binden.
  6. Global-Utilities ohne natuerliches Host-Element MAY via Runtime scope: 'global' registriert werden, MUESSEN aber denselben Lifecycle-Contract inkl. destroy() einhalten.

Shared Partials

  1. MUST Listen-Titlebar ueber templates/partials/app-list-titlebar.phtml rendern.
  2. MUST List-Tabs ueber templates/partials/app-list-tabs.phtml rendern.
  3. MUST Purge-Action ueber templates/partials/app-list-purge-action.phtml rendern.
  4. MUST Detail-Validation-Summary ueber templates/partials/app-details-validation-summary.phtml rendern.

RBAC in Templates

  1. MUST UI-Capabilities nur ueber $viewAuth lesen.
  2. MUST NOT can('...') in Templates verwenden.

CSS Boundaries

  1. MUST Styles moeglichst lokal in web/css/components, web/css/layout oder web/css/pages halten.
  2. MUST NOT globale unscoped Overrides ohne klaren Scope einfuehren.
  3. MUST Vendor-Overrides nur in web/css/vendor-overrides/** pflegen.
  4. MUST bestehende CSS-Variablen bevorzugen statt neue Inline-Farbwerte zu verteilen.