@aquera/nile-elements 0.1.58-beta-1.0 → 0.1.58

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

@@ -0,0 +1,217 @@
+/**
+ * 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 { styles } from './nile-slider.css';
+import NileElement from '../internal/nile-element';
+import { classMap } from 'lit/directives/class-map.js';
+import { html } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { rangeSlider, singleSlider, lableContaier } from './nile-slider.template';
+import { handleSingleSlider, handleRangeOne, handleRangeTwo, getHtmlElements, removeMoveListeners, valueToPercent, handleTwoThumbClick, addMoveListeners } from './utils/nile-slider.utils';
+/**
+ * Nile slider component.
+ *
+ * @tag nile-slider
+ */
+let NileSlider = class NileSlider extends NileElement {
+    constructor() {
+        super(...arguments);
+        this.minValue = 0;
+        this.value = this.minValue;
+        this.maxValue = 100;
+        this.rangeOneValue = this.minValue;
+        this.rangeTwoValue = this.maxValue;
+        this.showLabel = false;
+        this.labelStart = "";
+        this.labelEnd = "";
+        this.rangeSlider = false;
+        this.labelPosition = "top";
+        this.tooltipPosition = "top";
+        this.activeThumb = null;
+        this.onMouseMove = (e) => {
+            const rect = this.range.getBoundingClientRect();
+            if (!this.rangeSlider) {
+                handleSingleSlider(e, rect, this);
+            }
+            else {
+                if (this.activeThumb === 'one') {
+                    handleRangeOne(e, rect, this);
+                }
+                else if (this.activeThumb === 'two') {
+                    handleRangeTwo(e, rect, this);
+                }
+                const start = valueToPercent(this.rangeOneValue, this);
+                const end = valueToPercent(this.rangeTwoValue, this);
+                const left = Math.min(start, end);
+                const width = Math.abs(end - start);
+                if (this.rangeTwoValue >= this.rangeOneValue) {
+                    this.completed.style.left = `${left}%`;
+                    this.completed.style.width = `${width}%`;
+                }
+            }
+        };
+        this.onMouseUp = () => {
+            if (!this.rangeSlider)
+                this.emit("nile-change-end" /* NileSliderEvents.NILE_CHANGE_END */, { value: this.value });
+            else {
+                this.emit("nile-button-first-change-end" /* NileSliderEvents.NILE_BUTTON_FIRST_CHANGE_END */, { value: this.rangeOneValue });
+                this.emit("nile-button-last-change-end" /* NileSliderEvents.NILE_BUTTON_LAST_CHANGE_END */, { value: this.rangeTwoValue });
+            }
+            this.activeThumb = null;
+            removeMoveListeners(this);
+        };
+        this.onMouseDown = (e) => {
+            const rect = this.range.getBoundingClientRect();
+            const clickX = e.clientX - rect.left;
+            const percent = (clickX / rect.width) * 100;
+            const value = this.minValue + (percent / 100) * (this.maxValue - this.minValue);
+            if (!this.rangeSlider) {
+                handleSingleSlider(e, rect, this);
+                this.activeThumb = 'one';
+                addMoveListeners(this);
+            }
+            else {
+                handleTwoThumbClick(value, this);
+                const distToOne = Math.abs(value - this.rangeOneValue);
+                const distToTwo = Math.abs(value - this.rangeTwoValue);
+                this.activeThumb = distToOne <= distToTwo ? 'one' : 'two';
+                addMoveListeners(this);
+            }
+        };
+    }
+    static get styles() {
+        return [styles];
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.emit("nile-init" /* NileSliderEvents.NILE_INIT */);
+        if (this.rangeSlider) {
+            this.checkRangeValidity();
+        }
+    }
+    firstUpdated(changedProps) {
+        getHtmlElements(this);
+        if (!this.rangeSlider && changedProps.has('value')) {
+            this.value = this.checkValueValidity(this.value, this.minValue, this.maxValue);
+            const percent = valueToPercent(this.value, this);
+            this.buttonOne.style.left = `${percent}%`;
+            this.completed.style.width = `${percent}%`;
+        }
+        else if (this.rangeSlider) {
+            const percentOne = valueToPercent(this.rangeOneValue, this);
+            const percentTwo = valueToPercent(this.rangeTwoValue, this);
+            if (this.buttonOne)
+                this.buttonOne.style.left = `${percentOne}%`;
+            if (this.buttonTwo)
+                this.buttonTwo.style.left = `${percentTwo}%`;
+            const left = Math.min(percentOne, percentTwo);
+            const width = Math.abs(percentTwo - percentOne);
+            this.completed.style.left = `${left}%`;
+            this.completed.style.width = `${width}%`;
+        }
+    }
+    checkValueValidity(value, min, max) {
+        if (max - min <= 1) {
+            return Math.max(min, Math.min(value, max));
+        }
+        return Math.floor(Math.max(min, Math.min(value, max)));
+    }
+    checkRangeValidity() {
+        if (this.rangeTwoValue > this.maxValue) {
+            this.rangeTwoValue = this.maxValue;
+        }
+        else if (this.rangeTwoValue < this.rangeOneValue) {
+            this.rangeTwoValue = this.rangeOneValue;
+        }
+        if (this.rangeOneValue < this.minValue) {
+            this.rangeOneValue = this.minValue;
+        }
+        else if (this.rangeOneValue > this.rangeTwoValue) {
+            this.rangeOneValue = this.rangeTwoValue;
+        }
+    }
+    render() {
+        const hasLabels = this.showLabel;
+        const ariaLabelledby = hasLabels ? 'label-start label-end' : undefined;
+        return html `
+      <div
+        part="base"
+        class=${classMap({
+            'container': true,
+            'align-item-center': !hasLabels
+        })}
+      >
+        <slot class="span" name="prefix"></slot>
+  
+        <div
+          part="range-container"
+          class=${classMap({
+            'range-container': true,
+            'column-reverse': this.labelPosition === 'bottom'
+        })}
+        >
+          ${hasLabels ? lableContaier(this) : html ``}
+  
+          <div
+            class="range"
+            part="range"
+            role="group"
+            aria-labelledby=${ariaLabelledby}
+          >
+            <span class="range-completed" part="range-completed"></span>
+            ${this.rangeSlider ? rangeSlider(this) : singleSlider(this)}
+          </div>
+        </div>
+  
+        <slot class="span" name="suffix"></slot>
+      </div>
+    `;
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.emit("nile-destroy" /* NileSliderEvents.NILE_DESTROY */);
+    }
+};
+__decorate([
+    property({ type: Number })
+], NileSlider.prototype, "minValue", void 0);
+__decorate([
+    property({ type: Number })
+], NileSlider.prototype, "value", void 0);
+__decorate([
+    property({ type: Number })
+], NileSlider.prototype, "maxValue", void 0);
+__decorate([
+    property({ type: Number })
+], NileSlider.prototype, "rangeOneValue", void 0);
+__decorate([
+    property({ type: Number })
+], NileSlider.prototype, "rangeTwoValue", void 0);
+__decorate([
+    property({ type: Boolean })
+], NileSlider.prototype, "showLabel", void 0);
+__decorate([
+    property({ type: String })
+], NileSlider.prototype, "labelStart", void 0);
+__decorate([
+    property({ type: String })
+], NileSlider.prototype, "labelEnd", void 0);
+__decorate([
+    property({ type: Boolean })
+], NileSlider.prototype, "rangeSlider", void 0);
+__decorate([
+    property({ type: String })
+], NileSlider.prototype, "labelPosition", void 0);
+__decorate([
+    property({ type: String })
+], NileSlider.prototype, "tooltipPosition", void 0);
+NileSlider = __decorate([
+    customElement('nile-slider')
+], NileSlider);
+export { NileSlider };
+export default NileSlider;
+//# sourceMappingURL=nile-slider.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"nile-slider.js","sourceRoot":"","sources":["../../../src/nile-slider/nile-slider.ts"],"names":[],"mappings":"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","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 { styles } from './nile-slider.css';\nimport NileElement from '../internal/nile-element';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { html, CSSResultArray, TemplateResult } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { TooltipPosition } from './types/nile-slider.types';\nimport { NileSliderEvents } from './types/nile-slider.enums';\nimport { rangeSlider, singleSlider, lableContaier } from './nile-slider.template';\nimport { \n  handleSingleSlider, \n  handleRangeOne, \n  handleRangeTwo, \n  getHtmlElements, \n  removeMoveListeners,\n  valueToPercent,\n  handleTwoThumbClick,\n  addMoveListeners\n} from './utils/nile-slider.utils'\n\n/** \n * Nile slider component.\n *\n * @tag nile-slider\n */\n@customElement('nile-slider')\nexport class NileSlider extends NileElement {\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n\n  @property({ type: Number }) minValue: number = 0;\n  @property({ type: Number }) value: number = this.minValue;\n  @property({ type: Number }) maxValue: number = 100;\n  @property({ type: Number }) rangeOneValue: number = this.minValue;\n  @property({ type: Number }) rangeTwoValue: number = this.maxValue;\n  @property({ type: Boolean}) showLabel: boolean = false;\n  @property({ type: String }) labelStart: string = \"\";\n  @property({ type: String }) labelEnd: string = \"\";\n  @property({ type: Boolean}) rangeSlider: boolean = false;\n  @property({ type: String }) labelPosition: string = \"top\";\n  @property({ type: String }) tooltipPosition: TooltipPosition = \"top\";\n\n  public buttonOne!: HTMLElement;\n  public buttonTwo!: HTMLElement;\n  public range!: HTMLElement;\n  public completed!: HTMLElement;\n  public activeThumb: 'one' | 'two' | null = null;\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this.emit(NileSliderEvents.NILE_INIT); \n\n    if(this.rangeSlider) {\n      this.checkRangeValidity();\n    }\n  }\n\n  firstUpdated(changedProps: Map<string, any>): void {\n    getHtmlElements(this);\n\n    if (!this.rangeSlider && changedProps.has('value')) {\n      this.value = this.checkValueValidity(this.value, this.minValue, this.maxValue);\n      const percent = valueToPercent(this.value, this);\n      \n      this.buttonOne.style.left = `${percent}%`;\n      this.completed.style.width = `${percent}%`;\n    } else if (this.rangeSlider) {\n      \n      const percentOne = valueToPercent(this.rangeOneValue, this);\n      const percentTwo = valueToPercent(this.rangeTwoValue, this);\n      \n      if (this.buttonOne) this.buttonOne.style.left = `${percentOne}%`;\n      if (this.buttonTwo) this.buttonTwo.style.left = `${percentTwo}%`;\n      \n      const left = Math.min(percentOne, percentTwo);\n      const width = Math.abs(percentTwo - percentOne);\n      \n      this.completed.style.left = `${left}%`;\n      this.completed.style.width = `${width}%`;\n    }\n  }\n\n  checkValueValidity(value: number, min: number, max: number): number {\n    if(max - min <= 1) { \n      return Math.max(min, Math.min(value, max));\n    }\n    return Math.floor(Math.max(min, Math.min(value, max)));\n  }\n\n  checkRangeValidity(): void {\n    if(this.rangeTwoValue > this.maxValue) {\n      this.rangeTwoValue = this.maxValue;\n    } else if(this.rangeTwoValue < this.rangeOneValue) {\n      this.rangeTwoValue = this.rangeOneValue;\n    }\n\n    if(this.rangeOneValue < this.minValue) {\n      this.rangeOneValue = this.minValue;\n    } else if(this.rangeOneValue > this.rangeTwoValue) {\n      this.rangeOneValue = this.rangeTwoValue;\n    }\n  }  \n\n  public onMouseMove = (e: MouseEvent): void => {\n    const rect = this.range.getBoundingClientRect();\n\n    if (!this.rangeSlider) {\n      handleSingleSlider(e, rect, this);\n    } else {\n      if (this.activeThumb === 'one') {\n        handleRangeOne(e, rect, this);\n      } else if (this.activeThumb === 'two') {\n        handleRangeTwo(e, rect, this);\n      }\n\n      const start = valueToPercent(this.rangeOneValue, this);\n      const end = valueToPercent(this.rangeTwoValue, this);\n      const left = Math.min(start, end);\n      const width = Math.abs(end - start);\n\n      if(this.rangeTwoValue >= this.rangeOneValue) {\n        this.completed.style.left = `${left}%`;\n        this.completed.style.width = `${width}%`;\n      }\n    }\n  };\n\n  public onMouseUp = (): void => {\n    if(!this.rangeSlider) this.emit(NileSliderEvents.NILE_CHANGE_END, { value: this.value });\n    else {\n      this.emit(NileSliderEvents.NILE_BUTTON_FIRST_CHANGE_END, { value: this.rangeOneValue });\n      this.emit(NileSliderEvents.NILE_BUTTON_LAST_CHANGE_END, { value: this.rangeTwoValue });\n    }\n    this.activeThumb = null;\n    removeMoveListeners(this);\n  };\n\n  public onMouseDown = (e: MouseEvent): void => {\n    const rect = this.range.getBoundingClientRect();\n    const clickX = e.clientX - rect.left;\n    const percent = (clickX / rect.width) * 100;\n    const value = this.minValue + (percent / 100) * (this.maxValue - this.minValue);\n  \n    if (!this.rangeSlider) {\n      handleSingleSlider(e, rect, this);\n      this.activeThumb = 'one';\n      addMoveListeners(this);\n    } else {\n      handleTwoThumbClick(value, this);\n      const distToOne = Math.abs(value - this.rangeOneValue);\n      const distToTwo = Math.abs(value - this.rangeTwoValue);\n      this.activeThumb = distToOne <= distToTwo ? 'one' : 'two';\n      addMoveListeners(this);\n    }\n  };\n\n  public render(): TemplateResult {\n    const hasLabels = this.showLabel;\n    const ariaLabelledby = hasLabels ? 'label-start label-end' : undefined;\n  \n    return html`\n      <div\n        part=\"base\"\n        class=${classMap({\n          'container': true,\n          'align-item-center': !hasLabels\n        })}\n      >\n        <slot class=\"span\" name=\"prefix\"></slot>\n  \n        <div\n          part=\"range-container\"\n          class=${classMap({\n            'range-container': true,\n            'column-reverse': this.labelPosition === 'bottom'\n          })}\n        >\n          ${hasLabels ? lableContaier(this) : html``}\n  \n          <div\n            class=\"range\"\n            part=\"range\"\n            role=\"group\"\n            aria-labelledby=${ariaLabelledby}\n          >\n            <span class=\"range-completed\" part=\"range-completed\"></span>\n            ${this.rangeSlider ? rangeSlider(this) : singleSlider(this)}\n          </div>\n        </div>\n  \n        <slot class=\"span\" name=\"suffix\"></slot>\n      </div>\n    `;\n  }  \n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.emit(NileSliderEvents.NILE_DESTROY);\n  }\n}\n\nexport default NileSlider;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-slider': NileSlider;\n  }\n}\n"]}

package/dist/src/nile-slider/nile-slider.template.d.ts

@@ -0,0 +1,5 @@
+import { TemplateResult } from 'lit';
+import NileSlider from './nile-slider';
+export declare const rangeSlider: (nileSlider: NileSlider) => TemplateResult;
+export declare const singleSlider: (nileSlider: NileSlider) => TemplateResult;
+export declare const lableContaier: (nileSlider: NileSlider) => TemplateResult;

package/dist/src/nile-slider/nile-slider.template.js

@@ -0,0 +1,73 @@
+import { html } from 'lit';
+import { classMap } from 'lit/directives/class-map.js';
+export const rangeSlider = (nileSlider) => {
+    return html `
+    <div>
+      <nile-tooltip
+        content=${nileSlider.rangeOneValue}
+        placement=${nileSlider.tooltipPosition}
+      >
+        <div 
+          id="range-one" 
+          class="range-button"
+          part="range-button"
+          role="slider"
+          tabindex="0"
+          aria-valuemin=${nileSlider.minValue}
+          aria-valuemax=${nileSlider.maxValue}
+          aria-valuenow=${nileSlider.rangeOneValue}
+          aria-label="Minimum value"
+        ></div>
+      </nile-tooltip>
+      <nile-tooltip
+        content=${nileSlider.rangeTwoValue}
+        placement=${nileSlider.tooltipPosition}
+      >
+        <div
+          id="range-two"
+          class="range-button-two"
+          part="range-button-two"
+          role="slider"
+          tabindex="0"
+          aria-valuemin=${nileSlider.minValue}
+          aria-valuemax=${nileSlider.maxValue}
+          aria-valuenow=${nileSlider.rangeTwoValue}
+          aria-label="Maximum value"
+        ></div>
+      </nile-tooltip>
+    </div>
+  `;
+};
+export const singleSlider = (nileSlider) => {
+    return html `
+    <div>
+      <nile-tooltip
+        content=${nileSlider.value}
+        placement=${nileSlider.tooltipPosition}
+      >
+        <div 
+          class=${classMap({
+        'range-button': true,
+        'range-button-active': nileSlider.activeThumb === 'one',
+    })} 
+          part="range-button"
+          role="slider"
+          tabindex="0"
+          aria-valuemin=${nileSlider.minValue}
+          aria-valuemax=${nileSlider.maxValue}
+          aria-valuenow=${nileSlider.value}
+          aria-label=${nileSlider.ariaLabel || "Slider value"}
+        ></div>
+      </nile-tooltip>
+    </div>
+  `;
+};
+export const lableContaier = (nileSlider) => {
+    return html `
+    <div part="label-container" class="label-container">
+      <span id="label-start">${nileSlider.labelStart}</span>
+      <span id="label-end">${nileSlider.labelEnd}</span>
+    </div>
+  `;
+};
+//# sourceMappingURL=nile-slider.template.js.map

package/dist/src/nile-slider/nile-slider.template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-slider.template.js","sourceRoot":"","sources":["../../../src/nile-slider/nile-slider.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,IAAI,EAAE,MAAM,KAAK,CAAC;AAE3C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,UAAsB,EAAkB,EAAE;IACpE,OAAO,IAAI,CAAA;;;kBAGK,UAAU,CAAC,aAAa;oBACtB,UAAU,CAAC,eAAe;;;;;;;;0BAQpB,UAAU,CAAC,QAAQ;0BACnB,UAAU,CAAC,QAAQ;0BACnB,UAAU,CAAC,aAAa;;;;;kBAKhC,UAAU,CAAC,aAAa;oBACtB,UAAU,CAAC,eAAe;;;;;;;;0BAQpB,UAAU,CAAC,QAAQ;0BACnB,UAAU,CAAC,QAAQ;0BACnB,UAAU,CAAC,aAAa;;;;;GAK/C,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,UAAsB,EAAkB,EAAE;IACrE,OAAO,IAAI,CAAA;;;kBAGK,UAAU,CAAC,KAAK;oBACd,UAAU,CAAC,eAAe;;;kBAG5B,QAAQ,CAAC;QACf,cAAc,EAAE,IAAI;QACpB,qBAAqB,EAAE,UAAU,CAAC,WAAW,KAAK,KAAK;KACxD,CAAC;;;;0BAIc,UAAU,CAAC,QAAQ;0BACnB,UAAU,CAAC,QAAQ;0BACnB,UAAU,CAAC,KAAK;uBACnB,UAAU,CAAC,SAAS,IAAI,cAAc;;;;GAI1D,CAAC;AACJ,CAAC,CAAC;AAGF,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,UAAsB,EAAkB,EAAE;IACtE,OAAO,IAAI,CAAA;;+BAEkB,UAAU,CAAC,UAAU;6BACvB,UAAU,CAAC,QAAQ;;GAE7C,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { TemplateResult, html } from 'lit';\nimport NileSlider from './nile-slider';\nimport { classMap } from 'lit/directives/class-map.js';\n\nexport const rangeSlider = (nileSlider: NileSlider): TemplateResult => {\n  return html`\n    <div>\n      <nile-tooltip\n        content=${nileSlider.rangeOneValue}\n        placement=${nileSlider.tooltipPosition}\n      >\n        <div \n          id=\"range-one\" \n          class=\"range-button\"\n          part=\"range-button\"\n          role=\"slider\"\n          tabindex=\"0\"\n          aria-valuemin=${nileSlider.minValue}\n          aria-valuemax=${nileSlider.maxValue}\n          aria-valuenow=${nileSlider.rangeOneValue}\n          aria-label=\"Minimum value\"\n        ></div>\n      </nile-tooltip>\n      <nile-tooltip\n        content=${nileSlider.rangeTwoValue}\n        placement=${nileSlider.tooltipPosition}\n      >\n        <div\n          id=\"range-two\"\n          class=\"range-button-two\"\n          part=\"range-button-two\"\n          role=\"slider\"\n          tabindex=\"0\"\n          aria-valuemin=${nileSlider.minValue}\n          aria-valuemax=${nileSlider.maxValue}\n          aria-valuenow=${nileSlider.rangeTwoValue}\n          aria-label=\"Maximum value\"\n        ></div>\n      </nile-tooltip>\n    </div>\n  `;\n};\n\nexport const singleSlider = (nileSlider: NileSlider): TemplateResult => {\n  return html`\n    <div>\n      <nile-tooltip\n        content=${nileSlider.value}\n        placement=${nileSlider.tooltipPosition}\n      >\n        <div \n          class=${classMap({\n            'range-button': true,\n            'range-button-active': nileSlider.activeThumb === 'one',\n          })} \n          part=\"range-button\"\n          role=\"slider\"\n          tabindex=\"0\"\n          aria-valuemin=${nileSlider.minValue}\n          aria-valuemax=${nileSlider.maxValue}\n          aria-valuenow=${nileSlider.value}\n          aria-label=${nileSlider.ariaLabel || \"Slider value\"}\n        ></div>\n      </nile-tooltip>\n    </div>\n  `;\n};\n\n\nexport const lableContaier = (nileSlider: NileSlider): TemplateResult => {\n  return html`\n    <div part=\"label-container\" class=\"label-container\">\n      <span id=\"label-start\">${nileSlider.labelStart}</span>\n      <span id=\"label-end\">${nileSlider.labelEnd}</span>\n    </div>\n  `;\n};"]}

package/dist/src/nile-slider/types/nile-slider.enums.d.ts

@@ -0,0 +1,10 @@
+export declare const enum NileSliderEvents {
+    NILE_INIT = "nile-init",
+    NILE_CHANGE = "nile-change",
+    NILE_CHANGE_END = "nile-change-end",
+    NILE_BUTTON_FIRST_CHANGE = "nile-button-first-change",
+    NILE_BUTTON_LAST_CHANGE = "nile-button-last-change",
+    NILE_BUTTON_FIRST_CHANGE_END = "nile-button-first-change-end",
+    NILE_BUTTON_LAST_CHANGE_END = "nile-button-last-change-end",
+    NILE_DESTROY = "nile-destroy"
+}

package/dist/src/nile-slider/types/nile-slider.enums.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=nile-slider.enums.js.map

package/dist/src/nile-slider/types/nile-slider.enums.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-slider.enums.js","sourceRoot":"","sources":["../../../../src/nile-slider/types/nile-slider.enums.ts"],"names":[],"mappings":"","sourcesContent":["export const enum NileSliderEvents {\n  NILE_INIT = \"nile-init\",\n  NILE_CHANGE = \"nile-change\",\n  NILE_CHANGE_END = \"nile-change-end\",\n  NILE_BUTTON_FIRST_CHANGE = \"nile-button-first-change\",\n  NILE_BUTTON_LAST_CHANGE =  \"nile-button-last-change\",\n  NILE_BUTTON_FIRST_CHANGE_END = \"nile-button-first-change-end\",\n  NILE_BUTTON_LAST_CHANGE_END =  \"nile-button-last-change-end\",\n  NILE_DESTROY = \"nile-destroy\", \n}"]}

package/dist/src/nile-slider/types/nile-slider.types.d.ts

@@ -0,0 +1 @@
+export type TooltipPosition = 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';

package/dist/src/nile-slider/types/nile-slider.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=nile-slider.types.js.map

package/dist/src/nile-slider/types/nile-slider.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-slider.types.js","sourceRoot":"","sources":["../../../../src/nile-slider/types/nile-slider.types.ts"],"names":[],"mappings":"","sourcesContent":["export type TooltipPosition =\n  | 'top'\n  | 'top-start'\n  | 'top-end'\n  | 'right'\n  | 'right-start'\n  | 'right-end'\n  | 'bottom'\n  | 'bottom-start'\n  | 'bottom-end'\n  | 'left'\n  | 'left-start'\n  | 'left-end';\n"]}

package/dist/src/nile-slider/utils/nile-slider.utils.d.ts

@@ -0,0 +1,11 @@
+import NileSlider from '../nile-slider';
+export declare const getClampedPercent: (rect: DOMRect, x: number) => number;
+export declare const percentToValue: (percent: number, nileSlider: NileSlider) => number;
+export declare const valueToPercent: (value: number, nileSlider: NileSlider) => number;
+export declare const handleSingleSlider: (e: MouseEvent, rect: DOMRect, nileSlider: NileSlider) => void;
+export declare const handleRangeOne: (e: MouseEvent, rect: DOMRect, nileSlider: NileSlider) => void;
+export declare const handleRangeTwo: (e: MouseEvent, rect: DOMRect, nileSlider: NileSlider) => void;
+export declare const getHtmlElements: (nileSlider: NileSlider) => void;
+export declare const addMoveListeners: (nileSlider: NileSlider) => void;
+export declare const removeMoveListeners: (nileSlider: NileSlider) => void;
+export declare const handleTwoThumbClick: (value: number, nileSlider: NileSlider) => void;

package/dist/src/nile-slider/utils/nile-slider.utils.js

@@ -0,0 +1,99 @@
+export const getClampedPercent = (rect, x) => {
+    const clampedX = Math.max(0, Math.min(x, rect.width));
+    const percent = (clampedX / rect.width) * 100;
+    return percent;
+};
+export const percentToValue = (percent, nileSlider) => {
+    const value = nileSlider.minValue + (percent / 100) * (nileSlider.maxValue - nileSlider.minValue);
+    if (nileSlider.maxValue - nileSlider.minValue < 1) {
+        return parseFloat(value.toFixed(2));
+    }
+    else {
+        return Math.floor(value);
+    }
+};
+export const valueToPercent = (value, nileSlider) => {
+    return ((value - nileSlider.minValue) / (nileSlider.maxValue - nileSlider.minValue)) * 100;
+};
+export const handleSingleSlider = (e, rect, nileSlider) => {
+    const x = e.clientX - rect.left;
+    const percent = getClampedPercent(rect, x);
+    nileSlider.value = percentToValue(percent, nileSlider);
+    nileSlider.emit("nile-change" /* NileSliderEvents.NILE_CHANGE */, { value: nileSlider.value });
+    nileSlider.buttonOne.style.left = `${percent}%`;
+    nileSlider.completed.style.width = `${percent}%`;
+};
+export const handleRangeOne = (e, rect, nileSlider) => {
+    const x = e.clientX - rect.left;
+    const percent = getClampedPercent(rect, x);
+    nileSlider.rangeOneValue = percentToValue(percent, nileSlider);
+    nileSlider.rangeOneValue = Math.min(nileSlider.rangeOneValue, nileSlider.rangeTwoValue);
+    nileSlider.emit("nile-button-first-change" /* NileSliderEvents.NILE_BUTTON_FIRST_CHANGE */, {
+        value: nileSlider.rangeOneValue,
+    });
+    if (nileSlider.rangeTwoValue > nileSlider.rangeOneValue) {
+        nileSlider.buttonOne.style.left = `${percent}%`;
+    }
+};
+export const handleRangeTwo = (e, rect, nileSlider) => {
+    const x = e.clientX - rect.left;
+    const percent = getClampedPercent(rect, x);
+    nileSlider.rangeTwoValue = percentToValue(percent, nileSlider);
+    nileSlider.rangeTwoValue = Math.max(nileSlider.rangeTwoValue, nileSlider.rangeOneValue);
+    nileSlider.emit("nile-button-last-change" /* NileSliderEvents.NILE_BUTTON_LAST_CHANGE */, {
+        value: nileSlider.rangeTwoValue,
+    });
+    if (nileSlider.rangeTwoValue > nileSlider.rangeOneValue) {
+        nileSlider.buttonTwo.style.left = `${percent}%`;
+    }
+};
+export const getHtmlElements = (nileSlider) => {
+    nileSlider.range = nileSlider.renderRoot.querySelector('.range');
+    nileSlider.buttonOne = nileSlider.renderRoot.querySelector('.range-button');
+    nileSlider.buttonTwo = nileSlider.renderRoot.querySelector('.range-button-two');
+    nileSlider.completed = nileSlider.renderRoot.querySelector('.range-completed');
+    nileSlider.range.addEventListener('mousedown', nileSlider.onMouseDown);
+    nileSlider.buttonOne?.addEventListener('mousedown', () => {
+        nileSlider.activeThumb = 'one';
+        addMoveListeners(nileSlider);
+    });
+    nileSlider.buttonTwo?.addEventListener('mousedown', () => {
+        nileSlider.activeThumb = 'two';
+        addMoveListeners(nileSlider);
+    });
+};
+export const addMoveListeners = (nileSlider) => {
+    window.addEventListener('mousemove', nileSlider.onMouseMove);
+    window.addEventListener('mouseup', nileSlider.onMouseUp);
+};
+export const removeMoveListeners = (nileSlider) => {
+    window.removeEventListener('mousemove', nileSlider.onMouseMove);
+    window.removeEventListener('mouseup', nileSlider.onMouseUp);
+};
+export const handleTwoThumbClick = (value, nileSlider) => {
+    const distToOne = Math.abs(value - nileSlider.rangeOneValue);
+    const distToTwo = Math.abs(value - nileSlider.rangeTwoValue);
+    if (distToOne <= distToTwo) {
+        const clamped = Math.min(value, nileSlider.rangeTwoValue);
+        nileSlider.rangeOneValue = nileSlider.checkValueValidity(clamped, nileSlider.minValue, nileSlider.maxValue);
+    }
+    else {
+        const clamped = Math.max(value, nileSlider.rangeOneValue);
+        nileSlider.rangeTwoValue = nileSlider.checkValueValidity(clamped, nileSlider.minValue, nileSlider.maxValue);
+    }
+    const percentOne = valueToPercent(nileSlider.rangeOneValue, nileSlider);
+    const percentTwo = valueToPercent(nileSlider.rangeTwoValue, nileSlider);
+    nileSlider.buttonOne.style.left = `${percentOne}%`;
+    nileSlider.buttonTwo.style.left = `${percentTwo}%`;
+    const left = Math.min(percentOne, percentTwo);
+    const width = Math.abs(percentTwo - percentOne);
+    nileSlider.completed.style.left = `${left}%`;
+    nileSlider.completed.style.width = `${width}%`;
+    nileSlider.emit("nile-button-first-change" /* NileSliderEvents.NILE_BUTTON_FIRST_CHANGE */, {
+        value: nileSlider.rangeOneValue,
+    });
+    nileSlider.emit("nile-button-last-change" /* NileSliderEvents.NILE_BUTTON_LAST_CHANGE */, {
+        value: nileSlider.rangeTwoValue,
+    });
+};
+//# sourceMappingURL=nile-slider.utils.js.map

package/dist/src/nile-slider/utils/nile-slider.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-slider.utils.js","sourceRoot":"","sources":["../../../../src/nile-slider/utils/nile-slider.utils.ts"],"names":[],"mappings":"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","sourcesContent":["import NileSlider from '../nile-slider';\nimport { NileSliderEvents } from '../types/nile-slider.enums';\n\nexport const getClampedPercent = (\n  rect: DOMRect,\n  x: number,\n): number => {\n  const clampedX = Math.max(0, Math.min(x, rect.width)); \n  const percent = (clampedX / rect.width) * 100;\n  return percent;\n};\n\nexport const percentToValue = (percent: number, nileSlider: NileSlider): number => {\n  const value = nileSlider.minValue + (percent / 100) * (nileSlider.maxValue - nileSlider.minValue);\n  if(nileSlider.maxValue - nileSlider.minValue < 1) {\n    return parseFloat(value.toFixed(2));\n  } else {\n    return Math.floor(value);\n  }\n};\n\nexport const valueToPercent = (value: number, nileSlider: NileSlider): number => {\n  return ((value - nileSlider.minValue) / (nileSlider.maxValue - nileSlider.minValue)) * 100;\n};\n\nexport const handleSingleSlider = (\n  e: MouseEvent,\n  rect: DOMRect,\n  nileSlider: NileSlider\n): void => {\n  const x = e.clientX - rect.left;\n  const percent = getClampedPercent(rect, x);\n  nileSlider.value = percentToValue(percent, nileSlider);\n  nileSlider.emit(NileSliderEvents.NILE_CHANGE, { value: nileSlider.value });\n  nileSlider.buttonOne.style.left = `${percent}%`;\n  nileSlider.completed.style.width = `${percent}%`;\n};\n\nexport const handleRangeOne = (\n  e: MouseEvent,\n  rect: DOMRect,\n  nileSlider: NileSlider\n): void => {\n  const x = e.clientX - rect.left;\n  const percent = getClampedPercent(rect, x);\n  nileSlider.rangeOneValue = percentToValue(percent, nileSlider);\n  nileSlider.rangeOneValue = Math.min(nileSlider.rangeOneValue, nileSlider.rangeTwoValue);\n  nileSlider.emit(NileSliderEvents.NILE_BUTTON_FIRST_CHANGE, {\n    value: nileSlider.rangeOneValue,\n  });\n  if (nileSlider.rangeTwoValue > nileSlider.rangeOneValue) {\n    nileSlider.buttonOne.style.left = `${percent}%`;\n  }\n};\n\nexport const handleRangeTwo = (\n  e: MouseEvent,\n  rect: DOMRect,\n  nileSlider: NileSlider\n): void => {\n  const x = e.clientX - rect.left;\n  const percent = getClampedPercent(rect, x);\n  nileSlider.rangeTwoValue = percentToValue(percent, nileSlider);\n  nileSlider.rangeTwoValue = Math.max(nileSlider.rangeTwoValue, nileSlider.rangeOneValue);\n  nileSlider.emit(NileSliderEvents.NILE_BUTTON_LAST_CHANGE, {\n    value: nileSlider.rangeTwoValue,\n  });\n\n  if (nileSlider.rangeTwoValue > nileSlider.rangeOneValue) {\n    nileSlider.buttonTwo.style.left = `${percent}%`;\n  }\n};\n\nexport const getHtmlElements = (nileSlider: NileSlider) => {\n  nileSlider.range = nileSlider.renderRoot.querySelector('.range') as HTMLElement;\n  nileSlider.buttonOne = nileSlider.renderRoot.querySelector('.range-button') as HTMLElement;\n  nileSlider.buttonTwo = nileSlider.renderRoot.querySelector('.range-button-two') as HTMLElement;\n  nileSlider.completed = nileSlider.renderRoot.querySelector('.range-completed') as HTMLElement;\n\n  nileSlider.range.addEventListener('mousedown', nileSlider.onMouseDown);\n\n  nileSlider.buttonOne?.addEventListener('mousedown', () => {\n    nileSlider.activeThumb = 'one';\n    addMoveListeners(nileSlider);\n  });\n\n  nileSlider.buttonTwo?.addEventListener('mousedown', () => {\n    nileSlider.activeThumb = 'two';\n    addMoveListeners(nileSlider);\n  });\n};\n\nexport const addMoveListeners = (nileSlider: NileSlider): void => {\n  window.addEventListener('mousemove', nileSlider.onMouseMove);\n  window.addEventListener('mouseup', nileSlider.onMouseUp);\n};\n\nexport const removeMoveListeners = (nileSlider: NileSlider): void => {\n  window.removeEventListener('mousemove', nileSlider.onMouseMove);\n  window.removeEventListener('mouseup', nileSlider.onMouseUp);\n};\n\nexport const handleTwoThumbClick = (\n  value: number,\n  nileSlider: NileSlider\n): void => {\n  const distToOne = Math.abs(value - nileSlider.rangeOneValue);\n  const distToTwo = Math.abs(value - nileSlider.rangeTwoValue);\n\n  if (distToOne <= distToTwo) {\n    const clamped = Math.min(value, nileSlider.rangeTwoValue);\n    nileSlider.rangeOneValue = nileSlider.checkValueValidity(clamped, nileSlider.minValue, nileSlider.maxValue);\n  } else {\n    const clamped = Math.max(value, nileSlider.rangeOneValue);\n    nileSlider.rangeTwoValue = nileSlider.checkValueValidity(clamped, nileSlider.minValue, nileSlider.maxValue);\n  }  \n\n  const percentOne = valueToPercent(nileSlider.rangeOneValue, nileSlider);\n  const percentTwo = valueToPercent(nileSlider.rangeTwoValue, nileSlider);\n\n  nileSlider.buttonOne.style.left = `${percentOne}%`;\n  nileSlider.buttonTwo.style.left = `${percentTwo}%`;\n\n  const left = Math.min(percentOne, percentTwo);\n  const width = Math.abs(percentTwo - percentOne);\n\n  nileSlider.completed.style.left = `${left}%`;\n  nileSlider.completed.style.width = `${width}%`;\n\n  nileSlider.emit(NileSliderEvents.NILE_BUTTON_FIRST_CHANGE, {\n    value: nileSlider.rangeOneValue,\n  });\n  nileSlider.emit(NileSliderEvents.NILE_BUTTON_LAST_CHANGE, {\n    value: nileSlider.rangeTwoValue,\n  });\n};\n"]}

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

@@ -48,7 +48,6 @@ export const styles = css `
     border-bottom: 0px;
   }
 
-  /* Import resizable styles */
   ${tableLayoutStyles}
 `;
 export default [styles];

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

@@ -1 +1 @@
-{"version":3,"file":"nile-table-body.css.js","sourceRoot":"","sources":["../../../src/nile-table-body/nile-table-body.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAEvE;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAwCrB,iBAAiB;CACpB,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';\nimport { tableLayoutStyles } from '../internal/resizable-table-styles';\n\n/**\n * TableBody CSS\n */\nexport const styles = css`\n  :host {\n    box-sizing: border-box;\n    --nile-table-background--odd: var(--nile-colors-base-white);\n    --nile-table-background--even: var(--nile-colors-base-white);\n  }\n\n  .base {\n    background-color: var(--nile-colors-white-base);\n    border: 1px solid var(--nile-table-row-border-color);\n    border-radius: var(--nile-radius-radius-xl);\n    box-shadow: 0px 1px 3px 0px rgba(16, 24, 40, 0.1),0px 1px 2px 0px rgba(16, 24, 40, 0.06);\n    overflow: hidden;\n  }\n\n  .table__header {\n    display: flex;\n    box-sizing: border-box;\n  }\n\n  .nile__table__body {\n    display: table;\n    border-collapse: collapse;\n    width: 100%;\n  }\n\n  slot::slotted(nile-table-row:nth-child(odd)) {\n    border-bottom: 1px solid var(--nile-colors-neutral-400);\n    background: var(--nile-table-background--odd);\n  }\n\n  slot::slotted(nile-table-row:nth-child(even)) {\n    background: var(--nile-table-background--even);\n  }\n\n  slot::slotted(nile-table-row:last-child) {\n    border-bottom: 0px;\n  }\n\n  /* Import resizable styles */\n  ${tableLayoutStyles}\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-table-body.css.js","sourceRoot":"","sources":["../../../src/nile-table-body/nile-table-body.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAEvE;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAuCrB,iBAAiB;CACpB,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';\nimport { tableLayoutStyles } from '../internal/resizable-table-styles';\n\n/**\n * TableBody CSS\n */\nexport const styles = css`\n  :host {\n    box-sizing: border-box;\n    --nile-table-background--odd: var(--nile-colors-base-white);\n    --nile-table-background--even: var(--nile-colors-base-white);\n  }\n\n  .base {\n    background-color: var(--nile-colors-white-base);\n    border: 1px solid var(--nile-table-row-border-color);\n    border-radius: var(--nile-radius-radius-xl);\n    box-shadow: 0px 1px 3px 0px rgba(16, 24, 40, 0.1),0px 1px 2px 0px rgba(16, 24, 40, 0.06);\n    overflow: hidden;\n  }\n\n  .table__header {\n    display: flex;\n    box-sizing: border-box;\n  }\n\n  .nile__table__body {\n    display: table;\n    border-collapse: collapse;\n    width: 100%;\n  }\n\n  slot::slotted(nile-table-row:nth-child(odd)) {\n    border-bottom: 1px solid var(--nile-colors-neutral-400);\n    background: var(--nile-table-background--odd);\n  }\n\n  slot::slotted(nile-table-row:nth-child(even)) {\n    background: var(--nile-table-background--even);\n  }\n\n  slot::slotted(nile-table-row:last-child) {\n    border-bottom: 0px;\n  }\n\n  ${tableLayoutStyles}\n`;\n\nexport default [styles];\n"]}

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

@@ -68,7 +68,6 @@ let NileTableBody = class NileTableBody extends NileElement {
                 row_data = [];
             }
         });
-        // Check for resizable columns after slot change
         this.checkForResizableColumns();
     }
     handleSort(e) {

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

@@ -1 +1 @@
-{"version":3,"file":"nile-table-body.js","sourceRoot":"","sources":["../../../src/nile-table-body/nile-table-body.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 {\n  LitElement,\n  html,\n  CSSResultArray,\n  TemplateResult,\n  PropertyValues,\n} from 'lit';\nimport {\n  customElement,\n  query,\n  state,\n  queryAll,\n  queryAssignedElements,\n  queryAssignedNodes,\n  property\n} from 'lit/decorators.js';\nimport { styles } from './nile-table-body.css';\nimport NileElement from '../internal/nile-element';\nimport { getInnerHTML } from '../slot';\nimport { hasResizableColumns } from '../internal/resizable-table-helper';\n\n/**\n * nile-table-body component.\n *\n * @tag nile-table-body\n *\n */\n@customElement('nile-table-body')\nexport class NileTableBody extends NileElement {\n  /**\n   * The styles for TableBody\n   * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n   */\n\n  @query('slot') defaultSlot: HTMLSlotElement;\n  @queryAssignedNodes({ flatten: true }) _childNodes!: Array<HTMLElement>;\n  @property() type: 'primary' | 'secondary' = 'primary';\n\n  @state() private rows_data: any[] = [];\n  @state() private header_rows_data: any[] = [];\n  @state() private sort__index: number;\n  @state() private search__index: number;\n  @state() private hasResizableColumns = false;\n\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n\n  protected firstUpdated(_changedProperties: PropertyValues): void {\n    this.emit('nile-body-load', { value: this.type, comp:this },true,false)\n  }\n\n  /* #endregion */\n\n  /* #region Methods */\n\n  private getChildren(child: any, tagname: string) {\n    return child.querySelectorAll(tagname);\n  }\n\n  private getIndexValue(index__value: string): number {\n    return this.header_rows_data.indexOf(index__value);\n  }\n\n  private checkForResizableColumns() {\n    this.hasResizableColumns = hasResizableColumns(this);\n  }\n\n  handleSlotchange(e: any) {\n    let row_data: any = [];\n    this._childNodes.forEach((child: any) => {\n      if (child.tagName && child?.tagName?.toLowerCase() === 'nile-table-row') {\n        let nilerows = this.getChildren(child, 'nile-table-cell-item');\n        if (nilerows.length > 0) {\n          nilerows.forEach((element: { innerHTML: any }) => {\n            row_data.push(element.innerHTML);\n          });\n          this.rows_data.push(row_data);\n        } else {\n          let nileheaders = this.getChildren(child, 'nile-table-header-item');\n          if (nileheaders.length > 0) {\n            nileheaders.forEach((header: HTMLSlotElement, index: number) => {\n              this.header_rows_data.push(header.innerHTML);\n            });\n          }\n        }\n        row_data = [];\n      }\n    });\n    \n    // Check for resizable columns after slot change\n    this.checkForResizableColumns();\n  }\n\n  private handleSort(e: any) {\n    const { curr_sort_string, order } = e.detail.value;\n    const header_index = this.getIndexValue(curr_sort_string);\n    this.emit('nile-sort', {\n      value: { header_index, curr_sort_string, order },\n    });\n  }\n\n  private handleSearch(e: any) {\n    const searchText = e.detail.value;\n    this.search__index = this.getIndexValue(e.target.textContent);\n    this.emit('nile-table-search', {\n      index: this.search__index,\n      value: searchText,\n    });\n  }\n\n  public render(): TemplateResult {\n    return html`\n      <div class=\"base\" part=\"base\">\n        <slot name=\"table__header\" class=\"table__header\"></slot>\n        <slot\n          @slotchange=${this.handleSlotchange}\n          @nile-click-sort=${this.handleSort}\n          class=\"nile__table__body\"\n          ?resizable=${this.hasResizableColumns}\n          @nile-search=${this.handleSearch}\n        ></slot>\n      </div>\n    `;\n  }\n\n  /* #endregion */\n}\n\nexport default NileTableBody;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-table-body': NileTableBody;\n  }\n}\n"]}
+{"version":3,"file":"nile-table-body.js","sourceRoot":"","sources":["../../../src/nile-table-body/nile-table-body.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 {\n  LitElement,\n  html,\n  CSSResultArray,\n  TemplateResult,\n  PropertyValues,\n} from 'lit';\nimport {\n  customElement,\n  query,\n  state,\n  queryAll,\n  queryAssignedElements,\n  queryAssignedNodes,\n  property\n} from 'lit/decorators.js';\nimport { styles } from './nile-table-body.css';\nimport NileElement from '../internal/nile-element';\nimport { getInnerHTML } from '../slot';\nimport { hasResizableColumns } from '../internal/resizable-table-helper';\n\n/**\n * nile-table-body component.\n *\n * @tag nile-table-body\n *\n */\n@customElement('nile-table-body')\nexport class NileTableBody extends NileElement {\n  /**\n   * The styles for TableBody\n   * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n   */\n\n  @query('slot') defaultSlot: HTMLSlotElement;\n  @queryAssignedNodes({ flatten: true }) _childNodes!: Array<HTMLElement>;\n  @property() type: 'primary' | 'secondary' = 'primary';\n\n  @state() private rows_data: any[] = [];\n  @state() private header_rows_data: any[] = [];\n  @state() private sort__index: number;\n  @state() private search__index: number;\n  @state() private hasResizableColumns = false;\n\n  public static get styles(): CSSResultArray {\n    return [styles];\n  }\n\n  protected firstUpdated(_changedProperties: PropertyValues): void {\n    this.emit('nile-body-load', { value: this.type, comp:this },true,false)\n  }\n\n  /* #endregion */\n\n  /* #region Methods */\n\n  private getChildren(child: any, tagname: string) {\n    return child.querySelectorAll(tagname);\n  }\n\n  private getIndexValue(index__value: string): number {\n    return this.header_rows_data.indexOf(index__value);\n  }\n\n  private checkForResizableColumns() {\n    this.hasResizableColumns = hasResizableColumns(this);\n  }\n\n  handleSlotchange(e: any) {\n    let row_data: any = [];\n    this._childNodes.forEach((child: any) => {\n      if (child.tagName && child?.tagName?.toLowerCase() === 'nile-table-row') {\n        let nilerows = this.getChildren(child, 'nile-table-cell-item');\n        if (nilerows.length > 0) {\n          nilerows.forEach((element: { innerHTML: any }) => {\n            row_data.push(element.innerHTML);\n          });\n          this.rows_data.push(row_data);\n        } else {\n          let nileheaders = this.getChildren(child, 'nile-table-header-item');\n          if (nileheaders.length > 0) {\n            nileheaders.forEach((header: HTMLSlotElement, index: number) => {\n              this.header_rows_data.push(header.innerHTML);\n            });\n          }\n        }\n        row_data = [];\n      }\n    });\n    \n    this.checkForResizableColumns();\n  }\n\n  private handleSort(e: any) {\n    const { curr_sort_string, order } = e.detail.value;\n    const header_index = this.getIndexValue(curr_sort_string);\n    this.emit('nile-sort', {\n      value: { header_index, curr_sort_string, order },\n    });\n  }\n\n  private handleSearch(e: any) {\n    const searchText = e.detail.value;\n    this.search__index = this.getIndexValue(e.target.textContent);\n    this.emit('nile-table-search', {\n      index: this.search__index,\n      value: searchText,\n    });\n  }\n\n  public render(): TemplateResult {\n    return html`\n      <div class=\"base\" part=\"base\">\n        <slot name=\"table__header\" class=\"table__header\"></slot>\n        <slot\n          @slotchange=${this.handleSlotchange}\n          @nile-click-sort=${this.handleSort}\n          class=\"nile__table__body\"\n          ?resizable=${this.hasResizableColumns}\n          @nile-search=${this.handleSearch}\n        ></slot>\n      </div>\n    `;\n  }\n\n  /* #endregion */\n}\n\nexport default NileTableBody;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-table-body': NileTableBody;\n  }\n}\n"]}

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

@@ -50,7 +50,6 @@ export const styles = css `
     display: block;
   }
 
-  /* Import resizable styles */
   ${resizableHostStyles}
   ${resizerStyles}
   ${resizableSlotStyles}

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

@@ -1 +1 @@
-{"version":3,"file":"nile-table-cell-item.css.js","sourceRoot":"","sources":["../../../src/nile-table-cell-item/nile-table-cell-item.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,mBAAmB,EAAE,aAAa,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AAE7G;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA0CrB,mBAAmB;IACnB,aAAa;IACb,mBAAmB;CACtB,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';\nimport { resizableHostStyles, resizerStyles, resizableSlotStyles } from '../internal/resizable-table-styles';\n\n/**\n * TableCellItem CSS\n */\nexport const styles = css`\n  :host {\n    --min-cell-width:auto;\n    --cell-width:auto;\n    --min--height: 52px;\n    --max--cell-width: auto;\n    box-sizing: border-box;\n    display: table-cell;\n    vertical-align: middle;\n    padding: 16px 24px;\n    max-width: var(--max--cell-width);  \n    min-height: var(--min--height);\n  }\n\n  .cell__wrapper {\n    height: 100%;\n    position: relative;\n    display: flex;\n    align-items: center;\n    overflow: hidden;\n    width: 100%;\n  }\n\n  .column {\n    min-width:var(--min-cell-width);\n    width:var(--cell-width);\n    height: 100%;\n    color: var(--nile-colors-gray-light-mode-600);\n    font-family: var(--nile-font-family-serif);\n    font-size: var(--nile-type-scale-3);\n    font-style: normal;\n    font-weight: var(--nile-font-weight-regular);\n    /* line-height: var(--nile-type-scale-6); */\n    line-height: normal;\n    letter-spacing: 0.2px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    display: block;\n  }\n\n  /* Import resizable styles */\n  ${resizableHostStyles}\n  ${resizerStyles}\n  ${resizableSlotStyles}\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-table-cell-item.css.js","sourceRoot":"","sources":["../../../src/nile-table-cell-item/nile-table-cell-item.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,mBAAmB,EAAE,aAAa,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AAE7G;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAyCrB,mBAAmB;IACnB,aAAa;IACb,mBAAmB;CACtB,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';\nimport { resizableHostStyles, resizerStyles, resizableSlotStyles } from '../internal/resizable-table-styles';\n\n/**\n * TableCellItem CSS\n */\nexport const styles = css`\n  :host {\n    --min-cell-width:auto;\n    --cell-width:auto;\n    --min--height: 52px;\n    --max--cell-width: auto;\n    box-sizing: border-box;\n    display: table-cell;\n    vertical-align: middle;\n    padding: 16px 24px;\n    max-width: var(--max--cell-width);  \n    min-height: var(--min--height);\n  }\n\n  .cell__wrapper {\n    height: 100%;\n    position: relative;\n    display: flex;\n    align-items: center;\n    overflow: hidden;\n    width: 100%;\n  }\n\n  .column {\n    min-width:var(--min-cell-width);\n    width:var(--cell-width);\n    height: 100%;\n    color: var(--nile-colors-gray-light-mode-600);\n    font-family: var(--nile-font-family-serif);\n    font-size: var(--nile-type-scale-3);\n    font-style: normal;\n    font-weight: var(--nile-font-weight-regular);\n    /* line-height: var(--nile-type-scale-6); */\n    line-height: normal;\n    letter-spacing: 0.2px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    display: block;\n  }\n\n  ${resizableHostStyles}\n  ${resizerStyles}\n  ${resizableSlotStyles}\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-table-header-item/nile-table-header-item.css.js

@@ -69,7 +69,6 @@ export const styles = css `
     opacity: 0.3;
   }
 
-  /* Import resizable styles */
   ${resizableHeaderStyles}
   ${headerResizerStyles}
 `;

package/dist/src/nile-table-header-item/nile-table-header-item.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-table-header-item.css.js","sourceRoot":"","sources":["../../../src/nile-table-header-item/nile-table-header-item.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,qBAAqB,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AAEhG;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA6DrB,qBAAqB;IACrB,mBAAmB;CACtB,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';\nimport { resizableHeaderStyles, headerResizerStyles } from '../internal/resizable-table-styles';\n\n/**\n * TableHeaderItem CSS\n */\nexport const styles = css`\n  :host {\n    --cell-min-width: auto;\n    --cell-width: auto;\n    display: table-cell;\n    box-sizing: border-box;\n  }\n  \n  .header__item__wrapper{\n    min-width:var(--cell-min-width);\n    width:var(--cell-width);\n    display:flex;\n    align-items:center;\n    box-sizing: border-box;\n    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-3xl);\n    min-height: 44px;\n    height: 44px;\n  }\n\n  .headers {\n    overflow:hidden;\n    display: flex;\n    align-items: center;\n    height: auto;\n    width: 100%;\n    gap: 8px;\n    color: var(--nile-colors-gray-light-mode-600);\n    font-family: var(--nile-font-family-serif);\n    font-feature-settings: 'clig' off, 'liga' off;\n    font-size: var(--nile-type-scale-2);\n    font-weight: 500;\n    font-style: normal;\n    /* line-height: var(--nile-type-scale-5); */\n    line-height: normal;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  nile-icon {\n    cursor: pointer;\n  }\n\n  .sorting__icons {\n    display: flex;\n    flex-direction: column;\n    align-items: centre;\n  }\n\n  .sorting__icons nile-icon:hover {\n    opacity: 0.4;\n  }\n\n  .hover__arrow {\n    opacity: 0;\n  }\n\n  .headers:hover .hover__arrow {\n    opacity: 0.3;\n  }\n\n  /* Import resizable styles */\n  ${resizableHeaderStyles}\n  ${headerResizerStyles}\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-table-header-item.css.js","sourceRoot":"","sources":["../../../src/nile-table-header-item/nile-table-header-item.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,qBAAqB,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AAEhG;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA4DrB,qBAAqB;IACrB,mBAAmB;CACtB,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';\nimport { resizableHeaderStyles, headerResizerStyles } from '../internal/resizable-table-styles';\n\n/**\n * TableHeaderItem CSS\n */\nexport const styles = css`\n  :host {\n    --cell-min-width: auto;\n    --cell-width: auto;\n    display: table-cell;\n    box-sizing: border-box;\n  }\n  \n  .header__item__wrapper{\n    min-width:var(--cell-min-width);\n    width:var(--cell-width);\n    display:flex;\n    align-items:center;\n    box-sizing: border-box;\n    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-3xl);\n    min-height: 44px;\n    height: 44px;\n  }\n\n  .headers {\n    overflow:hidden;\n    display: flex;\n    align-items: center;\n    height: auto;\n    width: 100%;\n    gap: 8px;\n    color: var(--nile-colors-gray-light-mode-600);\n    font-family: var(--nile-font-family-serif);\n    font-feature-settings: 'clig' off, 'liga' off;\n    font-size: var(--nile-type-scale-2);\n    font-weight: 500;\n    font-style: normal;\n    /* line-height: var(--nile-type-scale-5); */\n    line-height: normal;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  nile-icon {\n    cursor: pointer;\n  }\n\n  .sorting__icons {\n    display: flex;\n    flex-direction: column;\n    align-items: centre;\n  }\n\n  .sorting__icons nile-icon:hover {\n    opacity: 0.4;\n  }\n\n  .hover__arrow {\n    opacity: 0;\n  }\n\n  .headers:hover .hover__arrow {\n    opacity: 0.3;\n  }\n\n  ${resizableHeaderStyles}\n  ${headerResizerStyles}\n`;\n\nexport default [styles];\n"]}