sodino/admin/components/layout.php

<?php
// Prevent direct access
if (!defined('ABSPATH')) {
    exit;
}

/**
 * Admin Layout Component
 * Usage: sodino_admin_layout($current_page, $content_callback)
 */
function sodino_admin_layout($current_page, $content_callback) {
    ?>
    <div id="sodino-app" class="min-h-screen bg-gray-50" dir="rtl">
        <?php include SODINO_PLUGIN_DIR . 'admin/components/header.php'; ?>
        
        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
            <div class="flex gap-8">
                <?php include SODINO_PLUGIN_DIR . 'admin/components/sidebar.php'; ?>
                
                <main class="flex-1 min-w-0">
                    <?php call_user_func($content_callback); ?>
                </main>
            </div>
        </div>
    </div>
    <?php
}

/**
 * Card Component
 */
function sodino_card($title = '', $description = '', $content_callback = null, $classes = '') {
    ?>
    <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6 <?php echo esc_attr($classes); ?>">
        <?php if ($title): ?>
            <h2 class="text-xl font-semibold text-gray-900 mb-2"><?php echo esc_html($title); ?></h2>
        <?php endif; ?>
        
        <?php if ($description): ?>
            <p class="text-gray-600 mb-4"><?php echo esc_html($description); ?></p>
        <?php endif; ?>
        
        <?php if ($content_callback): ?>
            <?php call_user_func($content_callback); ?>
        <?php endif; ?>
    </div>
    <?php
}

/**
 * Stats Card Component
 */
function sodino_stat_card($title, $value, $type = 'default') {
    $classes = [
        'primary' => 'bg-gradient-to-br from-blue-600 to-blue-700 text-white',
        'default' => 'bg-white border border-gray-200'
    ];
    
    $class = $classes[$type] ?? $classes['default'];
    $text_class = $type === 'primary' ? 'text-white opacity-90' : 'text-gray-600';
    $value_class = $type === 'primary' ? 'text-white' : 'text-gray-900';
    ?>
    <div class="<?php echo esc_attr($class); ?> rounded-lg p-6">
        <h3 class="text-sm font-medium <?php echo esc_attr($text_class); ?>"><?php echo esc_html($title); ?></h3>
        <div class="text-2xl font-bold <?php echo esc_attr($value_class); ?> mt-2"><?php echo $value; ?></div>
    </div>
    <?php
}

/**
 * Button Component
 */
function sodino_button($text, $url = '#', $type = 'primary', $icon = '') {
    $classes = [
        'primary' => 'bg-blue-600 text-white hover:bg-blue-700',
        'secondary' => 'bg-white text-gray-700 border border-gray-300 hover:bg-gray-50',
        'danger' => 'bg-red-600 text-white hover:bg-red-700'
    ];
    
    $class = $classes[$type] ?? $classes['primary'];
    ?>
    <a href="<?php echo esc_url($url); ?>" 
       class="inline-flex items-center px-4 py-2 text-sm font-medium rounded-lg <?php echo esc_attr($class); ?> focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 transition-colors duration-200">
        <?php if ($icon): ?>
            <svg class="-ml-1 mr-2 h-5 w-5" fill="currentColor" viewBox="0 0 20 20">
                <?php echo $icon; ?>
            </svg>
        <?php endif; ?>
        <?php echo esc_html($text); ?>
    </a>
    <?php
}

/**
 * Form Field Component
 */
function sodino_form_field($args) {
    $defaults = [
        'type' => 'text',
        'name' => '',
        'label' => '',
        'value' => '',
        'placeholder' => '',
        'required' => false,
        'description' => '',
        'options' => [],
        'class' => ''
    ];
    
    $args = wp_parse_args($args, $defaults);
    extract($args);
    
    $required_attr = $required ? 'required' : '';
    $field_id = 'sodino_' . $name;
    ?>
    <div class="<?php echo esc_attr($class); ?>">
        <?php if ($label): ?>
            <label for="<?php echo esc_attr($field_id); ?>" class="block text-sm font-medium text-gray-700 mb-2">
                <?php echo esc_html($label); ?>
                <?php if ($required): ?>
                    <span class="text-red-500">*</span>
                <?php endif; ?>
            </label>
        <?php endif; ?>
        
        <?php if ($type === 'textarea'): ?>
            <textarea 
                id="<?php echo esc_attr($field_id); ?>"
                name="<?php echo esc_attr($name); ?>"
                rows="4"
                class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                placeholder="<?php echo esc_attr($placeholder); ?>"
                <?php echo $required_attr; ?>
            ><?php echo esc_textarea($value); ?></textarea>
            
        <?php elseif ($type === 'select'): ?>
            <select 
                id="<?php echo esc_attr($field_id); ?>"
                name="<?php echo esc_attr($name); ?>"
                class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                <?php echo $required_attr; ?>
            >
                <?php foreach ($options as $opt_value => $opt_label): ?>
                    <option value="<?php echo esc_attr($opt_value); ?>" <?php selected($value, $opt_value); ?>>
                        <?php echo esc_html($opt_label); ?>
                    </option>
                <?php endforeach; ?>
            </select>
            
        <?php elseif ($type === 'checkbox'): ?>
            <label class="flex items-center">
                <input 
                    type="checkbox"
                    id="<?php echo esc_attr($field_id); ?>"
                    name="<?php echo esc_attr($name); ?>"
                    value="1"
                    class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded"
                    <?php checked($value, 1); ?>
                    <?php echo $required_attr; ?>
                />
                <span class="mr-2 text-sm text-gray-700"><?php echo esc_html($label); ?></span>
            </label>
            
        <?php else: ?>
            <input 
                type="<?php echo esc_attr($type); ?>"
                id="<?php echo esc_attr($field_id); ?>"
                name="<?php echo esc_attr($name); ?>"
                value="<?php echo esc_attr($value); ?>"
                placeholder="<?php echo esc_attr($placeholder); ?>"
                class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                <?php echo $required_attr; ?>
            />
        <?php endif; ?>
        
        <?php if ($description): ?>
            <p class="mt-1 text-sm text-gray-500"><?php echo esc_html($description); ?></p>
        <?php endif; ?>
    </div>
    <?php
}