@seniorsistemas/angular-components 17.30.0-bugfix-sds-382-3a1f0399 → 17.30.0-bugfix-sds-382-9e3e9afc
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 +31 -32
- 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 -5
- package/components/utils/breakpoints.d.ts +7 -7
- package/esm2015/components/object-card/object-card.component.js +33 -23
- package/esm2015/components/utils/breakpoints.js +1 -1
- package/esm5/components/object-card/object-card.component.js +34 -35
- package/esm5/components/utils/breakpoints.js +1 -1
- package/fesm2015/seniorsistemas-angular-components.js +31 -21
- package/fesm2015/seniorsistemas-angular-components.js.map +1 -1
- package/fesm5/seniorsistemas-angular-components.js +31 -32
- package/fesm5/seniorsistemas-angular-components.js.map +1 -1
- package/package.json +1 -1
- package/seniorsistemas-angular-components.metadata.json +1 -1
|
@@ -19147,8 +19147,7 @@ var ObjectCardMainComponent = /** @class */ (function () {
|
|
|
19147
19147
|
}());
|
|
19148
19148
|
|
|
19149
19149
|
var ObjectCardComponent = /** @class */ (function () {
|
|
19150
|
-
function ObjectCardComponent(
|
|
19151
|
-
this.elementRef = elementRef;
|
|
19150
|
+
function ObjectCardComponent() {
|
|
19152
19151
|
this.id = "s-object-card-" + ObjectCardComponent_1.nextId++;
|
|
19153
19152
|
this.expanded = false;
|
|
19154
19153
|
this.expandTooltip = "Abrir painel";
|
|
@@ -19160,42 +19159,36 @@ var ObjectCardComponent = /** @class */ (function () {
|
|
|
19160
19159
|
this.EnumSeverity = EnumSeverity;
|
|
19161
19160
|
}
|
|
19162
19161
|
ObjectCardComponent_1 = ObjectCardComponent;
|
|
19163
|
-
ObjectCardComponent.prototype.ngAfterViewInit = function () { };
|
|
19164
19162
|
ObjectCardComponent.prototype.ngAfterContentChecked = function () {
|
|
19165
19163
|
this.update();
|
|
19166
19164
|
};
|
|
19167
19165
|
ObjectCardComponent.prototype.update = function () {
|
|
19168
|
-
var e_1, _a;
|
|
19169
19166
|
var windowWidth = window.innerWidth;
|
|
19170
|
-
var containerWidth = this.
|
|
19171
|
-
var mainFieldWidth =
|
|
19167
|
+
var containerWidth = this.container.nativeElement.getBoundingClientRect().width;
|
|
19168
|
+
var mainFieldWidth = this.cardMainContainer.nativeElement.getBoundingClientRect().width;
|
|
19169
|
+
var remainingSpace = containerWidth - mainFieldWidth;
|
|
19172
19170
|
var fieldsMinWidth = this.fieldsMinWidth;
|
|
19173
|
-
var expandIconWidth =
|
|
19174
|
-
var fieldElementList = this.elementRef.nativeElement.getElementsByClassName("s-object-card-field");
|
|
19175
|
-
try {
|
|
19176
|
-
for (var fieldElementList_1 = __values(fieldElementList), fieldElementList_1_1 = fieldElementList_1.next(); !fieldElementList_1_1.done; fieldElementList_1_1 = fieldElementList_1.next()) {
|
|
19177
|
-
var element = fieldElementList_1_1.value;
|
|
19178
|
-
element.style.minWidth = this.fieldsMinWidth + "px";
|
|
19179
|
-
}
|
|
19180
|
-
}
|
|
19181
|
-
catch (e_1_1) { e_1 = { error: e_1_1 }; }
|
|
19182
|
-
finally {
|
|
19183
|
-
try {
|
|
19184
|
-
if (fieldElementList_1_1 && !fieldElementList_1_1.done && (_a = fieldElementList_1.return)) _a.call(fieldElementList_1);
|
|
19185
|
-
}
|
|
19186
|
-
finally { if (e_1) throw e_1.error; }
|
|
19187
|
-
}
|
|
19171
|
+
var expandIconWidth = this.iconContainer.nativeElement.getBoundingClientRect().width;
|
|
19188
19172
|
var maxFieldQtd;
|
|
19189
|
-
if (windowWidth <= Breakpoints.SM_MAX)
|
|
19173
|
+
if (windowWidth <= Breakpoints.SM_MAX) {
|
|
19190
19174
|
maxFieldQtd = 0;
|
|
19191
|
-
|
|
19192
|
-
|
|
19193
|
-
|
|
19194
|
-
|
|
19175
|
+
}
|
|
19176
|
+
else {
|
|
19177
|
+
maxFieldQtd = Math.floor((remainingSpace) / fieldsMinWidth);
|
|
19178
|
+
}
|
|
19179
|
+
var hasExpandIcon = maxFieldQtd && maxFieldQtd < this.fields.length;
|
|
19180
|
+
if (hasExpandIcon) {
|
|
19181
|
+
this.iconContainer.nativeElement.style.display = 'flex';
|
|
19182
|
+
remainingSpace = remainingSpace - expandIconWidth;
|
|
19183
|
+
maxFieldQtd = Math.floor((remainingSpace) / fieldsMinWidth);
|
|
19184
|
+
}
|
|
19185
|
+
else {
|
|
19186
|
+
this.iconContainer.nativeElement.style.display = 'none';
|
|
19195
19187
|
}
|
|
19196
19188
|
this.maxVisibleFields = maxFieldQtd;
|
|
19197
|
-
if (maxFieldQtd >= this.fields.length && this.expanded)
|
|
19189
|
+
if (maxFieldQtd >= this.fields.length && this.expanded) {
|
|
19198
19190
|
this.collapse();
|
|
19191
|
+
}
|
|
19199
19192
|
};
|
|
19200
19193
|
ObjectCardComponent.prototype.toggle = function () {
|
|
19201
19194
|
this.expanded ? this.collapse() : this.expand();
|
|
@@ -19210,9 +19203,6 @@ var ObjectCardComponent = /** @class */ (function () {
|
|
|
19210
19203
|
};
|
|
19211
19204
|
var ObjectCardComponent_1;
|
|
19212
19205
|
ObjectCardComponent.nextId = 0;
|
|
19213
|
-
ObjectCardComponent.ctorParameters = function () { return [
|
|
19214
|
-
{ type: ElementRef }
|
|
19215
|
-
]; };
|
|
19216
19206
|
__decorate([
|
|
19217
19207
|
Input()
|
|
19218
19208
|
], ObjectCardComponent.prototype, "id", void 0);
|
|
@@ -19243,10 +19233,19 @@ var ObjectCardComponent = /** @class */ (function () {
|
|
|
19243
19233
|
__decorate([
|
|
19244
19234
|
Input()
|
|
19245
19235
|
], ObjectCardComponent.prototype, "borderButtonOptions", void 0);
|
|
19236
|
+
__decorate([
|
|
19237
|
+
ViewChild('contentContainer', { static: true })
|
|
19238
|
+
], ObjectCardComponent.prototype, "container", void 0);
|
|
19239
|
+
__decorate([
|
|
19240
|
+
ViewChild('cardMainContainer', { static: true })
|
|
19241
|
+
], ObjectCardComponent.prototype, "cardMainContainer", void 0);
|
|
19242
|
+
__decorate([
|
|
19243
|
+
ViewChild('iconContainer', { static: true })
|
|
19244
|
+
], ObjectCardComponent.prototype, "iconContainer", void 0);
|
|
19246
19245
|
ObjectCardComponent = ObjectCardComponent_1 = __decorate([
|
|
19247
19246
|
Component({
|
|
19248
19247
|
selector: "s-object-card",
|
|
19249
|
-
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\"
|
|
19248
|
+
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",
|
|
19250
19249
|
animations: [
|
|
19251
19250
|
trigger("expandableContent", [
|
|
19252
19251
|
state("*", style$7({
|
|
@@ -19272,7 +19271,7 @@ var ObjectCardComponent = /** @class */ (function () {
|
|
|
19272
19271
|
]),
|
|
19273
19272
|
]),
|
|
19274
19273
|
],
|
|
19275
|
-
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:
|
|
19274
|
+
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:-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}"]
|
|
19276
19275
|
})
|
|
19277
19276
|
], ObjectCardComponent);
|
|
19278
19277
|
return ObjectCardComponent;
|