import { h } from "@stencil/core";
/**
 * @private
 */
export class InfoTileAdminConfig {
    constructor() {
        this.getOptionValue = (option) => option.value || undefined;
        this.handleChangeOptions = (property, getValue = (value) => value) => (event) => {
            event.stopPropagation();
            this.change.emit(Object.assign(Object.assign({}, this.value), { options: Object.assign(Object.assign({}, this.value.options), { [property]: getValue(event.detail) || undefined }) }));
        };
    }
    render() {
        return [this.renderStyle(), this.renderNumeric()];
    }
    renderStyle() {
        const options = [
            {
                value: 'long',
                text: 'Long',
            },
            {
                value: 'narrow',
                text: 'Narrow',
            },
            {
                value: 'short',
                text: 'Short',
            },
        ];
        const value = options.find((o) => { var _a; return o.value && o.value === ((_a = this.value.options) === null || _a === void 0 ? void 0 : _a.style); });
        return (h("limel-select", { label: "Style", helperText: "The style of the formatted relative time", options: options, value: value, onChange: this.handleChangeOptions('style', this.getOptionValue) }));
    }
    renderNumeric() {
        const options = [
            {
                value: 'always',
                text: 'Always',
                secondaryText: 'E.g. "in 1 day"',
            },
            {
                value: 'auto',
                text: 'Auto',
                secondaryText: 'E.g. "tomorrow"',
            },
        ];
        const value = options.find((o) => { var _a; return o.value && o.value === ((_a = this.value.options) === null || _a === void 0 ? void 0 : _a.numeric); });
        return (h("limel-select", { label: "Numeric", helperText: "Whether to use numeric values in the output", options: options, value: value, onChange: this.handleChangeOptions('numeric', this.getOptionValue) }));
    }
    static get is() { return "limebb-info-tile-relative-date-format"; }
    static get encapsulation() { return "shadow"; }
    static get properties() {
        return {
            "value": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "RelativeDateTimeFormat",
                    "resolved": "{ type: \"relative-date\"; options?: Partial<RelativeTimeFormatOptions> | undefined; }",
                    "references": {
                        "RelativeDateTimeFormat": {
                            "location": "import",
                            "path": "..",
                            "id": "src/components/info-tile/format/index.ts::RelativeDateTimeFormat",
                            "referenceLocation": "RelativeDateTimeFormat"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The value of the current property"
                },
                "getter": false,
                "setter": false
            }
        };
    }
    static get events() {
        return [{
                "method": "change",
                "name": "change",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "The event to emit when the value of the current property has changed"
                },
                "complexType": {
                    "original": "RelativeDateTimeFormat",
                    "resolved": "{ type: \"relative-date\"; options?: Partial<RelativeTimeFormatOptions> | undefined; }",
                    "references": {
                        "RelativeDateTimeFormat": {
                            "location": "import",
                            "path": "..",
                            "id": "src/components/info-tile/format/index.ts::RelativeDateTimeFormat",
                            "referenceLocation": "RelativeDateTimeFormat"
                        }
                    }
                }
            }];
    }
}
