handling hasIconTitle toggle
This commit is contained in:
parent
39b6befd5f
commit
9a354713c2
|
|
@ -28,6 +28,10 @@
|
|||
"type": "boolean",
|
||||
"default": true
|
||||
},
|
||||
"hasTitleIcon": {
|
||||
"type": "boolean",
|
||||
"default": true
|
||||
},
|
||||
"hasLogo": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
|
|
|
|||
|
|
@ -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');
|
||||
|
|
|
|||
|
|
@ -202,6 +202,7 @@ function Edit({
|
|||
title,
|
||||
iconName,
|
||||
hasTitle,
|
||||
hasTitleIcon,
|
||||
hasLogo,
|
||||
variant,
|
||||
logoAlt,
|
||||
|
|
@ -236,6 +237,11 @@ function Edit({
|
|||
title: undefined
|
||||
});
|
||||
}
|
||||
function onhasTitleIconChange() {
|
||||
setAttributes({
|
||||
hasTitleIcon: !hasTitleIcon
|
||||
});
|
||||
}
|
||||
function onVariantChange(variant) {
|
||||
setAttributes({
|
||||
variant
|
||||
|
|
@ -283,13 +289,17 @@ function Edit({
|
|||
label: "Afficher le titre",
|
||||
checked: hasTitle,
|
||||
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, {
|
||||
label: "Attacher un logo",
|
||||
checked: hasLogo,
|
||||
onChange: onHasLogoChange
|
||||
})), hasLogo && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
|
||||
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", {
|
||||
src: logoUrl,
|
||||
alt: logoAlt
|
||||
|
|
@ -301,7 +311,7 @@ function Edit({
|
|||
allowedTypes: ["image"],
|
||||
accept: "image/*",
|
||||
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, {
|
||||
className: "custom-flow-button",
|
||||
variant: "primary",
|
||||
|
|
@ -333,8 +343,8 @@ function Edit({
|
|||
className: `homegrade-blocks-highlight ${variant ? `homegrade-blocks-highlight--${variant}` : ""}`
|
||||
})
|
||||
}, hasTitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
className: "homegrade-blocks-highlight__titling"
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
className: `homegrade-blocks-highlight__titling ${!hasTitleIcon ? "homegrade-blocks-highlight__titling--has-no-icon" : ""}`
|
||||
}, hasTitleIcon && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
className: "icon"
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
|
||||
src: iconPicture,
|
||||
|
|
@ -361,7 +371,7 @@ function Edit({
|
|||
allowedTypes: ["image"],
|
||||
accept: "image/*",
|
||||
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", {
|
||||
src: logoUrl,
|
||||
alt: logoAlt
|
||||
|
|
@ -447,6 +457,7 @@ function save({
|
|||
title,
|
||||
iconName,
|
||||
hasTitle,
|
||||
hasTitleIcon,
|
||||
variant,
|
||||
hasLogo,
|
||||
logoAlt,
|
||||
|
|
@ -470,8 +481,8 @@ function save({
|
|||
className: `homegrade-blocks-highlight ${variant ? `homegrade-blocks-highlight--${variant}` : ""}`
|
||||
})
|
||||
}, hasTitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
className: "homegrade-blocks-highlight__titling"
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
className: `homegrade-blocks-highlight__titling ${!hasTitleIcon ? "homegrade-blocks-highlight__titling--has-no-icon" : ""}`
|
||||
}, hasTitleIcon && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
|
||||
className: "icon"
|
||||
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
|
||||
clas: true,
|
||||
|
|
@ -636,7 +647,7 @@ module.exports = window["wp"]["primitives"];
|
|||
\************************/
|
||||
/***/ ((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"}}}');
|
||||
|
||||
/***/ })
|
||||
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -28,6 +28,10 @@
|
|||
"type": "boolean",
|
||||
"default": true
|
||||
},
|
||||
"hasTitleIcon": {
|
||||
"type": "boolean",
|
||||
"default": true
|
||||
},
|
||||
"hasLogo": {
|
||||
"type": "boolean",
|
||||
"default": false
|
||||
|
|
|
|||
|
|
@ -28,6 +28,7 @@ export default function Edit({ attributes, setAttributes }) {
|
|||
title,
|
||||
iconName,
|
||||
hasTitle,
|
||||
hasTitleIcon,
|
||||
hasLogo,
|
||||
variant,
|
||||
logoAlt,
|
||||
|
|
@ -63,6 +64,11 @@ export default function Edit({ attributes, setAttributes }) {
|
|||
title: undefined,
|
||||
});
|
||||
}
|
||||
function onhasTitleIconChange() {
|
||||
setAttributes({
|
||||
hasTitleIcon: !hasTitleIcon,
|
||||
});
|
||||
}
|
||||
function onVariantChange(variant) {
|
||||
setAttributes({ variant });
|
||||
}
|
||||
|
|
@ -116,6 +122,11 @@ export default function Edit({ attributes, setAttributes }) {
|
|||
checked={hasTitle}
|
||||
onChange={onHasTitleChange}
|
||||
/>
|
||||
<ToggleControl
|
||||
label="Icone pour le titre"
|
||||
checked={hasTitleIcon}
|
||||
onChange={onhasTitleIconChange}
|
||||
/>
|
||||
<ToggleControl
|
||||
label="Attacher un logo"
|
||||
checked={hasLogo}
|
||||
|
|
@ -191,10 +202,18 @@ export default function Edit({ attributes, setAttributes }) {
|
|||
})}
|
||||
>
|
||||
{hasTitle && (
|
||||
<div className="homegrade-blocks-highlight__titling">
|
||||
<div className="icon">
|
||||
<img src={iconPicture} alt="" />
|
||||
</div>
|
||||
<div
|
||||
className={`homegrade-blocks-highlight__titling ${
|
||||
!hasTitleIcon
|
||||
? "homegrade-blocks-highlight__titling--has-no-icon"
|
||||
: ""
|
||||
}`}
|
||||
>
|
||||
{hasTitleIcon && (
|
||||
<div className="icon">
|
||||
<img src={iconPicture} alt="" />
|
||||
</div>
|
||||
)}
|
||||
<RichText
|
||||
className="homegrade-blocks-highlight__block-title"
|
||||
onChange={onTitleChange}
|
||||
|
|
|
|||
|
|
@ -7,8 +7,16 @@ import houseIcon from "./img/icon_house.svg";
|
|||
import bulbIcon from "./img/icon_bulb.svg";
|
||||
|
||||
export default function save({ attributes }) {
|
||||
const { title, iconName, hasTitle, variant, hasLogo, logoAlt, logoUrl } =
|
||||
attributes;
|
||||
const {
|
||||
title,
|
||||
iconName,
|
||||
hasTitle,
|
||||
hasTitleIcon,
|
||||
variant,
|
||||
hasLogo,
|
||||
logoAlt,
|
||||
logoUrl,
|
||||
} = attributes;
|
||||
function getIconPicture() {
|
||||
switch (iconName) {
|
||||
case "key":
|
||||
|
|
@ -35,10 +43,18 @@ export default function save({ attributes }) {
|
|||
})}
|
||||
>
|
||||
{hasTitle && (
|
||||
<div className="homegrade-blocks-highlight__titling">
|
||||
<div className="icon">
|
||||
<img clas src={iconPicture} alt="" />
|
||||
</div>
|
||||
<div
|
||||
className={`homegrade-blocks-highlight__titling ${
|
||||
!hasTitleIcon
|
||||
? "homegrade-blocks-highlight__titling--has-no-icon"
|
||||
: ""
|
||||
}`}
|
||||
>
|
||||
{hasTitleIcon && (
|
||||
<div className="icon">
|
||||
<img clas src={iconPicture} alt="" />
|
||||
</div>
|
||||
)}
|
||||
|
||||
<RichText.Content
|
||||
tagName="h3"
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user