v1.16.0

projects/go-lib/karma.conf.js

@@ -22,7 +22,7 @@ module.exports = function (config) {
       thresholds: {
         statements: 93,
         lines: 92,
-        branches: 79,
+        branches: 75,
         functions: 88,
       },
     },

projects/go-lib/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tangoe/goponents",
-  "version": "1.15.1",
+  "version": "1.16.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/mobi/goponents.git"

projects/go-lib/src/lib/components/go-accordion/go-accordion-panel.component.scss

@@ -67,7 +67,7 @@
 
     cursor: pointer;
     display: flex;
-    font-size: 1.2rem;
+    font-size: 1.125rem;
     padding: 1.2rem 1rem;
     position: relative;
 
@@ -76,10 +76,10 @@
     }
 
     &--dark {
-      background-color: darken($base-dark-secondary, 7%);
+      background-color: $base-dark;
 
       &:hover {
-        background-color: darken($base-dark-secondary, 3.5%);
+        background-color: darken($base-dark, 3.5%);
       }
     }
 
@@ -88,13 +88,17 @@
 
       // scss-lint:disable SelectorFormat
       &.go-accordion-panel__header--dark {
+        background-color: darken($base-dark-secondary, 3.5%);
+      }
+
+      &.go-accordion-panel__header--dark:hover {
         background-color: darken($base-dark-secondary, 7%);
       }
     }
 
     &--slim {
-      font-size: 1rem;
-      padding: 1rem;
+      font-size: 0.875rem;
+      padding: 0.625rem 1rem;
     }
   }
 
@@ -132,9 +136,11 @@
   }
 
   &__content {
-    padding: 1.5rem 1rem;
+    font-size: 0.875rem;
+    padding: 1rem;
 
     &--slim {
+      font-size: 0.875rem;
       padding: 1rem;
     }
 

projects/go-lib/src/lib/components/go-action-sheet/go-action-sheet.component.scss

@@ -10,13 +10,13 @@ $as-before-box-diag-width: 21.21px;
   position: relative;
 
   &__scroll-container {
-    max-height: 375px;
-    overflow: auto;
+    overflow: hidden;
   }
 
   &__content {
     border-radius: $global-radius;
-    overflow: hidden;
+    max-height: 375px;
+    overflow: auto;
   }
 
   &__content-container {

projects/go-lib/src/lib/components/go-action-sheet/go-panel/go-panel.component.scss

@@ -61,12 +61,8 @@ $theme-light-transparentized: rgba($theme-light-color, .5);
       color: $ui-color-negative;
     }
 
-    .go-panel {
-      &__title {
-        & &-text {
-          color: $ui-color-negative;
-        }
-      }
+    .go-panel__title-text {
+      color: $ui-color-negative;
     }
   }
 

projects/go-lib/src/lib/components/go-badge/go-badge.component.spec.ts

@@ -22,4 +22,42 @@ describe('GoBadgeComponent', () => {
   it('should create', () => {
     expect(component).toBeTruthy();
   });
+
+  describe("badgeClasses()", () => {
+    beforeEach(() => {
+      component.badgeStyles = {};
+    });
+
+    it("returns an object that sets go-badge--positive to true based on type", () => {
+      expect(component.badgeStyles["go-badge--positive"]).toBeFalsy();
+
+      component.badgeColor = "positive";
+      component.ngOnChanges();
+      expect(component.badgeStyles["go-badge--positive"]).toBe(true);
+    });
+
+    it("returns an object that set go-badge--negative to true based on type", () => {
+      expect(component.badgeStyles["go-badge--negative"]).toBeFalsy();
+
+      component.badgeColor = "negative";
+      component.ngOnChanges();
+      expect(component.badgeStyles["go-badge--negative"]).toBe(true);
+    });
+
+    it("returns an object that set go-badge--neutral to true based on type", () => {
+      expect(component.badgeStyles["go-badge--neutral"]).toBeFalsy();
+
+      component.badgeColor = "neutral";
+      component.ngOnChanges();
+      expect(component.badgeStyles["go-badge--neutral"]).toBe(true);
+    });
+
+    it("returns an object that set go-badge--dot to true based on type", () => {
+      expect(component.badgeStyles["go-badge--dot"]).toBeFalsy();
+
+      component.displayData = false;
+      component.ngOnChanges();
+      expect(component.badgeStyles["go-badge--dot"]).toBe(true);
+    });
+  });
 });

projects/go-lib/src/lib/components/go-button/go-button.component.scss

@@ -54,7 +54,7 @@ $button-shadow-secondary-active: 0 0 0 3px transparentize($theme-light-bg-hover,
   }
 
   &--icon-only {
-    padding: calc(.625rem - 2px) .625rem;
+    padding: calc(.625rem - 2px) 1rem;
   }
 
   &__icon ~ &__text:not(:empty) {
@@ -142,22 +142,21 @@ $button-shadow-secondary-active: 0 0 0 3px transparentize($theme-light-bg-hover,
     }
 
     &:disabled:not(.go-button--loading) {
-      border: 1px solid $theme-light-bg-active;
+      @include disabled-states($theme-light-bg-active, 'dark');
+      border: 1px solid $base-light-tertiary;
 
       &:hover,
       &:focus {
-        border: 1px solid $theme-light-bg-active;
+        @include disabled-states($theme-light-bg-active, 'dark');
+        border: 1px solid $base-light-tertiary;
+        box-shadow: none;
       }
     }
   }
 
-  &--tertiary {
-    border: 1px solid $theme-light-bg;
-  }
-
-  &--secondary,
   &--tertiary {
     background: $theme-light-bg;
+    border: 1px solid $theme-light-bg;
     color: $theme-light-color;
 
     &:hover,
@@ -442,13 +441,13 @@ $button-shadow-secondary-active: 0 0 0 3px transparentize($theme-light-bg-hover,
     }
 
     &:disabled:not(.go-button--loading) {
-      border: 1px solid $theme-light-bg-active;
+      border: 1px solid $base-light-tertiary;
       border-left: 0;
 
       &:hover,
       &:focus {
         background: $theme-light-bg-hover;
-        border: 1px solid $theme-light-bg-active;
+        border: 1px solid $base-light-tertiary;
         border-left: 0;
         box-shadow: none;
       }
@@ -468,6 +467,7 @@ $button-shadow-secondary-active: 0 0 0 3px transparentize($theme-light-bg-hover,
     right: 0;
     top: calc(2rem + 2px);
     visibility: hidden;
+    white-space: nowrap;
 
     &--active {
       opacity: 1;
@@ -482,7 +482,6 @@ $button-shadow-secondary-active: 0 0 0 3px transparentize($theme-light-bg-hover,
     cursor: pointer;
     font-size: .875rem;
     font-weight: normal;
-    max-width: 10rem;
     padding: .75rem;
 
     &:hover {

projects/go-lib/src/lib/components/go-card/go-card.component.scss

@@ -12,7 +12,6 @@
   &__header {
     display: flex;
     justify-content: space-between;
-    padding-bottom: 1rem;
   }
 
   &__action-list {

projects/go-lib/src/lib/components/go-file-upload/go-file-upload.component.ts

@@ -1,4 +1,4 @@
-import { Component, Input, OnDestroy, OnInit } from '@angular/core';
+import { Component, Input, OnDestroy, OnInit, ViewChild } from '@angular/core';
 import { AbstractControl, FormArray, FormBuilder, FormGroup } from '@angular/forms';
 import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
@@ -20,6 +20,7 @@ export class GoFileUploadComponent extends GoFormBaseComponent implements OnInit
   @Input() isLoading: boolean = false;
   @Input() multiple: boolean = false;
   @Input() state: 'selecting' | 'selected' = 'selecting';
+  @ViewChild('filePicker') filePicker: any;
 
   ngOnInit(): void {
     this.fb = new FormBuilder();
@@ -51,6 +52,7 @@ export class GoFileUploadComponent extends GoFormBaseComponent implements OnInit
         this.filePreview.push(file.name);
       });
     }
+    this.filePicker.nativeElement.value = '';
   }
 
   removeFile(index: number): void {

projects/go-lib/src/lib/components/go-hint/go-hint.component.scss

@@ -1,7 +1,8 @@
 @import '../../../../styles/variables';
 
 .go-hint {
-  font-size: .875rem;
+  font-size: .75rem;
+  font-style: italic;
   letter-spacing: $base-letter-spacing;
   line-height: 1rem;
   margin: $column-gutter--quarter 0;
@@ -43,7 +44,8 @@
 
   &__label {
     display: block;
-    font-size: .75rem;
+    font-size: 9px;
+    font-style: initial;
     font-weight: $weight-regular;
     margin-bottom: $column-gutter--quarter;
     text-transform: uppercase;

projects/go-lib/src/lib/components/go-modal/go-modal.component.scss

@@ -6,7 +6,7 @@
   @include z-index(modal);
 
   align-items: center;
-  background: transparentize($base-dark, .1);
+  background: rgba($base-color, .5);
   display: flex;
   height: 100%;
   justify-content: center;

projects/go-lib/src/lib/components/go-modal/go-modal.component.ts

@@ -65,7 +65,7 @@ export class GoModalComponent extends GoModalOptions implements OnInit, OnDestro
   loadComponent(): void {
     const componentFactory: ComponentFactory<{}> = this.componentFactoryResolver.resolveComponentFactory(this.currentComponent.component);
     const viewContainerRef: ViewContainerRef = this.goModalHost.viewContainerRef;
-
+    viewContainerRef.clear();
     const componentRef: ComponentRef<{}> = viewContainerRef.createComponent(componentFactory);
 
     Object.keys(this.currentComponent.bindings).forEach((key: string) => {

projects/go-lib/src/lib/components/go-off-canvas/go-off-canvas.component.scss

@@ -4,7 +4,7 @@
 .go-off-canvas-backdrop {
   @include z-index(off-canvas);
 
-  background: rgba($base-dark, .5);
+  background: rgba($base-color, .5);
   height: 100vh;
   left: 0;
   position: fixed;

projects/go-lib/src/lib/components/go-off-canvas/go-off-canvas.component.ts

@@ -93,6 +93,7 @@ export class GoOffCanvasComponent extends GoOffCanvasOptions implements OnInit,
       this.currentOffCanvasItem.component
     );
     const viewContainerRef: ViewContainerRef = this.goOffCanvasHost.viewContainerRef;
+    viewContainerRef.clear();
     const componentRef: ComponentRef<any> = viewContainerRef.createComponent(componentFactory);
 
     Object.keys(this.currentOffCanvasItem.bindings).forEach((key: string) => {

projects/go-lib/src/lib/components/go-progress-bar/go-progress-bar.component.html

@@ -0,0 +1,35 @@
+<div class="go-progress-bar" tabindex="-1">
+  <ng-container
+    *ngTemplateOutlet="mode === 'determinate' ? determinate : indeterminate"
+  >
+  </ng-container>
+</div>
+
+<ng-template #determinate>
+  <div class="go-progress-bar__determinate">
+    <span class="go-progress-bar__determinate__left-label">
+      {{ leftLabel }}</span
+    >
+    <div class="go-progress-bar__determinate--track">
+      <div
+        class="go-progress-bar__determinate--indicator"
+        [ngStyle]="{ width: indicatorWidth + '%' }"
+      ></div>
+    </div>
+    <span class="go-progress-bar__determinate__right-label">{{
+      rightLabel
+    }}</span>
+  </div>
+</ng-template>
+
+<ng-template #indeterminate>
+  <div class="go-progress-bar__indeterminate">
+    <div class="go-progress-bar__indeterminate--track"></div>
+    <div
+      class="go-progress-bar__indeterminate--indicator go-progress-bar__indeterminate--primary-indicator"
+    ></div>
+    <div
+      class="go-progress-bar__indeterminate--indicator go-progress-bar__indeterminate--secondary-indicator"
+    ></div>
+  </div>
+</ng-template>