dattatable 2.12.9 → 2.12.10

package/build/dashboard/tiles.js

@@ -224,10 +224,30 @@ var Tiles = /** @class */ (function () {
         var columns = [{
                 data: null,
                 render: function (data, type, row) {
+                    // See if this is the card
                     if (type === 'display') {
                         // Return the card element
                         return gd_sprest_bs_1.Components.Card(_this.generateCard(data)).el;
                     }
+                    // Else, see if this is filter/sort
+                    else if (type === 'filter') {
+                        // Parse the fields
+                        var fields_1 = {};
+                        (_this._props.bodyFields || []).forEach(function (field) { fields_1[field] = true; });
+                        (_this._props.filterFields || []).forEach(function (field) { fields_1[field] = true; });
+                        (_this._props.titleFields || []).forEach(function (field) { fields_1[field] = true; });
+                        (_this._props.subTitleFields || []).forEach(function (field) { fields_1[field] = true; });
+                        // Parse the fields
+                        var values_1 = [];
+                        Object.keys(fields_1).forEach(function (field) {
+                            if (row[field]) {
+                                // Add the value
+                                values_1.push(row[field]);
+                            }
+                        });
+                        // Return the values
+                        return values_1.join(' ');
+                    }
                     return data;
                 }
             }];

package/dist/dattatable.js

@@ -258,7 +258,7 @@ eval("{\r\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\r\
 (__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-eval("{\r\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\r\nexports.Tiles = void 0;\r\nvar dtnet = __webpack_require__(/*! datatables.net-dt */ \"./node_modules/.pnpm/datatables.net-dt@3.1.5/node_modules/datatables.net-dt/js/dataTables.dataTables.js\");\r\nvar gd_sprest_bs_1 = __webpack_require__(/*! gd-sprest-bs */ \"./node_modules/.pnpm/gd-sprest-bs@10.15.96_@popperjs+core@2.11.8/node_modules/gd-sprest-bs/build/index.js\");\r\n// DataTables.net\r\n__webpack_require__(/*! datatables.net-bs5 */ \"./node_modules/.pnpm/datatables.net-bs5@3.1.5/node_modules/datatables.net-bs5/js/dataTables.bootstrap5.min.js\");\r\n/**\r\n * Tiles\r\n */\r\nvar Tiles = /** @class */ (function () {\r\n    // Constructor\r\n    function Tiles(props) {\r\n        this._datatable = null;\r\n        // Save the properties\r\n        this._props = props;\r\n        // Render the tile\r\n        this.render(this._props.items);\r\n    }\r\n    // Adds a tile to the table\r\n    Tiles.prototype.add = function (items) {\r\n        // Add the item\r\n        this._datatable.rows.add(items);\r\n        // Redraw the table to show the new tile\r\n        this._datatable.draw(false);\r\n    };\r\n    // Filters the status\r\n    Tiles.prototype.filter = function (idx, value) {\r\n        if (value === void 0) { value = \"\"; }\r\n        // Set the filter\r\n        this._datatable.column(idx).search(value.replace(/[-[/\\]{}()*+?.,\\\\^$#\\s]/g, '\\\\$&'), true, false).draw();\r\n    };\r\n    // Filters the status\r\n    Tiles.prototype.filterExact = function (idx, value) {\r\n        if (value === void 0) { value = \"\"; }\r\n        // Set the filter\r\n        this._datatable.column(idx).search(\"^\" + value.replace(/[-[/\\]{}()*+?.,\\\\^$#\\s]/g, '\\\\$&') + \"$\", true, false).draw();\r\n    };\r\n    // Filters multiple values against the status\r\n    Tiles.prototype.filterMulti = function (idx, values) {\r\n        if (values === void 0) { values = []; }\r\n        // Parse the values\r\n        for (var i = 0; i < values.length; i++) {\r\n            // Update the value\r\n            values[i] = values[i].replace(/\\|/g, '\\\\$&');\r\n        }\r\n        // Filter the values\r\n        this.filter(idx, values.join('|'));\r\n    };\r\n    // Filters multiple values against the status\r\n    Tiles.prototype.filterMultiExact = function (idx, values) {\r\n        if (values === void 0) { values = []; }\r\n        // Parse the values\r\n        for (var i = 0; i < values.length; i++) {\r\n            // Update the value\r\n            values[i] = values[i].replace(/\\|/g, '\\\\$&');\r\n        }\r\n        // Filter the values\r\n        this._datatable.column(idx).search(\"^(\" + values.join('|') + \")$\", true, false).draw();\r\n    };\r\n    // Generate the card properties\r\n    Tiles.prototype.generateCard = function (item) {\r\n        var _this = this;\r\n        var filterValues = [];\r\n        // See if the filter field is specified\r\n        if (this._props.filterFields) {\r\n            // Parse the fields\r\n            for (var i = 0; i < this._props.filterFields.length; i++) {\r\n                var filterField = this._props.filterFields[i];\r\n                // Get the filter values\r\n                var filters = item[filterField] || [];\r\n                filters = filters[\"results\"] || [filters];\r\n                // Append the values\r\n                filterValues = filterValues.concat(filters);\r\n            }\r\n        }\r\n        // See if the body fields exist\r\n        var bodyContent = this._props.bodyTemplate || \"\";\r\n        if (this._props.bodyFields) {\r\n            // Parse the fields\r\n            for (var i = 0; i < this._props.bodyFields.length; i++) {\r\n                var field = this._props.bodyFields[i];\r\n                var value = typeof (item[field]) != \"undefined\" ? item[field] : \"\";\r\n                // See if there is a template\r\n                if (this._props.bodyTemplate) {\r\n                    // Replace the values\r\n                    var pattern = new RegExp(\"({\" + field + \"})\", \"g\");\r\n                    bodyContent = bodyContent.replace(pattern, value);\r\n                }\r\n                else {\r\n                    // Append the value\r\n                    bodyContent += value;\r\n                }\r\n            }\r\n        }\r\n        // See if the sub-title fields exist\r\n        var subTitleContent = this._props.subTitleTemplate || \"\";\r\n        if (this._props.subTitleFields) {\r\n            // Parse the fields\r\n            for (var i = 0; i < this._props.subTitleFields.length; i++) {\r\n                var field = this._props.subTitleFields[i];\r\n                var value = typeof (item[field]) != \"undefined\" ? item[field] : \"\";\r\n                // See if there is a template\r\n                if (this._props.subTitleTemplate) {\r\n                    // Replace the values\r\n                    var pattern = new RegExp(\"({\" + field + \"})\", \"g\");\r\n                    subTitleContent = subTitleContent.replace(pattern, value);\r\n                }\r\n                else {\r\n                    // Append the value\r\n                    subTitleContent += value;\r\n                }\r\n            }\r\n        }\r\n        // See if the sub-title fields exist\r\n        var titleContent = this._props.titleTemplate || \"\";\r\n        if (this._props.titleFields) {\r\n            // Parse the fields\r\n            for (var i = 0; i < this._props.titleFields.length; i++) {\r\n                var field = this._props.titleFields[i];\r\n                var value = typeof (item[field]) != \"undefined\" ? item[field] : \"\";\r\n                // See if there is a template\r\n                if (this._props.titleTemplate) {\r\n                    // Replace the values\r\n                    var pattern = new RegExp(\"({\" + field + \"})\", \"g\");\r\n                    titleContent = titleContent.replace(pattern, value);\r\n                }\r\n                else {\r\n                    // Append the value\r\n                    titleContent += value;\r\n                }\r\n            }\r\n        }\r\n        // Set the card props\r\n        var cardProps = {\r\n            onRender: function (el, card) {\r\n                // Add the default class\r\n                el.classList.add(\"h-100\");\r\n                // Set the class name\r\n                if (_this._props.classNameCard) {\r\n                    _this._props.classNameCard.trim().split(' ').forEach(function (className) {\r\n                        // Add the class name\r\n                        el.classList.add(className);\r\n                    });\r\n                }\r\n                // See if filters exist\r\n                if (filterValues && filterValues.length > 0) {\r\n                    // Set the data filter value\r\n                    el.setAttribute(\"data-filter\", filterValues.join('|'));\r\n                }\r\n                // Call the event\r\n                _this._props.onCardRendered ? _this._props.onCardRendered(el, card) : null;\r\n            },\r\n            body: [{\r\n                    className: this._props.classNameBody,\r\n                    content: bodyContent,\r\n                    data: item,\r\n                    subTitle: subTitleContent,\r\n                    title: titleContent,\r\n                    onRender: function (el, card) {\r\n                        var item = card.data;\r\n                        // Call the events\r\n                        _this._props.onTitleRendered ? _this._props.onTitleRendered(el.querySelector(\".card-title\"), item) : null;\r\n                        _this._props.onSubTitleRendered ? _this._props.onSubTitleRendered(el.querySelector(\".card-subtitle\"), item) : null;\r\n                        _this._props.onBodyRendered ? _this._props.onBodyRendered(el, item) : null;\r\n                    }\r\n                }],\r\n            onClick: function (card, ev) {\r\n                // Call the event\r\n                _this._props.onClick ? _this._props.onClick(ev.currentTarget, card) : null;\r\n            }\r\n        };\r\n        // See if we are showing the header\r\n        var showHeader = typeof (this._props.showHeader) === \"boolean\" ? this._props.showHeader : true;\r\n        if (showHeader) {\r\n            cardProps.header = {\r\n                className: this._props.classNameHeader,\r\n                onRender: function (el) {\r\n                    _this._props.onHeaderRendered ? _this._props.onHeaderRendered(el, item) : null;\r\n                }\r\n            };\r\n        }\r\n        // See if we are showing the footer\r\n        var showFooter = typeof (this._props.showFooter) === \"boolean\" ? this._props.showFooter : true;\r\n        if (showFooter) {\r\n            cardProps.footer = {\r\n                className: this._props.classNameFooter,\r\n                onRender: function (el) {\r\n                    _this._props.onFooterRendered ? _this._props.onFooterRendered(el, item) : null;\r\n                }\r\n            };\r\n        }\r\n        // Call the events\r\n        this._props.onCardBodyRendering ? this._props.onCardBodyRendering(cardProps.body[0], item) : null;\r\n        this._props.onCardRendering ? this._props.onCardRendering(cardProps, item) : null;\r\n        // Return the card properties\r\n        return cardProps;\r\n    };\r\n    // Returns the default properties for the datatable\r\n    Tiles.prototype.getDefaultProperties = function (items) {\r\n        var _this = this;\r\n        // Get the column size\r\n        var colSize = this._props.colSize > 0 ? this._props.colSize : 4;\r\n        if (colSize > 4) {\r\n            colSize = 4;\r\n        }\r\n        // Determine the paging based on the column size\r\n        var lengthMenu = [];\r\n        switch (colSize) {\r\n            case 1:\r\n                lengthMenu = [4, 8, 16, 32];\r\n                break;\r\n            case 2:\r\n                lengthMenu = [8, 16, 32, 64];\r\n                break;\r\n            case 3:\r\n                lengthMenu = [12, 24, 48, 96];\r\n                break;\r\n            case 4:\r\n                lengthMenu = [16, 32, 64, 128];\r\n                break;\r\n        }\r\n        // Set the columns\r\n        var columns = [{\r\n                data: null,\r\n                render: function (data, type, row) {\r\n                    if (type === 'display') {\r\n                        // Return the card element\r\n                        return gd_sprest_bs_1.Components.Card(_this.generateCard(data)).el;\r\n                    }\r\n                    return data;\r\n                }\r\n            }];\r\n        // Parse the filter columns\r\n        var filterFields = this._props.filterFields || [];\r\n        for (var i = 0; i < filterFields.length; i++) {\r\n            // Append the hidden column\r\n            columns.push({\r\n                data: filterFields[i],\r\n                visible: false\r\n            });\r\n        }\r\n        // Return the default properties\r\n        return {\r\n            columns: columns,\r\n            data: items,\r\n            lengthMenu: lengthMenu,\r\n            pageLength: lengthMenu[0],\r\n            language: {\r\n                lengthMenu: \"_MENU_\",\r\n                paginate: {\r\n                    first: \"First\",\r\n                    last: \"Last\",\r\n                    next: \"Next\",\r\n                    previous: \"Previous\"\r\n                }\r\n            },\r\n            layout: {\r\n                top: null,\r\n                topStart: null,\r\n                topEnd: null,\r\n                bottom: \"info\",\r\n                bottomStart: \"pageLength\",\r\n                bottomEnd: {\r\n                    paging: {\r\n                        type: \"full_numbers\"\r\n                    }\r\n                }\r\n            },\r\n            createdRow: function (row, data, rowIdx) {\r\n                var _a;\r\n                // Add the default classes\r\n                row.classList.add(\"d-flex\");\r\n                row.classList.add(\"col\");\r\n                (_a = row.firstChild) === null || _a === void 0 ? void 0 : _a.classList.add(\"h-100\");\r\n                // Add the class based on the column size\r\n                switch (colSize) {\r\n                    case 1:\r\n                        row.classList.add(\"col-12\");\r\n                        break;\r\n                    case 2:\r\n                        row.classList.add(\"col-6\");\r\n                        break;\r\n                    case 3:\r\n                        row.classList.add(\"col-4\");\r\n                        break;\r\n                    case 4:\r\n                        row.classList.add(\"col-3\");\r\n                        break;\r\n                }\r\n            }\r\n        };\r\n    };\r\n    // Method to reload the data\r\n    Tiles.prototype.refresh = function (items) {\r\n        if (items === void 0) { items = []; }\r\n        // See if the datatable exists\r\n        if (this._datatable != null) {\r\n            // Clear the datatable\r\n            this._datatable.clear();\r\n            this._datatable.destroy();\r\n            this._datatable = null;\r\n        }\r\n        // Clear the datatable element\r\n        while (this._props.el.firstChild) {\r\n            this._props.el.removeChild(this._props.el.firstChild);\r\n        }\r\n        // Render the accordion\r\n        this.render(items);\r\n    };\r\n    // Renders the dashboard\r\n    Tiles.prototype.render = function (items) {\r\n        var _this = this;\r\n        var _a;\r\n        // Create the datatable element\r\n        var el = document.createElement(\"div\");\r\n        el.classList.add(\"bs\");\r\n        (_a = this._props) === null || _a === void 0 ? void 0 : _a.el.appendChild(el);\r\n        // Set the table element\r\n        var elTable = document.createElement(\"table\");\r\n        elTable.innerHTML = \"<thead><th></th></thead><tbody class=\\\"row\\\"></tbody>\";\r\n        el.appendChild(elTable);\r\n        // Get the default properties\r\n        var dtProps = this.getDefaultProperties(items);\r\n        // Call the rendering event\r\n        dtProps = this._props.onRendering ? this._props.onRendering(dtProps) : dtProps;\r\n        // Render the table\r\n        var dtLib = dtnet[\"DataTable\"] || dtnet;\r\n        this._datatable = new dtLib(elTable, dtProps);\r\n        // Call the rendered event in a separate thread to ensure the dashboard object is created\r\n        setTimeout(function () {\r\n            _this._props.onRendered ? _this._props.onRendered(_this._props.el) : null;\r\n        }, 50);\r\n    };\r\n    // Searches the tile\r\n    Tiles.prototype.search = function (value) {\r\n        if (value === void 0) { value = \"\"; }\r\n        // Search the table\r\n        this._datatable.search(value).draw();\r\n    };\r\n    return Tiles;\r\n}());\r\nexports.Tiles = Tiles;\r\n\n\n//# sourceURL=webpack://dattatable/./build/dashboard/tiles.js?\n}");
+eval("{\r\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\r\nexports.Tiles = void 0;\r\nvar dtnet = __webpack_require__(/*! datatables.net-dt */ \"./node_modules/.pnpm/datatables.net-dt@3.1.5/node_modules/datatables.net-dt/js/dataTables.dataTables.js\");\r\nvar gd_sprest_bs_1 = __webpack_require__(/*! gd-sprest-bs */ \"./node_modules/.pnpm/gd-sprest-bs@10.15.96_@popperjs+core@2.11.8/node_modules/gd-sprest-bs/build/index.js\");\r\n// DataTables.net\r\n__webpack_require__(/*! datatables.net-bs5 */ \"./node_modules/.pnpm/datatables.net-bs5@3.1.5/node_modules/datatables.net-bs5/js/dataTables.bootstrap5.min.js\");\r\n/**\r\n * Tiles\r\n */\r\nvar Tiles = /** @class */ (function () {\r\n    // Constructor\r\n    function Tiles(props) {\r\n        this._datatable = null;\r\n        // Save the properties\r\n        this._props = props;\r\n        // Render the tile\r\n        this.render(this._props.items);\r\n    }\r\n    // Adds a tile to the table\r\n    Tiles.prototype.add = function (items) {\r\n        // Add the item\r\n        this._datatable.rows.add(items);\r\n        // Redraw the table to show the new tile\r\n        this._datatable.draw(false);\r\n    };\r\n    // Filters the status\r\n    Tiles.prototype.filter = function (idx, value) {\r\n        if (value === void 0) { value = \"\"; }\r\n        // Set the filter\r\n        this._datatable.column(idx).search(value.replace(/[-[/\\]{}()*+?.,\\\\^$#\\s]/g, '\\\\$&'), true, false).draw();\r\n    };\r\n    // Filters the status\r\n    Tiles.prototype.filterExact = function (idx, value) {\r\n        if (value === void 0) { value = \"\"; }\r\n        // Set the filter\r\n        this._datatable.column(idx).search(\"^\" + value.replace(/[-[/\\]{}()*+?.,\\\\^$#\\s]/g, '\\\\$&') + \"$\", true, false).draw();\r\n    };\r\n    // Filters multiple values against the status\r\n    Tiles.prototype.filterMulti = function (idx, values) {\r\n        if (values === void 0) { values = []; }\r\n        // Parse the values\r\n        for (var i = 0; i < values.length; i++) {\r\n            // Update the value\r\n            values[i] = values[i].replace(/\\|/g, '\\\\$&');\r\n        }\r\n        // Filter the values\r\n        this.filter(idx, values.join('|'));\r\n    };\r\n    // Filters multiple values against the status\r\n    Tiles.prototype.filterMultiExact = function (idx, values) {\r\n        if (values === void 0) { values = []; }\r\n        // Parse the values\r\n        for (var i = 0; i < values.length; i++) {\r\n            // Update the value\r\n            values[i] = values[i].replace(/\\|/g, '\\\\$&');\r\n        }\r\n        // Filter the values\r\n        this._datatable.column(idx).search(\"^(\" + values.join('|') + \")$\", true, false).draw();\r\n    };\r\n    // Generate the card properties\r\n    Tiles.prototype.generateCard = function (item) {\r\n        var _this = this;\r\n        var filterValues = [];\r\n        // See if the filter field is specified\r\n        if (this._props.filterFields) {\r\n            // Parse the fields\r\n            for (var i = 0; i < this._props.filterFields.length; i++) {\r\n                var filterField = this._props.filterFields[i];\r\n                // Get the filter values\r\n                var filters = item[filterField] || [];\r\n                filters = filters[\"results\"] || [filters];\r\n                // Append the values\r\n                filterValues = filterValues.concat(filters);\r\n            }\r\n        }\r\n        // See if the body fields exist\r\n        var bodyContent = this._props.bodyTemplate || \"\";\r\n        if (this._props.bodyFields) {\r\n            // Parse the fields\r\n            for (var i = 0; i < this._props.bodyFields.length; i++) {\r\n                var field = this._props.bodyFields[i];\r\n                var value = typeof (item[field]) != \"undefined\" ? item[field] : \"\";\r\n                // See if there is a template\r\n                if (this._props.bodyTemplate) {\r\n                    // Replace the values\r\n                    var pattern = new RegExp(\"({\" + field + \"})\", \"g\");\r\n                    bodyContent = bodyContent.replace(pattern, value);\r\n                }\r\n                else {\r\n                    // Append the value\r\n                    bodyContent += value;\r\n                }\r\n            }\r\n        }\r\n        // See if the sub-title fields exist\r\n        var subTitleContent = this._props.subTitleTemplate || \"\";\r\n        if (this._props.subTitleFields) {\r\n            // Parse the fields\r\n            for (var i = 0; i < this._props.subTitleFields.length; i++) {\r\n                var field = this._props.subTitleFields[i];\r\n                var value = typeof (item[field]) != \"undefined\" ? item[field] : \"\";\r\n                // See if there is a template\r\n                if (this._props.subTitleTemplate) {\r\n                    // Replace the values\r\n                    var pattern = new RegExp(\"({\" + field + \"})\", \"g\");\r\n                    subTitleContent = subTitleContent.replace(pattern, value);\r\n                }\r\n                else {\r\n                    // Append the value\r\n                    subTitleContent += value;\r\n                }\r\n            }\r\n        }\r\n        // See if the sub-title fields exist\r\n        var titleContent = this._props.titleTemplate || \"\";\r\n        if (this._props.titleFields) {\r\n            // Parse the fields\r\n            for (var i = 0; i < this._props.titleFields.length; i++) {\r\n                var field = this._props.titleFields[i];\r\n                var value = typeof (item[field]) != \"undefined\" ? item[field] : \"\";\r\n                // See if there is a template\r\n                if (this._props.titleTemplate) {\r\n                    // Replace the values\r\n                    var pattern = new RegExp(\"({\" + field + \"})\", \"g\");\r\n                    titleContent = titleContent.replace(pattern, value);\r\n                }\r\n                else {\r\n                    // Append the value\r\n                    titleContent += value;\r\n                }\r\n            }\r\n        }\r\n        // Set the card props\r\n        var cardProps = {\r\n            onRender: function (el, card) {\r\n                // Add the default class\r\n                el.classList.add(\"h-100\");\r\n                // Set the class name\r\n                if (_this._props.classNameCard) {\r\n                    _this._props.classNameCard.trim().split(' ').forEach(function (className) {\r\n                        // Add the class name\r\n                        el.classList.add(className);\r\n                    });\r\n                }\r\n                // See if filters exist\r\n                if (filterValues && filterValues.length > 0) {\r\n                    // Set the data filter value\r\n                    el.setAttribute(\"data-filter\", filterValues.join('|'));\r\n                }\r\n                // Call the event\r\n                _this._props.onCardRendered ? _this._props.onCardRendered(el, card) : null;\r\n            },\r\n            body: [{\r\n                    className: this._props.classNameBody,\r\n                    content: bodyContent,\r\n                    data: item,\r\n                    subTitle: subTitleContent,\r\n                    title: titleContent,\r\n                    onRender: function (el, card) {\r\n                        var item = card.data;\r\n                        // Call the events\r\n                        _this._props.onTitleRendered ? _this._props.onTitleRendered(el.querySelector(\".card-title\"), item) : null;\r\n                        _this._props.onSubTitleRendered ? _this._props.onSubTitleRendered(el.querySelector(\".card-subtitle\"), item) : null;\r\n                        _this._props.onBodyRendered ? _this._props.onBodyRendered(el, item) : null;\r\n                    }\r\n                }],\r\n            onClick: function (card, ev) {\r\n                // Call the event\r\n                _this._props.onClick ? _this._props.onClick(ev.currentTarget, card) : null;\r\n            }\r\n        };\r\n        // See if we are showing the header\r\n        var showHeader = typeof (this._props.showHeader) === \"boolean\" ? this._props.showHeader : true;\r\n        if (showHeader) {\r\n            cardProps.header = {\r\n                className: this._props.classNameHeader,\r\n                onRender: function (el) {\r\n                    _this._props.onHeaderRendered ? _this._props.onHeaderRendered(el, item) : null;\r\n                }\r\n            };\r\n        }\r\n        // See if we are showing the footer\r\n        var showFooter = typeof (this._props.showFooter) === \"boolean\" ? this._props.showFooter : true;\r\n        if (showFooter) {\r\n            cardProps.footer = {\r\n                className: this._props.classNameFooter,\r\n                onRender: function (el) {\r\n                    _this._props.onFooterRendered ? _this._props.onFooterRendered(el, item) : null;\r\n                }\r\n            };\r\n        }\r\n        // Call the events\r\n        this._props.onCardBodyRendering ? this._props.onCardBodyRendering(cardProps.body[0], item) : null;\r\n        this._props.onCardRendering ? this._props.onCardRendering(cardProps, item) : null;\r\n        // Return the card properties\r\n        return cardProps;\r\n    };\r\n    // Returns the default properties for the datatable\r\n    Tiles.prototype.getDefaultProperties = function (items) {\r\n        var _this = this;\r\n        // Get the column size\r\n        var colSize = this._props.colSize > 0 ? this._props.colSize : 4;\r\n        if (colSize > 4) {\r\n            colSize = 4;\r\n        }\r\n        // Determine the paging based on the column size\r\n        var lengthMenu = [];\r\n        switch (colSize) {\r\n            case 1:\r\n                lengthMenu = [4, 8, 16, 32];\r\n                break;\r\n            case 2:\r\n                lengthMenu = [8, 16, 32, 64];\r\n                break;\r\n            case 3:\r\n                lengthMenu = [12, 24, 48, 96];\r\n                break;\r\n            case 4:\r\n                lengthMenu = [16, 32, 64, 128];\r\n                break;\r\n        }\r\n        // Set the columns\r\n        var columns = [{\r\n                data: null,\r\n                render: function (data, type, row) {\r\n                    // See if this is the card\r\n                    if (type === 'display') {\r\n                        // Return the card element\r\n                        return gd_sprest_bs_1.Components.Card(_this.generateCard(data)).el;\r\n                    }\r\n                    // Else, see if this is filter/sort\r\n                    else if (type === 'filter') {\r\n                        // Parse the fields\r\n                        var fields_1 = {};\r\n                        (_this._props.bodyFields || []).forEach(function (field) { fields_1[field] = true; });\r\n                        (_this._props.filterFields || []).forEach(function (field) { fields_1[field] = true; });\r\n                        (_this._props.titleFields || []).forEach(function (field) { fields_1[field] = true; });\r\n                        (_this._props.subTitleFields || []).forEach(function (field) { fields_1[field] = true; });\r\n                        // Parse the fields\r\n                        var values_1 = [];\r\n                        Object.keys(fields_1).forEach(function (field) {\r\n                            if (row[field]) {\r\n                                // Add the value\r\n                                values_1.push(row[field]);\r\n                            }\r\n                        });\r\n                        // Return the values\r\n                        return values_1.join(' ');\r\n                    }\r\n                    return data;\r\n                }\r\n            }];\r\n        // Parse the filter columns\r\n        var filterFields = this._props.filterFields || [];\r\n        for (var i = 0; i < filterFields.length; i++) {\r\n            // Append the hidden column\r\n            columns.push({\r\n                data: filterFields[i],\r\n                visible: false\r\n            });\r\n        }\r\n        // Return the default properties\r\n        return {\r\n            columns: columns,\r\n            data: items,\r\n            lengthMenu: lengthMenu,\r\n            pageLength: lengthMenu[0],\r\n            language: {\r\n                lengthMenu: \"_MENU_\",\r\n                paginate: {\r\n                    first: \"First\",\r\n                    last: \"Last\",\r\n                    next: \"Next\",\r\n                    previous: \"Previous\"\r\n                }\r\n            },\r\n            layout: {\r\n                top: null,\r\n                topStart: null,\r\n                topEnd: null,\r\n                bottom: \"info\",\r\n                bottomStart: \"pageLength\",\r\n                bottomEnd: {\r\n                    paging: {\r\n                        type: \"full_numbers\"\r\n                    }\r\n                }\r\n            },\r\n            createdRow: function (row, data, rowIdx) {\r\n                var _a;\r\n                // Add the default classes\r\n                row.classList.add(\"d-flex\");\r\n                row.classList.add(\"col\");\r\n                (_a = row.firstChild) === null || _a === void 0 ? void 0 : _a.classList.add(\"h-100\");\r\n                // Add the class based on the column size\r\n                switch (colSize) {\r\n                    case 1:\r\n                        row.classList.add(\"col-12\");\r\n                        break;\r\n                    case 2:\r\n                        row.classList.add(\"col-6\");\r\n                        break;\r\n                    case 3:\r\n                        row.classList.add(\"col-4\");\r\n                        break;\r\n                    case 4:\r\n                        row.classList.add(\"col-3\");\r\n                        break;\r\n                }\r\n            }\r\n        };\r\n    };\r\n    // Method to reload the data\r\n    Tiles.prototype.refresh = function (items) {\r\n        if (items === void 0) { items = []; }\r\n        // See if the datatable exists\r\n        if (this._datatable != null) {\r\n            // Clear the datatable\r\n            this._datatable.clear();\r\n            this._datatable.destroy();\r\n            this._datatable = null;\r\n        }\r\n        // Clear the datatable element\r\n        while (this._props.el.firstChild) {\r\n            this._props.el.removeChild(this._props.el.firstChild);\r\n        }\r\n        // Render the accordion\r\n        this.render(items);\r\n    };\r\n    // Renders the dashboard\r\n    Tiles.prototype.render = function (items) {\r\n        var _this = this;\r\n        var _a;\r\n        // Create the datatable element\r\n        var el = document.createElement(\"div\");\r\n        el.classList.add(\"bs\");\r\n        (_a = this._props) === null || _a === void 0 ? void 0 : _a.el.appendChild(el);\r\n        // Set the table element\r\n        var elTable = document.createElement(\"table\");\r\n        elTable.innerHTML = \"<thead><th></th></thead><tbody class=\\\"row\\\"></tbody>\";\r\n        el.appendChild(elTable);\r\n        // Get the default properties\r\n        var dtProps = this.getDefaultProperties(items);\r\n        // Call the rendering event\r\n        dtProps = this._props.onRendering ? this._props.onRendering(dtProps) : dtProps;\r\n        // Render the table\r\n        var dtLib = dtnet[\"DataTable\"] || dtnet;\r\n        this._datatable = new dtLib(elTable, dtProps);\r\n        // Call the rendered event in a separate thread to ensure the dashboard object is created\r\n        setTimeout(function () {\r\n            _this._props.onRendered ? _this._props.onRendered(_this._props.el) : null;\r\n        }, 50);\r\n    };\r\n    // Searches the tile\r\n    Tiles.prototype.search = function (value) {\r\n        if (value === void 0) { value = \"\"; }\r\n        // Search the table\r\n        this._datatable.search(value).draw();\r\n    };\r\n    return Tiles;\r\n}());\r\nexports.Tiles = Tiles;\r\n\n\n//# sourceURL=webpack://dattatable/./build/dashboard/tiles.js?\n}");
 
 /***/ },