Skip to content

Commit f19208b

Browse files
zfarhadzfarhad
committed
Apply code cleanup for Mantine theme
1 parent 25084f3 commit f19208b

21 files changed

+72
-47
lines changed

‎package-lock.json

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/mantine/src/templates/BaseInputTemplate.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react';
1+
import { ChangeEvent, FocusEvent } from 'react';
22
import {
33
ariaDescribedByIds,
44
BaseInputTemplateProps,
@@ -10,6 +10,7 @@ import {
1010
StrictRJSFSchema,
1111
} from '@rjsf/utils';
1212
import { TextInput, NumberInput } from '@mantine/core';
13+
1314
import { cleanupOptions } from '../utils';
1415

1516
/** The `BaseInputTemplate` is the template to use to render the basic `<input>` component for the `core` theme.
@@ -51,12 +52,11 @@ export default function BaseInputTemplate<
5152

5253
const handleChange = onChangeOverride
5354
? onChangeOverride
54-
: (e: React.ChangeEvent<HTMLInputElement>) =>
55-
onChange(e.target.value === '' ? options.emptyValue ?? '' : e.target.value);
55+
: (e: ChangeEvent<HTMLInputElement>) => onChange(e.target.value === '' ? options.emptyValue ?? '' : e.target.value);
5656

57-
const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => onBlur(id, e.target && e.target.value);
57+
const handleBlur = (e: FocusEvent<HTMLInputElement>) => onBlur(id, e.target && e.target.value);
5858

59-
const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => onFocus(id, e.target && e.target.value);
59+
const handleFocus = (e: FocusEvent<HTMLInputElement>) => onFocus(id, e.target && e.target.value);
6060

6161
const input =
6262
inputProps.type === 'number' || inputProps.type === 'integer' ? (

‎packages/mantine/src/templates/ButtonTemplates/AddButton.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { FormContextType, IconButtonProps, RJSFSchema, StrictRJSFSchema, TranslatableString } from '@rjsf/utils';
2+
23
import IconButton from './IconButton';
34
import { Plus } from '../icons';
45

‎packages/mantine/src/templates/ButtonTemplates/IconButton.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
1-
import React from 'react';
1+
import { MouseEventHandler } from 'react';
22
import { ActionIcon, ActionIconProps } from '@mantine/core';
33
import { FormContextType, IconButtonProps, RJSFSchema, StrictRJSFSchema, TranslatableString } from '@rjsf/utils';
4+
45
import { Copy, ChevronDown, ChevronUp, X } from '../icons';
56

67
export type MantineIconButtonProps<
@@ -17,7 +18,7 @@ export default function IconButton<T = any, S extends StrictRJSFSchema = RJSFSch
1718
<ActionIcon
1819
size={iconType as ActionIconProps['size']}
1920
color={color as ActionIconProps['color']}
20-
onClick={onClick as React.MouseEventHandler<HTMLAnchorElement> & React.MouseEventHandler<HTMLButtonElement>}
21+
onClick={onClick as MouseEventHandler<HTMLAnchorElement> & MouseEventHandler<HTMLButtonElement>}
2122
{...otherProps}
2223
>
2324
{icon}

‎packages/mantine/src/templates/ErrorList.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { ErrorListProps, FormContextType, RJSFSchema, StrictRJSFSchema, TranslatableString } from '@rjsf/utils';
22
import { Alert, Title, List } from '@mantine/core';
3+
34
import { ExclamationCircle } from './icons';
45

56
/** The `ErrorList` component is the template that renders the all the errors associated with the fields in the `Form`

‎packages/mantine/src/templates/WrapIfAdditionalTemplate.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react';
1+
import { FocusEvent } from 'react';
22
import {
33
ADDITIONAL_PROPERTY_FLAG,
44
UI_OPTIONS_KEY,
@@ -50,7 +50,7 @@ export default function WrapIfAdditionalTemplate<
5050
);
5151
}
5252

53-
const handleBlur = ({ target }: React.FocusEvent<HTMLInputElement>) => onKeyChange(target && target.value);
53+
const handleBlur = ({ target }: FocusEvent<HTMLInputElement>) => onKeyChange(target && target.value);
5454

5555
// The `block` prop is not part of the `IconButtonProps` defined in the template, so put it into the uiSchema instead
5656
const uiOptions = uiSchema ? uiSchema[UI_OPTIONS_KEY] : {};

‎packages/mantine/src/templates/icons.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import React from 'react';
1+
import { ComponentPropsWithoutRef } from 'react';
22

3-
interface IconProps extends React.ComponentPropsWithoutRef<'svg'> {
3+
interface IconProps extends ComponentPropsWithoutRef<'svg'> {
44
size?: number | string;
55
}
66

‎packages/mantine/src/widgets/CheckboxWidget.tsx

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { useCallback } from 'react';
1+
import { ReactElement, ChangeEvent, FocusEvent, useCallback } from 'react';
22
import {
33
descriptionId,
44
getTemplate,
@@ -10,6 +10,7 @@ import {
1010
ariaDescribedByIds,
1111
} from '@rjsf/utils';
1212
import { Checkbox } from '@mantine/core';
13+
1314
import { cleanupOptions } from '../utils';
1415

1516
/** The `CheckBoxWidget` is a widget for rendering boolean properties.
@@ -21,7 +22,7 @@ export default function CheckboxWidget<
2122
T = any,
2223
S extends StrictRJSFSchema = RJSFSchema,
2324
F extends FormContextType = any
24-
>(props: WidgetProps<T, S, F>): React.ReactElement {
25+
>(props: WidgetProps<T, S, F>): ReactElement {
2526
const {
2627
id,
2728
name,
@@ -51,7 +52,7 @@ export default function CheckboxWidget<
5152
);
5253

5354
const handleCheckboxChange = useCallback(
54-
(e: React.ChangeEvent<HTMLInputElement>) => {
55+
(e: ChangeEvent<HTMLInputElement>) => {
5556
if (!disabled && !readonly && onChange) {
5657
onChange(e.currentTarget.checked);
5758
}
@@ -60,7 +61,7 @@ export default function CheckboxWidget<
6061
);
6162

6263
const handleBlur = useCallback(
63-
({ target }: React.FocusEvent<HTMLInputElement>) => {
64+
({ target }: FocusEvent<HTMLInputElement>) => {
6465
if (onBlur) {
6566
onBlur(id, target.checked);
6667
}
@@ -69,7 +70,7 @@ export default function CheckboxWidget<
6970
);
7071

7172
const handleFocus = useCallback(
72-
({ target }: React.FocusEvent<HTMLInputElement>) => {
73+
({ target }: FocusEvent<HTMLInputElement>) => {
7374
if (onFocus) {
7475
onFocus(id, target.checked);
7576
}

‎packages/mantine/src/widgets/CheckboxesWidget.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { useCallback } from 'react';
1+
import { FocusEvent, useCallback } from 'react';
22
import {
33
ariaDescribedByIds,
44
enumOptionsValueForIndex,
@@ -11,6 +11,7 @@ import {
1111
StrictRJSFSchema,
1212
} from '@rjsf/utils';
1313
import { Checkbox, Flex, Input } from '@mantine/core';
14+
1415
import { cleanupOptions } from '../utils';
1516

1617
/** The `CheckboxesWidget` is a widget for rendering checkbox groups.
@@ -52,7 +53,7 @@ export default function CheckboxesWidget<
5253
);
5354

5455
const handleBlur = useCallback(
55-
({ target }: React.FocusEvent<HTMLInputElement>) => {
56+
({ target }: FocusEvent<HTMLInputElement>) => {
5657
if (onBlur) {
5758
onBlur(id, enumOptionsValueForIndex<S>(target.value, enumOptions, emptyValue));
5859
}
@@ -61,7 +62,7 @@ export default function CheckboxesWidget<
6162
);
6263

6364
const handleFocus = useCallback(
64-
({ target }: React.FocusEvent<HTMLInputElement>) => {
65+
({ target }: FocusEvent<HTMLInputElement>) => {
6566
if (onFocus) {
6667
onFocus(id, enumOptionsValueForIndex<S>(target.value, enumOptions, emptyValue));
6768
}

‎packages/mantine/src/widgets/ColorWidget.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { useCallback } from 'react';
1+
import { FocusEvent, useCallback } from 'react';
22
import {
33
FormContextType,
44
RJSFSchema,
@@ -8,6 +8,7 @@ import {
88
ariaDescribedByIds,
99
} from '@rjsf/utils';
1010
import { ColorInput } from '@mantine/core';
11+
1112
import { cleanupOptions } from '../utils';
1213

1314
/** The `ColorWidget` component uses the `ColorInput` from Mantine, allowing users to pick a color.
@@ -35,18 +36,17 @@ export default function ColorWidget<T = any, S extends StrictRJSFSchema = RJSFSc
3536
onFocus,
3637
} = props;
3738

38-
const emptyValue = options.emptyValue || '';
3939
const themeProps = cleanupOptions(options);
4040

4141
const handleChange = useCallback(
4242
(nextValue: string) => {
4343
onChange(nextValue);
4444
},
45-
[onChange, emptyValue]
45+
[onChange]
4646
);
4747

4848
const handleBlur = useCallback(
49-
({ target }: React.FocusEvent<HTMLInputElement>) => {
49+
({ target }: FocusEvent<HTMLInputElement>) => {
5050
if (onBlur) {
5151
onBlur(id, target && target.value);
5252
}
@@ -55,7 +55,7 @@ export default function ColorWidget<T = any, S extends StrictRJSFSchema = RJSFSc
5555
);
5656

5757
const handleFocus = useCallback(
58-
({ target }: React.FocusEvent<HTMLInputElement>) => {
58+
({ target }: FocusEvent<HTMLInputElement>) => {
5959
if (onFocus) {
6060
onFocus(id, target && target.value);
6161
}

‎packages/mantine/src/widgets/DateTime/DateTimeWidget.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { FormContextType, RJSFSchema, StrictRJSFSchema, WidgetProps } from '@rjsf/utils';
2+
23
import DateTimeInput from './DateTimeInput';
34

45
/** The `DateWidget` component uses the `DateTimeInput` changing the valueFormat to show `datetime`

‎packages/mantine/src/widgets/DateTime/DateWidget.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { FormContextType, RJSFSchema, StrictRJSFSchema, WidgetProps } from '@rjsf/utils';
2+
23
import DateTimeInput from './DateTimeInput';
34

45
/** The `DateWidget` component uses the `DateTimeInput` changing the valueFormat to show `date`

‎packages/mantine/src/widgets/DateTime/TimeWidget.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { useCallback } from 'react';
1+
import { ChangeEvent, FocusEvent, useCallback } from 'react';
22
import {
33
FormContextType,
44
RJSFSchema,
@@ -37,14 +37,14 @@ export default function TimeWidget<T = any, S extends StrictRJSFSchema = RJSFSch
3737
const emptyValue = options.emptyValue || '';
3838

3939
const handleChange = useCallback(
40-
(e: React.ChangeEvent<HTMLInputElement>) => {
40+
(e: ChangeEvent<HTMLInputElement>) => {
4141
onChange(e.target.value === '' ? emptyValue : e.target.value);
4242
},
4343
[onChange, emptyValue]
4444
);
4545

4646
const handleBlur = useCallback(
47-
({ target }: React.FocusEvent<HTMLInputElement>) => {
47+
({ target }: FocusEvent<HTMLInputElement>) => {
4848
if (onBlur) {
4949
onBlur(id, target && target.value);
5050
}
@@ -53,7 +53,7 @@ export default function TimeWidget<T = any, S extends StrictRJSFSchema = RJSFSch
5353
);
5454

5555
const handleFocus = useCallback(
56-
({ target }: React.FocusEvent<HTMLInputElement>) => {
56+
({ target }: FocusEvent<HTMLInputElement>) => {
5757
if (onFocus) {
5858
onFocus(id, target && target.value);
5959
}

‎packages/mantine/src/widgets/FileWidget.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import {
99
WidgetProps,
1010
} from '@rjsf/utils';
1111
import { FileInput, Pill } from '@mantine/core';
12+
1213
import { cleanupOptions } from '../utils';
1314

1415
function addNameToDataURL(dataURL: string, name: string) {

‎packages/mantine/src/widgets/PasswordWidget.tsx

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { useCallback } from 'react';
1+
import { ChangeEvent, FocusEvent, useCallback } from 'react';
22
import {
33
ariaDescribedByIds,
44
FormContextType,
@@ -8,6 +8,7 @@ import {
88
WidgetProps,
99
} from '@rjsf/utils';
1010
import { PasswordInput } from '@mantine/core';
11+
1112
import { cleanupOptions } from '../utils';
1213

1314
/**
@@ -42,14 +43,14 @@ export default function PasswordWidget<
4243
const themeProps = cleanupOptions(options);
4344

4445
const handleChange = useCallback(
45-
(e: React.ChangeEvent<HTMLInputElement>) => {
46+
(e: ChangeEvent<HTMLInputElement>) => {
4647
onChange(e.target.value === '' ? emptyValue : e.target.value);
4748
},
4849
[onChange, emptyValue]
4950
);
5051

5152
const handleBlur = useCallback(
52-
({ target }: React.FocusEvent<HTMLInputElement>) => {
53+
({ target }: FocusEvent<HTMLInputElement>) => {
5354
if (onBlur) {
5455
onBlur(id, target && target.value);
5556
}
@@ -58,7 +59,7 @@ export default function PasswordWidget<
5859
);
5960

6061
const handleFocus = useCallback(
61-
({ target }: React.FocusEvent<HTMLInputElement>) => {
62+
({ target }: FocusEvent<HTMLInputElement>) => {
6263
if (onFocus) {
6364
onFocus(id, target && target.value);
6465
}

‎packages/mantine/src/widgets/RadioWidget.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { useCallback } from 'react';
1+
import { FocusEvent, useCallback } from 'react';
22
import {
33
ariaDescribedByIds,
44
enumOptionsIndexForValue,
@@ -10,6 +10,7 @@ import {
1010
WidgetProps,
1111
} from '@rjsf/utils';
1212
import { Radio, Flex } from '@mantine/core';
13+
1314
import { cleanupOptions } from '../utils';
1415

1516
/** The `RadioWidget` is a widget for rendering a radio group.
@@ -49,7 +50,7 @@ export default function RadioWidget<T = any, S extends StrictRJSFSchema = RJSFSc
4950
);
5051

5152
const handleBlur = useCallback(
52-
({ target }: React.FocusEvent<HTMLInputElement>) => {
53+
({ target }: FocusEvent<HTMLInputElement>) => {
5354
if (onBlur) {
5455
onBlur(id, enumOptionsValueForIndex<S>(target && target.value, enumOptions, emptyValue));
5556
}
@@ -58,7 +59,7 @@ export default function RadioWidget<T = any, S extends StrictRJSFSchema = RJSFSc
5859
);
5960

6061
const handleFocus = useCallback(
61-
({ target }: React.FocusEvent<HTMLInputElement>) => {
62+
({ target }: FocusEvent<HTMLInputElement>) => {
6263
if (onFocus) {
6364
onFocus(id, enumOptionsValueForIndex<S>(target && target.value, enumOptions, emptyValue));
6465
}

‎packages/mantine/src/widgets/RangeWidget.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import {
99
titleId,
1010
} from '@rjsf/utils';
1111
import { Slider, Input } from '@mantine/core';
12+
1213
import { cleanupOptions } from '../utils';
1314

1415
/** The `RangeWidget` component uses the `BaseInputTemplate` changing the type to `range` and wrapping the result

‎packages/mantine/src/widgets/SelectWidget.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { useCallback, useMemo } from 'react';
1+
import { FocusEvent, useCallback, useMemo } from 'react';
22
import {
33
ariaDescribedByIds,
44
enumOptionsIndexForValue,
@@ -10,6 +10,7 @@ import {
1010
WidgetProps,
1111
} from '@rjsf/utils';
1212
import { Select, MultiSelect } from '@mantine/core';
13+
1314
import { cleanupOptions } from '../utils';
1415

1516
/** The `SelectWidget` is a widget for rendering dropdowns.
@@ -51,7 +52,7 @@ export default function SelectWidget<T = any, S extends StrictRJSFSchema = RJSFS
5152
);
5253

5354
const handleBlur = useCallback(
54-
({ target }: React.FocusEvent<HTMLInputElement>) => {
55+
({ target }: FocusEvent<HTMLInputElement>) => {
5556
if (onBlur) {
5657
onBlur(id, enumOptionsValueForIndex<S>(target && target.value, enumOptions, emptyValue));
5758
}
@@ -60,7 +61,7 @@ export default function SelectWidget<T = any, S extends StrictRJSFSchema = RJSFS
6061
);
6162

6263
const handleFocus = useCallback(
63-
({ target }: React.FocusEvent<HTMLInputElement>) => {
64+
({ target }: FocusEvent<HTMLInputElement>) => {
6465
if (onFocus) {
6566
onFocus(id, enumOptionsValueForIndex<S>(target && target.value, enumOptions, emptyValue));
6667
}

0 commit comments

Comments
 (0)