<?php
namespace Components\Ui;

use Components\Base;

/**
 * ModuleIdentity: reusable UI component for Module Icon, Title and Description.
 */
class ModuleIdentity
{
    /**
     * Renders the module identity block.
     *
     * @param array $m Module data (key, title, desc, color, svg_icon)
     * @param array $options UI options:
     *   - size: 'md' (default), 'lg' (for dialogs)
     *   - is_on: bool (applies grayscale if false)
     *   - class: extra classes for the container
     *   - title_class: extra classes for the title
     *   - desc_class: extra classes for the description
     *   - after_content: HTML to render after the description
     *   - action: HTML to render as an action button on the right
     */
    public static function render(array $m, array $options = []): string
    {
        $size = $options['size'] ?? 'md';
        $isOn = $options['is_on'] ?? true;
        $containerClass = $options['class'] ?? '';
        
        $iconColor = isset($m['color']) && is_string($m['color']) && $m['color'] !== '' ? $m['color'] : 'bg-indigo-500 text-white';
        $defaultSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg>';
        $iconSvg = isset($m['svg_icon']) && is_string($m['svg_icon']) && $m['svg_icon'] !== '' ? $m['svg_icon'] : $defaultSvg;

        $iconClasses = 'flex items-center justify-center shrink-0 rounded-lg ' . Base::h($iconColor);
        $contentClasses = 'flex flex-col min-w-0 grow';
        $titleClasses = 'text-primary font-medium truncate ' . ($options['title_class'] ?? '');
        
        $spacingClass = 'space-x-4';
        $alignClass = 'items-center';

        $descBaseClasses = 'text-secondary/70 overflow-hidden ' . ($options['desc_class'] ?? '');
        $descCollapsedClasses = '';
        $descExpandedClasses = '';

        if ($size === 'lg') {
            $iconClasses .= ' w-12 h-12';
            $titleClasses .= ' text-base';
            $maxHClass = 'max-h-5';
            $descCollapsedClasses = 'text-sm mt-1 ' . $maxHClass . ' line-clamp-1';
            $descExpandedClasses = 'text-sm mt-1 max-h-40 line-clamp-none';
            $spacingClass = 'gap-4';
            $alignClass = 'items-start';
        } else {
            // md (default)
            $iconClasses .= ' size-10 p-2';
            $titleClasses .= ' text-sm';
            $maxHClass = 'max-h-4';
            $descCollapsedClasses = 'text-xs ' . $maxHClass . ' line-clamp-1 max-w-96';
            $descExpandedClasses = 'text-xs max-h-40 line-clamp-none max-w-96';
            $spacingClass = 'space-x-4';
            $alignClass = 'items-start';
        }

        $grayscaleClass = $isOn ? '' : 'grayscale opacity-90';

        ob_start();
        ?>
        <div class="flex <?= $alignClass ?> <?= $spacingClass ?> min-w-0 <?= $grayscaleClass ?> <?= $containerClass ?> group"
             x-data="{ hovered: false, timeout: null, showFull: false }"
             @mouseenter="clearTimeout(timeout); timeout = setTimeout(() => { hovered = true; showFull = true; }, 300)"
             @mouseleave="clearTimeout(timeout); timeout = setTimeout(() => { hovered = false; setTimeout(() => { if (!hovered) showFull = false; }, 500); }, 300)">
            <div class="<?= $iconClasses ?>">
                <?= $iconSvg ?>
            </div>
            <div class="<?= $contentClasses ?>">
                <div class="<?= $titleClasses ?>"><?= Base::h($m['title'] ?? ''); ?></div>
                <div class="<?= $descBaseClasses ?>" 
                     :class="showFull ? '<?= $descExpandedClasses ?>' + (hovered ? '' : ' !<?= $maxHClass ?>') : '<?= $descCollapsedClasses ?>'"><?= Base::h($m['desc'] ?? '', ['allow_br' => false]); ?></div>
                <?php if (!empty($options['after_content'])): ?>
                    <?= $options['after_content'] ?>
                <?php endif; ?>
            </div>
            <?php if (!empty($options['action'])): ?>
                <div class="shrink-0 flex items-center pt-0.5">
                    <?= $options['action'] ?>
                </div>
            <?php endif; ?>
        </div>
        <?php
        return ob_get_clean();
    }
}
