Skip to content

Commit 5cf731d

Browse files
Added support for node 16, formatting and linting (rjsf-team#2937)
- Regenerated the `package-lock.json` file with node-16 - Also added packages to support linting - Explicity added the latest `prettier` because it in implicitly picking up the wrong one - Added the `cs-check`, `cs-format` and `lint` scripts along with `lint-staged` to the `package.json` file - Ran `eslint --fix` and `cs-format` over the `src` and `test` directories to fix the build - Added a slight adaptation of the `.eslintrc` file from `core` to this package - Added `.npmrc` to enable `legacy-peer-deps` to allow things to work with node 16 - Deleted `.prettierrc` since the override is no longer needed
1 parent 28d3b1f commit 5cf731d

File tree

27 files changed

+28875
-13617
lines changed

27 files changed

+28875
-13617
lines changed

packages/chakra-ui/.eslintrc

+37
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
{
2+
"parser": "@typescript-eslint/parser",
3+
"rules": {
4+
"react/jsx-uses-react": 2,
5+
"react/jsx-uses-vars": 2,
6+
"react/react-in-jsx-scope": 2,
7+
"react/jsx-tag-spacing": [1, {
8+
"beforeSelfClosing": "always"
9+
}],
10+
"curly": [2],
11+
"linebreak-style": [2, "unix"],
12+
"semi": [2, "always"],
13+
"comma-dangle": [0],
14+
"@typescript-eslint/no-unused-vars": [2, {
15+
"vars": "all",
16+
"args": "none",
17+
"ignoreRestSiblings": true
18+
}],
19+
"no-console": [0],
20+
"object-curly-spacing": [2, "always"],
21+
"keyword-spacing": ["error"],
22+
"no-prototype-builtins": "warn",
23+
"@typescript-eslint/no-empty-function": "warn",
24+
"@typescript-eslint/no-var-requires": "warn"
25+
},
26+
"env": {
27+
"es6": true,
28+
"browser": true,
29+
"node": true
30+
},
31+
"extends": ["eslint:recommended", "plugin:@typescript-eslint/recommended"],
32+
"plugins": [
33+
"@typescript-eslint",
34+
"jsx-a11y",
35+
"react"
36+
]
37+
}

packages/chakra-ui/.npmrc

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
# Use legacy peer deps to allow things to install with node 16
2+
legacy-peer-deps=true

packages/chakra-ui/.prettierrc

-7
This file was deleted.

packages/chakra-ui/package-lock.json

+28,640-13,497
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/chakra-ui/package.json

+17-1
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,19 @@
1111
"scripts": {
1212
"start": "tsdx watch",
1313
"build": "rimraf dist && tsdx build --format cjs,es,umd",
14+
"cs-check": "prettier -l \"{src,test}/**/*.ts?(x)\"",
15+
"cs-format": "prettier \"{src,test}/**/*.ts?(x)\" --write",
16+
"lint": "eslint src test",
1417
"test": "tsdx test",
1518
"test:update": "tsdx test --u",
1619
"test:watch": "tsdx test --watch"
1720
},
21+
"lint-staged": {
22+
"{src,test}/**/*.ts?(x)": [
23+
"eslint --fix",
24+
"prettier --write"
25+
]
26+
},
1827
"engineStrict": false,
1928
"engines": {
2029
"node": ">=12"
@@ -46,7 +55,7 @@
4655
"@babel/preset-react": "^7.18.6",
4756
"@chakra-ui/icons": "^1.1.1",
4857
"@chakra-ui/react": "^1.7.3",
49-
"@emotion/jest": "^11.9.3",
58+
"@emotion/jest": "^11.9.4",
5059
"@emotion/react": "^11.9.3",
5160
"@emotion/styled": "^11.9.3",
5261
"@rjsf/core": "^4.2.0",
@@ -56,7 +65,14 @@
5665
"@types/react": "^17.0.37",
5766
"@types/react-dom": "^17.0.11",
5867
"@types/react-test-renderer": "^17.0.1",
68+
"@typescript-eslint/eslint-plugin": "^5.30.6",
69+
"@typescript-eslint/parser": "^5.30.6",
70+
"eslint": "^8.19.0",
71+
"eslint-plugin-import": "^2.26.0",
72+
"eslint-plugin-jsx-a11y": "^6.6.0",
73+
"eslint-plugin-react": "^7.30.1",
5974
"framer-motion": "^5.5.5",
75+
"prettier": "^2.7.1",
6076
"react": "^17.0.2",
6177
"react-dom": "^17.0.2",
6278
"react-test-renderer": "^17.0.2",

packages/chakra-ui/src/AddButton/AddButton.tsx

+3-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,9 @@ import { AddButtonProps } from "@rjsf/core";
55
import { Button, ButtonProps } from "@chakra-ui/react";
66
import { AddIcon } from "@chakra-ui/icons";
77

8-
const AddButton: React.ComponentType<AddButtonProps & ButtonProps> = props => (
8+
const AddButton: React.ComponentType<AddButtonProps & ButtonProps> = (
9+
props
10+
) => (
911
<Button leftIcon={<AddIcon />} {...props}>
1012
Add Item
1113
</Button>

packages/chakra-ui/src/AltDateWidget/AltDateWidget.tsx

+11-5
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,15 @@
11
import React, { MouseEvent, useEffect, useState } from "react";
2-
import { DateObject, pad, parseDateString, toDateString, WidgetProps } from "@rjsf/utils";
2+
import {
3+
DateObject,
4+
pad,
5+
parseDateString,
6+
toDateString,
7+
WidgetProps,
8+
} from "@rjsf/utils";
39
import { Box, Button } from "@chakra-ui/react";
410

511
const rangeOptions = (start: number, stop: number) => {
6-
let options = [];
12+
const options = [];
713
for (let i = start; i <= stop; i++) {
814
options.push({ value: i, label: pad(i, 2) });
915
}
@@ -16,7 +22,7 @@ interface AltDateStateType extends DateObject {
1622

1723
const readyForChange = (state: AltDateStateType) => {
1824
return Object.keys(state).every(
19-
key => typeof state[key] !== "undefined" && state[key] !== -1
25+
(key) => typeof state[key] !== "undefined" && state[key] !== -1
2026
);
2127
};
2228

@@ -73,7 +79,7 @@ const AltDateWidget = (props: any) => {
7379
const dateElementProps = () => {
7480
const { year, month, day, hour, minute, second } = state;
7581

76-
const data: {type: string, range: any, value?: number}[] = [
82+
const data: { type: string; range: any; value?: number }[] = [
7783
{ type: "year", range: options.yearsRange, value: year },
7884
{ type: "month", range: [1, 12], value: month },
7985
{ type: "day", range: [1, 31], value: day },
@@ -91,7 +97,7 @@ const AltDateWidget = (props: any) => {
9197
};
9298

9399
const renderDateElement = (elemProps: WidgetProps) => {
94-
const value = Boolean(elemProps.value) ? elemProps.value : undefined;
100+
const value = elemProps.value ? elemProps.value : undefined;
95101
return (
96102
<SelectWidget
97103
{...elemProps}

packages/chakra-ui/src/ArrayFieldTemplate/ArrayFieldTemplate.tsx

+40-21
Original file line numberDiff line numberDiff line change
@@ -60,20 +60,35 @@ const ArrayFieldDescription = ({
6060

6161
// Used in the two templates
6262
const DefaultArrayItem = ({
63-
index, readonly, disabled, children, hasToolbar, hasRemove, hasMoveUp, hasMoveDown, onReorderClick, onDropIndexClick
63+
index,
64+
readonly,
65+
disabled,
66+
children,
67+
hasToolbar,
68+
hasRemove,
69+
hasMoveUp,
70+
hasMoveDown,
71+
onReorderClick,
72+
onDropIndexClick,
6473
}: any) => {
74+
const onRemoveClick = useMemo(
75+
() => onDropIndexClick(index),
76+
[index, onDropIndexClick]
77+
);
6578

66-
const onRemoveClick = useMemo(() => onDropIndexClick(index), [index, onDropIndexClick]);
67-
68-
const onArrowUpClick = useMemo(() => onReorderClick(index, index - 1), [index, onReorderClick]);
79+
const onArrowUpClick = useMemo(
80+
() => onReorderClick(index, index - 1),
81+
[index, onReorderClick]
82+
);
6983

70-
const onArrowDownClick = useMemo(() => onReorderClick(index, index + 1), [index, onReorderClick]);
84+
const onArrowDownClick = useMemo(
85+
() => onReorderClick(index, index + 1),
86+
[index, onReorderClick]
87+
);
7188

7289
return (
7390
<HStack alignItems={"flex-end"} py={1}>
74-
<Box w="100%">
75-
{children}
76-
</Box>
91+
<Box w="100%">{children}</Box>
7792

7893
{hasToolbar && (
7994
<Box>
@@ -91,9 +106,7 @@ const DefaultArrayItem = ({
91106
<IconButton
92107
icon="arrow-down"
93108
tabIndex={-1}
94-
disabled={
95-
disabled || readonly || !hasMoveDown
96-
}
109+
disabled={disabled || readonly || !hasMoveDown}
97110
onClick={onArrowDownClick}
98111
/>
99112
)}
@@ -139,10 +152,13 @@ const DefaultFixedArrayFieldTemplate = (props: ArrayFieldTemplateProps) => {
139152
className="row array-item-list"
140153
key={`array-item-list-${props.idSchema.$id}`}
141154
>
142-
{props.items && props.items.map((p) => {
143-
const { key, ...itemProps } = p;
144-
return <DefaultArrayItem key={key} {...itemProps}></DefaultArrayItem>;
145-
})}
155+
{props.items &&
156+
props.items.map((p) => {
157+
const { key, ...itemProps } = p;
158+
return (
159+
<DefaultArrayItem key={key} {...itemProps}></DefaultArrayItem>
160+
);
161+
})}
146162
</div>
147163

148164
{props.canAdd && (
@@ -155,7 +171,7 @@ const DefaultFixedArrayFieldTemplate = (props: ArrayFieldTemplateProps) => {
155171
)}
156172
</fieldset>
157173
);
158-
}
174+
};
159175

160176
const DefaultNormalArrayFieldTemplate = (props: ArrayFieldTemplateProps) => {
161177
const uiOptions = getUiOptions(props.uiSchema);
@@ -180,10 +196,13 @@ const DefaultNormalArrayFieldTemplate = (props: ArrayFieldTemplateProps) => {
180196

181197
<Grid key={`array-item-list-${props.idSchema.$id}`}>
182198
<GridItem>
183-
{props.items.length > 0 && props.items.map((p) => {
184-
const { key, ...itemProps } = p;
185-
return <DefaultArrayItem key={key} {...itemProps}></DefaultArrayItem>;
186-
})}
199+
{props.items.length > 0 &&
200+
props.items.map((p) => {
201+
const { key, ...itemProps } = p;
202+
return (
203+
<DefaultArrayItem key={key} {...itemProps}></DefaultArrayItem>
204+
);
205+
})}
187206
</GridItem>
188207
{props.canAdd && (
189208
<GridItem justifySelf={"flex-end"}>
@@ -199,6 +218,6 @@ const DefaultNormalArrayFieldTemplate = (props: ArrayFieldTemplateProps) => {
199218
</Grid>
200219
</Box>
201220
);
202-
}
221+
};
203222

204223
export default ArrayFieldTemplate;

packages/chakra-ui/src/ChakraFrameProvider.tsx

+20-18
Original file line numberDiff line numberDiff line change
@@ -20,22 +20,24 @@ import CSSReset from "./CssReset";
2020
* Also see: https://github.com/emotion-js/emotion/issues/760#issuecomment-404353706
2121
*/
2222

23-
let memoizedCreateCacheWithContainer = weakMemoize((container: HTMLElement) => {
24-
let newCache = createCache({ container, key: "rjsf" });
25-
return newCache;
26-
});
23+
const memoizedCreateCacheWithContainer = weakMemoize(
24+
(container: HTMLElement) => {
25+
const newCache = createCache({ container, key: "rjsf" });
26+
return newCache;
27+
}
28+
);
2729

28-
export const __createChakraFrameProvider = (props: any) => ({
29-
document,
30-
}: any) => {
31-
return (
32-
<div style={{ margin: 2 }}>
33-
<CacheProvider value={memoizedCreateCacheWithContainer(document.head)}>
34-
<ChakraProvider resetCSS={false}>
35-
<CSSReset />
36-
{props.children}
37-
</ChakraProvider>
38-
</CacheProvider>
39-
</div>
40-
);
41-
};
30+
export const __createChakraFrameProvider =
31+
(props: any) =>
32+
({ document }: any) => {
33+
return (
34+
<div style={{ margin: 2 }}>
35+
<CacheProvider value={memoizedCreateCacheWithContainer(document.head)}>
36+
<ChakraProvider resetCSS={false}>
37+
<CSSReset />
38+
{props.children}
39+
</ChakraProvider>
40+
</CacheProvider>
41+
</div>
42+
);
43+
};

packages/chakra-ui/src/CheckboxesWidget/CheckboxesWidget.tsx

+4-1
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,10 @@ const CheckboxesWidget = (props: WidgetProps) => {
7070
isInvalid={rawErrors && rawErrors.length > 0}
7171
>
7272
<FormLabel htmlFor={id}>{label || schema.title}</FormLabel>
73-
<CheckboxGroup onChange={option => onChange(option)} defaultValue={value}>
73+
<CheckboxGroup
74+
onChange={(option) => onChange(option)}
75+
defaultValue={value}
76+
>
7477
<Stack direction={row ? "row" : "column"}>
7578
{(enumOptions as any).map(
7679
(option: { value: any; label: any }, index: any) => {

packages/chakra-ui/src/DescriptionField/DescriptionField.tsx

+8-2
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,16 @@ import { FieldProps } from "@rjsf/utils";
55
import { Text } from "@chakra-ui/react";
66

77
const DescriptionField = ({ description, id }: FieldProps) => {
8-
if (!description) return null;
8+
if (!description) {
9+
return null;
10+
}
911

1012
if (typeof description === "string") {
11-
return <Text id={id} mt={2} mb={4}>{description}</Text>;
13+
return (
14+
<Text id={id} mt={2} mb={4}>
15+
{description}
16+
</Text>
17+
);
1218
}
1319

1420
return <>{description}</>;

packages/chakra-ui/src/ErrorList/ErrorList.tsx

+2-10
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,6 @@
11
import React from "react";
22
import { ErrorListProps } from "@rjsf/utils";
3-
import {
4-
List,
5-
ListIcon,
6-
ListItem,
7-
Alert,
8-
AlertTitle,
9-
} from "@chakra-ui/react";
3+
import { List, ListIcon, ListItem, Alert, AlertTitle } from "@chakra-ui/react";
104
import { WarningIcon } from "@chakra-ui/icons";
115

126
const ErrorList = ({ errors }: ErrorListProps) => {
@@ -17,9 +11,7 @@ const ErrorList = ({ errors }: ErrorListProps) => {
1711
gap={3}
1812
status="error"
1913
>
20-
<AlertTitle>
21-
Errors
22-
</AlertTitle>
14+
<AlertTitle>Errors</AlertTitle>
2315

2416
<List>
2517
{errors.map((error, i) => (

packages/chakra-ui/src/FieldTemplate/WrapIfAdditional.tsx

+12-5
Original file line numberDiff line numberDiff line change
@@ -12,11 +12,18 @@ import {
1212

1313
import IconButton from "../IconButton";
1414

15-
type WrapIfAdditionalProps = { children: React.ReactElement; } &
16-
Pick<
17-
FieldTemplateProps,
18-
'classNames' | 'disabled' | 'id' | 'label' | 'onDropPropertyClick' | 'onKeyChange' | 'readonly' | 'required' | 'schema'
19-
>;
15+
type WrapIfAdditionalProps = { children: React.ReactElement } & Pick<
16+
FieldTemplateProps,
17+
| "classNames"
18+
| "disabled"
19+
| "id"
20+
| "label"
21+
| "onDropPropertyClick"
22+
| "onKeyChange"
23+
| "readonly"
24+
| "required"
25+
| "schema"
26+
>;
2027

2128
const WrapIfAdditional = (props: WrapIfAdditionalProps) => {
2229
const {

packages/chakra-ui/src/IconButton/IconButton.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88
AddIcon,
99
ArrowUpIcon,
1010
ArrowDownIcon,
11-
DeleteIcon
11+
DeleteIcon,
1212
} from "@chakra-ui/icons";
1313

1414
const mappings = {
@@ -31,6 +31,6 @@ const ChakraIconButton = memo((props: IconButtonProps) => {
3131
return <IconButton {...otherProps} icon={mappings[icon]} aria-label={icon} />;
3232
});
3333

34-
ChakraIconButton.displayName = 'ChakraIconButton';
34+
ChakraIconButton.displayName = "ChakraIconButton";
3535

3636
export default ChakraIconButton;

0 commit comments

Comments
 (0)