@conduction/nextcloud-vue 2.105.0 → 2.106.0

package/src/css/look-board-detail.css

@@ -25,7 +25,7 @@
 /* ---- The header: two rows on the ground ------------------------------- */
 
 .cn-look-board .cn-detail-page__header--board {
-	align-items: center;
+	align-items: flex-start;
 	column-gap: 16px;
 	flex-wrap: wrap;
 	margin-bottom: 22px;
@@ -33,10 +33,16 @@
 	row-gap: 6px;
 }
 
-/* Row 1: the title takes what the buttons leave, from a 320px basis. */
+/* Row 1: the title takes what the buttons leave, from a zero basis, and the
+   buttons sit at the row's top beside it (DqZaak: both at 96). From a 320px
+   basis the title and its follow control claimed the row first, so on a 960px
+   header the buttons centred against a two-line title, and below that they
+   dropped to a row of their own. Only when less than 16rem of title fits
+   beside the buttons do they still wrap.
+   @spec openspec/changes/board-detail-header-row/specs/board-detail-header-row/spec.md#requirement-the-board-detail-header-keeps-its-actions-on-the-title-row */
 .cn-look-board .cn-detail-page__header--board > :first-child {
-	flex: 1 1 320px;
-	min-width: 0;
+	flex: 1 1 0;
+	min-width: min(100%, 16rem);
 }
 
 .cn-look-board .cn-detail-page__header--board .cn-detail-page__title {
@@ -58,6 +64,44 @@
 	min-height: var(--cn-board-control-height);
 }
 
+/* The quick actions, Edit and the Meer menu are the board's neutral buttons
+   (DqZaak): the main background, a grey border, the main text at 600. They
+   outrank a theme that gives every secondary button a primary outline with
+   `!important` (nldesign), as the index header does. The buildiq square and
+   the primary button keep their own rules. */
+.cn-look-board .cn-detail-page .cn-detail-page__header-actions > .button-vue--secondary,
+.cn-look-board .cn-detail-page .cn-detail-page__header-actions .action-item--secondary .action-item__menutoggle {
+	--nldesign-color-on-surface: var(--color-main-text);
+	height: var(--cn-board-control-height) !important;
+	min-height: var(--cn-board-control-height) !important;
+	padding: 0 14px !important;
+	border: 1px solid var(--color-border-dark) !important;
+	border-radius: var(--cn-board-control-radius) !important;
+	background: var(--color-main-background) !important;
+	color: var(--color-main-text) !important;
+	font-size: 14px !important;
+	font-weight: 600 !important;
+}
+
+.cn-look-board .cn-detail-page .cn-detail-page__header-actions > .button-vue--secondary:hover,
+.cn-look-board .cn-detail-page .cn-detail-page__header-actions .action-item--secondary .action-item__menutoggle:hover {
+	background: var(--color-background-hover) !important;
+}
+
+/* Each header icon is 16px with 8px to its label; NcButton draws 20px in a 30px slot. */
+.cn-look-board .cn-detail-page .cn-detail-page__header-actions > .button-vue--secondary .button-vue__icon {
+	width: 16px;
+	min-width: 16px;
+	height: 16px;
+	min-height: 16px;
+	margin-inline-end: 8px;
+}
+
+.cn-look-board .cn-detail-page .cn-detail-page__header-actions > .button-vue--secondary .button-vue__icon svg {
+	width: 16px;
+	height: 16px;
+}
+
 /* Row 2: pills, breadcrumb, dot, meta, chips. */
 .cn-look-board .cn-detail-page__header-row2 {
 	align-items: center;

package/src/css/look-board-index.css

@@ -10,12 +10,16 @@
 
 /* ------------------------------------------------------------------ header */
 
-/* Row 1: the h1 and the buttons at its end. Row 2: the count line, 6px under. */
+/* Row 1: the h1 and the buttons at its end, both at the row's top. Row 2:
+   the count line, 6px under. The header starts 4px under the content's top
+   (DqZaken: the title at 96, the count line at 142).
+   @spec openspec/changes/board-page-header-top/specs/board-page-header-top/spec.md#requirement-a-board-page-title-sits-4px-under-the-content-top */
 .cn-look-board .cn-index-page .cn-page-header {
 	display: grid;
 	grid-template-columns: minmax(0, 1fr) auto;
-	align-items: center;
+	align-items: start;
 	row-gap: 6px;
+	padding-top: 4px;
 	margin-bottom: var(--cn-board-section-gap, 20px);
 }
 
@@ -1057,6 +1061,64 @@
 	border-radius: 8px;
 }
 
+/* The record layout (`config.cardLayout`, DqAanMijToegewezen): a 20px 22px
+   inset, 10px between its parts; the head pill at the start and the number
+   in 13px muted at the end; a 17px bold title, not underlined; a 14px muted
+   meta line; a footer over a hairline with a pill and the 14px semibold date.
+   @spec openspec/changes/board-record-card-layout/specs/board-record-card-layout/spec.md#requirement-a-board-card-can-draw-the-record-layout-from-config */
+.cn-look-board .cn-object-card.cn-object-card--board:has(> .cn-object-card__record) {
+	padding: 20px 22px;
+}
+
+.cn-look-board .cn-object-card--board .cn-object-card__record {
+	gap: 10px;
+}
+
+.cn-look-board .cn-object-card--board .cn-object-card__record-head {
+	display: flex;
+	align-items: center;
+	gap: 8px;
+	min-height: 24px;
+}
+
+.cn-look-board .cn-object-card--board .cn-object-card__record-number {
+	margin-inline-start: auto;
+	color: var(--color-text-maxcontrast);
+	font-size: 13px;
+}
+
+.cn-look-board .cn-object-card--board .cn-object-card__record .cn-object-card__title {
+	margin: 0;
+	font-size: 17px;
+	font-weight: 700;
+	line-height: 1.3;
+	text-decoration: none;
+	white-space: normal;
+}
+
+.cn-look-board .cn-object-card--board .cn-object-card__record-meta {
+	margin: 0;
+	color: var(--color-text-maxcontrast);
+	font-size: 14px;
+}
+
+.cn-look-board .cn-object-card--board .cn-object-card__record-foot {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: 8px;
+	margin-top: auto;
+	padding-top: 10px;
+	border-top: 1px solid var(--cn-board-hairline);
+}
+
+.cn-look-board .cn-object-card--board .cn-object-card__record-date {
+	margin-inline-start: auto;
+	color: var(--color-main-text);
+	font-size: 14px;
+	font-weight: 600;
+}
+
 /* The catalogue card of the store page. */
 .cn-look-board .cn-store-page__card.cn-store-page__card--board {
 	gap: 10px;

package/src/css/look-board.css

@@ -101,6 +101,15 @@
 	margin-bottom: var(--cn-board-section-gap);
 }
 
+/* The boards start a page's header 4px under the content's top, so the title
+   sits at 96 (DqZaak, DqMijnWerk), not 92. The index page's header carries
+   the same inset in look-board-index.css.
+   @spec openspec/changes/board-page-header-top/specs/board-page-header-top/spec.md#requirement-a-board-page-title-sits-4px-under-the-content-top */
+.cn-look-board .cn-detail-page:not(.cn-look-nextcloud *) .cn-detail-page__header,
+.cn-look-board .cn-dashboard-page:not(.cn-look-nextcloud *) .cn-dashboard-page__header {
+	padding-top: 4px;
+}
+
 /* The 56px inset clears the navigation toggle, which overlays the content
    only while the navigation is closed. The store page's own header too: it
    kept the inset with the navigation open, 56px right of the board's title. */
@@ -140,7 +149,7 @@
 .cn-look-board .cn-dashboard-page:not(.cn-look-nextcloud *) .cn-dashboard-page__title-row {
 	grid-column: 1;
 	grid-row: 1;
-	align-self: center;
+	align-self: start;
 }
 
 .cn-look-board .cn-dashboard-page:not(.cn-look-nextcloud *) .cn-dashboard-page__header-left > :not(.cn-dashboard-page__title-row) {
@@ -650,6 +659,7 @@
 }
 
 .cn-look-board .cn-admin-settings-shell__title:not(.cn-look-nextcloud *) {
+	min-height: var(--cn-board-control-height);
 	margin: 0;
 	font-size: 28px;
 	font-weight: 700;
@@ -662,10 +672,23 @@
 	align-items: center;
 	gap: 8px;
 	margin-top: 6px;
-	font-size: 15px;
+	font-size: 14px;
+	line-height: normal;
 	color: var(--color-text-maxcontrast);
 }
 
+/* The admin settings header as the board draws it (DqInstellingen): 4px
+   under the content's top and 8px above the grid's gap, the crumbs 6px under
+   the 40px title row in 14px, and the tab strip 20px under the header (at
+   187). The shell is a grid whose gap already spaces its rows, so the
+   header's own 20px bottom margin came on top of it and the strip sat at 194.
+   @spec openspec/changes/board-admin-settings-header-rhythm/specs/board-admin-settings-header-rhythm/spec.md#requirement-the-board-admin-settings-header-keeps-the-boards-rhythm */
+.cn-look-board .cn-admin-settings-shell:not(.cn-look-nextcloud *) > .cn-admin-settings-shell__header,
+.cn-look-board.cn-admin-settings-shell:not(.cn-look-nextcloud *) > .cn-admin-settings-shell__header {
+	margin-bottom: 0;
+	padding: 4px 0 8px;
+}
+
 .cn-look-board .cn-admin-settings-shell__crumb-list:not(.cn-look-nextcloud *) {
 	display: flex;
 	flex-wrap: wrap;

package/src/index.js

@@ -376,7 +376,7 @@ export { createOpenRegisterSource } from './components/index.js'
 // Workplace dashboard primitives (openspec: workplace-dashboard-primitives):
 // the week strip and stacked bar widgets with their forms, the segmented
 // control, and the brand stripe.
-export { CnBrandStripe, CnSegmentedControl, CnStackedBarWidget, CnStackedBarWidgetForm, CnWeekStripWidget, CnWeekStripWidgetForm } from './components/index.js'
+export { CnBrandStripe, CnSegmentedControl, CnStackedBarWidget, CnStackedBarWidgetForm, CnTeamWorkloadWidget, CnWeekStripWidget, CnWeekStripWidgetForm } from './components/index.js'
 
 // Page components the page renderer mounts by `pages[].type` that were missing
 // from this entry. A component reachable from a manifest but not importable

package/src/schemas/app-manifest-v2.schema.json

@@ -3,7 +3,7 @@
 	"$id": "https://raw.githubusercontent.com/ConductionNL/nextcloud-vue/main/src/schemas/app-manifest-v2.schema.json",
 	"title": "Conduction App Manifest v2",
 	"description": "v2 schema for the JSON-driven page and navigation manifest consumed by @conduction/nextcloud-vue. Introduces a uniform widgets[] array on every page type with a per-slot grid coordinate system, a typed actions[] discriminator, and the required $schema field for version detection. v1 manifests continue to validate against app-manifest.schema.json (unchanged).",
-	"version": "2.128.0",
+	"version": "2.129.0",
 	"type": "object",
 	"required": ["$schema", "version"],
 	"allOf": [
@@ -2178,7 +2178,7 @@
 					}
 				},
 				{
-					"description": "record-list built-in widget (CnRecordListWidget): the action under the list, `props.content.footerAction` (2.126.0). Other content keys stay free-form.",
+					"description": "record-list built-in widget (CnRecordListWidget): the action under the list, `props.content.footerAction` (2.126.0), and a row's colour `dot` and `flags` (2.129.0). Other content keys stay free-form.",
 					"if": {
 						"properties": { "widgetKey": { "const": "record-list" } },
 						"required": ["widgetKey"]
@@ -2202,7 +2202,9 @@
 													"disabledWhen": { "$ref": "#/$defs/visibleWhen" },
 													"disabledReason": { "type": "string" }
 												}
-											}
+											},
+											"dot": { "description": "A colour dot before the title: a field name, or `{ field, colorMap? }` (2.129.0).", "anyOf": [{ "type": "string", "minLength": 1 }, { "type": "object", "required": ["field"], "additionalProperties": false, "properties": { "field": { "type": "string", "minLength": 1 }, "colorMap": { "type": "object", "additionalProperties": { "type": "string" } } } }] },
+											"flags": { "type": "array", "description": "The labels of the flags a row has, at its end (\"Start\", \"End\"): `[{ field, label, value? }]` (DqZaaktypeOverzicht, 2.129.0).", "items": { "type": "object", "required": ["field", "label"], "additionalProperties": false, "properties": { "field": { "type": "string", "minLength": 1 }, "label": { "type": "string", "minLength": 1 }, "value": {} } } }
 										}
 									}
 								}
@@ -2235,6 +2237,53 @@
 						}
 					}
 				},
+				{
+					"description": "related built-in widget (CnRelatedObjectsWidget): grouping by relation (2.129.0). Other content keys stay free-form.",
+					"if": {
+						"properties": { "widgetKey": { "const": "related" } },
+						"required": ["widgetKey"]
+					},
+					"then": {
+						"properties": {
+							"props": {
+								"type": "object",
+								"properties": {
+									"content": {
+										"type": "object",
+										"properties": {
+											"groupByRelation": { "type": "boolean", "description": "Split the Objects group by the relation label OpenRegister answers per direction." },
+											"layout": { "type": "string", "enum": ["tabs", "list", "sections"], "description": "`sections` draws every group under its own heading in one list." },
+											"groupActions": { "type": "object", "additionalProperties": { "type": "object" }, "description": "An action on a group's heading in `layout: \"sections\"`, keyed by the group's key (DqZaakGerelateerd \"Vervolg plannen\")." }
+										}
+									}
+								}
+							}
+						}
+					}
+				},
+				{
+					"description": "nc-widget built-in widget (CnNcWidgetWidget): leaving items out (2.129.0). Other content keys stay free-form.",
+					"if": {
+						"properties": { "widgetKey": { "const": "nc-widget" } },
+						"required": ["widgetKey"]
+					},
+					"then": {
+						"properties": {
+							"props": {
+								"type": "object",
+								"properties": {
+									"content": {
+										"type": "object",
+										"properties": {
+											"excludeApps": { "type": "array", "items": { "type": "string", "minLength": 1 }, "description": "Apps whose items are left out (an item's app is its own app field, else the /apps/<app>/ part of its link or icon), e.g. [\"systemtags\"]." },
+											"excludeTypes": { "type": "array", "items": { "type": "string", "minLength": 1 }, "description": "Item types that are left out." }
+										}
+									}
+								}
+							}
+						}
+					}
+				},
 				{
 					"description": "audit-trail built-in widget (CnAuditTrailWidget, Wave 1): the object change-log card. All props are optional — register/schema/objectId normally arrive via the detail-page object-context merge; explicit props win.",
 					"if": {
@@ -3815,7 +3864,7 @@
 							"description": "Name a registered NON-OBJECT entity collection for a type='index' page, instead of register+schema. Deliberately NOT called `source`: that key is already taken on page config and is polymorphic (a URL string in some manifests, an object with `params` in others), so reusing it would give one key two meanings and break six deployed shillinq pages. A flow definition is deliberately not an OpenRegister object, so an index had nothing to bind to and such lists became bespoke type='custom' pages. With a source the index loads the list itself. Takes precedence over register/schema; non-empty `objects` still wins over both. Registered sources live in src/composables/indexSources.js. `tasks` lists the viewer's task inbox from OpenRegister's flow-tasks read (cn-tasks-entity-source). `organisations` lists the OpenRegister organisations the viewer belongs to. On a type='detail' page a source that reads one record (today `organisations`) loads the record whose id is the route's objectId, instead of register+schema, and feeds the header, pills, widgets and @objectId / @object.* tokens like a fetched object (organisations-entity-source)."
 						},
 						"bulkBandAlways": { "type": "boolean", "default": false, "description": "type='index', board look: draw the bulk band (its actions and hint) before a selection too, its buttons disabled until rows are selected (DqZaken, DqWerkbord). Maps to CnIndexPage `bulkBandAlways`." },
-						"quickFilterPlacement": { "type": "string", "enum": ["", "toolbar"], "default": "", "description": "type='index': where the quick-filter chips sit. `toolbar` keeps them on one row with the Filter button and the view switch beside a side panel, the chips that do not fit behind the overflow chip (DqTeamwachtrij). Maps to CnIndexPage `quickFilterPlacement`." },
+						"quickFilterPlacement": { "type": "string", "enum": ["", "toolbar", "row"], "default": "", "description": "type='index': where the quick-filter chips sit. `toolbar` keeps them on one row with the Filter button and the view switch beside a side panel, the chips that do not fit behind the overflow chip (DqTeamwachtrij). `row` puts them on a row of their own above the toolbar, wrapping onto more lines. Maps to CnIndexPage `quickFilterPlacement`." },
 						"rowClass": {
 							"type": "array",
 							"description": "type='index': per-row CSS class rules, compiled into the table's rowClass function as on the object-table widget. Each rule { when: { field, op?, value }, class } adds `class` to a row whose `field` (a dot-path) compares to `value` with `op` (default eq; the visibleWhen operators and tokens such as `@today`, with two dates compared as moments), e.g. an overdue task `{ when: { field: \"dueAt\", op: \"lt\", value: \"@today\" }, class: \"cn-row--overdue\" }`. Maps to CnIndexPage `rowClass`.",
@@ -4081,6 +4130,7 @@
 							"additionalProperties": true,
 							"description": "type='index': the opt-in folder navigation pane (CnFolderSidebar) rendered left of the list. Selecting a folder filters the list by `filterField` (or `field`); \"All\" clears it. Only the per-scope list-layout keys are typed here; the pane's own keys (source, register, schema, idField, nameField, folders, allLabel, title, allowCreate, ...) stay free-form. Maps to CnIndexPage `folderSidebar`.",
 							"properties": {
+								"scopeViews": { "type": "array", "minItems": 1, "items": { "type": "string", "minLength": 1 }, "description": "The view modes (`table`, `list`, `cards`, `board`, ...) a scope's look applies in; in the others the page keeps its generic look while the scope still filters (DqWerkbord, 2.129.0)." },
 								"heading": { "type": "boolean", "description": "true heads the list with the selected folder's name, its parent folder and its count (always on a `groups` pane, 2.127.0)." },
 								"countText": { "type": "string", "minLength": 1, "description": "The count in that heading, `{count}` filled in, through the app's translate; a groups pane defaults to \"{count} members\" (2.127.0)." },
 								"pane": { "type": "boolean", "default": true, "description": "false keeps the folder scope (a deep link such as `?caseType=<uuid>` still applies the scope's look and filter) without drawing the pane (dossiq's simple profile, 2.126.0)." },
@@ -4175,7 +4225,7 @@
 						"nextStep": {
 							"type": "object",
 							"additionalProperties": false,
-							"required": ["stages"],
+							"anyOf": [{ "required": ["stages"] }, { "required": ["stagesFrom"] }],
 							"description": "type='detail': the 'what now' card above the body. For the record's stage it shows a short checklist next to the primary button. A stage without an entry shows no card. Rendered by CnNextStepCard.",
 							"properties": {
 								"field": {
@@ -4183,6 +4233,11 @@
 									"minLength": 1,
 									"description": "Dot-path to the stage, when it differs from `stageField`."
 								},
+								"stagesFrom": {
+									"type": "string",
+									"minLength": 1,
+									"description": "A field path, read like a `visibleWhen` field, whose value holds the stages in the `stages` shape, e.g. `@context.caseType.nextStep`, so each case type keeps its own stage texts and checklist. The declared `stages` apply otherwise (2.129.0)."
+								},
 								"title": {
 									"type": "string",
 									"description": "i18n key / heading used by a stage that names none."
@@ -4240,7 +4295,8 @@
 											"id": { "type": "string" },
 											"type": { "type": "string", "minLength": 1 },
 											"title": { "type": "string" },
-											"content": { "type": "object", "additionalProperties": true }
+											"content": { "type": "object", "additionalProperties": true },
+											"tabs": { "type": "array", "minItems": 1, "items": { "type": "string", "minLength": 1 }, "description": "The body tab ids this card shows beside; it is hidden while another tab is open (DqZaaktypeVelden, 2.129.0)." }
 										}
 									}
 								]
@@ -4708,6 +4764,19 @@
 							"description": "type='index': the property keys the cards view shows as the facts list of each card, in order; defaults to the first four list columns under the board look (screens-card-parity). Maps to CnIndexPage `cardFields`.",
 							"items": { "type": "string", "minLength": 1 }
 						},
+						"cardLayout": {
+							"type": "object",
+							"additionalProperties": false,
+							"description": "type='index', board look: the record layout of each card in the cards view (board-record-card-layout): a pill and the number on the head row, the title, a meta line, and a footer with a pill and a date. Each part names a field (a dot path) and is left out while it is empty; a pill maps values to a badge variant (`colorMap`, ignoring case) and to shown text (`labels`). Maps to CnIndexPage `cardLayout`.",
+							"properties": {
+								"headPill": { "type": "object", "additionalProperties": false, "required": ["field"], "properties": { "field": { "type": "string", "minLength": 1 }, "colorMap": { "type": "object", "additionalProperties": { "type": "string", "enum": ["default", "primary", "success", "warning", "error", "info", "purple", "teal"] } }, "labels": { "type": "object", "additionalProperties": { "type": "string" } }, "variant": { "type": "string", "enum": ["default", "primary", "success", "warning", "error", "info", "purple", "teal"] }, "due": { "type": "object", "description": "Read the field as a due date: overdue gives the error variant, within `soonWithin` days the warning one; any other date draws no pill.", "properties": { "soonWithin": { "type": "number", "minimum": 0 } } }, "variantWhen": { "type": "array", "description": "Rules on the days left until the field's date, `{ op, value, variant }`; the first match gives the variant, no match draws no pill.", "items": { "type": "object", "required": ["op", "value", "variant"], "properties": { "op": { "type": "string" }, "value": { "type": "number" }, "variant": { "type": "string" } } } } } },
+								"number": { "type": "string", "minLength": 1 },
+								"title": { "type": "string", "minLength": 1 },
+								"meta": { "type": "array", "description": "The meta line's parts: a field name reads through the page column it names; `{ field, formatter?, formatterOptions? }` reads as plain text through its own formatter (card-layout-part-formatter).", "items": { "oneOf": [ { "type": "string", "minLength": 1 }, { "type": "object", "additionalProperties": false, "required": ["field"], "properties": { "field": { "type": "string", "minLength": 1 }, "formatter": { "type": "string", "minLength": 1 }, "formatterOptions": { "type": "object" } } } ] } },
+								"footerPill": { "type": "object", "additionalProperties": false, "required": ["field"], "properties": { "field": { "type": "string", "minLength": 1 }, "colorMap": { "type": "object", "additionalProperties": { "type": "string", "enum": ["default", "primary", "success", "warning", "error", "info", "purple", "teal"] } }, "labels": { "type": "object", "additionalProperties": { "type": "string" } }, "variant": { "type": "string", "enum": ["default", "primary", "success", "warning", "error", "info", "purple", "teal"] }, "due": { "type": "object", "description": "Read the field as a due date: overdue gives the error variant, within `soonWithin` days the warning one; any other date draws no pill.", "properties": { "soonWithin": { "type": "number", "minimum": 0 } } }, "variantWhen": { "type": "array", "description": "Rules on the days left until the field's date, `{ op, value, variant }`; the first match gives the variant, no match draws no pill.", "items": { "type": "object", "required": ["op", "value", "variant"], "properties": { "op": { "type": "string" }, "value": { "type": "number" }, "variant": { "type": "string" } } } } } },
+								"footerDate": { "type": "object", "additionalProperties": false, "required": ["field"], "properties": { "field": { "type": "string", "minLength": 1 }, "label": { "type": "string", "minLength": 1 } } }
+							}
+						},
 						"afterList": { "type": "array", "description": "type='index': cards after the list, stacked full width in the listed order, the counterpart of statRow above it (index-scope-presentation). Each entry is a widget definition resolved like statRow's. A query preset or a folder scope can set its own. Maps to CnIndexPage `afterList`.", "items": { "type": "object", "required": ["id", "type"], "properties": { "id": { "type": "string", "minLength": 1 }, "type": { "type": "string", "minLength": 1 }, "title": { "type": "string" }, "subtitle": { "type": "string" }, "content": { "type": "object" }, "headerLink": { "type": "object" } } } },
 						"statRow": {
 							"type": "array",

package/src/utils/dueText.js

@@ -29,7 +29,8 @@ import { parseDateValue } from './dateVariant.js'
  * `upcomingWeeksLabel` `{ one, other }` (from `upcomingWeeksFrom` days left,
  * default 35, it reads the weeks left, rounded). Texts go through `translate`
  * before `{count}` is filled. Tones: `danger` (overdue), `today`, `upcoming`,
- * `empty`.
+ * `empty`. With `soonWithin` (days), today and a date at most that many days
+ * ahead also carry `soon: true`, drawn in the warning colour.
  *
  * @param {unknown} value A Date, a timestamp or an ISO string.
  * @param {object} [config] The `due` config.
@@ -54,9 +55,23 @@ export function resolveDue(value, config, translate = (text) => text, now = new
 	}
 	if (days === 0) {
 		const label = typeof cfg.todayLabel === 'string' && cfg.todayLabel !== '' ? translate(cfg.todayLabel) : t('nextcloud-vue', 'Due today')
-		return { text: label, tone: 'today' }
+		return withSoon({ text: label, tone: 'today' }, 0, cfg)
 	}
-	return { text: upcomingText(-days, cfg, translate) ?? formatRelativeDate(date, { now }), tone: 'upcoming' }
+	return withSoon({ text: upcomingText(-days, cfg, translate) ?? formatRelativeDate(date, { now }), tone: 'upcoming' }, -days, cfg)
+}
+
+/**
+ * Marks a due date within `soonWithin` days as soon.
+ *
+ * @param {{text: string, tone: string}} result The due text and tone.
+ * @param {number} left Whole days left, 0 for today.
+ * @param {object} cfg The `due` config.
+ * @return {{text: string, tone: string, soon?: boolean}} The result, with `soon: true` when it is due soon.
+ * @spec openspec/changes/due-text-soon/specs/due-text-soon/spec.md#requirement-a-due-date-within-a-few-days-reads-as-soon
+ */
+function withSoon(result, left, cfg) {
+	const within = Number(cfg.soonWithin)
+	return Number.isFinite(within) && within >= 0 && left <= within ? { ...result, soon: true } : result
 }
 
 /**

package/src/utils/libraryWidgetKeys.js

@@ -150,6 +150,7 @@ export const DASHBOARD_CATALOG_WIDGET_KEYS = Object.freeze([
 	'table',
 	'tabs',
 	'tasks',
+	'team-workload',
 	'text',
 	'tile',
 	'timeline',

package/src/utils/sortOrder.js

@@ -56,3 +56,13 @@ export function sameSortKeys(a, b) {
 	return left.length === right.length
 		&& left.every((entry, index) => entry.key === right[index].key && (entry.order || 'asc') === (right[index].order || 'asc'))
 }
+
+/**
+ * The same keys, each direction turned round.
+ *
+ * @param {Array<{key: string, order?: string}>} keys The sort keys.
+ * @return {Array<{key: string, order: 'asc'|'desc'}>} The reversed keys.
+ */
+export function reverseSortKeys(keys) {
+	return (Array.isArray(keys) ? keys : []).map((entry) => ({ key: entry.key, order: entry.order === 'desc' ? 'asc' : 'desc' }))
+}