Skip to content

Commit f88bf9b

Browse files
based-ghostbased-ghost
committed
update types and general code refactoring
1 parent 59617ce commit f88bf9b

33 files changed

+102
-112
lines changed

‎__stories__/helpers/components/Checkbox.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1+
import React from 'react';
12
import { hexToRgba } from '../utils';
23
import styled, { css } from 'styled-components';
3-
import React, { type FunctionComponent } from 'react';
44

55
type CheckboxProps = Readonly<{
66
label?: string;
@@ -104,7 +104,7 @@ const CheckIcon = styled.i`
104104
}
105105
`;
106106

107-
const Checkbox: FunctionComponent<CheckboxProps> = ({
107+
const Checkbox: React.FC<CheckboxProps> = ({
108108
label,
109109
onCheck,
110110
checked,

‎__stories__/helpers/components/OptionsCountButton.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1+
import React from 'react';
12
import { Button } from '../styled';
23
import { numberWithCommas } from '../utils';
34
import styled, { css } from 'styled-components';
4-
import React, { type FunctionComponent } from 'react';
55

66
type OptionsCountButtonProps = Readonly<{
77
count: number;
@@ -11,8 +11,8 @@ type OptionsCountButtonProps = Readonly<{
1111

1212
const StyledButton = styled(Button)<{ isActive?: boolean }>`
1313
width: 6rem;
14-
min-width: 6rem !important;
1514
transition: none;
15+
min-width: 6rem !important;
1616
1717
${({ isActive }) =>
1818
isActive
@@ -31,7 +31,7 @@ const StyledButton = styled(Button)<{ isActive?: boolean }>`
3131
}
3232
`;
3333

34-
const OptionsCountButton: FunctionComponent<OptionsCountButtonProps> = ({
34+
const OptionsCountButton: React.FC<OptionsCountButtonProps> = ({
3535
count,
3636
optionsCount,
3737
setOptionsCount

‎__stories__/helpers/components/PackageLink.tsx

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1+
import React from 'react';
12
import styled from 'styled-components';
2-
import React, { type FunctionComponent } from 'react';
33

44
type PackageLinkProps = Readonly<{
55
name: string;
@@ -18,10 +18,7 @@ const Link = styled.a`
1818
}
1919
`;
2020

21-
const PackageLink: FunctionComponent<PackageLinkProps> = ({
22-
name,
23-
href
24-
}) => (
21+
const PackageLink: React.FC<PackageLinkProps> = ({ name, href }) => (
2522
<Link
2623
href={href}
2724
target='_blank'

‎__stories__/helpers/constants/react-toastify.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,4 +13,4 @@ export const TOAST_CONTAINER_PROPS: ToastContainerProps = {
1313
draggable: false,
1414
newestOnTop: true,
1515
position: 'top-right'
16-
};
16+
} as const;

‎__stories__/helpers/constants/theme.ts

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,16 @@ export const ThemeEnum = {
3131
ZERO_BORDER_RADIUS: 'No border-radius'
3232
} as const;
3333

34+
export const THEME_CONFIG: Theme = {
35+
menu: {
36+
option: {
37+
selectedColor: '#515151',
38+
focusedBgColor: '#F5F5F5',
39+
selectedBgColor: '#F5F5F5'
40+
}
41+
}
42+
} as const;
43+
3444
export const ThemeConfigMap: Theme = {
3545
[ThemeEnum.DEFAULT]: undefined as any,
3646
[ThemeEnum.DARK_COLORS]: {
@@ -72,14 +82,4 @@ export const ThemeConfigMap: Theme = {
7282
} as const;
7383

7484
export const THEME_OPTIONS = createThemeOptions(ThemeEnum);
75-
export const THEME_DEFAULTS = mergeDeep(DEFAULT_THEME, THEME_ANIMATIONS);
76-
77-
export const THEME_CONFIG: Theme = {
78-
menu: {
79-
option: {
80-
selectedColor: '#515151',
81-
focusedBgColor: '#F5F5F5',
82-
selectedBgColor: '#F5F5F5'
83-
}
84-
}
85-
} as const;
85+
export const THEME_DEFAULTS = mergeDeep(DEFAULT_THEME, THEME_ANIMATIONS);

‎__stories__/helpers/hooks/useCallbackState.ts

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,8 @@
11
import { useCallback, useState } from 'react';
22

3-
const useCallbackState = <T>(initialState: T): [T, (newState: T) => void] => {
4-
const [state, setState] = useState<T>(initialState);
3+
const useCallbackState = <T>(initState: T): [T, (newState: T) => void] => {
4+
const [state, setState] = useState<T>(initState);
55
const setStateCallback = useCallback((newState: T): void => setState(newState), []);
6-
76
return [state, setStateCallback];
87
};
98

‎__stories__/helpers/styled/index.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ export const Columns = styled.div`
7171
}
7272
`;
7373

74-
export const Column = styled.div<{ widthPercent?: number }>`
74+
export const Column = styled.div<{widthPercent?: number}>`
7575
flex-grow: 1;
7676
flex-basis: 0;
7777
flex-shrink: 1;
@@ -83,9 +83,9 @@ export const Column = styled.div<{ widthPercent?: number }>`
8383
width: 100% !important;
8484
}
8585
86-
${({ widthPercent }) =>
87-
widthPercent
88-
&& css`
86+
${({widthPercent}) =>
87+
widthPercent &&
88+
css`
8989
flex: none;
9090
width: ${widthPercent}%;
9191
`}

‎__stories__/helpers/utils/index.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -30,10 +30,10 @@ export const createSelectOptions = (optionCount: number): Option[] => {
3030
return results;
3131
};
3232

33-
export const createThemeOptions = (ThemeEnum: any): Option[] => {
34-
return Object.keys(ThemeEnum).map((key) => ({
35-
value: ThemeEnum[key],
36-
label: ThemeEnum[key]
33+
export const createThemeOptions = (themeEnum: any): Option[] => {
34+
return Object.keys(themeEnum).map((key) => ({
35+
value: themeEnum[key],
36+
label: themeEnum[key]
3737
}));
3838
};
3939

‎__tests__/AriaLiveRegion.test.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import React, { type ComponentProps } from 'react';
22
import { render } from '@testing-library/react';
33
import AriaLiveRegion from '../src/components/AriaLiveRegion';
4-
import { getSelectedOptionMulti, ThemeTestHOC } from './helpers';
5-
import type { AriaLiveAttribute, FocusedOption, SelectedOption } from '../src/types';
4+
import { getSelectedOptionMulti, ThemeWrapper } from './helpers';
65
import { ARIA_LIVE_CONTEXT_ID, ARIA_LIVE_SELECTION_ID } from '../src/constants';
6+
import type { AriaLiveAttribute, FocusedOption, SelectedOption } from '../src/types';
77

88
type AriaLiveRegionProps = ComponentProps<typeof AriaLiveRegion>;
99

@@ -13,9 +13,9 @@ type AriaLiveRegionProps = ComponentProps<typeof AriaLiveRegion>;
1313

1414
const renderAriaLiveRegion = (props: AriaLiveRegionProps) => {
1515
return render(
16-
<ThemeTestHOC>
16+
<ThemeWrapper>
1717
<AriaLiveRegion {...props} />
18-
</ThemeTestHOC>
18+
</ThemeWrapper>
1919
);
2020
};
2121

‎__tests__/AutosizeInput.test.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React, { type ComponentProps } from 'react';
2-
import { ThemeTestHOC } from './helpers';
2+
import { ThemeWrapper } from './helpers';
33
import userEvent from '@testing-library/user-event';
44
import { render, fireEvent } from '@testing-library/react';
55
import AutosizeInput from '../src/components/AutosizeInput';
@@ -15,9 +15,9 @@ const renderAutosizeInput = (props: AutosizeInputProps) => {
1515
return {
1616
user: userEvent.setup(),
1717
...render(
18-
<ThemeTestHOC>
18+
<ThemeWrapper>
1919
<AutosizeInput {...props} />
20-
</ThemeTestHOC>
20+
</ThemeWrapper>
2121
)
2222
};
2323
};

‎__tests__/IndicatorIcons.test.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React, { type ReactNode, type ComponentProps } from 'react';
2-
import { ThemeTestHOC } from './helpers';
2+
import { ThemeWrapper } from './helpers';
33
import { render } from '@testing-library/react';
44
import userEvent from '@testing-library/user-event';
55
import IndicatorIcons from '../src/components/IndicatorIcons';
@@ -15,9 +15,9 @@ const renderIndicatorIcons = (props: IndicatorIconsProps) => {
1515
return {
1616
user: userEvent.setup(),
1717
...render(
18-
<ThemeTestHOC>
18+
<ThemeWrapper>
1919
<IndicatorIcons {...props} />
20-
</ThemeTestHOC>
20+
</ThemeWrapper>
2121
)
2222
};
2323
};

‎__tests__/LoadingDots.test.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from 'react';
2-
import { ThemeTestHOC } from './helpers';
2+
import { ThemeWrapper } from './helpers';
33
import { render } from '@testing-library/react';
44
import LoadingDots from '../src/components/IndicatorIcons/LoadingDots';
55

@@ -9,9 +9,9 @@ import LoadingDots from '../src/components/IndicatorIcons/LoadingDots';
99

1010
const renderAriaLiveRegion = () => {
1111
return render(
12-
<ThemeTestHOC>
12+
<ThemeWrapper>
1313
<LoadingDots />
14-
</ThemeTestHOC>
14+
</ThemeWrapper>
1515
);
1616
};
1717

‎__tests__/MenuList.test.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React, { type ComponentProps } from 'react';
2-
import { ThemeTestHOC } from './helpers';
2+
import { ThemeWrapper } from './helpers';
33
import type { MenuOption } from '../src';
44
import { render } from '@testing-library/react';
55
import MenuList from '../src/components/Menu/MenuList';
@@ -20,9 +20,9 @@ type MenuListProps = ComponentProps<typeof MenuList>;
2020

2121
const renderMenuList = (props: MenuListProps) => {
2222
return render(
23-
<ThemeTestHOC>
23+
<ThemeWrapper>
2424
<MenuList {...props} />
25-
</ThemeTestHOC>
25+
</ThemeWrapper>
2626
);
2727
};
2828

‎__tests__/MultiValue.test.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { render } from '@testing-library/react';
33
import userEvent from '@testing-library/user-event';
44
import { CLEAR_ICON_MV_TESTID } from '../src/constants';
55
import MultiValue from '../src/components/Value/MultiValue';
6-
import { renderOptionLabelMock, getOptionSingle, ThemeTestHOC, type Option } from './helpers';
6+
import { renderOptionLabelMock, getOptionSingle, ThemeWrapper, type Option } from './helpers';
77

88
type MultiValueProps = ComponentProps<typeof MultiValue>;
99

@@ -15,9 +15,9 @@ const renderMultiValue = (props: MultiValueProps) => {
1515
return {
1616
user: userEvent.setup(),
1717
...render(
18-
<ThemeTestHOC>
18+
<ThemeWrapper>
1919
<MultiValue {...props} />
20-
</ThemeTestHOC>
20+
</ThemeWrapper>
2121
)
2222
};
2323
};

‎__tests__/Option.test.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { render } from '@testing-library/react';
44
import Option from '../src/components/Menu/Option';
55
import userEvent from '@testing-library/user-event';
66
import { OPTION_DISABLED_CLS } from '../src/constants';
7-
import { renderOptionLabelMock, stringifyCSSProperties, ThemeTestHOC, MENU_OPTIONS } from './helpers';
7+
import { renderOptionLabelMock, stringifyCSSProperties, ThemeWrapper, MENU_OPTIONS } from './helpers';
88

99
type OptionProps = ComponentProps<typeof Option>;
1010

@@ -16,9 +16,9 @@ const renderOption = (props: OptionProps) => {
1616
return {
1717
user: userEvent.setup(),
1818
...render(
19-
<ThemeTestHOC>
19+
<ThemeWrapper>
2020
<Option {...props} />
21-
</ThemeTestHOC>
21+
</ThemeWrapper>
2222
)
2323
};
2424
};

‎__tests__/Value.test.tsx

Lines changed: 7 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import React, { type ComponentProps } from 'react';
22
import Value from '../src/components/Value';
33
import { render } from '@testing-library/react';
4-
import type { SelectedOption } from '../src/types';
4+
import type { CallbackFn, SelectedOption } from '../src/types';
55
import { PLACEHOLDER_DEFAULT, EMPTY_ARRAY } from '../src/constants';
6-
import { renderOptionLabelMock, renderMultiOptionsMock, getSelectedOptionSingle, ThemeTestHOC } from './helpers';
6+
import { renderOptionLabelMock, renderMultiOptionsMock, getSelectedOptionSingle, ThemeWrapper } from './helpers';
77

88
type ValueProps = ComponentProps<typeof Value>;
99

@@ -13,20 +13,17 @@ type ValueProps = ComponentProps<typeof Value>;
1313

1414
const renderValue = (props: ValueProps) => {
1515
return render(
16-
<ThemeTestHOC>
16+
<ThemeWrapper>
1717
<Value {...props} />
18-
</ThemeTestHOC>
18+
</ThemeWrapper>
1919
);
2020
};
2121

22-
const rerenderValue = (
23-
props: ValueProps,
24-
rerender: (...args: any[]) => any
25-
): void => {
22+
const rerenderValue = (props: ValueProps, rerender: CallbackFn): void => {
2623
rerender(
27-
<ThemeTestHOC>
24+
<ThemeWrapper>
2825
<Value {...props} />
29-
</ThemeTestHOC>
26+
</ThemeWrapper>
3027
);
3128
};
3229

‎__tests__/helpers/ThemeTestHOC.tsx renamed to ‎__tests__/helpers/ThemeWrapper.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,10 @@ import React from 'react';
22
import { ThemeProvider } from 'styled-components';
33
import { DEFAULT_THEME } from '../../src/constants';
44

5-
const ThemeTestHOC = ({ children }) => (
5+
const ThemeWrapper = ({ children }) => (
66
<ThemeProvider theme={DEFAULT_THEME}>
77
{children}
88
</ThemeProvider>
99
);
1010

11-
export default ThemeTestHOC;
11+
export default ThemeWrapper;

‎__tests__/helpers/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
11
export * from './utils';
2-
export { default as ThemeTestHOC } from './ThemeTestHOC';
2+
export { default as ThemeWrapper } from './ThemeWrapper';

‎__tests__/helpers/utils.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ export const stringifyCSSProperties = (obj: CSSProperties = {}): string => {
6565

6666
export const renderMultiOptionsMock = jest.fn(
6767
({selected, renderOptionLabel}: MultiParams): ReactNode => {
68-
return selected.map((option) => renderOptionLabel(option.data)).join(', ');
68+
return selected.map((x) => renderOptionLabel(x.data)).join(', ');
6969
}
7070
);
7171

‎package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -67,13 +67,13 @@
6767
"@testing-library/react": "^13.4.0",
6868
"@testing-library/user-event": "^14.4.3",
6969
"@types/jest": "^29.2.4",
70-
"@types/node": "^18.11.11",
70+
"@types/node": "^18.11.12",
7171
"@types/react": "^18.0.26",
7272
"@types/react-dom": "^18.0.9",
7373
"@types/react-window": "^1.8.5",
7474
"@types/styled-components": "^5.1.26",
75-
"@typescript-eslint/eslint-plugin": "^5.45.1",
76-
"@typescript-eslint/parser": "^5.45.1",
75+
"@typescript-eslint/eslint-plugin": "^5.46.0",
76+
"@typescript-eslint/parser": "^5.46.0",
7777
"babel-jest": "^29.3.1",
7878
"babel-loader": "^9.1.0",
7979
"babel-plugin-styled-components": "^2.0.7",
@@ -96,7 +96,7 @@
9696
"react-toastify": "^9.1.1",
9797
"react-window": "^1.8.8",
9898
"rimraf": "^3.0.2",
99-
"rollup": "^3.6.0",
99+
"rollup": "^3.7.0",
100100
"styled-components": "^5.3.6",
101101
"typescript": "^4.9.4",
102102
"webpack": "^5.75.0"

‎rollup.config.mjs renamed to ‎rollup.config.js

File renamed without changes.

0 commit comments

Comments
 (0)