@seniorsistemas/angular-components 17.31.0 → 17.31.2
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 +32 -47
- 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/object-card/object-card.component.d.ts +5 -6
- package/components/utils/breakpoints.d.ts +7 -7
- package/esm2015/components/object-card/object-card.component.js +33 -37
- package/esm2015/components/panel/panel.component.js +1 -1
- package/esm2015/components/utils/breakpoints.js +1 -1
- package/esm5/components/object-card/object-card.component.js +34 -49
- package/esm5/components/panel/panel.component.js +1 -1
- package/esm5/components/utils/breakpoints.js +1 -1
- package/fesm2015/seniorsistemas-angular-components.js +32 -36
- package/fesm2015/seniorsistemas-angular-components.js.map +1 -1
- package/fesm5/seniorsistemas-angular-components.js +32 -47
- package/fesm5/seniorsistemas-angular-components.js.map +1 -1
- package/package.json +1 -1
- package/seniorsistemas-angular-components.metadata.json +1 -1
|
@@ -19174,8 +19174,7 @@ var ObjectCardMainComponent = /** @class */ (function () {
|
|
|
19174
19174
|
}());
|
|
19175
19175
|
|
|
19176
19176
|
var ObjectCardComponent = /** @class */ (function () {
|
|
19177
|
-
function ObjectCardComponent(
|
|
19178
|
-
this.elementRef = elementRef;
|
|
19177
|
+
function ObjectCardComponent() {
|
|
19179
19178
|
this.id = "s-object-card-" + ObjectCardComponent_1.nextId++;
|
|
19180
19179
|
this.expanded = false;
|
|
19181
19180
|
this.expandTooltip = "Abrir painel";
|
|
@@ -19187,43 +19186,36 @@ var ObjectCardComponent = /** @class */ (function () {
|
|
|
19187
19186
|
this.EnumSeverity = EnumSeverity;
|
|
19188
19187
|
}
|
|
19189
19188
|
ObjectCardComponent_1 = ObjectCardComponent;
|
|
19190
|
-
ObjectCardComponent.prototype.ngAfterViewInit = function () {
|
|
19191
|
-
};
|
|
19192
19189
|
ObjectCardComponent.prototype.ngAfterContentChecked = function () {
|
|
19193
19190
|
this.update();
|
|
19194
19191
|
};
|
|
19195
19192
|
ObjectCardComponent.prototype.update = function () {
|
|
19196
|
-
var e_1, _a;
|
|
19197
19193
|
var windowWidth = window.innerWidth;
|
|
19198
|
-
var containerWidth = this.
|
|
19199
|
-
var mainFieldWidth =
|
|
19194
|
+
var containerWidth = this.container.nativeElement.getBoundingClientRect().width;
|
|
19195
|
+
var mainFieldWidth = this.cardMainContainer.nativeElement.getBoundingClientRect().width;
|
|
19196
|
+
var remainingSpace = containerWidth - mainFieldWidth;
|
|
19200
19197
|
var fieldsMinWidth = this.fieldsMinWidth;
|
|
19201
|
-
var expandIconWidth =
|
|
19202
|
-
var fieldElementList = this.elementRef.nativeElement.getElementsByClassName("s-object-card-field");
|
|
19203
|
-
try {
|
|
19204
|
-
for (var fieldElementList_1 = __values(fieldElementList), fieldElementList_1_1 = fieldElementList_1.next(); !fieldElementList_1_1.done; fieldElementList_1_1 = fieldElementList_1.next()) {
|
|
19205
|
-
var element = fieldElementList_1_1.value;
|
|
19206
|
-
element.style.minWidth = this.fieldsMinWidth + "px";
|
|
19207
|
-
}
|
|
19208
|
-
}
|
|
19209
|
-
catch (e_1_1) { e_1 = { error: e_1_1 }; }
|
|
19210
|
-
finally {
|
|
19211
|
-
try {
|
|
19212
|
-
if (fieldElementList_1_1 && !fieldElementList_1_1.done && (_a = fieldElementList_1.return)) _a.call(fieldElementList_1);
|
|
19213
|
-
}
|
|
19214
|
-
finally { if (e_1) throw e_1.error; }
|
|
19215
|
-
}
|
|
19198
|
+
var expandIconWidth = this.iconContainer.nativeElement.getBoundingClientRect().width;
|
|
19216
19199
|
var maxFieldQtd;
|
|
19217
|
-
if (windowWidth <= Breakpoints.SM_MAX)
|
|
19200
|
+
if (windowWidth <= Breakpoints.SM_MAX) {
|
|
19218
19201
|
maxFieldQtd = 0;
|
|
19219
|
-
|
|
19220
|
-
|
|
19221
|
-
|
|
19222
|
-
|
|
19202
|
+
}
|
|
19203
|
+
else {
|
|
19204
|
+
maxFieldQtd = Math.floor((remainingSpace) / fieldsMinWidth);
|
|
19205
|
+
}
|
|
19206
|
+
var hasExpandIcon = maxFieldQtd && maxFieldQtd < this.fields.length;
|
|
19207
|
+
if (hasExpandIcon) {
|
|
19208
|
+
this.iconContainer.nativeElement.style.display = 'flex';
|
|
19209
|
+
remainingSpace = remainingSpace - expandIconWidth;
|
|
19210
|
+
maxFieldQtd = Math.floor((remainingSpace) / fieldsMinWidth);
|
|
19211
|
+
}
|
|
19212
|
+
else {
|
|
19213
|
+
this.iconContainer.nativeElement.style.display = 'none';
|
|
19223
19214
|
}
|
|
19224
19215
|
this.maxVisibleFields = maxFieldQtd;
|
|
19225
|
-
if (maxFieldQtd >= this.fields.length && this.expanded)
|
|
19216
|
+
if (maxFieldQtd >= this.fields.length && this.expanded) {
|
|
19226
19217
|
this.collapse();
|
|
19218
|
+
}
|
|
19227
19219
|
};
|
|
19228
19220
|
ObjectCardComponent.prototype.toggle = function () {
|
|
19229
19221
|
this.expanded ? this.collapse() : this.expand();
|
|
@@ -19236,24 +19228,8 @@ var ObjectCardComponent = /** @class */ (function () {
|
|
|
19236
19228
|
this.expanded = false;
|
|
19237
19229
|
this.expandedChange.emit(this.expanded);
|
|
19238
19230
|
};
|
|
19239
|
-
ObjectCardComponent.prototype.getExpandedFieldWidth = function () {
|
|
19240
|
-
var containerWidth = this.elementRef.nativeElement.offsetWidth;
|
|
19241
|
-
var fieldsPerRow;
|
|
19242
|
-
if (containerWidth <= Breakpoints.SM_MAX)
|
|
19243
|
-
fieldsPerRow = 1;
|
|
19244
|
-
else if (containerWidth <= Breakpoints.MD_MAX)
|
|
19245
|
-
fieldsPerRow = 2;
|
|
19246
|
-
else if (containerWidth <= Breakpoints.LG_MAX)
|
|
19247
|
-
fieldsPerRow = 4;
|
|
19248
|
-
else
|
|
19249
|
-
fieldsPerRow = 6;
|
|
19250
|
-
return 12 / fieldsPerRow;
|
|
19251
|
-
};
|
|
19252
19231
|
var ObjectCardComponent_1;
|
|
19253
19232
|
ObjectCardComponent.nextId = 0;
|
|
19254
|
-
ObjectCardComponent.ctorParameters = function () { return [
|
|
19255
|
-
{ type: ElementRef }
|
|
19256
|
-
]; };
|
|
19257
19233
|
__decorate([
|
|
19258
19234
|
Input()
|
|
19259
19235
|
], ObjectCardComponent.prototype, "id", void 0);
|
|
@@ -19284,10 +19260,19 @@ var ObjectCardComponent = /** @class */ (function () {
|
|
|
19284
19260
|
__decorate([
|
|
19285
19261
|
Input()
|
|
19286
19262
|
], ObjectCardComponent.prototype, "borderButtonOptions", void 0);
|
|
19263
|
+
__decorate([
|
|
19264
|
+
ViewChild('contentContainer', { static: true })
|
|
19265
|
+
], ObjectCardComponent.prototype, "container", void 0);
|
|
19266
|
+
__decorate([
|
|
19267
|
+
ViewChild('cardMainContainer', { static: true })
|
|
19268
|
+
], ObjectCardComponent.prototype, "cardMainContainer", void 0);
|
|
19269
|
+
__decorate([
|
|
19270
|
+
ViewChild('iconContainer', { static: true })
|
|
19271
|
+
], ObjectCardComponent.prototype, "iconContainer", void 0);
|
|
19287
19272
|
ObjectCardComponent = ObjectCardComponent_1 = __decorate([
|
|
19288
19273
|
Component({
|
|
19289
19274
|
selector: "s-object-card",
|
|
19290
|
-
template: "<div [id]=\"id\" class=\"container\">\n <s-border-button\n *ngIf=\"\n borderButtonOptions?.visible\n ? borderButtonOptions?.visible(severity)\n : false\n \"\n [severity]=\"severity\"\n [options]=\"borderButtonOptions\"\n class=\"object-card__border-button\"\n [@BorderButtonAnimation]\n ></s-border-button>\n\n <div\n [id]=\"id + '-main-container'\"\n class=\"main-container\"\n [ngClass]=\"{\n 'with-hidden-fields': fields.length > maxVisibleFields,\n 'with-visible-fields': fields.length && maxVisibleFields,\n 'main-container--severity-default': severity === EnumSeverity.Default,\n 'main-container--severity-info': severity === EnumSeverity.Info,\n 'main-container--severity-warn': severity === EnumSeverity.Warn,\n 'main-container--severity-error': severity === EnumSeverity.Error,\n 'main-container--severity-success': severity == EnumSeverity.Success\n }\"\n >\n <div class=\"object-content\">\n <div class=\"s-object-card-main\"
|
|
19275
|
+
template: "<div [id]=\"id\" class=\"container\">\n <s-border-button\n *ngIf=\"\n borderButtonOptions?.visible\n ? borderButtonOptions?.visible(severity)\n : false\n \"\n [severity]=\"severity\"\n [options]=\"borderButtonOptions\"\n class=\"object-card__border-button\"\n [@BorderButtonAnimation]\n ></s-border-button>\n\n <div\n [id]=\"id + '-main-container'\"\n class=\"main-container\"\n #contentContainer\n [ngClass]=\"{\n 'with-hidden-fields': fields.length > maxVisibleFields,\n 'with-visible-fields': fields.length && maxVisibleFields,\n 'main-container--severity-default': severity === EnumSeverity.Default,\n 'main-container--severity-info': severity === EnumSeverity.Info,\n 'main-container--severity-warn': severity === EnumSeverity.Warn,\n 'main-container--severity-error': severity === EnumSeverity.Error,\n 'main-container--severity-success': severity == EnumSeverity.Success\n }\"\n >\n <div class=\"object-content\">\n <div class=\"s-object-card-main\" #cardMainContainer [style.min-width.px]=\"fieldsMinWidth\">\n <ng-content select=\"s-object-card-main\"></ng-content>\n </div>\n\n <div class=\"divider\" *ngIf=\"maxVisibleFields && fields.length\"></div>\n\n <div *ngFor=\"let field of (fields.toArray() | slice: 0:maxVisibleFields)\" class=\"s-object-card-field\" [style.min-width.px]=\"fieldsMinWidth\">\n \n <ng-container *ngTemplateOutlet=\"field.content\"></ng-container>\n </div>\n </div>\n\n <div\n #iconContainer\n [id]=\"id + '-expand-icon-container'\"\n class=\"expand-icon-container\"\n (click)=\"toggle()\"\n [pTooltip]=\"expanded ? collapseTooltip : expandTooltip\"\n tooltipPosition=\"top\"\n [showDelay]=\"500\"\n >\n <span [id]=\"id + '-expand-icon'\" class=\"expand-icon fa\" [ngClass]=\"{ 'fa-minus': expanded, 'fa-plus': !expanded }\"></span>\n </div>\n </div>\n\n <div\n [id]=\"id + '-expandable-container'\"\n [@expandableContent]=\"expanded\"\n class=\"expandable-container\"\n [ngClass]=\"{\n 'expandable-container--severity-default':\n severity === EnumSeverity.Default,\n 'expandable-container--severity-info': severity === EnumSeverity.Info,\n 'expandable-container--severity-warn': severity === EnumSeverity.Warn,\n 'expandable-container--severity-error': severity === EnumSeverity.Error,\n 'expandable-container--severity-success':\n severity == EnumSeverity.Success\n }\"\n >\n <div class=\"childlist\">\n <ng-container\n *ngFor=\"\n let field of fields.toArray()\n | slice : maxVisibleFields : fields.length\n \"\n >\n <div class=\"s-object-card-field\" [style.min-width.px]=\"fieldsMinWidth\">\n <ng-container\n *ngTemplateOutlet=\"field.content\"\n ></ng-container>\n </div>\n </ng-container>\n </div>\n </div>\n</div>\n",
|
|
19291
19276
|
animations: [
|
|
19292
19277
|
trigger("expandableContent", [
|
|
19293
19278
|
state("*", style$7({
|
|
@@ -19313,7 +19298,7 @@ var ObjectCardComponent = /** @class */ (function () {
|
|
|
19313
19298
|
]),
|
|
19314
19299
|
]),
|
|
19315
19300
|
],
|
|
19316
|
-
styles: [":host{display:block}.container{margin-bottom:20px;position:relative}.main-container{display:-ms-flexbox;display:flex}.expandable-container,.main-container{background-color:#fff;border:1px solid #ccc;position:relative;overflow:hidden;width:100%}.expandable-container--severity-default{border-color:#ccc;border-top:initial}.expandable-container--severity-info{transition:border-color .5s;border-color:#428bca;border-top:initial}.expandable-container--severity-warn{transition:border-color .5s;border-color:#f8931f;border-top:initial}.expandable-container--severity-error{transition:border-color .5s;border-color:#c13018;border-top:initial}.expandable-container--severity-success{transition:border-color .5s;border-color:#0c9348;border-top:initial}.main-container--severity-default{border-color:#ccc}.main-container--severity-info{transition:border-color .5s;border-color:#428bca}.main-container--severity-warn{transition:border-color .5s;border-color:#f8931f}.main-container--severity-error{transition:border-color .5s;border-color:#c13018}.main-container--severity-success{transition:border-color .5s;border-color:#0c9348}.object-card__border-button{position:absolute;top:-13px;right:15px;z-index:1}.expandable-container{border-top:none;box-shadow:inset 0 6px 4px -4px #ddd;margin-top:-1px}.expand-icon-container{display:
|
|
19301
|
+
styles: [":host{display:block}:host::ng-deep .sds-badge{height:auto;white-space:normal}.container{margin-bottom:20px;position:relative}.main-container{display:-ms-flexbox;display:flex}.expandable-container,.main-container{background-color:#fff;border:1px solid #ccc;position:relative;overflow:hidden;width:100%}.expandable-container--severity-default{border-color:#ccc;border-top:initial}.expandable-container--severity-info{transition:border-color .5s;border-color:#428bca;border-top:initial}.expandable-container--severity-warn{transition:border-color .5s;border-color:#f8931f;border-top:initial}.expandable-container--severity-error{transition:border-color .5s;border-color:#c13018;border-top:initial}.expandable-container--severity-success{transition:border-color .5s;border-color:#0c9348;border-top:initial}.main-container--severity-default{border-color:#ccc}.main-container--severity-info{transition:border-color .5s;border-color:#428bca}.main-container--severity-warn{transition:border-color .5s;border-color:#f8931f}.main-container--severity-error{transition:border-color .5s;border-color:#c13018}.main-container--severity-success{transition:border-color .5s;border-color:#0c9348}.object-card__border-button{position:absolute;top:-13px;right:15px;z-index:1}.expandable-container{border-top:none;box-shadow:inset 0 6px 4px -4px #ddd;margin-top:-1px}.expand-icon-container{display:-ms-flexbox;display:flex;text-align:center;-ms-flex-align:center;align-items:center;cursor:pointer;padding:12px}.expand-icon{-ms-flex:1;flex:1}.object-content{display:-ms-flexbox;display:flex;width:100%}.s-object-card-main{overflow:hidden;padding:15px}.main-container.with-visible-fields .s-object-card-main{max-width:30%}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){.main-container.with-visible-fields .s-object-card-main{width:20%}}.s-object-card-field{overflow:hidden;height:100%}.main-container .s-object-card-field{padding:15px}.main-container .divider{width:1px;-ms-flex-negative:0;flex-shrink:0;background-color:#ccc;margin:15px -1px 15px 0}.main-container.with-hidden-fields .object-content{width:calc(100% - 35px)}.main-container.with-hidden-fields .expand-icon-container{display:-ms-flexbox;display:flex}::ng-deep .object-card-button{padding-left:0!important;padding-right:10px!important;border:none!important;height:auto!important;min-width:auto!important;text-align:left!important}@media (max-width:767px){.s-object-card-main{max-width:calc(100% - 50px)}}.childlist{width:100%;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;padding:1em;gap:1em}"]
|
|
19317
19302
|
})
|
|
19318
19303
|
], ObjectCardComponent);
|
|
19319
19304
|
return ObjectCardComponent;
|
|
@@ -19440,7 +19425,7 @@ var PanelComponent = /** @class */ (function () {
|
|
|
19440
19425
|
]),
|
|
19441
19426
|
]),
|
|
19442
19427
|
],
|
|
19443
|
-
styles: [".panel{background-color:#fff;border:1px solid #dedce5;padding:20px;position:relative;transition:border-color .5s}.panel .border-button{position:absolute;right:15px;top:-12px;z-index:10}.panel .header{border-bottom:1px solid #dedce5;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:12px;margin-bottom:12px;text-transform:uppercase}.panel .header-content{-ms-flex-positive:1;flex-grow:1}.panel .header .collapse-button{background-color:transparent;border:none;color:#212533;cursor:pointer;height:24px;width:24px}.panel .panel-content .footer{border-top:1px solid #dedce5;padding-top:12px}.panel--success{border-color:#0c9348}.panel--info{border-color:#428bca}.panel--warn{border-color:#f8931f}.panel--error{border-color:#c13018}.panel--collapsed .header{border:none;padding:0}"]
|
|
19428
|
+
styles: [".panel{background-color:#fff;border:1px solid #dedce5;padding:20px;position:relative;transition:border-color .5s}.panel .border-button{position:absolute;right:15px;top:-12px;z-index:10}.panel .header{border-bottom:1px solid #dedce5;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:12px;margin-bottom:12px;text-transform:uppercase}.panel .header-content{-ms-flex-positive:1;flex-grow:1}.panel .header .collapse-button{background-color:transparent;border:none;color:#212533;cursor:pointer;height:24px;width:24px}.panel .panel-content .footer{border-top:1px solid #dedce5;padding-top:12px}.panel--success{border-color:#0c9348}.panel--info{border-color:#428bca}.panel--warn{border-color:#f8931f}.panel--error{border-color:#c13018}.panel--collapsed .header{border:none;padding:0;margin:0}"]
|
|
19444
19429
|
})
|
|
19445
19430
|
], PanelComponent);
|
|
19446
19431
|
return PanelComponent;
|