Combobox component updates (#2369)

* Revert to previous padding

* Remove buttons from Combobox

* Account for border in input height

* Remove unnecessary Icon class

* Add data-1p-ignore to inputs

src/lib/components/search.svelte

@@ -31,7 +31,6 @@
     {name}
     {value}
     {placeholder}
-    autocomplete="off"
     data-testid={`${testId}-input`}
     on:input
   >

src/lib/holocene/combobox/combobox.svelte

@@ -11,7 +11,6 @@
   import Menu from '$lib/holocene/menu/menu.svelte';
 
   import Badge from '../badge.svelte';
-  import Button from '../button.svelte';
   import Chip from '../chip.svelte';
   import type { IconName } from '../icon';
   import Icon from '../icon/icon.svelte';
@@ -145,14 +144,6 @@
     displayValue = getDisplayValue(selectedOption);
   }
 
-  const toggleList = () => {
-    if ($open) {
-      closeList();
-    } else {
-      openList();
-    }
-  };
-
   const openList = () => {
     $open = true;
     inputElement.focus();
@@ -348,7 +339,7 @@
 
   <div class="combobox-wrapper" class:disabled class:invalid={!valid}>
     {#if leadingIcon}
-      <Icon width={20} height={20} class="ml-2 shrink-0" name={leadingIcon} />
+      <Icon width={20} height={20} class="ml-2" name={leadingIcon} />
     {/if}
     <div
       class="input-wrapper"
@@ -385,6 +376,7 @@
         autocapitalize="off"
         spellcheck="false"
         data-lpignore="true"
+        data-1p-ignore="true"
         aria-controls="{id}-listbox"
         aria-expanded={$open}
         aria-required={required}
@@ -398,32 +390,8 @@
         {...$$restProps}
       />
     </div>
-    {#if multiselect && isArrayValue(value) && value.length > 0}
-      <Button
-        aria-label={deselectAllLabel}
-        tabindex={-1}
-        variant="ghost"
-        size="xs"
-        on:click={deselectAll}
-        {disabled}
-      >
-        <Icon name="close" />
-      </Button>
-    {/if}
-    <Button
-      aria-label={toggleLabel}
-      tabindex={-1}
-      aria-controls="{id}-listbox"
-      aria-expanded={$open}
-      variant="ghost"
-      size="xs"
-      on:click={toggleList}
-      {disabled}
-    >
-      <Icon name={$open ? 'chevron-up' : 'chevron-down'} />
-    </Button>
     {#if $$slots.action}
-      <div class="ml-1 flex h-full items-center border-l-2 border-subtle p-1">
+      <div class="ml-1 flex h-full items-center border-l-2 border-subtle p-0.5">
         <slot name="action" />
       </div>
     {/if}
@@ -490,6 +458,6 @@
   }
 
   .combobox-input {
-    @apply flex h-10 grow bg-transparent text-primary placeholder:text-secondary focus:outline-none;
+    @apply flex h-9 grow bg-transparent text-primary placeholder:text-secondary focus:outline-none;
   }
 </style>

src/lib/holocene/input/chip-input.svelte

@@ -126,6 +126,7 @@
     {/if}
     <input
       data-lpignore="true"
+      data-1p-ignore="true"
       autocomplete="off"
       class:cursor-not-allowed={disabled}
       {disabled}

src/lib/holocene/input/input.svelte

@@ -111,6 +111,7 @@
         class:disabled
         {disabled}
         data-lpignore="true"
+        data-1p-ignore="true"
         maxlength={maxLength > 0 ? maxLength : undefined}
         {placeholder}
         {id}

src/lib/holocene/input/number-input.svelte

@@ -61,6 +61,7 @@
         {min}
         {disabled}
         data-lpignore="true"
+        data-1p-ignore="true"
         {placeholder}
         {id}
         {name}