@flytedan/flytebot-design-system 0.76.0 → 0.77.0

package/dist/index.cjs

@@ -930,6 +930,7 @@ __export(index_exports, {
   CHAT_UNAVAILABLE: () => CHAT_UNAVAILABLE,
   COPIED_FEEDBACK_MS: () => COPIED_FEEDBACK_MS,
   CORNER_STACK_INSET_PROPERTY: () => CORNER_STACK_INSET_PROPERTY,
+  CORNER_STACK_OFFSET_PROPERTY: () => CORNER_STACK_OFFSET_PROPERTY,
   Calendar: () => Calendar,
   Card: () => Card,
   CardGrid: () => CardGrid,
@@ -1036,6 +1037,7 @@ __export(index_exports, {
   RoadmapTimeline: () => RoadmapTimeline,
   RunActions: () => RunActions,
   RuntimeKit: () => RuntimeKit,
+  SHEET_OPEN_ATTRIBUTE: () => SHEET_OPEN_ATTRIBUTE,
   SaturationDistribution: () => SaturationDistribution,
   ScoreMeter: () => ScoreMeter,
   ScreenHead: () => ScreenHead,
@@ -1140,10 +1142,12 @@ __export(index_exports, {
   useLayerZIndex: () => useLayerZIndex,
   useOverlayLayout: () => useOverlayLayout,
   usePopoverPosition: () => usePopoverPosition,
+  usePublishCornerStackOffset: () => usePublishCornerStackOffset,
   useResponsiveRail: () => useResponsiveRail,
   useRuntimeMode: () => useRuntimeMode,
   useServerTable: () => useServerTable,
   useSessionContext: () => useSessionContext,
+  useSheetOpenMark: () => useSheetOpenMark,
   useStackedLayer: () => useStackedLayer,
   useStagedFiles: () => useStagedFiles,
   useToast: () => useToast,
@@ -2423,6 +2427,30 @@ function CornerStackPortal({ slot, children }) {
   const element = useCornerStackSlot(slot);
   return element ? (0, import_react_dom5.createPortal)(children, element) : null;
 }
+var CORNER_STACK_OFFSET_PROPERTY = "--fd-corner-stack-offset";
+var SHEET_OPEN_ATTRIBUTE = "data-fd-sheet-open";
+function usePublishCornerStackOffset(ref, active) {
+  useSlotEffect(() => {
+    const el = ref.current;
+    if (!active || !el) return;
+    const root = document.documentElement;
+    const publish = () => root.style.setProperty(CORNER_STACK_OFFSET_PROPERTY, `${el.getBoundingClientRect().width}px`);
+    publish();
+    const observer = typeof ResizeObserver === "function" ? new ResizeObserver(publish) : null;
+    observer?.observe(el);
+    return () => {
+      observer?.disconnect();
+      root.style.removeProperty(CORNER_STACK_OFFSET_PROPERTY);
+    };
+  }, [ref, active]);
+}
+function useSheetOpenMark(active) {
+  useSlotEffect(() => {
+    if (!active) return;
+    document.documentElement.setAttribute(SHEET_OPEN_ATTRIBUTE, "");
+    return () => document.documentElement.removeAttribute(SHEET_OPEN_ATTRIBUTE);
+  }, [active]);
+}
 
 // src/components/loading/ProgressBar.tsx
 var import_jsx_runtime14 = require("react/jsx-runtime");
@@ -2819,6 +2847,8 @@ function DockedSidePanel({ open: open2, children: childrenNow, ...widthOptions }
   const { width, setWidth } = useResizableWidth(widthOptions);
   const drag = React19.useRef(null);
   const [resizing, setResizing] = React19.useState(false);
+  const boxRef = React19.useRef(null);
+  usePublishCornerStackOffset(boxRef, rendered);
   if (!rendered) return null;
   const onPointerDown = (e) => {
     e.preventDefault();
@@ -2842,6 +2872,7 @@ function DockedSidePanel({ open: open2, children: childrenNow, ...widthOptions }
   return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     "div",
     {
+      ref: boxRef,
       className: ["fd-sidepanel", animateEnter ? "is-entering" : "", closing ? "is-closing" : "", resizing ? "is-resizing" : ""].filter(Boolean).join(" "),
       "data-open": open2 ? "true" : "false",
       style: { width },
@@ -2903,6 +2934,7 @@ function AppShell({
     initialOpen: initialNavOpen,
     onPersist: onNavOpenChange
   });
+  useSheetOpenMark(Boolean(sidePanel?.open) && rail.overlay);
   return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
     "div",
     {
@@ -16632,6 +16664,7 @@ function useDocumentTitle(routeTitle, appName) {
   CHAT_UNAVAILABLE,
   COPIED_FEEDBACK_MS,
   CORNER_STACK_INSET_PROPERTY,
+  CORNER_STACK_OFFSET_PROPERTY,
   Calendar,
   Card,
   CardGrid,
@@ -16738,6 +16771,7 @@ function useDocumentTitle(routeTitle, appName) {
   RoadmapTimeline,
   RunActions,
   RuntimeKit,
+  SHEET_OPEN_ATTRIBUTE,
   SaturationDistribution,
   ScoreMeter,
   ScreenHead,
@@ -16842,10 +16876,12 @@ function useDocumentTitle(routeTitle, appName) {
   useLayerZIndex,
   useOverlayLayout,
   usePopoverPosition,
+  usePublishCornerStackOffset,
   useResponsiveRail,
   useRuntimeMode,
   useServerTable,
   useSessionContext,
+  useSheetOpenMark,
   useStackedLayer,
   useStagedFiles,
   useToast,