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

handling hasIconTitle toggle

Browse Source
This commit is contained in:
Antoine M 2023-11-24 17:08:46 +01:00
parent 39b6befd5f
commit 9a354713c2
7 changed files with 74 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
blocks/highlight/build/block.json
View File

@ -28,6 +28,10 @@
"type": "boolean", "type": "boolean",
"default": true "default": true
}, },
"hasTitleIcon": {
"type": "boolean",
"default": true
},
"hasLogo": { "hasLogo": {
"type": "boolean", "type": "boolean",
"default": false "default": false

2
blocks/highlight/build/index.asset.php
View File

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

27
blocks/highlight/build/index.js
View File

@ -202,6 +202,7 @@ function Edit({
title, title,
iconName, iconName,
hasTitle, hasTitle,
hasTitleIcon,
hasLogo, hasLogo,
variant, variant,
logoAlt, logoAlt,
@ -236,6 +237,11 @@ function Edit({
title: undefined title: undefined
}); });
} }
function onhasTitleIconChange() {
setAttributes({
hasTitleIcon: !hasTitleIcon
});
}
function onVariantChange(variant) { function onVariantChange(variant) {
setAttributes({ setAttributes({
variant variant
@ -283,13 +289,17 @@ function Edit({
label: "Afficher le titre", label: "Afficher le titre",
checked: hasTitle, checked: hasTitle,
onChange: onHasTitleChange onChange: onHasTitleChange
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, {
label: "Icone pour le titre",
checked: hasTitleIcon,
onChange: onhasTitleIconChange
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, { }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, {
label: "Attacher un logo", label: "Attacher un logo",
checked: hasLogo, checked: hasLogo,
onChange: onHasLogoChange onChange: onHasLogoChange
})), hasLogo && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, { })), hasLogo && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
className: "homegrade-blocks-highlight__panel-body", className: "homegrade-blocks-highlight__panel-body",
title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Logo", "homegrade-blocks__texte-backoffice") title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Logo", "homegrade-blocks")
}, logoUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", { }, logoUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: logoUrl, src: logoUrl,
alt: logoAlt alt: logoAlt
@ -301,7 +311,7 @@ function Edit({
allowedTypes: ["image"], allowedTypes: ["image"],
accept: "image/*", accept: "image/*",
onSelect: setLogoAttributes, onSelect: setLogoAttributes,
name: !logoUrl ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Ajouter un Logo", "homegrade-blocks__texte-backoffice") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Remplacer", "homegrade-blocks__texte-backoffice") name: !logoUrl ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Ajouter un Logo", "homegrade-blocks") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Remplacer", "homegrade-blocks")
}), logoUrl && (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_8__.Button, { }), logoUrl && (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_8__.Button, {
className: "custom-flow-button", className: "custom-flow-button",
variant: "primary", variant: "primary",
@ -333,8 +343,8 @@ function Edit({
className: `homegrade-blocks-highlight ${variant ? `homegrade-blocks-highlight--${variant}` : ""}` className: `homegrade-blocks-highlight ${variant ? `homegrade-blocks-highlight--${variant}` : ""}`
}) })
}, hasTitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { }, hasTitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-highlight__titling" className: `homegrade-blocks-highlight__titling ${!hasTitleIcon ? "homegrade-blocks-highlight__titling--has-no-icon" : ""}`
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { }, hasTitleIcon && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "icon" className: "icon"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", { }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: iconPicture, src: iconPicture,
@ -361,7 +371,7 @@ function Edit({
allowedTypes: ["image"], allowedTypes: ["image"],
accept: "image/*", accept: "image/*",
onSelect: setLogoAttributes, onSelect: setLogoAttributes,
name: !logoUrl ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Ajouter Logo", "homegrade-blocks__texte-backoffice") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Remplacer", "homegrade-blocks__texte-backoffice") name: !logoUrl ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Ajouter Logo", "homegrade-blocks") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Remplacer", "homegrade-blocks")
}), logoUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", { }), logoUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: logoUrl, src: logoUrl,
alt: logoAlt alt: logoAlt
@ -447,6 +457,7 @@ function save({
title, title,
iconName, iconName,
hasTitle, hasTitle,
hasTitleIcon,
variant, variant,
hasLogo, hasLogo,
logoAlt, logoAlt,
@ -470,8 +481,8 @@ function save({
className: `homegrade-blocks-highlight ${variant ? `homegrade-blocks-highlight--${variant}` : ""}` className: `homegrade-blocks-highlight ${variant ? `homegrade-blocks-highlight--${variant}` : ""}`
}) })
}, hasTitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { }, hasTitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-highlight__titling" className: `homegrade-blocks-highlight__titling ${!hasTitleIcon ? "homegrade-blocks-highlight__titling--has-no-icon" : ""}`
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", { }, hasTitleIcon && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "icon" className: "icon"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", { }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
clas: true, clas: true,
@ -636,7 +647,7 @@ module.exports = window["wp"]["primitives"];
\************************/ \************************/
/***/ ((module) => { /***/ ((module) => {
module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/highlight","version":"0.1.0","title":"Mise en avant","category":"homegrade-blocks","description":"Bloc pour mettre en avant des informations importantes","supports":{"html":false,"anchor":true},"textdomain":"homegrade-blocks__texte-fonctionnel","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","attributes":{"title":{"type":"string","source":"html","selector":"h3"},"iconName":{"type":"string","default":"key"},"hasTitle":{"type":"boolean","default":true},"hasLogo":{"type":"boolean","default":false},"logoId":{"type":"number"},"logoAlt":{"type":"string"},"logoUrl":{"type":"string"},"variant":{"type":"string","default":"classic"}}}'); module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/highlight","version":"0.1.0","title":"Mise en avant","category":"homegrade-blocks","description":"Bloc pour mettre en avant des informations importantes","supports":{"html":false,"anchor":true},"textdomain":"homegrade-blocks__texte-fonctionnel","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","attributes":{"title":{"type":"string","source":"html","selector":"h3"},"iconName":{"type":"string","default":"key"},"hasTitle":{"type":"boolean","default":true},"hasTitleIcon":{"type":"boolean","default":true},"hasLogo":{"type":"boolean","default":false},"logoId":{"type":"number"},"logoAlt":{"type":"string"},"logoUrl":{"type":"string"},"variant":{"type":"string","default":"classic"}}}');
/***/ }) /***/ })

2
blocks/highlight/build/index.js.map
View File

File diff suppressed because one or more lines are too long

4
blocks/highlight/src/block.json
View File

@ -28,6 +28,10 @@
"type": "boolean", "type": "boolean",
"default": true "default": true
}, },
"hasTitleIcon": {
"type": "boolean",
"default": true
},
"hasLogo": { "hasLogo": {
"type": "boolean", "type": "boolean",
"default": false "default": false

21
blocks/highlight/src/edit.js
View File

@ -28,6 +28,7 @@ export default function Edit({ attributes, setAttributes }) {
title, title,
iconName, iconName,
hasTitle, hasTitle,
hasTitleIcon,
hasLogo, hasLogo,
variant, variant,
logoAlt, logoAlt,
@ -63,6 +64,11 @@ export default function Edit({ attributes, setAttributes }) {
title: undefined, title: undefined,
}); });
} }
function onhasTitleIconChange() {
setAttributes({
hasTitleIcon: !hasTitleIcon,
});
}
function onVariantChange(variant) { function onVariantChange(variant) {
setAttributes({ variant }); setAttributes({ variant });
} }
@ -116,6 +122,11 @@ export default function Edit({ attributes, setAttributes }) {
checked={hasTitle} checked={hasTitle}
onChange={onHasTitleChange} onChange={onHasTitleChange}
/> />
<ToggleControl
label="Icone pour le titre"
checked={hasTitleIcon}
onChange={onhasTitleIconChange}
/>
<ToggleControl <ToggleControl
label="Attacher un logo" label="Attacher un logo"
checked={hasLogo} checked={hasLogo}
@ -191,10 +202,18 @@ export default function Edit({ attributes, setAttributes }) {
})} })}
> >
{hasTitle && ( {hasTitle && (
<div className="homegrade-blocks-highlight__titling"> <div
className={`homegrade-blocks-highlight__titling ${
!hasTitleIcon
? "homegrade-blocks-highlight__titling--has-no-icon"
: ""
}`}
>
{hasTitleIcon && (
<div className="icon"> <div className="icon">
<img src={iconPicture} alt="" /> <img src={iconPicture} alt="" />
</div> </div>
)}
<RichText <RichText
className="homegrade-blocks-highlight__block-title" className="homegrade-blocks-highlight__block-title"
onChange={onTitleChange} onChange={onTitleChange}

22
blocks/highlight/src/save.js
View File

@ -7,8 +7,16 @@ import houseIcon from "./img/icon_house.svg";
import bulbIcon from "./img/icon_bulb.svg"; import bulbIcon from "./img/icon_bulb.svg";
export default function save({ attributes }) { export default function save({ attributes }) {
const { title, iconName, hasTitle, variant, hasLogo, logoAlt, logoUrl } = const {
attributes; title,
iconName,
hasTitle,
hasTitleIcon,
variant,
hasLogo,
logoAlt,
logoUrl,
} = attributes;
function getIconPicture() { function getIconPicture() {
switch (iconName) { switch (iconName) {
case "key": case "key":
@ -35,10 +43,18 @@ export default function save({ attributes }) {
})} })}
> >
{hasTitle && ( {hasTitle && (
<div className="homegrade-blocks-highlight__titling"> <div
className={`homegrade-blocks-highlight__titling ${
!hasTitleIcon
? "homegrade-blocks-highlight__titling--has-no-icon"
: ""
}`}
>
{hasTitleIcon && (
<div className="icon"> <div className="icon">
<img clas src={iconPicture} alt="" /> <img clas src={iconPicture} alt="" />
</div> </div>
)}
<RichText.Content <RichText.Content
tagName="h3" tagName="h3"