) => onChange(e.target.checked), [onChange])
9 |
10 | return (
11 | }
13 | disableTypography
14 | label={
15 |
16 | {label}
17 |
18 | }
19 | />
20 | )
21 | }
22 |
23 | ControlledCheckbox.propTypes = {
24 | value: PropTypes.bool,
25 | onChange: PropTypes.func,
26 | label: PropTypes.string.isRequired
27 | }
28 |
29 | export default ControlledCheckbox
30 |
--------------------------------------------------------------------------------
/src/stories/inputs/Autocomplete/components/FormattedJson.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 |
4 | const FormattedJson = ({ children }: { children: React.ReactNode }) => (
5 | {JSON.stringify(children, null, 3)}
6 | )
7 |
8 | FormattedJson.propTypes = {
9 | children: PropTypes.oneOfType([PropTypes.array, PropTypes.object, PropTypes.number, PropTypes.string])
10 | }
11 |
12 | export default FormattedJson
13 |
--------------------------------------------------------------------------------
/src/stories/inputs/DateTime/ClearablePreview.tsx:
--------------------------------------------------------------------------------
1 | // Copyright (c) TotalSoft.
2 | // This source code is licensed under the MIT license.
3 |
4 | import React from 'react'
5 | import Grid from '@mui/material/Grid2'
6 | import { DateTime } from 'components'
7 |
8 | const ClearablePreview = () => {
9 | return (
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 | )
22 | }
23 |
24 | export default ClearablePreview
25 |
--------------------------------------------------------------------------------
/src/stories/inputs/DateTime/DisabledPreview.tsx:
--------------------------------------------------------------------------------
1 | // Copyright (c) TotalSoft.
2 | // This source code is licensed under the MIT license.
3 |
4 | import React from 'react'
5 | import Grid from '@mui/material/Grid2'
6 | import { DateTime } from 'components'
7 |
8 | const value = new Date()
9 |
10 | const DisabledPreview = () => {
11 | return (
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 | )
24 | }
25 |
26 | export default DisabledPreview
27 |
--------------------------------------------------------------------------------
/src/stories/inputs/DateTime/FormatPreview.tsx:
--------------------------------------------------------------------------------
1 | // Copyright (c) TotalSoft.
2 | // This source code is licensed under the MIT license.
3 |
4 | import React, { useCallback, useState } from 'react'
5 | import { Grid2 as Grid, ToggleButton, ToggleButtonGroup } from '@mui/material'
6 | import { DateTime, DateTimeProps } from 'components'
7 |
8 | const formatMap = ['fr', 'en-US', 'ro', 'de']
9 |
10 | const FormatPreview = () => {
11 | const [format, setFormat] = useState['localeFormat']>('en-US')
12 |
13 | const handleClick = useCallback((e: any) => {
14 | setFormat(e.target.value)
15 | }, [])
16 |
17 | return (
18 |
19 |
20 |
21 | {formatMap.map(localeItem => (
22 |
23 | {localeItem}
24 |
25 | ))}
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 | )
39 | }
40 |
41 | export default FormatPreview
42 |
--------------------------------------------------------------------------------
/src/stories/inputs/DeprecatedAutocomplete/CheckboxesPreview.tsx:
--------------------------------------------------------------------------------
1 | // Copyright (c) TotalSoft.
2 | // This source code is licensed under the MIT license.
3 |
4 | import React, { useState } from 'react'
5 | import { DeprecatedAutocomplete } from 'components'
6 | import { emptyArray } from 'components/utils/constants'
7 |
8 | export const CheckboxesPreview = (props: any) => {
9 | const [value, setValue] = useState(emptyArray)
10 |
11 | return
12 | }
13 |
--------------------------------------------------------------------------------
/src/stories/inputs/DeprecatedAutocomplete/CustomOptionPreview.tsx:
--------------------------------------------------------------------------------
1 | // Copyright (c) TotalSoft.
2 | // This source code is licensed under the MIT license.
3 |
4 | import React, { useState } from 'react'
5 | import { DeprecatedAutocomplete, Typography } from 'components'
6 | import Box from '@mui/material/Box'
7 |
8 | export const CustomOptionPreview = (props: any) => {
9 | const [value, setValue] = useState()
10 |
11 | return (
12 | (
17 |
18 |
19 |
20 | {option.name}
21 |
22 | {option.description}
23 |
24 |
25 |
26 | )}
27 | />
28 | )
29 | }
30 |
--------------------------------------------------------------------------------
/src/stories/inputs/DeprecatedAutocomplete/DefaultPreview.tsx:
--------------------------------------------------------------------------------
1 | // Copyright (c) TotalSoft.
2 | // This source code is licensed under the MIT license.
3 |
4 | import React, { useState } from 'react'
5 | import { DeprecatedAutocomplete, Typography } from 'components'
6 | import { Stack } from '@mui/material'
7 |
8 | export const DefaultPreview = (props: any) => {
9 | const [value, setValue] = useState(props?.value)
10 |
11 | return (
12 |
13 |
14 | {`Selected value: ${JSON.stringify(value)}`}
15 |
16 | )
17 | }
18 |
--------------------------------------------------------------------------------
/src/stories/inputs/DeprecatedAutocomplete/GroupedPreview.tsx:
--------------------------------------------------------------------------------
1 | // Copyright (c) TotalSoft.
2 | // This source code is licensed under the MIT license.
3 |
4 | import React, { useCallback, useState } from 'react'
5 | import { DeprecatedAutocomplete } from 'components'
6 | import { emptyArray } from 'components/utils/constants'
7 | import { groupedOptions } from './_mocks'
8 | import { styled } from '@mui/material'
9 |
10 | const GroupHeader = styled('div')(({ theme }) => ({
11 | ...theme.typography.defaultFont,
12 | padding: '4px 10px',
13 | fontWeight: 'bold'
14 | }))
15 |
16 | const GroupItems = styled('ul')(({ theme }) => ({
17 | ...theme.typography.defaultFont,
18 | paddingLeft:'5px'
19 | }))
20 |
21 | export const GroupedPreview = (props: any) => {
22 | const [value, setValue] = useState(emptyArray)
23 |
24 | const groupBy = useCallback((option: any) => option.category?.name, [])
25 |
26 | const renderGroup = useCallback(
27 | (params: any) => (
28 |
29 | {params.group}
30 | {params.children}
31 |
32 | ),
33 | []
34 | )
35 |
36 | return (
37 |
46 | )
47 | }
48 |
--------------------------------------------------------------------------------
/src/stories/inputs/DeprecatedAutocomplete/RequiredPreview.tsx:
--------------------------------------------------------------------------------
1 | import React, { useState } from 'react'
2 | import Grid from '@mui/material/Grid2'
3 | import { options } from './_mocks'
4 | import { DeprecatedAutocomplete } from 'components'
5 |
6 | export const RequiredPreview = () => {
7 | const [requiredValue, setRequiredValue] = useState()
8 | const [errorValue, setErrorValue] = useState()
9 | const [helperValue, setHelperValue] = useState()
10 |
11 | return (
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
28 |
29 |
30 |
37 |
38 |
39 |
40 | )
41 | }
42 |
--------------------------------------------------------------------------------
/src/stories/inputs/DeprecatedAutocomplete/components/ColumnHeader.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 | import { Typography } from 'components'
4 |
5 | const ColumnHeader = ({ children }: { children: React.ReactNode }) => (
6 |
7 | {children}
8 |
9 | )
10 | ColumnHeader.propTypes = {
11 | children: PropTypes.node
12 | }
13 |
14 | export default ColumnHeader
15 |
--------------------------------------------------------------------------------
/src/stories/inputs/DeprecatedAutocomplete/components/ControlledCheckBox.tsx:
--------------------------------------------------------------------------------
1 | import React, { useCallback } from 'react'
2 | import PropTypes from 'prop-types'
3 | import FormControlLabel from '@mui/material/FormControlLabel'
4 | import Checkbox from '@mui/material/Checkbox'
5 | import { Typography } from 'components'
6 |
7 | const ControlledCheckbox = ({ value, onChange, label }: { value: boolean; onChange: any; label: string }) => {
8 | const handleChange = useCallback((e: React.ChangeEvent) => onChange(e.target.checked), [onChange])
9 |
10 | return (
11 | }
13 | disableTypography
14 | label={
15 |
16 | {label}
17 |
18 | }
19 | />
20 | )
21 | }
22 |
23 | ControlledCheckbox.propTypes = {
24 | value: PropTypes.bool,
25 | onChange: PropTypes.func,
26 | label: PropTypes.string.isRequired
27 | }
28 |
29 | export default ControlledCheckbox
30 |
--------------------------------------------------------------------------------
/src/stories/inputs/DeprecatedAutocomplete/components/FormattedJson.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 |
4 | const FormattedJson = ({ children }: { children: React.ReactNode }) => (
5 | {JSON.stringify(children, null, 3)}
6 | )
7 |
8 | FormattedJson.propTypes = {
9 | children: PropTypes.oneOfType([PropTypes.array, PropTypes.object, PropTypes.number, PropTypes.string])
10 | }
11 |
12 | export default FormattedJson
13 |
--------------------------------------------------------------------------------
/src/stories/inputs/PasswordField/StatesPreview.tsx:
--------------------------------------------------------------------------------
1 | // Copyright (c) TotalSoft.
2 | // This source code is licensed under the MIT license.
3 |
4 | import React from 'react'
5 | import Grid from '@mui/material/Grid2'
6 | import { PasswordField } from 'components'
7 |
8 | const StatesPreview = () => {
9 | return (
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 | )
24 | }
25 |
26 | export default StatesPreview
27 |
--------------------------------------------------------------------------------
/src/stories/inputs/PasswordField/VariantsPreview.tsx:
--------------------------------------------------------------------------------
1 | // Copyright (c) TotalSoft.
2 | // This source code is licensed under the MIT license.
3 |
4 | import React from 'react'
5 | import Grid from '@mui/material/Grid2'
6 | import { PasswordField } from 'components'
7 |
8 | const VariantsPreview = () => {
9 | return (
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 | )
24 | }
25 |
26 | export default VariantsPreview
27 |
--------------------------------------------------------------------------------
/src/stories/inputs/Tags/DefaultPreview.tsx:
--------------------------------------------------------------------------------
1 | import React, { useState } from 'react'
2 | import Grid from '@mui/material/Grid2'
3 | import TagsInput from 'components/inputs/Tags/TagsInput'
4 | import DisplayTags from 'components/inputs/Tags/DisplayTags'
5 |
6 | const DefaultPreview = (args: any) => {
7 | const [inputValue, setInputValue] = useState(['test'])
8 | return (
9 |
10 |
11 |
18 |
19 |
20 |
21 |
22 |
23 | )
24 | }
25 |
26 | export default DefaultPreview
27 |
--------------------------------------------------------------------------------
/src/stories/inputs/TextField/NumericPreview.tsx:
--------------------------------------------------------------------------------
1 | // Copyright (c) TotalSoft.
2 | // This source code is licensed under the MIT license.
3 |
4 | import React, { useState } from 'react'
5 | import { TextField } from 'components'
6 | import Grid from '@mui/material/Grid2'
7 |
8 | const NumericPreview = () => {
9 | const [numberValue, setNumberValue] = useState()
10 | const [internationalValue, setInternationalValue] = useState(50)
11 |
12 | const handleValue = (value: any) => {
13 | setNumberValue(value)
14 | }
15 |
16 | const handleInternationalValue = (value: any) => {
17 | setInternationalValue(value)
18 | }
19 |
20 | return (
21 |
22 |
23 |
32 |
33 |
34 |
42 |
43 |
44 |
53 |
54 |
55 | )
56 | }
57 |
58 | export default NumericPreview
59 |
--------------------------------------------------------------------------------
/src/stories/inputs/TextField/ValidationPreview.tsx:
--------------------------------------------------------------------------------
1 | // Copyright (c) TotalSoft.
2 | // This source code is licensed under the MIT license.
3 | import React from 'react'
4 | import Grid from '@mui/material/Grid2'
5 | import { TextField } from 'components'
6 |
7 | const ValidationPreview = () => {
8 | return (
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 | )
30 | }
31 |
32 | export default ValidationPreview
33 |
--------------------------------------------------------------------------------
/src/stories/inputs/TextField/VariantsPreview.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { TextField } from 'components'
3 | import Grid from '@mui/material/Grid2'
4 |
5 | const VariantsPreview = () => {
6 | return (
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 | )
19 | }
20 |
21 | export default VariantsPreview
22 |
--------------------------------------------------------------------------------
/src/stories/navigation/NavPills/ControlledPreview.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import Grid from '@mui/material/Grid2'
3 | import { NavPills } from 'components'
4 | import { tabs } from './_options'
5 | import SyntaxHighlighter from 'react-syntax-highlighter'
6 | import { github } from 'react-syntax-highlighter/dist/esm/styles/hljs'
7 |
8 | const controlled = `function ControlledNavPills({tabs}) {
9 | const [active, setActive] = useState(0)
10 |
11 | const handleChange = (event, newValue) => {
12 | setActive(newValue)
13 | }
14 |
15 | return(
16 |
21 | )
22 | `
23 |
24 | const uncontrolled = `function UncontrolledNavPills({tabs}) {
25 | return(
26 |
29 | )
30 | `
31 |
32 | const ControlledPreview = () => {
33 | return (
34 |
35 |
36 |
37 |
38 |
39 |
40 | {controlled}
41 |
42 |
43 |
44 |
45 | {uncontrolled}
46 |
47 |
48 |
49 | )
50 | }
51 |
52 | export default ControlledPreview
53 |
--------------------------------------------------------------------------------
/src/stories/navigation/NavPills/FilledPreview.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import Grid from '@mui/material/Grid2'
3 | import { tabs } from './_options'
4 | import { NavPills } from 'components'
5 | import SyntaxHighlighter from 'react-syntax-highlighter'
6 | import { github } from 'react-syntax-highlighter/dist/esm/styles/hljs'
7 |
8 | const FilledPreview = () => {
9 | return (
10 |
11 |
12 |
13 | {''}
14 |
15 |
16 |
17 |
18 |
19 | {''}
20 |
21 |
22 |
23 |
24 |
25 | {''}
26 |
27 |
28 |
29 |
30 | )
31 | }
32 |
33 | export default FilledPreview
34 |
--------------------------------------------------------------------------------
/src/stories/navigation/NavPills/OrientationPreview.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import Grid from '@mui/material/Grid2'
3 | import { tabs } from './_options'
4 | import { NavPills } from 'components'
5 |
6 | const OrientationPreview = () => {
7 | return (
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 | )
17 | }
18 |
19 | export default OrientationPreview
20 |
--------------------------------------------------------------------------------
/src/stories/navigation/NavPills/WithActionsPreview.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import Grid from '@mui/material/Grid2'
3 | import { tabs } from './_options'
4 | import { IconButton, NavPills } from 'components'
5 |
6 | const WithActionsPreview = () => {
7 | const actions = [
8 | ,
9 | ,
10 |
11 | ]
12 |
13 | return (
14 |
15 |
16 |
17 |
18 |
19 | )
20 | }
21 |
22 | export default WithActionsPreview
23 |
--------------------------------------------------------------------------------
/src/stories/navigation/NavPills/WithIconsPreview.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import Grid from '@mui/material/Grid2'
3 | import { tabs } from './_options'
4 | import { NavPills } from 'components'
5 |
6 | const WithIconsPreview = () => {
7 | return (
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 | )
23 | }
24 |
25 | export default WithIconsPreview
26 |
--------------------------------------------------------------------------------
/src/stories/navigation/NavPills/_options.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { Typography } from '@mui/material'
3 | import CarRepair from '@mui/icons-material/CarRepair'
4 | import Phone from '@mui/icons-material/Phone'
5 | import Rocket from '@mui/icons-material/Rocket'
6 | import ShieldMoonSharp from '@mui/icons-material/ShieldMoonSharp'
7 |
8 | export const tabs = (withIcons: boolean, withText: boolean) => [
9 | {
10 | label: withText && 'Item one',
11 | icon: withIcons ? : undefined,
12 | content: {'Content 1'}
13 | },
14 | {
15 | label: withText && 'Item two',
16 | icon: withIcons ? : undefined,
17 | content: {'Content 2'}
18 | },
19 | {
20 | label: withText && 'Item three',
21 | icon: withIcons ? : undefined,
22 | content: {'Content 3'}
23 | },
24 | {
25 | label: withText && 'Item four',
26 | icon: withIcons ? : undefined,
27 | content: {'Content 4'}
28 | }
29 | ]
30 |
--------------------------------------------------------------------------------
/src/stories/navigation/Pagination/DefaultPreview.tsx:
--------------------------------------------------------------------------------
1 | import { Pagination } from 'components'
2 | import React, { useCallback, useState } from 'react'
3 |
4 | const DefaultPreview = (args: any) => {
5 | const [page, setPage] = useState(0)
6 | const [pageSize, setPageSize] = useState(10)
7 |
8 | const handleChangePage = useCallback((value: number) => {
9 | setPage(value)
10 | }, [])
11 |
12 | const handleChangeRowsPerPage = useCallback((value: number) => {
13 | setPageSize(value)
14 | setPage(0)
15 | }, [])
16 |
17 | return (
18 |
25 | )
26 | }
27 |
28 | export default DefaultPreview
29 |
--------------------------------------------------------------------------------
/src/stories/navigation/Pagination/WithFirstAndLastPreview.tsx:
--------------------------------------------------------------------------------
1 | import { Pagination } from 'components'
2 | import React, { useCallback, useState } from 'react'
3 |
4 | const WithFirstAndLastPreview = () => {
5 | const [page, setPage] = useState(0)
6 | const [pageSize, setPageSize] = useState(10)
7 |
8 | const handleChangePage = useCallback((value: number) => {
9 | setPage(value)
10 | }, [])
11 |
12 | const handleChangeRowsPerPage = useCallback((value: number) => {
13 | setPageSize(value)
14 | setPage(0)
15 | }, [])
16 |
17 | return (
18 |
27 | )
28 | }
29 |
30 | export default WithFirstAndLastPreview
31 |
--------------------------------------------------------------------------------
/src/stories/navigation/Pagination/WithNoCountPreview.tsx:
--------------------------------------------------------------------------------
1 | import { Pagination } from 'components'
2 | import React, { useCallback, useState } from 'react'
3 |
4 | const WithNoCountPreview = () => {
5 | const [page, setPage] = useState(0)
6 | const [pageSize, setPageSize] = useState(10)
7 | const hasNextPage = page >= 0
8 | const hasPreviousPage = page > 0
9 |
10 | const handleChangePage = useCallback((value: number) => {
11 | setPage(value)
12 | }, [])
13 |
14 | const handleChangeRowsPerPage = useCallback((value: number) => {
15 | setPageSize(value)
16 | setPage(0)
17 | }, [])
18 |
19 | return (
20 |
28 | )
29 | }
30 |
31 | export default WithNoCountPreview
32 |
--------------------------------------------------------------------------------
/src/stories/surfaces/Accordion/ActionsPreview.tsx:
--------------------------------------------------------------------------------
1 | import React, { useCallback, useState } from 'react'
2 | import Grid from '@mui/material/Grid2'
3 | import { Accordion, Autocomplete, IconButton, Typography } from 'components'
4 | import { mockedAccordionContent } from './_mocks'
5 | import { options } from 'stories/inputs/Autocomplete/_mocks'
6 |
7 | const { content } = mockedAccordionContent
8 |
9 | const ActionsPreview = () => {
10 | const [value, setValue] = useState()
11 |
12 | const handleChange = useCallback((val: any) => {
13 | setValue(val)
14 | }, [])
15 |
16 | const handleDelete = useCallback((event: any) => {
17 | event.stopPropagation()
18 | }, [])
19 |
20 | return (
21 |
24 |
25 |
26 | {'Accordion Title'}
27 |
28 |
29 |
30 |
37 | {`Selected value: ${JSON.stringify(value)}`}
38 |
39 |
40 |
41 |
42 |
43 | }
44 | content={content}
45 | />
46 | )
47 | }
48 |
49 | export default ActionsPreview
50 |
--------------------------------------------------------------------------------
/src/stories/surfaces/Card/FilledPreview.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { Card, Button, IconButton, Typography } from 'components'
3 | import QuestionMark from '@mui/icons-material/QuestionMark'
4 | import { Grid2 as Grid, TextField } from '@mui/material'
5 |
6 | const FilledPreview = () => {
7 | return (
8 |
13 | SUBMIT
14 |
15 | }
16 | actions={
17 |
18 |
19 |
20 | }
21 | >
22 |
23 |
24 | Please, fill in with your personal information.
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 | )
41 | }
42 |
43 | export default FilledPreview
44 |
--------------------------------------------------------------------------------
/src/stories/surfaces/CollapseCard/FilledPreview.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { Button, IconButton, Typography, CollapseCard } from 'components'
3 | import QuestionMark from '@mui/icons-material/QuestionMark'
4 | import { Grid2 as Grid, TextField } from '@mui/material'
5 |
6 | const FilledPreview = (args: any) => {
7 | return (
8 |
13 | SUBMIT
14 |
15 | }
16 | actions={
17 |
18 |
19 |
20 | }
21 | {...args}
22 | >
23 |
24 |
25 | Please, fill in with your personal information.
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 | )
42 | }
43 |
44 | export default FilledPreview
45 |
--------------------------------------------------------------------------------
/src/testingUtils/TestingWrapper.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 | import { ThemeProvider } from '@mui/material/styles'
4 | import defaultTheme from '../components/themes/defaultTheme'
5 | import { ToastContainer } from 'components'
6 |
7 | const TestingWrapper = ({ children }: any) => {
8 | return (
9 |
10 |
11 | {children}
12 |
13 | )
14 | }
15 |
16 | TestingWrapper.propTypes = {
17 | children: PropTypes.node
18 | }
19 |
20 | export default TestingWrapper
21 |
--------------------------------------------------------------------------------
/src/testingUtils/index.ts:
--------------------------------------------------------------------------------
1 | import { render, fireEvent, renderHook, RenderOptions, RenderHookOptions } from '@testing-library/react'
2 | import TestingWrapper from './TestingWrapper'
3 |
4 | const customRender = (ui: JSX.Element, options?: RenderOptions | undefined) =>
5 | render(ui, { wrapper: TestingWrapper, ...options })
6 | const customRenderHook = (
7 | hook: (initialProps: unknown) => unknown,
8 | options?: RenderHookOptions | undefined
9 | ) => renderHook(hook, { wrapper: TestingWrapper, ...options })
10 |
11 | // more comprehensive simulation of a user click (mousedown + click)
12 | const userClick = (element: any) => {
13 | fireEvent.mouseDown(element)
14 | fireEvent.mouseUp(element)
15 | element.click()
16 | }
17 |
18 | export * from '@testing-library/react'
19 | export { customRender as render, userClick, customRenderHook as renderHook }
20 |
--------------------------------------------------------------------------------
/tsconfig.build.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "./tsconfig",
3 | "exclude": [
4 | "**/*.test.*",
5 | "**/__mocks__/*",
6 | "**/src/stories/*",
7 | "**/.storybook/*",
8 | "**/src/setupTests.ts",
9 | "**/src/testingUtils/*"
10 | ]
11 | }
12 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "ESNext",
4 | "lib": ["dom", "dom.iterable", "esnext"],
5 | "allowJs": true,
6 | "allowSyntheticDefaultImports": true,
7 | "module": "esnext",
8 | "moduleResolution": "node",
9 | "resolveJsonModule": true,
10 | "isolatedModules": true,
11 | "noEmit": false,
12 | "declaration": true,
13 | "sourceMap": true,
14 | "rootDir": "./src",
15 | "outDir": "./dist",
16 | "strict": true,
17 | "noImplicitReturns": false,
18 | "noFallthroughCasesInSwitch": true,
19 | "noUnusedLocals": true,
20 | "noUnusedParameters": true,
21 | "jsx": "react",
22 | "esModuleInterop": true,
23 | "skipLibCheck": true,
24 | "forceConsistentCasingInFileNames": true,
25 | "baseUrl": "src",
26 | "strictNullChecks": false
27 | },
28 | "include": ["src"],
29 | "exclude": ["dist", "node_modules"]
30 | }
31 |
--------------------------------------------------------------------------------