@cedx/base 0.5.0 → 0.6.0

package/ReadMe.md

@@ -1,5 +1,5 @@
 # Belin.io Base
-![.NET](https://badgen.net/badge/.net/%3E%3D9.0/green) ![Version](https://badgen.net/badge/project/v0.5.0/blue) ![Licence](https://badgen.net/badge/licence/MIT/blue)
+![.NET](https://badgen.net/badge/.net/%3E%3D9.0/green) ![Version](https://badgen.net/badge/project/v0.6.0/blue) ![Licence](https://badgen.net/badge/licence/MIT/blue)
 
 Base library by [Cédric Belin](https://belin.io), full stack developer,
 implemented in [C#](https://learn.microsoft.com/en-us/dotnet/csharp) and [TypeScript](https://www.typescriptlang.org).

package/lib/Data/PaginatedList.d.ts

@@ -0,0 +1,35 @@
+import { Pagination } from "./Pagination.js";
+/**
+ * A list with information relevant to the pagination of its items.
+ */
+export declare class PaginatedList<T> extends Array<T> {
+    /**
+     * The information relevant to the pagination of the list items.
+     */
+    pagination: Pagination;
+    /**
+     * Creates a new paginated list.
+     * @param options An object providing values to initialize this instance.
+     */
+    constructor(options?: PaginatedListOptions<T>);
+    /**
+     * Creates an empty paginated list.
+     * @param itemsPerPage The number of items per page.
+     * @returns An empty paginated list with the specified number of items per page.
+     */
+    static empty<T>(itemsPerPage: number): PaginatedList<T>;
+}
+/**
+ * Defines the options of a {@link PaginatedList} instance.
+ */
+export type PaginatedListOptions<T> = Partial<{
+    /**
+     * The list items.
+     */
+    items: T[];
+    /**
+     * The information relevant to the pagination of the list items.
+     */
+    pagination: Pagination;
+}>;
+//# sourceMappingURL=PaginatedList.d.ts.map

package/lib/Data/PaginatedList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaginatedList.d.ts","sourceRoot":"","sources":["../../src/Client/Data/PaginatedList.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAC,MAAM,iBAAiB,CAAC;AAE3C;;GAEG;AACH,qBAAa,aAAa,CAAC,CAAC,CAAE,SAAQ,KAAK,CAAC,CAAC,CAAC;IAE7C;;OAEG;IACH,UAAU,EAAE,UAAU,CAAC;IAEvB;;;OAGG;gBACS,OAAO,GAAE,oBAAoB,CAAC,CAAC,CAAM;IAMjD;;;;OAIG;IACH,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,YAAY,EAAE,MAAM,GAAG,aAAa,CAAC,CAAC,CAAC;CAGvD;AAED;;GAEG;AACH,MAAM,MAAM,oBAAoB,CAAC,CAAC,IAAI,OAAO,CAAC;IAE7C;;OAEG;IACH,KAAK,EAAE,CAAC,EAAE,CAAC;IAEX;;OAEG;IACH,UAAU,EAAE,UAAU,CAAC;CACvB,CAAC,CAAC"}

package/lib/Data/PaginatedList.js

@@ -0,0 +1,28 @@
+import { Pagination } from "./Pagination.js";
+/**
+ * A list with information relevant to the pagination of its items.
+ */
+export class PaginatedList extends Array {
+    /**
+     * The information relevant to the pagination of the list items.
+     */
+    pagination;
+    /**
+     * Creates a new paginated list.
+     * @param options An object providing values to initialize this instance.
+     */
+    constructor(options = {}) {
+        super();
+        for (const item of options.items ?? [])
+            this.push(item);
+        this.pagination = options.pagination ?? new Pagination;
+    }
+    /**
+     * Creates an empty paginated list.
+     * @param itemsPerPage The number of items per page.
+     * @returns An empty paginated list with the specified number of items per page.
+     */
+    static empty(itemsPerPage) {
+        return new this({ pagination: new Pagination({ itemsPerPage }) });
+    }
+}

package/lib/Data/Pagination.d.ts

@@ -0,0 +1,57 @@
+/**
+ * Represents information relevant to the pagination of data items.
+ */
+export declare class Pagination {
+    /**
+     * The one-based current page number.
+     */
+    currentPageIndex: number;
+    /**
+     * The number of items per page.
+     */
+    itemsPerPage: number;
+    /**
+     * The total number of items.
+     */
+    totalItemCount: number;
+    /**
+     * Creates a new pagination.
+     * @param options An object providing values to initialize this instance.
+     */
+    constructor(options?: PaginationOptions);
+    /**
+     * Value indicating whether a next page exists.
+     */
+    get hasNextPage(): boolean;
+    /**
+     * Value indicating whether a previous page exists.
+     */
+    get hasPreviousPage(): boolean;
+    /**
+     * The one-based last page number.
+     */
+    get lastPageIndex(): number;
+    /**
+     * The data limit.
+     */
+    get limit(): number;
+    /**
+     * The data offset.
+     */
+    get offset(): number;
+    /**
+     * The search parameters corresponding to this object.
+     */
+    get searchParams(): URLSearchParams;
+    /**
+     * Creates a new pagination from the HTTP headers of the specified response.
+     * @param response A server response.
+     * @returns The pagination corresponding to the HTTP headers of the specified response.
+     */
+    static fromResponse(response: Response): Pagination;
+}
+/**
+ * Defines the options of a {@link Pagination} instance.
+ */
+export type PaginationOptions = Partial<Pick<Pagination, "currentPageIndex" | "itemsPerPage" | "totalItemCount">>;
+//# sourceMappingURL=Pagination.d.ts.map

package/lib/Data/Pagination.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../src/Client/Data/Pagination.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,qBAAa,UAAU;IAEtB;;OAEG;IACH,gBAAgB,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,YAAY,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,cAAc,EAAE,MAAM,CAAC;IAEvB;;;OAGG;gBACS,OAAO,GAAE,iBAAsB;IAM3C;;OAEG;IACH,IAAI,WAAW,IAAI,OAAO,CAEzB;IAED;;OAEG;IACH,IAAI,eAAe,IAAI,OAAO,CAE7B;IAED;;OAEG;IACH,IAAI,aAAa,IAAI,MAAM,CAE1B;IAED;;OAEG;IACH,IAAI,KAAK,IAAI,MAAM,CAElB;IAED;;OAEG;IACH,IAAI,MAAM,IAAI,MAAM,CAEnB;IAED;;OAEG;IACH,IAAI,YAAY,IAAI,eAAe,CAElC;IAED;;;;OAIG;IACH,MAAM,CAAC,YAAY,CAAC,QAAQ,EAAE,QAAQ,GAAG,UAAU;CAOnD;AAED;;GAEG;AACH,MAAM,MAAM,iBAAiB,GAAG,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,kBAAkB,GAAC,cAAc,GAAC,gBAAgB,CAAC,CAAC,CAAC"}

package/lib/Data/Pagination.js

@@ -0,0 +1,74 @@
+/**
+ * Represents information relevant to the pagination of data items.
+ */
+export class Pagination {
+    /**
+     * The one-based current page number.
+     */
+    currentPageIndex;
+    /**
+     * The number of items per page.
+     */
+    itemsPerPage;
+    /**
+     * The total number of items.
+     */
+    totalItemCount;
+    /**
+     * Creates a new pagination.
+     * @param options An object providing values to initialize this instance.
+     */
+    constructor(options = {}) {
+        this.currentPageIndex = Math.max(1, options.currentPageIndex ?? 1);
+        this.itemsPerPage = Math.max(1, Math.min(1000, options.itemsPerPage ?? 25));
+        this.totalItemCount = Math.max(0, options.totalItemCount ?? 0);
+    }
+    /**
+     * Value indicating whether a next page exists.
+     */
+    get hasNextPage() {
+        return this.currentPageIndex < this.totalItemCount;
+    }
+    /**
+     * Value indicating whether a previous page exists.
+     */
+    get hasPreviousPage() {
+        return this.currentPageIndex > 1;
+    }
+    /**
+     * The one-based last page number.
+     */
+    get lastPageIndex() {
+        return Math.ceil(this.totalItemCount / this.itemsPerPage);
+    }
+    /**
+     * The data limit.
+     */
+    get limit() {
+        return this.itemsPerPage;
+    }
+    /**
+     * The data offset.
+     */
+    get offset() {
+        return (this.currentPageIndex - 1) * this.itemsPerPage;
+    }
+    /**
+     * The search parameters corresponding to this object.
+     */
+    get searchParams() {
+        return new URLSearchParams({ page: this.currentPageIndex.toString(), perPage: this.itemsPerPage.toString() });
+    }
+    /**
+     * Creates a new pagination from the HTTP headers of the specified response.
+     * @param response A server response.
+     * @returns The pagination corresponding to the HTTP headers of the specified response.
+     */
+    static fromResponse(response) {
+        return new this({
+            currentPageIndex: Number(response.headers.get("X-Pagination-Current-Page") ?? "1"),
+            itemsPerPage: Number(response.headers.get("X-Pagination-Per-Page") ?? "25"),
+            totalItemCount: Number(response.headers.get("X-Pagination-Total-Count") ?? "0")
+        });
+    }
+}

package/lib/UI/Component.d.ts

@@ -0,0 +1,24 @@
+import { LitElement, type CSSResultGroup } from "lit";
+/**
+ * The optional base class for UI components. Alternatively, components may extend {@link LitElement} directly.
+ */
+export declare abstract class Component extends LitElement {
+    #private;
+    /**
+     * The component styles.
+     */
+    static styles: CSSResultGroup;
+    /**
+     * Creates a new component.
+     * @param options Value indicating whether this component uses a shadow root.
+     */
+    constructor(options?: {
+        shadowRoot?: boolean;
+    });
+    /**
+     * Returns the node into which this component should render.
+     * @returns The node into which this component should render.
+     */
+    protected createRenderRoot(): DocumentFragment | HTMLElement;
+}
+//# sourceMappingURL=Component.d.ts.map

package/lib/UI/Component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Component.d.ts","sourceRoot":"","sources":["../../src/Client/UI/Component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAE,KAAK,cAAc,EAAC,MAAM,KAAK,CAAC;AAEpD;;GAEG;AACH,8BAAsB,SAAU,SAAQ,UAAU;;IAEjD;;OAEG;IACH,OAAgB,MAAM,EAAE,cAAc,CAAiC;IAOvE;;;OAGG;gBACS,OAAO,GAAE;QAAC,UAAU,CAAC,EAAE,OAAO,CAAA;KAAM;IAKhD;;;OAGG;cACgB,gBAAgB,IAAI,gBAAgB,GAAC,WAAW;CAGnE"}

package/lib/UI/Component.js

@@ -0,0 +1,29 @@
+import { LitElement } from "lit";
+/**
+ * The optional base class for UI components. Alternatively, components may extend {@link LitElement} directly.
+ */
+export class Component extends LitElement {
+    /**
+     * The component styles.
+     */
+    static styles = [document.adoptedStyleSheets];
+    /**
+     * Value indicating whether this component uses a shadow root.
+     */
+    #useShadowRoot;
+    /**
+     * Creates a new component.
+     * @param options Value indicating whether this component uses a shadow root.
+     */
+    constructor(options = {}) {
+        super();
+        this.#useShadowRoot = options.shadowRoot ?? false;
+    }
+    /**
+     * Returns the node into which this component should render.
+     * @returns The node into which this component should render.
+     */
+    createRenderRoot() {
+        return this.#useShadowRoot ? super.createRenderRoot() : this;
+    }
+}

package/lib/UI/MenuActivator.d.ts

@@ -1,5 +1,5 @@
 /**
- * A component that activates the items of a menu based on the current document URL.
+ * A component that activates the items of a menu, based on the current document URL.
  */
 export declare class MenuActivator extends HTMLElement {
     /**

package/lib/UI/MenuActivator.js

@@ -1,5 +1,5 @@
 /**
- * A component that activates the items of a menu based on the current document URL.
+ * A component that activates the items of a menu, based on the current document URL.
  */
 export class MenuActivator extends HTMLElement {
     /**

package/lib/UI/ThemeDropdown.d.ts

@@ -1,3 +1,4 @@
+import { AppTheme } from "#Html/AppTheme.js";
 /**
  * A dropdown menu for switching the application theme.
  */
@@ -7,6 +8,11 @@ export declare class ThemeDropdown extends HTMLElement {
      * Creates a new theme dropdown.
      */
     constructor();
+    /**
+     * The current application theme.
+     */
+    get theme(): AppTheme;
+    set theme(value: AppTheme);
     /**
      * Method invoked when this component is connected.
      */

package/lib/UI/ThemeDropdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeDropdown.d.ts","sourceRoot":"","sources":["../../src/Client/UI/ThemeDropdown.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,qBAAa,aAAc,SAAQ,WAAW;;IAiB7C;;OAEG;;IAeH;;OAEG;IACH,iBAAiB,IAAI,IAAI;IAKzB;;OAEG;IACH,oBAAoB,IAAI,IAAI;IAI5B;;OAEG;IACH,WAAW,IAAI,IAAI;CAuBnB;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEd;;OAEG;IACH,UAAU,qBAAqB;QAC9B,gBAAgB,EAAE,aAAa,CAAC;KAChC;CACD"}
+{"version":3,"file":"ThemeDropdown.d.ts","sourceRoot":"","sources":["../../src/Client/UI/ThemeDropdown.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,QAAQ,EAAU,MAAM,mBAAmB,CAAC;AAEpD;;GAEG;AACH,qBAAa,aAAc,SAAQ,WAAW;;IAiB7C;;OAEG;;IAeH;;OAEG;IACH,IAAI,KAAK,IAAI,QAAQ,CAEpB;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,QAAQ,EAGxB;IAED;;OAEG;IACH,iBAAiB,IAAI,IAAI;IAKzB;;OAEG;IACH,oBAAoB,IAAI,IAAI;IAI5B;;OAEG;IACH,WAAW,IAAI,IAAI;CAsBnB;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEd;;OAEG;IACH,UAAU,qBAAqB;QAC9B,gBAAgB,EAAE,aAAa,CAAC;KAChC;CACD"}

package/lib/UI/ThemeDropdown.js

@@ -31,6 +31,16 @@ export class ThemeDropdown extends HTMLElement {
     static {
         customElements.define("theme-dropdown", this);
     }
+    /**
+     * The current application theme.
+     */
+    get theme() {
+        return this.#theme;
+    }
+    set theme(value) {
+        localStorage.setItem(this.#storageKey, this.#theme = value);
+        this.#applyTheme();
+    }
     /**
      * Method invoked when this component is connected.
      */
@@ -65,7 +75,6 @@ export class ThemeDropdown extends HTMLElement {
      */
     #setTheme(event) {
         const button = event.target.closest("button");
-        localStorage.setItem(this.#storageKey, this.#theme = button.dataset.theme);
-        this.#applyTheme();
+        this.theme = button.dataset.theme;
     }
 }

package/package.json

@@ -7,7 +7,7 @@
 	"name": "@cedx/base",
 	"repository": "cedx/base",
 	"type": "module",
-	"version": "0.5.0",
+	"version": "0.6.0",
 	"devDependencies": {
 		"@playwright/browser-chromium": "^1.54.2",
 		"@types/bootstrap": "^5.2.10",
@@ -50,7 +50,8 @@
 		"library"
 	],
 	"peerDependencies": {
-		"bootstrap": ">=5.3.0"
+		"bootstrap": ">=5.3.0",
+		"lit": ">=3.3.0"
 	},
 	"publishConfig": {
 		"access": "public"

package/src/Client/Data/PaginatedList.ts

@@ -0,0 +1,47 @@
+import {Pagination} from "./Pagination.js";
+
+/**
+ * A list with information relevant to the pagination of its items.
+ */
+export class PaginatedList<T> extends Array<T> {
+
+	/**
+	 * The information relevant to the pagination of the list items.
+	 */
+	pagination: Pagination;
+
+	/**
+	 * Creates a new paginated list.
+	 * @param options An object providing values to initialize this instance.
+	 */
+	constructor(options: PaginatedListOptions<T> = {}) {
+		super();
+		for (const item of options.items ?? []) this.push(item);
+		this.pagination = options.pagination ?? new Pagination;
+	}
+
+	/**
+	 * Creates an empty paginated list.
+	 * @param itemsPerPage The number of items per page.
+	 * @returns An empty paginated list with the specified number of items per page.
+	 */
+	static empty<T>(itemsPerPage: number): PaginatedList<T> {
+		return new this({pagination: new Pagination({itemsPerPage})});
+	}
+}
+
+/**
+ * Defines the options of a {@link PaginatedList} instance.
+ */
+export type PaginatedListOptions<T> = Partial<{
+
+	/**
+	 * The list items.
+	 */
+	items: T[];
+
+	/**
+	 * The information relevant to the pagination of the list items.
+	 */
+	pagination: Pagination;
+}>;

package/src/Client/Data/Pagination.ts

@@ -0,0 +1,90 @@
+/**
+ * Represents information relevant to the pagination of data items.
+ */
+export class Pagination {
+
+	/**
+	 * The one-based current page number.
+	 */
+	currentPageIndex: number;
+
+	/**
+	 * The number of items per page.
+	 */
+	itemsPerPage: number;
+
+	/**
+	 * The total number of items.
+	 */
+	totalItemCount: number;
+
+	/**
+	 * Creates a new pagination.
+	 * @param options An object providing values to initialize this instance.
+	 */
+	constructor(options: PaginationOptions = {}) {
+		this.currentPageIndex = Math.max(1, options.currentPageIndex ?? 1);
+		this.itemsPerPage = Math.max(1, Math.min(1000, options.itemsPerPage ?? 25));
+		this.totalItemCount = Math.max(0, options.totalItemCount ?? 0);
+	}
+
+	/**
+	 * Value indicating whether a next page exists.
+	 */
+	get hasNextPage(): boolean {
+		return this.currentPageIndex < this.totalItemCount;
+	}
+
+	/**
+	 * Value indicating whether a previous page exists.
+	 */
+	get hasPreviousPage(): boolean {
+		return this.currentPageIndex > 1;
+	}
+
+	/**
+	 * The one-based last page number.
+	 */
+	get lastPageIndex(): number {
+		return Math.ceil(this.totalItemCount / this.itemsPerPage);
+	}
+
+	/**
+	 * The data limit.
+	 */
+	get limit(): number {
+		return this.itemsPerPage;
+	}
+
+	/**
+	 * The data offset.
+	 */
+	get offset(): number {
+		return (this.currentPageIndex - 1) * this.itemsPerPage;
+	}
+
+	/**
+	 * The search parameters corresponding to this object.
+	 */
+	get searchParams(): URLSearchParams {
+		return new URLSearchParams({page: this.currentPageIndex.toString(), perPage: this.itemsPerPage.toString()});
+	}
+
+	/**
+	 * Creates a new pagination from the HTTP headers of the specified response.
+	 * @param response A server response.
+	 * @returns The pagination corresponding to the HTTP headers of the specified response.
+	 */
+	static fromResponse(response: Response): Pagination {
+		return new this({
+			currentPageIndex: Number(response.headers.get("X-Pagination-Current-Page") ?? "1"),
+			itemsPerPage: Number(response.headers.get("X-Pagination-Per-Page") ?? "25"),
+			totalItemCount: Number(response.headers.get("X-Pagination-Total-Count") ?? "0")
+		});
+	}
+}
+
+/**
+ * Defines the options of a {@link Pagination} instance.
+ */
+export type PaginationOptions = Partial<Pick<Pagination, "currentPageIndex"|"itemsPerPage"|"totalItemCount">>;

package/src/Client/UI/Component.ts

@@ -0,0 +1,34 @@
+import {LitElement, type CSSResultGroup} from "lit";
+
+/**
+ * The optional base class for UI components. Alternatively, components may extend {@link LitElement} directly.
+ */
+export abstract class Component extends LitElement {
+
+	/**
+	 * The component styles.
+	 */
+	static override styles: CSSResultGroup = [document.adoptedStyleSheets];
+
+	/**
+	 * Value indicating whether this component uses a shadow root.
+	 */
+	readonly #useShadowRoot: boolean;
+
+	/**
+	 * Creates a new component.
+	 * @param options Value indicating whether this component uses a shadow root.
+	 */
+	constructor(options: {shadowRoot?: boolean} = {}) {
+		super();
+		this.#useShadowRoot = options.shadowRoot ?? false;
+	}
+
+	/**
+	 * Returns the node into which this component should render.
+	 * @returns The node into which this component should render.
+	 */
+	protected override createRenderRoot(): DocumentFragment|HTMLElement {
+		return this.#useShadowRoot ? super.createRenderRoot() : this;
+	}
+}

package/src/Client/UI/MenuActivator.ts

@@ -1,5 +1,5 @@
 /**
- * A component that activates the items of a menu based on the current document URL.
+ * A component that activates the items of a menu, based on the current document URL.
  */
 export class MenuActivator extends HTMLElement {
 

package/src/Client/UI/ThemeDropdown.ts

@@ -37,6 +37,17 @@ export class ThemeDropdown extends HTMLElement {
 		customElements.define("theme-dropdown", this);
 	}
 
+	/**
+	 * The current application theme.
+	 */
+	get theme(): AppTheme {
+		return this.#theme;
+	}
+	set theme(value: AppTheme) {
+		localStorage.setItem(this.#storageKey, this.#theme = value);
+		this.#applyTheme();
+	}
+
 	/**
 	 * Method invoked when this component is connected.
 	 */
@@ -75,8 +86,7 @@ export class ThemeDropdown extends HTMLElement {
 	 */
 	#setTheme(event: Event): void {
 		const button = (event.target as HTMLElement).closest("button")!;
-		localStorage.setItem(this.#storageKey, this.#theme = button.dataset.theme as AppTheme);
-		this.#applyTheme();
+		this.theme = button.dataset.theme as AppTheme;
 	}
 }
 

package/lib/UI/ActionBar.d.ts

@@ -1,25 +0,0 @@
-/**
- * An action bar located under the navigation bar.
- */
-export declare class ActionBar extends HTMLElement {
-    /**
-     * Method invoked when this component is connected.
-     */
-    connectedCallback(): void;
-    /**
-     * Method invoked when this component is disconnected.
-     */
-    disconnectedCallback(): void;
-}
-/**
- * Declaration merging.
- */
-declare global {
-    /**
-     * The map of HTML tag names.
-     */
-    interface HTMLElementTagNameMap {
-        "action-bar": ActionBar;
-    }
-}
-//# sourceMappingURL=ActionBar.d.ts.map

package/lib/UI/ActionBar.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ActionBar.d.ts","sourceRoot":"","sources":["../../src/Client/UI/ActionBar.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,qBAAa,SAAU,SAAQ,WAAW;IASzC;;OAEG;IACH,iBAAiB,IAAI,IAAI;IAMzB;;OAEG;IACH,oBAAoB,IAAI,IAAI;CAG5B;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEd;;OAEG;IACH,UAAU,qBAAqB;QAC9B,YAAY,EAAE,SAAS,CAAC;KACxB;CACD"}

package/lib/UI/ActionBar.js

@@ -1,25 +0,0 @@
-/**
- * An action bar located under the navigation bar.
- */
-export class ActionBar extends HTMLElement {
-    /**
-     * Registers the component.
-     */
-    static {
-        customElements.define("action-bar", this);
-    }
-    /**
-     * Method invoked when this component is connected.
-     */
-    connectedCallback() {
-        const navbarHeight = parseInt(getComputedStyle(document.documentElement).getPropertyValue("--navbar-height"));
-        const mainOffset = this.offsetHeight + (Number.isNaN(navbarHeight) ? 0 : navbarHeight);
-        document.documentElement.style.setProperty("--main-offset", `${mainOffset}px`);
-    }
-    /**
-     * Method invoked when this component is disconnected.
-     */
-    disconnectedCallback() {
-        document.documentElement.style.removeProperty("--main-offset");
-    }
-}

package/src/Client/Data/Pagination.new

@@ -1,130 +0,0 @@
-/**
- * Represents information relevant to the pagination of data items.
- */
-export class Pagination {
-
-	/**
-	 * The current page number.
-	 */
-	currentPage: number;
-
-	/**
-	 * The number of items per page.
-	 */
-	itemsPerPage: number;
-
-	/**
-	 * The total number of items.
-	 */
-	totalItemCount: number;
-
-	/**
-	 * Creates a new pagination.
-	 * @param options An object providing values to initialize this instance.
-	 */
-	constructor(options: PaginationOptions = {}) {
-		this.currentPage = Math.max(1, options.currentPage ?? 1);
-		this.itemsPerPage = Math.max(1, Math.min(1000, options.itemsPerPage ?? 25));
-		this.totalItemCount = Math.max(0, options.totalItemCount ?? 0);
-	}
-
-	/**
-	 * The last page number.
-	 */
-	get lastPage(): number {
-		return Math.ceil(this.totalItemCount / this.itemsPerPage);
-	}
-
-	/**
-	 * The data limit.
-	 */
-	get limit(): number {
-		return this.itemsPerPage;
-	}
-
-	/**
-	 * The data offset.
-	 */
-	get offset(): number {
-		return (this.currentPage - 1) * this.itemsPerPage;
-	}
-
-	/**
-	 * The search parameters corresponding to this object.
-	 */
-	get searchParams(): URLSearchParams {
-		return new URLSearchParams({page: this.currentPage.toString(), perPage: this.itemsPerPage.toString()});
-	}
-
-	/**
-	 * Creates a new pagination from the HTTP headers of the specified response.
-	 * @param response A server response.
-	 * @returns The pagination corresponding to the HTTP headers of the specified response.
-	 */
-	static fromResponse(response: Response): Pagination {
-		return new this({
-			currentPage: Number(response.headers.get("X-Pagination-Current-Page") ?? "1"),
-			itemsPerPage: Number(response.headers.get("X-Pagination-Per-Page") ?? "25"),
-			totalItemCount: Number(response.headers.get("X-Pagination-Total-Count") ?? "0")
-		});
-	}
-}
-
-/**
- * Defines the options of a {@link Pagination} instance.
- */
-export type PaginationOptions = Partial<Pick<Pagination, "currentPage"|"itemsPerPage"|"totalItemCount">>;
-
-/**
- * A list with information relevant to the pagination of its items.
- */
-export class PaginatedList<T> implements Iterable<T, void, void> {
-
-	/**
-	 * The list items.
-	 */
-	items: T[];
-
-	/**
-	 * The information relevant to the pagination of the list items.
-	 */
-	pagination: Pagination;
-
-	/**
-	 * Creates a new paginated list.
-	 * @param options An object providing values to initialize this instance.
-	 */
-	constructor(options: PaginatedListOptions<T> = {}) {
-		this.items = options.items ?? [];
-		this.pagination = options.pagination ?? new Pagination;
-	}
-
-	/**
-	 * The number of items in this list.
-	 */
-	get length(): number {
-		return this.items.length;
-	}
-
-	/**
-	 * Creates an empty paginated list.
-	 * @param itemsPerPage The number of items per page.
-	 * @returns An empty paginated list with the specified number of items per page.
-	 */
-	static empty<T>(itemsPerPage: number): PaginatedList<T> {
-		return new this({pagination: new Pagination({itemsPerPage})});
-	}
-
-	/**
-	 * Returns a new iterator that allows iterating the items of this list.
-	 * @returns An iterator over the items of this list.
-	 */
-	*[Symbol.iterator](): Generator<T, void, void> {
-		for (const item of this.items) yield item;
-	}
-}
-
-/**
- * Defines the options of a {@link PaginatedList} instance.
- */
-export type PaginatedListOptions<T> = Partial<Pick<PaginatedList<T>, "items"|"pagination">>;

package/src/Client/UI/ActionBar.ts

@@ -1,41 +0,0 @@
-/**
- * An action bar located under the navigation bar.
- */
-export class ActionBar extends HTMLElement {
-
-	/**
-	 * Registers the component.
-	 */
-	static {
-		customElements.define("action-bar", this);
-	}
-
-	/**
-	 * Method invoked when this component is connected.
-	 */
-	connectedCallback(): void {
-		const navbarHeight = parseInt(getComputedStyle(document.documentElement).getPropertyValue("--navbar-height"));
-		const mainOffset = this.offsetHeight + (Number.isNaN(navbarHeight) ? 0 : navbarHeight);
-		document.documentElement.style.setProperty("--main-offset", `${mainOffset}px`);
-	}
-
-	/**
-	 * Method invoked when this component is disconnected.
-	 */
-	disconnectedCallback(): void {
-		document.documentElement.style.removeProperty("--main-offset");
-	}
-}
-
-/**
- * Declaration merging.
- */
-declare global {
-
-	/**
-	 * The map of HTML tag names.
-	 */
-	interface HTMLElementTagNameMap {
-		"action-bar": ActionBar;
-	}
-}