Merge branch 'main' into next

This commit is contained in:
Daniel Lautzenheiser
2023-02-24 09:07:55 -05:00
22 changed files with 172 additions and 59 deletions

View File

@ -1,7 +1,7 @@
import { red } from '@mui/material/colors';
import FormControlLabel from '@mui/material/FormControlLabel';
import Switch from '@mui/material/Switch';
import React, { useCallback, useState } from 'react';
import React, { useCallback, useMemo, useState } from 'react';
import type { BooleanField, WidgetControlProps } from '@staticcms/core/interface';
import type { ChangeEvent, FC } from 'react';
@ -9,10 +9,15 @@ import type { ChangeEvent, FC } from 'react';
const BooleanControl: FC<WidgetControlProps<boolean, BooleanField>> = ({
value,
label,
isDuplicate,
onChange,
hasErrors,
}) => {
const [internalValue, setInternalValue] = useState(value);
const [internalRawValue, setInternalValue] = useState(value);
const internalValue = useMemo(
() => (isDuplicate ? value : internalRawValue),
[internalRawValue, isDuplicate, value],
);
const handleChange = useCallback(
(event: ChangeEvent<HTMLInputElement>) => {

View File

@ -60,6 +60,7 @@ function valueToOption(val: string | { name: string; label?: string }): {
const CodeControl: FC<WidgetControlProps<string | { [key: string]: string }, CodeField>> = ({
field,
isDuplicate,
onChange,
hasErrors,
value,
@ -77,7 +78,12 @@ const CodeControl: FC<WidgetControlProps<string | { [key: string]: string }, Cod
const valueIsMap = useMemo(() => Boolean(!field.output_code_only), [field.output_code_only]);
const [internalValue, setInternalValue] = useState(value ?? '');
const [internalRawValue, setInternalValue] = useState(value ?? '');
const internalValue = useMemo(
() => (isDuplicate ? value ?? '' : internalRawValue),
[internalRawValue, isDuplicate, value],
);
const [lang, setLang] = useState<ProcessedCodeLanguage | null>(null);
const [collapsed, setCollapsed] = useState(false);

View File

@ -3,7 +3,7 @@ import IconButton from '@mui/material/IconButton';
import InputAdornment from '@mui/material/InputAdornment';
import { styled } from '@mui/material/styles';
import TextField from '@mui/material/TextField';
import React, { useCallback, useState } from 'react';
import React, { useCallback, useMemo, useState } from 'react';
import { ChromePicker } from 'react-color';
import validateColor from 'validate-color';
@ -104,6 +104,7 @@ const ClickOutsideDiv = styled('div')`
const ColorControl: FC<WidgetControlProps<string, ColorField>> = ({
field,
isDuplicate,
onChange,
value,
hasErrors,
@ -116,7 +117,11 @@ const ColorControl: FC<WidgetControlProps<string, ColorField>> = ({
}, [collapsed]);
const [showColorPicker, setShowColorPicker] = useState(false);
const [internalValue, setInternalValue] = useState(value ?? '');
const [internalRawValue, setInternalValue] = useState(value ?? '');
const internalValue = useMemo(
() => (isDuplicate ? value ?? '' : internalRawValue),
[internalRawValue, isDuplicate, value],
);
// show/hide color picker
const handleClick = useCallback(() => {

View File

@ -62,6 +62,7 @@ const DateTimeControl: FC<WidgetControlProps<string, DateTimeField>> = ({
value,
t,
isDisabled,
isDuplicate,
onChange,
hasErrors,
}) => {
@ -118,7 +119,11 @@ const DateTimeControl: FC<WidgetControlProps<string, DateTimeField>> = ({
: field.default;
}, [field.default, field.picker_utc, format, inputFormat, timezoneOffset]);
const [internalValue, setInternalValue] = useState(value);
const [internalRawValue, setInternalValue] = useState(value);
const internalValue = useMemo(
() => (isDuplicate ? value : internalRawValue),
[internalRawValue, isDuplicate, value],
);
const dateValue: Date = useMemo(() => {
let valueToParse = internalValue;

View File

@ -213,6 +213,7 @@ const withFileControl = ({ forImage = false }: WithFileControlProps = {}) => {
collection,
field,
entry,
isDuplicate,
onChange,
openMediaLibrary,
clearMediaControl,
@ -222,7 +223,11 @@ const withFileControl = ({ forImage = false }: WithFileControlProps = {}) => {
}) => {
const controlID = useUUID();
const [collapsed, setCollapsed] = useState(false);
const [internalValue, setInternalValue] = useState(value ?? '');
const [internalRawValue, setInternalValue] = useState(value ?? '');
const internalValue = useMemo(
() => (isDuplicate ? value ?? '' : internalRawValue),
[internalRawValue, isDuplicate, value],
);
const handleOnChange = useCallback(
(newValue: string | string[]) => {

View File

@ -68,7 +68,9 @@ interface SortableItemProps {
field: ListField;
fieldsErrors: FieldsErrors;
submitted: boolean;
isDuplicate: boolean;
isFieldDuplicate: ((field: Field<UnknownField>) => boolean) | undefined;
isHidden: boolean;
isFieldHidden: ((field: Field<UnknownField>) => boolean) | undefined;
locale: string | undefined;
path: string;
@ -86,7 +88,9 @@ const SortableItem: FC<SortableItemProps> = ({
field,
fieldsErrors,
submitted,
isDuplicate,
isFieldDuplicate,
isHidden,
isFieldHidden,
locale,
path,
@ -118,7 +122,9 @@ const SortableItem: FC<SortableItemProps> = ({
field={field}
fieldsErrors={fieldsErrors}
submitted={submitted}
isDuplicate={isDuplicate}
isFieldDuplicate={isFieldDuplicate}
isHidden={isHidden}
isFieldHidden={isFieldHidden}
locale={locale}
path={path}
@ -188,7 +194,9 @@ const ListControl: FC<WidgetControlProps<ValueOrNestedValue[], ListField>> = ({
field,
fieldsErrors,
submitted,
isDuplicate,
isFieldDuplicate,
isHidden,
isFieldHidden,
locale,
onChange,
@ -356,7 +364,9 @@ const ListControl: FC<WidgetControlProps<ValueOrNestedValue[], ListField>> = ({
field={field}
fieldsErrors={fieldsErrors}
submitted={submitted}
isDuplicate={isDuplicate}
isFieldDuplicate={isFieldDuplicate}
isHidden={isHidden}
isFieldHidden={isFieldHidden}
locale={locale}
path={path}

View File

@ -93,7 +93,9 @@ interface ListItemProps
| 'field'
| 'fieldsErrors'
| 'submitted'
| 'isDuplicate'
| 'isFieldDuplicate'
| 'isHidden'
| 'isFieldHidden'
| 'locale'
| 'path'
@ -114,7 +116,9 @@ const ListItem: FC<ListItemProps> = ({
field,
fieldsErrors,
submitted,
isDuplicate,
isFieldDuplicate,
isHidden,
isFieldHidden,
locale,
path,
@ -197,9 +201,6 @@ const ListItem: FC<ListItemProps> = ({
[collapsed],
);
const isDuplicate = isFieldDuplicate && isFieldDuplicate(field);
const isHidden = isFieldHidden && isFieldHidden(field);
const finalValue = useMemo(() => {
if (field.fields && field.fields.length === 1) {
return {
@ -232,8 +233,9 @@ const ListItem: FC<ListItemProps> = ({
submitted={submitted}
parentPath={path}
isDisabled={isDuplicate}
isHidden={isHidden}
isParentDuplicate={isDuplicate}
isFieldDuplicate={isFieldDuplicate}
isParentHidden={isHidden}
isFieldHidden={isFieldHidden}
locale={locale}
i18n={i18n}

View File

@ -39,9 +39,14 @@ export interface WithMarkdownControlProps {
const withMarkdownControl = ({ useMdx }: WithMarkdownControlProps) => {
const MarkdownControl: FC<WidgetControlProps<string, MarkdownField>> = controlProps => {
const { label, value, onChange, hasErrors, collection, entry, field } = controlProps;
const { label, value, isDuplicate, onChange, hasErrors, collection, entry, field } =
controlProps;
const [internalValue, setInternalValue] = useState(value ?? '');
const [internalRawValue, setInternalValue] = useState(value ?? '');
const internalValue = useMemo(
() => (isDuplicate ? value ?? '' : internalRawValue),
[internalRawValue, isDuplicate, value],
);
const [hasFocus, setHasFocus] = useState(false);
const debouncedFocus = useDebounce(hasFocus, 150);

View File

@ -1,5 +1,5 @@
import TextField from '@mui/material/TextField';
import React, { useCallback, useState } from 'react';
import React, { useCallback, useMemo, useState } from 'react';
import type { FieldError, NumberField, WidgetControlProps } from '@staticcms/core/interface';
import type { ChangeEvent, FC } from 'react';
@ -62,10 +62,15 @@ const NumberControl: FC<WidgetControlProps<string | number, NumberField>> = ({
label,
field,
value,
isDuplicate,
onChange,
hasErrors,
}) => {
const [internalValue, setInternalValue] = useState(value ?? '');
const [internalRawValue, setInternalValue] = useState(value ?? '');
const internalValue = useMemo(
() => (isDuplicate ? value ?? '' : internalRawValue),
[internalRawValue, isDuplicate, value],
);
const handleChange = useCallback(
(e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {

View File

@ -53,7 +53,9 @@ const ObjectControl: FC<WidgetControlProps<ObjectValue, ObjectField>> = ({
fieldsErrors,
submitted,
forList,
isDuplicate,
isFieldDuplicate,
isHidden,
isFieldHidden,
locale,
path,
@ -96,9 +98,6 @@ const ObjectControl: FC<WidgetControlProps<ObjectValue, ObjectField>> = ({
parentPath = splitPath.join('.');
}
const isDuplicate = isFieldDuplicate && isFieldDuplicate(field);
const isHidden = isFieldHidden && isFieldHidden(field);
return (
<EditorControl
key={index}
@ -109,8 +108,9 @@ const ObjectControl: FC<WidgetControlProps<ObjectValue, ObjectField>> = ({
submitted={submitted}
parentPath={parentPath}
isDisabled={isDuplicate}
isHidden={isHidden}
isParentDuplicate={isDuplicate}
isFieldDuplicate={isFieldDuplicate}
isParentHidden={isHidden}
isFieldHidden={isFieldHidden}
locale={locale}
i18n={i18n}
@ -122,8 +122,10 @@ const ObjectControl: FC<WidgetControlProps<ObjectValue, ObjectField>> = ({
fieldsErrors,
forList,
i18n,
isDuplicate,
isFieldDuplicate,
isFieldHidden,
isHidden,
locale,
multiFields,
path,

View File

@ -118,13 +118,18 @@ function getSelectedValue(
const RelationControl: FC<WidgetControlProps<string | string[], RelationField>> = ({
value,
field,
isDuplicate,
onChange,
config,
locale,
label,
hasErrors,
}) => {
const [internalValue, setInternalValue] = useState(value);
const [internalRawValue, setInternalValue] = useState(value);
const internalValue = useMemo(
() => (isDuplicate ? value : internalRawValue),
[internalRawValue, isDuplicate, value],
);
const [initialOptions, setInitialOptions] = useState<HitOption[]>([]);
const searchCollectionSelector = useMemo(

View File

@ -31,9 +31,14 @@ const SelectControl: FC<WidgetControlProps<string | number | (string | number)[]
field,
value,
hasErrors,
isDuplicate,
onChange,
}) => {
const [internalValue, setInternalValue] = useState(value);
const [internalRawValue, setInternalValue] = useState(value);
const internalValue = useMemo(
() => (isDuplicate ? value : internalRawValue),
[internalRawValue, isDuplicate, value],
);
const fieldOptions: (string | number | Option)[] = useMemo(() => field.options, [field.options]);
const isMultiple = useMemo(() => field.multiple ?? false, [field.multiple]);

View File

@ -1,5 +1,5 @@
import TextField from '@mui/material/TextField';
import React, { useCallback, useState } from 'react';
import React, { useCallback, useMemo, useState } from 'react';
import type { StringOrTextField, WidgetControlProps } from '@staticcms/core/interface';
import type { ChangeEvent, FC } from 'react';
@ -7,10 +7,15 @@ import type { ChangeEvent, FC } from 'react';
const StringControl: FC<WidgetControlProps<string, StringOrTextField>> = ({
value,
label,
isDuplicate,
onChange,
hasErrors,
}) => {
const [internalValue, setInternalValue] = useState(value ?? '');
const [internalRawValue, setInternalValue] = useState(value ?? '');
const internalValue = useMemo(
() => (isDuplicate ? value ?? '' : internalRawValue),
[internalRawValue, isDuplicate, value],
);
const handleChange = useCallback(
(event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {

View File

@ -1,5 +1,5 @@
import TextField from '@mui/material/TextField';
import React, { useCallback, useState } from 'react';
import React, { useCallback, useMemo, useState } from 'react';
import type { StringOrTextField, WidgetControlProps } from '@staticcms/core/interface';
import type { ChangeEvent, FC } from 'react';
@ -7,10 +7,15 @@ import type { ChangeEvent, FC } from 'react';
const TextControl: FC<WidgetControlProps<string, StringOrTextField>> = ({
label,
value,
isDuplicate,
onChange,
hasErrors,
}) => {
const [internalValue, setInternalValue] = useState(value ?? '');
const [internalRawValue, setInternalValue] = useState(value ?? '');
const internalValue = useMemo(
() => (isDuplicate ? value ?? '' : internalRawValue),
[internalRawValue, isDuplicate, value],
);
const handleChange = useCallback(
(event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {