@seniorsistemas/angular-components 17.7.1 → 17.7.3

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.
Files changed (28) hide show
  1. package/bundles/seniorsistemas-angular-components.umd.js +62 -12
  2. package/bundles/seniorsistemas-angular-components.umd.js.map +1 -1
  3. package/bundles/seniorsistemas-angular-components.umd.min.js +2 -2
  4. package/bundles/seniorsistemas-angular-components.umd.min.js.map +1 -1
  5. package/components/timeline/components/horizontal-timeline/horizontal-timeline.component.d.ts +1 -0
  6. package/components/timeline/components/timeline-icon-item/timeline-icon-item.component.d.ts +1 -0
  7. package/components/timeline/components/vertical-timeline/components/vertical-items/vertical-items.component.d.ts +1 -0
  8. package/components/timeline/components/vertical-timeline/vertical-timeline.component.d.ts +1 -0
  9. package/components/timeline/timeline.component.d.ts +1 -0
  10. package/components/workspace-switch/workspace-switch.component.d.ts +10 -3
  11. package/esm2015/components/timeline/components/horizontal-timeline/horizontal-timeline.component.js +6 -3
  12. package/esm2015/components/timeline/components/timeline-icon-item/timeline-icon-item.component.js +6 -3
  13. package/esm2015/components/timeline/components/vertical-timeline/components/vertical-items/vertical-items.component.js +5 -2
  14. package/esm2015/components/timeline/components/vertical-timeline/vertical-timeline.component.js +5 -2
  15. package/esm2015/components/timeline/timeline.component.js +6 -2
  16. package/esm2015/components/workspace-switch/workspace-switch.component.js +37 -7
  17. package/esm5/components/timeline/components/horizontal-timeline/horizontal-timeline.component.js +6 -3
  18. package/esm5/components/timeline/components/timeline-icon-item/timeline-icon-item.component.js +6 -3
  19. package/esm5/components/timeline/components/vertical-timeline/components/vertical-items/vertical-items.component.js +5 -2
  20. package/esm5/components/timeline/components/vertical-timeline/vertical-timeline.component.js +5 -2
  21. package/esm5/components/timeline/timeline.component.js +6 -2
  22. package/esm5/components/workspace-switch/workspace-switch.component.js +41 -7
  23. package/fesm2015/seniorsistemas-angular-components.js +59 -13
  24. package/fesm2015/seniorsistemas-angular-components.js.map +1 -1
  25. package/fesm5/seniorsistemas-angular-components.js +63 -13
  26. package/fesm5/seniorsistemas-angular-components.js.map +1 -1
  27. package/package.json +1 -1
  28. package/seniorsistemas-angular-components.metadata.json +1 -1
@@ -16935,6 +16935,7 @@
16935
16935
  var MIN_ITEM_SIZE = 200;
16936
16936
  var TimelineComponent = /** @class */ (function () {
16937
16937
  function TimelineComponent() {
16938
+ this.highlightActiveItem = true;
16938
16939
  this.direction = HORIZONTAL;
16939
16940
  this.collapsable = true;
16940
16941
  this.counterLabel = "items";
@@ -16973,6 +16974,9 @@
16973
16974
  __decorate([
16974
16975
  core.Input()
16975
16976
  ], TimelineComponent.prototype, "activeIndex", void 0);
16977
+ __decorate([
16978
+ core.Input()
16979
+ ], TimelineComponent.prototype, "highlightActiveItem", void 0);
16976
16980
  __decorate([
16977
16981
  core.Input()
16978
16982
  ], TimelineComponent.prototype, "direction", void 0);
@@ -16988,7 +16992,7 @@
16988
16992
  TimelineComponent = __decorate([
16989
16993
  core.Component({
16990
16994
  selector: "s-timeline",
16991
- template: "<div *ngIf=\"changeToVertical(); then vertical else horizontal\"></div>\n\n<ng-template #horizontal>\n <s-horizontal-timeline *ngIf=\"items?.length\"\n [items]=\"items\"\n [activeIndex]=\"activeIndex\">\n </s-horizontal-timeline>\n</ng-template>\n\n<ng-template #vertical>\n <s-vertical-timeline *ngIf=\"items?.length\"\n [items]=\"items\"\n [activeIndex]=\"activeIndex\"\n [counterLabel]=\"counterLabel\"\n [collapsable]=\"collapsable\">\n </s-vertical-timeline>\n</ng-template>"
16995
+ template: "<div *ngIf=\"changeToVertical(); then vertical else horizontal\"></div>\n\n<ng-template #horizontal>\n <s-horizontal-timeline *ngIf=\"items?.length\"\n [items]=\"items\"\n [activeIndex]=\"activeIndex\"\n [highlightActiveItem]=\"highlightActiveItem\">\n </s-horizontal-timeline>\n</ng-template>\n\n<ng-template #vertical>\n <s-vertical-timeline *ngIf=\"items?.length\"\n [items]=\"items\"\n [activeIndex]=\"activeIndex\"\n highlightActiveItem=\"hi\"\n [counterLabel]=\"counterLabel\"\n [collapsable]=\"collapsable\"\n [highlightActiveItem]=\"highlightActiveItem\">\n </s-vertical-timeline>\n</ng-template>"
16992
16996
  })
16993
16997
  ], TimelineComponent);
16994
16998
  return TimelineComponent;
@@ -17003,14 +17007,17 @@
17003
17007
  __decorate([
17004
17008
  core.Input()
17005
17009
  ], TimelineIconItemComponent.prototype, "isActive", void 0);
17010
+ __decorate([
17011
+ core.Input()
17012
+ ], TimelineIconItemComponent.prototype, "highlightActive", void 0);
17006
17013
  __decorate([
17007
17014
  core.Input()
17008
17015
  ], TimelineIconItemComponent.prototype, "isComplete", void 0);
17009
17016
  TimelineIconItemComponent = __decorate([
17010
17017
  core.Component({
17011
17018
  selector: "s-timeline-icon-item",
17012
- template: "<ng-container *ngIf=\"item\">\n <div\n class=\"timeline__icon-item\"\n [ngClass]=\"{\n 'timeline__icon-item--small': item.testSize('small'),\n 'timeline__icon-item--normal': item.testSize('normal'),\n 'timeline__icon-item--warning': item.testSeverity('warning'),\n 'timeline__icon-item--error': item.testSeverity('error'),\n 'timeline__icon-item--completed': isComplete,\n 'timeline__icon-item--active': isActive\n }\">\n <div\n class=\"timeline__icon-item__icon\"\n [pTooltip]=\"item.tooltip\"\n tooltipPosition=\"top\"\n [ngStyle]=\"{ backgroundColor: item.color }\">\n <ng-content *ngIf=\"item.icon; then icon_content; else label_text_content\"></ng-content>\n <ng-template #icon_content>\n <span [ngClass]=\"item.icon\"></span>\n </ng-template>\n <ng-template #label_text_content>\n <span class=\"timeline__icon-item__icon__label\">\n {{ item.label }}\n </span>\n </ng-template>\n </div>\n </div>\n</ng-container>\n",
17013
- styles: [".timeline__icon-item .timeline__icon-item__icon{-ms-flex-align:center;align-items:center;background-color:#697882;border-radius:50%;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;margin:4px;-webkit-user-select:none;-ms-user-select:none;user-select:none}.timeline__icon-item .timeline__icon-item__icon .timeline__icon-item__icon__label{font-family:\"Open Sans\",sans-serif}.timeline__icon-item.timeline__icon-item--small .timeline__icon-item__icon{font-size:0;height:16px;width:16px}.timeline__icon-item.timeline__icon-item--normal .timeline__icon-item__icon{font-size:10px;height:24px;padding:8px;width:24px}.timeline__icon-item.timeline__icon-item--normal .timeline__icon-item__icon .timeline__icon-item__icon__label{font-size:14px}.timeline__icon-item.timeline__icon-item--active .timeline__icon-item__icon{font-size:20px;height:40px;padding:10px;width:40px}.timeline__icon-item.timeline__icon-item--active .timeline__icon-item__icon .timeline__icon-item__icon__label{font-size:22px}.timeline__icon-item.timeline__icon-item--active .timeline__icon-item__icon,.timeline__icon-item.timeline__icon-item--completed .timeline__icon-item__icon{background-color:#0c9348}.timeline__icon-item.timeline__icon-item--warning.timeline__icon-item--active .timeline__icon-item__icon{background-color:#fcbf10;color:#333}.timeline__icon-item.timeline__icon-item--danger.timeline__icon-item--active .timeline__icon-item__icon{background-color:#f8931f;color:#333}.timeline__icon-item.timeline__icon-item--error.timeline__icon-item--active .timeline__icon-item__icon{background-color:#c13018}"]
17019
+ template: "<ng-container *ngIf=\"item\">\n <div\n class=\"timeline__icon-item\"\n [ngClass]=\"{\n 'timeline__icon-item--small': item.testSize('small'),\n 'timeline__icon-item--normal': item.testSize('normal'),\n 'timeline__icon-item--warning': item.testSeverity('warning'),\n 'timeline__icon-item--error': item.testSeverity('error'),\n 'timeline__icon-item--completed': isComplete,\n 'timeline__icon-item--active': isActive,\n 'timeline__icon-item--active--highlight': isActive && highlightActive\n }\">\n <div\n class=\"timeline__icon-item__icon\"\n [pTooltip]=\"item.tooltip\"\n tooltipPosition=\"top\"\n [ngStyle]=\"{ backgroundColor: item.color }\">\n <ng-content *ngIf=\"item.icon; then icon_content; else label_text_content\"></ng-content>\n <ng-template #icon_content>\n <span [ngClass]=\"item.icon\"></span>\n </ng-template>\n <ng-template #label_text_content>\n <span class=\"timeline__icon-item__icon__label\">\n {{ item.label }}\n </span>\n </ng-template>\n </div>\n </div>\n</ng-container>\n",
17020
+ styles: [".timeline__icon-item .timeline__icon-item__icon{-ms-flex-align:center;align-items:center;background-color:#697882;border-radius:50%;color:#fff;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;margin:4px;-webkit-user-select:none;-ms-user-select:none;user-select:none}.timeline__icon-item .timeline__icon-item__icon .timeline__icon-item__icon__label{font-family:\"Open Sans\",sans-serif}.timeline__icon-item.timeline__icon-item--small .timeline__icon-item__icon{font-size:0;height:16px;width:16px}.timeline__icon-item.timeline__icon-item--normal .timeline__icon-item__icon{font-size:10px;height:24px;padding:8px;width:24px}.timeline__icon-item.timeline__icon-item--normal .timeline__icon-item__icon .timeline__icon-item__icon__label{font-size:14px}.timeline__icon-item.timeline__icon-item--active--highlight .timeline__icon-item__icon{font-size:20px;height:40px;padding:10px;width:40px}.timeline__icon-item.timeline__icon-item--active--highlight .timeline__icon-item__icon .timeline__icon-item__icon__label{font-size:22px}.timeline__icon-item.timeline__icon-item--active .timeline__icon-item__icon,.timeline__icon-item.timeline__icon-item--completed .timeline__icon-item__icon{background-color:#0c9348}.timeline__icon-item.timeline__icon-item--warning.timeline__icon-item--active .timeline__icon-item__icon{background-color:#fcbf10;color:#333}.timeline__icon-item.timeline__icon-item--danger.timeline__icon-item--active .timeline__icon-item__icon{background-color:#f8931f;color:#333}.timeline__icon-item.timeline__icon-item--error.timeline__icon-item--active .timeline__icon-item__icon{background-color:#c13018}"]
17014
17021
  })
17015
17022
  ], TimelineIconItemComponent);
17016
17023
  return TimelineIconItemComponent;
@@ -17042,11 +17049,14 @@
17042
17049
  __decorate([
17043
17050
  core.Input()
17044
17051
  ], HorizontalTimelineComponent.prototype, "activeIndex", void 0);
17052
+ __decorate([
17053
+ core.Input()
17054
+ ], HorizontalTimelineComponent.prototype, "highlightActiveItem", void 0);
17045
17055
  HorizontalTimelineComponent = __decorate([
17046
17056
  core.Component({
17047
17057
  selector: "s-horizontal-timeline",
17048
- template: "<div class=\"horizontal-timeline\">\n <ng-container\n *ngFor=\"let item of items;\n let i = index;\n let isFirst = first;\n let isLast = last\">\n <div\n class=\"horizontal-timeline__item\"\n [ngClass]=\"{\n 'horizontal-timeline__item--small': item.testSize('small'),\n 'horizontal-timeline__item--normal': item.testSize('normal'),\n 'horizontal-timeline__item--warning': item.testSeverity('warning'),\n 'horizontal-timeline__item--error': item.testSeverity('error'),\n 'horizontal-timeline__item--completed': i < activeIndex,\n 'horizontal-timeline__item--active': i === activeIndex\n }\">\n <div class=\"horizontal-timeline__item__icon-wrapper\">\n <div\n class=\"horizontal-timeline__item__icon-wrapper__line horizontal-timeline__item__icon-wrapper__line--before\"\n [ngStyle]=\"{ 'visibility': isFirst ? 'hidden' : 'visible' }\">\n </div>\n <s-timeline-icon-item\n [item]=\"item\"\n [isActive]=\"i === activeIndex\"\n [isComplete]=\"i < activeIndex\">\n </s-timeline-icon-item>\n <div\n class=\"horizontal-timeline__item__icon-wrapper__line horizontal-timeline__item__icon-wrapper__line--after\"\n [ngStyle]=\"{ 'visibility': isLast ? 'hidden' : 'visible' }\">\n </div>\n </div>\n <div class=\"horizontal-timeline__item__info\">\n <div\n class=\"horizontal-timeline__item__info__title\"\n [pTooltip]=\"item.title\"\n tooltipPosition=\"top\"\n [showDelay]=\"1000\">\n {{ item.title }}\n </div>\n <div\n class=\"horizontal-timeline__item__info__description\"\n [pTooltip]=\"item.description\"\n tooltipPosition=\"top\"\n [showDelay]=\"1000\">\n {{ item.description }}\n </div>\n </div>\n </div>\n </ng-container>\n</div>",
17049
- styles: ["@keyframes scale-up-center{0%{transform:scale(.5)}100%{transform:scale(1)}}.horizontal-timeline{-ms-flex-align:start;align-items:flex-start;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.horizontal-timeline .horizontal-timeline__item{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;width:100%}.horizontal-timeline .horizontal-timeline__item .horizontal-timeline__item__icon-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;height:56px;-ms-flex-pack:start;justify-content:flex-start;width:100%}.horizontal-timeline .horizontal-timeline__item .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line{background-color:#697882;height:3px}.horizontal-timeline .horizontal-timeline__item .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line--before{border-radius:0 2px 2px 0}.horizontal-timeline .horizontal-timeline__item .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line--after{border-radius:2px 0 0 2px}.horizontal-timeline .horizontal-timeline__item .horizontal-timeline__item__info{width:20ch}.horizontal-timeline .horizontal-timeline__item .horizontal-timeline__item__info .horizontal-timeline__item__info__title{color:#333;font-family:\"Open Sans\",sans-serif;font-size:14px;font-weight:700;line-height:150%;max-width:100%;overflow:hidden;text-align:center;text-overflow:ellipsis;white-space:nowrap}.horizontal-timeline .horizontal-timeline__item .horizontal-timeline__item__info .horizontal-timeline__item__info__description{color:#999;display:-webkit-box;font-family:\"Open Sans\",sans-serif;font-size:12px;font-weight:400;line-height:150%;max-height:calc(12px * 1.5 * 4);overflow:hidden;text-align:center;text-overflow:ellipsis;-webkit-line-clamp:4;-webkit-box-orient:vertical}.horizontal-timeline .horizontal-timeline__item.horizontal-timeline__item--small .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line{width:calc(50% - 4px - 8px)}.horizontal-timeline .horizontal-timeline__item.horizontal-timeline__item--normal .horizontal-timeline__item__icon-wrapper__line{width:calc(50% - 4px - 12px)}.horizontal-timeline .horizontal-timeline__item.horizontal-timeline__item--active .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line{width:calc(50% - 4px - 20px)}.horizontal-timeline .horizontal-timeline__item.horizontal-timeline__item--active .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line--before,.horizontal-timeline .horizontal-timeline__item.horizontal-timeline__item--completed .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line--after,.horizontal-timeline .horizontal-timeline__item.horizontal-timeline__item--completed .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line--before{background-color:#0c9348}"]
17058
+ template: "<div class=\"horizontal-timeline\">\n <ng-container\n *ngFor=\"let item of items;\n let i = index;\n let isFirst = first;\n let isLast = last\">\n <div\n class=\"horizontal-timeline__item\"\n [ngClass]=\"{\n 'horizontal-timeline__item--small': item.testSize('small'),\n 'horizontal-timeline__item--normal': item.testSize('normal'),\n 'horizontal-timeline__item--warning': item.testSeverity('warning'),\n 'horizontal-timeline__item--error': item.testSeverity('error'),\n 'horizontal-timeline__item--completed': i < activeIndex,\n 'horizontal-timeline__item--active': i === activeIndex\n }\">\n <div class=\"horizontal-timeline__item__icon-wrapper\">\n <div\n class=\"horizontal-timeline__item__icon-wrapper__line horizontal-timeline__item__icon-wrapper__line--before\"\n [ngStyle]=\"{ 'visibility': isFirst ? 'hidden' : 'visible' }\">\n </div>\n <s-timeline-icon-item\n [item]=\"item\"\n [isActive]=\"i === activeIndex\"\n [isComplete]=\"i < activeIndex\"\n [highlightActive]=\"highlightActiveItem\">\n </s-timeline-icon-item>\n <div\n class=\"horizontal-timeline__item__icon-wrapper__line horizontal-timeline__item__icon-wrapper__line--after\"\n [ngStyle]=\"{ 'visibility': isLast ? 'hidden' : 'visible' }\">\n </div>\n </div>\n <div class=\"horizontal-timeline__item__info\">\n <div\n class=\"horizontal-timeline__item__info__title\"\n [pTooltip]=\"item.title\"\n tooltipPosition=\"top\"\n [showDelay]=\"1000\">\n {{ item.title }}\n </div>\n <div\n class=\"horizontal-timeline__item__info__description\"\n [pTooltip]=\"item.description\"\n tooltipPosition=\"top\"\n [showDelay]=\"1000\">\n {{ item.description }}\n </div>\n </div>\n </div>\n </ng-container>\n</div>",
17059
+ styles: ["@keyframes scale-up-center{0%{transform:scale(.5)}100%{transform:scale(1)}}.horizontal-timeline{-ms-flex-align:start;align-items:flex-start;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.horizontal-timeline .horizontal-timeline__item{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;width:100%}.horizontal-timeline .horizontal-timeline__item .horizontal-timeline__item__icon-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;height:56px;-ms-flex-pack:start;justify-content:flex-start;width:100%}.horizontal-timeline .horizontal-timeline__item .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line{background-color:#697882;height:3px}.horizontal-timeline .horizontal-timeline__item .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line--before{border-radius:0 2px 2px 0}.horizontal-timeline .horizontal-timeline__item .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line--after{border-radius:2px 0 0 2px}.horizontal-timeline .horizontal-timeline__item .horizontal-timeline__item__info{width:20ch}.horizontal-timeline .horizontal-timeline__item .horizontal-timeline__item__info .horizontal-timeline__item__info__title{color:#333;font-family:\"Open Sans\",sans-serif;font-size:14px;font-weight:700;line-height:150%;max-width:100%;overflow:hidden;text-align:center;text-overflow:ellipsis;white-space:nowrap}.horizontal-timeline .horizontal-timeline__item .horizontal-timeline__item__info .horizontal-timeline__item__info__description{color:#999;display:-webkit-box;font-family:\"Open Sans\",sans-serif;font-size:12px;font-weight:400;line-height:150%;max-height:calc(12px * 1.5 * 4);overflow:hidden;text-align:center;text-overflow:ellipsis;line-clamp:4;-webkit-line-clamp:4;-webkit-box-orient:vertical}.horizontal-timeline .horizontal-timeline__item.horizontal-timeline__item--small .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line{width:calc(50% - 4px - 8px)}.horizontal-timeline .horizontal-timeline__item.horizontal-timeline__item--normal .horizontal-timeline__item__icon-wrapper__line{width:calc(50% - 4px - 12px)}.horizontal-timeline .horizontal-timeline__item.horizontal-timeline__item--active--highlight .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line{width:calc(50% - 4px - 20px)}.horizontal-timeline .horizontal-timeline__item.horizontal-timeline__item--active .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line--before,.horizontal-timeline .horizontal-timeline__item.horizontal-timeline__item--completed .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line--after,.horizontal-timeline .horizontal-timeline__item.horizontal-timeline__item--completed .horizontal-timeline__item__icon-wrapper .horizontal-timeline__item__icon-wrapper__line--before{background-color:#0c9348}"]
17050
17060
  })
17051
17061
  ], HorizontalTimelineComponent);
17052
17062
  return HorizontalTimelineComponent;
@@ -17102,6 +17112,9 @@
17102
17112
  __decorate([
17103
17113
  core.Input()
17104
17114
  ], VerticalTimelineComponent.prototype, "activeIndex", null);
17115
+ __decorate([
17116
+ core.Input()
17117
+ ], VerticalTimelineComponent.prototype, "highlightActiveItem", void 0);
17105
17118
  __decorate([
17106
17119
  core.Input()
17107
17120
  ], VerticalTimelineComponent.prototype, "items", void 0);
@@ -17114,7 +17127,7 @@
17114
17127
  VerticalTimelineComponent = __decorate([
17115
17128
  core.Component({
17116
17129
  selector: "s-vertical-timeline",
17117
- template: "<div class=\"vertical-timeline\">\n <div\n *ngIf=\"firstItem.length\"\n class=\"vertical-timeline__block\">\n <div class=\"vertical-timeline__block__prefix\"></div>\n <s-vertical-items\n [items]=\"firstItem\"\n [isLast]=\"false\"\n [isActive]=\"false\"\n [isCompleted]=\"true\">\n </s-vertical-items>\n </div>\n\n <div\n *ngIf=\"g1Items.length\"\n class=\"vertical-timeline__block\">\n <div class=\"vertical-timeline__block__prefix\">\n <ng-container *ngIf=\"g1Items.length > 1 && !isG1Collapsed\">\n <s-collapse-option\n *ngIf=\"collapsable\"\n [isCollapsed]=\"isG1Collapsed\"\n (change)=\"onChangeG1($event)\">\n </s-collapse-option>\n <s-range-line class=\"vertical-timeline__block__prefix__line\"></s-range-line>\n </ng-container>\n </div>\n\n <div *ngIf=\"isG1Collapsed && g1Items.length > 1 && collapsable; then g1_collapsed; else g1_items\"></div>\n\n <ng-template #g1_collapsed>\n <s-collapsed-items\n [items]=\"g1Items\"\n [(isCollapsed)]=\"isG1Collapsed\"\n [isCompleted]=\"true\"\n [counterLabel]=\"counterLabel\">\n </s-collapsed-items>\n </ng-template>\n\n <ng-template #g1_items>\n <s-vertical-items\n [items]=\"g1Items\"\n [isLast]=\"false\"\n [isActive]=\"false\"\n [isCompleted]=\"true\">\n </s-vertical-items>\n </ng-template>\n </div>\n\n <div\n *ngIf=\"activeItem.length\"\n class=\"vertical-timeline__block\">\n <div class=\"vertical-timeline__block__prefix\"></div>\n <s-vertical-items\n [items]=\"activeItem\"\n [isLast]=\"!lastItem.length\"\n [isActive]=\"true\"\n [isCompleted]=\"false\">\n </s-vertical-items>\n </div>\n\n <div\n *ngIf=\"g2Items.length\"\n class=\"vertical-timeline__block\">\n <div class=\"vertical-timeline__block__prefix\">\n <ng-container *ngIf=\"g2Items.length > 1 && !isG2Collapsed\">\n <s-collapse-option\n *ngIf=\"collapsable\"\n [isCollapsed]=\"isG2Collapsed\"\n (change)=\"onChangeG2($event)\">\n </s-collapse-option>\n <s-range-line class=\"vertical-timeline__block__prefix__line\"></s-range-line>\n </ng-container>\n </div>\n\n <div *ngIf=\"isG2Collapsed && g2Items.length > 1 && collapsable; then g2_collapsed; else g2_items\"></div>\n\n <ng-template #g2_collapsed>\n <s-collapsed-items\n [items]=\"g2Items\"\n [(isCollapsed)]=\"isG2Collapsed\"\n [isCompleted]=\"false\"\n [counterLabel]=\"counterLabel\">\n </s-collapsed-items>\n </ng-template>\n\n <ng-template #g2_items>\n <s-vertical-items\n [items]=\"g2Items\"\n [isLast]=\"false\"\n [isActive]=\"false\"\n [isCompleted]=\"false\">\n </s-vertical-items>\n </ng-template>\n </div>\n\n <div\n *ngIf=\"lastItem.length\"\n class=\"vertical-timeline__block\">\n <div class=\"vertical-timeline__block__prefix\"></div>\n <s-vertical-items\n [items]=\"lastItem\"\n [isLast]=\"true\"\n [isActive]=\"false\"\n [isCompleted]=\"false\">\n </s-vertical-items>\n </div>\n</div>",
17130
+ template: "<div class=\"vertical-timeline\">\n <div\n *ngIf=\"firstItem.length\"\n class=\"vertical-timeline__block\">\n <div class=\"vertical-timeline__block__prefix\"></div>\n <s-vertical-items\n [items]=\"firstItem\"\n [isLast]=\"false\"\n [isActive]=\"false\"\n [isCompleted]=\"true\">\n </s-vertical-items>\n </div>\n\n <div\n *ngIf=\"g1Items.length\"\n class=\"vertical-timeline__block\">\n <div class=\"vertical-timeline__block__prefix\">\n <ng-container *ngIf=\"g1Items.length > 1 && !isG1Collapsed\">\n <s-collapse-option\n *ngIf=\"collapsable\"\n [isCollapsed]=\"isG1Collapsed\"\n (change)=\"onChangeG1($event)\">\n </s-collapse-option>\n <s-range-line class=\"vertical-timeline__block__prefix__line\"></s-range-line>\n </ng-container>\n </div>\n\n <div *ngIf=\"isG1Collapsed && g1Items.length > 1 && collapsable; then g1_collapsed; else g1_items\"></div>\n\n <ng-template #g1_collapsed>\n <s-collapsed-items\n [items]=\"g1Items\"\n [(isCollapsed)]=\"isG1Collapsed\"\n [isCompleted]=\"true\"\n [counterLabel]=\"counterLabel\">\n </s-collapsed-items>\n </ng-template>\n\n <ng-template #g1_items>\n <s-vertical-items\n [items]=\"g1Items\"\n [isLast]=\"false\"\n [isActive]=\"false\"\n [isCompleted]=\"true\">\n </s-vertical-items>\n </ng-template>\n </div>\n\n <div\n *ngIf=\"activeItem.length\"\n class=\"vertical-timeline__block\">\n <div class=\"vertical-timeline__block__prefix\"></div>\n <s-vertical-items\n [items]=\"activeItem\"\n [isLast]=\"!lastItem.length\"\n [isActive]=\"true\"\n [highlightActive]=\"highlightActiveItem\"\n [isCompleted]=\"false\">\n </s-vertical-items>\n </div>\n\n <div\n *ngIf=\"g2Items.length\"\n class=\"vertical-timeline__block\">\n <div class=\"vertical-timeline__block__prefix\">\n <ng-container *ngIf=\"g2Items.length > 1 && !isG2Collapsed\">\n <s-collapse-option\n *ngIf=\"collapsable\"\n [isCollapsed]=\"isG2Collapsed\"\n (change)=\"onChangeG2($event)\">\n </s-collapse-option>\n <s-range-line class=\"vertical-timeline__block__prefix__line\"></s-range-line>\n </ng-container>\n </div>\n\n <div *ngIf=\"isG2Collapsed && g2Items.length > 1 && collapsable; then g2_collapsed; else g2_items\"></div>\n\n <ng-template #g2_collapsed>\n <s-collapsed-items\n [items]=\"g2Items\"\n [(isCollapsed)]=\"isG2Collapsed\"\n [isCompleted]=\"false\"\n [counterLabel]=\"counterLabel\">\n </s-collapsed-items>\n </ng-template>\n\n <ng-template #g2_items>\n <s-vertical-items\n [items]=\"g2Items\"\n [isLast]=\"false\"\n [isActive]=\"false\"\n [isCompleted]=\"false\">\n </s-vertical-items>\n </ng-template>\n </div>\n\n <div\n *ngIf=\"lastItem.length\"\n class=\"vertical-timeline__block\">\n <div class=\"vertical-timeline__block__prefix\"></div>\n <s-vertical-items\n [items]=\"lastItem\"\n [isLast]=\"true\"\n [isActive]=\"false\"\n [isCompleted]=\"false\">\n </s-vertical-items>\n </div>\n</div>",
17118
17131
  styles: [".vertical-timeline{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.vertical-timeline .vertical-timeline__block{display:-ms-flexbox;display:flex;-ms-flex-align:stretch;align-items:stretch}.vertical-timeline .vertical-timeline__block .vertical-timeline__block__prefix{width:60px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-negative:0;flex-shrink:0}.vertical-timeline .vertical-timeline__block .vertical-timeline__block__prefix .vertical-timeline__block__prefix__line{height:100%}"]
17119
17132
  })
17120
17133
  ], VerticalTimelineComponent);
@@ -17203,13 +17216,16 @@
17203
17216
  __decorate([
17204
17217
  core.Input()
17205
17218
  ], VerticalItemsComponent.prototype, "isActive", void 0);
17219
+ __decorate([
17220
+ core.Input()
17221
+ ], VerticalItemsComponent.prototype, "highlightActive", void 0);
17206
17222
  __decorate([
17207
17223
  core.Input()
17208
17224
  ], VerticalItemsComponent.prototype, "isCompleted", void 0);
17209
17225
  VerticalItemsComponent = __decorate([
17210
17226
  core.Component({
17211
17227
  selector: "s-vertical-items",
17212
- template: "<div class=\"vertical-items\">\n <ng-container *ngFor=\"let item of items; let index = index;\">\n <div\n class=\"vertical-items__item\"\n [ngClass]=\"{\n 'vertical-items__item--small': item.testSize('small'),\n 'vertical-items__item--normal': item.testSize('normal'),\n 'vertical-items__item--completed': isCompleted,\n 'vertical-items__item--active': isActive\n }\">\n <div class=\"vertical-items__item__icon-wrapper\">\n <s-timeline-icon-item\n [item]=\"item\"\n [isComplete]=\"isCompleted\"\n [isActive]=\"isActive\">\n </s-timeline-icon-item>\n <div\n class=\"vertical-items__item__icon-wrapper__line\"\n [ngStyle]=\"{ 'visibility': isLast ? 'hidden' : 'visible' }\">\n </div>\n </div>\n <div class=\"vertical-items__item__info\">\n <div class=\"vertical-timeline__item__info__title\">\n {{ item.title }}\n </div>\n <div class=\"vertical-items__item__info__description\">\n {{ item.description }}\n </div>\n </div>\n </div>\n </ng-container>\n</div>",
17228
+ template: "<div class=\"vertical-items\">\n <ng-container *ngFor=\"let item of items; let index = index;\">\n <div\n class=\"vertical-items__item\"\n [ngClass]=\"{\n 'vertical-items__item--small': item.testSize('small'),\n 'vertical-items__item--normal': item.testSize('normal'),\n 'vertical-items__item--completed': isCompleted,\n 'vertical-items__item--active': isActive\n }\">\n <div class=\"vertical-items__item__icon-wrapper\">\n <s-timeline-icon-item\n [item]=\"item\"\n [isComplete]=\"isCompleted\"\n [isActive]=\"isActive\"\n [highlightActive]=\"highlightActive\">\n </s-timeline-icon-item>\n <div\n class=\"vertical-items__item__icon-wrapper__line\"\n [ngStyle]=\"{ 'visibility': isLast ? 'hidden' : 'visible' }\">\n </div>\n </div>\n <div class=\"vertical-items__item__info\">\n <div class=\"vertical-timeline__item__info__title\">\n {{ item.title }}\n </div>\n <div class=\"vertical-items__item__info__description\">\n {{ item.description }}\n </div>\n </div>\n </div>\n </ng-container>\n</div>",
17213
17229
  styles: [".vertical-items .vertical-items__item{-ms-flex-align:stretch;align-items:stretch;display:-ms-flexbox;display:flex;margin-right:50px}.vertical-items .vertical-items__item .vertical-items__item__collapsed-option{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}.vertical-items .vertical-items__item .vertical-items__item__collapsed-option .vertical-items__item__collapsed-option__line{width:3px;height:50px;background-color:#ccc}.vertical-items .vertical-items__item .vertical-items__item__icon-wrapper{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-negative:0;flex-shrink:0;-ms-flex-pack:center;justify-content:center;width:56px}.vertical-items .vertical-items__item .vertical-items__item__icon-wrapper .vertical-items__item__icon-wrapper__line{background-color:#697882;border-radius:2px;-ms-flex-positive:1;flex-grow:1;min-height:20px;width:3px}.vertical-items .vertical-items__item .vertical-items__item__info{-ms-flex-align:start;align-items:flex-start;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;margin-bottom:12px}.vertical-items .vertical-items__item .vertical-items__item__info .vertical-items__item__info__title{color:#333;font-family:\"Open Sans\",sans-serif;font-size:14px;font-weight:700;line-height:150%}.vertical-items .vertical-items__item .vertical-items__item__info .vertical-items__item__info__description{color:#999;font-family:\"Open Sans\",sans-serif;font-size:12px;font-weight:400;line-height:150%}.vertical-items .vertical-items__item .vertical-items__item__info .vertical-items__item__info__description.vertical-items__item__info__description--link{color:#428bca}.vertical-items .vertical-items__item.vertical-items__item--small .vertical-items__item__icon-wrapper__line{height:calc(100% - 4px - 8px)}.vertical-items .vertical-items__item.vertical-items__item--medium .vertical-items__item__icon-wrapper__line{height:calc(100% - 4px - 12px)}.vertical-items .vertical-items__item.vertical-items__item--big .vertical-items__item__icon-wrapper__line{height:calc(50% - 4px - 20px)}.vertical-items .vertical-items__item.vertical-items__item--completed .vertical-items__item__icon-wrapper .vertical-items__item__icon-wrapper__line{background-color:#0c9348}"]
17214
17230
  })
17215
17231
  ], VerticalItemsComponent);
@@ -17310,18 +17326,34 @@
17310
17326
  }());
17311
17327
 
17312
17328
  var WorkspaceSwitchComponent = /** @class */ (function () {
17313
- function WorkspaceSwitchComponent(eRef) {
17329
+ function WorkspaceSwitchComponent(eRef, changeDetectorRef) {
17314
17330
  this.eRef = eRef;
17331
+ this.changeDetectorRef = changeDetectorRef;
17315
17332
  this.footerButtonLabel = "Adicionar";
17316
17333
  this.showFooterButton = true;
17317
17334
  this.disabled = false;
17318
17335
  this.footerButtonClicked = new core.EventEmitter();
17319
17336
  this.selected = new core.EventEmitter();
17320
- this.open = false;
17337
+ this.height = 0;
17321
17338
  this.selectedItemIndex = 0;
17322
17339
  this.currentItemIndex = 0;
17340
+ this._open = false;
17323
17341
  this.tabindex = 0;
17324
17342
  }
17343
+ Object.defineProperty(WorkspaceSwitchComponent.prototype, "open", {
17344
+ get: function () {
17345
+ return this._open;
17346
+ },
17347
+ set: function (open) {
17348
+ this._open = open;
17349
+ this.changeDetectorRef.detectChanges();
17350
+ if (open) {
17351
+ this._calculateListMaxHeight();
17352
+ }
17353
+ },
17354
+ enumerable: true,
17355
+ configurable: true
17356
+ });
17325
17357
  WorkspaceSwitchComponent.prototype.onClickout = function (event) {
17326
17358
  if (!this.eRef.nativeElement.contains(event.target)) {
17327
17359
  this.open = false;
@@ -17345,11 +17377,13 @@
17345
17377
  else if (event.key === "ArrowDown") {
17346
17378
  if (this.currentItemIndex < this.workspaces.length - 1) {
17347
17379
  this.currentItemIndex++;
17380
+ this._scrollToCurrentItem();
17348
17381
  }
17349
17382
  }
17350
17383
  else if (event.key === "ArrowUp") {
17351
17384
  if (this.currentItemIndex > 0) {
17352
17385
  this.currentItemIndex--;
17386
+ this._scrollToCurrentItem();
17353
17387
  }
17354
17388
  }
17355
17389
  };
@@ -17380,8 +17414,21 @@
17380
17414
  this.open = false;
17381
17415
  this.footerButtonClicked.emit();
17382
17416
  };
17417
+ WorkspaceSwitchComponent.prototype._calculateListMaxHeight = function () {
17418
+ var workspaceListRef = this.eRef.nativeElement.querySelector("#workspace-list");
17419
+ var top = workspaceListRef.getBoundingClientRect().top;
17420
+ this.height = window.innerHeight - top - 20 - (this.showFooterButton ? 64 : 0);
17421
+ this.changeDetectorRef.detectChanges();
17422
+ };
17423
+ WorkspaceSwitchComponent.prototype._scrollToCurrentItem = function () {
17424
+ var currentItem = this.listItems.toArray()[this.currentItemIndex];
17425
+ if (currentItem) {
17426
+ currentItem.nativeElement.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
17427
+ }
17428
+ };
17383
17429
  WorkspaceSwitchComponent.ctorParameters = function () { return [
17384
- { type: core.ElementRef }
17430
+ { type: core.ElementRef },
17431
+ { type: core.ChangeDetectorRef }
17385
17432
  ]; };
17386
17433
  __decorate([
17387
17434
  core.Input()
@@ -17401,6 +17448,9 @@
17401
17448
  __decorate([
17402
17449
  core.Output()
17403
17450
  ], WorkspaceSwitchComponent.prototype, "selected", void 0);
17451
+ __decorate([
17452
+ core.ViewChildren('listItem')
17453
+ ], WorkspaceSwitchComponent.prototype, "listItems", void 0);
17404
17454
  __decorate([
17405
17455
  core.HostBinding("attr.tabindex")
17406
17456
  ], WorkspaceSwitchComponent.prototype, "tabindex", void 0);
@@ -17413,8 +17463,8 @@
17413
17463
  WorkspaceSwitchComponent = __decorate([
17414
17464
  core.Component({
17415
17465
  selector: "s-workspace-switch",
17416
- template: "<div\n class=\"workspace-switch\"\n [ngClass]=\"{ 'workspace-switch--disabled': disabled }\"\n (blur)=\"buttonOnBlur()\">\n <div class=\"button\" (click)=\"open = !open\">\n <div class=\"item\">\n <span class=\"title\">{{ workspaces[selectedItemIndex].title }}</span>\n <span class=\"subtitle\">{{ workspaces[selectedItemIndex].subtitle }}</span>\n </div>\n <div class=\"icons\">\n <span class=\"fas fa-chevron-up\"></span>\n <span class=\"fas fa-chevron-down\"></span>\n </div>\n </div>\n <div *ngIf=\"!disabled && open\" class=\"select\">\n <div\n *ngFor=\"let workspace of workspaces; let i = index\"\n class=\"workspace\"\n [ngClass]=\"{\n 'workspace--focused': i == currentItemIndex && !workspace.disabled,\n 'workspace--disabled': workspace.disabled\n }\"\n (click)=\"onSelectItem(workspace)\">\n <div class=\"item\">\n <span class=\"title\">{{ workspace.title }}</span>\n <span class=\"subtitle\">{{ workspace.subtitle }}</span>\n </div>\n <span *ngIf=\"i === selectedItemIndex\" class=\"active-icon fas fa-check\"></span>\n </div>\n <div *ngIf=\"showFooterButton\" class=\"footer\">\n <div class=\"footer__button\" (click)=\"onFooterButtonClick()\">\n <span class=\"footer__button__icon fas fa-plus\"></span>\n <span class=\"footer__button__title\">{{ footerButtonLabel }}</span>\n </div>\n </div>\n </div>\n</div>",
17417
- styles: [".workspace-switch{border-radius:4px;border:1px solid transparent;width:324px}.workspace-switch .button{-ms-flex-align:center;align-items:center;background-color:#fff;border:none;border-radius:3px;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-webkit-user-select:none;-ms-user-select:none;user-select:none;width:100%}.workspace-switch .button .icons{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;margin:0 12px}.workspace-switch .select{background-color:#fff;border-radius:4px;box-shadow:0 1px 5px rgba(0,0,0,.25);cursor:pointer;margin:20px 0;padding-top:4px;position:absolute;width:324px}.workspace-switch .select .workspace{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-webkit-user-select:none;-ms-user-select:none;user-select:none}.workspace-switch .select .workspace .active-icon{color:#7892a1;font-size:12px;margin:0 12px}.workspace-switch .select .workspace--focused{background-color:#f1f7f8}.workspace-switch .select .workspace--disabled .item .subtitle,.workspace-switch .select .workspace--disabled .item .title{color:#c1c1cc}.workspace-switch .select .workspace:hover:not(.workspace--disabled){background-color:#f1f7f8}.workspace-switch .select .footer{border-top:1px solid #ccc;padding:12px}.workspace-switch .select .footer .footer__button{-ms-flex-align:center;align-items:center;border:1px solid #d8d8d8;border-radius:4px;padding:8px 12px;-webkit-user-select:none;-ms-user-select:none;user-select:none;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}.workspace-switch .select .footer .footer__button .footer__button__icon{color:#333;margin-right:8px}.workspace-switch .select .footer .footer__button:active{border:1px solid #428bca}.workspace-switch .item{-ms-flex-align:start;align-items:flex-start;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;padding:12px}.workspace-switch .item .title{color:#333;font-family:\"Open Sans\",sans-serif;font-size:14px;font-weight:700;line-height:150%;text-transform:uppercase}.workspace-switch .item .subtitle{color:#999;font-family:\"Open Sans\",sans-serif;font-size:12px;font-weight:400;line-height:150%}.workspace-switch:focus{border:1px solid #428bca}.workspace-switch--disabled .button{cursor:default}.workspace-switch--disabled .button .icons,.workspace-switch--disabled .item .subtitle,.workspace-switch--disabled .item .title{color:#ccc}"]
17466
+ template: "<div\n class=\"workspace-switch\"\n [ngClass]=\"{ 'workspace-switch--disabled': disabled }\"\n (blur)=\"buttonOnBlur()\">\n <div class=\"button\" (click)=\"open = !open\">\n <div class=\"item\">\n <span class=\"title\">{{ workspaces[selectedItemIndex].title }}</span>\n <span class=\"subtitle\">{{ workspaces[selectedItemIndex].subtitle }}</span>\n </div>\n <div class=\"icons\">\n <span class=\"fas fa-chevron-up\"></span>\n <span class=\"fas fa-chevron-down\"></span>\n </div>\n </div>\n <div *ngIf=\"!disabled && open\" class=\"drop-panel\">\n <ul\n id=\"workspace-list\"\n class=\"workspace-list\"\n [ngStyle]=\"{ 'max-height': height + 'px' }\">\n <li\n #listItem\n *ngFor=\"let workspace of workspaces; let i = index\"\n class=\"workspace\"\n [ngClass]=\"{\n 'workspace--focused': i == currentItemIndex && !workspace.disabled,\n 'workspace--disabled': workspace.disabled\n }\"\n (click)=\"onSelectItem(workspace)\">\n <div class=\"item\">\n <span class=\"title\">{{ workspace.title }}</span>\n <span class=\"subtitle\">{{ workspace.subtitle }}</span>\n </div>\n <span *ngIf=\"i === selectedItemIndex\" class=\"active-icon fas fa-check\"></span>\n </li>\n </ul>\n <div *ngIf=\"showFooterButton\" class=\"footer\">\n <div class=\"footer__button\" (click)=\"onFooterButtonClick()\">\n <span class=\"footer__button__icon fas fa-plus\"></span>\n <span class=\"footer__button__title\">{{ footerButtonLabel }}</span>\n </div>\n </div>\n </div>\n</div>",
17467
+ styles: [".workspace-switch{border-radius:4px;border:1px solid transparent;width:324px}.workspace-switch .button{-ms-flex-align:center;align-items:center;background-color:#fff;border:none;border-radius:3px;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-webkit-user-select:none;-ms-user-select:none;user-select:none;width:100%}.workspace-switch .button .icons{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;margin:0 12px}.workspace-switch .drop-panel{background-color:#fff;border-radius:4px;box-shadow:0 1px 5px rgba(0,0,0,.25);cursor:pointer;margin:20px 0;padding-top:4px;position:absolute;width:324px}.workspace-switch .drop-panel .workspace-list{list-style:none;overflow:auto;padding:0}.workspace-switch .drop-panel .workspace-list .workspace{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-webkit-user-select:none;-ms-user-select:none;user-select:none}.workspace-switch .drop-panel .workspace-list .workspace .active-icon{color:#7892a1;font-size:12px;margin:0 12px}.workspace-switch .drop-panel .workspace-list .workspace--focused{background-color:#f1f7f8}.workspace-switch .drop-panel .workspace-list .workspace--disabled .item .subtitle,.workspace-switch .drop-panel .workspace-list .workspace--disabled .item .title{color:#c1c1cc}.workspace-switch .drop-panel .workspace-list .workspace:hover:not(.workspace--disabled){background-color:#f1f7f8}.workspace-switch .drop-panel .footer{border-top:1px solid #ccc;padding:12px}.workspace-switch .drop-panel .footer .footer__button{-ms-flex-align:center;align-items:center;border:1px solid #d8d8d8;border-radius:4px;padding:8px 12px;-webkit-user-select:none;-ms-user-select:none;user-select:none;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}.workspace-switch .drop-panel .footer .footer__button .footer__button__icon{color:#333;margin-right:8px}.workspace-switch .drop-panel .footer .footer__button:active{border:1px solid #428bca}.workspace-switch .item{-ms-flex-align:start;align-items:flex-start;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;padding:12px}.workspace-switch .item .title{color:#333;font-family:\"Open Sans\",sans-serif;font-size:14px;font-weight:700;line-height:150%;text-transform:uppercase}.workspace-switch .item .subtitle{color:#999;font-family:\"Open Sans\",sans-serif;font-size:12px;font-weight:400;line-height:150%}.workspace-switch:focus{border:1px solid #428bca}.workspace-switch--disabled .button{cursor:default}.workspace-switch--disabled .button .icons,.workspace-switch--disabled .item .subtitle,.workspace-switch--disabled .item .title{color:#ccc}"]
17418
17468
  })
17419
17469
  ], WorkspaceSwitchComponent);
17420
17470
  return WorkspaceSwitchComponent;