handling hasRoundedShadow attribute

This commit is contained in:
Antoine M 2024-08-14 17:27:39 +02:00
parent 2facdc51e7
commit 08ce5886bd
7 changed files with 44 additions and 7 deletions

View File

@ -19,6 +19,10 @@
"type": "boolean",
"default": "true"
},
"hasRoundedShadow": {
"type": "boolean",
"default": "false"
},
"hasFixedHeight": {
"type": "boolean",
"default": "true"

View File

@ -1 +1 @@
<?php return array('dependencies' => array('react', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => '37f4daef8c6929a4d497');
<?php return array('dependencies' => array('react', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => '6de2664ba6b7abf8bd92');

View File

@ -38,6 +38,7 @@ function Edit({
const {
hasStickyLegend,
hasFixedHeight,
hasRoundedShadow,
showTitle,
pictureUrl,
pictureAlt,
@ -85,6 +86,11 @@ function Edit({
showTitle
});
}
function handleHasRoundedShadow(hasRoundedShadow) {
setAttributes({
hasRoundedShadow
});
}
return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.InspectorControls, null, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, {
title: "L\xE9gende",
className: "homegrade-blocks-components-image__panel-body "
@ -102,6 +108,10 @@ function Edit({
label: "Afficher le titre",
checked: showTitle,
onChange: handleShowTitle
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToggleControl, {
label: "Rounded & Shadow",
checked: hasRoundedShadow,
onChange: handleHasRoundedShadow
})), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, {
title: "Source de l'image",
className: "homegrade-blocks-components-image__panel-body "
@ -127,7 +137,8 @@ function Edit({
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
className: `homegrade-blocks-labelled-picture homegrade-blocks-labelled-picture--legend-${hasStickyLegend ? "sticky" : "normal"}
${hasFixedHeight ? "homegrade-blocks-labelled-picture--fixed-height" : ""}
${showTitle && pictureTitle ? "homegrade-blocks-labelled-picture--legend-has-title" : ""}`
${showTitle && pictureTitle ? "homegrade-blocks-labelled-picture--legend-has-title" : ""}
${hasRoundedShadow ? "homegrade-blocks-labelled-picture--rounded-shadow" : ""}`
})
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: pictureUrl,
@ -215,6 +226,7 @@ function save({
const {
hasFixedHeight,
hasStickyLegend,
hasRoundedShadow,
showTitle,
pictureUrl,
pictureAlt,
@ -224,7 +236,8 @@ function save({
return (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, pictureUrl && (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("figure", {
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save({
className: `homegrade-blocks-labelled-picture homegrade-blocks-labelled-picture--legend-${hasStickyLegend ? "sticky" : "normal"} ${hasFixedHeight ? "homegrade-blocks-labelled-picture--fixed-height" : ""}
${showTitle && pictureTitle ? "homegrade-blocks-labelled-picture--legend-has-title" : ""}`
${showTitle && pictureTitle ? "homegrade-blocks-labelled-picture--legend-has-title" : ""}
${hasRoundedShadow ? "homegrade-blocks-labelled-picture--rounded-shadow" : ""} singleLightbox-link`
})
}, (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: pictureUrl,
@ -367,7 +380,7 @@ module.exports = window["wp"]["primitives"];
\************************/
/***/ ((module) => {
module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/labelled-picture","version":"0.1.0","title":"Image + Légende","category":"homegrade-blocks","icon":"smiley","description":"Bloc image contenant une légende autocollante","supports":{"html":false},"textdomain":"homegrade-blocks","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","attributes":{"hasStickyLegend":{"type":"boolean","default":"true"},"hasFixedHeight":{"type":"boolean","default":"true"},"showTitle":{"type":"boolean","default":"true"},"pictureUrl":{"type":"string"},"pictureTitle":{"type":"string"},"pictureAlt":{"type":"string"},"pictureId":{"type":"number"},"pictureCaption":{"type":"string"}}}');
module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/labelled-picture","version":"0.1.0","title":"Image + Légende","category":"homegrade-blocks","icon":"smiley","description":"Bloc image contenant une légende autocollante","supports":{"html":false},"textdomain":"homegrade-blocks","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","attributes":{"hasStickyLegend":{"type":"boolean","default":"true"},"hasRoundedShadow":{"type":"boolean","default":"false"},"hasFixedHeight":{"type":"boolean","default":"true"},"showTitle":{"type":"boolean","default":"true"},"pictureUrl":{"type":"string"},"pictureTitle":{"type":"string"},"pictureAlt":{"type":"string"},"pictureId":{"type":"number"},"pictureCaption":{"type":"string"}}}');
/***/ })

File diff suppressed because one or more lines are too long

View File

@ -19,6 +19,10 @@
"type": "boolean",
"default": "true"
},
"hasRoundedShadow": {
"type": "boolean",
"default": "false"
},
"hasFixedHeight": {
"type": "boolean",
"default": "true"

View File

@ -28,6 +28,7 @@ export default function Edit({
const {
hasStickyLegend,
hasFixedHeight,
hasRoundedShadow,
showTitle,
pictureUrl,
pictureAlt,
@ -72,6 +73,9 @@ export default function Edit({
function handleShowTitle(showTitle) {
setAttributes({ showTitle });
}
function handleHasRoundedShadow(hasRoundedShadow) {
setAttributes({ hasRoundedShadow });
}
return (
<>
@ -97,6 +101,11 @@ export default function Edit({
checked={showTitle}
onChange={handleShowTitle}
/>
<ToggleControl
label="Rounded & Shadow"
checked={hasRoundedShadow}
onChange={handleHasRoundedShadow}
/>
</PanelBody>
<PanelBody
title="Source de l'image"
@ -148,7 +157,8 @@ export default function Edit({
showTitle && pictureTitle
? "homegrade-blocks-labelled-picture--legend-has-title"
: ""
}`,
}
${hasRoundedShadow ? "homegrade-blocks-labelled-picture--rounded-shadow" : ""}`,
})}
>
<img src={pictureUrl} alt={pictureAlt} />

View File

@ -4,6 +4,7 @@ export default function save({ attributes }) {
const {
hasFixedHeight,
hasStickyLegend,
hasRoundedShadow,
showTitle,
pictureUrl,
pictureAlt,
@ -27,7 +28,12 @@ export default function save({ attributes }) {
showTitle && pictureTitle
? "homegrade-blocks-labelled-picture--legend-has-title"
: ""
}`,
}
${
hasRoundedShadow
? "homegrade-blocks-labelled-picture--rounded-shadow"
: ""
} singleLightbox-link`,
})}
>
<img src={pictureUrl} alt={pictureAlt} />