/**
 * AI Creative Studio - インライン文字装飾
 * 選択したテキストのみに適用される装飾機能
 */

(function (wp) {
    'use strict';
    
    // 必要なAPIを取得
    const { registerFormatType, toggleFormat } = wp.richText;
    const { RichTextToolbarButton } = wp.blockEditor;
    const { createElement: el } = wp.element;

    /**
     * 汎用フォーマット登録関数
     */
    function registerInlineFormat(name, config) {
        registerFormatType(name, {
            title: config.title,
            tagName: config.tagName || 'span',
            className: config.className,
            edit: function (props) {
                return el(RichTextToolbarButton, {
                    icon: config.icon,
                    title: config.title,
                    onClick: function () {
                        props.onChange(toggleFormat(props.value, {
                            type: name
                        }));
                    },
                    isActive: props.isActive
                });
            }
        });
    }

    // 黄色マーカー
    registerInlineFormat('aics/highlight-yellow', {
        title: '黄色マーカー',
        className: 'aics-highlight-yellow',
        icon: el('span', { 
            style: { 
                background: '#fef3c7', 
                padding: '2px 6px', 
                borderRadius: '2px',
                fontSize: '12px',
                fontWeight: 'bold'
            } 
        }, '黄')
    });

    // 青色マーカー
    registerInlineFormat('aics/highlight-blue', {
        title: '青色マーカー',
        className: 'aics-highlight-blue',
        icon: el('span', { 
            style: { 
                background: '#dbeafe', 
                padding: '2px 6px', 
                borderRadius: '2px',
                fontSize: '12px',
                fontWeight: 'bold'
            } 
        }, '青')
    });

    // 太字マーカー（強調）
    registerInlineFormat('aics/bold-highlight', {
        title: '太字マーカー',
        tagName: 'strong',
        className: 'aics-bold-highlight',
        icon: el('span', { 
            style: { 
                background: '#f59e0b', 
                color: '#fff',
                padding: '2px 6px', 
                borderRadius: '2px',
                fontSize: '12px',
                fontWeight: 'bold'
            } 
        }, '太')
    });

    // 小さいフォント
    registerInlineFormat('aics/small-text', {
        title: '小さい文字',
        tagName: 'small',
        className: 'aics-small-text',
        icon: el('span', { 
            style: { 
                fontSize: '10px',
                fontWeight: 'bold'
            } 
        }, 'A')
    });

    // 大きいフォント
    registerInlineFormat('aics/large-text', {
        title: '大きい文字',
        className: 'aics-large-text',
        icon: el('span', { 
            style: { 
                fontSize: '16px',
                fontWeight: 'bold'
            } 
        }, 'A')
    });

    // 注釈（補足情報用）
    registerInlineFormat('aics/annotation', {
        title: '注釈',
        className: 'aics-annotation',
        icon: el('span', { 
            style: { 
                fontSize: '11px',
                color: '#6b7280'
            } 
        }, '※')
    });

})(window.wp);