@wordpress/block-library 11.1.0 → 11.2.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.
- package/CHANGELOG.md +32 -0
- package/build/accordion-heading/block.json +1 -0
- package/build/archives/block.json +3 -0
- package/build/audio/edit.cjs +2 -1
- package/build/audio/edit.cjs.map +2 -2
- package/build/avatar/block.json +4 -0
- package/build/avatar/edit.cjs +31 -1
- package/build/avatar/edit.cjs.map +3 -3
- package/build/button/block.json +6 -0
- package/build/button/edit.cjs +9 -6
- package/build/button/edit.cjs.map +2 -2
- package/build/buttons/block.json +6 -1
- package/build/code/block.json +4 -0
- package/build/column/edit.cjs +5 -0
- package/build/column/edit.cjs.map +2 -2
- package/build/columns/block.json +4 -0
- package/build/columns/edit.cjs +21 -112
- package/build/columns/edit.cjs.map +3 -3
- package/build/comments/edit/placeholder.cjs +95 -87
- package/build/comments/edit/placeholder.cjs.map +2 -2
- package/build/comments-pagination/block.json +11 -0
- package/build/cover/block.json +2 -1
- package/build/cover/edit/index.cjs +26 -5
- package/build/cover/edit/index.cjs.map +2 -2
- package/build/cover/edit/inspector-controls.cjs +4 -1
- package/build/cover/edit/inspector-controls.cjs.map +2 -2
- package/build/cover/embed-video-utils.cjs +9 -8
- package/build/cover/embed-video-utils.cjs.map +2 -2
- package/build/cover/view.cjs +21 -0
- package/build/cover/view.cjs.map +7 -0
- package/build/details/block.json +3 -0
- package/build/embed/block.json +6 -1
- package/build/file/block.json +5 -0
- package/build/footnotes/block.json +4 -0
- package/build/gallery/block.json +13 -0
- package/build/gallery/dynamic-gallery.cjs +32 -93
- package/build/gallery/dynamic-gallery.cjs.map +3 -3
- package/build/gallery/edit.cjs +103 -40
- package/build/gallery/edit.cjs.map +2 -2
- package/build/gallery/order-controls.cjs +107 -0
- package/build/gallery/order-controls.cjs.map +7 -0
- package/build/gallery/order-images.cjs +92 -0
- package/build/gallery/order-images.cjs.map +7 -0
- package/build/gallery/order-options.cjs +62 -0
- package/build/gallery/order-options.cjs.map +7 -0
- package/build/gallery/use-dynamic-gallery.cjs +1 -7
- package/build/gallery/use-dynamic-gallery.cjs.map +2 -2
- package/build/gallery/use-get-media.cjs +2 -3
- package/build/gallery/use-get-media.cjs.map +2 -2
- package/build/group/edit.cjs +3 -3
- package/build/group/edit.cjs.map +2 -2
- package/build/heading/block.json +5 -0
- package/build/home-link/block.json +12 -0
- package/build/icon/components/custom-inserter/index.cjs +3 -1
- package/build/icon/components/custom-inserter/index.cjs.map +2 -2
- package/build/icon/edit.cjs +49 -5
- package/build/icon/edit.cjs.map +2 -2
- package/build/image/use-open-image-media-editor-modal.cjs +32 -28
- package/build/image/use-open-image-media-editor-modal.cjs.map +2 -2
- package/build/image/view.cjs +44 -50
- package/build/image/view.cjs.map +2 -2
- package/build/latest-comments/block.json +10 -0
- package/build/latest-posts/block.json +4 -0
- package/build/list/block.json +12 -1
- package/build/list-item/block.json +8 -1
- package/build/list-item/index.cjs +4 -0
- package/build/list-item/index.cjs.map +3 -3
- package/build/loginout/block.json +4 -0
- package/build/math/block.json +4 -0
- package/build/media-text/block.json +18 -0
- package/build/navigation-link/link-ui/index.cjs +33 -19
- package/build/navigation-link/link-ui/index.cjs.map +2 -2
- package/build/navigation-link/shared/index.cjs +5 -0
- package/build/navigation-link/shared/index.cjs.map +2 -2
- package/build/navigation-link/shared/use-block-suggestions.cjs +141 -0
- package/build/navigation-link/shared/use-block-suggestions.cjs.map +7 -0
- package/build/page-list/block.json +4 -0
- package/build/paragraph/block.json +1 -0
- package/build/post-author-biography/block.json +1 -0
- package/build/post-comments-form/block.json +5 -0
- package/build/post-content/block.json +2 -1
- package/build/post-excerpt/block.json +4 -0
- package/build/post-featured-image/block.json +1 -0
- package/build/post-featured-image/edit.cjs +1 -1
- package/build/post-featured-image/edit.cjs.map +2 -2
- package/build/post-terms/block.json +4 -0
- package/build/post-time-to-read/block.json +4 -0
- package/build/post-title/block.json +4 -0
- package/build/preformatted/block.json +4 -0
- package/build/pullquote/block.json +2 -1
- package/build/query-no-results/block.json +4 -0
- package/build/query-pagination/block.json +17 -0
- package/build/query-total/block.json +4 -0
- package/build/quote/block.json +2 -0
- package/build/read-more/block.json +5 -0
- package/build/rss/block.json +4 -0
- package/build/search/block.json +2 -1
- package/build/site-tagline/block.json +4 -0
- package/build/site-title/block.json +4 -0
- package/build/social-links/block.json +1 -0
- package/build/tab-list/block.json +4 -0
- package/build/tab-list/edit.cjs +3 -1
- package/build/tab-list/edit.cjs.map +3 -3
- package/build/tab-list/save.cjs +3 -1
- package/build/tab-list/save.cjs.map +3 -3
- package/build/tab-panels/block.json +3 -0
- package/build/tabs/block.json +3 -0
- package/build/term-count/block.json +5 -0
- package/build/term-description/block.json +4 -0
- package/build/term-name/block.json +6 -1
- package/build/term-template/block.json +4 -0
- package/build/utils/waveform-utils.cjs +2 -2
- package/build/utils/waveform-utils.cjs.map +2 -2
- package/build/verse/block.json +4 -0
- package/build/video/block.json +7 -1
- package/build/video/edit.cjs +10 -2
- package/build/video/edit.cjs.map +2 -2
- package/build-module/accordion-heading/block.json +1 -0
- package/build-module/archives/block.json +3 -0
- package/build-module/audio/edit.mjs +2 -1
- package/build-module/audio/edit.mjs.map +2 -2
- package/build-module/avatar/block.json +4 -0
- package/build-module/avatar/edit.mjs +33 -2
- package/build-module/avatar/edit.mjs.map +2 -2
- package/build-module/button/block.json +6 -0
- package/build-module/button/edit.mjs +11 -7
- package/build-module/button/edit.mjs.map +2 -2
- package/build-module/buttons/block.json +6 -1
- package/build-module/code/block.json +4 -0
- package/build-module/column/edit.mjs +5 -0
- package/build-module/column/edit.mjs.map +2 -2
- package/build-module/columns/block.json +4 -0
- package/build-module/columns/edit.mjs +22 -122
- package/build-module/columns/edit.mjs.map +2 -2
- package/build-module/comments/edit/placeholder.mjs +95 -87
- package/build-module/comments/edit/placeholder.mjs.map +2 -2
- package/build-module/comments-pagination/block.json +11 -0
- package/build-module/cover/block.json +2 -1
- package/build-module/cover/edit/index.mjs +32 -6
- package/build-module/cover/edit/index.mjs.map +2 -2
- package/build-module/cover/edit/inspector-controls.mjs +5 -2
- package/build-module/cover/edit/inspector-controls.mjs.map +2 -2
- package/build-module/cover/embed-video-utils.mjs +9 -8
- package/build-module/cover/embed-video-utils.mjs.map +2 -2
- package/build-module/cover/view.mjs +19 -0
- package/build-module/cover/view.mjs.map +7 -0
- package/build-module/details/block.json +3 -0
- package/build-module/embed/block.json +6 -1
- package/build-module/file/block.json +5 -0
- package/build-module/footnotes/block.json +4 -0
- package/build-module/gallery/block.json +13 -0
- package/build-module/gallery/dynamic-gallery.mjs +33 -97
- package/build-module/gallery/dynamic-gallery.mjs.map +2 -2
- package/build-module/gallery/edit.mjs +110 -42
- package/build-module/gallery/edit.mjs.map +2 -2
- package/build-module/gallery/order-controls.mjs +87 -0
- package/build-module/gallery/order-controls.mjs.map +7 -0
- package/build-module/gallery/order-images.mjs +66 -0
- package/build-module/gallery/order-images.mjs.map +7 -0
- package/build-module/gallery/order-options.mjs +33 -0
- package/build-module/gallery/order-options.mjs.map +7 -0
- package/build-module/gallery/use-dynamic-gallery.mjs +1 -7
- package/build-module/gallery/use-dynamic-gallery.mjs.map +2 -2
- package/build-module/gallery/use-get-media.mjs +2 -3
- package/build-module/gallery/use-get-media.mjs.map +2 -2
- package/build-module/group/edit.mjs +4 -4
- package/build-module/group/edit.mjs.map +2 -2
- package/build-module/heading/block.json +5 -0
- package/build-module/home-link/block.json +12 -0
- package/build-module/icon/components/custom-inserter/index.mjs +3 -1
- package/build-module/icon/components/custom-inserter/index.mjs.map +2 -2
- package/build-module/icon/edit.mjs +50 -6
- package/build-module/icon/edit.mjs.map +2 -2
- package/build-module/image/use-open-image-media-editor-modal.mjs +32 -28
- package/build-module/image/use-open-image-media-editor-modal.mjs.map +2 -2
- package/build-module/image/view.mjs +44 -50
- package/build-module/image/view.mjs.map +2 -2
- package/build-module/latest-comments/block.json +10 -0
- package/build-module/latest-posts/block.json +4 -0
- package/build-module/list/block.json +12 -1
- package/build-module/list-item/block.json +8 -1
- package/build-module/list-item/index.mjs +4 -0
- package/build-module/list-item/index.mjs.map +2 -2
- package/build-module/loginout/block.json +4 -0
- package/build-module/math/block.json +4 -0
- package/build-module/media-text/block.json +18 -0
- package/build-module/navigation-link/link-ui/index.mjs +39 -20
- package/build-module/navigation-link/link-ui/index.mjs.map +2 -2
- package/build-module/navigation-link/shared/index.mjs +6 -0
- package/build-module/navigation-link/shared/index.mjs.map +2 -2
- package/build-module/navigation-link/shared/use-block-suggestions.mjs +120 -0
- package/build-module/navigation-link/shared/use-block-suggestions.mjs.map +7 -0
- package/build-module/page-list/block.json +4 -0
- package/build-module/paragraph/block.json +1 -0
- package/build-module/post-author-biography/block.json +1 -0
- package/build-module/post-comments-form/block.json +5 -0
- package/build-module/post-content/block.json +2 -1
- package/build-module/post-excerpt/block.json +4 -0
- package/build-module/post-featured-image/block.json +1 -0
- package/build-module/post-featured-image/edit.mjs +1 -1
- package/build-module/post-featured-image/edit.mjs.map +2 -2
- package/build-module/post-terms/block.json +4 -0
- package/build-module/post-time-to-read/block.json +4 -0
- package/build-module/post-title/block.json +4 -0
- package/build-module/preformatted/block.json +4 -0
- package/build-module/pullquote/block.json +2 -1
- package/build-module/query-no-results/block.json +4 -0
- package/build-module/query-pagination/block.json +17 -0
- package/build-module/query-total/block.json +4 -0
- package/build-module/quote/block.json +2 -0
- package/build-module/read-more/block.json +5 -0
- package/build-module/rss/block.json +4 -0
- package/build-module/search/block.json +2 -1
- package/build-module/site-tagline/block.json +4 -0
- package/build-module/site-title/block.json +4 -0
- package/build-module/social-links/block.json +1 -0
- package/build-module/tab-list/block.json +4 -0
- package/build-module/tab-list/edit.mjs +4 -1
- package/build-module/tab-list/edit.mjs.map +2 -2
- package/build-module/tab-list/save.mjs +4 -1
- package/build-module/tab-list/save.mjs.map +2 -2
- package/build-module/tab-panels/block.json +3 -0
- package/build-module/tabs/block.json +3 -0
- package/build-module/term-count/block.json +5 -0
- package/build-module/term-description/block.json +4 -0
- package/build-module/term-name/block.json +6 -1
- package/build-module/term-template/block.json +4 -0
- package/build-module/utils/waveform-utils.mjs +1 -1
- package/build-module/utils/waveform-utils.mjs.map +1 -1
- package/build-module/verse/block.json +4 -0
- package/build-module/video/block.json +7 -1
- package/build-module/video/edit.mjs +10 -2
- package/build-module/video/edit.mjs.map +2 -2
- package/build-style/avatar/editor-rtl.css +4 -0
- package/build-style/avatar/editor.css +4 -0
- package/build-style/comments-pagination/style-rtl.css +3 -0
- package/build-style/comments-pagination/style.css +3 -0
- package/build-style/common-rtl.css +32 -1
- package/build-style/common.css +35 -2
- package/build-style/editor-rtl.css +11 -4
- package/build-style/editor.css +11 -4
- package/build-style/embed/style-rtl.css +4 -1
- package/build-style/embed/style.css +4 -1
- package/build-style/gallery/editor-rtl.css +1 -3
- package/build-style/gallery/editor.css +1 -3
- package/build-style/image/style-rtl.css +11 -2
- package/build-style/image/style.css +11 -2
- package/build-style/media-text/style-rtl.css +4 -1
- package/build-style/media-text/style.css +4 -1
- package/build-style/query-pagination/style-rtl.css +3 -0
- package/build-style/query-pagination/style.css +3 -0
- package/build-style/style-rtl.css +70 -9
- package/build-style/style.css +73 -10
- package/build-style/table/editor-rtl.css +6 -1
- package/build-style/table/editor.css +6 -1
- package/build-style/table/style-rtl.css +4 -2
- package/build-style/table/style.css +4 -2
- package/build-style/tag-cloud/style-rtl.css +1 -1
- package/build-style/tag-cloud/style.css +1 -1
- package/build-style/verse/style-rtl.css +8 -1
- package/build-style/verse/style.css +8 -1
- package/build-types/gallery/order-controls.d.ts +58 -0
- package/build-types/gallery/order-controls.d.ts.map +1 -0
- package/build-types/gallery/order-options.d.ts +67 -0
- package/build-types/gallery/order-options.d.ts.map +1 -0
- package/package.json +44 -41
- package/src/accordion-heading/README.md +1 -0
- package/src/accordion-heading/block.json +1 -0
- package/src/archives/README.md +2 -0
- package/src/archives/block.json +3 -0
- package/src/audio/edit.jsx +2 -1
- package/src/avatar/README.md +2 -0
- package/src/avatar/block.json +4 -0
- package/src/avatar/edit.jsx +48 -2
- package/src/avatar/editor.scss +4 -0
- package/src/avatar/index.php +5 -3
- package/src/breadcrumbs/index.php +1 -1
- package/src/button/README.md +4 -0
- package/src/button/block.json +6 -0
- package/src/button/edit.jsx +47 -52
- package/src/button/index.php +47 -0
- package/src/buttons/README.md +4 -0
- package/src/buttons/block.json +6 -1
- package/src/code/README.md +3 -0
- package/src/code/block.json +4 -0
- package/src/column/edit.jsx +6 -0
- package/src/columns/README.md +3 -0
- package/src/columns/block.json +4 -0
- package/src/columns/edit.jsx +1 -131
- package/src/comments/edit/placeholder.jsx +5 -1
- package/src/comments-pagination/README.md +4 -0
- package/src/comments-pagination/block.json +11 -0
- package/src/comments-pagination/style.scss +3 -0
- package/src/common.scss +38 -0
- package/src/cover/README.md +1 -0
- package/src/cover/block.json +2 -1
- package/src/cover/edit/index.jsx +38 -6
- package/src/cover/edit/inspector-controls.jsx +10 -1
- package/src/cover/embed-video-utils.js +18 -10
- package/src/cover/index.php +44 -15
- package/src/cover/test/edit.browser.test.js +182 -2
- package/src/cover/test/embed-video-utils.test.js +48 -0
- package/src/cover/view.js +22 -0
- package/src/details/README.md +2 -0
- package/src/details/block.json +3 -0
- package/src/embed/README.md +4 -0
- package/src/embed/block.json +6 -1
- package/src/embed/style.scss +7 -1
- package/src/file/README.md +4 -0
- package/src/file/block.json +5 -0
- package/src/footnotes/README.md +3 -0
- package/src/footnotes/block.json +4 -0
- package/src/gallery/README.md +13 -0
- package/src/gallery/block.json +13 -0
- package/src/gallery/dynamic-gallery.jsx +11 -91
- package/src/gallery/edit.jsx +146 -47
- package/src/gallery/editor.scss +5 -9
- package/src/gallery/order-controls.tsx +143 -0
- package/src/gallery/order-images.js +111 -0
- package/src/gallery/order-options.ts +75 -0
- package/src/gallery/test/edit.jsdom.test.js +87 -10
- package/src/gallery/test/order-images.js +162 -0
- package/src/gallery/use-dynamic-gallery.js +1 -9
- package/src/gallery/use-get-media.js +7 -2
- package/src/group/edit.jsx +5 -5
- package/src/heading/README.md +4 -0
- package/src/heading/block.json +5 -0
- package/src/home-link/README.md +6 -0
- package/src/home-link/block.json +12 -0
- package/src/icon/components/custom-inserter/index.jsx +5 -1
- package/src/icon/edit.jsx +68 -7
- package/src/icon/index.php +1 -1
- package/src/image/index.php +3 -4
- package/src/image/style.scss +14 -2
- package/src/image/test/use-open-image-media-editor-modal.jsdom.test.js +122 -60
- package/src/image/use-open-image-media-editor-modal.js +37 -41
- package/src/image/view.js +64 -68
- package/src/latest-comments/README.md +3 -0
- package/src/latest-comments/block.json +10 -0
- package/src/latest-posts/README.md +3 -0
- package/src/latest-posts/block.json +4 -0
- package/src/list/README.md +6 -0
- package/src/list/block.json +12 -1
- package/src/list-item/README.md +6 -0
- package/src/list-item/block.json +8 -1
- package/src/list-item/index.js +5 -0
- package/src/loginout/README.md +3 -0
- package/src/loginout/block.json +4 -0
- package/src/math/README.md +3 -0
- package/src/math/block.json +4 -0
- package/src/media-text/README.md +17 -0
- package/src/media-text/block.json +18 -0
- package/src/media-text/style.scss +5 -1
- package/src/navigation/test/use-navigation-menu.jsdom.test.js +1 -1
- package/src/navigation-link/README.md +1 -1
- package/src/navigation-link/link-ui/index.jsx +60 -27
- package/src/navigation-link/link-ui/test/get-suggestions-query.jsdom.test.js +67 -0
- package/src/navigation-link/shared/index.js +4 -0
- package/src/navigation-link/shared/test/use-block-suggestions.jsdom.test.js +158 -0
- package/src/navigation-link/shared/test/use-entity-binding.jsdom.test.js +1 -7
- package/src/navigation-link/shared/use-block-suggestions.js +192 -0
- package/src/page-list/README.md +3 -0
- package/src/page-list/block.json +4 -0
- package/src/paragraph/README.md +1 -0
- package/src/paragraph/block.json +1 -0
- package/src/playlist/test/edit-component.jsdom.test.jsx +11 -11
- package/src/playlist-track/test/edit.jsdom.test.jsx +3 -3
- package/src/post-author-biography/README.md +1 -0
- package/src/post-author-biography/block.json +1 -0
- package/src/post-comments-form/README.md +3 -0
- package/src/post-comments-form/block.json +5 -0
- package/src/post-content/README.md +1 -0
- package/src/post-content/block.json +2 -1
- package/src/post-excerpt/README.md +3 -0
- package/src/post-excerpt/block.json +4 -0
- package/src/post-featured-image/block.json +1 -0
- package/src/post-featured-image/edit.jsx +2 -2
- package/src/post-terms/README.md +3 -0
- package/src/post-terms/block.json +4 -0
- package/src/post-time-to-read/README.md +3 -0
- package/src/post-time-to-read/block.json +4 -0
- package/src/post-title/README.md +3 -0
- package/src/post-title/block.json +4 -0
- package/src/preformatted/README.md +3 -0
- package/src/preformatted/block.json +4 -0
- package/src/pullquote/README.md +1 -0
- package/src/pullquote/block.json +2 -1
- package/src/query-no-results/README.md +3 -0
- package/src/query-no-results/block.json +4 -0
- package/src/query-pagination/README.md +4 -0
- package/src/query-pagination/block.json +17 -0
- package/src/query-pagination/style.scss +3 -0
- package/src/query-total/README.md +3 -0
- package/src/query-total/block.json +4 -0
- package/src/quote/README.md +2 -0
- package/src/quote/block.json +2 -0
- package/src/read-more/README.md +3 -0
- package/src/read-more/block.json +5 -0
- package/src/rss/README.md +3 -0
- package/src/rss/block.json +4 -0
- package/src/search/README.md +1 -0
- package/src/search/block.json +2 -1
- package/src/site-tagline/README.md +3 -0
- package/src/site-tagline/block.json +4 -0
- package/src/site-title/README.md +3 -0
- package/src/site-title/block.json +4 -0
- package/src/social-links/README.md +1 -0
- package/src/social-links/block.json +1 -0
- package/src/tab-list/README.md +2 -0
- package/src/tab-list/block.json +4 -0
- package/src/tab-list/edit.jsx +3 -0
- package/src/tab-list/save.jsx +3 -0
- package/src/tab-panels/README.md +2 -0
- package/src/tab-panels/block.json +3 -0
- package/src/table/editor.scss +8 -2
- package/src/table/style.scss +4 -4
- package/src/tabs/README.md +2 -0
- package/src/tabs/block.json +3 -0
- package/src/tag-cloud/style.scss +1 -1
- package/src/template-part/index.php +16 -3
- package/src/term-count/README.md +4 -0
- package/src/term-count/block.json +5 -0
- package/src/term-description/README.md +3 -0
- package/src/term-description/block.json +4 -0
- package/src/term-name/README.md +4 -0
- package/src/term-name/block.json +6 -1
- package/src/term-template/README.md +3 -0
- package/src/term-template/block.json +4 -0
- package/src/utils/test/waveform-player-auto-init.jsdom.test.js +25 -0
- package/src/utils/test/waveform-player-dependency.jsdom.test.js +7 -60
- package/src/utils/test/waveform-utils.browser.test.js +3 -15
- package/src/utils/waveform-utils.js +1 -1
- package/src/verse/README.md +4 -0
- package/src/verse/block.json +4 -0
- package/src/verse/style.scss +11 -2
- package/src/video/README.md +4 -0
- package/src/video/block.json +7 -1
- package/src/video/edit.jsx +13 -2
- package/build/columns/utils.cjs +0 -112
- package/build/columns/utils.cjs.map +0 -7
- package/build-module/columns/utils.mjs +0 -78
- package/build-module/columns/utils.mjs.map +0 -7
- package/src/columns/test/utils.js +0 -331
- package/src/columns/utils.js +0 -176
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/cover/edit/inspector-controls.jsx"],
|
|
4
|
-
"sourcesContent": ["import { useMemo } from '@wordpress/element';\nimport {\n\tFocalPointPicker,\n\tRangeControl,\n\tTextareaControl as WCTextareaControl,\n\tToggleControl,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue,\n} from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport {\n\tInspectorControls,\n\tuseSettings,\n\tstore as blockEditorStore,\n\t__experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown,\n\t__experimentalUseGradient,\n\t__experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { getFilename } from '@wordpress/url';\nimport { Link } from '@wordpress/ui';\nimport {\n\tALLOWED_MEDIA_TYPES,\n\tCOVER_MIN_HEIGHT,\n\tmediaPosition,\n} from '../shared';\nimport { unlock } from '../../lock-unlock';\nimport { useToolsPanelDropdownMenuProps } from '../../utils/hooks';\nimport {\n\tgetActiveDimensionValue,\n\tgetDimensionResetAttributes,\n\tgetDimensionUpdateAttributes,\n\tgetStyleStateKey,\n} from '../../utils/style-state';\nimport { DEFAULT_MEDIA_SIZE_SLUG } from '../constants';\nimport PosterImage from '../../utils/poster-image';\nimport { MediaControl } from '../../utils/media-control';\n\nconst { cleanEmptyObject, ResolutionTool, HTMLElementControl } = unlock(\n\tblockEditorPrivateApis\n);\n\nfunction CoverHeightInput( {\n\tonChange,\n\tonUnitChange,\n\tunit = 'px',\n\tvalue = '',\n} ) {\n\tconst instanceId = useInstanceId( UnitControl );\n\tconst inputId = `block-cover-height-input-${ instanceId }`;\n\tconst isPx = unit === 'px';\n\n\tconst [ availableUnits ] = useSettings( 'spacing.units' );\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: availableUnits || [ 'px', 'em', 'rem', 'vw', 'vh' ],\n\t\tdefaultValues: { px: 430, '%': 20, em: 20, rem: 20, vw: 20, vh: 50 },\n\t} );\n\n\tconst handleOnChange = ( unprocessedValue ) => {\n\t\tconst inputValue =\n\t\t\tunprocessedValue !== ''\n\t\t\t\t? parseFloat( unprocessedValue )\n\t\t\t\t: undefined;\n\n\t\tif ( isNaN( inputValue ) && inputValue !== undefined ) {\n\t\t\treturn;\n\t\t}\n\t\tonChange( inputValue );\n\t};\n\n\tconst computedValue = useMemo( () => {\n\t\tconst [ parsedQuantity ] = parseQuantityAndUnitFromRawValue( value );\n\t\treturn [ parsedQuantity, unit ].join( '' );\n\t}, [ unit, value ] );\n\n\tconst min = isPx ? COVER_MIN_HEIGHT : 0;\n\n\treturn (\n\t\t<UnitControl\n\t\t\tlabel={ __( 'Minimum height' ) }\n\t\t\tid={ inputId }\n\t\t\tisResetValueOnUnitChange\n\t\t\tmin={ min }\n\t\t\tonChange={ handleOnChange }\n\t\t\tonUnitChange={ onUnitChange }\n\t\t\tunits={ units }\n\t\t\tvalue={ computedValue }\n\t\t/>\n\t);\n}\nexport default function CoverInspectorControls( {\n\tattributes,\n\tsetAttributes,\n\tclientId,\n\tsetOverlayColor,\n\tcoverRef,\n\tcurrentSettings,\n\tonSelectMedia,\n\tonUploadError,\n\ttoggleUseFeaturedImage,\n\tupdateDimRatio,\n\tonClearMedia,\n\tfeaturedImage,\n\tisSelected,\n} ) {\n\tconst {\n\t\tuseFeaturedImage,\n\t\tid,\n\t\tdimRatio,\n\t\tfocalPoint,\n\t\thasParallax,\n\t\tisRepeated,\n\t\tminHeight,\n\t\tminHeightUnit,\n\t\talt,\n\t\ttagName,\n\t\tposter,\n\t} = attributes;\n\tconst {\n\t\tisVideoBackground,\n\t\tisImageBackground,\n\t\tmediaElement,\n\t\turl,\n\t\toverlayColor,\n\t} = currentSettings;\n\n\tconst sizeSlug = attributes.sizeSlug || DEFAULT_MEDIA_SIZE_SLUG;\n\n\tconst { gradientValue, setGradient } = __experimentalUseGradient();\n\tconst { imageSizes, selectedStyleState, hasSelectedStyleState } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetSettings,\n\t\t\t\tgetSelectedBlockStyleState,\n\t\t\t\thasSelectedBlockStyleState,\n\t\t\t} = select( blockEditorStore );\n\n\t\t\treturn {\n\t\t\t\timageSizes: getSettings()?.imageSizes,\n\t\t\t\tselectedStyleState: getSelectedBlockStyleState( clientId ),\n\t\t\t\thasSelectedStyleState: hasSelectedBlockStyleState( clientId ),\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\tconst selectedStyleStateKey = getStyleStateKey( selectedStyleState );\n\tconst stateMinHeight = getActiveDimensionValue( {\n\t\tattributes,\n\t\tselectedState: selectedStyleState,\n\t\thasSelectedStyleState,\n\t\tattributeKey: 'minHeight',\n\t\tstyleKey: 'minHeight',\n\t\trootValue: undefined,\n\t} );\n\tconst [ stateMinHeightValue, stateMinHeightUnit ] =\n\t\tparseQuantityAndUnitFromRawValue( stateMinHeight || '' );\n\tconst activeMinHeight = hasSelectedStyleState\n\t\t? stateMinHeightValue\n\t\t: minHeight;\n\tconst activeMinHeightUnit = hasSelectedStyleState\n\t\t? stateMinHeightUnit || minHeightUnit\n\t\t: minHeightUnit;\n\tconst activeAspectRatio = getActiveDimensionValue( {\n\t\tattributes,\n\t\tselectedState: selectedStyleState,\n\t\thasSelectedStyleState,\n\t\tattributeKey: 'aspectRatio',\n\t\trootValue: attributes?.style?.dimensions?.aspectRatio,\n\t} );\n\n\tconst image = useSelect(\n\t\t( select ) =>\n\t\t\tid && isImageBackground\n\t\t\t\t? select( coreStore ).getEntityRecord(\n\t\t\t\t\t\t'postType',\n\t\t\t\t\t\t'attachment',\n\t\t\t\t\t\tid,\n\t\t\t\t\t\t{ context: 'view' }\n\t\t\t\t\t)\n\t\t\t\t: null,\n\t\t[ id, isImageBackground ]\n\t);\n\n\tconst currentBackgroundImage = useFeaturedImage ? featuredImage : image;\n\n\tfunction updateImage( newSizeSlug ) {\n\t\tconst newUrl =\n\t\t\tcurrentBackgroundImage?.media_details?.sizes?.[ newSizeSlug ]\n\t\t\t\t?.source_url;\n\t\tif ( ! newUrl ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tsetAttributes( {\n\t\t\turl: newUrl,\n\t\t\tsizeSlug: newSizeSlug,\n\t\t} );\n\t}\n\n\tconst imageSizeOptions = imageSizes\n\t\t?.filter(\n\t\t\t( { slug } ) =>\n\t\t\t\tcurrentBackgroundImage?.media_details?.sizes?.[ slug ]\n\t\t\t\t\t?.source_url\n\t\t)\n\t\t?.map( ( { name, slug } ) => ( { value: slug, label: name } ) );\n\n\tconst toggleParallax = () => {\n\t\tsetAttributes( {\n\t\t\thasParallax: ! hasParallax,\n\t\t\t...( ! hasParallax ? { focalPoint: undefined } : {} ),\n\t\t} );\n\t};\n\n\tconst toggleIsRepeated = () => {\n\t\tsetAttributes( {\n\t\t\tisRepeated: ! isRepeated,\n\t\t} );\n\t};\n\n\tconst showFocalPointPicker = isVideoBackground || isImageBackground;\n\n\tconst imperativeFocalPointPreview = ( value ) => {\n\t\tconst [ styleOfRef, property ] = mediaElement.current\n\t\t\t? [ mediaElement.current.style, 'objectPosition' ]\n\t\t\t: [ coverRef.current.style, 'backgroundPosition' ];\n\t\tstyleOfRef[ property ] = mediaPosition( value );\n\t};\n\n\tconst colorGradientSettings = useMultipleOriginColorsAndGradients();\n\n\tconst showOverlayControls =\n\t\tcolorGradientSettings.hasColorsOrGradients && ! hasSelectedStyleState;\n\n\tconst setMinHeightAttributes = ( nextMinHeight, nextUnit ) => {\n\t\tif ( hasSelectedStyleState ) {\n\t\t\tsetAttributes(\n\t\t\t\tgetDimensionUpdateAttributes( {\n\t\t\t\t\tstyle: attributes.style,\n\t\t\t\t\tselectedState: selectedStyleState,\n\t\t\t\t\thasSelectedStyleState,\n\t\t\t\t\tnextDimensions: {\n\t\t\t\t\t\tminHeight:\n\t\t\t\t\t\t\tnextMinHeight === undefined\n\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t: `${ nextMinHeight }${\n\t\t\t\t\t\t\t\t\t\tnextUnit || activeMinHeightUnit || 'px'\n\t\t\t\t\t\t\t\t\t}`,\n\t\t\t\t\t\taspectRatio: undefined,\n\t\t\t\t\t},\n\t\t\t\t} )\n\t\t\t);\n\t\t\treturn;\n\t\t}\n\n\t\tsetAttributes( {\n\t\t\tminHeight: nextMinHeight,\n\t\t\tstyle: cleanEmptyObject( {\n\t\t\t\t...attributes?.style,\n\t\t\t\tdimensions: {\n\t\t\t\t\t...attributes?.style?.dimensions,\n\t\t\t\t\taspectRatio: undefined, // Reset aspect ratio when minHeight is set.\n\t\t\t\t},\n\t\t\t} ),\n\t\t} );\n\t};\n\n\tconst getResetMinHeightAttributes = ( attrs = attributes ) => {\n\t\treturn getDimensionResetAttributes( {\n\t\t\tstyle: attrs.style,\n\t\t\tselectedState: selectedStyleState,\n\t\t\thasSelectedStyleState,\n\t\t\tkeys: [ 'minHeight' ],\n\t\t\tdefaultAttributes: {\n\t\t\t\tminHeight: undefined,\n\t\t\t\tminHeightUnit: undefined,\n\t\t\t},\n\t\t} );\n\t};\n\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\n\t/*\n\t * Rendered whether or not media has been set, so that a cover in its setup\n\t * state can be given media from the inspector as well as from the toolbar.\n\t * The settings below stay behind their own condition, having nothing to\n\t * configure until there is media to configure.\n\t */\n\tconst mediaInspectorPanel = isSelected ? (\n\t\t<InspectorControls group=\"content\">\n\t\t\t<ToolsPanel\n\t\t\t\tlabel={ __( 'Media' ) }\n\t\t\t\tresetAll={ onClearMedia }\n\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t>\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tlabel={ __( 'Media' ) }\n\t\t\t\t\thasValue={ () => !! url || !! useFeaturedImage }\n\t\t\t\t\tonDeselect={ onClearMedia }\n\t\t\t\t\tisShownByDefault\n\t\t\t\t>\n\t\t\t\t\t<MediaControl\n\t\t\t\t\t\tmediaId={ id }\n\t\t\t\t\t\tmediaUrl={ url }\n\t\t\t\t\t\tfilename={\n\t\t\t\t\t\t\timage?.media_details?.sizes?.full?.file ||\n\t\t\t\t\t\t\timage?.slug ||\n\t\t\t\t\t\t\tgetFilename( url )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\t\tonSelect={ onSelectMedia }\n\t\t\t\t\t\tonError={ onUploadError }\n\t\t\t\t\t\tonReset={ onClearMedia }\n\t\t\t\t\t\tuseFeaturedImage={ useFeaturedImage }\n\t\t\t\t\t\tonToggleFeaturedImage={ toggleUseFeaturedImage }\n\t\t\t\t\t\temptyLabel={ __( 'Add media' ) }\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t</ToolsPanel>\n\t\t</InspectorControls>\n\t) : null;\n\n\treturn (\n\t\t<>\n\t\t\t{ mediaInspectorPanel }\n\t\t\t{ ( !! url || useFeaturedImage ) && (\n\t\t\t\t<InspectorControls>\n\t\t\t\t\t<ToolsPanel\n\t\t\t\t\t\tlabel={ __( 'Settings' ) }\n\t\t\t\t\t\tresetAll={ () => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\thasParallax: false,\n\t\t\t\t\t\t\t\tfocalPoint: undefined,\n\t\t\t\t\t\t\t\tisRepeated: false,\n\t\t\t\t\t\t\t\talt: '',\n\t\t\t\t\t\t\t\tposter: undefined,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tupdateImage( DEFAULT_MEDIA_SIZE_SLUG );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ isImageBackground && (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Fixed background' ) }\n\t\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t\t\thasValue={ () => !! hasParallax }\n\t\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\t\thasParallax: false,\n\t\t\t\t\t\t\t\t\t\t\tfocalPoint: undefined,\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\t\t<ToggleControl\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Fixed background' ) }\n\t\t\t\t\t\t\t\t\t\tchecked={ !! hasParallax }\n\t\t\t\t\t\t\t\t\t\tonChange={ toggleParallax }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</ToolsPanelItem>\n\n\t\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Repeated background' ) }\n\t\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t\t\thasValue={ () => isRepeated }\n\t\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\t\tisRepeated: false,\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\t\t<ToggleControl\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Repeated background' ) }\n\t\t\t\t\t\t\t\t\t\tchecked={ isRepeated }\n\t\t\t\t\t\t\t\t\t\tonChange={ toggleIsRepeated }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ showFocalPointPicker && (\n\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\tlabel={ __( 'Focal point' ) }\n\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t\thasValue={ () => !! focalPoint }\n\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\tfocalPoint: undefined,\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>\n\t\t\t\t\t\t\t\t<FocalPointPicker\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Focal point' ) }\n\t\t\t\t\t\t\t\t\turl={ url }\n\t\t\t\t\t\t\t\t\tvalue={ focalPoint }\n\t\t\t\t\t\t\t\t\tonDragStart={ imperativeFocalPointPreview }\n\t\t\t\t\t\t\t\t\tonDrag={ imperativeFocalPointPreview }\n\t\t\t\t\t\t\t\t\tonChange={ ( newFocalPoint ) =>\n\t\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\t\tfocalPoint: newFocalPoint,\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</ToolsPanelItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ isVideoBackground && (\n\t\t\t\t\t\t\t<PosterImage\n\t\t\t\t\t\t\t\tposter={ poster }\n\t\t\t\t\t\t\t\tonChange={ ( posterImage ) =>\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\tposter: posterImage?.url,\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/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ ! useFeaturedImage && url && ! isVideoBackground && (\n\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\tlabel={ __( 'Alternative text' ) }\n\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t\thasValue={ () => !! alt }\n\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\tsetAttributes( { alt: '' } )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<WCTextareaControl\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Alternative text' ) }\n\t\t\t\t\t\t\t\t\tvalue={ alt }\n\t\t\t\t\t\t\t\t\tonChange={ ( newAlt ) =>\n\t\t\t\t\t\t\t\t\t\tsetAttributes( { alt: newAlt } )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\thelp={\n\t\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t\t<Link\n\t\t\t\t\t\t\t\t\t\t\t\topenInNewTab\n\t\t\t\t\t\t\t\t\t\t\t\thref={\n\t\t\t\t\t\t\t\t\t\t\t\t\t// translators: Localized tutorial, if one exists. W3C Web Accessibility Initiative link has list of existing translations.\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\t\t'https://www.w3.org/WAI/tutorials/images/decision-tree/'\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\t\t{ __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t'Describe the purpose of the image.'\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</Link>\n\t\t\t\t\t\t\t\t\t\t\t<br />\n\t\t\t\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t\t\t\t'Leave empty if decorative.'\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/>\n\t\t\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ !! imageSizeOptions?.length && (\n\t\t\t\t\t\t\t<ResolutionTool\n\t\t\t\t\t\t\t\tvalue={ sizeSlug }\n\t\t\t\t\t\t\t\tonChange={ updateImage }\n\t\t\t\t\t\t\t\toptions={ imageSizeOptions }\n\t\t\t\t\t\t\t\tdefaultValue={ DEFAULT_MEDIA_SIZE_SLUG }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</ToolsPanel>\n\t\t\t\t</InspectorControls>\n\t\t\t) }\n\t\t\t{ showOverlayControls && (\n\t\t\t\t<InspectorControls group=\"color\">\n\t\t\t\t\t<ColorGradientSettingsDropdown\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\tsettings={ [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tcolorValue: overlayColor.color,\n\t\t\t\t\t\t\t\tgradientValue,\n\t\t\t\t\t\t\t\tlabel: __( 'Overlay' ),\n\t\t\t\t\t\t\t\tonColorChange: setOverlayColor,\n\t\t\t\t\t\t\t\tonGradientChange: setGradient,\n\t\t\t\t\t\t\t\tisShownByDefault: true,\n\t\t\t\t\t\t\t\tresetAllFilter: () => ( {\n\t\t\t\t\t\t\t\t\toverlayColor: undefined,\n\t\t\t\t\t\t\t\t\tcustomOverlayColor: undefined,\n\t\t\t\t\t\t\t\t\tgradient: undefined,\n\t\t\t\t\t\t\t\t\tcustomGradient: undefined,\n\t\t\t\t\t\t\t\t} ),\n\t\t\t\t\t\t\t\tclearable: true,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t] }\n\t\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t\t\t{ ...colorGradientSettings }\n\t\t\t\t\t/>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\thasValue={ () => {\n\t\t\t\t\t\t\t// If there's a media background the dimRatio will be\n\t\t\t\t\t\t\t// defaulted to 50 whereas it will be 100 for colors.\n\t\t\t\t\t\t\treturn dimRatio === undefined\n\t\t\t\t\t\t\t\t? false\n\t\t\t\t\t\t\t\t: dimRatio !== ( url ? 50 : 100 );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tlabel={ __( 'Overlay opacity' ) }\n\t\t\t\t\t\tonDeselect={ () => updateDimRatio( url ? 50 : 100 ) }\n\t\t\t\t\t\tresetAllFilter={ () => ( {\n\t\t\t\t\t\t\tdimRatio: url ? 50 : 100,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t\t>\n\t\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t\tlabel={ __( 'Overlay opacity' ) }\n\t\t\t\t\t\t\tvalue={ dimRatio }\n\t\t\t\t\t\t\tonChange={ ( newDimRatio ) =>\n\t\t\t\t\t\t\t\tupdateDimRatio( newDimRatio )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={ 100 }\n\t\t\t\t\t\t\tstep={ 10 }\n\t\t\t\t\t\t\trequired\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t</InspectorControls>\n\t\t\t) }\n\t\t\t<InspectorControls group=\"dimensions\">\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tkey={ selectedStyleStateKey }\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\thasValue={ () => !! activeMinHeight }\n\t\t\t\t\tlabel={ __( 'Minimum height' ) }\n\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\tsetAttributes( getResetMinHeightAttributes() )\n\t\t\t\t\t}\n\t\t\t\t\tresetAllFilter={ getResetMinHeightAttributes }\n\t\t\t\t\tisShownByDefault\n\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t>\n\t\t\t\t\t<CoverHeightInput\n\t\t\t\t\t\tvalue={ activeAspectRatio ? '' : activeMinHeight }\n\t\t\t\t\t\tunit={ activeMinHeightUnit }\n\t\t\t\t\t\tonChange={ ( newMinHeight ) =>\n\t\t\t\t\t\t\tsetMinHeightAttributes( newMinHeight )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonUnitChange={ ( nextUnit ) => {\n\t\t\t\t\t\t\tif ( hasSelectedStyleState ) {\n\t\t\t\t\t\t\t\tif ( activeMinHeight !== undefined ) {\n\t\t\t\t\t\t\t\t\tsetMinHeightAttributes(\n\t\t\t\t\t\t\t\t\t\tactiveMinHeight,\n\t\t\t\t\t\t\t\t\t\tnextUnit\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\treturn;\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tminHeightUnit: nextUnit,\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</ToolsPanelItem>\n\t\t\t</InspectorControls>\n\t\t\t<InspectorControls group=\"advanced\">\n\t\t\t\t<HTMLElementControl\n\t\t\t\t\ttagName={ tagName }\n\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\tsetAttributes( { tagName: value } )\n\t\t\t\t\t}\n\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\toptions={ [\n\t\t\t\t\t\t{ label: __( 'Default (<div>)' ), value: 'div' },\n\t\t\t\t\t\t{ label: '<header>', value: 'header' },\n\t\t\t\t\t\t{ label: '<main>', value: 'main' },\n\t\t\t\t\t\t{ label: '<section>', value: 'section' },\n\t\t\t\t\t\t{ label: '<article>', value: 'article' },\n\t\t\t\t\t\t{ label: '<aside>', value: 'aside' },\n\t\t\t\t\t\t{ label: '<footer>', value: 'footer' },\n\t\t\t\t\t] }\n\t\t\t\t/>\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n}\n"],
|
|
5
|
-
"mappings": ";AAAA,SAAS,eAAe;AACxB;AAAA,EACC;AAAA,EACA;AAAA,EACA,mBAAmB;AAAA,EACnB;AAAA,EACA,gCAAgC;AAAA,EAChC,4BAA4B;AAAA,EAC5B,gCAAgC;AAAA,EAChC,6BAA6B;AAAA,EAC7B,kDAAkD;AAAA,OAC5C;AACP,SAAS,
|
|
4
|
+
"sourcesContent": ["import { useMemo } from '@wordpress/element';\nimport {\n\tFocalPointPicker,\n\tRangeControl,\n\tTextareaControl as WCTextareaControl,\n\tToggleControl,\n\t__experimentalUseCustomUnits as useCustomUnits,\n\t__experimentalToolsPanel as ToolsPanel,\n\t__experimentalToolsPanelItem as ToolsPanelItem,\n\t__experimentalUnitControl as UnitControl,\n\t__experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue,\n} from '@wordpress/components';\nimport { useInstanceId, useReducedMotion } from '@wordpress/compose';\nimport {\n\tInspectorControls,\n\tuseSettings,\n\tstore as blockEditorStore,\n\t__experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown,\n\t__experimentalUseGradient,\n\t__experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { getFilename } from '@wordpress/url';\nimport { Link } from '@wordpress/ui';\nimport {\n\tALLOWED_MEDIA_TYPES,\n\tCOVER_MIN_HEIGHT,\n\tmediaPosition,\n} from '../shared';\nimport { unlock } from '../../lock-unlock';\nimport { useToolsPanelDropdownMenuProps } from '../../utils/hooks';\nimport {\n\tgetActiveDimensionValue,\n\tgetDimensionResetAttributes,\n\tgetDimensionUpdateAttributes,\n\tgetStyleStateKey,\n} from '../../utils/style-state';\nimport { DEFAULT_MEDIA_SIZE_SLUG } from '../constants';\nimport PosterImage from '../../utils/poster-image';\nimport { MediaControl } from '../../utils/media-control';\n\nconst { cleanEmptyObject, ResolutionTool, HTMLElementControl } = unlock(\n\tblockEditorPrivateApis\n);\n\nfunction CoverHeightInput( {\n\tonChange,\n\tonUnitChange,\n\tunit = 'px',\n\tvalue = '',\n} ) {\n\tconst instanceId = useInstanceId( UnitControl );\n\tconst inputId = `block-cover-height-input-${ instanceId }`;\n\tconst isPx = unit === 'px';\n\n\tconst [ availableUnits ] = useSettings( 'spacing.units' );\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: availableUnits || [ 'px', 'em', 'rem', 'vw', 'vh' ],\n\t\tdefaultValues: { px: 430, '%': 20, em: 20, rem: 20, vw: 20, vh: 50 },\n\t} );\n\n\tconst handleOnChange = ( unprocessedValue ) => {\n\t\tconst inputValue =\n\t\t\tunprocessedValue !== ''\n\t\t\t\t? parseFloat( unprocessedValue )\n\t\t\t\t: undefined;\n\n\t\tif ( isNaN( inputValue ) && inputValue !== undefined ) {\n\t\t\treturn;\n\t\t}\n\t\tonChange( inputValue );\n\t};\n\n\tconst computedValue = useMemo( () => {\n\t\tconst [ parsedQuantity ] = parseQuantityAndUnitFromRawValue( value );\n\t\treturn [ parsedQuantity, unit ].join( '' );\n\t}, [ unit, value ] );\n\n\tconst min = isPx ? COVER_MIN_HEIGHT : 0;\n\n\treturn (\n\t\t<UnitControl\n\t\t\tlabel={ __( 'Minimum height' ) }\n\t\t\tid={ inputId }\n\t\t\tisResetValueOnUnitChange\n\t\t\tmin={ min }\n\t\t\tonChange={ handleOnChange }\n\t\t\tonUnitChange={ onUnitChange }\n\t\t\tunits={ units }\n\t\t\tvalue={ computedValue }\n\t\t/>\n\t);\n}\nexport default function CoverInspectorControls( {\n\tattributes,\n\tsetAttributes,\n\tclientId,\n\tsetOverlayColor,\n\tcoverRef,\n\tcurrentSettings,\n\tonSelectMedia,\n\tonUploadError,\n\ttoggleUseFeaturedImage,\n\tupdateDimRatio,\n\tonClearMedia,\n\tfeaturedImage,\n\tisSelected,\n} ) {\n\tconst {\n\t\tuseFeaturedImage,\n\t\tid,\n\t\tdimRatio,\n\t\tfocalPoint,\n\t\thasParallax,\n\t\tisRepeated,\n\t\tminHeight,\n\t\tminHeightUnit,\n\t\talt,\n\t\ttagName,\n\t\tposter,\n\t} = attributes;\n\tconst {\n\t\tisVideoBackground,\n\t\tisImageBackground,\n\t\tmediaElement,\n\t\turl,\n\t\toverlayColor,\n\t} = currentSettings;\n\n\tconst sizeSlug = attributes.sizeSlug || DEFAULT_MEDIA_SIZE_SLUG;\n\n\tconst { gradientValue, setGradient } = __experimentalUseGradient();\n\tconst { imageSizes, selectedStyleState, hasSelectedStyleState } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetSettings,\n\t\t\t\tgetSelectedBlockStyleState,\n\t\t\t\thasSelectedBlockStyleState,\n\t\t\t} = select( blockEditorStore );\n\n\t\t\treturn {\n\t\t\t\timageSizes: getSettings()?.imageSizes,\n\t\t\t\tselectedStyleState: getSelectedBlockStyleState( clientId ),\n\t\t\t\thasSelectedStyleState: hasSelectedBlockStyleState( clientId ),\n\t\t\t};\n\t\t},\n\t\t[ clientId ]\n\t);\n\n\tconst selectedStyleStateKey = getStyleStateKey( selectedStyleState );\n\tconst stateMinHeight = getActiveDimensionValue( {\n\t\tattributes,\n\t\tselectedState: selectedStyleState,\n\t\thasSelectedStyleState,\n\t\tattributeKey: 'minHeight',\n\t\tstyleKey: 'minHeight',\n\t\trootValue: undefined,\n\t} );\n\tconst [ stateMinHeightValue, stateMinHeightUnit ] =\n\t\tparseQuantityAndUnitFromRawValue( stateMinHeight || '' );\n\tconst activeMinHeight = hasSelectedStyleState\n\t\t? stateMinHeightValue\n\t\t: minHeight;\n\tconst activeMinHeightUnit = hasSelectedStyleState\n\t\t? stateMinHeightUnit || minHeightUnit\n\t\t: minHeightUnit;\n\tconst activeAspectRatio = getActiveDimensionValue( {\n\t\tattributes,\n\t\tselectedState: selectedStyleState,\n\t\thasSelectedStyleState,\n\t\tattributeKey: 'aspectRatio',\n\t\trootValue: attributes?.style?.dimensions?.aspectRatio,\n\t} );\n\n\tconst image = useSelect(\n\t\t( select ) =>\n\t\t\tid && isImageBackground\n\t\t\t\t? select( coreStore ).getEntityRecord(\n\t\t\t\t\t\t'postType',\n\t\t\t\t\t\t'attachment',\n\t\t\t\t\t\tid,\n\t\t\t\t\t\t{ context: 'view' }\n\t\t\t\t\t)\n\t\t\t\t: null,\n\t\t[ id, isImageBackground ]\n\t);\n\n\tconst currentBackgroundImage = useFeaturedImage ? featuredImage : image;\n\n\tfunction updateImage( newSizeSlug ) {\n\t\tconst newUrl =\n\t\t\tcurrentBackgroundImage?.media_details?.sizes?.[ newSizeSlug ]\n\t\t\t\t?.source_url;\n\t\tif ( ! newUrl ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tsetAttributes( {\n\t\t\turl: newUrl,\n\t\t\tsizeSlug: newSizeSlug,\n\t\t} );\n\t}\n\n\tconst imageSizeOptions = imageSizes\n\t\t?.filter(\n\t\t\t( { slug } ) =>\n\t\t\t\tcurrentBackgroundImage?.media_details?.sizes?.[ slug ]\n\t\t\t\t\t?.source_url\n\t\t)\n\t\t?.map( ( { name, slug } ) => ( { value: slug, label: name } ) );\n\n\tconst toggleParallax = () => {\n\t\tsetAttributes( {\n\t\t\thasParallax: ! hasParallax,\n\t\t\t...( ! hasParallax ? { focalPoint: undefined } : {} ),\n\t\t} );\n\t};\n\n\tconst toggleIsRepeated = () => {\n\t\tsetAttributes( {\n\t\t\tisRepeated: ! isRepeated,\n\t\t} );\n\t};\n\n\tconst showFocalPointPicker = isVideoBackground || isImageBackground;\n\n\tconst prefersReducedMotion = useReducedMotion();\n\n\tconst imperativeFocalPointPreview = ( value ) => {\n\t\tconst [ styleOfRef, property ] = mediaElement.current\n\t\t\t? [ mediaElement.current.style, 'objectPosition' ]\n\t\t\t: [ coverRef.current.style, 'backgroundPosition' ];\n\t\tstyleOfRef[ property ] = mediaPosition( value );\n\t};\n\n\tconst colorGradientSettings = useMultipleOriginColorsAndGradients();\n\n\tconst showOverlayControls =\n\t\tcolorGradientSettings.hasColorsOrGradients && ! hasSelectedStyleState;\n\n\tconst setMinHeightAttributes = ( nextMinHeight, nextUnit ) => {\n\t\tif ( hasSelectedStyleState ) {\n\t\t\tsetAttributes(\n\t\t\t\tgetDimensionUpdateAttributes( {\n\t\t\t\t\tstyle: attributes.style,\n\t\t\t\t\tselectedState: selectedStyleState,\n\t\t\t\t\thasSelectedStyleState,\n\t\t\t\t\tnextDimensions: {\n\t\t\t\t\t\tminHeight:\n\t\t\t\t\t\t\tnextMinHeight === undefined\n\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t: `${ nextMinHeight }${\n\t\t\t\t\t\t\t\t\t\tnextUnit || activeMinHeightUnit || 'px'\n\t\t\t\t\t\t\t\t\t}`,\n\t\t\t\t\t\taspectRatio: undefined,\n\t\t\t\t\t},\n\t\t\t\t} )\n\t\t\t);\n\t\t\treturn;\n\t\t}\n\n\t\tsetAttributes( {\n\t\t\tminHeight: nextMinHeight,\n\t\t\tstyle: cleanEmptyObject( {\n\t\t\t\t...attributes?.style,\n\t\t\t\tdimensions: {\n\t\t\t\t\t...attributes?.style?.dimensions,\n\t\t\t\t\taspectRatio: undefined, // Reset aspect ratio when minHeight is set.\n\t\t\t\t},\n\t\t\t} ),\n\t\t} );\n\t};\n\n\tconst getResetMinHeightAttributes = ( attrs = attributes ) => {\n\t\treturn getDimensionResetAttributes( {\n\t\t\tstyle: attrs.style,\n\t\t\tselectedState: selectedStyleState,\n\t\t\thasSelectedStyleState,\n\t\t\tkeys: [ 'minHeight' ],\n\t\t\tdefaultAttributes: {\n\t\t\t\tminHeight: undefined,\n\t\t\t\tminHeightUnit: undefined,\n\t\t\t},\n\t\t} );\n\t};\n\n\tconst dropdownMenuProps = useToolsPanelDropdownMenuProps();\n\n\t/*\n\t * Rendered whether or not media has been set, so that a cover in its setup\n\t * state can be given media from the inspector as well as from the toolbar.\n\t * The settings below stay behind their own condition, having nothing to\n\t * configure until there is media to configure.\n\t */\n\tconst mediaInspectorPanel = isSelected ? (\n\t\t<InspectorControls group=\"content\">\n\t\t\t<ToolsPanel\n\t\t\t\tlabel={ __( 'Media' ) }\n\t\t\t\tresetAll={ onClearMedia }\n\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t>\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tlabel={ __( 'Media' ) }\n\t\t\t\t\thasValue={ () => !! url || !! useFeaturedImage }\n\t\t\t\t\tonDeselect={ onClearMedia }\n\t\t\t\t\tisShownByDefault\n\t\t\t\t>\n\t\t\t\t\t<MediaControl\n\t\t\t\t\t\tmediaId={ id }\n\t\t\t\t\t\tmediaUrl={ url }\n\t\t\t\t\t\tfilename={\n\t\t\t\t\t\t\timage?.media_details?.sizes?.full?.file ||\n\t\t\t\t\t\t\timage?.slug ||\n\t\t\t\t\t\t\tgetFilename( url )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\t\tonSelect={ onSelectMedia }\n\t\t\t\t\t\tonError={ onUploadError }\n\t\t\t\t\t\tonReset={ onClearMedia }\n\t\t\t\t\t\tuseFeaturedImage={ useFeaturedImage }\n\t\t\t\t\t\tonToggleFeaturedImage={ toggleUseFeaturedImage }\n\t\t\t\t\t\temptyLabel={ __( 'Add media' ) }\n\t\t\t\t\t/>\n\t\t\t\t</ToolsPanelItem>\n\t\t\t</ToolsPanel>\n\t\t</InspectorControls>\n\t) : null;\n\n\treturn (\n\t\t<>\n\t\t\t{ mediaInspectorPanel }\n\t\t\t{ ( !! url || useFeaturedImage ) && (\n\t\t\t\t<InspectorControls>\n\t\t\t\t\t<ToolsPanel\n\t\t\t\t\t\tlabel={ __( 'Settings' ) }\n\t\t\t\t\t\tresetAll={ () => {\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\thasParallax: false,\n\t\t\t\t\t\t\t\tfocalPoint: undefined,\n\t\t\t\t\t\t\t\tisRepeated: false,\n\t\t\t\t\t\t\t\talt: '',\n\t\t\t\t\t\t\t\tposter: undefined,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tupdateImage( DEFAULT_MEDIA_SIZE_SLUG );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tdropdownMenuProps={ dropdownMenuProps }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ isImageBackground && (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Fixed background' ) }\n\t\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t\t\thasValue={ () => !! hasParallax }\n\t\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\t\thasParallax: false,\n\t\t\t\t\t\t\t\t\t\t\tfocalPoint: undefined,\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\t\t<ToggleControl\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Fixed background' ) }\n\t\t\t\t\t\t\t\t\t\tchecked={ !! hasParallax }\n\t\t\t\t\t\t\t\t\t\tonChange={ toggleParallax }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</ToolsPanelItem>\n\n\t\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Repeated background' ) }\n\t\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t\t\thasValue={ () => isRepeated }\n\t\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\t\tisRepeated: false,\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\t\t<ToggleControl\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Repeated background' ) }\n\t\t\t\t\t\t\t\t\t\tchecked={ isRepeated }\n\t\t\t\t\t\t\t\t\t\tonChange={ toggleIsRepeated }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ showFocalPointPicker && (\n\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\tlabel={ __( 'Focal point' ) }\n\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t\thasValue={ () => !! focalPoint }\n\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\tfocalPoint: undefined,\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>\n\t\t\t\t\t\t\t\t<FocalPointPicker\n\t\t\t\t\t\t\t\t\t// `autoPlay` only applies when the\n\t\t\t\t\t\t\t\t\t// video loads, so remount the picker\n\t\t\t\t\t\t\t\t\t// to stop a preview that is already\n\t\t\t\t\t\t\t\t\t// playing when the user turns on\n\t\t\t\t\t\t\t\t\t// reduced motion.\n\t\t\t\t\t\t\t\t\tkey={ prefersReducedMotion }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Focal point' ) }\n\t\t\t\t\t\t\t\t\turl={ url }\n\t\t\t\t\t\t\t\t\tautoPlay={ ! prefersReducedMotion }\n\t\t\t\t\t\t\t\t\tvalue={ focalPoint }\n\t\t\t\t\t\t\t\t\tonDragStart={ imperativeFocalPointPreview }\n\t\t\t\t\t\t\t\t\tonDrag={ imperativeFocalPointPreview }\n\t\t\t\t\t\t\t\t\tonChange={ ( newFocalPoint ) =>\n\t\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\t\tfocalPoint: newFocalPoint,\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</ToolsPanelItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ isVideoBackground && (\n\t\t\t\t\t\t\t<PosterImage\n\t\t\t\t\t\t\t\tposter={ poster }\n\t\t\t\t\t\t\t\tonChange={ ( posterImage ) =>\n\t\t\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\t\t\tposter: posterImage?.url,\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/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ ! useFeaturedImage && url && ! isVideoBackground && (\n\t\t\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\t\t\tlabel={ __( 'Alternative text' ) }\n\t\t\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\t\t\thasValue={ () => !! alt }\n\t\t\t\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\t\t\t\tsetAttributes( { alt: '' } )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<WCTextareaControl\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Alternative text' ) }\n\t\t\t\t\t\t\t\t\tvalue={ alt }\n\t\t\t\t\t\t\t\t\tonChange={ ( newAlt ) =>\n\t\t\t\t\t\t\t\t\t\tsetAttributes( { alt: newAlt } )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\thelp={\n\t\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t\t<Link\n\t\t\t\t\t\t\t\t\t\t\t\topenInNewTab\n\t\t\t\t\t\t\t\t\t\t\t\thref={\n\t\t\t\t\t\t\t\t\t\t\t\t\t// translators: Localized tutorial, if one exists. W3C Web Accessibility Initiative link has list of existing translations.\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\t\t'https://www.w3.org/WAI/tutorials/images/decision-tree/'\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\t\t{ __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t'Describe the purpose of the image.'\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</Link>\n\t\t\t\t\t\t\t\t\t\t\t<br />\n\t\t\t\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t\t\t\t'Leave empty if decorative.'\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/>\n\t\t\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ !! imageSizeOptions?.length && (\n\t\t\t\t\t\t\t<ResolutionTool\n\t\t\t\t\t\t\t\tvalue={ sizeSlug }\n\t\t\t\t\t\t\t\tonChange={ updateImage }\n\t\t\t\t\t\t\t\toptions={ imageSizeOptions }\n\t\t\t\t\t\t\t\tdefaultValue={ DEFAULT_MEDIA_SIZE_SLUG }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</ToolsPanel>\n\t\t\t\t</InspectorControls>\n\t\t\t) }\n\t\t\t{ showOverlayControls && (\n\t\t\t\t<InspectorControls group=\"color\">\n\t\t\t\t\t<ColorGradientSettingsDropdown\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\tsettings={ [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tcolorValue: overlayColor.color,\n\t\t\t\t\t\t\t\tgradientValue,\n\t\t\t\t\t\t\t\tlabel: __( 'Overlay' ),\n\t\t\t\t\t\t\t\tonColorChange: setOverlayColor,\n\t\t\t\t\t\t\t\tonGradientChange: setGradient,\n\t\t\t\t\t\t\t\tisShownByDefault: true,\n\t\t\t\t\t\t\t\tresetAllFilter: () => ( {\n\t\t\t\t\t\t\t\t\toverlayColor: undefined,\n\t\t\t\t\t\t\t\t\tcustomOverlayColor: undefined,\n\t\t\t\t\t\t\t\t\tgradient: undefined,\n\t\t\t\t\t\t\t\t\tcustomGradient: undefined,\n\t\t\t\t\t\t\t\t} ),\n\t\t\t\t\t\t\t\tclearable: true,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t] }\n\t\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t\t\t{ ...colorGradientSettings }\n\t\t\t\t\t/>\n\t\t\t\t\t<ToolsPanelItem\n\t\t\t\t\t\thasValue={ () => {\n\t\t\t\t\t\t\t// If there's a media background the dimRatio will be\n\t\t\t\t\t\t\t// defaulted to 50 whereas it will be 100 for colors.\n\t\t\t\t\t\t\treturn dimRatio === undefined\n\t\t\t\t\t\t\t\t? false\n\t\t\t\t\t\t\t\t: dimRatio !== ( url ? 50 : 100 );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tlabel={ __( 'Overlay opacity' ) }\n\t\t\t\t\t\tonDeselect={ () => updateDimRatio( url ? 50 : 100 ) }\n\t\t\t\t\t\tresetAllFilter={ () => ( {\n\t\t\t\t\t\t\tdimRatio: url ? 50 : 100,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\tisShownByDefault\n\t\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t\t>\n\t\t\t\t\t\t<RangeControl\n\t\t\t\t\t\t\tlabel={ __( 'Overlay opacity' ) }\n\t\t\t\t\t\t\tvalue={ dimRatio }\n\t\t\t\t\t\t\tonChange={ ( newDimRatio ) =>\n\t\t\t\t\t\t\t\tupdateDimRatio( newDimRatio )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={ 100 }\n\t\t\t\t\t\t\tstep={ 10 }\n\t\t\t\t\t\t\trequired\n\t\t\t\t\t\t/>\n\t\t\t\t\t</ToolsPanelItem>\n\t\t\t\t</InspectorControls>\n\t\t\t) }\n\t\t\t<InspectorControls group=\"dimensions\">\n\t\t\t\t<ToolsPanelItem\n\t\t\t\t\tkey={ selectedStyleStateKey }\n\t\t\t\t\tclassName=\"single-column\"\n\t\t\t\t\thasValue={ () => !! activeMinHeight }\n\t\t\t\t\tlabel={ __( 'Minimum height' ) }\n\t\t\t\t\tonDeselect={ () =>\n\t\t\t\t\t\tsetAttributes( getResetMinHeightAttributes() )\n\t\t\t\t\t}\n\t\t\t\t\tresetAllFilter={ getResetMinHeightAttributes }\n\t\t\t\t\tisShownByDefault\n\t\t\t\t\tpanelId={ clientId }\n\t\t\t\t>\n\t\t\t\t\t<CoverHeightInput\n\t\t\t\t\t\tvalue={ activeAspectRatio ? '' : activeMinHeight }\n\t\t\t\t\t\tunit={ activeMinHeightUnit }\n\t\t\t\t\t\tonChange={ ( newMinHeight ) =>\n\t\t\t\t\t\t\tsetMinHeightAttributes( newMinHeight )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonUnitChange={ ( nextUnit ) => {\n\t\t\t\t\t\t\tif ( hasSelectedStyleState ) {\n\t\t\t\t\t\t\t\tif ( activeMinHeight !== undefined ) {\n\t\t\t\t\t\t\t\t\tsetMinHeightAttributes(\n\t\t\t\t\t\t\t\t\t\tactiveMinHeight,\n\t\t\t\t\t\t\t\t\t\tnextUnit\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\treturn;\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tsetAttributes( {\n\t\t\t\t\t\t\t\tminHeightUnit: nextUnit,\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</ToolsPanelItem>\n\t\t\t</InspectorControls>\n\t\t\t<InspectorControls group=\"advanced\">\n\t\t\t\t<HTMLElementControl\n\t\t\t\t\ttagName={ tagName }\n\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\tsetAttributes( { tagName: value } )\n\t\t\t\t\t}\n\t\t\t\t\tclientId={ clientId }\n\t\t\t\t\toptions={ [\n\t\t\t\t\t\t{ label: __( 'Default (<div>)' ), value: 'div' },\n\t\t\t\t\t\t{ label: '<header>', value: 'header' },\n\t\t\t\t\t\t{ label: '<main>', value: 'main' },\n\t\t\t\t\t\t{ label: '<section>', value: 'section' },\n\t\t\t\t\t\t{ label: '<article>', value: 'article' },\n\t\t\t\t\t\t{ label: '<aside>', value: 'aside' },\n\t\t\t\t\t\t{ label: '<footer>', value: 'footer' },\n\t\t\t\t\t] }\n\t\t\t\t/>\n\t\t\t</InspectorControls>\n\t\t</>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -42,13 +42,13 @@ function findVideoEmbedProvider(url, allowedProviders = DEFAULT_VIDEO_PROVIDERS)
|
|
|
42
42
|
}
|
|
43
43
|
return matchingVariation;
|
|
44
44
|
}
|
|
45
|
-
function getBackgroundEmbedHtml(html) {
|
|
45
|
+
function getBackgroundEmbedHtml(html, { autoplay = true } = {}) {
|
|
46
46
|
const srcMatch = html?.match(/src=["']([^"']+)["']/);
|
|
47
47
|
if (!srcMatch) {
|
|
48
48
|
return null;
|
|
49
49
|
}
|
|
50
50
|
const iframeSrc = srcMatch[1];
|
|
51
|
-
const backgroundSrc = getBackgroundVideoSrc(iframeSrc);
|
|
51
|
+
const backgroundSrc = getBackgroundVideoSrc(iframeSrc, { autoplay });
|
|
52
52
|
return html.replace(iframeSrc, backgroundSrc);
|
|
53
53
|
}
|
|
54
54
|
function detectProviderFromSrc(src) {
|
|
@@ -76,16 +76,18 @@ function detectProviderFromSrc(src) {
|
|
|
76
76
|
}
|
|
77
77
|
return null;
|
|
78
78
|
}
|
|
79
|
-
function getBackgroundVideoSrc(src) {
|
|
79
|
+
function getBackgroundVideoSrc(src, { autoplay = true } = {}) {
|
|
80
80
|
if (!src) {
|
|
81
81
|
return src;
|
|
82
82
|
}
|
|
83
83
|
try {
|
|
84
84
|
const url = new URL(src);
|
|
85
85
|
const provider = detectProviderFromSrc(src);
|
|
86
|
+
if (autoplay) {
|
|
87
|
+
url.searchParams.set("autoplay", "1");
|
|
88
|
+
}
|
|
86
89
|
switch (provider) {
|
|
87
90
|
case "youtube":
|
|
88
|
-
url.searchParams.set("autoplay", "1");
|
|
89
91
|
url.searchParams.set("mute", "1");
|
|
90
92
|
url.searchParams.set("loop", "1");
|
|
91
93
|
url.searchParams.set("controls", "0");
|
|
@@ -99,20 +101,19 @@ function getBackgroundVideoSrc(src) {
|
|
|
99
101
|
}
|
|
100
102
|
break;
|
|
101
103
|
case "vimeo":
|
|
102
|
-
url.searchParams.set("autoplay", "1");
|
|
103
104
|
url.searchParams.set("muted", "1");
|
|
104
105
|
url.searchParams.set("loop", "1");
|
|
105
|
-
|
|
106
|
+
if (autoplay) {
|
|
107
|
+
url.searchParams.set("background", "1");
|
|
108
|
+
}
|
|
106
109
|
url.searchParams.set("controls", "0");
|
|
107
110
|
break;
|
|
108
111
|
case "videopress":
|
|
109
112
|
case "wordpress-tv":
|
|
110
|
-
url.searchParams.set("autoplay", "1");
|
|
111
113
|
url.searchParams.set("loop", "1");
|
|
112
114
|
url.searchParams.set("muted", "1");
|
|
113
115
|
break;
|
|
114
116
|
default:
|
|
115
|
-
url.searchParams.set("autoplay", "1");
|
|
116
117
|
url.searchParams.set("muted", "1");
|
|
117
118
|
url.searchParams.set("loop", "1");
|
|
118
119
|
break;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/cover/embed-video-utils.js"],
|
|
4
|
-
"sourcesContent": ["import { getBlockVariations } from '@wordpress/blocks';\nimport { matchesPatterns } from '../embed/util';\n\nconst DEFAULT_EMBED_BLOCK = 'core/embed';\n\n// List of supported video providers for cover block backgrounds\nconst DEFAULT_VIDEO_PROVIDERS = [\n\t'youtube',\n\t'vimeo',\n\t'videopress',\n\t'animoto',\n\t'tiktok',\n\t'wordpress-tv',\n];\n\n/**\n * Resolves the list of providers that are actually allowed.\n *\n * @param {string[]} [allowedVideoProviders] The providers configured via the block attribute.\n * @return {string[]} The supported providers that remain allowed.\n */\nexport function getAllowedVideoProviders( allowedVideoProviders ) {\n\tif ( ! Array.isArray( allowedVideoProviders ) ) {\n\t\treturn [];\n\t}\n\n\treturn DEFAULT_VIDEO_PROVIDERS.filter( ( provider ) =>\n\t\tallowedVideoProviders.includes( provider )\n\t);\n}\n\n/**\n * Checks if a URL is a valid video embed URL from allowed providers.\n *\n * @param {string} url The URL to validate.\n * @param {string[]} [allowedProviders] The allowed providers, Defaults to all\n * supported providers.\n * @return {boolean} True if the URL matches an allowed video provider pattern.\n */\nexport function isValidVideoEmbedUrl( url, allowedProviders ) {\n\tif ( ! url ) {\n\t\treturn false;\n\t}\n\n\tconst embedBlock = findVideoEmbedProvider( url, allowedProviders );\n\treturn embedBlock !== null;\n}\n\n/**\n * Finds the embed provider for a given URL if it's an allowed video provider.\n *\n * @param {string} url The URL to check.\n * @param {string[]} [allowedProviders] The allowed providers, Defaults to all\n * supported providers.\n * @return {string|null} The provider name slug (e.g., 'youtube') or null if not found.\n */\nexport function getVideoEmbedProvider( url, allowedProviders ) {\n\tconst embedBlock = findVideoEmbedProvider( url, allowedProviders );\n\treturn embedBlock ? embedBlock.name : null;\n}\n\n/**\n * Finds a matching video embed block variation for the given URL.\n *\n * @param {string} url The URL to match against provider patterns.\n * @param {string[]} [allowedProviders] The allowed providers, Defaults to all\n * supported providers.\n * @return {Object|null} The matching block variation or null if not found.\n */\nfunction findVideoEmbedProvider(\n\turl,\n\tallowedProviders = DEFAULT_VIDEO_PROVIDERS\n) {\n\tconst embedVariations = getBlockVariations( DEFAULT_EMBED_BLOCK );\n\n\tif ( ! embedVariations ) {\n\t\treturn null;\n\t}\n\n\tconst matchingVariation = embedVariations.find( ( { patterns } ) =>\n\t\tmatchesPatterns( url, patterns )\n\t);\n\n\tif (\n\t\t! matchingVariation ||\n\t\t! allowedProviders.includes( matchingVariation.name )\n\t) {\n\t\treturn null;\n\t}\n\n\treturn matchingVariation;\n}\n\n/**\n * Modifies embed HTML to use background video parameters.\n *\n * @param {string}
|
|
5
|
-
"mappings": ";AAAA,SAAS,0BAA0B;AACnC,SAAS,uBAAuB;AAEhC,IAAM,sBAAsB;AAG5B,IAAM,0BAA0B;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD;AAQO,SAAS,yBAA0B,uBAAwB;AACjE,MAAK,CAAE,MAAM,QAAS,qBAAsB,GAAI;AAC/C,WAAO,CAAC;AAAA,EACT;AAEA,SAAO,wBAAwB;AAAA,IAAQ,CAAE,aACxC,sBAAsB,SAAU,QAAS;AAAA,EAC1C;AACD;AAUO,SAAS,qBAAsB,KAAK,kBAAmB;AAC7D,MAAK,CAAE,KAAM;AACZ,WAAO;AAAA,EACR;AAEA,QAAM,aAAa,uBAAwB,KAAK,gBAAiB;AACjE,SAAO,eAAe;AACvB;AAUO,SAAS,sBAAuB,KAAK,kBAAmB;AAC9D,QAAM,aAAa,uBAAwB,KAAK,gBAAiB;AACjE,SAAO,aAAa,WAAW,OAAO;AACvC;AAUA,SAAS,uBACR,KACA,mBAAmB,yBAClB;AACD,QAAM,kBAAkB,mBAAoB,mBAAoB;AAEhE,MAAK,CAAE,iBAAkB;AACxB,WAAO;AAAA,EACR;AAEA,QAAM,oBAAoB,gBAAgB;AAAA,IAAM,CAAE,EAAE,SAAS,MAC5D,gBAAiB,KAAK,QAAS;AAAA,EAChC;AAEA,MACC,CAAE,qBACF,CAAE,iBAAiB,SAAU,kBAAkB,IAAK,GACnD;AACD,WAAO;AAAA,EACR;AAEA,SAAO;AACR;
|
|
4
|
+
"sourcesContent": ["import { getBlockVariations } from '@wordpress/blocks';\nimport { matchesPatterns } from '../embed/util';\n\nconst DEFAULT_EMBED_BLOCK = 'core/embed';\n\n// List of supported video providers for cover block backgrounds\nconst DEFAULT_VIDEO_PROVIDERS = [\n\t'youtube',\n\t'vimeo',\n\t'videopress',\n\t'animoto',\n\t'tiktok',\n\t'wordpress-tv',\n];\n\n/**\n * Resolves the list of providers that are actually allowed.\n *\n * @param {string[]} [allowedVideoProviders] The providers configured via the block attribute.\n * @return {string[]} The supported providers that remain allowed.\n */\nexport function getAllowedVideoProviders( allowedVideoProviders ) {\n\tif ( ! Array.isArray( allowedVideoProviders ) ) {\n\t\treturn [];\n\t}\n\n\treturn DEFAULT_VIDEO_PROVIDERS.filter( ( provider ) =>\n\t\tallowedVideoProviders.includes( provider )\n\t);\n}\n\n/**\n * Checks if a URL is a valid video embed URL from allowed providers.\n *\n * @param {string} url The URL to validate.\n * @param {string[]} [allowedProviders] The allowed providers, Defaults to all\n * supported providers.\n * @return {boolean} True if the URL matches an allowed video provider pattern.\n */\nexport function isValidVideoEmbedUrl( url, allowedProviders ) {\n\tif ( ! url ) {\n\t\treturn false;\n\t}\n\n\tconst embedBlock = findVideoEmbedProvider( url, allowedProviders );\n\treturn embedBlock !== null;\n}\n\n/**\n * Finds the embed provider for a given URL if it's an allowed video provider.\n *\n * @param {string} url The URL to check.\n * @param {string[]} [allowedProviders] The allowed providers, Defaults to all\n * supported providers.\n * @return {string|null} The provider name slug (e.g., 'youtube') or null if not found.\n */\nexport function getVideoEmbedProvider( url, allowedProviders ) {\n\tconst embedBlock = findVideoEmbedProvider( url, allowedProviders );\n\treturn embedBlock ? embedBlock.name : null;\n}\n\n/**\n * Finds a matching video embed block variation for the given URL.\n *\n * @param {string} url The URL to match against provider patterns.\n * @param {string[]} [allowedProviders] The allowed providers, Defaults to all\n * supported providers.\n * @return {Object|null} The matching block variation or null if not found.\n */\nfunction findVideoEmbedProvider(\n\turl,\n\tallowedProviders = DEFAULT_VIDEO_PROVIDERS\n) {\n\tconst embedVariations = getBlockVariations( DEFAULT_EMBED_BLOCK );\n\n\tif ( ! embedVariations ) {\n\t\treturn null;\n\t}\n\n\tconst matchingVariation = embedVariations.find( ( { patterns } ) =>\n\t\tmatchesPatterns( url, patterns )\n\t);\n\n\tif (\n\t\t! matchingVariation ||\n\t\t! allowedProviders.includes( matchingVariation.name )\n\t) {\n\t\treturn null;\n\t}\n\n\treturn matchingVariation;\n}\n\n/**\n * Modifies embed HTML to use background video parameters.\n *\n * @param {string} html The original embed HTML.\n * @param {Object} options Options.\n * @param {boolean} options.autoplay Whether the video should start playing on load.\n * @return {string|null} The modified embed HTML, or null if not possible.\n */\nexport function getBackgroundEmbedHtml( html, { autoplay = true } = {} ) {\n\tconst srcMatch = html?.match( /src=[\"']([^\"']+)[\"']/ );\n\tif ( ! srcMatch ) {\n\t\treturn null;\n\t}\n\n\tconst iframeSrc = srcMatch[ 1 ];\n\tconst backgroundSrc = getBackgroundVideoSrc( iframeSrc, { autoplay } );\n\treturn html.replace( iframeSrc, backgroundSrc );\n}\n\n/**\n * Detects the video provider from an iframe src URL.\n *\n * @param {string} src The iframe src URL.\n * @return {string|null} The provider name slug or null if not recognized.\n */\nexport function detectProviderFromSrc( src ) {\n\tif ( ! src ) {\n\t\treturn null;\n\t}\n\n\tconst lowerSrc = src.toLowerCase();\n\n\tif (\n\t\tlowerSrc.includes( 'youtube.com' ) ||\n\t\tlowerSrc.includes( 'youtu.be' )\n\t) {\n\t\treturn 'youtube';\n\t}\n\tif ( lowerSrc.includes( 'vimeo.com' ) ) {\n\t\treturn 'vimeo';\n\t}\n\tif ( lowerSrc.includes( 'videopress.com' ) ) {\n\t\treturn 'videopress';\n\t}\n\tif ( lowerSrc.includes( 'animoto.com' ) ) {\n\t\treturn 'animoto';\n\t}\n\tif ( lowerSrc.includes( 'tiktok.com' ) ) {\n\t\treturn 'tiktok';\n\t}\n\tif ( lowerSrc.includes( 'wordpress.tv' ) ) {\n\t\treturn 'wordpress-tv';\n\t}\n\n\treturn null;\n}\n\n/**\n * Modifies an iframe src URL to add background video parameters.\n * Automatically detects the provider from the URL.\n *\n * @param {string} src The iframe src URL.\n * @param {Object} options Options.\n * @param {boolean} options.autoplay Whether the video should start playing on load.\n * @return {string} The modified URL.\n */\nexport function getBackgroundVideoSrc( src, { autoplay = true } = {} ) {\n\tif ( ! src ) {\n\t\treturn src;\n\t}\n\n\ttry {\n\t\tconst url = new URL( src );\n\n\t\t// Detect provider from the iframe src URL\n\t\tconst provider = detectProviderFromSrc( src );\n\n\t\tif ( autoplay ) {\n\t\t\turl.searchParams.set( 'autoplay', '1' );\n\t\t}\n\n\t\t// Add provider-specific parameters for background video behavior\n\t\tswitch ( provider ) {\n\t\t\tcase 'youtube':\n\t\t\t\t// YouTube parameters for background video\n\t\t\t\turl.searchParams.set( 'mute', '1' );\n\t\t\t\turl.searchParams.set( 'loop', '1' );\n\t\t\t\turl.searchParams.set( 'controls', '0' );\n\t\t\t\turl.searchParams.set( 'showinfo', '0' );\n\t\t\t\turl.searchParams.set( 'modestbranding', '1' );\n\t\t\t\turl.searchParams.set( 'playsinline', '1' );\n\t\t\t\turl.searchParams.set( 'rel', '0' );\n\t\t\t\t// For loop to work, we need the playlist parameter\n\t\t\t\tconst videoId = url.pathname.split( '/' ).pop();\n\t\t\t\tif ( videoId ) {\n\t\t\t\t\turl.searchParams.set( 'playlist', videoId );\n\t\t\t\t}\n\t\t\t\tbreak;\n\n\t\t\tcase 'vimeo':\n\t\t\t\t// Vimeo parameters for background video\n\t\t\t\turl.searchParams.set( 'muted', '1' );\n\t\t\t\turl.searchParams.set( 'loop', '1' );\n\t\t\t\t// Vimeo's background mode always autoplays, so it can only be\n\t\t\t\t// used when autoplay is allowed.\n\t\t\t\tif ( autoplay ) {\n\t\t\t\t\turl.searchParams.set( 'background', '1' );\n\t\t\t\t}\n\t\t\t\turl.searchParams.set( 'controls', '0' );\n\t\t\t\tbreak;\n\n\t\t\tcase 'videopress':\n\t\t\tcase 'wordpress-tv':\n\t\t\t\t// VideoPress parameters\n\t\t\t\turl.searchParams.set( 'loop', '1' );\n\t\t\t\turl.searchParams.set( 'muted', '1' );\n\t\t\t\tbreak;\n\n\t\t\tdefault:\n\t\t\t\t// Generic parameters that might work for other providers\n\t\t\t\turl.searchParams.set( 'muted', '1' );\n\t\t\t\turl.searchParams.set( 'loop', '1' );\n\t\t\t\tbreak;\n\t\t}\n\n\t\treturn url.toString();\n\t} catch {\n\t\t// If URL parsing fails, return original src\n\t\treturn src;\n\t}\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
// packages/block-library/src/cover/view.js
|
|
2
|
+
import { getContext, store } from "@wordpress/interactivity";
|
|
3
|
+
import { prefersReducedMotion } from "@wordpress/a11y";
|
|
4
|
+
store(
|
|
5
|
+
"core/cover",
|
|
6
|
+
{
|
|
7
|
+
state: {
|
|
8
|
+
get videoSrc() {
|
|
9
|
+
const { src, reducedMotionSrc } = getContext();
|
|
10
|
+
if (reducedMotionSrc && prefersReducedMotion()) {
|
|
11
|
+
return reducedMotionSrc;
|
|
12
|
+
}
|
|
13
|
+
return src;
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
},
|
|
17
|
+
{ lock: true }
|
|
18
|
+
);
|
|
19
|
+
//# sourceMappingURL=view.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/cover/view.js"],
|
|
4
|
+
"sourcesContent": ["import { getContext, store } from '@wordpress/interactivity';\nimport { prefersReducedMotion } from '@wordpress/a11y';\n\nstore(\n\t'core/cover',\n\t{\n\t\tstate: {\n\t\t\tget videoSrc() {\n\t\t\t\tconst { src, reducedMotionSrc } = getContext();\n\n\t\t\t\t// The server renders the autoplaying source, so it is only\n\t\t\t\t// replaced for a visitor who has asked for reduced motion.\n\t\t\t\tif ( reducedMotionSrc && prefersReducedMotion() ) {\n\t\t\t\t\treturn reducedMotionSrc;\n\t\t\t\t}\n\n\t\t\t\treturn src;\n\t\t\t},\n\t\t},\n\t},\n\t{ lock: true }\n);\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,YAAY,aAAa;AAClC,SAAS,4BAA4B;AAErC;AAAA,EACC;AAAA,EACA;AAAA,IACC,OAAO;AAAA,MACN,IAAI,WAAW;AACd,cAAM,EAAE,KAAK,iBAAiB,IAAI,WAAW;AAI7C,YAAK,oBAAoB,qBAAqB,GAAI;AACjD,iBAAO;AAAA,QACR;AAEA,eAAO;AAAA,MACR;AAAA,IACD;AAAA,EACD;AAAA,EACA,EAAE,MAAM,KAAK;AACd;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -43,8 +43,13 @@
|
|
|
43
43
|
"supports": {
|
|
44
44
|
"anchor": true,
|
|
45
45
|
"align": true,
|
|
46
|
+
"dimensions": {
|
|
47
|
+
"minHeight": true,
|
|
48
|
+
"minWidth": true
|
|
49
|
+
},
|
|
46
50
|
"spacing": {
|
|
47
|
-
"margin": true
|
|
51
|
+
"margin": true,
|
|
52
|
+
"padding": true
|
|
48
53
|
},
|
|
49
54
|
"interactivity": {
|
|
50
55
|
"clientNavigation": true
|
|
@@ -78,6 +78,10 @@
|
|
|
78
78
|
"margin": true,
|
|
79
79
|
"padding": true
|
|
80
80
|
},
|
|
81
|
+
"dimensions": {
|
|
82
|
+
"minHeight": true,
|
|
83
|
+
"minWidth": true
|
|
84
|
+
},
|
|
81
85
|
"color": {
|
|
82
86
|
"gradients": true,
|
|
83
87
|
"link": true,
|
|
@@ -99,6 +103,7 @@
|
|
|
99
103
|
"style": true
|
|
100
104
|
}
|
|
101
105
|
},
|
|
106
|
+
"shadow": true,
|
|
102
107
|
"interactivity": true
|
|
103
108
|
},
|
|
104
109
|
"editorStyle": "wp-block-file-editor",
|
|
@@ -166,6 +166,11 @@
|
|
|
166
166
|
"background": true,
|
|
167
167
|
"gradients": true
|
|
168
168
|
},
|
|
169
|
+
"shadow": true,
|
|
170
|
+
"dimensions": {
|
|
171
|
+
"minHeight": true,
|
|
172
|
+
"minWidth": true
|
|
173
|
+
},
|
|
169
174
|
"layout": {
|
|
170
175
|
"allowSwitching": false,
|
|
171
176
|
"allowInheriting": false,
|
|
@@ -179,11 +184,19 @@
|
|
|
179
184
|
"type": "flex"
|
|
180
185
|
}
|
|
181
186
|
},
|
|
187
|
+
"filter": {
|
|
188
|
+
"duotone": true
|
|
189
|
+
},
|
|
182
190
|
"interactivity": {
|
|
183
191
|
"clientNavigation": true
|
|
184
192
|
},
|
|
185
193
|
"listView": true
|
|
186
194
|
},
|
|
195
|
+
"selectors": {
|
|
196
|
+
"filter": {
|
|
197
|
+
"duotone": ".wp-block-gallery :where(img)"
|
|
198
|
+
}
|
|
199
|
+
},
|
|
187
200
|
"editorStyle": "wp-block-gallery-editor",
|
|
188
201
|
"style": "wp-block-gallery"
|
|
189
202
|
}
|
|
@@ -6,11 +6,8 @@ import {
|
|
|
6
6
|
Notice,
|
|
7
7
|
PanelBody,
|
|
8
8
|
Placeholder,
|
|
9
|
-
SelectControl as WCSelectControl,
|
|
10
9
|
Spinner,
|
|
11
10
|
ToolbarButton,
|
|
12
|
-
__experimentalToolsPanel as ToolsPanel,
|
|
13
|
-
__experimentalToolsPanelItem as ToolsPanelItem,
|
|
14
11
|
__experimentalConfirmDialog as ConfirmDialog
|
|
15
12
|
} from "@wordpress/components";
|
|
16
13
|
import {
|
|
@@ -22,36 +19,8 @@ import {
|
|
|
22
19
|
import { sharedIcon } from "./shared-icon.mjs";
|
|
23
20
|
import { isGalleryFlexLayout } from "./shared.mjs";
|
|
24
21
|
import { Caption } from "../utils/caption.mjs";
|
|
25
|
-
import {
|
|
22
|
+
import { MAX_IMAGES } from "./dynamic-source.mjs";
|
|
26
23
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
27
|
-
var ORDER_OPTIONS = [
|
|
28
|
-
{ label: __("Newest to oldest"), value: "date/desc" },
|
|
29
|
-
{ label: __("Oldest to newest"), value: "date/asc" },
|
|
30
|
-
{
|
|
31
|
-
/* translators: Label for ordering images by title in ascending order. */
|
|
32
|
-
label: __("A → Z"),
|
|
33
|
-
value: "title/asc"
|
|
34
|
-
},
|
|
35
|
-
{
|
|
36
|
-
/* translators: Label for ordering images by title in descending order. */
|
|
37
|
-
label: __("Z → A"),
|
|
38
|
-
value: "title/desc"
|
|
39
|
-
}
|
|
40
|
-
];
|
|
41
|
-
function OrderControl({ orderby, order, onChange }) {
|
|
42
|
-
return /* @__PURE__ */ jsx(
|
|
43
|
-
WCSelectControl,
|
|
44
|
-
{
|
|
45
|
-
label: __("Order by"),
|
|
46
|
-
value: `${orderby}/${order}`,
|
|
47
|
-
options: ORDER_OPTIONS,
|
|
48
|
-
onChange: (value) => {
|
|
49
|
-
const [newOrderby, newOrder] = value.split("/");
|
|
50
|
-
onChange({ orderby: newOrderby, order: newOrder });
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
-
);
|
|
54
|
-
}
|
|
55
24
|
function DetachGalleryDialog({ onConfirm, onCancel }) {
|
|
56
25
|
return /* @__PURE__ */ jsx(
|
|
57
26
|
ConfirmDialog,
|
|
@@ -69,21 +38,13 @@ function DetachGalleryDialog({ onConfirm, onCancel }) {
|
|
|
69
38
|
}
|
|
70
39
|
);
|
|
71
40
|
}
|
|
72
|
-
function GallerySourcePanel({
|
|
73
|
-
dynamic,
|
|
74
|
-
dropdownMenuProps,
|
|
75
|
-
hasImages
|
|
76
|
-
}) {
|
|
41
|
+
function GallerySourcePanel({ dynamic, hasImages }) {
|
|
77
42
|
const {
|
|
78
43
|
dynamicContent,
|
|
79
44
|
canUseDynamicSource,
|
|
80
45
|
sourceDescriptor,
|
|
81
|
-
sourceOrderby,
|
|
82
|
-
sourceOrder,
|
|
83
|
-
setSourceOrder,
|
|
84
46
|
convertToStatic,
|
|
85
47
|
enableDynamicMode,
|
|
86
|
-
resetSource,
|
|
87
48
|
isResolvingDynamic,
|
|
88
49
|
hasMoreImagesThanCap,
|
|
89
50
|
dynamicMediaTotal
|
|
@@ -100,63 +61,38 @@ function GallerySourcePanel({
|
|
|
100
61
|
}
|
|
101
62
|
if (isDynamic) {
|
|
102
63
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
103
|
-
/* @__PURE__ */ jsxs(
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
/* translators: 1: number of images shown. 2: total number of matching images. */
|
|
132
|
-
__(
|
|
133
|
-
"Only the first %1$d of %2$d images will be displayed."
|
|
134
|
-
),
|
|
135
|
-
MAX_IMAGES,
|
|
136
|
-
dynamicMediaTotal
|
|
137
|
-
)
|
|
138
|
-
}
|
|
139
|
-
),
|
|
140
|
-
/* @__PURE__ */ jsx(
|
|
141
|
-
ToolsPanelItem,
|
|
142
|
-
{
|
|
143
|
-
isShownByDefault: true,
|
|
144
|
-
label: __("Order by"),
|
|
145
|
-
hasValue: () => sourceOrderby !== DEFAULT_ORDERBY || sourceOrder !== DEFAULT_ORDER,
|
|
146
|
-
onDeselect: () => setSourceOrder(void 0, void 0),
|
|
147
|
-
children: /* @__PURE__ */ jsx(
|
|
148
|
-
OrderControl,
|
|
149
|
-
{
|
|
150
|
-
orderby: sourceOrderby,
|
|
151
|
-
order: sourceOrder,
|
|
152
|
-
onChange: ({ orderby, order }) => setSourceOrder(orderby, order)
|
|
153
|
-
}
|
|
154
|
-
)
|
|
155
|
-
}
|
|
64
|
+
/* @__PURE__ */ jsxs(PanelBody, { title: __("Source"), children: [
|
|
65
|
+
/* @__PURE__ */ jsxs("div", { className: "wp-block-gallery__source-settings", children: [
|
|
66
|
+
/* @__PURE__ */ jsx("p", { className: "wp-block-gallery__source-description", children: sourceDescriptor?.description ?? __("Dynamic images.") }),
|
|
67
|
+
/* @__PURE__ */ jsx(
|
|
68
|
+
Button,
|
|
69
|
+
{
|
|
70
|
+
__next40pxDefaultSize: true,
|
|
71
|
+
variant: "secondary",
|
|
72
|
+
onClick: () => setIsConfirmingDetach(true),
|
|
73
|
+
disabled: isResolvingDynamic,
|
|
74
|
+
accessibleWhenDisabled: true,
|
|
75
|
+
children: __("Detach Gallery")
|
|
76
|
+
}
|
|
77
|
+
)
|
|
78
|
+
] }),
|
|
79
|
+
hasMoreImagesThanCap && /* @__PURE__ */ jsx(
|
|
80
|
+
Notice,
|
|
81
|
+
{
|
|
82
|
+
className: "wp-block-gallery__source-notice",
|
|
83
|
+
status: "warning",
|
|
84
|
+
isDismissible: false,
|
|
85
|
+
children: sprintf(
|
|
86
|
+
/* translators: 1: number of images shown. 2: total number of matching images. */
|
|
87
|
+
__(
|
|
88
|
+
"Only the first %1$d of %2$d images will be displayed."
|
|
89
|
+
),
|
|
90
|
+
MAX_IMAGES,
|
|
91
|
+
dynamicMediaTotal
|
|
156
92
|
)
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
),
|
|
93
|
+
}
|
|
94
|
+
)
|
|
95
|
+
] }),
|
|
160
96
|
isConfirmingDetach && /* @__PURE__ */ jsx(
|
|
161
97
|
DetachGalleryDialog,
|
|
162
98
|
{
|