@aquera/nile-elements 1.3.3-beta-1.3 → 1.3.3-beta-1.5

package/dist/src/nile-form-help-text/nile-form-help-text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-form-help-text.js","sourceRoot":"","sources":["../../../src/nile-form-help-text/nile-form-help-text.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAAC,UAAU,EAAE,IAAI,EAAkC,OAAO,EAAiB,MAAM,KAAK,CAAC;AAC9F,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAC,MAAM,EAAC,MAAM,2BAA2B,CAAC;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD;;;;;GAKG;AAEI,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,UAAU;IAAzC;;QASwC,eAAU,GAAY,KAAK,CAAC;QAEhE,eAAU,GAAY,KAAK,CAAC;IAgFvC,CAAC;IA1FC;;;OAGG;IACI,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IAUD,gBAAgB;IAEhB,qBAAqB;IAEX,YAAY,CAAC,kBAAkC;QACvD,IAAI,CAAC,cAAc,GAAC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;IAClE,CAAC;IAED,oBAAoB;QAClB,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE,CAAC;IACnC,CAAC;IAED;;;OAGG;IACI,MAAM;QACX,MAAM,QAAQ,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,sDAAsD,CAAC,CAAC,CAAC,0DAA0D,CAAC;QAEvJ,OAAO,IAAI,CAAA;;eAEA,QAAQ,CAAC;YAChB,qBAAqB,EAAC,IAAI;YAC1B,+BAA+B,EAAC,IAAI,CAAC,UAAU;SAC9C,CAAC;;;;iBAIO,QAAQ,CAAC;YAChB,kBAAkB,EAAC,IAAI;YACvB,4BAA4B,EAAC,IAAI,CAAC,UAAU;SAC3C,CAAC;;6BAEiB,IAAI,CAAC,wBAAwB;;QAElD,IAAI,CAAC,UAAU,CAAA,CAAC,CAAA,IAAI,CAAA;;;;mBAIT,IAAI,CAAC,cAAc;WAC3B,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW;mEACa,QAAQ;;OAEpE,CAAA,CAAC,CAAA,OAAO;;GAEZ,CAAC;IACF,CAAC;IAED,cAAc;QACZ,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC;IACrC,CAAC;IAED,wBAAwB;QACtB,IAAG,CAAC,IAAI,CAAC,aAAa;YAAE,OAAO;QAC/B,IAAI,CAAC,UAAU,GAAC,IAAI,CAAC,aAAa,CAAC,WAAW,GAAC,IAAI,CAAC,aAAa,CAAC,WAAW,CAAA;IAC/E,CAAC;IAED;;;OAGG;IACH,kBAAkB,CAAC,OAAmB;QAEpC,MAAM,cAAc,GAAG,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;YAClD,KAAK,IAAI,KAAK,IAAI,OAAO,EAAE,CAAC;gBAC1B,MAAM,QAAQ,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC;gBACzC,IAAI,QAAQ;oBAAE,IAAI,CAAC,wBAAwB,EAAE,CAAC;YAChD,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,cAAc,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;QAEhC,OAAO,cAAc,CAAC,CAAC,mDAAmD;IAC5E,CAAC;CACF,CAAA;AAlF8C;IAA5C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAG,CAAC;oDAA6B;AAEhE;IAAR,KAAK,EAAE;oDAA6B;AAET;IAA3B,KAAK,CAAC,mBAAmB,CAAC;uDAA+B;AAb/C,gBAAgB;IAD5B,aAAa,CAAC,qBAAqB,CAAC;GACxB,gBAAgB,CA2F5B;;AAED,eAAe,gBAAgB,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 {LitElement, html, CSSResultArray, TemplateResult, nothing, PropertyValues} from 'lit';\nimport { customElement, query, property, state } from 'lit/decorators.js';\nimport {styles} from './nile-form-help-text.css';\nimport { classMap } from 'lit/directives/class-map.js';\n\n/**\n * Nile icon component.\n *\n * @tag nile-form-help-text\n *\n */\n@customElement('nile-form-help-text')\nexport class NileFormHelpText extends LitElement {\n  /**\n   * The styles for FormHelpText\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  @property({ type: Boolean, reflect: true  }) isExpanded: boolean = false;\n\n  @state() showButton: boolean = false;\n\n  @query('.help__text__full') textContainer:HTMLSpanElement;\n\n  private resizeObserver:ResizeObserver;\n\n  /* #endregion */\n\n  /* #region Methods */\n\n  protected firstUpdated(_changedProperties: PropertyValues): void {\n    this.resizeObserver=this.observeWidthChange(this.textContainer);\n  }\n\n  disconnectedCallback(): void {\n    this.resizeObserver.disconnect();\n  }\n\n  /**\n   * Render method\n   * @slot This is a slot test\n   */\n  public render(): TemplateResult {\n    const iconName = this.isExpanded ? 'var(--nile-icon-arrow-up, var(--ng-icon-chevron-up))' : 'var(--nile-icon-arrow-down, var(--ng-icon-chevron-down))';\n\n    return html`\n    <div \n      class=\"${classMap({\n        'nile-form-help-text':true,\n        \"nile-form-help-text--expanded\":this.isExpanded\n        })}\" \n      part=\"container\"\n    >\n      <span\n        class=\"${classMap({\n          \"help__text__full\":true,\n          \"help__text__full--expanded\":this.isExpanded\n          })}\"\n        >\n        <slot @slotchange=\"${this.decideToToggleShowButton}\"></slot>\n      </span>\n      ${this.showButton?html`\n        <span\n          class=\"nile-form-help-text__more-button\"\n          part=\"toggle-button\"\n          @click=${this.toggleExpanded}\n        >${this.isExpanded ? 'View Less' : 'View More'}\n          <nile-icon color=\"#005EA6\" part=\"icon\" size=\"14\" name=\"${iconName}\" method=\"var(--nile-svg-method-fill, var(--ng-svg-method-stroke))\"></nile-icon>\n        </span>\n      `:nothing}\n    </div>\n  `;\n  }\n\n  toggleExpanded() {\n    this.isExpanded = !this.isExpanded;\n  }\n  \n  decideToToggleShowButton(){\n    if(!this.textContainer) return;\n    this.showButton=this.textContainer.clientWidth<this.textContainer.scrollWidth\n  }\n\n  /**\n   * Logs whenever the width of an element changes.\n   * @param {HTMLElement} element - The element to observe for width changes.\n   */\n  observeWidthChange(element:HTMLElement) {\n\n    const resizeObserver = new ResizeObserver(entries => {\n      for (let entry of entries) {\n        const newWidth = entry.contentRect.width;\n        if (newWidth) this.decideToToggleShowButton();\n      }\n    });\n\n    resizeObserver.observe(element);\n\n    return resizeObserver; // Return observer to allow disconnection if needed\n  }\n}\n\nexport default NileFormHelpText;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-form-help-text': NileFormHelpText;\n  }\n}"]}

package/dist/src/nile-form-help-text/nile-form-help-text.test.js

@@ -0,0 +1,88 @@
+import { fixture, expect, html, elementUpdated } from '@open-wc/testing';
+import './nile-form-help-text';
+import { NileFormHelpText } from './nile-form-help-text';
+const wait = (ms = 50000) => new Promise(resolve => setTimeout(resolve, ms));
+describe('NileFormHelpText', () => {
+    it('should render with default properties', async () => {
+        const el = await fixture(html `<nile-form-help-text>This is a short text</nile-form-help-text>`);
+        expect(el).to.be.instanceOf(NileFormHelpText);
+        expect(el.isExpanded).to.be.false;
+        // Check if text content matches
+        const textContent = el?.textContent?.trim();
+        expect(textContent).to.equal('This is a short text');
+    });
+    it('should not show "View More" button if the text fits within the container', async () => {
+        const el = await fixture(html `<nile-form-help-text>This is a short text</nile-form-help-text>`);
+        await elementUpdated(el);
+        const moreButton = el.shadowRoot?.querySelector('.nile-form-help-text__more-button');
+        expect(moreButton).to.be.null;
+        expect(el.showButton).to.be.false;
+    });
+    it('should show "View More" button if the text overflows the container', async () => {
+        const longText = 'This is a very long help text that exceeds the container width and should show a "View More" button.';
+        const el = await fixture(html `<nile-form-help-text>${longText}</nile-form-help-text>`);
+        // Simulate overflow
+        const textContainer = el.shadowRoot?.querySelector('.help__text__full');
+        Object.defineProperty(textContainer, 'scrollWidth', { value: 300 });
+        Object.defineProperty(textContainer, 'clientWidth', { value: 200 });
+        el.decideToToggleShowButton();
+        await elementUpdated(el);
+        const moreButton = el.shadowRoot?.querySelector('.nile-form-help-text__more-button');
+        expect(moreButton).to.exist;
+        expect(el.showButton).to.be.true;
+    });
+    it('should expand to show full text when "View More" is clicked', async () => {
+        const longText = 'This is a very long help text that exceeds the container width and should show a "View More" button.';
+        const el = await fixture(html `<nile-form-help-text>${longText}</nile-form-help-text>`);
+        // Simulate overflow
+        const textContainer = el.shadowRoot?.querySelector('.help__text__full');
+        Object.defineProperty(textContainer, 'scrollWidth', { value: 300 });
+        Object.defineProperty(textContainer, 'clientWidth', { value: 200 });
+        el.decideToToggleShowButton();
+        await elementUpdated(el);
+        // Click "View More"
+        const moreButton = el.shadowRoot?.querySelector('.nile-form-help-text__more-button');
+        moreButton?.click();
+        await elementUpdated(el);
+        expect(el.isExpanded).to.be.true;
+        expect(textContainer).to.have.class('help__text__full--expanded');
+        expect(moreButton?.textContent).to.include('View Less');
+    });
+    it('should collapse back to truncated text when "View Less" is clicked', async () => {
+        const longText = 'This is a very long help text that exceeds the container width and should show a "View More" button.';
+        const el = await fixture(html `<nile-form-help-text>${longText}</nile-form-help-text>`);
+        // Simulate overflow
+        const textContainer = el.shadowRoot?.querySelector('.help__text__full');
+        Object.defineProperty(textContainer, 'scrollWidth', { value: 300 });
+        Object.defineProperty(textContainer, 'clientWidth', { value: 200 });
+        el.decideToToggleShowButton();
+        await elementUpdated(el);
+        // Expand and then collapse
+        const moreButton = el.shadowRoot?.querySelector('.nile-form-help-text__more-button');
+        moreButton?.click();
+        await elementUpdated(el);
+        moreButton?.click(); // Collapse
+        await elementUpdated(el);
+        expect(el.isExpanded).to.be.false;
+        expect(textContainer).not.to.have.class('help__text__full--expanded');
+        expect(moreButton?.textContent).to.include('View More');
+    });
+    // it('should dynamically adjust "View More" visibility on text change', async () => {
+    //   const el = await fixture<NileFormHelpText>(html`<nile-form-help-text>Initial text</nile-form-help-text>`);
+    //   await elementUpdated(el);
+    //   const textContainer = el.shadowRoot?.querySelector('.help__text__full') as HTMLSpanElement;
+    //   Object.defineProperty(textContainer, 'scrollWidth', { value: 300 });
+    //   Object.defineProperty(textContainer, 'clientWidth', { value: 200 });
+    //   el.decideToToggleShowButton();
+    //   await elementUpdated(el);
+    //   expect(el.showButton).to.be.true;
+    //   // Change slot content to short text
+    //   textContainer.textContent = 'Short text';
+    //   Object.defineProperty(textContainer, 'scrollWidth', { value: 100 });
+    //   Object.defineProperty(textContainer, 'clientWidth', { value: 200 });
+    //   el.decideToToggleShowButton();
+    //   await elementUpdated(el);
+    //   expect(el.showButton).to.be.false;
+    // });
+});
+//# sourceMappingURL=nile-form-help-text.test.js.map

package/dist/src/nile-form-help-text/nile-form-help-text.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-form-help-text.test.js","sourceRoot":"","sources":["../../../src/nile-form-help-text/nile-form-help-text.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { fixture, expect, html, elementUpdated } from '@open-wc/testing';\nimport './nile-form-help-text';\nimport { NileFormHelpText } from './nile-form-help-text';\n\nconst wait = (ms: number = 50000) => new Promise(resolve => setTimeout(resolve, ms))\n\n\ndescribe('NileFormHelpText', () => {\n  it('should render with default properties', async () => {\n    const el = await fixture<NileFormHelpText>(html`<nile-form-help-text>This is a short text</nile-form-help-text>`);\n    expect(el).to.be.instanceOf(NileFormHelpText);\n    expect(el.isExpanded).to.be.false;\n\n    // Check if text content matches\n    const textContent = el?.textContent?.trim();\n    expect(textContent).to.equal('This is a short text');\n  });\n\n  it('should not show \"View More\" button if the text fits within the container', async () => {\n    const el = await fixture<NileFormHelpText>(html`<nile-form-help-text>This is a short text</nile-form-help-text>`);\n    await elementUpdated(el);\n\n    const moreButton = el.shadowRoot?.querySelector('.nile-form-help-text__more-button');\n    expect(moreButton).to.be.null;\n    expect(el.showButton).to.be.false;\n  });\n\n  it('should show \"View More\" button if the text overflows the container', async () => {\n    const longText = 'This is a very long help text that exceeds the container width and should show a \"View More\" button.';\n    const el = await fixture<NileFormHelpText>(html`<nile-form-help-text>${longText}</nile-form-help-text>`);\n    \n    // Simulate overflow\n    const textContainer = el.shadowRoot?.querySelector('.help__text__full') as HTMLSpanElement;\n    Object.defineProperty(textContainer, 'scrollWidth', { value: 300 });\n    Object.defineProperty(textContainer, 'clientWidth', { value: 200 });\n    el.decideToToggleShowButton();\n    await elementUpdated(el);\n\n    const moreButton = el.shadowRoot?.querySelector('.nile-form-help-text__more-button');\n    expect(moreButton).to.exist;\n    expect(el.showButton).to.be.true;\n  });\n\n  it('should expand to show full text when \"View More\" is clicked', async () => {\n    const longText = 'This is a very long help text that exceeds the container width and should show a \"View More\" button.';\n    const el = await fixture<NileFormHelpText>(html`<nile-form-help-text>${longText}</nile-form-help-text>`);\n\n    // Simulate overflow\n    const textContainer = el.shadowRoot?.querySelector('.help__text__full') as HTMLSpanElement;\n    Object.defineProperty(textContainer, 'scrollWidth', { value: 300 });\n    Object.defineProperty(textContainer, 'clientWidth', { value: 200 });\n    el.decideToToggleShowButton();\n    await elementUpdated(el);\n\n    // Click \"View More\"\n    const moreButton = el.shadowRoot?.querySelector<HTMLElement>('.nile-form-help-text__more-button');\n    moreButton?.click();\n    await elementUpdated(el);\n\n    expect(el.isExpanded).to.be.true;\n    expect(textContainer).to.have.class('help__text__full--expanded');\n    expect(moreButton?.textContent).to.include('View Less');\n  });\n\n  it('should collapse back to truncated text when \"View Less\" is clicked', async () => {\n    const longText = 'This is a very long help text that exceeds the container width and should show a \"View More\" button.';\n    const el = await fixture<NileFormHelpText>(html`<nile-form-help-text>${longText}</nile-form-help-text>`);\n\n    // Simulate overflow\n    const textContainer = el.shadowRoot?.querySelector('.help__text__full') as HTMLSpanElement;\n    Object.defineProperty(textContainer, 'scrollWidth', { value: 300 });\n    Object.defineProperty(textContainer, 'clientWidth', { value: 200 });\n    el.decideToToggleShowButton();\n    await elementUpdated(el);\n\n    // Expand and then collapse\n    const moreButton = el.shadowRoot?.querySelector<HTMLElement>('.nile-form-help-text__more-button');\n    moreButton?.click();\n    await elementUpdated(el);\n\n    moreButton?.click(); // Collapse\n    await elementUpdated(el);\n\n    expect(el.isExpanded).to.be.false;\n    expect(textContainer).not.to.have.class('help__text__full--expanded');\n    expect(moreButton?.textContent).to.include('View More');\n  });\n\n  // it('should dynamically adjust \"View More\" visibility on text change', async () => {\n  //   const el = await fixture<NileFormHelpText>(html`<nile-form-help-text>Initial text</nile-form-help-text>`);\n  //   await elementUpdated(el);\n\n  //   const textContainer = el.shadowRoot?.querySelector('.help__text__full') as HTMLSpanElement;\n  //   Object.defineProperty(textContainer, 'scrollWidth', { value: 300 });\n  //   Object.defineProperty(textContainer, 'clientWidth', { value: 200 });\n  //   el.decideToToggleShowButton();\n  //   await elementUpdated(el);\n\n  //   expect(el.showButton).to.be.true;\n\n  //   // Change slot content to short text\n  //   textContainer.textContent = 'Short text';\n  //   Object.defineProperty(textContainer, 'scrollWidth', { value: 100 });\n  //   Object.defineProperty(textContainer, 'clientWidth', { value: 200 });\n  //   el.decideToToggleShowButton();\n  //   await elementUpdated(el);\n\n  //   expect(el.showButton).to.be.false;\n  // });\n});\n"]}

package/dist/src/nile-format-date/index.js

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

package/dist/src/nile-format-date/index.js.map

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

package/dist/src/nile-format-date/nile-format-date.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';
+/**
+ * FormatDate CSS
+ */
+export const styles = css `
+	:host {
+	-webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));
+    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));
+    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));
+
+	}
+`;
+export default [styles];
+//# sourceMappingURL=nile-format-date.css.js.map

package/dist/src/nile-format-date/nile-format-date.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-format-date.css.js","sourceRoot":"","sources":["../../../src/nile-format-date/nile-format-date.css.ts"],"names":[],"mappings":"AAAA;;;;;EAKE;AAEF,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AAExB;;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';\n\n/**\n * FormatDate CSS\n */\nexport const styles = css`\n\t:host {\n\t-webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n\n\t}\n`;\n\nexport default [styles];"]}

package/dist/src/nile-format-date/nile-format-date.js

@@ -0,0 +1,129 @@
+/**
+ * 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';
+import { customElement, property } from 'lit/decorators.js';
+import { styles } from './nile-format-date.css';
+import NileElement from '../internal/nile-element';
+/**
+ * Nile format-date component.
+ *
+ * @tag nile-format-date
+ *
+ */
+let NileFormatDate = class NileFormatDate extends NileElement {
+    constructor() {
+        super(...arguments);
+        /**
+         * The date/time to format. If not set, the current date and time will be used. When passing a string, it's strongly
+         * recommended to use the ISO 8601 format to ensure timezones are handled correctly. To convert a date to this format
+         * in JavaScript, use [`date.toISOString()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toISOString).
+         */
+        this.date = new Date();
+        /** The format for displaying the hour. */
+        this.hourFormat = 'auto';
+        /** The separator for the date format. */
+        this.dateSeparator = '-';
+    }
+    /**
+     * The styles for nile-format-date
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    static get styles() {
+        return [styles];
+    }
+    formatDate(dateToFormat, options) {
+        dateToFormat = new Date(dateToFormat);
+        const formatter = new Intl.DateTimeFormat('en-GB', options);
+        const parts = formatter.formatToParts(dateToFormat);
+        const formattedDate = parts.map(({ type, value }) => {
+            if (type === 'day' || type === 'month' || type === 'year') {
+                return value;
+            }
+            if (type === 'literal' && value === '/') {
+                return this.dateSeparator;
+            }
+            return value;
+        }).join('');
+        return formattedDate;
+    }
+    // formatDate(dateToFormat: Date | string, options?: Intl.DateTimeFormatOptions): string {
+    //   dateToFormat = new Date(dateToFormat);
+    //   return new Intl.DateTimeFormat('en-GB', options).format(dateToFormat);
+    // }
+    render() {
+        const date = new Date(this.date);
+        const hour12 = this.hourFormat === 'auto' ? undefined : this.hourFormat === '12';
+        // Check for an invalid date
+        if (isNaN(date.getMilliseconds())) {
+            return undefined;
+        }
+        return html `
+      <time datetime=${date.toISOString()}>
+        ${this.formatDate(date, {
+            weekday: this.weekday,
+            era: this.era,
+            year: this.year,
+            month: this.month,
+            day: this.day,
+            hour: this.hour,
+            minute: this.minute,
+            second: this.second,
+            timeZoneName: this.timeZoneName,
+            timeZone: this.timeZone,
+            hour12: hour12,
+        })}
+      </time>
+    `;
+    }
+};
+__decorate([
+    property()
+], NileFormatDate.prototype, "date", void 0);
+__decorate([
+    property()
+], NileFormatDate.prototype, "weekday", void 0);
+__decorate([
+    property()
+], NileFormatDate.prototype, "era", void 0);
+__decorate([
+    property()
+], NileFormatDate.prototype, "year", void 0);
+__decorate([
+    property()
+], NileFormatDate.prototype, "month", void 0);
+__decorate([
+    property()
+], NileFormatDate.prototype, "day", void 0);
+__decorate([
+    property()
+], NileFormatDate.prototype, "hour", void 0);
+__decorate([
+    property()
+], NileFormatDate.prototype, "minute", void 0);
+__decorate([
+    property()
+], NileFormatDate.prototype, "second", void 0);
+__decorate([
+    property({ attribute: 'time-zone-name' })
+], NileFormatDate.prototype, "timeZoneName", void 0);
+__decorate([
+    property({ attribute: 'time-zone' })
+], NileFormatDate.prototype, "timeZone", void 0);
+__decorate([
+    property({ attribute: 'hour-format' })
+], NileFormatDate.prototype, "hourFormat", void 0);
+__decorate([
+    property({ attribute: 'date-separator' })
+], NileFormatDate.prototype, "dateSeparator", void 0);
+NileFormatDate = __decorate([
+    customElement('nile-format-date')
+], NileFormatDate);
+export { NileFormatDate };
+/* #endregion */
+export default NileFormatDate;
+//# sourceMappingURL=nile-format-date.js.map

package/dist/src/nile-format-date/nile-format-date.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-format-date.js","sourceRoot":"","sources":["../../../src/nile-format-date/nile-format-date.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, CSSResultArray, TemplateResult} from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport {styles} from './nile-format-date.css';\nimport NileElement from '../internal/nile-element';\n\n\n/**\n * Nile format-date component.\n *\n * @tag nile-format-date\n *\n */\n@customElement('nile-format-date')\nexport class NileFormatDate extends NileElement {\n  /**\n   * The styles for nile-format-date\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  /**\n   * The date/time to format. If not set, the current date and time will be used. When passing a string, it's strongly\n   * recommended to use the ISO 8601 format to ensure timezones are handled correctly. To convert a date to this format\n   * in JavaScript, use [`date.toISOString()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toISOString).\n   */\n  @property() date: Date | string = new Date();\n\n  /** The format for displaying the weekday. */\n  @property() weekday: 'narrow' | 'short' | 'long';\n\n  /** The format for displaying the era. */\n  @property() era: 'narrow' | 'short' | 'long';\n\n  /** The format for displaying the year. */\n  @property() year: 'numeric' | '2-digit';\n\n  /** The format for displaying the month. */\n  @property() month: 'numeric' | '2-digit' | 'narrow' | 'short' | 'long';\n\n  /** The format for displaying the day. */\n  @property() day: 'numeric' | '2-digit';\n\n  /** The format for displaying the hour. */\n  @property() hour: 'numeric' | '2-digit';\n\n  /** The format for displaying the minute. */\n  @property() minute: 'numeric' | '2-digit';\n\n  /** The format for displaying the second. */\n  @property() second: 'numeric' | '2-digit';\n\n  /** The format for displaying the time. */\n  @property({ attribute: 'time-zone-name' }) timeZoneName: 'short' | 'long';\n\n  /** The time zone to express the time in. */\n  @property({ attribute: 'time-zone' }) timeZone: string;\n\n  /** The format for displaying the hour. */\n  @property({ attribute: 'hour-format' }) hourFormat: 'auto' | '12' | '24' =\n    'auto';\n\n  /** The separator for the date format. */\n  @property({ attribute: 'date-separator' }) dateSeparator: '-' | '/' = '-';\n\n  formatDate(dateToFormat: Date | string, options?: Intl.DateTimeFormatOptions): string {\n    dateToFormat = new Date(dateToFormat);\n    const formatter = new Intl.DateTimeFormat('en-GB', options);\n    const parts = formatter.formatToParts(dateToFormat);\n    const formattedDate = parts.map(({ type, value }) => {\n      if (type === 'day' || type === 'month' || type === 'year') {\n        return value;\n      }\n      if (type === 'literal' && value === '/') {\n        return this.dateSeparator;\n      }\n      return value;\n    }).join('');\n    return formattedDate;\n  }\n\n  // formatDate(dateToFormat: Date | string, options?: Intl.DateTimeFormatOptions): string {\n  //   dateToFormat = new Date(dateToFormat);\n  //   return new Intl.DateTimeFormat('en-GB', options).format(dateToFormat);\n  // }\n\n\n  render() {\n    const date = new Date(this.date);\n    const hour12 =\n      this.hourFormat === 'auto' ? undefined : this.hourFormat === '12';\n\n    // Check for an invalid date\n    if (isNaN(date.getMilliseconds())) {\n      return undefined;\n    }\n\n    return html`\n      <time datetime=${date.toISOString()}>\n        ${this.formatDate(date, {\n          weekday: this.weekday,\n          era: this.era,\n          year: this.year,\n          month: this.month,\n          day: this.day,\n          hour: this.hour,\n          minute: this.minute,\n          second: this.second,\n          timeZoneName: this.timeZoneName,\n          timeZone: this.timeZone,\n          hour12: hour12,\n        })}\n      </time>\n    `;\n  }\n}\n\t/* #endregion */\n\nexport default NileFormatDate;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-format-date': NileFormatDate;\n  }\n}\n"]}

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

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

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

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

package/dist/src/nile-grid/nile-grid-body/index.js

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

package/dist/src/nile-grid/nile-grid-body/index.js.map

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

package/dist/src/nile-grid/nile-grid-body/nile-grid-body.css.js

@@ -0,0 +1,18 @@
+/**
+ * Copyright Aquera Inc 2025
+ *
+ * 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';
+/**
+ * GridBody CSS
+ */
+export const styles = css `
+  :host {
+    box-sizing: border-box;
+    background-color: var(--nile-colors-white-base);
+  }
+`;
+export default [styles];
+//# sourceMappingURL=nile-grid-body.css.js.map

package/dist/src/nile-grid/nile-grid-body/nile-grid-body.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-grid-body.css.js","sourceRoot":"","sources":["../../../../src/nile-grid/nile-grid-body/nile-grid-body.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;CAKxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2025\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';\n\n/**\n * GridBody CSS\n */\nexport const styles = css`\n  :host {\n    box-sizing: border-box;\n    background-color: var(--nile-colors-white-base);\n  }\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-grid/nile-grid-body/nile-grid-body.js

@@ -0,0 +1,43 @@
+/**
+ * Copyright Aquera Inc 2025
+ *
+ * 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';
+import { customElement } from 'lit/decorators.js';
+import { styles } from './nile-grid-body.css';
+import NileElement from '../../internal/nile-element';
+/**
+ * Nile grid-body component.
+ *
+ * @tag nile-grid-body
+ *
+ */
+let NileGridBody = class NileGridBody extends NileElement {
+    /**
+     * The styles for nile-grid-body
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    static get styles() {
+        return [styles];
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.setAttribute('role', 'rowgroup');
+    }
+    render() {
+        return html `
+      <div part="grid-body-base">
+        <slot></slot>
+      </div>
+    `;
+    }
+};
+NileGridBody = __decorate([
+    customElement('nile-grid-body')
+], NileGridBody);
+export { NileGridBody };
+export default NileGridBody;
+//# sourceMappingURL=nile-grid-body.js.map

package/dist/src/nile-grid/nile-grid-body/nile-grid-body.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-grid-body.js","sourceRoot":"","sources":["../../../../src/nile-grid/nile-grid-body/nile-grid-body.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAAE,IAAI,EAAkC,MAAM,KAAK,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,WAAW,MAAM,6BAA6B,CAAC;AAEtD;;;;;GAKG;AAEI,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,WAAW;IAC3C;;;OAGG;IACI,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IACxC,CAAC;IAEM,MAAM;QACX,OAAO,IAAI,CAAA;;;;KAIV,CAAC;IACJ,CAAC;CAGF,CAAA;AAvBY,YAAY;IADxB,aAAa,CAAC,gBAAgB,CAAC;GACnB,YAAY,CAuBxB;;AAED,eAAe,YAAY,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2025\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 { html, CSSResultArray, TemplateResult } from 'lit';\nimport { customElement } from 'lit/decorators.js';\nimport { styles } from './nile-grid-body.css';\nimport NileElement from '../../internal/nile-element';\n\n/**\n * Nile grid-body component.\n *\n * @tag nile-grid-body\n *\n */\n@customElement('nile-grid-body')\nexport class NileGridBody extends NileElement {\n  /**\n   * The styles for nile-grid-body\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  connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'rowgroup');\n  }\n\n  public render(): TemplateResult {\n    return html`\n      <div part=\"grid-body-base\">\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  /* #endregion */\n}\n\nexport default NileGridBody;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-grid-body': NileGridBody;\n  }\n}\n"]}

package/dist/src/nile-grid/nile-grid-cell-item/index.js

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

package/dist/src/nile-grid/nile-grid-cell-item/index.js.map

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

package/dist/src/nile-grid/nile-grid-cell-item/nile-grid-cell-item.css.js

@@ -0,0 +1,86 @@
+/**
+ * Copyright Aquera Inc 2025
+ *
+ * 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';
+/**
+ * Grid Cell Item CSS
+ */
+export const styles = css `
+  :host {
+    --padding: var(--nile-spacing-xl) var(--nile-spacing-10px);
+    --height: 44px;
+    box-sizing: border-box;
+    min-width: 0;
+    white-space: nowrap;
+    width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    padding: var(--padding);
+    min-height: var(--height);
+    height: auto;
+    font-size: 14px;
+    font-weight: 400;
+    font-family: var(--nile-font-family-sans-serif);
+  }
+
+  .cell-item-base {
+    width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  ::slotted(*) {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  :host(:last-child) .resize-handle {
+    border-right: none;
+    display: none;
+  }
+
+  .resize-handle {
+    position: absolute;
+    top: 0;
+    right: 0;
+    height: 100%;
+    cursor: ew-resize;
+    touch-action: none;
+    z-index: 1;
+    width: 2px;
+    border-right: 1px solid var(--nile-colors-neutral-400);
+    display: block;
+  }
+
+  :host(.shadow-right) {
+    box-shadow: var(--nile-box-shadow-14);
+    background-color: var(---nile-colors-white-base);
+  }
+
+  :host(.shadow-left) {
+    box-shadow: var(--nile-box-shadow-14);
+    background-color: var(---nile-colors-white-base);
+  }
+
+  :host-context(nile-grid-row[hover]:hover),
+  :host-context(nile-grid-row[hover]:hover):host([data-sticky]) {
+    background-color: var(--nile-colors-neutral-100);
+  }
+
+  :host-context(nile-grid-row[selected]),
+  :host-context(nile-grid-row[selected]):host([data-sticky]) {
+    background-color: var(--nile-colors-primary-100) !important;
+  }
+
+  :host(.cell-rowspan) {
+    position: absolute;
+    z-index: 1;
+    background-color: var(--nile-colors-white-base);
+  }
+`;
+export default [styles];
+//# sourceMappingURL=nile-grid-cell-item.css.js.map

package/dist/src/nile-grid/nile-grid-cell-item/nile-grid-cell-item.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-grid-cell-item.css.js","sourceRoot":"","sources":["../../../../src/nile-grid/nile-grid-cell-item/nile-grid-cell-item.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyExB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2025\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';\n\n/**\n * Grid Cell Item CSS\n */\nexport const styles = css`\n  :host {\n    --padding: var(--nile-spacing-xl) var(--nile-spacing-10px);\n    --height: 44px;\n    box-sizing: border-box;\n    min-width: 0;\n    white-space: nowrap;\n    width: 100%;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    padding: var(--padding);\n    min-height: var(--height);\n    height: auto;\n    font-size: 14px;\n    font-weight: 400;\n    font-family: var(--nile-font-family-sans-serif);\n  }\n\n  .cell-item-base {\n    width: 100%;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  ::slotted(*) {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  :host(:last-child) .resize-handle {\n    border-right: none;\n    display: none;\n  }\n\n  .resize-handle {\n    position: absolute;\n    top: 0;\n    right: 0;\n    height: 100%;\n    cursor: ew-resize;\n    touch-action: none;\n    z-index: 1;\n    width: 2px;\n    border-right: 1px solid var(--nile-colors-neutral-400);\n    display: block;\n  }\n\n  :host(.shadow-right) {\n    box-shadow: var(--nile-box-shadow-14);\n    background-color: var(---nile-colors-white-base);\n  }\n\n  :host(.shadow-left) {\n    box-shadow: var(--nile-box-shadow-14);\n    background-color: var(---nile-colors-white-base);\n  }\n\n  :host-context(nile-grid-row[hover]:hover),\n  :host-context(nile-grid-row[hover]:hover):host([data-sticky]) {\n    background-color: var(--nile-colors-neutral-100);\n  }\n\n  :host-context(nile-grid-row[selected]),\n  :host-context(nile-grid-row[selected]):host([data-sticky]) {\n    background-color: var(--nile-colors-primary-100) !important;\n  }\n\n  :host(.cell-rowspan) {\n    position: absolute;\n    z-index: 1;\n    background-color: var(--nile-colors-white-base);\n  }\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-grid/nile-grid-cell-item/nile-grid-cell-item.js

@@ -0,0 +1,83 @@
+/**
+ * Copyright Aquera Inc 2025
+ *
+ * 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';
+import { customElement, property } from 'lit/decorators.js';
+import { styles } from './nile-grid-cell-item.css';
+import NileElement from '../../internal/nile-element';
+import { initCellResize, cellResizeMove, cellResizeDone, } from './nile-grid-cell-item.utils';
+/**
+ * Nile grid-cell component.
+ *
+ * @tag nile-grid-cell-item
+ *
+ */
+let NileGridCellItem = class NileGridCellItem extends NileElement {
+    constructor() {
+        super(...arguments);
+        this.colspan = 1;
+        this.rowspan = 1;
+        this.resizable = false;
+        this.onHandlePointerDown = (ev) => {
+            const el = this;
+            const downXRef = { value: 0 };
+            const startWRef = { value: 0 };
+            const result = initCellResize(el, ev, downXRef, startWRef);
+            if (!result)
+                return;
+            const { target, col } = result;
+            const move = (e) => cellResizeMove(el, col, startWRef.value, downXRef.value, e);
+            const done = () => cellResizeDone(el, ev, target, move);
+            target.addEventListener('pointermove', move);
+            target.addEventListener('pointerup', done, { once: true });
+            target.addEventListener('pointercancel', done, { once: true });
+        };
+        /* #endregion */
+    }
+    /**
+     * The styles for nile-grid-cell-item
+     * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
+     */
+    static get styles() {
+        return [styles];
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.setAttribute('role', 'cell');
+    }
+    render() {
+        return html `
+      <div class="cell-item-base" part="grid-cell-item-base">
+        <slot></slot>
+        ${this.resizable
+            ? html `
+              <div
+                aria-hidden="false"
+                class="resize-handle"
+                @pointerdown=${this.onHandlePointerDown}
+              ></div>
+            `
+            : null}
+      </div>
+    `;
+    }
+};
+__decorate([
+    property({ type: Number, reflect: true, attribute: true })
+], NileGridCellItem.prototype, "colspan", void 0);
+__decorate([
+    property({ type: Number, reflect: true, attribute: true })
+], NileGridCellItem.prototype, "rowspan", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileGridCellItem.prototype, "resizable", void 0);
+NileGridCellItem = __decorate([
+    customElement('nile-grid-cell-item')
+], NileGridCellItem);
+export { NileGridCellItem };
+export default NileGridCellItem;
+//# sourceMappingURL=nile-grid-cell-item.js.map

package/dist/src/nile-grid/nile-grid-cell-item/nile-grid-cell-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-grid-cell-item.js","sourceRoot":"","sources":["../../../../src/nile-grid/nile-grid-cell-item/nile-grid-cell-item.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAAE,IAAI,EAAkC,MAAM,KAAK,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,WAAW,MAAM,6BAA6B,CAAC;AACtD,OAAO,EACL,cAAc,EACd,cAAc,EACd,cAAc,GACf,MAAM,6BAA6B,CAAC;AAErC;;;;;GAKG;AAEI,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,WAAW;IAA1C;;QASuD,YAAO,GAAG,CAAC,CAAC;QACZ,YAAO,GAAG,CAAC,CAAC;QACX,cAAS,GAAG,KAAK,CAAC;QAOvE,wBAAmB,GAAG,CAAC,EAAgB,EAAE,EAAE;YAEjD,MAAM,EAAE,GAAG,IAAmB,CAAC;YAE/B,MAAM,QAAQ,GAAG,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC;YAC9B,MAAM,SAAS,GAAG,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC;YAE/B,MAAM,MAAM,GAAG,cAAc,CAAC,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;YAC3D,IAAI,CAAC,MAAM;gBAAE,OAAO;YAEpB,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,MAAM,CAAC;YAC/B,MAAM,IAAI,GAAG,CAAC,CAAe,EAAE,EAAE,CAAC,cAAc,CAAC,EAAE,EAAE,GAAG,EAAE,SAAS,CAAC,KAAK,EAAE,QAAQ,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;YAC9F,MAAM,IAAI,GAAG,GAAG,EAAE,CAAC,cAAc,CAAC,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,CAAC;YAExD,MAAM,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC;YAC7C,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;YAC3D,MAAM,CAAC,gBAAgB,CAAC,eAAe,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;QACjE,CAAC,CAAC;QAmBF,gBAAgB;IAClB,CAAC;IAtDC;;;OAGG;IACI,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IAMD,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACpC,CAAC;IAqBM,MAAM;QACX,OAAO,IAAI,CAAA;;;UAGL,IAAI,CAAC,SAAS;YACd,CAAC,CAAC,IAAI,CAAA;;;;+BAIe,IAAI,CAAC,mBAAmB;;aAE1C;YACH,CAAC,CAAC,IAAI;;KAEX,CAAC;IACJ,CAAC;CAGF,CAAA;AA9C6D;IAA3D,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;iDAAa;AACZ;IAA3D,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;iDAAa;AACX;IAA5D,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;mDAAmB;AAXpE,gBAAgB;IAD5B,aAAa,CAAC,qBAAqB,CAAC;GACxB,gBAAgB,CAuD5B;;AAED,eAAe,gBAAgB,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2025\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 { html, CSSResultArray, TemplateResult } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { styles } from './nile-grid-cell-item.css';\nimport NileElement from '../../internal/nile-element';\nimport {\n  initCellResize,\n  cellResizeMove,\n  cellResizeDone,\n} from './nile-grid-cell-item.utils';\n\n/**\n * Nile grid-cell component.\n *\n * @tag nile-grid-cell-item\n *\n */\n@customElement('nile-grid-cell-item')\nexport class NileGridCellItem extends NileElement {\n  /**\n   * The styles for nile-grid-cell-item\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  @property({ type: Number, reflect: true, attribute: true }) colspan = 1;\n  @property({ type: Number, reflect: true, attribute: true }) rowspan = 1;\n  @property({ type: Boolean, reflect: true, attribute: true }) resizable = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'cell');\n  }\n\n  private onHandlePointerDown = (ev: PointerEvent) => {\n    \n    const el = this as HTMLElement;\n\n    const downXRef = { value: 0 };\n    const startWRef = { value: 0 };\n\n    const result = initCellResize(el, ev, downXRef, startWRef);\n    if (!result) return;\n\n    const { target, col } = result;\n    const move = (e: PointerEvent) => cellResizeMove(el, col, startWRef.value, downXRef.value, e);\n    const done = () => cellResizeDone(el, ev, target, move);\n\n    target.addEventListener('pointermove', move);\n    target.addEventListener('pointerup', done, { once: true });\n    target.addEventListener('pointercancel', done, { once: true });\n  };\n\n  public render(): TemplateResult {\n    return html`\n      <div class=\"cell-item-base\" part=\"grid-cell-item-base\">\n        <slot></slot>\n        ${this.resizable\n          ? html`\n              <div\n                aria-hidden=\"false\"\n                class=\"resize-handle\"\n                @pointerdown=${this.onHandlePointerDown}\n              ></div>\n            `\n          : null}\n      </div>\n    `;\n  }\n\n  /* #endregion */\n}\n\nexport default NileGridCellItem;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-grid-cell-item': NileGridCellItem;\n  }\n}\n"]}

package/dist/src/nile-grid/nile-grid-cell-item/nile-grid-cell-item.utils.js

@@ -0,0 +1,34 @@
+export function initCellResize(el, ev, downXRef, startWRef) {
+    ev.preventDefault();
+    ev.stopPropagation();
+    const cStart = Number(el.dataset.cStart);
+    if (!cStart)
+        return null;
+    const span = Number(el.getAttribute('colspan')) || 1;
+    const col = Math.max(0, cStart + span - 1 - 1);
+    downXRef.value = ev.clientX;
+    startWRef.value = el.getBoundingClientRect().width;
+    const target = ev.currentTarget;
+    target.setPointerCapture(ev.pointerId);
+    el.dispatchEvent(new CustomEvent('nile-column-resize', {
+        detail: { col, widthPx: startWRef.value },
+        bubbles: true,
+        composed: true,
+    }));
+    el.dispatchEvent(new CustomEvent('nile-resize-start', { bubbles: true, composed: true }));
+    return { target, col };
+}
+export function cellResizeMove(el, col, startW, downX, e) {
+    const widthPx = Math.max(40, Math.round(startW + (e.clientX - downX)));
+    el.dispatchEvent(new CustomEvent('nile-column-resize', {
+        detail: { col, widthPx },
+        bubbles: true,
+        composed: true,
+    }));
+}
+export function cellResizeDone(el, ev, target, move) {
+    target.releasePointerCapture(ev.pointerId);
+    target.removeEventListener('pointermove', move);
+    el.dispatchEvent(new CustomEvent('nile-resize-end', { bubbles: true, composed: true }));
+}
+//# sourceMappingURL=nile-grid-cell-item.utils.js.map

package/dist/src/nile-grid/nile-grid-cell-item/nile-grid-cell-item.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-grid-cell-item.utils.js","sourceRoot":"","sources":["../../../../src/nile-grid/nile-grid-cell-item/nile-grid-cell-item.utils.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,cAAc,CAC5B,EAAe,EACf,EAAgB,EAChB,QAA2B,EAC3B,SAA4B;IAE5B,EAAE,CAAC,cAAc,EAAE,CAAC;IACpB,EAAE,CAAC,eAAe,EAAE,CAAC;IAErB,MAAM,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;IACzC,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IAEzB,MAAM,IAAI,GAAG,MAAM,CAAC,EAAE,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,CAAC;IACrD,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;IAE/C,QAAQ,CAAC,KAAK,GAAG,EAAE,CAAC,OAAO,CAAC;IAC5B,SAAS,CAAC,KAAK,GAAG,EAAE,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAC;IAEnD,MAAM,MAAM,GAAG,EAAE,CAAC,aAA4B,CAAC;IAC/C,MAAM,CAAC,iBAAiB,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;IAEvC,EAAE,CAAC,aAAa,CACd,IAAI,WAAW,CAAC,oBAAoB,EAAE;QACpC,MAAM,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE,SAAS,CAAC,KAAK,EAAE;QACzC,OAAO,EAAE,IAAI;QACb,QAAQ,EAAE,IAAI;KACf,CAAC,CACH,CAAC;IAEF,EAAE,CAAC,aAAa,CACd,IAAI,WAAW,CAAC,mBAAmB,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CACxE,CAAC;IAEF,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC;AACzB,CAAC;AAED,MAAM,UAAU,cAAc,CAC5B,EAAe,EACf,GAAW,EACX,MAAc,EACd,KAAa,EACb,CAAe;IAEf,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,OAAO,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;IACvE,EAAE,CAAC,aAAa,CACd,IAAI,WAAW,CAAC,oBAAoB,EAAE;QACpC,MAAM,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE;QACxB,OAAO,EAAE,IAAI;QACb,QAAQ,EAAE,IAAI;KACf,CAAC,CACH,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,cAAc,CAC5B,EAAe,EACf,EAAgB,EAChB,MAAmB,EACnB,IAA+B;IAE/B,MAAM,CAAC,qBAAqB,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;IAC3C,MAAM,CAAC,mBAAmB,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC;IAChD,EAAE,CAAC,aAAa,CACd,IAAI,WAAW,CAAC,iBAAiB,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CACtE,CAAC;AACJ,CAAC","sourcesContent":["export function initCellResize(\n  el: HTMLElement,\n  ev: PointerEvent,\n  downXRef: { value: number },\n  startWRef: { value: number }\n) {\n  ev.preventDefault();\n  ev.stopPropagation();\n\n  const cStart = Number(el.dataset.cStart);\n  if (!cStart) return null;\n\n  const span = Number(el.getAttribute('colspan')) || 1;\n  const col = Math.max(0, cStart + span - 1 - 1);\n\n  downXRef.value = ev.clientX;\n  startWRef.value = el.getBoundingClientRect().width;\n\n  const target = ev.currentTarget as HTMLElement;\n  target.setPointerCapture(ev.pointerId);\n\n  el.dispatchEvent(\n    new CustomEvent('nile-column-resize', {\n      detail: { col, widthPx: startWRef.value },\n      bubbles: true,\n      composed: true,\n    })\n  );\n\n  el.dispatchEvent(\n    new CustomEvent('nile-resize-start', { bubbles: true, composed: true })\n  );\n\n  return { target, col };\n}\n\nexport function cellResizeMove(\n  el: HTMLElement,\n  col: number,\n  startW: number,\n  downX: number,\n  e: PointerEvent\n) {\n  const widthPx = Math.max(40, Math.round(startW + (e.clientX - downX)));\n  el.dispatchEvent(\n    new CustomEvent('nile-column-resize', {\n      detail: { col, widthPx },\n      bubbles: true,\n      composed: true,\n    })\n  );\n}\n\nexport function cellResizeDone(\n  el: HTMLElement,\n  ev: PointerEvent,\n  target: HTMLElement,\n  move: (e: PointerEvent) => void\n) {\n  target.releasePointerCapture(ev.pointerId);\n  target.removeEventListener('pointermove', move);\n  el.dispatchEvent(\n    new CustomEvent('nile-resize-end', { bubbles: true, composed: true })\n  );\n}\n"]}