From b4c0d0083e69fa6ead5c664d86257e778d87534d Mon Sep 17 00:00:00 2001
From: anandtiwary <52081890+anandtiwary@users.noreply.github.com>
Date: Wed, 22 Dec 2021 09:16:26 -0800
Subject: [PATCH] refactor: minor style change support for combo box

---
 .../components/src/combo-box/combo-box.component.scss    | 5 ++++-
 projects/components/src/combo-box/combo-box.component.ts | 9 ++++++++-
 .../components/src/form-field/form-field.component.scss  | 1 +
 3 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/projects/components/src/combo-box/combo-box.component.scss b/projects/components/src/combo-box/combo-box.component.scss
index 1dd7c54ee..845a415a8 100644
--- a/projects/components/src/combo-box/combo-box.component.scss
+++ b/projects/components/src/combo-box/combo-box.component.scss
@@ -11,9 +11,12 @@
   align-items: center;
   height: inherit;
   width: inherit;
-  border: 1px solid $color-border;
   border-radius: 6px;
 
+  &.show-border {
+    border: 1px solid $color-border;
+  }
+
   &.chip {
     border: 1px solid transparent;
 
diff --git a/projects/components/src/combo-box/combo-box.component.ts b/projects/components/src/combo-box/combo-box.component.ts
index 04305ec3e..694244aa0 100644
--- a/projects/components/src/combo-box/combo-box.component.ts
+++ b/projects/components/src/combo-box/combo-box.component.ts
@@ -39,7 +39,11 @@ import { ComboBoxMode, ComboBoxOption, ComboBoxResult } from './combo-box-api';
         <div
           #trigger
           class="popover-trigger"
-          [ngClass]="this.mode"
+          [ngClass]="{
+            input: this.mode === '${ComboBoxMode.Input}',
+            chip: this.mode === '${ComboBoxMode.Chip}',
+            'show-border': this.showBorder
+          }"
           [class.has-text]="this.text"
           [class.input-focused]="input.matches(':focus')"
         >
@@ -149,6 +153,9 @@ export class ComboBoxComponent<TValue = string> implements AfterViewInit, OnChan
   @Input()
   public options?: ComboBoxOption<TValue>[] = [];
 
+  @Input()
+  public showBorder: boolean = true;
+
   @Output()
   public readonly textChange: EventEmitter<string> = new EventEmitter();
 
diff --git a/projects/components/src/form-field/form-field.component.scss b/projects/components/src/form-field/form-field.component.scss
index 32b1c663b..b0607740e 100644
--- a/projects/components/src/form-field/form-field.component.scss
+++ b/projects/components/src/form-field/form-field.component.scss
@@ -42,6 +42,7 @@
 
     &.error-border {
       border: 1px solid $red-3;
+      border-radius: 6px;
     }
   }