@gen-epix/ui-core-form 4.0.0 → 4.0.2

package/dist/components/fields/Switch/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/fields/Switch/Switch.tsx"],"sourcesContent":["import type {\n  ReactElement,\n  SyntheticEvent,\n} from 'react';\nimport {\n  useCallback,\n  useRef,\n} from 'react';\nimport {\n  FormControl,\n  FormControlLabel,\n  FormHelperText,\n  Switch as MuiSwitch,\n} from '@mui/material';\nimport type {\n  ControllerRenderProps,\n  FieldValues,\n  Path,\n  UseControllerReturn,\n} from 'react-hook-form';\nimport {\n  Controller,\n  useFormContext,\n} from 'react-hook-form';\nimport classnames from 'classnames';\nimport { TestIdUtil } from '@gen-epix/ui-core/utils/TestIdUtil';\n\nimport { FormUtil } from '../../../utils/FormUtil';\nimport { FormFieldHelperText } from '../../helpers/FormFieldHelperText';\nimport { FormFieldLoadingIndicator } from '../../helpers/FormFieldLoadingIndicator';\n\nexport type SwitchProps<TFieldValues extends FieldValues, TName extends Path<TFieldValues>> = {\n  readonly disabled?: boolean;\n  readonly infoMessage?: string;\n  readonly label: string;\n  readonly loading?: boolean;\n  readonly name: TName;\n  readonly onChange?: (value: boolean) => void;\n  readonly required?: boolean;\n  readonly warningMessage?: string;\n};\n\nexport const Switch = <TFieldValues extends FieldValues, TName extends Path<TFieldValues> = Path<TFieldValues>>({\n  disabled = false,\n  infoMessage,\n  label,\n  loading = false,\n  name,\n  onChange: onChangeProp,\n  warningMessage,\n}: SwitchProps<TFieldValues, TName>): ReactElement => {\n  const { control, formState: { errors } } = useFormContext<TFieldValues>();\n  const errorMessage = FormUtil.getFieldErrorMessage(errors, name);\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const hasError = !!errorMessage;\n  const hasWarning = !!warningMessage && !hasError;\n\n  const onMuiSwitchChange = useCallback((onChange: ControllerRenderProps<TFieldValues, TName>['onChange']) =>\n    (_event: SyntheticEvent, checked: boolean) => {\n      if (onChangeProp) {\n        onChangeProp(checked);\n      }\n      onChange(checked);\n    }\n  , [onChangeProp]);\n\n  const renderController = useCallback(({ field: { onBlur, onChange, ref, value } }: UseControllerReturn<TFieldValues, TName>) => {\n    ref({\n      focus: () => {\n        inputRef?.current?.focus();\n      },\n    });\n    return (\n      <FormControl\n        {...TestIdUtil.createAttributes('Select', { label, name })}\n        fullWidth\n      >\n        <FormControlLabel\n          control={(\n            <MuiSwitch\n              checked={!!value}\n              color={'primary'}\n              slotProps={{\n                input: {\n                  ref: inputRef,\n                },\n              }}\n            />\n          )}\n          disabled={disabled}\n          label={label}\n          onBlur={onBlur}\n          onChange={onMuiSwitchChange(onChange)}\n        />\n        <FormHelperText\n          className={classnames({ 'Mui-warning': hasWarning })}\n          sx={{ ml: 0 }}\n        >\n          <FormFieldHelperText\n            errorMessage={errorMessage}\n            infoMessage={infoMessage}\n            noIndent\n            warningMessage={warningMessage}\n          />\n        </FormHelperText>\n        { !!loading && <FormFieldLoadingIndicator />}\n      </FormControl>\n\n    );\n  }, [disabled, infoMessage, errorMessage, hasWarning, label, loading, name, onMuiSwitchChange, warningMessage]);\n\n  return (\n\n    <Controller\n      control={control}\n      defaultValue={null}\n      name={name}\n      render={renderController}\n    />\n\n  );\n};\n"],"mappings":";;;;;;;;;;;mCA0Ca,KAAmG,EAC9G,cAAW,IACX,gBACA,UACA,aAAU,IACV,SACA,UAAU,GACV,wBACoD;CACpD,IAAM,EAAE,YAAS,WAAW,EAAE,gBAAa,EAA6B,GAClE,IAAe,EAAS,qBAAqB,GAAQ,CAAI,GACzD,IAAW,EAAyB,IAAI,GAGxC,IAAa,CAAC,CAAC,KAAkB,CADpB,GAGb,IAAoB,GAAa,OACpC,GAAwB,MAAqB;EAI5C,AAHI,KACF,EAAa,CAAO,GAEtB,EAAS,CAAO;CAClB,GACA,CAAC,CAAY,CAAC;CA+ChB,OAEE,kBAAC,GAAD;EACW;EACT,cAAc;EACR;EACN,QAnDqB,GAAa,EAAE,OAAO,EAAE,WAAQ,aAAU,QAAK,kBACtE,EAAI,EACF,aAAa;GACX,GAAU,SAAS,MAAM;EAC3B,EACF,CAAC,GAEC,kBAAC,GAAD;GACE,GAAI,EAAW,iBAAiB,UAAU;IAAE;IAAO;GAAK,CAAC;GACzD,WAAA;aAFF;IAIE,kBAAC,GAAD;KACE,SACE,kBAAC,GAAD;MACE,SAAS,CAAC,CAAC;MACX,OAAO;MACP,WAAW,EACT,OAAO,EACL,KAAK,EACP,EACF;KACD,CAAA;KAEO;KACH;KACC;KACR,UAAU,EAAkB,CAAQ;IACrC,CAAA;IACD,kBAAC,GAAD;KACE,YAAA,GAAA,EAAA,QAAA,CAAsB,EAAE,eAAe,EAAW,CAAC;KACnD,IAAI,EAAE,IAAI,EAAE;eAEZ,kBAAC,GAAD;MACgB;MACD;MACb,UAAA;MACgB;KACjB,CAAA;IACa,CAAA;IACd,CAAC,CAAC,KAAW,kBAAC,GAAD,CAA4B,CAAA;GAChC;OAGd;GAAC;GAAU;GAAa;GAAc;GAAY;GAAO;GAAS;GAAM;GAAmB;EAAc,CAQhG;CACT,CAAA;AAGL"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/fields/Switch/Switch.tsx"],"sourcesContent":["import type {\n  ReactElement,\n  SyntheticEvent,\n} from 'react';\nimport {\n  useCallback,\n  useRef,\n} from 'react';\nimport {\n  FormControl,\n  FormControlLabel,\n  FormHelperText,\n  Switch as MuiSwitch,\n} from '@mui/material';\nimport type {\n  ControllerRenderProps,\n  FieldValues,\n  Path,\n  UseControllerReturn,\n} from 'react-hook-form';\nimport {\n  Controller,\n  useFormContext,\n} from 'react-hook-form';\nimport classnames from 'classnames';\nimport { TestIdUtil } from '@gen-epix/ui-core/utils/TestIdUtil';\n\nimport { FormUtil } from '../../../utils/FormUtil';\nimport { FormFieldHelperText } from '../../helpers/FormFieldHelperText';\nimport { FormFieldLoadingIndicator } from '../../helpers/FormFieldLoadingIndicator';\n\nexport type SwitchProps<TFieldValues extends FieldValues, TName extends Path<TFieldValues>> = {\n  readonly disabled?: boolean;\n  readonly infoMessage?: string;\n  readonly label: string;\n  readonly loading?: boolean;\n  readonly name: TName;\n  readonly onChange?: (value: boolean) => void;\n  readonly required?: boolean;\n  readonly warningMessage?: string;\n};\n\nexport const Switch = <TFieldValues extends FieldValues, TName extends Path<TFieldValues> = Path<TFieldValues>>({\n  disabled = false,\n  infoMessage,\n  label,\n  loading = false,\n  name,\n  onChange: onChangeProp,\n  warningMessage,\n}: SwitchProps<TFieldValues, TName>): ReactElement => {\n  const { control, formState: { errors } } = useFormContext<TFieldValues>();\n  const errorMessage = FormUtil.getFieldErrorMessage(errors, name);\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const hasError = !!errorMessage;\n  const hasWarning = !!warningMessage && !hasError;\n\n  const onMuiSwitchChange = useCallback((onChange: ControllerRenderProps<TFieldValues, TName>['onChange']) =>\n    (_event: SyntheticEvent, checked: boolean) => {\n      if (onChangeProp) {\n        onChangeProp(checked);\n      }\n      onChange(checked);\n    }\n  , [onChangeProp]);\n\n  const renderController = useCallback(({ field: { onBlur, onChange, ref, value } }: UseControllerReturn<TFieldValues, TName>) => {\n    ref({\n      focus: () => {\n        inputRef?.current?.focus();\n      },\n    });\n    return (\n      <FormControl\n        {...TestIdUtil.createAttributes('Select', { label, name })}\n        fullWidth\n      >\n        <FormControlLabel\n          control={(\n            <MuiSwitch\n              checked={!!value}\n              color={'primary'}\n              slotProps={{\n                input: {\n                  ref: inputRef,\n                },\n              }}\n            />\n          )}\n          disabled={disabled}\n          label={label}\n          onBlur={onBlur}\n          onChange={onMuiSwitchChange(onChange)}\n        />\n        <FormHelperText\n          className={classnames({ 'Mui-warning': hasWarning })}\n          sx={{ ml: 0 }}\n        >\n          <FormFieldHelperText\n            errorMessage={errorMessage}\n            infoMessage={infoMessage}\n            noIndent\n            warningMessage={warningMessage}\n          />\n        </FormHelperText>\n        { !!loading && <FormFieldLoadingIndicator />}\n      </FormControl>\n\n    );\n  }, [disabled, infoMessage, errorMessage, hasWarning, label, loading, name, onMuiSwitchChange, warningMessage]);\n\n  return (\n\n    <Controller\n      control={control}\n      defaultValue={null}\n      name={name}\n      render={renderController}\n    />\n\n  );\n};\n"],"mappings":";;;;;;;;;;;mCA0Ca,KAAmG,EAC9G,cAAW,IACX,gBACA,UACA,aAAU,IACV,SACA,UAAU,GACV,wBACoD;CACpD,IAAM,EAAE,YAAS,WAAW,EAAE,gBAAa,EAA6B,GAClE,IAAe,EAAS,qBAAqB,GAAQ,CAAI,GACzD,IAAW,EAAyB,IAAI,GAGxC,IAAa,CAAC,CAAC,KAAkB,CADpB,GAGb,IAAoB,GAAa,OACpC,GAAwB,MAAqB;EAI5C,AAHI,KACF,EAAa,CAAO,GAEtB,EAAS,CAAO;CAClB,GACA,CAAC,CAAY,CAAC,GAEV,IAAmB,GAAa,EAAE,OAAO,EAAE,WAAQ,aAAU,QAAK,kBACtE,EAAI,EACF,aAAa;EACX,GAAU,SAAS,MAAM;CAC3B,EACF,CAAC,GAEC,kBAAC,GAAD;EACE,GAAI,EAAW,iBAAiB,UAAU;GAAE;GAAO;EAAK,CAAC;EACzD,WAAA;EAFF,UAAA;GAIE,kBAAC,GAAD;IACE,SACE,kBAAC,GAAD;KACE,SAAS,CAAC,CAAC;KACX,OAAO;KACP,WAAW,EACT,OAAO,EACL,KAAK,EACP,EACF;IACD,CAAA;IAEO;IACH;IACC;IACR,UAAU,EAAkB,CAAQ;GACrC,CAAA;GACD,kBAAC,GAAD;IACE,YAAA,GAAW,EAAA,QAAA,CAAW,EAAE,eAAe,EAAW,CAAC;IACnD,IAAI,EAAE,IAAI,EAAE;IAEZ,UAAA,kBAAC,GAAD;KACgB;KACD;KACb,UAAA;KACgB;IACjB,CAAA;GACa,CAAA;GACd,CAAC,CAAC,KAAW,kBAAC,GAAD,CAA4B,CAAA;EAChC;MAGd;EAAC;EAAU;EAAa;EAAc;EAAY;EAAO;EAAS;EAAM;EAAmB;CAAc,CAAC;CAE7G,OAEE,kBAAC,GAAD;EACW;EACT,cAAc;EACR;EACN,QAAQ;CACT,CAAA;AAGL"}

package/dist/components/fields/TextField/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/fields/TextField/TextField.tsx"],"sourcesContent":["import type {\n  ChangeEvent,\n  InputHTMLAttributes,\n  ReactElement,\n} from 'react';\nimport {\n  useCallback,\n  useRef,\n} from 'react';\nimport {\n  FormControl,\n  IconButton,\n  InputAdornment,\n  TextField as MuiTextField,\n} from '@mui/material';\nimport ClearIcon from '@mui/icons-material/Clear';\nimport type {\n  ControllerRenderProps,\n  FieldValues,\n  Path,\n  PathValue,\n  UseControllerReturn,\n} from 'react-hook-form';\nimport {\n  Controller,\n  useFormContext,\n} from 'react-hook-form';\nimport classnames from 'classnames';\nimport { useTranslation } from 'react-i18next';\nimport { TestIdUtil } from '@gen-epix/ui-core/utils/TestIdUtil';\n\nimport { FormUtil } from '../../../utils/FormUtil';\nimport { FormFieldHelperText } from '../../helpers/FormFieldHelperText';\nimport { FormFieldLoadingIndicator } from '../../helpers/FormFieldLoadingIndicator';\n\nexport type TextFieldProps<TFieldValues extends FieldValues, TName extends Path<TFieldValues> = Path<TFieldValues>> = {\n  readonly autocomplete?: string;\n  readonly disabled?: boolean;\n  readonly infoMessage?: string;\n  readonly label: string;\n  readonly loading?: boolean;\n  readonly multiline?: boolean;\n  readonly name: TName;\n  readonly onChange?: (value: string) => void;\n  readonly placeholder?: string;\n  readonly required?: boolean;\n  readonly rows?: number;\n  readonly type?: InputHTMLAttributes<unknown>['type'];\n  readonly warningMessage?: string;\n};\n\nexport const TextField = <TFieldValues extends FieldValues, TName extends Path<TFieldValues> = Path<TFieldValues>>({\n  autocomplete,\n  disabled = false,\n  infoMessage,\n  label,\n  loading = false,\n  multiline = false,\n  name,\n  onChange: onChangeProp,\n  placeholder,\n  required = false,\n  rows = 3,\n  type = 'text',\n  warningMessage,\n}: TextFieldProps<TFieldValues, TName>): ReactElement => {\n  const { t } = useTranslation();\n  const { control, formState: { errors } } = useFormContext<TFieldValues>();\n  const errorMessage = FormUtil.getFieldErrorMessage(errors, name);\n  const hasError = !!errorMessage;\n  const hasWarning = !!warningMessage && !hasError;\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const onMuiTextFieldChange = useCallback((onChange: ControllerRenderProps<TFieldValues, TName>['onChange']) =>\n    (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      const value = event.target.value;\n      if (onChangeProp) {\n        onChangeProp(value);\n      }\n      onChange(value);\n    }\n  , [onChangeProp]);\n\n  const renderController = useCallback(({ field: { onBlur, onChange, ref, value } }: UseControllerReturn<TFieldValues, TName>) => {\n    ref({\n      focus: () => {\n        inputRef?.current?.focus();\n      },\n    });\n\n    const onResetButtonClick = () => {\n      onChange('');\n    };\n\n    return (\n      <MuiTextField\n        disabled={disabled || loading}\n        error={hasError}\n        helperText={(\n          <FormFieldHelperText\n            errorMessage={errorMessage}\n            infoMessage={infoMessage}\n            warningMessage={warningMessage}\n          />\n        )}\n        inputRef={inputRef}\n        label={label}\n        multiline={multiline}\n        onBlur={onBlur}\n        onChange={onMuiTextFieldChange(onChange)}\n        placeholder={placeholder}\n        rows={rows}\n        slotProps={{\n          formHelperText: {\n            className: classnames({ 'Mui-warning': hasWarning }),\n          },\n          input: {\n            className: classnames({ 'Mui-warning': hasWarning }),\n            endAdornment: disabled ? undefined : (\n              <InputAdornment position={'end'}>\n                <IconButton\n                  {...TestIdUtil.createAttributes('TextField-reset')}\n                  aria-label={t`Clear text field`}\n                  // eslint-disable-next-line @eslint-react/kit/jsx-no-bind\n                  onClick={onResetButtonClick}\n                  sx={{\n                    '& svg': {\n                      fontSize: '16px',\n                    },\n                  }}\n                  tabIndex={-1}\n                >\n                  <ClearIcon />\n                </IconButton>\n              </InputAdornment>\n            ),\n            inputProps: {\n              autoComplete: autocomplete ?? name,\n              type,\n            },\n          },\n          inputLabel: {\n            className: classnames({ 'Mui-warning': hasWarning }),\n            required: required && !disabled,\n          },\n        }}\n        value={value ?? ''}\n        variant={'outlined'}\n      />\n    );\n  }, [disabled, loading, infoMessage, hasError, errorMessage, warningMessage, label, multiline, placeholder, rows, hasWarning, autocomplete, name, type, t, required, onMuiTextFieldChange]);\n\n  return (\n    <FormControl\n      {...TestIdUtil.createAttributes('TextField', { label, name })}\n      fullWidth\n      sx={{\n        '&:hover button, &:focus-within button': {\n          display: 'initial',\n        },\n        button: {\n          display: 'none',\n        },\n      }}\n    >\n      <Controller\n        control={control}\n        defaultValue={'' as PathValue<TFieldValues, TName>}\n        name={name}\n        render={renderController}\n      />\n      { !!loading && <FormFieldLoadingIndicator />}\n    </FormControl>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;mCAmDa,KAAsG,EACjH,iBACA,cAAW,IACX,gBACA,UACA,aAAU,IACV,eAAY,IACZ,SACA,UAAU,GACV,gBACA,cAAW,IACX,UAAO,GACP,UAAO,QACP,wBACuD;CACvD,IAAM,EAAE,SAAM,EAAe,GACvB,EAAE,YAAS,WAAW,EAAE,gBAAa,EAA6B,GAClE,IAAe,EAAS,qBAAqB,GAAQ,CAAI,GACzD,IAAW,CAAC,CAAC,GACb,IAAa,CAAC,CAAC,KAAkB,CAAC,GAClC,IAAW,EAAyB,IAAI,GAExC,IAAuB,GAAa,OACvC,MAA+D;EAC9D,IAAM,IAAQ,EAAM,OAAO;EAI3B,AAHI,KACF,EAAa,CAAK,GAEpB,EAAS,CAAK;CAChB,GACA,CAAC,CAAY,CAAC,GAEV,IAAmB,GAAa,EAAE,OAAO,EAAE,WAAQ,aAAU,QAAK,iBAAwD;EAC9H,EAAI,EACF,aAAa;GACX,GAAU,SAAS,MAAM;EAC3B,EACF,CAAC;EAED,IAAM,UAA2B;GAC/B,EAAS,EAAE;EACb;EAEA,OACE,kBAAC,GAAD;GACE,UAAU,KAAY;GACtB,OAAO;GACP,YACE,kBAAC,GAAD;IACgB;IACD;IACG;GACjB,CAAA;GAEO;GACH;GACI;GACH;GACR,UAAU,EAAqB,CAAQ;GAC1B;GACP;GACN,WAAW;IACT,gBAAgB,EACd,YAAA,GAAA,EAAA,QAAA,CAAsB,EAAE,eAAe,EAAW,CAAC,EACrD;IACA,OAAO;KACL,YAAA,GAAA,EAAA,QAAA,CAAsB,EAAE,eAAe,EAAW,CAAC;KACnD,cAAc,IAAW,KAAA,IACvB,kBAAC,GAAD;MAAgB,UAAU;gBACxB,kBAAC,GAAD;OACE,GAAI,EAAW,iBAAiB,iBAAiB;OACjD,cAAY,CAAC;OAEb,SAAS;OACT,IAAI,EACF,SAAS,EACP,UAAU,OACZ,EACF;OACA,UAAU;iBAEV,kBAAC,GAAD,CAAY,CAAA;MACF,CAAA;KACE,CAAA;KAElB,YAAY;MACV,cAAc,KAAgB;MAC9B;KACF;IACF;IACA,YAAY;KACV,YAAA,GAAA,EAAA,QAAA,CAAsB,EAAE,eAAe,EAAW,CAAC;KACnD,UAAU,KAAY,CAAC;IACzB;GACF;GACA,OAAO,KAAS;GAChB,SAAS;EACV,CAAA;CAEL,GAAG;EAAC;EAAU;EAAS;EAAa;EAAU;EAAc;EAAgB;EAAO;EAAW;EAAa;EAAM;EAAY;EAAc;EAAM;EAAM;EAAG;EAAU;CAAoB,CAAC;CAEzL,OACE,kBAAC,GAAD;EACE,GAAI,EAAW,iBAAiB,aAAa;GAAE;GAAO;EAAK,CAAC;EAC5D,WAAA;EACA,IAAI;GACF,yCAAyC,EACvC,SAAS,UACX;GACA,QAAQ,EACN,SAAS,OACX;EACF;YAVF,CAYE,kBAAC,GAAD;GACW;GACT,cAAc;GACR;GACN,QAAQ;EACT,CAAA,GACC,CAAC,CAAC,KAAW,kBAAC,GAAD,CAA4B,CAAA,CAChC;;AAEjB"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/fields/TextField/TextField.tsx"],"sourcesContent":["import type {\n  ChangeEvent,\n  InputHTMLAttributes,\n  ReactElement,\n} from 'react';\nimport {\n  useCallback,\n  useRef,\n} from 'react';\nimport {\n  FormControl,\n  IconButton,\n  InputAdornment,\n  TextField as MuiTextField,\n} from '@mui/material';\nimport ClearIcon from '@mui/icons-material/Clear';\nimport type {\n  ControllerRenderProps,\n  FieldValues,\n  Path,\n  PathValue,\n  UseControllerReturn,\n} from 'react-hook-form';\nimport {\n  Controller,\n  useFormContext,\n} from 'react-hook-form';\nimport classnames from 'classnames';\nimport { useTranslation } from 'react-i18next';\nimport { TestIdUtil } from '@gen-epix/ui-core/utils/TestIdUtil';\n\nimport { FormUtil } from '../../../utils/FormUtil';\nimport { FormFieldHelperText } from '../../helpers/FormFieldHelperText';\nimport { FormFieldLoadingIndicator } from '../../helpers/FormFieldLoadingIndicator';\n\nexport type TextFieldProps<TFieldValues extends FieldValues, TName extends Path<TFieldValues> = Path<TFieldValues>> = {\n  readonly autocomplete?: string;\n  readonly disabled?: boolean;\n  readonly infoMessage?: string;\n  readonly label: string;\n  readonly loading?: boolean;\n  readonly multiline?: boolean;\n  readonly name: TName;\n  readonly onChange?: (value: string) => void;\n  readonly placeholder?: string;\n  readonly required?: boolean;\n  readonly rows?: number;\n  readonly type?: InputHTMLAttributes<unknown>['type'];\n  readonly warningMessage?: string;\n};\n\nexport const TextField = <TFieldValues extends FieldValues, TName extends Path<TFieldValues> = Path<TFieldValues>>({\n  autocomplete,\n  disabled = false,\n  infoMessage,\n  label,\n  loading = false,\n  multiline = false,\n  name,\n  onChange: onChangeProp,\n  placeholder,\n  required = false,\n  rows = 3,\n  type = 'text',\n  warningMessage,\n}: TextFieldProps<TFieldValues, TName>): ReactElement => {\n  const { t } = useTranslation();\n  const { control, formState: { errors } } = useFormContext<TFieldValues>();\n  const errorMessage = FormUtil.getFieldErrorMessage(errors, name);\n  const hasError = !!errorMessage;\n  const hasWarning = !!warningMessage && !hasError;\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const onMuiTextFieldChange = useCallback((onChange: ControllerRenderProps<TFieldValues, TName>['onChange']) =>\n    (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      const value = event.target.value;\n      if (onChangeProp) {\n        onChangeProp(value);\n      }\n      onChange(value);\n    }\n  , [onChangeProp]);\n\n  const renderController = useCallback(({ field: { onBlur, onChange, ref, value } }: UseControllerReturn<TFieldValues, TName>) => {\n    ref({\n      focus: () => {\n        inputRef?.current?.focus();\n      },\n    });\n\n    const onResetButtonClick = () => {\n      onChange('');\n    };\n\n    return (\n      <MuiTextField\n        disabled={disabled || loading}\n        error={hasError}\n        helperText={(\n          <FormFieldHelperText\n            errorMessage={errorMessage}\n            infoMessage={infoMessage}\n            warningMessage={warningMessage}\n          />\n        )}\n        inputRef={inputRef}\n        label={label}\n        multiline={multiline}\n        onBlur={onBlur}\n        onChange={onMuiTextFieldChange(onChange)}\n        placeholder={placeholder}\n        rows={rows}\n        slotProps={{\n          formHelperText: {\n            className: classnames({ 'Mui-warning': hasWarning }),\n          },\n          input: {\n            className: classnames({ 'Mui-warning': hasWarning }),\n            endAdornment: disabled ? undefined : (\n              <InputAdornment position={'end'}>\n                <IconButton\n                  {...TestIdUtil.createAttributes('TextField-reset')}\n                  aria-label={t`Clear text field`}\n                  // eslint-disable-next-line @eslint-react/kit/jsx-no-bind\n                  onClick={onResetButtonClick}\n                  sx={{\n                    '& svg': {\n                      fontSize: '16px',\n                    },\n                  }}\n                  tabIndex={-1}\n                >\n                  <ClearIcon />\n                </IconButton>\n              </InputAdornment>\n            ),\n            inputProps: {\n              autoComplete: autocomplete ?? name,\n              type,\n            },\n          },\n          inputLabel: {\n            className: classnames({ 'Mui-warning': hasWarning }),\n            required: required && !disabled,\n          },\n        }}\n        value={value ?? ''}\n        variant={'outlined'}\n      />\n    );\n  }, [disabled, loading, infoMessage, hasError, errorMessage, warningMessage, label, multiline, placeholder, rows, hasWarning, autocomplete, name, type, t, required, onMuiTextFieldChange]);\n\n  return (\n    <FormControl\n      {...TestIdUtil.createAttributes('TextField', { label, name })}\n      fullWidth\n      sx={{\n        '&:hover button, &:focus-within button': {\n          display: 'initial',\n        },\n        button: {\n          display: 'none',\n        },\n      }}\n    >\n      <Controller\n        control={control}\n        defaultValue={'' as PathValue<TFieldValues, TName>}\n        name={name}\n        render={renderController}\n      />\n      { !!loading && <FormFieldLoadingIndicator />}\n    </FormControl>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;mCAmDa,KAAsG,EACjH,iBACA,cAAW,IACX,gBACA,UACA,aAAU,IACV,eAAY,IACZ,SACA,UAAU,GACV,gBACA,cAAW,IACX,UAAO,GACP,UAAO,QACP,wBACuD;CACvD,IAAM,EAAE,SAAM,EAAe,GACvB,EAAE,YAAS,WAAW,EAAE,gBAAa,EAA6B,GAClE,IAAe,EAAS,qBAAqB,GAAQ,CAAI,GACzD,IAAW,CAAC,CAAC,GACb,IAAa,CAAC,CAAC,KAAkB,CAAC,GAClC,IAAW,EAAyB,IAAI,GAExC,IAAuB,GAAa,OACvC,MAA+D;EAC9D,IAAM,IAAQ,EAAM,OAAO;EAI3B,AAHI,KACF,EAAa,CAAK,GAEpB,EAAS,CAAK;CAChB,GACA,CAAC,CAAY,CAAC,GAEV,IAAmB,GAAa,EAAE,OAAO,EAAE,WAAQ,aAAU,QAAK,iBAAwD;EAC9H,EAAI,EACF,aAAa;GACX,GAAU,SAAS,MAAM;EAC3B,EACF,CAAC;EAED,IAAM,UAA2B;GAC/B,EAAS,EAAE;EACb;EAEA,OACE,kBAAC,GAAD;GACE,UAAU,KAAY;GACtB,OAAO;GACP,YACE,kBAAC,GAAD;IACgB;IACD;IACG;GACjB,CAAA;GAEO;GACH;GACI;GACH;GACR,UAAU,EAAqB,CAAQ;GAC1B;GACP;GACN,WAAW;IACT,gBAAgB,EACd,YAAA,GAAW,EAAA,QAAA,CAAW,EAAE,eAAe,EAAW,CAAC,EACrD;IACA,OAAO;KACL,YAAA,GAAW,EAAA,QAAA,CAAW,EAAE,eAAe,EAAW,CAAC;KACnD,cAAc,IAAW,KAAA,IACvB,kBAAC,GAAD;MAAgB,UAAU;MACxB,UAAA,kBAAC,GAAD;OACE,GAAI,EAAW,iBAAiB,iBAAiB;OACjD,cAAY,CAAC;OAEb,SAAS;OACT,IAAI,EACF,SAAS,EACP,UAAU,OACZ,EACF;OACA,UAAU;OAEV,UAAA,kBAAC,GAAD,CAAY,CAAA;MACF,CAAA;KACE,CAAA;KAElB,YAAY;MACV,cAAc,KAAgB;MAC9B;KACF;IACF;IACA,YAAY;KACV,YAAA,GAAW,EAAA,QAAA,CAAW,EAAE,eAAe,EAAW,CAAC;KACnD,UAAU,KAAY,CAAC;IACzB;GACF;GACA,OAAO,KAAS;GAChB,SAAS;EACV,CAAA;CAEL,GAAG;EAAC;EAAU;EAAS;EAAa;EAAU;EAAc;EAAgB;EAAO;EAAW;EAAa;EAAM;EAAY;EAAc;EAAM;EAAM;EAAG;EAAU;CAAoB,CAAC;CAEzL,OACE,kBAAC,GAAD;EACE,GAAI,EAAW,iBAAiB,aAAa;GAAE;GAAO;EAAK,CAAC;EAC5D,WAAA;EACA,IAAI;GACF,yCAAyC,EACvC,SAAS,UACX;GACA,QAAQ,EACN,SAAS,OACX;EACF;EAVF,UAAA,CAYE,kBAAC,GAAD;GACW;GACT,cAAc;GACR;GACN,QAAQ;EACT,CAAA,GACC,CAAC,CAAC,KAAW,kBAAC,GAAD,CAA4B,CAAA,CAChC;;AAEjB"}

package/dist/components/fields/ToggleButtonGroup/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/fields/ToggleButtonGroup/ToggleButtonGroup.tsx"],"sourcesContent":["import type {\n  ChangeEvent,\n  ReactElement,\n} from 'react';\nimport {\n  useCallback,\n  useRef,\n} from 'react';\nimport {\n  FormControl,\n  FormHelperText,\n  ToggleButtonGroup as MuiToggleButtonGroup,\n  ToggleButton,\n} from '@mui/material';\nimport {\n  Controller,\n  useFormContext,\n} from 'react-hook-form';\nimport type {\n  ControllerRenderProps,\n  FieldValues,\n  Path,\n  UseControllerReturn,\n} from 'react-hook-form';\nimport { TestIdUtil } from '@gen-epix/ui-core/utils/TestIdUtil';\n\nimport type { ToggleButtonOption } from '../../../models/form';\nimport { FormUtil } from '../../../utils/FormUtil';\nimport { FormFieldHelperText } from '../../helpers/FormFieldHelperText';\n\nexport type ToggleButtonProps<TFieldValues extends FieldValues, TName extends Path<TFieldValues> = Path<TFieldValues>> = {\n  readonly disabled?: boolean;\n  readonly infoMessage?: string;\n  readonly name: TName;\n  readonly onChange?: (value: string) => void;\n  readonly options: ToggleButtonOption[];\n  readonly required?: boolean;\n  readonly row?: boolean;\n  readonly warningMessage?: string;\n};\n\nexport const ToggleButtonGroup = <TFieldValues extends FieldValues, TName extends Path<TFieldValues> = Path<TFieldValues>>({\n  disabled,\n  infoMessage,\n  name,\n  onChange: onChangeProp,\n  options,\n  required,\n  warningMessage,\n}: ToggleButtonProps<TFieldValues, TName>): ReactElement => {\n  const { control, formState: { errors } } = useFormContext<TFieldValues>();\n  const errorMessage = FormUtil.getFieldErrorMessage(errors, name);\n\n  const inputRef = useRef<HTMLInputElement>(null);\n  const hasError = !!errorMessage;\n\n  const onMuiToggleButtonChange = useCallback((onChange: ControllerRenderProps<TFieldValues, TName>['onChange']) =>\n    (_event: ChangeEvent<unknown>, value: string) => {\n      if (required && value === null) {\n        return;\n      }\n      if (onChangeProp) {\n        onChangeProp(value);\n      }\n      onChange(value);\n    }\n  , [onChangeProp, required]);\n\n  const renderController = useCallback(({ field: { onBlur, onChange, ref, value } }: UseControllerReturn<TFieldValues, TName>) => {\n    ref({\n      focus: () => {\n        inputRef?.current?.focus();\n      },\n    });\n    return (\n      <MuiToggleButtonGroup\n        color={'primary'}\n        exclusive\n        onBlur={onBlur}\n        onChange={onMuiToggleButtonChange(onChange)}\n        value={value}\n      >\n        { options.map((option) => {\n          return (\n            <ToggleButton\n              key={option.value.toString()}\n              {...TestIdUtil.createAttributes('ToggleButton-option', { code: option.value.toString(), description: option.label })}\n              disabled={disabled}\n              value={option.value}\n            >\n              {option.label}\n            </ToggleButton>\n          );\n        })}\n      </MuiToggleButtonGroup>\n    );\n  }, [onMuiToggleButtonChange, options, disabled]);\n\n  return (\n    <FormControl\n      error={hasError}\n      {...TestIdUtil.createAttributes('ToggleButtonGroup', { name })}\n      fullWidth\n    >\n      <Controller\n        control={control}\n        defaultValue={null}\n        name={name}\n        render={renderController}\n      />\n      <FormHelperText sx={{ ml: 0 }}>\n        <FormFieldHelperText\n          errorMessage={errorMessage}\n          infoMessage={infoMessage}\n          noIndent\n          warningMessage={warningMessage}\n        />\n      </FormHelperText>\n    </FormControl>\n  );\n};\n"],"mappings":";;;;;;;;AAyCA,IAAa,KAA8G,EACzH,aACA,gBACA,SACA,UAAU,GACV,YACA,aACA,wBAC0D;CAC1D,IAAM,EAAE,YAAS,WAAW,EAAE,gBAAa,EAA6B,GAClE,IAAe,EAAS,qBAAqB,GAAQ,CAAI,GAEzD,IAAW,EAAyB,IAAI,GACxC,IAAW,CAAC,CAAC,GAEb,IAA0B,GAAa,OAC1C,GAA8B,MAAkB;EAC3C,KAAY,MAAU,SAGtB,KACF,EAAa,CAAK,GAEpB,EAAS,CAAK;CAChB,GACA,CAAC,GAAc,CAAQ,CAAC,GAEpB,IAAmB,GAAa,EAAE,OAAO,EAAE,WAAQ,aAAU,QAAK,kBACtE,EAAI,EACF,aAAa;EACX,GAAU,SAAS,MAAM;CAC3B,EACF,CAAC,GAEC,kBAAC,GAAD;EACE,OAAO;EACP,WAAA;EACQ;EACR,UAAU,EAAwB,CAAQ;EACnC;YAEL,EAAQ,KAAK,MAEX,kBAAC,GAAD;GAEE,GAAI,EAAW,iBAAiB,uBAAuB;IAAE,MAAM,EAAO,MAAM,SAAS;IAAG,aAAa,EAAO;GAAM,CAAC;GACzG;GACV,OAAO,EAAO;aAEb,EAAO;EACI,GANP,EAAO,MAAM,SAAS,CAMf,CAEjB;CACmB,CAAA,IAEvB;EAAC;EAAyB;EAAS;CAAQ,CAAC;CAE/C,OACE,kBAAC,GAAD;EACE,OAAO;EACP,GAAI,EAAW,iBAAiB,qBAAqB,EAAE,QAAK,CAAC;EAC7D,WAAA;YAHF,CAKE,kBAAC,GAAD;GACW;GACT,cAAc;GACR;GACN,QAAQ;EACT,CAAA,GACD,kBAAC,GAAD;GAAgB,IAAI,EAAE,IAAI,EAAE;aAC1B,kBAAC,GAAD;IACgB;IACD;IACb,UAAA;IACgB;GACjB,CAAA;EACa,CAAA,CACL;;AAEjB"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/fields/ToggleButtonGroup/ToggleButtonGroup.tsx"],"sourcesContent":["import type {\n  ChangeEvent,\n  ReactElement,\n} from 'react';\nimport {\n  useCallback,\n  useRef,\n} from 'react';\nimport {\n  FormControl,\n  FormHelperText,\n  ToggleButtonGroup as MuiToggleButtonGroup,\n  ToggleButton,\n} from '@mui/material';\nimport {\n  Controller,\n  useFormContext,\n} from 'react-hook-form';\nimport type {\n  ControllerRenderProps,\n  FieldValues,\n  Path,\n  UseControllerReturn,\n} from 'react-hook-form';\nimport { TestIdUtil } from '@gen-epix/ui-core/utils/TestIdUtil';\n\nimport type { ToggleButtonOption } from '../../../models/form';\nimport { FormUtil } from '../../../utils/FormUtil';\nimport { FormFieldHelperText } from '../../helpers/FormFieldHelperText';\n\nexport type ToggleButtonProps<TFieldValues extends FieldValues, TName extends Path<TFieldValues> = Path<TFieldValues>> = {\n  readonly disabled?: boolean;\n  readonly infoMessage?: string;\n  readonly name: TName;\n  readonly onChange?: (value: string) => void;\n  readonly options: ToggleButtonOption[];\n  readonly required?: boolean;\n  readonly row?: boolean;\n  readonly warningMessage?: string;\n};\n\nexport const ToggleButtonGroup = <TFieldValues extends FieldValues, TName extends Path<TFieldValues> = Path<TFieldValues>>({\n  disabled,\n  infoMessage,\n  name,\n  onChange: onChangeProp,\n  options,\n  required,\n  warningMessage,\n}: ToggleButtonProps<TFieldValues, TName>): ReactElement => {\n  const { control, formState: { errors } } = useFormContext<TFieldValues>();\n  const errorMessage = FormUtil.getFieldErrorMessage(errors, name);\n\n  const inputRef = useRef<HTMLInputElement>(null);\n  const hasError = !!errorMessage;\n\n  const onMuiToggleButtonChange = useCallback((onChange: ControllerRenderProps<TFieldValues, TName>['onChange']) =>\n    (_event: ChangeEvent<unknown>, value: string) => {\n      if (required && value === null) {\n        return;\n      }\n      if (onChangeProp) {\n        onChangeProp(value);\n      }\n      onChange(value);\n    }\n  , [onChangeProp, required]);\n\n  const renderController = useCallback(({ field: { onBlur, onChange, ref, value } }: UseControllerReturn<TFieldValues, TName>) => {\n    ref({\n      focus: () => {\n        inputRef?.current?.focus();\n      },\n    });\n    return (\n      <MuiToggleButtonGroup\n        color={'primary'}\n        exclusive\n        onBlur={onBlur}\n        onChange={onMuiToggleButtonChange(onChange)}\n        value={value}\n      >\n        { options.map((option) => {\n          return (\n            <ToggleButton\n              key={option.value.toString()}\n              {...TestIdUtil.createAttributes('ToggleButton-option', { code: option.value.toString(), description: option.label })}\n              disabled={disabled}\n              value={option.value}\n            >\n              {option.label}\n            </ToggleButton>\n          );\n        })}\n      </MuiToggleButtonGroup>\n    );\n  }, [onMuiToggleButtonChange, options, disabled]);\n\n  return (\n    <FormControl\n      error={hasError}\n      {...TestIdUtil.createAttributes('ToggleButtonGroup', { name })}\n      fullWidth\n    >\n      <Controller\n        control={control}\n        defaultValue={null}\n        name={name}\n        render={renderController}\n      />\n      <FormHelperText sx={{ ml: 0 }}>\n        <FormFieldHelperText\n          errorMessage={errorMessage}\n          infoMessage={infoMessage}\n          noIndent\n          warningMessage={warningMessage}\n        />\n      </FormHelperText>\n    </FormControl>\n  );\n};\n"],"mappings":";;;;;;;;AAyCA,IAAa,KAA8G,EACzH,aACA,gBACA,SACA,UAAU,GACV,YACA,aACA,wBAC0D;CAC1D,IAAM,EAAE,YAAS,WAAW,EAAE,gBAAa,EAA6B,GAClE,IAAe,EAAS,qBAAqB,GAAQ,CAAI,GAEzD,IAAW,EAAyB,IAAI,GACxC,IAAW,CAAC,CAAC,GAEb,IAA0B,GAAa,OAC1C,GAA8B,MAAkB;EAC3C,KAAY,MAAU,SAGtB,KACF,EAAa,CAAK,GAEpB,EAAS,CAAK;CAChB,GACA,CAAC,GAAc,CAAQ,CAAC,GAEpB,IAAmB,GAAa,EAAE,OAAO,EAAE,WAAQ,aAAU,QAAK,kBACtE,EAAI,EACF,aAAa;EACX,GAAU,SAAS,MAAM;CAC3B,EACF,CAAC,GAEC,kBAAC,GAAD;EACE,OAAO;EACP,WAAA;EACQ;EACR,UAAU,EAAwB,CAAQ;EACnC;EAEL,UAAA,EAAQ,KAAK,MAEX,kBAAC,GAAD;GAEE,GAAI,EAAW,iBAAiB,uBAAuB;IAAE,MAAM,EAAO,MAAM,SAAS;IAAG,aAAa,EAAO;GAAM,CAAC;GACzG;GACV,OAAO,EAAO;GAEb,UAAA,EAAO;EACI,GANP,EAAO,MAAM,SAAS,CAMf,CAEjB;CACmB,CAAA,IAEvB;EAAC;EAAyB;EAAS;CAAQ,CAAC;CAE/C,OACE,kBAAC,GAAD;EACE,OAAO;EACP,GAAI,EAAW,iBAAiB,qBAAqB,EAAE,QAAK,CAAC;EAC7D,WAAA;EAHF,UAAA,CAKE,kBAAC,GAAD;GACW;GACT,cAAc;GACR;GACN,QAAQ;EACT,CAAA,GACD,kBAAC,GAAD;GAAgB,IAAI,EAAE,IAAI,EAAE;GAC1B,UAAA,kBAAC,GAAD;IACgB;IACD;IACb,UAAA;IACgB;GACjB,CAAA;EACa,CAAA,CACL;;AAEjB"}

package/dist/components/helpers/FormFieldHelperText/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/helpers/FormFieldHelperText/FormFieldHelperText.tsx"],"sourcesContent":["import type {\n  SxProps,\n  Theme,\n} from '@mui/material';\nimport {\n  Box,\n  FormHelperText,\n  useTheme,\n} from '@mui/material';\nimport ErrorIcon from '@mui/icons-material/Error';\nimport WarningIcon from '@mui/icons-material/WarningAmber';\nimport InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';\nimport type { ReactElement } from 'react';\nimport { TestIdUtil } from '@gen-epix/ui-core/utils/TestIdUtil';\n\nexport type FormFieldHelperTextProps = {\n  readonly errorMessage?: string;\n  readonly infoMessage?: string;\n  readonly noIndent?: boolean;\n  readonly warningMessage?: string;\n};\n\nconst iconStyle: SxProps<Theme> = {\n  height: '13px',\n  marginRight: '1px',\n  position: 'relative',\n  top: '3px',\n  width: '13px',\n};\n\nexport const FormFieldHelperText = ({\n  errorMessage,\n  infoMessage,\n  noIndent,\n  warningMessage,\n}: FormFieldHelperTextProps): ReactElement => {\n  const testIdAttributes = TestIdUtil.createAttributes('FormFieldHelperText');\n  const theme = useTheme();\n\n  if (errorMessage) {\n    return (\n      <FormHelperText\n        {...testIdAttributes}\n        component={'span'}\n        error\n        role={'alert'}\n        sx={{\n          marginLeft: noIndent ? 0 : theme.spacing(-2),\n          position: 'relative',\n        }}\n      >\n        <ErrorIcon sx={iconStyle} />\n        {errorMessage}\n      </FormHelperText>\n    );\n  } else if (warningMessage) {\n    return (\n      <Box\n        {...testIdAttributes}\n        className={'Mui-warning'}\n        component={'span'}\n        role={'alert'}\n        sx={{\n          marginLeft: noIndent ? 0 : theme.spacing(-2),\n          position: 'relative',\n        }}\n      >\n        <WarningIcon sx={iconStyle} />\n        {warningMessage}\n      </Box>\n    );\n  } else if (infoMessage) {\n    return (\n      <Box\n        {...testIdAttributes}\n        component={'span'}\n        role={'alert'}\n        sx={{\n          marginLeft: noIndent ? 0 : theme.spacing(-2),\n          position: 'relative',\n        }}\n      >\n        <InfoOutlinedIcon sx={iconStyle} />\n        {infoMessage}\n      </Box>\n    );\n  }\n  return null;\n};\n"],"mappings":";;;;;;;AAsBA,IAAM,IAA4B;CAChC,QAAQ;CACR,aAAa;CACb,UAAU;CACV,KAAK;CACL,OAAO;AACT,GAEa,KAAuB,EAClC,iBACA,gBACA,aACA,wBAC4C;CAC5C,IAAM,IAAmB,EAAW,iBAAiB,qBAAqB,GACpE,IAAQ,EAAS;CAkDvB,OAhDI,IAEA,kBAAC,GAAD;EACE,GAAI;EACJ,WAAW;EACX,OAAA;EACA,MAAM;EACN,IAAI;GACF,YAAY,IAAW,IAAI,EAAM,QAAQ,EAAE;GAC3C,UAAU;EACZ;YARF,CAUE,kBAAC,GAAD,EAAW,IAAI,EAAY,CAAA,GAC1B,CACa;MAET,IAEP,kBAAC,GAAD;EACE,GAAI;EACJ,WAAW;EACX,WAAW;EACX,MAAM;EACN,IAAI;GACF,YAAY,IAAW,IAAI,EAAM,QAAQ,EAAE;GAC3C,UAAU;EACZ;YARF,CAUE,kBAAC,GAAD,EAAa,IAAI,EAAY,CAAA,GAC5B,CACE;MAEE,IAEP,kBAAC,GAAD;EACE,GAAI;EACJ,WAAW;EACX,MAAM;EACN,IAAI;GACF,YAAY,IAAW,IAAI,EAAM,QAAQ,EAAE;GAC3C,UAAU;EACZ;YAPF,CASE,kBAAC,GAAD,EAAkB,IAAI,EAAY,CAAA,GACjC,CACE;MAGF;AACT"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/helpers/FormFieldHelperText/FormFieldHelperText.tsx"],"sourcesContent":["import type {\n  SxProps,\n  Theme,\n} from '@mui/material';\nimport {\n  Box,\n  FormHelperText,\n  useTheme,\n} from '@mui/material';\nimport ErrorIcon from '@mui/icons-material/Error';\nimport WarningIcon from '@mui/icons-material/WarningAmber';\nimport InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';\nimport type { ReactElement } from 'react';\nimport { TestIdUtil } from '@gen-epix/ui-core/utils/TestIdUtil';\n\nexport type FormFieldHelperTextProps = {\n  readonly errorMessage?: string;\n  readonly infoMessage?: string;\n  readonly noIndent?: boolean;\n  readonly warningMessage?: string;\n};\n\nconst iconStyle: SxProps<Theme> = {\n  height: '13px',\n  marginRight: '1px',\n  position: 'relative',\n  top: '3px',\n  width: '13px',\n};\n\nexport const FormFieldHelperText = ({\n  errorMessage,\n  infoMessage,\n  noIndent,\n  warningMessage,\n}: FormFieldHelperTextProps): ReactElement => {\n  const testIdAttributes = TestIdUtil.createAttributes('FormFieldHelperText');\n  const theme = useTheme();\n\n  if (errorMessage) {\n    return (\n      <FormHelperText\n        {...testIdAttributes}\n        component={'span'}\n        error\n        role={'alert'}\n        sx={{\n          marginLeft: noIndent ? 0 : theme.spacing(-2),\n          position: 'relative',\n        }}\n      >\n        <ErrorIcon sx={iconStyle} />\n        {errorMessage}\n      </FormHelperText>\n    );\n  } else if (warningMessage) {\n    return (\n      <Box\n        {...testIdAttributes}\n        className={'Mui-warning'}\n        component={'span'}\n        role={'alert'}\n        sx={{\n          marginLeft: noIndent ? 0 : theme.spacing(-2),\n          position: 'relative',\n        }}\n      >\n        <WarningIcon sx={iconStyle} />\n        {warningMessage}\n      </Box>\n    );\n  } else if (infoMessage) {\n    return (\n      <Box\n        {...testIdAttributes}\n        component={'span'}\n        role={'alert'}\n        sx={{\n          marginLeft: noIndent ? 0 : theme.spacing(-2),\n          position: 'relative',\n        }}\n      >\n        <InfoOutlinedIcon sx={iconStyle} />\n        {infoMessage}\n      </Box>\n    );\n  }\n  return null;\n};\n"],"mappings":";;;;;;;AAsBA,IAAM,IAA4B;CAChC,QAAQ;CACR,aAAa;CACb,UAAU;CACV,KAAK;CACL,OAAO;AACT,GAEa,KAAuB,EAClC,iBACA,gBACA,aACA,wBAC4C;CAC5C,IAAM,IAAmB,EAAW,iBAAiB,qBAAqB,GACpE,IAAQ,EAAS;CAkDvB,OAhDI,IAEA,kBAAC,GAAD;EACE,GAAI;EACJ,WAAW;EACX,OAAA;EACA,MAAM;EACN,IAAI;GACF,YAAY,IAAW,IAAI,EAAM,QAAQ,EAAE;GAC3C,UAAU;EACZ;EARF,UAAA,CAUE,kBAAC,GAAD,EAAW,IAAI,EAAY,CAAA,GAC1B,CACa;MAET,IAEP,kBAAC,GAAD;EACE,GAAI;EACJ,WAAW;EACX,WAAW;EACX,MAAM;EACN,IAAI;GACF,YAAY,IAAW,IAAI,EAAM,QAAQ,EAAE;GAC3C,UAAU;EACZ;EARF,UAAA,CAUE,kBAAC,GAAD,EAAa,IAAI,EAAY,CAAA,GAC5B,CACE;MAEE,IAEP,kBAAC,GAAD;EACE,GAAI;EACJ,WAAW;EACX,MAAM;EACN,IAAI;GACF,YAAY,IAAW,IAAI,EAAM,QAAQ,EAAE;GAC3C,UAAU;EACZ;EAPF,UAAA,CASE,kBAAC,GAAD,EAAkB,IAAI,EAAY,CAAA,GACjC,CACE;MAGF;AACT"}

package/dist/components/helpers/GenericForm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/helpers/GenericForm/GenericForm.tsx"],"sourcesContent":["import type {\n  ReactElement,\n  SubmitEventHandler,\n} from 'react';\nimport {\n  Fragment,\n  useCallback,\n  useMemo,\n} from 'react';\nimport { useTranslation } from 'react-i18next';\nimport type {\n  FieldValues,\n  Path,\n  UseFormReturn,\n} from 'react-hook-form';\nimport { FormProvider } from 'react-hook-form';\nimport {\n  Alert,\n  AlertTitle,\n  Box,\n  Button,\n  Typography,\n} from '@mui/material';\nimport type { ObjectSchema } from 'yup';\n\nimport type {\n  FormFieldDefinition,\n  FormGroupDefinition,\n} from '../../../models/form';\nimport { FORM_FIELD_DEFINITION_TYPE } from '../../../models/form';\nimport { FormUtil } from '../../../utils/FormUtil';\nimport { RichTextEditor } from '../../fields/RichTextEditor';\nimport { TransferList } from '../../fields/TransferList';\nimport type { AutocompleteProps } from '../../fields/Autocomplete';\nimport { Autocomplete } from '../../fields/Autocomplete';\nimport type { SelectProps } from '../../fields/Select';\nimport { Select } from '../../fields/Select';\nimport { TextField } from '../../fields/TextField';\nimport { NumberField } from '../../fields/NumberField';\nimport { DatePicker } from '../../fields/DatePicker';\nimport { UploadButton } from '../../fields/UploadButton/UploadButton';\nimport { RadioGroup } from '../../fields/RadioGroup';\nimport { Switch } from '../../fields/Switch';\nimport { useIsFormFieldRequiredFromSchema } from '../../../hooks/useIsFormFieldRequiredFromSchema';\n\nexport type GenericFormProps<TFormFields extends FieldValues> = {\n  readonly defaultFormValues?: Partial<TFormFields>;\n  readonly disableAll?: boolean;\n  readonly formFieldDefinitions: FormFieldDefinition<TFormFields>[];\n  readonly formGroupDefinitions?: FormGroupDefinition[];\n  readonly formId?: string;\n  readonly formMethods: UseFormReturn<TFormFields>;\n  readonly onSubmit?: SubmitEventHandler<HTMLFormElement>;\n  readonly renderField?: (definition: FormFieldDefinition<TFormFields>, element: ReactElement) => ReactElement;\n  readonly renderGroup?: (definition: FormGroupDefinition, children: ReactElement) => ReactElement;\n  readonly schema: ObjectSchema<TFormFields, TFormFields>;\n  readonly wrapForm?: (children: ReactElement) => ReactElement;\n};\n\nexport const GenericForm = <TFormFields extends FieldValues>({\n  disableAll,\n  formFieldDefinitions,\n  formGroupDefinitions,\n  formId,\n  formMethods,\n  onSubmit,\n  renderField,\n  renderGroup,\n  schema,\n  wrapForm,\n}: GenericFormProps<TFormFields>) => {\n  const { t } = useTranslation();\n\n  const booleanOptions = useMemo(() => FormUtil.createBooleanOptions(t), [t]);\n\n  const isFormFieldRequired = useIsFormFieldRequiredFromSchema(schema, formMethods.getValues);\n\n  const renderFormFieldDefinition = useCallback((formFieldDefinition: FormFieldDefinition<TFormFields>) => {\n    switch (formFieldDefinition.definition) {\n      case FORM_FIELD_DEFINITION_TYPE.AUTOCOMPLETE:\n        return (\n          <Autocomplete\n            {...formFieldDefinition as AutocompleteProps<TFormFields, Path<TFormFields>, false>}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.BOOLEAN:\n        return (\n          <Select\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            options={booleanOptions}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.BOOLEAN_SWITCH:\n        return (\n          <Switch\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.DATE:\n        return (\n          <DatePicker\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.FILE:\n        return (\n          <UploadButton\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.NUMBER:\n        return (\n          <NumberField\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.RADIO_GROUP:\n        return (\n          <RadioGroup\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.RICH_TEXT:\n        return (\n          <RichTextEditor\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.SELECT:\n        return (\n          <Select\n            {...formFieldDefinition as SelectProps<TFormFields, Path<TFormFields>, false>}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.SWITCH:\n        return (\n          <Switch\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.TEXTFIELD:\n        return (\n          <TextField\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.TRANSFER_LIST:\n        return (\n          <TransferList\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      default:\n        throw Error(`Unsupported form field definition: ${formFieldDefinition.definition}`);\n    }\n  }, [booleanOptions, disableAll, isFormFieldRequired]);\n\n\n  const renderSingleField = useCallback((formFieldDefinition: FormFieldDefinition<TFormFields>) => {\n    if (renderField) {\n      return (\n        <Fragment key={formFieldDefinition.name}>\n          {renderField(formFieldDefinition, renderFormFieldDefinition(formFieldDefinition))}\n        </Fragment>\n      );\n    }\n    return (\n      <Box\n        key={formFieldDefinition.name}\n        sx={{\n          marginY: 1,\n        }}\n      >\n        {renderFormFieldDefinition(formFieldDefinition)}\n      </Box>\n    );\n  }, [renderField, renderFormFieldDefinition]);\n\n  const formFieldsContent = useMemo(() => {\n    if (!formGroupDefinitions?.length) {\n      return (\n        <>\n          {formFieldDefinitions.map(renderSingleField)}\n        </>\n      );\n    }\n\n    const groupFieldsMap = new Map<string, FormFieldDefinition<TFormFields>[]>();\n    for (const group of formGroupDefinitions) {\n      groupFieldsMap.set(group.groupKey, []);\n    }\n\n    const ungroupedFields: FormFieldDefinition<TFormFields>[] = [];\n    for (const field of formFieldDefinitions) {\n      if (field.groupKey && groupFieldsMap.has(field.groupKey)) {\n        groupFieldsMap.get(field.groupKey)?.push(field);\n      } else {\n        ungroupedFields.push(field);\n      }\n    }\n\n    return (\n      <>\n        {formGroupDefinitions.map(group => {\n          const groupFields = groupFieldsMap.get(group.groupKey) ?? [];\n          if (!groupFields.length) {\n            return null;\n          }\n          const groupContent = (\n            <>\n              {groupFields.map(renderSingleField)}\n            </>\n          );\n          if (renderGroup) {\n            return (\n              <Fragment key={group.groupKey}>\n                {renderGroup(group, groupContent)}\n              </Fragment>\n            );\n          }\n          return (\n            <Box\n              key={group.groupKey}\n              sx={{ marginY: 2 }}\n            >\n              <Typography variant={'subtitle1'}>\n                {group.label}\n              </Typography>\n              {group.description && (\n                <Typography\n                  color={'text.secondary'}\n                  variant={'body2'}\n                >\n                  {group.description}\n                </Typography>\n              )}\n              {group.messages?.map((msg) => (\n                <Alert\n                  key={msg.message}\n                  severity={msg.severity}\n                  sx={{ '& .MuiAlert-message': { width: '100%' } }}\n                >\n                  <AlertTitle>\n                    {msg.message}\n                  </AlertTitle>\n                  {msg.buttonLabel && msg.onButtonClick && (\n                    <Box sx={{ display: 'flex', justifyContent: 'flex-end' }}>\n                      <Button\n                        color={'inherit'}\n                        onClick={msg.onButtonClick}\n                        size={'small'}\n                        variant={'text'}\n                      >\n                        {msg.buttonLabel}\n                      </Button>\n                    </Box>\n                  )}\n                </Alert>\n              ))}\n              {groupContent}\n            </Box>\n          );\n        })}\n        {ungroupedFields.map(renderSingleField)}\n      </>\n    );\n  }, [formFieldDefinitions, formGroupDefinitions, renderGroup, renderSingleField]);\n\n  return (\n    <FormProvider {...formMethods}>\n      <Box\n        autoComplete={'off'}\n        component={'form'}\n        id={formId}\n        onSubmit={onSubmit}\n      >\n        {wrapForm ? wrapForm(formFieldsContent) : formFieldsContent}\n      </Box>\n    </FormProvider>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/helpers/GenericForm/GenericForm.tsx"],"sourcesContent":["import type {\n  ReactElement,\n  SubmitEventHandler,\n} from 'react';\nimport {\n  Fragment,\n  useCallback,\n  useMemo,\n} from 'react';\nimport { useTranslation } from 'react-i18next';\nimport type {\n  FieldValues,\n  Path,\n  UseFormReturn,\n} from 'react-hook-form';\nimport { FormProvider } from 'react-hook-form';\nimport {\n  Alert,\n  AlertTitle,\n  Box,\n  Button,\n  Typography,\n} from '@mui/material';\nimport type { ObjectSchema } from 'yup';\n\nimport type {\n  FormFieldDefinition,\n  FormGroupDefinition,\n} from '../../../models/form';\nimport { FORM_FIELD_DEFINITION_TYPE } from '../../../models/form';\nimport { FormUtil } from '../../../utils/FormUtil';\nimport { RichTextEditor } from '../../fields/RichTextEditor';\nimport { TransferList } from '../../fields/TransferList';\nimport type { AutocompleteProps } from '../../fields/Autocomplete';\nimport { Autocomplete } from '../../fields/Autocomplete';\nimport type { SelectProps } from '../../fields/Select';\nimport { Select } from '../../fields/Select';\nimport { TextField } from '../../fields/TextField';\nimport { NumberField } from '../../fields/NumberField';\nimport { DatePicker } from '../../fields/DatePicker';\nimport { UploadButton } from '../../fields/UploadButton/UploadButton';\nimport { RadioGroup } from '../../fields/RadioGroup';\nimport { Switch } from '../../fields/Switch';\nimport { useIsFormFieldRequiredFromSchema } from '../../../hooks/useIsFormFieldRequiredFromSchema';\n\nexport type GenericFormProps<TFormFields extends FieldValues> = {\n  readonly defaultFormValues?: Partial<TFormFields>;\n  readonly disableAll?: boolean;\n  readonly formFieldDefinitions: FormFieldDefinition<TFormFields>[];\n  readonly formGroupDefinitions?: FormGroupDefinition[];\n  readonly formId?: string;\n  readonly formMethods: UseFormReturn<TFormFields>;\n  readonly onSubmit?: SubmitEventHandler<HTMLFormElement>;\n  readonly renderField?: (definition: FormFieldDefinition<TFormFields>, element: ReactElement) => ReactElement;\n  readonly renderGroup?: (definition: FormGroupDefinition, children: ReactElement) => ReactElement;\n  readonly schema: ObjectSchema<TFormFields, TFormFields>;\n  readonly wrapForm?: (children: ReactElement) => ReactElement;\n};\n\nexport const GenericForm = <TFormFields extends FieldValues>({\n  disableAll,\n  formFieldDefinitions,\n  formGroupDefinitions,\n  formId,\n  formMethods,\n  onSubmit,\n  renderField,\n  renderGroup,\n  schema,\n  wrapForm,\n}: GenericFormProps<TFormFields>) => {\n  const { t } = useTranslation();\n\n  const booleanOptions = useMemo(() => FormUtil.createBooleanOptions(t), [t]);\n\n  const isFormFieldRequired = useIsFormFieldRequiredFromSchema(schema, formMethods.getValues);\n\n  const renderFormFieldDefinition = useCallback((formFieldDefinition: FormFieldDefinition<TFormFields>) => {\n    switch (formFieldDefinition.definition) {\n      case FORM_FIELD_DEFINITION_TYPE.AUTOCOMPLETE:\n        return (\n          <Autocomplete\n            {...formFieldDefinition as AutocompleteProps<TFormFields, Path<TFormFields>, false>}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.BOOLEAN:\n        return (\n          <Select\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            options={booleanOptions}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.BOOLEAN_SWITCH:\n        return (\n          <Switch\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.DATE:\n        return (\n          <DatePicker\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.FILE:\n        return (\n          <UploadButton\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.NUMBER:\n        return (\n          <NumberField\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.RADIO_GROUP:\n        return (\n          <RadioGroup\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.RICH_TEXT:\n        return (\n          <RichTextEditor\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.SELECT:\n        return (\n          <Select\n            {...formFieldDefinition as SelectProps<TFormFields, Path<TFormFields>, false>}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.SWITCH:\n        return (\n          <Switch\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.TEXTFIELD:\n        return (\n          <TextField\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      case FORM_FIELD_DEFINITION_TYPE.TRANSFER_LIST:\n        return (\n          <TransferList\n            {...formFieldDefinition}\n            disabled={formFieldDefinition.disabled || disableAll}\n            required={isFormFieldRequired(formFieldDefinition.name)}\n          />\n        );\n      default:\n        throw Error(`Unsupported form field definition: ${formFieldDefinition.definition}`);\n    }\n  }, [booleanOptions, disableAll, isFormFieldRequired]);\n\n\n  const renderSingleField = useCallback((formFieldDefinition: FormFieldDefinition<TFormFields>) => {\n    if (renderField) {\n      return (\n        <Fragment key={formFieldDefinition.name}>\n          {renderField(formFieldDefinition, renderFormFieldDefinition(formFieldDefinition))}\n        </Fragment>\n      );\n    }\n    return (\n      <Box\n        key={formFieldDefinition.name}\n        sx={{\n          marginY: 1,\n        }}\n      >\n        {renderFormFieldDefinition(formFieldDefinition)}\n      </Box>\n    );\n  }, [renderField, renderFormFieldDefinition]);\n\n  const formFieldsContent = useMemo(() => {\n    if (!formGroupDefinitions?.length) {\n      return (\n        <>\n          {formFieldDefinitions.map(renderSingleField)}\n        </>\n      );\n    }\n\n    const groupFieldsMap = new Map<string, FormFieldDefinition<TFormFields>[]>();\n    for (const group of formGroupDefinitions) {\n      groupFieldsMap.set(group.groupKey, []);\n    }\n\n    const ungroupedFields: FormFieldDefinition<TFormFields>[] = [];\n    for (const field of formFieldDefinitions) {\n      if (field.groupKey && groupFieldsMap.has(field.groupKey)) {\n        groupFieldsMap.get(field.groupKey)?.push(field);\n      } else {\n        ungroupedFields.push(field);\n      }\n    }\n\n    return (\n      <>\n        {formGroupDefinitions.map(group => {\n          const groupFields = groupFieldsMap.get(group.groupKey) ?? [];\n          if (!groupFields.length) {\n            return null;\n          }\n          const groupContent = (\n            <>\n              {groupFields.map(renderSingleField)}\n            </>\n          );\n          if (renderGroup) {\n            return (\n              <Fragment key={group.groupKey}>\n                {renderGroup(group, groupContent)}\n              </Fragment>\n            );\n          }\n          return (\n            <Box\n              key={group.groupKey}\n              sx={{ marginY: 2 }}\n            >\n              <Typography variant={'subtitle1'}>\n                {group.label}\n              </Typography>\n              {group.description && (\n                <Typography\n                  color={'text.secondary'}\n                  variant={'body2'}\n                >\n                  {group.description}\n                </Typography>\n              )}\n              {group.messages?.map((msg) => (\n                <Alert\n                  key={msg.message}\n                  severity={msg.severity}\n                  sx={{ '& .MuiAlert-message': { width: '100%' } }}\n                >\n                  <AlertTitle>\n                    {msg.message}\n                  </AlertTitle>\n                  {msg.buttonLabel && msg.onButtonClick && (\n                    <Box sx={{ display: 'flex', justifyContent: 'flex-end' }}>\n                      <Button\n                        color={'inherit'}\n                        onClick={msg.onButtonClick}\n                        size={'small'}\n                        variant={'text'}\n                      >\n                        {msg.buttonLabel}\n                      </Button>\n                    </Box>\n                  )}\n                </Alert>\n              ))}\n              {groupContent}\n            </Box>\n          );\n        })}\n        {ungroupedFields.map(renderSingleField)}\n      </>\n    );\n  }, [formFieldDefinitions, formGroupDefinitions, renderGroup, renderSingleField]);\n\n  return (\n    <FormProvider {...formMethods}>\n      <Box\n        autoComplete={'off'}\n        component={'form'}\n        id={formId}\n        onSubmit={onSubmit}\n      >\n        {wrapForm ? wrapForm(formFieldsContent) : formFieldsContent}\n      </Box>\n    </FormProvider>\n  );\n};\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gen-epix/ui-core-form",
-  "version": "4.0.0",
+  "version": "4.0.2",
   "license": "EUPL-1.2",
   "repository": {
     "type": "git",
@@ -113,7 +113,7 @@
     }
   },
   "peerDependencies": {
-    "@gen-epix/ui-core": "^3.0.0",
+    "@gen-epix/ui-core": "^3.0.2",
     "@mui/icons-material": "*",
     "@mui/material": "*",
     "@mui/x-date-pickers": "*",
@@ -170,7 +170,7 @@
   },
   "devDependencies": {
     "@gen-epix/eslint-config": "0.5.0",
-    "@gen-epix/ui-core": "^3.0.0",
+    "@gen-epix/ui-core": "^3.0.2",
     "@gen-epix/translation-util": "0.2.0",
     "@mui/icons-material": "9.4.0",
     "@mui/material": "9.4.0",