@conduction/nextcloud-vue 0.1.0-beta.10 → 0.1.0-beta.12

package/src/components/CnDashboardPage/CnDashboardPage.vue

@@ -114,6 +114,7 @@
 </template>
 
 <script>
+import { translate as t } from '@nextcloud/l10n'
 import { NcButton, NcEmptyContent, NcLoadingIcon } from '@nextcloud/vue'
 import Pencil from 'vue-material-design-icons/Pencil.vue'
 import Check from 'vue-material-design-icons/Check.vue'
@@ -236,22 +237,22 @@ export default {
 		/** Label for the edit button */
 		editLabel: {
 			type: String,
-			default: 'Edit',
+			default: () => t('nextcloud-vue', 'Edit'),
 		},
 		/** Label for the done button (when editing) */
 		doneLabel: {
 			type: String,
-			default: 'Done',
+			default: () => t('nextcloud-vue', 'Done'),
 		},
 		/** Label for the empty state */
 		emptyLabel: {
 			type: String,
-			default: 'No widgets configured',
+			default: () => t('nextcloud-vue', 'No widgets configured'),
 		},
 		/** Label for unavailable widgets */
 		unavailableLabel: {
 			type: String,
-			default: 'Widget not available',
+			default: () => t('nextcloud-vue', 'Widget not available'),
 		},
 	},
 

package/src/components/CnDetailGrid/CnDetailGrid.vue

@@ -52,6 +52,8 @@
 </template>
 
 <script>
+import { translate as t } from '@nextcloud/l10n'
+
 /**
  * CnDetailGrid — Data-driven label-value grid for detail/info sections.
  *
@@ -132,7 +134,7 @@ export default {
 		 */
 		emptyLabel: {
 			type: String,
-			default: 'No details available',
+			default: () => t('nextcloud-vue', 'No details available'),
 		},
 	},
 

package/src/components/CnDetailPage/CnDetailPage.vue

@@ -158,6 +158,7 @@
 </template>
 
 <script>
+import { translate as t } from '@nextcloud/l10n'
 import { NcButton, NcEmptyContent, NcLoadingIcon } from '@nextcloud/vue'
 import { CnIcon } from '../CnIcon/index.js'
 import AlertCircleOutline from 'vue-material-design-icons/AlertCircleOutline.vue'
@@ -278,7 +279,7 @@ export default {
 		/** Message shown during loading */
 		loadingLabel: {
 			type: String,
-			default: 'Loading...',
+			default: () => t('nextcloud-vue', 'Loading...'),
 		},
 		/** Whether to activate the external sidebar (via objectSidebarState inject) */
 		sidebar: {
@@ -318,7 +319,7 @@ export default {
 		/** Error message shown in error state */
 		errorMessage: {
 			type: String,
-			default: 'An error occurred',
+			default: () => t('nextcloud-vue', 'An error occurred'),
 		},
 		/** Callback for retry button in error state. If null, no retry button is shown. */
 		onRetry: {
@@ -328,7 +329,7 @@ export default {
 		/** Label for the retry button */
 		retryLabel: {
 			type: String,
-			default: 'Retry',
+			default: () => t('nextcloud-vue', 'Retry'),
 		},
 		/** Whether the page has no data to show */
 		empty: {
@@ -338,7 +339,7 @@ export default {
 		/** Message shown when page is empty */
 		emptyLabel: {
 			type: String,
-			default: 'No data available',
+			default: () => t('nextcloud-vue', 'No data available'),
 		},
 		/** Title shown above the statistics table */
 		statsTitle: {

package/src/components/CnFacetSidebar/CnFacetSidebar.vue

@@ -59,6 +59,7 @@
 </template>
 
 <script>
+import { translate as t } from '@nextcloud/l10n'
 import { NcButton, NcSelect, NcTextField, NcCheckboxRadioSwitch, NcLoadingIcon } from '@nextcloud/vue'
 import { filtersFromSchema } from '../../utils/schema.js'
 
@@ -112,12 +113,12 @@ export default {
 		/** Sidebar title */
 		title: {
 			type: String,
-			default: 'Filters',
+			default: () => t('nextcloud-vue', 'Filters'),
 		},
 		/** Clear all button label */
 		clearLabel: {
 			type: String,
-			default: 'Clear all',
+			default: () => t('nextcloud-vue', 'Clear all'),
 		},
 		/**
 		 * Whether the current user is an admin.

package/src/components/CnFilterBar/CnFilterBar.vue

@@ -63,6 +63,7 @@
 </template>
 
 <script>
+import { translate as t } from '@nextcloud/l10n'
 import { NcTextField, NcSelect, NcButton, NcCheckboxRadioSwitch } from '@nextcloud/vue'
 import Magnify from 'vue-material-design-icons/Magnify.vue'
 
@@ -113,7 +114,7 @@ export default {
 		/** Search input placeholder text */
 		searchPlaceholder: {
 			type: String,
-			default: 'Search...',
+			default: () => t('nextcloud-vue', 'Search...'),
 		},
 		/** Whether to show the "Clear all" button */
 		showClearAll: {
@@ -123,7 +124,7 @@ export default {
 		/** Clear all button label */
 		clearAllLabel: {
 			type: String,
-			default: 'Clear filters',
+			default: () => t('nextcloud-vue', 'Clear filters'),
 		},
 	},
 

package/src/components/CnFormDialog/CnFormDialog.vue

@@ -227,6 +227,43 @@
 							:disabled="field.readOnly"
 							@update:value="value => updateField(field.key, value)" />
 
+						<!-- JSON (type: 'object'|'array'|... with widget: 'json'): parses on input, stores parsed value in formData -->
+						<div v-else-if="field.widget === 'json'" class="cn-form-dialog__json-wrapper">
+							<label :for="'cn-form-' + field.key" class="cn-form-dialog__label">
+								{{ field.label }}{{ field.required ? ' *' : '' }}
+							</label>
+							<CnJsonViewer
+								:value="jsonStringFor(field)"
+								language="json"
+								:read-only="field.readOnly"
+								:error-text="jsonErrors[field.key] || ''"
+								@update:value="value => onJsonFieldInput(field, value)" />
+							<span
+								v-if="errors[field.key] || field.description"
+								class="cn-form-dialog__helper"
+								:class="{ 'cn-form-dialog__helper--error': errors[field.key] }">
+								{{ errors[field.key] || field.description }}
+							</span>
+						</div>
+
+						<!-- Code (freeform editor, stored as raw string; optional `field.language` chooses highlighting) -->
+						<div v-else-if="field.widget === 'code'" class="cn-form-dialog__json-wrapper">
+							<label :for="'cn-form-' + field.key" class="cn-form-dialog__label">
+								{{ field.label }}{{ field.required ? ' *' : '' }}
+							</label>
+							<CnJsonViewer
+								:value="formData[field.key] != null ? String(formData[field.key]) : ''"
+								:language="field.language || 'auto'"
+								:read-only="field.readOnly"
+								@update:value="value => updateField(field.key, value)" />
+							<span
+								v-if="errors[field.key] || field.description"
+								class="cn-form-dialog__helper"
+								:class="{ 'cn-form-dialog__helper--error': errors[field.key] }">
+								{{ errors[field.key] || field.description }}
+							</span>
+						</div>
+
 						<!-- Fallback: text input -->
 						<NcTextField
 							v-else
@@ -251,7 +288,7 @@
 			<NcButton
 				v-if="result === null"
 				type="primary"
-				:disabled="loading || !requiredFieldsFilled"
+				:disabled="loading || !requiredFieldsFilled || !jsonFieldsValid"
 				@click="executeConfirm">
 				<template #icon>
 					<NcLoadingIcon v-if="loading" :size="20" />
@@ -265,7 +302,9 @@
 </template>
 
 <script>
+import { translate as t } from '@nextcloud/l10n'
 import { NcDialog, NcButton, NcNoteCard, NcLoadingIcon, NcTextField, NcSelect, NcCheckboxRadioSwitch } from '@nextcloud/vue'
+import CnJsonViewer from '../CnJsonViewer/CnJsonViewer.vue'
 import Plus from 'vue-material-design-icons/Plus.vue'
 import ContentSaveOutline from 'vue-material-design-icons/ContentSaveOutline.vue'
 import { fieldsFromSchema } from '../../utils/schema.js'
@@ -297,6 +336,17 @@ import { fieldsFromSchema } from '../../utils/schema.js'
  * (with empty query) and on each search input (debounced, default 300ms, configurable
  * via `field.debounce`). Async selects store the full option object in formData.
  *
+ * ## JSON / code fields
+ *
+ * Two widgets render a CnJsonViewer-powered editor:
+ *
+ * - `widget: 'json'` — Parses on input. formData holds the parsed value (object,
+ *   array, number, string, boolean, or `null` for empty). Invalid JSON displays an
+ *   inline error and blocks the confirm button until fixed. Pair with `type: 'object'`
+ *   (or any type) to opt a property out of the default object-filter in `fieldsFromSchema`.
+ * - `widget: 'code'` — Stores the raw string. Optional `field.language` chooses
+ *   syntax highlighting (`'json'|'xml'|'html'|'text'|'auto'`, default `'auto'`).
+ *
  * The dialog does NOT perform the save itself — it emits a `confirm` event
  * with the form data. The parent performs the actual API call and calls
  * `setResult()` via a ref.
@@ -359,6 +409,7 @@ export default {
 		NcTextField,
 		NcSelect,
 		NcCheckboxRadioSwitch,
+		CnJsonViewer,
 		Plus,
 		ContentSaveOutline,
 	},
@@ -414,8 +465,8 @@ export default {
 			type: String,
 			default: '',
 		},
-		cancelLabel: { type: String, default: 'Cancel' },
-		closeLabel: { type: String, default: 'Close' },
+		cancelLabel: { type: String, default: () => t('nextcloud-vue', 'Cancel') },
+		closeLabel: { type: String, default: () => t('nextcloud-vue', 'Close') },
 		/** Confirm button label. Defaults to "Create" or "Save". */
 		confirmLabel: {
 			type: String,
@@ -432,6 +483,10 @@ export default {
 			closeTimeout: null,
 			/** Per-field async state: { [fieldKey]: { options: [], loading: false, searchTimeout: null } } */
 			asyncState: {},
+			/** Per-field editor string for `json` widgets (preserves input between keystrokes even while invalid) */
+			jsonDrafts: {},
+			/** Per-field parse-error messages for `json` widgets (blocks confirm) */
+			jsonErrors: {},
 		}
 	},
 
@@ -441,24 +496,24 @@ export default {
 		},
 
 		schemaTitle() {
-			return (this.schema && this.schema.title) || 'Item'
+			return (this.schema && this.schema.title) || t('nextcloud-vue', 'Item')
 		},
 
 		resolvedTitle() {
 			if (this.dialogTitle) return this.dialogTitle
 			return this.isCreateMode
-				? `Create ${this.schemaTitle}`
-				: `Edit ${this.schemaTitle}`
+				? t('nextcloud-vue', 'Create {title}', { title: this.schemaTitle })
+				: t('nextcloud-vue', 'Edit {title}', { title: this.schemaTitle })
 		},
 
 		resolvedConfirmLabel() {
 			if (this.confirmLabel) return this.confirmLabel
-			return this.isCreateMode ? 'Create' : 'Save'
+			return this.isCreateMode ? t('nextcloud-vue', 'Create') : t('nextcloud-vue', 'Save')
 		},
 
 		resolvedSuccessText() {
 			if (this.successText) return this.successText
-			return `${this.schemaTitle} saved successfully.`
+			return t('nextcloud-vue', '{title} saved successfully.', { title: this.schemaTitle })
 		},
 
 		/** Whether all required fields have a non-empty value */
@@ -473,6 +528,11 @@ export default {
 				})
 		},
 
+		/** Whether every `json` widget currently parses successfully */
+		jsonFieldsValid() {
+			return Object.keys(this.jsonErrors).every((k) => !this.jsonErrors[k])
+		},
+
 		resolvedFields() {
 			// Manual fields take priority
 			if (this.fields) return this.fields
@@ -517,6 +577,8 @@ export default {
 						data[field.key] = false
 					} else if (field.widget === 'tags' || field.widget === 'multiselect') {
 						data[field.key] = []
+					} else if (field.widget === 'code') {
+						data[field.key] = ''
 					} else {
 						data[field.key] = null
 					}
@@ -524,6 +586,8 @@ export default {
 				this.formData = data
 			}
 			this.errors = {}
+			this.jsonDrafts = {}
+			this.jsonErrors = {}
 			this.initAsyncFields()
 		},
 
@@ -535,6 +599,53 @@ export default {
 			}
 		},
 
+		/**
+		 * Resolve the string shown in the CnJsonViewer for a `json`-widget field.
+		 * Prefers the unparsed draft (so invalid typing isn't clobbered), falling
+		 * back to a pretty-printed stringification of the parsed value in formData.
+		 *
+		 * @param {object} field Field definition.
+		 * @return {string} JSON string for the editor.
+		 */
+		jsonStringFor(field) {
+			if (Object.prototype.hasOwnProperty.call(this.jsonDrafts, field.key)) {
+				return this.jsonDrafts[field.key]
+			}
+			const value = this.formData[field.key]
+			if (value === null || value === undefined) return ''
+			try {
+				return JSON.stringify(value, null, 2)
+			} catch (e) {
+				return String(value)
+			}
+		},
+
+		/**
+		 * Handle input in a `json`-widget CnJsonViewer. Parses on the fly:
+		 * on success, the parsed value lands in formData and any previous error
+		 * is cleared; on failure, formData keeps its last-known-good value and
+		 * `jsonErrors[key]` is set, which surfaces inline and disables confirm.
+		 *
+		 * @param {object} field Field definition.
+		 * @param {string} newString Current editor content.
+		 */
+		onJsonFieldInput(field, newString) {
+			this.$set(this.jsonDrafts, field.key, newString)
+			const trimmed = (newString || '').trim()
+			if (!trimmed) {
+				this.updateField(field.key, null)
+				this.$delete(this.jsonErrors, field.key)
+				return
+			}
+			try {
+				const parsed = JSON.parse(trimmed)
+				this.updateField(field.key, parsed)
+				this.$delete(this.jsonErrors, field.key)
+			} catch (e) {
+				this.$set(this.jsonErrors, field.key, t('nextcloud-vue', 'Invalid JSON: {msg}', { msg: e.message }))
+			}
+		},
+
 		getEnumOptions(field) {
 			if (!field.enum) return []
 			const labels = field.enumLabels || {}
@@ -835,6 +946,7 @@ export default {
 
 		executeConfirm() {
 			if (!this.validate()) return
+			if (!this.jsonFieldsValid) return
 
 			this.loading = true
 			/**
@@ -888,7 +1000,8 @@ export default {
 }
 
 .cn-form-dialog__textarea-wrapper,
-.cn-form-dialog__select-wrapper {
+.cn-form-dialog__select-wrapper,
+.cn-form-dialog__json-wrapper {
 	display: flex;
 	flex-direction: column;
 	gap: 4px;

package/src/components/CnIndexPage/CnIndexPage.vue

@@ -122,6 +122,7 @@
 		<!-- Form dialog for create/edit (overridable via slot) -->
 		<slot
 			name="form-dialog"
+			:show="showFormDialogVisible"
 			:item="editItem"
 			:schema="schema"
 			:close="closeFormDialog">

package/src/components/CnIndexSidebar/CnIndexSidebar.vue

@@ -164,6 +164,7 @@
 </template>
 
 <script>
+import { translate as t } from '@nextcloud/l10n'
 import { NcAppSidebar, NcAppSidebarTab, NcTextField, NcSelect, NcCheckboxRadioSwitch, NcPopover, NcButton } from '@nextcloud/vue'
 import Magnify from 'vue-material-design-icons/Magnify.vue'
 import FormatColumns from 'vue-material-design-icons/FormatColumns.vue'
@@ -272,37 +273,37 @@ export default {
 		/** Search input placeholder */
 		searchPlaceholder: {
 			type: String,
-			default: 'Type to search...',
+			default: () => t('nextcloud-vue', 'Type to search...'),
 		},
 		/** Search tab label */
 		searchTabLabel: {
 			type: String,
-			default: 'Search',
+			default: () => t('nextcloud-vue', 'Search'),
 		},
 		/** Columns tab label */
 		columnsTabLabel: {
 			type: String,
-			default: 'Columns',
+			default: () => t('nextcloud-vue', 'Columns'),
 		},
 		/** Search section heading */
 		searchLabel: {
 			type: String,
-			default: 'Search',
+			default: () => t('nextcloud-vue', 'Search'),
 		},
 		/** Filters section heading */
 		filtersLabel: {
 			type: String,
-			default: 'Filters',
+			default: () => t('nextcloud-vue', 'Filters'),
 		},
 		/** Columns section heading */
 		columnsHeading: {
 			type: String,
-			default: 'Column Visibility',
+			default: () => t('nextcloud-vue', 'Column visibility'),
 		},
 		/** Columns section description */
 		columnsDescription: {
 			type: String,
-			default: 'Select which columns to display in the table',
+			default: () => t('nextcloud-vue', 'Select which columns to display in the table'),
 		},
 		/** Override label for the schema properties group. Defaults to schema.title. */
 		propertiesGroupLabel: {

package/src/components/CnJsonViewer/CnJsonViewer.vue

@@ -27,8 +27,8 @@
 				Format JSON
 			</NcButton>
 		</div>
-		<span v-if="!readOnly && resolvedLanguage === 'json' && !isValidJson(value)" class="cn-json-viewer__error">
-			Invalid JSON format
+		<span v-if="shouldShowError" class="cn-json-viewer__error">
+			{{ resolvedErrorText }}
 		</span>
 	</div>
 </template>
@@ -89,6 +89,15 @@ export default {
 			default: 'auto',
 			validator: (v) => ['json', 'xml', 'html', 'text', 'auto'].includes(v),
 		},
+		/**
+		 * Custom text for the error banner rendered below the editor.
+		 * - `null` (default): the built-in "Invalid JSON format" banner renders
+		 *   whenever `language === 'json'` and the content fails to parse.
+		 * - Any string: the caller owns the banner — it renders when this
+		 *   string is non-empty, and is hidden when empty. Use this to surface
+		 *   a richer parse error (e.g. the exception message).
+		 */
+		errorText: { type: String, default: null },
 	},
 
 	data() {
@@ -169,6 +178,28 @@ export default {
 			if (this.langExtension) exts.push(this.langExtension)
 			return exts
 		},
+		/**
+		 * Error text displayed in the banner. Caller-provided `errorText` wins;
+		 * otherwise falls back to the built-in "Invalid JSON format" message.
+		 * @return {string} Message to show.
+		 */
+		resolvedErrorText() {
+			if (this.errorText !== null) return this.errorText
+			return 'Invalid JSON format'
+		},
+		/**
+		 * Whether to show the error banner.
+		 * - If `errorText` is supplied, the caller controls visibility via its
+		 *   emptiness.
+		 * - Otherwise, show iff the content is editable JSON and fails to parse.
+		 * @return {boolean} Visibility flag.
+		 */
+		shouldShowError() {
+			if (this.errorText !== null) return this.errorText !== ''
+			return !this.readOnly
+				&& this.resolvedLanguage === 'json'
+				&& !this.isValidJson(this.value)
+		},
 	},
 
 	methods: {
@@ -214,8 +245,6 @@ export default {
 }
 
 .cn-json-viewer__codemirror {
-	border: 1px solid var(--color-border);
-	border-radius: var(--border-radius);
 	position: relative;
 }
 

package/src/components/CnMassActionBar/CnMassActionBar.vue

@@ -144,7 +144,7 @@ export default {
 		/** Label template for the menu button. Use {count} for the count. */
 		menuLabelTemplate: {
 			type: String,
-			default: () => t('nextcloud-vue', 'Mass Actions ({count})'),
+			default: () => t('nextcloud-vue', 'Mass actions ({count})'),
 		},
 		importLabel: { type: String, default: () => t('nextcloud-vue', 'Import') },
 		exportLabel: { type: String, default: () => t('nextcloud-vue', 'Export') },

package/src/components/CnMassImportDialog/CnMassImportDialog.vue

@@ -228,7 +228,7 @@ export default {
 		/** Dialog title */
 		dialogTitle: {
 			type: String,
-			default: 'Import Data',
+			default: () => t('nextcloud-vue', 'Import data'),
 		},
 		/** Accepted file types (input accept attribute) */
 		acceptedTypes: {
@@ -271,7 +271,7 @@ export default {
 		},
 		summaryTitle: { type: String, default: () => t('nextcloud-vue', 'Import summary') },
 		supportedFormatsLabel: { type: String, default: () => t('nextcloud-vue', 'Supported file types:') },
-		selectFileLabel: { type: String, default: () => t('nextcloud-vue', 'Select File') },
+		selectFileLabel: { type: String, default: () => t('nextcloud-vue', 'Select file') },
 		cancelLabel: { type: String, default: () => t('nextcloud-vue', 'Cancel') },
 		closeLabel: { type: String, default: () => t('nextcloud-vue', 'Close') },
 		confirmLabel: { type: String, default: () => t('nextcloud-vue', 'Import') },

package/src/components/CnNotesCard/CnNotesCard.vue

@@ -83,6 +83,7 @@
 </template>
 
 <script>
+import { translate as t } from '@nextcloud/l10n'
 import { NcButton, NcLoadingIcon } from '@nextcloud/vue'
 import CommentTextOutline from 'vue-material-design-icons/CommentTextOutline.vue'
 import Send from 'vue-material-design-icons/Send.vue'
@@ -158,12 +159,12 @@ export default {
 		},
 
 		// --- Pre-translated labels ---
-		titleLabel: { type: String, default: 'Notes' },
-		addNoteLabel: { type: String, default: 'Add note' },
-		addNotePlaceholder: { type: String, default: 'Write a note...' },
-		noNotesLabel: { type: String, default: 'No notes yet' },
-		showAllLabel: { type: String, default: 'Show all' },
-		deleteLabel: { type: String, default: 'Delete note' },
+		titleLabel: { type: String, default: () => t('nextcloud-vue', 'Notes') },
+		addNoteLabel: { type: String, default: () => t('nextcloud-vue', 'Add note') },
+		addNotePlaceholder: { type: String, default: () => t('nextcloud-vue', 'Write a note...') },
+		noNotesLabel: { type: String, default: () => t('nextcloud-vue', 'No notes yet') },
+		showAllLabel: { type: String, default: () => t('nextcloud-vue', 'Show all') },
+		deleteLabel: { type: String, default: () => t('nextcloud-vue', 'Delete note') },
 	},
 
 	emits: ['note-added', 'note-deleted', 'show-all'],

package/src/components/CnObjectDataWidget/CnObjectDataWidget.vue

@@ -219,6 +219,7 @@
 </template>
 
 <script>
+import { translate as t } from '@nextcloud/l10n'
 import { NcButton, NcLoadingIcon, NcTextField, NcSelect, NcCheckboxRadioSwitch } from '@nextcloud/vue'
 import { CnDetailCard } from '../CnDetailCard/index.js'
 import ContentSaveOutline from 'vue-material-design-icons/ContentSaveOutline.vue'
@@ -274,7 +275,7 @@ export default {
 		/** Widget title shown in the card header */
 		title: {
 			type: String,
-			default: 'Data',
+			default: () => t('nextcloud-vue', 'Data'),
 		},
 		/** Optional MDI icon component for the header */
 		icon: {
@@ -326,7 +327,7 @@ export default {
 		 * - `label` (string) — Override the display label
 		 * - `widget` (string) — Override the widget type for editing
 		 *
-		 * @type {Object<string, { order?: number, gridColumn?: number, gridRow?: number, hidden?: boolean, editable?: boolean, label?: string, widget?: string }>}
+		 * @type {{ [key: string]: { order?: number, gridColumn?: number, gridRow?: number, hidden?: boolean, editable?: boolean, label?: string, widget?: string } }}
 		 */
 		overrides: {
 			type: Object,
@@ -366,17 +367,17 @@ export default {
 		/** Label for the save button */
 		saveLabel: {
 			type: String,
-			default: 'Save',
+			default: () => t('nextcloud-vue', 'Save'),
 		},
 		/** Label for the discard button */
 		discardLabel: {
 			type: String,
-			default: 'Discard',
+			default: () => t('nextcloud-vue', 'Discard'),
 		},
 		/** Label shown when no properties to display */
 		emptyLabel: {
 			type: String,
-			default: 'No data available',
+			default: () => t('nextcloud-vue', 'No data available'),
 		},
 	},
 
@@ -502,7 +503,7 @@ export default {
 	methods: {
 		/**
 		 * Check if a field is editable.
-		 * @param field
+		 * @param {object} field - Resolved field definition from resolvedFields
 		 */
 		isEditable(field) {
 			if (!this.editable) return false
@@ -517,7 +518,7 @@ export default {
 
 		/**
 		 * Check if a field's current value is empty.
-		 * @param key
+		 * @param {string} key - Field key to check
 		 */
 		isValueEmpty(key) {
 			const val = key in this.dirtyFields
@@ -528,7 +529,7 @@ export default {
 
 		/**
 		 * Start inline editing for a field.
-		 * @param field
+		 * @param {object} field - Resolved field definition from resolvedFields
 		 */
 		startEdit(field) {
 			// Set working value: dirty value > current object value
@@ -555,8 +556,8 @@ export default {
 
 		/**
 		 * Update the working edit value for a field.
-		 * @param key
-		 * @param value
+		 * @param {string} key - Field key to update
+		 * @param {*} value - New value for the field
 		 */
 		updateField(key, value) {
 			this.editData = { ...this.editData, [key]: value }

package/src/components/CnObjectMetadataWidget/CnObjectMetadataWidget.vue

@@ -27,6 +27,7 @@
 </template>
 
 <script>
+import { translate as t } from '@nextcloud/l10n'
 import { CnDetailCard } from '../CnDetailCard/index.js'
 import { CnDetailGrid } from '../CnDetailGrid/index.js'
 
@@ -87,7 +88,7 @@ export default {
 		/** Widget title shown in the card header */
 		title: {
 			type: String,
-			default: 'Metadata',
+			default: () => t('nextcloud-vue', 'Metadata'),
 		},
 		/** Optional MDI icon component for the header */
 		icon: {
@@ -160,7 +161,7 @@ export default {
 		/** Label shown when no metadata available */
 		emptyLabel: {
 			type: String,
-			default: 'No metadata available',
+			default: () => t('nextcloud-vue', 'No metadata available'),
 		},
 	},