@wordpress/fields 0.29.1-next.79a2f3cdd.0 → 0.29.1-next.v.0

package/build/components/create-template-part-modal/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/create-template-part-modal/index.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tIcon,\n\tBaseControl,\n\tTextControl,\n\tButton,\n\tModal,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport type { TemplatePartArea } from '@wordpress/core-data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tcheck,\n\tfooter as footerIcon,\n\theader as headerIcon,\n\tsidebar as sidebarIcon,\n\ttableColumnAfter as overlayIcon,\n\tsymbolFilled as symbolFilledIcon,\n} from '@wordpress/icons';\nimport { store as noticesStore } from '@wordpress/notices';\n// @ts-expect-error serialize is not typed\nimport { serialize } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetCleanTemplatePartSlug,\n\tgetUniqueTemplatePartTitle,\n\tuseExistingTemplateParts,\n} from './utils';\n\nfunction getAreaRadioId( value: string, instanceId: number ) {\n\treturn `fields-create-template-part-modal__area-option-${ value }-${ instanceId }`;\n}\nfunction getAreaRadioDescriptionId( value: string, instanceId: number ) {\n\treturn `fields-create-template-part-modal__area-option-description-${ value }-${ instanceId }`;\n}\n\ntype CreateTemplatePartModalContentsProps = {\n\tdefaultArea?: string;\n\tblocks: any[];\n\tconfirmLabel?: string;\n\tcloseModal: () => void;\n\tonCreate: ( templatePart: any ) => void;\n\tonError?: () => void;\n\tdefaultTitle?: string;\n};\n\n/**\n * A React component that renders a modal for creating a template part. The modal displays a title and the contents for creating the template part.\n * This component should not live in this package, it should be moved to a dedicated package responsible for managing template.\n * @param props            The component props.\n * @param props.modalTitle\n */\nexport default function CreateTemplatePartModal( {\n\tmodalTitle,\n\t...restProps\n}: {\n\tmodalTitle?: string;\n} & CreateTemplatePartModalContentsProps ) {\n\tconst defaultModalTitle = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).getPostType( 'wp_template_part' )?.labels\n\t\t\t\t?.add_new_item,\n\t\t[]\n\t);\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ modalTitle || defaultModalTitle }\n\t\t\tonRequestClose={ restProps.closeModal }\n\t\t\toverlayClassName=\"fields-create-template-part-modal\"\n\t\t\tfocusOnMount=\"firstContentElement\"\n\t\t\tsize=\"medium\"\n\t\t>\n\t\t\t<CreateTemplatePartModalContents { ...restProps } />\n\t\t</Modal>\n\t);\n}\n\n/**\n * Helper function to retrieve the corresponding icon by area name or icon name.\n *\n * @param {string} areaOrIconName The area name (e.g., 'header', 'overlay') or icon name (e.g., 'menu').\n *\n * @return {Object} The corresponding icon.\n */\nconst getTemplatePartIcon = ( areaOrIconName: string ) => {\n\t// Handle area names first\n\tif ( 'header' === areaOrIconName ) {\n\t\treturn headerIcon;\n\t} else if ( 'footer' === areaOrIconName ) {\n\t\treturn footerIcon;\n\t} else if ( 'sidebar' === areaOrIconName ) {\n\t\treturn sidebarIcon;\n\t} else if ( 'overlay' === areaOrIconName ) {\n\t\t// TODO: Replace with a proper overlay icon when available.\n\t\t// Using tableColumnAfter as a placeholder.\n\t\treturn overlayIcon;\n\t}\n\t// Handle icon names for backwards compatibility\n\tif ( 'menu' === areaOrIconName ) {\n\t\t// TODO: Replace with a proper overlay icon when available.\n\t\t// Using tableColumnAfter as a placeholder.\n\t\treturn overlayIcon;\n\t}\n\treturn symbolFilledIcon;\n};\n\n/**\n * A React component that renders the content of a model for creating a template part.\n * This component should not live in this package; it should be moved to a dedicated package responsible for managing template.\n *\n * @param {Object}   props                             - The component props.\n * @param {string}   [props.defaultArea=uncategorized] - The default area for the template part.\n * @param {Array}    [props.blocks=[]]                 - The blocks to be included in the template part.\n * @param {string}   [props.confirmLabel='Add']        - The label for the confirm button.\n * @param {Function} props.closeModal                  - Function to close the modal.\n * @param {Function} props.onCreate                    - Function to call when the template part is successfully created.\n * @param {Function} [props.onError]                   - Function to call when there is an error creating the template part.\n * @param {string}   [props.defaultTitle='']           - The default title for the template part.\n */\nexport function CreateTemplatePartModalContents( {\n\tdefaultArea = 'uncategorized',\n\tblocks = [],\n\tconfirmLabel = __( 'Add' ),\n\tcloseModal,\n\tonCreate,\n\tonError,\n\tdefaultTitle = '',\n}: CreateTemplatePartModalContentsProps ) {\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tconst { saveEntityRecord } = useDispatch( coreStore );\n\tconst existingTemplateParts = useExistingTemplateParts();\n\n\tconst [ title, setTitle ] = useState( defaultTitle );\n\tconst [ area, setArea ] = useState( defaultArea );\n\tconst [ isSubmitting, setIsSubmitting ] = useState( false );\n\tconst instanceId = useInstanceId( CreateTemplatePartModal );\n\n\tconst defaultTemplatePartAreas = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).getCurrentTheme()?.default_template_part_areas,\n\t\t[]\n\t);\n\n\tasync function createTemplatePart() {\n\t\tif ( ! title || isSubmitting ) {\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tsetIsSubmitting( true );\n\t\t\tconst uniqueTitle = getUniqueTemplatePartTitle(\n\t\t\t\ttitle,\n\t\t\t\texistingTemplateParts\n\t\t\t);\n\t\t\tconst cleanSlug = getCleanTemplatePartSlug( uniqueTitle );\n\n\t\t\tconst templatePart = await saveEntityRecord(\n\t\t\t\t'postType',\n\t\t\t\t'wp_template_part',\n\t\t\t\t{\n\t\t\t\t\tslug: cleanSlug,\n\t\t\t\t\ttitle: uniqueTitle,\n\t\t\t\t\tcontent: serialize( blocks ),\n\t\t\t\t\tarea,\n\t\t\t\t},\n\t\t\t\t{ throwOnError: true }\n\t\t\t);\n\t\t\tawait onCreate( templatePart );\n\n\t\t\t// TODO: Add a success notice?\n\t\t} catch ( error ) {\n\t\t\tconst errorMessage =\n\t\t\t\terror instanceof Error &&\n\t\t\t\t'code' in error &&\n\t\t\t\terror.message &&\n\t\t\t\terror.code !== 'unknown_error'\n\t\t\t\t\t? error.message\n\t\t\t\t\t: __(\n\t\t\t\t\t\t\t'An error occurred while creating the template part.'\n\t\t\t\t\t  );\n\n\t\t\tcreateErrorNotice( errorMessage, { type: 'snackbar' } );\n\n\t\t\tonError?.();\n\t\t} finally {\n\t\t\tsetIsSubmitting( false );\n\t\t}\n\t}\n\treturn (\n\t\t<form\n\t\t\tonSubmit={ async ( event ) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tawait createTemplatePart();\n\t\t\t} }\n\t\t>\n\t\t\t<VStack spacing=\"4\">\n\t\t\t\t<TextControl\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tlabel={ __( 'Name' ) }\n\t\t\t\t\tvalue={ title }\n\t\t\t\t\tonChange={ setTitle }\n\t\t\t\t\trequired\n\t\t\t\t/>\n\t\t\t\t<fieldset className=\"fields-create-template-part-modal__area-fieldset\">\n\t\t\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t\t\t{ __( 'Area' ) }\n\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t<div className=\"fields-create-template-part-modal__area-radio-group\">\n\t\t\t\t\t\t{ ( defaultTemplatePartAreas ?? [] ).map(\n\t\t\t\t\t\t\t( item: TemplatePartArea ) => {\n\t\t\t\t\t\t\t\tconst icon = getTemplatePartIcon( item.icon );\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tkey={ item.area }\n\t\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-wrapper\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\t\t\t\tid={ getAreaRadioId(\n\t\t\t\t\t\t\t\t\t\t\t\titem.area,\n\t\t\t\t\t\t\t\t\t\t\t\tinstanceId\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\tname={ `fields-create-template-part-modal__area-${ instanceId }` }\n\t\t\t\t\t\t\t\t\t\t\tvalue={ item.area }\n\t\t\t\t\t\t\t\t\t\t\tchecked={ area === item.area }\n\t\t\t\t\t\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\tsetArea( item.area );\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\taria-describedby={ getAreaRadioDescriptionId(\n\t\t\t\t\t\t\t\t\t\t\t\titem.area,\n\t\t\t\t\t\t\t\t\t\t\t\tinstanceId\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\t<Icon\n\t\t\t\t\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-icon\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<label\n\t\t\t\t\t\t\t\t\t\t\thtmlFor={ getAreaRadioId(\n\t\t\t\t\t\t\t\t\t\t\t\titem.area,\n\t\t\t\t\t\t\t\t\t\t\t\tinstanceId\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-label\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ item.label }\n\t\t\t\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-checkmark\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<p\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-description\"\n\t\t\t\t\t\t\t\t\t\t\tid={ getAreaRadioDescriptionId(\n\t\t\t\t\t\t\t\t\t\t\t\titem.area,\n\t\t\t\t\t\t\t\t\t\t\t\tinstanceId\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\t\t{ item.description }\n\t\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t</div>\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</div>\n\t\t\t\t</fieldset>\n\t\t\t\t<HStack justify=\"right\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\taria-disabled={ ! title || isSubmitting }\n\t\t\t\t\t\tisBusy={ isSubmitting }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ confirmLabel }\n\t\t\t\t\t</Button>\n\t\t\t\t</HStack>\n\t\t\t</VStack>\n\t\t</form>\n\t);\n}\n"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tIcon,\n\tBaseControl,\n\tTextControl,\n\tButton,\n\tModal,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport type { TemplatePartArea } from '@wordpress/core-data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tcheck,\n\tfooter as footerIcon,\n\theader as headerIcon,\n\tsidebar as sidebarIcon,\n\ttableColumnAfter as overlayIcon,\n\tsymbolFilled as symbolFilledIcon,\n} from '@wordpress/icons';\nimport { store as noticesStore } from '@wordpress/notices';\n// @ts-expect-error serialize is not typed\nimport { serialize } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetCleanTemplatePartSlug,\n\tgetUniqueTemplatePartTitle,\n\tuseExistingTemplateParts,\n} from './utils';\n\nfunction getAreaRadioId( value: string, instanceId: number ) {\n\treturn `fields-create-template-part-modal__area-option-${ value }-${ instanceId }`;\n}\nfunction getAreaRadioDescriptionId( value: string, instanceId: number ) {\n\treturn `fields-create-template-part-modal__area-option-description-${ value }-${ instanceId }`;\n}\n\ntype CreateTemplatePartModalContentsProps = {\n\tdefaultArea?: string;\n\tblocks: any[];\n\tconfirmLabel?: string;\n\tcloseModal: () => void;\n\tonCreate: ( templatePart: any ) => void;\n\tonError?: () => void;\n\tdefaultTitle?: string;\n};\n\n/**\n * A React component that renders a modal for creating a template part. The modal displays a title and the contents for creating the template part.\n * This component should not live in this package, it should be moved to a dedicated package responsible for managing template.\n * @param props            The component props.\n * @param props.modalTitle\n */\nexport default function CreateTemplatePartModal( {\n\tmodalTitle,\n\t...restProps\n}: {\n\tmodalTitle?: string;\n} & CreateTemplatePartModalContentsProps ) {\n\tconst defaultModalTitle = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).getPostType( 'wp_template_part' )?.labels\n\t\t\t\t?.add_new_item,\n\t\t[]\n\t);\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ modalTitle || defaultModalTitle }\n\t\t\tonRequestClose={ restProps.closeModal }\n\t\t\toverlayClassName=\"fields-create-template-part-modal\"\n\t\t\tfocusOnMount=\"firstContentElement\"\n\t\t\tsize=\"medium\"\n\t\t>\n\t\t\t<CreateTemplatePartModalContents { ...restProps } />\n\t\t</Modal>\n\t);\n}\n\n/**\n * Helper function to retrieve the corresponding icon by area name or icon name.\n *\n * @param {string} areaOrIconName The area name (e.g., 'header', 'navigation-overlay') or icon name (e.g., 'menu').\n *\n * @return {Object} The corresponding icon.\n */\nconst getTemplatePartIcon = ( areaOrIconName: string ) => {\n\t// Handle area names first\n\tif ( 'header' === areaOrIconName ) {\n\t\treturn headerIcon;\n\t} else if ( 'footer' === areaOrIconName ) {\n\t\treturn footerIcon;\n\t} else if ( 'sidebar' === areaOrIconName ) {\n\t\treturn sidebarIcon;\n\t} else if ( 'overlay' === areaOrIconName ) {\n\t\t// TODO: Replace with a proper overlay icon when available.\n\t\t// Using tableColumnAfter as a placeholder.\n\t\treturn overlayIcon;\n\t}\n\t// Handle icon names for backwards compatibility\n\tif ( 'menu' === areaOrIconName ) {\n\t\t// TODO: Replace with a proper overlay icon when available.\n\t\t// Using tableColumnAfter as a placeholder.\n\t\treturn overlayIcon;\n\t}\n\treturn symbolFilledIcon;\n};\n\n/**\n * A React component that renders the content of a model for creating a template part.\n * This component should not live in this package; it should be moved to a dedicated package responsible for managing template.\n *\n * @param {Object}   props                             - The component props.\n * @param {string}   [props.defaultArea=uncategorized] - The default area for the template part.\n * @param {Array}    [props.blocks=[]]                 - The blocks to be included in the template part.\n * @param {string}   [props.confirmLabel='Add']        - The label for the confirm button.\n * @param {Function} props.closeModal                  - Function to close the modal.\n * @param {Function} props.onCreate                    - Function to call when the template part is successfully created.\n * @param {Function} [props.onError]                   - Function to call when there is an error creating the template part.\n * @param {string}   [props.defaultTitle='']           - The default title for the template part.\n */\nexport function CreateTemplatePartModalContents( {\n\tdefaultArea = 'uncategorized',\n\tblocks = [],\n\tconfirmLabel = __( 'Add' ),\n\tcloseModal,\n\tonCreate,\n\tonError,\n\tdefaultTitle = '',\n}: CreateTemplatePartModalContentsProps ) {\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tconst { saveEntityRecord } = useDispatch( coreStore );\n\tconst existingTemplateParts = useExistingTemplateParts();\n\n\tconst [ title, setTitle ] = useState( defaultTitle );\n\tconst [ area, setArea ] = useState( defaultArea );\n\tconst [ isSubmitting, setIsSubmitting ] = useState( false );\n\tconst instanceId = useInstanceId( CreateTemplatePartModal );\n\n\tconst defaultTemplatePartAreas = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).getCurrentTheme()?.default_template_part_areas,\n\t\t[]\n\t);\n\n\tasync function createTemplatePart() {\n\t\tif ( ! title || isSubmitting ) {\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tsetIsSubmitting( true );\n\t\t\tconst uniqueTitle = getUniqueTemplatePartTitle(\n\t\t\t\ttitle,\n\t\t\t\texistingTemplateParts\n\t\t\t);\n\t\t\tconst cleanSlug = getCleanTemplatePartSlug( uniqueTitle );\n\n\t\t\tconst templatePart = await saveEntityRecord(\n\t\t\t\t'postType',\n\t\t\t\t'wp_template_part',\n\t\t\t\t{\n\t\t\t\t\tslug: cleanSlug,\n\t\t\t\t\ttitle: uniqueTitle,\n\t\t\t\t\tcontent: serialize( blocks ),\n\t\t\t\t\tarea,\n\t\t\t\t},\n\t\t\t\t{ throwOnError: true }\n\t\t\t);\n\t\t\tawait onCreate( templatePart );\n\n\t\t\t// TODO: Add a success notice?\n\t\t} catch ( error ) {\n\t\t\tconst errorMessage =\n\t\t\t\terror instanceof Error &&\n\t\t\t\t'code' in error &&\n\t\t\t\terror.message &&\n\t\t\t\terror.code !== 'unknown_error'\n\t\t\t\t\t? error.message\n\t\t\t\t\t: __(\n\t\t\t\t\t\t\t'An error occurred while creating the template part.'\n\t\t\t\t\t  );\n\n\t\t\tcreateErrorNotice( errorMessage, { type: 'snackbar' } );\n\n\t\t\tonError?.();\n\t\t} finally {\n\t\t\tsetIsSubmitting( false );\n\t\t}\n\t}\n\treturn (\n\t\t<form\n\t\t\tonSubmit={ async ( event ) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tawait createTemplatePart();\n\t\t\t} }\n\t\t>\n\t\t\t<VStack spacing=\"4\">\n\t\t\t\t<TextControl\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tlabel={ __( 'Name' ) }\n\t\t\t\t\tvalue={ title }\n\t\t\t\t\tonChange={ setTitle }\n\t\t\t\t\trequired\n\t\t\t\t/>\n\t\t\t\t<fieldset className=\"fields-create-template-part-modal__area-fieldset\">\n\t\t\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t\t\t{ __( 'Area' ) }\n\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t<div className=\"fields-create-template-part-modal__area-radio-group\">\n\t\t\t\t\t\t{ ( defaultTemplatePartAreas ?? [] ).map(\n\t\t\t\t\t\t\t( item: TemplatePartArea ) => {\n\t\t\t\t\t\t\t\tconst icon = getTemplatePartIcon( item.icon );\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tkey={ item.area }\n\t\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-wrapper\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\t\t\t\tid={ getAreaRadioId(\n\t\t\t\t\t\t\t\t\t\t\t\titem.area,\n\t\t\t\t\t\t\t\t\t\t\t\tinstanceId\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\tname={ `fields-create-template-part-modal__area-${ instanceId }` }\n\t\t\t\t\t\t\t\t\t\t\tvalue={ item.area }\n\t\t\t\t\t\t\t\t\t\t\tchecked={ area === item.area }\n\t\t\t\t\t\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\tsetArea( item.area );\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\taria-describedby={ getAreaRadioDescriptionId(\n\t\t\t\t\t\t\t\t\t\t\t\titem.area,\n\t\t\t\t\t\t\t\t\t\t\t\tinstanceId\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\t<Icon\n\t\t\t\t\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-icon\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<label\n\t\t\t\t\t\t\t\t\t\t\thtmlFor={ getAreaRadioId(\n\t\t\t\t\t\t\t\t\t\t\t\titem.area,\n\t\t\t\t\t\t\t\t\t\t\t\tinstanceId\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-label\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ item.label }\n\t\t\t\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-checkmark\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<p\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-description\"\n\t\t\t\t\t\t\t\t\t\t\tid={ getAreaRadioDescriptionId(\n\t\t\t\t\t\t\t\t\t\t\t\titem.area,\n\t\t\t\t\t\t\t\t\t\t\t\tinstanceId\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\t\t{ item.description }\n\t\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t</div>\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</div>\n\t\t\t\t</fieldset>\n\t\t\t\t<HStack justify=\"right\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\taria-disabled={ ! title || isSubmitting }\n\t\t\t\t\t\tisBusy={ isSubmitting }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ confirmLabel }\n\t\t\t\t\t</Button>\n\t\t\t\t</HStack>\n\t\t\t</VStack>\n\t\t</form>\n\t);\n}\n"],
   "mappings": "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",
   "names": ["coreStore", "headerIcon", "footerIcon", "sidebarIcon", "overlayIcon", "symbolFilledIcon", "noticesStore", "VStack", "HStack"]
 }

package/build/components/media-edit/index.cjs

@@ -35,12 +35,14 @@ __export(media_edit_exports, {
 module.exports = __toCommonJS(media_edit_exports);
 var import_clsx = __toESM(require("clsx"));
 var import_components = require("@wordpress/components");
+var import_blob = require("@wordpress/blob");
 var import_core_data = require("@wordpress/core-data");
 var import_data = require("@wordpress/data");
 var import_element = require("@wordpress/element");
 var import_i18n = require("@wordpress/i18n");
 var import_icons = require("@wordpress/icons");
 var import_media_utils = require("@wordpress/media-utils");
+var import_notices = require("@wordpress/notices");
 var import_lock_unlock = require("../../lock-unlock.cjs");
 var import_jsx_runtime = require("react/jsx-runtime");
 var { MediaUploadModal } = (0, import_lock_unlock.unlock)(import_media_utils.privateApis);
@@ -80,23 +82,44 @@ function MediaPickerButton({
   open,
   children,
   label,
-  showTooltip = false
+  showTooltip = false,
+  onFilesDrop,
+  attachment,
+  isUploading = false
 }) {
-  const mediaPickerButton = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  const isBlob = attachment && (0, import_blob.isBlobURL)(attachment.source_url);
+  const mediaPickerButton = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     "div",
     {
       className: "fields__media-edit-picker-button",
       role: "button",
       tabIndex: 0,
-      onClick: open,
+      onClick: () => {
+        if (!isUploading) {
+          open();
+        }
+      },
       onKeyDown: (event) => {
+        if (isUploading) {
+          return;
+        }
         if (event.key === "Enter" || event.key === " ") {
           event.preventDefault();
           open();
         }
       },
       "aria-label": label,
-      children
+      "aria-disabled": isUploading,
+      children: [
+        children,
+        isBlob && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "fields__media-edit-picker-button-spinner", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Spinner, {}) }),
+        !isUploading && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_components.DropZone,
+          {
+            onFilesDrop: (files) => onFilesDrop(files, attachment?.id)
+          }
+        )
+      ]
     }
   );
   if (!showTooltip) {
@@ -115,16 +138,13 @@ var archiveMimeTypes = [
 function MediaTitle({ attachment }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalTruncate, { className: "fields__media-edit-filename", children: attachment.title.rendered });
 }
-function MediaEditPlaceholder({
-  open,
-  label
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MediaPickerButton, { open, label, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "fields__media-edit-placeholder", children: label }) });
+function MediaEditPlaceholder(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MediaPickerButton, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "fields__media-edit-placeholder", children: props.label }) });
 }
 function MediaPreview({ attachment }) {
   const url = attachment.source_url;
-  const mimeType = attachment.mime_type;
-  if (mimeType.startsWith("image/")) {
+  const mimeType = attachment.mime_type || "";
+  if (mimeType.startsWith("image")) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "img",
       {
@@ -133,9 +153,9 @@ function MediaPreview({ attachment }) {
         src: url
       }
     );
-  } else if (mimeType.startsWith("audio/")) {
+  } else if (mimeType.startsWith("audio")) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Icon, { icon: import_icons.audio });
-  } else if (mimeType.startsWith("video/")) {
+  } else if (mimeType.startsWith("video")) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Icon, { icon: import_icons.video });
   } else if (archiveMimeTypes.includes(mimeType)) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Icon, { icon: import_icons.archive });
@@ -143,11 +163,13 @@ function MediaPreview({ attachment }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Icon, { icon: import_icons.file });
 }
 function ExpandedMediaEditAttachments({
-  attachments,
+  allItems,
   addButtonLabel,
   multiple,
   removeItem,
-  open
+  open,
+  onFilesDrop,
+  isUploading
 }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     "div",
@@ -155,11 +177,12 @@ function ExpandedMediaEditAttachments({
       className: (0, import_clsx.default)("fields__media-edit-expanded", {
         "is-multiple": multiple,
         "is-single": !multiple,
-        "is-empty": !attachments?.length
+        "is-empty": !allItems?.length
       }),
       children: [
-        attachments?.map((attachment) => {
-          const hasPreviewImage = attachment.mime_type.startsWith("image/");
+        allItems?.map((attachment) => {
+          const hasPreviewImage = attachment.mime_type?.startsWith("image");
+          const isBlob = (0, import_blob.isBlobURL)(attachment.source_url);
           return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
             "div",
             {
@@ -173,6 +196,9 @@ function ExpandedMediaEditAttachments({
                     open,
                     label: (0, import_i18n.__)("Replace"),
                     showTooltip: true,
+                    onFilesDrop,
+                    attachment,
+                    isUploading,
                     children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "fields__media-edit-expanded-preview", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
                       import_components.__experimentalVStack,
                       {
@@ -181,19 +207,29 @@ function ExpandedMediaEditAttachments({
                         justify: "center",
                         className: "fields__media-edit-expanded-preview-stack",
                         children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MediaPreview, { attachment }),
-                          !hasPreviewImage ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MediaTitle, { attachment }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "fields__media-edit-expanded-title", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                          (!isBlob || hasPreviewImage) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                            MediaPreview,
+                            {
+                              attachment
+                            }
+                          ),
+                          !isBlob && (!hasPreviewImage ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                             MediaTitle,
                             {
                               attachment
                             }
-                          ) })
+                          ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "fields__media-edit-expanded-overlay", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "fields__media-edit-expanded-title", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                            MediaTitle,
+                            {
+                              attachment
+                            }
+                          ) }) }))
                         ]
                       }
                     ) })
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "fields__media-edit-expanded-overlay", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                !isBlob && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "fields__media-edit-expanded-overlay", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                   import_components.Button,
                   {
                     __next40pxDefaultSize: true,
@@ -201,6 +237,8 @@ function ExpandedMediaEditAttachments({
                     icon: import_icons.closeSmall,
                     label: (0, import_i18n.__)("Remove"),
                     size: "small",
+                    disabled: isUploading,
+                    accessibleWhenDisabled: true,
                     onClick: (event) => {
                       event.stopPropagation();
                       removeItem(attachment.id);
@@ -212,54 +250,92 @@ function ExpandedMediaEditAttachments({
             attachment.id
           );
         }),
-        (multiple || !attachments?.length) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MediaEditPlaceholder, { open, label: addButtonLabel })
+        (multiple || !allItems?.length) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          MediaEditPlaceholder,
+          {
+            open,
+            label: addButtonLabel,
+            onFilesDrop,
+            isUploading
+          }
+        )
       ]
     }
   );
 }
 function CompactMediaEditAttachments({
-  attachments,
+  allItems,
   addButtonLabel,
   multiple,
   removeItem,
-  open
+  open,
+  onFilesDrop,
+  isUploading
 }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-    !!attachments?.length && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalVStack, { spacing: 2, children: attachments.map((attachment) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-      "div",
-      {
-        className: "fields__media-edit-compact",
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-            MediaPickerButton,
-            {
-              open,
-              label: (0, import_i18n.__)("Replace"),
-              showTooltip: true,
-              children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MediaPreview, { attachment }),
-                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MediaTitle, { attachment })
-              ] })
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-            import_components.Button,
-            {
-              __next40pxDefaultSize: true,
-              className: "fields__media-edit-remove",
-              text: (0, import_i18n.__)("Remove"),
-              variant: "secondary",
-              onClick: (event) => {
-                event.stopPropagation();
-                removeItem(attachment.id);
+    !!allItems?.length && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalVStack, { spacing: 2, children: allItems.map((attachment) => {
+      const isBlob = (0, import_blob.isBlobURL)(attachment.source_url);
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        "div",
+        {
+          className: "fields__media-edit-compact",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              MediaPickerButton,
+              {
+                open,
+                label: (0, import_i18n.__)("Replace"),
+                showTooltip: true,
+                onFilesDrop,
+                attachment,
+                isUploading,
+                children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    MediaPreview,
+                    {
+                      attachment
+                    }
+                  ),
+                  !isBlob && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    MediaTitle,
+                    {
+                      attachment
+                    }
+                  )
+                ] })
               }
-            }
-          )
-        ]
-      },
-      attachment.id
-    )) }),
-    (multiple || !attachments?.length) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MediaEditPlaceholder, { open, label: addButtonLabel })
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_components.Button,
+              {
+                __next40pxDefaultSize: true,
+                className: "fields__media-edit-remove",
+                text: (0, import_i18n.__)("Remove"),
+                variant: "secondary",
+                disabled: isUploading,
+                accessibleWhenDisabled: true,
+                onClick: (event) => {
+                  event.stopPropagation();
+                  if (typeof attachment.id === "number") {
+                    removeItem(attachment.id);
+                  }
+                }
+              }
+            )
+          ]
+        },
+        attachment.id
+      );
+    }) }),
+    (multiple || !allItems?.length) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      MediaEditPlaceholder,
+      {
+        open,
+        label: addButtonLabel,
+        onFilesDrop,
+        isUploading
+      }
+    )
   ] });
 }
 function MediaEdit({
@@ -285,6 +361,9 @@ function MediaEdit({
     },
     [value]
   );
+  const { createErrorNotice } = (0, import_data.useDispatch)(import_notices.store);
+  const [replacementId, setReplacementId] = (0, import_element.useState)();
+  const [blobs, setBlobs] = (0, import_element.useState)([]);
   const onChangeControl = (0, import_element.useCallback)(
     (newValue) => onChange(field.setValue({ item: data, value: newValue })),
     [data, field, onChange]
@@ -294,7 +373,87 @@ function MediaEdit({
     const newIds = currentIds.filter((id) => id !== itemId);
     onChangeControl(newIds.length ? newIds : void 0);
   };
+  const onFilesDrop = (0, import_element.useCallback)(
+    (files, _replacementId) => {
+      (0, import_media_utils.uploadMedia)({
+        allowedTypes: allowedTypes?.length ? allowedTypes : void 0,
+        filesList: files,
+        onFileChange(uploadedMedia) {
+          setReplacementId(_replacementId);
+          const { blobItems, uploadedItems } = uploadedMedia.reduce(
+            (accumulator, item) => {
+              if ((0, import_blob.isBlobURL)(item.url)) {
+                accumulator.blobItems.push(item.url);
+              } else {
+                accumulator.uploadedItems.push(item.id);
+              }
+              return accumulator;
+            },
+            {
+              blobItems: [],
+              uploadedItems: []
+            }
+          );
+          setBlobs(blobItems);
+          if (uploadedItems.length === uploadedMedia.length) {
+            setReplacementId(void 0);
+          }
+          if (!uploadedItems.length) {
+            return;
+          }
+          if (!multiple) {
+            onChangeControl(uploadedItems[0]);
+            return;
+          }
+          if (!value) {
+            onChangeControl(uploadedItems);
+            return;
+          }
+          const normalizedValue = Array.isArray(value) ? value : [value];
+          const newIds = [
+            ..._replacementId ? normalizedValue.filter(
+              (id) => id !== _replacementId
+            ) : normalizedValue,
+            ...uploadedItems
+          ];
+          onChangeControl(newIds);
+        },
+        onError(error) {
+          setReplacementId(void 0);
+          setBlobs([]);
+          createErrorNotice(error.message, { type: "snackbar" });
+        },
+        multiple: !!multiple
+      });
+    },
+    [allowedTypes, value, multiple, createErrorNotice, onChangeControl]
+  );
   const addButtonLabel = field.placeholder || (multiple ? (0, import_i18n.__)("Choose files") : (0, import_i18n.__)("Choose file"));
+  const allItems = (0, import_element.useMemo)(() => {
+    if (!blobs.length) {
+      return attachments;
+    }
+    const items = [
+      ...attachments || []
+    ];
+    const blobItems = blobs.map((url) => ({
+      id: url,
+      source_url: url,
+      mime_type: (0, import_blob.getBlobTypeByURL)(url)
+    }));
+    const replacementIndex = items.findIndex(
+      (a) => a.id === replacementId
+    );
+    if (replacementIndex !== -1) {
+      return [
+        ...items.slice(0, replacementIndex),
+        ...blobItems,
+        ...items.slice(replacementIndex + 1)
+      ];
+    }
+    items.push(...blobItems);
+    return items;
+  }, [attachments, replacementId, blobs]);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("fieldset", { className: "fields__media-edit", "data-field-id": field.id, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     ConditionalMediaUpload,
     {
@@ -317,11 +476,13 @@ function MediaEdit({
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
             AttachmentsComponent,
             {
-              attachments,
+              allItems,
               addButtonLabel,
               multiple,
               removeItem,
-              open
+              open,
+              onFilesDrop,
+              isUploading: !!blobs.length
             }
           ),
           field.description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalText, { variant: "muted", children: field.description })

package/build/components/media-edit/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/media-edit/index.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tIcon,\n\t__experimentalText as Text,\n\t__experimentalTruncate as Truncate,\n\t__experimentalVStack as VStack,\n\tBaseControl,\n\tTooltip,\n\tVisuallyHidden,\n} from '@wordpress/components';\nimport { store as coreStore, type Attachment } from '@wordpress/core-data';\nimport { useSelect } from '@wordpress/data';\nimport { useCallback, useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { archive, audio, video, file, closeSmall } from '@wordpress/icons';\nimport {\n\tMediaUpload,\n\tprivateApis as mediaUtilsPrivateApis,\n} from '@wordpress/media-utils';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport type { MediaEditProps } from '../../types';\n\nconst { MediaUploadModal } = unlock( mediaUtilsPrivateApis );\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}: {\n\topen: () => void;\n\tchildren: React.ReactNode;\n\tlabel: string;\n\tshowTooltip?: boolean;\n} ) {\n\tconst mediaPickerButton = (\n\t\t<div\n\t\t\tclassName=\"fields__media-edit-picker-button\"\n\t\t\trole=\"button\"\n\t\t\ttabIndex={ 0 }\n\t\t\tonClick={ open }\n\t\t\tonKeyDown={ ( event ) => {\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>\n\t\t\t{ children }\n\t\t</div>\n\t);\n\tif ( ! showTooltip ) {\n\t\treturn mediaPickerButton;\n\t}\n\treturn <Tooltip text={ label }>{ mediaPickerButton }</Tooltip>;\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( {\n\topen,\n\tlabel,\n}: {\n\topen: () => void;\n\tlabel: string;\n} ) {\n\treturn (\n\t\t<MediaPickerButton open={ open } label={ label }>\n\t\t\t<span className=\"fields__media-edit-placeholder\">{ label }</span>\n\t\t</MediaPickerButton>\n\t);\n}\n\nfunction MediaPreview( { attachment }: { attachment: Attachment< 'view' > } ) {\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\ninterface MediaEditAttachmentsProps {\n\tattachments: Attachment< 'view' >[] | null;\n\taddButtonLabel: string;\n\tmultiple?: boolean;\n\tremoveItem: ( itemId: number ) => void;\n\topen: () => void;\n}\n\nfunction ExpandedMediaEditAttachments( {\n\tattachments,\n\taddButtonLabel,\n\tmultiple,\n\tremoveItem,\n\topen,\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': ! attachments?.length,\n\t\t\t} ) }\n\t\t>\n\t\t\t{ attachments?.map( ( attachment ) => {\n\t\t\t\tconst hasPreviewImage =\n\t\t\t\t\tattachment.mime_type.startsWith( 'image/' );\n\t\t\t\treturn (\n\t\t\t\t\t<div\n\t\t\t\t\t\tkey={ attachment.id }\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={ open }\n\t\t\t\t\t\t\tlabel={ __( 'Replace' ) }\n\t\t\t\t\t\t\tshowTooltip\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<MediaPreview attachment={ attachment } />\n\t\t\t\t\t\t\t\t\t{ ! hasPreviewImage ? (\n\t\t\t\t\t\t\t\t\t\t<MediaTitle attachment={ attachment } />\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<div className=\"fields__media-edit-expanded-title\">\n\t\t\t\t\t\t\t\t\t\t\t<MediaTitle\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</div>\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<div className=\"fields__media-edit-expanded-overlay\">\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-expanded-remove\"\n\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\tlabel={ __( 'Remove' ) }\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\tonClick={ (\n\t\t\t\t\t\t\t\t\tevent: React.MouseEvent< HTMLButtonElement >\n\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\tremoveItem( attachment.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</div>\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t\t{ ( multiple || ! attachments?.length ) && (\n\t\t\t\t<MediaEditPlaceholder open={ open } label={ addButtonLabel } />\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nfunction CompactMediaEditAttachments( {\n\tattachments,\n\taddButtonLabel,\n\tmultiple,\n\tremoveItem,\n\topen,\n}: MediaEditAttachmentsProps ) {\n\treturn (\n\t\t<>\n\t\t\t{ !! attachments?.length && (\n\t\t\t\t<VStack spacing={ 2 }>\n\t\t\t\t\t{ attachments.map( ( attachment ) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={ attachment.id }\n\t\t\t\t\t\t\tclassName=\"fields__media-edit-compact\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<MediaPickerButton\n\t\t\t\t\t\t\t\topen={ open }\n\t\t\t\t\t\t\t\tlabel={ __( 'Replace' ) }\n\t\t\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<MediaPreview attachment={ attachment } />\n\t\t\t\t\t\t\t\t\t<MediaTitle attachment={ attachment } />\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t</MediaPickerButton>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-remove\"\n\t\t\t\t\t\t\t\ttext={ __( 'Remove' ) }\n\t\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t\tonClick={ (\n\t\t\t\t\t\t\t\t\tevent: React.MouseEvent< HTMLButtonElement >\n\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\tremoveItem( attachment.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</div>\n\t\t\t\t\t) ) }\n\t\t\t\t</VStack>\n\t\t\t) }\n\t\t\t{ ( multiple || ! attachments?.length ) && (\n\t\t\t\t<MediaEditPlaceholder open={ open } label={ addButtonLabel } />\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. 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 {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}: MediaEditProps< Item > ) {\n\tconst value = field.getValue( { item: data } );\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 = Array.isArray( value ) ? value : [ value ];\n\t\t\tconst { getEntityRecords } = select( coreStore );\n\t\t\treturn getEntityRecords( 'postType', 'attachment', {\n\t\t\t\tinclude: normalizedValue,\n\t\t\t} ) as Attachment< 'view' >[] | null;\n\t\t},\n\t\t[ value ]\n\t);\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 = ( itemId: number ) => {\n\t\tconst currentIds = Array.isArray( value ) ? value : [ value ];\n\t\tconst newIds = currentIds.filter( ( id ) => id !== itemId );\n\t\tonChangeControl( newIds.length ? newIds : undefined );\n\t};\n\tconst addButtonLabel =\n\t\tfield.placeholder ||\n\t\t( multiple ? __( 'Choose files' ) : __( 'Choose file' ) );\n\treturn (\n\t\t<fieldset className=\"fields__media-edit\" data-field-id={ field.id }>\n\t\t\t<ConditionalMediaUpload\n\t\t\t\tonSelect={ ( selectedMedia: any ) => {\n\t\t\t\t\tif ( multiple ) {\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\tonChangeControl( newIds );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tonChangeControl( selectedMedia.id );\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t\tallowedTypes={ allowedTypes }\n\t\t\t\tvalue={ value }\n\t\t\t\tmultiple={ multiple }\n\t\t\t\ttitle={ field.label }\n\t\t\t\trender={ ( { open }: any ) => {\n\t\t\t\t\tconst AttachmentsComponent = isExpanded\n\t\t\t\t\t\t? ExpandedMediaEditAttachments\n\t\t\t\t\t\t: CompactMediaEditAttachments;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<VStack spacing={ 2 }>\n\t\t\t\t\t\t\t{ field.label &&\n\t\t\t\t\t\t\t\t( hideLabelFromVision ? (\n\t\t\t\t\t\t\t\t\t<VisuallyHidden as=\"legend\">\n\t\t\t\t\t\t\t\t\t\t{ field.label }\n\t\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t\t\t\t\t\t\t{ field.label }\n\t\t\t\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t<AttachmentsComponent\n\t\t\t\t\t\t\t\tattachments={ attachments }\n\t\t\t\t\t\t\t\taddButtonLabel={ addButtonLabel }\n\t\t\t\t\t\t\t\tmultiple={ multiple }\n\t\t\t\t\t\t\t\tremoveItem={ removeItem }\n\t\t\t\t\t\t\t\topen={ open }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{ field.description && (\n\t\t\t\t\t\t\t\t<Text variant=\"muted\">\n\t\t\t\t\t\t\t\t\t{ field.description }\n\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</VStack>\n\t\t\t\t\t);\n\t\t\t\t} }\n\t\t\t/>\n\t\t</fieldset>\n\t);\n}\n"],
-  "mappings": "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",
-  "names": ["mediaUtilsPrivateApis", "Truncate", "clsx", "VStack", "coreStore", "Text"]
+  "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 Text,\n\t__experimentalTruncate as Truncate,\n\t__experimentalVStack as VStack,\n\tBaseControl,\n\tTooltip,\n\tVisuallyHidden,\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 { useCallback, useMemo, useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { archive, audio, video, file, closeSmall } from '@wordpress/icons';\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';\n\nconst { MediaUploadModal } = unlock( mediaUtilsPrivateApis );\n\ntype BlobItem = {\n\tid: string;\n\tsource_url: string;\n\tmime_type: string | undefined;\n\talt_text?: string;\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=\"fields__media-edit-picker-button\"\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 <Tooltip text={ label }>{ mediaPickerButton }</Tooltip>;\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 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\topen: () => void;\n\tonFilesDrop: ( files: File[], attachmentId?: number ) => void;\n\tisUploading: boolean;\n}\n\nfunction ExpandedMediaEditAttachments( {\n\tallItems,\n\taddButtonLabel,\n\tmultiple,\n\tremoveItem,\n\topen,\n\tonFilesDrop,\n\tisUploading,\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 ) => {\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\treturn (\n\t\t\t\t\t<div\n\t\t\t\t\t\tkey={ attachment.id }\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={ open }\n\t\t\t\t\t\t\tlabel={ __( 'Replace' ) }\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\t{ ! isBlob &&\n\t\t\t\t\t\t\t\t\t\t( ! hasPreviewImage ? (\n\t\t\t\t\t\t\t\t\t\t\t<MediaTitle\n\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\tattachment as Attachment< 'view' >\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\t\t<div className=\"fields__media-edit-expanded-overlay\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"fields__media-edit-expanded-title\">\n\t\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\t\tattachment={\n\t\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\t}\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</div>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\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<Button\n\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-expanded-remove\"\n\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Remove' ) }\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\tdisabled={ isUploading }\n\t\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\t\tonClick={ (\n\t\t\t\t\t\t\t\t\t\tevent: React.MouseEvent< HTMLButtonElement >\n\t\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\tremoveItem( attachment.id as number );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\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={ open }\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\topen,\n\tonFilesDrop,\n\tisUploading,\n}: MediaEditAttachmentsProps ) {\n\treturn (\n\t\t<>\n\t\t\t{ !! allItems?.length && (\n\t\t\t\t<VStack spacing={ 2 }>\n\t\t\t\t\t{ allItems.map( ( attachment ) => {\n\t\t\t\t\t\tconst isBlob = isBlobURL( attachment.source_url );\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tkey={ attachment.id }\n\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-compact\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<MediaPickerButton\n\t\t\t\t\t\t\t\t\topen={ open }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Replace' ) }\n\t\t\t\t\t\t\t\t\tshowTooltip\n\t\t\t\t\t\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\t\t\t\t\t\tattachment={ attachment }\n\t\t\t\t\t\t\t\t\tisUploading={ isUploading }\n\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\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\t{ ! isBlob && (\n\t\t\t\t\t\t\t\t\t\t\t<MediaTitle\n\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\tattachment as Attachment< 'view' >\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</>\n\t\t\t\t\t\t\t\t</MediaPickerButton>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\tclassName=\"fields__media-edit-remove\"\n\t\t\t\t\t\t\t\t\ttext={ __( 'Remove' ) }\n\t\t\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t\t\tdisabled={ isUploading }\n\t\t\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\t\t\tonClick={ (\n\t\t\t\t\t\t\t\t\t\tevent: React.MouseEvent< HTMLButtonElement >\n\t\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\ttypeof attachment.id === 'number'\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\tremoveItem( attachment.id );\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/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</VStack>\n\t\t\t) }\n\t\t\t{ ( multiple || ! allItems?.length ) && (\n\t\t\t\t<MediaEditPlaceholder\n\t\t\t\t\topen={ open }\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. 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 {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}: MediaEditProps< Item > ) {\n\tconst value = field.getValue( { item: data } );\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 = Array.isArray( value ) ? value : [ value ];\n\t\t\tconst { getEntityRecords } = select( coreStore );\n\t\t\treturn getEntityRecords( 'postType', 'attachment', {\n\t\t\t\tinclude: normalizedValue,\n\t\t\t} ) as Attachment< 'view' >[] | null;\n\t\t},\n\t\t[ value ]\n\t);\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\t// Support one upload action at a time for now.\n\tconst [ replacementId, setReplacementId ] = useState< number >();\n\tconst [ blobs, setBlobs ] = useState< string[] >( [] );\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 = ( itemId: number ) => {\n\t\tconst currentIds = Array.isArray( value ) ? value : [ value ];\n\t\tconst newIds = currentIds.filter( ( id ) => id !== itemId );\n\t\tonChangeControl( newIds.length ? newIds : undefined );\n\t};\n\tconst onFilesDrop = useCallback(\n\t\t( files: File[], _replacementId?: number ) => {\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\tsetReplacementId( _replacementId );\n\t\t\t\t\tconst { blobItems, uploadedItems } = uploadedMedia.reduce(\n\t\t\t\t\t\t( accumulator, item ) => {\n\t\t\t\t\t\t\tif ( isBlobURL( item.url ) ) {\n\t\t\t\t\t\t\t\taccumulator.blobItems.push( item.url );\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\taccumulator.uploadedItems.push( item.id );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\treturn accumulator;\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tblobItems: [] as string[],\n\t\t\t\t\t\t\tuploadedItems: [] as number[],\n\t\t\t\t\t\t}\n\t\t\t\t\t);\n\t\t\t\t\tsetBlobs( blobItems );\n\t\t\t\t\t// If all uploads are complete reset the replacementId.\n\t\t\t\t\tif ( uploadedItems.length === uploadedMedia.length ) {\n\t\t\t\t\t\tsetReplacementId( undefined );\n\t\t\t\t\t}\n\t\t\t\t\tif ( ! uploadedItems.length ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tif ( ! multiple ) {\n\t\t\t\t\t\tonChangeControl( uploadedItems[ 0 ] );\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tif ( ! value ) {\n\t\t\t\t\t\tonChangeControl( uploadedItems );\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tconst normalizedValue = Array.isArray( value )\n\t\t\t\t\t\t? value\n\t\t\t\t\t\t: [ value ];\n\t\t\t\t\tconst newIds = [\n\t\t\t\t\t\t...( _replacementId\n\t\t\t\t\t\t\t? normalizedValue.filter(\n\t\t\t\t\t\t\t\t\t( id: any ) => id !== _replacementId\n\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t: normalizedValue ),\n\t\t\t\t\t\t...uploadedItems,\n\t\t\t\t\t];\n\t\t\t\t\tonChangeControl( newIds );\n\t\t\t\t},\n\t\t\t\tonError( error: Error ) {\n\t\t\t\t\tsetReplacementId( 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[ allowedTypes, value, multiple, createErrorNotice, onChangeControl ]\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 attachments;\n\t\t}\n\t\tconst items: Array< MediaEditAttachment > = [\n\t\t\t...( attachments || [] ),\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\tconst replacementIndex = items.findIndex(\n\t\t\t( a ) => a.id === replacementId\n\t\t);\n\t\t// Place blobs at the replacement index, when files\n\t\t// dropped in existing media item.\n\t\tif ( replacementIndex !== -1 ) {\n\t\t\treturn [\n\t\t\t\t...items.slice( 0, replacementIndex ),\n\t\t\t\t...blobItems,\n\t\t\t\t...items.slice( replacementIndex + 1 ),\n\t\t\t];\n\t\t}\n\t\titems.push( ...blobItems );\n\t\treturn items;\n\t}, [ attachments, replacementId, blobs ] );\n\treturn (\n\t\t<fieldset className=\"fields__media-edit\" data-field-id={ field.id }>\n\t\t\t<ConditionalMediaUpload\n\t\t\t\tonSelect={ ( selectedMedia: any ) => {\n\t\t\t\t\tif ( multiple ) {\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\tonChangeControl( newIds );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tonChangeControl( selectedMedia.id );\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t\tallowedTypes={ allowedTypes }\n\t\t\t\tvalue={ value }\n\t\t\t\tmultiple={ multiple }\n\t\t\t\ttitle={ field.label }\n\t\t\t\trender={ ( { open }: any ) => {\n\t\t\t\t\tconst AttachmentsComponent = isExpanded\n\t\t\t\t\t\t? ExpandedMediaEditAttachments\n\t\t\t\t\t\t: CompactMediaEditAttachments;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<VStack spacing={ 2 }>\n\t\t\t\t\t\t\t{ field.label &&\n\t\t\t\t\t\t\t\t( hideLabelFromVision ? (\n\t\t\t\t\t\t\t\t\t<VisuallyHidden as=\"legend\">\n\t\t\t\t\t\t\t\t\t\t{ field.label }\n\t\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t\t\t\t\t\t\t{ field.label }\n\t\t\t\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t<AttachmentsComponent\n\t\t\t\t\t\t\t\tallItems={ allItems }\n\t\t\t\t\t\t\t\taddButtonLabel={ addButtonLabel }\n\t\t\t\t\t\t\t\tmultiple={ multiple }\n\t\t\t\t\t\t\t\tremoveItem={ removeItem }\n\t\t\t\t\t\t\t\topen={ open }\n\t\t\t\t\t\t\t\tonFilesDrop={ onFilesDrop }\n\t\t\t\t\t\t\t\tisUploading={ !! blobs.length }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{ field.description && (\n\t\t\t\t\t\t\t\t<Text variant=\"muted\">\n\t\t\t\t\t\t\t\t\t{ field.description }\n\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</VStack>\n\t\t\t\t\t);\n\t\t\t\t} }\n\t\t\t/>\n\t\t</fieldset>\n\t);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,wBAWO;AACP,kBAA4C;AAC5C,uBAAoD;AACpD,kBAAuC;AACvC,qBAA+C;AAC/C,kBAAmB;AACnB,mBAAwD;AACxD,yBAIO;AACP,qBAAsC;AAKtC,yBAAuB;AAyBpB;AAtBH,IAAM,EAAE,iBAAiB,QAAI,2BAAQ,mBAAAA,WAAsB;AAkB3D,SAAS,uBAAwB,EAAE,QAAQ,UAAU,GAAG,MAAM,GAAS;AACtE,QAAM,CAAE,aAAa,cAAe,QAAI,yBAAU,KAAM;AACxD,MAAO,OAAgB,mCAAoC;AAC1D,WACC,4EACG;AAAA,gBAAU,OAAQ,EAAE,MAAM,MAAM,eAAgB,IAAK,EAAE,CAAE;AAAA,MACzD,eACD;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACL;AAAA,UACA,QAAS;AAAA,UACT,SAAU,MAAM;AACf,2BAAgB,KAAM;AACtB,kBAAM,UAAU;AAAA,UACjB;AAAA,UACA,UAAW,CAAE,UAAgB;AAC5B,2BAAgB,KAAM;AACtB,kBAAM,WAAY,KAAM;AAAA,UACzB;AAAA;AAAA,MACD;AAAA,OAEF;AAAA,EAEF;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACL;AAAA,MACA,UAAW,WAAW,QAAQ;AAAA;AAAA,EAC/B;AAEF;AAEA,SAAS,kBAAmB;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA,cAAc;AACf,GAQI;AACH,QAAM,SAAS,kBAAc,uBAAW,WAAW,UAAW;AAC9D,QAAM,oBACL;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,MAAK;AAAA,MACL,UAAW;AAAA,MACX,SAAU,MAAM;AACf,YAAK,CAAE,aAAc;AACpB,eAAK;AAAA,QACN;AAAA,MACD;AAAA,MACA,WAAY,CAAE,UAAW;AACxB,YAAK,aAAc;AAClB;AAAA,QACD;AACA,YAAK,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAM;AACjD,gBAAM,eAAe;AACrB,eAAK;AAAA,QACN;AAAA,MACD;AAAA,MACA,cAAa;AAAA,MACb,iBAAgB;AAAA,MAEd;AAAA;AAAA,QACA,UACD,4CAAC,UAAK,WAAU,4CACf,sDAAC,6BAAQ,GACV;AAAA,QAEC,CAAE,eACH;AAAA,UAAC;AAAA;AAAA,YACA,aAAc,CAAE,UACf,YAAa,OAAO,YAAY,EAAa;AAAA;AAAA,QAE/C;AAAA;AAAA;AAAA,EAEF;AAED,MAAK,CAAE,aAAc;AACpB,WAAO;AAAA,EACR;AACA,SAAO,4CAAC,6BAAQ,MAAO,OAAU,6BAAmB;AACrD;AAEA,IAAM,mBAAmB;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD;AAEA,SAAS,WAAY,EAAE,WAAW,GAA0C;AAC3E,SACC,4CAAC,kBAAAC,wBAAA,EAAS,WAAU,+BACjB,qBAAW,MAAM,UACpB;AAEF;AAEA,SAAS,qBAAsB,OAK3B;AACH,SACC,4CAAC,qBAAoB,GAAG,OACvB,sDAAC,UAAK,WAAU,kCACb,gBAAM,OACT,GACD;AAEF;AAEA,SAAS,aAAc,EAAE,WAAW,GAAyC;AAC5E,QAAM,MAAM,WAAW;AACvB,QAAM,WAAW,WAAW,aAAa;AACzC,MAAK,SAAS,WAAY,OAAQ,GAAI;AACrC,WACC;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV,KAAM,WAAW,YAAY;AAAA,QAC7B,KAAM;AAAA;AAAA,IACP;AAAA,EAEF,WAAY,SAAS,WAAY,OAAQ,GAAI;AAC5C,WAAO,4CAAC,0BAAK,MAAO,oBAAQ;AAAA,EAC7B,WAAY,SAAS,WAAY,OAAQ,GAAI;AAC5C,WAAO,4CAAC,0BAAK,MAAO,oBAAQ;AAAA,EAC7B,WAAY,iBAAiB,SAAU,QAAS,GAAI;AACnD,WAAO,4CAAC,0BAAK,MAAO,sBAAU;AAAA,EAC/B;AACA,SAAO,4CAAC,0BAAK,MAAO,mBAAO;AAC5B;AAaA,SAAS,6BAA8B;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAA+B;AAC9B,SACC;AAAA,IAAC;AAAA;AAAA,MACA,eAAY,YAAAC,SAAM,+BAA+B;AAAA,QAChD,eAAe;AAAA,QACf,aAAa,CAAE;AAAA,QACf,YAAY,CAAE,UAAU;AAAA,MACzB,CAAE;AAAA,MAEA;AAAA,kBAAU,IAAK,CAAE,eAAgB;AAClC,gBAAM,kBACL,WAAW,WAAW,WAAY,OAAQ;AAC3C,gBAAM,aAAS,uBAAW,WAAW,UAAW;AAChD,iBACC;AAAA,YAAC;AAAA;AAAA,cAEA,eAAY,YAAAA,SAAM,oCAAoC;AAAA,gBACrD,qBAAqB;AAAA,cACtB,CAAE;AAAA,cAEF;AAAA;AAAA,kBAAC;AAAA;AAAA,oBACA;AAAA,oBACA,WAAQ,gBAAI,SAAU;AAAA,oBACtB,aAAW;AAAA,oBACX;AAAA,oBACA;AAAA,oBACA;AAAA,oBAEA,sDAAC,SAAI,WAAU,uCACd;AAAA,sBAAC,kBAAAC;AAAA,sBAAA;AAAA,wBACA,SAAU;AAAA,wBACV,WAAU;AAAA,wBACV,SAAQ;AAAA,wBACR,WAAU;AAAA,wBAEN;AAAA,4BAAE,UAAU,oBACf;AAAA,4BAAC;AAAA;AAAA,8BACA;AAAA;AAAA,0BACD;AAAA,0BAEC,CAAE,WACD,CAAE,kBACH;AAAA,4BAAC;AAAA;AAAA,8BACA;AAAA;AAAA,0BAGD,IAEA,4CAAC,SAAI,WAAU,uCACd,sDAAC,SAAI,WAAU,qCACd;AAAA,4BAAC;AAAA;AAAA,8BACA;AAAA;AAAA,0BAGD,GACD,GACD;AAAA;AAAA;AAAA,oBAEH,GACD;AAAA;AAAA,gBACD;AAAA,gBACE,CAAE,UACH,4CAAC,SAAI,WAAU,uCACd;AAAA,kBAAC;AAAA;AAAA,oBACA,uBAAqB;AAAA,oBACrB,WAAU;AAAA,oBACV,MAAO;AAAA,oBACP,WAAQ,gBAAI,QAAS;AAAA,oBACrB,MAAK;AAAA,oBACL,UAAW;AAAA,oBACX,wBAAsB;AAAA,oBACtB,SAAU,CACT,UACI;AACJ,4BAAM,gBAAgB;AACtB,iCAAY,WAAW,EAAa;AAAA,oBACrC;AAAA;AAAA,gBACD,GACD;AAAA;AAAA;AAAA,YA/DK,WAAW;AAAA,UAiElB;AAAA,QAEF,CAAE;AAAA,SACE,YAAY,CAAE,UAAU,WAC3B;AAAA,UAAC;AAAA;AAAA,YACA;AAAA,YACA,OAAQ;AAAA,YACR;AAAA,YACA;AAAA;AAAA,QACD;AAAA;AAAA;AAAA,EAEF;AAEF;AAEA,SAAS,4BAA6B;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAA+B;AAC9B,SACC,4EACG;AAAA,KAAC,CAAE,UAAU,UACd,4CAAC,kBAAAA,sBAAA,EAAO,SAAU,GACf,mBAAS,IAAK,CAAE,eAAgB;AACjC,YAAM,aAAS,uBAAW,WAAW,UAAW;AAChD,aACC;AAAA,QAAC;AAAA;AAAA,UAEA,WAAU;AAAA,UAEV;AAAA;AAAA,cAAC;AAAA;AAAA,gBACA;AAAA,gBACA,WAAQ,gBAAI,SAAU;AAAA,gBACtB,aAAW;AAAA,gBACX;AAAA,gBACA;AAAA,gBACA;AAAA,gBAEA,sFACC;AAAA;AAAA,oBAAC;AAAA;AAAA,sBACA;AAAA;AAAA,kBACD;AAAA,kBACE,CAAE,UACH;AAAA,oBAAC;AAAA;AAAA,sBACA;AAAA;AAAA,kBAGD;AAAA,mBAEF;AAAA;AAAA,YACD;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACA,uBAAqB;AAAA,gBACrB,WAAU;AAAA,gBACV,UAAO,gBAAI,QAAS;AAAA,gBACpB,SAAQ;AAAA,gBACR,UAAW;AAAA,gBACX,wBAAsB;AAAA,gBACtB,SAAU,CACT,UACI;AACJ,wBAAM,gBAAgB;AACtB,sBACC,OAAO,WAAW,OAAO,UACxB;AACD,+BAAY,WAAW,EAAG;AAAA,kBAC3B;AAAA,gBACD;AAAA;AAAA,YACD;AAAA;AAAA;AAAA,QAzCM,WAAW;AAAA,MA0ClB;AAAA,IAEF,CAAE,GACH;AAAA,KAEG,YAAY,CAAE,UAAU,WAC3B;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,OAAQ;AAAA,QACR;AAAA,QACA;AAAA;AAAA,IACD;AAAA,KAEF;AAEF;AAyCe,SAAR,UAAoC;AAAA,EAC1C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe,CAAE,OAAQ;AAAA,EACzB;AAAA,EACA;AACD,GAA4B;AAC3B,QAAM,QAAQ,MAAM,SAAU,EAAE,MAAM,KAAK,CAAE;AAC7C,QAAM,kBAAc;AAAA,IACnB,CAAE,WAAY;AACb,UAAK,CAAE,OAAQ;AACd,eAAO;AAAA,MACR;AACA,YAAM,kBAAkB,MAAM,QAAS,KAAM,IAAI,QAAQ,CAAE,KAAM;AACjE,YAAM,EAAE,iBAAiB,IAAI,OAAQ,iBAAAC,KAAU;AAC/C,aAAO,iBAAkB,YAAY,cAAc;AAAA,QAClD,SAAS;AAAA,MACV,CAAE;AAAA,IACH;AAAA,IACA,CAAE,KAAM;AAAA,EACT;AACA,QAAM,EAAE,kBAAkB,QAAI,yBAAa,eAAAC,KAAa;AAExD,QAAM,CAAE,eAAe,gBAAiB,QAAI,yBAAmB;AAC/D,QAAM,CAAE,OAAO,QAAS,QAAI,yBAAsB,CAAC,CAAE;AACrD,QAAM,sBAAkB;AAAA,IACvB,CAAE,aACD,SAAU,MAAM,SAAU,EAAE,MAAM,MAAM,OAAO,SAAS,CAAE,CAAE;AAAA,IAC7D,CAAE,MAAM,OAAO,QAAS;AAAA,EACzB;AACA,QAAM,aAAa,CAAE,WAAoB;AACxC,UAAM,aAAa,MAAM,QAAS,KAAM,IAAI,QAAQ,CAAE,KAAM;AAC5D,UAAM,SAAS,WAAW,OAAQ,CAAE,OAAQ,OAAO,MAAO;AAC1D,oBAAiB,OAAO,SAAS,SAAS,MAAU;AAAA,EACrD;AACA,QAAM,kBAAc;AAAA,IACnB,CAAE,OAAe,mBAA6B;AAC7C,0CAAa;AAAA,QACZ,cAAc,cAAc,SAAS,eAAe;AAAA,QACpD,WAAW;AAAA,QACX,aAAc,eAAuB;AACpC,2BAAkB,cAAe;AACjC,gBAAM,EAAE,WAAW,cAAc,IAAI,cAAc;AAAA,YAClD,CAAE,aAAa,SAAU;AACxB,sBAAK,uBAAW,KAAK,GAAI,GAAI;AAC5B,4BAAY,UAAU,KAAM,KAAK,GAAI;AAAA,cACtC,OAAO;AACN,4BAAY,cAAc,KAAM,KAAK,EAAG;AAAA,cACzC;AACA,qBAAO;AAAA,YACR;AAAA,YACA;AAAA,cACC,WAAW,CAAC;AAAA,cACZ,eAAe,CAAC;AAAA,YACjB;AAAA,UACD;AACA,mBAAU,SAAU;AAEpB,cAAK,cAAc,WAAW,cAAc,QAAS;AACpD,6BAAkB,MAAU;AAAA,UAC7B;AACA,cAAK,CAAE,cAAc,QAAS;AAC7B;AAAA,UACD;AACA,cAAK,CAAE,UAAW;AACjB,4BAAiB,cAAe,CAAE,CAAE;AACpC;AAAA,UACD;AACA,cAAK,CAAE,OAAQ;AACd,4BAAiB,aAAc;AAC/B;AAAA,UACD;AACA,gBAAM,kBAAkB,MAAM,QAAS,KAAM,IAC1C,QACA,CAAE,KAAM;AACX,gBAAM,SAAS;AAAA,YACd,GAAK,iBACF,gBAAgB;AAAA,cAChB,CAAE,OAAa,OAAO;AAAA,YACtB,IACA;AAAA,YACH,GAAG;AAAA,UACJ;AACA,0BAAiB,MAAO;AAAA,QACzB;AAAA,QACA,QAAS,OAAe;AACvB,2BAAkB,MAAU;AAC5B,mBAAU,CAAC,CAAE;AACb,4BAAmB,MAAM,SAAS,EAAE,MAAM,WAAW,CAAE;AAAA,QACxD;AAAA,QACA,UAAU,CAAC,CAAE;AAAA,MACd,CAAE;AAAA,IACH;AAAA,IACA,CAAE,cAAc,OAAO,UAAU,mBAAmB,eAAgB;AAAA,EACrE;AACA,QAAM,iBACL,MAAM,gBACJ,eAAW,gBAAI,cAAe,QAAI,gBAAI,aAAc;AAEvD,QAAM,eAAgD,wBAAS,MAAM;AACpE,QAAK,CAAE,MAAM,QAAS;AACrB,aAAO;AAAA,IACR;AACA,UAAM,QAAsC;AAAA,MAC3C,GAAK,eAAe,CAAC;AAAA,IACtB;AACA,UAAM,YAAY,MAAM,IAAK,CAAE,SAAW;AAAA,MACzC,IAAI;AAAA,MACJ,YAAY;AAAA,MACZ,eAAW,8BAAkB,GAAI;AAAA,IAClC,EAAI;AACJ,UAAM,mBAAmB,MAAM;AAAA,MAC9B,CAAE,MAAO,EAAE,OAAO;AAAA,IACnB;AAGA,QAAK,qBAAqB,IAAK;AAC9B,aAAO;AAAA,QACN,GAAG,MAAM,MAAO,GAAG,gBAAiB;AAAA,QACpC,GAAG;AAAA,QACH,GAAG,MAAM,MAAO,mBAAmB,CAAE;AAAA,MACtC;AAAA,IACD;AACA,UAAM,KAAM,GAAG,SAAU;AACzB,WAAO;AAAA,EACR,GAAG,CAAE,aAAa,eAAe,KAAM,CAAE;AACzC,SACC,4CAAC,cAAS,WAAU,sBAAqB,iBAAgB,MAAM,IAC9D;AAAA,IAAC;AAAA;AAAA,MACA,UAAW,CAAE,kBAAwB;AACpC,YAAK,UAAW;AACf,gBAAM,SAAS,MAAM,QAAS,aAAc,IACzC,cAAc,IAAK,CAAE,MAAY,EAAE,EAAG,IACtC,CAAE,cAAc,EAAG;AACtB,0BAAiB,MAAO;AAAA,QACzB,OAAO;AACN,0BAAiB,cAAc,EAAG;AAAA,QACnC;AAAA,MACD;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAQ,MAAM;AAAA,MACd,QAAS,CAAE,EAAE,KAAK,MAAY;AAC7B,cAAM,uBAAuB,aAC1B,+BACA;AACH,eACC,6CAAC,kBAAAF,sBAAA,EAAO,SAAU,GACf;AAAA,gBAAM,UACL,sBACD,4CAAC,oCAAe,IAAG,UAChB,gBAAM,OACT,IAEA,4CAAC,8BAAY,aAAZ,EAAwB,IAAG,UACzB,gBAAM,OACT;AAAA,UAEF;AAAA,YAAC;AAAA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACA,aAAc,CAAC,CAAE,MAAM;AAAA;AAAA,UACxB;AAAA,UACE,MAAM,eACP,4CAAC,kBAAAG,oBAAA,EAAK,SAAQ,SACX,gBAAM,aACT;AAAA,WAEF;AAAA,MAEF;AAAA;AAAA,EACD,GACD;AAEF;",
+  "names": ["mediaUtilsPrivateApis", "Truncate", "clsx", "VStack", "coreStore", "noticesStore", "Text"]
 }

package/build/fields/author/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/fields/author/index.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport type { Field } from '@wordpress/dataviews';\nimport { __ } from '@wordpress/i18n';\nimport { resolveSelect } from '@wordpress/data';\nimport { store as coreDataStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport type { BasePostWithEmbeddedAuthor } from '../../types';\nimport AuthorView from './author-view';\n\ninterface Author {\n\tid: number;\n\tname: string;\n}\n\nconst authorField: Field< BasePostWithEmbeddedAuthor > = {\n\tlabel: __( 'Author' ),\n\tid: 'author',\n\ttype: 'integer',\n\tgetElements: async () => {\n\t\tconst authors: Author[] =\n\t\t\t( await resolveSelect( coreDataStore ).getEntityRecords(\n\t\t\t\t'root',\n\t\t\t\t'user',\n\t\t\t\t{\n\t\t\t\t\tper_page: -1,\n\t\t\t\t}\n\t\t\t) ) ?? [];\n\t\treturn authors.map( ( { id, name } ) => ( {\n\t\t\tvalue: id,\n\t\t\tlabel: name,\n\t\t} ) );\n\t},\n\tsetValue: ( { value } ) => ( { author: Number( value ) } ),\n\trender: AuthorView,\n\tsort: ( a, b, direction ) => {\n\t\tconst nameA = a._embedded?.author?.[ 0 ]?.name || '';\n\t\tconst nameB = b._embedded?.author?.[ 0 ]?.name || '';\n\n\t\treturn direction === 'asc'\n\t\t\t? nameA.localeCompare( nameB )\n\t\t\t: nameB.localeCompare( nameA );\n\t},\n\n\tfilterBy: {\n\t\toperators: [ 'isAny', 'isNone' ],\n\t},\n};\n\n/**\n * Author field for BasePost.\n */\nexport default authorField;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,kBAAmB;AACnB,kBAA8B;AAC9B,uBAAuC;AAMvC,yBAAuB;AAOvB,IAAM,cAAmD;AAAA,EACxD,WAAO,gBAAI,QAAS;AAAA,EACpB,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,aAAa,YAAY;AACxB,UAAM,UACH,UAAM,2BAAe,iBAAAA,KAAc,EAAE;AAAA,MACtC;AAAA,MACA;AAAA,MACA;AAAA,QACC,UAAU;AAAA,MACX;AAAA,IACD,KAAO,CAAC;AACT,WAAO,QAAQ,IAAK,CAAE,EAAE,IAAI,KAAK,OAAS;AAAA,MACzC,OAAO;AAAA,MACP,OAAO;AAAA,IACR,EAAI;AAAA,EACL;AAAA,EACA,UAAU,CAAE,EAAE,MAAM,OAAS,EAAE,QAAQ,OAAQ,KAAM,EAAE;AAAA,EACvD,QAAQ,mBAAAC;AAAA,EACR,MAAM,CAAE,GAAG,GAAG,cAAe;AAC5B,UAAM,QAAQ,EAAE,WAAW,SAAU,CAAE,GAAG,QAAQ;AAClD,UAAM,QAAQ,EAAE,WAAW,SAAU,CAAE,GAAG,QAAQ;AAElD,WAAO,cAAc,QAClB,MAAM,cAAe,KAAM,IAC3B,MAAM,cAAe,KAAM;AAAA,EAC/B;AAAA,EAEA,UAAU;AAAA,IACT,WAAW,CAAE,SAAS,QAAS;AAAA,EAChC;AACD;AAKA,IAAO,iBAAQ;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport type { Field } from '@wordpress/dataviews';\nimport { __ } from '@wordpress/i18n';\nimport { resolveSelect } from '@wordpress/data';\nimport { store as coreDataStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport type { BasePostWithEmbeddedAuthor } from '../../types';\nimport AuthorView from './author-view';\n\ninterface Author {\n\tid: number;\n\tname: string;\n}\n\nconst authorField: Field< BasePostWithEmbeddedAuthor > = {\n\tlabel: __( 'Author' ),\n\tid: 'author',\n\ttype: 'integer',\n\tgetElements: async () => {\n\t\tconst authors: Author[] =\n\t\t\t( await resolveSelect( coreDataStore ).getEntityRecords(\n\t\t\t\t'root',\n\t\t\t\t'user',\n\t\t\t\t{\n\t\t\t\t\tper_page: -1,\n\t\t\t\t}\n\t\t\t) ) ?? [];\n\t\treturn authors.map( ( { id, name } ) => ( {\n\t\t\tvalue: id,\n\t\t\tlabel: name,\n\t\t} ) );\n\t},\n\tsetValue: ( { value } ) => ( { author: Number( value ) } ),\n\trender: AuthorView,\n\tsort: ( a, b, direction ) => {\n\t\tconst nameA = a._embedded?.author?.[ 0 ]?.name || '';\n\t\tconst nameB = b._embedded?.author?.[ 0 ]?.name || '';\n\n\t\treturn direction === 'asc'\n\t\t\t? nameA.localeCompare( nameB )\n\t\t\t: nameB.localeCompare( nameA );\n\t},\n\tfilterBy: {\n\t\toperators: [ 'isAny', 'isNone' ],\n\t},\n};\n\n/**\n * Author field for BasePost.\n */\nexport default authorField;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,kBAAmB;AACnB,kBAA8B;AAC9B,uBAAuC;AAMvC,yBAAuB;AAOvB,IAAM,cAAmD;AAAA,EACxD,WAAO,gBAAI,QAAS;AAAA,EACpB,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,aAAa,YAAY;AACxB,UAAM,UACH,UAAM,2BAAe,iBAAAA,KAAc,EAAE;AAAA,MACtC;AAAA,MACA;AAAA,MACA;AAAA,QACC,UAAU;AAAA,MACX;AAAA,IACD,KAAO,CAAC;AACT,WAAO,QAAQ,IAAK,CAAE,EAAE,IAAI,KAAK,OAAS;AAAA,MACzC,OAAO;AAAA,MACP,OAAO;AAAA,IACR,EAAI;AAAA,EACL;AAAA,EACA,UAAU,CAAE,EAAE,MAAM,OAAS,EAAE,QAAQ,OAAQ,KAAM,EAAE;AAAA,EACvD,QAAQ,mBAAAC;AAAA,EACR,MAAM,CAAE,GAAG,GAAG,cAAe;AAC5B,UAAM,QAAQ,EAAE,WAAW,SAAU,CAAE,GAAG,QAAQ;AAClD,UAAM,QAAQ,EAAE,WAAW,SAAU,CAAE,GAAG,QAAQ;AAElD,WAAO,cAAc,QAClB,MAAM,cAAe,KAAM,IAC3B,MAAM,cAAe,KAAM;AAAA,EAC/B;AAAA,EACA,UAAU;AAAA,IACT,WAAW,CAAE,SAAS,QAAS;AAAA,EAChC;AACD;AAKA,IAAO,iBAAQ;",
   "names": ["coreDataStore", "AuthorView"]
 }