.prettierrc

@@ -1,6 +0,0 @@
-{
-	"tabWidth": 2,
-	"semi": true,
-	"singleQuote": true,
-	"printWidth": 100
-}

blocks/highlight/build/block.json

@@ -20,7 +20,7 @@
       "source": "html",
       "selector": "h3"
     },
-    "iconUrl": {
+    "iconName": {
       "type": "string",
       "default": "key"
     },

blocks/highlight/build/index.asset.php

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

blocks/highlight/build/index.css

@@ -1,6 +1,6 @@
-/*!****************************************************************************************************************************************************************************************************************************************************!*\
+/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
-  !*** css ../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!../../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/editor.scss ***!
+  !*** css ./node_modules/.pnpm/css-loader@6.11.0_webpack@5.99.9/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/.pnpm/postcss-loader@6.2.1_postcss@8.5.3_webpack@5.99.9/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/.pnpm/sass-loader@12.6.0_sass@1.89.0_webpack@5.99.9/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/editor.scss ***!
-  \****************************************************************************************************************************************************************************************************************************************************/
+  \**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
 /**
  * The following styles get applied inside the editor only.
  *

blocks/highlight/build/style-index.css

@@ -1,6 +1,6 @@
-/*!***************************************************************************************************************************************************************************************************************************************************!*\
+/*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
-  !*** css ../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!../../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/style.scss ***!
+  !*** css ./node_modules/.pnpm/css-loader@6.11.0_webpack@5.99.9/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/.pnpm/postcss-loader@6.2.1_postcss@8.5.3_webpack@5.99.9/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/.pnpm/sass-loader@12.6.0_sass@1.89.0_webpack@5.99.9/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/style.scss ***!
-  \***************************************************************************************************************************************************************************************************************************************************/
+  \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
 /**
  * The following styles get applied both on the front of your site
  * and in the editor.

blocks/highlight/highlight.php

@@ -1,9 +0,0 @@
-<?php
-
-add_action('enqueue_block_editor_assets', function () {
-	wp_localize_script(
-		'homegrade-content-blocks-highlight-editor-script',
-		'HOMEGRADE_HIGHLIGHT',
-		['iconsBaseUrl' => plugin_dir_url(__FILE__) . 'src/img/']
-	);
-});

blocks/highlight/src/block.json

@@ -20,7 +20,7 @@
 			"source": "html",
 			"selector": "h3"
 		},
-		"iconUrl": {
+		"iconName": {
 			"type": "string",
 			"default": "key"
 		},

blocks/highlight/src/deprecated.js

@@ -1,288 +1,111 @@
-import { createBlock } from '@wordpress/blocks';
+import { createBlock } from "@wordpress/blocks";
-import { useBlockProps, RichText, InnerBlocks } from '@wordpress/block-editor';
+import { useBlockProps, RichText, InnerBlocks } from "@wordpress/block-editor";
-import { useSelect } from '@wordpress/data';
+import { useSelect } from "@wordpress/data";
 
-import keyIcon from './img/icon_key.svg';
+import keyIcon from "./img/icon_key.svg";
-import chainIcon from './img/icon_chain.svg';
+import chainIcon from "./img/icon_chain.svg";
-import houseIcon from './img/icon_house.svg';
+import houseIcon from "./img/icon_house.svg";
-import bulbIcon from './img/icon_bulb.svg';
+import bulbIcon from "./img/icon_bulb.svg";
-import warningIcon from './img/icon_warning.svg';
+import warningIcon from "./img/icon_warning.svg";
-import acousticIcon from './img/icon_acoustic.svg';
+import acousticIcon from "./img/icon_acoustic.svg";
-import documentationIcon from './img/icon_documentation.svg';
+import documentationIcon from "./img/icon_documentation.svg";
-import notificationIcon from './img/icon_notification.svg';
+import notificationIcon from "./img/icon_notification.svg";
-import searchIcon from './img/icon_search.svg';
+import searchIcon from "./img/icon_search.svg";
-import infoIcon from './img/icon_info.svg';
+import infoIcon from "./img/icon_info.svg";
-import tipIcon from './img/icon_tip.svg';
+import tipIcon from "./img/icon_tip.svg";
-import euroIcon from './img/icon_euro.svg';
+import euroIcon from "./img/icon_euro.svg";
 
-// v2 — prior version (icons imported in JS, no persistent iconUrl attribute)
+const v1 = {
-const v2 = {
 	attributes: {
 		title: {
-			type: 'string',
+			type: "string",
-			source: 'html',
+			source: "html",
-			selector: 'h3',
+			selector: "h3",
 		},
 		iconName: {
-			type: 'string',
+			type: "string",
-			default: 'key',
+			default: "key",
 		},
 		hasTitle: {
-			type: 'boolean',
+			type: "boolean",
 			default: true,
 		},
-		hasIcon: {
+		hasTitleIcon: {
-			type: 'boolean',
+			type: "boolean",
 			default: true,
 		},
 		hasLogo: {
-			type: 'boolean',
+			type: "boolean",
 			default: false,
 		},
 		logoId: {
-			type: 'number',
+			type: "number",
 		},
 		logoAlt: {
-			type: 'string',
+			type: "string",
 		},
 		logoUrl: {
-			type: 'string',
+			type: "string",
 		},
 		variant: {
-			type: 'string',
+			type: "string",
-			default: 'classic',
+			default: "classic",
-		},
-		iconPosition: {
-			type: 'string',
-			default: 'top',
-		},
-		// Read historical <img src> to ensure the deprecated save matches exactly
-		iconUrl: {
-			type: 'string',
-			source: 'attribute',
-			selector: '.icon .icon__image',
-			attribute: 'src',
 		},
 	},
+
 	save({ attributes }) {
 		const {
 			title,
 			iconName,
 			hasTitle,
-			hasIcon,
+			hasTitleIcon,
 			hasLogo,
+			logoId,
 			logoAlt,
 			logoUrl,
 			variant,
-			iconPosition,
-			iconUrl,
 		} = attributes;
 
 		function getIconPicture() {
 			switch (iconName) {
-				case 'key':
+				case "key":
-					return keyIcon;
-				case 'chain':
-					return chainIcon;
-				case 'house':
-					return houseIcon;
-				case 'bulb':
-					return bulbIcon;
-				case 'warning':
-					return warningIcon;
-				case 'acoustic':
-					return acousticIcon;
-				case 'documentation':
-					return documentationIcon;
-				case 'notification':
-					return notificationIcon;
-				case 'search':
-					return searchIcon;
-				case 'info':
-					return infoIcon;
-				case 'tip':
-					return tipIcon;
-				case 'euro':
-					return euroIcon;
-				default:
-					return '';
-			}
-		}
-		// Use exact stored src when present for perfect match
-		const iconPicture = iconUrl || getIconPicture();
-
-		return (
-			<section
-				{...useBlockProps.save({
-					className: `homegrade-blocks-highlight ${
-						variant ? `homegrade-blocks-highlight--${variant}` : ''
-					}`,
-				})}
-			>
-				{hasTitle && (
-					<div
-						className={`homegrade-blocks-highlight__titling ${
-							!hasIcon ? 'homegrade-blocks-highlight__titling--has-no-icon' : ''
-						}`}
-					>
-						{hasIcon && iconPosition === 'top' && (
-							<div className="icon">
-								<img className="icon__image" src={iconPicture} alt="" />
-							</div>
-						)}
-
-						<RichText.Content
-							tagName="h3"
-							value={title}
-							className="homegrade-blocks-highlight__block-title"
-						/>
-					</div>
-				)}
-				<div className="homegrade-blocks-highlight__content">
-					{hasIcon && iconPosition === 'side' && !hasTitle && (
-						<div className="icon">
-							<img src={iconPicture} alt="" />
-						</div>
-					)}
-
-					<div className="homegrade-blocks-highlight__content__innerblocks">
-						<InnerBlocks.Content />
-					</div>
-					{hasLogo && logoUrl && (
-						<div className="homegrade-blocks-highlight__logo">
-							<img src={logoUrl} alt={logoAlt} />
-						</div>
-					)}
-				</div>
-			</section>
-		);
-	},
-	migrate(attributes) {
-		// Compute iconUrl from iconName for the new version (stored attribute),
-		// using file URL mapping so next save writes http(s) src instead of data URI.
-		const ICON_FILES = {
-			key: 'icon_key.svg',
-			chain: 'icon_chain.svg',
-			house: 'icon_house.svg',
-			bulb: 'icon_bulb.svg',
-			warning: 'icon_warning.svg',
-			acoustic: 'icon_acoustic.svg',
-			documentation: 'icon_documentation.svg',
-			notification: 'icon_notification.svg',
-			search: 'icon_search.svg',
-			info: 'icon_info.svg',
-			tip: 'icon_tip.svg',
-			euro: 'icon_euro.svg',
-		};
-		let iconUrl = '';
-		const filename = ICON_FILES[attributes.iconName];
-		if (filename) {
-			// Prefer PHP-exposed public base URL when available (robust in all environments)
-			const baseUrl =
-				typeof HOMEGRADE_HIGHLIGHT !== 'undefined' && HOMEGRADE_HIGHLIGHT?.iconsBaseUrl
-					? HOMEGRADE_HIGHLIGHT.iconsBaseUrl
-					: '';
-			if (baseUrl) {
-				iconUrl = baseUrl + filename;
-			} else {
-				// Fallback: rely on bundler URL resolution
-				try {
-					iconUrl = new URL(`./img/${filename}`, import.meta.url).toString();
-				} catch (e) {
-					iconUrl = '';
-				}
-			}
-		}
-
-		return {
-			...attributes,
-			iconUrl,
-		};
-	},
-};
-
-const v1 = {
-	attributes: {
-		title: {
-			type: 'string',
-			source: 'html',
-			selector: 'h3',
-		},
-		iconName: {
-			type: 'string',
-			default: 'key',
-		},
-		hasTitle: {
-			type: 'boolean',
-			default: true,
-		},
-		hasTitleIcon: {
-			type: 'boolean',
-			default: true,
-		},
-		hasLogo: {
-			type: 'boolean',
-			default: false,
-		},
-		logoId: {
-			type: 'number',
-		},
-		logoAlt: {
-			type: 'string',
-		},
-		logoUrl: {
-			type: 'string',
-		},
-		variant: {
-			type: 'string',
-			default: 'classic',
-		},
-	},
-
-	save({ attributes }) {
-		const { title, iconName, hasTitle, hasTitleIcon, hasLogo, logoId, logoAlt, logoUrl, variant } =
-			attributes;
-
-		function getIconPicture() {
-			switch (iconName) {
-				case 'key':
 					return keyIcon;
 
-				case 'chain':
+				case "chain":
 					return chainIcon;
 
-				case 'house':
+				case "house":
 					return houseIcon;
 
-				case 'bulb':
+				case "bulb":
 					return bulbIcon;
 
-				case 'warning':
+				case "warning":
 					return warningIcon;
 
-				case 'acoustic':
+				case "acoustic":
 					return acousticIcon;
 
-				case 'documentation':
+				case "documentation":
 					return documentationIcon;
 
-				case 'notification':
+				case "notification":
 					return notificationIcon;
 
-				case 'search':
+				case "search":
 					return searchIcon;
 
-				case 'info':
+				case "info":
 					return infoIcon;
 
-				case 'tip':
+				case "tip":
 					return tipIcon;
 
-				case 'euro':
+				case "euro":
 					return euroIcon;
 
 				default:
-					return '';
+					return "";
 			}
 		}
 		const iconPicture = getIconPicture();
@@ -291,14 +114,16 @@ const v1 = {
 			<section
 				{...useBlockProps.save({
 					className: `homegrade-blocks-highlight ${
-						variant ? `homegrade-blocks-highlight--${variant}` : ''
+						variant ? `homegrade-blocks-highlight--${variant}` : ""
 					}`,
 				})}
 			>
 				{hasTitle && (
 					<div
 						className={`homegrade-blocks-highlight__titling ${
-							!hasTitleIcon ? 'homegrade-blocks-highlight__titling--has-no-icon' : ''
+							!hasTitleIcon
+								? "homegrade-blocks-highlight__titling--has-no-icon"
+								: ""
 						}`}
 					>
 						{hasTitleIcon && (
@@ -334,4 +159,4 @@ const v1 = {
 	},
 };
 
-export default [v2KSES, v2, v1];
+export default [v1];

blocks/highlight/src/edit.js

@@ -1,5 +1,17 @@
-import { __ } from '@wordpress/i18n';
+import { __ } from "@wordpress/i18n";
-import './editor.scss';
+import "./editor.scss";
+import keyIcon from "./img/icon_key.svg";
+import chainIcon from "./img/icon_chain.svg";
+import houseIcon from "./img/icon_house.svg";
+import bulbIcon from "./img/icon_bulb.svg";
+import warningIcon from "./img/icon_warning.svg";
+import acousticIcon from "./img/icon_acoustic.svg";
+import documentationIcon from "./img/icon_documentation.svg";
+import notificationIcon from "./img/icon_notification.svg";
+import searchIcon from "./img/icon_search.svg";
+import infoIcon from "./img/icon_info.svg";
+import tipIcon from "./img/icon_tip.svg";
+import euroIcon from "./img/icon_euro.svg";
 
 import {
 	RichText,
@@ -8,9 +20,9 @@ import {
 	InnerBlocks,
 	InspectorControls,
 	MediaReplaceFlow,
-} from '@wordpress/block-editor';
+} from "@wordpress/block-editor";
 
-import { trash } from '@wordpress/icons';
+import { trash } from "@wordpress/icons";
 import {
 	Button,
 	ToolbarButton,
@@ -19,13 +31,12 @@ import {
 	__experimentalToggleGroupControl as ToggleGroupControl,
 	__experimentalToggleGroupControlOption as ToggleGroupControlOption,
 	RadioControl,
-} from '@wordpress/components';
+} from "@wordpress/components";
 
 export default function Edit({ attributes, setAttributes }) {
 	const {
 		title,
 		iconName,
-		iconUrl,
 		hasTitle,
 		hasIcon,
 		hasLogo,
@@ -36,28 +47,51 @@ export default function Edit({ attributes, setAttributes }) {
 		iconPosition,
 	} = attributes;
 
-	const ICON_FILES = {
+	function getIconPicture() {
-		key: 'icon_key.svg',
+		switch (iconName) {
-		chain: 'icon_chain.svg',
+			case "key":
-		house: 'icon_house.svg',
+				return keyIcon;
-		bulb: 'icon_bulb.svg',
+
-		warning: 'icon_warning.svg',
+			case "chain":
-		acoustic: 'icon_acoustic.svg',
+				return chainIcon;
-		documentation: 'icon_documentation.svg',
+
-		notification: 'icon_notification.svg',
+			case "house":
-		search: 'icon_search.svg',
+				return houseIcon;
-		info: 'icon_info.svg',
+
-		tip: 'icon_tip.svg',
+			case "bulb":
-		euro: 'icon_euro.svg',
+				return bulbIcon;
-	};
+
-	const getIconUrl = (iconName) => {
+			case "warning":
-		if (!iconName) return '';
+				return warningIcon;
-		return HOMEGRADE_HIGHLIGHT.iconsBaseUrl + ICON_FILES[iconName];
+
-	};
+			case "acoustic":
+				return acousticIcon;
+
+			case "documentation":
+				return documentationIcon;
+
+			case "notification":
+				return notificationIcon;
+
+			case "search":
+				return searchIcon;
+
+			case "info":
+				return infoIcon;
+
+			case "tip":
+				return tipIcon;
+
+			case "euro":
+				return euroIcon;
+
+			default:
+				return "";
+		}
+	}
 
 	function onIconChange(newIconName) {
-		const newIconUrl = getIconUrl(newIconName);
+		setAttributes({ iconName: newIconName });
-		setAttributes({ iconName: newIconName, iconUrl: newIconUrl });
 	}
 	function onTitleChange(title) {
 		setAttributes({ title });
@@ -99,6 +133,8 @@ export default function Edit({ attributes, setAttributes }) {
 		});
 	}
 
+	let iconPicture = getIconPicture();
+
 	function handleIconPositionChange(newPosition) {
 		setAttributes({ iconPosition: newPosition });
 	}
@@ -107,7 +143,7 @@ export default function Edit({ attributes, setAttributes }) {
 		<>
 			<InspectorControls>
 				<PanelBody
-					title={__('Variantes', 'homegrade-blocks__texte-fonctionnel')}
+					title={__("Variantes", "homegrade-blocks__texte-fonctionnel")}
 					initialOpen={true}
 				>
 					<ToggleGroupControl
@@ -120,8 +156,16 @@ export default function Edit({ attributes, setAttributes }) {
 						<ToggleGroupControlOption label="Warning" value="warning" />
 						<ToggleGroupControlOption label="Gris" value="gray" />
 					</ToggleGroupControl>
-					<ToggleControl label="Afficher le titre" checked={hasTitle} onChange={onHasTitleChange} />
+					<ToggleControl
-					<ToggleControl label="Afficher une Icone" checked={hasIcon} onChange={onhasIconChange} />
+						label="Afficher le titre"
+						checked={hasTitle}
+						onChange={onHasTitleChange}
+					/>
+					<ToggleControl
+						label="Afficher une Icone"
+						checked={hasIcon}
+						onChange={onhasIconChange}
+					/>
 
 					{hasIcon && (
 						<RadioControl
@@ -130,26 +174,30 @@ export default function Edit({ attributes, setAttributes }) {
 							onChange={handleIconPositionChange}
 							options={[
 								{
-									label: 'Avant le titre',
+									label: "Avant le titre",
-									value: 'top',
+									value: "top",
-									description: 'Seulement lorsque le titre est ACTIVÉ',
+									description: "Seulement lorsque le titre est ACTIVÉ",
 								},
 								{
-									label: 'Coté',
+									label: "Coté",
-									value: 'side',
+									value: "side",
 									disabled: hasTitle,
-									description: 'Seulement lorsque le titre est DÉSACTIVÉ',
+									description: "Seulement lorsque le titre est DÉSACTIVÉ",
 								},
 							]}
 							selected={iconPosition}
 						/>
 					)}
-					<ToggleControl label="Attacher un logo" checked={hasLogo} onChange={onHasLogoChange} />
+					<ToggleControl
+						label="Attacher un logo"
+						checked={hasLogo}
+						onChange={onHasLogoChange}
+					/>
 				</PanelBody>
 				{hasLogo && (
 					<PanelBody
 						className="homegrade-blocks-highlight__panel-body"
-						title={__('Logo', 'homegrade-blocks')}
+						title={__("Logo", "homegrade-blocks")}
 					>
 						{logoUrl && <img src={logoUrl} alt={logoAlt} />}
 
@@ -157,13 +205,13 @@ export default function Edit({ attributes, setAttributes }) {
 							<MediaReplaceFlow
 								mediaId={logoId}
 								mediaUrl={logoUrl}
-								allowedTypes={['image']}
+								allowedTypes={["image"]}
 								accept="image/*"
 								onSelect={setLogoAttributes}
 								name={
 									!logoUrl
-										? __('Ajouter un Logo', 'homegrade-blocks')
+										? __("Ajouter un Logo", "homegrade-blocks")
-										: __('Remplacer', 'homegrade-blocks')
+										: __("Remplacer", "homegrade-blocks")
 								}
 							/>
 							{logoUrl && (
@@ -183,127 +231,130 @@ export default function Edit({ attributes, setAttributes }) {
 			</InspectorControls>
 			<BlockControls>
 				<ToolbarButton
-					title={'Clé'}
+					title={"Clé"}
-					icon={'admin-network'}
+					icon={"admin-network"}
-					isActive={iconName === 'key'}
+					isActive={iconName === "key"}
-					onClick={() => onIconChange('key')}
+					onClick={() => onIconChange("key")}
 				/>
 				<ToolbarButton
-					title={'Lien'}
+					title={"Lien"}
-					icon={'admin-links'}
+					icon={"admin-links"}
-					isActive={iconName === 'chain'}
+					isActive={iconName === "chain"}
-					onClick={() => onIconChange('chain')}
+					onClick={() => onIconChange("chain")}
 				/>
 				<ToolbarButton
-					title={'Homegrade'}
+					title={"Homegrade"}
-					icon={'admin-home'}
+					icon={"admin-home"}
-					isActive={iconName === 'house'}
+					isActive={iconName === "house"}
-					onClick={() => onIconChange('house')}
+					onClick={() => onIconChange("house")}
 				/>
 				<ToolbarButton
-					title={'Inspiration'}
+					title={"Inspiration"}
-					icon={'lightbulb'}
+					icon={"lightbulb"}
-					isActive={iconName === 'bulb'}
+					isActive={iconName === "bulb"}
-					onClick={() => onIconChange('bulb')}
+					onClick={() => onIconChange("bulb")}
 				/>
 				<ToolbarButton
-					title={'Attention'}
+					title={"Attention"}
-					icon={'warning'}
+					icon={"warning"}
-					isActive={iconName === 'warning'}
+					isActive={iconName === "warning"}
-					onClick={() => onIconChange('warning')}
+					onClick={() => onIconChange("warning")}
 				/>
 				<ToolbarButton
-					title={'Acoustique'}
+					title={"Acoustique"}
-					icon={'controls-volumeon'}
+					icon={"controls-volumeon"}
-					isActive={iconName === 'acoustic'}
+					isActive={iconName === "acoustic"}
-					onClick={() => onIconChange('acoustic')}
+					onClick={() => onIconChange("acoustic")}
 				/>
 				<ToolbarButton
-					title={'Documentation'}
+					title={"Documentation"}
-					icon={'book-alt'}
+					icon={"book-alt"}
-					isActive={iconName === 'documentation'}
+					isActive={iconName === "documentation"}
-					onClick={() => onIconChange('documentation')}
+					onClick={() => onIconChange("documentation")}
 				/>
 				<ToolbarButton
-					title={'Recherche'}
+					title={"Recherche"}
-					icon={'search'}
+					icon={"search"}
-					isActive={iconName === 'search'}
+					isActive={iconName === "search"}
-					onClick={() => onIconChange('search')}
+					onClick={() => onIconChange("search")}
 				/>
 				<ToolbarButton
-					title={'Notification'}
+					title={"Notification"}
-					icon={'bell'}
+					icon={"bell"}
-					isActive={iconName === 'notification'}
+					isActive={iconName === "notification"}
-					onClick={() => onIconChange('notification')}
+					onClick={() => onIconChange("notification")}
 				/>
 				<ToolbarButton
-					title={'Info'}
+					title={"Info"}
-					icon={'info'}
+					icon={"info"}
-					isActive={iconName === 'info'}
+					isActive={iconName === "info"}
-					onClick={() => onIconChange('info')}
+					onClick={() => onIconChange("info")}
 				/>
 				<ToolbarButton
-					title={'Euro'}
+					title={"Euro"}
-					icon={'money-alt'}
+					icon={"money-alt"}
-					isActive={iconName === 'euro'}
+					isActive={iconName === "euro"}
-					onClick={() => onIconChange('euro')}
+					onClick={() => onIconChange("euro")}
 				/>
 				<ToolbarButton
-					title={'Astuce'}
+					title={"Astuce"}
-					icon={'thumbs-up'}
+					icon={"thumbs-up"}
-					isActive={iconName === 'tip'}
+					isActive={iconName === "tip"}
-					onClick={() => onIconChange('tip')}
+					onClick={() => onIconChange("tip")}
 				/>
 			</BlockControls>
 			<section
 				{...useBlockProps({
 					className: `homegrade-blocks-highlight ${
-						variant ? `homegrade-blocks-highlight--${variant}` : ''
+						variant ? `homegrade-blocks-highlight--${variant}` : ""
 					}`,
 				})}
 			>
 				{hasTitle && (
 					<div
 						className={`homegrade-blocks-highlight__titling ${
-							!hasIcon ? 'homegrade-blocks-highlight__titling--has-no-icon' : ''
+							!hasIcon ? "homegrade-blocks-highlight__titling--has-no-icon" : ""
 						}`}
 					>
-						{hasIcon && iconPosition === 'top' && (
+						{hasIcon && iconPosition === "top" && (
 							<div className="icon">
-								<img className="icon__image" src={iconUrl} alt="" />
+								<img src={iconPicture} alt="" />
 							</div>
 						)}
 						<RichText
 							className="homegrade-blocks-highlight__block-title"
 							onChange={onTitleChange}
 							value={title}
-							placeholder={__('Insérez un titre', 'homegrade-blocks__texte-fonctionnel')}
+							placeholder={__(
+								"Insérez un titre",
+								"homegrade-blocks__texte-fonctionnel"
+							)}
 							tagName="h3"
 							allowedFormats={[]}
 						/>
 					</div>
 				)}
 				<div className="homegrade-blocks-highlight__content">
-					{hasIcon && iconPosition === 'side' && !hasTitle && (
+					{hasIcon && iconPosition === "side" && !hasTitle && (
 						<div className="icon">
-							<img className="icon__image" src={iconUrl} alt="" />
+							<img src={iconPicture} alt="" />
 						</div>
 					)}
 
 					<div className="homegrade-blocks-highlight__content__innerblocks">
 						<InnerBlocks
 							allowedBlocks={[
-								'core/paragraph',
+								"core/paragraph",
-								'core/list',
+								"core/list",
-								'core/buttons',
+								"core/buttons",
-								'core/button',
+								"core/button",
-								'core/colums',
+								"core/colums",
-								'core/colum',
+								"core/colum",
-								'homegrade-content-blocks/text-image',
+								"homegrade-content-blocks/text-image",
-								'homegrade-content-blocks/content-heading',
+								"homegrade-content-blocks/content-heading",
-								'homegrade-content-blocks/staff-member',
+								"homegrade-content-blocks/staff-member",
 							]}
-							template={[['core/paragraph']]}
+							template={[["core/paragraph"]]}
 						/>
 					</div>
 
@@ -313,13 +364,13 @@ export default function Edit({ attributes, setAttributes }) {
 								<MediaReplaceFlow
 									mediaId={logoId}
 									mediaUrl={logoUrl}
-									allowedTypes={['image']}
+									allowedTypes={["image"]}
 									accept="image/*"
 									onSelect={setLogoAttributes}
 									name={
 										!logoUrl
-											? __('Ajouter Logo', 'homegrade-blocks')
+											? __("Ajouter Logo", "homegrade-blocks")
-											: __('Remplacer', 'homegrade-blocks')
+											: __("Remplacer", "homegrade-blocks")
 									}
 								/>
 							)}

blocks/highlight/src/save.js

@@ -1,11 +1,22 @@
-import { useBlockProps, RichText, InnerBlocks } from '@wordpress/block-editor';
+import { useBlockProps, RichText, InnerBlocks } from "@wordpress/block-editor";
-import { __ } from '@wordpress/i18n';
+import { __ } from "@wordpress/i18n";
-import { useSelect, useDispatch } from '@wordpress/data'; // pour les querry
+import { useSelect, useDispatch } from "@wordpress/data"; // pour les querry
+import keyIcon from "./img/icon_key.svg";
+import chainIcon from "./img/icon_chain.svg";
+import houseIcon from "./img/icon_house.svg";
+import bulbIcon from "./img/icon_bulb.svg";
+import warningIcon from "./img/icon_warning.svg";
+import acousticIcon from "./img/icon_acoustic.svg";
+import documentationIcon from "./img/icon_documentation.svg";
+import notificationIcon from "./img/icon_notification.svg";
+import searchIcon from "./img/icon_search.svg";
+import infoIcon from "./img/icon_info.svg";
+import tipIcon from "./img/icon_tip.svg";
+import euroIcon from "./img/icon_euro.svg";
 
 export default function save({ attributes }) {
 	const {
 		title,
-		iconUrl,
 		iconName,
 		hasTitle,
 		hasIcon,
@@ -15,51 +26,67 @@ export default function save({ attributes }) {
 		logoUrl,
 		iconPosition,
 	} = attributes;
+	function getIconPicture() {
+		switch (iconName) {
+			case "key":
+				return keyIcon;
 
-	const ICON_FILES = {
+			case "chain":
-		key: 'icon_key.svg',
+				return chainIcon;
-		chain: 'icon_chain.svg',
+
-		house: 'icon_house.svg',
+			case "house":
-		bulb: 'icon_bulb.svg',
+				return houseIcon;
-		warning: 'icon_warning.svg',
+
-		acoustic: 'icon_acoustic.svg',
+			case "bulb":
-		documentation: 'icon_documentation.svg',
+				return bulbIcon;
-		notification: 'icon_notification.svg',
+
-		search: 'icon_search.svg',
+			case "warning":
-		info: 'icon_info.svg',
+				return warningIcon;
-		tip: 'icon_tip.svg',
+
-		euro: 'icon_euro.svg',
+			case "acoustic":
-	};
+				return acousticIcon;
-	const buildIconUrlFromName = () => {
+
-		const filename = ICON_FILES[iconName];
+			case "documentation":
-		if (!filename) return '';
+				return documentationIcon;
-		try {
+
-			return new URL(`./img/${filename}`, import.meta.url).toString();
+			case "notification":
-		} catch (e) {
+				return notificationIcon;
-			return '';
+
+			case "search":
+				return searchIcon;
+
+			case "info":
+				return infoIcon;
+
+			case "tip":
+				return tipIcon;
+
+			case "euro":
+				return euroIcon;
+
+			default:
+				return "";
 		}
-	};
+	}
-	const isLikelyIconName = (value) =>
+	let iconPicture = getIconPicture();
-		typeof value === 'string' && Object.keys(ICON_FILES).includes(value);
-	const resolvedIconUrl = !iconUrl || isLikelyIconName(iconUrl) ? buildIconUrlFromName() : iconUrl;
 
 	return (
 		<section
 			{...useBlockProps.save({
 				className: `homegrade-blocks-highlight ${
-					variant ? `homegrade-blocks-highlight--${variant}` : ''
+					variant ? `homegrade-blocks-highlight--${variant}` : ""
 				}`,
 			})}
 		>
 			{hasTitle && (
 				<div
 					className={`homegrade-blocks-highlight__titling ${
-						!hasIcon ? 'homegrade-blocks-highlight__titling--has-no-icon' : ''
+						!hasIcon ? "homegrade-blocks-highlight__titling--has-no-icon" : ""
 					}`}
 				>
-					{hasIcon && iconPosition === 'top' && (
+					{hasIcon && iconPosition === "top" && (
 						<div className="icon">
-							<img className="icon__image" src={resolvedIconUrl} alt="" />
+							<img className="icon__image" src={iconPicture} alt="" />
 						</div>
 					)}
 
@@ -71,9 +98,9 @@ export default function save({ attributes }) {
 				</div>
 			)}
 			<div className="homegrade-blocks-highlight__content">
-				{hasIcon && iconPosition === 'side' && !hasTitle && (
+				{hasIcon && iconPosition === "side" && !hasTitle && (
 					<div className="icon">
-						<img className="icon__image" src={resolvedIconUrl} alt="" />
+						<img src={iconPicture} alt="" />
 					</div>
 				)}
 

homegrade-blocks.php

@@ -312,5 +312,5 @@ function wpdocs_load_textdomain()
 }
 
 
-require_once(__DIR__ . '/blocks/highlight/highlight.php');
+
 require_once(__DIR__ . '/acf-blocks/google-map/map-api-key.php');