import { FormTemplate, Constructor } from "../lib/component/formTemplate"
import { Popupable } from "../lib/trait/popupable"
import { Input } from "./form/input"
import { Tags } from "./form/tags"
import { Items } from "./form/items"
import { Boolean } from "./form/boolean"

export type Constructor<T> = Constructor<T>
export const Form = new FormTemplate({
    "input": Input,
    "tags": Tags,
    "items": Items,
    "boolean": Boolean,
})
export class PopupEditor<T> extends R.PopupEditor {
    getValue: () => T
    setValue: (T) => void
    private callback: Sybil2.Callback
    asPopup: Popupable = new Popupable(this)
    edit(value: Partial<T>, callback: Sybil2.Callback<T>) {
        this.callback = callback
        this.setValue(value || {})
        this.asPopup.show()
        this.asPopup.center()
    }
    onClickCancel() {
        this.asPopup.hide()
        this.callback(new Error("Abort"))
    }
    onClickOk() {
        let value = this.getValue()
        this.asPopup.hide()
        this.callback(null, value)
    }
}



export type Partial<T> = {
    [K in keyof T]?: T[K]
}