@sealcode/sealgen 0.12.0 → 0.12.3

package/lib/forms/controls/collapsible-checkbox-group.js

@@ -1,13 +0,0 @@
-import { CheckboxGroup } from "./checkbox-group.js";
-import { CollapsibleFieldGroup } from "./collapsible-field-group.js";
-export class CollapsibleCheckboxGroup extends CheckboxGroup {
-    wrapGroup(fctx, checkboxes) {
-        return new CollapsibleFieldGroup(checkboxes, {
-            label: this.options.label,
-            textWhenOpen: this.options.textWhenOpen,
-            textWhenClosed: this.options.textWhenClosed,
-            groupID: this.options.groupID,
-        }).render(fctx);
-    }
-}
-//# sourceMappingURL=collapsible-checkbox-group.js.map

package/lib/forms/controls/collapsible-field-group.js

@@ -1,78 +0,0 @@
-import { FieldGroup } from "./field-group.js";
-import { randomUUID } from "crypto";
-export class CollapsibleFieldGroup extends FieldGroup {
-    constructor(controls, options = {}) {
-        super([]);
-        this.controls = controls;
-        this.options = options;
-        if (this.options.groupID == undefined) {
-            this.options.groupID = "A" + randomUUID(); // "A" is needed as ids always have to start with a letter
-        }
-        this.collapseID = this.options.groupID + "collapse";
-    }
-    getGroupLabelProps() {
-        return super.getGroupLabelProps() + ` for="${this.collapseID}"`;
-    }
-    preLabelContainer() {
-        return /* HTML */ `<style>
-				input#${this.collapseID} {
-					display: none;
-				}
-
-				input#${this.collapseID} ~ .field-group__fields {
-					display: none;
-				}
-
-				input#${this.collapseID}:checked ~ .field-group__fields {
-					display: block;
-				}
-
-				input#${this.collapseID}
-					~ .field-group__label-container
-					.field-group__collapse-label-text--open {
-					display: none;
-				}
-
-				input#${this.collapseID}:checked
-					~ .field-group__label-container
-					.field-group__collapse-label-text--open {
-					display: inline-block;
-				}
-
-				input#${this.collapseID}
-					~ .field-group__label-container
-					.field-group__collapse-label-text--closed {
-					display: inline-block;
-				}
-
-				input#${this.collapseID}:checked
-					~ .field-group__label-container
-					.field-group__collapse-label-text--closed {
-					display: none;
-				}
-			</style>
-			<input
-				type="checkbox"
-				id="${this.collapseID}"
-				${this.options.openOnStart ? "checked" : ""}
-			/>`;
-    }
-    postLabel() {
-        return /* HTML */ `<label
-			class="field-group__collapse-label"
-			for="${this.collapseID}"
-		>
-			<span
-				class="field-group__collapse-label-text field-group__collapse-label-text--open"
-			>
-				${this.options.textWhenOpen || "close"}
-			</span>
-			<span
-				class="field-group__collapse-label-text field-group__collapse-label-text--closed"
-			>
-				${this.options.textWhenClosed || "open"}
-			</span>
-		</label>`;
-    }
-}
-//# sourceMappingURL=collapsible-field-group.js.map

package/lib/forms/controls/controls.js

@@ -1,31 +0,0 @@
-export { FormControl } from "./form-control.js";
-export { FormFieldControl } from "./form-field-control.js";
-export { EditableCollectionSubset } from "./editable-collection-subset.js";
-export { Frame } from "./frame.js";
-export { CheckboxedListInput } from "./checkboxed-list-input.js";
-export * from "./dropdown.js";
-export { SimpleInput } from "./simple-input.js";
-export { FormHeader } from "./form-header.js";
-export { FormParagraph } from "./form-paragraph.js";
-export { HTML } from "./html.js";
-export { HiddenInput } from "./hidden-input.js";
-export { Textarea } from "./textarea.js";
-export { FieldGroup } from "./field-group.js";
-export * from "./derived.js";
-export * from "./derived-frame.js";
-export * from "./tickable.js";
-export * from "./checkbox.js";
-export * from "./radio.js";
-export * from "./big-radio-group.js";
-export * from "./checkbox-group.js";
-export * from "./collapsible-field-group.js";
-export * from "./collapsible-checkbox-group.js";
-export * from "./autocomplete.js";
-export * from "./file.js";
-export * from "./photo.js";
-export * from "./multiple-files.js";
-export * from "./number.js";
-export * from "./multiple-photos.js";
-// export * from "./reverse-single-reference";
-export * from "./array.js";
-//# sourceMappingURL=controls.js.map

package/lib/forms/controls/derived-frame.js

@@ -1,52 +0,0 @@
-import { hasShape, predicates } from "@sealcode/ts-predicates";
-import { tempstream } from "tempstream";
-import { makeSlug } from "../../utils/make-slug.js";
-import { Derived } from "./derived.js";
-import { FormControlContext } from "./form-control.js";
-export class DerivedFrame extends Derived {
-    constructor(frame_name, fields, generateFrameContent, 
-    // "a" is to make it a valid DOM id
-    frame_id = "a" + makeSlug(frame_name)) {
-        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 (fctx) => ({
-            form_id: fctx.form_id,
-            field_name_prefix: fctx.field_name_prefix,
-            frame_id,
-            validate: fctx.validate,
-        }));
-        this.frame_name = frame_name;
-        this.generateFrameContent = generateFrameContent;
-        this.frame_id = frame_id;
-    }
-    renderBackendResponseFrame(_ctx, content) {
-        return tempstream /* HTML */ `<turbo-frame
-			id="${this.frame_id}"
-			target="_top"
-		>
-			${content || ""}
-		</turbo-frame>`;
-    }
-    mount(router) {
-        router.get(this.frame_id, async (ctx) => {
-            const query = ctx.query;
-            if (!hasShape({
-                field_name_prefix: predicates.string,
-                form_id: predicates.string,
-                validate: predicates.string,
-            }, query)) {
-                ctx.body = this.renderBackendResponseFrame(ctx, "Missing query params");
-                return;
-            }
-            ctx.body = this.renderBackendResponseFrame(ctx, await this.generateFrameContent(new FormControlContext(ctx, ctx.query, [], query.field_name_prefix, query.form_id, query.validate === "true" ? true : false), ctx.query));
-        });
-        return;
-    }
-}
-//# sourceMappingURL=derived-frame.js.map

package/lib/forms/controls/derived.js

@@ -1,77 +0,0 @@
-import { randomUUID } from "crypto";
-import { tempstream } from "tempstream";
-import { FormControl } from "./form-control.js";
-export class Derived extends FormControl {
-    constructor(fields, _render, getConsts = async () => ({})) {
-        super();
-        this.fields = fields;
-        this._render = _render;
-        this.getConsts = getConsts;
-        this.role = "decoration";
-    }
-    async getBackendValues(fctx) {
-        const fieldnames = this.fields.map((f) => f.name);
-        const result = Object.fromEntries(Object.entries(fctx.data).filter(([key]) => fieldnames.includes(key)));
-        return result;
-    }
-    async render(fctx) {
-        // the A makes it always a valid id, as it cannot start with a number
-        const id = "A" + randomUUID();
-        const consts = this.getConsts(fctx);
-        const frontend_side_refresh_code = (values_code = "getValues()") => `render(${values_code}, consts)
-.then(result=>document.querySelector("#${id}").innerHTML=result)`;
-        return tempstream /* HTML */ `<div>
-			<script>
-				(function () {
-					const consts = ${"{" +
-            Object.entries((await consts) || {})
-                .map(([key, value]) => {
-                return `"${key}": ${typeof value === "object"
-                    ? JSON.stringify(value)
-                    : typeof value == "string"
-                        ? '"' + value.toString() + '"'
-                        : value.toString()}`;
-            })
-                .join(",") +
-            "}"};
-					const form_container =
-						document.currentScript.closest(".form-container");
-					const render = ${this._render.toString()};
-					function getValues() {
-						return Object.fromEntries(
-							${JSON.stringify(this.fields.map((field) => field.name))}.map((field_name) => {
-								let input = form_container.querySelector(
-									\`input[name="\${field_name}"]\`
-								);
-								if (!input) {
-									return [field_name, ""];
-								}
-								if (input.type === "radio") {
-									input = form_container.querySelector(
-										\`input[name="\${field_name}"]:checked\`
-									);
-								}
-								return [field_name, input.value];
-							})
-						);
-					}
-					function setupWatcher(field_name) {
-						form_container
-							.querySelectorAll(\`input[name="\${field_name}"]\`)
-							.forEach((input) => {
-								input.addEventListener("change", () => {
-									${frontend_side_refresh_code()};
-								});
-							});
-					}
-					${JSON.stringify(this.fields.map((field) => field.name))}.forEach(setupWatcher);
-					setTimeout(() => {
-						${frontend_side_refresh_code(JSON.stringify(await this.getBackendValues(fctx)))};
-					}, 0);
-				})();
-			</script>
-			<div id="${id}">${this._render({}, await consts)}</div>
-		</div>`;
-    }
-}
-//# sourceMappingURL=derived.js.map

package/lib/forms/controls/dropdown.js

@@ -1,55 +0,0 @@
-import { tempstream } from "tempstream";
-import { attribute } from "../../sanitize.js";
-import { SimpleInput } from "./simple-input.js";
-export class FreeformDropdown extends SimpleInput {
-    constructor(field, _generateOptions, options = {
-        label: field.name,
-        autosubmit: false,
-        autocomplete: true,
-    }) {
-        super(field, options);
-        this.field = field;
-        this._generateOptions = _generateOptions;
-        this.options = options;
-    }
-    async generateOptions(ctx) {
-        return this._generateOptions(ctx);
-    }
-    async getInputAttributes(fctx) {
-        const original = await super.getInputAttributes(fctx);
-        return {
-            ...original,
-            ...Object.fromEntries([
-                ...(this.options.autosubmit
-                    ? [
-                        [
-                            "onchange",
-                            (original.onchange || "") +
-                                ";this.form.submit();",
-                        ],
-                    ]
-                    : []),
-            ]),
-        };
-    }
-    async renderInput(ctx, attributes_str, data) {
-        const { parsed: picked_value } = await this.field.getValue(ctx, 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>`))}
-		</select>`;
-    }
-}
-export class Dropdown extends FreeformDropdown {
-    constructor(field, options = {
-        label: field.name,
-        autosubmit: false,
-        autocomplete: true,
-    }) {
-        super(field, (ctx) => field.generateOptions(ctx), options);
-        this.field = field;
-        this.options = options;
-    }
-}
-//# sourceMappingURL=dropdown.js.map

package/lib/forms/controls/editable-collection-subset.js

@@ -1,68 +0,0 @@
-import { tempstream } from "tempstream";
-import { attribute } from "../../sanitize.js";
-import { FormFieldControl } from "./controls.js";
-/**
- * This control has own forms in it so if you want to use it you
- * probably shouldn't use `await super.render(ctx, data, path)` in
- * render method of you from implementation and you should write
- * your own implementation of this method. See forms that uses
- * this control for reference.
- */
-export class EditableCollectionSubset extends FormFieldControl {
-    constructor(field, actionname, listLabel, selectLabel) {
-        super([field]);
-        this.field = field;
-        this.actionname = actionname;
-        this.listLabel = listLabel;
-        this.selectLabel = selectLabel;
-        this.role = "input";
-    }
-    async render(fctx) {
-        const { parsed: values } = await this.field.getValue(fctx.ctx, fctx.data);
-        return tempstream /* HTML */ `<div>
-			<ul>
-				${Promise.resolve(this.field.generateOptions(fctx.ctx)).then((options) => Object.entries(options)
-            .filter(([value]) => (values || []).includes(value))
-            .map(([value, text]) => /* HTML */ `
-									<li>
-										<form
-											method="POST"
-											action="${fctx.ctx.path}"
-										>
-											<span>${text}</span>
-											<input
-												type="hidden"
-												name="${this.field.name}"
-												value="${attribute(value)}"
-											/>
-											<input
-												type="hidden"
-												name="${this.actionname}"
-												value="list"
-											/>
-											<input
-												type="submit"
-												${this.listLabel
-            ? `value="${this.listLabel}"`
-            : ""}
-											/>
-										</form>
-									</li>
-								`))}
-			</ul>
-			<form method="POST" action="${fctx.ctx.path}">
-				<select name="${this.field.name}">
-					${Promise.resolve(this.field.generateOptions(fctx.ctx)).then((options) => Object.entries(options)
-            .filter(([value]) => !(values || []).includes(value))
-            .map(([value, text]) => `<option value="${attribute(value)}">${text}</option>`))}
-				</select>
-				<input type="hidden" name="${this.actionname}" value="select" />
-				<input
-					type="submit"
-					${this.selectLabel ? `value="${this.selectLabel}"` : ""}
-				/>
-			</form>
-		</div>`;
-    }
-}
-//# sourceMappingURL=editable-collection-subset.js.map

package/lib/forms/controls/field-group.js

@@ -1,53 +0,0 @@
-import { tempstream } from "tempstream";
-import { FormFieldControl } from "./form-field-control.js";
-export class FieldGroup extends FormFieldControl {
-    constructor(controls, options = {}) {
-        super([]);
-        this.controls = controls;
-        this.options = options;
-    }
-    preLabel() {
-        return "";
-    }
-    preLabelContainer() {
-        return "";
-    }
-    postLabel() {
-        return "";
-    }
-    preFields() {
-        return "";
-    }
-    postFields() {
-        return "";
-    }
-    getGroupLabelProps() {
-        return `class="field-group__label"`;
-    }
-    async render(fctx) {
-        const { label, classes } = this.options;
-        return tempstream /* HTML */ `
-			<div
-				class="field-group ${(classes || []).join(" ")}"
-				${this.options.containerID
-            ? `id="${this.options.containerID}"`
-            : ""}
-			>
-				${this.preLabelContainer()}
-				<div class="field-group__label-container">
-					${this.preLabel()}
-					${label
-            ? `<label ${this.getGroupLabelProps()}>${label}</label>`
-            : ""}
-					${this.postLabel()}
-				</div>
-				${this.preFields()}
-				<div class="field-group__fields">
-					${this.controls.map((control) => control.render(fctx))}
-				</div>
-				${this.postFields()}
-			</div>
-		`;
-    }
-}
-//# sourceMappingURL=field-group.js.map

package/lib/forms/controls/file.js

@@ -1,35 +0,0 @@
-import { tempstream } from "tempstream";
-import { SimpleInput } from "./simple-input.js";
-export class File extends SimpleInput {
-    getType() {
-        return "file";
-    }
-    async renderFilePreview(_ctx, file_data) {
-        return file_data?.filename || "";
-    }
-    async preInput(ctx, data) {
-        const { parsed } = await this.field.getValue(ctx, data);
-        return tempstream /* HTML */ `${this.renderFilePreview(ctx, parsed.old)}
-			<input
-				type="hidden"
-				name="${this.field.name}[old][id]"
-				value="${parsed.old?.id || ""}"
-			/>
-			<input
-				type="hidden"
-				name="${this.field.name}[old][filename]"
-				value="${parsed.old?.filename || ""}"
-			/>`;
-    }
-    async getInputAttributes(fctx) {
-        const original = await super.getInputAttributes(fctx);
-        const { parsed } = await this.field.getValue(fctx.ctx, fctx.data);
-        return {
-            ...original,
-            name: this.field.name + "[new]",
-            required: original.required && !parsed.old,
-            value: false,
-        };
-    }
-}
-//# sourceMappingURL=file.js.map

package/lib/forms/controls/form-control.js

@@ -1,14 +0,0 @@
-export class FormControlContext {
-    constructor(ctx, data, messages, field_name_prefix, form_id, validate) {
-        this.ctx = ctx;
-        this.data = data;
-        this.messages = messages;
-        this.field_name_prefix = field_name_prefix;
-        this.form_id = form_id;
-        this.validate = validate;
-    }
-}
-export class FormControl {
-    mount(router) { }
-}
-//# sourceMappingURL=form-control.js.map

package/lib/forms/controls/form-field-control.js

@@ -1,9 +0,0 @@
-import { FormControl } from "./form-control.js";
-export class FormFieldControl extends FormControl {
-    constructor(fields) {
-        super();
-        this.fields = fields;
-        this.role = "input";
-    }
-}
-//# sourceMappingURL=form-field-control.js.map

package/lib/forms/controls/form-header.js

@@ -1,14 +0,0 @@
-import { FormControl } from "./controls.js";
-export class FormHeader extends FormControl {
-    constructor(text, isVisible = async () => true) {
-        super();
-        this.text = text;
-        this.isVisible = isVisible;
-        this.role = "decoration";
-    }
-    async render(fctx) {
-        const isVsbl = await this.isVisible(fctx);
-        return isVsbl ? `<h2>${this.text}</h2>` : "";
-    }
-}
-//# sourceMappingURL=form-header.js.map

package/lib/forms/controls/form-paragraph.js

@@ -1,12 +0,0 @@
-import { FormControl } from "./controls.js";
-export class FormParagraph extends FormControl {
-    constructor(text) {
-        super();
-        this.text = text;
-        this.role = "decoration";
-    }
-    render() {
-        return `<p>${this.text}</p>`;
-    }
-}
-//# sourceMappingURL=form-paragraph.js.map

package/lib/forms/controls/frame.js

@@ -1,25 +0,0 @@
-import { FormControl } from "./controls.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(src) {
-        super();
-        this.src = src;
-        this.role = "decoration";
-    }
-    render() {
-        return /* HTML */ `<turbo-frame
-			id="contrahents"
-			loading="lazy"
-			src="${this.src}"
-		></turbo-frame>`;
-    }
-}
-//# sourceMappingURL=frame.js.map

package/lib/forms/controls/hidden-input.js

@@ -1,14 +0,0 @@
-import { tempstream } from "tempstream";
-import { attribute } from "../../sanitize.js";
-import { FormFieldControl } from "./form-field-control.js";
-export class HiddenInput extends FormFieldControl {
-    constructor(field) {
-        super([field]);
-        this.field = field;
-    }
-    async render(fctx) {
-        const { raw } = await this.field.getValue(fctx.ctx, fctx.data);
-        return tempstream `<input type="hidden" name="${this.field.name}" value="${attribute((raw || "").toString())}" form="${fctx.form_id}">`;
-    }
-}
-//# sourceMappingURL=hidden-input.js.map

package/lib/forms/controls/html.js

@@ -1,23 +0,0 @@
-import { FormControl } from "./controls.js";
-export class HTML extends FormControl {
-    constructor(role_or_renderer, renderer_or_undefined) {
-        super();
-        this.role = "decoration";
-        if (arguments.length == 2) {
-            this.role = role_or_renderer;
-            this.renderer = renderer_or_undefined;
-        }
-        else {
-            this.renderer = role_or_renderer;
-        }
-    }
-    async render(fctx) {
-        if (typeof this.renderer === "string") {
-            return this.renderer;
-        }
-        return typeof this.renderer == "function"
-            ? this.renderer(fctx)
-            : this.renderer;
-    }
-}
-//# sourceMappingURL=html.js.map