@uniweb/kit 0.10.22 → 0.10.23

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniweb/kit",
-  "version": "0.10.22",
+  "version": "0.10.23",
   "description": "Standard component library for Uniweb foundations",
   "type": "module",
   "exports": {
@@ -43,9 +43,9 @@
     "fuse.js": "^7.0.0",
     "shiki": "^3.0.0",
     "tailwind-merge": "^3.6.0",
-    "@uniweb/core": "0.8.2",
+    "@uniweb/scene": "0.1.3",
     "@uniweb/semantic-parser": "1.2.1",
-    "@uniweb/scene": "0.1.3"
+    "@uniweb/core": "0.8.2"
   },
   "peerDependencies": {
     "react": "^19.0.0",

package/src/hooks/useFormValues.js

@@ -170,6 +170,18 @@ function setIn(node, [key, ...rest], value) {
   return { ...base, [key]: setIn(base[key], rest, value) }
 }
 
+/**
+ * Which control kinds hold uploads.
+ *
+ * BOTH `file` and `image` — they are two words in the authoring vocabulary for
+ * the same control, and the visual editor draws a file picker for either. Only
+ * `file` was checked here, so an `image` control's `File` objects went into
+ * `formData` and `JSON.stringify` turned each into `{}`: an attachment the
+ * visitor chose, reported as sent, arriving empty. Exactly the failure the
+ * split below exists to prevent, reachable through the other spelling.
+ */
+const isUpload = (control) => control.type === 'file' || control.type === 'image'
+
 /**
  * Split the held values into what is submitted and what is uploaded.
  *
@@ -186,7 +198,7 @@ function split(controls, values) {
     const value = valueAt(values, control.path)
     if (value === undefined) continue
 
-    if (control.type === 'file') {
+    if (isUpload(control)) {
       for (const file of [].concat(value).filter(isFile)) {
         files.push({ file, field: control.path })
       }

package/src/utils/submitForm.js

@@ -32,7 +32,10 @@
  *                                                   when omitted
  * @param {object} [args.context]                  — where the submission came from:
  *                                                   formId, sectionType, sectionId,
- *                                                   pageId, pageLabel
+ *                                                   pageId, pageLabel. `formId` is
+ *                                                   sent at the top level of the
+ *                                                   body; the rest ride in
+ *                                                   `metadata` (see below)
  * @param {string} [args.verificationToken]        — bot-protection token, when the
  *                                                   endpoint verifies one
  * @param {Array<File|{file:File,field?:string}>} [args.files]
@@ -95,10 +98,20 @@ export async function submitForm({
       }))
     : fileSlots
 
+  // `formId` rides at the TOP LEVEL, not inside `metadata` with the rest of the
+  // context. It is the only part of a submission's origin an endpoint stores as
+  // its own field rather than in an opaque blob, because it is what submissions
+  // are grouped BY — every other origin key is decoration read back for display.
+  // Nesting it means the endpoint's own column is never filled, and nothing on
+  // either side reports that: the value is present, one level down, and the
+  // column is simply null forever.
+  const { formId, ...origin } = context || {}
+
   // ── API name → wire name. See the header before "correcting" these. ──
   const body = {
     formData,
-    metadata: { ...context, preview: summary || deriveSummary(formData) },
+    ...(formId ? { formId } : {}),
+    metadata: { ...origin, preview: summary || deriveSummary(formData) },
     ...(verificationToken ? { turnstileToken: verificationToken } : {}),
     ...(Array.isArray(slots) && slots.length ? { fileSlots: slots } : {}),
   }
@@ -126,6 +139,35 @@ export async function submitForm({
   return { ...result, filesUploaded: entries.length, ...report }
 }
 
+/**
+ * One entry of an endpoint's `uploadUrls`, as a URL.
+ *
+ * Two shapes are in the wild and both mean the same thing: a bare URL string,
+ * or a **record** describing the slot — `{slot, name, uploadUrl}` is what the
+ * endpoint this client is built against actually returns. Reading only the
+ * string form does not degrade, it *breaks*: a record is truthy, so it was used
+ * as the URL directly and `fetch` stringified it to `[object Object]`, turning
+ * every upload into a request for a path that cannot exist. The submission row
+ * was already written by then, so the visitor's message arrived and their files
+ * did not.
+ *
+ * Anything that does not yield a non-empty string returns `''`, so the caller
+ * falls back to the documented `{target}/upload` — which is where the bytes were
+ * going anyway in every deployment seen so far.
+ *
+ * @param {*} entry
+ * @returns {string}
+ */
+function readUploadUrl(entry) {
+  if (typeof entry === 'string') return entry.trim()
+  if (entry && typeof entry === 'object') {
+    for (const key of ['uploadUrl', 'url', 'href']) {
+      if (typeof entry[key] === 'string' && entry[key].trim()) return entry[key].trim()
+    }
+  }
+  return ''
+}
+
 /**
  * Accept either bare `File`s or `{ file, field }` pairs, and drop anything that
  * is not a file. The pair form exists so a submission can say WHICH field an
@@ -176,7 +218,7 @@ async function uploadFiles(entries, result, target, fetchFn) {
   const urls = Array.isArray(result?.uploadUrls) ? result.uploadUrls : []
 
   for (const [slot, { file }] of entries.entries()) {
-    const url = urls[slot] || `${base}/upload`
+    const url = readUploadUrl(urls[slot]) || `${base}/upload`
     let res
     try {
       res = await fetchFn(url, {
@@ -208,11 +250,18 @@ async function uploadFiles(entries, result, target, fetchFn) {
   // count is what a quota or an invoice would otherwise derive from. Sending it
   // costs a few bytes and satisfies the stricter reading of the contract, in
   // which `files` is required and its absence is a malformed call.
-  const manifest = entries.map(({ file }, slot) => ({
+  // Carries `field` for the same reason the create manifest does — which form
+  // control an attachment answers is the difference between a readable
+  // submission and two anonymous blobs. The two manifests describe the same
+  // files and now describe them with the same keys; a receiver that built its
+  // stored record from this one rather than from the create manifest would
+  // otherwise lose the association, silently and only for uploads.
+  const manifest = entries.map(({ file, field }, slot) => ({
     slot,
     name: file.name,
     size: file.size,
     mime: file.type || 'application/octet-stream',
+    ...(field ? { field } : {}),
   }))
 
   const done = await fetchFn(`${base}/finalize`, {