From a15410b7f4ac9f5596e95937e9858fa986e12f1b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mathias=20Gla=CC=88ser?= <mathias.glaeser@beaufort.ch>
Date: Thu, 4 Jun 2026 18:24:09 +0200
Subject: [PATCH] Add search field component preview

---
 components/data-display.html | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/components/data-display.html b/components/data-display.html
index 41495f4..185ce1a 100644
--- a/components/data-display.html
+++ b/components/data-display.html
@@ -72,6 +72,27 @@
 
   </section>
 
+  <!-- Component: Suchfeld -->
+  <section id="component-search-field">
+
+    <p class="sg-preview-label">Component: Suchfeld</p>
+
+    <div class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue sg-large-table__title-segment" data-component="search-field" aria-label="Suchfeld">
+      <div class="sg-strong">Suchfeld</div>
+      <div class="sg-large-table__search">
+        <label class="sg-large-table__search-label" for="search-field-preview">Suchfeld</label>
+        <input
+          class="sg-large-table__search-input"
+          id="search-field-preview"
+          type="search"
+          placeholder="Tabelle durchsuchen"
+          aria-label="Tabelle durchsuchen"
+        >
+      </div>
+    </div>
+
+  </section>
+
   <!-- Component: Large Table -->
   <section id="component-large-table">