@colijnit/corecomponents_v12 12.0.115 → 12.0.117
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 +41 -24
- package/bundles/colijnit-corecomponents_v12.umd.js.map +1 -1
- package/colijnit-corecomponents_v12.metadata.json +1 -1
- package/esm2015/lib/components/base/base-input.component.js +16 -13
- package/esm2015/lib/components/base/commit-buttons/commit-buttons.component.js +35 -25
- package/esm2015/lib/components/input-textarea/input-textarea.component.js +14 -10
- package/esm2015/lib/components/input-textarea/input-textarea.module.js +4 -2
- package/esm2015/lib/components/list-of-values/list-of-values.component.js +3 -3
- package/esm2015/lib/core/enum/core-components-icon.enum.js +3 -1
- package/esm2015/lib/core/model/core-components-icon-svg.js +3 -1
- package/fesm2015/colijnit-corecomponents_v12.js +68 -46
- package/fesm2015/colijnit-corecomponents_v12.js.map +1 -1
- package/lib/components/base/base-input.component.d.ts +0 -2
- package/lib/components/base/commit-buttons/commit-buttons.component.d.ts +2 -1
- package/lib/components/base/commit-buttons/style/_layout.scss +27 -63
- package/lib/components/base/commit-buttons/style/_theme.scss +0 -4
- package/lib/components/checkmark-overlay/style/_layout.scss +6 -6
- package/lib/components/input-date-range-picker/style/_layout.scss +9 -8
- package/lib/components/input-number-picker/style/_layout.scss +2 -30
- package/lib/components/input-number-picker/style/material.scss +1 -0
- package/lib/components/input-text/style/_layout.scss +5 -1
- package/lib/components/input-text/style/_material-definition.scss +1 -1
- package/lib/components/list-of-values/style/_layout.scss +8 -32
- package/lib/core/enum/core-components-icon.enum.d.ts +2 -0
- package/lib/style/_input.mixins.scss +40 -19
- package/lib/style/_variables.scss +1 -0
- package/package.json +1 -1
|
@@ -992,6 +992,8 @@
|
|
|
992
992
|
"check_round_open": "<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" x=\"0px\" y=\"0px\" viewBox=\"0 0 50 50\" enable-background=\"new 0 0 50 50\" ><g><path fill=\"#2A363B\" d=\"M40.5,25.5C40.5,34,33.5,41,25,41S9.5,34,9.5,25.5S16.5,10,25,10S40.5,16.9,40.5,25.5z M10.5,25.5C10.5,33.5,17,40,25,40s14.5-6.5,14.5-14.5S33,11,25,11S10.5,17.5,10.5,25.5z\"/></g><polygon fill=\"#2A363B\" points=\"19.9,24 22.5,28 29,17.1 33.3,17.1 22.5,33.9 17.7,26.8 \"/></svg>",
|
|
993
993
|
"check_simple": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><polygon fill=\"#2A363B\" points=\"19.9,24 22.5,28 29,17.1 33.3,17.1 22.5,33.9 17.7,26.8 \"/></svg>",
|
|
994
994
|
"check_thin": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><polygon points=\"23.25 37.6 14.37 25.1 15.19 24.52 23.11 35.66 34.73 12.4 35.63 12.85 23.25 37.6\" fill=\"#484f60\"/></svg>",
|
|
995
|
+
"chevron_down_regular": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path d=\"M239 401c9.4 9.4 24.6 9.4 33.9 0L465 209c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-175 175L81 175c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9L239 401z\"/></svg>",
|
|
996
|
+
"chevron_up_regular": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path d=\"M239 111c9.4-9.4 24.6-9.4 33.9 0L465 303c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0l-175-175L81 337c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9L239 111z\"/></svg>",
|
|
995
997
|
"CirclePlusSkinny": "<svg preserveAspectRatio=\"none\" version=\"1.1\" viewBox=\"0 0 50 50\" x=\"0px\" xmlns=\"http://www.w3.org/2000/svg\" y=\"0px\"><g transform=\" translate(10 10)\"><path d=\"M 16 8.668 C 16 9.402 15.402 10 14.668 10 L 10 10 L 10 14.668 C 10 15.402 9.402 16 8.668 16 L 7.337 16 C 6.598 16 6 15.402 6 14.668 L 6 10 L 1.337 10 C 0.598 10 0 9.402 0 8.668 L 0 7.332 C 0 6.599 0.598 6 1.337 6 L 6 6 L 6 1.333 C 6 0.598 6.598 0 7.337 0 L 8.668 0 C 9.402 0 10 0.598 10 1.333 L 10 6 L 14.668 6 C 15.402 6 16 6.599 16 7.332 L 16 8.668 Z\" fill=\"#1E2930\" transform=\" translate(7 7.47)\" /><path d=\"M 15 1 C 22.72 1 29 7.28 29 15 C 29 22.72 22.72 29 15 29 C 7.28 29 1 22.72 1 15 C 1 7.28 7.28 1 15 1 M 15 0 C 6.717 0 0 6.714 0 15 C 0 23.283 6.717 30 15 30 C 23.286 30 30 23.283 30 15 C 30 6.714 23.286 0 15 0 L 15 0 Z\" fill=\"#1E2930\" transform=\" translate(0 0.47)\" /></g></svg>",
|
|
996
998
|
"client": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><path d=\"M30.3,25.39h-.43c-1,1.37-3,3-4.87,3s-3.9-1.64-4.87-3H19.7a3.68,3.68,0,0,0-3.53,3.39l2.35,2.58c0,1.56,1.59,7.14,3.54,7.14h5.88c1.95,0,3.53-5.58,3.53-7.14l2.36-2.58A3.68,3.68,0,0,0,30.3,25.39Z\" fill=\"#484f60\" opacity=\"0.9\"/><path d=\"M19.66,20.41a3.27,3.27,0,0,0-.08.7,5.43,5.43,0,0,0,10.83,0,4.05,4.05,0,0,0-.07-.7,35.41,35.41,0,0,1-5.36.47A34.08,34.08,0,0,1,19.66,20.41Z\" fill=\"#484f60\" opacity=\"0.9\"/><path d=\"M19.58,18.92a33.34,33.34,0,0,0,5.4.5,35,35,0,0,0,5.43-.5c-.9-.59,1.46-6.69,1.46-6.69s-2.44,3.57-3.95,3.65S25,12.23,25,12.23s-1.35,3.63-2.92,3.65-4-3.65-4-3.65S20.42,18.36,19.58,18.92Z\" fill=\"#484f60\"/><path d=\"M19.22,12.59a1.1,1.1,0,1,1-1.1-1.09A1.1,1.1,0,0,1,19.22,12.59Z\" fill=\"#484f60\"/><path d=\"M33,12.59a1.1,1.1,0,1,1-1.1-1.09A1.1,1.1,0,0,1,33,12.59Z\" fill=\"#484f60\"/><path d=\"M26.09,12.59A1.1,1.1,0,1,1,25,11.5,1.09,1.09,0,0,1,26.09,12.59Z\" fill=\"#484f60\"/></svg>",
|
|
997
999
|
"clock": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><path d=\"M25,10A15,15,0,1,0,40,25,15,15,0,0,0,25,10Zm0,27.5A12.5,12.5,0,1,1,37.5,25,12.52,12.52,0,0,1,25,37.5Z\" fill=\"#484f60\"/><path d=\"M26.41,26.24a1.68,1.68,0,1,1-1.67-1.68A1.67,1.67,0,0,1,26.41,26.24Z\" fill=\"#484f60\"/><polygon points=\"23.06 26.24 24.74 16.48 26.41 26.24 23.06 26.24\" fill=\"#484f60\"/><polygon points=\"24.74 24.56 32.15 26.24 24.74 27.91 24.74 24.56\" fill=\"#484f60\"/></svg>",
|
|
@@ -2598,6 +2600,8 @@
|
|
|
2598
2600
|
CoreComponentsIcon["CheckRoundOpen"] = "check_round_open";
|
|
2599
2601
|
CoreComponentsIcon["CheckSimple"] = "check_simple";
|
|
2600
2602
|
CoreComponentsIcon["CheckThin"] = "check_thin";
|
|
2603
|
+
CoreComponentsIcon["ChevronDownRegular"] = "chevron_down_regular";
|
|
2604
|
+
CoreComponentsIcon["ChevronUpRegular"] = "chevron_up_regular";
|
|
2601
2605
|
CoreComponentsIcon["CirclePlusSkinny"] = "CirclePlusSkinny";
|
|
2602
2606
|
CoreComponentsIcon["Client"] = "client";
|
|
2603
2607
|
CoreComponentsIcon["Clock"] = "clock";
|
|
@@ -4393,6 +4397,7 @@
|
|
|
4393
4397
|
function CommitButtonsComponent(_renderer) {
|
|
4394
4398
|
var _this = this;
|
|
4395
4399
|
this._renderer = _renderer;
|
|
4400
|
+
this.firstShow = true;
|
|
4396
4401
|
this.cancelClick = new i0.EventEmitter();
|
|
4397
4402
|
this.commitClick = new i0.EventEmitter();
|
|
4398
4403
|
this._committing = false;
|
|
@@ -4400,7 +4405,6 @@
|
|
|
4400
4405
|
this._handleAnimationIteration = function (event) {
|
|
4401
4406
|
_this._renderer.removeClass(event.currentTarget, 'animate');
|
|
4402
4407
|
event.currentTarget.removeEventListener('animationiteration', _this._handleAnimationIteration);
|
|
4403
|
-
// elem.removeEventListener('webkitAnimationIteration', () => this._handleAnimationIteration(elem));
|
|
4404
4408
|
};
|
|
4405
4409
|
}
|
|
4406
4410
|
Object.defineProperty(CommitButtonsComponent.prototype, "content", {
|
|
@@ -4416,6 +4420,9 @@
|
|
|
4416
4420
|
return this._committing;
|
|
4417
4421
|
},
|
|
4418
4422
|
set: function (value) {
|
|
4423
|
+
if (value) {
|
|
4424
|
+
this.firstShow = false;
|
|
4425
|
+
}
|
|
4419
4426
|
this._committing = value;
|
|
4420
4427
|
this._checkAnimation();
|
|
4421
4428
|
},
|
|
@@ -4427,8 +4434,10 @@
|
|
|
4427
4434
|
return this._commitFinished;
|
|
4428
4435
|
},
|
|
4429
4436
|
set: function (value) {
|
|
4437
|
+
if (value) {
|
|
4438
|
+
this._checkAnimationFinished();
|
|
4439
|
+
}
|
|
4430
4440
|
this._commitFinished = value;
|
|
4431
|
-
this._checkAnimationFinished();
|
|
4432
4441
|
},
|
|
4433
4442
|
enumerable: false,
|
|
4434
4443
|
configurable: true
|
|
@@ -4438,8 +4447,13 @@
|
|
|
4438
4447
|
};
|
|
4439
4448
|
CommitButtonsComponent.prototype._checkAnimation = function () {
|
|
4440
4449
|
var _this = this;
|
|
4441
|
-
if (this.
|
|
4442
|
-
this.
|
|
4450
|
+
if (this.animateDivs) {
|
|
4451
|
+
if (this.committing) {
|
|
4452
|
+
this.animateDivs.forEach(function (a) { return _this._renderer.addClass(a.nativeElement, 'animate'); });
|
|
4453
|
+
}
|
|
4454
|
+
else {
|
|
4455
|
+
this.animateDivs.forEach(function (a) { return _this._renderer.removeClass(a.nativeElement, 'animate'); });
|
|
4456
|
+
}
|
|
4443
4457
|
}
|
|
4444
4458
|
};
|
|
4445
4459
|
CommitButtonsComponent.prototype._checkAnimationFinished = function () {
|
|
@@ -4447,7 +4461,6 @@
|
|
|
4447
4461
|
if (this.commitFinished && this.animateDivs) {
|
|
4448
4462
|
this.animateDivs.forEach(function (a) {
|
|
4449
4463
|
a.nativeElement.addEventListener('animationiteration', _this._handleAnimationIteration);
|
|
4450
|
-
// a.nativeElement.addEventListener('webkitAnimationIteration', (event) => this._handleAnimationIteration(event));
|
|
4451
4464
|
});
|
|
4452
4465
|
}
|
|
4453
4466
|
};
|
|
@@ -4455,8 +4468,8 @@
|
|
|
4455
4468
|
}());
|
|
4456
4469
|
CommitButtonsComponent.decorators = [
|
|
4457
4470
|
{ type: i0.Component, args: [{
|
|
4458
|
-
selector:
|
|
4459
|
-
template: "\n
|
|
4471
|
+
selector: 'co-commit-buttons',
|
|
4472
|
+
template: "\n <div class=\"commit-buttons-wrapper\" [overlay]=\"parentForOverlay\" [rightAlign]=\"true\" @showHideSaveCancel>\n <div class=\"commit-buttons-button save\" [class.finished]=\"commitFinished\"\n (click)=\"commitClick.emit($event)\">\n <div class=\"save-button-spinner\" *ngIf=\"committing\">\n <div #animatediv></div>\n <div #animatediv></div>\n <div #animatediv></div>\n <div #animatediv></div>\n </div>\n <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\" *ngIf=\"firstShow || commitFinished\">\n <path class=\"checkmark-check\" [class.first-show]=\"firstShow\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\"/></svg>\n </div>\n <div class=\"commit-buttons-button cancel\" (click)=\"cancelClick.emit($event)\">\n <div class=\"cancel-button\"></div>\n </div>\n </div>\n ",
|
|
4460
4473
|
animations: [
|
|
4461
4474
|
animations.trigger('showHideSaveCancel', [
|
|
4462
4475
|
animations.state('*', animations.style({ transform: 'scaleY(1)', opacity: 1 })),
|
|
@@ -4477,7 +4490,7 @@
|
|
|
4477
4490
|
parentForOverlay: [{ type: i0.Input }],
|
|
4478
4491
|
cancelClick: [{ type: i0.Output }],
|
|
4479
4492
|
commitClick: [{ type: i0.Output }],
|
|
4480
|
-
showClass: [{ type: i0.HostBinding, args: [
|
|
4493
|
+
showClass: [{ type: i0.HostBinding, args: ['class.co-commit-buttons',] }]
|
|
4481
4494
|
};
|
|
4482
4495
|
|
|
4483
4496
|
/**
|
|
@@ -4521,8 +4534,6 @@
|
|
|
4521
4534
|
this.excludeUserModelChange = false;
|
|
4522
4535
|
this.noFormGroupControl = false;
|
|
4523
4536
|
this.keepFocus = false;
|
|
4524
|
-
this.committing = false;
|
|
4525
|
-
this.commitFinished = false;
|
|
4526
4537
|
this.validationError = "";
|
|
4527
4538
|
this._markedAsUserTouched = false;
|
|
4528
4539
|
this._destroyed = false;
|
|
@@ -4859,8 +4870,8 @@
|
|
|
4859
4870
|
if (!this._commitButtonsComponentRef) {
|
|
4860
4871
|
this._commitButtonsComponentRef = this.overlayService.createComponent(CommitButtonsComponent, {
|
|
4861
4872
|
parentForOverlay: this.elementRef,
|
|
4862
|
-
committing:
|
|
4863
|
-
commitFinished:
|
|
4873
|
+
committing: false,
|
|
4874
|
+
commitFinished: false
|
|
4864
4875
|
}, {
|
|
4865
4876
|
commitClick: function (event) { return _this.commitClick(event); },
|
|
4866
4877
|
cancelClick: function (event) { return _this.cancelClick(event); }
|
|
@@ -4935,8 +4946,10 @@
|
|
|
4935
4946
|
switch (_a.label) {
|
|
4936
4947
|
case 0:
|
|
4937
4948
|
this.keepFocus = true;
|
|
4938
|
-
this.
|
|
4939
|
-
|
|
4949
|
+
if (this._commitButtonsComponentRef) {
|
|
4950
|
+
this._commitButtonsComponentRef.instance.commitFinished = false;
|
|
4951
|
+
this._commitButtonsComponentRef.instance.committing = true;
|
|
4952
|
+
}
|
|
4940
4953
|
return [4 /*yield*/, this.commit(this.model)];
|
|
4941
4954
|
case 1:
|
|
4942
4955
|
success = _a.sent();
|
|
@@ -5138,12 +5151,15 @@
|
|
|
5138
5151
|
BaseInputComponent.prototype._commitFinished = function () {
|
|
5139
5152
|
var _this = this;
|
|
5140
5153
|
return new Promise(function (resolve) {
|
|
5141
|
-
_this.
|
|
5142
|
-
|
|
5143
|
-
|
|
5144
|
-
|
|
5145
|
-
|
|
5146
|
-
|
|
5154
|
+
if (_this._commitButtonsComponentRef) {
|
|
5155
|
+
_this._commitButtonsComponentRef.instance.commitFinished = true;
|
|
5156
|
+
_this._commitButtonsComponentRef.instance.committing = false;
|
|
5157
|
+
setTimeout(function () {
|
|
5158
|
+
// this._commitButtonsComponentRef.instance.commitFinished = false;
|
|
5159
|
+
_this.overlayService.removeComponent(_this._commitButtonsComponentRef);
|
|
5160
|
+
resolve();
|
|
5161
|
+
}, 800);
|
|
5162
|
+
}
|
|
5147
5163
|
});
|
|
5148
5164
|
};
|
|
5149
5165
|
BaseInputComponent.prototype._clearErrorComponent = function () {
|
|
@@ -9004,7 +9020,7 @@
|
|
|
9004
9020
|
InputTextareaComponent.decorators = [
|
|
9005
9021
|
{ type: i0.Component, args: [{
|
|
9006
9022
|
selector: 'co-input-textarea',
|
|
9007
|
-
template: "\n <label [textContent]=\"placeholder\"></label>\n
|
|
9023
|
+
template: "\n <div class=\"input-textarea-wrapper\" overlayParent #parentForOverlay=\"overlayParent\">\n <label [textContent]=\"placeholder\"></label>\n <textarea\n #input\n type=\"textarea\"\n [ngModel]=\"model\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n (ngModelChange)=\"modelChange.emit($event)\"\n ></textarea>\n </div>\n<!--\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-->\n <div class=\"required-indicator\"></div>\n ",
|
|
9008
9024
|
providers: [
|
|
9009
9025
|
OverlayService, {
|
|
9010
9026
|
provide: SCREEN_CONFIG_ADAPTER_COMPONENT_INTERFACE_NAME,
|
|
@@ -9043,7 +9059,8 @@
|
|
|
9043
9059
|
common.CommonModule,
|
|
9044
9060
|
forms.FormsModule,
|
|
9045
9061
|
ValidationErrorModule,
|
|
9046
|
-
CommitButtonsModule
|
|
9062
|
+
CommitButtonsModule,
|
|
9063
|
+
OverlayModule
|
|
9047
9064
|
],
|
|
9048
9065
|
declarations: [
|
|
9049
9066
|
InputTextareaComponent
|
|
@@ -12261,7 +12278,7 @@
|
|
|
12261
12278
|
}
|
|
12262
12279
|
};
|
|
12263
12280
|
ListOfValuesComponent.prototype.clearModel = function (event) {
|
|
12264
|
-
this.
|
|
12281
|
+
this.setModel([]);
|
|
12265
12282
|
};
|
|
12266
12283
|
ListOfValuesComponent.prototype.toggleSelect = function () {
|
|
12267
12284
|
if (this.readonly) {
|
|
@@ -12347,7 +12364,7 @@
|
|
|
12347
12364
|
ListOfValuesComponent.decorators = [
|
|
12348
12365
|
{ type: i0.Component, args: [{
|
|
12349
12366
|
selector: 'co-list-of-values',
|
|
12350
|
-
template: "\n <co-input-text aria-haspopup=\"listbox\" [attr.aria-expanded]=\"isSelectOpen\" aria-controls=\"lov-popup\" role=\"combobox\"\n class=\"no-focus-line\"\n overlayParent\n #parentForOverlay=\"overlayParent\" type=\"text\" [id]=\"label\"\n [model]=\"multiselect ? selectedModels : selectedModel\"\n [placeholder]=\"label\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [required]=\"required\"\n [noClickFocus]=\"true\"\n [leftIconData]=\"leftIconData\"\n [rightIcon]=\"isSelectOpen ? icons.
|
|
12367
|
+
template: "\n <co-input-text aria-haspopup=\"listbox\" [attr.aria-expanded]=\"isSelectOpen\" aria-controls=\"lov-popup\" role=\"combobox\"\n class=\"no-focus-line\"\n overlayParent\n #parentForOverlay=\"overlayParent\" type=\"text\" [id]=\"label\"\n [model]=\"multiselect ? selectedModels : selectedModel\"\n [placeholder]=\"label\"\n [readonly]=\"readonly\"\n [disabled]=\"disabled\"\n [required]=\"required\"\n [noClickFocus]=\"true\"\n [leftIconData]=\"leftIconData\"\n [rightIcon]=\"isSelectOpen ? icons.ChevronUpRegular : icons.ChevronDownRegular\"\n [showClearButton]=\"true\"\n [useContent]=\"multiselect\"\n (modelChange)=\"handleInputModelChange($event)\"\n (click)=\"openPopup()\"\n (rightIconClick)=\"toggleSelect()\"\n (keydown)=\"handleInputKeyDown($event)\"\n (clearIconClick)=\"clearModel($event)\"\n >\n </co-input-text>\n <ng-container *ngIf=\"multiselect\">\n <div class=\"multiselect-chips-wrapper\">\n <div class=\"chips\" *ngFor=\"let chip of model\">\n <span class=\"chips-description\" [textContent]=\"chip[displayField]\"></span>\n <co-icon class=\"remove-chip-icon\" [icon]=\"icons.CrossSkinny\" (click)=\"removeOptionFromModel(chip)\"></co-icon>\n </div>\n </div>\n </ng-container>\n ",
|
|
12351
12368
|
providers: [
|
|
12352
12369
|
OverlayService
|
|
12353
12370
|
],
|