@conduction/nextcloud-vue 2.78.0 → 2.79.0

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

@@ -107,16 +107,27 @@
 	margin-inline-start: 0;
 }
 
-/* The first of Save view, Filter and the view switch takes the free space, so
-   the three sit at the end of row 1. */
-.cn-look-board .cn-actions-bar--board > .cn-actions-bar__row--views > :is(.cn-saved-views__save, .cn-actions-bar__filter-button, .cn-actions-bar__view-toggle) {
+/* The first of Save view and the Filter + view switch unit takes the free
+   space (the board's `flex: 1` spacer), so they sit at the end of row 1.
+   When the line is full the unit wraps as one to the START of the next line
+   while Save view stays at the end of row 1 (DqZaken); without Save view the
+   unit sits at the end of row 1 (PqTickets, PqLeads, PtPortals). */
+.cn-look-board .cn-actions-bar--board > .cn-actions-bar__row--views > :is(.cn-saved-views__save, .cn-actions-bar__view-controls) {
 	margin-inline-start: auto;
 }
 
-.cn-look-board .cn-actions-bar--board > .cn-actions-bar__row--views > :is(.cn-saved-views__save, .cn-actions-bar__filter-button, .cn-actions-bar__view-toggle) ~ :is(.cn-saved-views__save, .cn-actions-bar__filter-button, .cn-actions-bar__view-toggle) {
+.cn-look-board .cn-actions-bar--board > .cn-actions-bar__row--views > .cn-saved-views__save ~ .cn-actions-bar__view-controls {
 	margin-inline-start: 0;
 }
 
+.cn-look-board .cn-actions-bar--board .cn-actions-bar__view-controls {
+	display: flex;
+	flex: 0 0 auto;
+	flex-wrap: nowrap;
+	align-items: center;
+	gap: 8px;
+}
+
 /* Row 2: the search field and the active filters on a line of their own. */
 .cn-look-board .cn-actions-bar--board > .cn-actions-bar__row--search {
 	display: flex;
@@ -202,16 +213,39 @@
 	color: var(--color-primary-element-text);
 }
 
-/* Save view: 34px, radius 17, on the light primary tint. */
+/* Save view: a ghost button, 34px, radius 17, no border, on the light primary
+   tint, a 14px icon 6px before the label, on one line. */
 .cn-look-board .cn-saved-views__save .button-vue {
 	min-height: 34px;
 	height: 34px;
-	padding: 0 14px;
+	padding: 0 12px;
+	border: 0;
 	border-radius: 17px;
 	background: var(--color-primary-element-light);
 	color: var(--color-primary-element-light-text);
 	font-size: 13px;
 	font-weight: 600;
+	white-space: nowrap;
+}
+
+.cn-look-board .cn-saved-views__save .button-vue:hover {
+	background: var(--color-primary-element-light-hover);
+}
+
+.cn-look-board .cn-saved-views__save .button-vue .button-vue__wrapper {
+	gap: 6px;
+}
+
+.cn-look-board .cn-saved-views__save .button-vue .button-vue__icon {
+	width: auto;
+	min-width: 0;
+	height: auto;
+	min-height: 0;
+}
+
+.cn-look-board .cn-saved-views__save .button-vue .button-vue__text {
+	margin: 0;
+	padding: 0;
 }
 
 /* Filter: a labelled secondary button, 36px, radius 8, with the active count. */
@@ -443,6 +477,29 @@
 	text-decoration: none;
 }
 
+/* Only the title is underlined (DqZaken). An underline set on the cell
+   reaches every in-flow child whatever its own text-decoration, so the
+   secondary lines become inline blocks on a line of their own: an atomic
+   inline box is the one thing the underline does not reach. */
+.cn-look-board .cn-table-container--board .cn-data-table td.cn-table-col--title .cn-table-cell__secondary {
+	display: inline-block;
+	width: 100%;
+	vertical-align: top;
+}
+
+/* `rowTitle: "plain"` (PqTickets, OcPublicaties): the title is bold text in
+   the main text colour without an underline, the secondary line 13px muted,
+   2px under it. The row stays clickable through its stretched row link. */
+.cn-look-board .cn-table-container--board.cn-table-container--title-plain .cn-data-table td.cn-table-col--title {
+	font-weight: 700;
+	text-decoration: none;
+}
+
+.cn-look-board .cn-table-container--board.cn-table-container--title-plain .cn-data-table td.cn-table-col--title .cn-table-cell__secondary {
+	margin-top: 2px;
+	font-size: 13px;
+}
+
 /* A status pill: 3px 10px, radius 12, 13px weight 600. The colours stay the
    status colour map's. */
 .cn-look-board .cn-table-container--board .cn-data-table .cn-status-badge {
@@ -465,15 +522,36 @@
 	--default-clickable-area: 34px;
 }
 
+/* The row menu: a 34px square, three dots, a grey border on the main
+   background (DqZaken, PqTickets). A theme that styles every secondary button
+   with `!important` (the nldesign theme: a primary border, 8px 16px padding,
+   `min-width: max-content`) would otherwise turn it into a 64px wide button
+   with a blue border, so the board values are `!important` too. */
+.cn-look-board .cn-row-actions--board .button-vue,
+.cn-look-board .cn-row-actions--board .button-vue:hover,
+.cn-look-board .cn-row-actions--board .button-vue:focus {
+	box-sizing: border-box !important;
+	width: 34px !important;
+	min-width: 34px !important;
+	height: 34px !important;
+	min-height: 34px !important;
+	padding: 0 !important;
+	border: 1px solid var(--color-border-dark) !important;
+	border-radius: 8px !important;
+	color: var(--cn-board-text-soft) !important;
+}
+
 .cn-look-board .cn-row-actions--board .button-vue {
-	width: 34px;
-	min-width: 34px;
-	height: 34px;
-	min-height: 34px;
-	padding: 0;
-	border: 1px solid var(--color-border-dark);
-	border-radius: 8px;
-	background: var(--color-main-background);
+	background: var(--color-main-background) !important;
+}
+
+.cn-look-board .cn-row-actions--board .button-vue:hover {
+	background: var(--color-background-hover) !important;
+}
+
+.cn-look-board .cn-row-actions--board .button-vue:focus-visible {
+	outline: 2px solid var(--color-main-text);
+	outline-offset: 2px;
 }
 
 /* ------------------------------------------------------------------ footer */

package/src/css/look-board.css

@@ -146,6 +146,14 @@
 	margin-inline-start: -264px;
 }
 
+/* The navigation draws the line between it and the content. NcContent draws a
+   second one on the content while the navigation is open, which doubled the
+   line and put the page 1px further from the navigation than the board's 28px.
+   Outranks NcContent's rule (six classes) with seven. */
+.cn-look-board .app-navigation[data-testid="cn-nav"]:not(.app-navigation--closed):not(.app-navigation--close) ~ .app-content.app-content {
+	border-inline-start: none;
+}
+
 .cn-look-board .app-navigation[data-testid="cn-nav"] .app-navigation__content {
 	box-sizing: border-box;
 	gap: 20px;
@@ -155,6 +163,31 @@
 .cn-look-board .app-navigation[data-testid="cn-nav"] .app-navigation__list {
 	height: auto;
 	flex: 1 1 auto;
+	margin: 0;
+	gap: 2px;
+}
+
+/* The board's vertical rhythm (AppZijbalk): the primary action 20px from the
+   top, the list 20px under it, entries 2px apart. An empty search slot is a
+   flex child too and pushed everything 20px down, so it goes. */
+.cn-look-board .app-navigation[data-testid="cn-nav"] .app-navigation__search:empty {
+	display: none;
+}
+
+/* A caption is a 12px label with 6px under it, 20px after the group above
+   and 2px before its first entry. NcAppNavigationCaption gives its name a
+   15px font on a 34px line, which made it 44px high. */
+.cn-look-board .app-navigation[data-testid="cn-nav"] .app-navigation__list > .app-navigation-caption:not(:first-child) {
+	margin-top: 18px;
+}
+
+.cn-look-board .app-navigation[data-testid="cn-nav"] .app-navigation-caption .app-navigation-caption__name {
+	margin: 0;
+	padding: 0;
+	font-size: inherit;
+	font-weight: inherit;
+	line-height: normal;
+	color: inherit;
 }
 
 .cn-look-board .app-navigation[data-testid="cn-nav"] .app-navigation-entry,
@@ -239,6 +272,43 @@
 	font-size: 15px;
 }
 
+/* The footer of the board: Help and Advanced as two 40px rows at weight 400,
+   2px apart. The Help row kept the 42px of a list entry, and the Advanced
+   foldout drew a 34px button inside 4px of padding, 20px under Help. */
+.cn-look-board .app-navigation[data-testid="cn-nav"] .cn-app-nav__footer-list {
+	gap: 2px;
+}
+
+.cn-look-board .app-navigation[data-testid="cn-nav"] .cn-app-nav__footer-list .app-navigation-entry,
+.cn-look-board .app-navigation[data-testid="cn-nav"] .cn-app-nav__footer-list .app-navigation-entry-link {
+	min-height: 40px;
+	font-weight: 400;
+}
+
+.cn-look-board .app-navigation[data-testid="cn-nav"] [data-testid="cn-nav-settings"] {
+	padding: 0;
+}
+
+.cn-look-board .app-navigation[data-testid="cn-nav"] .cn-app-nav__footer-list + [data-testid="cn-nav-settings"] {
+	margin-top: -18px;
+}
+
+.cn-look-board .app-navigation[data-testid="cn-nav"] [data-testid="cn-nav-settings"] > :first-child {
+	margin: 0;
+}
+
+.cn-look-board .app-navigation[data-testid="cn-nav"] [data-testid="cn-nav-settings"] > :first-child .button-vue {
+	box-sizing: border-box;
+	width: 100%;
+	height: 40px;
+	min-height: 40px;
+	padding: 0 10px;
+	border-radius: 8px;
+	font-size: 15px;
+	font-weight: 400;
+	justify-content: flex-start;
+}
+
 /* The card above the footer, pushed down. */
 .cn-look-board .cn-app-nav__card {
 	order: 0;
@@ -443,3 +513,10 @@
 .cn-look-board .cn-status-badge--primary:not(.cn-status-badge--solid):not(.cn-look-nextcloud *) {
 	color: var(--color-primary-element-light-text);
 }
+
+/* ---- Date and age cells (screens-cell-date-parity) ---------------------- */
+/* The board sets every waiting time ("3 dagen", "4 uur") in weight 600; a
+   late one is red through its variant class. */
+.cn-look-board .cn-cell-renderer__age:not(.cn-look-nextcloud *) {
+	font-weight: 600;
+}

package/src/css/table.css

@@ -230,6 +230,34 @@
 	min-width: 0;
 }
 
+/* Fit to the container (CnDataTable's `fitWidth`, on in CnWidgetObjectTable).
+
+   In a narrow tile the auto layout made the table as wide as its one-line
+   cells, so it ran past the tile and clipped the trailing column (a date).
+   Here every column but one takes the width of its content (`width: 1%` asks
+   for as little as the content allows), and the grow column takes what is
+   left. `max-width: 0` is what lets that column go below its content's width:
+   the table no longer counts its text, so the text is cut with an ellipsis
+   instead of widening the table. The full value stays in the cell's tooltip. */
+.cn-data-table--fit {
+	width: 100%;
+}
+
+.cn-data-table--fit th,
+.cn-data-table--fit td {
+	width: 1%;
+}
+
+.cn-data-table--fit th.cn-table-col--grow,
+.cn-data-table--fit td.cn-table-col--grow {
+	width: auto;
+	min-width: 0;
+	max-width: 0;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
 .cn-data-table th {
 	background: var(--color-background-dark);
 	font-weight: 500;
@@ -578,6 +606,15 @@
 	color: var(--color-text-maxcontrast);
 }
 
+/* The empty row holds a sentence (the empty text, or why a lens cannot
+   answer), not a cell value: it wraps instead of being cut to one line. The
+   selector carries the table class so it outranks the one-line cell rule. */
+.cn-data-table .cn-table-empty td {
+	max-width: none;
+	white-space: normal;
+	overflow-wrap: anywhere;
+}
+
 /* ========================================
    Backwards compatibility aliases
    (legacy OpenRegister CSS class names)

package/src/index.js

@@ -338,6 +338,10 @@ export {
 // @deprecated Use `CnBuildiqEditButton`.
 export { CnOpenBuildEditButton } from './components/index.js'
 
+// A CnFilesBrowser data source that reads an OpenRegister object's folder
+// through OpenRegister's files API (openspec: files-browser-openregister-source).
+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.

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.76.0",
+	"version": "2.79.0",
 	"type": "object",
 	"required": ["$schema", "version"],
 	"allOf": [
@@ -4004,6 +4004,40 @@
 							"default": [],
 							"description": "type='dashboard': widget ids drawn as a KPI row above the grid, in the listed order, in an auto-fit grid (`repeat(auto-fit, minmax(200px, 1fr))`, gap 16). The named widgets are not GridStack items, so they do not reflow with the grid and are not part of the emitted layout; an id that names no widget is skipped with a development warning (screens-dashboard-parity). Maps to CnDashboardPage `kpiRow`. `dateRange.control` also accepts \"segmented\": the presets as one compact segmented group under the header."
 						},
+						"greeting": {
+							"oneOf": [
+								{ "type": "boolean" },
+								{ "type": "string", "enum": ["first", "full"] }
+							],
+							"default": false,
+							"description": "type='dashboard': greet the reader in the header subtitle. `true` or \"first\" writes \"Good afternoon, Pieter · Monday 5 October 2026\", \"full\" uses the whole display name; the page `description` follows after another middle dot (screens-dashboard-greeting-header). Maps to CnDashboardPage `greeting`."
+						},
+						"viewLinks": {
+							"type": "array",
+							"default": [],
+							"description": "type='dashboard': links drawn as small pills on the switch row under the header, right of the view switch (screens-dashboard-greeting-header). `route` is a route name or a `{ name, params, query }` location, `href` a plain URL; `label` is an i18n key. An entry without a label or a target is skipped. Maps to CnDashboardPage `viewLinks`.",
+							"items": {
+								"type": "object",
+								"required": ["label"],
+								"additionalProperties": false,
+								"properties": {
+									"label": { "type": "string", "minLength": 1 },
+									"icon": { "type": "string", "minLength": 1 },
+									"route": {
+										"oneOf": [
+											{ "type": "string", "minLength": 1 },
+											{ "type": "object", "required": ["name"], "properties": { "name": { "type": "string", "minLength": 1 }, "params": { "type": "object" }, "query": { "type": "object" } } }
+										]
+									},
+									"href": { "type": "string", "minLength": 1 }
+								}
+							}
+						},
+						"showActionsMenu": {
+							"type": "boolean",
+							"default": true,
+							"description": "type='dashboard': `false` removes the page Actions menu from the header, for a board page whose header carries only the buildiq square and the primary (screens-dashboard-greeting-header). Maps to CnDashboardPage `showActionsMenu`."
+						},
 						"gridFloat": {
 							"type": "boolean",
 							"default": true,
@@ -4038,6 +4072,11 @@
 							"minLength": 1,
 							"description": "type='index', board look: free text after the footer's count, e.g. \"click a column header to sort\" (screens-index-list-parity). Maps to CnIndexPage `footerNote`."
 						},
+						"searchPlaceholder": {
+							"type": "string",
+							"minLength": 1,
+							"description": "type='index': the placeholder (and accessible name) of the list's search field, e.g. \"Search by case, number or requester\". Run through the app's translate, so an English key with a Dutch catalogue entry reads Dutch. Absent: the library's \"Search…\" (screens-index-toolbar-parity). Maps to CnIndexPage `searchPlaceholder`."
+						},
 						"bulkHint": {
 							"type": "string",
 							"minLength": 1,
@@ -4065,6 +4104,12 @@
 								}
 							}
 						},
+						"rowTitle": {
+							"type": "string",
+							"enum": ["link", "plain"],
+							"default": "link",
+							"description": "type='index' (screens-table-rows-parity): how the board look draws the table's title column. `link` (the default) is the 15px weight 600 underlined title of the DqZaken board; `plain` is the 15px bold title without an underline over a 13px muted secondary line, as the PqTickets and OcPublicaties boards draw it. The row stays clickable either way. The Nextcloud look ignores it. Maps to CnIndexPage `rowTitle`."
+						},
 						"showTypeEyebrow": {
 							"type": "boolean",
 							"default": true,

package/src/utils/boardDate.js

@@ -0,0 +1,189 @@
+/**
+ * SPDX-FileCopyrightText: 2026 Conduction B.V.
+ * SPDX-License-Identifier: EUPL-1.2
+ *
+ * boardDate: the two short time readings the drawn boards put in a table cell.
+ *
+ * - A date ("5 okt", "30 okt", "14 feb 2024"): day and short month in the
+ *   user's language, the year only when it is not the current year.
+ * - An age ("4 uur", "1 dag", "3 dagen"): how long something has been
+ *   waiting, in hours under a day and in whole calendar days after that.
+ *
+ * Both read the Nextcloud user LANGUAGE for the month and unit names. A
+ * Nextcloud account keeps its locale (date order) apart from its language,
+ * and a Dutch reader whose locale was left at the en_US default saw
+ * "Feb 14, 2024": the language decides the words, so it decides here, and the
+ * locale is only used when it is a region of that same language.
+ *
+ * @module utils/boardDate
+ * @spec openspec/changes/screens-cell-date-parity/specs/cell-date-age/spec.md
+ */
+
+import { getCanonicalLocale, getLanguage, translatePlural as n } from '@nextcloud/l10n'
+import { parseDateValue } from './dateVariant.js'
+import { compareVisibleWhen } from './visibleWhen.js'
+
+const MS_PER_HOUR = 3600000
+const MS_PER_DAY = 86400000
+
+/** Variants an age rule may name. `danger` is accepted as an alias of `error`. */
+export const AGE_VARIANTS = Object.freeze(['default', 'success', 'warning', 'error'])
+
+/**
+ * Read a language or locale tag from an @nextcloud/l10n getter, which throws
+ * when Nextcloud has not set one (outside a Nextcloud page, in a test).
+ *
+ * @param {() => string} getter `getLanguage` or `getCanonicalLocale`.
+ * @return {string} The tag with `-` separators, or ''.
+ */
+function readTag(getter) {
+	try {
+		return String(getter() || '').replace(/_/g, '-')
+	} catch {
+		return ''
+	}
+}
+
+/**
+ * The BCP 47 tag the board dates are written in: the user's locale when it is
+ * a region of the user's language (`nl-BE` for language `nl`), else the
+ * language itself.
+ *
+ * @return {string|undefined} The tag, or undefined to let Intl choose.
+ * @spec openspec/changes/screens-cell-date-parity/specs/cell-date-age/spec.md#requirement-a-board-date-cell-reads-day-and-short-month-in-the-user-language
+ */
+export function boardDateLocale() {
+	const language = readTag(getLanguage)
+	const locale = readTag(getCanonicalLocale)
+	const base = (tag) => tag.split('-')[0].toLowerCase()
+	if (language && locale && base(language) === base(locale)) {
+		return locale
+	}
+	return language || locale || undefined
+}
+
+/**
+ * A date in the board's short form: "5 okt", or "14 feb 2024" outside the
+ * current year.
+ *
+ * @param {unknown} value A Date, a timestamp or an ISO string.
+ * @param {Date} [now] The reference moment (defaults to the current time).
+ * @param {string} [locale] BCP 47 tag (defaults to `boardDateLocale()`).
+ * @return {string} The short date, or '' when the value is not a date.
+ * @spec openspec/changes/screens-cell-date-parity/specs/cell-date-age/spec.md#requirement-a-board-date-cell-reads-day-and-short-month-in-the-user-language
+ */
+export function formatBoardDate(value, now = new Date(), locale = boardDateLocale()) {
+	const date = parseDateValue(value)
+	if (date === null) {
+		return ''
+	}
+	const options = { day: 'numeric', month: 'short' }
+	if (date.getFullYear() !== now.getFullYear()) {
+		options.year = 'numeric'
+	}
+	try {
+		return new Intl.DateTimeFormat(locale, options).format(date)
+	} catch {
+		return new Intl.DateTimeFormat(undefined, options).format(date)
+	}
+}
+
+/**
+ * Whole calendar days from the date until `now` (0 today, 1 yesterday), or
+ * null when the value is not a date. A future date gives a negative number.
+ *
+ * @param {unknown} value The date.
+ * @param {Date} [now] The reference moment.
+ * @return {number|null} The day count.
+ * @spec openspec/changes/screens-cell-date-parity/specs/cell-date-age/spec.md#requirement-an-age-cell-says-how-long-something-has-waited
+ */
+export function ageInDays(value, now = new Date()) {
+	const date = parseDateValue(value)
+	if (date === null) {
+		return null
+	}
+	// UTC midnights of the two LOCAL days, so a daylight-saving hour never
+	// turns one day into zero or two.
+	const start = Date.UTC(date.getFullYear(), date.getMonth(), date.getDate())
+	const today = Date.UTC(now.getFullYear(), now.getMonth(), now.getDate())
+	return Math.round((today - start) / MS_PER_DAY)
+}
+
+/**
+ * How long something has waited: "4 uur" under 24 hours (at least 1), else
+ * "1 dag" / "3 dagen" in whole calendar days. Plural forms come from the
+ * library's own catalogue (`nextcloud-vue`). A date in the future reads as
+ * waiting no time: "0 hours".
+ *
+ * @param {unknown} value The moment the wait started.
+ * @param {Date} [now] The reference moment.
+ * @return {string} The age, or '' when the value is not a date.
+ * @spec openspec/changes/screens-cell-date-parity/specs/cell-date-age/spec.md#requirement-an-age-cell-says-how-long-something-has-waited
+ */
+export function formatAge(value, now = new Date()) {
+	const date = parseDateValue(value)
+	if (date === null) {
+		return ''
+	}
+	const elapsed = now.getTime() - date.getTime()
+	if (elapsed < MS_PER_DAY) {
+		const hours = elapsed <= 0 ? 0 : Math.max(1, Math.floor(elapsed / MS_PER_HOUR))
+		return n('nextcloud-vue', '%n hour', '%n hours', hours)
+	}
+	const days = shownAgeDays(date, now)
+	return n('nextcloud-vue', '%n day', '%n days', days)
+}
+
+/**
+ * The number of days an age cell shows: 0 under 24 hours (the cell then reads
+ * hours), else the whole calendar days, at least 1. The threshold rules
+ * compare against this number, so the colour always agrees with the text.
+ *
+ * @param {unknown} value The moment the wait started.
+ * @param {Date} [now] The reference moment.
+ * @return {number|null} The day count, or null when the value is not a date.
+ * @spec openspec/changes/screens-cell-date-parity/specs/cell-date-age/spec.md#requirement-an-age-cell-turns-red-past-its-threshold
+ */
+export function shownAgeDays(value, now = new Date()) {
+	const date = parseDateValue(value)
+	if (date === null) {
+		return null
+	}
+	if (now.getTime() - date.getTime() < MS_PER_DAY) {
+		return 0
+	}
+	return Math.max(1, ageInDays(date, now))
+}
+
+/**
+ * The variant of the first `variantWhen` rule the age in days matches, or ''
+ * when none does. Same rule shape as the `date` widget (`{ op, value,
+ * variant }`, first match wins), compared against the number of days the cell
+ * shows (`shownAgeDays`): `[{ op: "gte", value: 3, variant: "error" }]` turns a wait of three
+ * days or more red.
+ *
+ * @param {unknown} value The moment the wait started.
+ * @param {Array<{op: string, value: number, variant: string}>} rules The rules.
+ * @param {Date} [now] The reference moment.
+ * @return {string} `success | warning | error | default`, or ''.
+ * @spec openspec/changes/screens-cell-date-parity/specs/cell-date-age/spec.md#requirement-an-age-cell-turns-red-past-its-threshold
+ */
+export function resolveAgeVariant(value, rules, now = new Date()) {
+	if (!Array.isArray(rules) || rules.length === 0) {
+		return ''
+	}
+	const days = shownAgeDays(value, now)
+	if (days === null) {
+		return ''
+	}
+	for (const rule of rules) {
+		if (!rule || typeof rule !== 'object') {
+			continue
+		}
+		if (compareVisibleWhen(days, rule.op || 'eq', rule.value) === true) {
+			const variant = rule.variant === 'danger' ? 'error' : rule.variant
+			return AGE_VARIANTS.includes(variant) ? variant : ''
+		}
+	}
+	return ''
+}

package/src/utils/dynamicProperties.js

@@ -101,6 +101,7 @@ const DEFAULT_MAP = {
 	enum: 'enumValues',
 	required: 'isRequired',
 	default: 'defaultValue',
+	hideOnCreate: 'hideOnCreate',
 }
 
 /**
@@ -312,6 +313,8 @@ export function definitionQueryParams(config, value, formData = {}) {
  * @param {object} [config] The `x-openregister-extends-form` block (`map`, `typeMap`).
  * @param {object} [options] Extra options.
  * @param {number} [options.orderFrom] Order assigned to the first field; each subsequent field takes the next integer. Dynamic fields sort after the schema's own, so pass a number above every declared `order`.
+ * @param {boolean} [options.create] The form creates a new object: a definition whose `hideOnCreate` (or the field `config.map.hideOnCreate` names) is `true` gets no field, because the app fills that answer itself at creation. Edit forms still show it.
+ * @spec openspec/changes/dynamic-question-hide-on-create/specs/dynamic-question-hide-on-create/spec.md#requirement-a-question-can-stay-off-the-create-form
  * @return {{properties: object, required: string[]}} Properties keyed by prefixed id, plus the required key list.
  */
 export function propertiesFromDefinitions(definitions, config = {}, options = {}) {
@@ -321,7 +324,8 @@ export function propertiesFromDefinitions(definitions, config = {}, options = {}
 
 	const properties = {}
 	const required = []
-	const list = Array.isArray(definitions) ? definitions : []
+	const list = (Array.isArray(definitions) ? definitions : [])
+		.filter((record) => !(options.create === true && record && mapped(record, map, 'hideOnCreate') === true))
 
 	list.forEach((record, index) => {
 		if (!record || !record.id) {