@flytedan/flytebot-design-system 0.12.0 → 0.12.3

package/package.json

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

package/styles/components.css

@@ -263,6 +263,9 @@
   border-radius: var(--r-md);
   padding: 3px;
   gap: 3px;
+  /* Options can't shrink below their longest word; wrap onto a second row rather
+     than letting a clipping ancestor (Card, Collapsible) cut the last one off. */
+  flex-wrap: wrap;
 }
 .fd-seg button {
   border: 0;
@@ -823,6 +826,11 @@
   font-weight: var(--w-semibold);
   white-space: nowrap;
   border: 1px solid transparent;
+  /* One line, capped at the container: a long label ellipsizes instead of being
+     clipped out of sight. Callers with unbounded content pass a `title`. */
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 .fd-badge-neutral {
   background: var(--surface-3);
@@ -1273,7 +1281,9 @@
   border: 1px solid var(--warn-border);
   font-size: var(--body-sm-size);
   font-weight: var(--w-bold);
-  white-space: nowrap;
+  /* Wraps at word boundaries and never exceeds its container: the bypassed veil's
+     bar has no clipping ancestor, so a one-line long label would widen the shell. */
+  max-width: 100%;
 }
 .fd-soon-badge .ph {
   font-size: 14px;
@@ -2318,6 +2328,8 @@
   border-top: 1px solid var(--border);
   background: var(--surface-2);
 }
+/* z-index below is a resting default only — Drawer.tsx sets it (and its scrim's) inline
+   via useOverlayLayer(DRAWER_BASE), which wins over this rule (see Popover.tsx). */
 .fd-drawer {
   position: fixed;
   top: 0;
@@ -2341,9 +2353,11 @@
   min-width: 0;
 }
 /* Portaled to document.body and placed by Tooltip.tsx (fixed, anchored geometry), so no
-   overflow: hidden ancestor of the trigger can clip it. It sits above popovers (140) so a
-   tip on something inside a popover is still visible. Short labels stay on one line
-   (max-content); a sentence wraps at a readable measure instead of running off-screen. */
+   overflow: hidden ancestor of the trigger can clip it. Short labels stay on one line
+   (max-content); a sentence wraps at a readable measure instead of running off-screen.
+   The z-index below is a resting default only — Tooltip.tsx always sets it inline via
+   useOverlayLayer(TOOLTIP_BASE), which wins over this rule and is what actually keeps a
+   tip above whatever popover its trigger happens to be nested inside (see Popover.tsx). */
 .fd-tooltip {
   position: fixed;
   z-index: 150;