From 5c5ae408d7d43e4fa783db5b21aa4b8cd81935d6 Mon Sep 17 00:00:00 2001 From: Henrique Souza Date: Mon, 12 Dec 2022 17:47:08 -0300 Subject: [PATCH 1/2] refactor: components creation with new react syntax --- package.json | 2 +- src/core/Advertise.tsx | 6 +- src/core/AutoComplete.tsx | 3 +- src/core/Avatar.tsx | 7 +- src/core/Badge.tsx | 5 +- src/core/Box.tsx | 7 +- src/core/Button.tsx | 7 +- src/core/Card.tsx | 26 +++--- src/core/Chapter.tsx | 9 ++- src/core/Chip.tsx | 6 +- src/core/Collapse.tsx | 7 +- src/core/Container.tsx | 6 +- src/core/Content.tsx | 6 +- src/core/DataTable/DataTable.tsx | 5 +- .../DataTable/DataTableQueryPaginated.tsx | 7 +- src/core/DateTime.tsx | 6 +- src/core/Dialog.tsx | 6 +- src/core/Divider.tsx | 8 +- src/core/Drawer.tsx | 4 +- src/core/ExpansionPanel.tsx | 11 ++- src/core/Fab.tsx | 2 +- src/core/Fade.tsx | 2 +- src/core/Grow.tsx | 2 +- src/core/Header.tsx | 6 +- src/core/IconButton.tsx | 6 +- src/core/InputAdornment.tsx | 9 +-- src/core/InputBase.tsx | 6 +- src/core/Line.tsx | 4 +- src/core/List.tsx | 6 +- src/core/ListItem.tsx | 4 +- src/core/MaskField.tsx | 24 +++--- src/core/Menu.tsx | 6 +- src/core/Node.tsx | 48 ++++------- src/core/Pagination.tsx | 62 ++++++-------- src/core/Paper.tsx | 6 +- src/core/PinInput.tsx | 6 +- src/core/Progress.tsx | 6 +- src/core/Radio.tsx | 4 +- src/core/RadioGroup.tsx | 6 +- src/core/Select.tsx | 7 +- src/core/Sidebar.tsx | 6 +- src/core/Slider.tsx | 6 +- src/core/Snackbar.tsx | 4 +- src/core/Stepper.tsx | 80 +++++++++---------- src/core/Tab.tsx | 34 ++++---- src/core/Table.tsx | 6 +- src/core/TableBody.tsx | 6 +- src/core/TableCell.tsx | 6 +- src/core/TableHead.tsx | 6 +- src/core/TableRow.tsx | 6 +- src/core/Tabs.tsx | 6 +- src/core/TextField.tsx | 5 +- src/core/ThemeProvider.tsx | 5 +- src/core/Tree.tsx | 40 +++++++--- src/core/Typography.tsx | 6 +- src/core/types.ts | 1 + 56 files changed, 292 insertions(+), 297 deletions(-) diff --git a/package.json b/package.json index b4a852ab..4aeba137 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "flipper-ui", - "version": "0.26.6", + "version": "0.26.7", "description": "", "main": "dist/index.js", "homepage": "https://flipper-ui.ngi.com.br/", diff --git a/src/core/Advertise.tsx b/src/core/Advertise.tsx index e53c26cf..d84a74e0 100644 --- a/src/core/Advertise.tsx +++ b/src/core/Advertise.tsx @@ -1,4 +1,4 @@ -import React, { FC } from 'react' +import React from 'react' import { background } from '../colors' import MuiPaper from './Paper' import Typography from './Typography' @@ -23,14 +23,14 @@ const Paper = styled(MuiPaper)` flex-direction: column; ` -const Advertise: FC = ({ +const Advertise = ({ comment, author, padding = 4, commentStyle = {}, authorStyle = {}, ...otherProps -}) => ( +}: AdvertiseProps) => ( text.normalize('NFD').replace(/[\u0300-\u036f]/g, '') -const AutoComplete: FC = props => { +const AutoComplete = (props: AutoCompleteProps) => { const inputRef = useRef(null) const index = props.suggestions.findIndex(suggestion => { diff --git a/src/core/Avatar.tsx b/src/core/Avatar.tsx index c3dabc0e..c5f21ccb 100644 --- a/src/core/Avatar.tsx +++ b/src/core/Avatar.tsx @@ -1,7 +1,7 @@ import { Avatar as MuiAvatar } from '@material-ui/core' import { makeStyles, createStyles } from '@material-ui/core/styles' import { Theme } from '@material-ui/core/styles/createMuiTheme' -import React, { FC } from 'react' +import React from 'react' import type { DefaultProps } from './types' interface AvatarProps extends DefaultProps { @@ -11,6 +11,7 @@ interface AvatarProps extends DefaultProps { src?: string imgProps?: object primary?: boolean + children: React.ReactNode } const useStyles = makeStyles((theme: Theme) => @@ -21,12 +22,12 @@ const useStyles = makeStyles((theme: Theme) => }) ) -const Avatar: FC = ({ +const Avatar = ({ children, primary, className, ...otherProps -}) => { +}: AvatarProps) => { const classes = useStyles() return ( diff --git a/src/core/Badge.tsx b/src/core/Badge.tsx index 77180213..4eba836c 100644 --- a/src/core/Badge.tsx +++ b/src/core/Badge.tsx @@ -1,10 +1,11 @@ import { Badge as MuiBadge } from '@material-ui/core' -import React, { FC } from 'react' +import React from 'react' import { BadgeProps as MuiBadgeProps } from '@material-ui/core/Badge' import { makeStyles } from '@material-ui/core/styles' import type { DefaultProps } from './types' export interface BadgeProps extends DefaultProps, MuiBadgeProps { + children: React.ReactNode max?: number counter: number | string position?: { @@ -25,7 +26,7 @@ const useBadgeStyles = (position: BadgeProps['position']) => { return getStyles() } -const Badge: FC = props => { +const Badge = (props: BadgeProps) => { const { children, counter, diff --git a/src/core/Box.tsx b/src/core/Box.tsx index 65876315..232d8f78 100644 --- a/src/core/Box.tsx +++ b/src/core/Box.tsx @@ -1,19 +1,20 @@ -import React, { FC } from 'react' +import React from 'react' import type { DefaultProps } from './types' import Paper from './Paper' export interface BoxProps extends DefaultProps { minHeight?: number + children: React.ReactNode } -const Box: FC = ({ +const Box = ({ children, margin, padding = 18, style = {}, minHeight = 400, ...otherProps -}) => ( +}: BoxProps) => ( ): void } @@ -25,14 +26,14 @@ const StyledButton = styled(MuiButton)< opacity: ${props => (props.selected ? 0.5 : 1)}; ` -const Button: FC = ({ +const Button = ({ children, margin, padding, style = {}, variant, ...otherProps -}) => ( +}: ButtonProps) => ( = ({ +export const CardActionArea = ({ margin, padding, style, ...otherProps -}) => ( +}: DefaultProps & CardActionAreaProps) => ( {otherProps.children} ) -export const CardActions: FC = ({ +export const CardActions = ({ margin, padding, style, ...otherProps -}) => ( +}: DefaultProps & CardActionsProps) => ( {otherProps.children} ) -export const CardContent: FC = ({ +export const CardContent = ({ margin, padding, style, ...otherProps -}) => ( +}: DefaultProps & CardContentProps) => ( {otherProps.children} ) -export const CardMedia: FC = ({ +export const CardMedia = ({ margin, padding, style, ...otherProps -}) => ( +}: DefaultProps & CardMediaProps) => ( {otherProps.children} ) -export const CardHeader: FC = ({ +export const CardHeader = ({ margin, padding, style, ...otherProps -}) => ( +}: DefaultProps & CardHeaderProps) => ( {otherProps.children} ) -const Card: FC = ({ +const Card = ({ margin, padding, style, ...otherProps -}) => ( +}: DefaultProps & CardProps) => ( {otherProps.children} diff --git a/src/core/Chapter.tsx b/src/core/Chapter.tsx index 8c26ec76..4b0f7046 100644 --- a/src/core/Chapter.tsx +++ b/src/core/Chapter.tsx @@ -1,15 +1,16 @@ -import React, { CSSProperties, FC } from 'react' +import type { TypographyProps } from '@material-ui/core/Typography' +import React, { CSSProperties } from 'react' import styled from 'styled-components' import { background, primary as primaryColor } from '../colors' import { DefaultProps } from './types' import Typography from './Typography' -import type { TypographyProps } from '@material-ui/core/Typography' interface LineProps extends DefaultProps { primary?: boolean width?: string variant?: TypographyProps['variant'] childrenStyle?: CSSProperties + children?: React.ReactNode } const StyledLine = styled.hr` @@ -34,7 +35,7 @@ const Container = styled.div` } ` -const Chapter: FC = ({ +const Chapter = ({ padding, margin, style, @@ -42,7 +43,7 @@ const Chapter: FC = ({ children, variant, ...otherProps -}) => { +}: LineProps) => { const Line = () => ( ) diff --git a/src/core/Chip.tsx b/src/core/Chip.tsx index 1bb151cc..1a938215 100644 --- a/src/core/Chip.tsx +++ b/src/core/Chip.tsx @@ -1,6 +1,6 @@ import { Chip as MuiChip } from '@material-ui/core' import { makeStyles } from '@material-ui/core/styles' -import React, { FC } from 'react' +import React from 'react' import { DefaultProps } from './types' import { ChipProps } from '@material-ui/core/Chip' @@ -17,13 +17,13 @@ const useStyles = makeStyles({ } }) -const Chip: FC = ({ +const Chip = ({ square, padding, margin, style = {}, ...otherProps -}) => { +}: ChipProps & IChipProps) => { const classes = useStyles() return ( diff --git a/src/core/Collapse.tsx b/src/core/Collapse.tsx index c4887869..c08672c6 100644 --- a/src/core/Collapse.tsx +++ b/src/core/Collapse.tsx @@ -1,20 +1,21 @@ import { Collapse as MuiCollapse } from '@material-ui/core' -import React, { FC } from 'react' +import React from 'react' import { DefaultProps } from './types' interface CollapseProps extends DefaultProps { collapsedHeight?: string in: boolean timeout?: number | { enter?: number; exit?: number } | 'auto' + children?: React.ReactNode } -const Collapse: FC = ({ +const Collapse = ({ children, padding, margin, style = {}, ...otherProps -}) => ( +}: CollapseProps) => ( {children} diff --git a/src/core/Container.tsx b/src/core/Container.tsx index 539443af..ab977fe0 100644 --- a/src/core/Container.tsx +++ b/src/core/Container.tsx @@ -1,4 +1,4 @@ -import React, { FC } from 'react' +import React from 'react' import styled from 'styled-components' import { DefaultProps } from './types' @@ -7,13 +7,13 @@ const StyledContainer = styled.div` flex: 1; ` -const Container: FC = ({ +const Container = ({ children, padding, margin, style = {}, ...otherProps -}) => ( +}: DefaultProps) => ( {children} diff --git a/src/core/Content.tsx b/src/core/Content.tsx index 49787c46..13c3bf43 100644 --- a/src/core/Content.tsx +++ b/src/core/Content.tsx @@ -1,4 +1,4 @@ -import React, { FC } from 'react' +import React from 'react' import styled from 'styled-components' import { DefaultProps } from './types' @@ -7,13 +7,13 @@ const StyledContent = styled.main` transition: all 500ms ease; ` -const Content: FC = ({ +const Content = ({ children, padding, margin, style = {}, ...otherProps -}) => ( +}: DefaultProps) => ( {children} diff --git a/src/core/DataTable/DataTable.tsx b/src/core/DataTable/DataTable.tsx index af447842..893408b8 100644 --- a/src/core/DataTable/DataTable.tsx +++ b/src/core/DataTable/DataTable.tsx @@ -31,7 +31,10 @@ import { useRowsState } from './useRowsState' import { StatefulRow, NewRow } from './Rows' import { makeDataTablePaginationActions } from './DataTablePaginationActions' -export type DataTableProps = { +export type DataTableProps< + D extends Data, + V extends StackView = Record +> = { /** * The data to be shown in the table */ diff --git a/src/core/DataTable/DataTableQueryPaginated.tsx b/src/core/DataTable/DataTableQueryPaginated.tsx index 471d3dff..8da96918 100644 --- a/src/core/DataTable/DataTableQueryPaginated.tsx +++ b/src/core/DataTable/DataTableQueryPaginated.tsx @@ -31,7 +31,10 @@ import { useRowsState } from './useRowsState' import { StatefulRow, NewRow } from './Rows' import { makeDataTablePaginationActions } from './DataTablePaginationActions' -export type DataTableProps = { +export type DataTableProps< + D extends Data, + V extends StackView = Record +> = { /** * The data to be shown in the table */ @@ -158,7 +161,7 @@ export const DataTableQueryPaginated = ( } return data - }, [pagination.disabled, data, perPage, page, newRow]) + }, [pagination.disabled, data]) const { getRowState, diff --git a/src/core/DateTime.tsx b/src/core/DateTime.tsx index 4538eed7..b760be0e 100644 --- a/src/core/DateTime.tsx +++ b/src/core/DateTime.tsx @@ -1,4 +1,4 @@ -import React, { FC } from 'react' +import React from 'react' import { KeyboardTimePicker, KeyboardDatePicker, @@ -37,7 +37,7 @@ type DateTimeProps = Omit & IProps & DefaultProps -const DateTime: FC = ({ +const DateTime = ({ padding, margin, style, @@ -51,7 +51,7 @@ const DateTime: FC = ({ locale, type = 'date', ...otherProps -}) => { +}: DateTimeProps) => { const classes = useStyles() const fieldProps = { diff --git a/src/core/Dialog.tsx b/src/core/Dialog.tsx index a8fe6bab..cc743242 100644 --- a/src/core/Dialog.tsx +++ b/src/core/Dialog.tsx @@ -3,7 +3,7 @@ import MuiDialogActions from '@material-ui/core/DialogActions' import MuiDialogContent from '@material-ui/core/DialogContent' import MuiDialogContentText from '@material-ui/core/DialogContentText' import MuiDialogTitle from '@material-ui/core/DialogTitle' -import React, { CSSProperties, ReactNode, FC } from 'react' +import React, { CSSProperties, ReactNode } from 'react' import { DefaultProps } from './types' import { makeStyles } from '@material-ui/core/styles' import styled from 'styled-components' @@ -58,7 +58,7 @@ const useStyles = makeStyles({ } }) -const Dialog: FC = ({ +const Dialog = ({ snippet, style, padding, @@ -83,7 +83,7 @@ const Dialog: FC = ({ title, snippetStyle, snippetContentStyle -}) => { +}: DialogProps) => { const classes = useStyles() const renderTitle = (title: DialogProps['title']) => { diff --git a/src/core/Divider.tsx b/src/core/Divider.tsx index 78341350..755ca2b1 100644 --- a/src/core/Divider.tsx +++ b/src/core/Divider.tsx @@ -1,5 +1,5 @@ import { Divider as MuiDivider } from '@material-ui/core' -import React, { FC } from 'react' +import React from 'react' import { DefaultProps } from './types' interface DividerProps extends DefaultProps { @@ -7,11 +7,13 @@ interface DividerProps extends DefaultProps { light?: boolean } -const Divider: FC = ({ +const Divider = ({ margin, padding, style = {}, ...otherProps -}) => +}: DividerProps) => ( + +) export default Divider diff --git a/src/core/Drawer.tsx b/src/core/Drawer.tsx index 22407ec9..be9f0be3 100644 --- a/src/core/Drawer.tsx +++ b/src/core/Drawer.tsx @@ -1,7 +1,7 @@ import MuiDrawer, { DrawerProps as MuiDrawerProps } from '@material-ui/core/Drawer' -import React, { FC } from 'react' +import React from 'react' import { DefaultProps } from './types' import { makeStyles, createStyles } from '@material-ui/core/styles' @@ -25,7 +25,7 @@ const getStyles = (top?: number, width?: number) => }) ) -const Drawer: FC = props => { +const Drawer = (props: DrawerProps) => { const { style, margin, padding, top = 0, width, ...otherProps } = props const useStyles = getStyles(top, width) const classes = useStyles() diff --git a/src/core/ExpansionPanel.tsx b/src/core/ExpansionPanel.tsx index 69c8635f..8115e727 100644 --- a/src/core/ExpansionPanel.tsx +++ b/src/core/ExpansionPanel.tsx @@ -2,7 +2,7 @@ import MuiExpansionPanel from '@material-ui/core/ExpansionPanel' import MuiExpansionPanelActions from '@material-ui/core/ExpansionPanelActions' import MuiExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails' import MuiExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary' -import React, { ReactNode, FC, MouseEvent } from 'react' +import React, { ReactNode, MouseEvent } from 'react' import styled from 'styled-components' import { PaperProps } from './Paper' import { HelperBox } from './TextField' @@ -21,7 +21,10 @@ interface ExpansionPanelProps extends PaperProps { helperIcon?: React.ReactNode helperButtonPosition?: 'left' | 'right' onHelperClick?: () => void - onChange?: (event?: React.ChangeEvent<{}>, expanded?: boolean) => void + onChange?: ( + event?: React.ChangeEvent>, + expanded?: boolean + ) => void } const ExpansionPanelHeaderWrapper = styled.div` @@ -36,7 +39,7 @@ const ExpansionPanelHeaderWrapper = styled.div` } ` -const ExpansionPanel: FC = ({ +const ExpansionPanel = ({ actions, details, expandIcon, @@ -51,7 +54,7 @@ const ExpansionPanel: FC = ({ helperIcon, helperButtonPosition = 'right', ...otherProps -}) => { +}: ExpansionPanelProps) => { const handleClick = (event: MouseEvent) => { if (onHelperClick) { event.stopPropagation() diff --git a/src/core/Fab.tsx b/src/core/Fab.tsx index c8c40b6d..51fbb208 100644 --- a/src/core/Fab.tsx +++ b/src/core/Fab.tsx @@ -10,7 +10,7 @@ interface FabProps extends DefaultProps { href?: string variant?: 'round' | 'extended' onClick?: (event?: MouseEvent) => void - children: React.ReactElement<{}> + children: React.ReactElement> } const Fab = ({ diff --git a/src/core/Fade.tsx b/src/core/Fade.tsx index 435ea5c4..7dfeaeee 100644 --- a/src/core/Fade.tsx +++ b/src/core/Fade.tsx @@ -5,7 +5,7 @@ import { DefaultProps } from './types' interface FadeProps extends DefaultProps { in: boolean timeout?: number | { enter?: number; exit?: number } - children?: React.ReactElement<{}> + children: React.ReactElement> } const Fade = ({ diff --git a/src/core/Grow.tsx b/src/core/Grow.tsx index 26a95f6d..b304def9 100644 --- a/src/core/Grow.tsx +++ b/src/core/Grow.tsx @@ -5,7 +5,7 @@ import { DefaultProps } from './types' interface GrowProps extends DefaultProps { in: boolean timeout?: number | { enter?: number; exit?: number } | 'auto' - children?: React.ReactElement<{}> + children?: React.ReactElement> } const Grow = ({ diff --git a/src/core/Header.tsx b/src/core/Header.tsx index 8393b876..0d7975fd 100644 --- a/src/core/Header.tsx +++ b/src/core/Header.tsx @@ -1,5 +1,5 @@ import { AppBar, Toolbar } from '@material-ui/core' -import React, { FC } from 'react' +import React from 'react' import { PaperProps } from './Paper' export interface HeaderProps extends PaperProps { @@ -7,14 +7,14 @@ export interface HeaderProps extends PaperProps { color?: 'default' | 'inherit' | 'primary' | 'secondary' } -const Header: FC = ({ +const Header = ({ children, padding, margin, style = {}, elevation = 0, ...otherProps -}) => ( +}: HeaderProps) => ( ): void } -const IconButton: FC = ({ +const IconButton = ({ children, padding, margin, style, ...otherProps -}) => ( +}: IconButtonProps) => ( {children} diff --git a/src/core/InputAdornment.tsx b/src/core/InputAdornment.tsx index dc3c6fa0..88c6dcd1 100644 --- a/src/core/InputAdornment.tsx +++ b/src/core/InputAdornment.tsx @@ -1,14 +1,13 @@ import { InputAdornment as MuiInputAdornment } from '@material-ui/core' -import React, { FC } from 'react' +import React from 'react' import { DefaultProps } from './types' export interface InputAdornmentProps extends DefaultProps { position: 'start' | 'end' } -const InputAdornment: FC = ({ - children, - ...otherProps -}) => {children} +const InputAdornment = ({ children, ...otherProps }: InputAdornmentProps) => ( + {children} +) export default InputAdornment diff --git a/src/core/InputBase.tsx b/src/core/InputBase.tsx index fea99cc2..968ac1af 100644 --- a/src/core/InputBase.tsx +++ b/src/core/InputBase.tsx @@ -1,5 +1,5 @@ import { InputBase as MuiInputBase } from '@material-ui/core' -import React, { ChangeEvent, ReactNode, FC } from 'react' +import React, { ChangeEvent, ReactNode } from 'react' import { DefaultProps } from './types' export interface InputAdornmentProps extends DefaultProps { @@ -25,13 +25,13 @@ export interface InputAdornmentProps extends DefaultProps { value?: string | number | boolean } -const InputAdornment: FC = ({ +const InputAdornment = ({ margin, padding, style = {}, autoComplete = 'off', ...otherProps -}) => ( +}: InputAdornmentProps) => ( ` ${props => (props.primary ? primaryColor.normal : background.normal)}; ` -const Line: FC = ({ padding, margin, style, ...otherProps }) => ( +const Line = ({ padding, margin, style, ...otherProps }: LineProps) => ( ) diff --git a/src/core/List.tsx b/src/core/List.tsx index f10ecc1d..03494bf9 100644 --- a/src/core/List.tsx +++ b/src/core/List.tsx @@ -4,7 +4,7 @@ import { } from '@material-ui/core' import { makeStyles, createStyles } from '@material-ui/core/styles' import { Theme } from '@material-ui/core/styles/createMuiTheme' -import React, { FC } from 'react' +import React from 'react' import { DefaultProps } from './types' interface ListProps extends DefaultProps { @@ -34,7 +34,7 @@ const useStyles = makeStyles((theme: Theme) => }) ) -const List: FC = ({ +const List = ({ title, padding, margin, @@ -43,7 +43,7 @@ const List: FC = ({ className, color = 'default', ...otherProps -}) => { +}: ListProps) => { const classes = useStyles() return ( diff --git a/src/core/ListItem.tsx b/src/core/ListItem.tsx index a5562a7d..2b998ccf 100644 --- a/src/core/ListItem.tsx +++ b/src/core/ListItem.tsx @@ -8,7 +8,7 @@ import { Theme } from '@material-ui/core' import { makeStyles } from '@material-ui/core/styles' -import React, { Fragment, MouseEvent, FC } from 'react' +import React, { Fragment, MouseEvent } from 'react' import { DefaultProps } from './types' import { Omit } from 'ramda' @@ -37,7 +37,7 @@ const useStyles = makeStyles((theme: Theme) => ({ } })) -const ListItem: FC = props => { +const ListItem = (props: ListItemProps) => { const { padding, margin, style } = props const classes = useStyles() const className = props.className diff --git a/src/core/MaskField.tsx b/src/core/MaskField.tsx index c8de4cea..de3c1938 100644 --- a/src/core/MaskField.tsx +++ b/src/core/MaskField.tsx @@ -1,4 +1,4 @@ -import React, { Component } from 'react' +import React from 'react' import TextField, { TextFieldProps } from './TextField' import NumberFormat from 'react-number-format' @@ -13,19 +13,17 @@ export interface MaskFieldProps { customInput?: React.ComponentType } -class MaskField extends Component { - public render() { - const { customInput, ...otherProps } = this.props +const MaskField = (props: TextFieldProps & MaskFieldProps) => { + const { customInput, ...otherProps } = props - return ( - // Although react-number-format allow use of additional props, - // shows problem with some props like have been do this - // actually on flipper-ui. (e.g. errors treatment) - - ) - } + return ( + // Although react-number-format allow use of additional props, + // shows problem with some props like have been do this + // actually on flipper-ui. (e.g. errors treatment) + + ) } export default MaskField diff --git a/src/core/Menu.tsx b/src/core/Menu.tsx index 7150fce4..77a5120e 100644 --- a/src/core/Menu.tsx +++ b/src/core/Menu.tsx @@ -1,5 +1,5 @@ import { Menu as MuiMenu } from '@material-ui/core' -import React, { FC } from 'react' +import React from 'react' import { DefaultProps } from './types' import { MenuProps as MuiMenuProps } from '@material-ui/core/Menu' @@ -9,14 +9,14 @@ interface MenuProps extends DefaultProps, MuiMenuProps { withWrapper?: boolean } -const Menu: FC = ({ +const Menu = ({ children, padding, margin, style = {}, withWrapper, ...otherProps -}) => ( +}: MenuProps) => ( {withWrapper ?
{children}
: children} diff --git a/src/core/Node.tsx b/src/core/Node.tsx index 3384e537..f6442d7d 100644 --- a/src/core/Node.tsx +++ b/src/core/Node.tsx @@ -1,5 +1,4 @@ -import { evolve, not } from 'ramda' -import React, { Component } from 'react' +import React from 'react' import styled from 'styled-components' import { background, primary, transparent } from '../colors' import { @@ -12,10 +11,6 @@ interface NodeProps extends DefaultProps { name: string } -interface IState { - open: boolean -} - interface IListItem { inset: boolean } @@ -50,40 +45,31 @@ const Li = styled.li` } ` -class Node extends Component { - constructor(props: NodeProps) { - super(props) - this.state = { open: false } - } +const Node = (props: NodeProps) => { + const [open, setOpen] = React.useState(false) + const { id, name, children, style = {}, className } = props - public handleToggleOpen() { - this.setState(evolve({ open: not })) + const handleToggleOpen = () => { + setOpen(!open) } - public renderDropdownIcon() { - return this.state.open ? ( + const renderDropdownIcon = () => { + return open ? ( ) : ( ) } - public render() { - const { open } = this.state - const { id, name, children, style = {}, className } = this.props - - return ( -
    -
  • - {children && this.renderDropdownIcon()} - {name} -
    • - {open && children} -
- ) - } + return ( +
    +
  • + {children && renderDropdownIcon()} + {name} +
    • + {open && children} +
+ ) } export default Node diff --git a/src/core/Pagination.tsx b/src/core/Pagination.tsx index e4a2787b..9f412dfa 100644 --- a/src/core/Pagination.tsx +++ b/src/core/Pagination.tsx @@ -1,5 +1,5 @@ import { inc, times } from 'ramda' -import React, { Component } from 'react' +import React from 'react' import styled from 'styled-components' import { KeyboardArrowLeft as IconArrowLeft, @@ -24,47 +24,33 @@ const Content = styled.div` margin: 0.75em; ` -class Pagination extends Component { - public render() { - const { - active, - style, - padding, - margin, - pages = 1, - className - } = this.props - const allPages = times(inc, pages || 1) +const Pagination = (props: PaginationProps) => { + const { active, style, padding, margin, pages = 1, className } = props + const allPages = times(inc, pages || 1) - return ( - + return ( + + + {allPages.map(page => ( - {allPages.map(page => ( - - ))} - - - ) - } + ))} + + + ) } export default Pagination diff --git a/src/core/Paper.tsx b/src/core/Paper.tsx index 62a34d17..54c9cac0 100644 --- a/src/core/Paper.tsx +++ b/src/core/Paper.tsx @@ -1,5 +1,5 @@ import { Paper as MuiPaper } from '@material-ui/core' -import React, { FC } from 'react' +import React from 'react' import type { DefaultProps } from './types' export interface PaperProps extends DefaultProps { @@ -7,13 +7,13 @@ export interface PaperProps extends DefaultProps { elevation?: number } -const Paper: FC = ({ +const Paper = ({ children, style = {}, padding, margin, ...otherProps -}) => ( +}: PaperProps) => ( {children} diff --git a/src/core/PinInput.tsx b/src/core/PinInput.tsx index cc8905e4..a9bbfb5f 100644 --- a/src/core/PinInput.tsx +++ b/src/core/PinInput.tsx @@ -1,5 +1,5 @@ -import React, { useEffect, useRef } from 'react' import { TextField } from '@material-ui/core' +import React, { useEffect, useRef } from 'react' import styled from 'styled-components' interface PinInputGridProps { @@ -33,7 +33,7 @@ const PIN_MIN_VALUE = 0 const PIN_MAX_VALUE = 9 const BACKSPACE_KEY = 'Backspace' -const PinInput: React.FC = ({ +const PinInput = ({ pinLength, pin, setPin, @@ -44,7 +44,7 @@ const PinInput: React.FC = ({ style: styleProps, inputProps, variant -}) => { +}: PinInputGridProps) => { const inputRefs = useRef([]) const changePinFocus = (pinIndex: number) => { diff --git a/src/core/Progress.tsx b/src/core/Progress.tsx index 13384592..edc4c99a 100644 --- a/src/core/Progress.tsx +++ b/src/core/Progress.tsx @@ -2,7 +2,7 @@ import { CircularProgress as MuiCircularProgress, LinearProgress as MuiLinearProgress } from '@material-ui/core' -import React, { FC } from 'react' +import React from 'react' import { DefaultProps } from './types' interface ILinear { @@ -28,13 +28,13 @@ interface ProgressProps extends DefaultProps { linear?: boolean } -const Progress: FC = ({ +const Progress = ({ linear, style = {}, margin, padding, ...otherProps -}) => +}: ProgressProps & ICircular & ILinear) => linear ? ( ) => void } -const Radio: FC = ({ padding, margin, style, ...otherProps }) => ( +const Radio = ({ padding, margin, style, ...otherProps }: RadioProps) => ( ) diff --git a/src/core/RadioGroup.tsx b/src/core/RadioGroup.tsx index 6af697e5..4f54a3d3 100644 --- a/src/core/RadioGroup.tsx +++ b/src/core/RadioGroup.tsx @@ -5,7 +5,7 @@ import { Radio, RadioGroup as MuiRadioGroup } from '@material-ui/core' -import React, { ChangeEvent, FC, ReactNode } from 'react' +import React, { ChangeEvent, ReactNode } from 'react' import { DefaultProps } from './types' interface RadioGroupProps extends DefaultProps { @@ -25,7 +25,7 @@ interface IOption { disabled?: boolean } -const RadioGroup: FC = ({ +const RadioGroup = ({ row, options = [], className, @@ -38,7 +38,7 @@ const RadioGroup: FC = ({ name, onChange, ...otherProps -}) => ( +}: RadioGroupProps) => ( void onClose?: () => void onChange?: ( @@ -33,7 +34,7 @@ const renderEndAdornment = (onClear?: () => void) => ( ) -const Select: FC = ({ +const Select = ({ children, style = {}, margin, @@ -42,7 +43,7 @@ const Select: FC = ({ onClear, variant = 'outlined', ...otherProps -}) => { +}: SelectProps) => { const useStyles = makeStyles(() => ({ root: { padding: `10px 24px 10px ${hasClear ? '20' : '12'}px` diff --git a/src/core/Sidebar.tsx b/src/core/Sidebar.tsx index 5c2601f1..85e355ab 100644 --- a/src/core/Sidebar.tsx +++ b/src/core/Sidebar.tsx @@ -1,7 +1,7 @@ import Drawer from '@material-ui/core/Drawer' import { makeStyles, createStyles } from '@material-ui/core/styles' import { Theme } from '@material-ui/core/styles/createMuiTheme' -import React, { FC } from 'react' +import React from 'react' import styled from 'styled-components' import { KeyboardArrowLeft as IconArrowLeft, @@ -81,7 +81,7 @@ const Action = styled.div` padding: 4px; ` -const Sidebar: FC = ({ +const Sidebar = ({ id, anchor = 'left', className, @@ -102,7 +102,7 @@ const Sidebar: FC = ({ onToggle, children, name -}) => { +}: SidebarProps) => { const classes = useStyles() const renderAction = () => { diff --git a/src/core/Slider.tsx b/src/core/Slider.tsx index 89de9088..00798ef3 100644 --- a/src/core/Slider.tsx +++ b/src/core/Slider.tsx @@ -1,4 +1,4 @@ -import React, { FC } from 'react' +import React from 'react' import MuiSlider, { SliderProps } from '@material-ui/core/Slider' import { DefaultProps } from './types' @@ -10,13 +10,13 @@ export type FlipperSliderProps = Omit & DefaultProps & ISliderProps -const Slider: FC = ({ +const Slider = ({ padding, margin, style = {}, defaultValue, ...otherProps -}) => ( +}: FlipperSliderProps) => ( }) ) -const SnackBar: FC = props => { +const SnackBar = (props: SnackBarProps) => { const { id, action, diff --git a/src/core/Stepper.tsx b/src/core/Stepper.tsx index 3d6baa98..46bf2499 100644 --- a/src/core/Stepper.tsx +++ b/src/core/Stepper.tsx @@ -1,5 +1,5 @@ import { Step, StepLabel, Stepper as MuiStepper } from '@material-ui/core' -import React, { Component } from 'react' +import React from 'react' import { DefaultProps } from './types' export interface StepperProps extends DefaultProps { @@ -17,48 +17,40 @@ type TStep = { const isActive = (index: number, active: StepperProps['active']) => active !== undefined ? active >= index : undefined -class Stepper extends Component { - public static defaultProps = { active: 0 } - - public render() { - const { - active, - bottomLabel, - steps, - padding, - margin, - style = {}, - ...otherProps - } = this.props - - return ( - - {steps.map((step, index) => ( - - - {typeof step === 'object' ? step.label : step} - - - ))} - - ) - } -} +const Stepper = ({ + active, + bottomLabel, + steps, + padding, + margin, + style = {}, + ...otherProps +}: StepperProps) => ( + + {steps.map((step, index) => ( + + + {typeof step === 'object' ? step.label : step} + + + ))} + +) export default Stepper diff --git a/src/core/Tab.tsx b/src/core/Tab.tsx index 9d46053c..0cddb573 100644 --- a/src/core/Tab.tsx +++ b/src/core/Tab.tsx @@ -1,5 +1,5 @@ import { Tab as MuiTab } from '@material-ui/core' -import React, { Component } from 'react' +import React from 'react' import { DefaultProps } from './types' interface TabProps extends DefaultProps { @@ -10,24 +10,18 @@ interface TabProps extends DefaultProps { disableRipple?: boolean } -class Tab extends Component { - public static defaultProps = { - disabled: false, - margin: '0 4px' - } - - public render() { - const { style, margin, disableRipple, padding, ...otherProps } = - this.props - - return ( - - ) - } -} +const Tab = ({ + style, + margin, + disableRipple, + padding, + ...otherProps +}: TabProps) => ( + +) export default Tab diff --git a/src/core/Table.tsx b/src/core/Table.tsx index 77bc5e95..4a8ec858 100644 --- a/src/core/Table.tsx +++ b/src/core/Table.tsx @@ -1,5 +1,5 @@ import MuiTable, { TableProps as MuiTableProps } from '@material-ui/core/Table' -import React, { FC } from 'react' +import React from 'react' import { DefaultProps } from './types' import { silver } from '../colors' @@ -7,14 +7,14 @@ interface TableProps extends DefaultProps { spacing?: MuiTableProps['padding'] } -const Table: FC = ({ +const Table = ({ style, margin, padding, spacing, children, ...otherProps -}) => ( +}: MuiTableProps & TableProps) => ( = ({ +const TableBody = ({ style, margin, padding, children, ...otherProps -}) => ( +}: DefaultProps) => ( {children} diff --git a/src/core/TableCell.tsx b/src/core/TableCell.tsx index 30fc639b..ece573f2 100644 --- a/src/core/TableCell.tsx +++ b/src/core/TableCell.tsx @@ -2,7 +2,7 @@ import MuiTableCell, { TableCellProps as MuiTableCellProps } from '@material-ui/core/TableCell' import MuiTableSortLabel from '@material-ui/core/TableSortLabel' -import React, { FC, useContext } from 'react' +import React, { useContext } from 'react' import { DefaultProps } from './types' import { Omit } from 'ramda' import { SortContext } from './TableHead' @@ -15,14 +15,14 @@ interface TableCellProps extends DefaultProps { align?: 'inherit' | 'left' | 'center' | 'right' | 'justify' } -const TableCell: FC & TableCellProps> = ({ +const TableCell = ({ style, margin, padding, children, spacing, ...otherProps -}) => { +}: Omit & TableCellProps) => { const { onSort, active, direction } = useContext(SortContext) const handleSort = () => { diff --git a/src/core/TableHead.tsx b/src/core/TableHead.tsx index af84198c..df335880 100644 --- a/src/core/TableHead.tsx +++ b/src/core/TableHead.tsx @@ -1,6 +1,6 @@ import { withStyles } from '@material-ui/core/styles' import MuiTableHead from '@material-ui/core/TableHead' -import React, { FC, createContext } from 'react' +import React, { createContext } from 'react' import { DefaultProps } from './types' interface TableHeadProps extends DefaultProps, ISort { @@ -51,7 +51,7 @@ export const SortContext = createContext({ onSort: undefined }) -const TableHead: FC = ({ +const TableHead = ({ style, margin, padding, @@ -62,7 +62,7 @@ const TableHead: FC = ({ direction, onSort, ...otherProps -}) => ( +}: TableHeadProps) => ( ) => void } -const TableRow: FC = ({ +const TableRow = ({ style, margin, padding, children, background, ...otherProps -}) => ( +}: MuiTableRowProps & TableRowProps) => ( = ({ +const Tabs = ({ children, centered = true, padding = '6px 0 0', @@ -31,7 +31,7 @@ const Tabs: FC = ({ variant = 'standard', indicatorColor = 'primary', ...otherProps -}) => { +}: TabsProps & IClasses) => { return ( void) => ( ) -const TextField: FC = ({ +const TextField = ({ margin, padding, style = {}, @@ -137,7 +136,7 @@ const TextField: FC = ({ hasClear, onClear, ...otherProps -}) => { +}: TextFieldProps) => { const clearStyle = makeStyles({ iconOutlined: { position: 'relative', diff --git a/src/core/ThemeProvider.tsx b/src/core/ThemeProvider.tsx index 439f294f..01648988 100644 --- a/src/core/ThemeProvider.tsx +++ b/src/core/ThemeProvider.tsx @@ -1,12 +1,13 @@ import { createMuiTheme, MuiThemeProvider } from '@material-ui/core/styles' -import React, { FC } from 'react' +import React from 'react' import { ThemeOptions } from '@material-ui/core/styles/createMuiTheme' interface ThemeProviderProps { options?: ThemeOptions + children: React.ReactNode } -const ThemeProvider: FC = ({ options = {}, children }) => ( +const ThemeProvider = ({ options = {}, children }: ThemeProviderProps) => ( {children} diff --git a/src/core/Tree.tsx b/src/core/Tree.tsx index 23cab1e0..2f78ccc6 100644 --- a/src/core/Tree.tsx +++ b/src/core/Tree.tsx @@ -1,4 +1,4 @@ -import React, { Component } from 'react' +import React from 'react' import Node from './Node' export interface INode { @@ -11,8 +11,31 @@ interface TreeProps { nodes?: INode[] } -class Tree extends Component { - public renderNode(node: INode, index: string, root = false) { +// class Tree extends Component { +// public renderNode(node: INode, index: string, root = false) { +// const { id, name, nodes } = node + +// return ( +// +// {nodes && nodes.map(this.renderNode.bind(this))} +// +// ) +// } + +// public render() { +// return (this.props.nodes || []).map((node, index) => +// this.renderNode(node, index.toString(), true) +// ) +// } +// } + +// convert to a functional component +const Tree = ({ nodes = [] }: TreeProps) => { + const renderNode = (node: INode, index: string, root = false) => { const { id, name, nodes } = node return ( @@ -21,16 +44,15 @@ class Tree extends Component { name={name} key={id || index} style={root ? { padding: 0 } : {}}> - {nodes && nodes.map(this.renderNode.bind(this))} + {nodes && + nodes.map(node => { + renderNode(node, index.toString()) + })} ) } - public render() { - return (this.props.nodes || []).map((node, index) => - this.renderNode(node, index.toString(), true) - ) - } + return nodes.map((node, index) => renderNode(node, index.toString(), true)) } export default Tree diff --git a/src/core/Typography.tsx b/src/core/Typography.tsx index f2f8bf60..a0c384bb 100644 --- a/src/core/Typography.tsx +++ b/src/core/Typography.tsx @@ -1,15 +1,15 @@ -import React, { FC } from 'react' +import React from 'react' import { DefaultProps } from './types' import MuiTypography, { TypographyProps } from '@material-ui/core/Typography' -const Typography: FC = ({ +const Typography = ({ children, margin, padding, style = {}, variant = 'body2', ...otherProps -}) => ( +}: TypographyProps & DefaultProps) => ( Date: Mon, 12 Dec 2022 18:13:43 -0300 Subject: [PATCH 2/2] chore: fix some tests and upgrade react to v18 --- cypress/integration/Tooltip.feature | 2 +- cypress/integration/common/When.cy.tsx | 8 ++--- cypress/support/factories/tooltip.tsx | 12 +++++-- package.json | 6 ++-- src/core/Tree.tsx | 46 ++++++++++--------------- yarn.lock | 47 +++++++++++++------------- 6 files changed, 59 insertions(+), 62 deletions(-) diff --git a/cypress/integration/Tooltip.feature b/cypress/integration/Tooltip.feature index 85d9632b..7e5b9c65 100644 --- a/cypress/integration/Tooltip.feature +++ b/cypress/integration/Tooltip.feature @@ -9,5 +9,5 @@ Feature: Tooltip Then I should see 'Tooltip' And I expect 'tooltip-onopen' spy to have been called 1 times - When I exit 1th button + When I exit focus Then I expect 'tooltip-onclose' spy to have been called 1 times diff --git a/cypress/integration/common/When.cy.tsx b/cypress/integration/common/When.cy.tsx index 5342db98..71d25055 100644 --- a/cypress/integration/common/When.cy.tsx +++ b/cypress/integration/common/When.cy.tsx @@ -243,8 +243,8 @@ When('I focus {int}th button', (pos: number) => { .focus() }) -When('I exit {int}th button', (pos: number) => { - cy.get('button') - .eq(pos - 1) - .trigger('blur') +When('I exit focus', () => { + cy.get('[data-testid="testing-outside-click"]') + .first() + .click(-1050, -1000, { force: true }) }) diff --git a/cypress/support/factories/tooltip.tsx b/cypress/support/factories/tooltip.tsx index fac034bc..0fcc9745 100644 --- a/cypress/support/factories/tooltip.tsx +++ b/cypress/support/factories/tooltip.tsx @@ -10,9 +10,15 @@ interface IProps { const Component: React.FC = props => { return ( - - - + <> + + + +
+ ) } diff --git a/package.json b/package.json index 4aeba137..b5d89edd 100644 --- a/package.json +++ b/package.json @@ -66,7 +66,7 @@ "@types/jest": "24.0.22", "@types/node": "10.9.4", "@types/ramda": "0.25.36", - "@types/react": "16.8.18", + "@types/react": "18.0.26", "@types/react-router": "5.1.2", "@types/react-router-dom": "5.1.2", "@types/styled-components": "4.4.2", @@ -98,8 +98,8 @@ "node-fetch": "2.6.1", "node-polyfill-webpack-plugin": "2.0.1", "prettier": "2.8.0", - "react": "16.14.0", - "react-dom": "16.14.0", + "react": "18.2.0", + "react-dom": "18.2.0", "react-router": "5.1.2", "react-router-dom": "5.1.2", "styled-components": "5.0.0", diff --git a/src/core/Tree.tsx b/src/core/Tree.tsx index 2f78ccc6..5a62b81c 100644 --- a/src/core/Tree.tsx +++ b/src/core/Tree.tsx @@ -1,3 +1,4 @@ +import { omit } from 'ramda' import React from 'react' import Node from './Node' @@ -10,32 +11,12 @@ export interface INode { interface TreeProps { nodes?: INode[] } - -// class Tree extends Component { -// public renderNode(node: INode, index: string, root = false) { -// const { id, name, nodes } = node - -// return ( -// -// {nodes && nodes.map(this.renderNode.bind(this))} -// -// ) -// } - -// public render() { -// return (this.props.nodes || []).map((node, index) => -// this.renderNode(node, index.toString(), true) -// ) -// } -// } - -// convert to a functional component -const Tree = ({ nodes = [] }: TreeProps) => { - const renderNode = (node: INode, index: string, root = false) => { +const Tree = ({ nodes = [] }: TreeProps): JSX.Element => { + const renderNode = ( + node: INode, + index: string, + root = false + ): React.ReactNode => { const { id, name, nodes } = node return ( @@ -46,13 +27,22 @@ const Tree = ({ nodes = [] }: TreeProps) => { style={root ? { padding: 0 } : {}}> {nodes && nodes.map(node => { - renderNode(node, index.toString()) + return renderNode( + omit(['array'], node), + index.toString() + ) })} ) } - return nodes.map((node, index) => renderNode(node, index.toString(), true)) + return ( + + {nodes.map((node, index) => + renderNode(node, index.toString(), true) + )} + + ) } export default Tree diff --git a/yarn.lock b/yarn.lock index 3e0621f0..baf7300c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4324,13 +4324,19 @@ "@types/prop-types" "*" csstype "^3.0.2" -"@types/react@16.8.18": - version "16.8.18" - resolved "https://registry.npmjs.org/@types/react/-/react-16.8.18.tgz#fe66fb748b0b6ca9709d38b87b2d1356d960a511" - integrity sha512-lUXdKzRqWR4FebR5tGHkLCqnvQJS4fdXKCBrNGGbglqZg2gpU+J82pMONevQODUotATs9fc9k66bx3/St8vReg== +"@types/react@18.0.26": + version "18.0.26" + resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.26.tgz#8ad59fc01fef8eaf5c74f4ea392621749f0b7917" + integrity sha512-hCR3PJQsAIXyxhTNSiDFY//LhnMZWpNNr5etoCqx/iUfGc5gXWtQR2Phl908jVR6uPXacojQWTg4qRpkxTuGug== dependencies: "@types/prop-types" "*" - csstype "^2.2.0" + "@types/scheduler" "*" + csstype "^3.0.2" + +"@types/scheduler@*": + version "0.16.2" + resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.2.tgz#1a62f89525723dde24ba1b01b092bf5df8ad4d39" + integrity sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew== "@types/semver@^7.3.12": version "7.3.13" @@ -14113,15 +14119,13 @@ react-docgen@^5.0.0: node-dir "^0.1.10" strip-indent "^3.0.0" -react-dom@16.14.0: - version "16.14.0" - resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.14.0.tgz#7ad838ec29a777fb3c75c3a190f661cf92ab8b89" - integrity sha512-1gCeQXDLoIqMgqD3IO2Ah9bnf0w9kzhwN5q4FGnHZ67hBm9yePzB5JJAIQCc8x3pFnNlwFq4RidZggNAAkzWWw== +react-dom@18.2.0: + version "18.2.0" + resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.2.0.tgz#22aaf38708db2674ed9ada224ca4aa708d821e3d" + integrity sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g== dependencies: loose-envify "^1.1.0" - object-assign "^4.1.1" - prop-types "^15.6.2" - scheduler "^0.19.1" + scheduler "^0.23.0" react-double-scrollbar@0.0.15: version "0.0.15" @@ -14224,14 +14228,12 @@ react-transition-group@^4.0.0, react-transition-group@^4.4.0: loose-envify "^1.4.0" prop-types "^15.6.2" -react@16.14.0: - version "16.14.0" - resolved "https://registry.yarnpkg.com/react/-/react-16.14.0.tgz#94d776ddd0aaa37da3eda8fc5b6b18a4c9a3114d" - integrity sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g== +react@18.2.0: + version "18.2.0" + resolved "https://registry.yarnpkg.com/react/-/react-18.2.0.tgz#555bd98592883255fa00de14f1151a917b5d77d5" + integrity sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ== dependencies: loose-envify "^1.1.0" - object-assign "^4.1.1" - prop-types "^15.6.2" read-only-stream@^2.0.0: version "2.0.0" @@ -14909,13 +14911,12 @@ sax@^1.2.4: resolved "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9" integrity sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw== -scheduler@^0.19.1: - version "0.19.1" - resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.19.1.tgz#4f3e2ed2c1a7d65681f4c854fa8c5a1ccb40f196" - integrity sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA== +scheduler@^0.23.0: + version "0.23.0" + resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.23.0.tgz#ba8041afc3d30eb206a487b6b384002e4e61fdfe" + integrity sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw== dependencies: loose-envify "^1.1.0" - object-assign "^4.1.1" schema-utils@2.7.0: version "2.7.0"