fix(searchable-dropdown): add part attribute to list-items

Closes #905

.changeset/ten-pumpkins-beg.md

@@ -0,0 +1,13 @@
+---
+'@equinor/fusion-wc-searchable-dropdown': patch
+---
+
+Add `part` attribute to list items.
+
+This will allow styling the list item outside the `shadowRoot`.
+
+```css
+fwc-searchable-dropdown::part(list-item) {
+  --fwc-list-item-vertical-padding: 4px;
+}
+```

packages/searchable-dropdown/src/dropdown/element.ts

@@ -143,6 +143,7 @@ export class SearchableDropdownElement
     /* Sett checkmark on selected items */
     if (item.meta === 'check') {
       return html`<fwc-check-list-item
+        part="list-item"
         key=${item.id}
         class=${classMap(itemClasses)}
         disabled=${ifDefined(disabled)}
@@ -158,6 +159,7 @@ export class SearchableDropdownElement
     }
 
     return html`<fwc-list-item
+      part="list-item"
       rootTabbable=${true}
       wrapFocus=${true}
       key=${item.id}
@@ -218,10 +220,10 @@ export class SearchableDropdownElement
           });
         },
         pending: () =>
-          html`<fwc-list-item disabled=${true}><fwc-dots-progress size="small" color="primary" /></fwc-list-item>`,
+          html`<fwc-list-item part="list-item" disabled=${true}><fwc-dots-progress size="small" color="primary" /></fwc-list-item>`,
         /* Error from resolvers searchQuery Promise */
         error: (e: unknown) =>
-          html`<fwc-list-item disabled=${true} class="item-error">
+          html`<fwc-list-item part="list-item" disabled=${true} class="item-error">
             <span class="item-text"><span class="item-title">${e}</span></span>
           </fwc-list-item>`,
       })}