Sync styleguide 2026.05.18.1

docs/styleguide/styles/21-patterns-options-row.css

@@ -51,6 +51,10 @@
   margin-left: auto;
 }
 
+.sg-options-row__left > .sg-search-field-row {
+  flex: 0 0 auto;
+}
+
 @media (max-width: 48rem) {
   .sg-options-row {
     flex-direction: column;
@@ -98,29 +102,8 @@
     min-width: 0;
   }
 
-.sg-options-row__left > .sg-input-single-line-wrap,
+  .sg-options-row__left > .sg-search-field-row {
-.sg-options-row__left > .sg-search-field-row {
+    flex: 0 0 auto;
-  flex-basis: 100%;
-  }
-
-  .sg-options-row .sg-search-field-input {
-    display: inline-flex;
-    align-items: stretch;
-  }
-
-  .sg-options-row .sg-search-field-input .sg-input-single-line {
-    padding-right: var(--interaction-padding-horizontal);
-  }
-
-  .sg-options-row .sg-search-field-input[data-has-value="true"] .sg-input-single-line {
-    border-radius: var(--radius-interaction) 0 0 var(--radius-interaction);
-  }
-
-  .sg-options-row .sg-search-field-input .sg-input-clear-button {
-    position: static;
-    flex: 0 0 var(--interaction-height);
-    height: auto;
-    border-radius: 0 var(--radius-interaction) var(--radius-interaction) 0;
   }
 
   .sg-options-row__left > .sg-input-single-line-wrap .sg-input-single-line,

public/assets/styleguide.upstream.css

@@ -2126,6 +2126,10 @@ section + section {
   margin-left: auto;
 }
 
+.sg-options-row__left > .sg-search-field-row {
+  flex: 0 0 auto;
+}
+
 @media (max-width: 48rem) {
   .sg-options-row {
     flex-direction: column;
@@ -2173,29 +2177,8 @@ section + section {
     min-width: 0;
   }
 
-.sg-options-row__left > .sg-input-single-line-wrap,
+  .sg-options-row__left > .sg-search-field-row {
-.sg-options-row__left > .sg-search-field-row {
+    flex: 0 0 auto;
-  flex-basis: 100%;
-  }
-
-  .sg-options-row .sg-search-field-input {
-    display: inline-flex;
-    align-items: stretch;
-  }
-
-  .sg-options-row .sg-search-field-input .sg-input-single-line {
-    padding-right: var(--interaction-padding-horizontal);
-  }
-
-  .sg-options-row .sg-search-field-input[data-has-value="true"] .sg-input-single-line {
-    border-radius: var(--radius-interaction) 0 0 var(--radius-interaction);
-  }
-
-  .sg-options-row .sg-search-field-input .sg-input-clear-button {
-    position: static;
-    flex: 0 0 var(--interaction-height);
-    height: auto;
-    border-radius: 0 var(--radius-interaction) var(--radius-interaction) 0;
   }
 
   .sg-options-row__left > .sg-input-single-line-wrap .sg-input-single-line,

public/assets/styleguide.upstream.meta.json

@@ -1,7 +1,7 @@
 {
   "styleguideVersion": "2026.05.18.1",
-  "styleguideCommit": "899af96",
+  "styleguideCommit": "8a7b6fa",
-  "syncedAtUtc": "2026-06-16T09:30:29Z",
+  "syncedAtUtc": "2026-06-16T12:22:28Z",
   "sourceRepo": "/Users/mathias/Documents/Dokumente Chouchou/Codebases/Styleguide",
   "mirroredDocsPath": "docs/styleguide"
 }

public/assets/styles.css

@@ -2126,6 +2126,10 @@ section + section {
   margin-left: auto;
 }
 
+.sg-options-row__left > .sg-search-field-row {
+  flex: 0 0 auto;
+}
+
 @media (max-width: 48rem) {
   .sg-options-row {
     flex-direction: column;
@@ -2173,29 +2177,8 @@ section + section {
     min-width: 0;
   }
 
-.sg-options-row__left > .sg-input-single-line-wrap,
+  .sg-options-row__left > .sg-search-field-row {
-.sg-options-row__left > .sg-search-field-row {
+    flex: 0 0 auto;
-  flex-basis: 100%;
-  }
-
-  .sg-options-row .sg-search-field-input {
-    display: inline-flex;
-    align-items: stretch;
-  }
-
-  .sg-options-row .sg-search-field-input .sg-input-single-line {
-    padding-right: var(--interaction-padding-horizontal);
-  }
-
-  .sg-options-row .sg-search-field-input[data-has-value="true"] .sg-input-single-line {
-    border-radius: var(--radius-interaction) 0 0 var(--radius-interaction);
-  }
-
-  .sg-options-row .sg-search-field-input .sg-input-clear-button {
-    position: static;
-    flex: 0 0 var(--interaction-height);
-    height: auto;
-    border-radius: 0 var(--radius-interaction) var(--radius-interaction) 0;
   }
 
   .sg-options-row__left > .sg-input-single-line-wrap .sg-input-single-line,