diff --git a/packages/sanity/src/core/form/inputs/CrossDatasetReferenceInput/CrossDatasetReferenceInput.tsx b/packages/sanity/src/core/form/inputs/CrossDatasetReferenceInput/CrossDatasetReferenceInput.tsx
index 4a3c9da6541..bea91ae6606 100644
--- a/packages/sanity/src/core/form/inputs/CrossDatasetReferenceInput/CrossDatasetReferenceInput.tsx
+++ b/packages/sanity/src/core/form/inputs/CrossDatasetReferenceInput/CrossDatasetReferenceInput.tsx
@@ -294,7 +294,7 @@ export function CrossDatasetReferenceInput(props: CrossDatasetReferenceInputProp
hit: hit,
}))}
onFocus={handleAutocompleteFocus}
- radius={1}
+ radius={2}
placeholder={t('inputs.reference.search-placeholder')}
onKeyDown={handleAutocompleteKeyDown}
readOnly={readOnly}
diff --git a/packages/sanity/src/core/form/inputs/ObjectInput/UnknownFields.tsx b/packages/sanity/src/core/form/inputs/ObjectInput/UnknownFields.tsx
index abab8e63a0f..6d736eac214 100644
--- a/packages/sanity/src/core/form/inputs/ObjectInput/UnknownFields.tsx
+++ b/packages/sanity/src/core/form/inputs/ObjectInput/UnknownFields.tsx
@@ -86,24 +86,27 @@ function UnknownField({
const {t} = useTranslation()
return (
-
-
-
-
- {fieldName}
-
-
- {JSON.stringify(value, null, 2)}
-
-
+
+
+ {fieldName}
+
+
+
+
+ {JSON.stringify(value, null, 2)}
+
+
- {readOnly && (
+ {readOnly && (
+
- )}
+
+ )}
- {!readOnly && (
+ {!readOnly && (
+
- )}
-
+
+ )}
)
}
diff --git a/packages/sanity/src/core/form/inputs/PortableText/object/BlockObject.styles.ts b/packages/sanity/src/core/form/inputs/PortableText/object/BlockObject.styles.ts
index 0ed9d8046ae..a83e4de5f91 100644
--- a/packages/sanity/src/core/form/inputs/PortableText/object/BlockObject.styles.ts
+++ b/packages/sanity/src/core/form/inputs/PortableText/object/BlockObject.styles.ts
@@ -24,7 +24,7 @@ export const Root = styled(Card)((props: {theme: Theme}) => {
position: relative;
&[data-focused] {
- box-shadow: 0 0 0 1px ${color.selectable?.primary.selected.border};
+ --card-border-color: var(--card-focus-ring-color);
}
&:not([data-focused]):not([data-selected]) {
diff --git a/packages/sanity/src/core/form/inputs/PortableText/object/BlockObjectActionsMenu.tsx b/packages/sanity/src/core/form/inputs/PortableText/object/BlockObjectActionsMenu.tsx
index 12e482ae76c..af7dd24271f 100644
--- a/packages/sanity/src/core/form/inputs/PortableText/object/BlockObjectActionsMenu.tsx
+++ b/packages/sanity/src/core/form/inputs/PortableText/object/BlockObjectActionsMenu.tsx
@@ -96,6 +96,7 @@ export function BlockObjectActionsMenu(props: BlockObjectActionsMenuProps): Reac
aria-label={t('inputs.portable-text.block.open-menu-aria-label')}
icon={EllipsisHorizontalIcon}
mode="bleed"
+ paddingY={3}
tabIndex={focused ? 0 : 1}
tooltipProps={{content: 'Open menu'}}
/>
diff --git a/packages/sanity/src/core/form/inputs/ReferenceInput/CreateButton.tsx b/packages/sanity/src/core/form/inputs/ReferenceInput/CreateButton.tsx
index 754232798f9..1bf03d7a26c 100644
--- a/packages/sanity/src/core/form/inputs/ReferenceInput/CreateButton.tsx
+++ b/packages/sanity/src/core/form/inputs/ReferenceInput/CreateButton.tsx
@@ -69,6 +69,7 @@ export function CreateButton(props: Props) {
text={t('inputs.reference.action.create-new-document-select')}
mode="ghost"
icon={AddIcon}
+ size="large"
/>
}
id={id}
@@ -111,6 +112,7 @@ export function CreateButton(props: Props) {
// eslint-disable-next-line react/jsx-no-bind
onClick={() => onCreate(createOptions[0])}
icon={AddIcon}
+ size="large"
/>
)
}
diff --git a/packages/sanity/src/core/form/inputs/ReferenceInput/ReferenceField.tsx b/packages/sanity/src/core/form/inputs/ReferenceInput/ReferenceField.tsx
index e7682dcd7f1..9b137bd5a6e 100644
--- a/packages/sanity/src/core/form/inputs/ReferenceInput/ReferenceField.tsx
+++ b/packages/sanity/src/core/form/inputs/ReferenceInput/ReferenceField.tsx
@@ -192,9 +192,9 @@ export function ReferenceField(props: ReferenceFieldProps) {
const menu = useMemo(
() =>
readOnly ? null : (
-
+
}
+ button={}
id={`${inputId}-menuButton`}
menu={
+ }
+ popover={MENU_POPOVER_PROPS}
+ />
),
[
handleDuplicate,
diff --git a/packages/sanity/src/core/form/inputs/ReferenceInput/ReferenceLinkCard.tsx b/packages/sanity/src/core/form/inputs/ReferenceInput/ReferenceLinkCard.tsx
index a28e3c590ec..f096b210a2c 100644
--- a/packages/sanity/src/core/form/inputs/ReferenceInput/ReferenceLinkCard.tsx
+++ b/packages/sanity/src/core/form/inputs/ReferenceInput/ReferenceLinkCard.tsx
@@ -5,7 +5,7 @@ import {Card, CardProps} from '@sanity/ui'
export const StyledCard = styled(Card)`
/* this is a hack to avoid layout jumps while previews are loading
there's probably better ways of solving this */
- min-height: 35px;
+ min-height: 33px;
position: relative;
/* TextWithTone uses its own logic to set color, and we therefore need */
diff --git a/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/Grid/ErrorItem.tsx b/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/Grid/ErrorItem.tsx
index 3b42e694a82..bc0ea92be16 100644
--- a/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/Grid/ErrorItem.tsx
+++ b/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/Grid/ErrorItem.tsx
@@ -29,7 +29,7 @@ export function ErrorItem(props: {member: ArrayItemError; sortable?: boolean}) {
style={{height: '100%'}}
menu={
}
+ button={}
id={`${id}-menuButton`}
menu={
diff --git a/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/Grid/GridArrayInput.tsx b/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/Grid/GridArrayInput.tsx
index b916aa8563b..a9c7006eea0 100644
--- a/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/Grid/GridArrayInput.tsx
+++ b/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/Grid/GridArrayInput.tsx
@@ -59,7 +59,7 @@ export function GridArrayInput- (props: ArrayOfObjectsInp
const memberKeys = useMemo(() => members.map((member) => member.key), [members])
return (
-
+
(props: ArrayOfObjectsInp
{...elementProps}
tabIndex={0}
>
-
+
{members?.length === 0 && (
-
+
{schemaType.placeholder || <>{t('inputs.array.no-items-label')}>}
diff --git a/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/Grid/GridItem.tsx b/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/Grid/GridItem.tsx
index 82366263be5..22515c206a2 100644
--- a/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/Grid/GridItem.tsx
+++ b/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/Grid/GridItem.tsx
@@ -125,7 +125,7 @@ export function GridItem
- (props: GridItemPr
const childValidation = useChildValidation(path, true)
const validation = useMemo(() => {
return childValidation.length === 0 ? null : (
-
+
)
@@ -138,7 +138,7 @@ export function GridItem
- (props: GridItemPr
() =>
readOnly ? null : (
}
+ button={}
id={`${props.inputId}-menuButton`}
menu={
diff --git a/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/List/ErrorItem.tsx b/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/List/ErrorItem.tsx
index 962f8aff857..93235810bd7 100644
--- a/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/List/ErrorItem.tsx
+++ b/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/List/ErrorItem.tsx
@@ -27,7 +27,7 @@ export function ErrorItem(props: {
tone="caution"
menu={
}
+ button={}
id={`${id}-menuButton`}
menu={
diff --git a/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/List/ListArrayInput.tsx b/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/List/ListArrayInput.tsx
index 47ba6bf7de5..3e96b4d93fb 100644
--- a/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/List/ListArrayInput.tsx
+++ b/packages/sanity/src/core/form/inputs/arrays/ArrayOfObjectsInput/List/ListArrayInput.tsx
@@ -187,7 +187,7 @@ export function ListArrayInput
- (props: ArrayOfObjectsInp
const paddingY = 1
return (
-
+
(props: ArrayOfObjectsInp
{...elementProps}
tabIndex={0}
>
-
+
{members.length === 0 ? (
-
+
{schemaType.placeholder || <>{t('inputs.array.no-items-label')}>}
@@ -205,7 +205,7 @@ export function ListArrayInput
- (props: ArrayOfObjectsInp
) : (
(props: ArrayOfObjectsInp
)}
-
(props: Preview
const childValidation = useChildValidation(path, true)
const validation = useMemo(() => {
return childValidation.length === 0 ? null : (
-
+
)
@@ -121,7 +121,7 @@ export function PreviewItem- (props: Preview
() =>
readOnly ? null : (
}
+ button={}
id={`${props.inputId}-menuButton`}
menu={
@@ -160,7 +160,7 @@ export function PreviewItem
- (props: Preview
as="button"
type="button"
tone="inherit"
- radius={2}
+ radius={1}
disabled={resolvingInitialValue}
onClick={onOpen}
ref={previewCardRef}
diff --git a/packages/sanity/src/core/form/inputs/arrays/ArrayOfPrimitivesInput/ArrayOfPrimitivesInput.tsx b/packages/sanity/src/core/form/inputs/arrays/ArrayOfPrimitivesInput/ArrayOfPrimitivesInput.tsx
index d3233ed2962..71ad2f62325 100644
--- a/packages/sanity/src/core/form/inputs/arrays/ArrayOfPrimitivesInput/ArrayOfPrimitivesInput.tsx
+++ b/packages/sanity/src/core/form/inputs/arrays/ArrayOfPrimitivesInput/ArrayOfPrimitivesInput.tsx
@@ -170,7 +170,7 @@ export class ArrayOfPrimitivesInput extends React.PureComponent<
}))
return (
-
+
}
+ button={}
id={`${inputId}-menuButton`}
popover={MENU_BUTTON_POPOVER_PROPS}
menu={
@@ -96,7 +96,7 @@ export const ItemRow = React.forwardRef(function ItemRow(
presence={presence.length === 0 ? null : }
validation={
validation.length > 0 ? (
-
+
) : null
diff --git a/packages/sanity/src/core/form/inputs/arrays/ArrayOfPrimitivesInput/NoItemsPlaceholder.tsx b/packages/sanity/src/core/form/inputs/arrays/ArrayOfPrimitivesInput/NoItemsPlaceholder.tsx
index d5706a47012..2c801e7929f 100644
--- a/packages/sanity/src/core/form/inputs/arrays/ArrayOfPrimitivesInput/NoItemsPlaceholder.tsx
+++ b/packages/sanity/src/core/form/inputs/arrays/ArrayOfPrimitivesInput/NoItemsPlaceholder.tsx
@@ -1,9 +1,7 @@
import type {ArraySchemaType} from '@sanity/types'
import {Card, Text} from '@sanity/ui'
-import {useTranslation} from '../../../../i18n'
import React from 'react'
-
-const CARD_STYLE = {borderStyle: 'dashed'} as const
+import {useTranslation} from '../../../../i18n'
/**
* Shows a placeholder for an empty array of primitives.
@@ -13,7 +11,7 @@ const CARD_STYLE = {borderStyle: 'dashed'} as const
export function NoItemsPlaceholder({schemaType}: {schemaType: ArraySchemaType}) {
const {t} = useTranslation()
return (
-
+
{schemaType.placeholder || t('inputs.array.no-items-label')}
diff --git a/packages/sanity/src/core/form/inputs/arrays/common/DragHandle.tsx b/packages/sanity/src/core/form/inputs/arrays/common/DragHandle.tsx
index f296f52189d..20dcc0f74c7 100644
--- a/packages/sanity/src/core/form/inputs/arrays/common/DragHandle.tsx
+++ b/packages/sanity/src/core/form/inputs/arrays/common/DragHandle.tsx
@@ -15,6 +15,7 @@ interface DragHandleProps {
grid?: boolean
size?: ButtonProps['size']
mode?: ButtonProps['mode']
+ paddingY?: ButtonProps['paddingY']
}
export const DragHandle = function DragHandle(props: DragHandleProps) {
diff --git a/packages/sanity/src/core/form/inputs/arrays/common/uploadTarget/uploadTarget.tsx b/packages/sanity/src/core/form/inputs/arrays/common/uploadTarget/uploadTarget.tsx
index 0abcfbd16c5..33bfc8445fb 100644
--- a/packages/sanity/src/core/form/inputs/arrays/common/uploadTarget/uploadTarget.tsx
+++ b/packages/sanity/src/core/form/inputs/arrays/common/uploadTarget/uploadTarget.tsx
@@ -79,11 +79,11 @@ export function uploadTarget(Component: React.ComponentType) {
count: rejected.length,
}),
description: rejected.map((task, i) => (
-
-
+
+
{task.file.name}
-
+
({task.file.type})
diff --git a/packages/sanity/src/core/form/inputs/arrays/layouts/CellLayout.tsx b/packages/sanity/src/core/form/inputs/arrays/layouts/CellLayout.tsx
index ffabf36f5c2..34522e4b184 100644
--- a/packages/sanity/src/core/form/inputs/arrays/layouts/CellLayout.tsx
+++ b/packages/sanity/src/core/form/inputs/arrays/layouts/CellLayout.tsx
@@ -17,13 +17,13 @@ interface RowLayoutProps {
}
const FooterFlex = styled(Flex)`
- min-height: 35px;
+ min-height: 33px;
`
const PresenceFlex = styled(Flex)`
position: absolute;
top: 0;
right: 0;
- height: 35px;
+ height: 33px;
`
const DragHandleCard = styled(Card)`
@@ -75,7 +75,7 @@ export function CellLayout(props: RowLayoutProps & ComponentProps)
border
selected={selected}
aria-selected={selected}
- radius={2}
+ radius={1}
tone={tone}
{...rest}
>
diff --git a/packages/sanity/src/core/form/inputs/arrays/layouts/RowLayout.tsx b/packages/sanity/src/core/form/inputs/arrays/layouts/RowLayout.tsx
index 4d027e31664..2f4b69016ed 100644
--- a/packages/sanity/src/core/form/inputs/arrays/layouts/RowLayout.tsx
+++ b/packages/sanity/src/core/form/inputs/arrays/layouts/RowLayout.tsx
@@ -56,20 +56,20 @@ export function RowLayout(props: RowLayoutProps) {
ref={elementRef}
selected={selected}
aria-selected={selected}
- radius={2}
+ radius={1}
padding={1}
tone={tone}
>
-
- {dragHandle && }
+
+ {dragHandle && }
{children}
{(presence || validation || menu) && (
-
- {presence && {presence}}
- {validation && {validation}}
+
+ {presence && {presence}}
+ {validation && {validation}}
{menu}
)}
diff --git a/packages/sanity/src/core/form/inputs/files/FileInput/FileActionsMenu.tsx b/packages/sanity/src/core/form/inputs/files/FileInput/FileActionsMenu.tsx
index 7f8de775014..0deea319ea7 100644
--- a/packages/sanity/src/core/form/inputs/files/FileInput/FileActionsMenu.tsx
+++ b/packages/sanity/src/core/form/inputs/files/FileInput/FileActionsMenu.tsx
@@ -139,6 +139,7 @@ export function FileActionsMenu(props: Props) {
aria-label={t('inputs.file.actions-menu.file-options.aria-label')}
data-testid="options-menu-button"
onClick={handleClick}
+ paddingY={3}
ref={setOptionsButtonRef}
/>