@wordpress/fields 0.37.1-next.v.202605131032.0 → 0.39.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (28) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/build/components/create-template-part-modal/index.cjs.map +3 -3
  3. package/build/components/media-edit/index.cjs +1 -3
  4. package/build/components/media-edit/index.cjs.map +3 -3
  5. package/build/fields/author/author-view.cjs.map +3 -3
  6. package/build/fields/pattern-title/view.cjs.map +3 -3
  7. package/build/fields/status/status-view.cjs.map +3 -3
  8. package/build-module/components/create-template-part-modal/index.mjs +3 -3
  9. package/build-module/components/create-template-part-modal/index.mjs.map +2 -2
  10. package/build-module/components/media-edit/index.mjs +9 -11
  11. package/build-module/components/media-edit/index.mjs.map +2 -2
  12. package/build-module/fields/author/author-view.mjs +5 -2
  13. package/build-module/fields/author/author-view.mjs.map +2 -2
  14. package/build-module/fields/pattern-title/view.mjs +2 -2
  15. package/build-module/fields/pattern-title/view.mjs.map +2 -2
  16. package/build-module/fields/status/status-view.mjs +5 -2
  17. package/build-module/fields/status/status-view.mjs.map +2 -2
  18. package/build-types/components/media-edit/index.d.ts.map +1 -1
  19. package/build-types/components/media-edit/use-moving-animation.d.ts +1 -1
  20. package/build-types/components/media-edit/use-moving-animation.d.ts.map +1 -1
  21. package/build-types/fields/author/author-view.d.ts.map +1 -1
  22. package/build-types/fields/status/status-view.d.ts.map +1 -1
  23. package/package.json +28 -28
  24. package/src/components/create-template-part-modal/index.tsx +3 -3
  25. package/src/components/media-edit/index.tsx +10 -12
  26. package/src/fields/author/author-view.tsx +5 -2
  27. package/src/fields/pattern-title/view.tsx +3 -3
  28. package/src/fields/status/status-view.tsx +5 -2
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/media-edit/index.tsx"],
4
- "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tDropZone,\n\tIcon,\n\tSpinner,\n\t__experimentalText as WCText,\n\t__experimentalTruncate as Truncate,\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n\tBaseControl,\n\tTooltip,\n} from '@wordpress/components';\nimport { isBlobURL, getBlobTypeByURL } from '@wordpress/blob';\nimport { store as coreStore, type Attachment } from '@wordpress/core-data';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport {\n\tuseCallback,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tarchive,\n\taudio,\n\tvideo,\n\tfile,\n\tcloseSmall,\n\terror as errorIcon,\n\tchevronUp,\n\tchevronDown,\n\tchevronLeft,\n\tchevronRight,\n} from '@wordpress/icons';\nimport { VisuallyHidden } from '@wordpress/ui';\nimport {\n\tMediaUpload,\n\tuploadMedia,\n\tprivateApis as mediaUtilsPrivateApis,\n} from '@wordpress/media-utils';\nimport { store as noticesStore } from '@wordpress/notices';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport type { MediaEditProps } from '../../types';\nimport useMovingAnimation from './use-moving-animation';\n\nconst { MediaUploadModal } = unlock( mediaUtilsPrivateApis );\n\nfunction AnimatedMediaItem( {\n\tchildren,\n\tindex,\n\tclassName,\n}: {\n\tchildren: React.ReactNode;\n\tindex: number;\n\tclassName?: string;\n} ) {\n\tconst ref = useMovingAnimation( index );\n\treturn (\n\t\t<div ref={ ref } className={ className }>\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\ntype BlobItem = {\n\tid: string;\n\tsource_url: string;\n\tmime_type: string | undefined;\n\talt_text?: string;\n};\n\nfunction normalizeValue( value: number | number[] | undefined ): number[] {\n\tif ( Array.isArray( value ) ) {\n\t\treturn value;\n\t}\n\treturn value ? [ value ] : [];\n}\n\n/**\n * Conditional Media component that uses MediaUploadModal when experiment is enabled,\n * otherwise falls back to media-utils MediaUpload.\n *\n * @param root0 Component props.\n * @param root0.render Render prop function that receives { open } object.\n * @param root0.multiple Whether to allow multiple media selections.\n * @return The component.\n */\nfunction ConditionalMediaUpload( { render, multiple, ...props }: any ) {\n\tconst [ isModalOpen, setIsModalOpen ] = useState( false );\n\tif ( ( window as any ).__experimentalDataViewsMediaModal ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ render && render( { open: () => setIsModalOpen( true ) } ) }\n\t\t\t\t{ isModalOpen && (\n\t\t\t\t\t<MediaUploadModal\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\tmultiple={ multiple }\n\t\t\t\t\t\tisOpen={ isModalOpen }\n\t\t\t\t\t\tonClose={ () => {\n\t\t\t\t\t\t\tsetIsModalOpen( false );\n\t\t\t\t\t\t\tprops.onClose?.();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonSelect={ ( media: any ) => {\n\t\t\t\t\t\t\tsetIsModalOpen( false );\n\t\t\t\t\t\t\tprops.onSelect?.( media );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</>\n\t\t);\n\t}\n\t// Fallback to media-utils MediaUpload when experiment is disabled.\n\treturn (\n\t\t<MediaUpload\n\t\t\t{ ...props }\n\t\t\trender={ render }\n\t\t\tmultiple={ multiple ? 'add' : undefined }\n\t\t/>\n\t);\n}\n\nfunction MediaPickerButton( {\n\topen,\n\tchildren,\n\tlabel,\n\tshowTooltip = false,\n\tonFilesDrop,\n\tattachment,\n\tisUploading = false,\n}: {\n\topen: () => void;\n\tchildren: React.ReactNode;\n\tlabel: string;\n\tshowTooltip?: boolean;\n\tonFilesDrop: MediaEditAttachmentsProps[ 'onFilesDrop' ];\n\tattachment?: MediaEditAttachment;\n\tisUploading?: boolean;\n} ) {\n\tconst isBlob = attachment && isBlobURL( attachment.source_url );\n\tconst mediaPickerButton = (\n\t\t<div\n\t\t\tclassName={ clsx( 'fields__media-edit-picker-button', {\n\t\t\t\t'has-attachment': attachment,\n\t\t\t} ) }\n\t\t\trole=\"button\"\n\t\t\ttabIndex={ 0 }\n\t\t\tonClick={ () => {\n\t\t\t\tif ( ! isUploading ) {\n\t\t\t\t\topen();\n\t\t\t\t}\n\t\t\t} }\n\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\tif ( isUploading ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tif ( event.key === 'Enter' || event.key === ' ' ) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\topen();\n\t\t\t\t}\n\t\t\t} }\n\t\t\taria-label={ label }\n\t\t\taria-disabled={ isUploading }\n\t\t>\n\t\t\t{ children }\n\t\t\t{ isBlob && (\n\t\t\t\t<span className=\"fields__media-edit-picker-button-spinner\">\n\t\t\t\t\t<Spinner />\n\t\t\t\t</span>\n\t\t\t) }\n\t\t\t{ ! isUploading && (\n\t\t\t\t<DropZone\n\t\t\t\t\tonFilesDrop={ ( files ) =>\n\t\t\t\t\t\tonFilesDrop( files, attachment?.id as number )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n\tif ( ! showTooltip ) {\n\t\treturn mediaPickerButton;\n\t}\n\treturn (\n\t\t<Tooltip text={ label } placement=\"top\">\n\t\t\t{ mediaPickerButton }\n\t\t</Tooltip>\n\t);\n}\n\nconst archiveMimeTypes = [\n\t'application/zip',\n\t'application/x-zip-compressed',\n\t'application/x-rar-compressed',\n\t'application/x-7z-compressed',\n\t'application/x-tar',\n\t'application/x-gzip',\n];\n\nfunction MediaTitle( { attachment }: { attachment: Attachment< 'view' > } ) {\n\treturn (\n\t\t<Truncate className=\"fields__media-edit-filename\">\n\t\t\t{ attachment.title.rendered }\n\t\t</Truncate>\n\t);\n}\n\nfunction MediaEditPlaceholder( props: {\n\topen: () => void;\n\tlabel: string;\n\tonFilesDrop: MediaEditAttachmentsProps[ 'onFilesDrop' ];\n\tisUploading: boolean;\n} ) {\n\treturn (\n\t\t<MediaPickerButton { ...props }>\n\t\t\t<span className=\"fields__media-edit-placeholder\">\n\t\t\t\t{ props.label }\n\t\t\t</span>\n\t\t</MediaPickerButton>\n\t);\n}\n\nfunction MoveButtons( {\n\titemId,\n\tindex,\n\ttotalItems,\n\tisUploading,\n\tmoveItem,\n\torientation = 'vertical',\n}: {\n\titemId: number;\n\tindex: number;\n\ttotalItems: number;\n\tisUploading: boolean;\n\tmoveItem: ( id: number, direction: 'up' | 'down' ) => void;\n\torientation?: 'vertical' | 'horizontal';\n} ) {\n\tconst isHorizontal = orientation === 'horizontal';\n\treturn (\n\t\t<>\n\t\t\t<Button\n\t\t\t\t__next40pxDefaultSize\n\t\t\t\ticon={ isHorizontal ? chevronLeft : chevronUp }\n\t\t\t\tlabel={ isHorizontal ? __( 'Move left' ) : __( 'Move up' ) }\n\t\t\t\tsize=\"small\"\n\t\t\t\tdisabled={ isUploading || index === 0 }\n\t\t\t\taccessibleWhenDisabled\n\t\t\t\ttooltipPosition=\"top\"\n\t\t\t\tonClick={ ( event: React.MouseEvent< HTMLButtonElement > ) => {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tmoveItem( itemId, 'up' );\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<Button\n\t\t\t\t__next40pxDefaultSize\n\t\t\t\ticon={ isHorizontal ? chevronRight : chevronDown }\n\t\t\t\tlabel={ isHorizontal ? __( 'Move right' ) : __( 'Move down' ) }\n\t\t\t\tsize=\"small\"\n\t\t\t\tdisabled={ isUploading || index === totalItems - 1 }\n\t\t\t\taccessibleWhenDisabled\n\t\t\t\ttooltipPosition=\"top\"\n\t\t\t\tonClick={ ( event: React.MouseEvent< HTMLButtonElement > ) => {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tmoveItem( itemId, 'down' );\n\t\t\t\t} }\n\t\t\t/>\n\t\t</>\n\t);\n}\n\nfunction MediaPreview( { attachment }: { attachment: MediaEditAttachment } ) {\n\tconst url = attachment.source_url;\n\tconst mimeType = attachment.mime_type || '';\n\tif ( mimeType.startsWith( 'image' ) ) {\n\t\treturn (\n\t\t\t<img\n\t\t\t\tclassName=\"fields__media-edit-thumbnail\"\n\t\t\t\talt={ attachment.alt_text || '' }\n\t\t\t\tsrc={ url }\n\t\t\t/>\n\t\t);\n\t} else if ( mimeType.startsWith( 'audio' ) ) {\n\t\treturn <Icon icon={ audio } />;\n\t} else if ( mimeType.startsWith( 'video' ) ) {\n\t\treturn <Icon icon={ video } />;\n\t} else if ( archiveMimeTypes.includes( mimeType ) ) {\n\t\treturn <Icon icon={ archive } />;\n\t}\n\treturn <Icon icon={ file } />;\n}\n\ntype MediaEditAttachment = Attachment< 'view' > | BlobItem;\ninterface MediaEditAttachmentsProps {\n\tallItems: Array< MediaEditAttachment > | null;\n\taddButtonLabel: string;\n\tmultiple?: boolean;\n\tremoveItem: ( itemId: number ) => void;\n\tmoveItem: ( itemId: number, direction: 'up' | 'down' ) => void;\n\topen: () => void;\n\tonFilesDrop: ( files: File[], attachmentId?: number ) => void;\n\tisUploading: boolean;\n\tsetTargetItemId: ( id?: number ) => void;\n}\n\nfunction ExpandedMediaEditAttachments( {\n\tallItems,\n\taddButtonLabel,\n\tmultiple,\n\tremoveItem,\n\tmoveItem,\n\topen,\n\tonFilesDrop,\n\tisUploading,\n\tsetTargetItemId,\n}: MediaEditAttachmentsProps ) {\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx( 'fields__media-edit-expanded', {\n\t\t\t\t'is-multiple': multiple,\n\t\t\t\t'is-single': ! multiple,\n\t\t\t\t'is-empty': ! allItems?.length,\n\t\t\t} ) }\n\t\t>\n\t\t\t{ allItems?.map( ( attachment, index ) => {\n\t\t\t\tconst hasPreviewImage =\n\t\t\t\t\tattachment.mime_type?.startsWith( 'image' );\n\t\t\t\tconst isBlob = isBlobURL( attachment.source_url );\n\t\t\t\tconst attachmentNumericId = attachment.id as number;\n\t\t\t\treturn (\n\t\t\t\t\t<AnimatedMediaItem\n\t\t\t\t\t\tkey={ attachment.id }\n\t\t\t\t\t\tindex={ index }\n\t\t\t\t\t\tclassName={ clsx( 'fields__media-edit-expanded-item', {\n\t\t\t\t\t\t\t'has-preview-image': hasPreviewImage,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<MediaPickerButton\n\t\t\t\t\t\t\topen={ () => {\n\t\t\t\t\t\t\t\tsetTargetItemId( attachmentNumericId );\n\t\t\t\t\t\t\t\topen();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t! isBlob\n\t\t\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t\t\t/* translators: %s: The title of the media item. */\n\t\t\t\t\t\t\t\t\t\t\t__( 'Replace %s' ),\n\t\t\t\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\t\t\t\tattachment as Attachment< 'view' >\n\t\t\t\t\t\t\t\t\t\t\t ).title.rendered\n\t\t\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t\t\t: __( 'Replace' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\t\t\t\tattachment={ attachment }\n\t\t\t\t\t\t\tisUploading={ isUploading }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div className=\"fields__media-edit-expanded-preview\">\n\t\t\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\t\t\t\talignment=\"center\"\n\t\t\t\t\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-expanded-preview-stack\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ ( ! isBlob || hasPreviewImage ) && (\n\t\t\t\t\t\t\t\t\t\t<MediaPreview\n\t\t\t\t\t\t\t\t\t\t\tattachment={ attachment }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</MediaPickerButton>\n\t\t\t\t\t\t{ ! isBlob && (\n\t\t\t\t\t\t\t<div className=\"fields__media-edit-expanded-overlay\">\n\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-expanded-actions\"\n\t\t\t\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\t\t\t\talignment=\"flex-end\"\n\t\t\t\t\t\t\t\t\texpanded={ false }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ multiple && allItems.length > 1 && (\n\t\t\t\t\t\t\t\t\t\t<MoveButtons\n\t\t\t\t\t\t\t\t\t\t\titemId={ attachmentNumericId }\n\t\t\t\t\t\t\t\t\t\t\tindex={ index }\n\t\t\t\t\t\t\t\t\t\t\ttotalItems={ allItems.length }\n\t\t\t\t\t\t\t\t\t\t\tisUploading={ isUploading }\n\t\t\t\t\t\t\t\t\t\t\tmoveItem={ moveItem }\n\t\t\t\t\t\t\t\t\t\t\torientation=\"horizontal\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Remove' ) }\n\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t\tdisabled={ isUploading }\n\t\t\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\t\t\ttooltipPosition=\"top\"\n\t\t\t\t\t\t\t\t\t\tonClick={ (\n\t\t\t\t\t\t\t\t\t\t\tevent: React.MouseEvent< HTMLButtonElement >\n\t\t\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\tremoveItem( attachmentNumericId );\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</AnimatedMediaItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t\t{ ( multiple || ! allItems?.length ) && (\n\t\t\t\t<MediaEditPlaceholder\n\t\t\t\t\topen={ () => {\n\t\t\t\t\t\tsetTargetItemId( undefined );\n\t\t\t\t\t\topen();\n\t\t\t\t\t} }\n\t\t\t\t\tlabel={ addButtonLabel }\n\t\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\t\tisUploading={ isUploading }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nfunction CompactMediaEditAttachments( {\n\tallItems,\n\taddButtonLabel,\n\tmultiple,\n\tremoveItem,\n\tmoveItem,\n\topen,\n\tonFilesDrop,\n\tisUploading,\n\tsetTargetItemId,\n}: MediaEditAttachmentsProps ) {\n\treturn (\n\t\t<>\n\t\t\t{ !! allItems?.length && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx( 'fields__media-edit-compact-group', {\n\t\t\t\t\t\t'is-single': allItems.length === 1,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<VStack spacing={ 0 }>\n\t\t\t\t\t\t{ allItems.map( ( attachment, index ) => {\n\t\t\t\t\t\t\tconst isBlob = isBlobURL( attachment.source_url );\n\t\t\t\t\t\t\tconst showMoveButtons =\n\t\t\t\t\t\t\t\tmultiple && allItems.length > 1;\n\t\t\t\t\t\t\tconst attachmentNumericId = attachment.id as number;\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<AnimatedMediaItem\n\t\t\t\t\t\t\t\t\tkey={ attachment.id }\n\t\t\t\t\t\t\t\t\tindex={ index }\n\t\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-compact\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<MediaPickerButton\n\t\t\t\t\t\t\t\t\t\topen={ () => {\n\t\t\t\t\t\t\t\t\t\t\tsetTargetItemId(\n\t\t\t\t\t\t\t\t\t\t\t\tattachmentNumericId\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\topen();\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Replace' ) }\n\t\t\t\t\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\t\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\t\t\t\t\t\t\tattachment={ attachment }\n\t\t\t\t\t\t\t\t\t\tisUploading={ isUploading }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t\t<MediaPreview\n\t\t\t\t\t\t\t\t\t\t\t\tattachment={ attachment }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t{ ! isBlob && (\n\t\t\t\t\t\t\t\t\t\t\t\t<MediaTitle\n\t\t\t\t\t\t\t\t\t\t\t\t\tattachment={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tattachment as Attachment< 'view' >\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t\t</MediaPickerButton>\n\t\t\t\t\t\t\t\t\t{ ! isBlob && (\n\t\t\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-compact-movers\"\n\t\t\t\t\t\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\t\t\t\t\t\talignment=\"flex-end\"\n\t\t\t\t\t\t\t\t\t\t\texpanded={ false }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ showMoveButtons && (\n\t\t\t\t\t\t\t\t\t\t\t\t<MoveButtons\n\t\t\t\t\t\t\t\t\t\t\t\t\titemId={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tattachmentNumericId\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex={ index }\n\t\t\t\t\t\t\t\t\t\t\t\t\ttotalItems={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tallItems.length\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tisUploading={ isUploading }\n\t\t\t\t\t\t\t\t\t\t\t\t\tmoveItem={ moveItem }\n\t\t\t\t\t\t\t\t\t\t\t\t\torientation=\"vertical\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Remove' ) }\n\t\t\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t\t\t\tdisabled={ isUploading }\n\t\t\t\t\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\t\t\t\t\ttooltipPosition=\"top\"\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={ (\n\t\t\t\t\t\t\t\t\t\t\t\t\tevent: React.MouseEvent< HTMLButtonElement >\n\t\t\t\t\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\t\t\tremoveItem(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tattachmentNumericId\n\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</AnimatedMediaItem>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</VStack>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t{ ( multiple || ! allItems?.length ) && (\n\t\t\t\t<MediaEditPlaceholder\n\t\t\t\t\topen={ () => {\n\t\t\t\t\t\tsetTargetItemId( undefined );\n\t\t\t\t\t\topen();\n\t\t\t\t\t} }\n\t\t\t\t\tlabel={ addButtonLabel }\n\t\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\t\tisUploading={ isUploading }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\n/**\n * A media edit control component that provides a media picker UI with upload functionality\n * for selecting WordPress media attachments. Supports both the traditional WordPress media\n * library and the experimental DataViews media modal.\n *\n * This component is intended to be used as the `Edit` property of a field definition when\n * registering fields with `registerEntityField` from `@wordpress/editor`.\n *\n * @template Item - The type of the item being edited.\n *\n * @param {MediaEditProps<Item>} props - The component props.\n * @param {Item} props.data - The item being edited.\n * @param {Object} props.field - The field configuration with getValue and setValue methods.\n * @param {Function} props.onChange - Callback function when the media selection changes.\n * @param {string[]} [props.allowedTypes] - Array of allowed media types. Use `['*']` to allow all file types. Default `['image']`.\n * @param {boolean} [props.multiple] - Whether to allow multiple media selections. Default `false`.\n * @param {boolean} [props.hideLabelFromVision] - Whether the label should be hidden from vision.\n * @param {boolean} [props.isExpanded] - Whether to render in an expanded form. Default `false`.\n *\n * @return {React.JSX.Element} The media edit control component.\n *\n * @example\n * ```tsx\n * import { MediaEdit } from '@wordpress/fields';\n * import type { DataFormControlProps } from '@wordpress/dataviews';\n *\n * const featuredImageField = {\n * id: 'featured_media',\n * type: 'media',\n * label: 'Featured Image',\n * Edit: (props: DataFormControlProps<MyPostType>) => (\n * <MediaEdit\n * {...props}\n * allowedTypes={['image']}\n * />\n * ),\n * };\n * ```\n */\nexport default function MediaEdit< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tallowedTypes = [ 'image' ],\n\tmultiple,\n\tisExpanded,\n\tvalidity,\n}: MediaEditProps< Item > ) {\n\tconst value = field.getValue( { item: data } );\n\tconst [ isTouched, setIsTouched ] = useState( false );\n\tconst validityTargetRef = useRef< HTMLInputElement >( null );\n\tconst [ customValidity, setCustomValidity ] = useState<\n\t\t| { type: 'valid' | 'validating' | 'invalid'; message?: string }\n\t\t| undefined\n\t>( undefined );\n\t// Listen for invalid event (e.g., form submission, reportValidity())\n\t// to show validation messages even before blur.\n\tuseEffect( () => {\n\t\tconst validityTarget = validityTargetRef.current;\n\t\tconst handler = () => {\n\t\t\tsetIsTouched( true );\n\t\t};\n\t\tvalidityTarget?.addEventListener( 'invalid', handler );\n\t\treturn () => validityTarget?.removeEventListener( 'invalid', handler );\n\t}, [] );\n\tconst attachments = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! value ) {\n\t\t\t\treturn null;\n\t\t\t}\n\t\t\tconst normalizedValue = normalizeValue( value );\n\t\t\t// Sorted IDs ensure stable cache key, avoiding\n\t\t\t// unnecessary new requests on reorder.\n\t\t\tconst sortedIds = normalizedValue.toSorted( ( a, b ) => a - b );\n\t\t\tconst { getEntityRecords } = select( coreStore );\n\t\t\treturn getEntityRecords( 'postType', 'attachment', {\n\t\t\t\tinclude: sortedIds,\n\t\t\t} ) as Attachment< 'view' >[] | null;\n\t\t},\n\t\t[ value ]\n\t);\n\t// Keep previous attachments during null transitions. When value changes,\n\t// useSelect briefly returns null while the new query resolves. For pure\n\t// reorders (same IDs), we fall back to the cached list to avoid a visual\n\t// flash in compact mode. For replacements/uploads (new IDs not in cache),\n\t// we let attachments be null as normal.\n\tconst stableAttachmentsRef = useRef< Attachment< 'view' >[] | null >(\n\t\tnull\n\t);\n\tif ( attachments !== null ) {\n\t\tstableAttachmentsRef.current = attachments;\n\t}\n\tlet stableAttachments = attachments;\n\tif ( attachments === null && stableAttachmentsRef.current && value ) {\n\t\tconst stableIds = new Set(\n\t\t\tstableAttachmentsRef.current.map( ( a ) => a.id )\n\t\t);\n\t\tif ( normalizeValue( value ).every( ( id ) => stableIds.has( id ) ) ) {\n\t\t\tstableAttachments = stableAttachmentsRef.current;\n\t\t}\n\t}\n\t// Reorder attachments to match value order.\n\tconst orderedAttachments = useMemo( () => {\n\t\tif ( ! stableAttachments ) {\n\t\t\treturn null;\n\t\t}\n\t\tconst normalizedValue = normalizeValue( value );\n\t\tconst attachmentMap = new Map(\n\t\t\tstableAttachments.map( ( a ) => [ a.id, a ] )\n\t\t);\n\t\treturn normalizedValue\n\t\t\t.map( ( id ) => attachmentMap.get( id ) )\n\t\t\t.filter( ( a ): a is Attachment< 'view' > => a !== undefined );\n\t}, [ stableAttachments, value ] );\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tconst { receiveEntityRecords } = useDispatch( coreStore );\n\t// Support one upload action at a time for now.\n\tconst [ targetItemId, setTargetItemId ] = useState< number >();\n\t// Deferred open: the legacy class-based MediaUpload reads props\n\t// imperatively when `open()` is called, so calling it in the same\n\t// handler as `setTargetItemId()` would open the modal with stale\n\t// `value`/`multiple` props. Setting a pending flag defers the open\n\t// until after the next render when props are up to date.\n\tconst openModalRef = useRef< () => void >( undefined );\n\tconst [ pendingOpen, setPendingOpen ] = useState( false );\n\tconst [ blobs, setBlobs ] = useState< string[] >( [] );\n\tuseEffect( () => {\n\t\tif ( pendingOpen ) {\n\t\t\tsetPendingOpen( false );\n\t\t\topenModalRef.current?.();\n\t\t}\n\t}, [ pendingOpen ] );\n\tconst onChangeControl = useCallback(\n\t\t( newValue: number | number[] | undefined ) =>\n\t\t\tonChange( field.setValue( { item: data, value: newValue } ) ),\n\t\t[ data, field, onChange ]\n\t);\n\tconst removeItem = useCallback(\n\t\t( itemId: number ) => {\n\t\t\tconst currentIds = normalizeValue( value );\n\t\t\tconst newIds = currentIds.filter( ( id ) => id !== itemId );\n\t\t\t// Mark as touched to immediately show any validation error.\n\t\t\tsetIsTouched( true );\n\t\t\tonChangeControl( newIds.length ? newIds : undefined );\n\t\t},\n\t\t[ value, onChangeControl ]\n\t);\n\tconst moveItem = useCallback(\n\t\t( itemId: number, direction: 'up' | 'down' ) => {\n\t\t\tif ( ! orderedAttachments ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst currentIds = orderedAttachments.map( ( a ) => a.id );\n\t\t\tconst index = currentIds.indexOf( itemId );\n\t\t\tconst newIndex = direction === 'up' ? index - 1 : index + 1;\n\t\t\t[ currentIds[ index ], currentIds[ newIndex ] ] = [\n\t\t\t\tcurrentIds[ newIndex ],\n\t\t\t\tcurrentIds[ index ],\n\t\t\t];\n\t\t\tonChangeControl( currentIds );\n\t\t},\n\t\t[ orderedAttachments, onChangeControl ]\n\t);\n\tconst onFilesDrop = useCallback(\n\t\t( files: File[], _targetItemId?: number ) => {\n\t\t\tsetTargetItemId( _targetItemId );\n\t\t\tuploadMedia( {\n\t\t\t\tallowedTypes: allowedTypes?.length ? allowedTypes : undefined,\n\t\t\t\tfilesList: files,\n\t\t\t\tonFileChange( uploadedMedia: any[] ) {\n\t\t\t\t\tconst blobUrls = uploadedMedia\n\t\t\t\t\t\t.filter( ( item ) => isBlobURL( item.url ) )\n\t\t\t\t\t\t.map( ( item ) => item.url );\n\t\t\t\t\tsetBlobs( blobUrls );\n\t\t\t\t\t// Wait for all uploads to complete before updating value.\n\t\t\t\t\tif ( !! blobUrls.length ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\t// `uploadMedia` creates attachments via `apiFetch`\n\t\t\t\t\t// outside the core-data store, so invalidate\n\t\t\t\t\t// all attachment queries to keep them fresh for\n\t\t\t\t\t// other components that rely on core-data.\n\t\t\t\t\treceiveEntityRecords(\n\t\t\t\t\t\t'postType',\n\t\t\t\t\t\t'attachment',\n\t\t\t\t\t\t[],\n\t\t\t\t\t\tundefined,\n\t\t\t\t\t\ttrue\n\t\t\t\t\t);\n\t\t\t\t\tconst uploadedIds = uploadedMedia.map(\n\t\t\t\t\t\t( item ) => item.id\n\t\t\t\t\t);\n\t\t\t\t\tif ( ! multiple ) {\n\t\t\t\t\t\tonChangeControl( uploadedIds[ 0 ] );\n\t\t\t\t\t\tsetTargetItemId( undefined );\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tconst currentValue = normalizeValue( value );\n\t\t\t\t\t// Dropped on placeholder: append new items.\n\t\t\t\t\tif ( _targetItemId === undefined ) {\n\t\t\t\t\t\tonChangeControl( [ ...currentValue, ...uploadedIds ] );\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// Dropped on existing item: insert at that position.\n\t\t\t\t\t\tconst newValue = [ ...currentValue ];\n\t\t\t\t\t\tnewValue.splice(\n\t\t\t\t\t\t\tcurrentValue.indexOf( _targetItemId ),\n\t\t\t\t\t\t\t1,\n\t\t\t\t\t\t\t...uploadedIds\n\t\t\t\t\t\t);\n\t\t\t\t\t\tonChangeControl( newValue );\n\t\t\t\t\t}\n\t\t\t\t\tsetTargetItemId( undefined );\n\t\t\t\t},\n\t\t\t\tonError( error: Error ) {\n\t\t\t\t\tsetTargetItemId( undefined );\n\t\t\t\t\tsetBlobs( [] );\n\t\t\t\t\tcreateErrorNotice( error.message, { type: 'snackbar' } );\n\t\t\t\t},\n\t\t\t\tmultiple: !! multiple,\n\t\t\t} );\n\t\t},\n\t\t[\n\t\t\tallowedTypes,\n\t\t\tvalue,\n\t\t\tmultiple,\n\t\t\tcreateErrorNotice,\n\t\t\tonChangeControl,\n\t\t\treceiveEntityRecords,\n\t\t]\n\t);\n\tconst addButtonLabel =\n\t\tfield.placeholder ||\n\t\t( multiple ? __( 'Choose files' ) : __( 'Choose file' ) );\n\t// Merge real attachments with any existing blob items that are being uploaded.\n\tconst allItems: Array< MediaEditAttachment > | null = useMemo( () => {\n\t\tif ( ! blobs.length ) {\n\t\t\treturn orderedAttachments;\n\t\t}\n\t\tconst items: Array< MediaEditAttachment > = [\n\t\t\t...( orderedAttachments || [] ),\n\t\t];\n\t\tconst blobItems = blobs.map( ( url ) => ( {\n\t\t\tid: url,\n\t\t\tsource_url: url,\n\t\t\tmime_type: getBlobTypeByURL( url ),\n\t\t} ) );\n\t\tif ( targetItemId !== undefined ) {\n\t\t\t// When files are dropped in existing media item, place the blobs at that item.\n\t\t\tconst targetIndex = items.findIndex(\n\t\t\t\t( a ) => a.id === targetItemId\n\t\t\t);\n\t\t\titems.splice( targetIndex, 1, ...blobItems );\n\t\t} else {\n\t\t\titems.push( ...blobItems );\n\t\t}\n\t\treturn items;\n\t}, [ orderedAttachments, targetItemId, blobs ] );\n\tuseEffect( () => {\n\t\tif ( ! isTouched ) {\n\t\t\treturn;\n\t\t}\n\t\tconst input = validityTargetRef.current;\n\t\tif ( ! input ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( validity ) {\n\t\t\tconst customValidityResult = validity?.custom;\n\t\t\tsetCustomValidity( customValidityResult );\n\n\t\t\t// Set custom validity on hidden input for HTML5 form validation.\n\t\t\tif ( customValidityResult?.type === 'invalid' ) {\n\t\t\t\tinput.setCustomValidity(\n\t\t\t\t\tcustomValidityResult.message || __( 'Invalid' )\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tinput.setCustomValidity( '' ); // Clear validity.\n\t\t\t}\n\t\t} else {\n\t\t\t// Clear any previous validation.\n\t\t\tinput.setCustomValidity( '' );\n\t\t\tsetCustomValidity( undefined );\n\t\t}\n\t}, [ isTouched, field.isValid, validity ] );\n\tconst onBlur = useCallback(\n\t\t( event: React.FocusEvent< HTMLElement > ) => {\n\t\t\tif ( isTouched ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif (\n\t\t\t\t! event.relatedTarget ||\n\t\t\t\t! event.currentTarget.contains( event.relatedTarget )\n\t\t\t) {\n\t\t\t\tsetIsTouched( true );\n\t\t\t}\n\t\t},\n\t\t[ isTouched ]\n\t);\n\treturn (\n\t\t<div onBlur={ onBlur }>\n\t\t\t<fieldset className=\"fields__media-edit\" data-field-id={ field.id }>\n\t\t\t\t<ConditionalMediaUpload\n\t\t\t\t\tonSelect={ ( selectedMedia: any ) => {\n\t\t\t\t\t\tif ( ! multiple ) {\n\t\t\t\t\t\t\tonChangeControl( selectedMedia.id );\n\t\t\t\t\t\t\tsetTargetItemId( undefined );\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tconst newIds = Array.isArray( selectedMedia )\n\t\t\t\t\t\t\t? selectedMedia.map( ( m: any ) => m.id )\n\t\t\t\t\t\t\t: [ selectedMedia.id ];\n\t\t\t\t\t\tconst currentValue = normalizeValue( value );\n\t\t\t\t\t\tif ( ! currentValue.length ) {\n\t\t\t\t\t\t\tonChangeControl( newIds );\n\t\t\t\t\t\t} else if ( targetItemId === undefined ) {\n\t\t\t\t\t\t\t// Placeholder clicked: keep existing items that are\n\t\t\t\t\t\t\t// still selected, then append newly selected items.\n\t\t\t\t\t\t\tconst existingItems = currentValue.filter( ( id ) =>\n\t\t\t\t\t\t\t\tnewIds.includes( id )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tconst newItems = newIds.filter(\n\t\t\t\t\t\t\t\t( id ) => ! currentValue.includes( id )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tonChangeControl( [\n\t\t\t\t\t\t\t\t...existingItems,\n\t\t\t\t\t\t\t\t...newItems,\n\t\t\t\t\t\t\t] );\n\t\t\t\t\t\t} else if ( selectedMedia.id !== targetItemId ) {\n\t\t\t\t\t\t\t// Remove selected item from its old position, if it\n\t\t\t\t\t\t\t// already exists in the value.\n\t\t\t\t\t\t\tconst filtered = currentValue.filter(\n\t\t\t\t\t\t\t\t( id ) => id !== selectedMedia.id\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t// Replace the clicked item with the selected one.\n\t\t\t\t\t\t\tonChangeControl(\n\t\t\t\t\t\t\t\tfiltered.map( ( id ) =>\n\t\t\t\t\t\t\t\t\tid === targetItemId ? selectedMedia.id : id\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t\tsetTargetItemId( undefined );\n\t\t\t\t\t} }\n\t\t\t\t\tonClose={ () => setTargetItemId( undefined ) }\n\t\t\t\t\tallowedTypes={ allowedTypes }\n\t\t\t\t\t// When replacing an existing item, pass only that item's ID\n\t\t\t\t\t// and open in single-select mode so the user picks exactly\n\t\t\t\t\t// one replacement, even if `multiple` is true.\n\t\t\t\t\tvalue={ targetItemId !== undefined ? targetItemId : value }\n\t\t\t\t\tmultiple={ multiple && targetItemId === undefined }\n\t\t\t\t\ttitle={ field.label }\n\t\t\t\t\trender={ ( { open }: any ) => {\n\t\t\t\t\t\t// Keep a ref to the latest `open` so the deferred effect can call it.\n\t\t\t\t\t\topenModalRef.current = open;\n\t\t\t\t\t\tconst AttachmentsComponent = isExpanded\n\t\t\t\t\t\t\t? ExpandedMediaEditAttachments\n\t\t\t\t\t\t\t: CompactMediaEditAttachments;\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<VStack spacing={ 2 }>\n\t\t\t\t\t\t\t\t{ field.label &&\n\t\t\t\t\t\t\t\t\t( hideLabelFromVision ? (\n\t\t\t\t\t\t\t\t\t\t<VisuallyHidden render={ <legend /> }>\n\t\t\t\t\t\t\t\t\t\t\t{ field.label }\n\t\t\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<BaseControl.VisualLabel\n\t\t\t\t\t\t\t\t\t\t\tas=\"legend\"\n\t\t\t\t\t\t\t\t\t\t\tstyle={ { marginBottom: 0 } }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ field.label }\n\t\t\t\t\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t\t<AttachmentsComponent\n\t\t\t\t\t\t\t\t\tallItems={ allItems }\n\t\t\t\t\t\t\t\t\taddButtonLabel={ addButtonLabel }\n\t\t\t\t\t\t\t\t\tmultiple={ multiple }\n\t\t\t\t\t\t\t\t\tremoveItem={ removeItem }\n\t\t\t\t\t\t\t\t\tmoveItem={ moveItem }\n\t\t\t\t\t\t\t\t\topen={ () => setPendingOpen( true ) }\n\t\t\t\t\t\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\t\t\t\t\t\tisUploading={ !! blobs.length }\n\t\t\t\t\t\t\t\t\tsetTargetItemId={ setTargetItemId }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{ field.description && (\n\t\t\t\t\t\t\t\t\t<WCText\n\t\t\t\t\t\t\t\t\t\tvariant=\"muted\"\n\t\t\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-description\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ field.description }\n\t\t\t\t\t\t\t\t\t</WCText>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t);\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</fieldset>\n\t\t\t{ /* Visually hidden text input for validation. */ }\n\t\t\t<VisuallyHidden>\n\t\t\t\t<input\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tref={ validityTargetRef }\n\t\t\t\t\tvalue={ value ?? '' }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tonChange={ () => {} }\n\t\t\t\t/>\n\t\t\t</VisuallyHidden>\n\t\t\t{ customValidity && (\n\t\t\t\t<div aria-live=\"polite\">\n\t\t\t\t\t<p\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t'components-validated-control__indicator',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-invalid': customValidity.type === 'invalid',\n\t\t\t\t\t\t\t\t'is-valid': customValidity.type === 'valid',\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tclassName=\"components-validated-control__indicator-icon\"\n\t\t\t\t\t\t\ticon={ errorIcon }\n\t\t\t\t\t\t\tsize={ 16 }\n\t\t\t\t\t\t\tfill=\"currentColor\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ customValidity.message }\n\t\t\t\t\t</p>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tDropZone,\n\tIcon as WCIcon,\n\tSpinner,\n\t__experimentalText as WCText,\n\t__experimentalTruncate as Truncate,\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n\tBaseControl,\n\tTooltip as WCTooltip,\n} from '@wordpress/components';\nimport { isBlobURL, getBlobTypeByURL } from '@wordpress/blob';\nimport { store as coreStore, type Attachment } from '@wordpress/core-data';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport {\n\tuseCallback,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tarchive,\n\taudio,\n\tvideo,\n\tfile,\n\tcloseSmall,\n\terror as errorIcon,\n\tchevronUp,\n\tchevronDown,\n\tchevronLeft,\n\tchevronRight,\n} from '@wordpress/icons';\nimport { VisuallyHidden } from '@wordpress/ui';\nimport {\n\tMediaUpload,\n\tuploadMedia,\n\tprivateApis as mediaUtilsPrivateApis,\n} from '@wordpress/media-utils';\nimport { store as noticesStore } from '@wordpress/notices';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport type { MediaEditProps } from '../../types';\nimport useMovingAnimation from './use-moving-animation';\n\nconst { MediaUploadModal } = unlock( mediaUtilsPrivateApis );\n\nfunction AnimatedMediaItem( {\n\tchildren,\n\tindex,\n\tclassName,\n}: {\n\tchildren: React.ReactNode;\n\tindex: number;\n\tclassName?: string;\n} ) {\n\tconst ref = useMovingAnimation( index );\n\treturn (\n\t\t<div ref={ ref } className={ className }>\n\t\t\t{ children }\n\t\t</div>\n\t);\n}\n\ntype BlobItem = {\n\tid: string;\n\tsource_url: string;\n\tmime_type: string | undefined;\n\talt_text?: string;\n};\n\nfunction normalizeValue( value: number | number[] | undefined ): number[] {\n\tif ( Array.isArray( value ) ) {\n\t\treturn value;\n\t}\n\treturn value ? [ value ] : [];\n}\n\n/**\n * Conditional Media component that uses MediaUploadModal when experiment is enabled,\n * otherwise falls back to media-utils MediaUpload.\n *\n * @param root0 Component props.\n * @param root0.render Render prop function that receives { open } object.\n * @param root0.multiple Whether to allow multiple media selections.\n * @return The component.\n */\nfunction ConditionalMediaUpload( { render, multiple, ...props }: any ) {\n\tconst [ isModalOpen, setIsModalOpen ] = useState( false );\n\tif ( ( window as any ).__experimentalDataViewsMediaModal ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ render && render( { open: () => setIsModalOpen( true ) } ) }\n\t\t\t\t{ isModalOpen && (\n\t\t\t\t\t<MediaUploadModal\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\tmultiple={ multiple }\n\t\t\t\t\t\tisOpen={ isModalOpen }\n\t\t\t\t\t\tonClose={ () => {\n\t\t\t\t\t\t\tsetIsModalOpen( false );\n\t\t\t\t\t\t\tprops.onClose?.();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonSelect={ ( media: any ) => {\n\t\t\t\t\t\t\tsetIsModalOpen( false );\n\t\t\t\t\t\t\tprops.onSelect?.( media );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</>\n\t\t);\n\t}\n\t// Fallback to media-utils MediaUpload when experiment is disabled.\n\treturn (\n\t\t<MediaUpload\n\t\t\t{ ...props }\n\t\t\trender={ render }\n\t\t\tmultiple={ multiple ? 'add' : undefined }\n\t\t/>\n\t);\n}\n\nfunction MediaPickerButton( {\n\topen,\n\tchildren,\n\tlabel,\n\tshowTooltip = false,\n\tonFilesDrop,\n\tattachment,\n\tisUploading = false,\n}: {\n\topen: () => void;\n\tchildren: React.ReactNode;\n\tlabel: string;\n\tshowTooltip?: boolean;\n\tonFilesDrop: MediaEditAttachmentsProps[ 'onFilesDrop' ];\n\tattachment?: MediaEditAttachment;\n\tisUploading?: boolean;\n} ) {\n\tconst isBlob = attachment && isBlobURL( attachment.source_url );\n\tconst mediaPickerButton = (\n\t\t<div\n\t\t\tclassName={ clsx( 'fields__media-edit-picker-button', {\n\t\t\t\t'has-attachment': attachment,\n\t\t\t} ) }\n\t\t\trole=\"button\"\n\t\t\ttabIndex={ 0 }\n\t\t\tonClick={ () => {\n\t\t\t\tif ( ! isUploading ) {\n\t\t\t\t\topen();\n\t\t\t\t}\n\t\t\t} }\n\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\tif ( isUploading ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tif ( event.key === 'Enter' || event.key === ' ' ) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\topen();\n\t\t\t\t}\n\t\t\t} }\n\t\t\taria-label={ label }\n\t\t\taria-disabled={ isUploading }\n\t\t>\n\t\t\t{ children }\n\t\t\t{ isBlob && (\n\t\t\t\t<span className=\"fields__media-edit-picker-button-spinner\">\n\t\t\t\t\t<Spinner />\n\t\t\t\t</span>\n\t\t\t) }\n\t\t\t{ ! isUploading && (\n\t\t\t\t<DropZone\n\t\t\t\t\tonFilesDrop={ ( files ) =>\n\t\t\t\t\t\tonFilesDrop( files, attachment?.id as number )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n\tif ( ! showTooltip ) {\n\t\treturn mediaPickerButton;\n\t}\n\treturn (\n\t\t<WCTooltip text={ label } placement=\"top\">\n\t\t\t{ mediaPickerButton }\n\t\t</WCTooltip>\n\t);\n}\n\nconst archiveMimeTypes = [\n\t'application/zip',\n\t'application/x-zip-compressed',\n\t'application/x-rar-compressed',\n\t'application/x-7z-compressed',\n\t'application/x-tar',\n\t'application/x-gzip',\n];\n\nfunction MediaTitle( { attachment }: { attachment: Attachment< 'view' > } ) {\n\treturn (\n\t\t<Truncate className=\"fields__media-edit-filename\">\n\t\t\t{ attachment.title.rendered }\n\t\t</Truncate>\n\t);\n}\n\nfunction MediaEditPlaceholder( props: {\n\topen: () => void;\n\tlabel: string;\n\tonFilesDrop: MediaEditAttachmentsProps[ 'onFilesDrop' ];\n\tisUploading: boolean;\n} ) {\n\treturn (\n\t\t<MediaPickerButton { ...props }>\n\t\t\t<span className=\"fields__media-edit-placeholder\">\n\t\t\t\t{ props.label }\n\t\t\t</span>\n\t\t</MediaPickerButton>\n\t);\n}\n\nfunction MoveButtons( {\n\titemId,\n\tindex,\n\ttotalItems,\n\tisUploading,\n\tmoveItem,\n\torientation = 'vertical',\n}: {\n\titemId: number;\n\tindex: number;\n\ttotalItems: number;\n\tisUploading: boolean;\n\tmoveItem: ( id: number, direction: 'up' | 'down' ) => void;\n\torientation?: 'vertical' | 'horizontal';\n} ) {\n\tconst isHorizontal = orientation === 'horizontal';\n\treturn (\n\t\t<>\n\t\t\t<Button\n\t\t\t\t__next40pxDefaultSize\n\t\t\t\ticon={ isHorizontal ? chevronLeft : chevronUp }\n\t\t\t\tlabel={ isHorizontal ? __( 'Move left' ) : __( 'Move up' ) }\n\t\t\t\tsize=\"small\"\n\t\t\t\tdisabled={ isUploading || index === 0 }\n\t\t\t\taccessibleWhenDisabled\n\t\t\t\ttooltipPosition=\"top\"\n\t\t\t\tonClick={ ( event: React.MouseEvent< HTMLButtonElement > ) => {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tmoveItem( itemId, 'up' );\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<Button\n\t\t\t\t__next40pxDefaultSize\n\t\t\t\ticon={ isHorizontal ? chevronRight : chevronDown }\n\t\t\t\tlabel={ isHorizontal ? __( 'Move right' ) : __( 'Move down' ) }\n\t\t\t\tsize=\"small\"\n\t\t\t\tdisabled={ isUploading || index === totalItems - 1 }\n\t\t\t\taccessibleWhenDisabled\n\t\t\t\ttooltipPosition=\"top\"\n\t\t\t\tonClick={ ( event: React.MouseEvent< HTMLButtonElement > ) => {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tmoveItem( itemId, 'down' );\n\t\t\t\t} }\n\t\t\t/>\n\t\t</>\n\t);\n}\n\nfunction MediaPreview( { attachment }: { attachment: MediaEditAttachment } ) {\n\tconst url = attachment.source_url;\n\tconst mimeType = attachment.mime_type || '';\n\tif ( mimeType.startsWith( 'image' ) ) {\n\t\treturn (\n\t\t\t<img\n\t\t\t\tclassName=\"fields__media-edit-thumbnail\"\n\t\t\t\talt={ attachment.alt_text || '' }\n\t\t\t\tsrc={ url }\n\t\t\t/>\n\t\t);\n\t} else if ( mimeType.startsWith( 'audio' ) ) {\n\t\treturn <WCIcon icon={ audio } />;\n\t} else if ( mimeType.startsWith( 'video' ) ) {\n\t\treturn <WCIcon icon={ video } />;\n\t} else if ( archiveMimeTypes.includes( mimeType ) ) {\n\t\treturn <WCIcon icon={ archive } />;\n\t}\n\treturn <WCIcon icon={ file } />;\n}\n\ntype MediaEditAttachment = Attachment< 'view' > | BlobItem;\ninterface MediaEditAttachmentsProps {\n\tallItems: Array< MediaEditAttachment > | null;\n\taddButtonLabel: string;\n\tmultiple?: boolean;\n\tremoveItem: ( itemId: number ) => void;\n\tmoveItem: ( itemId: number, direction: 'up' | 'down' ) => void;\n\topen: () => void;\n\tonFilesDrop: ( files: File[], attachmentId?: number ) => void;\n\tisUploading: boolean;\n\tsetTargetItemId: ( id?: number ) => void;\n}\n\nfunction ExpandedMediaEditAttachments( {\n\tallItems,\n\taddButtonLabel,\n\tmultiple,\n\tremoveItem,\n\tmoveItem,\n\topen,\n\tonFilesDrop,\n\tisUploading,\n\tsetTargetItemId,\n}: MediaEditAttachmentsProps ) {\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx( 'fields__media-edit-expanded', {\n\t\t\t\t'is-multiple': multiple,\n\t\t\t\t'is-single': ! multiple,\n\t\t\t\t'is-empty': ! allItems?.length,\n\t\t\t} ) }\n\t\t>\n\t\t\t{ allItems?.map( ( attachment, index ) => {\n\t\t\t\tconst hasPreviewImage =\n\t\t\t\t\tattachment.mime_type?.startsWith( 'image' );\n\t\t\t\tconst isBlob = isBlobURL( attachment.source_url );\n\t\t\t\tconst attachmentNumericId = attachment.id as number;\n\t\t\t\treturn (\n\t\t\t\t\t<AnimatedMediaItem\n\t\t\t\t\t\tkey={ attachment.id }\n\t\t\t\t\t\tindex={ index }\n\t\t\t\t\t\tclassName={ clsx( 'fields__media-edit-expanded-item', {\n\t\t\t\t\t\t\t'has-preview-image': hasPreviewImage,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<MediaPickerButton\n\t\t\t\t\t\t\topen={ () => {\n\t\t\t\t\t\t\t\tsetTargetItemId( attachmentNumericId );\n\t\t\t\t\t\t\t\topen();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t! isBlob\n\t\t\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t\t\t/* translators: %s: The title of the media item. */\n\t\t\t\t\t\t\t\t\t\t\t__( 'Replace %s' ),\n\t\t\t\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\t\t\t\tattachment as Attachment< 'view' >\n\t\t\t\t\t\t\t\t\t\t\t ).title.rendered\n\t\t\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t\t\t: __( 'Replace' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\t\t\t\tattachment={ attachment }\n\t\t\t\t\t\t\tisUploading={ isUploading }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div className=\"fields__media-edit-expanded-preview\">\n\t\t\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\t\t\t\talignment=\"center\"\n\t\t\t\t\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-expanded-preview-stack\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ ( ! isBlob || hasPreviewImage ) && (\n\t\t\t\t\t\t\t\t\t\t<MediaPreview\n\t\t\t\t\t\t\t\t\t\t\tattachment={ attachment }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</MediaPickerButton>\n\t\t\t\t\t\t{ ! isBlob && (\n\t\t\t\t\t\t\t<div className=\"fields__media-edit-expanded-overlay\">\n\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-expanded-actions\"\n\t\t\t\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\t\t\t\talignment=\"flex-end\"\n\t\t\t\t\t\t\t\t\texpanded={ false }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ multiple && allItems.length > 1 && (\n\t\t\t\t\t\t\t\t\t\t<MoveButtons\n\t\t\t\t\t\t\t\t\t\t\titemId={ attachmentNumericId }\n\t\t\t\t\t\t\t\t\t\t\tindex={ index }\n\t\t\t\t\t\t\t\t\t\t\ttotalItems={ allItems.length }\n\t\t\t\t\t\t\t\t\t\t\tisUploading={ isUploading }\n\t\t\t\t\t\t\t\t\t\t\tmoveItem={ moveItem }\n\t\t\t\t\t\t\t\t\t\t\torientation=\"horizontal\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Remove' ) }\n\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t\tdisabled={ isUploading }\n\t\t\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\t\t\ttooltipPosition=\"top\"\n\t\t\t\t\t\t\t\t\t\tonClick={ (\n\t\t\t\t\t\t\t\t\t\t\tevent: React.MouseEvent< HTMLButtonElement >\n\t\t\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\tremoveItem( attachmentNumericId );\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</AnimatedMediaItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t\t{ ( multiple || ! allItems?.length ) && (\n\t\t\t\t<MediaEditPlaceholder\n\t\t\t\t\topen={ () => {\n\t\t\t\t\t\tsetTargetItemId( undefined );\n\t\t\t\t\t\topen();\n\t\t\t\t\t} }\n\t\t\t\t\tlabel={ addButtonLabel }\n\t\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\t\tisUploading={ isUploading }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nfunction CompactMediaEditAttachments( {\n\tallItems,\n\taddButtonLabel,\n\tmultiple,\n\tremoveItem,\n\tmoveItem,\n\topen,\n\tonFilesDrop,\n\tisUploading,\n\tsetTargetItemId,\n}: MediaEditAttachmentsProps ) {\n\treturn (\n\t\t<>\n\t\t\t{ !! allItems?.length && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx( 'fields__media-edit-compact-group', {\n\t\t\t\t\t\t'is-single': allItems.length === 1,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<VStack spacing={ 0 }>\n\t\t\t\t\t\t{ allItems.map( ( attachment, index ) => {\n\t\t\t\t\t\t\tconst isBlob = isBlobURL( attachment.source_url );\n\t\t\t\t\t\t\tconst showMoveButtons =\n\t\t\t\t\t\t\t\tmultiple && allItems.length > 1;\n\t\t\t\t\t\t\tconst attachmentNumericId = attachment.id as number;\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<AnimatedMediaItem\n\t\t\t\t\t\t\t\t\tkey={ attachment.id }\n\t\t\t\t\t\t\t\t\tindex={ index }\n\t\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-compact\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<MediaPickerButton\n\t\t\t\t\t\t\t\t\t\topen={ () => {\n\t\t\t\t\t\t\t\t\t\t\tsetTargetItemId(\n\t\t\t\t\t\t\t\t\t\t\t\tattachmentNumericId\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\topen();\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Replace' ) }\n\t\t\t\t\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\t\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\t\t\t\t\t\t\tattachment={ attachment }\n\t\t\t\t\t\t\t\t\t\tisUploading={ isUploading }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t\t<MediaPreview\n\t\t\t\t\t\t\t\t\t\t\t\tattachment={ attachment }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t{ ! isBlob && (\n\t\t\t\t\t\t\t\t\t\t\t\t<MediaTitle\n\t\t\t\t\t\t\t\t\t\t\t\t\tattachment={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tattachment as Attachment< 'view' >\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t\t</MediaPickerButton>\n\t\t\t\t\t\t\t\t\t{ ! isBlob && (\n\t\t\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-compact-movers\"\n\t\t\t\t\t\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\t\t\t\t\t\talignment=\"flex-end\"\n\t\t\t\t\t\t\t\t\t\t\texpanded={ false }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ showMoveButtons && (\n\t\t\t\t\t\t\t\t\t\t\t\t<MoveButtons\n\t\t\t\t\t\t\t\t\t\t\t\t\titemId={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tattachmentNumericId\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex={ index }\n\t\t\t\t\t\t\t\t\t\t\t\t\ttotalItems={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tallItems.length\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tisUploading={ isUploading }\n\t\t\t\t\t\t\t\t\t\t\t\t\tmoveItem={ moveItem }\n\t\t\t\t\t\t\t\t\t\t\t\t\torientation=\"vertical\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Remove' ) }\n\t\t\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t\t\t\tdisabled={ isUploading }\n\t\t\t\t\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\t\t\t\t\ttooltipPosition=\"top\"\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={ (\n\t\t\t\t\t\t\t\t\t\t\t\t\tevent: React.MouseEvent< HTMLButtonElement >\n\t\t\t\t\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\t\t\tremoveItem(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tattachmentNumericId\n\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</AnimatedMediaItem>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</VStack>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t{ ( multiple || ! allItems?.length ) && (\n\t\t\t\t<MediaEditPlaceholder\n\t\t\t\t\topen={ () => {\n\t\t\t\t\t\tsetTargetItemId( undefined );\n\t\t\t\t\t\topen();\n\t\t\t\t\t} }\n\t\t\t\t\tlabel={ addButtonLabel }\n\t\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\t\tisUploading={ isUploading }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\n/**\n * A media edit control component that provides a media picker UI with upload functionality\n * for selecting WordPress media attachments. Supports both the traditional WordPress media\n * library and the experimental DataViews media modal.\n *\n * This component is intended to be used as the `Edit` property of a field definition when\n * registering fields with `registerEntityField` from `@wordpress/editor`.\n *\n * @template Item - The type of the item being edited.\n *\n * @param {MediaEditProps<Item>} props - The component props.\n * @param {Item} props.data - The item being edited.\n * @param {Object} props.field - The field configuration with getValue and setValue methods.\n * @param {Function} props.onChange - Callback function when the media selection changes.\n * @param {string[]} [props.allowedTypes] - Array of allowed media types. Use `['*']` to allow all file types. Default `['image']`.\n * @param {boolean} [props.multiple] - Whether to allow multiple media selections. Default `false`.\n * @param {boolean} [props.hideLabelFromVision] - Whether the label should be hidden from vision.\n * @param {boolean} [props.isExpanded] - Whether to render in an expanded form. Default `false`.\n *\n * @return {React.JSX.Element} The media edit control component.\n *\n * @example\n * ```tsx\n * import { MediaEdit } from '@wordpress/fields';\n * import type { DataFormControlProps } from '@wordpress/dataviews';\n *\n * const featuredImageField = {\n * id: 'featured_media',\n * type: 'media',\n * label: 'Featured Image',\n * Edit: (props: DataFormControlProps<MyPostType>) => (\n * <MediaEdit\n * {...props}\n * allowedTypes={['image']}\n * />\n * ),\n * };\n * ```\n */\nexport default function MediaEdit< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tallowedTypes = [ 'image' ],\n\tmultiple,\n\tisExpanded,\n\tvalidity,\n}: MediaEditProps< Item > ) {\n\tconst value = field.getValue( { item: data } );\n\tconst [ isTouched, setIsTouched ] = useState( false );\n\tconst validityTargetRef = useRef< HTMLInputElement >( null );\n\tconst [ customValidity, setCustomValidity ] = useState<\n\t\t| { type: 'valid' | 'validating' | 'invalid'; message?: string }\n\t\t| undefined\n\t>( undefined );\n\t// Listen for invalid event (e.g., form submission, reportValidity())\n\t// to show validation messages even before blur.\n\tuseEffect( () => {\n\t\tconst validityTarget = validityTargetRef.current;\n\t\tconst handler = () => {\n\t\t\tsetIsTouched( true );\n\t\t};\n\t\tvalidityTarget?.addEventListener( 'invalid', handler );\n\t\treturn () => validityTarget?.removeEventListener( 'invalid', handler );\n\t}, [] );\n\tconst attachments = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! value ) {\n\t\t\t\treturn null;\n\t\t\t}\n\t\t\tconst normalizedValue = normalizeValue( value );\n\t\t\t// Sorted IDs ensure stable cache key, avoiding\n\t\t\t// unnecessary new requests on reorder.\n\t\t\tconst sortedIds = normalizedValue.toSorted( ( a, b ) => a - b );\n\t\t\tconst { getEntityRecords } = select( coreStore );\n\t\t\treturn getEntityRecords( 'postType', 'attachment', {\n\t\t\t\tinclude: sortedIds,\n\t\t\t} ) as Attachment< 'view' >[] | null;\n\t\t},\n\t\t[ value ]\n\t);\n\t// Keep previous attachments during null transitions. When value changes,\n\t// useSelect briefly returns null while the new query resolves. For pure\n\t// reorders (same IDs), we fall back to the cached list to avoid a visual\n\t// flash in compact mode. For replacements/uploads (new IDs not in cache),\n\t// we let attachments be null as normal.\n\tconst stableAttachmentsRef = useRef< Attachment< 'view' >[] >( null );\n\tif ( attachments !== null ) {\n\t\tstableAttachmentsRef.current = attachments;\n\t}\n\tlet stableAttachments = attachments;\n\tif ( attachments === null && stableAttachmentsRef.current && value ) {\n\t\tconst stableIds = new Set(\n\t\t\tstableAttachmentsRef.current.map( ( a ) => a.id )\n\t\t);\n\t\tif ( normalizeValue( value ).every( ( id ) => stableIds.has( id ) ) ) {\n\t\t\tstableAttachments = stableAttachmentsRef.current;\n\t\t}\n\t}\n\t// Reorder attachments to match value order.\n\tconst orderedAttachments = useMemo( () => {\n\t\tif ( ! stableAttachments ) {\n\t\t\treturn null;\n\t\t}\n\t\tconst normalizedValue = normalizeValue( value );\n\t\tconst attachmentMap = new Map(\n\t\t\tstableAttachments.map( ( a ) => [ a.id, a ] )\n\t\t);\n\t\treturn normalizedValue\n\t\t\t.map( ( id ) => attachmentMap.get( id ) )\n\t\t\t.filter( ( a ): a is Attachment< 'view' > => a !== undefined );\n\t}, [ stableAttachments, value ] );\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tconst { receiveEntityRecords } = useDispatch( coreStore );\n\t// Support one upload action at a time for now.\n\tconst [ targetItemId, setTargetItemId ] = useState< number >();\n\t// Deferred open: the legacy class-based MediaUpload reads props\n\t// imperatively when `open()` is called, so calling it in the same\n\t// handler as `setTargetItemId()` would open the modal with stale\n\t// `value`/`multiple` props. Setting a pending flag defers the open\n\t// until after the next render when props are up to date.\n\tconst openModalRef = useRef< () => void >( undefined );\n\tconst [ pendingOpen, setPendingOpen ] = useState( false );\n\tconst [ blobs, setBlobs ] = useState< string[] >( [] );\n\tuseEffect( () => {\n\t\tif ( pendingOpen ) {\n\t\t\tsetPendingOpen( false );\n\t\t\topenModalRef.current?.();\n\t\t}\n\t}, [ pendingOpen ] );\n\tconst onChangeControl = useCallback(\n\t\t( newValue: number | number[] | undefined ) =>\n\t\t\tonChange( field.setValue( { item: data, value: newValue } ) ),\n\t\t[ data, field, onChange ]\n\t);\n\tconst removeItem = useCallback(\n\t\t( itemId: number ) => {\n\t\t\tconst currentIds = normalizeValue( value );\n\t\t\tconst newIds = currentIds.filter( ( id ) => id !== itemId );\n\t\t\t// Mark as touched to immediately show any validation error.\n\t\t\tsetIsTouched( true );\n\t\t\tonChangeControl( newIds.length ? newIds : undefined );\n\t\t},\n\t\t[ value, onChangeControl ]\n\t);\n\tconst moveItem = useCallback(\n\t\t( itemId: number, direction: 'up' | 'down' ) => {\n\t\t\tif ( ! orderedAttachments ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst currentIds = orderedAttachments.map( ( a ) => a.id );\n\t\t\tconst index = currentIds.indexOf( itemId );\n\t\t\tconst newIndex = direction === 'up' ? index - 1 : index + 1;\n\t\t\t[ currentIds[ index ], currentIds[ newIndex ] ] = [\n\t\t\t\tcurrentIds[ newIndex ],\n\t\t\t\tcurrentIds[ index ],\n\t\t\t];\n\t\t\tonChangeControl( currentIds );\n\t\t},\n\t\t[ orderedAttachments, onChangeControl ]\n\t);\n\tconst onFilesDrop = useCallback(\n\t\t( files: File[], _targetItemId?: number ) => {\n\t\t\tsetTargetItemId( _targetItemId );\n\t\t\tuploadMedia( {\n\t\t\t\tallowedTypes: allowedTypes?.length ? allowedTypes : undefined,\n\t\t\t\tfilesList: files,\n\t\t\t\tonFileChange( uploadedMedia: any[] ) {\n\t\t\t\t\tconst blobUrls = uploadedMedia\n\t\t\t\t\t\t.filter( ( item ) => isBlobURL( item.url ) )\n\t\t\t\t\t\t.map( ( item ) => item.url );\n\t\t\t\t\tsetBlobs( blobUrls );\n\t\t\t\t\t// Wait for all uploads to complete before updating value.\n\t\t\t\t\tif ( !! blobUrls.length ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\t// `uploadMedia` creates attachments via `apiFetch`\n\t\t\t\t\t// outside the core-data store, so invalidate\n\t\t\t\t\t// all attachment queries to keep them fresh for\n\t\t\t\t\t// other components that rely on core-data.\n\t\t\t\t\treceiveEntityRecords(\n\t\t\t\t\t\t'postType',\n\t\t\t\t\t\t'attachment',\n\t\t\t\t\t\t[],\n\t\t\t\t\t\tundefined,\n\t\t\t\t\t\ttrue\n\t\t\t\t\t);\n\t\t\t\t\tconst uploadedIds = uploadedMedia.map(\n\t\t\t\t\t\t( item ) => item.id\n\t\t\t\t\t);\n\t\t\t\t\tif ( ! multiple ) {\n\t\t\t\t\t\tonChangeControl( uploadedIds[ 0 ] );\n\t\t\t\t\t\tsetTargetItemId( undefined );\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tconst currentValue = normalizeValue( value );\n\t\t\t\t\t// Dropped on placeholder: append new items.\n\t\t\t\t\tif ( _targetItemId === undefined ) {\n\t\t\t\t\t\tonChangeControl( [ ...currentValue, ...uploadedIds ] );\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// Dropped on existing item: insert at that position.\n\t\t\t\t\t\tconst newValue = [ ...currentValue ];\n\t\t\t\t\t\tnewValue.splice(\n\t\t\t\t\t\t\tcurrentValue.indexOf( _targetItemId ),\n\t\t\t\t\t\t\t1,\n\t\t\t\t\t\t\t...uploadedIds\n\t\t\t\t\t\t);\n\t\t\t\t\t\tonChangeControl( newValue );\n\t\t\t\t\t}\n\t\t\t\t\tsetTargetItemId( undefined );\n\t\t\t\t},\n\t\t\t\tonError( error: Error ) {\n\t\t\t\t\tsetTargetItemId( undefined );\n\t\t\t\t\tsetBlobs( [] );\n\t\t\t\t\tcreateErrorNotice( error.message, { type: 'snackbar' } );\n\t\t\t\t},\n\t\t\t\tmultiple: !! multiple,\n\t\t\t} );\n\t\t},\n\t\t[\n\t\t\tallowedTypes,\n\t\t\tvalue,\n\t\t\tmultiple,\n\t\t\tcreateErrorNotice,\n\t\t\tonChangeControl,\n\t\t\treceiveEntityRecords,\n\t\t]\n\t);\n\tconst addButtonLabel =\n\t\tfield.placeholder ||\n\t\t( multiple ? __( 'Choose files' ) : __( 'Choose file' ) );\n\t// Merge real attachments with any existing blob items that are being uploaded.\n\tconst allItems: Array< MediaEditAttachment > | null = useMemo( () => {\n\t\tif ( ! blobs.length ) {\n\t\t\treturn orderedAttachments;\n\t\t}\n\t\tconst items: Array< MediaEditAttachment > = [\n\t\t\t...( orderedAttachments || [] ),\n\t\t];\n\t\tconst blobItems = blobs.map( ( url ) => ( {\n\t\t\tid: url,\n\t\t\tsource_url: url,\n\t\t\tmime_type: getBlobTypeByURL( url ),\n\t\t} ) );\n\t\tif ( targetItemId !== undefined ) {\n\t\t\t// When files are dropped in existing media item, place the blobs at that item.\n\t\t\tconst targetIndex = items.findIndex(\n\t\t\t\t( a ) => a.id === targetItemId\n\t\t\t);\n\t\t\titems.splice( targetIndex, 1, ...blobItems );\n\t\t} else {\n\t\t\titems.push( ...blobItems );\n\t\t}\n\t\treturn items;\n\t}, [ orderedAttachments, targetItemId, blobs ] );\n\tuseEffect( () => {\n\t\tif ( ! isTouched ) {\n\t\t\treturn;\n\t\t}\n\t\tconst input = validityTargetRef.current;\n\t\tif ( ! input ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( validity ) {\n\t\t\tconst customValidityResult = validity?.custom;\n\t\t\tsetCustomValidity( customValidityResult );\n\n\t\t\t// Set custom validity on hidden input for HTML5 form validation.\n\t\t\tif ( customValidityResult?.type === 'invalid' ) {\n\t\t\t\tinput.setCustomValidity(\n\t\t\t\t\tcustomValidityResult.message || __( 'Invalid' )\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tinput.setCustomValidity( '' ); // Clear validity.\n\t\t\t}\n\t\t} else {\n\t\t\t// Clear any previous validation.\n\t\t\tinput.setCustomValidity( '' );\n\t\t\tsetCustomValidity( undefined );\n\t\t}\n\t}, [ isTouched, field.isValid, validity ] );\n\tconst onBlur = useCallback(\n\t\t( event: React.FocusEvent< HTMLElement > ) => {\n\t\t\tif ( isTouched ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif (\n\t\t\t\t! event.relatedTarget ||\n\t\t\t\t! event.currentTarget.contains( event.relatedTarget )\n\t\t\t) {\n\t\t\t\tsetIsTouched( true );\n\t\t\t}\n\t\t},\n\t\t[ isTouched ]\n\t);\n\treturn (\n\t\t<div onBlur={ onBlur }>\n\t\t\t<fieldset className=\"fields__media-edit\" data-field-id={ field.id }>\n\t\t\t\t<ConditionalMediaUpload\n\t\t\t\t\tonSelect={ ( selectedMedia: any ) => {\n\t\t\t\t\t\tif ( ! multiple ) {\n\t\t\t\t\t\t\tonChangeControl( selectedMedia.id );\n\t\t\t\t\t\t\tsetTargetItemId( undefined );\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tconst newIds = Array.isArray( selectedMedia )\n\t\t\t\t\t\t\t? selectedMedia.map( ( m: any ) => m.id )\n\t\t\t\t\t\t\t: [ selectedMedia.id ];\n\t\t\t\t\t\tconst currentValue = normalizeValue( value );\n\t\t\t\t\t\tif ( ! currentValue.length ) {\n\t\t\t\t\t\t\tonChangeControl( newIds );\n\t\t\t\t\t\t} else if ( targetItemId === undefined ) {\n\t\t\t\t\t\t\t// Placeholder clicked: keep existing items that are\n\t\t\t\t\t\t\t// still selected, then append newly selected items.\n\t\t\t\t\t\t\tconst existingItems = currentValue.filter( ( id ) =>\n\t\t\t\t\t\t\t\tnewIds.includes( id )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tconst newItems = newIds.filter(\n\t\t\t\t\t\t\t\t( id ) => ! currentValue.includes( id )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tonChangeControl( [\n\t\t\t\t\t\t\t\t...existingItems,\n\t\t\t\t\t\t\t\t...newItems,\n\t\t\t\t\t\t\t] );\n\t\t\t\t\t\t} else if ( selectedMedia.id !== targetItemId ) {\n\t\t\t\t\t\t\t// Remove selected item from its old position, if it\n\t\t\t\t\t\t\t// already exists in the value.\n\t\t\t\t\t\t\tconst filtered = currentValue.filter(\n\t\t\t\t\t\t\t\t( id ) => id !== selectedMedia.id\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t// Replace the clicked item with the selected one.\n\t\t\t\t\t\t\tonChangeControl(\n\t\t\t\t\t\t\t\tfiltered.map( ( id ) =>\n\t\t\t\t\t\t\t\t\tid === targetItemId ? selectedMedia.id : id\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t\tsetTargetItemId( undefined );\n\t\t\t\t\t} }\n\t\t\t\t\tonClose={ () => setTargetItemId( undefined ) }\n\t\t\t\t\tallowedTypes={ allowedTypes }\n\t\t\t\t\t// When replacing an existing item, pass only that item's ID\n\t\t\t\t\t// and open in single-select mode so the user picks exactly\n\t\t\t\t\t// one replacement, even if `multiple` is true.\n\t\t\t\t\tvalue={ targetItemId !== undefined ? targetItemId : value }\n\t\t\t\t\tmultiple={ multiple && targetItemId === undefined }\n\t\t\t\t\ttitle={ field.label }\n\t\t\t\t\trender={ ( { open }: any ) => {\n\t\t\t\t\t\t// Keep a ref to the latest `open` so the deferred effect can call it.\n\t\t\t\t\t\topenModalRef.current = open;\n\t\t\t\t\t\tconst AttachmentsComponent = isExpanded\n\t\t\t\t\t\t\t? ExpandedMediaEditAttachments\n\t\t\t\t\t\t\t: CompactMediaEditAttachments;\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<VStack spacing={ 2 }>\n\t\t\t\t\t\t\t\t{ field.label &&\n\t\t\t\t\t\t\t\t\t( hideLabelFromVision ? (\n\t\t\t\t\t\t\t\t\t\t<VisuallyHidden render={ <legend /> }>\n\t\t\t\t\t\t\t\t\t\t\t{ field.label }\n\t\t\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<BaseControl.VisualLabel\n\t\t\t\t\t\t\t\t\t\t\tas=\"legend\"\n\t\t\t\t\t\t\t\t\t\t\tstyle={ { marginBottom: 0 } }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ field.label }\n\t\t\t\t\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t\t<AttachmentsComponent\n\t\t\t\t\t\t\t\t\tallItems={ allItems }\n\t\t\t\t\t\t\t\t\taddButtonLabel={ addButtonLabel }\n\t\t\t\t\t\t\t\t\tmultiple={ multiple }\n\t\t\t\t\t\t\t\t\tremoveItem={ removeItem }\n\t\t\t\t\t\t\t\t\tmoveItem={ moveItem }\n\t\t\t\t\t\t\t\t\topen={ () => setPendingOpen( true ) }\n\t\t\t\t\t\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\t\t\t\t\t\tisUploading={ !! blobs.length }\n\t\t\t\t\t\t\t\t\tsetTargetItemId={ setTargetItemId }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{ field.description && (\n\t\t\t\t\t\t\t\t\t<WCText\n\t\t\t\t\t\t\t\t\t\tvariant=\"muted\"\n\t\t\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-description\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ field.description }\n\t\t\t\t\t\t\t\t\t</WCText>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t);\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</fieldset>\n\t\t\t{ /* Visually hidden text input for validation. */ }\n\t\t\t<VisuallyHidden>\n\t\t\t\t<input\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tref={ validityTargetRef }\n\t\t\t\t\tvalue={ value ?? '' }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tonChange={ () => {} }\n\t\t\t\t/>\n\t\t\t</VisuallyHidden>\n\t\t\t{ customValidity && (\n\t\t\t\t<div aria-live=\"polite\">\n\t\t\t\t\t<p\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t'components-validated-control__indicator',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-invalid': customValidity.type === 'invalid',\n\t\t\t\t\t\t\t\t'is-valid': customValidity.type === 'valid',\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<WCIcon\n\t\t\t\t\t\t\tclassName=\"components-validated-control__indicator-icon\"\n\t\t\t\t\t\t\ticon={ errorIcon }\n\t\t\t\t\t\t\tsize={ 16 }\n\t\t\t\t\t\t\tfill=\"currentColor\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ customValidity.message }\n\t\t\t\t\t</p>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -3,7 +3,10 @@ import clsx from "clsx";
3
3
  import { __ } from "@wordpress/i18n";
4
4
  import { useState } from "@wordpress/element";
5
5
  import { commentAuthorAvatar as authorIcon } from "@wordpress/icons";
6
- import { __experimentalHStack as HStack, Icon } from "@wordpress/components";
6
+ import {
7
+ __experimentalHStack as HStack,
8
+ Icon as WCIcon
9
+ } from "@wordpress/components";
7
10
  import { useSelect } from "@wordpress/data";
8
11
  import { store as coreStore } from "@wordpress/core-data";
9
12
  import { jsx, jsxs } from "react/jsx-runtime";
@@ -43,7 +46,7 @@ function AuthorView({ item }) {
43
46
  )
44
47
  }
45
48
  ),
46
- !imageUrl && /* @__PURE__ */ jsx("div", { className: "fields-controls__author-icon", children: /* @__PURE__ */ jsx(Icon, { icon: authorIcon }) }),
49
+ !imageUrl && /* @__PURE__ */ jsx("div", { className: "fields-controls__author-icon", children: /* @__PURE__ */ jsx(WCIcon, { icon: authorIcon }) }),
47
50
  /* @__PURE__ */ jsx("span", { className: "fields-controls__author-name", children: text })
48
51
  ] });
49
52
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/fields/author/author-view.tsx"],
4
- "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { commentAuthorAvatar as authorIcon } from '@wordpress/icons';\nimport { __experimentalHStack as HStack, Icon } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport type { BasePostWithEmbeddedAuthor } from '../../types';\n\nfunction AuthorView( { item }: { item: BasePostWithEmbeddedAuthor } ) {\n\t// Fetch the author record from the store when _embedded data is unavailable\n\t// (e.g. in the post editor inspector) or when the author has been changed\n\t// during editing (item.author differs from _embedded.author).\n\tconst authorId = item?.author;\n\tconst embeddedAuthorId = item?._embedded?.author?.[ 0 ]?.id;\n\tconst shouldFetch = Boolean(\n\t\tauthorId && ( ! embeddedAuthorId || authorId !== embeddedAuthorId )\n\t);\n\tconst author = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! shouldFetch ) {\n\t\t\t\treturn null;\n\t\t\t}\n\t\t\tconst { getEntityRecord } = select( coreStore );\n\t\t\t// This doesn't make extra REST requests because the records are\n\t\t\t// already in the store from the field's getElements function.\n\t\t\treturn authorId\n\t\t\t\t? getEntityRecord( 'root', 'user', authorId )\n\t\t\t\t: null;\n\t\t},\n\t\t[ authorId, shouldFetch ]\n\t);\n\t// Use fetched author if available, otherwise use _embedded.\n\tconst text = author?.name || item?._embedded?.author?.[ 0 ]?.name;\n\tconst imageUrl =\n\t\tauthor?.avatar_urls?.[ 48 ] ||\n\t\titem?._embedded?.author?.[ 0 ]?.avatar_urls?.[ 48 ];\n\tconst [ isImageLoaded, setIsImageLoaded ] = useState( false );\n\treturn (\n\t\t<HStack alignment=\"left\" spacing={ 0 }>\n\t\t\t{ !! imageUrl && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx( 'fields-controls__author-avatar', {\n\t\t\t\t\t\t'is-loaded': isImageLoaded,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<img\n\t\t\t\t\t\tonLoad={ () => setIsImageLoaded( true ) }\n\t\t\t\t\t\talt={ __( 'Author avatar' ) }\n\t\t\t\t\t\tsrc={ imageUrl }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t{ ! imageUrl && (\n\t\t\t\t<div className=\"fields-controls__author-icon\">\n\t\t\t\t\t<Icon icon={ authorIcon } />\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<span className=\"fields-controls__author-name\">{ text }</span>\n\t\t</HStack>\n\t);\n}\n\nexport default AuthorView;\n"],
5
- "mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,UAAU;AACnB,SAAS,gBAAgB;AACzB,SAAS,uBAAuB,kBAAkB;AAClD,SAAS,wBAAwB,QAAQ,YAAY;AACrD,SAAS,iBAAiB;AAC1B,SAAS,SAAS,iBAAiB;AAqCjC,SAOG,KAPH;AA9BF,SAAS,WAAY,EAAE,KAAK,GAA0C;AAIrE,QAAM,WAAW,MAAM;AACvB,QAAM,mBAAmB,MAAM,WAAW,SAAU,CAAE,GAAG;AACzD,QAAM,cAAc;AAAA,IACnB,aAAc,CAAE,oBAAoB,aAAa;AAAA,EAClD;AACA,QAAM,SAAS;AAAA,IACd,CAAE,WAAY;AACb,UAAK,CAAE,aAAc;AACpB,eAAO;AAAA,MACR;AACA,YAAM,EAAE,gBAAgB,IAAI,OAAQ,SAAU;AAG9C,aAAO,WACJ,gBAAiB,QAAQ,QAAQ,QAAS,IAC1C;AAAA,IACJ;AAAA,IACA,CAAE,UAAU,WAAY;AAAA,EACzB;AAEA,QAAM,OAAO,QAAQ,QAAQ,MAAM,WAAW,SAAU,CAAE,GAAG;AAC7D,QAAM,WACL,QAAQ,cAAe,EAAG,KAC1B,MAAM,WAAW,SAAU,CAAE,GAAG,cAAe,EAAG;AACnD,QAAM,CAAE,eAAe,gBAAiB,IAAI,SAAU,KAAM;AAC5D,SACC,qBAAC,UAAO,WAAU,QAAO,SAAU,GAChC;AAAA,KAAC,CAAE,YACJ;AAAA,MAAC;AAAA;AAAA,QACA,WAAY,KAAM,kCAAkC;AAAA,UACnD,aAAa;AAAA,QACd,CAAE;AAAA,QAEF;AAAA,UAAC;AAAA;AAAA,YACA,QAAS,MAAM,iBAAkB,IAAK;AAAA,YACtC,KAAM,GAAI,eAAgB;AAAA,YAC1B,KAAM;AAAA;AAAA,QACP;AAAA;AAAA,IACD;AAAA,IAEC,CAAE,YACH,oBAAC,SAAI,WAAU,gCACd,8BAAC,QAAK,MAAO,YAAa,GAC3B;AAAA,IAED,oBAAC,UAAK,WAAU,gCAAiC,gBAAM;AAAA,KACxD;AAEF;AAEA,IAAO,sBAAQ;",
4
+ "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { commentAuthorAvatar as authorIcon } from '@wordpress/icons';\nimport {\n\t__experimentalHStack as HStack,\n\tIcon as WCIcon,\n} from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport type { BasePostWithEmbeddedAuthor } from '../../types';\n\nfunction AuthorView( { item }: { item: BasePostWithEmbeddedAuthor } ) {\n\t// Fetch the author record from the store when _embedded data is unavailable\n\t// (e.g. in the post editor inspector) or when the author has been changed\n\t// during editing (item.author differs from _embedded.author).\n\tconst authorId = item?.author;\n\tconst embeddedAuthorId = item?._embedded?.author?.[ 0 ]?.id;\n\tconst shouldFetch = Boolean(\n\t\tauthorId && ( ! embeddedAuthorId || authorId !== embeddedAuthorId )\n\t);\n\tconst author = useSelect(\n\t\t( select ) => {\n\t\t\tif ( ! shouldFetch ) {\n\t\t\t\treturn null;\n\t\t\t}\n\t\t\tconst { getEntityRecord } = select( coreStore );\n\t\t\t// This doesn't make extra REST requests because the records are\n\t\t\t// already in the store from the field's getElements function.\n\t\t\treturn authorId\n\t\t\t\t? getEntityRecord( 'root', 'user', authorId )\n\t\t\t\t: null;\n\t\t},\n\t\t[ authorId, shouldFetch ]\n\t);\n\t// Use fetched author if available, otherwise use _embedded.\n\tconst text = author?.name || item?._embedded?.author?.[ 0 ]?.name;\n\tconst imageUrl =\n\t\tauthor?.avatar_urls?.[ 48 ] ||\n\t\titem?._embedded?.author?.[ 0 ]?.avatar_urls?.[ 48 ];\n\tconst [ isImageLoaded, setIsImageLoaded ] = useState( false );\n\treturn (\n\t\t<HStack alignment=\"left\" spacing={ 0 }>\n\t\t\t{ !! imageUrl && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx( 'fields-controls__author-avatar', {\n\t\t\t\t\t\t'is-loaded': isImageLoaded,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<img\n\t\t\t\t\t\tonLoad={ () => setIsImageLoaded( true ) }\n\t\t\t\t\t\talt={ __( 'Author avatar' ) }\n\t\t\t\t\t\tsrc={ imageUrl }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t{ ! imageUrl && (\n\t\t\t\t<div className=\"fields-controls__author-icon\">\n\t\t\t\t\t<WCIcon icon={ authorIcon } />\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<span className=\"fields-controls__author-name\">{ text }</span>\n\t\t</HStack>\n\t);\n}\n\nexport default AuthorView;\n"],
5
+ "mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,UAAU;AACnB,SAAS,gBAAgB;AACzB,SAAS,uBAAuB,kBAAkB;AAClD;AAAA,EACC,wBAAwB;AAAA,EACxB,QAAQ;AAAA,OACF;AACP,SAAS,iBAAiB;AAC1B,SAAS,SAAS,iBAAiB;AAqCjC,SAOG,KAPH;AA9BF,SAAS,WAAY,EAAE,KAAK,GAA0C;AAIrE,QAAM,WAAW,MAAM;AACvB,QAAM,mBAAmB,MAAM,WAAW,SAAU,CAAE,GAAG;AACzD,QAAM,cAAc;AAAA,IACnB,aAAc,CAAE,oBAAoB,aAAa;AAAA,EAClD;AACA,QAAM,SAAS;AAAA,IACd,CAAE,WAAY;AACb,UAAK,CAAE,aAAc;AACpB,eAAO;AAAA,MACR;AACA,YAAM,EAAE,gBAAgB,IAAI,OAAQ,SAAU;AAG9C,aAAO,WACJ,gBAAiB,QAAQ,QAAQ,QAAS,IAC1C;AAAA,IACJ;AAAA,IACA,CAAE,UAAU,WAAY;AAAA,EACzB;AAEA,QAAM,OAAO,QAAQ,QAAQ,MAAM,WAAW,SAAU,CAAE,GAAG;AAC7D,QAAM,WACL,QAAQ,cAAe,EAAG,KAC1B,MAAM,WAAW,SAAU,CAAE,GAAG,cAAe,EAAG;AACnD,QAAM,CAAE,eAAe,gBAAiB,IAAI,SAAU,KAAM;AAC5D,SACC,qBAAC,UAAO,WAAU,QAAO,SAAU,GAChC;AAAA,KAAC,CAAE,YACJ;AAAA,MAAC;AAAA;AAAA,QACA,WAAY,KAAM,kCAAkC;AAAA,UACnD,aAAa;AAAA,QACd,CAAE;AAAA,QAEF;AAAA,UAAC;AAAA;AAAA,YACA,QAAS,MAAM,iBAAkB,IAAK;AAAA,YACtC,KAAM,GAAI,eAAgB;AAAA,YAC1B,KAAM;AAAA;AAAA,QACP;AAAA;AAAA,IACD;AAAA,IAEC,CAAE,YACH,oBAAC,SAAI,WAAU,gCACd,8BAAC,UAAO,MAAO,YAAa,GAC7B;AAAA,IAED,oBAAC,UAAK,WAAU,gCAAiC,gBAAM;AAAA,KACxD;AAEF;AAEA,IAAO,sBAAQ;",
6
6
  "names": []
7
7
  }
@@ -1,7 +1,7 @@
1
1
  // packages/fields/src/fields/pattern-title/view.tsx
2
2
  import { __ } from "@wordpress/i18n";
3
3
  import { Icon, lockSmall } from "@wordpress/icons";
4
- import { Tooltip } from "@wordpress/components";
4
+ import { Tooltip as WCTooltip } from "@wordpress/components";
5
5
  import { privateApis as patternPrivateApis } from "@wordpress/patterns";
6
6
  import { BaseTitleView } from "../title/view.mjs";
7
7
  import { unlock } from "../../lock-unlock.mjs";
@@ -9,7 +9,7 @@ import { jsx } from "react/jsx-runtime";
9
9
  var { PATTERN_TYPES } = unlock(patternPrivateApis);
10
10
  function PatternTitleView({ item }) {
11
11
  return /* @__PURE__ */ jsx(BaseTitleView, { item, className: "fields-field__pattern-title", children: item.type === PATTERN_TYPES.theme && /* @__PURE__ */ jsx(
12
- Tooltip,
12
+ WCTooltip,
13
13
  {
14
14
  placement: "top",
15
15
  text: __("This pattern cannot be edited."),
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/fields/pattern-title/view.tsx"],
4
- "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { Icon, lockSmall } from '@wordpress/icons';\nimport { Tooltip } from '@wordpress/components';\n// @ts-ignore\nimport { privateApis as patternPrivateApis } from '@wordpress/patterns';\n\n/**\n * Internal dependencies\n */\nimport type { CommonPost } from '../../types';\nimport { BaseTitleView } from '../title/view';\nimport { unlock } from '../../lock-unlock';\n\nexport const { PATTERN_TYPES } = unlock( patternPrivateApis );\n\nexport default function PatternTitleView( { item }: { item: CommonPost } ) {\n\treturn (\n\t\t<BaseTitleView item={ item } className=\"fields-field__pattern-title\">\n\t\t\t{ item.type === PATTERN_TYPES.theme && (\n\t\t\t\t<Tooltip\n\t\t\t\t\tplacement=\"top\"\n\t\t\t\t\ttext={ __( 'This pattern cannot be edited.' ) }\n\t\t\t\t>\n\t\t\t\t\t<Icon icon={ lockSmall } size={ 24 } />\n\t\t\t\t</Tooltip>\n\t\t\t) }\n\t\t</BaseTitleView>\n\t);\n}\n"],
5
- "mappings": ";AAGA,SAAS,UAAU;AACnB,SAAS,MAAM,iBAAiB;AAChC,SAAS,eAAe;AAExB,SAAS,eAAe,0BAA0B;AAMlD,SAAS,qBAAqB;AAC9B,SAAS,cAAc;AAYlB;AAVE,IAAM,EAAE,cAAc,IAAI,OAAQ,kBAAmB;AAE7C,SAAR,iBAAmC,EAAE,KAAK,GAA0B;AAC1E,SACC,oBAAC,iBAAc,MAAc,WAAU,+BACpC,eAAK,SAAS,cAAc,SAC7B;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,MAAO,GAAI,gCAAiC;AAAA,MAE5C,8BAAC,QAAK,MAAO,WAAY,MAAO,IAAK;AAAA;AAAA,EACtC,GAEF;AAEF;",
4
+ "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { Icon, lockSmall } from '@wordpress/icons';\nimport { Tooltip as WCTooltip } from '@wordpress/components';\n// @ts-ignore\nimport { privateApis as patternPrivateApis } from '@wordpress/patterns';\n\n/**\n * Internal dependencies\n */\nimport type { CommonPost } from '../../types';\nimport { BaseTitleView } from '../title/view';\nimport { unlock } from '../../lock-unlock';\n\nexport const { PATTERN_TYPES } = unlock( patternPrivateApis );\n\nexport default function PatternTitleView( { item }: { item: CommonPost } ) {\n\treturn (\n\t\t<BaseTitleView item={ item } className=\"fields-field__pattern-title\">\n\t\t\t{ item.type === PATTERN_TYPES.theme && (\n\t\t\t\t<WCTooltip\n\t\t\t\t\tplacement=\"top\"\n\t\t\t\t\ttext={ __( 'This pattern cannot be edited.' ) }\n\t\t\t\t>\n\t\t\t\t\t<Icon icon={ lockSmall } size={ 24 } />\n\t\t\t\t</WCTooltip>\n\t\t\t) }\n\t\t</BaseTitleView>\n\t);\n}\n"],
5
+ "mappings": ";AAGA,SAAS,UAAU;AACnB,SAAS,MAAM,iBAAiB;AAChC,SAAS,WAAW,iBAAiB;AAErC,SAAS,eAAe,0BAA0B;AAMlD,SAAS,qBAAqB;AAC9B,SAAS,cAAc;AAYlB;AAVE,IAAM,EAAE,cAAc,IAAI,OAAQ,kBAAmB;AAE7C,SAAR,iBAAmC,EAAE,KAAK,GAA0B;AAC1E,SACC,oBAAC,iBAAc,MAAc,WAAU,+BACpC,eAAK,SAAS,cAAc,SAC7B;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,MAAO,GAAI,gCAAiC;AAAA,MAE5C,8BAAC,QAAK,MAAO,WAAY,MAAO,IAAK;AAAA;AAAA,EACtC,GAEF;AAEF;",
6
6
  "names": []
7
7
  }
@@ -1,5 +1,8 @@
1
1
  // packages/fields/src/fields/status/status-view.tsx
2
- import { __experimentalHStack as HStack, Icon } from "@wordpress/components";
2
+ import {
3
+ __experimentalHStack as HStack,
4
+ Icon as WCIcon
5
+ } from "@wordpress/components";
3
6
  import STATUSES from "./status-elements.mjs";
4
7
  import { jsx, jsxs } from "react/jsx-runtime";
5
8
  function StatusView({ item }) {
@@ -7,7 +10,7 @@ function StatusView({ item }) {
7
10
  const label = status?.label || item.status;
8
11
  const icon = status?.icon;
9
12
  return /* @__PURE__ */ jsxs(HStack, { alignment: "left", spacing: 0, children: [
10
- icon && /* @__PURE__ */ jsx("div", { className: "fields-controls__status-icon", children: /* @__PURE__ */ jsx(Icon, { icon }) }),
13
+ icon && /* @__PURE__ */ jsx("div", { className: "fields-controls__status-icon", children: /* @__PURE__ */ jsx(WCIcon, { icon }) }),
11
14
  /* @__PURE__ */ jsx("span", { children: label })
12
15
  ] });
13
16
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/fields/status/status-view.tsx"],
4
- "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __experimentalHStack as HStack, Icon } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport type { BasePost } from '../../types';\nimport STATUSES from './status-elements';\n\nfunction StatusView( { item }: { item: BasePost } ) {\n\tconst status = STATUSES.find( ( { value } ) => value === item.status );\n\tconst label = status?.label || item.status;\n\tconst icon = status?.icon;\n\treturn (\n\t\t<HStack alignment=\"left\" spacing={ 0 }>\n\t\t\t{ icon && (\n\t\t\t\t<div className=\"fields-controls__status-icon\">\n\t\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<span>{ label }</span>\n\t\t</HStack>\n\t);\n}\n\nexport default StatusView;\n"],
5
- "mappings": ";AAGA,SAAS,wBAAwB,QAAQ,YAAY;AAMrD,OAAO,cAAc;AAOnB,SAGG,KAHH;AALF,SAAS,WAAY,EAAE,KAAK,GAAwB;AACnD,QAAM,SAAS,SAAS,KAAM,CAAE,EAAE,MAAM,MAAO,UAAU,KAAK,MAAO;AACrE,QAAM,QAAQ,QAAQ,SAAS,KAAK;AACpC,QAAM,OAAO,QAAQ;AACrB,SACC,qBAAC,UAAO,WAAU,QAAO,SAAU,GAChC;AAAA,YACD,oBAAC,SAAI,WAAU,gCACd,8BAAC,QAAK,MAAc,GACrB;AAAA,IAED,oBAAC,UAAO,iBAAO;AAAA,KAChB;AAEF;AAEA,IAAO,sBAAQ;",
4
+ "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalHStack as HStack,\n\tIcon as WCIcon,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport type { BasePost } from '../../types';\nimport STATUSES from './status-elements';\n\nfunction StatusView( { item }: { item: BasePost } ) {\n\tconst status = STATUSES.find( ( { value } ) => value === item.status );\n\tconst label = status?.label || item.status;\n\tconst icon = status?.icon;\n\treturn (\n\t\t<HStack alignment=\"left\" spacing={ 0 }>\n\t\t\t{ icon && (\n\t\t\t\t<div className=\"fields-controls__status-icon\">\n\t\t\t\t\t<WCIcon icon={ icon } />\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<span>{ label }</span>\n\t\t</HStack>\n\t);\n}\n\nexport default StatusView;\n"],
5
+ "mappings": ";AAGA;AAAA,EACC,wBAAwB;AAAA,EACxB,QAAQ;AAAA,OACF;AAMP,OAAO,cAAc;AAOnB,SAGG,KAHH;AALF,SAAS,WAAY,EAAE,KAAK,GAAwB;AACnD,QAAM,SAAS,SAAS,KAAM,CAAE,EAAE,MAAM,MAAO,UAAU,KAAK,MAAO;AACrE,QAAM,QAAQ,QAAQ,SAAS,KAAK;AACpC,QAAM,OAAO,QAAQ;AACrB,SACC,qBAAC,UAAO,WAAU,QAAO,SAAU,GAChC;AAAA,YACD,oBAAC,SAAI,WAAU,gCACd,8BAAC,UAAO,MAAc,GACvB;AAAA,IAED,oBAAC,UAAO,iBAAO;AAAA,KAChB;AAEF;AAEA,IAAO,sBAAQ;",
6
6
  "names": []
7
7
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/media-edit/index.tsx"],"names":[],"mappings":"AAuDA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAoflD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,MAAM,CAAC,OAAO,UAAU,SAAS,CAAE,IAAI,EAAI,EAC1C,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,mBAAmB,EACnB,YAA0B,EAC1B,QAAQ,EACR,UAAU,EACV,QAAQ,EACR,EAAE,cAAc,CAAE,IAAI,CAAE,+BA8XxB"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/media-edit/index.tsx"],"names":[],"mappings":"AAuDA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAoflD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,MAAM,CAAC,OAAO,UAAU,SAAS,CAAE,IAAI,EAAI,EAC1C,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,mBAAmB,EACnB,YAA0B,EAC1B,QAAQ,EACR,UAAU,EACV,QAAQ,EACR,EAAE,cAAc,CAAE,IAAI,CAAE,+BA4XxB"}
@@ -9,5 +9,5 @@
9
9
  *
10
10
  * @param triggerAnimationOnChange Variable used to trigger the animation if it changes.
11
11
  */
12
- export default function useMovingAnimation(triggerAnimationOnChange: unknown): import("react").RefObject<HTMLDivElement>;
12
+ export default function useMovingAnimation(triggerAnimationOnChange: unknown): import("react").RefObject<HTMLDivElement | null>;
13
13
  //# sourceMappingURL=use-moving-animation.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"use-moving-animation.d.ts","sourceRoot":"","sources":["../../../src/components/media-edit/use-moving-animation.ts"],"names":[],"mappings":"AAiBA;;;;;;;;;;GAUG;AACH,MAAM,CAAC,OAAO,UAAU,kBAAkB,CACzC,wBAAwB,EAAE,OAAO,6CA+CjC"}
1
+ {"version":3,"file":"use-moving-animation.d.ts","sourceRoot":"","sources":["../../../src/components/media-edit/use-moving-animation.ts"],"names":[],"mappings":"AAiBA;;;;;;;;;;GAUG;AACH,MAAM,CAAC,OAAO,UAAU,kBAAkB,CACzC,wBAAwB,EAAE,OAAO,oDA+CjC"}
@@ -1 +1 @@
1
- {"version":3,"file":"author-view.d.ts","sourceRoot":"","sources":["../../../src/fields/author/author-view.tsx"],"names":[],"mappings":"AAeA;;GAEG;AACH,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,aAAa,CAAC;AAE9D,iBAAS,UAAU,CAAE,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,0BAA0B,CAAA;CAAE,+BAoDlE;eAEc,UAAU"}
1
+ {"version":3,"file":"author-view.d.ts","sourceRoot":"","sources":["../../../src/fields/author/author-view.tsx"],"names":[],"mappings":"AAkBA;;GAEG;AACH,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,aAAa,CAAC;AAE9D,iBAAS,UAAU,CAAE,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,0BAA0B,CAAA;CAAE,+BAoDlE;eAEc,UAAU"}
@@ -1 +1 @@
1
- {"version":3,"file":"status-view.d.ts","sourceRoot":"","sources":["../../../src/fields/status/status-view.tsx"],"names":[],"mappings":"AAKA;;GAEG;AACH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAG5C,iBAAS,UAAU,CAAE,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,+BAchD;eAEc,UAAU"}
1
+ {"version":3,"file":"status-view.d.ts","sourceRoot":"","sources":["../../../src/fields/status/status-view.tsx"],"names":[],"mappings":"AAQA;;GAEG;AACH,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAG5C,iBAAS,UAAU,CAAE,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,+BAchD;eAEc,UAAU"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/fields",
3
- "version": "0.37.1-next.v.202605131032.0+f6d6e7149",
3
+ "version": "0.39.0",
4
4
  "description": "DataViews is a component that provides an API to render datasets using different types of layouts (table, grid, list, etc.).",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -48,41 +48,41 @@
48
48
  ],
49
49
  "dependencies": {
50
50
  "@react-spring/web": "^9.4.5",
51
- "@wordpress/api-fetch": "^7.45.1-next.v.202605131032.0+f6d6e7149",
52
- "@wordpress/base-styles": "^8.0.1-next.v.202605131032.0+f6d6e7149",
53
- "@wordpress/blob": "^4.45.1-next.v.202605131032.0+f6d6e7149",
54
- "@wordpress/blocks": "^15.18.1-next.v.202605131032.0+f6d6e7149",
55
- "@wordpress/components": "^33.1.1-next.v.202605131032.0+f6d6e7149",
56
- "@wordpress/compose": "^7.45.1-next.v.202605131032.0+f6d6e7149",
57
- "@wordpress/core-data": "^7.45.1-next.v.202605131032.0+f6d6e7149",
58
- "@wordpress/data": "^10.45.1-next.v.202605131032.0+f6d6e7149",
59
- "@wordpress/dataviews": "^14.2.1-next.v.202605131032.0+f6d6e7149",
60
- "@wordpress/date": "^5.45.1-next.v.202605131032.0+f6d6e7149",
61
- "@wordpress/element": "^6.45.1-next.v.202605131032.0+f6d6e7149",
62
- "@wordpress/hooks": "^4.45.1-next.v.202605131032.0+f6d6e7149",
63
- "@wordpress/html-entities": "^4.45.1-next.v.202605131032.0+f6d6e7149",
64
- "@wordpress/i18n": "^6.18.1-next.v.202605131032.0+f6d6e7149",
65
- "@wordpress/icons": "^13.0.1-next.v.202605131032.0+f6d6e7149",
66
- "@wordpress/media-utils": "^5.45.1-next.v.202605131032.0+f6d6e7149",
67
- "@wordpress/notices": "^5.45.1-next.v.202605131032.0+f6d6e7149",
68
- "@wordpress/patterns": "^2.45.1-next.v.202605131032.0+f6d6e7149",
69
- "@wordpress/primitives": "^4.45.1-next.v.202605131032.0+f6d6e7149",
70
- "@wordpress/private-apis": "^1.45.1-next.v.202605131032.0+f6d6e7149",
71
- "@wordpress/router": "^1.45.1-next.v.202605131032.0+f6d6e7149",
72
- "@wordpress/ui": "^0.13.1-next.v.202605131032.0+f6d6e7149",
73
- "@wordpress/url": "^4.45.1-next.v.202605131032.0+f6d6e7149",
74
- "@wordpress/warning": "^3.45.1-next.v.202605131032.0+f6d6e7149",
75
- "@wordpress/wordcount": "^4.45.1-next.v.202605131032.0+f6d6e7149",
51
+ "@wordpress/api-fetch": "^7.47.0",
52
+ "@wordpress/base-styles": "^9.0.0",
53
+ "@wordpress/blob": "^4.47.0",
54
+ "@wordpress/blocks": "^15.20.0",
55
+ "@wordpress/components": "^34.0.0",
56
+ "@wordpress/compose": "^8.0.0",
57
+ "@wordpress/core-data": "^7.47.0",
58
+ "@wordpress/data": "^10.47.0",
59
+ "@wordpress/dataviews": "^15.0.0",
60
+ "@wordpress/date": "^5.47.0",
61
+ "@wordpress/element": "^7.0.0",
62
+ "@wordpress/hooks": "^4.47.0",
63
+ "@wordpress/html-entities": "^4.47.0",
64
+ "@wordpress/i18n": "^6.20.0",
65
+ "@wordpress/icons": "^13.2.0",
66
+ "@wordpress/media-utils": "^5.47.0",
67
+ "@wordpress/notices": "^5.47.0",
68
+ "@wordpress/patterns": "^2.47.0",
69
+ "@wordpress/primitives": "^4.47.0",
70
+ "@wordpress/private-apis": "^1.47.0",
71
+ "@wordpress/router": "^1.47.0",
72
+ "@wordpress/ui": "^0.14.0",
73
+ "@wordpress/url": "^4.47.0",
74
+ "@wordpress/warning": "^3.47.0",
75
+ "@wordpress/wordcount": "^4.47.0",
76
76
  "change-case": "4.1.2",
77
77
  "client-zip": "^2.4.5",
78
78
  "clsx": "2.1.1",
79
79
  "remove-accents": "^0.5.0"
80
80
  },
81
81
  "peerDependencies": {
82
- "react": "^18.0.0"
82
+ "react": "^19.2.4"
83
83
  },
84
84
  "publishConfig": {
85
85
  "access": "public"
86
86
  },
87
- "gitHead": "0e198c7ac7ca634e73ded9220ce048c0302174dd"
87
+ "gitHead": "d653c5fd6161571a0c2ebde28553d6e25624eacc"
88
88
  }
@@ -2,7 +2,7 @@
2
2
  * WordPress dependencies
3
3
  */
4
4
  import {
5
- Icon,
5
+ Icon as WCIcon,
6
6
  BaseControl,
7
7
  TextControl,
8
8
  Button,
@@ -231,7 +231,7 @@ export function CreateTemplatePartModalContents( {
231
231
  instanceId
232
232
  ) }
233
233
  />
234
- <Icon
234
+ <WCIcon
235
235
  icon={ icon }
236
236
  className="fields-create-template-part-modal__area-radio-icon"
237
237
  />
@@ -244,7 +244,7 @@ export function CreateTemplatePartModalContents( {
244
244
  >
245
245
  { item.label }
246
246
  </label>
247
- <Icon
247
+ <WCIcon
248
248
  icon={ check }
249
249
  className="fields-create-template-part-modal__area-radio-checkmark"
250
250
  />
@@ -9,14 +9,14 @@ import clsx from 'clsx';
9
9
  import {
10
10
  Button,
11
11
  DropZone,
12
- Icon,
12
+ Icon as WCIcon,
13
13
  Spinner,
14
14
  __experimentalText as WCText,
15
15
  __experimentalTruncate as Truncate,
16
16
  __experimentalVStack as VStack,
17
17
  __experimentalHStack as HStack,
18
18
  BaseControl,
19
- Tooltip,
19
+ Tooltip as WCTooltip,
20
20
  } from '@wordpress/components';
21
21
  import { isBlobURL, getBlobTypeByURL } from '@wordpress/blob';
22
22
  import { store as coreStore, type Attachment } from '@wordpress/core-data';
@@ -193,9 +193,9 @@ function MediaPickerButton( {
193
193
  return mediaPickerButton;
194
194
  }
195
195
  return (
196
- <Tooltip text={ label } placement="top">
196
+ <WCTooltip text={ label } placement="top">
197
197
  { mediaPickerButton }
198
- </Tooltip>
198
+ </WCTooltip>
199
199
  );
200
200
  }
201
201
 
@@ -291,13 +291,13 @@ function MediaPreview( { attachment }: { attachment: MediaEditAttachment } ) {
291
291
  />
292
292
  );
293
293
  } else if ( mimeType.startsWith( 'audio' ) ) {
294
- return <Icon icon={ audio } />;
294
+ return <WCIcon icon={ audio } />;
295
295
  } else if ( mimeType.startsWith( 'video' ) ) {
296
- return <Icon icon={ video } />;
296
+ return <WCIcon icon={ video } />;
297
297
  } else if ( archiveMimeTypes.includes( mimeType ) ) {
298
- return <Icon icon={ archive } />;
298
+ return <WCIcon icon={ archive } />;
299
299
  }
300
- return <Icon icon={ file } />;
300
+ return <WCIcon icon={ file } />;
301
301
  }
302
302
 
303
303
  type MediaEditAttachment = Attachment< 'view' > | BlobItem;
@@ -640,9 +640,7 @@ export default function MediaEdit< Item >( {
640
640
  // reorders (same IDs), we fall back to the cached list to avoid a visual
641
641
  // flash in compact mode. For replacements/uploads (new IDs not in cache),
642
642
  // we let attachments be null as normal.
643
- const stableAttachmentsRef = useRef< Attachment< 'view' >[] | null >(
644
- null
645
- );
643
+ const stableAttachmentsRef = useRef< Attachment< 'view' >[] >( null );
646
644
  if ( attachments !== null ) {
647
645
  stableAttachmentsRef.current = attachments;
648
646
  }
@@ -971,7 +969,7 @@ export default function MediaEdit< Item >( {
971
969
  }
972
970
  ) }
973
971
  >
974
- <Icon
972
+ <WCIcon
975
973
  className="components-validated-control__indicator-icon"
976
974
  icon={ errorIcon }
977
975
  size={ 16 }
@@ -9,7 +9,10 @@ import clsx from 'clsx';
9
9
  import { __ } from '@wordpress/i18n';
10
10
  import { useState } from '@wordpress/element';
11
11
  import { commentAuthorAvatar as authorIcon } from '@wordpress/icons';
12
- import { __experimentalHStack as HStack, Icon } from '@wordpress/components';
12
+ import {
13
+ __experimentalHStack as HStack,
14
+ Icon as WCIcon,
15
+ } from '@wordpress/components';
13
16
  import { useSelect } from '@wordpress/data';
14
17
  import { store as coreStore } from '@wordpress/core-data';
15
18
 
@@ -64,7 +67,7 @@ function AuthorView( { item }: { item: BasePostWithEmbeddedAuthor } ) {
64
67
  ) }
65
68
  { ! imageUrl && (
66
69
  <div className="fields-controls__author-icon">
67
- <Icon icon={ authorIcon } />
70
+ <WCIcon icon={ authorIcon } />
68
71
  </div>
69
72
  ) }
70
73
  <span className="fields-controls__author-name">{ text }</span>
@@ -3,7 +3,7 @@
3
3
  */
4
4
  import { __ } from '@wordpress/i18n';
5
5
  import { Icon, lockSmall } from '@wordpress/icons';
6
- import { Tooltip } from '@wordpress/components';
6
+ import { Tooltip as WCTooltip } from '@wordpress/components';
7
7
  // @ts-ignore
8
8
  import { privateApis as patternPrivateApis } from '@wordpress/patterns';
9
9
 
@@ -20,12 +20,12 @@ export default function PatternTitleView( { item }: { item: CommonPost } ) {
20
20
  return (
21
21
  <BaseTitleView item={ item } className="fields-field__pattern-title">
22
22
  { item.type === PATTERN_TYPES.theme && (
23
- <Tooltip
23
+ <WCTooltip
24
24
  placement="top"
25
25
  text={ __( 'This pattern cannot be edited.' ) }
26
26
  >
27
27
  <Icon icon={ lockSmall } size={ 24 } />
28
- </Tooltip>
28
+ </WCTooltip>
29
29
  ) }
30
30
  </BaseTitleView>
31
31
  );