@applica-software-guru/react-admin 1.3.175 → 1.3.177

package/src/components/ra-forms/LongForm/BaseForm.tsx

@@ -12,13 +12,17 @@ const StyledGrid = styled(Grid, {
   name: 'ApplicaLongFormView',
   slot: 'Root'
 })(({ theme }) => ({
-  '& .MuiToolbar-root': {
+  // This style must be applied only to root toolbars used to save data in the form.
+  // Other toolbars must be handled outside this rule.
+  '& .MuiToolbar-root.RaToolbar-desktopToolbar': {
     position: 'initial',
-    marginTop: theme.spacing(2),
+    marginTop: theme.spacing(2.5),
     marginLeft: `-${theme.spacing(3)}`,
     marginRight: `-${theme.spacing(3)}`,
     marginBottom: `-${theme.spacing(2)}`,
     borderTop: `1px solid ${theme.palette.divider}`,
+    paddingTop: theme.spacing(2.5),
+    paddingBottom: theme.spacing(2.5),
     [theme.breakpoints.down('sm')]: {
       position: 'initial !important',
       width: 'auto !important',
@@ -26,8 +30,8 @@ const StyledGrid = styled(Grid, {
     }
   },
   '& form > .MuiToolbar-root': {
-    // È molto importante: questa regola serve per poter inserire form, all'interno di altri form, evitando
-    // che la toolbar del form interno recepisca gli stili della regola precedente (che genera un padding strano).
+    // This is really important: this rule is used to insert forms inside other forms, avoiding
+    // the toolbar of the inner form to receive the styles of the previous rule (which generates a strange padding).
     margin: 0,
     marginRight: `-${theme.spacing(0.5)}`,
     [theme.breakpoints.down('sm')]: {
@@ -42,7 +46,7 @@ function BaseForm(props: IBaseFormProps) {
     formProps = _.omit(props, ['spacing']);
 
   return (
-    <Form {...formProps} className='ApplicaLongFormView'>
+    <Form {...formProps} className="ApplicaLongFormView">
       <StyledGrid container spacing={spacing * 2}>
         {props.children}
       </StyledGrid>

package/src/components/ra-forms/SimpleForm.tsx

@@ -18,7 +18,7 @@ const ApplicaStyledSimpleForm = styled(RaSimpleForm, {
   slot: 'Root'
 })(({ theme, modal }: { theme: any; modal: boolean }) => ({
   '& .MuiGrid-root.MuiGrid-container': {
-    paddingBottom: theme.spacing(modal ? 0 : 1)
+    paddingBottom: theme.spacing(modal ? 0 : 2.5)
   } as any,
   [theme.breakpoints.down('sm')]: {
     paddingBottom: 0
@@ -50,8 +50,9 @@ const SimpleForm = ({ title, modal, content, subheader, secondary, sx, ...props
       sx={{
         ...sx,
         '& .MuiToolbar-root': {
-          paddingLeft: '20px !important',
-          paddingRight: '20px !important'
+          paddingLeft: 2.5,
+          paddingRight: 2.5,
+          paddingBottom: 2.5
         }
       }}
       border={!modal}

package/src/components/ra-forms/TabbedForm.tsx

@@ -1,9 +1,16 @@
-import { TabbedForm as RaTabbedForm, TabbedFormProps as RaTabbedFormProps, DeleteWithConfirmButton, SaveButton } from 'react-admin';
+import {
+  TabbedForm as RaTabbedForm,
+  TabbedFormProps as RaTabbedFormProps,
+  DeleteWithConfirmButton,
+  SaveButton,
+  TabProps
+} from 'react-admin';
 import MainCard from '../MainCard';
 import { useResourceTitle } from '../../hooks';
 import Toolbar from './Toolbar';
 import { styled } from '@mui/system';
 import ActionsMenu from '../ActionsMenu';
+import { Box } from '@mui/material';
 
 export type TabbedFormProps = RaTabbedFormProps & {
   modal?: boolean;
@@ -11,6 +18,11 @@ export type TabbedFormProps = RaTabbedFormProps & {
   subheader?: string | React.ReactNode;
   title?: string | React.ReactNode | boolean;
   secondary?: string | React.ReactNode;
+  /**
+   * Indicates if the form should have no padding.
+   * If true, the form will have no padding and you will be **responsible** for adding padding to the form's tabs.
+   */
+  noPadding?: boolean;
 };
 
 const StyledTabbedForm = styled(RaTabbedForm, {
@@ -21,38 +33,64 @@ const StyledTabbedForm = styled(RaTabbedForm, {
     paddingBottom: theme.spacing(modal ? 0 : 1)
   } as any,
   [theme.breakpoints.down('sm')]: {
-    paddingBottom: 0
+    paddingBottom: 0,
+    '& .MuiTableContainer-root': {
+      paddingBottom: theme.spacing(1)
+    }
   }
 }));
 
-const ApplicaTabbedForm = (props: TabbedFormProps) => {
-  const { title, modal, content, subheader, secondary, sx, ...rest } = props;
-  const cardTitle = useResourceTitle(title);
+const TabbedFormWithNoPadding = ({ children }: { children: React.ReactNode }) => <>{children}</>;
+
+const TabbedForm = (props: TabbedFormProps) => {
+  const { title: _title, modal, content, subheader, secondary, sx, noPadding, ...rest } = props;
+  const title = useResourceTitle(_title);
 
   return (
     <MainCard
-      title={cardTitle}
+      title={title}
       modal={modal}
       content={content}
       subheader={subheader}
       secondary={secondary}
       sx={{
         ...sx,
+        '& .MuiTabs-root': {
+          m: 2.5,
+          mb: 0
+        },
+        '& .tabbed-form .MuiDivider-root': {
+          ml: 2.5,
+          mr: 2.5
+        },
+
         '& .MuiToolbar-root': {
-          paddingLeft: '20px !important',
-          paddingRight: '20px !important'
+          padding: 2.5
         }
       }}
       border={!modal}
       divider
     >
       {/** @ts-ignore */}
-      <StyledTabbedForm toolbar={<Toolbar />} {...rest} />
+      <StyledTabbedForm toolbar={<Toolbar />} component={noPadding ? TabbedFormWithNoPadding : undefined} {...rest} />
     </MainCard>
   );
 };
+export type StackTabProps = TabProps & {
+  children: React.ReactNode;
+};
+
+/**
+ * Useful when you have tabbed form with noPadding and you want to add padding to the tabs.
+ * This component render inside a TabbedForm with noPadding and add padding to the tabs.
+ */
+const TabStack = ({ children, ...props }: StackTabProps): JSX.Element => (
+  <RaTabbedForm.Tab {...props}>
+    <Box sx={{ width: '100%', p: 2.5 }}>{children}</Box>
+  </RaTabbedForm.Tab>
+);
 
-ApplicaTabbedForm.defaultProps = {
+TabbedForm.defaultProps = {
   toolbar: (
     <Toolbar>
       <SaveButton type="button" />
@@ -65,6 +103,7 @@ ApplicaTabbedForm.defaultProps = {
   )
 };
 
-ApplicaTabbedForm.Tab = RaTabbedForm.Tab;
+TabbedForm.Tab = RaTabbedForm.Tab;
+TabbedForm.TabStack = TabStack;
 
-export default ApplicaTabbedForm;
+export default TabbedForm;

package/src/components/ra-forms/TableForm/TableFormIterator.tsx

@@ -55,7 +55,8 @@ const TableFormIterator = (props: TableFormIteratorProps) => {
     enableClearAll = false,
     className,
     empty,
-    template = {}
+    template = {},
+    inset
   } = props;
   const [confirmIsOpen, setConfirmIsOpen] = useState<boolean>(false);
   const { fields, remove, replace, append } = useArrayInput(props);
@@ -155,12 +156,22 @@ const TableFormIterator = (props: TableFormIteratorProps) => {
           source,
           disableAdd,
           template,
-          onClick: handleAddButtonClick((props?.addButton as any)?.props?.onClick)
+          onClick: handleAddButtonClick((props?.addButton as any)?.props?.onClick),
+          inset
         })}
 
-        <TableContainer component={Paper} sx={{ mt: 2, border: `1px solid ${tableBorderColor}` }}>
-          <Table>
-            <TableHead sx={{ borderTop: 0, borderBottom: `1px solid ${tableBorderColor}` }}>
+        <TableContainer
+          component={Paper}
+          sx={
+            inset === true
+              ? {
+                  borderRadius: 0
+                }
+              : { mt: 2, border: `1px solid ${tableBorderColor}` }
+          }
+        >
+          <Table size="small">
+            <TableHead sx={inset === true ? {} : { borderTop: 0, borderBottom: `1px solid ${tableBorderColor}` }}>
               <TableRow>
                 {/** @ts-ignore */}
                 {Children.map(children, (input: ReactElement, index) => {
@@ -169,16 +180,16 @@ const TableFormIterator = (props: TableFormIteratorProps) => {
                   }
                   return (
                     <TableCell key={index}>
-                      <Typography display={'flex'} variant="subtitle1" fontWeight={500} color="text.primary" textTransform="none">
+                      <Typography display={'flex'} variant="subtitle1" color="text.primary" textTransform="none">
                         {translateLabel({ ...input.props, resource })}
                       </Typography>
                     </TableCell>
                   );
                 })}
 
-                {!disableActions && (
-                  showClearAllButton ? (
-                    <TableCell key='actions' sx={{ display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
+                {!disableActions &&
+                  (showClearAllButton ? (
+                    <TableCell key="actions" sx={{ display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
                       <ActionsMenu horizontal>
                         <Typography color="error" onClick={() => setConfirmIsOpen(true)}>
                           {translate('ra.action.delete')}
@@ -186,9 +197,8 @@ const TableFormIterator = (props: TableFormIteratorProps) => {
                       </ActionsMenu>
                     </TableCell>
                   ) : (
-                    <TableCell key='empty_actions' />
-                  )
-                )}
+                    <TableCell key="empty_actions" />
+                  ))}
               </TableRow>
             </TableHead>
 
@@ -245,14 +255,14 @@ const TableFormIterator = (props: TableFormIteratorProps) => {
 };
 
 const AddTableRow = (props: any) => {
-  const { label, disableAdd, onClick } = props;
+  const { label, disableAdd, onClick, inset } = props;
   const theme = useTheme();
   // @ts-ignore
   const tableBorderColor = theme.palette.mode === 'dark' ? theme.palette.grey.A400 : theme.palette.grey.A800;
   const iconColor = theme.palette.mode === 'light' ? '#000000' : '#FFFFFF';
 
   return (
-    <Stack justifyContent={'space-between'} alignItems={'center'} flexDirection={'row'} sx={{ mt: 0.5 }}>
+    <Stack justifyContent={'space-between'} alignItems={'center'} flexDirection={'row'} sx={inset ? { p: 2.5 } : { pt: 2 }}>
       {label !== false && <Typography>{label}</Typography>}
       {!disableAdd &&
         (React.isValidElement(props?.addButton) ? (
@@ -260,7 +270,7 @@ const AddTableRow = (props: any) => {
             onClick: onClick
           })
         ) : (
-          <IconButton size="small" color="secondary" sx={{ border: `1px solid ${tableBorderColor}` }} onClick={onClick}>
+          <IconButton color="secondary" sx={{ border: `1px solid ${tableBorderColor}` }} onClick={onClick}>
             <PlusCircleOutlined style={{ color: iconColor }} />
           </IconButton>
         ))}
@@ -277,6 +287,11 @@ const StyledTableFormIterator = styled(TableFormIterator, {
     [theme.breakpoints.down('sm')]: {
       width: `calc(100vw - ${theme.spacing(8)})`
     }
+  },
+  [theme.breakpoints.down('sm')]: {
+    '& .MuiTableRow-root:last-child': {
+      borderBottom: 0
+    }
   }
 }));
 
@@ -327,6 +342,7 @@ export interface TableFormIteratorProps extends Partial<UseFieldArrayReturn> {
   source?: string;
   sx?: SxProps;
   empty: ReactNode | string;
+  inset?: boolean;
 }
 
 export default StyledTableFormIterator;

package/src/components/ra-forms/TableForm/TableFormIteratorItem.tsx

@@ -2,13 +2,12 @@ import * as React from 'react';
 
 import { Children, ReactElement, ReactNode, cloneElement, isValidElement, useMemo } from 'react';
 import { Confirm, useTranslate } from 'react-admin';
-import { TableCell, Typography } from '@mui/material';
+import { Stack, TableCell, Typography } from '@mui/material';
 import { TableFormIteratorItemContext, TableFormIteratorItemContextValue } from '../../../contexts';
 import ActionsMenu from '../../ActionsMenu';
 import { RaRecord } from 'ra-core';
 import { useTableFormIterator } from '../../../hooks';
 
-
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 export const TableFormIteratorItem = React.forwardRef((props: TableFormIteratorItemProps, ref: any) => {
   const { children, disabled, disableActions = false, index, member, resource } = props;
@@ -40,7 +39,7 @@ export const TableFormIteratorItem = React.forwardRef((props: TableFormIteratorI
         }
         const { source, ...inputProps } = input.props;
         return (
-          <TableCell sx={{ border: 0, verticalAlign: 'top' }}>
+          <TableCell>
             {cloneElement(input, {
               source: source ? `${member}.${source}` : member,
               index: source ? undefined : index2,
@@ -54,12 +53,14 @@ export const TableFormIteratorItem = React.forwardRef((props: TableFormIteratorI
       })}
 
       {!disableActions && (
-        <TableCell sx={{ display: 'flex', justifyContent: 'center', alignItems: 'center', border: 0, pt: 2.5 }}>
-          <ActionsMenu horizontal>
-            <Typography color="error" onClick={() => setConfirmIsOpen(true)}>
-              {translate('ra.action.delete')}
-            </Typography>
-          </ActionsMenu>
+        <TableCell>
+          <Stack direction="row" spacing={1} justifyContent="center" alignItems="center">
+            <ActionsMenu horizontal>
+              <Typography color="error" onClick={() => setConfirmIsOpen(true)}>
+                {translate('ra.action.delete')}
+              </Typography>
+            </ActionsMenu>
+          </Stack>
         </TableCell>
       )}
       {/** @ts-ignore */}

package/src/components/ra-inputs/AutocompleteArrayInput.jsx

@@ -11,10 +11,10 @@ const StyledAutocompleteArrayInput = styled(RaAutocompleteArrayInput, {
   },
   '& .MuiAutocomplete-inputRoot': {
     padding: `0px 9px`
-  },
-  '& label.MuiFormLabel-root[data-shrink="false"]': {
-    minHeight: '18px'
   }
+  // '& label.MuiFormLabel-root[data-shrink="false"]': {
+  //   minHeight: '18px'
+  // }
 }));
 
 // eslint-disable-next-line no-unused-vars

package/src/components/ra-inputs/AutocompleteInput.jsx

@@ -9,9 +9,9 @@ const StyledAutocompleteInput = styled(RaAutocompleteInput, {
   '& legend': {
     width: label === false ? 0 : 'auto'
   },
-  '& label.MuiFormLabel-root[data-shrink="false"]': {
-    minHeight: '18px'
-  },
+  // '& label.MuiFormLabel-root[data-shrink="false"]': {
+  //   minHeight: '18px'
+  // },
   '& .MuiAutocomplete-inputRoot': {
     // Serve ad allineare l'altezza di un input di tipo Autocomplete a quella degli altri campi utilizzati.
     padding: `0px 9px`

package/src/components/ra-inputs/BooleanInput.jsx

@@ -1,5 +1,5 @@
-import { styled, useTheme } from '@mui/material/styles';
-
+import { styled } from '@mui/material/styles';
+import { useTheme } from '@emotion/react';
 import LabeledInput from './LabeledInput';
 import PropTypes from 'prop-types';
 import { BooleanInput as RaBooleanInput } from 'react-admin';
@@ -11,35 +11,22 @@ const ApplicaStyledBooleanInput = styled(RaBooleanInput, {
   marginTop: '0 !important'
 }));
 
-const BooleanInput = ({ horizontal, ...props }) => {
-  // eslint-disable-next-line no-unused-vars
+const BooleanInput = ({ ...props }) => {
   const theme = useTheme();
   return (
-    <LabeledInput
-      {...props}
-      sx={
-        horizontal
-          ? {
-              flexDirection: horizontal ? 'row' : 'column',
-              alignItems: horizontal ? 'center' : 'flex-start',
-              '& .MuiFormGroup-root': {
-                margin: 0
-              },
-              '& .MuiFormControlLabel-root': {
-                margin: 0,
-                '& .MuiTypography-root': {
-                  display: 'none',
-                  visibility: 'hidden'
-                },
-                '& .MuiSwitch-root': {
-                  marginRight: `-${theme.spacing(0.5)}`
-                }
-              }
-            }
-          : {}
-      }
-    >
-      <ApplicaStyledBooleanInput />
+    <LabeledInput {...props}>
+      <ApplicaStyledBooleanInput
+        sx={{
+          '& .MuiFormControlLabel-root': {
+            marginLeft: '0 !important',
+            marginRight: '0 !important'
+          },
+          '& .MuiSwitch-root': {
+            margin: '0 !important',
+            marginTop: props.display === 'legend' ? 0 : `${theme.spacing(1)} !important`
+          }
+        }}
+      />
     </LabeledInput>
   );
 };

package/src/components/ra-inputs/LabeledInput.tsx

@@ -4,7 +4,7 @@ import { FormHelperText, InputLabel, Stack } from '@mui/material';
 import PropTypes from 'prop-types';
 import React from 'react';
 import { useAppConfig } from '../../hooks';
-import { useTheme } from '@emotion/react';
+import { useTheme } from '@mui/material/styles';
 
 export type LabeledInputProps = InputProps & {
   sx?: any;
@@ -19,11 +19,6 @@ export type LabeledInputProps = InputProps & {
   divider?: boolean;
 };
 
-/**
- * Consente di disegnare un input con una label e un eventuale messaggio di aiuto.
- *
- * @returns {JSX.Element}
- */
 const LabeledInput = ({ label, children, display, helperText, sx, addLabel, divider, ...props }: LabeledInputProps): JSX.Element => {
   const theme = useTheme();
   const { getCurrentDialog } = useAppConfig();

package/src/components/ra-inputs/SelectArrayInput.jsx

@@ -12,10 +12,10 @@ const ApplicaStyledSelectArrayInput = styled(RaSelectArrayInput, {
   '& .RaSelectArrayInput-chips > .RaSelectArrayInput-chip': {
     marginTop: '-2px',
     marginBottom: '-2px'
-  },
-  '& label.MuiFormLabel-root[data-shrink="false"]': {
-    marginTop: '2px'
   }
+  // '& label.MuiFormLabel-root[data-shrink="false"]': {
+  //   marginTop: '2px'
+  // }
 }));
 
 ApplicaStyledSelectArrayInput.propTypes = {

package/src/components/ra-inputs/SelectInput.tsx

@@ -8,11 +8,11 @@ const ApplicaStyledSelectInput = styled(RaSelectInput, {
   slot: 'Root'
 })(({ label }) => ({
   '& legend': {
-    width: label === false ? 0 : 'auto'
-  },
-  '& label.MuiFormLabel-root[data-shrink="false"]': {
-    marginTop: '2px'
+    width: label === false || label === null ? 0 : 'auto'
   }
+  // '& label.MuiFormLabel-root[data-shrink="false"]': {
+  //   marginTop: '2px'
+  // }
 }));
 export type SelectInputProps = LabeledInputProps & RaSelectInputProps;
 const SelectInput = (props: SelectInputProps) => (
@@ -21,9 +21,4 @@ const SelectInput = (props: SelectInputProps) => (
   </LabeledInput>
 );
 
-SelectInput.propTypes = {
-  ...RaSelectInput.propTypes,
-  ...LabeledInput.propTypes
-};
-
 export default SelectInput;

package/src/components/ra-lists/Datagrid/index.tsx

@@ -6,7 +6,10 @@ import { styled } from '@mui/material/styles';
 const StyledDatagrid = styled(RaDatagrid, {
   name: 'ApplicaDatagrid',
   slot: 'root'
-})(() => ({
+})(({ theme }) => ({
+  '& .RaBulkActionsToolbar-toolbar': {
+    height: 48
+  },
   // Resolve an issue related to the visualization of the bulk actions toolbar.
   // Padding and margin create a non empty space that allows the toolbar to be displayed when
   // the selection is empty.
@@ -27,7 +30,10 @@ const StyledDatagrid = styled(RaDatagrid, {
   '& th': {
     textOverflow: 'ellipsis',
     overflow: 'hidden',
-    whiteSpace: 'nowrap'
+    whiteSpace: 'nowrap',
+    backgroundColor: 'inherit !important',
+    textTransform: 'none',
+    fontSize: theme.typography.subtitle1.fontSize
   }
 }));
 

package/src/components/ra-lists/List.tsx

@@ -145,20 +145,23 @@ const ApplicaStyledList = styled(RaList, {
         padding: theme.spacing(2),
         paddingBottom: theme.spacing(2),
         alignItems: 'flex-start'
-      },
-      '& .MuiButton-root': {
-        margin: theme.spacing(2)
       }
     },
-
+    '& .MuiButton-root': {
+      margin: 0
+    },
     '& .RaList-actions': {
-      padding: theme.spacing(2),
-      paddingTop: theme.spacing(1),
+      minHeight: 80,
       alignItems: 'center',
+      padding: theme.spacing(2.5),
       '& form': {
-        alignItems: 'center'
+        alignItems: 'center',
+        minHeight: 'auto',
+        paddingBottom: 0,
+        rowGap: theme.spacing(2.5)
       },
       '& .RaFilterForm-filterFormInput': {
+        margin: 0,
         '& .MuiFormControl-root': {
           marginTop: 0
         },
@@ -166,17 +169,28 @@ const ApplicaStyledList = styled(RaList, {
           alignSelf: 'center',
           marginTop: 0
         },
-        marginTop: theme.spacing(1.5)
+        // This rule allows each filter input to be 100% width when the screen is small.
+        [theme.breakpoints.down('sm')]: {
+          '&>.MuiStack-root': {
+            width: '100%',
+            '&>div': {
+              width: '100%'
+            }
+          }
+        }
       },
       '& .RaFilterFormInput-hideButton': {
-        marginBottom: theme.spacing(0.5),
-        marginRight: theme.spacing(1)
+        margin: '0 !important',
+        alignSelf: 'center'
       },
       '& > .MuiToolbar-root': {
         flex: 'unset',
         padding: 0,
-        alignSelf: 'flex-end',
-        minHeight: 'fit-content'
+        alignSelf: 'center',
+        minHeight: 'fit-content',
+        [theme.breakpoints.down('sm')]: {
+          paddingBottom: theme.spacing(2)
+        }
       }
     },
 

package/src/components/ra-lists/NotificationList/NotificationList.jsx

@@ -1,5 +1,5 @@
 import { MarkAsReadedButton, MarkAsUnreadedButton } from './button';
-import React, { useCallback, useMemo } from 'react';
+import { useMemo } from 'react';
 import { darken, lighten, useTheme } from '@mui/material';
 
 import ActionsMenu from '../../ActionsMenu';
@@ -17,17 +17,14 @@ const NotificationList = ({ ...props }) => {
     }),
     [theme.palette.mode]
   );
-  const handleRowStyle = useCallback(
-    (record) => ({
-      backgroundColor: record?.readed ? colorize(theme.palette.primary[mode], density) : colorize(theme.palette.secondary[mode], density)
-    }),
-    [theme, mode, colorize, density]
-  );
+  const rowSx = (record) => ({
+    backgroundColor: !record?.readed ? colorize(theme.palette.primary[mode], density) : colorize(theme.palette.secondary[mode], density)
+  });
 
   return (
-    <Datagrid {...props} rowStyle={handleRowStyle}>
-      <NotificationField source="notification" sortable={false} label="ra.notification" />
-      <DateAgoField source="created" label="ra.notification.created" />
+    <Datagrid {...props} rowSx={rowSx}>
+      <NotificationField source="notification" sortable={false} />
+      <DateAgoField source="created" />
       <ActionsMenu>
         <MarkAsReadedButton />
         <MarkAsUnreadedButton />

package/src/components/ra-lists/SimpleList.tsx

@@ -0,0 +1,13 @@
+import { SimpleList as RaSimpleList } from 'react-admin';
+import { styled } from '@mui/material/styles';
+
+const StyledSimpleList = styled(RaSimpleList, {
+  name: 'ApplicaSimpleList',
+  slot: 'root'
+})(({ theme }) => ({
+  padding: theme.spacing(1),
+  paddingTop: 0,
+  paddingBottom: 0
+}));
+
+export default StyledSimpleList;

package/src/components/ra-lists/index.ts

@@ -1,6 +1,7 @@
+export { default as BulkActionsToolbar } from './BulkActionsToolbar';
+export { default as BulkFloatingActionsToolbar } from './BulkFloatingActionsToolbar';
 export { default as Datagrid } from './Datagrid';
 export { default as Empty } from './Empty';
-export { default as NotificationList } from './NotificationList';
 export { default as List } from './List';
-export { default as BulkActionsToolbar } from './BulkActionsToolbar';
-export { default as BulkFloatingActionsToolbar } from './BulkFloatingActionsToolbar';
+export { default as NotificationList } from './NotificationList';
+export { default as SimpleList } from './SimpleList';