@aurelia-mdc-web/layout-grid
Version:
Wrapper for Material Components Web Layout Grid
64 lines • 3.09 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.MdcLayoutGrid = void 0;
var tslib_1 = require("tslib");
var aurelia_framework_1 = require("aurelia-framework");
var aurelia_typed_observable_plugin_1 = require("aurelia-typed-observable-plugin");
/**
* @selector mdc-layout-grid
*/
var MdcLayoutGrid = /** @class */ (function () {
function MdcLayoutGrid(root) {
this.root = root;
}
MdcLayoutGrid.prototype.desktopColumnWidthChanged = function () {
this.root.style.setProperty('--mdc-layout-grid-column-width-desktop', "".concat(this.desktopColumnWidth, "px"));
};
MdcLayoutGrid.prototype.tabletColumnWidthChanged = function () {
this.root.style.setProperty('--mdc-layout-grid-column-width-tablet', "".concat(this.tabletColumnWidth, "px"));
};
MdcLayoutGrid.prototype.phoneColumnWidthChanged = function () {
this.root.style.setProperty('--mdc-layout-grid-column-width-phone', "".concat(this.phoneColumnWidth, "px"));
};
MdcLayoutGrid.prototype.columnWidthsChanged = function () {
var _a;
_a = tslib_1.__read(this.columnWidths.split(' '), 3), this.phoneColumnWidth = _a[0], this.tabletColumnWidth = _a[1], this.desktopColumnWidth = _a[2];
};
tslib_1.__decorate([
aurelia_typed_observable_plugin_1.bindable.none,
tslib_1.__metadata("design:type", String)
], MdcLayoutGrid.prototype, "position", void 0);
tslib_1.__decorate([
aurelia_typed_observable_plugin_1.bindable.booleanAttr,
tslib_1.__metadata("design:type", Boolean)
], MdcLayoutGrid.prototype, "fixedColumnWidth", void 0);
tslib_1.__decorate([
aurelia_typed_observable_plugin_1.bindable.booleanAttr,
tslib_1.__metadata("design:type", Boolean)
], MdcLayoutGrid.prototype, "noPadding", void 0);
tslib_1.__decorate([
aurelia_typed_observable_plugin_1.bindable.number,
tslib_1.__metadata("design:type", String)
], MdcLayoutGrid.prototype, "desktopColumnWidth", void 0);
tslib_1.__decorate([
aurelia_typed_observable_plugin_1.bindable.number,
tslib_1.__metadata("design:type", String)
], MdcLayoutGrid.prototype, "tabletColumnWidth", void 0);
tslib_1.__decorate([
aurelia_typed_observable_plugin_1.bindable.number,
tslib_1.__metadata("design:type", String)
], MdcLayoutGrid.prototype, "phoneColumnWidth", void 0);
tslib_1.__decorate([
aurelia_typed_observable_plugin_1.bindable.number,
tslib_1.__metadata("design:type", String)
], MdcLayoutGrid.prototype, "columnWidths", void 0);
MdcLayoutGrid = tslib_1.__decorate([
(0, aurelia_framework_1.inject)(Element),
(0, aurelia_framework_1.useView)(aurelia_framework_1.PLATFORM.moduleName('./mdc-layout-grid.html')),
(0, aurelia_framework_1.customElement)('mdc-layout-grid'),
tslib_1.__metadata("design:paramtypes", [HTMLElement])
], MdcLayoutGrid);
return MdcLayoutGrid;
}());
exports.MdcLayoutGrid = MdcLayoutGrid;
//# sourceMappingURL=mdc-layout-grid.js.map