@metadev/lux 0.18.0 → 0.20.0

package/fesm2015/metadev-lux.js

@@ -1,4089 +0,0 @@
-import * as i1 from '@angular/common';
-import { DOCUMENT, isPlatformBrowser, CommonModule } from '@angular/common';
-import * as i0 from '@angular/core';
-import { EventEmitter, Component, forwardRef, ChangeDetectorRef, ViewChild, Output, Input, Injectable, Inject, ElementRef, HostBinding, HostListener, TemplateRef, ApplicationRef, Injector, RendererFactory2, ComponentFactoryResolver, Directive, Renderer2, InjectionToken, PLATFORM_ID, NgModule } from '@angular/core';
-import { NG_VALUE_ACCESSOR, NG_VALIDATORS, FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { NavigationEnd, Router, ActivatedRoute, RouterModule } from '@angular/router';
-import { AngularResizedEventModule } from 'angular-resize-event';
-import { of, Subject, fromEvent, from, BehaviorSubject } from 'rxjs';
-import { debounceTime, first, map, takeUntil, filter, withLatestFrom, distinctUntilChanged, switchMap } from 'rxjs/operators';
-import * as i1$1 from '@angular/common/http';
-import { HttpClient, HttpClientModule } from '@angular/common/http';
-
-// undefined and null functions
-const exists = (value) => value !== null && value !== undefined;
-const hasValue = (value) => exists(value) && (typeof value === 'string' ? !isEmptyString(value) : true);
-// string functions
-const isEmptyString = (value) => value.trim() === '';
-const isValidEmail = (value) => {
-    const re = /^[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?$/;
-    return re.test(String(value).toLowerCase().trim());
-};
-const isValidUrl = (value) => {
-    const re = /^([a-z]+?:\/\/)?((([a-z\d]([a-z\d-]*[a-z\d])*)\.)+[a-z]{2,}|((\d{1,3}\.){3}\d{1,3}))(\:\d+)?(\/[-a-z\d%_.~+]*)*(\?[;&a-z\d%_.~+=-]*)?(\#[-a-z\d_]*)?$/i;
-    return re.test(String(value).toLowerCase().trim());
-};
-const isValidColor = (value) => {
-    value = String(value).toLowerCase();
-    // valid values for CSS color property, yet not valid colors by themselves
-    if (value === 'currentcolor' ||
-        value === 'inherit' ||
-        value === 'initial' ||
-        value === 'revert' ||
-        value === 'unset') {
-        return false;
-    }
-    return CSS.supports('color', value);
-};
-// date functions
-const isValidDate = (date) => exists(date) ? !isNaN(date.getTime()) : false;
-const normalizeDate = (value) => {
-    if (typeof value === 'string' && value.length > 10) {
-        return value.substr(0, 10);
-    }
-    return value ? value.toString() : null;
-};
-const addTimezoneOffset = (date) => {
-    if (!isValidDate(date)) {
-        return date;
-    }
-    else {
-        return new Date(date.getTime() - date.getTimezoneOffset() * 60000);
-    }
-};
-// number functions
-const isValidNumber = (value) => (hasValue(value) ? !Number.isNaN(Number(value)) : false);
-const numberOfDecimalDigits = (x) => {
-    if (isValidNumber(x)) {
-        const xString = String(Number(x));
-        if (xString === 'Infinity') {
-            return 0;
-        }
-        const indexOfE = xString.indexOf('e');
-        if (indexOfE >= 0) {
-            return 0;
-        }
-        const indexOfDecimalPoint = xString.indexOf('.');
-        if (indexOfDecimalPoint < 0) {
-            return 0;
-        }
-        else {
-            return xString.length - indexOfDecimalPoint - 1;
-        }
-    }
-    return undefined;
-};
-const numberOfWholeDigits = (x) => {
-    if (isValidNumber(x)) {
-        let xString = String(Number(x));
-        if (xString.indexOf('-') === 0) {
-            xString = xString.slice(1, xString.length);
-        }
-        if (xString === 'Infinity') {
-            return Infinity;
-        }
-        if (xString.indexOf('0') === 0) {
-            xString = xString.slice(1, xString.length);
-        }
-        const indexOfE = xString.indexOf('e');
-        if (indexOfE >= 0) {
-            return Number(xString.slice(indexOfE + 1, xString.length)) + 1;
-        }
-        const indexOfDecimalPoint = xString.indexOf('.');
-        if (indexOfDecimalPoint < 0) {
-            return xString.length;
-        }
-        else {
-            return indexOfDecimalPoint;
-        }
-    }
-    return undefined;
-};
-const roundToMultipleOf = (x, modulo) => {
-    const moduloString = String(modulo);
-    // approximates the result
-    // prone to inexactitude because of floating point arithmetic
-    const approximation = Math.round(x / modulo) * modulo;
-    const approximationString = String(approximation);
-    // remove useless decimals
-    const uselessDecimalsInApproximation = numberOfDecimalDigits(approximationString) -
-        numberOfDecimalDigits(moduloString);
-    const resultString = approximationString.slice(0, approximationString.length - uselessDecimalsInApproximation);
-    return Number(resultString);
-};
-// other functions
-const isInitialAndEmpty = (previousValue, newValue) => {
-    const isPrevArray = Array.isArray(previousValue);
-    const isNewArray = Array.isArray(newValue);
-    return !((isPrevArray ? previousValue.length !== 0 : Boolean(previousValue)) ||
-        (isNewArray ? newValue.length !== 0 : Boolean(newValue)));
-};
-
-const LOST_FOCUS_TIME_WINDOW_MS = 200; // ms
-class AutocompleteComponent {
-    constructor(cd) {
-        this.cd = cd;
-        this.lostFocusHandled = true;
-        this.t0 = 0;
-        this.showSpinner = false;
-        this.touched = false;
-        this.completionList = [];
-        this.showCompletion = false;
-        this.valueChange = new EventEmitter();
-        this.dataSourceChange = new EventEmitter();
-        this.disabled = null;
-        this.readonly = null;
-        this.label = '';
-        /** If canAddNewValues, user can type items not present in the data-source. */
-        this.canAddNewValues = false;
-        /** After cleaning the selection should the completion list remain open or closed:
-         *  false: (default) close on filters, to clean a filter and select all.
-         *  true: keep open (when the action most likely is to pick another one).
-         */
-        this.keepOpenAfterDelete = false;
-        this.required = false;
-        this.resolveLabelsFunction = undefined;
-        this.populateFunction = undefined;
-        // ControlValueAccessor Interface
-        this.onChange = (value) => { };
-        this.onTouched = () => { };
-    }
-    get value() {
-        return this._value;
-    }
-    set value(v) {
-        const initialAndEmpty = isInitialAndEmpty(this._value, v);
-        this._value = v;
-        this.onChange(v);
-        this.completeLabel();
-        if (!initialAndEmpty) {
-            this.valueChange.emit(v);
-        }
-    }
-    get dataSource() {
-        return this._dataSource;
-    }
-    set dataSource(v) {
-        this._dataSource = v;
-        this.dataSourceChange.emit(v);
-    }
-    set placeholder(v) {
-        this._placeholder = v;
-    }
-    get placeholder() {
-        return this._placeholder ? this._placeholder : '';
-    }
-    writeValue(value) {
-        this.value = value;
-    }
-    registerOnChange(onChange) {
-        this.onChange = onChange;
-    }
-    registerOnTouched(onTouched) {
-        this.onTouched = onTouched;
-    }
-    markAsTouched() {
-        if (!this.touched && !this.disabled) {
-            this.onTouched();
-            this.touched = true;
-        }
-    }
-    setDisabledState(disabled) {
-        this.disabled = disabled;
-    }
-    // End ControlValueAccessor Interface
-    // Validator interface
-    registerOnValidatorChange() { }
-    validate(control) {
-        const value = control.value;
-        if (this.required &&
-            (value === '' || value === null || value === undefined)) {
-            return { required: { value, reason: 'Required field.' } };
-        }
-        return null;
-    }
-    // End of Validator interface
-    clear() {
-        this.value = null;
-        this.toggleCompletion(this.keepOpenAfterDelete, '');
-    }
-    completeLabel() {
-        if (this.value) {
-            if (this.dataSource) {
-                this.label = findLabelForId(this.dataSource, this.value) || '';
-            }
-            else if (this.instance && this.resolveLabelsFunction) {
-                this.resolveLabelsFunction(this.instance, [this.value])
-                    .pipe(debounceTime(1), first())
-                    .subscribe((data) => {
-                    this.label = findLabelForId(data, this.value) || '';
-                });
-            }
-        }
-        else {
-            this.label = '';
-        }
-    }
-    ngOnInit() {
-        this.inputId = this.inputId
-            ? this.inputId
-            : `autocompletelist${AutocompleteComponent.idCounter++}`;
-        this.completeLabel();
-    }
-    ngAfterViewInit() {
-        this.setSameWidth();
-    }
-    onInputResized() {
-        this.setSameWidth();
-    }
-    setSameWidth() {
-        const width = this.i0.nativeElement.getBoundingClientRect().width;
-        this.completeDiv.nativeElement.style.width = `${width}px`;
-    }
-    onKeydown(event, label) {
-        switch (event.key) {
-            case 'Tab':
-                if (label) {
-                    this.pickSelectionOrFirstMatch(label);
-                }
-                this.showCompletion = false;
-                break;
-        }
-        this.markAsTouched();
-    }
-    onKeypress(event, label) {
-        switch (event.key) {
-            case 'Intro':
-            case 'Enter':
-                this.pickSelectionOrFirstMatch(label);
-                event.preventDefault();
-                break;
-        }
-        this.markAsTouched();
-    }
-    onKeyup(event, label) {
-        switch (event.key) {
-            case 'PageDown':
-                this.focusOnNext(5);
-                event.preventDefault();
-                break;
-            case 'ArrowDown':
-                this.focusOnNext(1);
-                event.preventDefault();
-                break;
-            case 'PageUp':
-                this.focusOnPrevious(5);
-                event.preventDefault();
-                break;
-            case 'ArrowUp':
-                this.focusOnPrevious(1);
-                event.preventDefault();
-                break;
-            case 'Escape':
-                this.complete(null);
-                event.preventDefault();
-                break;
-            case 'Intro':
-            case 'Enter':
-                event.preventDefault();
-                break;
-            default:
-                this.showCompletionList(label);
-            // event.preventDefault();
-        }
-        this.markAsTouched();
-    }
-    focusOnNext(offset) {
-        const list = this.completionList || [];
-        const index = list.findIndex((it) => this.focusItem && it.key === this.focusItem.key);
-        const indexNext = -1 && list.length > index + offset ? index + offset : list.length - 1;
-        const next = list[indexNext];
-        this.focusItem = next;
-        this.ensureItemVisible(index);
-    }
-    focusOnPrevious(offset) {
-        const list = this.completionList || [];
-        const index = list.findIndex((it) => this.focusItem && it.key === this.focusItem.key);
-        const indexPrevious = index !== -1 && index > offset ? index - offset : 0;
-        const next = list[indexPrevious];
-        this.focusItem = next;
-        this.ensureItemVisible(index);
-    }
-    onLostFocus(label) {
-        this.lostFocusHandled = false;
-        this.t0 = performance.now();
-        // console.log('Init LostFocus');
-        setTimeout(() => {
-            // needs to postpone actions some milliseconds to verify if
-            // lost focus was followed by a list selection -> then cancel
-            // if not -> make side effect
-            if (!this.lostFocusHandled) {
-                // console.log(
-                //   'Lost focus 2',
-                //   this.lostFocusHandled,
-                //   'SIDE EFFECT',
-                //   performance.now() - this.t0,
-                //   'label:',
-                //   label
-                // );
-                if (label && this.label !== label) {
-                    this.pickSelectionOrFirstMatch(label);
-                }
-                else {
-                    this.lostFocusHandled = true;
-                }
-                this.toggleCompletion(false, label);
-            }
-            else {
-                // do nothing (list selection took place)
-                // console.log(
-                //   'onlost focus 2',
-                //   this.lostFocusHandled,
-                //   'nothing',
-                //   performance.now() - this.t0
-                // );
-            }
-        }, LOST_FOCUS_TIME_WINDOW_MS);
-    }
-    complete(item) {
-        if (!this.lostFocusHandled) {
-            this.lostFocusHandled = true; // prevent a previous lostFocus to trigger a side effect
-            const ellapsed = performance.now() - this.t0;
-            if (ellapsed > LOST_FOCUS_TIME_WINDOW_MS) {
-                console.warn('complete. lostfocus->click timeout of ', LOST_FOCUS_TIME_WINDOW_MS, 'ms exceed: ', performance.now() - this.t0, ' ms');
-            }
-            // console.log(
-            //   'complete. set to true. CANCELED side effect',
-            //   performance.now() - this.t0
-            // );
-        }
-        if (item !== null) {
-            this.value = item.key;
-            this.label = item.label;
-        }
-        else {
-            this.value = null;
-            this.label = '';
-        }
-        this.toggleCompletion(false, null);
-        this.markAsTouched();
-    }
-    toggleCompletion(show, label) {
-        if (show && !this.disabled) {
-            this.showCompletionList(label);
-        }
-        else {
-            this.showCompletion = false;
-            if (this.canAddNewValues) {
-                this.syncCustomValue(this.label);
-                return;
-            }
-        }
-        this.cd.markForCheck();
-    }
-    get selectedOption() {
-        const index = this.completionList.findIndex((i) => i.key === this.focusItem.key);
-        if (index === -1 || !this.focusItem) {
-            return null;
-        }
-        return `${this.inputId}_${index}`;
-    }
-    ensureItemVisible(index) {
-        const target = this.completeDiv.nativeElement.querySelectorAll('li')[index];
-        if (target) {
-            target.scrollIntoView({ block: 'center' });
-        }
-    }
-    syncCustomValue(text) {
-        this.value = text;
-        this.label = text;
-    }
-    /** Pick selection based on text filtering (ingnores drowdown state) */
-    pickSelectionOrFirstMatch(text) {
-        if (this.canAddNewValues) {
-            this.syncCustomValue(text);
-            return;
-        }
-        const focusIndex = this.completionList.findIndex((it) => this.focusItem && it.key === this.focusItem.key);
-        if (this.showCompletion &&
-            focusIndex > 0 &&
-            this.focusItem &&
-            this.focusItem.label) {
-            if (text === this.focusItem.label && this.focusItem.key === this.value) {
-                // do nothing if value does not change & close dropdow
-                this.showCompletion = false;
-                return;
-            }
-            // complete selected using selected item on drowdown
-            this.complete(this.focusItem);
-            return;
-        }
-        const source = (text || '').trim();
-        if (!source) {
-            this.showCompletion = false;
-            // select null value
-            if (this.value !== null) {
-                this.value = null;
-            }
-            return;
-        }
-        this.completionList = [];
-        this.computeCompletionList(source).subscribe((suggestions) => {
-            const candidate = suggestions && suggestions.length > 0 ? suggestions[0] : null;
-            this.complete(candidate);
-        });
-    }
-    showCompletionList(text) {
-        this.setSameWidth();
-        const useSpinner = this.hasExternalDataSource();
-        this.spinnerVisibility(useSpinner, true);
-        setTimeout(() => {
-            // for spinner to be shown
-            this.computeCompletionList(text).subscribe({
-                next: (cl) => {
-                    this.completionList = cl;
-                    this.focusItem = selectElement(this.completionList, text);
-                    this.showCompletion = true;
-                    this.spinnerVisibility(useSpinner, false);
-                },
-                error: () => {
-                    this.spinnerVisibility(useSpinner, false);
-                },
-                complete: () => {
-                    this.spinnerVisibility(useSpinner, false);
-                }
-            });
-        }, 1);
-    }
-    spinnerVisibility(useSpinner, value) {
-        if (useSpinner) {
-            this.showSpinner = value;
-        }
-    }
-    hasExternalDataSource() {
-        return !this.dataSource && !!this.instance && !!this.populateFunction;
-    }
-    computeCompletionList(text) {
-        const searchText = (text || '').toLowerCase();
-        if (this.dataSource) {
-            const ds = (this.dataSource || [])
-                .filter((it) => ignoreAccentsInclude(it.label, searchText))
-                .sort((a, b) => a.label.localeCompare(b.label));
-            return of(decorateDataSource(ds, searchText));
-        }
-        else if (this.instance && this.populateFunction) {
-            return this.populateFunction(this.instance, searchText).pipe(debounceTime(1), first(), map((ds) => {
-                const dsFiltered = ds
-                    .filter((it) => ignoreAccentsInclude(it.label, searchText))
-                    .sort((a, b) => a.label.localeCompare(b.label));
-                return decorateDataSource(dsFiltered, searchText);
-            }));
-        }
-        else {
-            return of([]);
-        }
-    }
-}
-AutocompleteComponent.idCounter = 0;
-AutocompleteComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'lux-autocomplete',
-                template: "<div class=\"lux-autocomplete\" (blur)=\"toggleCompletion(false, i0.value)\">\n  <div class=\"lux-autocomplete-box\">\n    <input\n      #i0\n      [id]=\"inputId\"\n      [(ngModel)]=\"label\"\n      [placeholder]=\"placeholder\"\n      [attr.disabled]=\"disabled || null\"\n      [attr.readonly]=\"readonly || null\"\n      (keydown)=\"onKeydown($event, i0.value)\"\n      (keypress)=\"onKeypress($event, i0.value)\"\n      (keyup)=\"onKeyup($event, i0.value)\"\n      (blur)=\"onLostFocus(i0.value)\"\n      (focus)=\"toggleCompletion(true, i0.value)\"\n      (click)=\"toggleCompletion(true, i0.value)\"\n      (resized)=\"onInputResized()\"\n      (window:resize)=\"onInputResized()\"\n      role=\"combobox\"\n      aria-autocomplete=\"list\"\n      [attr.aria-expanded]=\"showCompletion\"\n      aria-haspopup=\"true\"\n      attr.aria-owns=\"{{ inputId + '_list' }}\"\n      [attr.aria-activedescendant]=\"selectedOption\"\n    />\n    <div *ngIf=\"canAddNewValues\" class=\"icon-suggestions\"></div>\n    <div *ngIf=\"showSpinner; else noLoading\" class=\"icon-spinner\"></div>\n    <ng-template #noLoading>\n      <button\n        *ngIf=\"!disabled && i0.value && !showCompletion; else dropdown\"\n        type=\"button\"\n        class=\"icon-clear\"\n        aria-label=\"Clear\"\n        (click)=\"clear()\"\n      ></button>\n      <ng-template #dropdown>\n        <div\n          class=\"icon-dropdown\"\n          (click)=\"toggleCompletion(!showCompletion, i0.value)\"\n        ></div>\n      </ng-template>\n    </ng-template>\n  </div>\n  <div\n    #completeDiv\n    [class.showCompletion]=\"showCompletion\"\n    class=\"lux-completion-list\"\n    id=\"{{ inputId + '_list' }}\"\n  >\n    <ul>\n      <li\n        *ngFor=\"let item of completionList; let index = index\"\n        id=\"{{ inputId + '_' + index }}\"\n        class=\"lux-completion-item\"\n        [class.selected]=\"focusItem && item.key === focusItem.key\"\n        (click)=\"complete(item)\"\n        [attr.aria-label]=\"item.label\"\n      >\n        <span>{{ item.labelPrefix }}</span>\n        <span class=\"bold\">{{ item.labelMatch }}</span>\n        <span>{{ item.labelPostfix }}</span>\n      </li>\n    </ul>\n  </div>\n</div>\n",
-                providers: [
-                    {
-                        provide: NG_VALUE_ACCESSOR,
-                        multi: true,
-                        useExisting: forwardRef(() => AutocompleteComponent)
-                    },
-                    {
-                        provide: NG_VALIDATORS,
-                        multi: true,
-                        useExisting: forwardRef(() => AutocompleteComponent)
-                    }
-                ],
-                styles: [":focus{z-index:1}input,select,textarea{border:1px solid #495057;border:var(--lux-input-border, 1px solid) var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color:default;color:var(--lux-symbol-color, default);text-align:center;white-space:nowrap;background:default;background:var(--lux-symbol-background, default);font-size:1rem;font-size:var(--lux-symbol-font-size, 1rem)}.bordered,.symbol{border:1px solid #495057;border:var(--lux-input-border, 1px solid) var(--lux-input-border-color, #495057)}.rounded,.rounded-right,.rounded-middle,.rounded-left{border-radius:.25rem;border-radius:var(--lux-border-radius, .25rem)}.rounded-left{border-top-right-radius:0;border-bottom-right-radius:0}.rounded-middle{border-radius:0}.rounded-right{border-top-left-radius:0;border-bottom-left-radius:0}.prefix{border-right:none}.infix{border-left:none;border-right:none}.postfix{border-left:none;display:flex;align-items:center}.lux-autocomplete .lux-autocomplete-box{display:grid;grid-template-columns:1fr -webkit-max-content;grid-template-columns:1fr max-content}.lux-autocomplete input{padding:.1rem 1.5rem .1rem .5rem;padding:var(--lux-autocomplete-input-padding, .1rem 1.5rem .1rem .5rem);text-overflow:ellipsis;grid-row:1;grid-column-start:1;grid-column-end:3}.lux-autocomplete .icon-suggestions{grid-row:1;grid-column:2;width:1.5rem;border:none;background-color:transparent;background:url(/assets/img/suggestions.svg) no-repeat center;background-size:.5rem .5rem;z-index:1;position:relative;left:-1rem}.lux-autocomplete .icon-clear{grid-row:1;grid-column:2;width:1.5rem;width:var(--lux-autocomplete-icon-width, 1.5rem);border:none;background-color:transparent;background:url(/assets/img/filter-clear.png) no-repeat center;background:var(--lux-autocomplete-icon-clear, url(/assets/img/filter-clear.png) no-repeat center);background-size:.5rem .5rem;background-size:var(--lux-autocomplete-icon-bg-size, .5rem .5rem);z-index:1}.lux-autocomplete .icon-dropdown{grid-row:1;grid-column:2;width:1.5rem;width:var(--lux-autocomplete-icon-width, 1.5rem);height:1.3rem;height:var(--lux-autocomplete-icon-height, 1.3rem);border:none;background-color:transparent;background:url(/assets/img/drop-down-arrow.svg) no-repeat center;background:var(--lux-autocomplete-icon-dropdown, url(/assets/img/drop-down-arrow.svg) no-repeat center);background-size:.5rem .5rem;background-size:var(--lux-autocomplete-icon-bg-size, .5rem .5rem);z-index:1}.lux-autocomplete .icon-spinner{grid-row:1;grid-column:2;width:1.5rem;border:none;background-color:transparent;background:url(/assets/img/spinner.svg) no-repeat center;background-size:1.2rem 1.2rem;z-index:1}.lux-completion-list{visibility:collapse;position:absolute;border:1px solid #ccc;margin:0;padding:0;max-height:10rem;overflow:auto;z-index:2}.lux-completion-list ul{list-style:none;margin:0;padding:0}.showCompletion{visibility:visible}.lux-completion-item{background-color:#fff;color:#000;padding:.1rem .5rem;cursor:pointer}.selected{background-color:#2e2eac;color:#fff}.disabled{background-color:#f0f0f0;color:#444}.disabled .selected{background-color:#9898ec;color:#fff}.bold{font-weight:bold}\n"]
-            },] }
-];
-AutocompleteComponent.ctorParameters = () => [
-    { type: ChangeDetectorRef }
-];
-AutocompleteComponent.propDecorators = {
-    i0: [{ type: ViewChild, args: ['i0', { static: true },] }],
-    completeDiv: [{ type: ViewChild, args: ['completeDiv', { static: true },] }],
-    valueChange: [{ type: Output }],
-    dataSourceChange: [{ type: Output }],
-    inputId: [{ type: Input }],
-    disabled: [{ type: Input }],
-    readonly: [{ type: Input }],
-    label: [{ type: Input }],
-    canAddNewValues: [{ type: Input }],
-    keepOpenAfterDelete: [{ type: Input }],
-    value: [{ type: Input }],
-    dataSource: [{ type: Input }],
-    required: [{ type: Input }],
-    placeholder: [{ type: Input }],
-    resolveLabelsFunction: [{ type: Input }],
-    populateFunction: [{ type: Input }],
-    instance: [{ type: Input }]
-};
-/** Returns true if text includes substring. No accents considered. Ignorecase */
-const ignoreAccentsInclude = (text, substring) => {
-    text = normalizedString(text).toLowerCase();
-    substring = normalizedString(substring).toLowerCase();
-    return text.includes(substring);
-};
-const ɵ0$3 = ignoreAccentsInclude;
-/** Returns a normalized string with no accents: used for comparison */
-const normalizedString = (a) => (a || '').normalize('NFD').replace(/[\u0300-\u036f]/g, '');
-const ɵ1$2 = normalizedString;
-const decorateDataSource = (dataSource, subString) => dataSource.map((it) => decorateItem(it, subString));
-const ɵ2 = decorateDataSource;
-const decorateItem = (item, tx) => {
-    const index = normalizedString(item.label)
-        .toLowerCase()
-        .indexOf(normalizedString(tx).toLowerCase());
-    const labelPrefix = index === -1 ? item.label : item.label.substr(0, index);
-    const labelMatch = index === -1 ? '' : item.label.substr(index, tx.length);
-    const labelPostfix = index === -1 ? '' : item.label.substr(index + tx.length);
-    const newItem = Object.assign(Object.assign({}, item), { labelPrefix,
-        labelMatch,
-        labelPostfix });
-    return newItem;
-};
-const ɵ3 = decorateItem;
-const findLabelForId = (data, id) => {
-    const found = data.find((it) => it.key === id);
-    return found ? found.label : null;
-};
-const ɵ4 = findLabelForId;
-const selectElement = (completionList, label) => {
-    label = (label || '').toLowerCase();
-    if (!completionList || completionList.length === 0) {
-        return null;
-    }
-    if (completionList.length === 1) {
-        return completionList[0];
-    }
-    const found = completionList.find((it) => it.label.toLowerCase() === label);
-    return found || completionList[0];
-};
-
-/** Language detector based on Navigator preferences */
-const languageDetector = () => {
-    const lang = navigator.language.split('-')[0];
-    if (lang === 'es' || lang === 'en') {
-        return lang;
-    }
-    return 'en'; // default
-};
-
-class AutocompleteListComponent {
-    constructor() {
-        this.literals = {
-            en: {
-                placeholder: 'new item',
-                deleteLabelTemplate: 'Delete <<label>>',
-                addMessage: 'Add'
-            },
-            es: {
-                placeholder: 'nuevo elemento',
-                deleteLabelTemplate: 'Eliminar <<label>>',
-                addMessage: 'Añadir'
-            }
-        };
-        this.internalDataSource = [];
-        this.autoPopulate = false;
-        this._value = [];
-        this.labels = [];
-        this.canAdd = false;
-        this.touched = false;
-        this._lang = languageDetector();
-        this.dataSource = [];
-        this.disabled = false;
-        this.required = false;
-        this.resolveLabelsFunction = undefined;
-        this.populateFunction = undefined;
-        this.valueChange = new EventEmitter();
-        // ControlValueAccessor Interface
-        this.onChange = (value) => { };
-        this.onTouched = () => { };
-    }
-    set value(val) {
-        if (val === this._value) {
-            return;
-        }
-        const initialAndEmpty = isInitialAndEmpty(this._value, val);
-        this._value = val;
-        this.ensureLabelsForIds();
-        this.populateWith('');
-        this.onChange(this._value);
-        if (!initialAndEmpty) {
-            this.valueChange.emit(this._value);
-        }
-    }
-    get value() {
-        return this._value;
-    }
-    get lang() {
-        return this._lang;
-    }
-    set lang(l) {
-        if (l === this._lang) {
-            return;
-        }
-        if (Object.keys(this.literals).includes(l)) {
-            this._lang = l;
-        }
-        else {
-            this._lang = 'en';
-        }
-    }
-    writeValue(value) {
-        this.value = value;
-    }
-    registerOnChange(onChange) {
-        this.onChange = onChange;
-    }
-    registerOnTouched(onTouched) {
-        this.onTouched = onTouched;
-    }
-    markAsTouched() {
-        if (!this.touched && !this.disabled) {
-            this.onTouched();
-            this.touched = true;
-        }
-    }
-    setDisabledState(disabled) {
-        this.disabled = disabled;
-    }
-    // End ControlValueAccessor Interface
-    // Validator interface
-    registerOnValidatorChange() { }
-    validate(control) {
-        const value = control.value;
-        if (this.required &&
-            (value === '' || value === null || value === undefined)) {
-            return { required: { value, reason: 'Required field.' } };
-        }
-        return null;
-    }
-    // End of Validator interface
-    ngOnInit() {
-        this.inputId = this.inputId
-            ? this.inputId
-            : `autocompletelist${AutocompleteListComponent.idCounter++}`;
-        this.autoPopulate =
-            !!this.resolveLabelsFunction && !!this.populateFunction && this.instance;
-        this.ensureLabelsForIds();
-    }
-    ensureLabelsForIds() {
-        if (this.autoPopulate && this.resolveLabelsFunction) {
-            this.resolveLabelsFunction(this.instance, this._value)
-                .pipe(first())
-                .subscribe((data) => {
-                const res = [];
-                (this._value || []).map((id) => {
-                    const found = data.find((it) => it.key === id);
-                    if (found) {
-                        res.push(found.label);
-                    }
-                    else {
-                        res.push('(unset)');
-                    }
-                });
-                this.labels = res;
-            });
-        }
-        else if (this.dataSource) {
-            const res = [];
-            (this._value || []).map((id) => {
-                const found = this.dataSource.find((it) => it.key === id);
-                if (found) {
-                    res.push(found.label);
-                }
-                else {
-                    res.push('(unset)');
-                }
-            });
-            this.labels = res;
-        }
-        else {
-            this.labels = this._value.map((it) => (it ? it.toString() : '(unset)'));
-        }
-    }
-    removeAt(index) {
-        if (this._value.length > index) {
-            const key = this._value.splice(index, 1)[0];
-            const label = this.labels.splice(index, 1)[0];
-            this.internalDataSource.push({ key, label });
-        }
-        this.markAsTouched();
-    }
-    onValueChange() {
-        this.updateCanAdd();
-    }
-    onNewEntryChange(event, auto) {
-        if (event.key === 'Enter' && !!auto.value) {
-            this.addNew(auto);
-        }
-        else if (event.key === 'Delete' || event.key === 'Backspace') {
-            // todo
-        }
-        else {
-            this.populateWith(auto.label + event.key);
-        }
-        this.updateCanAdd();
-    }
-    populateWith(searchText) {
-        if (this.autoPopulate && this.populateFunction && this.instance) {
-            this.populateFunction(this.instance, searchText)
-                .pipe(first())
-                .subscribe((data) => {
-                this.internalDataSource = data.filter((it) => !(this._value || []).includes(it.key));
-            });
-        }
-        else if (this.dataSource) {
-            this.internalDataSource = this.dataSource.filter((it) => !(this._value || []).includes(it.key));
-        }
-    }
-    updateCanAdd() {
-        this.canAdd =
-            !this.disabled &&
-                this.auto &&
-                !!this.auto.value && // has value
-                !this.value.find((it) => it === this.auto.value); // not already in
-    }
-    addNew(auto) {
-        this.value.push(auto.value);
-        this.ensureLabelsForIds();
-        this.newEntry = '';
-        this.internalDataSource = this.internalDataSource.filter((it) => !this._value.includes(it.key));
-        this.markAsTouched();
-    }
-    getDeleteMessage(label) {
-        var _a;
-        return ((_a = this.deleteLabelTemplate) !== null && _a !== void 0 ? _a : this.literals[this.lang].deleteLabelTemplate).replace('<<label>>', label);
-    }
-}
-AutocompleteListComponent.idCounter = 0;
-AutocompleteListComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'lux-autocomplete-list',
-                template: "<div [id]=\"inputId\">\n  <ul>\n    <li *ngFor=\"let label of labels; let index = index\">\n      <span>{{ label }}</span>\n      <button\n        *ngIf=\"!disabled\"\n        class=\"remove-item\"\n        (click)=\"removeAt(index)\"\n        attr.aria-label=\"{{ getDeleteMessage(label) }}\"\n      ></button>\n    </li>\n  </ul>\n  <div *ngIf=\"!disabled\" class=\"new-entry\">\n    <lux-autocomplete\n      #auto\n      [dataSource]=\"internalDataSource\"\n      [placeholder]=\"placeholder ?? literals[lang].placeholder\"\n      [(value)]=\"newEntry\"\n      (valueChange)=\"onValueChange()\"\n      (keypress)=\"onNewEntryChange($event, auto)\"\n    >\n    </lux-autocomplete>\n    <button\n      *ngIf=\"canAdd\"\n      type=\"button\"\n      class=\"add-item\"\n      attr.aria-label=\"addMessage ?? literals[lang].addMessage\"\n      (click)=\"addNew(auto)\"\n    ></button>\n  </div>\n</div>\n",
-                providers: [
-                    {
-                        provide: NG_VALUE_ACCESSOR,
-                        multi: true,
-                        useExisting: forwardRef(() => AutocompleteListComponent)
-                    },
-                    {
-                        provide: NG_VALIDATORS,
-                        multi: true,
-                        useExisting: forwardRef(() => AutocompleteListComponent)
-                    }
-                ],
-                styles: [".new-entry{margin-left:1.5rem;display:grid;grid-template-columns:-webkit-max-content -webkit-max-content;grid-template-columns:max-content max-content}.new-entry lux-autocomplete{grid-column:1;grid-row:1}.new-entry .add-item{grid-column:2;grid-row:1;border:none;background:url(/assets/img/create.png) no-repeat .2rem .2rem;background:var(--lux-autocomplete-list-add-icon, url(/assets/img/create.png) no-repeat .2rem .2rem);background-size:1.1rem;background-size:var(--lux-autocomplete-list-add-icon-size, 1.1rem);height:1.4rem;height:var(--lux-autocomplete-list-add-icon-height, 1.4rem);width:1.4rem;width:var(--lux-autocomplete-list-add-icon-width, 1.4rem)}.remove-item{margin-left:.5rem;border:none;background:url(/assets/img/delete.svg) no-repeat .2rem .1rem;background:var(--lux-autocomplete-list-remove-icon, url(/assets/img/delete.svg) no-repeat .2rem .1rem);height:1.2rem;height:var(--lux-autocomplete-list-remove-icon-height, 1.2rem);width:1.3rem;width:var(--lux-autocomplete-list-remove-icon-width, 1.3rem);position:relative;top:.2rem;top:var(--lux-autocomplete-list-remove-icon-top, .2rem);background-size:1rem 1rem;background-size:var(--lux-autocomplete-list-remove-icon-size, 1rem 1rem)}\n"]
-            },] }
-];
-AutocompleteListComponent.propDecorators = {
-    auto: [{ type: ViewChild, args: ['auto',] }],
-    value: [{ type: Input }],
-    lang: [{ type: Input }],
-    inputId: [{ type: Input }],
-    dataSource: [{ type: Input }],
-    placeholder: [{ type: Input }],
-    disabled: [{ type: Input }],
-    deleteLabelTemplate: [{ type: Input }],
-    addMessage: [{ type: Input }],
-    required: [{ type: Input }],
-    resolveLabelsFunction: [{ type: Input }],
-    populateFunction: [{ type: Input }],
-    instance: [{ type: Input }],
-    valueChange: [{ type: Output }]
-};
-
-const KEY_SPACE = ' ';
-class CheckboxComponent {
-    constructor() {
-        this._lang = languageDetector();
-        this.label = null;
-        this.name = null;
-        this._disabled = false;
-        this.literals = {
-            en: {
-                yesLabel: 'Yes',
-                noLabel: 'No'
-            },
-            es: {
-                yesLabel: 'Sí',
-                noLabel: 'No'
-            }
-        };
-        this.touched = false;
-        this.valueChange = new EventEmitter();
-        // ControlValueAccessor Interface
-        this.onChange = (value) => { };
-        this.onTouched = () => { };
-    }
-    set lang(l) {
-        if (l === this._lang) {
-            return;
-        }
-        if (Object.keys(this.literals).includes(l)) {
-            this._lang = l;
-        }
-        else {
-            this._lang = 'en';
-        }
-    }
-    get lang() {
-        return this._lang;
-    }
-    get value() {
-        return this.internalValue;
-    }
-    set value(v) {
-        if (this.internalValue === v) {
-            return;
-        }
-        const initialAndEmpty = isInitialAndEmpty(this.internalValue, v);
-        this.internalValue = v;
-        this.syncModel();
-        this.onChange(v);
-        if (!initialAndEmpty) {
-            this.valueChange.emit(v);
-        }
-    }
-    get tabindexValue() {
-        return this.disabled ? null : '0';
-    }
-    get disabled() {
-        return this._disabled;
-    }
-    set disabled(v) {
-        if (v === this._disabled) {
-            return;
-        }
-        this._disabled = v;
-        this.syncModel();
-    }
-    writeValue(value) {
-        this.value = !!value;
-    }
-    registerOnChange(onChange) {
-        this.onChange = onChange;
-    }
-    registerOnTouched(onTouched) {
-        this.onTouched = onTouched;
-    }
-    markAsTouched() {
-        if (!this.touched) {
-            this.onTouched();
-            this.touched = true;
-        }
-    }
-    setDisabledState(disabled) {
-        this.disabled = disabled;
-    }
-    // End ControlValueAccessor Interface
-    ngOnInit() {
-        this.inputId = this.inputId
-            ? this.inputId
-            : `${this.name || 'checkbox'}$${CheckboxComponent.idCounter++}`;
-    }
-    ngAfterViewInit() {
-        this.syncModel();
-    }
-    clicked() {
-        if (!this.disabled) {
-            this.value = !this.internalValue;
-            this.markAsTouched();
-        }
-    }
-    onKey(event) {
-        if (event.key === KEY_SPACE && !this.disabled) {
-            this.value = !this.internalValue;
-            this.markAsTouched();
-            event.preventDefault();
-        }
-    }
-    syncModel() {
-        if (this.ck) {
-            this.ck.nativeElement.checked = this.internalValue;
-        }
-    }
-}
-CheckboxComponent.idCounter = 0;
-CheckboxComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'lux-checkbox',
-                template: "<div class=\"switch\">\n  <div>\n    <label *ngIf=\"label\" [for]=\"inputId\">{{ label }}</label>\n  </div>\n  <div *ngIf=\"!disabled\" class=\"switch-item\" (click)=\"clicked()\">\n    <input #ck [name]=\"name\" type=\"checkbox\" [id]=\"inputId\" />\n    <div\n      class=\"slider round\"\n      [class.on]=\"value\"\n      [class.disabled]=\"disabled\"\n      [tabindex]=\"tabindexValue\"\n      (keyup)=\"onKey($event)\"\n    ></div>\n  </div>\n  <div>\n    <span class=\"checkbox-label\" *ngIf=\"value\">{{\n      literals[lang].yesLabel\n    }}</span>\n    <span class=\"checkbox-label\" *ngIf=\"!value\">{{\n      literals[lang].noLabel\n    }}</span>\n  </div>\n</div>\n",
-                providers: [
-                    {
-                        provide: NG_VALUE_ACCESSOR,
-                        multi: true,
-                        useExisting: forwardRef(() => CheckboxComponent)
-                    }
-                ],
-                styles: [".switch{display:flex;flex-flow:row wrap;align-items:center}label{padding-right:1.1rem}.switch-item{padding-right:.5em}.slider.round{border-radius:.7rem;width:3.1rem;height:1.4rem}.slider.round:before{border-radius:50%}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;position:relative;top:-.7rem;background-color:#ccc;transition:.4s}.slider.on{background-color:#2196f3}.slider:before{position:absolute;content:\"\";height:1rem;width:1rem;left:.2rem;bottom:.2rem;background-color:#fff;transition:.4s}.slider.on:before{transform:translate(26px)}input:focus+.slider{box-shadow:0 0 1px #2196f3}\n"]
-            },] }
-];
-CheckboxComponent.ctorParameters = () => [];
-CheckboxComponent.propDecorators = {
-    ck: [{ type: ViewChild, args: ['ck', { static: false },] }],
-    lang: [{ type: Input }],
-    value: [{ type: Input }],
-    label: [{ type: Input }],
-    name: [{ type: Input }],
-    disabled: [{ type: Input }],
-    inputId: [{ type: Input }],
-    valueChange: [{ type: Output }]
-};
-
-class DatetimeComponent {
-    constructor() {
-        this.touched = false;
-        this.dirty = false;
-        this.lastErrors = null;
-        this.dateValue = undefined;
-        this.timeValue = undefined;
-        this.userErrors = {
-            en: {
-                required: 'Required field.',
-                min: 'Minimum value is $min.',
-                max: 'Maximum value is $max.'
-            },
-            es: {
-                required: 'El campo es obligatorio.',
-                min: 'El valor mínimo es $min.',
-                max: 'El valor máximo es $max.'
-            }
-        };
-        this.min = '1900-01-01T00:00:00Z';
-        this.max = '2100-01-01T00:00:00Z';
-        this.includeSeconds = true;
-        this.localTime = true;
-        this.lang = languageDetector();
-        this.inlineErrors = false;
-        this.readonly = null;
-        this.valueChange = new EventEmitter();
-        this.keyPress = new EventEmitter();
-        this.onChange = (_value) => { };
-        this.onTouched = () => { };
-    }
-    get className() {
-        return this.checkClassName();
-    }
-    set disabled(v) {
-        v = typeof v === 'string' && v !== 'false' ? true : v;
-        this._disabled = v;
-    }
-    get disabled() {
-        return this._disabled;
-    }
-    set required(v) {
-        this._required = v;
-    }
-    get required() {
-        return this._required;
-    }
-    set value(v) {
-        if (v === this._value) {
-            return; // prevent events when there is no changes
-        }
-        const initialAndEmpty = isInitialAndEmpty(this._value, v);
-        const datetime = new Date(v);
-        if (!v) {
-            this._value = null;
-            this.setDateInControl(null);
-            this.setTimeInControl(null);
-        }
-        else if (!isValidDate(datetime)) {
-            this._value = v;
-            // we don't set value in control if the value is not valid
-            // if we do, the content of the control changes and can erase what the user is typing
-        }
-        else {
-            this._value = datetime.toISOString(); // YYYY-MM-DDThh:mm:ss.SSSZ
-            this.setValueInControl(datetime);
-        }
-        this.onChange(v);
-        if (!initialAndEmpty) {
-            this.valueChange.emit(v);
-        }
-    }
-    get value() {
-        return this._value;
-    }
-    // ControlValueAccessor Interface implementation
-    writeValue(value) {
-        this.value = value;
-    }
-    registerOnChange(onChange) {
-        this.onChange = onChange;
-    }
-    registerOnTouched(onTouched) {
-        this.onTouched = onTouched;
-    }
-    markAsTouched() {
-        if (!this.touched) {
-            this.onTouched();
-            this.touched = true;
-        }
-    }
-    setDisabledState(disabled) {
-        this.disabled = disabled;
-    }
-    // End of ControlValueAccessor Interface implementation
-    setDateInControl(date) {
-        // this.dateInput.nativeElement.value = date;
-        this.dateValue = date;
-    }
-    setTimeInControl(time) {
-        // this.timeInput.nativeElement.value = time;
-        this.timeValue = time;
-    }
-    setValueInControl(datetime) {
-        const offsetDatetime = this.localTime
-            ? addTimezoneOffset(datetime)
-            : datetime;
-        const offsetDatetimeString = offsetDatetime.toISOString(); // YYYY-MM-DDThh:mm:ss.SSSZ
-        this.setDateInControl(offsetDatetimeString.slice(0, 10)); // YYYY-MM-DD
-        if (this.includeSeconds) {
-            this.setTimeInControl(offsetDatetimeString.slice(11, 19)); // hh:mm:ss
-        }
-        else {
-            this.setTimeInControl(offsetDatetimeString.slice(11, 16)); // hh:mm
-        }
-    }
-    clear() {
-        this.setDateInControl(null);
-        this.setTimeInControl(null);
-        this.value = null;
-    }
-    // Validator interface
-    registerOnValidatorChange() { }
-    validate(control) {
-        const value = control.value;
-        let result = null;
-        if (this.required &&
-            !hasValue(value) &&
-            !hasValue(this.dateValue) &&
-            !hasValue(this.timeValue)) {
-            result = result || {};
-            result.required = { value, reason: 'Required field.' };
-        }
-        if (!hasValue(this.dateValue) && hasValue(this.timeValue)) {
-            result = result || {};
-            result.existsDate = {
-                value,
-                reason: 'Date not specified.'
-            };
-        }
-        if (hasValue(this.dateValue) && !hasValue(this.timeValue)) {
-            result = result || {};
-            result.existsTime = {
-                value,
-                reason: 'Time not specified.'
-            };
-        }
-        if (hasValue(this.min) &&
-            hasValue(value) &&
-            hasValue(this.dateValue) &&
-            hasValue(this.timeValue) &&
-            String(value).localeCompare(this.min) === -1) {
-            result = result || {};
-            result.min = {
-                value,
-                min: this.min,
-                reason: `Value is lower than minimum value: ${this.min}.`
-            };
-        }
-        if (hasValue(this.max) &&
-            hasValue(value) &&
-            hasValue(this.dateValue) &&
-            hasValue(this.timeValue) &&
-            String(value).localeCompare(this.max) !== -1) {
-            result = result || {};
-            result.max = {
-                value,
-                max: this.max,
-                reason: `Value is greater than than maximum value: ${this.max}.`
-            };
-        }
-        this.lastErrors = result;
-        return result;
-    }
-    // End of Validator interface
-    ngOnInit() {
-        this.inputId = this.inputId
-            ? this.inputId
-            : `datetime$${DatetimeComponent.idCounter++}`;
-        this.setPatterns();
-    }
-    onLostFocus() {
-        this.markAsTouched();
-    }
-    onKeyPress(event) {
-        this.keyPress.emit(event);
-    }
-    onEventDatetime(newDate, newTime) {
-        if (this.disabled || this.readonly) {
-            return;
-        }
-        const newValue = '' + newDate + ' ' + newTime;
-        if (!newValue) {
-            this.value = null;
-        }
-        else {
-            const datetime = new Date(newValue);
-            if (isValidDate(datetime)) {
-                let datetimeString;
-                if (this.localTime) {
-                    datetimeString = datetime.toISOString(); // YYYY-MM-DDThh:mm:ss.SSSZ
-                }
-                else {
-                    datetimeString = addTimezoneOffset(datetime).toISOString(); // YYYY-MM-DDThh:mm:ss.SSSZ
-                }
-                if (this.includeSeconds) {
-                    this.value = datetimeString.slice(0, 19) + 'Z'; // YYYY-MM-DDThh:mm:ssZ
-                }
-                else {
-                    this.value = datetimeString.slice(0, 16) + 'Z'; // YYYY-MM-DDThh:mmZ
-                }
-            }
-            else {
-                this.value = newValue;
-            }
-        }
-    }
-    checkClassName() {
-        return this.disabled
-            ? this.readonly
-                ? 'disabled readonly'
-                : 'disabled'
-            : this.readonly
-                ? 'readonly'
-                : '';
-    }
-    setPatterns() {
-        this.min = this.min || '1900-01-01';
-        this.max = this.max || '2100-01-01';
-    }
-}
-DatetimeComponent.idCounter = 0;
-DatetimeComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'lux-datetime',
-                template: "<input\n  #dateInput\n  class=\"rounded-left prefix\"\n  [ngClass]=\"className\"\n  type=\"date\"\n  [id]=\"inputId + '$date'\"\n  [(ngModel)]=\"dateValue\"\n  [attr.aria-label]=\"ariaLabel\"\n  [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n  [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n  [placeholder]=\"\"\n  (keyup)=\"onEventDatetime(dateInput.value, timeInput.value)\"\n  (change)=\"onEventDatetime(dateInput.value, timeInput.value)\"\n  (keypress)=\"onKeyPress($event)\"\n  (blur)=\"onLostFocus()\"\n/>\n<input\n  #timeInput\n  [class]=\"(disabled || readonly) && localTime ? 'rounded-right' : ''\"\n  [ngClass]=\"className\"\n  type=\"time\"\n  [id]=\"inputId + '$time'\"\n  [(ngModel)]=\"timeValue\"\n  [attr.aria-label]=\"ariaLabel\"\n  [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n  [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n  [placeholder]=\"\"\n  [step]=\"includeSeconds ? 1 : 60\"\n  (keyup)=\"onEventDatetime(dateInput.value, timeInput.value)\"\n  (change)=\"onEventDatetime(dateInput.value, timeInput.value)\"\n  (keypress)=\"onKeyPress($event)\"\n  (blur)=\"onLostFocus()\"\n/>\n<ng-container\n  *ngIf=\"!localTime\"\n>\n  <div\n    [class]=\"disabled || readonly ? 'rounded-right postfix symbol' : 'postfix symbol'\"\n    [ngClass]=\"className\"\n  >\n    <span>{{ localTime ? '' : 'UTC' }}</span>\n  </div>\n</ng-container>\n<button\n  #clearButton\n  *ngIf=\"!(disabled || readonly)\"\n  type=\"button\"\n  class=\"rounded-right postfix bordered icon-clear\"\n  [id]=\"inputId + '$clear'\"\n  (click)=\"clear()\"\n  aria-label=\"clear\"\n></button>\n\n<div *ngIf=\"inlineErrors && lastErrors && (dirty || touched)\" class=\"alert\">\n  <div *ngIf=\"lastErrors.required\">\n    {{ userErrors[lang].required }}\n  </div>\n  <div *ngIf=\"lastErrors.min\">\n    {{ userErrors[lang].min.replace('$min', lastErrors.min.min) }}\n  </div>\n  <div *ngIf=\"lastErrors.max\">\n    {{ userErrors[lang].max.replace('$max', lastErrors.max.max) }}\n  </div>\n</div>\n",
-                providers: [
-                    {
-                        provide: NG_VALUE_ACCESSOR,
-                        multi: true,
-                        useExisting: forwardRef(() => DatetimeComponent)
-                    },
-                    {
-                        provide: NG_VALIDATORS,
-                        multi: true,
-                        useExisting: forwardRef(() => DatetimeComponent)
-                    }
-                ],
-                styles: [":focus{z-index:1}input,select,textarea{border:1px solid #495057;border:var(--lux-input-border, 1px solid) var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color:default;color:var(--lux-symbol-color, default);text-align:center;white-space:nowrap;background:default;background:var(--lux-symbol-background, default);font-size:1rem;font-size:var(--lux-symbol-font-size, 1rem)}.bordered,.symbol{border:1px solid #495057;border:var(--lux-input-border, 1px solid) var(--lux-input-border-color, #495057)}.rounded,.rounded-right,.rounded-middle,.rounded-left{border-radius:.25rem;border-radius:var(--lux-border-radius, .25rem)}.rounded-left{border-top-right-radius:0;border-bottom-right-radius:0}.rounded-middle{border-radius:0}.rounded-right{border-top-left-radius:0;border-bottom-left-radius:0}.prefix{border-right:none}.infix{border-left:none;border-right:none}.postfix{border-left:none;display:flex;align-items:center}:host{display:flex;align-items:stretch}.readonly{border:none}.readonly:focus{border:none;outline:none}.disabled{background-color:#f1f1f1;background-color:var(--lux-disabled-color, #f1f1f1);border-color:#6d6d6d;border-color:var(--lux-disabled-border-color, #6d6d6d)}.icon-clear{grid-row:1;grid-column:2;width:1.5rem;width:var(--lux-autocomplete-icon-width, 1.5rem);background:url(/assets/img/filter-clear.png) no-repeat center;background:var(--lux-autocomplete-icon-clear, url(/assets/img/filter-clear.png) no-repeat center);background-size:.5rem .5rem;background-size:var(--lux-autocomplete-icon-bg-size, .5rem .5rem);z-index:1}\n"]
-            },] }
-];
-DatetimeComponent.ctorParameters = () => [];
-DatetimeComponent.propDecorators = {
-    dateInput: [{ type: ViewChild, args: ['dateInput', { static: true },] }],
-    timeInput: [{ type: ViewChild, args: ['timeInput', { static: true },] }],
-    min: [{ type: Input }],
-    max: [{ type: Input }],
-    includeSeconds: [{ type: Input }],
-    localTime: [{ type: Input }],
-    lang: [{ type: Input }],
-    inlineErrors: [{ type: Input }],
-    inputId: [{ type: Input }],
-    ariaLabel: [{ type: Input, args: ['aria-label',] }],
-    readonly: [{ type: Input }],
-    disabled: [{ type: Input }],
-    required: [{ type: Input }],
-    value: [{ type: Input }],
-    valueChange: [{ type: Output }],
-    keyPress: [{ type: Output }]
-};
-
-/**
- * A service that holds the functionality for advanced handling of regular expressions
- */
-class RegexpService {
-    constructor() { }
-    removeOuterRoundBrackets(regularExpressionString) {
-        while (regularExpressionString[0] === '(' &&
-            regularExpressionString[regularExpressionString.length - 1] === ')') {
-            regularExpressionString = regularExpressionString.slice(1, regularExpressionString.length - 1);
-        }
-        return regularExpressionString;
-    }
-    isQuantifier(quantifier) {
-        switch (quantifier) {
-            case '{':
-            case '?':
-            case '+':
-            case '*':
-                return true;
-        }
-        return false;
-    }
-    parseMinimalAmountOfQuantifier(quantifier) {
-        switch (quantifier[0]) {
-            case '?':
-            case '*':
-                return 0;
-            case '+':
-                return 1;
-            case '{':
-                for (let index = 1; index < quantifier.length; ++index) {
-                    if (quantifier[index] < '0' || quantifier[index] > '9') {
-                        return Number(quantifier.slice(1, index));
-                    }
-                }
-        }
-        return 0;
-    }
-    sliceRegexByOr(regularExpressionString) {
-        const result = [];
-        let slicedRegex = '';
-        let lastSliceIndex = 0;
-        let roundBracketCount = 0;
-        let squareBracketCount = 0;
-        let curlyBracketCount = 0;
-        let index = 0;
-        for (; index < regularExpressionString.length; ++index) {
-            switch (regularExpressionString[index]) {
-                case '\\':
-                    // escape sequence; skip the next character
-                    ++index;
-                    break;
-                case '(':
-                    roundBracketCount += 1;
-                    break;
-                case ')':
-                    roundBracketCount -= 1;
-                    break;
-                case '[':
-                    squareBracketCount += 1;
-                    break;
-                case ']':
-                    squareBracketCount -= 1;
-                    break;
-                case '{':
-                    curlyBracketCount += 1;
-                    break;
-                case '}':
-                    curlyBracketCount -= 1;
-                    break;
-                case '|':
-                    if (roundBracketCount === 0 &&
-                        squareBracketCount === 0 &&
-                        curlyBracketCount === 0) {
-                        slicedRegex = this.removeOuterRoundBrackets(regularExpressionString.slice(lastSliceIndex, index));
-                        result.push(slicedRegex);
-                        lastSliceIndex = index + 1;
-                    }
-                    break;
-            }
-        }
-        slicedRegex = this.removeOuterRoundBrackets(regularExpressionString.slice(lastSliceIndex, index));
-        result.push(slicedRegex);
-        return result;
-    }
-    sliceRegexByThen(regularExpressionString) {
-        // the actual result
-        const resultStart = [];
-        // the remainder of the regex in each case
-        const resultRemainder = [];
-        let roundBracketCount = 0;
-        let squareBracketCount = 0;
-        let curlyBracketCount = 0;
-        for (let index = 0; index < regularExpressionString.length; ++index) {
-            switch (regularExpressionString[index]) {
-                case '\\':
-                    // escape sequence; skip the next character
-                    ++index;
-                    break;
-                case '(':
-                    roundBracketCount += 1;
-                    break;
-                case ')':
-                    roundBracketCount -= 1;
-                    break;
-                case '[':
-                    squareBracketCount += 1;
-                    break;
-                case ']':
-                    squareBracketCount -= 1;
-                    break;
-                case '{':
-                    curlyBracketCount += 1;
-                    break;
-                case '}':
-                    curlyBracketCount -= 1;
-                    break;
-            }
-            if (roundBracketCount === 0 &&
-                squareBracketCount === 0 &&
-                curlyBracketCount === 0) {
-                if (!this.isQuantifier(regularExpressionString[index + 1])) {
-                    resultStart.push(regularExpressionString.slice(0, index + 1));
-                    resultRemainder.push(regularExpressionString.slice(index + 1));
-                }
-                else {
-                    // let minimalAmountOfRepeats = parseMinimalAmountOfQuantifier(regularExpressionString.slice(index + 1));
-                    // TODO
-                }
-            }
-        }
-        return [resultStart, resultRemainder];
-    }
-    suggestion(beginning, regularExpressionString) {
-        if (new RegExp(regularExpressionString).test(beginning)) {
-            // TODO: RETURN AN EMPTY STRING
-            return 'YA ES IGUAL, NO HAY MÁS QUE SUGERIR';
-        }
-        const regexOptions = this.sliceRegexByOr(regularExpressionString);
-        if (regexOptions.length > 1) {
-            for (let regexOptionIndex = 0; regexOptionIndex < regexOptions.length; ++regexOptionIndex) {
-                const regexParts = this.sliceRegexByThen(regexOptions[regexOptionIndex]);
-                const regexPartsStarts = regexParts[0];
-                const regexPartsRemainders = regexParts[1];
-                // for each option, test if the first part of the regex matches
-                // if it doesn't, continue
-                // if it does, keep checking until what part it matches
-                if (!new RegExp(regexPartsStarts[0]).test(beginning)) {
-                    // if there are no more options
-                    if (regexOptionIndex === regexOptions.length - 1) {
-                        // we return the first option, but we could return any option
-                        // TODO: RETURN ANY TEXT THAT MATCHES regexOptions[0]
-                        return regexOptions[0];
-                    }
-                }
-                else {
-                    for (let regexPartIndex = 1; regexPartIndex < regexPartsStarts.length; ++regexPartIndex) {
-                        if (!new RegExp(regexPartsStarts[regexPartIndex]).test(beginning)) {
-                            // TODO: RETURN ANY TEXT THAT MATCHES regexPartsRemainders[regexPartIndex - 1]
-                            return regexPartsRemainders[regexPartIndex - 1];
-                        }
-                    }
-                }
-            }
-        }
-        else if (regexOptions.length === 1) {
-            const regexParts = this.sliceRegexByThen(regexOptions[0]);
-            const regexPartsStarts = regexParts[0];
-            const regexPartsRemainders = regexParts[1];
-            if (!new RegExp(regexPartsStarts[0]).test(beginning)) {
-                // TODO: RETURN ANY TEXT THAT MATCHES regularExpressionString
-                return regularExpressionString;
-            }
-            else {
-                for (let regexPartIndex = 1; regexPartIndex < regexPartsStarts.length; ++regexPartIndex) {
-                    if (!new RegExp(regexPartsStarts[regexPartIndex]).test(beginning)) {
-                        // TODO: RETURN ANY TEXT THAT MATCHES regexPartsRemainders[regexPartIndex - 1]
-                        return regexPartsRemainders[regexPartIndex - 1];
-                    }
-                }
-            }
-        }
-        // TODO: RETURN AN EMPTY STRING
-        return 'NO DEBERÍA SER POSIBLE';
-    }
-}
-RegexpService.ɵprov = i0.ɵɵdefineInjectable({ factory: function RegexpService_Factory() { return new RegexpService(); }, token: RegexpService, providedIn: "root" });
-RegexpService.decorators = [
-    { type: Injectable, args: [{ providedIn: 'root' },] }
-];
-RegexpService.ctorParameters = () => [];
-
-class InputComponent {
-    constructor(regexpService) {
-        this.regexpService = regexpService;
-        this.touched = false;
-        this.dirty = false;
-        this.lastErrors = null;
-        this._value = '';
-        this._pattern = undefined;
-        this._regexp = undefined;
-        this.userErrors = {
-            en: {
-                required: 'Required field.',
-                min: 'Minimum value is $min.',
-                max: 'Maximum value is $max.',
-                email: 'Format should match example@example.com.',
-                url: 'Format should match https://example.com.',
-                color: 'Format should match #XXXXXX.'
-            },
-            es: {
-                required: 'El campo es obligatorio.',
-                min: 'El valor mínimo es $min.',
-                max: 'El valor máximo es $max.',
-                email: 'El campo debe tener un formato como ejemplo@ejemplo.com.',
-                url: 'El campo debe tener un formato como https://ejemplo.com.',
-                color: 'El campo debe tener un formato como #XXXXXX.'
-            }
-        };
-        this.lang = languageDetector();
-        this.inlineErrors = false;
-        this.readonly = null;
-        this.valueChange = new EventEmitter();
-        this.keyPress = new EventEmitter();
-        this.onChange = (value) => { };
-        this.onTouched = () => { };
-    }
-    get className() {
-        return this.checkClassName();
-    }
-    get color() {
-        return this.checkColor();
-    }
-    set disabled(v) {
-        v = typeof v === 'string' ? true : v;
-        this._disabled = v;
-    }
-    get disabled() {
-        return this._disabled;
-    }
-    set pattern(p) {
-        this._pattern = p;
-        if (p === undefined) {
-            this._regexp = undefined;
-        }
-        else {
-            try {
-                this._regexp = new RegExp(p);
-            }
-            catch (e) {
-                this._pattern = undefined;
-                this._regexp = undefined;
-            }
-        }
-    }
-    get pattern() {
-        return this._pattern;
-    }
-    set currency(v) {
-        this._currency = v.toUpperCase();
-    }
-    get currency() {
-        return this._currency;
-    }
-    set placeholder(v) {
-        this._placeholder = v;
-    }
-    get placeholder() {
-        return this._placeholder ? this._placeholder : '';
-    }
-    set required(v) {
-        this._required = v;
-    }
-    get required() {
-        return this._required;
-    }
-    set type(v) {
-        this._type = v.toLowerCase();
-        this.domain = v.toLowerCase();
-        this.checkType(v);
-    }
-    get type() {
-        return this._type ? this._type : 'text';
-    }
-    set value(v) {
-        v = v === undefined ? null : v;
-        if (v === this._value) {
-            return; // prevent events when there is no changes
-        }
-        const initialAndEmpty = isInitialAndEmpty(this._value, v);
-        if (this.type === 'date') {
-            v = normalizeDate(v);
-        }
-        this._value = v;
-        this.onChange(v);
-        if (!initialAndEmpty) {
-            this.valueChange.emit(v);
-        }
-    }
-    get value() {
-        if (this.isPercentage() || this.isPermillage() || this.isNumber()) {
-            const numVal = parseFloat(this._value);
-            if (!Number.isNaN(numVal)) {
-                return numVal;
-            }
-        }
-        return this._value;
-    }
-    // ControlValueAccessor Interface implementation
-    writeValue(value) {
-        this.value = value;
-        this.setValueInControl(value);
-    }
-    registerOnChange(onChange) {
-        this.onChange = onChange;
-    }
-    registerOnTouched(onTouched) {
-        this.onTouched = onTouched;
-    }
-    markAsTouched() {
-        if (!this.touched) {
-            this.onTouched();
-            this.touched = true;
-        }
-    }
-    setDisabledState(disabled) {
-        this.disabled = disabled;
-    }
-    // End of ControlValueAccessor Interface implementation
-    setValueInControl(v) {
-        if (this.domain === 'date') {
-            v = normalizeDate(v);
-        }
-        if (this.input) {
-            this.input.nativeElement.value = v;
-        }
-        if (this.textarea) {
-            this.textarea.nativeElement.value = v;
-        }
-    }
-    // Validator interface
-    registerOnValidatorChange() { }
-    validate(control) {
-        const value = control.value;
-        let result = null;
-        if (this.required && !hasValue(value)) {
-            result = result || {};
-            result.required = { value, reason: 'Required field.' };
-        }
-        if (this._regexp && hasValue(value) && !this._regexp.test(value)) {
-            result = result || {};
-            result.pattern = {
-                value,
-                reason: `Value must follow the pattern: ${this._pattern}`
-            };
-        }
-        if (this.type === 'email' && hasValue(value) && !isValidEmail(value)) {
-            result = result || {};
-            result.email = { value, reason: 'Invalid email.' };
-        }
-        if (this.type === 'url' && hasValue(value) && !isValidUrl(value)) {
-            result = result || {};
-            result.url = { value, reason: 'Invalid URL.' };
-        }
-        if (this.type === 'color' && hasValue(value) && !isValidColor(value)) {
-            result = result || {};
-            result.color = { value, reason: 'Invalid color.' };
-        }
-        if (this.type === 'number' && hasValue(value) && !isValidNumber(value)) {
-            result = result || {};
-            result.numeric = { value, reason: 'Invalid number.' };
-        }
-        if (this.type === 'date' ||
-            this.type === 'time' ||
-            this.type === 'timestamp') {
-            if (typeof this.min === 'string' &&
-                hasValue(value) &&
-                String(value).localeCompare(this.min) === -1) {
-                result = result || {};
-                result.min = {
-                    value,
-                    min: this.min,
-                    reason: `Value is lower than minimum value: ${this.min}.`
-                };
-            }
-            if (typeof this.max === 'string' &&
-                hasValue(value) &&
-                String(value).localeCompare(this.max) !== -1) {
-                result = result || {};
-                result.max = {
-                    value,
-                    max: this.max,
-                    reason: `Value is greater than than maximum value: ${this.max}.`
-                };
-            }
-        }
-        if (this.type === 'percentage' ||
-            this.type === 'permillage' ||
-            this.type === 'number' ||
-            this.type === 'currency') {
-            if (hasValue(this.min) && hasValue(value) && value < +this.min) {
-                result = result || {};
-                result.min = {
-                    value,
-                    min: this.min,
-                    reason: `Value is lower than minimum value: ${this.min}.`
-                };
-            }
-            if (hasValue(this.max) && hasValue(value) && value > +this.max) {
-                result = result || {};
-                result.max = {
-                    value,
-                    max: this.max,
-                    reason: `Value is greater than than maximum value: ${this.max}.`
-                };
-            }
-        }
-        this.lastErrors = result;
-        return result;
-    }
-    // End of Validator interface
-    ngOnInit() {
-        this.inputId = this.inputId
-            ? this.inputId
-            : `${this.type}$${InputComponent.idCounter++}`;
-    }
-    onLostFocus() {
-        this.markAsTouched();
-    }
-    onKeyUp(newValue) {
-        this.value = newValue;
-    }
-    onChangeValue(newValue) {
-        this.value = newValue;
-        if (this.isColor()) {
-            this.colorpicker.nativeElement.value = undefined;
-        }
-        this.markAsTouched();
-    }
-    onKeyPress(event) {
-        this.keyPress.emit(event);
-    }
-    onColorPicked(newValue) {
-        this.onChangeValue(newValue);
-        this.setValueInControl(newValue);
-    }
-    isUrl() {
-        return this.type === 'url';
-    }
-    isColor() {
-        return this.type === 'color';
-    }
-    isNumber() {
-        return this.type === 'number';
-    }
-    isPercentage() {
-        return this.type === 'percentage';
-    }
-    isPermillage() {
-        return this.type === 'permillage';
-    }
-    hasPrefix() {
-        return this.currency === 'USD';
-    }
-    hasPostfix() {
-        return (this.currency === 'EUR' ||
-            this.isPercentage() ||
-            this.isPermillage() ||
-            (this.isUrl() && !!this.value) ||
-            this.isColor());
-    }
-    checkClassName() {
-        return this.disabled
-            ? this.readonly
-                ? 'disabled readonly'
-                : 'disabled'
-            : this.readonly
-                ? 'readonly'
-                : '';
-    }
-    checkColor() {
-        return this.type === 'color' && isValidColor(this.value)
-            ? this.value
-            : 'initial';
-    }
-    checkType(type) {
-        switch (type) {
-            case 'email':
-                this.setEmailPatterns();
-                break;
-            case 'url':
-                this.setUrlPatterns();
-                break;
-            case 'color':
-                this.setColorPatterns();
-                break;
-            case 'date':
-                this.setDatePatterns();
-                break;
-            case 'time':
-                this.setTimePatterns();
-                break;
-            case 'password':
-                this.setPasswordPatterns();
-                break;
-            case 'number':
-                this.setNumberPatterns();
-                break;
-            case 'currency':
-                this.setCurrencyPatterns();
-                break;
-            case 'percentage':
-                this.setPercentagePatterns();
-                break;
-            case 'permillage':
-                this.setPermillagePatterns();
-                break;
-            default:
-                break;
-        }
-    }
-    setEmailPatterns() { }
-    setUrlPatterns() { }
-    setColorPatterns() {
-        this.domain = 'text';
-    }
-    setDatePatterns() {
-        this.min = this.min || '1900-01-01';
-        this.max = this.max || '2100-01-01';
-    }
-    setTimePatterns() { }
-    setPasswordPatterns() { }
-    setNumberPatterns() {
-        this.domain = 'number';
-        this.placeholder = '0';
-    }
-    setCurrencyPatterns() {
-        this.domain = 'number';
-        this.step = this.step || 0.1;
-        this.min = this.min || 0.0;
-        this.max = this.max || 10000.0;
-        this.value = 0.0;
-    }
-    setPercentagePatterns() {
-        this.domain = 'number';
-        this.step = this.step || 0.01;
-        this.min = this.min || 0.0;
-        this.max = this.max || 100.0;
-        this.placeholder = '0.00';
-    }
-    setPermillagePatterns() {
-        this.domain = 'number';
-        this.step = this.step || 0.01;
-        this.min = this.min || 0.0;
-        this.max = this.max || 1000.0;
-        this.placeholder = '0.00';
-    }
-}
-InputComponent.idCounter = 0;
-InputComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'lux-input',
-                template: "<div *ngIf=\"currency && currency === 'USD'\" class=\"prefix rounded-left symbol\" [ngClass]=\"className\">\n  <span>$</span>\n</div>\n<input\n  #input\n  *ngIf=\"type !== 'textarea'\"\n  [class]=\"hasPrefix() ? (hasPostfix() ? 'infix' : 'postfix rounded-right') : (hasPostfix() ? 'prefix rounded-left' : 'rounded')\"\n  [ngClass]=\"className\"\n  placement=\"top\"\n  [id]=\"inputId\"\n  [type]=\"domain\"\n  [attr.value]=\"value\"\n  [attr.aria-label]=\"ariaLabel\"\n  [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n  [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n  [attr.min]=\"min?.toString() || undefined\"\n  [attr.max]=\"max?.toString() || undefined\"\n  [attr.step]=\"step?.toString() || undefined\"\n  [attr.pattern]=\"pattern || undefined\"\n  [placeholder]=\"placeholder\"\n  (keyup)=\"onKeyUp(input.value)\"\n  (change)=\"onChangeValue(input.value)\"\n  (keypress)=\"onKeyPress($event)\"\n  (blur)=\"onLostFocus()\"\n/>\n<textarea\n  #textarea\n  *ngIf=\"type === 'textarea'\"\n  class=\"rounded\"\n  [ngClass]=\"className\"\n  placement=\"top\"\n  [id]=\"inputId\"\n  [attr.value]=\"value\"\n  [attr.aria-label]=\"ariaLabel\"\n  [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n  [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n  [attr.cols]=\"cols?.toString() || undefined\"\n  [attr.rows]=\"rows?.toString() || undefined\"\n  [placeholder]=\"placeholder\"\n  (keyup)=\"onKeyUp(textarea.value)\"\n  (change)=\"onChangeValue(textarea.value)\"\n  (keypress)=\"onKeyPress($event)\"\n  (blur)=\"onLostFocus()\"\n></textarea>\n<div *ngIf=\"currency && currency === 'EUR'\" class=\"postfix rounded-right symbol\" [ngClass]=\"className\">\n  <span>\u20AC</span>\n</div>\n<div *ngIf=\"isPercentage()\" class=\"postfix rounded-right symbol\" [ngClass]=\"className\">\n  <span>%</span>\n</div>\n<div *ngIf=\"isPermillage()\" class=\"postfix rounded-right symbol\" [ngClass]=\"className\">\n  <span>\u2030</span>\n</div>\n<div *ngIf=\"isUrl() && !!value\" class=\"postfix rounded-right symbol clickable\" [ngClass]=\"className\">\n  <a href=\"{{ value }}\" target=\"_blank\">\n    <span class=\"icon-external\"></span>\n  </a>\n</div>\n<div *ngIf=\"isColor()\" class=\"postfix rounded-right bordered transparency\" [ngClass]=\"className\">\n  <div class=\"rounded-right full-space\" [ngStyle]=\"{'background-color': color}\">\n    <input\n      #colorpicker\n      class=\"minimal-space clickable invisible rounded-right full-space\"\n      [id]=\"inputId + '$colorpicker'\"\n      type=\"color\"\n      [attr.value]=\"value\"\n      [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n      [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n      (change)=\"onColorPicked(colorpicker.value)\"\n      (keypress)=\"onKeyPress($event)\"\n      (blur)=\"onLostFocus()\"\n    />\n  </div>\n</div>\n\n<div *ngIf=\"inlineErrors && lastErrors && (dirty || touched)\" class=\"alert\">\n  <div *ngIf=\"lastErrors.required\">\n    {{ userErrors[this.lang].required }}\n  </div>\n  <div *ngIf=\"lastErrors.email\">{{ userErrors[this.lang].email }}</div>\n  <div *ngIf=\"lastErrors.url\">{{ userErrors[this.lang].url }}</div>\n  <div *ngIf=\"lastErrors.min\">\n    {{ userErrors[this.lang].min.replace('$min', lastErrors.min.min) }}\n  </div>\n  <div *ngIf=\"lastErrors.max\">\n    {{ userErrors[this.lang].max.replace('$max', lastErrors.max.max) }}\n  </div>\n</div>\n",
-                providers: [
-                    {
-                        provide: NG_VALUE_ACCESSOR,
-                        multi: true,
-                        useExisting: forwardRef(() => InputComponent)
-                    },
-                    {
-                        provide: NG_VALIDATORS,
-                        multi: true,
-                        useExisting: forwardRef(() => InputComponent)
-                    }
-                ],
-                styles: [":focus{z-index:1}input,select,textarea{border:1px solid #495057;border:var(--lux-input-border, 1px solid) var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color:default;color:var(--lux-symbol-color, default);text-align:center;white-space:nowrap;background:default;background:var(--lux-symbol-background, default);font-size:1rem;font-size:var(--lux-symbol-font-size, 1rem)}.bordered,.symbol{border:1px solid #495057;border:var(--lux-input-border, 1px solid) var(--lux-input-border-color, #495057)}.rounded,.rounded-right,.rounded-middle,.rounded-left{border-radius:.25rem;border-radius:var(--lux-border-radius, .25rem)}.rounded-left{border-top-right-radius:0;border-bottom-right-radius:0}.rounded-middle{border-radius:0}.rounded-right{border-top-left-radius:0;border-bottom-left-radius:0}.prefix{border-right:none}.infix{border-left:none;border-right:none}.postfix{border-left:none;display:flex;align-items:center}:host{display:flex;align-items:stretch;min-height:1.5rem}.readonly{border:none}.readonly:focus{border:none;outline:none}.disabled{background-color:#f1f1f1;background-color:var(--lux-disabled-color, #f1f1f1);border-color:#6d6d6d;border-color:var(--lux-disabled-border-color, #6d6d6d)}.clickable{cursor:pointer}.full-space{width:100%;height:100%;margin:0;padding:0}.minimal-space,.icon,.icon-external{min-width:1rem;min-height:1rem}.icon,.icon-external{display:inline-block;background-size:1rem 1rem;background-position:center;background-repeat:no-repeat;width:1.5rem;width:var(--lux-autocomplete-icon-width, 1.5rem);z-index:1}.icon-external{background:url(/assets/img/external.svg) no-repeat center;background:var(--lux-input-icon-external, url(/assets/img/external.svg) no-repeat center);background-size:1rem;background-position-y:.1rem;height:100%}.invisible{opacity:0}.transparency{background-image:conic-gradient(white 0deg 90deg,lightgray 90deg 180deg,white 180deg 270deg,lightgray 270deg 360deg)}\n"]
-            },] }
-];
-InputComponent.ctorParameters = () => [
-    { type: RegexpService }
-];
-InputComponent.propDecorators = {
-    input: [{ type: ViewChild, args: ['input', { static: false },] }],
-    textarea: [{ type: ViewChild, args: ['textarea', { static: false },] }],
-    colorpicker: [{ type: ViewChild, args: ['colorpicker', { static: false },] }],
-    rows: [{ type: Input }],
-    cols: [{ type: Input }],
-    step: [{ type: Input }],
-    min: [{ type: Input }],
-    max: [{ type: Input }],
-    lang: [{ type: Input }],
-    inlineErrors: [{ type: Input }],
-    inputId: [{ type: Input }],
-    ariaLabel: [{ type: Input, args: ['aria-label',] }],
-    readonly: [{ type: Input }],
-    disabled: [{ type: Input }],
-    pattern: [{ type: Input }],
-    currency: [{ type: Input }],
-    placeholder: [{ type: Input }],
-    required: [{ type: Input }],
-    type: [{ type: Input }],
-    value: [{ type: Input }],
-    valueChange: [{ type: Output }],
-    keyPress: [{ type: Output }]
-};
-
-/** Filter component to query for objects. */
-class FilterComponent {
-    constructor() {
-        this.touched = false;
-        this._searchValue = '';
-        this.disabled = false;
-        /** Placeholder default text. */
-        this.placeholder = '';
-        /** Search on type: (default true) Auto-search when user types in. */
-        this.searchOnType = true;
-        this.debounceValue = 300; // 300 ms
-        /** Search value changed by user. */
-        this.searchValueChange = new EventEmitter();
-        this.subject = new Subject();
-        // ControlValueAccessor Interface
-        this.onChange = (value) => { };
-        this.onTouched = () => { };
-        this.recreateObservable();
-    }
-    /** Search value introduced by the user. */
-    get searchValue() {
-        return this._searchValue;
-    }
-    set searchValue(v) {
-        v = (v || '').toString();
-        if (v === this._searchValue) {
-            return;
-        }
-        this.onChange(v);
-        this._searchValue = v;
-    }
-    /** Debounce time in milliseconds. (defaults to 300 ms) */
-    set debounce(val) {
-        this.debounceValue = val;
-        this.recreateObservable();
-    }
-    get debounce() {
-        return this.debounceValue;
-    }
-    writeValue(value) {
-        this.searchValue = (value || '').toString();
-    }
-    registerOnChange(onChange) {
-        this.onChange = onChange;
-    }
-    registerOnTouched(onTouched) {
-        this.onTouched = onTouched;
-    }
-    markAsTouched() {
-        if (!this.touched) {
-            this.onTouched();
-            this.touched = true;
-        }
-    }
-    setDisabledState(disabled) {
-        this.disabled = disabled;
-    }
-    // End ControlValueAccessor Interface
-    ngOnInit() {
-        this.inputId = this.inputId
-            ? this.inputId
-            : `filter$${FilterComponent.idCounter++}`;
-    }
-    ngOnDestroy() {
-        this.freeSubscriptions();
-    }
-    clear() {
-        this.searchValue = '';
-        this.search();
-    }
-    search() {
-        this.searchValueChange.emit(this.searchValue);
-    }
-    keyup(event, newValue) {
-        this.markAsTouched();
-        this.searchValue = newValue;
-        if (event.key === 'Enter') {
-            this.searchNow(this.searchValue);
-        }
-        if (this.searchOnType) {
-            this.addEvent();
-        }
-    }
-    onInputValueChange(newValue) {
-        this.markAsTouched();
-        this.searchValue = newValue;
-    }
-    recreateObservable() {
-        this.searchValue$ = this.subject
-            .asObservable()
-            .pipe(debounceTime(this.debounce));
-        this.freeSubscriptions();
-        this.sub = this.searchValue$.subscribe((value) => {
-            this.searchValueChange.emit(value);
-        });
-    }
-    freeSubscriptions() {
-        if (this.sub) {
-            this.sub.unsubscribe();
-            this.sub = null;
-        }
-    }
-    searchNow(value) {
-        this.searchValueChange.emit(value);
-    }
-    addEvent() {
-        this.subject.next(this.searchValue);
-    }
-}
-FilterComponent.idCounter = 0;
-FilterComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'lux-filter',
-                template: "<div class=\"filter\">\n  <input\n    #i0\n    type=\"text\"\n    [attr.aria-label]=\"ariaLabel\"\n    [placeholder]=\"placeholder\"\n    [id]=\"inputId\"\n    [disabled]=\"disabled\"\n    [value]=\"searchValue\"\n    (valueChange)=\"onInputValueChange(i0.value)\"\n    (keyup)=\"keyup($event, i0.value)\"\n  />\n\n  <button\n    [class.hide]=\"!searchValue\"\n    aria-label=\"Clear\"\n    class=\"clear-indicator icon icon-clear\"\n    type=\"button\"\n    (click)=\"clear()\"\n  ></button>\n  <i *ngIf=\"1 || searchOnType\" class=\"search-indicator icon icon-search\"></i>\n  <button\n    class=\"btn-search\"\n    *ngIf=\"!searchOnType\"\n    type=\"button\"\n    [disabled]=\"disabled\"\n    (click)=\"search()\"\n  >\n    Search\n  </button>\n</div>\n",
-                providers: [
-                    {
-                        provide: NG_VALUE_ACCESSOR,
-                        multi: true,
-                        useExisting: forwardRef(() => FilterComponent)
-                    }
-                ],
-                styles: [":focus{z-index:1}input,select,textarea{border:1px solid #495057;border:var(--lux-input-border, 1px solid) var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color:default;color:var(--lux-symbol-color, default);text-align:center;white-space:nowrap;background:default;background:var(--lux-symbol-background, default);font-size:1rem;font-size:var(--lux-symbol-font-size, 1rem)}.bordered,.symbol{border:1px solid #495057;border:var(--lux-input-border, 1px solid) var(--lux-input-border-color, #495057)}.rounded,.rounded-right,.rounded-middle,.rounded-left{border-radius:.25rem;border-radius:var(--lux-border-radius, .25rem)}.rounded-left{border-top-right-radius:0;border-bottom-right-radius:0}.rounded-middle{border-radius:0}.rounded-right{border-top-left-radius:0;border-bottom-left-radius:0}.prefix{border-right:none}.infix{border-left:none;border-right:none}.postfix{border-left:none;display:flex;align-items:center}.filter{display:grid;grid-template-columns:auto 1.5rem 1.5rem .5rem auto}.filter input{grid-row:1;grid-column-start:1;grid-column-end:4}.filter .hide{visibility:collapse}.filter .clear-indicator{grid-row:1;grid-column:2;border:none}.filter .search-indicator{grid-row:1;grid-column:3}.filter .btn-search{grid-row:1;grid-column:5}.filter .icon-search{background:url(/assets/img/filter-search.png) no-repeat center;background:var(--lux-filter-icon-search, url(/assets/img/filter-search.png) no-repeat center);background-size:1rem;background-size:var(--lux-filter-icon-bg-size, 1rem);background-position:center;width:1rem;width:var(--lux-filter-icon-width, 1rem)}.filter .icon-clear{background:url(/assets/img/filter-clear.png) no-repeat center;background:var(--lux-filter-icon-clear, url(/assets/img/filter-clear.png) no-repeat center);background-size:1rem;background-size:var(--lux-filter-icon-bg-size, 1rem);background-position:center}\n"]
-            },] }
-];
-FilterComponent.ctorParameters = () => [];
-FilterComponent.propDecorators = {
-    disabled: [{ type: Input }],
-    inputId: [{ type: Input }],
-    placeholder: [{ type: Input }],
-    searchValue: [{ type: Input }],
-    searchOnType: [{ type: Input }],
-    ariaLabel: [{ type: Input, args: ['aria-label',] }],
-    debounce: [{ type: Input }],
-    searchValueChange: [{ type: Output }]
-};
-
-class ActiveModal {
-    close(result) { }
-    dismiss(reason) { }
-}
-class ModalRef {
-    constructor(_windowCmptRef, _contentRef, _backdropCmptRef, _beforeDismiss) {
-        this._windowCmptRef = _windowCmptRef;
-        this._contentRef = _contentRef;
-        this._backdropCmptRef = _backdropCmptRef;
-        this._beforeDismiss = _beforeDismiss;
-        _windowCmptRef.instance.dismissEvent.subscribe((reason) => {
-            this.dismiss(reason);
-        });
-        this.result = new Promise((resolve, reject) => {
-            this._resolve = resolve;
-            this._reject = reject;
-        });
-        this.result.then(null, () => { });
-    }
-    /**
-     * The instance of a component used for the modal content.
-     *
-     * When a `TemplateRef` is used as the content, will return `undefined`.
-     */
-    get componentInstance() {
-        if (this._contentRef.componentRef) {
-            return this._contentRef.componentRef.instance;
-        }
-    }
-    /**
-     * Closes the modal with an optional `result` value.
-     *
-     * The `NgbMobalRef.result` promise will be resolved with the provided value.
-     */
-    close(result) {
-        if (this._windowCmptRef) {
-            if (this._resolve) {
-                this._resolve(result);
-            }
-            this._removeModalElements();
-        }
-    }
-    _dismiss(reason) {
-        if (this._reject) {
-            this._reject(reason);
-        }
-        this._removeModalElements();
-    }
-    /**
-     * Dismisses the modal with an optional `reason` value.
-     *
-     * The `NgbModalRef.result` promise will be rejected with the provided value.
-     */
-    dismiss(reason) {
-        if (this._windowCmptRef) {
-            if (!this._beforeDismiss) {
-                this._dismiss(reason);
-            }
-            else {
-                const dismiss = this._beforeDismiss();
-                if (dismiss && dismiss.then) {
-                    dismiss.then((result) => {
-                        if (result !== false) {
-                            this._dismiss(reason);
-                        }
-                    }, () => { });
-                }
-                else if (dismiss !== false) {
-                    this._dismiss(reason);
-                }
-            }
-        }
-    }
-    _removeModalElements() {
-        const windowNativeEl = this._windowCmptRef.location.nativeElement;
-        windowNativeEl.parentNode.removeChild(windowNativeEl);
-        this._windowCmptRef.destroy();
-        if (this._backdropCmptRef) {
-            const backdropNativeEl = this._backdropCmptRef.location.nativeElement;
-            backdropNativeEl.parentNode.removeChild(backdropNativeEl);
-            this._backdropCmptRef.destroy();
-        }
-        if (this._contentRef && this._contentRef.viewRef) {
-            this._contentRef.viewRef.destroy();
-        }
-        this._windowCmptRef = null;
-        this._backdropCmptRef = null;
-        this._contentRef = null;
-    }
-}
-
-const FOCUS = 'focus';
-var Key;
-(function (Key) {
-    Key[Key["Tab"] = 9] = "Tab";
-    Key[Key["Enter"] = 13] = "Enter";
-    Key[Key["Escape"] = 27] = "Escape";
-    Key[Key["Space"] = 32] = "Space";
-    Key[Key["PageUp"] = 33] = "PageUp";
-    Key[Key["PageDown"] = 34] = "PageDown";
-    Key[Key["End"] = 35] = "End";
-    Key[Key["Home"] = 36] = "Home";
-    Key[Key["ArrowLeft"] = 37] = "ArrowLeft";
-    Key[Key["ArrowUp"] = 38] = "ArrowUp";
-    Key[Key["ArrowRight"] = 39] = "ArrowRight";
-    Key[Key["ArrowDown"] = 40] = "ArrowDown";
-})(Key || (Key = {}));
-const isDefined = (value) => value !== undefined && value !== null;
-class ContentRef {
-    constructor(nodes, viewRef, componentRef) {
-        this.nodes = nodes;
-        this.viewRef = viewRef;
-        this.componentRef = componentRef;
-    }
-}
-const FOCUSABLE_ELEMENTS_SELECTOR = [
-    'a[href]',
-    'button:not([disabled])',
-    'input:not([disabled]):not([type="hidden"])',
-    'select:not([disabled])',
-    'textarea:not([disabled])',
-    '[contenteditable]',
-    '[tabindex]:not([tabindex="-1"])'
-].join(', ');
-/**
- * Returns first and last focusable elements inside of a given element based on specific CSS selector
- */
-const getFocusableBoundaryElements = (element) => {
-    const list = Array.from(element.querySelectorAll(FOCUSABLE_ELEMENTS_SELECTOR)).filter((el) => el.tabIndex !== -1);
-    return [list[0], list[list.length - 1]];
-};
-/**
- * Function that enforces browser focus to be trapped inside a DOM element.
- *
- * Works only for clicks inside the element and navigation with 'Tab', ignoring clicks outside of the element
- *
- * @param element The element around which focus will be trapped inside
- * @param stopFocusTrap$ The observable stream. When completed the focus trap will clean up listeners
- * and free internal resources
- * @param refocusOnClick Put the focus back to the last focused element whenever a click occurs on element (default to
- * false)
- */
-const focusTrap = (element, stopFocusTrap$, refocusOnClick = false) => {
-    // last focused element
-    const lastFocusedElement$ = fromEvent(element, 'focusin').pipe(takeUntil(stopFocusTrap$), map((e) => e.target));
-    // 'tab' / 'shift+tab' stream
-    fromEvent(element, 'keydown')
-        .pipe(takeUntil(stopFocusTrap$), 
-    /* eslint-disable import/no-deprecated */
-    filter((e) => e.which === Key.Tab), 
-    /* eslint-enable import/no-deprecated */
-    withLatestFrom(lastFocusedElement$))
-        .subscribe(([tabEvent, focusedElement]) => {
-        const [first, last] = getFocusableBoundaryElements(element);
-        if ((focusedElement === first || focusedElement === element) &&
-            tabEvent.shiftKey) {
-            last.focus();
-            tabEvent.preventDefault();
-        }
-        if (focusedElement === last && !tabEvent.shiftKey) {
-            first.focus();
-            tabEvent.preventDefault();
-        }
-    });
-    // inside click
-    if (refocusOnClick) {
-        fromEvent(element, 'click')
-            .pipe(takeUntil(stopFocusTrap$), withLatestFrom(lastFocusedElement$), map((arr) => arr[1]))
-            .subscribe((lastFocusedElement) => lastFocusedElement.focus());
-    }
-};
-
-var ModalDismissReasons;
-(function (ModalDismissReasons) {
-    ModalDismissReasons[ModalDismissReasons["BackdropClick"] = 0] = "BackdropClick";
-    ModalDismissReasons[ModalDismissReasons["Esc"] = 1] = "Esc";
-})(ModalDismissReasons || (ModalDismissReasons = {}));
-
-class LuxModalWindowComponent {
-    constructor(_document, _elRef) {
-        this._document = _document;
-        this._elRef = _elRef;
-        this.backdrop = false;
-        this.keyboard = true;
-        this.dismissEvent = new EventEmitter();
-        this.role = 'dialog';
-        this.tabindex = '-1';
-        this.ariamodal = true;
-    }
-    get class() {
-        return `modal ${this.windowClass || ''}`;
-    }
-    get hostAriaLabelledBy() {
-        return this.ariaLabelledBy;
-    }
-    get hostAriaDescribedBy() {
-        return this.ariaDescribedBy;
-    }
-    backdropClick(btn) {
-        if (this.backdrop === true && this._elRef.nativeElement === btn) {
-            this.dismiss(ModalDismissReasons.BackdropClick);
-        }
-    }
-    escKey(event) {
-        if (this.keyboard && !event.defaultPrevented) {
-            this.dismiss(ModalDismissReasons.Esc);
-        }
-    }
-    dismiss(reason) {
-        this.dismissEvent.emit(reason);
-    }
-    ngOnInit() {
-        this._elWithFocus = this._document.activeElement;
-    }
-    ngAfterViewInit() {
-        if (!this._elRef.nativeElement.contains(document.activeElement)) {
-            const firstFocusable = getFocusableBoundaryElements(this._elRef.nativeElement)[0];
-            const elementToFocus = firstFocusable || this._elRef.nativeElement;
-            elementToFocus.focus();
-        }
-    }
-    ngOnDestroy() {
-        const body = this._document.body;
-        const elWithFocus = this._elWithFocus;
-        let elementToFocus;
-        if (elWithFocus && elWithFocus[FOCUS] && body.contains(elWithFocus)) {
-            elementToFocus = elWithFocus;
-        }
-        else {
-            elementToFocus = body;
-        }
-        elementToFocus.focus();
-        this._elWithFocus = null;
-    }
-}
-LuxModalWindowComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'lux-modal-window',
-                template: `
-    <div class="modal-dialog" role="document">
-      <div class="modal-content"><ng-content></ng-content></div>
-    </div>
-  `
-            },] }
-];
-LuxModalWindowComponent.ctorParameters = () => [
-    { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] },
-    { type: ElementRef }
-];
-LuxModalWindowComponent.propDecorators = {
-    ariaDescribedBy: [{ type: Input }],
-    ariaLabelledBy: [{ type: Input }],
-    backdrop: [{ type: Input }],
-    keyboard: [{ type: Input }],
-    windowClass: [{ type: Input }],
-    dismissEvent: [{ type: Output }],
-    class: [{ type: HostBinding, args: ['class',] }],
-    role: [{ type: HostBinding, args: ['attr.role',] }],
-    tabindex: [{ type: HostBinding, args: ['tabindex',] }],
-    ariamodal: [{ type: HostBinding, args: ['attr.aria-modal',] }],
-    hostAriaLabelledBy: [{ type: HostBinding, args: ['attr.aria-labelledby',] }],
-    hostAriaDescribedBy: [{ type: HostBinding, args: ['attr.aria-describedby',] }],
-    backdropClick: [{ type: HostListener, args: ['click', ['$event.target'],] }],
-    escKey: [{ type: HostListener, args: ['keyup.esc', ['$event'],] }]
-};
-
-class LuxModalBackdropComponent {
-    constructor() {
-        this.class = 'modal-backdrop fade show';
-        this.style = 'z-index: 1050';
-    }
-}
-LuxModalBackdropComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'lux-modal-backdrop',
-                template: ''
-            },] }
-];
-LuxModalBackdropComponent.propDecorators = {
-    backdropClass: [{ type: Input }],
-    class: [{ type: HostBinding, args: ['class',] }],
-    style: [{ type: HostBinding, args: ['style',] }]
-};
-
-class LuxModalConfig {
-    constructor() {
-        this.backdrop = true;
-    }
-}
-LuxModalConfig.ɵprov = i0.ɵɵdefineInjectable({ factory: function LuxModalConfig_Factory() { return new LuxModalConfig(); }, token: LuxModalConfig, providedIn: "root" });
-LuxModalConfig.decorators = [
-    { type: Injectable, args: [{ providedIn: 'root' },] }
-];
-
-class ModalStack {
-    constructor(_applicationRef, _document, _injector, _rendererFactory, modalConfig) {
-        this._applicationRef = _applicationRef;
-        this._document = _document;
-        this._injector = _injector;
-        this._rendererFactory = _rendererFactory;
-        this.modalConfig = modalConfig;
-        this._activeWindowCmptHasChanged = new Subject();
-        this._modalRefs = [];
-        this._windowCmpts = [];
-        this._ariaHiddenValues = new Map();
-        this._backdropAttributes = ['backdropClass'];
-        this._windowAttributes = [
-            'ariaLabelledBy',
-            'backdrop',
-            'centered',
-            'keyboard',
-            'scrollable',
-            'size',
-            'windowClass'
-        ];
-        this._activeWindowCmptHasChanged.subscribe(() => {
-            if (this._windowCmpts.length) {
-                const activeWindowCmpt = this._windowCmpts[this._windowCmpts.length - 1];
-                focusTrap(activeWindowCmpt.location.nativeElement, this._activeWindowCmptHasChanged);
-                this._revertAriaHidden();
-                this._setAriaHidden(activeWindowCmpt.location.nativeElement);
-            }
-        });
-    }
-    open(moduleCFR, content, options) {
-        const config = Object.assign({}, this.modalConfig, options);
-        const containerEl = this._document.body;
-        const renderer = this._rendererFactory.createRenderer(null, null);
-        const removeBodyClass = () => {
-            if (!this._modalRefs.length) {
-                renderer.removeClass(this._document.body, 'modal-open');
-                this._revertAriaHidden();
-            }
-        };
-        const activeModal = new ActiveModal();
-        const contentRef = this.getContentRef(moduleCFR, content, activeModal);
-        const backdropCmptRef = config.backdrop ? this._attachBackdrop(moduleCFR, containerEl) : null;
-        const windowCmptRef = this._attachWindowComponent(moduleCFR, containerEl, contentRef);
-        const modalRef = new ModalRef(windowCmptRef, contentRef, backdropCmptRef);
-        this._registerModalRef(modalRef);
-        this._registerWindowCmpt(windowCmptRef);
-        modalRef.result.then(removeBodyClass, removeBodyClass);
-        activeModal.close = (result) => {
-            modalRef.close(result);
-        };
-        activeModal.dismiss = (reason) => {
-            modalRef.dismiss(reason);
-        };
-        this._applyWindowOptions(windowCmptRef.instance, config);
-        if (this._modalRefs.length === 1) {
-            renderer.addClass(this._document.body, 'modal-open');
-        }
-        if (backdropCmptRef && backdropCmptRef.instance) {
-            this._applyBackgroundOptions(backdropCmptRef.instance, config);
-            backdropCmptRef.changeDetectorRef.detectChanges();
-        }
-        windowCmptRef.changeDetectorRef.detectChanges();
-        return modalRef;
-    }
-    _applyWindowOptions(windowInstance, config) {
-        this._windowAttributes.forEach((optionName) => {
-            if (isDefined(config[optionName])) {
-                windowInstance[optionName] = config[optionName];
-            }
-        });
-    }
-    _applyBackgroundOptions(backgroudInstance, config) {
-        this._backdropAttributes.forEach((optionName) => {
-            if (isDefined(config[optionName])) {
-                backgroudInstance[optionName] = config[optionName];
-            }
-        });
-    }
-    _revertAriaHidden() {
-        this._ariaHiddenValues.forEach((value, element) => {
-            if (value) {
-                element.setAttribute('aria-hidden', value);
-            }
-            else {
-                element.removeAttribute('aria-hidden');
-            }
-        });
-        this._ariaHiddenValues.clear();
-    }
-    getContentRef(moduleCFR, content, activeModal) {
-        if (content instanceof TemplateRef) {
-            return this.createFromTemplateRef(content, activeModal);
-        }
-    }
-    createFromTemplateRef(content, activeModal) {
-        const context = {
-            $implicit: activeModal,
-            // eslint-disable-next-line prefer-arrow/prefer-arrow-functions
-            close(result) {
-                activeModal.close(result);
-            },
-            // eslint-disable-next-line prefer-arrow/prefer-arrow-functions
-            dismiss(reason) {
-                activeModal.dismiss(reason);
-            }
-        };
-        const viewRef = content.createEmbeddedView(context);
-        this._applicationRef.attachView(viewRef);
-        return new ContentRef([viewRef.rootNodes], viewRef);
-    }
-    _attachBackdrop(moduleCFR, containerEl) {
-        const backdropFactory = moduleCFR.resolveComponentFactory(LuxModalBackdropComponent);
-        const backdropCmptRef = backdropFactory.create(this._injector);
-        this._applicationRef.attachView(backdropCmptRef.hostView);
-        containerEl.appendChild(backdropCmptRef.location.nativeElement);
-        return backdropCmptRef;
-    }
-    _attachWindowComponent(moduleCFR, containerEl, contentRef) {
-        const windowFactory = moduleCFR.resolveComponentFactory(LuxModalWindowComponent);
-        const windowCmptRef = windowFactory.create(this._injector, contentRef.nodes);
-        this._applicationRef.attachView(windowCmptRef.hostView);
-        containerEl.appendChild(windowCmptRef.location.nativeElement);
-        return windowCmptRef;
-    }
-    _registerModalRef(modalRef) {
-        const unregisterModalRef = () => {
-            const index = this._modalRefs.indexOf(modalRef);
-            if (index > -1) {
-                this._modalRefs.splice(index, 1);
-            }
-        };
-        this._modalRefs.push(modalRef);
-        modalRef.result.then(unregisterModalRef, unregisterModalRef);
-    }
-    _registerWindowCmpt(windowCmpt) {
-        this._windowCmpts.push(windowCmpt);
-        this._activeWindowCmptHasChanged.next();
-        windowCmpt.onDestroy(() => {
-            const index = this._windowCmpts.indexOf(windowCmpt);
-            if (index > -1) {
-                this._windowCmpts.splice(index, 1);
-                this._activeWindowCmptHasChanged.next();
-            }
-        });
-    }
-    _setAriaHidden(element) {
-        const parent = element.parentElement;
-        if (parent && element !== this._document.body) {
-            Array.from(parent.children).forEach((sibling) => {
-                if (sibling !== element && sibling.nodeName !== 'SCRIPT') {
-                    this._ariaHiddenValues.set(sibling, sibling.getAttribute('aria-hidden'));
-                    sibling.setAttribute('aria-hidden', 'true');
-                }
-            });
-            this._setAriaHidden(parent);
-        }
-    }
-}
-ModalStack.ɵprov = i0.ɵɵdefineInjectable({ factory: function ModalStack_Factory() { return new ModalStack(i0.ɵɵinject(i0.ApplicationRef), i0.ɵɵinject(i1.DOCUMENT), i0.ɵɵinject(i0.INJECTOR), i0.ɵɵinject(i0.RendererFactory2), i0.ɵɵinject(LuxModalConfig)); }, token: ModalStack, providedIn: "root" });
-ModalStack.decorators = [
-    { type: Injectable, args: [{ providedIn: 'root' },] }
-];
-ModalStack.ctorParameters = () => [
-    { type: ApplicationRef },
-    { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] },
-    { type: Injector },
-    { type: RendererFactory2 },
-    { type: LuxModalConfig }
-];
-
-/**
- * A service that it allow open an close modal components
- */
-class ModalService {
-    constructor(modalStack, moduleCFR) {
-        this.modalStack = modalStack;
-        this.moduleCFR = moduleCFR;
-    }
-    /**Open a modal component
-     * @param content TemplateRef
-     */
-    open(content, options = {}) {
-        return this.modalStack.open(this.moduleCFR, content, options);
-    }
-}
-ModalService.ɵprov = i0.ɵɵdefineInjectable({ factory: function ModalService_Factory() { return new ModalService(i0.ɵɵinject(ModalStack), i0.ɵɵinject(i0.ComponentFactoryResolver)); }, token: ModalService, providedIn: "root" });
-ModalService.decorators = [
-    { type: Injectable, args: [{ providedIn: 'root' },] }
-];
-ModalService.ctorParameters = () => [
-    { type: ModalStack },
-    { type: ComponentFactoryResolver }
-];
-
-class GeolocationService {
-    constructor(http) {
-        this.http = http;
-        this.debouncePeriodMs = 300; // ms
-        this.cacheSize = 20;
-        this.lastQueriesWithResults = new Map();
-        this.lastQueriesLru = [];
-        this.currentSearch$ = new Subject();
-        const typed$ = this.currentSearch$
-            .asObservable()
-            .pipe(distinctUntilChanged());
-        this.currentQuery$ = typed$.pipe(debounceTime(this.debouncePeriodMs), switchMap((currentQuery) => {
-            const data = this.getFromCache(currentQuery);
-            if (data !== undefined) {
-                return of(data);
-            }
-            // Nominatim search documentation:
-            // https://nominatim.org/release-docs/develop/api/Search/
-            const url = 'https://nominatim.openstreetmap.org/search?format=json&limit=20&q=' +
-                encodeURIComponent(currentQuery);
-            const headers = {
-                'Content-Type': 'application/json'
-            };
-            this.addToCache(currentQuery, []);
-            return this.http.get(url, { headers }).pipe(map((response) => {
-                const searchResults = response;
-                const uniqueResults = distinct(searchResults);
-                return this.addToCache(currentQuery, uniqueResults);
-            }));
-        }));
-    }
-    searchGeolocation(query) {
-        this.currentSearch$.next(query);
-        return this.currentQuery$;
-    }
-    getLabels(instance, keys) {
-        const searchResults = instance.lastQueriesWithResults
-            .get(instance.getLatestQuery())
-            .filter((searchResult) => samePosition(searchResult, keys));
-        return of(searchResults.map((searchResult) => {
-            const key = {
-                type: 'Point',
-                coordinates: [searchResult.lon, searchResult.lat]
-            };
-            return {
-                key,
-                label: searchResult.display_name
-            };
-        }));
-    }
-    getData(instance, search) {
-        return instance.searchGeolocation(search).pipe(map((searchResults) => searchResults.map((searchResult) => {
-            const key = {
-                type: 'Point',
-                coordinates: [searchResult.lon, searchResult.lat]
-            };
-            const label = searchResult.display_name;
-            return { key, label };
-        })));
-    }
-    // Cache implemementation ---
-    getFromCache(query) {
-        if (this.lastQueriesWithResults.has(query)) {
-            return this.lastQueriesWithResults.get(query);
-        }
-        return undefined;
-    }
-    addToCache(query, data) {
-        if (this.lastQueriesWithResults.keys.length >= this.cacheSize) {
-            const deletedQuery = this.lastQueriesLru[0];
-            this.revomeFromCache(deletedQuery);
-        }
-        this.lastQueriesWithResults.set(query, data);
-        this.lastQueriesLru.push(query);
-        return data;
-    }
-    revomeFromCache(query) {
-        this.lastQueriesWithResults.delete(query);
-        const index = this.lastQueriesLru.findIndex((it) => it === query);
-        this.lastQueriesLru.splice(index, 1);
-    }
-    getLatestQuery() {
-        return this.lastQueriesLru.length
-            ? this.lastQueriesLru[this.lastQueriesLru.length - 1]
-            : null;
-    }
-}
-GeolocationService.ɵprov = i0.ɵɵdefineInjectable({ factory: function GeolocationService_Factory() { return new GeolocationService(i0.ɵɵinject(i1$1.HttpClient)); }, token: GeolocationService, providedIn: "root" });
-GeolocationService.decorators = [
-    { type: Injectable, args: [{ providedIn: 'root' },] }
-];
-GeolocationService.ctorParameters = () => [
-    { type: HttpClient }
-];
-const samePosition = (searchResult, keys) => {
-    let found = false;
-    keys.forEach((item) => {
-        if (searchResult.lon === item.coordinates[0] &&
-            searchResult.lat === item.coordinates[1]) {
-            found = true;
-        }
-    });
-    return found;
-};
-const ɵ0$2 = samePosition;
-const distinct = (data) => {
-    const unique = {};
-    return data.filter((r) => {
-        if (unique[r.display_name]) {
-            return false;
-        }
-        unique[r.display_name] = 1;
-        return true;
-    });
-};
-const ɵ1$1 = distinct;
-
-class GeolocationComponent {
-    constructor(modalService, locationService) {
-        this.modalService = modalService;
-        this.locationService = locationService;
-        this.touched = false;
-        this.dirty = false;
-        this.lastErrors = null;
-        this.latitudeValue = undefined;
-        this.longitudeValue = undefined;
-        this.isValidNumber = isValidNumber;
-        this.i18n = {
-            en: {
-                lat: 'latitude',
-                lon: 'longitude',
-                selectLocation: 'Select location',
-                location: 'Location',
-                selectAction: 'Select',
-                cancelAction: 'Cancel',
-                closeAction: 'Close',
-                typeToSearch: 'type to search',
-                cardinalPoints: {
-                    north: 'N',
-                    south: 'S',
-                    east: 'E',
-                    west: 'W'
-                },
-                userErrors: {
-                    required: 'Required field.',
-                    minLatitude: 'Minimum latitude is $minLatitude.',
-                    maxLatitude: 'Maximum latitude is $maxLatitude.',
-                    minLongitude: 'Minimum longitude is $minLongitude.',
-                    maxLongitude: 'Maximum longitude is $maxLongitude.'
-                }
-            },
-            es: {
-                lat: 'latitud',
-                lon: 'longitud',
-                selectLocation: 'Seleccione ubicación',
-                location: 'Ubicación',
-                selectAction: 'Seleccionar',
-                cancelAction: 'Cancelar',
-                closeAction: 'Cerrar',
-                typeToSearch: 'escribe para buscar',
-                cardinalPoints: {
-                    north: 'N',
-                    south: 'S',
-                    east: 'E',
-                    west: 'O'
-                },
-                userErrors: {
-                    required: 'El campo es obligatorio.',
-                    minLatitude: 'La latitud mínima es $minLatitude.',
-                    maxLatitude: 'La latitud máxima es $maxLatitude.',
-                    minLongitude: 'La longitud mínima es $minLongitude.',
-                    maxLongitude: 'La longitud máxima es $maxLongitude.'
-                }
-            }
-        };
-        this.lang = languageDetector();
-        this.inlineErrors = false;
-        this.readonly = null;
-        this.valueChange = new EventEmitter();
-        this.keyPress = new EventEmitter();
-        this.onChange = (value) => { };
-        this.onTouched = () => { };
-    }
-    get className() {
-        return this.checkClassName();
-    }
-    set disabled(v) {
-        v = typeof v === 'string' && v !== 'false' ? true : v;
-        this._disabled = v;
-    }
-    get disabled() {
-        return this._disabled;
-    }
-    set required(v) {
-        this._required = v;
-    }
-    get required() {
-        return this._required;
-    }
-    set value(v) {
-        if (v === this._value) {
-            return; // prevent events when there is no changes
-        }
-        const initialAndEmpty = isInitialAndEmpty(this._value, v);
-        if (v &&
-            v.coordinates &&
-            v.coordinates.length === 2 &&
-            exists(v.coordinates[0] && exists(v.coordinates[1]))) {
-            this._value = v;
-            this.setLatitudeInControl(v.coordinates[1]);
-            this.setLongitudeInControl(v.coordinates[0]);
-        }
-        else if (!v) {
-            this._value = null;
-            this.setLatitudeInControl(null);
-            this.setLongitudeInControl(null);
-        }
-        else {
-            this._value = v;
-            // we don't set value in control if the value is not valid
-            // if we do, the content of the control changes and can erase what the user is typing
-        }
-        this.onChange(v);
-        if (!initialAndEmpty) {
-            this.valueChange.emit(v);
-        }
-    }
-    get value() {
-        return this._value;
-    }
-    // ControlValueAccessor Interface implementation
-    writeValue(value) {
-        this.value = value;
-    }
-    registerOnChange(onChange) {
-        this.onChange = onChange;
-    }
-    registerOnTouched(onTouched) {
-        this.onTouched = onTouched;
-    }
-    markAsTouched() {
-        if (!this.touched) {
-            this.onTouched();
-            this.touched = true;
-        }
-    }
-    setDisabledState(disabled) {
-        this.disabled = disabled;
-    }
-    // End of ControlValueAccessor Interface implementation
-    setLatitudeInControl(latitude) {
-        // this.latitude.nativeElement.value = latitude;
-        this.latitudeValue = latitude;
-    }
-    setLongitudeInControl(longitude) {
-        // this.longitude.nativeElement.value = longitude;
-        this.longitudeValue = longitude;
-    }
-    clear() {
-        this.setLatitudeInControl(null);
-        this.setLongitudeInControl(null);
-        this.value = null;
-    }
-    // Validator interface
-    registerOnValidatorChange() { }
-    validate(control) {
-        const value = control.value;
-        let result = null;
-        if (this.required &&
-            !hasValue(value) &&
-            !exists(this.latitudeValue) &&
-            !exists(this.longitudeValue)) {
-            result = result || {};
-            result.required = { value, reason: 'Required field.' };
-        }
-        if (!exists(this.latitudeValue) && exists(this.longitudeValue)) {
-            result = result || {};
-            result.existsLatitude = {
-                value,
-                reason: 'Latitude not specified.'
-            };
-        }
-        if (exists(this.latitudeValue) && !exists(this.longitudeValue)) {
-            result = result || {};
-            result.existsLongitude = {
-                value,
-                reason: 'Longitude not specified.'
-            };
-        }
-        if (exists(this.minLatitude) && this.latitudeValue < this.minLatitude) {
-            result = result || {};
-            result.minLatitude = {
-                value,
-                min: this.minLatitude,
-                reason: `Latitude is lower than minimum value: ${this.minLatitude}.`
-            };
-        }
-        if (exists(this.maxLatitude) && this.latitudeValue > this.maxLatitude) {
-            result = result || {};
-            result.maxLatitude = {
-                value,
-                max: this.maxLatitude,
-                reason: `Latitude is higher than maximum value: ${this.maxLatitude}.`
-            };
-        }
-        if (exists(this.minLongitude) && this.longitudeValue < this.minLongitude) {
-            result = result || {};
-            result.minLongitude = {
-                value,
-                min: this.minLongitude,
-                reason: `Longitude is lower than minimum value: ${this.minLongitude}.`
-            };
-        }
-        if (exists(this.maxLongitude) && this.longitudeValue > this.maxLongitude) {
-            result = result || {};
-            result.maxLongitude = {
-                value,
-                max: this.maxLongitude,
-                reason: `Longitude is higher than maximum value: ${this.maxLongitude}.`
-            };
-        }
-        this.lastErrors = result;
-        return result;
-    }
-    // End of Validator interface
-    ngOnInit() {
-        this.inputId = this.inputId
-            ? this.inputId
-            : `geolocation$${GeolocationComponent.idCounter++}`;
-        this.setPatterns();
-    }
-    roundToStepAndUpdateLatitudeAndLongitude(newLatitudeAndLongitude) {
-        const newLatitude = roundToMultipleOf(newLatitudeAndLongitude[1], this.step);
-        const newLongitude = roundToMultipleOf(newLatitudeAndLongitude[0], this.step);
-        if (this.disabled || this.readonly) {
-            return;
-        }
-        if (!exists(newLatitudeAndLongitude)) {
-            this.value = null;
-        }
-        this.value = {
-            type: 'Point',
-            coordinates: [newLongitude, newLatitude]
-        };
-    }
-    onLostFocus() {
-        this.markAsTouched();
-    }
-    onEventLatitude(newLatitude) {
-        if (this.disabled || this.readonly) {
-            return;
-        }
-        const newLatitudeValue = isValidNumber(newLatitude) ? +newLatitude : null;
-        if (!(exists(this.value) && exists(this.value.coordinates[0])) &&
-            !exists(newLatitudeValue)) {
-            this.value = null;
-        }
-        else {
-            this.value = {
-                type: 'Point',
-                coordinates: [
-                    this.value ? this.value.coordinates[0] : undefined,
-                    newLatitudeValue
-                ]
-            };
-        }
-        this.markAsTouched();
-    }
-    onEventLongitude(newLongitude) {
-        if (this.disabled || this.readonly) {
-            return;
-        }
-        const newLongitudeValue = isValidNumber(newLongitude)
-            ? +newLongitude
-            : null;
-        if (!exists(newLongitudeValue) &&
-            !(exists(this.value) && exists(this._value.coordinates[1]))) {
-            this.value = null;
-        }
-        else {
-            this.value = {
-                type: 'Point',
-                coordinates: [
-                    newLongitudeValue,
-                    this.value ? this.value.coordinates[1] : undefined
-                ]
-            };
-        }
-        this.markAsTouched();
-    }
-    onKeyPress(event) {
-        this.keyPress.emit(event);
-    }
-    checkClassName() {
-        return this.disabled
-            ? this.readonly
-                ? 'disabled readonly'
-                : 'disabled'
-            : this.readonly
-                ? 'readonly'
-                : '';
-    }
-    openModalMap(modal) {
-        this.modalService.open(modal).result.then((result) => {
-            if (result !== 'cancel') {
-                this.roundToStepAndUpdateLatitudeAndLongitude(result);
-            }
-        }, (_) => { });
-    }
-    onSearchLocationChanged(newValue, map) {
-        map.markerPoint = newValue;
-        map.center = map.markerPoint;
-    }
-    get mapTitle() {
-        return this._disabled || !!this.readonly
-            ? this.i18n[this.lang].location
-            : this.i18n[this.lang].selectLocation;
-    }
-    get self() {
-        return this;
-    }
-    getLabels(instance, keys) {
-        return instance.locationService.getLabels(instance.locationService, keys);
-    }
-    getData(instance, search) {
-        return instance.locationService.getData(instance.locationService, search);
-    }
-    setPatterns() {
-        this.step = this.step || 0.00001; // 0.00001 degrees = 1.11 meters
-        this.zoom = this.zoom || 18; // (360/2^18) degrees ~ 0.00137 degrees ~ 153 meters
-        this.minLatitude = this.minLatitude || -90;
-        this.maxLatitude = this.maxLatitude || +90;
-        this.minLongitude = this.minLongitude || -180;
-        this.maxLongitude = this.maxLongitude || +180;
-    }
-}
-GeolocationComponent.idCounter = 0;
-GeolocationComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'lux-geolocation',
-                template: "<input\n  #latitude\n  class=\"rounded-left prefix\"\n  [ngClass]=\"className\"\n  type=\"number\"\n  [id]=\"inputId + '$latitude'\"\n  [(ngModel)]=\"latitudeValue\"\n  [attr.aria-label]=\"ariaLabel\"\n  [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n  [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n  [attr.min]=\"\n    minLatitude !== undefined && minLatitude !== null\n      ? minLatitude.toString()\n      : undefined\n  \"\n  [attr.max]=\"\n    maxLatitude !== undefined && maxLatitude !== null\n      ? maxLatitude.toString()\n      : undefined\n  \"\n  [attr.step]=\"\n    step !== undefined && step !== null ? step.toString() : undefined\n  \"\n  [placeholder]=\"i18n[lang].lat\"\n  (keyup)=\"onEventLatitude(latitude.value)\"\n  (change)=\"onEventLatitude(latitude.value)\"\n  (keypress)=\"onKeyPress($event)\"\n  (blur)=\"onLostFocus()\"\n/>\n<div\n  class=\"infix symbol clickable\"\n  [ngClass]=\"className\"\n  (click)=\"openModalMap(modalMap)\">\n  <span *ngIf=\"isValidNumber(latitudeValue) && latitudeValue >= 0\">{{\n    i18n[lang].cardinalPoints.north\n  }}</span>\n  <span *ngIf=\"isValidNumber(latitudeValue) && latitudeValue < 0\">{{\n    i18n[lang].cardinalPoints.south\n  }}</span>\n  <span *ngIf=\"!isValidNumber(latitudeValue)\" class=\"icon-globe\"></span>\n</div>\n<input\n  #longitude\n  class=\"prefix\"\n  [ngClass]=\"className\"\n  type=\"number\"\n  [id]=\"inputId + '$longitude'\"\n  [(ngModel)]=\"longitudeValue\"\n  [attr.aria-label]=\"ariaLabel\"\n  [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n  [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n  [attr.min]=\"\n    minLongitude !== undefined && minLongitude !== null\n      ? minLongitude.toString()\n      : undefined\n  \"\n  [attr.max]=\"\n    maxLongitude !== undefined && maxLongitude !== null\n      ? maxLongitude.toString()\n      : undefined\n  \"\n  [attr.step]=\"\n    step !== undefined && step !== null ? step.toString() : undefined\n  \"\n  [placeholder]=\"i18n[lang].lon\"\n  (keyup)=\"onEventLongitude(longitude.value)\"\n  (change)=\"onEventLongitude(longitude.value)\"\n  (keypress)=\"onKeyPress($event)\"\n  (blur)=\"onLostFocus()\"\n/>\n<div\n  [class]=\"\n    disabled || readonly\n      ? 'clickable rounded-right postfix symbol'\n      : 'clickable postfix symbol'\n  \"\n  [ngClass]=\"className\"\n  (click)=\"openModalMap(modalMap)\"\n>\n  <span *ngIf=\"isValidNumber(longitudeValue) && longitudeValue >= 0\">{{\n    i18n[lang].cardinalPoints.east\n  }}</span>\n  <span *ngIf=\"isValidNumber(longitudeValue) && longitudeValue < 0\">{{\n    i18n[lang].cardinalPoints.west\n  }}</span>\n  <span *ngIf=\"!isValidNumber(longitudeValue)\" class=\"icon-globe\"></span>\n</div>\n<button\n  #clearButton\n  *ngIf=\"!(disabled || readonly)\"\n  class=\"rounded-right postfix bordered icon icon-clear\"\n  [id]=\"inputId + '$clear'\"\n  type=\"button\"\n  (click)=\"clear()\"\n  aria-label=\"clear\"\n></button>\n\n<div *ngIf=\"inlineErrors && lastErrors && (dirty || touched)\" class=\"alert\">\n  <div *ngIf=\"lastErrors.required\">\n    {{ i18n[lang].userErrors.required }}\n  </div>\n  <div *ngIf=\"lastErrors.minLatitude\">\n    {{\n      i18n[lang].userErrors.minLatitude.replace(\n        '$minLatitude',\n        lastErrors.minLatitude.min\n      )\n    }}\n  </div>\n  <div *ngIf=\"lastErrors.maxLatitude\">\n    {{\n      i18n[lang].userErrors.maxLatitude.replace(\n        '$maxLatitude',\n        lastErrors.maxLatitude.max\n      )\n    }}\n  </div>\n  <div *ngIf=\"lastErrors.minLongitude\">\n    {{\n      i18n[lang].userErrors.minLongitude.replace(\n        '$minLongitude',\n        lastErrors.minLongitude.min\n      )\n    }}\n  </div>\n  <div *ngIf=\"lastErrors.maxLongitude\">\n    {{\n      i18n[lang].userErrors.maxLongitude.replace(\n        '$maxLongitude',\n        lastErrors.maxLongitude.max\n      )\n    }}\n  </div>\n</div>\n\n<ng-template #modalMap let-modal>\n  <div class=\"lux-modal-header\">\n    <h4 class=\"modal-title\" id=\"modal-basic-title\">{{ mapTitle }}</h4>\n    <button\n      type=\"button\"\n      class=\"close\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss('Cross click')\"\n    >\n      <span aria-hidden=\"true\">\u00D7</span>\n    </button>\n  </div>\n  <div class=\"lux-modal-body content\">\n    <lux-autocomplete\n      #searchBar\n      [attr.aria-label]=\"i18n[lang].typeToSearch\"\n      [placeholder]=\"i18n[lang].typeToSearch\"\n      *ngIf=\"!disabled && !readonly\"\n      [instance]=\"self\"\n      [resolveLabelsFunction]=\"getLabels\"\n      [populateFunction]=\"getData\"\n      (valueChange)=\"onSearchLocationChanged(searchBar.value, map)\"\n    ></lux-autocomplete>\n    <div class=\"map-container\">\n      <lux-map\n        #map\n        [center]=\"value\"\n        [markerPoint]=\"value\"\n        [zoom]=\"zoom\"\n        [readonly]=\"readonly === true || disabled === true ? true : false\"\n      ></lux-map>\n    </div>\n  </div>\n  <div class=\"lux-modal-footer\">\n    <button\n      *ngIf=\"disabled || readonly\"\n      type=\"button\"\n      class=\"btn btn-cancel\"\n      (click)=\"modal.close('cancel')\"\n    >\n      {{ i18n[lang].closeAction }}\n    </button>\n    <button\n      *ngIf=\"!disabled && !readonly\"\n      type=\"button\"\n      class=\"btn btn-cancel\"\n      (click)=\"modal.close('cancel')\"\n    >\n      {{ i18n[lang].cancelAction }}\n    </button>\n    <button\n      *ngIf=\"!disabled && !readonly\"\n      type=\"button\"\n      class=\"btn btn-select\"\n      (click)=\"modal.close(map.markerPoint.coordinates)\"\n    >\n      {{ i18n[lang].selectAction }}\n    </button>\n  </div>\n</ng-template>\n",
-                providers: [
-                    {
-                        provide: NG_VALUE_ACCESSOR,
-                        multi: true,
-                        useExisting: forwardRef(() => GeolocationComponent)
-                    },
-                    {
-                        provide: NG_VALIDATORS,
-                        multi: true,
-                        useExisting: forwardRef(() => GeolocationComponent)
-                    }
-                ],
-                styles: [":focus{z-index:1}input,select,textarea{border:1px solid #495057;border:var(--lux-input-border, 1px solid) var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color:default;color:var(--lux-symbol-color, default);text-align:center;white-space:nowrap;background:default;background:var(--lux-symbol-background, default);font-size:1rem;font-size:var(--lux-symbol-font-size, 1rem)}.bordered,.symbol{border:1px solid #495057;border:var(--lux-input-border, 1px solid) var(--lux-input-border-color, #495057)}.rounded,.rounded-right,.rounded-middle,.rounded-left{border-radius:.25rem;border-radius:var(--lux-border-radius, .25rem)}.rounded-left{border-top-right-radius:0;border-bottom-right-radius:0}.rounded-middle{border-radius:0}.rounded-right{border-top-left-radius:0;border-bottom-left-radius:0}.prefix{border-right:none}.infix{border-left:none;border-right:none}.postfix{border-left:none;display:flex;align-items:center}:host{display:flex;align-items:stretch}.btn-select{color:#fff;background-color:#4242d1;margin-left:2rem}.btn-cancel{color:#fff;background-color:#c22929}.readonly{border:none}.readonly:focus{border:none;outline:none}.disabled{background-color:#f1f1f1;background-color:var(--lux-disabled-color, #f1f1f1);border-color:#6d6d6d;border-color:var(--lux-disabled-border-color, #6d6d6d)}.icon,.icon-clear,.icon-globe{display:inline-block;background-size:1rem 1rem;background-position:center;background-repeat:no-repeat;min-width:1rem;min-height:1rem;width:1.5rem;width:var(--lux-autocomplete-icon-width, 1.5rem);z-index:1}.clickable{cursor:pointer}.icon-globe{background:url(/assets/img/globe.svg) no-repeat center;background:var(--lux-autocomplete-icon-globe, url(/assets/img/globe.svg) no-repeat center);background-size:1rem;height:100%}.icon-clear{width:1.5rem;width:var(--lux-autocomplete-icon-width, 1.5rem);background:url(/assets/img/filter-clear.png) no-repeat center;background:var(--lux-autocomplete-icon-clear, url(/assets/img/filter-clear.png) no-repeat center);background-size:.5rem .5rem;background-size:var(--lux-autocomplete-icon-bg-size, .5rem .5rem);z-index:1}.lux-modal-body{padding:0}.map-container{height:45vh;height:var(--lux-geolocation-map-height, 45vh);width:90vw;width:var(--lux-geolocation-map-width, 90vw)}\n"]
-            },] }
-];
-GeolocationComponent.ctorParameters = () => [
-    { type: ModalService },
-    { type: GeolocationService }
-];
-GeolocationComponent.propDecorators = {
-    latitude: [{ type: ViewChild, args: ['latitude', { static: true },] }],
-    longitude: [{ type: ViewChild, args: ['longitude', { static: true },] }],
-    map: [{ type: ViewChild, args: ['map', { static: false },] }],
-    minLatitude: [{ type: Input }],
-    maxLatitude: [{ type: Input }],
-    minLongitude: [{ type: Input }],
-    maxLongitude: [{ type: Input }],
-    step: [{ type: Input }],
-    zoom: [{ type: Input }],
-    lang: [{ type: Input }],
-    inlineErrors: [{ type: Input }],
-    inputId: [{ type: Input }],
-    ariaLabel: [{ type: Input, args: ['aria-label',] }],
-    readonly: [{ type: Input }],
-    disabled: [{ type: Input }],
-    required: [{ type: Input }],
-    value: [{ type: Input }],
-    valueChange: [{ type: Output }],
-    keyPress: [{ type: Output }]
-};
-
-var Placement;
-(function (Placement) {
-    Placement["Top"] = "top";
-    Placement["Bottom"] = "bottom";
-    Placement["Left"] = "left";
-    Placement["Right"] = "right";
-})(Placement || (Placement = {}));
-
-/**
- * Default Tooltip Component
- */
-class TooltipComponent {
-    constructor() { }
-}
-TooltipComponent.decorators = [
-    { type: Component, args: [{
-                template: `
-        <span class="lux-tooltip" style="transition: opacity 200ms">{{context.message}}</span>
-    `
-            },] }
-];
-TooltipComponent.ctorParameters = () => [];
-TooltipComponent.propDecorators = {
-    context: [{ type: Input }]
-};
-
-class TooltipContentRef {
-    constructor(viewRef, componentRef) {
-        this.viewRef = viewRef;
-        this.componentRef = componentRef;
-    }
-}
-
-class TooltipService {
-    constructor(_injector, _crf, _applicationRef) {
-        this._injector = _injector;
-        this._crf = _crf;
-        this._applicationRef = _applicationRef;
-    }
-    appendComponentToBody(content, elHost, placement) {
-        const tooltipContentRef = this.getTooltipContentRef(content);
-        if (tooltipContentRef) {
-            let domElem = tooltipContentRef.viewRef
-                .rootNodes[0];
-            document.body.appendChild(domElem);
-            if (tooltipContentRef.componentRef) {
-                tooltipContentRef.componentRef.changeDetectorRef.detectChanges();
-            }
-            domElem = this.setStyle(domElem, placement);
-            domElem = this.setPosition(domElem, elHost, placement);
-            return tooltipContentRef;
-        }
-        return null;
-    }
-    removeComponentFromBody(tooltipContentRef) {
-        this._applicationRef.detachView(tooltipContentRef.viewRef);
-        if (tooltipContentRef.componentRef) {
-            tooltipContentRef.componentRef.destroy();
-        }
-    }
-    getTooltipContentRef(content) {
-        if (!content) {
-            // nothing to show
-        }
-        else if (content instanceof TemplateRef) {
-            return this.createFromTemplateRef(content);
-        }
-        else if (typeof content === 'string') {
-            return this.createFromComponent(TooltipComponent, { message: content });
-        }
-        else {
-            return this.createFromComponent(content);
-        }
-    }
-    createFromTemplateRef(content) {
-        const viewRef = content.createEmbeddedView({});
-        this._applicationRef.attachView(viewRef);
-        return new TooltipContentRef(viewRef);
-    }
-    createFromComponent(component, context) {
-        const componentRef = this._crf
-            .resolveComponentFactory(component)
-            .create(this._injector);
-        if (context) {
-            componentRef.instance.context = context;
-        }
-        this._applicationRef.attachView(componentRef.hostView);
-        return new TooltipContentRef(componentRef.hostView, componentRef);
-    }
-    setStyle(domElem, placement) {
-        domElem.style.position = 'absolute';
-        domElem.style.minWidth = 'min-content';
-        domElem.style.minHeight = 'min-content';
-        const tooltipElement = this.getTooltipElementFromHTMLElemnt(domElem);
-        placement =
-            placement !== undefined
-                ? placement.toLocaleLowerCase()
-                : 'top'; // 'Top' is the default value of placement
-        tooltipElement.classList.add(`lux-tooltip-${placement}`);
-        tooltipElement.classList.add('lux-tooltip-show');
-        return domElem;
-    }
-    getTooltipElementFromHTMLElemnt(domElem) {
-        const elementsArray = Array.from(domElem.classList).filter((className) => className === 'lux-tooltip');
-        if (elementsArray.length !== 0) {
-            return domElem;
-        }
-        else if (domElem.hasChildNodes()) {
-            const childrenArray = Array.from(domElem.children).filter((child) => this.getTooltipElementFromHTMLElemnt(child) !== null);
-            if (childrenArray.length !== 0) {
-                return this.getTooltipElementFromHTMLElemnt(childrenArray[0]);
-            }
-            else {
-                return null;
-            }
-        }
-        else {
-            return null;
-        }
-    }
-    setPosition(domElem, elHost, placement) {
-        const hostPos = elHost.nativeElement.getBoundingClientRect();
-        const tooltipPos = domElem.getBoundingClientRect();
-        const scrollPos = window.pageYOffset ||
-            document.documentElement.scrollTop ||
-            document.body.scrollTop ||
-            0;
-        let top = 0;
-        let left = 0;
-        const offset = 10;
-        switch (placement) {
-            case Placement.Bottom:
-                top = hostPos.bottom + offset;
-                left = hostPos.left + (hostPos.width - tooltipPos.width) / 2;
-                break;
-            case Placement.Left:
-                top = hostPos.top + (hostPos.height - tooltipPos.height) / 2;
-                left = hostPos.left - tooltipPos.width - offset;
-                break;
-            case Placement.Right:
-                top = hostPos.top + (hostPos.height - tooltipPos.height) / 2;
-                left = hostPos.right + offset;
-                break;
-            case Placement.Top:
-            default:
-                top = hostPos.top - tooltipPos.height - offset;
-                left = hostPos.left + (hostPos.width - tooltipPos.width) / 2;
-                break;
-        }
-        top = Math.max(0, top);
-        left = Math.max(0, left);
-        domElem.style.top = `${top + scrollPos}px`;
-        domElem.style.left = `${left}px`;
-        return domElem;
-    }
-}
-TooltipService.decorators = [
-    { type: Injectable }
-];
-TooltipService.ctorParameters = () => [
-    { type: Injector },
-    { type: ComponentFactoryResolver },
-    { type: ApplicationRef }
-];
-
-/**
- * Tooltip directive
- */
-class LuxTooltipDirective {
-    constructor(elHost, tooltipService) {
-        this.elHost = elHost;
-        this.tooltipService = tooltipService;
-    }
-    onMouseEnter() {
-        if (!this.tooltipRef) {
-            this.tooltipRef = this.show(this.content, this.elHost, this.placement);
-        }
-    }
-    onMouseLeave() {
-        if (this.tooltipRef) {
-            this.remove(this.tooltipRef);
-            this.tooltipRef = null;
-        }
-    }
-    onClick() {
-        if (this.tooltipRef) {
-            this.remove(this.tooltipRef);
-            this.tooltipRef = null;
-        }
-    }
-    show(component, elHost, placement) {
-        return this.tooltipService.appendComponentToBody(component, elHost, placement);
-    }
-    remove(tooltipRef) {
-        this.tooltipService.removeComponentFromBody(tooltipRef);
-    }
-}
-LuxTooltipDirective.decorators = [
-    { type: Directive, args: [{
-                selector: '[luxTooltip]'
-            },] }
-];
-LuxTooltipDirective.ctorParameters = () => [
-    { type: ElementRef },
-    { type: TooltipService }
-];
-LuxTooltipDirective.propDecorators = {
-    luxTooltip: [{ type: Input }],
-    content: [{ type: Input }],
-    placement: [{ type: Input }],
-    onMouseEnter: [{ type: HostListener, args: ['mouseenter',] }],
-    onMouseLeave: [{ type: HostListener, args: ['mouseleave',] }],
-    onClick: [{ type: HostListener, args: ['click',] }]
-};
-
-class LuxBreadcrumbComponent {
-    constructor(route, activedRoute) {
-        this.route = route;
-        this.activedRoute = activedRoute;
-        this.subs = [];
-        this.imagePath = '../assets/img/arrow-forward.svg';
-    }
-    ngOnInit() {
-        this.subs.push(this.route.events
-            .pipe(filter((event) => event instanceof NavigationEnd))
-            .subscribe((_) => {
-            this.breadcrumbs = [];
-            this.addBreadcrumbs(this.activedRoute.snapshot.root, true, null);
-        }));
-    }
-    ngOnDestroy() {
-        this.subs.forEach((s) => s.unsubscribe());
-        this.subs = [];
-    }
-    addBreadcrumbs(activedRouteSnapshot, isRoot, urlPrefix) {
-        const routeConfig = activedRouteSnapshot.routeConfig;
-        let url = urlPrefix || '';
-        url += routeConfig ? '/' + this.getUrl(activedRouteSnapshot) : '';
-        const label = routeConfig
-            ? this.getLabel(activedRouteSnapshot)
-            : isRoot
-                ? 'Home'
-                : '';
-        if (label && url !== '/') {
-            const breadcrumb = { label, url };
-            this.breadcrumbs.push(breadcrumb);
-        }
-        if (activedRouteSnapshot.children.length) {
-            this.addBreadcrumbs(activedRouteSnapshot.children[0], false, url);
-        }
-    }
-    getUrl(activedRouteSnapshot) {
-        if (!activedRouteSnapshot.url[0]) {
-            return '';
-        }
-        const id = activedRouteSnapshot.params.id;
-        return id
-            ? `${activedRouteSnapshot.url[0]}/${id}`
-            : activedRouteSnapshot.routeConfig.path || '';
-    }
-    getLabel(activedRouteSnapshot) {
-        const routeConfig = activedRouteSnapshot.routeConfig;
-        if (!routeConfig) {
-            return null;
-        }
-        if (activedRouteSnapshot.data && activedRouteSnapshot.data.title) {
-            const data = activedRouteSnapshot.data;
-            if (data.objectTitle) {
-                return `${data.title} ${data.objectTitle}`;
-            }
-            else {
-                return data.title;
-            }
-        }
-        return activedRouteSnapshot.params.id || routeConfig.path;
-    }
-}
-LuxBreadcrumbComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'lux-breadcrumb',
-                template: "<ul class=\"lux-breadcrumb\">\n  <li *ngFor=\"let breadcrumb of breadcrumbs; last as isLast; first as isFirst\"\n      class=\"lux-breadcrumb-item\">\n    <a [class.first]=\"isFirst\" routerLink=\"{{ breadcrumb.url }}\">{{ breadcrumb.label }}</a>\n    <div *ngIf=\"!isLast\" class=\"lux-breadcrumb-separator\"></div>\n  </li>\n</ul>\n",
-                styles: [".lux-breadcrumb{padding:10px 12px;list-style:none;list-style-type:none}.lux-breadcrumb li{display:inline;font-size:.8em}.lux-breadcrumb li a.first{font-weight:bold}.lux-breadcrumb li+li:before{padding:8px;color:#000}.lux-breadcrumb li a{text-decoration:underline}ol.lux-breadcrumb li a:hover{text-decoration:underline}.lux-breadcrumb a{cursor:hand}.lux-breadcrumb-separator{color:red;position:relative;top:5px;height:16px;padding:0 8px;background-image:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 512 512%22%3E    %3Cpath d%3D%22M294.1 256L167 129c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.3 34 0L345 239c9.1 9.1 9.3 23.7.7 33.1L201.1 417c-4.7 4.7-10.9 7-17 7s-12.3-2.3-17-7c-9.4-9.4-9.4-24.6 0-33.9l127-127.1z%22%2F%3E%3C%2Fsvg%3E\");background-repeat:no-repeat;display:inline-block}\n"]
-            },] }
-];
-LuxBreadcrumbComponent.ctorParameters = () => [
-    { type: Router },
-    { type: ActivatedRoute }
-];
-
-let openLayersIsInstalled = false;
-class OpenLayerLoaderService {
-    load() {
-        if (window.ol) {
-            return of(true);
-        }
-        const openLayerJsUrl = 'https://openlayers.org/en/v5.3.0/build/ol.js';
-        const openLayerCssUrl = 'https://openlayers.org/en/v5.3.0/css/ol.css';
-        if (!openLayersIsInstalled) {
-            openLayersIsInstalled = true; // only try to install it once
-            loadCss(openLayerCssUrl, () => { });
-            return from(new Promise((resolve, _) => {
-                loadScript(openLayerJsUrl, () => resolve(true));
-            }));
-        }
-        return of(true);
-    }
-}
-OpenLayerLoaderService.ɵprov = i0.ɵɵdefineInjectable({ factory: function OpenLayerLoaderService_Factory() { return new OpenLayerLoaderService(); }, token: OpenLayerLoaderService, providedIn: "root" });
-OpenLayerLoaderService.decorators = [
-    { type: Injectable, args: [{ providedIn: 'root' },] }
-];
-/** Dynamically load a script from url and return a callback */
-const loadScript = (url, callback) => {
-    const script = document.createElement('script');
-    script.type = 'text/javascript';
-    if (script.readyState) {
-        // for old IE
-        script.onreadystatechange = () => {
-            if (script.readyState === 'loaded' || script.readyState === 'complete') {
-                script.onreadystatechange = null;
-                callback();
-            }
-        };
-    }
-    else {
-        // Others browsers
-        script.onload = () => {
-            callback();
-        };
-    }
-    script.src = url;
-    document.getElementsByTagName('head')[0].appendChild(script);
-};
-const ɵ0$1 = loadScript;
-/** Dynamically load css from url and return a callback */
-const loadCss = (url, callback) => {
-    const link = document.createElement('link');
-    link.type = 'text/css';
-    link.rel = 'stylesheet';
-    link.type = 'text/javascript';
-    link.href = url;
-    link.onload = () => {
-        callback();
-    };
-    document.getElementsByTagName('head')[0].appendChild(link);
-};
-const ɵ1 = loadCss;
-
-class MapComponent {
-    constructor(olLoader) {
-        this.loaded$ = new BehaviorSubject(false);
-        this.valueChange = new EventEmitter();
-        olLoader.load().subscribe((_) => {
-            // Initialize
-            this._markerSource = new ol.source.Vector();
-            this._markerStyle = new ol.style.Style({
-                image: new ol.style.Icon({
-                    anchor: [0.5, 1],
-                    scale: 0.25,
-                    src: '/assets/img/marker.png'
-                })
-            });
-            this.loaded$.next(true);
-        });
-    }
-    set zoom(zoom) {
-        if (!isNaN(zoom)) {
-            this._zoom = zoom;
-            if (this._map) {
-                this._map.getView().setZoom(zoom);
-            }
-        }
-    }
-    get zoom() {
-        return this._zoom;
-    }
-    set center(center) {
-        if (center && center.coordinates && center.coordinates.length === 2) {
-            this._center = center;
-            if (this._map) {
-                this._map.getView().setCenter(ol.proj.fromLonLat(center.coordinates));
-            }
-        }
-    }
-    get center() {
-        return this._center;
-    }
-    set readonly(readonly) {
-        if (!readonly) {
-            if (this._map) {
-                this._map.on('click', (args) => {
-                    // args.coordinate is in EPSG:3857 (meters), we transform it into EPSG:4326 (degrees)
-                    const coordinates = ol.proj.toLonLat(args.coordinate);
-                    // alternatively: const lonLat = ol.proj.transform(args.coordinate,'EPSG:3857','EPSG:4326');
-                    this.addMarkerAtCoordinates(coordinates);
-                });
-                this._map.on('pointermove', (event) => {
-                    const pixel = this._map.getEventPixel(event.originalEvent);
-                    const hit = this._map.hasFeatureAtPixel(pixel);
-                    this._map.getViewport().style.cursor = hit ? 'move' : 'grab';
-                });
-            }
-        }
-        else {
-            if (this._map) {
-                this._map.on('click', (args) => { });
-                this._map.on('pointermove', (event) => { });
-                this._map.getViewport().style.cursor = 'grab';
-            }
-        }
-        this._readonly = readonly;
-        // reset marker coordinates so marker interactions can be created or recreated accordingly
-        // to the changes to readonly
-        this.markerCoordinates = this.markerCoordinates;
-    }
-    get readonly() {
-        return this._readonly;
-    }
-    set markerCoordinates(markerCoordinates) {
-        if (markerCoordinates && markerCoordinates.length === 2) {
-            this._markerCoordinates = markerCoordinates;
-            if (this._map) {
-                this.addMarkerAtCoordinates(markerCoordinates);
-            }
-        }
-        else {
-            this._markerCoordinates = undefined;
-            if (this._map) {
-                this.removeMarker();
-            }
-        }
-    }
-    get markerCoordinates() {
-        return this._markerCoordinates;
-    }
-    set markerPoint(markerPoint) {
-        if (!markerPoint ||
-            !(markerPoint.coordinates && markerPoint.coordinates.length === 2)) {
-            this.markerCoordinates = undefined;
-        }
-        else {
-            this.markerCoordinates = [
-                +markerPoint.coordinates[0],
-                +markerPoint.coordinates[1]
-            ];
-        }
-        this.valueChange.emit(markerPoint);
-    }
-    get markerPoint() {
-        return {
-            type: 'Point',
-            coordinates: this.markerCoordinates
-        };
-    }
-    ngOnInit() {
-        this.mapId = this.mapId ? this.mapId : 'map' + MapComponent.idCounter++;
-    }
-    ngAfterViewInit() {
-        this.loaded$.subscribe((loaded) => {
-            if (loaded) {
-                this.initMap();
-            }
-        });
-    }
-    initMap() {
-        this._map = new ol.Map({
-            target: this.mapId,
-            controls: ol.control.defaults({ attribution: false }),
-            layers: [
-                new ol.layer.Tile({
-                    source: new ol.source.OSM()
-                }),
-                new ol.layer.Vector({
-                    source: this._markerSource,
-                    style: this._markerStyle
-                })
-            ],
-            view: new ol.View({
-                center: ol.proj.fromLonLat(this.center !== undefined ? this.center.coordinates : [0, 0]),
-                zoom: this.zoom
-            })
-        });
-        if (this.center === undefined || this.center === null) {
-            // if the center is not set, we set its default value
-            if ('geolocation' in navigator) {
-                navigator.geolocation.getCurrentPosition((position) => {
-                    this.center = {
-                        type: 'Point',
-                        coordinates: [position.coords.longitude, position.coords.latitude]
-                    };
-                }, (error) => {
-                    this.center = {
-                        type: 'Point',
-                        coordinates: [0, 0]
-                    };
-                });
-            }
-            else {
-                this.center = {
-                    type: 'Point',
-                    coordinates: [0, 0]
-                };
-            }
-        }
-        else {
-            // the center needs the map to be properly set, so if it was set before the map was initialized,
-            // we set the center again to perform necessary adjustements
-            this.center = this.center;
-        }
-        if (this.zoom === undefined || this.zoom === null) {
-            // if the zoom is not set, we set its default value
-            this.zoom = 18;
-        }
-        else {
-            // the zoom needs the map to be properly set, so if it was set before the map was initialized,
-            // we set the zoom again to perform necessary adjustements
-            this.zoom = this.zoom;
-        }
-        if (this.readonly === undefined || this.readonly === null) {
-            // if readonly is not set, we set its default value
-            this.readonly = false;
-        }
-        else {
-            // readonly needs the map to be properly set, so if it was set before the map was initialized,
-            // we set readonly again to perform necessary adjustements
-            this.readonly = this.readonly;
-        }
-        if (this.markerCoordinates !== undefined &&
-            this.markerCoordinates !== null) {
-            // the marker coordinates need the map to be properly set, so if they were set before the map was initialized,
-            // we set the marker coordinates again to perform necessary adjustements
-            this.markerCoordinates = this.markerCoordinates;
-        }
-    }
-    addMarkerAtCoordinates(coordinates) {
-        if (coordinates && coordinates.length === 2) {
-            if (this._marker !== undefined) {
-                this.removeMarker();
-            }
-            this._marker = new ol.Feature({
-                geometry: new ol.geom.Point(
-                // [lon, lat] is in EPSG:4326 (degrees), we transform it into EPSG:3857 (meters)
-                ol.proj.transform(coordinates, 'EPSG:4326', 'EPSG:3857'))
-            });
-            this._markerSource.addFeature(this._marker);
-            this._markerCoordinates = this.getMarkerCoordinates();
-            if (!this.readonly) {
-                const dragInteraction = new ol.interaction.Modify({
-                    features: new ol.Collection([this._marker]),
-                    style: this._markerStyle,
-                    pixelTolerance: 50,
-                    hitDetection: true
-                });
-                this._markerInteraction = dragInteraction;
-                this._map.addInteraction(dragInteraction);
-            }
-            this._marker.on('change', () => {
-                this._markerCoordinates = this.getMarkerCoordinates();
-            }, this._marker);
-        }
-    }
-    removeMarker() {
-        if (this._marker !== undefined) {
-            this._markerSource.removeFeature(this._marker);
-            this._marker = undefined;
-        }
-        if (this._markerInteraction !== undefined) {
-            this._map.getInteractions().pop();
-            this._markerInteraction = undefined;
-        }
-    }
-    getMarkerCoordinates() {
-        if (this._marker === undefined || this._marker == null) {
-            return this._marker;
-        }
-        const coordinates = this._marker.getGeometry().getCoordinates();
-        // coordinates is in EPSG:3857 (meters), we transform it into EPSG:4326 (degrees)
-        return ol.proj.transform(coordinates, 'EPSG:3857', 'EPSG:4326');
-    }
-    onResize() {
-        if (this._map) {
-            this._map.updateSize();
-        }
-    }
-}
-MapComponent.idCounter = 0;
-MapComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'lux-map',
-                template: "<div [id]=\"mapId\" class=\"map\" (resized)=\"onResize()\"></div>\n",
-                styles: [".map{min-height:100px;height:100%;min-width:160px;width:100%}\n"]
-            },] }
-];
-MapComponent.ctorParameters = () => [
-    { type: OpenLayerLoaderService }
-];
-MapComponent.propDecorators = {
-    mapId: [{ type: Input }],
-    zoom: [{ type: Input }],
-    center: [{ type: Input }],
-    readonly: [{ type: Input }],
-    markerCoordinates: [{ type: Input }],
-    markerPoint: [{ type: Input }],
-    valueChange: [{ type: Output }]
-};
-
-class PaginationComponent {
-    constructor() {
-        this.literals = {
-            en: {
-                first: 'First',
-                previous: 'Previous',
-                next: 'Next',
-                last: 'Last'
-            },
-            es: {
-                first: 'Primero',
-                previous: 'Anterior',
-                next: 'Siguiente',
-                last: 'Último'
-            }
-        };
-        this.showPagination = false;
-        this.hidePrevious = false;
-        this.lastPage = false;
-        this.totalPages = 0;
-        this.displayNextEllipsis = false;
-        this.displayPreviousEllipsis = false;
-        this.pages = [];
-        this.goToPage = new EventEmitter();
-        this.pageSizeChange = new EventEmitter();
-        this.lang = languageDetector();
-    }
-    set lang(l) {
-        if (l === this._lang) {
-            return;
-        }
-        if (Object.keys(this.literals).includes(l)) {
-            this._lang = l;
-        }
-        else {
-            this._lang = 'en';
-        }
-        this.loadLanguage();
-    }
-    get lang() {
-        return this._lang;
-    }
-    set paginationInfo(value) {
-        this.paginationInfoValue = value;
-        this.syncState();
-    }
-    get paginationInfo() {
-        return this.paginationInfoValue;
-    }
-    ngOnInit() {
-        this.calculatePages();
-    }
-    pageSizeChanged(pageSize) {
-        this.paginationInfo.pageSize = pageSize;
-        this.syncState();
-        this.pageSizeChange.emit(pageSize);
-    }
-    onPage(n) {
-        this.goToPage.emit(n);
-    }
-    onFirst() {
-        this.goToPage.emit(0);
-    }
-    onLast() {
-        this.goToPage.emit(this.totalPages - 1);
-    }
-    onNext() {
-        const page = (this.paginationInfo.page || 0) + 1;
-        this.goToPage.emit(page);
-    }
-    onPrevious() {
-        const page = (this.paginationInfo.page || 0) - 1;
-        this.goToPage.emit(page);
-    }
-    syncState() {
-        this.pages = this.calculatePages();
-        this.showPagination =
-            this.paginationInfo.total > this.paginationInfo.pageSize;
-        this.hidePrevious = this.paginationInfo.page === 0;
-        this.lastPage =
-            this.paginationInfo.pageSize * (this.paginationInfo.page + 1) >=
-                this.paginationInfo.total;
-        this.totalPages =
-            Math.ceil(this.paginationInfo.total / this.paginationInfo.pageSize) || 0;
-        this.displayNextEllipsis = !this.pages.includes(this.totalPages - 1);
-        this.displayPreviousEllipsis = !this.pages.includes(0);
-    }
-    calculatePages() {
-        const totalPages = Math.ceil(this.paginationInfo.total / this.paginationInfo.pageSize) - 1; // 0-index
-        const p = this.paginationInfo.page || 0;
-        const pagesToShow = this.paginationInfo.pagesToShow;
-        const pages = [];
-        pages.push(p);
-        const times = pagesToShow - 1;
-        for (let i = 0; i < times; i++) {
-            if (pages.length < pagesToShow) {
-                if (Math.min(...pages) > 0) {
-                    pages.unshift(Math.min(...pages) - 1);
-                }
-            }
-            if (pages.length < pagesToShow) {
-                if (Math.max(...pages) < totalPages) {
-                    pages.push(Math.max(...pages) + 1);
-                }
-            }
-        }
-        pages.sort((a, b) => a - b);
-        return pages;
-    }
-    loadLanguage() {
-        const l = this.literals[this.lang];
-        this.first = l.first;
-        this.previous = l.previous;
-        this.next = l.next;
-        this.last = l.last;
-    }
-}
-PaginationComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'lux-pagination',
-                template: "<div class=\"lux-pagination\" *ngIf=\"showPagination\">\n  <ng-container *ngIf=\"!hidePrevious\">\n    <a\n      luxTooltip\n      [content]=\"first\"\n      placement=\"top\"\n      delay=\"500\"\n      (click)=\"onFirst()\"\n      [ngClass]=\"{\n        enabledFirstLast: !hidePrevious\n      }\"\n      class=\"button-pagination icon arrow-left-end\"\n    ></a>\n    <a\n      luxTooltip\n      [content]=\"previous\"\n      placement=\"top\"\n      delay=\"500\"\n      (click)=\"onPrevious()\"\n      [ngClass]=\"{\n        enabledFirstLast: !hidePrevious\n      }\"\n      class=\"button-pagination icon arrow-left\"\n    ></a>\n  </ng-container>\n\n  <span class=\"ellipsis\" *ngIf=\"displayPreviousEllipsis\">...</span>\n\n  <ng-container *ngFor=\"let pageNum of pages\">\n    <a\n      placement=\"top\"\n      delay=\"500\"\n      [ngClass]=\"{\n        disabled: pageNum === paginationInfo.page,\n        enabled: pageNum !== paginationInfo.page\n      }\"\n      class=\"button-pagination\"\n      (click)=\"onPage(pageNum)\"\n      >{{ pageNum + 1 }}</a\n    >\n  </ng-container>\n\n  <span class=\"ellipsis\" *ngIf=\"displayNextEllipsis\">...</span>\n\n  <ng-container *ngIf=\"!lastPage\">\n    <a\n      luxTooltip\n      [content]=\"next\"\n      placement=\"top\"\n      delay=\"500\"\n      (click)=\"onNext()\"\n      [ngClass]=\"{\n        enabledFirstLast: !lastPage\n      }\"\n      class=\"button-pagination icon arrow-right\"\n    ></a>\n    <a\n      luxTooltip\n      [content]=\"last\"\n      placement=\"top\"\n      delay=\"500\"\n      (click)=\"onLast()\"\n      [ngClass]=\"{\n        enabledFirstLast: !lastPage\n      }\"\n      class=\"button-pagination icon arrow-right-end\"\n    ></a>\n  </ng-container>\n</div>\n",
-                styles: [":focus{z-index:1}input,select,textarea{border:1px solid #495057;border:var(--lux-input-border, 1px solid) var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color:default;color:var(--lux-symbol-color, default);text-align:center;white-space:nowrap;background:default;background:var(--lux-symbol-background, default);font-size:1rem;font-size:var(--lux-symbol-font-size, 1rem)}.bordered,.symbol{border:1px solid #495057;border:var(--lux-input-border, 1px solid) var(--lux-input-border-color, #495057)}.rounded,.rounded-right,.rounded-middle,.rounded-left{border-radius:.25rem;border-radius:var(--lux-border-radius, .25rem)}.rounded-left{border-top-right-radius:0;border-bottom-right-radius:0}.rounded-middle{border-radius:0}.rounded-right{border-top-left-radius:0;border-bottom-left-radius:0}.prefix{border-right:none}.infix{border-left:none;border-right:none}.postfix{border-left:none;display:flex;align-items:center}.lux-pagination{display:flex;flex-direction:row;margin:2% 0;width:100%;background:white;align-items:center}.disabled{cursor:not-allowed;border:1px solid #325c81;border:var(--lux-pagination-disabled-border, 1px solid #325c81);border-radius:10%;border-radius:var(--lux-pagination-disabled-border-radius, 10%);padding:1%;margin:0 .7%;color:#fff;color:var(--lux-pagination-disabled-color, white);background-color:#325c81;background-color:var(--lux-pagination-disabled-background-color, #325c81);text-decoration:none;pointer-events:none}.enabled{border:1px solid #cfcfcf;border:var(--lux-pagination-enabled-border, 1px solid #cfcfcf);border-radius:10%;border-radius:var(--lux-pagination-enabled-border-radius, 10%);padding:1%;margin:0 .7%;color:#325c81;color:var(--lux-pagination-enabled-color, #325c81);width:-webkit-min-content;width:-moz-min-content;width:min-content;cursor:pointer}.enabledFirstLast{border:1px solid #cfcfcf;border-radius:10%;padding:1%;color:#325c81;margin:0 .7%;width:-webkit-min-content;width:-moz-min-content;width:min-content;cursor:pointer}.ellipsis{margin:0 .5rem;padding:0;color:#325c81;width:-webkit-min-content;width:-moz-min-content;width:min-content}.button-pagination{width:1em;width:var(--lux-pagination-button-width, 1em);height:1.2em;height:var(--lux-pagination-button-height, 1.2em);font-size:80%;font-size:var(--lux-pagination-font-size, 80%);text-align:center}.icon{background-size:1.3em 1.4em;background-position:center;background-repeat:no-repeat}.arrow-right{background-image:url(\"data:image/svg+xml,%3Csvg width%3D%2268%22 height%3D%2248%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cg%3E  %3Ctitle%3Ebackground%3C%2Ftitle%3E  %3Crect fill%3D%22none%22 id%3D%22canvas_background%22 height%3D%22402%22 width%3D%221082%22 y%3D%22-1%22 x%3D%22-1%22%2F%3E %3C%2Fg%3E %3Cg%3E  %3Ctitle%3ELayer 1%3C%2Ftitle%3E  %3Cpolygon fill%3D%22%23325C81%22 id%3D%22svg_2%22 points%3D%2221.8%2C45.7 10.4%2C44.3 30.8%2C24 10.4%2C3.7 21.8%2C2.3 43.5%2C24  %22%2F%3E %3C%2Fg%3E%3C%2Fsvg%3E\");background-position:.4em}.arrow-left{background-image:url(\"data:image/svg+xml,%3Csvg width%3D%2268%22 height%3D%2248%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cg%3E  %3Ctitle%3Ebackground%3C%2Ftitle%3E  %3Crect fill%3D%22none%22 id%3D%22canvas_background%22 height%3D%22402%22 width%3D%221082%22 y%3D%22-1%22 x%3D%22-1%22%2F%3E %3C%2Fg%3E %3Cg%3E  %3Ctitle%3ELayer 1%3C%2Ftitle%3E  %3Cpolygon fill%3D%22%23325C81%22 id%3D%22svg_2%22 points%3D%2221.8%2C45.7 10.4%2C44.3 30.8%2C24 10.4%2C3.7 21.8%2C2.3 43.5%2C24  %22%2F%3E %3C%2Fg%3E%3C%2Fsvg%3E\");transform:rotate(180deg);background-position:.4em}.arrow-right-end{background-image:url(\"data:image/svg+xml,%3Csvg width%3D%2268%22 height%3D%2248%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cg%3E  %3Ctitle%3Ebackground%3C%2Ftitle%3E  %3Crect fill%3D%22none%22 id%3D%22canvas_background%22 height%3D%22402%22 width%3D%221082%22 y%3D%22-1%22 x%3D%22-1%22%2F%3E %3C%2Fg%3E %3Cg%3E  %3Ctitle%3ELayer 1%3C%2Ftitle%3E  %3Cpolygon fill%3D%22%23325C81%22 id%3D%22svg_2%22 points%3D%2221.8%2C45.7 10.4%2C44.3 30.8%2C24 10.4%2C3.7 21.8%2C2.3 43.5%2C24  %22%2F%3E    %3Cpolygon fill%3D%22%23325C81%22 id%3D%22svg_3%22 points%3D%2241.8%2C45.7 30.4%2C44.3 50.8%2C24 30.4%2C3.7 41.8%2C2.3 63.5%2C24  %22%2F%3E %3C%2Fg%3E%3C%2Fsvg%3E\");background-position:.1em}.arrow-left-end{background-image:url(\"data:image/svg+xml,%3Csvg width%3D%2268%22 height%3D%2248%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cg%3E  %3Ctitle%3Ebackground%3C%2Ftitle%3E  %3Crect fill%3D%22none%22 id%3D%22canvas_background%22 height%3D%22402%22 width%3D%221082%22 y%3D%22-1%22 x%3D%22-1%22%2F%3E %3C%2Fg%3E %3Cg%3E  %3Ctitle%3ELayer 1%3C%2Ftitle%3E  %3Cpolygon fill%3D%22%23325C81%22 id%3D%22svg_2%22 points%3D%2221.8%2C45.7 10.4%2C44.3 30.8%2C24 10.4%2C3.7 21.8%2C2.3 43.5%2C24  %22%2F%3E    %3Cpolygon fill%3D%22%23325C81%22 id%3D%22svg_3%22 points%3D%2241.8%2C45.7 30.4%2C44.3 50.8%2C24 30.4%2C3.7 41.8%2C2.3 63.5%2C24  %22%2F%3E %3C%2Fg%3E%3C%2Fsvg%3E\");background-position:.1em;transform:rotate(180deg)}@media only screen and (min-width: 300px) and (max-width: 500px){.arrow-right{background-position:.2em}.arrow-left{background-position:.2em}.arrow-right-end{background-position:0em}.arrow-left-end{background-position:0em}}@media only screen and (min-width: 500px) and (max-width: 850px){.arrow-right{background-position:.3em}.arrow-left{background-position:.3em}.arrow-right-end{background-position:0em}.arrow-left-end{background-position:0em}}@media only screen and (min-width: 900px){.arrow-right{background-position:.2em}.arrow-left{background-position:.2em}.arrow-right-end{background-position:0em}.arrow-left-end{background-position:0em}}\n"]
-            },] }
-];
-PaginationComponent.ctorParameters = () => [];
-PaginationComponent.propDecorators = {
-    goToPage: [{ type: Output }],
-    pageSizeChange: [{ type: Output }],
-    lang: [{ type: Input }],
-    paginationInfo: [{ type: Input }]
-};
-
-class RadiogroupComponent {
-    constructor() {
-        this.touched = false;
-        this.name = 'radiogroup1';
-        this.disabled = false;
-        this.readonly = false;
-        this.required = false;
-        this.itemsChange = new EventEmitter();
-        this.valueChange = new EventEmitter();
-        this._value = undefined;
-        this._items = [];
-        // ControlValueAccessor Interface
-        this.onChange = (value) => { };
-        this.onTouched = () => { };
-    }
-    set items(col) {
-        this._items = (col || []).map((it, index) => this.ensureHasUniqueName(it, index));
-        this.itemsChange.emit(col);
-    }
-    get items() {
-        return this._items;
-    }
-    set value(v) {
-        if (v === this._value) {
-            return;
-        }
-        const initialAndEmpty = isInitialAndEmpty(this._value, v);
-        this._value = v;
-        this.onChange(v);
-        if (!initialAndEmpty) {
-            this.valueChange.emit(v);
-        }
-    }
-    get value() {
-        return this._value;
-    }
-    writeValue(value) {
-        this.value = value;
-    }
-    registerOnChange(onChange) {
-        this.onChange = onChange;
-    }
-    registerOnTouched(onTouched) {
-        this.onTouched = onTouched;
-    }
-    markAsTouched() {
-        if (!this.touched) {
-            this.onTouched();
-            this.touched = true;
-        }
-    }
-    setDisabledState(disabled) {
-        this.disabled = disabled;
-    }
-    // End ControlValueAccessor Interface
-    // Validator interface
-    registerOnValidatorChange() { }
-    validate(control) {
-        const value = control.value;
-        if (this.required &&
-            (value === '' || value === null || value === undefined)) {
-            return { required: { value, reason: 'Required field.' } };
-        }
-        return null;
-    }
-    // End of Validator interface
-    setValue(event, item) {
-        if (!this.disabled && !this.readonly) {
-            this.value = item.value;
-            this.markAsTouched();
-        }
-        event.preventDefault();
-    }
-    ensureHasUniqueName(item, index) {
-        if (!item.name) {
-            item.name = `${this.name}_${index}`;
-        }
-        return item;
-    }
-}
-RadiogroupComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'lux-radiogroup',
-                template: "<div class=\"radiogroup\"\n    [class.disabled]=\"disabled || readonly\"\n    >\n  <ng-container *ngFor=\"let item of items; let first=first; let last=last\">\n    <div [class.radio-start]=\"first\"\n         [class.radio-end]=\"last\"\n         class=\"radio-item\"\n         [class.selected]=\"item.value === value\"\n         (click)=\"setValue($event, item)\"\n      >\n      <input [id]=\"item.name\"\n             type=\"radio\"\n             [name]=\"name\"\n             [attr.disabled]=\"disabled || null\"\n             [attr.readonly]=\"readonly || null\"\n             [value]=\"item.value\">\n      <label [for]=\"item.name\"\n             class=\"unselectable\"\n             >{{ item.label }}</label>\n  </div>\n</ng-container>\n</div>\n",
-                providers: [
-                    {
-                        provide: NG_VALUE_ACCESSOR,
-                        multi: true,
-                        useExisting: forwardRef(() => RadiogroupComponent)
-                    },
-                    {
-                        provide: NG_VALIDATORS,
-                        multi: true,
-                        useExisting: forwardRef(() => RadiogroupComponent)
-                    }
-                ],
-                styles: [":focus{z-index:1}input,select,textarea{border:1px solid #495057;border:var(--lux-input-border, 1px solid) var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color:default;color:var(--lux-symbol-color, default);text-align:center;white-space:nowrap;background:default;background:var(--lux-symbol-background, default);font-size:1rem;font-size:var(--lux-symbol-font-size, 1rem)}.bordered,.symbol{border:1px solid #495057;border:var(--lux-input-border, 1px solid) var(--lux-input-border-color, #495057)}.rounded,.rounded-right,.rounded-middle,.rounded-left{border-radius:.25rem;border-radius:var(--lux-border-radius, .25rem)}.rounded-left{border-top-right-radius:0;border-bottom-right-radius:0}.rounded-middle{border-radius:0}.rounded-right{border-top-left-radius:0;border-bottom-left-radius:0}.prefix{border-right:none}.infix{border-left:none;border-right:none}.postfix{border-left:none;display:flex;align-items:center}.radiogroup{display:flex}.radio-item{border-radius:0;border:1px solid #ccc;padding:0 .5rem;padding:var(--lux-radiogroup-padding, 0rem .5rem)}.radio-item input{display:none}.radio-item label{color:initial;color:var(--lux-radiogroup-color, initial);font-size:initial;font-size:var(--lux-radiogroup-font-size, initial);margin-top:.3rem;margin-bottom:.3rem}.radio-item.selected{background-color:#2e2eac;background-color:var(--lux-radiogroup-selected-background-color, #2e2eac)}.radio-item.selected label{font-size:initial;font-size:var(--lux-radiogroup-font-size, initial);color:#fff;color:var(--lux-radiogroup-selected-color, white)}.radio-start{border-top-left-radius:.5rem;border-bottom-left-radius:.5rem}.radio-end{border-top-right-radius:.5rem;border-bottom-right-radius:.5rem}.disabled .radio-item{background-color:#f0f0f0;color:#444}.disabled .selected{font-size:initial;font-size:var(--lux-radiogroup-selected-disabled-font-size, initial);color:#fff;color:var(--lux-radiogroup-selected-disabled-color, white);background-color:#9898ec;background-color:var(--lux-radiogroup-selected-disabled-background-color, #9898ec)}.unselectable{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}\n"]
-            },] }
-];
-RadiogroupComponent.ctorParameters = () => [];
-RadiogroupComponent.propDecorators = {
-    name: [{ type: Input }],
-    disabled: [{ type: Input }],
-    readonly: [{ type: Input }],
-    required: [{ type: Input }],
-    items: [{ type: Input }],
-    itemsChange: [{ type: Output }],
-    value: [{ type: Input }],
-    valueChange: [{ type: Output }]
-};
-
-let sequencer = 0;
-class SelectComponent {
-    constructor() {
-        this.id = 'stringList' + sequencer++;
-        this.disabled = false;
-        this.required = false;
-        /** Allow multiple elements */
-        this.multiple = true;
-        this.value = [];
-        this.valueChange = new EventEmitter();
-        this.placeholder = 'Add new';
-        /** If set, check there is no duplicates in the data. */
-        this.unique = true;
-        /** Validation function for new items. Returns error or null if valid */
-        this.validateItem = (_) => null;
-        this.newEntry = '';
-        this.error = null;
-        this.isValidNewEntry = false;
-        this.touched = false;
-        // ControlValueAccessor Interface
-        this.onChange = (value) => { };
-        this.onTouched = () => { };
-    }
-    writeValue(value) {
-        this.value = value;
-    }
-    registerOnChange(onChange) {
-        this.onChange = onChange;
-    }
-    registerOnTouched(onTouched) {
-        this.onTouched = onTouched;
-    }
-    markAsTouched() {
-        if (!this.touched) {
-            this.onTouched();
-            this.touched = true;
-        }
-    }
-    setDisabledState(disabled) {
-        this.disabled = disabled;
-    }
-    // End ControlValueAccessor Interface
-    // Validator interface
-    registerOnValidatorChange() { }
-    validate(control) {
-        const value = control.value;
-        if (this.required &&
-            (value === '' || value === null || value === undefined)) {
-            return { required: { value, reason: 'Required field.' } };
-        }
-        return null;
-    }
-    // End of Validator interface
-    get canAdd() {
-        return this.multiple || this.value.length === 0;
-    }
-    add(val) {
-        this.value.push(val);
-        this.newEntry = '';
-        this.markAsTouched();
-        this.valueChange.emit(this.value);
-    }
-    remove(index) {
-        if (this.value.length > index) {
-            this.value.splice(index, 1);
-            this.markAsTouched();
-            this.valueChange.emit(this.value);
-        }
-    }
-    onKeyPress(event) {
-        if (event.key === 'Enter' && !this.error && this.newEntry !== '') {
-            // Add on pressing Enter/Return
-            this.markAsTouched();
-            this.add(this.newEntry);
-        }
-    }
-    onChangeNewEntry(newValue) {
-        this.markAsTouched();
-        if (!newValue) {
-            this.isValidNewEntry = false;
-            this.error = null;
-            return;
-        }
-        if (this.unique) {
-            const found = (this.value || []).find((it) => it === newValue);
-            this.isValidNewEntry = !found;
-            this.error = found
-                ? `Value '${newValue}' is already in. Cannot add duplicates.`
-                : null;
-            if (!this.isValidNewEntry) {
-                return;
-            }
-        }
-        this.error = this.validateItem(newValue);
-        this.isValidNewEntry = !this.error;
-    }
-}
-SelectComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'lux-select',
-                template: "<div class=\"lux-select\">\n  <ul class=\"list\">\n    <li *ngFor=\"let item of value; let i = index\">\n      <span>{{ item }}</span>\n      <button *ngIf=\"!disabled\"\n            class=\"remove\"\n            type=\"button\"\n            (click)=\"remove(i)\"\n            [attr.aria-label]=\"'Remove ' + item\"\n            >Remove</button>\n    </li>\n  </ul>\n  <div class=\"add-new-item\" *ngIf=\"!disabled\">\n    <lux-input\n      id=\"{{ id + 'addNew' }}\"\n      type=\"string\"\n      [placeholder]=\"placeholder\"\n      [attr.aria-label]=\"placeholder\"\n      [disabled]=\"disabled\"\n      [(value)]=\"newEntry\"\n      (keyPress)=\"onKeyPress($event)\"\n      (valueChange)=\"onChangeNewEntry($event)\"\n    >\n    </lux-input>\n    <div *ngIf=\"canAdd\">\n      <button *ngIf=\"isValidNewEntry\" type=\"button\" (click)=\"add(newEntry)\">Add</button>\n    </div>\n    <div class=\"error\">\n      {{ error }}\n    </div>\n  </div>\n</div>\n",
-                providers: [
-                    {
-                        provide: NG_VALUE_ACCESSOR,
-                        multi: true,
-                        useExisting: forwardRef(() => SelectComponent)
-                    },
-                    {
-                        provide: NG_VALIDATORS,
-                        multi: true,
-                        useExisting: forwardRef(() => SelectComponent)
-                    }
-                ],
-                styles: [".lux-select{margin-bottom:.5em}.lux-select .list{margin:1em;padding-bottom:.2em;list-style-type:square}.lux-select .list span{margin-bottom:.3em}.remove{margin-left:2em;font-size:.65em;color:#b22222;background:transparent;border:2px solid #BBB}.add-new-item{display:inline-flex;margin-left:2.2em;height:1.6em}.error{margin:.5em 0;color:#b22222}\n"]
-            },] }
-];
-SelectComponent.ctorParameters = () => [];
-SelectComponent.propDecorators = {
-    id: [{ type: Input }],
-    disabled: [{ type: Input }],
-    required: [{ type: Input }],
-    multiple: [{ type: Input }],
-    value: [{ type: Input }],
-    valueChange: [{ type: Output }],
-    placeholder: [{ type: Input }],
-    unique: [{ type: Input }],
-    validateItem: [{ type: Input }]
-};
-
-class VoiceRecognitionDirective {
-    constructor(el, renderer) {
-        this.el = el;
-        this.renderer = renderer;
-        this.isRecognizing = false;
-        const speechRecognition = window.webkitSpeechRecognition;
-        if (speechRecognition) {
-            this.recognition = new speechRecognition();
-        }
-    }
-    ngOnInit() {
-        if (this.recognition) {
-            // API is available
-            this.recognition.lang = this.language || window.navigator.language;
-            this.recognition.interimResults = false;
-            this.recognition.maxAlternatives = 1;
-            // Add mic icon
-            this.mic = document.createElement('div');
-            this.mic.setAttribute('class', 'lux-microphone');
-            const parent = this.el.nativeElement.parentElement;
-            parent.appendChild(this.mic);
-            // Add event handlers
-            this.mic.onclick = () => this.microphoneClick();
-            this.recognition.onresult = (event) => this.onRecognized(event);
-        }
-    }
-    microphoneClick() {
-        if (this.isRecognizing) {
-            // stop
-            this.isRecognizing = false;
-            this.renderer.removeClass(this.mic, 'lux-recording');
-            this.recognition.abort();
-        }
-        else {
-            // start
-            this.el.nativeElement.value = getRecordingMessage(this.language);
-            this.isRecognizing = true;
-            this.renderer.addClass(this.mic, 'lux-recording');
-            this.recognition.start();
-        }
-    }
-    onRecognized(event) {
-        const recognizedText = event.results[0][0].transcript;
-        this.isRecognizing = false;
-        this.el.nativeElement.value = recognizedText;
-        this.renderer.removeClass(this.mic, 'lux-recording');
-    }
-}
-VoiceRecognitionDirective.decorators = [
-    { type: Directive, args: [{
-                selector: '[luxVoiceRecognition]'
-            },] }
-];
-VoiceRecognitionDirective.ctorParameters = () => [
-    { type: ElementRef },
-    { type: Renderer2 }
-];
-VoiceRecognitionDirective.propDecorators = {
-    language: [{ type: Input }]
-};
-const getRecordingMessage = (lang) => {
-    switch (lang.toLowerCase()) {
-        case 'es':
-        case 'es-es':
-            return 'Grabando...';
-        case 'en':
-        case 'en-uk':
-        case 'en-us':
-        default:
-            return 'Recording...';
-    }
-};
-const ɵ0 = getRecordingMessage;
-
-/* Create a new injection token for injecting the window into a component. */
-const WINDOW = new InjectionToken('WindowToken');
-/* Define abstract class for obtaining reference to the global window object. */
-class WindowRef {
-    // eslint-disable-next-line @typescript-eslint/ban-types
-    get nativeWindow() {
-        throw new Error('Not implemented.');
-    }
-}
-/* Define class that implements the abstract class and returns the native window object. */
-class BrowserWindowRef extends WindowRef {
-    constructor() {
-        super();
-    }
-    // eslint-disable-next-line @typescript-eslint/ban-types
-    get nativeWindow() {
-        return window;
-    }
-}
-/* Create an factory function that returns the native window object. */
-// eslint-disable-next-line @typescript-eslint/ban-types
-const windowFactory = (browserWindowRef, platformId) => {
-    if (isPlatformBrowser(platformId)) {
-        return browserWindowRef.nativeWindow;
-    }
-    return new Object();
-};
-/* Create a injectable provider for the WindowRef token that uses the BrowserWindowRef class. */
-const browserWindowProvider = {
-    provide: WindowRef,
-    useClass: BrowserWindowRef
-};
-/* Create an injectable provider that uses the windowFactory function for returning the native window object. */
-const windowProvider = {
-    provide: WINDOW,
-    useFactory: windowFactory,
-    deps: [WindowRef, PLATFORM_ID]
-};
-/* Create an array of providers. */
-const WINDOW_PROVIDERS = [
-    browserWindowProvider,
-    windowProvider
-];
-
-class LuxModule {
-}
-LuxModule.decorators = [
-    { type: NgModule, args: [{
-                declarations: [
-                    AutocompleteComponent,
-                    AutocompleteListComponent,
-                    FilterComponent,
-                    CheckboxComponent,
-                    DatetimeComponent,
-                    InputComponent,
-                    GeolocationComponent,
-                    LuxTooltipDirective,
-                    LuxModalWindowComponent,
-                    LuxModalBackdropComponent,
-                    LuxBreadcrumbComponent,
-                    MapComponent,
-                    SelectComponent,
-                    TooltipComponent,
-                    PaginationComponent,
-                    RadiogroupComponent,
-                    VoiceRecognitionDirective
-                ],
-                entryComponents: [
-                    LuxModalWindowComponent,
-                    LuxModalBackdropComponent,
-                    TooltipComponent
-                ],
-                providers: [ModalService, TooltipService, WINDOW_PROVIDERS],
-                imports: [
-                    AngularResizedEventModule,
-                    FormsModule,
-                    HttpClientModule,
-                    ReactiveFormsModule,
-                    RouterModule,
-                    CommonModule
-                ],
-                exports: [
-                    AutocompleteComponent,
-                    AutocompleteListComponent,
-                    FilterComponent,
-                    CheckboxComponent,
-                    DatetimeComponent,
-                    InputComponent,
-                    GeolocationComponent,
-                    LuxTooltipDirective,
-                    LuxBreadcrumbComponent,
-                    LuxBreadcrumbComponent,
-                    MapComponent,
-                    SelectComponent,
-                    PaginationComponent,
-                    RadiogroupComponent,
-                    VoiceRecognitionDirective
-                ]
-            },] }
-];
-
-/*
- * Public API Surface of lux
- */
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { AutocompleteComponent, AutocompleteListComponent, CheckboxComponent, FilterComponent, InputComponent, LuxBreadcrumbComponent, LuxModule, LuxTooltipDirective, ModalRef, ModalService, PaginationComponent, RadiogroupComponent, DatetimeComponent as ɵa, RegexpService as ɵb, GeolocationComponent as ɵc, ModalStack as ɵd, LuxModalConfig as ɵe, GeolocationService as ɵf, TooltipService as ɵg, LuxModalWindowComponent as ɵh, LuxModalBackdropComponent as ɵi, MapComponent as ɵj, OpenLayerLoaderService as ɵk, SelectComponent as ɵl, TooltipComponent as ɵm, VoiceRecognitionDirective as ɵn, WINDOW as ɵo, WindowRef as ɵp, BrowserWindowRef as ɵq, windowFactory as ɵr, WINDOW_PROVIDERS as ɵs, ContentRef as ɵt };
-//# sourceMappingURL=metadev-lux.js.map