var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
var __generator = (this && this.__generator) || function (thisArg, body) {
    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
    function verb(n) { return function (v) { return step([n, v]); }; }
    function step(op) {
        if (f) throw new TypeError("Generator is already executing.");
        while (_) try {
            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
            if (y = 0, t) op = [op[0] & 2, t.value];
            switch (op[0]) {
                case 0: case 1: t = op; break;
                case 4: _.label++; return { value: op[1], done: false };
                case 5: _.label++; y = op[1]; op = [0]; continue;
                case 7: op = _.ops.pop(); _.trys.pop(); continue;
                default:
                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
                    if (t[2]) _.ops.pop();
                    _.trys.pop(); continue;
            }
            op = body.call(thisArg, _);
        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
    }
};
import { r as registerInstance, c as createEvent, h, H as Host } from './chunk-7400f9fd.js';
/**
 * A simple time field component with an integrated timepicker and custom validation capability.
 * Basic usage : <materials-time-field value="12:00"></materials-time-field>
 */
var TimeField = /** @class */ (function () {
    function TimeField(hostRef) {
        registerInstance(this, hostRef);
        /** Display a timepicker when clicking on the time-field */
        this.timepicker = true;
        /** The timepicker options interval (in minutes) */
        this.timepickerStep = 15;
        /** The timepicker format */
        this.timepickerFormat = '24h';
        this.input = createEvent(this, "input", 7);
    }
    /** Return the time-field current value validity */
    TimeField.prototype.isValid = function () {
        return __awaiter(this, void 0, void 0, function () {
            return __generator(this, function (_a) {
                switch (_a.label) {
                    case 0: return [4 /*yield*/, this.materialsTextFieldEl.isValid()];
                    case 1: return [2 /*return*/, _a.sent()];
                }
            });
        });
    };
    /** Force the validation of thid time field (native validation + custom validation) */
    TimeField.prototype.forceValidation = function () {
        return __awaiter(this, void 0, void 0, function () {
            return __generator(this, function (_a) {
                this.materialsTextFieldEl.forceValidation();
                return [2 /*return*/];
            });
        });
    };
    TimeField.prototype.componentWillLoad = function () {
        if (this.outlined && this.fullwidth) {
            console.warn('[materials-date-field] You should not use fullwidth and outlined together');
        }
    };
    TimeField.prototype.updateValue = function () {
        if (this.materialsTextFieldEl) {
            this.materialsTextFieldEl.value = this.value;
        }
    };
    TimeField.prototype.renderTimePicker = function () {
        var _this = this;
        if (!this.timepicker)
            return;
        return h("materials-menu", { maxHeight: 200, noPadding: true, ref: function (el) { return _this.materialsMenuTimepickerEl = el; } }, h("materials-timepicker", { timeSelected: this.value, clock24: this.timepickerFormat === '24h', step: this.timepickerStep, onTimeSelectedChange: function (ev) {
                _this.value = ev.detail;
                _this.input.emit(); // pour déclencher la validation en fonction de onInput
                if (_this.materialsMenuTimepickerEl)
                    _this.materialsMenuTimepickerEl.close();
            }, onClick: function (ev) { return ev.stopPropagation(); } }));
    };
    TimeField.prototype.openPicker = function (ev) {
        return __awaiter(this, void 0, void 0, function () {
            var timepicker, scrollableContainer, selectedItem;
            return __generator(this, function (_a) {
                switch (_a.label) {
                    case 0:
                        if (this.disabled) {
                            return [2 /*return*/];
                        }
                        if (!this.timepicker) return [3 /*break*/, 2];
                        ev.stopPropagation();
                        ev.preventDefault();
                        if (!this.materialsMenuTimepickerEl) return [3 /*break*/, 2];
                        return [4 /*yield*/, this.materialsMenuTimepickerEl.open()];
                    case 1:
                        _a.sent();
                        timepicker = this.materialsMenuTimepickerEl.querySelector('materials-timepicker');
                        scrollableContainer = this.materialsMenuTimepickerEl.shadowRoot.querySelector('.mdc-menu');
                        selectedItem = timepicker.shadowRoot.querySelector('materials-list-item[selected]');
                        // positione l'élément au milieu de la liste deroulante.
                        if (timepicker && scrollableContainer && selectedItem)
                            scrollableContainer.scrollTop = selectedItem.offsetTop - 60;
                        _a.label = 2;
                    case 2: return [2 /*return*/];
                }
            });
        });
    };
    TimeField.prototype.render = function () {
        var _this = this;
        return (h(Host, { class: { 'materials-time-field--dense': this.dense } }, h("materials-text-field", { class: "timepicker-with-value", type: "time", value: this.value, label: this.label, fullwidth: this.fullwidth, dense: this.dense, outlined: this.outlined, focused: this.focused, disabled: this.disabled, leadingIcon: this.leadingIcon, required: this.required, width: this.width, helperText: this.helperText, persistent: this.persistent, hideNativeClear: true, customValidation: this.customValidation, ref: function (el) { return _this.materialsTextFieldEl = el; }, onInput: function (ev) {
                ev.stopPropagation();
                _this.input.emit(ev.detail);
            }, onClick: function (ev) { return _this.openPicker(ev); } }), this.renderTimePicker()));
    };
    Object.defineProperty(TimeField, "watchers", {
        get: function () {
            return {
                "value": ["updateValue"]
            };
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(TimeField, "style", {
        get: function () { return ":host{display:-ms-flexbox;display:flex}.date-picker{padding:16px}"; },
        enumerable: true,
        configurable: true
    });
    return TimeField;
}());
export { TimeField as materials_time_field };
