@webiny/ui 0.0.0-unstable.aad28a72ae → 0.0.0-unstable.d16f688daf

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/ImageUpload/styled.d.ts +3 -3
  2. package/List/DataList/DataList.js +11 -52
  3. package/List/DataList/DataList.js.map +1 -1
  4. package/package.json +7 -7
package/ImageUpload/styled.d.ts CHANGED
@@ -7,15 +7,15 @@ export declare const AddImageWrapperRound: import("@emotion/styled-base").Styled
7
7
  theme?: object | undefined;
8
8
  } & {
9
9
  children?: import("react").ReactNode;
10
- }, "key" | keyof import("react").HTMLAttributes<HTMLDivElement> | "theme"> & {
10
+ }, "key" | "theme" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
11
11
  ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
12
12
  }, Pick<Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Pick<Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, keyof import("react").HTMLAttributes<HTMLDivElement>> & {
13
13
  theme?: object | undefined;
14
14
  } & {
15
15
  children?: import("react").ReactNode;
16
- }, "key" | keyof import("react").HTMLAttributes<HTMLDivElement> | "theme"> & {
16
+ }, "key" | "theme" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
17
17
  ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
18
- }, keyof import("react").HTMLAttributes<HTMLDivElement> | "theme">, object>;
18
+ }, "theme" | keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
19
19
  export declare const RemoveImage: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
20
20
  export declare const EditImage: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
21
21
  export declare const ImagePreviewWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>>, object>;
package/List/DataList/DataList.js CHANGED
@@ -29,8 +29,6 @@ var _Checkbox = require("../../Checkbox");
29
29
 
30
30
  var _Menu = require("../../Menu");
31
31
 
32
- var _Grid = require("../../Grid");
33
-
34
32
  var _icons = require("./icons");
35
33
 
36
34
  var _ = require("..");
@@ -101,21 +99,16 @@ var ListContainer = /*#__PURE__*/(0, _styled.default)("div", {
101
99
  }
102
100
  }
103
101
  });
104
- var listHeader = /*#__PURE__*/(0, _emotion.css)({
105
- borderBottom: "1px solid var(--mdc-theme-on-background)",
106
- color: "var(--mdc-theme-text-primary-on-background)",
107
- width: "100%"
108
- }, "label:listHeader;");
109
- var listSubHeader = /*#__PURE__*/(0, _emotion.css)({
110
- width: "100%",
111
- "&.mdc-layout-grid": {
112
- borderBottom: "1px solid var(--mdc-theme-on-background)",
113
- padding: "10px 24px 10px 12px",
114
- color: "var(--mdc-theme-text-primary-on-background)"
115
- }
116
- }, "label:listSubHeader;");
102
+ var ListHeader = /*#__PURE__*/(0, _styled.default)("div", {
103
+ label: "ListHeader",
104
+ target: "e14cccao1"
105
+ })("border-bottom:1px solid var(--mdc-theme-on-background);color:var(--mdc-theme-text-primary-on-background);display:flex;justify-content:space-between;align-items:center;padding:0 24px;max-height:85px;min-height:85px;");
106
+ var ListSubHeader = /*#__PURE__*/(0, _styled.default)("div", {
107
+ label: "ListSubHeader",
108
+ target: "e14cccao2"
109
+ })("display:flex;justify-content:space-between;align-items:center;padding:10px;border-bottom:1px solid var(--mdc-theme-on-background);");
117
110
  var ListHeaderItem = /*#__PURE__*/(0, _styled.default)("div", {
118
- target: "e14cccao1",
111
+ target: "e14cccao3",
119
112
  label: "ListHeaderItem"
120
113
  })({
121
114
  display: "inline-block",
@@ -125,13 +118,6 @@ var ListHeaderItem = /*#__PURE__*/(0, _styled.default)("div", {
125
118
  pointerEvents: "none"
126
119
  }
127
120
  });
128
- var listTitle = /*#__PURE__*/(0, _emotion.css)({
129
- display: "flex",
130
- alignItems: "center"
131
- }, "label:listTitle;");
132
- var listActions = /*#__PURE__*/(0, _emotion.css)({
133
- textAlign: "right"
134
- }, "label:listActions;");
135
121
  var scrollList = /*#__PURE__*/(0, _emotion.css)({
136
122
  overflow: "auto",
137
123
  height: "calc(100vh - 235px)"
@@ -263,16 +249,6 @@ var Pagination = function Pagination(props) {
263
249
  }))));
264
250
  };
265
251
 
266
- var Search = function Search(props) {
267
- if (!props.search) {
268
- return null;
269
- }
270
-
271
- return /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
272
- span: 7
273
- }, /*#__PURE__*/_react.default.cloneElement(props.search, props));
274
- };
275
-
276
252
  var DataList = function DataList(props) {
277
253
  var render = null;
278
254
 
@@ -286,29 +262,12 @@ var DataList = function DataList(props) {
286
262
  }
287
263
 
288
264
  var showOptions = props.showOptions || {};
289
- var listHeaderActionsCellSpan = props.actions ? 7 : 0;
290
- var listHeaderTitleCellSpan = 12 - listHeaderActionsCellSpan;
291
265
  return /*#__PURE__*/_react.default.createElement(_DataListModalOverlay.DataListModalOverlayProvider, null, /*#__PURE__*/_react.default.createElement(ListContainer, {
292
266
  className: "webiny-data-list",
293
267
  "data-testid": "ui.list.data-list"
294
- }, (props.title || props.actions) && /*#__PURE__*/_react.default.createElement(_Grid.Grid, {
295
- className: listHeader
296
- }, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
297
- span: listHeaderTitleCellSpan,
298
- className: listTitle
299
- }, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
268
+ }, (props.title || props.actions) && /*#__PURE__*/_react.default.createElement(ListHeader, null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
300
269
  use: "headline5"
301
- }, props.title)), props.actions && /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
302
- span: listHeaderActionsCellSpan,
303
- className: listActions
304
- }, props.actions)), Object.keys(showOptions).length > 0 && /*#__PURE__*/_react.default.createElement(_Grid.Grid, {
305
- className: listSubHeader
306
- }, /*#__PURE__*/_react.default.createElement(Search, props), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
307
- span: props.search ? 5 : 12,
308
- style: {
309
- justifySelf: "end"
310
- }
311
- }, /*#__PURE__*/_react.default.createElement(MultiSelectAll, props), showOptions.refresh && /*#__PURE__*/_react.default.createElement(RefreshButton, props), showOptions.pagination && /*#__PURE__*/_react.default.createElement(Pagination, props), showOptions.sorters && /*#__PURE__*/_react.default.createElement(Sorters, props), showOptions.filters && /*#__PURE__*/_react.default.createElement(Filters, props), props.modalOverlayAction ? /*#__PURE__*/_react.default.createElement(ListHeaderItem, null, props.modalOverlayAction) : null, /*#__PURE__*/_react.default.createElement(MultiSelectActions, props))), /*#__PURE__*/_react.default.createElement("div", {
270
+ }, props.title), props.actions), Object.keys(showOptions).length > 0 && /*#__PURE__*/_react.default.createElement(ListSubHeader, null, props.search ? /*#__PURE__*/_react.default.cloneElement(props.search, props) : null, /*#__PURE__*/_react.default.createElement(MultiSelectAll, props), showOptions.refresh && /*#__PURE__*/_react.default.createElement(RefreshButton, props), showOptions.pagination && /*#__PURE__*/_react.default.createElement(Pagination, props), showOptions.sorters && /*#__PURE__*/_react.default.createElement(Sorters, props), showOptions.filters && /*#__PURE__*/_react.default.createElement(Filters, props), props.modalOverlayAction ? /*#__PURE__*/_react.default.createElement(ListHeaderItem, null, props.modalOverlayAction) : null, /*#__PURE__*/_react.default.createElement(MultiSelectActions, props)), /*#__PURE__*/_react.default.createElement("div", {
312
271
  className: (0, _classnames.default)(dataListContent, "webiny-data-list__content")
313
272
  }, props.subHeader, render, props.modalOverlay)));
314
273
  };
package/List/DataList/DataList.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["ListContainer","styled","position","height","paddingBottom","paddingTop","borderBottom","padding","minHeight","display","marginRight","width","margin","alignItems","justifyContent","flexDirection","boxSizing","whiteSpace","marginTop","marginBottom","textAlign","listHeader","css","color","listSubHeader","ListHeaderItem","verticalAlign","opacity","pointerEvents","listTitle","listActions","scrollList","overflow","dataListContent","MultiSelectAll","props","multiSelectActions","isAllMultiSelected","isNoneMultiSelected","multiSelectAll","data","MultiSelectActions","RefreshButton","refresh","Sorters","sorters","map","sorter","label","setSorters","value","Filters","filters","Pagination","pagination","setNextPage","classNames","disabled","hasPreviousPage","setPreviousPage","hasNextPage","Array","isArray","perPageOptions","setPerPage","perPage","Search","search","React","cloneElement","DataList","render","loading","loader","isEmpty","noData","ch","children","showOptions","listHeaderActionsCellSpan","actions","listHeaderTitleCellSpan","title","Object","keys","length","justifySelf","modalOverlayAction","subHeader","modalOverlay","defaultProps","meta","setPage","noop","ScrollList","className"],"sources":["DataList.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport classNames from \"classnames\";\nimport Loader from \"./Loader\";\nimport NoData from \"./NoData\";\nimport { Typography } from \"~/Typography\";\nimport { css } from \"emotion\";\nimport noop from \"lodash/noop\";\nimport isEmpty from \"lodash/isEmpty\";\n\nimport { Checkbox } from \"../../Checkbox\";\nimport { Menu, MenuItem } from \"../../Menu\";\nimport { Grid, Cell } from \"../../Grid\";\n\nimport {\n RefreshIcon,\n SortIcon,\n FilterIcon,\n PreviousPageIcon,\n NextPageIcon,\n OptionsIcon\n} from \"./icons\";\nimport { List, ListItem, ListProps } from \"..\";\nimport { DataListModalOverlayProvider } from \"./DataListModalOverlay\";\nimport { PaginationProp, SortersProp } from \"./types\";\n\nconst ListContainer = styled(\"div\")({\n position: \"relative\",\n height: \"100%\",\n \".mdc-list\": {\n paddingBottom: 0,\n paddingTop: 0\n },\n \".mdc-list-item\": {\n borderBottom: \"1px solid var(--mdc-theme-on-background)\",\n padding: \"10px 20px 10px 20px\",\n height: \"auto\",\n minHeight: 40,\n \".mdc-list-item__text, .mdc-list-item__secondary-text, .webiny-list-text-overline\": {\n display: \"block\"\n },\n \".mdc-list-item__graphic\": {\n marginRight: 20\n },\n \".mdc-list-item__text\": {\n width: \"100%\",\n margin: \"-20px 0\",\n padding: \"20px 0\"\n },\n \".mdc-list-item__meta\": {\n alignItems: \"center\",\n display: \"flex\",\n justifyContent: \"space-between\",\n flexDirection: \"column\",\n position: \"relative\",\n padding: \"5px 0\",\n boxSizing: \"border-box\",\n height: \"100%\",\n whiteSpace: \"nowrap\",\n marginTop: -10,\n marginBottom: -10,\n \".webiny-list-actions\": {\n display: \"none\"\n },\n \".webiny-list-top-caption, .webiny-list-bottom-caption\": {\n //position: 'absolute',\n width: \"100%\",\n textAlign: \"right\"\n },\n \".webiny-list-top-caption\": {\n marginBottom: 20\n }\n },\n \"&:hover\": {\n \".mdc-list-item__meta\": {\n \".webiny-list-top-caption, .webiny-list-bottom-caption\": {\n display: \"none\"\n },\n \".webiny-list-actions\": {\n display: \"flex\",\n height: \"100%\",\n alignItems: \"center\"\n }\n }\n }\n }\n});\n\nconst listHeader = css({\n borderBottom: \"1px solid var(--mdc-theme-on-background)\",\n color: \"var(--mdc-theme-text-primary-on-background)\",\n width: \"100%\"\n});\n\nconst listSubHeader = css({\n width: \"100%\",\n \"&.mdc-layout-grid\": {\n borderBottom: \"1px solid var(--mdc-theme-on-background)\",\n padding: \"10px 24px 10px 12px\",\n color: \"var(--mdc-theme-text-primary-on-background)\"\n }\n});\n\nconst ListHeaderItem = styled(\"div\")({\n display: \"inline-block\",\n verticalAlign: \"middle\",\n \"&.disabled\": {\n opacity: 0.5,\n pointerEvents: \"none\"\n }\n});\n\nconst listTitle = css({\n display: \"flex\",\n alignItems: \"center\"\n});\n\nconst listActions = css({\n textAlign: \"right\"\n});\n\nconst scrollList = css({\n overflow: \"auto\",\n height: \"calc(100vh - 235px)\"\n});\n\nconst dataListContent = css({\n position: \"relative\",\n height: \"100%\",\n overflow: \"auto\"\n});\n\n// This was copied from \"./types\" so that it can be outputted in docs.\ninterface DataListProps {\n // Pass a function to take full control of list render.\n children?: ((props: any) => React.ReactNode) | null;\n\n // A title of paginated list.\n title?: React.ReactNode;\n\n // FormData that needs to be shown in the list.\n data?: Record<string, any>[] | null;\n\n // A callback that must refresh current view by repeating the previous query.\n refresh?: (() => void) | null;\n\n // If true, Loader component will be shown, disallowing any interaction.\n loading?: boolean;\n\n // Provide a custom loader. Shown while the content is loading.\n loader?: React.ReactNode;\n\n // Provide a custom no data component. Shown while there is no data to be shown.\n noData?: React.ReactNode;\n\n // Provide all pagination data, options and callbacks here.\n pagination?: PaginationProp;\n\n // Triggered once a sorter has been selected.\n setSorters?: Function | null;\n\n // Provide all sorters options and callbacks here.\n sorters?: SortersProp | null;\n\n // Provide actions that will be shown in the top right corner (eg. export or import actions).\n actions?: React.ReactNode;\n\n // Provide filters that will be shown in the top left corner (eg. filter by category or status).\n filters?: React.ReactNode;\n\n // Provide actions that can be executed on one or more multi-selected list items (eg. export or delete).\n multiSelectActions?: React.ReactNode;\n\n // Provide callback that will be executed once user selects all list items.\n multiSelectAll?: (value: boolean, data: Record<string, any>[] | null) => void;\n\n // Callback which returns true if all items were selected, otherwise returns false.\n isAllMultiSelected?: (data: Record<string, any>[] | null) => boolean;\n\n // Callback which returns true if none of the items were selected, otherwise returns false.\n isNoneMultiSelected?: (data: Record<string, any>[] | null) => boolean;\n\n showOptions?: {\n refresh?: boolean;\n pagination?: boolean;\n filters?: boolean;\n sorters?: boolean;\n [key: string]: any;\n };\n\n // Provide search UI that will be shown in the top left corner.\n search?: React.ReactElement;\n // Provide simple modal UI that will be shown over the list content.\n modalOverlay?: React.ReactElement;\n // Provide an action element that handle toggling the \"Modal overlay\".\n modalOverlayAction?: React.ReactElement;\n // Provide additional UI for list sub-header.\n subHeader?: React.ReactElement;\n\n meta?: Record<string, any> | null;\n\n setPage?: ((page: string) => void) | null;\n\n setPerPage?: ((page: string) => void) | null;\n\n perPageOptions?: number[];\n}\n\nconst MultiSelectAll: React.FC<DataListProps> = props => {\n const { multiSelectActions } = props;\n if (!multiSelectActions) {\n return null;\n }\n /**\n * We can safely cast because we have defaults.\n */\n const { isAllMultiSelected, isNoneMultiSelected, multiSelectAll, data } =\n props as Required<DataListProps>;\n\n return (\n <React.Fragment>\n {typeof multiSelectAll === \"function\" && (\n <ListHeaderItem>\n <Checkbox\n indeterminate={!isAllMultiSelected(data) && !isNoneMultiSelected(data)}\n value={isAllMultiSelected(data)}\n onClick={() => {\n multiSelectAll(!isAllMultiSelected(data), data);\n }}\n />\n </ListHeaderItem>\n )}\n </React.Fragment>\n );\n};\n\nconst MultiSelectActions: React.FC<DataListProps> = props => {\n const { multiSelectActions } = props;\n if (!multiSelectActions) {\n return null;\n }\n\n return <ListHeaderItem>{multiSelectActions}</ListHeaderItem>;\n};\n\nconst RefreshButton: React.FC<DataListProps> = props => {\n const refresh = props.refresh;\n if (!refresh) {\n return null;\n }\n\n return (\n <ListHeaderItem>\n <RefreshIcon onClick={() => refresh()} />\n </ListHeaderItem>\n );\n};\n\nconst Sorters: React.FC<DataListProps> = props => {\n const sorters = props.sorters;\n if (!sorters) {\n return null;\n }\n\n return (\n <ListHeaderItem>\n <Menu handle={<SortIcon />}>\n {sorters.map(sorter => (\n <MenuItem\n key={sorter.label}\n onClick={() => {\n if (sorters && props.setSorters) {\n props.setSorters(sorter.value);\n }\n }}\n >\n {sorter.label}\n </MenuItem>\n ))}\n </Menu>\n </ListHeaderItem>\n );\n};\n\nconst Filters: React.FC<DataListProps> = props => {\n const filters = props.filters;\n if (!filters) {\n return null;\n }\n\n return (\n <ListHeaderItem>\n <Menu handle={<FilterIcon />}>{filters}</Menu>\n </ListHeaderItem>\n );\n};\n\nconst Pagination: React.FC<DataListProps> = props => {\n const { pagination } = props;\n if (!pagination) {\n return null;\n }\n\n return (\n <React.Fragment>\n {pagination.setNextPage && (\n <React.Fragment>\n <ListHeaderItem\n className={classNames({\n disabled: !pagination.hasPreviousPage\n })}\n >\n <PreviousPageIcon\n onClick={() => {\n if (pagination.setPreviousPage && pagination.hasPreviousPage) {\n pagination.setPreviousPage();\n }\n }}\n />\n </ListHeaderItem>\n\n <ListHeaderItem\n className={classNames({\n disabled: !pagination.hasNextPage\n })}\n >\n <NextPageIcon\n onClick={() => {\n if (pagination.setNextPage && pagination.hasNextPage) {\n pagination.setNextPage();\n }\n }}\n />\n </ListHeaderItem>\n </React.Fragment>\n )}\n\n {Array.isArray(pagination.perPageOptions) && pagination.setPerPage && (\n <ListHeaderItem>\n <Menu handle={<OptionsIcon />}>\n {pagination.setPerPage &&\n pagination.perPageOptions.map(perPage => (\n <MenuItem\n key={perPage}\n onClick={() =>\n pagination.setPerPage && pagination.setPerPage(perPage)\n }\n >\n {perPage}\n </MenuItem>\n ))}\n </Menu>\n </ListHeaderItem>\n )}\n </React.Fragment>\n );\n};\n\nconst Search: React.FC<DataListProps> = props => {\n if (!props.search) {\n return null;\n }\n return <Cell span={7}>{React.cloneElement(props.search, props)}</Cell>;\n};\n\nexport const DataList: React.FC<DataListProps> = props => {\n let render: React.ReactNode | null = null;\n\n if (props.loading) {\n render = props.loader;\n } else if (isEmpty(props.data)) {\n render = props.noData;\n } else {\n const ch = props.children;\n render = typeof ch === \"function\" ? ch(props) : null;\n }\n\n const showOptions = props.showOptions || {};\n\n const listHeaderActionsCellSpan = props.actions ? 7 : 0;\n const listHeaderTitleCellSpan = 12 - listHeaderActionsCellSpan;\n\n return (\n <DataListModalOverlayProvider>\n <ListContainer className={\"webiny-data-list\"} data-testid={\"ui.list.data-list\"}>\n {(props.title || props.actions) && (\n <Grid className={listHeader}>\n <Cell span={listHeaderTitleCellSpan} className={listTitle}>\n <Typography use=\"headline5\">{props.title}</Typography>\n </Cell>\n {props.actions && (\n <Cell span={listHeaderActionsCellSpan} className={listActions}>\n {props.actions}\n </Cell>\n )}\n </Grid>\n )}\n\n {Object.keys(showOptions).length > 0 && (\n <Grid className={listSubHeader}>\n <Search {...props} />\n <Cell span={props.search ? 5 : 12} style={{ justifySelf: \"end\" }}>\n <MultiSelectAll {...props} />\n {showOptions.refresh && <RefreshButton {...props} />}\n {showOptions.pagination && <Pagination {...props} />}\n {showOptions.sorters && <Sorters {...props} />}\n {showOptions.filters && <Filters {...props} />}\n {props.modalOverlayAction ? (\n <ListHeaderItem>{props.modalOverlayAction}</ListHeaderItem>\n ) : null}\n <MultiSelectActions {...props} />\n </Cell>\n </Grid>\n )}\n\n <div className={classNames(dataListContent, \"webiny-data-list__content\")}>\n {props.subHeader}\n {render}\n {props.modalOverlay}\n </div>\n </ListContainer>\n </DataListModalOverlayProvider>\n );\n};\n\nDataList.defaultProps = {\n children: null,\n title: null,\n data: null,\n meta: null,\n loading: false,\n refresh: () => {\n return void 0;\n },\n setPage: null,\n setPerPage: null,\n perPageOptions: [10, 25, 50],\n filters: null,\n sorters: null,\n setSorters: null,\n actions: null,\n multiSelectAll: noop,\n isAllMultiSelected: () => false,\n isNoneMultiSelected: () => false,\n loader: <Loader />,\n noData: <NoData />,\n showOptions: {\n refresh: true,\n pagination: true,\n sorters: true,\n filters: true\n }\n};\n\nexport interface ScrollListProps extends ListProps {\n children: React.ReactElement<typeof ListItem>[];\n}\n\nexport const ScrollList: React.FC<ScrollListProps> = props => {\n return (\n <List {...props} className={classNames(props.className, scrollList)}>\n {props.children}\n </List>\n );\n};\n"],"mappings":"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"}
1
+ {"version":3,"names":["ListContainer","styled","position","height","paddingBottom","paddingTop","borderBottom","padding","minHeight","display","marginRight","width","margin","alignItems","justifyContent","flexDirection","boxSizing","whiteSpace","marginTop","marginBottom","textAlign","ListHeader","ListSubHeader","ListHeaderItem","verticalAlign","opacity","pointerEvents","scrollList","css","overflow","dataListContent","MultiSelectAll","props","multiSelectActions","isAllMultiSelected","isNoneMultiSelected","multiSelectAll","data","MultiSelectActions","RefreshButton","refresh","Sorters","sorters","map","sorter","label","setSorters","value","Filters","filters","Pagination","pagination","setNextPage","classNames","disabled","hasPreviousPage","setPreviousPage","hasNextPage","Array","isArray","perPageOptions","setPerPage","perPage","DataList","render","loading","loader","isEmpty","noData","ch","children","showOptions","title","actions","Object","keys","length","search","React","cloneElement","modalOverlayAction","subHeader","modalOverlay","defaultProps","meta","setPage","noop","ScrollList","className"],"sources":["DataList.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport classNames from \"classnames\";\nimport Loader from \"./Loader\";\nimport NoData from \"./NoData\";\nimport { Typography } from \"~/Typography\";\nimport { css } from \"emotion\";\nimport noop from \"lodash/noop\";\nimport isEmpty from \"lodash/isEmpty\";\nimport { Checkbox } from \"../../Checkbox\";\nimport { Menu, MenuItem } from \"~/Menu\";\n\nimport {\n RefreshIcon,\n SortIcon,\n FilterIcon,\n PreviousPageIcon,\n NextPageIcon,\n OptionsIcon\n} from \"./icons\";\nimport { List, ListItem, ListProps } from \"..\";\nimport { DataListModalOverlayProvider } from \"./DataListModalOverlay\";\nimport { PaginationProp, SortersProp } from \"./types\";\n\nconst ListContainer = styled(\"div\")({\n position: \"relative\",\n height: \"100%\",\n \".mdc-list\": {\n paddingBottom: 0,\n paddingTop: 0\n },\n \".mdc-list-item\": {\n borderBottom: \"1px solid var(--mdc-theme-on-background)\",\n padding: \"10px 20px 10px 20px\",\n height: \"auto\",\n minHeight: 40,\n \".mdc-list-item__text, .mdc-list-item__secondary-text, .webiny-list-text-overline\": {\n display: \"block\"\n },\n \".mdc-list-item__graphic\": {\n marginRight: 20\n },\n \".mdc-list-item__text\": {\n width: \"100%\",\n margin: \"-20px 0\",\n padding: \"20px 0\"\n },\n \".mdc-list-item__meta\": {\n alignItems: \"center\",\n display: \"flex\",\n justifyContent: \"space-between\",\n flexDirection: \"column\",\n position: \"relative\",\n padding: \"5px 0\",\n boxSizing: \"border-box\",\n height: \"100%\",\n whiteSpace: \"nowrap\",\n marginTop: -10,\n marginBottom: -10,\n \".webiny-list-actions\": {\n display: \"none\"\n },\n \".webiny-list-top-caption, .webiny-list-bottom-caption\": {\n //position: 'absolute',\n width: \"100%\",\n textAlign: \"right\"\n },\n \".webiny-list-top-caption\": {\n marginBottom: 20\n }\n },\n \"&:hover\": {\n \".mdc-list-item__meta\": {\n \".webiny-list-top-caption, .webiny-list-bottom-caption\": {\n display: \"none\"\n },\n \".webiny-list-actions\": {\n display: \"flex\",\n height: \"100%\",\n alignItems: \"center\"\n }\n }\n }\n }\n});\n\nconst ListHeader = styled.div`\n border-bottom: 1px solid var(--mdc-theme-on-background);\n color: var(--mdc-theme-text-primary-on-background);\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 0 24px;\n max-height: 85px;\n min-height: 85px;\n`;\n\nconst ListSubHeader = styled.div`\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 10px;\n border-bottom: 1px solid var(--mdc-theme-on-background);\n`;\n\nconst ListHeaderItem = styled(\"div\")({\n display: \"inline-block\",\n verticalAlign: \"middle\",\n \"&.disabled\": {\n opacity: 0.5,\n pointerEvents: \"none\"\n }\n});\n\nconst scrollList = css({\n overflow: \"auto\",\n height: \"calc(100vh - 235px)\"\n});\n\nconst dataListContent = css({\n position: \"relative\",\n height: \"100%\",\n overflow: \"auto\"\n});\n\n// This was copied from \"./types\" so that it can be outputted in docs.\ninterface DataListProps {\n // Pass a function to take full control of list render.\n children?: ((props: any) => React.ReactNode) | null;\n\n // A title of paginated list.\n title?: React.ReactNode;\n\n // FormData that needs to be shown in the list.\n data?: Record<string, any>[] | null;\n\n // A callback that must refresh current view by repeating the previous query.\n refresh?: (() => void) | null;\n\n // If true, Loader component will be shown, disallowing any interaction.\n loading?: boolean;\n\n // Provide a custom loader. Shown while the content is loading.\n loader?: React.ReactNode;\n\n // Provide a custom no data component. Shown while there is no data to be shown.\n noData?: React.ReactNode;\n\n // Provide all pagination data, options and callbacks here.\n pagination?: PaginationProp;\n\n // Triggered once a sorter has been selected.\n setSorters?: Function | null;\n\n // Provide all sorters options and callbacks here.\n sorters?: SortersProp | null;\n\n // Provide actions that will be shown in the top right corner (eg. export or import actions).\n actions?: React.ReactNode;\n\n // Provide filters that will be shown in the top left corner (eg. filter by category or status).\n filters?: React.ReactNode;\n\n // Provide actions that can be executed on one or more multi-selected list items (eg. export or delete).\n multiSelectActions?: React.ReactNode;\n\n // Provide callback that will be executed once user selects all list items.\n multiSelectAll?: (value: boolean, data: Record<string, any>[] | null) => void;\n\n // Callback which returns true if all items were selected, otherwise returns false.\n isAllMultiSelected?: (data: Record<string, any>[] | null) => boolean;\n\n // Callback which returns true if none of the items were selected, otherwise returns false.\n isNoneMultiSelected?: (data: Record<string, any>[] | null) => boolean;\n\n showOptions?: {\n refresh?: boolean;\n pagination?: boolean;\n filters?: boolean;\n sorters?: boolean;\n [key: string]: any;\n };\n\n // Provide search UI that will be shown in the top left corner.\n search?: React.ReactElement;\n // Provide simple modal UI that will be shown over the list content.\n modalOverlay?: React.ReactElement;\n // Provide an action element that handle toggling the \"Modal overlay\".\n modalOverlayAction?: React.ReactElement;\n // Provide additional UI for list sub-header.\n subHeader?: React.ReactElement;\n\n meta?: Record<string, any> | null;\n\n setPage?: ((page: string) => void) | null;\n\n setPerPage?: ((page: string) => void) | null;\n\n perPageOptions?: number[];\n}\n\nconst MultiSelectAll: React.FC<DataListProps> = props => {\n const { multiSelectActions } = props;\n if (!multiSelectActions) {\n return null;\n }\n /**\n * We can safely cast because we have defaults.\n */\n const { isAllMultiSelected, isNoneMultiSelected, multiSelectAll, data } =\n props as Required<DataListProps>;\n\n return (\n <React.Fragment>\n {typeof multiSelectAll === \"function\" && (\n <ListHeaderItem>\n <Checkbox\n indeterminate={!isAllMultiSelected(data) && !isNoneMultiSelected(data)}\n value={isAllMultiSelected(data)}\n onClick={() => {\n multiSelectAll(!isAllMultiSelected(data), data);\n }}\n />\n </ListHeaderItem>\n )}\n </React.Fragment>\n );\n};\n\nconst MultiSelectActions: React.FC<DataListProps> = props => {\n const { multiSelectActions } = props;\n if (!multiSelectActions) {\n return null;\n }\n\n return <ListHeaderItem>{multiSelectActions}</ListHeaderItem>;\n};\n\nconst RefreshButton: React.FC<DataListProps> = props => {\n const refresh = props.refresh;\n if (!refresh) {\n return null;\n }\n\n return (\n <ListHeaderItem>\n <RefreshIcon onClick={() => refresh()} />\n </ListHeaderItem>\n );\n};\n\nconst Sorters: React.FC<DataListProps> = props => {\n const sorters = props.sorters;\n if (!sorters) {\n return null;\n }\n\n return (\n <ListHeaderItem>\n <Menu handle={<SortIcon />}>\n {sorters.map(sorter => (\n <MenuItem\n key={sorter.label}\n onClick={() => {\n if (sorters && props.setSorters) {\n props.setSorters(sorter.value);\n }\n }}\n >\n {sorter.label}\n </MenuItem>\n ))}\n </Menu>\n </ListHeaderItem>\n );\n};\n\nconst Filters: React.FC<DataListProps> = props => {\n const filters = props.filters;\n if (!filters) {\n return null;\n }\n\n return (\n <ListHeaderItem>\n <Menu handle={<FilterIcon />}>{filters}</Menu>\n </ListHeaderItem>\n );\n};\n\nconst Pagination: React.FC<DataListProps> = props => {\n const { pagination } = props;\n if (!pagination) {\n return null;\n }\n\n return (\n <React.Fragment>\n {pagination.setNextPage && (\n <React.Fragment>\n <ListHeaderItem\n className={classNames({\n disabled: !pagination.hasPreviousPage\n })}\n >\n <PreviousPageIcon\n onClick={() => {\n if (pagination.setPreviousPage && pagination.hasPreviousPage) {\n pagination.setPreviousPage();\n }\n }}\n />\n </ListHeaderItem>\n\n <ListHeaderItem\n className={classNames({\n disabled: !pagination.hasNextPage\n })}\n >\n <NextPageIcon\n onClick={() => {\n if (pagination.setNextPage && pagination.hasNextPage) {\n pagination.setNextPage();\n }\n }}\n />\n </ListHeaderItem>\n </React.Fragment>\n )}\n\n {Array.isArray(pagination.perPageOptions) && pagination.setPerPage && (\n <ListHeaderItem>\n <Menu handle={<OptionsIcon />}>\n {pagination.setPerPage &&\n pagination.perPageOptions.map(perPage => (\n <MenuItem\n key={perPage}\n onClick={() =>\n pagination.setPerPage && pagination.setPerPage(perPage)\n }\n >\n {perPage}\n </MenuItem>\n ))}\n </Menu>\n </ListHeaderItem>\n )}\n </React.Fragment>\n );\n};\n\nexport const DataList: React.FC<DataListProps> = props => {\n let render: React.ReactNode | null = null;\n\n if (props.loading) {\n render = props.loader;\n } else if (isEmpty(props.data)) {\n render = props.noData;\n } else {\n const ch = props.children;\n render = typeof ch === \"function\" ? ch(props) : null;\n }\n\n const showOptions = props.showOptions || {};\n\n return (\n <DataListModalOverlayProvider>\n <ListContainer className={\"webiny-data-list\"} data-testid={\"ui.list.data-list\"}>\n {(props.title || props.actions) && (\n <ListHeader>\n <Typography use=\"headline5\">{props.title}</Typography>\n {props.actions}\n </ListHeader>\n )}\n\n {Object.keys(showOptions).length > 0 && (\n <ListSubHeader>\n {props.search ? React.cloneElement(props.search, props) : null}\n <MultiSelectAll {...props} />\n {showOptions.refresh && <RefreshButton {...props} />}\n {showOptions.pagination && <Pagination {...props} />}\n {showOptions.sorters && <Sorters {...props} />}\n {showOptions.filters && <Filters {...props} />}\n {props.modalOverlayAction ? (\n <ListHeaderItem>{props.modalOverlayAction}</ListHeaderItem>\n ) : null}\n <MultiSelectActions {...props} />\n </ListSubHeader>\n )}\n\n <div className={classNames(dataListContent, \"webiny-data-list__content\")}>\n {props.subHeader}\n {render}\n {props.modalOverlay}\n </div>\n </ListContainer>\n </DataListModalOverlayProvider>\n );\n};\n\nDataList.defaultProps = {\n children: null,\n title: null,\n data: null,\n meta: null,\n loading: false,\n refresh: () => {\n return void 0;\n },\n setPage: null,\n setPerPage: null,\n perPageOptions: [10, 25, 50],\n filters: null,\n sorters: null,\n setSorters: null,\n actions: null,\n multiSelectAll: noop,\n isAllMultiSelected: () => false,\n isNoneMultiSelected: () => false,\n loader: <Loader />,\n noData: <NoData />,\n showOptions: {\n refresh: true,\n pagination: true,\n sorters: true,\n filters: true\n }\n};\n\nexport interface ScrollListProps extends ListProps {\n children: React.ReactElement<typeof ListItem>[];\n}\n\nexport const ScrollList: React.FC<ScrollListProps> = props => {\n return (\n <List {...props} className={classNames(props.className, scrollList)}>\n {props.children}\n </List>\n );\n};\n"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@webiny/ui",
3
- "version": "0.0.0-unstable.aad28a72ae",
3
+ "version": "0.0.0-unstable.d16f688daf",
4
4
  "main": "index.js",
5
5
  "repository": {
6
6
  "type": "git",
@@ -81,11 +81,11 @@
81
81
  "@types/react-custom-scrollbars": "^4.0.10",
82
82
  "@types/react-transition-group": "^4.4.4",
83
83
  "@types/shortid": "^0.0.29",
84
- "@webiny/cli": "^0.0.0-unstable.aad28a72ae",
85
- "@webiny/form": "^0.0.0-unstable.aad28a72ae",
86
- "@webiny/project-utils": "^0.0.0-unstable.aad28a72ae",
87
- "@webiny/storybook-utils": "^0.0.0-unstable.aad28a72ae",
88
- "@webiny/validation": "^0.0.0-unstable.aad28a72ae",
84
+ "@webiny/cli": "^0.0.0-unstable.d16f688daf",
85
+ "@webiny/form": "^0.0.0-unstable.d16f688daf",
86
+ "@webiny/project-utils": "^0.0.0-unstable.d16f688daf",
87
+ "@webiny/storybook-utils": "^0.0.0-unstable.d16f688daf",
88
+ "@webiny/validation": "^0.0.0-unstable.d16f688daf",
89
89
  "babel-loader": "^8.0.0-beta.6",
90
90
  "babel-plugin-emotion": "^9.2.8",
91
91
  "execa": "^5.0.0",
@@ -132,5 +132,5 @@
132
132
  ]
133
133
  }
134
134
  },
135
- "gitHead": "aad28a72ae72f19b80a3196d2b4439399acc67ad"
135
+ "gitHead": "d16f688daf2f36622d725e53a4dd1c0486017015"
136
136
  }