@relax.js/core 1.0.2 → 1.0.4

package/README.md

@@ -1,188 +1,194 @@
-# Relaxjs
-
-**Ship faster with less code.**
-
-Web Component library with routing, forms, DI, templating, and i18n. No virtual DOM, no build magic, no surprise re-renders.
-
-## Why Relaxjs?
-
-Modern frameworks solve problems you might not have. Relaxjs takes the opposite approach:
-
-| Framework Approach | Relaxjs Approach |
-|-------------------|------------------|
-| Virtual DOM diffing | Direct DOM manipulation |
-| Reactive state management | Explicit updates |
-| Custom template syntax | Standard HTML |
-| Framework-specific lifecycle | Native Web Component lifecycle |
-| Magic re-renders | You control what updates |
-| Custom rendering pipeline | Native async/await everywhere |
-
-> [Read the detailed comparison](docs/WhyRelaxjs.md)
-
-**The result:** You always know *when* something ran, *why* it ran, and *what* triggered it.
-
-## What Relaxjs Adds
-
-Web Components give you encapsulation and lifecycle hooks. Relaxjs fills the gaps:
-
-| Vanilla Web Components | With Relaxjs |
-|------------------------|--------------|
-| Manual form serialization | `readData(form)` returns typed objects (send it directly to backend) |
-| Query string parsing | Named routes with typed parameters |
-| DIY validation logic | `FormValidator` with HTML5 integration |
-| No component library | Table, Tabs, TreeView, Menu ready to use |
-| Manual service wiring | Decorator-based dependency injection |
-| Raw fetch boilerplate | Simple HTTP client for backend calls |
-
-You write less boilerplate while keeping full control.
-
-## Installation
-
-```bash
-npm install relaxjs
-```
-
-## Quick Examples
-
-### Form Handling
-
-Read and write form data with automatic type conversion:
-
-```typescript
-import { setFormData, readData } from 'relaxjs';
-
-// Populate a form from an object
-const user = { name: 'John', email: 'john@example.com', age: 30 };
-setFormData(form, user);
-
-// Read form data back (with types!)
-const data = readData(form);
-// { name: 'John', email: 'john@example.com', age: 30 }
-```
-
-Supports nested objects (`user.address.city`), arrays (`tags[]`), and automatic type conversion for numbers, booleans, and dates.
-
-> [Form utilities docs](docs/forms/forms.md)
-
-### Client-Side Routing
-
-Define routes and let the router handle navigation:
-
-```typescript
-import { defineRoutes, navigate, startRouting } from 'relaxjs';
-
-defineRoutes([
-    { name: 'home', path: '/', componentTagName: 'app-home' },
-    { name: 'user', path: '/users/:id', componentTagName: 'app-user' },
-    { name: 'settings', path: '/settings', componentTagName: 'app-settings' }
-]);
-
-startRouting();
-
-// Navigate programmatically
-navigate('user', { params: { id: '123' } });
-```
-
-```html
-<r-route-target></r-route-target>
-```
-
-> [Routing docs](docs/routing/Routing.md)
-
-### Form Validation
-
-HTML5-style validation with custom rules and error summaries:
-
-```typescript
-import { FormValidator } from 'relaxjs';
-
-const validator = new FormValidator(form, {
-    useSummary: true,
-    submitCallback: () => saveData()
-});
-```
-
-> [Validation docs](docs/forms/validation.md)
-
-## What's Included
-
-| Feature | Description |
-|---------|-------------|
-| **Form Utilities** | Read/write forms, type conversion, validation |
-| **Routing** | Named routes, typed parameters, guards, layouts, multiple targets |
-| **HTML Templates** | `html` tagged templates with data binding and in-place updates |
-| **HTTP Client** | Type-safe `get`/`post`/`put`/`del` with automatic JWT |
-| **WebSocket** | Auto-reconnect, message queuing, typed messages |
-| **SSE** | Server-Sent Events dispatched as DOM events |
-| **Dependency Injection** | Decorator-based DI with constructor and property injection |
-| **i18n** | ICU message format, pluralization, locale-aware formatting |
-| **Pipes** | 15 built-in data transformations for templates |
-
-## Where Relaxjs Fits
-
-Relaxjs is a good choice when:
-
-- You're building a **small-to-medium SPA** where you want direct control over the DOM
-- Your team prefers **vanilla Web Components** over framework abstractions
-- You want **gradual adoption** - use only the parts you need, no all-or-nothing buy-in
-- **Bundle size and simplicity** matter more than ecosystem breadth
-- You want to **understand what your code does** - no hidden re-renders, no magic proxies, no compiler transforms
-
-## Where Relaxjs Doesn't Fit
-
-Be honest with yourself - Relaxjs is not the right tool for everything:
-
-- **Large-scale apps with complex state** - Relaxjs has no reactive state management, no global store, no computed properties. If your UI has dozens of interdependent data flows, you'll be writing a lot of manual update logic.
-- **Server-side rendering / static site generation** - Relaxjs is client-only. If you need SEO, fast first-paint from the server, or pre-rendered pages, look at Next.js, Nuxt, or SvelteKit.
-- **Big teams that need a large talent pool** - React and Angular developers are everywhere. Finding developers who know Relaxjs (or are willing to learn a small library) is harder.
-- **Rich ecosystem needs** - There's no component marketplace, no DevTools extension, no community middleware. You build what you need or use vanilla JS libraries.
-- **Mobile / native targets** - No React Native equivalent, no Ionic integration. Relaxjs is for the browser.
-
-## How It Compares
-
-| | Relaxjs | React | Angular | Vue | Svelte |
-|---|---|---|---|---|---|
-| **Approach** | Web Components | Virtual DOM | Full framework | Virtual DOM | Compiler |
-| **Bundle size** | ~20KB gzipped | ~45KB | ~150KB+ | ~33KB | ~2KB runtime |
-| **Learning curve** | Low (vanilla TS) | Medium | High | Medium | Low-Medium |
-| **State management** | Explicit DOM updates | Hooks / Redux / Zustand | RxJS / Signals | Reactive refs | Stores / runes |
-| **Routing** | Built-in (simple) | react-router (separate) | Built-in (full) | vue-router (separate) | SvelteKit |
-| **Forms** | Built-in (HTML5 native) | Controlled / uncontrolled | Reactive forms | v-model | bind: |
-| **SSR** | No | Yes | Yes | Yes | Yes |
-| **Ecosystem** | Small | Massive | Large | Large | Growing |
-| **DI** | Built-in | None (Context API) | Built-in | Provide / Inject | None |
-| **i18n** | Built-in (ICU) | i18next etc. | Built-in | vue-i18n | i18next etc. |
-| **DevTools** | Browser DevTools | React DevTools | Angular DevTools | Vue DevTools | Svelte DevTools |
-| **Community size** | Small | Very large | Large | Large | Medium |
-
-## Philosophy
-
-This isn't a framework - it's a library. Use what you need:
-
-- Need just form handling? Import `setFormData` and `readData`.
-- Need routing? Add `defineRoutes` and `r-route-target`.
-- Need everything? It's all there.
-
-No buy-in required. No migration path to worry about. Just Web Components and TypeScript.
-
-## Documentation
-
-- [Why Relaxjs?](docs/WhyRelaxjs.md) - Detailed comparison with frameworks
-- [Getting Started](docs/GettingStarted.md) - Progressive adoption guide (7 levels)
-- [Architecture](docs/Architecture.md)
-- [Form Utilities](docs/forms/forms.md) - Validation, reading/writing, custom form components
-- [Routing](docs/routing/Routing.md) - Routes, guards, layouts, navigation
-- [HTML Templates](docs/html/html.md) - Tagged templates with data binding
-- [HTTP & WebSocket](docs/http/HttpClient.md) - REST calls, WebSocket, SSE
-- [Dependency Injection](docs/DependencyInjection.md)
-- [i18n](docs/i18n/i18n.md) - Translations, ICU format, locale switching
-- [Pipes](docs/Pipes.md) - Data transformations for templates
-- [Utilities](docs/utilities.md) - Sequential IDs, LinkedList, helpers
-
-## Browser Support
-
-Works in all browsers that support Web Components (Chrome, Firefox, Safari, Edge).
-
-## License
-
-ISC
+# Relaxjs
+
+**Ship faster with less code.**
+
+Web Component library with routing, forms, DI, templating, and i18n. No virtual DOM, no build magic, no surprise re-renders.
+
+- ~20KB gzipped, one dependency
+- Native Web Components, zero vendor lock-in
+- Use only what you need: forms, routing, DI, i18n are all independent
+- No build step required, no compiler, no CLI
+- Standard HTML, standard DOM, standard async/await
+
+## Why Relaxjs?
+
+Modern frameworks solve problems you might not have. Relaxjs takes the opposite approach:
+
+| Framework Approach | Relaxjs Approach |
+|-------------------|------------------|
+| Virtual DOM diffing | Direct DOM manipulation |
+| Reactive state management | Explicit updates |
+| Custom template syntax | Standard HTML |
+| Framework-specific lifecycle | Native Web Component lifecycle |
+| Magic re-renders | You control what updates |
+| Custom rendering pipeline | Native async/await everywhere |
+
+> [Read the detailed comparison](docs/WhyRelaxjs.md)
+
+**The result:** You always know *when* something ran, *why* it ran, and *what* triggered it.
+
+## What Relaxjs Adds
+
+Web Components give you encapsulation and lifecycle hooks. Relaxjs fills the gaps:
+
+| Vanilla Web Components | With Relaxjs |
+|------------------------|--------------|
+| Manual form serialization | `readData(form)` returns typed objects (send it directly to backend) |
+| Query string parsing | Named routes with typed parameters |
+| DIY validation logic | `FormValidator` with HTML5 integration |
+| No component library | Table, Tabs, TreeView, Menu ready to use |
+| Manual service wiring | Decorator-based dependency injection |
+| Raw fetch boilerplate | Simple HTTP client for backend calls |
+
+You write less boilerplate while keeping full control.
+
+## Installation
+
+```bash
+npm install @relax.js/core
+```
+
+## Quick Examples
+
+### Form Handling
+
+Read and write form data with automatic type conversion:
+
+```typescript
+import { setFormData, readData } from '@relax.js/core';
+
+// Populate a form from an object
+const user = { name: 'John', email: 'john@example.com', age: 30 };
+setFormData(form, user);
+
+// Read form data back (with types!)
+const data = readData(form);
+// { name: 'John', email: 'john@example.com', age: 30 }
+```
+
+Supports nested objects (`user.address.city`), arrays (`tags[]`), and automatic type conversion for numbers, booleans, and dates.
+
+> [Form utilities docs](docs/forms/forms.md)
+
+### Client-Side Routing
+
+Define routes and let the router handle navigation:
+
+```typescript
+import { defineRoutes, navigate, startRouting } from '@relax.js/core';
+
+defineRoutes([
+    { name: 'home', path: '/', componentTagName: 'app-home' },
+    { name: 'user', path: '/users/:id', componentTagName: 'app-user' },
+    { name: 'settings', path: '/settings', componentTagName: 'app-settings' }
+]);
+
+startRouting();
+
+// Navigate programmatically
+navigate('user', { params: { id: '123' } });
+```
+
+```html
+<r-route-target></r-route-target>
+```
+
+> [Routing docs](docs/routing/Routing.md)
+
+### Form Validation
+
+HTML5-style validation with custom rules and error summaries:
+
+```typescript
+import { FormValidator } from '@relax.js/core';
+
+const validator = new FormValidator(form, {
+    useSummary: true,
+    submitCallback: () => saveData()
+});
+```
+
+> [Validation docs](docs/forms/validation.md)
+
+## What's Included
+
+| Feature | Description |
+|---------|-------------|
+| **Form Utilities** | Read/write forms, type conversion, validation |
+| **Routing** | Named routes, typed parameters, guards, layouts, multiple targets |
+| **HTML Templates** | `html` tagged templates with data binding and in-place updates |
+| **HTTP Client** | Type-safe `get`/`post`/`put`/`del` with automatic JWT |
+| **WebSocket** | Auto-reconnect, message queuing, typed messages |
+| **SSE** | Server-Sent Events dispatched as DOM events |
+| **Dependency Injection** | Decorator-based DI with constructor and property injection |
+| **i18n** | ICU message format, pluralization, locale-aware formatting |
+| **Pipes** | 15 built-in data transformations for templates |
+
+## Where Relaxjs Fits
+
+Relaxjs is a good choice when:
+
+- You're building a **small-to-medium SPA** where you want direct control over the DOM
+- Your team prefers **vanilla Web Components** over framework abstractions
+- You want **gradual adoption** - use only the parts you need, no all-or-nothing buy-in
+- **Bundle size and simplicity** matter more than ecosystem breadth
+- You want to **understand what your code does** - no hidden re-renders, no magic proxies, no compiler transforms
+
+## Where Relaxjs Doesn't Fit
+
+Relaxjs is not the right tool for everything:
+
+- **Large-scale apps with complex state** - Relaxjs has no reactive state management, no global store, no computed properties. If your UI has dozens of interdependent data flows, you'll be writing a lot of manual update logic.
+- **Server-side rendering / static site generation** - Relaxjs is client-only. If you need SEO, fast first-paint from the server, or pre-rendered pages, look at Next.js, Nuxt, or SvelteKit.
+- **Big teams that need a large talent pool** - React and Angular developers are everywhere. Finding developers who know Relaxjs (or are willing to learn a small library) is harder.
+- **Rich ecosystem needs** - There's no component marketplace, no DevTools extension, no community middleware. You build what you need or use vanilla JS libraries.
+- **Mobile / native targets** - No React Native equivalent, no Ionic integration. Relaxjs is for the browser.
+
+## How It Compares
+
+| | Relaxjs | React | Angular | Vue | Svelte |
+|---|---|---|---|---|---|
+| **Approach** | Web Components | Virtual DOM | Full framework | Virtual DOM | Compiler |
+| **Bundle size** | ~20KB gzipped | ~45KB | ~150KB+ | ~33KB | ~2KB runtime |
+| **Learning curve** | Low (vanilla TS) | Medium | High | Medium | Low-Medium |
+| **State management** | Explicit DOM updates | Hooks / Redux / Zustand | RxJS / Signals | Reactive refs | Stores / runes |
+| **Routing** | Built-in (simple) | react-router (separate) | Built-in (full) | vue-router (separate) | SvelteKit |
+| **Forms** | Built-in (HTML5 native) | Controlled / uncontrolled | Reactive forms | v-model | bind: |
+| **SSR** | No | Yes | Yes | Yes | Yes |
+| **Ecosystem** | Small | Massive | Large | Large | Growing |
+| **DI** | Built-in | None (Context API) | Built-in | Provide / Inject | None |
+| **i18n** | Built-in (ICU) | i18next etc. | Built-in | vue-i18n | i18next etc. |
+| **DevTools** | Browser DevTools | React DevTools | Angular DevTools | Vue DevTools | Svelte DevTools |
+| **Community size** | Small | Very large | Large | Large | Medium |
+
+## Philosophy
+
+This isn't a framework - it's a library. Use what you need:
+
+- Need just form handling? Import `setFormData` and `readData`.
+- Need routing? Add `defineRoutes` and `r-route-target`.
+- Need everything? It's all there.
+
+No buy-in required. No migration path to worry about. 
+
+## Documentation
+
+- [Why Relaxjs?](docs/WhyRelaxjs.md) - Detailed comparison with frameworks
+- [Getting Started](docs/GettingStarted.md) - Progressive adoption guide (7 levels)
+- [Architecture](docs/Architecture.md)
+- [Form Utilities](docs/forms/forms.md) - Validation, reading/writing, custom form components
+- [Routing](docs/routing/Routing.md) - Routes, guards, layouts, navigation
+- [HTML Templates](docs/html/html.md) - Tagged templates with data binding
+- [HTTP & WebSocket](docs/http/HttpClient.md) - REST calls, WebSocket, SSE
+- [Dependency Injection](docs/DependencyInjection.md)
+- [i18n](docs/i18n/i18n.md) - Translations, ICU format, locale switching
+- [Pipes](docs/Pipes.md) - Data transformations for templates
+- [Utilities](docs/utilities.md) - Sequential IDs, LinkedList, helpers
+
+## Browser Support
+
+Works in all browsers that support Web Components (Chrome, Firefox, Safari, Edge).
+
+## License
+
+MIT

package/dist/DependencyInjection.d.ts

@@ -65,42 +65,60 @@ export interface RegistrationOptions {
     properties?: Record<string, string | Constructor>;
 }
 /**
- * Field decorator that collects property injection configuration.
- * Updates or creates the properties mapping in registration options.
+ * Field decorator that injects a service from the global DI container.
+ * The service is resolved when the class instance is created (not at class definition time),
+ * so services must be registered before the first instance is created.
  *
- * @example
- * @ContainerService({
- *   inject: [Database],
- *   properties: {
- *     logger: Logger,        // Inject by type
- *     audit: 'auditLogger'   // Inject by key
- *   }
- * })
- * class UserService {
- *   @Inject(Logger)
- *   private logger!: Logger;
+ * Works with web components regardless of how they are created:
+ * - By the browser (HTML parsing): services are resolved during construction
+ * - By application code (`document.createElement` or `new`): same behavior
+ * - Injected fields are available in `connectedCallback` and all lifecycle methods
  *
- *   @Inject('auditLogger')
- *   private audit!: Logger;
+ * @example
+ * // Using `@Inject` in a web component
+ * class UserPanel extends HTMLElement {
+ *     @Inject(UserService)
+ *     private userService!: UserService;
  *
- *   constructor(db: Database) {}
+ *     connectedCallback() {
+ *         // userService is already resolved and ready to use
+ *         const user = this.userService.getCurrentUser();
+ *         this.render(user);
+ *     }
  * }
+ *
+ * @example
+ * // Services must be registered before components are created.
+ * // In your app entry point (e.g. main.ts):
+ * serviceCollection.registerByType(UserService, { inject: [ApiClient] });
+ * serviceCollection.registerByType(ApiClient, { inject: [] });
+ *
+ * // Now components can be created (by browser or code)
+ * customElements.define('user-panel', UserPanel);
  */
 export declare function Inject<T extends object>(typeOrKey: Constructor<T> | string): (_: undefined, context: ClassFieldDecoratorContext) => (this: any) => T;
 /**
- * Class decorator that automatically registers a service in the global DI container.
- * Use this to declaratively register services without manual registration calls.
+ * Class decorator that registers a service in the global DI container.
+ * Registration happens at class definition time (when the module loads),
+ * so import the module before creating instances that depend on this service.
  *
- * Services are registered at module load time, so ensure this file is imported
- * before attempting to resolve the decorated service.
+ * For web components: use `@ContainerService` on services, not on the
+ * components themselves. Components use `@Inject` to consume services.
  *
  * @param options - Registration configuration including scope and dependencies
  *
  * @example
- * // Simple service with constructor injection
- * @ContainerService({ inject: [DatabaseConnection] })
- * class UserRepository {
- *     constructor(private db: DatabaseConnection) {}
+ * // Register a service that components can inject
+ * @ContainerService({ inject: [ApiClient] })
+ * class UserService {
+ *     constructor(private api: ApiClient) {}
+ *     getCurrentUser() { return this.api.get('/user'); }
+ * }
+ *
+ * // Component consumes the service
+ * class UserPanel extends HTMLElement {
+ *     @Inject(UserService)
+ *     private userService!: UserService;
  * }
  *
  * @example

package/dist/collections/Index.d.ts

@@ -1 +1,3 @@
 export { LinkedList, Node } from "./LinkedList";
+export { Pager, PageSelectedEvent } from "./Pager";
+export { type DataLoader } from "./DataLoader";

package/dist/collections/index.js

@@ -1,2 +1,2 @@
-var h=Object.defineProperty;var a=Object.getOwnPropertyDescriptor;var _=Object.getOwnPropertyNames;var u=Object.prototype.hasOwnProperty;var o=(s,t)=>{for(var e in t)h(s,e,{get:t[e],enumerable:!0})},f=(s,t,e,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of _(t))!u.call(s,r)&&r!==e&&h(s,r,{get:()=>t[r],enumerable:!(n=a(t,r))||n.enumerable});return s};var v=s=>f(h({},"__esModule",{value:!0}),s);var d={};o(d,{LinkedList:()=>l,Node:()=>i});module.exports=v(d);var i=class{constructor(t,e){this.value=t;this.removeCallback=e;this.next=null;this.prev=null}remove(){this.prev.next=this.next,this.next.prev=this.prev,this.removeCallback()}},l=class{constructor(){this._length=0}addFirst(t){let e=new i(t,()=>this._length--);this._first?(e.next=this._first,this._first.prev=e,this._first=e):(this._first=e,this._last=this._first),this._length++}addLast(t){let e=new i(t,()=>this._length--);this._first?(e.prev=this._last,this._last.next=e,this._last=e):(this._first=e,this._last=this._first),this._length++}removeFirst(){if(!this.first)throw new Error("The list is empty.");let t=this._first.value;return this._first=this._first.next,this._length--,t}removeLast(){if(!this.last)throw new Error("The list is empty.");let t=this._last.value;return this._last=this._last.prev,this._length--,t}get length(){return this._length}get first(){return this._first}get firstValue(){return this._first?.value}get last(){return this._last}get lastValue(){return this._last?.value}};
+var u=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var d=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var v=(i,t)=>{for(var e in t)u(i,e,{get:t[e],enumerable:!0})},f=(i,t,e,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of d(t))!g.call(i,s)&&s!==e&&u(i,s,{get:()=>t[s],enumerable:!(r=p(t,s))||r.enumerable});return i};var _=i=>f(u({},"__esModule",{value:!0}),i);var m={};v(m,{LinkedList:()=>l,Node:()=>n,PageSelectedEvent:()=>a,Pager:()=>o});module.exports=_(m);var n=class{constructor(t,e){this.value=t;this.removeCallback=e;this.next=null;this.prev=null}remove(){this.prev.next=this.next,this.next.prev=this.prev,this.removeCallback()}},l=class{constructor(){this._length=0}addFirst(t){let e=new n(t,()=>this._length--);this._first?(e.next=this._first,this._first.prev=e,this._first=e):(this._first=e,this._last=this._first),this._length++}addLast(t){let e=new n(t,()=>this._length--);this._first?(e.prev=this._last,this._last.next=e,this._last=e):(this._first=e,this._last=this._first),this._length++}removeFirst(){if(!this.first)throw new Error("The list is empty.");let t=this._first.value;return this._first=this._first.next,this._length--,t}removeLast(){if(!this.last)throw new Error("The list is empty.");let t=this._last.value;return this._last=this._last.prev,this._length--,t}get length(){return this._length}get first(){return this._first}get firstValue(){return this._first?.value}get last(){return this._last}get lastValue(){return this._last?.value}};var a=class extends Event{constructor(e){super("pageselected",{bubbles:!0,composed:!0});this.page=e}},o=class{constructor(t,e,r){this.currentPage=1;this.container=t,this.totalCount=e,this.pageSize=r,this.render()}render(){this.container.innerHTML="";let t=Math.max(1,Math.ceil(this.totalCount/this.pageSize)),e=(r,s,c=!1)=>{let h=document.createElement("button");return h.textContent=r,h.disabled=c,h.addEventListener("click",()=>this.selectPage(s)),h};this.container.appendChild(e("Previous",this.currentPage-1,this.currentPage===1));for(let r=1;r<=t;r++){let s=e(r.toString(),r);r===this.currentPage&&s.classList.add("selected"),this.container.appendChild(s)}this.container.appendChild(e("Next",this.currentPage+1,this.currentPage===t))}selectPage(t){let e=Math.max(1,Math.ceil(this.totalCount/this.pageSize));t<1||t>e||t===this.currentPage||(this.currentPage=t,this.render(),this.container.dispatchEvent(new a(this.currentPage)))}update(t){this.totalCount=t;let e=Math.max(1,Math.ceil(this.totalCount/this.pageSize));this.currentPage>e&&(this.currentPage=e),this.render()}getCurrentPage(){return this.currentPage}};
 //# sourceMappingURL=index.js.map

package/dist/collections/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../src/collections/Index.ts", "../../src/collections/LinkedList.ts"],
-  "sourcesContent": ["export {LinkedList, Node} from \"./LinkedList\";", "/**\r\n * A node in the @see LinkedList.\r\n */\r\nexport class Node<T> {\r\n    /**\r\n     * Next node unless last one.\r\n     */\r\n    public next: Node<T> | null = null;\r\n    /**\r\n     * Previous node unless first one.\r\n     */\r\n    public prev: Node<T> | null = null;\r\n\r\n    /**\r\n     * Constructor.\r\n     * @param value Value contained in the node.\r\n     */\r\n    constructor(public value: T, private removeCallback: () => void) {}\r\n\r\n    /**\r\n     * Remove this node.\r\n     * Will notify the list of the update to ensure correct element count.\r\n     */\r\n    remove() {\r\n        this.prev.next = this.next;\r\n        this.next.prev = this.prev;\r\n        this.removeCallback();\r\n    }\r\n}\r\n\r\n/**\r\n * A trivial linked list implementation.\r\n */\r\nexport class LinkedList<T> {\r\n    private _first?: Node<T>;\r\n    private _last?: Node<T>;\r\n    private _length = 0;\r\n\r\n    /**\r\n     * Add a value to the beginning of the list.\r\n     * @param value Value that should be contained in the node.\r\n     */\r\n    addFirst(value: T) {\r\n        const newNode = new Node(value, () => this._length--);\r\n        if (!this._first) {\r\n            this._first = newNode;\r\n            this._last = this._first;\r\n        } else {\r\n            newNode.next = this._first;\r\n            this._first.prev = newNode;\r\n            this._first = newNode;\r\n        }\r\n\r\n        this._length++;\r\n    }\r\n\r\n    /**\r\n     * Add a value to the end of the list.\r\n     * @param value Value that should be contained in a node.\r\n     */\r\n    addLast(value: T) {\r\n        const newNode = new Node(value, () => this._length--);\r\n        if (!this._first) {\r\n            this._first = newNode;\r\n            this._last = this._first;\r\n        } else {\r\n            newNode.prev = this._last;\r\n            this._last.next = newNode;\r\n            this._last = newNode;\r\n        }\r\n\r\n        this._length++;\r\n    }\r\n\r\n    /**\r\n     * Remove a node from the beginning of the list.\r\n     * @returns Value contained in the first node.\r\n     */\r\n    removeFirst(): T {\r\n        if (!this.first) {\r\n            throw new Error('The list is empty.');\r\n        }\r\n\r\n        const value = this._first.value;\r\n        this._first = this._first.next;\r\n        this._length--;\r\n        return value;\r\n    }\r\n\r\n    /**\r\n     * Remove a node from the end of the list.\r\n     * @returns Value contained in the last node.\r\n     */\r\n    removeLast(): T {\r\n        if (!this.last) {\r\n            throw new Error('The list is empty.');\r\n        }\r\n\r\n        const value = this._last.value;\r\n        this._last = this._last.prev;\r\n        this._length--;\r\n        return value;\r\n    }\r\n\r\n    /**\r\n     * Number of nodes in the list.\r\n     *\r\n     * The count works as long as you do not manually remove nodes (by assigning next/prev to the neighbors).\r\n     */\r\n    get length(): number {\r\n        return this._length;\r\n    }\r\n\r\n    /**\r\n     * First ndoe.\r\n     */\r\n    get first(): Node<T> | undefined {\r\n        return this._first;\r\n    }\r\n\r\n    /**\r\n     * Contained value of the first node.\r\n     */\r\n    get firstValue(): T | undefined {\r\n        return this._first?.value;\r\n    }\r\n\r\n    /**\r\n     * Last node.\r\n     */\r\n    get last(): Node<T> | undefined {\r\n        return this._last;\r\n    }\r\n\r\n    /**\r\n     * Contained value of the last node.\r\n     */\r\n    get lastValue(): T | undefined {\r\n        return this._last?.value;\r\n    }\r\n}\r\n"],
-  "mappings": "4ZAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,gBAAAE,EAAA,SAAAC,IAAA,eAAAC,EAAAJ,GCGO,IAAMK,EAAN,KAAc,CAcjB,YAAmBC,EAAkBC,EAA4B,CAA9C,WAAAD,EAAkB,oBAAAC,EAVrC,KAAO,KAAuB,KAI9B,KAAO,KAAuB,IAMoC,CAMlE,QAAS,CACL,KAAK,KAAK,KAAO,KAAK,KACtB,KAAK,KAAK,KAAO,KAAK,KACtB,KAAK,eAAe,CACxB,CACJ,EAKaC,EAAN,KAAoB,CAApB,cAGH,KAAQ,QAAU,EAMlB,SAASF,EAAU,CACf,IAAMG,EAAU,IAAIJ,EAAKC,EAAO,IAAM,KAAK,SAAS,EAC/C,KAAK,QAING,EAAQ,KAAO,KAAK,OACpB,KAAK,OAAO,KAAOA,EACnB,KAAK,OAASA,IALd,KAAK,OAASA,EACd,KAAK,MAAQ,KAAK,QAOtB,KAAK,SACT,CAMA,QAAQH,EAAU,CACd,IAAMG,EAAU,IAAIJ,EAAKC,EAAO,IAAM,KAAK,SAAS,EAC/C,KAAK,QAING,EAAQ,KAAO,KAAK,MACpB,KAAK,MAAM,KAAOA,EAClB,KAAK,MAAQA,IALb,KAAK,OAASA,EACd,KAAK,MAAQ,KAAK,QAOtB,KAAK,SACT,CAMA,aAAiB,CACb,GAAI,CAAC,KAAK,MACN,MAAM,IAAI,MAAM,oBAAoB,EAGxC,IAAMH,EAAQ,KAAK,OAAO,MAC1B,YAAK,OAAS,KAAK,OAAO,KAC1B,KAAK,UACEA,CACX,CAMA,YAAgB,CACZ,GAAI,CAAC,KAAK,KACN,MAAM,IAAI,MAAM,oBAAoB,EAGxC,IAAMA,EAAQ,KAAK,MAAM,MACzB,YAAK,MAAQ,KAAK,MAAM,KACxB,KAAK,UACEA,CACX,CAOA,IAAI,QAAiB,CACjB,OAAO,KAAK,OAChB,CAKA,IAAI,OAA6B,CAC7B,OAAO,KAAK,MAChB,CAKA,IAAI,YAA4B,CAC5B,OAAO,KAAK,QAAQ,KACxB,CAKA,IAAI,MAA4B,CAC5B,OAAO,KAAK,KAChB,CAKA,IAAI,WAA2B,CAC3B,OAAO,KAAK,OAAO,KACvB,CACJ",
-  "names": ["Index_exports", "__export", "LinkedList", "Node", "__toCommonJS", "Node", "value", "removeCallback", "LinkedList", "newNode"]
+  "sources": ["../../src/collections/Index.ts", "../../src/collections/LinkedList.ts", "../../src/collections/Pager.ts"],
+  "sourcesContent": ["export {LinkedList, Node} from \"./LinkedList\";\nexport { Pager, PageSelectedEvent } from \"./Pager\";\nexport { type DataLoader } from \"./DataLoader\";", "/**\r\n * A node in the @see LinkedList.\r\n */\r\nexport class Node<T> {\r\n    /**\r\n     * Next node unless last one.\r\n     */\r\n    public next: Node<T> | null = null;\r\n    /**\r\n     * Previous node unless first one.\r\n     */\r\n    public prev: Node<T> | null = null;\r\n\r\n    /**\r\n     * Constructor.\r\n     * @param value Value contained in the node.\r\n     */\r\n    constructor(public value: T, private removeCallback: () => void) {}\r\n\r\n    /**\r\n     * Remove this node.\r\n     * Will notify the list of the update to ensure correct element count.\r\n     */\r\n    remove() {\r\n        this.prev.next = this.next;\r\n        this.next.prev = this.prev;\r\n        this.removeCallback();\r\n    }\r\n}\r\n\r\n/**\r\n * A trivial linked list implementation.\r\n */\r\nexport class LinkedList<T> {\r\n    private _first?: Node<T>;\r\n    private _last?: Node<T>;\r\n    private _length = 0;\r\n\r\n    /**\r\n     * Add a value to the beginning of the list.\r\n     * @param value Value that should be contained in the node.\r\n     */\r\n    addFirst(value: T) {\r\n        const newNode = new Node(value, () => this._length--);\r\n        if (!this._first) {\r\n            this._first = newNode;\r\n            this._last = this._first;\r\n        } else {\r\n            newNode.next = this._first;\r\n            this._first.prev = newNode;\r\n            this._first = newNode;\r\n        }\r\n\r\n        this._length++;\r\n    }\r\n\r\n    /**\r\n     * Add a value to the end of the list.\r\n     * @param value Value that should be contained in a node.\r\n     */\r\n    addLast(value: T) {\r\n        const newNode = new Node(value, () => this._length--);\r\n        if (!this._first) {\r\n            this._first = newNode;\r\n            this._last = this._first;\r\n        } else {\r\n            newNode.prev = this._last;\r\n            this._last.next = newNode;\r\n            this._last = newNode;\r\n        }\r\n\r\n        this._length++;\r\n    }\r\n\r\n    /**\r\n     * Remove a node from the beginning of the list.\r\n     * @returns Value contained in the first node.\r\n     */\r\n    removeFirst(): T {\r\n        if (!this.first) {\r\n            throw new Error('The list is empty.');\r\n        }\r\n\r\n        const value = this._first.value;\r\n        this._first = this._first.next;\r\n        this._length--;\r\n        return value;\r\n    }\r\n\r\n    /**\r\n     * Remove a node from the end of the list.\r\n     * @returns Value contained in the last node.\r\n     */\r\n    removeLast(): T {\r\n        if (!this.last) {\r\n            throw new Error('The list is empty.');\r\n        }\r\n\r\n        const value = this._last.value;\r\n        this._last = this._last.prev;\r\n        this._length--;\r\n        return value;\r\n    }\r\n\r\n    /**\r\n     * Number of nodes in the list.\r\n     *\r\n     * The count works as long as you do not manually remove nodes (by assigning next/prev to the neighbors).\r\n     */\r\n    get length(): number {\r\n        return this._length;\r\n    }\r\n\r\n    /**\r\n     * First ndoe.\r\n     */\r\n    get first(): Node<T> | undefined {\r\n        return this._first;\r\n    }\r\n\r\n    /**\r\n     * Contained value of the first node.\r\n     */\r\n    get firstValue(): T | undefined {\r\n        return this._first?.value;\r\n    }\r\n\r\n    /**\r\n     * Last node.\r\n     */\r\n    get last(): Node<T> | undefined {\r\n        return this._last;\r\n    }\r\n\r\n    /**\r\n     * Contained value of the last node.\r\n     */\r\n    get lastValue(): T | undefined {\r\n        return this._last?.value;\r\n    }\r\n}\r\n", "export class PageSelectedEvent extends Event {\r\n  constructor(public page: number) {\r\n    super('pageselected', {\r\n      bubbles: true,\r\n      composed: true,\r\n    });\r\n  }\r\n}\r\n\r\ndeclare global {\r\n  interface HTMLElementEventMap {\r\n    'pageselected': PageSelectedEvent;\r\n  }\r\n}\r\n\r\nexport class Pager {\r\n  private container: HTMLElement;\r\n  private totalCount: number;\r\n  private pageSize: number;\r\n  private currentPage: number = 1;\r\n\r\n  constructor(container: HTMLElement, totalCount: number, pageSize: number) {\r\n    this.container = container;\r\n    this.totalCount = totalCount;\r\n    this.pageSize = pageSize;\r\n\r\n    this.render();\r\n  }\r\n\r\n  private render() {\r\n    this.container.innerHTML = '';\r\n\r\n    const pageCount = Math.max(1, Math.ceil(this.totalCount / this.pageSize));\r\n\r\n    const createButton = (label: string, page: number, disabled: boolean = false) => {\r\n      const btn = document.createElement('button');\r\n      btn.textContent = label;\r\n      btn.disabled = disabled;\r\n      btn.addEventListener('click', () => this.selectPage(page));\r\n      return btn;\r\n    };\r\n\r\n    this.container.appendChild(\r\n      createButton('Previous', this.currentPage - 1, this.currentPage === 1)\r\n    );\r\n\r\n    for (let i = 1; i <= pageCount; i++) {\r\n      const btn = createButton(i.toString(), i);\r\n      if (i === this.currentPage) {\r\n        btn.classList.add('selected');\r\n      }\r\n      this.container.appendChild(btn);\r\n    }\r\n\r\n    this.container.appendChild(\r\n      createButton('Next', this.currentPage + 1, this.currentPage === pageCount)\r\n    );\r\n  }\r\n\r\n  private selectPage(page: number) {\r\n    const pageCount = Math.max(1, Math.ceil(this.totalCount / this.pageSize));\r\n    if (page < 1 || page > pageCount || page === this.currentPage) return;\r\n\r\n    this.currentPage = page;\r\n    this.render();\r\n\r\n    this.container.dispatchEvent(new PageSelectedEvent(this.currentPage));\r\n  }\r\n\r\n  public update(totalCount: number) {\r\n    this.totalCount = totalCount;\r\n    const pageCount = Math.max(1, Math.ceil(this.totalCount / this.pageSize));\r\n    if (this.currentPage > pageCount) {\r\n      this.currentPage = pageCount;\r\n    }\r\n    this.render();\r\n  }\r\n\r\n  public getCurrentPage(): number {\r\n    return this.currentPage;\r\n  }\r\n}\r\n"],
+  "mappings": "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",
+  "names": ["Index_exports", "__export", "LinkedList", "Node", "PageSelectedEvent", "Pager", "__toCommonJS", "Node", "value", "removeCallback", "LinkedList", "newNode", "PageSelectedEvent", "page", "Pager", "container", "totalCount", "pageSize", "pageCount", "createButton", "label", "disabled", "btn", "i"]
 }

package/dist/collections/index.mjs

@@ -1,2 +1,2 @@
-var s=class{constructor(e,t){this.value=e;this.removeCallback=t;this.next=null;this.prev=null}remove(){this.prev.next=this.next,this.next.prev=this.prev,this.removeCallback()}},i=class{constructor(){this._length=0}addFirst(e){let t=new s(e,()=>this._length--);this._first?(t.next=this._first,this._first.prev=t,this._first=t):(this._first=t,this._last=this._first),this._length++}addLast(e){let t=new s(e,()=>this._length--);this._first?(t.prev=this._last,this._last.next=t,this._last=t):(this._first=t,this._last=this._first),this._length++}removeFirst(){if(!this.first)throw new Error("The list is empty.");let e=this._first.value;return this._first=this._first.next,this._length--,e}removeLast(){if(!this.last)throw new Error("The list is empty.");let e=this._last.value;return this._last=this._last.prev,this._length--,e}get length(){return this._length}get first(){return this._first}get firstValue(){return this._first?.value}get last(){return this._last}get lastValue(){return this._last?.value}};export{i as LinkedList,s as Node};
+var i=class{constructor(e,t){this.value=e;this.removeCallback=t;this.next=null;this.prev=null}remove(){this.prev.next=this.next,this.next.prev=this.prev,this.removeCallback()}},l=class{constructor(){this._length=0}addFirst(e){let t=new i(e,()=>this._length--);this._first?(t.next=this._first,this._first.prev=t,this._first=t):(this._first=t,this._last=this._first),this._length++}addLast(e){let t=new i(e,()=>this._length--);this._first?(t.prev=this._last,this._last.next=t,this._last=t):(this._first=t,this._last=this._first),this._length++}removeFirst(){if(!this.first)throw new Error("The list is empty.");let e=this._first.value;return this._first=this._first.next,this._length--,e}removeLast(){if(!this.last)throw new Error("The list is empty.");let e=this._last.value;return this._last=this._last.prev,this._length--,e}get length(){return this._length}get first(){return this._first}get firstValue(){return this._first?.value}get last(){return this._last}get lastValue(){return this._last?.value}};var a=class extends Event{constructor(t){super("pageselected",{bubbles:!0,composed:!0});this.page=t}},o=class{constructor(e,t,r){this.currentPage=1;this.container=e,this.totalCount=t,this.pageSize=r,this.render()}render(){this.container.innerHTML="";let e=Math.max(1,Math.ceil(this.totalCount/this.pageSize)),t=(r,s,u=!1)=>{let n=document.createElement("button");return n.textContent=r,n.disabled=u,n.addEventListener("click",()=>this.selectPage(s)),n};this.container.appendChild(t("Previous",this.currentPage-1,this.currentPage===1));for(let r=1;r<=e;r++){let s=t(r.toString(),r);r===this.currentPage&&s.classList.add("selected"),this.container.appendChild(s)}this.container.appendChild(t("Next",this.currentPage+1,this.currentPage===e))}selectPage(e){let t=Math.max(1,Math.ceil(this.totalCount/this.pageSize));e<1||e>t||e===this.currentPage||(this.currentPage=e,this.render(),this.container.dispatchEvent(new a(this.currentPage)))}update(e){this.totalCount=e;let t=Math.max(1,Math.ceil(this.totalCount/this.pageSize));this.currentPage>t&&(this.currentPage=t),this.render()}getCurrentPage(){return this.currentPage}};export{l as LinkedList,i as Node,a as PageSelectedEvent,o as Pager};
 //# sourceMappingURL=index.mjs.map

package/dist/collections/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../src/collections/LinkedList.ts"],
-  "sourcesContent": ["/**\r\n * A node in the @see LinkedList.\r\n */\r\nexport class Node<T> {\r\n    /**\r\n     * Next node unless last one.\r\n     */\r\n    public next: Node<T> | null = null;\r\n    /**\r\n     * Previous node unless first one.\r\n     */\r\n    public prev: Node<T> | null = null;\r\n\r\n    /**\r\n     * Constructor.\r\n     * @param value Value contained in the node.\r\n     */\r\n    constructor(public value: T, private removeCallback: () => void) {}\r\n\r\n    /**\r\n     * Remove this node.\r\n     * Will notify the list of the update to ensure correct element count.\r\n     */\r\n    remove() {\r\n        this.prev.next = this.next;\r\n        this.next.prev = this.prev;\r\n        this.removeCallback();\r\n    }\r\n}\r\n\r\n/**\r\n * A trivial linked list implementation.\r\n */\r\nexport class LinkedList<T> {\r\n    private _first?: Node<T>;\r\n    private _last?: Node<T>;\r\n    private _length = 0;\r\n\r\n    /**\r\n     * Add a value to the beginning of the list.\r\n     * @param value Value that should be contained in the node.\r\n     */\r\n    addFirst(value: T) {\r\n        const newNode = new Node(value, () => this._length--);\r\n        if (!this._first) {\r\n            this._first = newNode;\r\n            this._last = this._first;\r\n        } else {\r\n            newNode.next = this._first;\r\n            this._first.prev = newNode;\r\n            this._first = newNode;\r\n        }\r\n\r\n        this._length++;\r\n    }\r\n\r\n    /**\r\n     * Add a value to the end of the list.\r\n     * @param value Value that should be contained in a node.\r\n     */\r\n    addLast(value: T) {\r\n        const newNode = new Node(value, () => this._length--);\r\n        if (!this._first) {\r\n            this._first = newNode;\r\n            this._last = this._first;\r\n        } else {\r\n            newNode.prev = this._last;\r\n            this._last.next = newNode;\r\n            this._last = newNode;\r\n        }\r\n\r\n        this._length++;\r\n    }\r\n\r\n    /**\r\n     * Remove a node from the beginning of the list.\r\n     * @returns Value contained in the first node.\r\n     */\r\n    removeFirst(): T {\r\n        if (!this.first) {\r\n            throw new Error('The list is empty.');\r\n        }\r\n\r\n        const value = this._first.value;\r\n        this._first = this._first.next;\r\n        this._length--;\r\n        return value;\r\n    }\r\n\r\n    /**\r\n     * Remove a node from the end of the list.\r\n     * @returns Value contained in the last node.\r\n     */\r\n    removeLast(): T {\r\n        if (!this.last) {\r\n            throw new Error('The list is empty.');\r\n        }\r\n\r\n        const value = this._last.value;\r\n        this._last = this._last.prev;\r\n        this._length--;\r\n        return value;\r\n    }\r\n\r\n    /**\r\n     * Number of nodes in the list.\r\n     *\r\n     * The count works as long as you do not manually remove nodes (by assigning next/prev to the neighbors).\r\n     */\r\n    get length(): number {\r\n        return this._length;\r\n    }\r\n\r\n    /**\r\n     * First ndoe.\r\n     */\r\n    get first(): Node<T> | undefined {\r\n        return this._first;\r\n    }\r\n\r\n    /**\r\n     * Contained value of the first node.\r\n     */\r\n    get firstValue(): T | undefined {\r\n        return this._first?.value;\r\n    }\r\n\r\n    /**\r\n     * Last node.\r\n     */\r\n    get last(): Node<T> | undefined {\r\n        return this._last;\r\n    }\r\n\r\n    /**\r\n     * Contained value of the last node.\r\n     */\r\n    get lastValue(): T | undefined {\r\n        return this._last?.value;\r\n    }\r\n}\r\n"],
-  "mappings": "AAGO,IAAMA,EAAN,KAAc,CAcjB,YAAmBC,EAAkBC,EAA4B,CAA9C,WAAAD,EAAkB,oBAAAC,EAVrC,KAAO,KAAuB,KAI9B,KAAO,KAAuB,IAMoC,CAMlE,QAAS,CACL,KAAK,KAAK,KAAO,KAAK,KACtB,KAAK,KAAK,KAAO,KAAK,KACtB,KAAK,eAAe,CACxB,CACJ,EAKaC,EAAN,KAAoB,CAApB,cAGH,KAAQ,QAAU,EAMlB,SAASF,EAAU,CACf,IAAMG,EAAU,IAAIJ,EAAKC,EAAO,IAAM,KAAK,SAAS,EAC/C,KAAK,QAING,EAAQ,KAAO,KAAK,OACpB,KAAK,OAAO,KAAOA,EACnB,KAAK,OAASA,IALd,KAAK,OAASA,EACd,KAAK,MAAQ,KAAK,QAOtB,KAAK,SACT,CAMA,QAAQH,EAAU,CACd,IAAMG,EAAU,IAAIJ,EAAKC,EAAO,IAAM,KAAK,SAAS,EAC/C,KAAK,QAING,EAAQ,KAAO,KAAK,MACpB,KAAK,MAAM,KAAOA,EAClB,KAAK,MAAQA,IALb,KAAK,OAASA,EACd,KAAK,MAAQ,KAAK,QAOtB,KAAK,SACT,CAMA,aAAiB,CACb,GAAI,CAAC,KAAK,MACN,MAAM,IAAI,MAAM,oBAAoB,EAGxC,IAAMH,EAAQ,KAAK,OAAO,MAC1B,YAAK,OAAS,KAAK,OAAO,KAC1B,KAAK,UACEA,CACX,CAMA,YAAgB,CACZ,GAAI,CAAC,KAAK,KACN,MAAM,IAAI,MAAM,oBAAoB,EAGxC,IAAMA,EAAQ,KAAK,MAAM,MACzB,YAAK,MAAQ,KAAK,MAAM,KACxB,KAAK,UACEA,CACX,CAOA,IAAI,QAAiB,CACjB,OAAO,KAAK,OAChB,CAKA,IAAI,OAA6B,CAC7B,OAAO,KAAK,MAChB,CAKA,IAAI,YAA4B,CAC5B,OAAO,KAAK,QAAQ,KACxB,CAKA,IAAI,MAA4B,CAC5B,OAAO,KAAK,KAChB,CAKA,IAAI,WAA2B,CAC3B,OAAO,KAAK,OAAO,KACvB,CACJ",
-  "names": ["Node", "value", "removeCallback", "LinkedList", "newNode"]
+  "sources": ["../../src/collections/LinkedList.ts", "../../src/collections/Pager.ts"],
+  "sourcesContent": ["/**\r\n * A node in the @see LinkedList.\r\n */\r\nexport class Node<T> {\r\n    /**\r\n     * Next node unless last one.\r\n     */\r\n    public next: Node<T> | null = null;\r\n    /**\r\n     * Previous node unless first one.\r\n     */\r\n    public prev: Node<T> | null = null;\r\n\r\n    /**\r\n     * Constructor.\r\n     * @param value Value contained in the node.\r\n     */\r\n    constructor(public value: T, private removeCallback: () => void) {}\r\n\r\n    /**\r\n     * Remove this node.\r\n     * Will notify the list of the update to ensure correct element count.\r\n     */\r\n    remove() {\r\n        this.prev.next = this.next;\r\n        this.next.prev = this.prev;\r\n        this.removeCallback();\r\n    }\r\n}\r\n\r\n/**\r\n * A trivial linked list implementation.\r\n */\r\nexport class LinkedList<T> {\r\n    private _first?: Node<T>;\r\n    private _last?: Node<T>;\r\n    private _length = 0;\r\n\r\n    /**\r\n     * Add a value to the beginning of the list.\r\n     * @param value Value that should be contained in the node.\r\n     */\r\n    addFirst(value: T) {\r\n        const newNode = new Node(value, () => this._length--);\r\n        if (!this._first) {\r\n            this._first = newNode;\r\n            this._last = this._first;\r\n        } else {\r\n            newNode.next = this._first;\r\n            this._first.prev = newNode;\r\n            this._first = newNode;\r\n        }\r\n\r\n        this._length++;\r\n    }\r\n\r\n    /**\r\n     * Add a value to the end of the list.\r\n     * @param value Value that should be contained in a node.\r\n     */\r\n    addLast(value: T) {\r\n        const newNode = new Node(value, () => this._length--);\r\n        if (!this._first) {\r\n            this._first = newNode;\r\n            this._last = this._first;\r\n        } else {\r\n            newNode.prev = this._last;\r\n            this._last.next = newNode;\r\n            this._last = newNode;\r\n        }\r\n\r\n        this._length++;\r\n    }\r\n\r\n    /**\r\n     * Remove a node from the beginning of the list.\r\n     * @returns Value contained in the first node.\r\n     */\r\n    removeFirst(): T {\r\n        if (!this.first) {\r\n            throw new Error('The list is empty.');\r\n        }\r\n\r\n        const value = this._first.value;\r\n        this._first = this._first.next;\r\n        this._length--;\r\n        return value;\r\n    }\r\n\r\n    /**\r\n     * Remove a node from the end of the list.\r\n     * @returns Value contained in the last node.\r\n     */\r\n    removeLast(): T {\r\n        if (!this.last) {\r\n            throw new Error('The list is empty.');\r\n        }\r\n\r\n        const value = this._last.value;\r\n        this._last = this._last.prev;\r\n        this._length--;\r\n        return value;\r\n    }\r\n\r\n    /**\r\n     * Number of nodes in the list.\r\n     *\r\n     * The count works as long as you do not manually remove nodes (by assigning next/prev to the neighbors).\r\n     */\r\n    get length(): number {\r\n        return this._length;\r\n    }\r\n\r\n    /**\r\n     * First ndoe.\r\n     */\r\n    get first(): Node<T> | undefined {\r\n        return this._first;\r\n    }\r\n\r\n    /**\r\n     * Contained value of the first node.\r\n     */\r\n    get firstValue(): T | undefined {\r\n        return this._first?.value;\r\n    }\r\n\r\n    /**\r\n     * Last node.\r\n     */\r\n    get last(): Node<T> | undefined {\r\n        return this._last;\r\n    }\r\n\r\n    /**\r\n     * Contained value of the last node.\r\n     */\r\n    get lastValue(): T | undefined {\r\n        return this._last?.value;\r\n    }\r\n}\r\n", "export class PageSelectedEvent extends Event {\r\n  constructor(public page: number) {\r\n    super('pageselected', {\r\n      bubbles: true,\r\n      composed: true,\r\n    });\r\n  }\r\n}\r\n\r\ndeclare global {\r\n  interface HTMLElementEventMap {\r\n    'pageselected': PageSelectedEvent;\r\n  }\r\n}\r\n\r\nexport class Pager {\r\n  private container: HTMLElement;\r\n  private totalCount: number;\r\n  private pageSize: number;\r\n  private currentPage: number = 1;\r\n\r\n  constructor(container: HTMLElement, totalCount: number, pageSize: number) {\r\n    this.container = container;\r\n    this.totalCount = totalCount;\r\n    this.pageSize = pageSize;\r\n\r\n    this.render();\r\n  }\r\n\r\n  private render() {\r\n    this.container.innerHTML = '';\r\n\r\n    const pageCount = Math.max(1, Math.ceil(this.totalCount / this.pageSize));\r\n\r\n    const createButton = (label: string, page: number, disabled: boolean = false) => {\r\n      const btn = document.createElement('button');\r\n      btn.textContent = label;\r\n      btn.disabled = disabled;\r\n      btn.addEventListener('click', () => this.selectPage(page));\r\n      return btn;\r\n    };\r\n\r\n    this.container.appendChild(\r\n      createButton('Previous', this.currentPage - 1, this.currentPage === 1)\r\n    );\r\n\r\n    for (let i = 1; i <= pageCount; i++) {\r\n      const btn = createButton(i.toString(), i);\r\n      if (i === this.currentPage) {\r\n        btn.classList.add('selected');\r\n      }\r\n      this.container.appendChild(btn);\r\n    }\r\n\r\n    this.container.appendChild(\r\n      createButton('Next', this.currentPage + 1, this.currentPage === pageCount)\r\n    );\r\n  }\r\n\r\n  private selectPage(page: number) {\r\n    const pageCount = Math.max(1, Math.ceil(this.totalCount / this.pageSize));\r\n    if (page < 1 || page > pageCount || page === this.currentPage) return;\r\n\r\n    this.currentPage = page;\r\n    this.render();\r\n\r\n    this.container.dispatchEvent(new PageSelectedEvent(this.currentPage));\r\n  }\r\n\r\n  public update(totalCount: number) {\r\n    this.totalCount = totalCount;\r\n    const pageCount = Math.max(1, Math.ceil(this.totalCount / this.pageSize));\r\n    if (this.currentPage > pageCount) {\r\n      this.currentPage = pageCount;\r\n    }\r\n    this.render();\r\n  }\r\n\r\n  public getCurrentPage(): number {\r\n    return this.currentPage;\r\n  }\r\n}\r\n"],
+  "mappings": "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",
+  "names": ["Node", "value", "removeCallback", "LinkedList", "newNode", "PageSelectedEvent", "page", "Pager", "container", "totalCount", "pageSize", "pageCount", "createButton", "label", "disabled", "btn", "i"]
 }

package/dist/di/index.js

@@ -1,2 +1,2 @@
-var d=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var h=Object.prototype.hasOwnProperty;var x=(n,t)=>{for(var e in t)d(n,e,{get:t[e],enumerable:!0})},C=(n,t,e,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of f(t))!h.call(n,s)&&s!==e&&d(n,s,{get:()=>t[s],enumerable:!(r=y(t,s))||r.enumerable});return n};var T=n=>C(d({},"__esModule",{value:!0}),n);var b={};x(b,{ContainerService:()=>m,Inject:()=>j,ServiceCollection:()=>a,ServiceContainer:()=>l,container:()=>v,serviceCollection:()=>g});module.exports=T(b);var p=class extends Error{constructor(e,r){super(e);this.context=r}},u=null;function o(n,t){let e=new p(n,t);if(u){let r=!1;if(u(e,{suppress(){r=!0}}),r)return null}return e}function j(n){return(t,e)=>{var r=v.resolve(n);return function(){return r}}}function m(n){return t=>{let e=n??{inject:[]};e.key?g.register(t,e):g.registerByType(t,e)}}var c=class{constructor(t,e,r,s={},i,w){this.classConstructor=t;this.scope=e;this.inject=r;this.properties=s;this.key=i;this.instance=w}},a=class{constructor(){this.servicesByKey=new Map;this.servicesByClassName=new Map}register(t,e){this.validateRegistration(t,e);let r=new c(t,e.scope??"global",e.inject,e.properties??{},e.key,e.instance);e.key&&this.servicesByKey.set(e.key,r),this.servicesByClassName.set(t.name,r)}registerByType(t,e){this.checkNameCollision(t),e&&this.validateRegistration(t,e);let r=new c(t,e?.scope,e?.inject??[],e?.properties,e?.key,e?.instance);e?.key&&this.servicesByKey.set(e.key,r),this.servicesByClassName.set(t.name,r)}checkNameCollision(t){let e=this.servicesByClassName.get(t.name);if(e&&e.classConstructor!==t){let r=o("Service name collision: different class registered with same name",{service:t.name});if(r)throw r}}validateRegistration(t,e){if(this.checkNameCollision(t),e.key){let r=this.servicesByKey.get(e.key);if(r&&r.classConstructor!==t){let s=o("Service key already registered to a different class",{key:e.key,existingClass:r.classConstructor.name,newClass:t.name});if(s)throw s}}if(e.instance&&e.inject.length>0){let r=o("Service has both instance and inject (inject will be ignored)",{service:t.name});if(r)throw r}}tryGet(t){return typeof t=="string"?this.servicesByKey.get(t):this.servicesByClassName.get(t.name)}get(t){let e=this.tryGet(t);if(!e){let r=typeof t=="string"?t:t.name,s=o(`Failed to resolve service '${r}'`,{service:r,registeredTypes:Array.from(this.servicesByClassName.keys()),registeredKeys:Array.from(this.servicesByKey.keys())});if(s)throw s}return e}};var l=class{constructor(t){this.serviceCollection=t;this.instances=new Map}resolve(t){let e=typeof t=="string"?t:t.name;if(this.instances.has(e))return this.instances.get(e);let r=this.serviceCollection.get(t);if(!r){let i=o(`Failed to resolve service '${e}'`,{service:e});if(i)throw i;return}if(r.instance){let i=r.instance;return this.injectFields(i,r),this.instances.set(e,i),i}let s=this.createInstance(r);return r.scope==="global"&&this.instances.set(e,s),this.injectFields(s,r),s}createInstance(t){let e=t.classConstructor,r=t.inject.map(s=>this.resolve(s));return new e(...r)}injectFields(t,e){for(let[r,s]of Object.entries(e.properties))t[r]=this.resolve(s)}},g=new a,v=new l(g);
+var d=Object.defineProperty;var y=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var h=Object.prototype.hasOwnProperty;var x=(n,t)=>{for(var e in t)d(n,e,{get:t[e],enumerable:!0})},C=(n,t,e,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of f(t))!h.call(n,s)&&s!==e&&d(n,s,{get:()=>t[s],enumerable:!(r=y(t,s))||r.enumerable});return n};var T=n=>C(d({},"__esModule",{value:!0}),n);var b={};x(b,{ContainerService:()=>j,Inject:()=>m,ServiceCollection:()=>a,ServiceContainer:()=>l,container:()=>v,serviceCollection:()=>g});module.exports=T(b);var u=class extends Error{constructor(e,r){super(e);this.context=r}},p=null;function o(n,t){let e=new u(n,t);if(p){let r=!1;if(p(e,{suppress(){r=!0}}),r)return null}return e}function m(n){return(t,e)=>function(){return v.resolve(n)}}function j(n){return t=>{let e=n??{inject:[]};e.key?g.register(t,e):g.registerByType(t,e)}}var c=class{constructor(t,e,r,s={},i,w){this.classConstructor=t;this.scope=e;this.inject=r;this.properties=s;this.key=i;this.instance=w}},a=class{constructor(){this.servicesByKey=new Map;this.servicesByClassName=new Map}register(t,e){this.validateRegistration(t,e);let r=new c(t,e.scope??"global",e.inject,e.properties??{},e.key,e.instance);e.key&&this.servicesByKey.set(e.key,r),this.servicesByClassName.set(t.name,r)}registerByType(t,e){this.checkNameCollision(t),e&&this.validateRegistration(t,e);let r=new c(t,e?.scope,e?.inject??[],e?.properties,e?.key,e?.instance);e?.key&&this.servicesByKey.set(e.key,r),this.servicesByClassName.set(t.name,r)}checkNameCollision(t){let e=this.servicesByClassName.get(t.name);if(e&&e.classConstructor!==t){let r=o("Service name collision: different class registered with same name",{service:t.name});if(r)throw r}}validateRegistration(t,e){if(this.checkNameCollision(t),e.key){let r=this.servicesByKey.get(e.key);if(r&&r.classConstructor!==t){let s=o("Service key already registered to a different class",{key:e.key,existingClass:r.classConstructor.name,newClass:t.name});if(s)throw s}}if(e.instance&&e.inject.length>0){let r=o("Service has both instance and inject (inject will be ignored)",{service:t.name});if(r)throw r}}tryGet(t){return typeof t=="string"?this.servicesByKey.get(t):this.servicesByClassName.get(t.name)}get(t){let e=this.tryGet(t);if(!e){let r=typeof t=="string"?t:t.name,s=o(`Failed to resolve service '${r}'`,{service:r,registeredTypes:Array.from(this.servicesByClassName.keys()),registeredKeys:Array.from(this.servicesByKey.keys())});if(s)throw s}return e}};var l=class{constructor(t){this.serviceCollection=t;this.instances=new Map}resolve(t){let e=typeof t=="string"?t:t.name;if(this.instances.has(e))return this.instances.get(e);let r=this.serviceCollection.get(t);if(!r){let i=o(`Failed to resolve service '${e}'`,{service:e});if(i)throw i;return}if(r.instance){let i=r.instance;return this.injectFields(i,r),this.instances.set(e,i),i}let s=this.createInstance(r);return r.scope==="global"&&this.instances.set(e,s),this.injectFields(s,r),s}createInstance(t){let e=t.classConstructor,r=t.inject.map(s=>this.resolve(s));return new e(...r)}injectFields(t,e){for(let[r,s]of Object.entries(e.properties))t[r]=this.resolve(s)}},g=new a,v=new l(g);
 //# sourceMappingURL=index.js.map