From 93961b106b9cb50d23e355908e4e6edf598df913 Mon Sep 17 00:00:00 2001
From: brunnerh <brunnerh@users.noreply.github.com>
Date: Sun, 3 Sep 2023 12:28:37 +0200
Subject: [PATCH] Breaking: Move `$$restProps` in `Select` to `<select>`.

This aligns the component with others like `TextInput`, `NumberInput` or `TextArea` and allows adding not explicitly defined attributes to the "main" element of the component.

Other changes are from formatting by `lint` task.
(Prettier removes manual line breaks via `  ` from JSDoc strings; turned that into paragraph in `Header`.)
---
 COMPONENT_INDEX.md                 | 4 ++--
 docs/src/COMPONENT_API.json        | 6 +++---
 src/ComboBox/ComboBox.svelte       | 6 +++---
 src/MultiSelect/MultiSelect.svelte | 6 +++---
 src/Select/Select.svelte           | 4 +++-
 src/UIShell/Header.svelte          | 6 ++++--
 types/Select/Select.svelte.d.ts    | 2 +-
 types/UIShell/Header.svelte.d.ts   | 2 ++
 8 files changed, 21 insertions(+), 15 deletions(-)

diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md
index f00828c06e..527f49b8e3 100644
--- a/COMPONENT_INDEX.md
+++ b/COMPONENT_INDEX.md
@@ -1580,8 +1580,8 @@ None.
 | expandedByDefault       | No       | <code>let</code> | No       | <code>boolean</code>                                      | <code>true</code>      | Set to `false` to hide the side nav by default                                                                                                                                                                                                                              |
 | uiShellAriaLabel        | No       | <code>let</code> | No       | <code>string</code>                                       | <code>undefined</code> | Specify the ARIA label for the header                                                                                                                                                                                                                                       |
 | href                    | No       | <code>let</code> | No       | <code>string</code>                                       | <code>undefined</code> | Specify the `href` attribute                                                                                                                                                                                                                                                |
-| company                 | No       | <code>let</code> | No       | <code>string</code>                                       | <code>undefined</code> | Specify the company name. <br />Alternatively, use the named slot "company" (e.g., `&lt;span slot="company"&gt;...&lt;/span&gt;`)                                                                                                                                           |
-| platformName            | No       | <code>let</code> | No       | <code>string</code>                                       | <code>""</code>        | Specify the platform name.<br />Alternatively, use the named slot "platform" (e.g., `&lt;span slot="platform"&gt;...&lt;/span&gt;`)                                                                                                                                         |
+| company                 | No       | <code>let</code> | No       | <code>string</code>                                       | <code>undefined</code> | Specify the company name.<br /><br />Alternatively, use the named slot "company" (e.g., `&lt;span slot="company"&gt;...&lt;/span&gt;`)                                                                                                                                      |
+| platformName            | No       | <code>let</code> | No       | <code>string</code>                                       | <code>""</code>        | Specify the platform name.<br /><br />Alternatively, use the named slot "platform" (e.g., `&lt;span slot="platform"&gt;...&lt;/span&gt;`)                                                                                                                                   |
 | persistentHamburgerMenu | No       | <code>let</code> | No       | <code>boolean</code>                                      | <code>false</code>     | Set to `true` to persist the hamburger menu                                                                                                                                                                                                                                 |
 | expansionBreakpoint     | No       | <code>let</code> | No       | <code>number</code>                                       | <code>1056</code>      | The window width (px) at which the SideNav is expanded and the hamburger menu is hidden.<br />1056 represents the "large" breakpoint in pixels from the Carbon Design System:<br />- small: 320<br />- medium: 672<br />- large: 1056<br />- x-large: 1312<br />- max: 1584 |
 | iconMenu                | No       | <code>let</code> | No       | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render for the closed state.<br />Defaults to `&lt;Menu size={20} /&gt;`                                                                                                                                                                                |
diff --git a/docs/src/COMPONENT_API.json b/docs/src/COMPONENT_API.json
index 2ee1d7e52b..f886b410d7 100644
--- a/docs/src/COMPONENT_API.json
+++ b/docs/src/COMPONENT_API.json
@@ -4788,7 +4788,7 @@
         {
           "name": "company",
           "kind": "let",
-          "description": "Specify the company name.  \nAlternatively, use the named slot \"company\" (e.g., `<span slot=\"company\">...</span>`)",
+          "description": "Specify the company name.\n\nAlternatively, use the named slot \"company\" (e.g., `<span slot=\"company\">...</span>`)",
           "type": "string",
           "isFunction": false,
           "isFunctionDeclaration": false,
@@ -4799,7 +4799,7 @@
         {
           "name": "platformName",
           "kind": "let",
-          "description": "Specify the platform name.\nAlternatively, use the named slot \"platform\" (e.g., `<span slot=\"platform\">...</span>`)",
+          "description": "Specify the platform name.\n\nAlternatively, use the named slot \"platform\" (e.g., `<span slot=\"platform\">...</span>`)",
           "type": "string",
           "value": "\"\"",
           "isFunction": false,
@@ -10367,7 +10367,7 @@
         { "type": "forwarded", "name": "blur", "element": "select" }
       ],
       "typedefs": [],
-      "rest_props": { "type": "Element", "name": "div" }
+      "rest_props": { "type": "Element", "name": "select" }
     },
     {
       "moduleName": "SelectItem",
diff --git a/src/ComboBox/ComboBox.svelte b/src/ComboBox/ComboBox.svelte
index 16008edc4f..0aee1350bb 100644
--- a/src/ComboBox/ComboBox.svelte
+++ b/src/ComboBox/ComboBox.svelte
@@ -224,9 +224,9 @@
       class:bx--label="{true}"
       class:bx--label--disabled="{disabled}"
     >
-    <slot name="titleText">
-      {titleText}
-    </slot>
+      <slot name="titleText">
+        {titleText}
+      </slot>
     </label>
   {/if}
   <ListBox
diff --git a/src/MultiSelect/MultiSelect.svelte b/src/MultiSelect/MultiSelect.svelte
index d0e2b0256f..93aca0cd88 100644
--- a/src/MultiSelect/MultiSelect.svelte
+++ b/src/MultiSelect/MultiSelect.svelte
@@ -300,9 +300,9 @@
       class:bx--label--disabled="{disabled}"
       class:bx--visually-hidden="{hideLabel}"
     >
-    <slot name="titleText">
-      {titleText}
-    </slot>
+      <slot name="titleText">
+        {titleText}
+      </slot>
     </label>
   {/if}
   <ListBox
diff --git a/src/Select/Select.svelte b/src/Select/Select.svelte
index d1a76f94fd..f44893b996 100644
--- a/src/Select/Select.svelte
+++ b/src/Select/Select.svelte
@@ -124,7 +124,7 @@
   $: selectedValue.set(selected ?? $defaultValue);
 </script>
 
-<div class:bx--form-item="{true}" {...$$restProps}>
+<div class:bx--form-item="{true}">
   <div
     class:bx--select="{true}"
     class:bx--select--inline="{inline}"
@@ -162,6 +162,7 @@
             class:bx--select-input="{true}"
             class:bx--select-input--sm="{size === 'sm'}"
             class:bx--select-input--xl="{size === 'xl'}"
+            {...$$restProps}
             on:change="{handleChange}"
             on:change
             on:input
@@ -206,6 +207,7 @@
           class:bx--select-input="{true}"
           class:bx--select-input--sm="{size === 'sm'}"
           class:bx--select-input--xl="{size === 'xl'}"
+          {...$$restProps}
           on:change="{handleChange}"
           on:change
           on:input
diff --git a/src/UIShell/Header.svelte b/src/UIShell/Header.svelte
index 4dd361aa05..18fff940d7 100644
--- a/src/UIShell/Header.svelte
+++ b/src/UIShell/Header.svelte
@@ -17,8 +17,9 @@
    */
   export let href = undefined;
 
-   /**
-   * Specify the company name.  
+  /**
+   * Specify the company name.
+   *
    * Alternatively, use the named slot "company" (e.g., `<span slot="company">...</span>`)
    * @type {string}
    */
@@ -26,6 +27,7 @@
 
   /**
    * Specify the platform name.
+   *
    * Alternatively, use the named slot "platform" (e.g., `<span slot="platform">...</span>`)
    */
   export let platformName = "";
diff --git a/types/Select/Select.svelte.d.ts b/types/Select/Select.svelte.d.ts
index e72c9437ef..35a581864a 100644
--- a/types/Select/Select.svelte.d.ts
+++ b/types/Select/Select.svelte.d.ts
@@ -1,7 +1,7 @@
 import type { SvelteComponentTyped } from "svelte";
 import type { SvelteHTMLElements } from "svelte/elements";
 
-type RestProps = SvelteHTMLElements["div"];
+type RestProps = SvelteHTMLElements["select"];
 
 export interface SelectProps extends RestProps {
   /**
diff --git a/types/UIShell/Header.svelte.d.ts b/types/UIShell/Header.svelte.d.ts
index a4a71ae17a..6c1240b24d 100644
--- a/types/UIShell/Header.svelte.d.ts
+++ b/types/UIShell/Header.svelte.d.ts
@@ -30,6 +30,7 @@ export interface HeaderProps extends RestProps {
 
   /**
    * Specify the company name.
+   *
    * Alternatively, use the named slot "company" (e.g., `<span slot="company">...</span>`)
    * @default undefined
    */
@@ -37,6 +38,7 @@ export interface HeaderProps extends RestProps {
 
   /**
    * Specify the platform name.
+   *
    * Alternatively, use the named slot "platform" (e.g., `<span slot="platform">...</span>`)
    * @default ""
    */