@applica-software-guru/react-admin 1.1.90 → 1.1.91

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applica-software-guru/react-admin",
-  "version": "1.1.90",
+  "version": "1.1.91",
   "private": false,
   "repository": {
     "type": "git",

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

@@ -24,7 +24,7 @@ import { TableFormIteratorContext } from './TableFormIteratorContext';
 import { TableFormIteratorItem } from './TableFormIteratorItem';
 import { UseFieldArrayReturn } from 'react-hook-form';
 import get from 'lodash/get';
-import { styled } from '@mui/material/styles';
+import { styled, useTheme } from '@mui/material/styles';
 
 /**
  *
@@ -48,6 +48,7 @@ const TableFormIterator = (props: TableFormIteratorProps) => {
   const { children, resource, source, label, disableActions = false, disableAdd = false, disableRemove = false, className } = props;
   const [confirmIsOpen, setConfirmIsOpen] = useState<boolean>(false);
   const { fields, remove, replace } = useArrayInput(props);
+  const theme = useTheme()
   const translate = useTranslate();
   const record = useRecordContext(props);
   const initialDefaultValue = useRef({});
@@ -82,7 +83,7 @@ const TableFormIterator = (props: TableFormIteratorProps) => {
     [fields.length, removeField, source]
   );
 
-  const tableBorderColor = '#F0F0F0';
+  const tableBorderColor = theme.palette.mode === 'dark' ? theme.palette.grey.A400 : theme.palette.grey.A800;
 
   return fields ? (
     // @ts-ignore
@@ -171,13 +172,16 @@ const TableFormIterator = (props: TableFormIteratorProps) => {
 const AddTableRow = (props: any) => {
   const { label, disableAdd } = props;
   const { append } = useArrayInput(props);
+  const theme = useTheme();
+  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'}>
       <Typography>{label}</Typography>
       {!disableAdd && (
-        <IconButton size="small" color="secondary" sx={{ border: '1px solid #D9D9D9' }} onClick={() => append({})}>
-          <PlusCircleOutlined style={{ color: '#000000' }} />
+        <IconButton size="small" color="secondary" sx={{ border: `1px solid ${tableBorderColor}` }} onClick={() => append({})}>
+          <PlusCircleOutlined style={{ color: iconColor }} />
         </IconButton>
       )}
     </Stack>

package/src/playground/components/ra-forms/UserForm.jsx

@@ -34,10 +34,10 @@ const UserForm = ({ configuredRoles }) => {
         </Grid>
         <Grid item lg={12} xs={12}>
           <ArrayInput source="items" label={false}>
-            <TableFormIterator label="Ciao">
-              <TextInput source="name" label="Giovaaaa" sx={{ minWidth: 200 }} />
-              <TextInput source="surname" label="Weee" sx={{ minWidth: 150 }} />
-              <SelectArrayInput source="roles" choices={configuredRoles} />
+            <TableFormIterator label="Informazioni utente">
+              <TextInput source="name" label="Name" sx={{ minWidth: 200 }} />
+              <TextInput source="surname" label="Surname" sx={{ minWidth: 150 }} />
+              <SelectArrayInput source="roles" label="Ruoli" choices={configuredRoles} />
             </TableFormIterator>
           </ArrayInput>
         </Grid>