@almadar/ui 5.12.1 → 5.13.3

package/dist/runtime/index.cjs

@@ -10,9 +10,9 @@ var LucideIcons2 = require('lucide-react');
 var PhosphorIcons = require('@phosphor-icons/react');
 var TablerIcons = require('@tabler/icons-react');
 var FaIcons = require('react-icons/fa');
+var reactDom = require('react-dom');
 var evaluator = require('@almadar/evaluator');
 var context = require('@almadar/ui/context');
-var reactDom = require('react-dom');
 var reactRouterDom = require('react-router-dom');
 var ELK = require('elkjs/lib/elk.bundled.js');
 var ReactMarkdown = require('react-markdown');
@@ -2276,7 +2276,7 @@ var init_Modal = __esm({
           document.body.style.overflow = "";
         };
       }, [isOpen]);
-      if (!isOpen) return null;
+      if (!isOpen || typeof document === "undefined") return null;
       const handleClose = () => {
         if (closeEvent) eventBus.emit(`UI:${closeEvent}`, {});
         onClose();
@@ -2286,124 +2286,127 @@ var init_Modal = __esm({
           handleClose();
         }
       };
-      return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          Overlay,
-          {
-            isVisible: isOpen,
-            onClick: handleOverlayClick,
-            className: "z-40"
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          Box,
-          {
-            className: cn(
-              "fixed inset-0 z-50 pointer-events-none",
-              "flex items-start justify-center px-4 pb-4 pt-[10vh]",
-              "max-sm:items-stretch max-sm:p-0 max-sm:pt-0"
-            ),
-            children: /* @__PURE__ */ jsxRuntime.jsxs(
-              Dialog,
-              {
-                ref: modalRef,
-                open: true,
-                className: cn(
-                  // Reset browser-default dialog chrome — we own styling. `static`
-                  // overrides the user-agent `position: absolute` so the parent
-                  // flex container's `justify-center` actually centers the dialog
-                  // (without this, the dialog drops out of flex flow and `m-0`
-                  // kills the user-agent's `margin: auto` centering, pinning the
-                  // dialog to top-left).
-                  "static m-0 p-0 border-0 bg-transparent",
-                  // Pre-existing dialog frame
-                  "pointer-events-auto w-full flex flex-col bg-surface border shadow-elevation-dialog rounded-container",
-                  // Desktop sizing + viewport-aware floor.
-                  sizeClasses2[size],
-                  minWidthClasses[size],
-                  "max-h-[80vh]",
-                  // Mobile: take the entire screen. Override desktop max-w cap,
-                  // full height, no rounded corners, no min-width.
-                  "max-sm:max-w-none max-sm:max-h-none max-sm:w-full max-sm:h-full max-sm:rounded-none",
-                  lookStyles[look],
-                  className
-                ),
-                style: dragY > 0 ? {
-                  transform: `translateY(${dragY}px)`,
-                  transition: isDragging.current ? "none" : "transform 200ms ease-out"
-                } : void 0,
-                ...title && { "aria-labelledby": "modal-title" },
-                children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(
-                    Box,
-                    {
-                      className: "hidden max-sm:flex justify-center py-2 cursor-grab active:cursor-grabbing touch-none",
-                      onPointerDown: (e) => {
-                        if (!swipeDownToClose) return;
-                        dragStartY.current = e.clientY;
-                        isDragging.current = true;
-                        e.target.setPointerCapture(e.pointerId);
-                      },
-                      onPointerMove: (e) => {
-                        if (!isDragging.current) return;
-                        const dy = Math.max(0, e.clientY - dragStartY.current);
-                        setDragY(dy);
-                      },
-                      onPointerUp: () => {
-                        if (!isDragging.current) return;
-                        isDragging.current = false;
-                        if (dragY > 100) {
-                          handleClose();
-                        }
-                        setDragY(0);
-                      },
-                      onPointerCancel: () => {
-                        isDragging.current = false;
-                        setDragY(0);
-                      },
-                      children: /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-10 h-1 rounded-full bg-border" })
-                    }
+      return reactDom.createPortal(
+        /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            Overlay,
+            {
+              isVisible: isOpen,
+              onClick: handleOverlayClick,
+              className: "z-[1000]"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            Box,
+            {
+              className: cn(
+                "fixed inset-0 z-[1001] pointer-events-none",
+                "flex items-start justify-center px-4 pb-4 pt-[10vh]",
+                "max-sm:items-stretch max-sm:p-0 max-sm:pt-0"
+              ),
+              children: /* @__PURE__ */ jsxRuntime.jsxs(
+                Dialog,
+                {
+                  ref: modalRef,
+                  open: true,
+                  className: cn(
+                    // Reset browser-default dialog chrome — we own styling. `static`
+                    // overrides the user-agent `position: absolute` so the parent
+                    // flex container's `justify-center` actually centers the dialog
+                    // (without this, the dialog drops out of flex flow and `m-0`
+                    // kills the user-agent's `margin: auto` centering, pinning the
+                    // dialog to top-left).
+                    "static m-0 p-0 border-0 bg-transparent",
+                    // Pre-existing dialog frame
+                    "pointer-events-auto w-full flex flex-col bg-surface border shadow-elevation-dialog rounded-container",
+                    // Desktop sizing + viewport-aware floor.
+                    sizeClasses2[size],
+                    minWidthClasses[size],
+                    "max-h-[80vh]",
+                    // Mobile: take the entire screen. Override desktop max-w cap,
+                    // full height, no rounded corners, no min-width.
+                    "max-sm:max-w-none max-sm:max-h-none max-sm:w-full max-sm:h-full max-sm:rounded-none",
+                    lookStyles[look],
+                    className
                   ),
-                  (title || showCloseButton) && /* @__PURE__ */ jsxRuntime.jsxs(
-                    Box,
-                    {
-                      className: cn(
-                        "px-6 py-4 flex items-center justify-between",
-                        "border-b-[length:var(--border-width)] border-border"
-                      ),
-                      children: [
-                        title && /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", as: "h2", id: "modal-title", children: title }),
-                        showCloseButton && /* @__PURE__ */ jsxRuntime.jsx(
-                          Button,
-                          {
-                            variant: "ghost",
-                            size: "sm",
-                            icon: "x",
-                            onClick: handleClose,
-                            "data-event": "CLOSE",
-                            "aria-label": "Close modal"
+                  style: dragY > 0 ? {
+                    transform: `translateY(${dragY}px)`,
+                    transition: isDragging.current ? "none" : "transform 200ms ease-out"
+                  } : void 0,
+                  ...title && { "aria-labelledby": "modal-title" },
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      Box,
+                      {
+                        className: "hidden max-sm:flex justify-center py-2 cursor-grab active:cursor-grabbing touch-none",
+                        onPointerDown: (e) => {
+                          if (!swipeDownToClose) return;
+                          dragStartY.current = e.clientY;
+                          isDragging.current = true;
+                          e.target.setPointerCapture(e.pointerId);
+                        },
+                        onPointerMove: (e) => {
+                          if (!isDragging.current) return;
+                          const dy = Math.max(0, e.clientY - dragStartY.current);
+                          setDragY(dy);
+                        },
+                        onPointerUp: () => {
+                          if (!isDragging.current) return;
+                          isDragging.current = false;
+                          if (dragY > 100) {
+                            handleClose();
                           }
-                        )
-                      ]
-                    }
-                  ),
-                  /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "flex-1 overflow-y-auto p-6", children }),
-                  footer && /* @__PURE__ */ jsxRuntime.jsx(
-                    Box,
-                    {
-                      className: cn(
-                        "px-6 py-4 bg-muted",
-                        "border-t-[length:var(--border-width)] border-border"
-                      ),
-                      children: footer
-                    }
-                  )
-                ]
-              }
-            )
-          }
-        )
-      ] });
+                          setDragY(0);
+                        },
+                        onPointerCancel: () => {
+                          isDragging.current = false;
+                          setDragY(0);
+                        },
+                        children: /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-10 h-1 rounded-full bg-border" })
+                      }
+                    ),
+                    (title || showCloseButton) && /* @__PURE__ */ jsxRuntime.jsxs(
+                      Box,
+                      {
+                        className: cn(
+                          "px-6 py-4 flex items-center justify-between",
+                          "border-b-[length:var(--border-width)] border-border"
+                        ),
+                        children: [
+                          title && /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", as: "h2", id: "modal-title", children: title }),
+                          showCloseButton && /* @__PURE__ */ jsxRuntime.jsx(
+                            Button,
+                            {
+                              variant: "ghost",
+                              size: "sm",
+                              icon: "x",
+                              onClick: handleClose,
+                              "data-event": "CLOSE",
+                              "aria-label": "Close modal"
+                            }
+                          )
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "flex-1 overflow-y-auto p-6", children }),
+                    footer && /* @__PURE__ */ jsxRuntime.jsx(
+                      Box,
+                      {
+                        className: cn(
+                          "px-6 py-4 bg-muted",
+                          "border-t-[length:var(--border-width)] border-border"
+                        ),
+                        children: footer
+                      }
+                    )
+                  ]
+                }
+              )
+            }
+          )
+        ] }),
+        document.body
+      );
     };
     Modal.displayName = "Modal";
   }
@@ -13864,7 +13867,7 @@ var init_CodeBlock = __esm({
             };
           };
         }, [errorLines]);
-        const isFoldable = foldableProp ?? (language === "orb" || language === "json");
+        const isFoldable = foldableProp ?? true;
         const [collapsed, setCollapsed] = React85.useState(() => /* @__PURE__ */ new Set());
         const foldRegions = React85.useMemo(
           () => isFoldable ? computeFoldRegions(code) : [],
@@ -17686,6 +17689,7 @@ function CalendarGrid({
   swipeRightEvent,
   dayWindow = "auto"
 }) {
+  const evs = Array.isArray(events2) ? events2 : events2 ? [events2] : [];
   const eventBus = useEventBus();
   const longPressTimer = React85.useRef(null);
   const resolvedWeekStart = React85.useMemo(
@@ -17734,7 +17738,7 @@ function CalendarGrid({
     [onEventClick]
   );
   const eventsForDayCount = React85.useCallback(
-    (day) => events2.filter(
+    (day) => evs.filter(
       (ev) => new Date(ev.startTime).toDateString() === day.toDateString()
     ).length,
     [events2]
@@ -17849,7 +17853,7 @@ function CalendarGrid({
                   }
                 ) }),
                 visibleDays.map((day) => {
-                  const slotEvents = events2.filter(
+                  const slotEvents = evs.filter(
                     (ev) => eventInSlot(ev, day, time)
                   );
                   const isToday = day.toDateString() === (/* @__PURE__ */ new Date()).toDateString();
@@ -29923,7 +29927,7 @@ function useSafeEventBus10() {
   }
 }
 function SortableListInner({
-  items: initialItems = EMPTY_ITEMS,
+  items: initialItemsProp = EMPTY_ITEMS,
   renderItem,
   reorderEvent,
   reorderPayload,
@@ -29931,6 +29935,7 @@ function SortableListInner({
   className
 }) {
   const eventBus = useSafeEventBus10();
+  const initialItems = Array.isArray(initialItemsProp) ? initialItemsProp : initialItemsProp ? [initialItemsProp] : [];
   const handleReorder = React85.useCallback(
     (fromIndex, toIndex, item) => {
       eventBus.emit(`UI:${reorderEvent}`, {
@@ -33362,9 +33367,10 @@ var init_ReplyTree = __esm({
       showActions = true,
       className
     }) => {
+      const nodeList = Array.isArray(nodes) ? nodes : nodes ? [nodes] : [];
       const [collapsedSet, setCollapsedSet] = React85.useState(() => {
         const acc = /* @__PURE__ */ new Set();
-        collectInitiallyCollapsed(nodes, acc);
+        collectInitiallyCollapsed(nodeList, acc);
         return acc;
       });
       const toggleCollapse = React85.useCallback((id) => {
@@ -33378,10 +33384,10 @@ var init_ReplyTree = __esm({
           return next;
         });
       }, []);
-      if (nodes.length === 0) {
+      if (nodeList.length === 0) {
         return /* @__PURE__ */ jsxRuntime.jsx(Box, { className: cn("text-sm text-muted-foreground", className), children: "No replies yet." });
       }
-      return /* @__PURE__ */ jsxRuntime.jsx(Box, { className: cn("flex flex-col gap-2 min-w-0", className), children: nodes.map((node) => /* @__PURE__ */ jsxRuntime.jsx(
+      return /* @__PURE__ */ jsxRuntime.jsx(Box, { className: cn("flex flex-col gap-2 min-w-0", className), children: nodeList.map((node) => /* @__PURE__ */ jsxRuntime.jsx(
         ReplyTreeNode,
         {
           node,