@seniorsistemas/angular-components 17.20.0 → 17.21.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/bundles/seniorsistemas-angular-components.umd.js +10 -2
- package/bundles/seniorsistemas-angular-components.umd.js.map +1 -1
- package/bundles/seniorsistemas-angular-components.umd.min.js +1 -1
- package/bundles/seniorsistemas-angular-components.umd.min.js.map +1 -1
- package/components/accordion/components/accordion-panel/accordion-panel.component.d.ts +2 -0
- package/esm2015/components/accordion/components/accordion-panel/accordion-panel.component.js +11 -3
- package/esm5/components/accordion/components/accordion-panel/accordion-panel.component.js +11 -3
- package/fesm2015/seniorsistemas-angular-components.js +10 -2
- package/fesm2015/seniorsistemas-angular-components.js.map +1 -1
- package/fesm5/seniorsistemas-angular-components.js +10 -2
- package/fesm5/seniorsistemas-angular-components.js.map +1 -1
- package/package.json +1 -1
- package/seniorsistemas-angular-components.metadata.json +1 -1
|
@@ -64,6 +64,8 @@ var AccordionPanelComponent = /** @class */ (function () {
|
|
|
64
64
|
function AccordionPanelComponent() {
|
|
65
65
|
this.disabled = false;
|
|
66
66
|
this.cache = false;
|
|
67
|
+
this.validationMessageIcon = 'fas fa-exclamation-circle';
|
|
68
|
+
this.validationMessageIconColor = 'Red';
|
|
67
69
|
this.panelOpened = new EventEmitter();
|
|
68
70
|
this.panelClosed = new EventEmitter();
|
|
69
71
|
this.isAnimating = false;
|
|
@@ -145,6 +147,12 @@ var AccordionPanelComponent = /** @class */ (function () {
|
|
|
145
147
|
__decorate([
|
|
146
148
|
Input()
|
|
147
149
|
], AccordionPanelComponent.prototype, "cache", void 0);
|
|
150
|
+
__decorate([
|
|
151
|
+
Input()
|
|
152
|
+
], AccordionPanelComponent.prototype, "validationMessageIcon", void 0);
|
|
153
|
+
__decorate([
|
|
154
|
+
Input()
|
|
155
|
+
], AccordionPanelComponent.prototype, "validationMessageIconColor", void 0);
|
|
148
156
|
__decorate([
|
|
149
157
|
Output()
|
|
150
158
|
], AccordionPanelComponent.prototype, "panelOpened", void 0);
|
|
@@ -154,7 +162,7 @@ var AccordionPanelComponent = /** @class */ (function () {
|
|
|
154
162
|
AccordionPanelComponent = __decorate([
|
|
155
163
|
Component({
|
|
156
164
|
selector: "s-accordion-panel",
|
|
157
|
-
template: "<div\n class=\"accordion-panel\"\n [ngClass]=\"{\n 'accordion-panel--open': isOpen,\n 'accordion-panel--disabled': disabled\n }\">\n <div class=\"header\" (click)=\"onTabClick()\">\n <div class=\"header__title\">\n <span class=\"icon\" [ngClass]=\"isOpen ? 'fas fa-minus' : 'fas fa-plus'\"></span>\n <span\n *ngIf=\"validationMessage\"\n class=\"exclamation-icon
|
|
165
|
+
template: "<div\n class=\"accordion-panel\"\n [ngClass]=\"{\n 'accordion-panel--open': isOpen,\n 'accordion-panel--disabled': disabled\n }\">\n <div class=\"header\" (click)=\"onTabClick()\">\n <div class=\"header__title\">\n <span class=\"icon\" [ngClass]=\"isOpen ? 'fas fa-minus' : 'fas fa-plus'\"></span>\n <span\n *ngIf=\"validationMessage\"\n class=\"exclamation-icon\"\n [class]=\"validationMessageIcon\"\n [class.exclamation-icon-red]=\"validationMessageIconColor === 'Red'\"\n [class.exclamation-icon-orange]=\"validationMessageIconColor === 'Orange'\"\n [class.exclamation-icon-yellow]=\"validationMessageIconColor === 'Yellow'\"\n [class.exclamation-icon-green]=\"validationMessageIconColor === 'Green'\"\n [class.exclamation-icon-blue]=\"validationMessageIconColor === 'Blue'\"\n [sTooltip]=\"validationMessage\">\n </span>\n <span class=\"title\">{{ header }}</span>\n </div>\n <div class=\"header__controls\">\n <button\n *ngFor=\"let button of buttons\"\n class=\"icon-button\"\n [ngClass]=\"button.icon\"\n (click)=\"onIconButtonsClick($event, button.onClick)\">\n </button>\n <s-switch\n *ngIf=\"switchControl\"\n class=\"switch\"\n [formControl]=\"switchControl\"\n (click)=\"$event.stopPropagation()\">\n </s-switch>\n <s-switch\n *ngIf=\"!switchControl && switch\"\n class=\"switch\"\n [disabled]=\"disabled\"\n [(ngModel)]=\"switch.state\"\n (click)=\"$event.stopPropagation()\"\n (valueChanged)=\"switch.onChange($event)\">\n </s-switch>\n </div>\n </div>\n <ng-container *ngIf=\"cache; then cacheTemplate else cachelessTemplate\"></ng-container>\n</div>\n\n<ng-template #cacheTemplate>\n <div\n class=\"content\"\n [@cacheAnimation]=\"isOpen\"\n [@.disabled]=\"isContentAnimationDisabled\"\n (@cacheAnimation.start)=\"onContentAnimationStart()\"\n (@cacheAnimation.done)=\"onContentAnimationDone()\">\n <div class=\"content-container\">\n <ng-container [ngTemplateOutlet]=\"panelContent\"></ng-container>\n </div>\n </div>\n</ng-template>\n\n<ng-template #cachelessTemplate>\n <div\n *ngIf=\"isOpen\"\n class=\"content\"\n @cachelessAnimation\n [@.disabled]=\"isContentAnimationDisabled\"\n (@cachelessAnimation.start)=\"onContentAnimationStart()\"\n (@cachelessAnimation.done)=\"onContentAnimationDone()\">\n <div class=\"content-container\">\n <ng-container [ngTemplateOutlet]=\"panelContent\"></ng-container>\n </div>\n </div>\n</ng-template>\n\n<ng-template #panelContent>\n <ng-content></ng-content>\n</ng-template>\n",
|
|
158
166
|
animations: [
|
|
159
167
|
trigger("cachelessAnimation", [
|
|
160
168
|
transition(":enter", [style$7({ height: "0" }), animate("200ms linear", style$7({ height: "*" }))]),
|
|
@@ -166,7 +174,7 @@ var AccordionPanelComponent = /** @class */ (function () {
|
|
|
166
174
|
transition("* => *", animate("200ms")),
|
|
167
175
|
]),
|
|
168
176
|
],
|
|
169
|
-
styles: [".accordion-panel{border-bottom:1px solid #c1c1cc}.accordion-panel .header{-ms-flex-align:center;align-items:center;background-color:#fff;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding:16px;-webkit-user-select:none;-ms-user-select:none;user-select:none}.accordion-panel .header .header__title{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.accordion-panel .header .header__title .icon{color:#212533;font-size:1rem;margin-right:12px}.accordion-panel .header .header__title .exclamation-icon{
|
|
177
|
+
styles: [".accordion-panel{border-bottom:1px solid #c1c1cc}.accordion-panel .header{-ms-flex-align:center;align-items:center;background-color:#fff;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding:16px;-webkit-user-select:none;-ms-user-select:none;user-select:none}.accordion-panel .header .header__title{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.accordion-panel .header .header__title .icon{color:#212533;font-size:1rem;margin-right:12px}.accordion-panel .header .header__title .exclamation-icon{font-size:1rem;margin-right:12px}.accordion-panel .header .header__title .exclamation-icon-red{color:#c13018}.accordion-panel .header .header__title .exclamation-icon-orange{color:#f8931f}.accordion-panel .header .header__title .exclamation-icon-yellow{color:#fcbf10}.accordion-panel .header .header__title .exclamation-icon-green{color:#0c9348}.accordion-panel .header .header__title .exclamation-icon-blue{color:#428bca}.accordion-panel .header .header__title .title{font-family:\"Open Sans\" sans-serif;font-size:.875rem;font-weight:700;line-height:150%;text-transform:uppercase}.accordion-panel .header .header__controls{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;margin-left:16px}.accordion-panel .header .header__controls .icon-button{color:#212533;cursor:pointer;font-size:1rem;margin-left:12px;padding:4px;border:none;background:0 0}.accordion-panel .header .header__controls .switch{padding-left:16px}.accordion-panel .content{background-color:#fff;overflow:hidden}.accordion-panel .content .content-container{margin:20px}.accordion-panel--open .header{background-color:#eeebf2;border-bottom:1px solid #c1c1cc}.accordion-panel--disabled .header{cursor:auto}.accordion-panel--disabled .header .header__title .icon,.accordion-panel--disabled .header .header__title .title{color:#c1c1cc}.accordion-panel--disabled .header .header__controls .icon-button{color:#c1c1cc;cursor:auto}.accordion-panel--disabled .exclamation-icon{opacity:.5}"]
|
|
170
178
|
})
|
|
171
179
|
], AccordionPanelComponent);
|
|
172
180
|
return AccordionPanelComponent;
|