@webiny/ui 5.36.2 → 5.37.0-beta.1

package/DataTable/DataTable.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { DataTableCellProps } from "@rmwc/data-table";
-import { OnChangeFn, SortingState } from "@tanstack/react-table";
+import { OnChangeFn, SortingState, Row } from "@tanstack/react-table";
 import "@rmwc/data-table/data-table.css";
 interface Column<T> {
     header: string | number | JSX.Element;
@@ -13,23 +13,63 @@ export declare type Columns<T> = {
     [P in keyof T]?: Column<T>;
 };
 export declare type DefaultData = {
+    id: string;
     selectable?: boolean;
 };
 export declare type Sorting = SortingState;
 export declare type OnSortingChange = OnChangeFn<Sorting>;
 interface Props<T> {
+    /**
+     * Show or hide borders.
+     */
+    bordered?: boolean;
+    /**
+     * Controls whether "select all" action is allowed.
+     */
+    canSelectAllRows?: boolean;
+    /**
+     * Columns definition.
+     */
     columns: Columns<T>;
+    /**
+     * Data to display into DataTable body.
+     */
     data: T[];
-    onSelectRow?: (rows: T[] | []) => void;
+    /**
+     * Callback that is called to determine if the row is selectable.
+     */
+    isRowSelectable?: (row: Row<T>) => boolean;
+    /**
+     * Render the skeleton state at the initial data loading.
+     */
     loadingInitial?: boolean;
+    /**
+     * Callback that receives the selected rows.
+     */
+    onSelectRow?: (rows: T[]) => void;
+    /**
+     * Callback that receives current sorting state.
+     */
+    onSortingChange?: OnSortingChange;
+    /**
+     * Selected rows.
+     */
+    selectedRows?: T[];
+    /**
+     * Sorting state.
+     */
+    sorting?: Sorting;
+    /**
+     * The number of columns to affix to the side of the table when scrolling.
+     */
     stickyColumns?: number;
+    /**
+     * The number of rows to affix to the top of the table when scrolling.
+     */
     stickyRows?: number;
-    bordered?: boolean;
-    sorting?: Sorting;
-    onSortingChange?: OnSortingChange;
 }
 export interface ColumnDirectionProps {
     direction?: "asc" | "desc";
 }
-export declare const DataTable: <T extends Object & DefaultData>({ data, columns, onSelectRow, loadingInitial, stickyColumns, stickyRows, bordered, sorting, onSortingChange }: Props<T>) => JSX.Element;
+export declare const DataTable: <T extends Object & DefaultData>({ data, columns, onSelectRow, loadingInitial, stickyColumns, stickyRows, bordered, sorting, onSortingChange, isRowSelectable, canSelectAllRows, selectedRows }: Props<T>) => JSX.Element;
 export {};

package/DataTable/DataTable.js

@@ -6,9 +6,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DataTable = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _objectSpread3 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _react = _interopRequireWildcard(require("react"));
 var _dataTable = require("@rmwc/data-table");
 var _reactTable = require("@tanstack/react-table");
@@ -16,10 +16,13 @@ var _Checkbox = require("../Checkbox");
 var _Skeleton = require("../Skeleton");
 require("@rmwc/data-table/data-table.css");
 var _styled = require("./styled");
-var defineColumns = function defineColumns(columns, onSelectRow, loadingInitial) {
+var defineColumns = function defineColumns(columns, options) {
+  var canSelectAllRows = options.canSelectAllRows,
+    onSelectRow = options.onSelectRow,
+    loadingInitial = options.loadingInitial;
   return (0, _react.useMemo)(function () {
     var columnsList = Object.keys(columns).map(function (key) {
-      return (0, _objectSpread2.default)({
+      return (0, _objectSpread3.default)({
         id: key
       }, columns[key]);
     });
@@ -44,7 +47,7 @@ var defineColumns = function defineColumns(columns, onSelectRow, loadingInitial)
           }
         },
         enableSorting: enableSorting,
-        meta: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, meta), {}, {
+        meta: (0, _objectSpread3.default)((0, _objectSpread3.default)({}, meta), {}, {
           className: className
         })
       };
@@ -53,6 +56,9 @@ var defineColumns = function defineColumns(columns, onSelectRow, loadingInitial)
       id: "datatable-select-column",
       header: function header(_ref) {
         var table = _ref.table;
+        if (!canSelectAllRows) {
+          return null;
+        }
         return !loadingInitial && /*#__PURE__*/_react.default.createElement(_Checkbox.Checkbox, {
           indeterminate: table.getIsSomeRowsSelected(),
           value: table.getIsAllRowsSelected(),
@@ -79,7 +85,7 @@ var defineColumns = function defineColumns(columns, onSelectRow, loadingInitial)
     }] : [];
     return [].concat(select, (0, _toConsumableArray2.default)(defaults)).map(function (column) {
       if (loadingInitial) {
-        return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, column), {}, {
+        return (0, _objectSpread3.default)((0, _objectSpread3.default)({}, column), {}, {
           cell: function cell() {
             return /*#__PURE__*/_react.default.createElement(_Skeleton.Skeleton, null);
           }
@@ -115,36 +121,48 @@ var DataTable = function DataTable(_ref3) {
     stickyRows = _ref3.stickyRows,
     bordered = _ref3.bordered,
     sorting = _ref3.sorting,
-    onSortingChange = _ref3.onSortingChange;
-  var _React$useState = _react.default.useState({}),
-    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-    rowSelection = _React$useState2[0],
-    setRowSelection = _React$useState2[1];
+    onSortingChange = _ref3.onSortingChange,
+    isRowSelectable = _ref3.isRowSelectable,
+    _ref3$canSelectAllRow = _ref3.canSelectAllRows,
+    canSelectAllRows = _ref3$canSelectAllRow === void 0 ? true : _ref3$canSelectAllRow,
+    _ref3$selectedRows = _ref3.selectedRows,
+    selectedRows = _ref3$selectedRows === void 0 ? [] : _ref3$selectedRows;
+  var rowSelection = (0, _react.useMemo)(function () {
+    return selectedRows.reduce(function (acc, item) {
+      var recordIndex = data.findIndex(function (rec) {
+        return rec.id === item.id;
+      });
+      return (0, _objectSpread3.default)((0, _objectSpread3.default)({}, acc), {}, (0, _defineProperty2.default)({}, recordIndex, true));
+    }, {});
+  }, [selectedRows, data]);
+  var onRowSelectionChange = function onRowSelectionChange(updater) {
+    if (typeof onSelectRow === "function") {
+      var newSelection = typeof updater === "function" ? updater(rowSelection) : updater;
+      var selection = Object.keys(newSelection).map(function (key) {
+        return data[parseInt(key)];
+      });
+      onSelectRow(selection);
+    }
+  };
   var table = (0, _reactTable.useReactTable)({
     data: defineData(data, loadingInitial),
-    columns: defineColumns(columns, onSelectRow, loadingInitial),
+    columns: defineColumns(columns, {
+      canSelectAllRows: canSelectAllRows,
+      onSelectRow: onSelectRow,
+      loadingInitial: loadingInitial
+    }),
     getCoreRowModel: (0, _reactTable.getCoreRowModel)(),
     getSortedRowModel: (0, _reactTable.getSortedRowModel)(),
     state: {
       rowSelection: rowSelection,
       sorting: sorting
     },
-    enableRowSelection: function enableRowSelection(row) {
-      return row.original.selectable || false;
-    },
-    onRowSelectionChange: setRowSelection,
+    enableRowSelection: isRowSelectable,
+    onRowSelectionChange: onRowSelectionChange,
     enableSorting: !!onSortingChange,
     manualSorting: true,
     onSortingChange: onSortingChange
   });
-  (0, _react.useEffect)(function () {
-    if (onSelectRow && typeof onSelectRow === "function") {
-      var dataSelected = table.getSelectedRowModel().flatRows.map(function (row) {
-        return row.original;
-      });
-      onSelectRow(dataSelected);
-    }
-  }, [rowSelection]);
   return /*#__PURE__*/_react.default.createElement(_styled.Table, {
     stickyColumns: stickyColumns,
     stickyRows: stickyRows,
@@ -169,7 +187,7 @@ var DataTable = function DataTable(_ref3) {
   })), /*#__PURE__*/_react.default.createElement(_dataTable.DataTableBody, null, table.getRowModel().rows.map(function (row) {
     return /*#__PURE__*/_react.default.createElement(_dataTable.DataTableRow, {
       key: row.id,
-      selected: rowSelection.hasOwnProperty(row.index)
+      selected: row.getIsSelected()
     }, row.getVisibleCells().map(function (cell) {
       return /*#__PURE__*/_react.default.createElement(_dataTable.DataTableCell, Object.assign({
         key: cell.id

package/DataTable/DataTable.js.map

@@ -1 +1 @@
-{"version":3,"names":["defineColumns","columns","onSelectRow","loadingInitial","useMemo","columnsList","Object","keys","map","key","id","defaults","column","header","meta","cell","enableSorting","className","accessorKey","info","row","original","getValue","select","table","getIsSomeRowsSelected","getIsAllRowsSelected","e","toggleAllPageRowsSelected","getCanSelect","getIsSomeSelected","getIsSelected","getToggleSelectedHandler","hasFormControl","defineData","data","Array","fill","ColumnDirection","direction","DataTable","stickyColumns","stickyRows","bordered","sorting","onSortingChange","React","useState","rowSelection","setRowSelection","useReactTable","getCoreRowModel","getSortedRowModel","state","enableRowSelection","selectable","onRowSelectionChange","manualSorting","useEffect","dataSelected","getSelectedRowModel","flatRows","getHeaderGroups","headerGroup","headers","isPlaceholder","getContext","columnDef","getToggleSortingHandler","getCanSort","flexRender","getIsSorted","undefined","getRowModel","rows","hasOwnProperty","index","getVisibleCells"],"sources":["DataTable.tsx"],"sourcesContent":["import React, { ReactElement, useEffect, useMemo } from \"react\";\n\nimport {\n    DataTableContent,\n    DataTableHead,\n    DataTableRow,\n    DataTableHeadCell,\n    DataTableBody,\n    DataTableCell,\n    DataTableCellProps\n} from \"@rmwc/data-table\";\n\nimport {\n    flexRender,\n    getCoreRowModel,\n    useReactTable,\n    ColumnDef,\n    getSortedRowModel,\n    OnChangeFn,\n    SortingState\n} from \"@tanstack/react-table\";\n\nimport { Checkbox } from \"~/Checkbox\";\nimport { Skeleton } from \"~/Skeleton\";\n\nimport \"@rmwc/data-table/data-table.css\";\nimport { ColumnDirectionIcon, ColumnDirectionWrapper, ColumnHeaderWrapper, Table } from \"./styled\";\n\ninterface Column<T> {\n    /*\n     * Column header component.\n     */\n    header: string | number | JSX.Element;\n    /*\n     * Cell renderer, receives the full row and returns the value to render inside the cell.\n     */\n    cell?: (row: T) => string | number | JSX.Element;\n    /*\n     * Additional props to add to both header and row cells. Refer to RMWC documentation.\n     */\n    meta?: DataTableCellProps;\n    /*\n     * Column class names.\n     */\n    className?: string;\n    /*\n     * Enable column sorting.\n     */\n    enableSorting?: boolean;\n}\n\nexport type Columns<T> = {\n    [P in keyof T]?: Column<T>;\n};\n\nexport type DefaultData = {\n    /*\n     * Define if a specific row can be selected.\n     */\n    selectable?: boolean;\n};\n\nexport type Sorting = SortingState;\n\nexport type OnSortingChange = OnChangeFn<Sorting>;\n\ninterface Props<T> {\n    /*\n     * Columns definition.\n     */\n    columns: Columns<T>;\n    /*\n     * Data to display into DataTable body.\n     */\n    data: T[];\n    /*\n     * Callback that receives the selected rows.\n     */\n    onSelectRow?: (rows: T[] | []) => void;\n    /*\n     * Render the skeleton state at the initial data loading.\n     */\n    loadingInitial?: boolean;\n    /*\n     * The number of columns to affix to the side of the table when scrolling.\n     */\n    stickyColumns?: number;\n    /*\n     * The number of rows to affix to the top of the table when scrolling.\n     */\n    stickyRows?: number;\n    /*\n     * Show or hide borders.\n     */\n    bordered?: boolean;\n    /*\n     * Sorting state.\n     */\n    sorting?: Sorting;\n    /*\n     * Callback that receives current sorting state.\n     */\n    onSortingChange?: OnSortingChange;\n}\n\nexport interface ColumnDirectionProps {\n    direction?: \"asc\" | \"desc\";\n}\n\nconst defineColumns = <T,>(\n    columns: Props<T>[\"columns\"],\n    onSelectRow: Props<T>[\"onSelectRow\"],\n    loadingInitial: Props<T>[\"loadingInitial\"]\n): ColumnDef<T>[] =>\n    useMemo(() => {\n        const columnsList = Object.keys(columns).map(key => ({\n            id: key,\n            ...columns[key as keyof typeof columns]\n        }));\n\n        const defaults: ColumnDef<T>[] = columnsList.map(column => {\n            const { id, header, meta, cell, enableSorting = false, className } = column;\n\n            return {\n                accessorKey: id,\n                header: () => header,\n                cell: info => {\n                    if (cell && typeof cell === \"function\") {\n                        return cell(info.row.original);\n                    } else {\n                        return info.getValue();\n                    }\n                },\n                enableSorting,\n                meta: {\n                    ...meta,\n                    className\n                }\n            };\n        });\n\n        const select: ColumnDef<T>[] = !!onSelectRow\n            ? [\n                  {\n                      id: \"datatable-select-column\",\n                      header: ({ table }) =>\n                          !loadingInitial && (\n                              <Checkbox\n                                  indeterminate={table.getIsSomeRowsSelected()}\n                                  value={table.getIsAllRowsSelected()}\n                                  onChange={e => table.toggleAllPageRowsSelected(e)}\n                              />\n                          ),\n                      cell: info => {\n                          if (!info.row.getCanSelect()) {\n                              return <></>;\n                          }\n                          return (\n                              <Checkbox\n                                  indeterminate={info.row.getIsSomeSelected()}\n                                  value={info.row.getIsSelected()}\n                                  onChange={info.row.getToggleSelectedHandler()}\n                              />\n                          );\n                      },\n                      meta: {\n                          hasFormControl: true,\n                          className: \"datatable-select-column\"\n                      },\n                      enableSorting: false\n                  }\n              ]\n            : [];\n\n        return [...select, ...defaults].map(column => {\n            if (loadingInitial) {\n                return {\n                    ...column,\n                    cell: () => <Skeleton />\n                };\n            }\n\n            return column;\n        });\n    }, [columns, onSelectRow, loadingInitial]);\n\nconst defineData = <T,>(\n    data: Props<T>[\"data\"],\n    loadingInitial: Props<T>[\"loadingInitial\"]\n): T[] => {\n    return useMemo(() => {\n        if (loadingInitial) {\n            return Array(10).fill({});\n        }\n        return data;\n    }, [data, loadingInitial]);\n};\n\nconst ColumnDirection = ({ direction }: ColumnDirectionProps): ReactElement | null => {\n    if (direction) {\n        return (\n            <ColumnDirectionWrapper>\n                <ColumnDirectionIcon direction={direction} />\n            </ColumnDirectionWrapper>\n        );\n    }\n\n    return null;\n};\n\nexport const DataTable = <T extends Object & DefaultData>({\n    data,\n    columns,\n    onSelectRow,\n    loadingInitial,\n    stickyColumns,\n    stickyRows,\n    bordered,\n    sorting,\n    onSortingChange\n}: Props<T>) => {\n    const [rowSelection, setRowSelection] = React.useState({});\n\n    const table = useReactTable({\n        data: defineData(data, loadingInitial),\n        columns: defineColumns(columns, onSelectRow, loadingInitial),\n        getCoreRowModel: getCoreRowModel(),\n        getSortedRowModel: getSortedRowModel(),\n        state: {\n            rowSelection,\n            sorting\n        },\n        enableRowSelection: row => row.original.selectable || false,\n        onRowSelectionChange: setRowSelection,\n        enableSorting: !!onSortingChange,\n        manualSorting: true,\n        onSortingChange\n    });\n\n    useEffect(() => {\n        if (onSelectRow && typeof onSelectRow === \"function\") {\n            const dataSelected = table.getSelectedRowModel().flatRows.map(row => row.original);\n            onSelectRow(dataSelected);\n        }\n    }, [rowSelection]);\n\n    return (\n        <Table stickyColumns={stickyColumns} stickyRows={stickyRows} bordered={bordered}>\n            <DataTableContent>\n                <DataTableHead>\n                    {table.getHeaderGroups().map(headerGroup => (\n                        <DataTableRow key={headerGroup.id}>\n                            {headerGroup.headers.map(\n                                ({ id, isPlaceholder, column, getContext }) => (\n                                    <DataTableHeadCell key={id} {...column.columnDef.meta}>\n                                        {isPlaceholder ? null : (\n                                            <ColumnHeaderWrapper\n                                                onClick={column.getToggleSortingHandler()}\n                                                sortable={column.getCanSort()}\n                                            >\n                                                {flexRender(column.columnDef.header, getContext())}\n                                                <ColumnDirection\n                                                    direction={column.getIsSorted() || undefined}\n                                                />\n                                            </ColumnHeaderWrapper>\n                                        )}\n                                    </DataTableHeadCell>\n                                )\n                            )}\n                        </DataTableRow>\n                    ))}\n                </DataTableHead>\n                <DataTableBody>\n                    {table.getRowModel().rows.map(row => (\n                        <DataTableRow\n                            key={row.id}\n                            selected={rowSelection.hasOwnProperty(row.index)}\n                        >\n                            {row.getVisibleCells().map(cell => (\n                                <DataTableCell key={cell.id} {...cell.column.columnDef.meta}>\n                                    {flexRender(cell.column.columnDef.cell, cell.getContext())}\n                                </DataTableCell>\n                            ))}\n                        </DataTableRow>\n                    ))}\n                </DataTableBody>\n            </DataTableContent>\n        </Table>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_dataTable","_reactTable","_Checkbox","_Skeleton","_styled","defineColumns","columns","options","canSelectAllRows","onSelectRow","loadingInitial","useMemo","columnsList","Object","keys","map","key","_objectSpread3","default","id","defaults","column","header","meta","cell","_column$enableSorting","enableSorting","className","accessorKey","info","row","original","getValue","select","_ref","table","createElement","Checkbox","indeterminate","getIsSomeRowsSelected","value","getIsAllRowsSelected","onChange","e","toggleAllPageRowsSelected","getCanSelect","Fragment","getIsSomeSelected","getIsSelected","getToggleSelectedHandler","hasFormControl","concat","_toConsumableArray2","Skeleton","defineData","data","Array","fill","ColumnDirection","_ref2","direction","ColumnDirectionWrapper","ColumnDirectionIcon","DataTable","_ref3","stickyColumns","stickyRows","bordered","sorting","onSortingChange","isRowSelectable","_ref3$canSelectAllRow","_ref3$selectedRows","selectedRows","rowSelection","reduce","acc","item","recordIndex","findIndex","rec","_defineProperty2","onRowSelectionChange","updater","newSelection","selection","parseInt","useReactTable","getCoreRowModel","getSortedRowModel","state","enableRowSelection","manualSorting","Table","DataTableContent","DataTableHead","getHeaderGroups","headerGroup","DataTableRow","headers","_ref4","isPlaceholder","getContext","DataTableHeadCell","assign","columnDef","ColumnHeaderWrapper","onClick","getToggleSortingHandler","sortable","getCanSort","flexRender","getIsSorted","undefined","DataTableBody","getRowModel","rows","selected","getVisibleCells","DataTableCell","exports"],"sources":["DataTable.tsx"],"sourcesContent":["import React, { ReactElement, useMemo } from \"react\";\n\nimport {\n    DataTableContent,\n    DataTableHead,\n    DataTableRow,\n    DataTableHeadCell,\n    DataTableBody,\n    DataTableCell,\n    DataTableCellProps\n} from \"@rmwc/data-table\";\n\nimport {\n    flexRender,\n    getCoreRowModel,\n    useReactTable,\n    ColumnDef,\n    getSortedRowModel,\n    OnChangeFn,\n    SortingState,\n    RowSelectionState,\n    Row\n} from \"@tanstack/react-table\";\n\nimport { Checkbox } from \"~/Checkbox\";\nimport { Skeleton } from \"~/Skeleton\";\n\nimport \"@rmwc/data-table/data-table.css\";\nimport { ColumnDirectionIcon, ColumnDirectionWrapper, ColumnHeaderWrapper, Table } from \"./styled\";\n\ninterface Column<T> {\n    /*\n     * Column header component.\n     */\n    header: string | number | JSX.Element;\n    /*\n     * Cell renderer, receives the full row and returns the value to render inside the cell.\n     */\n    cell?: (row: T) => string | number | JSX.Element;\n    /*\n     * Additional props to add to both header and row cells. Refer to RMWC documentation.\n     */\n    meta?: DataTableCellProps;\n    /*\n     * Column class names.\n     */\n    className?: string;\n    /*\n     * Enable column sorting.\n     */\n    enableSorting?: boolean;\n}\n\nexport type Columns<T> = {\n    [P in keyof T]?: Column<T>;\n};\n\nexport type DefaultData = {\n    id: string;\n    /*\n     * Define if a specific row can be selected.\n     */\n    selectable?: boolean;\n};\n\nexport type Sorting = SortingState;\n\nexport type OnSortingChange = OnChangeFn<Sorting>;\n\ninterface Props<T> {\n    /**\n     * Show or hide borders.\n     */\n    bordered?: boolean;\n    /**\n     * Controls whether \"select all\" action is allowed.\n     */\n    canSelectAllRows?: boolean;\n    /**\n     * Columns definition.\n     */\n    columns: Columns<T>;\n    /**\n     * Data to display into DataTable body.\n     */\n    data: T[];\n    /**\n     * Callback that is called to determine if the row is selectable.\n     */\n    isRowSelectable?: (row: Row<T>) => boolean;\n    /**\n     * Render the skeleton state at the initial data loading.\n     */\n    loadingInitial?: boolean;\n    /**\n     * Callback that receives the selected rows.\n     */\n    onSelectRow?: (rows: T[]) => void;\n    /**\n     * Callback that receives current sorting state.\n     */\n    onSortingChange?: OnSortingChange;\n    /**\n     * Selected rows.\n     */\n    selectedRows?: T[];\n    /**\n     * Sorting state.\n     */\n    sorting?: Sorting;\n    /**\n     * The number of columns to affix to the side of the table when scrolling.\n     */\n    stickyColumns?: number;\n    /**\n     * The number of rows to affix to the top of the table when scrolling.\n     */\n    stickyRows?: number;\n}\n\nexport interface ColumnDirectionProps {\n    direction?: \"asc\" | \"desc\";\n}\n\ninterface DefineColumnsOptions<T> {\n    canSelectAllRows: boolean;\n    onSelectRow: Props<T>[\"onSelectRow\"];\n    loadingInitial: Props<T>[\"loadingInitial\"];\n}\n\nconst defineColumns = <T,>(\n    columns: Props<T>[\"columns\"],\n    options: DefineColumnsOptions<T>\n): ColumnDef<T>[] => {\n    const { canSelectAllRows, onSelectRow, loadingInitial } = options;\n\n    return useMemo(() => {\n        const columnsList = Object.keys(columns).map(key => ({\n            id: key,\n            ...columns[key as keyof typeof columns]\n        }));\n\n        const defaults: ColumnDef<T>[] = columnsList.map(column => {\n            const { id, header, meta, cell, enableSorting = false, className } = column;\n\n            return {\n                accessorKey: id,\n                header: () => header,\n                cell: info => {\n                    if (cell && typeof cell === \"function\") {\n                        return cell(info.row.original);\n                    } else {\n                        return info.getValue();\n                    }\n                },\n                enableSorting,\n                meta: {\n                    ...meta,\n                    className\n                }\n            };\n        });\n\n        const select: ColumnDef<T>[] = !!onSelectRow\n            ? [\n                  {\n                      id: \"datatable-select-column\",\n                      header: ({ table }) => {\n                          if (!canSelectAllRows) {\n                              return null;\n                          }\n\n                          return (\n                              !loadingInitial && (\n                                  <Checkbox\n                                      indeterminate={table.getIsSomeRowsSelected()}\n                                      value={table.getIsAllRowsSelected()}\n                                      onChange={e => table.toggleAllPageRowsSelected(e)}\n                                  />\n                              )\n                          );\n                      },\n                      cell: info => {\n                          if (!info.row.getCanSelect()) {\n                              return <></>;\n                          }\n                          return (\n                              <Checkbox\n                                  indeterminate={info.row.getIsSomeSelected()}\n                                  value={info.row.getIsSelected()}\n                                  onChange={info.row.getToggleSelectedHandler()}\n                              />\n                          );\n                      },\n                      meta: {\n                          hasFormControl: true,\n                          className: \"datatable-select-column\"\n                      },\n                      enableSorting: false\n                  }\n              ]\n            : [];\n\n        return [...select, ...defaults].map(column => {\n            if (loadingInitial) {\n                return {\n                    ...column,\n                    cell: () => <Skeleton />\n                };\n            }\n\n            return column;\n        });\n    }, [columns, onSelectRow, loadingInitial]);\n};\n\nconst defineData = <T,>(\n    data: Props<T>[\"data\"],\n    loadingInitial: Props<T>[\"loadingInitial\"]\n): T[] => {\n    return useMemo(() => {\n        if (loadingInitial) {\n            return Array(10).fill({});\n        }\n        return data;\n    }, [data, loadingInitial]);\n};\n\nconst ColumnDirection = ({ direction }: ColumnDirectionProps): ReactElement | null => {\n    if (direction) {\n        return (\n            <ColumnDirectionWrapper>\n                <ColumnDirectionIcon direction={direction} />\n            </ColumnDirectionWrapper>\n        );\n    }\n\n    return null;\n};\n\nexport const DataTable = <T extends Object & DefaultData>({\n    data,\n    columns,\n    onSelectRow,\n    loadingInitial,\n    stickyColumns,\n    stickyRows,\n    bordered,\n    sorting,\n    onSortingChange,\n    isRowSelectable,\n    canSelectAllRows = true,\n    selectedRows = []\n}: Props<T>) => {\n    const rowSelection = useMemo(() => {\n        return selectedRows.reduce<RowSelectionState>((acc, item) => {\n            const recordIndex = data.findIndex(rec => rec.id === item.id);\n            return { ...acc, [recordIndex]: true };\n        }, {});\n    }, [selectedRows, data]);\n\n    const onRowSelectionChange: OnChangeFn<RowSelectionState> = updater => {\n        if (typeof onSelectRow === \"function\") {\n            const newSelection = typeof updater === \"function\" ? updater(rowSelection) : updater;\n            const selection = Object.keys(newSelection).map(key => data[parseInt(key)]);\n            onSelectRow(selection);\n        }\n    };\n\n    const table = useReactTable({\n        data: defineData(data, loadingInitial),\n        columns: defineColumns(columns, { canSelectAllRows, onSelectRow, loadingInitial }),\n        getCoreRowModel: getCoreRowModel(),\n        getSortedRowModel: getSortedRowModel(),\n        state: {\n            rowSelection,\n            sorting\n        },\n        enableRowSelection: isRowSelectable,\n        onRowSelectionChange,\n        enableSorting: !!onSortingChange,\n        manualSorting: true,\n        onSortingChange\n    });\n\n    return (\n        <Table stickyColumns={stickyColumns} stickyRows={stickyRows} bordered={bordered}>\n            <DataTableContent>\n                <DataTableHead>\n                    {table.getHeaderGroups().map(headerGroup => (\n                        <DataTableRow key={headerGroup.id}>\n                            {headerGroup.headers.map(\n                                ({ id, isPlaceholder, column, getContext }) => (\n                                    <DataTableHeadCell key={id} {...column.columnDef.meta}>\n                                        {isPlaceholder ? null : (\n                                            <ColumnHeaderWrapper\n                                                onClick={column.getToggleSortingHandler()}\n                                                sortable={column.getCanSort()}\n                                            >\n                                                {flexRender(column.columnDef.header, getContext())}\n                                                <ColumnDirection\n                                                    direction={column.getIsSorted() || undefined}\n                                                />\n                                            </ColumnHeaderWrapper>\n                                        )}\n                                    </DataTableHeadCell>\n                                )\n                            )}\n                        </DataTableRow>\n                    ))}\n                </DataTableHead>\n                <DataTableBody>\n                    {table.getRowModel().rows.map(row => (\n                        <DataTableRow key={row.id} selected={row.getIsSelected()}>\n                            {row.getVisibleCells().map(cell => (\n                                <DataTableCell key={cell.id} {...cell.column.columnDef.meta}>\n                                    {flexRender(cell.column.columnDef.cell, cell.getContext())}\n                                </DataTableCell>\n                            ))}\n                        </DataTableRow>\n                    ))}\n                </DataTableBody>\n            </DataTableContent>\n        </Table>\n    );\n};\n"],"mappings":"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"}

package/DataTable/DataTable.stories.js

@@ -9,16 +9,19 @@ var _DataTable = require("./DataTable");
 var story = (0, _react2.storiesOf)("Components/DataTable", module);
 story.add("usage", function () {
   var data = [{
+    id: "1",
     name: "Page 1",
     createdBy: "John Doe",
     lastModified: "3 days ago",
     status: "Draft"
   }, {
+    id: "2",
     name: "Page 2",
     createdBy: "John Doe",
     lastModified: "1 day ago",
     status: "Published"
   }, {
+    id: "3",
     name: "Page 3",
     createdBy: "John Doe",
     lastModified: "1 hour ago",

package/DataTable/DataTable.stories.js.map

@@ -1 +1 @@
-{"version":3,"names":["story","storiesOf","module","add","data","name","createdBy","lastModified","status","columns","header","cell","row","toUpperCase","meta","alignEnd","readme","console","log","info","propTables","DataTable"],"sources":["DataTable.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport { Story, StoryReadme, StorySandbox } from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../DataTable/README.md\";\nimport { Columns, DataTable } from \"./DataTable\";\n\nconst story = storiesOf(\"Components/DataTable\", module);\n\ninterface Entry {\n    name: string;\n    createdBy: string;\n    lastModified: string;\n    status: string;\n}\n\nstory.add(\n    \"usage\",\n    () => {\n        const data: Entry[] = [\n            {\n                name: \"Page 1\",\n                createdBy: \"John Doe\",\n                lastModified: \"3 days ago\",\n                status: \"Draft\"\n            },\n            {\n                name: \"Page 2\",\n                createdBy: \"John Doe\",\n                lastModified: \"1 day ago\",\n                status: \"Published\"\n            },\n            {\n                name: \"Page 3\",\n                createdBy: \"John Doe\",\n                lastModified: \"1 hour ago\",\n                status: \"Published\"\n            }\n        ];\n\n        const columns: Columns<Entry> = {\n            name: {\n                header: \"Title\"\n            },\n            createdBy: {\n                header: \"Author\",\n                cell: row => <em>{row.createdBy.toUpperCase()}</em>\n            },\n            lastModified: {\n                header: \"Last Modified\"\n            },\n            status: {\n                header: \"Status\",\n                meta: {\n                    alignEnd: true\n                }\n            }\n        };\n\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"A simple DataTable.\"}>\n                    <DataTable data={data} columns={columns} />\n                </StorySandbox>\n                <StorySandbox title={\"DataTable with selectable rows\"}>\n                    <DataTable\n                        data={data}\n                        columns={columns}\n                        onSelectRow={row =>\n                            console.log(\"Do whatever you like with the selected row data\", row)\n                        }\n                    />\n                </StorySandbox>\n                <StorySandbox title={\"DataTable at initial loading state\"}>\n                    <DataTable data={data} columns={columns} loadingInitial={true} />\n                </StorySandbox>\n            </Story>\n        );\n    },\n    {\n        info: {\n            propTables: [DataTable]\n        }\n    }\n);\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AAEA,IAAMA,KAAK,GAAG,IAAAC,iBAAS,EAAC,sBAAsB,EAAEC,MAAM,CAAC;AASvDF,KAAK,CAACG,GAAG,CACL,OAAO,EACP,YAAM;EACF,IAAMC,IAAa,GAAG,CAClB;IACIC,IAAI,EAAE,QAAQ;IACdC,SAAS,EAAE,UAAU;IACrBC,YAAY,EAAE,YAAY;IAC1BC,MAAM,EAAE;EACZ,CAAC,EACD;IACIH,IAAI,EAAE,QAAQ;IACdC,SAAS,EAAE,UAAU;IACrBC,YAAY,EAAE,WAAW;IACzBC,MAAM,EAAE;EACZ,CAAC,EACD;IACIH,IAAI,EAAE,QAAQ;IACdC,SAAS,EAAE,UAAU;IACrBC,YAAY,EAAE,YAAY;IAC1BC,MAAM,EAAE;EACZ,CAAC,CACJ;EAED,IAAMC,OAAuB,GAAG;IAC5BJ,IAAI,EAAE;MACFK,MAAM,EAAE;IACZ,CAAC;IACDJ,SAAS,EAAE;MACPI,MAAM,EAAE,QAAQ;MAChBC,IAAI,EAAE,cAAAC,GAAG;QAAA,oBAAI,yCAAKA,GAAG,CAACN,SAAS,CAACO,WAAW,EAAE,CAAM;MAAA;IACvD,CAAC;IACDN,YAAY,EAAE;MACVG,MAAM,EAAE;IACZ,CAAC;IACDF,MAAM,EAAE;MACJE,MAAM,EAAE,QAAQ;MAChBI,IAAI,EAAE;QACFC,QAAQ,EAAE;MACd;IACJ;EACJ,CAAC;EAED,oBACI,6BAAC,YAAK,qBACF,6BAAC,kBAAW,QAAEC,eAAM,CAAe,eACnC,6BAAC,mBAAY;IAAC,KAAK,EAAE;EAAsB,gBACvC,6BAAC,oBAAS;IAAC,IAAI,EAAEZ,IAAK;IAAC,OAAO,EAAEK;EAAQ,EAAG,CAChC,eACf,6BAAC,mBAAY;IAAC,KAAK,EAAE;EAAiC,gBAClD,6BAAC,oBAAS;IACN,IAAI,EAAEL,IAAK;IACX,OAAO,EAAEK,OAAQ;IACjB,WAAW,EAAE,qBAAAG,GAAG;MAAA,OACZK,OAAO,CAACC,GAAG,CAAC,iDAAiD,EAAEN,GAAG,CAAC;IAAA;EACtE,EACH,CACS,eACf,6BAAC,mBAAY;IAAC,KAAK,EAAE;EAAqC,gBACtD,6BAAC,oBAAS;IAAC,IAAI,EAAER,IAAK;IAAC,OAAO,EAAEK,OAAQ;IAAC,cAAc,EAAE;EAAK,EAAG,CACtD,CACX;AAEhB,CAAC,EACD;EACIU,IAAI,EAAE;IACFC,UAAU,EAAE,CAACC,oBAAS;EAC1B;AACJ,CAAC,CACJ"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_react2","_Story","_README","_DataTable","story","storiesOf","module","add","data","id","name","createdBy","lastModified","status","columns","header","cell","row","default","createElement","toUpperCase","meta","alignEnd","Story","StoryReadme","readme","StorySandbox","title","DataTable","onSelectRow","console","log","loadingInitial","info","propTables"],"sources":["DataTable.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport { Story, StoryReadme, StorySandbox } from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../DataTable/README.md\";\nimport { Columns, DataTable } from \"./DataTable\";\n\nconst story = storiesOf(\"Components/DataTable\", module);\n\ninterface Entry {\n    id: string;\n    name: string;\n    createdBy: string;\n    lastModified: string;\n    status: string;\n}\n\nstory.add(\n    \"usage\",\n    () => {\n        const data: Entry[] = [\n            {\n                id: \"1\",\n                name: \"Page 1\",\n                createdBy: \"John Doe\",\n                lastModified: \"3 days ago\",\n                status: \"Draft\"\n            },\n            {\n                id: \"2\",\n                name: \"Page 2\",\n                createdBy: \"John Doe\",\n                lastModified: \"1 day ago\",\n                status: \"Published\"\n            },\n            {\n                id: \"3\",\n                name: \"Page 3\",\n                createdBy: \"John Doe\",\n                lastModified: \"1 hour ago\",\n                status: \"Published\"\n            }\n        ];\n\n        const columns: Columns<Entry> = {\n            name: {\n                header: \"Title\"\n            },\n            createdBy: {\n                header: \"Author\",\n                cell: row => <em>{row.createdBy.toUpperCase()}</em>\n            },\n            lastModified: {\n                header: \"Last Modified\"\n            },\n            status: {\n                header: \"Status\",\n                meta: {\n                    alignEnd: true\n                }\n            }\n        };\n\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"A simple DataTable.\"}>\n                    <DataTable data={data} columns={columns} />\n                </StorySandbox>\n                <StorySandbox title={\"DataTable with selectable rows\"}>\n                    <DataTable\n                        data={data}\n                        columns={columns}\n                        onSelectRow={row =>\n                            console.log(\"Do whatever you like with the selected row data\", row)\n                        }\n                    />\n                </StorySandbox>\n                <StorySandbox title={\"DataTable at initial loading state\"}>\n                    <DataTable data={data} columns={columns} loadingInitial={true} />\n                </StorySandbox>\n            </Story>\n        );\n    },\n    {\n        info: {\n            propTables: [DataTable]\n        }\n    }\n);\n"],"mappings":";;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,UAAA,GAAAJ,OAAA;AAEA,IAAMK,KAAK,GAAG,IAAAC,iBAAS,EAAC,sBAAsB,EAAEC,MAAM,CAAC;AAUvDF,KAAK,CAACG,GAAG,CACL,OAAO,EACP,YAAM;EACF,IAAMC,IAAa,GAAG,CAClB;IACIC,EAAE,EAAE,GAAG;IACPC,IAAI,EAAE,QAAQ;IACdC,SAAS,EAAE,UAAU;IACrBC,YAAY,EAAE,YAAY;IAC1BC,MAAM,EAAE;EACZ,CAAC,EACD;IACIJ,EAAE,EAAE,GAAG;IACPC,IAAI,EAAE,QAAQ;IACdC,SAAS,EAAE,UAAU;IACrBC,YAAY,EAAE,WAAW;IACzBC,MAAM,EAAE;EACZ,CAAC,EACD;IACIJ,EAAE,EAAE,GAAG;IACPC,IAAI,EAAE,QAAQ;IACdC,SAAS,EAAE,UAAU;IACrBC,YAAY,EAAE,YAAY;IAC1BC,MAAM,EAAE;EACZ,CAAC,CACJ;EAED,IAAMC,OAAuB,GAAG;IAC5BJ,IAAI,EAAE;MACFK,MAAM,EAAE;IACZ,CAAC;IACDJ,SAAS,EAAE;MACPI,MAAM,EAAE,QAAQ;MAChBC,IAAI,EAAE,SAAAA,KAAAC,GAAG;QAAA,oBAAIpB,MAAA,CAAAqB,OAAA,CAAAC,aAAA,aAAKF,GAAG,CAACN,SAAS,CAACS,WAAW,CAAC,CAAM,CAAC;MAAA;IACvD,CAAC;IACDR,YAAY,EAAE;MACVG,MAAM,EAAE;IACZ,CAAC;IACDF,MAAM,EAAE;MACJE,MAAM,EAAE,QAAQ;MAChBM,IAAI,EAAE;QACFC,QAAQ,EAAE;MACd;IACJ;EACJ,CAAC;EAED,oBACIzB,MAAA,CAAAqB,OAAA,CAAAC,aAAA,CAAClB,MAAA,CAAAsB,KAAK,qBACF1B,MAAA,CAAAqB,OAAA,CAAAC,aAAA,CAAClB,MAAA,CAAAuB,WAAW,QAAEC,eAAoB,CAAC,eACnC5B,MAAA,CAAAqB,OAAA,CAAAC,aAAA,CAAClB,MAAA,CAAAyB,YAAY;IAACC,KAAK,EAAE;EAAsB,gBACvC9B,MAAA,CAAAqB,OAAA,CAAAC,aAAA,CAAChB,UAAA,CAAAyB,SAAS;IAACpB,IAAI,EAAEA,IAAK;IAACM,OAAO,EAAEA;EAAQ,CAAE,CAChC,CAAC,eACfjB,MAAA,CAAAqB,OAAA,CAAAC,aAAA,CAAClB,MAAA,CAAAyB,YAAY;IAACC,KAAK,EAAE;EAAiC,gBAClD9B,MAAA,CAAAqB,OAAA,CAAAC,aAAA,CAAChB,UAAA,CAAAyB,SAAS;IACNpB,IAAI,EAAEA,IAAK;IACXM,OAAO,EAAEA,OAAQ;IACjBe,WAAW,EAAE,SAAAA,YAAAZ,GAAG;MAAA,OACZa,OAAO,CAACC,GAAG,CAAC,iDAAiD,EAAEd,GAAG,CAAC;IAAA;EACtE,CACJ,CACS,CAAC,eACfpB,MAAA,CAAAqB,OAAA,CAAAC,aAAA,CAAClB,MAAA,CAAAyB,YAAY;IAACC,KAAK,EAAE;EAAqC,gBACtD9B,MAAA,CAAAqB,OAAA,CAAAC,aAAA,CAAChB,UAAA,CAAAyB,SAAS;IAACpB,IAAI,EAAEA,IAAK;IAACM,OAAO,EAAEA,OAAQ;IAACkB,cAAc,EAAE;EAAK,CAAE,CACtD,CACX,CAAC;AAEhB,CAAC,EACD;EACIC,IAAI,EAAE;IACFC,UAAU,EAAE,CAACN,oBAAS;EAC1B;AACJ,CACJ,CAAC"}

package/DataTable/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./DataTable\";\n"],"mappings":";;;;;AAAA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
+{"version":3,"names":["_DataTable","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["index.ts"],"sourcesContent":["export * from \"./DataTable\";\n"],"mappings":";;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,UAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,UAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,UAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}

package/DataTable/styled.js.map

@@ -1 +1 @@
-{"version":3,"names":["Table","styled","RmwcDataTable","props","bordered","ColumnHeaderWrapper","sortable","ColumnDirectionWrapper","ColumnDirectionIcon","ArrowDown","direction"],"sources":["styled.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\n\nimport { ReactComponent as ArrowDown } from \"@material-design-icons/svg/outlined/arrow_downward.svg\";\nimport { DataTable as RmwcDataTable, DataTableProps } from \"@rmwc/data-table\";\nimport { ColumnDirectionProps } from \"~/DataTable/DataTable\";\n\ninterface TableProps extends DataTableProps {\n    bordered?: boolean;\n}\n\nexport const Table = styled(RmwcDataTable)<TableProps>`\n    width: 100%;\n    border-width: ${props => (props.bordered ? \"1px\" : \"0px\")};\n\n    th,\n    td {\n        vertical-align: middle;\n    }\n\n    .datatable-select-column {\n        width: 56px !important;\n        max-width: 56px !important;\n    }\n`;\n\ninterface ColumnHeaderWrapperProps {\n    sortable: boolean;\n}\n\nexport const ColumnHeaderWrapper = styled(\"div\")<ColumnHeaderWrapperProps>`\n    cursor: ${props => (props.sortable ? \"pointer\" : \"cursor\")};\n    display: flex;\n    align-items: center;\n    justify-content: start;\n`;\n\nexport const ColumnDirectionWrapper = styled(\"span\")`\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    height: 16px;\n    width: 16px;\n    margin: 0 0 0 4px;\n`;\n\nexport const ColumnDirectionIcon = styled(ArrowDown)<ColumnDirectionProps>`\n    transform: ${props => (props.direction === \"asc\" ? \"rotate(180deg)\" : \"rotate(0deg)\")};\n`;\n"],"mappings":";;;;;;;AAAA;AAEA;AACA;AAOO,IAAMA,KAAK,oBAAGC,eAAM,EAACC,oBAAa;EAAA;EAAA;AAAA,+BAErB,UAAAC,KAAK;EAAA,OAAKA,KAAK,CAACC,QAAQ,GAAG,KAAK,GAAG,KAAK;AAAA,CAAC,6GAW5D;AAAC;AAMK,IAAMC,mBAAmB,oBAAGJ,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,cACjC,UAAAE,KAAK;EAAA,OAAKA,KAAK,CAACG,QAAQ,GAAG,SAAS,GAAG,QAAQ;AAAA,CAAC,4DAI7D;AAAC;AAEK,IAAMC,sBAAsB,oBAAGN,eAAM,EAAC,MAAM;EAAA;EAAA;AAAA,4GAOlD;AAAC;AAEK,IAAMO,mBAAmB,oBAAGP,eAAM,EAACQ,8BAAS;EAAA;EAAA;AAAA,iBAClC,UAAAN,KAAK;EAAA,OAAKA,KAAK,CAACO,SAAS,KAAK,KAAK,GAAG,gBAAgB,GAAG,cAAc;AAAA,CAAC,MACxF;AAAC"}
+{"version":3,"names":["_styled","_interopRequireDefault","require","_arrow_downward","_dataTable","Table","styled","RmwcDataTable","label","target","props","bordered","exports","ColumnHeaderWrapper","sortable","ColumnDirectionWrapper","ColumnDirectionIcon","ArrowDown","direction"],"sources":["styled.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\n\nimport { ReactComponent as ArrowDown } from \"@material-design-icons/svg/outlined/arrow_downward.svg\";\nimport { DataTable as RmwcDataTable, DataTableProps } from \"@rmwc/data-table\";\nimport { ColumnDirectionProps } from \"~/DataTable/DataTable\";\n\ninterface TableProps extends DataTableProps {\n    bordered?: boolean;\n}\n\nexport const Table = styled(RmwcDataTable)<TableProps>`\n    width: 100%;\n    border-width: ${props => (props.bordered ? \"1px\" : \"0px\")};\n\n    th,\n    td {\n        vertical-align: middle;\n    }\n\n    .datatable-select-column {\n        width: 56px !important;\n        max-width: 56px !important;\n    }\n`;\n\ninterface ColumnHeaderWrapperProps {\n    sortable: boolean;\n}\n\nexport const ColumnHeaderWrapper = styled(\"div\")<ColumnHeaderWrapperProps>`\n    cursor: ${props => (props.sortable ? \"pointer\" : \"cursor\")};\n    display: flex;\n    align-items: center;\n    justify-content: start;\n`;\n\nexport const ColumnDirectionWrapper = styled(\"span\")`\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    height: 16px;\n    width: 16px;\n    margin: 0 0 0 4px;\n`;\n\nexport const ColumnDirectionIcon = styled(ArrowDown)<ColumnDirectionProps>`\n    transform: ${props => (props.direction === \"asc\" ? \"rotate(180deg)\" : \"rotate(0deg)\")};\n`;\n"],"mappings":";;;;;;;AAAA,IAAAA,OAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,eAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAF,OAAA;AAOO,IAAMG,KAAK,oBAAGC,eAAM,EAACC,oBAAa;EAAAC,KAAA;EAAAC,MAAA;AAAA,+BAErB,UAAAC,KAAK;EAAA,OAAKA,KAAK,CAACC,QAAQ,GAAG,KAAK,GAAG,KAAK;AAAA,CAAC,6GAW5D;AAACC,OAAA,CAAAP,KAAA,GAAAA,KAAA;AAMK,IAAMQ,mBAAmB,oBAAGP,eAAM,EAAC,KAAK;EAAAE,KAAA;EAAAC,MAAA;AAAA,cACjC,UAAAC,KAAK;EAAA,OAAKA,KAAK,CAACI,QAAQ,GAAG,SAAS,GAAG,QAAQ;AAAA,CAAC,4DAI7D;AAACF,OAAA,CAAAC,mBAAA,GAAAA,mBAAA;AAEK,IAAME,sBAAsB,oBAAGT,eAAM,EAAC,MAAM;EAAAE,KAAA;EAAAC,MAAA;AAAA,4GAOlD;AAACG,OAAA,CAAAG,sBAAA,GAAAA,sBAAA;AAEK,IAAMC,mBAAmB,oBAAGV,eAAM,EAACW,8BAAS;EAAAT,KAAA;EAAAC,MAAA;AAAA,iBAClC,UAAAC,KAAK;EAAA,OAAKA,KAAK,CAACQ,SAAS,KAAK,KAAK,GAAG,gBAAgB,GAAG,cAAc;AAAA,CAAC,MACxF;AAACN,OAAA,CAAAI,mBAAA,GAAAA,mBAAA"}

package/DelayedOnChange/DelayedOnChange.js

@@ -14,6 +14,17 @@ var _excluded = ["children"];
 var emptyFunction = function emptyFunction() {
   return undefined;
 };
+
+/**
+ * This component is used to wrap Input and Textarea components to optimize form re-render.
+ * These 2 are the only components that trigger form model change on each character input.
+ * This means, whenever you type a letter an entire form re-renders.
+ * On complex forms you will feel and see a significant delay if this component is not used.
+ *
+ * The logic behind this component is to serve as a middleware between Form and Input/Textarea, and only notify form of a change when
+ * a user stops typing for given period of time (400ms by default).
+ */
+
 var DelayedOnChange = function DelayedOnChange(_ref) {
   var children = _ref.children,
     other = (0, _objectWithoutProperties2.default)(_ref, _excluded);

package/DelayedOnChange/DelayedOnChange.js.map

@@ -1 +1 @@
-{"version":3,"names":["emptyFunction","undefined","DelayedOnChange","children","other","onChange","delay","initialValue","value","useState","setValue","useEffect","localTimeout","React","useRef","applyValue","callback","current","clearTimeout","onChangeLocal","useCallback","onValueStateChanged","nextValue","setTimeout","newProps","renderProp","child","cloneElement","props","realOnKeyDown","onKeyDown","realOnBlur","onBlur","ev","persist","target","key"],"sources":["DelayedOnChange.ts"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\n\nconst emptyFunction = (): undefined => {\n    return undefined;\n};\n\ninterface ApplyValueCb {\n    (value: string, cb: (value: string) => void): void;\n}\n/**\n * This component is used to wrap Input and Textarea components to optimize form re-render.\n * These 2 are the only components that trigger form model change on each character input.\n * This means, whenever you type a letter an entire form re-renders.\n * On complex forms you will feel and see a significant delay if this component is not used.\n *\n * The logic behind this component is to serve as a middleware between Form and Input/Textarea, and only notify form of a change when\n * a user stops typing for given period of time (400ms by default).\n */\ninterface OnChangeCallable {\n    (value: string, cb?: ApplyValueCb): void;\n}\ninterface OnBlurCallable {\n    (ev: React.SyntheticEvent): void;\n}\ninterface OnKeyDownCallable {\n    (ev: React.KeyboardEvent<HTMLInputElement>): void;\n}\ninterface ChildrenCallableParams {\n    value: string;\n    onChange: OnChangeCallable;\n}\ninterface ChildrenCallable {\n    (params: ChildrenCallableParams): React.ReactElement;\n}\nexport interface DelayedOnChangeProps {\n    value?: string;\n    delay?: number;\n    onChange?: OnChangeCallable;\n    onBlur?: OnBlurCallable;\n    onKeyDown?: OnKeyDownCallable;\n    children: React.ReactNode | ChildrenCallable;\n}\nexport const DelayedOnChange: React.FC<DelayedOnChangeProps> = ({ children, ...other }) => {\n    const { onChange, delay = 400, value: initialValue } = other;\n    const [value, setValue] = useState<string | undefined>(initialValue);\n    // Sync state and props\n    useEffect(() => {\n        if (initialValue !== value) {\n            setValue(initialValue);\n        }\n    }, [initialValue]);\n\n    const localTimeout = React.useRef<number | null>(null);\n\n    const applyValue = (value: string, callback: ApplyValueCb = emptyFunction) => {\n        localTimeout.current && clearTimeout(localTimeout.current);\n        localTimeout.current = null;\n        if (!onChange) {\n            return;\n        }\n        onChange(value, callback);\n    };\n\n    const onChangeLocal = React.useCallback((value: string) => {\n        setValue(value);\n    }, []);\n\n    // this is fired upon change value state\n    const onValueStateChanged = (nextValue: string) => {\n        localTimeout.current && clearTimeout(localTimeout.current);\n        localTimeout.current = null;\n        localTimeout.current = setTimeout(() => applyValue(nextValue), delay) as unknown as number;\n    };\n\n    // need to clear the timeout when unmounting the component\n    useEffect(() => {\n        return () => {\n            if (!localTimeout.current) {\n                return;\n            }\n            clearTimeout(localTimeout.current);\n            localTimeout.current = null;\n        };\n    }, []);\n\n    useEffect(() => {\n        onValueStateChanged(value || \"\");\n    }, [value]);\n\n    const newProps = {\n        ...other,\n        value: value || \"\",\n        onChange: onChangeLocal\n    };\n\n    const renderProp = typeof children === \"function\" ? (children as ChildrenCallable) : null;\n    const child = renderProp\n        ? renderProp(newProps)\n        : React.cloneElement(children as unknown as React.ReactElement, newProps);\n\n    const props = { ...child.props };\n    const realOnKeyDown = props.onKeyDown || emptyFunction;\n    const realOnBlur = props.onBlur || emptyFunction;\n\n    // Need to apply value if input lost focus\n    const onBlur: OnBlurCallable = ev => {\n        if (!ev[\"persist\"]) {\n            return;\n        }\n        ev.persist();\n        applyValue((ev.target as HTMLInputElement).value, () => realOnBlur(ev));\n    };\n\n    // Need to listen for TAB key to apply new value immediately, without delay. Otherwise validation will be triggered with old value.\n    const onKeyDown: OnKeyDownCallable = ev => {\n        ev.persist();\n        if (ev.key === \"Tab\") {\n            applyValue((ev.target as HTMLInputElement).value, () => realOnKeyDown(ev));\n        } else if (ev.key === \"Enter\" && props[\"data-on-enter\"]) {\n            applyValue((ev.target as HTMLInputElement).value, () => realOnKeyDown(ev));\n        } else {\n            realOnKeyDown(ev);\n        }\n    };\n\n    return React.cloneElement(child, { ...props, onBlur, onKeyDown });\n};\n\nexport default DelayedOnChange;\n"],"mappings":"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"}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_excluded","emptyFunction","undefined","DelayedOnChange","_ref","children","other","_objectWithoutProperties2","default","onChange","_other$delay","delay","initialValue","value","_useState","useState","_useState2","_slicedToArray2","setValue","useEffect","localTimeout","React","useRef","applyValue","callback","arguments","length","current","clearTimeout","onChangeLocal","useCallback","onValueStateChanged","nextValue","setTimeout","newProps","_objectSpread2","renderProp","child","cloneElement","props","realOnKeyDown","onKeyDown","realOnBlur","onBlur","ev","persist","target","key","exports","_default"],"sources":["DelayedOnChange.ts"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\n\nconst emptyFunction = (): undefined => {\n    return undefined;\n};\n\ninterface ApplyValueCb {\n    (value: string, cb: (value: string) => void): void;\n}\n/**\n * This component is used to wrap Input and Textarea components to optimize form re-render.\n * These 2 are the only components that trigger form model change on each character input.\n * This means, whenever you type a letter an entire form re-renders.\n * On complex forms you will feel and see a significant delay if this component is not used.\n *\n * The logic behind this component is to serve as a middleware between Form and Input/Textarea, and only notify form of a change when\n * a user stops typing for given period of time (400ms by default).\n */\ninterface OnChangeCallable {\n    (value: string, cb?: ApplyValueCb): void;\n}\ninterface OnBlurCallable {\n    (ev: React.SyntheticEvent): void;\n}\ninterface OnKeyDownCallable {\n    (ev: React.KeyboardEvent<HTMLInputElement>): void;\n}\ninterface ChildrenCallableParams {\n    value: string;\n    onChange: OnChangeCallable;\n}\ninterface ChildrenCallable {\n    (params: ChildrenCallableParams): React.ReactElement;\n}\nexport interface DelayedOnChangeProps {\n    value?: string;\n    delay?: number;\n    onChange?: OnChangeCallable;\n    onBlur?: OnBlurCallable;\n    onKeyDown?: OnKeyDownCallable;\n    children: React.ReactNode | ChildrenCallable;\n}\nexport const DelayedOnChange: React.FC<DelayedOnChangeProps> = ({ children, ...other }) => {\n    const { onChange, delay = 400, value: initialValue } = other;\n    const [value, setValue] = useState<string | undefined>(initialValue);\n    // Sync state and props\n    useEffect(() => {\n        if (initialValue !== value) {\n            setValue(initialValue);\n        }\n    }, [initialValue]);\n\n    const localTimeout = React.useRef<number | null>(null);\n\n    const applyValue = (value: string, callback: ApplyValueCb = emptyFunction) => {\n        localTimeout.current && clearTimeout(localTimeout.current);\n        localTimeout.current = null;\n        if (!onChange) {\n            return;\n        }\n        onChange(value, callback);\n    };\n\n    const onChangeLocal = React.useCallback((value: string) => {\n        setValue(value);\n    }, []);\n\n    // this is fired upon change value state\n    const onValueStateChanged = (nextValue: string) => {\n        localTimeout.current && clearTimeout(localTimeout.current);\n        localTimeout.current = null;\n        localTimeout.current = setTimeout(() => applyValue(nextValue), delay) as unknown as number;\n    };\n\n    // need to clear the timeout when unmounting the component\n    useEffect(() => {\n        return () => {\n            if (!localTimeout.current) {\n                return;\n            }\n            clearTimeout(localTimeout.current);\n            localTimeout.current = null;\n        };\n    }, []);\n\n    useEffect(() => {\n        onValueStateChanged(value || \"\");\n    }, [value]);\n\n    const newProps = {\n        ...other,\n        value: value || \"\",\n        onChange: onChangeLocal\n    };\n\n    const renderProp = typeof children === \"function\" ? (children as ChildrenCallable) : null;\n    const child = renderProp\n        ? renderProp(newProps)\n        : React.cloneElement(children as unknown as React.ReactElement, newProps);\n\n    const props = { ...child.props };\n    const realOnKeyDown = props.onKeyDown || emptyFunction;\n    const realOnBlur = props.onBlur || emptyFunction;\n\n    // Need to apply value if input lost focus\n    const onBlur: OnBlurCallable = ev => {\n        if (!ev[\"persist\"]) {\n            return;\n        }\n        ev.persist();\n        applyValue((ev.target as HTMLInputElement).value, () => realOnBlur(ev));\n    };\n\n    // Need to listen for TAB key to apply new value immediately, without delay. Otherwise validation will be triggered with old value.\n    const onKeyDown: OnKeyDownCallable = ev => {\n        ev.persist();\n        if (ev.key === \"Tab\") {\n            applyValue((ev.target as HTMLInputElement).value, () => realOnKeyDown(ev));\n        } else if (ev.key === \"Enter\" && props[\"data-on-enter\"]) {\n            applyValue((ev.target as HTMLInputElement).value, () => realOnKeyDown(ev));\n        } else {\n            realOnKeyDown(ev);\n        }\n    };\n\n    return React.cloneElement(child, { ...props, onBlur, onKeyDown });\n};\n\nexport default DelayedOnChange;\n"],"mappings":"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"}

package/DelayedOnChange/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as DelayedOnChange } from \"./DelayedOnChange\";\nexport { default as withDelayedOnChange } from \"./withDelayedOnChange\";\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AACA"}
+{"version":3,"names":["_DelayedOnChange","_interopRequireDefault","require","_withDelayedOnChange"],"sources":["index.ts"],"sourcesContent":["export { default as DelayedOnChange } from \"./DelayedOnChange\";\nexport { default as withDelayedOnChange } from \"./withDelayedOnChange\";\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA,IAAAA,gBAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,oBAAA,GAAAF,sBAAA,CAAAC,OAAA"}

package/DelayedOnChange/withDelayedOnChange.js.map

@@ -1 +1 @@
-{"version":3,"names":["withDelayedOnChange","decorator","Component","WithDelayedOnChange","props","value","onChange","rest"],"sources":["withDelayedOnChange.tsx"],"sourcesContent":["import React from \"react\";\nimport Delayed, { DelayedOnChangeProps } from \"./DelayedOnChange\";\n\nexport default function withDelayedOnChange() {\n    return function decorator(Component: React.FC<DelayedOnChangeProps>) {\n        return function WithDelayedOnChange(props: DelayedOnChangeProps) {\n            const { value, onChange, ...rest } = props;\n            return (\n                <Delayed value={value} onChange={onChange}>\n                    {({ value, onChange }) => (\n                        <Component {...rest} value={value} onChange={onChange} />\n                    )}\n                </Delayed>\n            );\n        };\n    };\n}\n"],"mappings":";;;;;;;;AAAA;AACA;AAAkE;AAEnD,SAASA,mBAAmB,GAAG;EAC1C,OAAO,SAASC,SAAS,CAACC,SAAyC,EAAE;IACjE,OAAO,SAASC,mBAAmB,CAACC,KAA2B,EAAE;MAC7D,IAAQC,KAAK,GAAwBD,KAAK,CAAlCC,KAAK;QAAEC,QAAQ,GAAcF,KAAK,CAA3BE,QAAQ;QAAKC,IAAI,0CAAKH,KAAK;MAC1C,oBACI,6BAAC,wBAAO;QAAC,KAAK,EAAEC,KAAM;QAAC,QAAQ,EAAEC;MAAS,GACrC;QAAA,IAAGD,KAAK,QAALA,KAAK;UAAEC,QAAQ,QAARA,QAAQ;QAAA,oBACf,6BAAC,SAAS,oBAAKC,IAAI;UAAE,KAAK,EAAEF,KAAM;UAAC,QAAQ,EAAEC;QAAS,GAAG;MAAA,CAC5D,CACK;IAElB,CAAC;EACL,CAAC;AACL"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_DelayedOnChange","_excluded","withDelayedOnChange","decorator","Component","WithDelayedOnChange","props","value","onChange","rest","_objectWithoutProperties2","default","createElement","_ref","Object","assign"],"sources":["withDelayedOnChange.tsx"],"sourcesContent":["import React from \"react\";\nimport Delayed, { DelayedOnChangeProps } from \"./DelayedOnChange\";\n\nexport default function withDelayedOnChange() {\n    return function decorator(Component: React.FC<DelayedOnChangeProps>) {\n        return function WithDelayedOnChange(props: DelayedOnChangeProps) {\n            const { value, onChange, ...rest } = props;\n            return (\n                <Delayed value={value} onChange={onChange}>\n                    {({ value, onChange }) => (\n                        <Component {...rest} value={value} onChange={onChange} />\n                    )}\n                </Delayed>\n            );\n        };\n    };\n}\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,gBAAA,GAAAF,sBAAA,CAAAC,OAAA;AAAkE,IAAAE,SAAA;AAEnD,SAASC,mBAAmBA,CAAA,EAAG;EAC1C,OAAO,SAASC,SAASA,CAACC,SAAyC,EAAE;IACjE,OAAO,SAASC,mBAAmBA,CAACC,KAA2B,EAAE;MAC7D,IAAQC,KAAK,GAAwBD,KAAK,CAAlCC,KAAK;QAAEC,QAAQ,GAAcF,KAAK,CAA3BE,QAAQ;QAAKC,IAAI,OAAAC,yBAAA,CAAAC,OAAA,EAAKL,KAAK,EAAAL,SAAA;MAC1C,oBACIJ,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACZ,gBAAA,CAAAW,OAAO;QAACJ,KAAK,EAAEA,KAAM;QAACC,QAAQ,EAAEA;MAAS,GACrC,UAAAK,IAAA;QAAA,IAAGN,KAAK,GAAAM,IAAA,CAALN,KAAK;UAAEC,QAAQ,GAAAK,IAAA,CAARL,QAAQ;QAAA,oBACfX,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACR,SAAS,EAAAU,MAAA,CAAAC,MAAA,KAAKN,IAAI;UAAEF,KAAK,EAAEA,KAAM;UAACC,QAAQ,EAAEA;QAAS,EAAE,CAAC;MAAA,CAExD,CAAC;IAElB,CAAC;EACL,CAAC;AACL"}

package/Dialog/Dialog.js

@@ -8,10 +8,8 @@ exports.DialogTitle = exports.DialogContent = exports.DialogCancel = exports.Dia
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _reactDom = _interopRequireDefault(require("react-dom"));
 var _dialog = require("@rmwc/dialog");
@@ -28,7 +26,6 @@ var Dialog = /*#__PURE__*/function (_React$Component) {
     /**
      * We can safely cast
      */
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "container", void 0);
     _this.container = document.getElementById("dialog-container");
     if (!_this.container) {
       _this.container = document.createElement("div");

package/Dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"names":["Dialog","props","container","document","getElementById","createElement","setAttribute","body","appendChild","children","ReactDOM","createPortal","getClasses","React","Component","DialogTitle","DialogContent","addMargin","css","DialogActions","DialogButton","DialogCancel","DialogAccept"],"sources":["Dialog.tsx"],"sourcesContent":["import React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport {\n    Dialog as RmwcDialog,\n    DialogProps as RmwcDialogProps,\n    DialogOnCloseEventT,\n    DialogContent as RmwcDialogContent,\n    DialogContentProps as RmwcDialogContentProps,\n    DialogTitle as RmwcDialogTitle,\n    DialogTitleProps as RmwcDialogTitleProps,\n    DialogActions as RmwcDialogActions,\n    DialogActionsProps as RmwcDialogActionsProps,\n    DialogButton as RmwcDialogButton,\n    DialogButtonProps as RmwcDialogButtonProps\n} from \"@rmwc/dialog\";\nimport { css } from \"emotion\";\nimport { getClasses } from \"~/Helpers\";\n\nexport type DialogOnClose = (event: DialogOnCloseEventT) => void;\n\nexport interface DialogProps extends RmwcDialogProps {\n    className?: string;\n\n    // Component's custom in-line styles.\n    style?: React.CSSProperties;\n\n    // If true, dialog will be permanently fixed inside of a view (works for temporary and persistent modes).\n    open?: boolean;\n\n    onClose?: (evt: DialogOnCloseEventT) => void;\n\n    preventOutsideDismiss?: boolean;\n}\n\nexport class Dialog extends React.Component<DialogProps> {\n    container: HTMLElement;\n\n    constructor(props: DialogProps) {\n        super(props);\n        /**\n         * We can safely cast\n         */\n        this.container = document.getElementById(\"dialog-container\") as HTMLElement;\n\n        if (!this.container) {\n            this.container = document.createElement(\"div\");\n            this.container.setAttribute(\"id\", \"dialog-container\");\n            const container = this.container;\n            document.body && document.body.appendChild(container);\n        }\n    }\n\n    public override render() {\n        const { children, ...props } = this.props;\n        const container = this.container;\n\n        // Let's pass \"permanent\" / \"persistent\" / \"temporary\" flags as \"mode\" prop instead.\n        return ReactDOM.createPortal(\n            <RmwcDialog {...getClasses(props, \"webiny-ui-dialog\")}>{children}</RmwcDialog>,\n            container\n        );\n    }\n}\n\nexport interface DialogTitleProps extends RmwcDialogTitleProps {\n    /**\n     * Title text.\n     */\n    children: React.ReactNode[] | React.ReactNode;\n}\n\n/**\n * Dialog's header, which can accept DialogHeaderTitle component or any other set of components.\n */\nexport const DialogTitle: React.FC<DialogTitleProps> = props => (\n    <RmwcDialogTitle {...getClasses(props, \"webiny-ui-dialog__title\")} />\n);\n\nexport type DialogContentProps = RmwcDialogContentProps & {\n    /**\n     * Dialog content.\n     */\n    children: React.ReactNode[] | React.ReactNode;\n\n    className?: string;\n};\n\n/**\n * A simple component for showing dialog's body.\n */\nexport const DialogContent: React.FC<DialogContentProps> = props => (\n    <RmwcDialogContent {...getClasses(props, \"webiny-ui-dialog__content\")} />\n);\n\nexport interface DialogActionsProps extends RmwcDialogActionsProps {\n    /**\n     * Action buttons.\n     */\n    children: React.ReactNode[] | React.ReactNode;\n\n    // Dialog component's custom in-line styles.\n    style?: React.CSSProperties;\n}\n\nconst addMargin = css`\n    button:last-of-type {\n        margin-left: 8px;\n    }\n`;\n\n/**\n * Can be used to show accept and cancel buttons.\n */\nexport const DialogActions: React.FC<DialogActionsProps> = props => (\n    <RmwcDialogActions {...getClasses(props, [addMargin, \"webiny-ui-dialog__actions\"])} />\n);\n\ninterface DialogButtonProps extends RmwcDialogButtonProps {\n    /**\n     * Callback to execute then button is clicked.\n     */\n    onClick?: (e: React.MouseEvent) => void;\n\n    className?: string;\n}\n\n/**\n * Use this to show a simple button.\n */\nexport const DialogButton: React.FC<DialogButtonProps> = props => (\n    <RmwcDialogButton {...getClasses(props, \"webiny-ui-dialog__button\")} />\n);\n\ninterface DialogCancelProps extends RmwcDialogButtonProps {\n    /**\n     * Callback to execute then button is clicked.\n     */\n    onClick?: (e: React.MouseEvent) => void;\n}\n\n/**\n * Use this to close the dialog without taking any additional action.\n */\nexport const DialogCancel: React.FC<DialogCancelProps> = props => {\n    return (\n        <DialogButton\n            {...getClasses(props, \"webiny-ui-dialog__button webiny-ui-dialog__button--cancel\")}\n            action=\"close\"\n            data-testid=\"dialog-cancel\"\n        >\n            {props.children}\n        </DialogButton>\n    );\n};\n\ninterface DialogAcceptProps extends RmwcDialogButtonProps {\n    /**\n     * Callback to execute then button is clicked.\n     */\n    onClick?: (e: React.MouseEvent) => void;\n}\n\n/**\n * Use this to close the dialog without taking any additional action.\n */\nexport const DialogAccept: React.FC<DialogAcceptProps> = props => {\n    return (\n        <DialogButton\n            {...getClasses(props, \"webiny-ui-dialog__button webiny-ui-dialog__button--accept\")}\n            action=\"accept\"\n            data-testid=\"dialog-accept\"\n        >\n            {props.children}\n        </DialogButton>\n    );\n};\n"],"mappings":";;;;;;;;;;;;;;AAAA;AACA;AACA;AAaA;AACA;AAAuC;AAAA,IAkB1BA,MAAM;EAAA;EAAA;EAGf,gBAAYC,KAAkB,EAAE;IAAA;IAAA;IAC5B,0BAAMA,KAAK;IACX;AACR;AACA;IAFQ;IAGA,MAAKC,SAAS,GAAGC,QAAQ,CAACC,cAAc,CAAC,kBAAkB,CAAgB;IAE3E,IAAI,CAAC,MAAKF,SAAS,EAAE;MACjB,MAAKA,SAAS,GAAGC,QAAQ,CAACE,aAAa,CAAC,KAAK,CAAC;MAC9C,MAAKH,SAAS,CAACI,YAAY,CAAC,IAAI,EAAE,kBAAkB,CAAC;MACrD,IAAMJ,SAAS,GAAG,MAAKA,SAAS;MAChCC,QAAQ,CAACI,IAAI,IAAIJ,QAAQ,CAACI,IAAI,CAACC,WAAW,CAACN,SAAS,CAAC;IACzD;IAAC;EACL;EAAC;IAAA;IAAA,OAED,kBAAyB;MACrB,kBAA+B,IAAI,CAACD,KAAK;QAAjCQ,QAAQ,eAARA,QAAQ;QAAKR,KAAK;MAC1B,IAAMC,SAAS,GAAG,IAAI,CAACA,SAAS;;MAEhC;MACA,oBAAOQ,iBAAQ,CAACC,YAAY,eACxB,6BAAC,cAAU,EAAK,IAAAC,mBAAU,EAACX,KAAK,EAAE,kBAAkB,CAAC,EAAGQ,QAAQ,CAAc,EAC9EP,SAAS,CACZ;IACL;EAAC;EAAA;AAAA,EA3BuBW,cAAK,CAACC,SAAS;AAAA;AAqC3C;AACA;AACA;AACO,IAAMC,WAAuC,GAAG,SAA1CA,WAAuC,CAAGd,KAAK;EAAA,oBACxD,6BAAC,mBAAe,EAAK,IAAAW,mBAAU,EAACX,KAAK,EAAE,yBAAyB,CAAC,CAAI;AAAA,CACxE;AAAC;AAWF;AACA;AACA;AACO,IAAMe,aAA2C,GAAG,SAA9CA,aAA2C,CAAGf,KAAK;EAAA,oBAC5D,6BAAC,qBAAiB,EAAK,IAAAW,mBAAU,EAACX,KAAK,EAAE,2BAA2B,CAAC,CAAI;AAAA,CAC5E;AAAC;AAYF,IAAMgB,SAAS,oBAAGC,YAAG,0DAIpB;;AAED;AACA;AACA;AACO,IAAMC,aAA2C,GAAG,SAA9CA,aAA2C,CAAGlB,KAAK;EAAA,oBAC5D,6BAAC,qBAAiB,EAAK,IAAAW,mBAAU,EAACX,KAAK,EAAE,CAACgB,SAAS,EAAE,2BAA2B,CAAC,CAAC,CAAI;AAAA,CACzF;AAAC;AAWF;AACA;AACA;AACO,IAAMG,YAAyC,GAAG,SAA5CA,YAAyC,CAAGnB,KAAK;EAAA,oBAC1D,6BAAC,oBAAgB,EAAK,IAAAW,mBAAU,EAACX,KAAK,EAAE,0BAA0B,CAAC,CAAI;AAAA,CAC1E;AAAC;AASF;AACA;AACA;AACO,IAAMoB,YAAyC,GAAG,SAA5CA,YAAyC,CAAGpB,KAAK,EAAI;EAC9D,oBACI,6BAAC,YAAY,oBACL,IAAAW,mBAAU,EAACX,KAAK,EAAE,2DAA2D,CAAC;IAClF,MAAM,EAAC,OAAO;IACd,eAAY;EAAe,IAE1BA,KAAK,CAACQ,QAAQ,CACJ;AAEvB,CAAC;AAAC;AASF;AACA;AACA;AACO,IAAMa,YAAyC,GAAG,SAA5CA,YAAyC,CAAGrB,KAAK,EAAI;EAC9D,oBACI,6BAAC,YAAY,oBACL,IAAAW,mBAAU,EAACX,KAAK,EAAE,2DAA2D,CAAC;IAClF,MAAM,EAAC,QAAQ;IACf,eAAY;EAAe,IAE1BA,KAAK,CAACQ,QAAQ,CACJ;AAEvB,CAAC;AAAC"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactDom","_dialog","_emotion","_Helpers","_excluded","Dialog","_React$Component","_inherits2","default","_super","_createSuper2","props","_this","_classCallCheck2","call","container","document","getElementById","createElement","setAttribute","body","appendChild","_createClass2","key","value","render","_this$props","children","_objectWithoutProperties2","ReactDOM","createPortal","getClasses","React","Component","exports","DialogTitle","DialogContent","addMargin","css","DialogActions","DialogButton","DialogCancel","Object","assign","action","DialogAccept"],"sources":["Dialog.tsx"],"sourcesContent":["import React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport {\n    Dialog as RmwcDialog,\n    DialogProps as RmwcDialogProps,\n    DialogOnCloseEventT,\n    DialogContent as RmwcDialogContent,\n    DialogContentProps as RmwcDialogContentProps,\n    DialogTitle as RmwcDialogTitle,\n    DialogTitleProps as RmwcDialogTitleProps,\n    DialogActions as RmwcDialogActions,\n    DialogActionsProps as RmwcDialogActionsProps,\n    DialogButton as RmwcDialogButton,\n    DialogButtonProps as RmwcDialogButtonProps\n} from \"@rmwc/dialog\";\nimport { css } from \"emotion\";\nimport { getClasses } from \"~/Helpers\";\n\nexport type DialogOnClose = (event: DialogOnCloseEventT) => void;\n\nexport interface DialogProps extends RmwcDialogProps {\n    className?: string;\n\n    // Component's custom in-line styles.\n    style?: React.CSSProperties;\n\n    // If true, dialog will be permanently fixed inside of a view (works for temporary and persistent modes).\n    open?: boolean;\n\n    onClose?: (evt: DialogOnCloseEventT) => void;\n\n    preventOutsideDismiss?: boolean;\n}\n\nexport class Dialog extends React.Component<DialogProps> {\n    container: HTMLElement;\n\n    constructor(props: DialogProps) {\n        super(props);\n        /**\n         * We can safely cast\n         */\n        this.container = document.getElementById(\"dialog-container\") as HTMLElement;\n\n        if (!this.container) {\n            this.container = document.createElement(\"div\");\n            this.container.setAttribute(\"id\", \"dialog-container\");\n            const container = this.container;\n            document.body && document.body.appendChild(container);\n        }\n    }\n\n    public override render() {\n        const { children, ...props } = this.props;\n        const container = this.container;\n\n        // Let's pass \"permanent\" / \"persistent\" / \"temporary\" flags as \"mode\" prop instead.\n        return ReactDOM.createPortal(\n            <RmwcDialog {...getClasses(props, \"webiny-ui-dialog\")}>{children}</RmwcDialog>,\n            container\n        );\n    }\n}\n\nexport interface DialogTitleProps extends RmwcDialogTitleProps {\n    /**\n     * Title text.\n     */\n    children: React.ReactNode[] | React.ReactNode;\n}\n\n/**\n * Dialog's header, which can accept DialogHeaderTitle component or any other set of components.\n */\nexport const DialogTitle: React.FC<DialogTitleProps> = props => (\n    <RmwcDialogTitle {...getClasses(props, \"webiny-ui-dialog__title\")} />\n);\n\nexport type DialogContentProps = RmwcDialogContentProps & {\n    /**\n     * Dialog content.\n     */\n    children: React.ReactNode[] | React.ReactNode;\n\n    className?: string;\n};\n\n/**\n * A simple component for showing dialog's body.\n */\nexport const DialogContent: React.FC<DialogContentProps> = props => (\n    <RmwcDialogContent {...getClasses(props, \"webiny-ui-dialog__content\")} />\n);\n\nexport interface DialogActionsProps extends RmwcDialogActionsProps {\n    /**\n     * Action buttons.\n     */\n    children: React.ReactNode[] | React.ReactNode;\n\n    // Dialog component's custom in-line styles.\n    style?: React.CSSProperties;\n}\n\nconst addMargin = css`\n    button:last-of-type {\n        margin-left: 8px;\n    }\n`;\n\n/**\n * Can be used to show accept and cancel buttons.\n */\nexport const DialogActions: React.FC<DialogActionsProps> = props => (\n    <RmwcDialogActions {...getClasses(props, [addMargin, \"webiny-ui-dialog__actions\"])} />\n);\n\ninterface DialogButtonProps extends RmwcDialogButtonProps {\n    /**\n     * Callback to execute then button is clicked.\n     */\n    onClick?: (e: React.MouseEvent) => void;\n\n    className?: string;\n}\n\n/**\n * Use this to show a simple button.\n */\nexport const DialogButton: React.FC<DialogButtonProps> = props => (\n    <RmwcDialogButton {...getClasses(props, \"webiny-ui-dialog__button\")} />\n);\n\ninterface DialogCancelProps extends RmwcDialogButtonProps {\n    /**\n     * Callback to execute then button is clicked.\n     */\n    onClick?: (e: React.MouseEvent) => void;\n}\n\n/**\n * Use this to close the dialog without taking any additional action.\n */\nexport const DialogCancel: React.FC<DialogCancelProps> = props => {\n    return (\n        <DialogButton\n            {...getClasses(props, \"webiny-ui-dialog__button webiny-ui-dialog__button--cancel\")}\n            action=\"close\"\n            data-testid=\"dialog-cancel\"\n        >\n            {props.children}\n        </DialogButton>\n    );\n};\n\ninterface DialogAcceptProps extends RmwcDialogButtonProps {\n    /**\n     * Callback to execute then button is clicked.\n     */\n    onClick?: (e: React.MouseEvent) => void;\n}\n\n/**\n * Use this to close the dialog without taking any additional action.\n */\nexport const DialogAccept: React.FC<DialogAcceptProps> = props => {\n    return (\n        <DialogButton\n            {...getClasses(props, \"webiny-ui-dialog__button webiny-ui-dialog__button--accept\")}\n            action=\"accept\"\n            data-testid=\"dialog-accept\"\n        >\n            {props.children}\n        </DialogButton>\n    );\n};\n"],"mappings":"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"}

package/Dialog/Dialog.stories.js.map

@@ -1 +1 @@
-{"version":3,"names":["story","storiesOf","module","addDecorator","withKnobs","add","open","boolean","readme","console","log","info","propTables","Dialog","DialogButton","DialogAccept","DialogCancel","DialogActions","DialogTitle","DialogContent"],"sources":["Dialog.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n    Story,\n    StoryReadme,\n    StorySandboxCode,\n    StorySandbox,\n    StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../Dialog/README.md\";\nimport { withKnobs, boolean } from \"@storybook/addon-knobs\";\n\nimport {\n    Dialog,\n    DialogButton,\n    DialogAccept,\n    DialogCancel,\n    DialogActions,\n    DialogTitle,\n    DialogContent\n} from \".\";\n\nconst story = storiesOf(\"Components/Dialog\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n    \"usage\",\n    () => {\n        const open = boolean(\"Open\", false);\n\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"dialog\"}>\n                    <StorySandboxExample title={\"A list with all possible options\"}>\n                        Toggle <code>open</code> prop via the bottom knobs.\n                        <br />\n                        <br />\n                        Note that instead of using <code>DialogFooter.Button</code> with{\" \"}\n                        <code>accept</code> or <code>cancel</code> prop, you can use a shorter{\" \"}\n                        <code>DialogAccept</code> and <code>DialogCancel</code> components\n                        respectively.\n                        <Dialog open={open}>\n                            <DialogTitle>Delete confirmation</DialogTitle>\n                            <DialogContent>Are you sure you want to delete?</DialogContent>\n                            <DialogActions>\n                                <DialogCancel onClick={() => console.log(\"Cancel\")}>\n                                    Cancel\n                                </DialogCancel>\n                                <DialogAccept onClick={() => console.log(\"Accept\")}>\n                                    OK\n                                </DialogAccept>\n                            </DialogActions>\n                        </Dialog>\n                    </StorySandboxExample>\n                    <StorySandboxCode>\n                        {`\n                    <Dialog open={${open}}>\n                        <DialogTitle>\n                            Delete confirmation\n                        </DialogTitle>\n                        <DialogBody>Are you sure you want to delete?</DialogBody>\n                        <DialogFooter>\n                            <DialogCancel onClick={() => console.log(\"Cancel\")}>Cancel</DialogCancel>\n                            <DialogAccept onClick={() => console.log(\"Accept\")}>OK</DialogAccept>\n                        </DialogFooter>\n                    </Dialog>\n                    `}\n                    </StorySandboxCode>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    {\n        info: {\n            propTables: [\n                Dialog,\n                DialogButton,\n                DialogAccept,\n                DialogCancel,\n                DialogActions,\n                DialogTitle,\n                DialogContent\n            ]\n        }\n    }\n);\n"],"mappings":";;;AAAA;AACA;AACA;AAOA;AACA;AAEA;AAUA,IAAMA,KAAK,GAAG,IAAAC,iBAAS,EAAC,mBAAmB,EAAEC,MAAM,CAAC;AACpDF,KAAK,CAACG,YAAY,CAACC,qBAAS,CAAC;AAE7BJ,KAAK,CAACK,GAAG,CACL,OAAO,EACP,YAAM;EACF,IAAMC,IAAI,GAAG,IAAAC,mBAAO,EAAC,MAAM,EAAE,KAAK,CAAC;EAEnC,oBACI,6BAAC,YAAK,qBACF,6BAAC,kBAAW,QAAEC,eAAM,CAAe,eACnC,6BAAC,mBAAY;IAAC,KAAK,EAAE;EAAS,gBAC1B,6BAAC,0BAAmB;IAAC,KAAK,EAAE;EAAmC,GAAC,SACrD,0DAAM,MAAI,CAAO,+BACxB,uDAAM,eACN,wCAAM,+BACqB,0DAAM,qBAAmB,CAAO,SAAK,EAAC,GAAG,eACpE,2CAAM,QAAM,CAAO,QAAI,0DAAM,QAAM,CAAO,gCAA4B,EAAC,GAAG,eAC1E,2CAAM,cAAY,CAAO,SAAK,0DAAM,cAAY,CAAO,6BAEvD,4CAAC,QAAM;IAAC,IAAI,EAAEF;EAAK,gBACf,6BAAC,aAAW,QAAC,qBAAmB,CAAc,eAC9C,6BAAC,eAAa,QAAC,kCAAgC,CAAgB,eAC/D,6BAAC,eAAa,qBACV,6BAAC,cAAY;IAAC,OAAO,EAAE;MAAA,OAAMG,OAAO,CAACC,GAAG,CAAC,QAAQ,CAAC;IAAA;EAAC,GAAC,QAEpD,CAAe,eACf,6BAAC,cAAY;IAAC,OAAO,EAAE;MAAA,OAAMD,OAAO,CAACC,GAAG,CAAC,QAAQ,CAAC;IAAA;EAAC,GAAC,IAEpD,CAAe,CACH,CACX,CACS,eACtB,6BAAC,uBAAgB,sDAEDJ,IAAI,+iBAWD,CACR,CACX;AAEhB,CAAC,EACD;EACIK,IAAI,EAAE;IACFC,UAAU,EAAE,CACRC,QAAM,EACNC,cAAY,EACZC,cAAY,EACZC,cAAY,EACZC,eAAa,EACbC,aAAW,EACXC,eAAa;EAErB;AACJ,CAAC,CACJ"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_react2","_Story","_README","_addonKnobs","_","story","storiesOf","module","addDecorator","withKnobs","add","open","boolean","default","createElement","Story","StoryReadme","readme","StorySandbox","title","StorySandboxExample","Dialog","DialogTitle","DialogContent","DialogActions","DialogCancel","onClick","console","log","DialogAccept","StorySandboxCode","concat","info","propTables","DialogButton"],"sources":["Dialog.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport { storiesOf } from \"@storybook/react\";\nimport {\n    Story,\n    StoryReadme,\n    StorySandboxCode,\n    StorySandbox,\n    StorySandboxExample\n} from \"@webiny/storybook-utils/Story\";\nimport readme from \"./../Dialog/README.md\";\nimport { withKnobs, boolean } from \"@storybook/addon-knobs\";\n\nimport {\n    Dialog,\n    DialogButton,\n    DialogAccept,\n    DialogCancel,\n    DialogActions,\n    DialogTitle,\n    DialogContent\n} from \".\";\n\nconst story = storiesOf(\"Components/Dialog\", module);\nstory.addDecorator(withKnobs);\n\nstory.add(\n    \"usage\",\n    () => {\n        const open = boolean(\"Open\", false);\n\n        return (\n            <Story>\n                <StoryReadme>{readme}</StoryReadme>\n                <StorySandbox title={\"dialog\"}>\n                    <StorySandboxExample title={\"A list with all possible options\"}>\n                        Toggle <code>open</code> prop via the bottom knobs.\n                        <br />\n                        <br />\n                        Note that instead of using <code>DialogFooter.Button</code> with{\" \"}\n                        <code>accept</code> or <code>cancel</code> prop, you can use a shorter{\" \"}\n                        <code>DialogAccept</code> and <code>DialogCancel</code> components\n                        respectively.\n                        <Dialog open={open}>\n                            <DialogTitle>Delete confirmation</DialogTitle>\n                            <DialogContent>Are you sure you want to delete?</DialogContent>\n                            <DialogActions>\n                                <DialogCancel onClick={() => console.log(\"Cancel\")}>\n                                    Cancel\n                                </DialogCancel>\n                                <DialogAccept onClick={() => console.log(\"Accept\")}>\n                                    OK\n                                </DialogAccept>\n                            </DialogActions>\n                        </Dialog>\n                    </StorySandboxExample>\n                    <StorySandboxCode>\n                        {`\n                    <Dialog open={${open}}>\n                        <DialogTitle>\n                            Delete confirmation\n                        </DialogTitle>\n                        <DialogBody>Are you sure you want to delete?</DialogBody>\n                        <DialogFooter>\n                            <DialogCancel onClick={() => console.log(\"Cancel\")}>Cancel</DialogCancel>\n                            <DialogAccept onClick={() => console.log(\"Accept\")}>OK</DialogAccept>\n                        </DialogFooter>\n                    </Dialog>\n                    `}\n                    </StorySandboxCode>\n                </StorySandbox>\n            </Story>\n        );\n    },\n    {\n        info: {\n            propTables: [\n                Dialog,\n                DialogButton,\n                DialogAccept,\n                DialogCancel,\n                DialogActions,\n                DialogTitle,\n                DialogContent\n            ]\n        }\n    }\n);\n"],"mappings":"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"}

package/Dialog/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Dialog\";\n"],"mappings":";;;;;AAAA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
+{"version":3,"names":["_Dialog","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["index.ts"],"sourcesContent":["export * from \"./Dialog\";\n"],"mappings":";;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,OAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,OAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,OAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}

package/Drawer/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"names":["DrawerHeader","props","DrawerContent","Drawer"],"sources":["Drawer.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n    Drawer as RmwcDrawer,\n    DrawerContent as RmwcDrawerContent,\n    DrawerHeader as RmwcDrawerHeader,\n    DrawerProps as RmwcDrawerProps,\n    DrawerHeaderProps as RmwcDrawerHeaderProps,\n    DrawerContentProps as RmwcDrawerContentProps\n} from \"@rmwc/drawer\";\n\ntype DrawerHeaderProps = RmwcDrawerHeaderProps & {\n    children: any;\n    className?: string;\n};\n\n/**\n * Shows header of the drawer.\n */\nconst DrawerHeader = (props: DrawerHeaderProps) => <RmwcDrawerHeader {...props} />;\n\nexport type DrawerContentProps = RmwcDrawerContentProps & {\n    /**\n     * Drawer direction.\n     */\n    dir?: string;\n    /**\n     * Drawer content.\n     */\n    children: React.ReactNode;\n\n    /**\n     * CSS class name\n     */\n    className?: string;\n};\n\n/**\n * Shows drawer content. It can be anything, but commonly a List component would suffice here.\n */\nconst DrawerContent = (props: DrawerContentProps) => <RmwcDrawerContent {...props} />;\n\ntype DrawerProps = RmwcDrawerProps & {\n    /**\n     * Drawer direction.\n     */\n    dir?: string;\n    /**\n     * Drawer content.\n     */\n    children: React.ReactNode;\n\n    /**\n     * CSS class name\n     */\n    className?: string;\n};\n/**\n * Use Drawer component to display navigation for the whole app or just a small section of it.\n */\nconst Drawer = (props: DrawerProps) => {\n    return <RmwcDrawer {...props} />;\n};\n\nexport { Drawer, DrawerHeader, DrawerContent };\n"],"mappings":";;;;;;;AAAA;AACA;AAcA;AACA;AACA;AACA,IAAMA,YAAY,GAAG,SAAfA,YAAY,CAAIC,KAAwB;EAAA,oBAAK,6BAAC,oBAAgB,EAAKA,KAAK,CAAI;AAAA;AAAC;AAkBnF;AACA;AACA;AACA,IAAMC,aAAa,GAAG,SAAhBA,aAAa,CAAID,KAAyB;EAAA,oBAAK,6BAAC,qBAAiB,EAAKA,KAAK,CAAI;AAAA;AAAC;AAiBtF;AACA;AACA;AACA,IAAME,MAAM,GAAG,SAATA,MAAM,CAAIF,KAAkB,EAAK;EACnC,oBAAO,6BAAC,cAAU,EAAKA,KAAK,CAAI;AACpC,CAAC;AAAC"}
+{"version":3,"names":["_react","_interopRequireDefault","require","_drawer","DrawerHeader","props","default","createElement","exports","DrawerContent","Drawer"],"sources":["Drawer.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n    Drawer as RmwcDrawer,\n    DrawerContent as RmwcDrawerContent,\n    DrawerHeader as RmwcDrawerHeader,\n    DrawerProps as RmwcDrawerProps,\n    DrawerHeaderProps as RmwcDrawerHeaderProps,\n    DrawerContentProps as RmwcDrawerContentProps\n} from \"@rmwc/drawer\";\n\ntype DrawerHeaderProps = RmwcDrawerHeaderProps & {\n    children: any;\n    className?: string;\n};\n\n/**\n * Shows header of the drawer.\n */\nconst DrawerHeader = (props: DrawerHeaderProps) => <RmwcDrawerHeader {...props} />;\n\nexport type DrawerContentProps = RmwcDrawerContentProps & {\n    /**\n     * Drawer direction.\n     */\n    dir?: string;\n    /**\n     * Drawer content.\n     */\n    children: React.ReactNode;\n\n    /**\n     * CSS class name\n     */\n    className?: string;\n};\n\n/**\n * Shows drawer content. It can be anything, but commonly a List component would suffice here.\n */\nconst DrawerContent = (props: DrawerContentProps) => <RmwcDrawerContent {...props} />;\n\ntype DrawerProps = RmwcDrawerProps & {\n    /**\n     * Drawer direction.\n     */\n    dir?: string;\n    /**\n     * Drawer content.\n     */\n    children: React.ReactNode;\n\n    /**\n     * CSS class name\n     */\n    className?: string;\n};\n/**\n * Use Drawer component to display navigation for the whole app or just a small section of it.\n */\nconst Drawer = (props: DrawerProps) => {\n    return <RmwcDrawer {...props} />;\n};\n\nexport { Drawer, DrawerHeader, DrawerContent };\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAcA;AACA;AACA;AACA,IAAME,YAAY,GAAG,SAAfA,YAAYA,CAAIC,KAAwB;EAAA,oBAAKL,MAAA,CAAAM,OAAA,CAAAC,aAAA,CAACJ,OAAA,CAAAC,YAAgB,EAAKC,KAAQ,CAAC;AAAA;AAACG,OAAA,CAAAJ,YAAA,GAAAA,YAAA;AAkBnF;AACA;AACA;AACA,IAAMK,aAAa,GAAG,SAAhBA,aAAaA,CAAIJ,KAAyB;EAAA,oBAAKL,MAAA,CAAAM,OAAA,CAAAC,aAAA,CAACJ,OAAA,CAAAM,aAAiB,EAAKJ,KAAQ,CAAC;AAAA;AAACG,OAAA,CAAAC,aAAA,GAAAA,aAAA;AAiBtF;AACA;AACA;AACA,IAAMC,MAAM,GAAG,SAATA,MAAMA,CAAIL,KAAkB,EAAK;EACnC,oBAAOL,MAAA,CAAAM,OAAA,CAAAC,aAAA,CAACJ,OAAA,CAAAO,MAAU,EAAKL,KAAQ,CAAC;AACpC,CAAC;AAACG,OAAA,CAAAE,MAAA,GAAAA,MAAA"}