@aquera/nile-elements 0.0.119 → 0.0.121

package/dist/src/nile-select/nile-select.test.js

@@ -0,0 +1,247 @@
+import { expect, fixture, html, oneEvent, elementUpdated } from '@open-wc/testing';
+import './nile-select'; // Assuming the component is registered and imported
+import '../nile-option/nile-option';
+import '../nile-input/nile-input';
+import '../nile-popup/nile-popup';
+import '../nile-tag/nile-tag';
+import '../nile-checkbox/nile-checkbox';
+const wait = (ms = 50000) => new Promise(resolve => setTimeout(resolve, ms));
+const keyboardEvent = new KeyboardEvent('keydown', {
+    code: 'Enter',
+    key: 'Enter',
+    charCode: 13,
+    keyCode: 13,
+    view: window,
+    bubbles: true
+});
+const mouseUpEvent = new MouseEvent("mouseup", {
+    bubbles: true,
+    cancelable: true,
+    view: window
+});
+describe('NileSelect Component', () => {
+    it('should render the placeholder when no value is selected', async () => {
+        const el = await fixture(html `<nile-select placeholder="Select an option..."></nile-select>`);
+        const displayInput = el.shadowRoot?.querySelector('.select__display-input');
+        expect(displayInput?.placeholder).to.equal('Select an option...');
+    });
+    it('should open the dropdown when clicked', async () => {
+        const el = await fixture(html `
+      <nile-select>
+        <nile-option value="option1">Option 1</nile-option>
+      </nile-select>
+    `);
+        const combobox = el.shadowRoot?.querySelector("div.select__combobox");
+        combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown
+        await elementUpdated(el);
+        const popup = el.shadowRoot?.querySelector('.select');
+        expect(popup?.classList.contains('select--open')).to.be.true;
+    });
+    it('should close the dropdown when clicked again', async () => {
+        const el = await fixture(html `
+      <nile-select>
+        <nile-option value="option1">Option 1</nile-option>
+      </nile-select>
+    `);
+        const combobox = el.shadowRoot?.querySelector("div.select__combobox");
+        // Open dropdown first
+        combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown
+        await elementUpdated(el);
+        expect(el.open).to.be.true;
+        // Click again to close dropdown
+        combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown
+        await elementUpdated(el);
+        expect(el.open).to.be.false;
+    });
+    it('should update the display label when an option is selected', async () => {
+        const el = await fixture(html `
+      <nile-select>
+        <nile-option value="option1">Option 1</nile-option>
+        <nile-option value="option2">Option 2</nile-option>
+      </nile-select>
+    `);
+        const combobox = el.shadowRoot?.querySelector("div.select__combobox");
+        combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown
+        await elementUpdated(el);
+        // Select the first option
+        const option1 = el.querySelector('nile-option[value="option1"]');
+        option1?.dispatchEvent(mouseUpEvent);
+        await elementUpdated(el);
+        const displayInput = el.shadowRoot?.querySelector('.select__display-input');
+        expect(displayInput?.value).to.equal('Option 1');
+    });
+    it('should handle multi-select and show selected tags', async () => {
+        const el = await fixture(html `
+      <nile-select multiple>
+        <nile-option value="option1">Option 1</nile-option>
+        <nile-option value="option2">Option 2</nile-option>
+        <nile-option value="option3">Option 3</nile-option>
+      </nile-select>
+    `);
+        const combobox = el.shadowRoot?.querySelector("div.select__combobox");
+        combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown
+        await elementUpdated(el);
+        // Select multiple options
+        const option1 = el.querySelector('nile-option[value="option1"]');
+        const option2 = el.querySelector('nile-option[value="option2"]');
+        option1?.dispatchEvent(mouseUpEvent);
+        option2?.dispatchEvent(mouseUpEvent);
+        await elementUpdated(el);
+        // Check if the tags are displayed
+        const tags = el.shadowRoot?.querySelectorAll('nile-tag');
+        expect(tags?.length).to.equal(2);
+        expect(tags?.[0].textContent?.trim()).to.equal('Option 1');
+        expect(tags?.[1].textContent?.trim()).to.equal('Option 2');
+    });
+    it('should clear selected value when clear button is clicked', async () => {
+        const el = await fixture(html `
+      <nile-select clearable>
+        <nile-option value="option1">Option 1</nile-option>
+      </nile-select>
+    `);
+        const combobox = el.shadowRoot?.querySelector("div.select__combobox");
+        combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown
+        await elementUpdated(el);
+        // Select an option
+        const option1 = el.querySelector('nile-option[value="option1"]');
+        option1?.click();
+        await elementUpdated(el);
+        // Clear the selected value
+        const clearButton = el.shadowRoot?.querySelector('.select__clear');
+        clearButton?.click();
+        await elementUpdated(el);
+        const displayInput = el.shadowRoot?.querySelector('.select__display-input');
+        expect(displayInput?.value).to.be.empty;
+    });
+    it('should emit nile-change event when value changes', async () => {
+        const el = await fixture(html `
+      <nile-select>
+        <nile-option value="option1">Option 1</nile-option>
+        <nile-option value="option2">Option 2</nile-option>
+      </nile-select>
+    `);
+        const listener = oneEvent(el, 'nile-change');
+        const combobox = el.shadowRoot?.querySelector("div.select__combobox");
+        combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown
+        await elementUpdated(el);
+        const option1 = el.querySelector('nile-option[value="option1"]');
+        option1?.dispatchEvent(mouseUpEvent);
+        const event = await listener;
+        expect(event.detail.value).to.equal('option1');
+    });
+    it('should not open when disabled', async () => {
+        const el = await fixture(html `
+      <nile-select disabled>
+        <nile-option value="option1">Option 1</nile-option>
+      </nile-select>
+    `);
+        const combobox = el.shadowRoot?.querySelector("div.select__combobox");
+        combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown
+        await elementUpdated(el);
+        const popup = el.shadowRoot?.querySelector('.select');
+        expect(popup?.classList.contains('select--open')).to.be.false;
+    });
+    it('should display the search bar if searchEnabled is true', async () => {
+        const el = await fixture(html `
+      <nile-select searchEnabled>
+        <nile-option value="option1">Option 1</nile-option>
+        <nile-option value="option2">Option 2</nile-option>
+      </nile-select>
+    `);
+        const combobox = el.shadowRoot?.querySelector("div.select__combobox");
+        combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown
+        await elementUpdated(el);
+        const searchBar = el.shadowRoot?.querySelector('.select__search');
+        expect(searchBar).to.exist;
+    });
+    it('should show "No results found" when searching for an invalid query', async () => {
+        const el = await fixture(html `
+      <nile-select searchEnabled>
+        <nile-option value="option1">Option 1</nile-option>
+        <nile-option value="option2">Option 2</nile-option>
+      </nile-select>
+    `);
+        const combobox = el.shadowRoot?.querySelector('.select__combobox');
+        combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown
+        await elementUpdated(el);
+        // Simulate typing an invalid search query
+        const searchInput = el.shadowRoot?.querySelector('.select__search nile-input');
+        if (searchInput) {
+            searchInput.value = 'invalid';
+            searchInput.dispatchEvent(new CustomEvent('nile-input', { detail: { value: 'invalid' } }));
+        }
+        await elementUpdated(el);
+        const noResultsMessage = el.shadowRoot?.querySelector('.select__no-results');
+        expect(noResultsMessage).to.exist;
+        expect(noResultsMessage?.textContent?.trim()).to.equal('No results found');
+    });
+    it('should allow selecting multiple options, display the selected count, and clear selections when clear button is clicked', async () => {
+        const el = await fixture(html `
+      <nile-select multiple clearable>
+        <nile-option value="1">Option 1</nile-option>
+        <nile-option value="2">Option 2</nile-option>
+        <nile-option value="3">Option 3</nile-option>
+      </nile-select>
+    `);
+        const combobox = el.shadowRoot?.querySelector('.select__combobox');
+        const options = el.querySelectorAll('nile-option');
+        const displayInput = el.shadowRoot?.querySelector('.select__display-input');
+        // Open the dropdown
+        combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown
+        await el.updateComplete;
+        // Select the first two options
+        options[0].dispatchEvent(mouseUpEvent);
+        options[1].dispatchEvent(mouseUpEvent);
+        await el.updateComplete;
+        // Verify the display label reflects the number of selected options
+        expect(displayInput?.value).to.equal('2 selected');
+        // Check that the clearable button is visible
+        const clearButton = el.shadowRoot?.querySelector('.select__clear');
+        console.log(clearButton);
+        expect(clearButton).to.exist;
+        // Click the clear button
+        clearButton?.click();
+        await el.updateComplete;
+        // Verify the display label is cleared and placeholder is shown
+        expect(displayInput?.value).to.equal('');
+        // Verify that no options are selected
+        expect(Array.from(options).every(option => !option.selected)).to.be.true;
+    });
+    it('should allow selecting multiple options, clearing selections, and handling backspace to deselect the last selected option', async () => {
+        const el = await fixture(html `
+      <nile-select multiple clearable>
+        <nile-option value="option1">Option 1</nile-option>
+        <nile-option value="option2">Option 2</nile-option>
+        <nile-option value="option3">Option 3</nile-option>
+      </nile-select>
+    `);
+        const combobox = el.shadowRoot?.querySelector('div.select__combobox');
+        const options = el.querySelectorAll('nile-option');
+        const displayInput = el.shadowRoot?.querySelector('.select__display-input');
+        const clearButton = el.shadowRoot?.querySelector('.select__clear');
+        // Open the dropdown and select three options
+        combobox?.click();
+        await el.updateComplete;
+        options[0].dispatchEvent(mouseUpEvent);
+        options[1].dispatchEvent(mouseUpEvent);
+        options[2].dispatchEvent(mouseUpEvent);
+        await el.updateComplete;
+        // Verify that three options are selected
+        expect(displayInput?.value).to.equal('3 selected');
+        expect(Array.from(options).every(option => option.selected)).to.be.true;
+        // // Reopen dropdown, select three options again
+        // combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown
+        // await el.updateComplete;
+        // options[0].dispatchEvent(mouseUpEvent);
+        // options[1].dispatchEvent(mouseUpEvent);
+        options[2].dispatchEvent(mouseUpEvent);
+        await el.updateComplete;
+        // Verify only the first two options are selected
+        expect(options[0].selected).to.be.true;
+        expect(options[1].selected).to.be.true;
+        expect(options[2].selected).to.be.false;
+        // Verify display label reflects two selected options
+        expect(displayInput?.value).to.equal('2 selected');
+    });
+});
+//# sourceMappingURL=nile-select.test.js.map

package/dist/src/nile-select/nile-select.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-select.test.js","sourceRoot":"","sources":["../../../src/nile-select/nile-select.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { expect, fixture, html, oneEvent, elementUpdated } from '@open-wc/testing';\nimport './nile-select'; // Assuming the component is registered and imported\nimport NileSelect from './nile-select';\nimport { NileOption } from '../nile-option';\nimport { NileInput } from '../nile-input';\nimport '../nile-option/nile-option';\nimport '../nile-input/nile-input';\nimport '../nile-popup/nile-popup';\nimport '../nile-tag/nile-tag';\nimport '../nile-checkbox/nile-checkbox';\n\nconst wait=(ms:number=50000)=>new Promise(resolve => setTimeout(resolve, ms))\n\nconst keyboardEvent = new KeyboardEvent('keydown', {\n  code: 'Enter',\n  key: 'Enter',\n  charCode: 13,\n  keyCode: 13,\n  view: window,\n  bubbles: true\n});\n\nconst mouseUpEvent = new MouseEvent(\"mouseup\", {\n  bubbles: true,\n  cancelable: true,\n  view: window\n});\n\ndescribe('NileSelect Component', () => {\n  \n  it('should render the placeholder when no value is selected', async () => {\n    const el = await fixture<NileSelect>(html`<nile-select placeholder=\"Select an option...\"></nile-select>`);\n    const displayInput = el.shadowRoot?.querySelector<HTMLInputElement>('.select__display-input');\n    expect(displayInput?.placeholder).to.equal('Select an option...');\n  });\n\n  it('should open the dropdown when clicked', async () => {\n    const el = await fixture<NileSelect>(html`\n      <nile-select>\n        <nile-option value=\"option1\">Option 1</nile-option>\n      </nile-select>\n    `);\n\n    const combobox = el.shadowRoot?.querySelector<HTMLElement>(\"div.select__combobox\");\n    combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown\n    await elementUpdated(el);\n\n    const popup = el.shadowRoot?.querySelector('.select');\n    expect(popup?.classList.contains('select--open')).to.be.true;\n  });\n\n  it('should close the dropdown when clicked again', async () => {\n    const el = await fixture<NileSelect>(html`\n      <nile-select>\n        <nile-option value=\"option1\">Option 1</nile-option>\n      </nile-select>\n    `);\n\n    const combobox = el.shadowRoot?.querySelector<HTMLElement>(\"div.select__combobox\");\n\n    // Open dropdown first\n    combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown\n    await elementUpdated(el);\n    expect(el.open).to.be.true;\n\n    // Click again to close dropdown\n    combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown\n    await elementUpdated(el);\n    expect(el.open).to.be.false;\n  });\n\n  it('should update the display label when an option is selected', async () => {\n    const el = await fixture<NileSelect>(html`\n      <nile-select>\n        <nile-option value=\"option1\">Option 1</nile-option>\n        <nile-option value=\"option2\">Option 2</nile-option>\n      </nile-select>\n    `);\n\n    const combobox = el.shadowRoot?.querySelector<HTMLElement>(\"div.select__combobox\");\n    combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown\n    await elementUpdated(el);\n\n    // Select the first option\n    const option1 = el.querySelector<NileOption>('nile-option[value=\"option1\"]');\n    option1?.dispatchEvent(mouseUpEvent);\n    await elementUpdated(el);\n\n    const displayInput = el.shadowRoot?.querySelector<HTMLInputElement>('.select__display-input');\n    expect(displayInput?.value).to.equal('Option 1');\n  });\n\n  it('should handle multi-select and show selected tags', async () => {\n    const el = await fixture<NileSelect>(html`\n      <nile-select multiple>\n        <nile-option value=\"option1\">Option 1</nile-option>\n        <nile-option value=\"option2\">Option 2</nile-option>\n        <nile-option value=\"option3\">Option 3</nile-option>\n      </nile-select>\n    `);\n\n    const combobox = el.shadowRoot?.querySelector<HTMLElement>(\"div.select__combobox\");\n    combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown\n    await elementUpdated(el);\n\n    // Select multiple options\n    const option1 = el.querySelector<NileOption>('nile-option[value=\"option1\"]');\n    const option2 = el.querySelector<NileOption>('nile-option[value=\"option2\"]');\n    \n    option1?.dispatchEvent(mouseUpEvent);\n    option2?.dispatchEvent(mouseUpEvent);\n    await elementUpdated(el);\n\n    // Check if the tags are displayed\n    const tags = el.shadowRoot?.querySelectorAll('nile-tag');\n    expect(tags?.length).to.equal(2);\n    expect(tags?.[0].textContent?.trim()).to.equal('Option 1');\n    expect(tags?.[1].textContent?.trim()).to.equal('Option 2');\n  });\n\n  it('should clear selected value when clear button is clicked', async () => {\n    const el = await fixture<NileSelect>(html`\n      <nile-select clearable>\n        <nile-option value=\"option1\">Option 1</nile-option>\n      </nile-select>\n    `);\n\n    const combobox = el.shadowRoot?.querySelector<HTMLElement>(\"div.select__combobox\");\n    combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown\n    await elementUpdated(el);\n\n    // Select an option\n    const option1 = el.querySelector<NileOption>('nile-option[value=\"option1\"]');\n    option1?.click();\n    await elementUpdated(el);\n\n    // Clear the selected value\n    const clearButton = el.shadowRoot?.querySelector<HTMLButtonElement>('.select__clear');\n    clearButton?.click();\n    await elementUpdated(el);\n\n    const displayInput = el.shadowRoot?.querySelector<HTMLInputElement>('.select__display-input');\n    expect(displayInput?.value).to.be.empty;\n  });\n\n  it('should emit nile-change event when value changes', async () => {\n    const el = await fixture<NileSelect>(html`\n      <nile-select>\n        <nile-option value=\"option1\">Option 1</nile-option>\n        <nile-option value=\"option2\">Option 2</nile-option>\n      </nile-select>\n    `);\n\n    const listener = oneEvent(el, 'nile-change');\n    const combobox = el.shadowRoot?.querySelector<HTMLElement>(\"div.select__combobox\");\n    combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown\n    await elementUpdated(el);\n\n    const option1 = el.querySelector<NileOption>('nile-option[value=\"option1\"]');\n    option1?.dispatchEvent(mouseUpEvent);\n    \n    const event = await listener;\n    expect(event.detail.value).to.equal('option1');\n  });\n\n  it('should not open when disabled', async () => {\n    const el = await fixture<NileSelect>(html`\n      <nile-select disabled>\n        <nile-option value=\"option1\">Option 1</nile-option>\n      </nile-select>\n    `);\n\n    const combobox = el.shadowRoot?.querySelector<HTMLElement>(\"div.select__combobox\");\n    combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown\n    await elementUpdated(el);\n\n    const popup = el.shadowRoot?.querySelector('.select');\n    expect(popup?.classList.contains('select--open')).to.be.false;\n  });\n\n  it('should display the search bar if searchEnabled is true', async () => {\n    const el = await fixture<NileSelect>(html`\n      <nile-select searchEnabled>\n        <nile-option value=\"option1\">Option 1</nile-option>\n        <nile-option value=\"option2\">Option 2</nile-option>\n      </nile-select>\n    `);\n\n    const combobox = el.shadowRoot?.querySelector<HTMLElement>(\"div.select__combobox\");\n    combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown\n    await elementUpdated(el);\n\n    const searchBar = el.shadowRoot?.querySelector('.select__search');\n    expect(searchBar).to.exist;\n  });\n\n  it('should show \"No results found\" when searching for an invalid query', async () => {\n    const el = await fixture<NileSelect>(html`\n      <nile-select searchEnabled>\n        <nile-option value=\"option1\">Option 1</nile-option>\n        <nile-option value=\"option2\">Option 2</nile-option>\n      </nile-select>\n    `);\n\n    const combobox = el.shadowRoot?.querySelector<HTMLElement>('.select__combobox');\n    combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown\n    await elementUpdated(el);\n\n    // Simulate typing an invalid search query\n    const searchInput = el.shadowRoot?.querySelector<NileInput>('.select__search nile-input');\n    if (searchInput) {\n      searchInput.value = 'invalid';\n      searchInput.dispatchEvent(new CustomEvent('nile-input',{detail:{value:'invalid'}}));\n    }\n    await elementUpdated(el);\n\n    const noResultsMessage = el.shadowRoot?.querySelector('.select__no-results');\n    expect(noResultsMessage).to.exist;\n    expect(noResultsMessage?.textContent?.trim()).to.equal('No results found');\n  });\n\n\n  it('should allow selecting multiple options, display the selected count, and clear selections when clear button is clicked', async () => {\n    const el = await fixture<NileSelect>(html`\n      <nile-select multiple clearable>\n        <nile-option value=\"1\">Option 1</nile-option>\n        <nile-option value=\"2\">Option 2</nile-option>\n        <nile-option value=\"3\">Option 3</nile-option>\n      </nile-select>\n    `);\n\n    const combobox = el.shadowRoot?.querySelector<HTMLElement>('.select__combobox');\n    const options = el.querySelectorAll('nile-option');\n    const displayInput = el.shadowRoot?.querySelector<NileInput>('.select__display-input');\n\n    // Open the dropdown\n    combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown\n    await el.updateComplete;\n\n    // Select the first two options\n    options[0].dispatchEvent(mouseUpEvent);\n    options[1].dispatchEvent(mouseUpEvent);\n    await el.updateComplete;\n\n    // Verify the display label reflects the number of selected options\n    expect(displayInput?.value).to.equal('2 selected');\n\n    // Check that the clearable button is visible\n    const clearButton = el.shadowRoot?.querySelector<HTMLElement>('.select__clear');\n    console.log(clearButton)\n    expect(clearButton).to.exist;\n\n    // Click the clear button\n    clearButton?.click();\n    await el.updateComplete;\n\n    // Verify the display label is cleared and placeholder is shown\n    expect(displayInput?.value).to.equal('');\n\n    // Verify that no options are selected\n    expect(Array.from(options).every(option => !option.selected)).to.be.true;\n  });\n\n  it('should allow selecting multiple options, clearing selections, and handling backspace to deselect the last selected option', async () => {\n    const el = await fixture<NileSelect>(html`\n      <nile-select multiple clearable>\n        <nile-option value=\"option1\">Option 1</nile-option>\n        <nile-option value=\"option2\">Option 2</nile-option>\n        <nile-option value=\"option3\">Option 3</nile-option>\n      </nile-select>\n    `);\n\n    const combobox = el.shadowRoot?.querySelector<HTMLElement>('div.select__combobox');\n    const options = el.querySelectorAll('nile-option');\n    const displayInput = el.shadowRoot?.querySelector<NileInput>('.select__display-input');\n    const clearButton = el.shadowRoot?.querySelector<HTMLButtonElement>('.select__clear');\n\n    // Open the dropdown and select three options\n    combobox?.click();\n    await el.updateComplete;\n    \n    options[0].dispatchEvent(mouseUpEvent);\n    options[1].dispatchEvent(mouseUpEvent);\n    options[2].dispatchEvent(mouseUpEvent);\n    await el.updateComplete;\n\n    // Verify that three options are selected\n    expect(displayInput?.value).to.equal('3 selected');\n    expect(Array.from(options).every(option => option.selected)).to.be.true;\n\n    // // Reopen dropdown, select three options again\n    // combobox?.dispatchEvent(keyboardEvent); // Simulate click to open the dropdown\n    // await el.updateComplete;\n\n    // options[0].dispatchEvent(mouseUpEvent);\n    // options[1].dispatchEvent(mouseUpEvent);\n    options[2].dispatchEvent(mouseUpEvent);\n    await el.updateComplete;\n\n    // Verify only the first two options are selected\n    expect(options[0].selected).to.be.true;\n    expect(options[1].selected).to.be.true;\n    expect(options[2].selected).to.be.false;\n\n    // Verify display label reflects two selected options\n    expect(displayInput?.value).to.equal('2 selected');\n  });\n\n});\n"]}

package/dist/src/nile-slide-toggle/nile-slide-toggle.d.ts

@@ -2,6 +2,7 @@ import { CSSResultGroup } from 'lit';
 import NileElement from '../internal/nile-element';
 export declare class NileSlideToggle extends NileElement {
     static styles: CSSResultGroup;
+    protected BUBBLES: boolean;
     label: string;
     sublabel: string;
     textPosition: 'left' | 'right';

package/dist/src/nile-slide-toggle/nile-slide-toggle.js

@@ -6,6 +6,7 @@ import { classMap } from 'lit/directives/class-map.js';
 let NileSlideToggle = class NileSlideToggle extends NileElement {
     constructor() {
         super(...arguments);
+        this.BUBBLES = false;
         this.label = '';
         this.sublabel = '';
         this.textPosition = 'right';
@@ -80,13 +81,13 @@ __decorate([
     property({ type: String })
 ], NileSlideToggle.prototype, "sublabel", void 0);
 __decorate([
-    property({ type: String, attribute: 'text-position' })
+    property({ type: String, })
 ], NileSlideToggle.prototype, "textPosition", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
 ], NileSlideToggle.prototype, "isChecked", void 0);
 __decorate([
-    property({ type: Boolean, reflect: true, attribute: 'full-width' })
+    property({ type: Boolean, reflect: true })
 ], NileSlideToggle.prototype, "fullWidth", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })

package/dist/src/nile-slide-toggle/nile-slide-toggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-slide-toggle.js","sourceRoot":"","sources":["../../../src/nile-slide-toggle/nile-slide-toggle.ts"],"names":[],"mappings":"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","sourcesContent":["import { CSSResultGroup, PropertyValues } from 'lit';\nimport { LitElement, html, property, customElement } from 'lit-element';\nimport styles from './nile-slide-toggle.css';\nimport NileElement from '../internal/nile-element';\nimport { classMap } from 'lit/directives/class-map.js';\n\n@customElement('nile-slide-toggle')\nexport class NileSlideToggle extends NileElement {\n  public static styles: CSSResultGroup = styles;\n\n  @property({ type: String }) label = '';\n\n  @property({ type: String }) sublabel = '';\n\n  @property({ type: String, attribute:'text-position' }) textPosition:'left' | 'right' = 'right';\n\n  @property({ type: Boolean, reflect: true }) isChecked = false;\n\n  @property({ type: Boolean, reflect: true, attribute:'full-width' }) fullWidth = false;\n\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  @property({ attribute: 'help-text', reflect: true }) helpText = '';\n\n  @property({ attribute: 'error-message', reflect: true }) errorMessage = '';\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.emit('nile-init');\n    this.style.setProperty('--slide-toggle-width',this.fullWidth?'100%':'auto')\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.emit('nile-destroy');\n  }\n\n  toggleValue() {\n    this.isChecked = !this.isChecked;\n    this.emit('change',{ checked: this.isChecked });\n    this.emit('nile-change',{ checked: this.isChecked });\n  }\n\n  public render() {\n    const hasHelpText = this.helpText ? true : false;\n    const hasErrorMessage = this.errorMessage ? true : false;\n\n    return html`\n      <div\n        class=${classMap({\n          'nile-slide-toggle': true,\n          'nile-slide--disabled': this.disabled,\n          'nile-slide-toggle--reverse':this.textPosition=='left'\n        })}\n      >\n        <label \n        class=\"${classMap({\n          'nile-slide-toggle__switch':true,\n          'nile-slide-toggle__switch--left':this.textPosition=='right',\n          'nile-slide-toggle__switch--right':this.textPosition=='left',\n        })}\"\n        class=\"nile-slide-toggle__switch\">\n          <input\n            type=\"checkbox\"\n            .checked=${this.isChecked}\n            @change=${this.toggleValue}\n          />\n          <span class=\"nile-slide-toggle__slider\"></span>\n        </label>\n        <span class=\"nile-slide-toggle__label\">\n          <span>${this.label}</span>\n          <span class=\"nile-slide-toggle__sublabel\">${this.sublabel}</span>\n        </span>\n      </div>\n      ${hasHelpText\n        ? html` <nile-form-help-text>${this.helpText}</nile-form-help-text> `\n        : ``}\n      ${hasErrorMessage\n        ? html`\n            <nile-form-error-message\n              >${this.errorMessage}</nile-form-error-message\n            >\n          `\n        : ``}\n    `;\n  }\n}\n"]}
+{"version":3,"file":"nile-slide-toggle.js","sourceRoot":"","sources":["../../../src/nile-slide-toggle/nile-slide-toggle.ts"],"names":[],"mappings":"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","sourcesContent":["import { CSSResultGroup, PropertyValues } from 'lit';\nimport { LitElement, html, property, customElement } from 'lit-element';\nimport styles from './nile-slide-toggle.css';\nimport NileElement from '../internal/nile-element';\nimport { classMap } from 'lit/directives/class-map.js';\n\n@customElement('nile-slide-toggle')\nexport class NileSlideToggle extends NileElement {\n  public static styles: CSSResultGroup = styles;\n\n  protected override BUBBLES: boolean=false;\n\n  @property({ type: String }) label = '';\n\n  @property({ type: String }) sublabel = '';\n\n  @property({ type: String, }) textPosition:'left' | 'right' = 'right';\n\n  @property({ type: Boolean, reflect: true }) isChecked = false;\n\n  @property({ type: Boolean, reflect: true }) fullWidth = false;\n\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  @property({ attribute: 'help-text', reflect: true }) helpText = '';\n\n  @property({ attribute: 'error-message', reflect: true }) errorMessage = '';\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.emit('nile-init');\n    this.style.setProperty('--slide-toggle-width',this.fullWidth?'100%':'auto')\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.emit('nile-destroy');\n  }\n\n  toggleValue() {\n    this.isChecked = !this.isChecked;\n    this.emit('change',{ checked: this.isChecked });\n    this.emit('nile-change',{ checked: this.isChecked });\n  }\n\n  public render() {\n    const hasHelpText = this.helpText ? true : false;\n    const hasErrorMessage = this.errorMessage ? true : false;\n\n    return html`\n      <div\n        class=${classMap({\n          'nile-slide-toggle': true,\n          'nile-slide--disabled': this.disabled,\n          'nile-slide-toggle--reverse':this.textPosition=='left'\n        })}\n      >\n        <label \n        class=\"${classMap({\n          'nile-slide-toggle__switch':true,\n          'nile-slide-toggle__switch--left':this.textPosition=='right',\n          'nile-slide-toggle__switch--right':this.textPosition=='left',\n        })}\"\n        class=\"nile-slide-toggle__switch\">\n          <input\n            type=\"checkbox\"\n            .checked=${this.isChecked}\n            @change=${this.toggleValue}\n          />\n          <span class=\"nile-slide-toggle__slider\"></span>\n        </label>\n        <span class=\"nile-slide-toggle__label\">\n          <span>${this.label}</span>\n          <span class=\"nile-slide-toggle__sublabel\">${this.sublabel}</span>\n        </span>\n      </div>\n      ${hasHelpText\n        ? html` <nile-form-help-text>${this.helpText}</nile-form-help-text> `\n        : ``}\n      ${hasErrorMessage\n        ? html`\n            <nile-form-error-message\n              >${this.errorMessage}</nile-form-error-message\n            >\n          `\n        : ``}\n    `;\n  }\n}\n"]}

package/dist/src/nile-split-panel/nile-split-panel.d.ts

@@ -29,6 +29,7 @@ import type { CSSResultGroup } from 'lit';
  */
 export declare class NileSplitPanel extends NileElement {
     static styles: CSSResultGroup;
+    protected BUBBLES: boolean;
     private cachedPositionInPixels;
     private resizeObserver;
     private size;

package/dist/src/nile-split-panel/nile-split-panel.js

@@ -36,6 +36,7 @@ import { watch } from '../internal/watch';
 let NileSplitPanel = class NileSplitPanel extends NileElement {
     constructor() {
         super(...arguments);
+        this.BUBBLES = false;
         /**
          * The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the
          * container's initial size.

package/dist/src/nile-split-panel/nile-split-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-split-panel.js","sourceRoot":"","sources":["../../../src/nile-split-panel/nile-split-panel.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {LitElement, CSSResultArray, TemplateResult} from 'lit-element';\nimport {styles} from './nile-split-panel.css';\nimport NileElement from '../internal/nile-element';\n\n\nimport { clamp } from '../internal/math';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { drag } from '../internal/drag';\nimport { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { watch } from '../internal/watch';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Split panels display two adjacent panels, allowing the user to reposition them.\n *\n * @event nile-reposition - Emitted when the divider's position changes.\n *\n * @slot start - Content to place in the start panel.\n * @slot end - Content to place in the end panel.\n * @slot divider - The divider. Useful for slotting in a custom icon that renders as a handle.\n *\n * @csspart start - The start panel.\n * @csspart end - The end panel.\n * @csspart panel - Targets both the start and end panels.\n * @csspart divider - The divider that separates the start and end panels.\n *\n * @cssproperty [--divider-width=4px] - The width of the visible divider.\n * @cssproperty [--divider-hit-area=12px] - The invisible region around the divider where dragging can occur. This is\n *  usually wider than the divider to facilitate easier dragging.\n * @cssproperty [--min=0] - The minimum allowed size of the primary panel.\n * @cssproperty [--max=100%] - The maximum allowed size of the primary panel.\n */\n@customElement('nile-split-panel')\nexport class NileSplitPanel extends NileElement {\n\n\tstatic styles: CSSResultGroup = styles;\n\n  private cachedPositionInPixels: number;\n  private resizeObserver: ResizeObserver;\n  private size: number;\n\n  @query('.divider') divider: HTMLElement;\n\n  /**\n   * The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the\n   * container's initial size.\n   */\n  @property({ type: Number, reflect: true }) position = 50;\n\n  /** The current position of the divider from the primary panel's edge in pixels. */\n  @property({ attribute: 'position-in-pixels', type: Number }) positionInPixels: number;\n\n  /** Draws the split panel in a vertical orientation with the start and end panels stacked. */\n  @property({ type: Boolean, reflect: true }) vertical = false;\n\n  /** Disables resizing. Note that the position may still change as a result of resizing the host element. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /**\n   * If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a\n   * primary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the\n   * host element is resized.\n   */\n  @property() primary?: 'start' | 'end';\n\n  /**\n   * One or more space-separated values at which the divider should snap. Values can be in pixels or percentages, e.g.\n   * `\"100px 50%\"`.\n   */\n  @property() snap?: string;\n\n  /** How close the divider must be to a snap point until snapping occurs. */\n  @property({ type: Number, attribute: 'snap-threshold' }) snapThreshold = 12;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.resizeObserver = new ResizeObserver(entries => this.handleResize(entries));\n    this.updateComplete.then(() => this.resizeObserver.observe(this));\n\n    this.detectSize();\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.resizeObserver.unobserve(this);\n  }\n\n  private detectSize() {\n    const { width, height } = this.getBoundingClientRect();\n    this.size = this.vertical ? height : width;\n  }\n\n  private percentageToPixels(value: number) {\n    return this.size * (value / 100);\n  }\n\n  private pixelsToPercentage(value: number) {\n    return (value / this.size) * 100;\n  }\n\n  private handleDrag(event: PointerEvent) {\n    const isRtl = false;\n\n    if (this.disabled) {\n      return;\n    }\n\n    // Prevent text selection when dragging\n    if (event.cancelable) {\n      event.preventDefault();\n    }\n\n    drag(this, {\n      onMove: (x, y) => {\n        let newPositionInPixels = this.vertical ? y : x;\n\n        // Flip for end panels\n        if (this.primary === 'end') {\n          newPositionInPixels = this.size - newPositionInPixels;\n        }\n\n        // Check snap points\n        if (this.snap) {\n          const snaps = this.snap.split(' ');\n\n          snaps.forEach(value => {\n            let snapPoint: number;\n\n            if (value.endsWith('%')) {\n              snapPoint = this.size * (parseFloat(value) / 100);\n            } else {\n              snapPoint = parseFloat(value);\n            }\n\n            if (isRtl && !this.vertical) {\n              snapPoint = this.size - snapPoint;\n            }\n\n            if (\n              newPositionInPixels >= snapPoint - this.snapThreshold &&\n              newPositionInPixels <= snapPoint + this.snapThreshold\n            ) {\n              newPositionInPixels = snapPoint;\n            }\n          });\n        }\n\n        this.position = clamp(this.pixelsToPercentage(newPositionInPixels), 0, 100);\n      },\n      initialEvent: event\n    });\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    if (this.disabled) {\n      return;\n    }\n\n    if (['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Home', 'End'].includes(event.key)) {\n      let newPosition = this.position;\n      const incr = (event.shiftKey ? 10 : 1) * (this.primary === 'end' ? -1 : 1);\n\n      event.preventDefault();\n\n      if ((event.key === 'ArrowLeft' && !this.vertical) || (event.key === 'ArrowUp' && this.vertical)) {\n        newPosition -= incr;\n      }\n\n      if ((event.key === 'ArrowRight' && !this.vertical) || (event.key === 'ArrowDown' && this.vertical)) {\n        newPosition += incr;\n      }\n\n      if (event.key === 'Home') {\n        newPosition = this.primary === 'end' ? 100 : 0;\n      }\n\n      if (event.key === 'End') {\n        newPosition = this.primary === 'end' ? 0 : 100;\n      }\n\n      this.position = clamp(newPosition, 0, 100);\n    }\n  }\n\n  private handleResize(entries: ResizeObserverEntry[]) {\n    const { width, height } = entries[0].contentRect;\n    this.size = this.vertical ? height : width;\n\n    // Resize when a primary panel is set\n    if (this.primary) {\n      this.position = this.pixelsToPercentage(this.cachedPositionInPixels);\n    }\n  }\n\n  @watch('position')\n  handlePositionChange() {\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n    this.positionInPixels = this.percentageToPixels(this.position);\n    this.emit('nile-reposition');\n  }\n\n  @watch('positionInPixels')\n  handlePositionInPixelsChange() {\n    this.position = this.pixelsToPercentage(this.positionInPixels);\n  }\n\n  @watch('vertical')\n  handleVerticalChange() {\n    this.detectSize();\n  }\n\n  render() {\n    const gridTemplate = this.vertical ? 'gridTemplateRows' : 'gridTemplateColumns';\n    const gridTemplateAlt = this.vertical ? 'gridTemplateColumns' : 'gridTemplateRows';\n    const isRtl = false;\n    const primary = `\n      clamp(\n        0%,\n        clamp(\n          var(--min),\n          ${this.position}% - var(--divider-width) / 2,\n          var(--max)\n        ),\n        calc(100% - var(--divider-width))\n      )\n    `;\n    const secondary = 'auto';\n\n    if (this.primary === 'end') {\n      if (isRtl && !this.vertical) {\n        this.style[gridTemplate] = `${primary} var(--divider-width) ${secondary}`;\n      } else {\n        this.style[gridTemplate] = `${secondary} var(--divider-width) ${primary}`;\n      }\n    } else {\n      if (isRtl && !this.vertical) {\n        this.style[gridTemplate] = `${secondary} var(--divider-width) ${primary}`;\n      } else {\n        this.style[gridTemplate] = `${primary} var(--divider-width) ${secondary}`;\n      }\n    }\n\n    // Unset the alt grid template property\n    this.style[gridTemplateAlt] = '';\n\n    return html`\n      <slot name=\"start\" part=\"panel start\" class=\"start\"></slot>\n\n      <div\n        part=\"divider\"\n        class=\"divider\"\n        tabindex=${ifDefined(this.disabled ? undefined : '0')}\n        role=\"separator\"\n        aria-valuenow=${this.position}\n        aria-valuemin=\"0\"\n        aria-valuemax=\"100\"\n        aria-label=\"resize\"\n        @keydown=${this.handleKeyDown}\n        @mousedown=${this.handleDrag}\n        @touchstart=${this.handleDrag}\n      >\n        <slot name=\"divider\"></slot>\n      </div>\n\n      <slot name=\"end\" part=\"panel end\" class=\"end\"></slot>\n    `;\n  }\n}\n\nexport default NileSplitPanel;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-split-panel': NileSplitPanel;\n  }\n}\n"]}
+{"version":3,"file":"nile-split-panel.js","sourceRoot":"","sources":["../../../src/nile-split-panel/nile-split-panel.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {LitElement, CSSResultArray, TemplateResult} from 'lit-element';\nimport {styles} from './nile-split-panel.css';\nimport NileElement from '../internal/nile-element';\n\n\nimport { clamp } from '../internal/math';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { drag } from '../internal/drag';\nimport { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { watch } from '../internal/watch';\nimport type { CSSResultGroup } from 'lit';\n\n/**\n * @summary Split panels display two adjacent panels, allowing the user to reposition them.\n *\n * @event nile-reposition - Emitted when the divider's position changes.\n *\n * @slot start - Content to place in the start panel.\n * @slot end - Content to place in the end panel.\n * @slot divider - The divider. Useful for slotting in a custom icon that renders as a handle.\n *\n * @csspart start - The start panel.\n * @csspart end - The end panel.\n * @csspart panel - Targets both the start and end panels.\n * @csspart divider - The divider that separates the start and end panels.\n *\n * @cssproperty [--divider-width=4px] - The width of the visible divider.\n * @cssproperty [--divider-hit-area=12px] - The invisible region around the divider where dragging can occur. This is\n *  usually wider than the divider to facilitate easier dragging.\n * @cssproperty [--min=0] - The minimum allowed size of the primary panel.\n * @cssproperty [--max=100%] - The maximum allowed size of the primary panel.\n */\n@customElement('nile-split-panel')\nexport class NileSplitPanel extends NileElement {\n\n\tstatic styles: CSSResultGroup = styles;\n\n  protected override BUBBLES: boolean=false;\n\n  private cachedPositionInPixels: number;\n  private resizeObserver: ResizeObserver;\n  private size: number;\n\n  @query('.divider') divider: HTMLElement;\n\n  /**\n   * The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the\n   * container's initial size.\n   */\n  @property({ type: Number, reflect: true }) position = 50;\n\n  /** The current position of the divider from the primary panel's edge in pixels. */\n  @property({ attribute: 'position-in-pixels', type: Number }) positionInPixels: number;\n\n  /** Draws the split panel in a vertical orientation with the start and end panels stacked. */\n  @property({ type: Boolean, reflect: true }) vertical = false;\n\n  /** Disables resizing. Note that the position may still change as a result of resizing the host element. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /**\n   * If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a\n   * primary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the\n   * host element is resized.\n   */\n  @property() primary?: 'start' | 'end';\n\n  /**\n   * One or more space-separated values at which the divider should snap. Values can be in pixels or percentages, e.g.\n   * `\"100px 50%\"`.\n   */\n  @property() snap?: string;\n\n  /** How close the divider must be to a snap point until snapping occurs. */\n  @property({ type: Number, attribute: 'snap-threshold' }) snapThreshold = 12;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.resizeObserver = new ResizeObserver(entries => this.handleResize(entries));\n    this.updateComplete.then(() => this.resizeObserver.observe(this));\n\n    this.detectSize();\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.resizeObserver.unobserve(this);\n  }\n\n  private detectSize() {\n    const { width, height } = this.getBoundingClientRect();\n    this.size = this.vertical ? height : width;\n  }\n\n  private percentageToPixels(value: number) {\n    return this.size * (value / 100);\n  }\n\n  private pixelsToPercentage(value: number) {\n    return (value / this.size) * 100;\n  }\n\n  private handleDrag(event: PointerEvent) {\n    const isRtl = false;\n\n    if (this.disabled) {\n      return;\n    }\n\n    // Prevent text selection when dragging\n    if (event.cancelable) {\n      event.preventDefault();\n    }\n\n    drag(this, {\n      onMove: (x, y) => {\n        let newPositionInPixels = this.vertical ? y : x;\n\n        // Flip for end panels\n        if (this.primary === 'end') {\n          newPositionInPixels = this.size - newPositionInPixels;\n        }\n\n        // Check snap points\n        if (this.snap) {\n          const snaps = this.snap.split(' ');\n\n          snaps.forEach(value => {\n            let snapPoint: number;\n\n            if (value.endsWith('%')) {\n              snapPoint = this.size * (parseFloat(value) / 100);\n            } else {\n              snapPoint = parseFloat(value);\n            }\n\n            if (isRtl && !this.vertical) {\n              snapPoint = this.size - snapPoint;\n            }\n\n            if (\n              newPositionInPixels >= snapPoint - this.snapThreshold &&\n              newPositionInPixels <= snapPoint + this.snapThreshold\n            ) {\n              newPositionInPixels = snapPoint;\n            }\n          });\n        }\n\n        this.position = clamp(this.pixelsToPercentage(newPositionInPixels), 0, 100);\n      },\n      initialEvent: event\n    });\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    if (this.disabled) {\n      return;\n    }\n\n    if (['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Home', 'End'].includes(event.key)) {\n      let newPosition = this.position;\n      const incr = (event.shiftKey ? 10 : 1) * (this.primary === 'end' ? -1 : 1);\n\n      event.preventDefault();\n\n      if ((event.key === 'ArrowLeft' && !this.vertical) || (event.key === 'ArrowUp' && this.vertical)) {\n        newPosition -= incr;\n      }\n\n      if ((event.key === 'ArrowRight' && !this.vertical) || (event.key === 'ArrowDown' && this.vertical)) {\n        newPosition += incr;\n      }\n\n      if (event.key === 'Home') {\n        newPosition = this.primary === 'end' ? 100 : 0;\n      }\n\n      if (event.key === 'End') {\n        newPosition = this.primary === 'end' ? 0 : 100;\n      }\n\n      this.position = clamp(newPosition, 0, 100);\n    }\n  }\n\n  private handleResize(entries: ResizeObserverEntry[]) {\n    const { width, height } = entries[0].contentRect;\n    this.size = this.vertical ? height : width;\n\n    // Resize when a primary panel is set\n    if (this.primary) {\n      this.position = this.pixelsToPercentage(this.cachedPositionInPixels);\n    }\n  }\n\n  @watch('position')\n  handlePositionChange() {\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n    this.positionInPixels = this.percentageToPixels(this.position);\n    this.emit('nile-reposition');\n  }\n\n  @watch('positionInPixels')\n  handlePositionInPixelsChange() {\n    this.position = this.pixelsToPercentage(this.positionInPixels);\n  }\n\n  @watch('vertical')\n  handleVerticalChange() {\n    this.detectSize();\n  }\n\n  render() {\n    const gridTemplate = this.vertical ? 'gridTemplateRows' : 'gridTemplateColumns';\n    const gridTemplateAlt = this.vertical ? 'gridTemplateColumns' : 'gridTemplateRows';\n    const isRtl = false;\n    const primary = `\n      clamp(\n        0%,\n        clamp(\n          var(--min),\n          ${this.position}% - var(--divider-width) / 2,\n          var(--max)\n        ),\n        calc(100% - var(--divider-width))\n      )\n    `;\n    const secondary = 'auto';\n\n    if (this.primary === 'end') {\n      if (isRtl && !this.vertical) {\n        this.style[gridTemplate] = `${primary} var(--divider-width) ${secondary}`;\n      } else {\n        this.style[gridTemplate] = `${secondary} var(--divider-width) ${primary}`;\n      }\n    } else {\n      if (isRtl && !this.vertical) {\n        this.style[gridTemplate] = `${secondary} var(--divider-width) ${primary}`;\n      } else {\n        this.style[gridTemplate] = `${primary} var(--divider-width) ${secondary}`;\n      }\n    }\n\n    // Unset the alt grid template property\n    this.style[gridTemplateAlt] = '';\n\n    return html`\n      <slot name=\"start\" part=\"panel start\" class=\"start\"></slot>\n\n      <div\n        part=\"divider\"\n        class=\"divider\"\n        tabindex=${ifDefined(this.disabled ? undefined : '0')}\n        role=\"separator\"\n        aria-valuenow=${this.position}\n        aria-valuemin=\"0\"\n        aria-valuemax=\"100\"\n        aria-label=\"resize\"\n        @keydown=${this.handleKeyDown}\n        @mousedown=${this.handleDrag}\n        @touchstart=${this.handleDrag}\n      >\n        <slot name=\"divider\"></slot>\n      </div>\n\n      <slot name=\"end\" part=\"panel end\" class=\"end\"></slot>\n    `;\n  }\n}\n\nexport default NileSplitPanel;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-split-panel': NileSplitPanel;\n  }\n}\n"]}

package/dist/src/nile-split-panel/nile-split-panel.test.d.ts

@@ -0,0 +1 @@
+import './nile-split-panel';

package/dist/src/nile-split-panel/nile-split-panel.test.js

@@ -0,0 +1,4 @@
+import './nile-split-panel';
+describe('NileSplitPanel', () => {
+});
+//# sourceMappingURL=nile-split-panel.test.js.map

package/dist/src/nile-split-panel/nile-split-panel.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-split-panel.test.js","sourceRoot":"","sources":["../../../src/nile-split-panel/nile-split-panel.test.ts"],"names":[],"mappings":"AACA,OAAO,oBAAoB,CAAA;AAG3B,QAAQ,CAAC,gBAAgB,EAAC,GAAE,EAAE;AAE9B,CAAC,CAAC,CAAA","sourcesContent":["import { expect, fixture, html, oneEvent } from '@open-wc/testing';\nimport './nile-split-panel'\nimport NileSplitPanel from './nile-split-panel';\n\ndescribe('NileSplitPanel',()=>{\n\t\n})"]}

package/dist/src/nile-stepper/nile-stepper.d.ts

@@ -13,6 +13,7 @@ import NileElement from '../internal/nile-element';
  *
  */
 export declare class NileStepper extends NileElement {
+    protected BUBBLES: boolean;
     isVertical: boolean;
     contentBelow: boolean;
     currentStep: number;

package/dist/src/nile-stepper/nile-stepper.js

@@ -20,6 +20,7 @@ import { classMap } from 'lit/directives/class-map.js';
 let NileStepper = class NileStepper extends NileElement {
     constructor() {
         super(...arguments);
+        this.BUBBLES = false;
         this.isVertical = false;
         this.contentBelow = false;
         this.currentStep = 0;

package/dist/src/nile-stepper/nile-stepper.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-stepper.js","sourceRoot":"","sources":["../../../src/nile-stepper/nile-stepper.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html, property, CSSResultArray, TemplateResult } from 'lit-element';\nimport { customElement } from 'lit/decorators.js';\nimport { styles } from './nile-stepper.css';\nimport NileElement from '../internal/nile-element';\nimport { watch } from '../internal/watch';\nimport { classMap } from 'lit/directives/class-map.js';\n\n\n/**\n * Nile stepper component.\n *\n * @tag nile-stepper\n *\n */\n@customElement('nile-stepper')\nexport class NileStepper extends NileElement {\n\n\t@property({ type: Boolean, attribute: 'vertical' }) isVertical: boolean = false;\n\t@property({ type: Boolean, attribute: 'content-below', reflect:true }) contentBelow: boolean = false;\n\t@property({ type: Number, attribute: 'currentStep', reflect:true }) currentStep: number = 0;\n\t@property({ type: Number, attribute: 'completedStep', reflect:true  }) completedStep: number = 0;\n\t@property({ type: String, attribute: 'size', reflect:true  }) size: 'sm' | 'md' | 'lg' = 'md';\n\t@property() icon: string = 'tick';\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback();\n\t\tthis.updateComplete.then(() => {\n\t\t\tthis.updateItems();\n\t\t});\n\t}\n\n\t@watch('currentStep')\n\thandleCurrentStepChanges() {\n\t\tthis.updateItems();\n\t\tthis.emit('nile-current-change', { value: this.currentStep });\n\t}\n\n\t@watch('completedStep')\n\thandleCompletedStepChanges() {\n\t\tthis.updateItems()\n\t\tthis.emit('nile-completed-change', { value: this.completedStep });\n\t}\n\n\tprivate updateItems() {\n\t\tconst items: any = [...this.querySelectorAll(this.isVertical?'nile-vertical-stepper-item':'nile-stepper-item')];\n\t\tif (!items.length) return;\n\t\tconst haveFlex = items.length < 3;\n\n\t\tconst current = (this.currentStep == 0 || this.currentStep > items.length) ? 1 : this.currentStep;\n\t\tconst calculatedCompleted = this.completedStep > items.length ? current : this.completedStep < current ? current : this.completedStep;\n\t\tconst completed = this.completedStep > items.length ? 0 : this.completedStep;\n\n\t\titems.forEach((el: any, index: number) => {\n\t\t\t// set item is complete and is current values\n\t\t\tif (index + 1 < current) {\n\t\t\t\tel.isComplete = true;\n\t\t\t\tel.isCurrent = false;\n\t\t\t}\n\t\t\telse if (index + 1 == current) {\n\t\t\t\tif (index + 1 <= calculatedCompleted) el.isComplete = true;\n\t\t\t\telse el.isComplete = false;\n\t\t\t\tel.isCurrent = true;\n\t\t\t}\n\t\t\telse {\n\t\t\t\tif (index + 1 <= calculatedCompleted) el.isComplete = true;\n\t\t\t\telse el.isComplete = false;\n\t\t\t\tel.isCurrent = false;\n\t\t\t}\n\n\t\t\t// Set isLast and isFirst\n\t\t\tif (index == 0) el.isFirst = true;\n\t\t\tif (index == items.length - 1) el.isLast = true;\n\n\t\t\t// setting default values\n\t\t\tel.currentStepValue = current;\n\t\t\tel.calculatedCompletedStepValue = calculatedCompleted;\n\t\t\tel.completedStepValue = completed;\n\n\t\t\tel.icon = this.icon;\n\t\t\tel.size = this.size;\n\t\t\tel.value = index + 1;\n\t\t\tel.contentBelow = this.contentBelow\n\t\t\tif (index == 0 || index == items.length - 1) {\n\t\t\t\tel.haveFlex = haveFlex;\n\t\t\t}\n\t\t})\n\t}\n\n\t/**\n\t * The styles for nile-stepper\n\t * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n\t */\n\tpublic static get styles(): CSSResultArray {\n\t\treturn [styles];\n\t}\n\n\t/* #endregion */\n\n\t/* #region Methods */\n\n\t/**\n\t * Render method\n\t * @slot This is a slot test\n\t */\n\tpublic render(): TemplateResult {\n\t\treturn html`\n\t\t\t<div class=${classMap({\n\t\t\t\t'nile-stepper':true,\n\t\t\t\t'nile-stepper--horizontal':!this.isVertical,\n\t\t\t\t'nile-stepper--vertical':this.isVertical\n\t\t\t})}>\n\t\t\t\t<slot\n\t\t\t\t\t@slotchange=${this.updateItems}\n\t\t\t\t></slot>\n\t\t\t</div>\n\t\t\t`;\n\t}\n\n\t/* #endregion */\n}\n\nexport default NileStepper;\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'nile-stepper': NileStepper;\n\t}\n}\n"]}
+{"version":3,"file":"nile-stepper.js","sourceRoot":"","sources":["../../../src/nile-stepper/nile-stepper.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html, property, CSSResultArray, TemplateResult } from 'lit-element';\nimport { customElement } from 'lit/decorators.js';\nimport { styles } from './nile-stepper.css';\nimport NileElement from '../internal/nile-element';\nimport { watch } from '../internal/watch';\nimport { classMap } from 'lit/directives/class-map.js';\n\n\n/**\n * Nile stepper component.\n *\n * @tag nile-stepper\n *\n */\n@customElement('nile-stepper')\nexport class NileStepper extends NileElement {\n\n  protected override BUBBLES: boolean=false;\n\n\t@property({ type: Boolean, attribute: 'vertical' }) isVertical: boolean = false;\n\t@property({ type: Boolean, attribute: 'content-below', reflect:true }) contentBelow: boolean = false;\n\t@property({ type: Number, attribute: 'currentStep', reflect:true }) currentStep: number = 0;\n\t@property({ type: Number, attribute: 'completedStep', reflect:true  }) completedStep: number = 0;\n\t@property({ type: String, attribute: 'size', reflect:true  }) size: 'sm' | 'md' | 'lg' = 'md';\n\t@property() icon: string = 'tick';\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback();\n\t\tthis.updateComplete.then(() => {\n\t\t\tthis.updateItems();\n\t\t});\n\t}\n\n\t@watch('currentStep')\n\thandleCurrentStepChanges() {\n\t\tthis.updateItems();\n\t\tthis.emit('nile-current-change', { value: this.currentStep });\n\t}\n\n\t@watch('completedStep')\n\thandleCompletedStepChanges() {\n\t\tthis.updateItems()\n\t\tthis.emit('nile-completed-change', { value: this.completedStep });\n\t}\n\n\tprivate updateItems() {\n\t\tconst items: any = [...this.querySelectorAll(this.isVertical?'nile-vertical-stepper-item':'nile-stepper-item')];\n\t\tif (!items.length) return;\n\t\tconst haveFlex = items.length < 3;\n\n\t\tconst current = (this.currentStep == 0 || this.currentStep > items.length) ? 1 : this.currentStep;\n\t\tconst calculatedCompleted = this.completedStep > items.length ? current : this.completedStep < current ? current : this.completedStep;\n\t\tconst completed = this.completedStep > items.length ? 0 : this.completedStep;\n\n\t\titems.forEach((el: any, index: number) => {\n\t\t\t// set item is complete and is current values\n\t\t\tif (index + 1 < current) {\n\t\t\t\tel.isComplete = true;\n\t\t\t\tel.isCurrent = false;\n\t\t\t}\n\t\t\telse if (index + 1 == current) {\n\t\t\t\tif (index + 1 <= calculatedCompleted) el.isComplete = true;\n\t\t\t\telse el.isComplete = false;\n\t\t\t\tel.isCurrent = true;\n\t\t\t}\n\t\t\telse {\n\t\t\t\tif (index + 1 <= calculatedCompleted) el.isComplete = true;\n\t\t\t\telse el.isComplete = false;\n\t\t\t\tel.isCurrent = false;\n\t\t\t}\n\n\t\t\t// Set isLast and isFirst\n\t\t\tif (index == 0) el.isFirst = true;\n\t\t\tif (index == items.length - 1) el.isLast = true;\n\n\t\t\t// setting default values\n\t\t\tel.currentStepValue = current;\n\t\t\tel.calculatedCompletedStepValue = calculatedCompleted;\n\t\t\tel.completedStepValue = completed;\n\n\t\t\tel.icon = this.icon;\n\t\t\tel.size = this.size;\n\t\t\tel.value = index + 1;\n\t\t\tel.contentBelow = this.contentBelow\n\t\t\tif (index == 0 || index == items.length - 1) {\n\t\t\t\tel.haveFlex = haveFlex;\n\t\t\t}\n\t\t})\n\t}\n\n\t/**\n\t * The styles for nile-stepper\n\t * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n\t */\n\tpublic static get styles(): CSSResultArray {\n\t\treturn [styles];\n\t}\n\n\t/* #endregion */\n\n\t/* #region Methods */\n\n\t/**\n\t * Render method\n\t * @slot This is a slot test\n\t */\n\tpublic render(): TemplateResult {\n\t\treturn html`\n\t\t\t<div class=${classMap({\n\t\t\t\t'nile-stepper':true,\n\t\t\t\t'nile-stepper--horizontal':!this.isVertical,\n\t\t\t\t'nile-stepper--vertical':this.isVertical\n\t\t\t})}>\n\t\t\t\t<slot\n\t\t\t\t\t@slotchange=${this.updateItems}\n\t\t\t\t></slot>\n\t\t\t</div>\n\t\t\t`;\n\t}\n\n\t/* #endregion */\n}\n\nexport default NileStepper;\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'nile-stepper': NileStepper;\n\t}\n}\n"]}

package/dist/src/nile-stepper/nile-stepper.test.d.ts

@@ -0,0 +1,4 @@
+import './nile-stepper';
+import "./nile-stepper";
+import "../nile-stepper-item/nile-stepper-item";
+import "../nile-vertical-stepper-item/nile-vertical-stepper-item";