@seniorsistemas/angular-components 14.10.1 → 14.11.0

package/bundles/seniorsistemas-angular-components.umd.js

@@ -2373,6 +2373,10 @@
                 prefix: (_c = col.numberLocaleOptions) === null || _c === void 0 ? void 0 : _c.currencySymbol
             };
         };
+        LookupComponent.prototype.onTableRowDoubleClick = function (rowData) {
+            this.selected = [rowData];
+            this.select();
+        };
         var LookupComponent_1;
         LookupComponent.nextId = 0;
         LookupComponent.ctorParameters = function () { return [
@@ -2510,7 +2514,7 @@
         LookupComponent = LookupComponent_1 = __decorate([
             core.Component({
                 selector: "s-lookup",
-                template: "<div [ngClass]=\"{ inputgroup: showSearch }\">\n    <p-autoComplete\n        #autocomplete\n        [(ngModel)]=\"value\"\n        [disabled]=\"disabled\"\n        [dataKey]=\"dataKey\"\n        [multiple]=\"multiple\"\n        [inputId]=\"id + '-autocomplete'\"\n        [forceSelection]=\"true\"\n        [suggestions]=\"getLookupSuggestions()\"\n        (completeMethod)=\"lazyLoadLookup($event)\"\n        (onSelect)=\"onSelect.next($event)\"\n        (onBlur)=\"onBlur.next($event)\"\n        (onFocus)=\"onFocus.next($event)\"\n        (onUnselect)=\"onUnselect.next($event)\"\n        (onClear)=\"onClear.next($event)\"\n        (onKeyUp)=\"onKeyUp.next($event)\"\n        [field]=\"lookupDisplayField\"\n        [emptyMessage]=\"lookupEmptyMessage\"\n        [dropdown]=\"!showSearch\"\n        [appendTo]=\"lookupAppendTo\"\n        [placeholder]=\"placeholder || ' '\"\n        [autoHighlight]=\"true\"\n        inputStyleClass=\"mousetrap\"\n    >\n    <ng-template let-item pTemplate=\"selectedItem\">\n        <span class=\"ui-autocomplete-token-label ng-tns-c65-43 ng-star-inserted\" \n        [pTooltip]=\"lookupDisplayFieldTooltip ? item[lookupDisplayField] : null\" \n        tooltipPosition=\"top\">\n            {{item[lookupDisplayField]}}\n        </span>\n    </ng-template>\n    </p-autoComplete>\n\n    <button\n        *ngIf=\"showSearch\"\n        pButton\n        type=\"button\"\n        icon=\"fa fa-search\"\n        class=\"button-addon\"\n        [disabled]=\"disabled\"\n        (click)=\"showDialog()\"\n    ></button>\n</div>\n\n<p-dialog\n    appendTo=\"body\"\n    styleClass=\"s-lookup-modal\"\n    [header]=\"searchTitle\"\n    [(visible)]=\"dialogVisible\"\n    [modal]=\"true\"\n    (onHide)=\"hideDialog()\"\n    [blockScroll]=\"true\"\n    [focusOnShow]=\"true\"\n    [draggable]=\"false\"\n    [resizable]=\"false\"\n    #dialog\n>\n    <div *ngIf=\"dialogVisible\" class=\"s-lookup-modal-container\">\n        <div *ngIf=\"searchFields && searchFields.length\" class=\"filter\"\n        [@collapseContent]=\"collapsed ? {value: 'hidden', params: {transitionParams: transitionOptions }} : {value: 'visible', params: {transitionParams: transitionOptions}}\"\n            (@collapseContent.done)=\"onToggleDone()\">\n            <form [formGroup]=\"formGroupDialog\" novalidate autocomplete=\"off\">\n                <div *ngIf=\"!collapsed\"\n                        [@childCollapseContent]=\"collapsed ? {value: ':leave', params: {transitionParams: transitionOptions }} : {value: ':enter', params: {transitionParams: transitionOptions}}\"\n                        class=\"form-content\">\n                    <div class=\"filter-title sds-section-title\">{{ filterTitle }}</div>\n                    <div class=\"form-fields\">\n                        <s-dynamic-form [fields]=\"searchFields\" [form]=\"formGroupDialog\"></s-dynamic-form>\n                    </div>\n                    <div class=\"ui-g\">\n                        <div class=\"ui-g-12\">\n                            <s-button\n                                [id]=\"id + '-filter-button'\"\n                                type=\"submit\"\n                                [label]=\"filterLabel\"\n                                (onClick)=\"search()\"\n                                pTooltip=\"(ALT + SHIFT + F)\"\n                                showDelay=\"500\"\n                            ></s-button>\n                            <s-button\n                                [id]=\"id + '-clear-button'\"\n                                type=\"button\"\n                                [label]=\"clearLabel\"\n                                (onClick)=\"clear()\"\n                                priority=\"link\"\n                                pTooltip=\"(ALT + SHIFT + L)\"\n                                showDelay=\"500\"\n                            ></s-button>\n                        </div>\n                    </div>\n                </div>\n            </form>                \n        </div>\n        <div *ngIf=\"searchFields && searchFields.length\" class=\"filter-toggle\">\n            <div class=\"filter-toggle--start-border-mask\"></div>\n            <button [id]=\"id + '-filter-toggle-button'\" type=\"button\" (click)=\"filterToggle()\">\n                <span class=\"fa\" [ngClass]=\"{'fa-chevron-left': !collapsed, 'fa-chevron-right': collapsed}\"\n                    aria-hidden=\"true\"></span>\n            </button>\n            <div class=\"filter-toggle--end-border-mask\"></div>\n        </div>\n        <div class=\"content\" [ngClass]=\"{'empty-content': !searchTotalRecords && !loading}\">\n            <s-empty-state\n                [id]=\"id + '-empty-state'\"\n                *ngIf=\"!searchTotalRecords && !loading\"\n                [title]=\"searchEmptyTitle\"\n                [description]=\"searchEmptyDescription\"\n                iconClass=\"fa fa-search\"\n            ></s-empty-state>\n\n            <p-table\n                [dataKey]=\"dataKey\"\n                [value]=\"getGridData()\"\n                [columns]=\"searchGridFields\"\n                [lazy]=\"true\"\n                [scrollable]=\"true\"\n                [paginator]=\"true\"\n                sortMode=\"multiple\"\n                [totalRecords]=\"searchTotalRecords\"\n                [rows]=\"10\"\n                [selection]=\"selected\"\n                (onLazyLoad)=\"lazyLoadGrid($event)\"\n                *sLoadingState=\"loading\"\n                [multiSortMeta]=\"multiSortMeta\"\n                [attr.data-hidden]=\"!searchTotalRecords && !loading\"\n                [selectionMode]=\"multiple ? 'multiple' : 'single'\"\n                (selectionChange)=\"onSelectionChange($event)\"\n            >\n                <ng-template pTemplate=\"colgroup\" let-columns>\n                    <colgroup>\n                        <col *ngIf=\"multiple\" style=\"width: 50px\" />\n                        <col *ngFor=\"let col of columns\" [style.width]=\"col.width\" />\n                    </colgroup>\n                </ng-template>\n                <ng-template pTemplate=\"header\" let-columns>\n                    <tr>\n                        <th *ngIf=\"multiple\" style=\"width: 50px\">\n                            <s-table-header-checkbox [useAllObject]=\"lookupRowProps ? false : true\" [rowProps]=\"lookupRowProps\"></s-table-header-checkbox>\n                        </th>\n                        <th\n                            [style.width]=\"col.width\"\n                            *ngFor=\"let col of columns\"\n                            [pSortableColumn]=\"col.name\"\n                            [pSortableColumnDisabled]=\"sortableColumnsDisabled?.includes(col.name)\"\n                        >\n                            <div class=\"senior-header\">\n                                <span class=\"senior-header-title\">{{ col.label }}</span>\n                                <p-sortIcon [field]=\"col.name\" *ngIf=\"!sortableColumnsDisabled?.includes(col.name)\"></p-sortIcon>\n                            </div>\n                        </th>\n                    </tr>\n                </ng-template>\n                <ng-template pTemplate=\"body\" let-rowData let-columns let-rowIndex=\"rowIndex\">\n                    <tr sNavigation [pSelectableRow]=\"rowData\" [pSelectableRowIndex]=\"rowIndex\">\n                        <td *ngIf=\"multiple\" style=\"width: 50px\" tabindex=\"0\">\n                            <p-tableCheckbox [value]=\"rowData\" [pSelectableRow]=\"rowData\"></p-tableCheckbox>\n                        </td>\n                        <td\n                            [style.width]=\"col['width']\"\n                            *ngFor=\"let col of searchGridFields\"\n                            [ngSwitch]=\"col.type\"\n                            tabindex=\"0\"\n                        >\n                            <ng-container *ngSwitchCase=\"'Boolean'\">\n                                <ng-container *ngIf=\"isBooleanValue(rowData, col.name); else emptyTemplate\">\n                                    <span>{{ getBooleanLabel(rowData, col.name, col.optionsLabel) }}</span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchCase=\"'Date'\">\n                                <ng-container *ngIf=\"getFieldValue(rowData, col.name); else emptyTemplate\">\n                                    <span>{{ getFieldValue(rowData, col.name) | localizedDate: col.calendarLocaleOptions?.dateFormat || \"L\" | async }}</span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchCase=\"'DateTime'\">\n                                <ng-container *ngIf=\"getFieldValue(rowData, col.name); else emptyTemplate\">\n                                    <span>{{ getFieldValue(rowData, col.name) | localizedDate | async }}</span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchCase=\"'Time'\">\n                                <ng-container *ngIf=\"getFieldValue(rowData, col.name); else emptyTemplate\">\n                                    <span>{{ getFieldValue(rowData, col.name) | localizedTime: col.calendarLocaleOptions?.dateFormat || \"LTS\" | async }}</span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchCase=\"'Double'\">\n                                <ng-container *ngIf=\"isNumber(rowData, col.name); else emptyTemplate\">\n                                    <span> {{ getFieldValue(rowData, col.name) | localizedNumber: getScale(col.scale) | async }} </span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchCase=\"'Money'\">\n                                <ng-container *ngIf=\"isNumber(rowData, col.name); else emptyTemplate\">\n                                    <span> {{ getFieldValue(rowData, col.name) | localizedCurrency | async }} </span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchCase=\"'Number'\">\n                                <ng-container *ngIf=\"isNumber(rowData, col.name); else emptyTemplate\">\n                                    <span> {{ getFieldValue(rowData, col.name) | localizedBignumber: getNumberMaskConfig(col) | async }} </span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchCase=\"'Enum'\">\n                                <ng-container\n                                    *ngIf=\"getLabelForValue(getFieldValue(rowData, col.name), col.options); else emptyTemplate\"\n                                >\n                                    <span> {{ getLabelForValue(getFieldValue(rowData, col.name), col.options) }} </span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchDefault>\n                                <ng-container *ngIf=\"col.mask && col.mask()\">\n                                    <ng-container *ngIf=\"(isNumber(rowData, col.name) || getFieldValue(rowData, col.name))\">\n                                        <span>{{ getFieldValue(rowData, col.name) | sMaskFormatter: col.mask() }}</span>\n                                    </ng-container>\n                                </ng-container>\n                                <ng-container *ngIf=\"!(col.mask && col.mask())\">\n                                    <ng-container *ngIf=\"(isNumber(rowData, col.name) || getFieldValue(rowData, col.name)); else emptyTemplate\">\n                                        <span>{{ getFieldValue(rowData, col.name) }}</span>\n                                    </ng-container>\n                                </ng-container>\n                            </ng-container>\n                        </td>\n                    </tr>\n                </ng-template>\n                <ng-template pTemplate=\"paginatorright\">\n                    <span [attr.data-hidden]=\"loading\">\n                        {{\n                            searchTotalRecordsLabel ||\n                                searchTotalRecords?.toString() + (searchTotalRecords === 1 ? recordLabel : recordsLabel)\n                        }}\n                    </span>\n                </ng-template>\n            </p-table>\n        </div>\n    </div>\n\n    <p-footer>\n        <s-button\n            [id]=\"id + '-select-button'\"\n            type=\"button\"\n            [label]=\"selectLabel\"\n            (onClick)=\"select()\"\n            pTooltip=\"(ALT + SHIFT + S)\"\n            showDelay=\"500\"\n            [disabled]=\"!selected?.length\"\n        ></s-button>\n        <s-button\n            [id]=\"id + '-cancel-button'\"\n            type=\"button\"\n            priority=\"link\"\n            [label]=\"cancelLabel\"\n            (onClick)=\"hideDialog()\"\n            pTooltip=\"(ALT + SHIFT + C)\"\n            showDelay=\"500\"\n        ></s-button>\n    </p-footer>\n</p-dialog>\n\n<ng-template #emptyTemplate>\n    <span [ngClass]=\"'sds-empty-value'\">{{ emptyFieldLabel }}</span>\n</ng-template>\n",
+                template: "<div [ngClass]=\"{ inputgroup: showSearch }\">\n    <p-autoComplete\n        #autocomplete\n        [(ngModel)]=\"value\"\n        [disabled]=\"disabled\"\n        [dataKey]=\"dataKey\"\n        [multiple]=\"multiple\"\n        [inputId]=\"id + '-autocomplete'\"\n        [forceSelection]=\"true\"\n        [suggestions]=\"getLookupSuggestions()\"\n        (completeMethod)=\"lazyLoadLookup($event)\"\n        (onSelect)=\"onSelect.next($event)\"\n        (onBlur)=\"onBlur.next($event)\"\n        (onFocus)=\"onFocus.next($event)\"\n        (onUnselect)=\"onUnselect.next($event)\"\n        (onClear)=\"onClear.next($event)\"\n        (onKeyUp)=\"onKeyUp.next($event)\"\n        [field]=\"lookupDisplayField\"\n        [emptyMessage]=\"lookupEmptyMessage\"\n        [dropdown]=\"!showSearch\"\n        [appendTo]=\"lookupAppendTo\"\n        [placeholder]=\"placeholder || ' '\"\n        [autoHighlight]=\"true\"\n        inputStyleClass=\"mousetrap\"\n    >\n    <ng-template let-item pTemplate=\"selectedItem\">\n        <span class=\"ui-autocomplete-token-label ng-tns-c65-43 ng-star-inserted\" \n        [pTooltip]=\"lookupDisplayFieldTooltip ? item[lookupDisplayField] : null\" \n        tooltipPosition=\"top\">\n            {{item[lookupDisplayField]}}\n        </span>\n    </ng-template>\n    </p-autoComplete>\n\n    <button\n        *ngIf=\"showSearch\"\n        pButton\n        type=\"button\"\n        icon=\"fa fa-search\"\n        class=\"button-addon\"\n        [disabled]=\"disabled\"\n        (click)=\"showDialog()\"\n    ></button>\n</div>\n\n<p-dialog\n    appendTo=\"body\"\n    styleClass=\"s-lookup-modal\"\n    [header]=\"searchTitle\"\n    [(visible)]=\"dialogVisible\"\n    [modal]=\"true\"\n    (onHide)=\"hideDialog()\"\n    [blockScroll]=\"true\"\n    [focusOnShow]=\"true\"\n    [draggable]=\"false\"\n    [resizable]=\"false\"\n    #dialog\n>\n    <div *ngIf=\"dialogVisible\" class=\"s-lookup-modal-container\">\n        <div *ngIf=\"searchFields && searchFields.length\" class=\"filter\"\n        [@collapseContent]=\"collapsed ? {value: 'hidden', params: {transitionParams: transitionOptions }} : {value: 'visible', params: {transitionParams: transitionOptions}}\"\n            (@collapseContent.done)=\"onToggleDone()\">\n            <form [formGroup]=\"formGroupDialog\" novalidate autocomplete=\"off\">\n                <div *ngIf=\"!collapsed\"\n                        [@childCollapseContent]=\"collapsed ? {value: ':leave', params: {transitionParams: transitionOptions }} : {value: ':enter', params: {transitionParams: transitionOptions}}\"\n                        class=\"form-content\">\n                    <div class=\"filter-title sds-section-title\">{{ filterTitle }}</div>\n                    <div class=\"form-fields\">\n                        <s-dynamic-form [fields]=\"searchFields\" [form]=\"formGroupDialog\"></s-dynamic-form>\n                    </div>\n                    <div class=\"ui-g\">\n                        <div class=\"ui-g-12\">\n                            <s-button\n                                [id]=\"id + '-filter-button'\"\n                                type=\"submit\"\n                                [label]=\"filterLabel\"\n                                (onClick)=\"search()\"\n                                pTooltip=\"(ALT + SHIFT + F)\"\n                                showDelay=\"500\"\n                            ></s-button>\n                            <s-button\n                                [id]=\"id + '-clear-button'\"\n                                type=\"button\"\n                                [label]=\"clearLabel\"\n                                (onClick)=\"clear()\"\n                                priority=\"link\"\n                                pTooltip=\"(ALT + SHIFT + L)\"\n                                showDelay=\"500\"\n                            ></s-button>\n                        </div>\n                    </div>\n                </div>\n            </form>                \n        </div>\n        <div *ngIf=\"searchFields && searchFields.length\" class=\"filter-toggle\">\n            <div class=\"filter-toggle--start-border-mask\"></div>\n            <button [id]=\"id + '-filter-toggle-button'\" type=\"button\" (click)=\"filterToggle()\">\n                <span class=\"fa\" [ngClass]=\"{'fa-chevron-left': !collapsed, 'fa-chevron-right': collapsed}\"\n                    aria-hidden=\"true\"></span>\n            </button>\n            <div class=\"filter-toggle--end-border-mask\"></div>\n        </div>\n        <div class=\"content\" [ngClass]=\"{'empty-content': !searchTotalRecords && !loading}\">\n            <s-empty-state\n                [id]=\"id + '-empty-state'\"\n                *ngIf=\"!searchTotalRecords && !loading\"\n                [title]=\"searchEmptyTitle\"\n                [description]=\"searchEmptyDescription\"\n                iconClass=\"fa fa-search\"\n            ></s-empty-state>\n\n            <p-table\n                [dataKey]=\"dataKey\"\n                [value]=\"getGridData()\"\n                [columns]=\"searchGridFields\"\n                [lazy]=\"true\"\n                [scrollable]=\"true\"\n                [paginator]=\"true\"\n                sortMode=\"multiple\"\n                [totalRecords]=\"searchTotalRecords\"\n                [rows]=\"10\"\n                [selection]=\"selected\"\n                (onLazyLoad)=\"lazyLoadGrid($event)\"\n                *sLoadingState=\"loading\"\n                [multiSortMeta]=\"multiSortMeta\"\n                [attr.data-hidden]=\"!searchTotalRecords && !loading\"\n                [selectionMode]=\"multiple ? 'multiple' : 'single'\"\n                (selectionChange)=\"onSelectionChange($event)\"\n            >\n                <ng-template pTemplate=\"colgroup\" let-columns>\n                    <colgroup>\n                        <col *ngIf=\"multiple\" style=\"width: 50px\" />\n                        <col *ngFor=\"let col of columns\" [style.width]=\"col.width\" />\n                    </colgroup>\n                </ng-template>\n                <ng-template pTemplate=\"header\" let-columns>\n                    <tr>\n                        <th *ngIf=\"multiple\" style=\"width: 50px\">\n                            <s-table-header-checkbox [useAllObject]=\"lookupRowProps ? false : true\" [rowProps]=\"lookupRowProps\"></s-table-header-checkbox>\n                        </th>\n                        <th\n                            [style.width]=\"col.width\"\n                            *ngFor=\"let col of columns\"\n                            [pSortableColumn]=\"col.name\"\n                            [pSortableColumnDisabled]=\"sortableColumnsDisabled?.includes(col.name)\"\n                        >\n                            <div class=\"senior-header\">\n                                <span class=\"senior-header-title\">{{ col.label }}</span>\n                                <p-sortIcon [field]=\"col.name\" *ngIf=\"!sortableColumnsDisabled?.includes(col.name)\"></p-sortIcon>\n                            </div>\n                        </th>\n                    </tr>\n                </ng-template>\n                <ng-template pTemplate=\"body\" let-rowData let-columns let-rowIndex=\"rowIndex\">\n                    <tr\n                        sNavigation\n                        [pSelectableRow]=\"rowData\"\n                        [pSelectableRowIndex]=\"rowIndex\"\n                        sDoubleClick (onDoubleClick)=\"onTableRowDoubleClick(rowData)\"\n                    >\n                        <td *ngIf=\"multiple\" style=\"width: 50px\" tabindex=\"0\">\n                            <p-tableCheckbox [value]=\"rowData\" [pSelectableRow]=\"rowData\"></p-tableCheckbox>\n                        </td>\n                        <td\n                            [style.width]=\"col['width']\"\n                            *ngFor=\"let col of searchGridFields\"\n                            [ngSwitch]=\"col.type\"\n                            tabindex=\"0\"\n                        >\n                            <ng-container *ngSwitchCase=\"'Boolean'\">\n                                <ng-container *ngIf=\"isBooleanValue(rowData, col.name); else emptyTemplate\">\n                                    <span>{{ getBooleanLabel(rowData, col.name, col.optionsLabel) }}</span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchCase=\"'Date'\">\n                                <ng-container *ngIf=\"getFieldValue(rowData, col.name); else emptyTemplate\">\n                                    <span>{{ getFieldValue(rowData, col.name) | localizedDate: col.calendarLocaleOptions?.dateFormat || \"L\" | async }}</span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchCase=\"'DateTime'\">\n                                <ng-container *ngIf=\"getFieldValue(rowData, col.name); else emptyTemplate\">\n                                    <span>{{ getFieldValue(rowData, col.name) | localizedDate | async }}</span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchCase=\"'Time'\">\n                                <ng-container *ngIf=\"getFieldValue(rowData, col.name); else emptyTemplate\">\n                                    <span>{{ getFieldValue(rowData, col.name) | localizedTime: col.calendarLocaleOptions?.dateFormat || \"LTS\" | async }}</span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchCase=\"'Double'\">\n                                <ng-container *ngIf=\"isNumber(rowData, col.name); else emptyTemplate\">\n                                    <span> {{ getFieldValue(rowData, col.name) | localizedNumber: getScale(col.scale) | async }} </span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchCase=\"'Money'\">\n                                <ng-container *ngIf=\"isNumber(rowData, col.name); else emptyTemplate\">\n                                    <span> {{ getFieldValue(rowData, col.name) | localizedCurrency | async }} </span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchCase=\"'Number'\">\n                                <ng-container *ngIf=\"isNumber(rowData, col.name); else emptyTemplate\">\n                                    <span> {{ getFieldValue(rowData, col.name) | localizedBignumber: getNumberMaskConfig(col) | async }} </span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchCase=\"'Enum'\">\n                                <ng-container\n                                    *ngIf=\"getLabelForValue(getFieldValue(rowData, col.name), col.options); else emptyTemplate\"\n                                >\n                                    <span> {{ getLabelForValue(getFieldValue(rowData, col.name), col.options) }} </span>\n                                </ng-container>\n                            </ng-container>\n\n                            <ng-container *ngSwitchDefault>\n                                <ng-container *ngIf=\"col.mask && col.mask()\">\n                                    <ng-container *ngIf=\"(isNumber(rowData, col.name) || getFieldValue(rowData, col.name))\">\n                                        <span>{{ getFieldValue(rowData, col.name) | sMaskFormatter: col.mask() }}</span>\n                                    </ng-container>\n                                </ng-container>\n                                <ng-container *ngIf=\"!(col.mask && col.mask())\">\n                                    <ng-container *ngIf=\"(isNumber(rowData, col.name) || getFieldValue(rowData, col.name)); else emptyTemplate\">\n                                        <span>{{ getFieldValue(rowData, col.name) }}</span>\n                                    </ng-container>\n                                </ng-container>\n                            </ng-container>\n                        </td>\n                    </tr>\n                </ng-template>\n                <ng-template pTemplate=\"paginatorright\">\n                    <span [attr.data-hidden]=\"loading\">\n                        {{\n                            searchTotalRecordsLabel ||\n                                searchTotalRecords?.toString() + (searchTotalRecords === 1 ? recordLabel : recordsLabel)\n                        }}\n                    </span>\n                </ng-template>\n            </p-table>\n        </div>\n    </div>\n\n    <p-footer>\n        <s-button\n            [id]=\"id + '-select-button'\"\n            type=\"button\"\n            [label]=\"selectLabel\"\n            (onClick)=\"select()\"\n            pTooltip=\"(ALT + SHIFT + S)\"\n            showDelay=\"500\"\n            [disabled]=\"!selected?.length\"\n        ></s-button>\n        <s-button\n            [id]=\"id + '-cancel-button'\"\n            type=\"button\"\n            priority=\"link\"\n            [label]=\"cancelLabel\"\n            (onClick)=\"hideDialog()\"\n            pTooltip=\"(ALT + SHIFT + C)\"\n            showDelay=\"500\"\n        ></s-button>\n    </p-footer>\n</p-dialog>\n\n<ng-template #emptyTemplate>\n    <span [ngClass]=\"'sds-empty-value'\">{{ emptyFieldLabel }}</span>\n</ng-template>\n",
                 providers: [
                     {
                         provide: forms.NG_VALUE_ACCESSOR,
@@ -3075,7 +3079,7 @@
         InfoSignComponent = __decorate([
             core.Component({
                 selector: "s-info-sign-component",
-                template: "<span style=\"display: inline-flex; justify-content: flex-start; align-items: baseline;\">\n    <span *ngTemplateOutlet=\"templateRef\"></span>\n    <i class=\"fa fa-info-circle\" aria-hidden=\"true\" style=\"padding-left: 10px\" [pTooltip]=\"tooltip\"></i>\n</span>"
+                template: "<span style=\"display: inline-flex; justify-content: flex-start; align-items: baseline;\">\n    <span *ngTemplateOutlet=\"templateRef\"></span>\n    <i class=\"fa fa-info-circle\"\n        aria-hidden=\"true\"\n        style=\"padding-left: 10px\"\n        [pTooltip]=\"tooltip\"\n        [escape]=\"false\"></i>\n</span>"
             })
         ], InfoSignComponent);
         return InfoSignComponent;
@@ -4446,7 +4450,7 @@
         ], RadioButtonComponent.prototype, "onFocus", void 0);
         RadioButtonComponent = __decorate([
             core.Component({
-                template: "<ng-container *ngIf=\"field.verticalAlignment;else horizontalAlignment\">\n    <div class=\"ui-g\">\n        <div class=\"ui-g-12\" *ngFor=\"let option of field.options; let i = index\">\n            <ng-container [ngTemplateOutlet]=\"radioButton\" [ngTemplateOutletContext]=\"{option: option, index: i}\">\n            </ng-container>\n        </div>\n    </div>\n</ng-container>\n\n<ng-template #horizontalAlignment>\n    <ng-container *ngFor=\"let option of field.options; let i = index\" [ngTemplateOutlet]=\"radioButton\"\n        [ngTemplateOutletContext]=\"{option: option, index: i}\">\n    </ng-container>\n</ng-template>\n\n<ng-template #radioButton let-option=\"option\" let-i=\"index\">\n    <p-radioButton [name]=\"field.name\" [value]=\"option.value\" [label]=\"option.label\" [formControl]=\"formControl\"\n        [inputId]=\"(field.id || field.name) + '-' + i\" [pTooltip]=\"field.tooltip\" (onClick)=\"onClick.next($event)\"\n        (onFocus)=\"onFocus.next($event)\" (onBlur)=\"field.onBlur ? field.onBlur($event) : null\">\n    </p-radioButton>\n</ng-template>\n"
+                template: "<ng-container *ngIf=\"field.verticalAlignment;else horizontalAlignment\">\n    <div class=\"ui-g\">\n        <div class=\"ui-g-12\" *ngFor=\"let option of field.options; let i = index\">\n            <ng-container [ngTemplateOutlet]=\"radioButton\" [ngTemplateOutletContext]=\"{option: option, index: i}\">\n            </ng-container>\n        </div>\n    </div>\n</ng-container>\n\n<ng-template #horizontalAlignment>\n    <div class=\"ui-g\">\n        <ng-container *ngFor=\"let option of field.options; let i = index\" [ngTemplateOutlet]=\"radioButton\"\n            [ngTemplateOutletContext]=\"{option: option, index: i}\">\n        </ng-container>\n    </div>\n</ng-template>\n\n<ng-template #radioButton let-option=\"option\" let-i=\"index\">\n    <p-radioButton [name]=\"field.name\" [value]=\"option.value\" [label]=\"option.label\" [formControl]=\"formControl\"\n        [inputId]=\"(field.id || field.name) + '-' + i\" [pTooltip]=\"field.tooltip\" (onClick)=\"onClick.next($event)\"\n        (onFocus)=\"onFocus.next($event)\" (onBlur)=\"field.onBlur ? field.onBlur($event) : null\">\n    </p-radioButton>\n</ng-template>\n"
             })
         ], RadioButtonComponent);
         return RadioButtonComponent;
@@ -4951,6 +4955,108 @@
         return DynamicFormDirective;
     }());
 
+    var LongPressDirective = /** @class */ (function () {
+        function LongPressDirective() {
+            this.sLongPressDelay = 500;
+            this.sLongPress = new core.EventEmitter();
+            this.mouseUp = new rxjs.Subject();
+            this.mouseDown = new rxjs.Subject();
+            this.ngUnsubscribe = new rxjs.Subject();
+        }
+        LongPressDirective.prototype.onMouseUp = function (event) {
+            this.mouseUp.next(event);
+        };
+        LongPressDirective.prototype.onMouseDown = function (event) {
+            this.mouseDown.next(event);
+        };
+        LongPressDirective.prototype.ngOnInit = function () {
+            var _this = this;
+            this.mouseDown
+                .pipe(operators.debounceTime(this.sLongPressDelay), operators.takeUntil(this.mouseUp), operators.repeat(), operators.takeUntil(this.ngUnsubscribe))
+                .subscribe(function (event) { return _this.sLongPress.emit(event); });
+        };
+        LongPressDirective.prototype.ngOnDestroy = function () {
+            this.ngUnsubscribe.next();
+            this.ngUnsubscribe.complete();
+        };
+        __decorate([
+            core.Input()
+        ], LongPressDirective.prototype, "sLongPressDelay", void 0);
+        __decorate([
+            core.Output()
+        ], LongPressDirective.prototype, "sLongPress", void 0);
+        __decorate([
+            core.HostListener("mouseup", ["$event"]),
+            core.HostListener("touchend", ["$event"])
+        ], LongPressDirective.prototype, "onMouseUp", null);
+        __decorate([
+            core.HostListener("mousedown", ["$event"]),
+            core.HostListener("touchstart", ["$event"])
+        ], LongPressDirective.prototype, "onMouseDown", null);
+        LongPressDirective = __decorate([
+            core.Directive({
+                selector: "[sLongPress]",
+            })
+        ], LongPressDirective);
+        return LongPressDirective;
+    }());
+
+    var DoubleClickDirective = /** @class */ (function () {
+        function DoubleClickDirective() {
+            this.onDoubleClick = new core.EventEmitter();
+            this._timeout = null;
+            this._DOUBLE_CLICK_DELAY = 500;
+        }
+        DoubleClickDirective.prototype.onClick = function (event) {
+            this.handleOnClickEvent(event);
+        };
+        DoubleClickDirective.prototype.handleOnClickEvent = function (event) {
+            var _this = this;
+            if (this._timeout) {
+                this.clearTimeout();
+                this.onDoubleClick.emit(event);
+            }
+            else {
+                this._timeout = setTimeout(function () { return _this.clearTimeout(); }, this._DOUBLE_CLICK_DELAY);
+            }
+        };
+        DoubleClickDirective.prototype.clearTimeout = function () {
+            clearTimeout(this._timeout);
+            this._timeout = null;
+        };
+        __decorate([
+            core.Output()
+        ], DoubleClickDirective.prototype, "onDoubleClick", void 0);
+        __decorate([
+            core.HostListener("click", ["$event"])
+        ], DoubleClickDirective.prototype, "onClick", null);
+        DoubleClickDirective = __decorate([
+            core.Directive({
+                selector: '[sDoubleClick]'
+            })
+        ], DoubleClickDirective);
+        return DoubleClickDirective;
+    }());
+
+    var MouseEventsModule = /** @class */ (function () {
+        function MouseEventsModule() {
+        }
+        MouseEventsModule = __decorate([
+            core.NgModule({
+                imports: [common.CommonModule],
+                declarations: [
+                    LongPressDirective,
+                    DoubleClickDirective
+                ],
+                exports: [
+                    LongPressDirective,
+                    DoubleClickDirective
+                ],
+            })
+        ], MouseEventsModule);
+        return MouseEventsModule;
+    }());
+
     var DynamicFormModule = /** @class */ (function () {
         function DynamicFormModule() {
         }
@@ -4993,7 +5099,8 @@
                     TableModule,
                     InfoSignModule,
                     MaskFormatterModule,
-                    angular2Hotkeys.HotkeyModule.forRoot()
+                    angular2Hotkeys.HotkeyModule.forRoot(),
+                    MouseEventsModule
                 ],
                 declarations: [
                     AutocompleteFieldComponent,
@@ -5983,65 +6090,6 @@
         return ImageCropperService;
     }());
 
-    var LongPressDirective = /** @class */ (function () {
-        function LongPressDirective() {
-            this.sLongPressDelay = 500;
-            this.sLongPress = new core.EventEmitter();
-            this.mouseUp = new rxjs.Subject();
-            this.mouseDown = new rxjs.Subject();
-            this.ngUnsubscribe = new rxjs.Subject();
-        }
-        LongPressDirective.prototype.onMouseUp = function (event) {
-            this.mouseUp.next(event);
-        };
-        LongPressDirective.prototype.onMouseDown = function (event) {
-            this.mouseDown.next(event);
-        };
-        LongPressDirective.prototype.ngOnInit = function () {
-            var _this = this;
-            this.mouseDown
-                .pipe(operators.debounceTime(this.sLongPressDelay), operators.takeUntil(this.mouseUp), operators.repeat(), operators.takeUntil(this.ngUnsubscribe))
-                .subscribe(function (event) { return _this.sLongPress.emit(event); });
-        };
-        LongPressDirective.prototype.ngOnDestroy = function () {
-            this.ngUnsubscribe.next();
-            this.ngUnsubscribe.complete();
-        };
-        __decorate([
-            core.Input()
-        ], LongPressDirective.prototype, "sLongPressDelay", void 0);
-        __decorate([
-            core.Output()
-        ], LongPressDirective.prototype, "sLongPress", void 0);
-        __decorate([
-            core.HostListener("mouseup", ["$event"]),
-            core.HostListener("touchend", ["$event"])
-        ], LongPressDirective.prototype, "onMouseUp", null);
-        __decorate([
-            core.HostListener("mousedown", ["$event"]),
-            core.HostListener("touchstart", ["$event"])
-        ], LongPressDirective.prototype, "onMouseDown", null);
-        LongPressDirective = __decorate([
-            core.Directive({
-                selector: "[sLongPress]",
-            })
-        ], LongPressDirective);
-        return LongPressDirective;
-    }());
-
-    var MouseEventsModule = /** @class */ (function () {
-        function MouseEventsModule() {
-        }
-        MouseEventsModule = __decorate([
-            core.NgModule({
-                imports: [common.CommonModule],
-                declarations: [LongPressDirective],
-                exports: [LongPressDirective],
-            })
-        ], MouseEventsModule);
-        return MouseEventsModule;
-    }());
-
 
     (function (ThumbnailSize) {
         ThumbnailSize["Small"] = "small";
@@ -8764,6 +8812,7 @@
     exports.DEFAULT_CALENDAR_LOCALE_OPTIONS = DEFAULT_CALENDAR_LOCALE_OPTIONS;
     exports.DEFAULT_LOCALE_OPTIONS = DEFAULT_LOCALE_OPTIONS;
     exports.DEFAULT_NUMBER_LOCALE_OPTIONS = DEFAULT_NUMBER_LOCALE_OPTIONS;
+    exports.DoubleClickDirective = DoubleClickDirective;
     exports.DynamicConfig = DynamicConfig;
     exports.DynamicFormComponent = DynamicFormComponent;
     exports.DynamicFormModule = DynamicFormModule;
@@ -8846,42 +8895,43 @@
     exports.TokenListModule = TokenListModule;
     exports.ɵa = LocalizedCurrencyImpurePipe;
     exports.ɵb = LocalizedBignumberPipe;
-    exports.ɵba = DecimalField;
-    exports.ɵbb = StructureModule;
-    exports.ɵbc = HeaderComponent;
-    exports.ɵbd = FooterComponent;
-    exports.ɵbe = InfoSignComponent;
-    exports.ɵbf = NumberLocaleOptions;
-    exports.ɵbg = ThumbnailService;
-    exports.ɵbh = InfiniteScrollModule;
-    exports.ɵbi = InfiniteScrollDirective;
-    exports.ɵbj = CustomTranslationsModule;
-    exports.ɵbk = CodeEditorComponent;
-    exports.ɵbl = CoreFacade;
-    exports.ɵbm = CodeMirror6Core;
+    exports.ɵbb = DecimalField;
+    exports.ɵbc = StructureModule;
+    exports.ɵbd = HeaderComponent;
+    exports.ɵbe = FooterComponent;
+    exports.ɵbf = InfoSignComponent;
+    exports.ɵbg = NumberLocaleOptions;
+    exports.ɵbh = ThumbnailService;
+    exports.ɵbi = InfiniteScrollModule;
+    exports.ɵbj = InfiniteScrollDirective;
+    exports.ɵbk = CustomTranslationsModule;
+    exports.ɵbl = CodeEditorComponent;
+    exports.ɵbm = CoreFacade;
+    exports.ɵbn = CodeMirror6Core;
     exports.ɵc = LocalizedBignumberImpurePipe;
     exports.ɵd = TokenListModule;
     exports.ɵe = TableColumnsComponent;
     exports.ɵf = InfoSignModule;
-    exports.ɵg = AutocompleteFieldComponent;
-    exports.ɵh = BooleanFieldComponent;
-    exports.ɵi = CalendarFieldComponent;
-    exports.ɵj = ChipsFieldComponent;
-    exports.ɵk = CurrencyFieldComponent;
-    exports.ɵl = BaseFieldComponent;
-    exports.ɵm = DynamicFieldComponent;
-    exports.ɵn = DynamicFormDirective;
-    exports.ɵo = FieldsetComponent;
-    exports.ɵp = FileUploadComponent$1;
-    exports.ɵq = LookupFieldComponent;
-    exports.ɵr = NumberFieldComponent;
-    exports.ɵs = BignumberFieldComponent;
-    exports.ɵt = RadioButtonComponent;
-    exports.ɵu = RowComponent;
-    exports.ɵv = SectionComponent;
-    exports.ɵw = SelectFieldComponent;
-    exports.ɵx = TextAreaFieldComponent;
-    exports.ɵy = TextFieldComponent;
+    exports.ɵg = MouseEventsModule;
+    exports.ɵh = AutocompleteFieldComponent;
+    exports.ɵi = BooleanFieldComponent;
+    exports.ɵj = CalendarFieldComponent;
+    exports.ɵk = ChipsFieldComponent;
+    exports.ɵl = CurrencyFieldComponent;
+    exports.ɵm = BaseFieldComponent;
+    exports.ɵn = DynamicFieldComponent;
+    exports.ɵo = DynamicFormDirective;
+    exports.ɵp = FieldsetComponent;
+    exports.ɵq = FileUploadComponent$1;
+    exports.ɵr = LookupFieldComponent;
+    exports.ɵs = NumberFieldComponent;
+    exports.ɵt = BignumberFieldComponent;
+    exports.ɵu = RadioButtonComponent;
+    exports.ɵv = RowComponent;
+    exports.ɵw = SectionComponent;
+    exports.ɵx = SelectFieldComponent;
+    exports.ɵy = TextAreaFieldComponent;
+    exports.ɵz = TextFieldComponent;
 
     Object.defineProperty(exports, '__esModule', { value: true });