npm - @aquera/nile-elements - Versions diffs - 1.0.1-beta-1.4 → 1.0.1-beta-1.6 - Mend

@aquera/nile-elements 1.0.1-beta-1.4 → 1.0.1-beta-1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (211) hide show

package/dist/src/nile-option-group/nile-option-group.css.d.ts ADDED Viewed

@@ -0,0 +1,12 @@
+/**
+* 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.
+*/
+/**
+ * OptionHeader CSS
+ */
+export declare const styles: import("lit").CSSResult;
+declare const _default: import("lit").CSSResult[];
+export default _default;

package/dist/src/nile-option-group/nile-option-group.css.js ADDED Viewed

@@ -0,0 +1,58 @@
+/**
+* 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';
+/**
+ * OptionHeader CSS
+ */
+export const styles = css `
+	.option-group-header {
+		height: 40px;
+		display: flex;
+		align-items: center;
+		padding: 0px 12px;
+		background-color: var(--nile-colors-dark-200);
+		color: var(--nile-colors-dark-900);
+		font-feature-settings: 'liga' off, 'clig' off;
+		font-family: 'colfax-medium';
+		font-size: 12px;
+		font-weight: 500;
+		width: 100%;
+		box-sizing: border-box;
+		justify-content: space-between;
+	}
+	.content-container {
+		display: flex;
+		justify-content: flex-start;
+		align-items: center;
+	}
+	.gap-18px {
+		gap: 14px;
+	}
+	.option-group-prefix,
+  .option-group-suffix {
+    flex: 0 0 auto;
+    display: flex;
+    align-items: center;
+  }
+  .option-group-prefix::slotted(*) {
+    margin-inline-end: 0.5rem;
+  }
+  .option-group-suffix::slotted(*) {
+    margin-inline-start: 0.5rem;
+  }
+  :host(.nile-group-hidden)::part(option-group-header) {
+	display: none !important;
+  }
+`;
+export default [styles];
+//# sourceMappingURL=nile-option-group.css.js.map

package/dist/src/nile-option-group/nile-option-group.css.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"nile-option-group.css.js","sourceRoot":"","sources":["../../../src/nile-option-group/nile-option-group.css.ts"],"names":[],"mappings":"AAAA;;;;;EAKE;AAEF,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6CxB,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 * OptionHeader CSS\n */\nexport const styles = css`\n\t.option-group-header {\n\t\theight: 40px;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tpadding: 0px 12px;\n\t\tbackground-color: var(--nile-colors-dark-200);\n\t\tcolor: var(--nile-colors-dark-900);\n\t\tfont-feature-settings: 'liga' off, 'clig' off;\n\t\tfont-family: 'colfax-medium';\n\t\tfont-size: 12px;\n\t\tfont-weight: 500;\n\t\twidth: 100%;\n\t\tbox-sizing: border-box;\n\t\tjustify-content: space-between;\n\t}\n\n\t.content-container {\n\t\tdisplay: flex;\n\t\tjustify-content: flex-start;\n\t\talign-items: center;\n\t}\n\n\t.gap-18px {\n\t\tgap: 14px;\n\t}\n\n\t.option-group-prefix,\n .option-group-suffix {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n }\n\n .option-group-prefix::slotted(*) {\n margin-inline-end: 0.5rem;\n }\n\n .option-group-suffix::slotted(*) {\n margin-inline-start: 0.5rem;\n }\n\n :host(.nile-group-hidden)::part(option-group-header) {\n\tdisplay: none !important;\n }\n`;\n\nexport default [styles];"]}

package/dist/src/nile-option-group/nile-option-group.d.ts ADDED Viewed

@@ -0,0 +1,23 @@
+/**
+ * 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 { CSSResultArray, TemplateResult } from 'lit';
+import NileElement from '../internal/nile-element';
+import { OptionGroupData } from './nile-option-group.interface';
+export declare class NileOptionGroup extends NileElement {
+    static get styles(): CSSResultArray;
+    name: string;
+    data: OptionGroupData | null;
+    private checkForImageOrIcon;
+    private normalizeImageDimension;
+    render(): TemplateResult;
+}
+export default NileOptionGroup;
+declare global {
+    interface HTMLElementTagNameMap {
+        'nile-option-group': NileOptionGroup;
+    }
+}

package/dist/src/nile-option-group/nile-option-group.interface.d.ts ADDED Viewed

@@ -0,0 +1,22 @@
+export interface IconData {
+    name: string;
+    size?: string;
+    color?: string;
+    method?: string;
+}
+export interface ImageData {
+    src?: string;
+    height?: string;
+    width?: string;
+}
+export interface PrefixSuffixData {
+    icon?: IconData;
+    prefixText?: string;
+    suffixText?: string;
+    image?: ImageData;
+}
+export interface OptionGroupData {
+    prefix?: PrefixSuffixData;
+    suffix?: PrefixSuffixData;
+    textContent?: string;
+}

package/dist/src/nile-option-group/nile-option-group.interface.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export {};
2	+ //# sourceMappingURL=nile-option-group.interface.js.map

package/dist/src/nile-option-group/nile-option-group.interface.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"nile-option-group.interface.js","sourceRoot":"","sources":["../../../src/nile-option-group/nile-option-group.interface.ts"],"names":[],"mappings":"","sourcesContent":["export interface IconData {\n name: string;\n size?: string;\n color?: string;\n method?: string;\n}\n\nexport interface ImageData {\n src?: string;\n height?: string;\n width?: string;\n}\n\nexport interface PrefixSuffixData {\n icon?: IconData;\n prefixText?: string;\n suffixText?: string;\n image?: ImageData;\n}\n\nexport interface OptionGroupData {\n prefix?: PrefixSuffixData;\n suffix?: PrefixSuffixData;\n textContent?: string;\n}"]}

package/dist/src/nile-option-group/nile-option-group.js ADDED Viewed

@@ -0,0 +1,76 @@
+/**
+ * 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-option-group.css';
+import NileElement from '../internal/nile-element';
+let NileOptionGroup = class NileOptionGroup extends NileElement {
+    constructor() {
+        super(...arguments);
+        this.name = "";
+        this.data = null;
+    }
+    static get styles() {
+        return [styles];
+    }
+    checkForImageOrIcon() {
+        return this.data?.prefix?.icon?.name || this.data?.prefix?.image?.src || this.data?.prefix?.prefixText;
+    }
+    normalizeImageDimension(value) {
+        if (value === undefined || value === null || value === "") {
+            return "20";
+        }
+        const dimension = Number(value);
+        if (isNaN(dimension) || dimension <= 0) {
+            return "20";
+        }
+        return dimension > 40 ? "25" : dimension.toString();
+    }
+    render() {
+        return html `
+			<div part="option-group-header" class="option-group-header">
+				<div part="content-container" class="content-container ${this.checkForImageOrIcon() ? 'gap-18px' : ''}">
+					<!-- prefix content -->
+					${this.data?.prefix?.icon?.name
+            ? html `<nile-icon part="prefix-icon" name="${this.data?.prefix?.icon?.name}" size="${this.data?.prefix?.icon?.size || "16"}" color="${this.data?.prefix?.icon?.color || "var(--nile-colors-dark-500)"}" method="${this.data?.prefix?.icon?.method || "fill"}"></nile-icon>`
+            : this.data?.prefix?.prefixText
+                ? html `<span part="prefix-text">${this.data?.prefix?.prefixText}</span>`
+                : this.data?.prefix?.image?.src
+                    ? html `<img part="prefix-image" src="${this.data?.prefix?.image?.src}" width="${this.normalizeImageDimension(this.data?.prefix?.image?.width)}" height="${this.normalizeImageDimension(this.data?.prefix?.image?.height)}">`
+                    : html `<slot part="prefix" name="prefix" class="option-group-prefix"></slot>`}
+					<!-- main content -->
+					${this.data?.textContent
+            ? html `<span part="content-text">${this.data?.textContent}</span>`
+            : html `<slot part="content"></slot>`}
+				</div>
+				<!-- suffix content -->
+				${this.data?.suffix?.icon?.name
+            ? html `<nile-icon part="suffix-icon" name="${this.data?.suffix?.icon?.name}" size="${this.data?.suffix?.icon?.size || "16"}" color="${this.data?.suffix?.icon?.color || "var(--nile-colors-dark-500)"}" method="${this.data?.suffix?.icon?.method || "fill"}"></nile-icon>`
+            : this.data?.suffix?.suffixText
+                ? html `<span part="suffix-text">${this.data?.suffix?.suffixText}</span>`
+                : this.data?.suffix?.image?.src
+                    ? html `<img part="suffix-image" src="${this.data?.prefix?.image?.src}" width="${this.normalizeImageDimension(this.data?.suffix?.image?.width)}" height="${this.normalizeImageDimension(this.data?.suffix?.image?.height)}">`
+                    : html `<slot part="suffix" name="suffix" class="option-group-suffix"></slot>`}
+			</div>
+			`;
+    }
+};
+__decorate([
+    property({ type: String, reflect: true, attribute: true })
+], NileOptionGroup.prototype, "name", void 0);
+__decorate([
+    property({ type: Object, attribute: true })
+], NileOptionGroup.prototype, "data", void 0);
+NileOptionGroup = __decorate([
+    customElement('nile-option-group')
+], NileOptionGroup);
+export { NileOptionGroup };
+export default NileOptionGroup;
+//# sourceMappingURL=nile-option-group.js.map

package/dist/src/nile-option-group/nile-option-group.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"nile-option-group.js","sourceRoot":"","sources":["../../../src/nile-option-group/nile-option-group.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 {LitElement, html, CSSResultArray, TemplateResult} from 'lit';\nimport { customElement, property} from 'lit/decorators.js';\nimport {styles} from './nile-option-group.css';\nimport NileElement from '../internal/nile-element';\nimport { OptionGroupData } from './nile-option-group.interface';\n\n@customElement('nile-option-group')\nexport class NileOptionGroup extends NileElement {\n\n\tpublic static get styles(): CSSResultArray {\n\t\treturn [styles];\n\t}\n\n\t@property({type: String, reflect: true, attribute: true}) name: string = \"\";\n\t@property({type: Object, attribute: true}) data: OptionGroupData | null = null;\n\n\tprivate checkForImageOrIcon() {\n\t\treturn this.data?.prefix?.icon?.name || this.data?.prefix?.image?.src || this.data?.prefix?.prefixText;\n\t}\n\n\tprivate normalizeImageDimension(value?: string | number): string {\n\t\tif (value === undefined || value === null || value === \"\") {\n\t\t\treturn \"20\";\n\t\t}\n\t\t\n\t\tconst dimension = Number(value);\n\t\tif (isNaN(dimension) || dimension <= 0) {\n\t\t\treturn \"20\";\n\t\t}\t\n\t\treturn dimension > 40 ? \"25\" : dimension.toString();\n\t}\t\n\n\tpublic render(): TemplateResult {\n\t\treturn html`\n\t\t\t<div part=\"option-group-header\" class=\"option-group-header\">\n\t\t\t\t<div part=\"content-container\" class=\"content-container ${this.checkForImageOrIcon() ? 'gap-18px' : ''}\">\n\t\t\t\t\t\n\t\t\t\t\t${\n\t\t\t\t\t\tthis.data?.prefix?.icon?.name\n\t\t\t\t\t\t? html`<nile-icon part=\"prefix-icon\" name=\"${this.data?.prefix?.icon?.name}\" size=\"${this.data?.prefix?.icon?.size || \"16\"}\" color=\"${this.data?.prefix?.icon?.color || \"var(--nile-colors-dark-500)\"}\" method=\"${this.data?.prefix?.icon?.method || \"fill\"}\"></nile-icon>`\n\t\t\t\t\t\t: this.data?.prefix?.prefixText\n\t\t\t\t\t\t\t? html`<span part=\"prefix-text\">${this.data?.prefix?.prefixText}</span>`\n\t\t\t\t\t\t\t: this.data?.prefix?.image?.src\n\t\t\t\t\t\t\t\t? html`<img part=\"prefix-image\" src=\"${this.data?.prefix?.image?.src}\" width=\"${this.normalizeImageDimension(this.data?.prefix?.image?.width)}\" height=\"${this.normalizeImageDimension(this.data?.prefix?.image?.height)}\">`\n\t\t\t\t\t\t\t\t: html`<slot part=\"prefix\" name=\"prefix\" class=\"option-group-prefix\"></slot>`\n\t\t\t\t\t}\n\n\t\t\t\t\t\n\t\t\t\t\t${\n\t\t\t\t\t\tthis.data?.textContent\n\t\t\t\t\t\t? html`<span part=\"content-text\">${this.data?.textContent}</span>`\n\t\t\t\t\t\t: html`<slot part=\"content\"></slot>`\n\t\t\t\t\t}\n\t\t\t\t</div>\n\n\t\t\t\t\n\t\t\t\t${\n\t\t\t\t\tthis.data?.suffix?.icon?.name\n\t\t\t\t\t? html`<nile-icon part=\"suffix-icon\" name=\"${this.data?.suffix?.icon?.name}\" size=\"${this.data?.suffix?.icon?.size || \"16\"}\" color=\"${this.data?.suffix?.icon?.color || \"var(--nile-colors-dark-500)\"}\" method=\"${this.data?.suffix?.icon?.method || \"fill\"}\"></nile-icon>`\n\t\t\t\t\t: this.data?.suffix?.suffixText\n\t\t\t\t\t\t? html`<span part=\"suffix-text\">${this.data?.suffix?.suffixText}</span>`\n\t\t\t\t\t\t: this.data?.suffix?.image?.src\n\t\t\t\t\t\t\t? html`<img part=\"suffix-image\" src=\"${this.data?.prefix?.image?.src}\" width=\"${this.normalizeImageDimension(this.data?.suffix?.image?.width)}\" height=\"${this.normalizeImageDimension(this.data?.suffix?.image?.height)}\">`\n\t\t\t\t\t\t\t: html`<slot part=\"suffix\" name=\"suffix\" class=\"option-group-suffix\"></slot>`\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t`;\n\t}\n}\n\nexport default NileOptionGroup;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-option-group': NileOptionGroup;\n }\n}"]}

package/dist/src/nile-pagination/nile-pagination.css.js CHANGED Viewed

@@ -261,6 +261,13 @@ export const styles = css `
     transform: rotate(180deg);
   }
+  .prev-button::part(base) {
+    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));
+  }
+  .next-button::part(base) {
+    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));
+  }
 `;
 export default [styles];

package/dist/src/nile-pagination/nile-pagination.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nile-pagination.css.js","sourceRoot":"","sources":["../../../src/nile-pagination/nile-pagination.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8PxB,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 Pagination CSS\n */\nexport const styles = css`\n :host {\n }\n\n .pagination-wrapper {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: var(--nile-spacing-spacing-md, var(--ng-spacing-md)) var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) ;\n }\n\n \n .pagination-wrapper.v2 .pager-container {\n flex-direction: row;\n align-items: center;\n gap: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n margin-right: var(--nile-spacing-spacing-xl, var(--ng-spacing-xl)); \n }\n\n .pagination-wrapper.v2 .range-text {\n margin-right: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n font-size: var(--nile-font-size-small, var(--ng-font-size-text-sm));\n color: var(--nile-colors-dark-900, var( --ng-colors-text-primary-900));\n font-feature-settings: 'liga' off, 'clig' off;\n font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n }\n\n \n .pagination-wrapper.compact {\n min-width: 324px;\n justify-content: space-between;\n }\n\n\n\n.pagination-wrapper.compact .range-text {\n margin-right: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n white-space: nowrap;\n}\n\n\n.pagination-wrapper.compact .pager-container {\n gap: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n}\n\n\n .pagination-wrapper.compact .pager-container {\n display: flex;\n align-items: center;\n gap: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n }\n\n .pagination-wrapper.compact .page-size-dropdown ::part(base) {\n min-width: 32px;\n height: 32px;\n padding: 0 6px;\n }\n\n .pagination-wrapper.compact .page-size-dropdown .chevron {\n transition: transform 0.2s;\n }\n .pagination-wrapper.compact .page-size-dropdown .open .chevron {\n transform: rotate(180deg);\n }\n\n .pagination-wrapper.compact ul.pagination:not(.compact-pagination) {\n display: none;\n }\n\n .compact-pagination {\n display: flex;\n align-items: center;\n gap: var(--nile-spacing-spacing-xs, var(--ng-spacing-xs));\n list-style: none;\n margin: 0;\n padding: 0;\n }\n .page-dropdown .current-page-btn {\n padding: 2px;\n font-size: var(--nile-font-size-small, var(--ng-font-weight-regular));\n }\n\n nile-button.current-page-btn::part(base){\n min-width: 51px;\n }\n\n nile-button.current-page-btn::part(base):active {\n min-width: 51px;\n}\n\n .pager-container {\n display: flex;\n align-items: center;\n gap: var(--nile-spacing-spacing-3xl, var(--ng-spacing-3xl));\n }\n\n.pagination-wrapper.compact .pager-container {\n gap: var(--nile-spacing-xxs, var(--ng-spacing-xxs)) !important;\n}\n\n .range-text {\n font-size: var(--nile-font-size-small, var(--ng-font-weight-regular));\n color: var(--nile-colors-dark-900,var( --ng-colors-text-primary-900) );\n white-space: nowrap;\n }\n\n .page-size-select {\n display: inline-flex;\n align-items: center;\n }\n\n ul.pagination {\n display: flex;\n list-style: none;\n padding: var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n margin: var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n gap: var(--nile-radius-radius-xxs, var(--ng-radius-xxs));\n }\n\n ul.pagination li {\n margin: var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n }\n\n .ellipsis-scroll-wrapper {\n max-height: 194px;\n overflow-y: auto;\n width: 66px;\n }\n .down-scroll-wrapper {\n max-height: 150px;\n overflow-y: auto;\n width: 60px;\n }\n\n\n .compact-scroll-wrapper {\n max-height: 160px;\n overflow-y: auto;\n width: 60px;\n }\n .compact-dropdown nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n \n .page-size-dropdown nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n\n .compact-scroll-wrapper1 {\n max-height: 164px;\n overflow-y: auto;\n width: 60px;\n }\n\n .compact-dropdown1 nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n \n .compact-dropdown1 nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n\n\n .ellipsis-dropdown nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n\n .page-size-menu {\n max-height: 144px;\n overflow-y: auto;\n }\n\n.pagination-wrapper.fluid ul.pagination li:first-child {\n margin-right: var(--nile-spacing-spacing-xs, var(--ng-spacing-xs));\n}\n.pagination-wrapper.fluid ul.pagination li:last-child {\n margin-left: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n}\n\n\n .page-size-label {\n font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n color: var(--nile-colors-dark-500, var(--ng-colors-text-primary-500));\n margin-left: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n font-feature-settings: 'liga' off, 'clig' off;\n font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular)); \n }\n\n nile-button::part(base) {\n min-width: 32px;\n height: 32px;\n padding: 0px 6px;\n box-shadow: none;\n }\n \n nile-button.down::part(base) {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n }\n\n nile-button.down::part(base):active {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n }\n\n\n nile-button.current-page-btn::part(base) {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary)); \n }\n\n nile-button.current-page-btn::part(base):active {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n }\n \n nile-button::part(base):active {\n min-width: 32px;\n height: 32px;\n padding: 0px 6px;\n box-shadow: none;\n border: none;\n }\n\n nile-button.down::part(base) {\n min-width: 62px;\n }\n\n nile-button.compactbtn:part(base){\n background-color: red;\n }\n .page-size-dropdown .chevron {\n transition: transform 0.2s;\n }\n .page-size-dropdown .open .chevron {\n transform: rotate(180deg);\n }\n \n .pagination-wrapper.compact .compact-dropdown .chevron,\n .pagination-wrapper.compact .compact-dropdown1 .chevron {\n transition: transform 0.2s;\n }\n .pagination-wrapper.compact .compact-dropdown .down.open .chevron,\n .pagination-wrapper.compact .compact-dropdown1 .current-page-btn.open .chevron {\n transform: rotate(180deg);\n }\n\n\n`;\n\nexport default [styles];\n"]}
1	+ {"version":3,"file":"nile-pagination.css.js","sourceRoot":"","sources":["../../../src/nile-pagination/nile-pagination.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqQxB,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 Pagination CSS\n */\nexport const styles = css`\n :host {\n }\n\n .pagination-wrapper {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: var(--nile-spacing-spacing-md, var(--ng-spacing-md)) var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) ;\n }\n\n \n .pagination-wrapper.v2 .pager-container {\n flex-direction: row;\n align-items: center;\n gap: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n margin-right: var(--nile-spacing-spacing-xl, var(--ng-spacing-xl)); \n }\n\n .pagination-wrapper.v2 .range-text {\n margin-right: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n font-size: var(--nile-font-size-small, var(--ng-font-size-text-sm));\n color: var(--nile-colors-dark-900, var( --ng-colors-text-primary-900));\n font-feature-settings: 'liga' off, 'clig' off;\n font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n }\n\n \n .pagination-wrapper.compact {\n min-width: 324px;\n justify-content: space-between;\n }\n\n\n\n.pagination-wrapper.compact .range-text {\n margin-right: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n white-space: nowrap;\n}\n\n\n.pagination-wrapper.compact .pager-container {\n gap: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n}\n\n\n .pagination-wrapper.compact .pager-container {\n display: flex;\n align-items: center;\n gap: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n }\n\n .pagination-wrapper.compact .page-size-dropdown ::part(base) {\n min-width: 32px;\n height: 32px;\n padding: 0 6px;\n }\n\n .pagination-wrapper.compact .page-size-dropdown .chevron {\n transition: transform 0.2s;\n }\n .pagination-wrapper.compact .page-size-dropdown .open .chevron {\n transform: rotate(180deg);\n }\n\n .pagination-wrapper.compact ul.pagination:not(.compact-pagination) {\n display: none;\n }\n\n .compact-pagination {\n display: flex;\n align-items: center;\n gap: var(--nile-spacing-spacing-xs, var(--ng-spacing-xs));\n list-style: none;\n margin: 0;\n padding: 0;\n }\n .page-dropdown .current-page-btn {\n padding: 2px;\n font-size: var(--nile-font-size-small, var(--ng-font-weight-regular));\n }\n\n nile-button.current-page-btn::part(base){\n min-width: 51px;\n }\n\n nile-button.current-page-btn::part(base):active {\n min-width: 51px;\n}\n\n .pager-container {\n display: flex;\n align-items: center;\n gap: var(--nile-spacing-spacing-3xl, var(--ng-spacing-3xl));\n }\n\n.pagination-wrapper.compact .pager-container {\n gap: var(--nile-spacing-xxs, var(--ng-spacing-xxs)) !important;\n}\n\n .range-text {\n font-size: var(--nile-font-size-small, var(--ng-font-weight-regular));\n color: var(--nile-colors-dark-900,var( --ng-colors-text-primary-900) );\n white-space: nowrap;\n }\n\n .page-size-select {\n display: inline-flex;\n align-items: center;\n }\n\n ul.pagination {\n display: flex;\n list-style: none;\n padding: var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n margin: var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n gap: var(--nile-radius-radius-xxs, var(--ng-radius-xxs));\n }\n\n ul.pagination li {\n margin: var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n }\n\n .ellipsis-scroll-wrapper {\n max-height: 194px;\n overflow-y: auto;\n width: 66px;\n }\n .down-scroll-wrapper {\n max-height: 150px;\n overflow-y: auto;\n width: 60px;\n }\n\n\n .compact-scroll-wrapper {\n max-height: 160px;\n overflow-y: auto;\n width: 60px;\n }\n .compact-dropdown nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n \n .page-size-dropdown nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n\n .compact-scroll-wrapper1 {\n max-height: 164px;\n overflow-y: auto;\n width: 60px;\n }\n\n .compact-dropdown1 nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n \n .compact-dropdown1 nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n\n\n .ellipsis-dropdown nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n\n .page-size-menu {\n max-height: 144px;\n overflow-y: auto;\n }\n\n.pagination-wrapper.fluid ul.pagination li:first-child {\n margin-right: var(--nile-spacing-spacing-xs, var(--ng-spacing-xs));\n}\n.pagination-wrapper.fluid ul.pagination li:last-child {\n margin-left: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n}\n\n\n .page-size-label {\n font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n color: var(--nile-colors-dark-500, var(--ng-colors-text-primary-500));\n margin-left: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n font-feature-settings: 'liga' off, 'clig' off;\n font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular)); \n }\n\n nile-button::part(base) {\n min-width: 32px;\n height: 32px;\n padding: 0px 6px;\n box-shadow: none;\n }\n \n nile-button.down::part(base) {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n }\n\n nile-button.down::part(base):active {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n }\n\n\n nile-button.current-page-btn::part(base) {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary)); \n }\n\n nile-button.current-page-btn::part(base):active {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n }\n \n nile-button::part(base):active {\n min-width: 32px;\n height: 32px;\n padding: 0px 6px;\n box-shadow: none;\n border: none;\n }\n\n nile-button.down::part(base) {\n min-width: 62px;\n }\n\n nile-button.compactbtn:part(base){\n background-color: red;\n }\n .page-size-dropdown .chevron {\n transition: transform 0.2s;\n }\n .page-size-dropdown .open .chevron {\n transform: rotate(180deg);\n }\n \n .pagination-wrapper.compact .compact-dropdown .chevron,\n .pagination-wrapper.compact .compact-dropdown1 .chevron {\n transition: transform 0.2s;\n }\n .pagination-wrapper.compact .compact-dropdown .down.open .chevron,\n .pagination-wrapper.compact .compact-dropdown1 .current-page-btn.open .chevron {\n transform: rotate(180deg);\n }\n\n .prev-button::part(base) {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n }\n\n .next-button::part(base) {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n }\n\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-pagination/nile-pagination.js CHANGED Viewed

@@ -154,6 +154,7 @@ let NilePagination = class NilePagination extends NileElement {
           variant="tertiary"
           ?disabled=${this.currentPage === 1 || this.disabled}
           @click=${() => this.goToPage(this.currentPage - 1)}
+          class="prev-button"
         >
           <nile-icon name="var(--nile-icon-arrow-left, var(--ng-icon-chevron-left))" method="var(--nile-svg-method-fill, var(--ng-svg-method-stroke))" size="14"></nile-icon>
         </nile-button>
@@ -167,8 +168,9 @@ let NilePagination = class NilePagination extends NileElement {
           variant="tertiary"
           ?disabled=${this.currentPage === this.totalPages || this.disabled}
           @click=${() => this.goToPage(this.currentPage + 1)}
+          class="next-button"
         >
-          <nile-icon name="var(--nile-icon-arrow-right, var(--ng-chevron-right))" method="var(--nile-svg-method-fill, var(--ng-svg-method-stroke))" size="14"></nile-icon>
+          <nile-icon name="var(--nile-icon-arrow-right, var(--ng-icon-chevron-right))" method="var(--nile-svg-method-fill, var(--ng-svg-method-stroke))" size="14"></nile-icon>
         </nile-button>
       </li>
     `;

package/dist/src/nile-pagination/nile-pagination.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nile-pagination.js","sourceRoot":"","sources":["../../../src/nile-pagination/nile-pagination.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 { LitElement, html, CSSResultArray, TemplateResult } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { styles } from './nile-pagination.css';\nimport NileElement from '../internal/nile-element';\nimport {\n calculateTotalPages,\n getPaginationItems,\n getHiddenPages,\n getRangeText,\n} from './nile-pagination-utils';\n\n@customElement('nile-pagination')\nexport class NilePagination extends NileElement {\n public static get styles(): CSSResultArray {\n return [styles];\n }\n\n @property({attribute: 'totalitems',reflect: true,converter: {\n fromAttribute: (v: string) => {\n const n = Number(v);\n return Number.isFinite(n) && n >= 0 ? Math.floor(n) : 0;\n },\n },\n })totalItems: number = 0;\n\n @property({attribute: 'currentpage', reflect: true, converter: {\n fromAttribute: (v: string) => {\n const n = Number(v);\n return Number.isFinite(n) && n >= 1 ? Math.floor(n) : 1;\n },\n },\n })currentPage: number = 1;\n\n @property({attribute: 'pagesize',reflect: true,converter: {\n fromAttribute: (v: string) => {\n const n = Number(v);\n return Number.isFinite(n) && n >= 1 ? Math.floor(n) : 50;\n },\n },\n })pageSize: number = 50;\n\n @property({ attribute: 'pagesizeoptions', reflect: false, converter: { fromAttribute: (v: string) => {\n try {\n const arr = JSON.parse(v);\n if (Array.isArray(arr) && arr.every(x => typeof x === 'number')) {\n return arr as number[];\n }\n } catch {}\n return [10, 25, 50, 100];\n }}})\n pageSizeOptions: number[] = [10, 25, 50, 100];\n\n @property({ type: String })variant: 'fluid' \| 'compact' = 'fluid';\n @property({ type: Boolean }) disabled = false;\n @property({ type: Boolean }) showTitle = true;\n\n @state() private _pageSizeOpen = false;\n @state() private _pageOpen = false;\n @query('.page-size-dropdown') private _pageSizeDropdown!: HTMLElement;\n\n firstUpdated() {\n if (this._pageSizeDropdown) { \n this._pageSizeDropdown.addEventListener('nile-show', () => {\n this._pageSizeOpen = true;\n });\n this._pageSizeDropdown.addEventListener('nile-after-hide', () => {\n this._pageSizeOpen = false;\n });\n }\n }\n\n private get totalPages(): number {\n return Math.max(1, calculateTotalPages(this.totalItems, this.pageSize));\n }\n\n private goToPage(newPage: number) {\n \n if (this.disabled) return;\n const previousPage = this.currentPage;\n this.currentPage = newPage;\n this.emit('nile-change', { page: newPage, previousPage, pageSize: this.pageSize });\n }\n\n private onPageSizeSelect(newSize: number) {\n if (this.disabled \|\| this.pageSize === newSize) return;\n\n const previousPage = this.currentPage;\n this.pageSize = newSize;\n this.currentPage = 1;\n this.emit('nile-change', {\n page: 1,\n previousPage,\n pageSize: newSize\n });\n}\n\nprivate renderCompactRangeText(): TemplateResult {\n const full = getRangeText(this.totalItems, this.pageSize, this.currentPage);\n const trimmed = full.replace(/^Showing\\s/, ''); \n return html`<div class=\"range-text\">${trimmed}</div>`;\n}\n\n\n private renderRangeText(): TemplateResult {\n if (this.totalItems === 0) {\n return html`<div class=\"range-text\">Showing 0 of 0</div>`;\n }\n return html`\n <div part=\"range-text\" class=\"range-text\">\n ${getRangeText(this.totalItems, this.pageSize, this.currentPage)}\n </div>\n `;\n }\n\n private renderPageSizeSelect(): TemplateResult \| null {\n if (this.variant !== 'fluid') return null;\n return html`\n <div class=\"page-size-select\">\n <nile-dropdown class=\"page-size-dropdown\" ?disabled=${this.disabled}>\n <nile-button\n slot=\"trigger\"\n variant=\"tertiary\"\n class=\"down ${this._pageSizeOpen ? 'open' : ''}\"\n ?disabled=${this.disabled}\n >\n ${this.pageSize}\n <nile-icon\n name=\"var(--nile-icon-chevron-down, var(--ng-icon-chevron-down))\"\n size=\"14\"\n method=\"var(--nile-svg-method-fill, var(--ng-svg-method-stroke))\"\n class=\"chevron\"\n ></nile-icon>\n </nile-button>\n <nile-menu>\n <div class=\"down-scroll-wrapper\">\n ${this.pageSizeOptions.map(\n size => html`\n <nile-menu-item\n ?disabled=${this.disabled}\n @click=${() => this.onPageSizeSelect(size)}\n >\n ${size}\n </nile-menu-item>\n `\n )}\n </div>\n </nile-menu>\n </nile-dropdown>\n <span part=\"pagesize-label\" class=\"page-size-label\">Items per page</span>\n </div>\n `;\n }\n\n\n private renderCompactPageSize(): TemplateResult {\n return html`\n <nile-dropdown\n class=\"compact-dropdown\"\n ?disabled=${this.disabled}\n @nile-show=${() => (this._pageSizeOpen = true)}\n @nile-after-hide=${() => (this._pageSizeOpen = false)}\n >\n <nile-button\n slot=\"trigger\"\n variant=\"tertiary\"\n class=\"down ${this._pageSizeOpen ? 'open' : ''}\"\n ?disabled=${this.disabled}\n >\n ${this.pageSize}\n <nile-icon\n name=\"var(--nile-icon-chevron-down, var(--ng-icon-chevron-down))\"\n size=\"14\"\n method=\"var(--nile-svg-method-fill, var(--ng-svg-method-stroke))\"\n class=\"chevron\"\n ></nile-icon>\n </nile-button>\n <nile-menu>\n <div class=\"compact-scroll-wrapper\">\n ${this.pageSizeOptions.map(\n size => html`\n <nile-menu-item\n ?disabled=${this.disabled}\n @click=${() => this.onPageSizeSelect(size)}\n >\n ${size}\n </nile-menu-item>\n `\n )}\n </div>\n </nile-menu>\n </nile-dropdown>\n `;\n }\n \n\n private renderPrevButton(): TemplateResult {\n return html`\n <li>\n <nile-button\n variant=\"tertiary\"\n ?disabled=${this.currentPage === 1 \|\| this.disabled}\n @click=${() => this.goToPage(this.currentPage - 1)}\n >\n <nile-icon name=\"var(--nile-icon-arrow-left, var(--ng-icon-chevron-left))\" method=\"var(--nile-svg-method-fill, var(--ng-svg-method-stroke))\" size=\"14\"></nile-icon>\n </nile-button>\n </li>\n `;\n }\n\n private renderNextButton(): TemplateResult {\n return html`\n <li>\n <nile-button\n variant=\"tertiary\"\n ?disabled=${this.currentPage === this.totalPages \|\| this.disabled}\n @click=${() => this.goToPage(this.currentPage + 1)}\n >\n <nile-icon name=\"var(--nile-icon-arrow-right, var(--ng-chevron-right))\" method=\"var(--nile-svg-method-fill, var(--ng-svg-method-stroke))\" size=\"14\"></nile-icon>\n </nile-button>\n </li>\n `;\n }\n\n private renderPageItem(\n item: number \| string,\n idx: number,\n items: (number \| string)[]\n ): TemplateResult {\n if (item === '…') {\n return html`\n <li>\n <nile-dropdown class=\"ellipsis-dropdown\" ?disabled=${this.disabled}>\n <nile-button slot=\"trigger\" variant=\"ghost\" ?disabled=${this.disabled}>\n …\n </nile-button>\n <nile-menu>\n <div class=\"ellipsis-scroll-wrapper\">\n ${getHiddenPages(\n this.totalPages,\n items,\n this.currentPage,\n idx < items.indexOf(this.currentPage) ? 'left' : 'right'\n ).map(\n page => html`\n <nile-menu-item\n ?disabled=${this.disabled}\n @click=${() => this.goToPage(page)}\n >\n ${page}\n </nile-menu-item>\n `\n )}\n </div>\n </nile-menu>\n </nile-dropdown>\n </li>\n `;\n }\n return html`\n <li>\n <nile-button\n variant=${item === this.currentPage ? 'primary' : 'ghost'}\n ?disabled=${this.disabled}\n @click=${() => this.goToPage(item as number)}\n >\n ${item}\n </nile-button>\n </li>\n `;\n }\n\n private renderPageList(): TemplateResult {\n if (this.variant === 'compact') {\n return html`\n <nav aria-label=\"Pagination\">\n <ul class=\"pagination compact-pagination\">\n ${this.renderPrevButton()}\n <li>\n <nile-dropdown\n class=\"compact-dropdown1\"\n ?disabled=${this.disabled}\n @nile-show=${() => (this._pageOpen = true)}\n @nile-after-hide=${() => (this._pageOpen = false)}\n >\n <nile-button\n slot=\"trigger\"\n variant=\"tertiary\"\n class=\"current-page-btn ${this._pageOpen ? 'open' : ''}\"\n ?disabled=${this.disabled}\n >\n ${this.currentPage}\n <nile-icon\n name=\"var(--nile-icon-chevron-down, var(--ng-icon-chevron-down))\"\n size=\"14\"\n method=\"var(--nile-svg-method-fill, var(--ng-svg-method-stroke))\"\n class=\"chevron\"\n ></nile-icon>\n </nile-button>\n <nile-menu>\n <div class=\"compact-scroll-wrapper1\">\n ${Array.from({ length: this.totalPages }, (_, i) => i + 1).map(\n p => html`\n <nile-menu-item\n ?disabled=${this.disabled}\n @click=${() => this.goToPage(p)}\n >\n ${p}\n </nile-menu-item>\n `\n )}\n </div>\n </nile-menu>\n </nile-dropdown>\n </li>\n ${this.renderNextButton()}\n </ul>\n </nav>\n `;\n }\n const items = getPaginationItems(this.totalPages, this.currentPage);\n return html`\n <nav aria-label=\"Pagination\">\n <ul part=\"page-list\" class=\"pagination\">\n ${this.renderPrevButton()}\n ${items.map((item, idx) => this.renderPageItem(item, idx, items))}\n ${this.renderNextButton()}\n </ul>\n </nav>\n `;\n }\n\n public render(): TemplateResult {\n return html`\n <div part=\"wrapper\" class=\"pagination-wrapper ${this.variant}\">\n <div part=\"pager-container\" class=\"pager-container\">\n ${this.variant === 'fluid' && this.showTitle\n ? this.renderRangeText()\n : this.variant === 'compact'\n ? this.renderCompactRangeText()\n : null}\n ${this.variant === 'fluid'\n ? this.renderPageSizeSelect()\n : this.renderCompactPageSize()}\n </div>\n ${this.renderPageList()}\n </div>\n `;\n}\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-pagination': NilePagination;\n }\n}\n"]}
1	+ {"version":3,"file":"nile-pagination.js","sourceRoot":"","sources":["../../../src/nile-pagination/nile-pagination.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 { LitElement, html, CSSResultArray, TemplateResult } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { styles } from './nile-pagination.css';\nimport NileElement from '../internal/nile-element';\nimport {\n calculateTotalPages,\n getPaginationItems,\n getHiddenPages,\n getRangeText,\n} from './nile-pagination-utils';\n\n@customElement('nile-pagination')\nexport class NilePagination extends NileElement {\n public static get styles(): CSSResultArray {\n return [styles];\n }\n\n @property({attribute: 'totalitems',reflect: true,converter: {\n fromAttribute: (v: string) => {\n const n = Number(v);\n return Number.isFinite(n) && n >= 0 ? Math.floor(n) : 0;\n },\n },\n })totalItems: number = 0;\n\n @property({attribute: 'currentpage', reflect: true, converter: {\n fromAttribute: (v: string) => {\n const n = Number(v);\n return Number.isFinite(n) && n >= 1 ? Math.floor(n) : 1;\n },\n },\n })currentPage: number = 1;\n\n @property({attribute: 'pagesize',reflect: true,converter: {\n fromAttribute: (v: string) => {\n const n = Number(v);\n return Number.isFinite(n) && n >= 1 ? Math.floor(n) : 50;\n },\n },\n })pageSize: number = 50;\n\n @property({ attribute: 'pagesizeoptions', reflect: false, converter: { fromAttribute: (v: string) => {\n try {\n const arr = JSON.parse(v);\n if (Array.isArray(arr) && arr.every(x => typeof x === 'number')) {\n return arr as number[];\n }\n } catch {}\n return [10, 25, 50, 100];\n }}})\n pageSizeOptions: number[] = [10, 25, 50, 100];\n\n @property({ type: String })variant: 'fluid' \| 'compact' = 'fluid';\n @property({ type: Boolean }) disabled = false;\n @property({ type: Boolean }) showTitle = true;\n\n @state() private _pageSizeOpen = false;\n @state() private _pageOpen = false;\n @query('.page-size-dropdown') private _pageSizeDropdown!: HTMLElement;\n\n firstUpdated() {\n if (this._pageSizeDropdown) { \n this._pageSizeDropdown.addEventListener('nile-show', () => {\n this._pageSizeOpen = true;\n });\n this._pageSizeDropdown.addEventListener('nile-after-hide', () => {\n this._pageSizeOpen = false;\n });\n }\n }\n\n private get totalPages(): number {\n return Math.max(1, calculateTotalPages(this.totalItems, this.pageSize));\n }\n\n private goToPage(newPage: number) {\n \n if (this.disabled) return;\n const previousPage = this.currentPage;\n this.currentPage = newPage;\n this.emit('nile-change', { page: newPage, previousPage, pageSize: this.pageSize });\n }\n\n private onPageSizeSelect(newSize: number) {\n if (this.disabled \|\| this.pageSize === newSize) return;\n\n const previousPage = this.currentPage;\n this.pageSize = newSize;\n this.currentPage = 1;\n this.emit('nile-change', {\n page: 1,\n previousPage,\n pageSize: newSize\n });\n}\n\nprivate renderCompactRangeText(): TemplateResult {\n const full = getRangeText(this.totalItems, this.pageSize, this.currentPage);\n const trimmed = full.replace(/^Showing\\s/, ''); \n return html`<div class=\"range-text\">${trimmed}</div>`;\n}\n\n\n private renderRangeText(): TemplateResult {\n if (this.totalItems === 0) {\n return html`<div class=\"range-text\">Showing 0 of 0</div>`;\n }\n return html`\n <div part=\"range-text\" class=\"range-text\">\n ${getRangeText(this.totalItems, this.pageSize, this.currentPage)}\n </div>\n `;\n }\n\n private renderPageSizeSelect(): TemplateResult \| null {\n if (this.variant !== 'fluid') return null;\n return html`\n <div class=\"page-size-select\">\n <nile-dropdown class=\"page-size-dropdown\" ?disabled=${this.disabled}>\n <nile-button\n slot=\"trigger\"\n variant=\"tertiary\"\n class=\"down ${this._pageSizeOpen ? 'open' : ''}\"\n ?disabled=${this.disabled}\n >\n ${this.pageSize}\n <nile-icon\n name=\"var(--nile-icon-chevron-down, var(--ng-icon-chevron-down))\"\n size=\"14\"\n method=\"var(--nile-svg-method-fill, var(--ng-svg-method-stroke))\"\n class=\"chevron\"\n ></nile-icon>\n </nile-button>\n <nile-menu>\n <div class=\"down-scroll-wrapper\">\n ${this.pageSizeOptions.map(\n size => html`\n <nile-menu-item\n ?disabled=${this.disabled}\n @click=${() => this.onPageSizeSelect(size)}\n >\n ${size}\n </nile-menu-item>\n `\n )}\n </div>\n </nile-menu>\n </nile-dropdown>\n <span part=\"pagesize-label\" class=\"page-size-label\">Items per page</span>\n </div>\n `;\n }\n\n\n private renderCompactPageSize(): TemplateResult {\n return html`\n <nile-dropdown\n class=\"compact-dropdown\"\n ?disabled=${this.disabled}\n @nile-show=${() => (this._pageSizeOpen = true)}\n @nile-after-hide=${() => (this._pageSizeOpen = false)}\n >\n <nile-button\n slot=\"trigger\"\n variant=\"tertiary\"\n class=\"down ${this._pageSizeOpen ? 'open' : ''}\"\n ?disabled=${this.disabled}\n >\n ${this.pageSize}\n <nile-icon\n name=\"var(--nile-icon-chevron-down, var(--ng-icon-chevron-down))\"\n size=\"14\"\n method=\"var(--nile-svg-method-fill, var(--ng-svg-method-stroke))\"\n class=\"chevron\"\n ></nile-icon>\n </nile-button>\n <nile-menu>\n <div class=\"compact-scroll-wrapper\">\n ${this.pageSizeOptions.map(\n size => html`\n <nile-menu-item\n ?disabled=${this.disabled}\n @click=${() => this.onPageSizeSelect(size)}\n >\n ${size}\n </nile-menu-item>\n `\n )}\n </div>\n </nile-menu>\n </nile-dropdown>\n `;\n }\n \n\n private renderPrevButton(): TemplateResult {\n return html`\n <li>\n <nile-button\n variant=\"tertiary\"\n ?disabled=${this.currentPage === 1 \|\| this.disabled}\n @click=${() => this.goToPage(this.currentPage - 1)}\n class=\"prev-button\"\n >\n <nile-icon name=\"var(--nile-icon-arrow-left, var(--ng-icon-chevron-left))\" method=\"var(--nile-svg-method-fill, var(--ng-svg-method-stroke))\" size=\"14\"></nile-icon>\n </nile-button>\n </li>\n `;\n }\n\n private renderNextButton(): TemplateResult {\n return html`\n <li>\n <nile-button\n variant=\"tertiary\"\n ?disabled=${this.currentPage === this.totalPages \|\| this.disabled}\n @click=${() => this.goToPage(this.currentPage + 1)}\n class=\"next-button\"\n >\n <nile-icon name=\"var(--nile-icon-arrow-right, var(--ng-icon-chevron-right))\" method=\"var(--nile-svg-method-fill, var(--ng-svg-method-stroke))\" size=\"14\"></nile-icon>\n </nile-button>\n </li>\n `;\n }\n\n private renderPageItem(\n item: number \| string,\n idx: number,\n items: (number \| string)[]\n ): TemplateResult {\n if (item === '…') {\n return html`\n <li>\n <nile-dropdown class=\"ellipsis-dropdown\" ?disabled=${this.disabled}>\n <nile-button slot=\"trigger\" variant=\"ghost\" ?disabled=${this.disabled}>\n …\n </nile-button>\n <nile-menu>\n <div class=\"ellipsis-scroll-wrapper\">\n ${getHiddenPages(\n this.totalPages,\n items,\n this.currentPage,\n idx < items.indexOf(this.currentPage) ? 'left' : 'right'\n ).map(\n page => html`\n <nile-menu-item\n ?disabled=${this.disabled}\n @click=${() => this.goToPage(page)}\n >\n ${page}\n </nile-menu-item>\n `\n )}\n </div>\n </nile-menu>\n </nile-dropdown>\n </li>\n `;\n }\n return html`\n <li>\n <nile-button\n variant=${item === this.currentPage ? 'primary' : 'ghost'}\n ?disabled=${this.disabled}\n @click=${() => this.goToPage(item as number)}\n >\n ${item}\n </nile-button>\n </li>\n `;\n }\n\n private renderPageList(): TemplateResult {\n if (this.variant === 'compact') {\n return html`\n <nav aria-label=\"Pagination\">\n <ul class=\"pagination compact-pagination\">\n ${this.renderPrevButton()}\n <li>\n <nile-dropdown\n class=\"compact-dropdown1\"\n ?disabled=${this.disabled}\n @nile-show=${() => (this._pageOpen = true)}\n @nile-after-hide=${() => (this._pageOpen = false)}\n >\n <nile-button\n slot=\"trigger\"\n variant=\"tertiary\"\n class=\"current-page-btn ${this._pageOpen ? 'open' : ''}\"\n ?disabled=${this.disabled}\n >\n ${this.currentPage}\n <nile-icon\n name=\"var(--nile-icon-chevron-down, var(--ng-icon-chevron-down))\"\n size=\"14\"\n method=\"var(--nile-svg-method-fill, var(--ng-svg-method-stroke))\"\n class=\"chevron\"\n ></nile-icon>\n </nile-button>\n <nile-menu>\n <div class=\"compact-scroll-wrapper1\">\n ${Array.from({ length: this.totalPages }, (_, i) => i + 1).map(\n p => html`\n <nile-menu-item\n ?disabled=${this.disabled}\n @click=${() => this.goToPage(p)}\n >\n ${p}\n </nile-menu-item>\n `\n )}\n </div>\n </nile-menu>\n </nile-dropdown>\n </li>\n ${this.renderNextButton()}\n </ul>\n </nav>\n `;\n }\n const items = getPaginationItems(this.totalPages, this.currentPage);\n return html`\n <nav aria-label=\"Pagination\">\n <ul part=\"page-list\" class=\"pagination\">\n ${this.renderPrevButton()}\n ${items.map((item, idx) => this.renderPageItem(item, idx, items))}\n ${this.renderNextButton()}\n </ul>\n </nav>\n `;\n }\n\n public render(): TemplateResult {\n return html`\n <div part=\"wrapper\" class=\"pagination-wrapper ${this.variant}\">\n <div part=\"pager-container\" class=\"pager-container\">\n ${this.variant === 'fluid' && this.showTitle\n ? this.renderRangeText()\n : this.variant === 'compact'\n ? this.renderCompactRangeText()\n : null}\n ${this.variant === 'fluid'\n ? this.renderPageSizeSelect()\n : this.renderCompactPageSize()}\n </div>\n ${this.renderPageList()}\n </div>\n `;\n}\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-pagination': NilePagination;\n }\n}\n"]}

package/dist/src/nile-select/nile-select.d.ts CHANGED Viewed

@@ -160,6 +160,8 @@ export declare class NileSelect extends NileElement implements NileFormControl {
     renderItemConfig?: RenderItemConfig;
     data: any;
     enableVirtualScroll: boolean;
+    /** To enable the group header in the select */
+    enableGroupHeader: boolean;
     /** Gets the validity state object */
     get validity(): ValidityState;
     /** Gets the validation message */
@@ -215,6 +217,10 @@ export declare class NileSelect extends NileElement implements NileFormControl {
     handleDisabledChange(): void;
     handleValueChange(): void;
     handleOpenChange(): Promise<void>;
+    private getAllGroupAttributes;
+    getUniqueGroupNames(arr: NileOption[]): string[];
+    handleGroupSearchChange(): void;
+    handleGroupShowSelected(): void;
     /** Shows the listbox. */
     show(): Promise<void>;
     /** Hides the listbox. */

package/dist/src/nile-select/nile-select.interface.d.ts ADDED Viewed

@@ -0,0 +1,5 @@
+export interface GroupAttributes {
+    name: string;
+    data: any;
+    element: HTMLElement;
+}

package/dist/src/nile-select/nile-select.interface.js ADDED Viewed

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

package/dist/src/nile-select/nile-select.interface.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"nile-select.interface.js","sourceRoot":"","sources":["../../../src/nile-select/nile-select.interface.ts"],"names":[],"mappings":"","sourcesContent":["export interface GroupAttributes {\n name: string;\n data: any;\n element: HTMLElement;\n}"]}

package/dist/src/nile-select/nile-select.js CHANGED Viewed

@@ -170,6 +170,8 @@ let NileSelect = class NileSelect extends NileElement {
         this.noResultsMessage = 'No results found';
         this.data = [];
         this.enableVirtualScroll = false;
+        /** To enable the group header in the select */
+        this.enableGroupHeader = false;
         this.options = [];
     }
     connectedCallback() {
@@ -197,6 +199,9 @@ let NileSelect = class NileSelect extends NileElement {
         }
     }
     firstUpdated(_changedProperties) {
+        if (this.enableGroupHeader) {
+            this.handleGroupSearchChange();
+        }
         if (_changedProperties.has('multiple')) {
             this.setCheckBoxInOption(this.multiple);
         }
@@ -263,6 +268,9 @@ let NileSelect = class NileSelect extends NileElement {
                 el.hidden = this.showSelected;
             }
         });
+        if (this.enableGroupHeader) {
+            this.handleGroupShowSelected();
+        }
         // this.requestUpdate();
     }
     /**
@@ -275,6 +283,9 @@ let NileSelect = class NileSelect extends NileElement {
             el.selected = false;
             el.hidden = false;
         });
+        if (this.enableGroupHeader) {
+            this.handleGroupShowSelected();
+        }
         this.value = '';
         this.selectionChanged();
         this.emit('nile-change', { value: this.value, name: this.name });
@@ -392,6 +403,9 @@ let NileSelect = class NileSelect extends NileElement {
             this.showSelected = false;
             this.value = '';
             this.displayInput.focus({ preventScroll: true });
+            if (this.enableGroupHeader) {
+                this.handleGroupShowSelected();
+            }
             // Emit after update
             this.updateComplete.then(() => {
                 const val = { value: this.multiple ? this.value : '', name: this.name };
@@ -444,6 +458,9 @@ let NileSelect = class NileSelect extends NileElement {
                     el.hidden = this.showSelected;
                 }
             });
+            if (this.enableGroupHeader) {
+                this.handleGroupShowSelected();
+            }
             this.requestUpdate();
         }
     }
@@ -474,6 +491,9 @@ let NileSelect = class NileSelect extends NileElement {
                     el.hidden = this.showSelected;
                 }
             });
+            if (this.enableGroupHeader) {
+                this.handleGroupShowSelected();
+            }
             // Emit after updating
             this.updateComplete.then(() => {
                 this.nileInput({ value: this.value, name: this.name });
@@ -617,6 +637,9 @@ let NileSelect = class NileSelect extends NileElement {
     }
     handleSearchChange(e) {
         this.searchValue = e.detail.value;
+        if (this.enableGroupHeader) {
+            this.handleGroupSearchChange();
+        }
         if (!this.disableLocalSearch) {
             let filteredOptions = this.filterOptions(this.searchValue);
             if (filteredOptions.length === 0) {
@@ -667,8 +690,12 @@ let NileSelect = class NileSelect extends NileElement {
         if (this.open && !this.disabled) {
             // Reset the current option
             this.setCurrentOption(this.selectedOptions[0] || this.getFirstOption());
-            // Show
             this.emit('nile-show', { value: this.value, name: this.name });
+            if (this.enableGroupHeader) {
+                this.getAllGroupAttributes().forEach((el) => {
+                    el.element.classList.remove('nile-group-hidden');
+                });
+            }
             this.addOpenListeners();
             this.showNoResults = !this.getAllOptions()?.length;
             await stopAnimations(this);
@@ -706,6 +733,34 @@ let NileSelect = class NileSelect extends NileElement {
             this.emit('nile-after-hide', { value: this.value, name: this.name });
         }
     }
+    getAllGroupAttributes() {
+        return Array.from(this.querySelectorAll('nile-option-group[name]')).map((el) => ({
+            name: el?.getAttribute('name') || '',
+            data: el?.getAttribute('data'),
+            element: el
+        }));
+    }
+    getUniqueGroupNames(arr) {
+        return Array.from(new Set(arr.map(obj => obj?.groupName)));
+    }
+    handleGroupSearchChange() {
+        const filtered = new Set(this.getUniqueGroupNames(this.filterOptions(this.searchValue)));
+        this.getAllGroupAttributes().forEach(({ name, element }) => {
+            element?.classList.toggle('nile-group-hidden', !filtered.has(name));
+        });
+    }
+    handleGroupShowSelected() {
+        const visibleGroups = new Set();
+        if (this.showSelected) {
+            this.getAllOptions().forEach((option) => {
+                if (!option.hidden)
+                    visibleGroups.add(option.groupName);
+            });
+        }
+        this.getAllGroupAttributes().forEach(({ name, element }) => {
+            element?.classList.toggle('nile-group-hidden', this.showSelected && !visibleGroups.has(name));
+        });
+    }
     /** Shows the listbox. */
     async show() {
         if (this.open || this.disabled) {
@@ -1287,6 +1342,9 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], NileSelect.prototype, "enableVirtualScroll", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: true })
+], NileSelect.prototype, "enableGroupHeader", void 0);
 __decorate([
     watch('disabled', { waitUntilFirstUpdate: true })
 ], NileSelect.prototype, "handleDisabledChange", null);