@sealcode/sealgen 0.19.32 → 0.19.34

package/lib/forms/fields/field.js

@@ -1,6 +1,7 @@
 import { predicates } from "@sealcode/ts-predicates";
 import { t } from "../../utils/translate.js";
 import { wrapAttribute, wrapKeyName } from "../../utils/wrap-attributes.js";
+import { getProperty } from "dot-prop";
 function fieldsToShape(obj) {
   return Object.fromEntries(
     Object.entries(obj).map(([key, value]) => [key, value.predicate])
@@ -27,6 +28,13 @@ class FormField {
     this.label = label;
     return this;
   }
+  getValuePath() {
+    return (this.value_path || this.name).replaceAll("][", ".").replaceAll("[", ".");
+  }
+  setValuePath(path) {
+    this.value_path = path;
+    return this;
+  }
   async _validate(ctx, value) {
     if (value === "" || value === null || value === void 0) {
       if (this.required) {
@@ -52,7 +60,7 @@ class FormField {
     return { valid: true, message: "" };
   }
   async getParsedValue(ctx, all_form_values, validate = false) {
-    const raw = all_form_values[this.name];
+    const raw = getProperty(all_form_values, this.getValuePath());
     if (raw == void 0 || raw == null || raw == "") {
       return {
         parsed: null,
@@ -80,7 +88,7 @@ class FormField {
         parsed: parsed_value,
         ...validate ? { valid } : {},
         message,
-        raw: all_form_values[this.name]
+        raw
       };
     } else {
       return { parsed: parsed_value, raw, message: "parsed" };
@@ -98,9 +106,14 @@ class FormField {
   getSealiousCreateValue(fctx) {
     throw new Error("This field does not have a default sealious mapping");
   }
-  sealiousValueToForm(ctx, sealiousValue, item) {
+  parsedToSealious(parsed) {
     throw new Error("This field does not have a default sealious mapping");
   }
+  sealiousValueToForm(ctx, sealiousValue, item) {
+    throw new Error(
+      `Field '${this.name}' does not have a default sealious mapping`
+    );
+  }
   async postSealiousCreate(ctx, created_item, form_data) {
   }
   async postSealiousEdit(ctx, edited_item, form_data) {
@@ -111,7 +124,7 @@ class FormField {
     )})`;
   }
   generateCreateValueGetter(field_info, vars) {
-    return `${wrapKeyName(field_info.name)}: await ${vars.form_fields}${wrapAttribute(field_info.name)}.getSealiousCreateValue(fctx)`;
+    return `${wrapKeyName(field_info.name)}: await ${vars.form_fields}${wrapAttribute(field_info.name)}.parsedToSealious(data${wrapAttribute(field_info.name)})`;
   }
   generateInitialValue(field_info, vars) {
     return `${wrapKeyName(field_info.name)}: await ${vars.form_fields}${wrapAttribute(field_info.name)}.sealiousValueToForm(ctx, item.get("${field_info.name}"))`;

package/lib/forms/fields/fields.js

@@ -32,4 +32,5 @@ export * from "./structured-array.js";
 export * from "./table.js";
 export * from "./text.js";
 export * from "./url.js";
+export * from "./structured.js";
 //# sourceMappingURL=fields.js.map

package/lib/forms/fields/file.js

@@ -2,6 +2,7 @@ import { hasFieldOfType, is, predicates } from "@sealcode/ts-predicates";
 import { PathFilePointer } from "@sealcode/file-manager";
 import { FormField } from "./field.js";
 import { File as FileControl } from "../controls/file.js";
+import { ImageValue } from "sealious";
 class File extends FormField {
   constructor(required) {
     super(required);
@@ -27,7 +28,7 @@ class File extends FormField {
         raw_value,
         "old",
         predicates.instanceOf(PathFilePointer)
-      ) ? await ctx.$app.fileManager.toPointer(raw_value.old) : null;
+      ) && raw_value.old ? await ctx.$app.fileManager.toPointer(raw_value.old) : null;
       const new_file = hasFieldOfType(
         raw_value,
         "new",
@@ -56,11 +57,7 @@ class File extends FormField {
   getControl() {
     return new FileControl(this, { label: this.name, autocomplete: false });
   }
-  async getSealiousCreateValue(fctx) {
-    const { parsed: value } = await this.getParsedValue(
-      fctx.ctx,
-      fctx.data.raw_values
-    );
+  async parsedToSealious(value) {
     const pointer = value?.new || value?.old || void 0;
     if (this.required && !pointer) {
       throw new Error("File is required, but no value is provided");
@@ -71,6 +68,9 @@ class File extends FormField {
     if (!sealiousValue) {
       return {};
     }
+    if (sealiousValue instanceof ImageValue) {
+      return { old: sealiousValue.toFile() };
+    }
     if (typeof sealiousValue == "string") {
       sealiousValue = await ctx.$app.fileManager.fromToken(sealiousValue);
     }

package/lib/forms/fields/int.js

@@ -3,14 +3,7 @@ class Int extends NumberBasedSimpleField {
   constructor(required) {
     super(required, "number");
   }
-  async getSealiousCreateValue(fctx) {
-    const { parsed } = await this.getParsedValue(
-      fctx.ctx,
-      fctx.data.raw_values
-    );
-    if (parsed == null) {
-      return void 0;
-    }
+  async parsedToSealious(parsed) {
     if (isNaN(parsed)) {
       return void 0;
     } else

package/lib/forms/fields/json.js

@@ -17,11 +17,7 @@ class JSONField extends SimpleFormField {
       parsed_value: JSON.parse(raw_value)
     };
   }
-  async getSealiousCreateValue(fctx) {
-    const { parsed } = await this.getParsedValue(
-      fctx.ctx,
-      fctx.data.raw_values
-    );
+  async parsedToSealious(parsed) {
     return parsed;
   }
 }

package/lib/forms/fields/phone-number-with-country-code.js

@@ -42,11 +42,7 @@ class PhoneNumberWithCountryCode extends FormField {
       )
     });
   }
-  async getSealiousCreateValue(fctx) {
-    const { parsed } = await this.getParsedValue(
-      fctx.ctx,
-      fctx.data.raw_values
-    );
+  async parsedToSealious(parsed) {
     if (!parsed) {
       return "";
     }

package/lib/forms/fields/regexp.js

@@ -39,11 +39,7 @@ class RegExpField extends FormField {
   getControl() {
     return new SimpleInput(this, { label: this.label || this.name });
   }
-  async getSealiousCreateValue(fctx) {
-    const { parsed } = await this.getParsedValue(
-      fctx.ctx,
-      fctx.data.raw_values
-    );
+  async parsedToSealious(parsed) {
     return parsed || "";
   }
   async sealiousValueToForm(ctx, sealious_value) {

package/lib/forms/fields/simple-form-field.js

@@ -1,6 +1,7 @@
 import { predicates } from "@sealcode/ts-predicates";
 import { FormField } from "./field.js";
 import { SimpleInput } from "../controls/simple-input.js";
+import { Textarea } from "../controls/controls.js";
 class SimpleFormField extends FormField {
   constructor(required, type = "text") {
     super(required);
@@ -27,22 +28,15 @@ class TextBasedSimpleField extends SimpleFormField {
       error: null
     };
   }
-  async getSealiousCreateValue(fctx) {
-    if (this.disabled) {
-      return null;
-    }
-    const { parsed } = await this.getParsedValue(
-      fctx.ctx,
-      fctx.data.raw_values
-    );
-    return parsed || "";
+  async parsedToSealious(value) {
+    return value || "";
   }
   async postSealiousCreate(_ctx, _created_item, _formData) {
   }
   async postSealiousEdit(_ctx, _edited_item, _formData) {
   }
   getControl() {
-    return new SimpleInput(this, {
+    return new Textarea(this, {
       label: this.label || this.name,
       type: this.type
     });
@@ -59,12 +53,8 @@ class NumberBasedSimpleField extends SimpleFormField {
       error: null
     };
   }
-  async getSealiousCreateValue(fctx) {
-    const { parsed } = await this.getParsedValue(
-      fctx.ctx,
-      fctx.data.raw_values
-    );
-    return parsed || 0;
+  async parsedToSealious(value) {
+    return value || 0;
   }
   async postSealiousCreate() {
   }

package/lib/forms/fields/single-reference.js

@@ -8,12 +8,8 @@ class SingleReference extends CollectionField {
       getLabel: (item) => item.id
     });
   }
-  async getSealiousCreateValue(fctx) {
-    const { parsed } = await this.getParsedValue(
-      fctx.ctx,
-      fctx.data.raw_values
-    );
-    return parsed || void 0;
+  async parsedToSealious(parsed) {
+    return parsed || "";
   }
   async sealiousValueToForm(_ctx, value) {
     return value || void 0;

package/lib/forms/fields/structured-array.js

@@ -32,11 +32,7 @@ class StructuredArray extends Table {
   generateFieldDeclaration(_field_info, vars) {
     return `new ${vars.form_field_types}.${this.constructor.name}(${vars.sealious_field})`;
   }
-  async getSealiousCreateValue(fctx) {
-    const { parsed } = await this.getParsedValue(
-      fctx.ctx,
-      fctx.data.raw_values
-    );
+  async parsedToSealious(parsed) {
     return parsed || this.getEmptyValue();
   }
   async sealiousValueToForm(ctx, sealiousValue) {

package/lib/forms/fields/structured.js

@@ -0,0 +1,107 @@
+import { is, predicates } from "@sealcode/ts-predicates";
+import { FormField } from "./field.js";
+import { FieldGroup } from "../controls/controls.js";
+import { sealiousFieldToFormField } from "./collection-field.js";
+class StructuredSealiousField extends FormField {
+  constructor(sealiousField) {
+    super(false);
+    this.sealiousField = sealiousField;
+  }
+  getEmptyValue() {
+    return {};
+  }
+  async parse(ctx, raw_value) {
+    const sealiousField = this.sealiousField;
+    if (!is(raw_value, predicates.object)) {
+      raw_value = {};
+    }
+    const results = await Promise.all(
+      Object.entries(sealiousField.fields).map(async ([key, field]) => {
+        const formfield = sealiousFieldToFormField(
+          field,
+          key,
+          this.name
+        );
+        return [
+          key,
+          await formfield.parse(
+            ctx,
+            raw_value[key] || ""
+          )
+        ];
+      })
+    );
+    const parsable = results.every(([, r]) => r.parsable);
+    if (parsable) {
+      return {
+        parsable,
+        error: null,
+        parsed_value: Object.fromEntries(
+          results.map(([key, value]) => [key, value.parsed_value])
+        )
+      };
+    } else
+      return {
+        parsable: false,
+        parsed_value: null,
+        error: results.map(([, r]) => r.error).join("; ")
+      };
+  }
+  async parsedToSealious(parsed) {
+    return Object.fromEntries(
+      await Promise.all(
+        Object.entries(parsed).map(
+          async ([key, value]) => {
+            const sealious_field = this.sealiousField.fields[key];
+            const formfield = sealiousFieldToFormField(
+              sealious_field,
+              key,
+              this.name
+            );
+            return [key, await formfield.parsedToSealious(value)];
+          }
+        )
+      )
+    );
+  }
+  async sealiousValueToForm(ctx, sealiousValue, item) {
+    return Object.fromEntries(
+      await Promise.all(
+        Object.entries(
+          sealiousValue || {}
+        ).map(async ([key, value]) => {
+          const sealious_field = this.sealiousField.fields[key];
+          const formfield = sealiousFieldToFormField(
+            sealious_field,
+            key,
+            this.name
+          );
+          return [
+            key,
+            await formfield.sealiousValueToForm(ctx, value, item)
+          ];
+        })
+      )
+    );
+  }
+  getControl() {
+    const structured = this.sealiousField;
+    return new FieldGroup(
+      Object.keys(structured.fields).map((key) => {
+        return sealiousFieldToFormField(
+          structured.fields[key],
+          key,
+          this.name
+        ).setLabel(key).getControl();
+      }),
+      { label: this.name }
+    );
+  }
+  generateFieldDeclaration(_field_info, vars) {
+    return `new ${vars.form_field_types}.${this.constructor.name}(${vars.sealious_field})`;
+  }
+}
+export {
+  StructuredSealiousField
+};
+//# sourceMappingURL=structured.js.map

package/lib/forms/fields/text.js

@@ -3,11 +3,7 @@ class Text extends TextBasedSimpleField {
   constructor(required) {
     super(required, "text");
   }
-  async getSealiousCreateValue(fctx) {
-    const { parsed } = await this.getParsedValue(
-      fctx.ctx,
-      fctx.data.raw_values
-    );
+  async parsedToSealious(parsed) {
     return parsed || this.getEmptyValue();
   }
 }

package/lib/forms/fields/url.js

@@ -3,12 +3,8 @@ class URLField extends TextBasedSimpleField {
   constructor(required) {
     super(required, "text");
   }
-  async getSealiousCreateValue(fctx) {
-    const { parsed } = await this.getParsedValue(
-      fctx.ctx,
-      fctx.data.raw_values
-    );
-    return parsed || null;
+  async parsedToSealious(parsed) {
+    return parsed || "";
   }
 }
 export {

package/lib/forms/form.js

@@ -199,10 +199,11 @@ class Form extends MountableWithFields {
     });
     router.get(path, async (ctx) => {
       ctx.type = "html";
+      const raw_values = await this.extractRawValues(ctx);
       ctx.body = await this.render(
         ctx,
         {
-          raw_values: await this.extractRawValues(ctx),
+          raw_values,
           messages: [],
           field_messages: {}
         },

package/lib/templates/shared/collection-create-form.js

@@ -33,6 +33,10 @@ async function createItemFormTemplate(create_action_name, newfilefullpath, colle
     onsubmit: `
 	async onSubmit(ctx: Context, formData: FormData) {
 		const fctx = this.makeFormControlContext(ctx, formData, true);
+		const data = await this.getParsedValues(ctx);
+		if (!data) {
+			throw new Error("Error when parsing the form values");
+		}
 
 		const created =  await ctx.$app.collections["${toKebabCase(
       collection_name

package/lib/templates/shared/collection-edit-form.js

@@ -49,6 +49,11 @@ async function editItemFormTemplate(edit_action_name, newfilefullpath, collectio
 					throw new Error("Unknown id: " + id);
 				}
 
+				const data = await this.getParsedValues(ctx);
+				if (!data) {
+					throw new Error("Error when parsing the form values");
+				}
+
 
 				item.setMultipleExtraSafe(
 				{

package/lib/utils/input-wrapper.js

@@ -7,13 +7,13 @@ function getModifierClasses(modifiers) {
   return modifiers.map((m) => "form-input__wrapper--" + m).join(" ");
 }
 async function inputWrapper(type, modifiers, input) {
-  return tempstream`<div
+  return tempstream`<label
 		class="form-input form-input--type-${type} form-input__wrapper ${getModifierClasses(
     modifiers
   )}"
 	>
 		${input}
-	</div>`;
+	</label>`;
 }
 async function autoWrapInput(field, input) {
   return inputWrapper(

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@sealcode/sealgen",
-	"version": "0.19.32",
+	"version": "0.19.34",
 	"description": "Module to automate adding routes and collections to a sealious application",
 	"main": "lib/index.js",
 	"type": "module",
@@ -69,6 +69,7 @@
 		"core-js-pure": "^3.49.0",
 		"country-codes-list": "^2.0.0",
 		"deepmerge": "^4.3.1",
+		"dot-prop": "^10.2.0",
 		"esbuild": "^0.20.0",
 		"escape-goat": "^4.0.0",
 		"fonsta": "^1.1.1",
@@ -93,7 +94,7 @@
 	"peerDependencies": {
 		"koa": "^2.13.0",
 		"koa-responsive-image-router": "^0.2.24",
-		"sealious": "^0.21.38",
+		"sealious": "^0.21.43",
 		"stimulus": "^3.2.2"
 	}
 }

package/src/forms/controls/checkboxed-list-input.test.ts

@@ -62,8 +62,8 @@ describe("checkboxed-list", () => {
 			const context = await browser.newContext();
 			page = await context.newPage();
 			await page.goto(`http://localhost:${port}`);
-			await page.getByLabel("CO").check();
-			await page.getByLabel("DE").check();
+			await page.getByLabel("CO", { exact: true }).check();
+			await page.getByLabel("DE", { exact: true }).check();
 			await page.getByRole("button", { name: "Wyślij" }).click();
 			assert.deepStrictEqual(received_values, { syllables: { co: "on", de: "on" } });
 		});
@@ -206,7 +206,7 @@ describe("checkboxed-list", () => {
 				const context = await browser.newContext();
 				page = await context.newPage();
 				await page.goto(`http://localhost:${port}`);
-				await page.getByLabel("DE").check();
+				await page.getByLabel("DE", { exact: true }).check();
 				await page.getByRole("button", { name: "Wyślij" }).click();
 				await sleep(100);
 				assert(submit_called);

package/src/forms/controls/dropdown.ts

@@ -17,7 +17,7 @@ export type DropdownOption = { value: string; label: string };
 
 export class FreeformDropdown<ParsedValue> extends SimpleInput {
 	constructor(
-		public field: FormField<boolean, ParsedValue | null>,
+		public field: FormField<boolean, ParsedValue>,
 		public _generateOptions: (ctx: Context) => Promise<DropdownOption[]>,
 		public options: DropdownOptions = {
 			label: field.label || field.name,

package/src/forms/controls/field-group.ts

@@ -43,17 +43,19 @@ export class FieldGroup extends FormFieldControl {
 
 		return tempstream /* HTML */ `
 			<div
-				class="field-group ${(classes || []).join(" ")}"
-				${this.options.containerID
-					? `id="${this.options.containerID}"`
-					: ""}
+				class="field-group form-input__wrapper ${(classes || []).join(
+					" "
+				)}"
+				${this.options.containerID ?
+					`id="${this.options.containerID}"`
+				:	""}
 			>
 				${this.preLabelContainer()}
 				<div class="field-group__label-container">
 					${this.preLabel()}
-					${label
-						? tempstream`<label ${this.getGroupLabelProps()}>${label}</label>`
-						: ""}
+					${label ?
+						tempstream`<label ${this.getGroupLabelProps()}>${label}</label>`
+					:	""}
 					${this.postLabel()}
 				</div>
 				${this.preFields()}

package/src/forms/controls/simple-input.ts

@@ -127,26 +127,30 @@ export class SimpleInput<
 			fctx.data.raw_values,
 			true
 		);
+
 		return inputWrapper(
 			"simple-input",
 			this.getWrapperModifiers(),
 			tempstream /* HTML */ `
 				${label ? `<label for="${id}">${label}</label>` : ""}
-				${await this.preInput(fctx, fctx.data.raw_values)}
-				${this.renderInput(
-					fctx.ctx,
-					renderAttributes(await this.getInputAttributes(fctx)),
-					fctx.data.raw_values
-				)}
-				${this.postInput(fctx.ctx)}
-				${~valid && !this.options.hide_errors && fctx.validate ?
-					`<div class="input__error">${[
-						message,
-						fctx.data.field_messages?.[this.field.name]?.message,
-					]
-						.filter((e) => !!e)
-						.join(" · ")}</div>`
-				:	""}
+				<div class="simple-input__inner-wrapper">
+					${await this.preInput(fctx, fctx.data.raw_values)}
+					${this.renderInput(
+						fctx.ctx,
+						renderAttributes(await this.getInputAttributes(fctx)),
+						fctx.data.raw_values
+					)}
+					${this.postInput(fctx.ctx)}
+					${~valid && !this.options.hide_errors && fctx.validate ?
+						`<div class="input__error">${[
+							message,
+							fctx.data.field_messages?.[this.field.name]
+								?.message,
+						]
+							.filter((e) => !!e)
+							.join(" · ")}</div>`
+					:	""}
+				</div>
 			`
 		);
 	}

package/src/forms/controls/textarea.ts

@@ -49,7 +49,7 @@ export class Textarea extends SimpleInput {
 		attributes: string,
 		data: Record<string, FormDataValue>
 	) {
-		// eslint-disable-next-line no-await-in-loop, @typescript-eslint/no-unsafe-assignment
+		// eslint-disable-next-line  @typescript-eslint/no-unsafe-assignment
 		const { parsed: value } = await this.field.getParsedValue(ctx, data);
 		return /* HTML */ `<textarea ${attributes}>
 ${value ? String(value) : ""}</textarea

package/src/forms/fields/boolean.ts

@@ -3,7 +3,6 @@ import { Context } from "koa";
 import { Checkbox } from "../controls/checkbox.js";
 import { FormDataValue } from "../form-types.js";
 import { FieldParseResult, FormField } from "./field.js";
-import { FormControlContext } from "../controls/form-control.js";
 
 const truthy = ["true", "on", "yes", "1"];
 const falsy = ["false", "off", "no", "0"];
@@ -71,12 +70,8 @@ export class Boolean<Required extends boolean> extends FormField<
 		return new Checkbox(this, { label: this.label || this.name });
 	}
 
-	async getSealiousCreateValue(fctx: FormControlContext): Promise<boolean> {
-		const { parsed } = await this.getParsedValue(
-			fctx.ctx,
-			fctx.data.raw_values
-		);
-		return !!parsed;
+	async parsedToSealious(value: boolean): Promise<boolean> {
+		return !!value;
 	}
 
 	async sealiousValueToForm(