"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const core_1 = require("../react_monad/core");
const primitives_1 = require("../react_monad/primitives");
const html_1 = require("../react_monad/html");
const combinators_1 = require("../react_monad/combinators");
const list_1 = require("../react_monad/list");
let perform = function (s, op) {
    return op.kind == "add" ? Object.assign({}, s, { items: s.items.push(op.value) }) : op.kind == "remove" ? Object.assign({}, s, { items: s.items.remove(op.index), selected_index: s.selected_index == op.index ? undefined : op.index > s.selected_index ? s.selected_index : s.selected_index - 1 }) : Object.assign({}, s, { selected_index: op.selected ? op.index : s.selected_index == op.index ? undefined : s.selected_index });
};
exports.editable_list = function (list_name, initial_items, create_new_form) {
    return initial_items.then(list_name, items => combinators_1.repeat(`monadic-list ${list_name}`)(html_1.form(`monadic-list-form`)(combinators_1.any()([
        s => list_1.list(s.items, undefined, `monadic-list-items`)(i => n => combinators_1.any(`item_${n}`, `monadic-list-item`)([
            html_1.div(`monadic-list-cell`)(_ => html_1.label("")(primitives_1.bool("edit", "radio", "radio-bool"))(s.selected_index == i).then(undefined, selected => core_1.unit({ kind: "toggle", value: n, index: i, selected: selected }).filter(_ => selected != (s.selected_index == i)))),
            html_1.div(`monadic-list-cell`)(op => primitives_1.string("view")(`This is item ${n}, with index ${i}`).filter(_ => false).ignore_with(op)),
            html_1.div(`monadic-list-cell monadic-list-lastcell`)(_ => html_1.button(`X`)({ kind: "remove", value: n, index: i }))
        ])(undefined)).then(`inner list`, op => core_1.unit(perform(s, op))),
        s => create_new_form(s).then(`monadic-new-list-item`, new_value => core_1.unit(perform(s, { kind: "add", value: new_value })))
    ])))({ items: items, selected_index: undefined }));
};
//# sourceMappingURL=editable_list.js.map