@aquera/nile-elements 0.0.80 → 0.0.82

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

@@ -0,0 +1,72 @@
+import { fixture, expect, oneEvent, aTimeout } from '@open-wc/testing';
+import { html } from 'lit/static-html.js';
+import './nile-link';
+describe('NileLink', () => {
+    it('should render correctly', async () => {
+        const el = await fixture(html `<nile-link></nile-link>`);
+        expect(el.shadowRoot).to.exist;
+        expect(el.shadowRoot.querySelector('.link')).to.exist;
+    });
+    it('should handle the disabled attribute', async () => {
+        const el = await fixture(html `<nile-link disabled></nile-link>`);
+        const link = el.shadowRoot.querySelector('.link');
+        expect(el.disabled).to.be.true;
+        expect(link.getAttribute('aria-disabled')).to.equal('true');
+        expect(link.getAttribute('tabindex')).to.equal('-1');
+    });
+    it('should emit custom events on focus and blur', async () => {
+        const el = await fixture(html `<nile-link></nile-link>`);
+        setTimeout(() => el.shadowRoot.querySelector('.link').focus());
+        const focusEvent = await oneEvent(el, 'nile-focus');
+        expect(focusEvent).to.exist;
+        setTimeout(() => el.shadowRoot.querySelector('.link').blur());
+        const blurEvent = await oneEvent(el, 'nile-blur');
+        expect(blurEvent).to.exist;
+    });
+    it('should prevent click events when disabled', async () => {
+        const el = await fixture(html `<nile-link disabled></nile-link>`);
+        let clicked = false;
+        el.addEventListener('click', () => {
+            clicked = true;
+        });
+        el.shadowRoot.querySelector('.link').click();
+        await aTimeout(100);
+        expect(clicked).to.be.false;
+    });
+    it('should handle button property correctly', async () => {
+        const el = await fixture(html `<nile-link button></nile-link>`);
+        const link = el.shadowRoot.querySelector('.link');
+        expect(link.classList.contains('link__button')).to.be.true;
+    });
+    it('should have all slots rendered successfully', async () => {
+        const el = await fixture(html `<nile-link><span slot="prefix">Prefix</span><span>Label</span><span slot="suffix">Suffix</span></nile-link>`);
+        const prefixSlot = el.shadowRoot.querySelector('slot[name="prefix"]');
+        const labelSlot = el.shadowRoot.querySelector('slot:not([name])');
+        const suffixSlot = el.shadowRoot.querySelector('slot[name="suffix"]');
+        expect(prefixSlot.assignedNodes().length).to.equal(1);
+        expect(labelSlot.assignedNodes().length).to.equal(1);
+        expect(suffixSlot.assignedNodes().length).to.equal(1);
+    });
+    it('should emit nile-init and nile-destroy events on connected and disconnected', async () => {
+        const el = document.createElement('nile-link');
+        let initEvent, destroyEvent;
+        el.addEventListener('nile-init', (e) => initEvent = e);
+        el.addEventListener('nile-init', (e) => destroyEvent = e);
+        document.body.appendChild(el);
+        await el.updateComplete;
+        expect(initEvent).to.exist;
+        document.body.removeChild(el);
+        await el.updateComplete;
+        expect(destroyEvent).to.exist;
+    });
+    it('should reflect properties correctly', async () => {
+        const el = await fixture(html `<nile-link></nile-link>`);
+        el.disabled = true;
+        await el.updateComplete;
+        expect(el.hasAttribute('disabled')).to.be.true;
+        el.disabled = false;
+        await el.updateComplete;
+        expect(el.hasAttribute('disabled')).to.be.false;
+    });
+});
+//# sourceMappingURL=nile-link.test.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"nile-link.test.js","sourceRoot":"","sources":["../../../src/nile-link/nile-link.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { fixture, expect, oneEvent, aTimeout } from '@open-wc/testing';\nimport { html } from 'lit/static-html.js';\nimport './nile-link';\nimport { NileLink } from './nile-link';\ndescribe('NileLink', () => {\n    it('should render correctly', async () => {\n        const el: NileLink = await fixture(html`<nile-link></nile-link>`);\n        expect(el.shadowRoot).to.exist;\n        expect(el.shadowRoot!.querySelector('.link')).to.exist;\n    });\n\n    it('should handle the disabled attribute', async () => {\n        const el: NileLink = await fixture(html`<nile-link disabled></nile-link>`);\n        const link = el.shadowRoot!.querySelector('.link')!;\n        expect(el.disabled).to.be.true;\n        expect(link.getAttribute('aria-disabled')).to.equal('true');\n        expect(link.getAttribute('tabindex')).to.equal('-1');\n    });\n\n    it('should emit custom events on focus and blur', async () => {\n        const el: NileLink = await fixture(html`<nile-link></nile-link>`);\n        setTimeout(() => el.shadowRoot!.querySelector<HTMLElement>('.link')!.focus());\n        const focusEvent = await oneEvent(el, 'nile-focus');\n        expect(focusEvent).to.exist;\n\n        setTimeout(() => el.shadowRoot!.querySelector<HTMLElement>('.link')!.blur());\n        const blurEvent = await oneEvent(el, 'nile-blur');\n        expect(blurEvent).to.exist;\n    });\n\n    it('should prevent click events when disabled', async () => {\n        const el: NileLink = await fixture(html`<nile-link disabled></nile-link>`);\n        let clicked = false;\n        el.addEventListener('click', () => {\n            clicked = true;\n        });\n\n        el.shadowRoot!.querySelector<HTMLElement>('.link')!.click();\n        await aTimeout(100);\n        expect(clicked).to.be.false;\n    });\n\n    it('should handle button property correctly', async () => {\n        const el: NileLink = await fixture(html`<nile-link button></nile-link>`);\n        const link = el.shadowRoot!.querySelector('.link')!;\n        expect(link.classList.contains('link__button')).to.be.true;\n    });\n\n    it('should have all slots rendered successfully', async () => {\n        const el: NileLink = await fixture(html`<nile-link><span slot=\"prefix\">Prefix</span><span>Label</span><span slot=\"suffix\">Suffix</span></nile-link>`);\n        const prefixSlot = el.shadowRoot!.querySelector<HTMLSlotElement>('slot[name=\"prefix\"]')!;\n        const labelSlot = el.shadowRoot!.querySelector<HTMLSlotElement>('slot:not([name])')!;\n        const suffixSlot = el.shadowRoot!.querySelector<HTMLSlotElement>('slot[name=\"suffix\"]')!;\n        expect(prefixSlot.assignedNodes().length).to.equal(1);\n        expect(labelSlot.assignedNodes().length).to.equal(1);\n        expect(suffixSlot.assignedNodes().length).to.equal(1);\n    });\n\n\n    it('should emit nile-init and nile-destroy events on connected and disconnected', async () => {\n        const el: NileLink = document.createElement('nile-link');\n        let initEvent:any, destroyEvent:any;\n        el.addEventListener('nile-init',(e)=>initEvent=e)\n        el.addEventListener('nile-init',(e)=>destroyEvent=e)\n        document.body.appendChild(el);\n        await el.updateComplete\n        expect(initEvent).to.exist;\n        document.body.removeChild(el);\n        await el.updateComplete\n        expect(destroyEvent).to.exist;\n    });\n\n    it('should reflect properties correctly', async () => {\n        const el: NileLink = await fixture(html`<nile-link></nile-link>`);\n        el.disabled = true;\n        await el.updateComplete;\n        expect(el.hasAttribute('disabled')).to.be.true;\n    \n        el.disabled = false;\n        await el.updateComplete;\n        expect(el.hasAttribute('disabled')).to.be.false;\n    });\n})"]}

package/dist/src/nile-list/index.d.ts

@@ -0,0 +1 @@
+export { NileList } from './nile-list';

package/dist/src/nile-list/index.js

@@ -0,0 +1,2 @@
+export { NileList } from './nile-list';
+//# sourceMappingURL=index.js.map

package/dist/src/nile-list/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/nile-list/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC","sourcesContent":["export { NileList } from './nile-list';"]}

package/dist/src/nile-list/nile-list.css.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/**
+ * List CSS
+ */
+export declare const styles: import("lit-element").CSSResult;
+declare const _default: import("lit-element").CSSResult[];
+export default _default;

package/dist/src/nile-list/nile-list.css.js

@@ -0,0 +1,20 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { css } from 'lit-element';
+/**
+ * List CSS
+ */
+export const styles = css `
+  :host {
+    display: flex;
+    flex-direction: column;
+    gap: 9px;
+    padding: 16px;
+  }
+`;
+export default [styles];
+//# sourceMappingURL=nile-list.css.js.map

package/dist/src/nile-list/nile-list.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-list.css.js","sourceRoot":"","sources":["../../../src/nile-list/nile-list.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;CAOxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","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 { css } from 'lit-element';\n\n/**\n * List CSS\n */\nexport const styles = css`\n  :host {\n    display: flex;\n    flex-direction: column;\n    gap: 9px;\n    padding: 16px;\n  }\n`;\n\nexport default [styles];\n"]}

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

@@ -0,0 +1,33 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { CSSResultArray, TemplateResult } from 'lit-element';
+import NileElement from '../internal/nile-element';
+/**
+ * Nile list component.
+ *
+ * @tag nile-list
+ *
+ */
+export declare class NileList extends NileElement {
+    /**
+     * The styles for nile-list
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    static get styles(): CSSResultArray;
+    /**
+     * Render method
+     * @slot This is a slot test
+     */
+    handleListItemClick(e: any): void;
+    render(): TemplateResult;
+}
+export default NileList;
+declare global {
+    interface HTMLElementTagNameMap {
+        'nile-list': NileList;
+    }
+}

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

@@ -0,0 +1,47 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { __decorate } from "tslib";
+import { html, } from 'lit-element';
+import { customElement } from 'lit/decorators.js';
+import { styles } from './nile-list.css';
+import NileElement from '../internal/nile-element';
+/**
+ * Nile list component.
+ *
+ * @tag nile-list
+ *
+ */
+let NileList = class NileList extends NileElement {
+    /**
+     * The styles for nile-list
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    static get styles() {
+        return [styles];
+    }
+    /* #endregion */
+    /* #region Methods */
+    /**
+     * Render method
+     * @slot This is a slot test
+     */
+    handleListItemClick(e) {
+        const listTextValue = e.target.innerText;
+        this.emit('nile-list-click', { value: listTextValue });
+    }
+    render() {
+        return html `
+      <slot @nile-list-item-click="${this.handleListItemClick}"> </slot>
+    `;
+    }
+};
+NileList = __decorate([
+    customElement('nile-list')
+], NileList);
+export { NileList };
+export default NileList;
+//# sourceMappingURL=nile-list.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"nile-list.js","sourceRoot":"","sources":["../../../src/nile-list/nile-list.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,GAIL,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAEnD;;;;;GAKG;AAEI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,WAAW;IACvC;;;OAGG;IACI,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IAED,gBAAgB;IAEhB,qBAAqB;IAErB;;;OAGG;IAEH,mBAAmB,CAAC,CAAM;QACxB,MAAM,aAAa,GAAG,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC;QACzC,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC,CAAC;IACzD,CAAC;IAEM,MAAM;QACX,OAAO,IAAI,CAAA;qCACsB,IAAI,CAAC,mBAAmB;KACxD,CAAC;IACJ,CAAC;CAGF,CAAA;AA9BY,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CA8BpB;SA9BY,QAAQ;AAgCrB,eAAe,QAAQ,CAAC","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 {\n  LitElement,\n  html,\n  property,\n  CSSResultArray,\n  TemplateResult,\n} from 'lit-element';\nimport { customElement } from 'lit/decorators.js';\nimport { styles } from './nile-list.css';\nimport NileElement from '../internal/nile-element';\n\n/**\n * Nile list component.\n *\n * @tag nile-list\n *\n */\n@customElement('nile-list')\nexport class NileList extends NileElement {\n  /**\n   * The styles for nile-list\n   * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n   */\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n\n  /* #endregion */\n\n  /* #region Methods */\n\n  /**\n   * Render method\n   * @slot This is a slot test\n   */\n\n  handleListItemClick(e: any) {\n    const listTextValue = e.target.innerText;\n    this.emit('nile-list-click', { value: listTextValue });\n  }\n\n  public render(): TemplateResult {\n    return html`\n      <slot @nile-list-item-click=\"${this.handleListItemClick}\"> </slot>\n    `;\n  }\n\n  /* #endregion */\n}\n\nexport default NileList;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-list': NileList;\n  }\n}\n"]}

package/dist/src/nile-list-item/index.d.ts

@@ -0,0 +1 @@
+export { NileListItem } from './nile-list-item';

package/dist/src/nile-list-item/index.js

@@ -0,0 +1,2 @@
+export { NileListItem } from './nile-list-item';
+//# sourceMappingURL=index.js.map

package/dist/src/nile-list-item/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/nile-list-item/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC","sourcesContent":["export { NileListItem } from './nile-list-item';"]}

package/dist/src/nile-list-item/nile-list-item.css.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/**
+ * ListItem CSS
+ */
+export declare const styles: import("lit-element").CSSResult;
+declare const _default: import("lit-element").CSSResult[];
+export default _default;

package/dist/src/nile-list-item/nile-list-item.css.js

@@ -0,0 +1,66 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { css } from 'lit-element';
+/**
+ * ListItem CSS
+ */
+export const styles = css `
+  :host {
+    display: flex;
+    padding: 12px 16px;
+    flex-direction: row;
+    align-items: flex-start;
+    justify-content: start;
+    position: relative;
+    height: 100%;
+  }
+
+  :host(:hover) {
+    background-color: #f0f0f0; /* Change background color on hover */
+  }
+
+  .preffix__icon {
+    display: inline-block;
+    margin-right: 12px;
+  }
+
+  .list__item {
+    cursor: pointer;
+    height: 100%;
+    display: block;
+    font-size: 16px;
+  }
+
+  .content__wrapper {
+    display: flex;
+    flex-direction: column;
+    gap: 3px;
+    height: 100%;
+    box-sizing: border-box;
+  }
+
+  .heading {
+    display: inline-block;
+    font-size: 18px;
+    font-weight: 600;
+  }
+
+  .subheading {
+    display: inline-block;
+    font-size: 12px;
+    font-weight: 300;
+  }
+
+  .list-item__suffix {
+    display: inline-block;
+    position: absolute;
+    right: 16px;
+    cursor: pointer;
+  }
+`;
+export default [styles];
+//# sourceMappingURL=nile-list-item.css.js.map

package/dist/src/nile-list-item/nile-list-item.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-list-item.css.js","sourceRoot":"","sources":["../../../src/nile-list-item/nile-list-item.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqDxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","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 { css } from 'lit-element';\n\n/**\n * ListItem CSS\n */\nexport const styles = css`\n  :host {\n    display: flex;\n    padding: 12px 16px;\n    flex-direction: row;\n    align-items: flex-start;\n    justify-content: start;\n    position: relative;\n    height: 100%;\n  }\n\n  :host(:hover) {\n    background-color: #f0f0f0; /* Change background color on hover */\n  }\n\n  .preffix__icon {\n    display: inline-block;\n    margin-right: 12px;\n  }\n\n  .list__item {\n    cursor: pointer;\n    height: 100%;\n    display: block;\n    font-size: 16px;\n  }\n\n  .content__wrapper {\n    display: flex;\n    flex-direction: column;\n    gap: 3px;\n    height: 100%;\n    box-sizing: border-box;\n  }\n\n  .heading {\n    display: inline-block;\n    font-size: 18px;\n    font-weight: 600;\n  }\n\n  .subheading {\n    display: inline-block;\n    font-size: 12px;\n    font-weight: 300;\n  }\n\n  .list-item__suffix {\n    display: inline-block;\n    position: absolute;\n    right: 16px;\n    cursor: pointer;\n  }\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-list-item/nile-list-item.d.ts

@@ -0,0 +1,38 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { CSSResultArray, TemplateResult } from 'lit-element';
+import NileElement from '../internal/nile-element';
+/**
+ * Nile list-item component.
+ *
+ * @tag nile-list-item
+ *
+ */
+export declare class NileListItem extends NileElement {
+    /**
+     * The styles for nile-list-item
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    private readonly hasSlotController;
+    static get styles(): CSSResultArray;
+    iconName: string;
+    iconSize: number;
+    heading: string;
+    subHeading: string;
+    /**
+     * Render method
+     * @slot This is a slot test
+     */
+    handleClick(e: any): void;
+    render(): TemplateResult;
+}
+export default NileListItem;
+declare global {
+    interface HTMLElementTagNameMap {
+        'nile-list-item': NileListItem;
+    }
+}

package/dist/src/nile-list-item/nile-list-item.js

@@ -0,0 +1,96 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { __decorate } from "tslib";
+import { html, property, } from 'lit-element';
+import { customElement } from 'lit/decorators.js';
+import { styles } from './nile-list-item.css';
+import NileElement from '../internal/nile-element';
+import { HasSlotController } from '../internal/slot';
+/**
+ * Nile list-item component.
+ *
+ * @tag nile-list-item
+ *
+ */
+let NileListItem = class NileListItem extends NileElement {
+    constructor() {
+        /**
+         * The styles for nile-list-item
+         * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+         */
+        super(...arguments);
+        this.hasSlotController = new HasSlotController(this, 'preffix', 'heading', 'subheading');
+        this.iconName = '';
+        this.iconSize = 14;
+        this.heading = '';
+        this.subHeading = '';
+        /* #endregion */
+    }
+    static get styles() {
+        return [styles];
+    }
+    /* #endregion */
+    /* #region Methods */
+    /**
+     * Render method
+     * @slot This is a slot test
+     */
+    handleClick(e) {
+        this.emit('nile-list-item-click', {
+            heading: this.heading,
+            subheading: this.subHeading,
+        });
+    }
+    render() {
+        return html `
+      ${this.iconName || this.hasSlotController.test('preffix')
+            ? html ` <slot name="preffix" part="preffix" class="preffix__icon">
+            <nile-icon
+              name="${this.iconName}"
+              size="${this.iconSize}"
+            ></nile-icon>
+          </slot>`
+            : ``}
+
+      <div class="content__wrapper" part="content__wrapper">
+        ${this.heading || this.hasSlotController.test('heading')
+            ? html ` <slot class="heading" part="heading" name="heading"
+              >${this.heading}</slot
+            >`
+            : ``}
+        ${this.subHeading || this.hasSlotController.test('subheading')
+            ? html ` <slot class="subheading" part="subheading" name="subheading"
+              >${this.subHeading}</slot
+            >`
+            : `
+          `}
+      </div>
+
+      <slot @click="${this.handleClick}" class="list__item" part="base"> </slot>
+      <slot name="suffix" part="suffix" class="list-item__suffix">
+      </slot>
+    `;
+    }
+};
+__decorate([
+    property({ type: String, attribute: 'icon-name' })
+], NileListItem.prototype, "iconName", void 0);
+__decorate([
+    property({ type: Number, attribute: 'icon-size' })
+], NileListItem.prototype, "iconSize", void 0);
+__decorate([
+    property({ type: String, attribute: 'heading' })
+], NileListItem.prototype, "heading", void 0);
+__decorate([
+    property({ type: String, attribute: 'sub-heading' })
+], NileListItem.prototype, "subHeading", void 0);
+NileListItem = __decorate([
+    customElement('nile-list-item')
+], NileListItem);
+export { NileListItem };
+export default NileListItem;
+//# sourceMappingURL=nile-list-item.js.map

package/dist/src/nile-list-item/nile-list-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-list-item.js","sourceRoot":"","sources":["../../../src/nile-list-item/nile-list-item.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,EACJ,QAAQ,GAGT,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,WAAW,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD;;;;;GAKG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,WAAW;IAAtC;QACL;;;WAGG;;QAEc,sBAAiB,GAAG,IAAI,iBAAiB,CACxD,IAAI,EACJ,SAAS,EACT,SAAS,EACT,YAAY,CACb,CAAC;QAKkD,aAAQ,GAAG,EAAE,CAAC;QACd,aAAQ,GAAG,EAAE,CAAC;QAEhB,YAAO,GAAG,EAAE,CAAC;QACT,eAAU,GAAG,EAAE,CAAC;QAgDtE,gBAAgB;IAClB,CAAC;IAxDQ,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IAOD,gBAAgB;IAEhB,qBAAqB;IAErB;;;OAGG;IACH,WAAW,CAAC,CAAM;QAChB,IAAI,CAAC,IAAI,CAAC,sBAAsB,EAAE;YAChC,OAAO,EAAE,IAAI,CAAC,OAAO;YACrB,UAAU,EAAE,IAAI,CAAC,UAAU;SAC5B,CAAC,CAAC;IACL,CAAC;IAEM,MAAM;QACX,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC;YACvD,CAAC,CAAC,IAAI,CAAA;;sBAEQ,IAAI,CAAC,QAAQ;sBACb,IAAI,CAAC,QAAQ;;kBAEjB;YACV,CAAC,CAAC,EAAE;;;UAGF,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC;YACtD,CAAC,CAAC,IAAI,CAAA;iBACC,IAAI,CAAC,OAAO;cACf;YACJ,CAAC,CAAC,EAAE;UACJ,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC;YAC5D,CAAC,CAAC,IAAI,CAAA;iBACC,IAAI,CAAC,UAAU;cAClB;YACJ,CAAC,CAAC;WACD;;;sBAGW,IAAI,CAAC,WAAW;;;KAGjC,CAAC;IACJ,CAAC;CAGF,CAAA;AArDqD;IAAnD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,CAAC;8CAAe;AACd;IAAnD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,CAAC;8CAAe;AAEhB;IAAjD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC;6CAAc;AACT;IAArD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC;gDAAiB;AApB3D,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAqExB;SArEY,YAAY;AAuEzB,eAAe,YAAY,CAAC","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 {\n  LitElement,\n  html,\n  property,\n  CSSResultArray,\n  TemplateResult,\n} from 'lit-element';\nimport { customElement } from 'lit/decorators.js';\nimport { styles } from './nile-list-item.css';\nimport NileElement from '../internal/nile-element';\nimport { HasSlotController } from '../internal/slot';\n\n/**\n * Nile list-item component.\n *\n * @tag nile-list-item\n *\n */\n@customElement('nile-list-item')\nexport class NileListItem extends NileElement {\n  /**\n   * The styles for nile-list-item\n   * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n   */\n\n  private readonly hasSlotController = new HasSlotController(\n    this,\n    'preffix',\n    'heading',\n    'subheading'\n  );\n\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n  @property({ type: String, attribute: 'icon-name' }) iconName = '';\n  @property({ type: Number, attribute: 'icon-size' }) iconSize = 14;\n\n  @property({ type: String, attribute: 'heading' }) heading = '';\n  @property({ type: String, attribute: 'sub-heading' }) subHeading = '';\n  \n  /* #endregion */\n\n  /* #region Methods */\n\n  /**\n   * Render method\n   * @slot This is a slot test\n   */\n  handleClick(e: any) {\n    this.emit('nile-list-item-click', {\n      heading: this.heading,\n      subheading: this.subHeading,\n    });\n  }\n\n  public render(): TemplateResult {\n    return html`\n      ${this.iconName || this.hasSlotController.test('preffix')\n        ? html` <slot name=\"preffix\" part=\"preffix\" class=\"preffix__icon\">\n            <nile-icon\n              name=\"${this.iconName}\"\n              size=\"${this.iconSize}\"\n            ></nile-icon>\n          </slot>`\n        : ``}\n\n      <div class=\"content__wrapper\" part=\"content__wrapper\">\n        ${this.heading || this.hasSlotController.test('heading')\n          ? html` <slot class=\"heading\" part=\"heading\" name=\"heading\"\n              >${this.heading}</slot\n            >`\n          : ``}\n        ${this.subHeading || this.hasSlotController.test('subheading')\n          ? html` <slot class=\"subheading\" part=\"subheading\" name=\"subheading\"\n              >${this.subHeading}</slot\n            >`\n          : `\n          `}\n      </div>\n\n      <slot @click=\"${this.handleClick}\" class=\"list__item\" part=\"base\"> </slot>\n      <slot name=\"suffix\" part=\"suffix\" class=\"list-item__suffix\">\n      </slot>\n    `;\n  }\n\n  /* #endregion */\n}\n\nexport default NileListItem;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-list-item': NileListItem;\n  }\n}\n"]}

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

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

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

@@ -0,0 +1,39 @@
+import { fixture, expect } from '@open-wc/testing';
+import { html } from 'lit/static-html.js';
+import './nile-loader';
+describe('NileLoader', () => {
+    it('should default to size "lg" if no size is provided', async () => {
+        const el = await fixture(html `<nile-loader></nile-loader>`);
+        expect(el.size).to.equal('lg');
+    });
+    it('should apply size classes correctly', async () => {
+        const sizes = ['sm', 'md', 'lg'];
+        await sizes.forEach(async (size) => {
+            const el = await fixture(html `<nile-loader size="${size}"></nile-loader>`);
+            const loaderContainer = el.shadowRoot.querySelector('.loader__container');
+            expect(loaderContainer.classList.contains(`loader__container--${size}`)).to.be.true;
+        });
+    });
+    it('should have a default variant of "v1"', async () => {
+        const el = await fixture(html `<nile-loader></nile-loader>`);
+        const variantV1 = el.shadowRoot.querySelector('.nile-loader__v1');
+        expect(variantV1).to.exist;
+    });
+    it('should render the correct variant', async () => {
+        const el = await fixture(html `<nile-loader variant="v2"></nile-loader>`);
+        const variantV2 = el.shadowRoot.querySelector('.nile-loader__v2');
+        expect(variantV2).to.exist;
+    });
+    it('should display label if provided', async () => {
+        const el = await fixture(html `<nile-loader label="Loading..."></nile-loader>`);
+        const label = el.shadowRoot.querySelector('.loader__label');
+        expect(label).to.exist;
+        expect(label?.textContent).to.equal('Loading...');
+    });
+    it('should handle margin property', async () => {
+        const el = await fixture(html `<nile-loader margin="10px"></nile-loader>`);
+        const loaderDiv = el.shadowRoot.querySelector('.nile-loader__v1');
+        expect(loaderDiv?.getAttribute('style')).to.contain('margin: 10px');
+    });
+});
+//# sourceMappingURL=nile-loader.test.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"nile-loader.test.js","sourceRoot":"","sources":["../../../src/nile-loader/nile-loader.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAC1C,OAAO,eAAe,CAAC;AAGvB,QAAQ,CAAC,YAAY,EAAE,GAAG,EAAE;IAC1B,EAAE,CAAC,oDAAoD,EAAE,KAAK,IAAI,EAAE;QAClE,MAAM,EAAE,GAAe,MAAM,OAAO,CAAC,IAAI,CAAA,6BAA6B,CAAC,CAAC;QACxE,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IACjC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,qCAAqC,EAAE,KAAK,IAAI,EAAE;QACnD,MAAM,KAAK,GAAuB,CAAC,IAAI,EAAC,IAAI,EAAC,IAAI,CAAC,CAAA;QAClD,MAAM,KAAK,CAAC,OAAO,CAAC,KAAK,EAAC,IAAI,EAAA,EAAE;YAC5B,MAAM,EAAE,GAAe,MAAM,OAAO,CAAC,IAAI,CAAA,sBAAsB,IAAI,kBAAkB,CAAC,CAAC;YACvF,MAAM,eAAe,GAAG,EAAE,CAAC,UAAW,CAAC,aAAa,CAAC,oBAAoB,CAAE,CAAC;YAC5E,MAAM,CAAC,eAAe,CAAC,SAAS,CAAC,QAAQ,CAAC,sBAAsB,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC;QACxF,CAAC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,uCAAuC,EAAE,KAAK,IAAI,EAAE;QACrD,MAAM,EAAE,GAAe,MAAM,OAAO,CAAC,IAAI,CAAA,6BAA6B,CAAC,CAAC;QACxE,MAAM,SAAS,GAAG,EAAE,CAAC,UAAW,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;QACnE,MAAM,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;IAC7B,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,mCAAmC,EAAE,KAAK,IAAI,EAAE;QACjD,MAAM,EAAE,GAAe,MAAM,OAAO,CAAC,IAAI,CAAA,0CAA0C,CAAC,CAAC;QACrF,MAAM,SAAS,GAAG,EAAE,CAAC,UAAW,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;QACnE,MAAM,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;IAC7B,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,kCAAkC,EAAE,KAAK,IAAI,EAAE;QAChD,MAAM,EAAE,GAAe,MAAM,OAAO,CAAC,IAAI,CAAA,gDAAgD,CAAC,CAAC;QAC3F,MAAM,KAAK,GAAG,EAAE,CAAC,UAAW,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;QAC7D,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QACvB,MAAM,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;IACpD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,+BAA+B,EAAE,KAAK,IAAI,EAAE;QAC7C,MAAM,EAAE,GAAe,MAAM,OAAO,CAAC,IAAI,CAAA,2CAA2C,CAAC,CAAC;QACtF,MAAM,SAAS,GAAG,EAAE,CAAC,UAAW,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;QACnE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;IACtE,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAA","sourcesContent":["import { fixture, expect } from '@open-wc/testing';\nimport { html } from 'lit/static-html.js';\nimport './nile-loader';\nimport { NileLoader } from './nile-loader';\n\ndescribe('NileLoader', () => {\n  it('should default to size \"lg\" if no size is provided', async () => {\n    const el: NileLoader = await fixture(html`<nile-loader></nile-loader>`);\n    expect(el.size).to.equal('lg');\n  });\n\n  it('should apply size classes correctly', async () => {\n    const sizes:Array<'sm'|'md'|'lg'>=['sm','md','lg']\n    await sizes.forEach(async size=>{\n        const el: NileLoader = await fixture(html`<nile-loader size=\"${size}\"></nile-loader>`);\n        const loaderContainer = el.shadowRoot!.querySelector('.loader__container')!;\n        expect(loaderContainer.classList.contains(`loader__container--${size}`)).to.be.true;\n    })\n  });\n\n  it('should have a default variant of \"v1\"', async () => {\n    const el: NileLoader = await fixture(html`<nile-loader></nile-loader>`);\n    const variantV1 = el.shadowRoot!.querySelector('.nile-loader__v1');\n    expect(variantV1).to.exist;\n  });\n\n  it('should render the correct variant', async () => {\n    const el: NileLoader = await fixture(html`<nile-loader variant=\"v2\"></nile-loader>`);\n    const variantV2 = el.shadowRoot!.querySelector('.nile-loader__v2');\n    expect(variantV2).to.exist;\n  });\n\n  it('should display label if provided', async () => {\n    const el: NileLoader = await fixture(html`<nile-loader label=\"Loading...\"></nile-loader>`);\n    const label = el.shadowRoot!.querySelector('.loader__label');\n    expect(label).to.exist;\n    expect(label?.textContent).to.equal('Loading...');\n  });\n\n  it('should handle margin property', async () => {\n    const el: NileLoader = await fixture(html`<nile-loader margin=\"10px\"></nile-loader>`);\n    const loaderDiv = el.shadowRoot!.querySelector('.nile-loader__v1');\n    expect(loaderDiv?.getAttribute('style')).to.contain('margin: 10px');\n  });\n})"]}

package/dist/src/nile-menu/nile-menu.css.js

@@ -15,14 +15,28 @@ export const styles = css `
     background: hsl(0, 0%, 100%);
     border: solid 1px hsl(240 5.9% 90%);
     border-radius: 6px;
-    overflow: auto;
-    overscroll-behavior: none;
-    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03);
+    overflow: hidden;
+    height: 100%;
+    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08),
+      0px 8px 8px -4px rgba(16, 24, 40, 0.03);
+    /* overscroll-behavior: none; */
+    /* -ms-overflow-style: none; */
+    /* scrollbar-width: none; */
   }
-  
+
   .search__wrapper {
-    box-sizing:border-box;
+    box-sizing: border-box;
     padding: 12px 6px;
+    position: sticky;
+    z-index: 999;
+    top: 0px;
+    background: hsl(0, 0%, 100%);
+    height: 64px;
+  }
+
+  .menu__items-wrapper {
+    overflow: auto;
+    max-height: calc(100vh - 64px);
   }
 
   ::slotted(nile-divider) {

package/dist/src/nile-menu/nile-menu.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-menu.css.js","sourceRoot":"","sources":["../../../src/nile-menu/nile-menu.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;CAoBxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","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 { css } from 'lit-element';\n\n/**\n * Menu CSS\n */\nexport const styles = css`\n  :host {\n    display: block;\n    position: relative;\n    background: hsl(0, 0%, 100%);\n    border: solid 1px hsl(240 5.9% 90%);\n    border-radius: 6px;\n    overflow: auto;\n    overscroll-behavior: none;\n    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03);\n  }\n  \n  .search__wrapper {\n    box-sizing:border-box;\n    padding: 12px 6px;\n  }\n\n  ::slotted(nile-divider) {\n    --spacing: 0.5rem;\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-menu.css.js","sourceRoot":"","sources":["../../../src/nile-menu/nile-menu.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkCxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","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 { css } from 'lit-element';\n\n/**\n * Menu CSS\n */\nexport const styles = css`\n  :host {\n    display: block;\n    position: relative;\n    background: hsl(0, 0%, 100%);\n    border: solid 1px hsl(240 5.9% 90%);\n    border-radius: 6px;\n    overflow: hidden;\n    height: 100%;\n    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08),\n      0px 8px 8px -4px rgba(16, 24, 40, 0.03);\n    /* overscroll-behavior: none; */\n    /* -ms-overflow-style: none; */\n    /* scrollbar-width: none; */\n  }\n\n  .search__wrapper {\n    box-sizing: border-box;\n    padding: 12px 6px;\n    position: sticky;\n    z-index: 999;\n    top: 0px;\n    background: hsl(0, 0%, 100%);\n    height: 64px;\n  }\n\n  .menu__items-wrapper {\n    overflow: auto;\n    max-height: calc(100vh - 64px);\n  }\n\n  ::slotted(nile-divider) {\n    --spacing: 0.5rem;\n  }\n`;\n\nexport default [styles];\n"]}

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

@@ -17,6 +17,7 @@ export declare class NileMenu extends NileElement {
     searchValue: string;
     searchWidth: number;
     searchEnabled: boolean;
+    customSearch: boolean;
     showNoResults: boolean;
     noResultsMessage: string;
     defaultSlot: HTMLSlotElement;