Antoine/homegrade_blocks_production
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

handling toggleControl to remove cta

Browse Source
This commit is contained in:
Antoine M 2023-10-19 15:29:21 +02:00
parent fddc0c7fd7
commit e5bbf38473
6 changed files with 72 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
blocks/content-page-header/build/block.json
View File

@ -22,6 +22,10 @@
"pageHeaderDescription": { "pageHeaderDescription": {
"type": "string" "type": "string"
}, },
"hasCta": {
"type": "boolean",
"default": false
},
"cta": { "cta": {
"type": "object" "type": "object"
} }

2
blocks/content-page-header/build/index.asset.php
View File

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

37
blocks/content-page-header/build/index.js
View File

@ -36,6 +36,7 @@ function Edit({
const { const {
pageHeaderTitle, pageHeaderTitle,
pageHeaderDescription, pageHeaderDescription,
hasCta,
cta cta
} = attributes; } = attributes;
const pageTitle = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useSelect)(select => { const pageTitle = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useSelect)(select => {
@ -51,17 +52,28 @@ function Edit({
return cover; return cover;
} }
}); });
function handleOnChangeTitle(newTitle) { function onChangeTitle(newTitle) {
setAttributes({ setAttributes({
pageHeaderTitle: newTitle pageHeaderTitle: newTitle
}); });
} }
function handleOnChangeDescription(newDescription) { function onChangeHasCta(newHasCta) {
console.log("newHasCta", newHasCta);
setAttributes({
hasCta: !hasCta
});
if (!newHasCta) {
setAttributes({
cta: undefined
});
}
}
function onChangeDescription(newDescription) {
setAttributes({ setAttributes({
pageHeaderDescription: newDescription pageHeaderDescription: newDescription
}); });
} }
function handleOnChangeCTA(newCtaValue) { function onChangeCTA(newCtaValue) {
setAttributes({ setAttributes({
cta: { cta: {
title: !cta || !cta.title ? newCtaValue.title : cta.title, title: !cta || !cta.title ? newCtaValue.title : cta.title,
@ -83,7 +95,11 @@ function Edit({
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, { return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
className: "homegrade-blocks-content-page-header__panel-cta", className: "homegrade-blocks-content-page-header__panel-cta",
title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Call to action", "homegrade-blocks__texte-fonctionnel") title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Call to action", "homegrade-blocks__texte-fonctionnel")
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextControl, { }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
label: "Afficher un call to action",
checked: hasCta,
onChange: onChangeHasCta
}), hasCta && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextControl, {
label: "Titre du cta", label: "Titre du cta",
value: cta && cta.title ? cta.title : "", value: cta && cta.title ? cta.title : "",
onChange: onChangeTextControl onChange: onChangeTextControl
@ -91,11 +107,8 @@ function Edit({
label: "Lien du cta", label: "Lien du cta",
title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Call to action", "homegrade-blocks__texte-fonctionnel"), title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Call to action", "homegrade-blocks__texte-fonctionnel"),
value: cta, value: cta,
onChange: e => { onChange: onChangeCTA
console.log("loading", e); })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
handleOnChangeCTA(e);
}
}))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.useBlockProps)({ ...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.useBlockProps)({
className: `homegrade-blocks-content-page-header block-content-page-header` className: `homegrade-blocks-content-page-header block-content-page-header`
}) })
@ -105,13 +118,13 @@ function Edit({
tagName: "h2", tagName: "h2",
placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Ajouter ici le Titre du Bloc Header", "homegrade"), placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Ajouter ici le Titre du Bloc Header", "homegrade"),
value: pageHeaderTitle, value: pageHeaderTitle,
onChange: handleOnChangeTitle onChange: onChangeTitle
// style={{ textAlign: props.attributes.alignment }} // style={{ textAlign: props.attributes.alignment }}
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.RichText, { }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.RichText, {
tagName: "p", tagName: "p",
placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Ajouter ici le texte d'introduction de cette page", "homegrade"), placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Ajouter ici le texte d'introduction de cette page", "homegrade"),
value: pageHeaderDescription, value: pageHeaderDescription,
onChange: handleOnChangeDescription onChange: onChangeDescription
// style={{ textAlign: props.attributes.alignment }} // style={{ textAlign: props.attributes.alignment }}
}), cta && cta.title && cta.url && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", { }), cta && cta.title && cta.url && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
href: cta.url href: cta.url
@ -254,7 +267,7 @@ module.exports = window["wp"]["i18n"];
\************************/ \************************/
/***/ ((module) => { /***/ ((module) => {
module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/content-page-header","version":"0.1.0","title":"Content page header","category":"homegrade-blocks","icon":"smiley","description":"Bloc bannière/header de contenu de premier niveau pour les pages de contenu","supports":{"html":false},"textdomain":"homegrade-blocks","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","render":"file:./render.php","attributes":{"pageHeaderTitle":{"type":"string"},"pageHeaderDescription":{"type":"string"},"cta":{"type":"object"}}}'); module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/content-page-header","version":"0.1.0","title":"Content page header","category":"homegrade-blocks","icon":"smiley","description":"Bloc bannière/header de contenu de premier niveau pour les pages de contenu","supports":{"html":false},"textdomain":"homegrade-blocks","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","render":"file:./render.php","attributes":{"pageHeaderTitle":{"type":"string"},"pageHeaderDescription":{"type":"string"},"hasCta":{"type":"boolean","default":false},"cta":{"type":"object"}}}');
/***/ }) /***/ })

2
blocks/content-page-header/build/index.js.map
View File

File diff suppressed because one or more lines are too long

4
blocks/content-page-header/src/block.json
View File

@ -22,6 +22,10 @@
"pageHeaderDescription": { "pageHeaderDescription": {
"type": "string" "type": "string"
}, },
"hasCta": {
"type": "boolean",
"default": false
},
"cta": { "cta": {
"type": "object" "type": "object"
} }

57
blocks/content-page-header/src/edit.js
View File

@ -8,10 +8,10 @@ import {
InspectorControls, InspectorControls,
__experimentalLinkControl as LinkControl, __experimentalLinkControl as LinkControl,
} from "@wordpress/block-editor"; } from "@wordpress/block-editor";
import { PanelBody, TextControl } from "@wordpress/components"; import { PanelBody, TextControl, ToggleControl } from "@wordpress/components";
export default function Edit({ attributes, setAttributes }) { export default function Edit({ attributes, setAttributes }) {
const { pageHeaderTitle, pageHeaderDescription, cta } = attributes; const { pageHeaderTitle, pageHeaderDescription, hasCta, cta } = attributes;
const pageTitle = useSelect((select) => { const pageTitle = useSelect((select) => {
const { getEditedPostAttribute } = select("core/editor"); const { getEditedPostAttribute } = select("core/editor");
@ -26,13 +26,20 @@ export default function Edit({ attributes, setAttributes }) {
} }
}); });
function handleOnChangeTitle(newTitle) { function onChangeTitle(newTitle) {
setAttributes({ pageHeaderTitle: newTitle }); setAttributes({ pageHeaderTitle: newTitle });
} }
function handleOnChangeDescription(newDescription) { function onChangeHasCta(newHasCta) {
console.log("newHasCta", newHasCta);
setAttributes({ hasCta: !hasCta });
if (!newHasCta) {
setAttributes({ cta: undefined });
}
}
function onChangeDescription(newDescription) {
setAttributes({ pageHeaderDescription: newDescription }); setAttributes({ pageHeaderDescription: newDescription });
} }
function handleOnChangeCTA(newCtaValue) { function onChangeCTA(newCtaValue) {
setAttributes({ setAttributes({
cta: { cta: {
title: !cta || !cta.title ? newCtaValue.title : cta.title, title: !cta || !cta.title ? newCtaValue.title : cta.title,
@ -59,20 +66,30 @@ export default function Edit({ attributes, setAttributes }) {
className="homegrade-blocks-content-page-header__panel-cta" className="homegrade-blocks-content-page-header__panel-cta"
title={__("Call to action", "homegrade-blocks__texte-fonctionnel")} title={__("Call to action", "homegrade-blocks__texte-fonctionnel")}
> >
<TextControl <ToggleControl
label="Titre du cta" label="Afficher un call to action"
value={cta && cta.title ? cta.title : ""} checked={hasCta}
onChange={onChangeTextControl} onChange={onChangeHasCta}
/>
<LinkControl
label="Lien du cta"
title={__("Call to action", "homegrade-blocks__texte-fonctionnel")}
value={cta}
onChange={(e) => {
console.log("loading", e);
handleOnChangeCTA(e);
}}
/> />
{hasCta && (
<>
<TextControl
label="Titre du cta"
value={cta && cta.title ? cta.title : ""}
onChange={onChangeTextControl}
/>
<LinkControl
label="Lien du cta"
title={__(
"Call to action",
"homegrade-blocks__texte-fonctionnel"
)}
value={cta}
onChange={onChangeCTA}
/>
</>
)}
</PanelBody> </PanelBody>
</InspectorControls> </InspectorControls>
<section <section
@ -87,7 +104,7 @@ export default function Edit({ attributes, setAttributes }) {
tagName="h2" tagName="h2"
placeholder={__("Ajouter ici le Titre du Bloc Header", "homegrade")} placeholder={__("Ajouter ici le Titre du Bloc Header", "homegrade")}
value={pageHeaderTitle} value={pageHeaderTitle}
onChange={handleOnChangeTitle} onChange={onChangeTitle}
// style={{ textAlign: props.attributes.alignment }} // style={{ textAlign: props.attributes.alignment }}
/> />
<RichText <RichText
@ -97,7 +114,7 @@ export default function Edit({ attributes, setAttributes }) {
"homegrade" "homegrade"
)} )}
value={pageHeaderDescription} value={pageHeaderDescription}
onChange={handleOnChangeDescription} onChange={onChangeDescription}
// style={{ textAlign: props.attributes.alignment }} // style={{ textAlign: props.attributes.alignment }}
/> />
{cta && cta.title && cta.url && <a href={cta.url}>{cta.title}</a>} {cta && cta.title && cta.url && <a href={cta.url}>{cta.title}</a>}