import { __decorate } from "tslib";
import { customElement, css, display, html, ref, attribute } from "@hpcc-js/wc-core";
import { SplitPanel, Widget } from "@lumino/widgets";
import { HPCCLuminoElement } from "./common";
import { splitpanel, widget } from "./styles";
const template = html `\
<div ${ref("_div")}>
</div>
<slot ${ref("_slot")}></slot>`;
const styles = css `
${display("inline-block")} 

${widget}
${splitpanel}

.hpcc-LuminoAdapter {
    padding: 8px;
    border: 1px solid #c0c0c0;
}`;
let HPCCSplitPanelElement = class HPCCSplitPanelElement extends HPCCLuminoElement {
    constructor() {
        super();
        /**
         * The orientation of the splitter
         *
         * @typeParam horizontal - Horizontal orientation
         * @typeParam vertical - Vertical orientation
         *
         * @defaultValue "horizontal"
         */
        this.orientation = "horizontal";
        /**
         * The spacing between the panels in the splitter
         *
         * @defaultValue 4
         */
        this.spacing = 4;
    }
    createPanel() {
        this._splitPanel = new SplitPanel({ orientation: this.orientation, spacing: this.spacing });
    }
    addWidget(w, e, _ref) {
        this._splitPanel.addWidget(w);
        if (e.dataset.border_width !== undefined) {
            w.node.style.borderWidth = `${e.dataset.border_width}px`;
        }
        if (e.dataset.padding !== undefined) {
            w.node.style.padding = `${e.dataset.padding}px`;
        }
    }
    enter() {
        super.enter();
        Widget.attach(this._splitPanel, this._div);
    }
    update(changes) {
        super.update(changes);
        this._splitPanel.orientation = this.orientation;
        this._splitPanel.spacing = this.spacing;
        this._splitPanel.node.style.width = `${this.clientWidth}px`;
        this._splitPanel.node.style.height = `${this.clientHeight}px`;
        this._splitPanel.update();
    }
    exit() {
        Widget.detach(this._splitPanel);
        super.exit();
    }
};
__decorate([
    attribute
], HPCCSplitPanelElement.prototype, "orientation", void 0);
__decorate([
    attribute({ type: "number" })
], HPCCSplitPanelElement.prototype, "spacing", void 0);
HPCCSplitPanelElement = __decorate([
    customElement("hpcc-splitpanel", { template, styles })
], HPCCSplitPanelElement);
export { HPCCSplitPanelElement };
//# sourceMappingURL=splitPanel.js.map