flexdesk 0.5.0 → 0.6.1

package/dist/tiles.js

@@ -1,12 +1,3 @@
-import {
-  ActionDropdown
-} from "./chunk-O5OHMWBB.js";
-import {
-  openRawTracesWindow
-} from "./chunk-CNXP3SIN.js";
-import "./chunk-KH2GJTKR.js";
-import "./chunk-6JSOVNID.js";
-import "./chunk-FL5KFNQH.js";
 import {
   TileRegistry,
   createWidget,
@@ -20,6 +11,15 @@ import {
   setTileLogger,
   tile_registry_exports
 } from "./chunk-FOOS3T5L.js";
+import {
+  ActionDropdown
+} from "./chunk-O5OHMWBB.js";
+import {
+  openRawTracesWindow
+} from "./chunk-ZMCRDOCF.js";
+import "./chunk-IYV5JVYB.js";
+import "./chunk-6JSOVNID.js";
+import "./chunk-FL5KFNQH.js";
 import {
   __toCommonJS
 } from "./chunk-JYWURG5T.js";

package/dist/tokens.css

@@ -193,4 +193,76 @@
        to its OWN 0.4 values when a token is unset (normal: 6px 8px and an
        inherited line height; compact: 2px 6px and 1.35), and a default here
        would replace both densities' values with one. */
+
+    /* ── Flow editors (@flexdesk/flow) — TONES, not colours ───────────
+       A step-type category names a TONE (`violet`, `teal`, `amber`, `grey`,
+       `blue`, `indigo`) and these map the tone to its colours, so a consumer
+       restyles every editor's categories here and nowhere else. Each tone is:
+
+           -bg / -fg       a step's icon chip, a picker row's chip, a chip's fill
+           -line           a reference chip's border
+           -icon-bg        a lane card's icon zone
+           -text-bg        a lane card's text zone
+           -dot            a step tab's dot
+
+       New in the flow work and read by nothing older, so defining them
+       changes no existing screen. The values are the approved mocks'. */
+    --twm-flow-violet-bg:      rgba(167, 139, 250, 0.16);
+    --twm-flow-violet-fg:      #c6b4fb;
+    --twm-flow-violet-line:    rgba(167, 139, 250, 0.45);
+    --twm-flow-violet-icon-bg: #351a40;
+    --twm-flow-violet-text-bg: #261e30;
+    --twm-flow-violet-dot:     #a785e8;
+
+    --twm-flow-teal-bg:        rgba(45, 180, 165, 0.17);
+    --twm-flow-teal-fg:        #72d8c8;
+    --twm-flow-teal-line:      rgba(45, 180, 165, 0.45);
+    --twm-flow-teal-icon-bg:   #1a403a;
+    --twm-flow-teal-text-bg:   #1a2b2a;
+    --twm-flow-teal-dot:       #3fb8a6;
+
+    --twm-flow-amber-bg:       rgba(222, 150, 70, 0.17);
+    --twm-flow-amber-fg:       #ecb27a;
+    --twm-flow-amber-line:     rgba(215, 163, 74, 0.45);
+    --twm-flow-amber-icon-bg:  #3a3018;
+    --twm-flow-amber-text-bg:  #2b2518;
+    --twm-flow-amber-dot:      #d79a52;
+
+    --twm-flow-grey-bg:        rgba(255, 255, 255, 0.08);
+    --twm-flow-grey-fg:        #c4c4c4;
+    --twm-flow-grey-line:      rgba(255, 255, 255, 0.28);
+    --twm-flow-grey-icon-bg:   #333334;
+    --twm-flow-grey-text-bg:   #262627;
+    --twm-flow-grey-dot:       #9a9a9a;
+
+    --twm-flow-blue-bg:        rgba(22, 131, 196, 0.22);
+    --twm-flow-blue-fg:        #a8d4f2;
+    --twm-flow-blue-line:      rgba(80, 160, 220, 0.45);
+    --twm-flow-blue-icon-bg:   #173447;
+    --twm-flow-blue-text-bg:   #1a2630;
+    --twm-flow-blue-dot:       #4aa3dc;
+
+    --twm-flow-indigo-bg:      rgba(127, 140, 240, 0.17);
+    --twm-flow-indigo-fg:      #aab6fb;
+    --twm-flow-indigo-line:    rgba(127, 140, 240, 0.45);
+    --twm-flow-indigo-icon-bg: #252850;
+    --twm-flow-indigo-text-bg: #1e1f30;
+    --twm-flow-indigo-dot:     #7f8cf0;
+
+    /* The kit's own surfaces and signal colours (the mocks' values). The
+       focus ring is the canonical bright accent, so a consumer that restyles
+       the accent restyles it. */
+    --twm-flow-control-bg:     #2b2b2c;
+    --twm-flow-control-border: #454545;
+    --twm-flow-muted:          #a6a6a6;
+    --twm-flow-focus:          var(--accent-bright);
+    --twm-flow-error:          #f48771;
+    --twm-flow-error-bg:       rgba(244, 135, 113, 0.09);
+    --twm-flow-error-line:     rgba(244, 135, 113, 0.35);
+    --twm-flow-error-text:     #f2cfc6;
+    --twm-flow-warning:        #e2b366;
+    --twm-flow-warning-bg:     rgba(226, 179, 102, 0.09);
+    --twm-flow-warning-line:   rgba(226, 179, 102, 0.35);
+    --twm-flow-warning-text:   #f0dcb8;
+    --twm-flow-ok:             #89d185;
 }

package/dist/widgets.js

@@ -7,14 +7,16 @@ import {
   helpCopy,
   helpProvider,
   hideContextMenu,
+  setHelpProvider,
+  showContextMenu
+} from "./chunk-H4LT43RS.js";
+import {
   modalHost,
   openConfirm,
   openForm,
   openModal,
-  setHelpProvider,
-  setModalHost,
-  showContextMenu
-} from "./chunk-24MS7W5Y.js";
+  setModalHost
+} from "./chunk-6NG7YVBG.js";
 import {
   ActionDropdown
 } from "./chunk-O5OHMWBB.js";
@@ -30,7 +32,7 @@ import {
   parseDatePeriod,
   parseDateValue,
   parseDuration
-} from "./chunk-KH2GJTKR.js";
+} from "./chunk-IYV5JVYB.js";
 import {
   ManagedWindow,
   ROW_CONTROL_SELECTOR,
@@ -5486,6 +5488,85 @@ function installTabsScrollbars(selectors = [".tabs"]) {
   return () => observer.disconnect();
 }
 
+// src/ui/utils/scroll_lock.js
+function createScrollLock({ axis = "y", enabled = true } = {}) {
+  const doY = axis === "y" || axis === "both";
+  const doX = axis === "x" || axis === "both";
+  const members = /* @__PURE__ */ new Map();
+  let last = { top: 0, left: 0 };
+  let on = !!enabled;
+  function copyFrom(source) {
+    last = { top: source.scrollTop, left: source.scrollLeft };
+    if (!on) return;
+    for (const [el, state] of members) {
+      if (el === source) continue;
+      const top = doY ? last.top : el.scrollTop;
+      const left = doX ? last.left : el.scrollLeft;
+      if (el.scrollTop === top && el.scrollLeft === left) continue;
+      state.wrote = { top, left };
+      if (doY) el.scrollTop = top;
+      if (doX) el.scrollLeft = left;
+    }
+  }
+  function onScroll(event) {
+    const el = event.currentTarget;
+    const state = members.get(el);
+    if (!state) return;
+    const wrote = state.wrote;
+    state.wrote = null;
+    if (wrote && Math.abs(el.scrollTop - wrote.top) < 1 && Math.abs(el.scrollLeft - wrote.left) < 1) return;
+    copyFrom(el);
+  }
+  const lock = {
+    /** Join the group. Returns the function that leaves it. */
+    attach(el) {
+      if (!el || typeof el.addEventListener !== "function") return () => {
+      };
+      if (members.has(el)) return () => lock.detach(el);
+      const state = { wrote: null };
+      members.set(el, state);
+      el.addEventListener("scroll", onScroll, { passive: true });
+      if (on && (last.top || last.left)) {
+        state.wrote = {
+          top: doY ? last.top : el.scrollTop,
+          left: doX ? last.left : el.scrollLeft
+        };
+        if (doY) el.scrollTop = last.top;
+        if (doX) el.scrollLeft = last.left;
+      }
+      return () => lock.detach(el);
+    },
+    detach(el) {
+      if (!members.has(el)) return;
+      members.delete(el);
+      el.removeEventListener("scroll", onScroll);
+    },
+    /** Lock (true) or let the members scroll freely (false). Locking again
+     *  brings every member level with the one scrolled last. */
+    setEnabled(value) {
+      const was = on;
+      on = !!value;
+      if (on && !was) {
+        const source = [...members.keys()].find(
+          (el) => el.scrollTop === last.top && el.scrollLeft === last.left
+        ) || members.keys().next().value;
+        if (source) copyFrom(source);
+      }
+    },
+    get enabled() {
+      return on;
+    },
+    /** How many boxes are in the group (for a consumer's own checks). */
+    get size() {
+      return members.size;
+    },
+    dispose() {
+      for (const el of [...members.keys()]) lock.detach(el);
+    }
+  };
+  return lock;
+}
+
 // src/ui/utils/tooltip_service.js
 var tooltipElement = null;
 var currentTarget = null;
@@ -5765,6 +5846,7 @@ export {
   attachInlineRenamer,
   createDetailHeader,
   createRafResizeObserver,
+  createScrollLock,
   createTableStateStore,
   createTreeCategory,
   createTreeItem,