@sealcode/sealgen 0.19.0 → 0.19.3

package/src/forms/controls/array.ts

@@ -16,11 +16,11 @@ import { FormFieldControl } from "./form-field-control.js";
 export type UnboundControlStorage<
 	F extends { new (...args: any): FormFieldControl } = {
 		new (...args: any): FormFieldControl;
-	}
+	},
 > = [F, string, ConstructorParameters<F>];
 
 export function UnboundControl<
-	F extends { new (...args: any): FormFieldControl }
+	F extends { new (...args: any): FormFieldControl },
 >(
 	controlClass: F,
 	arbitrary_field_name: string,
@@ -30,7 +30,7 @@ export function UnboundControl<
 }
 
 export class StructuredArray<
-	Subfields extends Record<string, Field<any>>
+	Subfields extends Record<string, Field<any>>,
 > extends FormFieldControl {
 	constructor(
 		public field: StructuredArrayField<Subfields>,
@@ -77,7 +77,6 @@ export class StructuredArray<
 			validate: false,
 		} as FormControlContext;
 		if (Array.isArray(control)) {
-			// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
 			const [constructor, field_name, params] = control;
 			const field = this.makeSubfield(field_name);
 			if (!field) {
@@ -89,15 +88,13 @@ export class StructuredArray<
 			field.setName(`${this.field.name}[data][${index}][${field_name}]`);
 			const hidden_shadow = new Derived(
 				[field],
-				async (
-					values,
-					{ inner_form_id, field_name }
-				) => /* HTML */ `<input
-					name="${field_name}"
-					type="hidden"
-					value="${values[field_name] || ""}"
-					form="${inner_form_id}"
-				/>`,
+				async (values, { inner_form_id, field_name }) =>
+					/* HTML */ `<input
+						name="${field_name}"
+						type="hidden"
+						value="${values[field_name] || ""}"
+						form="${inner_form_id}"
+					/>`,
 				async () => ({
 					inner_form_id: this.getInnerFormID(),
 					field_name: field.name,
@@ -134,7 +131,7 @@ export class StructuredArray<
 		item: FieldsetOutput<Subfields>,
 		index: number
 	) {
-		return tempstream/* HTML */ `<div>
+		return tempstream /* HTML */ `<div>
 			${this.item_controls.map((control) =>
 				this.renderItemControl(ctx, form_id, control, item, index)
 			)}
@@ -161,7 +158,7 @@ export class StructuredArray<
 	) {
 		const items = await this.getItems(ctx, raw_values);
 
-		return tempstream/* HTML */ `<turbo-frame id="${this.getFrameID()}">
+		return tempstream /* HTML */ `<turbo-frame id="${this.getFrameID()}">
 			Reverse Single Reference
 			${items.map((item, index) =>
 				this.renderItem(ctx, form_id, item, index)
@@ -223,7 +220,6 @@ export class StructuredArray<
 				data: field_data.data || [],
 			});
 			await item.save(ctx.$context);
-			console.log(await item.getDecodedBody(ctx.$context, {}));
 			ctx.body = this._render(
 				ctx,
 				form_id,

package/src/forms/controls/autocomplete.ts

@@ -24,7 +24,7 @@ export class Autocomplete extends SimpleInput {
 	}
 
 	async postInput(ctx: Context) {
-		return tempstream/* HTML */ `<datalist id="${this.getListID()}">
+		return tempstream /* HTML */ `<datalist id="${this.getListID()}">
 			${(await this.field.generateOptions(ctx)).map(
 				({ value }) => /* HTML */ `<option>${value}</option>`
 			)}

package/src/forms/controls/big-radio-group.ts

@@ -23,10 +23,10 @@ export class BigRadioGroup extends FormFieldControl {
 			fctx.ctx,
 			fctx.data.raw_values
 		);
-		return tempstream/* HTML */ `<div class="bigradios">
+		return tempstream /* HTML */ `<div class="bigradios">
 			${Object.entries(this.options).map(([key, { description }]) => {
 				const id = `${this.field.name}-radio-${key}`;
-				return tempstream/* HTML */ `<input
+				return tempstream /* HTML */ `<input
 						type="radio"
 						name="${this.field.name}"
 						value="${key}"

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

@@ -17,7 +17,7 @@ export type DefaultCheckboxOptions = {
 };
 
 export class CheckboxGroup<
-	Options extends DefaultCheckboxOptions = DefaultCheckboxOptions
+	Options extends DefaultCheckboxOptions = DefaultCheckboxOptions,
 > extends FormFieldControl {
 	constructor(
 		public field: CheckboxedListField<boolean, string>,

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

@@ -23,7 +23,7 @@ describe("checkboxed-list", () => {
 
 		it("sends the values", async () => {
 			const port = await getPort();
-			console.log(`Using port ${port} form checkboxed-list-input.test.ts`);
+			console.info(`Using port ${port} form checkboxed-list-input.test.ts`);
 			const app = new Koa();
 			const router = new Router();
 
@@ -71,7 +71,7 @@ describe("checkboxed-list", () => {
 		describe("behavior with (non)required", () => {
 			it("allows to send a form when no value is selected and fiels is not required", async () => {
 				const port = await getPort();
-				console.log(`Using port ${port} form checkboxed-list-input.test.ts`);
+				console.info(`Using port ${port} form checkboxed-list-input.test.ts`);
 				const app = new Koa();
 				const router = new Router();
 
@@ -118,7 +118,7 @@ describe("checkboxed-list", () => {
 
 			it("does not allow to send a form when no value is selected and field IS required", async () => {
 				const port = await getPort();
-				console.log(`Using port ${port} form checkboxed-list-input.test.ts`);
+				console.info(`Using port ${port} form checkboxed-list-input.test.ts`);
 				const app = new Koa();
 				const router = new Router();
 
@@ -166,7 +166,7 @@ describe("checkboxed-list", () => {
 
 			it("allows to send a form when no value is selected and field IS required", async () => {
 				const port = await getPort();
-				console.log(`Using port ${port} form checkboxed-list-input.test.ts`);
+				console.info(`Using port ${port} form checkboxed-list-input.test.ts`);
 				const app = new Koa();
 				const router = new Router();
 
@@ -215,7 +215,7 @@ describe("checkboxed-list", () => {
 
 		it("renders the label", async () => {
 			const port = await getPort();
-			console.log(`Using port ${port} form checkboxed-list-input.test.ts`);
+			console.info(`Using port ${port} form checkboxed-list-input.test.ts`);
 			const app = new Koa();
 			const router = new Router();
 
@@ -258,7 +258,7 @@ describe("checkboxed-list", () => {
 
 		it("groups checkboxes based on the value of the 'group' attribute", async () => {
 			const port = await getPort();
-			console.log(`Using port ${port} form checkboxed-list-input.test.ts`);
+			console.info(`Using port ${port} form checkboxed-list-input.test.ts`);
 			const app = new Koa();
 			const router = new Router();
 

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

@@ -8,7 +8,7 @@ import { FormControlContext } from "./form-control.js";
 import { FormFieldControl } from "./form-field-control.js";
 
 export class CheckboxedListInput<
-	Values extends string
+	Values extends string,
 > extends FormFieldControl {
 	constructor(
 		public field: CheckboxedListField<boolean, Values>,
@@ -54,7 +54,6 @@ export class CheckboxedListInput<
 				if (!groups[option.group]) {
 					groups[option.group] = [];
 				}
-				// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
 				groups[option.group]!.push(option);
 			}
 		}
@@ -67,7 +66,7 @@ export class CheckboxedListInput<
 				getRequiredClass(required),
 				...this.generateCountBasedClasses(options.length),
 			],
-			tempstream/* HTML */ `<label
+			tempstream /* HTML */ `<label
 					>${this.options.label || this.field.name}</label
 				>
 				${~valid && fctx.validate
@@ -77,26 +76,23 @@ export class CheckboxedListInput<
 					${isVisible
 						? Object.entries(groups).map(
 								([group_label, options]) =>
-									tempstream/* HTML */ ` <h3>
+									tempstream /* HTML */ ` <h3>
 											${group_label}
 										</h3>
 
-										${
-											// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-											options!.map(({ value, label }) =>
-												this.renderOption({
-													name,
-													value,
-													label,
-													form_id: fctx.form_id,
-													checked:
-														pickedValues.includes(
-															value
-														),
-												})
-											)
-										}`
-						  )
+										${options!.map(({ value, label }) =>
+											this.renderOption({
+												name,
+												value,
+												label,
+												form_id: fctx.form_id,
+												checked:
+													pickedValues.includes(
+														value
+													),
+											})
+										)}`
+							)
 						: ""}
 					${isVisible
 						? ungroupped.map(({ value, label }) =>
@@ -107,7 +103,7 @@ export class CheckboxedListInput<
 									form_id: fctx.form_id,
 									checked: pickedValues.includes(value),
 								})
-						  )
+							)
 						: ""}
 				</ul>`
 		);
@@ -126,7 +122,7 @@ export class CheckboxedListInput<
 		label?: string;
 		checked: boolean;
 	}) {
-		return tempstream/* HTML */ `<li>
+		return tempstream /* HTML */ `<li>
 			${inputWrapper(
 				"checkbox",
 				[name],

package/src/forms/controls/derived-frame.ts

@@ -25,15 +25,16 @@ export class DerivedFrame extends Derived<{
 	) {
 		super(
 			fields,
-			async (values, consts) => /* HTML */ `<turbo-frame
-				id="${consts.frame_id}"
-				src="./${consts.frame_id}?${Object.entries({
-					...consts,
-					...(values || {}),
-				})
-					.map(([key, value]) => `${key}=${value}`)
-					.join("&")}"
-			></turbo-frame>`,
+			async (values, consts) =>
+				/* HTML */ `<turbo-frame
+					id="${consts.frame_id}"
+					src="./${consts.frame_id}?${Object.entries({
+						...consts,
+						...(values || {}),
+					})
+						.map(([key, value]) => `${key}=${value}`)
+						.join("&")}"
+				></turbo-frame>`,
 			async (fctx) => ({
 				form_id: fctx.form_id,
 				field_name_prefix: fctx.field_name_prefix,
@@ -44,7 +45,7 @@ export class DerivedFrame extends Derived<{
 	}
 
 	renderBackendResponseFrame(_ctx: Context, content: FlatTemplatable) {
-		return tempstream/* HTML */ `<turbo-frame
+		return tempstream /* HTML */ `<turbo-frame
 			id="${this.frame_id}"
 			target="_top"
 		>

package/src/forms/controls/derived.ts

@@ -1,3 +1,4 @@
+/* eslint @typescript-eslint/no-redundant-type-constituents: off */
 import { randomUUID } from "crypto";
 import { FlatTemplatable, tempstream } from "tempstream";
 import { FormField } from "../fields/field.js";
@@ -5,7 +6,7 @@ import { FormDataValue } from "../form-types.js";
 import { FormControl, FormControlContext } from "./form-control.js";
 
 export class Derived<
-	Consts extends Record<string, unknown | undefined>
+	Consts extends Record<string, unknown | undefined>,
 > extends FormControl {
 	role = <const>"decoration";
 
@@ -17,7 +18,7 @@ export class Derived<
 		) => Promise<FlatTemplatable>,
 		public getConsts: (
 			fctx: FormControlContext
-		) => Promise<Consts> = async () => ({} as Consts)
+		) => Promise<Consts> = async () => ({}) as Consts
 	) {
 		super();
 	}
@@ -44,7 +45,7 @@ export class Derived<
 			`render(${values_code}, consts)
 .then(result=>document.querySelector("#${id}").innerHTML=result)`;
 
-		return tempstream/* HTML */ `<div>
+		return tempstream /* HTML */ `<div>
 			<script>
 				(function () {
 					const consts = ${"{" +
@@ -54,8 +55,8 @@ export class Derived<
 								typeof value === "object"
 									? JSON.stringify(value)
 									: typeof value == "string"
-									? '"' + value.toString() + '"'
-									: (value as string).toString()
+										? '"' + value.toString() + '"'
+										: (value as string).toString()
 							}`;
 						})
 						.join(",") +

package/src/forms/controls/dropdown.ts

@@ -46,7 +46,7 @@ export class FreeformDropdown extends SimpleInput {
 								((original.onchange as string | undefined) ||
 									"") + ";this.form.submit();",
 							],
-					  ]
+						]
 					: []),
 			]),
 		} as Record<string, string>;
@@ -62,17 +62,14 @@ export class FreeformDropdown extends SimpleInput {
 			data
 		);
 		return /* HTML */ tempstream`<select ${attributes_str}>
-			${
-				// eslint-disable-next-line @typescript-eslint/restrict-template-expressions
-				Promise.resolve(this.generateOptions(ctx)).then((options) =>
-					options.map(
-						({ value, label }) =>
-							`<option value="${attribute(value)}" ${
-								(value || "") == picked_value ? "selected" : ""
-							}>${label}</option>`
-					)
+			${Promise.resolve(this.generateOptions(ctx)).then((options) =>
+				options.map(
+					({ value, label }) =>
+						`<option value="${attribute(value)}" ${
+							(value || "") == picked_value ? "selected" : ""
+						}>${label}</option>`
 				)
-			}
+			)}
 		</select>`;
 	}
 }

package/src/forms/controls/editable-collection-subset.ts

@@ -1,3 +1,4 @@
+/* eslint @typescript-eslint/no-base-to-string: off */
 import { FlatTemplatable, tempstream } from "tempstream";
 import { attribute } from "../../sanitize.js";
 import { PickFromListField } from "../fields/pick-from-list.js";
@@ -27,7 +28,7 @@ export class EditableCollectionSubset extends FormFieldControl {
 			fctx.data.raw_values
 		);
 
-		return tempstream/* HTML */ `<div>
+		return tempstream /* HTML */ `<div>
 			<ul>
 				${Promise.resolve(this.field.generateOptions(fctx.ctx)).then(
 					(options) =>

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

@@ -41,7 +41,7 @@ export class FieldGroup extends FormFieldControl {
 	async render(fctx: FormControlContext): Promise<FlatTemplatable> {
 		const { label, classes } = this.options;
 
-		return tempstream/* HTML */ `
+		return tempstream /* HTML */ `
 			<div
 				class="field-group ${(classes || []).join(" ")}"
 				${this.options.containerID

package/src/forms/controls/file.test.ts

@@ -27,7 +27,7 @@ describe("file-control", () => {
 
 		it("doesn't require image input if it already has old-value", async () => {
 			const port = await getPort();
-			console.log(`Using port ${port} for image.test.ts`);
+			console.info(`Using port ${port} for image.test.ts`);
 			const app = new Koa();
 			const router = new Router();
 

package/src/forms/controls/file.ts

@@ -1,7 +1,4 @@
-/* eslint-disable @typescript-eslint/no-unsafe-assignment */
-/* eslint-disable @typescript-eslint/no-unsafe-argument */
-/* eslint-disable @typescript-eslint/no-unsafe-member-access */
-/* eslint-disable @typescript-eslint/no-unsafe-call */
+/* eslint @typescript-eslint/no-unsafe-assignment: off, @typescript-eslint/no-unsafe-argument: off, @typescript-eslint/no-unsafe-member-access: off, @typescript-eslint/no-unsafe-call: off */
 import { Context } from "koa";
 import { FilePointer, PathFilePointer } from "@sealcode/file-manager";
 import { FlatTemplatable, tempstream } from "tempstream";
@@ -27,7 +24,7 @@ export class File extends SimpleInput {
 		}
 		if (file instanceof PathFilePointer) {
 			const filename = await file.getOriginalFilename();
-			return tempstream/* HTML */ `<div class="${class_name}">
+			return tempstream /* HTML */ `<div class="${class_name}">
 				<div class="${class_name}__icon">
 					<picture>
 						<img
@@ -44,7 +41,7 @@ export class File extends SimpleInput {
 				</div>
 			</div>`;
 		}
-		return tempstream/* HTML */ `<div class="${class_name}">
+		return tempstream /* HTML */ `<div class="${class_name}">
 			${file.getOriginalFilename()}
 		</div>`;
 	}
@@ -57,7 +54,7 @@ export class File extends SimpleInput {
 		if (parsed === null) {
 			parsed = { old: null, new: null };
 		}
-		return tempstream/* HTML */ `${this.renderFilePreview(
+		return tempstream /* HTML */ `${this.renderFilePreview(
 				fctx.ctx,
 				parsed.old
 			)}

package/src/forms/controls/form-control.ts

@@ -26,6 +26,6 @@ export abstract class FormControl {
 	): FlatTemplatable | Promise<FlatTemplatable>;
 	abstract role: "input" | "decoration" | "messages" | "submit";
 
-	// eslint-disable-next-line @typescript-eslint/no-empty-function, @typescript-eslint/no-explicit-any
+	// eslint-disable-next-line @typescript-eslint/no-explicit-any
 	mount(_router: Router, _form: Form<any, any>) {}
 }

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

@@ -1,3 +1,4 @@
+/* eslint @typescript-eslint/no-base-to-string: off */
 import { FlatTemplatable, tempstream } from "tempstream";
 import { attribute } from "../../sanitize.js";
 import { FormField } from "../fields/field.js";

package/src/forms/controls/html.ts

@@ -12,6 +12,7 @@ export class HTML extends FormControl {
 	constructor(role: "decoration" | "submit", renderer: Renderer);
 	constructor(renderer: Renderer);
 	constructor(
+		// eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
 		role_or_renderer: "decoration" | "submit" | Renderer,
 		renderer_or_undefined?: Renderer | FlatTemplatable
 	) {

package/src/forms/controls/image.test.ts

@@ -27,7 +27,7 @@ describe("photo-control", () => {
 
 		it("sends the old photo if it wasn't changed and it has an initial value", async () => {
 			const port = await getPort();
-			console.log(`Using port ${port} for photo.test.ts`);
+			console.info(`Using port ${port} for photo.test.ts`);
 			const app = new Koa();
 			const router = new Router();
 
@@ -78,7 +78,7 @@ describe("photo-control", () => {
 
 		it("doesn't require image input if it already has old-value", async () => {
 			const port = await getPort();
-			console.log(`Using port ${port} for photo.test.ts`);
+			console.info(`Using port ${port} for photo.test.ts`);
 			const app = new Koa();
 			const router = new Router();
 

package/src/forms/controls/image.ts

@@ -28,7 +28,7 @@ export class Image extends File {
 		if (!file) {
 			return empty_container;
 		}
-		return tempstream/* HTML */ `<div class="${class_name}">
+		return tempstream /* HTML */ `<div class="${class_name}">
 			${ctx.$app.imageRouter.image(await file.getPath(), {
 				resolutions: [100, 200],
 				sizesAttr: "100px",

package/src/forms/controls/multiple-files.ts

@@ -105,7 +105,7 @@ export class MultipleFiles extends FormFieldControl {
 	}
 
 	renderFrame(_ctx: Context, content?: FlatTemplatable) {
-		return tempstream/* HTML */ `<turbo-frame
+		return tempstream /* HTML */ `<turbo-frame
 			${content ? "" : `src="./${this.getFrameRelativeURL()}"`}
 			id="${this.getFrameID()}"
 			target="_top"
@@ -168,7 +168,7 @@ export class MultipleFiles extends FormFieldControl {
 		if (!(file instanceof PathFilePointer)) {
 			return "";
 		}
-		return tempstream/* HTML */ `<li class="file-list-item">
+		return tempstream /* HTML */ `<li class="file-list-item">
 			<a
 				class="file-list-item__preview"
 				href="${file.getURL()}"
@@ -215,9 +215,7 @@ export class MultipleFiles extends FormFieldControl {
 	async renderFrameContent(ctx: Context): Promise<FlatTemplatable> {
 		const files = (
 			await Promise.all(
-				(
-					await this.getFileItems(ctx)
-				)
+				(await this.getFileItems(ctx))
 					.filter((item) => item) // filter out undefineds
 					.map(async (item: CollectionItem<Collection>) => [
 						item,
@@ -226,13 +224,13 @@ export class MultipleFiles extends FormFieldControl {
 			)
 		).filter(([_, f]) => f !== null) as [
 			CollectionItem<Collection>,
-			FilePointer
+			FilePointer,
 		][];
 
 		return inputWrapper(
 			"multiple-files",
 			["multiple-files", this.field.name, ...this.getClassModifiers()],
-			tempstream/* HTML */ `
+			tempstream /* HTML */ `
 				<label>${this.options.label || this.field.name}</label>
 				<ul class="multiple-files__list">
 					${files.map(([item, file]) =>

package/src/forms/controls/multiple-images.ts

@@ -33,7 +33,7 @@ export class MultipleImages extends MultipleFiles {
 		if (!path) {
 			return "missing file";
 		}
-		return tempstream/* HTML */ `<li>
+		return tempstream /* HTML */ `<li>
 			<a href="${file.getURL()}" data-turbo="false">
 				${this.imageRouter.image(path, {
 					resolutions: [150, 300],

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

@@ -22,10 +22,14 @@ export type SimpleInputOptions = {
 };
 
 export class SimpleInput<
-	Options extends SimpleInputOptions = SimpleInputOptions
+	Options extends SimpleInputOptions = SimpleInputOptions,
 > extends FormFieldControl {
 	options: SimpleInputOptions;
-	constructor(public field: FormField<boolean, any>, options?: Options) {
+	constructor(
+		// eslint-disable-next-line @typescript-eslint/no-explicit-any
+		public field: FormField<boolean, any>,
+		options?: Options
+	) {
 		super([field]);
 		this.options = options || {};
 	}
@@ -117,7 +121,7 @@ export class SimpleInput<
 		return inputWrapper(
 			"simple-input",
 			this.getWrapperModifiers(),
-			tempstream/* HTML */ `
+			tempstream /* HTML */ `
 				${label ? `<label for="${id}">${label}</label>` : ""}
 				${await this.preInput(fctx, fctx.data.raw_values)}
 				${this.renderInput(
@@ -131,7 +135,7 @@ export class SimpleInput<
 							message,
 							fctx.data.field_messages?.[this.field.name]
 								?.message,
-					  ]
+						]
 							.filter((e) => !!e)
 							.join(" · ")}</div>`
 					: ""}

package/src/forms/controls/single-reference.test.ts

@@ -39,7 +39,7 @@ describe("single-reference.test", () => {
 		const form_file_path = "src/back/routes/some-form.form.ts";
 		await test_app.addFile(
 			form_file_path,
-			await formTemplate("SomeForm", form_file_path, {
+			await formTemplate("SomeForm", {
 				postimport: `import {Comments} from "../collections/collections.js"; import {Fields} from "@sealcode/sealgen";`,
 				fields: `article: new Fields.CollectionField(true, Comments.fields.article),`,
 				controls: `new Controls.SingleReferenceDropdown(fields.article, {getLabel: item=>item.get("title")}),`,

package/src/forms/controls/single-reference.ts

@@ -6,7 +6,7 @@ import { Collection, CollectionItem } from "sealious";
 export class SingleReferenceDropdown<
 	TargetCollection extends Collection,
 	F extends SealiousFieldTypes.SingleReference,
-	Required extends boolean
+	Required extends boolean,
 > extends FreeformDropdown {
 	constructor(
 		public field: CollectionField<F, Required>,

package/src/forms/controls/table.ts

@@ -77,7 +77,7 @@ export class Table<F extends Record<string, FormField>> extends FormControl {
 							messages: [],
 							field_messages: {},
 						},
-				  }
+					}
 				: {};
 		};
 
@@ -92,25 +92,20 @@ export class Table<F extends Record<string, FormField>> extends FormControl {
 			row_index: number | string
 		) => {
 			return /* HTML */ tempstream`<tr>
-				 ${(
-						await Promise.all(
-							Object.entries(this.table_field.columns).map(
-								([column_name]) => {
-									const inner_fctx = get_row_fctx(
-										row,
-										row_index
-									);
-									return tempstream`<td>${this.options.subfield_controls[
-										column_name
-									].render({ ...fctx, ...inner_fctx })}</td>`;
-								}
+				 ${Promise.all(
+						Object.entries(this.table_field.columns)
+							.map(([column_name]) => {
+								const inner_fctx = get_row_fctx(row, row_index);
+								return tempstream`<td>${this.options.subfield_controls[
+									column_name
+								].render({ ...fctx, ...inner_fctx })}</td>`;
+							})
+							.map(async (html) =>
+								(await html).replaceAll(
+									TABLE_COLUMN_FIELD_INDEX_PLACEHOLDER,
+									row_index.toString()
+								)
 							)
-						)
-					).map((html) =>
-						html.replaceAll(
-							TABLE_COLUMN_FIELD_INDEX_PLACEHOLDER,
-							row_index.toString()
-						)
 					)}
 				 ${
 						this.options.allow_removing
@@ -138,13 +133,13 @@ export class Table<F extends Record<string, FormField>> extends FormControl {
 											)}"
 										/>
 									</noscript>
-							  </td>`
+								</td>`
 							: ""
 					}
 			 </tr>`;
 		};
 
-		return tempstream/* HTML */ `<turbo-frame
+		return tempstream /* HTML */ `<turbo-frame
 			id="${this.getFrameID()}"
 			class="${[
 				"form-input__wrapper",