@ngrdt/forms 0.0.18

package/fesm2022/ngrdt-forms.mjs

@@ -0,0 +1,1116 @@
+import * as i0 from '@angular/core';
+import { inject, Injector, signal, input, model, linkedSignal, booleanAttribute, computed, effect, untracked, Directive, numberAttribute, InjectionToken, ElementRef } from '@angular/core';
+import { takeUntilDestroyed, toSignal, toObservable } from '@angular/core/rxjs-interop';
+import { NgControl, Validators, FormControl } from '@angular/forms';
+import { RdtInteractiveElementComponent } from '@ngrdt/core';
+import { RdtFileUtils } from '@ngrdt/utils';
+import { take, map, forkJoin, of, from, switchMap, debounceTime, distinctUntilChanged } from 'rxjs';
+import { signalStore, withState, withHooks, withComputed, withMethods, patchState } from '@ngrx/signals';
+
+const noop = () => { };
+class RdtBaseFormInputComponent extends RdtInteractiveElementComponent {
+    injector = inject(Injector);
+    _control = signal(null, ...(ngDevMode ? [{ debugName: "_control" }] : []));
+    control = this._control.asReadonly();
+    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
+    placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+    externalValue = model(null, ...(ngDevMode ? [{ debugName: "externalValue", alias: 'value' }] : [{ alias: 'value' }]));
+    internalValue = linkedSignal(() => this.toInternalValue(this.externalValue()));
+    dataTestIdInput = input(undefined, ...(ngDevMode ? [{ debugName: "dataTestIdInput", alias: 'dataTestId' }] : [{ alias: 'dataTestId' }]));
+    dataTestId = linkedSignal(() => this.dataTestIdInput() ?? this.label() ?? '');
+    readonlyInput = input(null, ...(ngDevMode ? [{ debugName: "readonlyInput", alias: 'readonly',
+            transform: booleanAttribute }] : [{
+            alias: 'readonly',
+            transform: booleanAttribute,
+        }]));
+    requiredInput = input(null, ...(ngDevMode ? [{ debugName: "requiredInput", alias: 'required',
+            transform: booleanAttribute }] : [{
+            alias: 'required',
+            transform: booleanAttribute,
+        }]));
+    requiredFromControl = signal(false, ...(ngDevMode ? [{ debugName: "requiredFromControl" }] : []));
+    required = linkedSignal(() => {
+        return this.requiredInput() ?? this.requiredFromControl() ?? false;
+    });
+    touchedInternal = signal(false, ...(ngDevMode ? [{ debugName: "touchedInternal" }] : []));
+    touched = computed(() => {
+        const control = this.control();
+        if (control) {
+            return control.touchedReactive();
+        }
+        else {
+            return this.touchedInternal();
+        }
+    }, ...(ngDevMode ? [{ debugName: "touched" }] : []));
+    invalid = computed(() => {
+        if (this.requiredInput() && this.isEmpty(this.externalValue())) {
+            return true;
+        }
+        const control = this.control();
+        if (control) {
+            return control.statusReactive() === 'INVALID';
+        }
+        else {
+            return false;
+        }
+    }, ...(ngDevMode ? [{ debugName: "invalid" }] : []));
+    requiredEffect = effect(() => {
+        this.requiredInput();
+        this.onValidatorChange();
+    }, ...(ngDevMode ? [{ debugName: "requiredEffect" }] : []));
+    requiredError = computed(() => this.getRequiredError(this.externalValue()), ...(ngDevMode ? [{ debugName: "requiredError" }] : []));
+    controlErrors = computed(() => {
+        const control = this.control();
+        if (control) {
+            control.statusReactive();
+            return control.errors;
+        }
+        else {
+            return null;
+        }
+    }, ...(ngDevMode ? [{ debugName: "controlErrors" }] : []));
+    errors = computed(() => this.controlErrors() ?? this.requiredError(), ...(ngDevMode ? [{ debugName: "errors" }] : []));
+    visibleErrors = computed(() => this.invalid() && this.touched() ? this.errors() : null, ...(ngDevMode ? [{ debugName: "visibleErrors" }] : []));
+    get ngControl() {
+        return this._ngControl;
+    }
+    _ngControl = null;
+    _onChange = noop;
+    _onTouch = noop;
+    _onValidatorChange = noop;
+    get onChange() {
+        return this._onChange;
+    }
+    get onTouch() {
+        return this._onTouch;
+    }
+    get onValidatorChange() {
+        return this._onValidatorChange;
+    }
+    ngOnInit() {
+        this._ngControl = this.injector.get(NgControl, null, {
+            self: true,
+            optional: true,
+        });
+        const control = this.ngControl?.control;
+        this._control.set(control ?? null);
+        if (control) {
+            control.events.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => {
+                this.requiredFromControl.set(control.hasValidator(Validators.required));
+            });
+        }
+    }
+    ngOnDestroy() {
+        const control = this.control();
+        if (this.requiredInput() && control) {
+            control.removeValidators(Validators.required);
+            control.setErrors(null);
+        }
+    }
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouch = () => {
+            this.touchedInternal.set(true);
+            fn();
+        };
+    }
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    writeValue(value) {
+        this.externalValue.set(value);
+    }
+    // Implemented as a part of Validator.
+    validate(control) {
+        return this.requiredError();
+    }
+    registerOnValidatorChange(fn) {
+        this._onValidatorChange = fn;
+    }
+    onInternalValueChange(value) {
+        if (value === '') {
+            value = null; // Convert empty string to null
+        }
+        if (value !== untracked(this.internalValue)) {
+            const externalValue = this.toExternalValue(value);
+            this.externalValue.set(externalValue);
+            this.onChange(externalValue);
+        }
+    }
+    toExternalValue(internalValue) {
+        return internalValue;
+    }
+    toInternalValue(externalValue) {
+        return externalValue;
+    }
+    onBlur() {
+        super.onBlur();
+        Promise.resolve().then(() => {
+            this.onTouch();
+            this.cd.markForCheck();
+        });
+    }
+    getRequiredError(value) {
+        return this.required() && this.isEmpty(value)
+            ? RdtBaseFormInputComponent.REQUIRED_ERROR
+            : null;
+    }
+    static REQUIRED_ERROR = { required: true };
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtBaseFormInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.7", type: RdtBaseFormInputComponent, isStandalone: true, inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, externalValue: { classPropertyName: "externalValue", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, dataTestIdInput: { classPropertyName: "dataTestIdInput", publicName: "dataTestId", isSignal: true, isRequired: false, transformFunction: null }, readonlyInput: { classPropertyName: "readonlyInput", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, requiredInput: { classPropertyName: "requiredInput", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { externalValue: "valueChange" }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtBaseFormInputComponent, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                }]
+        }] });
+
+class RdtCheckboxComponent extends RdtBaseFormInputComponent {
+    trueValueInput = input(true, ...(ngDevMode ? [{ debugName: "trueValueInput", alias: 'trueValue' }] : [{
+            alias: 'trueValue',
+        }]));
+    trueValue = linkedSignal(() => this.trueValueInput());
+    falseValueInput = input(false, ...(ngDevMode ? [{ debugName: "falseValueInput", alias: 'falseValue' }] : [{
+            alias: 'falseValue',
+        }]));
+    falseValue = linkedSignal(() => this.falseValueInput());
+    indeterminate = input(false, ...(ngDevMode ? [{ debugName: "indeterminate", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+    toExternalValue(internalValue) {
+        switch (internalValue) {
+            case true:
+                return this.trueValue();
+            case false:
+                return this.falseValue();
+            default:
+                return null;
+        }
+    }
+    toInternalValue(externalValue) {
+        switch (externalValue) {
+            case this.trueValue():
+                return true;
+            case this.falseValue():
+                return false;
+            default:
+                return null;
+        }
+    }
+    isEmpty(value) {
+        return value === null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtCheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.7", type: RdtCheckboxComponent, isStandalone: true, inputs: { trueValueInput: { classPropertyName: "trueValueInput", publicName: "trueValue", isSignal: true, isRequired: false, transformFunction: null }, falseValueInput: { classPropertyName: "falseValueInput", publicName: "falseValue", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtCheckboxComponent, decorators: [{
+            type: Directive
+        }] });
+
+function nullToUndefined(value) {
+    return value === null ? undefined : value;
+}
+function nullToUndefinedNumeric(value) {
+    return numberAttribute(value, undefined);
+}
+
+class RdtDateComponent extends RdtBaseFormInputComponent {
+    type = input('date', ...(ngDevMode ? [{ debugName: "type" }] : []));
+    minInput = input(undefined, ...(ngDevMode ? [{ debugName: "minInput", transform: nullToUndefined }] : [{
+            transform: nullToUndefined,
+        }]));
+    min = linkedSignal(() => {
+        const minInput = this.minInput();
+        return minInput ? this.toInternalValue(minInput) : null;
+    });
+    maxInput = input(undefined, ...(ngDevMode ? [{ debugName: "maxInput", transform: nullToUndefined }] : [{
+            transform: nullToUndefined,
+        }]));
+    max = linkedSignal(() => {
+        const maxInput = this.maxInput();
+        return maxInput ? this.toInternalValue(maxInput) : null;
+    });
+    isEmpty(value) {
+        return value === null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtDateComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.7", type: RdtDateComponent, isStandalone: true, inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, minInput: { classPropertyName: "minInput", publicName: "minInput", isSignal: true, isRequired: false, transformFunction: null }, maxInput: { classPropertyName: "maxInput", publicName: "maxInput", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtDateComponent, decorators: [{
+            type: Directive
+        }] });
+
+class RdtFileReader {
+    read(file) {
+        return this.extractData(file).pipe(take(1), map((content) => ({
+            fileName: file.name,
+            content,
+            size: file.size,
+            mimeType: file.type ?? undefined,
+            modified: isNaN(file.lastModified)
+                ? undefined
+                : new Date(file.lastModified),
+            originalFile: file,
+        })));
+    }
+    readAll(files) {
+        return forkJoin(files.map((file) => this.read(file)));
+    }
+}
+
+class NoOpFileReader extends RdtFileReader {
+    extractData() {
+        return of(undefined);
+    }
+}
+const NO_OP_FILE_READER = new NoOpFileReader();
+
+class RdtFileReaderBase64 extends RdtFileReader {
+    removeDataPrefix;
+    constructor(removeDataPrefix = false) {
+        super();
+        this.removeDataPrefix = removeDataPrefix;
+    }
+    extractData(file) {
+        let promise = RdtFileUtils.blobToDataUrl(file);
+        if (this.removeDataPrefix) {
+            promise = promise.then((dataUrl) => dataUrl.substring(dataUrl.indexOf(',') + 1));
+        }
+        return from(promise);
+    }
+}
+
+const RDT_DEFAULT_FILE_READER = new InjectionToken('RDT_DEFAULT_FILE_READER', {
+    factory: () => new RdtFileReaderBase64(),
+    providedIn: 'root',
+});
+
+function czechFileLabelFn(files) {
+    switch (files.length) {
+        case 0:
+            return 'Vyberte soubor';
+        case 1:
+            return files[0].fileName;
+        case 2:
+        case 3:
+        case 4:
+            return `Vybrány ${files.length} soubory`;
+        default:
+            return `Vybráno ${files.length} souborů`;
+    }
+}
+const RDT_DEFAULT_FILE_LABEL_FN = new InjectionToken('RDT_DEFAULT_FILE_LABEL_FN', {
+    providedIn: 'root',
+    factory: () => czechFileLabelFn,
+});
+
+const RDT_DEFAULT_MAX_FILE_SIZE = new InjectionToken('RDT_DEFAULT_MAX_FILE_SIZE', {
+    factory: () => '100 MB',
+    providedIn: 'root',
+});
+
+class RdtFileInputComponent extends RdtBaseFormInputComponent {
+    defaultFileReader = inject(RDT_DEFAULT_FILE_READER);
+    defaultMaxFileSize = inject(RDT_DEFAULT_MAX_FILE_SIZE);
+    defaultLabelFn = inject(RDT_DEFAULT_FILE_LABEL_FN);
+    readerInput = input(this.defaultFileReader, ...(ngDevMode ? [{ debugName: "readerInput", alias: 'reader' }] : [{
+            alias: 'reader',
+        }]));
+    reader = linkedSignal(() => this.readerInput());
+    acceptInput = input(undefined, ...(ngDevMode ? [{ debugName: "acceptInput", alias: 'accept', transform: nullToUndefined }] : [{ alias: 'accept', transform: nullToUndefined }]));
+    accept = linkedSignal(() => {
+        const acceptInput = this.acceptInput();
+        return !acceptInput || Array.isArray(acceptInput)
+            ? acceptInput
+            : [acceptInput];
+    });
+    jointAccept = computed(() => this.accept()?.join(','), ...(ngDevMode ? [{ debugName: "jointAccept" }] : []));
+    maxFileSizeInput = input(this.defaultMaxFileSize, ...(ngDevMode ? [{ debugName: "maxFileSizeInput", alias: 'maxFileSize',
+            transform: nullToUndefined }] : [{
+            alias: 'maxFileSize',
+            transform: nullToUndefined,
+        }]));
+    maxFileSize = linkedSignal(() => this.maxFileSizeInput());
+    maxFileSizeInBytes = computed(() => {
+        const maxFileSize = this.maxFileSize();
+        return maxFileSize ? RdtFileUtils.fileSizeToBytes(maxFileSize) : null;
+    }, ...(ngDevMode ? [{ debugName: "maxFileSizeInBytes" }] : []));
+    labelFn = input(this.defaultLabelFn, ...(ngDevMode ? [{ debugName: "labelFn" }] : []));
+    multiple = input(false, ...(ngDevMode ? [{ debugName: "multiple", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+    labelCtrl = new FormControl(null);
+    labelDataTestId = computed(() => this.dataTestId() + '-label', ...(ngDevMode ? [{ debugName: "labelDataTestId" }] : []));
+    touchedEffect = effect(() => {
+        const touched = this.touched();
+        if (touched) {
+            this.labelCtrl.markAsTouched();
+        }
+        else {
+            this.labelCtrl.markAsUntouched();
+        }
+    }, ...(ngDevMode ? [{ debugName: "touchedEffect" }] : []));
+    errorEffect = effect(() => {
+        this.labelCtrl?.setErrors(this.visibleErrors());
+    }, ...(ngDevMode ? [{ debugName: "errorEffect" }] : []));
+    ngOnInit() {
+        super.ngOnInit();
+        this.control()?.addValidators(this._maxFileSizeValidator);
+    }
+    ngOnDestroy() {
+        super.ngOnDestroy();
+        this.control()?.removeValidators(this._maxFileSizeValidator);
+    }
+    onFileSelected(event) {
+        const target = event.target;
+        if (!target.files) {
+            return;
+        }
+        let shouldRead = true;
+        const maxBytes = this.maxFileSizeInBytes();
+        if (maxBytes !== null) {
+            const files = Array.from(target.files);
+            for (const file of files) {
+                if (file.size > maxBytes) {
+                    shouldRead = false;
+                    break;
+                }
+            }
+        }
+        const reader = shouldRead
+            ? this.reader()
+            : NO_OP_FILE_READER;
+        reader
+            .readAll(Array.from(target.files))
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe((files) => {
+            console.log(files);
+            this.onChange(files);
+            this.writeValue(files);
+        });
+    }
+    writeValue(value) {
+        super.writeValue(value);
+        this.setInnerValue(value);
+    }
+    setInnerValue(files) {
+        if (this.labelCtrl) {
+            const label = this.labelFn()(files ?? []);
+            this.labelCtrl.setValue(label);
+        }
+    }
+    clear() {
+        this.onInternalValueChange(null);
+    }
+    _maxFileSizeValidator = (ctrl) => {
+        const maxSize = this.maxFileSizeInBytes();
+        if (maxSize === null ||
+            !Array.isArray(ctrl.value) ||
+            ctrl.value.length === 0) {
+            return null;
+        }
+        const files = ctrl.value;
+        for (const file of files) {
+            if (file['size'] !== undefined && file.size > maxSize) {
+                return {
+                    maxFileSize: {
+                        max: maxSize,
+                        actual: file.size,
+                    },
+                };
+            }
+        }
+        return null;
+    };
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtFileInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.7", type: RdtFileInputComponent, isStandalone: true, inputs: { readerInput: { classPropertyName: "readerInput", publicName: "reader", isSignal: true, isRequired: false, transformFunction: null }, acceptInput: { classPropertyName: "acceptInput", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, maxFileSizeInput: { classPropertyName: "maxFileSizeInput", publicName: "maxFileSize", isSignal: true, isRequired: false, transformFunction: null }, labelFn: { classPropertyName: "labelFn", publicName: "labelFn", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtFileInputComponent, decorators: [{
+            type: Directive
+        }] });
+
+class RdtFileReaderArrayBuffer extends RdtFileReader {
+    extractData(file) {
+        return from(RdtFileUtils.fileAsArrayBuffer(file));
+    }
+}
+
+class VnshFileReaderText extends RdtFileReader {
+    encoding;
+    constructor(encoding) {
+        super();
+        this.encoding = encoding;
+    }
+    extractData(file) {
+        return from(RdtFileUtils.fileAsText(file, this.encoding));
+    }
+}
+
+class RdtNumericInputComponent extends RdtBaseFormInputComponent {
+    min = input(undefined, ...(ngDevMode ? [{ debugName: "min", transform: nullToUndefinedNumeric }] : [{
+            transform: nullToUndefinedNumeric,
+        }]));
+    max = input(undefined, ...(ngDevMode ? [{ debugName: "max", transform: nullToUndefinedNumeric }] : [{
+            transform: nullToUndefinedNumeric,
+        }]));
+    step = input(undefined, ...(ngDevMode ? [{ debugName: "step", transform: nullToUndefinedNumeric }] : [{
+            transform: nullToUndefinedNumeric,
+        }]));
+    autocomplete = input(undefined, ...(ngDevMode ? [{ debugName: "autocomplete", transform: nullToUndefined }] : [{
+            transform: nullToUndefined,
+        }]));
+    isEmpty(value) {
+        return value === null;
+    }
+    toExternalValue(internalValue) {
+        if (typeof internalValue === 'number') {
+            return internalValue;
+        }
+        else if (internalValue && typeof internalValue === 'string') {
+            return parseFloat(internalValue);
+        }
+        return null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtNumericInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.7", type: RdtNumericInputComponent, isStandalone: true, inputs: { min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtNumericInputComponent, decorators: [{
+            type: Directive
+        }] });
+
+class RdtSelectDatasource {
+}
+
+class RdtOfflineSelectDatasource extends RdtSelectDatasource {
+    data;
+    totalCountKnown = true;
+    queryRequired = true;
+    preprocessedData;
+    constructor(data) {
+        super();
+        this.data = data;
+        this.preprocessedData = this.preprocessData(data);
+    }
+    getData(params) {
+        const page = this.getPage(this.filterData(params.query), params.pageIndex, params.pageSize);
+        return of(page);
+    }
+    getLabel(item) {
+        return item.label;
+    }
+    getId(item) {
+        return item.value;
+    }
+    getItemsByIds(ids) {
+        const result = new Map();
+        for (const id of ids) {
+            const item = this.preprocessedData.find((item) => item.value === id);
+            if (item) {
+                result.set(id, item);
+            }
+        }
+        return of(result);
+    }
+    preprocessLabel(label) {
+        return label.trim().toLowerCase();
+    }
+    preprocessData(data) {
+        return data.map((item) => ({
+            value: item.value,
+            label: this.preprocessLabel(item.label),
+        }));
+    }
+    filterData(query) {
+        if (!query) {
+            return this.preprocessedData;
+        }
+        const prepQuery = this.preprocessLabel(query);
+        if (!prepQuery) {
+            return this.preprocessedData;
+        }
+        return this.preprocessedData.filter((item) => item.label.includes(prepQuery));
+    }
+    getPage(data, pageIndex, pageSize) {
+        if (pageSize < 1) {
+            throw new Error('Invalid page size');
+        }
+        if (pageIndex < 0) {
+            throw new Error('Invalid page index');
+        }
+        if (pageIndex * pageSize > data.length) {
+            return {
+                data: [],
+                totalCount: data.length,
+                pageIndex: pageIndex,
+            };
+        }
+        const start = pageIndex * pageSize;
+        const end = start + pageSize;
+        const items = data.slice(start, end);
+        return {
+            data: items,
+            totalCount: data.length,
+            pageIndex: pageIndex,
+        };
+    }
+}
+
+const rdtSelectInitialState = {
+    query: null,
+    nextPageIndex: 0,
+    pageSize: 20,
+    totalCount: 0,
+    totalCountKnown: false,
+    options: [],
+    datasource: null,
+    selectedMap: new Map(),
+    fetchError: null,
+    missingValuePlaceholder: 'Načítání...',
+    _fetchRequest: null,
+    _fetchMissingRequest: null,
+    _missingSelected: [],
+};
+
+function compareSelectRequestParams(a, b) {
+    return (a.query === b.query &&
+        a.pageIndex === b.pageIndex &&
+        a.pageSize === b.pageSize);
+}
+
+function getRdtSelectStore(initialState = rdtSelectInitialState) {
+    return signalStore(withState(initialState), withHooks({
+        onDestroy(store) {
+            store._fetchMissingRequest()?.subscription.unsubscribe();
+            store._fetchRequest()?.subscription.unsubscribe();
+        },
+    }), withComputed((state) => ({
+        hasMore: computed(() => state.nextPageIndex !== null),
+        selectedItems: computed(() => {
+            return Array.from(state.selectedMap().values());
+        }),
+        loadingOptions: computed(() => state._fetchRequest() !== null),
+        loadingMissing: computed(() => state._fetchMissingRequest() !== null),
+        loading: computed(() => state._fetchRequest() !== null ||
+            state._fetchMissingRequest() !== null),
+        // Shows selected + others while query is empty
+        // Shows only query results while query has value
+        visibleOptions: computed(() => {
+            const items = state.options();
+            const query = state.query();
+            const selectedMap = state.selectedMap();
+            const missing = state._missingSelected();
+            if (query || (selectedMap.size === 0 && missing.length === 0)) {
+                return items.map((it) => ({
+                    ...it,
+                    selected: false,
+                }));
+            }
+            const selected = Array.from(selectedMap.values()).map((it) => ({ ...it, selected: true }));
+            const missingPlaceholder = state.missingValuePlaceholder();
+            const placeholders = missing.map((id) => ({
+                id,
+                label: missingPlaceholder.replace('{id}', String(id)),
+                value: null,
+                selected: true,
+            }));
+            placeholders.forEach((pl) => selected.push(pl));
+            items.forEach((item) => {
+                if (!selectedMap.has(item.id)) {
+                    selected.push({ ...item, selected: false });
+                }
+            });
+            return selected;
+        }),
+    })), withMethods((store) => ({
+        fetch() {
+            const datasource = untracked(store.datasource);
+            const index = untracked(store.nextPageIndex);
+            const query = untracked(store.query);
+            const pageSize = untracked(store.pageSize);
+            if (!datasource || index === null) {
+                return;
+            }
+            const params = {
+                query: query,
+                pageIndex: index,
+                pageSize: pageSize,
+            };
+            const currentRequest = untracked(store._fetchRequest);
+            if (currentRequest) {
+                if (compareSelectRequestParams(currentRequest.params, params)) {
+                    return;
+                }
+                else {
+                    currentRequest.subscription.unsubscribe();
+                }
+            }
+            const observer = this._getFetchObserver(params);
+            const subscription = datasource.getData(params).subscribe(observer);
+            // Offline datasource using `of()` emits value synchronously
+            if (!subscription.closed) {
+                patchState(store, {
+                    _fetchRequest: { subscription, params: params },
+                });
+            }
+        },
+        _getFetchObserver(requestParams) {
+            return {
+                next: (page) => this._onFetchSuccess(page, requestParams),
+                error: (error) => this._onFetchError(error),
+                complete: () => this._onFetchComplete(),
+            };
+        },
+        _onFetchSuccess(page, requestParams) {
+            let nextPageIndex = page.pageIndex + 1;
+            if (page.totalCount === null) {
+                if (page.data.length < requestParams.pageSize) {
+                    nextPageIndex = null;
+                }
+            }
+            else if (requestParams.pageIndex * requestParams.pageSize + page.data.length >=
+                page.totalCount) {
+                nextPageIndex = null;
+            }
+            const options = [
+                ...untracked(store.options),
+                ...this._getLabelValueIds(page.data),
+            ];
+            patchState(store, {
+                totalCount: page.totalCount ??
+                    Math.max(untracked(store.totalCount), page.pageIndex * requestParams.pageSize + page.data.length),
+                nextPageIndex,
+                totalCountKnown: page.totalCount !== null ||
+                    page.data.length < requestParams.pageSize,
+                options,
+                _fetchRequest: null,
+            });
+            this._loadMissingSelected();
+        },
+        _onFetchError(error) {
+            patchState(store, {
+                fetchError: getRdtSelectError(error),
+                _fetchRequest: null,
+            });
+        },
+        _onFetchComplete() {
+            patchState(store, {
+                _fetchRequest: null,
+            });
+        },
+        setDatasource(datasource) {
+            untracked(store._fetchRequest)?.subscription.unsubscribe();
+            patchState(store, {
+                datasource,
+                _fetchRequest: null,
+                fetchError: null,
+                totalCountKnown: datasource.totalCountKnown,
+                nextPageIndex: 0,
+                totalCount: 0,
+                options: [],
+            });
+            if (!datasource.queryRequired) {
+                this.fetch();
+            }
+            else {
+                this._loadMissingSelected();
+            }
+        },
+        setQuery(query) {
+            const datasource = untracked(store.datasource);
+            if (query !== untracked(store.query)) {
+                this.reset();
+                patchState(store, { query });
+                if (query || !datasource?.queryRequired) {
+                    this.fetch();
+                }
+            }
+        },
+        reset() {
+            patchState(store, {
+                query: null,
+                nextPageIndex: 0,
+                options: [],
+                totalCount: 0,
+                totalCountKnown: untracked(store.datasource)?.totalCountKnown ?? true,
+            });
+        },
+        resetTotalCountKnown() {
+            patchState(store, {
+                totalCountKnown: untracked(store.datasource)?.totalCountKnown ?? true,
+            });
+        },
+        setSelected(ids) {
+            patchState(store, {
+                _missingSelected: ids,
+                selectedMap: new Map(),
+            });
+            this._loadMissingSelected();
+        },
+        select(ids) {
+            const oldMissing = untracked(store._missingSelected);
+            const notInMissing = ids.filter((id) => !oldMissing.includes(id));
+            if (notInMissing.length > 0) {
+                patchState(store, {
+                    _missingSelected: oldMissing.concat(notInMissing),
+                });
+                this._loadMissingSelected();
+            }
+        },
+        unselectAll() {
+            const fetchMissingReq = untracked(store._fetchMissingRequest);
+            if (fetchMissingReq) {
+                fetchMissingReq.subscription.unsubscribe();
+            }
+            patchState(store, {
+                _missingSelected: [],
+                selectedMap: new Map(),
+                _fetchMissingRequest: null,
+            });
+        },
+        _setAndGetMissing() {
+            const allMissing = untracked(store._missingSelected);
+            const items = untracked(store.options);
+            const selectedMap = new Map(untracked(store.selectedMap));
+            const newMissing = [];
+            let selectedChanged = false;
+            for (const id of allMissing) {
+                const item = items.find((it) => it.id === id);
+                if (item) {
+                    selectedMap.set(id, item);
+                    selectedChanged = true;
+                }
+                else {
+                    newMissing.push(id);
+                }
+            }
+            if (selectedChanged) {
+                patchState(store, { selectedMap });
+            }
+            if (newMissing.length === 0) {
+                this._cancelFetchMissingIfNeeded();
+            }
+            patchState(store, { _missingSelected: newMissing });
+            return newMissing;
+        },
+        _loadMissingSelected() {
+            const reallyMissing = this._setAndGetMissing();
+            if (!untracked(store.loading) && reallyMissing.length > 0) {
+                this._fetchMissing(reallyMissing);
+            }
+        },
+        _cancelFetchMissingIfNeeded() {
+            const fetchMissingReq = untracked(store._fetchMissingRequest);
+            const items = untracked(store.options);
+            if (fetchMissingReq?.ids.every((id) => items.some((it) => it.id === id))) {
+                fetchMissingReq.subscription.unsubscribe();
+                patchState(store, {
+                    _fetchMissingRequest: null,
+                    _missingSelected: [],
+                });
+            }
+        },
+        _fetchMissing(ids) {
+            const datasource = untracked(store.datasource);
+            if (!datasource || ids.length === 0) {
+                return;
+            }
+            const sub = datasource.getItemsByIds(ids).subscribe((map) => {
+                const newMissing = [];
+                const newSelected = new Map(untracked(store.selectedMap));
+                for (const id of untracked(store._missingSelected)) {
+                    if (map.has(id)) {
+                        const value = map.get(id);
+                        const label = datasource.getLabel(value);
+                        newSelected.set(id, { label, value, id });
+                    }
+                    else {
+                        newMissing.push(id);
+                    }
+                }
+                patchState(store, {
+                    _fetchMissingRequest: null,
+                    _missingSelected: newMissing,
+                    selectedMap: newSelected,
+                });
+                this._loadMissingSelected();
+            });
+            if (!sub.closed) {
+                patchState(store, {
+                    _fetchMissingRequest: { ids, subscription: sub },
+                });
+            }
+        },
+        selectSingle(id) {
+            this.setSelected([id]);
+        },
+        toggle(id) {
+            const oldMap = untracked(store.selectedMap);
+            const datasource = untracked(store.datasource);
+            if (!datasource) {
+                throw new Error('Datasource is undefined');
+            }
+            if (oldMap.has(id)) {
+                const newMap = new Map(oldMap);
+                newMap.delete(id);
+                patchState(store, { selectedMap: newMap });
+            }
+            else {
+                const item = untracked(store.options).find((it) => it.id === id);
+                if (!item) {
+                    this.select([id]);
+                }
+                else {
+                    const newMap = new Map(oldMap);
+                    newMap.set(id, item);
+                    patchState(store, { selectedMap: newMap });
+                }
+            }
+        },
+        cancelFetch() {
+            untracked(store._fetchRequest)?.subscription.unsubscribe();
+            patchState(store, {
+                _fetchRequest: null,
+                fetchError: null,
+            });
+        },
+        isSelected(item) {
+            const datasource = untracked(store.datasource);
+            if (!datasource) {
+                return false;
+            }
+            const id = datasource.getId(item);
+            return untracked(store.selectedMap).has(id);
+        },
+        setPageSize(size) {
+            patchState(store, { pageSize: size });
+        },
+        _getLabelValueIds(items) {
+            const datasource = untracked(store.datasource);
+            if (!datasource) {
+                throw new Error('Datasource not set!');
+            }
+            return items.map((item) => ({
+                label: datasource.getLabel(item),
+                value: item,
+                id: datasource.getId(item),
+            }));
+        },
+    })));
+}
+const RdtSelectStore = getRdtSelectStore();
+function getRdtSelectError(error) {
+    if (typeof error === 'string') {
+        return error;
+    }
+    else if (error instanceof Error) {
+        return error.message;
+    }
+    else if (error && typeof error === 'object' && 'message' in error) {
+        return error.message;
+    }
+    return 'Nastala chyba.';
+}
+
+class RdtSelectOfflineDatasourceProviderDirective {
+    store = inject(RdtSelectStore);
+    optionsInput = input.required(...(ngDevMode ? [{ debugName: "optionsInput", alias: 'options' }] : [{
+            alias: 'options',
+        }]));
+    options = computed(() => this.parseOptions(this.optionsInput()), ...(ngDevMode ? [{ debugName: "options" }] : []));
+    parseOptions(options) {
+        if (!options || options.length === 0) {
+            return [];
+        }
+        if (typeof options[0] === 'object' && options[0]) {
+            return options;
+        }
+        else {
+            return options.map((value) => ({
+                label: String(value),
+                value: value,
+            }));
+        }
+    }
+    optionsEffect = effect(() => this.setDatasource(), ...(ngDevMode ? [{ debugName: "optionsEffect" }] : []));
+    setDatasource() {
+        const options = this.options();
+        this.store.setDatasource(new RdtOfflineSelectDatasource(options));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtSelectOfflineDatasourceProviderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.7", type: RdtSelectOfflineDatasourceProviderDirective, isStandalone: true, inputs: { optionsInput: { classPropertyName: "optionsInput", publicName: "options", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtSelectOfflineDatasourceProviderDirective, decorators: [{
+            type: Directive
+        }] });
+
+class RdtSelectOptionDirective {
+    elementRef = inject(ElementRef);
+    value = input.required(...(ngDevMode ? [{ debugName: "value", alias: 'rdtSelectOption' }] : [{ alias: 'rdtSelectOption' }]));
+    _selected = signal(false, ...(ngDevMode ? [{ debugName: "_selected" }] : []));
+    set selected(value) {
+        this._selected.set(value);
+    }
+    get selected() {
+        return this._selected();
+    }
+    _disabled = signal(false, ...(ngDevMode ? [{ debugName: "_disabled" }] : []));
+    set disabled(value) {
+        this._disabled.set(value);
+    }
+    get disabled() {
+        return this._disabled();
+    }
+    setActiveStyles() {
+        this.selected = true;
+    }
+    setInactiveStyles() {
+        this.selected = false;
+    }
+    scrollIntoElement() {
+        this.elementRef.nativeElement.scrollIntoView({
+            block: 'nearest',
+            behavior: 'smooth',
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtSelectOptionDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.7", type: RdtSelectOptionDirective, isStandalone: true, selector: "[rdtSelectOption]", inputs: { value: { classPropertyName: "value", publicName: "rdtSelectOption", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class.rdt-option-selected": "_selected()", "class.rdt-option-disabled": "_disabled()" }, classAttribute: "rdt-option" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtSelectOptionDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[rdtSelectOption]',
+                    host: {
+                        class: 'rdt-option',
+                        '[class.rdt-option-selected]': '_selected()',
+                        '[class.rdt-option-disabled]': '_disabled()',
+                    },
+                }]
+        }] });
+
+class RdtBaseSelectCommonComponent extends RdtBaseFormInputComponent {
+    datasourceInput = input(null, ...(ngDevMode ? [{ debugName: "datasourceInput" }] : []));
+    store = inject(RdtSelectStore);
+    visibleOptions = this.store.visibleOptions;
+    queryValidatorFnInput = input(null, ...(ngDevMode ? [{ debugName: "queryValidatorFnInput", alias: 'inputValidator' }] : [{
+            alias: 'inputValidator',
+        }]));
+    queryValidatorFn = linkedSignal(() => this.queryValidatorFnInput());
+    queryValidatorEffect = effect(() => {
+        const validator = this.queryValidatorFn();
+        if (validator) {
+            this.inputCtrl.setValidators(validator);
+        }
+        else {
+            this.inputCtrl.clearValidators();
+        }
+    }, ...(ngDevMode ? [{ debugName: "queryValidatorEffect" }] : []));
+    inputCtrl = new FormControl(null);
+    inputCtrlEvents = toSignal(this.inputCtrl.events);
+    inputErrors = computed(() => {
+        this.inputCtrlEvents();
+        if (this.inputCtrl.touched && this.inputCtrl.invalid) {
+            return this.inputCtrl.errors;
+        }
+        else {
+            return null;
+        }
+    }, ...(ngDevMode ? [{ debugName: "inputErrors" }] : []));
+    debounceTimeInput = input(300, ...(ngDevMode ? [{ debugName: "debounceTimeInput", alias: 'debounce' }] : [{
+            alias: 'debounce',
+        }]));
+    debounceTime = linkedSignal(() => this.debounceTimeInput());
+    debouncedInput$ = toObservable(this.debounceTime).pipe(switchMap((time) => this.inputCtrl.valueChanges.pipe(debounceTime(time))), distinctUntilChanged());
+    debouncedInput = toSignal(this.debouncedInput$, {
+        initialValue: null,
+    });
+    pageSizeInput = input(20, ...(ngDevMode ? [{ debugName: "pageSizeInput", alias: 'pageSize' }] : [{
+            alias: 'pageSize',
+        }]));
+    pageSizeEffect = effect(() => this.store.setPageSize(this.pageSizeInput()), ...(ngDevMode ? [{ debugName: "pageSizeEffect" }] : []));
+    loading = computed(() => {
+        return (this.store.loading() ||
+            this.loadingInput() ||
+            Object.values(this.loadingMap()).some(Boolean));
+    }, ...(ngDevMode ? [{ debugName: "loading" }] : []));
+    ngOnInit() {
+        super.ngOnInit();
+        this.debouncedInput$
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe((value) => this.handleInput(value));
+    }
+    handleInput(value) {
+        this.store.setQuery(value);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtBaseSelectCommonComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.7", type: RdtBaseSelectCommonComponent, isStandalone: true, inputs: { datasourceInput: { classPropertyName: "datasourceInput", publicName: "datasourceInput", isSignal: true, isRequired: false, transformFunction: null }, queryValidatorFnInput: { classPropertyName: "queryValidatorFnInput", publicName: "inputValidator", isSignal: true, isRequired: false, transformFunction: null }, debounceTimeInput: { classPropertyName: "debounceTimeInput", publicName: "debounce", isSignal: true, isRequired: false, transformFunction: null }, pageSizeInput: { classPropertyName: "pageSizeInput", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtBaseSelectCommonComponent, decorators: [{
+            type: Directive
+        }] });
+
+class RdtMultiSelectComponent extends RdtBaseSelectCommonComponent {
+    selected = computed(() => {
+        const selected = this.store.selectedItems();
+        return selected.length > 0 ? selected : null;
+    }, ...(ngDevMode ? [{ debugName: "selected" }] : []));
+    isEmpty(value) {
+        return value === null || value.length === 0;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtMultiSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.7", type: RdtMultiSelectComponent, isStandalone: true, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtMultiSelectComponent, decorators: [{
+            type: Directive
+        }] });
+
+class RdtSingleSelectComponent extends RdtBaseSelectCommonComponent {
+    selected = computed(() => {
+        const items = this.store.selectedItems();
+        return items.length > 0 ? items[0] : null;
+    }, ...(ngDevMode ? [{ debugName: "selected" }] : []));
+    isEmpty(value) {
+        return value === null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtSingleSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.7", type: RdtSingleSelectComponent, isStandalone: true, providers: [
+            {
+                provide: RdtBaseFormInputComponent,
+                useValue: RdtSingleSelectComponent,
+            },
+        ], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtSingleSelectComponent, decorators: [{
+            type: Directive,
+            args: [{
+                    providers: [
+                        {
+                            provide: RdtBaseFormInputComponent,
+                            useValue: RdtSingleSelectComponent,
+                        },
+                    ],
+                }]
+        }] });
+
+class RdtTextInputComponent extends RdtBaseFormInputComponent {
+    type = input('text', ...(ngDevMode ? [{ debugName: "type" }] : []));
+    autocomplete = input(undefined, ...(ngDevMode ? [{ debugName: "autocomplete", transform: nullToUndefined }] : [{
+            transform: nullToUndefined,
+        }]));
+    maxlength = input(undefined, ...(ngDevMode ? [{ debugName: "maxlength", transform: nullToUndefinedNumeric }] : [{ transform: nullToUndefinedNumeric }]));
+    minlength = input(undefined, ...(ngDevMode ? [{ debugName: "minlength", transform: nullToUndefinedNumeric }] : [{ transform: nullToUndefinedNumeric }]));
+    pattern = input(undefined, ...(ngDevMode ? [{ debugName: "pattern", transform: nullToUndefined }] : [{
+            transform: nullToUndefined,
+        }]));
+    isEmpty(value) {
+        return value === '' || value === null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtTextInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.1.7", type: RdtTextInputComponent, isStandalone: true, inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, autocomplete: { classPropertyName: "autocomplete", publicName: "autocomplete", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, minlength: { classPropertyName: "minlength", publicName: "minlength", isSignal: true, isRequired: false, transformFunction: null }, pattern: { classPropertyName: "pattern", publicName: "pattern", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: RdtTextInputComponent, decorators: [{
+            type: Directive
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { NO_OP_FILE_READER, NoOpFileReader, RDT_DEFAULT_FILE_LABEL_FN, RDT_DEFAULT_FILE_READER, RDT_DEFAULT_MAX_FILE_SIZE, RdtCheckboxComponent, RdtDateComponent, RdtFileInputComponent, RdtFileReader, RdtFileReaderArrayBuffer, RdtFileReaderBase64, RdtMultiSelectComponent, RdtNumericInputComponent, RdtOfflineSelectDatasource, RdtSelectDatasource, RdtSelectOfflineDatasourceProviderDirective, RdtSelectOptionDirective, RdtSelectStore, RdtSingleSelectComponent, RdtTextInputComponent, VnshFileReaderText, czechFileLabelFn, rdtSelectInitialState };
+//# sourceMappingURL=ngrdt-forms.mjs.map