From 0fa0165d43288880c84a6a21ab6155de1f3c9ca7 Mon Sep 17 00:00:00 2001
From: Ayesha Mazumdar <a.mazumdar@salesforce.com>
Date: Wed, 7 Mar 2018 13:02:39 -0800
Subject: [PATCH] Fix(datepicker): Prevent input error styling from applying to
 datepicker select (#3119)

---
 ui/components/datepickers/base/_index.scss |  5 +++++
 ui/components/datepickers/base/example.jsx | 21 +++++++++++++++++++++
 2 files changed, 26 insertions(+)

diff --git a/ui/components/datepickers/base/_index.scss b/ui/components/datepickers/base/_index.scss
index d402fb19bf..2cd874c6ba 100644
--- a/ui/components/datepickers/base/_index.scss
+++ b/ui/components/datepickers/base/_index.scss
@@ -119,6 +119,11 @@
   }
 }
 
+.slds-has-error .slds-datepicker__filter .slds-select {
+  border: $border-width-thin solid $color-border-input;
+  box-shadow: none;
+}
+
 /**
  * @summary Indicates days that are in previous/next months
  *
diff --git a/ui/components/datepickers/base/example.jsx b/ui/components/datepickers/base/example.jsx
index 9a88a42241..cf4e1c38e9 100644
--- a/ui/components/datepickers/base/example.jsx
+++ b/ui/components/datepickers/base/example.jsx
@@ -428,5 +428,26 @@ export let states = [
         />
       </FormElement>
     )
+  },
+  {
+    id: 'datepicker-with-error',
+    label: 'Date Picker has Error',
+    element: (
+      <FormElement
+        className="slds-dropdown-trigger slds-dropdown-trigger_click slds-is-open slds-has-error"
+        label="Date"
+        inputId={dateInputId}
+        inputIcon="right"
+        dropdown={<DatePicker todayActive />}
+      >
+        <Input id={dateInputId} placeholder=" " />
+        <ButtonIcon
+          className="slds-input__icon slds-input__icon_right"
+          symbol="event"
+          assistiveText="Select a date"
+          title="Select a date"
+        />
+      </FormElement>
+    )
   }
 ];