@flytedan/flytebot-design-system 0.55.1 → 0.55.3

package/package.json

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

package/styles/components.css

@@ -2629,6 +2629,7 @@
 }
 .fd-modal-body {
   padding: 0 24px 22px;
+  position: relative; /* MP-298: contains absolutely positioned sr content, see .fd-scroll */
   overflow: auto;
 }
 .fd-modal-foot {
@@ -2888,6 +2889,7 @@
 .fd-pop-body {
   flex: 1 1 auto;
   min-height: 0;
+  position: relative; /* MP-298: contains absolutely positioned sr content, see .fd-scroll */
   overflow-x: hidden;
   overflow-y: auto;
   overscroll-behavior: contain;
@@ -3585,6 +3587,9 @@
 }
 .fd-scroll {
   flex: 1;
+  /* MP-298: positioned so an absolutely positioned child (a chart's `.fd-sr` data table) is
+     contained and clipped by this scroller instead of stretching the page behind it. */
+  position: relative;
   overflow: auto;
   padding: var(--gutter-lg);
 }
@@ -7403,19 +7408,11 @@ button.fd-erow-metric:focus-visible {
   border: 1.5px solid var(--surface);
   animation: fd-badge-pop 260ms var(--ease) both;
 }
-/* z-index is set inline by ModeSwitch.tsx via useInlinePanel, from useLayerZIndex (kits/layerStack.tsx). */
+/* The mode panel is a Popover surface (.fd-pop) opened through InlinePanelSurface, which owns its
+   position, width and z-index. This is only its own look. */
 .fd-mode-pop {
-  position: absolute;
-  top: calc(100% + 8px);
-  right: 0;
-  width: 400px;
-  max-width: calc(100vw - 32px);
-  display: block;
-  background: var(--surface);
-  border: 1px solid var(--border);
   border-radius: 12px;
   box-shadow: 0 20px 52px rgba(11, 13, 17, 0.2);
-  overflow: hidden;
 }
 .fd-mode-choice {
   display: grid;
@@ -7948,21 +7945,10 @@ button.fd-erow-metric:focus-visible {
   padding-left: 14px;
 }
 .fd-fb-menu-anchor {
-  position: relative;
   display: inline-flex;
 }
+/* The Move menu's items, inside its Popover surface (InlinePanelSurface). */
 .fd-fb-menu {
-  position: absolute;
-  top: calc(100% + 4px);
-  right: 0;
-  z-index: 10;
-  width: 220px;
-  max-height: 280px;
-  overflow: auto;
-  background: var(--surface);
-  border: 1px solid var(--border);
-  border-radius: var(--r-lg);
-  box-shadow: 0 16px 44px rgba(11, 13, 17, .18);
   padding: 6px;
   display: flex;
   flex-direction: column;