@conduction/nextcloud-vue 2.143.0 → 2.145.0

package/dist/esm/components/CnAuditTrailWidget/CnAuditTrailWidget.vue3.js.map

@@ -1 +1 @@
-{"version":3,"file":"CnAuditTrailWidget.vue3.js","sources":["../../../../src/components/CnAuditTrailWidget/CnAuditTrailWidget.vue?vue&type=template&id=6387051e&lang.js"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2026 Conduction B.V.\n  - SPDX-License-Identifier: EUPL-1.2\n-->\n\n<template>\n\t<div\n\t\tv-if=\"resolvedScope === 'app' || resolvedSource || resolvedEndpoint || (resolvedRegister && resolvedSchema && resolvedObjectId)\"\n\t\tclass=\"cn-audit-trail-widget\">\n\t\t<CnAuditTrailCard\n\t\t\t:source=\"resolvedSource\"\n\t\t\t:endpoint=\"resolvedEndpoint\"\n\t\t\t:register=\"resolvedRegister\"\n\t\t\t:schema=\"resolvedSchema\"\n\t\t\t:objectId=\"resolvedObjectId\"\n\t\t\t:scope=\"resolvedScope\"\n\t\t\t:title=\"resolvedTitle\"\n\t\t\t:maxDisplay=\"resolvedMaxDisplay\"\n\t\t\t:layout=\"content && typeof content.layout === 'string' ? content.layout : ''\"\n\t\t\t:excludeActions=\"resolvedExcludeActions\"\n\t\t\t:actionLabels=\"actionLabels\"\n\t\t\t:valueLabels=\"valueLabels\"\n\t\t\t:relatedSources=\"relatedSources\"\n\t\t\t:footnote=\"footnote\"\n\t\t\tv-bind=\"emptyText ? { noEntriesLabel: emptyText } : {}\" />\n\t</div>\n</template>\n\n<script>\nimport CnAuditTrailCard from '../CnAuditTrailCard/CnAuditTrailCard.vue'\nimport { fillTemplate } from '../../utils/fillTemplate.js'\n\n/**\n * CnAuditTrailWidget — thin built-in widget wrapping CnAuditTrailCard with\n * unified object-context resolution (`audit-trail` widget key, Wave 1 of\n * nextcloud-vue#91).\n *\n * CnAuditTrailCard needs explicit `register` / `schema` / `objectId` props,\n * but the detail render paths surface the current object differently:\n * CnDetailPage's config grid provides a `cnObjectContext` inject, while\n * CnPageRenderer's slot CnWidgetGrid spreads the detail object context as\n * props, and CnDashboardPage's registry branch hands a stored `content`\n * blob. This widget reads whichever is present — explicit props win, then\n * the injects, then `content` — so the single `audit-trail` key works on\n * every surface. It replaces the three identical per-app adapters\n * (procest / zaakafhandelapp / scholiq).\n *\n * Registered in BOTH the v2 grid's BUILT_IN_WIDGETS and (detail-page\n * surface, like the `data` widget) the shared dashboardWidgetRegistry —\n * see `dashboardRegistration.js`.\n */\nexport default {\n\tname: 'CnAuditTrailWidget',\n\n\tcomponents: { CnAuditTrailCard },\n\n\tinject: {\n\t\t/** The host app's translate function, for `content.emptyText`. */\n\t\tcnTranslate: { default: () => (key) => key },\n\t\t/**\n\t\t * Detail-page object context (`{ objectId, object, register, schema }`)\n\t\t * provided by CnDetailPage (raw object or `{ value }` holder).\n\t\t */\n\t\tcnObjectContext: { default: null },\n\t\t/**\n\t\t * Detail object context holder (`{ value: { objectData, schema,\n\t\t * objectType, objectId, register, store } | null }`) provided by\n\t\t * CnPageRenderer for the v2 slot grid.\n\t\t */\n\t\tcnDetailObjectContext: { default: null },\n\t},\n\n\tprops: {\n\t\t/** OpenRegister register slug/id — object context spread as props by CnWidgetGrid (slot path). */\n\t\tregister: { type: String, default: '' },\n\t\t/**\n\t\t * OpenRegister schema — a slug string, or the schema OBJECT the\n\t\t * detail-context merge supplies (its slug/name/id is used).\n\t\t *\n\t\t * @type {string|object}\n\t\t */\n\t\tschema: { type: [String, Object], default: '' },\n\t\t/** The audited object's id — object context spread as props by CnWidgetGrid (slot path). */\n\t\tobjectId: { type: String, default: '' },\n\t\t/** Optional card title override (defaults to the card's translated label). */\n\t\ttitle: { type: String, default: '' },\n\t\t/** Maximum audit rows to render (0 falls back to the card default). */\n\t\tmaxDisplay: { type: Number, default: 0 },\n\t\t/**\n\t\t * `app` lists the app-wide feed (every object the caller may read,\n\t\t * narrowed to `register` / `schema` when set) and needs no object;\n\t\t * `object` (the default) is one object's trail. Also read from\n\t\t * `content.scope`.\n\t\t *\n\t\t * @spec openspec/changes/zuiddrecht-pixel-gaps/specs/zuiddrecht-pixel-gaps/spec.md#requirement-the-audit-trail-widget-reads-the-app-wide-feed\n\t\t */\n\t\tscope: { type: String, default: '' },\n\t\t/** Read the trail of something that is not an object (`{ kind: 'flow-task', id? }`); also read from `content.source`. */\n\t\tsource: { type: Object, default: null },\n\t\t/** A trail URL of its own; also read from `content.endpoint`. */\n\t\tendpoint: { type: String, default: '' },\n\t\t/** Actions to leave out (`['read']`); also read from `content.excludeActions`. */\n\t\texcludeActions: { type: Array, default: () => [] },\n\t\t/** Stored widget content blob (CnDashboardPage registry branch): `{ title, maxDisplay, register?, schema?, objectId?, source?, endpoint?, emptyText?, excludeActions?, actionLabels?, footnote? }`. */\n\t\t/** Stored widget content blob (CnDashboardPage registry branch): `{ title, maxDisplay, register?, schema?, objectId?, source?, endpoint?, emptyText?, excludeActions?, actionLabels?, valueLabels? }`. */\n\t\t/** Stored widget content blob (CnDashboardPage registry branch): `{ title, maxDisplay, register?, schema?, objectId?, source?, endpoint?, emptyText?, excludeActions?, actionLabels?, valueLabels?, relatedSources? }`. */\n\t\tcontent: { type: Object, default: () => ({}) },\n\t},\n\n\tcomputed: {\n\t\t/**\n\t\t * The resolved object-context bag from either inject shape, or {}.\n\t\t *\n\t\t * @return {object}\n\t\t */\n\t\tctx() {\n\t\t\tconst inj = this.cnObjectContext && (this.cnObjectContext.value || this.cnObjectContext)\n\t\t\tconst holder = this.cnDetailObjectContext && this.cnDetailObjectContext.value\n\t\t\treturn inj || holder || {}\n\t\t},\n\n\t\t/**\n\t\t * The audited object's id: explicit prop → inject context → content.\n\t\t *\n\t\t * @return {string}\n\t\t */\n\t\tresolvedObjectId() {\n\t\t\treturn this.objectId || this.ctx.objectId || this.content.objectId || ''\n\t\t},\n\n\t\t/**\n\t\t * The register slug/id: explicit prop → inject context → content.\n\t\t *\n\t\t * @return {string}\n\t\t */\n\t\tresolvedRegister() {\n\t\t\treturn this.register || this.ctx.register || this.content.register || ''\n\t\t},\n\n\t\t/**\n\t\t * The schema SLUG: explicit prop → inject context → content; a\n\t\t * schema object collapses to its slug/name/id.\n\t\t *\n\t\t * @return {string}\n\t\t */\n\t\tresolvedSchema() {\n\t\t\tconst s = this.schema || this.ctx.schema || this.content.schema || ''\n\t\t\treturn typeof s === 'string' ? s : (s && (s.slug || s.name || s.id)) || ''\n\t\t},\n\n\t\t/**\n\t\t * The feed scope: explicit prop → content → `object`.\n\t\t *\n\t\t * @spec openspec/changes/zuiddrecht-pixel-gaps/specs/zuiddrecht-pixel-gaps/spec.md#requirement-the-audit-trail-widget-reads-the-app-wide-feed\n\t\t * @return {('object'|'app')}\n\t\t */\n\t\tresolvedScope() {\n\t\t\tconst s = this.scope || this.content.scope\n\t\t\treturn s === 'app' ? 'app' : 'object'\n\t\t},\n\n\t\t/**\n\t\t * The card title: explicit prop → content → '' (card default).\n\t\t *\n\t\t * @return {string}\n\t\t */\n\t\t/** @return {object|null} The non-object anchor, from the prop or the content. */\n\t\tresolvedSource() {\n\t\t\tconst source = this.source || this.content.source\n\t\t\treturn source && typeof source === 'object' ? source : null\n\t\t},\n\n\t\t/** @return {string} The trail URL of its own, from the prop or the content. */\n\t\tresolvedEndpoint() {\n\t\t\treturn this.endpoint || (typeof this.content.endpoint === 'string' ? this.content.endpoint : '')\n\t\t},\n\n\t\t/** @return {string} The empty line the content names, through the host's translate, or ''. */\n\t\t/**\n\t\t * `content.actionLabels`, each label through the app's translate.\n\t\t *\n\t\t * @return {Object<string, string>|null}\n\t\t * @spec openspec/changes/audit-trail-action-labels/specs/audit-trail/spec.md#requirement-a-trail-can-say-what-happened-in-words\n\t\t */\n\t\tactionLabels() {\n\t\t\tconst labels = this.content.actionLabels\n\t\t\tif (!labels || typeof labels !== 'object') {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tconst translate = typeof this.cnTranslate === 'function' ? this.cnTranslate : (text) => text\n\t\t\treturn Object.fromEntries(Object.entries(labels)\n\t\t\t\t.filter(([, text]) => typeof text === 'string' && text !== '')\n\t\t\t\t.map(([key, text]) => [key, translate(text)]))\n\t\t},\n\n\t\t/**\n\t\t * `content.footnote`, a muted line under the trail with the record's\n\t\t * fields filled in (\"Reference {identifier}\"); '' when a field is empty.\n\t\t *\n\t\t * @return {string}\n\t\t * @spec openspec/changes/audit-trail-footnote/specs/audit-trail/spec.md#requirement-a-history-card-can-end-in-a-line-about-the-record\n\t\t */\n\t\tfootnote() {\n\t\t\tconst note = this.content.footnote\n\t\t\tif (typeof note !== 'string' || note === '') {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t\tconst translate = typeof this.cnTranslate === 'function' ? this.cnTranslate : (text) => text\n\t\t\treturn fillTemplate(translate(note), this.ctx.object || this.ctx.objectData || null)\n\t\t},\n\n\t\t/**\n\t\t * `content.valueLabels`, each word through the app's translate.\n\t\t *\n\t\t * @return {{[key: string]: {[value: string]: string}}|null}\n\t\t * @spec openspec/changes/audit-label-changed-values/specs/audit-trail/spec.md#requirement-a-trail-label-can-quote-what-the-entry-recorded\n\t\t */\n\t\tvalueLabels() {\n\t\t\tconst labels = this.content.valueLabels\n\t\t\tif (!labels || typeof labels !== 'object') {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tconst translate = typeof this.cnTranslate === 'function' ? this.cnTranslate : (text) => text\n\t\t\treturn Object.fromEntries(Object.entries(labels)\n\t\t\t\t.filter(([, words]) => words && typeof words === 'object')\n\t\t\t\t.map(([key, words]) => [key, Object.fromEntries(Object.entries(words)\n\t\t\t\t\t.filter(([, text]) => typeof text === 'string' && text !== '')\n\t\t\t\t\t.map(([value, text]) => [value, translate(text)]))]))\n\t\t},\n\n\t\t/**\n\t\t * `content.relatedSources`: records beside the object whose events\n\t\t * join its history (see CnAuditTrailCard).\n\t\t *\n\t\t * @return {Array<object>}\n\t\t * @spec openspec/changes/audit-trail-related-sources/specs/audit-trail/spec.md#requirement-an-objects-history-can-include-the-events-of-records-beside-it\n\t\t */\n\t\trelatedSources() {\n\t\t\treturn Array.isArray(this.content.relatedSources) ? this.content.relatedSources : []\n\t\t},\n\n\t\temptyText() {\n\t\t\tconst text = this.content.emptyText\n\t\t\tif (typeof text !== 'string' || text === '') {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t\treturn typeof this.cnTranslate === 'function' ? this.cnTranslate(text) : text\n\t\t},\n\n\t\t/**\n\t\t * The actions to leave out: explicit prop → content → none.\n\t\t *\n\t\t * @spec openspec/changes/audit-trail-exclude-actions/specs/audit-trail/spec.md#requirement-a-history-card-can-leave-out-events-by-action\n\t\t * @return {Array<string>}\n\t\t */\n\t\tresolvedExcludeActions() {\n\t\t\tif (this.excludeActions.length > 0) {\n\t\t\t\treturn this.excludeActions\n\t\t\t}\n\t\t\tconst fromContent = this.content.excludeActions\n\t\t\treturn Array.isArray(fromContent) ? fromContent.filter((action) => typeof action === 'string' && action !== '') : []\n\t\t},\n\n\t\tresolvedTitle() {\n\t\t\treturn this.title || this.content.title || ''\n\t\t},\n\n\t\t/**\n\t\t * The row cap: explicit prop → content → the card's own default (5).\n\t\t *\n\t\t * @return {number}\n\t\t */\n\t\tresolvedMaxDisplay() {\n\t\t\tif (this.maxDisplay > 0) {\n\t\t\t\treturn this.maxDisplay\n\t\t\t}\n\t\t\tconst fromContent = Number(this.content.maxDisplay)\n\t\t\treturn Number.isFinite(fromContent) && fromContent > 0 ? fromContent : 5\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n/* The card keeps its own box, footnote included. */\n.cn-audit-trail-widget {\n\tdisplay: contents;\n}\n</style>\n"],"names":[],"mappings":";;;;OAaO,EAAC,uBAAkB;;;;;;UADlB,QAAa,CAAA,aAAA,KAAA,KAAA,IAAS,uBAAA,IAAA,QAAA,CAAA,gBAAA,KAAA,QAAA,CAAA,gBAAA,IAAA,QAAA,CAAA,cAAA,IAAA,QAAA,CAAA,gBAAA,CAAA;;;AAG1B,UAAA,MAAM,EAAE,QAAY,CAAA,cAAA;AACpB,UAAA,QAAQ,EAAE,QAAU,CAAA,gBAAA;AACpB,UAAA,QAAQ,EAAE,QAAgB,CAAA,gBAAA;AAC1B,UAAA,MAAM,EAAE,QAAc,CAAA,cAAA;AACtB,UAAA,QAAQ,EAAE,QAAgB,CAAA,gBAAA;AAC1B,UAAA,KAAK,EAAE,QAAa,CAAA,aAAA;AACpB,UAAA,KAAK,EAAE,QAAa,CAAA,aAAA;AACpB,UAAA,UAAU,EAAE,QAAkB,CAAA,kBAAA;UAC9B,MAAM,EAAE,cAAO,IAAG,OAAA,MAAA,CAAA,OAAA,CAAA,MAAA,KAAA,QAAA,GAAA,MAAA,CAAA,OAAA,CAAA,MAAA,GAAA,EAAA;AAClB,UAAA,cAAc,EAAC,QAAuB,CAAA,sBAAA;AACtC,UAAA,YAAE,EAAA,QAAA,CAAA,YAAA;;;;;;;;;;;"}
+{"version":3,"file":"CnAuditTrailWidget.vue3.js","sources":["../../../../src/components/CnAuditTrailWidget/CnAuditTrailWidget.vue?vue&type=template&id=87ba40b4&lang.js"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2026 Conduction B.V.\n  - SPDX-License-Identifier: EUPL-1.2\n-->\n\n<template>\n\t<div\n\t\tv-if=\"resolvedScope === 'app' || resolvedSource || resolvedEndpoint || (resolvedRegister && resolvedSchema && resolvedObjectId)\"\n\t\tclass=\"cn-audit-trail-widget\">\n\t\t<CnAuditTrailCard\n\t\t\t:source=\"resolvedSource\"\n\t\t\t:endpoint=\"resolvedEndpoint\"\n\t\t\t:register=\"resolvedRegister\"\n\t\t\t:schema=\"resolvedSchema\"\n\t\t\t:objectId=\"resolvedObjectId\"\n\t\t\t:scope=\"resolvedScope\"\n\t\t\t:title=\"resolvedTitle\"\n\t\t\t:maxDisplay=\"resolvedMaxDisplay\"\n\t\t\t:layout=\"content && typeof content.layout === 'string' ? content.layout : ''\"\n\t\t\t:excludeActions=\"resolvedExcludeActions\"\n\t\t\t:actionLabels=\"actionLabels\"\n\t\t\t:valueLabels=\"valueLabels\"\n\t\t\t:changeLabels=\"changeLabels\"\n\t\t\t:object=\"ctx.object || ctx.objectData || null\"\n\t\t\t:relatedSources=\"relatedSources\"\n\t\t\t:footnote=\"footnote\"\n\t\t\tv-bind=\"emptyText ? { noEntriesLabel: emptyText } : {}\" />\n\t</div>\n</template>\n\n<script>\nimport CnAuditTrailCard from '../CnAuditTrailCard/CnAuditTrailCard.vue'\nimport { fillTemplate } from '../../utils/fillTemplate.js'\n\n/**\n * CnAuditTrailWidget — thin built-in widget wrapping CnAuditTrailCard with\n * unified object-context resolution (`audit-trail` widget key, Wave 1 of\n * nextcloud-vue#91).\n *\n * CnAuditTrailCard needs explicit `register` / `schema` / `objectId` props,\n * but the detail render paths surface the current object differently:\n * CnDetailPage's config grid provides a `cnObjectContext` inject, while\n * CnPageRenderer's slot CnWidgetGrid spreads the detail object context as\n * props, and CnDashboardPage's registry branch hands a stored `content`\n * blob. This widget reads whichever is present — explicit props win, then\n * the injects, then `content` — so the single `audit-trail` key works on\n * every surface. It replaces the three identical per-app adapters\n * (procest / zaakafhandelapp / scholiq).\n *\n * Registered in BOTH the v2 grid's BUILT_IN_WIDGETS and (detail-page\n * surface, like the `data` widget) the shared dashboardWidgetRegistry —\n * see `dashboardRegistration.js`.\n */\nexport default {\n\tname: 'CnAuditTrailWidget',\n\n\tcomponents: { CnAuditTrailCard },\n\n\tinject: {\n\t\t/** The host app's translate function, for `content.emptyText`. */\n\t\tcnTranslate: { default: () => (key) => key },\n\t\t/**\n\t\t * Detail-page object context (`{ objectId, object, register, schema }`)\n\t\t * provided by CnDetailPage (raw object or `{ value }` holder).\n\t\t */\n\t\tcnObjectContext: { default: null },\n\t\t/**\n\t\t * Detail object context holder (`{ value: { objectData, schema,\n\t\t * objectType, objectId, register, store } | null }`) provided by\n\t\t * CnPageRenderer for the v2 slot grid.\n\t\t */\n\t\tcnDetailObjectContext: { default: null },\n\t},\n\n\tprops: {\n\t\t/** OpenRegister register slug/id — object context spread as props by CnWidgetGrid (slot path). */\n\t\tregister: { type: String, default: '' },\n\t\t/**\n\t\t * OpenRegister schema — a slug string, or the schema OBJECT the\n\t\t * detail-context merge supplies (its slug/name/id is used).\n\t\t *\n\t\t * @type {string|object}\n\t\t */\n\t\tschema: { type: [String, Object], default: '' },\n\t\t/** The audited object's id — object context spread as props by CnWidgetGrid (slot path). */\n\t\tobjectId: { type: String, default: '' },\n\t\t/** Optional card title override (defaults to the card's translated label). */\n\t\ttitle: { type: String, default: '' },\n\t\t/** Maximum audit rows to render (0 falls back to the card default). */\n\t\tmaxDisplay: { type: Number, default: 0 },\n\t\t/**\n\t\t * `app` lists the app-wide feed (every object the caller may read,\n\t\t * narrowed to `register` / `schema` when set) and needs no object;\n\t\t * `object` (the default) is one object's trail. Also read from\n\t\t * `content.scope`.\n\t\t *\n\t\t * @spec openspec/changes/zuiddrecht-pixel-gaps/specs/zuiddrecht-pixel-gaps/spec.md#requirement-the-audit-trail-widget-reads-the-app-wide-feed\n\t\t */\n\t\tscope: { type: String, default: '' },\n\t\t/** Read the trail of something that is not an object (`{ kind: 'flow-task', id? }`); also read from `content.source`. */\n\t\tsource: { type: Object, default: null },\n\t\t/** A trail URL of its own; also read from `content.endpoint`. */\n\t\tendpoint: { type: String, default: '' },\n\t\t/** Actions to leave out (`['read']`); also read from `content.excludeActions`. */\n\t\texcludeActions: { type: Array, default: () => [] },\n\t\t/** Stored widget content blob (CnDashboardPage registry branch): `{ title, maxDisplay, register?, schema?, objectId?, source?, endpoint?, emptyText?, excludeActions?, actionLabels?, footnote? }`. */\n\t\t/** Stored widget content blob (CnDashboardPage registry branch): `{ title, maxDisplay, register?, schema?, objectId?, source?, endpoint?, emptyText?, excludeActions?, actionLabels?, valueLabels? }`. */\n\t\t/** Stored widget content blob (CnDashboardPage registry branch): `{ title, maxDisplay, register?, schema?, objectId?, source?, endpoint?, emptyText?, excludeActions?, actionLabels?, valueLabels?, relatedSources? }`. */\n\t\tcontent: { type: Object, default: () => ({}) },\n\t},\n\n\tcomputed: {\n\t\t/**\n\t\t * The resolved object-context bag from either inject shape, or {}.\n\t\t *\n\t\t * @return {object}\n\t\t */\n\t\tctx() {\n\t\t\tconst inj = this.cnObjectContext && (this.cnObjectContext.value || this.cnObjectContext)\n\t\t\tconst holder = this.cnDetailObjectContext && this.cnDetailObjectContext.value\n\t\t\treturn inj || holder || {}\n\t\t},\n\n\t\t/**\n\t\t * The audited object's id: explicit prop → inject context → content.\n\t\t *\n\t\t * @return {string}\n\t\t */\n\t\tresolvedObjectId() {\n\t\t\treturn this.objectId || this.ctx.objectId || this.content.objectId || ''\n\t\t},\n\n\t\t/**\n\t\t * The register slug/id: explicit prop → inject context → content.\n\t\t *\n\t\t * @return {string}\n\t\t */\n\t\tresolvedRegister() {\n\t\t\treturn this.register || this.ctx.register || this.content.register || ''\n\t\t},\n\n\t\t/**\n\t\t * The schema SLUG: explicit prop → inject context → content; a\n\t\t * schema object collapses to its slug/name/id.\n\t\t *\n\t\t * @return {string}\n\t\t */\n\t\tresolvedSchema() {\n\t\t\tconst s = this.schema || this.ctx.schema || this.content.schema || ''\n\t\t\treturn typeof s === 'string' ? s : (s && (s.slug || s.name || s.id)) || ''\n\t\t},\n\n\t\t/**\n\t\t * The feed scope: explicit prop → content → `object`.\n\t\t *\n\t\t * @spec openspec/changes/zuiddrecht-pixel-gaps/specs/zuiddrecht-pixel-gaps/spec.md#requirement-the-audit-trail-widget-reads-the-app-wide-feed\n\t\t * @return {('object'|'app')}\n\t\t */\n\t\tresolvedScope() {\n\t\t\tconst s = this.scope || this.content.scope\n\t\t\treturn s === 'app' ? 'app' : 'object'\n\t\t},\n\n\t\t/**\n\t\t * The card title: explicit prop → content → '' (card default).\n\t\t *\n\t\t * @return {string}\n\t\t */\n\t\t/** @return {object|null} The non-object anchor, from the prop or the content. */\n\t\tresolvedSource() {\n\t\t\tconst source = this.source || this.content.source\n\t\t\treturn source && typeof source === 'object' ? source : null\n\t\t},\n\n\t\t/** @return {string} The trail URL of its own, from the prop or the content. */\n\t\tresolvedEndpoint() {\n\t\t\treturn this.endpoint || (typeof this.content.endpoint === 'string' ? this.content.endpoint : '')\n\t\t},\n\n\t\t/** @return {string} The empty line the content names, through the host's translate, or ''. */\n\t\t/**\n\t\t * `content.actionLabels`, each label through the app's translate.\n\t\t *\n\t\t * @return {Object<string, string>|null}\n\t\t * @spec openspec/changes/audit-trail-action-labels/specs/audit-trail/spec.md#requirement-a-trail-can-say-what-happened-in-words\n\t\t */\n\t\tactionLabels() {\n\t\t\tconst labels = this.content.actionLabels\n\t\t\tif (!labels || typeof labels !== 'object') {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tconst translate = typeof this.cnTranslate === 'function' ? this.cnTranslate : (text) => text\n\t\t\treturn Object.fromEntries(Object.entries(labels)\n\t\t\t\t.filter(([, text]) => typeof text === 'string' && text !== '')\n\t\t\t\t.map(([key, text]) => [key, translate(text)]))\n\t\t},\n\n\t\t/**\n\t\t * `content.changeLabels`, each rule's label through the app's translate.\n\t\t *\n\t\t * @return {Array<object>}\n\t\t */\n\t\tchangeLabels() {\n\t\t\tconst rules = this.content.changeLabels\n\t\t\tif (!Array.isArray(rules)) {\n\t\t\t\treturn []\n\t\t\t}\n\t\t\tconst translate = typeof this.cnTranslate === 'function' ? this.cnTranslate : (text) => text\n\t\t\treturn rules\n\t\t\t\t.filter((rule) => rule && typeof rule.label === 'string' && rule.label !== '')\n\t\t\t\t.map((rule) => ({ ...rule, label: translate(rule.label) }))\n\t\t},\n\n\t\t/**\n\t\t * `content.footnote`, a muted line under the trail with the record's\n\t\t * fields filled in (\"Reference {identifier}\"); '' when a field is empty.\n\t\t *\n\t\t * @return {string}\n\t\t * @spec openspec/changes/audit-trail-footnote/specs/audit-trail/spec.md#requirement-a-history-card-can-end-in-a-line-about-the-record\n\t\t */\n\t\tfootnote() {\n\t\t\tconst note = this.content.footnote\n\t\t\tif (typeof note !== 'string' || note === '') {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t\tconst translate = typeof this.cnTranslate === 'function' ? this.cnTranslate : (text) => text\n\t\t\treturn fillTemplate(translate(note), this.ctx.object || this.ctx.objectData || null)\n\t\t},\n\n\t\t/**\n\t\t * `content.valueLabels`, each word through the app's translate.\n\t\t *\n\t\t * @return {{[key: string]: {[value: string]: string}}|null}\n\t\t * @spec openspec/changes/audit-label-changed-values/specs/audit-trail/spec.md#requirement-a-trail-label-can-quote-what-the-entry-recorded\n\t\t */\n\t\tvalueLabels() {\n\t\t\tconst labels = this.content.valueLabels\n\t\t\tif (!labels || typeof labels !== 'object') {\n\t\t\t\treturn null\n\t\t\t}\n\t\t\tconst translate = typeof this.cnTranslate === 'function' ? this.cnTranslate : (text) => text\n\t\t\treturn Object.fromEntries(Object.entries(labels)\n\t\t\t\t.filter(([, words]) => words && typeof words === 'object')\n\t\t\t\t.map(([key, words]) => [key, Object.fromEntries(Object.entries(words)\n\t\t\t\t\t.filter(([, text]) => typeof text === 'string' && text !== '')\n\t\t\t\t\t.map(([value, text]) => [value, translate(text)]))]))\n\t\t},\n\n\t\t/**\n\t\t * `content.relatedSources`: records beside the object whose events\n\t\t * join its history (see CnAuditTrailCard).\n\t\t *\n\t\t * @return {Array<object>}\n\t\t * @spec openspec/changes/audit-trail-related-sources/specs/audit-trail/spec.md#requirement-an-objects-history-can-include-the-events-of-records-beside-it\n\t\t */\n\t\trelatedSources() {\n\t\t\treturn Array.isArray(this.content.relatedSources) ? this.content.relatedSources : []\n\t\t},\n\n\t\temptyText() {\n\t\t\tconst text = this.content.emptyText\n\t\t\tif (typeof text !== 'string' || text === '') {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t\treturn typeof this.cnTranslate === 'function' ? this.cnTranslate(text) : text\n\t\t},\n\n\t\t/**\n\t\t * The actions to leave out: explicit prop → content → none.\n\t\t *\n\t\t * @spec openspec/changes/audit-trail-exclude-actions/specs/audit-trail/spec.md#requirement-a-history-card-can-leave-out-events-by-action\n\t\t * @return {Array<string>}\n\t\t */\n\t\tresolvedExcludeActions() {\n\t\t\tif (this.excludeActions.length > 0) {\n\t\t\t\treturn this.excludeActions\n\t\t\t}\n\t\t\tconst fromContent = this.content.excludeActions\n\t\t\treturn Array.isArray(fromContent) ? fromContent.filter((action) => typeof action === 'string' && action !== '') : []\n\t\t},\n\n\t\tresolvedTitle() {\n\t\t\treturn this.title || this.content.title || ''\n\t\t},\n\n\t\t/**\n\t\t * The row cap: explicit prop → content → the card's own default (5).\n\t\t *\n\t\t * @return {number}\n\t\t */\n\t\tresolvedMaxDisplay() {\n\t\t\tif (this.maxDisplay > 0) {\n\t\t\t\treturn this.maxDisplay\n\t\t\t}\n\t\t\tconst fromContent = Number(this.content.maxDisplay)\n\t\t\treturn Number.isFinite(fromContent) && fromContent > 0 ? fromContent : 5\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n/* The card keeps its own box, footnote included. */\n.cn-audit-trail-widget {\n\tdisplay: contents;\n}\n</style>\n"],"names":[],"mappings":";;;;OAaO,EAAC,uBAAkB;;;;;;UADlB,QAAa,CAAA,aAAA,KAAA,KAAA,IAAS,uBAAA,IAAA,QAAA,CAAA,gBAAA,KAAA,QAAA,CAAA,gBAAA,IAAA,QAAA,CAAA,cAAA,IAAA,QAAA,CAAA,gBAAA,CAAA;;;AAG1B,UAAA,MAAM,EAAE,QAAY,CAAA,cAAA;AACpB,UAAA,QAAQ,EAAE,QAAU,CAAA,gBAAA;AACpB,UAAA,QAAQ,EAAE,QAAgB,CAAA,gBAAA;AAC1B,UAAA,MAAM,EAAE,QAAc,CAAA,cAAA;AACtB,UAAA,QAAQ,EAAE,QAAgB,CAAA,gBAAA;AAC1B,UAAA,KAAK,EAAE,QAAa,CAAA,aAAA;AACpB,UAAA,KAAK,EAAE,QAAa,CAAA,aAAA;AACpB,UAAA,UAAU,EAAE,QAAc,CAAA,kBAAA;UAC1B,MAAM,EAAE,cAAO,IAAW,OAAA,MAAA,CAAA,OAAO,CAAC,MAAM,KAAA,QAAA,GAAI,MAAA,CAAA,OAAA,CAAA,MAAA,GAAA,EAAA;AAC5C,UAAA,cAAc,EAAE,QAAc,CAAA,sBAAA;AAC9B,UAAA,YAAY,EAAE,QAAI,CAAA,YAAA;AAClB,UAAA,WAAW,EAAE,QAAW,CAAA,WAAA;AACxB,UAAA,YAAE,EAAA,QAAA,CAAA,YAAA;;;;;;;;;;;"}

package/dist/esm/components/CnConversationThread/CnConversationThread.vue.js

@@ -2,7 +2,7 @@ import script from './CnConversationThread.vue2.js';
 import { render } from './CnConversationThread.vue3.js';
 
 script.render = render;
-script.__scopeId = "data-v-0d461ee4";
+script.__scopeId = "data-v-e2600a68";
 const __sfc_main = script;
 
 export { __sfc_main as default };

package/dist/esm/components/CnConversationThread/CnConversationThread.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"CnConversationThread.vue2.js","sources":["../../../../src/components/CnConversationThread/CnConversationThread.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2026 Conduction B.V.\n  - SPDX-License-Identifier: EUPL-1.2\n-->\n\n<template>\n\t<section\n\t\tclass=\"cn-conversation-thread\"\n\t\tdata-testid=\"cn-conversation-thread\"\n\t\t:aria-labelledby=\"title ? titleId : null\"\n\t\t:aria-label=\"title ? null : fallbackLabel\">\n\t\t<div v-if=\"title || $slots['header-actions']\" class=\"cn-conversation-thread__header\">\n\t\t\t<div v-if=\"title\" class=\"cn-conversation-thread__heading\">\n\t\t\t\t<component\n\t\t\t\t\t:is=\"titleTag\"\n\t\t\t\t\t:id=\"titleId\"\n\t\t\t\t\tclass=\"cn-conversation-thread__title\">\n\t\t\t\t\t{{ title }}\n\t\t\t\t</component>\n\t\t\t\t<p v-if=\"subtitle\" class=\"cn-conversation-thread__subtitle\" data-testid=\"cn-conversation-subtitle\">\n\t\t\t\t\t{{ subtitle }}\n\t\t\t\t</p>\n\t\t\t</div>\n\t\t\t<div v-if=\"$slots['header-actions']\" class=\"cn-conversation-thread__header-actions\">\n\t\t\t\t<!-- @slot header-actions Buttons beside the title, for example \"Log contact\". -->\n\t\t\t\t<slot name=\"header-actions\" />\n\t\t\t</div>\n\t\t</div>\n\n\t\t<CnQuickFilterBar\n\t\t\tv-if=\"channelChips.length > 0\"\n\t\t\tinline\n\t\t\tclass=\"cn-conversation-thread__channels\"\n\t\t\t:tabs=\"channelChips\"\n\t\t\t:activeIndex=\"activeChannelIndex\"\n\t\t\t@update:activeIndex=\"onChannelChip\" />\n\n\t\t<p v-if=\"loading && rows.length === 0\"\n\t\t\tclass=\"cn-conversation-thread__empty\"\n\t\t\trole=\"status\"\n\t\t\tdata-testid=\"cn-conversation-loading\">\n\t\t\t{{ loadingText }}\n\t\t</p>\n\t\t<p v-else-if=\"rows.length === 0\" class=\"cn-conversation-thread__empty\" data-testid=\"cn-conversation-empty\">\n\t\t\t{{ emptyText }}\n\t\t</p>\n\n\t\t<p v-else-if=\"shownRows.length === 0\" class=\"cn-conversation-thread__empty\" data-testid=\"cn-conversation-channel-empty\">\n\t\t\t{{ emptyText }}\n\t\t</p>\n\n\t\t<ol v-else class=\"cn-conversation-thread__messages\">\n\t\t\t<li\n\t\t\t\tv-for=\"row in shownRows\"\n\t\t\t\t:key=\"row.key\"\n\t\t\t\tclass=\"cn-conversation-thread__message\"\n\t\t\t\t:class=\"`cn-conversation-thread__message--${row.side}`\"\n\t\t\t\tdata-testid=\"cn-conversation-message\"\n\t\t\t\t:data-side=\"row.side\">\n\t\t\t\t<span class=\"cn-conversation-thread__avatar\" aria-hidden=\"true\">{{ row.initials }}</span>\n\t\t\t\t<div class=\"cn-conversation-thread__bubble\">\n\t\t\t\t\t<span class=\"cn-conversation-thread__meta\">\n\t\t\t\t\t\t<span class=\"hidden-visually\">{{ row.directionLabel }}</span>\n\t\t\t\t\t\t<span class=\"cn-conversation-thread__author\">{{ row.author }}</span>\n\t\t\t\t\t\t<span v-if=\"row.channel\" class=\"cn-conversation-thread__channel\" data-testid=\"cn-conversation-channel\">{{ row.channel }}</span>\n\t\t\t\t\t\t<span v-if=\"row.status\" class=\"cn-conversation-thread__status\" data-testid=\"cn-conversation-status\">{{ row.status }}</span>\n\t\t\t\t\t\t<span v-if=\"showDirection\"\n\t\t\t\t\t\t\tclass=\"cn-conversation-thread__direction\"\n\t\t\t\t\t\t\tdata-testid=\"cn-conversation-direction\"\n\t\t\t\t\t\t\taria-hidden=\"true\">{{ row.directionWord }}</span>\n\t\t\t\t\t\t<time v-if=\"row.timeLabel\" :datetime=\"row.datetime || null\">{{ row.timeLabel }}</time>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span class=\"cn-conversation-thread__text\">{{ row.text }}</span>\n\t\t\t\t\t<span v-if=\"row.note\" class=\"cn-conversation-thread__note\" data-testid=\"cn-conversation-note\">{{ row.note }}</span>\n\t\t\t\t\t<span v-if=\"row.actions.length > 0\" class=\"cn-conversation-thread__message-actions\">\n\t\t\t\t\t\t<NcButton\n\t\t\t\t\t\t\tv-for=\"action in row.actions\"\n\t\t\t\t\t\t\t:key=\"action.id\"\n\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t:disabled=\"action.disabled === true\"\n\t\t\t\t\t\t\t:data-testid=\"`cn-conversation-action-${action.id}`\"\n\t\t\t\t\t\t\t@click=\"$emit('message-action', { action: action.id, message: row.key })\">\n\t\t\t\t\t\t\t{{ action.label }}\n\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t</span>\n\t\t\t\t</div>\n\t\t\t</li>\n\t\t</ol>\n\n\t\t<form\n\t\t\tv-if=\"allowReply\"\n\t\t\tclass=\"cn-conversation-thread__reply\"\n\t\t\tdata-testid=\"cn-conversation-reply\"\n\t\t\t@submit.prevent=\"onSend\">\n\t\t\t<!-- @slot reply-tools Tools above the reply box, for example a template picker. -->\n\t\t\t<!-- @binding {Function} setDraft Puts a text in the reply box. -->\n\t\t\t<slot name=\"reply-tools\" :setDraft=\"setDraft\" />\n\t\t\t<div class=\"cn-conversation-thread__reply-head\">\n\t\t\t\t<label :for=\"inputId\" class=\"cn-conversation-thread__reply-label\">{{ replyLabel }}</label>\n\t\t\t\t<span v-if=\"replyHint\" class=\"cn-conversation-thread__reply-hint\" data-testid=\"cn-conversation-reply-hint\">{{ replyHint }}</span>\n\t\t\t</div>\n\t\t\t<textarea\n\t\t\t\t:id=\"inputId\"\n\t\t\t\tv-model=\"draft\"\n\t\t\t\tclass=\"cn-conversation-thread__input\"\n\t\t\t\trows=\"2\"\n\t\t\t\t:placeholder=\"placeholder || null\"\n\t\t\t\t:disabled=\"sending\"\n\t\t\t\t:aria-describedby=\"errorMessage ? errorId : null\"\n\t\t\t\tdata-testid=\"cn-conversation-input\"\n\t\t\t\t@keydown.ctrl.enter.prevent=\"onSend\"\n\t\t\t\t@keydown.meta.enter.prevent=\"onSend\" />\n\t\t\t<p\n\t\t\t\tv-if=\"errorMessage\"\n\t\t\t\t:id=\"errorId\"\n\t\t\t\tclass=\"cn-conversation-thread__error\"\n\t\t\t\trole=\"alert\"\n\t\t\t\tdata-testid=\"cn-conversation-error\">\n\t\t\t\t{{ errorMessage }}\n\t\t\t</p>\n\t\t\t<!-- The option at the start and the buttons at the end of one row. -->\n\t\t\t<div class=\"cn-conversation-thread__reply-foot\">\n\t\t\t\t<label v-if=\"optionShown\" class=\"cn-conversation-thread__reply-option\" data-testid=\"cn-conversation-reply-option\">\n\t\t\t\t\t<input v-model=\"optionOn\" type=\"checkbox\" :disabled=\"sending\">\n\t\t\t\t\t<span>{{ replyOption.label }}</span>\n\t\t\t\t</label>\n\t\t\t\t<div class=\"cn-conversation-thread__reply-actions\">\n\t\t\t\t\t<!-- @slot reply-actions Extra buttons before Send, for example \"Save draft\". -->\n\t\t\t\t\t<!-- @binding {string} draft The text in the reply box. -->\n\t\t\t\t\t<slot name=\"reply-actions\" :draft=\"draft\" />\n\t\t\t\t\t<NcButton\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t:disabled=\"!canSend\"\n\t\t\t\t\t\tdata-testid=\"cn-conversation-send\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<Send :size=\"16\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t{{ sendLabel }}\n\t\t\t\t\t</NcButton>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</form>\n\t</section>\n</template>\n\n<script>\nimport axios from '@nextcloud/axios'\nimport { translate as t } from '@nextcloud/l10n'\nimport { NcButton } from '@nextcloud/vue'\nimport Send from 'vue-material-design-icons/Send.vue'\nimport CnQuickFilterBar from '../CnQuickFilterBar/CnQuickFilterBar.vue'\nimport { prefixUrl } from '../../utils/headers.js'\nimport { userLocale } from '../../utils/userLocale.js'\n\nlet conversationThreadUid = 0\n\n/**\n * CnConversationThread: the messages between you and the other party, and a box to answer.\n *\n * Each message has an author, a time and a side: `us` for the organisation,\n * `them` for the resident or customer. The reply box emits `send`, and also\n * posts to `endpoint` when one is set. It needs no Talk and no other app:\n * where the messages are stored is the host's business.\n *\n * ```vue\n * <CnConversationThread\n *   title=\"Contact with the resident\"\n *   reply-label=\"Answer to the resident\"\n *   :messages=\"[\n *     { id: 1, author: 'Sanne de Vries', time: '2026-10-04T10:52:00', side: 'them',\n *       text: 'Thank you. I would like to see all documents.' },\n *     { id: 2, time: '2026-10-04T10:24:00', side: 'us',\n *       text: 'Construction starts in March.' },\n *   ]\"\n *   @send=\"saveReply\" />\n * ```\n *\n * The `conversation` detail widget type renders this thread from a field on\n * the record.\n */\nexport default {\n\tname: 'CnConversationThread',\n\n\tcomponents: {\n\t\tCnQuickFilterBar,\n\t\tNcButton,\n\t\tSend,\n\t},\n\n\tinject: {\n\t\t/** The host app's translate, for the All chip in the host's word. */\n\t\tcnTranslate: { default: null },\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * The messages, oldest first: `{ id?, author?, time?, text, side?, channel?, status?, actions?, note? }`.\n\t\t * `status` is shown after the channel (\"Failed\"); `actions` are\n\t\t * `{ id, label, disabled? }` buttons under the text, each emitting\n\t\t * `message-action`.\n\t\t * `note` is a muted line under the text.\n\t\t * `side` is `us` or `them` (default `them`). `time` is an ISO\n\t\t * date, or any text to show as is. `channel` is shown after the\n\t\t * author (\"E-mail\", \"Phone note\"); `note` is a muted line under the text.\n\t\t */\n\t\tmessages: {\n\t\t\ttype: Array,\n\t\t\tdefault: () => [],\n\t\t},\n\n\t\t/** Heading of the thread. */\n\t\ttitle: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** A line under the title, such as \"Oldest first, with the channel of each message\". */\n\t\tsubtitle: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** Say each message's direction in words before its time (\"Incoming · 3 Oct\"), not only to a screen reader. */\n\t\tshowDirection: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/** Element the heading renders as. */\n\t\ttitleTag: {\n\t\t\ttype: String,\n\t\t\tdefault: 'h3',\n\t\t},\n\n\t\t/** A line beside the reply label saying where the answer goes, such as \"Goes to the message box in the portal\". */\n\t\treplyHint: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * A switch under the reply box whose state is sent with the reply:\n\t\t * `{ label, key, value? }`, `value` the starting state (on by default).\n\t\t * The reply's `send` event carries `{ [key]: state }` after the text.\n\t\t *\n\t\t * @type {{label: string, key: string, value?: boolean}|null}\n\t\t */\n\t\treplyOption: {\n\t\t\ttype: Object,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/** Whether the reply box renders. Turn it off for a closed or read-only record. */\n\t\tallowReply: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\n\t\t/** Label of the reply box. */\n\t\treplyLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'Reply'),\n\t\t},\n\n\t\t/** Placeholder inside the reply box. */\n\t\tplaceholder: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** Label of the send button. */\n\t\tsendLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'Send'),\n\t\t},\n\n\t\t/** Author shown on an `us` message that names none. */\n\t\tusLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'You'),\n\t\t},\n\n\t\t/**\n\t\t * URL the reply is POSTed to as `{ message }`. Empty means the host\n\t\t * handles `send` itself and nothing is requested.\n\t\t */\n\t\tendpoint: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** Extra fields sent along with `message` when `endpoint` is set. */\n\t\tpayload: {\n\t\t\ttype: Object,\n\t\t\tdefault: () => ({}),\n\t\t},\n\n\t\t/** Whether the messages are still loading; with none yet the thread says so. */\n\t\tloading: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Draw channel chips above the messages: All, then one per channel\n\t\t * with its count. Choosing one shows only that channel's messages.\n\t\t */\n\t\tchannelFilter: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Channel labels that always get a chip, in this order, also when no\n\t\t * message uses them yet. Channels the messages use follow.\n\t\t */\n\t\tchannels: {\n\t\t\ttype: Array,\n\t\t\tdefault: () => [],\n\t\t},\n\n\t\t/** Shown when there are no messages yet. */\n\t\temptyText: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'No messages yet.'),\n\t\t},\n\t},\n\n\temits: [\n\t\t/** A reply was submitted. Payload: the text. */\n\t\t'send',\n\t\t/** The endpoint accepted the reply. Payload: the response body. */\n\t\t'sent',\n\t\t/** The endpoint refused the reply. Payload: the error. */\n\t\t'error',\n\t\t/** A message action was pressed. Payload: `{ action, message }`, the action id and the message key. */\n\t\t'message-action',\n\t],\n\n\tdata() {\n\t\tconversationThreadUid += 1\n\t\treturn {\n\t\t\tdraft: '',\n\t\t\t/** The state of the reply option's switch. */\n\t\t\toptionOn: this.replyOption?.value !== false,\n\t\t\t/** The channel the chips narrow the thread to; '' is All. */\n\t\t\tactiveChannel: '',\n\t\t\tsending: false,\n\t\t\terrorMessage: '',\n\t\t\ttitleId: `cn-conversation-title-${conversationThreadUid}`,\n\t\t\tinputId: `cn-conversation-input-${conversationThreadUid}`,\n\t\t\terrorId: `cn-conversation-error-${conversationThreadUid}`,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\t/**\n\t\t * The messages, with author, side, time and initials resolved.\n\t\t *\n\t\t * @return {Array<{key: string, author: string, initials: string, side: string, text: string, timeLabel: string, datetime: string, channel: string, directionLabel: string, directionWord: string, note: string}>} The rows.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\trows() {\n\t\t\treturn (Array.isArray(this.messages) ? this.messages : [])\n\t\t\t\t.filter((message) => message && typeof message === 'object')\n\t\t\t\t.map((message, index) => {\n\t\t\t\t\tconst side = message.side === 'us' ? 'us' : 'them'\n\t\t\t\t\tconst author = typeof message.author === 'string' && message.author !== ''\n\t\t\t\t\t\t? message.author\n\t\t\t\t\t\t: (side === 'us' ? this.usLabel : '')\n\t\t\t\t\tconst time = this.formatTime(message.time)\n\t\t\t\t\treturn {\n\t\t\t\t\t\tkey: message.id === undefined || message.id === null ? `message-${index}` : String(message.id),\n\t\t\t\t\t\tauthor,\n\t\t\t\t\t\tinitials: this.initialsOf(author),\n\t\t\t\t\t\tside,\n\t\t\t\t\t\ttext: message.text === undefined || message.text === null ? '' : String(message.text),\n\t\t\t\t\t\ttimeLabel: time.label,\n\t\t\t\t\t\tdatetime: time.datetime,\n\t\t\t\t\t\tchannel: typeof message.channel === 'string' ? message.channel : '',\n\t\t\t\t\t\tstatus: typeof message.status === 'string' ? message.status : '',\n\t\t\t\t\t\tactions: Array.isArray(message.actions) ? message.actions.filter((action) => action && action.id && action.label) : [],\n\t\t\t\t\t\tdirectionLabel: side === 'us' ? t('nextcloud-vue', 'Sent message') : t('nextcloud-vue', 'Received message'),\n\t\t\t\t\t\tdirectionWord: side === 'us' ? t('nextcloud-vue', 'Outgoing') : t('nextcloud-vue', 'Incoming'),\n\t\t\t\t\t\tnote: typeof message.note === 'string' ? message.note : '',\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t},\n\n\t\t/**\n\t\t * The channel labels with a chip: the declared ones, then the ones\n\t\t * the messages use.\n\t\t *\n\t\t * @return {Array<string>} The labels, each once.\n\t\t */\n\t\tchannelLabels() {\n\t\t\tconst declared = (Array.isArray(this.channels) ? this.channels : []).filter((label) => typeof label === 'string' && label !== '')\n\t\t\treturn [...new Set([...declared, ...this.rows.map((row) => row.channel).filter(Boolean)])]\n\t\t},\n\n\t\t/**\n\t\t * The chips: All, then each channel, each with its count. Empty\n\t\t * without `channelFilter` or without channels.\n\t\t *\n\t\t * @return {Array<{label: string, count: number}>} The chips.\n\t\t */\n\t\tchannelChips() {\n\t\t\tif (!this.channelFilter || this.channelLabels.length === 0) {\n\t\t\t\treturn []\n\t\t\t}\n\t\t\treturn [\n\t\t\t\t{ label: this.allLabel, count: this.rows.length },\n\t\t\t\t...this.channelLabels.map((label) => ({ label, count: this.rows.filter((row) => row.channel === label).length })),\n\t\t\t]\n\t\t},\n\n\t\t/**\n\t\t * Whether the reply option renders: it has a label and a key.\n\t\t *\n\t\t * @return {boolean}\n\t\t * @spec openspec/changes/conversation-reply-option/specs/conversation-source/spec.md#requirement-a-reply-can-carry-a-hint-and-an-option\n\t\t */\n\t\toptionShown() {\n\t\t\tconst option = this.replyOption\n\t\t\treturn Boolean(option && typeof option.label === 'string' && option.label !== '' && typeof option.key === 'string' && option.key !== '')\n\t\t},\n\n\t\t/**\n\t\t * What travels with the reply besides its text.\n\t\t *\n\t\t * @return {object} `{ [key]: state }`, or {} without an option.\n\t\t * @spec openspec/changes/conversation-reply-option/specs/conversation-source/spec.md#requirement-a-reply-can-carry-a-hint-and-an-option\n\t\t */\n\t\treplyExtras() {\n\t\t\treturn this.optionShown ? { [this.replyOption.key]: this.optionOn === true } : {}\n\t\t},\n\n\t\t/**\n\t\t * The All chip: the host's word first, as its own filter chips read\n\t\t * (\"Alles\"), then the library's.\n\t\t *\n\t\t * @return {string} The label.\n\t\t * @spec openspec/changes/conversation-all-chip-host-word/specs/conversation-source/spec.md#requirement-the-all-chip-reads-the-hosts-word\n\t\t */\n\t\tallLabel() {\n\t\t\tconst host = typeof this.cnTranslate === 'function' ? this.cnTranslate('All') : 'All'\n\t\t\treturn typeof host === 'string' && host !== '' && host !== 'All' ? host : t('nextcloud-vue', 'All')\n\t\t},\n\n\t\t/** @return {number} The pressed chip: 0 for All. */\n\t\tactiveChannelIndex() {\n\t\t\tconst index = this.channelLabels.indexOf(this.activeChannel)\n\t\t\treturn index < 0 ? 0 : index + 1\n\t\t},\n\n\t\t/** @return {Array<object>} The rows on the chosen channel, or all of them. */\n\t\tshownRows() {\n\t\t\tif (this.channelChips.length === 0 || this.activeChannelIndex === 0) {\n\t\t\t\treturn this.rows\n\t\t\t}\n\t\t\treturn this.rows.filter((row) => row.channel === this.activeChannel)\n\t\t},\n\n\t\t/**\n\t\t * Whether there is something to send and nothing in flight.\n\t\t *\n\t\t * @return {boolean} True when Send is enabled.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tcanSend() {\n\t\t\treturn !this.sending && this.draft.trim() !== ''\n\t\t},\n\n\t\t/**\n\t\t * Accessible name for a thread without a title.\n\t\t *\n\t\t * @return {string} The label.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tfallbackLabel() {\n\t\t\treturn t('nextcloud-vue', 'Conversation')\n\t\t},\n\n\t\t/** @return {string} What the thread says while its messages load. */\n\t\tloadingText() {\n\t\t\treturn t('nextcloud-vue', 'Loading messages…')\n\t\t},\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Put a text in the reply box (a template a host tool picked).\n\t\t *\n\t\t * @param {string} text The text.\n\t\t * @return {void}\n\t\t */\n\t\tsetDraft(text) {\n\t\t\tthis.draft = typeof text === 'string' ? text : ''\n\t\t},\n\n\t\t/**\n\t\t * Narrow the thread to the chip's channel; the All chip (0) clears it.\n\t\t *\n\t\t * @param {number|null} index The chip index.\n\t\t * @return {void}\n\t\t */\n\t\tonChannelChip(index) {\n\t\t\tthis.activeChannel = index > 0 ? (this.channelLabels[index - 1] || '') : ''\n\t\t},\n\n\t\t/**\n\t\t * Up to two initials of a name, for the avatar.\n\t\t *\n\t\t * @param {string} name The author.\n\t\t * @return {string} The initials, upper case.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tinitialsOf(name) {\n\t\t\tconst parts = String(name || '').trim().split(/\\s+/).filter(Boolean)\n\t\t\tif (parts.length === 0) {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t\tconst first = parts[0].charAt(0)\n\t\t\tconst last = parts.length > 1 ? parts[parts.length - 1].charAt(0) : ''\n\t\t\treturn (first + last).toUpperCase()\n\t\t},\n\n\t\t/**\n\t\t * Turn a message time into what the reader sees and what `<time>` carries.\n\t\t *\n\t\t * @param {unknown} value An ISO date, a Date, or text to show as is.\n\t\t * @return {{label: string, datetime: string}} The visible label and the machine value.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tformatTime(value) {\n\t\t\tif (value === null || value === undefined || value === '') {\n\t\t\t\treturn { label: '', datetime: '' }\n\t\t\t}\n\t\t\tconst date = value instanceof Date ? value : new Date(value)\n\t\t\tconst looksLikeDate = value instanceof Date || typeof value === 'number' || /^\\d{4}-\\d{2}-\\d{2}/.test(String(value))\n\t\t\tif (!looksLikeDate || Number.isNaN(date.getTime())) {\n\t\t\t\treturn { label: String(value), datetime: '' }\n\t\t\t}\n\t\t\tconst label = date.toLocaleString(userLocale(), { day: 'numeric', month: 'short', hour: '2-digit', minute: '2-digit' })\n\t\t\treturn { label, datetime: date.toISOString() }\n\t\t},\n\n\t\t/**\n\t\t * Submit the reply: tell the host, and post it when an endpoint is set.\n\t\t *\n\t\t * Without an endpoint the box clears straight away, because the host\n\t\t * owns the send. With one it clears only when the request succeeds, so\n\t\t * a refused reply is still there to try again.\n\t\t *\n\t\t * @return {Promise<void>}\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tasync onSend() {\n\t\t\tif (!this.canSend) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\tconst text = this.draft.trim()\n\t\t\tthis.errorMessage = ''\n\t\t\tthis.$emit('send', text, this.replyExtras)\n\t\t\tif (!this.endpoint) {\n\t\t\t\tthis.draft = ''\n\t\t\t\treturn\n\t\t\t}\n\t\t\tthis.sending = true\n\t\t\ttry {\n\t\t\t\tconst response = await axios.post(prefixUrl(this.endpoint), { ...this.payload, ...this.replyExtras, message: text })\n\t\t\t\tthis.draft = ''\n\t\t\t\tthis.$emit('sent', response?.data)\n\t\t\t} catch (error) {\n\t\t\t\tthis.errorMessage = t('nextcloud-vue', 'The message could not be sent. Try again.')\n\t\t\t\tthis.$emit('error', error)\n\t\t\t} finally {\n\t\t\t\tthis.sending = false\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n.cn-conversation-thread {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: calc(3.5 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__status {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-weight: 700;\n}\n\n.cn-conversation-thread__message-actions {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2 * var(--default-grid-baseline));\n\tmargin-top: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__header {\n\talign-items: flex-start;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(3 * var(--default-grid-baseline));\n\tjustify-content: space-between;\n}\n\n.cn-conversation-thread__header-actions {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__title {\n\tfont-size: 1.1em;\n\tfont-weight: 700;\n\tmargin: 0;\n}\n\n.cn-conversation-thread__heading {\n\tdisplay: flex;\n\tflex: 1 1 260px;\n\tflex-direction: column;\n\tgap: 3px;\n\tmin-width: 0;\n}\n\n.cn-conversation-thread__subtitle {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-size: 14px;\n\tmargin: 0;\n}\n\n.cn-conversation-thread__direction,\n.cn-conversation-thread__meta time {\n\tcolor: var(--color-text-maxcontrast);\n}\n\n.cn-conversation-thread__direction::after {\n\tcontent: ' ·';\n}\n\n.cn-conversation-thread__note {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-size: 13px;\n}\n\n.cn-conversation-thread__empty {\n\tcolor: var(--color-text-maxcontrast);\n\tmargin: 0;\n}\n\n.cn-conversation-thread__messages {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: calc(3.5 * var(--default-grid-baseline));\n\tlist-style: none;\n\tmargin: 0;\n\tpadding: 0;\n}\n\n.cn-conversation-thread__message {\n\tdisplay: flex;\n\tgap: calc(3 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__message--us {\n\tflex-direction: row-reverse;\n}\n\n.cn-conversation-thread__avatar {\n\talign-items: center;\n\tbackground: var(--color-background-dark);\n\tborder-radius: 50%;\n\tcolor: var(--color-main-text);\n\tdisplay: flex;\n\tflex: none;\n\tfont-size: 0.8em;\n\tfont-weight: 700;\n\theight: 34px;\n\tjustify-content: center;\n\twidth: 34px;\n}\n\n.cn-conversation-thread__bubble {\n\tbackground: var(--color-background-hover);\n\tborder-radius: var(--border-radius-large);\n\tborder-start-start-radius: var(--border-radius-small, 4px);\n\tcolor: var(--color-main-text);\n\tdisplay: flex;\n\tflex: 1;\n\tflex-direction: column;\n\tgap: var(--default-grid-baseline);\n\tmin-width: 0;\n\tpadding: calc(3 * var(--default-grid-baseline)) calc(3.5 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__message--us .cn-conversation-thread__bubble {\n\tbackground: var(--color-primary-element-light);\n\tborder-start-end-radius: var(--border-radius-small, 4px);\n\tborder-start-start-radius: var(--border-radius-large);\n\tcolor: var(--color-primary-element-light-text);\n}\n\n.cn-conversation-thread__meta {\n\talign-items: center;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tfont-size: 0.9em;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__author {\n\tfont-weight: 600;\n}\n\n.cn-conversation-thread__text {\n\toverflow-wrap: anywhere;\n\twhite-space: pre-wrap;\n}\n\n.cn-conversation-thread__reply {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__reply-head {\n\talign-items: baseline;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2 * var(--default-grid-baseline));\n\tjustify-content: space-between;\n}\n\n.cn-conversation-thread__reply-label {\n\tfont-weight: 600;\n}\n\n.cn-conversation-thread__reply-hint {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-size: 13px;\n}\n\n.cn-conversation-thread__reply-option {\n\talign-items: center;\n\tdisplay: flex;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__input {\n\tbox-sizing: border-box;\n\tmargin: 0;\n\tresize: vertical;\n\twidth: 100%;\n}\n\n.cn-conversation-thread__error {\n\tcolor: var(--color-error-text, var(--color-error));\n\tmargin: 0;\n}\n\n.cn-conversation-thread__reply-foot {\n\talign-items: center;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2.5 * var(--default-grid-baseline));\n\tjustify-content: space-between;\n}\n\n.cn-conversation-thread__reply-actions {\n\tmargin-inline-start: auto;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2.5 * var(--default-grid-baseline));\n\tjustify-content: flex-end;\n}\n\n.cn-conversation-thread__channel {\n\tcolor: var(--color-text-maxcontrast);\n}\n</style>\n"],"names":["CnQuickFilterBar","t","axios"],"mappings":"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"}
+{"version":3,"file":"CnConversationThread.vue2.js","sources":["../../../../src/components/CnConversationThread/CnConversationThread.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2026 Conduction B.V.\n  - SPDX-License-Identifier: EUPL-1.2\n-->\n\n<template>\n\t<section\n\t\tclass=\"cn-conversation-thread\"\n\t\tdata-testid=\"cn-conversation-thread\"\n\t\t:aria-labelledby=\"title ? titleId : null\"\n\t\t:aria-label=\"title ? null : fallbackLabel\">\n\t\t<div v-if=\"title || $slots['header-actions']\" class=\"cn-conversation-thread__header\">\n\t\t\t<div v-if=\"title\" class=\"cn-conversation-thread__heading\">\n\t\t\t\t<component\n\t\t\t\t\t:is=\"titleTag\"\n\t\t\t\t\t:id=\"titleId\"\n\t\t\t\t\tclass=\"cn-conversation-thread__title\">\n\t\t\t\t\t{{ title }}\n\t\t\t\t</component>\n\t\t\t\t<!-- A div, not a <p>: a theme that sets every paragraph's size with\n\t\t\t\t     !important would otherwise override the 14px subtitle. -->\n\t\t\t\t<div v-if=\"subtitle\" class=\"cn-conversation-thread__subtitle\" data-testid=\"cn-conversation-subtitle\">\n\t\t\t\t\t{{ subtitle }}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<div v-if=\"$slots['header-actions']\" class=\"cn-conversation-thread__header-actions\">\n\t\t\t\t<!-- @slot header-actions Buttons beside the title, for example \"Log contact\". -->\n\t\t\t\t<slot name=\"header-actions\" />\n\t\t\t</div>\n\t\t</div>\n\n\t\t<CnQuickFilterBar\n\t\t\tv-if=\"channelChips.length > 0\"\n\t\t\tinline\n\t\t\tclass=\"cn-conversation-thread__channels\"\n\t\t\t:tabs=\"channelChips\"\n\t\t\t:activeIndex=\"activeChannelIndex\"\n\t\t\t@update:activeIndex=\"onChannelChip\" />\n\n\t\t<p v-if=\"loading && rows.length === 0\"\n\t\t\tclass=\"cn-conversation-thread__empty\"\n\t\t\trole=\"status\"\n\t\t\tdata-testid=\"cn-conversation-loading\">\n\t\t\t{{ loadingText }}\n\t\t</p>\n\t\t<p v-else-if=\"rows.length === 0\" class=\"cn-conversation-thread__empty\" data-testid=\"cn-conversation-empty\">\n\t\t\t{{ emptyText }}\n\t\t</p>\n\n\t\t<p v-else-if=\"shownRows.length === 0\" class=\"cn-conversation-thread__empty\" data-testid=\"cn-conversation-channel-empty\">\n\t\t\t{{ emptyText }}\n\t\t</p>\n\n\t\t<ol v-else class=\"cn-conversation-thread__messages\">\n\t\t\t<li\n\t\t\t\tv-for=\"row in shownRows\"\n\t\t\t\t:key=\"row.key\"\n\t\t\t\tclass=\"cn-conversation-thread__message\"\n\t\t\t\t:class=\"`cn-conversation-thread__message--${row.side}`\"\n\t\t\t\tdata-testid=\"cn-conversation-message\"\n\t\t\t\t:data-side=\"row.side\">\n\t\t\t\t<span class=\"cn-conversation-thread__avatar\" aria-hidden=\"true\">{{ row.initials }}</span>\n\t\t\t\t<div class=\"cn-conversation-thread__bubble\">\n\t\t\t\t\t<span class=\"cn-conversation-thread__meta\">\n\t\t\t\t\t\t<span class=\"hidden-visually\">{{ row.directionLabel }}</span>\n\t\t\t\t\t\t<span class=\"cn-conversation-thread__author\">{{ row.author }}</span>\n\t\t\t\t\t\t<span v-if=\"row.channel\" class=\"cn-conversation-thread__channel\" data-testid=\"cn-conversation-channel\">{{ row.channel }}</span>\n\t\t\t\t\t\t<span v-if=\"row.status\" class=\"cn-conversation-thread__status\" data-testid=\"cn-conversation-status\">{{ row.status }}</span>\n\t\t\t\t\t\t<span v-if=\"showDirection\"\n\t\t\t\t\t\t\tclass=\"cn-conversation-thread__direction\"\n\t\t\t\t\t\t\tdata-testid=\"cn-conversation-direction\"\n\t\t\t\t\t\t\taria-hidden=\"true\">{{ row.directionWord }}</span>\n\t\t\t\t\t\t<time v-if=\"row.timeLabel\" :datetime=\"row.datetime || null\">{{ row.timeLabel }}</time>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span class=\"cn-conversation-thread__text\">{{ row.text }}</span>\n\t\t\t\t\t<span v-if=\"row.note\" class=\"cn-conversation-thread__note\" data-testid=\"cn-conversation-note\">{{ row.note }}</span>\n\t\t\t\t\t<span v-if=\"row.actions.length > 0\" class=\"cn-conversation-thread__message-actions\">\n\t\t\t\t\t\t<NcButton\n\t\t\t\t\t\t\tv-for=\"action in row.actions\"\n\t\t\t\t\t\t\t:key=\"action.id\"\n\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t:disabled=\"action.disabled === true\"\n\t\t\t\t\t\t\t:data-testid=\"`cn-conversation-action-${action.id}`\"\n\t\t\t\t\t\t\t@click=\"$emit('message-action', { action: action.id, message: row.key })\">\n\t\t\t\t\t\t\t{{ action.label }}\n\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t</span>\n\t\t\t\t</div>\n\t\t\t</li>\n\t\t</ol>\n\n\t\t<form\n\t\t\tv-if=\"allowReply\"\n\t\t\tclass=\"cn-conversation-thread__reply\"\n\t\t\tdata-testid=\"cn-conversation-reply\"\n\t\t\t@submit.prevent=\"onSend\">\n\t\t\t<!-- @slot reply-tools Tools above the reply box, for example a template picker. -->\n\t\t\t<!-- @binding {Function} setDraft Puts a text in the reply box. -->\n\t\t\t<slot name=\"reply-tools\" :setDraft=\"setDraft\" />\n\t\t\t<div class=\"cn-conversation-thread__reply-head\">\n\t\t\t\t<label :for=\"inputId\" class=\"cn-conversation-thread__reply-label\">{{ replyLabel }}</label>\n\t\t\t\t<span v-if=\"replyHint\" class=\"cn-conversation-thread__reply-hint\" data-testid=\"cn-conversation-reply-hint\">{{ replyHint }}</span>\n\t\t\t</div>\n\t\t\t<textarea\n\t\t\t\t:id=\"inputId\"\n\t\t\t\tv-model=\"draft\"\n\t\t\t\tclass=\"cn-conversation-thread__input\"\n\t\t\t\trows=\"2\"\n\t\t\t\t:placeholder=\"placeholder || null\"\n\t\t\t\t:disabled=\"sending\"\n\t\t\t\t:aria-describedby=\"errorMessage ? errorId : null\"\n\t\t\t\tdata-testid=\"cn-conversation-input\"\n\t\t\t\t@keydown.ctrl.enter.prevent=\"onSend\"\n\t\t\t\t@keydown.meta.enter.prevent=\"onSend\" />\n\t\t\t<p\n\t\t\t\tv-if=\"errorMessage\"\n\t\t\t\t:id=\"errorId\"\n\t\t\t\tclass=\"cn-conversation-thread__error\"\n\t\t\t\trole=\"alert\"\n\t\t\t\tdata-testid=\"cn-conversation-error\">\n\t\t\t\t{{ errorMessage }}\n\t\t\t</p>\n\t\t\t<!-- The option at the start and the buttons at the end of one row. -->\n\t\t\t<div class=\"cn-conversation-thread__reply-foot\">\n\t\t\t\t<label v-if=\"optionShown\" class=\"cn-conversation-thread__reply-option\" data-testid=\"cn-conversation-reply-option\">\n\t\t\t\t\t<input v-model=\"optionOn\" type=\"checkbox\" :disabled=\"sending\">\n\t\t\t\t\t<span>{{ replyOption.label }}</span>\n\t\t\t\t</label>\n\t\t\t\t<div class=\"cn-conversation-thread__reply-actions\">\n\t\t\t\t\t<!-- @slot reply-actions Extra buttons before Send, for example \"Save draft\". -->\n\t\t\t\t\t<!-- @binding {string} draft The text in the reply box. -->\n\t\t\t\t\t<slot name=\"reply-actions\" :draft=\"draft\" />\n\t\t\t\t\t<NcButton\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t:disabled=\"!canSend\"\n\t\t\t\t\t\tdata-testid=\"cn-conversation-send\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<Send :size=\"16\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t{{ sendLabel }}\n\t\t\t\t\t</NcButton>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</form>\n\t</section>\n</template>\n\n<script>\nimport axios from '@nextcloud/axios'\nimport { translate as t } from '@nextcloud/l10n'\nimport { NcButton } from '@nextcloud/vue'\nimport Send from 'vue-material-design-icons/Send.vue'\nimport CnQuickFilterBar from '../CnQuickFilterBar/CnQuickFilterBar.vue'\nimport { prefixUrl } from '../../utils/headers.js'\nimport { userLocale } from '../../utils/userLocale.js'\n\nlet conversationThreadUid = 0\n\n/**\n * CnConversationThread: the messages between you and the other party, and a box to answer.\n *\n * Each message has an author, a time and a side: `us` for the organisation,\n * `them` for the resident or customer. The reply box emits `send`, and also\n * posts to `endpoint` when one is set. It needs no Talk and no other app:\n * where the messages are stored is the host's business.\n *\n * ```vue\n * <CnConversationThread\n *   title=\"Contact with the resident\"\n *   reply-label=\"Answer to the resident\"\n *   :messages=\"[\n *     { id: 1, author: 'Sanne de Vries', time: '2026-10-04T10:52:00', side: 'them',\n *       text: 'Thank you. I would like to see all documents.' },\n *     { id: 2, time: '2026-10-04T10:24:00', side: 'us',\n *       text: 'Construction starts in March.' },\n *   ]\"\n *   @send=\"saveReply\" />\n * ```\n *\n * The `conversation` detail widget type renders this thread from a field on\n * the record.\n */\nexport default {\n\tname: 'CnConversationThread',\n\n\tcomponents: {\n\t\tCnQuickFilterBar,\n\t\tNcButton,\n\t\tSend,\n\t},\n\n\tinject: {\n\t\t/** The host app's translate, for the All chip in the host's word. */\n\t\tcnTranslate: { default: null },\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * The messages, oldest first: `{ id?, author?, time?, text, side?, channel?, status?, actions?, note? }`.\n\t\t * `status` is shown after the channel (\"Failed\"); `actions` are\n\t\t * `{ id, label, disabled? }` buttons under the text, each emitting\n\t\t * `message-action`.\n\t\t * `note` is a muted line under the text.\n\t\t * `side` is `us` or `them` (default `them`). `time` is an ISO\n\t\t * date, or any text to show as is. `channel` is shown after the\n\t\t * author (\"E-mail\", \"Phone note\"); `note` is a muted line under the text.\n\t\t */\n\t\tmessages: {\n\t\t\ttype: Array,\n\t\t\tdefault: () => [],\n\t\t},\n\n\t\t/** Heading of the thread. */\n\t\ttitle: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** A line under the title, such as \"Oldest first, with the channel of each message\". */\n\t\tsubtitle: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** Say each message's direction in words before its time (\"Incoming · 3 Oct\"), not only to a screen reader. */\n\t\tshowDirection: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/** Element the heading renders as. */\n\t\ttitleTag: {\n\t\t\ttype: String,\n\t\t\tdefault: 'h3',\n\t\t},\n\n\t\t/** A line beside the reply label saying where the answer goes, such as \"Goes to the message box in the portal\". */\n\t\treplyHint: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * A switch under the reply box whose state is sent with the reply:\n\t\t * `{ label, key, value? }`, `value` the starting state (on by default).\n\t\t * The reply's `send` event carries `{ [key]: state }` after the text.\n\t\t *\n\t\t * @type {{label: string, key: string, value?: boolean}|null}\n\t\t */\n\t\treplyOption: {\n\t\t\ttype: Object,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/** Whether the reply box renders. Turn it off for a closed or read-only record. */\n\t\tallowReply: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\n\t\t/** Label of the reply box. */\n\t\treplyLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'Reply'),\n\t\t},\n\n\t\t/** Placeholder inside the reply box. */\n\t\tplaceholder: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** Label of the send button. */\n\t\tsendLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'Send'),\n\t\t},\n\n\t\t/** Author shown on an `us` message that names none. */\n\t\tusLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'You'),\n\t\t},\n\n\t\t/**\n\t\t * URL the reply is POSTed to as `{ message }`. Empty means the host\n\t\t * handles `send` itself and nothing is requested.\n\t\t */\n\t\tendpoint: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** Extra fields sent along with `message` when `endpoint` is set. */\n\t\tpayload: {\n\t\t\ttype: Object,\n\t\t\tdefault: () => ({}),\n\t\t},\n\n\t\t/** Whether the messages are still loading; with none yet the thread says so. */\n\t\tloading: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Draw channel chips above the messages: All, then one per channel\n\t\t * with its count. Choosing one shows only that channel's messages.\n\t\t */\n\t\tchannelFilter: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Channel labels that always get a chip, in this order, also when no\n\t\t * message uses them yet. Channels the messages use follow.\n\t\t */\n\t\tchannels: {\n\t\t\ttype: Array,\n\t\t\tdefault: () => [],\n\t\t},\n\n\t\t/** Shown when there are no messages yet. */\n\t\temptyText: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'No messages yet.'),\n\t\t},\n\t},\n\n\temits: [\n\t\t/** A reply was submitted. Payload: the text. */\n\t\t'send',\n\t\t/** The endpoint accepted the reply. Payload: the response body. */\n\t\t'sent',\n\t\t/** The endpoint refused the reply. Payload: the error. */\n\t\t'error',\n\t\t/** A message action was pressed. Payload: `{ action, message }`, the action id and the message key. */\n\t\t'message-action',\n\t],\n\n\tdata() {\n\t\tconversationThreadUid += 1\n\t\treturn {\n\t\t\tdraft: '',\n\t\t\t/** The state of the reply option's switch. */\n\t\t\toptionOn: this.replyOption?.value !== false,\n\t\t\t/** The channel the chips narrow the thread to; '' is All. */\n\t\t\tactiveChannel: '',\n\t\t\tsending: false,\n\t\t\terrorMessage: '',\n\t\t\ttitleId: `cn-conversation-title-${conversationThreadUid}`,\n\t\t\tinputId: `cn-conversation-input-${conversationThreadUid}`,\n\t\t\terrorId: `cn-conversation-error-${conversationThreadUid}`,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\t/**\n\t\t * The messages, with author, side, time and initials resolved.\n\t\t *\n\t\t * @return {Array<{key: string, author: string, initials: string, side: string, text: string, timeLabel: string, datetime: string, channel: string, directionLabel: string, directionWord: string, note: string}>} The rows.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\trows() {\n\t\t\treturn (Array.isArray(this.messages) ? this.messages : [])\n\t\t\t\t.filter((message) => message && typeof message === 'object')\n\t\t\t\t.map((message, index) => {\n\t\t\t\t\tconst side = message.side === 'us' ? 'us' : 'them'\n\t\t\t\t\tconst author = typeof message.author === 'string' && message.author !== ''\n\t\t\t\t\t\t? message.author\n\t\t\t\t\t\t: (side === 'us' ? this.usLabel : '')\n\t\t\t\t\tconst time = this.formatTime(message.time)\n\t\t\t\t\treturn {\n\t\t\t\t\t\tkey: message.id === undefined || message.id === null ? `message-${index}` : String(message.id),\n\t\t\t\t\t\tauthor,\n\t\t\t\t\t\tinitials: this.initialsOf(author),\n\t\t\t\t\t\tside,\n\t\t\t\t\t\ttext: message.text === undefined || message.text === null ? '' : String(message.text),\n\t\t\t\t\t\ttimeLabel: time.label,\n\t\t\t\t\t\tdatetime: time.datetime,\n\t\t\t\t\t\tchannel: typeof message.channel === 'string' ? message.channel : '',\n\t\t\t\t\t\tstatus: typeof message.status === 'string' ? message.status : '',\n\t\t\t\t\t\tactions: Array.isArray(message.actions) ? message.actions.filter((action) => action && action.id && action.label) : [],\n\t\t\t\t\t\tdirectionLabel: side === 'us' ? t('nextcloud-vue', 'Sent message') : t('nextcloud-vue', 'Received message'),\n\t\t\t\t\t\tdirectionWord: side === 'us' ? t('nextcloud-vue', 'Outgoing') : t('nextcloud-vue', 'Incoming'),\n\t\t\t\t\t\tnote: typeof message.note === 'string' ? message.note : '',\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t},\n\n\t\t/**\n\t\t * The channel labels with a chip: the declared ones, then the ones\n\t\t * the messages use.\n\t\t *\n\t\t * @return {Array<string>} The labels, each once.\n\t\t */\n\t\tchannelLabels() {\n\t\t\tconst declared = (Array.isArray(this.channels) ? this.channels : []).filter((label) => typeof label === 'string' && label !== '')\n\t\t\treturn [...new Set([...declared, ...this.rows.map((row) => row.channel).filter(Boolean)])]\n\t\t},\n\n\t\t/**\n\t\t * The chips: All, then each channel, each with its count. Empty\n\t\t * without `channelFilter` or without channels.\n\t\t *\n\t\t * @return {Array<{label: string, count: number}>} The chips.\n\t\t */\n\t\tchannelChips() {\n\t\t\tif (!this.channelFilter || this.channelLabels.length === 0) {\n\t\t\t\treturn []\n\t\t\t}\n\t\t\treturn [\n\t\t\t\t{ label: this.allLabel, count: this.rows.length },\n\t\t\t\t...this.channelLabels.map((label) => ({ label, count: this.rows.filter((row) => row.channel === label).length })),\n\t\t\t]\n\t\t},\n\n\t\t/**\n\t\t * Whether the reply option renders: it has a label and a key.\n\t\t *\n\t\t * @return {boolean}\n\t\t * @spec openspec/changes/conversation-reply-option/specs/conversation-source/spec.md#requirement-a-reply-can-carry-a-hint-and-an-option\n\t\t */\n\t\toptionShown() {\n\t\t\tconst option = this.replyOption\n\t\t\treturn Boolean(option && typeof option.label === 'string' && option.label !== '' && typeof option.key === 'string' && option.key !== '')\n\t\t},\n\n\t\t/**\n\t\t * What travels with the reply besides its text.\n\t\t *\n\t\t * @return {object} `{ [key]: state }`, or {} without an option.\n\t\t * @spec openspec/changes/conversation-reply-option/specs/conversation-source/spec.md#requirement-a-reply-can-carry-a-hint-and-an-option\n\t\t */\n\t\treplyExtras() {\n\t\t\treturn this.optionShown ? { [this.replyOption.key]: this.optionOn === true } : {}\n\t\t},\n\n\t\t/**\n\t\t * The All chip: the host's word first, as its own filter chips read\n\t\t * (\"Alles\"), then the library's.\n\t\t *\n\t\t * @return {string} The label.\n\t\t * @spec openspec/changes/conversation-all-chip-host-word/specs/conversation-source/spec.md#requirement-the-all-chip-reads-the-hosts-word\n\t\t */\n\t\tallLabel() {\n\t\t\tconst host = typeof this.cnTranslate === 'function' ? this.cnTranslate('All') : 'All'\n\t\t\treturn typeof host === 'string' && host !== '' && host !== 'All' ? host : t('nextcloud-vue', 'All')\n\t\t},\n\n\t\t/** @return {number} The pressed chip: 0 for All. */\n\t\tactiveChannelIndex() {\n\t\t\tconst index = this.channelLabels.indexOf(this.activeChannel)\n\t\t\treturn index < 0 ? 0 : index + 1\n\t\t},\n\n\t\t/** @return {Array<object>} The rows on the chosen channel, or all of them. */\n\t\tshownRows() {\n\t\t\tif (this.channelChips.length === 0 || this.activeChannelIndex === 0) {\n\t\t\t\treturn this.rows\n\t\t\t}\n\t\t\treturn this.rows.filter((row) => row.channel === this.activeChannel)\n\t\t},\n\n\t\t/**\n\t\t * Whether there is something to send and nothing in flight.\n\t\t *\n\t\t * @return {boolean} True when Send is enabled.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tcanSend() {\n\t\t\treturn !this.sending && this.draft.trim() !== ''\n\t\t},\n\n\t\t/**\n\t\t * Accessible name for a thread without a title.\n\t\t *\n\t\t * @return {string} The label.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tfallbackLabel() {\n\t\t\treturn t('nextcloud-vue', 'Conversation')\n\t\t},\n\n\t\t/** @return {string} What the thread says while its messages load. */\n\t\tloadingText() {\n\t\t\treturn t('nextcloud-vue', 'Loading messages…')\n\t\t},\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Put a text in the reply box (a template a host tool picked).\n\t\t *\n\t\t * @param {string} text The text.\n\t\t * @return {void}\n\t\t */\n\t\tsetDraft(text) {\n\t\t\tthis.draft = typeof text === 'string' ? text : ''\n\t\t},\n\n\t\t/**\n\t\t * Narrow the thread to the chip's channel; the All chip (0) clears it.\n\t\t *\n\t\t * @param {number|null} index The chip index.\n\t\t * @return {void}\n\t\t */\n\t\tonChannelChip(index) {\n\t\t\tthis.activeChannel = index > 0 ? (this.channelLabels[index - 1] || '') : ''\n\t\t},\n\n\t\t/**\n\t\t * Up to two initials of a name, for the avatar.\n\t\t *\n\t\t * @param {string} name The author.\n\t\t * @return {string} The initials, upper case.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tinitialsOf(name) {\n\t\t\tconst parts = String(name || '').trim().split(/\\s+/).filter(Boolean)\n\t\t\tif (parts.length === 0) {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t\tconst first = parts[0].charAt(0)\n\t\t\tconst last = parts.length > 1 ? parts[parts.length - 1].charAt(0) : ''\n\t\t\treturn (first + last).toUpperCase()\n\t\t},\n\n\t\t/**\n\t\t * Turn a message time into what the reader sees and what `<time>` carries.\n\t\t *\n\t\t * @param {unknown} value An ISO date, a Date, or text to show as is.\n\t\t * @return {{label: string, datetime: string}} The visible label and the machine value.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tformatTime(value) {\n\t\t\tif (value === null || value === undefined || value === '') {\n\t\t\t\treturn { label: '', datetime: '' }\n\t\t\t}\n\t\t\tconst date = value instanceof Date ? value : new Date(value)\n\t\t\tconst looksLikeDate = value instanceof Date || typeof value === 'number' || /^\\d{4}-\\d{2}-\\d{2}/.test(String(value))\n\t\t\tif (!looksLikeDate || Number.isNaN(date.getTime())) {\n\t\t\t\treturn { label: String(value), datetime: '' }\n\t\t\t}\n\t\t\tconst label = date.toLocaleString(userLocale(), { day: 'numeric', month: 'short', hour: '2-digit', minute: '2-digit' })\n\t\t\treturn { label, datetime: date.toISOString() }\n\t\t},\n\n\t\t/**\n\t\t * Submit the reply: tell the host, and post it when an endpoint is set.\n\t\t *\n\t\t * Without an endpoint the box clears straight away, because the host\n\t\t * owns the send. With one it clears only when the request succeeds, so\n\t\t * a refused reply is still there to try again.\n\t\t *\n\t\t * @return {Promise<void>}\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tasync onSend() {\n\t\t\tif (!this.canSend) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\tconst text = this.draft.trim()\n\t\t\tthis.errorMessage = ''\n\t\t\tthis.$emit('send', text, this.replyExtras)\n\t\t\tif (!this.endpoint) {\n\t\t\t\tthis.draft = ''\n\t\t\t\treturn\n\t\t\t}\n\t\t\tthis.sending = true\n\t\t\ttry {\n\t\t\t\tconst response = await axios.post(prefixUrl(this.endpoint), { ...this.payload, ...this.replyExtras, message: text })\n\t\t\t\tthis.draft = ''\n\t\t\t\tthis.$emit('sent', response?.data)\n\t\t\t} catch (error) {\n\t\t\t\tthis.errorMessage = t('nextcloud-vue', 'The message could not be sent. Try again.')\n\t\t\t\tthis.$emit('error', error)\n\t\t\t} finally {\n\t\t\t\tthis.sending = false\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n.cn-conversation-thread {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: calc(3.5 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__status {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-weight: 700;\n}\n\n.cn-conversation-thread__message-actions {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2 * var(--default-grid-baseline));\n\tmargin-top: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__header {\n\talign-items: flex-start;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(3 * var(--default-grid-baseline));\n\tjustify-content: space-between;\n}\n\n.cn-conversation-thread__header-actions {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__title {\n\tfont-size: 1.1em;\n\tfont-weight: 700;\n\tmargin: 0;\n}\n\n.cn-conversation-thread__heading {\n\tdisplay: flex;\n\tflex: 1 1 260px;\n\tflex-direction: column;\n\tgap: 3px;\n\tmin-width: 0;\n}\n\n.cn-conversation-thread__subtitle {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-size: 14px;\n\tline-height: normal;\n\tmargin: 0;\n}\n\n.cn-conversation-thread__direction,\n.cn-conversation-thread__meta time {\n\tcolor: var(--color-text-maxcontrast);\n}\n\n.cn-conversation-thread__direction::after {\n\tcontent: ' ·';\n}\n\n.cn-conversation-thread__note {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-size: 13px;\n}\n\n.cn-conversation-thread__empty {\n\tcolor: var(--color-text-maxcontrast);\n\tmargin: 0;\n}\n\n.cn-conversation-thread__messages {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: calc(3.5 * var(--default-grid-baseline));\n\tlist-style: none;\n\tmargin: 0;\n\tpadding: 0;\n}\n\n.cn-conversation-thread__message {\n\tdisplay: flex;\n\tgap: calc(3 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__message--us {\n\tflex-direction: row-reverse;\n}\n\n.cn-conversation-thread__avatar {\n\talign-items: center;\n\tbackground: var(--color-background-dark);\n\tborder-radius: 50%;\n\tcolor: var(--color-main-text);\n\tdisplay: flex;\n\tflex: none;\n\tfont-size: 0.8em;\n\tfont-weight: 700;\n\theight: 34px;\n\tjustify-content: center;\n\twidth: 34px;\n}\n\n.cn-conversation-thread__bubble {\n\tbackground: var(--color-background-hover);\n\tborder-radius: var(--border-radius-large);\n\tborder-start-start-radius: var(--border-radius-small, 4px);\n\tcolor: var(--color-main-text);\n\tdisplay: flex;\n\tflex: 1;\n\tflex-direction: column;\n\tgap: var(--default-grid-baseline);\n\tmin-width: 0;\n\tpadding: calc(3 * var(--default-grid-baseline)) calc(3.5 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__message--us .cn-conversation-thread__bubble {\n\tbackground: var(--color-primary-element-light);\n\tborder-start-end-radius: var(--border-radius-small, 4px);\n\tborder-start-start-radius: var(--border-radius-large);\n\tcolor: var(--color-primary-element-light-text);\n}\n\n.cn-conversation-thread__meta {\n\talign-items: center;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tfont-size: 0.9em;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__author {\n\tfont-weight: 600;\n}\n\n.cn-conversation-thread__text {\n\toverflow-wrap: anywhere;\n\twhite-space: pre-wrap;\n}\n\n.cn-conversation-thread__reply {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__reply-head {\n\talign-items: baseline;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2 * var(--default-grid-baseline));\n\tjustify-content: space-between;\n}\n\n.cn-conversation-thread__reply-label {\n\tfont-weight: 600;\n}\n\n.cn-conversation-thread__reply-hint {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-size: 13px;\n}\n\n.cn-conversation-thread__reply-option {\n\talign-items: center;\n\tdisplay: flex;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__input {\n\tbox-sizing: border-box;\n\tmargin: 0;\n\tresize: vertical;\n\twidth: 100%;\n}\n\n.cn-conversation-thread__error {\n\tcolor: var(--color-error-text, var(--color-error));\n\tmargin: 0;\n}\n\n.cn-conversation-thread__reply-foot {\n\talign-items: center;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2.5 * var(--default-grid-baseline));\n\tjustify-content: space-between;\n}\n\n.cn-conversation-thread__reply-actions {\n\tmargin-inline-start: auto;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2.5 * var(--default-grid-baseline));\n\tjustify-content: flex-end;\n}\n\n.cn-conversation-thread__channel {\n\tcolor: var(--color-text-maxcontrast);\n}\n</style>\n"],"names":["CnQuickFilterBar","t","axios"],"mappings":"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"}

package/dist/esm/components/CnConversationThread/CnConversationThread.vue3.js

@@ -117,7 +117,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                   _: 1 /* STABLE */
                 }, 8 /* PROPS */, ["id"])),
                 ($props.subtitle)
-                  ? (openBlock(), createElementBlock("p", _hoisted_4, toDisplayString($props.subtitle), 1 /* TEXT */))
+                  ? (openBlock(), createElementBlock("div", _hoisted_4, toDisplayString($props.subtitle), 1 /* TEXT */))
                   : createCommentVNode("v-if", true)
               ]))
             : createCommentVNode("v-if", true),

package/dist/esm/components/CnConversationThread/CnConversationThread.vue3.js.map

@@ -1 +1 @@
-{"version":3,"file":"CnConversationThread.vue3.js","sources":["../../../../src/components/CnConversationThread/CnConversationThread.vue?vue&type=template&id=0d461ee4&lang.js"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2026 Conduction B.V.\n  - SPDX-License-Identifier: EUPL-1.2\n-->\n\n<template>\n\t<section\n\t\tclass=\"cn-conversation-thread\"\n\t\tdata-testid=\"cn-conversation-thread\"\n\t\t:aria-labelledby=\"title ? titleId : null\"\n\t\t:aria-label=\"title ? null : fallbackLabel\">\n\t\t<div v-if=\"title || $slots['header-actions']\" class=\"cn-conversation-thread__header\">\n\t\t\t<div v-if=\"title\" class=\"cn-conversation-thread__heading\">\n\t\t\t\t<component\n\t\t\t\t\t:is=\"titleTag\"\n\t\t\t\t\t:id=\"titleId\"\n\t\t\t\t\tclass=\"cn-conversation-thread__title\">\n\t\t\t\t\t{{ title }}\n\t\t\t\t</component>\n\t\t\t\t<p v-if=\"subtitle\" class=\"cn-conversation-thread__subtitle\" data-testid=\"cn-conversation-subtitle\">\n\t\t\t\t\t{{ subtitle }}\n\t\t\t\t</p>\n\t\t\t</div>\n\t\t\t<div v-if=\"$slots['header-actions']\" class=\"cn-conversation-thread__header-actions\">\n\t\t\t\t<!-- @slot header-actions Buttons beside the title, for example \"Log contact\". -->\n\t\t\t\t<slot name=\"header-actions\" />\n\t\t\t</div>\n\t\t</div>\n\n\t\t<CnQuickFilterBar\n\t\t\tv-if=\"channelChips.length > 0\"\n\t\t\tinline\n\t\t\tclass=\"cn-conversation-thread__channels\"\n\t\t\t:tabs=\"channelChips\"\n\t\t\t:activeIndex=\"activeChannelIndex\"\n\t\t\t@update:activeIndex=\"onChannelChip\" />\n\n\t\t<p v-if=\"loading && rows.length === 0\"\n\t\t\tclass=\"cn-conversation-thread__empty\"\n\t\t\trole=\"status\"\n\t\t\tdata-testid=\"cn-conversation-loading\">\n\t\t\t{{ loadingText }}\n\t\t</p>\n\t\t<p v-else-if=\"rows.length === 0\" class=\"cn-conversation-thread__empty\" data-testid=\"cn-conversation-empty\">\n\t\t\t{{ emptyText }}\n\t\t</p>\n\n\t\t<p v-else-if=\"shownRows.length === 0\" class=\"cn-conversation-thread__empty\" data-testid=\"cn-conversation-channel-empty\">\n\t\t\t{{ emptyText }}\n\t\t</p>\n\n\t\t<ol v-else class=\"cn-conversation-thread__messages\">\n\t\t\t<li\n\t\t\t\tv-for=\"row in shownRows\"\n\t\t\t\t:key=\"row.key\"\n\t\t\t\tclass=\"cn-conversation-thread__message\"\n\t\t\t\t:class=\"`cn-conversation-thread__message--${row.side}`\"\n\t\t\t\tdata-testid=\"cn-conversation-message\"\n\t\t\t\t:data-side=\"row.side\">\n\t\t\t\t<span class=\"cn-conversation-thread__avatar\" aria-hidden=\"true\">{{ row.initials }}</span>\n\t\t\t\t<div class=\"cn-conversation-thread__bubble\">\n\t\t\t\t\t<span class=\"cn-conversation-thread__meta\">\n\t\t\t\t\t\t<span class=\"hidden-visually\">{{ row.directionLabel }}</span>\n\t\t\t\t\t\t<span class=\"cn-conversation-thread__author\">{{ row.author }}</span>\n\t\t\t\t\t\t<span v-if=\"row.channel\" class=\"cn-conversation-thread__channel\" data-testid=\"cn-conversation-channel\">{{ row.channel }}</span>\n\t\t\t\t\t\t<span v-if=\"row.status\" class=\"cn-conversation-thread__status\" data-testid=\"cn-conversation-status\">{{ row.status }}</span>\n\t\t\t\t\t\t<span v-if=\"showDirection\"\n\t\t\t\t\t\t\tclass=\"cn-conversation-thread__direction\"\n\t\t\t\t\t\t\tdata-testid=\"cn-conversation-direction\"\n\t\t\t\t\t\t\taria-hidden=\"true\">{{ row.directionWord }}</span>\n\t\t\t\t\t\t<time v-if=\"row.timeLabel\" :datetime=\"row.datetime || null\">{{ row.timeLabel }}</time>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span class=\"cn-conversation-thread__text\">{{ row.text }}</span>\n\t\t\t\t\t<span v-if=\"row.note\" class=\"cn-conversation-thread__note\" data-testid=\"cn-conversation-note\">{{ row.note }}</span>\n\t\t\t\t\t<span v-if=\"row.actions.length > 0\" class=\"cn-conversation-thread__message-actions\">\n\t\t\t\t\t\t<NcButton\n\t\t\t\t\t\t\tv-for=\"action in row.actions\"\n\t\t\t\t\t\t\t:key=\"action.id\"\n\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t:disabled=\"action.disabled === true\"\n\t\t\t\t\t\t\t:data-testid=\"`cn-conversation-action-${action.id}`\"\n\t\t\t\t\t\t\t@click=\"$emit('message-action', { action: action.id, message: row.key })\">\n\t\t\t\t\t\t\t{{ action.label }}\n\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t</span>\n\t\t\t\t</div>\n\t\t\t</li>\n\t\t</ol>\n\n\t\t<form\n\t\t\tv-if=\"allowReply\"\n\t\t\tclass=\"cn-conversation-thread__reply\"\n\t\t\tdata-testid=\"cn-conversation-reply\"\n\t\t\t@submit.prevent=\"onSend\">\n\t\t\t<!-- @slot reply-tools Tools above the reply box, for example a template picker. -->\n\t\t\t<!-- @binding {Function} setDraft Puts a text in the reply box. -->\n\t\t\t<slot name=\"reply-tools\" :setDraft=\"setDraft\" />\n\t\t\t<div class=\"cn-conversation-thread__reply-head\">\n\t\t\t\t<label :for=\"inputId\" class=\"cn-conversation-thread__reply-label\">{{ replyLabel }}</label>\n\t\t\t\t<span v-if=\"replyHint\" class=\"cn-conversation-thread__reply-hint\" data-testid=\"cn-conversation-reply-hint\">{{ replyHint }}</span>\n\t\t\t</div>\n\t\t\t<textarea\n\t\t\t\t:id=\"inputId\"\n\t\t\t\tv-model=\"draft\"\n\t\t\t\tclass=\"cn-conversation-thread__input\"\n\t\t\t\trows=\"2\"\n\t\t\t\t:placeholder=\"placeholder || null\"\n\t\t\t\t:disabled=\"sending\"\n\t\t\t\t:aria-describedby=\"errorMessage ? errorId : null\"\n\t\t\t\tdata-testid=\"cn-conversation-input\"\n\t\t\t\t@keydown.ctrl.enter.prevent=\"onSend\"\n\t\t\t\t@keydown.meta.enter.prevent=\"onSend\" />\n\t\t\t<p\n\t\t\t\tv-if=\"errorMessage\"\n\t\t\t\t:id=\"errorId\"\n\t\t\t\tclass=\"cn-conversation-thread__error\"\n\t\t\t\trole=\"alert\"\n\t\t\t\tdata-testid=\"cn-conversation-error\">\n\t\t\t\t{{ errorMessage }}\n\t\t\t</p>\n\t\t\t<!-- The option at the start and the buttons at the end of one row. -->\n\t\t\t<div class=\"cn-conversation-thread__reply-foot\">\n\t\t\t\t<label v-if=\"optionShown\" class=\"cn-conversation-thread__reply-option\" data-testid=\"cn-conversation-reply-option\">\n\t\t\t\t\t<input v-model=\"optionOn\" type=\"checkbox\" :disabled=\"sending\">\n\t\t\t\t\t<span>{{ replyOption.label }}</span>\n\t\t\t\t</label>\n\t\t\t\t<div class=\"cn-conversation-thread__reply-actions\">\n\t\t\t\t\t<!-- @slot reply-actions Extra buttons before Send, for example \"Save draft\". -->\n\t\t\t\t\t<!-- @binding {string} draft The text in the reply box. -->\n\t\t\t\t\t<slot name=\"reply-actions\" :draft=\"draft\" />\n\t\t\t\t\t<NcButton\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t:disabled=\"!canSend\"\n\t\t\t\t\t\tdata-testid=\"cn-conversation-send\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<Send :size=\"16\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t{{ sendLabel }}\n\t\t\t\t\t</NcButton>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</form>\n\t</section>\n</template>\n\n<script>\nimport axios from '@nextcloud/axios'\nimport { translate as t } from '@nextcloud/l10n'\nimport { NcButton } from '@nextcloud/vue'\nimport Send from 'vue-material-design-icons/Send.vue'\nimport CnQuickFilterBar from '../CnQuickFilterBar/CnQuickFilterBar.vue'\nimport { prefixUrl } from '../../utils/headers.js'\nimport { userLocale } from '../../utils/userLocale.js'\n\nlet conversationThreadUid = 0\n\n/**\n * CnConversationThread: the messages between you and the other party, and a box to answer.\n *\n * Each message has an author, a time and a side: `us` for the organisation,\n * `them` for the resident or customer. The reply box emits `send`, and also\n * posts to `endpoint` when one is set. It needs no Talk and no other app:\n * where the messages are stored is the host's business.\n *\n * ```vue\n * <CnConversationThread\n *   title=\"Contact with the resident\"\n *   reply-label=\"Answer to the resident\"\n *   :messages=\"[\n *     { id: 1, author: 'Sanne de Vries', time: '2026-10-04T10:52:00', side: 'them',\n *       text: 'Thank you. I would like to see all documents.' },\n *     { id: 2, time: '2026-10-04T10:24:00', side: 'us',\n *       text: 'Construction starts in March.' },\n *   ]\"\n *   @send=\"saveReply\" />\n * ```\n *\n * The `conversation` detail widget type renders this thread from a field on\n * the record.\n */\nexport default {\n\tname: 'CnConversationThread',\n\n\tcomponents: {\n\t\tCnQuickFilterBar,\n\t\tNcButton,\n\t\tSend,\n\t},\n\n\tinject: {\n\t\t/** The host app's translate, for the All chip in the host's word. */\n\t\tcnTranslate: { default: null },\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * The messages, oldest first: `{ id?, author?, time?, text, side?, channel?, status?, actions?, note? }`.\n\t\t * `status` is shown after the channel (\"Failed\"); `actions` are\n\t\t * `{ id, label, disabled? }` buttons under the text, each emitting\n\t\t * `message-action`.\n\t\t * `note` is a muted line under the text.\n\t\t * `side` is `us` or `them` (default `them`). `time` is an ISO\n\t\t * date, or any text to show as is. `channel` is shown after the\n\t\t * author (\"E-mail\", \"Phone note\"); `note` is a muted line under the text.\n\t\t */\n\t\tmessages: {\n\t\t\ttype: Array,\n\t\t\tdefault: () => [],\n\t\t},\n\n\t\t/** Heading of the thread. */\n\t\ttitle: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** A line under the title, such as \"Oldest first, with the channel of each message\". */\n\t\tsubtitle: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** Say each message's direction in words before its time (\"Incoming · 3 Oct\"), not only to a screen reader. */\n\t\tshowDirection: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/** Element the heading renders as. */\n\t\ttitleTag: {\n\t\t\ttype: String,\n\t\t\tdefault: 'h3',\n\t\t},\n\n\t\t/** A line beside the reply label saying where the answer goes, such as \"Goes to the message box in the portal\". */\n\t\treplyHint: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * A switch under the reply box whose state is sent with the reply:\n\t\t * `{ label, key, value? }`, `value` the starting state (on by default).\n\t\t * The reply's `send` event carries `{ [key]: state }` after the text.\n\t\t *\n\t\t * @type {{label: string, key: string, value?: boolean}|null}\n\t\t */\n\t\treplyOption: {\n\t\t\ttype: Object,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/** Whether the reply box renders. Turn it off for a closed or read-only record. */\n\t\tallowReply: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\n\t\t/** Label of the reply box. */\n\t\treplyLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'Reply'),\n\t\t},\n\n\t\t/** Placeholder inside the reply box. */\n\t\tplaceholder: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** Label of the send button. */\n\t\tsendLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'Send'),\n\t\t},\n\n\t\t/** Author shown on an `us` message that names none. */\n\t\tusLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'You'),\n\t\t},\n\n\t\t/**\n\t\t * URL the reply is POSTed to as `{ message }`. Empty means the host\n\t\t * handles `send` itself and nothing is requested.\n\t\t */\n\t\tendpoint: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** Extra fields sent along with `message` when `endpoint` is set. */\n\t\tpayload: {\n\t\t\ttype: Object,\n\t\t\tdefault: () => ({}),\n\t\t},\n\n\t\t/** Whether the messages are still loading; with none yet the thread says so. */\n\t\tloading: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Draw channel chips above the messages: All, then one per channel\n\t\t * with its count. Choosing one shows only that channel's messages.\n\t\t */\n\t\tchannelFilter: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Channel labels that always get a chip, in this order, also when no\n\t\t * message uses them yet. Channels the messages use follow.\n\t\t */\n\t\tchannels: {\n\t\t\ttype: Array,\n\t\t\tdefault: () => [],\n\t\t},\n\n\t\t/** Shown when there are no messages yet. */\n\t\temptyText: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'No messages yet.'),\n\t\t},\n\t},\n\n\temits: [\n\t\t/** A reply was submitted. Payload: the text. */\n\t\t'send',\n\t\t/** The endpoint accepted the reply. Payload: the response body. */\n\t\t'sent',\n\t\t/** The endpoint refused the reply. Payload: the error. */\n\t\t'error',\n\t\t/** A message action was pressed. Payload: `{ action, message }`, the action id and the message key. */\n\t\t'message-action',\n\t],\n\n\tdata() {\n\t\tconversationThreadUid += 1\n\t\treturn {\n\t\t\tdraft: '',\n\t\t\t/** The state of the reply option's switch. */\n\t\t\toptionOn: this.replyOption?.value !== false,\n\t\t\t/** The channel the chips narrow the thread to; '' is All. */\n\t\t\tactiveChannel: '',\n\t\t\tsending: false,\n\t\t\terrorMessage: '',\n\t\t\ttitleId: `cn-conversation-title-${conversationThreadUid}`,\n\t\t\tinputId: `cn-conversation-input-${conversationThreadUid}`,\n\t\t\terrorId: `cn-conversation-error-${conversationThreadUid}`,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\t/**\n\t\t * The messages, with author, side, time and initials resolved.\n\t\t *\n\t\t * @return {Array<{key: string, author: string, initials: string, side: string, text: string, timeLabel: string, datetime: string, channel: string, directionLabel: string, directionWord: string, note: string}>} The rows.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\trows() {\n\t\t\treturn (Array.isArray(this.messages) ? this.messages : [])\n\t\t\t\t.filter((message) => message && typeof message === 'object')\n\t\t\t\t.map((message, index) => {\n\t\t\t\t\tconst side = message.side === 'us' ? 'us' : 'them'\n\t\t\t\t\tconst author = typeof message.author === 'string' && message.author !== ''\n\t\t\t\t\t\t? message.author\n\t\t\t\t\t\t: (side === 'us' ? this.usLabel : '')\n\t\t\t\t\tconst time = this.formatTime(message.time)\n\t\t\t\t\treturn {\n\t\t\t\t\t\tkey: message.id === undefined || message.id === null ? `message-${index}` : String(message.id),\n\t\t\t\t\t\tauthor,\n\t\t\t\t\t\tinitials: this.initialsOf(author),\n\t\t\t\t\t\tside,\n\t\t\t\t\t\ttext: message.text === undefined || message.text === null ? '' : String(message.text),\n\t\t\t\t\t\ttimeLabel: time.label,\n\t\t\t\t\t\tdatetime: time.datetime,\n\t\t\t\t\t\tchannel: typeof message.channel === 'string' ? message.channel : '',\n\t\t\t\t\t\tstatus: typeof message.status === 'string' ? message.status : '',\n\t\t\t\t\t\tactions: Array.isArray(message.actions) ? message.actions.filter((action) => action && action.id && action.label) : [],\n\t\t\t\t\t\tdirectionLabel: side === 'us' ? t('nextcloud-vue', 'Sent message') : t('nextcloud-vue', 'Received message'),\n\t\t\t\t\t\tdirectionWord: side === 'us' ? t('nextcloud-vue', 'Outgoing') : t('nextcloud-vue', 'Incoming'),\n\t\t\t\t\t\tnote: typeof message.note === 'string' ? message.note : '',\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t},\n\n\t\t/**\n\t\t * The channel labels with a chip: the declared ones, then the ones\n\t\t * the messages use.\n\t\t *\n\t\t * @return {Array<string>} The labels, each once.\n\t\t */\n\t\tchannelLabels() {\n\t\t\tconst declared = (Array.isArray(this.channels) ? this.channels : []).filter((label) => typeof label === 'string' && label !== '')\n\t\t\treturn [...new Set([...declared, ...this.rows.map((row) => row.channel).filter(Boolean)])]\n\t\t},\n\n\t\t/**\n\t\t * The chips: All, then each channel, each with its count. Empty\n\t\t * without `channelFilter` or without channels.\n\t\t *\n\t\t * @return {Array<{label: string, count: number}>} The chips.\n\t\t */\n\t\tchannelChips() {\n\t\t\tif (!this.channelFilter || this.channelLabels.length === 0) {\n\t\t\t\treturn []\n\t\t\t}\n\t\t\treturn [\n\t\t\t\t{ label: this.allLabel, count: this.rows.length },\n\t\t\t\t...this.channelLabels.map((label) => ({ label, count: this.rows.filter((row) => row.channel === label).length })),\n\t\t\t]\n\t\t},\n\n\t\t/**\n\t\t * Whether the reply option renders: it has a label and a key.\n\t\t *\n\t\t * @return {boolean}\n\t\t * @spec openspec/changes/conversation-reply-option/specs/conversation-source/spec.md#requirement-a-reply-can-carry-a-hint-and-an-option\n\t\t */\n\t\toptionShown() {\n\t\t\tconst option = this.replyOption\n\t\t\treturn Boolean(option && typeof option.label === 'string' && option.label !== '' && typeof option.key === 'string' && option.key !== '')\n\t\t},\n\n\t\t/**\n\t\t * What travels with the reply besides its text.\n\t\t *\n\t\t * @return {object} `{ [key]: state }`, or {} without an option.\n\t\t * @spec openspec/changes/conversation-reply-option/specs/conversation-source/spec.md#requirement-a-reply-can-carry-a-hint-and-an-option\n\t\t */\n\t\treplyExtras() {\n\t\t\treturn this.optionShown ? { [this.replyOption.key]: this.optionOn === true } : {}\n\t\t},\n\n\t\t/**\n\t\t * The All chip: the host's word first, as its own filter chips read\n\t\t * (\"Alles\"), then the library's.\n\t\t *\n\t\t * @return {string} The label.\n\t\t * @spec openspec/changes/conversation-all-chip-host-word/specs/conversation-source/spec.md#requirement-the-all-chip-reads-the-hosts-word\n\t\t */\n\t\tallLabel() {\n\t\t\tconst host = typeof this.cnTranslate === 'function' ? this.cnTranslate('All') : 'All'\n\t\t\treturn typeof host === 'string' && host !== '' && host !== 'All' ? host : t('nextcloud-vue', 'All')\n\t\t},\n\n\t\t/** @return {number} The pressed chip: 0 for All. */\n\t\tactiveChannelIndex() {\n\t\t\tconst index = this.channelLabels.indexOf(this.activeChannel)\n\t\t\treturn index < 0 ? 0 : index + 1\n\t\t},\n\n\t\t/** @return {Array<object>} The rows on the chosen channel, or all of them. */\n\t\tshownRows() {\n\t\t\tif (this.channelChips.length === 0 || this.activeChannelIndex === 0) {\n\t\t\t\treturn this.rows\n\t\t\t}\n\t\t\treturn this.rows.filter((row) => row.channel === this.activeChannel)\n\t\t},\n\n\t\t/**\n\t\t * Whether there is something to send and nothing in flight.\n\t\t *\n\t\t * @return {boolean} True when Send is enabled.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tcanSend() {\n\t\t\treturn !this.sending && this.draft.trim() !== ''\n\t\t},\n\n\t\t/**\n\t\t * Accessible name for a thread without a title.\n\t\t *\n\t\t * @return {string} The label.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tfallbackLabel() {\n\t\t\treturn t('nextcloud-vue', 'Conversation')\n\t\t},\n\n\t\t/** @return {string} What the thread says while its messages load. */\n\t\tloadingText() {\n\t\t\treturn t('nextcloud-vue', 'Loading messages…')\n\t\t},\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Put a text in the reply box (a template a host tool picked).\n\t\t *\n\t\t * @param {string} text The text.\n\t\t * @return {void}\n\t\t */\n\t\tsetDraft(text) {\n\t\t\tthis.draft = typeof text === 'string' ? text : ''\n\t\t},\n\n\t\t/**\n\t\t * Narrow the thread to the chip's channel; the All chip (0) clears it.\n\t\t *\n\t\t * @param {number|null} index The chip index.\n\t\t * @return {void}\n\t\t */\n\t\tonChannelChip(index) {\n\t\t\tthis.activeChannel = index > 0 ? (this.channelLabels[index - 1] || '') : ''\n\t\t},\n\n\t\t/**\n\t\t * Up to two initials of a name, for the avatar.\n\t\t *\n\t\t * @param {string} name The author.\n\t\t * @return {string} The initials, upper case.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tinitialsOf(name) {\n\t\t\tconst parts = String(name || '').trim().split(/\\s+/).filter(Boolean)\n\t\t\tif (parts.length === 0) {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t\tconst first = parts[0].charAt(0)\n\t\t\tconst last = parts.length > 1 ? parts[parts.length - 1].charAt(0) : ''\n\t\t\treturn (first + last).toUpperCase()\n\t\t},\n\n\t\t/**\n\t\t * Turn a message time into what the reader sees and what `<time>` carries.\n\t\t *\n\t\t * @param {unknown} value An ISO date, a Date, or text to show as is.\n\t\t * @return {{label: string, datetime: string}} The visible label and the machine value.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tformatTime(value) {\n\t\t\tif (value === null || value === undefined || value === '') {\n\t\t\t\treturn { label: '', datetime: '' }\n\t\t\t}\n\t\t\tconst date = value instanceof Date ? value : new Date(value)\n\t\t\tconst looksLikeDate = value instanceof Date || typeof value === 'number' || /^\\d{4}-\\d{2}-\\d{2}/.test(String(value))\n\t\t\tif (!looksLikeDate || Number.isNaN(date.getTime())) {\n\t\t\t\treturn { label: String(value), datetime: '' }\n\t\t\t}\n\t\t\tconst label = date.toLocaleString(userLocale(), { day: 'numeric', month: 'short', hour: '2-digit', minute: '2-digit' })\n\t\t\treturn { label, datetime: date.toISOString() }\n\t\t},\n\n\t\t/**\n\t\t * Submit the reply: tell the host, and post it when an endpoint is set.\n\t\t *\n\t\t * Without an endpoint the box clears straight away, because the host\n\t\t * owns the send. With one it clears only when the request succeeds, so\n\t\t * a refused reply is still there to try again.\n\t\t *\n\t\t * @return {Promise<void>}\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tasync onSend() {\n\t\t\tif (!this.canSend) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\tconst text = this.draft.trim()\n\t\t\tthis.errorMessage = ''\n\t\t\tthis.$emit('send', text, this.replyExtras)\n\t\t\tif (!this.endpoint) {\n\t\t\t\tthis.draft = ''\n\t\t\t\treturn\n\t\t\t}\n\t\t\tthis.sending = true\n\t\t\ttry {\n\t\t\t\tconst response = await axios.post(prefixUrl(this.endpoint), { ...this.payload, ...this.replyExtras, message: text })\n\t\t\t\tthis.draft = ''\n\t\t\t\tthis.$emit('sent', response?.data)\n\t\t\t} catch (error) {\n\t\t\t\tthis.errorMessage = t('nextcloud-vue', 'The message could not be sent. Try again.')\n\t\t\t\tthis.$emit('error', error)\n\t\t\t} finally {\n\t\t\t\tthis.sending = false\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n.cn-conversation-thread {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: calc(3.5 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__status {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-weight: 700;\n}\n\n.cn-conversation-thread__message-actions {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2 * var(--default-grid-baseline));\n\tmargin-top: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__header {\n\talign-items: flex-start;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(3 * var(--default-grid-baseline));\n\tjustify-content: space-between;\n}\n\n.cn-conversation-thread__header-actions {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__title {\n\tfont-size: 1.1em;\n\tfont-weight: 700;\n\tmargin: 0;\n}\n\n.cn-conversation-thread__heading {\n\tdisplay: flex;\n\tflex: 1 1 260px;\n\tflex-direction: column;\n\tgap: 3px;\n\tmin-width: 0;\n}\n\n.cn-conversation-thread__subtitle {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-size: 14px;\n\tmargin: 0;\n}\n\n.cn-conversation-thread__direction,\n.cn-conversation-thread__meta time {\n\tcolor: var(--color-text-maxcontrast);\n}\n\n.cn-conversation-thread__direction::after {\n\tcontent: ' ·';\n}\n\n.cn-conversation-thread__note {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-size: 13px;\n}\n\n.cn-conversation-thread__empty {\n\tcolor: var(--color-text-maxcontrast);\n\tmargin: 0;\n}\n\n.cn-conversation-thread__messages {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: calc(3.5 * var(--default-grid-baseline));\n\tlist-style: none;\n\tmargin: 0;\n\tpadding: 0;\n}\n\n.cn-conversation-thread__message {\n\tdisplay: flex;\n\tgap: calc(3 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__message--us {\n\tflex-direction: row-reverse;\n}\n\n.cn-conversation-thread__avatar {\n\talign-items: center;\n\tbackground: var(--color-background-dark);\n\tborder-radius: 50%;\n\tcolor: var(--color-main-text);\n\tdisplay: flex;\n\tflex: none;\n\tfont-size: 0.8em;\n\tfont-weight: 700;\n\theight: 34px;\n\tjustify-content: center;\n\twidth: 34px;\n}\n\n.cn-conversation-thread__bubble {\n\tbackground: var(--color-background-hover);\n\tborder-radius: var(--border-radius-large);\n\tborder-start-start-radius: var(--border-radius-small, 4px);\n\tcolor: var(--color-main-text);\n\tdisplay: flex;\n\tflex: 1;\n\tflex-direction: column;\n\tgap: var(--default-grid-baseline);\n\tmin-width: 0;\n\tpadding: calc(3 * var(--default-grid-baseline)) calc(3.5 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__message--us .cn-conversation-thread__bubble {\n\tbackground: var(--color-primary-element-light);\n\tborder-start-end-radius: var(--border-radius-small, 4px);\n\tborder-start-start-radius: var(--border-radius-large);\n\tcolor: var(--color-primary-element-light-text);\n}\n\n.cn-conversation-thread__meta {\n\talign-items: center;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tfont-size: 0.9em;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__author {\n\tfont-weight: 600;\n}\n\n.cn-conversation-thread__text {\n\toverflow-wrap: anywhere;\n\twhite-space: pre-wrap;\n}\n\n.cn-conversation-thread__reply {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__reply-head {\n\talign-items: baseline;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2 * var(--default-grid-baseline));\n\tjustify-content: space-between;\n}\n\n.cn-conversation-thread__reply-label {\n\tfont-weight: 600;\n}\n\n.cn-conversation-thread__reply-hint {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-size: 13px;\n}\n\n.cn-conversation-thread__reply-option {\n\talign-items: center;\n\tdisplay: flex;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__input {\n\tbox-sizing: border-box;\n\tmargin: 0;\n\tresize: vertical;\n\twidth: 100%;\n}\n\n.cn-conversation-thread__error {\n\tcolor: var(--color-error-text, var(--color-error));\n\tmargin: 0;\n}\n\n.cn-conversation-thread__reply-foot {\n\talign-items: center;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2.5 * var(--default-grid-baseline));\n\tjustify-content: space-between;\n}\n\n.cn-conversation-thread__reply-actions {\n\tmargin-inline-start: auto;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2.5 * var(--default-grid-baseline));\n\tjustify-content: flex-end;\n}\n\n.cn-conversation-thread__channel {\n\tcolor: var(--color-text-maxcontrast);\n}\n</style>\n"],"names":["_createElementBlock","_openBlock","_createBlock","_resolveDynamicComponent","_toDisplayString","_renderSlot","_Fragment","_renderList","_normalizeClass","_createElementVNode","_createTextVNode","_createVNode"],"mappings":"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"}
+{"version":3,"file":"CnConversationThread.vue3.js","sources":["../../../../src/components/CnConversationThread/CnConversationThread.vue?vue&type=template&id=e2600a68&lang.js"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2026 Conduction B.V.\n  - SPDX-License-Identifier: EUPL-1.2\n-->\n\n<template>\n\t<section\n\t\tclass=\"cn-conversation-thread\"\n\t\tdata-testid=\"cn-conversation-thread\"\n\t\t:aria-labelledby=\"title ? titleId : null\"\n\t\t:aria-label=\"title ? null : fallbackLabel\">\n\t\t<div v-if=\"title || $slots['header-actions']\" class=\"cn-conversation-thread__header\">\n\t\t\t<div v-if=\"title\" class=\"cn-conversation-thread__heading\">\n\t\t\t\t<component\n\t\t\t\t\t:is=\"titleTag\"\n\t\t\t\t\t:id=\"titleId\"\n\t\t\t\t\tclass=\"cn-conversation-thread__title\">\n\t\t\t\t\t{{ title }}\n\t\t\t\t</component>\n\t\t\t\t<!-- A div, not a <p>: a theme that sets every paragraph's size with\n\t\t\t\t     !important would otherwise override the 14px subtitle. -->\n\t\t\t\t<div v-if=\"subtitle\" class=\"cn-conversation-thread__subtitle\" data-testid=\"cn-conversation-subtitle\">\n\t\t\t\t\t{{ subtitle }}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<div v-if=\"$slots['header-actions']\" class=\"cn-conversation-thread__header-actions\">\n\t\t\t\t<!-- @slot header-actions Buttons beside the title, for example \"Log contact\". -->\n\t\t\t\t<slot name=\"header-actions\" />\n\t\t\t</div>\n\t\t</div>\n\n\t\t<CnQuickFilterBar\n\t\t\tv-if=\"channelChips.length > 0\"\n\t\t\tinline\n\t\t\tclass=\"cn-conversation-thread__channels\"\n\t\t\t:tabs=\"channelChips\"\n\t\t\t:activeIndex=\"activeChannelIndex\"\n\t\t\t@update:activeIndex=\"onChannelChip\" />\n\n\t\t<p v-if=\"loading && rows.length === 0\"\n\t\t\tclass=\"cn-conversation-thread__empty\"\n\t\t\trole=\"status\"\n\t\t\tdata-testid=\"cn-conversation-loading\">\n\t\t\t{{ loadingText }}\n\t\t</p>\n\t\t<p v-else-if=\"rows.length === 0\" class=\"cn-conversation-thread__empty\" data-testid=\"cn-conversation-empty\">\n\t\t\t{{ emptyText }}\n\t\t</p>\n\n\t\t<p v-else-if=\"shownRows.length === 0\" class=\"cn-conversation-thread__empty\" data-testid=\"cn-conversation-channel-empty\">\n\t\t\t{{ emptyText }}\n\t\t</p>\n\n\t\t<ol v-else class=\"cn-conversation-thread__messages\">\n\t\t\t<li\n\t\t\t\tv-for=\"row in shownRows\"\n\t\t\t\t:key=\"row.key\"\n\t\t\t\tclass=\"cn-conversation-thread__message\"\n\t\t\t\t:class=\"`cn-conversation-thread__message--${row.side}`\"\n\t\t\t\tdata-testid=\"cn-conversation-message\"\n\t\t\t\t:data-side=\"row.side\">\n\t\t\t\t<span class=\"cn-conversation-thread__avatar\" aria-hidden=\"true\">{{ row.initials }}</span>\n\t\t\t\t<div class=\"cn-conversation-thread__bubble\">\n\t\t\t\t\t<span class=\"cn-conversation-thread__meta\">\n\t\t\t\t\t\t<span class=\"hidden-visually\">{{ row.directionLabel }}</span>\n\t\t\t\t\t\t<span class=\"cn-conversation-thread__author\">{{ row.author }}</span>\n\t\t\t\t\t\t<span v-if=\"row.channel\" class=\"cn-conversation-thread__channel\" data-testid=\"cn-conversation-channel\">{{ row.channel }}</span>\n\t\t\t\t\t\t<span v-if=\"row.status\" class=\"cn-conversation-thread__status\" data-testid=\"cn-conversation-status\">{{ row.status }}</span>\n\t\t\t\t\t\t<span v-if=\"showDirection\"\n\t\t\t\t\t\t\tclass=\"cn-conversation-thread__direction\"\n\t\t\t\t\t\t\tdata-testid=\"cn-conversation-direction\"\n\t\t\t\t\t\t\taria-hidden=\"true\">{{ row.directionWord }}</span>\n\t\t\t\t\t\t<time v-if=\"row.timeLabel\" :datetime=\"row.datetime || null\">{{ row.timeLabel }}</time>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span class=\"cn-conversation-thread__text\">{{ row.text }}</span>\n\t\t\t\t\t<span v-if=\"row.note\" class=\"cn-conversation-thread__note\" data-testid=\"cn-conversation-note\">{{ row.note }}</span>\n\t\t\t\t\t<span v-if=\"row.actions.length > 0\" class=\"cn-conversation-thread__message-actions\">\n\t\t\t\t\t\t<NcButton\n\t\t\t\t\t\t\tv-for=\"action in row.actions\"\n\t\t\t\t\t\t\t:key=\"action.id\"\n\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t:disabled=\"action.disabled === true\"\n\t\t\t\t\t\t\t:data-testid=\"`cn-conversation-action-${action.id}`\"\n\t\t\t\t\t\t\t@click=\"$emit('message-action', { action: action.id, message: row.key })\">\n\t\t\t\t\t\t\t{{ action.label }}\n\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t</span>\n\t\t\t\t</div>\n\t\t\t</li>\n\t\t</ol>\n\n\t\t<form\n\t\t\tv-if=\"allowReply\"\n\t\t\tclass=\"cn-conversation-thread__reply\"\n\t\t\tdata-testid=\"cn-conversation-reply\"\n\t\t\t@submit.prevent=\"onSend\">\n\t\t\t<!-- @slot reply-tools Tools above the reply box, for example a template picker. -->\n\t\t\t<!-- @binding {Function} setDraft Puts a text in the reply box. -->\n\t\t\t<slot name=\"reply-tools\" :setDraft=\"setDraft\" />\n\t\t\t<div class=\"cn-conversation-thread__reply-head\">\n\t\t\t\t<label :for=\"inputId\" class=\"cn-conversation-thread__reply-label\">{{ replyLabel }}</label>\n\t\t\t\t<span v-if=\"replyHint\" class=\"cn-conversation-thread__reply-hint\" data-testid=\"cn-conversation-reply-hint\">{{ replyHint }}</span>\n\t\t\t</div>\n\t\t\t<textarea\n\t\t\t\t:id=\"inputId\"\n\t\t\t\tv-model=\"draft\"\n\t\t\t\tclass=\"cn-conversation-thread__input\"\n\t\t\t\trows=\"2\"\n\t\t\t\t:placeholder=\"placeholder || null\"\n\t\t\t\t:disabled=\"sending\"\n\t\t\t\t:aria-describedby=\"errorMessage ? errorId : null\"\n\t\t\t\tdata-testid=\"cn-conversation-input\"\n\t\t\t\t@keydown.ctrl.enter.prevent=\"onSend\"\n\t\t\t\t@keydown.meta.enter.prevent=\"onSend\" />\n\t\t\t<p\n\t\t\t\tv-if=\"errorMessage\"\n\t\t\t\t:id=\"errorId\"\n\t\t\t\tclass=\"cn-conversation-thread__error\"\n\t\t\t\trole=\"alert\"\n\t\t\t\tdata-testid=\"cn-conversation-error\">\n\t\t\t\t{{ errorMessage }}\n\t\t\t</p>\n\t\t\t<!-- The option at the start and the buttons at the end of one row. -->\n\t\t\t<div class=\"cn-conversation-thread__reply-foot\">\n\t\t\t\t<label v-if=\"optionShown\" class=\"cn-conversation-thread__reply-option\" data-testid=\"cn-conversation-reply-option\">\n\t\t\t\t\t<input v-model=\"optionOn\" type=\"checkbox\" :disabled=\"sending\">\n\t\t\t\t\t<span>{{ replyOption.label }}</span>\n\t\t\t\t</label>\n\t\t\t\t<div class=\"cn-conversation-thread__reply-actions\">\n\t\t\t\t\t<!-- @slot reply-actions Extra buttons before Send, for example \"Save draft\". -->\n\t\t\t\t\t<!-- @binding {string} draft The text in the reply box. -->\n\t\t\t\t\t<slot name=\"reply-actions\" :draft=\"draft\" />\n\t\t\t\t\t<NcButton\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\t:disabled=\"!canSend\"\n\t\t\t\t\t\tdata-testid=\"cn-conversation-send\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<Send :size=\"16\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t{{ sendLabel }}\n\t\t\t\t\t</NcButton>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</form>\n\t</section>\n</template>\n\n<script>\nimport axios from '@nextcloud/axios'\nimport { translate as t } from '@nextcloud/l10n'\nimport { NcButton } from '@nextcloud/vue'\nimport Send from 'vue-material-design-icons/Send.vue'\nimport CnQuickFilterBar from '../CnQuickFilterBar/CnQuickFilterBar.vue'\nimport { prefixUrl } from '../../utils/headers.js'\nimport { userLocale } from '../../utils/userLocale.js'\n\nlet conversationThreadUid = 0\n\n/**\n * CnConversationThread: the messages between you and the other party, and a box to answer.\n *\n * Each message has an author, a time and a side: `us` for the organisation,\n * `them` for the resident or customer. The reply box emits `send`, and also\n * posts to `endpoint` when one is set. It needs no Talk and no other app:\n * where the messages are stored is the host's business.\n *\n * ```vue\n * <CnConversationThread\n *   title=\"Contact with the resident\"\n *   reply-label=\"Answer to the resident\"\n *   :messages=\"[\n *     { id: 1, author: 'Sanne de Vries', time: '2026-10-04T10:52:00', side: 'them',\n *       text: 'Thank you. I would like to see all documents.' },\n *     { id: 2, time: '2026-10-04T10:24:00', side: 'us',\n *       text: 'Construction starts in March.' },\n *   ]\"\n *   @send=\"saveReply\" />\n * ```\n *\n * The `conversation` detail widget type renders this thread from a field on\n * the record.\n */\nexport default {\n\tname: 'CnConversationThread',\n\n\tcomponents: {\n\t\tCnQuickFilterBar,\n\t\tNcButton,\n\t\tSend,\n\t},\n\n\tinject: {\n\t\t/** The host app's translate, for the All chip in the host's word. */\n\t\tcnTranslate: { default: null },\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * The messages, oldest first: `{ id?, author?, time?, text, side?, channel?, status?, actions?, note? }`.\n\t\t * `status` is shown after the channel (\"Failed\"); `actions` are\n\t\t * `{ id, label, disabled? }` buttons under the text, each emitting\n\t\t * `message-action`.\n\t\t * `note` is a muted line under the text.\n\t\t * `side` is `us` or `them` (default `them`). `time` is an ISO\n\t\t * date, or any text to show as is. `channel` is shown after the\n\t\t * author (\"E-mail\", \"Phone note\"); `note` is a muted line under the text.\n\t\t */\n\t\tmessages: {\n\t\t\ttype: Array,\n\t\t\tdefault: () => [],\n\t\t},\n\n\t\t/** Heading of the thread. */\n\t\ttitle: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** A line under the title, such as \"Oldest first, with the channel of each message\". */\n\t\tsubtitle: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** Say each message's direction in words before its time (\"Incoming · 3 Oct\"), not only to a screen reader. */\n\t\tshowDirection: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/** Element the heading renders as. */\n\t\ttitleTag: {\n\t\t\ttype: String,\n\t\t\tdefault: 'h3',\n\t\t},\n\n\t\t/** A line beside the reply label saying where the answer goes, such as \"Goes to the message box in the portal\". */\n\t\treplyHint: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * A switch under the reply box whose state is sent with the reply:\n\t\t * `{ label, key, value? }`, `value` the starting state (on by default).\n\t\t * The reply's `send` event carries `{ [key]: state }` after the text.\n\t\t *\n\t\t * @type {{label: string, key: string, value?: boolean}|null}\n\t\t */\n\t\treplyOption: {\n\t\t\ttype: Object,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/** Whether the reply box renders. Turn it off for a closed or read-only record. */\n\t\tallowReply: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: true,\n\t\t},\n\n\t\t/** Label of the reply box. */\n\t\treplyLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'Reply'),\n\t\t},\n\n\t\t/** Placeholder inside the reply box. */\n\t\tplaceholder: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** Label of the send button. */\n\t\tsendLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'Send'),\n\t\t},\n\n\t\t/** Author shown on an `us` message that names none. */\n\t\tusLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'You'),\n\t\t},\n\n\t\t/**\n\t\t * URL the reply is POSTed to as `{ message }`. Empty means the host\n\t\t * handles `send` itself and nothing is requested.\n\t\t */\n\t\tendpoint: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/** Extra fields sent along with `message` when `endpoint` is set. */\n\t\tpayload: {\n\t\t\ttype: Object,\n\t\t\tdefault: () => ({}),\n\t\t},\n\n\t\t/** Whether the messages are still loading; with none yet the thread says so. */\n\t\tloading: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Draw channel chips above the messages: All, then one per channel\n\t\t * with its count. Choosing one shows only that channel's messages.\n\t\t */\n\t\tchannelFilter: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Channel labels that always get a chip, in this order, also when no\n\t\t * message uses them yet. Channels the messages use follow.\n\t\t */\n\t\tchannels: {\n\t\t\ttype: Array,\n\t\t\tdefault: () => [],\n\t\t},\n\n\t\t/** Shown when there are no messages yet. */\n\t\temptyText: {\n\t\t\ttype: String,\n\t\t\tdefault: () => t('nextcloud-vue', 'No messages yet.'),\n\t\t},\n\t},\n\n\temits: [\n\t\t/** A reply was submitted. Payload: the text. */\n\t\t'send',\n\t\t/** The endpoint accepted the reply. Payload: the response body. */\n\t\t'sent',\n\t\t/** The endpoint refused the reply. Payload: the error. */\n\t\t'error',\n\t\t/** A message action was pressed. Payload: `{ action, message }`, the action id and the message key. */\n\t\t'message-action',\n\t],\n\n\tdata() {\n\t\tconversationThreadUid += 1\n\t\treturn {\n\t\t\tdraft: '',\n\t\t\t/** The state of the reply option's switch. */\n\t\t\toptionOn: this.replyOption?.value !== false,\n\t\t\t/** The channel the chips narrow the thread to; '' is All. */\n\t\t\tactiveChannel: '',\n\t\t\tsending: false,\n\t\t\terrorMessage: '',\n\t\t\ttitleId: `cn-conversation-title-${conversationThreadUid}`,\n\t\t\tinputId: `cn-conversation-input-${conversationThreadUid}`,\n\t\t\terrorId: `cn-conversation-error-${conversationThreadUid}`,\n\t\t}\n\t},\n\n\tcomputed: {\n\t\t/**\n\t\t * The messages, with author, side, time and initials resolved.\n\t\t *\n\t\t * @return {Array<{key: string, author: string, initials: string, side: string, text: string, timeLabel: string, datetime: string, channel: string, directionLabel: string, directionWord: string, note: string}>} The rows.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\trows() {\n\t\t\treturn (Array.isArray(this.messages) ? this.messages : [])\n\t\t\t\t.filter((message) => message && typeof message === 'object')\n\t\t\t\t.map((message, index) => {\n\t\t\t\t\tconst side = message.side === 'us' ? 'us' : 'them'\n\t\t\t\t\tconst author = typeof message.author === 'string' && message.author !== ''\n\t\t\t\t\t\t? message.author\n\t\t\t\t\t\t: (side === 'us' ? this.usLabel : '')\n\t\t\t\t\tconst time = this.formatTime(message.time)\n\t\t\t\t\treturn {\n\t\t\t\t\t\tkey: message.id === undefined || message.id === null ? `message-${index}` : String(message.id),\n\t\t\t\t\t\tauthor,\n\t\t\t\t\t\tinitials: this.initialsOf(author),\n\t\t\t\t\t\tside,\n\t\t\t\t\t\ttext: message.text === undefined || message.text === null ? '' : String(message.text),\n\t\t\t\t\t\ttimeLabel: time.label,\n\t\t\t\t\t\tdatetime: time.datetime,\n\t\t\t\t\t\tchannel: typeof message.channel === 'string' ? message.channel : '',\n\t\t\t\t\t\tstatus: typeof message.status === 'string' ? message.status : '',\n\t\t\t\t\t\tactions: Array.isArray(message.actions) ? message.actions.filter((action) => action && action.id && action.label) : [],\n\t\t\t\t\t\tdirectionLabel: side === 'us' ? t('nextcloud-vue', 'Sent message') : t('nextcloud-vue', 'Received message'),\n\t\t\t\t\t\tdirectionWord: side === 'us' ? t('nextcloud-vue', 'Outgoing') : t('nextcloud-vue', 'Incoming'),\n\t\t\t\t\t\tnote: typeof message.note === 'string' ? message.note : '',\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t},\n\n\t\t/**\n\t\t * The channel labels with a chip: the declared ones, then the ones\n\t\t * the messages use.\n\t\t *\n\t\t * @return {Array<string>} The labels, each once.\n\t\t */\n\t\tchannelLabels() {\n\t\t\tconst declared = (Array.isArray(this.channels) ? this.channels : []).filter((label) => typeof label === 'string' && label !== '')\n\t\t\treturn [...new Set([...declared, ...this.rows.map((row) => row.channel).filter(Boolean)])]\n\t\t},\n\n\t\t/**\n\t\t * The chips: All, then each channel, each with its count. Empty\n\t\t * without `channelFilter` or without channels.\n\t\t *\n\t\t * @return {Array<{label: string, count: number}>} The chips.\n\t\t */\n\t\tchannelChips() {\n\t\t\tif (!this.channelFilter || this.channelLabels.length === 0) {\n\t\t\t\treturn []\n\t\t\t}\n\t\t\treturn [\n\t\t\t\t{ label: this.allLabel, count: this.rows.length },\n\t\t\t\t...this.channelLabels.map((label) => ({ label, count: this.rows.filter((row) => row.channel === label).length })),\n\t\t\t]\n\t\t},\n\n\t\t/**\n\t\t * Whether the reply option renders: it has a label and a key.\n\t\t *\n\t\t * @return {boolean}\n\t\t * @spec openspec/changes/conversation-reply-option/specs/conversation-source/spec.md#requirement-a-reply-can-carry-a-hint-and-an-option\n\t\t */\n\t\toptionShown() {\n\t\t\tconst option = this.replyOption\n\t\t\treturn Boolean(option && typeof option.label === 'string' && option.label !== '' && typeof option.key === 'string' && option.key !== '')\n\t\t},\n\n\t\t/**\n\t\t * What travels with the reply besides its text.\n\t\t *\n\t\t * @return {object} `{ [key]: state }`, or {} without an option.\n\t\t * @spec openspec/changes/conversation-reply-option/specs/conversation-source/spec.md#requirement-a-reply-can-carry-a-hint-and-an-option\n\t\t */\n\t\treplyExtras() {\n\t\t\treturn this.optionShown ? { [this.replyOption.key]: this.optionOn === true } : {}\n\t\t},\n\n\t\t/**\n\t\t * The All chip: the host's word first, as its own filter chips read\n\t\t * (\"Alles\"), then the library's.\n\t\t *\n\t\t * @return {string} The label.\n\t\t * @spec openspec/changes/conversation-all-chip-host-word/specs/conversation-source/spec.md#requirement-the-all-chip-reads-the-hosts-word\n\t\t */\n\t\tallLabel() {\n\t\t\tconst host = typeof this.cnTranslate === 'function' ? this.cnTranslate('All') : 'All'\n\t\t\treturn typeof host === 'string' && host !== '' && host !== 'All' ? host : t('nextcloud-vue', 'All')\n\t\t},\n\n\t\t/** @return {number} The pressed chip: 0 for All. */\n\t\tactiveChannelIndex() {\n\t\t\tconst index = this.channelLabels.indexOf(this.activeChannel)\n\t\t\treturn index < 0 ? 0 : index + 1\n\t\t},\n\n\t\t/** @return {Array<object>} The rows on the chosen channel, or all of them. */\n\t\tshownRows() {\n\t\t\tif (this.channelChips.length === 0 || this.activeChannelIndex === 0) {\n\t\t\t\treturn this.rows\n\t\t\t}\n\t\t\treturn this.rows.filter((row) => row.channel === this.activeChannel)\n\t\t},\n\n\t\t/**\n\t\t * Whether there is something to send and nothing in flight.\n\t\t *\n\t\t * @return {boolean} True when Send is enabled.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tcanSend() {\n\t\t\treturn !this.sending && this.draft.trim() !== ''\n\t\t},\n\n\t\t/**\n\t\t * Accessible name for a thread without a title.\n\t\t *\n\t\t * @return {string} The label.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tfallbackLabel() {\n\t\t\treturn t('nextcloud-vue', 'Conversation')\n\t\t},\n\n\t\t/** @return {string} What the thread says while its messages load. */\n\t\tloadingText() {\n\t\t\treturn t('nextcloud-vue', 'Loading messages…')\n\t\t},\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Put a text in the reply box (a template a host tool picked).\n\t\t *\n\t\t * @param {string} text The text.\n\t\t * @return {void}\n\t\t */\n\t\tsetDraft(text) {\n\t\t\tthis.draft = typeof text === 'string' ? text : ''\n\t\t},\n\n\t\t/**\n\t\t * Narrow the thread to the chip's channel; the All chip (0) clears it.\n\t\t *\n\t\t * @param {number|null} index The chip index.\n\t\t * @return {void}\n\t\t */\n\t\tonChannelChip(index) {\n\t\t\tthis.activeChannel = index > 0 ? (this.channelLabels[index - 1] || '') : ''\n\t\t},\n\n\t\t/**\n\t\t * Up to two initials of a name, for the avatar.\n\t\t *\n\t\t * @param {string} name The author.\n\t\t * @return {string} The initials, upper case.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tinitialsOf(name) {\n\t\t\tconst parts = String(name || '').trim().split(/\\s+/).filter(Boolean)\n\t\t\tif (parts.length === 0) {\n\t\t\t\treturn ''\n\t\t\t}\n\t\t\tconst first = parts[0].charAt(0)\n\t\t\tconst last = parts.length > 1 ? parts[parts.length - 1].charAt(0) : ''\n\t\t\treturn (first + last).toUpperCase()\n\t\t},\n\n\t\t/**\n\t\t * Turn a message time into what the reader sees and what `<time>` carries.\n\t\t *\n\t\t * @param {unknown} value An ISO date, a Date, or text to show as is.\n\t\t * @return {{label: string, datetime: string}} The visible label and the machine value.\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tformatTime(value) {\n\t\t\tif (value === null || value === undefined || value === '') {\n\t\t\t\treturn { label: '', datetime: '' }\n\t\t\t}\n\t\t\tconst date = value instanceof Date ? value : new Date(value)\n\t\t\tconst looksLikeDate = value instanceof Date || typeof value === 'number' || /^\\d{4}-\\d{2}-\\d{2}/.test(String(value))\n\t\t\tif (!looksLikeDate || Number.isNaN(date.getTime())) {\n\t\t\t\treturn { label: String(value), datetime: '' }\n\t\t\t}\n\t\t\tconst label = date.toLocaleString(userLocale(), { day: 'numeric', month: 'short', hour: '2-digit', minute: '2-digit' })\n\t\t\treturn { label, datetime: date.toISOString() }\n\t\t},\n\n\t\t/**\n\t\t * Submit the reply: tell the host, and post it when an endpoint is set.\n\t\t *\n\t\t * Without an endpoint the box clears straight away, because the host\n\t\t * owns the send. With one it clears only when the request succeeds, so\n\t\t * a refused reply is still there to try again.\n\t\t *\n\t\t * @return {Promise<void>}\n\t\t * @spec openspec/changes/detail-action-model-and-case-surfaces/specs/detail-action-model/spec.md#requirement-conversation-thread\n\t\t */\n\t\tasync onSend() {\n\t\t\tif (!this.canSend) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\tconst text = this.draft.trim()\n\t\t\tthis.errorMessage = ''\n\t\t\tthis.$emit('send', text, this.replyExtras)\n\t\t\tif (!this.endpoint) {\n\t\t\t\tthis.draft = ''\n\t\t\t\treturn\n\t\t\t}\n\t\t\tthis.sending = true\n\t\t\ttry {\n\t\t\t\tconst response = await axios.post(prefixUrl(this.endpoint), { ...this.payload, ...this.replyExtras, message: text })\n\t\t\t\tthis.draft = ''\n\t\t\t\tthis.$emit('sent', response?.data)\n\t\t\t} catch (error) {\n\t\t\t\tthis.errorMessage = t('nextcloud-vue', 'The message could not be sent. Try again.')\n\t\t\t\tthis.$emit('error', error)\n\t\t\t} finally {\n\t\t\t\tthis.sending = false\n\t\t\t}\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n.cn-conversation-thread {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: calc(3.5 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__status {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-weight: 700;\n}\n\n.cn-conversation-thread__message-actions {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2 * var(--default-grid-baseline));\n\tmargin-top: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__header {\n\talign-items: flex-start;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(3 * var(--default-grid-baseline));\n\tjustify-content: space-between;\n}\n\n.cn-conversation-thread__header-actions {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__title {\n\tfont-size: 1.1em;\n\tfont-weight: 700;\n\tmargin: 0;\n}\n\n.cn-conversation-thread__heading {\n\tdisplay: flex;\n\tflex: 1 1 260px;\n\tflex-direction: column;\n\tgap: 3px;\n\tmin-width: 0;\n}\n\n.cn-conversation-thread__subtitle {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-size: 14px;\n\tline-height: normal;\n\tmargin: 0;\n}\n\n.cn-conversation-thread__direction,\n.cn-conversation-thread__meta time {\n\tcolor: var(--color-text-maxcontrast);\n}\n\n.cn-conversation-thread__direction::after {\n\tcontent: ' ·';\n}\n\n.cn-conversation-thread__note {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-size: 13px;\n}\n\n.cn-conversation-thread__empty {\n\tcolor: var(--color-text-maxcontrast);\n\tmargin: 0;\n}\n\n.cn-conversation-thread__messages {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: calc(3.5 * var(--default-grid-baseline));\n\tlist-style: none;\n\tmargin: 0;\n\tpadding: 0;\n}\n\n.cn-conversation-thread__message {\n\tdisplay: flex;\n\tgap: calc(3 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__message--us {\n\tflex-direction: row-reverse;\n}\n\n.cn-conversation-thread__avatar {\n\talign-items: center;\n\tbackground: var(--color-background-dark);\n\tborder-radius: 50%;\n\tcolor: var(--color-main-text);\n\tdisplay: flex;\n\tflex: none;\n\tfont-size: 0.8em;\n\tfont-weight: 700;\n\theight: 34px;\n\tjustify-content: center;\n\twidth: 34px;\n}\n\n.cn-conversation-thread__bubble {\n\tbackground: var(--color-background-hover);\n\tborder-radius: var(--border-radius-large);\n\tborder-start-start-radius: var(--border-radius-small, 4px);\n\tcolor: var(--color-main-text);\n\tdisplay: flex;\n\tflex: 1;\n\tflex-direction: column;\n\tgap: var(--default-grid-baseline);\n\tmin-width: 0;\n\tpadding: calc(3 * var(--default-grid-baseline)) calc(3.5 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__message--us .cn-conversation-thread__bubble {\n\tbackground: var(--color-primary-element-light);\n\tborder-start-end-radius: var(--border-radius-small, 4px);\n\tborder-start-start-radius: var(--border-radius-large);\n\tcolor: var(--color-primary-element-light-text);\n}\n\n.cn-conversation-thread__meta {\n\talign-items: center;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tfont-size: 0.9em;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__author {\n\tfont-weight: 600;\n}\n\n.cn-conversation-thread__text {\n\toverflow-wrap: anywhere;\n\twhite-space: pre-wrap;\n}\n\n.cn-conversation-thread__reply {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__reply-head {\n\talign-items: baseline;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2 * var(--default-grid-baseline));\n\tjustify-content: space-between;\n}\n\n.cn-conversation-thread__reply-label {\n\tfont-weight: 600;\n}\n\n.cn-conversation-thread__reply-hint {\n\tcolor: var(--color-text-maxcontrast);\n\tfont-size: 13px;\n}\n\n.cn-conversation-thread__reply-option {\n\talign-items: center;\n\tdisplay: flex;\n\tgap: calc(2 * var(--default-grid-baseline));\n}\n\n.cn-conversation-thread__input {\n\tbox-sizing: border-box;\n\tmargin: 0;\n\tresize: vertical;\n\twidth: 100%;\n}\n\n.cn-conversation-thread__error {\n\tcolor: var(--color-error-text, var(--color-error));\n\tmargin: 0;\n}\n\n.cn-conversation-thread__reply-foot {\n\talign-items: center;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2.5 * var(--default-grid-baseline));\n\tjustify-content: space-between;\n}\n\n.cn-conversation-thread__reply-actions {\n\tmargin-inline-start: auto;\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: calc(2.5 * var(--default-grid-baseline));\n\tjustify-content: flex-end;\n}\n\n.cn-conversation-thread__channel {\n\tcolor: var(--color-text-maxcontrast);\n}\n</style>\n"],"names":["_createElementBlock","_openBlock","_createBlock","_resolveDynamicComponent","_toDisplayString","_renderSlot","_Fragment","_renderList","_normalizeClass","_createElementVNode","_createTextVNode","_createVNode"],"mappings":"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"}

package/dist/esm/components/CnDetailWidgetHost/CnDetailWidgetHeaderItems.vue.js

@@ -2,7 +2,7 @@ import script from './CnDetailWidgetHeaderItems.vue2.js';
 import { render } from './CnDetailWidgetHeaderItems.vue3.js';
 
 script.render = render;
-script.__scopeId = "data-v-3a30dc4a";
+script.__scopeId = "data-v-7186a696";
 const __sfc_main = script;
 
 export { __sfc_main as default };

package/dist/esm/components/CnDetailWidgetHost/CnDetailWidgetHeaderItems.vue2.js

@@ -13,7 +13,7 @@ var script = {
 	components: { CnIcon: __sfc_main, CnStatusBadge: __sfc_main$1, NcButton },
 
 	props: {
-		/** The reported header: `{ pill, note, actions: [{ label, icon?, variant?, run }] }`. */
+		/** The reported header: `{ pill, note, actions: [{ label, icon?, variant?, add?, run }] }`; `add: true` marks a list's Add. */
 		header: {
 			type: Object,
 			required: true,

package/dist/esm/components/CnDetailWidgetHost/CnDetailWidgetHeaderItems.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"CnDetailWidgetHeaderItems.vue2.js","sources":["../../../../src/components/CnDetailWidgetHost/CnDetailWidgetHeaderItems.vue"],"sourcesContent":["<!--\n  SPDX-FileCopyrightText: 2026 Conduction B.V.\n  SPDX-License-Identifier: EUPL-1.2\n-->\n<template>\n\t<span class=\"cn-detail-widget-header-items\">\n\t\t<CnStatusBadge\n\t\t\tv-if=\"header.pill\"\n\t\t\t:label=\"header.pill.label\"\n\t\t\t:variant=\"header.pill.variant\"\n\t\t\tdata-testid=\"cn-detail-widget-header-pill\" />\n\t\t<span\n\t\t\tv-if=\"header.note\"\n\t\t\tclass=\"cn-detail-page__catalog-note\"\n\t\t\tdata-testid=\"cn-detail-widget-header-note\">{{ header.note }}</span>\n\t\t<template v-for=\"(action, index) in header.actions\" :key=\"`${index}-${action.label}`\">\n\t\t\t<!-- `variant: 'primary'`: the card's main action as a filled button\n\t\t\t     (a task table's \"New task\"); otherwise the quiet header link. -->\n\t\t\t<NcButton\n\t\t\t\tv-if=\"action.variant === 'primary'\"\n\t\t\t\tvariant=\"primary\"\n\t\t\t\tclass=\"cn-detail-widget-header-items__primary\"\n\t\t\t\tdata-testid=\"cn-detail-widget-header-action\"\n\t\t\t\t@click=\"action.run()\">\n\t\t\t\t<template v-if=\"action.icon\" #icon>\n\t\t\t\t\t<CnIcon :name=\"action.icon\" :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t{{ action.label }}\n\t\t\t</NcButton>\n\t\t\t<button\n\t\t\t\tv-else\n\t\t\t\ttype=\"button\"\n\t\t\t\tclass=\"cn-detail-page__catalog-action\"\n\t\t\t\tdata-testid=\"cn-detail-widget-header-action\"\n\t\t\t\t@click=\"action.run()\">\n\t\t\t\t<CnIcon v-if=\"action.icon\" :name=\"action.icon\" :size=\"16\" />\n\t\t\t\t{{ action.label }}\n\t\t\t</button>\n\t\t</template>\n\t</span>\n</template>\n\n<script>\nimport { NcButton } from '@nextcloud/vue'\nimport CnIcon from '../CnIcon/CnIcon.vue'\nimport CnStatusBadge from '../CnStatusBadge/CnStatusBadge.vue'\n\n/**\n * The extras a widget reports for its card's title row through its `header`\n * event: a status pill, a note and its actions. Drawn by CnDetailWidgetHost in\n * the `#actions` slot of the card it wraps a widget in.\n */\nexport default {\n\tname: 'CnDetailWidgetHeaderItems',\n\n\tcomponents: { CnIcon, CnStatusBadge, NcButton },\n\n\tprops: {\n\t\t/** The reported header: `{ pill, note, actions: [{ label, icon?, variant?, run }] }`. */\n\t\theader: {\n\t\t\ttype: Object,\n\t\t\trequired: true,\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n.cn-detail-widget-header-items {\n\tdisplay: inline-flex;\n\tflex-wrap: wrap;\n\talign-items: center;\n\tgap: 12px;\n}\n\n.cn-detail-page__catalog-action {\n\talign-items: center;\n\tbackground: var(--color-primary-element-light);\n\tborder: 0;\n\tborder-radius: 16px;\n\tcolor: var(--color-primary-element-light-text, var(--color-primary-element));\n\tcursor: pointer;\n\tdisplay: inline-flex;\n\tfont: inherit;\n\tfont-size: 13px;\n\tfont-weight: 700;\n\tgap: 6px;\n\tmin-height: 32px;\n\tpadding: 0 14px;\n\twhite-space: nowrap;\n}\n</style>\n"],"names":["CnIcon","CnStatusBadge"],"mappings":";;;;AA+CA;;AAEC;AACA;;AAED,aAAe;AACd,CAAA,IAAI,EAAE,2BAA2B;;AAEjC,CAAA,UAAU,EAAE,UAAEA,UAAM,iBAAEC,YAAa,EAAE,UAAU;;AAE/C,CAAA,KAAK,EAAE;AACN;AACA,EAAA,MAAM,EAAE;GACP,IAAI,EAAE,MAAM;GACZ,QAAQ,EAAE,IAAI;GACd;EACD;AACF;;;;"}
+{"version":3,"file":"CnDetailWidgetHeaderItems.vue2.js","sources":["../../../../src/components/CnDetailWidgetHost/CnDetailWidgetHeaderItems.vue"],"sourcesContent":["<!--\n  SPDX-FileCopyrightText: 2026 Conduction B.V.\n  SPDX-License-Identifier: EUPL-1.2\n-->\n<template>\n\t<span class=\"cn-detail-widget-header-items\">\n\t\t<CnStatusBadge\n\t\t\tv-if=\"header.pill\"\n\t\t\t:label=\"header.pill.label\"\n\t\t\t:variant=\"header.pill.variant\"\n\t\t\tdata-testid=\"cn-detail-widget-header-pill\" />\n\t\t<span\n\t\t\tv-if=\"header.note\"\n\t\t\tclass=\"cn-detail-page__catalog-note\"\n\t\t\tdata-testid=\"cn-detail-widget-header-note\">{{ header.note }}</span>\n\t\t<template v-for=\"(action, index) in header.actions\" :key=\"`${index}-${action.label}`\">\n\t\t\t<!-- `variant: 'primary'`: the card's main action as a filled button\n\t\t\t     (a task table's \"New task\"); otherwise the quiet header link. -->\n\t\t\t<NcButton\n\t\t\t\tv-if=\"action.variant === 'primary'\"\n\t\t\t\tvariant=\"primary\"\n\t\t\t\tclass=\"cn-detail-widget-header-items__primary\"\n\t\t\t\tdata-testid=\"cn-detail-widget-header-action\"\n\t\t\t\t@click=\"action.run()\">\n\t\t\t\t<template v-if=\"action.icon\" #icon>\n\t\t\t\t\t<CnIcon :name=\"action.icon\" :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t{{ action.label }}\n\t\t\t</NcButton>\n\t\t\t<button\n\t\t\t\tv-else\n\t\t\t\ttype=\"button\"\n\t\t\t\tclass=\"cn-detail-page__catalog-action\"\n\t\t\t\t:class=\"{ 'cn-detail-page__catalog-action--add': action.add === true }\"\n\t\t\t\tdata-testid=\"cn-detail-widget-header-action\"\n\t\t\t\t@click=\"action.run()\">\n\t\t\t\t<CnIcon v-if=\"action.icon\" :name=\"action.icon\" :size=\"16\" />\n\t\t\t\t{{ action.label }}\n\t\t\t</button>\n\t\t</template>\n\t</span>\n</template>\n\n<script>\nimport { NcButton } from '@nextcloud/vue'\nimport CnIcon from '../CnIcon/CnIcon.vue'\nimport CnStatusBadge from '../CnStatusBadge/CnStatusBadge.vue'\n\n/**\n * The extras a widget reports for its card's title row through its `header`\n * event: a status pill, a note and its actions. Drawn by CnDetailWidgetHost in\n * the `#actions` slot of the card it wraps a widget in.\n */\nexport default {\n\tname: 'CnDetailWidgetHeaderItems',\n\n\tcomponents: { CnIcon, CnStatusBadge, NcButton },\n\n\tprops: {\n\t\t/** The reported header: `{ pill, note, actions: [{ label, icon?, variant?, add?, run }] }`; `add: true` marks a list's Add. */\n\t\theader: {\n\t\t\ttype: Object,\n\t\t\trequired: true,\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n.cn-detail-widget-header-items {\n\tdisplay: inline-flex;\n\tflex-wrap: wrap;\n\talign-items: center;\n\tgap: 12px;\n}\n\n.cn-detail-page__catalog-action {\n\talign-items: center;\n\tbackground: var(--color-primary-element-light);\n\tborder: 0;\n\tborder-radius: 16px;\n\tcolor: var(--color-primary-element-light-text, var(--color-primary-element));\n\tcursor: pointer;\n\tdisplay: inline-flex;\n\tfont: inherit;\n\tfont-size: 13px;\n\tfont-weight: 700;\n\tgap: 6px;\n\tmin-height: 32px;\n\tpadding: 0 14px;\n\twhite-space: nowrap;\n}\n</style>\n"],"names":["CnIcon","CnStatusBadge"],"mappings":";;;;AAgDA;;AAEC;AACA;;AAED,aAAe;AACd,CAAA,IAAI,EAAE,2BAA2B;;AAEjC,CAAA,UAAU,EAAE,UAAEA,UAAM,iBAAEC,YAAa,EAAE,UAAU;;AAE/C,CAAA,KAAK,EAAE;;AAEN,EAAA,MAAM,EAAE;GACP,IAAI,EAAE,MAAM;GACZ,QAAQ,EAAE,IAAI;GACd;EACD;AACF;;;;"}

package/dist/esm/components/CnDetailWidgetHost/CnDetailWidgetHeaderItems.vue3.js

@@ -1,4 +1,4 @@
-import { resolveComponent, openBlock, createElementBlock, createBlock, createCommentVNode, toDisplayString, Fragment, renderList, createSlots, withCtx, createTextVNode, createVNode } from 'vue';
+import { resolveComponent, openBlock, createElementBlock, createBlock, createCommentVNode, toDisplayString, Fragment, renderList, createSlots, withCtx, createTextVNode, createVNode, normalizeClass } from 'vue';
 
 const _hoisted_1 = { class: "cn-detail-widget-header-items" };
 const _hoisted_2 = {
@@ -58,7 +58,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           : (openBlock(), createElementBlock("button", {
               key: 1,
               type: "button",
-              class: "cn-detail-page__catalog-action",
+              class: normalizeClass(["cn-detail-page__catalog-action", { 'cn-detail-page__catalog-action--add': action.add === true }]),
               "data-testid": "cn-detail-widget-header-action",
               onClick: $event => (action.run())
             }, [
@@ -70,7 +70,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                   }, null, 8 /* PROPS */, ["name"]))
                 : createCommentVNode("v-if", true),
               createTextVNode(" " + toDisplayString(action.label), 1 /* TEXT */)
-            ], 8 /* PROPS */, _hoisted_3))
+            ], 10 /* CLASS, PROPS */, _hoisted_3))
       ], 64 /* STABLE_FRAGMENT */))
     }), 128 /* KEYED_FRAGMENT */))
   ]))

package/dist/esm/components/CnDetailWidgetHost/CnDetailWidgetHeaderItems.vue3.js.map

@@ -1 +1 @@
-{"version":3,"file":"CnDetailWidgetHeaderItems.vue3.js","sources":["../../../../src/components/CnDetailWidgetHost/CnDetailWidgetHeaderItems.vue?vue&type=template&id=3a30dc4a&lang.js"],"sourcesContent":["<!--\n  SPDX-FileCopyrightText: 2026 Conduction B.V.\n  SPDX-License-Identifier: EUPL-1.2\n-->\n<template>\n\t<span class=\"cn-detail-widget-header-items\">\n\t\t<CnStatusBadge\n\t\t\tv-if=\"header.pill\"\n\t\t\t:label=\"header.pill.label\"\n\t\t\t:variant=\"header.pill.variant\"\n\t\t\tdata-testid=\"cn-detail-widget-header-pill\" />\n\t\t<span\n\t\t\tv-if=\"header.note\"\n\t\t\tclass=\"cn-detail-page__catalog-note\"\n\t\t\tdata-testid=\"cn-detail-widget-header-note\">{{ header.note }}</span>\n\t\t<template v-for=\"(action, index) in header.actions\" :key=\"`${index}-${action.label}`\">\n\t\t\t<!-- `variant: 'primary'`: the card's main action as a filled button\n\t\t\t     (a task table's \"New task\"); otherwise the quiet header link. -->\n\t\t\t<NcButton\n\t\t\t\tv-if=\"action.variant === 'primary'\"\n\t\t\t\tvariant=\"primary\"\n\t\t\t\tclass=\"cn-detail-widget-header-items__primary\"\n\t\t\t\tdata-testid=\"cn-detail-widget-header-action\"\n\t\t\t\t@click=\"action.run()\">\n\t\t\t\t<template v-if=\"action.icon\" #icon>\n\t\t\t\t\t<CnIcon :name=\"action.icon\" :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t{{ action.label }}\n\t\t\t</NcButton>\n\t\t\t<button\n\t\t\t\tv-else\n\t\t\t\ttype=\"button\"\n\t\t\t\tclass=\"cn-detail-page__catalog-action\"\n\t\t\t\tdata-testid=\"cn-detail-widget-header-action\"\n\t\t\t\t@click=\"action.run()\">\n\t\t\t\t<CnIcon v-if=\"action.icon\" :name=\"action.icon\" :size=\"16\" />\n\t\t\t\t{{ action.label }}\n\t\t\t</button>\n\t\t</template>\n\t</span>\n</template>\n\n<script>\nimport { NcButton } from '@nextcloud/vue'\nimport CnIcon from '../CnIcon/CnIcon.vue'\nimport CnStatusBadge from '../CnStatusBadge/CnStatusBadge.vue'\n\n/**\n * The extras a widget reports for its card's title row through its `header`\n * event: a status pill, a note and its actions. Drawn by CnDetailWidgetHost in\n * the `#actions` slot of the card it wraps a widget in.\n */\nexport default {\n\tname: 'CnDetailWidgetHeaderItems',\n\n\tcomponents: { CnIcon, CnStatusBadge, NcButton },\n\n\tprops: {\n\t\t/** The reported header: `{ pill, note, actions: [{ label, icon?, variant?, run }] }`. */\n\t\theader: {\n\t\t\ttype: Object,\n\t\t\trequired: true,\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n.cn-detail-widget-header-items {\n\tdisplay: inline-flex;\n\tflex-wrap: wrap;\n\talign-items: center;\n\tgap: 12px;\n}\n\n.cn-detail-page__catalog-action {\n\talign-items: center;\n\tbackground: var(--color-primary-element-light);\n\tborder: 0;\n\tborder-radius: 16px;\n\tcolor: var(--color-primary-element-light-text, var(--color-primary-element));\n\tcursor: pointer;\n\tdisplay: inline-flex;\n\tfont: inherit;\n\tfont-size: 13px;\n\tfont-weight: 700;\n\tgap: 6px;\n\tmin-height: 32px;\n\tpadding: 0 14px;\n\twhite-space: nowrap;\n}\n</style>\n"],"names":["_createBlock","_openBlock","_createElementBlock","_toDisplayString","_createVNode"],"mappings":";;AASO,MAAA,UAAA,GAAA,EAAA,KAAK,EAAC,+BAAmB,GAAA;;;OAQxB,EAAC,8BAA8B;AACpC,EAAA,aAAQ,EAAA,8BAAA;;;;;;;;;;AAPL,IAAA,CAAA,MAAA,CAAA,MAAA,CAAA,IAAA;sBADHA,WAI8C,CAAA,wBAAA,EAAA;;AAF7C,UAAA,KAAK,EAAE,MAAA,CAAA,MAAM,CAAC,IAAE,CAAA,KAAA;AAChB,UAAA,OAAO,EAAE,MAAA,CAAA,MAAM,CAAC,IAAI,CAAC,OAAO;AAC7B,UAAA,aAAW,EAAC,8BAA8B;;;AAEpC,IAAA,CAAA,MAAA,CAAA,MAAM,CAAC,IAAI;AADlB,SAAAC,SAAA,EAAA,EAAAC,kBAAA,CAGS,MAHT,EAAA,UAGS,EAAAC,eAAA,CAAA,MAAA,CAAA,MAAA,CAAA,IAAA,CAAA,EAAA,CAAA,YAAA;;AACP,KAAAF,SAAA,CAAA,IAAA,CAAA,EAAAC,kBAAA,4BAAkC,MAAA,CAAA,MAAA,CAAA,OAAA,EAAlB,CAAA,MAAM,EAAG,KAAI,KAAA;;gBAAK,KAAA,CAAA,CAAA,EAAA,MAAA,CAAA,KAAA,CAAA,CAAA;;AAI5B,QAAA,CAAA,MAAM,CAAC,OAAO,KAAA,SAAA;0BADpBF,WAUU,CAAA,mBAAA,EAAA;;AARV,cAAA,OAAO,EAAC,SAAS;AAChB,cAAA,KAAI,EAAC,wCAAmC;AACzC,cAAA,aAAU,EAAA,gCAAA;cACT,OAAK,EAAA,MAAA,KAAE,MAAM,IAAG,EAAA,CAAA;;+BAGZ,MACL;gCADK,GACL,GAAAG,eAAA,CAAG,MAAM,CAAC,KAAE,CAAA,EAAA,CAAA,YAAA;;;;AAHH,cAAA,CAAA,MAAA,CAAA,IAAA;;0BAAA,MAAA;gCACR,MAAI;sBAAJC,WAAI,CAAA,iBAAA,EAAA;wBAAA,IAAA,EAAA,MAAA,CAAA,IAAA;AAAA,wBAAA,IAAA,EAAA,EAAA;;;;;;;0BAILF;;AAEA,cAAA,IAAI,EAAC,QAAQ;AACb,cAAA,KAAK,EAAC,gCAAW;AACjB,cAAA,aAAO,EAAA,gCAAA;cACN,OAAK,EAAA,MAAA,KAAE,MAAA,CAAA,GAAA,EAAA,CAAA;;AACL,cAAA,CAAA,MAAA,CAAA,IAAA;gCAAHF,WAAG,CAAA,iBAAA,EAAA;;oBAAA,IAAA,EAAA,MAAA,CAAA,IAAA;AAAA,oBAAA,IAAA,EAAA,EAAA;;;8BAAA;;;;;;;;;"}
+{"version":3,"file":"CnDetailWidgetHeaderItems.vue3.js","sources":["../../../../src/components/CnDetailWidgetHost/CnDetailWidgetHeaderItems.vue?vue&type=template&id=7186a696&lang.js"],"sourcesContent":["<!--\n  SPDX-FileCopyrightText: 2026 Conduction B.V.\n  SPDX-License-Identifier: EUPL-1.2\n-->\n<template>\n\t<span class=\"cn-detail-widget-header-items\">\n\t\t<CnStatusBadge\n\t\t\tv-if=\"header.pill\"\n\t\t\t:label=\"header.pill.label\"\n\t\t\t:variant=\"header.pill.variant\"\n\t\t\tdata-testid=\"cn-detail-widget-header-pill\" />\n\t\t<span\n\t\t\tv-if=\"header.note\"\n\t\t\tclass=\"cn-detail-page__catalog-note\"\n\t\t\tdata-testid=\"cn-detail-widget-header-note\">{{ header.note }}</span>\n\t\t<template v-for=\"(action, index) in header.actions\" :key=\"`${index}-${action.label}`\">\n\t\t\t<!-- `variant: 'primary'`: the card's main action as a filled button\n\t\t\t     (a task table's \"New task\"); otherwise the quiet header link. -->\n\t\t\t<NcButton\n\t\t\t\tv-if=\"action.variant === 'primary'\"\n\t\t\t\tvariant=\"primary\"\n\t\t\t\tclass=\"cn-detail-widget-header-items__primary\"\n\t\t\t\tdata-testid=\"cn-detail-widget-header-action\"\n\t\t\t\t@click=\"action.run()\">\n\t\t\t\t<template v-if=\"action.icon\" #icon>\n\t\t\t\t\t<CnIcon :name=\"action.icon\" :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t{{ action.label }}\n\t\t\t</NcButton>\n\t\t\t<button\n\t\t\t\tv-else\n\t\t\t\ttype=\"button\"\n\t\t\t\tclass=\"cn-detail-page__catalog-action\"\n\t\t\t\t:class=\"{ 'cn-detail-page__catalog-action--add': action.add === true }\"\n\t\t\t\tdata-testid=\"cn-detail-widget-header-action\"\n\t\t\t\t@click=\"action.run()\">\n\t\t\t\t<CnIcon v-if=\"action.icon\" :name=\"action.icon\" :size=\"16\" />\n\t\t\t\t{{ action.label }}\n\t\t\t</button>\n\t\t</template>\n\t</span>\n</template>\n\n<script>\nimport { NcButton } from '@nextcloud/vue'\nimport CnIcon from '../CnIcon/CnIcon.vue'\nimport CnStatusBadge from '../CnStatusBadge/CnStatusBadge.vue'\n\n/**\n * The extras a widget reports for its card's title row through its `header`\n * event: a status pill, a note and its actions. Drawn by CnDetailWidgetHost in\n * the `#actions` slot of the card it wraps a widget in.\n */\nexport default {\n\tname: 'CnDetailWidgetHeaderItems',\n\n\tcomponents: { CnIcon, CnStatusBadge, NcButton },\n\n\tprops: {\n\t\t/** The reported header: `{ pill, note, actions: [{ label, icon?, variant?, add?, run }] }`; `add: true` marks a list's Add. */\n\t\theader: {\n\t\t\ttype: Object,\n\t\t\trequired: true,\n\t\t},\n\t},\n}\n</script>\n\n<style scoped>\n.cn-detail-widget-header-items {\n\tdisplay: inline-flex;\n\tflex-wrap: wrap;\n\talign-items: center;\n\tgap: 12px;\n}\n\n.cn-detail-page__catalog-action {\n\talign-items: center;\n\tbackground: var(--color-primary-element-light);\n\tborder: 0;\n\tborder-radius: 16px;\n\tcolor: var(--color-primary-element-light-text, var(--color-primary-element));\n\tcursor: pointer;\n\tdisplay: inline-flex;\n\tfont: inherit;\n\tfont-size: 13px;\n\tfont-weight: 700;\n\tgap: 6px;\n\tmin-height: 32px;\n\tpadding: 0 14px;\n\twhite-space: nowrap;\n}\n</style>\n"],"names":["_createBlock","_openBlock","_createElementBlock","_toDisplayString","_createVNode","_normalizeClass"],"mappings":";;AASO,MAAA,UAAA,GAAA,EAAA,KAAK,EAAC,+BAAmB,GAAA;;;OAQxB,EAAC,8BAA8B;AACpC,EAAA,aAAQ,EAAA,8BAAA;;;;;;;;;;AAPL,IAAA,CAAA,MAAA,CAAA,MAAA,CAAA,IAAA;sBADHA,WAI8C,CAAA,wBAAA,EAAA;;AAF7C,UAAA,KAAK,EAAE,MAAA,CAAA,MAAM,CAAC,IAAE,CAAA,KAAA;AAChB,UAAA,OAAO,EAAE,MAAA,CAAA,MAAM,CAAC,IAAI,CAAC,OAAO;AAC7B,UAAA,aAAW,EAAC,8BAA8B;;;AAEpC,IAAA,CAAA,MAAA,CAAA,MAAM,CAAC,IAAI;AADlB,SAAAC,SAAA,EAAA,EAAAC,kBAAA,CAGS,MAHT,EAAA,UAGS,EAAAC,eAAA,CAAA,MAAA,CAAA,MAAA,CAAA,IAAA,CAAA,EAAA,CAAA,YAAA;;AACP,KAAAF,SAAA,CAAA,IAAA,CAAA,EAAAC,kBAAA,4BAAkC,MAAA,CAAA,MAAA,CAAA,OAAA,EAAlB,CAAA,MAAM,EAAG,KAAI,KAAA;;gBAAK,KAAA,CAAA,CAAA,EAAA,MAAA,CAAA,KAAA,CAAA,CAAA;;AAI5B,QAAA,CAAA,MAAM,CAAC,OAAO,KAAA,SAAA;0BADpBF,WAUU,CAAA,mBAAA,EAAA;;AARV,cAAA,OAAO,EAAC,SAAS;AAChB,cAAA,KAAI,EAAC,wCAAmC;AACzC,cAAA,aAAU,EAAA,gCAAA;cACT,OAAK,EAAA,MAAA,KAAE,MAAM,IAAG,EAAA,CAAA;;+BAGZ,MACL;gCADK,GACL,GAAAG,eAAA,CAAG,MAAM,CAAC,KAAE,CAAA,EAAA,CAAA,YAAA;;;;AAHH,cAAA,CAAA,MAAA,CAAA,IAAA;;0BAAA,MAAA;gCACR,MAAI;sBAAJC,WAAI,CAAA,iBAAA,EAAA;wBAAA,IAAA,EAAA,MAAA,CAAA,IAAA;AAAA,wBAAA,IAAA,EAAA,EAAA;;;;;;;0BAILF;;AAEA,cAAA,IAAI,EAAC,QAAQ;AACb,cAAA,KAAK,EAACG,cAAA,CAAA,CAAA,gCAAgC,EACrB,EAAA,qCAAA,EAAA,MAAA,CAAA,GAAA,KAAA,IAAA,EAAA,CAAA,CAAA;AACjB,cAAA,aAAO,EAAA,gCAAA;cACN,OAAK,EAAA,MAAA,KAAE,MAAA,CAAA,GAAA,EAAA,CAAA;;AACL,cAAA,CAAA,MAAA,CAAA,IAAA;gCAAHL,WAAG,CAAA,iBAAA,EAAA;;oBAAA,IAAA,EAAA,MAAA,CAAA,IAAA;AAAA,oBAAA,IAAA,EAAA,EAAA;;;8BAAA;;;;;;;;;"}

package/dist/esm/components/CnEventsCard/CnEventsCard.vue.js

@@ -2,7 +2,7 @@ import script from './CnEventsCard.vue2.js';
 import { render } from './CnEventsCard.vue3.js';
 
 script.render = render;
-script.__scopeId = "data-v-079bed63";
+script.__scopeId = "data-v-bb3ee7b4";
 const __sfc_main = script;
 
 export { __sfc_main as default };

package/dist/esm/components/CnEventsCard/CnEventsCard.vue2.js

@@ -231,6 +231,15 @@ var script = {
 			return summary === '' ? translate('nextcloud-vue', 'Appointment') : summary
 		},
 
+		/**
+		 * @param {object} event The event.
+		 * @return {string} The day of the month it starts on, '' when it has no readable start.
+		 */
+		dayOf(event) {
+			const parsed = new Date(String(event?.dtstart ?? '').trim());
+			return Number.isNaN(parsed.getTime()) ? '' : String(parsed.getDate())
+		},
+
 		/**
 		 * @param {object} event The event.
 		 * @return {string} When it is: its start and end, or whichever it has.