viur-ui 0.0.1 → 0.0.2

package/src/forms/bones/widgets/fileBone.vue

@@ -97,51 +97,52 @@
 <script setup>
 import { reactive, onMounted, inject, ref } from "vue"
 import { downloadUrlFor, uploadFile } from "../../../request/index.js"
+import BoneActions from "../BoneActions.vue"
 /**
- * Datei-Upload-Widget für Bones vom Typ `relational.tree.leaf.file.file`.
+ * File upload widget for bones of type `relational.tree.leaf.file.file`.
  *
- * Stellt eine kombinierte Klick-/Drop-Fläche bereit: ein Klick öffnet den File-Picker,
- * ein Drop lädt die fallengelassene Datei hoch. Bei Bilddateien wird eine klickbare
- * Vorschau angezeigt, die einen Dialog öffnet. Action-Buttons (Download, Delete)
- * werden über `<bone-actions>` per Default-Slot eingebracht.
+ * Provides a combined click/drop area: a click opens the file picker,
+ * a drop uploads the dropped file. For image files, a clickable
+ * preview is shown that opens a dialog. Action buttons (download, delete)
+ * are inserted via `<bone-actions>` through the default slot.
  *
  * @displayName FileBone
  *
- * @cssClass bone-widget-file-area - Äußerer klickbarer Container (Drop-Zone)
- * @cssClass bone-widget-prompt - Empty-State (Icon + Text)
- * @cssClass bone-widget-loader - Während des Uploads sichtbar
- * @cssClass bone-widget-preview - Container für das Vorschaubild oder das Datei-Icon
- * @cssClass has-preview - Zusatzklasse wenn ein Bild-Vorschau vorliegt
- * @cssClass is-dragover - Wenn eine Datei über die Fläche gezogen wird
- * @cssClass has-value - Wenn ein Wert gesetzt ist
- * @cssClass is-loading - Während ein Upload läuft
- * @cssClass is-readonly - Wenn der Bone readonly ist
+ * @cssClass bone-widget-file-area - Outer clickable container (drop zone)
+ * @cssClass bone-widget-prompt - Empty state (icon + text)
+ * @cssClass bone-widget-loader - Visible during the upload
+ * @cssClass bone-widget-preview - Container for the preview image or the file icon
+ * @cssClass has-preview - Additional class when an image preview is present
+ * @cssClass is-dragover - When a file is dragged over the area
+ * @cssClass has-value - When a value is set
+ * @cssClass is-loading - While an upload is in progress
+ * @cssClass is-readonly - When the bone is readonly
  */
 defineOptions({
   inheritAttrs: false,
 })
 const props = defineProps({
-  /** Bone-Name – wird in jedem `change`-Event als erstes Argument übergeben. */
+  /** Bone name – passed as the first argument in every `change` event. */
   name: String,
-  /** Aktueller Bone-Wert; Objekt mit `dest`- und `rel`-Schlüsseln oder `null`. */
+  /** Current bone value; object with `dest` and `rel` keys, or `null`. */
   value: [Object, String, Number, Boolean, Array],
-  /** Index im Multiple-Array; `undefined` bei Einzelwert. */
+  /** Index in the multiple array; `undefined` for a single value. */
   index: Number,
-  /** Sprach-Key bei mehrsprachigen Bones, z.B. `"de"`. */
+  /** Language key for multilingual bones, e.g. `"de"`. */
   lang: String,
-  /** Bone-Struktur; `public`-Flag steuert ob der Upload öffentlich ist. */
+  /** Bone structure; the `public` flag controls whether the upload is public. */
   bone: Object,
-  /** Aktuell nicht genutzt. */
+  /** Currently not used. */
   autofocus: Boolean,
 })
 
 const emit = defineEmits([
   /**
-   * Wird bei Datei-Upload, Datei-Drop, Löschen und beim Mount (Initialisierung) gefeuert.
-   * @arg {string} name - Bone-Name
-   * @arg {{ dest: object, rel: null }|string} value - Hochgeladenes Datei-Objekt oder `""` beim Löschen
-   * @arg {string|undefined} lang - Sprach-Key
-   * @arg {number|undefined} index - Index im Multiple-Array
+   * Fired on file upload, file drop, clearing, and on mount (initialization).
+   * @arg {string} name - Bone name
+   * @arg {{ dest: object, rel: null }|string} value - Uploaded file object, or `""` when cleared
+   * @arg {string|undefined} lang - Language key
+   * @arg {number|undefined} index - Index in the multiple array
    */
   "change",
 ])
@@ -159,9 +160,9 @@ onMounted(() => {
 })
 
 /**
- * Triggert den nativen File-Picker des hidden Inputs.
- * Nur im Empty-State aktiv — ist bereits ein Wert gesetzt, muss zuerst per
- * Delete-Action geleert oder per Drag-and-Drop ersetzt werden.
+ * Triggers the native file picker of the hidden input.
+ * Only active in the empty state — if a value is already set, it must first be
+ * cleared via the delete action or replaced via drag-and-drop.
  */
 function openPicker() {
   if (state.loading || boneState.readonly || props.value) return
@@ -237,11 +238,11 @@ async function handleDrop(event) {
 .bone-widget-prompt {
   justify-content: center;
   color: var(--wa-color-on-quiet);
-  /* Klicks fallen auf die outer Drop-Zone durch */
+  /* Clicks fall through to the outer drop zone */
   pointer-events: none;
 }
 
-/* Dateiname-Zeile darf schrumpfen; lange Namen werden mit Ellipsis abgekürzt */
+/* Filename row may shrink; long names are truncated with an ellipsis */
 .bone-widget-file-row {
   min-width: 0;
 }
@@ -261,7 +262,7 @@ async function handleDrop(event) {
   background-color: color-mix(in srgb, var(--wa-color-surface-default) 70%, transparent);
 }
 
-/* Klickbare Bildvorschau: Zoom-Cursor + leichte Skalierung beim Hover */
+/* Clickable image preview: zoom cursor + slight scaling on hover */
 .bone-widget-preview.has-preview {
   cursor: zoom-in;
   transition: transform 0.15s ease;

package/src/forms/bones/widgets/keyBone.vue

@@ -12,48 +12,48 @@
 <script setup>
 import { reactive, onMounted, inject } from "vue"
 /**
- * Anzeige-Widget für den internen Datenbankschlüssel eines Eintrags (Typ `key`).
+ * Display widget for an entry's internal database key (type `key`).
  *
- * Rendert ein immer deaktiviertes `<wa-input>`, da der Schlüssel nicht manuell
- * editiert werden kann. Der Wert wird direkt aus dem Skel übernommen und dient
- * ausschließlich zur Information. Unterstützt kein multiple und kein multilang.
+ * Renders an always-disabled `<wa-input>`, since the key cannot be edited
+ * manually. The value is taken directly from the skel and serves
+ * informational purposes only. Supports neither multiple nor multilang.
  *
  * @displayName KeyBone
  *
- * @cssClass bone-widget - Basis-Klasse aller Bone-Widgets
- * @cssClass bone-widget-key - Kennzeichnet den Bone-Typ
- * @cssClass bone-widget-key-default - Standard-Variante
- * @cssClass bone-widget-key-{name} - Dynamisch gesetzt auf den Bone-Namen, z.B. `bone-widget-key-key`
+ * @cssClass bone-widget - Base class of all bone widgets
+ * @cssClass bone-widget-key - Identifies the bone type
+ * @cssClass bone-widget-key-default - Default variant
+ * @cssClass bone-widget-key-{name} - Dynamically set to the bone name, e.g. `bone-widget-key-key`
  */
 defineOptions({
   inheritAttrs: false,
 })
 const props = defineProps({
-  /** Bone-Name – wird in jedem `change`-Event als erstes Argument übergeben. */
+  /** Bone name – passed as the first argument in every `change` event. */
   name: String,
-  /** Aktueller Schlüsselwert (URL-safe Base64-String). */
+  /** Current key value (URL-safe Base64 string). */
   value: [Object, String, Number, Boolean, Array],
-  /** Index im Multiple-Array; nicht genutzt, da multiple nicht unterstützt wird. */
+  /** Index in the multiple array; unused, since multiple is not supported. */
   index: Number,
-  /** Sprach-Key; nicht genutzt, da multilang nicht unterstützt wird. */
+  /** Language key; unused, since multilang is not supported. */
   lang: String,
-  /** Readonly-Flag (wird nicht ausgewertet – der Bone ist immer disabled). */
+  /** Readonly flag (not evaluated – the bone is always disabled). */
   readonly: Boolean,
-  /** Zusätzliche Bone-Parameter. */
+  /** Additional bone parameters. */
   params: Object,
-  /** Bone-Struktur (aktuell nicht aktiv genutzt). */
+  /** Bone structure (currently not actively used). */
   bone: Object,
-  /** Setzt den Fokus (ohne Effekt, da das Element immer disabled ist). */
+  /** Sets the focus (no effect, since the element is always disabled). */
   autofocus: Boolean,
 })
 
 const emit = defineEmits([
   /**
-   * Wird beim Mount (Initialisierung) und bei change gefeuert.
-   * @arg {string} name - Bone-Name
-   * @arg {string} value - Aktueller Schlüsselwert
-   * @arg {string|undefined} lang - Sprach-Key
-   * @arg {number|undefined} index - Index im Multiple-Array
+   * Fired on mount (initialization) and on change.
+   * @arg {string} name - Bone name
+   * @arg {string} value - Current key value
+   * @arg {string|undefined} lang - Language key
+   * @arg {number|undefined} index - Index in the multiple array
    */
   "change",
 ])

package/src/forms/bones/widgets/numericBone.vue

@@ -32,46 +32,46 @@
 import { reactive, onMounted, computed, inject, ref, watchEffect } from "vue"
 import { useTimeoutFn } from "@vueuse/core"
 /**
- * Numerisches Eingabefeld für Ganzzahlen und Dezimalwerte.
+ * Numeric input field for integers and decimal values.
  *
- * Rendert ein `<wa-input type="number">` und zeigt optional Hinweise zu
- * Mindest-/Höchstwert und Präzision an. Unterstützt Mehrsprachigkeit
- * (`languages`) und mehrfache Werte (`multiple`). Der Schritt (`step`) wird
- * aus `boneState.bonestructure.precision` berechnet.
+ * Renders a `<wa-input type="number">` and optionally shows hints about
+ * the minimum/maximum value and precision. Supports multiple languages
+ * (`languages`) and multiple values (`multiple`). The step (`step`) is
+ * calculated from `boneState.bonestructure.precision`.
  *
  * @displayName NumericBone
  *
- * @cssClass bone-widget - Basis-Klasse aller Bone-Widgets
- * @cssClass bone-widget-numeric - Kennzeichnet den Bone-Typ
- * @cssClass bone-widget-numeric-default - Standard-Variante
- * @cssClass bone-widget-numeric-{name} - Dynamisch gesetzt auf den Bone-Namen, z.B. `bone-widget-numeric-amount`
+ * @cssClass bone-widget - Base class of all bone widgets
+ * @cssClass bone-widget-numeric - Identifies the bone type
+ * @cssClass bone-widget-numeric-default - Default variant
+ * @cssClass bone-widget-numeric-{name} - Dynamically set to the bone name, e.g. `bone-widget-numeric-amount`
  */
 defineOptions({
   inheritAttrs: false,
 })
 const props = defineProps({
-  /** Bone-Name – wird in jedem `change`-Event als erstes Argument übergeben. */
+  /** Bone name – passed as the first argument in every `change` event. */
   name: String,
-  /** Aktueller Bone-Wert. */
+  /** Current bone value. */
   value: [Object, String, Number, Boolean, Array],
-  /** Index im Multiple-Array; `undefined` bei Einzelwert. */
+  /** Index in the multiple array; `undefined` for a single value. */
   index: Number,
-  /** Sprach-Key bei mehrsprachigen Bones, z.B. `"de"`. */
+  /** Language key for multilingual bones, e.g. `"de"`. */
   lang: String,
-  /** Bone-Struktur (aktuell nicht aktiv genutzt). */
+  /** Bone structure (currently not actively used). */
   bone: Object,
-  /** Setzt den Fokus nach 600 ms auf das Input-Element. */
+  /** Focuses the input element after 600 ms. */
   autofocus: Boolean,
 })
 
 const emit = defineEmits([
   /**
-   * Wird bei jeder Wertänderung sowie beim Mount (Initialisierung) gefeuert.
-   * @arg {string} name - Bone-Name
-   * @arg {string} value - Aktueller Eingabewert (als String)
-   * @arg {string|undefined} lang - Sprach-Key
-   * @arg {number|undefined} index - Index im Multiple-Array
-   * @arg {boolean} [valid] - Validierungsstatus; fehlt beim Init-Event
+   * Fired on every value change and on mount (initialization).
+   * @arg {string} name - Bone name
+   * @arg {string} value - Current input value (as a string)
+   * @arg {string|undefined} lang - Language key
+   * @arg {number|undefined} index - Index in the multiple array
+   * @arg {boolean} [valid] - Validation status; missing on the init event
    */
   "change",
 ])

package/src/forms/bones/widgets/passwordBone.vue

@@ -61,64 +61,67 @@
 <script setup>
 import { reactive, onMounted, computed, inject, watch, ref, watchEffect } from "vue"
 import { useTimeoutFn } from "@vueuse/core"
+import { useI18n } from "vue-i18n"
 /**
- * Passwort-Eingabefeld mit Wiederholung und Stärke-Validierung.
+ * Password input field with confirmation and strength validation.
  *
- * Rendert `<wa-input type="password">` — mit Wiederholungs-Feld, WENN der Bone
- * überhaupt Passwort-Tests mitbringt (`bonestructure.tests`). Ein Login-Formular
- * liefert serverseitig einen rohen Passwort-Bone ohne Tests
- * (`PasswordBone(raw=True, tests=(), test_threshold=0)`); dort wäre eine
- * Wiederholung falsch — man tippt ein bestehendes Passwort ein, man setzt keins.
- * Im Readonly-Modus entfällt die Wiederholung ebenfalls. Passwort-Tests
- * werden über `boneState.bonestructure.tests` (Array aus `[regex, message, required]`
- * Tupeln) konfiguriert. `boneState.bonestructure.test_threshold` legt fest,
- * wie viele optionale Tests fehlschlagen dürfen.
+ * Renders `<wa-input type="password">` — with a confirmation field IF the bone
+ * comes with password tests at all (`bonestructure.tests`). A login form
+ * receives a raw password bone without tests from the server
+ * (`PasswordBone(raw=True, tests=(), test_threshold=0)`); a confirmation would be
+ * wrong there — you enter an existing password, you don't set one.
+ * In readonly mode the confirmation is omitted as well. Password tests
+ * are configured via `boneState.bonestructure.tests` (array of `[regex, message, required]`
+ * tuples). `boneState.bonestructure.test_threshold` defines
+ * how many optional tests may fail.
  *
  * @displayName PasswordBone
  *
- * @cssClass bone-widget - Basis-Klasse aller Bone-Widgets
- * @cssClass bone-widget-password - Kennzeichnet den Bone-Typ
- * @cssClass bone-widget-password-default - Standard-Variante
- * @cssClass bone-widget-password-{name} - Dynamisch gesetzt auf den Bone-Namen
- * @cssClass has-check - Gesetzt wenn nicht readonly; entfernt border-bottom-right-radius für nahtlosen Übergang zum Wiederholungs-Feld
+ * @cssClass bone-widget - Base class of all bone widgets
+ * @cssClass bone-widget-password - Identifies the bone type
+ * @cssClass bone-widget-password-default - Default variant
+ * @cssClass bone-widget-password-{name} - Dynamically set to the bone name
+ * @cssClass has-check - Set when not readonly; removes border-bottom-right-radius for a seamless transition to the confirmation field
  */
 defineOptions({
   inheritAttrs: false,
 })
 const props = defineProps({
-  /** Bone-Name – wird in jedem `change`-Event als erstes Argument übergeben. */
+  /** Bone name – passed as the first argument in every `change` event. */
   name: String,
-  /** Aktueller Bone-Wert (wird in `state.value1` gespiegelt). */
+  /** Current bone value (mirrored in `state.value1`). */
   value: [Object, String, Number, Boolean, Array],
-  /** Index im Multiple-Array; `undefined` bei Einzelwert. */
+  /** Index in the multiple array; `undefined` for a single value. */
   index: Number,
-  /** Sprach-Key bei mehrsprachigen Bones, z.B. `"de"`. */
+  /** Language key for multilingual bones, e.g. `"de"`. */
   lang: String,
-  /** Bone-Struktur (aktuell nicht aktiv genutzt). */
+  /** Bone structure (currently not actively used). */
   bone: Object,
-  /** Setzt den Fokus nach 600 ms auf das erste Passwort-Feld. */
+  /** Focuses the first password field after 600 ms. */
   autofocus: Boolean,
 })
 
 const emit = defineEmits([
   /**
-   * Wird bei jeder Wertänderung sowie beim Mount (Initialisierung) gefeuert.
-   * @arg {string} name - Bone-Name
-   * @arg {string} value - Aktueller Passwortwert (nur wenn beide Felder übereinstimmen und Tests bestanden)
-   * @arg {string|undefined} lang - Sprach-Key
-   * @arg {number|undefined} index - Index im Multiple-Array
-   * @arg {boolean} valid - `true` wenn Passwort gültig (Tests bestanden + Felder gleich)
+   * Fired on every value change and on mount (initialization).
+   * @arg {string} name - Bone name
+   * @arg {string} value - Current password value (only if both fields match and the tests passed)
+   * @arg {string|undefined} lang - Language key
+   * @arg {number|undefined} index - Index in the multiple array
+   * @arg {boolean} valid - `true` if the password is valid (tests passed + fields equal)
    */
   "change",
 ])
 
+const { t } = useI18n()
+
 const boneState = inject("boneState")
 const state = reactive({
   value1: "",
   value2: null,
   equal: false,
-  // Wiederholung nur, wenn der Bone Tests mitbringt (= ein Passwort wird
-  // GESETZT). Beim Login liefert der Server einen rohen Bone ohne Tests.
+  // Confirmation only if the bone comes with tests (= a password is being
+  // SET). On login, the server delivers a raw bone without tests.
   needsConfirm: computed(() => !boneState.readonly && (boneState?.bonestructure?.["tests"]?.length ?? 0) > 0),
   passwordInfo: [],
   requiredPasswordInfo: [],
@@ -172,10 +175,10 @@ function testPassword(password) {
     }
   }
   if (state.needsConfirm && !state.equal) {
-    state.requiredPasswordInfo.push("Die eingegebenen Passwörter stimmen nicht überein.")
+    state.requiredPasswordInfo.push(t("bones.password.mismatch"))
   }
   if (!state.value1) {
-    state.requiredPasswordInfo.push("Das eingegebene Passwort ist leer.")
+    state.requiredPasswordInfo.push(t("bones.password.empty"))
   }
 }
 

package/src/forms/bones/widgets/phoneBone.vue

@@ -34,49 +34,49 @@
 <script setup>
 import { reactive, onMounted, inject, computed, watchEffect, ref } from "vue"
 import { useTimeoutFn } from "@vueuse/core"
-import Utils from "../utils"
+import Utils from "../utils.js"
 import jsonData from "../country_information.json"
 import parsePhoneNumber from "libphonenumber-js/min"
 import { AsYouType, validatePhoneNumberLength } from "libphonenumber-js/min"
 /**
- * Telefonnummer-Eingabefeld mit Ländervorwahl-Auswahl.
+ * Phone number input field with country code selection.
  *
- * Rendert ein `<wa-select>` für die Ländervorwahl (Flaggen-Emoji) und ein
- * `<wa-input type="tel">` für die eigentliche Nummer. Die Nummer wird beim
- * Tippen über `libphonenumber-js` formatiert und normalisiert. Der
- * Standard-Ländercode kann über `boneState.bonestructure.default_country_code`
- * gesteuert werden (Standard: `+49`).
+ * Renders a `<wa-select>` for the country code (flag emoji) and a
+ * `<wa-input type="tel">` for the actual number. The number is formatted and
+ * normalized via `libphonenumber-js` while typing. The
+ * default country code can be controlled via `boneState.bonestructure.default_country_code`
+ * (default: `+49`).
  *
  * @displayName PhoneBone
  *
- * @cssClass bone-widget - Basis-Klasse aller Bone-Widgets (auf dem inneren `<wa-input>`)
- * @cssClass bone-widget-phone - Kennzeichnet den Bone-Typ (auf dem inneren `<wa-input>`, via Wrapper-Klasse)
+ * @cssClass bone-widget - Base class of all bone widgets (on the inner `<wa-input>`)
+ * @cssClass bone-widget-phone - Identifies the bone type (on the inner `<wa-input>`, via wrapper class)
  */
 defineOptions({
   inheritAttrs: false,
 })
 const props = defineProps({
-  /** Bone-Name – wird in jedem `change`-Event als erstes Argument übergeben. */
+  /** Bone name – passed as the first argument in every `change` event. */
   name: String,
-  /** Aktueller Bone-Wert als internationale Telefonnummer, z.B. `"+49 89 12345678"`. */
+  /** Current bone value as an international phone number, e.g. `"+49 89 12345678"`. */
   value: [Object, String, Number, Boolean, Array],
-  /** Index im Multiple-Array; `undefined` bei Einzelwert. */
+  /** Index in the multiple array; `undefined` for a single value. */
   index: Number,
-  /** Sprach-Key bei mehrsprachigen Bones, z.B. `"de"`. */
+  /** Language key for multilingual bones, e.g. `"de"`. */
   lang: String,
-  /** Bone-Struktur (aktuell nicht aktiv genutzt). */
+  /** Bone structure (currently not actively used). */
   bone: Object,
-  /** Setzt den Fokus nach 600 ms auf das Tel-Input-Element. */
+  /** Focuses the tel input element after 600 ms. */
   autofocus: Boolean,
 })
 
 const emit = defineEmits([
   /**
-   * Wird bei jeder Wertänderung sowie beim Mount (Initialisierung) gefeuert.
-   * @arg {string} name - Bone-Name
-   * @arg {string} value - Formatierte internationale Telefonnummer
-   * @arg {string|undefined} lang - Sprach-Key
-   * @arg {number|undefined} index - Index im Multiple-Array
+   * Fired on every value change and on mount (initialization).
+   * @arg {string} name - Bone name
+   * @arg {string} value - Formatted international phone number
+   * @arg {string|undefined} lang - Language key
+   * @arg {number|undefined} index - Index in the multiple array
    */
   "change",
 ])

package/src/forms/bones/widgets/rawBone.vue

@@ -30,44 +30,44 @@
 <script setup>
 import { reactive, onMounted, inject, computed } from "vue"
 /**
- * Mehrzeiliges Freitext- oder JSON-Eingabefeld für Rohdaten.
+ * Multi-line free-text or JSON input field for raw data.
  *
- * Rendert ein `<wa-textarea>`. Wenn `boneState.bonestructure.type === 'raw.json'`
- * wird der Wert beim Anzeigen per `JSON.stringify` serialisiert. Unterstützt
- * Mehrsprachigkeit (`languages`) und Mehrfachwerte (`multiple`).
+ * Renders a `<wa-textarea>`. If `boneState.bonestructure.type === 'raw.json'`,
+ * the value is serialized via `JSON.stringify` for display. Supports
+ * multiple languages (`languages`) and multiple values (`multiple`).
  *
  * @displayName RawBone
  *
- * @cssClass bone-widget - Basis-Klasse aller Bone-Widgets
- * @cssClass bone-widget-raw - Kennzeichnet den Bone-Typ
- * @cssClass bone-widget-raw-default - Standard-Variante
- * @cssClass bone-widget-raw-{name} - Dynamisch gesetzt auf den Bone-Namen, z.B. `bone-widget-raw-content`
+ * @cssClass bone-widget - Base class of all bone widgets
+ * @cssClass bone-widget-raw - Identifies the bone type
+ * @cssClass bone-widget-raw-default - Default variant
+ * @cssClass bone-widget-raw-{name} - Dynamically set to the bone name, e.g. `bone-widget-raw-content`
  */
 defineOptions({
   inheritAttrs: false,
 })
 const props = defineProps({
-  /** Bone-Name – wird in jedem `change`-Event als erstes Argument übergeben. */
+  /** Bone name – passed as the first argument in every `change` event. */
   name: String,
-  /** Aktueller Bone-Wert. Bei `raw.json` wird ein Objekt per `JSON.stringify` dargestellt. */
+  /** Current bone value. With `raw.json`, an object is displayed via `JSON.stringify`. */
   value: [Object, String, Number, Boolean, Array],
-  /** Index im Multiple-Array; `undefined` bei Einzelwert. */
+  /** Index in the multiple array; `undefined` for a single value. */
   index: Number,
-  /** Sprach-Key bei mehrsprachigen Bones, z.B. `"de"`. */
+  /** Language key for multilingual bones, e.g. `"de"`. */
   lang: String,
-  /** Bone-Struktur (aktuell nicht aktiv genutzt). */
+  /** Bone structure (currently not actively used). */
   bone: Object,
-  /** Setzt den Fokus nach dem Mount auf das Textarea-Element. */
+  /** Focuses the textarea element after mount. */
   autofocus: Boolean,
 })
 
 const emit = defineEmits([
   /**
-   * Wird bei jeder Wertänderung sowie beim Mount (Initialisierung) gefeuert.
-   * @arg {string} name - Bone-Name
-   * @arg {string} value - Aktueller Eingabewert
-   * @arg {string|undefined} lang - Sprach-Key
-   * @arg {number|undefined} index - Index im Multiple-Array
+   * Fired on every value change and on mount (initialization).
+   * @arg {string} name - Bone name
+   * @arg {string} value - Current input value
+   * @arg {string|undefined} lang - Language key
+   * @arg {number|undefined} index - Index in the multiple array
    */
   "change",
 ])

package/src/forms/bones/widgets/recordBone.vue

@@ -14,12 +14,12 @@
 import { reactive, onMounted, inject, computed, getCurrentInstance } from "vue"
 import Wrapper_nested from "../BoneNestedWrapper.vue"
 /**
- * Record-Widget für Bones vom Typ `record`.
+ * Record widget for bones of type `record`.
  *
- * Delegiert die gesamte Darstellung an `Wrapper_nested`, der die Sub-Bones
- * aus `bone.using` rendert. Der Record-Wert ist ein Objekt dessen Schlüssel
- * den Sub-Bone-Namen entsprechen. Bei `multiple: true` ist der Wert ein Array
- * dieser Objekte.
+ * Delegates all rendering to `Wrapper_nested`, which renders the sub-bones
+ * from `bone.using`. The record value is an object whose keys match the
+ * sub-bone names. With `multiple: true`, the value is an array
+ * of these objects.
  *
  * @displayName RecordBone
  */
@@ -29,26 +29,26 @@ defineOptions({
 
 const emit = defineEmits([
   /**
-   * Wird weitergeleitet wenn `Wrapper_nested` einen Wert ändert oder beim Mount (Initialisierung).
-   * @arg {string} name - Bone-Name
-   * @arg {object} value - Aktueller Record-Wert (Objekt mit Sub-Bone-Werten)
-   * @arg {string|undefined} lang - Sprach-Key
-   * @arg {number|undefined} index - Index im Multiple-Array
+   * Forwarded when `Wrapper_nested` changes a value, or on mount (initialization).
+   * @arg {string} name - Bone name
+   * @arg {object} value - Current record value (object with sub-bone values)
+   * @arg {string|undefined} lang - Language key
+   * @arg {number|undefined} index - Index in the multiple array
    */
   "change",
 ])
 const props = defineProps({
-  /** Bone-Name – wird in jedem `change`-Event als erstes Argument übergeben. */
+  /** Bone name – passed as the first argument in every `change` event. */
   name: String,
-  /** Aktueller Record-Wert; Objekt mit Sub-Bone-Werten oder Array davon bei `multiple`. */
+  /** Current record value; object with sub-bone values, or an array of them with `multiple`. */
   value: null,
-  /** Index im Multiple-Array; `undefined` bei Einzelwert. */
+  /** Index in the multiple array; `undefined` for a single value. */
   index: Number,
-  /** Sprach-Key bei mehrsprachigen Bones, z.B. `"de"`. */
+  /** Language key for multilingual bones, e.g. `"de"`. */
   lang: String,
-  /** Bone-Struktur; `using` enthält die Sub-Bone-Definitionen. */
+  /** Bone structure; `using` contains the sub-bone definitions. */
   bone: Object,
-  /** Aktuell nicht genutzt. */
+  /** Currently not used. */
   autofocus: Boolean,
 })