From 8383e80e357a977bb66c1233811c254168ed4c7b Mon Sep 17 00:00:00 2001 From: Grzegorz Bach Date: Wed, 8 Jun 2022 12:16:37 +0200 Subject: [PATCH 1/5] fix unknown ref types --- src/components/Autocomplete.tsx | 5 +++-- src/components/CircularProgress.tsx | 3 ++- src/components/FormControlLabel.tsx | 6 ++++-- src/components/FormGroup.tsx | 6 ++++-- src/components/LinearProgress.tsx | 3 ++- src/components/Progress.tsx | 3 ++- src/components/Select.tsx | 3 ++- src/components/Snackbar.tsx | 3 ++- src/components/Tooltip.tsx | 3 ++- 9 files changed, 23 insertions(+), 12 deletions(-) diff --git a/src/components/Autocomplete.tsx b/src/components/Autocomplete.tsx index bb74879c4..06e16b0dc 100644 --- a/src/components/Autocomplete.tsx +++ b/src/components/Autocomplete.tsx @@ -29,7 +29,7 @@ export type OptionsType = { export interface AutocompleteProps extends Omit< MuiAutocompleteProps, - 'hiddenLabel' | 'startAdornment' | 'endAdornment' | 'variant' | 'renderInput' + 'hiddenLabel' | 'startAdornment' | 'endAdornment' | 'variant' | 'renderInput' | 'ref' > { adornment?: string | JSX.Element; label?: string; @@ -40,6 +40,7 @@ export interface AutocompleteProps error?: boolean; helperText?: string; 'data-testid'?: string; + ref?: Ref; } const Autocomplete = ( @@ -59,7 +60,7 @@ const Autocomplete = ( sx = {}, ...props }: AutocompleteProps, - ref: Ref + ref: Ref ): JSX.Element => { return ( + ref: Ref ): JSX.Element => { return ( ; +} const FormControlLabel = ( { sx = {}, ...props }: FormControlLabelProps, - ref: Ref + ref: Ref ): JSX.Element => { return ( +}; -const FormGroup = (props: FormGroupProps, ref: Ref): JSX.Element => { +const FormGroup = (props: FormGroupProps, ref: Ref): JSX.Element => { return ; }; diff --git a/src/components/LinearProgress.tsx b/src/components/LinearProgress.tsx index 531eed2a8..7dd629b5b 100644 --- a/src/components/LinearProgress.tsx +++ b/src/components/LinearProgress.tsx @@ -9,11 +9,12 @@ export interface LinearProgressProps extends MuiLinearProgressProps { value?: number; variant: 'buffer' | 'determinate' | 'indeterminate' | 'query'; 'data-testid'?: string; + ref?: Ref } const LinearProgress = ( { color = 'primary', value, variant = 'indeterminate', sx = {}, ...props }: LinearProgressProps, - ref: Ref + ref: Ref ): JSX.Element => { return ( ; } const Progress = ( @@ -20,7 +21,7 @@ const Progress = ( variant = 'indeterminate', ...props }: ProgressProps, - ref: Ref + ref: Ref ): JSX.Element => { return ( <> diff --git a/src/components/Select.tsx b/src/components/Select.tsx index 6d0306870..d541f5c08 100644 --- a/src/components/Select.tsx +++ b/src/components/Select.tsx @@ -8,6 +8,7 @@ type CommonProps = { adornment?: AutocompleteProps['adornment']; multiple?: boolean; 'data-testid'?: string; + ref?: Ref; }; export type MultipleSelectProps = Omit & CommonProps; @@ -21,7 +22,7 @@ export type SelectProps = MultipleSelectProps | SingleSelectProps; const Select = ( { adornment, options = [], multiple = false, 'data-testid': testid, ...props }: SelectProps, - ref: Ref + ref: Ref ): JSX.Element => { if (multiple) { return ( diff --git a/src/components/Snackbar.tsx b/src/components/Snackbar.tsx index 9ee604999..eb6b21c69 100644 --- a/src/components/Snackbar.tsx +++ b/src/components/Snackbar.tsx @@ -14,6 +14,7 @@ export interface SnackbarProps extends MuiSnackbarProps { direction?: 'right' | 'left' | 'up' | 'down'; severity?: 'success' | 'info' | 'warning' | 'error'; variant?: 'standard' | 'filled' | 'outlined'; + ref?: Ref } const Snackbar = ( @@ -29,7 +30,7 @@ const Snackbar = ( variant = 'standard', ...props }: SnackbarProps, - ref: Ref + ref: Ref ): JSX.Element => { return ( ; 'data-testid'?: string; + ref?: Ref } const Tooltip = ( { arrow = false, placement = 'bottom', children, title, ...props }: TooltipProps, - ref: Ref + ref: Ref ): JSX.Element => { return ( Date: Wed, 8 Jun 2022 13:25:15 +0200 Subject: [PATCH 2/5] add reftypes for pagination and box --- src/components/Box.tsx | 6 ++++-- src/components/Pagination.tsx | 6 ++++-- 2 files changed, 8 insertions(+), 4 deletions(-) diff --git a/src/components/Box.tsx b/src/components/Box.tsx index bbdf296a2..d495a3427 100644 --- a/src/components/Box.tsx +++ b/src/components/Box.tsx @@ -1,9 +1,11 @@ import { Box as MuiBox, BoxProps as MuiBoxProps } from '@mui/material'; import { forwardRef, Ref } from 'react'; -export type BoxProps = MuiBoxProps; +export interface BoxProps extends MuiBoxProps { + ref?: Ref; +} -const Box = (props: BoxProps, ref: Ref): JSX.Element => { +const Box = (props: BoxProps, ref: Ref): JSX.Element => { return ; }; diff --git a/src/components/Pagination.tsx b/src/components/Pagination.tsx index d2aa8da14..a9b3dcf00 100644 --- a/src/components/Pagination.tsx +++ b/src/components/Pagination.tsx @@ -1,9 +1,11 @@ import { Pagination as MuiPagination, PaginationProps as MuiPaginationProps } from '@mui/material'; import { forwardRef, Ref } from 'react'; -export type PaginationProps = MuiPaginationProps; +export interface PaginationProps extends MuiPaginationProps { + ref?: Ref; +} -const Pagination = ({ sx = {}, ...props }: PaginationProps, ref: Ref): JSX.Element => { +const Pagination = ({ sx = {}, ...props }: PaginationProps, ref: Ref): JSX.Element => { return ( Date: Wed, 8 Jun 2022 16:10:22 +0200 Subject: [PATCH 3/5] reexport RadioGroup component --- src/components/RadioGroup.tsx | 9 +++++++++ src/index.ts | 1 + 2 files changed, 10 insertions(+) create mode 100644 src/components/RadioGroup.tsx diff --git a/src/components/RadioGroup.tsx b/src/components/RadioGroup.tsx new file mode 100644 index 000000000..4d09f3c70 --- /dev/null +++ b/src/components/RadioGroup.tsx @@ -0,0 +1,9 @@ +import { RadioGroup as MuiRadioGroup, RadioGroupProps as MuiRadioGroupProps } from '@mui/material'; + +export interface RadioGroupProps extends MuiRadioGroupProps {} + +const RadioGroup = (props: RadioGroupProps): JSX.Element => { + return ; +}; + +export default RadioGroup; diff --git a/src/index.ts b/src/index.ts index 52cfe4c57..8b5b4252f 100644 --- a/src/index.ts +++ b/src/index.ts @@ -58,6 +58,7 @@ export { default as Tabs } from './components/Tabs'; export { default as TextField } from './components/TextField'; export { default as TimePicker } from './components/TimePicker'; export { default as Tooltip } from './components/Tooltip'; +export { default as RadioGroup } from './components/RadioGroup'; export { default as TreeView } from '@mui/lab/TreeView'; export { default as TreeItem } from '@mui/lab/TreeItem'; export type { TreeItemProps } from '@mui/lab/TreeItem'; From b06c7d353bf15c884be805d3dda4c22768f71dd4 Mon Sep 17 00:00:00 2001 From: kacperkosinski Date: Wed, 8 Jun 2022 16:11:51 +0200 Subject: [PATCH 4/5] bump version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index e47233c8a..8d596ac50 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "@lyyti/design-system", "description": "Lyyti Design System", "homepage": "https://lyytioy.github.io/lyyti-design-system", - "version": "1.0.9", + "version": "1.0.10", "engines": { "node": "^16", "npm": "^8" From a302423af8b9b69b674790754bcae353863f51cb Mon Sep 17 00:00:00 2001 From: kacperkosinski Date: Thu, 9 Jun 2022 10:30:17 +0200 Subject: [PATCH 5/5] wrap component with forwardRef --- src/components/RadioGroup.tsx | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/components/RadioGroup.tsx b/src/components/RadioGroup.tsx index 4d09f3c70..9e4992721 100644 --- a/src/components/RadioGroup.tsx +++ b/src/components/RadioGroup.tsx @@ -1,9 +1,10 @@ import { RadioGroup as MuiRadioGroup, RadioGroupProps as MuiRadioGroupProps } from '@mui/material'; +import { forwardRef, Ref } from 'react'; export interface RadioGroupProps extends MuiRadioGroupProps {} -const RadioGroup = (props: RadioGroupProps): JSX.Element => { - return ; +const RadioGroup = (props: RadioGroupProps, ref: Ref): JSX.Element => { + return ; }; -export default RadioGroup; +export default forwardRef(RadioGroup);