@octaviaflow/core 3.1.0-beta.111 → 3.1.0-beta.113

package/dist/index.js

@@ -5333,13 +5333,18 @@ var CommandPalette = forwardRef26(
     open,
     onClose,
     groups,
-    placeholder = "Search for actions, pages, datasets\u2026",
+    placeholder = "Search\u2026",
     onSelect,
     emptyState,
     footer,
     filter = defaultFilter,
     container,
     disableAnimation = false,
+    query: controlledQuery,
+    onQueryChange,
+    shouldFilter = true,
+    loading = false,
+    loadingLabel = "Searching\u2026",
     id: providedId,
     className,
     ...rest
@@ -5349,14 +5354,16 @@ var CommandPalette = forwardRef26(
     const reducedMotion = useReducedMotion3();
     const inputRef = useRef10(null);
     const listRef = useRef10(null);
-    const [query, setQuery] = useState16("");
+    const isQueryControlled = controlledQuery !== void 0;
+    const [internalQuery, setInternalQuery] = useState16("");
+    const query = isQueryControlled ? controlledQuery : internalQuery;
     const [activeIndex, setActiveIndex] = useState16(0);
     const filteredGroups = useMemo5(() => {
       return groups.map((g) => ({
         ...g,
-        items: g.items.filter((it) => filter(it, query, g.heading))
+        items: g.shouldFilter ?? shouldFilter ? g.items.filter((it) => filter(it, query, g.heading)) : g.items
       })).filter((g) => g.items.length > 0);
-    }, [groups, query, filter]);
+    }, [groups, query, filter, shouldFilter]);
     const flatItems = useMemo5(
       () => filteredGroups.flatMap((g) => g.items),
       [filteredGroups]
@@ -5368,7 +5375,7 @@ var CommandPalette = forwardRef26(
     }, [flatItems.length, activeIndex]);
     useEffect8(() => {
       if (open) {
-        setQuery("");
+        if (!isQueryControlled) setInternalQuery("");
         setActiveIndex(0);
         requestAnimationFrame(() => inputRef.current?.focus());
       }
@@ -5447,76 +5454,85 @@ var CommandPalette = forwardRef26(
                 placeholder,
                 value: query,
                 onChange: (e) => {
-                  setQuery(e.target.value);
+                  const next = e.target.value;
+                  if (!isQueryControlled) setInternalQuery(next);
+                  onQueryChange?.(next);
                   setActiveIndex(0);
                 }
               }
             ),
             /* @__PURE__ */ jsx30("kbd", { className: "ods-cmdk__esc-hint", "aria-hidden": "true", children: "Esc" })
           ] }),
-          /* @__PURE__ */ jsx30(
+          /* @__PURE__ */ jsxs30(
             "div",
             {
               ref: listRef,
               id: `${baseId}-list`,
               role: "listbox",
               className: "ods-cmdk__list",
-              children: filteredGroups.length === 0 ? /* @__PURE__ */ jsx30("div", { className: "ods-cmdk__empty", children: emptyState ?? /* @__PURE__ */ jsxs30(Fragment10, { children: [
-                /* @__PURE__ */ jsx30("p", { className: "ods-cmdk__empty-title", children: "No results" }),
-                /* @__PURE__ */ jsx30("p", { className: "ods-cmdk__empty-hint", children: "Try a different keyword." })
-              ] }) }) : (() => {
-                let flatIdx = -1;
-                return filteredGroups.map((g, gi) => /* @__PURE__ */ jsxs30(
-                  "div",
-                  {
-                    className: "ods-cmdk__group",
-                    role: "group",
-                    "aria-label": typeof g.heading === "string" ? g.heading : void 0,
-                    children: [
-                      /* @__PURE__ */ jsx30("div", { className: "ods-cmdk__group-heading", children: g.heading }),
-                      g.items.map((item) => {
-                        flatIdx += 1;
-                        const idx = flatIdx;
-                        const isActive2 = idx === activeIndex;
-                        return /* @__PURE__ */ jsxs30(
-                          "div",
-                          {
-                            id: `${baseId}-opt-${idx}`,
-                            role: "option",
-                            "aria-selected": isActive2,
-                            "aria-disabled": item.disabled || void 0,
-                            className: cn(
-                              "ods-cmdk__option",
-                              isActive2 && "ods-cmdk__option--active",
-                              item.danger && "ods-cmdk__option--danger",
-                              item.disabled && "ods-cmdk__option--disabled"
-                            ),
-                            onMouseEnter: () => setActiveIndex(idx),
-                            onClick: () => handleItemClick(item),
-                            children: [
-                              item.icon && /* @__PURE__ */ jsx30(
-                                "span",
-                                {
-                                  className: "ods-cmdk__option-icon",
-                                  "aria-hidden": "true",
-                                  children: item.icon
-                                }
+              "aria-busy": loading || void 0,
+              children: [
+                filteredGroups.length === 0 ? loading ? null : /* @__PURE__ */ jsx30("div", { className: "ods-cmdk__empty", children: emptyState ?? /* @__PURE__ */ jsxs30(Fragment10, { children: [
+                  /* @__PURE__ */ jsx30("p", { className: "ods-cmdk__empty-title", children: "No results" }),
+                  /* @__PURE__ */ jsx30("p", { className: "ods-cmdk__empty-hint", children: "Try a different keyword." })
+                ] }) }) : (() => {
+                  let flatIdx = -1;
+                  return filteredGroups.map((g, gi) => /* @__PURE__ */ jsxs30(
+                    "div",
+                    {
+                      className: "ods-cmdk__group",
+                      role: "group",
+                      "aria-label": typeof g.heading === "string" ? g.heading : void 0,
+                      children: [
+                        /* @__PURE__ */ jsx30("div", { className: "ods-cmdk__group-heading", children: g.heading }),
+                        g.items.map((item) => {
+                          flatIdx += 1;
+                          const idx = flatIdx;
+                          const isActive2 = idx === activeIndex;
+                          return /* @__PURE__ */ jsxs30(
+                            "div",
+                            {
+                              id: `${baseId}-opt-${idx}`,
+                              role: "option",
+                              "aria-selected": isActive2,
+                              "aria-disabled": item.disabled || void 0,
+                              className: cn(
+                                "ods-cmdk__option",
+                                isActive2 && "ods-cmdk__option--active",
+                                item.danger && "ods-cmdk__option--danger",
+                                item.disabled && "ods-cmdk__option--disabled"
                               ),
-                              /* @__PURE__ */ jsxs30("span", { className: "ods-cmdk__option-body", children: [
-                                /* @__PURE__ */ jsx30("span", { className: "ods-cmdk__option-label", children: item.label }),
-                                item.description && /* @__PURE__ */ jsx30("span", { className: "ods-cmdk__option-desc", children: item.description })
-                              ] }),
-                              item.shortcut && /* @__PURE__ */ jsx30("kbd", { className: "ods-cmdk__option-shortcut", children: item.shortcut })
-                            ]
-                          },
-                          item.id
-                        );
-                      })
-                    ]
-                  },
-                  gi
-                ));
-              })()
+                              onMouseEnter: () => setActiveIndex(idx),
+                              onClick: () => handleItemClick(item),
+                              children: [
+                                item.icon && /* @__PURE__ */ jsx30(
+                                  "span",
+                                  {
+                                    className: "ods-cmdk__option-icon",
+                                    "aria-hidden": "true",
+                                    children: item.icon
+                                  }
+                                ),
+                                /* @__PURE__ */ jsxs30("span", { className: "ods-cmdk__option-body", children: [
+                                  /* @__PURE__ */ jsx30("span", { className: "ods-cmdk__option-label", children: item.label }),
+                                  item.description && /* @__PURE__ */ jsx30("span", { className: "ods-cmdk__option-desc", children: item.description })
+                                ] }),
+                                item.shortcut && /* @__PURE__ */ jsx30("kbd", { className: "ods-cmdk__option-shortcut", children: item.shortcut })
+                              ]
+                            },
+                            item.id
+                          );
+                        })
+                      ]
+                    },
+                    gi
+                  ));
+                })(),
+                loading && /* @__PURE__ */ jsxs30("div", { className: "ods-cmdk__loading", role: "status", "aria-live": "polite", children: [
+                  /* @__PURE__ */ jsx30(Spinner, { size: "sm", tone: "muted", "aria-hidden": "true" }),
+                  /* @__PURE__ */ jsx30("span", { children: loadingLabel })
+                ] })
+              ]
             }
           ),
           footer && /* @__PURE__ */ jsx30("div", { className: "ods-cmdk__footer", children: footer })
@@ -11734,7 +11750,10 @@ function shortReferenceLabel(token) {
   if (token.startsWith("{{ods://")) {
     const path = token.slice(8, -2);
     const parts = path.split("/");
-    if (parts[0] === "steps" && parts.length >= 4) return parts.slice(3).join(".");
+    if (parts[0] === "steps") {
+      if (parts.length >= 4) return parts.slice(3).join(".");
+      return parts[2] ?? "output";
+    }
     if (parts[0] === "flow") return `flow.${parts.slice(1).join(".")}`;
     return parts.join(".");
   }
@@ -33209,6 +33228,7 @@ function SlideoutContent({
   title,
   children,
   footer,
+  headerActions,
   className,
   offsetTop = 0,
   offsetBottom = 0
@@ -33294,16 +33314,19 @@ function SlideoutContent({
         children: [
           title && /* @__PURE__ */ jsxs130("div", { className: "ods-slideout__header", children: [
             /* @__PURE__ */ jsx135("h2", { ...titleProps, className: "ods-slideout__title", children: title }),
-            /* @__PURE__ */ jsx135(
-              "button",
-              {
-                className: "ods-slideout__close",
-                onClick: onClose,
-                "aria-label": "Close panel",
-                type: "button",
-                children: /* @__PURE__ */ jsx135("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ jsx135("path", { d: "M6.28 5.22a.75.75 0 00-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 101.06 1.06L10 11.06l3.72 3.72a.75.75 0 101.06-1.06L11.06 10l3.72-3.72a.75.75 0 00-1.06-1.06L10 8.94 6.28 5.22z" }) })
-              }
-            )
+            /* @__PURE__ */ jsxs130("div", { className: "ods-slideout__header-actions", children: [
+              headerActions,
+              /* @__PURE__ */ jsx135(
+                "button",
+                {
+                  className: "ods-slideout__close",
+                  onClick: onClose,
+                  "aria-label": "Close panel",
+                  type: "button",
+                  children: /* @__PURE__ */ jsx135("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ jsx135("path", { d: "M6.28 5.22a.75.75 0 00-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 101.06 1.06L10 11.06l3.72 3.72a.75.75 0 101.06-1.06L11.06 10l3.72-3.72a.75.75 0 00-1.06-1.06L10 8.94 6.28 5.22z" }) })
+                }
+              )
+            ] })
           ] }),
           /* @__PURE__ */ jsx135("div", { className: "ods-slideout__body", children }),
           footer && /* @__PURE__ */ jsx135("div", { className: "ods-slideout__footer", children: footer })
@@ -34661,6 +34684,8 @@ import {
   createContext as createContext3,
   useCallback as useCallback51,
   useContext as useContext4,
+  useEffect as useEffect57,
+  useLayoutEffect as useLayoutEffect12,
   useMemo as useMemo37,
   useRef as useRef50,
   useState as useState71
@@ -34755,15 +34780,57 @@ var defaultIcons = {
   ] })
 };
 var ToastContext = createContext3(null);
-function ToastBody({ item, onDismiss }) {
+function ToastBody({ item, stacked, onDismiss }) {
   const dismiss = () => onDismiss(item.id);
+  const [expanded, setExpanded] = useState71(false);
+  const [overflowing, setOverflowing] = useState71(false);
+  const descRef = useRef50(null);
+  const cut = item.clampLines > 0 && !expanded;
+  useLayoutEffect12(() => {
+    if (!cut) return;
+    const el = descRef.current;
+    if (el) setOverflowing(el.scrollHeight > el.clientHeight + 1);
+  }, [cut, item.description]);
   if (item.render) return /* @__PURE__ */ jsx147(Fragment61, { children: item.render({ id: item.id, dismiss }) });
   const title = item.title ?? item.message;
+  const toggles = overflowing && !stacked;
+  const toggle = () => setExpanded((v) => !v);
+  const onTextClick = (e) => {
+    if (!toggles) return;
+    if (window.getSelection()?.toString()) return;
+    e.stopPropagation();
+    toggle();
+  };
   return /* @__PURE__ */ jsxs141(Fragment61, { children: [
     /* @__PURE__ */ jsx147("span", { className: "ods-toast__icon", "aria-hidden": "true", children: item.icon ?? defaultIcons[item.variant] }),
-    /* @__PURE__ */ jsxs141("div", { className: "ods-toast__body", children: [
+    /* @__PURE__ */ jsxs141("div", { className: "ods-toast__body", onClick: onTextClick, children: [
       title && /* @__PURE__ */ jsx147("div", { className: "ods-toast__title", children: title }),
-      item.description && /* @__PURE__ */ jsx147("div", { className: "ods-toast__desc", children: item.description })
+      item.description && /* @__PURE__ */ jsx147(
+        "div",
+        {
+          ref: descRef,
+          className: cn(
+            "ods-toast__desc",
+            cut && "ods-toast__desc--cut",
+            toggles && "ods-toast__desc--toggles"
+          ),
+          style: cut ? { "--ods-toast-clamp": item.clampLines } : void 0,
+          children: item.description
+        }
+      ),
+      toggles && /* @__PURE__ */ jsx147(
+        "button",
+        {
+          type: "button",
+          className: "ods-toast__more",
+          "aria-expanded": expanded,
+          onClick: (e) => {
+            e.stopPropagation();
+            toggle();
+          },
+          children: expanded ? "Less" : "More"
+        }
+      )
     ] }),
     (item.actionLabel || item.action) && /* @__PURE__ */ jsx147("div", { className: "ods-toast__action", children: item.actionLabel ? (
       // First-class action chip — consistent styling, auto-dismiss
@@ -34811,10 +34878,17 @@ function ToastBody({ item, onDismiss }) {
     )
   ] });
 }
-function PositionStack({ items, position, onDismiss, maxStack }) {
+function PositionStack({ items, position, onDismiss, onHold, onRelease, maxStack }) {
   const [hovered, setHovered] = useState71(false);
+  const [focused, setFocused] = useState71(false);
   const [pinned, setPinned] = useState71(false);
   const expanded = hovered || pinned;
+  const held = hovered || focused;
+  const ids = useMemo37(() => items.map((t) => t.id), [items]);
+  useEffect57(() => {
+    if (held) onHold(ids);
+    else onRelease(ids);
+  }, [held, ids, onHold, onRelease]);
   const ordered = useMemo37(() => [...items].reverse(), [items]);
   const isBottom = position.startsWith("bottom");
   const dir = isBottom ? -1 : 1;
@@ -34842,6 +34916,10 @@ function PositionStack({ items, position, onDismiss, maxStack }) {
       ),
       onMouseEnter: () => setHovered(true),
       onMouseLeave: () => setHovered(false),
+      onFocus: () => setFocused(true),
+      onBlur: (e) => {
+        if (!e.currentTarget.contains(e.relatedTarget)) setFocused(false);
+      },
       "aria-live": "polite",
       children: [
         /* @__PURE__ */ jsx147(
@@ -34879,7 +34957,14 @@ function PositionStack({ items, position, onDismiss, maxStack }) {
                       setPinned(true);
                     }
                   },
-                  children: /* @__PURE__ */ jsx147(ToastBody, { item, onDismiss })
+                  children: /* @__PURE__ */ jsx147(
+                    ToastBody,
+                    {
+                      item,
+                      stacked: !expanded && items.length > 1,
+                      onDismiss
+                    }
+                  )
                 },
                 item.id
               );
@@ -34916,29 +35001,51 @@ function ToastProvider({
   const [toasts, setToasts] = useState71([]);
   const timers = useRef50(/* @__PURE__ */ new Map());
   const idCounter2 = useRef50(0);
-  const dismiss = useCallback51((id) => {
-    setToasts((prev) => prev.filter((t) => t.id !== id));
-    const timer = timers.current.get(id);
-    if (timer) {
-      clearTimeout(timer);
-      timers.current.delete(id);
-    }
+  const forget = useCallback51((id) => {
+    const c = timers.current.get(id);
+    if (c?.handle) clearTimeout(c.handle);
+    timers.current.delete(id);
   }, []);
-  const dismissAll = useCallback51((position) => {
-    setToasts((prev) => {
-      const remaining = position ? prev.filter((t) => t.position !== position) : [];
-      for (const t of prev) {
-        if (!remaining.find((r) => r.id === t.id)) {
-          const timer = timers.current.get(t.id);
-          if (timer) {
-            clearTimeout(timer);
-            timers.current.delete(t.id);
-          }
+  const dismiss = useCallback51(
+    (id) => {
+      setToasts((prev) => prev.filter((t) => t.id !== id));
+      forget(id);
+    },
+    [forget]
+  );
+  const dismissAll = useCallback51(
+    (position) => {
+      setToasts((prev) => {
+        const remaining = position ? prev.filter((t) => t.position !== position) : [];
+        for (const t of prev) {
+          if (!remaining.find((r) => r.id === t.id)) forget(t.id);
         }
-      }
-      return remaining;
-    });
+        return remaining;
+      });
+    },
+    [forget]
+  );
+  const hold = useCallback51((ids) => {
+    const now2 = Date.now();
+    for (const id of ids) {
+      const c = timers.current.get(id);
+      if (!c || c.handle === null) continue;
+      clearTimeout(c.handle);
+      c.handle = null;
+      c.remaining = Math.max(0, c.remaining - (now2 - c.since));
+    }
   }, []);
+  const release = useCallback51(
+    (ids) => {
+      for (const id of ids) {
+        const c = timers.current.get(id);
+        if (!c || c.handle !== null) continue;
+        c.since = Date.now();
+        c.handle = setTimeout(() => dismiss(id), c.remaining);
+      }
+    },
+    [dismiss]
+  );
   const toast = useCallback51(
     (options2) => {
       const id = `toast-${++idCounter2.current}`;
@@ -34955,12 +35062,16 @@ function ToastProvider({
         render: options2.render,
         duration: options2.duration ?? 5e3,
         closeable: options2.closeable ?? true,
-        position: options2.position ?? defaultPosition
+        position: options2.position ?? defaultPosition,
+        clampLines: options2.clampLines ?? 2
       };
       setToasts((prev) => [...prev, item]);
       if (item.duration > 0) {
-        const timer = setTimeout(() => dismiss(id), item.duration);
-        timers.current.set(id, timer);
+        timers.current.set(id, {
+          handle: setTimeout(() => dismiss(id), item.duration),
+          remaining: item.duration,
+          since: Date.now()
+        });
       }
       return id;
     },
@@ -34988,7 +35099,9 @@ function ToastProvider({
         items: list,
         position: pos,
         maxStack,
-        onDismiss: dismiss
+        onDismiss: dismiss,
+        onHold: hold,
+        onRelease: release
       },
       pos
     );
@@ -35840,7 +35953,7 @@ UserCard.displayName = "UserCard";
 import { useId as useId64, useState as useState74 } from "react";
 
 // src/hooks/useRelativeTime.ts
-import { useEffect as useEffect57, useState as useState73 } from "react";
+import { useEffect as useEffect58, useState as useState73 } from "react";
 function toMs(t) {
   if (t == null) return null;
   return typeof t === "number" ? t : t.getTime();
@@ -35860,7 +35973,7 @@ function formatRelativeTime(when, now2 = Date.now()) {
 function useRelativeTime(date, options2 = {}) {
   const { intervalMs = 3e4 } = options2;
   const [now2, setNow] = useState73(() => Date.now());
-  useEffect57(() => {
+  useEffect58(() => {
     if (typeof window === "undefined") return;
     const id = window.setInterval(() => setNow(Date.now()), intervalMs);
     return () => window.clearInterval(id);
@@ -35924,7 +36037,20 @@ function VersionHistory({
 }) {
   const [expandedId, setExpandedId] = useState74(defaultExpandedId);
   const baseId = useId64();
-  const showToolbar = Boolean(tabs && tabs.length > 0 || onRefresh);
+  const showToolbar = Boolean(tabs && tabs.length > 0);
+  const refreshButton = onRefresh ? /* @__PURE__ */ jsx155(
+    "button",
+    {
+      type: "button",
+      className: "ods-version-history__refresh",
+      onClick: onRefresh,
+      disabled: refreshing,
+      "aria-label": "Refresh history",
+      title: "Refresh",
+      "data-spinning": refreshing || void 0,
+      children: /* @__PURE__ */ jsx155(RefreshGlyph, {})
+    }
+  ) : null;
   return /* @__PURE__ */ jsxs149(
     SlideoutPanel,
     {
@@ -35933,6 +36059,7 @@ function VersionHistory({
       position,
       width,
       title,
+      headerActions: showToolbar ? void 0 : refreshButton,
       offsetTop,
       offsetBottom,
       className: cn("ods-version-history", className),
@@ -35960,19 +36087,7 @@ function VersionHistory({
               tab.id
             );
           }) }) : /* @__PURE__ */ jsx155("span", {}),
-          onRefresh && /* @__PURE__ */ jsx155(
-            "button",
-            {
-              type: "button",
-              className: "ods-version-history__refresh",
-              onClick: onRefresh,
-              disabled: refreshing,
-              "aria-label": "Refresh history",
-              title: "Refresh",
-              "data-spinning": refreshing || void 0,
-              children: /* @__PURE__ */ jsx155(RefreshGlyph, {})
-            }
-          )
+          refreshButton
         ] }),
         error && /* @__PURE__ */ jsx155("div", { className: "ods-version-history__banner", children: /* @__PURE__ */ jsx155(Banner, { variant: "error", appearance: "subtle", title: "Couldn't load history", description: error }) }),
         /* @__PURE__ */ jsx155("div", { className: "ods-version-history__body", role: "tabpanel", children: loading ? /* @__PURE__ */ jsxs149("div", { className: "ods-version-history__status", role: "status", "aria-live": "polite", children: [
@@ -37177,7 +37292,7 @@ import {
 } from "@octaviaflow/icons";
 
 // src/hooks/useWorkflowRuntime.ts
-import { useEffect as useEffect58, useState as useState76 } from "react";
+import { useEffect as useEffect59, useState as useState76 } from "react";
 function toMs2(t) {
   if (t == null) return null;
   return typeof t === "number" ? t : t.getTime();
@@ -37192,7 +37307,7 @@ function formatWorkflowRuntime(ms) {
 }
 function useWorkflowRuntime(startedAt, active) {
   const [, force] = useState76(0);
-  useEffect58(() => {
+  useEffect59(() => {
     if (!active || startedAt == null) return;
     if (typeof window === "undefined") return;
     const id = window.setInterval(() => force((n) => n + 1), 1e3);
@@ -37572,13 +37687,13 @@ function WorkflowHeaderExpanded({
 }
 
 // src/hooks/useBanner.ts
-import { useCallback as useCallback56, useEffect as useEffect59, useRef as useRef52, useState as useState77 } from "react";
+import { useCallback as useCallback56, useEffect as useEffect60, useRef as useRef52, useState as useState77 } from "react";
 function useBanner(options2 = {}) {
   const { defaultOpen = false, autoDismissAfter, onDismiss } = options2;
   const [open, setOpen] = useState77(defaultOpen);
   const timerRef = useRef52(null);
   const onDismissRef = useRef52(onDismiss);
-  useEffect59(() => {
+  useEffect60(() => {
     onDismissRef.current = onDismiss;
   }, [onDismiss]);
   const clearTimer = useCallback56(() => {
@@ -37609,7 +37724,7 @@ function useBanner(options2 = {}) {
     if (open) hide();
     else show();
   }, [open, show, hide]);
-  useEffect59(() => () => clearTimer(), [clearTimer]);
+  useEffect60(() => () => clearTimer(), [clearTimer]);
   return {
     open,
     show,
@@ -37677,7 +37792,7 @@ function breakpointMinWidth(name) {
 }
 
 // src/hooks/useCallout.ts
-import { useCallback as useCallback57, useEffect as useEffect60, useState as useState78 } from "react";
+import { useCallback as useCallback57, useEffect as useEffect61, useState as useState78 } from "react";
 var STORAGE_PREFIX = "ods:callout:dismissed:";
 function readPersisted(key) {
   if (!key || typeof window === "undefined") return false;
@@ -37701,7 +37816,7 @@ function writePersisted(key, value) {
 function useCallout(options2 = {}) {
   const { defaultOpen = true, persistKey, onDismiss } = options2;
   const [open, setOpen] = useState78(defaultOpen);
-  useEffect60(() => {
+  useEffect61(() => {
     if (persistKey && readPersisted(persistKey)) {
       setOpen(false);
     }
@@ -38239,6 +38354,14 @@ var DEFAULT_NOTIFICATION_CATALOG = [
         subjectNoun: "app",
         defaultEmail: false
       },
+      {
+        key: "connector.expiring_soon",
+        label: "App sign-in expires soon",
+        phrase: "an app's sign-in is about to expire",
+        severity: "warning",
+        audience: "org",
+        subjectNoun: "app"
+      },
       {
         key: "connector.test_failed",
         label: "Connection test failed",
@@ -39522,7 +39645,7 @@ NotificationChannelCard.displayName = "NotificationChannelCard";
 
 // src/notifications/components/NotificationChannelDialog/NotificationChannelDialog.tsx
 import { SendIcon as SendIcon2 } from "@octaviaflow/icons";
-import { useEffect as useEffect61, useMemo as useMemo42, useState as useState86 } from "react";
+import { useEffect as useEffect62, useMemo as useMemo42, useState as useState86 } from "react";
 
 // src/notifications/engine/channels.ts
 var CONNECTED_CHANNEL_TYPES = [
@@ -39980,7 +40103,7 @@ function NotificationChannelDialog({
   const [testing, setTesting] = useState86(false);
   const [testResult, setTestResult] = useState86(null);
   const [submitError, setSubmitError] = useState86(null);
-  useEffect61(() => {
+  useEffect62(() => {
     if (!open) return;
     setDraft(draftFromChannel(channel, initialType));
     setSubmitted(false);
@@ -40921,13 +41044,13 @@ NotificationRuleList.displayName = "NotificationRuleList";
 
 // src/provider/OdsProvider.tsx
 import { generateCssVars, resolveConfig } from "@octaviaflow/config";
-import { createContext as createContext4, useContext as useContext5, useEffect as useEffect62, useMemo as useMemo45 } from "react";
+import { createContext as createContext4, useContext as useContext5, useEffect as useEffect63, useMemo as useMemo45 } from "react";
 import { OverlayProvider as OverlayProvider3 } from "react-aria";
 import { jsx as jsx173 } from "react/jsx-runtime";
 var OdsContext = createContext4(null);
 function OdsProvider({ config: userConfig, children }) {
   const resolved = useMemo45(() => resolveConfig(userConfig), [userConfig]);
-  useEffect62(() => {
+  useEffect63(() => {
     const cssVarsBlock = generateCssVars(resolved);
     const match = cssVarsBlock.match(/:root\s*\{([\s\S]*)\}/);
     if (match) {