@echelon-foundry/design-system 0.2.0 → 0.3.0-main.216.1

package/dist/patterns/scroll-progress.html

@@ -0,0 +1,6 @@
+<div class="ef-scroll-progress" aria-hidden="true"></div>
+<article class="ef-stack">
+  <h2>Release notes</h2>
+  <p>The reading-progress bar above is a decorative projection of the page's scroll position. It adds no lag, triggers nothing, and is absent where scroll timelines are unsupported or reduced motion is requested.</p>
+  <p>The scrollbar and the headings remain the authoritative way to know where you are in the document.</p>
+</article>

package/dist/patterns/section-heading.html

@@ -0,0 +1,12 @@
+<div class="ef-site">
+  <section class="ef-section" aria-labelledby="services-title">
+    <header class="ef-section-heading">
+      <div class="ef-section-heading__text">
+        <p class="ef-eyebrow">Service lines</p>
+        <h2 id="services-title">Name the section in plain language</h2>
+        <p>An optional sentence frames what follows and why it matters.</p>
+      </div>
+      <div class="ef-section-heading__aside"><a class="ef-button" href="#services">Explore the services</a></div>
+    </header>
+  </section>
+</div>

package/dist/patterns/security-blockers.html

@@ -0,0 +1,3 @@
+<section class="ef-security-blockers" aria-labelledby="security-blockers-title"><h2 id="security-blockers-title">Release blockers</h2>
+<ul><li data-kind="violation"><a href="#SEC-INV-014">SEC-INV-014</a><span>Authorization invariant violated.</span></li>
+<li data-kind="unknown"><a href="#SEC-UNK-003">SEC-UNK-003</a><span>Runtime egress behavior has not been established.</span></li></ul></section>

package/dist/patterns/security-evidence-age.html

@@ -0,0 +1 @@
+<section class="ef-evidence-age" aria-labelledby="evidence-age-title"><h2 id="evidence-age-title">Evidence freshness</h2><ul><li data-state="current"><a href="#SEC-EVD-042">SEC-EVD-042</a><span>Current · observed 24 Sep 2026</span></li><li data-state="stale"><a href="#SEC-EVD-031">SEC-EVD-031</a><span>Stale · invalidated by boundary change</span></li></ul></section>

package/dist/patterns/security-evidence-chain.html

@@ -0,0 +1,2 @@
+<figure class="ef-security-evidence-chain" aria-labelledby="evidence-chain-title"><figcaption id="evidence-chain-title">Evidence chain for SEC-INV-014</figcaption>
+<ol><li><strong>Source</strong><span>Aegis</span></li><li><strong>Observation</strong><a href="#SEC-EVD-042">SEC-EVD-042</a></li><li><strong>Invariant</strong><a href="#SEC-INV-014">SEC-INV-014</a></li><li><strong>State</strong><span>Violated</span></li></ol></figure>

package/dist/patterns/security-exception.html

@@ -0,0 +1,2 @@
+<article class="ef-security-exception" id="SEC-EXC-002"><header><p>Security exception</p><h3>SEC-EXC-002</h3></header>
+<dl><div><dt>Status</dt><dd>Active</dd></div><div><dt>Approver</dt><dd>Security owner</dd></div><div><dt>Expires</dt><dd><time datetime="2026-10-01">1 Oct 2026</time></dd></div><div><dt>Compensating control</dt><dd>Restricted capability and enhanced audit logging.</dd></div></dl></article>

package/dist/patterns/security-invariant-result.html

@@ -0,0 +1 @@
+<article class="ef-invariant-result" id="SEC-INV-014" data-state="violated"><header><p>Security invariant</p><h3>SEC-INV-014</h3><strong>Violated</strong></header><p>Privileged actions require explicit authorization at the effect boundary.</p><dl><div><dt>Threats</dt><dd><a href="#SEC-THR-004">SEC-THR-004</a></dd></div><div><dt>Evidence</dt><dd><a href="#SEC-EVD-042">SEC-EVD-042</a></dd></div><div><dt>Independent verification</dt><dd>Required</dd></div></dl></article>

package/dist/patterns/security-posture.html

@@ -0,0 +1,22 @@
+<section class="ef-security-posture" data-posture="blocked" aria-labelledby="security-posture-title">
+  <header class="ef-security-posture__header">
+    <div>
+      <p class="ef-security-posture__eyebrow">Tutela release posture</p>
+      <h2 id="security-posture-title">Blocked</h2>
+    </div>
+    <span class="ef-status-lozenge" data-state="danger" aria-label="Release posture: blocked">Blocked</span>
+  </header>
+  <dl class="ef-security-posture__meta">
+    <div><dt>Subject</dt><dd><code>0123456789abcdef</code></dd></div>
+    <div><dt>Scope</dt><dd>Authentication, authorization, agent tools</dd></div>
+    <div><dt>Assessed</dt><dd><time datetime="2026-09-24T16:00:00Z">24 Sep 2026</time></dd></div>
+  </dl>
+  <div class="ef-security-posture__blockers" role="status">
+    <strong>2 release blockers</strong>
+    <ul>
+      <li><a href="#SEC-INV-002">SEC-INV-002</a>: authorization evidence is unknown.</li>
+      <li><a href="#SEC-UNK-001">SEC-UNK-001</a>: imported-organization behavior is not established.</li>
+    </ul>
+  </div>
+  <p class="ef-security-posture__qualification">This posture describes the defined assessment scope and evidence. It is not a general claim that the system is secure.</p>
+</section>

package/dist/patterns/security-state-matrix.html

@@ -0,0 +1,5 @@
+<section class="ef-security-state-matrix" aria-labelledby="security-state-title">
+<h2 id="security-state-title">Security evidence state</h2><dl class="ef-security-state-matrix__grid">
+<div data-state="verified"><dt>Verified</dt><dd>18</dd></div><div data-state="violated"><dt>Violated</dt><dd>1</dd></div>
+<div data-state="unknown"><dt>Unknown</dt><dd>3</dd></div><div data-state="stale"><dt>Stale</dt><dd>2</dd></div><div data-state="na"><dt>N/A</dt><dd>4</dd></div>
+</dl></section>

package/dist/patterns/security-trend.html

@@ -0,0 +1 @@
+<section class="ef-security-trend" aria-labelledby="security-trend-title"><h2 id="security-trend-title">Security trend</h2><p>Compared with the previous assessed artifact.</p><ul><li data-direction="regression"><strong>Regression</strong><span>Unknown security effects increased from 0 to 2.</span></li><li data-direction="improvement"><strong>Improvement</strong><span>Stale evidence decreased from 3 to 1.</span></li><li data-direction="unknown"><strong>No measurement</strong><span>Exception aging was not measured for the previous artifact.</span></li></ul></section>

package/dist/patterns/security-unknown.html

@@ -0,0 +1,2 @@
+<article class="ef-security-unknown" id="SEC-UNK-003"><header><p>Unknown security effect</p><h3>SEC-UNK-003</h3></header><p>Runtime egress behavior has not been established.</p>
+<dl><div><dt>Consequence</dt><dd>Release posture cannot be established for the network boundary.</dd></div><div><dt>Evidence needed</dt><dd>Observed egress policy test against the release artifact.</dd></div></dl></article>

package/dist/patterns/sidebar.html

@@ -0,0 +1,4 @@
+<section class="ef-sidebar" aria-label="Workspace">
+  <aside class="ef-sidebar__side"><nav aria-label="Workspace navigation"><a href="#overview" aria-current="page">Overview</a><a href="#evidence">Evidence</a></nav></aside>
+  <main class="ef-sidebar__content" id="overview"><h2>Overview</h2><p>The main region grows while the sidebar preserves a useful measure.</p></main>
+</section>

package/dist/patterns/site-footer.html

@@ -0,0 +1,12 @@
+<div class="ef-site">
+  <footer class="ef-site-footer" data-ef-tone="inverse">
+    <div class="ef-site-footer__inner">
+      <div class="ef-site-footer__main">
+        <div><p class="ef-eyebrow">Example / Product</p><p>Strategy, architecture, and delivery for consequential systems.</p></div>
+        <div class="ef-actions"><a class="ef-button" href="#contact">Schedule a working session</a></div>
+      </div>
+      <nav class="ef-site-footer__nav" aria-label="Footer"><ul><li><a href="#privacy">Privacy</a></li><li><a href="#source">Source</a></li></ul></nav>
+      <p class="ef-site-footer__note"><span>&copy; 2026 Example</span><span>Indianapolis, Indiana</span></p>
+    </div>
+  </footer>
+</div>

package/dist/patterns/site-header.html

@@ -0,0 +1,18 @@
+<div class="ef-site">
+  <header class="ef-site-header">
+    <div class="ef-site-header__inner">
+      <div class="ef-site-header__identity">
+        <a class="ef-site-header__brand" href="#top"><span class="ef-site-header__mark" aria-hidden="true">EX</span><span class="ef-site-header__name">Example / Product</span></a>
+        <p class="ef-site-header__tagline">Evidence-driven engineering systems</p>
+      </div>
+      <nav class="ef-site-nav" aria-label="Primary">
+        <ul class="ef-site-nav__list">
+          <li><a class="ef-site-nav__link" href="#top" aria-current="page">Overview</a></li>
+          <li><a class="ef-site-nav__link" href="#research">Research</a></li>
+          <li><a class="ef-site-nav__link" href="#docs">Documentation</a></li>
+          <li><a class="ef-site-nav__link" data-ef-variant="action" href="#contact">Get in touch</a></li>
+        </ul>
+      </nav>
+    </div>
+  </header>
+</div>

package/dist/patterns/spatial-canvas.html

@@ -0,0 +1,13 @@
+<section class="ef-spatial-canvas" aria-labelledby="canvas-title">
+  <header class="ef-spatial-canvas__header">
+    <div><h2 id="canvas-title">System map</h2><p class="ef-spatial-canvas__orientation">Viewport: services / billing</p></div>
+    <div class="ef-cluster" aria-label="Canvas controls"><button type="button">Zoom out</button><button type="button">Reset view</button><button type="button">Zoom in</button></div>
+  </header>
+  <div class="ef-spatial-canvas__viewport" tabindex="0" aria-label="Scrollable system map">
+    <div class="ef-spatial-canvas__surface">
+      <article class="ef-surface"><h3>Billing</h3><p>Selected node</p></article>
+      <article class="ef-surface"><h3>Chrona</h3><p>Time source</p></article>
+    </div>
+  </div>
+  <details class="ef-spatial-canvas__index"><summary>Objects in this view</summary><nav aria-label="Canvas objects"><a href="#billing">Billing</a><a href="#chrona">Chrona</a></nav></details>
+</section>

package/dist/patterns/spinner.html

@@ -0,0 +1,4 @@
+<p class="ef-spinner" role="status">
+  <span class="ef-spinner__indicator" aria-hidden="true"></span>
+  <span class="ef-spinner__label">Loading deployment history</span>
+</p>

package/dist/patterns/split-pane.html

@@ -0,0 +1,4 @@
+<section class="ef-split-pane" aria-label="Inspector workspace">
+  <main class="ef-split-pane__primary"><h2>Working surface</h2><p>The primary task remains first in source order.</p></main>
+  <aside class="ef-split-pane__secondary" aria-label="Inspector"><h3>Inspector</h3><p>Contextual properties for the current selection.</p></aside>
+</section>

package/dist/patterns/stack.html

@@ -0,0 +1,5 @@
+<section class="ef-stack" aria-label="Stack composition">
+  <header><h2>Section title</h2><p>Supporting context remains grouped with the heading.</p></header>
+  <article><h3>Primary content</h3><p>Stack owns only the vertical relationship between independent children.</p></article>
+  <footer><button type="button">Continue</button></footer>
+</section>

package/dist/patterns/state-survivability.html

@@ -0,0 +1,19 @@
+<section class="ef-state-survivability" aria-labelledby="state-survivability-title">
+  <h3 id="state-survivability-title">Authoritative state projection</h3>
+  <div class="ef-state-survivability__state">
+    <span class="ef-status-lozenge" data-state="unknown">Unknown</span>
+    <p>Outcome has not been confirmed. Reconcile before retrying.</p>
+  </div>
+  <div class="ef-state-survivability__state">
+    <span class="ef-status-lozenge" data-state="attention">Stale</span>
+    <p>The displayed evidence is older than the application freshness policy permits.</p>
+  </div>
+  <div class="ef-state-survivability__state">
+    <span class="ef-status-lozenge" data-state="attention">Partial</span>
+    <p>Only the stated scope is complete. Omitted scope remains unresolved.</p>
+  </div>
+  <div class="ef-state-survivability__state">
+    <span class="ef-status-lozenge" data-state="blocked">Unavailable</span>
+    <p>The application reports this capability is currently unavailable.</p>
+  </div>
+</section>

package/dist/patterns/steps.html

@@ -0,0 +1,8 @@
+<div class="ef-site">
+  <ol class="ef-steps" role="list" aria-label="Method">
+    <li>Understand the domain and its constraints.</li>
+    <li>Identify recurring symptom patterns.</li>
+    <li>Trace the causal mechanism.</li>
+    <li>Deliver treatment and prevention.</li>
+  </ol>
+</div>

package/dist/patterns/switcher.html

@@ -0,0 +1,4 @@
+<section class="ef-switcher" aria-label="Narrative and supporting material">
+  <article class="ef-switcher__primary"><h2>Primary narrative</h2><p>The main content owns most available width.</p></article>
+  <aside class="ef-switcher__secondary" aria-label="Supporting material"><h2>Supporting material</h2><p>Secondary content remains adjacent when space permits.</p></aside>
+</section>

package/dist/patterns/tooltip.html

@@ -0,0 +1,48 @@
+<div class="ef-stack">
+  <p class="ef-tooltip-context">
+    Retention period: 90 days
+    <span class="ef-tooltip">
+      <button class="ef-tooltip__trigger" type="button" popovertarget="tooltip-retention" interestfor="tooltip-retention">
+        <span aria-hidden="true">?</span>
+        <span class="ef-visually-hidden">About the retention period</span>
+      </button>
+      <span class="ef-tooltip__surface" id="tooltip-retention" popover>Events older than the retention period are deleted automatically. Export them first if you need a longer record.</span>
+    </span>
+  </p>
+
+  <div class="ef-field">
+    <div class="ef-cluster">
+      <label class="ef-field__label" for="tooltip-window">Maintenance window</label>
+      <span class="ef-tooltip">
+        <button class="ef-tooltip__trigger" type="button" popovertarget="tooltip-window-hint" interestfor="tooltip-window-hint">
+          <span aria-hidden="true">?</span>
+          <span class="ef-visually-hidden">How maintenance windows are applied</span>
+        </button>
+        <span class="ef-tooltip__surface" id="tooltip-window-hint" popover>Times use the service region's local time zone.</span>
+      </span>
+    </div>
+    <p class="ef-field__description" id="tooltip-window-description">Required. Changes are scheduled, never applied immediately.</p>
+    <input id="tooltip-window" name="window" type="text" aria-describedby="tooltip-window-description" placeholder="Sun 02:00–04:00">
+  </div>
+
+  <table>
+    <thead>
+      <tr>
+        <th scope="col">Service</th>
+        <th scope="col">
+          Error budget
+          <span class="ef-tooltip">
+            <button class="ef-tooltip__trigger" type="button" popovertarget="tooltip-budget" interestfor="tooltip-budget">
+              <span aria-hidden="true">?</span>
+              <span class="ef-visually-hidden">About error budget</span>
+            </button>
+            <span class="ef-tooltip__surface" id="tooltip-budget" popover>Share of allowed unavailability left in the current 30-day window.</span>
+          </span>
+        </th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr><td>Checkout</td><td>42% remaining</td></tr>
+    </tbody>
+  </table>
+</div>

package/dist/patterns/verification-frame.html

@@ -0,0 +1,22 @@
+<section class="ef-verification-frame" aria-labelledby="verification-title">
+  <header class="ef-verification-frame__recognize">
+    <span class="ef-component-kicker">Recognition</span>
+    <h2 id="verification-title">Ready for deliberate verification</h2>
+    <p>The application reports one consequential transition is available. Verify the evidence below before acting.</p>
+  </header>
+  <section class="ef-verification-frame__verify" aria-labelledby="verify-heading">
+    <h3 id="verify-heading">Verify</h3>
+    <dl class="ef-verification-frame__facts">
+      <div><dt>Record</dt><dd><span class="ef-identifier">INV-1042</span></dd></div>
+      <div><dt>Amount</dt><dd><span class="ef-critical-value" data-ef-verify="true">$10,001.00</span></dd></div>
+      <div><dt>Evidence</dt><dd>3 sources reviewed</dd></div>
+      <div><dt>Freshness</dt><dd>Checked 2 minutes ago</dd></div>
+    </dl>
+    <p><strong>Unresolved work:</strong> none reported for this transition.</p>
+  </section>
+  <footer class="ef-verification-frame__act">
+    <p>Actions shown here must come from current application or Ordo capabilities.</p>
+    <button type="button">Review sources</button>
+    <button type="button">Approve transition</button>
+  </footer>
+</section>

package/dist/patterns/workspace-shell.html

@@ -0,0 +1,6 @@
+<main class="ef-workspace-shell">
+  <header class="ef-workspace-shell__landmark"><h1>Workspace</h1><p role="status">Ready</p></header>
+  <nav class="ef-workspace-shell__navigation" aria-label="Workspace"><a href="#work" aria-current="page">Work</a><a href="#history">History</a></nav>
+  <section class="ef-workspace-shell__primary" id="work"><h2>Primary work</h2></section>
+  <aside class="ef-workspace-shell__inspector" aria-label="Inspector"><h2>Inspector</h2></aside>
+</main>