@ng-matero/extensions 15.2.1 → 15.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/_index.scss +2 -2
- package/_theming.scss +2 -2
- package/alert/alert.d.ts +1 -1
- package/checkbox-group/checkbox-group.d.ts +6 -6
- package/colorpicker/colorpicker-input.d.ts +1 -1
- package/colorpicker/colorpicker.d.ts +2 -2
- package/core/theming/_all-theme.scss +2 -2
- package/datetimepicker/clock.d.ts +1 -1
- package/datetimepicker/datetimepicker-types.d.ts +3 -3
- package/datetimepicker/datetimepicker.d.ts +3 -3
- package/drawer/drawer-config.d.ts +2 -2
- package/esm2020/alert/alert-module.mjs +4 -4
- package/esm2020/alert/alert.mjs +14 -14
- package/esm2020/button/button-loading.mjs +11 -11
- package/esm2020/button/button-module.mjs +4 -4
- package/esm2020/checkbox-group/checkbox-group-module.mjs +4 -4
- package/esm2020/checkbox-group/checkbox-group.mjs +27 -29
- package/esm2020/colorpicker/colorpicker-input.mjs +26 -26
- package/esm2020/colorpicker/colorpicker-module.mjs +4 -4
- package/esm2020/colorpicker/colorpicker-toggle.mjs +13 -13
- package/esm2020/colorpicker/colorpicker.mjs +37 -37
- package/esm2020/column-resize/column-resize-directives/column-resize-flex.mjs +3 -3
- package/esm2020/column-resize/column-resize-directives/column-resize.mjs +3 -3
- package/esm2020/column-resize/column-resize-module.mjs +4 -4
- package/esm2020/column-resize/column-resize-notifier.mjs +6 -6
- package/esm2020/column-resize/column-resize.mjs +3 -3
- package/esm2020/column-resize/column-size-store.mjs +3 -3
- package/esm2020/column-resize/event-dispatcher.mjs +3 -3
- package/esm2020/column-resize/overlay-handle.mjs +3 -3
- package/esm2020/column-resize/resizable.mjs +3 -3
- package/esm2020/column-resize/resize-strategy.mjs +9 -9
- package/esm2020/core/datetime/datetime.module.mjs +8 -8
- package/esm2020/core/datetime/native-datetime-adapter.mjs +3 -3
- package/esm2020/core/pipes/is-template-ref.pipe.mjs +3 -3
- package/esm2020/core/pipes/pipes.module.mjs +4 -4
- package/esm2020/core/pipes/to-observable.pipe.mjs +3 -3
- package/esm2020/datetimepicker/calendar-body.mjs +3 -3
- package/esm2020/datetimepicker/calendar.mjs +18 -18
- package/esm2020/datetimepicker/clock.mjs +3 -3
- package/esm2020/datetimepicker/datetimepicker-input.mjs +4 -4
- package/esm2020/datetimepicker/datetimepicker-intl.mjs +3 -3
- package/esm2020/datetimepicker/datetimepicker-module.mjs +4 -4
- package/esm2020/datetimepicker/datetimepicker-toggle.mjs +14 -14
- package/esm2020/datetimepicker/datetimepicker.mjs +46 -46
- package/esm2020/datetimepicker/month-view.mjs +3 -3
- package/esm2020/datetimepicker/multi-year-view.mjs +3 -3
- package/esm2020/datetimepicker/time.mjs +48 -48
- package/esm2020/datetimepicker/year-view.mjs +3 -3
- package/esm2020/dialog/dialog-container.mjs +3 -3
- package/esm2020/dialog/dialog-module.mjs +4 -4
- package/esm2020/dialog/dialog.mjs +3 -3
- package/esm2020/drawer/drawer-container.mjs +27 -27
- package/esm2020/drawer/drawer-module.mjs +4 -4
- package/esm2020/drawer/drawer.mjs +11 -11
- package/esm2020/grid/cell.mjs +10 -9
- package/esm2020/grid/column-menu.mjs +3 -3
- package/esm2020/grid/column-resize/column-resize-directives/column-resize-flex.mjs +3 -3
- package/esm2020/grid/column-resize/column-resize-directives/column-resize.mjs +3 -3
- package/esm2020/grid/column-resize/column-resize-module.mjs +8 -8
- package/esm2020/grid/column-resize/overlay-handle.mjs +3 -3
- package/esm2020/grid/column-resize/resizable-directives/resizable.mjs +13 -13
- package/esm2020/grid/column-resize/resize-strategy.mjs +3 -3
- package/esm2020/grid/expansion-toggle.mjs +9 -9
- package/esm2020/grid/grid-module.mjs +4 -4
- package/esm2020/grid/grid-pipes.mjs +17 -17
- package/esm2020/grid/grid-utils.mjs +3 -3
- package/esm2020/grid/grid.mjs +77 -63
- package/esm2020/grid/interfaces.mjs +1 -1
- package/esm2020/loader/loader-module.mjs +4 -4
- package/esm2020/loader/loader.mjs +18 -18
- package/esm2020/popover/popover-content.mjs +6 -6
- package/esm2020/popover/popover-module.mjs +4 -4
- package/esm2020/popover/popover-target.mjs +3 -3
- package/esm2020/popover/popover-trigger.mjs +20 -20
- package/esm2020/popover/popover.mjs +43 -43
- package/esm2020/progress/progress-module.mjs +4 -4
- package/esm2020/progress/progress.mjs +3 -3
- package/esm2020/select/option.mjs +9 -9
- package/esm2020/select/select-module.mjs +4 -4
- package/esm2020/select/select.mjs +92 -79
- package/esm2020/select/templates.mjs +33 -33
- package/esm2020/slider/slider-module.mjs +4 -4
- package/esm2020/slider/slider.mjs +147 -147
- package/esm2020/split/interfaces.mjs +1 -1
- package/esm2020/split/split-module.mjs +4 -4
- package/esm2020/split/split-pane.mjs +23 -23
- package/esm2020/split/split.mjs +65 -50
- package/esm2020/tooltip/tooltip-module.mjs +4 -4
- package/esm2020/tooltip/tooltip.mjs +70 -70
- package/fesm2015/mtxAlert.mjs +17 -17
- package/fesm2015/mtxAlert.mjs.map +1 -1
- package/fesm2015/mtxButton.mjs +14 -14
- package/fesm2015/mtxButton.mjs.map +1 -1
- package/fesm2015/mtxCheckboxGroup.mjs +28 -30
- package/fesm2015/mtxCheckboxGroup.mjs.map +1 -1
- package/fesm2015/mtxColorpicker.mjs +77 -77
- package/fesm2015/mtxColorpicker.mjs.map +1 -1
- package/fesm2015/mtxColumnResize.mjs +40 -40
- package/fesm2015/mtxCore.mjs +21 -21
- package/fesm2015/mtxDatetimepicker.mjs +147 -147
- package/fesm2015/mtxDatetimepicker.mjs.map +1 -1
- package/fesm2015/mtxDialog.mjs +10 -10
- package/fesm2015/mtxDrawer.mjs +40 -40
- package/fesm2015/mtxDrawer.mjs.map +1 -1
- package/fesm2015/mtxGrid.mjs +155 -137
- package/fesm2015/mtxGrid.mjs.map +1 -1
- package/fesm2015/mtxLoader.mjs +21 -21
- package/fesm2015/mtxLoader.mjs.map +1 -1
- package/fesm2015/mtxPopover.mjs +75 -75
- package/fesm2015/mtxPopover.mjs.map +1 -1
- package/fesm2015/mtxProgress.mjs +7 -7
- package/fesm2015/mtxSelect.mjs +139 -125
- package/fesm2015/mtxSelect.mjs.map +1 -1
- package/fesm2015/mtxSlider.mjs +150 -150
- package/fesm2015/mtxSlider.mjs.map +1 -1
- package/fesm2015/mtxSplit.mjs +94 -76
- package/fesm2015/mtxSplit.mjs.map +1 -1
- package/fesm2015/mtxTooltip.mjs +73 -73
- package/fesm2015/mtxTooltip.mjs.map +1 -1
- package/fesm2020/mtxAlert.mjs +17 -17
- package/fesm2020/mtxAlert.mjs.map +1 -1
- package/fesm2020/mtxButton.mjs +14 -14
- package/fesm2020/mtxButton.mjs.map +1 -1
- package/fesm2020/mtxCheckboxGroup.mjs +28 -30
- package/fesm2020/mtxCheckboxGroup.mjs.map +1 -1
- package/fesm2020/mtxColorpicker.mjs +77 -77
- package/fesm2020/mtxColorpicker.mjs.map +1 -1
- package/fesm2020/mtxColumnResize.mjs +40 -40
- package/fesm2020/mtxCore.mjs +21 -21
- package/fesm2020/mtxDatetimepicker.mjs +147 -147
- package/fesm2020/mtxDatetimepicker.mjs.map +1 -1
- package/fesm2020/mtxDialog.mjs +10 -10
- package/fesm2020/mtxDrawer.mjs +40 -40
- package/fesm2020/mtxDrawer.mjs.map +1 -1
- package/fesm2020/mtxGrid.mjs +152 -137
- package/fesm2020/mtxGrid.mjs.map +1 -1
- package/fesm2020/mtxLoader.mjs +21 -21
- package/fesm2020/mtxLoader.mjs.map +1 -1
- package/fesm2020/mtxPopover.mjs +74 -74
- package/fesm2020/mtxPopover.mjs.map +1 -1
- package/fesm2020/mtxProgress.mjs +7 -7
- package/fesm2020/mtxSelect.mjs +136 -123
- package/fesm2020/mtxSelect.mjs.map +1 -1
- package/fesm2020/mtxSlider.mjs +150 -150
- package/fesm2020/mtxSlider.mjs.map +1 -1
- package/fesm2020/mtxSplit.mjs +91 -76
- package/fesm2020/mtxSplit.mjs.map +1 -1
- package/fesm2020/mtxTooltip.mjs +73 -73
- package/fesm2020/mtxTooltip.mjs.map +1 -1
- package/grid/cell.d.ts +1 -0
- package/grid/cell.scss +1 -1
- package/grid/column-menu.d.ts +1 -1
- package/grid/grid-pipes.d.ts +1 -1
- package/grid/grid.d.ts +8 -5
- package/grid/interfaces.d.ts +63 -15
- package/loader/loader.d.ts +1 -1
- package/package.json +2 -2
- package/popover/popover-types.d.ts +5 -5
- package/progress/progress.d.ts +1 -1
- package/select/select.d.ts +34 -14
- package/split/interfaces.d.ts +13 -1
- package/split/split.d.ts +7 -4
- package/tooltip/tooltip.d.ts +3 -3
package/fesm2015/mtxSplit.mjs
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { EventEmitter, Component, ViewEncapsulation, ChangeDetectionStrategy, Input, Output, ViewChildren, Directive, NgModule } from '@angular/core';
|
|
2
|
+
import { InjectionToken, EventEmitter, Component, ViewEncapsulation, ChangeDetectionStrategy, Optional, Inject, Input, Output, ViewChildren, Directive, NgModule } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import { mixinColor } from '@angular/material/core';
|
|
6
|
-
import {
|
|
6
|
+
import { Observable, Subject } from 'rxjs';
|
|
7
7
|
import { debounceTime } from 'rxjs/operators';
|
|
8
8
|
|
|
9
9
|
function getPointFromEvent(event) {
|
|
@@ -228,6 +228,8 @@ function updateAreaSize(unit, item) {
|
|
|
228
228
|
}
|
|
229
229
|
}
|
|
230
230
|
|
|
231
|
+
/** Injection token that can be used to specify default split options. */
|
|
232
|
+
const MTX_SPLIT_DEFAULT_OPTIONS = new InjectionToken('mtx-split-default-options');
|
|
231
233
|
// Boilerplate for applying mixins to _MtxSplitBase.
|
|
232
234
|
/** @docs-private */
|
|
233
235
|
const _MtxSplitBase = mixinColor(class {
|
|
@@ -265,48 +267,6 @@ const _MtxSplitBase = mixinColor(class {
|
|
|
265
267
|
*
|
|
266
268
|
*/
|
|
267
269
|
class MtxSplit extends _MtxSplitBase {
|
|
268
|
-
constructor(ngZone, elRef, cdRef, renderer) {
|
|
269
|
-
super(elRef);
|
|
270
|
-
this.ngZone = ngZone;
|
|
271
|
-
this.elRef = elRef;
|
|
272
|
-
this.cdRef = cdRef;
|
|
273
|
-
this.renderer = renderer;
|
|
274
|
-
this._direction = 'horizontal';
|
|
275
|
-
////
|
|
276
|
-
this._unit = 'percent';
|
|
277
|
-
////
|
|
278
|
-
this._gutterSize = 4;
|
|
279
|
-
////
|
|
280
|
-
this._gutterStep = 1;
|
|
281
|
-
////
|
|
282
|
-
this._restrictMove = false;
|
|
283
|
-
////
|
|
284
|
-
this._useTransition = false;
|
|
285
|
-
////
|
|
286
|
-
this._disabled = false;
|
|
287
|
-
////
|
|
288
|
-
this._dir = 'ltr';
|
|
289
|
-
////
|
|
290
|
-
this._gutterDblClickDuration = 0;
|
|
291
|
-
////
|
|
292
|
-
this.dragStart = new EventEmitter(false);
|
|
293
|
-
this.dragEnd = new EventEmitter(false);
|
|
294
|
-
this.gutterClick = new EventEmitter(false);
|
|
295
|
-
this.gutterDblClick = new EventEmitter(false);
|
|
296
|
-
this.dragProgressSubject = new Subject();
|
|
297
|
-
this.dragProgress$ = this.dragProgressSubject.asObservable();
|
|
298
|
-
////
|
|
299
|
-
this.isDragging = false;
|
|
300
|
-
this.dragListeners = [];
|
|
301
|
-
this.snapshot = null;
|
|
302
|
-
this.startPoint = null;
|
|
303
|
-
this.endPoint = null;
|
|
304
|
-
this.displayedAreas = [];
|
|
305
|
-
this.hidedAreas = [];
|
|
306
|
-
this._clickTimeout = null;
|
|
307
|
-
// To force adding default class, could be override by user @Input() or not
|
|
308
|
-
this.direction = this._direction;
|
|
309
|
-
}
|
|
310
270
|
set direction(v) {
|
|
311
271
|
this._direction = v === 'vertical' ? 'vertical' : 'horizontal';
|
|
312
272
|
this.renderer.addClass(this.elRef.nativeElement, `mtx-split-${this._direction}`);
|
|
@@ -384,6 +344,57 @@ class MtxSplit extends _MtxSplitBase {
|
|
|
384
344
|
get transitionEnd() {
|
|
385
345
|
return new Observable(subscriber => (this.transitionEndSubscriber = subscriber)).pipe(debounceTime(20));
|
|
386
346
|
}
|
|
347
|
+
constructor(ngZone, elRef, cdRef, renderer, _defaultOptions) {
|
|
348
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
349
|
+
super(elRef);
|
|
350
|
+
this.ngZone = ngZone;
|
|
351
|
+
this.elRef = elRef;
|
|
352
|
+
this.cdRef = cdRef;
|
|
353
|
+
this.renderer = renderer;
|
|
354
|
+
this._defaultOptions = _defaultOptions;
|
|
355
|
+
this._direction = 'horizontal';
|
|
356
|
+
////
|
|
357
|
+
this._unit = 'percent';
|
|
358
|
+
////
|
|
359
|
+
this._gutterSize = 4;
|
|
360
|
+
////
|
|
361
|
+
this._gutterStep = 1;
|
|
362
|
+
////
|
|
363
|
+
this._restrictMove = false;
|
|
364
|
+
////
|
|
365
|
+
this._useTransition = false;
|
|
366
|
+
////
|
|
367
|
+
this._disabled = false;
|
|
368
|
+
////
|
|
369
|
+
this._dir = 'ltr';
|
|
370
|
+
////
|
|
371
|
+
this._gutterDblClickDuration = 0;
|
|
372
|
+
////
|
|
373
|
+
this.dragStart = new EventEmitter(false);
|
|
374
|
+
this.dragEnd = new EventEmitter(false);
|
|
375
|
+
this.gutterClick = new EventEmitter(false);
|
|
376
|
+
this.gutterDblClick = new EventEmitter(false);
|
|
377
|
+
this.dragProgressSubject = new Subject();
|
|
378
|
+
this.dragProgress$ = this.dragProgressSubject.asObservable();
|
|
379
|
+
////
|
|
380
|
+
this.isDragging = false;
|
|
381
|
+
this.dragListeners = [];
|
|
382
|
+
this.snapshot = null;
|
|
383
|
+
this.startPoint = null;
|
|
384
|
+
this.endPoint = null;
|
|
385
|
+
this.displayedAreas = [];
|
|
386
|
+
this.hidedAreas = [];
|
|
387
|
+
this._clickTimeout = null;
|
|
388
|
+
this.color = (_a = _defaultOptions === null || _defaultOptions === void 0 ? void 0 : _defaultOptions.color) !== null && _a !== void 0 ? _a : 'primary';
|
|
389
|
+
this.direction = (_b = _defaultOptions === null || _defaultOptions === void 0 ? void 0 : _defaultOptions.direction) !== null && _b !== void 0 ? _b : 'horizontal';
|
|
390
|
+
this.dir = (_c = _defaultOptions === null || _defaultOptions === void 0 ? void 0 : _defaultOptions.dir) !== null && _c !== void 0 ? _c : 'ltr';
|
|
391
|
+
this.unit = (_d = _defaultOptions === null || _defaultOptions === void 0 ? void 0 : _defaultOptions.unit) !== null && _d !== void 0 ? _d : 'percent';
|
|
392
|
+
this.gutterDblClickDuration = (_e = _defaultOptions === null || _defaultOptions === void 0 ? void 0 : _defaultOptions.gutterDblClickDuration) !== null && _e !== void 0 ? _e : 0;
|
|
393
|
+
this.gutterSize = (_f = _defaultOptions === null || _defaultOptions === void 0 ? void 0 : _defaultOptions.gutterSize) !== null && _f !== void 0 ? _f : 4;
|
|
394
|
+
this.gutterStep = (_g = _defaultOptions === null || _defaultOptions === void 0 ? void 0 : _defaultOptions.gutterStep) !== null && _g !== void 0 ? _g : 1;
|
|
395
|
+
this.restrictMove = (_h = _defaultOptions === null || _defaultOptions === void 0 ? void 0 : _defaultOptions.restrictMove) !== null && _h !== void 0 ? _h : false;
|
|
396
|
+
this.useTransition = (_j = _defaultOptions === null || _defaultOptions === void 0 ? void 0 : _defaultOptions.useTransition) !== null && _j !== void 0 ? _j : false;
|
|
397
|
+
}
|
|
387
398
|
ngAfterViewInit() {
|
|
388
399
|
this.ngZone.runOutsideAngular(() => {
|
|
389
400
|
// To avoid transition at first rendering
|
|
@@ -685,7 +696,7 @@ class MtxSplit extends _MtxSplitBase {
|
|
|
685
696
|
let offset = this.direction === 'horizontal'
|
|
686
697
|
? this.startPoint.x - this.endPoint.x
|
|
687
698
|
: this.startPoint.y - this.endPoint.y;
|
|
688
|
-
if (this.dir === 'rtl') {
|
|
699
|
+
if (this.dir === 'rtl' && this.direction === 'horizontal') {
|
|
689
700
|
offset = -offset;
|
|
690
701
|
}
|
|
691
702
|
const steppedOffset = Math.round(offset / this.gutterStep) * this.gutterStep;
|
|
@@ -800,14 +811,21 @@ class MtxSplit extends _MtxSplitBase {
|
|
|
800
811
|
this.stopDragging();
|
|
801
812
|
}
|
|
802
813
|
}
|
|
803
|
-
/** @nocollapse */ MtxSplit.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
804
|
-
/** @nocollapse */ MtxSplit.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
|
|
805
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
814
|
+
/** @nocollapse */ MtxSplit.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxSplit, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: MTX_SPLIT_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
815
|
+
/** @nocollapse */ MtxSplit.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: MtxSplit, selector: "mtx-split", inputs: { color: "color", direction: "direction", unit: "unit", gutterSize: "gutterSize", gutterStep: "gutterStep", restrictMove: "restrictMove", useTransition: "useTransition", disabled: "disabled", dir: "dir", gutterDblClickDuration: "gutterDblClickDuration" }, outputs: { dragStart: "dragStart", dragEnd: "dragEnd", gutterClick: "gutterClick", gutterDblClick: "gutterDblClick", transitionEnd: "transitionEnd" }, host: { classAttribute: "mtx-split" }, viewQueries: [{ propertyName: "gutterEls", predicate: ["gutterEls"], descendants: true }], exportAs: ["mtxSplit"], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\r\n<ng-template ngFor [ngForOf]=\"displayedAreas\" let-index=\"index\" let-last=\"last\">\r\n <div #gutterEls class=\"mtx-split-gutter\" [ngClass]=\"['mat-' + color]\"\r\n *ngIf=\"last === false\"\r\n [style.flex-basis.px]=\"gutterSize\"\r\n [style.order]=\"index * 2 + 1\"\r\n (mousedown)=\"startDragging($event, index * 2 + 1, index + 1)\"\r\n (touchstart)=\"startDragging($event, index * 2 + 1, index + 1)\"\r\n (mouseup)=\"clickGutter($event, index + 1)\"\r\n (touchend)=\"clickGutter($event, index + 1)\">\r\n <div class=\"mtx-split-gutter-handle\"></div>\r\n </div>\r\n</ng-template>\r\n", styles: [".mtx-split{display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:stretch;overflow:hidden;width:100%;height:100%}.mtx-split>.mtx-split-gutter{position:relative;display:flex;flex-grow:0;flex-shrink:0;align-items:center;justify-content:center}.mtx-split>.mtx-split-gutter>.mtx-split-gutter-handle{position:absolute;opacity:0}.mtx-split>.mtx-split-pane{flex-grow:0;flex-shrink:0;overflow-x:hidden;overflow-y:auto}.mtx-split>.mtx-split-pane.mtx-split-pane-hidden{flex:0 1 0!important;overflow-x:hidden;overflow-y:hidden}.mtx-split.mtx-split-horizontal{flex-direction:row}.mtx-split.mtx-split-horizontal>.mtx-split-gutter{flex-direction:row;height:100%;cursor:col-resize}.mtx-split.mtx-split-horizontal>.mtx-split-gutter>.mtx-split-gutter-handle{width:8px;height:100%;left:-2px;right:2px}.mtx-split.mtx-split-horizontal>.mtx-split-pane{height:100%}.mtx-split.mtx-split-vertical{flex-direction:column}.mtx-split.mtx-split-vertical>.mtx-split-gutter{flex-direction:column;width:100%;cursor:row-resize}.mtx-split.mtx-split-vertical>.mtx-split-gutter>.mtx-split-gutter-handle{width:100%;height:8px;top:-2px;bottom:2px}.mtx-split.mtx-split-vertical>.mtx-split-pane{width:100%}.mtx-split.mtx-split-vertical>.mtx-split-pane.mtx-split-pane-hidden{max-width:0}.mtx-split.mtx-split-disabled>.mtx-split-gutter{cursor:default}.mtx-split.mtx-split-disabled>.mtx-split-gutter .mtx-split-gutter-handle{background-image:none}.mtx-split.mtx-split-transition.mtx-split-init:not(.mtx-dragging)>.mtx-split-gutter,.mtx-split.mtx-split-transition.mtx-split-init:not(.mtx-dragging)>.mtx-split-pane{transition:flex-basis .3s}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
816
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxSplit, decorators: [{
|
|
806
817
|
type: Component,
|
|
807
818
|
args: [{ selector: 'mtx-split', exportAs: 'mtxSplit', host: {
|
|
808
819
|
class: 'mtx-split',
|
|
809
820
|
}, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, inputs: ['color'], template: "<ng-content></ng-content>\r\n<ng-template ngFor [ngForOf]=\"displayedAreas\" let-index=\"index\" let-last=\"last\">\r\n <div #gutterEls class=\"mtx-split-gutter\" [ngClass]=\"['mat-' + color]\"\r\n *ngIf=\"last === false\"\r\n [style.flex-basis.px]=\"gutterSize\"\r\n [style.order]=\"index * 2 + 1\"\r\n (mousedown)=\"startDragging($event, index * 2 + 1, index + 1)\"\r\n (touchstart)=\"startDragging($event, index * 2 + 1, index + 1)\"\r\n (mouseup)=\"clickGutter($event, index + 1)\"\r\n (touchend)=\"clickGutter($event, index + 1)\">\r\n <div class=\"mtx-split-gutter-handle\"></div>\r\n </div>\r\n</ng-template>\r\n", styles: [".mtx-split{display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:stretch;overflow:hidden;width:100%;height:100%}.mtx-split>.mtx-split-gutter{position:relative;display:flex;flex-grow:0;flex-shrink:0;align-items:center;justify-content:center}.mtx-split>.mtx-split-gutter>.mtx-split-gutter-handle{position:absolute;opacity:0}.mtx-split>.mtx-split-pane{flex-grow:0;flex-shrink:0;overflow-x:hidden;overflow-y:auto}.mtx-split>.mtx-split-pane.mtx-split-pane-hidden{flex:0 1 0!important;overflow-x:hidden;overflow-y:hidden}.mtx-split.mtx-split-horizontal{flex-direction:row}.mtx-split.mtx-split-horizontal>.mtx-split-gutter{flex-direction:row;height:100%;cursor:col-resize}.mtx-split.mtx-split-horizontal>.mtx-split-gutter>.mtx-split-gutter-handle{width:8px;height:100%;left:-2px;right:2px}.mtx-split.mtx-split-horizontal>.mtx-split-pane{height:100%}.mtx-split.mtx-split-vertical{flex-direction:column}.mtx-split.mtx-split-vertical>.mtx-split-gutter{flex-direction:column;width:100%;cursor:row-resize}.mtx-split.mtx-split-vertical>.mtx-split-gutter>.mtx-split-gutter-handle{width:100%;height:8px;top:-2px;bottom:2px}.mtx-split.mtx-split-vertical>.mtx-split-pane{width:100%}.mtx-split.mtx-split-vertical>.mtx-split-pane.mtx-split-pane-hidden{max-width:0}.mtx-split.mtx-split-disabled>.mtx-split-gutter{cursor:default}.mtx-split.mtx-split-disabled>.mtx-split-gutter .mtx-split-gutter-handle{background-image:none}.mtx-split.mtx-split-transition.mtx-split-init:not(.mtx-dragging)>.mtx-split-gutter,.mtx-split.mtx-split-transition.mtx-split-init:not(.mtx-dragging)>.mtx-split-pane{transition:flex-basis .3s}\n"] }]
|
|
810
|
-
}], ctorParameters: function () {
|
|
821
|
+
}], ctorParameters: function () {
|
|
822
|
+
return [{ type: i0.NgZone }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: undefined, decorators: [{
|
|
823
|
+
type: Optional
|
|
824
|
+
}, {
|
|
825
|
+
type: Inject,
|
|
826
|
+
args: [MTX_SPLIT_DEFAULT_OPTIONS]
|
|
827
|
+
}] }];
|
|
828
|
+
}, propDecorators: { direction: [{
|
|
811
829
|
type: Input
|
|
812
830
|
}], unit: [{
|
|
813
831
|
type: Input
|
|
@@ -841,25 +859,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImpor
|
|
|
841
859
|
}] } });
|
|
842
860
|
|
|
843
861
|
class MtxSplitPane {
|
|
844
|
-
constructor(ngZone, elRef, renderer, split) {
|
|
845
|
-
this.ngZone = ngZone;
|
|
846
|
-
this.elRef = elRef;
|
|
847
|
-
this.renderer = renderer;
|
|
848
|
-
this.split = split;
|
|
849
|
-
this._order = null;
|
|
850
|
-
////
|
|
851
|
-
this._size = null;
|
|
852
|
-
////
|
|
853
|
-
this._minSize = null;
|
|
854
|
-
////
|
|
855
|
-
this._maxSize = null;
|
|
856
|
-
////
|
|
857
|
-
this._lockSize = false;
|
|
858
|
-
////
|
|
859
|
-
this._visible = true;
|
|
860
|
-
this.lockListeners = [];
|
|
861
|
-
this.renderer.addClass(this.elRef.nativeElement, 'mtx-split-pane');
|
|
862
|
-
}
|
|
863
862
|
set order(v) {
|
|
864
863
|
this._order = getInputPositiveNumber(v, null);
|
|
865
864
|
this.split.updateArea(this, true, false);
|
|
@@ -909,6 +908,25 @@ class MtxSplitPane {
|
|
|
909
908
|
get visible() {
|
|
910
909
|
return this._visible;
|
|
911
910
|
}
|
|
911
|
+
constructor(ngZone, elRef, renderer, split) {
|
|
912
|
+
this.ngZone = ngZone;
|
|
913
|
+
this.elRef = elRef;
|
|
914
|
+
this.renderer = renderer;
|
|
915
|
+
this.split = split;
|
|
916
|
+
this._order = null;
|
|
917
|
+
////
|
|
918
|
+
this._size = null;
|
|
919
|
+
////
|
|
920
|
+
this._minSize = null;
|
|
921
|
+
////
|
|
922
|
+
this._maxSize = null;
|
|
923
|
+
////
|
|
924
|
+
this._lockSize = false;
|
|
925
|
+
////
|
|
926
|
+
this._visible = true;
|
|
927
|
+
this.lockListeners = [];
|
|
928
|
+
this.renderer.addClass(this.elRef.nativeElement, 'mtx-split-pane');
|
|
929
|
+
}
|
|
912
930
|
ngOnInit() {
|
|
913
931
|
this.split.addArea(this);
|
|
914
932
|
this.ngZone.runOutsideAngular(() => {
|
|
@@ -963,9 +981,9 @@ class MtxSplitPane {
|
|
|
963
981
|
this.split.removeArea(this);
|
|
964
982
|
}
|
|
965
983
|
}
|
|
966
|
-
/** @nocollapse */ MtxSplitPane.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
967
|
-
/** @nocollapse */ MtxSplitPane.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.
|
|
968
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
984
|
+
/** @nocollapse */ MtxSplitPane.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxSplitPane, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: MtxSplit }], target: i0.ɵɵFactoryTarget.Directive });
|
|
985
|
+
/** @nocollapse */ MtxSplitPane.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: MtxSplitPane, selector: "mtx-split-pane, [mtx-split-pane]", inputs: { order: "order", size: "size", minSize: "minSize", maxSize: "maxSize", lockSize: "lockSize", visible: "visible" }, exportAs: ["mtxSplitPane"], ngImport: i0 });
|
|
986
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxSplitPane, decorators: [{
|
|
969
987
|
type: Directive,
|
|
970
988
|
args: [{
|
|
971
989
|
selector: 'mtx-split-pane, [mtx-split-pane]',
|
|
@@ -987,10 +1005,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImpor
|
|
|
987
1005
|
|
|
988
1006
|
class MtxSplitModule {
|
|
989
1007
|
}
|
|
990
|
-
/** @nocollapse */ MtxSplitModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
991
|
-
/** @nocollapse */ MtxSplitModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.
|
|
992
|
-
/** @nocollapse */ MtxSplitModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.
|
|
993
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
1008
|
+
/** @nocollapse */ MtxSplitModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxSplitModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1009
|
+
/** @nocollapse */ MtxSplitModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.1", ngImport: i0, type: MtxSplitModule, declarations: [MtxSplit, MtxSplitPane], imports: [CommonModule], exports: [MtxSplit, MtxSplitPane] });
|
|
1010
|
+
/** @nocollapse */ MtxSplitModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxSplitModule, imports: [CommonModule] });
|
|
1011
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxSplitModule, decorators: [{
|
|
994
1012
|
type: NgModule,
|
|
995
1013
|
args: [{
|
|
996
1014
|
imports: [CommonModule],
|
|
@@ -1003,5 +1021,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImpor
|
|
|
1003
1021
|
* Generated bundle index. Do not edit.
|
|
1004
1022
|
*/
|
|
1005
1023
|
|
|
1006
|
-
export { MtxSplit, MtxSplitModule, MtxSplitPane, getAreaAbsorptionCapacity, getAreaAbsorptionCapacityPercent, getAreaAbsorptionCapacityPixel, getAreaMaxSize, getAreaMinSize, getElementPixelSize, getGutterSideAbsorptionCapacity, getInputBoolean, getInputPositiveNumber, getPointFromEvent, isUserSizesValid, updateAreaSize };
|
|
1024
|
+
export { MTX_SPLIT_DEFAULT_OPTIONS, MtxSplit, MtxSplitModule, MtxSplitPane, getAreaAbsorptionCapacity, getAreaAbsorptionCapacityPercent, getAreaAbsorptionCapacityPixel, getAreaMaxSize, getAreaMinSize, getElementPixelSize, getGutterSideAbsorptionCapacity, getInputBoolean, getInputPositiveNumber, getPointFromEvent, isUserSizesValid, updateAreaSize };
|
|
1007
1025
|
//# sourceMappingURL=mtxSplit.mjs.map
|