@seniorsistemas/angular-components 17.30.0-bugfix-sds-382-3a1f0399 → 17.30.0-bugfix-sds-382-9df8362e

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.
@@ -19293,8 +19293,7 @@
19293
19293
  }());
19294
19294
 
19295
19295
  var ObjectCardComponent = /** @class */ (function () {
19296
- function ObjectCardComponent(elementRef) {
19297
- this.elementRef = elementRef;
19296
+ function ObjectCardComponent() {
19298
19297
  this.id = "s-object-card-" + ObjectCardComponent_1.nextId++;
19299
19298
  this.expanded = false;
19300
19299
  this.expandTooltip = "Abrir painel";
@@ -19306,42 +19305,32 @@
19306
19305
  this.EnumSeverity = exports.EnumSeverity;
19307
19306
  }
19308
19307
  ObjectCardComponent_1 = ObjectCardComponent;
19309
- ObjectCardComponent.prototype.ngAfterViewInit = function () { };
19310
19308
  ObjectCardComponent.prototype.ngAfterContentChecked = function () {
19311
19309
  this.update();
19312
19310
  };
19313
19311
  ObjectCardComponent.prototype.update = function () {
19314
- var e_1, _a;
19315
19312
  var windowWidth = window.innerWidth;
19316
- var containerWidth = this.elementRef.nativeElement.offsetWidth;
19317
- var mainFieldWidth = containerWidth * 0.3 > 260 ? containerWidth * 0.3 : 260;
19313
+ var containerWidth = this.container.nativeElement.getBoundingClientRect().width;
19314
+ var mainFieldWidth = this.cardMainContainer.nativeElement.getBoundingClientRect().width;
19315
+ var remainingSpace = containerWidth - mainFieldWidth;
19318
19316
  var fieldsMinWidth = this.fieldsMinWidth;
19319
- var expandIconWidth = 50;
19320
- var fieldElementList = this.elementRef.nativeElement.getElementsByClassName("s-object-card-field");
19321
- try {
19322
- for (var fieldElementList_1 = __values(fieldElementList), fieldElementList_1_1 = fieldElementList_1.next(); !fieldElementList_1_1.done; fieldElementList_1_1 = fieldElementList_1.next()) {
19323
- var element = fieldElementList_1_1.value;
19324
- element.style.minWidth = this.fieldsMinWidth + "px";
19325
- }
19326
- }
19327
- catch (e_1_1) { e_1 = { error: e_1_1 }; }
19328
- finally {
19329
- try {
19330
- if (fieldElementList_1_1 && !fieldElementList_1_1.done && (_a = fieldElementList_1.return)) _a.call(fieldElementList_1);
19331
- }
19332
- finally { if (e_1) throw e_1.error; }
19333
- }
19317
+ var expandIconWidth = this.iconContainer.nativeElement.getBoundingClientRect().width;
19334
19318
  var maxFieldQtd;
19335
- if (windowWidth <= Breakpoints.SM_MAX)
19319
+ if (windowWidth <= Breakpoints.SM_MAX) {
19336
19320
  maxFieldQtd = 0;
19337
- else
19338
- maxFieldQtd = Math.floor((containerWidth - mainFieldWidth) / fieldsMinWidth);
19339
- if (maxFieldQtd && maxFieldQtd < this.fields.length) {
19340
- maxFieldQtd = Math.floor((containerWidth - mainFieldWidth - expandIconWidth) / fieldsMinWidth);
19321
+ }
19322
+ else {
19323
+ maxFieldQtd = Math.floor((remainingSpace) / fieldsMinWidth);
19324
+ }
19325
+ var hasExpandIcon = maxFieldQtd && maxFieldQtd < this.fields.length;
19326
+ if (hasExpandIcon) {
19327
+ remainingSpace = remainingSpace - expandIconWidth;
19328
+ maxFieldQtd = Math.floor((remainingSpace) / fieldsMinWidth);
19341
19329
  }
19342
19330
  this.maxVisibleFields = maxFieldQtd;
19343
- if (maxFieldQtd >= this.fields.length && this.expanded)
19331
+ if (maxFieldQtd >= this.fields.length && this.expanded) {
19344
19332
  this.collapse();
19333
+ }
19345
19334
  };
19346
19335
  ObjectCardComponent.prototype.toggle = function () {
19347
19336
  this.expanded ? this.collapse() : this.expand();
@@ -19356,9 +19345,6 @@
19356
19345
  };
19357
19346
  var ObjectCardComponent_1;
19358
19347
  ObjectCardComponent.nextId = 0;
19359
- ObjectCardComponent.ctorParameters = function () { return [
19360
- { type: core.ElementRef }
19361
- ]; };
19362
19348
  __decorate([
19363
19349
  core.Input()
19364
19350
  ], ObjectCardComponent.prototype, "id", void 0);
@@ -19389,10 +19375,19 @@
19389
19375
  __decorate([
19390
19376
  core.Input()
19391
19377
  ], ObjectCardComponent.prototype, "borderButtonOptions", void 0);
19378
+ __decorate([
19379
+ core.ViewChild('contentContainer', { static: true })
19380
+ ], ObjectCardComponent.prototype, "container", void 0);
19381
+ __decorate([
19382
+ core.ViewChild('cardMainContainer', { static: true })
19383
+ ], ObjectCardComponent.prototype, "cardMainContainer", void 0);
19384
+ __decorate([
19385
+ core.ViewChild('iconContainer', { static: true })
19386
+ ], ObjectCardComponent.prototype, "iconContainer", void 0);
19392
19387
  ObjectCardComponent = ObjectCardComponent_1 = __decorate([
19393
19388
  core.Component({
19394
19389
  selector: "s-object-card",
19395
- 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\"><ng-content select=\"s-object-card-main\"></ng-content></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\">\n <ng-container *ngTemplateOutlet=\"field.content\"></ng-container>\n </div>\n </div>\n\n <div\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\">\n <ng-container\n *ngTemplateOutlet=\"field.content\"\n ></ng-container>\n </div>\n </ng-container>\n </div>\n </div>\n</div>\n",
19390
+ 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",
19396
19391
  animations: [
19397
19392
  animations.trigger("expandableContent", [
19398
19393
  animations.state("*", animations.style({
@@ -19418,7 +19413,7 @@
19418
19413
  ]),
19419
19414
  ]),
19420
19415
  ],
19421
- 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:none;text-align:center;-ms-flex-align:center;align-items:center;cursor:pointer;width:25px;position:absolute;right:15px;height:25px;top:calc(50% - 12px)}.expand-icon{-ms-flex:1;flex:1}.object-content{display:-ms-flexbox;display:flex;width:100%}.s-object-card-main{-ms-flex-negative:0;flex-shrink:0;-ms-flex-positive:1;flex-grow:1;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}"]
19416
+ 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{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}"]
19422
19417
  })
19423
19418
  ], ObjectCardComponent);
19424
19419
  return ObjectCardComponent;