@flytedan/flytebot-design-system 0.51.5 → 0.51.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flytedan/flytebot-design-system",
-  "version": "0.51.5",
+  "version": "0.51.6",
   "description": "flytedesk Design System — shared component library, tokens, and business-logic kits for flytedesk apps.",
   "type": "module",
   "license": "UNLICENSED",

package/styles/components.css

@@ -3066,11 +3066,13 @@
   display: none;
 }
 /* The Filter button, and Clear all right after it. Beside each other while the main column has
-   room for both and a chip; below 30rem (the two, a gap and one chip at its max) Clear all stacks
-   under the button, still in this column and never on a row of the chips' own. The column is
-   exactly as wide as what is in it either way, so the chips always start one gap from it. The
-   switch is a container query on the main column, not a wrapping flex row: a wrapped row takes
-   its cap as its width and leaves a hole beside the button. */
+   room for both and a chip; when the actions beside the main column leave it under 30rem (the two,
+   a gap and one chip at its max) Clear all stacks under the button, still in this column and
+   never on a row of the chips' own. The column is exactly as wide as what is in it either way, so
+   the chips always start one gap from it. The switch is a container query on the main column, not
+   a wrapping flex row: a wrapped row takes its cap as its width and leaves a hole beside the
+   button. A bar under 30rem wide is the phone layout below, which puts Clear all beside the
+   button again. */
 .fd-filterbar-main {
   container-type: inline-size;
 }
@@ -3080,7 +3082,7 @@
   align-items: center;
   gap: var(--s-sm) var(--s-md);
 }
-@container (max-width: 30rem) {
+@container (width < 30rem) {
   .fd-filterbar-trigger {
     flex-direction: column;
     align-items: flex-start;
@@ -3127,11 +3129,16 @@
   .fd-filterbar-trigger {
     flex-direction: row;
     flex-wrap: wrap;
+    align-items: center;
   }
   .fd-filterbar-chips {
     flex: none;
     min-height: 0;
   }
+  /* No chips, no row: an empty chips area would still add a row gap under the button. */
+  .fd-filterbar-chips:empty {
+    display: none;
+  }
 }
 /* MP-282: seen live at 375px — a chip whose value is long (a full campaign name) painted
    637px wide inside a 297px-wide bar instead of respecting it, because .fd-tag is `flex: