refactor(devtools): add secondary type button

Add a secondary style/type button to `ng-button`.

(cherry picked from commit bea5840864)

devtools/projects/ng-devtools/src/lib/shared/button/button.component.scss

@@ -20,6 +20,14 @@
     color: var(--septenary-contrast);
   }
 
+  &.type-secondary {
+    border-radius: 2rem;
+    background: transparent;
+    box-sizing: border-box;
+    border: 1px solid var(--quaternary-contrast);
+    color: var(--color-text);
+  }
+
   &.type-icon {
     background: transparent;
     border: none;

devtools/projects/ng-devtools/src/lib/shared/button/button.component.spec.ts

@@ -31,6 +31,11 @@ describe('ButtonComponent', () => {
     expect(element.classList.contains('size-compact')).toBeFalse();
   });
 
+  it('should change the type to secondary', () => {
+    expect(component.btnType()).toEqual('secondary');
+    expect(element.classList.contains('type-secondary')).toBeTrue();
+  });
+
   it('should be compact size', async () => {
     fixture.componentRef.setInput('size', 'compact');
     await fixture.whenStable();

devtools/projects/ng-devtools/src/lib/shared/button/button.component.ts

@@ -8,7 +8,7 @@
 
 import {ChangeDetectionStrategy, Component, input} from '@angular/core';
 
-type ButtonType = 'primary' | 'icon';
+type ButtonType = 'primary' | 'secondary' | 'icon';
 type ButtonSize = 'standard' | 'mid' | 'compact';
 
 @Component({
@@ -19,6 +19,7 @@ type ButtonSize = 'standard' | 'mid' | 'compact';
   host: {
     class: 'ng-button',
     '[class.type-primary]': `btnType() === 'primary'`,
+    '[class.type-secondary]': `btnType() === 'secondary'`,
     '[class.type-icon]': `btnType() === 'icon'`,
     '[class.size-compact]': `size() === 'compact'`,
     '[class.size-mid]': `size() === 'mid'`,