@crowdstrike/glide-core 0.6.5 → 0.8.0

package/dist/dropdown.test.basics.filterable.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './dropdown.option.js';
 import { expect, fixture, html } from '@open-wc/testing';
 import GlideCoreDropdown from './dropdown.js';

package/dist/dropdown.test.basics.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './dropdown.option.js';
 import { ArgumentError } from 'ow';
 import { expect, fixture, html } from '@open-wc/testing';

package/dist/dropdown.test.basics.multiple.js

@@ -1,7 +1,7 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './dropdown.option.js';
 import { expect, fixture, html } from '@open-wc/testing';
 import GlideCoreDropdown from './dropdown.js';
-import GlideCoreDropdownOption from './dropdown.option.js';
 GlideCoreDropdown.shadowRootOptions.mode = 'open';
 it('is accessible', async () => {
     const component = await fixture(html `<glide-core-dropdown label="Label" placeholder="Placeholder" multiple>

package/dist/dropdown.test.basics.single.js

@@ -1,6 +1,6 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import { expect, fixture, html } from '@open-wc/testing';
 import GlideCoreDropdown from './dropdown.js';
-import GlideCoreDropdownOption from './dropdown.option.js';
 GlideCoreDropdown.shadowRootOptions.mode = 'open';
 it('is accessible ', async () => {
     const component = await fixture(html `<glide-core-dropdown label="Label" placeholder="Placeholder">

package/dist/dropdown.test.events.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import * as sinon from 'sinon';
 import { aTimeout, expect, fixture, html, oneEvent } from '@open-wc/testing';
 import { sendKeys } from '@web/test-runner-commands';

package/dist/dropdown.test.events.multiple.js

@@ -1,5 +1,6 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import * as sinon from 'sinon';
-import { aTimeout, expect, fixture, html } from '@open-wc/testing';
+import { aTimeout, expect, fixture, html, oneEvent } from '@open-wc/testing';
 import GlideCoreDropdown from './dropdown.js';
 import GlideCoreDropdownOption from './dropdown.option.js';
 GlideCoreDropdown.shadowRootOptions.mode = 'open';
@@ -62,7 +63,7 @@ it('dispatches one "input" event when Select All is clicked', async () => {
     await aTimeout(0);
     expect(spy.calledOnce).to.be.true;
 });
-it('dispatches one "change" event when `value` is changed programmatically', async () => {
+it('does not dispatch a "change" event when `value` is changed programmatically', async () => {
     const component = await fixture(html `<glide-core-dropdown
       label="Label"
       placeholder="Placeholder"
@@ -91,9 +92,42 @@ it('dispatches one "change" event when `value` is changed programmatically', asy
         component.value = ['one', 'two'];
     });
     await aTimeout(0);
-    expect(spy.calledOnce).to.be.true;
+    expect(spy.called).to.be.false;
+});
+it('continues to dispatch "change" events upon selection after `value` is changed programmatically', async () => {
+    const component = await fixture(html `<glide-core-dropdown
+      label="Label"
+      placeholder="Placeholder"
+      open
+      multiple
+    >
+      <glide-core-dropdown-option
+        label="One"
+        value="one"
+      ></glide-core-dropdown-option>
+
+      <glide-core-dropdown-option
+        label="Two"
+        value="two"
+        selected
+      ></glide-core-dropdown-option>
+
+      <glide-core-dropdown-option
+        label="Three"
+        value="three"
+        selected
+      ></glide-core-dropdown-option>
+    </glide-core-dropdown>`);
+    component.value = ['one', 'two'];
+    setTimeout(() => {
+        component
+            .querySelector('glide-core-dropdown-option:last-of-type')
+            ?.click();
+    });
+    const event = await oneEvent(component, 'change');
+    expect(event instanceof Event).to.be.true;
 });
-it('dispatches one "input" event when `value` is changed programmatically', async () => {
+it('does not dispatch an "input" event when `value` is changed programmatically', async () => {
     const component = await fixture(html `<glide-core-dropdown
       label="Label"
       placeholder="Placeholder"
@@ -122,7 +156,40 @@ it('dispatches one "input" event when `value` is changed programmatically', asyn
         component.value = ['one', 'two'];
     });
     await aTimeout(0);
-    expect(spy.calledOnce).to.be.true;
+    expect(spy.called).to.be.false;
+});
+it('continues to dispatch "input" events upon selection after `value` is changed programmatically', async () => {
+    const component = await fixture(html `<glide-core-dropdown
+      label="Label"
+      placeholder="Placeholder"
+      open
+      multiple
+    >
+      <glide-core-dropdown-option
+        label="One"
+        value="one"
+      ></glide-core-dropdown-option>
+
+      <glide-core-dropdown-option
+        label="Two"
+        value="two"
+        selected
+      ></glide-core-dropdown-option>
+
+      <glide-core-dropdown-option
+        label="Three"
+        value="three"
+        selected
+      ></glide-core-dropdown-option>
+    </glide-core-dropdown>`);
+    component.value = ['one', 'two'];
+    setTimeout(() => {
+        component
+            .querySelector('glide-core-dropdown-option:last-of-type')
+            ?.click();
+    });
+    const event = await oneEvent(component, 'input');
+    expect(event instanceof Event).to.be.true;
 });
 it('dispatches a "change" event when an option is selected after Select All is clicked', async () => {
     const component = await fixture(html `<glide-core-dropdown

package/dist/dropdown.test.events.single.js

@@ -1,9 +1,10 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './dropdown.option.js';
 import * as sinon from 'sinon';
-import { aTimeout, expect, fixture, html } from '@open-wc/testing';
+import { aTimeout, expect, fixture, html, oneEvent } from '@open-wc/testing';
 import GlideCoreDropdown from './dropdown.js';
 GlideCoreDropdown.shadowRootOptions.mode = 'open';
-it('dispatches one "change" event when `value` is changed programmatically', async () => {
+it('does not dispatch a "change" event when `value` is changed programmatically', async () => {
     const component = await fixture(html `<glide-core-dropdown label="Label" placeholder="Placeholder" open>
       <glide-core-dropdown-option
         label="One"
@@ -22,9 +23,29 @@ it('dispatches one "change" event when `value` is changed programmatically', asy
         component.value = ['one'];
     });
     await aTimeout(0);
-    expect(spy.calledOnce).to.be.true;
+    expect(spy.called).to.be.false;
 });
-it('dispatches one "input" event when `value` is changed programmatically', async () => {
+it('continues to dispatch "change" events upon selection after `value` is changed programmatically', async () => {
+    const component = await fixture(html `<glide-core-dropdown label="Label" placeholder="Placeholder" open>
+      <glide-core-dropdown-option
+        label="One"
+        value="one"
+      ></glide-core-dropdown-option>
+
+      <glide-core-dropdown-option
+        label="Two"
+        value="two"
+        selected
+      ></glide-core-dropdown-option>
+    </glide-core-dropdown>`);
+    component.value = ['two'];
+    setTimeout(() => {
+        component.querySelector('glide-core-dropdown-option')?.click();
+    });
+    const event = await oneEvent(component, 'change');
+    expect(event instanceof Event).to.be.true;
+});
+it('does not dispatch an "input" event when `value` is changed programmatically', async () => {
     const component = await fixture(html `<glide-core-dropdown label="Label" placeholder="Placeholder" open>
       <glide-core-dropdown-option
         label="One"
@@ -43,5 +64,25 @@ it('dispatches one "input" event when `value` is changed programmatically', asyn
         component.value = ['one'];
     });
     await aTimeout(0);
-    expect(spy.calledOnce).to.be.true;
+    expect(spy.called).to.be.false;
+});
+it('continues to dispatch "input" events upon selection after `value` is changed programmatically', async () => {
+    const component = await fixture(html `<glide-core-dropdown label="Label" placeholder="Placeholder" open>
+      <glide-core-dropdown-option
+        label="One"
+        value="one"
+      ></glide-core-dropdown-option>
+
+      <glide-core-dropdown-option
+        label="Two"
+        value="two"
+        selected
+      ></glide-core-dropdown-option>
+    </glide-core-dropdown>`);
+    component.value = ['two'];
+    setTimeout(() => {
+        component.querySelector('glide-core-dropdown-option')?.click();
+    });
+    const event = await oneEvent(component, 'input');
+    expect(event instanceof Event).to.be.true;
 });

package/dist/dropdown.test.focus.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './dropdown.option.js';
 import { expect, fixture, html } from '@open-wc/testing';
 import { sendKeys } from '@web/test-runner-commands';
@@ -5,9 +6,14 @@ import GlideCoreDropdown from './dropdown.js';
 import GlideCoreDropdownOption from './dropdown.option.js';
 GlideCoreDropdown.shadowRootOptions.mode = 'open';
 GlideCoreDropdownOption.shadowRootOptions.mode = 'open';
-it('closes when it loses focus', async () => {
+it('closes and reports validity when it loses focus', async () => {
     const div = document.createElement('div');
-    const component = await fixture(html `<glide-core-dropdown label="Label" placeholder="Placeholder" open>
+    const component = await fixture(html `<glide-core-dropdown
+      label="Label"
+      placeholder="Placeholder"
+      open
+      required
+    >
       <glide-core-dropdown-option
         label="Label"
         value="value"
@@ -25,4 +31,7 @@ it('closes when it loses focus', async () => {
     await sendKeys({ down: 'Shift' });
     await sendKeys({ press: 'Tab' });
     expect(component.open).to.be.false;
+    expect(component.shadowRoot?.activeElement).to.equal(null);
+    expect(component.validity.valid).to.equal(false);
+    expect(component.shadowRoot?.querySelector('glide-core-label')?.error).to.equal(true);
 });

package/dist/dropdown.test.focus.multiple.js

@@ -2,7 +2,6 @@ import './dropdown.option.js';
 import { elementUpdated, expect, fixture, html } from '@open-wc/testing';
 import GlideCoreDropdown from './dropdown.js';
 import GlideCoreDropdownOption from './dropdown.option.js';
-import GlideCoreTag from './tag.js';
 GlideCoreDropdown.shadowRootOptions.mode = 'open';
 GlideCoreDropdownOption.shadowRootOptions.mode = 'open';
 it('focuses the button when `focus` is called', async () => {

package/dist/dropdown.test.form.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './dropdown.option.js';
 import { elementUpdated, expect, fixture, html } from '@open-wc/testing';
 import GlideCoreDropdown from './dropdown.js';

package/dist/dropdown.test.form.multiple.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './dropdown.option.js';
 import { elementUpdated, expect, fixture, html } from '@open-wc/testing';
 import GlideCoreDropdown from './dropdown.js';

package/dist/dropdown.test.form.single.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './dropdown.option.js';
 import { elementUpdated, expect, fixture, html } from '@open-wc/testing';
 import GlideCoreDropdown from './dropdown.js';

package/dist/dropdown.test.interactions.filterable.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import { assert, elementUpdated, expect, fixture, html, } from '@open-wc/testing';
 import { sendKeys } from '@web/test-runner-commands';
 import GlideCoreDropdown from './dropdown.js';

package/dist/dropdown.test.interactions.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import { assert, expect, fixture, html } from '@open-wc/testing';
 import { sendKeys, sendMouse } from '@web/test-runner-commands';
 import GlideCoreDropdown from './dropdown.js';

package/dist/dropdown.test.interactions.multiple.js

@@ -1,9 +1,9 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import { assert, elementUpdated, expect, fixture, html, } from '@open-wc/testing';
 import { sendKeys } from '@web/test-runner-commands';
 import { sendMouse } from '@web/test-runner-commands';
 import GlideCoreDropdown from './dropdown.js';
 import GlideCoreDropdownOption from './dropdown.option.js';
-import GlideCoreTag from './tag.js';
 GlideCoreDropdown.shadowRootOptions.mode = 'open';
 GlideCoreDropdownOption.shadowRootOptions.mode = 'open';
 it('opens on click', async () => {

package/dist/dropdown.test.interactions.single.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import { ArgumentError } from 'ow';
 import { assert, elementUpdated, expect, fixture, html, } from '@open-wc/testing';
 import { sendKeys } from '@web/test-runner-commands';

package/dist/dropdown.test.validity.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './dropdown.option.js';
 import { expect, fixture, html } from '@open-wc/testing';
 import GlideCoreDropdown from './dropdown.js';

package/dist/form-controls-layout.test.basics.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './checkbox.js';
 import './input.js';
 import { ArgumentError } from 'ow';

package/dist/icon-button.test.basics.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './icon-button.js';
 import { ArgumentError } from 'ow';
 import { assert, expect, fixture, html } from '@open-wc/testing';

package/dist/input.d.ts

@@ -61,7 +61,8 @@ export default class GlideCoreInput extends LitElement {
     get valueCharacterCount(): number;
     constructor();
     private hasFocus;
-    private isCheckingValidity?;
+    private isBlurring;
+    private isCheckingValidity;
     private isReportValidityOrSubmit;
     private passwordVisible;
 }

package/dist/input.js

@@ -1 +1 @@
-var __decorate=this&&this.__decorate||function(e,t,i,o){var r,s=arguments.length,a=s<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,o);else for(var l=e.length-1;l>=0;l--)(r=e[l])&&(a=(s<3?r(a):s>3?r(t,i,a):r(t,i))||a);return s>3&&a&&Object.defineProperty(t,i,a),a};import"./icon-button.js";import"./label.js";import{LitElement,html,nothing}from"lit";import{LocalizeController}from"./library/localize.js";import{classMap}from"lit/directives/class-map.js";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property,queryAssignedNodes,state}from"lit/decorators.js";import{ifDefined}from"lit/directives/if-defined.js";import magnifyingGlassIcon from"./icons/magnifying-glass.js";import ow from"./library/ow.js";import styles from"./input.styles.js";export const SUPPORTED_TYPES=["email","number","password","search","tel","text","url"];let GlideCoreInput=class GlideCoreInput extends LitElement{static{this.formAssociated=!0}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:"closed",delegatesFocus:!0}}static{this.styles=styles}get form(){return this.#e.form}get validity(){return this.#e.validity}get willValidate(){return this.#e.willValidate}blur(){this.#t?.blur()}checkValidity(){return this.isCheckingValidity=!0,this.#e.checkValidity()}disconnectedCallback(){super.disconnectedCallback(),this.form?.removeEventListener("formdata",this.#i)}firstUpdated(){this.#o()}formAssociatedCallback(){this.form?.addEventListener("formdata",this.#i)}formResetCallback(){this.value=this.getAttribute("value")??""}get isTypeSearch(){return"search"===this.type}get hasClearIcon(){return this.clearable&&!this.disabled&&!this.readonly}get isClearIconVisible(){return this.hasClearIcon&&this.value.length>0}render(){return html`<glide-core-label class="${classMap({left:"left"===this.privateSplit,middle:"middle"===this.privateSplit})}" orientation="${this.orientation}" split="${ifDefined(this.privateSplit??void 0)}" ?disabled="${this.disabled}" ?error="${this.#r||this.#s}" ?hide="${this.hideLabel}" ?required="${this.required}"><slot name="tooltip" slot="tooltip"></slot><label for="input">${this.label}</label><div class="${classMap({"input-box":!0,focused:this.hasFocus,empty:""===this.value,disabled:this.disabled,readonly:this.readonly&&!this.disabled,error:this.#r||this.#s})}" slot="control"><slot name="prefix"></slot><input aria-describedby="meta" id="input" type="${"password"===this.type&&this.passwordVisible?"text":this.type}" .value="${this.value}" placeholder="${ifDefined(this.placeholder)}" autocapitalize="${ifDefined(this.autocapitalize)}" spellcheck="${this.spellcheck}" ?required="${this.required}" ?readonly="${this.readonly}" ?disabled="${this.disabled}" @focus="${this.#a}" @blur="${this.#l}" @change="${this.#n}" @input="${this.#d}" ${ref(this.#p)}> ${this.hasClearIcon?html`<glide-core-icon-button variant="tertiary" class="${classMap({"clear-icon-button":!0,"clear-icon-button--visible":this.isClearIconVisible})}" aria-label="${this.#h.term("clearEntry")}" @click="${this.#c}" tabindex="-1"><slot name="clear-icon"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor"><path d="M6 6L18 18" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M18 6L6 18" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg></slot></glide-core-icon-button>`:""} ${"password"===this.type&&this.passwordToggle&&!this.disabled?html`<glide-core-icon-button variant="tertiary" class="password-toggle" aria-label="${this.passwordVisible?"Hide password":"Show password"}" aria-controls="input" aria-expanded="${this.passwordVisible?"true":"false"}" @click="${this.#u}" tabindex="-1">${this.passwordVisible?html`<svg width="16" height="16" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M3.98 8.223A10.477 10.477 0 0 0 1.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.451 10.451 0 0 1 12 4.5c4.756 0 8.773 3.162 10.065 7.498a10.522 10.522 0 0 1-4.293 5.774M6.228 6.228 3 3m3.228 3.228 3.65 3.65m7.894 7.894L21 21m-3.228-3.228-3.65-3.65m0 0a3 3 0 1 0-4.243-4.243m4.242 4.242L9.88 9.88"/></svg>`:html`<svg width="16" height="16" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z"/><path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/></svg>`}</glide-core-icon-button>`:""}<div class="suffix">${this.isTypeSearch?magnifyingGlassIcon:html`<slot name="suffix"></slot>`}</div></div><div class="meta" id="meta" slot="description"><slot class="description" name="description"></slot>${this.maxlength?html`<div class="${classMap({"character-count":!0,error:this.#s})}">${this.valueCharacterCount}/${this.maxlength}</div>`:nothing}</div></glide-core-label>`}reportValidity(){return this.#e.reportValidity()}get valueCharacterCount(){return this.value.length}constructor(){super(),this.type="text",this.value="",this.hideLabel=!1,this.orientation="horizontal",this.clearable=!1,this.spellcheck=!1,this.autocapitalize="on",this.passwordToggle=!1,this.required=!1,this.readonly=!1,this.disabled=!1,this.hasFocus=!1,this.isReportValidityOrSubmit=!1,this.passwordVisible=!1,this.#p=createRef(),this.#h=new LocalizeController(this),this.#i=({formData:e})=>{this.name&&this.value&&!this.disabled&&e.append(this.name,this.value)},this.#e=this.attachInternals(),this.addEventListener("invalid",(e=>{e?.preventDefault(),this.isCheckingValidity||(this.isReportValidityOrSubmit=!0,this.focus())}))}#p;#e;#h;#i;get#s(){return Boolean(this.maxlength&&this.valueCharacterCount>this.maxlength)}get#r(){return!this.disabled&&!this.validity?.valid&&this.isReportValidityOrSubmit}get#t(){return this.#p.value}#l(){this.hasFocus=!1}#n(e){ow(this.#t,ow.object.instanceOf(HTMLInputElement)),this.value=this.#t.value,this.#o(),this.dispatchEvent(new Event(e.type,e))}#c(e){this.value="",this.dispatchEvent(new Event("clear",{bubbles:!0})),this.#t?.focus(),this.#o(),e.stopPropagation()}#a(){this.hasFocus=!0}#d(){ow(this.#t,ow.object.instanceOf(HTMLInputElement)),this.value=this.#t.value,this.#o()}#u(){this.passwordVisible=!this.passwordVisible}async#o(){await this.updateComplete,this.#e.setValidity(this.#t?.validity,this.#t?.validationMessage,this.#t)}};__decorate([property()],GlideCoreInput.prototype,"type",void 0),__decorate([property({reflect:!0})],GlideCoreInput.prototype,"name",void 0),__decorate([property()],GlideCoreInput.prototype,"value",void 0),__decorate([property()],GlideCoreInput.prototype,"label",void 0),__decorate([property({attribute:"hide-label",type:Boolean})],GlideCoreInput.prototype,"hideLabel",void 0),__decorate([property({reflect:!0})],GlideCoreInput.prototype,"orientation",void 0),__decorate([property()],GlideCoreInput.prototype,"placeholder",void 0),__decorate([property({type:Boolean})],GlideCoreInput.prototype,"clearable",void 0),__decorate([property({type:Boolean})],GlideCoreInput.prototype,"spellcheck",void 0),__decorate([property()],GlideCoreInput.prototype,"autocapitalize",void 0),__decorate([property({attribute:"password-toggle",type:Boolean})],GlideCoreInput.prototype,"passwordToggle",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreInput.prototype,"required",void 0),__decorate([property({type:Boolean})],GlideCoreInput.prototype,"readonly",void 0),__decorate([property({type:Boolean})],GlideCoreInput.prototype,"disabled",void 0),__decorate([property()],GlideCoreInput.prototype,"privateSplit",void 0),__decorate([property({type:Number,converter:e=>e&&Number.parseInt(e,10)})],GlideCoreInput.prototype,"maxlength",void 0),__decorate([queryAssignedNodes({slot:"description"})],GlideCoreInput.prototype,"descriptionNodes",void 0),__decorate([queryAssignedNodes({slot:"prefix"})],GlideCoreInput.prototype,"prefixIconNodes",void 0),__decorate([queryAssignedNodes({slot:"suffix"})],GlideCoreInput.prototype,"suffixIconNodes",void 0),__decorate([state()],GlideCoreInput.prototype,"hasFocus",void 0),__decorate([state()],GlideCoreInput.prototype,"isCheckingValidity",void 0),__decorate([state()],GlideCoreInput.prototype,"isReportValidityOrSubmit",void 0),__decorate([state()],GlideCoreInput.prototype,"passwordVisible",void 0),GlideCoreInput=__decorate([customElement("glide-core-input")],GlideCoreInput);export default GlideCoreInput;
+var __decorate=this&&this.__decorate||function(t,e,i,o){var r,s=arguments.length,a=s<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,i,o);else for(var l=t.length-1;l>=0;l--)(r=t[l])&&(a=(s<3?r(a):s>3?r(e,i,a):r(e,i))||a);return s>3&&a&&Object.defineProperty(e,i,a),a};import"./icon-button.js";import"./label.js";import{LitElement,html,nothing}from"lit";import{LocalizeController}from"./library/localize.js";import{classMap}from"lit/directives/class-map.js";import{createRef,ref}from"lit/directives/ref.js";import{customElement,property,queryAssignedNodes,state}from"lit/decorators.js";import{ifDefined}from"lit/directives/if-defined.js";import magnifyingGlassIcon from"./icons/magnifying-glass.js";import ow from"./library/ow.js";import styles from"./input.styles.js";export const SUPPORTED_TYPES=["email","number","password","search","tel","text","url"];let GlideCoreInput=class GlideCoreInput extends LitElement{static{this.formAssociated=!0}static{this.shadowRootOptions={...LitElement.shadowRootOptions,mode:"closed",delegatesFocus:!0}}static{this.styles=styles}get form(){return this.#t.form}get validity(){return this.#t.validity}get willValidate(){return this.#t.willValidate}blur(){this.#e?.blur()}checkValidity(){this.isCheckingValidity=!0;const t=this.#t.checkValidity();return this.isCheckingValidity=!1,t}disconnectedCallback(){super.disconnectedCallback(),this.form?.removeEventListener("formdata",this.#i)}firstUpdated(){this.#o()}formAssociatedCallback(){this.form?.addEventListener("formdata",this.#i)}formResetCallback(){this.value=this.getAttribute("value")??""}get isTypeSearch(){return"search"===this.type}get hasClearIcon(){return this.clearable&&!this.disabled&&!this.readonly}get isClearIconVisible(){return this.hasClearIcon&&this.value.length>0}render(){return html`<glide-core-label class="${classMap({left:"left"===this.privateSplit,middle:"middle"===this.privateSplit})}" orientation="${this.orientation}" split="${ifDefined(this.privateSplit??void 0)}" ?disabled="${this.disabled}" ?error="${this.#r||this.#s}" ?hide="${this.hideLabel}" ?required="${this.required}"><slot name="tooltip" slot="tooltip"></slot><label for="input">${this.label}</label><div class="${classMap({"input-box":!0,focused:this.hasFocus,empty:""===this.value,disabled:this.disabled,readonly:this.readonly&&!this.disabled,error:this.#r||this.#s})}" slot="control"><slot name="prefix"></slot><input aria-describedby="meta" id="input" type="${"password"===this.type&&this.passwordVisible?"text":this.type}" .value="${this.value}" placeholder="${ifDefined(this.placeholder)}" autocapitalize="${ifDefined(this.autocapitalize)}" spellcheck="${this.spellcheck}" ?required="${this.required}" ?readonly="${this.readonly}" ?disabled="${this.disabled}" @focus="${this.#a}" @blur="${this.#l}" @change="${this.#n}" @input="${this.#d}" ${ref(this.#p)}> ${this.hasClearIcon?html`<glide-core-icon-button variant="tertiary" class="${classMap({"clear-icon-button":!0,"clear-icon-button--visible":this.isClearIconVisible})}" aria-label="${this.#h.term("clearEntry")}" @click="${this.#c}" tabindex="-1"><slot name="clear-icon"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor"><path d="M6 6L18 18" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M18 6L6 18" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg></slot></glide-core-icon-button>`:""} ${"password"===this.type&&this.passwordToggle&&!this.disabled?html`<glide-core-icon-button variant="tertiary" class="password-toggle" aria-label="${this.passwordVisible?"Hide password":"Show password"}" aria-controls="input" aria-expanded="${this.passwordVisible?"true":"false"}" @click="${this.#u}" tabindex="-1">${this.passwordVisible?html`<svg width="16" height="16" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M3.98 8.223A10.477 10.477 0 0 0 1.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.451 10.451 0 0 1 12 4.5c4.756 0 8.773 3.162 10.065 7.498a10.522 10.522 0 0 1-4.293 5.774M6.228 6.228 3 3m3.228 3.228 3.65 3.65m7.894 7.894L21 21m-3.228-3.228-3.65-3.65m0 0a3 3 0 1 0-4.243-4.243m4.242 4.242L9.88 9.88"/></svg>`:html`<svg width="16" height="16" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z"/><path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/></svg>`}</glide-core-icon-button>`:""}<div class="suffix">${this.isTypeSearch?magnifyingGlassIcon:html`<slot name="suffix"></slot>`}</div></div><div class="meta" id="meta" slot="description"><slot class="description" name="description"></slot>${this.maxlength?html`<div class="${classMap({"character-count":!0,error:this.#s})}">${this.valueCharacterCount}/${this.maxlength}</div>`:nothing}</div></glide-core-label>`}reportValidity(){this.isReportValidityOrSubmit=!0;const t=this.#t.reportValidity();return this.requestUpdate(),t}get valueCharacterCount(){return this.value.length}constructor(){super(),this.type="text",this.value="",this.hideLabel=!1,this.orientation="horizontal",this.clearable=!1,this.spellcheck=!1,this.autocapitalize="on",this.passwordToggle=!1,this.required=!1,this.readonly=!1,this.disabled=!1,this.hasFocus=!1,this.isBlurring=!1,this.isCheckingValidity=!1,this.isReportValidityOrSubmit=!1,this.passwordVisible=!1,this.#p=createRef(),this.#h=new LocalizeController(this),this.#i=({formData:t})=>{this.name&&this.value&&!this.disabled&&t.append(this.name,this.value)},this.#t=this.attachInternals(),this.addEventListener("invalid",(t=>{if(t?.preventDefault(),this.isCheckingValidity||this.isBlurring)return;this.isReportValidityOrSubmit=!0;this.form?.querySelector(":invalid")===this&&this.focus()}))}#p;#t;#h;#i;get#s(){return Boolean(this.maxlength&&this.valueCharacterCount>this.maxlength)}get#r(){return!this.disabled&&!this.validity?.valid&&this.isReportValidityOrSubmit}get#e(){return this.#p.value}#l(){this.isBlurring=!0,this.reportValidity(),this.isBlurring=!1,this.hasFocus=!1}#n(t){ow(this.#e,ow.object.instanceOf(HTMLInputElement)),this.value=this.#e.value,this.#o(),this.dispatchEvent(new Event(t.type,t))}#c(t){this.value="",this.dispatchEvent(new Event("clear",{bubbles:!0})),this.#e?.focus(),this.#o(),t.stopPropagation()}#a(){this.hasFocus=!0}#d(){ow(this.#e,ow.object.instanceOf(HTMLInputElement)),this.value=this.#e.value,this.#o()}#u(){this.passwordVisible=!this.passwordVisible}async#o(){await this.updateComplete,this.#t.setValidity(this.#e?.validity,this.#e?.validationMessage,this.#e),this.isReportValidityOrSubmit&&this.reportValidity()}};__decorate([property()],GlideCoreInput.prototype,"type",void 0),__decorate([property({reflect:!0})],GlideCoreInput.prototype,"name",void 0),__decorate([property()],GlideCoreInput.prototype,"value",void 0),__decorate([property()],GlideCoreInput.prototype,"label",void 0),__decorate([property({attribute:"hide-label",type:Boolean})],GlideCoreInput.prototype,"hideLabel",void 0),__decorate([property({reflect:!0})],GlideCoreInput.prototype,"orientation",void 0),__decorate([property()],GlideCoreInput.prototype,"placeholder",void 0),__decorate([property({type:Boolean})],GlideCoreInput.prototype,"clearable",void 0),__decorate([property({type:Boolean})],GlideCoreInput.prototype,"spellcheck",void 0),__decorate([property()],GlideCoreInput.prototype,"autocapitalize",void 0),__decorate([property({attribute:"password-toggle",type:Boolean})],GlideCoreInput.prototype,"passwordToggle",void 0),__decorate([property({reflect:!0,type:Boolean})],GlideCoreInput.prototype,"required",void 0),__decorate([property({type:Boolean})],GlideCoreInput.prototype,"readonly",void 0),__decorate([property({type:Boolean})],GlideCoreInput.prototype,"disabled",void 0),__decorate([property()],GlideCoreInput.prototype,"privateSplit",void 0),__decorate([property({type:Number,converter:t=>t&&Number.parseInt(t,10)})],GlideCoreInput.prototype,"maxlength",void 0),__decorate([queryAssignedNodes({slot:"description"})],GlideCoreInput.prototype,"descriptionNodes",void 0),__decorate([queryAssignedNodes({slot:"prefix"})],GlideCoreInput.prototype,"prefixIconNodes",void 0),__decorate([queryAssignedNodes({slot:"suffix"})],GlideCoreInput.prototype,"suffixIconNodes",void 0),__decorate([state()],GlideCoreInput.prototype,"hasFocus",void 0),__decorate([state()],GlideCoreInput.prototype,"isBlurring",void 0),__decorate([state()],GlideCoreInput.prototype,"isCheckingValidity",void 0),__decorate([state()],GlideCoreInput.prototype,"isReportValidityOrSubmit",void 0),__decorate([state()],GlideCoreInput.prototype,"passwordVisible",void 0),GlideCoreInput=__decorate([customElement("glide-core-input")],GlideCoreInput);export default GlideCoreInput;

package/dist/input.test.basics.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import { expect, fixture, html } from '@open-wc/testing';
 import { sendKeys } from '@web/test-runner-commands';
 import GlideCoreInput from './input.js';

package/dist/input.test.events.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './input.js';
 import * as sinon from 'sinon';
 import { aTimeout, expect, fixture, html, oneEvent } from '@open-wc/testing';

package/dist/input.test.focus.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './input.js';
 import { expect, fixture, html } from '@open-wc/testing';
 import Input from './input.js';
@@ -17,7 +18,7 @@ it('focuses the input after submit when required and no value', async () => {
     const inputElement = input.shadowRoot?.querySelector('input');
     expect(input.shadowRoot?.activeElement).to.be.equal(inputElement);
 });
-it('blurs the input if `blur` is called', async () => {
+it('blurs the input and reports validity if `blur` is called', async () => {
     const input = await fixture(html `<glide-core-input required></glide-core-input>`);
     input.focus();
     const inputElement = input.shadowRoot?.querySelector('input');
@@ -25,6 +26,8 @@ it('blurs the input if `blur` is called', async () => {
     input.blur();
     await input.updateComplete;
     expect(input.shadowRoot?.activeElement).to.equal(null);
+    expect(input.validity.valid).to.equal(false);
+    expect(input.shadowRoot?.querySelector('glide-core-label')?.error).to.equal(true);
 });
 it('focuses the input after `reportValidity` is called when required and no value', async () => {
     const form = document.createElement('form');
@@ -42,7 +45,7 @@ it('focuses the input after `requestSubmit` is called when required and no value
     });
     form.requestSubmit();
     const inputElement = input.shadowRoot?.querySelector('input');
-    expect(input.shadowRoot?.activeElement).to.equal(inputElement);
+    expect(input.shadowRoot?.activeElement === inputElement).to.be.true;
 });
 it('does not focus the input after `checkValidity` is called', async () => {
     const form = document.createElement('form');
@@ -50,5 +53,5 @@ it('does not focus the input after `checkValidity` is called', async () => {
         parentNode: form,
     });
     input.checkValidity();
-    expect(input.shadowRoot?.activeElement).to.equal(null);
+    expect(input.shadowRoot?.activeElement === null).to.be.true;
 });

package/dist/input.test.form.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './input.js';
 import { expect, fixture, html } from '@open-wc/testing';
 it('can be reset to initial value', async () => {

package/dist/input.test.validity.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './input.js';
 import { expect, fixture, html } from '@open-wc/testing';
 import { sendKeys } from '@web/test-runner-commands';

package/dist/label.styles.js

@@ -5,10 +5,10 @@ import{css}from"lit";import focusOutline from"./styles/focus-outline.js";import
         display: grid;
 
         /*
-         Since 1fr is actually minmax(auto, 1fr), this explicit minmax will make it so
-         the first column is sized to its content, and the second column fills the rest
-         of the space.
-        */
+       Since 1fr is actually minmax(auto, 1fr), this explicit minmax will make it so
+       the first column is sized to its content, and the second column fills the rest
+       of the space.
+      */
         grid-template-columns: auto minmax(0, 1fr);
       }
 
@@ -54,9 +54,9 @@ import{css}from"lit";import focusOutline from"./styles/focus-outline.js";import
 
       &.visible {
         /*
-      The default is "display: content". But "order" does not work with
-      "display: content" and "order" is needed above.
-    */
+    The default is "display: content". But "order" does not work with
+    "display: content" and "order" is needed above.
+  */
         display: block;
       }
     }
@@ -68,10 +68,10 @@ import{css}from"lit";import focusOutline from"./styles/focus-outline.js";import
       color: var(--glide-core-text-body-1);
 
       /*
-      Any "display" that's not inline-level will do. We don't want the button to
-      acquire a line box, which will make it taller than its content and thus
-      make it difficult to center vertically with the label.
-      */
+    Any "display" that's not inline-level will do. We don't want the button to
+    acquire a line box, which will make it taller than its content and thus
+    make it difficult to center vertically with the label.
+    */
 
       display: flex;
       padding: 0;

package/dist/label.test.basics.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import { ArgumentError } from 'ow';
 import { expect, fixture, html, waitUntil } from '@open-wc/testing';
 import GlideCoreLabel from './label.js';

package/dist/library/localize.d.ts

@@ -13,5 +13,7 @@ export interface Translation extends DefaultTranslation {
     clearEntry: string;
     moreInformation: string;
     notifications: string;
+    nextTab: string;
+    previousTab: string;
     removeTag: (name: string) => string;
 }

package/dist/library/ow.test.d.ts

@@ -1,4 +1,5 @@
 import { LitElement } from 'lit';
 export default class GlideCoreSlot extends LitElement {
-    render(): any;
+    static shadowRootOptions: ShadowRootInit;
+    render(): import("lit").TemplateResult<1>;
 }

package/dist/library/ow.test.js

@@ -1,24 +1,29 @@
+/* eslint-disable @typescript-eslint/no-unsafe-call */
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-/* eslint-disable @crowdstrike/glide-core-eslint-plugin/prefer-closed-shadow-root */
-/* This is a test file that doesn't contain one of our components, so we don't need to enforce this rule. */
 import { LitElement } from 'lit';
 import { assert, expect, fixture, html } from '@open-wc/testing';
 import { customElement } from 'lit/decorators.js';
+import { html as litHtml } from 'lit';
 import { owSlot, owSlotType } from './ow.js';
 let GlideCoreSlot = class GlideCoreSlot extends LitElement {
+    static { this.shadowRootOptions = {
+        ...LitElement.shadowRootOptions,
+        mode: 'closed',
+    }; }
     render() {
-        return html `<slot></slot>`;
+        return litHtml `<slot></slot>`;
     }
 };
 GlideCoreSlot = __decorate([
     customElement('glide-core-slot')
 ], GlideCoreSlot);
 export default GlideCoreSlot;
+GlideCoreSlot.shadowRootOptions.mode = 'open';
 it('throws when a slot lacks a node', async () => {
     const component = await fixture(html `<glide-core-slot></glide-core-slot>`);
     const slot = component.shadowRoot?.querySelector('slot');

package/dist/menu.button.test.basics.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import { expect, fixture, html } from '@open-wc/testing';
 import GlideCoreMenuButton from './menu.button.js';
 GlideCoreMenuButton.shadowRootOptions.mode = 'open';

package/dist/menu.link.test.basics.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import { expect, fixture, html } from '@open-wc/testing';
 import GlideCoreMenuLink from './menu.link.js';
 GlideCoreMenuLink.shadowRootOptions.mode = 'open';

package/dist/menu.options.test.basics.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './menu.button.js';
 import './menu.link.js';
 import { ArgumentError } from 'ow';

package/dist/menu.styles.js

@@ -31,10 +31,10 @@ import{css}from"lit";export default[css`
       visibility: hidden;
 
       /*
-        ".container" is relative and many Menus may be stacked in a column.
-        This ensures the ".menu" of Menus earlier in the column aren't obscured
-        by the ".target-container" that come later.
-      */
+      ".container" is relative and many Menus may be stacked in a column.
+      This ensures the ".menu" of Menus earlier in the column aren't obscured
+      by the ".target-container" that come later.
+    */
       z-index: 1;
 
       &.visible {

package/dist/menu.test.basics.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './menu.button.js';
 import './menu.link.js';
 import { ArgumentError } from 'ow';

package/dist/menu.test.events.d.ts

@@ -1,2 +1,3 @@
+import './menu.js';
 import './menu.link.js';
 import './menu.options.js';

package/dist/menu.test.events.js

@@ -1,7 +1,8 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
+import './menu.js';
 import './menu.link.js';
 import './menu.options.js';
 import { expect, fixture, html, oneEvent } from '@open-wc/testing';
-import GlideCoreMenu from './menu.js';
 it('dispatches a "click" event when a link is clicked', async () => {
     const component = await fixture(html `<glide-core-menu open>
       <button slot="target">Target</button>

package/dist/menu.test.focus.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import './menu.link.js';
 import { assert, elementUpdated, expect, fixture, html, } from '@open-wc/testing';
 import { sendKeys } from '@web/test-runner-commands';

package/dist/menu.test.interactions.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);

package/dist/modal.icon-button.test.basics.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-expressions */
 import { ArgumentError } from 'ow';
 import { expect, fixture, html } from '@open-wc/testing';
 import GlideCoreModalIconButton from './modal.icon-button.js';