adding timeline block

This commit is contained in:
Antoine M 2023-10-17 17:34:26 +02:00
parent 118b4e96ea
commit c985817746
30 changed files with 30358 additions and 0 deletions

View File

@ -0,0 +1,18 @@
# This file is for unifying the coding style for different editors and IDEs
# editorconfig.org
# WordPress Coding Standards
# https://make.wordpress.org/core/handbook/coding-standards/
root = true
[*]
charset = utf-8
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
indent_style = tab
[*.{yml,yaml}]
indent_style = space
indent_size = 2

30
blocks/timeline/.gitignore vendored Normal file
View File

@ -0,0 +1,30 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Coverage directory used by tools like istanbul
coverage
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Output of `npm pack`
*.tgz
# Output of `wp-scripts plugin-zip`
*.zip
# dotenv environment variables file
.env

View File

@ -0,0 +1,30 @@
{
"$schema": "https://schemas.wp.org/trunk/block.json",
"apiVersion": 2,
"name": "homegrade-content-blocks/timeline",
"version": "0.1.0",
"title": "Timeline",
"category": "homegrade-blocks",
"description": "Pour la création de timeline",
"supports": {
"html": false
},
"textdomain": "homegrade-blocks",
"editorScript": "file:./index.js",
"editorStyle": "file:./index.css",
"style": "file:./style-index.css",
"attributes": {
"hasStepPictures": {
"type": "boolean",
"default": true
},
"hasStepIcons": {
"type": "boolean",
"default": true
},
"stepPictureFormat": {
"type": "string",
"default": "md"
}
}
}

View File

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

View File

@ -0,0 +1,31 @@
/*!****************************************************************************************************************************************************************************************************************************************!*\
!*** 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 ***!
\****************************************************************************************************************************************************************************************************************************************/
.homegrade-blocks-timeline .homegrade-blocks-timeline-step .block-editor-media-placeholder {
margin-bottom: 30px;
}
.homegrade-blocks-timeline-step__panel-body .components-dropdown .components-toolbar__control {
background-color: #e04d42;
color: white;
}
.homegrade-blocks-timeline-step__panel-body img {
display: block;
}
.homegrade-blocks-timeline-step__panel-body .components-dropdown {
display: block;
width: -moz-fit-content;
width: fit-content;
}
.homegrade-blocks-timeline-step__panel-body .media-replace-container {
padding: 10px 0;
display: flex;
gap: 10px;
align-items: center;
}
/*!******************************************************************************************************************************************************************************************************************************************************!*\
!*** 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/timeline-step/editor.scss ***!
\******************************************************************************************************************************************************************************************************************************************************/
/*# sourceMappingURL=index.css.map*/

View File

@ -0,0 +1 @@
{"version":3,"file":"index.css","mappings":";;;AAEE;EACC;AADH;;AAYC;EACC;EACA;AATF;AAWC;EACC;AATF;AAWC;EACC;EACA;EAAA;AATF;AAWC;EACC;EACA;EACA;EACA;AATF,C","sources":["webpack://multiblocks/./src/editor.scss"],"sourcesContent":[".homegrade-blocks-timeline {\r\n\t.homegrade-blocks-timeline-step {\r\n\t\t.block-editor-media-placeholder {\r\n\t\t\tmargin-bottom: 30px;\r\n\t\t}\r\n\t}\r\n}\r\n\r\n.homegrade-blocks-timeline__panel-body {\r\n\t// label {\r\n\t// \ttext-transform: uppercase;\r\n\t// }\r\n}\r\n.homegrade-blocks-timeline-step__panel-body {\r\n\t.components-dropdown .components-toolbar__control {\r\n\t\tbackground-color: #e04d42;\r\n\t\tcolor: white;\r\n\t}\r\n\timg {\r\n\t\tdisplay: block;\r\n\t}\r\n\t.components-dropdown {\r\n\t\tdisplay: block;\r\n\t\twidth: fit-content;\r\n\t}\r\n\t.media-replace-container {\r\n\t\tpadding: 10px 0;\r\n\t\tdisplay: flex;\r\n\t\tgap: 10px;\r\n\t\talign-items: center;\r\n\t\t// margin-top: 10px;\r\n\t}\r\n}\r\n"],"names":[],"sourceRoot":""}

View File

@ -0,0 +1,828 @@
/******/ (() => { // webpackBootstrap
/******/ "use strict";
/******/ var __webpack_modules__ = ({
/***/ "./src/edit.js":
/*!*********************!*\
!*** ./src/edit.js ***!
\*********************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ Edit)
/* 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_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _editor_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./editor.scss */ "./src/editor.scss");
/* harmony import */ var _timeline_step__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./timeline-step */ "./src/timeline-step/index.js");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__);
function Edit({
attributes,
setAttributes,
clientId,
...props
}) {
let {
hasStepPictures,
stepPictureFormat,
hasStepIcons
} = attributes;
let children = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_5__.useSelect)(select => select("core/block-editor").getBlocksByClientId(clientId)[0].innerBlocks);
function handleStepPictureFormatChange(stepPictureFormat) {
setAttributes({
stepPictureFormat
});
}
function onChangehasStepPictures() {
setAttributes({
hasStepPictures: !hasStepPictures
});
}
function onChangehasStepIcons() {
setAttributes({
hasStepIcons: !hasStepIcons
});
}
function updateChildrensProps(children) {
children.forEach(child => {
(0,_wordpress_data__WEBPACK_IMPORTED_MODULE_5__.dispatch)("core/block-editor").updateBlockAttributes(child.clientId, {
hasStepIcon: hasStepIcons,
hasStepPicture: hasStepPictures
});
});
}
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
if (children && children.length > 0) {
updateChildrensProps(children);
}
}, [children, hasStepPictures, hasStepIcons]);
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Variantes de Timeline", "homegrade-blocks__texte-backoffice"),
className: "homegrade-blocks-timeline__panel-body"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
htmlFor: ""
}, "Icones"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.FormToggle, {
label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Icones", "homegrade-blocks__texte-backoffice"),
checked: hasStepIcons,
onChange: onChangehasStepIcons
})), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
htmlFor: ""
}, "Images"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.FormToggle, {
label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Icones", "homegrade-blocks__texte-backoffice"),
checked: hasStepPictures,
onChange: onChangehasStepPictures
})), hasStepPictures && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.RadioControl
// label={__("Tailles des images", "textdomain")}
, {
help: "Taille des images",
selected: stepPictureFormat,
options: [{
label: "Carré",
value: "squared"
}, {
label: "Moyenne",
value: "md"
}, {
label: "Hautes",
value: "xl"
}],
onChange: handleStepPictureFormatChange
})))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.useBlockProps)({
className: `homegrade-blocks-timeline`
})
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.InnerBlocks, {
allowedBlocks: ["homegrade-content-blocks/timeline-step"]
})));
}
/***/ }),
/***/ "./src/index.js":
/*!**********************!*\
!*** ./src/index.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_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 _style_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./style.scss */ "./src/style.scss");
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./edit */ "./src/edit.js");
/* harmony import */ var _save__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./save */ "./src/save.js");
/* harmony import */ var _block_json__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./block.json */ "./src/block.json");
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)(_block_json__WEBPACK_IMPORTED_MODULE_5__.name, {
icon: {
src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
xmlns: "http://www.w3.org/2000/svg",
"data-name": "Layer 1",
viewBox: "0 0 100 125",
x: "0px",
y: "0px"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("title", null, "130all"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
d: "M31.34,16.75a9.19,9.19,0,1,0-11.69,8.83V41.13a9.18,9.18,0,0,0,0,17.67V74.34a9.19,9.19,0,1,0,5,0V58.79a9.18,9.18,0,0,0,0-17.67V25.59A9.2,9.2,0,0,0,31.34,16.75Z"
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
x: "38.45",
y: "3.26",
width: "38.58",
height: "27.14"
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
x: "38.45",
y: "36.39",
width: "48.58",
height: "27.14"
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
x: "38.45",
y: "69.6",
width: "38.58",
height: "27.14"
})),
foreground: "#DF1E1E"
},
edit: _edit__WEBPACK_IMPORTED_MODULE_3__["default"],
save: _save__WEBPACK_IMPORTED_MODULE_4__["default"]
});
/***/ }),
/***/ "./src/save.js":
/*!*********************!*\
!*** ./src/save.js ***!
\*********************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ save)
/* 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_block_editor__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__);
function save({
attributes
}) {
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("section", {
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save({
className: `homegrade-blocks-timeline`
})
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.InnerBlocks.Content, null));
}
/***/ }),
/***/ "./src/timeline-step/edit.js":
/*!***********************************!*\
!*** ./src/timeline-step/edit.js ***!
\***********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ Edit)
/* 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_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _editor_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./editor.scss */ "./src/timeline-step/editor.scss");
/* 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/trash.js");
function Edit({
attributes,
setAttributes,
...props
}) {
let {
timelineStepTitle,
timelineStepSubtitle,
timelineStepImageUrl,
timelineStepImageId,
timelineStepImageAlt,
timelineStepIconUrl,
timelineStepIconId,
timelineStepIconAlt,
hasStepPicture,
hasStepIcon
} = attributes;
function onChangeTimelineStepTitle(timelineStepTitle) {
setAttributes({
timelineStepTitle
});
}
function onChangeTimelineDescription(timelineStepSubtitle) {
setAttributes({
timelineStepSubtitle
});
}
function setImageAttributes(media) {
if (!media || !media.url) {
setAttributes({
timelineStepImageUrl: null,
timelineStepImageId: null,
timelineStepImageAlt: null
});
return;
}
setAttributes({
timelineStepImageUrl: media.url,
timelineStepImageId: media.id,
timelineStepImageAlt: media?.alt
});
}
function removeImageAttributes() {
setAttributes({
timelineStepImageUrl: null,
timelineStepImageId: null,
timelineStepImageAlt: null
});
}
function setIconAttributes(media) {
console.log(media);
if (!media || !media.url) {
setAttributes({
timelineStepIconUrl: null,
timelineStepIconId: null,
timelineStepIconAlt: null
});
return;
}
setAttributes({
timelineStepIconUrl: media.url,
timelineStepIconId: media.id,
timelineStepIconAlt: media?.alt
});
}
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
if (hasStepPicture === false) {
setImageAttributes(null);
}
}, [hasStepPicture]);
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
if (hasStepIcon === false) {
setIconAttributes(null);
}
}, [hasStepIcon]);
console.log(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"]);
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__.InspectorControls, null, hasStepPicture && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, {
className: "homegrade-blocks-timeline-step__panel-body",
title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Image", "homegrade-blocks__texte-backoffice")
}, timelineStepImageUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: timelineStepImageUrl,
alt: timelineStepImageAlt
}), (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_3__.MediaReplaceFlow, {
mediaId: timelineStepImageId,
mediaUrl: timelineStepImageUrl,
allowedTypes: ["image"],
accept: "image/*",
onSelect: setImageAttributes,
name: !timelineStepImageUrl ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Ajouter", "homegrade-blocks__texte-backoffice") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Remplacer", "homegrade-blocks__texte-backoffice")
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.Button, {
className: "custom-flow-button",
variant: "primary",
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"],
label: "Supprimer"
}))), hasStepIcon && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, {
title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Icone", "homegrade-blocks__texte-backoffice")
}, timelineStepIconUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: timelineStepIconUrl,
alt: timelineStepIconAlt
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.MediaReplaceFlow, {
mediaId: timelineStepIconId,
mediaUrl: timelineStepIconUrl,
allowedTypes: ["image"],
accept: "image/*",
onSelect: setIconAttributes
// name={
// !timelineStepIconUrl
// ? __(
// "Ajouter une Image",
// "homegrade-blocks__texte-backoffice"
// )
// : __("Remplacer Image", "homegrade-blocks__texte-backoffice")
// }
}))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.BlockControls, null, (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_block_editor__WEBPACK_IMPORTED_MODULE_3__.MediaReplaceFlow, {
mediaId: timelineStepImageId,
mediaUrl: timelineStepImageUrl,
allowedTypes: ["image"],
accept: "image/*",
onSelect: setImageAttributes,
name: !timelineStepImageUrl ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Ajouter une Image", "homegrade-blocks__texte-backoffice") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Remplacer Image", "homegrade-blocks__texte-backoffice")
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarButton, {
title: "Supprimer Image",
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"],
isActive: timelineStepImageUrl,
onClick: removeImageAttributes
}))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
className: `homegrade-blocks-timeline-step`
})
}, hasStepPicture && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-timeline-step__cover"
}, !timelineStepImageUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.MediaPlaceholder, {
accept: "image/*",
allowedTypes: ["image"],
onSelect: setImageAttributes,
multiple: false,
handleUpload: true
}), timelineStepImageUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: timelineStepImageUrl,
alt: timelineStepImageAlt
})), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-timeline-step__content"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.RichText, {
tagName: "h3",
className: "homegrade-blocks-timeline-step__title",
placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Date ou Titre de l'étape", "homegrade-blocks__texte-backoffice"),
value: timelineStepTitle,
onChange: onChangeTimelineStepTitle
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.RichText, {
tagName: "h2",
className: "homegrade-blocks-timeline-step__subtitle",
placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Titre / Sous-titre de l'étape", "homegrade-blocks__texte-backoffice"),
value: timelineStepSubtitle,
onChange: onChangeTimelineDescription
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.InnerBlocks, {
allowedBlocks: ["core/paragraph"]
}))));
}
/***/ }),
/***/ "./src/timeline-step/index.js":
/*!************************************!*\
!*** ./src/timeline-step/index.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_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 _style_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./style.scss */ "./src/timeline-step/style.scss");
/* harmony import */ var _block_json__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./block.json */ "./src/timeline-step/block.json");
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./edit */ "./src/timeline-step/edit.js");
/* harmony import */ var _save__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./save */ "./src/timeline-step/save.js");
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)(_block_json__WEBPACK_IMPORTED_MODULE_3__.name, {
title: _block_json__WEBPACK_IMPORTED_MODULE_3__.title,
icon: {
foreground: "#DF1E1E",
src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
version: "1.1",
x: "0px",
y: "0px",
viewBox: "0 0 100 125",
"enable-background": "new 0 0 100 100"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("g", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
d: "M84.6,33.6c-0.8-1.1-2.3-1.5-3.5-0.7c-1.1,0.8-1.5,2.3-0.7,3.5l7.4,11.1H66c-1.2-7.8-7.9-13.8-16-13.8s-14.8,6-16,13.8H7.5 C6.1,47.5,5,48.6,5,50s1.1,2.5,2.5,2.5H34c1.2,7.8,7.9,13.8,16,13.8s14.8-6,16-13.8h21.8l-7.4,11.1c-0.8,1.1-0.5,2.7,0.7,3.5 c0.4,0.3,0.9,0.4,1.4,0.4c0.8,0,1.6-0.4,2.1-1.1l10-15c0.6-0.8,0.6-1.9,0-2.8L84.6,33.6z M50,63.8c-7.6,0-13.8-6.2-13.8-13.8 S42.4,36.3,50,36.3S63.8,42.4,63.8,50S57.6,63.8,50,63.8z"
})))
},
supports: _block_json__WEBPACK_IMPORTED_MODULE_3__.supports,
attributes: _block_json__WEBPACK_IMPORTED_MODULE_3__.attributes,
edit: _edit__WEBPACK_IMPORTED_MODULE_4__["default"],
save: _save__WEBPACK_IMPORTED_MODULE_5__["default"]
});
/***/ }),
/***/ "./src/timeline-step/save.js":
/*!***********************************!*\
!*** ./src/timeline-step/save.js ***!
\***********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ save)
/* 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_block_editor__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__);
function save({
attributes
}) {
const {
timelineStepTitle,
timelineStepSubtitle,
timelineStepImageId,
timelineStepImageUrl,
timelineStepImageAlt,
hasStepPicture,
hasStepIcon
} = attributes;
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save({
className: `homegrade-blocks-timeline-step`
})
}, hasStepPicture && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-timeline-step__cover"
}, timelineStepImageUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: timelineStepImageUrl,
alt: timelineStepImageAlt
})), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-timeline-step__content"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.RichText.Content, {
tagName: "h3",
className: "homegrade-blocks-timeline-step__title",
value: timelineStepTitle
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.RichText.Content, {
tagName: "p",
className: "homegrade-blocks-timeline-step__subtitle",
value: timelineStepSubtitle
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.InnerBlocks.Content, null)));
}
/***/ }),
/***/ "./src/editor.scss":
/*!*************************!*\
!*** ./src/editor.scss ***!
\*************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/style.scss":
/*!************************!*\
!*** ./src/style.scss ***!
\************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/timeline-step/editor.scss":
/*!***************************************!*\
!*** ./src/timeline-step/editor.scss ***!
\***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/timeline-step/style.scss":
/*!**************************************!*\
!*** ./src/timeline-step/style.scss ***!
\**************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__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
/***/ }),
/***/ "@wordpress/block-editor":
/*!*************************************!*\
!*** external ["wp","blockEditor"] ***!
\*************************************/
/***/ ((module) => {
module.exports = window["wp"]["blockEditor"];
/***/ }),
/***/ "@wordpress/blocks":
/*!********************************!*\
!*** external ["wp","blocks"] ***!
\********************************/
/***/ ((module) => {
module.exports = window["wp"]["blocks"];
/***/ }),
/***/ "@wordpress/components":
/*!************************************!*\
!*** external ["wp","components"] ***!
\************************************/
/***/ ((module) => {
module.exports = window["wp"]["components"];
/***/ }),
/***/ "@wordpress/data":
/*!******************************!*\
!*** external ["wp","data"] ***!
\******************************/
/***/ ((module) => {
module.exports = window["wp"]["data"];
/***/ }),
/***/ "@wordpress/element":
/*!*********************************!*\
!*** external ["wp","element"] ***!
\*********************************/
/***/ ((module) => {
module.exports = window["wp"]["element"];
/***/ }),
/***/ "@wordpress/i18n":
/*!******************************!*\
!*** external ["wp","i18n"] ***!
\******************************/
/***/ ((module) => {
module.exports = window["wp"]["i18n"];
/***/ }),
/***/ "@wordpress/primitives":
/*!************************************!*\
!*** external ["wp","primitives"] ***!
\************************************/
/***/ ((module) => {
module.exports = window["wp"]["primitives"];
/***/ }),
/***/ "./src/block.json":
/*!************************!*\
!*** ./src/block.json ***!
\************************/
/***/ ((module) => {
module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/timeline","version":"0.1.0","title":"Timeline","category":"homegrade-blocks","description":"Pour la création de timeline","supports":{"html":false},"textdomain":"homegrade-blocks","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","attributes":{"hasStepPictures":{"type":"boolean","default":true},"hasStepIcons":{"type":"boolean","default":true},"stepPictureFormat":{"type":"string","default":"md"}}}');
/***/ }),
/***/ "./src/timeline-step/block.json":
/*!**************************************!*\
!*** ./src/timeline-step/block.json ***!
\**************************************/
/***/ ((module) => {
module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/timeline-step","version":"0.1.0","title":"Étape de timeline","category":"homegrade-blocks","description":"Bloc d\'étape de timeline","supports":{"html":false},"editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","attributes":{"timelineStepTitle":{"type":"string","default":""},"timelineStepSubtitle":{"type":"string","default":""},"timelineStepImageUrl":{"type":"string"},"timelineStepImageId":{"type":"number"},"timelineStepImageAlt":{"type":"string","source":"attribute","selector":"img","attribute":"alt","default":""},"timelineStepIconUrl":{"type":"string"},"timelineStepIconId":{"type":"number"},"timelineStepIconAlt":{"type":"string","source":"attribute","selector":"img","attribute":"alt","default":""},"hasStepIcon":{"type":"boolean","default":true},"hasStepPicture":{"type":"boolean","default":true}}}');
/***/ })
/******/ });
/************************************************************************/
/******/ // The module cache
/******/ var __webpack_module_cache__ = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ var cachedModule = __webpack_module_cache__[moduleId];
/******/ if (cachedModule !== undefined) {
/******/ return cachedModule.exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = __webpack_module_cache__[moduleId] = {
/******/ // no module.id needed
/******/ // no module.loaded needed
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = __webpack_modules__;
/******/
/************************************************************************/
/******/ /* webpack/runtime/chunk loaded */
/******/ (() => {
/******/ var deferred = [];
/******/ __webpack_require__.O = (result, chunkIds, fn, priority) => {
/******/ if(chunkIds) {
/******/ priority = priority || 0;
/******/ for(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1];
/******/ deferred[i] = [chunkIds, fn, priority];
/******/ return;
/******/ }
/******/ var notFulfilled = Infinity;
/******/ for (var i = 0; i < deferred.length; i++) {
/******/ var chunkIds = deferred[i][0];
/******/ var fn = deferred[i][1];
/******/ var priority = deferred[i][2];
/******/ var fulfilled = true;
/******/ for (var j = 0; j < chunkIds.length; j++) {
/******/ if ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every((key) => (__webpack_require__.O[key](chunkIds[j])))) {
/******/ chunkIds.splice(j--, 1);
/******/ } else {
/******/ fulfilled = false;
/******/ if(priority < notFulfilled) notFulfilled = priority;
/******/ }
/******/ }
/******/ if(fulfilled) {
/******/ deferred.splice(i--, 1)
/******/ var r = fn();
/******/ if (r !== undefined) result = r;
/******/ }
/******/ }
/******/ return result;
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/compat get default export */
/******/ (() => {
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = (module) => {
/******/ var getter = module && module.__esModule ?
/******/ () => (module['default']) :
/******/ () => (module);
/******/ __webpack_require__.d(getter, { a: getter });
/******/ return getter;
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/define property getters */
/******/ (() => {
/******/ // define getter functions for harmony exports
/******/ __webpack_require__.d = (exports, definition) => {
/******/ for(var key in definition) {
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
/******/ }
/******/ }
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ (() => {
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
/******/ })();
/******/
/******/ /* webpack/runtime/make namespace object */
/******/ (() => {
/******/ // define __esModule on exports
/******/ __webpack_require__.r = (exports) => {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/jsonp chunk loading */
/******/ (() => {
/******/ // no baseURI
/******/
/******/ // object to store loaded and loading chunks
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // [resolve, reject, Promise] = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ "index": 0,
/******/ "./style-index": 0
/******/ };
/******/
/******/ // no chunk on demand loading
/******/
/******/ // no prefetching
/******/
/******/ // no preloaded
/******/
/******/ // no HMR
/******/
/******/ // no HMR manifest
/******/
/******/ __webpack_require__.O.j = (chunkId) => (installedChunks[chunkId] === 0);
/******/
/******/ // install a JSONP callback for chunk loading
/******/ var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
/******/ var chunkIds = data[0];
/******/ var moreModules = data[1];
/******/ var runtime = data[2];
/******/ // add "moreModules" to the modules object,
/******/ // then flag all "chunkIds" as loaded and fire callback
/******/ var moduleId, chunkId, i = 0;
/******/ if(chunkIds.some((id) => (installedChunks[id] !== 0))) {
/******/ for(moduleId in moreModules) {
/******/ if(__webpack_require__.o(moreModules, moduleId)) {
/******/ __webpack_require__.m[moduleId] = moreModules[moduleId];
/******/ }
/******/ }
/******/ if(runtime) var result = runtime(__webpack_require__);
/******/ }
/******/ if(parentChunkLoadingFunction) parentChunkLoadingFunction(data);
/******/ for(;i < chunkIds.length; i++) {
/******/ chunkId = chunkIds[i];
/******/ if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
/******/ installedChunks[chunkId][0]();
/******/ }
/******/ installedChunks[chunkId] = 0;
/******/ }
/******/ return __webpack_require__.O(result);
/******/ }
/******/
/******/ var chunkLoadingGlobal = self["webpackChunkmultiblocks"] = self["webpackChunkmultiblocks"] || [];
/******/ chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
/******/ chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
/******/ })();
/******/
/************************************************************************/
/******/
/******/ // startup
/******/ // Load entry module and return exports
/******/ // This entry module depends on other loaded chunks and execution need to be delayed
/******/ var __webpack_exports__ = __webpack_require__.O(undefined, ["./style-index"], () => (__webpack_require__("./src/index.js")))
/******/ __webpack_exports__ = __webpack_require__.O(__webpack_exports__);
/******/
/******/ })()
;
//# sourceMappingURL=index.js.map

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,8 @@
/*!***************************************************************************************************************************************************************************************************************************************!*\
!*** 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/timeline-step/style.scss ***!
\*****************************************************************************************************************************************************************************************************************************************************/

View File

@ -0,0 +1,59 @@
{
"$schema": "https://schemas.wp.org/trunk/block.json",
"apiVersion": 2,
"name": "homegrade-content-blocks/timeline-step",
"version": "0.1.0",
"title": "Étape de timeline",
"category": "homegrade-blocks",
"description": "Bloc d'étape de timeline",
"supports": {
"html": false
},
"editorScript": "file:./index.js",
"editorStyle": "file:./index.css",
"style": "file:./style-index.css",
"attributes": {
"timelineStepTitle": {
"type": "string",
"default": ""
},
"timelineStepSubtitle": {
"type": "string",
"default": ""
},
"timelineStepImageUrl": {
"type": "string"
},
"timelineStepImageId": {
"type": "number"
},
"timelineStepImageAlt": {
"type": "string",
"source": "attribute",
"selector": "img",
"attribute": "alt",
"default": ""
},
"timelineStepIconUrl": {
"type": "string"
},
"timelineStepIconId": {
"type": "number"
},
"timelineStepIconAlt": {
"type": "string",
"source": "attribute",
"selector": "img",
"attribute": "alt",
"default": ""
},
"hasStepIcon": {
"type": "boolean",
"default": true
},
"hasStepPicture": {
"type": "boolean",
"default": true
}
}
}

View File

@ -0,0 +1 @@
<?php return array('dependencies' => array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => 'cdf5fd0662ba5ec07221');

View File

@ -0,0 +1,4 @@
/*!******************************************************************************************************************************************************************************************************************************************************!*\
!*** 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/timeline-step/editor.scss ***!
\******************************************************************************************************************************************************************************************************************************************************/

View File

@ -0,0 +1,587 @@
/******/ (() => { // webpackBootstrap
/******/ "use strict";
/******/ var __webpack_modules__ = ({
/***/ "./src/timeline-step/edit.js":
/*!***********************************!*\
!*** ./src/timeline-step/edit.js ***!
\***********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ Edit)
/* 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_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _editor_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./editor.scss */ "./src/timeline-step/editor.scss");
/* 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/trash.js");
function Edit({
attributes,
setAttributes,
...props
}) {
let {
timelineStepTitle,
timelineStepSubtitle,
timelineStepImageUrl,
timelineStepImageId,
timelineStepImageAlt,
timelineStepIconUrl,
timelineStepIconId,
timelineStepIconAlt,
hasStepPicture,
hasStepIcon
} = attributes;
function onChangeTimelineStepTitle(timelineStepTitle) {
setAttributes({
timelineStepTitle
});
}
function onChangeTimelineDescription(timelineStepSubtitle) {
setAttributes({
timelineStepSubtitle
});
}
function setImageAttributes(media) {
if (!media || !media.url) {
setAttributes({
timelineStepImageUrl: null,
timelineStepImageId: null,
timelineStepImageAlt: null
});
return;
}
setAttributes({
timelineStepImageUrl: media.url,
timelineStepImageId: media.id,
timelineStepImageAlt: media?.alt
});
}
function removeImageAttributes() {
setAttributes({
timelineStepImageUrl: null,
timelineStepImageId: null,
timelineStepImageAlt: null
});
}
function setIconAttributes(media) {
console.log(media);
if (!media || !media.url) {
setAttributes({
timelineStepIconUrl: null,
timelineStepIconId: null,
timelineStepIconAlt: null
});
return;
}
setAttributes({
timelineStepIconUrl: media.url,
timelineStepIconId: media.id,
timelineStepIconAlt: media?.alt
});
}
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
if (hasStepPicture === false) {
setImageAttributes(null);
}
}, [hasStepPicture]);
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
if (hasStepIcon === false) {
setIconAttributes(null);
}
}, [hasStepIcon]);
console.log(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"]);
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__.InspectorControls, null, hasStepPicture && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, {
className: "homegrade-blocks-timeline-step__panel-body",
title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Image", "homegrade-blocks__texte-backoffice")
}, timelineStepImageUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: timelineStepImageUrl,
alt: timelineStepImageAlt
}), (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_3__.MediaReplaceFlow, {
mediaId: timelineStepImageId,
mediaUrl: timelineStepImageUrl,
allowedTypes: ["image"],
accept: "image/*",
onSelect: setImageAttributes,
name: !timelineStepImageUrl ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Ajouter", "homegrade-blocks__texte-backoffice") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Remplacer", "homegrade-blocks__texte-backoffice")
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.Button, {
className: "custom-flow-button",
variant: "primary",
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"],
label: "Supprimer"
}))), hasStepIcon && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, {
title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Icone", "homegrade-blocks__texte-backoffice")
}, timelineStepIconUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: timelineStepIconUrl,
alt: timelineStepIconAlt
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.MediaReplaceFlow, {
mediaId: timelineStepIconId,
mediaUrl: timelineStepIconUrl,
allowedTypes: ["image"],
accept: "image/*",
onSelect: setIconAttributes
// name={
// !timelineStepIconUrl
// ? __(
// "Ajouter une Image",
// "homegrade-blocks__texte-backoffice"
// )
// : __("Remplacer Image", "homegrade-blocks__texte-backoffice")
// }
}))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.BlockControls, null, (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_block_editor__WEBPACK_IMPORTED_MODULE_3__.MediaReplaceFlow, {
mediaId: timelineStepImageId,
mediaUrl: timelineStepImageUrl,
allowedTypes: ["image"],
accept: "image/*",
onSelect: setImageAttributes,
name: !timelineStepImageUrl ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Ajouter une Image", "homegrade-blocks__texte-backoffice") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Remplacer Image", "homegrade-blocks__texte-backoffice")
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarButton, {
title: "Supprimer Image",
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"],
isActive: timelineStepImageUrl,
onClick: removeImageAttributes
}))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
className: `homegrade-blocks-timeline-step`
})
}, hasStepPicture && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-timeline-step__cover"
}, !timelineStepImageUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.MediaPlaceholder, {
accept: "image/*",
allowedTypes: ["image"],
onSelect: setImageAttributes,
multiple: false,
handleUpload: true
}), timelineStepImageUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: timelineStepImageUrl,
alt: timelineStepImageAlt
})), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-timeline-step__content"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.RichText, {
tagName: "h3",
className: "homegrade-blocks-timeline-step__title",
placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Date ou Titre de l'étape", "homegrade-blocks__texte-backoffice"),
value: timelineStepTitle,
onChange: onChangeTimelineStepTitle
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.RichText, {
tagName: "h2",
className: "homegrade-blocks-timeline-step__subtitle",
placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Titre / Sous-titre de l'étape", "homegrade-blocks__texte-backoffice"),
value: timelineStepSubtitle,
onChange: onChangeTimelineDescription
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.InnerBlocks, {
allowedBlocks: ["core/paragraph"]
}))));
}
/***/ }),
/***/ "./src/timeline-step/index.js":
/*!************************************!*\
!*** ./src/timeline-step/index.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_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 _style_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./style.scss */ "./src/timeline-step/style.scss");
/* harmony import */ var _block_json__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./block.json */ "./src/timeline-step/block.json");
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./edit */ "./src/timeline-step/edit.js");
/* harmony import */ var _save__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./save */ "./src/timeline-step/save.js");
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)(_block_json__WEBPACK_IMPORTED_MODULE_3__.name, {
title: _block_json__WEBPACK_IMPORTED_MODULE_3__.title,
icon: {
foreground: "#DF1E1E",
src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
version: "1.1",
x: "0px",
y: "0px",
viewBox: "0 0 100 125",
"enable-background": "new 0 0 100 100"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("g", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
d: "M84.6,33.6c-0.8-1.1-2.3-1.5-3.5-0.7c-1.1,0.8-1.5,2.3-0.7,3.5l7.4,11.1H66c-1.2-7.8-7.9-13.8-16-13.8s-14.8,6-16,13.8H7.5 C6.1,47.5,5,48.6,5,50s1.1,2.5,2.5,2.5H34c1.2,7.8,7.9,13.8,16,13.8s14.8-6,16-13.8h21.8l-7.4,11.1c-0.8,1.1-0.5,2.7,0.7,3.5 c0.4,0.3,0.9,0.4,1.4,0.4c0.8,0,1.6-0.4,2.1-1.1l10-15c0.6-0.8,0.6-1.9,0-2.8L84.6,33.6z M50,63.8c-7.6,0-13.8-6.2-13.8-13.8 S42.4,36.3,50,36.3S63.8,42.4,63.8,50S57.6,63.8,50,63.8z"
})))
},
supports: _block_json__WEBPACK_IMPORTED_MODULE_3__.supports,
attributes: _block_json__WEBPACK_IMPORTED_MODULE_3__.attributes,
edit: _edit__WEBPACK_IMPORTED_MODULE_4__["default"],
save: _save__WEBPACK_IMPORTED_MODULE_5__["default"]
});
/***/ }),
/***/ "./src/timeline-step/save.js":
/*!***********************************!*\
!*** ./src/timeline-step/save.js ***!
\***********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ save)
/* 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_block_editor__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__);
function save({
attributes
}) {
const {
timelineStepTitle,
timelineStepSubtitle,
timelineStepImageId,
timelineStepImageUrl,
timelineStepImageAlt,
hasStepPicture,
hasStepIcon
} = attributes;
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
..._wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save({
className: `homegrade-blocks-timeline-step`
})
}, hasStepPicture && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-timeline-step__cover"
}, timelineStepImageUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
src: timelineStepImageUrl,
alt: timelineStepImageAlt
})), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
className: "homegrade-blocks-timeline-step__content"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.RichText.Content, {
tagName: "h3",
className: "homegrade-blocks-timeline-step__title",
value: timelineStepTitle
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.RichText.Content, {
tagName: "p",
className: "homegrade-blocks-timeline-step__subtitle",
value: timelineStepSubtitle
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.InnerBlocks.Content, null)));
}
/***/ }),
/***/ "./src/timeline-step/editor.scss":
/*!***************************************!*\
!*** ./src/timeline-step/editor.scss ***!
\***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/timeline-step/style.scss":
/*!**************************************!*\
!*** ./src/timeline-step/style.scss ***!
\**************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__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
/***/ }),
/***/ "@wordpress/block-editor":
/*!*************************************!*\
!*** external ["wp","blockEditor"] ***!
\*************************************/
/***/ ((module) => {
module.exports = window["wp"]["blockEditor"];
/***/ }),
/***/ "@wordpress/blocks":
/*!********************************!*\
!*** external ["wp","blocks"] ***!
\********************************/
/***/ ((module) => {
module.exports = window["wp"]["blocks"];
/***/ }),
/***/ "@wordpress/components":
/*!************************************!*\
!*** external ["wp","components"] ***!
\************************************/
/***/ ((module) => {
module.exports = window["wp"]["components"];
/***/ }),
/***/ "@wordpress/element":
/*!*********************************!*\
!*** external ["wp","element"] ***!
\*********************************/
/***/ ((module) => {
module.exports = window["wp"]["element"];
/***/ }),
/***/ "@wordpress/i18n":
/*!******************************!*\
!*** external ["wp","i18n"] ***!
\******************************/
/***/ ((module) => {
module.exports = window["wp"]["i18n"];
/***/ }),
/***/ "@wordpress/primitives":
/*!************************************!*\
!*** external ["wp","primitives"] ***!
\************************************/
/***/ ((module) => {
module.exports = window["wp"]["primitives"];
/***/ }),
/***/ "./src/timeline-step/block.json":
/*!**************************************!*\
!*** ./src/timeline-step/block.json ***!
\**************************************/
/***/ ((module) => {
module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":2,"name":"homegrade-content-blocks/timeline-step","version":"0.1.0","title":"Étape de timeline","category":"homegrade-blocks","description":"Bloc d\'étape de timeline","supports":{"html":false},"editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","attributes":{"timelineStepTitle":{"type":"string","default":""},"timelineStepSubtitle":{"type":"string","default":""},"timelineStepImageUrl":{"type":"string"},"timelineStepImageId":{"type":"number"},"timelineStepImageAlt":{"type":"string","source":"attribute","selector":"img","attribute":"alt","default":""},"timelineStepIconUrl":{"type":"string"},"timelineStepIconId":{"type":"number"},"timelineStepIconAlt":{"type":"string","source":"attribute","selector":"img","attribute":"alt","default":""},"hasStepIcon":{"type":"boolean","default":true},"hasStepPicture":{"type":"boolean","default":true}}}');
/***/ })
/******/ });
/************************************************************************/
/******/ // The module cache
/******/ var __webpack_module_cache__ = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ var cachedModule = __webpack_module_cache__[moduleId];
/******/ if (cachedModule !== undefined) {
/******/ return cachedModule.exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = __webpack_module_cache__[moduleId] = {
/******/ // no module.id needed
/******/ // no module.loaded needed
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = __webpack_modules__;
/******/
/************************************************************************/
/******/ /* webpack/runtime/chunk loaded */
/******/ (() => {
/******/ var deferred = [];
/******/ __webpack_require__.O = (result, chunkIds, fn, priority) => {
/******/ if(chunkIds) {
/******/ priority = priority || 0;
/******/ for(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1];
/******/ deferred[i] = [chunkIds, fn, priority];
/******/ return;
/******/ }
/******/ var notFulfilled = Infinity;
/******/ for (var i = 0; i < deferred.length; i++) {
/******/ var chunkIds = deferred[i][0];
/******/ var fn = deferred[i][1];
/******/ var priority = deferred[i][2];
/******/ var fulfilled = true;
/******/ for (var j = 0; j < chunkIds.length; j++) {
/******/ if ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every((key) => (__webpack_require__.O[key](chunkIds[j])))) {
/******/ chunkIds.splice(j--, 1);
/******/ } else {
/******/ fulfilled = false;
/******/ if(priority < notFulfilled) notFulfilled = priority;
/******/ }
/******/ }
/******/ if(fulfilled) {
/******/ deferred.splice(i--, 1)
/******/ var r = fn();
/******/ if (r !== undefined) result = r;
/******/ }
/******/ }
/******/ return result;
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/compat get default export */
/******/ (() => {
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = (module) => {
/******/ var getter = module && module.__esModule ?
/******/ () => (module['default']) :
/******/ () => (module);
/******/ __webpack_require__.d(getter, { a: getter });
/******/ return getter;
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/define property getters */
/******/ (() => {
/******/ // define getter functions for harmony exports
/******/ __webpack_require__.d = (exports, definition) => {
/******/ for(var key in definition) {
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
/******/ }
/******/ }
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ (() => {
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
/******/ })();
/******/
/******/ /* webpack/runtime/make namespace object */
/******/ (() => {
/******/ // define __esModule on exports
/******/ __webpack_require__.r = (exports) => {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/jsonp chunk loading */
/******/ (() => {
/******/ // no baseURI
/******/
/******/ // object to store loaded and loading chunks
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // [resolve, reject, Promise] = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ "timeline-step/index": 0,
/******/ "./style-index": 0
/******/ };
/******/
/******/ // no chunk on demand loading
/******/
/******/ // no prefetching
/******/
/******/ // no preloaded
/******/
/******/ // no HMR
/******/
/******/ // no HMR manifest
/******/
/******/ __webpack_require__.O.j = (chunkId) => (installedChunks[chunkId] === 0);
/******/
/******/ // install a JSONP callback for chunk loading
/******/ var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
/******/ var chunkIds = data[0];
/******/ var moreModules = data[1];
/******/ var runtime = data[2];
/******/ // add "moreModules" to the modules object,
/******/ // then flag all "chunkIds" as loaded and fire callback
/******/ var moduleId, chunkId, i = 0;
/******/ if(chunkIds.some((id) => (installedChunks[id] !== 0))) {
/******/ for(moduleId in moreModules) {
/******/ if(__webpack_require__.o(moreModules, moduleId)) {
/******/ __webpack_require__.m[moduleId] = moreModules[moduleId];
/******/ }
/******/ }
/******/ if(runtime) var result = runtime(__webpack_require__);
/******/ }
/******/ if(parentChunkLoadingFunction) parentChunkLoadingFunction(data);
/******/ for(;i < chunkIds.length; i++) {
/******/ chunkId = chunkIds[i];
/******/ if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
/******/ installedChunks[chunkId][0]();
/******/ }
/******/ installedChunks[chunkId] = 0;
/******/ }
/******/ return __webpack_require__.O(result);
/******/ }
/******/
/******/ var chunkLoadingGlobal = self["webpackChunkmultiblocks"] = self["webpackChunkmultiblocks"] || [];
/******/ chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
/******/ chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
/******/ })();
/******/
/************************************************************************/
/******/
/******/ // startup
/******/ // Load entry module and return exports
/******/ // This entry module depends on other loaded chunks and execution need to be delayed
/******/ var __webpack_exports__ = __webpack_require__.O(undefined, ["./style-index"], () => (__webpack_require__("./src/timeline-step/index.js")))
/******/ __webpack_exports__ = __webpack_require__.O(__webpack_exports__);
/******/
/******/ })()
;
//# sourceMappingURL=index.js.map

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,4 @@
/*!*****************************************************************************************************************************************************************************************************************************************************!*\
!*** 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/timeline-step/style.scss ***!
\*****************************************************************************************************************************************************************************************************************************************************/

28142
blocks/timeline/package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,20 @@
{
"name": "multiblocks",
"version": "0.1.0",
"description": "Example block scaffolded with Create Block tool.",
"author": "The WordPress Contributors",
"license": "GPL-2.0-or-later",
"main": "build/index.js",
"scripts": {
"build": "wp-scripts build",
"format": "wp-scripts format",
"lint:css": "wp-scripts lint-style",
"lint:js": "wp-scripts lint-js",
"packages-update": "wp-scripts packages-update",
"plugin-zip": "wp-scripts plugin-zip",
"start": "wp-scripts start"
},
"devDependencies": {
"@wordpress/scripts": "^26.9.0"
}
}

View File

@ -0,0 +1,30 @@
{
"$schema": "https://schemas.wp.org/trunk/block.json",
"apiVersion": 2,
"name": "homegrade-content-blocks/timeline",
"version": "0.1.0",
"title": "Timeline",
"category": "homegrade-blocks",
"description": "Pour la création de timeline",
"supports": {
"html": false
},
"textdomain": "homegrade-blocks",
"editorScript": "file:./index.js",
"editorStyle": "file:./index.css",
"style": "file:./style-index.css",
"attributes": {
"hasStepPictures": {
"type": "boolean",
"default": true
},
"hasStepIcons": {
"type": "boolean",
"default": true
},
"stepPictureFormat": {
"type": "string",
"default": "md"
}
}
}

116
blocks/timeline/src/edit.js Normal file
View File

@ -0,0 +1,116 @@
import { __ } from "@wordpress/i18n";
import "./editor.scss";
import "./timeline-step";
import { useBlockProps, RichText, InnerBlocks } from "@wordpress/block-editor";
import {
InspectorControls,
MediaReplaceFlow,
MediaPlaceholder,
} from "@wordpress/block-editor";
import { useEffect } from "@wordpress/element";
import { useSelect, dispatch } from "@wordpress/data";
import {
PanelBody,
PanelRow,
ToolbarGroup,
ToolbarButton,
RadioControl,
FormToggle,
} from "@wordpress/components";
import { trash } from "@wordpress/icons";
export default function Edit({
attributes,
setAttributes,
clientId,
...props
}) {
let { hasStepPictures, stepPictureFormat, hasStepIcons } = attributes;
let children = useSelect(
(select) =>
select("core/block-editor").getBlocksByClientId(clientId)[0].innerBlocks
);
function handleStepPictureFormatChange(stepPictureFormat) {
setAttributes({ stepPictureFormat });
}
function onChangehasStepPictures() {
setAttributes({ hasStepPictures: !hasStepPictures });
}
function onChangehasStepIcons() {
setAttributes({ hasStepIcons: !hasStepIcons });
}
function updateChildrensProps(children) {
children.forEach((child) => {
dispatch("core/block-editor").updateBlockAttributes(child.clientId, {
hasStepIcon: hasStepIcons,
hasStepPicture: hasStepPictures,
});
});
}
useEffect(() => {
if (children && children.length > 0) {
updateChildrensProps(children);
}
}, [children, hasStepPictures, hasStepIcons]);
return (
<>
<InspectorControls>
<PanelBody
title={__(
"Variantes de Timeline",
"homegrade-blocks__texte-backoffice"
)}
className={"homegrade-blocks-timeline__panel-body"}
>
<PanelRow>
<label htmlFor="">Icones</label>
<FormToggle
label={__("Icones", "homegrade-blocks__texte-backoffice")}
checked={hasStepIcons}
onChange={onChangehasStepIcons}
/>
</PanelRow>
<PanelRow>
<label htmlFor="">Images</label>
<FormToggle
label={__("Icones", "homegrade-blocks__texte-backoffice")}
checked={hasStepPictures}
onChange={onChangehasStepPictures}
/>
</PanelRow>
{hasStepPictures && (
<PanelRow>
<RadioControl
// label={__("Tailles des images", "textdomain")}
help="Taille des images"
selected={stepPictureFormat}
options={[
{ label: "Carré", value: "squared" },
{ label: "Moyenne", value: "md" },
{ label: "Hautes", value: "xl" },
]}
onChange={handleStepPictureFormatChange}
/>
</PanelRow>
)}
</PanelBody>
</InspectorControls>
<section
{...useBlockProps({
className: `homegrade-blocks-timeline`,
})}
>
<InnerBlocks
allowedBlocks={["homegrade-content-blocks/timeline-step"]}
/>
</section>
</>
);
}

View File

@ -0,0 +1,33 @@
.homegrade-blocks-timeline {
.homegrade-blocks-timeline-step {
.block-editor-media-placeholder {
margin-bottom: 30px;
}
}
}
.homegrade-blocks-timeline__panel-body {
// label {
// text-transform: uppercase;
// }
}
.homegrade-blocks-timeline-step__panel-body {
.components-dropdown .components-toolbar__control {
background-color: #e04d42;
color: white;
}
img {
display: block;
}
.components-dropdown {
display: block;
width: fit-content;
}
.media-replace-container {
padding: 10px 0;
display: flex;
gap: 10px;
align-items: center;
// margin-top: 10px;
}
}

View File

@ -0,0 +1,12 @@
<svg xmlns="http://www.w3.org/2000/svg" width="47" height="47" viewBox="0 0 47 47">
<g id="Groupe_3134" data-name="Groupe 3134" transform="translate(-260.842 -459)">
<g id="Groupe_1270" data-name="Groupe 1270" transform="translate(274.771 475.82)">
<line id="Ligne_6" data-name="Ligne 6" x2="19.821" transform="translate(0 6.33)" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Tracé_162" data-name="Tracé 162" d="M104.818,82.8l6.33-6.33-6.33-6.33" transform="translate(-91.328 -70.142)" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
</g>
<g id="Ellipse_202" data-name="Ellipse 202" transform="translate(260.842 459)" fill="none" stroke="#000" stroke-width="2">
<circle cx="23.5" cy="23.5" r="23.5" stroke="none"/>
<circle cx="23.5" cy="23.5" r="22.5" fill="none"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 929 B

View File

@ -0,0 +1,29 @@
import { registerBlockType } from "@wordpress/blocks";
import "./style.scss";
import Edit from "./edit";
import save from "./save";
import metadata from "./block.json";
registerBlockType(metadata.name, {
icon: {
src: (
<svg
xmlns="http://www.w3.org/2000/svg"
data-name="Layer 1"
viewBox="0 0 100 125"
x="0px"
y="0px"
>
<title>130all</title>
<path d="M31.34,16.75a9.19,9.19,0,1,0-11.69,8.83V41.13a9.18,9.18,0,0,0,0,17.67V74.34a9.19,9.19,0,1,0,5,0V58.79a9.18,9.18,0,0,0,0-17.67V25.59A9.2,9.2,0,0,0,31.34,16.75Z" />
<rect x="38.45" y="3.26" width="38.58" height="27.14" />
<rect x="38.45" y="36.39" width="48.58" height="27.14" />
<rect x="38.45" y="69.6" width="38.58" height="27.14" />
</svg>
),
foreground: "#DF1E1E",
},
edit: Edit,
save,
});

View File

@ -0,0 +1,13 @@
import { useBlockProps, RichText, InnerBlocks } from "@wordpress/block-editor";
export default function save({ attributes }) {
return (
<section
{...useBlockProps.save({
className: `homegrade-blocks-timeline`,
})}
>
<InnerBlocks.Content />
</section>
);
}

View File

View File

@ -0,0 +1,59 @@
{
"$schema": "https://schemas.wp.org/trunk/block.json",
"apiVersion": 2,
"name": "homegrade-content-blocks/timeline-step",
"version": "0.1.0",
"title": "Étape de timeline",
"category": "homegrade-blocks",
"description": "Bloc d'étape de timeline",
"supports": {
"html": false
},
"editorScript": "file:./index.js",
"editorStyle": "file:./index.css",
"style": "file:./style-index.css",
"attributes": {
"timelineStepTitle": {
"type": "string",
"default": ""
},
"timelineStepSubtitle": {
"type": "string",
"default": ""
},
"timelineStepImageUrl": {
"type": "string"
},
"timelineStepImageId": {
"type": "number"
},
"timelineStepImageAlt": {
"type": "string",
"source": "attribute",
"selector": "img",
"attribute": "alt",
"default": ""
},
"timelineStepIconUrl": {
"type": "string"
},
"timelineStepIconId": {
"type": "number"
},
"timelineStepIconAlt": {
"type": "string",
"source": "attribute",
"selector": "img",
"attribute": "alt",
"default": ""
},
"hasStepIcon": {
"type": "boolean",
"default": true
},
"hasStepPicture": {
"type": "boolean",
"default": true
}
}
}

View File

@ -0,0 +1,224 @@
import { __ } from "@wordpress/i18n";
import "./editor.scss";
import {
useBlockProps,
RichText,
InnerBlocks,
BlockControls,
InspectorControls,
} from "@wordpress/block-editor";
import {
PanelBody,
ToolbarGroup,
ToolbarButton,
FormToggle,
PanelRow,
Button,
} from "@wordpress/components";
import { useEffect } from "@wordpress/element";
import { MediaReplaceFlow, MediaPlaceholder } from "@wordpress/block-editor";
import { trash } from "@wordpress/icons";
export default function Edit({ attributes, setAttributes, ...props }) {
let {
timelineStepTitle,
timelineStepSubtitle,
timelineStepImageUrl,
timelineStepImageId,
timelineStepImageAlt,
timelineStepIconUrl,
timelineStepIconId,
timelineStepIconAlt,
hasStepPicture,
hasStepIcon,
} = attributes;
function onChangeTimelineStepTitle(timelineStepTitle) {
setAttributes({ timelineStepTitle });
}
function onChangeTimelineDescription(timelineStepSubtitle) {
setAttributes({ timelineStepSubtitle });
}
function setImageAttributes(media) {
if (!media || !media.url) {
setAttributes({
timelineStepImageUrl: null,
timelineStepImageId: null,
timelineStepImageAlt: null,
});
return;
}
setAttributes({
timelineStepImageUrl: media.url,
timelineStepImageId: media.id,
timelineStepImageAlt: media?.alt,
});
}
function removeImageAttributes() {
setAttributes({
timelineStepImageUrl: null,
timelineStepImageId: null,
timelineStepImageAlt: null,
});
}
function setIconAttributes(media) {
console.log(media);
if (!media || !media.url) {
setAttributes({
timelineStepIconUrl: null,
timelineStepIconId: null,
timelineStepIconAlt: null,
});
return;
}
setAttributes({
timelineStepIconUrl: media.url,
timelineStepIconId: media.id,
timelineStepIconAlt: media?.alt,
});
}
useEffect(() => {
if (hasStepPicture === false) {
setImageAttributes(null);
}
}, [hasStepPicture]);
useEffect(() => {
if (hasStepIcon === false) {
setIconAttributes(null);
}
}, [hasStepIcon]);
console.log(trash);
return (
<>
<InspectorControls>
{hasStepPicture && (
<PanelBody
className="homegrade-blocks-timeline-step__panel-body"
title={__("Image", "homegrade-blocks__texte-backoffice")}
>
{timelineStepImageUrl && (
<img src={timelineStepImageUrl} alt={timelineStepImageAlt} />
)}
<div className="media-replace-container">
<MediaReplaceFlow
mediaId={timelineStepImageId}
mediaUrl={timelineStepImageUrl}
allowedTypes={["image"]}
accept="image/*"
onSelect={setImageAttributes}
name={
!timelineStepImageUrl
? __("Ajouter", "homegrade-blocks__texte-backoffice")
: __("Remplacer", "homegrade-blocks__texte-backoffice")
}
/>
<Button
className="custom-flow-button"
variant="primary"
icon={trash}
label="Supprimer"
/>
</div>
</PanelBody>
)}
{hasStepIcon && (
<PanelBody title={__("Icone", "homegrade-blocks__texte-backoffice")}>
{timelineStepIconUrl && (
<img src={timelineStepIconUrl} alt={timelineStepIconAlt} />
)}
<MediaReplaceFlow
mediaId={timelineStepIconId}
mediaUrl={timelineStepIconUrl}
allowedTypes={["image"]}
accept="image/*"
onSelect={setIconAttributes}
// name={
// !timelineStepIconUrl
// ? __(
// "Ajouter une Image",
// "homegrade-blocks__texte-backoffice"
// )
// : __("Remplacer Image", "homegrade-blocks__texte-backoffice")
// }
/>
</PanelBody>
)}
</InspectorControls>
<BlockControls>
<ToolbarGroup>
<MediaReplaceFlow
mediaId={timelineStepImageId}
mediaUrl={timelineStepImageUrl}
allowedTypes={["image"]}
accept="image/*"
onSelect={setImageAttributes}
name={
!timelineStepImageUrl
? __("Ajouter une Image", "homegrade-blocks__texte-backoffice")
: __("Remplacer Image", "homegrade-blocks__texte-backoffice")
}
/>
<ToolbarButton
title={"Supprimer Image"}
icon={trash}
isActive={timelineStepImageUrl}
onClick={removeImageAttributes}
/>
</ToolbarGroup>
</BlockControls>
<div
{...useBlockProps({
className: `homegrade-blocks-timeline-step`,
})}
>
{hasStepPicture && (
<div className="homegrade-blocks-timeline-step__cover">
{!timelineStepImageUrl && (
<MediaPlaceholder
accept="image/*"
allowedTypes={["image"]}
onSelect={setImageAttributes}
multiple={false}
handleUpload={true}
/>
)}
{timelineStepImageUrl && (
<img src={timelineStepImageUrl} alt={timelineStepImageAlt} />
)}
</div>
)}
<div className="homegrade-blocks-timeline-step__content">
<RichText
tagName="h3"
className="homegrade-blocks-timeline-step__title"
placeholder={__(
"Date ou Titre de l'étape",
"homegrade-blocks__texte-backoffice"
)}
value={timelineStepTitle}
onChange={onChangeTimelineStepTitle}
/>
<RichText
tagName="h2"
className="homegrade-blocks-timeline-step__subtitle"
placeholder={__(
"Titre / Sous-titre de l'étape",
"homegrade-blocks__texte-backoffice"
)}
value={timelineStepSubtitle}
onChange={onChangeTimelineDescription}
/>
<InnerBlocks allowedBlocks={["core/paragraph"]} />
</div>
</div>
</>
);
}

View File

@ -0,0 +1 @@
// THE STYLE IS HANDLED IN PARENT BLOCK (timeline)

View File

@ -0,0 +1,33 @@
import { registerBlockType } from "@wordpress/blocks";
import "./style.scss";
import metadata from "./block.json";
import Edit from "./edit";
import Save from "./save";
import { navigation } from "@wordpress/icons";
registerBlockType(metadata.name, {
title: metadata.title,
icon: {
foreground: "#DF1E1E",
src: (
<svg
version="1.1"
x="0px"
y="0px"
viewBox="0 0 100 125"
enable-background="new 0 0 100 100"
>
<g>
<path d="M84.6,33.6c-0.8-1.1-2.3-1.5-3.5-0.7c-1.1,0.8-1.5,2.3-0.7,3.5l7.4,11.1H66c-1.2-7.8-7.9-13.8-16-13.8s-14.8,6-16,13.8H7.5 C6.1,47.5,5,48.6,5,50s1.1,2.5,2.5,2.5H34c1.2,7.8,7.9,13.8,16,13.8s14.8-6,16-13.8h21.8l-7.4,11.1c-0.8,1.1-0.5,2.7,0.7,3.5 c0.4,0.3,0.9,0.4,1.4,0.4c0.8,0,1.6-0.4,2.1-1.1l10-15c0.6-0.8,0.6-1.9,0-2.8L84.6,33.6z M50,63.8c-7.6,0-13.8-6.2-13.8-13.8 S42.4,36.3,50,36.3S63.8,42.4,63.8,50S57.6,63.8,50,63.8z" />
</g>
</svg>
),
},
supports: metadata.supports,
attributes: metadata.attributes,
edit: Edit,
save: Save,
});

View File

@ -0,0 +1,41 @@
import { useBlockProps, RichText, InnerBlocks } from "@wordpress/block-editor";
export default function save({ attributes }) {
const {
timelineStepTitle,
timelineStepSubtitle,
timelineStepImageId,
timelineStepImageUrl,
timelineStepImageAlt,
hasStepPicture,
hasStepIcon,
} = attributes;
return (
<div
{...useBlockProps.save({
className: `homegrade-blocks-timeline-step`,
})}
>
{hasStepPicture && (
<div className="homegrade-blocks-timeline-step__cover">
{timelineStepImageUrl && (
<img src={timelineStepImageUrl} alt={timelineStepImageAlt} />
)}
</div>
)}
<div className="homegrade-blocks-timeline-step__content">
<RichText.Content
tagName="h3"
className="homegrade-blocks-timeline-step__title"
value={timelineStepTitle}
/>
<RichText.Content
tagName="p"
className="homegrade-blocks-timeline-step__subtitle"
value={timelineStepSubtitle}
/>
<InnerBlocks.Content />
</div>
</div>
);
}

View File

@ -0,0 +1 @@
// THE STYLE IS HANDLED IN PARENT BLOCK (timeline)