Skip to content

Commit 1f896bb

Browse files
authored
Merge pull request #19 from littlecinemadigital/spacing
Spacing
2 parents f370cde + 97eee79 commit 1f896bb

File tree

22 files changed

+109
-97
lines changed

22 files changed

+109
-97
lines changed

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import React from "react";
22

33
import _AltDateWidget from "../AltDateWidget";
4-
import { TextWidgetProps } from "TextWidget";
4+
import { WidgetProps } from "@rjsf/core";
55

6-
const AltDateTimeWidget = (props: TextWidgetProps) => {
6+
const AltDateTimeWidget = (props: WidgetProps) => {
77
const { AltDateWidget } = props.registry.widgets;
88
return <AltDateWidget {...props} showTime />;
99
};

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

Lines changed: 18 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -29,19 +29,20 @@ const readyForChange = (state: AltDateStateType) => {
2929
);
3030
};
3131

32-
const AltDateWidget = ({
33-
autofocus,
34-
disabled,
35-
id,
36-
onBlur,
37-
onChange,
38-
onFocus,
39-
options,
40-
readonly,
41-
registry,
42-
showTime,
43-
value,
44-
}: any) => {
32+
const AltDateWidget = (props: any) => {
33+
const {
34+
autofocus,
35+
disabled,
36+
id,
37+
onBlur,
38+
onChange,
39+
onFocus,
40+
options,
41+
readonly,
42+
registry,
43+
showTime,
44+
value,
45+
} = props;
4546
const { SelectWidget } = registry.widgets;
4647
const [state, setState] = useState(parseDateString(value, showTime));
4748
useEffect(() => {
@@ -99,23 +100,18 @@ const AltDateWidget = ({
99100
};
100101

101102
const renderDateElement = (elemProps: WidgetProps) => {
102-
const value = Boolean(elemProps.value) ? elemProps.value : undefined;
103+
const value = Boolean(elemProps?.value) ? elemProps.value : undefined;
103104
return (
104105
<SelectWidget
105-
autofocus={elemProps.autofocus}
106+
{...elemProps}
106107
className="form-control"
107-
disabled={elemProps.disabled}
108-
id={elemProps.id}
109-
onBlur={elemProps.onBlur}
110108
onChange={(elemValue: WidgetProps) =>
111109
elemProps.select(elemProps.type, elemValue)
112110
}
113-
onFocus={elemProps.onFocus}
114111
options={{
115112
enumOptions: rangeOptions(elemProps.range[0], elemProps.range[1]),
116113
}}
117114
placeholder={elemProps.type}
118-
readonly={elemProps.readonly}
119115
schema={{ type: "integer" }}
120116
value={value}
121117
/>
@@ -130,6 +126,7 @@ const AltDateWidget = ({
130126
return (
131127
<Box key={elemId} mr="2" mb="2">
132128
{renderDateElement({
129+
...props,
133130
...elemProps,
134131
autofocus: autofocus && i === 0,
135132
disabled,
@@ -139,7 +136,7 @@ const AltDateWidget = ({
139136
readonly,
140137
registry,
141138
select: handleChange,
142-
value: elemProps.value < 0 ? undefined : elemProps.value,
139+
value: elemProps.value < 0 ? "" : elemProps.value,
143140
})}
144141
</Box>
145142
);

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

Lines changed: 44 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -62,46 +62,50 @@ const ArrayFieldDescription = ({
6262
};
6363

6464
// Used in the two templates
65-
const DefaultArrayItem = (props: any) => (
66-
<HStack key={props.key} alignItems={"flex-end"}>
67-
<Box p={2} w="100%">
68-
{props.children}
69-
</Box>
70-
71-
{props.hasToolbar && (
72-
<Box p={2}>
73-
<ButtonGroup isAttached>
74-
{(props.hasMoveUp || props.hasMoveDown) && (
75-
<IconButton
76-
icon="arrow-up"
77-
tabIndex={-1}
78-
disabled={props.disabled || props.readonly || !props.hasMoveUp}
79-
onClick={props.onReorderClick(props.index, props.index - 1)}
80-
/>
81-
)}
82-
83-
{(props.hasMoveUp || props.hasMoveDown) && (
84-
<IconButton
85-
icon="arrow-down"
86-
tabIndex={-1}
87-
disabled={props.disabled || props.readonly || !props.hasMoveDown}
88-
onClick={props.onReorderClick(props.index, props.index + 1)}
89-
/>
90-
)}
91-
92-
{props.hasRemove && (
93-
<IconButton
94-
icon="remove"
95-
tabIndex={-1}
96-
disabled={props.disabled || props.readonly}
97-
onClick={props.onDropIndexClick(props.index)}
98-
/>
99-
)}
100-
</ButtonGroup>
65+
const DefaultArrayItem = (props: any) => {
66+
return (
67+
<HStack key={props.key} alignItems={"flex-end"} py={1}>
68+
<Box w="100%">
69+
{props.children}
10170
</Box>
102-
)}
103-
</HStack>
104-
);
71+
72+
{props.hasToolbar && (
73+
<Box>
74+
<ButtonGroup isAttached mb={1}>
75+
{(props.hasMoveUp || props.hasMoveDown) && (
76+
<IconButton
77+
icon="arrow-up"
78+
tabIndex={-1}
79+
disabled={props.disabled || props.readonly || !props.hasMoveUp}
80+
onClick={props.onReorderClick(props.index, props.index - 1)}
81+
/>
82+
)}
83+
84+
{(props.hasMoveUp || props.hasMoveDown) && (
85+
<IconButton
86+
icon="arrow-down"
87+
tabIndex={-1}
88+
disabled={
89+
props.disabled || props.readonly || !props.hasMoveDown
90+
}
91+
onClick={props.onReorderClick(props.index, props.index + 1)}
92+
/>
93+
)}
94+
95+
{props.hasRemove && (
96+
<IconButton
97+
icon="remove"
98+
tabIndex={-1}
99+
disabled={props.disabled || props.readonly}
100+
onClick={props.onDropIndexClick(props.index)}
101+
/>
102+
)}
103+
</ButtonGroup>
104+
</Box>
105+
)}
106+
</HStack>
107+
);
108+
};
105109

106110
const DefaultFixedArrayFieldTemplate = (props: ArrayFieldTemplateProps) => (
107111
<fieldset className={props.className}>
@@ -162,7 +166,7 @@ const DefaultNormalArrayFieldTemplate = (props: ArrayFieldTemplateProps) => (
162166
/>
163167
)}
164168

165-
<Grid container={true} key={`array-item-list-${props.idSchema.$id}`}>
169+
<Grid key={`array-item-list-${props.idSchema.$id}`}>
166170
<GridItem>
167171
{props.items.length > 0 && props.items.map(p => DefaultArrayItem(p))}
168172
</GridItem>

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ const CheckboxWidget = (props: WidgetProps) => {
2929
}: React.FocusEvent<HTMLInputElement | any>) => onFocus(id, value);
3030

3131
return (
32-
<FormControl {...chakraProps} isRequired={required}>
32+
<FormControl mb={1} {...chakraProps} isRequired={required}>
3333
<Checkbox
3434
id={id}
3535
isChecked={typeof value === "undefined" ? false : value}

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,7 @@ const CheckboxesWidget = ({
5959
const row = options ? options.inline : false;
6060

6161
return (
62-
<FormControl {...chakraProps} isRequired={required}>
62+
<FormControl mb={1} {...chakraProps} isRequired={required}>
6363
<FormLabel htmlFor={id}>{label || schema.title}</FormLabel>
6464
<CheckboxGroup onChange={option => onChange(option)}>
6565
<Stack direction={row ? "row" : "column"}>

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from "react";
2-
import { TextWidgetProps } from "../TextWidget";
2+
import { WidgetProps } from "@rjsf/core";
33

4-
const ColorWidget = (props: TextWidgetProps) => {
4+
const ColorWidget = (props: WidgetProps) => {
55
const { registry } = props;
66
const { TextWidget } = registry.widgets;
77
return <TextWidget type="color" {...props} />;

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

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
11
import React from "react";
2-
import { utils } from "@rjsf/core";
3-
import { TextWidgetProps } from "../TextWidget";
2+
import { utils, WidgetProps } from "@rjsf/core";
43

54
const { localToUTC, utcToLocal } = utils;
65

7-
const DateTimeWidget = (props: TextWidgetProps) => {
6+
const DateTimeWidget = (props: WidgetProps) => {
87
const { registry } = props;
98
const { TextWidget } = registry.widgets;
109
const value = utcToLocal(props.value);

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from "react";
2-
import { TextWidgetProps } from "../TextWidget";
2+
import { WidgetProps } from "@rjsf/core";
33

4-
const DateWidget = (props: TextWidgetProps) => {
4+
const DateWidget = (props: WidgetProps) => {
55
const { registry } = props;
66
const { TextWidget } = registry.widgets;
77
return <TextWidget {...props} type="date" />;

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ const DescriptionField = ({ description, id }: FieldProps) => {
88
if (!description) return null;
99

1010
if (typeof description === "string") {
11-
return <Text id={id}>{description}</Text>;
11+
return <Text id={id} mt={2} mb={4}>{description}</Text>;
1212
}
1313

1414
return <>{description}</>;

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from "react";
2-
import { TextWidgetProps } from "../TextWidget";
2+
import { WidgetProps } from "@rjsf/core";
33

4-
const EmailWidget = (props: TextWidgetProps) => {
4+
const EmailWidget = (props: WidgetProps) => {
55
const { registry } = props;
66
const { TextWidget } = registry.widgets;
77
return <TextWidget {...props} type="email" />;

0 commit comments

Comments
 (0)