@floegence/floe-webapp-core 0.36.69 → 0.36.71

package/dist/components/ui/Tooltip.js

@@ -1,54 +1,60 @@
-import { insert as a, createComponent as x, effect as y, className as p, template as c, delegateEvents as g } from "solid-js/web";
-import { createSignal as w, onCleanup as $, Show as T } from "solid-js";
-import { cn as m } from "../../utils/cn.js";
-var S = /* @__PURE__ */ c("<div role=tooltip><div>"), C = /* @__PURE__ */ c('<div class="relative inline-block">');
-function L(r) {
-  const [b, n] = w(!1);
+import { insert as i, createComponent as T, effect as $, className as v, setAttribute as b, template as h, delegateEvents as S } from "solid-js/web";
+import { createSignal as C, onCleanup as E, Show as L } from "solid-js";
+import { cn as g } from "../../utils/cn.js";
+import { createFloatingPresence as P } from "./floatingPresence.js";
+var k = /* @__PURE__ */ h("<div role=tooltip><div>"), z = /* @__PURE__ */ h('<div class="relative inline-block">');
+function N(o) {
+  const [x, n] = C(!1), a = P({
+    open: x,
+    exitDurationMs: 80
+  });
   let e;
-  $(() => {
+  E(() => {
     e && (clearTimeout(e), e = void 0);
   });
-  const i = () => {
+  const s = () => {
     e && clearTimeout(e);
-    const t = r.delay ?? 300;
+    const t = o.delay ?? 300;
     if (t <= 0) {
       n(!0);
       return;
     }
     e = setTimeout(() => n(!0), t);
-  }, s = () => {
+  }, d = () => {
     e && (clearTimeout(e), e = void 0), n(!1);
-  }, v = {
+  }, y = {
     top: "bottom-full left-1/2 -translate-x-1/2 mb-2",
     bottom: "top-full left-1/2 -translate-x-1/2 mt-2",
     left: "right-full top-1/2 -translate-y-1/2 mr-2",
     right: "left-full top-1/2 -translate-y-1/2 ml-2"
-  }, h = {
+  }, w = {
     top: "top-full left-1/2 -translate-x-1/2 border-t-popover border-x-transparent border-b-transparent",
     bottom: "bottom-full left-1/2 -translate-x-1/2 border-b-popover border-x-transparent border-t-transparent",
     left: "left-full top-1/2 -translate-y-1/2 border-l-popover border-y-transparent border-r-transparent",
     right: "right-full top-1/2 -translate-y-1/2 border-r-popover border-y-transparent border-l-transparent"
   };
   return (() => {
-    var t = C();
-    return t.$$focusout = s, t.$$focusin = i, t.addEventListener("mouseleave", s), t.addEventListener("mouseenter", i), a(t, () => r.children, null), a(t, x(T, {
+    var t = z();
+    return t.$$focusout = d, t.$$focusin = s, t.addEventListener("mouseleave", d), t.addEventListener("mouseenter", s), i(t, () => o.children, null), i(t, T(L, {
       get when() {
-        return b();
+        return a.mounted();
       },
       get children() {
-        var l = S(), d = l.firstChild;
-        return a(l, () => r.content, d), y((o) => {
-          var u = m("absolute z-50 px-2 py-1", "bg-popover text-popover-foreground text-xs rounded shadow-md", "whitespace-nowrap", "animate-in fade-in zoom-in-95", v[r.placement ?? "top"], r.class), f = m("absolute w-0 h-0 border-4", h[r.placement ?? "top"]);
-          return u !== o.e && p(l, o.e = u), f !== o.t && p(d, o.t = f), o;
+        var l = k(), u = l.firstChild;
+        return i(l, () => o.content, u), $((r) => {
+          var f = g("absolute z-50 px-2 py-1", "bg-popover text-popover-foreground text-xs rounded shadow-md", "whitespace-nowrap", "floe-floating-presence floe-floating-tooltip", y[o.placement ?? "top"], o.class), p = a.state(), c = a.exiting() ? "true" : void 0, m = g("absolute w-0 h-0 border-4", w[o.placement ?? "top"]);
+          return f !== r.e && v(l, r.e = f), p !== r.t && b(l, "data-floating-presence", r.t = p), c !== r.a && b(l, "aria-hidden", r.a = c), m !== r.o && v(u, r.o = m), r;
         }, {
           e: void 0,
-          t: void 0
+          t: void 0,
+          a: void 0,
+          o: void 0
         }), l;
       }
     }), null), t;
   })();
 }
-g(["focusin", "focusout"]);
+S(["focusin", "focusout"]);
 export {
-  L as Tooltip
+  N as Tooltip
 };

package/dist/components/ui/floatingPresence.d.ts

@@ -0,0 +1,13 @@
+import { type Accessor } from 'solid-js';
+export type FloatingPresenceState = 'entering' | 'open' | 'exiting';
+export interface FloatingPresenceOptions {
+    open: Accessor<boolean>;
+    exitDurationMs?: number;
+    reducedMotionExitDurationMs?: number;
+}
+export interface FloatingPresence {
+    mounted: Accessor<boolean>;
+    state: Accessor<FloatingPresenceState>;
+    exiting: Accessor<boolean>;
+}
+export declare function createFloatingPresence(options: FloatingPresenceOptions): FloatingPresence;

package/dist/components/ui/floatingPresence.js

@@ -0,0 +1,54 @@
+import { createSignal as f, createEffect as d, untrack as o, onCleanup as s } from "solid-js";
+function w() {
+  return typeof window > "u" || typeof window.matchMedia != "function" ? !1 : window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+}
+function x(e) {
+  return typeof window < "u" && typeof window.requestAnimationFrame == "function" ? window.requestAnimationFrame(e) : globalThis.setTimeout(e, 16);
+}
+function g(e) {
+  if (typeof window < "u" && typeof window.cancelAnimationFrame == "function") {
+    window.cancelAnimationFrame(e);
+    return;
+  }
+  globalThis.clearTimeout(e);
+}
+function p(e) {
+  return w() ? Math.max(0, e.reducedMotionExitDurationMs ?? 1) : Math.max(0, e.exitDurationMs ?? 120);
+}
+function F(e) {
+  const [u, a] = f(e.open()), [c, i] = f(
+    e.open() ? "entering" : "exiting"
+  );
+  let n = null, t = null;
+  const r = () => {
+    n !== null && (g(n), n = null);
+  }, l = () => {
+    t !== null && (globalThis.clearTimeout(t), t = null);
+  };
+  return d(() => {
+    if (e.open()) {
+      l(), r(), a(!0), i("entering"), n = x(() => {
+        n = null, o(e.open) && i("open");
+      });
+      return;
+    }
+    if (r(), !o(u)) {
+      i("exiting");
+      return;
+    }
+    i("exiting");
+    const m = p(e);
+    t = globalThis.setTimeout(() => {
+      t = null, o(e.open) || a(!1);
+    }, m);
+  }), s(() => {
+    r(), l();
+  }), {
+    mounted: u,
+    state: c,
+    exiting: () => c() === "exiting"
+  };
+}
+export {
+  F as createFloatingPresence
+};

package/dist/components/ui/index.d.ts

@@ -3,6 +3,7 @@ export { Tag, type TagProps, type TagVariant, type TagSize } from './Tag';
 export { Input, Textarea, NumberInput, AffixInput, type InputProps, type InputSize, type TextareaProps, type NumberInputProps, type AffixInputProps, type AffixOption, } from './Input';
 export { Dialog, ConfirmDialog, type DialogProps, type ConfirmDialogProps } from './Dialog';
 export { FloatingWindow, type FloatingWindowProps } from './FloatingWindow';
+export { createFloatingPresence, type FloatingPresence, type FloatingPresenceOptions, type FloatingPresenceState, } from './floatingPresence';
 export { resolveFloatingWindowViewport, type FloatingWindowRect, type FloatingWindowViewport, type FloatingWindowViewportInsets, } from './floatingWindowGeometry';
 export { Dropdown, Select, type DropdownProps, type DropdownItem, type SelectProps, } from './Dropdown';
 export { SurfaceFloatingLayer, type SurfaceFloatingLayerPosition, type SurfaceFloatingLayerProps, type SurfaceFloatingLayerSize, } from './SurfaceFloatingLayer';

package/dist/floe.css

@@ -426,6 +426,91 @@
 
 /* Animation utilities */
 @layer utilities {
+  .floe-floating-presence {
+    --floe-floating-enter-duration: 140ms;
+    --floe-floating-exit-duration: 110ms;
+    --floe-floating-enter-x: 0;
+    --floe-floating-enter-y: 0;
+    --floe-floating-exit-x: 0;
+    --floe-floating-exit-y: 0;
+    --floe-floating-enter-scale: 0.98;
+    --floe-floating-exit-scale: 0.985;
+    opacity: 1;
+    translate: 0 0;
+    scale: 1;
+    transform-origin: var(--floe-floating-origin, center);
+    transition:
+      opacity var(--floe-floating-enter-duration) ease-out,
+      translate var(--floe-floating-enter-duration) cubic-bezier(0.2, 0.8, 0.2, 1),
+      scale var(--floe-floating-enter-duration) cubic-bezier(0.2, 0.8, 0.2, 1);
+    will-change: opacity, translate, scale;
+  }
+
+  .floe-floating-presence[data-floating-presence='entering'] {
+    opacity: 0;
+    translate: var(--floe-floating-enter-x) var(--floe-floating-enter-y);
+    scale: var(--floe-floating-enter-scale);
+  }
+
+  .floe-floating-presence[data-floating-presence='exiting'] {
+    opacity: 0;
+    pointer-events: none;
+    translate: var(--floe-floating-exit-x) var(--floe-floating-exit-y);
+    scale: var(--floe-floating-exit-scale);
+    transition:
+      opacity var(--floe-floating-exit-duration) ease-in,
+      translate var(--floe-floating-exit-duration) cubic-bezier(0.4, 0, 1, 1),
+      scale var(--floe-floating-exit-duration) cubic-bezier(0.4, 0, 1, 1);
+  }
+
+  .floe-floating-presence--suspended {
+    transition: none !important;
+  }
+
+  .floe-floating-backdrop {
+    --floe-floating-enter-scale: 1;
+    --floe-floating-exit-scale: 1;
+  }
+
+  .floe-floating-dialog-panel {
+    --floe-floating-enter-y: 0.25rem;
+    --floe-floating-exit-y: 0.125rem;
+    --floe-floating-enter-scale: 0.975;
+    --floe-floating-exit-scale: 0.985;
+  }
+
+  .floe-floating-menu {
+    --floe-floating-enter-duration: 120ms;
+    --floe-floating-exit-duration: 100ms;
+    --floe-floating-enter-y: -0.25rem;
+    --floe-floating-exit-y: -0.125rem;
+    --floe-floating-enter-scale: 0.985;
+    --floe-floating-exit-scale: 0.992;
+    --floe-floating-origin: top;
+  }
+
+  .floe-floating-submenu {
+    --floe-floating-enter-x: -0.25rem;
+    --floe-floating-exit-x: -0.125rem;
+    --floe-floating-origin: left top;
+  }
+
+  .floe-floating-tooltip {
+    --floe-floating-enter-duration: 80ms;
+    --floe-floating-exit-duration: 70ms;
+    --floe-floating-enter-y: -0.125rem;
+    --floe-floating-exit-y: -0.0625rem;
+    --floe-floating-enter-scale: 0.98;
+    --floe-floating-exit-scale: 0.99;
+  }
+
+  .floe-floating-window-motion {
+    --floe-floating-enter-duration: 150ms;
+    --floe-floating-exit-duration: 120ms;
+    --floe-floating-enter-scale: 0.985;
+    --floe-floating-exit-scale: 0.985;
+  }
+
   .animate-in {
     animation: animate-in 200ms ease-out;
   }
@@ -474,6 +559,15 @@
   .scrollbar-hide::-webkit-scrollbar {
     display: none;
   }
+
+  @media (prefers-reduced-motion: reduce) {
+    .floe-floating-presence {
+      transition: opacity 1ms linear;
+      translate: none !important;
+      scale: none !important;
+      will-change: opacity;
+    }
+  }
 }
 
 @keyframes animate-in {

package/dist/full.js

@@ -139,25 +139,26 @@ import { computeCodeDiff as ff, computeCodeDiffSync as df, configureDiffWorker a
 import { configureMarkdownWorker as uf, createMarkdownWorker as kf, hasMarkdownWorker as hf, renderMarkdown as Ff, renderMarkdownSync as Ef, terminateMarkdownWorker as Af, waitForMarkdownWorker as Pf } from "./components/chat/hooks/useMarkdown.js";
 import { configureMermaidWorker as Lf, configureSyncMermaid as Rf, renderMermaid as _f, terminateMermaidWorker as vf, useMermaid as yf } from "./components/chat/hooks/useMermaid.js";
 import { configureShikiWorker as Of, configureSyncHighlighter as Wf, highlightCode as Mf, terminateShikiWorker as Nf, useCodeHighlight as wf } from "./components/chat/hooks/useCodeHighlight.js";
-import { createSimpleContext as Hf } from "./context/createSimpleContext.js";
-import { deferAfterPaint as Gf, deferNonBlocking as Vf } from "./utils/defer.js";
-import { duration as zf, easing as Xf, fadeIn as Zf, listContainer as Yf, listItem as Qf, panelResize as jf, popIn as qf, scaleIn as Jf, sidebarVariants as $f, slideInFromBottom as ed, slideInFromLeft as od, slideInFromRight as rd, slideInFromTop as td, springConfig as id } from "./utils/animations.js";
-import { formatKeybind as ad, isMacLikePlatform as cd, isPrimaryModKeyPressed as ld, matchKeybind as md, parseKeybind as sd } from "./utils/keybind.js";
-import { isTypingElement as fd, shouldIgnoreHotkeys as dd } from "./utils/dom.js";
-import { lockBodyStyle as Id } from "./utils/bodyStyleLock.js";
-import { registerCommandContributions as Cd, useCommandContributions as Sd } from "./hooks/useCommandContributions.js";
-import { resolveFloatingWindowViewport as ud } from "./components/ui/floatingWindowGeometry.js";
-import { startPointerSession as hd } from "./components/ui/pointerSession.js";
-import { useAttachments as Ed } from "./components/chat/hooks/useAttachments.js";
-import { useAutoScroll as Pd } from "./components/chat/hooks/useAutoScroll.js";
-import { useDebounce as Ld } from "./hooks/useDebounce.js";
-import { useDeckDrag as _d } from "./hooks/useDeckDrag.js";
-import { useFileBrowserDropTarget as yd, useFileBrowserItemDrag as Bd } from "./hooks/useFileBrowserDrag.js";
-import { useKeybind as Wd } from "./hooks/useKeybind.js";
-import { useMediaQuery as Nd } from "./hooks/useMediaQuery.js";
-import { usePersisted as bd } from "./hooks/usePersisted.js";
-import { useResizeObserver as Ud } from "./hooks/useResizeObserver.js";
-import { useVirtualList as Vd } from "./components/chat/hooks/useVirtualList.js";
+import { createFloatingPresence as Hf } from "./components/ui/floatingPresence.js";
+import { createSimpleContext as Gf } from "./context/createSimpleContext.js";
+import { deferAfterPaint as Kf, deferNonBlocking as zf } from "./utils/defer.js";
+import { duration as Zf, easing as Yf, fadeIn as Qf, listContainer as jf, listItem as qf, panelResize as Jf, popIn as $f, scaleIn as ed, sidebarVariants as od, slideInFromBottom as rd, slideInFromLeft as td, slideInFromRight as id, slideInFromTop as nd, springConfig as ad } from "./utils/animations.js";
+import { formatKeybind as ld, isMacLikePlatform as md, isPrimaryModKeyPressed as sd, matchKeybind as pd, parseKeybind as fd } from "./utils/keybind.js";
+import { isTypingElement as Td, shouldIgnoreHotkeys as Id } from "./utils/dom.js";
+import { lockBodyStyle as Cd } from "./utils/bodyStyleLock.js";
+import { registerCommandContributions as gd, useCommandContributions as ud } from "./hooks/useCommandContributions.js";
+import { resolveFloatingWindowViewport as hd } from "./components/ui/floatingWindowGeometry.js";
+import { startPointerSession as Ed } from "./components/ui/pointerSession.js";
+import { useAttachments as Pd } from "./components/chat/hooks/useAttachments.js";
+import { useAutoScroll as Ld } from "./components/chat/hooks/useAutoScroll.js";
+import { useDebounce as _d } from "./hooks/useDebounce.js";
+import { useDeckDrag as yd } from "./hooks/useDeckDrag.js";
+import { useFileBrowserDropTarget as Od, useFileBrowserItemDrag as Wd } from "./hooks/useFileBrowserDrag.js";
+import { useKeybind as Nd } from "./hooks/useKeybind.js";
+import { useMediaQuery as bd } from "./hooks/useMediaQuery.js";
+import { usePersisted as Ud } from "./hooks/usePersisted.js";
+import { useResizeObserver as Vd } from "./hooks/useResizeObserver.js";
+import { useVirtualList as zd } from "./components/chat/hooks/useVirtualList.js";
 export {
   F as Activity,
   bt as ActivityAppsMain,
@@ -626,10 +627,11 @@ export {
   Pa as createDeckService,
   um as createDefaultNotesSnapshot,
   If as createDiffWorker,
+  Hf as createFloatingPresence,
   Bl as createLayoutService,
   kf as createMarkdownWorker,
   Ym as createNotificationService,
-  Hf as createSimpleContext,
+  Gf as createSimpleContext,
   Yp as createStreamEventBuilder,
   mt as createTerminalEditorState,
   Lt as createTerminalFullLineSuggestion,
@@ -639,15 +641,15 @@ export {
   tp as createThemeService,
   af as createViewportFromZoomAnchor,
   Pp as createWidgetRegistry,
-  Gf as deferAfterPaint,
-  Vf as deferNonBlocking,
+  Kf as deferAfterPaint,
+  zf as deferNonBlocking,
   st as deleteTerminalTextBackward,
   Ct as dispatchTerminalSessionKey,
-  zf as duration,
-  Xf as easing,
+  Zf as duration,
+  Yf as easing,
   sa as ensureSurfacePortalInteractionTracking,
   lm as estimateNotesContextMenuHeight,
-  Zf as fadeIn,
+  Qf as fadeIn,
   $p as findFreePosition,
   f as floeColorTokenCategories,
   d as floeDesignTokens,
@@ -658,7 +660,7 @@ export {
   S as floeSpacingTokens,
   g as floeThemeColorVariables,
   u as floeTypographyTokens,
-  ad as formatKeybind,
+  ld as formatKeybind,
   vi as getFileIcon,
   k as getFloeColorTokenValue,
   Gp as getGridCellSize,
@@ -676,17 +678,17 @@ export {
   Mf as highlightCode,
   pt as insertTerminalText,
   en as isLocalInteractionSurfaceTarget,
-  cd as isMacLikePlatform,
+  md as isMacLikePlatform,
   cf as isPointInsideCanvasRect,
-  ld as isPrimaryModKeyPressed,
+  sd as isPrimaryModKeyPressed,
   Qp as isStreamEvent,
   pa as isSurfacePortalMode,
-  fd as isTypingElement,
-  Yf as listContainer,
-  Qf as listItem,
+  Td as isTypingElement,
+  jf as listContainer,
+  qf as listItem,
   lf as localToCanvasWorld,
-  Id as lockBodyStyle,
-  md as matchKeybind,
+  Cd as lockBodyStyle,
+  pd as matchKeybind,
   vt as matchesTerminalSuggestionPrefix,
   hm as mergeBoardBounds,
   c as mergeThemeTokenMaps,
@@ -696,16 +698,16 @@ export {
   Em as normalizeNotesSnapshot,
   at as normalizeTerminalWorkspaceProfile,
   Am as noteBucketMetrics,
-  jf as panelResize,
-  sd as parseKeybind,
+  Jf as panelResize,
+  fd as parseKeybind,
   yt as parseTerminalSuggestionContext,
   Vp as pixelDeltaToGridDelta,
-  qf as popIn,
+  $f as popIn,
   Kp as positionToGridArea,
   fa as projectSurfacePortalPosition,
   da as projectSurfacePortalRect,
   Pm as promoteLocalItem,
-  Cd as registerCommandContributions,
+  gd as registerCommandContributions,
   Dm as removeSnapshotItem,
   Lm as removeSnapshotTopic,
   Rm as removeSnapshotTrashItem,
@@ -716,7 +718,7 @@ export {
   vm as replaceSnapshotTopic,
   ym as replaceSnapshotTrashItem,
   yi as resolveFileItemIcon,
-  ud as resolveFloatingWindowViewport,
+  hd as resolveFloatingWindowViewport,
   on as resolveSurfaceInteractionTargetRole,
   Ta as resolveSurfacePortalBoundaryRect,
   Ia as resolveSurfacePortalHost,
@@ -731,20 +733,20 @@ export {
   Ft as runTerminalMockCommand,
   of as sameGridPosition,
   Ha as sanitizeDisplayMode,
-  Jf as scaleIn,
+  ed as scaleIn,
   Bm as screenToWorld,
   ut as setTerminalSessionInputValue,
   cn as shouldActivateWorkbenchWidgetLocalTarget,
-  dd as shouldIgnoreHotkeys,
-  $f as sidebarVariants,
-  ed as slideInFromBottom,
-  od as slideInFromLeft,
-  rd as slideInFromRight,
-  td as slideInFromTop,
+  Id as shouldIgnoreHotkeys,
+  od as sidebarVariants,
+  rd as slideInFromBottom,
+  td as slideInFromLeft,
+  id as slideInFromRight,
+  nd as slideInFromTop,
   zp as snapToGrid,
-  id as springConfig,
+  ad as springConfig,
   gc as startHotInteraction,
-  hd as startPointerSession,
+  Ed as startPointerSession,
   kt as submitTerminalSession,
   s as syncThemeTokenOverrides,
   Bt as terminalCommandTokenSuggestionProvider,
@@ -756,36 +758,36 @@ export {
   Af as terminateMarkdownWorker,
   vf as terminateMermaidWorker,
   Nf as terminateShikiWorker,
-  Ed as useAttachments,
-  Pd as useAutoScroll,
+  Pd as useAttachments,
+  Ld as useAutoScroll,
   Tn as useChatContext,
   wf as useCodeHighlight,
   Wn as useCommand,
-  Sd as useCommandContributions,
+  ud as useCommandContributions,
   Hn as useComponentContextFactory,
   Un as useComponentRegistry,
   yp as useCurrentWidgetId,
-  Ld as useDebounce,
+  _d as useDebounce,
   Da as useDeck,
-  _d as useDeckDrag,
+  yd as useDeckDrag,
   yc as useFileBrowser,
   Rc as useFileBrowserDrag,
-  yd as useFileBrowserDropTarget,
-  Bd as useFileBrowserItemDrag,
+  Od as useFileBrowserDropTarget,
+  Wd as useFileBrowserItemDrag,
   ea as useFloeConfig,
   fl as useFormSubmitting,
-  Wd as useKeybind,
+  Nd as useKeybind,
   Ol as useLayout,
-  Nd as useMediaQuery,
+  bd as useMediaQuery,
   yf as useMermaid,
   Qm as useNotification,
   Gn as useOptionalComponentRegistry,
-  bd as usePersisted,
-  Ud as useResizeObserver,
+  Ud as usePersisted,
+  Vd as useResizeObserver,
   oa as useResolvedFloeConfig,
   ip as useTheme,
   Cp as useViewActivation,
-  Vd as useVirtualList,
+  zd as useVirtualList,
   Dp as useWidgetRegistry,
   Bp as useWidgetState,
   Op as useWidgetStateContext,