From e4766591d595435ed1b8f53a15c483b8dd0bab4c Mon Sep 17 00:00:00 2001
From: Eric Liu <ericyl.us@gmail.com>
Date: Wed, 14 Oct 2020 16:00:19 -0700
Subject: [PATCH] feat(search): support disabled state

---
 COMPONENT_INDEX.md                   | 1 +
 docs/src/pages/components/Search.svx | 4 ++++
 src/Search/Search.svelte             | 9 +++++++++
 types/index.d.ts                     | 6 ++++++
 4 files changed, 20 insertions(+)

diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md
index 52f20a6f..52f127a8 100644
--- a/COMPONENT_INDEX.md
+++ b/COMPONENT_INDEX.md
@@ -3464,6 +3464,7 @@ import { Search } from "carbon-components-svelte";
 | size                 | <code>"sm" &#124; "lg"</code>             | --                   |
 | skeleton             | <code>boolean</code>                      | false                |
 | light                | <code>boolean</code>                      | false                |
+| disabled             | <code>boolean</code>                      | false                |
 | value                | <code>string</code>                       | ""                   |
 | type                 | <code>string</code>                       | "text"               |
 | placeholder          | <code>string</code>                       | "Search..."          |
diff --git a/docs/src/pages/components/Search.svx b/docs/src/pages/components/Search.svx
index 7649671e..8a10cf35 100644
--- a/docs/src/pages/components/Search.svx
+++ b/docs/src/pages/components/Search.svx
@@ -23,6 +23,10 @@
 
 <Search size="sm" />
 
+### Disabled
+
+<Search disabled />
+
 ### Skeleton
 
 <Search skeleton />
\ No newline at end of file
diff --git a/src/Search/Search.svelte b/src/Search/Search.svelte
index 7450d01f..86db4f5d 100644
--- a/src/Search/Search.svelte
+++ b/src/Search/Search.svelte
@@ -23,6 +23,12 @@
    */
   export let light = false;
 
+  /**
+   * Set to `true` to disable the search input
+   * @type {boolean} [disabled=false]
+   */
+  export let disabled = false;
+
   /**
    * Specify the value of the search input
    * @type {string} [value="text"]
@@ -96,6 +102,7 @@
   <div
     class:bx--search="{true}"
     class:bx--search--light="{light}"
+    class:bx--search--disabled="{disabled}"
     {...$$restProps}
     class="bx--search--{size} {$$restProps.class}"
   >
@@ -108,6 +115,7 @@
       class:bx--search-input="{true}"
       autofocus="{autofocus}"
       autocomplete="{autocomplete}"
+      disabled="{disabled}"
       id="{id}"
       placeholder="{placeholder}"
       type="{type}"
@@ -121,6 +129,7 @@
     <button
       type="button"
       aria-label="{closeButtonLabelText}"
+      disabled="{disabled}"
       class:bx--search-close="{true}"
       class:bx--search-close--hidden="{value === ''}"
       on:click
diff --git a/types/index.d.ts b/types/index.d.ts
index 6ecfe905..0c9c7a0e 100644
--- a/types/index.d.ts
+++ b/types/index.d.ts
@@ -3408,6 +3408,12 @@ export class Search extends CarbonSvelteComponent {
      */
     light?: boolean;
 
+    /**
+     * Set to `true` to disable the search input
+     * @default false
+     */
+    disabled?: boolean;
+
     /**
      * Specify the value of the search input
      * @default ""