@0djek/sveltix 0.0.6

package/dist/cache/__tests__/builders/CacheBuilder.js

@@ -0,0 +1,18 @@
+import { Cache } from '../../Cache';
+export class CacheBuilder {
+    _entries = [];
+    static create() {
+        return new CacheBuilder();
+    }
+    setEntry(key, value) {
+        this._entries.push({ key, value });
+        return this;
+    }
+    build() {
+        const cache = new Cache();
+        this._entries.forEach((entry) => {
+            cache.set(entry.key, entry.value);
+        });
+        return cache;
+    }
+}

package/dist/cache/__tests__/builders/MappedCacheBuilder.d.ts

@@ -0,0 +1,7 @@
+import { MappedCache } from '../../MappedCache';
+export declare class MappedCacheBuilder {
+    private _entries;
+    static create(): MappedCacheBuilder;
+    setEntry(mapKey: string, key: string, value: number): MappedCacheBuilder;
+    build(): MappedCache<number>;
+}

package/dist/cache/__tests__/builders/MappedCacheBuilder.js

@@ -0,0 +1,18 @@
+import { MappedCache } from '../../MappedCache';
+export class MappedCacheBuilder {
+    _entries = [];
+    static create() {
+        return new MappedCacheBuilder();
+    }
+    setEntry(mapKey, key, value) {
+        this._entries.push({ mapKey, key, value });
+        return this;
+    }
+    build() {
+        const cache = new MappedCache();
+        this._entries.forEach((entry) => {
+            cache.set(entry.mapKey, entry.key, entry.value);
+        });
+        return cache;
+    }
+}

package/dist/cache/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Cache';
+export * from './MappedCache';

package/dist/cache/index.js

@@ -0,0 +1,2 @@
+export * from './Cache';
+export * from './MappedCache';

package/dist/datagrid/SveltixGrid.svelte.d.ts

@@ -0,0 +1,35 @@
+import type { ISveltixGrid } from './interfaces';
+import type { BaseColumn, ModuleRegistrationEntry } from './models';
+import type { SveltixGridOptions } from './models/SveltixGridOptions';
+import { ColumnsModule } from './core-modules/columns';
+import { RowsModule } from './core-modules/rows';
+import { type Event, type SubscriberSignature } from '../event-bus';
+import { type PipelinesModule } from './core-modules';
+import { CustomComponentsModule } from './core-modules/custom/CustomComponentsModule.svelte';
+import { type SveltixEvents } from './events';
+export interface CoreModules<T> {
+    custom: CustomComponentsModule<T>;
+    rows: RowsModule<T>;
+    columns: ColumnsModule<T>;
+    pipelines: PipelinesModule<T>;
+}
+export declare class SveltixGrid<T> implements ISveltixGrid<T> {
+    get ready(): boolean;
+    get dom(): HTMLDivElement;
+    get core(): CoreModules<T>;
+    private readonly _modules;
+    private _ready;
+    private _dom;
+    set dom(value: HTMLDivElement);
+    private _core;
+    private _events;
+    get events(): SveltixEvents<T>;
+    private _eventBus;
+    constructor(options?: SveltixGridOptions<T>);
+    on<TEvent>(event: Event<TEvent>, callback: SubscriberSignature<TEvent>): import("../event-bus").UnsubscribeSignature;
+    emit<TEvent>(event: Event<TEvent>, data: TEvent): void;
+    init(rows: T[], columns: BaseColumn<T>[]): Promise<void>;
+    addModule<TOption>(entry: ModuleRegistrationEntry<T, TOption>): void;
+    getModule<TModule>(id: symbol): TModule;
+    destroy(): void;
+}

package/dist/datagrid/SveltixGrid.svelte.js

@@ -0,0 +1,90 @@
+import { ColumnsModule, columnsModule } from './core-modules/columns';
+import { ROWS_MODULE, rowsModule, RowsModule } from './core-modules/rows';
+import { EventBus } from '../event-bus';
+import { COLUMNS_MODULE, PIPELINES_MODULE, pipelinesModule, } from './core-modules';
+import { tick } from 'svelte';
+import { CustomComponentsModule } from './core-modules/custom/CustomComponentsModule.svelte';
+import { CUSTOM_COMPONENTS_MODULE, customComponentsModule } from './core-modules/custom';
+import { generateEvent } from './events';
+export class SveltixGrid {
+    get ready() {
+        return this._ready;
+    }
+    get dom() {
+        return this._dom;
+    }
+    get core() {
+        return this._core;
+    }
+    _modules = new Map();
+    _ready = $state(false);
+    _dom = undefined;
+    set dom(value) {
+        this._dom = value;
+    }
+    _core;
+    _events;
+    get events() {
+        return this._events;
+    }
+    _eventBus = new EventBus();
+    constructor(options) {
+        this._events = generateEvent();
+        this.addModule(pipelinesModule());
+        this.addModule(columnsModule());
+        this.addModule(rowsModule(options?.rows));
+        this.addModule(customComponentsModule());
+        this._core = {
+            rows: this.getModule(ROWS_MODULE),
+            columns: this.getModule(COLUMNS_MODULE),
+            pipelines: this.getModule(PIPELINES_MODULE),
+            custom: this.getModule(CUSTOM_COMPONENTS_MODULE),
+        };
+        if (options?.modules != null) {
+            for (const module of options?.modules) {
+                this.addModule(module);
+            }
+        }
+    }
+    on(event, callback) {
+        return this._eventBus.on(event, callback);
+    }
+    emit(event, data) {
+        this._eventBus.emit(event, data);
+    }
+    async init(rows, columns) {
+        if (this._ready) {
+            return;
+        }
+        this._modules.forEach((value) => {
+            value.init();
+        });
+        this._core.columns.create(columns);
+        this._core.rows.create(rows, true);
+        await tick();
+        await this._core.columns.calculateWidth();
+        this._ready = true;
+        this._core.pipelines.execute();
+    }
+    addModule(entry) {
+        if (this._modules.has(entry.key)) {
+            console.warn(`Can't register '${entry.key.toString()}' because it's already registered.`);
+            return;
+        }
+        const instance = new entry.module(this, entry.options);
+        this._modules.set(entry.key, instance);
+    }
+    getModule(id) {
+        const instance = this._modules.get(id);
+        if (instance == null) {
+            throw new Error(`Module with ID '${id.toString()}' was not found.`);
+        }
+        return instance;
+    }
+    destroy() {
+        for (const module of this._modules.values()) {
+            module.uninit();
+            module.unsubscribe();
+        }
+    }
+}

package/dist/datagrid/SveltixGridGlobal.d.ts

@@ -0,0 +1,9 @@
+import type { ModuleRegistrationEntry } from './models';
+/**
+ * Global options for the datagrids', that will be created.
+ */
+export declare class SveltixGridGlobal {
+    private static _modules;
+    static setModules(modules: ModuleRegistrationEntry<unknown, unknown>[]): void;
+    static getModules<T>(): ModuleRegistrationEntry<T, unknown>[];
+}

package/dist/datagrid/SveltixGridGlobal.js

@@ -0,0 +1,12 @@
+/**
+ * Global options for the datagrids', that will be created.
+ */
+export class SveltixGridGlobal {
+    static _modules = [];
+    static setModules(modules) {
+        this._modules = modules;
+    }
+    static getModules() {
+        return this._modules;
+    }
+}

package/dist/datagrid/components/Datagrid.svelte

@@ -0,0 +1,114 @@
+<script
+	lang="ts"
+	generics="T">
+	import { onDestroy, onMount } from 'svelte';
+	import type { BaseColumn } from '../models';
+	import { SveltixGridGlobal } from '../SveltixGridGlobal';
+	import { SveltixGrid } from '../SveltixGrid.svelte';
+	import { fade } from 'svelte/transition';
+	import { FormatterValue } from '../core-modules/columns/Column.svelte';
+	import CustomComponents from '../core-modules/custom/components/CustomComponents.svelte';
+	import { CustomComponentPosition } from '../core-modules/custom/models/CustomComponentPosition';
+	import BodyCell from '../core-modules/rows/components/body/BodyCell.svelte';
+	import { flip } from 'svelte/animate';
+
+	/**
+	 * Required and optional props to create datagrid.
+	 */
+	interface Props {
+		/**
+		 * Rows to render.
+		 */
+		rows: T[];
+		/**
+		 * Columns to render.
+		 */
+		columns: BaseColumn<T>[];
+		/**
+		 * API instance to control the datagrid.
+		 */
+		api: SveltixGrid<T>;
+	}
+
+	const { rows, columns, api }: Props = $props();
+
+	let dom: HTMLDivElement;
+
+	$effect(() => {
+		if (dom == null) {
+			return;
+		}
+
+		api.dom = dom;
+	});
+
+	onMount(async () => {
+		SveltixGridGlobal.getModules<T>().forEach((module) => {
+			api.addModule(module);
+		});
+
+		await api.init(rows, columns);
+	});
+
+	onDestroy(() => {
+		api.destroy();
+	});
+</script>
+
+<!-- Main element -->
+<div
+	bind:this={dom}
+	class="w-full">
+	<CustomComponents
+		{api}
+		position={CustomComponentPosition.Action} />
+	<!-- Header -->
+	<div>
+		<div class="flex">
+			{#each api.core.columns.visible as column (column.id)}
+				<div
+					class="relative flex"
+					data-headerCellId={column.id}>
+					{#each column.helperBefore as helper (helper.id)}
+						<helper.helper
+							{api}
+							{column}
+							options={helper.option} />
+					{/each}
+					<div
+						class="px-4 border-b-2 h-14 flex items-center"
+						style="max-width: {column.width}px; min-width: {column.width}px">
+						<span class="text-nowrap overflow-hidden text-ellipsis">
+							{column.publicColumn.header}
+						</span>
+					</div>
+					{#each column.helperAfter as helper (helper.id)}
+						<helper.helper
+							{api}
+							{column}
+							options={helper.option} />
+					{/each}
+				</div>
+			{/each}
+		</div>
+	</div>
+	<!-- Body -->
+	<div class="relative">
+		{api.core.rows.visible.length}
+		{#each api.core.rows.visible.slice(0, 10) as row (row.id)}
+			<div
+				class="flex group"
+				animate:flip
+				in:fade>
+				{#each row.cells as cell (cell.id)}
+					<BodyCell
+						{api}
+						{cell} />
+				{/each}
+			</div>
+		{/each}
+	</div>
+	<CustomComponents
+		{api}
+		position={CustomComponentPosition.Footer} />
+</div>

package/dist/datagrid/components/Datagrid.svelte.d.ts

@@ -0,0 +1,39 @@
+import type { BaseColumn } from '../models';
+import { SveltixGrid } from '../SveltixGrid.svelte';
+declare function $$render<T>(): {
+    props: {
+        /**
+         * Rows to render.
+         */
+        rows: T[];
+        /**
+         * Columns to render.
+         */
+        columns: BaseColumn<T>[];
+        /**
+         * API instance to control the datagrid.
+         */
+        api: SveltixGrid<T>;
+    };
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<T> {
+    props(): ReturnType<typeof $$render<T>>['props'];
+    events(): ReturnType<typeof $$render<T>>['events'];
+    slots(): ReturnType<typeof $$render<T>>['slots'];
+    bindings(): "";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <T>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
+    } & ReturnType<__sveltets_Render<T>['exports']>;
+    <T>(internal: unknown, props: ReturnType<__sveltets_Render<T>['props']> & {}): ReturnType<__sveltets_Render<T>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const Datagrid: $$IsomorphicComponent;
+type Datagrid<T> = InstanceType<typeof Datagrid<T>>;
+export default Datagrid;

package/dist/datagrid/core-modules/columns/Column.svelte.d.ts

@@ -0,0 +1,79 @@
+import type { ISveltixGrid } from '../../interfaces';
+import { type BaseColumn, type Formatter, type FormatterComponentProps, type Value } from '../../models';
+import { type Component, type Snippet } from 'svelte';
+import type { Row } from '../rows/Row.svelte';
+export declare enum FormatterValue {
+    Static = "Static",
+    Snippet = "Snippet",
+    Component = "Component"
+}
+interface BaseFormatted<T extends FormatterValue> {
+    mode: T;
+}
+export interface FormattedStatic extends BaseFormatted<FormatterValue.Static> {
+    format: string;
+}
+export interface FormattedSnippet extends BaseFormatted<FormatterValue.Snippet> {
+    snippet: Snippet<[value: any]>;
+}
+export interface FormattedComponent<T> extends BaseFormatted<FormatterValue.Component> {
+    component: Component<FormatterComponentProps<T>>;
+}
+export type Formatted<T> = FormattedSnippet | FormattedStatic | FormattedComponent<T>;
+export interface HelperComponentProps<T, TOptions = void> {
+    api: ISveltixGrid<T>;
+    column: Column<T>;
+    options: TOptions;
+}
+export type HelperComponent<T, TOption> = Component<HelperComponentProps<T, TOption>>;
+export declare enum HelperPosition {
+    Before = "Before",
+    After = "After"
+}
+interface HelperEntry<T> {
+    id: string;
+    helper: HelperComponent<T, unknown>;
+    option: unknown;
+}
+export declare class Column<T> {
+    get id(): string;
+    get publicColumn(): BaseColumn<T>;
+    get width(): number;
+    get valueGetter(): Value<T> | undefined;
+    get helperBefore(): HelperEntry<T>[];
+    get helperAfter(): HelperEntry<T>[];
+    get minimumWidth(): number;
+    private _api;
+    private _id;
+    private _valueGetters;
+    private _formatters;
+    private _valuesCache;
+    private _formatsCache;
+    private _publicColumn;
+    private _width;
+    private _valueGetter;
+    private _helperBefore;
+    private _helperAfter;
+    private _minimumWidth;
+    constructor(api: ISveltixGrid<T>, id: string, column: BaseColumn<T>);
+    private getFormatterFunction;
+    private getValueGetterFunction;
+    addValueGetter(key: string, getter: Value<T>): void;
+    clearCache(row: Row<T>, key?: string): void;
+    getValue(row: Row<T>, key?: string, ignoreCache?: boolean): unknown | undefined;
+    addFormatter(key: string, formatter: Formatter<T>): void;
+    format(value: unknown, row: Row<T>, key?: string): Formatted<T>;
+    private formatStatic;
+    private getKey;
+    addHelperStart<TOption = void>(id: string, helper: HelperComponent<T, TOption>, position: HelperPosition, option: TOption): void;
+    addHelperEnd<TOption = void>(id: string, helper: HelperComponent<T, TOption>, position: HelperPosition, option: TOption): void;
+    addHelper<TOption = void>(id: string, helper: HelperComponent<T, TOption>, position: HelperPosition, option: TOption): void;
+    private getMap;
+    calculateWidth(): Promise<void>;
+    private processRowForWidth;
+    private getCellFormatWidth;
+    getDom(): HTMLDivElement | undefined;
+    getWidth(): number | undefined;
+    setWidth(width: number): void;
+}
+export {};