"),c.document.write(r),c.document.write(""),c.document.close()}function o(e,o){var n=t.getCsv(e,o),r=URL.createObjectURL(new Blob(["\ufeff"+n],{type:"text/csv;charset=utf-8;"})),c=document.createElement("a");c.setAttribute("href",r),c.setAttribute("id","download"),c.setAttribute("download","data.csv"),document.body.appendChild(c),c.click(),URL.revokeObjectURL(r)}exports.exportGrid=function(t,n,r,c){"csv"===t?o(n,r):e(n,r,c)};
+},{"tubular-common":"QwmZ"}],"JJaB":[function(require,module,exports) {
"use strict";var e=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}},t=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)Object.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t.default=e,t};Object.defineProperty(exports,"__esModule",{value:!0});var r=e(require("@material-ui/core/IconButton")),n=e(require("@material-ui/core/Menu")),l=e(require("@material-ui/core/MenuItem")),u=e(require("@material-ui/core/Tooltip")),i=e(require("@material-ui/icons/CloudDownload")),o=e(require("@material-ui/icons/Print")),a=t(require("react")),c=require("./GridToolbarFunctions");exports.ExportButton=function(e){var t=e.type,d=e.gridName,f=e.toolTip,m=e.exportTo,s=e.filteredRecordCount,p=a.useState(null),E=p[0],_=p[1],q=function(){return _(null)},C=function(e,r){c.exportGrid(t,e,r,d),q()};return a.createElement(a.Fragment,null,a.createElement(r.default,{disabled:0===s,onClick:function(e){return _(e?e.currentTarget:null)}},"print"===t?a.createElement(u.default,{title:f||"Print"},a.createElement(o.default,null)):a.createElement(u.default,{title:f||"Download"},a.createElement(i.default,null))),a.createElement(n.default,{anchorEl:E,open:Boolean(E),onClose:q},a.createElement(l.default,{onClick:function(){return m(!1,C)}},"Current rows"),a.createElement(l.default,{onClick:function(){return m(!0,C)}},"All rows")))};
},{"@material-ui/core/IconButton":"e+0N","@material-ui/core/Menu":"AKYS","@material-ui/core/MenuItem":"dYSc","@material-ui/core/Tooltip":"FW+n","@material-ui/icons/CloudDownload":"NujB","@material-ui/icons/Print":"iSoA","react":"1n8/","./GridToolbarFunctions":"VsIG"}],"k4Pd":[function(require,module,exports) {
"use strict";var e=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}},t=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)Object.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t.default=e,t};Object.defineProperty(exports,"__esModule",{value:!0});var r=e(require("@material-ui/core/Toolbar")),o=t(require("react")),a=require("uno-react"),i=require("../Filtering/SearchTextInput"),u=require("./ExportButton"),n={mobileSpacer:{flexShrink:"1"},spacer:{flex:"1 1 45%"}},c=800,s=400;exports.GridToolbar=function(e){var t=e.toolbarOptions,p=e.gridName,l=e.grid,d=a.useResolutionSwitch(c,s)[0];return o.createElement(r.default,{"data-testid":"grid-toolbar"},o.createElement("div",{style:d?n.mobileSpacer:n.spacer}),t.customItems&&t.customItems,t.exportButton&&o.createElement(u.ExportButton,{type:"csv",gridName:p,exportTo:l.api.exportTo,filteredRecordCount:l.state.filteredRecordCount,"data-testid":"export-button-csv"}),t.printButton&&o.createElement(u.ExportButton,{type:"print",gridName:p,exportTo:l.api.exportTo,filteredRecordCount:l.state.filteredRecordCount,"data-testid":"export-button-print"}),t.searchText&&o.createElement(i.SearchTextInput,{searchText:l.state.searchText,updateSearchText:l.api.updateSearchText,"data-testid":"search-text-input"}))};
@@ -952,21 +952,19 @@ var e=arguments[3];Object.defineProperty(exports,"__esModule",{value:!0}),export
"use strict";var e=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}},r=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var r={};if(null!=e)for(var a in e)Object.hasOwnProperty.call(e,a)&&(r[a]=e[a]);return r.default=e,r};Object.defineProperty(exports,"__esModule",{value:!0});var a=e(require("@material-ui/core/GridList")),t=e(require("@material-ui/core/Paper")),o=e(require("@material-ui/core/Table")),i=e(require("@material-ui/core/TableHead")),n=e(require("@material-ui/core/TableRow")),l=e(require("@material-ui/styles/makeStyles")),s=r(require("react")),u=require("uno-material-ui"),d=require("uno-react"),c=e(require("../Hooks/useDataGrid")),m=require("../Pagination"),g=require("../Toolbar/GridToolbar"),P=require("../Toolbar/ToolbarOptions"),p=require("./"),f=l.default({linearProgress:{marginTop:"-10px"},root:{overflowX:"auto",width:"100%"}}),b=800,E=400;exports.DataGrid=function(e){var r=e.bodyRenderer,l=e.columns,q=e.deps,v=e.footerRenderer,O=e.dataSource,w=e.toolbarOptions,T=void 0===w?e.toolbarOptions||new P.ToolbarOptions:w,_=e.gridName,h=e.onError,G=e.onRowClick,R=e.storage,k=f({}),y={gridName:_,itemsPerPage:T.itemsPerPage,onError:h,storage:R},L=c.default(l,y,O,q);if(d.useResolutionSwitch(b,E)[0])return T.SetMobileMode(),s.createElement(t.default,{className:k.root},s.createElement(g.GridToolbar,{toolbarOptions:T,grid:L,gridName:_}),s.createElement(u.FixedLinearProgress,{isLoading:L.state.isLoading}),s.createElement(a.default,{cellHeight:"auto",cols:1},L.state.data.map(function(e,r){return s.createElement(p.DataGridCard,{columns:L.state.columns,item:e,onClickCallback:G,key:r})})),s.createElement(m.Paginator,{advancePagination:T.advancePagination,rowsPerPageOptions:T.rowsPerPageOptions,grid:L}));var N=function(e){return s.createElement(o.default,{"data-testid":e+"-paginator"},s.createElement(i.default,null,s.createElement(n.default,null,s.createElement(m.Paginator,{advancePagination:T.advancePagination,rowsPerPageOptions:T.rowsPerPageOptions,grid:L}))))};return s.createElement(t.default,{className:k.root},s.createElement(g.GridToolbar,{gridName:_,toolbarOptions:T,grid:L}),T.topPager&&N("top"),s.createElement("div",{className:k.linearProgress,"data-testid":"linear-progress"},s.createElement(u.FixedLinearProgress,{isLoading:L.state.isLoading})),s.createElement(p.DataGridTable,{grid:L,bodyRenderer:r,footerRenderer:v,onRowClick:G}),T.bottomPager&&N("bottom"))};
},{"@material-ui/core/GridList":"I/dL","@material-ui/core/Paper":"76mt","@material-ui/core/Table":"Amxx","@material-ui/core/TableHead":"BYgd","@material-ui/core/TableRow":"kIQr","@material-ui/styles/makeStyles":"o/Hu","react":"1n8/","uno-material-ui":"Zs25","uno-react":"3aGf","../Hooks/useDataGrid":"+Gex","../Pagination":"2iV4","../Toolbar/GridToolbar":"k4Pd","../Toolbar/ToolbarOptions":"Htt5","./":"9sjF"}],"9sjF":[function(require,module,exports) {
"use strict";function r(r){for(var e in r)exports.hasOwnProperty(e)||(exports[e]=r[e])}Object.defineProperty(exports,"__esModule",{value:!0}),r(require("./DataGridTable")),r(require("./DataGridCard")),r(require("./DataGrid"));
-},{"./DataGridTable":"i5mQ","./DataGridCard":"Hs7E","./DataGrid":"19vP"}],"lH1s":[function(require,module,exports) {
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./IDataGridStorage");exports.IDataGridStorage=e.IDataGridStorage;
-},{"./IDataGridStorage":"pk/C"}],"TVfP":[function(require,module,exports) {
+},{"./DataGridTable":"i5mQ","./DataGridCard":"Hs7E","./DataGrid":"19vP"}],"TVfP":[function(require,module,exports) {
"use strict";function e(e){for(var r in e)exports.hasOwnProperty(r)||(exports[r]=e[r])}Object.defineProperty(exports,"__esModule",{value:!0}),e(require("./SearchTextInput"));
},{"./SearchTextInput":"UDWI"}],"J8AF":[function(require,module,exports) {
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("./GridToolbar");exports.GridToolbar=r.GridToolbar;var o=require("./ToolbarOptions");exports.ToolbarOptions=o.ToolbarOptions;
},{"./GridToolbar":"k4Pd","./ToolbarOptions":"Htt5"}],"7GdH":[function(require,module,exports) {
"use strict";var e=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});var r=e(require("./useDataGrid"));exports.useDataGrid=r.default;var t=e(require("./useGridRefresh"));exports.useGridRefresh=t.default;
},{"./useDataGrid":"+Gex","./useGridRefresh":"6tB+"}],"+fUd":[function(require,module,exports) {
-"use strict";function e(e){for(var r in e)exports.hasOwnProperty(r)||(exports[r]=e[r])}Object.defineProperty(exports,"__esModule",{value:!0}),e(require("./DataGrid")),e(require("./utils")),e(require("./Storage")),e(require("./DataGridInterfaces")),e(require("./Pagination")),e(require("./Filtering")),e(require("./Toolbar")),e(require("./Hooks"));
-},{"./DataGrid":"9sjF","./utils":"ocGl","./Storage":"DIVM","./DataGridInterfaces":"lH1s","./Pagination":"2iV4","./Filtering":"TVfP","./Toolbar":"J8AF","./Hooks":"7GdH"}],"jRiX":[function(require,module,exports) {
+"use strict";function e(e){for(var r in e)exports.hasOwnProperty(r)||(exports[r]=e[r])}Object.defineProperty(exports,"__esModule",{value:!0}),e(require("./DataGrid")),e(require("./utils")),e(require("./Pagination")),e(require("./Filtering")),e(require("./Toolbar")),e(require("./Hooks"));
+},{"./DataGrid":"9sjF","./utils":"ocGl","./Pagination":"2iV4","./Filtering":"TVfP","./Toolbar":"J8AF","./Hooks":"7GdH"}],"jRiX":[function(require,module,exports) {
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tubular-common"),o=[new e.ColumnModel("OrderID",{DataType:e.ColumnDataType.NUMERIC,IsKey:!0,Label:"Id"}),new e.ColumnModel("CustomerName"),new e.ColumnModel("ShippedDate",{DataType:e.ColumnDataType.DATE_TIME}),new e.ColumnModel("ShipperCity"),new e.ColumnModel("Amount",{DataType:e.ColumnDataType.NUMERIC}),new e.ColumnModel("IsShipped",{DataType:e.ColumnDataType.BOOLEAN})];exports.default=o;
},{"tubular-common":"QwmZ"}],"0yRV":[function(require,module,exports) {
-"use strict";var e=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var r={};if(null!=e)for(var t in e)Object.hasOwnProperty.call(e,t)&&(r[t]=e[t]);return r.default=e,r},r=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("react")),o=require("../../src"),u=require("../../src/Storage"),i=r(require("../utils/columns"));exports.default=function(e){var r=e.toolbarOptions,a=e.storage,n=void 0===a?new u.LocalStorage:a,s=e.gridColumns,l=void 0===s?i.default:s,d=e.deps,c=void 0===d?[]:d,f=e.onRowClick,p=void 0===f?function(){return null}:f;return t.createElement(o.DataGrid,{columns:l,dataSource:"https://tubular.azurewebsites.net/api/orders/paged",gridName:"Tubular Grid",toolbarOptions:r,storage:n,deps:c,onRowClick:p})};
-},{"react":"1n8/","../../src":"+fUd","../../src/Storage":"DIVM","../utils/columns":"jRiX"}],"JVGr":[function(require,module,exports) {
+"use strict";var e=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var r={};if(null!=e)for(var t in e)Object.hasOwnProperty.call(e,t)&&(r[t]=e[t]);return r.default=e,r},r=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("react")),o=require("tubular-common"),u=require("../../src"),i=r(require("../utils/columns"));exports.default=function(e){var r=e.toolbarOptions,a=e.storage,n=void 0===a?new o.LocalStorage:a,l=e.gridColumns,s=void 0===l?i.default:l,d=e.deps,c=void 0===d?[]:d,f=e.onRowClick,p=void 0===f?function(){return null}:f;return t.createElement(u.DataGrid,{columns:s,dataSource:"https://tubular.azurewebsites.net/api/orders/paged",gridName:"Tubular Grid",toolbarOptions:r,storage:n,deps:c,onRowClick:p})};
+},{"react":"1n8/","tubular-common":"QwmZ","../../src":"+fUd","../utils/columns":"jRiX"}],"JVGr":[function(require,module,exports) {
"use strict";var e=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}},t=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)Object.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t.default=e,t};Object.defineProperty(exports,"__esModule",{value:!0});var r=e(require("@material-ui/core/Collapse")),i=e(require("@material-ui/core/IconButton")),a=e(require("@material-ui/core/Paper")),o=e(require("@material-ui/core/Tooltip")),l=e(require("@material-ui/core/Typography")),n=e(require("@material-ui/icons/Code")),u=e(require("@material-ui/styles/makeStyles"));require("highlight.js/styles/an-old-hope.css");var c=t(require("react")),d=e(require("react-highlight")),s=require("uno-react"),p=e(require("./CustomizableGrid")),m=u.default({activeIcon:{background:"#165FFB",color:"#fff",height:"40px",marginLeft:"auto",padding:"0px",width:"40px"},code:{fontSize:15},description:{marginBottom:"20px"},icon:{color:"#000",height:"40px",marginLeft:"auto",padding:"0px",width:"40px"},row:{display:"flex",flexDirection:"row",paddingTop:"80px"}});exports.default=function(e){var t=e.data,u=m({});return c.createElement("div",{id:t.id},c.createElement("div",{className:u.row},c.createElement(l.default,{variant:"h5"},s.humanize(t.id)),c.createElement(o.default,{title:t.open?"Hide Code":"View Code"},c.createElement(i.default,{className:t.open?u.activeIcon:u.icon,onClick:t.toggle},c.createElement(n.default,null)))),c.createElement(l.default,{variant:"h6",className:u.description},t.description),c.createElement(r.default,{in:t.open,timeout:"auto"},c.createElement(a.default,null,c.createElement(d.default,{language:"javascript",className:u.code},t.code))),c.createElement(p.default,{toolbarOptions:t.options,gridColumns:t.columns,deps:[t.refresh],onRowClick:t.onRowClick}))};
},{"@material-ui/core/Collapse":"2uPh","@material-ui/core/IconButton":"e+0N","@material-ui/core/Paper":"76mt","@material-ui/core/Tooltip":"FW+n","@material-ui/core/Typography":"/pi2","@material-ui/icons/Code":"vRtn","@material-ui/styles/makeStyles":"o/Hu","highlight.js/styles/an-old-hope.css":"W7b0","react":"1n8/","react-highlight":"Xqwm","uno-react":"3aGf","./CustomizableGrid":"0yRV"}],"NKXr":[function(require,module,exports) {
"use strict";var e=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var r=e(require("react")),t=e(require("./utils/createSvgIcon")),u=(0,t.default)(r.default.createElement("path",{d:"M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"}),"Add");exports.default=u;
@@ -1055,7 +1053,7 @@ var r,e;module.exports=require("./factoryWithThrowingShims")();
},{"@material-ui/core/Paper":"76mt","@material-ui/core/Table":"Amxx","@material-ui/core/TableBody":"0cmi","@material-ui/core/TableCell":"lprt","@material-ui/core/TableHead":"BYgd","@material-ui/core/TableRow":"kIQr","@material-ui/Styles/makeStyles":"6Oq4","react":"1n8/"}],"xpDp":[function(require,module,exports) {
"use strict";var e=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}},a=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var a={};if(null!=e)for(var t in e)Object.hasOwnProperty.call(e,t)&&(a[t]=e[t]);return a.default=e,a};Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("@material-ui/core/Button")),r=e(require("@material-ui/core/Divider")),l=e(require("@material-ui/core/Grid")),n=e(require("@material-ui/core/Paper")),o=e(require("@material-ui/core/Typography")),c=e(require("@material-ui/Styles/makeStyles")),d=a(require("react")),i=e(require("react-highlight")),s=e(require("../../components/ColumnModelTable")),m=e(require("../../components/DataGridProps")),u=e(require("../../components/DataGridProviderProps")),p=e(require("../../components/DataGridTableProps")),f=e(require("../../components/ToolBarOptionsProps")),h=c.default({codeTag:{background:"#F8F8FF",padding:"6px"},container:{margin:"0",padding:30,width:"100%"},paper:{padding:10}}),E='... \nconst MyComponent = () => {\n return (\n
\n \n
\n );\n};\n\n\n/*\n Use the component withRemoteDataSource to wrap your component\n and columns definition among the data obtained from the URL.\n\n withRemoteDataSource will set an initial context for your grid.\n*/\nexport default withRemoteDataSource(BasicFeatures, columns, "https://tubular.azurewebsites.net/api/orders/paged");\n',b='... \nconst MyComponent = () => {\n return (\n
\n \n
\n );\n};\n\n\nexport default withRemoteDataSource(BasicFeatures, columns, localData)',g="https://github.com/unosquare/tubular-react/blob/master/sample/src/data/localData.ts";exports.default=function(){var e=h({});return d.createElement(l.default,{container:!0,className:e.container},d.createElement(l.default,{item:!0,xs:12},d.createElement(n.default,{className:e.paper,style:{overflowX:"auto"}},d.createElement(o.default,{variant:"h4",paragraph:!0}," Column Model "),d.createElement(r.default,null),d.createElement(s.default,null))),d.createElement(l.default,{item:!0,xs:12},d.createElement(n.default,{className:e.paper},d.createElement(o.default,{variant:"h4",paragraph:!0},"DataGrid props"),d.createElement(r.default,null),d.createElement("br",null),d.createElement(o.default,{variant:"subtitle1"},"It's important to use ",d.createElement("code",{className:e.codeTag},"withRemoteDataSource")," or",d.createElement("code",{className:e.codeTag},"withLocalDataSource")," according to the case to fill the ",d.createElement("code",{className:e.codeTag},"")," component with the data.",d.createElement("br",null),"These are all the available props (and their default values) for the",d.createElement("code",{className:e.codeTag},"")," component."),d.createElement(m.default,null),d.createElement("br",null),d.createElement(o.default,{variant:"subtitle1"},d.createElement("i",null,"If you don't define some of the optional props described above, these will not be shown. In the case of "),d.createElement("code",{className:e.codeTag},"bodyRenderer"),",",d.createElement("i",null,"the grid will display its default body; if the",d.createElement("code",{className:e.codeTag},"footerRenderer"),"is not defined, the footer will not be displayed.")))),d.createElement(l.default,{item:!0,xs:12},d.createElement(n.default,{className:e.paper},d.createElement(o.default,{variant:"h4",paragraph:!0},"DataGridProvider props"),d.createElement(r.default,null),d.createElement("br",null),d.createElement(o.default,{variant:"subtitle1"},"Use this component with ",d.createElement("code",{className:e.codeTag},"")," to use a custom layout in your grid. It's important to use ",d.createElement("code",{className:e.codeTag},"withRemoteDataSource")," or ",d.createElement("code",{className:e.codeTag},"withLocalDataSource"),"according to the case to fill the ",d.createElement("code",{className:e.codeTag},""),"component with the data.",d.createElement("br",null),"These are all the available props (and their default values) for the",d.createElement("code",{className:e.codeTag},"")," component."),d.createElement(u.default,null),d.createElement("br",null),d.createElement(o.default,{variant:"subtitle1"},d.createElement("i",null,"If you don't define some of the optional props described above, these will not be shown.")))),d.createElement(l.default,{item:!0,xs:12},d.createElement(n.default,{className:e.paper},d.createElement(o.default,{variant:"h4",paragraph:!0},"DataGridTable props"),d.createElement(r.default,null),d.createElement("br",null),d.createElement(o.default,{variant:"subtitle1"},"These are all the available props (and their default values) for the",d.createElement("code",{className:e.codeTag},"")," component."),d.createElement(p.default,null),d.createElement("br",null),d.createElement(o.default,{variant:"subtitle1"},d.createElement("i",null,"If you don't define some of the optional props described above, these will not be shown. In the case of "),d.createElement("code",{className:e.codeTag},"bodyRenderer"),",",d.createElement("i",null,"the grid will display its default body; if the",d.createElement("code",{className:e.codeTag},"footerRenderer"),"is not defined, the footer will not be displayed.")))),d.createElement(l.default,{item:!0,xs:12},d.createElement(n.default,{className:e.paper},d.createElement(o.default,{variant:"h4",paragraph:!0},"Data Source"),d.createElement(r.default,null),d.createElement("br",null),d.createElement(o.default,{variant:"subtitle1"},d.createElement("code",{className:e.codeTag},"")," requires a wrapper component to retrieve data. Depends on if we use a local data source or a remote data source, these wrappers are:",d.createElement("code",{className:e.codeTag},"withRemoteDataSource"),"component or the",d.createElement("code",{className:e.codeTag},"withLocalDataSource"),"component, which deals with data retrieval on the",d.createElement("code",{className:e.codeTag},"DataGrid")," component.",d.createElement("br",null),d.createElement("br",null),d.createElement(o.default,{variant:"h5",gutterBottom:!0},d.createElement("code",{className:e.codeTag},"withRemoteDataSource")),d.createElement("code",{className:e.codeTag},"withRemoteDataSource"),"needs our ",d.createElement("code",{className:e.codeTag},"DataGrid"),"component, a ",d.createElement("code",{className:e.codeTag},"ColumnModel"),"array and a ",d.createElement("code",{className:e.codeTag},"URL")," which represent a service.",d.createElement("br",null),d.createElement(i.default,{language:"javascript",className:"an-old-hope"},E),d.createElement("br",null),d.createElement(o.default,{variant:"h5",gutterBottom:!0},d.createElement("code",{className:e.codeTag},"LocalDataSource")),d.createElement("code",{className:e.codeTag},"withLocalDataSource"),"needs our ",d.createElement("code",{className:e.codeTag},"DataGrid"),"component, a ",d.createElement("code",{className:e.codeTag},"ColumnModel"),"array and an ",d.createElement("code",{className:e.codeTag},"Array"),"of objects.",d.createElement("br",null),d.createElement(i.default,{language:"javascript",className:"an-old-hope"},b),"See this",d.createElement(t.default,{color:"primary",href:g,target:"_blank"},"example"),"of how to define the array of objects."))),d.createElement(l.default,{item:!0,xs:12},d.createElement(n.default,{className:e.paper},d.createElement(o.default,{variant:"h4",paragraph:!0},"Toolbar options"),d.createElement(r.default,null),d.createElement("br",null),d.createElement(o.default,{variant:"subtitle1"},"If you need to personalize the grid adding, removing or modifying features, ",d.createElement("code",{className:e.codeTag},"ToolBarOptions Class"),"provides several options."),d.createElement(f.default,null),d.createElement("br",null),d.createElement(o.default,{variant:"subtitle1"},d.createElement("i",null,"If you don't define some of the optional props described above, these will set with the default values.")))))};
},{"@material-ui/core/Button":"uzLy","@material-ui/core/Divider":"pRXd","@material-ui/core/Grid":"5xZh","@material-ui/core/Paper":"76mt","@material-ui/core/Typography":"/pi2","@material-ui/Styles/makeStyles":"6Oq4","react":"1n8/","react-highlight":"Xqwm","../../components/ColumnModelTable":"AkVR","../../components/DataGridProps":"WKKG","../../components/DataGridProviderProps":"3CKT","../../components/DataGridTableProps":"ejjh","../../components/ToolBarOptionsProps":"AtZZ"}],"Gxw2":[function(require,module,exports) {
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.quickStart="import React from 'react';\nimport ReactDOM from 'react-dom';\n\nimport DataGrid, { withRemoteDataSource } from 'tubular-react';\nimport { ColumnModel } from 'tubular-common';\nimport { IconButton, Tooltip } from '@material-ui/core';\n\nconst columns = [\n new ColumnModel('OrderID'),\n new ColumnModel('CustomerName'),\n new ColumnModel('ShipperCity')\n];\n\nconst SampleGrid = withRemoteDataSource(\n () => {\n return (\n \n );\n },\n columns,\n 'https://tubular.azurewebsites.net/api/orders/paged'\n);\n\nReactDOM.render(, document.getElementById('root'));",exports.buttonFeatures="import * as React from 'react';\nimport IconButton from '@material-ui/core/IconButton';\nimport Brightness7Rounded from '@material-ui/icons/Brightness7Rounded';\nimport Mood from '@material-ui/icons/Mood';\n\nimport { DataGridProvider, DataGridTable, ToolbarOptions, withRemoteDataSource, renderDateTimeCell } from 'tubular-react';\n\nimport { AggregateFunctions, ColumnDataType, ColumnModel, ColumnSortDirection } from 'tubular-common';\n\n// First of all, you must define your columns model.\nconst columns = [\n new ColumnModel('OrderID',\n {\n DataType: ColumnDataType.NUMERIC,\n Filterable: true,\n IsKey: true,\n Label: 'ID',\n SortDirection: ColumnSortDirection.ASCENDING,\n SortOrder: 1,\n Sortable: true\n }\n ),\n new ColumnModel('CustomerName',\n {\n Aggregate: AggregateFunctions.COUNT,\n Filterable: true,\n Searchable: true,\n Sortable: true\n }\n ),\n new ColumnModel('ShippedDate',\n {\n DataType: ColumnDataType.DATE_TIME,\n Filterable: true,\n Sortable: true\n }\n ),\n new ColumnModel('ShipperCity'),\n new ColumnModel('Amount',\n {\n DataType: ColumnDataType.NUMERIC,\n Sortable: true\n }\n ),\n new ColumnModel('IsShipped',\n {\n DataType: ColumnDataType.BOOLEAN,\n Filterable: true,\n Sortable: true\n }\n )\n];\nconst MyComponent = () => {\n (\n \n {row.OrderID}\n {row.CustomerName}\n \n {renderDateTimeCell(row.ShippedDate, 'MMMM Do yyyy, h:mm:ss a')}\n \n {row.ShipperCity}\n \n {row.Amount || 0}\n \n \n {row.IsShipped ? : }\n \n \n )}\n footerRenderer={(aggregates: any) => (\n \n Total: \n {aggregates && aggregates.CustomerName}\n \n \n \n \n )}\n gridName='SampleButtons'\n >\n \n alert('I can help you to add features to your datagrid.')}>\n \n \n alert('Happy codes, have a nice day')}>\n \n \n \n \n};\n\n/*\n Use the component withRemoteDataSource to wrap your component\n and columns definition among the data obtained from the URL.\n\n withRemoteDataSource will set an initial context for your grid.\n*/\nexport default withRemoteDataSource(MyComponent, columns, 'http://tubular.azurewebsites.net/api/orders/paged');",exports.simpleFeatures="import React from 'react';\nimport { Snackbar, TableCell, TableRow } from '@material-ui/core';\nimport CheckBox from '@material-ui/icons/CheckBox';\nimport CheckBoxOutlineBlank from '@material-ui/icons/CheckBoxOutlineBlank';\nimport { DataGridProvider, DataGridTable, ToolbarOptions, withRemoteDataSource, renderDateTimeCell } from 'tubular-react';\n\nimport {\n AggregateFunctions,\n ColumnDataType,\n ColumnModel,\n ColumnSortDirection\n} from 'tubular-common';\n\nconst columns = [\n new ColumnModel('OrderID', {\n DataType: ColumnDataType.NUMERIC,\n Filterable: true,\n IsKey: true,\n Label: 'ID',\n SortDirection: ColumnSortDirection.ASCENDING,\n SortOrder: 1,\n Sortable: true\n }),\n new ColumnModel('CustomerName', {\n Aggregate: AggregateFunctions.COUNT,\n Filterable: true,\n Searchable: true,\n Sortable: true\n }),\n new ColumnModel('ShippedDate', {\n DataType: ColumnDataType.DATE_TIME,\n Filterable: true,\n Sortable: true\n }),\n new ColumnModel('ShipperCity'),\n new ColumnModel('Amount', {\n DataType: ColumnDataType.NUMERIC,\n Sortable: true\n }),\n new ColumnModel('IsShipped', {\n DataType: ColumnDataType.BOOLEAN,\n Filterable: true,\n Sortable: true\n })\n];\n\nclass SampleFeatures extends React.Component {\n state = {\n errorMessage: null\n };\n\n componentWillReceiveProps(nextProps: any) {\n this.setState({ errorMessage: nextProps.error });\n }\n\n render() {\n const { errorMessage } = this.state;\n\n return (\n