@lavalogic/scoria 0.37.14 → 0.37.15

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

@@ -111,6 +111,12 @@ function commonProps(opts, kind) {
         width: opts.width ?? defaultWidth,
         maxWidth: opts.maxWidth,
         wrapValue: opts.wrapValue,
+        // `widthIsFixed` is true only when the caller passed an explicit
+        // `width`. The grid template uses this to render the track as
+        // fixed `${W}px` for explicit widths, leaving the per-kind-default
+        // columns on `minmax(W, 1fr)` so they absorb any horizontal space
+        // the fixed columns leave behind.
+        widthIsFixed: opts.width != null,
         allowSorting: opts.allowSorting,
         allowFiltering: opts.allowFiltering,
         defaultHidden: opts.defaultHidden,
@@ -285,7 +291,12 @@ export function createColumnFactory() {
                 // typed kinds where the factory pins one based on the
                 // column kind). Consumers opt in by passing the type they
                 // want the filter input rendered as.
-                filterValueType: opts.filterValueType,
+                // Default to string-typed filter when the caller did not specify
+                // one, so a display column with no explicit `filterValueType`
+                // still appears in the filter UI (matches the `DisplayDef →
+                // stringFilter (undefined case)` mapping in
+                // `setupDefaultColumnDefs`).
+                filterValueType: opts.filterValueType ?? FilterValueType.String,
                 getSortingFn: opts.getSortingFn,
                 getOptions: normalisedOptions,
             });
@@ -298,7 +309,12 @@ export function createColumnFactory() {
                 ...commonProps(opts, 'bubble'),
                 accessorFn: opts.value,
                 getColour: opts.colour,
-                filterValueType: opts.filterValueType,
+                // Default to a string-typed filter so bubble columns appear in
+                // the quick-filter row and advanced filter panel by default
+                // (matches the `BubbleDef → stringFilter` mapping in
+                // `setupDefaultColumnDefs`). Caller can override to any other
+                // `filterValueType`, or pass `allowFiltering: false` to opt out.
+                filterValueType: opts.filterValueType ?? FilterValueType.String,
             });
             return makeSpec('bubble', def);
         },
@@ -324,7 +340,10 @@ export function createColumnFactory() {
                 ...commonProps(opts, 'progress'),
                 accessorFn: tupleAccessor,
                 getColour,
-                filterValueType: opts.filterValueType,
+                // Default to number-typed filter so progress columns appear in
+                // the filter UI by default (matches `ProgressBarDef →
+                // numberFilter` in `setupDefaultColumnDefs`).
+                filterValueType: opts.filterValueType ?? FilterValueType.Number,
             });
             return makeSpec('progress', def);
         },
@@ -336,6 +355,7 @@ export function createColumnFactory() {
                 header: opts?.header ?? '',
                 minSize: opts?.minWidth ?? KIND_DEFAULT_WIDTHS.validity,
                 width: opts?.width ?? KIND_DEFAULT_WIDTHS.validity,
+                widthIsFixed: opts?.width != null,
                 defaultHidden: opts?.defaultHidden,
                 resizable: opts?.resizable ?? false,
                 debug: opts?.debug,
@@ -354,6 +374,7 @@ export function createColumnFactory() {
             // fallback and share equal `1fr` track space with wider columns.
             def.width = KIND_DEFAULT_WIDTHS.rowSelection;
             def.minSize = KIND_DEFAULT_WIDTHS.rowSelection;
+            def.widthIsFixed = true;
             return makeSpec('rowSelection', def);
         },
         actions(opts) {
@@ -378,6 +399,7 @@ export function createColumnFactory() {
             });
             // Actions has no public width option - apply the per-kind default.
             def.width = KIND_DEFAULT_WIDTHS.actions;
+            def.widthIsFixed = true;
             return makeSpec('actions', def);
         },
         expand(opts) {
@@ -423,6 +445,7 @@ export function createColumnFactory() {
             // Expand has no public width option - apply the per-kind default.
             def.width = KIND_DEFAULT_WIDTHS.expand;
             def.minSize = KIND_DEFAULT_WIDTHS.expand;
+            def.widthIsFixed = true;
             return makeSpec('expand', def);
         },
         filterOnly(opts) {

package/dist/Components/Table/Table.svelte

@@ -356,17 +356,20 @@
 	//   20px to match the existing visual).
 	// - Each other track uses one of two strategies based on the
 	//   column's `userResized` flag:
-	//   - `userResized = false` (default): `minmax(width, maxWidth ?? 1fr)`.
-	//     The column is at least `width` wide and grows to share any
-	//     leftover horizontal space with its sibling tracks. If the
-	//     column has a `maxWidth`, that pixel value is the upper bound
-	//     instead - the column never grows past `maxWidth`, and cells
-	//     whose content exceeds the track ellipsise (or wrap, when the
-	//     column opts in to `wrapValue`). The `1fr` upper bound was
-	//     chosen over `max-content` because `max-content` is unstable
-	//     under row virtualisation: tracks resize as rows scroll in
-	//     and out of the rendered window because the auto-min/max
-	//     consults only the currently-rendered cells.
+	//   - `userResized = false`: track depends on whether the consumer
+	//     supplied an explicit `width` and / or `maxWidth`:
+	//       - `widthIsFixed` (consumer-supplied `width`, no `maxWidth`):
+	//         fixed `${width}px` track. Stays at exactly that pixel value
+	//         regardless of leftover container width.
+	//       - `maxWidth` set (with or without explicit width): the track
+	//         becomes `minmax(${width}px, ${maxWidth}px)`, a bounded flex
+	//         that grows up to `maxWidth` and is then capped.
+	//       - Neither (the column is on its per-kind default width):
+	//         `minmax(${width}px, 1fr)`, the column flexes to absorb any
+	//         horizontal space the fixed-width tracks leave behind.
+	//     This produces the "specify widths for the columns you care
+	//     about; let the rest fill the gap" behaviour that mirrors the
+	//     legacy `<table>` element when only some columns set a width.
 	//   - `userResized = true`: `${width}px` (fixed). The column sits
 	//     at exactly the size the user dragged it to, and dragging the
 	//     handle again only changes this column.
@@ -378,14 +381,23 @@
 	const colsTemplate = $derived.by(() => {
 		void tableContext.columnSizing;
 		const track = (col: {
-			columnDef: { width: number; maxWidth?: number; userResized: boolean };
+			columnDef: {
+				width: number;
+				maxWidth?: number;
+				userResized: boolean;
+				widthIsFixed: boolean;
+			};
 		}) => {
 			if (col.columnDef.userResized) {
 				return `${col.columnDef.width}px`;
 			}
-			const upper =
-				col.columnDef.maxWidth != null ? `${col.columnDef.maxWidth}px` : '1fr';
-			return `minmax(${col.columnDef.width}px, ${upper})`;
+			if (col.columnDef.maxWidth != null) {
+				return `minmax(${col.columnDef.width}px, ${col.columnDef.maxWidth}px)`;
+			}
+			if (col.columnDef.widthIsFixed) {
+				return `${col.columnDef.width}px`;
+			}
+			return `minmax(${col.columnDef.width}px, 1fr)`;
 		};
 		const tracks: Array<string> = ['20px'];
 		for (const col of leftColumns) {

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

@@ -53,6 +53,14 @@ export interface ColumnDefProps<T extends object, in FilterFnType, out OptionsTy
      *  Cell content beyond the track is ellipsised, or wraps when
      *  `wrapValue` is also set. */
     maxWidth?: Pixels;
+    /** Set by the column factory when the consumer supplied an explicit
+     *  `width` (vs. the factory's per-kind default). The grid template
+     *  treats an explicit width as fixed (`${width}px` track) and a
+     *  per-kind default as flexible (`minmax(width, 1fr)` track), so a
+     *  table whose specified widths total less than the container leaves
+     *  the unspecified columns to absorb the trailing space rather than
+     *  every column expanding by equal `1fr` shares. */
+    widthIsFixed?: boolean;
     /** When true, cell content that does not fit wraps onto new lines
      *  and the row's height grows to fit. When false (default) overflow
      *  is clipped with ellipsis. Surfaces as the `--wrap-value` CSS
@@ -148,6 +156,12 @@ export declare abstract class ColumnDef<T extends object, in FilterFnType = neve
      *  clipped with ellipsis (false). */
     get wrapValue(): boolean;
     set wrapValue(v: boolean);
+    private _widthIsFixed;
+    /** Set by the column factory when the consumer supplied an explicit
+     *  `width`. Drives the grid-template branch: true = fixed `${width}px`
+     *  track, false = `minmax(width, 1fr)` flex track. */
+    get widthIsFixed(): boolean;
+    set widthIsFixed(v: boolean);
     private _isResizing;
     /** Whether the resize handle is currently active. */
     get isResizing(): boolean;

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

@@ -38,6 +38,7 @@ export class ColumnDef {
         this._width = $state(props.width ?? props.minSize ?? 48);
         this._maxWidth = $state(props.maxWidth);
         this._wrapValue = $state(props.wrapValue ?? false);
+        this._widthIsFixed = $state(props.widthIsFixed ?? false);
         this.isEditable = $derived(props.isEditable ?? (() => Promise.resolve(false)));
         this.resizable = $derived(props.resizable ?? true);
         this.header = $derived(props.header);
@@ -108,6 +109,16 @@ export class ColumnDef {
     set wrapValue(v) {
         this._wrapValue = v;
     }
+    _widthIsFixed;
+    /** Set by the column factory when the consumer supplied an explicit
+     *  `width`. Drives the grid-template branch: true = fixed `${width}px`
+     *  track, false = `minmax(width, 1fr)` flex track. */
+    get widthIsFixed() {
+        return this._widthIsFixed;
+    }
+    set widthIsFixed(v) {
+        this._widthIsFixed = v;
+    }
     _isResizing = $state(false);
     /** Whether the resize handle is currently active. */
     get isResizing() {

package/package.json

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