@lavalogic/scoria 0.37.30 → 0.37.32

package/dist/Components/Table/ColumnFactory.svelte.js

@@ -376,6 +376,16 @@ export function createColumnFactory() {
                 filterValueType: opts.filterValueType ?? FilterValueType.String,
                 getSortingFn: opts.getSortingFn,
                 getOptions: normalisedOptions,
+                // Forward reactiveDependencies onto the def so
+                // `makeRow.getValue` can read them synchronously before
+                // calling the (possibly async) accessor. Without this,
+                // reactive reads that happen only after `await` inside
+                // the consumer's `value` callback are not tracked by the
+                // cell's `$derived`, and downstream display cells never
+                // refresh when a sibling field is edited (visible on the
+                // Receipt pod table: Title / UoM did not reload after the
+                // SKU select changed `item.receiptLineId`).
+                reactiveDependencies: opts.reactiveDependencies,
             });
             return makeSpec('display', def);
         },

package/dist/Components/Table/Types/Columns/Definitions/ColumnDef.svelte.d.ts

@@ -92,6 +92,17 @@ export interface ColumnDefProps<T extends object, in FilterFnType, out OptionsTy
      *  advanced filter panel. See `BaseColumnOptions.filterGroup` for
      *  the consumer-facing description. */
     filterGroup?: string;
+    /**
+     * Optional thunk returning a list of additional reactive values the
+     * cell renderer should depend on. Read synchronously from
+     * `cell.getValue` before the (possibly async) `accessorFn` runs, so
+     * Svelte's `$derived` tracking captures these row-level reads even
+     * when the user's accessor reads them only after an `await` (where
+     * tracking is no longer active). Use when a column's displayed
+     * value depends on a sibling field that the accessor reads after a
+     * `Promise.then` / `await` boundary.
+     */
+    reactiveDependencies?: (row: T) => ReadonlyArray<unknown>;
 }
 /**
  * `ColumnDef<T, FilterFnType, OptionsType, TValue>` is the abstract base
@@ -137,6 +148,13 @@ export declare abstract class ColumnDef<T extends object, in FilterFnType = neve
     readonly isValid: ValidationFn<T> | undefined;
     /** Reads the row value. Required at the `AccessorDef` subclass layer. */
     readonly accessorFn: AccessorFn<T, TValue> | undefined;
+    /**
+     * Optional thunk returning a list of additional reactive values the
+     * cell should depend on. Read synchronously by `cell.getValue` so
+     * Svelte's `$derived` tracking picks them up even when the user's
+     * `accessorFn` accesses them only after an `await` boundary.
+     */
+    readonly reactiveDependencies: ((row: T) => ReadonlyArray<unknown>) | undefined;
     /** Filter predicate. Each subclass narrows the generic parameter. */
     abstract filterFn: FilterFn<T, FilterFnType> | undefined;
     private _minSize;

package/dist/Components/Table/Types/Columns/Definitions/ColumnDef.svelte.js

@@ -63,6 +63,7 @@ export class ColumnDef {
         // user function's synchronous portion). The per-Def WeakMap was
         // an extra correctness-eating layer.
         this.getDisplayValue = $derived(props.getDisplayValue);
+        this.reactiveDependencies = $derived(props.reactiveDependencies);
         this.debug = $derived(props.debug ?? false);
         this.getSortingFn = $derived(props.getSortingFn);
         this.getOptions = $derived(props.getOptions);
@@ -90,6 +91,13 @@ export class ColumnDef {
     isValid;
     /** Reads the row value. Required at the `AccessorDef` subclass layer. */
     accessorFn;
+    /**
+     * Optional thunk returning a list of additional reactive values the
+     * cell should depend on. Read synchronously by `cell.getValue` so
+     * Svelte's `$derived` tracking picks them up even when the user's
+     * `accessorFn` accesses them only after an `await` boundary.
+     */
+    reactiveDependencies;
     _minSize;
     /** Minimum width in pixels. */
     get minSize() {

package/dist/Components/Table/Types/Context/TableContext.svelte.js

@@ -1833,6 +1833,19 @@ export class TableContext {
                 id: `${index}_${def.id}`,
                 row: row,
                 getValue: () => {
+                    // Read declared reactive dependencies synchronously so the
+                    // caller's `$derived` registers them even when the
+                    // (possibly async) accessor reads them only after an
+                    // `await` (where Svelte's tracking context is no longer
+                    // active). The returned tuple is read for its side-effect
+                    // of touching each entry through the row proxy; the
+                    // values themselves are discarded.
+                    const deps = def.reactiveDependencies?.(item);
+                    if (deps) {
+                        for (let i = 0; i < deps.length; i++) {
+                            void deps[i];
+                        }
+                    }
                     const gotValue = def.accessorFn?.(item, index);
                     if (gotValue !== undefined) {
                         return gotValue;

package/dist/Components/Table/Types/Public/ColumnOptions.d.ts

@@ -184,6 +184,18 @@ export interface DisplayColumnOptions<TRow extends object, TValue = unknown> ext
      * types.
      */
     getOptions?: () => ReadonlyArray<SelectOption<TValue>> | Promise<ReadonlyArray<SelectOption<TValue>>>;
+    /**
+     * Optional thunk returning a list of additional reactive values
+     * this column's `value` callback depends on. Read synchronously
+     * by the cell renderer before invoking `value` so Svelte's
+     * `$derived` tracking captures those row-level reads, even when
+     * the `value` callback reads them only after an `await` boundary
+     * (where reactive tracking is no longer active). Use when the
+     * computed value depends on a sibling field that is read inside
+     * the async portion of `value` (e.g. `(row) => [row.fkId]` for a
+     * display column that fetches a foreign-key entity by id).
+     */
+    reactiveDependencies?: (row: TRow) => ReadonlyArray<unknown>;
 }
 /** Options for `col.bubble({ header, value, colour, ... })`. Renders one or
  *  more coloured pill bubbles per row. */

package/dist/Helpers/dropdownPortal.js

@@ -140,6 +140,34 @@ export function attachDropdownPortal(options) {
     const handleResize = () => {
         throttled.schedule();
     };
+    /**
+     * Direct mousedown listener attached to the portaled dropdown that
+     * calls `preventDefault()` to keep focus on the Svelecte input while
+     * the user clicks an option.
+     *
+     * Svelecte already attaches `onmousedown={preventDefault}` to the
+     * `.sv_dropdown` element in template, but Svelte 5 wires inline
+     * event handlers through its delegated-event chain rooted at the
+     * original mount point. Once we `appendChild` the dropdown to
+     * `document.body` (or to a `<dialog>` ancestor) the delegated chain
+     * no longer finds this element, the inline handler never fires,
+     * the browser's default mousedown shifts focus to the option (or to
+     * `body`), Svelecte's `on_blur` runs `updateDropdownState(false)`
+     * which closes the dropdown, this helper's MutationObserver moves
+     * the dropdown back into place, and the `mouseup` / `click` events
+     * never reach an option element. The visible symptom: keyboard
+     * selection (Enter) works, mouse click does not.
+     *
+     * Adding a *direct* `addEventListener` on the dropdown bypasses
+     * Svelte's delegation entirely. The listener is reset every
+     * `portalOut` / `portalIn` cycle.
+     */
+    const preventFocusShiftOnMousedown = (e) => {
+        // Same intent as Svelecte's own `on_mouse_down`. Keep focus on
+        // the input so `on_blur` does not collapse the dropdown before
+        // the click event reaches its selection handler.
+        e.preventDefault();
+    };
     const portalOut = () => {
         if (isPortalled) {
             return;
@@ -171,6 +199,9 @@ export function attachDropdownPortal(options) {
         // portal clicks should check
         // `el.closest('[data-scoria-portal-dropdown]')`.
         dropdown.setAttribute('data-scoria-portal-dropdown', '');
+        // Restore the focus-preserving mousedown handler that Svelte's
+        // delegated event chain no longer reaches after the move.
+        dropdown.addEventListener('mousedown', preventFocusShiftOnMousedown);
         isPortalled = true;
         // First-frame measurement: lay out, then reposition again on
         // the next frame so we measure the dropdown's real
@@ -189,6 +220,7 @@ export function attachDropdownPortal(options) {
             return;
         }
         throttled.cancel();
+        dropdown.removeEventListener('mousedown', preventFocusShiftOnMousedown);
         window.removeEventListener('scroll', handleScroll, { capture: true });
         window.removeEventListener('resize', handleResize);
         // Strip the inline overrides so Svelecte's next open starts

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@lavalogic/scoria",
   "description": "Svelte components used for the FloWMS Web Frontend",
-  "version": "0.37.30",
+  "version": "0.37.32",
   "publishConfig": {
     "access": "restricted"
   },