@dile/ui 3.12.3 → 3.12.5

package/components/input/input-search.spec.js

@@ -13,7 +13,7 @@ describe('dile-input-search', () => {
     return el;
   }
 
-  it('renders a native text input and a search icon', async () => {
+  it('renders a native search input and a search icon', async () => {
     const el = await renderInputSearch('<dile-input-search placeholder="Search..."></dile-input-search>');
     const input = el.shadowRoot.querySelector('input');
     expect(input).toBeTruthy();
@@ -21,6 +21,16 @@ describe('dile-input-search', () => {
     expect(el.shadowRoot.querySelector('dile-icon')).toBeTruthy();
   });
 
+  it('renders the input as a search field with browser and password manager autofill disabled', async () => {
+    const el = await renderInputSearch('<dile-input-search></dile-input-search>');
+    const input = el.shadowRoot.querySelector('input');
+    expect(input.type).toBe('search');
+    expect(input.getAttribute('autocomplete')).toBe('off');
+    expect(input.hasAttribute('data-1p-ignore')).toBe(true);
+    expect(input.getAttribute('data-lpignore')).toBe('true');
+    expect(input.getAttribute('data-form-type')).toBe('other');
+  });
+
   it('updates the value on input and dispatches dile-input-search after the delay', async () => {
     const el = await renderInputSearch('<dile-input-search delay="10"></dile-input-search>');
     const input = el.shadowRoot.querySelector('input');

package/components/input/src/DileInputSearch.js

@@ -35,6 +35,12 @@ export class DileInputSearch extends LitElement {
             input:focus {
                 outline: none;
             }
+            input::-webkit-search-cancel-button,
+            input::-webkit-search-decoration {
+                -webkit-appearance: none;
+                appearance: none;
+                display: none;
+            }
             input::placeholder {
               /* WCAG AA contrast: #666 sobre #fff = 7.5:1 */
               color: var(--dile-input-placeholder-color, #666);
@@ -116,10 +122,13 @@ export class DileInputSearch extends LitElement {
         <div class="${this.errored ? "errored" : ""}">
             <input 
                 id="elinput"
-                type="text" 
+                type="search"
                 placeholder="${this.placeholder}" 
                 @input=${this.inputHandler}
                 autocomplete="off"
+                data-1p-ignore
+                data-lpignore="true"
+                data-form-type="other"
                 .value="${this.value}"
                 ?disabled="${this.disabled}"
                 ?readonly="${this.readOnly}"

package/components/select/src/DileSelectBoolean.js

@@ -38,6 +38,7 @@ export class DileSelectBoolean extends DileEmmitChange(LitElement) {
     this.hideErrorOnInput = false;
     this.quiet = false;
     this.internals = this.attachInternals();
+    this.value = false;
   }
 
   render() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dile/ui",
-  "version": "3.12.3",
+  "version": "3.12.5",
   "description": "UI Core components from dile-components.",
   "main": "index.js",
   "type": "module",
@@ -28,5 +28,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "6ae2b6723c619ec22ce949bcb1bd730a596ef45f"
+  "gitHead": "6dc4519272402048c116171dc4a0a78efa342db6"
 }