/**
 * Audace — adds a "Couleur au survol" ColorPicker to core/navigation
 * and a separate one on the Overlay nav for the open overlay state.
 *
 * The chosen value is stored on the block as `audaceHoverColor`
 * (any CSS color string). The render side emits a scoped <style>.
 */
(function (wp) {
    'use strict';
    if (!wp || !wp.hooks) return;

    var addFilter        = wp.hooks.addFilter;
    var __               = (wp.i18n && wp.i18n.__) ? wp.i18n.__ : function (s) { return s; };
    var createHigherOrderComponent = wp.compose.createHigherOrderComponent;
    var Fragment         = wp.element.Fragment;
    var createElement    = wp.element.createElement;
    var InspectorControls = wp.blockEditor.InspectorControls;
    var PanelBody        = wp.components.PanelBody;
    var ColorPalette     = wp.blockEditor.ColorPalette;

    addFilter('blocks.registerBlockType', 'audace/nav-hover/attrs', function (settings, name) {
        if (name !== 'core/navigation') return settings;
        if (!settings.attributes) settings.attributes = {};
        settings.attributes.audaceTextColor  = settings.attributes.audaceTextColor  || { type: 'string', default: '' };
        settings.attributes.audaceHoverColor = settings.attributes.audaceHoverColor || { type: 'string', default: '' };
        return settings;
    });

    function colorRow(label, value, onChange) {
        return createElement('div', { style: { marginBottom: '16px' } },
            createElement('p', { style: { margin: '0 0 6px', fontSize: 11, textTransform: 'uppercase', fontWeight: 500 } }, label),
            createElement(ColorPalette, {
                value: value,
                onChange: function (v) { onChange(v || ''); },
                clearable: true
            })
        );
    }

    var withNavColors = createHigherOrderComponent(function (BlockEdit) {
        return function (props) {
            if (props.name !== 'core/navigation') return createElement(BlockEdit, props);
            var a = props.attributes;
            return createElement(Fragment, null,
                createElement(BlockEdit, props),
                createElement(InspectorControls, null,
                    createElement(PanelBody, { title: __('Audace — Couleurs du menu', 'audace'), initialOpen: true },
                        colorRow(__('Couleur des liens', 'audace'),       a.audaceTextColor,  function (v) { props.setAttributes({ audaceTextColor: v }); }),
                        colorRow(__('Couleur au survol', 'audace'),       a.audaceHoverColor, function (v) { props.setAttributes({ audaceHoverColor: v }); })
                    )
                )
            );
        };
    }, 'withAudaceNavColors');
    addFilter('editor.BlockEdit', 'audace/nav-hover/control', withNavColors);
})(window.wp);
