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

handling a block variation with a side icon, and enlarging the icon set
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Antoine M 2025-03-17 16:15:40 +01:00
parent 403ddcdbec
commit b8401b051e
22 changed files with 902 additions and 119 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -28,7 +28,7 @@
"type": "boolean",
"default": true
},
"hasTitleIcon": {
"hasIcon": {
"type": "boolean",
"default": true
},
@ -48,6 +48,10 @@
"variant": {
"type": "string",
"default": "classic"
},
"iconPosition": {
"type": "string",
"default": "top"
}
}
}

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' => '9a335689fe2a53970db8');
<?php return array('dependencies' => array('react', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => '0bed76be52094908dcf1');

15
blocks/highlight/build/index.css
View File

@ -1,6 +1,6 @@
/*!****************************************************************************************************************************************************************************************************************************************!*\
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/editor.scss ***!
\****************************************************************************************************************************************************************************************************************************************/
/*!****************************************************************************************************************************************************************************************************************************************************!*\
!*** css ../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!../../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/editor.scss ***!
\****************************************************************************************************************************************************************************************************************************************************/
/**
* The following styles get applied inside the editor only.
*
@ -53,4 +53,13 @@
align-items: center;
}
.homegrade-blocks-highlight__icon-position {
margin: 20px 0;
}
.homegrade-blocks-highlight__icon-position legend {
font-size: 15px !important;
text-transform: none !important;
color: #585858;
}
/*# sourceMappingURL=index.css.map*/

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

@ -1 +1 @@
{"version":3,"file":"index.css","mappings":";;;AAAA;;;;EAAA;AAQE;EACC;AAFH;AAME;EACC;AAJH;AASE;EAEC;EACA;AARH;AAUE;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AARH;;AAcC;EACC;AAXF;AAYE;EACC;AAVH;;AAgBC;EACC;EACA;AAbF;AAeC;EACC;AAbF;AAeC;EACC;EACA;EAAA;AAbF;AAeC;EACC;EACA;EACA;EACA;AAbF,C","sources":["webpack://multiblocks/./src/editor.scss"],"sourcesContent":["/**\n * The following styles get applied inside the editor only.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n.homegrade-blocks-highlight {\n\t&--classic {\n\t\t.wp-block-button__link {\n\t\t\tbackground-color: #df1e1e !important;\n\t\t}\n\t}\n\t&--warning {\n\t\t&:after {\n\t\t\tz-index: 0 !important;\n\t\t}\n\t}\n\n\tul {\n\t\tli {\n\t\t\t// list-style: none !important;\n\t\t\tdisplay: flex;\n\t\t\tpadding: 10px 0;\n\t\t}\n\t\tli:before {\n\t\t\ttransform: translateY(6px);\n\t\t\tflex-shrink: 0;\n\t\t\tborder-radius: 50%;\n\t\t\tcontent: \"\";\n\t\t\twidth: 10px;\n\t\t\theight: 10px;\n\t\t\tdisplay: inline-block;\n\t\t\tmargin-right: 10px;\n\t\t}\n\t}\n}\n\n.homegrade-blocks-highlight__variant {\n\t.components-toggle-group-control-option-base[aria-checked=\"true\"] {\n\t\tbackground-color: #e04d42;\n\t\t&:focus {\n\t\t\toutline: none;\n\t\t}\n\t}\n}\n\n.homegrade-blocks-highlight__panel-body {\n\t.components-dropdown .components-toolbar__control {\n\t\tbackground-color: #e04d42;\n\t\tcolor: white;\n\t}\n\timg {\n\t\tdisplay: block;\n\t}\n\t.components-dropdown {\n\t\tdisplay: block;\n\t\twidth: fit-content;\n\t}\n\t.media-replace-container {\n\t\tpadding: 10px 0;\n\t\tdisplay: flex;\n\t\tgap: 10px;\n\t\talign-items: center;\n\t\t// margin-top: 10px;\n\t}\n}\n"],"names":[],"sourceRoot":""}
{"version":3,"file":"index.css","mappings":";;;AAAA;;;;EAAA;AAQE;EACC;AAFH;AAME;EACC;AAJH;AASE;EAEC;EACA;AARH;AAUE;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AARH;;AAcC;EACC;AAXF;AAYE;EACC;AAVH;;AAgBC;EACC;EACA;AAbF;AAeC;EACC;AAbF;AAeC;EACC;EACA;EAAA;AAbF;AAeC;EACC;EACA;EACA;EACA;AAbF;;AAkBA;EACC;AAfD;AAgBC;EACC;EAEA;EACA;AAfF,C","sources":["webpack://multiblocks/./src/editor.scss"],"sourcesContent":["/**\n * The following styles get applied inside the editor only.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n.homegrade-blocks-highlight {\n\t&--classic {\n\t\t.wp-block-button__link {\n\t\t\tbackground-color: #df1e1e !important;\n\t\t}\n\t}\n\t&--warning {\n\t\t&:after {\n\t\t\tz-index: 0 !important;\n\t\t}\n\t}\n\n\tul {\n\t\tli {\n\t\t\t// list-style: none !important;\n\t\t\tdisplay: flex;\n\t\t\tpadding: 10px 0;\n\t\t}\n\t\tli:before {\n\t\t\ttransform: translateY(6px);\n\t\t\tflex-shrink: 0;\n\t\t\tborder-radius: 50%;\n\t\t\tcontent: \"\";\n\t\t\twidth: 10px;\n\t\t\theight: 10px;\n\t\t\tdisplay: inline-block;\n\t\t\tmargin-right: 10px;\n\t\t}\n\t}\n}\n\n.homegrade-blocks-highlight__variant {\n\t.components-toggle-group-control-option-base[aria-checked=\"true\"] {\n\t\tbackground-color: #e04d42;\n\t\t&:focus {\n\t\t\toutline: none;\n\t\t}\n\t}\n}\n\n.homegrade-blocks-highlight__panel-body {\n\t.components-dropdown .components-toolbar__control {\n\t\tbackground-color: #e04d42;\n\t\tcolor: white;\n\t}\n\timg {\n\t\tdisplay: block;\n\t}\n\t.components-dropdown {\n\t\tdisplay: block;\n\t\twidth: fit-content;\n\t}\n\t.media-replace-container {\n\t\tpadding: 10px 0;\n\t\tdisplay: flex;\n\t\tgap: 10px;\n\t\talign-items: center;\n\t\t// margin-top: 10px;\n\t}\n}\n\n.homegrade-blocks-highlight__icon-position {\n\tmargin: 20px 0;\n\tlegend {\n\t\tfont-size: 15px !important;\n\t\t// font-weight: 400 !important;\n\t\ttext-transform: none !important;\n\t\tcolor: #585858;\n\t}\n}\n"],"names":[],"sourceRoot":""}

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

@ -2,6 +2,45 @@
/******/ "use strict";
/******/ var __webpack_modules__ = ({
/***/ "./src/img/icon_acoustic.svg":
/*!***********************************!*\
!*** ./src/img/icon_acoustic.svg ***!
\***********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ReactComponent: () => (/* binding */ SvgIconAcoustic),
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
var _path, _path2;
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var SvgIconAcoustic = function SvgIconAcoustic(props) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 10.62 11"
}, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
stroke: "#fff",
fill: "#fff",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M4.75 1.44c-.37.32-.62.66-.79.93h-1.5c-1.09 0-1.97.88-1.97 1.97v2.34c0 1.09.88 1.97 1.97 1.97h1.5c.24.3.59.67 1.07 1.01.7.5 1.38.74 1.83.85V.5c-.42.06-1.31.24-2.12.94Z"
})), _path2 || (_path2 = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
stroke: "#fff",
fill: "none",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M9.04 3.13c.13.12 1.19 1.11 1.06 2.63-.1 1.21-.88 1.95-1.06 2.11"
})));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iYWNvdXN0aXF1ZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgMTAuNjIgMTEiPgogIDxwYXRoIHN0cm9rZT0id2hpdGUiIGZpbGw9IndoaXRlIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGQ9Ik00Ljc1LDEuNDRjLS4zNy4zMi0uNjIuNjYtLjc5LjkzaC0xLjVjLTEuMDksMC0xLjk3Ljg4LTEuOTcsMS45N3YyLjM0YzAsMS4wOS44OCwxLjk3LDEuOTcsMS45N2gxLjVjLjI0LjMuNTkuNjcsMS4wNywxLjAxLjcuNSwxLjM4Ljc0LDEuODMuODVWLjVjLS40Mi4wNi0xLjMxLjI0LTIuMTIuOTRaIi8+CiAgPHBhdGggc3Ryb2tlPSJ3aGl0ZSIgZmlsbD0ibm9uZSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBkPSJNOS4wNCwzLjEzYy4xMy4xMiwxLjE5LDEuMTEsMS4wNiwyLjYzLS4xLDEuMjEtLjg4LDEuOTUtMS4wNiwyLjExIi8+Cjwvc3ZnPg==");
/***/ }),
/***/ "./src/img/icon_block_chain.svg":
/*!**************************************!*\
!*** ./src/img/icon_block_chain.svg ***!
@ -88,6 +127,50 @@ var SvgIconBulb = function SvgIconBulb(props) {
/***/ }),
/***/ "./src/img/icon_documentation.svg":
/*!****************************************!*\
!*** ./src/img/icon_documentation.svg ***!
\****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ReactComponent: () => (/* binding */ SvgIconDocumentation),
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
var _g, _path;
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var SvgIconDocumentation = function SvgIconDocumentation(props) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 7.38 8.98"
}, props), _g || (_g = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("g", {
"data-name": "Icon feather-book",
stroke: "#fff",
strokeLinecap: "round",
strokeLinejoin: "round",
fill: "none"
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
"data-name": "Trac\\xE9 20347",
d: "M.5 7.48c0-.55.45-1 1-1h5.38"
}), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
"data-name": "Trac\\xE9 20348",
d: "M1.5.5h5.38v7.98H1.5c-.55 0-1-.45-1-1V1.5c0-.55.45-1 1-1Z"
}))), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
stroke: "#fff",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M2.88 2.98h1.94"
})));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iZG9jdW1lbnRhdGlvbiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNy4zOCA4Ljk4Ij4KICA8ZyBpZD0iSWNvbl9mZWF0aGVyLWJvb2siIGRhdGEtbmFtZT0iSWNvbiBmZWF0aGVyLWJvb2siPgogICAgPHBhdGggaWQ9IlRyYWPDqV8yMDM0NyIgZGF0YS1uYW1lPSJUcmFjw6kgMjAzNDciIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgZmlsbD0ibm9uZSIgZD0iTS41LDcuNDhjMC0uNTUuNDUtMSwxLTFoNS4zOCIvPgogICAgPHBhdGggaWQ9IlRyYWPDqV8yMDM0OCIgZGF0YS1uYW1lPSJUcmFjw6kgMjAzNDgiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgZmlsbD0ibm9uZSIgZD0iTTEuNS41aDUuMzh2Ny45OEgxLjVjLS41NSwwLTEtLjQ1LTEtMVYxLjVjMC0uNTUuNDUtMSwxLTFaIi8+CiAgPC9nPgogIDxsaW5lIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgeDE9IjIuODgiIHkxPSIyLjk4IiB4Mj0iNC44MiIgeTI9IjIuOTgiLz4KPC9zdmc+");
/***/ }),
/***/ "./src/img/icon_feather_key.svg":
/*!**************************************!*\
!*** ./src/img/icon_feather_key.svg ***!
@ -160,6 +243,313 @@ var SvgIconHouse = function SvgIconHouse(props) {
/***/ }),
/***/ "./src/img/icon_info.svg":
/*!*******************************!*\
!*** ./src/img/icon_info.svg ***!
\*******************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ReactComponent: () => (/* binding */ SvgIconInfo),
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
var _path;
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var SvgIconInfo = function SvgIconInfo(props) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1 6.18"
}, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
stroke: "#fff",
fill: "none",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M.5 2.41v3.27M.5.5h0"
})));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iaW5mbyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgMSA2LjE4Ij4KICA8bGluZSBzdHJva2U9IndoaXRlIiBmaWxsPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgeDE9Ii41IiB5MT0iMi40MSIgeDI9Ii41IiB5Mj0iNS42OCIvPgogIDxsaW5lIHN0cm9rZT0id2hpdGUiIGZpbGw9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiB4MT0iLjUiIHkxPSIuNSIgeDI9Ii41IiB5Mj0iLjUiLz4KPC9zdmc+");
/***/ }),
/***/ "./src/img/icon_notification.svg":
/*!***************************************!*\
!*** ./src/img/icon_notification.svg ***!
\***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ReactComponent: () => (/* binding */ SvgIconNotification),
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
var _path;
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var SvgIconNotification = function SvgIconNotification(props) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 8.61 10.45"
}, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
stroke: "#fff",
fill: "none",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M4.31.5v.55c.77.12 1.21.41 1.42.59.83.69.9 1.74.96 2.6.06.88-.11 1 .02 1.56.21.88.86 1.51 1.39 1.92H4.3s0 0 0 0H.5c.54-.41 1.18-1.04 1.39-1.92.13-.56-.04-.68.02-1.56.06-.86.13-1.92.96-2.6.22-.18.66-.47 1.42-.59V.5M3.34 9.29c.15.39.52.65.93.66.43.01.82-.25.98-.66"
})));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0ibm90aWZpY2F0aW9uIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA4LjYxIDEwLjQ1Ij4KICA8cGF0aCBzdHJva2U9IndoaXRlIiBmaWxsPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgZD0iTTQuMzEuNXYuNTVjLjc3LjEyLDEuMjEuNDEsMS40Mi41OS44My42OS45LDEuNzQuOTYsMi42LjA2Ljg4LS4xMSwxLC4wMiwxLjU2LjIxLjg4Ljg2LDEuNTEsMS4zOSwxLjkyaC0zLjhzMCwwLDAsMEguNWMuNTQtLjQxLDEuMTgtMS4wNCwxLjM5LTEuOTIuMTMtLjU2LS4wNC0uNjguMDItMS41Ni4wNi0uODYuMTMtMS45Mi45Ni0yLjYuMjItLjE4LjY2LS40NywxLjQyLS41OXYtLjU1Ii8+CiAgPHBhdGggc3Ryb2tlPSJ3aGl0ZSIgZmlsbD0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGQ9Ik0zLjM0LDkuMjljLjE1LjM5LjUyLjY1LjkzLjY2LjQzLjAxLjgyLS4yNS45OC0uNjYiLz4KPC9zdmc+");
/***/ }),
/***/ "./src/img/icon_search.svg":
/*!*********************************!*\
!*** ./src/img/icon_search.svg ***!
\*********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ReactComponent: () => (/* binding */ SvgIconSearch),
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
var _circle, _path;
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var SvgIconSearch = function SvgIconSearch(props) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 8.23 8.2"
}, props), _circle || (_circle = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("circle", {
stroke: "#fff",
fill: "none",
strokeLinecap: "round",
strokeLinejoin: "round",
cx: 3.5,
cy: 3.5,
r: 3
})), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
stroke: "#fff",
fill: "none",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M5.65 5.61 7.73 7.7"
})));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0icmVjaGVyY2hlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA4LjIzIDguMiI+CiAgPGNpcmNsZSBzdHJva2U9IndoaXRlIiBmaWxsPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgY3g9IjMuNSIgY3k9IjMuNSIgcj0iMyIvPgogIDxsaW5lIHN0cm9rZT0id2hpdGUiIGZpbGw9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiB4MT0iNS42NSIgeTE9IjUuNjEiIHgyPSI3LjczIiB5Mj0iNy43Ii8+Cjwvc3ZnPg==");
/***/ }),
/***/ "./src/img/icon_tip.svg":
/*!******************************!*\
!*** ./src/img/icon_tip.svg ***!
\******************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ReactComponent: () => (/* binding */ SvgIconTip),
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
var _path;
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var SvgIconTip = function SvgIconTip(props) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 9.14 9.16"
}, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
stroke: "#fff",
fill: "none",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M8.15 3.68c-.74-.72-1.92-.45-2.03-.42.17-.64.14-1.15.09-1.45C6.14 1.38 6.05.76 5.6.56 5.55.54 5.3.44 5.08.55c-.35.18-.31.72-.47 1.3-.11.39-.34.92-.92 1.5-.16.09-.39.23-.62.44v-.21L.5 3.49v4.37h2.57V7.7c1 .84 2.23.91 2.68.94.77.04 1.34.07 1.88-.3.95-.65.99-1.98 1.01-2.66.02-.78.04-1.49-.48-2ZM3.07 7.86V3.79"
})));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iYXN0dWNlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA5LjE0IDkuMTYiPgogIDxwYXRoIHN0cm9rZT0id2hpdGUiIGZpbGw9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBkPSJNOC4xNSwzLjY4Yy0uNzQtLjcyLTEuOTItLjQ1LTIuMDMtLjQyLjE3LS42NC4xNC0xLjE1LjA5LTEuNDUtLjA3LS40My0uMTYtMS4wNS0uNjEtMS4yNS0uMDUtLjAyLS4zLS4xMi0uNTItLjAxLS4zNS4xOC0uMzEuNzItLjQ3LDEuMy0uMTEuMzktLjM0LjkyLS45MiwxLjUtLjE2LjA5LS4zOS4yMy0uNjIuNDR2LS4yMWwtMi41Ny0uMDl2NC4zN2gyLjU3di0uMTZjMSwuODQsMi4yMy45MSwyLjY4Ljk0Ljc3LjA0LDEuMzQuMDcsMS44OC0uMy45NS0uNjUuOTktMS45OCwxLjAxLTIuNjYuMDItLjc4LjA0LTEuNDktLjQ4LTJaIi8+CiAgPGxpbmUgc3Ryb2tlPSJ3aGl0ZSIgZmlsbD0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHgxPSIzLjA3IiB5MT0iNy44NiIgeDI9IjMuMDciIHkyPSIzLjc5Ii8+Cjwvc3ZnPg==");
/***/ }),
/***/ "./src/img/icon_warning.svg":
/*!**********************************!*\
!*** ./src/img/icon_warning.svg ***!
\**********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ ReactComponent: () => (/* binding */ SvgIconWarning),
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
var _path, _circle;
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var SvgIconWarning = function SvgIconWarning(props) {
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("svg", _extends({
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 1.39 7.25"
}, props), _path || (_path = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("path", {
stroke: "#fff",
strokeLinecap: "round",
strokeLinejoin: "round",
d: "M.69 4.33.7.5"
})), _circle || (_circle = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("circle", {
fill: "#fff",
cx: 0.69,
cy: 6.56,
r: 0.69
})));
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBpZD0iYXR0ZW50aW9uIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxLjM5IDcuMjUiPgogIDxsaW5lIHN0cm9rZT0id2hpdGUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgeDE9Ii42OSIgeTE9IjQuMzMiIHgyPSIuNyIgeTI9Ii41Ii8+CiAgPGNpcmNsZSBmaWxsPSJ3aGl0ZSIgY3g9Ii42OSIgY3k9IjYuNTYiIHI9Ii42OSIvPgo8L3N2Zz4=");
/***/ }),
/***/ "../../node_modules/@wordpress/icons/build-module/library/trash.js":
/*!*************************************************************************!*\
!*** ../../node_modules/@wordpress/icons/build-module/library/trash.js ***!
\*************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);
/**
* WordPress dependencies
*/
const trash = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
d: "M20 5h-5.7c0-1.3-1-2.3-2.3-2.3S9.7 3.7 9.7 5H4v2h1.5v.3l1.7 11.1c.1 1 1 1.7 2 1.7h5.7c1 0 1.8-.7 2-1.7l1.7-11.1V7H20V5zm-3.2 2l-1.7 11.1c0 .1-.1.2-.3.2H9.1c-.1 0-.3-.1-.3-.2L7.2 7h9.6z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (trash);
//# sourceMappingURL=trash.js.map
/***/ }),
/***/ "./src/deprecated.js":
/*!***************************!*\
!*** ./src/deprecated.js ***!
\***************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
const v1 = {
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"
}
},
save({
attributes
}) {
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.useBlockProps.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 ${!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,
src: iconPicture,
alt: ""
})), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.RichText.Content, {
tagName: "h3",
value: title,
className: "homegrade-blocks-highlight__block-title"
})), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-highlight__content"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-highlight__content__innerblocks"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.InnerBlocks.Content, null)), hasLogo && logoUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-highlight__logo"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: logoUrl,
alt: logoAlt
}))));
},
migrate(attributes) {
return {
hasIcon: attributes.hasTitleIcon
};
}
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ([v1]);
/***/ }),
/***/ "./src/edit.js":
/*!*********************!*\
!*** ./src/edit.js ***!
@ -179,11 +569,25 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var _img_icon_block_chain_svg__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./img/icon_block_chain.svg */ "./src/img/icon_block_chain.svg");
/* harmony import */ var _img_icon_house_svg__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./img/icon_house.svg */ "./src/img/icon_house.svg");
/* harmony import */ var _img_icon_bulb_svg__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./img/icon_bulb.svg */ "./src/img/icon_bulb.svg");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/icons */ "../../node_modules/@wordpress/icons/build-module/library/trash.js");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _img_icon_warning_svg__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./img/icon_warning.svg */ "./src/img/icon_warning.svg");
/* harmony import */ var _img_icon_acoustic_svg__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./img/icon_acoustic.svg */ "./src/img/icon_acoustic.svg");
/* harmony import */ var _img_icon_documentation_svg__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./img/icon_documentation.svg */ "./src/img/icon_documentation.svg");
/* harmony import */ var _img_icon_notification_svg__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./img/icon_notification.svg */ "./src/img/icon_notification.svg");
/* harmony import */ var _img_icon_search_svg__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./img/icon_search.svg */ "./src/img/icon_search.svg");
/* harmony import */ var _img_icon_info_svg__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./img/icon_info.svg */ "./src/img/icon_info.svg");
/* harmony import */ var _img_icon_tip_svg__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./img/icon_tip.svg */ "./src/img/icon_tip.svg");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_14___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_14__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! @wordpress/icons */ "../../node_modules/@wordpress/icons/build-module/library/trash.js");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_15___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__);
@ -202,12 +606,13 @@ function Edit({
title,
iconName,
hasTitle,
hasTitleIcon,
hasIcon,
hasLogo,
variant,
logoAlt,
logoId,
logoUrl
logoUrl,
iconPosition
} = attributes;
function getIconPicture() {
switch (iconName) {
@ -219,6 +624,20 @@ function Edit({
return _img_icon_house_svg__WEBPACK_IMPORTED_MODULE_5__["default"];
case "bulb":
return _img_icon_bulb_svg__WEBPACK_IMPORTED_MODULE_6__["default"];
case "warning":
return _img_icon_warning_svg__WEBPACK_IMPORTED_MODULE_7__["default"];
case "acoustic":
return _img_icon_acoustic_svg__WEBPACK_IMPORTED_MODULE_8__["default"];
case "documentation":
return _img_icon_documentation_svg__WEBPACK_IMPORTED_MODULE_9__["default"];
case "notification":
return _img_icon_notification_svg__WEBPACK_IMPORTED_MODULE_10__["default"];
case "search":
return _img_icon_search_svg__WEBPACK_IMPORTED_MODULE_11__["default"];
case "info":
return _img_icon_info_svg__WEBPACK_IMPORTED_MODULE_12__["default"];
case "tip":
return _img_icon_tip_svg__WEBPACK_IMPORTED_MODULE_13__["default"];
}
}
function onIconChange(newIconName) {
@ -237,9 +656,9 @@ function Edit({
title: undefined
});
}
function onhasTitleIconChange() {
function onhasIconChange() {
setAttributes({
hasTitleIcon: !hasTitleIcon
hasIcon: !hasIcon
});
}
function onVariantChange(variant) {
@ -270,36 +689,58 @@ function Edit({
});
}
let iconPicture = getIconPicture();
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_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
function handleIconPositionChange(newPosition) {
setAttributes({
iconPosition: newPosition
});
}
console.log(iconPosition);
console.log(hasIcon);
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_14__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.PanelBody, {
title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Variantes", "homegrade-blocks__texte-fonctionnel"),
initialOpen: true
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalToggleGroupControl, {
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.__experimentalToggleGroupControl, {
className: "homegrade-blocks-highlight__variant",
isBlock: true,
onChange: onVariantChange,
value: variant
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalToggleGroupControlOption, {
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.__experimentalToggleGroupControlOption, {
label: "Classique",
value: "classic"
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalToggleGroupControlOption, {
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.__experimentalToggleGroupControlOption, {
label: "Warning",
value: "warning"
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalToggleGroupControlOption, {
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.__experimentalToggleGroupControlOption, {
label: "Gris",
value: "gray"
})), (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_15__.ToggleControl, {
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, {
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.ToggleControl, {
label: "Afficher une Icone",
checked: hasIcon,
onChange: onhasIconChange
}), hasIcon && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.RadioControl, {
className: "homegrade-blocks-highlight__icon-position",
label: "Position de l'icone",
onChange: handleIconPositionChange,
options: [{
label: "Avant le titre",
value: "top",
description: "Seulement lorsque le titre est ACTIVÉ"
}, {
label: "Coté",
value: "side",
disabled: hasTitle,
description: "Seulement lorsque le titre est DÉSACTIVÉ"
}],
selected: iconPosition
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.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, {
})), hasLogo && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.PanelBody, {
className: "homegrade-blocks-highlight__panel-body",
title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Logo", "homegrade-blocks")
}, logoUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
@ -307,51 +748,86 @@ function Edit({
alt: logoAlt
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "media-replace-container "
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.MediaReplaceFlow, {
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_14__.MediaReplaceFlow, {
mediaId: logoId,
mediaUrl: logoUrl,
allowedTypes: ["image"],
accept: "image/*",
onSelect: setLogoAttributes,
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_15__.Button, {
className: "custom-flow-button",
variant: "primary",
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_9__["default"],
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_16__["default"],
label: "Supprimer",
onClick: removeLogoAttributes
}))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.BlockControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToolbarButton, {
}))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_14__.BlockControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.ToolbarButton, {
title: "Clé",
icon: "admin-network",
isActive: iconName === "key",
onClick: () => onIconChange("key")
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToolbarButton, {
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.ToolbarButton, {
title: "Lien",
icon: "admin-links",
isActive: iconName === "chain",
onClick: () => onIconChange("chain")
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToolbarButton, {
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.ToolbarButton, {
title: "Homegrade",
icon: "admin-home",
isActive: iconName === "house",
onClick: () => onIconChange("house")
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToolbarButton, {
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.ToolbarButton, {
title: "Inspiration",
icon: "lightbulb",
isActive: iconName === "bulb",
onClick: () => onIconChange("bulb")
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.ToolbarButton, {
title: "Attention",
icon: "warning",
isActive: iconName === "warning",
onClick: () => onIconChange("warning")
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.ToolbarButton, {
title: "Acoustique",
icon: "controls-volumeon",
isActive: iconName === "acoustic",
onClick: () => onIconChange("acoustic")
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.ToolbarButton, {
title: "Documentation",
icon: "book-alt",
isActive: iconName === "documentation",
onClick: () => onIconChange("documentation")
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.ToolbarButton, {
title: "Recherche",
icon: "search",
isActive: iconName === "search",
onClick: () => onIconChange("search")
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.ToolbarButton, {
title: "Notification",
icon: "bell",
isActive: iconName === "notification",
onClick: () => onIconChange("notification")
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.ToolbarButton, {
title: "Info",
icon: "info",
isActive: iconName === "info",
onClick: () => onIconChange("info")
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_15__.ToolbarButton, {
title: "Astuce",
icon: "thumbs-up",
isActive: iconName === "tip",
onClick: () => onIconChange("tip")
})), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_14__.useBlockProps)({
className: `homegrade-blocks-highlight ${variant ? `homegrade-blocks-highlight--${variant}` : ""}`
})
}, hasTitle && (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: `homegrade-blocks-highlight__titling ${!hasIcon ? "homegrade-blocks-highlight__titling--has-no-icon" : ""}`
}, hasIcon && iconPosition === "top" && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "icon"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: iconPicture,
alt: ""
})), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.RichText, {
})), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_14__.RichText, {
className: "homegrade-blocks-highlight__block-title",
onChange: onTitleChange,
value: title,
@ -360,14 +836,19 @@ function Edit({
allowedFormats: []
})), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-highlight__content"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
}, hasIcon && iconPosition === "side" && !hasTitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "icon"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: iconPicture,
alt: ""
})), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-highlight__content__innerblocks"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks, {
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_14__.InnerBlocks, {
allowedBlocks: ["core/paragraph", "core/list", "core/buttons", "core/button", "core/colums", "core/colum", "homegrade-content-blocks/text-image", "homegrade-content-blocks/content-heading", "homegrade-content-blocks/staff-member"],
template: [["core/paragraph"]]
})), hasLogo && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-highlight__logo"
}, !logoUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.MediaReplaceFlow, {
}, !logoUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_14__.MediaReplaceFlow, {
mediaId: logoId,
mediaUrl: logoUrl,
allowedTypes: ["image"],
@ -399,6 +880,8 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./edit */ "./src/edit.js");
/* harmony import */ var _save__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./save */ "./src/save.js");
/* harmony import */ var _block_json__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./block.json */ "./src/block.json");
/* harmony import */ var _deprecated__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./deprecated */ "./src/deprecated.js");
@ -417,7 +900,8 @@ __webpack_require__.r(__webpack_exports__);
foreground: "#DF1E1E"
},
edit: _edit__WEBPACK_IMPORTED_MODULE_4__["default"],
save: _save__WEBPACK_IMPORTED_MODULE_5__["default"]
save: _save__WEBPACK_IMPORTED_MODULE_5__["default"],
deprecated: _deprecated__WEBPACK_IMPORTED_MODULE_7__["default"]
});
/***/ }),
@ -444,6 +928,13 @@ __webpack_require__.r(__webpack_exports__);
/* harmony import */ var _img_icon_block_chain_svg__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./img/icon_block_chain.svg */ "./src/img/icon_block_chain.svg");
/* harmony import */ var _img_icon_house_svg__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./img/icon_house.svg */ "./src/img/icon_house.svg");
/* harmony import */ var _img_icon_bulb_svg__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./img/icon_bulb.svg */ "./src/img/icon_bulb.svg");
/* harmony import */ var _img_icon_warning_svg__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./img/icon_warning.svg */ "./src/img/icon_warning.svg");
/* harmony import */ var _img_icon_acoustic_svg__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./img/icon_acoustic.svg */ "./src/img/icon_acoustic.svg");
/* harmony import */ var _img_icon_documentation_svg__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./img/icon_documentation.svg */ "./src/img/icon_documentation.svg");
/* harmony import */ var _img_icon_notification_svg__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./img/icon_notification.svg */ "./src/img/icon_notification.svg");
/* harmony import */ var _img_icon_search_svg__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./img/icon_search.svg */ "./src/img/icon_search.svg");
/* harmony import */ var _img_icon_info_svg__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./img/icon_info.svg */ "./src/img/icon_info.svg");
/* harmony import */ var _img_icon_tip_svg__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./img/icon_tip.svg */ "./src/img/icon_tip.svg");
@ -452,6 +943,13 @@ __webpack_require__.r(__webpack_exports__);
function save({
attributes
}) {
@ -459,11 +957,12 @@ function save({
title,
iconName,
hasTitle,
hasTitleIcon,
hasIcon,
variant,
hasLogo,
logoAlt,
logoUrl
logoUrl,
iconPosition
} = attributes;
function getIconPicture() {
switch (iconName) {
@ -475,6 +974,20 @@ function save({
return _img_icon_house_svg__WEBPACK_IMPORTED_MODULE_6__["default"];
case "bulb":
return _img_icon_bulb_svg__WEBPACK_IMPORTED_MODULE_7__["default"];
case "warning":
return _img_icon_warning_svg__WEBPACK_IMPORTED_MODULE_8__["default"];
case "acoustic":
return _img_icon_acoustic_svg__WEBPACK_IMPORTED_MODULE_9__["default"];
case "documentation":
return _img_icon_documentation_svg__WEBPACK_IMPORTED_MODULE_10__["default"];
case "notification":
return _img_icon_notification_svg__WEBPACK_IMPORTED_MODULE_11__["default"];
case "search":
return _img_icon_search_svg__WEBPACK_IMPORTED_MODULE_12__["default"];
case "info":
return _img_icon_info_svg__WEBPACK_IMPORTED_MODULE_13__["default"];
case "tip":
return _img_icon_tip_svg__WEBPACK_IMPORTED_MODULE_14__["default"];
}
}
let iconPicture = getIconPicture();
@ -483,8 +996,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 ${!hasTitleIcon ? "homegrade-blocks-highlight__titling--has-no-icon" : ""}`
}, hasTitleIcon && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: `homegrade-blocks-highlight__titling ${!hasIcon ? "homegrade-blocks-highlight__titling--has-no-icon" : ""}`
}, hasIcon && iconPosition === "top" && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "icon"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
clas: true,
@ -496,7 +1009,12 @@ function save({
className: "homegrade-blocks-highlight__block-title"
})), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-highlight__content"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
}, hasIcon && iconPosition === "side" && !hasTitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "icon"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: iconPicture,
alt: ""
})), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-highlight__content__innerblocks"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.InnerBlocks.Content, null)), hasLogo && logoUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-highlight__logo"
@ -530,37 +1048,6 @@ __webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "../../node_modules/@wordpress/icons/build-module/library/trash.js":
/*!*************************************************************************!*\
!*** ../../node_modules/@wordpress/icons/build-module/library/trash.js ***!
\*************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);
/**
* WordPress dependencies
*/
const trash = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
d: "M20 5h-5.7c0-1.3-1-2.3-2.3-2.3S9.7 3.7 9.7 5H4v2h1.5v.3l1.7 11.1c.1 1 1 1.7 2 1.7h5.7c1 0 1.8-.7 2-1.7l1.7-11.1V7H20V5zm-3.2 2l-1.7 11.1c0 .1-.1.2-.3.2H9.1c-.1 0-.3-.1-.3-.2L7.2 7h9.6z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (trash);
//# sourceMappingURL=trash.js.map
/***/ }),
/***/ "react":
@ -649,7 +1136,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},"hasTitleIcon":{"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},"hasIcon":{"type":"boolean","default":true},"hasLogo":{"type":"boolean","default":false},"logoId":{"type":"number"},"logoAlt":{"type":"string"},"logoUrl":{"type":"string"},"variant":{"type":"string","default":"classic"},"iconPosition":{"type":"string","default":"top"}}}');
/***/ })

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

File diff suppressed because one or more lines are too long

10
blocks/highlight/build/style-index.css
View File

@ -1,6 +1,6 @@
/*!***************************************************************************************************************************************************************************************************************************************!*\
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/style.scss ***!
\***************************************************************************************************************************************************************************************************************************************/
/*!***************************************************************************************************************************************************************************************************************************************************!*\
!*** css ../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!../../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/style.scss ***!
\***************************************************************************************************************************************************************************************************************************************************/
/**
* The following styles get applied both on the front of your site
* and in the editor.
@ -10,7 +10,7 @@
.homegrade-blocks-highlight__block-title {
margin: 0 !important;
}
.homegrade-blocks-highlight__titling .icon {
.homegrade-blocks-highlight .icon {
background-color: black;
border-radius: 50%;
aspect-ratio: 1/1;
@ -21,7 +21,7 @@
justify-content: center;
align-items: center;
}
.homegrade-blocks-highlight__titling .icon img {
.homegrade-blocks-highlight .icon img {
width: 30px;
max-width: 80%;
max-height: 100%;

2
blocks/highlight/build/style-index.css.map
View File

@ -1 +1 @@
{"version":3,"file":"./style-index.css","mappings":";;;AAAA;;;;;EAAA;AAQC;EACC;AADF;AAIE;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAFH;AAIG;EACC;EACA;EACA;EACA;AAFJ;AAKE;EACC;AAHH;AAaC;EACC;AAXF;AAaC;EACC;AAXF,C","sources":["webpack://multiblocks/./src/style.scss"],"sourcesContent":["/**\n * The following styles get applied both on the front of your site\n * and in the editor.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n.homegrade-blocks-highlight {\n\t&__block-title {\n\t\tmargin: 0 !important;\n\t}\n\t&__titling {\n\t\t.icon {\n\t\t\tbackground-color: black;\n\t\t\tborder-radius: 50%;\n\t\t\taspect-ratio: 1/1;\n\t\t\twidth: 40px;\n\t\t\theight: 40px;\n\t\t\tpadding: 10px;\n\t\t\tdisplay: flex;\n\t\t\tjustify-content: center;\n\t\t\talign-items: center;\n\n\t\t\timg {\n\t\t\t\twidth: 30px;\n\t\t\t\tmax-width: 80%;\n\t\t\t\tmax-height: 100%;\n\t\t\t\theight: auto;\n\t\t\t}\n\t\t}\n\t\th3 {\n\t\t\tpadding-left: 10px;\n\t\t}\n\t}\n\n\t// ul li {\n\t// \tlist-style-type: disc;\n\t// \tlist-style-position: inside;\n\t// \tmargin-left: 1.5em;\n\t// }\n\n\tp + ul {\n\t\tpadding-top: 16px;\n\t}\n\tul + p {\n\t\tpadding-top: 16px;\n\t}\n}\n"],"names":[],"sourceRoot":""}
{"version":3,"file":"./style-index.css","mappings":";;;AAAA;;;;;EAAA;AAQC;EACC;AADF;AAGC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AADF;AAGE;EACC;EACA;EACA;EACA;AADH;AAKE;EACC;AAHH;AAaC;EACC;AAXF;AAaC;EACC;AAXF,C","sources":["webpack://multiblocks/./src/style.scss"],"sourcesContent":["/**\n * The following styles get applied both on the front of your site\n * and in the editor.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n.homegrade-blocks-highlight {\n\t&__block-title {\n\t\tmargin: 0 !important;\n\t}\n\t.icon {\n\t\tbackground-color: black;\n\t\tborder-radius: 50%;\n\t\taspect-ratio: 1/1;\n\t\twidth: 40px;\n\t\theight: 40px;\n\t\tpadding: 10px;\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\n\t\timg {\n\t\t\twidth: 30px;\n\t\t\tmax-width: 80%;\n\t\t\tmax-height: 100%;\n\t\t\theight: auto;\n\t\t}\n\t}\n\t&__titling {\n\t\th3 {\n\t\t\tpadding-left: 10px;\n\t\t}\n\t}\n\n\t// ul li {\n\t// \tlist-style-type: disc;\n\t// \tlist-style-position: inside;\n\t// \tmargin-left: 1.5em;\n\t// }\n\n\tp + ul {\n\t\tpadding-top: 16px;\n\t}\n\tul + p {\n\t\tpadding-top: 16px;\n\t}\n}\n"],"names":[],"sourceRoot":""}

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

@ -28,7 +28,7 @@
"type": "boolean",
"default": true
},
"hasTitleIcon": {
"hasIcon": {
"type": "boolean",
"default": true
},
@ -48,6 +48,10 @@
"variant": {
"type": "string",
"default": "classic"
},
"iconPosition": {
"type": "string",
"default": "top"
}
}
}

93
blocks/highlight/src/deprecated.js Normal file
View File

@ -0,0 +1,93 @@
import { createBlock } from "@wordpress/blocks";
import { useBlockProps, RichText, InnerBlocks } from "@wordpress/block-editor";
import { useSelect } from "@wordpress/data";
const v1 = {
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",
},
},
save({ attributes }) {
return (
<section
{...useBlockProps.save({
className: `homegrade-blocks-highlight ${
variant ? `homegrade-blocks-highlight--${variant}` : ""
}`,
})}
>
{hasTitle && (
<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"
value={title}
className="homegrade-blocks-highlight__block-title"
/>
</div>
)}
<div className="homegrade-blocks-highlight__content">
<div className="homegrade-blocks-highlight__content__innerblocks">
<InnerBlocks.Content />
</div>
{hasLogo && logoUrl && (
<div className="homegrade-blocks-highlight__logo">
<img src={logoUrl} alt={logoAlt} />
</div>
)}
</div>
</section>
);
},
migrate(attributes) {
return {
hasIcon: attributes.hasTitleIcon,
};
},
};
export default [v1];

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

@ -4,6 +4,13 @@ import keyIcon from "./img/icon_feather_key.svg";
import chainIcon from "./img/icon_block_chain.svg";
import houseIcon from "./img/icon_house.svg";
import bulbIcon from "./img/icon_bulb.svg";
import warningIcon from "./img/icon_warning.svg";
import acousticIcon from "./img/icon_acoustic.svg";
import documentationIcon from "./img/icon_documentation.svg";
import notificationIcon from "./img/icon_notification.svg";
import searchIcon from "./img/icon_search.svg";
import infoIcon from "./img/icon_info.svg";
import tipIcon from "./img/icon_tip.svg";
import {
RichText,
useBlockProps,
@ -21,6 +28,7 @@ import {
ToggleControl,
__experimentalToggleGroupControl as ToggleGroupControl,
__experimentalToggleGroupControlOption as ToggleGroupControlOption,
RadioControl,
} from "@wordpress/components";
export default function Edit({ attributes, setAttributes }) {
@ -28,12 +36,13 @@ export default function Edit({ attributes, setAttributes }) {
title,
iconName,
hasTitle,
hasTitleIcon,
hasIcon,
hasLogo,
variant,
logoAlt,
logoId,
logoUrl,
iconPosition,
} = attributes;
function getIconPicture() {
@ -49,6 +58,27 @@ export default function Edit({ attributes, setAttributes }) {
case "bulb":
return bulbIcon;
case "warning":
return warningIcon;
case "acoustic":
return acousticIcon;
case "documentation":
return documentationIcon;
case "notification":
return notificationIcon;
case "search":
return searchIcon;
case "info":
return infoIcon;
case "tip":
return tipIcon;
}
}
@ -64,9 +94,9 @@ export default function Edit({ attributes, setAttributes }) {
title: undefined,
});
}
function onhasTitleIconChange() {
function onhasIconChange() {
setAttributes({
hasTitleIcon: !hasTitleIcon,
hasIcon: !hasIcon,
});
}
function onVariantChange(variant) {
@ -97,6 +127,12 @@ export default function Edit({ attributes, setAttributes }) {
let iconPicture = getIconPicture();
function handleIconPositionChange(newPosition) {
setAttributes({ iconPosition: newPosition });
}
console.log(iconPosition);
console.log(hasIcon);
return (
<>
<InspectorControls>
@ -120,10 +156,32 @@ export default function Edit({ attributes, setAttributes }) {
onChange={onHasTitleChange}
/>
<ToggleControl
label="Icone pour le titre"
checked={hasTitleIcon}
onChange={onhasTitleIconChange}
label="Afficher une Icone"
checked={hasIcon}
onChange={onhasIconChange}
/>
{hasIcon && (
<RadioControl
className="homegrade-blocks-highlight__icon-position"
label="Position de l'icone"
onChange={handleIconPositionChange}
options={[
{
label: "Avant le titre",
value: "top",
description: "Seulement lorsque le titre est ACTIVÉ",
},
{
label: "Coté",
value: "side",
disabled: hasTitle,
description: "Seulement lorsque le titre est DÉSACTIVÉ",
},
]}
selected={iconPosition}
/>
)}
<ToggleControl
label="Attacher un logo"
checked={hasLogo}
@ -190,6 +248,48 @@ export default function Edit({ attributes, setAttributes }) {
isActive={iconName === "bulb"}
onClick={() => onIconChange("bulb")}
/>
<ToolbarButton
title={"Attention"}
icon={"warning"}
isActive={iconName === "warning"}
onClick={() => onIconChange("warning")}
/>
<ToolbarButton
title={"Acoustique"}
icon={"controls-volumeon"}
isActive={iconName === "acoustic"}
onClick={() => onIconChange("acoustic")}
/>
<ToolbarButton
title={"Documentation"}
icon={"book-alt"}
isActive={iconName === "documentation"}
onClick={() => onIconChange("documentation")}
/>
<ToolbarButton
title={"Recherche"}
icon={"search"}
isActive={iconName === "search"}
onClick={() => onIconChange("search")}
/>
<ToolbarButton
title={"Notification"}
icon={"bell"}
isActive={iconName === "notification"}
onClick={() => onIconChange("notification")}
/>
<ToolbarButton
title={"Info"}
icon={"info"}
isActive={iconName === "info"}
onClick={() => onIconChange("info")}
/>
<ToolbarButton
title={"Astuce"}
icon={"thumbs-up"}
isActive={iconName === "tip"}
onClick={() => onIconChange("tip")}
/>
</BlockControls>
<section
{...useBlockProps({
@ -201,12 +301,10 @@ export default function Edit({ attributes, setAttributes }) {
{hasTitle && (
<div
className={`homegrade-blocks-highlight__titling ${
!hasTitleIcon
? "homegrade-blocks-highlight__titling--has-no-icon"
: ""
!hasIcon ? "homegrade-blocks-highlight__titling--has-no-icon" : ""
}`}
>
{hasTitleIcon && (
{hasIcon && iconPosition === "top" && (
<div className="icon">
<img src={iconPicture} alt="" />
</div>
@ -225,6 +323,12 @@ export default function Edit({ attributes, setAttributes }) {
</div>
)}
<div className="homegrade-blocks-highlight__content">
{hasIcon && iconPosition === "side" && !hasTitle && (
<div className="icon">
<img src={iconPicture} alt="" />
</div>
)}
<div className="homegrade-blocks-highlight__content__innerblocks">
<InnerBlocks
allowedBlocks={[
@ -241,6 +345,7 @@ export default function Edit({ attributes, setAttributes }) {
template={[["core/paragraph"]]}
/>
</div>
{hasLogo && (
<div className="homegrade-blocks-highlight__logo">
{!logoUrl && (

10
blocks/highlight/src/editor.scss
View File

@ -64,3 +64,13 @@
// margin-top: 10px;
}
}
.homegrade-blocks-highlight__icon-position {
margin: 20px 0;
legend {
font-size: 15px !important;
// font-weight: 400 !important;
text-transform: none !important;
color: #585858;
}
}

5
blocks/highlight/src/img/icon_acoustic.svg Normal file
View File

@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="acoustique" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10.62 11">
<path stroke="white" fill="white" stroke-linecap="round" stroke-linejoin="round" d="M4.75,1.44c-.37.32-.62.66-.79.93h-1.5c-1.09,0-1.97.88-1.97,1.97v2.34c0,1.09.88,1.97,1.97,1.97h1.5c.24.3.59.67,1.07,1.01.7.5,1.38.74,1.83.85V.5c-.42.06-1.31.24-2.12.94Z"/>
<path stroke="white" fill="none" stroke-linecap="round" stroke-linejoin="round" d="M9.04,3.13c.13.12,1.19,1.11,1.06,2.63-.1,1.21-.88,1.95-1.06,2.11"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 535 B

8
blocks/highlight/src/img/icon_documentation.svg Normal file
View File

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="documentation" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 7.38 8.98">
<g id="Icon_feather-book" data-name="Icon feather-book">
<path id="Tracé_20347" data-name="Tracé 20347" stroke="white" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M.5,7.48c0-.55.45-1,1-1h5.38"/>
<path id="Tracé_20348" data-name="Tracé 20348" stroke="white" stroke-linecap="round" stroke-linejoin="round" fill="none" d="M1.5.5h5.38v7.98H1.5c-.55,0-1-.45-1-1V1.5c0-.55.45-1,1-1Z"/>
</g>
<line stroke="white" stroke-linecap="round" stroke-linejoin="round" x1="2.88" y1="2.98" x2="4.82" y2="2.98"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 660 B

5
blocks/highlight/src/img/icon_info.svg Normal file
View File

@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="info" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1 6.18">
<line stroke="white" fill="none" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" x1=".5" y1="2.41" x2=".5" y2="5.68"/>
<line stroke="white" fill="none" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" x1=".5" y1=".5" x2=".5" y2=".5"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 387 B

5
blocks/highlight/src/img/icon_notification.svg Normal file
View File

@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="notification" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8.61 10.45">
<path stroke="white" fill="none" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" d="M4.31.5v.55c.77.12,1.21.41,1.42.59.83.69.9,1.74.96,2.6.06.88-.11,1,.02,1.56.21.88.86,1.51,1.39,1.92h-3.8s0,0,0,0H.5c.54-.41,1.18-1.04,1.39-1.92.13-.56-.04-.68.02-1.56.06-.86.13-1.92.96-2.6.22-.18.66-.47,1.42-.59v-.55"/>
<path stroke="white" fill="none" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" d="M3.34,9.29c.15.39.52.65.93.66.43.01.82-.25.98-.66"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 606 B

5
blocks/highlight/src/img/icon_search.svg Normal file
View File

@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="recherche" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 8.23 8.2">
<circle stroke="white" fill="none" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" cx="3.5" cy="3.5" r="3"/>
<line stroke="white" fill="none" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" x1="5.65" y1="5.61" x2="7.73" y2="7.7"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 391 B

5
blocks/highlight/src/img/icon_tip.svg Normal file
View File

@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="astuce" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 9.14 9.16">
<path stroke="white" fill="none" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" d="M8.15,3.68c-.74-.72-1.92-.45-2.03-.42.17-.64.14-1.15.09-1.45-.07-.43-.16-1.05-.61-1.25-.05-.02-.3-.12-.52-.01-.35.18-.31.72-.47,1.3-.11.39-.34.92-.92,1.5-.16.09-.39.23-.62.44v-.21l-2.57-.09v4.37h2.57v-.16c1,.84,2.23.91,2.68.94.77.04,1.34.07,1.88-.3.95-.65.99-1.98,1.01-2.66.02-.78.04-1.49-.48-2Z"/>
<line stroke="white" fill="none" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" x1="3.07" y1="7.86" x2="3.07" y2="3.79"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 664 B

5
blocks/highlight/src/img/icon_warning.svg Normal file
View File

@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="attention" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1.39 7.25">
<line stroke="white" stroke-linecap="round" stroke-linejoin="round" x1=".69" y1="4.33" x2=".7" y2=".5"/>
<circle fill="white" cx=".69" cy="6.56" r=".69"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 284 B

2
blocks/highlight/src/index.js
View File

@ -5,6 +5,7 @@ import "./style.scss";
import Edit from "./edit";
import save from "./save";
import metadata from "./block.json";
import deprecated from "./deprecated";
registerBlockType(metadata.name, {
icon: {
@ -17,4 +18,5 @@ registerBlockType(metadata.name, {
},
edit: Edit,
save,
deprecated,
});

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

@ -5,17 +5,25 @@ import keyIcon from "./img/icon_feather_key.svg";
import chainIcon from "./img/icon_block_chain.svg";
import houseIcon from "./img/icon_house.svg";
import bulbIcon from "./img/icon_bulb.svg";
import warningIcon from "./img/icon_warning.svg";
import acousticIcon from "./img/icon_acoustic.svg";
import documentationIcon from "./img/icon_documentation.svg";
import notificationIcon from "./img/icon_notification.svg";
import searchIcon from "./img/icon_search.svg";
import infoIcon from "./img/icon_info.svg";
import tipIcon from "./img/icon_tip.svg";
export default function save({ attributes }) {
const {
title,
iconName,
hasTitle,
hasTitleIcon,
hasIcon,
variant,
hasLogo,
logoAlt,
logoUrl,
iconPosition,
} = attributes;
function getIconPicture() {
switch (iconName) {
@ -30,6 +38,25 @@ export default function save({ attributes }) {
case "bulb":
return bulbIcon;
case "warning":
return warningIcon;
case "acoustic":
return acousticIcon;
case "documentation":
return documentationIcon;
case "notification":
return notificationIcon;
case "search":
return searchIcon;
case "info":
return infoIcon;
case "tip":
return tipIcon;
}
}
let iconPicture = getIconPicture();
@ -45,12 +72,10 @@ export default function save({ attributes }) {
{hasTitle && (
<div
className={`homegrade-blocks-highlight__titling ${
!hasTitleIcon
? "homegrade-blocks-highlight__titling--has-no-icon"
: ""
!hasIcon ? "homegrade-blocks-highlight__titling--has-no-icon" : ""
}`}
>
{hasTitleIcon && (
{hasIcon && iconPosition === "top" && (
<div className="icon">
<img clas src={iconPicture} alt="" />
</div>
@ -64,6 +89,12 @@ export default function save({ attributes }) {
</div>
)}
<div className="homegrade-blocks-highlight__content">
{hasIcon && iconPosition === "side" && !hasTitle && (
<div className="icon">
<img src={iconPicture} alt="" />
</div>
)}
<div className="homegrade-blocks-highlight__content__innerblocks">
<InnerBlocks.Content />
</div>

34
blocks/highlight/src/style.scss
View File

@ -9,25 +9,25 @@
&__block-title {
margin: 0 !important;
}
&__titling {
.icon {
background-color: black;
border-radius: 50%;
aspect-ratio: 1/1;
width: 40px;
height: 40px;
padding: 10px;
display: flex;
justify-content: center;
align-items: center;
.icon {
background-color: black;
border-radius: 50%;
aspect-ratio: 1/1;
width: 40px;
height: 40px;
padding: 10px;
display: flex;
justify-content: center;
align-items: center;
img {
width: 30px;
max-width: 80%;
max-height: 100%;
height: auto;
}
img {
width: 30px;
max-width: 80%;
max-height: 100%;
height: auto;
}
}
&__titling {
h3 {
padding-left: 10px;
}