From db8c085163df306c3c9e2e904be74a3aa7467b5a Mon Sep 17 00:00:00 2001 From: Antoine M Date: Mon, 21 Aug 2023 17:34:15 +0200 Subject: [PATCH] =?UTF-8?q?point=20gilles=20gauthier=20=E2=80=94=20bloc=20?= =?UTF-8?q?auto=20not=20working?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- blocks/points-cles/build/render.php | 1 - blocks/points-cles/src/render.php | 1 - blocks/questions-container/build/render.php | 2 +- blocks/questions-container/src/render.php | 2 +- build/index.asset.php | 2 +- build/index.css | 55 ++++ build/index.css.map | 1 + build/index.js | 291 +++++++++++++++++--- build/index.js.map | 2 +- index.php | 88 +++--- package-lock.json | 57 ++++ package.json | 1 + src/format-types/brochure-front.js | 21 ++ src/format-types/brochure.css | 5 + src/format-types/brochure.js | 99 +++++++ src/format-types/highlight.js | 53 ---- src/format-types/tooltip-front.js | 26 ++ src/format-types/tooltip.css | 40 +++ src/format-types/tooltip.js | 81 ++++++ src/img/icon_brochure_download.svg | 7 + src/index.js | 6 +- templates.php | 4 +- 22 files changed, 716 insertions(+), 129 deletions(-) create mode 100644 build/index.css create mode 100644 build/index.css.map create mode 100644 src/format-types/brochure-front.js create mode 100644 src/format-types/brochure.css create mode 100644 src/format-types/brochure.js delete mode 100644 src/format-types/highlight.js create mode 100644 src/format-types/tooltip-front.js create mode 100644 src/format-types/tooltip.css create mode 100644 src/format-types/tooltip.js create mode 100644 src/img/icon_brochure_download.svg diff --git a/blocks/points-cles/build/render.php b/blocks/points-cles/build/render.php index 030b6cd..d096af1 100644 --- a/blocks/points-cles/build/render.php +++ b/blocks/points-cles/build/render.php @@ -12,7 +12,6 @@ foreach ($block->inner_blocks as $inner_block) {
-

diff --git a/blocks/points-cles/src/render.php b/blocks/points-cles/src/render.php index 030b6cd..d096af1 100644 --- a/blocks/points-cles/src/render.php +++ b/blocks/points-cles/src/render.php @@ -12,7 +12,6 @@ foreach ($block->inner_blocks as $inner_block) {
-

diff --git a/blocks/questions-container/build/render.php b/blocks/questions-container/build/render.php index 9fdaf40..15c6a8b 100644 --- a/blocks/questions-container/build/render.php +++ b/blocks/questions-container/build/render.php @@ -13,6 +13,6 @@ echo '';
-

post_title ?>

+

post_title ?>

post_content ?>
\ No newline at end of file diff --git a/blocks/questions-container/src/render.php b/blocks/questions-container/src/render.php index 9fdaf40..15c6a8b 100644 --- a/blocks/questions-container/src/render.php +++ b/blocks/questions-container/src/render.php @@ -13,6 +13,6 @@ echo '';
-

post_title ?>

+

post_title ?>

post_content ?>
\ No newline at end of file diff --git a/build/index.asset.php b/build/index.asset.php index 7934902..bef2603 100644 --- a/build/index.asset.php +++ b/build/index.asset.php @@ -1 +1 @@ - array('wp-block-editor', 'wp-components', 'wp-element', 'wp-i18n', 'wp-rich-text'), 'version' => '3747f4557b961486077b'); + array('wp-block-editor', 'wp-components', 'wp-element', 'wp-i18n', 'wp-primitives', 'wp-rich-text'), 'version' => '73b19c142a0db4f81c24'); diff --git a/build/index.css b/build/index.css new file mode 100644 index 0000000..da4bad1 --- /dev/null +++ b/build/index.css @@ -0,0 +1,55 @@ +/*!**********************************************************************************************************************************************************************************!*\ + !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./src/format-types/tooltip.css ***! + \**********************************************************************************************************************************************************************************/ +.popover_tooltip_field { + .components-popover__content { + padding: 10px !important; + min-width: 200px; + } +} + +.tooltip-word { + padding-top: 12px; + position: relative; + cursor: default; + text-underline-offset: 4px; + text-decoration-style: dashed; + text-decoration-color: red; +} + +.tooltip-popup { + background-color: yellow; + position: absolute; + top: -6px; + left: 50%; + text-align: center; + transform: translate(-50%, -100%); + padding: 10px; +} +.tooltip-popup:after { + content: ""; + display: block; + background-color: white; + position: absolute; + top: 100%; + left: 50%; + width: 20px; + height: 20px; + transform: translate(-50%, -50%) rotate(45deg); + box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.08); +} +.tooltip-popup p { + margin: 0 !important; +} + +/*!***********************************************************************************************************************************************************************************!*\ + !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./src/format-types/brochure.css ***! + \***********************************************************************************************************************************************************************************/ +.brochure-download-icon { + margin: 0 0px 0 6px; + display: inline-block; + transform: translateY(-1px); +} + + +/*# sourceMappingURL=index.css.map*/ \ No newline at end of file diff --git a/build/index.css.map b/build/index.css.map new file mode 100644 index 0000000..728162f --- /dev/null +++ b/build/index.css.map @@ -0,0 +1 @@ +{"version":3,"file":"index.css","mappings":";;;AAAA;CACC;EACC,wBAAwB;EACxB,gBAAgB;CACjB;AACD;;AAEA;CACC,iBAAiB;CACjB,kBAAkB;CAClB,eAAe;CACf,0BAA0B;CAC1B,6BAA6B;CAC7B,0BAA0B;AAC3B;;AAEA;CACC,wBAAwB;CACxB,kBAAkB;CAClB,SAAS;CACT,SAAS;CACT,kBAAkB;CAClB,iCAAiC;CACjC,aAAa;AACd;AACA;CACC,WAAW;CACX,cAAc;CACd,uBAAuB;CACvB,kBAAkB;CAClB,SAAS;CACT,SAAS;CACT,WAAW;CACX,YAAY;CACZ,8CAA8C;CAC9C,2CAA2C;AAC5C;AACA;CACC,oBAAoB;AACrB;;;;;ACvCA;CACC,mBAAmB;CACnB,qBAAqB;CACrB,2BAA2B;AAC5B","sources":["webpack://multi-blocks/./src/format-types/tooltip.css","webpack://multi-blocks/./src/format-types/brochure.css"],"sourcesContent":[".popover_tooltip_field {\r\n\t.components-popover__content {\r\n\t\tpadding: 10px !important;\r\n\t\tmin-width: 200px;\r\n\t}\r\n}\r\n\r\n.tooltip-word {\r\n\tpadding-top: 12px;\r\n\tposition: relative;\r\n\tcursor: default;\r\n\ttext-underline-offset: 4px;\r\n\ttext-decoration-style: dashed;\r\n\ttext-decoration-color: red;\r\n}\r\n\r\n.tooltip-popup {\r\n\tbackground-color: yellow;\r\n\tposition: absolute;\r\n\ttop: -6px;\r\n\tleft: 50%;\r\n\ttext-align: center;\r\n\ttransform: translate(-50%, -100%);\r\n\tpadding: 10px;\r\n}\r\n.tooltip-popup:after {\r\n\tcontent: \"\";\r\n\tdisplay: block;\r\n\tbackground-color: white;\r\n\tposition: absolute;\r\n\ttop: 100%;\r\n\tleft: 50%;\r\n\twidth: 20px;\r\n\theight: 20px;\r\n\ttransform: translate(-50%, -50%) rotate(45deg);\r\n\tbox-shadow: 4px 4px 4px rgba(0, 0, 0, 0.08);\r\n}\r\n.tooltip-popup p {\r\n\tmargin: 0 !important;\r\n}\r\n",".brochure-download-icon {\r\n\tmargin: 0 0px 0 6px;\r\n\tdisplay: inline-block;\r\n\ttransform: translateY(-1px);\r\n}\r\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/build/index.js b/build/index.js index bd68307..0104c7a 100644 --- a/build/index.js +++ b/build/index.js @@ -2,6 +2,68 @@ /******/ "use strict"; /******/ var __webpack_modules__ = ({ +/***/ "./node_modules/@wordpress/icons/build-module/library/check.js": +/*!*********************************************************************!*\ + !*** ./node_modules/@wordpress/icons/build-module/library/check.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 check = (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: "M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z" +})); +/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (check); +//# sourceMappingURL=check.js.map + +/***/ }), + +/***/ "./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 + +/***/ }), + /***/ "./blocks/utilities.js": /*!*****************************!*\ !*** ./blocks/utilities.js ***! @@ -36,10 +98,10 @@ function getThematiqueFamilySlug(thematique_slug) { /***/ }), -/***/ "./src/format-types/highlight.js": -/*!***************************************!*\ - !*** ./src/format-types/highlight.js ***! - \***************************************/ +/***/ "./src/format-types/brochure.js": +/*!**************************************!*\ + !*** ./src/format-types/brochure.js ***! + \**************************************/ /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { __webpack_require__.r(__webpack_exports__); @@ -47,12 +109,14 @@ __webpack_require__.r(__webpack_exports__); /* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var _wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/rich-text */ "@wordpress/rich-text"); /* harmony import */ var _wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_rich_text__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_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n"); -/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__); +/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n"); +/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__); +/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor"); +/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__); /* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components"); /* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__); +/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/check.js"); +/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/trash.js"); @@ -61,36 +125,177 @@ __webpack_require__.r(__webpack_exports__); -const HighlightFormatButton = ({ - ...props -}) => { - // console.log(isActive); - // console.log(value); - // console.log(props); - console.log(props); - // console.log(props.contentRef.current.innerHTML); +const BrochureLinkFormatButton = props => { + const { + isActive, + value, + onChange + } = props; + const [isPopoverOpen, setIsPopoverOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); + const [linkValue, setLinkValue] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(""); + const activeFormat = (0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.getActiveFormats)(props.value).filter(format => format.type === "block-course/brochure-format")[0]; - 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_2__.RichTextToolbarButton, { - icon: "edit", - title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Highlight", "blocks-course"), - onClick: () => { - onChange((0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.toggleFormat)(value, { - type: "block-course/highlight", - attributes: { - style: "background-color: #f0ff00" - } - })); + // console.log(activeFormat); + console.log((0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.getActiveFormats)(props.value)); + function handleFormat() { + setIsPopoverOpen(!isPopoverOpen); + onChange((0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.toggleFormat)(value, { + type: "block-course/brochure-format", + attributes: { + href: linkValue.url, + target: "_blank", + dataId: linkValue.id.toString(), + style: "text-decoration: underline;" + } + })); + } + function removeFormat() { + setIsPopoverOpen(false); + setLinkValue(""); + onChange((0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.toggleFormat)(value, { + type: "block-course/brochure-format" + })); + } + 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_3__.BlockControls, null, isPopoverOpen && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.Popover, { + onClose: () => setIsPopoverOpen(false), + className: "popover_tooltip_field" + }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.__experimentalLinkControl, { + suggestionsQuery: { + type: "attachment" }, - isActive: props.isActive - })); + value: linkValue, + onChange: value => { + console.log(value); + setLinkValue(value); + } + }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.Button, { + icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], + variant: "primary", + onClick: () => { + setIsPopoverOpen(!isPopoverOpen); + handleFormat(); + } + }, "Valider")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarGroup, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarButton, { + isActive: isActive, + icon: !isActive ? "book" : _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"], + label: !isActive ? "Ajouter un lien brochure" : "Supprimer le lien brochure", + onClick: () => !isActive ? setIsPopoverOpen(!isPopoverOpen) : removeFormat() + })))); }; -(0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.registerFormatType)("block-course/highlight", { - title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Highlight", "blocks-course"), - tagName: "span", - className: "myclass", - edit: HighlightFormatButton +(0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.registerFormatType)("block-course/brochure-format", { + title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)("Brochure", "blocks-course"), + tagName: "a", + className: "brochure-link-format", + edit: BrochureLinkFormatButton }); +/***/ }), + +/***/ "./src/format-types/tooltip.js": +/*!*************************************!*\ + !*** ./src/format-types/tooltip.js ***! + \*************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +__webpack_require__.r(__webpack_exports__); +/* 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_rich_text__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/rich-text */ "@wordpress/rich-text"); +/* harmony import */ var _wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__); +/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n"); +/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__); +/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor"); +/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__); +/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components"); +/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__); +/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/check.js"); +/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/trash.js"); + + + + + + + + +const TooltipFormatButton = props => { + const { + isActive, + value, + onChange + } = props; + const [isPopoverOpen, setIsPopoverOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); + const [popoverText, setPopoverText] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(""); + function handleFormat() { + setIsPopoverOpen(!isPopoverOpen); + onChange((0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.toggleFormat)(value, { + type: "block-course/tooltip", + attributes: { + "data-tooltip": popoverText, + style: "text-decoration: underline;" + } + })); + } + function removeFormat() { + setIsPopoverOpen(false); + onChange((0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.toggleFormat)(value, { + type: "block-course/tooltip" + })); + } + 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_3__.BlockControls, null, isPopoverOpen && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.Popover, { + onClose: () => setIsPopoverOpen(false), + className: "popover_tooltip_field" + }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.TextareaControl, { + label: "Text explicatif", + help: "Texte apparraissant au survol de la tooltip", + onChange: value => setPopoverText(value) + }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.Button, { + icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], + variant: "primary", + onClick: () => { + setIsPopoverOpen(false); + handleFormat(); + } + }, "Valider")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarGroup, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarButton, { + isActive: isActive, + icon: !isActive ? "admin-comments" : _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"], + label: !isActive ? "Ajouter une tooltip" : "Supprimer la tooltip", + onClick: () => { + !isActive ? setIsPopoverOpen(true) : removeFormat(); + } + })))); +}; +(0,_wordpress_rich_text__WEBPACK_IMPORTED_MODULE_1__.registerFormatType)("block-course/tooltip", { + title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)("Tooltip", "blocks-course"), + tagName: "span", + className: "tooltip-word", + edit: TooltipFormatButton +}); + +/***/ }), + +/***/ "./src/format-types/brochure.css": +/*!***************************************!*\ + !*** ./src/format-types/brochure.css ***! + \***************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +__webpack_require__.r(__webpack_exports__); +// extracted by mini-css-extract-plugin + + +/***/ }), + +/***/ "./src/format-types/tooltip.css": +/*!**************************************!*\ + !*** ./src/format-types/tooltip.css ***! + \**************************************/ +/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { + +__webpack_require__.r(__webpack_exports__); +// extracted by mini-css-extract-plugin + + /***/ }), /***/ "@wordpress/block-editor": @@ -133,6 +338,16 @@ module.exports = window["wp"]["i18n"]; /***/ }), +/***/ "@wordpress/primitives": +/*!************************************!*\ + !*** external ["wp","primitives"] ***! + \************************************/ +/***/ ((module) => { + +module.exports = window["wp"]["primitives"]; + +/***/ }), + /***/ "@wordpress/rich-text": /*!**********************************!*\ !*** external ["wp","richText"] ***! @@ -218,8 +433,14 @@ var __webpack_exports__ = {}; !*** ./src/index.js ***! \**********************/ __webpack_require__.r(__webpack_exports__); -/* harmony import */ var _format_types_highlight_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./format-types/highlight.js */ "./src/format-types/highlight.js"); -/* harmony import */ var _blocks_utilities_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../blocks/utilities.js */ "./blocks/utilities.js"); +/* harmony import */ var _format_types_tooltip_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./format-types/tooltip.css */ "./src/format-types/tooltip.css"); +/* harmony import */ var _format_types_tooltip_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./format-types/tooltip.js */ "./src/format-types/tooltip.js"); +/* harmony import */ var _blocks_utilities_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../blocks/utilities.js */ "./blocks/utilities.js"); +/* harmony import */ var _format_types_brochure_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./format-types/brochure.css */ "./src/format-types/brochure.css"); +/* harmony import */ var _format_types_brochure_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./format-types/brochure.js */ "./src/format-types/brochure.js"); + + + })(); diff --git a/build/index.js.map b/build/index.js.map index 38b569d..11993d4 100644 --- a/build/index.js.map +++ b/build/index.js.map @@ -1 +1 @@ -{"version":3,"file":"index.js","mappings":";;;;;;;;;;;;;;AAAO,SAASA,uBAAuBA,CAACC,eAAe,EAAE;EACxD,QAAQA,eAAe;IACtB,KAAK,SAAS;IACd,KAAK,WAAW;MACf,OAAO,oBAAoB;IAE5B,KAAK,YAAY;IACjB,KAAK,sBAAsB;MAC1B,OAAO,yBAAyB;IAEjC,KAAK,WAAW;IAChB,KAAK,cAAc;MAClB,OAAO,qBAAqB;IAE7B,KAAK,UAAU;IACf,KAAK,WAAW;MACf,OAAO,oBAAoB;IAE5B,KAAK,YAAY;IACjB,KAAK,YAAY;MAChB,OAAO,uBAAuB;IAE/B,KAAK,UAAU;MACd,OAAO,UAAU;EACnB;AACD;;;;;;;;;;;;;;;;;;;;;;ACzBwE;AACR;AAC3B;AAC+D;AAWrE;AAE0C;AAEnB;AAEtD,MAAMqB,qBAAqB,GAAGA,CAAC;EAAE,GAAGC;AAAM,CAAC,KAAK;EAC/C;EACA;EACA;EACAC,OAAO,CAACC,GAAG,CAACF,KAAK,CAAC;EAClB;;EAEA,OACCG,iEAAA,CAAAC,wDAAA,QACCD,iEAAA,CAACtB,0EAAqB;IACrBwB,IAAI,EAAC,MAAM;IACXC,KAAK,EAAExB,mDAAE,CAAC,WAAW,EAAE,eAAe,CAAE;IACxCyB,OAAO,EAAEA,CAAA,KAAM;MACdC,QAAQ,CACP5B,kEAAY,CAAC6B,KAAK,EAAE;QACnBC,IAAI,EAAE,wBAAwB;QAC9BC,UAAU,EAAE;UACXC,KAAK,EAAE;QACR;MACD,CAAC,CACF,CAAC;IACF,CAAE;IACFC,QAAQ,EAAEb,KAAK,CAACa;EAAS,CAAwB,CACjD,CAAC;AAEL,CAAC;AAEDlC,wEAAkB,CAAC,wBAAwB,EAAE;EAC5C2B,KAAK,EAAExB,mDAAE,CAAC,WAAW,EAAE,eAAe,CAAC;EACvCgC,OAAO,EAAE,MAAM;EACfC,SAAS,EAAE,SAAS;EACpBC,IAAI,EAAEjB;AACP,CAAC,CAAC;;;;;;;;;;ACpDF;;;;;;;;;;ACAA;;;;;;;;;;ACAA;;;;;;;;;;ACAA;;;;;;;;;;ACAA;;;;;;UCAA;UACA;;UAEA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;UACA;;UAEA;UACA;;UAEA;UACA;UACA;;;;;WCtBA;WACA;WACA;WACA;WACA;WACA,iCAAiC,WAAW;WAC5C;WACA;;;;;WCPA;WACA;WACA;WACA;WACA,yCAAyC,wCAAwC;WACjF;WACA;WACA;;;;;WCPA;;;;;WCAA;WACA;WACA;WACA,uDAAuD,iBAAiB;WACxE;WACA,gDAAgD,aAAa;WAC7D;;;;;;;;;;;;;ACNqC","sources":["webpack://multi-blocks/./blocks/utilities.js","webpack://multi-blocks/./src/format-types/highlight.js","webpack://multi-blocks/external window [\"wp\",\"blockEditor\"]","webpack://multi-blocks/external window [\"wp\",\"components\"]","webpack://multi-blocks/external window [\"wp\",\"element\"]","webpack://multi-blocks/external window [\"wp\",\"i18n\"]","webpack://multi-blocks/external window [\"wp\",\"richText\"]","webpack://multi-blocks/webpack/bootstrap","webpack://multi-blocks/webpack/runtime/compat get default export","webpack://multi-blocks/webpack/runtime/define property getters","webpack://multi-blocks/webpack/runtime/hasOwnProperty shorthand","webpack://multi-blocks/webpack/runtime/make namespace object","webpack://multi-blocks/./src/index.js"],"sourcesContent":["export function getThematiqueFamilySlug(thematique_slug) {\r\n\tswitch (thematique_slug) {\r\n\t\tcase \"energie\":\r\n\t\tcase \"urbanisme\":\r\n\t\t\treturn \"energies-urbanisme\";\r\n\r\n\t\tcase \"acoustique\":\r\n\t\tcase \"petites-coproprietes\":\r\n\t\t\treturn \"acoustique-coproprietes\";\r\n\r\n\t\tcase \"isolation\":\r\n\t\tcase \"au-quotidien\":\r\n\t\t\treturn \"isolation-quotidien\";\r\n\r\n\t\tcase \"energies\":\r\n\t\tcase \"urbanisme\":\r\n\t\t\treturn \"energies-urbanisme\";\r\n\r\n\t\tcase \"patrimoine\":\r\n\t\tcase \"renovation\":\r\n\t\t\treturn \"patrimoine-renovation\";\r\n\r\n\t\tcase \"location\":\r\n\t\t\treturn \"location\";\r\n\t}\r\n}\r\n","import { registerFormatType, toggleFormat } from \"@wordpress/rich-text\";\r\nimport { RichTextToolbarButton } from \"@wordpress/block-editor\";\r\nimport { __ } from \"@wordpress/i18n\";\r\nimport { useBlockProps, RichText, BlockControls, InspectorControls } from \"@wordpress/block-editor\";\r\nimport {\r\n\tToolbarGroup,\r\n\tToolbarButton,\r\n\tDropdownMenu,\r\n\tToolbarDropdownMenu,\r\n\tPanelBody,\r\n\tTextControl,\r\n\tTextareaControl,\r\n\tToggleControl,\r\n\tSelectControl,\r\n} from \"@wordpress/components\";\r\n\r\nimport { getActiveFormats, getActiveObject } from \"@wordpress/rich-text\";\r\n\r\nimport { LinkControl } from \"@wordpress/block-editor\";\r\n\r\nconst HighlightFormatButton = ({ ...props }) => {\r\n\t// console.log(isActive);\r\n\t// console.log(value);\r\n\t// console.log(props);\r\n\tconsole.log(props);\r\n\t// console.log(props.contentRef.current.innerHTML);\r\n\r\n\treturn (\r\n\t\t<>\r\n\t\t\t {\r\n\t\t\t\t\tonChange(\r\n\t\t\t\t\t\ttoggleFormat(value, {\r\n\t\t\t\t\t\t\ttype: \"block-course/highlight\",\r\n\t\t\t\t\t\t\tattributes: {\r\n\t\t\t\t\t\t\t\tstyle: \"background-color: #f0ff00\",\r\n\t\t\t\t\t\t\t},\r\n\t\t\t\t\t\t})\r\n\t\t\t\t\t);\r\n\t\t\t\t}}\r\n\t\t\t\tisActive={props.isActive}>\r\n\t\t\r\n\t);\r\n};\r\n\r\nregisterFormatType(\"block-course/highlight\", {\r\n\ttitle: __(\"Highlight\", \"blocks-course\"),\r\n\ttagName: \"span\",\r\n\tclassName: \"myclass\",\r\n\tedit: HighlightFormatButton,\r\n});\r\n","module.exports = window[\"wp\"][\"blockEditor\"];","module.exports = window[\"wp\"][\"components\"];","module.exports = window[\"wp\"][\"element\"];","module.exports = window[\"wp\"][\"i18n\"];","module.exports = window[\"wp\"][\"richText\"];","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// getDefaultExport function for compatibility with non-harmony modules\n__webpack_require__.n = (module) => {\n\tvar getter = module && module.__esModule ?\n\t\t() => (module['default']) :\n\t\t() => (module);\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import \"./format-types/highlight.js\";\r\nimport \"../blocks/utilities.js\";\r\n"],"names":["getThematiqueFamilySlug","thematique_slug","registerFormatType","toggleFormat","RichTextToolbarButton","__","useBlockProps","RichText","BlockControls","InspectorControls","ToolbarGroup","ToolbarButton","DropdownMenu","ToolbarDropdownMenu","PanelBody","TextControl","TextareaControl","ToggleControl","SelectControl","getActiveFormats","getActiveObject","LinkControl","HighlightFormatButton","props","console","log","createElement","Fragment","icon","title","onClick","onChange","value","type","attributes","style","isActive","tagName","className","edit"],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"index.js","mappings":"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","sources":["webpack://multi-blocks/./node_modules/@wordpress/icons/build-module/library/check.js","webpack://multi-blocks/./node_modules/@wordpress/icons/build-module/library/trash.js","webpack://multi-blocks/./blocks/utilities.js","webpack://multi-blocks/./src/format-types/brochure.js","webpack://multi-blocks/./src/format-types/tooltip.js","webpack://multi-blocks/./src/format-types/brochure.css","webpack://multi-blocks/./src/format-types/tooltip.css","webpack://multi-blocks/external window [\"wp\",\"blockEditor\"]","webpack://multi-blocks/external window [\"wp\",\"components\"]","webpack://multi-blocks/external window [\"wp\",\"element\"]","webpack://multi-blocks/external window [\"wp\",\"i18n\"]","webpack://multi-blocks/external window [\"wp\",\"primitives\"]","webpack://multi-blocks/external window [\"wp\",\"richText\"]","webpack://multi-blocks/webpack/bootstrap","webpack://multi-blocks/webpack/runtime/compat get default export","webpack://multi-blocks/webpack/runtime/define property getters","webpack://multi-blocks/webpack/runtime/hasOwnProperty shorthand","webpack://multi-blocks/webpack/runtime/make namespace object","webpack://multi-blocks/./src/index.js"],"sourcesContent":["import { createElement } from \"@wordpress/element\";\n\n/**\n * WordPress dependencies\n */\nimport { SVG, Path } from '@wordpress/primitives';\nconst check = createElement(SVG, {\n xmlns: \"http://www.w3.org/2000/svg\",\n viewBox: \"0 0 24 24\"\n}, createElement(Path, {\n d: \"M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z\"\n}));\nexport default check;\n//# sourceMappingURL=check.js.map","import { createElement } from \"@wordpress/element\";\n\n/**\n * WordPress dependencies\n */\nimport { SVG, Path } from '@wordpress/primitives';\nconst trash = createElement(SVG, {\n xmlns: \"http://www.w3.org/2000/svg\",\n viewBox: \"0 0 24 24\"\n}, createElement(Path, {\n 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\"\n}));\nexport default trash;\n//# sourceMappingURL=trash.js.map","export function getThematiqueFamilySlug(thematique_slug) {\r\n\tswitch (thematique_slug) {\r\n\t\tcase \"energie\":\r\n\t\tcase \"urbanisme\":\r\n\t\t\treturn \"energies-urbanisme\";\r\n\r\n\t\tcase \"acoustique\":\r\n\t\tcase \"petites-coproprietes\":\r\n\t\t\treturn \"acoustique-coproprietes\";\r\n\r\n\t\tcase \"isolation\":\r\n\t\tcase \"au-quotidien\":\r\n\t\t\treturn \"isolation-quotidien\";\r\n\r\n\t\tcase \"energies\":\r\n\t\tcase \"urbanisme\":\r\n\t\t\treturn \"energies-urbanisme\";\r\n\r\n\t\tcase \"patrimoine\":\r\n\t\tcase \"renovation\":\r\n\t\t\treturn \"patrimoine-renovation\";\r\n\r\n\t\tcase \"location\":\r\n\t\t\treturn \"location\";\r\n\t}\r\n}\r\n","import { registerFormatType, toggleFormat, getActiveFormats } from \"@wordpress/rich-text\";\r\nimport { __ } from \"@wordpress/i18n\";\r\nimport { BlockControls, __experimentalLinkControl as LinkControl } from \"@wordpress/block-editor\";\r\nimport { Popover, Button } from \"@wordpress/components\";\r\n\r\nimport { ToolbarGroup, ToolbarButton, TextareaControl } from \"@wordpress/components\";\r\nimport { check, trash } from \"@wordpress/icons\";\r\n\r\nimport { useState } from \"@wordpress/element\";\r\n\r\nconst BrochureLinkFormatButton = (props) => {\r\n\tconst { isActive, value, onChange } = props;\r\n\tconst [isPopoverOpen, setIsPopoverOpen] = useState(false);\r\n\tconst [linkValue, setLinkValue] = useState(\"\");\r\n\r\n\tconst activeFormat = getActiveFormats(props.value).filter(\r\n\t\t(format) => format.type === \"block-course/brochure-format\"\r\n\t)[0];\r\n\r\n\t// console.log(activeFormat);\r\n\tconsole.log(getActiveFormats(props.value));\r\n\tfunction handleFormat() {\r\n\t\tsetIsPopoverOpen(!isPopoverOpen);\r\n\t\tonChange(\r\n\t\t\ttoggleFormat(value, {\r\n\t\t\t\ttype: \"block-course/brochure-format\",\r\n\t\t\t\tattributes: {\r\n\t\t\t\t\thref: linkValue.url,\r\n\t\t\t\t\ttarget: \"_blank\",\r\n\t\t\t\t\tdataId: linkValue.id.toString(),\r\n\t\t\t\t\tstyle: \"text-decoration: underline;\",\r\n\t\t\t\t},\r\n\t\t\t})\r\n\t\t);\r\n\t}\r\n\tfunction removeFormat() {\r\n\t\tsetIsPopoverOpen(false);\r\n\t\tsetLinkValue(\"\");\r\n\t\tonChange(\r\n\t\t\ttoggleFormat(value, {\r\n\t\t\t\ttype: \"block-course/brochure-format\",\r\n\t\t\t})\r\n\t\t);\r\n\t}\r\n\r\n\treturn (\r\n\t\t<>\r\n\t\t\t\r\n\t\t\t\t{isPopoverOpen && (\r\n\t\t\t\t\t setIsPopoverOpen(false)}\r\n\t\t\t\t\t\tclassName='popover_tooltip_field'>\r\n\t\t\t\t\t\t {\r\n\t\t\t\t\t\t\t\tconsole.log(value);\r\n\t\t\t\t\t\t\t\tsetLinkValue(value);\r\n\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t {\r\n\t\t\t\t\t\t\t\tsetIsPopoverOpen(!isPopoverOpen);\r\n\t\t\t\t\t\t\t\thandleFormat();\r\n\t\t\t\t\t\t\t}}>\r\n\t\t\t\t\t\t\tValider\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t)}\r\n\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\t!isActive ? setIsPopoverOpen(!isPopoverOpen) : removeFormat()\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t/>\r\n\t\t\t\t\r\n\t\t\t\r\n\t\t\r\n\t);\r\n};\r\n\r\nregisterFormatType(\"block-course/brochure-format\", {\r\n\ttitle: __(\"Brochure\", \"blocks-course\"),\r\n\ttagName: \"a\",\r\n\tclassName: \"brochure-link-format\",\r\n\tedit: BrochureLinkFormatButton,\r\n});\r\n","import { registerFormatType, toggleFormat } from \"@wordpress/rich-text\";\r\nimport { __ } from \"@wordpress/i18n\";\r\nimport { BlockControls } from \"@wordpress/block-editor\";\r\nimport { Popover, Button } from \"@wordpress/components\";\r\n\r\nimport { ToolbarGroup, ToolbarButton, TextareaControl, ToggleControl, SelectControl } from \"@wordpress/components\";\r\nimport { check, trash } from \"@wordpress/icons\";\r\n\r\nimport { useState } from \"@wordpress/element\";\r\n\r\nconst TooltipFormatButton = (props) => {\r\n\tconst { isActive, value, onChange } = props;\r\n\tconst [isPopoverOpen, setIsPopoverOpen] = useState(false);\r\n\tconst [popoverText, setPopoverText] = useState(\"\");\r\n\r\n\tfunction handleFormat() {\r\n\t\tsetIsPopoverOpen(!isPopoverOpen);\r\n\t\tonChange(\r\n\t\t\ttoggleFormat(value, {\r\n\t\t\t\ttype: \"block-course/tooltip\",\r\n\t\t\t\tattributes: {\r\n\t\t\t\t\t\"data-tooltip\": popoverText,\r\n\t\t\t\t\tstyle: \"text-decoration: underline;\",\r\n\t\t\t\t},\r\n\t\t\t})\r\n\t\t);\r\n\t}\r\n\tfunction removeFormat() {\r\n\t\tsetIsPopoverOpen(false);\r\n\t\tonChange(\r\n\t\t\ttoggleFormat(value, {\r\n\t\t\t\ttype: \"block-course/tooltip\",\r\n\t\t\t})\r\n\t\t);\r\n\t}\r\n\r\n\treturn (\r\n\t\t<>\r\n\t\t\t\r\n\t\t\t\t{isPopoverOpen && (\r\n\t\t\t\t\t setIsPopoverOpen(false)}\r\n\t\t\t\t\t\tclassName='popover_tooltip_field'>\r\n\t\t\t\t\t\t setPopoverText(value)}\r\n\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t {\r\n\t\t\t\t\t\t\t\tsetIsPopoverOpen(false);\r\n\t\t\t\t\t\t\t\thandleFormat();\r\n\t\t\t\t\t\t\t}}>\r\n\t\t\t\t\t\t\tValider\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\t)}\r\n\r\n\t\t\t\t\r\n\t\t\t\t\t {\r\n\t\t\t\t\t\t\t!isActive ? setIsPopoverOpen(true) : removeFormat();\r\n\t\t\t\t\t\t}}\r\n\t\t\t\t\t/>\r\n\t\t\t\t\r\n\t\t\t\r\n\t\t\r\n\t);\r\n};\r\n\r\nregisterFormatType(\"block-course/tooltip\", {\r\n\ttitle: __(\"Tooltip\", \"blocks-course\"),\r\n\ttagName: \"span\",\r\n\tclassName: \"tooltip-word\",\r\n\tedit: TooltipFormatButton,\r\n});\r\n","// extracted by mini-css-extract-plugin\nexport {};","// extracted by mini-css-extract-plugin\nexport {};","module.exports = window[\"wp\"][\"blockEditor\"];","module.exports = window[\"wp\"][\"components\"];","module.exports = window[\"wp\"][\"element\"];","module.exports = window[\"wp\"][\"i18n\"];","module.exports = window[\"wp\"][\"primitives\"];","module.exports = window[\"wp\"][\"richText\"];","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// getDefaultExport function for compatibility with non-harmony modules\n__webpack_require__.n = (module) => {\n\tvar getter = module && module.__esModule ?\n\t\t() => (module['default']) :\n\t\t() => (module);\n\t__webpack_require__.d(getter, { a: getter });\n\treturn getter;\n};","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import \"./format-types/tooltip.css\";\r\nimport \"./format-types/tooltip.js\";\r\n\r\nimport \"../blocks/utilities.js\";\r\nimport \"./format-types/brochure.css\";\r\nimport \"./format-types/brochure.js\";\r\n"],"names":["getThematiqueFamilySlug","thematique_slug","registerFormatType","toggleFormat","getActiveFormats","__","BlockControls","__experimentalLinkControl","LinkControl","Popover","Button","ToolbarGroup","ToolbarButton","TextareaControl","check","trash","useState","BrochureLinkFormatButton","props","isActive","value","onChange","isPopoverOpen","setIsPopoverOpen","linkValue","setLinkValue","activeFormat","filter","format","type","console","log","handleFormat","attributes","href","url","target","dataId","id","toString","style","removeFormat","createElement","Fragment","onClose","className","suggestionsQuery","icon","variant","onClick","label","title","tagName","edit","ToggleControl","SelectControl","TooltipFormatButton","popoverText","setPopoverText","help"],"sourceRoot":""} \ No newline at end of file diff --git a/index.php b/index.php index 29d65ef..8773c21 100644 --- a/index.php +++ b/index.php @@ -13,39 +13,83 @@ * */ +/* --------------------------- + BLOCK CATEGORY + ---------------------------*/ +function wpblock_add_block_categories($categories) +{ + return array_merge( + + [ + [ + 'slug' => 'homegrade-blocks', + 'title' => __('Blocs Homegrade ', 'block-course'), + 'icon' => 'heart', + + ], + ], + $categories + ); +} +add_action('block_categories', 'wpblock_add_block_categories', 25, 2); -// ####### REGISTER BLOCKS + +/* --------------------------- + REGISTER BLOCKS + ---------------------------*/ function create_block_multiblocks_block_init() { - register_block_type(__DIR__ . '/blocka/build'); - register_block_type(__DIR__ . '/blocks/rich-paragraph/build'); + register_block_type(__DIR__ . '/blocks/chapter-header/build'); register_block_type(__DIR__ . '/blocks/picture-banner/build'); register_block_type(__DIR__ . '/blocks/points-cles/build'); + register_block_type(__DIR__ . '/blocks/rich-paragraph/build'); register_block_type(__DIR__ . '/blocks/content-heading/build'); register_block_type(__DIR__ . '/blocks/questions-container/build'); register_block_type(__DIR__ . '/blocks/questions-container-auto/build'); register_block_type(__DIR__ . '/blocks/highlight/build'); - register_block_type(__DIR__ . '/blocks/chapter-header/build'); } add_action('init', 'create_block_multiblocks_block_init'); -// ####### ENQUEUE EDITOR JS CONTEXT +/* --------------------------- + ENQUEUE EDITOR JS CONTEXT + ---------------------------*/ function homegrade_blocks_enqueue_editor_assets() { $asset_file = include(plugin_dir_path(__FILE__) . 'build/index.asset.php'); wp_enqueue_script('homegrade-blocks-script', plugins_url('build/index.js', __FILE__), $asset_file['dependencies'], $asset_file['version']); - // wp_enqueue_script( 'blocks-course-plugin-boilerplate-script', plugins_url('build/index.js', __FILE__), $asset_file['dependencies'], $asset_file['version']); - // wp_enqueue_style( 'blocks-course-plugin-boilerplate-style', plugins_url('build/index.css', __FILE__) ); + wp_enqueue_style('blocks-course-plugin-boilerplate-style', plugins_url('build/index.css', __FILE__)); } add_action('enqueue_block_editor_assets', 'homegrade_blocks_enqueue_editor_assets'); -// ####### HANDLE BLOCKS TEMPLATE + +/* ------------------------------------- + ENQUEUE SCRIPTS AND STYLES FOR FRONT + -------------------------------------*/ +function blocks_course_plugin_enqueue_assets() +{ + $asset_file = include(plugin_dir_path(__FILE__) . 'build/index.asset.php'); + wp_enqueue_script('homegrade-blocks-tooltipjs', plugin_dir_url(__FILE__) . 'src/format-types/tooltip-front.js'); + wp_enqueue_style('homegrade-blocks-tooltipcss', plugin_dir_url(__FILE__) . 'src/format-types/tooltip.css'); + wp_enqueue_script('homegrade-blocks-brochurejs', plugin_dir_url(__FILE__) . 'src/format-types/brochure-front.js'); + wp_enqueue_style('homegrade-blocks-brochurecss', plugin_dir_url(__FILE__) . 'src/format-types/brochure.css'); + + wp_localize_script('homegrade-blocks-brochurejs', 'img_path_datas', array( + 'downloadIconPath' => plugin_dir_url(__FILE__) . '/src/img/icon_brochure_download.svg' + )); +} +add_action('wp_enqueue_scripts', 'blocks_course_plugin_enqueue_assets'); + + + +/* --------------------------- + ALLOWED BLOCKS + ---------------------------*/ function homegrade_allowed_block_types($allowed_blocks, $editor_context) { @@ -88,30 +132,8 @@ function homegrade_allowed_block_types($allowed_blocks, $editor_context) // return array_keys($blocks); } -function wpblock_add_block_categories($categories) -{ - return array_merge( - - [ - [ - 'slug' => 'homegrade-blocks', - 'title' => __('Blocs Homegrade ', 'block-course'), - 'icon' => 'heart', - - ], - ], - $categories - ); -} -add_action('block_categories', 'wpblock_add_block_categories', 25, 2); - - -function blocks_course_plugin_enqueue_assets() -{ - $asset_file = include(plugin_dir_path(__FILE__) . 'build/index.asset.php'); - wp_enqueue_script('homegrade-content-blocks', plugins_url('build/filters/filters.js', __FILE__), $asset_file['dependencies'], $asset_file['version']); -} - -add_action('enqueue_block_editor_assets', 'blocks_course_plugin_enqueue_assets'); +/* ------------------------------------- + POST TYPE TEMPLATES + -------------------------------------*/ include_once('templates.php'); diff --git a/package-lock.json b/package-lock.json index 1fd72b4..43056ad 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,7 @@ "version": "1.0.0", "license": "ISC", "dependencies": { + "@wordpress/icons": "^9.30.0", "@wordpress/rich-text": "^6.16.0" }, "devDependencies": { @@ -4308,6 +4309,19 @@ "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.2.tgz", "integrity": "sha512-VE0SOVEHCk7Qc8ulkWw3ntAzXuqf7S2lvwQaDLRnUeIEaKNQJzV6BwmLKhOqT61aGhfUMrXeaBk+oDGCzvhcug==" }, + "node_modules/@wordpress/icons": { + "version": "9.30.0", + "resolved": "https://registry.npmjs.org/@wordpress/icons/-/icons-9.30.0.tgz", + "integrity": "sha512-9fiFmsUcS1zYS0DzBFyywiItuRHIlxduo3MQifB8ekQ5bZGl6ZLl1lzIqaY1mmdc12bLB+Sxd9SeIcC2t08FfA==", + "dependencies": { + "@babel/runtime": "^7.16.0", + "@wordpress/element": "^5.16.0", + "@wordpress/primitives": "^3.37.0" + }, + "engines": { + "node": ">=12" + } + }, "node_modules/@wordpress/is-shallow-equal": { "version": "4.39.0", "resolved": "https://registry.npmjs.org/@wordpress/is-shallow-equal/-/is-shallow-equal-4.39.0.tgz", @@ -4405,6 +4419,19 @@ "prettier": ">=2" } }, + "node_modules/@wordpress/primitives": { + "version": "3.37.0", + "resolved": "https://registry.npmjs.org/@wordpress/primitives/-/primitives-3.37.0.tgz", + "integrity": "sha512-d+TioEE+T4Hye0CKIQwxTQVdMOFnk/GJW1BS0NatNWKcwaj3nQszxHkWAUWYg401dKx+TDeYae4He1ufur5AWA==", + "dependencies": { + "@babel/runtime": "^7.16.0", + "@wordpress/element": "^5.16.0", + "classnames": "^2.3.1" + }, + "engines": { + "node": ">=12" + } + }, "node_modules/@wordpress/priority-queue": { "version": "2.39.0", "resolved": "https://registry.npmjs.org/@wordpress/priority-queue/-/priority-queue-2.39.0.tgz", @@ -5760,6 +5787,11 @@ "integrity": "sha512-0TNiGstbQmCFwt4akjjBg5pLRTSyj/PkWQ1ZoO2zntmg9yLqSRxwEa4iCfQLGjqhiqBfOJa7W/E8wfGrTDmlZQ==", "dev": true }, + "node_modules/classnames": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz", + "integrity": "sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw==" + }, "node_modules/clean-webpack-plugin": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/clean-webpack-plugin/-/clean-webpack-plugin-3.0.0.tgz", @@ -19691,6 +19723,16 @@ } } }, + "@wordpress/icons": { + "version": "9.30.0", + "resolved": "https://registry.npmjs.org/@wordpress/icons/-/icons-9.30.0.tgz", + "integrity": "sha512-9fiFmsUcS1zYS0DzBFyywiItuRHIlxduo3MQifB8ekQ5bZGl6ZLl1lzIqaY1mmdc12bLB+Sxd9SeIcC2t08FfA==", + "requires": { + "@babel/runtime": "^7.16.0", + "@wordpress/element": "^5.16.0", + "@wordpress/primitives": "^3.37.0" + } + }, "@wordpress/is-shallow-equal": { "version": "4.39.0", "resolved": "https://registry.npmjs.org/@wordpress/is-shallow-equal/-/is-shallow-equal-4.39.0.tgz", @@ -19753,6 +19795,16 @@ "dev": true, "requires": {} }, + "@wordpress/primitives": { + "version": "3.37.0", + "resolved": "https://registry.npmjs.org/@wordpress/primitives/-/primitives-3.37.0.tgz", + "integrity": "sha512-d+TioEE+T4Hye0CKIQwxTQVdMOFnk/GJW1BS0NatNWKcwaj3nQszxHkWAUWYg401dKx+TDeYae4He1ufur5AWA==", + "requires": { + "@babel/runtime": "^7.16.0", + "@wordpress/element": "^5.16.0", + "classnames": "^2.3.1" + } + }, "@wordpress/priority-queue": { "version": "2.39.0", "resolved": "https://registry.npmjs.org/@wordpress/priority-queue/-/priority-queue-2.39.0.tgz", @@ -20744,6 +20796,11 @@ "integrity": "sha512-0TNiGstbQmCFwt4akjjBg5pLRTSyj/PkWQ1ZoO2zntmg9yLqSRxwEa4iCfQLGjqhiqBfOJa7W/E8wfGrTDmlZQ==", "dev": true }, + "classnames": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz", + "integrity": "sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw==" + }, "clean-webpack-plugin": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/clean-webpack-plugin/-/clean-webpack-plugin-3.0.0.tgz", diff --git a/package.json b/package.json index 98ea0f8..5ebe894 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,7 @@ "@wordpress/scripts": "^26.9.0" }, "dependencies": { + "@wordpress/icons": "^9.30.0", "@wordpress/rich-text": "^6.16.0" } } diff --git a/src/format-types/brochure-front.js b/src/format-types/brochure-front.js new file mode 100644 index 0000000..02d5fe7 --- /dev/null +++ b/src/format-types/brochure-front.js @@ -0,0 +1,21 @@ +// import downloadBrochureIcon from "../img/icon_brochure_download.svg"; + +window.addEventListener("DOMContentLoaded", (event) => { + // let tooltips = document.querySelectorAll(".tooltip-word"); + let brochureLinks = document.querySelectorAll(".brochure-link-format"); + + // console.log("SALUT"); + // console.log(tooltips); + // alert("SALUT"); + const iconSrc = img_path_datas.downloadIconPath; + brochureLinks.forEach((brochureLink) => { + console.log(brochureLink); + + const brochureLinkIcon = document.createElement("img"); + brochureLinkIcon.src = iconSrc; + brochureLinkIcon.classList.add("brochure-download-icon"); + brochureLinkIcon.alt = ""; + + brochureLink.appendChild(brochureLinkIcon); + }); +}); diff --git a/src/format-types/brochure.css b/src/format-types/brochure.css new file mode 100644 index 0000000..29047c1 --- /dev/null +++ b/src/format-types/brochure.css @@ -0,0 +1,5 @@ +.brochure-download-icon { + margin: 0 0px 0 6px; + display: inline-block; + transform: translateY(-1px); +} diff --git a/src/format-types/brochure.js b/src/format-types/brochure.js new file mode 100644 index 0000000..1f99efa --- /dev/null +++ b/src/format-types/brochure.js @@ -0,0 +1,99 @@ +import { registerFormatType, toggleFormat, getActiveFormats } from "@wordpress/rich-text"; +import { __ } from "@wordpress/i18n"; +import { BlockControls, __experimentalLinkControl as LinkControl } from "@wordpress/block-editor"; +import { Popover, Button } from "@wordpress/components"; + +import { ToolbarGroup, ToolbarButton, TextareaControl } from "@wordpress/components"; +import { check, trash } from "@wordpress/icons"; + +import { useState } from "@wordpress/element"; + +const BrochureLinkFormatButton = (props) => { + const { isActive, value, onChange } = props; + const [isPopoverOpen, setIsPopoverOpen] = useState(false); + const [linkValue, setLinkValue] = useState(""); + + const activeFormat = getActiveFormats(props.value).filter( + (format) => format.type === "block-course/brochure-format" + )[0]; + + // console.log(activeFormat); + console.log(getActiveFormats(props.value)); + function handleFormat() { + setIsPopoverOpen(!isPopoverOpen); + onChange( + toggleFormat(value, { + type: "block-course/brochure-format", + attributes: { + href: linkValue.url, + target: "_blank", + dataId: linkValue.id.toString(), + style: "text-decoration: underline;", + }, + }) + ); + } + function removeFormat() { + setIsPopoverOpen(false); + setLinkValue(""); + onChange( + toggleFormat(value, { + type: "block-course/brochure-format", + }) + ); + } + + return ( + <> + + {isPopoverOpen && ( + setIsPopoverOpen(false)} + className='popover_tooltip_field'> + { + console.log(value); + setLinkValue(value); + }} + /> + + + )} + + + + !isActive ? setIsPopoverOpen(!isPopoverOpen) : removeFormat() + } + /> + + + + ); +}; + +registerFormatType("block-course/brochure-format", { + title: __("Brochure", "blocks-course"), + tagName: "a", + className: "brochure-link-format", + edit: BrochureLinkFormatButton, +}); diff --git a/src/format-types/highlight.js b/src/format-types/highlight.js deleted file mode 100644 index 669f7fc..0000000 --- a/src/format-types/highlight.js +++ /dev/null @@ -1,53 +0,0 @@ -import { registerFormatType, toggleFormat } from "@wordpress/rich-text"; -import { RichTextToolbarButton } from "@wordpress/block-editor"; -import { __ } from "@wordpress/i18n"; -import { useBlockProps, RichText, BlockControls, InspectorControls } from "@wordpress/block-editor"; -import { - ToolbarGroup, - ToolbarButton, - DropdownMenu, - ToolbarDropdownMenu, - PanelBody, - TextControl, - TextareaControl, - ToggleControl, - SelectControl, -} from "@wordpress/components"; - -import { getActiveFormats, getActiveObject } from "@wordpress/rich-text"; - -import { LinkControl } from "@wordpress/block-editor"; - -const HighlightFormatButton = ({ ...props }) => { - // console.log(isActive); - // console.log(value); - // console.log(props); - console.log(props); - // console.log(props.contentRef.current.innerHTML); - - return ( - <> - { - onChange( - toggleFormat(value, { - type: "block-course/highlight", - attributes: { - style: "background-color: #f0ff00", - }, - }) - ); - }} - isActive={props.isActive}> - - ); -}; - -registerFormatType("block-course/highlight", { - title: __("Highlight", "blocks-course"), - tagName: "span", - className: "myclass", - edit: HighlightFormatButton, -}); diff --git a/src/format-types/tooltip-front.js b/src/format-types/tooltip-front.js new file mode 100644 index 0000000..44ae963 --- /dev/null +++ b/src/format-types/tooltip-front.js @@ -0,0 +1,26 @@ +window.addEventListener("DOMContentLoaded", (event) => { + // let tooltips = document.querySelectorAll(".tooltip-word"); + let tooltipWords = document.querySelectorAll("[data-tooltip]"); + + // console.log("SALUT"); + // console.log(tooltips); + // alert("SALUT"); + tooltipWords.forEach((tooltipWord) => { + tooltipWord.addEventListener("mouseover", (event) => { + const tooltipPopup = document.createElement("div"); + tooltipPopup.className = "tooltip-popup"; + + const tooltipContent = tooltipWord.getAttribute("data-tooltip"); + const tooltipContentParagraph = document.createElement("p"); + tooltipContentParagraph.textContent = tooltipContent; + + tooltipPopup.appendChild(tooltipContentParagraph); + tooltipWord.appendChild(tooltipPopup); + }); + + tooltipWord.addEventListener("mouseout", function () { + const tooltipPopup = tooltipWord.querySelector(".tooltip-popup"); + tooltipPopup.remove(); + }); + }); +}); diff --git a/src/format-types/tooltip.css b/src/format-types/tooltip.css new file mode 100644 index 0000000..99b0cac --- /dev/null +++ b/src/format-types/tooltip.css @@ -0,0 +1,40 @@ +.popover_tooltip_field { + .components-popover__content { + padding: 10px !important; + min-width: 200px; + } +} + +.tooltip-word { + padding-top: 12px; + position: relative; + cursor: default; + text-underline-offset: 4px; + text-decoration-style: dashed; + text-decoration-color: red; +} + +.tooltip-popup { + background-color: yellow; + position: absolute; + top: -6px; + left: 50%; + text-align: center; + transform: translate(-50%, -100%); + padding: 10px; +} +.tooltip-popup:after { + content: ""; + display: block; + background-color: white; + position: absolute; + top: 100%; + left: 50%; + width: 20px; + height: 20px; + transform: translate(-50%, -50%) rotate(45deg); + box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.08); +} +.tooltip-popup p { + margin: 0 !important; +} diff --git a/src/format-types/tooltip.js b/src/format-types/tooltip.js new file mode 100644 index 0000000..1b01195 --- /dev/null +++ b/src/format-types/tooltip.js @@ -0,0 +1,81 @@ +import { registerFormatType, toggleFormat } from "@wordpress/rich-text"; +import { __ } from "@wordpress/i18n"; +import { BlockControls } from "@wordpress/block-editor"; +import { Popover, Button } from "@wordpress/components"; + +import { ToolbarGroup, ToolbarButton, TextareaControl, ToggleControl, SelectControl } from "@wordpress/components"; +import { check, trash } from "@wordpress/icons"; + +import { useState } from "@wordpress/element"; + +const TooltipFormatButton = (props) => { + const { isActive, value, onChange } = props; + const [isPopoverOpen, setIsPopoverOpen] = useState(false); + const [popoverText, setPopoverText] = useState(""); + + function handleFormat() { + setIsPopoverOpen(!isPopoverOpen); + onChange( + toggleFormat(value, { + type: "block-course/tooltip", + attributes: { + "data-tooltip": popoverText, + style: "text-decoration: underline;", + }, + }) + ); + } + function removeFormat() { + setIsPopoverOpen(false); + onChange( + toggleFormat(value, { + type: "block-course/tooltip", + }) + ); + } + + return ( + <> + + {isPopoverOpen && ( + setIsPopoverOpen(false)} + className='popover_tooltip_field'> + setPopoverText(value)} + /> + + + )} + + + { + !isActive ? setIsPopoverOpen(true) : removeFormat(); + }} + /> + + + + ); +}; + +registerFormatType("block-course/tooltip", { + title: __("Tooltip", "blocks-course"), + tagName: "span", + className: "tooltip-word", + edit: TooltipFormatButton, +}); diff --git a/src/img/icon_brochure_download.svg b/src/img/icon_brochure_download.svg new file mode 100644 index 0000000..5c5c157 --- /dev/null +++ b/src/img/icon_brochure_download.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/src/index.js b/src/index.js index 0807276..79cf6b2 100644 --- a/src/index.js +++ b/src/index.js @@ -1,2 +1,6 @@ -import "./format-types/highlight.js"; +import "./format-types/tooltip.css"; +import "./format-types/tooltip.js"; + import "../blocks/utilities.js"; +import "./format-types/brochure.css"; +import "./format-types/brochure.js"; diff --git a/templates.php b/templates.php index 91f208f..a275114 100644 --- a/templates.php +++ b/templates.php @@ -1,5 +1,7 @@