import { FlatTemplatable } from "tempstream";
import { FormControl } from "./form-control.js";

/**
 * This class will render `turbo-frame` tag so that u can
 * embed other route inside your form. This will require
 * to add value to `data: FormData` (inside your master form
 * render function) with key `Frame.FRAME_PATH_KEY`. Value
 * needs to be url to route that you want to embed. If you
 * this value wont be provided frame will redner empty string.
 * See `src/back/routes/profile/[id].form.ts` for an example.
 */
export class Frame extends FormControl {
	constructor(public src: string) {
		super();
	}

	render(): FlatTemplatable | Promise<FlatTemplatable> {
		return /* HTML */ `<turbo-frame
			id="contrahents"
			loading="lazy"
			src="${this.src}"
		></turbo-frame>`;
	}
	role = <const>"decoration";
}