@crowdstrike/glide-core 0.13.0 → 0.14.0

package/dist/button-group.test.events.js

@@ -1,241 +0,0 @@
-/* eslint-disable @typescript-eslint/no-unused-expressions */
-import './button-group.button.js';
-import { aTimeout, expect, fixture, html, oneEvent } from '@open-wc/testing';
-import { sendKeys } from '@web/test-runner-commands';
-import GlideCoreButtonGroup from './button-group.js';
-import GlideCoreButtonGroupButton from './button-group.button.js';
-import sinon from 'sinon';
-GlideCoreButtonGroup.shadowRootOptions.mode = 'open';
-GlideCoreButtonGroupButton.shadowRootOptions.mode = 'open';
-it('emits a "change" event when a button is clicked and not already selected', async () => {
-    const component = await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const button = component.querySelector('glide-core-button-group-button:last-of-type');
-    setTimeout(() => {
-        button?.click();
-    });
-    const event = await oneEvent(component, 'change');
-    expect(event instanceof Event).to.be.true;
-    expect(event.bubbles).to.be.true;
-    expect(event.target).to.equal(button);
-});
-it('emits an "input" event when a button is clicked and not already selected', async () => {
-    const component = await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const button = component.querySelector('glide-core-button-group-button:last-of-type');
-    setTimeout(() => {
-        button?.click();
-    });
-    const event = await oneEvent(component, 'input');
-    expect(event instanceof Event).to.be.true;
-    expect(event.bubbles).to.be.true;
-    expect(event.target).to.equal(button);
-});
-it('does not emit an "change" event when clicked button is clicked and already selected', async () => {
-    const component = await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-        selected
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="One"
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const spy = sinon.spy();
-    const button = component.querySelector('glide-core-button-group-button');
-    component.addEventListener('change', spy);
-    setTimeout(() => {
-        button?.click();
-    });
-    await aTimeout(0);
-    expect(spy.callCount).to.equal(0);
-});
-it('does not emit an "input" event when clicked button is clicked and already selected', async () => {
-    const component = await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-        selected
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const spy = sinon.spy();
-    const button = component.querySelector('glide-core-button-group-button');
-    component.addEventListener('input', spy);
-    setTimeout(() => {
-        button?.click();
-    });
-    await aTimeout(0);
-    expect(spy.callCount).to.equal(0);
-});
-it('emits a "change" event when arrowing', async () => {
-    const component = await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-        selected
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const buttons = document.querySelectorAll('glide-core-button-group-button');
-    buttons[0].focus();
-    let event;
-    sendKeys({ press: 'ArrowRight' });
-    event = await oneEvent(component, 'change');
-    expect(event instanceof Event).to.be.true;
-    expect(event.bubbles).to.be.true;
-    sendKeys({ press: 'ArrowLeft' });
-    event = await oneEvent(component, 'change');
-    expect(event instanceof Event).to.be.true;
-    expect(event.bubbles).to.be.true;
-    sendKeys({ press: 'ArrowDown' });
-    event = await oneEvent(component, 'change');
-    expect(event instanceof Event).to.be.true;
-    expect(event.bubbles).to.be.true;
-    sendKeys({ press: 'ArrowUp' });
-    event = await oneEvent(component, 'change');
-    expect(event instanceof Event).to.be.true;
-    expect(event.bubbles).to.be.true;
-});
-it('emits an "input" event when arrowing', async () => {
-    const component = await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const buttons = document.querySelectorAll('glide-core-button-group-button');
-    buttons[0].focus();
-    let event;
-    sendKeys({ press: 'ArrowRight' });
-    event = await oneEvent(component, 'input');
-    expect(event instanceof Event).to.be.true;
-    expect(event.bubbles).to.be.true;
-    sendKeys({ press: 'ArrowLeft' });
-    event = await oneEvent(component, 'input');
-    expect(event instanceof Event).to.be.true;
-    expect(event.bubbles).to.be.true;
-    sendKeys({ press: 'ArrowDown' });
-    event = await oneEvent(component, 'input');
-    expect(event instanceof Event).to.be.true;
-    expect(event.bubbles).to.be.true;
-    sendKeys({ press: 'ArrowUp' });
-    event = await oneEvent(component, 'input');
-    expect(event instanceof Event).to.be.true;
-    expect(event.bubbles).to.be.true;
-});
-it('emits a "change" event when a button is selected via Space', async () => {
-    const component = await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-        selected
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const buttons = document.querySelectorAll('glide-core-button-group-button');
-    buttons[1]?.focus();
-    sendKeys({ press: ' ' });
-    const event = await oneEvent(component, 'input');
-    expect(event instanceof Event).to.be.true;
-    expect(event.bubbles).to.be.true;
-});
-it('emits a "change" event when a button is selected programmatically', async () => {
-    const component = await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-        selected
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const buttons = document.querySelectorAll('glide-core-button-group-button');
-    setTimeout(() => {
-        buttons[1].selected = true;
-    });
-    const event = await oneEvent(component, 'input');
-    expect(event instanceof Event).to.be.true;
-    expect(event.bubbles).to.be.true;
-});
-it('does not emit a "change" event when an already selected button is selected via Space', async () => {
-    const component = await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-        selected
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const buttons = document.querySelectorAll('glide-core-button-group-button');
-    buttons[0]?.focus();
-    const spy = sinon.spy();
-    component.addEventListener('change', spy);
-    sendKeys({ press: ' ' });
-    expect(spy.callCount).to.equal(0);
-});
-it('does not emit a "change" event a button is selected programmatically', async () => {
-    const component = await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-        selected
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const buttons = document.querySelectorAll('glide-core-button-group-button');
-    const spy = sinon.spy();
-    component.addEventListener('change', spy);
-    setTimeout(() => {
-        buttons[1].selected = true;
-    });
-    expect(spy.callCount).to.equal(0);
-});
-it('does not emit a "input" event a button is selected programmatically', async () => {
-    const component = await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-        selected
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const buttons = document.querySelectorAll('glide-core-button-group-button');
-    const spy = sinon.spy();
-    component.addEventListener('input', spy);
-    setTimeout(() => {
-        buttons[1].selected = true;
-    });
-    expect(spy.callCount).to.equal(0);
-});

package/dist/button-group.test.focus.d.ts

@@ -1 +0,0 @@
-import './button-group.button.js';

package/dist/button-group.test.focus.js

@@ -1,39 +0,0 @@
-/* eslint-disable @typescript-eslint/no-unused-expressions */
-import './button-group.button.js';
-import { expect, fixture, html } from '@open-wc/testing';
-import { sendKeys } from '@web/test-runner-commands';
-import GlideCoreButtonGroup from './button-group.js';
-import GlideCoreButtonGroupButton from './button-group.button.js';
-GlideCoreButtonGroup.shadowRootOptions.mode = 'open';
-GlideCoreButtonGroupButton.shadowRootOptions.mode = 'open';
-it('moves focus', async () => {
-    await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-        disabled
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Three"
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Four"
-        selected
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const buttons = document.querySelectorAll('glide-core-button-group-button');
-    buttons[3]?.focus();
-    await sendKeys({ press: 'ArrowRight' });
-    expect(buttons[0]).to.have.focus;
-    await sendKeys({ press: 'ArrowUp' });
-    expect(buttons[3]).to.have.focus;
-    await sendKeys({ press: 'ArrowLeft' });
-    expect(buttons[2]).to.have.focus;
-    await sendKeys({ press: 'ArrowDown' });
-    expect(buttons[3]).to.have.focus;
-});

package/dist/button-group.test.interactions.d.ts

@@ -1 +0,0 @@
-import './button-group.button.js';

package/dist/button-group.test.interactions.js

@@ -1,91 +0,0 @@
-/* eslint-disable @typescript-eslint/no-unused-expressions */
-import './button-group.button.js';
-import { elementUpdated, expect, fixture, html } from '@open-wc/testing';
-import { sendKeys } from '@web/test-runner-commands';
-import GlideCoreButtonGroup from './button-group.js';
-import GlideCoreButtonGroupButton from './button-group.button.js';
-GlideCoreButtonGroup.shadowRootOptions.mode = 'open';
-GlideCoreButtonGroupButton.shadowRootOptions.mode = 'open';
-it('selects a button when clicked', async () => {
-    const component = await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-        selected
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const buttons = document.querySelectorAll('glide-core-button-group-button');
-    buttons[1]?.click();
-    await elementUpdated(component);
-    expect(buttons[0].selected).to.be.false;
-    expect(buttons[1].selected).to.be.true;
-});
-it('selects buttons when arrowing', async () => {
-    await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-        disabled
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-        selected
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Three"
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Four"
-        disabled
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const buttons = document.querySelectorAll('glide-core-button-group-button');
-    buttons[1]?.focus();
-    await sendKeys({ press: 'ArrowRight' });
-    expect(buttons[2].selected).to.be.true;
-    await sendKeys({ press: 'ArrowDown' });
-    expect(buttons[1].selected).to.be.true;
-    await sendKeys({ press: 'ArrowLeft' });
-    expect(buttons[2].selected).to.be.true;
-    await sendKeys({ press: 'ArrowUp' });
-    expect(buttons[1].selected).to.be.true;
-});
-it('selects a button on Space', async () => {
-    await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-        selected
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const buttons = document.querySelectorAll('glide-core-button-group-button');
-    buttons[1]?.focus();
-    await sendKeys({ press: ' ' });
-    expect(buttons[0].selected).to.be.false;
-    expect(buttons[1].selected).to.be.true;
-});
-it('does not select a disabled button', async () => {
-    await fixture(html `<glide-core-button-group>
-      <glide-core-button-group-button
-        label="One"
-        selected
-      ></glide-core-button-group-button>
-
-      <glide-core-button-group-button
-        label="Two"
-        disabled
-      ></glide-core-button-group-button>
-    </glide-core-button-group>`);
-    const buttons = document.querySelectorAll('glide-core-button-group-button');
-    buttons[1]?.click();
-    expect(buttons[0].selected).to.be.true;
-    expect(buttons[1].selected).to.be.false;
-});

package/dist/button.stories.d.ts

@@ -1,7 +0,0 @@
-import './button.js';
-import './icons/storybook.js';
-import type { Meta, StoryObj } from '@storybook/web-components';
-declare const meta: Meta;
-export default meta;
-export declare const Button: StoryObj;
-export declare const WithIcons: StoryObj;

package/dist/button.test.basics.d.ts

@@ -1 +0,0 @@
-import './button.js';

package/dist/button.test.basics.js

@@ -1,69 +0,0 @@
-/* eslint-disable @typescript-eslint/no-unused-expressions */
-import './button.js';
-import { expect, fixture, html } from '@open-wc/testing';
-import GlideCoreButton from './button.js';
-GlideCoreButton.shadowRootOptions.mode = 'open';
-it('registers', async () => {
-    expect(window.customElements.get('glide-core-button')).to.equal(GlideCoreButton);
-});
-it('is accessible', async () => {
-    const component = await fixture(html `<glide-core-button label="Label"></glide-core-button>`);
-    await expect(component).to.be.accessible();
-});
-it('has defaults', async () => {
-    const component = await fixture(html `
-    <glide-core-button label="Label"></glide-core-button>
-  `);
-    expect(component.ariaControls).to.be.null;
-    expect(component.ariaExpanded).to.be.null;
-    expect(component.ariaHasPopup).to.be.null;
-    expect(component.autofocus).to.be.false;
-    expect(component.disabled).to.be.false;
-    expect(component.formAction).to.be.empty.string;
-    expect(component.formEncType).to.be.empty.string;
-    expect(component.formMethod).to.be.empty.string;
-    expect(component.formNoValidate).to.be.false;
-    expect(component.name).to.be.empty.string;
-    expect(component.popoverTarget).to.be.undefined;
-    expect(component.popoverTargetAction).to.be.empty.string;
-    expect(component.value).to.be.empty.string;
-    expect(component.type).to.equal('button');
-    expect(component.hasAttribute('autofocus')).to.be.false;
-    expect(component.getAttribute('aria-controls')).to.be.null;
-    expect(component.getAttribute('aria-expanded')).to.be.null;
-    expect(component.getAttribute('aria-haspopup')).to.be.null;
-    expect(component.hasAttribute('disabled')).to.be.false;
-    expect(component.getAttribute('formaction')).to.be.empty.string;
-    expect(component.getAttribute('formenctype')).to.be.empty.string;
-    expect(component.getAttribute('formmethod')).to.be.empty.string;
-    expect(component.hasAttribute('formnovalidate')).to.be.false;
-    expect(component.getAttribute('name')).to.be.empty.string;
-    expect(component.getAttribute('popovertarget')).to.be.null;
-    expect(component.getAttribute('popovertargetaction')).to.be.empty.string;
-    expect(component.getAttribute('type')).to.equal('button');
-    expect(component.getAttribute('value')).to.be.empty.string;
-    const button = component.shadowRoot?.querySelector('button');
-    expect(button?.getAttribute('aria-controls')).to.be.null;
-    expect(button?.ariaExpanded).to.be.null;
-    expect(button?.ariaHasPopup).to.be.null;
-    expect(button?.disabled).to.be.false;
-});
-it('delegates focus', async () => {
-    const component = await fixture(html `<glide-core-button label="Label"></glide-core-button>`);
-    component.focus();
-    expect(component.shadowRoot?.activeElement).to.equal(component.shadowRoot?.querySelector('button'));
-});
-it('has `#onPrefixSlotChange` coverage', async () => {
-    await fixture(html `
-    <glide-core-button label="Label">
-      <span slot="prefix-icon">Prefix</span>
-    </glide-core-button>
-  `);
-});
-it('has `#onSuffixIconSlotChange` coverage', async () => {
-    await fixture(html `
-    <glide-core-button label="Label">
-      <span slot="suffix-icon">Suffix</span>
-    </glide-core-button>
-  `);
-});

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

@@ -1 +0,0 @@
-import './button.js';

package/dist/button.test.events.js

@@ -1,102 +0,0 @@
-/* eslint-disable @typescript-eslint/no-unused-expressions */
-import './button.js';
-import { expect, fixture, html, oneEvent } from '@open-wc/testing';
-import { sendKeys } from '@web/test-runner-commands';
-import GlideCoreButton from './button.js';
-GlideCoreButton.shadowRootOptions.mode = 'open';
-it('dispatches a "click" event when clicked', async () => {
-    const component = await fixture(html `
-    <glide-core-button label="Label" type="button"></glide-core-button>
-  `);
-    setTimeout(() => {
-        component.click();
-    });
-    const event = await oneEvent(component, 'click');
-    expect(event instanceof PointerEvent).to.be.true;
-    expect(event.bubbles).to.be.true;
-});
-it('dispatches a "click" event on Enter', async () => {
-    const component = await fixture(html `
-    <glide-core-button label="Label" type="button"></glide-core-button>
-  `);
-    component.focus();
-    sendKeys({ press: 'Enter' });
-    const event = await oneEvent(component, 'click');
-    expect(event instanceof PointerEvent).to.be.true;
-    expect(event.bubbles).to.be.true;
-});
-it('dispatches a "click" event on Space', async () => {
-    const component = await fixture(html `
-    <glide-core-button label="Label" type="button"></glide-core-button>
-  `);
-    component.focus();
-    sendKeys({ press: ' ' });
-    const event = await oneEvent(component, 'click');
-    expect(event instanceof PointerEvent).to.be.true;
-    expect(event.bubbles).to.be.true;
-});
-it('dispatches a "reset" event on click', async () => {
-    const form = document.createElement('form');
-    const component = await fixture(html ` <glide-core-button label="Label" type="reset"></glide-core-button>`, {
-        parentNode: form,
-    });
-    setTimeout(() => {
-        component.click();
-    });
-    const event = await oneEvent(form, 'reset');
-    expect(event instanceof Event).to.be.true;
-});
-it('dispatches a "reset" event on Enter', async () => {
-    const form = document.createElement('form');
-    const component = await fixture(html ` <glide-core-button label="Label" type="reset"></glide-core-button>`, {
-        parentNode: form,
-    });
-    component.focus();
-    sendKeys({ press: 'Enter' });
-    const event = await oneEvent(form, 'reset');
-    expect(event instanceof Event).to.be.true;
-});
-it('dispatches a "reset" event on Space', async () => {
-    const form = document.createElement('form');
-    const component = await fixture(html ` <glide-core-button label="Label" type="reset"></glide-core-button>`, {
-        parentNode: form,
-    });
-    component.focus();
-    sendKeys({ press: ' ' });
-    const event = await oneEvent(form, 'reset');
-    expect(event instanceof Event).to.be.true;
-});
-it('dispatches a "submit" event on click', async () => {
-    const form = document.createElement('form');
-    const component = await fixture(html ` <glide-core-button label="Label" type="submit"></glide-core-button>`, {
-        parentNode: form,
-    });
-    form.addEventListener('submit', (event) => event.preventDefault());
-    setTimeout(() => {
-        component.click();
-    });
-    const event = await oneEvent(form, 'submit');
-    expect(event instanceof Event).to.be.true;
-});
-it('dispatches a "submit" event on Enter', async () => {
-    const form = document.createElement('form');
-    const component = await fixture(html ` <glide-core-button label="Label" type="submit"></glide-core-button>`, {
-        parentNode: form,
-    });
-    form.addEventListener('submit', (event) => event.preventDefault());
-    component.focus();
-    sendKeys({ press: 'Enter' });
-    const event = await oneEvent(form, 'submit');
-    expect(event instanceof Event).to.be.true;
-});
-it('dispatches a "submit" event on Space', async () => {
-    const form = document.createElement('form');
-    const component = await fixture(html ` <glide-core-button label="Label" type="submit"></glide-core-button>`, {
-        parentNode: form,
-    });
-    form.addEventListener('submit', (event) => event.preventDefault());
-    component.focus();
-    sendKeys({ press: ' ' });
-    const event = await oneEvent(form, 'submit');
-    expect(event instanceof Event).to.be.true;
-});

package/dist/checkbox-group.stories.d.ts

@@ -1,6 +0,0 @@
-import './checkbox.js';
-import type { Meta, StoryObj } from '@storybook/web-components';
-declare const meta: Meta;
-export default meta;
-export declare const CheckboxGroup: StoryObj;
-export declare const WithError: StoryObj;

package/dist/checkbox-group.test.basics.d.ts

@@ -1 +0,0 @@
-import './checkbox.js';