From 019f9773a821dc1d384920f7dc3d3b3c9ed2abfb Mon Sep 17 00:00:00 2001
From: Gregor Wassmann <gregor.wassmann@gmail.com>
Date: Tue, 28 Mar 2023 22:23:30 +0200
Subject: [PATCH] chore: v11 Search

---
 COMPONENT_INDEX.md                      | 4 ++--
 docs/src/COMPONENT_API.json             | 8 ++++----
 docs/src/pages/components/Search.svx    | 2 +-
 src/Search/Search.svelte                | 8 ++++----
 src/Search/SearchSkeleton.svelte        | 6 +++---
 types/Search/Search.svelte.d.ts         | 4 ++--
 types/Search/SearchSkeleton.svelte.d.ts | 4 ++--
 7 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md
index 0f06f082..2f95e0f1 100644
--- a/COMPONENT_INDEX.md
+++ b/COMPONENT_INDEX.md
@@ -3102,7 +3102,7 @@ None.
 | ref                  | No       | <code>let</code> | Yes      | <code>null &#124; HTMLInputElement</code>                 | <code>null</code>                                | Obtain a reference to the input HTML element                    |
 | expanded             | No       | <code>let</code> | Yes      | <code>boolean</code>                                      | <code>false</code>                               | Set to `true to expand the search input                         |
 | value                | No       | <code>let</code> | Yes      | <code>any</code>                                          | <code>""</code>                                  | Specify the value of the search input                           |
-| size                 | No       | <code>let</code> | No       | <code>"sm" &#124; "lg" &#124; "xl"</code>                 | <code>"xl"</code>                                | Specify the size of the search input                            |
+| size                 | No       | <code>let</code> | No       | <code>"sm" &#124; "md" &#124; "lg"</code>                 | <code>"md"</code>                                | Specify the size of the search input                            |
 | searchClass          | No       | <code>let</code> | No       | <code>string</code>                                       | <code>""</code>                                  | Specify the class name passed to the outer div element          |
 | skeleton             | No       | <code>let</code> | No       | <code>boolean</code>                                      | <code>false</code>                               | Set to `true` to display the skeleton state                     |
 | light                | No       | <code>let</code> | No       | <code>boolean</code>                                      | <code>false</code>                               | Set to `true` to enable the light variant                       |
@@ -3147,7 +3147,7 @@ None.
 
 | Prop name | Required | Kind             | Reactive | Type                                      | Default value     | Description                          |
 | :-------- | :------- | :--------------- | :------- | ----------------------------------------- | ----------------- | ------------------------------------ |
-| size      | No       | <code>let</code> | No       | <code>"sm" &#124; "lg" &#124; "xl"</code> | <code>"xl"</code> | Specify the size of the search input |
+| size      | No       | <code>let</code> | No       | <code>"sm" &#124; "md" &#124; "lg"</code> | <code>"md"</code> | Specify the size of the search input |
 
 ### Slots
 
diff --git a/docs/src/COMPONENT_API.json b/docs/src/COMPONENT_API.json
index 8d770e4f..2bed366d 100644
--- a/docs/src/COMPONENT_API.json
+++ b/docs/src/COMPONENT_API.json
@@ -9926,8 +9926,8 @@
           "name": "size",
           "kind": "let",
           "description": "Specify the size of the search input",
-          "type": "\"sm\" | \"lg\" | \"xl\"",
-          "value": "\"xl\"",
+          "type": "\"sm\" | \"md\" | \"lg\"",
+          "value": "\"md\"",
           "isFunction": false,
           "isFunctionDeclaration": false,
           "isRequired": false,
@@ -10150,8 +10150,8 @@
           "name": "size",
           "kind": "let",
           "description": "Specify the size of the search input",
-          "type": "\"sm\" | \"lg\" | \"xl\"",
-          "value": "\"xl\"",
+          "type": "\"sm\" | \"md\" | \"lg\"",
+          "value": "\"md\"",
           "isFunction": false,
           "isFunctionDeclaration": false,
           "isRequired": false,
diff --git a/docs/src/pages/components/Search.svx b/docs/src/pages/components/Search.svx
index 4bac0252..f41f158b 100644
--- a/docs/src/pages/components/Search.svx
+++ b/docs/src/pages/components/Search.svx
@@ -6,7 +6,7 @@
 
 ## Default
 
-The `Search` component size is extra-large by default. There are [large](#large-size) and [small](#small-size) size variants.
+The `Search` component size is medium by default. There are [large](#large-size) and [small](#small-size) size variants.
 
 <Search />
 
diff --git a/src/Search/Search.svelte b/src/Search/Search.svelte
index 0f62df88..28f284ea 100644
--- a/src/Search/Search.svelte
+++ b/src/Search/Search.svelte
@@ -13,9 +13,9 @@
 
   /**
    * Specify the size of the search input
-   * @type {"sm" | "lg" | "xl"}
+   * @type {"sm" | "md" | "lg"}
    */
-  export let size = "xl";
+  export let size = "md";
 
   /** Specify the class name passed to the outer div element */
   export let searchClass = "";
@@ -96,8 +96,8 @@
     class:bx--search--light="{light}"
     class:bx--search--disabled="{disabled}"
     class:bx--search--sm="{size === 'sm'}"
+    class:bx--search--md="{size === 'md'}"
     class:bx--search--lg="{size === 'lg'}"
-    class:bx--search--xl="{size === 'xl'}"
     class:bx--search--expandable="{expandable}"
     class:bx--search--expanded="{expanded}"
     class="{searchClass}"
@@ -166,7 +166,7 @@
         dispatch('clear');
       }}"
     >
-      <svelte:component this="{Close}" size="{size === 'xl' ? 20 : 16}" />
+      <Close />
     </button>
   </div>
 {/if}
diff --git a/src/Search/SearchSkeleton.svelte b/src/Search/SearchSkeleton.svelte
index 91ea37d1..c0c0b194 100644
--- a/src/Search/SearchSkeleton.svelte
+++ b/src/Search/SearchSkeleton.svelte
@@ -1,9 +1,9 @@
 <script>
   /**
    * Specify the size of the search input
-   * @type {"sm" | "lg" | "xl"}
+   * @type {"sm" | "md" | "lg"}
    */
-  export let size = "xl";
+  export let size = "md";
 </script>
 
 <!-- svelte-ignore a11y-mouse-events-have-key-events -->
@@ -11,8 +11,8 @@
 <div
   class:bx--skeleton="{true}"
   class:bx--search--sm="{size === 'sm'}"
+  class:bx--search--md="{size === 'md'}"
   class:bx--search--lg="{size === 'lg'}"
-  class:bx--search--xl="{size === 'xl'}"
   {...$$restProps}
   on:click
   on:mouseover
diff --git a/types/Search/Search.svelte.d.ts b/types/Search/Search.svelte.d.ts
index d0a0a235..906446e8 100644
--- a/types/Search/Search.svelte.d.ts
+++ b/types/Search/Search.svelte.d.ts
@@ -12,9 +12,9 @@ export interface SearchProps extends RestProps {
 
   /**
    * Specify the size of the search input
-   * @default "xl"
+   * @default "md"
    */
-  size?: "sm" | "lg" | "xl";
+  size?: "sm" | "md" | "lg";
 
   /**
    * Specify the class name passed to the outer div element
diff --git a/types/Search/SearchSkeleton.svelte.d.ts b/types/Search/SearchSkeleton.svelte.d.ts
index d5590941..4eb423c9 100644
--- a/types/Search/SearchSkeleton.svelte.d.ts
+++ b/types/Search/SearchSkeleton.svelte.d.ts
@@ -6,9 +6,9 @@ type RestProps = SvelteHTMLElements["div"];
 export interface SearchSkeletonProps extends RestProps {
   /**
    * Specify the size of the search input
-   * @default "xl"
+   * @default "md"
    */
-  size?: "sm" | "lg" | "xl";
+  size?: "sm" | "md" | "lg";
 
   [key: `data-${string}`]: any;
 }