adding a mediaPlaceholder into block when disabling auto-cover

This commit is contained in:
Antoine M 2023-11-06 14:07:45 +01:00
parent 6cbf55b51d
commit 309e45447d
7 changed files with 30 additions and 13 deletions

View File

@ -1 +1 @@
<?php return array('dependencies' => array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => 'b7d69e8f13c59d8be58e');
<?php return array('dependencies' => array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => 'b8178c4637e6f7dc88cc');

View File

@ -5,6 +5,10 @@
max-width: 200px !important;
}
.homegrade-blocks-content-page-header .block-editor-media-placeholder {
max-height: 200px;
}
.homegrade-blocks-content-page-header__panel-cta .block-editor-link-control__field {
margin: 0;
}

View File

@ -1 +1 @@
{"version":3,"file":"index.css","mappings":";;;AACC;EACC;AAAF;;AAKC;EACC;AAFF;AAIC;EACC;AAFF,C","sources":["webpack://multiblocks/./src/editor.scss"],"sourcesContent":[".block-content-page-header {\r\n\t&__page-icon {\r\n\t\tmax-width: 200px !important;\r\n\t}\r\n}\r\n\r\n.homegrade-blocks-content-page-header__panel-cta {\r\n\t.block-editor-link-control__field {\r\n\t\tmargin: 0;\r\n\t}\r\n\t.block-editor-link-control {\r\n\t\tmin-width: unset;\r\n\t}\r\n}\r\n"],"names":[],"sourceRoot":""}
{"version":3,"file":"index.css","mappings":";;;AACC;EACC;AAAF;;AAIC;EACC;AADF;;AAKC;EACC;AAFF;AAIC;EACC;AAFF,C","sources":["webpack://multiblocks/./src/editor.scss"],"sourcesContent":[".block-content-page-header {\r\n\t&__page-icon {\r\n\t\tmax-width: 200px !important;\r\n\t}\r\n}\r\n.homegrade-blocks-content-page-header {\r\n\t.block-editor-media-placeholder {\r\n\t\tmax-height: 200px;\r\n\t}\r\n}\r\n.homegrade-blocks-content-page-header__panel-cta {\r\n\t.block-editor-link-control__field {\r\n\t\tmargin: 0;\r\n\t}\r\n\t.block-editor-link-control {\r\n\t\tmin-width: unset;\r\n\t}\r\n}\r\n"],"names":[],"sourceRoot":""}

View File

@ -59,7 +59,6 @@ function ImageMediaPlaceholder({
});
}
function removeImageAttributes() {
console.log("removeImageAttributes");
setAttributes({
imageId: null,
imageAlt: null,
@ -217,12 +216,6 @@ function ImagePanelBody({
imageUrl: null
});
}
function onImageProportionChange(imageProportion) {
console.log(imageProportion);
setAttributes({
imageProportion
});
}
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, imageUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: imageUrl,
alt: imageAlt
@ -468,10 +461,16 @@ function Edit({
className: "block-content-page-header__page-icon",
src: pageIcon.source_url,
alt: ""
}), hasCustomImage && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
}), hasCustomImage && imageUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: imageUrl,
alt: imageAlt,
className: "block-content-page-header__page-icon"
}), hasCustomImage && !imageUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.MediaPlaceholder, {
accept: "image/*",
allowedTypes: ["image"],
onSelect: setImageAttributes,
multiple: false,
handleUpload: true
})));
}

File diff suppressed because one or more lines are too long

View File

@ -8,6 +8,7 @@ import {
MediaReplaceFlow,
InspectorControls,
__experimentalLinkControl as LinkControl,
MediaPlaceholder,
} from "@wordpress/block-editor";
import {
@ -260,13 +261,22 @@ export default function Edit({ attributes, setAttributes }) {
alt=""
/>
)}
{hasCustomImage && (
{hasCustomImage && imageUrl && (
<img
src={imageUrl}
alt={imageAlt}
className="block-content-page-header__page-icon"
/>
)}
{hasCustomImage && !imageUrl && (
<MediaPlaceholder
accept="image/*"
allowedTypes={["image"]}
onSelect={setImageAttributes}
multiple={false}
handleUpload={true}
/>
)}
</section>
</>
);

View File

@ -3,7 +3,11 @@
max-width: 200px !important;
}
}
.homegrade-blocks-content-page-header {
.block-editor-media-placeholder {
max-height: 200px;
}
}
.homegrade-blocks-content-page-header__panel-cta {
.block-editor-link-control__field {
margin: 0;