@aurelia-mdc-web/form-field/dist/commonjs/mdc-form-field.js

Wrapper for Material Components Web Form Field

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.MdcFormField = void 0;
var tslib_1 = require("tslib");
var aurelia_framework_1 = require("aurelia-framework");
var form_field_1 = require("@material/form-field");
var aurelia_typed_observable_plugin_1 = require("aurelia-typed-observable-plugin");
var base_1 = require("@aurelia-mdc-web/base");
/**
 * @selector mdc-form-field
 */
var MdcFormField = /** @class */ (function (_super) {
    tslib_1.__extends(MdcFormField, _super);
    function MdcFormField() {
        var _this = _super.apply(this, tslib_1.__spreadArray([], tslib_1.__read(arguments), false)) || this;
        _this.cssClasses = form_field_1.cssClasses;
        return _this;
    }
    // eslint-disable-next-line @typescript-eslint/require-await
    MdcFormField.prototype.initialise = function () {
        return tslib_1.__awaiter(this, void 0, void 0, function () {
            var rippleUpgraded, input;
            return tslib_1.__generator(this, function (_a) {
                rippleUpgraded = this.root.querySelector('mdc-checkbox');
                if (!rippleUpgraded) {
                    rippleUpgraded = this.root.querySelector('mdc-radio');
                }
                this.ripple = rippleUpgraded === null || rippleUpgraded === void 0 ? void 0 : rippleUpgraded.au['mdc-ripple'].viewModel;
                input = this.root.querySelector('input, button');
                if (input === null || input === void 0 ? void 0 : input.hasAttribute('id')) {
                    this.label = this.root.querySelector('label');
                    if (this.label) {
                        this.label.setAttribute('for', input.getAttribute('id'));
                    }
                }
                return [2 /*return*/];
            });
        });
    };
    MdcFormField.prototype.getDefaultFoundation = function () {
        var _this = this;
        // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
        // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
        var adapter = {
            activateInputRipple: function () { var _a; return (_a = _this.ripple) === null || _a === void 0 ? void 0 : _a.activate(); },
            deactivateInputRipple: function () { var _a; return (_a = _this.ripple) === null || _a === void 0 ? void 0 : _a.deactivate(); },
            deregisterInteractionHandler: function (evtType, handler) { var _a; return (_a = _this.label) === null || _a === void 0 ? void 0 : _a.removeEventListener(evtType, handler); },
            registerInteractionHandler: function (evtType, handler) { var _a; return (_a = _this.label) === null || _a === void 0 ? void 0 : _a.addEventListener(evtType, handler); },
        };
        return new form_field_1.MDCFormFieldFoundation(adapter);
    };
    tslib_1.__decorate([
        aurelia_typed_observable_plugin_1.bindable.booleanAttr,
        tslib_1.__metadata("design:type", Boolean)
    ], MdcFormField.prototype, "nowrap", void 0);
    tslib_1.__decorate([
        aurelia_typed_observable_plugin_1.bindable.booleanAttr,
        tslib_1.__metadata("design:type", Boolean)
    ], MdcFormField.prototype, "alignEnd", void 0);
    tslib_1.__decorate([
        aurelia_typed_observable_plugin_1.bindable.booleanAttr,
        tslib_1.__metadata("design:type", Boolean)
    ], MdcFormField.prototype, "spaceBetween", void 0);
    MdcFormField = tslib_1.__decorate([
        (0, aurelia_framework_1.inject)(Element),
        (0, aurelia_framework_1.useView)(aurelia_framework_1.PLATFORM.moduleName('./mdc-form-field.html')),
        (0, aurelia_framework_1.customElement)(form_field_1.cssClasses.ROOT)
    ], MdcFormField);
    return MdcFormField;
}(base_1.MdcComponent));
exports.MdcFormField = MdcFormField;
//# sourceMappingURL=mdc-form-field.js.map