@applica-software-guru/react-admin 1.4.226 → 1.5.230

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

@@ -1,6 +1,6 @@
-import { AutocompleteInputProps, AutocompleteInput as RaAutocompleteInput } from 'react-admin';
+import { LabeledInput } from '@/components/ra-inputs/LabeledInput';
 import { styled } from '@mui/material/styles';
-import LabeledInput from './LabeledInput';
+import { AutocompleteInputProps, AutocompleteInput as RaAutocompleteInput } from 'react-admin';
 
 // @ts-ignore
 const StyledAutocompleteInput = styled(RaAutocompleteInput, {
@@ -12,10 +12,10 @@ const StyledAutocompleteInput = styled(RaAutocompleteInput, {
   },
   '& .MuiAutocomplete-inputRoot': {
     padding: `0px 9px`
-  },
+  }
 }));
 
-export function AutocompleteInput({ size = 'small', ...props }: AutocompleteInputProps): JSX.Element {
+function AutocompleteInput({ size = 'small', ...props }: AutocompleteInputProps): JSX.Element {
   // Sanitize props removing "perPage":
   // @ts-ignore
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -28,4 +28,5 @@ export function AutocompleteInput({ size = 'small', ...props }: AutocompleteInpu
   );
 }
 
-export default AutocompleteInput;
+export { AutocompleteInput };
+export type { AutocompleteInputProps };

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

@@ -1,13 +1,13 @@
-import { BooleanInputProps, BooleanInput as RaBooleanInput } from 'react-admin';
-import { styled } from '@mui/material/styles';
+import { LabeledInput } from '@/components/ra-inputs/LabeledInput';
 import { useTheme } from '@emotion/react';
-import LabeledInput from './LabeledInput';
+import { styled } from '@mui/material/styles';
+import { BooleanInputProps, BooleanInput as RaBooleanInput } from 'react-admin';
 
 const StyledBooleanInput = styled(RaBooleanInput, { slot: 'Root' })(() => ({
   marginTop: '0 !important'
 }));
 
-export function BooleanInput({ ...props }: BooleanInputProps): JSX.Element {
+function BooleanInput({ ...props }: BooleanInputProps): JSX.Element {
   const theme = useTheme();
   return (
     // @ts-ignore
@@ -30,4 +30,5 @@ export function BooleanInput({ ...props }: BooleanInputProps): JSX.Element {
   );
 }
 
-export default BooleanInput;
+export { BooleanInput };
+export type { BooleanInputProps };

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

@@ -1,6 +1,6 @@
-import { DateInputProps, DateInput as RaDateInput } from 'react-admin';
+import { LabeledInput } from '@/components/ra-inputs/LabeledInput';
 import { styled } from '@mui/material/styles';
-import LabeledInput from './LabeledInput';
+import { DateInputProps, DateInput as RaDateInput } from 'react-admin';
 
 const StyledDateInput = styled(RaDateInput, { slot: 'root' })(({ label }) => ({
   '& legend': {
@@ -8,7 +8,7 @@ const StyledDateInput = styled(RaDateInput, { slot: 'root' })(({ label }) => ({
   }
 }));
 
-export function DateInput(props: DateInputProps): JSX.Element {
+function DateInput(props: DateInputProps): JSX.Element {
   return (
     // @ts-ignore
     <LabeledInput {...props}>
@@ -18,4 +18,5 @@ export function DateInput(props: DateInputProps): JSX.Element {
   );
 }
 
-export default DateInput;
+export { DateInput };
+export type { DateInputProps };

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

@@ -1,6 +1,6 @@
-import { DateTimeInputProps, DateTimeInput as RaDateTimeInput } from 'react-admin';
+import { LabeledInput } from '@/components/ra-inputs/LabeledInput';
 import { styled } from '@mui/material/styles';
-import LabeledInput from './LabeledInput';
+import { DateTimeInputProps, DateTimeInput as RaDateTimeInput } from 'react-admin';
 
 const StyledDateInput = styled(RaDateTimeInput, { slot: 'root' })(({ label }) => ({
   '& legend': {
@@ -8,7 +8,7 @@ const StyledDateInput = styled(RaDateTimeInput, { slot: 'root' })(({ label }) =>
   }
 }));
 
-export function DateTimeInput(props: DateTimeInputProps): JSX.Element {
+function DateTimeInput(props: DateTimeInputProps): JSX.Element {
   return (
     /** @ts-ignore */
     <LabeledInput {...props}>
@@ -18,4 +18,5 @@ export function DateTimeInput(props: DateTimeInputProps): JSX.Element {
   );
 }
 
-export default DateTimeInput;
+export { DateTimeInput };
+export type { DateTimeInputProps };

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

@@ -1,10 +1,10 @@
-import { FileField } from '../ra-fields';
-import { FileInput as RaFileInput, FileInputProps as RaFileInputProps, useRecordContext } from 'react-admin';
-import { get } from 'lodash';
+import { FileField } from '@/components/ra-fields';
+import { LabeledInput } from '@/components/ra-inputs/LabeledInput';
 import { styled } from '@mui/material/styles';
-import { useWatch } from 'react-hook-form';
-import LabeledInput from './LabeledInput';
+import { get } from 'lodash';
 import React, { useMemo } from 'react';
+import { FileInput as RaFileInput, FileInputProps as RaFileInputProps, useRecordContext } from 'react-admin';
+import { useWatch } from 'react-hook-form';
 
 const StyledFileInput = styled(RaFileInput, { slot: 'root' })(({ theme }) => ({
   '& .previews': {},
@@ -27,12 +27,6 @@ const StyledFileInput = styled(RaFileInput, { slot: 'root' })(({ theme }) => ({
   }
 }));
 
-export type FileInputProps = {
-  source: string;
-  title?: string;
-  children?: React.ReactNode;
-} & RaFileInputProps;
-
 /**
  * FileInput is designed to be used as single input. It does not support multiple files and
  * can be used only for base64 encoded files using applica framework.
@@ -47,7 +41,7 @@ export type FileInputProps = {
  * in conjuction with Applica Framework backend API services.
  *
  */
-export function FileInput({ children = <FileField source="" title="" />, title, ...props }: FileInputProps): JSX.Element {
+function FileInput({ children = <FileField source="" title="" />, title, ...props }: FileInputProps): JSX.Element {
   const file = useWatch({ name: props.source });
   const record = useRecordContext(props);
   const { source } = props;
@@ -91,4 +85,11 @@ export function FileInput({ children = <FileField source="" title="" />, title,
   );
 }
 
-export default FileInput;
+type FileInputProps = {
+  source: string;
+  title?: string;
+  children?: React.ReactNode;
+} & RaFileInputProps;
+
+export { FileInput };
+export type { FileInputProps };

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

@@ -1,18 +1,23 @@
-import { CoverField } from '../ra-fields';
+import { CoverField } from '@/components/ra-fields';
+import { LabeledInput } from '@/components/ra-inputs/LabeledInput';
 import { get } from 'lodash';
-import { ImageInput as RaImageInput, ImageInputProps as RaImageInputProps, useInput, useRecordContext } from 'react-admin';
-import { useWatch } from 'react-hook-form';
-import LabeledInput from './LabeledInput';
 import React from 'react';
+import {
+  ImageInput as RaImageInput,
+  ImageInputProps as RaImageInputProps,
+  useInput,
+  useRecordContext
+} from 'react-admin';
+import { useWatch } from 'react-hook-form';
 
-export type ImageInputProps = {
+type ImageInputProps = {
   source: string;
   title?: string;
   children?: React.ReactNode;
   multiple?: boolean;
 } & RaImageInputProps;
 
-export function ImageInput({ children = <CoverField />, title, multiple = false, ...props }: ImageInputProps): JSX.Element {
+function ImageInput({ children = <CoverField />, title, multiple = false, ...props }: ImageInputProps): JSX.Element {
   const file = useWatch({ name: props.source });
   const record = useRecordContext(props);
   const { source } = props;
@@ -41,4 +46,5 @@ export function ImageInput({ children = <CoverField />, title, multiple = false,
   );
 }
 
-export default ImageInput;
+export { ImageInput };
+export type { ImageInputProps };

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

@@ -1,28 +1,14 @@
-import { FieldTitle } from 'react-admin';
+import { useAppConfig } from '@/components/AppStateProvider';
+import { useTheme } from '@emotion/react';
 import { FormHelperText, InputLabel, Stack, SxProps } from '@mui/material';
-import { useAppConfig } from '../../hooks';
+import React, { PropsWithChildren } from 'react';
+import { FieldTitle } from 'react-admin';
 import { useFormContext } from 'react-hook-form';
-import { useTheme } from '@emotion/react';
-import React from 'react';
-
-export type LabeledArrayInputProps = {
-  label?: string | boolean;
-  addLabel?: boolean;
-  resource?: string;
-  isRequired?: boolean;
-  source: string;
-  display?: 'legend' | 'label';
-  helperText?: string | boolean;
-  divider?: boolean;
-  sx?: SxProps;
-  children: React.ReactElement;
-  fullWidth?: boolean;
-};
 
 /**
  * Allows you to display an array of inputs with a label and a helper text with the Mantis theme style.
  */
-export function LabeledArrayInput({
+function LabeledArrayInput({
   label,
   children,
   display = 'label',
@@ -78,7 +64,7 @@ export function LabeledArrayInput({
             label: display === 'legend' ? label : false
           })
         : children}
-      {display === 'label' && helperText && (
+      {display === 'label' && helperText ? (
         <FormHelperText
           sx={{
             pl: 1.8,
@@ -89,9 +75,23 @@ export function LabeledArrayInput({
         >
           {helperText}
         </FormHelperText>
-      )}
+      ) : null}
     </Stack>
   );
 }
 
-export default LabeledArrayInput;
+type LabeledArrayInputProps = PropsWithChildren<{
+  label?: string | boolean;
+  addLabel?: boolean;
+  resource?: string;
+  isRequired?: boolean;
+  source: string;
+  display?: 'legend' | 'label';
+  helperText?: string | boolean;
+  divider?: boolean;
+  sx?: SxProps;
+  fullWidth?: boolean;
+}>;
+
+export { LabeledArrayInput };
+export type { LabeledArrayInputProps };

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

@@ -1,23 +1,10 @@
-import { FieldTitle, InputProps, useInput } from 'react-admin';
+import { useAppConfig } from '@/components/AppStateProvider';
 import { FormHelperText, InputLabel, Stack } from '@mui/material';
-import { useAppConfig } from '../../hooks';
 import { useTheme } from '@mui/material/styles';
 import React from 'react';
+import { FieldTitle, InputProps, useInput } from 'react-admin';
 
-export type LabeledInputProps = InputProps & {
-  sx?: any;
-  children?: React.ReactElement;
-  label?: string | boolean;
-  addLabel?: boolean;
-  resource?: string;
-  isRequired?: boolean;
-  source?: string;
-  display?: 'legend' | 'label';
-  helperText?: string | boolean;
-  divider?: boolean;
-};
-
-export function LabeledInput({
+function LabeledInput({
   label,
   children,
   display = 'label',
@@ -75,7 +62,7 @@ export function LabeledInput({
             label: display === 'legend' ? label : false
           })
         : children}
-      {display === 'label' && helperText && (
+      {display === 'label' && helperText ? (
         <FormHelperText
           sx={{
             pl: 1.8,
@@ -86,8 +73,23 @@ export function LabeledInput({
         >
           {helperText}
         </FormHelperText>
-      )}
+      ) : null}
     </Stack>
   );
 }
-export default LabeledInput;
+
+type LabeledInputProps = InputProps & {
+  sx?: any;
+  children?: React.ReactElement;
+  label?: string | boolean;
+  addLabel?: boolean;
+  resource?: string;
+  isRequired?: boolean;
+  source?: string;
+  display?: 'legend' | 'label';
+  helperText?: string | boolean;
+  divider?: boolean;
+};
+
+export { LabeledInput };
+export type { LabeledInputProps };

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

@@ -1,46 +1,49 @@
-import _ from 'lodash';
+import { TextInput } from './TextInput';
+import { LabeledInput, LabeledInputProps } from '@/components/ra-inputs/LabeledInput';
+import { localizedValueHasAllLocales } from '@/utils';
 import { Box, Chip, ListItemText, Menu, MenuItem, PopoverOrigin, Typography } from '@mui/material';
-import { localizedValueHasAllLocales } from '../../utils';
-import { ReactElement, useCallback, useMemo, useState } from 'react';
-import { TextInputProps } from 'ra-ui-materialui';
+import _ from 'lodash';
 import { useInput, useLocaleState, useLocales } from 'ra-core';
+import { TextInputProps } from 'ra-ui-materialui';
+import { ReactElement, useCallback, useMemo, useState } from 'react';
 import { useWatch } from 'react-hook-form';
-import LabeledInput, { LabeledInputProps } from './LabeledInput';
-import TextInput from './TextInput';
 
-const ANCHOR_ORIGIN: PopoverOrigin = { vertical: 'bottom', horizontal: 'right' },
-  TRANSFORM_ORIGIN: PopoverOrigin = { vertical: 'top', horizontal: 'right' };
+const ANCHOR_ORIGIN: PopoverOrigin = { vertical: 'bottom', horizontal: 'right' };
+const TRANSFORM_ORIGIN: PopoverOrigin = { vertical: 'top', horizontal: 'right' };
 
-export type ILocalizedTextInputProps = TextInputProps & LabeledInputProps;
+type ILocalizedTextInputProps = TextInputProps & LabeledInputProps;
 
-export function LocalizedTextInput(props: ILocalizedTextInputProps) {
-  const { source } = props,
-    { fieldState } = useInput(props),
-    value = useWatch({ name: source }),
-    { error } = fieldState,
-    locales = useLocales(),
-    isMissingLocalizations = !localizedValueHasAllLocales(value, locales),
-    [currentLocale] = useLocaleState(),
-    [locale, setLocale] = useState(currentLocale),
-    [anchorEl, setAnchorEl] = useState<null | HTMLDivElement>(null),
-    open = Boolean(anchorEl),
-    toggle = useCallback((e: React.MouseEvent<HTMLDivElement>) => setAnchorEl(open ? null : e.currentTarget), [open, setAnchorEl]),
-    handleClose = useCallback(() => setAnchorEl(null), [setAnchorEl]),
-    MenuItems: Array<ReactElement> = useMemo(() => {
-      return _.map(locales, (l, index) => {
-        return (
-          <MenuItem
-            key={index}
-            onClick={() => {
-              setLocale(l.locale);
-              handleClose();
-            }}
-          >
-            <ListItemText primary={`${l.locale.toUpperCase()}: ${(value ?? {})[l.locale] ?? ''}`} />
-          </MenuItem>
-        );
-      });
-    }, [locales, setLocale, handleClose, value]);
+function LocalizedTextInput(props: ILocalizedTextInputProps) {
+  const { source } = props;
+  const { fieldState } = useInput(props);
+  const value = useWatch({ name: source });
+  const { error } = fieldState;
+  const locales = useLocales();
+  const isMissingLocalizations = !localizedValueHasAllLocales(value, locales);
+  const [currentLocale] = useLocaleState();
+  const [locale, setLocale] = useState(currentLocale);
+  const [anchorEl, setAnchorEl] = useState<null | HTMLDivElement>(null);
+  const open = Boolean(anchorEl);
+  const toggle = useCallback(
+    (e: React.MouseEvent<HTMLDivElement>) => setAnchorEl(open ? null : e.currentTarget),
+    [open, setAnchorEl]
+  );
+  const handleClose = useCallback(() => setAnchorEl(null), [setAnchorEl]);
+  const MenuItems: Array<ReactElement> = useMemo(() => {
+    return _.map(locales, (l, index) => {
+      return (
+        <MenuItem
+          key={index}
+          onClick={() => {
+            setLocale(l.locale);
+            handleClose();
+          }}
+        >
+          <ListItemText primary={`${l.locale.toUpperCase()}: ${(value ?? {})[l.locale] ?? ''}`} />
+        </MenuItem>
+      );
+    });
+  }, [locales, setLocale, handleClose, value]);
 
   return (
     <LabeledInput {...props} helperText={error?.message}>
@@ -66,7 +69,13 @@ export function LocalizedTextInput(props: ILocalizedTextInputProps) {
             />
           );
         })}
-        <Menu anchorEl={anchorEl} open={open} anchorOrigin={ANCHOR_ORIGIN} transformOrigin={TRANSFORM_ORIGIN} onClose={handleClose}>
+        <Menu
+          anchorEl={anchorEl}
+          open={open}
+          anchorOrigin={ANCHOR_ORIGIN}
+          transformOrigin={TRANSFORM_ORIGIN}
+          onClose={handleClose}
+        >
           {MenuItems}
         </Menu>
       </Box>
@@ -74,4 +83,5 @@ export function LocalizedTextInput(props: ILocalizedTextInputProps) {
   );
 }
 
-export default LocalizedTextInput;
+export type { ILocalizedTextInputProps };
+export { LocalizedTextInput };

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

@@ -1,6 +1,6 @@
-import { NumberInputProps, NumberInput as RaNumberInput } from 'react-admin';
+import { LabeledInput } from '@/components/ra-inputs/LabeledInput';
 import { styled } from '@mui/material/styles';
-import LabeledInput from './LabeledInput';
+import { NumberInputProps, NumberInput as RaNumberInput } from 'react-admin';
 
 const StyledNumberInput = styled(RaNumberInput, { slot: 'root' })(({ label }) => ({
   '& legend': {
@@ -8,7 +8,7 @@ const StyledNumberInput = styled(RaNumberInput, { slot: 'root' })(({ label }) =>
   }
 }));
 
-export function NumberInput(props: NumberInputProps): JSX.Element {
+function NumberInput(props: NumberInputProps): JSX.Element {
   return (
     // @ts-ignore
     <LabeledInput {...props}>
@@ -18,4 +18,5 @@ export function NumberInput(props: NumberInputProps): JSX.Element {
   );
 }
 
-export default NumberInput;
+export { NumberInput };
+export type { NumberInputProps };

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

@@ -1,15 +1,15 @@
-import { get } from 'lodash';
 import { TextField } from '@mui/material';
-import { useDataProvider, useRecordContext, useResourceContext } from 'react-admin';
+import { get } from 'lodash';
 import React, { useCallback, useEffect, useState } from 'react';
+import { useDataProvider, useRecordContext, useResourceContext } from 'react-admin';
 
-export type RecordInputProps = {
+type RecordInputProps = {
   source: string;
   minWidth?: number;
   children?: React.ReactElement;
 };
 
-export function RecordInput({ source, minWidth = 300, children }: RecordInputProps): JSX.Element {
+function RecordInput({ source, minWidth = 300, children }: RecordInputProps): JSX.Element {
   const resource = useResourceContext();
   const record = useRecordContext();
   const [value, setValue] = useState(get(record, source, ''));
@@ -101,4 +101,5 @@ export function RecordInput({ source, minWidth = 300, children }: RecordInputPro
   );
 }
 
-export default RecordInput;
+export { RecordInput };
+export type { RecordInputProps };

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

@@ -1,19 +1,22 @@
-import { ReferenceArrayInput as RaReferenceArrayInput, ReferenceArrayInputProps as RaReferenceArrayInputProps } from 'react-admin';
-import React from 'react';
+import React, { Children } from 'react';
+import {
+  ReferenceArrayInput as RaReferenceArrayInput,
+  ReferenceArrayInputProps as RaReferenceArrayInputProps
+} from 'react-admin';
 
-export type ReferenceArrayInputProps = {
-  children: React.ReactElement;
-} & RaReferenceArrayInputProps;
+type ReferenceArrayInputProps = RaReferenceArrayInputProps;
 
-export function ReferenceArrayInput({ children, ...props }: ReferenceArrayInputProps): JSX.Element {
+function ReferenceArrayInput({ children, ...props }: ReferenceArrayInputProps): JSX.Element {
+  const Child = Children.only(children);
   return (
     <RaReferenceArrayInput {...props}>
-      {React.cloneElement(children, {
+      {React.cloneElement(Child!, {
         ...props,
-        source: children.props.source || props.source
+        source: Child!.props.source || props.source
       })}
     </RaReferenceArrayInput>
   );
 }
 
-export default ReferenceArrayInput;
+export { ReferenceArrayInput };
+export type { ReferenceArrayInputProps };

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

@@ -1,19 +1,19 @@
+import React, { Children, PropsWithChildren } from 'react';
 import { ReferenceInput as RaReferenceInput, ReferenceInputProps as RaReferenceInputProps } from 'react-admin';
-import React from 'react';
 
-export type ReferenceInputProps = {
-  children: React.ReactElement;
-} & RaReferenceInputProps;
+type ReferenceInputProps = PropsWithChildren<Record<string, never>> & RaReferenceInputProps;
 
-export function ReferenceInput({ children, ...props }: ReferenceInputProps): JSX.Element {
+function ReferenceInput({ children, ...props }: ReferenceInputProps): JSX.Element {
+  const Child = Children.only(children);
   return (
     <RaReferenceInput {...props}>
-      {React.cloneElement(children, {
+      {React.cloneElement(Child!, {
         ...props,
-        source: children.props.source || props.source
+        source: Child!.props.source || props.source
       })}
     </RaReferenceInput>
   );
 }
 
-export default ReferenceInput;
+export { ReferenceInput };
+export type { ReferenceInputProps };

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

@@ -1,8 +1,8 @@
-import { Fragment, ReactElement } from 'react';
+import { ReferenceManyField, ReferenceManyFieldProps } from '@/components/ra-fields';
+import { ReactElement } from 'react';
 import { ListToolbar, Pagination, ResourceContextProvider } from 'react-admin';
-import { ReferenceManyField, ReferenceManyFieldProps } from '../ra-fields';
 
-export type ReferenceManyInputProps = {
+type ReferenceManyInputProps = {
   reference: string;
   target: string;
   children: React.ReactNode;
@@ -10,17 +10,24 @@ export type ReferenceManyInputProps = {
   actions?: ReactElement;
 } & ReferenceManyFieldProps;
 
-export function ReferenceManyInput({ reference, target, children, filters, actions, ...props }: ReferenceManyInputProps): JSX.Element {
+function ReferenceManyInput({
+  reference,
+  target,
+  children,
+  filters,
+  actions,
+  ...props
+}: ReferenceManyInputProps): JSX.Element {
   return (
     <ResourceContextProvider value={reference}>
       <ReferenceManyField perPage={5} pagination={<Pagination />} {...props} reference={reference} target={target}>
-        <Fragment>
+        <>
           <ListToolbar filters={filters} actions={actions} />
           {children}
-        </Fragment>
+        </>
       </ReferenceManyField>
     </ResourceContextProvider>
   );
 }
 
-export default ReferenceManyInput;
+export { ReferenceManyInput };

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

@@ -1,9 +1,10 @@
-import { SearchInput as RaSearchInput, SearchInputProps } from 'react-admin';
 import { styled } from '@mui/material/styles';
+import { SearchInput as RaSearchInput, SearchInputProps } from 'react-admin';
 
 const StyledSearchInput = styled(RaSearchInput, { slot: 'root' })(() => ({}));
 
-export function SearchInput(props: SearchInputProps): JSX.Element {
+function SearchInput(props: SearchInputProps): JSX.Element {
   return <StyledSearchInput {...props} />;
 }
-export default SearchInput;
+export { SearchInput };
+export type { SearchInputProps };

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

@@ -1,6 +1,6 @@
-import { SelectArrayInput as RaSelectArrayInput, SelectArrayInputProps } from 'react-admin';
+import { LabeledInput } from '@/components/ra-inputs/LabeledInput';
 import { styled } from '@mui/material/styles';
-import LabeledInput from './LabeledInput';
+import { SelectArrayInput as RaSelectArrayInput, SelectArrayInputProps } from 'react-admin';
 
 const StyledSelectArrayInput = styled(RaSelectArrayInput, { slot: 'Root' })(({ label }) => ({
   '& legend': {
@@ -19,7 +19,7 @@ const StyledSelectArrayInput = styled(RaSelectArrayInput, { slot: 'Root' })(({ l
   }
 }));
 
-export function SelectArrayInput({ optionText = 'name', optionValue = 'id', ...props }: SelectArrayInputProps): JSX.Element {
+function SelectArrayInput({ optionText = 'name', optionValue = 'id', ...props }: SelectArrayInputProps): JSX.Element {
   return (
     // @ts-ignore
     <LabeledInput {...props}>
@@ -34,4 +34,5 @@ export function SelectArrayInput({ optionText = 'name', optionValue = 'id', ...p
   );
 }
 
-export default SelectArrayInput;
+export { SelectArrayInput };
+export type { SelectArrayInputProps };

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

@@ -1,14 +1,14 @@
-import { SelectInput as RaSelectInput, SelectInputProps as RaSelectInputProps } from 'react-admin';
+import { LabeledInput, LabeledInputProps } from '@/components/ra-inputs/LabeledInput';
 import { styled } from '@mui/material/styles';
-import LabeledInput, { LabeledInputProps } from './LabeledInput';
+import { SelectInput as RaSelectInput, SelectInputProps as RaSelectInputProps } from 'react-admin';
 
 const StyledSelectInput = styled(RaSelectInput, { slot: 'Root' })(({ label }) => ({
   '& legend': {
     width: label === false || label === null ? 0 : 'auto'
   }
 }));
-export type SelectInputProps = LabeledInputProps & RaSelectInputProps;
-export function SelectInput(props: SelectInputProps): JSX.Element {
+type SelectInputProps = LabeledInputProps & RaSelectInputProps;
+function SelectInput(props: SelectInputProps): JSX.Element {
   return (
     <LabeledInput {...props}>
       <StyledSelectInput />
@@ -16,4 +16,4 @@ export function SelectInput(props: SelectInputProps): JSX.Element {
   );
 }
 
-export default SelectInput;
+export { SelectInput };