@colijnit/corecomponents_v12 12.0.95 → 12.0.97
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/bundles/colijnit-corecomponents_v12.umd.js +381 -30
- package/bundles/colijnit-corecomponents_v12.umd.js.map +1 -1
- package/colijnit-corecomponents_v12.d.ts +8 -3
- package/colijnit-corecomponents_v12.metadata.json +1 -1
- package/esm2015/colijnit-corecomponents_v12.js +9 -4
- package/esm2015/lib/components/base/base-input.component.js +2 -1
- package/esm2015/lib/components/icon/icon.component.js +17 -5
- package/esm2015/lib/components/input-search/input-search.component.js +12 -1
- package/esm2015/lib/components/input-text/input-text.component.js +51 -29
- package/esm2015/lib/components/tooltip/tooltip.component.js +77 -0
- package/esm2015/lib/components/tooltip/tooltip.module.js +19 -0
- package/esm2015/lib/directives/overlay/overlay-parent.directive.js +19 -0
- package/esm2015/lib/directives/overlay/overlay.directive.js +67 -0
- package/esm2015/lib/directives/overlay/overlay.module.js +18 -0
- package/esm2015/lib/directives/tooltip/tooltip-directive.module.js +19 -0
- package/esm2015/lib/directives/tooltip/tooltip.directive.js +78 -0
- package/esm2015/public-api.js +3 -1
- package/fesm2015/colijnit-corecomponents_v12.js +359 -32
- package/fesm2015/colijnit-corecomponents_v12.js.map +1 -1
- package/lib/components/base/base-input.component.d.ts +1 -0
- package/lib/components/icon/icon.component.d.ts +6 -1
- package/lib/components/input-search/input-search.component.d.ts +5 -0
- package/lib/components/input-search/style/_layout.scss +2 -16
- package/lib/components/input-search/style/_material-definition.scss +1 -0
- package/lib/components/input-text/input-text.component.d.ts +12 -5
- package/lib/components/input-text/style/_layout.scss +22 -36
- package/lib/components/input-text/style/_material-definition.scss +4 -0
- package/lib/components/input-text/style/_theme.scss +3 -0
- package/lib/components/tooltip/style/_layout.scss +52 -0
- package/lib/components/tooltip/style/_material-definition.scss +8 -0
- package/lib/components/tooltip/style/_theme.scss +33 -0
- package/lib/components/tooltip/style/material.scss +4 -0
- package/lib/components/tooltip/tooltip.component.d.ts +18 -0
- package/lib/components/tooltip/tooltip.module.d.ts +2 -0
- package/lib/directives/overlay/overlay-parent.directive.d.ts +6 -0
- package/lib/directives/overlay/overlay.directive.d.ts +14 -0
- package/lib/directives/overlay/overlay.module.d.ts +2 -0
- package/lib/directives/tooltip/tooltip-directive.module.d.ts +2 -0
- package/lib/directives/tooltip/tooltip.directive.d.ts +20 -0
- package/lib/style/_input.mixins.scss +1 -1
- package/lib/style/_variables.scss +1 -1
- package/package.json +1 -1
- package/public-api.d.ts +2 -0
|
@@ -1293,13 +1293,24 @@
|
|
|
1293
1293
|
}
|
|
1294
1294
|
Object.defineProperty(IconComponent.prototype, "icon", {
|
|
1295
1295
|
set: function (value) {
|
|
1296
|
-
this.
|
|
1296
|
+
this._icon = value;
|
|
1297
1297
|
},
|
|
1298
1298
|
enumerable: false,
|
|
1299
1299
|
configurable: true
|
|
1300
1300
|
});
|
|
1301
|
+
IconComponent.prototype.ngOnInit = function () {
|
|
1302
|
+
this._prepareIcon();
|
|
1303
|
+
};
|
|
1304
|
+
IconComponent.prototype._prepareIcon = function () {
|
|
1305
|
+
if (this.iconData) {
|
|
1306
|
+
this.innerIconData = this.iconData;
|
|
1307
|
+
}
|
|
1308
|
+
else if (this._icon) {
|
|
1309
|
+
this._setIconFromEnum(this._icon);
|
|
1310
|
+
}
|
|
1311
|
+
};
|
|
1301
1312
|
IconComponent.prototype._setIconFromEnum = function (icon) {
|
|
1302
|
-
this.
|
|
1313
|
+
this.innerIconData = this._iconCache.getIcon(icon);
|
|
1303
1314
|
};
|
|
1304
1315
|
return IconComponent;
|
|
1305
1316
|
}());
|
|
@@ -1315,8 +1326,9 @@
|
|
|
1315
1326
|
]; };
|
|
1316
1327
|
IconComponent.propDecorators = {
|
|
1317
1328
|
icon: [{ type: i0.Input }],
|
|
1318
|
-
iconData: [{ type: i0.Input }
|
|
1319
|
-
showClass: [{ type: i0.HostBinding, args: [
|
|
1329
|
+
iconData: [{ type: i0.Input }],
|
|
1330
|
+
showClass: [{ type: i0.HostBinding, args: ['class.co-icon',] }],
|
|
1331
|
+
innerIconData: [{ type: i0.HostBinding, args: ['innerHtml',] }]
|
|
1320
1332
|
};
|
|
1321
1333
|
|
|
1322
1334
|
var IconModule = /** @class */ (function () {
|
|
@@ -5127,6 +5139,7 @@
|
|
|
5127
5139
|
hidden: [{ type: i0.Input }, { type: i0.HostBinding, args: ["class." + BaseInputComponent.HiddenClass,] }],
|
|
5128
5140
|
decimals: [{ type: i0.Input }],
|
|
5129
5141
|
icon: [{ type: i0.Input }],
|
|
5142
|
+
customCssClass: [{ type: i0.Input }],
|
|
5130
5143
|
redErrorBackground: [{ type: i0.Input }, { type: i0.HostBinding, args: ["class.cc-red-error-background",] }],
|
|
5131
5144
|
myFormInputInstance: [{ type: i0.Input }],
|
|
5132
5145
|
nativeBlur: [{ type: i0.Output }],
|
|
@@ -7596,12 +7609,31 @@
|
|
|
7596
7609
|
_this.showClearButton = undefined;
|
|
7597
7610
|
_this.showPlaceholderOnFocus = true;
|
|
7598
7611
|
_this.noStyle = false;
|
|
7599
|
-
_this.hasOwnLabel = true;
|
|
7600
7612
|
_this.hideArrowButtons = false;
|
|
7601
7613
|
_this.isSmall = false;
|
|
7614
|
+
_this.leftIconClick = new i0.EventEmitter();
|
|
7615
|
+
_this.rightIconClick = new i0.EventEmitter();
|
|
7616
|
+
_this.hasOwnLabel = true;
|
|
7602
7617
|
_super.prototype._markAsOnPush.call(_this);
|
|
7603
7618
|
return _this;
|
|
7604
7619
|
}
|
|
7620
|
+
InputTextComponent.prototype.showClass = function () {
|
|
7621
|
+
return true;
|
|
7622
|
+
};
|
|
7623
|
+
Object.defineProperty(InputTextComponent.prototype, "hasLeftIcon", {
|
|
7624
|
+
get: function () {
|
|
7625
|
+
return this.leftIcon !== undefined && this.leftIcon !== null;
|
|
7626
|
+
},
|
|
7627
|
+
enumerable: false,
|
|
7628
|
+
configurable: true
|
|
7629
|
+
});
|
|
7630
|
+
Object.defineProperty(InputTextComponent.prototype, "hasRightIcon", {
|
|
7631
|
+
get: function () {
|
|
7632
|
+
return this.rightIcon !== undefined && this.rightIcon !== null;
|
|
7633
|
+
},
|
|
7634
|
+
enumerable: false,
|
|
7635
|
+
configurable: true
|
|
7636
|
+
});
|
|
7605
7637
|
Object.defineProperty(InputTextComponent.prototype, "model", {
|
|
7606
7638
|
get: function () {
|
|
7607
7639
|
return _super.prototype.model;
|
|
@@ -7622,34 +7654,27 @@
|
|
|
7622
7654
|
enumerable: false,
|
|
7623
7655
|
configurable: true
|
|
7624
7656
|
});
|
|
7625
|
-
InputTextComponent.prototype.showClass = function () {
|
|
7626
|
-
return true;
|
|
7627
|
-
};
|
|
7628
|
-
Object.defineProperty(InputTextComponent.prototype, "hasLeftIcon", {
|
|
7629
|
-
get: function () {
|
|
7630
|
-
return this.leftIcon !== undefined && this.leftIcon !== null;
|
|
7631
|
-
},
|
|
7632
|
-
enumerable: false,
|
|
7633
|
-
configurable: true
|
|
7634
|
-
});
|
|
7635
|
-
Object.defineProperty(InputTextComponent.prototype, "hasRightIcon", {
|
|
7636
|
-
get: function () {
|
|
7637
|
-
return this.rightIcon !== undefined && this.rightIcon !== null;
|
|
7638
|
-
},
|
|
7639
|
-
enumerable: false,
|
|
7640
|
-
configurable: true
|
|
7641
|
-
});
|
|
7642
7657
|
// exclude some non-digit characters, since input type 'number' still allows the characters -, + and e
|
|
7643
7658
|
InputTextComponent.prototype.excludeNonDigitChars = function (event) {
|
|
7644
7659
|
var excludedKeys = this.excludePlusMinus ? ['e', '-', '+'] : ['e'];
|
|
7645
7660
|
return !excludedKeys.includes(event.key);
|
|
7646
7661
|
};
|
|
7662
|
+
InputTextComponent.prototype.handleLeftIconClick = function (event) {
|
|
7663
|
+
event.preventDefault();
|
|
7664
|
+
event.stopPropagation();
|
|
7665
|
+
this.leftIconClick.emit(event);
|
|
7666
|
+
};
|
|
7667
|
+
InputTextComponent.prototype.handleRightIconClick = function (event) {
|
|
7668
|
+
event.preventDefault();
|
|
7669
|
+
event.stopPropagation();
|
|
7670
|
+
this.rightIconClick.emit(event);
|
|
7671
|
+
};
|
|
7647
7672
|
return InputTextComponent;
|
|
7648
7673
|
}(BaseInputComponent));
|
|
7649
7674
|
InputTextComponent.decorators = [
|
|
7650
7675
|
{ type: i0.Component, args: [{
|
|
7651
7676
|
selector: "co-input-text",
|
|
7652
|
-
template: "\n <
|
|
7677
|
+
template: "\n <div class=\"input-text-wrapper\">\n <co-icon *ngIf=\"leftIcon\" class=\"input-text-left-icon\" [icon]=\"leftIcon\" [iconData]=\"leftIconData\" (click)=\"handleLeftIconClick($event)\"></co-icon>\n <div *ngIf=\"leftIcon\" class=\"spacer\"></div>\n <div class=\"input-wrapper\">\n <label *ngIf=\"showPlaceholderOnFocus || (!showPlaceholderOnFocus && !hasValue && !focused)\"\n [textContent]=\"placeholder\"></label>\n <input #input\n [type]=\"digitsOnly ? 'number' : type\"\n [ngModel]=\"model\"\n [min]=\"type === 'number' && this.min ? this.min : undefined\"\n [max]=\"type === 'number' && this.max ? this.max : undefined\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n (ngModelChange)=\"modelChange.emit($event)\"\n (keydown)=\"digitsOnly ? excludeNonDigitChars($event) : true\"\n >\n </div>\n <div *ngIf=\"rightIcon\" class=\"spacer\"></div>\n <co-icon *ngIf=\"rightIcon\" class=\"input-text-right-icon\" [icon]=\"rightIcon\" [iconData]=\"rightIconData\" (click)=\"handleRightIconClick($event)\"></co-icon>\n </div>\n <co-commit-buttons *ngIf=\"showSaveCancel && focused && canSaveOrCancel\"\n [committing]=\"committing\"\n [commitFinished]=\"commitFinished\"\n (commitClick)=\"commitClick($event)\"\n (cancelClick)=\"cancelClick($event)\"\n >\n </co-commit-buttons>\n <div class=\"required-indicator\"></div>\n <ng-template #validationError></ng-template>\n ",
|
|
7653
7678
|
providers: [{
|
|
7654
7679
|
provide: SCREEN_CONFIG_ADAPTER_COMPONENT_INTERFACE_NAME,
|
|
7655
7680
|
useExisting: i0.forwardRef(function () { return InputTextComponent; })
|
|
@@ -7680,13 +7705,17 @@
|
|
|
7680
7705
|
showPlaceholderOnFocus: [{ type: i0.Input }],
|
|
7681
7706
|
leftIcon: [{ type: i0.Input }],
|
|
7682
7707
|
rightIcon: [{ type: i0.Input }],
|
|
7708
|
+
leftIconData: [{ type: i0.Input }],
|
|
7709
|
+
rightIconData: [{ type: i0.Input }],
|
|
7683
7710
|
noStyle: [{ type: i0.HostBinding, args: ['class.no-style',] }, { type: i0.Input }],
|
|
7711
|
+
hideArrowButtons: [{ type: i0.Input }, { type: i0.HostBinding, args: ['class.hide-arrows',] }],
|
|
7712
|
+
isSmall: [{ type: i0.HostBinding, args: ['class.is-small',] }, { type: i0.Input }],
|
|
7713
|
+
leftIconClick: [{ type: i0.Output }],
|
|
7714
|
+
rightIconClick: [{ type: i0.Output }],
|
|
7684
7715
|
showClass: [{ type: i0.HostBinding, args: ["class.co-input-text",] }],
|
|
7685
7716
|
hasLeftIcon: [{ type: i0.HostBinding, args: ['class.has-left-icon',] }],
|
|
7686
7717
|
hasRightIcon: [{ type: i0.HostBinding, args: ['class.has-right-icon',] }],
|
|
7687
|
-
hasOwnLabel: [{ type: i0.HostBinding, args: ["class.has-own-label",] }]
|
|
7688
|
-
hideArrowButtons: [{ type: i0.Input }, { type: i0.HostBinding, args: ['class.hide-arrows',] }],
|
|
7689
|
-
isSmall: [{ type: i0.HostBinding, args: ['class.is-small',] }, { type: i0.Input }]
|
|
7718
|
+
hasOwnLabel: [{ type: i0.HostBinding, args: ["class.has-own-label",] }]
|
|
7690
7719
|
};
|
|
7691
7720
|
|
|
7692
7721
|
var ValidationErrorModule = /** @class */ (function () {
|
|
@@ -7846,6 +7875,8 @@
|
|
|
7846
7875
|
var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
|
|
7847
7876
|
_this.searchIcon = exports.CoreComponentsIcon.Magnifier;
|
|
7848
7877
|
_this.search = new i0.EventEmitter();
|
|
7878
|
+
_this.leftIconClick = new i0.EventEmitter();
|
|
7879
|
+
_this.rightIconClick = new i0.EventEmitter();
|
|
7849
7880
|
_this.useLeftIcon = false;
|
|
7850
7881
|
_this.useRightIcon = false;
|
|
7851
7882
|
_this.centerLabel = false;
|
|
@@ -7868,7 +7899,7 @@
|
|
|
7868
7899
|
InputSearchComponent.decorators = [
|
|
7869
7900
|
{ type: i0.Component, args: [{
|
|
7870
7901
|
selector: 'co-input-search',
|
|
7871
|
-
template: "\n <co-input-text\n [model]=\"model\"\n [leftIcon]=\"useLeftIcon ? searchIcon : null\"\n [rightIcon]=\"useRightIcon ? searchIcon : null\"\n [placeholder]=\"placeholder\"\n [customHeight]=\"true\"\n [showPlaceholderOnFocus]=\"false\"\n (modelChange)=\"modelChange.emit($event)\"\n ></co-input-text>\n ",
|
|
7902
|
+
template: "\n <co-input-text\n [ngClass]=\"customCssClass\"\n [model]=\"model\"\n [leftIcon]=\"useLeftIcon ? searchIcon : null\"\n [rightIcon]=\"useRightIcon ? searchIcon : null\"\n [leftIconData]=\"useLeftIcon && leftIconData ? leftIconData : undefined\"\n [rightIconData]=\"useRightIcon && rightIconData ? rightIconData : undefined\"\n [placeholder]=\"placeholder\"\n [customHeight]=\"true\"\n [showPlaceholderOnFocus]=\"false\"\n (modelChange)=\"modelChange.emit($event)\"\n (leftIconClick)=\"leftIconClick.emit($event)\"\n (rightIconClick)=\"rightIconClick.emit($event)\"\n ></co-input-text>\n ",
|
|
7872
7903
|
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
7873
7904
|
encapsulation: i0.ViewEncapsulation.None
|
|
7874
7905
|
},] }
|
|
@@ -7876,8 +7907,12 @@
|
|
|
7876
7907
|
InputSearchComponent.propDecorators = {
|
|
7877
7908
|
placeholder: [{ type: i0.Input }],
|
|
7878
7909
|
search: [{ type: i0.Output }],
|
|
7910
|
+
leftIconClick: [{ type: i0.Output }],
|
|
7911
|
+
rightIconClick: [{ type: i0.Output }],
|
|
7879
7912
|
useLeftIcon: [{ type: i0.Input }],
|
|
7880
7913
|
useRightIcon: [{ type: i0.Input }],
|
|
7914
|
+
leftIconData: [{ type: i0.Input }],
|
|
7915
|
+
rightIconData: [{ type: i0.Input }],
|
|
7881
7916
|
centerLabel: [{ type: i0.HostBinding, args: ['class.center-label',] }, { type: i0.Input }],
|
|
7882
7917
|
showClass: [{ type: i0.HostBinding, args: ['class.co-input-search',] }]
|
|
7883
7918
|
};
|
|
@@ -11450,6 +11485,315 @@
|
|
|
11450
11485
|
},] }
|
|
11451
11486
|
];
|
|
11452
11487
|
|
|
11488
|
+
var OverlayDirective = /** @class */ (function () {
|
|
11489
|
+
function OverlayDirective(elementRef) {
|
|
11490
|
+
this._elementRef = elementRef;
|
|
11491
|
+
}
|
|
11492
|
+
Object.defineProperty(OverlayDirective.prototype, "parent", {
|
|
11493
|
+
set: function (value) {
|
|
11494
|
+
if (value && value.elementRef) {
|
|
11495
|
+
this._parent = value.elementRef;
|
|
11496
|
+
}
|
|
11497
|
+
else {
|
|
11498
|
+
if (this._parent) {
|
|
11499
|
+
this._observer.disconnect();
|
|
11500
|
+
}
|
|
11501
|
+
}
|
|
11502
|
+
},
|
|
11503
|
+
enumerable: false,
|
|
11504
|
+
configurable: true
|
|
11505
|
+
});
|
|
11506
|
+
OverlayDirective.prototype.ngOnDestroy = function () {
|
|
11507
|
+
var _this = this;
|
|
11508
|
+
window.removeEventListener("scroll", function (event) { return _this._handleScroll; });
|
|
11509
|
+
this._observer.disconnect();
|
|
11510
|
+
this._elementRef = undefined;
|
|
11511
|
+
this._parent = undefined;
|
|
11512
|
+
};
|
|
11513
|
+
OverlayDirective.prototype.ngOnInit = function () {
|
|
11514
|
+
var _this = this;
|
|
11515
|
+
window.addEventListener("scroll", function (event) { return _this._handleScroll; });
|
|
11516
|
+
this._initiallyPlaceElement();
|
|
11517
|
+
this._observer = new ResizeObserver(function (entries) {
|
|
11518
|
+
var entry = entries[0];
|
|
11519
|
+
var elementRect = _this._elementRef.nativeElement.getBoundingClientRect();
|
|
11520
|
+
var parentRect = _this._parent.nativeElement.getBoundingClientRect();
|
|
11521
|
+
_this._placeElement(entry.contentRect.bottom, entry.contentRect.right, parentRect, elementRect);
|
|
11522
|
+
});
|
|
11523
|
+
this._observer.observe(document.body);
|
|
11524
|
+
};
|
|
11525
|
+
OverlayDirective.prototype._initiallyPlaceElement = function () {
|
|
11526
|
+
var elementRect = this._elementRef.nativeElement.getBoundingClientRect();
|
|
11527
|
+
var parentRect = this._parent.nativeElement.getBoundingClientRect();
|
|
11528
|
+
this._placeElement(window.innerHeight, window.innerWidth, parentRect, elementRect);
|
|
11529
|
+
};
|
|
11530
|
+
OverlayDirective.prototype._placeElement = function (bottom, right, parentRect, elementRect) {
|
|
11531
|
+
if (bottom < parentRect.bottom + elementRect.height) { // make sure it fits at the bottom
|
|
11532
|
+
this._elementRef.nativeElement.style.top = (parentRect.top - elementRect.height) + "px";
|
|
11533
|
+
}
|
|
11534
|
+
else {
|
|
11535
|
+
this._elementRef.nativeElement.style.top = parentRect.bottom + "px";
|
|
11536
|
+
}
|
|
11537
|
+
if (right < parentRect.left + elementRect.width) { // make sure it fits at the right
|
|
11538
|
+
this._elementRef.nativeElement.style.left = (parentRect.right - elementRect.width) + "px";
|
|
11539
|
+
}
|
|
11540
|
+
else {
|
|
11541
|
+
this._elementRef.nativeElement.style.left = parentRect.left + "px";
|
|
11542
|
+
}
|
|
11543
|
+
};
|
|
11544
|
+
OverlayDirective.prototype._handleScroll = function (event) {
|
|
11545
|
+
console.log("scroll");
|
|
11546
|
+
};
|
|
11547
|
+
return OverlayDirective;
|
|
11548
|
+
}());
|
|
11549
|
+
OverlayDirective.decorators = [
|
|
11550
|
+
{ type: i0.Directive, args: [{
|
|
11551
|
+
selector: "[overlay]"
|
|
11552
|
+
},] }
|
|
11553
|
+
];
|
|
11554
|
+
OverlayDirective.ctorParameters = function () { return [
|
|
11555
|
+
{ type: i0.ElementRef }
|
|
11556
|
+
]; };
|
|
11557
|
+
OverlayDirective.propDecorators = {
|
|
11558
|
+
parent: [{ type: i0.Input, args: ["overlay",] }]
|
|
11559
|
+
};
|
|
11560
|
+
|
|
11561
|
+
var OverlayParentDirective = /** @class */ (function () {
|
|
11562
|
+
function OverlayParentDirective(elementRef) {
|
|
11563
|
+
this.elementRef = elementRef;
|
|
11564
|
+
}
|
|
11565
|
+
OverlayParentDirective.prototype.ngOnDestroy = function () {
|
|
11566
|
+
this.elementRef = undefined;
|
|
11567
|
+
};
|
|
11568
|
+
return OverlayParentDirective;
|
|
11569
|
+
}());
|
|
11570
|
+
OverlayParentDirective.decorators = [
|
|
11571
|
+
{ type: i0.Directive, args: [{
|
|
11572
|
+
selector: '[overlayParent]',
|
|
11573
|
+
exportAs: 'overlayParent'
|
|
11574
|
+
},] }
|
|
11575
|
+
];
|
|
11576
|
+
OverlayParentDirective.ctorParameters = function () { return [
|
|
11577
|
+
{ type: i0.ElementRef }
|
|
11578
|
+
]; };
|
|
11579
|
+
|
|
11580
|
+
var OverlayModule = /** @class */ (function () {
|
|
11581
|
+
function OverlayModule() {
|
|
11582
|
+
}
|
|
11583
|
+
return OverlayModule;
|
|
11584
|
+
}());
|
|
11585
|
+
OverlayModule.decorators = [
|
|
11586
|
+
{ type: i0.NgModule, args: [{
|
|
11587
|
+
declarations: [
|
|
11588
|
+
OverlayDirective,
|
|
11589
|
+
OverlayParentDirective
|
|
11590
|
+
],
|
|
11591
|
+
exports: [
|
|
11592
|
+
OverlayDirective,
|
|
11593
|
+
OverlayParentDirective
|
|
11594
|
+
]
|
|
11595
|
+
},] }
|
|
11596
|
+
];
|
|
11597
|
+
|
|
11598
|
+
var TooltipComponent = /** @class */ (function () {
|
|
11599
|
+
function TooltipComponent(_elementRef, _changeDetector) {
|
|
11600
|
+
this._elementRef = _elementRef;
|
|
11601
|
+
this._changeDetector = _changeDetector;
|
|
11602
|
+
this.top = -100;
|
|
11603
|
+
this.left = -100;
|
|
11604
|
+
this.bottom = false;
|
|
11605
|
+
this.animate = true;
|
|
11606
|
+
}
|
|
11607
|
+
Object.defineProperty(TooltipComponent.prototype, "hostElement", {
|
|
11608
|
+
get: function () {
|
|
11609
|
+
return this._hostElement;
|
|
11610
|
+
},
|
|
11611
|
+
set: function (value) {
|
|
11612
|
+
this._hostElement = value;
|
|
11613
|
+
// this._positionTooltip();
|
|
11614
|
+
},
|
|
11615
|
+
enumerable: false,
|
|
11616
|
+
configurable: true
|
|
11617
|
+
});
|
|
11618
|
+
TooltipComponent.prototype.showClass = function () {
|
|
11619
|
+
return true;
|
|
11620
|
+
};
|
|
11621
|
+
TooltipComponent.prototype.ngAfterViewInit = function () {
|
|
11622
|
+
var _this = this;
|
|
11623
|
+
setTimeout(function () {
|
|
11624
|
+
_this._positionTooltip();
|
|
11625
|
+
});
|
|
11626
|
+
};
|
|
11627
|
+
TooltipComponent.prototype._positionTooltip = function () {
|
|
11628
|
+
if (this.hostElement && this._elementRef && this._elementRef.nativeElement) {
|
|
11629
|
+
var rect = this.hostElement.getBoundingClientRect();
|
|
11630
|
+
var ownRect = this._elementRef.nativeElement.getBoundingClientRect();
|
|
11631
|
+
var wantedLeft = rect.left;
|
|
11632
|
+
var wantedTop = rect.top - ownRect.height;
|
|
11633
|
+
if (wantedTop < 0) { // out of view, move to bottom
|
|
11634
|
+
this.bottom = true;
|
|
11635
|
+
wantedTop = rect.bottom;
|
|
11636
|
+
}
|
|
11637
|
+
else {
|
|
11638
|
+
this.bottom = false;
|
|
11639
|
+
}
|
|
11640
|
+
this.left = wantedLeft;
|
|
11641
|
+
this.top = wantedTop;
|
|
11642
|
+
this._changeDetector.markForCheck();
|
|
11643
|
+
this._changeDetector.detectChanges();
|
|
11644
|
+
}
|
|
11645
|
+
};
|
|
11646
|
+
return TooltipComponent;
|
|
11647
|
+
}());
|
|
11648
|
+
TooltipComponent.decorators = [
|
|
11649
|
+
{ type: i0.Component, args: [{
|
|
11650
|
+
selector: 'co-tooltip',
|
|
11651
|
+
template: "\n <div class=\"tooltip\" [innerHTML]=\"toolTip\"></div>\n ",
|
|
11652
|
+
animations: [
|
|
11653
|
+
animations.trigger("showHide", [
|
|
11654
|
+
animations.state("void", animations.style({ opacity: 0 })),
|
|
11655
|
+
animations.state("*", animations.style({ opacity: 1 })),
|
|
11656
|
+
animations.transition("void <=> *", animations.animate("200ms ease-in-out")),
|
|
11657
|
+
])
|
|
11658
|
+
],
|
|
11659
|
+
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
11660
|
+
encapsulation: i0.ViewEncapsulation.None
|
|
11661
|
+
},] }
|
|
11662
|
+
];
|
|
11663
|
+
TooltipComponent.ctorParameters = function () { return [
|
|
11664
|
+
{ type: i0.ElementRef },
|
|
11665
|
+
{ type: i0.ChangeDetectorRef }
|
|
11666
|
+
]; };
|
|
11667
|
+
TooltipComponent.propDecorators = {
|
|
11668
|
+
hostElement: [{ type: i0.Input }],
|
|
11669
|
+
toolTip: [{ type: i0.Input }],
|
|
11670
|
+
showClass: [{ type: i0.HostBinding, args: ['class.co-tooltip',] }],
|
|
11671
|
+
top: [{ type: i0.HostBinding, args: ["style.top.px",] }],
|
|
11672
|
+
left: [{ type: i0.HostBinding, args: ["style.left.px",] }],
|
|
11673
|
+
bottom: [{ type: i0.HostBinding, args: ["class.bottom",] }],
|
|
11674
|
+
animate: [{ type: i0.HostBinding, args: ['@showHide',] }]
|
|
11675
|
+
};
|
|
11676
|
+
|
|
11677
|
+
var TooltipDirective = /** @class */ (function () {
|
|
11678
|
+
function TooltipDirective(elementRef, _compFactoryResolver, _appRef, _injector, _sanitizer) {
|
|
11679
|
+
this._compFactoryResolver = _compFactoryResolver;
|
|
11680
|
+
this._appRef = _appRef;
|
|
11681
|
+
this._injector = _injector;
|
|
11682
|
+
this._sanitizer = _sanitizer;
|
|
11683
|
+
this._elementRef = elementRef;
|
|
11684
|
+
}
|
|
11685
|
+
Object.defineProperty(TooltipDirective.prototype, "tooltip", {
|
|
11686
|
+
set: function (str) {
|
|
11687
|
+
this._tooltipMessage = str;
|
|
11688
|
+
},
|
|
11689
|
+
enumerable: false,
|
|
11690
|
+
configurable: true
|
|
11691
|
+
});
|
|
11692
|
+
TooltipDirective.prototype.ngOnDestroy = function () {
|
|
11693
|
+
var _this = this;
|
|
11694
|
+
if (this._elementRef && this._elementRef.nativeElement) {
|
|
11695
|
+
this._elementRef.nativeElement.removeEventListener('mouseenter', function (event) { return _this._handleMouseMove(event); });
|
|
11696
|
+
this._elementRef.nativeElement.removeEventListener('mouseleave', function () { return _this._removeTooltip(); });
|
|
11697
|
+
}
|
|
11698
|
+
window.removeEventListener("scroll", function (event) { return _this._handleScroll; });
|
|
11699
|
+
this._elementRef = undefined;
|
|
11700
|
+
};
|
|
11701
|
+
TooltipDirective.prototype.ngOnInit = function () {
|
|
11702
|
+
var _this = this;
|
|
11703
|
+
window.addEventListener("scroll", function (event) { return _this._handleScroll; });
|
|
11704
|
+
if (this._elementRef && this._elementRef.nativeElement) {
|
|
11705
|
+
this._elementRef.nativeElement.addEventListener('mouseenter', function (event) { return _this._handleMouseMove(event); });
|
|
11706
|
+
this._elementRef.nativeElement.addEventListener('mouseleave', function () { return _this._removeTooltip(); });
|
|
11707
|
+
}
|
|
11708
|
+
};
|
|
11709
|
+
TooltipDirective.prototype._handleScroll = function () {
|
|
11710
|
+
this._removeTooltip();
|
|
11711
|
+
};
|
|
11712
|
+
TooltipDirective.prototype._handleMouseMove = function (event) {
|
|
11713
|
+
this._showTooltip(event.clientY, event.clientX);
|
|
11714
|
+
};
|
|
11715
|
+
TooltipDirective.prototype._showTooltip = function (top, left) {
|
|
11716
|
+
this._createTooltipComponent(top, left);
|
|
11717
|
+
};
|
|
11718
|
+
TooltipDirective.prototype._removeTooltip = function () {
|
|
11719
|
+
if (this._componentRef) {
|
|
11720
|
+
this._appRef.detachView(this._componentRef.hostView);
|
|
11721
|
+
this._componentRef.destroy();
|
|
11722
|
+
this._componentRef = undefined;
|
|
11723
|
+
}
|
|
11724
|
+
};
|
|
11725
|
+
TooltipDirective.prototype._createTooltipComponent = function (top, left) {
|
|
11726
|
+
if (!this._tooltipMessage) {
|
|
11727
|
+
return;
|
|
11728
|
+
}
|
|
11729
|
+
if (this._componentRef) {
|
|
11730
|
+
return;
|
|
11731
|
+
}
|
|
11732
|
+
this._componentRef = this._compFactoryResolver
|
|
11733
|
+
.resolveComponentFactory(TooltipComponent)
|
|
11734
|
+
.create(this._injector);
|
|
11735
|
+
this._componentRef.instance.hostElement = this._elementRef.nativeElement;
|
|
11736
|
+
this._componentRef.instance.toolTip = this._sanitizer.bypassSecurityTrustHtml(this._tooltipMessage);
|
|
11737
|
+
this._appRef.attachView(this._componentRef.hostView);
|
|
11738
|
+
var domElem = this._componentRef.hostView.rootNodes[0];
|
|
11739
|
+
document.body.appendChild(domElem);
|
|
11740
|
+
};
|
|
11741
|
+
return TooltipDirective;
|
|
11742
|
+
}());
|
|
11743
|
+
TooltipDirective.decorators = [
|
|
11744
|
+
{ type: i0.Directive, args: [{
|
|
11745
|
+
selector: "[tooltip]"
|
|
11746
|
+
},] }
|
|
11747
|
+
];
|
|
11748
|
+
TooltipDirective.ctorParameters = function () { return [
|
|
11749
|
+
{ type: i0.ElementRef },
|
|
11750
|
+
{ type: i0.ComponentFactoryResolver },
|
|
11751
|
+
{ type: i0.ApplicationRef },
|
|
11752
|
+
{ type: i0.Injector },
|
|
11753
|
+
{ type: platformBrowser.DomSanitizer }
|
|
11754
|
+
]; };
|
|
11755
|
+
TooltipDirective.propDecorators = {
|
|
11756
|
+
tooltip: [{ type: i0.Input, args: ["tooltip",] }]
|
|
11757
|
+
};
|
|
11758
|
+
|
|
11759
|
+
var TooltipModule = /** @class */ (function () {
|
|
11760
|
+
function TooltipModule() {
|
|
11761
|
+
}
|
|
11762
|
+
return TooltipModule;
|
|
11763
|
+
}());
|
|
11764
|
+
TooltipModule.decorators = [
|
|
11765
|
+
{ type: i0.NgModule, args: [{
|
|
11766
|
+
imports: [
|
|
11767
|
+
common.CommonModule
|
|
11768
|
+
],
|
|
11769
|
+
declarations: [
|
|
11770
|
+
TooltipComponent
|
|
11771
|
+
],
|
|
11772
|
+
exports: [
|
|
11773
|
+
TooltipComponent
|
|
11774
|
+
]
|
|
11775
|
+
},] }
|
|
11776
|
+
];
|
|
11777
|
+
|
|
11778
|
+
var TooltipDirectiveModule = /** @class */ (function () {
|
|
11779
|
+
function TooltipDirectiveModule() {
|
|
11780
|
+
}
|
|
11781
|
+
return TooltipDirectiveModule;
|
|
11782
|
+
}());
|
|
11783
|
+
TooltipDirectiveModule.decorators = [
|
|
11784
|
+
{ type: i0.NgModule, args: [{
|
|
11785
|
+
imports: [
|
|
11786
|
+
TooltipModule
|
|
11787
|
+
],
|
|
11788
|
+
declarations: [
|
|
11789
|
+
TooltipDirective
|
|
11790
|
+
],
|
|
11791
|
+
exports: [
|
|
11792
|
+
TooltipDirective
|
|
11793
|
+
]
|
|
11794
|
+
},] }
|
|
11795
|
+
];
|
|
11796
|
+
|
|
11453
11797
|
var CheckmarkOverlayComponent = /** @class */ (function () {
|
|
11454
11798
|
function CheckmarkOverlayComponent(_renderer) {
|
|
11455
11799
|
var _this = this;
|
|
@@ -11806,6 +12150,7 @@
|
|
|
11806
12150
|
exports.MultiSelectListModule = MultiSelectListModule;
|
|
11807
12151
|
exports.ObserveVisibilityModule = ObserveVisibilityModule;
|
|
11808
12152
|
exports.OrientationOfDirection = OrientationOfDirection;
|
|
12153
|
+
exports.OverlayModule = OverlayModule;
|
|
11809
12154
|
exports.PaginationBarComponent = PaginationBarComponent;
|
|
11810
12155
|
exports.PaginationBarModule = PaginationBarModule;
|
|
11811
12156
|
exports.PaginationComponent = PaginationComponent;
|
|
@@ -11825,6 +12170,7 @@
|
|
|
11825
12170
|
exports.TextInputPopupComponent = TextInputPopupComponent;
|
|
11826
12171
|
exports.TileComponent = TileComponent;
|
|
11827
12172
|
exports.TileModule = TileModule;
|
|
12173
|
+
exports.TooltipDirectiveModule = TooltipDirectiveModule;
|
|
11828
12174
|
exports.ViewModeButtonsComponent = ViewModeButtonsComponent;
|
|
11829
12175
|
exports.ViewModeButtonsModule = ViewModeButtonsModule;
|
|
11830
12176
|
exports.showHideDialogAnimation = showHideDialogAnimation;
|
|
@@ -11837,9 +12183,14 @@
|
|
|
11837
12183
|
exports["ɵbe"] = PrependPipe;
|
|
11838
12184
|
exports["ɵbf"] = ClickOutsideDirective;
|
|
11839
12185
|
exports["ɵbg"] = ClickOutsideMasterService;
|
|
11840
|
-
exports["ɵbh"] =
|
|
11841
|
-
exports["ɵbi"] =
|
|
11842
|
-
exports["ɵbj"] =
|
|
12186
|
+
exports["ɵbh"] = OverlayDirective;
|
|
12187
|
+
exports["ɵbi"] = OverlayParentDirective;
|
|
12188
|
+
exports["ɵbj"] = TooltipModule;
|
|
12189
|
+
exports["ɵbk"] = TooltipComponent;
|
|
12190
|
+
exports["ɵbl"] = TooltipDirective;
|
|
12191
|
+
exports["ɵbm"] = CheckmarkOverlayComponent;
|
|
12192
|
+
exports["ɵbn"] = ScreenConfigurationDirective;
|
|
12193
|
+
exports["ɵbo"] = ScreenConfigComponentWrapper;
|
|
11843
12194
|
exports["ɵc"] = CoRippleDirective;
|
|
11844
12195
|
exports["ɵd"] = CoViewportRulerService;
|
|
11845
12196
|
exports["ɵe"] = CoScrollDispatcherService;
|