From 4c47220d7d9cededb949e36e2bd4fb7bab026cff Mon Sep 17 00:00:00 2001 From: Karine Brandelli Padilha Date: Fri, 16 Feb 2024 14:25:40 -0300 Subject: [PATCH 01/10] chore: initial refact --- src/core/data-display/chapter/index.tsx | 40 +--- src/core/data-display/chapter/styles.ts | 26 +++ .../data-table/data-table-field.tsx | 66 ++---- .../data-table-pagination-actions.tsx | 7 +- .../data-table-query-paginated.stories.tsx | 38 ++- .../data-table/data-table-query-paginated.tsx | 9 +- .../data-table/data-table.spec.tsx | 2 + .../data-table/data-table.stories.tsx | 12 +- .../data-display/data-table/data-table.tsx | 1 - src/core/data-display/data-table/index.ts | 10 +- src/core/data-display/data-table/rows.tsx | 3 +- src/core/data-display/data-table/styles.ts | 44 ++++ .../data-display/data-table/use-paginated.ts | 2 - .../editable-table-with-date.spec.tsx | 2 +- .../editable-table/editable-table.spec.tsx | 1 - ...stories.tsx => editable-table.stories.tsx} | 6 +- .../data-display/editable-table/index.tsx | 99 ++------ .../data-display/editable-table/styles.ts | 63 +++++ .../feedback/collapse/collapse.stories.tsx | 7 +- src/core/feedback/dialog/index.tsx | 49 ++-- src/core/feedback/dialog/styles.ts | 23 ++ src/core/feedback/fade/fade.stories.tsx | 7 +- src/core/feedback/grow/grow.stories.tsx | 7 +- src/core/feedback/slide/slide.stories.tsx | 7 +- .../validation-dialog.spec.tsx | 178 +++++++------- .../validaton-dialog.stories.tsx | 38 +-- src/core/feedback/zoom/zooms.stories.tsx | 7 +- .../auto-complete/auto-complete.spec.tsx | 1 - .../auto-complete/auto-complete.stories.tsx | 39 ++-- src/core/inputs/checkbox/index.tsx | 9 +- src/core/inputs/checkbox/styles.ts | 16 ++ src/core/inputs/date-time/index.tsx | 1 - .../inputs/mask-field/mask-field.stories.tsx | 2 +- src/core/inputs/pin-input/index.tsx | 6 +- .../radio-group/radio-group.stories.tsx | 22 +- src/core/inputs/text-field/index.tsx | 28 +-- src/core/inputs/text-field/styles.ts | 28 +++ .../inputs/text-field/text-field.stories.tsx | 13 +- src/core/surfaces/expansion-panel/index.tsx | 14 +- src/core/surfaces/expansion-panel/styles.ts | 13 ++ .../surfaces/step-card/step-card-details.tsx | 51 ++-- .../surfaces/step-card/step-card-panel.tsx | 217 +++++++----------- .../surfaces/step-card/step-card-skeleton.tsx | 53 +++-- src/core/surfaces/step-card/styles.ts | 86 ++++++- src/experimental/breadcrumbs/index.tsx | 19 +- src/experimental/breadcrumbs/styles.ts | 17 ++ src/experimental/nothing-found/index.tsx | 7 +- src/experimental/nothing-found/styles.ts | 8 + src/experimental/sidebar/index.tsx | 55 ++--- src/experimental/sidebar/sidebar.spec.tsx | 30 +-- src/experimental/sidebar/styles.ts | 36 +++ src/index.ts | 2 +- src/lib/localization.ts | 7 +- src/test/mocks/data-table-hidden-mock.tsx | 2 +- src/test/mocks/snackbar-mock.tsx | 37 ++- 55 files changed, 856 insertions(+), 717 deletions(-) create mode 100644 src/core/data-display/chapter/styles.ts create mode 100644 src/core/data-display/data-table/styles.ts rename src/core/data-display/editable-table/{editTable.stories.tsx => editable-table.stories.tsx} (93%) create mode 100644 src/core/data-display/editable-table/styles.ts create mode 100644 src/core/feedback/dialog/styles.ts create mode 100644 src/core/inputs/checkbox/styles.ts create mode 100644 src/core/inputs/text-field/styles.ts create mode 100644 src/core/surfaces/expansion-panel/styles.ts create mode 100644 src/experimental/breadcrumbs/styles.ts create mode 100644 src/experimental/nothing-found/styles.ts create mode 100644 src/experimental/sidebar/styles.ts diff --git a/src/core/data-display/chapter/index.tsx b/src/core/data-display/chapter/index.tsx index 21e793df..fe2c71b8 100644 --- a/src/core/data-display/chapter/index.tsx +++ b/src/core/data-display/chapter/index.tsx @@ -1,12 +1,9 @@ import React from 'react' import type { CSSProperties, ReactNode } from 'react' -import { default as styled } from 'styled-components' import type { DefaultProps } from '../../types' import type { TypographyProps } from '@material-ui/core/Typography' import { Typography } from '@/core/data-display/typography' -import { theme } from '@/theme' - -const { grays } = theme.colors +import { Container, StyledLine } from './styles' export interface LineProps extends DefaultProps { /** @@ -32,27 +29,6 @@ export interface LineProps extends DefaultProps { 'data-testid'?: string } -const StyledLine = styled.div` - height: 1px; - flex: 1; - min-height: 0.75px; - max-height: 3px; - align-self: center; - background-color: ${props => (props.primary ? grays.g4 : grays.g6)}; -` - -const Container = styled.div` - display: flex; - - & div:first-child { - margin-right: 10px; - } - - & div:last-child { - margin-left: 10px; - } -` - export const Chapter = ({ padding, margin, @@ -63,17 +39,19 @@ export const Chapter = ({ primary, ...otherProps }: LineProps) => { - const Line = (props: LineProps) => ( - - ) - return ( - + {children} - + ) } diff --git a/src/core/data-display/chapter/styles.ts b/src/core/data-display/chapter/styles.ts new file mode 100644 index 00000000..3957ce8b --- /dev/null +++ b/src/core/data-display/chapter/styles.ts @@ -0,0 +1,26 @@ +import { default as styled } from 'styled-components' +import type { LineProps } from '.' +import { theme } from '@/theme' + +const { grays } = theme.colors + +export const StyledLine = styled.div` + height: 1px; + flex: 1; + min-height: 0.75px; + max-height: 3px; + align-self: center; + background-color: ${props => (props.primary ? grays.g4 : grays.g6)}; +` + +export const Container = styled.div` + display: flex; + + & div:first-child { + margin-right: 10px; + } + + & div:last-child { + margin-left: 10px; + } +` diff --git a/src/core/data-display/data-table/data-table-field.tsx b/src/core/data-display/data-table/data-table-field.tsx index eafe6758..970a9ac9 100644 --- a/src/core/data-display/data-table/data-table-field.tsx +++ b/src/core/data-display/data-table/data-table-field.tsx @@ -1,16 +1,9 @@ // eslint-disable-next-line @typescript-eslint/consistent-type-imports import React from 'react' import type { ChangeEvent, Dispatch, SetStateAction } from 'react' -import { - Checkbox, - Table, - TableBody, - TableCell, - TableHead, - TableRow -} from '@mui/material' -import { default as styled } from 'styled-components' +import { Checkbox, Table, TableBody, TableCell, TableHead } from '@mui/material' import { TextField } from '@/index' +import { FieldWrapper, RowTable, TableCellRows } from './styles' interface IHeader { title: string @@ -32,41 +25,6 @@ interface ITable> { } } -const TableCellRows = styled(TableCell)` - && { - width: 400px; - height: 60px; - padding: 0 10px; - } -` - -const RowTable = styled(TableRow)` - width: 100%; - cursor: pointer; - - &:hover { - background: -moz-linear-gradient( - left, - rgba(189, 189, 189, 0) 0%, - rgba(189, 189, 189, 1) 100% - ); - background: -webkit-linear-gradient( - left, - rgba(189, 189, 189, 0) 0%, - rgba(189, 189, 189, 1) 100% - ); - background: linear-gradient( - to right, - rgba(189, 189, 189, 0) 0%, - rgba(189, 189, 189, 1) 100% - ); - } - - &.no-hover { - background: none; - } -` - export const DataTableField = >( props: ITable ) => { @@ -187,13 +145,19 @@ export const DataTableField = >( } /> ) : ( - - {column.editable - ? checkboxProps?.checkRow?.[index] - ? (row[column.field] as string) - : '' - : (row[column.field] as string)} - + + {(() => { + if (column.editable) { + return checkboxProps?.checkRow?.[ + index + ] + ? (row[column.field] as string) + : '' + } + + return row[column.field] as string + })()} + )} ) diff --git a/src/core/data-display/data-table/data-table-pagination-actions.tsx b/src/core/data-display/data-table/data-table-pagination-actions.tsx index b94101c8..bf8fc105 100644 --- a/src/core/data-display/data-table/data-table-pagination-actions.tsx +++ b/src/core/data-display/data-table/data-table-pagination-actions.tsx @@ -7,6 +7,7 @@ import { KeyboardArrowLeft, KeyboardArrowRight } from '@/icons' +import { PaginationWrapper } from './styles' interface DataTablePaginationActionsProps { count: number @@ -21,8 +22,6 @@ interface DataTablePaginationActionsBuilder { clickable?: boolean } -const PAGINATION_WRAPPER_STYLE = { display: 'flex', marginLeft: '12px' } - export const makeDataTablePaginationActions = ({ showFirstButton, @@ -62,7 +61,7 @@ export const makeDataTablePaginationActions = } return ( -
+ {showFirstButton && ( )} -
+ ) } diff --git a/src/core/data-display/data-table/data-table-query-paginated.stories.tsx b/src/core/data-display/data-table/data-table-query-paginated.stories.tsx index 78f4b1c4..57321bae 100644 --- a/src/core/data-display/data-table/data-table-query-paginated.stories.tsx +++ b/src/core/data-display/data-table/data-table-query-paginated.stories.tsx @@ -1,5 +1,4 @@ /* eslint-disable @typescript-eslint/ban-ts-comment */ -/* eslint-disable max-lines */ import React, { useMemo, useRef, useState } from 'react' import type { ReactNode } from 'react' import { TableCell, TableRow, Typography } from '@material-ui/core' @@ -300,26 +299,25 @@ export const Crud = () => { setData } = usePaginated() - const newData: ColumnSpec[] = [ - ...columnsData, - { - title: 'Actions', - type: 'text', - field: 'product', - cellStyle: { - maxWidth: '30px', - whiteSpace: 'nowrap', - overflow: 'hidden', - textOverflow: 'ellipsis' - }, - editable: true - } - ] + const LoadNode: ReactNode = useMemo(() => { + const newData: ColumnSpec[] = [ + ...columnsData, + { + title: 'Actions', + type: 'text', + field: 'product', + cellStyle: { + maxWidth: '30px', + whiteSpace: 'nowrap', + overflow: 'hidden', + textOverflow: 'ellipsis' + }, + editable: true + } + ] - const LoadNode: ReactNode = useMemo( - () => generateSkeleton(size, newData), - [size] - ) + return generateSkeleton(size, newData) + }, [size]) type Data = { id: Identifier diff --git a/src/core/data-display/data-table/data-table-query-paginated.tsx b/src/core/data-display/data-table/data-table-query-paginated.tsx index f842a0e6..a85e881a 100644 --- a/src/core/data-display/data-table/data-table-query-paginated.tsx +++ b/src/core/data-display/data-table/data-table-query-paginated.tsx @@ -212,7 +212,14 @@ export const DataTableQueryPaginated = ( if (controllerRef) { controllerRef.current = nextController } - }, [setRowState, pushRowView, popRowView, getRowState, controllerRef]) + }, [ + setRowState, + pushRowView, + popRowView, + getRowState, + controllerRef, + handleChangePerPage + ]) const rowsList = useMemo( () => diff --git a/src/core/data-display/data-table/data-table.spec.tsx b/src/core/data-display/data-table/data-table.spec.tsx index a0e611e8..32d40c93 100644 --- a/src/core/data-display/data-table/data-table.spec.tsx +++ b/src/core/data-display/data-table/data-table.spec.tsx @@ -15,7 +15,9 @@ type Data = { quantity: number date: Date } + const date = () => new Date() + const data = [ { id: 1, diff --git a/src/core/data-display/data-table/data-table.stories.tsx b/src/core/data-display/data-table/data-table.stories.tsx index 9b95b10f..b00c5845 100644 --- a/src/core/data-display/data-table/data-table.stories.tsx +++ b/src/core/data-display/data-table/data-table.stories.tsx @@ -1,6 +1,4 @@ -/* eslint-disable react-perf/jsx-no-new-array-as-prop */ /* eslint-disable @typescript-eslint/ban-ts-comment */ -/* eslint-disable max-lines */ import React, { useState, useRef } from 'react' import format from 'date-fns/format' import { v4 as uuid } from 'uuid' @@ -673,7 +671,7 @@ export const CrudWithHidden = () => { const errorFields = [{ field: 'name', isErrorIf: [isEmpty] }] .filter(({ field, isErrorIf }) => { // @ts-ignore - const value = nextItem[field] + const value: string = nextItem[field] if (isNullable(value)) { if (isPartial) { @@ -977,9 +975,11 @@ const tableHead = [ ] export const WithField = () => { - const [data, setData] = useState(() => dataInput) - const [selectedAll, setSelectedAll] = useState(false) - const [selected, setSelected] = useState(Array(data.length).fill(false)) + const [data, setData] = useState[]>(() => dataInput) + const [selectedAll, setSelectedAll] = useState(false) + const [selected, setSelected] = useState( + Array(data.length).fill(false) + ) return ( ( } const type = column.type === 'number' ? 'number' : 'text' + const value = row[column.field] as string return ( diff --git a/src/core/data-display/data-table/styles.ts b/src/core/data-display/data-table/styles.ts new file mode 100644 index 00000000..ec5db647 --- /dev/null +++ b/src/core/data-display/data-table/styles.ts @@ -0,0 +1,44 @@ +import { TableCell, TableRow } from '@mui/material' +import { default as styled } from 'styled-components' + +export const FieldWrapper = styled.span`` + +export const PaginationWrapper = styled.div` + display: flex; + margin-left: 12px; +` + +export const TableCellRows = styled(TableCell)` + && { + width: 400px; + height: 60px; + padding: 0 10px; + } +` + +export const RowTable = styled(TableRow)` + width: 100%; + cursor: pointer; + + &:hover { + background: -moz-linear-gradient( + left, + rgba(189, 189, 189, 0) 0%, + rgba(189, 189, 189, 1) 100% + ); + background: -webkit-linear-gradient( + left, + rgba(189, 189, 189, 0) 0%, + rgba(189, 189, 189, 1) 100% + ); + background: linear-gradient( + to right, + rgba(189, 189, 189, 0) 0%, + rgba(189, 189, 189, 1) 100% + ); + } + + &.no-hover { + background: none; + } +` diff --git a/src/core/data-display/data-table/use-paginated.ts b/src/core/data-display/data-table/use-paginated.ts index 9a08a216..277e1a2b 100644 --- a/src/core/data-display/data-table/use-paginated.ts +++ b/src/core/data-display/data-table/use-paginated.ts @@ -1,7 +1,6 @@ import { useState, useMemo, useEffect } from 'react' import faker from 'faker' import { splitEvery } from 'ramda' -// import { v4 as uuid } from 'uuid' import type { Data } from './types' export interface IDataProps { @@ -95,7 +94,6 @@ export const usePaginated = () => { }, MOCK_DELAY_VALUE) } - // eslint-disable-next-line @typescript-eslint/no-explicit-any const setData: React.Dispatch> = ( data: Data[] ) => { diff --git a/src/core/data-display/editable-table/editable-table-with-date.spec.tsx b/src/core/data-display/editable-table/editable-table-with-date.spec.tsx index 8a8fe54a..063b45e2 100644 --- a/src/core/data-display/editable-table/editable-table-with-date.spec.tsx +++ b/src/core/data-display/editable-table/editable-table-with-date.spec.tsx @@ -1,10 +1,10 @@ -/* eslint-disable max-lines */ import * as React from 'react' import { act } from 'react-dom/test-utils' import { render, screen } from '@testing-library/react' import { userEvent } from '@testing-library/user-event/' import type { Column } from 'material-table' import WithDate from '@/test/mocks/editable-table-date-mock' + const COLUMNS_WITH_DATE: Column[] = [ { title: 'Data', diff --git a/src/core/data-display/editable-table/editable-table.spec.tsx b/src/core/data-display/editable-table/editable-table.spec.tsx index 00fabe02..1653c318 100644 --- a/src/core/data-display/editable-table/editable-table.spec.tsx +++ b/src/core/data-display/editable-table/editable-table.spec.tsx @@ -1,4 +1,3 @@ -/* eslint-disable max-lines */ import * as React from 'react' import { act } from 'react-dom/test-utils' import { fireEvent, render, screen } from '@testing-library/react' diff --git a/src/core/data-display/editable-table/editTable.stories.tsx b/src/core/data-display/editable-table/editable-table.stories.tsx similarity index 93% rename from src/core/data-display/editable-table/editTable.stories.tsx rename to src/core/data-display/editable-table/editable-table.stories.tsx index 14c43eef..98f1f0f9 100644 --- a/src/core/data-display/editable-table/editTable.stories.tsx +++ b/src/core/data-display/editable-table/editable-table.stories.tsx @@ -7,11 +7,9 @@ export default { component: EditableTable, args: { title: 'adicionar', - // eslint-disable-next-line no-console - onAddRow: (item: object) => Promise.resolve(console.log(item)), + onAddRow: (item: object) => Promise.resolve(alert(item)), onRowClick: () => window.alert('hello'), - // eslint-disable-next-line no-console - onDeleteRow: (item: object) => Promise.resolve(console.log(item)), + onDeleteRow: (item: object) => Promise.resolve(alert(item)), onUpdateRow: () => Promise.resolve(), onClickAdd: () => window.alert('hello') }, diff --git a/src/core/data-display/editable-table/index.tsx b/src/core/data-display/editable-table/index.tsx index 5ce49e8e..dcdebdfe 100644 --- a/src/core/data-display/editable-table/index.tsx +++ b/src/core/data-display/editable-table/index.tsx @@ -1,21 +1,16 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ -/* eslint-disable max-lines */ import React, { forwardRef, useRef } from 'react' import type { MouseEvent } from 'react' import ptBRLocale from 'date-fns/locale/pt-BR' import MaterialTable, { - MTableEditRow, - MTableBodyRow, MTableEditField, MTableAction, MTablePagination, MTableActions } from 'material-table' import { omit, contains, propOr } from 'ramda' -import { default as styled } from 'styled-components' import type { Column, Options } from 'material-table' import ListItem from '@/core/data-display/list-item' -import { Typography } from '@/core/data-display/typography' import { AutoComplete } from '@/core/inputs/auto-complete' import { Button } from '@/core/inputs/button' import { DateTime } from '@/core/inputs/date-time' @@ -33,6 +28,16 @@ import { LastPage } from '@/icons' import { getLocalization } from '@/lib/localization' +import { + AddRowButton, + AddRowText, + Container, + CustomRemove, + CustomRows, + FullWidthButton, + RightPagination, + Wrapper +} from './styles' export interface EditableTableProps { /** @@ -98,61 +103,6 @@ export interface EditableTableProps { export type TSuggestion = { label: string; value: string } -export const DARK = 'rgba(189,189,189,0)' -export const GREY = 'rgba(189,189,189,1)' - -const AddRowButton = styled.div` - display: flex; - align-items: center; -` - -const AddRowText = styled(Typography)` - margin-left: 4px; - font-weight: 500 !important; -` - -const FullWidthButton = styled(Button)` - width: calc(100% - 24px); - margin: 12px !important; -` - -const CustomRemove = styled(MTableEditRow)({ - '& h6': { - fontSize: '0.85em' - } -}) - -const CustomRows = styled(MTableBodyRow)` - transition: opacity 200ms ease; - button { - display: none; - } - &:hover { - background: -moz-linear-gradient(left, ${DARK} 0%, ${GREY} 100%); - background: -webkit-linear-gradient(left, ${DARK} 0%, ${GREY} 100%); - background: linear-gradient(to right, ${DARK} 0%, ${GREY} 100%); - } - &:hover button { - display: inline-block !important; - } - td { - min-width: 64px; - } -` - -const RightPagination = styled.div` - & > div { - display: block; - float: right; - } -` - -const Wrapper = styled.div` - & > div { - justify-content: flex-end; - } -` - export const EditableTable = ( props: EditableTableProps ) => { @@ -223,7 +173,7 @@ export const EditableTable = ( renderInput={itemProps => ( @@ -246,7 +196,7 @@ export const EditableTable = ( ) return ( -
+ , @@ -293,16 +243,6 @@ export const EditableTable = ( /> ) - // const renderDefault = () => ( - // {}} - // size={0} - // data={[]} - // /> - // ) - - // const hasData = !!localProps.action && size && data const isToolbar = localProps.action && 'position' in localProps.action && @@ -313,12 +253,6 @@ export const EditableTable = ( } return renderActionButton() - - // return cond([ - // [isToolbar, renderToolbarButton], - // [hasData, renderActionButton], - // [T, renderDefault] - // ])(localProps) }, EditField: localProps => { if (localProps.columnDef.type === 'datetime') { @@ -327,7 +261,8 @@ export const EditableTable = ( error={ props.errors ? getErrors( - localProps.columnDef.field + localProps.columnDef + .field as string ) : localProps.error } @@ -341,7 +276,9 @@ export const EditableTable = ( } if (localProps.columnDef.type === 'numeric') { - const error = getErrors(localProps.columnDef.field) + const error = getErrors( + localProps.columnDef.field as string + ) return renderMaskField(localProps, error) } @@ -443,7 +380,7 @@ export const EditableTable = ( }} onRowClick={props.onRowClick} /> -
+ ) } diff --git a/src/core/data-display/editable-table/styles.ts b/src/core/data-display/editable-table/styles.ts new file mode 100644 index 00000000..90d50e32 --- /dev/null +++ b/src/core/data-display/editable-table/styles.ts @@ -0,0 +1,63 @@ +import { MTableEditRow, MTableBodyRow } from 'material-table' +import { default as styled } from 'styled-components' +import { Typography } from '@/core/data-display/typography' +import { Button } from '@/core/inputs/button' + +export const DARK = 'rgba(189,189,189,0)' +export const GREY = 'rgba(189,189,189,1)' + +export const Container = styled.div` + width: 100%; +` + +export const AddRowButton = styled.div` + display: flex; + align-items: center; +` + +export const AddRowText = styled(Typography)` + margin-left: 4px; + font-weight: 500 !important; +` + +export const FullWidthButton = styled(Button)` + width: calc(100% - 24px); + margin: 12px !important; +` + +export const CustomRemove = styled(MTableEditRow)({ + '& h6': { + fontSize: '0.85em' + } +}) + +export const CustomRows = styled(MTableBodyRow)` + transition: opacity 200ms ease; + button { + display: none; + } + &:hover { + background: -moz-linear-gradient(left, ${DARK} 0%, ${GREY} 100%); + background: -webkit-linear-gradient(left, ${DARK} 0%, ${GREY} 100%); + background: linear-gradient(to right, ${DARK} 0%, ${GREY} 100%); + } + &:hover button { + display: inline-block !important; + } + td { + min-width: 64px; + } +` + +export const RightPagination = styled.div` + & > div { + display: block; + float: right; + } +` + +export const Wrapper = styled.div` + & > div { + justify-content: flex-end; + } +` diff --git a/src/core/feedback/collapse/collapse.stories.tsx b/src/core/feedback/collapse/collapse.stories.tsx index 025e712b..0fc87c0b 100644 --- a/src/core/feedback/collapse/collapse.stories.tsx +++ b/src/core/feedback/collapse/collapse.stories.tsx @@ -16,7 +16,12 @@ export const Default = () => { function handleClick() { setOpen(!open) - !open ? setButtonLabel('Close') : setButtonLabel('Open') + + if (!open) { + setButtonLabel('Close') + } else { + setButtonLabel('Open') + } } return ( diff --git a/src/core/feedback/dialog/index.tsx b/src/core/feedback/dialog/index.tsx index f3c6a9b2..1253a175 100644 --- a/src/core/feedback/dialog/index.tsx +++ b/src/core/feedback/dialog/index.tsx @@ -6,9 +6,15 @@ import MuiDialogContent from '@material-ui/core/DialogContent' import MuiDialogContentText from '@material-ui/core/DialogContentText' import MuiDialogTitle from '@material-ui/core/DialogTitle' import { makeStyles } from '@material-ui/core/styles' -import { default as styled } from 'styled-components' import type { DefaultProps } from '../../types' import type { DialogProps as MuiDialogProps } from '@material-ui/core' +import { + PaperContent, + Snippet, + SnippetContent, + TitleAction, + TitleWrapper +} from './styles' export interface DialogProps extends DefaultProps, @@ -37,26 +43,6 @@ export interface DialogProps onClose?: (event: Event) => void } -const TitleWrapper = styled.div` - display: flex; -` - -const TitleAction = styled.div` - padding: 16px 24px; - align-items: center; - display: flex; -` - -const Snippet = styled.div` - display: flex; -` - -const SnippetContent = styled.div` - position: relative; - height: inherit; - display: flex; -` - const useStyles = makeStyles({ root: { overflowY: 'unset' as const @@ -155,7 +141,7 @@ export const Dialog = ({ const renderSnippet = () => { return ( -
{renderPaperContent()}
+ {renderPaperContent()} {snippet} @@ -163,12 +149,17 @@ export const Dialog = ({ ) } - const scrollMode = - scroll === 'unset-body' - ? 'body' - : scroll === 'unset-paper' - ? 'paper' - : scroll + const scrollMode = () => { + if (scroll === 'unset-body') { + return 'body' + } + + if (scroll === 'unset-paper') { + return 'paper' + } + + return scroll + } return ( { function handleClick() { setOpen(!open) - label === 'Close' ? setLabel('Open') : setLabel('Close') + + if (label === 'Close') { + setLabel('Open') + } else { + setLabel('Close') + } } return ( diff --git a/src/core/feedback/grow/grow.stories.tsx b/src/core/feedback/grow/grow.stories.tsx index b7a3599d..8c6d2716 100644 --- a/src/core/feedback/grow/grow.stories.tsx +++ b/src/core/feedback/grow/grow.stories.tsx @@ -17,7 +17,12 @@ export const Default = () => { function handleClick() { setOpen(!open) - label === 'Close' ? setLabel('Open') : setLabel('Close') + + if (label === 'Close') { + setLabel('Open') + } else { + setLabel('Close') + } } return ( diff --git a/src/core/feedback/slide/slide.stories.tsx b/src/core/feedback/slide/slide.stories.tsx index 5284c134..edc31670 100644 --- a/src/core/feedback/slide/slide.stories.tsx +++ b/src/core/feedback/slide/slide.stories.tsx @@ -14,7 +14,12 @@ const Template: StoryFn = args => { function handleClick() { setOpen(!open) - btnLabel === 'Close' ? setBtnLabel('Open') : setBtnLabel('Close') + + if (btnLabel === 'Close') { + setBtnLabel('Open') + } else { + setBtnLabel('Close') + } } return ( diff --git a/src/core/feedback/validation-dialog/validation-dialog.spec.tsx b/src/core/feedback/validation-dialog/validation-dialog.spec.tsx index 0a769175..6d7cc767 100644 --- a/src/core/feedback/validation-dialog/validation-dialog.spec.tsx +++ b/src/core/feedback/validation-dialog/validation-dialog.spec.tsx @@ -1,13 +1,65 @@ import React from 'react' import CircularProgress from '@mui/material/CircularProgress' import { render, screen, fireEvent } from '@testing-library/react' -import type { ITitles } from '.' +import type { ITitles, IValidations } from '.' import { CheckCircleOutline, CancelOutlined } from '@/icons' import ValidationDialog, { ValidationStatus } from '.' import { theme } from '@/theme' const { action, secondary } = theme.colors +const stepsTitle = { + success: 'Success', + loading: 'Loading', + error: 'Error' +} + +const stepsIcons = { + success: , + error: , + loading: +} + +const responses: string[] = [] +const validations: IValidations[] = [] +const responsesDefault = ['Should', 'render', 'default', 'case'] +const responsesSuccess = ['Success', 'Success', 'Success', 'Success'] +const responsesLoading = ['Success', 'Success', 'Success', 'Loading'] +const responsesError = ['Success', 'Success', 'Success', 'Error'] + +const successValidation = [ + { + description: { + loading: 'Loading description', + success: 'Success description', + error: 'Error description' + }, + status: ValidationStatus.Success + } +] + +const errorValidation = [ + { + description: { + loading: 'Loading description', + success: 'Success description', + error: 'Error description' + }, + status: ValidationStatus.Error + } +] + +const loadingValidation = [ + { + description: { + loading: 'Loading description', + success: 'Success description', + error: 'Error description' + }, + status: ValidationStatus.Loading + } +] + const renderTitle = (stepsTitle: ITitles, responses: string[]) => { if (responses.every(item => item === 'Success')) { return stepsTitle.success @@ -25,32 +77,18 @@ const renderTitle = (stepsTitle: ITitles, responses: string[]) => { } describe('ValidationDialog', () => { - const stepsTitle = { - success: 'Success', - loading: 'Loading', - error: 'Error' - } - - const stepsIcons = { - success: , - error: , - loading: - } - it('should render title "Loading" by default', () => { - const responses = ['Should', 'render', 'default', 'case'] - render( item === 'Success')} - responses={responses} - validations={[]} + success={responsesDefault.every(item => item === 'Success')} + responses={responsesDefault} + validations={validations} icons={stepsIcons} handleCreate={jest.fn()} onClose={jest.fn()} @@ -58,25 +96,23 @@ describe('ValidationDialog', () => { /> ) - const result = renderTitle(stepsTitle, responses) + const result = renderTitle(stepsTitle, responsesLoading) expect(result).toBe(stepsTitle.loading) }) it('should render title "Success" when all items are "Success"', () => { - const responses = ['Success', 'Success', 'Success', 'Success'] - render( item === 'Success')} - responses={responses} - validations={[]} + success={responsesSuccess.every(item => item === 'Success')} + responses={responsesSuccess} + validations={validations} icons={stepsIcons} handleCreate={jest.fn()} onClose={jest.fn()} @@ -84,25 +120,23 @@ describe('ValidationDialog', () => { /> ) - const result = renderTitle(stepsTitle, responses) + const result = renderTitle(stepsTitle, responsesSuccess) expect(result).toBe(stepsTitle.success) }) it('should render title "Loading" when at least one item is "Loading"', () => { - const responses = ['Success', 'Success', 'Success', 'Loading'] - render( item === 'Success')} - responses={responses} - validations={[]} + success={responsesLoading.every(item => item === 'Success')} + responses={responsesLoading} + validations={validations} icons={stepsIcons} handleCreate={jest.fn()} onClose={jest.fn()} @@ -110,25 +144,23 @@ describe('ValidationDialog', () => { /> ) - const result = renderTitle(stepsTitle, responses) + const result = renderTitle(stepsTitle, responsesLoading) expect(result).toBe(stepsTitle.loading) }) it('should render title "Error" when at least one item is "Error"', () => { - const responses = ['Success', 'Success', 'Success', 'Error'] - render( item === 'Success')} - responses={responses} - validations={[]} + success={responsesError.every(item => item === 'Success')} + responses={responsesError} + validations={validations} icons={stepsIcons} handleCreate={jest.fn()} onClose={jest.fn()} @@ -136,25 +168,23 @@ describe('ValidationDialog', () => { /> ) - const result = renderTitle(stepsTitle, responses) + const result = renderTitle(stepsTitle, responsesError) expect(result).toBe(stepsTitle.error) }) it('should render onCancel when all responses are "Success"', () => { - const responses = ['Success', 'Success', 'Success', 'Success'] - render( item === 'Success')} - responses={responses} - validations={[]} + success={responsesSuccess.every(item => item === 'Success')} + responses={responsesSuccess} + validations={validations} icons={stepsIcons} handleCreate={jest.fn()} onClose={jest.fn()} @@ -176,17 +206,8 @@ describe('ValidationDialog', () => { title={stepsTitle} failed={false} success={false} - responses={[]} - validations={[ - { - description: { - loading: 'Loading description', - success: 'Success description', - error: 'Error description' - }, - status: ValidationStatus.Success - } - ]} + responses={responses} + validations={successValidation} icons={stepsIcons} handleCreate={jest.fn()} onClose={jest.fn()} @@ -206,17 +227,8 @@ describe('ValidationDialog', () => { title={stepsTitle} failed={false} success={false} - responses={[]} - validations={[ - { - description: { - loading: 'Loading description', - success: 'Success description', - error: 'Error description' - }, - status: ValidationStatus.Error - } - ]} + responses={responses} + validations={errorValidation} icons={stepsIcons} handleCreate={jest.fn()} onClose={jest.fn()} @@ -236,17 +248,8 @@ describe('ValidationDialog', () => { title={stepsTitle} failed={false} success={false} - responses={[]} - validations={[ - { - description: { - loading: 'Loading description', - success: 'Success description', - error: 'Error description' - }, - status: ValidationStatus.Loading - } - ]} + responses={responses} + validations={loadingValidation} icons={stepsIcons} handleCreate={jest.fn()} onClose={jest.fn()} @@ -261,7 +264,6 @@ describe('ValidationDialog', () => { it('should render handleCreate when all responses are "Success"', () => { const handleCreateMock = jest.fn() - const responses = ['Success', 'Success', 'Success', 'Success'] render( { success title={stepsTitle} failed={false} - responses={responses} - validations={[]} + responses={responsesSuccess} + validations={validations} icons={stepsIcons} handleCreate={handleCreateMock} onClose={jest.fn()} diff --git a/src/core/feedback/validation-dialog/validaton-dialog.stories.tsx b/src/core/feedback/validation-dialog/validaton-dialog.stories.tsx index 511fafbf..cd406ae9 100644 --- a/src/core/feedback/validation-dialog/validaton-dialog.stories.tsx +++ b/src/core/feedback/validation-dialog/validaton-dialog.stories.tsx @@ -38,23 +38,8 @@ export default meta type Story = StoryObj -const ValidationDialogStorie = () => { - const [open, setOpen] = useState(false) - const [validationResponses, setValidationResponses] = useState([]) - - const stepsTitle = { - success: 'Sua configuração foi validada com sucesso!', - error: 'Houve algum problema ao configurar', - loading: 'Validando Integrações' - } - - const stepsIcons = { - success: , - error: , - loading: - } - - const validationSteps = [ +const validationSteps = (validationResponses: string[]) => { + return [ { description: { loading: 'Validando URL, Porta e Forma de Autenticação', @@ -88,6 +73,23 @@ const ValidationDialogStorie = () => { status: validationResponses[3] } ] +} + +const ValidationDialogStorie = () => { + const [open, setOpen] = useState(false) + const [validationResponses, setValidationResponses] = useState([]) + + const stepsTitle = { + success: 'Sua configuração foi validada com sucesso!', + error: 'Houve algum problema ao configurar', + loading: 'Validando Integrações' + } + + const stepsIcons = { + success: , + error: , + loading: + } const useSubscriptionValidationState = () => { const initLoading = useCallback((condition: boolean = true) => { @@ -160,7 +162,7 @@ const ValidationDialogStorie = () => { open={open} title={stepsTitle} icons={stepsIcons} - validations={validationSteps} + validations={validationSteps(validationResponses)} responses={validationResponses} failed={ !validationResponses.includes('Loading') && diff --git a/src/core/feedback/zoom/zooms.stories.tsx b/src/core/feedback/zoom/zooms.stories.tsx index 456b4a8d..b4e82d2c 100644 --- a/src/core/feedback/zoom/zooms.stories.tsx +++ b/src/core/feedback/zoom/zooms.stories.tsx @@ -14,7 +14,12 @@ export const Default = () => { function handleClick() { setOpen(!open) - btnLabel === 'Close' ? setBtnLabel('Open') : setBtnLabel('Close') + + if (btnLabel === 'Close') { + setBtnLabel('Open') + } else { + setBtnLabel('Close') + } } return ( diff --git a/src/core/inputs/auto-complete/auto-complete.spec.tsx b/src/core/inputs/auto-complete/auto-complete.spec.tsx index 24d1fcb2..e539f097 100644 --- a/src/core/inputs/auto-complete/auto-complete.spec.tsx +++ b/src/core/inputs/auto-complete/auto-complete.spec.tsx @@ -1,4 +1,3 @@ -/* eslint-disable max-lines */ import * as React from 'react' import { act } from 'react-dom/test-utils' import { fireEvent, render, screen, waitFor } from '@testing-library/react' diff --git a/src/core/inputs/auto-complete/auto-complete.stories.tsx b/src/core/inputs/auto-complete/auto-complete.stories.tsx index 238e864b..7b5eaf70 100644 --- a/src/core/inputs/auto-complete/auto-complete.stories.tsx +++ b/src/core/inputs/auto-complete/auto-complete.stories.tsx @@ -11,15 +11,24 @@ export default { component: AutoComplete } as Meta +const suggestions = [ + { value: 'rock', label: 'Rock' }, + { value: 'pop', label: 'Pop' }, + { value: 'classic', label: 'Classic' } +] + +const subheaderSuggestions = [ + { label: 'Genres', subheader: true }, + { value: 'rock', label: 'Rock' }, + { value: 'pop', label: 'Pop' }, + { value: 'classic', label: 'Classic' } +] + export const Default = () => ( { return ( ( ( )} @@ -72,12 +77,7 @@ export const OpeningWhenFocused = () => ( export const WithSubheader = () => ( ( )} @@ -112,12 +112,7 @@ export const MockAtuoComplete = () => { autoFocus caseSensitive value={value} - suggestions={[ - { label: 'Genres', subheader: true }, - { value: 'rock', label: 'Rock' }, - { value: 'pop', label: 'pop' }, - { value: 'classic', label: 'Classic' } - ]} + suggestions={subheaderSuggestions} renderInput={props => { return ( { const { type = 'checkbox', diff --git a/src/core/inputs/checkbox/styles.ts b/src/core/inputs/checkbox/styles.ts new file mode 100644 index 00000000..c603d2b6 --- /dev/null +++ b/src/core/inputs/checkbox/styles.ts @@ -0,0 +1,16 @@ +import { default as styled } from 'styled-components' + +export const DENSE = { padding: '2px', margin: '0px 7px' } + +export const CheckFieldsWrapper = styled.div` + display: flex; + flex-direction: rows; + width: 100%; + align-items: center; + button { + display: none; + } + :hover button { + display: flex; + } +` diff --git a/src/core/inputs/date-time/index.tsx b/src/core/inputs/date-time/index.tsx index e37c5798..f476c578 100644 --- a/src/core/inputs/date-time/index.tsx +++ b/src/core/inputs/date-time/index.tsx @@ -9,7 +9,6 @@ import { } from '@material-ui/pickers' import type { DefaultProps } from '../../types' import type { KeyboardDatePickerProps } from '@material-ui/pickers/DatePicker' -// eslint-disable-next-line @stylistic/max-len import type { KeyboardDateTimePickerProps } from '@material-ui/pickers/DateTimePicker' import type { KeyboardTimePickerProps } from '@material-ui/pickers/TimePicker' import type { MaterialUiPickersDate } from '@material-ui/pickers/typings/date' diff --git a/src/core/inputs/mask-field/mask-field.stories.tsx b/src/core/inputs/mask-field/mask-field.stories.tsx index 5f5f2d2a..bcd0c913 100644 --- a/src/core/inputs/mask-field/mask-field.stories.tsx +++ b/src/core/inputs/mask-field/mask-field.stories.tsx @@ -8,7 +8,7 @@ export default { component: MaskField, argTypes: { helperText: { control: 'text' }, - value: { control: 'text' || 'number' } + value: { control: 'text' } } } as Meta diff --git a/src/core/inputs/pin-input/index.tsx b/src/core/inputs/pin-input/index.tsx index 613d9be6..154e0112 100644 --- a/src/core/inputs/pin-input/index.tsx +++ b/src/core/inputs/pin-input/index.tsx @@ -49,9 +49,7 @@ export const PinInput = ({ const changePinFocus = (pinIndex: number) => { const ref = inputRefs.current[pinIndex] - if (ref) { - ref.focus() - } + ref.focus() } useEffect(() => { @@ -64,7 +62,7 @@ export const PinInput = ({ const intValues: number[] = [] for (const value of splitValues) { - intValues.push(parseInt(value)) + intValues.push(parseInt(value, 10)) } setPin(intValues) changePinFocus(intValues.length - 1) diff --git a/src/core/inputs/radio-group/radio-group.stories.tsx b/src/core/inputs/radio-group/radio-group.stories.tsx index f0775432..c1c586f3 100644 --- a/src/core/inputs/radio-group/radio-group.stories.tsx +++ b/src/core/inputs/radio-group/radio-group.stories.tsx @@ -7,6 +7,17 @@ export default { component: RadioGroup } as Meta +const options = [ + { + label: 'First option', + value: 'first' + }, + { + label: 'Second Option', + value: 'second' + } +] + export const Default = () => { const [option, setOption] = useState('first') @@ -15,16 +26,7 @@ export const Default = () => { value={option} title='My options' name='options' - options={[ - { - label: 'First option', - value: 'first' - }, - { - label: 'Second Option', - value: 'second' - } - ]} + options={options} onChange={event => setOption(event.target.value)} /> ) diff --git a/src/core/inputs/text-field/index.tsx b/src/core/inputs/text-field/index.tsx index 7638056e..23fb5e57 100644 --- a/src/core/inputs/text-field/index.tsx +++ b/src/core/inputs/text-field/index.tsx @@ -18,11 +18,11 @@ import { } from '@material-ui/core' import { makeStyles } from '@material-ui/core/styles' import { when, is, pipe, split, map, zipObj, reject, propEq } from 'ramda' -import { default as styled } from 'styled-components' import type { DefaultProps } from '../../types' import type { TextFieldProps as MuiTextFieldProps } from '@material-ui/core' import { Clear, Help as ContactSupportIcon, Edit, Save } from '@/icons' import { IconButton } from '../icon-button' +import { Helper, StaticTextFieldWrapper, TextFieldWrapper } from './styles' import { theme } from '@/theme' const { primary } = theme.colors @@ -86,31 +86,6 @@ interface IEditProps extends Pick { saveButtonProps?: Partial, 'color'>> } -const Helper = styled.div` - width: 42px; - height: 38px; -` - -export const TextFieldWrapper = styled.div` - display: flex; - flex-direction: rows; - width: 100%; - align-items: center; - button { - display: none; - } - :hover button { - display: flex; - } -` - -export const StaticTextFieldWrapper = styled.div` - display: flex; - flex-direction: rows; - width: 100%; - align-items: center; -` - export const useStyles = makeStyles({ listOptions: { outline: 'none', @@ -289,7 +264,6 @@ export const TextField = ({ ...InputLabelProps }} InputProps={{ - // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore 'data-testid': 'text-field', classes: { diff --git a/src/core/inputs/text-field/styles.ts b/src/core/inputs/text-field/styles.ts new file mode 100644 index 00000000..5bd3ec99 --- /dev/null +++ b/src/core/inputs/text-field/styles.ts @@ -0,0 +1,28 @@ +import { default as styled } from 'styled-components' + +export const Wrapper = styled.div`` + +export const Helper = styled.div` + width: 42px; + height: 38px; +` + +export const TextFieldWrapper = styled.div` + display: flex; + flex-direction: rows; + width: 100%; + align-items: center; + button { + display: none; + } + :hover button { + display: flex; + } +` + +export const StaticTextFieldWrapper = styled.div` + display: flex; + flex-direction: rows; + width: 100%; + align-items: center; +` diff --git a/src/core/inputs/text-field/text-field.stories.tsx b/src/core/inputs/text-field/text-field.stories.tsx index 0314fce0..d3676e4d 100644 --- a/src/core/inputs/text-field/text-field.stories.tsx +++ b/src/core/inputs/text-field/text-field.stories.tsx @@ -4,6 +4,7 @@ import type { Meta, StoryFn } from '@storybook/react' import ListItem from '@/core/data-display/list-item' import { InputAdornment } from '@/core/inputs/input-adornment' import { TextField } from '.' +import { Wrapper } from './styles' export default { title: 'Inputs/TextField', @@ -38,7 +39,7 @@ withHelperButton.args = { export const withSelect = () => { return ( -
+ {[ { label: 'R$', value: 'reais' }, @@ -61,7 +62,7 @@ export const withSelect = () => { ))} -
+ ) } @@ -77,7 +78,7 @@ export const useWithSelectAndClear = () => { } return ( -
+ { ))} -
+ ) } @@ -113,7 +114,7 @@ export const combobox = () => { } return ( -
+ { onClear={onClear} onChange={handleChange} /> -
+ ) } diff --git a/src/core/surfaces/expansion-panel/index.tsx b/src/core/surfaces/expansion-panel/index.tsx index 5bc92985..db2dae2e 100644 --- a/src/core/surfaces/expansion-panel/index.tsx +++ b/src/core/surfaces/expansion-panel/index.tsx @@ -10,9 +10,9 @@ import MuiExpansionPanel from '@material-ui/core/Accordion' import MuiExpansionPanelActions from '@material-ui/core/AccordionActions' import MuiExpansionPanelDetails from '@material-ui/core/AccordionDetails' import MuiExpansionPanelSummary from '@material-ui/core/AccordionSummary' -import { default as styled } from 'styled-components' import type { PaperProps } from '@/core/surfaces/paper' import { EditBox, HelperBox } from '@/core/inputs/text-field' +import { ExpansionPanelHeaderWrapper } from './styles' export interface ExpansionPanelProps extends Omit { actions?: ReactNode @@ -42,18 +42,6 @@ export interface ExpansionPanelProps extends Omit { onClick?: (event: MouseEvent) => void } -const ExpansionPanelHeaderWrapper = styled.div` - display: flex; - flex-direction: rows; - align-items: center; - button { - display: none; - } - :hover button { - display: flex; - } -` - export const ExpansionPanel = ({ actions, details, diff --git a/src/core/surfaces/expansion-panel/styles.ts b/src/core/surfaces/expansion-panel/styles.ts new file mode 100644 index 00000000..fbdb3a6e --- /dev/null +++ b/src/core/surfaces/expansion-panel/styles.ts @@ -0,0 +1,13 @@ +import { default as styled } from 'styled-components' + +export const ExpansionPanelHeaderWrapper = styled.div` + display: flex; + flex-direction: rows; + align-items: center; + button { + display: none; + } + :hover button { + display: flex; + } +` diff --git a/src/core/surfaces/step-card/step-card-details.tsx b/src/core/surfaces/step-card/step-card-details.tsx index a97ea9c7..92b86daf 100644 --- a/src/core/surfaces/step-card/step-card-details.tsx +++ b/src/core/surfaces/step-card/step-card-details.tsx @@ -2,16 +2,16 @@ import React from 'react' import { List } from '@material-ui/core' import MuiAccordionDetails from '@material-ui/core/AccordionDetails' import type { IStepCardProps } from '.' -import { Typography } from '@/core/data-display/typography' import { IconButton } from '@/core/inputs/icon-button' -import { CheckCircle as CheckCircleIcon, Help as HelpIcon } from '@/icons' -import { ListItemContainer, StepCardColumn } from './styles' -import { theme } from '@/theme' - -const { feedback, grays } = theme.colors -const DONE_COLOR = feedback.success -const UNDONE_COLOR = grays.g3 -const UNDONE_FONT_COLOR = grays.g2 +import { + ACORDION_DETAILS, + ICON_BUTTON, + IconCheck, + IconHelp, + ListItemContainer, + StepCardColumn, + TypographyContainer +} from './styles' interface IStepCardDetailsProps { steps: IStepCardProps['steps'] @@ -23,7 +23,7 @@ interface IStepCardDetailsProps { export const StepCardDetails = (props: IStepCardDetailsProps) => { const { steps, onStepUrlClick, image, expansionPanelDetailsProps } = props - const StepsList = () => ( + const stepsList = () => ( {(steps || []).map((step, index) => { const handleOnClickStepUrl = () => { @@ -34,31 +34,17 @@ export const StepCardDetails = (props: IStepCardDetailsProps) => { return ( - - + + {step.title} - + {step.url && onStepUrlClick && ( <> - + )} @@ -70,13 +56,10 @@ export const StepCardDetails = (props: IStepCardDetailsProps) => { return ( - + {stepsList()} {image && ( diff --git a/src/core/surfaces/step-card/step-card-panel.tsx b/src/core/surfaces/step-card/step-card-panel.tsx index 77703b7e..037e4b41 100644 --- a/src/core/surfaces/step-card/step-card-panel.tsx +++ b/src/core/surfaces/step-card/step-card-panel.tsx @@ -1,29 +1,26 @@ import React from 'react' import type { CSSProperties } from 'react' -import { LinearProgress } from '@material-ui/core' import MuiAccordionSummary from '@material-ui/core/AccordionSummary' import { sprintf } from 'sprintf-js' import type { IStepCardProps } from '.' import { Typography } from '@/core/data-display/typography' -import { - CheckCircle as CheckCircleIcon, - ExpandMore as ExpandMoreIcon -} from '@/icons' +import { ExpandMore as ExpandMoreIcon } from '@/icons' import { BarWrapper, + BottomProgressBar, + CheckIcon, NormalProgressContainer, + PROGRESS_BAR, + ProgressBar, StepCardColumn, StepCardRow, StepContainer, - TitleContainer + TEXT_ALIGN, + TitleContainer, + TypographyProgress, + TypographySubtitle, + TypographyTitle } from './styles' -import { theme } from '@/theme' - -const { feedback, grays } = theme.colors -const DONE_COLOR = feedback.success -const UNDONE_COLOR = grays.g3 -const UNDONE_TITLE_COLOR = grays.g1 -const UNDONE_PROGRESS_COLOR = grays.g5 interface IStepCardPanelProps { title: string @@ -43,6 +40,39 @@ interface IStepCardPanelProps { padding?: CSSProperties['padding'] } +const TitleColumn = ({ + showIcon, + percentage, + title, + titleProps, + subTitle +}: { + showIcon: boolean + percentage: number + title: string + titleProps: IStepCardProps['titleProps'] + subTitle?: string +}) => ( + <> + {showIcon && ( + + )} + + + {title} + + {subTitle && ( + + {subTitle} + + )} + + +) + export const StepCardPanel = (props: IStepCardPanelProps) => { const { title, @@ -62,139 +92,60 @@ export const StepCardPanel = (props: IStepCardPanelProps) => { padding } = props - const TitleIcon = () => { - return ( - - ) - } - - const Title = () => { - return ( - - {title} - - ) - } - - const SubTitle = () => { - return ( - - {subTitle} - - ) - } - - const TitleColumn = () => ( - <> - {showIcon && } - - - {subTitle && <SubTitle />} - </TitleContainer> - </> - ) - - const Summary = () => { - return ( - <MuiAccordionSummary - style={{ textAlign: 'center' }} - expandIcon={<ExpandMoreIcon fontSize='large' />}> - <Typography variant='h6' {...summaryProps}> - {sprintf(summary, remainingSteps, time)} - </Typography> - </MuiAccordionSummary> - ) - } - - const SummaryLinearProgress = () => { - return ( - <LinearProgress - variant='determinate' - value={percentage} - color='primary' - classes={{ - barColorPrimary: 'barColorPrimary' - }} - style={{ - borderRadius: 10, - height: '16px', - backgroundColor: UNDONE_PROGRESS_COLOR - }} - {...summaryLinearProgressBarProps} - /> - ) - } - - const NormalProgress = () => ( - <NormalProgressContainer data-testid='normal-progress'> - <Typography variant='h6' {...summaryProps}> - {summary} - </Typography> - <Typography - variant='subtitle2' - style={{ - position: 'absolute', - right: 8 - }}>{`${percentage}%`}</Typography> - <BarWrapper> - <SummaryLinearProgress /> - </BarWrapper> - </NormalProgressContainer> - ) - - const BottomLineProgress = () => { - return ( - <LinearProgress - variant='determinate' - value={percentage} - color='primary' - classes={{ - barColorPrimary: 'barColorPrimary' - }} - style={{ - height: '16px', - backgroundColor: UNDONE_PROGRESS_COLOR - }} - {...linearProgressBarProps} - /> - ) - } - return ( <StepContainer padding={padding}> <StepCardRow fullWidth={fullWidth} minHeight={expandable ? '100px' : '100%'}> <StepCardColumn justifyContent='start'> - <TitleColumn /> + <TitleColumn + showIcon={showIcon} + percentage={percentage} + title={title} + titleProps={titleProps} + subTitle={subTitle} + /> </StepCardColumn> <StepCardColumn justifyContent='end'> - {expandable ? <Summary /> : <NormalProgress />} + {expandable ? ( + <MuiAccordionSummary + style={TEXT_ALIGN} + expandIcon={<ExpandMoreIcon fontSize='large' />}> + <Typography variant='h6' {...summaryProps}> + {sprintf(summary, remainingSteps, time)} + </Typography> + </MuiAccordionSummary> + ) : ( + <NormalProgressContainer data-testid='normal-progress'> + <Typography variant='h6' {...summaryProps}> + {summary} + </Typography> + <TypographyProgress variant='subtitle2'> + {`${percentage}%`} + </TypographyProgress> + <BarWrapper> + <ProgressBar + variant='determinate' + value={percentage} + color='primary' + classes={PROGRESS_BAR} + {...summaryLinearProgressBarProps} + /> + </BarWrapper> + </NormalProgressContainer> + )} </StepCardColumn> </StepCardRow> {showBottomPercentage && ( <StepCardRow fullWidth={fullWidth} minHeight='15px'> <BarWrapper> - <BottomLineProgress /> + <BottomProgressBar + variant='determinate' + value={percentage} + color='primary' + classes={PROGRESS_BAR} + {...linearProgressBarProps} + /> </BarWrapper> </StepCardRow> )} diff --git a/src/core/surfaces/step-card/step-card-skeleton.tsx b/src/core/surfaces/step-card/step-card-skeleton.tsx index f0f3d1ce..14cbd508 100644 --- a/src/core/surfaces/step-card/step-card-skeleton.tsx +++ b/src/core/surfaces/step-card/step-card-skeleton.tsx @@ -34,23 +34,6 @@ const StepCardSkeleton = (props: IStepCardPanelProps) => { fullWidth } = props - const TextSkeleton = () => ( - <Skeleton variant='text' style={{ minWidth: '400px' }} height={40} /> - ) - - const NormalProgress = () => ( - <NormalProgressContainer> - <Skeleton - variant='text' - height={40} - style={{ minWidth: '100px', margin: '4px 0px' }} - /> - <Box style={{ width: '100%' }}> - <Skeleton variant='text' /> - </Box> - </NormalProgressContainer> - ) - return ( <Container data-testid='skeleton-container' @@ -70,12 +53,42 @@ const StepCardSkeleton = (props: IStepCardPanelProps) => { /> )} <TitleContainer> - <TextSkeleton /> - {subTitleSkeleton && <TextSkeleton />} + <Skeleton + variant='text' + style={{ minWidth: '400px' }} + height={40} + /> + {subTitleSkeleton && ( + <Skeleton + variant='text' + style={{ minWidth: '400px' }} + height={40} + /> + )} </TitleContainer> </StepCardColumn> <StepCardColumn justifyContent='end'> - {expandable ? <TextSkeleton /> : <NormalProgress />} + {expandable ? ( + <Skeleton + variant='text' + style={{ minWidth: '400px' }} + height={40} + /> + ) : ( + <NormalProgressContainer> + <Skeleton + variant='text' + height={40} + style={{ + minWidth: '100px', + margin: '4px 0px' + }} + /> + <Box style={{ width: '100%' }}> + <Skeleton variant='text' /> + </Box> + </NormalProgressContainer> + )} </StepCardColumn> </StepCardRow> {showBottomPercentage && ( diff --git a/src/core/surfaces/step-card/styles.ts b/src/core/surfaces/step-card/styles.ts index 3ae52cb7..04bb6f7d 100644 --- a/src/core/surfaces/step-card/styles.ts +++ b/src/core/surfaces/step-card/styles.ts @@ -1,7 +1,11 @@ -import { Box } from '@material-ui/core' +import { Box, LinearProgress } from '@material-ui/core' import { default as styled } from 'styled-components' +import { default as Typography } from '@/core/data-display/typography' +import { CheckCircle, Help as HelpIcon } from '@/icons' import { theme } from '@/theme' +const { feedback, grays } = theme.colors + interface IStepContainerProps { padding?: React.CSSProperties['padding'] } @@ -20,6 +24,21 @@ interface IColumnProps { justifyContent: React.CSSProperties['justifyContent'] } +export const PROGRESS_BAR = { + barColorPrimary: 'barColorPrimary' +} + +export const TEXT_ALIGN = { textAlign: 'center' } as const + +export const ICON_BUTTON = { + backgroundColor: 'unset' +} + +export const ACORDION_DETAILS = { + display: 'flex', + justifyContent: 'space-between' +} + export const Container = styled.div<IContainerProps>` width: 100%; max-width: ${props => (props.fullWidth ? '100%' : '1100px')}; @@ -104,3 +123,68 @@ export const BarWrapper = styled(Box)` background-color: ${theme.colors.feedback.success}; } ` + +export const TypographyTitle = styled(Typography)` + && { + color: ${grays.g1}; + font-size: 24px; + text-align: center; + } +` + +export const TypographySubtitle = styled(Typography)` + && { + color: ${grays.g3}; + text-align: center; + } +` + +export const TypographyProgress = styled(Typography)` + && { + position: absolute; + right: 8; + } +` + +export const BottomProgressBar = styled(LinearProgress)` + && { + height: 16px; + background-color: ${grays.g5}; + } +` + +export const ProgressBar = styled(LinearProgress)` + && { + border-radius: 10px; + height: 16px; + background-color: ${grays.g5}; + } +` + +export const CheckIcon = styled(CheckCircle)<{ percentage: number }>` + && { + font-size: 40px; + color: ${props => + props.percentage === 100 ? feedback.success : grays.g3}; + } +` + +export const IconHelp = styled(HelpIcon)` + && { + margin: 0px; + } +` + +export const IconCheck = styled(CheckCircle)<{ done: boolean }>` + && { + font-size: 40px; + color: ${props => (props.done ? feedback.success : grays.g3)}; + } +` + +export const TypographyContainer = styled(Typography)` + && { + color: ${grays.g2}; + font-weight: 600; + } +` diff --git a/src/experimental/breadcrumbs/index.tsx b/src/experimental/breadcrumbs/index.tsx index 9473ddda..8e81a574 100644 --- a/src/experimental/breadcrumbs/index.tsx +++ b/src/experimental/breadcrumbs/index.tsx @@ -1,21 +1,12 @@ -import type { ReactNode } from 'react' import React from 'react' +import type { ReactNode } from 'react' import { addIndex, map } from 'ramda' -import { default as styled } from 'styled-components' import { ChevronRight as IconChevronRight } from '@/icons' -import { Typography, Breadcrumb } from '@/index' -import { theme } from '@/theme' +import { Breadcrumb } from '@/index' +import { LinkStyled, TextTypography } from './styles' const imap = addIndex(map) -const LinkStyled = styled.a({ - textDecoration: 'none', - color: theme.colors.primary.main, - ':hover': { - textDecoration: 'underline' - } -}) - const INDEX_CORRECTION = 1 const START = 1 @@ -61,9 +52,9 @@ export const Breadcrumbs = ({ allChunks.slice(START, chunkIndex + INDEX_CORRECTION).join('/') const text = ( - <Typography key={link} color='inherit' style={{ display: 'flex' }}> + <TextTypography key={link} color='inherit'> {validChunkWord} - </Typography> + </TextTypography> ) const isLastChunk = chunkIndex === lastChunkIndex diff --git a/src/experimental/breadcrumbs/styles.ts b/src/experimental/breadcrumbs/styles.ts new file mode 100644 index 00000000..5bf386b2 --- /dev/null +++ b/src/experimental/breadcrumbs/styles.ts @@ -0,0 +1,17 @@ +import { default as styled } from 'styled-components' +import { default as Typography } from '@/core/data-display/typography' +import { theme } from '@/theme' + +export const LinkStyled = styled.a({ + textDecoration: 'none', + color: theme.colors.primary.main, + ':hover': { + textDecoration: 'underline' + } +}) + +export const TextTypography = styled(Typography)` + && { + display: flex; + } +` diff --git a/src/experimental/nothing-found/index.tsx b/src/experimental/nothing-found/index.tsx index e2e9be25..c15092ed 100644 --- a/src/experimental/nothing-found/index.tsx +++ b/src/experimental/nothing-found/index.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { TypographyProps } from '@material-ui/core' -import { Typography } from '@/index' +import { TextTypography } from './styles' export interface IProps extends TypographyProps { searchText?: string @@ -20,19 +20,18 @@ export const NothingFound = (props: IProps) => { const { customText = message, searchText = '', show, ...otherProps } = rest return show ? ( - <Typography + <TextTypography align='center' variant='h5' color='textSecondary' padding='48px 0' - style={{ flex: 1 }} {...otherProps}> {searchText !== '' ? 'Sua pesquisa "' + searchText + '" não retornou nenhum resultado.' : customText} - </Typography> + </TextTypography> ) : null } diff --git a/src/experimental/nothing-found/styles.ts b/src/experimental/nothing-found/styles.ts new file mode 100644 index 00000000..6fcbc85d --- /dev/null +++ b/src/experimental/nothing-found/styles.ts @@ -0,0 +1,8 @@ +import { default as styled } from 'styled-components' +import { default as Typography } from '@/core/data-display/typography' + +export const TextTypography = styled(Typography)` + && { + flex: 1; + } +` diff --git a/src/experimental/sidebar/index.tsx b/src/experimental/sidebar/index.tsx index 1d8516b4..c9ba52b6 100644 --- a/src/experimental/sidebar/index.tsx +++ b/src/experimental/sidebar/index.tsx @@ -2,9 +2,14 @@ import React, { useEffect, useState, useCallback } from 'react' import type { ReactElement } from 'react' import { Skeleton } from '@mui/material' import { times, map } from 'ramda' -import { default as styled } from 'styled-components' -import { Sidebar as FlipperSidebar, Tooltip, List, ListItem } from '@/index' -import { theme } from '@/theme' +import { Tooltip, List } from '@/index' +import { + Link, + MenuItem, + PaperBar, + SkeletonWrapper, + StyledFlipperSidebar +} from './styles' export interface ISidebarOption { icon: ReactElement @@ -21,46 +26,19 @@ export interface IProps { extraOptions?: ISidebarOption[] } -const StyledFlipperSidebar = styled(FlipperSidebar)` - & > div { - border-right: 1px solid ${theme.colors.grays.g6}; - } -` - -const MenuItem = styled(ListItem)` - &&& { - & div { - padding: 0; - } - } -` - -const Link = styled.a` - color: ${theme.colors.primary.main}; - text-decoration: none; -` - -const PaperBar = styled.div` - flex-direction: column; - display: flex; - justify-content: space-between; - flex: 1; - padding-bottom: 16px; -` - -const LABEL_TIMEOUT = 300 - const renderSkeleton = (index: number) => ( - <div + <SkeletonWrapper className='skeleton-container' role='skeleton' - key={`sidebar-skeleton-${index}`} - style={{ padding: '2px 10px' }}> + key={`sidebar-skeleton-${index}`}> <Skeleton width={36} height={36} /> - </div> + </SkeletonWrapper> ) +const LABEL_TIMEOUT = 300 + const SIDEBAR_SKELETON_SIZE = 6 + const sidebarSkeleton = times(renderSkeleton, SIDEBAR_SKELETON_SIZE) // create a function that extract path from location.pathname @@ -70,6 +48,7 @@ const extract = (location: string): string => { return '/' + location.slice(lastSlashIndex + 1) } + const useSidebar = () => { const [expanded, setExpanded] = useState(false) const route = extract(location.pathname) @@ -81,8 +60,6 @@ const useSidebar = () => { return { toggle, expanded, route } } -const emptyList: ISidebarOption[] = [] - /** * Sidebar component V2 */ @@ -91,7 +68,7 @@ export const Sidebar = (props: IProps) => { options, loading, handleGoTo, - extraOptions = emptyList, + extraOptions = [], top, ...otherProps } = props diff --git a/src/experimental/sidebar/sidebar.spec.tsx b/src/experimental/sidebar/sidebar.spec.tsx index ce9e210d..0571d7b6 100644 --- a/src/experimental/sidebar/sidebar.spec.tsx +++ b/src/experimental/sidebar/sidebar.spec.tsx @@ -19,6 +19,21 @@ const options: ISidebarOption[] = [ } ] +const extraOptions: ISidebarOption[] = [ + { + icon: <svg />, + label: 'Extra Option 1', + name: 'extraOption1', + route: '/extraOption1' + }, + { + icon: <svg />, + label: 'Extra Option 2', + name: 'extraOption2', + route: '/extraOption2' + } +] + describe('Sidebar', () => { it('renders the options', () => { render(<Sidebar options={options} />) @@ -45,21 +60,6 @@ describe('Sidebar', () => { }) it('renders extraOptions when provided', () => { - const extraOptions: ISidebarOption[] = [ - { - icon: <svg />, - label: 'Extra Option 1', - name: 'extraOption1', - route: '/extraOption1' - }, - { - icon: <svg />, - label: 'Extra Option 2', - name: 'extraOption2', - route: '/extraOption2' - } - ] - render(<Sidebar options={options} extraOptions={extraOptions} />) extraOptions.forEach(option => { expect(screen.getByTitle(option.label)).toBeDefined() diff --git a/src/experimental/sidebar/styles.ts b/src/experimental/sidebar/styles.ts new file mode 100644 index 00000000..2211a313 --- /dev/null +++ b/src/experimental/sidebar/styles.ts @@ -0,0 +1,36 @@ +import { default as styled } from 'styled-components' +import { Sidebar as FlipperSidebar, ListItem } from '@/index' +import { theme } from '@/theme' + +const { grays, primary } = theme.colors + +export const StyledFlipperSidebar = styled(FlipperSidebar)` + & > div { + border-right: 1px solid ${grays.g6}; + } +` + +export const MenuItem = styled(ListItem)` + &&& { + & div { + padding: 0; + } + } +` + +export const Link = styled.a` + color: ${primary.main}; + text-decoration: none; +` + +export const PaperBar = styled.div` + flex-direction: column; + display: flex; + justify-content: space-between; + flex: 1; + padding-bottom: 16px; +` + +export const SkeletonWrapper = styled.div` + padding: 2px 10px; +` diff --git a/src/index.ts b/src/index.ts index bdb52503..335c7474 100644 --- a/src/index.ts +++ b/src/index.ts @@ -61,8 +61,8 @@ export { default as Zoom } from './core/feedback/zoom' export { default as PinInput } from './core/inputs/pin-input' export { default as Chapter } from './core/data-display/chapter' export { default as DataTable } from './core/data-display/data-table' +export { default as DataTableField } from './core/data-display/data-table' export { default as StepCard } from './core/surfaces/step-card' -// eslint-disable-next-line @stylistic/max-len export { default as StepCardSkeleton } from './core/surfaces/step-card/step-card-skeleton' export { default as ValidationDialog } from './core/feedback/validation-dialog/' export * as Experimental from './experimental' diff --git a/src/lib/localization.ts b/src/lib/localization.ts index e231b7d2..c38c9ad5 100644 --- a/src/lib/localization.ts +++ b/src/lib/localization.ts @@ -7,9 +7,10 @@ export const getLocalization = (title = '') => ({ editRow: { saveTooltip: 'Salvar', cancelTooltip: 'Cancelar', - deleteText: `Você tem certeza que deseja excluir esse ${ - title ?? 'item' - }?` + deleteText: + title !== '' + ? `Você tem certeza que deseja excluir esse ${title}?` + : `Você tem certeza que deseja excluir esse item?` }, addTooltip: `Adicionar ${title}`, deleteTooltip: `Remover ${title}`, diff --git a/src/test/mocks/data-table-hidden-mock.tsx b/src/test/mocks/data-table-hidden-mock.tsx index ddda6fc9..d5bdad93 100644 --- a/src/test/mocks/data-table-hidden-mock.tsx +++ b/src/test/mocks/data-table-hidden-mock.tsx @@ -94,7 +94,7 @@ const Default = () => { const errorFields = [{ field: 'name', isErrorIf: [isEmpty] }] .filter(({ field, isErrorIf }) => { // @ts-ignore - const value = nextItem[field] + const value: string = nextItem[field] if (isNullable(value)) { if (isPartial) { diff --git a/src/test/mocks/snackbar-mock.tsx b/src/test/mocks/snackbar-mock.tsx index 861db7c4..d6e5893e 100644 --- a/src/test/mocks/snackbar-mock.tsx +++ b/src/test/mocks/snackbar-mock.tsx @@ -9,6 +9,23 @@ interface IProps { snackProps?: Partial<SnackBarProps> } +const Action = ({ + snackProps, + handleClose +}: { + snackProps: IProps['snackProps'] + handleClose: () => void +}) => ( + <MuiIconButton + key='close' + role='close-icon-button' + aria-label='Close' + color='inherit' + onClick={snackProps?.onClose || handleClose}> + <IconClose /> + </MuiIconButton> +) + const Default = ({ snackProps, withAction }: IProps) => { const [btnState, setBtnState] = useState(false) const [open, setOpen] = useState(false) @@ -23,17 +40,6 @@ const Default = ({ snackProps, withAction }: IProps) => { setBtnState(false) } - const Action = () => ( - <MuiIconButton - key='close' - role='close-icon-button' - aria-label='Close' - color='inherit' - onClick={snackProps?.onClose || handleClose}> - <IconClose /> - </MuiIconButton> - ) - return ( <> <Button @@ -48,7 +54,14 @@ const Default = ({ snackProps, withAction }: IProps) => { <Snackbar message={snackProps?.message} autoHide={snackProps?.autoHide} - action={withAction ? <Action /> : undefined} + action={ + withAction ? ( + <Action + snackProps={snackProps} + handleClose={handleClose} + /> + ) : undefined + } open={open} onClick={snackProps?.onClick} onClose={snackProps?.onClose || handleClose} From 77ed795276a9228c8d3d769448fba0023db5c6d4 Mon Sep 17 00:00:00 2001 From: Karine Brandelli Padilha <karine.padilha@ngi.com.br> Date: Fri, 16 Feb 2024 17:06:17 -0300 Subject: [PATCH 02/10] chore: adjust exports and separate styles --- src/core/context/styles-provider/index.tsx | 1 + .../__snapshots__/advertise.spec.tsx.snap | 10 ++-- src/core/data-display/advertise/index.tsx | 32 +++------- src/core/data-display/advertise/styles.ts | 17 ++++++ src/core/data-display/avatar/avatar.spec.tsx | 4 +- .../data-display/avatar/avatar.stories.tsx | 2 +- src/core/data-display/avatar/index.tsx | 2 +- src/core/data-display/badge/badge.spec.tsx | 2 +- src/core/data-display/badge/badge.stories.tsx | 4 +- src/core/data-display/badge/index.tsx | 2 +- .../data-display/chapter/chapter.spec.tsx | 2 +- .../data-display/chapter/chapter.stories.tsx | 2 +- src/core/data-display/chapter/index.tsx | 4 +- src/core/data-display/chip/chip.spec.tsx | 2 +- src/core/data-display/chip/chip.stories.tsx | 4 +- src/core/data-display/chip/index.tsx | 2 +- .../data-table/data-table-action.tsx | 2 +- .../data-table/data-table-field.tsx | 4 +- .../data-table-pagination-actions.tsx | 2 +- .../data-table-query-paginated.stories.tsx | 4 +- .../data-table/data-table-query-paginated.tsx | 2 +- .../data-table/data-table.stories.tsx | 8 +-- .../data-display/data-table/data-table.tsx | 2 +- src/core/data-display/data-table/index.ts | 1 - src/core/data-display/data-table/rows.tsx | 6 +- .../data-display/divider/divider.spec.tsx | 2 +- .../data-display/divider/divider.stories.tsx | 4 +- src/core/data-display/divider/index.tsx | 2 +- .../editable-table/editable-table.stories.tsx | 2 +- .../data-display/editable-table/index.tsx | 14 ++--- .../data-display/editable-table/styles.ts | 4 +- src/core/data-display/fab/fab.spec.tsx | 2 +- src/core/data-display/fab/fab.stories.tsx | 2 +- src/core/data-display/fab/index.tsx | 2 +- src/core/data-display/line/index.tsx | 2 +- src/core/data-display/line/line.spec.tsx | 2 +- src/core/data-display/line/line.stories.tsx | 2 +- src/core/data-display/list-item/index.tsx | 2 +- src/core/data-display/list/index.tsx | 2 +- src/core/data-display/list/list.spec.tsx | 2 +- src/core/data-display/list/list.stories.tsx | 4 +- src/core/data-display/menu-item/index.tsx | 15 +---- src/core/data-display/menu-item/styles.ts | 14 +++++ src/core/data-display/node/index.tsx | 59 +++---------------- src/core/data-display/node/node.spec.tsx | 2 +- src/core/data-display/node/node.stories.tsx | 2 +- src/core/data-display/node/styles.ts | 49 +++++++++++++++ src/core/data-display/table/index.tsx | 2 +- src/core/data-display/table/table.spec.tsx | 2 +- src/core/data-display/table/table.stories.tsx | 2 +- src/core/data-display/tree/index.tsx | 4 +- src/core/data-display/tree/tree.spec.tsx | 2 +- src/core/data-display/tree/tree.stories.tsx | 2 +- src/core/data-display/typography/index.tsx | 2 +- .../typography/typography.spec.tsx | 2 +- .../typography/typography.stories.tsx | 2 +- src/core/feedback/collapse/collapse.spec.tsx | 2 +- .../feedback/collapse/collapse.stories.tsx | 4 +- src/core/feedback/collapse/index.tsx | 2 +- src/core/feedback/dialog/dialog.spec.tsx | 4 +- src/core/feedback/dialog/dialog.stories.tsx | 6 +- src/core/feedback/dialog/index.tsx | 2 +- src/core/feedback/fade/fade.spec.tsx | 2 +- src/core/feedback/fade/fade.stories.tsx | 4 +- src/core/feedback/fade/index.tsx | 2 +- src/core/feedback/grow/grow.spec.tsx | 2 +- src/core/feedback/grow/grow.stories.tsx | 4 +- src/core/feedback/grow/index.tsx | 2 +- src/core/feedback/progress/index.tsx | 2 +- src/core/feedback/progress/progress.spec.tsx | 2 +- .../feedback/progress/progress.stories.tsx | 2 +- src/core/feedback/slide/index.tsx | 2 +- src/core/feedback/slide/slide.spec.tsx | 2 +- src/core/feedback/slide/slide.stories.tsx | 4 +- src/core/feedback/snackbar/index.tsx | 2 +- .../feedback/snackbar/snackbar.stories.tsx | 2 +- src/core/feedback/tooltip/index.tsx | 2 +- src/core/feedback/tooltip/tool-tip.spec.tsx | 2 +- src/core/feedback/tooltip/tooltip.stories.tsx | 4 +- src/core/feedback/validation-dialog/index.tsx | 27 +-------- src/core/feedback/validation-dialog/styles.ts | 22 +++++++ .../validation-dialog.spec.tsx | 14 ++--- .../validaton-dialog.stories.tsx | 2 +- src/core/feedback/zoom/index.tsx | 2 +- src/core/feedback/zoom/zoom.spec.tsx | 2 +- src/core/feedback/zoom/zooms.stories.tsx | 4 +- .../auto-complete/auto-complete.spec.tsx | 6 +- .../auto-complete/auto-complete.stories.tsx | 6 +- src/core/inputs/auto-complete/index.tsx | 6 +- src/core/inputs/button/button.spec.tsx | 2 +- src/core/inputs/button/button.stories.tsx | 2 +- src/core/inputs/button/index.tsx | 2 +- src/core/inputs/checkbox/checkbox.spec.tsx | 2 +- src/core/inputs/checkbox/checkbox.stories.tsx | 2 +- src/core/inputs/checkbox/index.tsx | 2 +- .../inputs/chip-field/chip-field.spec.tsx | 2 +- .../inputs/chip-field/chip-field.stories.tsx | 2 +- src/core/inputs/chip-field/index.tsx | 25 +------- src/core/inputs/chip-field/styles.ts | 22 +++++++ .../inputs/date-time/date-time.stories.tsx | 2 +- src/core/inputs/date-time/index.tsx | 2 +- .../inputs/icon-button/icon-button.spec.tsx | 2 +- .../icon-button/icon-button.stories.tsx | 2 +- src/core/inputs/icon-button/index.tsx | 2 +- src/core/inputs/input-adornment/index.tsx | 5 +- .../input-adornment/input-adorment.spec.tsx | 2 +- .../input-adornment.stories.tsx | 2 +- src/core/inputs/input-base/index.tsx | 2 +- .../inputs/input-base/input-base.spec.tsx | 2 +- .../inputs/input-base/input-base.stories.tsx | 2 +- src/core/inputs/mask-field/index.tsx | 4 +- .../inputs/mask-field/mask-field.spec.tsx | 2 +- .../inputs/mask-field/mask-field.stories.tsx | 4 +- src/core/inputs/pin-input/index.tsx | 10 +--- src/core/inputs/pin-input/pin-input.spec.tsx | 2 +- .../inputs/pin-input/pin-input.stories.tsx | 26 ++------ src/core/inputs/pin-input/styles.ts | 21 +++++++ src/core/inputs/radio-group/index.tsx | 2 +- .../radio-group/radio-group.stories.tsx | 2 +- src/core/inputs/radio/index.tsx | 7 +-- src/core/inputs/radio/radio.spec.tsx | 2 +- src/core/inputs/radio/radio.stories.tsx | 2 +- src/core/inputs/select/index.tsx | 2 +- src/core/inputs/select/select.stories.tsx | 4 +- src/core/inputs/slider/index.tsx | 2 +- src/core/inputs/slider/slider.spec.tsx | 2 +- src/core/inputs/slider/slider.stories.tsx | 2 +- src/core/inputs/text-field/index.tsx | 4 +- .../inputs/text-field/text-field.stories.tsx | 4 +- src/core/navigation/breadcrumb/index.tsx | 2 +- src/core/navigation/drawer/drawer.spec.tsx | 2 +- src/core/navigation/drawer/drawer.stories.tsx | 6 +- src/core/navigation/drawer/index.tsx | 2 +- src/core/navigation/menu/index.tsx | 2 +- src/core/navigation/menu/menu.spec.tsx | 2 +- src/core/navigation/menu/menu.stories.tsx | 4 +- src/core/navigation/pagination/index.tsx | 14 +---- .../navigation/pagination/pagination.spec.tsx | 2 +- .../pagination/pagination.stories.tsx | 2 +- src/core/navigation/pagination/styles.ts | 9 +++ src/core/navigation/sidebar/index.tsx | 18 +----- src/core/navigation/sidebar/sidebar.spec.tsx | 4 +- .../navigation/sidebar/sidebar.stories.tsx | 4 +- src/core/navigation/sidebar/styles.ts | 13 ++++ src/core/navigation/stepper/index.tsx | 2 +- src/core/navigation/stepper/stepper.spec.tsx | 2 +- .../navigation/stepper/stepper.stories.tsx | 2 +- src/core/navigation/tabs/index.tsx | 2 +- src/core/navigation/tabs/tabs.spec.tsx | 2 +- src/core/navigation/tabs/tabs.stories.tsx | 2 +- src/core/surfaces/box/box.spec.tsx | 4 +- src/core/surfaces/box/box.stories.tsx | 2 +- src/core/surfaces/box/index.tsx | 4 +- src/core/surfaces/card/card.spec.tsx | 2 +- src/core/surfaces/card/card.stories.tsx | 2 +- .../surfaces/container/container.spec.tsx | 2 +- .../surfaces/container/container.stories.tsx | 2 +- src/core/surfaces/container/index.tsx | 2 +- src/core/surfaces/content/content.spec.tsx | 2 +- src/core/surfaces/content/content.stories.tsx | 2 +- src/core/surfaces/content/index.tsx | 14 +---- src/core/surfaces/content/styles.ts | 12 ++++ .../expansion-panel/expansion-panel.spec.tsx | 2 +- .../expansion-panel.stories.tsx | 8 +-- src/core/surfaces/expansion-panel/index.tsx | 2 +- src/core/surfaces/header/header.spec.tsx | 2 +- src/core/surfaces/header/header.stories.tsx | 2 +- src/core/surfaces/header/index.tsx | 2 +- src/core/surfaces/paper/index.tsx | 2 +- src/core/surfaces/paper/paper.spec.tsx | 2 +- src/core/surfaces/paper/paper.stories.tsx | 2 +- src/core/surfaces/step-card/index.tsx | 4 +- .../surfaces/step-card/step-card-details.tsx | 2 +- .../surfaces/step-card/step-card-panel.tsx | 2 +- .../surfaces/step-card/step-card.stories.tsx | 4 +- src/core/surfaces/step-card/styles.ts | 2 +- src/experimental/actions/actions.spec.tsx | 2 +- src/experimental/actions/actions.stories.tsx | 2 +- src/experimental/actions/index.tsx | 2 +- .../auto-complete-lab.stories.tsx | 4 +- src/experimental/auto-complete-lab/index.tsx | 2 +- src/experimental/avatar/avatar.spec.tsx | 2 +- src/experimental/avatar/avatar.stories.tsx | 2 +- src/experimental/avatar/index.tsx | 4 +- .../breadcrumbs/breadcrumbs.spec.tsx | 2 +- .../breadcrumbs/breadcrumbs.stories.tsx | 10 ++-- src/experimental/breadcrumbs/index.tsx | 2 +- src/experimental/button/index.tsx | 16 ++--- src/experimental/button/styles.ts | 9 +++ src/experimental/card/card.spec.tsx | 2 +- src/experimental/card/card.stories.tsx | 4 +- src/experimental/card/index.tsx | 51 ++++------------ src/experimental/card/styles.ts | 26 ++++++++ .../dialog/__test__/dialog.spec.tsx | 2 +- src/experimental/dialog/confirm-dialog.tsx | 2 +- src/experimental/dialog/dialog.stories.tsx | 24 ++++---- src/experimental/dialog/dialog.tsx | 2 +- src/experimental/dialog/remove-dialog.tsx | 2 +- src/experimental/fab/fab-wrapper.tsx | 20 +------ src/experimental/fab/fab.stories.tsx | 2 +- src/experimental/fab/fab.tsx | 2 +- src/experimental/fab/styles.ts | 17 ++++++ src/experimental/index.ts | 8 +-- src/experimental/loading/index.tsx | 11 +--- src/experimental/loading/loading.spec.tsx | 2 +- src/experimental/loading/loading.stories.tsx | 2 +- src/experimental/loading/styles.ts | 8 +++ src/experimental/nothing-found/index.tsx | 8 +-- .../nothing-found/nothing-found.spec.tsx | 2 +- .../nothing-found/nothing-found.stories.tsx | 2 +- src/experimental/panel/index.tsx | 27 +-------- src/experimental/panel/panel.spec.tsx | 2 +- src/experimental/panel/panel.stories.tsx | 2 +- src/experimental/panel/styles.ts | 24 ++++++++ src/experimental/sidebar/index.tsx | 2 +- src/experimental/sidebar/sidebar.spec.tsx | 2 +- src/experimental/sidebar/sidebar.stories.tsx | 2 +- src/experimental/skeleton/index.tsx | 2 +- src/experimental/skeleton/skeleton.spec.tsx | 2 +- .../skeleton/skeleton.stories.tsx | 2 +- src/experimental/visibility-icon/index.tsx | 15 +---- src/experimental/visibility-icon/styles.ts | 7 +++ .../visibility-icon/visibility-icon.spec.tsx | 2 +- .../visibility-icon.stories.tsx | 2 +- src/index.ts | 2 +- src/test/mocks/data-table-hidden-mock.tsx | 6 +- src/test/mocks/data-table-mock.tsx | 6 +- src/test/mocks/date-time-mock.tsx | 2 +- src/test/mocks/editable-table-date-mock.tsx | 2 +- src/test/mocks/editable-table-mock.tsx | 2 +- src/test/mocks/pin-input-mock.tsx | 2 +- src/test/mocks/radio-group-mock.tsx | 2 +- src/test/mocks/select-mock.tsx | 2 +- src/test/mocks/step-card-mock.tsx | 2 +- src/test/mocks/text-field-mock.tsx | 2 +- src/test/mocks/text-field-options-mock.tsx | 2 +- 236 files changed, 619 insertions(+), 629 deletions(-) create mode 100644 src/core/data-display/advertise/styles.ts create mode 100644 src/core/data-display/menu-item/styles.ts create mode 100644 src/core/data-display/node/styles.ts create mode 100644 src/core/feedback/validation-dialog/styles.ts create mode 100644 src/core/inputs/chip-field/styles.ts create mode 100644 src/core/inputs/pin-input/styles.ts create mode 100644 src/core/navigation/pagination/styles.ts create mode 100644 src/core/navigation/sidebar/styles.ts create mode 100644 src/core/surfaces/content/styles.ts create mode 100644 src/experimental/button/styles.ts create mode 100644 src/experimental/card/styles.ts create mode 100644 src/experimental/fab/styles.ts create mode 100644 src/experimental/loading/styles.ts create mode 100644 src/experimental/panel/styles.ts create mode 100644 src/experimental/visibility-icon/styles.ts diff --git a/src/core/context/styles-provider/index.tsx b/src/core/context/styles-provider/index.tsx index 8e69b1d5..130c9760 100644 --- a/src/core/context/styles-provider/index.tsx +++ b/src/core/context/styles-provider/index.tsx @@ -1,2 +1,3 @@ import { StylesProvider } from '@material-ui/core/styles' + export default StylesProvider diff --git a/src/core/data-display/advertise/__snapshots__/advertise.spec.tsx.snap b/src/core/data-display/advertise/__snapshots__/advertise.spec.tsx.snap index c65d9955..84e6c773 100644 --- a/src/core/data-display/advertise/__snapshots__/advertise.spec.tsx.snap +++ b/src/core/data-display/advertise/__snapshots__/advertise.spec.tsx.snap @@ -3,19 +3,19 @@ exports[`Advertise should match snapshot 1`] = ` <div> <div - class="MuiPaper-root sc-beySPh gShNvO MuiPaper-elevation1 MuiPaper-rounded" + class="MuiPaper-root sc-guDLey eZPlpZ MuiPaper-elevation1 MuiPaper-rounded" role="mui-paper-container" style="padding: 4px;" > <p - class="MuiTypography-root MuiTypography-body2" - style="margin: 0px 12px; padding: 6px 18px; border-left: 1px solid #bdbdbd;" + class="MuiTypography-root sc-beySPh fcGFSo MuiTypography-body2" + style="margin: 0px 12px; padding: 6px 18px;" > comment </p> <span - class="MuiTypography-root MuiTypography-caption" - style="margin: 0px 12px; padding: 6px 18px; border-left: 1px solid #bdbdbd;" + class="MuiTypography-root sc-beySPh fcGFSo MuiTypography-caption" + style="margin: 0px 12px; padding: 6px 18px;" > author </span> diff --git a/src/core/data-display/advertise/index.tsx b/src/core/data-display/advertise/index.tsx index 6a0e7e94..7c66cd95 100644 --- a/src/core/data-display/advertise/index.tsx +++ b/src/core/data-display/advertise/index.tsx @@ -1,12 +1,7 @@ import React from 'react' import type { CSSProperties } from 'react' -import { default as styled } from 'styled-components' import type { DefaultProps } from '../../types' -import { Typography } from '@/core/data-display/typography' -import MuiPaper from '@/core/surfaces/paper' -import { theme } from '@/theme' - -const { grays } = theme.colors +import { AdvertiseTypography, Paper } from './styles' export interface AdvertiseProps extends DefaultProps { /** @@ -18,7 +13,7 @@ export interface AdvertiseProps extends DefaultProps { */ author: string /** - * The style of the comment + * The style of the comments * @optional */ commentStyle?: CSSProperties @@ -29,17 +24,6 @@ export interface AdvertiseProps extends DefaultProps { authorStyle?: CSSProperties } -const styles = { - border: { - borderLeft: `1px solid ${grays.g5}` - } -} - -const Paper = styled(MuiPaper)` - display: flex; - flex-direction: column; -` - const Advertise = ({ comment, author, @@ -49,19 +33,19 @@ const Advertise = ({ ...otherProps }: AdvertiseProps) => ( <Paper padding={padding} {...otherProps}> - <Typography + <AdvertiseTypography margin='0 12px' padding='6px 18px' - style={{ ...styles.border, ...commentStyle }}> + style={{ ...commentStyle }}> {comment} - </Typography> - <Typography + </AdvertiseTypography> + <AdvertiseTypography margin='0px 12px' padding='6px 18px' variant='caption' - style={{ ...styles.border, ...authorStyle }}> + style={{ ...authorStyle }}> {author} - </Typography> + </AdvertiseTypography> </Paper> ) diff --git a/src/core/data-display/advertise/styles.ts b/src/core/data-display/advertise/styles.ts new file mode 100644 index 00000000..8d87f77b --- /dev/null +++ b/src/core/data-display/advertise/styles.ts @@ -0,0 +1,17 @@ +import { default as styled } from 'styled-components' +import Typography from '@/core/data-display/typography' +import MuiPaper from '@/core/surfaces/paper' +import { theme } from '@/theme' + +const { grays } = theme.colors + +export const AdvertiseTypography = styled(Typography)` + && { + border-left: 1px solid ${grays.g5}; + } +` + +export const Paper = styled(MuiPaper)` + display: flex; + flex-direction: column; +` diff --git a/src/core/data-display/avatar/avatar.spec.tsx b/src/core/data-display/avatar/avatar.spec.tsx index 9c388b1e..dbb12476 100644 --- a/src/core/data-display/avatar/avatar.spec.tsx +++ b/src/core/data-display/avatar/avatar.spec.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Typography } from '@/core/data-display/typography' -import { Avatar } from '.' +import Typography from '@/core/data-display/typography' +import Avatar from '.' describe('Avatar', () => { it('should render first letter', () => { diff --git a/src/core/data-display/avatar/avatar.stories.tsx b/src/core/data-display/avatar/avatar.stories.tsx index 80dc8fd1..cf7d7914 100644 --- a/src/core/data-display/avatar/avatar.stories.tsx +++ b/src/core/data-display/avatar/avatar.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Avatar } from '.' +import Avatar from '.' export default { title: 'DataDisplay/Avatar', diff --git a/src/core/data-display/avatar/index.tsx b/src/core/data-display/avatar/index.tsx index cef8231c..cd8e738a 100644 --- a/src/core/data-display/avatar/index.tsx +++ b/src/core/data-display/avatar/index.tsx @@ -23,7 +23,7 @@ const useStyles = makeStyles((theme: Theme) => { }) }) -export const Avatar = ({ +const Avatar = ({ children, primary, className, diff --git a/src/core/data-display/badge/badge.spec.tsx b/src/core/data-display/badge/badge.spec.tsx index c1cea00c..7e8bd3d3 100644 --- a/src/core/data-display/badge/badge.spec.tsx +++ b/src/core/data-display/badge/badge.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Badge } from '.' +import Badge from '.' describe('Badge', () => { it('should render', () => { diff --git a/src/core/data-display/badge/badge.stories.tsx b/src/core/data-display/badge/badge.stories.tsx index 0dce0a80..e3b6a928 100644 --- a/src/core/data-display/badge/badge.stories.tsx +++ b/src/core/data-display/badge/badge.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Button } from '@/core/inputs/button' -import { Badge } from '.' +import Button from '@/core/inputs/button' +import Badge from '.' export default { title: 'DataDisplay/Badge', diff --git a/src/core/data-display/badge/index.tsx b/src/core/data-display/badge/index.tsx index ad2dd811..909b44a2 100644 --- a/src/core/data-display/badge/index.tsx +++ b/src/core/data-display/badge/index.tsx @@ -32,7 +32,7 @@ const useBadgeStyles = (position: BadgeProps['position']) => { return getStyles() } -export const Badge = (props: BadgeProps) => { +const Badge = (props: BadgeProps) => { const { children, counter, diff --git a/src/core/data-display/chapter/chapter.spec.tsx b/src/core/data-display/chapter/chapter.spec.tsx index 03b4a475..b9a02920 100644 --- a/src/core/data-display/chapter/chapter.spec.tsx +++ b/src/core/data-display/chapter/chapter.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Chapter } from '.' +import Chapter from '.' describe('Chapter', () => { it('should render', () => { diff --git a/src/core/data-display/chapter/chapter.stories.tsx b/src/core/data-display/chapter/chapter.stories.tsx index 3885f704..0087159c 100644 --- a/src/core/data-display/chapter/chapter.stories.tsx +++ b/src/core/data-display/chapter/chapter.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Chapter } from '.' +import Chapter from '.' export default { title: 'DataDisplay/Chapter', diff --git a/src/core/data-display/chapter/index.tsx b/src/core/data-display/chapter/index.tsx index fe2c71b8..c94d07ff 100644 --- a/src/core/data-display/chapter/index.tsx +++ b/src/core/data-display/chapter/index.tsx @@ -2,7 +2,7 @@ import React from 'react' import type { CSSProperties, ReactNode } from 'react' import type { DefaultProps } from '../../types' import type { TypographyProps } from '@material-ui/core/Typography' -import { Typography } from '@/core/data-display/typography' +import Typography from '@/core/data-display/typography' import { Container, StyledLine } from './styles' export interface LineProps extends DefaultProps { @@ -29,7 +29,7 @@ export interface LineProps extends DefaultProps { 'data-testid'?: string } -export const Chapter = ({ +const Chapter = ({ padding, margin, style, diff --git a/src/core/data-display/chip/chip.spec.tsx b/src/core/data-display/chip/chip.spec.tsx index 1a112523..4b1f8674 100644 --- a/src/core/data-display/chip/chip.spec.tsx +++ b/src/core/data-display/chip/chip.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen, waitFor } from '@testing-library/react' -import { Chip } from '.' +import Chip from '.' describe('Chip', () => { it('should render', () => { diff --git a/src/core/data-display/chip/chip.stories.tsx b/src/core/data-display/chip/chip.stories.tsx index d37043a1..c157503b 100644 --- a/src/core/data-display/chip/chip.stories.tsx +++ b/src/core/data-display/chip/chip.stories.tsx @@ -1,8 +1,8 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Avatar } from '@/core/data-display/avatar' +import Avatar from '@/core/data-display/avatar' import { Face } from '@/icons' -import { Chip } from '.' +import Chip from '.' export default { title: 'DataDisplay/Chip', diff --git a/src/core/data-display/chip/index.tsx b/src/core/data-display/chip/index.tsx index 0a2b76f9..6a5f9095 100644 --- a/src/core/data-display/chip/index.tsx +++ b/src/core/data-display/chip/index.tsx @@ -22,7 +22,7 @@ const useStyles = makeStyles({ } }) -export const Chip = ({ +const Chip = ({ square, padding, margin, diff --git a/src/core/data-display/data-table/data-table-action.tsx b/src/core/data-display/data-table/data-table-action.tsx index ddf384fa..0b6c108e 100644 --- a/src/core/data-display/data-table/data-table-action.tsx +++ b/src/core/data-display/data-table/data-table-action.tsx @@ -1,5 +1,5 @@ -import type { ReactNode } from 'react' import React from 'react' +import type { ReactNode } from 'react' import IconButton from '@material-ui/core/IconButton' export type DataTableActionProps = { diff --git a/src/core/data-display/data-table/data-table-field.tsx b/src/core/data-display/data-table/data-table-field.tsx index 970a9ac9..dcc5e6e6 100644 --- a/src/core/data-display/data-table/data-table-field.tsx +++ b/src/core/data-display/data-table/data-table-field.tsx @@ -25,7 +25,7 @@ interface ITable<D extends Record<string, unknown>> { } } -export const DataTableField = <D extends Record<string, unknown>>( +const DataTableField = <D extends Record<string, unknown>>( props: ITable<D> ) => { const { rows, header, checkbox, checkboxProps, setRows } = props @@ -230,3 +230,5 @@ export const DataTableField = <D extends Record<string, unknown>>( </Table> ) } + +export default DataTableField diff --git a/src/core/data-display/data-table/data-table-pagination-actions.tsx b/src/core/data-display/data-table/data-table-pagination-actions.tsx index bf8fc105..f1479a70 100644 --- a/src/core/data-display/data-table/data-table-pagination-actions.tsx +++ b/src/core/data-display/data-table/data-table-pagination-actions.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { MouseEvent } from 'react' -import { IconButton } from '@/core/inputs/icon-button' +import IconButton from '@/core/inputs/icon-button' import { FirstPage, LastPage, diff --git a/src/core/data-display/data-table/data-table-query-paginated.stories.tsx b/src/core/data-display/data-table/data-table-query-paginated.stories.tsx index 57321bae..557c7f4b 100644 --- a/src/core/data-display/data-table/data-table-query-paginated.stories.tsx +++ b/src/core/data-display/data-table/data-table-query-paginated.stories.tsx @@ -6,7 +6,7 @@ import { Skeleton } from '@mui/material' import format from 'date-fns/format' import type { ColumnSpec, DataTableController, Identifier } from './types' import type { Meta } from '@storybook/react' -import { Button } from '@/core/inputs/button' +import Button from '@/core/inputs/button' import { Cancel as CancelIcon, Check as CheckIcon, @@ -15,7 +15,7 @@ import { Save as SaveIcon } from '@/icons' import { DataTableAction } from './data-table-action' -import { DataTableQueryPaginated } from './data-table-query-paginated' +import DataTableQueryPaginated from './data-table-query-paginated' import { RowMode } from './types' import { usePaginated } from './use-paginated' diff --git a/src/core/data-display/data-table/data-table-query-paginated.tsx b/src/core/data-display/data-table/data-table-query-paginated.tsx index a85e881a..b4adf42a 100644 --- a/src/core/data-display/data-table/data-table-query-paginated.tsx +++ b/src/core/data-display/data-table/data-table-query-paginated.tsx @@ -128,7 +128,7 @@ const defaultPagination: PaginationOptions = { rowsPerPageOptions: [5, 10, 25, 50] } -export const DataTableQueryPaginated = <D extends Data, V extends StackView>( +const DataTableQueryPaginated = <D extends Data, V extends StackView>( props: DataTableProps<D, V> ) => { const pagination = { ...defaultPagination, ...props.pagination } diff --git a/src/core/data-display/data-table/data-table.stories.tsx b/src/core/data-display/data-table/data-table.stories.tsx index b00c5845..bce39670 100644 --- a/src/core/data-display/data-table/data-table.stories.tsx +++ b/src/core/data-display/data-table/data-table.stories.tsx @@ -4,8 +4,8 @@ import format from 'date-fns/format' import { v4 as uuid } from 'uuid' import type { ColumnSpec, DataTableController, Identifier } from './types' import type { Meta } from '@storybook/react' -import { Typography } from '@/core/data-display/typography' -import { Button } from '@/core/inputs/button' +import Typography from '@/core/data-display/typography' +import Button from '@/core/inputs/button' import { Delete as DeleteIcon, Edit as EditIcon, @@ -15,9 +15,9 @@ import { Visibility as VisibilityIcon, VisibilityOff as VisibilityOffIcon } from '@/icons' -import { DataTable } from './data-table' +import DataTable from './data-table' import { DataTableAction } from './data-table-action' -import { DataTableField } from './data-table-field' +import DataTableField from './data-table-field' import { RowMode } from './types' export default { diff --git a/src/core/data-display/data-table/data-table.tsx b/src/core/data-display/data-table/data-table.tsx index 7e76460b..de717416 100644 --- a/src/core/data-display/data-table/data-table.tsx +++ b/src/core/data-display/data-table/data-table.tsx @@ -131,7 +131,7 @@ const sliceData = <D,>(data: D[], page: number, rowsPerPage: number) => { return data.slice(start, end) } -export const DataTable = <D extends Data, V extends StackView>( +const DataTable = <D extends Data, V extends StackView>( props: DataTableProps<D, V> ) => { const [page, setPage] = useState(0) diff --git a/src/core/data-display/data-table/index.ts b/src/core/data-display/data-table/index.ts index aad255b0..20b2b608 100644 --- a/src/core/data-display/data-table/index.ts +++ b/src/core/data-display/data-table/index.ts @@ -1,5 +1,4 @@ export { default } from './data-table' -export { DataTableField } from './data-table-field' export { DataTableAction } from './data-table-action' export { default as DataTableQueryPaginated } from './data-table-query-paginated' export type { diff --git a/src/core/data-display/data-table/rows.tsx b/src/core/data-display/data-table/rows.tsx index dd2cec37..74d719d0 100644 --- a/src/core/data-display/data-table/rows.tsx +++ b/src/core/data-display/data-table/rows.tsx @@ -3,9 +3,9 @@ import type { ReactNode } from 'react' import TableCell from '@material-ui/core/TableCell' import TableRow from '@material-ui/core/TableRow' import type { ColumnSpec, Data, Errors, PartialData } from './types' -import { DateTime } from '@/core/inputs/date-time' -import { MaskField } from '@/core/inputs/mask-field' -import { TextField } from '@/core/inputs/text-field' +import DateTime from '@/core/inputs/date-time' +import MaskField from '@/core/inputs/mask-field' +import TextField from '@/core/inputs/text-field' import { RowMode } from './types' type RowStateUpdater = <D extends Data>( diff --git a/src/core/data-display/divider/divider.spec.tsx b/src/core/data-display/divider/divider.spec.tsx index f709a622..7edf2366 100644 --- a/src/core/data-display/divider/divider.spec.tsx +++ b/src/core/data-display/divider/divider.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Divider } from '.' +import Divider from '.' describe('Divider', () => { it('should render', () => { diff --git a/src/core/data-display/divider/divider.stories.tsx b/src/core/data-display/divider/divider.stories.tsx index 6fd8c082..9dd5e87f 100644 --- a/src/core/data-display/divider/divider.stories.tsx +++ b/src/core/data-display/divider/divider.stories.tsx @@ -1,8 +1,8 @@ import React from 'react' import type { Meta } from '@storybook/react' -import { List } from '@/core/data-display/list' +import List from '@/core/data-display/list' import ListItem from '@/core/data-display/list-item' -import { Divider } from '.' +import Divider from '.' export default { title: 'DataDisplay/Divider', diff --git a/src/core/data-display/divider/index.tsx b/src/core/data-display/divider/index.tsx index c1d5cf62..9d97c075 100644 --- a/src/core/data-display/divider/index.tsx +++ b/src/core/data-display/divider/index.tsx @@ -7,7 +7,7 @@ export interface DividerProps extends DefaultProps, MuiDividerProps { 'data-testid'?: string } -export const Divider = ({ +const Divider = ({ margin, padding, style = {}, diff --git a/src/core/data-display/editable-table/editable-table.stories.tsx b/src/core/data-display/editable-table/editable-table.stories.tsx index 98f1f0f9..d1feeb75 100644 --- a/src/core/data-display/editable-table/editable-table.stories.tsx +++ b/src/core/data-display/editable-table/editable-table.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { EditableTable } from '.' +import EditableTable from '.' export default { title: 'DataDisplay/EditTable', diff --git a/src/core/data-display/editable-table/index.tsx b/src/core/data-display/editable-table/index.tsx index dcdebdfe..b5990469 100644 --- a/src/core/data-display/editable-table/index.tsx +++ b/src/core/data-display/editable-table/index.tsx @@ -11,11 +11,11 @@ import MaterialTable, { import { omit, contains, propOr } from 'ramda' import type { Column, Options } from 'material-table' import ListItem from '@/core/data-display/list-item' -import { AutoComplete } from '@/core/inputs/auto-complete' -import { Button } from '@/core/inputs/button' -import { DateTime } from '@/core/inputs/date-time' -import { MaskField } from '@/core/inputs/mask-field' -import { TextField } from '@/core/inputs/text-field' +import AutoComplete from '@/core/inputs/auto-complete' +import Button from '@/core/inputs/button' +import DateTime from '@/core/inputs/date-time' +import MaskField from '@/core/inputs/mask-field' +import TextField from '@/core/inputs/text-field' import { NoteAdd as IconAdd, Done as IconDone, @@ -103,9 +103,7 @@ export interface EditableTableProps<T extends object> { export type TSuggestion = { label: string; value: string } -export const EditableTable = <T extends object>( - props: EditableTableProps<T> -) => { +const EditableTable = <T extends object>(props: EditableTableProps<T>) => { const addButtonColor = (props.color !== 'disabled' && props.color) || 'primary' const valueRef = useRef<string | number>() diff --git a/src/core/data-display/editable-table/styles.ts b/src/core/data-display/editable-table/styles.ts index 90d50e32..d1def1d6 100644 --- a/src/core/data-display/editable-table/styles.ts +++ b/src/core/data-display/editable-table/styles.ts @@ -1,7 +1,7 @@ import { MTableEditRow, MTableBodyRow } from 'material-table' import { default as styled } from 'styled-components' -import { Typography } from '@/core/data-display/typography' -import { Button } from '@/core/inputs/button' +import Typography from '@/core/data-display/typography' +import Button from '@/core/inputs/button' export const DARK = 'rgba(189,189,189,0)' export const GREY = 'rgba(189,189,189,1)' diff --git a/src/core/data-display/fab/fab.spec.tsx b/src/core/data-display/fab/fab.spec.tsx index 281feac4..7fbbab67 100644 --- a/src/core/data-display/fab/fab.spec.tsx +++ b/src/core/data-display/fab/fab.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Fab } from '.' +import Fab from '.' describe('Fab', () => { it('should render', () => { diff --git a/src/core/data-display/fab/fab.stories.tsx b/src/core/data-display/fab/fab.stories.tsx index 0832d7a8..c7be3379 100644 --- a/src/core/data-display/fab/fab.stories.tsx +++ b/src/core/data-display/fab/fab.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Fab } from '.' +import Fab from '.' export default { title: 'DataDisplay/Fab', diff --git a/src/core/data-display/fab/index.tsx b/src/core/data-display/fab/index.tsx index e03bfb80..99754bd5 100644 --- a/src/core/data-display/fab/index.tsx +++ b/src/core/data-display/fab/index.tsx @@ -9,7 +9,7 @@ export interface FabProps extends DefaultProps, MuiFabProps { children: ReactElement<Record<string, unknown>> } -export const Fab = ({ +const Fab = ({ children, margin, padding, diff --git a/src/core/data-display/line/index.tsx b/src/core/data-display/line/index.tsx index 65975076..b451ca5f 100644 --- a/src/core/data-display/line/index.tsx +++ b/src/core/data-display/line/index.tsx @@ -12,7 +12,7 @@ export interface LineProps extends DefaultProps { 'data-testid'?: string } -export const Line = ({ +const Line = ({ padding, margin, style, diff --git a/src/core/data-display/line/line.spec.tsx b/src/core/data-display/line/line.spec.tsx index 0532940c..49a9ab99 100644 --- a/src/core/data-display/line/line.spec.tsx +++ b/src/core/data-display/line/line.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Line } from '.' +import Line from '.' import { theme } from '@/theme' const { grays, secondary } = theme.colors diff --git a/src/core/data-display/line/line.stories.tsx b/src/core/data-display/line/line.stories.tsx index 0210fd27..5496ce00 100644 --- a/src/core/data-display/line/line.stories.tsx +++ b/src/core/data-display/line/line.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Line } from '.' +import Line from '.' export default { title: 'DataDisplay/Line', diff --git a/src/core/data-display/list-item/index.tsx b/src/core/data-display/list-item/index.tsx index 7c31d106..5f6bc8d0 100644 --- a/src/core/data-display/list-item/index.tsx +++ b/src/core/data-display/list-item/index.tsx @@ -1,5 +1,5 @@ -import type { MouseEvent } from 'react' import React, { Fragment } from 'react' +import type { MouseEvent } from 'react' import { ListItem as MuiListItem, ListItemAvatar as MuiListItemAvatar, diff --git a/src/core/data-display/list/index.tsx b/src/core/data-display/list/index.tsx index 7eb43083..46fb861c 100644 --- a/src/core/data-display/list/index.tsx +++ b/src/core/data-display/list/index.tsx @@ -40,7 +40,7 @@ const useStyles = makeStyles((theme: Theme) => }) ) -export const List = ({ +const List = ({ title, padding, margin, diff --git a/src/core/data-display/list/list.spec.tsx b/src/core/data-display/list/list.spec.tsx index 86e849f1..aad6ea5a 100644 --- a/src/core/data-display/list/list.spec.tsx +++ b/src/core/data-display/list/list.spec.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' import ListItem from '@/core/data-display/list-item' -import { List } from '.' +import List from '.' describe('List', () => { it('should render', () => { diff --git a/src/core/data-display/list/list.stories.tsx b/src/core/data-display/list/list.stories.tsx index d2673a7f..1e0ef7fa 100644 --- a/src/core/data-display/list/list.stories.tsx +++ b/src/core/data-display/list/list.stories.tsx @@ -2,8 +2,8 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' import ListItem from '@/core/data-display/list-item' import { Backup } from '@/icons' -import { Avatar } from '../avatar' -import { List } from '.' +import Avatar from '../avatar' +import List from '.' export default { title: 'DataDisplay/List', diff --git a/src/core/data-display/menu-item/index.tsx b/src/core/data-display/menu-item/index.tsx index 073d9af8..83debb92 100644 --- a/src/core/data-display/menu-item/index.tsx +++ b/src/core/data-display/menu-item/index.tsx @@ -1,11 +1,10 @@ import React from 'react' import type { MouseEvent, MutableRefObject } from 'react' -import { MenuItem as MuiMenuItem } from '@mui/material' -import { default as styled } from 'styled-components' import type { DefaultProps } from '../../types' import type { MenuItemClassKey } from '@material-ui/core/MenuItem' import type { ClassNameMap } from '@material-ui/core/styles/withStyles' import type { Omit } from 'ramda' +import { MenuItems } from './styles' export interface ListItemProps extends Omit<DefaultProps, 'name'> { title?: string @@ -18,18 +17,6 @@ export interface ListItemProps extends Omit<DefaultProps, 'name'> { classes?: Partial<ClassNameMap<MenuItemClassKey>> | undefined } -const MenuItems = styled(MuiMenuItem)` - && { - outline: none; - cursor: pointer; - font-family: Roboto, Helvetica, Arial, sans-serif; - - &:hover { - background-color: #e0e0e0; - } - } -` - const MenuItem = (props: ListItemProps) => { const { padding, margin, style } = props diff --git a/src/core/data-display/menu-item/styles.ts b/src/core/data-display/menu-item/styles.ts new file mode 100644 index 00000000..05cf8f1e --- /dev/null +++ b/src/core/data-display/menu-item/styles.ts @@ -0,0 +1,14 @@ +import { MenuItem as MuiMenuItem } from '@mui/material' +import { default as styled } from 'styled-components' + +export const MenuItems = styled(MuiMenuItem)` + && { + outline: none; + cursor: pointer; + font-family: Roboto, Helvetica, Arial, sans-serif; + + &:hover { + background-color: #e0e0e0; + } + } +` diff --git a/src/core/data-display/node/index.tsx b/src/core/data-display/node/index.tsx index 2ed08184..e79f2bd8 100644 --- a/src/core/data-display/node/index.tsx +++ b/src/core/data-display/node/index.tsx @@ -1,53 +1,12 @@ import React, { useState } from 'react' -import { default as styled } from 'styled-components' import type { DefaultProps } from '../../types' -import { - KeyboardArrowDown as IconArrowDown, - KeyboardArrowUp as IconArrowUp -} from '@/icons' -import { theme } from '@/theme' - -const { grays } = theme.colors +import { IconDown, IconUp, List, ListItem } from './styles' export interface NodeProps extends DefaultProps { name: string } -interface IListItem { - inset: boolean -} - -const styles = { - icon: { - fontSize: '24px', - marginRight: '12px' - } -} - -const Ul = styled.ul` - width: 350px; -` - -const Li = styled.li<IListItem>` - font-size: 16px; - margin: 12px; - background: #ffffff00; - padding: 12px; - padding-left: ${props => (props.inset ? '12px' : '48px')}; - list-style: none; - border-radius: 6px; - border: 1px solid ${grays.g5}; - transition: all 500ms ease; - cursor: pointer; - align-items: center; - display: flex; - &:hover { - background: ${grays.g7}; - border: 1px solid #009688; - } -` - -export const Node = (props: NodeProps) => { +const Node = (props: NodeProps) => { const [open, setOpen] = useState(false) const { id, name, children, style = {}, className } = props @@ -56,21 +15,17 @@ export const Node = (props: NodeProps) => { } const renderDropdownIcon = () => { - return open ? ( - <IconArrowUp style={styles.icon} /> - ) : ( - <IconArrowDown style={styles.icon} /> - ) + return open ? <IconUp /> : <IconDown /> } return ( - <Ul {...props} key={id || name} style={style} className={className}> - <Li inset={Boolean(children)} onClick={handleToggleOpen}> + <List {...props} key={id || name} style={style} className={className}> + <ListItem inset={Boolean(children)} onClick={handleToggleOpen}> {children && renderDropdownIcon()} {name} - </Li> + </ListItem> {open && children} - </Ul> + </List> ) } diff --git a/src/core/data-display/node/node.spec.tsx b/src/core/data-display/node/node.spec.tsx index 56128e7d..5a9fdcb5 100644 --- a/src/core/data-display/node/node.spec.tsx +++ b/src/core/data-display/node/node.spec.tsx @@ -2,7 +2,7 @@ import * as React from 'react' import { act } from 'react-dom/test-utils' import { render, screen } from '@testing-library/react' import { userEvent } from '@testing-library/user-event' -import { Node } from '.' +import Node from '.' describe('Node', () => { it('should render', () => { diff --git a/src/core/data-display/node/node.stories.tsx b/src/core/data-display/node/node.stories.tsx index 7bd74b41..c884aaa4 100644 --- a/src/core/data-display/node/node.stories.tsx +++ b/src/core/data-display/node/node.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Node } from '.' +import Node from '.' export default { title: 'DataDisplay/Node', diff --git a/src/core/data-display/node/styles.ts b/src/core/data-display/node/styles.ts new file mode 100644 index 00000000..5cf87d98 --- /dev/null +++ b/src/core/data-display/node/styles.ts @@ -0,0 +1,49 @@ +import { default as styled } from 'styled-components' +import { + KeyboardArrowDown as IconArrowDown, + KeyboardArrowUp as IconArrowUp +} from '@/icons' +import { theme } from '@/theme' + +const { grays } = theme.colors + +interface IListItem { + inset: boolean +} + +export const List = styled.ul` + width: 350px; +` + +export const ListItem = styled.li<IListItem>` + font-size: 16px; + margin: 12px; + background: #ffffff00; + padding: 12px; + padding-left: ${props => (props.inset ? '12px' : '48px')}; + list-style: none; + border-radius: 6px; + border: 1px solid ${grays.g5}; + transition: all 500ms ease; + cursor: pointer; + align-items: center; + display: flex; + &:hover { + background: ${grays.g7}; + border: 1px solid #009688; + } +` + +export const IconUp = styled(IconArrowUp)` + && { + font-size: 24px; + margin-right: 12px; + } +` + +export const IconDown = styled(IconArrowDown)` + && { + font-size: 24px; + margin-right: 12px; + } +` diff --git a/src/core/data-display/table/index.tsx b/src/core/data-display/table/index.tsx index 48298753..14420ef4 100644 --- a/src/core/data-display/table/index.tsx +++ b/src/core/data-display/table/index.tsx @@ -12,7 +12,7 @@ export interface TableProps spacing?: MuiTableProps['padding'] } -export const Table = ({ +const Table = ({ style, margin, padding, diff --git a/src/core/data-display/table/table.spec.tsx b/src/core/data-display/table/table.spec.tsx index b88b9868..634d968d 100644 --- a/src/core/data-display/table/table.spec.tsx +++ b/src/core/data-display/table/table.spec.tsx @@ -6,7 +6,7 @@ import TableBody from './table-body' import TableCell from './table-cell' import TableHead from './table-head' import TableRow from './table-row' -import { Table } from '.' +import Table from '.' interface IProps { onSort?: (name: string) => void diff --git a/src/core/data-display/table/table.stories.tsx b/src/core/data-display/table/table.stories.tsx index 3321758a..dad42f7a 100644 --- a/src/core/data-display/table/table.stories.tsx +++ b/src/core/data-display/table/table.stories.tsx @@ -4,7 +4,7 @@ import TableBody from './table-body' import TableCell from './table-cell' import TableHead from './table-head' import TableRow from './table-row' -import { Table } from '.' +import Table from '.' export default { title: 'DataDisplay/Table', diff --git a/src/core/data-display/tree/index.tsx b/src/core/data-display/tree/index.tsx index 42f78307..5c145b28 100644 --- a/src/core/data-display/tree/index.tsx +++ b/src/core/data-display/tree/index.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { ReactNode } from 'react' import { omit } from 'ramda' -import { Node } from '../node' +import Node from '../node' export interface INode { id: string | number @@ -13,7 +13,7 @@ export interface TreeProps { nodes?: INode[] } -export const Tree = ({ nodes = [], ...otherProps }: TreeProps): JSX.Element => { +const Tree = ({ nodes = [], ...otherProps }: TreeProps): JSX.Element => { const renderNode = ( node: INode, index: string, diff --git a/src/core/data-display/tree/tree.spec.tsx b/src/core/data-display/tree/tree.spec.tsx index 3c5ad55b..75187639 100644 --- a/src/core/data-display/tree/tree.spec.tsx +++ b/src/core/data-display/tree/tree.spec.tsx @@ -2,7 +2,7 @@ import * as React from 'react' import { act } from 'react-dom/test-utils' import { render, screen } from '@testing-library/react' import { userEvent } from '@testing-library/user-event' -import { Tree } from '.' +import Tree from '.' describe('Tree', () => { const NODES = [ diff --git a/src/core/data-display/tree/tree.stories.tsx b/src/core/data-display/tree/tree.stories.tsx index 51c70900..bc7b33a1 100644 --- a/src/core/data-display/tree/tree.stories.tsx +++ b/src/core/data-display/tree/tree.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Tree } from '.' +import Tree from '.' export default { title: 'DataDisplay/Tree', diff --git a/src/core/data-display/typography/index.tsx b/src/core/data-display/typography/index.tsx index 1d02bc3f..45126b9e 100644 --- a/src/core/data-display/typography/index.tsx +++ b/src/core/data-display/typography/index.tsx @@ -3,7 +3,7 @@ import MuiTypography from '@material-ui/core/Typography' import type { DefaultProps } from '../../types' import type { TypographyProps } from '@material-ui/core/Typography' -export const Typography = ({ +const Typography = ({ children, margin, padding, diff --git a/src/core/data-display/typography/typography.spec.tsx b/src/core/data-display/typography/typography.spec.tsx index 8a0f6340..81a55607 100644 --- a/src/core/data-display/typography/typography.spec.tsx +++ b/src/core/data-display/typography/typography.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Typography } from '.' +import Typography from '.' describe('Typography', () => { it('should render with no variant', () => { diff --git a/src/core/data-display/typography/typography.stories.tsx b/src/core/data-display/typography/typography.stories.tsx index 6b5080ce..ea288ad2 100644 --- a/src/core/data-display/typography/typography.stories.tsx +++ b/src/core/data-display/typography/typography.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Typography } from '.' +import Typography from '.' export default { title: 'DataDisplay/Typography', diff --git a/src/core/feedback/collapse/collapse.spec.tsx b/src/core/feedback/collapse/collapse.spec.tsx index 89c07341..008c0e77 100644 --- a/src/core/feedback/collapse/collapse.spec.tsx +++ b/src/core/feedback/collapse/collapse.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Collapse } from '.' +import Collapse from '.' describe('Collapse', () => { it('should render opened', () => { diff --git a/src/core/feedback/collapse/collapse.stories.tsx b/src/core/feedback/collapse/collapse.stories.tsx index 0fc87c0b..f47c41a9 100644 --- a/src/core/feedback/collapse/collapse.stories.tsx +++ b/src/core/feedback/collapse/collapse.stories.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Button } from '@/core/inputs/button' -import { Collapse } from '.' +import Button from '@/core/inputs/button' +import Collapse from '.' export default { title: 'Feedback/Collapse', diff --git a/src/core/feedback/collapse/index.tsx b/src/core/feedback/collapse/index.tsx index 61c4c0ec..799c9a57 100644 --- a/src/core/feedback/collapse/index.tsx +++ b/src/core/feedback/collapse/index.tsx @@ -10,7 +10,7 @@ export interface CollapseProps extends DefaultProps { children?: ReactNode } -export const Collapse = ({ +const Collapse = ({ children, padding, margin, diff --git a/src/core/feedback/dialog/dialog.spec.tsx b/src/core/feedback/dialog/dialog.spec.tsx index e529d19a..fd677b86 100644 --- a/src/core/feedback/dialog/dialog.spec.tsx +++ b/src/core/feedback/dialog/dialog.spec.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Button } from '@/core/inputs/button' -import { Dialog } from '.' +import Button from '@/core/inputs/button' +import Dialog from '.' describe('Dialog', () => { it('should render opened', () => { diff --git a/src/core/feedback/dialog/dialog.stories.tsx b/src/core/feedback/dialog/dialog.stories.tsx index 7222ee0d..f5b3acb7 100644 --- a/src/core/feedback/dialog/dialog.stories.tsx +++ b/src/core/feedback/dialog/dialog.stories.tsx @@ -1,8 +1,8 @@ import React, { useState } from 'react' import type { Meta } from '@storybook/react' -import { Typography } from '@/core/data-display/typography' -import { Button } from '@/core/inputs/button' -import { Dialog } from '.' +import Typography from '@/core/data-display/typography' +import Button from '@/core/inputs/button' +import Dialog from '.' export default { title: 'Feedback/Dialog', diff --git a/src/core/feedback/dialog/index.tsx b/src/core/feedback/dialog/index.tsx index 1253a175..eb606711 100644 --- a/src/core/feedback/dialog/index.tsx +++ b/src/core/feedback/dialog/index.tsx @@ -49,7 +49,7 @@ const useStyles = makeStyles({ } }) -export const Dialog = ({ +const Dialog = ({ snippet, style, padding, diff --git a/src/core/feedback/fade/fade.spec.tsx b/src/core/feedback/fade/fade.spec.tsx index 3bc97a0a..98aa8beb 100644 --- a/src/core/feedback/fade/fade.spec.tsx +++ b/src/core/feedback/fade/fade.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Fade } from '.' +import Fade from '.' describe('Fade', () => { it('should render closed', () => { diff --git a/src/core/feedback/fade/fade.stories.tsx b/src/core/feedback/fade/fade.stories.tsx index f1c12c62..32d2b299 100644 --- a/src/core/feedback/fade/fade.stories.tsx +++ b/src/core/feedback/fade/fade.stories.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react' import type { Meta } from '@storybook/react' -import { Button } from '@/core/inputs/button' -import { Fade } from '.' +import Button from '@/core/inputs/button' +import Fade from '.' export default { title: 'Feedback/Fade', diff --git a/src/core/feedback/fade/index.tsx b/src/core/feedback/fade/index.tsx index 5413a9ba..4b56b625 100644 --- a/src/core/feedback/fade/index.tsx +++ b/src/core/feedback/fade/index.tsx @@ -9,7 +9,7 @@ export interface FadeProps extends DefaultProps { children: ReactElement<Record<string, unknown>> } -export const Fade = ({ +const Fade = ({ children, padding, margin, diff --git a/src/core/feedback/grow/grow.spec.tsx b/src/core/feedback/grow/grow.spec.tsx index bd9258f6..315e7158 100644 --- a/src/core/feedback/grow/grow.spec.tsx +++ b/src/core/feedback/grow/grow.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Grow } from '.' +import Grow from '.' describe('Grow', () => { it('should render closed', () => { diff --git a/src/core/feedback/grow/grow.stories.tsx b/src/core/feedback/grow/grow.stories.tsx index 8c6d2716..6fc832e9 100644 --- a/src/core/feedback/grow/grow.stories.tsx +++ b/src/core/feedback/grow/grow.stories.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react' import type { Meta } from '@storybook/react' -import { Button } from '@/core/inputs/button' -import { Grow } from '.' +import Button from '@/core/inputs/button' +import Grow from '.' export default { title: 'Feedback/Grow', diff --git a/src/core/feedback/grow/index.tsx b/src/core/feedback/grow/index.tsx index 518d0587..4e6cadf6 100644 --- a/src/core/feedback/grow/index.tsx +++ b/src/core/feedback/grow/index.tsx @@ -9,7 +9,7 @@ export interface GrowProps extends DefaultProps { children?: ReactElement<Record<string, unknown>> } -export const Grow = ({ +const Grow = ({ children, padding, margin, diff --git a/src/core/feedback/progress/index.tsx b/src/core/feedback/progress/index.tsx index 6f8ed938..432cb27c 100644 --- a/src/core/feedback/progress/index.tsx +++ b/src/core/feedback/progress/index.tsx @@ -28,7 +28,7 @@ export interface ProgressProps extends DefaultProps { linear?: boolean } -export const Progress = ({ +const Progress = ({ linear, style = {}, margin, diff --git a/src/core/feedback/progress/progress.spec.tsx b/src/core/feedback/progress/progress.spec.tsx index a5f5df49..e042eb9b 100644 --- a/src/core/feedback/progress/progress.spec.tsx +++ b/src/core/feedback/progress/progress.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Progress } from '.' +import Progress from '.' describe('Progress', () => { it('should render circular', () => { diff --git a/src/core/feedback/progress/progress.stories.tsx b/src/core/feedback/progress/progress.stories.tsx index 67c88e34..feafb1d3 100644 --- a/src/core/feedback/progress/progress.stories.tsx +++ b/src/core/feedback/progress/progress.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Progress } from '.' +import Progress from '.' export default { title: 'Feedback/Progress', diff --git a/src/core/feedback/slide/index.tsx b/src/core/feedback/slide/index.tsx index 06508eaa..1f5597c3 100644 --- a/src/core/feedback/slide/index.tsx +++ b/src/core/feedback/slide/index.tsx @@ -10,7 +10,7 @@ export interface SlideProps extends DefaultProps { children?: ReactElement<Record<string, unknown>> } -export const Slide = ({ +const Slide = ({ children, direction, margin, diff --git a/src/core/feedback/slide/slide.spec.tsx b/src/core/feedback/slide/slide.spec.tsx index 8828850d..11ec2552 100644 --- a/src/core/feedback/slide/slide.spec.tsx +++ b/src/core/feedback/slide/slide.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Slide } from '.' +import Slide from '.' describe('Slide', () => { it('should render closed', () => { diff --git a/src/core/feedback/slide/slide.stories.tsx b/src/core/feedback/slide/slide.stories.tsx index edc31670..61516f22 100644 --- a/src/core/feedback/slide/slide.stories.tsx +++ b/src/core/feedback/slide/slide.stories.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Button } from '@/core/inputs/button' -import { Slide } from '.' +import Button from '@/core/inputs/button' +import Slide from '.' export default { title: 'Feedback/Slide', diff --git a/src/core/feedback/snackbar/index.tsx b/src/core/feedback/snackbar/index.tsx index b2feab3d..e1063ed5 100644 --- a/src/core/feedback/snackbar/index.tsx +++ b/src/core/feedback/snackbar/index.tsx @@ -74,7 +74,7 @@ const useStyles = makeStyles((theme: Theme) => }) ) -export const SnackBar = (props: SnackBarProps) => { +const SnackBar = (props: SnackBarProps) => { const { id, action, diff --git a/src/core/feedback/snackbar/snackbar.stories.tsx b/src/core/feedback/snackbar/snackbar.stories.tsx index d759985c..4cc10abf 100644 --- a/src/core/feedback/snackbar/snackbar.stories.tsx +++ b/src/core/feedback/snackbar/snackbar.stories.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Button } from '@/core/inputs/button' +import Button from '@/core/inputs/button' import Snackbar from '.' export default { diff --git a/src/core/feedback/tooltip/index.tsx b/src/core/feedback/tooltip/index.tsx index b3cc78e1..5a5c494a 100644 --- a/src/core/feedback/tooltip/index.tsx +++ b/src/core/feedback/tooltip/index.tsx @@ -27,7 +27,7 @@ export interface TooltipProps extends DefaultProps { enterDelay?: number } -export const Tooltip = ({ +const Tooltip = ({ children, withWrapper, wrapperStyle, diff --git a/src/core/feedback/tooltip/tool-tip.spec.tsx b/src/core/feedback/tooltip/tool-tip.spec.tsx index ed5e2504..33892967 100644 --- a/src/core/feedback/tooltip/tool-tip.spec.tsx +++ b/src/core/feedback/tooltip/tool-tip.spec.tsx @@ -3,7 +3,7 @@ import { act } from 'react-dom/test-utils' import { Button } from '@material-ui/core' import { render, screen } from '@testing-library/react' import { userEvent } from '@testing-library/user-event' -import { Tooltip } from '.' +import Tooltip from '.' describe('Tooltip', () => { it('should render a Tooltip', async () => { diff --git a/src/core/feedback/tooltip/tooltip.stories.tsx b/src/core/feedback/tooltip/tooltip.stories.tsx index 69f075af..6550e49f 100644 --- a/src/core/feedback/tooltip/tooltip.stories.tsx +++ b/src/core/feedback/tooltip/tooltip.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Button } from '@/core/inputs/button' -import { Tooltip } from '.' +import Button from '@/core/inputs/button' +import Tooltip from '.' export default { title: 'Feedback/Tooltip', diff --git a/src/core/feedback/validation-dialog/index.tsx b/src/core/feedback/validation-dialog/index.tsx index 36a781e3..5df905d4 100644 --- a/src/core/feedback/validation-dialog/index.tsx +++ b/src/core/feedback/validation-dialog/index.tsx @@ -1,10 +1,8 @@ import React from 'react' import type { FC, ReactNode } from 'react' -import { default as styled } from 'styled-components' -import { Typography } from '@/core/data-display/typography' -import { Button } from '@/core/inputs/button' -import { Actions } from '@/experimental/actions' -import { Dialog } from '../dialog' +import Button from '@/core/inputs/button' +import Actions from '@/experimental/actions' +import { DialogTypography, MuiDialog, ValidationWrapper } from './styles' export interface IValidateProps { open: boolean @@ -53,25 +51,6 @@ export enum ValidationStatus { Error = 'Error' } -const MuiDialog = styled(Dialog)` - div > div > h2 { - margin-top: 20px; - } -` - -const DialogTypography = styled(Typography)` - && { - font-size: 16px; - } -` - -const ValidationWrapper = styled.div` - display: flex; - align-items: center; - padding: 15px 0; - gap: 15px; -` - const ValidationDialog: FC<IValidateProps> = ({ open, failed, diff --git a/src/core/feedback/validation-dialog/styles.ts b/src/core/feedback/validation-dialog/styles.ts new file mode 100644 index 00000000..8bc6366f --- /dev/null +++ b/src/core/feedback/validation-dialog/styles.ts @@ -0,0 +1,22 @@ +import { default as styled } from 'styled-components' +import Typography from '@/core/data-display/typography' +import Dialog from '../dialog' + +export const MuiDialog = styled(Dialog)` + div > div > h2 { + margin-top: 20px; + } +` + +export const DialogTypography = styled(Typography)` + && { + font-size: 16px; + } +` + +export const ValidationWrapper = styled.div` + display: flex; + align-items: center; + padding: 15px 0; + gap: 15px; +` diff --git a/src/core/feedback/validation-dialog/validation-dialog.spec.tsx b/src/core/feedback/validation-dialog/validation-dialog.spec.tsx index 6d7cc767..88078470 100644 --- a/src/core/feedback/validation-dialog/validation-dialog.spec.tsx +++ b/src/core/feedback/validation-dialog/validation-dialog.spec.tsx @@ -8,6 +8,13 @@ import { theme } from '@/theme' const { action, secondary } = theme.colors +const responses: string[] = [] +const validations: IValidations[] = [] +const responsesDefault = ['Should', 'render', 'default', 'case'] +const responsesSuccess = ['Success', 'Success', 'Success', 'Success'] +const responsesLoading = ['Success', 'Success', 'Success', 'Loading'] +const responsesError = ['Success', 'Success', 'Success', 'Error'] + const stepsTitle = { success: 'Success', loading: 'Loading', @@ -20,13 +27,6 @@ const stepsIcons = { loading: <CircularProgress size={20} color='inherit' /> } -const responses: string[] = [] -const validations: IValidations[] = [] -const responsesDefault = ['Should', 'render', 'default', 'case'] -const responsesSuccess = ['Success', 'Success', 'Success', 'Success'] -const responsesLoading = ['Success', 'Success', 'Success', 'Loading'] -const responsesError = ['Success', 'Success', 'Success', 'Error'] - const successValidation = [ { description: { diff --git a/src/core/feedback/validation-dialog/validaton-dialog.stories.tsx b/src/core/feedback/validation-dialog/validaton-dialog.stories.tsx index cd406ae9..8473692d 100644 --- a/src/core/feedback/validation-dialog/validaton-dialog.stories.tsx +++ b/src/core/feedback/validation-dialog/validaton-dialog.stories.tsx @@ -3,7 +3,7 @@ import CircularProgress from '@mui/material/CircularProgress' import { ThemeProvider } from 'styled-components' import type { Meta, StoryObj } from '@storybook/react' import ThemeProviderFlipper from '@/core/context/theme-provider' -import { Button } from '@/core/inputs/button' +import Button from '@/core/inputs/button' import { CheckCircleOutline, CancelOutlined } from '@/icons' import ValidationDialog, { ValidationStatus } from '.' import { muiThemeOptions, theme } from '@/theme' diff --git a/src/core/feedback/zoom/index.tsx b/src/core/feedback/zoom/index.tsx index ebbab478..6a69f25e 100644 --- a/src/core/feedback/zoom/index.tsx +++ b/src/core/feedback/zoom/index.tsx @@ -9,7 +9,7 @@ export interface ZoomProps extends DefaultProps { children?: ReactElement<Record<string, unknown>> } -export const Zoom = ({ +const Zoom = ({ children, padding, margin, diff --git a/src/core/feedback/zoom/zoom.spec.tsx b/src/core/feedback/zoom/zoom.spec.tsx index c309d591..84a2eeba 100644 --- a/src/core/feedback/zoom/zoom.spec.tsx +++ b/src/core/feedback/zoom/zoom.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Zoom } from '.' +import Zoom from '.' describe('Zoom', () => { it('should render closed', () => { diff --git a/src/core/feedback/zoom/zooms.stories.tsx b/src/core/feedback/zoom/zooms.stories.tsx index b4e82d2c..ab12ff2f 100644 --- a/src/core/feedback/zoom/zooms.stories.tsx +++ b/src/core/feedback/zoom/zooms.stories.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react' import type { Meta } from '@storybook/react' -import { Button } from '@/core/inputs/button' -import { Zoom } from '.' +import Button from '@/core/inputs/button' +import Zoom from '.' export default { title: 'Feedback/Zoom', diff --git a/src/core/inputs/auto-complete/auto-complete.spec.tsx b/src/core/inputs/auto-complete/auto-complete.spec.tsx index e539f097..f9ac139d 100644 --- a/src/core/inputs/auto-complete/auto-complete.spec.tsx +++ b/src/core/inputs/auto-complete/auto-complete.spec.tsx @@ -4,9 +4,9 @@ import { fireEvent, render, screen, waitFor } from '@testing-library/react' import { userEvent } from '@testing-library/user-event' import type { ISelected, TSelected } from '.' import ListItem from '@/core/data-display/list-item' -import { Typography } from '@/core/data-display/typography' -import { TextField } from '../text-field' -import { AutoComplete } from '.' +import Typography from '@/core/data-display/typography' +import TextField from '../text-field' +import AutoComplete from '.' interface MockProps { initialValue?: TSelected diff --git a/src/core/inputs/auto-complete/auto-complete.stories.tsx b/src/core/inputs/auto-complete/auto-complete.stories.tsx index 7b5eaf70..d57faf9e 100644 --- a/src/core/inputs/auto-complete/auto-complete.stories.tsx +++ b/src/core/inputs/auto-complete/auto-complete.stories.tsx @@ -2,9 +2,9 @@ import React, { useState } from 'react' import type { TSelected } from '.' import type { Meta } from '@storybook/react' import ListItem from '@/core/data-display/list-item' -import { Typography } from '@/core/data-display/typography' -import { TextField } from '@/core/inputs/text-field' -import { AutoComplete } from '.' +import Typography from '@/core/data-display/typography' +import TextField from '@/core/inputs/text-field' +import AutoComplete from '.' export default { title: 'Inputs/AutoComplete', diff --git a/src/core/inputs/auto-complete/index.tsx b/src/core/inputs/auto-complete/index.tsx index d1c8e8ed..72dcbeca 100644 --- a/src/core/inputs/auto-complete/index.tsx +++ b/src/core/inputs/auto-complete/index.tsx @@ -9,8 +9,8 @@ import type { MouseEvent, ReactElement } from 'react' -import { Fade } from '@/core/feedback/fade' -import { Paper } from '@/core/surfaces/paper' +import Fade from '@/core/feedback/fade' +import Paper from '@/core/surfaces/paper' export interface AutoCompleteProps { autoFocus?: boolean @@ -62,7 +62,7 @@ export type TSelected = ISelected | string const removeAccents = (text: string) => text.normalize('NFD').replace(/[\u0300-\u036f]/g, '') -export const AutoComplete = (props: AutoCompleteProps) => { +const AutoComplete = (props: AutoCompleteProps) => { const inputRef = useRef<HTMLInputElement>(null) const index = props.suggestions.findIndex(suggestion => { diff --git a/src/core/inputs/button/button.spec.tsx b/src/core/inputs/button/button.spec.tsx index 5c1ef4c3..74e83e86 100644 --- a/src/core/inputs/button/button.spec.tsx +++ b/src/core/inputs/button/button.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Button } from '.' +import Button from '.' describe('Button', () => { it('should render', () => { diff --git a/src/core/inputs/button/button.stories.tsx b/src/core/inputs/button/button.stories.tsx index 287b7355..e239d948 100644 --- a/src/core/inputs/button/button.stories.tsx +++ b/src/core/inputs/button/button.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' import { Add as IconAdd } from '@/icons' -import { Button } from '.' +import Button from '.' export default { title: 'Inputs/Button', diff --git a/src/core/inputs/button/index.tsx b/src/core/inputs/button/index.tsx index 9cda5b91..f66fcddd 100644 --- a/src/core/inputs/button/index.tsx +++ b/src/core/inputs/button/index.tsx @@ -19,7 +19,7 @@ export interface ButtonProps extends DefaultProps { onClick?(event: MouseEvent<HTMLButtonElement>): void } -export const Button = ({ +const Button = ({ children, margin, padding, diff --git a/src/core/inputs/checkbox/checkbox.spec.tsx b/src/core/inputs/checkbox/checkbox.spec.tsx index a3077a16..40e08042 100644 --- a/src/core/inputs/checkbox/checkbox.spec.tsx +++ b/src/core/inputs/checkbox/checkbox.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen, act, waitFor, fireEvent } from '@testing-library/react' -import { Checkbox } from '.' +import Checkbox from '.' describe('Checkbox', () => { it('should render', () => { diff --git a/src/core/inputs/checkbox/checkbox.stories.tsx b/src/core/inputs/checkbox/checkbox.stories.tsx index 5f4531cd..c67237eb 100644 --- a/src/core/inputs/checkbox/checkbox.stories.tsx +++ b/src/core/inputs/checkbox/checkbox.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Checkbox } from '.' +import Checkbox from '.' export default { title: 'Inputs/Checkbox', diff --git a/src/core/inputs/checkbox/index.tsx b/src/core/inputs/checkbox/index.tsx index d2019945..587c608a 100644 --- a/src/core/inputs/checkbox/index.tsx +++ b/src/core/inputs/checkbox/index.tsx @@ -26,7 +26,7 @@ export interface CheckboxProps extends DefaultProps { checkboxProps?: MuiCheckboxProps } -export const Checkbox = (props: CheckboxProps) => { +const Checkbox = (props: CheckboxProps) => { const { type = 'checkbox', margin, diff --git a/src/core/inputs/chip-field/chip-field.spec.tsx b/src/core/inputs/chip-field/chip-field.spec.tsx index 8ec8e23b..dd44cf83 100644 --- a/src/core/inputs/chip-field/chip-field.spec.tsx +++ b/src/core/inputs/chip-field/chip-field.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen, waitFor, fireEvent } from '@testing-library/react' -import { ChipField } from '.' +import ChipField from '.' describe('ChipField', () => { const values = [{ value: 'alpha' }, { value: 'beta' }, { value: 'gamma' }] diff --git a/src/core/inputs/chip-field/chip-field.stories.tsx b/src/core/inputs/chip-field/chip-field.stories.tsx index 28b3a20e..18218532 100644 --- a/src/core/inputs/chip-field/chip-field.stories.tsx +++ b/src/core/inputs/chip-field/chip-field.stories.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { ChipField } from '.' +import ChipField from '.' export default { title: 'Inputs/ChipField', diff --git a/src/core/inputs/chip-field/index.tsx b/src/core/inputs/chip-field/index.tsx index ee51b341..4b325b3d 100644 --- a/src/core/inputs/chip-field/index.tsx +++ b/src/core/inputs/chip-field/index.tsx @@ -1,9 +1,8 @@ import React, { useMemo } from 'react' import type { ReactNode } from 'react' -import ChipInput from 'material-ui-chip-input' -import { default as styled } from 'styled-components' import type { InputLabelProps } from '@material-ui/core' import type { ChipRenderer } from 'material-ui-chip-input' +import { StyledChipInput } from './styles' export interface ChipFieldProps<T extends TChipValues> { allowDuplicates?: boolean @@ -26,27 +25,7 @@ export type TChipValues = { value: string | number } -const StyledChipInput = styled(ChipInput)` - & > div > div { - padding: 0px !important; - } - & > div > div > div { - margin: 2px; - } - & > label { - top: -6px !important; - font-size: 14px !important; - } - & > label.MuiInputLabel-shrink { - top: 0px !important; - } - & > div > div > input { - padding: 10px !important; - font-size: 14px !important; - } -` - -export const ChipField = <T extends TChipValues>(props: ChipFieldProps<T>) => { +const ChipField = <T extends TChipValues>(props: ChipFieldProps<T>) => { const values = useMemo( () => props.values.map(item => item.value), [props.values] diff --git a/src/core/inputs/chip-field/styles.ts b/src/core/inputs/chip-field/styles.ts new file mode 100644 index 00000000..4acc7f3b --- /dev/null +++ b/src/core/inputs/chip-field/styles.ts @@ -0,0 +1,22 @@ +import ChipInput from 'material-ui-chip-input' +import { default as styled } from 'styled-components' + +export const StyledChipInput = styled(ChipInput)` + & > div > div { + padding: 0px !important; + } + & > div > div > div { + margin: 2px; + } + & > label { + top: -6px !important; + font-size: 14px !important; + } + & > label.MuiInputLabel-shrink { + top: 0px !important; + } + & > div > div > input { + padding: 10px !important; + font-size: 14px !important; + } +` diff --git a/src/core/inputs/date-time/date-time.stories.tsx b/src/core/inputs/date-time/date-time.stories.tsx index 3047b35c..68d5871c 100644 --- a/src/core/inputs/date-time/date-time.stories.tsx +++ b/src/core/inputs/date-time/date-time.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { DateTime } from '.' +import DateTime from '.' export default { title: 'Inputs/DateTime', diff --git a/src/core/inputs/date-time/index.tsx b/src/core/inputs/date-time/index.tsx index f476c578..cc5474f3 100644 --- a/src/core/inputs/date-time/index.tsx +++ b/src/core/inputs/date-time/index.tsx @@ -39,7 +39,7 @@ export type DateTimeProps = Omit< IProps & DefaultProps -export const DateTime = ({ +const DateTime = ({ padding, margin, style, diff --git a/src/core/inputs/icon-button/icon-button.spec.tsx b/src/core/inputs/icon-button/icon-button.spec.tsx index 05e6c207..a1ff7949 100644 --- a/src/core/inputs/icon-button/icon-button.spec.tsx +++ b/src/core/inputs/icon-button/icon-button.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { IconButton } from '.' +import IconButton from '.' describe('IconButton', () => { it('should render', () => { diff --git a/src/core/inputs/icon-button/icon-button.stories.tsx b/src/core/inputs/icon-button/icon-button.stories.tsx index dce1a327..838f1f67 100644 --- a/src/core/inputs/icon-button/icon-button.stories.tsx +++ b/src/core/inputs/icon-button/icon-button.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' import { Add as IconAdd } from '@/icons' -import { IconButton } from '.' +import IconButton from '.' export default { title: 'Inputs/IconButton', diff --git a/src/core/inputs/icon-button/index.tsx b/src/core/inputs/icon-button/index.tsx index 3ee52598..746fb981 100644 --- a/src/core/inputs/icon-button/index.tsx +++ b/src/core/inputs/icon-button/index.tsx @@ -11,7 +11,7 @@ export interface IconButtonProps extends DefaultProps { onClick?(event: MouseEvent<HTMLButtonElement>): void } -export const IconButton = ({ +const IconButton = ({ children, padding, margin, diff --git a/src/core/inputs/input-adornment/index.tsx b/src/core/inputs/input-adornment/index.tsx index f2890167..dc2c6cb6 100644 --- a/src/core/inputs/input-adornment/index.tsx +++ b/src/core/inputs/input-adornment/index.tsx @@ -7,10 +7,7 @@ export interface InputAdornmentProps extends DefaultProps, MuiInputProps { position: 'start' | 'end' } -export const InputAdornment = ({ - children, - ...otherProps -}: InputAdornmentProps) => ( +const InputAdornment = ({ children, ...otherProps }: InputAdornmentProps) => ( <MuiInputAdornment {...otherProps}>{children}</MuiInputAdornment> ) diff --git a/src/core/inputs/input-adornment/input-adorment.spec.tsx b/src/core/inputs/input-adornment/input-adorment.spec.tsx index f96389a6..ba7e9d3c 100644 --- a/src/core/inputs/input-adornment/input-adorment.spec.tsx +++ b/src/core/inputs/input-adornment/input-adorment.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { InputAdornment } from '.' +import InputAdornment from '.' describe('InputAdornment', () => { it('should render on start position', () => { diff --git a/src/core/inputs/input-adornment/input-adornment.stories.tsx b/src/core/inputs/input-adornment/input-adornment.stories.tsx index 5abbf291..5f013013 100644 --- a/src/core/inputs/input-adornment/input-adornment.stories.tsx +++ b/src/core/inputs/input-adornment/input-adornment.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { InputAdornment } from '.' +import InputAdornment from '.' export default { title: 'Inputs/InputAdornment', diff --git a/src/core/inputs/input-base/index.tsx b/src/core/inputs/input-base/index.tsx index 1308e7c3..826cb2b1 100644 --- a/src/core/inputs/input-base/index.tsx +++ b/src/core/inputs/input-base/index.tsx @@ -29,7 +29,7 @@ export interface InputAdornmentProps value?: string | number | boolean } -export const InputBase = ({ +const InputBase = ({ margin, padding, style = {}, diff --git a/src/core/inputs/input-base/input-base.spec.tsx b/src/core/inputs/input-base/input-base.spec.tsx index f7d31e96..1640c8c9 100644 --- a/src/core/inputs/input-base/input-base.spec.tsx +++ b/src/core/inputs/input-base/input-base.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { InputBase } from '.' +import InputBase from '.' describe('InputBase', () => { it('should render', () => { diff --git a/src/core/inputs/input-base/input-base.stories.tsx b/src/core/inputs/input-base/input-base.stories.tsx index c1863e4b..37e28495 100644 --- a/src/core/inputs/input-base/input-base.stories.tsx +++ b/src/core/inputs/input-base/input-base.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { InputBase } from '.' +import InputBase from '.' export default { title: 'Inputs/InputBase', diff --git a/src/core/inputs/mask-field/index.tsx b/src/core/inputs/mask-field/index.tsx index adc53819..39e05390 100644 --- a/src/core/inputs/mask-field/index.tsx +++ b/src/core/inputs/mask-field/index.tsx @@ -3,7 +3,7 @@ import type { ComponentType } from 'react' import type { NumberFormatProps } from 'react-number-format' import NumberFormat from 'react-number-format' import type { TextFieldProps } from '@/core/inputs/text-field' -import { TextField } from '@/core/inputs/text-field' +import TextField from '@/core/inputs/text-field' export interface MaskFieldProps extends NumberFormatProps { mask?: string @@ -16,7 +16,7 @@ export interface MaskFieldProps extends NumberFormatProps { customInput?: ComponentType<TextFieldProps> } -export const MaskField = (props: MaskFieldProps) => { +const MaskField = (props: MaskFieldProps) => { const { customInput, ...otherProps } = props return ( diff --git a/src/core/inputs/mask-field/mask-field.spec.tsx b/src/core/inputs/mask-field/mask-field.spec.tsx index 1a25feb5..19fd0b86 100644 --- a/src/core/inputs/mask-field/mask-field.spec.tsx +++ b/src/core/inputs/mask-field/mask-field.spec.tsx @@ -2,7 +2,7 @@ import * as React from 'react' import { act } from 'react-dom/test-utils' import { render, screen } from '@testing-library/react' import { userEvent } from '@testing-library/user-event' -import { MaskField } from '.' +import MaskField from '.' describe('MaskField', () => { it('should render with default TextField without customInput', async () => { diff --git a/src/core/inputs/mask-field/mask-field.stories.tsx b/src/core/inputs/mask-field/mask-field.stories.tsx index bcd0c913..056de0fd 100644 --- a/src/core/inputs/mask-field/mask-field.stories.tsx +++ b/src/core/inputs/mask-field/mask-field.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { InputAdornment } from '@/core/inputs/input-adornment' -import { MaskField } from '.' +import InputAdornment from '@/core/inputs/input-adornment' +import MaskField from '.' export default { title: 'Inputs/MaskField', diff --git a/src/core/inputs/pin-input/index.tsx b/src/core/inputs/pin-input/index.tsx index 154e0112..7e3d95a1 100644 --- a/src/core/inputs/pin-input/index.tsx +++ b/src/core/inputs/pin-input/index.tsx @@ -6,7 +6,7 @@ import type { KeyboardEvent } from 'react' import { TextField } from '@material-ui/core' -import { default as styled } from 'styled-components' +import { Container } from './styles' export interface PinInputGridProps { pin: Array<number | undefined> @@ -21,17 +21,11 @@ export interface PinInputGridProps { variant?: 'outlined' | 'standard' } -const Container = styled.div` - display: flex; - width: auto; - justify-content: center; -` - const PIN_MIN_VALUE = 0 const PIN_MAX_VALUE = 9 const BACKSPACE_KEY = 'Backspace' -export const PinInput = ({ +const PinInput = ({ pinLength, pin, setPin, diff --git a/src/core/inputs/pin-input/pin-input.spec.tsx b/src/core/inputs/pin-input/pin-input.spec.tsx index e7ec8840..91102d86 100644 --- a/src/core/inputs/pin-input/pin-input.spec.tsx +++ b/src/core/inputs/pin-input/pin-input.spec.tsx @@ -3,7 +3,7 @@ import { act } from 'react-dom/test-utils' import { fireEvent, render, screen } from '@testing-library/react' import { userEvent } from '@testing-library/user-event' import MockedComponent from '@/test/mocks/pin-input-mock' -import { PinInput } from '.' +import PinInput from '.' describe('PinInput', () => { it('should render', () => { diff --git a/src/core/inputs/pin-input/pin-input.stories.tsx b/src/core/inputs/pin-input/pin-input.stories.tsx index 3ccba889..e6fcd65e 100644 --- a/src/core/inputs/pin-input/pin-input.stories.tsx +++ b/src/core/inputs/pin-input/pin-input.stories.tsx @@ -1,28 +1,14 @@ import React, { useState } from 'react' import { Button } from '@material-ui/core' -import { default as styled } from 'styled-components' import type { Meta } from '@storybook/react' -import { PinInput } from '.' +import PinInput from '.' +import { ButtonContainer, ValidateContainer } from './styles' export default { title: 'Inputs/PinInput', component: PinInput } as Meta<typeof PinInput> -const ValidateContainer = styled.div` - display: flex; - width: auto; - justify-content: center; - margin-bottom: 2rem; -` - -const ButtonContainer = styled.div` - display: flex; - width: auto; - justify-content: center; - margin-top: 3rem; -` - const PIN_LENGTH = 6 export const Default = () => { @@ -53,9 +39,7 @@ export const Default = () => { return ( <> - <ValidateContainer> - <span>Valid pin: 123123</span> - </ValidateContainer> + <ValidateContainer>Valid pin: 123123</ValidateContainer> <PinInput pin={pin} setPin={setPin} @@ -106,9 +90,7 @@ export const Large = () => { return ( <> - <ValidateContainer> - <span>Valid pin: 123123</span> - </ValidateContainer> + <ValidateContainer>Valid pin: 123123</ValidateContainer> <PinInput pin={pin} setPin={setPin} diff --git a/src/core/inputs/pin-input/styles.ts b/src/core/inputs/pin-input/styles.ts new file mode 100644 index 00000000..550a22b5 --- /dev/null +++ b/src/core/inputs/pin-input/styles.ts @@ -0,0 +1,21 @@ +import { default as styled } from 'styled-components' + +export const Container = styled.div` + display: flex; + width: auto; + justify-content: center; +` + +export const ValidateContainer = styled.div` + display: flex; + width: auto; + justify-content: center; + margin-bottom: 2rem; +` + +export const ButtonContainer = styled.div` + display: flex; + width: auto; + justify-content: center; + margin-top: 3rem; +` diff --git a/src/core/inputs/radio-group/index.tsx b/src/core/inputs/radio-group/index.tsx index 5bb436eb..960c4ad0 100644 --- a/src/core/inputs/radio-group/index.tsx +++ b/src/core/inputs/radio-group/index.tsx @@ -26,7 +26,7 @@ export interface IOption { disabled?: boolean } -export const RadioGroup = ({ +const RadioGroup = ({ row, options = [], className, diff --git a/src/core/inputs/radio-group/radio-group.stories.tsx b/src/core/inputs/radio-group/radio-group.stories.tsx index c1c586f3..0c335598 100644 --- a/src/core/inputs/radio-group/radio-group.stories.tsx +++ b/src/core/inputs/radio-group/radio-group.stories.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react' import type { Meta } from '@storybook/react' -import { RadioGroup } from '.' +import RadioGroup from '.' export default { title: 'Inputs/RadioGroup', diff --git a/src/core/inputs/radio/index.tsx b/src/core/inputs/radio/index.tsx index d558872e..0de1859c 100644 --- a/src/core/inputs/radio/index.tsx +++ b/src/core/inputs/radio/index.tsx @@ -12,12 +12,7 @@ export interface RadioProps extends DefaultProps, MuiRadioProps { onChange?: (event: ChangeEvent<HTMLElement>) => void } -export const Radio = ({ - padding, - margin, - style, - ...otherProps -}: RadioProps) => ( +const Radio = ({ padding, margin, style, ...otherProps }: RadioProps) => ( <MuiRadio {...otherProps} style={{ padding, margin, ...style }} /> ) diff --git a/src/core/inputs/radio/radio.spec.tsx b/src/core/inputs/radio/radio.spec.tsx index 2aebc85f..8eb8cc1c 100644 --- a/src/core/inputs/radio/radio.spec.tsx +++ b/src/core/inputs/radio/radio.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Radio } from '.' +import Radio from '.' describe('Radio', () => { it('should render', () => { diff --git a/src/core/inputs/radio/radio.stories.tsx b/src/core/inputs/radio/radio.stories.tsx index e00cb6d6..8f6f4cd8 100644 --- a/src/core/inputs/radio/radio.stories.tsx +++ b/src/core/inputs/radio/radio.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Radio } from '.' +import Radio from '.' export default { title: 'Inputs/Radio', diff --git a/src/core/inputs/select/index.tsx b/src/core/inputs/select/index.tsx index b0463e86..ebeff473 100644 --- a/src/core/inputs/select/index.tsx +++ b/src/core/inputs/select/index.tsx @@ -39,7 +39,7 @@ const renderEndAdornment = (onClear?: () => void) => ( </InputAdornment> ) -export const Select = ({ +const Select = ({ children, style = {}, margin, diff --git a/src/core/inputs/select/select.stories.tsx b/src/core/inputs/select/select.stories.tsx index 8d413987..9388097c 100644 --- a/src/core/inputs/select/select.stories.tsx +++ b/src/core/inputs/select/select.stories.tsx @@ -1,8 +1,8 @@ -import type { ChangeEvent } from 'react' import React, { useState } from 'react' +import type { ChangeEvent } from 'react' import type { Meta } from '@storybook/react' import ListItem from '@/core/data-display/list-item' -import { Select } from '.' +import Select from '.' export default { title: 'Inputs/Select', diff --git a/src/core/inputs/slider/index.tsx b/src/core/inputs/slider/index.tsx index 6f238835..cf80f1c9 100644 --- a/src/core/inputs/slider/index.tsx +++ b/src/core/inputs/slider/index.tsx @@ -11,7 +11,7 @@ export type FlipperSliderProps = Omit<SliderProps, 'defaultValue'> & DefaultProps & ISliderProps -export const Slider = ({ +const Slider = ({ padding, margin, style = {}, diff --git a/src/core/inputs/slider/slider.spec.tsx b/src/core/inputs/slider/slider.spec.tsx index e3947b39..0b427bfc 100644 --- a/src/core/inputs/slider/slider.spec.tsx +++ b/src/core/inputs/slider/slider.spec.tsx @@ -2,7 +2,7 @@ import * as React from 'react' import { act } from 'react-dom/test-utils' import { render, screen } from '@testing-library/react' import drag from '@/test/util' -import { Slider } from '.' +import Slider from '.' describe('Slider', () => { it('should render and slide', async () => { diff --git a/src/core/inputs/slider/slider.stories.tsx b/src/core/inputs/slider/slider.stories.tsx index d093fdae..b6f1da33 100644 --- a/src/core/inputs/slider/slider.stories.tsx +++ b/src/core/inputs/slider/slider.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Slider } from '.' +import Slider from '.' export default { title: 'Inputs/Slider', diff --git a/src/core/inputs/text-field/index.tsx b/src/core/inputs/text-field/index.tsx index 23fb5e57..7bb07161 100644 --- a/src/core/inputs/text-field/index.tsx +++ b/src/core/inputs/text-field/index.tsx @@ -21,7 +21,7 @@ import { when, is, pipe, split, map, zipObj, reject, propEq } from 'ramda' import type { DefaultProps } from '../../types' import type { TextFieldProps as MuiTextFieldProps } from '@material-ui/core' import { Clear, Help as ContactSupportIcon, Edit, Save } from '@/icons' -import { IconButton } from '../icon-button' +import IconButton from '../icon-button' import { Helper, StaticTextFieldWrapper, TextFieldWrapper } from './styles' import { theme } from '@/theme' @@ -198,7 +198,7 @@ const renderEndAdornment = (onClear?: () => void) => ( </InputAdornment> ) -export const TextField = ({ +const TextField = ({ options, margin, padding, diff --git a/src/core/inputs/text-field/text-field.stories.tsx b/src/core/inputs/text-field/text-field.stories.tsx index d3676e4d..511bc7ac 100644 --- a/src/core/inputs/text-field/text-field.stories.tsx +++ b/src/core/inputs/text-field/text-field.stories.tsx @@ -2,8 +2,8 @@ import type { ChangeEvent } from 'react' import React, { useState } from 'react' import type { Meta, StoryFn } from '@storybook/react' import ListItem from '@/core/data-display/list-item' -import { InputAdornment } from '@/core/inputs/input-adornment' -import { TextField } from '.' +import InputAdornment from '@/core/inputs/input-adornment' +import TextField from '.' import { Wrapper } from './styles' export default { diff --git a/src/core/navigation/breadcrumb/index.tsx b/src/core/navigation/breadcrumb/index.tsx index ecc71de7..7867ad67 100644 --- a/src/core/navigation/breadcrumb/index.tsx +++ b/src/core/navigation/breadcrumb/index.tsx @@ -2,7 +2,7 @@ import * as React from 'react' import MuiBreadcrumbs from '@material-ui/core/Breadcrumbs' import type { BreadcrumbsProps } from '@material-ui/core/Breadcrumbs' -export const Breadcrumbs = (props: BreadcrumbsProps) => { +const Breadcrumbs = (props: BreadcrumbsProps) => { return <MuiBreadcrumbs {...props} /> } diff --git a/src/core/navigation/drawer/drawer.spec.tsx b/src/core/navigation/drawer/drawer.spec.tsx index 4a7e249e..bb291308 100644 --- a/src/core/navigation/drawer/drawer.spec.tsx +++ b/src/core/navigation/drawer/drawer.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Drawer } from '.' +import Drawer from '.' describe('Drawer', () => { it('should render', () => { diff --git a/src/core/navigation/drawer/drawer.stories.tsx b/src/core/navigation/drawer/drawer.stories.tsx index 59fb366a..41db73b7 100644 --- a/src/core/navigation/drawer/drawer.stories.tsx +++ b/src/core/navigation/drawer/drawer.stories.tsx @@ -1,10 +1,10 @@ import React, { useState } from 'react' import type { Meta } from '@storybook/react' -import { List } from '@/core/data-display/list' +import List from '@/core/data-display/list' import ListItem from '@/core/data-display/list-item' -import { Button } from '@/core/inputs/button' +import Button from '@/core/inputs/button' import { Backup as IconBackup } from '@/icons' -import { Drawer } from '.' +import Drawer from '.' export default { title: 'Navigation/Drawer', diff --git a/src/core/navigation/drawer/index.tsx b/src/core/navigation/drawer/index.tsx index 5833ad9e..157d7d99 100644 --- a/src/core/navigation/drawer/index.tsx +++ b/src/core/navigation/drawer/index.tsx @@ -24,7 +24,7 @@ const getStyles = (top: number, width?: number) => }) ) -export const Drawer = (props: DrawerProps) => { +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/navigation/menu/index.tsx b/src/core/navigation/menu/index.tsx index 62a336fb..efe59ea0 100644 --- a/src/core/navigation/menu/index.tsx +++ b/src/core/navigation/menu/index.tsx @@ -9,7 +9,7 @@ export interface MenuProps extends DefaultProps, MuiMenuProps { withWrapper?: boolean } -export const Menu = ({ +const Menu = ({ children, padding, margin, diff --git a/src/core/navigation/menu/menu.spec.tsx b/src/core/navigation/menu/menu.spec.tsx index 435525f8..d14f3140 100644 --- a/src/core/navigation/menu/menu.spec.tsx +++ b/src/core/navigation/menu/menu.spec.tsx @@ -2,7 +2,7 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' import ListItem from '@/core/data-display/list-item' import { Backup } from '@/icons' -import { Menu } from '.' +import Menu from '.' describe('Menu', () => { it('should render opened', () => { diff --git a/src/core/navigation/menu/menu.stories.tsx b/src/core/navigation/menu/menu.stories.tsx index d3cf7271..99e9cd87 100644 --- a/src/core/navigation/menu/menu.stories.tsx +++ b/src/core/navigation/menu/menu.stories.tsx @@ -1,9 +1,9 @@ import React, { useState } from 'react' import type { Meta, StoryFn } from '@storybook/react' import ListItem from '@/core/data-display/list-item' -import { Button } from '@/core/inputs/button' +import Button from '@/core/inputs/button' import { Backup } from '@/icons' -import { Menu } from '.' +import Menu from '.' export default { title: 'Navigation/Menu', diff --git a/src/core/navigation/pagination/index.tsx b/src/core/navigation/pagination/index.tsx index 8edf1081..4af40436 100644 --- a/src/core/navigation/pagination/index.tsx +++ b/src/core/navigation/pagination/index.tsx @@ -1,12 +1,12 @@ import React from 'react' import { inc, times } from 'ramda' -import { default as styled } from 'styled-components' import type { DefaultProps } from '../../types' -import { Button } from '@/core/inputs/button' +import Button from '@/core/inputs/button' import { KeyboardArrowLeft as IconArrowLeft, KeyboardArrowRight as IconArrowRight } from '@/icons' +import { Content } from './styles' export interface PaginationProps extends DefaultProps { pages?: number @@ -16,15 +16,7 @@ export interface PaginationProps extends DefaultProps { onNavigate: (page: number) => void } -const Content = styled.div` - display: flex; - align-items: center; - font-family: 'Roboto', sans-serif; - justify-content: center; - margin: 0.75em; -` - -export const Pagination = (props: PaginationProps) => { +const Pagination = (props: PaginationProps) => { const { active, style, diff --git a/src/core/navigation/pagination/pagination.spec.tsx b/src/core/navigation/pagination/pagination.spec.tsx index 16be6ca9..44b844fa 100644 --- a/src/core/navigation/pagination/pagination.spec.tsx +++ b/src/core/navigation/pagination/pagination.spec.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import { act, render, screen } from '@testing-library/react' import { userEvent } from '@testing-library/user-event' -import { Pagination } from '.' +import Pagination from '.' describe('Pagination', () => { it('should call navigation with correct values', async () => { diff --git a/src/core/navigation/pagination/pagination.stories.tsx b/src/core/navigation/pagination/pagination.stories.tsx index 5a4e34a0..a1f6c41b 100644 --- a/src/core/navigation/pagination/pagination.stories.tsx +++ b/src/core/navigation/pagination/pagination.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Pagination } from '.' +import Pagination from '.' export default { title: 'Navigation/Pagination', diff --git a/src/core/navigation/pagination/styles.ts b/src/core/navigation/pagination/styles.ts new file mode 100644 index 00000000..215b6f13 --- /dev/null +++ b/src/core/navigation/pagination/styles.ts @@ -0,0 +1,9 @@ +import { default as styled } from 'styled-components' + +export const Content = styled.div` + display: flex; + align-items: center; + font-family: 'Roboto', sans-serif; + justify-content: center; + margin: 0.75em; +` diff --git a/src/core/navigation/sidebar/index.tsx b/src/core/navigation/sidebar/index.tsx index 6caaa7e9..7f0dccdd 100644 --- a/src/core/navigation/sidebar/index.tsx +++ b/src/core/navigation/sidebar/index.tsx @@ -1,15 +1,15 @@ import React from 'react' import Drawer from '@material-ui/core/Drawer' import { makeStyles, createStyles } from '@material-ui/core/styles' -import { default as styled } from 'styled-components' import type { DefaultProps } from '../../types' import type { ButtonProps } from '@/core/inputs/button' import type { Theme } from '@material-ui/core/styles' -import { Button } from '@/core/inputs/button' +import Button from '@/core/inputs/button' import { KeyboardArrowLeft as IconArrowLeft, KeyboardArrowRight as IconArrowRight } from '@/icons' +import { Action } from './styles' export interface SidebarProps extends DefaultProps { open: boolean @@ -28,11 +28,6 @@ export interface SidebarProps extends DefaultProps { onToggle: () => void } -interface IAction { - anchor?: 'top' | 'left' | 'bottom' | 'right' - minWidth?: SidebarProps['minWidth'] -} - const useStyles = makeStyles((theme: Theme) => createStyles({ button: { @@ -75,14 +70,7 @@ const useStyles = makeStyles((theme: Theme) => }) ) -const Action = styled.div<IAction>` - flex-direction: ${props => - props.anchor === 'left' ? 'row-reverse' : 'row'}; - display: flex; - padding: 4px; -` - -export const Sidebar = ({ +const Sidebar = ({ id, anchor = 'left', className, diff --git a/src/core/navigation/sidebar/sidebar.spec.tsx b/src/core/navigation/sidebar/sidebar.spec.tsx index 430aa712..ef317b8e 100644 --- a/src/core/navigation/sidebar/sidebar.spec.tsx +++ b/src/core/navigation/sidebar/sidebar.spec.tsx @@ -1,9 +1,9 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { List } from '@/core/data-display/list' +import List from '@/core/data-display/list' import ListItem from '@/core/data-display/list-item' import { Backup } from '@/icons' -import { Sidebar } from '.' +import Sidebar from '.' describe('Sidebar', () => { it('should render', () => { diff --git a/src/core/navigation/sidebar/sidebar.stories.tsx b/src/core/navigation/sidebar/sidebar.stories.tsx index 84cc5f9a..491f457e 100644 --- a/src/core/navigation/sidebar/sidebar.stories.tsx +++ b/src/core/navigation/sidebar/sidebar.stories.tsx @@ -1,9 +1,9 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { List } from '@/core/data-display/list' +import List from '@/core/data-display/list' import ListItem from '@/core/data-display/list-item' import { Backup } from '@/icons' -import { Sidebar } from '.' +import Sidebar from '.' export default { title: 'Navigation/Sidebar', diff --git a/src/core/navigation/sidebar/styles.ts b/src/core/navigation/sidebar/styles.ts new file mode 100644 index 00000000..d7ae7627 --- /dev/null +++ b/src/core/navigation/sidebar/styles.ts @@ -0,0 +1,13 @@ +import { default as styled } from 'styled-components' + +interface IAction { + anchor?: 'top' | 'left' | 'bottom' | 'right' + minWidth?: number | string +} + +export const Action = styled.div<IAction>` + flex-direction: ${props => + props.anchor === 'left' ? 'row-reverse' : 'row'}; + display: flex; + padding: 4px; +` diff --git a/src/core/navigation/stepper/index.tsx b/src/core/navigation/stepper/index.tsx index 9d6b6903..a3d7c304 100644 --- a/src/core/navigation/stepper/index.tsx +++ b/src/core/navigation/stepper/index.tsx @@ -33,7 +33,7 @@ const StepIcon = ({ icon, active }: StepIconProps) => { }) } -export const Stepper = ({ +const Stepper = ({ active, bottomLabel, steps, diff --git a/src/core/navigation/stepper/stepper.spec.tsx b/src/core/navigation/stepper/stepper.spec.tsx index aa38be3f..76fa0b62 100644 --- a/src/core/navigation/stepper/stepper.spec.tsx +++ b/src/core/navigation/stepper/stepper.spec.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' import { Delete } from '@/icons' -import { Stepper } from '.' +import Stepper from '.' describe('Stepper', () => { it('should render', () => { diff --git a/src/core/navigation/stepper/stepper.stories.tsx b/src/core/navigation/stepper/stepper.stories.tsx index b6c1094a..963f7e05 100644 --- a/src/core/navigation/stepper/stepper.stories.tsx +++ b/src/core/navigation/stepper/stepper.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' import { Delete } from '@/icons' -import { Stepper } from '.' +import Stepper from '.' export default { title: 'Navigation/Stepper', diff --git a/src/core/navigation/tabs/index.tsx b/src/core/navigation/tabs/index.tsx index 957ec7e2..59cba75e 100644 --- a/src/core/navigation/tabs/index.tsx +++ b/src/core/navigation/tabs/index.tsx @@ -23,7 +23,7 @@ export interface IClasses { } } -export const Tabs = ({ +const Tabs = ({ children, centered = true, padding = '6px 0 0', diff --git a/src/core/navigation/tabs/tabs.spec.tsx b/src/core/navigation/tabs/tabs.spec.tsx index cb106ee6..a881f5c2 100644 --- a/src/core/navigation/tabs/tabs.spec.tsx +++ b/src/core/navigation/tabs/tabs.spec.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' import Tab from '@/core/navigation/tab' -import { Tabs } from '.' +import Tabs from '.' describe('Tabs', () => { it('should render the tab', () => { diff --git a/src/core/navigation/tabs/tabs.stories.tsx b/src/core/navigation/tabs/tabs.stories.tsx index 38e1ea94..4abf5476 100644 --- a/src/core/navigation/tabs/tabs.stories.tsx +++ b/src/core/navigation/tabs/tabs.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' import Tab from '@/core/navigation/tab' -import { Tabs } from '.' +import Tabs from '.' export default { title: 'Navigation/Tabs', diff --git a/src/core/surfaces/box/box.spec.tsx b/src/core/surfaces/box/box.spec.tsx index ed99db47..66075c4d 100644 --- a/src/core/surfaces/box/box.spec.tsx +++ b/src/core/surfaces/box/box.spec.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Typography } from '@/core/data-display/typography' -import { Box } from '.' +import Typography from '@/core/data-display/typography' +import Box from '.' describe('Advertise', () => { it('should render', () => { diff --git a/src/core/surfaces/box/box.stories.tsx b/src/core/surfaces/box/box.stories.tsx index 352d62e7..29bad7f3 100644 --- a/src/core/surfaces/box/box.stories.tsx +++ b/src/core/surfaces/box/box.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Box } from '.' +import Box from '.' export default { title: 'Surfaces/Box', diff --git a/src/core/surfaces/box/index.tsx b/src/core/surfaces/box/index.tsx index d8ca1b3a..91c2235c 100644 --- a/src/core/surfaces/box/index.tsx +++ b/src/core/surfaces/box/index.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { ReactNode } from 'react' import type { DefaultProps } from '../../types' -import { Paper } from '@/core/surfaces/paper' +import Paper from '@/core/surfaces/paper' export interface BoxProps extends DefaultProps { minHeight?: number @@ -9,7 +9,7 @@ export interface BoxProps extends DefaultProps { 'data-testid'?: string } -export const Box = ({ +const Box = ({ children, margin, padding = 18, diff --git a/src/core/surfaces/card/card.spec.tsx b/src/core/surfaces/card/card.spec.tsx index c264f16e..17b778f0 100644 --- a/src/core/surfaces/card/card.spec.tsx +++ b/src/core/surfaces/card/card.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Button } from '@/core/inputs/button' +import Button from '@/core/inputs/button' import { Card, CardActionArea, diff --git a/src/core/surfaces/card/card.stories.tsx b/src/core/surfaces/card/card.stories.tsx index ac5bbcc1..4509a8a5 100644 --- a/src/core/surfaces/card/card.stories.tsx +++ b/src/core/surfaces/card/card.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta } from '@storybook/react' -import { Button } from '@/core/inputs/button' +import Button from '@/core/inputs/button' import { Card, CardActionArea, CardActions, CardContent, CardMedia } from '.' export default { diff --git a/src/core/surfaces/container/container.spec.tsx b/src/core/surfaces/container/container.spec.tsx index 3295609d..35780d4e 100644 --- a/src/core/surfaces/container/container.spec.tsx +++ b/src/core/surfaces/container/container.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Container } from '.' +import Container from '.' describe('Container', () => { it('should render', () => { diff --git a/src/core/surfaces/container/container.stories.tsx b/src/core/surfaces/container/container.stories.tsx index 6d60a4b6..d089e202 100644 --- a/src/core/surfaces/container/container.stories.tsx +++ b/src/core/surfaces/container/container.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Container } from '.' +import Container from '.' export default { title: 'Surfaces/Container', diff --git a/src/core/surfaces/container/index.tsx b/src/core/surfaces/container/index.tsx index 6d0a7a5b..f2186830 100644 --- a/src/core/surfaces/container/index.tsx +++ b/src/core/surfaces/container/index.tsx @@ -7,7 +7,7 @@ const ContainerStyles: CSSProperties = { flex: 1 } -export const Container = ({ +const Container = ({ children, padding, margin, diff --git a/src/core/surfaces/content/content.spec.tsx b/src/core/surfaces/content/content.spec.tsx index 315fb5a8..91a22297 100644 --- a/src/core/surfaces/content/content.spec.tsx +++ b/src/core/surfaces/content/content.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Content } from '.' +import Content from '.' describe('Content', () => { it('should render', () => { diff --git a/src/core/surfaces/content/content.stories.tsx b/src/core/surfaces/content/content.stories.tsx index 2561b8d1..c27b8d71 100644 --- a/src/core/surfaces/content/content.stories.tsx +++ b/src/core/surfaces/content/content.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Content } from '.' +import Content from '.' export default { title: 'Surfaces/Content', diff --git a/src/core/surfaces/content/index.tsx b/src/core/surfaces/content/index.tsx index 9a7053ab..c5e24e1a 100644 --- a/src/core/surfaces/content/index.tsx +++ b/src/core/surfaces/content/index.tsx @@ -1,19 +1,9 @@ import React from 'react' import type { CSSProperties } from 'react' -import { default as styled } from 'styled-components' import type { DefaultProps } from '../../types' +import { ContainerStyles, StyledContent } from './styles' -const StyledContent = styled.main` - flex: 1; - transition: all 500ms ease; -` - -const ContainerStyles: CSSProperties = { - flex: 1, - transition: 'all 500ms ease' -} - -export const Content = ({ +const Content = ({ children, padding, margin, diff --git a/src/core/surfaces/content/styles.ts b/src/core/surfaces/content/styles.ts new file mode 100644 index 00000000..4168bd88 --- /dev/null +++ b/src/core/surfaces/content/styles.ts @@ -0,0 +1,12 @@ +import type { CSSProperties } from 'react' +import { default as styled } from 'styled-components' + +export const StyledContent = styled.main` + flex: 1; + transition: all 500ms ease; +` + +export const ContainerStyles: CSSProperties = { + flex: 1, + transition: 'all 500ms ease' +} diff --git a/src/core/surfaces/expansion-panel/expansion-panel.spec.tsx b/src/core/surfaces/expansion-panel/expansion-panel.spec.tsx index 2def1894..87b68437 100644 --- a/src/core/surfaces/expansion-panel/expansion-panel.spec.tsx +++ b/src/core/surfaces/expansion-panel/expansion-panel.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { fireEvent, render, screen, waitFor } from '@testing-library/react' -import { ExpansionPanel } from '.' +import ExpansionPanel from '.' const expectToThrow = (fn: () => void, message: string) => { // Even though the error is caught, it still gets printed to the console diff --git a/src/core/surfaces/expansion-panel/expansion-panel.stories.tsx b/src/core/surfaces/expansion-panel/expansion-panel.stories.tsx index 0165944a..a687607a 100644 --- a/src/core/surfaces/expansion-panel/expansion-panel.stories.tsx +++ b/src/core/surfaces/expansion-panel/expansion-panel.stories.tsx @@ -1,11 +1,11 @@ import React, { useRef, useState } from 'react' import type { KeyboardEvent } from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Typography } from '@/core/data-display/typography' -import { Button } from '@/core/inputs/button' -import { TextField } from '@/core/inputs/text-field' +import Typography from '@/core/data-display/typography' +import Button from '@/core/inputs/button' +import TextField from '@/core/inputs/text-field' import { ExpandMore } from '@/icons' -import { ExpansionPanel } from '.' +import ExpansionPanel from '.' export default { title: 'Surfaces/ExpansionPanel', diff --git a/src/core/surfaces/expansion-panel/index.tsx b/src/core/surfaces/expansion-panel/index.tsx index db2dae2e..d48fef10 100644 --- a/src/core/surfaces/expansion-panel/index.tsx +++ b/src/core/surfaces/expansion-panel/index.tsx @@ -42,7 +42,7 @@ export interface ExpansionPanelProps extends Omit<PaperProps, 'onChange'> { onClick?: (event: MouseEvent<HTMLDivElement>) => void } -export const ExpansionPanel = ({ +const ExpansionPanel = ({ actions, details, expandIcon, diff --git a/src/core/surfaces/header/header.spec.tsx b/src/core/surfaces/header/header.spec.tsx index c8b0ea87..95a60dfb 100644 --- a/src/core/surfaces/header/header.spec.tsx +++ b/src/core/surfaces/header/header.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Header } from '.' +import Header from '.' describe('Header', () => { it('should render', () => { diff --git a/src/core/surfaces/header/header.stories.tsx b/src/core/surfaces/header/header.stories.tsx index 11923a4e..ff74e960 100644 --- a/src/core/surfaces/header/header.stories.tsx +++ b/src/core/surfaces/header/header.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Header } from '.' +import Header from '.' export default { title: 'Surfaces/Header', diff --git a/src/core/surfaces/header/index.tsx b/src/core/surfaces/header/index.tsx index 172ca594..f2951feb 100644 --- a/src/core/surfaces/header/index.tsx +++ b/src/core/surfaces/header/index.tsx @@ -8,7 +8,7 @@ export interface HeaderProps extends Omit<PaperProps, 'classes'>, AppBarProps { color?: 'default' | 'inherit' | 'primary' | 'secondary' } -export const Header = ({ +const Header = ({ children, padding, margin, diff --git a/src/core/surfaces/paper/index.tsx b/src/core/surfaces/paper/index.tsx index 6558aa94..1d44ec7e 100644 --- a/src/core/surfaces/paper/index.tsx +++ b/src/core/surfaces/paper/index.tsx @@ -8,7 +8,7 @@ export interface PaperProps extends DefaultProps, MuiPaperProps { elevation?: number } -export const Paper = ({ +const Paper = ({ children, style = {}, padding, diff --git a/src/core/surfaces/paper/paper.spec.tsx b/src/core/surfaces/paper/paper.spec.tsx index 8b8dd833..4c26137c 100644 --- a/src/core/surfaces/paper/paper.spec.tsx +++ b/src/core/surfaces/paper/paper.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Paper } from '.' +import Paper from '.' describe('Paper', () => { it('should render children', () => { diff --git a/src/core/surfaces/paper/paper.stories.tsx b/src/core/surfaces/paper/paper.stories.tsx index 2b745bd6..83b10d94 100644 --- a/src/core/surfaces/paper/paper.stories.tsx +++ b/src/core/surfaces/paper/paper.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Paper } from '.' +import Paper from '.' export default { title: 'Surfaces/Paper', diff --git a/src/core/surfaces/step-card/index.tsx b/src/core/surfaces/step-card/index.tsx index 708277e8..6343f642 100644 --- a/src/core/surfaces/step-card/index.tsx +++ b/src/core/surfaces/step-card/index.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { CSSProperties, ChangeEvent, HTMLAttributes } from 'react' import { Accordion as MuiAccordion } from '@material-ui/core' -import type { Typography } from '@/core/data-display/typography' +import type Typography from '@/core/data-display/typography' import type { LinearProgress, AccordionDetails as MuiAccordionDetails @@ -274,7 +274,7 @@ export interface IStepCardProps { * defaultExpanded={false} * /> */ -export const StepCard = ({ +const StepCard = ({ expanded, loading = false, percentage, diff --git a/src/core/surfaces/step-card/step-card-details.tsx b/src/core/surfaces/step-card/step-card-details.tsx index 92b86daf..8a4db651 100644 --- a/src/core/surfaces/step-card/step-card-details.tsx +++ b/src/core/surfaces/step-card/step-card-details.tsx @@ -2,7 +2,7 @@ import React from 'react' import { List } from '@material-ui/core' import MuiAccordionDetails from '@material-ui/core/AccordionDetails' import type { IStepCardProps } from '.' -import { IconButton } from '@/core/inputs/icon-button' +import IconButton from '@/core/inputs/icon-button' import { ACORDION_DETAILS, ICON_BUTTON, diff --git a/src/core/surfaces/step-card/step-card-panel.tsx b/src/core/surfaces/step-card/step-card-panel.tsx index 037e4b41..5f1b2cb8 100644 --- a/src/core/surfaces/step-card/step-card-panel.tsx +++ b/src/core/surfaces/step-card/step-card-panel.tsx @@ -3,7 +3,7 @@ import type { CSSProperties } from 'react' import MuiAccordionSummary from '@material-ui/core/AccordionSummary' import { sprintf } from 'sprintf-js' import type { IStepCardProps } from '.' -import { Typography } from '@/core/data-display/typography' +import Typography from '@/core/data-display/typography' import { ExpandMore as ExpandMoreIcon } from '@/icons' import { BarWrapper, diff --git a/src/core/surfaces/step-card/step-card.stories.tsx b/src/core/surfaces/step-card/step-card.stories.tsx index c67c23cc..4fa49b15 100644 --- a/src/core/surfaces/step-card/step-card.stories.tsx +++ b/src/core/surfaces/step-card/step-card.stories.tsx @@ -1,8 +1,8 @@ import React, { useState } from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Button } from '@/core/inputs/button' +import Button from '@/core/inputs/button' import { stepCardImageUrl } from '@/lib/images' -import { StepCard } from '.' +import StepCard from '.' export default { title: 'Surfaces/StepCard', diff --git a/src/core/surfaces/step-card/styles.ts b/src/core/surfaces/step-card/styles.ts index 04bb6f7d..43b12248 100644 --- a/src/core/surfaces/step-card/styles.ts +++ b/src/core/surfaces/step-card/styles.ts @@ -1,6 +1,6 @@ import { Box, LinearProgress } from '@material-ui/core' import { default as styled } from 'styled-components' -import { default as Typography } from '@/core/data-display/typography' +import Typography from '@/core/data-display/typography' import { CheckCircle, Help as HelpIcon } from '@/icons' import { theme } from '@/theme' diff --git a/src/experimental/actions/actions.spec.tsx b/src/experimental/actions/actions.spec.tsx index e280192a..93df7a3a 100644 --- a/src/experimental/actions/actions.spec.tsx +++ b/src/experimental/actions/actions.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Actions } from '.' +import Actions from '.' describe('Actions', () => { it('should render', () => { diff --git a/src/experimental/actions/actions.stories.tsx b/src/experimental/actions/actions.stories.tsx index b747fb2f..e3f55c01 100644 --- a/src/experimental/actions/actions.stories.tsx +++ b/src/experimental/actions/actions.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Actions } from '.' +import Actions from '.' export default { title: 'Experimental/Actions', diff --git a/src/experimental/actions/index.tsx b/src/experimental/actions/index.tsx index be70b954..a1dcd691 100644 --- a/src/experimental/actions/index.tsx +++ b/src/experimental/actions/index.tsx @@ -39,7 +39,7 @@ export const Wrapper = styled.div<IWrapper>` margin: ${props => props.margin}; ` -export const Actions = (props: IProps) => { +const Actions = (props: IProps) => { const showButton = !props.readonly && (!props.buttons || props.buttons.includes('confirm')) diff --git a/src/experimental/auto-complete-lab/auto-complete-lab.stories.tsx b/src/experimental/auto-complete-lab/auto-complete-lab.stories.tsx index f51e1f66..797ba492 100644 --- a/src/experimental/auto-complete-lab/auto-complete-lab.stories.tsx +++ b/src/experimental/auto-complete-lab/auto-complete-lab.stories.tsx @@ -1,8 +1,8 @@ import React from 'react' import { Autocomplete as AutocompleteLab } from '@material-ui/lab' import type { Meta } from '@storybook/react' -import { AutoComplete } from '@/core/inputs/auto-complete' -import { TextField } from '@/core/inputs/text-field' +import AutoComplete from '@/core/inputs/auto-complete' +import TextField from '@/core/inputs/text-field' export default { title: 'Experimental/AutoCompleteLab', diff --git a/src/experimental/auto-complete-lab/index.tsx b/src/experimental/auto-complete-lab/index.tsx index 6371d060..7ceb2e3f 100644 --- a/src/experimental/auto-complete-lab/index.tsx +++ b/src/experimental/auto-complete-lab/index.tsx @@ -19,7 +19,7 @@ const useStyles = makeStyles({ } }) -export const Autocomplete: typeof MuiAutocomplete = props => { +const Autocomplete: typeof MuiAutocomplete = props => { const { classes, ...otherProps } = props const styles = useStyles(props) diff --git a/src/experimental/avatar/avatar.spec.tsx b/src/experimental/avatar/avatar.spec.tsx index d59f7c7d..2c86d925 100644 --- a/src/experimental/avatar/avatar.spec.tsx +++ b/src/experimental/avatar/avatar.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Avatar } from '.' +import Avatar from '.' describe('Avatar', () => { it('should render first letter', () => { diff --git a/src/experimental/avatar/avatar.stories.tsx b/src/experimental/avatar/avatar.stories.tsx index 1330ec28..70365fb8 100644 --- a/src/experimental/avatar/avatar.stories.tsx +++ b/src/experimental/avatar/avatar.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Avatar } from '.' +import Avatar from '.' const srcImage = 'https://imgflip.com/s/meme/Doge.jpg' diff --git a/src/experimental/avatar/index.tsx b/src/experimental/avatar/index.tsx index f7e50fa4..8e352c9e 100644 --- a/src/experimental/avatar/index.tsx +++ b/src/experimental/avatar/index.tsx @@ -1,5 +1,5 @@ -import type { CSSProperties, ReactNode } from 'react' import React from 'react' +import type { CSSProperties, ReactNode } from 'react' import { take } from 'ramda' import { Avatar as FlipperAvatar } from '@/index' @@ -16,7 +16,7 @@ export interface IProps { const FIRST_LETTER = 1 -export const Avatar = (props: IProps) => { +const Avatar = (props: IProps) => { const getChild = () => { if (props.name) { return take(FIRST_LETTER, props.name.toUpperCase()) diff --git a/src/experimental/breadcrumbs/breadcrumbs.spec.tsx b/src/experimental/breadcrumbs/breadcrumbs.spec.tsx index e0af3900..25be2e08 100644 --- a/src/experimental/breadcrumbs/breadcrumbs.spec.tsx +++ b/src/experimental/breadcrumbs/breadcrumbs.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Breadcrumbs } from '.' +import Breadcrumbs from '.' describe('Breadcrumbs', () => { it('should render', () => { diff --git a/src/experimental/breadcrumbs/breadcrumbs.stories.tsx b/src/experimental/breadcrumbs/breadcrumbs.stories.tsx index d4deb16f..1afe1791 100644 --- a/src/experimental/breadcrumbs/breadcrumbs.stories.tsx +++ b/src/experimental/breadcrumbs/breadcrumbs.stories.tsx @@ -1,14 +1,14 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import BreadcrumbsComponent from '.' +import Breadcrumbs from '.' export default { title: 'Experimental/Breadcrumbs', - component: BreadcrumbsComponent -} as Meta<typeof BreadcrumbsComponent> + component: Breadcrumbs +} as Meta<typeof Breadcrumbs> -const Template: StoryFn<typeof BreadcrumbsComponent> = args => { - return <BreadcrumbsComponent {...args} /> +const Template: StoryFn<typeof Breadcrumbs> = args => { + return <Breadcrumbs {...args} /> } export const Default = Template.bind({}) diff --git a/src/experimental/breadcrumbs/index.tsx b/src/experimental/breadcrumbs/index.tsx index 8e81a574..56d125e4 100644 --- a/src/experimental/breadcrumbs/index.tsx +++ b/src/experimental/breadcrumbs/index.tsx @@ -33,7 +33,7 @@ const defaultLinkWrapper = (link: string, label: string) => ( * Render breadcrumbs for the provided pathname or the current * `window.location.pathname`. */ -export const Breadcrumbs = ({ +const Breadcrumbs = ({ pathname, homeId, pathMapping, diff --git a/src/experimental/button/index.tsx b/src/experimental/button/index.tsx index ed3f92df..90c34e91 100644 --- a/src/experimental/button/index.tsx +++ b/src/experimental/button/index.tsx @@ -1,8 +1,7 @@ import React from 'react' -import { default as styled } from 'styled-components' import type { ButtonProps } from '@/core/inputs/button' -import { Button } from '@/core/inputs/button' import { NoteAdd as IconAdd } from '@/icons' +import { ButtonAdd } from './styles' export interface Props extends ButtonProps { label?: string @@ -12,15 +11,8 @@ export interface Props extends ButtonProps { onClick?(): void } -const ButtonStyled = styled(Button)` - display: flex; - flex: 1; - align-items: center; - justify-content: center; -` - -export const AddButton = (props: Props) => ( - <ButtonStyled +const AddButton = (props: Props) => ( + <ButtonAdd {...props} variant='dashed' color='primary' @@ -31,7 +23,7 @@ export const AddButton = (props: Props) => ( onClick={props.onClick}> <IconAdd /> {props.label} - </ButtonStyled> + </ButtonAdd> ) export default AddButton diff --git a/src/experimental/button/styles.ts b/src/experimental/button/styles.ts new file mode 100644 index 00000000..7ba1a7f0 --- /dev/null +++ b/src/experimental/button/styles.ts @@ -0,0 +1,9 @@ +import { default as styled } from 'styled-components' +import Button from '@/core/inputs/button' + +export const ButtonAdd = styled(Button)` + display: flex; + flex: 1; + align-items: center; + justify-content: center; +` diff --git a/src/experimental/card/card.spec.tsx b/src/experimental/card/card.spec.tsx index 9690c362..835b91b1 100644 --- a/src/experimental/card/card.spec.tsx +++ b/src/experimental/card/card.spec.tsx @@ -2,7 +2,7 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' import type { ButtonProps } from '@/core/inputs/button' import type { IconButtonProps } from '@/core/inputs/icon-button' -import { Card } from '.' +import Card from '.' describe('Card', () => { it('should render', () => { diff --git a/src/experimental/card/card.stories.tsx b/src/experimental/card/card.stories.tsx index c15c8465..88d995ac 100644 --- a/src/experimental/card/card.stories.tsx +++ b/src/experimental/card/card.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Typography } from '@/index' -import { Card } from '.' +import Typography from '@/core/data-display/typography' +import Card from '.' export default { title: 'Experimental/Card', diff --git a/src/experimental/card/index.tsx b/src/experimental/card/index.tsx index e8f3ad78..7c41e974 100644 --- a/src/experimental/card/index.tsx +++ b/src/experimental/card/index.tsx @@ -1,16 +1,16 @@ import React from 'react' -import type { CSSProperties, ReactNode } from 'react' -import { default as styled } from 'styled-components' +import type { ReactNode } from 'react' import type { ButtonProps } from '@/core/inputs/button' import type { IconButtonProps } from '@/core/inputs/icon-button' import { Close as IconClose, Edit as IconEdit } from '@/icons' +import { Paper, Line, Button as AddButton } from '@/index' import { - Typography, - Paper, - Line, - Button as AddButton, - IconButton -} from '@/index' + EditButton, + Header, + NESTED_ELEVATION, + PAPER_PROPS, + Title +} from './styles' export interface IProps { /** @@ -42,38 +42,7 @@ export interface IProps { onToggleEdit?(): void } -export const Content = styled.div` - flex: 1; - justify-content: center; - display: flex; - flex-direction: column; - padding: 12px; -` - -const Header = styled.div` - display: flex; -` - -export const Title = styled(Typography)` - flex: 1; -` - -const EditButton = styled(IconButton)` - && { - width: 36px; - height: 36px; - } -` - -const NESTED_ELEVATION = 0 - -const paperStyle: CSSProperties = { - flex: 1, - display: 'flex', - flexDirection: 'column' -} - -export const Card = (props: IProps) => { +const Card = (props: IProps) => { const { id, name, @@ -95,7 +64,7 @@ export const Card = (props: IProps) => { {...otherProps} name={name} id={id} - style={paperStyle} + style={PAPER_PROPS} className='showable' elevation={nested ? NESTED_ELEVATION : undefined} padding={nested ? '0' : '24px'}> diff --git a/src/experimental/card/styles.ts b/src/experimental/card/styles.ts new file mode 100644 index 00000000..5dc4f662 --- /dev/null +++ b/src/experimental/card/styles.ts @@ -0,0 +1,26 @@ +import type { CSSProperties } from 'react' +import { default as styled } from 'styled-components' +import { Typography, IconButton } from '@/index' + +export const NESTED_ELEVATION = 0 + +export const PAPER_PROPS: CSSProperties = { + flex: 1, + display: 'flex', + flexDirection: 'column' +} + +export const Header = styled.div` + display: flex; +` + +export const Title = styled(Typography)` + flex: 1; +` + +export const EditButton = styled(IconButton)` + && { + width: 36px; + height: 36px; + } +` diff --git a/src/experimental/dialog/__test__/dialog.spec.tsx b/src/experimental/dialog/__test__/dialog.spec.tsx index 476bc748..c5439273 100644 --- a/src/experimental/dialog/__test__/dialog.spec.tsx +++ b/src/experimental/dialog/__test__/dialog.spec.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import { render, screen, waitFor } from '@testing-library/react' import { userEvent } from '@testing-library/user-event' -import { DialogV2 } from '../dialog' +import DialogV2 from '../dialog' describe('Dialog', () => { const TITLE = 'dialog title' diff --git a/src/experimental/dialog/confirm-dialog.tsx b/src/experimental/dialog/confirm-dialog.tsx index f58ce702..8c5badd1 100755 --- a/src/experimental/dialog/confirm-dialog.tsx +++ b/src/experimental/dialog/confirm-dialog.tsx @@ -1,5 +1,5 @@ import React from 'react' -import { DialogV2 } from './dialog' +import DialogV2 from './dialog' export interface IProps { open: boolean diff --git a/src/experimental/dialog/dialog.stories.tsx b/src/experimental/dialog/dialog.stories.tsx index 7ab89492..09d0be78 100644 --- a/src/experimental/dialog/dialog.stories.tsx +++ b/src/experimental/dialog/dialog.stories.tsx @@ -1,8 +1,8 @@ import React, { useState } from 'react' import type { Meta, StoryFn } from '@storybook/react' -import ConfirmDialogComponent from './confirm-dialog' -import { DialogV2 } from './dialog' -import RemoveDialogComponent from './remove-dialog' +import ConfirmDialog from './confirm-dialog' +import DialogV2 from './dialog' +import RemoveDialog from './remove-dialog' const Template: StoryFn<typeof DialogV2> = args => { const [open, setOpen] = useState(false) @@ -19,15 +19,13 @@ const Template: StoryFn<typeof DialogV2> = args => { ) } -const TemplateWithRemoveDialog: StoryFn< - typeof RemoveDialogComponent -> = args => { +const TemplateWithRemoveDialog: StoryFn<typeof RemoveDialog> = args => { const [open, setOpen] = useState(false) return ( <> <button onClick={() => setOpen(true)}>open dialog</button> - <RemoveDialogComponent + <RemoveDialog {...args} open={open} onCancel={() => setOpen(false)} @@ -37,15 +35,13 @@ const TemplateWithRemoveDialog: StoryFn< ) } -const TemplateWithConfirmDialog: StoryFn< - typeof ConfirmDialogComponent -> = args => { +const TemplateWithConfirmDialog: StoryFn<typeof ConfirmDialog> = args => { const [open, setOpen] = useState(false) return ( <> <button onClick={() => setOpen(true)}>open dialog</button> - <ConfirmDialogComponent + <ConfirmDialog {...args} open={open} onCancel={() => setOpen(false)} @@ -60,13 +56,13 @@ Default.args = { primaryButtonText: 'Close' } -export const RemoveDialog = TemplateWithRemoveDialog.bind({}) -export const ConfirmDialog = TemplateWithConfirmDialog.bind({}) +export const DialogRemove = TemplateWithRemoveDialog.bind({}) +export const DialogConfirm = TemplateWithConfirmDialog.bind({}) export default { title: 'Experimental/Dialog', component: DialogV2, - subcomponents: { ConfirmDialog, RemoveDialog }, + subcomponents: { DialogConfirm, DialogRemove }, args: { title: 'dialog title', text: 'A content here!', diff --git a/src/experimental/dialog/dialog.tsx b/src/experimental/dialog/dialog.tsx index 4e1aadbd..619cb75e 100644 --- a/src/experimental/dialog/dialog.tsx +++ b/src/experimental/dialog/dialog.tsx @@ -38,7 +38,7 @@ const themeDialog = { } } -export const DialogV2 = (props: IProps) => { +const DialogV2 = (props: IProps) => { const { open, title, diff --git a/src/experimental/dialog/remove-dialog.tsx b/src/experimental/dialog/remove-dialog.tsx index b31e817b..d0f876de 100755 --- a/src/experimental/dialog/remove-dialog.tsx +++ b/src/experimental/dialog/remove-dialog.tsx @@ -1,6 +1,6 @@ import React from 'react' import { toUpper } from 'ramda' -import { DialogV2 } from './dialog' +import DialogV2 from './dialog' export interface IProps { open: boolean diff --git a/src/experimental/fab/fab-wrapper.tsx b/src/experimental/fab/fab-wrapper.tsx index 307d69c1..6b5ca9ef 100755 --- a/src/experimental/fab/fab-wrapper.tsx +++ b/src/experimental/fab/fab-wrapper.tsx @@ -1,6 +1,6 @@ -import type { CSSProperties, ReactNode } from 'react' import React from 'react' -import { default as styled } from 'styled-components' +import type { CSSProperties, ReactNode } from 'react' +import { Wrapper } from './styles' export interface IProps { padding?: number | string @@ -10,22 +10,6 @@ export interface IProps { children?: ReactNode } -const Wrapper = styled.div` - position: absolute; - left: 0; - top: 0; - bottom: 0; - right: 0; - display: flex; - align-items: center; - justify-content: flex-end; - opacity: 0; - transition: opacity 200ms ease; - &:hover { - opacity: 1; - } -` - const FabWrapper = ({ padding, children, style, width, height }: IProps) => ( <Wrapper className='list-item-action' diff --git a/src/experimental/fab/fab.stories.tsx b/src/experimental/fab/fab.stories.tsx index 112b34d9..e50bea57 100644 --- a/src/experimental/fab/fab.stories.tsx +++ b/src/experimental/fab/fab.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' import { FileCopy } from '@/icons' -import { FabV2 } from './fab' +import FabV2 from './fab' import FabWrapper from './fab-wrapper' const Template: StoryFn<typeof FabV2> = args => <FabV2 {...args} /> diff --git a/src/experimental/fab/fab.tsx b/src/experimental/fab/fab.tsx index 7c82aecc..e889f337 100644 --- a/src/experimental/fab/fab.tsx +++ b/src/experimental/fab/fab.tsx @@ -15,7 +15,7 @@ export interface IProps extends FabProps { onClick(event: MouseEvent<HTMLButtonElement>): void } -export const FabV2 = (props: IProps) => { +const FabV2 = (props: IProps) => { const renderButton = () => { const { large, children, padding, name, margin, style, ...otherProps } = props diff --git a/src/experimental/fab/styles.ts b/src/experimental/fab/styles.ts new file mode 100644 index 00000000..df4d1e99 --- /dev/null +++ b/src/experimental/fab/styles.ts @@ -0,0 +1,17 @@ +import { default as styled } from 'styled-components' + +export const Wrapper = styled.div` + position: absolute; + left: 0; + top: 0; + bottom: 0; + right: 0; + display: flex; + align-items: center; + justify-content: flex-end; + opacity: 0; + transition: opacity 200ms ease; + &:hover { + opacity: 1; + } +` diff --git a/src/experimental/index.ts b/src/experimental/index.ts index 6bd70dc7..8a1128a1 100644 --- a/src/experimental/index.ts +++ b/src/experimental/index.ts @@ -1,13 +1,13 @@ -export { default as Sidebar } from './sidebar' export * from './fab' -export { default as Card } from './card' -export { default as Button } from './button' export * from './dialog' export { default as Avatar } from './avatar' export { default as Actions, Wrapper } from './actions' export { default as Breadcrumbs } from './breadcrumbs' +export { default as Button } from './button' +export { default as Card } from './card' export { default as Loading } from './loading' +export { default as NothingFound } from './nothing-found' export { default as Panel } from './panel' +export { default as Sidebar } from './sidebar' export { default as Skeleton } from './skeleton' export { default as VisibilityIcon } from './visibility-icon' -export { default as NothingFound } from './nothing-found' diff --git a/src/experimental/loading/index.tsx b/src/experimental/loading/index.tsx index c9b33015..3ffe2b45 100644 --- a/src/experimental/loading/index.tsx +++ b/src/experimental/loading/index.tsx @@ -1,6 +1,6 @@ import React, { useMemo } from 'react' -import { default as styled } from 'styled-components' import { Progress } from '@/index' +import { LoadingContainer } from './styles' export interface IProps { padding?: number | string @@ -8,14 +8,7 @@ export interface IProps { size?: number } -const LoadingContainer = styled.div` - display: flex; - flex: 1; - align-items: center; - justify-content: center; -` - -export const Loading = (props: IProps) => { +const Loading = (props: IProps) => { const { margin = 48, padding = 24, size = 72 } = props const renderLoading = useMemo( diff --git a/src/experimental/loading/loading.spec.tsx b/src/experimental/loading/loading.spec.tsx index 65e78468..5a269638 100644 --- a/src/experimental/loading/loading.spec.tsx +++ b/src/experimental/loading/loading.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Loading } from '.' +import Loading from '.' export const DefaultLoading = () => <Loading /> export const CustomSizeLoading = () => <Loading size={32} /> diff --git a/src/experimental/loading/loading.stories.tsx b/src/experimental/loading/loading.stories.tsx index 55e1752d..516e7543 100644 --- a/src/experimental/loading/loading.stories.tsx +++ b/src/experimental/loading/loading.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Loading } from '.' +import Loading from '.' export default { title: 'Experimental/Loading', diff --git a/src/experimental/loading/styles.ts b/src/experimental/loading/styles.ts new file mode 100644 index 00000000..87a70671 --- /dev/null +++ b/src/experimental/loading/styles.ts @@ -0,0 +1,8 @@ +import { default as styled } from 'styled-components' + +export const LoadingContainer = styled.div` + display: flex; + flex: 1; + align-items: center; + justify-content: center; +` diff --git a/src/experimental/nothing-found/index.tsx b/src/experimental/nothing-found/index.tsx index c15092ed..d50666ba 100644 --- a/src/experimental/nothing-found/index.tsx +++ b/src/experimental/nothing-found/index.tsx @@ -10,12 +10,12 @@ export interface IProps extends TypographyProps { show: boolean } -export const NothingFound = (props: IProps) => { +const NothingFound = (props: IProps) => { const { buttonLabel, readonly, ...rest } = props const label = buttonLabel || 'Adicionar' const message = readonly ? 'Não há nada aqui.' - : 'Não há nada aqui. Clique em "' + label + '" para cadastrar um item.' + : `Não há nada aqui. Clique em "${label}" para cadastrar um item.` const { customText = message, searchText = '', show, ...otherProps } = rest @@ -27,9 +27,7 @@ export const NothingFound = (props: IProps) => { padding='48px 0' {...otherProps}> {searchText !== '' - ? 'Sua pesquisa "' + - searchText + - '" não retornou nenhum resultado.' + ? `Sua pesquisa "${searchText}" não retornou nenhum resultado.` : customText} </TextTypography> ) : null diff --git a/src/experimental/nothing-found/nothing-found.spec.tsx b/src/experimental/nothing-found/nothing-found.spec.tsx index fa5fe2c9..d202a685 100644 --- a/src/experimental/nothing-found/nothing-found.spec.tsx +++ b/src/experimental/nothing-found/nothing-found.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { NothingFound } from '.' +import NothingFound from '.' const Default = ({ show = true }: { show?: boolean }) => { return <NothingFound show={show} /> diff --git a/src/experimental/nothing-found/nothing-found.stories.tsx b/src/experimental/nothing-found/nothing-found.stories.tsx index 1ec33d9c..a2227dbb 100644 --- a/src/experimental/nothing-found/nothing-found.stories.tsx +++ b/src/experimental/nothing-found/nothing-found.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { NothingFound } from '.' +import NothingFound from '.' export default { title: 'Experimental/NothingFound', diff --git a/src/experimental/panel/index.tsx b/src/experimental/panel/index.tsx index 5f9a264e..c334b77b 100644 --- a/src/experimental/panel/index.tsx +++ b/src/experimental/panel/index.tsx @@ -1,20 +1,9 @@ import React from 'react' import type { CSSProperties, ChangeEvent, MouseEvent, ReactNode } from 'react' import { defaultTo } from 'ramda' -import { default as styled } from 'styled-components' import type { PaperProps as FlipperPaperProps } from '@/core/surfaces/paper' import { ExpandMore as IconExpand } from '@/icons' -import { ExpansionPanel, Typography } from '@/index' - -const Paper = styled(ExpansionPanel)` - && { - border-radius: 4px; - ::before { - height: 0px; - background-color: transparent; - } - } -` +import { Paper, Summary, Title } from './styles' export interface PaperProps extends Omit<FlipperPaperProps, 'title' | 'onChange'> { @@ -40,22 +29,10 @@ export interface PaperProps onClick?(event: MouseEvent<HTMLDivElement>): void } -const Summary = styled.div` - display: flex; - flex: 1; - align-items: center; -` - -const Title = styled(Typography)` - && { - flex: 1; - } -` - const NESTED_ELEVATION = 0 const DEFAULT_ELEVATION = 2 -export const Panel = (props: PaperProps) => { +const Panel = (props: PaperProps) => { const { hideExpansionIcon, expanded, diff --git a/src/experimental/panel/panel.spec.tsx b/src/experimental/panel/panel.spec.tsx index a725cd7f..98f02e46 100644 --- a/src/experimental/panel/panel.spec.tsx +++ b/src/experimental/panel/panel.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen, waitFor } from '@testing-library/react' -import { Panel } from '.' +import Panel from '.' describe('Panel', () => { const TITLE = 'Foo' diff --git a/src/experimental/panel/panel.stories.tsx b/src/experimental/panel/panel.stories.tsx index 1ccc038e..f07014f1 100644 --- a/src/experimental/panel/panel.stories.tsx +++ b/src/experimental/panel/panel.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Panel } from '.' +import Panel from '.' export default { title: 'Experimental/Panel', diff --git a/src/experimental/panel/styles.ts b/src/experimental/panel/styles.ts new file mode 100644 index 00000000..af82d3d0 --- /dev/null +++ b/src/experimental/panel/styles.ts @@ -0,0 +1,24 @@ +import { default as styled } from 'styled-components' +import { ExpansionPanel, Typography } from '@/index' + +export const Paper = styled(ExpansionPanel)` + && { + border-radius: 4px; + ::before { + height: 0px; + background-color: transparent; + } + } +` + +export const Summary = styled.div` + display: flex; + flex: 1; + align-items: center; +` + +export const Title = styled(Typography)` + && { + flex: 1; + } +` diff --git a/src/experimental/sidebar/index.tsx b/src/experimental/sidebar/index.tsx index c9ba52b6..c0d4beaf 100644 --- a/src/experimental/sidebar/index.tsx +++ b/src/experimental/sidebar/index.tsx @@ -63,7 +63,7 @@ const useSidebar = () => { /** * Sidebar component V2 */ -export const Sidebar = (props: IProps) => { +const Sidebar = (props: IProps) => { const { options, loading, diff --git a/src/experimental/sidebar/sidebar.spec.tsx b/src/experimental/sidebar/sidebar.spec.tsx index 0571d7b6..55fa7580 100644 --- a/src/experimental/sidebar/sidebar.spec.tsx +++ b/src/experimental/sidebar/sidebar.spec.tsx @@ -2,7 +2,7 @@ import * as React from 'react' import { render, screen, waitFor } from '@testing-library/react' import { userEvent } from '@testing-library/user-event' import type { ISidebarOption } from '.' -import { Sidebar } from '.' +import Sidebar from '.' const options: ISidebarOption[] = [ { diff --git a/src/experimental/sidebar/sidebar.stories.tsx b/src/experimental/sidebar/sidebar.stories.tsx index d6fa52a8..db6693a3 100644 --- a/src/experimental/sidebar/sidebar.stories.tsx +++ b/src/experimental/sidebar/sidebar.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' import { Home, Computer, Edit } from '@/icons' -import { Sidebar } from '.' +import Sidebar from '.' export default { title: 'Experimental/Sidebar', diff --git a/src/experimental/skeleton/index.tsx b/src/experimental/skeleton/index.tsx index c4046a4c..b44a1cf7 100644 --- a/src/experimental/skeleton/index.tsx +++ b/src/experimental/skeleton/index.tsx @@ -6,7 +6,7 @@ import { theme } from '@/theme' const { grays } = theme.colors -export const Skeleton = (props: SkeletonProps) => ( +const Skeleton = (props: SkeletonProps) => ( <SkeletonLoading containerTestId='skeleton-container' baseColor={grays.g7} diff --git a/src/experimental/skeleton/skeleton.spec.tsx b/src/experimental/skeleton/skeleton.spec.tsx index d2e8a3a3..850d7988 100644 --- a/src/experimental/skeleton/skeleton.spec.tsx +++ b/src/experimental/skeleton/skeleton.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Skeleton } from '.' +import Skeleton from '.' const Simple = () => <Skeleton /> const WithCustomHeight = () => <Skeleton width={64} height={64} /> diff --git a/src/experimental/skeleton/skeleton.stories.tsx b/src/experimental/skeleton/skeleton.stories.tsx index 22f8026d..ded61947 100644 --- a/src/experimental/skeleton/skeleton.stories.tsx +++ b/src/experimental/skeleton/skeleton.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Skeleton } from '.' +import Skeleton from '.' export default { title: 'Experimental/Skeleton', diff --git a/src/experimental/visibility-icon/index.tsx b/src/experimental/visibility-icon/index.tsx index 2da8eb96..f68b2c04 100644 --- a/src/experimental/visibility-icon/index.tsx +++ b/src/experimental/visibility-icon/index.tsx @@ -1,10 +1,9 @@ import React from 'react' -import { default as styled } from 'styled-components' import { Visibility as IconVisibility, VisibilityOff as IconVisibilityOff } from '@/icons' -import { IconButton } from '@/index' +import { StyledButton } from './styles' export interface IProps { name?: string @@ -12,17 +11,7 @@ export interface IProps { onToggle(): void } -const StyledButton = styled(IconButton)` - width: 36px !important; - height: 36px !important; -` - -export const VisibilityIcon = ({ - show, - onToggle, - name, - ...otherProps -}: IProps) => ( +const VisibilityIcon = ({ show, onToggle, name, ...otherProps }: IProps) => ( <StyledButton {...otherProps} padding='0px' name={name} onClick={onToggle}> {show ? ( <IconVisibilityOff data-testid='icon-off' /> diff --git a/src/experimental/visibility-icon/styles.ts b/src/experimental/visibility-icon/styles.ts new file mode 100644 index 00000000..b606a65d --- /dev/null +++ b/src/experimental/visibility-icon/styles.ts @@ -0,0 +1,7 @@ +import { default as styled } from 'styled-components' +import { IconButton } from '@/index' + +export const StyledButton = styled(IconButton)` + width: 36px !important; + height: 36px !important; +` diff --git a/src/experimental/visibility-icon/visibility-icon.spec.tsx b/src/experimental/visibility-icon/visibility-icon.spec.tsx index aead7bec..c0feb975 100644 --- a/src/experimental/visibility-icon/visibility-icon.spec.tsx +++ b/src/experimental/visibility-icon/visibility-icon.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { fireEvent, render, screen } from '@testing-library/react' -import { VisibilityIcon } from '.' +import VisibilityIcon from '.' describe('VisibilityIcon', () => { it('should render visible', () => { diff --git a/src/experimental/visibility-icon/visibility-icon.stories.tsx b/src/experimental/visibility-icon/visibility-icon.stories.tsx index 892078d8..94f13c7a 100644 --- a/src/experimental/visibility-icon/visibility-icon.stories.tsx +++ b/src/experimental/visibility-icon/visibility-icon.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { VisibilityIcon } from '.' +import VisibilityIcon from '.' export default { title: 'Experimental/VisibilityIcon', diff --git a/src/index.ts b/src/index.ts index 335c7474..9ba9a02f 100644 --- a/src/index.ts +++ b/src/index.ts @@ -61,7 +61,7 @@ export { default as Zoom } from './core/feedback/zoom' export { default as PinInput } from './core/inputs/pin-input' export { default as Chapter } from './core/data-display/chapter' export { default as DataTable } from './core/data-display/data-table' -export { default as DataTableField } from './core/data-display/data-table' +export { default as DataTableField } from './core/data-display/data-table/data-table-field' export { default as StepCard } from './core/surfaces/step-card' export { default as StepCardSkeleton } from './core/surfaces/step-card/step-card-skeleton' export { default as ValidationDialog } from './core/feedback/validation-dialog/' diff --git a/src/test/mocks/data-table-hidden-mock.tsx b/src/test/mocks/data-table-hidden-mock.tsx index d5bdad93..09fc5527 100644 --- a/src/test/mocks/data-table-hidden-mock.tsx +++ b/src/test/mocks/data-table-hidden-mock.tsx @@ -7,10 +7,10 @@ import type { Identifier } from '@/core/data-display/data-table/types' import { DataTableAction } from '@/core/data-display/data-table' -import { DataTable } from '@/core/data-display/data-table/data-table' +import DataTable from '@/core/data-display/data-table/data-table' import { RowMode } from '@/core/data-display/data-table/types' -import { Typography } from '@/core/data-display/typography' -import { Button } from '@/core/inputs/button' +import Typography from '@/core/data-display/typography' +import Button from '@/core/inputs/button' import { Cancel as CancelIcon, Check as CheckIcon, diff --git a/src/test/mocks/data-table-mock.tsx b/src/test/mocks/data-table-mock.tsx index e5263662..3f8d0a86 100644 --- a/src/test/mocks/data-table-mock.tsx +++ b/src/test/mocks/data-table-mock.tsx @@ -7,10 +7,10 @@ import type { Identifier } from '@/core/data-display/data-table/types' import { DataTableAction } from '@/core/data-display/data-table' -import { DataTable } from '@/core/data-display/data-table/data-table' +import DataTable from '@/core/data-display/data-table/data-table' import { RowMode } from '@/core/data-display/data-table/types' -import { Typography } from '@/core/data-display/typography' -import { Button } from '@/core/inputs/button' +import Typography from '@/core/data-display/typography' +import Button from '@/core/inputs/button' import { Cancel as CancelIcon, Check as CheckIcon, diff --git a/src/test/mocks/date-time-mock.tsx b/src/test/mocks/date-time-mock.tsx index bf09ee99..093d23d3 100644 --- a/src/test/mocks/date-time-mock.tsx +++ b/src/test/mocks/date-time-mock.tsx @@ -2,7 +2,7 @@ import * as React from 'react' import { isValid, startOfDay } from 'date-fns' import type { DateTimeProps } from '@/core/inputs/date-time' import type { MaterialUiPickersDate } from '@material-ui/pickers/typings/date' -import { DateTime } from '@/core/inputs/date-time' +import DateTime from '@/core/inputs/date-time' interface IProps { initialValue?: string diff --git a/src/test/mocks/editable-table-date-mock.tsx b/src/test/mocks/editable-table-date-mock.tsx index 5948a396..fc024723 100644 --- a/src/test/mocks/editable-table-date-mock.tsx +++ b/src/test/mocks/editable-table-date-mock.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import type { EditableTableProps } from '@/core/data-display/editable-table' -import { EditableTable } from '@/core/data-display/editable-table' +import EditableTable from '@/core/data-display/editable-table' interface IProps<T extends object> { tableProps?: Partial<EditableTableProps<T>> diff --git a/src/test/mocks/editable-table-mock.tsx b/src/test/mocks/editable-table-mock.tsx index efe6f6b1..544dd1f0 100644 --- a/src/test/mocks/editable-table-mock.tsx +++ b/src/test/mocks/editable-table-mock.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import type { EditableTableProps } from '@/core/data-display/editable-table' -import { EditableTable } from '@/core/data-display/editable-table' +import EditableTable from '@/core/data-display/editable-table' interface IProps<T extends object> { tableProps?: Partial<EditableTableProps<T>> diff --git a/src/test/mocks/pin-input-mock.tsx b/src/test/mocks/pin-input-mock.tsx index da30d850..9e3257a6 100644 --- a/src/test/mocks/pin-input-mock.tsx +++ b/src/test/mocks/pin-input-mock.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react' import { Button } from '@material-ui/core' import type { PinInputGridProps } from '@/core/inputs/pin-input' -import { PinInput } from '@/core/inputs/pin-input' +import PinInput from '@/core/inputs/pin-input' const PIN_LENGTH = 6 diff --git a/src/test/mocks/radio-group-mock.tsx b/src/test/mocks/radio-group-mock.tsx index f0c7696c..1a90e72a 100644 --- a/src/test/mocks/radio-group-mock.tsx +++ b/src/test/mocks/radio-group-mock.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import type { RadioGroupProps } from '@/core/inputs/radio-group' -import { RadioGroup } from '@/core/inputs/radio-group' +import RadioGroup from '@/core/inputs/radio-group' interface IProps { radioGroupProps?: Partial<RadioGroupProps> diff --git a/src/test/mocks/select-mock.tsx b/src/test/mocks/select-mock.tsx index 9d11c984..830c4d53 100644 --- a/src/test/mocks/select-mock.tsx +++ b/src/test/mocks/select-mock.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import type { SelectProps } from '@/core/inputs/select' import ListItem from '@/core/data-display/list-item' -import { Select } from '@/core/inputs/select' +import Select from '@/core/inputs/select' interface IProps { initialValue?: string diff --git a/src/test/mocks/step-card-mock.tsx b/src/test/mocks/step-card-mock.tsx index 77b1a308..3787ec8f 100644 --- a/src/test/mocks/step-card-mock.tsx +++ b/src/test/mocks/step-card-mock.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import type { IStepCardProps } from '@/core/surfaces/step-card' -import { StepCard } from '@/core/surfaces/step-card' +import StepCard from '@/core/surfaces/step-card' interface IProps { initialLoading?: boolean diff --git a/src/test/mocks/text-field-mock.tsx b/src/test/mocks/text-field-mock.tsx index 1e85f2fb..363c04d7 100644 --- a/src/test/mocks/text-field-mock.tsx +++ b/src/test/mocks/text-field-mock.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import type { TextFieldProps } from '@/core/inputs/text-field' import ListItem from '@/core/data-display/list-item' -import { TextField } from '@/core/inputs/text-field' +import TextField from '@/core/inputs/text-field' interface IProps { initialOption?: string diff --git a/src/test/mocks/text-field-options-mock.tsx b/src/test/mocks/text-field-options-mock.tsx index 4610ca6f..264a4e22 100644 --- a/src/test/mocks/text-field-options-mock.tsx +++ b/src/test/mocks/text-field-options-mock.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import type { IOption, TextFieldProps } from '@/core/inputs/text-field' -import { TextField } from '@/core/inputs/text-field' +import TextField from '@/core/inputs/text-field' interface IProps { initialOption?: string From b64a3ff258559d7ae96e9b919ea770f508432f2b Mon Sep 17 00:00:00 2001 From: Karine Brandelli <karinebrandelli@live.com> Date: Sun, 18 Feb 2024 10:21:37 -0300 Subject: [PATCH 03/10] chore: disable max-len --- src/core/inputs/date-time/index.tsx | 1 + src/index.ts | 1 + 2 files changed, 2 insertions(+) diff --git a/src/core/inputs/date-time/index.tsx b/src/core/inputs/date-time/index.tsx index cc5474f3..b2854baf 100644 --- a/src/core/inputs/date-time/index.tsx +++ b/src/core/inputs/date-time/index.tsx @@ -9,6 +9,7 @@ import { } from '@material-ui/pickers' import type { DefaultProps } from '../../types' import type { KeyboardDatePickerProps } from '@material-ui/pickers/DatePicker' +// eslint-disable-next-line @stylistic/max-len import type { KeyboardDateTimePickerProps } from '@material-ui/pickers/DateTimePicker' import type { KeyboardTimePickerProps } from '@material-ui/pickers/TimePicker' import type { MaterialUiPickersDate } from '@material-ui/pickers/typings/date' diff --git a/src/index.ts b/src/index.ts index 9ba9a02f..df950371 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,3 +1,4 @@ +/* eslint-disable @stylistic/max-len */ export { default as Advertise } from './core/data-display/advertise' export { default as AutoComplete } from './core/inputs/auto-complete' export { default as Avatar } from './core/data-display/avatar' From c88932741c09160017113be54edcd082f8b0d5ab Mon Sep 17 00:00:00 2001 From: Karine Brandelli <karinebrandelli@live.com> Date: Wed, 6 Mar 2024 09:22:29 -0300 Subject: [PATCH 04/10] chore: remove eslint-react-perf dependency and rules --- .eslintrc.js | 4 ---- package.json | 1 - yarn.lock | 5 ----- 3 files changed, 10 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index 2e764cea..de2e5d1c 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -2,14 +2,11 @@ const rulesReact = { 'react/prop-types': 'off', 'react/display-name': 'off', 'react/no-unescaped-entities': 'off', - 'react-perf/jsx-no-new-function-as-prop': 'off', 'react/jsx-key': 'warn', 'react/jsx-pascal-case': 'warn', 'react/self-closing-comp': 'warn', 'react/no-unstable-nested-components': 'warn', - 'react-perf/jsx-no-new-array-as-prop': 'warn', - 'react-perf/jsx-no-new-object-as-prop': 'warn', 'react/jsx-sort-props': [ 'warn', { @@ -187,7 +184,6 @@ module.exports = { }, plugins: [ 'react-hooks', - 'react-perf', '@typescript-eslint', 'import', '@stylistic' diff --git a/package.json b/package.json index 4b5f0aa5..db9c2a21 100644 --- a/package.json +++ b/package.json @@ -91,7 +91,6 @@ "eslint-plugin-prettier": "5.1.3", "eslint-plugin-react": "7.33.2", "eslint-plugin-react-hooks": "4.6.0", - "eslint-plugin-react-perf": "3.3.2", "fs-extra": "11.2.0", "identity-obj-proxy": "3.0.0", "jest": "29.7.0", diff --git a/yarn.lock b/yarn.lock index 08288331..ec521097 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5767,11 +5767,6 @@ eslint-plugin-react-hooks@4.6.0: resolved "https://registry.yarnpkg.com/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.0.tgz#4c3e697ad95b77e93f8646aaa1630c1ba607edd3" integrity sha512-oFc7Itz9Qxh2x4gNHStv3BqJq54ExXmfC+a1NjAta66IAN87Wu0R/QArgIS9qKzX3dXKPI9H5crl9QchNMY9+g== -eslint-plugin-react-perf@3.3.2: - version "3.3.2" - resolved "https://registry.yarnpkg.com/eslint-plugin-react-perf/-/eslint-plugin-react-perf-3.3.2.tgz#1f48045f785ba884c823c07f4183a915ce0f78ce" - integrity sha512-boVn4IDHAjgGoAuAQ5Zrewt8fNbMDdiR7B2AkuiSK8lrJ9FwlOZc085kCs7+8u6B+YZ+pOn+tYG00xktnGAfOw== - eslint-plugin-react@7.33.2: version "7.33.2" resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.33.2.tgz#69ee09443ffc583927eafe86ffebb470ee737608" From 3a7ba356256765bd06aa93899a0d6cd8f1613207 Mon Sep 17 00:00:00 2001 From: Karine Brandelli <karinebrandelli@live.com> Date: Wed, 6 Mar 2024 09:28:37 -0300 Subject: [PATCH 05/10] chore: run eslint --- .eslintrc.js | 15 ++++++++++++- src/core/data-display/chip/chip.stories.tsx | 2 +- .../data-table-pagination-actions.tsx | 2 +- .../data-table-query-paginated.stories.tsx | 8 +++---- .../data-table/data-table.stories.tsx | 8 +++---- .../data-display/editable-table/index.tsx | 22 +++++++++---------- src/core/data-display/list/list.stories.tsx | 2 +- .../validation-dialog.spec.tsx | 2 +- .../validaton-dialog.stories.tsx | 2 +- src/core/inputs/button/button.stories.tsx | 2 +- src/core/inputs/date-time/index.tsx | 1 - .../icon-button/icon-button.stories.tsx | 2 +- src/core/inputs/text-field/index.tsx | 2 +- src/core/navigation/drawer/drawer.stories.tsx | 2 +- src/core/navigation/menu/menu.spec.tsx | 2 +- src/core/navigation/menu/menu.stories.tsx | 2 +- src/core/navigation/pagination/index.tsx | 2 +- src/core/navigation/sidebar/index.tsx | 2 +- src/core/navigation/sidebar/sidebar.spec.tsx | 2 +- .../navigation/sidebar/sidebar.stories.tsx | 2 +- src/core/navigation/stepper/stepper.spec.tsx | 2 +- .../navigation/stepper/stepper.stories.tsx | 2 +- .../expansion-panel.stories.tsx | 2 +- .../surfaces/step-card/step-card-panel.tsx | 2 +- src/experimental/breadcrumbs/index.tsx | 2 +- src/experimental/button/index.tsx | 2 +- src/experimental/card/index.tsx | 2 +- src/experimental/fab/fab.spec.tsx | 2 +- src/experimental/fab/fab.stories.tsx | 2 +- src/experimental/panel/index.tsx | 2 +- src/experimental/sidebar/sidebar.stories.tsx | 2 +- src/experimental/visibility-icon/index.tsx | 2 +- src/index.ts | 1 - src/test/mocks/snackbar-mock.tsx | 2 +- 34 files changed, 61 insertions(+), 50 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index de2e5d1c..8f4d9cf6 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -40,11 +40,19 @@ const rulesEslint = { 'no-console': ['error', { allow: ['error'] }], 'prefer-const': ['error', { destructuring: 'all' }], - '@stylistic/max-len': ['error', { code: 85 }], '@stylistic/key-spacing': [ 'error', { beforeColon: false, afterColon: true } ], + '@stylistic/max-len': [ + 'error', + { + code: 85, + ignoreStrings: true, + ignoreRegExpLiterals: true, + ignoreTemplateLiterals: true + } + ], '@stylistic/padding-line-between-statements': [ 'error', { blankLine: 'always', prev: '*', next: 'return' }, @@ -102,6 +110,11 @@ const rulesImport = { group: 'index', position: 'after' }, + { + pattern: '@/icons', + group: 'index', + position: 'after' + }, { pattern: '@/theme', group: 'index', diff --git a/src/core/data-display/chip/chip.stories.tsx b/src/core/data-display/chip/chip.stories.tsx index c157503b..8dde8ebd 100644 --- a/src/core/data-display/chip/chip.stories.tsx +++ b/src/core/data-display/chip/chip.stories.tsx @@ -1,8 +1,8 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' import Avatar from '@/core/data-display/avatar' -import { Face } from '@/icons' import Chip from '.' +import { Face } from '@/icons' export default { title: 'DataDisplay/Chip', diff --git a/src/core/data-display/data-table/data-table-pagination-actions.tsx b/src/core/data-display/data-table/data-table-pagination-actions.tsx index f1479a70..8811027a 100644 --- a/src/core/data-display/data-table/data-table-pagination-actions.tsx +++ b/src/core/data-display/data-table/data-table-pagination-actions.tsx @@ -1,13 +1,13 @@ import React from 'react' import type { MouseEvent } from 'react' import IconButton from '@/core/inputs/icon-button' +import { PaginationWrapper } from './styles' import { FirstPage, LastPage, KeyboardArrowLeft, KeyboardArrowRight } from '@/icons' -import { PaginationWrapper } from './styles' interface DataTablePaginationActionsProps { count: number diff --git a/src/core/data-display/data-table/data-table-query-paginated.stories.tsx b/src/core/data-display/data-table/data-table-query-paginated.stories.tsx index 557c7f4b..0583eef4 100644 --- a/src/core/data-display/data-table/data-table-query-paginated.stories.tsx +++ b/src/core/data-display/data-table/data-table-query-paginated.stories.tsx @@ -7,6 +7,10 @@ import format from 'date-fns/format' import type { ColumnSpec, DataTableController, Identifier } from './types' import type { Meta } from '@storybook/react' import Button from '@/core/inputs/button' +import { DataTableAction } from './data-table-action' +import DataTableQueryPaginated from './data-table-query-paginated' +import { RowMode } from './types' +import { usePaginated } from './use-paginated' import { Cancel as CancelIcon, Check as CheckIcon, @@ -14,10 +18,6 @@ import { Edit as EditIcon, Save as SaveIcon } from '@/icons' -import { DataTableAction } from './data-table-action' -import DataTableQueryPaginated from './data-table-query-paginated' -import { RowMode } from './types' -import { usePaginated } from './use-paginated' export default { title: 'DataDisplay/DataTableQueryPaginated', diff --git a/src/core/data-display/data-table/data-table.stories.tsx b/src/core/data-display/data-table/data-table.stories.tsx index bce39670..323bafd2 100644 --- a/src/core/data-display/data-table/data-table.stories.tsx +++ b/src/core/data-display/data-table/data-table.stories.tsx @@ -6,6 +6,10 @@ import type { ColumnSpec, DataTableController, Identifier } from './types' import type { Meta } from '@storybook/react' import Typography from '@/core/data-display/typography' import Button from '@/core/inputs/button' +import DataTable from './data-table' +import { DataTableAction } from './data-table-action' +import DataTableField from './data-table-field' +import { RowMode } from './types' import { Delete as DeleteIcon, Edit as EditIcon, @@ -15,10 +19,6 @@ import { Visibility as VisibilityIcon, VisibilityOff as VisibilityOffIcon } from '@/icons' -import DataTable from './data-table' -import { DataTableAction } from './data-table-action' -import DataTableField from './data-table-field' -import { RowMode } from './types' export default { title: 'DataDisplay/DataTable', diff --git a/src/core/data-display/editable-table/index.tsx b/src/core/data-display/editable-table/index.tsx index b5990469..916803af 100644 --- a/src/core/data-display/editable-table/index.tsx +++ b/src/core/data-display/editable-table/index.tsx @@ -16,17 +16,6 @@ import Button from '@/core/inputs/button' import DateTime from '@/core/inputs/date-time' import MaskField from '@/core/inputs/mask-field' import TextField from '@/core/inputs/text-field' -import { - NoteAdd as IconAdd, - Done as IconDone, - Delete as IconRemove, - Clear as IconClear, - Edit as IconEdit, - ChevronLeft as IconChevronLeft, - ChevronRight as IconChevronRight, - FirstPage as IconFirstPage, - LastPage -} from '@/icons' import { getLocalization } from '@/lib/localization' import { AddRowButton, @@ -38,6 +27,17 @@ import { RightPagination, Wrapper } from './styles' +import { + NoteAdd as IconAdd, + Done as IconDone, + Delete as IconRemove, + Clear as IconClear, + Edit as IconEdit, + ChevronLeft as IconChevronLeft, + ChevronRight as IconChevronRight, + FirstPage as IconFirstPage, + LastPage +} from '@/icons' export interface EditableTableProps<T extends object> { /** diff --git a/src/core/data-display/list/list.stories.tsx b/src/core/data-display/list/list.stories.tsx index 1e0ef7fa..8909de5c 100644 --- a/src/core/data-display/list/list.stories.tsx +++ b/src/core/data-display/list/list.stories.tsx @@ -1,9 +1,9 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' import ListItem from '@/core/data-display/list-item' -import { Backup } from '@/icons' import Avatar from '../avatar' import List from '.' +import { Backup } from '@/icons' export default { title: 'DataDisplay/List', diff --git a/src/core/feedback/validation-dialog/validation-dialog.spec.tsx b/src/core/feedback/validation-dialog/validation-dialog.spec.tsx index 88078470..e03a245b 100644 --- a/src/core/feedback/validation-dialog/validation-dialog.spec.tsx +++ b/src/core/feedback/validation-dialog/validation-dialog.spec.tsx @@ -2,8 +2,8 @@ import React from 'react' import CircularProgress from '@mui/material/CircularProgress' import { render, screen, fireEvent } from '@testing-library/react' import type { ITitles, IValidations } from '.' -import { CheckCircleOutline, CancelOutlined } from '@/icons' import ValidationDialog, { ValidationStatus } from '.' +import { CheckCircleOutline, CancelOutlined } from '@/icons' import { theme } from '@/theme' const { action, secondary } = theme.colors diff --git a/src/core/feedback/validation-dialog/validaton-dialog.stories.tsx b/src/core/feedback/validation-dialog/validaton-dialog.stories.tsx index 8473692d..bc13cc6f 100644 --- a/src/core/feedback/validation-dialog/validaton-dialog.stories.tsx +++ b/src/core/feedback/validation-dialog/validaton-dialog.stories.tsx @@ -4,8 +4,8 @@ import { ThemeProvider } from 'styled-components' import type { Meta, StoryObj } from '@storybook/react' import ThemeProviderFlipper from '@/core/context/theme-provider' import Button from '@/core/inputs/button' -import { CheckCircleOutline, CancelOutlined } from '@/icons' import ValidationDialog, { ValidationStatus } from '.' +import { CheckCircleOutline, CancelOutlined } from '@/icons' import { muiThemeOptions, theme } from '@/theme' const { action, secondary } = theme.colors diff --git a/src/core/inputs/button/button.stories.tsx b/src/core/inputs/button/button.stories.tsx index e239d948..bf1403ad 100644 --- a/src/core/inputs/button/button.stories.tsx +++ b/src/core/inputs/button/button.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Add as IconAdd } from '@/icons' import Button from '.' +import { Add as IconAdd } from '@/icons' export default { title: 'Inputs/Button', diff --git a/src/core/inputs/date-time/index.tsx b/src/core/inputs/date-time/index.tsx index b2854baf..cc5474f3 100644 --- a/src/core/inputs/date-time/index.tsx +++ b/src/core/inputs/date-time/index.tsx @@ -9,7 +9,6 @@ import { } from '@material-ui/pickers' import type { DefaultProps } from '../../types' import type { KeyboardDatePickerProps } from '@material-ui/pickers/DatePicker' -// eslint-disable-next-line @stylistic/max-len import type { KeyboardDateTimePickerProps } from '@material-ui/pickers/DateTimePicker' import type { KeyboardTimePickerProps } from '@material-ui/pickers/TimePicker' import type { MaterialUiPickersDate } from '@material-ui/pickers/typings/date' diff --git a/src/core/inputs/icon-button/icon-button.stories.tsx b/src/core/inputs/icon-button/icon-button.stories.tsx index 838f1f67..1f0bfed4 100644 --- a/src/core/inputs/icon-button/icon-button.stories.tsx +++ b/src/core/inputs/icon-button/icon-button.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Add as IconAdd } from '@/icons' import IconButton from '.' +import { Add as IconAdd } from '@/icons' export default { title: 'Inputs/IconButton', diff --git a/src/core/inputs/text-field/index.tsx b/src/core/inputs/text-field/index.tsx index a64981b6..720f90ef 100644 --- a/src/core/inputs/text-field/index.tsx +++ b/src/core/inputs/text-field/index.tsx @@ -23,7 +23,6 @@ import type { InputBaseComponentProps, TextFieldProps as MuiTextFieldProps } from '@material-ui/core' -import { Clear, Help as ContactSupportIcon, Edit, Save } from '@/icons' import IconButton from '../icon-button' import { CharactersCount, @@ -31,6 +30,7 @@ import { StaticTextFieldWrapper, TextFieldWrapper } from './styles' +import { Clear, Help as ContactSupportIcon, Edit, Save } from '@/icons' import { theme } from '@/theme' const { primary } = theme.colors diff --git a/src/core/navigation/drawer/drawer.stories.tsx b/src/core/navigation/drawer/drawer.stories.tsx index 41db73b7..00cdba4c 100644 --- a/src/core/navigation/drawer/drawer.stories.tsx +++ b/src/core/navigation/drawer/drawer.stories.tsx @@ -3,8 +3,8 @@ import type { Meta } from '@storybook/react' import List from '@/core/data-display/list' import ListItem from '@/core/data-display/list-item' import Button from '@/core/inputs/button' -import { Backup as IconBackup } from '@/icons' import Drawer from '.' +import { Backup as IconBackup } from '@/icons' export default { title: 'Navigation/Drawer', diff --git a/src/core/navigation/menu/menu.spec.tsx b/src/core/navigation/menu/menu.spec.tsx index d14f3140..6c9307a8 100644 --- a/src/core/navigation/menu/menu.spec.tsx +++ b/src/core/navigation/menu/menu.spec.tsx @@ -1,8 +1,8 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' import ListItem from '@/core/data-display/list-item' -import { Backup } from '@/icons' import Menu from '.' +import { Backup } from '@/icons' describe('Menu', () => { it('should render opened', () => { diff --git a/src/core/navigation/menu/menu.stories.tsx b/src/core/navigation/menu/menu.stories.tsx index 99e9cd87..d46244d5 100644 --- a/src/core/navigation/menu/menu.stories.tsx +++ b/src/core/navigation/menu/menu.stories.tsx @@ -2,8 +2,8 @@ import React, { useState } from 'react' import type { Meta, StoryFn } from '@storybook/react' import ListItem from '@/core/data-display/list-item' import Button from '@/core/inputs/button' -import { Backup } from '@/icons' import Menu from '.' +import { Backup } from '@/icons' export default { title: 'Navigation/Menu', diff --git a/src/core/navigation/pagination/index.tsx b/src/core/navigation/pagination/index.tsx index 4af40436..36744b8a 100644 --- a/src/core/navigation/pagination/index.tsx +++ b/src/core/navigation/pagination/index.tsx @@ -2,11 +2,11 @@ import React from 'react' import { inc, times } from 'ramda' import type { DefaultProps } from '../../types' import Button from '@/core/inputs/button' +import { Content } from './styles' import { KeyboardArrowLeft as IconArrowLeft, KeyboardArrowRight as IconArrowRight } from '@/icons' -import { Content } from './styles' export interface PaginationProps extends DefaultProps { pages?: number diff --git a/src/core/navigation/sidebar/index.tsx b/src/core/navigation/sidebar/index.tsx index 7f0dccdd..1d465011 100644 --- a/src/core/navigation/sidebar/index.tsx +++ b/src/core/navigation/sidebar/index.tsx @@ -5,11 +5,11 @@ import type { DefaultProps } from '../../types' import type { ButtonProps } from '@/core/inputs/button' import type { Theme } from '@material-ui/core/styles' import Button from '@/core/inputs/button' +import { Action } from './styles' import { KeyboardArrowLeft as IconArrowLeft, KeyboardArrowRight as IconArrowRight } from '@/icons' -import { Action } from './styles' export interface SidebarProps extends DefaultProps { open: boolean diff --git a/src/core/navigation/sidebar/sidebar.spec.tsx b/src/core/navigation/sidebar/sidebar.spec.tsx index ef317b8e..95f8852d 100644 --- a/src/core/navigation/sidebar/sidebar.spec.tsx +++ b/src/core/navigation/sidebar/sidebar.spec.tsx @@ -2,8 +2,8 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' import List from '@/core/data-display/list' import ListItem from '@/core/data-display/list-item' -import { Backup } from '@/icons' import Sidebar from '.' +import { Backup } from '@/icons' describe('Sidebar', () => { it('should render', () => { diff --git a/src/core/navigation/sidebar/sidebar.stories.tsx b/src/core/navigation/sidebar/sidebar.stories.tsx index 491f457e..389a5d90 100644 --- a/src/core/navigation/sidebar/sidebar.stories.tsx +++ b/src/core/navigation/sidebar/sidebar.stories.tsx @@ -2,8 +2,8 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' import List from '@/core/data-display/list' import ListItem from '@/core/data-display/list-item' -import { Backup } from '@/icons' import Sidebar from '.' +import { Backup } from '@/icons' export default { title: 'Navigation/Sidebar', diff --git a/src/core/navigation/stepper/stepper.spec.tsx b/src/core/navigation/stepper/stepper.spec.tsx index 76fa0b62..f21811e1 100644 --- a/src/core/navigation/stepper/stepper.spec.tsx +++ b/src/core/navigation/stepper/stepper.spec.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import { Delete } from '@/icons' import Stepper from '.' +import { Delete } from '@/icons' describe('Stepper', () => { it('should render', () => { diff --git a/src/core/navigation/stepper/stepper.stories.tsx b/src/core/navigation/stepper/stepper.stories.tsx index 963f7e05..b627e05a 100644 --- a/src/core/navigation/stepper/stepper.stories.tsx +++ b/src/core/navigation/stepper/stepper.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Delete } from '@/icons' import Stepper from '.' +import { Delete } from '@/icons' export default { title: 'Navigation/Stepper', diff --git a/src/core/surfaces/expansion-panel/expansion-panel.stories.tsx b/src/core/surfaces/expansion-panel/expansion-panel.stories.tsx index a687607a..c1833d4f 100644 --- a/src/core/surfaces/expansion-panel/expansion-panel.stories.tsx +++ b/src/core/surfaces/expansion-panel/expansion-panel.stories.tsx @@ -4,8 +4,8 @@ import type { Meta, StoryFn } from '@storybook/react' import Typography from '@/core/data-display/typography' import Button from '@/core/inputs/button' import TextField from '@/core/inputs/text-field' -import { ExpandMore } from '@/icons' import ExpansionPanel from '.' +import { ExpandMore } from '@/icons' export default { title: 'Surfaces/ExpansionPanel', diff --git a/src/core/surfaces/step-card/step-card-panel.tsx b/src/core/surfaces/step-card/step-card-panel.tsx index 5f1b2cb8..f06e4c48 100644 --- a/src/core/surfaces/step-card/step-card-panel.tsx +++ b/src/core/surfaces/step-card/step-card-panel.tsx @@ -4,7 +4,6 @@ import MuiAccordionSummary from '@material-ui/core/AccordionSummary' import { sprintf } from 'sprintf-js' import type { IStepCardProps } from '.' import Typography from '@/core/data-display/typography' -import { ExpandMore as ExpandMoreIcon } from '@/icons' import { BarWrapper, BottomProgressBar, @@ -21,6 +20,7 @@ import { TypographySubtitle, TypographyTitle } from './styles' +import { ExpandMore as ExpandMoreIcon } from '@/icons' interface IStepCardPanelProps { title: string diff --git a/src/experimental/breadcrumbs/index.tsx b/src/experimental/breadcrumbs/index.tsx index 56d125e4..cd456e1e 100644 --- a/src/experimental/breadcrumbs/index.tsx +++ b/src/experimental/breadcrumbs/index.tsx @@ -1,9 +1,9 @@ import React from 'react' import type { ReactNode } from 'react' import { addIndex, map } from 'ramda' -import { ChevronRight as IconChevronRight } from '@/icons' import { Breadcrumb } from '@/index' import { LinkStyled, TextTypography } from './styles' +import { ChevronRight as IconChevronRight } from '@/icons' const imap = addIndex(map) diff --git a/src/experimental/button/index.tsx b/src/experimental/button/index.tsx index 90c34e91..82e8b967 100644 --- a/src/experimental/button/index.tsx +++ b/src/experimental/button/index.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { ButtonProps } from '@/core/inputs/button' -import { NoteAdd as IconAdd } from '@/icons' import { ButtonAdd } from './styles' +import { NoteAdd as IconAdd } from '@/icons' export interface Props extends ButtonProps { label?: string diff --git a/src/experimental/card/index.tsx b/src/experimental/card/index.tsx index 7c41e974..5aaf1204 100644 --- a/src/experimental/card/index.tsx +++ b/src/experimental/card/index.tsx @@ -2,7 +2,6 @@ import React from 'react' import type { ReactNode } from 'react' import type { ButtonProps } from '@/core/inputs/button' import type { IconButtonProps } from '@/core/inputs/icon-button' -import { Close as IconClose, Edit as IconEdit } from '@/icons' import { Paper, Line, Button as AddButton } from '@/index' import { EditButton, @@ -11,6 +10,7 @@ import { PAPER_PROPS, Title } from './styles' +import { Close as IconClose, Edit as IconEdit } from '@/icons' export interface IProps { /** diff --git a/src/experimental/fab/fab.spec.tsx b/src/experimental/fab/fab.spec.tsx index 85701b55..607f5ec6 100644 --- a/src/experimental/fab/fab.spec.tsx +++ b/src/experimental/fab/fab.spec.tsx @@ -1,9 +1,9 @@ import * as React from 'react' import { render, screen, waitFor } from '@testing-library/react' import { userEvent } from '@testing-library/user-event' -import { FileCopy } from '@/icons' import Fab from './fab' import FabWrapper from './fab-wrapper' +import { FileCopy } from '@/icons' describe('Fab', () => { it('should render correctly', () => { diff --git a/src/experimental/fab/fab.stories.tsx b/src/experimental/fab/fab.stories.tsx index e50bea57..731c029b 100644 --- a/src/experimental/fab/fab.stories.tsx +++ b/src/experimental/fab/fab.stories.tsx @@ -1,8 +1,8 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { FileCopy } from '@/icons' import FabV2 from './fab' import FabWrapper from './fab-wrapper' +import { FileCopy } from '@/icons' const Template: StoryFn<typeof FabV2> = args => <FabV2 {...args} /> diff --git a/src/experimental/panel/index.tsx b/src/experimental/panel/index.tsx index c334b77b..6c9317e6 100644 --- a/src/experimental/panel/index.tsx +++ b/src/experimental/panel/index.tsx @@ -2,8 +2,8 @@ import React from 'react' import type { CSSProperties, ChangeEvent, MouseEvent, ReactNode } from 'react' import { defaultTo } from 'ramda' import type { PaperProps as FlipperPaperProps } from '@/core/surfaces/paper' -import { ExpandMore as IconExpand } from '@/icons' import { Paper, Summary, Title } from './styles' +import { ExpandMore as IconExpand } from '@/icons' export interface PaperProps extends Omit<FlipperPaperProps, 'title' | 'onChange'> { diff --git a/src/experimental/sidebar/sidebar.stories.tsx b/src/experimental/sidebar/sidebar.stories.tsx index db6693a3..6d435f3e 100644 --- a/src/experimental/sidebar/sidebar.stories.tsx +++ b/src/experimental/sidebar/sidebar.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import { Home, Computer, Edit } from '@/icons' import Sidebar from '.' +import { Home, Computer, Edit } from '@/icons' export default { title: 'Experimental/Sidebar', diff --git a/src/experimental/visibility-icon/index.tsx b/src/experimental/visibility-icon/index.tsx index f68b2c04..307635ed 100644 --- a/src/experimental/visibility-icon/index.tsx +++ b/src/experimental/visibility-icon/index.tsx @@ -1,9 +1,9 @@ import React from 'react' +import { StyledButton } from './styles' import { Visibility as IconVisibility, VisibilityOff as IconVisibilityOff } from '@/icons' -import { StyledButton } from './styles' export interface IProps { name?: string diff --git a/src/index.ts b/src/index.ts index df950371..9ba9a02f 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,4 +1,3 @@ -/* eslint-disable @stylistic/max-len */ export { default as Advertise } from './core/data-display/advertise' export { default as AutoComplete } from './core/inputs/auto-complete' export { default as Avatar } from './core/data-display/avatar' diff --git a/src/test/mocks/snackbar-mock.tsx b/src/test/mocks/snackbar-mock.tsx index d6e5893e..16d63944 100644 --- a/src/test/mocks/snackbar-mock.tsx +++ b/src/test/mocks/snackbar-mock.tsx @@ -1,8 +1,8 @@ import React, { useState } from 'react' import { IconButton as MuiIconButton } from '@material-ui/core' import type { SnackBarProps } from '@/core/feedback/snackbar' -import { Close as IconClose } from '@/icons' import { Button, Snackbar } from '@/index' +import { Close as IconClose } from '@/icons' interface IProps { withAction?: boolean From 2576c31d9785066b83ca6972fb3a9a82c120acfa Mon Sep 17 00:00:00 2001 From: Karine Brandelli <karinebrandelli@live.com> Date: Wed, 6 Mar 2024 14:31:55 -0300 Subject: [PATCH 06/10] chore: update dependecies --- package.json | 48 +- yarn.lock | 1593 +++++++++++++++++++++++++++++++++++--------------- 2 files changed, 1157 insertions(+), 484 deletions(-) diff --git a/package.json b/package.json index db9c2a21..1f755557 100644 --- a/package.json +++ b/package.json @@ -36,75 +36,75 @@ }, "dependencies": { "@date-io/date-fns": "1.3.6", - "@emotion/react": "11.11.3", + "@emotion/react": "11.11.4", "@emotion/styled": "11.11.0", "@material-ui/core": "4.12.4", "@material-ui/icons": "4.11.3", "@material-ui/lab": "4.0.0-alpha.61", "@material-ui/pickers": "3.3.11", - "@mui/icons-material": "5.15.6", - "@mui/material": "5.15.6", - "@mui/styles": "5.15.6", + "@mui/icons-material": "5.15.12", + "@mui/material": "5.15.12", + "@mui/styles": "5.15.12", "date-fns": "2.30.0", "faker": "5.5.3", "material-table": "1.69.3", "material-ui-chip-input": "2.0.0-beta.2", "ramda": "0.25.0", - "react-loading-skeleton": "3.3.1", + "react-loading-skeleton": "3.4.0", "react-number-format": "4.4.1", "sprintf-js": "1.1.3", "stylis": "4.3.1", "uuid": "9.0.1" }, "devDependencies": { - "@babel/cli": "7.23.4", - "@babel/core": "7.23.7", - "@babel/plugin-transform-runtime": "7.23.7", - "@babel/preset-env": "7.23.8", + "@babel/cli": "7.23.9", + "@babel/core": "7.24.0", + "@babel/plugin-transform-runtime": "7.24.0", + "@babel/preset-env": "7.24.0", "@babel/preset-typescript": "7.23.3", - "@storybook/addon-essentials": "7.6.10", + "@storybook/addon-essentials": "7.6.17", "@storybook/addon-styling-webpack": "0.0.6", - "@storybook/react": "7.6.10", - "@storybook/react-webpack5": "7.6.10", + "@storybook/react": "7.6.17", + "@storybook/react-webpack5": "7.6.17", "@stylistic/eslint-plugin": "1.5.4", - "@testing-library/react": "14.1.2", + "@testing-library/react": "14.2.1", "@testing-library/user-event": "14.5.2", "@types/faker": "5.5.3", "@types/history": "5.0.0", - "@types/jest": "29.5.11", - "@types/node": "20.11.6", + "@types/jest": "29.5.12", + "@types/node": "20.11.25", "@types/ramda": "0.25.36", - "@types/react": "18.2.48", + "@types/react": "18.2.63", "@types/sprintf-js": "1.1.4", "@types/styled-components": "5.1.34", - "@types/uuid": "9.0.7", - "@typescript-eslint/eslint-plugin": "6.19.1", - "@typescript-eslint/parser": "6.19.1", + "@types/uuid": "9.0.8", + "@typescript-eslint/eslint-plugin": "7.1.1", + "@typescript-eslint/parser": "7.1.1", "babel-loader": "9.1.3", "babel-plugin-module-resolver": "5.0.0", "babel-plugin-transform-class-properties": "6.24.1", "babel-plugin-transform-imports": "2.0.0", - "eslint": "8.56.0", + "eslint": "8.57.0", "eslint-config-prettier": "9.1.0", "eslint-import-resolver-typescript": "3.6.1", "eslint-plugin-import": "2.29.1", "eslint-plugin-prettier": "5.1.3", - "eslint-plugin-react": "7.33.2", + "eslint-plugin-react": "7.34.0", "eslint-plugin-react-hooks": "4.6.0", "fs-extra": "11.2.0", "identity-obj-proxy": "3.0.0", "jest": "29.7.0", "jest-environment-jsdom": "29.7.0", "node-fetch": "3.3.2", - "prettier": "3.2.4", + "prettier": "3.2.5", "react": "18.2.0", "react-dom": "18.2.0", - "storybook": "7.6.10", + "storybook": "7.6.17", "styled-components": "6.1.8", "ts-jest": "29.1.2", "ts-loader": "9.5.1", "typescript": "5.3.3", - "webpack": "5.90.0" + "webpack": "5.90.3" }, "peerDependencies": { "date-fns": "^2.30.0", diff --git a/yarn.lock b/yarn.lock index ec521097..fa011412 100644 --- a/yarn.lock +++ b/yarn.lock @@ -22,10 +22,10 @@ dependencies: default-browser-id "3.0.0" -"@babel/cli@7.23.4": - version "7.23.4" - resolved "https://registry.yarnpkg.com/@babel/cli/-/cli-7.23.4.tgz#f5cc90487278065fa0c3b1267cf0c1d44ddf85a7" - integrity sha512-j3luA9xGKCXVyCa5R7lJvOMM+Kc2JEnAEIgz2ggtjQ/j5YUVgfsg/WsG95bbsgq7YLHuiCOzMnoSasuY16qiCw== +"@babel/cli@7.23.9": + version "7.23.9" + resolved "https://registry.yarnpkg.com/@babel/cli/-/cli-7.23.9.tgz#06b3e76376ee53f14ac8ac422c884950c69e1b9e" + integrity sha512-vB1UXmGDNEhcf1jNAHKT9IlYk1R+hehVTLFlCLHBi8gfuHQGP6uRjgXVYU0EVlI/qwAWpstqkBdf2aez3/z/5Q== dependencies: "@jridgewell/trace-mapping" "^0.3.17" commander "^4.0.1" @@ -51,7 +51,28 @@ resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.23.5.tgz#ffb878728bb6bdcb6f4510aa51b1be9afb8cfd98" integrity sha512-uU27kfDRlhfKl+w1U6vp16IuvSLtjAxdArVXPa9BvLkrr7CYIsxH5adpHObeAGY/41+syctUWOZ140a2Rvkgjw== -"@babel/core@7.23.7", "@babel/core@^7.11.6", "@babel/core@^7.12.3", "@babel/core@^7.18.9", "@babel/core@^7.23.0", "@babel/core@^7.23.2": +"@babel/core@7.24.0": + version "7.24.0" + resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.24.0.tgz#56cbda6b185ae9d9bed369816a8f4423c5f2ff1b" + integrity sha512-fQfkg0Gjkza3nf0c7/w6Xf34BW4YvzNfACRLmmb7XRLa6XHdR+K9AlJlxneFfWYf6uhOzuzZVTjF/8KfndZANw== + dependencies: + "@ampproject/remapping" "^2.2.0" + "@babel/code-frame" "^7.23.5" + "@babel/generator" "^7.23.6" + "@babel/helper-compilation-targets" "^7.23.6" + "@babel/helper-module-transforms" "^7.23.3" + "@babel/helpers" "^7.24.0" + "@babel/parser" "^7.24.0" + "@babel/template" "^7.24.0" + "@babel/traverse" "^7.24.0" + "@babel/types" "^7.24.0" + convert-source-map "^2.0.0" + debug "^4.1.0" + gensync "^1.0.0-beta.2" + json5 "^2.2.3" + semver "^6.3.1" + +"@babel/core@^7.11.6", "@babel/core@^7.12.3", "@babel/core@^7.18.9", "@babel/core@^7.23.0", "@babel/core@^7.23.2": version "7.23.7" resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.23.7.tgz#4d8016e06a14b5f92530a13ed0561730b5c6483f" integrity sha512-+UpDgowcmqe36d4NwqvKsyPMlOLNGMsfMmQ5WGCu+siCe3t3dfe9njrzGfdN4qq+bcNUt0+Vw6haRxBOycs4dw== @@ -210,6 +231,11 @@ resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.22.5.tgz#dd7ee3735e8a313b9f7b05a773d892e88e6d7295" integrity sha512-uLls06UVKgFG9QD4OeFYLEGteMIAa5kpTPcFL28yuCIIzsf6ZyKZMllKVOCZFhiZ5ptnwX4mtKdWCBE/uT4amg== +"@babel/helper-plugin-utils@^7.24.0": + version "7.24.0" + resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.24.0.tgz#945681931a52f15ce879fd5b86ce2dae6d3d7f2a" + integrity sha512-9cUznXMG0+FxRuJfvL82QlTqIzhVW9sL0KjMPHhAOOvpQGL8QtdxnBKILjBqxlHyliz0yCa1G903ZXI/FuHy2w== + "@babel/helper-remap-async-to-generator@^7.22.20": version "7.22.20" resolved "https://registry.yarnpkg.com/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.22.20.tgz#7b68e1cb4fa964d2996fd063723fb48eca8498e0" @@ -282,6 +308,15 @@ "@babel/traverse" "^7.23.7" "@babel/types" "^7.23.6" +"@babel/helpers@^7.24.0": + version "7.24.0" + resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.24.0.tgz#a3dd462b41769c95db8091e49cfe019389a9409b" + integrity sha512-ulDZdc0Aj5uLc5nETsa7EPx2L7rM0YJM8r7ck7U73AXi7qOV44IHHRAYZHY6iU1rr3C5N4NtTmMRUJP6kwCWeA== + dependencies: + "@babel/template" "^7.24.0" + "@babel/traverse" "^7.24.0" + "@babel/types" "^7.24.0" + "@babel/highlight@^7.23.4": version "7.23.4" resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.23.4.tgz#edaadf4d8232e1a961432db785091207ead0621b" @@ -296,6 +331,11 @@ resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.23.6.tgz#ba1c9e512bda72a47e285ae42aff9d2a635a9e3b" integrity sha512-Z2uID7YJ7oNvAI20O9X0bblw7Qqs8Q2hFy0R9tAfnfLkp5MW0UH9eUvnDSnFwKZ0AvgS1ucqR4KzvVHgnke1VQ== +"@babel/parser@^7.24.0": + version "7.24.0" + resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.24.0.tgz#26a3d1ff49031c53a97d03b604375f028746a9ac" + integrity sha512-QuP/FxEAzMSjXygs8v4N9dvdXzEHN4W1oF3PxuWAtPo08UdM17u89RDMgjLn/mlc56iM0HlLmVkO/wgR+rDgHg== + "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@^7.23.3": version "7.23.3" resolved "https://registry.yarnpkg.com/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression/-/plugin-bugfix-safari-id-destructuring-collision-in-function-expression-7.23.3.tgz#5cd1c87ba9380d0afb78469292c954fee5d2411a" @@ -497,6 +537,16 @@ "@babel/helper-remap-async-to-generator" "^7.22.20" "@babel/plugin-syntax-async-generators" "^7.8.4" +"@babel/plugin-transform-async-generator-functions@^7.23.9": + version "7.23.9" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-async-generator-functions/-/plugin-transform-async-generator-functions-7.23.9.tgz#9adaeb66fc9634a586c5df139c6240d41ed801ce" + integrity sha512-8Q3veQEDGe14dTYuwagbRtwxQDnytyg1JFu4/HwEMETeofocrB0U0ejBJIXoeG/t2oXZ8kzCyI0ZZfbT80VFNQ== + dependencies: + "@babel/helper-environment-visitor" "^7.22.20" + "@babel/helper-plugin-utils" "^7.22.5" + "@babel/helper-remap-async-to-generator" "^7.22.20" + "@babel/plugin-syntax-async-generators" "^7.8.4" + "@babel/plugin-transform-async-to-generator@^7.23.3": version "7.23.3" resolved "https://registry.yarnpkg.com/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.23.3.tgz#d1f513c7a8a506d43f47df2bf25f9254b0b051fa" @@ -687,6 +737,16 @@ "@babel/helper-plugin-utils" "^7.22.5" "@babel/helper-validator-identifier" "^7.22.20" +"@babel/plugin-transform-modules-systemjs@^7.23.9": + version "7.23.9" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.23.9.tgz#105d3ed46e4a21d257f83a2f9e2ee4203ceda6be" + integrity sha512-KDlPRM6sLo4o1FkiSlXoAa8edLXFsKKIda779fbLrvmeuc3itnjCtaO6RrtoaANsIJANj+Vk1zqbZIMhkCAHVw== + dependencies: + "@babel/helper-hoist-variables" "^7.22.5" + "@babel/helper-module-transforms" "^7.23.3" + "@babel/helper-plugin-utils" "^7.22.5" + "@babel/helper-validator-identifier" "^7.22.20" + "@babel/plugin-transform-modules-umd@^7.23.3": version "7.23.3" resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.23.3.tgz#5d4395fccd071dfefe6585a4411aa7d6b7d769e9" @@ -737,6 +797,17 @@ "@babel/plugin-syntax-object-rest-spread" "^7.8.3" "@babel/plugin-transform-parameters" "^7.23.3" +"@babel/plugin-transform-object-rest-spread@^7.24.0": + version "7.24.0" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-object-rest-spread/-/plugin-transform-object-rest-spread-7.24.0.tgz#7b836ad0088fdded2420ce96d4e1d3ed78b71df1" + integrity sha512-y/yKMm7buHpFFXfxVFS4Vk1ToRJDilIa6fKRioB9Vjichv58TDGXTvqV0dN7plobAmTW5eSEGXDngE+Mm+uO+w== + dependencies: + "@babel/compat-data" "^7.23.5" + "@babel/helper-compilation-targets" "^7.23.6" + "@babel/helper-plugin-utils" "^7.24.0" + "@babel/plugin-syntax-object-rest-spread" "^7.8.3" + "@babel/plugin-transform-parameters" "^7.23.3" + "@babel/plugin-transform-object-super@^7.23.3": version "7.23.3" resolved "https://registry.yarnpkg.com/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.23.3.tgz#81fdb636dcb306dd2e4e8fd80db5b2362ed2ebcd" @@ -842,16 +913,16 @@ dependencies: "@babel/helper-plugin-utils" "^7.22.5" -"@babel/plugin-transform-runtime@7.23.7": - version "7.23.7" - resolved "https://registry.yarnpkg.com/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.23.7.tgz#52bbd20054855beb9deae3bee9ceb05289c343e6" - integrity sha512-fa0hnfmiXc9fq/weK34MUV0drz2pOL/vfKWvN7Qw127hiUPabFCUMgAbYWcchRzMJit4o5ARsK/s+5h0249pLw== +"@babel/plugin-transform-runtime@7.24.0": + version "7.24.0" + resolved "https://registry.yarnpkg.com/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.24.0.tgz#e308fe27d08b74027d42547081eefaf4f2ffbcc9" + integrity sha512-zc0GA5IitLKJrSfXlXmp8KDqLrnGECK7YRfQBmEKg1NmBOQ7e+KuclBEKJgzifQeUYLdNiAw4B4bjyvzWVLiSA== dependencies: "@babel/helper-module-imports" "^7.22.15" - "@babel/helper-plugin-utils" "^7.22.5" - babel-plugin-polyfill-corejs2 "^0.4.7" - babel-plugin-polyfill-corejs3 "^0.8.7" - babel-plugin-polyfill-regenerator "^0.5.4" + "@babel/helper-plugin-utils" "^7.24.0" + babel-plugin-polyfill-corejs2 "^0.4.8" + babel-plugin-polyfill-corejs3 "^0.9.0" + babel-plugin-polyfill-regenerator "^0.5.5" semver "^6.3.1" "@babel/plugin-transform-shorthand-properties@^7.23.3": @@ -931,7 +1002,93 @@ "@babel/helper-create-regexp-features-plugin" "^7.22.15" "@babel/helper-plugin-utils" "^7.22.5" -"@babel/preset-env@7.23.8", "@babel/preset-env@^7.23.2": +"@babel/preset-env@7.24.0": + version "7.24.0" + resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.24.0.tgz#11536a7f4b977294f0bdfad780f01a8ac8e183fc" + integrity sha512-ZxPEzV9IgvGn73iK0E6VB9/95Nd7aMFpbE0l8KQFDG70cOV9IxRP7Y2FUPmlK0v6ImlLqYX50iuZ3ZTVhOF2lA== + dependencies: + "@babel/compat-data" "^7.23.5" + "@babel/helper-compilation-targets" "^7.23.6" + "@babel/helper-plugin-utils" "^7.24.0" + "@babel/helper-validator-option" "^7.23.5" + "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression" "^7.23.3" + "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining" "^7.23.3" + "@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly" "^7.23.7" + "@babel/plugin-proposal-private-property-in-object" "7.21.0-placeholder-for-preset-env.2" + "@babel/plugin-syntax-async-generators" "^7.8.4" + "@babel/plugin-syntax-class-properties" "^7.12.13" + "@babel/plugin-syntax-class-static-block" "^7.14.5" + "@babel/plugin-syntax-dynamic-import" "^7.8.3" + "@babel/plugin-syntax-export-namespace-from" "^7.8.3" + "@babel/plugin-syntax-import-assertions" "^7.23.3" + "@babel/plugin-syntax-import-attributes" "^7.23.3" + "@babel/plugin-syntax-import-meta" "^7.10.4" + "@babel/plugin-syntax-json-strings" "^7.8.3" + "@babel/plugin-syntax-logical-assignment-operators" "^7.10.4" + "@babel/plugin-syntax-nullish-coalescing-operator" "^7.8.3" + "@babel/plugin-syntax-numeric-separator" "^7.10.4" + "@babel/plugin-syntax-object-rest-spread" "^7.8.3" + "@babel/plugin-syntax-optional-catch-binding" "^7.8.3" + "@babel/plugin-syntax-optional-chaining" "^7.8.3" + "@babel/plugin-syntax-private-property-in-object" "^7.14.5" + "@babel/plugin-syntax-top-level-await" "^7.14.5" + "@babel/plugin-syntax-unicode-sets-regex" "^7.18.6" + "@babel/plugin-transform-arrow-functions" "^7.23.3" + "@babel/plugin-transform-async-generator-functions" "^7.23.9" + "@babel/plugin-transform-async-to-generator" "^7.23.3" + "@babel/plugin-transform-block-scoped-functions" "^7.23.3" + "@babel/plugin-transform-block-scoping" "^7.23.4" + "@babel/plugin-transform-class-properties" "^7.23.3" + "@babel/plugin-transform-class-static-block" "^7.23.4" + "@babel/plugin-transform-classes" "^7.23.8" + "@babel/plugin-transform-computed-properties" "^7.23.3" + "@babel/plugin-transform-destructuring" "^7.23.3" + "@babel/plugin-transform-dotall-regex" "^7.23.3" + "@babel/plugin-transform-duplicate-keys" "^7.23.3" + "@babel/plugin-transform-dynamic-import" "^7.23.4" + "@babel/plugin-transform-exponentiation-operator" "^7.23.3" + "@babel/plugin-transform-export-namespace-from" "^7.23.4" + "@babel/plugin-transform-for-of" "^7.23.6" + "@babel/plugin-transform-function-name" "^7.23.3" + "@babel/plugin-transform-json-strings" "^7.23.4" + "@babel/plugin-transform-literals" "^7.23.3" + "@babel/plugin-transform-logical-assignment-operators" "^7.23.4" + "@babel/plugin-transform-member-expression-literals" "^7.23.3" + "@babel/plugin-transform-modules-amd" "^7.23.3" + "@babel/plugin-transform-modules-commonjs" "^7.23.3" + "@babel/plugin-transform-modules-systemjs" "^7.23.9" + "@babel/plugin-transform-modules-umd" "^7.23.3" + "@babel/plugin-transform-named-capturing-groups-regex" "^7.22.5" + "@babel/plugin-transform-new-target" "^7.23.3" + "@babel/plugin-transform-nullish-coalescing-operator" "^7.23.4" + "@babel/plugin-transform-numeric-separator" "^7.23.4" + "@babel/plugin-transform-object-rest-spread" "^7.24.0" + "@babel/plugin-transform-object-super" "^7.23.3" + "@babel/plugin-transform-optional-catch-binding" "^7.23.4" + "@babel/plugin-transform-optional-chaining" "^7.23.4" + "@babel/plugin-transform-parameters" "^7.23.3" + "@babel/plugin-transform-private-methods" "^7.23.3" + "@babel/plugin-transform-private-property-in-object" "^7.23.4" + "@babel/plugin-transform-property-literals" "^7.23.3" + "@babel/plugin-transform-regenerator" "^7.23.3" + "@babel/plugin-transform-reserved-words" "^7.23.3" + "@babel/plugin-transform-shorthand-properties" "^7.23.3" + "@babel/plugin-transform-spread" "^7.23.3" + "@babel/plugin-transform-sticky-regex" "^7.23.3" + "@babel/plugin-transform-template-literals" "^7.23.3" + "@babel/plugin-transform-typeof-symbol" "^7.23.3" + "@babel/plugin-transform-unicode-escapes" "^7.23.3" + "@babel/plugin-transform-unicode-property-regex" "^7.23.3" + "@babel/plugin-transform-unicode-regex" "^7.23.3" + "@babel/plugin-transform-unicode-sets-regex" "^7.23.3" + "@babel/preset-modules" "0.1.6-no-external-plugins" + babel-plugin-polyfill-corejs2 "^0.4.8" + babel-plugin-polyfill-corejs3 "^0.9.0" + babel-plugin-polyfill-regenerator "^0.5.5" + core-js-compat "^3.31.0" + semver "^6.3.1" + +"@babel/preset-env@^7.23.2": version "7.23.8" resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.23.8.tgz#7d6f8171ea7c221ecd28059e65ad37c20e441e3e" integrity sha512-lFlpmkApLkEP6woIKprO6DO60RImpatTQKtz4sUcDjVcK8M8mQ4sZsuxaTMNOZf0sqAq/ReYW1ZBHnOQwKpLWA== @@ -1074,13 +1231,20 @@ resolved "https://registry.yarnpkg.com/@babel/regjsgen/-/regjsgen-0.8.0.tgz#f0ba69b075e1f05fb2825b7fad991e7adbb18310" integrity sha512-x/rqGMdzj+fWZvCOYForTghzbtqPDZ5gPwaoNGHdgDfF2QA/XZbCBp4Moo5scrkAMPhB7z26XM/AaHuIJdgauA== -"@babel/runtime@^7.12.5", "@babel/runtime@^7.13.10", "@babel/runtime@^7.15.4", "@babel/runtime@^7.17.8", "@babel/runtime@^7.18.3", "@babel/runtime@^7.2.0", "@babel/runtime@^7.21.0", "@babel/runtime@^7.23.8", "@babel/runtime@^7.3.1", "@babel/runtime@^7.4.4", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.0", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.3", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2": +"@babel/runtime@^7.12.5", "@babel/runtime@^7.13.10", "@babel/runtime@^7.15.4", "@babel/runtime@^7.17.8", "@babel/runtime@^7.18.3", "@babel/runtime@^7.2.0", "@babel/runtime@^7.21.0", "@babel/runtime@^7.3.1", "@babel/runtime@^7.4.4", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.0", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.3", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2": version "7.23.8" resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.23.8.tgz#8ee6fe1ac47add7122902f257b8ddf55c898f650" integrity sha512-Y7KbAP984rn1VGMbGqKmBLio9V7y5Je9GvU4rQPCPinCyNfUcToxIXl06d59URp/F3LwinvODxab5N/G6qggkw== dependencies: regenerator-runtime "^0.14.0" +"@babel/runtime@^7.23.9": + version "7.24.0" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.24.0.tgz#584c450063ffda59697021430cb47101b085951e" + integrity sha512-Chk32uHMg6TnQdvw2e9IlqPpFX/6NLuK0Ys2PqLb7/gL5uFn9mXvK715FGLlOLQrcO4qIkNHkvPGktzzXexsFw== + dependencies: + regenerator-runtime "^0.14.0" + "@babel/template@^7.22.15", "@babel/template@^7.3.3": version "7.22.15" resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.22.15.tgz#09576efc3830f0430f4548ef971dde1350ef2f38" @@ -1090,6 +1254,15 @@ "@babel/parser" "^7.22.15" "@babel/types" "^7.22.15" +"@babel/template@^7.24.0": + version "7.24.0" + resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.24.0.tgz#c6a524aa93a4a05d66aaf31654258fae69d87d50" + integrity sha512-Bkf2q8lMB0AFpX0NFEqSbx1OkTHf0f+0j82mkw+ZpzBnkk7e9Ql0891vlfgi+kHwOk8tQjiQHpqh4LaSa0fKEA== + dependencies: + "@babel/code-frame" "^7.23.5" + "@babel/parser" "^7.24.0" + "@babel/types" "^7.24.0" + "@babel/traverse@^7.18.9", "@babel/traverse@^7.23.2", "@babel/traverse@^7.23.7": version "7.23.7" resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.23.7.tgz#9a7bf285c928cb99b5ead19c3b1ce5b310c9c305" @@ -1106,6 +1279,22 @@ debug "^4.3.1" globals "^11.1.0" +"@babel/traverse@^7.24.0": + version "7.24.0" + resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.24.0.tgz#4a408fbf364ff73135c714a2ab46a5eab2831b1e" + integrity sha512-HfuJlI8qq3dEDmNU5ChzzpZRWq+oxCZQyMzIMEqLho+AQnhMnKQUzH6ydo3RBl/YjPCuk68Y6s0Gx0AeyULiWw== + dependencies: + "@babel/code-frame" "^7.23.5" + "@babel/generator" "^7.23.6" + "@babel/helper-environment-visitor" "^7.22.20" + "@babel/helper-function-name" "^7.23.0" + "@babel/helper-hoist-variables" "^7.22.5" + "@babel/helper-split-export-declaration" "^7.22.6" + "@babel/parser" "^7.24.0" + "@babel/types" "^7.24.0" + debug "^4.3.1" + globals "^11.1.0" + "@babel/types@^7.0.0", "@babel/types@^7.18.9", "@babel/types@^7.20.7", "@babel/types@^7.22.15", "@babel/types@^7.22.19", "@babel/types@^7.22.5", "@babel/types@^7.23.0", "@babel/types@^7.23.4", "@babel/types@^7.23.6", "@babel/types@^7.3.3", "@babel/types@^7.4", "@babel/types@^7.4.4": version "7.23.6" resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.23.6.tgz#be33fdb151e1f5a56877d704492c240fc71c7ccd" @@ -1115,6 +1304,15 @@ "@babel/helper-validator-identifier" "^7.22.20" to-fast-properties "^2.0.0" +"@babel/types@^7.24.0": + version "7.24.0" + resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.24.0.tgz#3b951f435a92e7333eba05b7566fd297960ea1bf" + integrity sha512-+j7a5c253RfKh8iABBhywc8NSfP5LURe7Uh4qpsh6jc+aLJguvmIUBdjSdEMQv2bENrCR5MfRdjGo7vzS/ob7w== + dependencies: + "@babel/helper-string-parser" "^7.23.4" + "@babel/helper-validator-identifier" "^7.22.20" + to-fast-properties "^2.0.0" + "@base2/pretty-print-object@1.0.1": version "1.0.1" resolved "https://registry.yarnpkg.com/@base2/pretty-print-object/-/pretty-print-object-1.0.1.tgz#371ba8be66d556812dc7fb169ebc3c08378f69d4" @@ -1204,10 +1402,10 @@ resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.8.1.tgz#c1ddb040429c6d21d38cc945fe75c818cfb68e17" integrity sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA== -"@emotion/react@11.11.3": - version "11.11.3" - resolved "https://registry.yarnpkg.com/@emotion/react/-/react-11.11.3.tgz#96b855dc40a2a55f52a72f518a41db4f69c31a25" - integrity sha512-Cnn0kuq4DoONOMcnoVsTOR8E+AdnKFf//6kUWc4LCdnxj31pZWn7rIULd6Y7/Js1PiPHzn7SKCM9vB/jBni8eA== +"@emotion/react@11.11.4": + version "11.11.4" + resolved "https://registry.yarnpkg.com/@emotion/react/-/react-11.11.4.tgz#3a829cac25c1f00e126408fab7f891f00ecc3c1d" + integrity sha512-t8AjMlF0gHpvvxk5mAtCqR4vmxiGHCeJBaQO6gncUSdklELOgtwjerNY2yuJNfwnc6vi16U/+uMF+afIawJ9iw== dependencies: "@babel/runtime" "^7.18.3" "@emotion/babel-plugin" "^11.11.0" @@ -1408,16 +1606,23 @@ minimatch "^3.1.2" strip-json-comments "^3.1.1" -"@eslint/js@8.56.0": - version "8.56.0" - resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.56.0.tgz#ef20350fec605a7f7035a01764731b2de0f3782b" - integrity sha512-gMsVel9D7f2HLkBma9VbtzZRehRogVRfbr++f06nL2vnCGCNlzOD+/MUov/F4p8myyAHspEhVobgjpX64q5m6A== +"@eslint/js@8.57.0": + version "8.57.0" + resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.57.0.tgz#a5417ae8427873f1dd08b70b3574b453e67b5f7f" + integrity sha512-Ys+3g2TaW7gADOJzPt83SJtCDhMjndcDMFVQ/Tj9iA1BfJzFKD9mAUXT3OenpuPHbI6P/myECxRJrofUsDx/5g== "@fal-works/esbuild-plugin-global-externals@^2.1.2": version "2.1.2" resolved "https://registry.yarnpkg.com/@fal-works/esbuild-plugin-global-externals/-/esbuild-plugin-global-externals-2.1.2.tgz#c05ed35ad82df8e6ac616c68b92c2282bd083ba4" integrity sha512-cEee/Z+I12mZcFJshKcCqC8tuX5hG3s+d+9nZ3LabqKF1vKdF41B92pJVCBggjAGORAeOzyyDDKrZwIkLffeOQ== +"@floating-ui/core@^1.0.0": + version "1.6.0" + resolved "https://registry.yarnpkg.com/@floating-ui/core/-/core-1.6.0.tgz#fa41b87812a16bf123122bf945946bae3fdf7fc1" + integrity sha512-PcF++MykgmTj3CIyOQbKA/hDzOAiqI3mhuoN44WRCopIs1sgoDoU4oty4Jtqaj/y3oDU6fnVSm4QG0a3t5i0+g== + dependencies: + "@floating-ui/utils" "^0.2.1" + "@floating-ui/core@^1.5.3": version "1.5.3" resolved "https://registry.yarnpkg.com/@floating-ui/core/-/core-1.5.3.tgz#b6aa0827708d70971c8679a16cf680a515b8a52a" @@ -1433,19 +1638,34 @@ "@floating-ui/core" "^1.5.3" "@floating-ui/utils" "^0.2.0" -"@floating-ui/react-dom@^2.0.0", "@floating-ui/react-dom@^2.0.6": +"@floating-ui/dom@^1.6.1": + version "1.6.3" + resolved "https://registry.yarnpkg.com/@floating-ui/dom/-/dom-1.6.3.tgz#954e46c1dd3ad48e49db9ada7218b0985cee75ef" + integrity sha512-RnDthu3mzPlQ31Ss/BTwQ1zjzIhr3lk1gZB1OC56h/1vEtaXkESrOqL5fQVMfXpwGtRwX+YsZBdyHtJMQnkArw== + dependencies: + "@floating-ui/core" "^1.0.0" + "@floating-ui/utils" "^0.2.0" + +"@floating-ui/react-dom@^2.0.0": version "2.0.6" resolved "https://registry.yarnpkg.com/@floating-ui/react-dom/-/react-dom-2.0.6.tgz#5ffcf40b6550817a973b54cdd443374f51ca7a5c" integrity sha512-IB8aCRFxr8nFkdYZgH+Otd9EVQPJoynxeFRGTB8voPoZMRWo8XjYuCRgpI1btvuKY69XMiLnW+ym7zoBHM90Rw== dependencies: "@floating-ui/dom" "^1.5.4" -"@floating-ui/utils@^0.2.0": +"@floating-ui/react-dom@^2.0.8": + version "2.0.8" + resolved "https://registry.yarnpkg.com/@floating-ui/react-dom/-/react-dom-2.0.8.tgz#afc24f9756d1b433e1fe0d047c24bd4d9cefaa5d" + integrity sha512-HOdqOt3R3OGeTKidaLvJKcgg75S6tibQ3Tif4eyd91QnIJWr0NLvoXFpJA/j8HqkFSL68GDca9AuyWEHlhyClw== + dependencies: + "@floating-ui/dom" "^1.6.1" + +"@floating-ui/utils@^0.2.0", "@floating-ui/utils@^0.2.1": version "0.2.1" resolved "https://registry.yarnpkg.com/@floating-ui/utils/-/utils-0.2.1.tgz#16308cea045f0fc777b6ff20a9f25474dd8293d2" integrity sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q== -"@humanwhocodes/config-array@^0.11.13": +"@humanwhocodes/config-array@^0.11.14": version "0.11.14" resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.11.14.tgz#d78e481a039f7566ecc9660b4ea7fe6b1fec442b" integrity sha512-3T8LkOmg45BV5FICb15QQMsyUSWrQ8AygVfC7ZG32zOalnqrilm018ZVCw0eapXux8FtA33q8PSRSstjee3jSg== @@ -1843,80 +2063,80 @@ "@types/mdx" "^2.0.0" "@types/react" ">=16" -"@mui/base@5.0.0-beta.33": - version "5.0.0-beta.33" - resolved "https://registry.yarnpkg.com/@mui/base/-/base-5.0.0-beta.33.tgz#fbb844e2d840d47dd7a48850a03152aed2381d10" - integrity sha512-WcSpoJUw/UYHXpvgtl4HyMar2Ar97illUpqiS/X1gtSBp6sdDW6kB2BJ9OlVQ+Kk/RL2GDp/WHA9sbjAYV35ow== +"@mui/base@5.0.0-beta.38": + version "5.0.0-beta.38" + resolved "https://registry.yarnpkg.com/@mui/base/-/base-5.0.0-beta.38.tgz#0d79c1158d18d9decfc8fa3ab87b4830a49cf952" + integrity sha512-AsjD6Y1X5A1qndxz8xCcR8LDqv31aiwlgWMPxFAX/kCKiIGKlK65yMeVZ62iQr/6LBz+9hSKLiD1i4TZdAHKcQ== dependencies: - "@babel/runtime" "^7.23.8" - "@floating-ui/react-dom" "^2.0.6" + "@babel/runtime" "^7.23.9" + "@floating-ui/react-dom" "^2.0.8" "@mui/types" "^7.2.13" - "@mui/utils" "^5.15.6" + "@mui/utils" "^5.15.12" "@popperjs/core" "^2.11.8" clsx "^2.1.0" prop-types "^15.8.1" -"@mui/core-downloads-tracker@^5.15.6": - version "5.15.6" - resolved "https://registry.yarnpkg.com/@mui/core-downloads-tracker/-/core-downloads-tracker-5.15.6.tgz#9b82ba86d5a0fe55e9479b68dd5068943cc3835b" - integrity sha512-0aoWS4qvk1uzm9JBs83oQmIMIQeTBUeqqu8u+3uo2tMznrB5fIKqQVCbCgq+4Tm4jG+5F7dIvnjvQ2aV7UKtdw== +"@mui/core-downloads-tracker@^5.15.12": + version "5.15.12" + resolved "https://registry.yarnpkg.com/@mui/core-downloads-tracker/-/core-downloads-tracker-5.15.12.tgz#f3da6ff16c753ab8b2f8d401c1e1534ba8a8a9a9" + integrity sha512-brRO+tMFLpGyjEYHrX97bzqeF6jZmKpqqe1rY0LyIHAwP6xRVzh++zSecOQorDOCaZJg4XkGT9xfD+RWOWxZBA== -"@mui/icons-material@5.15.6": - version "5.15.6" - resolved "https://registry.yarnpkg.com/@mui/icons-material/-/icons-material-5.15.6.tgz#6958232bef48972fcbafd5f69e6079a9be5951f1" - integrity sha512-GnkxMtlhs+8ieHLmCytg00ew0vMOiXGFCw8Ra9nxMsBjBqnrOI5gmXqUm+sGggeEU/HG8HyeqC1MX/IxOBJHzA== +"@mui/icons-material@5.15.12": + version "5.15.12" + resolved "https://registry.yarnpkg.com/@mui/icons-material/-/icons-material-5.15.12.tgz#30638c5dd4d40ecabea1579bbfa7394565c54474" + integrity sha512-3BXiDlOd3AexZoEXa/VqpIpVIvosCzjLHsdMWzKMXbZdnBiJjmb9ECdqfjn5SpTClO49qvkKLhkTqdBH3fSFGw== dependencies: - "@babel/runtime" "^7.23.8" + "@babel/runtime" "^7.23.9" -"@mui/material@5.15.6": - version "5.15.6" - resolved "https://registry.yarnpkg.com/@mui/material/-/material-5.15.6.tgz#e32944ae4e01f85b314bc26e4cbbb700d598f30c" - integrity sha512-rw7bDdpi2kzfmcDN78lHp8swArJ5sBCKsn+4G3IpGfu44ycyWAWX0VdlvkjcR9Yrws2KIm7c+8niXpWHUDbWoA== +"@mui/material@5.15.12": + version "5.15.12" + resolved "https://registry.yarnpkg.com/@mui/material/-/material-5.15.12.tgz#08d6582e4037f45df510f3bce51fa06b38a9a676" + integrity sha512-vXJGg6KNKucsvbW6l7w9zafnpOp0CWc0Wx4mDykuABTpQ5QQBnZxP7+oB4yAS1hDZQ1WobbeIl0CjxK4EEahkA== dependencies: - "@babel/runtime" "^7.23.8" - "@mui/base" "5.0.0-beta.33" - "@mui/core-downloads-tracker" "^5.15.6" - "@mui/system" "^5.15.6" + "@babel/runtime" "^7.23.9" + "@mui/base" "5.0.0-beta.38" + "@mui/core-downloads-tracker" "^5.15.12" + "@mui/system" "^5.15.12" "@mui/types" "^7.2.13" - "@mui/utils" "^5.15.6" + "@mui/utils" "^5.15.12" "@types/react-transition-group" "^4.4.10" clsx "^2.1.0" - csstype "^3.1.2" + csstype "^3.1.3" prop-types "^15.8.1" react-is "^18.2.0" react-transition-group "^4.4.5" -"@mui/private-theming@^5.15.6": - version "5.15.6" - resolved "https://registry.yarnpkg.com/@mui/private-theming/-/private-theming-5.15.6.tgz#224819694ed76df041b1257256152a45d1fd733d" - integrity sha512-ZBX9E6VNUSscUOtU8uU462VvpvBS7eFl5VfxAzTRVQBHflzL+5KtnGrebgf6Nd6cdvxa1o0OomiaxSKoN2XDmg== +"@mui/private-theming@^5.15.12": + version "5.15.12" + resolved "https://registry.yarnpkg.com/@mui/private-theming/-/private-theming-5.15.12.tgz#e3ac99b3dbfa6ecc6e914009df33a2d400432f6e" + integrity sha512-cqoSo9sgA5HE+8vZClbLrq9EkyOnYysooepi5eKaKvJ41lReT2c5wOZAeDDM1+xknrMDos+0mT2zr3sZmUiRRA== dependencies: - "@babel/runtime" "^7.23.8" - "@mui/utils" "^5.15.6" + "@babel/runtime" "^7.23.9" + "@mui/utils" "^5.15.12" prop-types "^15.8.1" -"@mui/styled-engine@^5.15.6": - version "5.15.6" - resolved "https://registry.yarnpkg.com/@mui/styled-engine/-/styled-engine-5.15.6.tgz#3f4a8804de6ddeee17cb52ec92225686f423398a" - integrity sha512-KAn8P8xP/WigFKMlEYUpU9z2o7jJnv0BG28Qu1dhNQVutsLVIFdRf5Nb+0ijp2qgtcmygQ0FtfRuXv5LYetZTg== +"@mui/styled-engine@^5.15.11": + version "5.15.11" + resolved "https://registry.yarnpkg.com/@mui/styled-engine/-/styled-engine-5.15.11.tgz#040181f31910e0f66d43a5c44fe89da06b34212b" + integrity sha512-So21AhAngqo07ces4S/JpX5UaMU2RHXpEA6hNzI6IQjd/1usMPxpgK8wkGgTe3JKmC2KDmH8cvoycq5H3Ii7/w== dependencies: - "@babel/runtime" "^7.23.8" + "@babel/runtime" "^7.23.9" "@emotion/cache" "^11.11.0" - csstype "^3.1.2" + csstype "^3.1.3" prop-types "^15.8.1" -"@mui/styles@5.15.6": - version "5.15.6" - resolved "https://registry.yarnpkg.com/@mui/styles/-/styles-5.15.6.tgz#128529bf50e7055974e48e51e9bf67fc8e143fcf" - integrity sha512-5WYJ4KjJ4eMEgWcqY8lPr1hbte5mw7/zVgB7IjonoyIEnG9JPKbT/ma4QW5Rm3q/dUxmpngrRdh60fZPIhQpfw== +"@mui/styles@5.15.12": + version "5.15.12" + resolved "https://registry.yarnpkg.com/@mui/styles/-/styles-5.15.12.tgz#2e42e8a663f55fb22f5ac79c5071db31701a2f47" + integrity sha512-1dBGLPAR3BhlmKorKhP9XK2wIH1M6BVSfws7agbWaS3atM4fApa0pZic4wjiTyNo7o6N5Lg2wZSnl1wUv/nCmA== dependencies: - "@babel/runtime" "^7.23.8" + "@babel/runtime" "^7.23.9" "@emotion/hash" "^0.9.1" - "@mui/private-theming" "^5.15.6" + "@mui/private-theming" "^5.15.12" "@mui/types" "^7.2.13" - "@mui/utils" "^5.15.6" + "@mui/utils" "^5.15.12" clsx "^2.1.0" - csstype "^3.1.2" + csstype "^3.1.3" hoist-non-react-statics "^3.3.2" jss "^10.10.0" jss-plugin-camel-case "^10.10.0" @@ -1928,18 +2148,18 @@ jss-plugin-vendor-prefixer "^10.10.0" prop-types "^15.8.1" -"@mui/system@^5.15.6": - version "5.15.6" - resolved "https://registry.yarnpkg.com/@mui/system/-/system-5.15.6.tgz#d278adb09d57ee21f4eef2f6bc335bf9bd062fca" - integrity sha512-J01D//u8IfXvaEHMBQX5aO2l7Q+P15nt96c4NskX7yp5/+UuZP8XCQJhtBtLuj+M2LLyXHYGmCPeblsmmscP2Q== +"@mui/system@^5.15.12": + version "5.15.12" + resolved "https://registry.yarnpkg.com/@mui/system/-/system-5.15.12.tgz#852cf7c339eb61703196f56c36fc93206136eb20" + integrity sha512-/pq+GO6yN3X7r3hAwFTrzkAh7K1bTF5r8IzS79B9eyKJg7v6B/t4/zZYMR6OT9qEPtwf6rYN2Utg1e6Z7F1OgQ== dependencies: - "@babel/runtime" "^7.23.8" - "@mui/private-theming" "^5.15.6" - "@mui/styled-engine" "^5.15.6" + "@babel/runtime" "^7.23.9" + "@mui/private-theming" "^5.15.12" + "@mui/styled-engine" "^5.15.11" "@mui/types" "^7.2.13" - "@mui/utils" "^5.15.6" + "@mui/utils" "^5.15.12" clsx "^2.1.0" - csstype "^3.1.2" + csstype "^3.1.3" prop-types "^15.8.1" "@mui/types@^7.2.13": @@ -1947,12 +2167,12 @@ resolved "https://registry.yarnpkg.com/@mui/types/-/types-7.2.13.tgz#d1584912942f9dc042441ecc2d1452be39c666b8" integrity sha512-qP9OgacN62s+l8rdDhSFRe05HWtLLJ5TGclC9I1+tQngbssu0m2dmFZs+Px53AcOs9fD7TbYd4gc9AXzVqO/+g== -"@mui/utils@^5.15.6": - version "5.15.6" - resolved "https://registry.yarnpkg.com/@mui/utils/-/utils-5.15.6.tgz#bbcc302b8e83e360a87230afe3ed8fc99e29fae9" - integrity sha512-qfEhf+zfU9aQdbzo1qrSWlbPQhH1nCgeYgwhOVnj9Bn39shJQitEnXpSQpSNag8+uty5Od6PxmlNKPTnPySRKA== +"@mui/utils@^5.15.12": + version "5.15.12" + resolved "https://registry.yarnpkg.com/@mui/utils/-/utils-5.15.12.tgz#bd00b678c16b98c543d4c6c560f9c90e6792b2a7" + integrity sha512-8SDGCnO2DY9Yy+5bGzu00NZowSDtuyHP4H8gunhHGQoIlhlY2Z3w64wBzAOLpYw/ZhJNzksDTnS/i8qdJvxuow== dependencies: - "@babel/runtime" "^7.23.8" + "@babel/runtime" "^7.23.9" "@types/prop-types" "^15.7.11" prop-types "^15.8.1" react-is "^18.2.0" @@ -2331,100 +2551,100 @@ dependencies: "@sinonjs/commons" "^3.0.0" -"@storybook/addon-actions@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/addon-actions/-/addon-actions-7.6.10.tgz#5b43534e158797114db032f4ad8505a81809ed00" - integrity sha512-pcKmf0H/caGzKDy8cz1adNSjv+KOBWLJ11RzGExrWm+Ad5ACifwlsQPykJ3TQ/21sTd9IXVrE9uuq4LldEnPbg== +"@storybook/addon-actions@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/addon-actions/-/addon-actions-7.6.17.tgz#b1be5ab28b22b4a50c6aa0cd0a3671ca5b6f5f71" + integrity sha512-TBphs4v6LRfyTpFo/WINF0TkMaE3rrNog7wW5mbz6n0j8o53kDN4o9ZEcygSL5zQX43CAaghQTeDCss7ueG7ZQ== dependencies: - "@storybook/core-events" "7.6.10" + "@storybook/core-events" "7.6.17" "@storybook/global" "^5.0.0" "@types/uuid" "^9.0.1" dequal "^2.0.2" polished "^4.2.2" uuid "^9.0.0" -"@storybook/addon-backgrounds@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/addon-backgrounds/-/addon-backgrounds-7.6.10.tgz#4ecfc017befd400e5eabad347ab1819c2ea67a8c" - integrity sha512-kGzsN1QkfyI8Cz7TErEx9OCB3PMzpCFGLd/iy7FreXwbMbeAQ3/9fYgKUsNOYgOhuTz7S09koZUWjS/WJuZGFA== +"@storybook/addon-backgrounds@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/addon-backgrounds/-/addon-backgrounds-7.6.17.tgz#a3c96cb73e6053dc2cf9968cb02b437c4d752812" + integrity sha512-7dize7x8+37PH77kmt69b0xSaeDqOcZ4fpzW6+hk53hIaCVU26eGs4+j+743Xva31eOgZWNLupUhOpUDc6SqZw== dependencies: "@storybook/global" "^5.0.0" memoizerific "^1.11.3" ts-dedent "^2.0.0" -"@storybook/addon-controls@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/addon-controls/-/addon-controls-7.6.10.tgz#6cd309440bf2b86c21f11a8b5f20bc1340d6c045" - integrity sha512-LjwCQRMWq1apLtFwDi6U8MI6ITUr+KhxJucZ60tfc58RgB2v8ayozyDAonFEONsx9YSR1dNIJ2Z/e2rWTBJeYA== +"@storybook/addon-controls@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/addon-controls/-/addon-controls-7.6.17.tgz#354f3f85481e0a3318519b8c8aa5a3b1152e8de0" + integrity sha512-zR0aLaUF7FtV/nMRyfniFbCls/e0DAAoXACuOAUAwNAv0lbIS8AyZZiHSmKucCvziUQ6WceeCC7+du3C+9y0rQ== dependencies: - "@storybook/blocks" "7.6.10" + "@storybook/blocks" "7.6.17" lodash "^4.17.21" ts-dedent "^2.0.0" -"@storybook/addon-docs@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/addon-docs/-/addon-docs-7.6.10.tgz#aab69f253a9cfbb57fd84062f00fac08f9c796cd" - integrity sha512-GtyQ9bMx1AOOtl6ZS9vwK104HFRK+tqzxddRRxhXkpyeKu3olm9aMgXp35atE/3fJSqyyDm2vFtxxH8mzBA20A== +"@storybook/addon-docs@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/addon-docs/-/addon-docs-7.6.17.tgz#ea62be2da8b31df2c80a47cac4c30f66af4d2fbf" + integrity sha512-FKa4Mdy7nhgvEVZJHpMkHriDzpVHbohn87zv9NCL+Ctjs1iAmzGwxEm0culszyDS1HN2ToVoY0h8CSi2RSSZqA== dependencies: "@jest/transform" "^29.3.1" "@mdx-js/react" "^2.1.5" - "@storybook/blocks" "7.6.10" - "@storybook/client-logger" "7.6.10" - "@storybook/components" "7.6.10" - "@storybook/csf-plugin" "7.6.10" - "@storybook/csf-tools" "7.6.10" + "@storybook/blocks" "7.6.17" + "@storybook/client-logger" "7.6.17" + "@storybook/components" "7.6.17" + "@storybook/csf-plugin" "7.6.17" + "@storybook/csf-tools" "7.6.17" "@storybook/global" "^5.0.0" "@storybook/mdx2-csf" "^1.0.0" - "@storybook/node-logger" "7.6.10" - "@storybook/postinstall" "7.6.10" - "@storybook/preview-api" "7.6.10" - "@storybook/react-dom-shim" "7.6.10" - "@storybook/theming" "7.6.10" - "@storybook/types" "7.6.10" + "@storybook/node-logger" "7.6.17" + "@storybook/postinstall" "7.6.17" + "@storybook/preview-api" "7.6.17" + "@storybook/react-dom-shim" "7.6.17" + "@storybook/theming" "7.6.17" + "@storybook/types" "7.6.17" fs-extra "^11.1.0" remark-external-links "^8.0.0" remark-slug "^6.0.0" ts-dedent "^2.0.0" -"@storybook/addon-essentials@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/addon-essentials/-/addon-essentials-7.6.10.tgz#9078abe56b15d976e3d4c15247c748b2e8e53c30" - integrity sha512-cjbuCCK/3dtUity0Uqi5LwbkgfxqCCE5x5mXZIk9lTMeDz5vB9q6M5nzncVDy8F8przF3NbDLLgxKlt8wjiICg== - dependencies: - "@storybook/addon-actions" "7.6.10" - "@storybook/addon-backgrounds" "7.6.10" - "@storybook/addon-controls" "7.6.10" - "@storybook/addon-docs" "7.6.10" - "@storybook/addon-highlight" "7.6.10" - "@storybook/addon-measure" "7.6.10" - "@storybook/addon-outline" "7.6.10" - "@storybook/addon-toolbars" "7.6.10" - "@storybook/addon-viewport" "7.6.10" - "@storybook/core-common" "7.6.10" - "@storybook/manager-api" "7.6.10" - "@storybook/node-logger" "7.6.10" - "@storybook/preview-api" "7.6.10" +"@storybook/addon-essentials@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/addon-essentials/-/addon-essentials-7.6.17.tgz#d49d9a77edc999518c6871b66032a647787c39f4" + integrity sha512-qlSpamxuYfT2taF953nC9QijGF2pSbg1ewMNpdwLTj16PTZvR/d8NCDMTJujI1bDwM2m18u8Yc43ibh5LEmxCw== + dependencies: + "@storybook/addon-actions" "7.6.17" + "@storybook/addon-backgrounds" "7.6.17" + "@storybook/addon-controls" "7.6.17" + "@storybook/addon-docs" "7.6.17" + "@storybook/addon-highlight" "7.6.17" + "@storybook/addon-measure" "7.6.17" + "@storybook/addon-outline" "7.6.17" + "@storybook/addon-toolbars" "7.6.17" + "@storybook/addon-viewport" "7.6.17" + "@storybook/core-common" "7.6.17" + "@storybook/manager-api" "7.6.17" + "@storybook/node-logger" "7.6.17" + "@storybook/preview-api" "7.6.17" ts-dedent "^2.0.0" -"@storybook/addon-highlight@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/addon-highlight/-/addon-highlight-7.6.10.tgz#19cad3d67655e9b9eef3d2f6760789fc29ba0790" - integrity sha512-dIuS5QmoT1R+gFOcf6CoBa6D9UR5/wHCfPqPRH8dNNcCLtIGSHWQ4v964mS5OCq1Huj7CghmR15lOUk7SaYwUA== +"@storybook/addon-highlight@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/addon-highlight/-/addon-highlight-7.6.17.tgz#6d8549aa95eb007888f4d272e9ab7316cbcc001c" + integrity sha512-R1yBPUUqGn+60aJakn8q+5Zt34E/gU3n3VmgPdryP0LJUdZ5q1/RZShoVDV+yYQ40htMH6oaCv3OyyPzFAGJ6A== dependencies: "@storybook/global" "^5.0.0" -"@storybook/addon-measure@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/addon-measure/-/addon-measure-7.6.10.tgz#5e41d64aa6e02b9c6df1696d918058979598250e" - integrity sha512-OVfTI56+kc4hLWfZ/YPV3WKj/aA9e4iKXYxZyPdhfX4Z8TgZdD1wv9Z6e8DKS0H5kuybYrHKHaID5ki6t7qz3w== +"@storybook/addon-measure@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/addon-measure/-/addon-measure-7.6.17.tgz#a348b40dfa592c66b348457bd4f535f4ba481279" + integrity sha512-O5vnHZNkduvZ95jf1UssbOl6ivIxzl5tv+4EpScPYId7w700bxWsJH+QX7ip6KlrCf2o3iUhmPe8bm05ghG2KA== dependencies: "@storybook/global" "^5.0.0" tiny-invariant "^1.3.1" -"@storybook/addon-outline@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/addon-outline/-/addon-outline-7.6.10.tgz#02b51084cc1d555c270995cebfe512924df0ce7e" - integrity sha512-RVJrEoPArhI6zAIMNl1Gz0zrj84BTfEWYYz0yDWOTVgvN411ugsoIk1hw0671MOneXJ2RcQ9MFIeV/v6AVDQYg== +"@storybook/addon-outline@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/addon-outline/-/addon-outline-7.6.17.tgz#f87c7bea4ecba783c79a3026f8fc7e0acc26c460" + integrity sha512-9o9JXDsYjNaDgz/cY5+jv694+aik/1aiRGGvsCv68e1p/ob0glkGKav4lnJe2VJqD+gCmaARoD8GOJlhoQl8JQ== dependencies: "@storybook/global" "^5.0.0" ts-dedent "^2.0.0" @@ -2436,34 +2656,34 @@ dependencies: "@storybook/node-logger" "^7.0.12" -"@storybook/addon-toolbars@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/addon-toolbars/-/addon-toolbars-7.6.10.tgz#4d841e87acca5455a8339a29c1062612ccb07df6" - integrity sha512-PaXY/oj9yxF7/H0CNdQKcioincyCkfeHpISZriZbZqhyqsjn3vca7RFEmsB88Q+ou6rMeqyA9st+6e2cx/Ct6A== +"@storybook/addon-toolbars@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/addon-toolbars/-/addon-toolbars-7.6.17.tgz#98c1cee88a8f5f61464d28a09648994884d7bd0a" + integrity sha512-UMrchbUHiyWrh6WuGnpy34Jqzkx/63B+MSgb3CW7YsQaXz64kE0Rol0TNSznnB+mYXplcqH+ndI4r4kFsmgwDg== -"@storybook/addon-viewport@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/addon-viewport/-/addon-viewport-7.6.10.tgz#834bad76a56e4117ffb2dc935d349dca3b49bcc3" - integrity sha512-+bA6juC/lH4vEhk+w0rXakaG8JgLG4MOYrIudk5vJKQaC6X58LIM9N4kzIS2KSExRhkExXBPrWsnMfCo7uxmKg== +"@storybook/addon-viewport@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/addon-viewport/-/addon-viewport-7.6.17.tgz#db3c1f14bb4185f20d745c4e8cf2bd10f70ea336" + integrity sha512-sA0QCcf4QAMixWvn8uvRYPfkKCSl6JajJaAspoPqXSxHEpK7uwOlpg3kqFU5XJJPXD0X957M+ONgNvBzYqSpEw== dependencies: memoizerific "^1.11.3" -"@storybook/blocks@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/blocks/-/blocks-7.6.10.tgz#353a5efa6a922a9a3766254f9f24cc2adad34f83" - integrity sha512-oSIukGC3yuF8pojABC/HLu5tv2axZvf60TaUs8eDg7+NiiKhzYSPoMQxs5uMrKngl+EJDB92ESgWT9vvsfvIPg== +"@storybook/blocks@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/blocks/-/blocks-7.6.17.tgz#1329885be158f08104f806e5f23b7eb7f99c8b1c" + integrity sha512-PsNVoe0bX1mMn4Kk3nbKZ0ItDZZ0YJnYAFJ6toAbsyBAbgzg1sce88sQinzvbn58/RT9MPKeWMPB45ZS7ggiNg== dependencies: - "@storybook/channels" "7.6.10" - "@storybook/client-logger" "7.6.10" - "@storybook/components" "7.6.10" - "@storybook/core-events" "7.6.10" + "@storybook/channels" "7.6.17" + "@storybook/client-logger" "7.6.17" + "@storybook/components" "7.6.17" + "@storybook/core-events" "7.6.17" "@storybook/csf" "^0.1.2" - "@storybook/docs-tools" "7.6.10" + "@storybook/docs-tools" "7.6.17" "@storybook/global" "^5.0.0" - "@storybook/manager-api" "7.6.10" - "@storybook/preview-api" "7.6.10" - "@storybook/theming" "7.6.10" - "@storybook/types" "7.6.10" + "@storybook/manager-api" "7.6.17" + "@storybook/preview-api" "7.6.17" + "@storybook/theming" "7.6.17" + "@storybook/types" "7.6.17" "@types/lodash" "^4.14.167" color-convert "^2.0.1" dequal "^2.0.2" @@ -2477,15 +2697,15 @@ ts-dedent "^2.0.0" util-deprecate "^1.0.2" -"@storybook/builder-manager@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/builder-manager/-/builder-manager-7.6.10.tgz#fc30b19dd74e6f6ae896d8f4045552c3206c25f9" - integrity sha512-f+YrjZwohGzvfDtH8BHzqM3xW0p4vjjg9u7uzRorqUiNIAAKHpfNrZ/WvwPlPYmrpAHt4xX/nXRJae4rFSygPw== +"@storybook/builder-manager@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/builder-manager/-/builder-manager-7.6.17.tgz#0d329bea94b5c4a7f88eaee02c42d49c4370c8b4" + integrity sha512-Sj8hcDYiPCCMfeLzus37czl0zdrAxAz4IyYam2jBjVymrIrcDAFyL1OCZvnq33ft179QYQWhUs9qwzVmlR/ZWg== dependencies: "@fal-works/esbuild-plugin-global-externals" "^2.1.2" - "@storybook/core-common" "7.6.10" - "@storybook/manager" "7.6.10" - "@storybook/node-logger" "7.6.10" + "@storybook/core-common" "7.6.17" + "@storybook/manager" "7.6.17" + "@storybook/node-logger" "7.6.17" "@types/ejs" "^3.1.1" "@types/find-cache-dir" "^3.2.1" "@yarnpkg/esbuild-plugin-pnp" "^3.0.0-rc.10" @@ -2499,20 +2719,20 @@ process "^0.11.10" util "^0.12.4" -"@storybook/builder-webpack5@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/builder-webpack5/-/builder-webpack5-7.6.10.tgz#9cd8ae541e836c089e17e5f8d527b9cad6d4d99f" - integrity sha512-ja47rdy75tAs37T+JLSqgUGJiba+74zM/8IpEZAzgJmGxLetnHuCWEDskZWh3NXemxYS2uCvsg5rNc+dL9z4RA== +"@storybook/builder-webpack5@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/builder-webpack5/-/builder-webpack5-7.6.17.tgz#1bf52b4cf62c66cbfe95e189fa4303a542bb645a" + integrity sha512-GMaBd8/RzivuAmWrYSt9Rga3j8WLcu5LCMYiPVs+XKXsKAC8lTkV0WRWh8Nk6wTmfzsRQ2acwFjSG5oE4ClZKA== dependencies: "@babel/core" "^7.23.2" - "@storybook/channels" "7.6.10" - "@storybook/client-logger" "7.6.10" - "@storybook/core-common" "7.6.10" - "@storybook/core-events" "7.6.10" - "@storybook/core-webpack" "7.6.10" - "@storybook/node-logger" "7.6.10" - "@storybook/preview" "7.6.10" - "@storybook/preview-api" "7.6.10" + "@storybook/channels" "7.6.17" + "@storybook/client-logger" "7.6.17" + "@storybook/core-common" "7.6.17" + "@storybook/core-events" "7.6.17" + "@storybook/core-webpack" "7.6.17" + "@storybook/node-logger" "7.6.17" + "@storybook/preview" "7.6.17" + "@storybook/preview-api" "7.6.17" "@swc/core" "^1.3.82" "@types/node" "^18.0.0" "@types/semver" "^7.3.4" @@ -2543,35 +2763,35 @@ webpack-hot-middleware "^2.25.1" webpack-virtual-modules "^0.5.0" -"@storybook/channels@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/channels/-/channels-7.6.10.tgz#04fd2c2f0b530bb8d236f5763e8df8cb5fa7c921" - integrity sha512-ITCLhFuDBKgxetuKnWwYqMUWlU7zsfH3gEKZltTb+9/2OAWR7ez0iqU7H6bXP1ridm0DCKkt2UMWj2mmr9iQqg== +"@storybook/channels@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/channels/-/channels-7.6.17.tgz#5be1d1222a3ffdc90e1868230c2b2ee5dfc7a97f" + integrity sha512-GFG40pzaSxk1hUr/J/TMqW5AFDDPUSu+HkeE/oqSWJbOodBOLJzHN6CReJS6y1DjYSZLNFt1jftPWZZInG/XUA== dependencies: - "@storybook/client-logger" "7.6.10" - "@storybook/core-events" "7.6.10" + "@storybook/client-logger" "7.6.17" + "@storybook/core-events" "7.6.17" "@storybook/global" "^5.0.0" qs "^6.10.0" telejson "^7.2.0" tiny-invariant "^1.3.1" -"@storybook/cli@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/cli/-/cli-7.6.10.tgz#2436276c5404b166a9f795fef44bbd75826d9bfe" - integrity sha512-pK1MEseMm73OMO2OVoSz79QWX8ymxgIGM8IeZTCo9gImiVRChMNDFYcv8yPWkjuyesY8c15CoO48aR7pdA1OjQ== +"@storybook/cli@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/cli/-/cli-7.6.17.tgz#04462c97a926e3dfcc18f3df02519effe29740e2" + integrity sha512-1sCo+nCqyR+nKfTcEidVu8XzNoECC7Y1l+uW38/r7s2f/TdDorXaIGAVrpjbSaXSoQpx5DxYJVaKCcQuOgqwcA== dependencies: "@babel/core" "^7.23.2" "@babel/preset-env" "^7.23.2" "@babel/types" "^7.23.0" "@ndelangen/get-tarball" "^3.0.7" - "@storybook/codemod" "7.6.10" - "@storybook/core-common" "7.6.10" - "@storybook/core-events" "7.6.10" - "@storybook/core-server" "7.6.10" - "@storybook/csf-tools" "7.6.10" - "@storybook/node-logger" "7.6.10" - "@storybook/telemetry" "7.6.10" - "@storybook/types" "7.6.10" + "@storybook/codemod" "7.6.17" + "@storybook/core-common" "7.6.17" + "@storybook/core-events" "7.6.17" + "@storybook/core-server" "7.6.17" + "@storybook/csf-tools" "7.6.17" + "@storybook/node-logger" "7.6.17" + "@storybook/telemetry" "7.6.17" + "@storybook/types" "7.6.17" "@types/semver" "^7.3.4" "@yarnpkg/fslib" "2.10.3" "@yarnpkg/libzip" "2.3.0" @@ -2601,25 +2821,25 @@ ts-dedent "^2.0.0" util-deprecate "^1.0.2" -"@storybook/client-logger@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/client-logger/-/client-logger-7.6.10.tgz#5d66feb18a21836f84b63f71cf5b3a85d669f049" - integrity sha512-U7bbpu21ntgePMz/mKM18qvCSWCUGCUlYru8mgVlXLCKqFqfTeP887+CsPEQf29aoE3cLgDrxqbRJ1wxX9kL9A== +"@storybook/client-logger@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/client-logger/-/client-logger-7.6.17.tgz#5031c47b7df8d8792fe9dfed5828222f515e5803" + integrity sha512-6WBYqixAXNAXlSaBWwgljWpAu10tPRBJrcFvx2gPUne58EeMM20Gi/iHYBz2kMCY+JLAgeIH7ZxInqwO8vDwiQ== dependencies: "@storybook/global" "^5.0.0" -"@storybook/codemod@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/codemod/-/codemod-7.6.10.tgz#21cc0e69df6f57d567fc27264310f820662d62fa" - integrity sha512-pzFR0nocBb94vN9QCJLC3C3dP734ZigqyPmd0ZCDj9Xce2ytfHK3v1lKB6TZWzKAZT8zztauECYxrbo4LVuagw== +"@storybook/codemod@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/codemod/-/codemod-7.6.17.tgz#c93d87d74f43fd475d48edb178233e89329b72c2" + integrity sha512-JuTmf2u3C4fCnjO7o3dqRgrq3ozNYfWlrRP8xuIdvT7niMap7a396hJtSKqS10FxCgKFcMAOsRgrCalH1dWxUg== dependencies: "@babel/core" "^7.23.2" "@babel/preset-env" "^7.23.2" "@babel/types" "^7.23.0" "@storybook/csf" "^0.1.2" - "@storybook/csf-tools" "7.6.10" - "@storybook/node-logger" "7.6.10" - "@storybook/types" "7.6.10" + "@storybook/csf-tools" "7.6.17" + "@storybook/node-logger" "7.6.17" + "@storybook/types" "7.6.17" "@types/cross-spawn" "^6.0.2" cross-spawn "^7.0.3" globby "^11.0.2" @@ -2628,38 +2848,38 @@ prettier "^2.8.0" recast "^0.23.1" -"@storybook/components@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/components/-/components-7.6.10.tgz#2d1b8c66c374327663b91f65db3b1be5749a1a6b" - integrity sha512-H5hF8pxwtbt0LxV24KMMsPlbYG9Oiui3ObvAQkvGu6q62EYxRPeNSrq3GBI5XEbI33OJY9bT24cVaZx18dXqwQ== +"@storybook/components@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/components/-/components-7.6.17.tgz#f02a47ad42432f8ea518321a145a074e4c11649f" + integrity sha512-lbh7GynMidA+CZcJnstVku6Nhs+YkqjYaZ+mKPugvlVhGVWv0DaaeQFVuZ8cJtUGJ/5FFU4Y+n+gylYUHkGBMA== dependencies: "@radix-ui/react-select" "^1.2.2" "@radix-ui/react-toolbar" "^1.0.4" - "@storybook/client-logger" "7.6.10" + "@storybook/client-logger" "7.6.17" "@storybook/csf" "^0.1.2" "@storybook/global" "^5.0.0" - "@storybook/theming" "7.6.10" - "@storybook/types" "7.6.10" + "@storybook/theming" "7.6.17" + "@storybook/types" "7.6.17" memoizerific "^1.11.3" use-resize-observer "^9.1.0" util-deprecate "^1.0.2" -"@storybook/core-client@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/core-client/-/core-client-7.6.10.tgz#cd427d7017c1f32b2e956b4eb8ea89f3424b60c9" - integrity sha512-DjnzSzSNDmZyxyg6TxugzWQwOsW+n/iWVv6sHNEvEd5STr0mjuJjIEELmv58LIr5Lsre5+LEddqHsyuLyt8ubg== +"@storybook/core-client@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/core-client/-/core-client-7.6.17.tgz#eace9819b64febf0d5ab2743f65ec5dfe4e3a410" + integrity sha512-LuDbADK+DPNAOOCXOlvY09hdGVueXlDetsdOJ/DgYnSa9QSWv9Uv+F8QcEgR3QckZJbPlztKJIVLgP2n/Xkijw== dependencies: - "@storybook/client-logger" "7.6.10" - "@storybook/preview-api" "7.6.10" + "@storybook/client-logger" "7.6.17" + "@storybook/preview-api" "7.6.17" -"@storybook/core-common@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/core-common/-/core-common-7.6.10.tgz#00b73761eb3c4452105a7d79b5179237a6f01b32" - integrity sha512-K3YWqjCKMnpvYsWNjOciwTH6zWbuuZzmOiipziZaVJ+sB1XYmH52Y3WGEm07TZI8AYK9DRgwA13dR/7W0nw72Q== +"@storybook/core-common@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/core-common/-/core-common-7.6.17.tgz#12760703f08d8f741de0f1fe7026346438251951" + integrity sha512-me2TP3Q9/qzqCLoDHUSsUF+VS1MHxfHbTVF6vAz0D/COTxzsxLpu9TxTbzJoBCxse6XRb6wWI1RgF1mIcjic7g== dependencies: - "@storybook/core-events" "7.6.10" - "@storybook/node-logger" "7.6.10" - "@storybook/types" "7.6.10" + "@storybook/core-events" "7.6.17" + "@storybook/node-logger" "7.6.17" + "@storybook/types" "7.6.17" "@types/find-cache-dir" "^3.2.1" "@types/node" "^18.0.0" "@types/node-fetch" "^2.6.4" @@ -2681,33 +2901,33 @@ resolve-from "^5.0.0" ts-dedent "^2.0.0" -"@storybook/core-events@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/core-events/-/core-events-7.6.10.tgz#d521cbdadebfa56caaa8815a1e132694a20f05e9" - integrity sha512-yccDH67KoROrdZbRKwxgTswFMAco5nlCyxszCDASCLygGSV2Q2e+YuywrhchQl3U6joiWi3Ps1qWu56NeNafag== +"@storybook/core-events@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/core-events/-/core-events-7.6.17.tgz#9e1a795558193089fb227cfe2cf768c99418a640" + integrity sha512-AriWMCm/k1cxlv10f+jZ1wavThTRpLaN3kY019kHWbYT9XgaSuLU67G7GPr3cGnJ6HuA6uhbzu8qtqVCd6OfXA== dependencies: ts-dedent "^2.0.0" -"@storybook/core-server@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/core-server/-/core-server-7.6.10.tgz#53bf43b8b3c999c87196774a0b92e2e10a434e4c" - integrity sha512-2icnqJkn3vwq0eJPP0rNaHd7IOvxYf5q4lSVl2AWTxo/Ae19KhokI6j/2vvS2XQJMGQszwshlIwrZUNsj5p0yw== +"@storybook/core-server@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/core-server/-/core-server-7.6.17.tgz#bf5b7a9db7abe157a14dba6279936e43efa79250" + integrity sha512-KWGhTTaL1Q14FolcoKKZgytlPJUbH6sbJ1Ptj/84EYWFewcnEgVs0Zlnh1VStRZg+Rd1WC1V4yVd/bbDzxrvQA== dependencies: "@aw-web-design/x-default-browser" "1.4.126" "@discoveryjs/json-ext" "^0.5.3" - "@storybook/builder-manager" "7.6.10" - "@storybook/channels" "7.6.10" - "@storybook/core-common" "7.6.10" - "@storybook/core-events" "7.6.10" + "@storybook/builder-manager" "7.6.17" + "@storybook/channels" "7.6.17" + "@storybook/core-common" "7.6.17" + "@storybook/core-events" "7.6.17" "@storybook/csf" "^0.1.2" - "@storybook/csf-tools" "7.6.10" + "@storybook/csf-tools" "7.6.17" "@storybook/docs-mdx" "^0.1.0" "@storybook/global" "^5.0.0" - "@storybook/manager" "7.6.10" - "@storybook/node-logger" "7.6.10" - "@storybook/preview-api" "7.6.10" - "@storybook/telemetry" "7.6.10" - "@storybook/types" "7.6.10" + "@storybook/manager" "7.6.17" + "@storybook/node-logger" "7.6.17" + "@storybook/preview-api" "7.6.17" + "@storybook/telemetry" "7.6.17" + "@storybook/types" "7.6.17" "@types/detect-port" "^1.3.0" "@types/node" "^18.0.0" "@types/pretty-hrtime" "^1.0.0" @@ -2720,7 +2940,7 @@ express "^4.17.3" fs-extra "^11.1.0" globby "^11.0.2" - ip "^2.0.0" + ip "^2.0.1" lodash "^4.17.21" open "^8.4.0" pretty-hrtime "^1.0.3" @@ -2735,36 +2955,36 @@ watchpack "^2.2.0" ws "^8.2.3" -"@storybook/core-webpack@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/core-webpack/-/core-webpack-7.6.10.tgz#e4ca086973d4d10f08b5bed789f1398eb983d8b1" - integrity sha512-+GiCRp+2Hw0NO3NYRKamG/U5SyOQ8tOfRUxuAqWI7nduXwB3WWdjji3/ofjqOm/ryKesuQFtfhozaczvBJBvng== +"@storybook/core-webpack@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/core-webpack/-/core-webpack-7.6.17.tgz#0cca6bd165d4cea0e53856520c6409127869f6b7" + integrity sha512-PyGrFhRM8sTONGwwLWLqBQ1HO+LBnVZ+5TOQO7ejQfdV2FWyNOzjBXm2e5jL/C6XlqiEhmL5pyHEyDBaQJQ3KA== dependencies: - "@storybook/core-common" "7.6.10" - "@storybook/node-logger" "7.6.10" - "@storybook/types" "7.6.10" + "@storybook/core-common" "7.6.17" + "@storybook/node-logger" "7.6.17" + "@storybook/types" "7.6.17" "@types/node" "^18.0.0" ts-dedent "^2.0.0" -"@storybook/csf-plugin@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/csf-plugin/-/csf-plugin-7.6.10.tgz#479cffe04c68a87f60589a6891a306805c758437" - integrity sha512-Sc+zZg/BnPH2X28tthNaQBnDiFfO0QmfjVoOx0fGYM9SvY3P5ehzWwp5hMRBim6a/twOTzePADtqYL+t6GMqqg== +"@storybook/csf-plugin@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/csf-plugin/-/csf-plugin-7.6.17.tgz#6acf738b62e14a74a90ef68d7567e2fc1d1bd68f" + integrity sha512-xTHv9BUh3bkDVCvcbmdfVF0/e96BdrEgqPJ3G3RmKbSzWLOkQ2U9yiPfHzT0KJWPhVwj12fjfZp0zunu+pcS6Q== dependencies: - "@storybook/csf-tools" "7.6.10" + "@storybook/csf-tools" "7.6.17" unplugin "^1.3.1" -"@storybook/csf-tools@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/csf-tools/-/csf-tools-7.6.10.tgz#320638f64e2e14cf539dd55188f676fd82789be5" - integrity sha512-TnDNAwIALcN6SA4l00Cb67G02XMOrYU38bIpFJk5VMDX2dvgPjUtJNBuLmEbybGcOt7nPyyFIHzKcY5FCVGoWA== +"@storybook/csf-tools@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/csf-tools/-/csf-tools-7.6.17.tgz#366bb2348fc1a62f90cdbd6cce4aa5e7293984eb" + integrity sha512-dAQtam0EBPeTJYcQPLxXgz4L9JFqD+HWbLFG9CmNIhMMjticrB0mpk1EFIS6vPXk/VsVWpBgMLD7dZlD6YMKcQ== dependencies: "@babel/generator" "^7.23.0" "@babel/parser" "^7.23.0" "@babel/traverse" "^7.23.2" "@babel/types" "^7.23.0" "@storybook/csf" "^0.1.2" - "@storybook/types" "7.6.10" + "@storybook/types" "7.6.17" fs-extra "^11.1.0" recast "^0.23.1" ts-dedent "^2.0.0" @@ -2781,14 +3001,14 @@ resolved "https://registry.yarnpkg.com/@storybook/docs-mdx/-/docs-mdx-0.1.0.tgz#33ba0e39d1461caf048b57db354b2cc410705316" integrity sha512-JDaBR9lwVY4eSH5W8EGHrhODjygPd6QImRbwjAuJNEnY0Vw4ie3bPkeGfnacB3OBW6u/agqPv2aRlR46JcAQLg== -"@storybook/docs-tools@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/docs-tools/-/docs-tools-7.6.10.tgz#90ce6bcf468b8d0a479fb75e9a6ff87f482095dc" - integrity sha512-UgbikducoXzqQHf2TozO0f2rshaeBNnShVbL5Ai4oW7pDymBmrfzdjGbF/milO7yxNKcoIByeoNmu384eBamgQ== +"@storybook/docs-tools@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/docs-tools/-/docs-tools-7.6.17.tgz#4c38025be46c991bfe994bd82996708210e51d2f" + integrity sha512-bYrLoj06adqklyLkEwD32C0Ww6t+9ZVvrJHiVT42bIhTRpFiFPAetl1a9KPHtFLnfduh4n2IxIr1jv32ThPDTA== dependencies: - "@storybook/core-common" "7.6.10" - "@storybook/preview-api" "7.6.10" - "@storybook/types" "7.6.10" + "@storybook/core-common" "7.6.17" + "@storybook/preview-api" "7.6.17" + "@storybook/types" "7.6.17" "@types/doctrine" "^0.0.3" assert "^2.1.0" doctrine "^3.0.0" @@ -2799,19 +3019,19 @@ resolved "https://registry.yarnpkg.com/@storybook/global/-/global-5.0.0.tgz#b793d34b94f572c1d7d9e0f44fac4e0dbc9572ed" integrity sha512-FcOqPAXACP0I3oJ/ws6/rrPT9WGhu915Cg8D02a9YxLo0DE9zI+a9A5gRGvmQ09fiWPukqI8ZAEoQEdWUKMQdQ== -"@storybook/manager-api@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/manager-api/-/manager-api-7.6.10.tgz#0c2932f42bb97de8fb25240844fcf64474fc8905" - integrity sha512-8eGVpRlpunuFScDtc7nxpPJf/4kJBAAZlNdlhmX09j8M3voX6GpcxabBamSEX5pXZqhwxQCshD4IbqBmjvadlw== +"@storybook/manager-api@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/manager-api/-/manager-api-7.6.17.tgz#cdf0bb8e5bdc3da2559150125b3d6a3ff72f0def" + integrity sha512-IJIV1Yc6yw1dhCY4tReHCfBnUKDqEBnMyHp3mbXpsaHxnxJZrXO45WjRAZIKlQKhl/Ge1CrnznmHRCmYgqmrWg== dependencies: - "@storybook/channels" "7.6.10" - "@storybook/client-logger" "7.6.10" - "@storybook/core-events" "7.6.10" + "@storybook/channels" "7.6.17" + "@storybook/client-logger" "7.6.17" + "@storybook/core-events" "7.6.17" "@storybook/csf" "^0.1.2" "@storybook/global" "^5.0.0" - "@storybook/router" "7.6.10" - "@storybook/theming" "7.6.10" - "@storybook/types" "7.6.10" + "@storybook/router" "7.6.17" + "@storybook/theming" "7.6.17" + "@storybook/types" "7.6.17" dequal "^2.0.2" lodash "^4.17.21" memoizerific "^1.11.3" @@ -2819,38 +3039,43 @@ telejson "^7.2.0" ts-dedent "^2.0.0" -"@storybook/manager@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/manager/-/manager-7.6.10.tgz#eb1b71c802fbf04353f3bf017dfb102eb0db217e" - integrity sha512-Co3sLCbNYY6O4iH2ggmRDLCPWLj03JE5s/DOG8OVoXc6vBwTc/Qgiyrsxxp6BHQnPpM0mxL6aKAxE3UjsW/Nog== +"@storybook/manager@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/manager/-/manager-7.6.17.tgz#56e820ede16f6b824ec6b016082d1d10dbb02759" + integrity sha512-A1LDDIqMpwRzq/dqkbbiza0QI04o4ZHCl2a3UMDZUV/+QLc2nsr2DAaLk4CVL4/cIc5zGqmIcaOTvprx2YKVBw== "@storybook/mdx2-csf@^1.0.0": version "1.1.0" resolved "https://registry.yarnpkg.com/@storybook/mdx2-csf/-/mdx2-csf-1.1.0.tgz#97f6df04d0bf616991cc1005a073ac004a7281e5" integrity sha512-TXJJd5RAKakWx4BtpwvSNdgTDkKM6RkXU8GK34S/LhidQ5Pjz3wcnqb0TxEkfhK/ztbP8nKHqXFwLfa2CYkvQw== -"@storybook/node-logger@7.6.10", "@storybook/node-logger@^7.0.12": +"@storybook/node-logger@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/node-logger/-/node-logger-7.6.17.tgz#2747cee5395c3644408df2423d98502663c4bcf6" + integrity sha512-w59MQuXhhUNrUVmVkXhMwIg2nvFWjdDczLTwYLorhfsE36CWeUOY5QCZWQy0Qf/h+jz8Uo7Evy64qn18v9C4wA== + +"@storybook/node-logger@^7.0.12": version "7.6.10" resolved "https://registry.yarnpkg.com/@storybook/node-logger/-/node-logger-7.6.10.tgz#d4c52d04384d2728d6610fb0afff6eb1feb50fd4" integrity sha512-ZBuqrv4bjJzKXyfRGFkVIi+z6ekn6rOPoQao4KmsfLNQAUUsEdR8Baw/zMnnU417zw5dSEaZdpuwx75SCQAeOA== -"@storybook/postinstall@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/postinstall/-/postinstall-7.6.10.tgz#9e81c54b1f23f71a59a6db7ee8a4d5ac40852d17" - integrity sha512-SMdXtednPCy3+SRJ7oN1OPN1oVFhj3ih+ChOEX8/kZ5J3nfmV3wLPtsZvFGUCf0KWQEP1xL+1Urv48mzMKcV/w== +"@storybook/postinstall@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/postinstall/-/postinstall-7.6.17.tgz#7218b416dfa6d36b5bdbd3e61afc9a2381f82c28" + integrity sha512-WaWqB8o9vUc9aaVls+povQSVirf1Xd1LZcVhUKfAocAF3mzYUsnJsVqvnbjRj/F96UFVihOyDt9Zjl/9OvrCvQ== -"@storybook/preset-react-webpack@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/preset-react-webpack/-/preset-react-webpack-7.6.10.tgz#86b34f7156258ddf6481bffd6c638e5382d01054" - integrity sha512-fUcr4dmXJdPIQdjkhA4bE8QF8Pavr4BSLxovtTRupbWxtRjZxJrH5hf+0HZycq1cp9umO/11Lsmw9Nx5Xg3Eww== +"@storybook/preset-react-webpack@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/preset-react-webpack/-/preset-react-webpack-7.6.17.tgz#af112cef0fb93ebfb22363b8a7eec6be7128fde6" + integrity sha512-gn/LvIbll9loOkzwbFlxzOZGmJ6t1vF2/gfi+p/N/AifDYe8+LVM1QV4KRVKt6UEJwsQd79lKf7vPH92AQaKKQ== dependencies: "@babel/preset-flow" "^7.22.15" "@babel/preset-react" "^7.22.15" "@pmmmwh/react-refresh-webpack-plugin" "^0.5.11" - "@storybook/core-webpack" "7.6.10" - "@storybook/docs-tools" "7.6.10" - "@storybook/node-logger" "7.6.10" - "@storybook/react" "7.6.10" + "@storybook/core-webpack" "7.6.17" + "@storybook/docs-tools" "7.6.17" + "@storybook/node-logger" "7.6.17" + "@storybook/react" "7.6.17" "@storybook/react-docgen-typescript-plugin" "1.0.6--canary.9.0c3f3b7.0" "@types/node" "^18.0.0" "@types/semver" "^7.3.4" @@ -2862,17 +3087,17 @@ semver "^7.3.7" webpack "5" -"@storybook/preview-api@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/preview-api/-/preview-api-7.6.10.tgz#b8d5a4f897745fc28f0ae75f7e0e9278b0e4a50a" - integrity sha512-5A3etoIwZCx05yuv3KSTv1wynN4SR4rrzaIs/CTBp3BC4q1RBL+Or/tClk0IJPXQMlx/4Y134GtNIBbkiDofpw== +"@storybook/preview-api@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/preview-api/-/preview-api-7.6.17.tgz#03dd399bf3bb8ac6f4aad3c738365b86b8790157" + integrity sha512-wLfDdI9RWo1f2zzFe54yRhg+2YWyxLZvqdZnSQ45mTs4/7xXV5Wfbv3QNTtcdw8tT3U5KRTrN1mTfTCiRJc0Kw== dependencies: - "@storybook/channels" "7.6.10" - "@storybook/client-logger" "7.6.10" - "@storybook/core-events" "7.6.10" + "@storybook/channels" "7.6.17" + "@storybook/client-logger" "7.6.17" + "@storybook/core-events" "7.6.17" "@storybook/csf" "^0.1.2" "@storybook/global" "^5.0.0" - "@storybook/types" "7.6.10" + "@storybook/types" "7.6.17" "@types/qs" "^6.9.5" dequal "^2.0.2" lodash "^4.17.21" @@ -2882,10 +3107,10 @@ ts-dedent "^2.0.0" util-deprecate "^1.0.2" -"@storybook/preview@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/preview/-/preview-7.6.10.tgz#895053c97f7e09141c6321fa42390fa8af377bef" - integrity sha512-F07BzVXTD3byq+KTWtvsw3pUu3fQbyiBNLFr2CnfU4XSdLKja5lDt8VqDQq70TayVQOf5qfUTzRd4M6pQkjw1w== +"@storybook/preview@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/preview/-/preview-7.6.17.tgz#e0c9727c7cfbd8f1d504848a57acaab8e54abe90" + integrity sha512-LvkMYK/y6alGjwRVNDIKL1lFlbyZ0H0c8iAbcQkiMoaFiujMQyVswMDKlWcj42Upfr/B1igydiruomc+eUt0mw== "@storybook/react-docgen-typescript-plugin@1.0.6--canary.9.0c3f3b7.0": version "1.0.6--canary.9.0c3f3b7.0" @@ -2900,33 +3125,33 @@ react-docgen-typescript "^2.2.2" tslib "^2.0.0" -"@storybook/react-dom-shim@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/react-dom-shim/-/react-dom-shim-7.6.10.tgz#d16df5d65a51ed66df92430d8f51d50bd177f2c2" - integrity sha512-M+N/h6ximacaFdIDjMN2waNoWwApeVYTpFeoDppiFTvdBTXChyIuiPgYX9QSg7gDz92OaA52myGOot4wGvXVzg== +"@storybook/react-dom-shim@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/react-dom-shim/-/react-dom-shim-7.6.17.tgz#5875915316f687bf658cc6686ea49f2928eae4b2" + integrity sha512-32Sa/G+WnvaPiQ1Wvjjw5UM9rr2c4GDohwCcWVv3/LJuiFPqNS6zglAtmnsrlIBnUwRBMLMh/ekCTdqMiUmfDw== -"@storybook/react-webpack5@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/react-webpack5/-/react-webpack5-7.6.10.tgz#f9d3cb4abc4177d43cefcc62d497b2cbee2b5181" - integrity sha512-LWwasiSLEg4wqsMjoRHcOn6BXv2ZyZfTfQV7gCvaX732xf0teblh+/GltAz8x+BtFXruXWmZ8bJ5cd9U4I6hUg== +"@storybook/react-webpack5@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/react-webpack5/-/react-webpack5-7.6.17.tgz#c1ab808bac41dde4a9bd96c3afc800b914eda9e6" + integrity sha512-qGc2JxaSmvPXV7ndxA/8qPtPLK7lAwejL/QdrzLXhxEmVdZLMew640FBYgOV/zWnehV3BnivThln/8PsQyst/g== dependencies: - "@storybook/builder-webpack5" "7.6.10" - "@storybook/preset-react-webpack" "7.6.10" - "@storybook/react" "7.6.10" + "@storybook/builder-webpack5" "7.6.17" + "@storybook/preset-react-webpack" "7.6.17" + "@storybook/react" "7.6.17" "@types/node" "^18.0.0" -"@storybook/react@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/react/-/react-7.6.10.tgz#aca5c446f43de75981f19d112a8a04d7abd0a03d" - integrity sha512-wwBn1cg2uZWW4peqqBjjU7XGmFq8HdkVUtWwh6dpfgmlY1Aopi+vPgZt7pY9KkWcTOq5+DerMdSfwxukpc3ajQ== +"@storybook/react@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/react/-/react-7.6.17.tgz#3e585b37f4a45d01b60543e1952a46ae3da70e81" + integrity sha512-lVqzQSU03rRJWYW+gK2gq6mSo3/qtnVICY8B8oP7gc36jVu4ksDIu45bTfukM618ODkUZy0vZe6T4engK3azjA== dependencies: - "@storybook/client-logger" "7.6.10" - "@storybook/core-client" "7.6.10" - "@storybook/docs-tools" "7.6.10" + "@storybook/client-logger" "7.6.17" + "@storybook/core-client" "7.6.17" + "@storybook/docs-tools" "7.6.17" "@storybook/global" "^5.0.0" - "@storybook/preview-api" "7.6.10" - "@storybook/react-dom-shim" "7.6.10" - "@storybook/types" "7.6.10" + "@storybook/preview-api" "7.6.17" + "@storybook/react-dom-shim" "7.6.17" + "@storybook/types" "7.6.17" "@types/escodegen" "^0.0.6" "@types/estree" "^0.0.51" "@types/node" "^18.0.0" @@ -2942,45 +3167,45 @@ type-fest "~2.19" util-deprecate "^1.0.2" -"@storybook/router@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/router/-/router-7.6.10.tgz#b1f2c550eeb9f7146eefa33c5460e4149a62d721" - integrity sha512-G/H4Jn2+y8PDe8Zbq4DVxF/TPn0/goSItdILts39JENucHiuGBCjKjSWGBe1rkwKi1tUbB3yhxJVrLagxFEPpQ== +"@storybook/router@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/router/-/router-7.6.17.tgz#de5016086191846ed12af7495aeddcc373cbd0d4" + integrity sha512-GnyC0j6Wi5hT4qRhSyT8NPtJfGmf82uZw97LQRWeyYu5gWEshUdM7aj40XlNiScd5cZDp0owO1idduVF2k2l2A== dependencies: - "@storybook/client-logger" "7.6.10" + "@storybook/client-logger" "7.6.17" memoizerific "^1.11.3" qs "^6.10.0" -"@storybook/telemetry@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/telemetry/-/telemetry-7.6.10.tgz#31c0edfb9c7005cf9b5922e51ca896218e3d81ea" - integrity sha512-p3mOSUtIyy2tF1z6pQXxNh1JzYFcAm97nUgkwLzF07GfEdVAPM+ftRSLFbD93zVvLEkmLTlsTiiKaDvOY/lQWg== +"@storybook/telemetry@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/telemetry/-/telemetry-7.6.17.tgz#472dd6a8d87240c1fcc01bb9d6247e134e539b5b" + integrity sha512-WOcOAmmengYnGInH98Px44F47DSpLyk20BM+Z/IIQDzfttGOLlxNqBBG1XTEhNRn+AYuk4aZ2JEed2lCjVIxcA== dependencies: - "@storybook/client-logger" "7.6.10" - "@storybook/core-common" "7.6.10" - "@storybook/csf-tools" "7.6.10" + "@storybook/client-logger" "7.6.17" + "@storybook/core-common" "7.6.17" + "@storybook/csf-tools" "7.6.17" chalk "^4.1.0" detect-package-manager "^2.0.1" fetch-retry "^5.0.2" fs-extra "^11.1.0" read-pkg-up "^7.0.1" -"@storybook/theming@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-7.6.10.tgz#c09d66d19f5756964cc89b1f94051545fc4aaea7" - integrity sha512-f5tuy7yV3TOP3fIboSqpgLHy0wKayAw/M8HxX0jVET4Z4fWlFK0BiHJabQ+XEdAfQM97XhPFHB2IPbwsqhCEcQ== +"@storybook/theming@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/theming/-/theming-7.6.17.tgz#8170e3e72b921380c51a3970890d4cb479a65c2f" + integrity sha512-ZbaBt3KAbmBtfjNqgMY7wPMBshhSJlhodyMNQypv+95xLD/R+Az6aBYbpVAOygLaUQaQk4ar7H/Ww6lFIoiFbA== dependencies: "@emotion/use-insertion-effect-with-fallbacks" "^1.0.0" - "@storybook/client-logger" "7.6.10" + "@storybook/client-logger" "7.6.17" "@storybook/global" "^5.0.0" memoizerific "^1.11.3" -"@storybook/types@7.6.10": - version "7.6.10" - resolved "https://registry.yarnpkg.com/@storybook/types/-/types-7.6.10.tgz#20cfb2dfeba2ecf54721de131276041d073fe42e" - integrity sha512-hcS2HloJblaMpCAj2axgGV+53kgSRYPT0a1PG1IHsZaYQILfHSMmBqM8XzXXYTsgf9250kz3dqFX1l0n3EqMlQ== +"@storybook/types@7.6.17": + version "7.6.17" + resolved "https://registry.yarnpkg.com/@storybook/types/-/types-7.6.17.tgz#0b3c27cb1708c0545a9ea1a23b73aa8852dd47c4" + integrity sha512-GRY0xEJQ0PrL7DY2qCNUdIfUOE0Gsue6N+GBJw9ku1IUDFLJRDOF+4Dx2BvYcVCPI5XPqdWKlEyZdMdKjiQN7Q== dependencies: - "@storybook/channels" "7.6.10" + "@storybook/channels" "7.6.17" "@types/babel__core" "^7.0.0" "@types/express" "^4.7.0" file-system-cache "2.3.0" @@ -3121,10 +3346,10 @@ lz-string "^1.5.0" pretty-format "^27.0.2" -"@testing-library/react@14.1.2": - version "14.1.2" - resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-14.1.2.tgz#a2b9e9ee87721ec9ed2d7cfc51cc04e474537c32" - integrity sha512-z4p7DVBTPjKM5qDZ0t5ZjzkpSNb+fZy1u6bzO7kk8oeGagpPCAtgh4cx1syrfp7a+QWkM021jGqjJaxJJnXAZg== +"@testing-library/react@14.2.1": + version "14.2.1" + resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-14.2.1.tgz#bf69aa3f71c36133349976a4a2da3687561d8310" + integrity sha512-sGdjws32ai5TLerhvzThYFbpnF9XtL65Cjf+gB0Dhr29BGqK+mAeN7SURSdu+eqgET4ANcWoC7FQpkaiGvBr+A== dependencies: "@babel/runtime" "^7.12.5" "@testing-library/dom" "^9.0.0" @@ -3337,10 +3562,10 @@ dependencies: "@types/istanbul-lib-report" "*" -"@types/jest@29.5.11": - version "29.5.11" - resolved "https://registry.yarnpkg.com/@types/jest/-/jest-29.5.11.tgz#0c13aa0da7d0929f078ab080ae5d4ced80fa2f2c" - integrity sha512-S2mHmYIVe13vrm6q4kN6fLYYAka15ALQki/vgDC3mIukEOx8WJlv0kQPM+d4w8Gp6u0uSdKND04IlTXBv0rwnQ== +"@types/jest@29.5.12": + version "29.5.12" + resolved "https://registry.yarnpkg.com/@types/jest/-/jest-29.5.12.tgz#7f7dc6eb4cf246d2474ed78744b05d06ce025544" + integrity sha512-eDC8bTvT/QhYdxJAulQikueigY5AsdBRH2yDKW3yveW7svY3+DzN84/2NUgkw10RTiJbWqZrTtoGVdYlvFJdLw== dependencies: expect "^29.0.0" pretty-format "^29.0.0" @@ -3397,13 +3622,20 @@ "@types/node" "*" form-data "^4.0.0" -"@types/node@*", "@types/node@20.11.6": +"@types/node@*": version "20.11.6" resolved "https://registry.yarnpkg.com/@types/node/-/node-20.11.6.tgz#6adf4241460e28be53836529c033a41985f85b6e" integrity sha512-+EOokTnksGVgip2PbYbr3xnR7kZigh4LbybAfBAw5BpnQ+FqBYUsvCEjYd70IXKlbohQ64mzEYmMtlWUY8q//Q== dependencies: undici-types "~5.26.4" +"@types/node@20.11.25": + version "20.11.25" + resolved "https://registry.yarnpkg.com/@types/node/-/node-20.11.25.tgz#0f50d62f274e54dd7a49f7704cc16bfbcccaf49f" + integrity sha512-TBHyJxk2b7HceLVGFcpAUjsa5zIdsPWlR6XHfyGzd0SFu+/NFgQgMAl96MSDZgQDvJAvV6BKsFOrt6zIL09JDw== + dependencies: + undici-types "~5.26.4" + "@types/node@^18.0.0": version "18.19.9" resolved "https://registry.yarnpkg.com/@types/node/-/node-18.19.9.tgz#6c2624c3a05bfa3a2735c533f95597ffacbb5608" @@ -3475,7 +3707,7 @@ dependencies: "@types/react" "*" -"@types/react@*", "@types/react@18.2.48", "@types/react@>=16": +"@types/react@*", "@types/react@>=16": version "18.2.48" resolved "https://registry.yarnpkg.com/@types/react/-/react-18.2.48.tgz#11df5664642d0bd879c1f58bc1d37205b064e8f1" integrity sha512-qboRCl6Ie70DQQG9hhNREz81jqC1cs9EVNcjQ1AU+jH6NFfSAhVVbrrY/+nSF+Bsk4AOwm9Qa61InvMCyV+H3w== @@ -3484,6 +3716,15 @@ "@types/scheduler" "*" csstype "^3.0.2" +"@types/react@18.2.63": + version "18.2.63" + resolved "https://registry.yarnpkg.com/@types/react/-/react-18.2.63.tgz#4637c56146ad90f96d0583171edab953f7e6fe57" + integrity sha512-ppaqODhs15PYL2nGUOaOu2RSCCB4Difu4UFrP4I3NHLloXC/ESQzQMi9nvjfT1+rudd0d2L3fQPJxRSey+rGlQ== + dependencies: + "@types/prop-types" "*" + "@types/scheduler" "*" + csstype "^3.0.2" + "@types/resolve@^1.20.2": version "1.20.6" resolved "https://registry.yarnpkg.com/@types/resolve/-/resolve-1.20.6.tgz#e6e60dad29c2c8c206c026e6dd8d6d1bdda850b8" @@ -3557,7 +3798,12 @@ resolved "https://registry.yarnpkg.com/@types/unist/-/unist-2.0.10.tgz#04ffa7f406ab628f7f7e97ca23e290cd8ab15efc" integrity sha512-IfYcSBWE3hLpBg8+X2SEa8LVkJdJEkT2Ese2aaLs3ptGdVtABxndrMaxuFlQ1qdFf9Q5rDvDpxI3WwgvKFAsQA== -"@types/uuid@9.0.7", "@types/uuid@^9.0.1": +"@types/uuid@9.0.8": + version "9.0.8" + resolved "https://registry.yarnpkg.com/@types/uuid/-/uuid-9.0.8.tgz#7545ba4fc3c003d6c756f651f3bf163d8f0f29ba" + integrity sha512-jg+97EGIcY9AGHJJRaaPVgetKDsrTgbRjQ5Msgjh/DQKEFl0DtyRr/VCOyD1T2R1MNeWPK/u7JoGhlDZnKBAfA== + +"@types/uuid@^9.0.1": version "9.0.7" resolved "https://registry.yarnpkg.com/@types/uuid/-/uuid-9.0.7.tgz#b14cebc75455eeeb160d5fe23c2fcc0c64f724d8" integrity sha512-WUtIVRUZ9i5dYXefDEAI7sh9/O7jGvHg7Df/5O/gtH3Yabe5odI3UWopVR1qbPXQtvOxWu3mM4XxlYeZtMWF4g== @@ -3574,16 +3820,16 @@ dependencies: "@types/yargs-parser" "*" -"@typescript-eslint/eslint-plugin@6.19.1": - version "6.19.1" - resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-6.19.1.tgz#bb0676af940bc23bf299ca58dbdc6589c2548c2e" - integrity sha512-roQScUGFruWod9CEyoV5KlCYrubC/fvG8/1zXuT0WTcxX87GnMMmnksMwSg99lo1xiKrBzw2icsJPMAw1OtKxg== +"@typescript-eslint/eslint-plugin@7.1.1": + version "7.1.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-7.1.1.tgz#dd71fc5c7ecec745ca26ece506d84d203a205c0e" + integrity sha512-zioDz623d0RHNhvx0eesUmGfIjzrk18nSBC8xewepKXbBvN/7c1qImV7Hg8TI1URTxKax7/zxfxj3Uph8Chcuw== dependencies: "@eslint-community/regexpp" "^4.5.1" - "@typescript-eslint/scope-manager" "6.19.1" - "@typescript-eslint/type-utils" "6.19.1" - "@typescript-eslint/utils" "6.19.1" - "@typescript-eslint/visitor-keys" "6.19.1" + "@typescript-eslint/scope-manager" "7.1.1" + "@typescript-eslint/type-utils" "7.1.1" + "@typescript-eslint/utils" "7.1.1" + "@typescript-eslint/visitor-keys" "7.1.1" debug "^4.3.4" graphemer "^1.4.0" ignore "^5.2.4" @@ -3591,15 +3837,15 @@ semver "^7.5.4" ts-api-utils "^1.0.1" -"@typescript-eslint/parser@6.19.1": - version "6.19.1" - resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-6.19.1.tgz#68a87bb21afaf0b1689e9cdce0e6e75bc91ada78" - integrity sha512-WEfX22ziAh6pRE9jnbkkLGp/4RhTpffr2ZK5bJ18M8mIfA8A+k97U9ZyaXCEJRlmMHh7R9MJZWXp/r73DzINVQ== +"@typescript-eslint/parser@7.1.1": + version "7.1.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-7.1.1.tgz#6a9d0a5c9ccdf5dbd3cb8c949728c64e24e07d1f" + integrity sha512-ZWUFyL0z04R1nAEgr9e79YtV5LbafdOtN7yapNbn1ansMyaegl2D4bL7vHoJ4HPSc4CaLwuCVas8CVuneKzplQ== dependencies: - "@typescript-eslint/scope-manager" "6.19.1" - "@typescript-eslint/types" "6.19.1" - "@typescript-eslint/typescript-estree" "6.19.1" - "@typescript-eslint/visitor-keys" "6.19.1" + "@typescript-eslint/scope-manager" "7.1.1" + "@typescript-eslint/types" "7.1.1" + "@typescript-eslint/typescript-estree" "7.1.1" + "@typescript-eslint/visitor-keys" "7.1.1" debug "^4.3.4" "@typescript-eslint/scope-manager@6.19.1": @@ -3610,13 +3856,21 @@ "@typescript-eslint/types" "6.19.1" "@typescript-eslint/visitor-keys" "6.19.1" -"@typescript-eslint/type-utils@6.19.1": - version "6.19.1" - resolved "https://registry.yarnpkg.com/@typescript-eslint/type-utils/-/type-utils-6.19.1.tgz#6a130e3afe605a4898e043fa9f72e96309b54935" - integrity sha512-0vdyld3ecfxJuddDjACUvlAeYNrHP/pDeQk2pWBR2ESeEzQhg52DF53AbI9QCBkYE23lgkhLCZNkHn2hEXXYIg== +"@typescript-eslint/scope-manager@7.1.1": + version "7.1.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-7.1.1.tgz#9e301803ff8e21a74f50c6f89a4baccad9a48f93" + integrity sha512-cirZpA8bJMRb4WZ+rO6+mnOJrGFDd38WoXCEI57+CYBqta8Yc8aJym2i7vyqLL1vVYljgw0X27axkUXz32T8TA== dependencies: - "@typescript-eslint/typescript-estree" "6.19.1" - "@typescript-eslint/utils" "6.19.1" + "@typescript-eslint/types" "7.1.1" + "@typescript-eslint/visitor-keys" "7.1.1" + +"@typescript-eslint/type-utils@7.1.1": + version "7.1.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/type-utils/-/type-utils-7.1.1.tgz#aee820d5bedd39b83c18585a526cc520ddb7a226" + integrity sha512-5r4RKze6XHEEhlZnJtR3GYeCh1IueUHdbrukV2KSlLXaTjuSfeVF8mZUVPLovidCuZfbVjfhi4c0DNSa/Rdg5g== + dependencies: + "@typescript-eslint/typescript-estree" "7.1.1" + "@typescript-eslint/utils" "7.1.1" debug "^4.3.4" ts-api-utils "^1.0.1" @@ -3625,6 +3879,11 @@ resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-6.19.1.tgz#2d4c9d492a63ede15e7ba7d129bdf7714b77f771" integrity sha512-6+bk6FEtBhvfYvpHsDgAL3uo4BfvnTnoge5LrrCj2eJN8g3IJdLTD4B/jK3Q6vo4Ql/Hoip9I8aB6fF+6RfDqg== +"@typescript-eslint/types@7.1.1": + version "7.1.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-7.1.1.tgz#ca33ba7cf58224fb46a84fea62593c2c53cd795f" + integrity sha512-KhewzrlRMrgeKm1U9bh2z5aoL4s7K3tK5DwHDn8MHv0yQfWFz/0ZR6trrIHHa5CsF83j/GgHqzdbzCXJ3crx0Q== + "@typescript-eslint/typescript-estree@6.19.1": version "6.19.1" resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-6.19.1.tgz#796d88d88882f12e85bb33d6d82d39e1aea54ed1" @@ -3639,7 +3898,34 @@ semver "^7.5.4" ts-api-utils "^1.0.1" -"@typescript-eslint/utils@6.19.1", "@typescript-eslint/utils@^6.19.0": +"@typescript-eslint/typescript-estree@7.1.1": + version "7.1.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-7.1.1.tgz#09c54af0151a1b05d0875c0fc7fe2ec7a2476ece" + integrity sha512-9ZOncVSfr+sMXVxxca2OJOPagRwT0u/UHikM2Rd6L/aB+kL/QAuTnsv6MeXtjzCJYb8PzrXarypSGIPx3Jemxw== + dependencies: + "@typescript-eslint/types" "7.1.1" + "@typescript-eslint/visitor-keys" "7.1.1" + debug "^4.3.4" + globby "^11.1.0" + is-glob "^4.0.3" + minimatch "9.0.3" + semver "^7.5.4" + ts-api-utils "^1.0.1" + +"@typescript-eslint/utils@7.1.1": + version "7.1.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/utils/-/utils-7.1.1.tgz#bdeeb789eee4af5d3fb5400a69566d4dbf97ff3b" + integrity sha512-thOXM89xA03xAE0lW7alstvnyoBUbBX38YtY+zAUcpRPcq9EIhXPuJ0YTv948MbzmKh6e1AUszn5cBFK49Umqg== + dependencies: + "@eslint-community/eslint-utils" "^4.4.0" + "@types/json-schema" "^7.0.12" + "@types/semver" "^7.5.0" + "@typescript-eslint/scope-manager" "7.1.1" + "@typescript-eslint/types" "7.1.1" + "@typescript-eslint/typescript-estree" "7.1.1" + semver "^7.5.4" + +"@typescript-eslint/utils@^6.19.0": version "6.19.1" resolved "https://registry.yarnpkg.com/@typescript-eslint/utils/-/utils-6.19.1.tgz#df93497f9cfddde2bcc2a591da80536e68acd151" integrity sha512-JvjfEZuP5WoMqwh9SPAPDSHSg9FBHHGhjPugSRxu5jMfjvBpq5/sGTD+9M9aQ5sh6iJ8AY/Kk/oUYVEMAPwi7w== @@ -3660,6 +3946,14 @@ "@typescript-eslint/types" "6.19.1" eslint-visitor-keys "^3.4.1" +"@typescript-eslint/visitor-keys@7.1.1": + version "7.1.1" + resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-7.1.1.tgz#e6538a58c9b157f03bcbb29e3b6a92fe39a6ab0d" + integrity sha512-yTdHDQxY7cSoCcAtiBzVzxleJhkGB9NncSIyMYe2+OGON1ZsP9zOPws/Pqgopa65jvknOjlk/w7ulPlZ78PiLQ== + dependencies: + "@typescript-eslint/types" "7.1.1" + eslint-visitor-keys "^3.4.1" + "@ungap/structured-clone@^1.2.0": version "1.2.0" resolved "https://registry.yarnpkg.com/@ungap/structured-clone/-/structured-clone-1.2.0.tgz#756641adb587851b5ccb3e095daf27ae581c8406" @@ -4032,6 +4326,14 @@ array-buffer-byte-length@^1.0.0: call-bind "^1.0.2" is-array-buffer "^3.0.1" +array-buffer-byte-length@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/array-buffer-byte-length/-/array-buffer-byte-length-1.0.1.tgz#1e5583ec16763540a27ae52eed99ff899223568f" + integrity sha512-ahC5W1xgou+KTXix4sAO8Ki12Q+jf4i0+tmk3sC+zgcynshkHxzpXdImBehiUYKKKDwvfFiJl1tZt6ewscS1Mg== + dependencies: + call-bind "^1.0.5" + is-array-buffer "^3.0.4" + array-flatten@1.1.1: version "1.1.1" resolved "https://registry.yarnpkg.com/array-flatten/-/array-flatten-1.1.1.tgz#9a5f699051b1e7073328f2a008968b64ea2955d2" @@ -4053,6 +4355,17 @@ array-union@^2.1.0: resolved "https://registry.yarnpkg.com/array-union/-/array-union-2.1.0.tgz#b798420adbeb1de828d84acd8a2e23d3efe85e8d" integrity sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw== +array.prototype.findlast@^1.2.4: + version "1.2.4" + resolved "https://registry.yarnpkg.com/array.prototype.findlast/-/array.prototype.findlast-1.2.4.tgz#eeb9e45fc894055c82e5675c463e8077b827ad36" + integrity sha512-BMtLxpV+8BD+6ZPFIWmnUBpQoy+A+ujcg4rhp2iwCRJYA7PEh2MS4NL3lz8EiDlLrJPp2hg9qWihr5pd//jcGw== + dependencies: + call-bind "^1.0.5" + define-properties "^1.2.1" + es-abstract "^1.22.3" + es-errors "^1.3.0" + es-shim-unscopables "^1.0.2" + array.prototype.findlastindex@^1.2.3: version "1.2.3" resolved "https://registry.yarnpkg.com/array.prototype.findlastindex/-/array.prototype.findlastindex-1.2.3.tgz#b37598438f97b579166940814e2c0493a4f50207" @@ -4074,7 +4387,7 @@ array.prototype.flat@^1.3.1, array.prototype.flat@^1.3.2: es-abstract "^1.22.1" es-shim-unscopables "^1.0.0" -array.prototype.flatmap@^1.3.1, array.prototype.flatmap@^1.3.2: +array.prototype.flatmap@^1.3.2: version "1.3.2" resolved "https://registry.yarnpkg.com/array.prototype.flatmap/-/array.prototype.flatmap-1.3.2.tgz#c9a7c6831db8e719d6ce639190146c24bbd3e527" integrity sha512-Ewyx0c9PmpcsByhSW4r+9zDU7sGjFc86qf/kKtuSCRdhfbk0SNLLkaT5qvcHnRGgc5NP/ly/y+qkXkqONX54CQ== @@ -4084,16 +4397,26 @@ array.prototype.flatmap@^1.3.1, array.prototype.flatmap@^1.3.2: es-abstract "^1.22.1" es-shim-unscopables "^1.0.0" -array.prototype.tosorted@^1.1.1: +array.prototype.toreversed@^1.1.2: version "1.1.2" - resolved "https://registry.yarnpkg.com/array.prototype.tosorted/-/array.prototype.tosorted-1.1.2.tgz#620eff7442503d66c799d95503f82b475745cefd" - integrity sha512-HuQCHOlk1Weat5jzStICBCd83NxiIMwqDg/dHEsoefabn/hJRj5pVdWcPUSpRrwhwxZOsQassMpgN/xRYFBMIg== + resolved "https://registry.yarnpkg.com/array.prototype.toreversed/-/array.prototype.toreversed-1.1.2.tgz#b989a6bf35c4c5051e1dc0325151bf8088954eba" + integrity sha512-wwDCoT4Ck4Cz7sLtgUmzR5UV3YF5mFHUlbChCzZBQZ+0m2cl/DH3tKgvphv1nKgFsJ48oCSg6p91q2Vm0I/ZMA== dependencies: call-bind "^1.0.2" define-properties "^1.2.0" es-abstract "^1.22.1" es-shim-unscopables "^1.0.0" - get-intrinsic "^1.2.1" + +array.prototype.tosorted@^1.1.3: + version "1.1.3" + resolved "https://registry.yarnpkg.com/array.prototype.tosorted/-/array.prototype.tosorted-1.1.3.tgz#c8c89348337e51b8a3c48a9227f9ce93ceedcba8" + integrity sha512-/DdH4TiTmOKzyQbp/eadcCVexiCb36xJg7HshYOYJnNZFDj33GEv0P7GxsynpShhq4OLYJzbGcBDkLsDt7MnNg== + dependencies: + call-bind "^1.0.5" + define-properties "^1.2.1" + es-abstract "^1.22.3" + es-errors "^1.1.0" + es-shim-unscopables "^1.0.2" arraybuffer.prototype.slice@^1.0.2: version "1.0.2" @@ -4108,6 +4431,20 @@ arraybuffer.prototype.slice@^1.0.2: is-array-buffer "^3.0.2" is-shared-array-buffer "^1.0.2" +arraybuffer.prototype.slice@^1.0.3: + version "1.0.3" + resolved "https://registry.yarnpkg.com/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.3.tgz#097972f4255e41bc3425e37dc3f6421cf9aefde6" + integrity sha512-bMxMKAjg13EBSVscxTaYA4mRc5t1UAXa2kXiGTNfZ079HIWXEkKmkgFrh/nJqamaLSrXO5H4WFFkPEaLJWbs3A== + dependencies: + array-buffer-byte-length "^1.0.1" + call-bind "^1.0.5" + define-properties "^1.2.1" + es-abstract "^1.22.3" + es-errors "^1.2.1" + get-intrinsic "^1.2.3" + is-array-buffer "^3.0.4" + is-shared-array-buffer "^1.0.2" + assert@^2.0.0, assert@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/assert/-/assert-2.1.0.tgz#6d92a238d05dc02e7427c881fb8be81c8448b2dd" @@ -4158,6 +4495,13 @@ available-typed-arrays@^1.0.5: resolved "https://registry.yarnpkg.com/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz#92f95616501069d07d10edb2fc37d3e1c65123b7" integrity sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw== +available-typed-arrays@^1.0.6, available-typed-arrays@^1.0.7: + version "1.0.7" + resolved "https://registry.yarnpkg.com/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz#a5cc375d6a03c2efc87a553f3e0b1522def14846" + integrity sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ== + dependencies: + possible-typed-array-names "^1.0.0" + babel-code-frame@^6.26.0: version "6.26.0" resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.26.0.tgz#63fd43f7dc1e3bb7ce35947db8fe369a3f58c74b" @@ -4265,7 +4609,7 @@ babel-plugin-module-resolver@5.0.0: reselect "^4.1.7" resolve "^1.22.1" -babel-plugin-polyfill-corejs2@^0.4.7: +babel-plugin-polyfill-corejs2@^0.4.7, babel-plugin-polyfill-corejs2@^0.4.8: version "0.4.8" resolved "https://registry.yarnpkg.com/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.4.8.tgz#dbcc3c8ca758a290d47c3c6a490d59429b0d2269" integrity sha512-OtIuQfafSzpo/LhnJaykc0R/MMnuLSSVjVYy9mHArIZ9qTCSZ6TpWCuEKZYVoN//t8HqBNScHrOtCrIK5IaGLg== @@ -4282,7 +4626,15 @@ babel-plugin-polyfill-corejs3@^0.8.7: "@babel/helper-define-polyfill-provider" "^0.4.4" core-js-compat "^3.33.1" -babel-plugin-polyfill-regenerator@^0.5.4: +babel-plugin-polyfill-corejs3@^0.9.0: + version "0.9.0" + resolved "https://registry.yarnpkg.com/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.9.0.tgz#9eea32349d94556c2ad3ab9b82ebb27d4bf04a81" + integrity sha512-7nZPG1uzK2Ymhy/NbaOWTg3uibM2BmGASS4vHS4szRZAIR8R6GwA/xAujpdrXU5iyklrimWnLWU+BLF9suPTqg== + dependencies: + "@babel/helper-define-polyfill-provider" "^0.5.0" + core-js-compat "^3.34.0" + +babel-plugin-polyfill-regenerator@^0.5.4, babel-plugin-polyfill-regenerator@^0.5.5: version "0.5.5" resolved "https://registry.yarnpkg.com/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.5.5.tgz#8b0c8fc6434239e5d7b8a9d1f832bb2b0310f06a" integrity sha512-OJGYZlhLqBh2DDHeqAxWB1XIvr49CxiJ2gIt61/PU55CQK4Z58OzMqjDe1zwQdQk+rBYsRc+1rJmdajM3gimHg== @@ -4507,6 +4859,16 @@ browserslist@^4.21.10, browserslist@^4.22.2: node-releases "^2.0.14" update-browserslist-db "^1.0.13" +browserslist@^4.22.3: + version "4.23.0" + resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.23.0.tgz#8f3acc2bbe73af7213399430890f86c63a5674ab" + integrity sha512-QW8HiM1shhT2GuzkvklfjcKDiWFXHOeFCIA/huJPwHsslwcydgk7X+z2zXpEijP98UCY7HbubZt5J2Zgvf0CaQ== + dependencies: + caniuse-lite "^1.0.30001587" + electron-to-chromium "^1.4.668" + node-releases "^2.0.14" + update-browserslist-db "^1.0.13" + bs-logger@0.x: version "0.2.6" resolved "https://registry.yarnpkg.com/bs-logger/-/bs-logger-0.2.6.tgz#eb7d365307a72cf974cc6cda76b68354ad336bd8" @@ -4563,6 +4925,17 @@ call-bind@^1.0.0, call-bind@^1.0.2, call-bind@^1.0.4, call-bind@^1.0.5: get-intrinsic "^1.2.1" set-function-length "^1.1.1" +call-bind@^1.0.6, call-bind@^1.0.7: + version "1.0.7" + resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.7.tgz#06016599c40c56498c18769d2730be242b6fa3b9" + integrity sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w== + dependencies: + es-define-property "^1.0.0" + es-errors "^1.3.0" + function-bind "^1.1.2" + get-intrinsic "^1.2.4" + set-function-length "^1.2.1" + callsites@^3.0.0: version "3.1.0" resolved "https://registry.yarnpkg.com/callsites/-/callsites-3.1.0.tgz#b3630abd8943432f54b3f0519238e33cd7df2f73" @@ -4596,6 +4969,11 @@ caniuse-lite@^1.0.30001565: resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001580.tgz#e3c76bc6fe020d9007647044278954ff8cd17d1e" integrity sha512-mtj5ur2FFPZcCEpXFy8ADXbDACuNFXg6mxVDqp7tqooX6l3zwm+d8EPoeOSIFRDvHs8qu7/SLFOGniULkcH2iA== +caniuse-lite@^1.0.30001587: + version "1.0.30001594" + resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001594.tgz#bea552414cd52c2d0c985ed9206314a696e685f5" + integrity sha512-VblSX6nYqyJVs8DKFMldE2IVCJjZ225LW00ydtUWwh5hk9IfkTOffO6r8gJNsH0qqqeAF8KrbMYA2VEwTlGW5g== + canvg@^3.0.6: version "3.0.10" resolved "https://registry.yarnpkg.com/canvg/-/canvg-3.0.10.tgz#8e52a2d088b6ffa23ac78970b2a9eebfae0ef4b3" @@ -4926,6 +5304,13 @@ core-js-compat@^3.31.0, core-js-compat@^3.33.1: dependencies: browserslist "^4.22.2" +core-js-compat@^3.34.0: + version "3.36.0" + resolved "https://registry.yarnpkg.com/core-js-compat/-/core-js-compat-3.36.0.tgz#087679119bc2fdbdefad0d45d8e5d307d45ba190" + integrity sha512-iV9Pd/PsgjNWBXeq8XRtWVSgz2tKAfhfvBs7qxYty+RlRd+OCksaWmOnc4JKrTc1cToXL1N0s3l/vwlxPtdElw== + dependencies: + browserslist "^4.22.3" + core-js-pure@^3.23.3: version "3.35.1" resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.35.1.tgz#f33ad7fdf9dddae260339a30e5f8363f5c49a3bc" @@ -5082,7 +5467,7 @@ csstype@^2.5.2: resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.21.tgz#2efb85b7cc55c80017c66a5ad7cbd931fda3a90e" integrity sha512-Z1PhmomIfypOpoMjRQB70jfvy/wxT50qW08YXO5lMIJkrdq4yOTR+AW7FqutScmB9NkLwxo+jU+kZLbofZZq/w== -csstype@^3.0.2, csstype@^3.1.2: +csstype@^3.0.2, csstype@^3.1.3: version "3.1.3" resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.3.tgz#d80ff294d114fb0e6ac500fbf85b60137d7eff81" integrity sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw== @@ -5212,6 +5597,15 @@ define-data-property@^1.0.1, define-data-property@^1.1.1: gopd "^1.0.1" has-property-descriptors "^1.0.0" +define-data-property@^1.1.2: + version "1.1.4" + resolved "https://registry.yarnpkg.com/define-data-property/-/define-data-property-1.1.4.tgz#894dc141bb7d3060ae4366f6a0107e68fbe48c5e" + integrity sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A== + dependencies: + es-define-property "^1.0.0" + es-errors "^1.3.0" + gopd "^1.0.1" + define-lazy-prop@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/define-lazy-prop/-/define-lazy-prop-2.0.0.tgz#3f7ae421129bcaaac9bc74905c98a0009ec9ee7f" @@ -5433,6 +5827,11 @@ electron-to-chromium@^1.4.601: resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.645.tgz#117f964252eb2f0ff00fc7360cb3080e2cf66e3c" integrity sha512-EeS1oQDCmnYsRDRy2zTeC336a/4LZ6WKqvSaM1jLocEk5ZuyszkQtCpsqvuvaIXGOUjwtvF6LTcS8WueibXvSw== +electron-to-chromium@^1.4.668: + version "1.4.693" + resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.693.tgz#001bb5dcb57ba404366ec39e1957d11886fc8a93" + integrity sha512-/if4Ueg0GUQlhCrW2ZlXwDAm40ipuKo+OgeHInlL8sbjt+hzISxZK949fZeJaVsheamrzANXvw1zQTvbxTvSHw== + emittery@^0.13.1: version "0.13.1" resolved "https://registry.yarnpkg.com/emittery/-/emittery-0.13.1.tgz#c04b8c3457490e0847ae51fced3af52d338e3dad" @@ -5556,6 +5955,65 @@ es-abstract@^1.22.1: unbox-primitive "^1.0.2" which-typed-array "^1.1.13" +es-abstract@^1.22.3, es-abstract@^1.22.4: + version "1.22.5" + resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.22.5.tgz#1417df4e97cc55f09bf7e58d1e614bc61cb8df46" + integrity sha512-oW69R+4q2wG+Hc3KZePPZxOiisRIqfKBVo/HLx94QcJeWGU/8sZhCvc829rd1kS366vlJbzBfXf9yWwf0+Ko7w== + dependencies: + array-buffer-byte-length "^1.0.1" + arraybuffer.prototype.slice "^1.0.3" + available-typed-arrays "^1.0.7" + call-bind "^1.0.7" + es-define-property "^1.0.0" + es-errors "^1.3.0" + es-set-tostringtag "^2.0.3" + es-to-primitive "^1.2.1" + function.prototype.name "^1.1.6" + get-intrinsic "^1.2.4" + get-symbol-description "^1.0.2" + globalthis "^1.0.3" + gopd "^1.0.1" + has-property-descriptors "^1.0.2" + has-proto "^1.0.3" + has-symbols "^1.0.3" + hasown "^2.0.1" + internal-slot "^1.0.7" + is-array-buffer "^3.0.4" + is-callable "^1.2.7" + is-negative-zero "^2.0.3" + is-regex "^1.1.4" + is-shared-array-buffer "^1.0.3" + is-string "^1.0.7" + is-typed-array "^1.1.13" + is-weakref "^1.0.2" + object-inspect "^1.13.1" + object-keys "^1.1.1" + object.assign "^4.1.5" + regexp.prototype.flags "^1.5.2" + safe-array-concat "^1.1.0" + safe-regex-test "^1.0.3" + string.prototype.trim "^1.2.8" + string.prototype.trimend "^1.0.7" + string.prototype.trimstart "^1.0.7" + typed-array-buffer "^1.0.2" + typed-array-byte-length "^1.0.1" + typed-array-byte-offset "^1.0.2" + typed-array-length "^1.0.5" + unbox-primitive "^1.0.2" + which-typed-array "^1.1.14" + +es-define-property@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/es-define-property/-/es-define-property-1.0.0.tgz#c7faefbdff8b2696cf5f46921edfb77cc4ba3845" + integrity sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ== + dependencies: + get-intrinsic "^1.2.4" + +es-errors@^1.1.0, es-errors@^1.2.1, es-errors@^1.3.0: + version "1.3.0" + resolved "https://registry.yarnpkg.com/es-errors/-/es-errors-1.3.0.tgz#05f75a25dab98e4fb1dcd5e1472c0546d5057c8f" + integrity sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw== + es-get-iterator@^1.1.3: version "1.1.3" resolved "https://registry.yarnpkg.com/es-get-iterator/-/es-get-iterator-1.1.3.tgz#3ef87523c5d464d41084b2c3c9c214f1199763d6" @@ -5571,25 +6029,26 @@ es-get-iterator@^1.1.3: isarray "^2.0.5" stop-iteration-iterator "^1.0.0" -es-iterator-helpers@^1.0.12: - version "1.0.15" - resolved "https://registry.yarnpkg.com/es-iterator-helpers/-/es-iterator-helpers-1.0.15.tgz#bd81d275ac766431d19305923707c3efd9f1ae40" - integrity sha512-GhoY8uYqd6iwUl2kgjTm4CZAf6oo5mHK7BPqx3rKgx893YSsy0LGHV6gfqqQvZt/8xM8xeOnfXBCfqclMKkJ5g== +es-iterator-helpers@^1.0.17: + version "1.0.17" + resolved "https://registry.yarnpkg.com/es-iterator-helpers/-/es-iterator-helpers-1.0.17.tgz#123d1315780df15b34eb181022da43e734388bb8" + integrity sha512-lh7BsUqelv4KUbR5a/ZTaGGIMLCjPGPqJ6q+Oq24YP0RdyptX1uzm4vvaqzk7Zx3bpl/76YLTTDj9L7uYQ92oQ== dependencies: asynciterator.prototype "^1.0.0" - call-bind "^1.0.2" + call-bind "^1.0.7" define-properties "^1.2.1" - es-abstract "^1.22.1" - es-set-tostringtag "^2.0.1" - function-bind "^1.1.1" - get-intrinsic "^1.2.1" + es-abstract "^1.22.4" + es-errors "^1.3.0" + es-set-tostringtag "^2.0.2" + function-bind "^1.1.2" + get-intrinsic "^1.2.4" globalthis "^1.0.3" - has-property-descriptors "^1.0.0" + has-property-descriptors "^1.0.2" has-proto "^1.0.1" has-symbols "^1.0.3" - internal-slot "^1.0.5" + internal-slot "^1.0.7" iterator.prototype "^1.1.2" - safe-array-concat "^1.0.1" + safe-array-concat "^1.1.0" es-module-lexer@^1.2.1, es-module-lexer@^1.4.1: version "1.4.1" @@ -5605,7 +6064,16 @@ es-set-tostringtag@^2.0.1: has-tostringtag "^1.0.0" hasown "^2.0.0" -es-shim-unscopables@^1.0.0: +es-set-tostringtag@^2.0.2, es-set-tostringtag@^2.0.3: + version "2.0.3" + resolved "https://registry.yarnpkg.com/es-set-tostringtag/-/es-set-tostringtag-2.0.3.tgz#8bb60f0a440c2e4281962428438d58545af39777" + integrity sha512-3T8uNMC3OQTHkFUsFq8r/BwAXLHvU/9O9mE0fBc/MY5iq/8H7ncvO947LmYA6ldWw9Uh8Yhf25zu6n7nML5QWQ== + dependencies: + get-intrinsic "^1.2.4" + has-tostringtag "^1.0.2" + hasown "^2.0.1" + +es-shim-unscopables@^1.0.0, es-shim-unscopables@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/es-shim-unscopables/-/es-shim-unscopables-1.0.2.tgz#1f6942e71ecc7835ed1c8a83006d8771a63a3763" integrity sha512-J3yBRXCzDu4ULnQwxyToo/OjdMx6akgVC7K6few0a7F/0wLtmKKN7I73AH5T2836UuXRqN7Qg+IIUw/+YJksRw== @@ -5767,27 +6235,29 @@ eslint-plugin-react-hooks@4.6.0: resolved "https://registry.yarnpkg.com/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.0.tgz#4c3e697ad95b77e93f8646aaa1630c1ba607edd3" integrity sha512-oFc7Itz9Qxh2x4gNHStv3BqJq54ExXmfC+a1NjAta66IAN87Wu0R/QArgIS9qKzX3dXKPI9H5crl9QchNMY9+g== -eslint-plugin-react@7.33.2: - version "7.33.2" - resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.33.2.tgz#69ee09443ffc583927eafe86ffebb470ee737608" - integrity sha512-73QQMKALArI8/7xGLNI/3LylrEYrlKZSb5C9+q3OtOewTnMQi5cT+aE9E41sLCmli3I9PGGmD1yiZydyo4FEPw== +eslint-plugin-react@7.34.0: + version "7.34.0" + resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.34.0.tgz#ab71484d54fc409c37025c5eca00eb4177a5e88c" + integrity sha512-MeVXdReleBTdkz/bvcQMSnCXGi+c9kvy51IpinjnJgutl3YTHWsDdke7Z1ufZpGfDG8xduBDKyjtB9JH1eBKIQ== dependencies: - array-includes "^3.1.6" - array.prototype.flatmap "^1.3.1" - array.prototype.tosorted "^1.1.1" + array-includes "^3.1.7" + array.prototype.findlast "^1.2.4" + array.prototype.flatmap "^1.3.2" + array.prototype.toreversed "^1.1.2" + array.prototype.tosorted "^1.1.3" doctrine "^2.1.0" - es-iterator-helpers "^1.0.12" + es-iterator-helpers "^1.0.17" estraverse "^5.3.0" jsx-ast-utils "^2.4.1 || ^3.0.0" minimatch "^3.1.2" - object.entries "^1.1.6" - object.fromentries "^2.0.6" - object.hasown "^1.1.2" - object.values "^1.1.6" + object.entries "^1.1.7" + object.fromentries "^2.0.7" + object.hasown "^1.1.3" + object.values "^1.1.7" prop-types "^15.8.1" - resolve "^2.0.0-next.4" + resolve "^2.0.0-next.5" semver "^6.3.1" - string.prototype.matchall "^4.0.8" + string.prototype.matchall "^4.0.10" eslint-scope@5.1.1: version "5.1.1" @@ -5810,16 +6280,16 @@ eslint-visitor-keys@^3.3.0, eslint-visitor-keys@^3.4.1, eslint-visitor-keys@^3.4 resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz#0cd72fe8550e3c2eae156a96a4dddcd1c8ac5800" integrity sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag== -eslint@8.56.0: - version "8.56.0" - resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.56.0.tgz#4957ce8da409dc0809f99ab07a1b94832ab74b15" - integrity sha512-Go19xM6T9puCOWntie1/P997aXxFsOi37JIHRWI514Hc6ZnaHGKY9xFhrU65RT6CcBEzZoGG1e6Nq+DT04ZtZQ== +eslint@8.57.0: + version "8.57.0" + resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.57.0.tgz#c786a6fd0e0b68941aaf624596fb987089195668" + integrity sha512-dZ6+mexnaTIbSBZWgou51U6OmzIhYM2VcNdtiTtI7qPNZm35Akpr0f6vtw3w1Kmn5PYo+tZVfh13WrhpS6oLqQ== dependencies: "@eslint-community/eslint-utils" "^4.2.0" "@eslint-community/regexpp" "^4.6.1" "@eslint/eslintrc" "^2.1.4" - "@eslint/js" "8.56.0" - "@humanwhocodes/config-array" "^0.11.13" + "@eslint/js" "8.57.0" + "@humanwhocodes/config-array" "^0.11.14" "@humanwhocodes/module-importer" "^1.0.1" "@nodelib/fs.walk" "^1.2.8" "@ungap/structured-clone" "^1.2.0" @@ -6339,7 +6809,7 @@ fsevents@^2.3.2, fsevents@~2.3.2: resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.3.tgz#cac6407785d03675a2a5e1a5305c697b347d90d6" integrity sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw== -function-bind@^1.1.1, function-bind@^1.1.2: +function-bind@^1.1.2: version "1.1.2" resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.2.tgz#2c02d864d97f3ea6c8830c464cbd11ab6eab7a1c" integrity sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA== @@ -6379,6 +6849,17 @@ get-intrinsic@^1.0.2, get-intrinsic@^1.1.1, get-intrinsic@^1.1.3, get-intrinsic@ has-symbols "^1.0.3" hasown "^2.0.0" +get-intrinsic@^1.2.3, get-intrinsic@^1.2.4: + version "1.2.4" + resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.2.4.tgz#e385f5a4b5227d449c3eabbad05494ef0abbeadd" + integrity sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ== + dependencies: + es-errors "^1.3.0" + function-bind "^1.1.2" + has-proto "^1.0.1" + has-symbols "^1.0.3" + hasown "^2.0.0" + get-nonce@^1.0.0: version "1.0.1" resolved "https://registry.yarnpkg.com/get-nonce/-/get-nonce-1.0.1.tgz#fdf3f0278073820d2ce9426c18f07481b1e0cdf3" @@ -6417,6 +6898,15 @@ get-symbol-description@^1.0.0: call-bind "^1.0.2" get-intrinsic "^1.1.1" +get-symbol-description@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/get-symbol-description/-/get-symbol-description-1.0.2.tgz#533744d5aa20aca4e079c8e5daf7fd44202821f5" + integrity sha512-g0QYk1dZBxGwk+Ngc+ltRH2IBp2f7zBkBMBJZCDerh6EhlhSR6+9irMCuT/09zD6qkarHUSn529sK/yL4S27mg== + dependencies: + call-bind "^1.0.5" + es-errors "^1.3.0" + get-intrinsic "^1.2.4" + get-tsconfig@^4.5.0: version "4.7.2" resolved "https://registry.yarnpkg.com/get-tsconfig/-/get-tsconfig-4.7.2.tgz#0dcd6fb330391d46332f4c6c1bf89a6514c2ddce" @@ -6607,11 +7097,23 @@ has-property-descriptors@^1.0.0, has-property-descriptors@^1.0.1: dependencies: get-intrinsic "^1.2.2" +has-property-descriptors@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz#963ed7d071dc7bf5f084c5bfbe0d1b6222586854" + integrity sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg== + dependencies: + es-define-property "^1.0.0" + has-proto@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/has-proto/-/has-proto-1.0.1.tgz#1885c1305538958aff469fef37937c22795408e0" integrity sha512-7qE+iP+O+bgF9clE5+UoBFzE65mlBiVj3tKCrlNQ0Ogwm0BjpT/gK4SlLYDMybDh5I3TCTKnPPa0oMG7JDYrhg== +has-proto@^1.0.3: + version "1.0.3" + resolved "https://registry.yarnpkg.com/has-proto/-/has-proto-1.0.3.tgz#b31ddfe9b0e6e9914536a6ab286426d0214f77fd" + integrity sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q== + has-symbols@^1.0.2, has-symbols@^1.0.3: version "1.0.3" resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.3.tgz#bb7b2c4349251dce87b125f7bdf874aa7c8b39f8" @@ -6624,6 +7126,13 @@ has-tostringtag@^1.0.0: dependencies: has-symbols "^1.0.2" +has-tostringtag@^1.0.1, has-tostringtag@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/has-tostringtag/-/has-tostringtag-1.0.2.tgz#2cdc42d40bef2e5b4eeab7c01a73c54ce7ab5abc" + integrity sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw== + dependencies: + has-symbols "^1.0.3" + hasown@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/hasown/-/hasown-2.0.0.tgz#f4c513d454a57b7c7e1650778de226b11700546c" @@ -6631,6 +7140,13 @@ hasown@^2.0.0: dependencies: function-bind "^1.1.2" +hasown@^2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/hasown/-/hasown-2.0.1.tgz#26f48f039de2c0f8d3356c223fb8d50253519faa" + integrity sha512-1/th4MHjnwncwXsIW6QMzlvYL9kG5e/CpVvLRZe4XPa8TOUNbCELqmvhDmnkNsAjwaG4+I8gJJL0JBvTTLO9qA== + dependencies: + function-bind "^1.1.2" + he@^1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f" @@ -6854,6 +7370,15 @@ internal-slot@^1.0.4, internal-slot@^1.0.5: hasown "^2.0.0" side-channel "^1.0.4" +internal-slot@^1.0.7: + version "1.0.7" + resolved "https://registry.yarnpkg.com/internal-slot/-/internal-slot-1.0.7.tgz#c06dcca3ed874249881007b0a5523b172a190802" + integrity sha512-NGnrKwXzSms2qUUih/ILZ5JBqNTSa1+ZmP6flaIp6KmSElgE9qdndzS3cqjrDovwFdmwsGsLdeFgB6suw+1e9g== + dependencies: + es-errors "^1.3.0" + hasown "^2.0.0" + side-channel "^1.0.4" + invariant@^2.2.2, invariant@^2.2.4: version "2.2.4" resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6" @@ -6861,10 +7386,10 @@ invariant@^2.2.2, invariant@^2.2.4: dependencies: loose-envify "^1.0.0" -ip@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/ip/-/ip-2.0.0.tgz#4cf4ab182fee2314c75ede1276f8c80b479936da" - integrity sha512-WKa+XuLG1A1R0UWhl2+1XQSi+fZWMsYKffMZTTYsiZaUD8k2yDAj5atimTUD2TZkyCkNEeYE5NhFZmupOGtjYQ== +ip@^2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/ip/-/ip-2.0.1.tgz#e8f3595d33a3ea66490204234b77636965307105" + integrity sha512-lJUL9imLTNi1ZfXT+DU6rBBdbiKGBuay9B6xGSPVjUeQwaH1RIGqef8RZkUtHioLmSNpPR5M4HVKJGm1j8FWVQ== ipaddr.js@1.9.1: version "1.9.1" @@ -6893,6 +7418,14 @@ is-array-buffer@^3.0.1, is-array-buffer@^3.0.2: get-intrinsic "^1.2.0" is-typed-array "^1.1.10" +is-array-buffer@^3.0.4: + version "3.0.4" + resolved "https://registry.yarnpkg.com/is-array-buffer/-/is-array-buffer-3.0.4.tgz#7a1f92b3d61edd2bc65d24f130530ea93d7fae98" + integrity sha512-wcjaerHw0ydZwfhiKbXJWLDY8A7yV7KhjQOpb83hGgGfId/aQa4TOvwyzn2PuswW2gPCYEL/nEAiSVpdOj1lXw== + dependencies: + call-bind "^1.0.2" + get-intrinsic "^1.2.1" + is-arrayish@^0.2.1: version "0.2.1" resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d" @@ -7044,6 +7577,11 @@ is-negative-zero@^2.0.2: resolved "https://registry.yarnpkg.com/is-negative-zero/-/is-negative-zero-2.0.2.tgz#7bf6f03a28003b8b3965de3ac26f664d765f3150" integrity sha512-dqJvarLawXsFbNDeJW7zAz8ItJ9cd28YufuuFzh0G8pNHjJMnY08Dv7sYX2uF5UpQOwieAeOExEYAWWfu7ZZUA== +is-negative-zero@^2.0.3: + version "2.0.3" + resolved "https://registry.yarnpkg.com/is-negative-zero/-/is-negative-zero-2.0.3.tgz#ced903a027aca6381b777a5743069d7376a49747" + integrity sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw== + is-number-object@^1.0.4: version "1.0.7" resolved "https://registry.yarnpkg.com/is-number-object/-/is-number-object-1.0.7.tgz#59d50ada4c45251784e9904f5246c742f07a42fc" @@ -7103,6 +7641,13 @@ is-shared-array-buffer@^1.0.2: dependencies: call-bind "^1.0.2" +is-shared-array-buffer@^1.0.3: + version "1.0.3" + resolved "https://registry.yarnpkg.com/is-shared-array-buffer/-/is-shared-array-buffer-1.0.3.tgz#1237f1cba059cdb62431d378dcc37d9680181688" + integrity sha512-nA2hv5XIhLR3uVzDDfCIknerhx8XUKnstuOERPNNIinXG7v9u+ohXF67vxm4TPTEPU6lm61ZkwP3c9PCB97rhg== + dependencies: + call-bind "^1.0.7" + is-stream@^2.0.0: version "2.0.1" resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-2.0.1.tgz#fac1e3d53b97ad5a9d0ae9cef2389f5810a5c077" @@ -7134,6 +7679,13 @@ is-typed-array@^1.1.10, is-typed-array@^1.1.12, is-typed-array@^1.1.3, is-typed- dependencies: which-typed-array "^1.1.11" +is-typed-array@^1.1.13: + version "1.1.13" + resolved "https://registry.yarnpkg.com/is-typed-array/-/is-typed-array-1.1.13.tgz#d6c5ca56df62334959322d7d7dd1cca50debe229" + integrity sha512-uZ25/bUAlUY5fR4OKT4rZQEBrzQWYV9ZJYGGsUmEJ6thodVJ1HX64ePQ6Z0qPWP+m+Uq6e9UugrE38jeYsDSMw== + dependencies: + which-typed-array "^1.1.14" + is-unicode-supported@^0.1.0: version "0.1.0" resolved "https://registry.yarnpkg.com/is-unicode-supported/-/is-unicode-supported-0.1.0.tgz#3f26c76a809593b52bfa2ecb5710ed2779b522a7" @@ -8458,7 +9010,7 @@ object-keys@^1.1.1: resolved "https://registry.yarnpkg.com/object-keys/-/object-keys-1.1.1.tgz#1c47f272df277f3b1daf061677d9c82e2322c60e" integrity sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA== -object.assign@^4.1.4: +object.assign@^4.1.4, object.assign@^4.1.5: version "4.1.5" resolved "https://registry.yarnpkg.com/object.assign/-/object.assign-4.1.5.tgz#3a833f9ab7fdb80fc9e8d2300c803d216d8fdbb0" integrity sha512-byy+U7gp+FVwmyzKPYhW2h5l3crpmGsxl7X2s8y43IgxvG4g3QZ6CffDtsNQy1WsmZpQbO+ybo0AlW7TY6DcBQ== @@ -8468,7 +9020,7 @@ object.assign@^4.1.4: has-symbols "^1.0.3" object-keys "^1.1.1" -object.entries@^1.1.6: +object.entries@^1.1.7: version "1.1.7" resolved "https://registry.yarnpkg.com/object.entries/-/object.entries-1.1.7.tgz#2b47760e2a2e3a752f39dd874655c61a7f03c131" integrity sha512-jCBs/0plmPsOnrKAfFQXRG2NFjlhZgjjcBLSmTnEhU8U6vVTsVe8ANeQJCHTl3gSsI4J+0emOoCgoKlmQPMgmA== @@ -8477,7 +9029,7 @@ object.entries@^1.1.6: define-properties "^1.2.0" es-abstract "^1.22.1" -object.fromentries@^2.0.6, object.fromentries@^2.0.7: +object.fromentries@^2.0.7: version "2.0.7" resolved "https://registry.yarnpkg.com/object.fromentries/-/object.fromentries-2.0.7.tgz#71e95f441e9a0ea6baf682ecaaf37fa2a8d7e616" integrity sha512-UPbPHML6sL8PI/mOqPwsH4G6iyXcCGzLin8KvEPenOZN5lpCNBZZQ+V62vdjB1mQHrmqGQt5/OJzemUA+KJmEA== @@ -8496,7 +9048,7 @@ object.groupby@^1.0.1: es-abstract "^1.22.1" get-intrinsic "^1.2.1" -object.hasown@^1.1.2: +object.hasown@^1.1.3: version "1.1.3" resolved "https://registry.yarnpkg.com/object.hasown/-/object.hasown-1.1.3.tgz#6a5f2897bb4d3668b8e79364f98ccf971bda55ae" integrity sha512-fFI4VcYpRHvSLXxP7yiZOMAd331cPfd2p7PFDVbgUsYOfCT3tICVqXWngbjr4m49OvsBwUBQ6O2uQoJvy3RexA== @@ -8852,6 +9404,11 @@ popper.js@1.16.1-lts: resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.16.1-lts.tgz#cf6847b807da3799d80ee3d6d2f90df8a3f50b05" integrity sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA== +possible-typed-array-names@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/possible-typed-array-names/-/possible-typed-array-names-1.0.0.tgz#89bb63c6fada2c3e90adc4a647beeeb39cc7bf8f" + integrity sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q== + postcss-modules-extract-imports@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz#cda1f047c0ae80c97dbe28c3e76a43b88025741d" @@ -8923,10 +9480,10 @@ prettier-linter-helpers@^1.0.0: dependencies: fast-diff "^1.1.2" -prettier@3.2.4: - version "3.2.4" - resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.2.4.tgz#4723cadeac2ce7c9227de758e5ff9b14e075f283" - integrity sha512-FWu1oLHKCrtpO1ypU6J0SbK2d9Ckwysq6bHj/uaCP26DxrPpppCLQRGVuqAxSTvhF00AcvDRyYrLNW7ocBhFFQ== +prettier@3.2.5: + version "3.2.5" + resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.2.5.tgz#e52bc3090586e824964a8813b09aba6233b28368" + integrity sha512-3/GWa9aOC0YeD7LUfvOG2NiDyhOWRvt1k+rcKhOuYnMY24iiCphgneUfJDyFXd6rZCAnuLBv6UeAULtrhT/F4A== prettier@^2.8.0: version "2.8.8" @@ -9227,10 +9784,10 @@ react-is@^18.0.0, react-is@^18.2.0: resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.2.0.tgz#199431eeaaa2e09f86427efbb4f1473edb47609b" integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w== -react-loading-skeleton@3.3.1: - version "3.3.1" - resolved "https://registry.yarnpkg.com/react-loading-skeleton/-/react-loading-skeleton-3.3.1.tgz#cd6e3a626ee86c76a46c14e2379243f2f8834e1b" - integrity sha512-NilqqwMh2v9omN7LteiDloEVpFyMIa0VGqF+ukqp0ncVlYu1sKYbYGX9JEl+GtOT9TKsh04zCHAbavnQ2USldA== +react-loading-skeleton@3.4.0: + version "3.4.0" + resolved "https://registry.yarnpkg.com/react-loading-skeleton/-/react-loading-skeleton-3.4.0.tgz#c71a3a17259d08e4064974aa0b07f150a09dfd57" + integrity sha512-1oJEBc9+wn7BbkQQk7YodlYEIjgeR+GrRjD+QXkVjwZN7LGIcAFHrx4NhT7UHGBxNY1+zax3c+Fo6XQM4R7CgA== react-number-format@4.4.1: version "4.4.1" @@ -9422,6 +9979,16 @@ regexp.prototype.flags@^1.5.0, regexp.prototype.flags@^1.5.1: define-properties "^1.2.0" set-function-name "^2.0.0" +regexp.prototype.flags@^1.5.2: + version "1.5.2" + resolved "https://registry.yarnpkg.com/regexp.prototype.flags/-/regexp.prototype.flags-1.5.2.tgz#138f644a3350f981a858c44f6bb1a61ff59be334" + integrity sha512-NcDiDkTLuPR+++OCKB0nWafEmhg/Da8aUPLPMQbK+bxKKCm1/S5he+AqYa4PlMCVBalb4/yxIRub6qkEx5yJbw== + dependencies: + call-bind "^1.0.6" + define-properties "^1.2.1" + es-errors "^1.3.0" + set-function-name "^2.0.1" + regexpu-core@^5.3.1: version "5.3.2" resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-5.3.2.tgz#11a2b06884f3527aec3e93dbbf4a3b958a95546b" @@ -9533,7 +10100,7 @@ resolve@^1.10.0, resolve@^1.14.2, resolve@^1.19.0, resolve@^1.20.0, resolve@^1.2 path-parse "^1.0.7" supports-preserve-symlinks-flag "^1.0.0" -resolve@^2.0.0-next.4: +resolve@^2.0.0-next.5: version "2.0.0-next.5" resolved "https://registry.yarnpkg.com/resolve/-/resolve-2.0.0-next.5.tgz#6b0ec3107e671e52b68cd068ef327173b90dc03c" integrity sha512-U7WjGVG9sH8tvjW5SmGbQuui75FiyjAX72HX15DwBBwF9dNiQZRQAg9nnPhYy+TUnE0+VcrttuvNI8oSxZcocA== @@ -9595,7 +10162,7 @@ run-parallel@^1.1.9: dependencies: queue-microtask "^1.2.2" -safe-array-concat@^1.0.1: +safe-array-concat@^1.0.1, safe-array-concat@^1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/safe-array-concat/-/safe-array-concat-1.1.0.tgz#8d0cae9cb806d6d1c06e08ab13d847293ebe0692" integrity sha512-ZdQ0Jeb9Ofti4hbt5lX3T2JcAamT9hfzYU1MNB+z/jaEbB6wfFfPIR/zEORmZqobkCCJhSjodobH6WHNmJ97dg== @@ -9624,6 +10191,15 @@ safe-regex-test@^1.0.0: get-intrinsic "^1.2.2" is-regex "^1.1.4" +safe-regex-test@^1.0.3: + version "1.0.3" + resolved "https://registry.yarnpkg.com/safe-regex-test/-/safe-regex-test-1.0.3.tgz#a5b4c0f06e0ab50ea2c395c14d8371232924c377" + integrity sha512-CdASjNJPvRa7roO6Ra/gLYBTzYzzPyyBXxIMdGW3USQLyjWEls2RgW5UBTXaQVp+OrpeCK3bLem8smtmheoRuw== + dependencies: + call-bind "^1.0.6" + es-errors "^1.3.0" + is-regex "^1.1.4" + "safer-buffer@>= 2.1.2 < 3", "safer-buffer@>= 2.1.2 < 3.0.0": version "2.1.2" resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a" @@ -9726,6 +10302,18 @@ set-function-length@^1.1.1: gopd "^1.0.1" has-property-descriptors "^1.0.1" +set-function-length@^1.2.1: + version "1.2.1" + resolved "https://registry.yarnpkg.com/set-function-length/-/set-function-length-1.2.1.tgz#47cc5945f2c771e2cf261c6737cf9684a2a5e425" + integrity sha512-j4t6ccc+VsKwYHso+kElc5neZpjtq9EnRICFZtWyBsLojhmeF/ZBd/elqm22WJh/BziDe/SBiOeAt0m2mfLD0g== + dependencies: + define-data-property "^1.1.2" + es-errors "^1.3.0" + function-bind "^1.1.2" + get-intrinsic "^1.2.3" + gopd "^1.0.1" + has-property-descriptors "^1.0.1" + set-function-name@^2.0.0, set-function-name@^2.0.1: version "2.0.1" resolved "https://registry.yarnpkg.com/set-function-name/-/set-function-name-2.0.1.tgz#12ce38b7954310b9f61faa12701620a0c882793a" @@ -9909,12 +10497,12 @@ store2@^2.14.2: resolved "https://registry.yarnpkg.com/store2/-/store2-2.14.2.tgz#56138d200f9fe5f582ad63bc2704dbc0e4a45068" integrity sha512-siT1RiqlfQnGqgT/YzXVUNsom9S0H1OX+dpdGN1xkyYATo4I6sep5NmsRD/40s3IIOvlCq6akxkqG82urIZW1w== -storybook@7.6.10: - version "7.6.10" - resolved "https://registry.yarnpkg.com/storybook/-/storybook-7.6.10.tgz#2185d26cd7b43390e3e2c7581586e2f60cdbd9bd" - integrity sha512-ypFeGhQTUBBfqSUVZYh7wS5ghn3O2wILCiQc4459SeUpvUn+skcqw/TlrwGSoF5EWjDA7gtRrWDxO3mnlPt5Cw== +storybook@7.6.17: + version "7.6.17" + resolved "https://registry.yarnpkg.com/storybook/-/storybook-7.6.17.tgz#d7fdbbf57d61d386b3ccc6721285bc914f54269b" + integrity sha512-8+EIo91bwmeFWPg1eysrxXlhIYv3OsXrznTr4+4Eq0NikqAoq6oBhtlN5K2RGS2lBVF537eN+9jTCNbR+WrzDA== dependencies: - "@storybook/cli" "7.6.10" + "@storybook/cli" "7.6.17" stream-shift@^1.0.0: version "1.0.3" @@ -9947,7 +10535,7 @@ string-width@^5.1.2: emoji-regex "^9.2.2" strip-ansi "^7.0.1" -string.prototype.matchall@^4.0.8: +string.prototype.matchall@^4.0.10: version "4.0.10" resolved "https://registry.yarnpkg.com/string.prototype.matchall/-/string.prototype.matchall-4.0.10.tgz#a1553eb532221d4180c51581d6072cd65d1ee100" integrity sha512-rGXbGmOEosIQi6Qva94HUjgPs9vKW+dkG7Y8Q5O2OYkWL6wFaTRZO8zM4mhP94uX55wgyrXzfS2aGtGzUL7EJQ== @@ -10446,6 +11034,15 @@ typed-array-buffer@^1.0.0: get-intrinsic "^1.2.1" is-typed-array "^1.1.10" +typed-array-buffer@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/typed-array-buffer/-/typed-array-buffer-1.0.2.tgz#1867c5d83b20fcb5ccf32649e5e2fc7424474ff3" + integrity sha512-gEymJYKZtKXzzBzM4jqa9w6Q1Jjm7x2d+sh19AdsD4wqnMPDYyvwpsIc2Q/835kHuo3BEQ7CjelGhfTsoBb2MQ== + dependencies: + call-bind "^1.0.7" + es-errors "^1.3.0" + is-typed-array "^1.1.13" + typed-array-byte-length@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/typed-array-byte-length/-/typed-array-byte-length-1.0.0.tgz#d787a24a995711611fb2b87a4052799517b230d0" @@ -10456,6 +11053,17 @@ typed-array-byte-length@^1.0.0: has-proto "^1.0.1" is-typed-array "^1.1.10" +typed-array-byte-length@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/typed-array-byte-length/-/typed-array-byte-length-1.0.1.tgz#d92972d3cff99a3fa2e765a28fcdc0f1d89dec67" + integrity sha512-3iMJ9q0ao7WE9tWcaYKIptkNBuOIcZCCT0d4MRvuuH88fEoEH62IuQe0OtraD3ebQEoTRk8XCBoknUNc1Y67pw== + dependencies: + call-bind "^1.0.7" + for-each "^0.3.3" + gopd "^1.0.1" + has-proto "^1.0.3" + is-typed-array "^1.1.13" + typed-array-byte-offset@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/typed-array-byte-offset/-/typed-array-byte-offset-1.0.0.tgz#cbbe89b51fdef9cd6aaf07ad4707340abbc4ea0b" @@ -10467,6 +11075,18 @@ typed-array-byte-offset@^1.0.0: has-proto "^1.0.1" is-typed-array "^1.1.10" +typed-array-byte-offset@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/typed-array-byte-offset/-/typed-array-byte-offset-1.0.2.tgz#f9ec1acb9259f395093e4567eb3c28a580d02063" + integrity sha512-Ous0vodHa56FviZucS2E63zkgtgrACj7omjwd/8lTEMEPFFyjfixMZ1ZXenpgCFBBt4EC1J2XsyVS2gkG0eTFA== + dependencies: + available-typed-arrays "^1.0.7" + call-bind "^1.0.7" + for-each "^0.3.3" + gopd "^1.0.1" + has-proto "^1.0.3" + is-typed-array "^1.1.13" + typed-array-length@^1.0.4: version "1.0.4" resolved "https://registry.yarnpkg.com/typed-array-length/-/typed-array-length-1.0.4.tgz#89d83785e5c4098bec72e08b319651f0eac9c1bb" @@ -10476,6 +11096,18 @@ typed-array-length@^1.0.4: for-each "^0.3.3" is-typed-array "^1.1.9" +typed-array-length@^1.0.5: + version "1.0.5" + resolved "https://registry.yarnpkg.com/typed-array-length/-/typed-array-length-1.0.5.tgz#57d44da160296d8663fd63180a1802ebf25905d5" + integrity sha512-yMi0PlwuznKHxKmcpoOdeLwxBoVPkqZxd7q2FgMkmD3bNwvF5VW0+UlUQ1k1vmktTu4Yu13Q0RIxEP8+B+wloA== + dependencies: + call-bind "^1.0.7" + for-each "^0.3.3" + gopd "^1.0.1" + has-proto "^1.0.3" + is-typed-array "^1.1.13" + possible-typed-array-names "^1.0.0" + typedarray@^0.0.6: version "0.0.6" resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777" @@ -10790,7 +11422,7 @@ webpack-virtual-modules@^0.6.1: resolved "https://registry.yarnpkg.com/webpack-virtual-modules/-/webpack-virtual-modules-0.6.1.tgz#ac6fdb9c5adb8caecd82ec241c9631b7a3681b6f" integrity sha512-poXpCylU7ExuvZK8z+On3kX+S8o/2dQ/SVYueKA0D4WEMXROXgY8Ez50/bQEUmvoSMMrWcrJqCHuhAbsiwg7Dg== -webpack@5, webpack@5.90.0: +webpack@5: version "5.90.0" resolved "https://registry.yarnpkg.com/webpack/-/webpack-5.90.0.tgz#313bfe16080d8b2fee6e29b6c986c0714ad4290e" integrity sha512-bdmyXRCXeeNIePv6R6tGPyy20aUobw4Zy8r0LUS2EWO+U+Ke/gYDgsCh7bl5rB6jPpr4r0SZa6dPxBxLooDT3w== @@ -10820,6 +11452,36 @@ webpack@5, webpack@5.90.0: watchpack "^2.4.0" webpack-sources "^3.2.3" +webpack@5.90.3: + version "5.90.3" + resolved "https://registry.yarnpkg.com/webpack/-/webpack-5.90.3.tgz#37b8f74d3ded061ba789bb22b31e82eed75bd9ac" + integrity sha512-h6uDYlWCctQRuXBs1oYpVe6sFcWedl0dpcVaTf/YF67J9bKvwJajFulMVSYKHrksMB3I/pIagRzDxwxkebuzKA== + dependencies: + "@types/eslint-scope" "^3.7.3" + "@types/estree" "^1.0.5" + "@webassemblyjs/ast" "^1.11.5" + "@webassemblyjs/wasm-edit" "^1.11.5" + "@webassemblyjs/wasm-parser" "^1.11.5" + acorn "^8.7.1" + acorn-import-assertions "^1.9.0" + browserslist "^4.21.10" + chrome-trace-event "^1.0.2" + enhanced-resolve "^5.15.0" + es-module-lexer "^1.2.1" + eslint-scope "5.1.1" + events "^3.2.0" + glob-to-regexp "^0.4.1" + graceful-fs "^4.2.9" + json-parse-even-better-errors "^2.3.1" + loader-runner "^4.2.0" + mime-types "^2.1.27" + neo-async "^2.6.2" + schema-utils "^3.2.0" + tapable "^2.1.1" + terser-webpack-plugin "^5.3.10" + watchpack "^2.4.0" + webpack-sources "^3.2.3" + whatwg-encoding@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/whatwg-encoding/-/whatwg-encoding-2.0.0.tgz#e7635f597fd87020858626805a2729fa7698ac53" @@ -10898,6 +11560,17 @@ which-typed-array@^1.1.11, which-typed-array@^1.1.13, which-typed-array@^1.1.2, gopd "^1.0.1" has-tostringtag "^1.0.0" +which-typed-array@^1.1.14: + version "1.1.14" + resolved "https://registry.yarnpkg.com/which-typed-array/-/which-typed-array-1.1.14.tgz#1f78a111aee1e131ca66164d8bdc3ab062c95a06" + integrity sha512-VnXFiIW8yNn9kIHN88xvZ4yOWchftKDsRJ8fEPacX/wl1lOvBrhsJ/OeJCXq7B0AaijRuqgzSKalJoPk+D8MPg== + dependencies: + available-typed-arrays "^1.0.6" + call-bind "^1.0.5" + for-each "^0.3.3" + gopd "^1.0.1" + has-tostringtag "^1.0.1" + which@^2.0.1: version "2.0.2" resolved "https://registry.yarnpkg.com/which/-/which-2.0.2.tgz#7c6a8dd0a636a0327e10b59c9286eee93f3f51b1" From 55e0ea106554804c2d4d9a647358286ca06aa961 Mon Sep 17 00:00:00 2001 From: Karine Brandelli <karinebrandelli@live.com> Date: Thu, 7 Mar 2024 10:21:08 -0300 Subject: [PATCH 07/10] chore: adjust imports --- src/core/data-display/avatar/avatar.spec.tsx | 2 +- .../data-display/avatar/avatar.stories.tsx | 2 +- src/core/data-display/avatar/index.tsx | 2 +- src/core/data-display/chip/chip.stories.tsx | 2 +- .../data-table-query-paginated.stories.tsx | 2 +- .../data-table/data-table-query-paginated.tsx | 2 +- .../data-table/data-table.stories.tsx | 2 +- .../data-display/data-table/data-table.tsx | 2 +- src/core/data-display/data-table/rows.tsx | 8 +-- .../data-display/data-table/use-paginated.ts | 4 +- .../data-display/data-table/use-rows-state.ts | 2 +- .../data-display/divider/divider.spec.tsx | 2 +- .../data-display/divider/divider.stories.tsx | 2 +- src/core/data-display/divider/index.tsx | 2 +- .../data-display/editable-table/index.tsx | 6 +- src/core/data-display/line/index.tsx | 2 +- src/core/data-display/line/line.spec.tsx | 2 +- src/core/data-display/line/line.stories.tsx | 2 +- src/core/data-display/list/list.stories.tsx | 2 +- src/core/feedback/collapse/collapse.spec.tsx | 2 +- .../feedback/collapse/collapse.stories.tsx | 2 +- src/core/feedback/collapse/index.tsx | 2 +- src/core/feedback/dialog/dialog.spec.tsx | 2 +- src/core/feedback/dialog/dialog.stories.tsx | 2 +- src/core/feedback/dialog/index.tsx | 2 +- src/core/feedback/fade/fade.spec.tsx | 2 +- src/core/feedback/fade/fade.stories.tsx | 2 +- src/core/feedback/fade/index.tsx | 2 +- src/core/feedback/validation-dialog/index.tsx | 2 +- src/core/feedback/validation-dialog/styles.ts | 2 +- src/core/feedback/zoom/index.tsx | 2 +- src/core/feedback/zoom/zoom.spec.tsx | 2 +- src/core/feedback/zoom/zooms.stories.tsx | 2 +- .../auto-complete/auto-complete.spec.tsx | 4 +- .../auto-complete/auto-complete.stories.tsx | 43 ++++++----- src/core/inputs/auto-complete/index.tsx | 72 +++++++++++-------- .../inputs/date-time/date-time.stories.tsx | 2 +- src/core/inputs/date-time/index.tsx | 2 +- src/core/inputs/mask-field/index.tsx | 2 +- src/core/inputs/pin-input/index.tsx | 2 +- src/core/inputs/pin-input/pin-input.spec.tsx | 2 +- .../inputs/pin-input/pin-input.stories.tsx | 2 +- src/core/inputs/text-field/index.tsx | 2 +- .../inputs/text-field/text-field.stories.tsx | 2 +- src/core/navigation/drawer/drawer.spec.tsx | 2 +- src/core/navigation/drawer/drawer.stories.tsx | 2 +- src/core/navigation/drawer/index.tsx | 2 +- src/core/surfaces/box/index.tsx | 2 +- .../expansion-panel.stories.tsx | 2 +- src/core/surfaces/paper/index.tsx | 2 +- src/core/surfaces/paper/paper.spec.tsx | 2 +- src/core/surfaces/paper/paper.stories.tsx | 2 +- src/experimental/actions/actions.spec.tsx | 2 +- src/experimental/actions/actions.stories.tsx | 2 +- src/experimental/actions/index.tsx | 2 +- .../auto-complete-lab.stories.tsx | 4 +- src/experimental/loading/index.tsx | 2 +- src/experimental/loading/loading.spec.tsx | 2 +- src/experimental/loading/loading.stories.tsx | 2 +- src/test/mocks/data-table-hidden-mock.tsx | 2 +- src/test/mocks/data-table-mock.tsx | 2 +- src/test/mocks/date-time-mock.tsx | 2 +- src/test/mocks/pin-input-mock.tsx | 2 +- src/test/mocks/text-field-mock.tsx | 2 +- src/test/mocks/text-field-options-mock.tsx | 2 +- 65 files changed, 136 insertions(+), 121 deletions(-) diff --git a/src/core/data-display/avatar/avatar.spec.tsx b/src/core/data-display/avatar/avatar.spec.tsx index dbb12476..bdb6585a 100644 --- a/src/core/data-display/avatar/avatar.spec.tsx +++ b/src/core/data-display/avatar/avatar.spec.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' import Typography from '@/core/data-display/typography' -import Avatar from '.' +import { Avatar } from '.' describe('Avatar', () => { it('should render first letter', () => { diff --git a/src/core/data-display/avatar/avatar.stories.tsx b/src/core/data-display/avatar/avatar.stories.tsx index cf7d7914..80dc8fd1 100644 --- a/src/core/data-display/avatar/avatar.stories.tsx +++ b/src/core/data-display/avatar/avatar.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import Avatar from '.' +import { Avatar } from '.' export default { title: 'DataDisplay/Avatar', diff --git a/src/core/data-display/avatar/index.tsx b/src/core/data-display/avatar/index.tsx index cd8e738a..cef8231c 100644 --- a/src/core/data-display/avatar/index.tsx +++ b/src/core/data-display/avatar/index.tsx @@ -23,7 +23,7 @@ const useStyles = makeStyles((theme: Theme) => { }) }) -const Avatar = ({ +export const Avatar = ({ children, primary, className, diff --git a/src/core/data-display/chip/chip.stories.tsx b/src/core/data-display/chip/chip.stories.tsx index 8dde8ebd..0969690e 100644 --- a/src/core/data-display/chip/chip.stories.tsx +++ b/src/core/data-display/chip/chip.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import Avatar from '@/core/data-display/avatar' +import { Avatar } from '@/core/data-display/avatar' import Chip from '.' import { Face } from '@/icons' diff --git a/src/core/data-display/data-table/data-table-query-paginated.stories.tsx b/src/core/data-display/data-table/data-table-query-paginated.stories.tsx index 0583eef4..5f4b35e5 100644 --- a/src/core/data-display/data-table/data-table-query-paginated.stories.tsx +++ b/src/core/data-display/data-table/data-table-query-paginated.stories.tsx @@ -8,7 +8,7 @@ import type { ColumnSpec, DataTableController, Identifier } from './types' import type { Meta } from '@storybook/react' import Button from '@/core/inputs/button' import { DataTableAction } from './data-table-action' -import DataTableQueryPaginated from './data-table-query-paginated' +import { DataTableQueryPaginated } from './data-table-query-paginated' import { RowMode } from './types' import { usePaginated } from './use-paginated' import { diff --git a/src/core/data-display/data-table/data-table-query-paginated.tsx b/src/core/data-display/data-table/data-table-query-paginated.tsx index b4adf42a..a85e881a 100644 --- a/src/core/data-display/data-table/data-table-query-paginated.tsx +++ b/src/core/data-display/data-table/data-table-query-paginated.tsx @@ -128,7 +128,7 @@ const defaultPagination: PaginationOptions = { rowsPerPageOptions: [5, 10, 25, 50] } -const DataTableQueryPaginated = <D extends Data, V extends StackView>( +export const DataTableQueryPaginated = <D extends Data, V extends StackView>( props: DataTableProps<D, V> ) => { const pagination = { ...defaultPagination, ...props.pagination } diff --git a/src/core/data-display/data-table/data-table.stories.tsx b/src/core/data-display/data-table/data-table.stories.tsx index 323bafd2..cf6dc214 100644 --- a/src/core/data-display/data-table/data-table.stories.tsx +++ b/src/core/data-display/data-table/data-table.stories.tsx @@ -6,7 +6,7 @@ import type { ColumnSpec, DataTableController, Identifier } from './types' import type { Meta } from '@storybook/react' import Typography from '@/core/data-display/typography' import Button from '@/core/inputs/button' -import DataTable from './data-table' +import { default as DataTable } from './data-table' import { DataTableAction } from './data-table-action' import DataTableField from './data-table-field' import { RowMode } from './types' diff --git a/src/core/data-display/data-table/data-table.tsx b/src/core/data-display/data-table/data-table.tsx index de717416..7e76460b 100644 --- a/src/core/data-display/data-table/data-table.tsx +++ b/src/core/data-display/data-table/data-table.tsx @@ -131,7 +131,7 @@ const sliceData = <D,>(data: D[], page: number, rowsPerPage: number) => { return data.slice(start, end) } -const DataTable = <D extends Data, V extends StackView>( +export const DataTable = <D extends Data, V extends StackView>( props: DataTableProps<D, V> ) => { const [page, setPage] = useState(0) diff --git a/src/core/data-display/data-table/rows.tsx b/src/core/data-display/data-table/rows.tsx index 74d719d0..0ffaed69 100644 --- a/src/core/data-display/data-table/rows.tsx +++ b/src/core/data-display/data-table/rows.tsx @@ -3,9 +3,9 @@ import type { ReactNode } from 'react' import TableCell from '@material-ui/core/TableCell' import TableRow from '@material-ui/core/TableRow' import type { ColumnSpec, Data, Errors, PartialData } from './types' -import DateTime from '@/core/inputs/date-time' +import { DateTime } from '@/core/inputs/date-time' import MaskField from '@/core/inputs/mask-field' -import TextField from '@/core/inputs/text-field' +import { TextField } from '@/core/inputs/text-field' import { RowMode } from './types' type RowStateUpdater = <D extends Data>( @@ -176,7 +176,7 @@ export const StatefulRow = <D extends Data>({ patch[field] = value onUpdate?.(patch) }, - [] + [onUpdate] ) const getCorrectViewMode = ( @@ -229,7 +229,7 @@ export const NewRow = <D extends Data>({ setEditableState(values => ({ ...values, [field]: value })) onUpdate?.({ [field]: value }) }, - [] + [onUpdate] ) return ( diff --git a/src/core/data-display/data-table/use-paginated.ts b/src/core/data-display/data-table/use-paginated.ts index 277e1a2b..6272c4a7 100644 --- a/src/core/data-display/data-table/use-paginated.ts +++ b/src/core/data-display/data-table/use-paginated.ts @@ -69,14 +69,14 @@ export const usePaginated = () => { } else { setState(prev => ({ ...prev, items: splitData[0], actualPage: 0 })) } - }, [state.size]) + }, [splitData, state.actualPage, state.size]) useEffect(() => { setState(prev => ({ ...prev, items: splitData[state.actualPage] })) - }, [state.actualPage]) + }, [splitData, state.actualPage]) const handleChangePage = (newPage: number) => { setLoading(true) diff --git a/src/core/data-display/data-table/use-rows-state.ts b/src/core/data-display/data-table/use-rows-state.ts index a18f2070..73ad8f79 100644 --- a/src/core/data-display/data-table/use-rows-state.ts +++ b/src/core/data-display/data-table/use-rows-state.ts @@ -39,7 +39,7 @@ export const useRowsState = <D extends Data, V extends StackView>( } setState({ internal: nextState }) - }, [rows, !!newRow]) + }, [isHidden, newRow, rows, state.internal]) const setRowState = useCallback( (id: Identifier, partial: Partial<RowState<D, V>>) => { diff --git a/src/core/data-display/divider/divider.spec.tsx b/src/core/data-display/divider/divider.spec.tsx index 7edf2366..f709a622 100644 --- a/src/core/data-display/divider/divider.spec.tsx +++ b/src/core/data-display/divider/divider.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import Divider from '.' +import { Divider } from '.' describe('Divider', () => { it('should render', () => { diff --git a/src/core/data-display/divider/divider.stories.tsx b/src/core/data-display/divider/divider.stories.tsx index 9dd5e87f..c2c6a4ba 100644 --- a/src/core/data-display/divider/divider.stories.tsx +++ b/src/core/data-display/divider/divider.stories.tsx @@ -2,7 +2,7 @@ import React from 'react' import type { Meta } from '@storybook/react' import List from '@/core/data-display/list' import ListItem from '@/core/data-display/list-item' -import Divider from '.' +import { Divider } from '.' export default { title: 'DataDisplay/Divider', diff --git a/src/core/data-display/divider/index.tsx b/src/core/data-display/divider/index.tsx index 9d97c075..c1d5cf62 100644 --- a/src/core/data-display/divider/index.tsx +++ b/src/core/data-display/divider/index.tsx @@ -7,7 +7,7 @@ export interface DividerProps extends DefaultProps, MuiDividerProps { 'data-testid'?: string } -const Divider = ({ +export const Divider = ({ margin, padding, style = {}, diff --git a/src/core/data-display/editable-table/index.tsx b/src/core/data-display/editable-table/index.tsx index 916803af..262f0139 100644 --- a/src/core/data-display/editable-table/index.tsx +++ b/src/core/data-display/editable-table/index.tsx @@ -11,11 +11,11 @@ import MaterialTable, { import { omit, contains, propOr } from 'ramda' import type { Column, Options } from 'material-table' import ListItem from '@/core/data-display/list-item' -import AutoComplete from '@/core/inputs/auto-complete' +import { default as AutoComplete } from '@/core/inputs/auto-complete' import Button from '@/core/inputs/button' -import DateTime from '@/core/inputs/date-time' +import { DateTime } from '@/core/inputs/date-time' import MaskField from '@/core/inputs/mask-field' -import TextField from '@/core/inputs/text-field' +import { TextField } from '@/core/inputs/text-field' import { getLocalization } from '@/lib/localization' import { AddRowButton, diff --git a/src/core/data-display/line/index.tsx b/src/core/data-display/line/index.tsx index b451ca5f..65975076 100644 --- a/src/core/data-display/line/index.tsx +++ b/src/core/data-display/line/index.tsx @@ -12,7 +12,7 @@ export interface LineProps extends DefaultProps { 'data-testid'?: string } -const Line = ({ +export const Line = ({ padding, margin, style, diff --git a/src/core/data-display/line/line.spec.tsx b/src/core/data-display/line/line.spec.tsx index 49a9ab99..0532940c 100644 --- a/src/core/data-display/line/line.spec.tsx +++ b/src/core/data-display/line/line.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import Line from '.' +import { Line } from '.' import { theme } from '@/theme' const { grays, secondary } = theme.colors diff --git a/src/core/data-display/line/line.stories.tsx b/src/core/data-display/line/line.stories.tsx index 5496ce00..0210fd27 100644 --- a/src/core/data-display/line/line.stories.tsx +++ b/src/core/data-display/line/line.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import Line from '.' +import { Line } from '.' export default { title: 'DataDisplay/Line', diff --git a/src/core/data-display/list/list.stories.tsx b/src/core/data-display/list/list.stories.tsx index 8909de5c..d6146c0f 100644 --- a/src/core/data-display/list/list.stories.tsx +++ b/src/core/data-display/list/list.stories.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' import ListItem from '@/core/data-display/list-item' -import Avatar from '../avatar' +import { Avatar } from '../avatar' import List from '.' import { Backup } from '@/icons' diff --git a/src/core/feedback/collapse/collapse.spec.tsx b/src/core/feedback/collapse/collapse.spec.tsx index 008c0e77..89c07341 100644 --- a/src/core/feedback/collapse/collapse.spec.tsx +++ b/src/core/feedback/collapse/collapse.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import Collapse from '.' +import { Collapse } from '.' describe('Collapse', () => { it('should render opened', () => { diff --git a/src/core/feedback/collapse/collapse.stories.tsx b/src/core/feedback/collapse/collapse.stories.tsx index f47c41a9..ec41524b 100644 --- a/src/core/feedback/collapse/collapse.stories.tsx +++ b/src/core/feedback/collapse/collapse.stories.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react' import type { Meta, StoryFn } from '@storybook/react' import Button from '@/core/inputs/button' -import Collapse from '.' +import { Collapse } from '.' export default { title: 'Feedback/Collapse', diff --git a/src/core/feedback/collapse/index.tsx b/src/core/feedback/collapse/index.tsx index 799c9a57..61c4c0ec 100644 --- a/src/core/feedback/collapse/index.tsx +++ b/src/core/feedback/collapse/index.tsx @@ -10,7 +10,7 @@ export interface CollapseProps extends DefaultProps { children?: ReactNode } -const Collapse = ({ +export const Collapse = ({ children, padding, margin, diff --git a/src/core/feedback/dialog/dialog.spec.tsx b/src/core/feedback/dialog/dialog.spec.tsx index fd677b86..aa0562a1 100644 --- a/src/core/feedback/dialog/dialog.spec.tsx +++ b/src/core/feedback/dialog/dialog.spec.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' import Button from '@/core/inputs/button' -import Dialog from '.' +import { Dialog } from '.' describe('Dialog', () => { it('should render opened', () => { diff --git a/src/core/feedback/dialog/dialog.stories.tsx b/src/core/feedback/dialog/dialog.stories.tsx index f5b3acb7..0d38ff07 100644 --- a/src/core/feedback/dialog/dialog.stories.tsx +++ b/src/core/feedback/dialog/dialog.stories.tsx @@ -2,7 +2,7 @@ import React, { useState } from 'react' import type { Meta } from '@storybook/react' import Typography from '@/core/data-display/typography' import Button from '@/core/inputs/button' -import Dialog from '.' +import { Dialog } from '.' export default { title: 'Feedback/Dialog', diff --git a/src/core/feedback/dialog/index.tsx b/src/core/feedback/dialog/index.tsx index eb606711..1253a175 100644 --- a/src/core/feedback/dialog/index.tsx +++ b/src/core/feedback/dialog/index.tsx @@ -49,7 +49,7 @@ const useStyles = makeStyles({ } }) -const Dialog = ({ +export const Dialog = ({ snippet, style, padding, diff --git a/src/core/feedback/fade/fade.spec.tsx b/src/core/feedback/fade/fade.spec.tsx index 98aa8beb..3bc97a0a 100644 --- a/src/core/feedback/fade/fade.spec.tsx +++ b/src/core/feedback/fade/fade.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import Fade from '.' +import { Fade } from '.' describe('Fade', () => { it('should render closed', () => { diff --git a/src/core/feedback/fade/fade.stories.tsx b/src/core/feedback/fade/fade.stories.tsx index 32d2b299..0c5ce3e5 100644 --- a/src/core/feedback/fade/fade.stories.tsx +++ b/src/core/feedback/fade/fade.stories.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react' import type { Meta } from '@storybook/react' import Button from '@/core/inputs/button' -import Fade from '.' +import { Fade } from '.' export default { title: 'Feedback/Fade', diff --git a/src/core/feedback/fade/index.tsx b/src/core/feedback/fade/index.tsx index 4b56b625..5413a9ba 100644 --- a/src/core/feedback/fade/index.tsx +++ b/src/core/feedback/fade/index.tsx @@ -9,7 +9,7 @@ export interface FadeProps extends DefaultProps { children: ReactElement<Record<string, unknown>> } -const Fade = ({ +export const Fade = ({ children, padding, margin, diff --git a/src/core/feedback/validation-dialog/index.tsx b/src/core/feedback/validation-dialog/index.tsx index 5df905d4..f590bd8b 100644 --- a/src/core/feedback/validation-dialog/index.tsx +++ b/src/core/feedback/validation-dialog/index.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { FC, ReactNode } from 'react' import Button from '@/core/inputs/button' -import Actions from '@/experimental/actions' +import { Actions } from '@/experimental/actions' import { DialogTypography, MuiDialog, ValidationWrapper } from './styles' export interface IValidateProps { diff --git a/src/core/feedback/validation-dialog/styles.ts b/src/core/feedback/validation-dialog/styles.ts index 8bc6366f..90667fee 100644 --- a/src/core/feedback/validation-dialog/styles.ts +++ b/src/core/feedback/validation-dialog/styles.ts @@ -1,6 +1,6 @@ import { default as styled } from 'styled-components' import Typography from '@/core/data-display/typography' -import Dialog from '../dialog' +import { Dialog } from '../dialog' export const MuiDialog = styled(Dialog)` div > div > h2 { diff --git a/src/core/feedback/zoom/index.tsx b/src/core/feedback/zoom/index.tsx index 6a69f25e..ebbab478 100644 --- a/src/core/feedback/zoom/index.tsx +++ b/src/core/feedback/zoom/index.tsx @@ -9,7 +9,7 @@ export interface ZoomProps extends DefaultProps { children?: ReactElement<Record<string, unknown>> } -const Zoom = ({ +export const Zoom = ({ children, padding, margin, diff --git a/src/core/feedback/zoom/zoom.spec.tsx b/src/core/feedback/zoom/zoom.spec.tsx index 84a2eeba..c309d591 100644 --- a/src/core/feedback/zoom/zoom.spec.tsx +++ b/src/core/feedback/zoom/zoom.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import Zoom from '.' +import { Zoom } from '.' describe('Zoom', () => { it('should render closed', () => { diff --git a/src/core/feedback/zoom/zooms.stories.tsx b/src/core/feedback/zoom/zooms.stories.tsx index ab12ff2f..d8b79687 100644 --- a/src/core/feedback/zoom/zooms.stories.tsx +++ b/src/core/feedback/zoom/zooms.stories.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react' import type { Meta } from '@storybook/react' import Button from '@/core/inputs/button' -import Zoom from '.' +import { Zoom } from '.' export default { title: 'Feedback/Zoom', diff --git a/src/core/inputs/auto-complete/auto-complete.spec.tsx b/src/core/inputs/auto-complete/auto-complete.spec.tsx index f9ac139d..bca812c4 100644 --- a/src/core/inputs/auto-complete/auto-complete.spec.tsx +++ b/src/core/inputs/auto-complete/auto-complete.spec.tsx @@ -5,8 +5,8 @@ import { userEvent } from '@testing-library/user-event' import type { ISelected, TSelected } from '.' import ListItem from '@/core/data-display/list-item' import Typography from '@/core/data-display/typography' -import TextField from '../text-field' -import AutoComplete from '.' +import { TextField } from '../text-field' +import { default as AutoComplete } from '.' interface MockProps { initialValue?: TSelected diff --git a/src/core/inputs/auto-complete/auto-complete.stories.tsx b/src/core/inputs/auto-complete/auto-complete.stories.tsx index d57faf9e..21b452b3 100644 --- a/src/core/inputs/auto-complete/auto-complete.stories.tsx +++ b/src/core/inputs/auto-complete/auto-complete.stories.tsx @@ -3,32 +3,23 @@ import type { TSelected } from '.' import type { Meta } from '@storybook/react' import ListItem from '@/core/data-display/list-item' import Typography from '@/core/data-display/typography' -import TextField from '@/core/inputs/text-field' -import AutoComplete from '.' +import { TextField } from '@/core/inputs/text-field' +import { default as AutoComplete } from '.' export default { title: 'Inputs/AutoComplete', component: AutoComplete } as Meta<typeof AutoComplete> -const suggestions = [ - { value: 'rock', label: 'Rock' }, - { value: 'pop', label: 'Pop' }, - { value: 'classic', label: 'Classic' } -] - -const subheaderSuggestions = [ - { label: 'Genres', subheader: true }, - { value: 'rock', label: 'Rock' }, - { value: 'pop', label: 'Pop' }, - { value: 'classic', label: 'Classic' } -] - export const Default = () => ( <AutoComplete defaultIsOpen openOnFocus - suggestions={suggestions} + suggestions={[ + { value: 'rock', label: 'Rock' }, + { value: 'pop', label: 'Pop' }, + { value: 'classic', label: 'Classic' } + ]} renderInput={({ value, inputProps }) => { return ( <TextField @@ -57,7 +48,11 @@ export const OpeningWhenFocused = () => ( <AutoComplete openOnFocus value={{ value: 'classic', label: 'Classic' }} - suggestions={suggestions} + suggestions={[ + { value: 'rock', label: 'Rock' }, + { value: 'pop', label: 'Pop' }, + { value: 'classic', label: 'Classic' } + ]} renderInput={props => ( <TextField fullWidth placeholder='Music genres' {...props} /> )} @@ -77,7 +72,12 @@ export const OpeningWhenFocused = () => ( export const WithSubheader = () => ( <AutoComplete openOnFocus - suggestions={subheaderSuggestions} + suggestions={[ + { label: 'Genres', subheader: true }, + { value: 'rock', label: 'Rock' }, + { value: 'pop', label: 'Pop' }, + { value: 'classic', label: 'Classic' } + ]} renderInput={props => ( <TextField fullWidth placeholder='Music genres' {...props} /> )} @@ -112,7 +112,12 @@ export const MockAtuoComplete = () => { autoFocus caseSensitive value={value} - suggestions={subheaderSuggestions} + suggestions={[ + { label: 'Genres', subheader: true }, + { value: 'rock', label: 'Rock' }, + { value: 'pop', label: 'pop' }, + { value: 'classic', label: 'Classic' } + ]} renderInput={props => { return ( <TextField diff --git a/src/core/inputs/auto-complete/index.tsx b/src/core/inputs/auto-complete/index.tsx index 72dcbeca..8641d0c0 100644 --- a/src/core/inputs/auto-complete/index.tsx +++ b/src/core/inputs/auto-complete/index.tsx @@ -1,4 +1,10 @@ -import React, { Fragment, useState, useRef, useEffect } from 'react' +import React, { + Fragment, + useState, + useRef, + useEffect, + useCallback +} from 'react' import type { ReactNode, ChangeEvent, @@ -9,8 +15,8 @@ import type { MouseEvent, ReactElement } from 'react' -import Fade from '@/core/feedback/fade' -import Paper from '@/core/surfaces/paper' +import { Fade } from '@/core/feedback/fade' +import { Paper } from '@/core/surfaces/paper' export interface AutoCompleteProps { autoFocus?: boolean @@ -62,7 +68,7 @@ export type TSelected = ISelected | string const removeAccents = (text: string) => text.normalize('NFD').replace(/[\u0300-\u036f]/g, '') -const AutoComplete = (props: AutoCompleteProps) => { +export const AutoComplete = (props: AutoCompleteProps) => { const inputRef = useRef<HTMLInputElement>(null) const index = props.suggestions.findIndex(suggestion => { @@ -81,7 +87,7 @@ const AutoComplete = (props: AutoCompleteProps) => { const current = inputRef.current if (current) { - current!.focus() + current.focus() if (props.openOnFocus) { setOpen(true) @@ -100,7 +106,7 @@ const AutoComplete = (props: AutoCompleteProps) => { } }, props.focusDelay) } - }, []) + }, [props.autoFocus, props.focusDelay, props.openOnFocus]) const inputValue = typeof props.value === 'object' ? props.value.label : props.value || '' @@ -114,31 +120,37 @@ const AutoComplete = (props: AutoCompleteProps) => { props.onChange(item) } - const getSuggestions = (value: string = inputValue): TSelected[] => { - if (props.openOnFocus && !value) { - return props.suggestions - } - - const items = value && value.length ? props.suggestions : [] - - return items.filter(item => { - if (!item.subheader) { - return props.caseSensitive - ? removeAccents(item.label).includes(removeAccents(value)) - : removeAccents(item.label) - .toLocaleLowerCase() - .includes(removeAccents(value).toLocaleLowerCase()) + const getSuggestions = useCallback( + (value: string = inputValue): TSelected[] => { + if (props.openOnFocus && !value) { + return props.suggestions } - return true - }) - } + const items = value.length ? props.suggestions : [] + + return items.filter(item => { + if (!item.subheader) { + return props.caseSensitive + ? removeAccents(item.label).includes( + removeAccents(value) + ) + : removeAccents(item.label) + .toLocaleLowerCase() + .includes( + removeAccents(value).toLocaleLowerCase() + ) + } + + return true + }) + }, + [inputValue, props.caseSensitive, props.openOnFocus, props.suggestions] + ) useEffect(() => { - const isFocused = - inputRef && inputRef.current - ? document.activeElement === inputRef.current - : false + const isFocused = inputRef.current + ? document.activeElement === inputRef.current + : false const isSearching = props.value && typeof props.value === 'string' @@ -147,7 +159,7 @@ const AutoComplete = (props: AutoCompleteProps) => { if (isSearching && hasSuggestions && isFocused) { setOpen(true) } - }, [getSuggestions(), props.value]) + }, [getSuggestions, props.value]) const getPaperPosition = () => { if (inputRef.current !== null) { @@ -178,9 +190,7 @@ const AutoComplete = (props: AutoCompleteProps) => { if (props.selectTextOnFocus) { const input = event.target - if (input.select) { - input.select() - } + input.select() } if (props.onFocus) { diff --git a/src/core/inputs/date-time/date-time.stories.tsx b/src/core/inputs/date-time/date-time.stories.tsx index 68d5871c..3047b35c 100644 --- a/src/core/inputs/date-time/date-time.stories.tsx +++ b/src/core/inputs/date-time/date-time.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import DateTime from '.' +import { DateTime } from '.' export default { title: 'Inputs/DateTime', diff --git a/src/core/inputs/date-time/index.tsx b/src/core/inputs/date-time/index.tsx index cc5474f3..f476c578 100644 --- a/src/core/inputs/date-time/index.tsx +++ b/src/core/inputs/date-time/index.tsx @@ -39,7 +39,7 @@ export type DateTimeProps = Omit< IProps & DefaultProps -const DateTime = ({ +export const DateTime = ({ padding, margin, style, diff --git a/src/core/inputs/mask-field/index.tsx b/src/core/inputs/mask-field/index.tsx index 39e05390..35915a85 100644 --- a/src/core/inputs/mask-field/index.tsx +++ b/src/core/inputs/mask-field/index.tsx @@ -3,7 +3,7 @@ import type { ComponentType } from 'react' import type { NumberFormatProps } from 'react-number-format' import NumberFormat from 'react-number-format' import type { TextFieldProps } from '@/core/inputs/text-field' -import TextField from '@/core/inputs/text-field' +import { TextField } from '@/core/inputs/text-field' export interface MaskFieldProps extends NumberFormatProps { mask?: string diff --git a/src/core/inputs/pin-input/index.tsx b/src/core/inputs/pin-input/index.tsx index 7e3d95a1..1409f3b1 100644 --- a/src/core/inputs/pin-input/index.tsx +++ b/src/core/inputs/pin-input/index.tsx @@ -25,7 +25,7 @@ const PIN_MIN_VALUE = 0 const PIN_MAX_VALUE = 9 const BACKSPACE_KEY = 'Backspace' -const PinInput = ({ +export const PinInput = ({ pinLength, pin, setPin, diff --git a/src/core/inputs/pin-input/pin-input.spec.tsx b/src/core/inputs/pin-input/pin-input.spec.tsx index 91102d86..e7ec8840 100644 --- a/src/core/inputs/pin-input/pin-input.spec.tsx +++ b/src/core/inputs/pin-input/pin-input.spec.tsx @@ -3,7 +3,7 @@ import { act } from 'react-dom/test-utils' import { fireEvent, render, screen } from '@testing-library/react' import { userEvent } from '@testing-library/user-event' import MockedComponent from '@/test/mocks/pin-input-mock' -import PinInput from '.' +import { PinInput } from '.' describe('PinInput', () => { it('should render', () => { diff --git a/src/core/inputs/pin-input/pin-input.stories.tsx b/src/core/inputs/pin-input/pin-input.stories.tsx index e6fcd65e..0edeccde 100644 --- a/src/core/inputs/pin-input/pin-input.stories.tsx +++ b/src/core/inputs/pin-input/pin-input.stories.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react' import { Button } from '@material-ui/core' import type { Meta } from '@storybook/react' -import PinInput from '.' +import { PinInput } from '.' import { ButtonContainer, ValidateContainer } from './styles' export default { diff --git a/src/core/inputs/text-field/index.tsx b/src/core/inputs/text-field/index.tsx index 720f90ef..fde21245 100644 --- a/src/core/inputs/text-field/index.tsx +++ b/src/core/inputs/text-field/index.tsx @@ -207,7 +207,7 @@ const renderEndAdornment = (onClear?: () => void) => ( </InputAdornment> ) -const TextField = ({ +export const TextField = ({ options, margin, padding, diff --git a/src/core/inputs/text-field/text-field.stories.tsx b/src/core/inputs/text-field/text-field.stories.tsx index 722b6e93..b156cedc 100644 --- a/src/core/inputs/text-field/text-field.stories.tsx +++ b/src/core/inputs/text-field/text-field.stories.tsx @@ -3,7 +3,7 @@ import React, { useState } from 'react' import type { Meta, StoryFn } from '@storybook/react' import ListItem from '@/core/data-display/list-item' import InputAdornment from '@/core/inputs/input-adornment' -import TextField from '.' +import { TextField } from '.' import { Wrapper } from './styles' export default { diff --git a/src/core/navigation/drawer/drawer.spec.tsx b/src/core/navigation/drawer/drawer.spec.tsx index bb291308..4a7e249e 100644 --- a/src/core/navigation/drawer/drawer.spec.tsx +++ b/src/core/navigation/drawer/drawer.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import Drawer from '.' +import { Drawer } from '.' describe('Drawer', () => { it('should render', () => { diff --git a/src/core/navigation/drawer/drawer.stories.tsx b/src/core/navigation/drawer/drawer.stories.tsx index 00cdba4c..b40e9664 100644 --- a/src/core/navigation/drawer/drawer.stories.tsx +++ b/src/core/navigation/drawer/drawer.stories.tsx @@ -3,7 +3,7 @@ import type { Meta } from '@storybook/react' import List from '@/core/data-display/list' import ListItem from '@/core/data-display/list-item' import Button from '@/core/inputs/button' -import Drawer from '.' +import { Drawer } from '.' import { Backup as IconBackup } from '@/icons' export default { diff --git a/src/core/navigation/drawer/index.tsx b/src/core/navigation/drawer/index.tsx index 157d7d99..5833ad9e 100644 --- a/src/core/navigation/drawer/index.tsx +++ b/src/core/navigation/drawer/index.tsx @@ -24,7 +24,7 @@ const getStyles = (top: number, width?: number) => }) ) -const Drawer = (props: DrawerProps) => { +export 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/surfaces/box/index.tsx b/src/core/surfaces/box/index.tsx index 91c2235c..0f4b7caa 100644 --- a/src/core/surfaces/box/index.tsx +++ b/src/core/surfaces/box/index.tsx @@ -1,7 +1,7 @@ import React from 'react' import type { ReactNode } from 'react' import type { DefaultProps } from '../../types' -import Paper from '@/core/surfaces/paper' +import { Paper } from '@/core/surfaces/paper' export interface BoxProps extends DefaultProps { minHeight?: number diff --git a/src/core/surfaces/expansion-panel/expansion-panel.stories.tsx b/src/core/surfaces/expansion-panel/expansion-panel.stories.tsx index c1833d4f..735651c8 100644 --- a/src/core/surfaces/expansion-panel/expansion-panel.stories.tsx +++ b/src/core/surfaces/expansion-panel/expansion-panel.stories.tsx @@ -3,7 +3,7 @@ import type { KeyboardEvent } from 'react' import type { Meta, StoryFn } from '@storybook/react' import Typography from '@/core/data-display/typography' import Button from '@/core/inputs/button' -import TextField from '@/core/inputs/text-field' +import { TextField } from '@/core/inputs/text-field' import ExpansionPanel from '.' import { ExpandMore } from '@/icons' diff --git a/src/core/surfaces/paper/index.tsx b/src/core/surfaces/paper/index.tsx index 1d44ec7e..6558aa94 100644 --- a/src/core/surfaces/paper/index.tsx +++ b/src/core/surfaces/paper/index.tsx @@ -8,7 +8,7 @@ export interface PaperProps extends DefaultProps, MuiPaperProps { elevation?: number } -const Paper = ({ +export const Paper = ({ children, style = {}, padding, diff --git a/src/core/surfaces/paper/paper.spec.tsx b/src/core/surfaces/paper/paper.spec.tsx index 4c26137c..8b8dd833 100644 --- a/src/core/surfaces/paper/paper.spec.tsx +++ b/src/core/surfaces/paper/paper.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import Paper from '.' +import { Paper } from '.' describe('Paper', () => { it('should render children', () => { diff --git a/src/core/surfaces/paper/paper.stories.tsx b/src/core/surfaces/paper/paper.stories.tsx index 83b10d94..2b745bd6 100644 --- a/src/core/surfaces/paper/paper.stories.tsx +++ b/src/core/surfaces/paper/paper.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import Paper from '.' +import { Paper } from '.' export default { title: 'Surfaces/Paper', diff --git a/src/experimental/actions/actions.spec.tsx b/src/experimental/actions/actions.spec.tsx index 93df7a3a..e280192a 100644 --- a/src/experimental/actions/actions.spec.tsx +++ b/src/experimental/actions/actions.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import Actions from '.' +import { Actions } from '.' describe('Actions', () => { it('should render', () => { diff --git a/src/experimental/actions/actions.stories.tsx b/src/experimental/actions/actions.stories.tsx index e3f55c01..b747fb2f 100644 --- a/src/experimental/actions/actions.stories.tsx +++ b/src/experimental/actions/actions.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import Actions from '.' +import { Actions } from '.' export default { title: 'Experimental/Actions', diff --git a/src/experimental/actions/index.tsx b/src/experimental/actions/index.tsx index a1dcd691..be70b954 100644 --- a/src/experimental/actions/index.tsx +++ b/src/experimental/actions/index.tsx @@ -39,7 +39,7 @@ export const Wrapper = styled.div<IWrapper>` margin: ${props => props.margin}; ` -const Actions = (props: IProps) => { +export const Actions = (props: IProps) => { const showButton = !props.readonly && (!props.buttons || props.buttons.includes('confirm')) diff --git a/src/experimental/auto-complete-lab/auto-complete-lab.stories.tsx b/src/experimental/auto-complete-lab/auto-complete-lab.stories.tsx index 797ba492..63320b28 100644 --- a/src/experimental/auto-complete-lab/auto-complete-lab.stories.tsx +++ b/src/experimental/auto-complete-lab/auto-complete-lab.stories.tsx @@ -1,8 +1,8 @@ import React from 'react' import { Autocomplete as AutocompleteLab } from '@material-ui/lab' import type { Meta } from '@storybook/react' -import AutoComplete from '@/core/inputs/auto-complete' -import TextField from '@/core/inputs/text-field' +import { default as AutoComplete } from '@/core/inputs/auto-complete' +import { TextField } from '@/core/inputs/text-field' export default { title: 'Experimental/AutoCompleteLab', diff --git a/src/experimental/loading/index.tsx b/src/experimental/loading/index.tsx index 3ffe2b45..074daade 100644 --- a/src/experimental/loading/index.tsx +++ b/src/experimental/loading/index.tsx @@ -8,7 +8,7 @@ export interface IProps { size?: number } -const Loading = (props: IProps) => { +export const Loading = (props: IProps) => { const { margin = 48, padding = 24, size = 72 } = props const renderLoading = useMemo( diff --git a/src/experimental/loading/loading.spec.tsx b/src/experimental/loading/loading.spec.tsx index 5a269638..65e78468 100644 --- a/src/experimental/loading/loading.spec.tsx +++ b/src/experimental/loading/loading.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import Loading from '.' +import { Loading } from '.' export const DefaultLoading = () => <Loading /> export const CustomSizeLoading = () => <Loading size={32} /> diff --git a/src/experimental/loading/loading.stories.tsx b/src/experimental/loading/loading.stories.tsx index 516e7543..55e1752d 100644 --- a/src/experimental/loading/loading.stories.tsx +++ b/src/experimental/loading/loading.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import Loading from '.' +import { Loading } from '.' export default { title: 'Experimental/Loading', diff --git a/src/test/mocks/data-table-hidden-mock.tsx b/src/test/mocks/data-table-hidden-mock.tsx index 09fc5527..a9432716 100644 --- a/src/test/mocks/data-table-hidden-mock.tsx +++ b/src/test/mocks/data-table-hidden-mock.tsx @@ -7,7 +7,7 @@ import type { Identifier } from '@/core/data-display/data-table/types' import { DataTableAction } from '@/core/data-display/data-table' -import DataTable from '@/core/data-display/data-table/data-table' +import { DataTable } from '@/core/data-display/data-table/data-table' import { RowMode } from '@/core/data-display/data-table/types' import Typography from '@/core/data-display/typography' import Button from '@/core/inputs/button' diff --git a/src/test/mocks/data-table-mock.tsx b/src/test/mocks/data-table-mock.tsx index 3f8d0a86..3bab1125 100644 --- a/src/test/mocks/data-table-mock.tsx +++ b/src/test/mocks/data-table-mock.tsx @@ -7,7 +7,7 @@ import type { Identifier } from '@/core/data-display/data-table/types' import { DataTableAction } from '@/core/data-display/data-table' -import DataTable from '@/core/data-display/data-table/data-table' +import { DataTable } from '@/core/data-display/data-table/data-table' import { RowMode } from '@/core/data-display/data-table/types' import Typography from '@/core/data-display/typography' import Button from '@/core/inputs/button' diff --git a/src/test/mocks/date-time-mock.tsx b/src/test/mocks/date-time-mock.tsx index 093d23d3..bf09ee99 100644 --- a/src/test/mocks/date-time-mock.tsx +++ b/src/test/mocks/date-time-mock.tsx @@ -2,7 +2,7 @@ import * as React from 'react' import { isValid, startOfDay } from 'date-fns' import type { DateTimeProps } from '@/core/inputs/date-time' import type { MaterialUiPickersDate } from '@material-ui/pickers/typings/date' -import DateTime from '@/core/inputs/date-time' +import { DateTime } from '@/core/inputs/date-time' interface IProps { initialValue?: string diff --git a/src/test/mocks/pin-input-mock.tsx b/src/test/mocks/pin-input-mock.tsx index 9e3257a6..da30d850 100644 --- a/src/test/mocks/pin-input-mock.tsx +++ b/src/test/mocks/pin-input-mock.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react' import { Button } from '@material-ui/core' import type { PinInputGridProps } from '@/core/inputs/pin-input' -import PinInput from '@/core/inputs/pin-input' +import { PinInput } from '@/core/inputs/pin-input' const PIN_LENGTH = 6 diff --git a/src/test/mocks/text-field-mock.tsx b/src/test/mocks/text-field-mock.tsx index 3c47fa31..06b19dcf 100644 --- a/src/test/mocks/text-field-mock.tsx +++ b/src/test/mocks/text-field-mock.tsx @@ -1,7 +1,7 @@ import * as React from 'react' import type { TextFieldProps } from '@/core/inputs/text-field' import ListItem from '@/core/data-display/list-item' -import TextField from '@/core/inputs/text-field' +import { TextField } from '@/core/inputs/text-field' interface IProps { initialOption?: string diff --git a/src/test/mocks/text-field-options-mock.tsx b/src/test/mocks/text-field-options-mock.tsx index 264a4e22..4610ca6f 100644 --- a/src/test/mocks/text-field-options-mock.tsx +++ b/src/test/mocks/text-field-options-mock.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import type { IOption, TextFieldProps } from '@/core/inputs/text-field' -import TextField from '@/core/inputs/text-field' +import { TextField } from '@/core/inputs/text-field' interface IProps { initialOption?: string From e0103b11af6ebf8fbf46b444582d55019048cefc Mon Sep 17 00:00:00 2001 From: Karine Brandelli <karinebrandelli@live.com> Date: Thu, 7 Mar 2024 14:20:28 -0300 Subject: [PATCH 08/10] chore: adjust eslint warnings --- .eslintrc.js | 6 +- src/core/data-display/data-table/rows.tsx | 9 +- .../data-display/data-table/use-paginated.ts | 13 +- .../data-display/data-table/use-rows-state.ts | 4 +- .../data-display/editable-table/index.tsx | 40 ++++-- src/core/inputs/pin-input/index.tsx | 6 +- .../surfaces/step-card/step-card-details.tsx | 110 +++++++++------ .../surfaces/step-card/step-card-panel.tsx | 126 ++++++++++-------- src/core/surfaces/step-card/styles.ts | 88 +----------- 9 files changed, 191 insertions(+), 211 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index 8f4d9cf6..5f975325 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -2,11 +2,13 @@ const rulesReact = { 'react/prop-types': 'off', 'react/display-name': 'off', 'react/no-unescaped-entities': 'off', - + 'react/jsx-key': 'warn', 'react/jsx-pascal-case': 'warn', 'react/self-closing-comp': 'warn', - 'react/no-unstable-nested-components': 'warn', + // it should be 'warn' but + // material-table needs to render nested components + 'react/no-unstable-nested-components': 'off', 'react/jsx-sort-props': [ 'warn', { diff --git a/src/core/data-display/data-table/rows.tsx b/src/core/data-display/data-table/rows.tsx index 0ffaed69..12f25906 100644 --- a/src/core/data-display/data-table/rows.tsx +++ b/src/core/data-display/data-table/rows.tsx @@ -82,7 +82,6 @@ const renderEditMode = <D extends Data>( } const type = column.type === 'number' ? 'number' : 'text' - const value = row[column.field] as string return ( @@ -176,7 +175,9 @@ export const StatefulRow = <D extends Data>({ patch[field] = value onUpdate?.(patch) }, - [onUpdate] + // it works fine + // eslint-disable-next-line react-hooks/exhaustive-deps + [] ) const getCorrectViewMode = ( @@ -229,7 +230,9 @@ export const NewRow = <D extends Data>({ setEditableState(values => ({ ...values, [field]: value })) onUpdate?.({ [field]: value }) }, - [onUpdate] + // it works fine + // eslint-disable-next-line react-hooks/exhaustive-deps + [] ) return ( diff --git a/src/core/data-display/data-table/use-paginated.ts b/src/core/data-display/data-table/use-paginated.ts index 6272c4a7..df8a2ee2 100644 --- a/src/core/data-display/data-table/use-paginated.ts +++ b/src/core/data-display/data-table/use-paginated.ts @@ -1,4 +1,5 @@ import { useState, useMemo, useEffect } from 'react' +import type { Dispatch, SetStateAction } from 'react' import faker from 'faker' import { splitEvery } from 'ramda' import type { Data } from './types' @@ -69,14 +70,18 @@ export const usePaginated = () => { } else { setState(prev => ({ ...prev, items: splitData[0], actualPage: 0 })) } - }, [splitData, state.actualPage, state.size]) + // it works fine + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [state.size]) useEffect(() => { setState(prev => ({ ...prev, items: splitData[state.actualPage] })) - }, [splitData, state.actualPage]) + // it works fine + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [state.actualPage]) const handleChangePage = (newPage: number) => { setLoading(true) @@ -94,9 +99,7 @@ export const usePaginated = () => { }, MOCK_DELAY_VALUE) } - const setData: React.Dispatch<React.SetStateAction<Data[]>> = ( - data: Data[] - ) => { + const setData: Dispatch<SetStateAction<Data[]>> = (data: Data[]) => { setState(prev => ({ ...prev, items: data })) } diff --git a/src/core/data-display/data-table/use-rows-state.ts b/src/core/data-display/data-table/use-rows-state.ts index 73ad8f79..9b3765db 100644 --- a/src/core/data-display/data-table/use-rows-state.ts +++ b/src/core/data-display/data-table/use-rows-state.ts @@ -39,7 +39,9 @@ export const useRowsState = <D extends Data, V extends StackView>( } setState({ internal: nextState }) - }, [isHidden, newRow, rows, state.internal]) + // it works fine + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [rows, !!newRow]) const setRowState = useCallback( (id: Identifier, partial: Partial<RowState<D, V>>) => { diff --git a/src/core/data-display/editable-table/index.tsx b/src/core/data-display/editable-table/index.tsx index 262f0139..194df171 100644 --- a/src/core/data-display/editable-table/index.tsx +++ b/src/core/data-display/editable-table/index.tsx @@ -103,6 +103,27 @@ export interface EditableTableProps<T extends object> { export type TSuggestion = { label: string; value: string } +const handlePagination = ( + paginationInfo?: boolean, + noRowsExpand?: boolean, + title?: string +) => { + const pagination = !paginationInfo + ? { Pagination: () => null } + : noRowsExpand && { + Pagination: (item: any) => ( + <RightPagination data-id='pagination'> + <MTablePagination + {...omit(['classes'], item)} + localization={getLocalization(title).pagination} + /> + </RightPagination> + ) + } + + return pagination +} + const EditableTable = <T extends object>(props: EditableTableProps<T>) => { const addButtonColor = (props.color !== 'disabled' && props.color) || 'primary' @@ -141,19 +162,6 @@ const EditableTable = <T extends object>(props: EditableTableProps<T>) => { </AddRowButton> ) - const pagination = !props.paginationInfo - ? { Pagination: () => null } - : props.noRowsExpand && { - Pagination: (item: any) => ( - <RightPagination data-id='pagination'> - <MTablePagination - {...omit(['classes'], item)} - localization={getLocalization(props.title).pagination} - /> - </RightPagination> - ) - } - const toolbar = props.noHeader && { Toolbar: () => null } const renderAutoComplete = (inputProps: any) => ( @@ -298,7 +306,11 @@ const EditableTable = <T extends object>(props: EditableTableProps<T>) => { /> ) }, - ...pagination, + ...handlePagination( + props.paginationInfo, + props.noRowsExpand, + props.title + ), ...toolbar }} localization={getLocalization(props.title)} diff --git a/src/core/inputs/pin-input/index.tsx b/src/core/inputs/pin-input/index.tsx index 1409f3b1..82f29da4 100644 --- a/src/core/inputs/pin-input/index.tsx +++ b/src/core/inputs/pin-input/index.tsx @@ -43,7 +43,11 @@ export const PinInput = ({ const changePinFocus = (pinIndex: number) => { const ref = inputRefs.current[pinIndex] - ref.focus() + // it needs this if, otherwise doesn't work + // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition + if (ref) { + ref.focus() + } } useEffect(() => { diff --git a/src/core/surfaces/step-card/step-card-details.tsx b/src/core/surfaces/step-card/step-card-details.tsx index 8a4db651..52fef45a 100644 --- a/src/core/surfaces/step-card/step-card-details.tsx +++ b/src/core/surfaces/step-card/step-card-details.tsx @@ -2,16 +2,13 @@ import React from 'react' import { List } from '@material-ui/core' import MuiAccordionDetails from '@material-ui/core/AccordionDetails' import type { IStepCardProps } from '.' +import Typography from '@/core/data-display/typography' import IconButton from '@/core/inputs/icon-button' -import { - ACORDION_DETAILS, - ICON_BUTTON, - IconCheck, - IconHelp, - ListItemContainer, - StepCardColumn, - TypographyContainer -} from './styles' +import { ListItemContainer, StepCardColumn } from './styles' +import { CheckCircle as CheckCircleIcon, Help as HelpIcon } from '@/icons' +import { theme } from '@/theme' + +const { feedback, grays } = theme.colors interface IStepCardDetailsProps { steps: IStepCardProps['steps'] @@ -20,46 +17,75 @@ interface IStepCardDetailsProps { expansionPanelDetailsProps?: IStepCardProps['expansionPanelDetailsProps'] } -export const StepCardDetails = (props: IStepCardDetailsProps) => { - const { steps, onStepUrlClick, image, expansionPanelDetailsProps } = props - - const stepsList = () => ( - <List> - {(steps || []).map((step, index) => { - const handleOnClickStepUrl = () => { - if (onStepUrlClick && step.url) { - onStepUrlClick(step.url) - } +const StepsList = ({ + steps, + onStepUrlClick +}: { + steps: + | { + title: string + done: boolean + url?: string | undefined + }[] + | undefined + onStepUrlClick: ((url: string) => void) | undefined +}) => ( + <List> + {(steps || []).map((step, index) => { + const handleOnClickStepUrl = () => { + if (onStepUrlClick && step.url) { + onStepUrlClick(step.url) } + } - return ( - <ListItemContainer key={index}> - <IconCheck done={step.done} /> - <TypographyContainer variant='body1'> - {step.title} - </TypographyContainer> - {step.url && onStepUrlClick && ( - <> - <IconButton - data-testid={`step-card-button-${index}`} - style={ICON_BUTTON} - onClick={handleOnClickStepUrl}> - <IconHelp fontSize='small' /> - </IconButton> - </> - )} - </ListItemContainer> - ) - })} - </List> - ) + return ( + <ListItemContainer key={index}> + <CheckCircleIcon + style={{ + color: step.done ? feedback.success : grays.g3 + }} + /> + <Typography + variant='body1' + style={{ + color: grays.g2, + fontWeight: 600 + }}> + {step.title} + </Typography> + {step.url && onStepUrlClick && ( + <> + <IconButton + data-testid={`step-card-button-${index}`} + style={{ + backgroundColor: 'unset' + }} + onClick={handleOnClickStepUrl}> + <HelpIcon + fontSize='small' + style={{ margin: '0px' }} + /> + </IconButton> + </> + )} + </ListItemContainer> + ) + })} + </List> +) + +export const StepCardDetails = (props: IStepCardDetailsProps) => { + const { steps, onStepUrlClick, image, expansionPanelDetailsProps } = props return ( <MuiAccordionDetails - style={ACORDION_DETAILS} + style={{ + display: 'flex', + justifyContent: 'space-between' + }} {...expansionPanelDetailsProps}> <StepCardColumn justifyContent='start'> - {stepsList()} + <StepsList steps={steps} onStepUrlClick={onStepUrlClick} /> </StepCardColumn> {image && ( <StepCardColumn justifyContent='end'> diff --git a/src/core/surfaces/step-card/step-card-panel.tsx b/src/core/surfaces/step-card/step-card-panel.tsx index f06e4c48..2f85b0eb 100644 --- a/src/core/surfaces/step-card/step-card-panel.tsx +++ b/src/core/surfaces/step-card/step-card-panel.tsx @@ -1,26 +1,25 @@ import React from 'react' import type { CSSProperties } from 'react' +import { LinearProgress } from '@material-ui/core' import MuiAccordionSummary from '@material-ui/core/AccordionSummary' import { sprintf } from 'sprintf-js' import type { IStepCardProps } from '.' import Typography from '@/core/data-display/typography' import { BarWrapper, - BottomProgressBar, - CheckIcon, NormalProgressContainer, - PROGRESS_BAR, - ProgressBar, StepCardColumn, StepCardRow, StepContainer, - TEXT_ALIGN, - TitleContainer, - TypographyProgress, - TypographySubtitle, - TypographyTitle + TitleContainer } from './styles' -import { ExpandMore as ExpandMoreIcon } from '@/icons' +import { + CheckCircle as CheckCircleIcon, + ExpandMore as ExpandMoreIcon +} from '@/icons' +import { theme } from '@/theme' + +const { feedback, grays } = theme.colors interface IStepCardPanelProps { title: string @@ -40,39 +39,6 @@ interface IStepCardPanelProps { padding?: CSSProperties['padding'] } -const TitleColumn = ({ - showIcon, - percentage, - title, - titleProps, - subTitle -}: { - showIcon: boolean - percentage: number - title: string - titleProps: IStepCardProps['titleProps'] - subTitle?: string -}) => ( - <> - {showIcon && ( - <CheckIcon - data-testid='step-card-title-icon' - percentage={percentage} - /> - )} - <TitleContainer> - <TypographyTitle variant='h6' {...titleProps}> - {title} - </TypographyTitle> - {subTitle && ( - <TypographySubtitle variant='h6' {...titleProps}> - {subTitle} - </TypographySubtitle> - )} - </TitleContainer> - </> -) - export const StepCardPanel = (props: IStepCardPanelProps) => { const { title, @@ -98,18 +64,46 @@ export const StepCardPanel = (props: IStepCardPanelProps) => { fullWidth={fullWidth} minHeight={expandable ? '100px' : '100%'}> <StepCardColumn justifyContent='start'> - <TitleColumn - showIcon={showIcon} - percentage={percentage} - title={title} - titleProps={titleProps} - subTitle={subTitle} - /> + {showIcon && ( + <CheckCircleIcon + data-testid='step-card-title-icon' + style={{ + fontSize: 40, + color: + percentage === 100 + ? feedback.success + : grays.g3 + }} + /> + )} + <TitleContainer> + <Typography + variant='h6' + style={{ + color: grays.g1, + fontSize: 24, + textAlign: 'center' + }} + {...titleProps}> + {title} + </Typography> + {subTitle && ( + <Typography + variant='h6' + style={{ + color: grays.g3, + textAlign: 'center' + }} + {...titleProps}> + {subTitle} + </Typography> + )} + </TitleContainer> </StepCardColumn> <StepCardColumn justifyContent='end'> {expandable ? ( <MuiAccordionSummary - style={TEXT_ALIGN} + style={{ textAlign: 'center' }} expandIcon={<ExpandMoreIcon fontSize='large' />}> <Typography variant='h6' {...summaryProps}> {sprintf(summary, remainingSteps, time)} @@ -120,15 +114,25 @@ export const StepCardPanel = (props: IStepCardPanelProps) => { <Typography variant='h6' {...summaryProps}> {summary} </Typography> - <TypographyProgress variant='subtitle2'> - {`${percentage}%`} - </TypographyProgress> + <Typography + variant='subtitle2' + style={{ + position: 'absolute', + right: 8 + }}>{`${percentage}%`}</Typography> <BarWrapper> - <ProgressBar + <LinearProgress variant='determinate' value={percentage} color='primary' - classes={PROGRESS_BAR} + classes={{ + barColorPrimary: 'barColorPrimary' + }} + style={{ + borderRadius: 10, + height: '16px', + backgroundColor: grays.g5 + }} {...summaryLinearProgressBarProps} /> </BarWrapper> @@ -139,11 +143,17 @@ export const StepCardPanel = (props: IStepCardPanelProps) => { {showBottomPercentage && ( <StepCardRow fullWidth={fullWidth} minHeight='15px'> <BarWrapper> - <BottomProgressBar + <LinearProgress variant='determinate' value={percentage} color='primary' - classes={PROGRESS_BAR} + classes={{ + barColorPrimary: 'barColorPrimary' + }} + style={{ + height: '16px', + backgroundColor: grays.g5 + }} {...linearProgressBarProps} /> </BarWrapper> diff --git a/src/core/surfaces/step-card/styles.ts b/src/core/surfaces/step-card/styles.ts index 43b12248..966ef48e 100644 --- a/src/core/surfaces/step-card/styles.ts +++ b/src/core/surfaces/step-card/styles.ts @@ -1,10 +1,8 @@ -import { Box, LinearProgress } from '@material-ui/core' +import { Box } from '@material-ui/core' import { default as styled } from 'styled-components' -import Typography from '@/core/data-display/typography' -import { CheckCircle, Help as HelpIcon } from '@/icons' import { theme } from '@/theme' -const { feedback, grays } = theme.colors +const { feedback } = theme.colors interface IStepContainerProps { padding?: React.CSSProperties['padding'] @@ -24,21 +22,6 @@ interface IColumnProps { justifyContent: React.CSSProperties['justifyContent'] } -export const PROGRESS_BAR = { - barColorPrimary: 'barColorPrimary' -} - -export const TEXT_ALIGN = { textAlign: 'center' } as const - -export const ICON_BUTTON = { - backgroundColor: 'unset' -} - -export const ACORDION_DETAILS = { - display: 'flex', - justifyContent: 'space-between' -} - export const Container = styled.div<IContainerProps>` width: 100%; max-width: ${props => (props.fullWidth ? '100%' : '1100px')}; @@ -120,71 +103,6 @@ export const BarWrapper = styled(Box)` width: 100%; & .barColorPrimary { - background-color: ${theme.colors.feedback.success}; - } -` - -export const TypographyTitle = styled(Typography)` - && { - color: ${grays.g1}; - font-size: 24px; - text-align: center; - } -` - -export const TypographySubtitle = styled(Typography)` - && { - color: ${grays.g3}; - text-align: center; - } -` - -export const TypographyProgress = styled(Typography)` - && { - position: absolute; - right: 8; - } -` - -export const BottomProgressBar = styled(LinearProgress)` - && { - height: 16px; - background-color: ${grays.g5}; - } -` - -export const ProgressBar = styled(LinearProgress)` - && { - border-radius: 10px; - height: 16px; - background-color: ${grays.g5}; - } -` - -export const CheckIcon = styled(CheckCircle)<{ percentage: number }>` - && { - font-size: 40px; - color: ${props => - props.percentage === 100 ? feedback.success : grays.g3}; - } -` - -export const IconHelp = styled(HelpIcon)` - && { - margin: 0px; - } -` - -export const IconCheck = styled(CheckCircle)<{ done: boolean }>` - && { - font-size: 40px; - color: ${props => (props.done ? feedback.success : grays.g3)}; - } -` - -export const TypographyContainer = styled(Typography)` - && { - color: ${grays.g2}; - font-weight: 600; + background-color: ${feedback.success}; } ` From 647a04a3b0d7ed661947c9f3a5e04e47af1950a6 Mon Sep 17 00:00:00 2001 From: Karine Brandelli <karinebrandelli@live.com> Date: Thu, 7 Mar 2024 16:10:45 -0300 Subject: [PATCH 09/10] fix: exports --- src/core/data-display/data-table/data-table-field.tsx | 2 +- src/core/data-display/data-table/data-table.stories.tsx | 2 +- src/core/data-display/data-table/index.ts | 1 + src/experimental/auto-complete-lab/index.tsx | 2 +- src/experimental/button/index.tsx | 2 +- src/experimental/nothing-found/index.tsx | 2 +- src/experimental/nothing-found/nothing-found.spec.tsx | 2 +- src/experimental/nothing-found/nothing-found.stories.tsx | 2 +- 8 files changed, 8 insertions(+), 7 deletions(-) diff --git a/src/core/data-display/data-table/data-table-field.tsx b/src/core/data-display/data-table/data-table-field.tsx index dcc5e6e6..0c680139 100644 --- a/src/core/data-display/data-table/data-table-field.tsx +++ b/src/core/data-display/data-table/data-table-field.tsx @@ -25,7 +25,7 @@ interface ITable<D extends Record<string, unknown>> { } } -const DataTableField = <D extends Record<string, unknown>>( +export const DataTableField = <D extends Record<string, unknown>>( props: ITable<D> ) => { const { rows, header, checkbox, checkboxProps, setRows } = props diff --git a/src/core/data-display/data-table/data-table.stories.tsx b/src/core/data-display/data-table/data-table.stories.tsx index cf6dc214..03556a28 100644 --- a/src/core/data-display/data-table/data-table.stories.tsx +++ b/src/core/data-display/data-table/data-table.stories.tsx @@ -8,7 +8,7 @@ import Typography from '@/core/data-display/typography' import Button from '@/core/inputs/button' import { default as DataTable } from './data-table' import { DataTableAction } from './data-table-action' -import DataTableField from './data-table-field' +import { DataTableField } from './data-table-field' import { RowMode } from './types' import { Delete as DeleteIcon, diff --git a/src/core/data-display/data-table/index.ts b/src/core/data-display/data-table/index.ts index 20b2b608..51928874 100644 --- a/src/core/data-display/data-table/index.ts +++ b/src/core/data-display/data-table/index.ts @@ -1,5 +1,6 @@ export { default } from './data-table' export { DataTableAction } from './data-table-action' +export { DataTableField } from './data-table-field' export { default as DataTableQueryPaginated } from './data-table-query-paginated' export type { ActionsCellProps, diff --git a/src/experimental/auto-complete-lab/index.tsx b/src/experimental/auto-complete-lab/index.tsx index 7ceb2e3f..6371d060 100644 --- a/src/experimental/auto-complete-lab/index.tsx +++ b/src/experimental/auto-complete-lab/index.tsx @@ -19,7 +19,7 @@ const useStyles = makeStyles({ } }) -const Autocomplete: typeof MuiAutocomplete = props => { +export const Autocomplete: typeof MuiAutocomplete = props => { const { classes, ...otherProps } = props const styles = useStyles(props) diff --git a/src/experimental/button/index.tsx b/src/experimental/button/index.tsx index 82e8b967..05d831e2 100644 --- a/src/experimental/button/index.tsx +++ b/src/experimental/button/index.tsx @@ -11,7 +11,7 @@ export interface Props extends ButtonProps { onClick?(): void } -const AddButton = (props: Props) => ( +export const AddButton = (props: Props) => ( <ButtonAdd {...props} variant='dashed' diff --git a/src/experimental/nothing-found/index.tsx b/src/experimental/nothing-found/index.tsx index d50666ba..812ef4b6 100644 --- a/src/experimental/nothing-found/index.tsx +++ b/src/experimental/nothing-found/index.tsx @@ -10,7 +10,7 @@ export interface IProps extends TypographyProps { show: boolean } -const NothingFound = (props: IProps) => { +export const NothingFound = (props: IProps) => { const { buttonLabel, readonly, ...rest } = props const label = buttonLabel || 'Adicionar' const message = readonly diff --git a/src/experimental/nothing-found/nothing-found.spec.tsx b/src/experimental/nothing-found/nothing-found.spec.tsx index d202a685..fa5fe2c9 100644 --- a/src/experimental/nothing-found/nothing-found.spec.tsx +++ b/src/experimental/nothing-found/nothing-found.spec.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { render, screen } from '@testing-library/react' -import NothingFound from '.' +import { NothingFound } from '.' const Default = ({ show = true }: { show?: boolean }) => { return <NothingFound show={show} /> diff --git a/src/experimental/nothing-found/nothing-found.stories.tsx b/src/experimental/nothing-found/nothing-found.stories.tsx index a2227dbb..1ec33d9c 100644 --- a/src/experimental/nothing-found/nothing-found.stories.tsx +++ b/src/experimental/nothing-found/nothing-found.stories.tsx @@ -1,6 +1,6 @@ import React from 'react' import type { Meta, StoryFn } from '@storybook/react' -import NothingFound from '.' +import { NothingFound } from '.' export default { title: 'Experimental/NothingFound', From b14e2b4bc70fd707c76840d66691e328599cb926 Mon Sep 17 00:00:00 2001 From: Karine Brandelli <karinebrandelli@live.com> Date: Thu, 7 Mar 2024 16:10:56 -0300 Subject: [PATCH 10/10] chore: update minor version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 1f755557..2e3ccb36 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "flipper-ui", - "version": "0.31.1", + "version": "0.31.2", "description": "", "main": "dist/index.js", "homepage": "https://flipper-ui.ngi.com.br/",