project/
├── components/
│   ├── Button/
│   │   ├── Button.php
│   │   ├── button.css
│   │   └── button.js
│   ├── Card/
│   │   ├── Card.php
│   │   ├── card.css
│   │   └── card.js
│   └── Modal/
│       ├── Modal.php
│       ├── modal.css
│       └── modal.js
├── core/
│   ├── Component.php
│   └── ComponentRegistry.php
└── public/
    └── index.php

<?php
// core/Component.php

abstract class Component {
    protected $props = [];
    protected $children = [];
    protected $attributes = [];
    
    public function __construct(array $props = []) {
        $this->props = $props;
        $this->init();
    }
    
    // 컴포넌트 초기화 (자식 클래스에서 오버라이드)
    protected function init() {}
    
    // 렌더링 메서드 (필수 구현)
    abstract public function render(): string;
    
    // Props 설정
    public function setProp(string $key, $value): self {
        $this->props[$key] = $value;
        return $this;
    }
    
    // Props 가져오기
    public function getProp(string $key, $default = null) {
        return $this->props[$key] ?? $default;
    }
    
    // HTML 속성 추가
    public function setAttribute(string $key, string $value): self {
        $this->attributes[$key] = $value;
        return $this;
    }
    
    // 속성들을 HTML 문자열로 변환
    protected function getAttributesString(): string {
        $attrs = [];
        foreach ($this->attributes as $key => $value) {
            $attrs[] = sprintf('%s="%s"', 
                htmlspecialchars($key), 
                htmlspecialchars($value)
            );
        }
        return implode(' ', $attrs);
    }
    
    // 자식 컴포넌트 추가
    public function addChild(Component $child): self {
        $this->children[] = $child;
        return $this;
    }
    
    // 자식 컴포넌트들 렌더링
    protected function renderChildren(): string {
        return implode('', array_map(
            fn($child) => $child->render(), 
            $this->children
        ));
    }
    
    // 문자열로 변환 시 자동 렌더링
    public function __toString(): string {
        return $this->render();
    }
}

<?php
// components/Button/Button.php

class Button extends Component {
    private $validVariants = ['primary', 'secondary', 'success', 'danger', 'warning'];
    private $validSizes = ['sm', 'md', 'lg'];
    
    protected function init() {
        // 기본값 설정
        $this->props = array_merge([
            'text' => 'Button',
            'variant' => 'primary',
            'size' => 'md',
            'icon' => null,
            'iconPosition' => 'left',
            'disabled' => false,
            'type' => 'button',
            'onClick' => null
        ], $this->props);
        
        // 유효성 검증
        $this->validateProps();
        
        // 기본 클래스 설정
        $this->buildClasses();
    }
    
    private function validateProps() {
        $variant = $this->getProp('variant');
        if (!in_array($variant, $this->validVariants)) {
            throw new InvalidArgumentException(
                "Invalid variant: {$variant}. Must be one of: " . 
                implode(', ', $this->validVariants)
            );
        }
        
        $size = $this->getProp('size');
        if (!in_array($size, $this->validSizes)) {
            throw new InvalidArgumentException(
                "Invalid size: {$size}. Must be one of: " . 
                implode(', ', $this->validSizes)
            );
        }
    }
    
    private function buildClasses() {
        $classes = [
            'btn',
            'btn-' . $this->getProp('variant'),
            'btn-' . $this->getProp('size')
        ];
        
        if ($this->getProp('disabled')) {
            $classes[] = 'btn-disabled';
        }
        
        // 기존 class 속성과 병합
        $existingClass = $this->attributes['class'] ?? '';
        $this->setAttribute('class', 
            trim($existingClass . ' ' . implode(' ', $classes))
        );
    }
    
    public function render(): string {
        $text = htmlspecialchars($this->getProp('text'));
        $icon = $this->getProp('icon');
        $iconPosition = $this->getProp('iconPosition');
        $disabled = $this->getProp('disabled');
        $type = $this->getProp('type');
        $onClick = $this->getProp('onClick');
        
        // disabled 속성 추가
        if ($disabled) {
            $this->setAttribute('disabled', 'disabled');
        }
        
        // type 속성 추가
        $this->setAttribute('type', $type);
        
        // onClick 이벤트 추가
        if ($onClick) {
            $this->setAttribute('onclick', $onClick);
        }
        
        // 아이콘 렌더링
        $iconHtml = '';
        if ($icon) {
            $iconHtml = sprintf(
                '<span class="btn-icon">%s</span>',
                $icon
            );
        }
        
        // 버튼 내용 구성
        $content = $iconPosition === 'left' 
            ? $iconHtml . '<span class="btn-text">' . $text . '</span>'
            : '<span class="btn-text">' . $text . '</span>' . $iconHtml;
        
        return sprintf(
            '<button %s>%s</button>',
            $this->getAttributesString(),
            $content
        );
    }
    
    // 편의 메서드들
    public function primary(): self {
        return $this->setProp('variant', 'primary');
    }
    
    public function secondary(): self {
        return $this->setProp('variant', 'secondary');
    }
    
    public function large(): self {
        return $this->setProp('size', 'lg');
    }
    
    public function small(): self {
        return $this->setProp('size', 'sm');
    }
    
    public function disable(): self {
        return $this->setProp('disabled', true);
    }
}

<?php
// 사용 예시

// 기본 버튼
$btn1 = new Button(['text' => '클릭하세요']);
echo $btn1;

// 메서드 체이닝으로 스타일 변경
$btn2 = (new Button(['text' => '저장']))
    ->primary()
    ->large()
    ->setAttribute('id', 'save-btn');
echo $btn2;

// 아이콘이 있는 버튼
$btn3 = new Button([
    'text' => '삭제',
    'variant' => 'danger',
    'icon' => '🗑️',
    'onClick' => 'confirmDelete()'
]);
echo $btn3;

// 비활성화된 버튼
$btn4 = (new Button(['text' => '제출']))
    ->disable()
    ->secondary();
echo $btn4;

<?php
// core/WebComponentTrait.php

trait WebComponentTrait {
    protected $webComponentName;
    protected $shadowDOM = true;
    
    // Web Component 이름 설정
    public function setWebComponentName(string $name): self {
        // Custom element 이름은 반드시 하이픈을 포함해야 함
        if (!preg_match('/^[a-z]+-[a-z-]+$/', $name)) {
            throw new InvalidArgumentException(
                "Web component name must contain a hyphen: {$name}"
            );
        }
        $this->webComponentName = $name;
        return $this;
    }
    
    // Web Component JavaScript 생성
    public function generateWebComponent(): string {
        if (!$this->webComponentName) {
            throw new RuntimeException(
                'Web component name not set. Call setWebComponentName() first.'
            );
        }
        
        $className = $this->getWebComponentClassName();
        $template = $this->getWebComponentTemplate();
        $styles = $this->getWebComponentStyles();
        
        return <<<JS
class {$className} extends HTMLElement {
    constructor() {
        super();
        
        // Shadow DOM 생성
        const shadow = this.attachShadow({ mode: 'open' });
        
        // 스타일 추가
        const style = document.createElement('style');
        style.textContent = `{$styles}`;
        shadow.appendChild(style);
        
        // 템플릿 추가
        const template = document.createElement('template');
        template.innerHTML = `{$template}`;
        shadow.appendChild(template.content.cloneNode(true));
        
        // 초기화
        this.init();
    }
    
    // 관찰할 속성들
    static get observedAttributes() {
        return {$this->getObservedAttributes()};
    }
    
    // 속성 변경 감지
    attributeChangedCallback(name, oldValue, newValue) {
        if (oldValue !== newValue) {
            this.handleAttributeChange(name, newValue);
        }
    }
    
    // 초기화 메서드
    init() {
        {$this->getInitScript()}
    }
    
    // 속성 변경 핸들러
    handleAttributeChange(name, value) {
        {$this->getAttributeChangeScript()}
    }
    
    // 컴포넌트가 DOM에 추가될 때
    connectedCallback() {
        {$this->getConnectedScript()}
    }
    
    // 컴포넌트가 DOM에서 제거될 때
    disconnectedCallback() {
        {$this->getDisconnectedScript()}
    }
}

// Custom Element 등록
customElements.define('{$this->webComponentName}', {$className});
JS;
    }
    
    // 클래스 이름 생성 (PascalCase)
    protected function getWebComponentClassName(): string {
        $parts = explode('-', $this->webComponentName);
        return implode('', array_map('ucfirst', $parts)) . 'Element';
    }
    
    // 템플릿 HTML 반환 (자식 클래스에서 오버라이드)
    protected function getWebComponentTemplate(): string {
        return $this->render();
    }
    
    // 스타일 CSS 반환 (자식 클래스에서 오버라이드)
    protected function getWebComponentStyles(): string {
        return '';
    }
    
    // 관찰할 속성 목록 (자식 클래스에서 오버라이드)
    protected function getObservedAttributes(): string {
        $attrs = array_keys($this->props);
        return json_encode($attrs);
    }
    
    // 초기화 스크립트 (자식 클래스에서 오버라이드)
    protected function getInitScript(): string {
        return '// Component initialized';
    }
    
    // 속성 변경 스크립트 (자식 클래스에서 오버라이드)
    protected function getAttributeChangeScript(): string {
        return '// Attribute changed';
    }
    
    // 연결 스크립트 (자식 클래스에서 오버라이드)
    protected function getConnectedScript(): string {
        return '// Component connected';
    }
    
    // 연결 해제 스크립트 (자식 클래스에서 오버라이드)
    protected function getDisconnectedScript(): string {
        return '// Component disconnected';
    }
    
    // Web Component 스크립트 출력
    public function renderWebComponentScript(): string {
        return sprintf(
            '<script>%s</script>',
            $this->generateWebComponent()
        );
    }
}

<?php
// components/Button/Button.php (확장 버전)

class Button extends Component {
    use WebComponentTrait;
    
    // ... 기존 코드 ...
    
    protected function getWebComponentStyles(): string {
        return <<<CSS
:host {
    display: inline-block;
}

.btn {
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 0.375rem;
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.btn:active:not(:disabled) {
    transform: translateY(0);
}

.btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-primary {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
}

.btn-secondary {
    background: linear-gradient(135deg, #a8b5c8 0%, #8a9bb0 100%);
    color: white;
}

.btn-success {
    background: linear-gradient(135deg, #81c784 0%, #66bb6a 100%);
    color: white;
}

.btn-danger {
    background: linear-gradient(135deg, #ef5350 0%, #e53935 100%);
    color: white;
}

.btn-sm {
    padding: 0.375rem 0.75rem;
    font-size: 0.875rem;
}

.btn-lg {
    padding: 0.75rem 1.5rem;
    font-size: 1.125rem;
}

.btn-icon {
    display: inline-flex;
    align-items: center;
}
CSS;
    }
    
    protected function getInitScript(): string {
        return <<<JS
// 버튼 요소 찾기
this.button = this.shadowRoot.querySelector('.btn');

// 클릭 이벤트 리스너
this.button.addEventListener('click', (e) => {
    if (this.hasAttribute('disabled')) {
        e.preventDefault();
        e.stopPropagation();
        return;
    }
    
    // 커스텀 이벤트 발생
    this.dispatchEvent(new CustomEvent('btn-click', {
        bubbles: true,
        composed: true,
        detail: { button: this }
    }));
});
JS;
    }
    
    protected function getAttributeChangeScript(): string {
        return <<<JS
switch(name) {
    case 'text':
        const textEl = this.shadowRoot.querySelector('.btn-text');
        if (textEl) textEl.textContent = value;
        break;
        
    case 'disabled':
        this.button.disabled = value !== null;
        break;
        
    case 'variant':
        // 기존 variant 클래스 제거
        this.button.className = this.button.className
            .replace(/btn-(primary|secondary|success|danger|warning)/g, '');
        // 새 variant 클래스 추가
        this.button.classList.add('btn-' + value);
        break;
}
JS;
    }
}

<?php
// 사용 예시

$button = new Button([
    'text' => '좋아요',
    'variant' => 'primary'
]);

// Web Component 이름 설정
$button->setWebComponentName('custom-button');

// Web Component 스크립트 출력 (한 번만)
echo $button->renderWebComponentScript();

// 이제 HTML에서 사용 가능
?>

<!-- PHP로 렌더링된 버튼 -->
<?= $button ?>

<!-- Web Component로 사용 -->
<custom-button text="공유하기" variant="secondary"></custom-button>

<!-- JavaScript로 동적 생성 -->
<script>
// 동적으로 버튼 추가
const btn = document.createElement('custom-button');
btn.setAttribute('text', '동적 버튼');
btn.setAttribute('variant', 'success');
btn.addEventListener('btn-click', (e) => {
    console.log('버튼 클릭됨!', e.detail);
});
document.body.appendChild(btn);

// 속성 변경도 가능
setTimeout(() => {
    btn.setAttribute('text', '변경된 텍스트');
    btn.setAttribute('variant', 'danger');
}, 2000);
</script>

<?php
// core/Component.php (확장 버전)

abstract class Component {
    // ... 기존 코드 ...
    
    private $lifecycleHooks = [
        'beforeRender' => [],
        'afterRender' => [],
        'beforeDestroy' => [],
        'afterDestroy' => []
    ];
    
    private $isRendered = false;
    private $isDestroyed = false;
    
    // 라이프사이클 훅 등록
    public function on(string $hook, callable $callback): self {
        if (!isset($this->lifecycleHooks[$hook])) {
            throw new InvalidArgumentException("Invalid lifecycle hook: {$hook}");
        }
        
        $this->lifecycleHooks[$hook][] = $callback;
        return $this;
    }
    
    // 훅 실행
    protected function triggerHook(string $hook, ...$args): void {
        if (isset($this->lifecycleHooks[$hook])) {
            foreach ($this->lifecycleHooks[$hook] as $callback) {
                call_user_func_array($callback, array_merge([$this], $args));
            }
        }
    }
    
    // 렌더링 (훅 포함)
    public function render(): string {
        if ($this->isDestroyed) {
            throw new RuntimeException('Cannot render destroyed component');
        }
        
        // beforeRender 훅
        $this->triggerHook('beforeRender');
        
        // 실제 렌더링
        $output = $this->doRender();
        
        $this->isRendered = true;
        
        // afterRender 훅
        $this->triggerHook('afterRender', $output);
        
        return $output;
    }
    
    // 실제 렌더링 로직 (자식 클래스에서 구현)
    abstract protected function doRender(): string;
    
    // 컴포넌트 파괴
    public function destroy(): void {
        if ($this->isDestroyed) {
            return;
        }
        
        // beforeDestroy 훅
        $this->triggerHook('beforeDestroy');
        
        // 자식 컴포넌트들도 파괴
        foreach ($this->children as $child) {
            if (method_exists($child, 'destroy')) {
                $child->destroy();
            }
        }
        
        // 리소스 정리
        $this->cleanup();
        
        $this->isDestroyed = true;
        
        // afterDestroy 훅
        $this->triggerHook('afterDestroy');
    }
    
    // 리소스 정리 (자식 클래스에서 오버라이드)
    protected function cleanup(): void {
        // 기본적으로 아무것도 하지 않음
    }
    
    // 상태 확인
    public function isRendered(): bool {
        return $this->isRendered;
    }
    
    public function isDestroyed(): bool {
        return $this->isDestroyed;
    }
}

<?php
// components/UserCard/UserCard.php

class UserCard extends Card {
    private $userId;
    private $userData;
    private $db;
    
    public function __construct(array $props = []) {
        parent::__construct($props);
        
        $this->userId = $props['userId'] ?? null;
        
        // beforeRender 훅: 데이터 로드
        $this->on('beforeRender', function($component) {
            $this->loadUserData();
        });
        
        // afterRender 훅: 로깅
        $this->on('afterRender', function($component, $output) {
            error_log("UserCard rendered for user: {$this->userId}");
        });
        
        // beforeDestroy 훅: 리소스 정리
        $this->on('beforeDestroy', function($component) {
            if ($this->db) {
                // DB 연결 종료
                $this->db = null;
            }
        });
    }
    
    private function loadUserData(): void {
        if (!$this->userId) {
            throw new RuntimeException('User ID is required');
        }
        
        // 실제로는 데이터베이스에서 가져오겠지만, 여기서는 예시로
        // (실제 프로젝트에서는 PDO나 ORM 사용)
        $this->userData = [
            'id' => $this->userId,
            'name' => 'John Doe',
            'email' => 'john@example.com',
            'avatar' => 'https://example.com/avatar.jpg',
            'bio' => 'PHP 개발자이자 컴포넌트 아키텍처 전문가',
            'skills' => ['PHP', 'JavaScript', 'MySQL', 'Web Components']
        ];
    }
    
    protected function doRender(): string {
        if (!$this->userData) {
            return '<div class="user-card-error">사용자 데이터를 불러올 수 없습니다.</div>';
        }
        
        // 카드 설정
        $this->setProp('title', $this->userData['name']);
        $this->setProp('subtitle', $this->userData['email']);
        $this->setImage($this->userData['avatar'], $this->userData['name']);
        
        // 본문 구성
        $skillsHtml = implode('', array_map(function($skill) {
            return '<span class="skill-badge">' . htmlspecialchars($skill) . '</span>';
        }, $this->userData['skills']));
        
        $bodyHtml = sprintf('
            <p class="user-bio">%s</p>
            <div class="user-skills">
                <strong>기술 스택:</strong>
                <div class="skills-container">%s</div>
            </div>
        ', 
            htmlspecialchars($this->userData['bio']),
            $skillsHtml
        );
        
        $this->setBody($bodyHtml);
        
        // 푸터에 액션 버튼들
        $this->setFooter('
            <div style="display: flex; gap: 10px; justify-content: space-between;">
                ' . new Button(['text' => '프로필 보기', 'variant' => 'primary']) . '
                ' . new Button(['text' => '메시지 보내기', 'variant' => 'secondary']) . '
            </div>
        ');
        
        // 부모 클래스의 렌더링 호출
        return parent::doRender();
    }
}

// 사용 예시
$userCard = new UserCard(['userId' => 123]);

// 추가 훅 등록도 가능
$userCard->on('afterRender', function($component, $output) {
    // 분석 추적
    // Analytics::track('user_card_viewed', ['user_id' => $component->userId]);
});

echo $userCard;

// 사용 완료 후 리소스 정리
$userCard->destroy();

<?php
// core/ComponentRegistry.php

class ComponentRegistry {
    private static $instance = null;
    private $components = [];
    private $paths = [];
    private $aliases = [];
    
    private function __construct() {
        // 싱글톤 패턴
    }
    
    public static function getInstance(): self {
        if (self::$instance === null) {
            self::$instance = new self();
        }
        return self::$instance;
    }
    
    // 컴포넌트 경로 등록
    public function registerPath(string $path): self {
        $this->paths[] = rtrim($path, '/');
        return $this;
    }
    
    // 컴포넌트 별칭 등록
    public function registerAlias(string $alias, string $className): self {
        $this->aliases[$alias] = $className;
        return $this;
    }
    
    // 컴포넌트 자동 검색
    public function discover(): self {
        foreach ($this->paths as $path) {
            if (!is_dir($path)) {
                continue;
            }
            
            $iterator = new RecursiveIteratorIterator(
                new RecursiveDirectoryIterator($path)
            );
            
            foreach ($iterator as $file) {
                if ($file->isFile() && $file->getExtension() === 'php') {
                    $this->loadComponentFile($file->getPathname());
                }
            }
        }
        
        return $this;
    }
    
    private function loadComponentFile(string $filepath): void {
        require_once $filepath;
        
        // 파일에서 정의된 클래스 찾기
        $classes = get_declared_classes();
        $beforeCount = count($this->components);
        
        foreach ($classes as $class) {
            if (is_subclass_of($class, Component::class) && 
                !isset($this->components[$class])) {
                $this->register($class);
            }
        }
    }
    
    // 컴포넌트 등록
    public function register(string $className): self {
        if (!class_exists($className)) {
            throw new RuntimeException("Class not found: {$className}");
        }
        
        if (!is_subclass_of($className, Component::class)) {
            throw new RuntimeException(
                "{$className} must extend Component class"
            );
        }
        
        $this->components[$className] = [
            'class' => $className,
            'registered_at' => time()
        ];
        
        return $this;
    }
    
    // 컴포넌트 생성
    public function create(string $name, array $props = []): Component {
        // 별칭으로 찾기
        $className = $this->aliases[$name] ?? $name;
        
        // 등록된 컴포넌트인지 확인
        if (!isset($this->components[$className])) {
            // 자동 로드 시도
            if (class_exists($className)) {
                $this->register($className);
            } else {
                throw new RuntimeException(
                    "Component not found: {$name}"
                );
            }
        }
        
        return new $className($props);
    }
    
    // 등록된 모든 컴포넌트 목록
    public function getRegistered(): array {
        return array_keys($this->components);
    }
    
    // 컴포넌트 존재 여부 확인
    public function has(string $name): bool {
        $className = $this->aliases[$name] ?? $name;
        return isset($this->components[$className]);
    }
    
    // 헬퍼 함수로 사용할 수 있도록
    public function __call(string $name, array $arguments): Component {
        // 메서드 이름을 클래스 이름으로 변환
        // 예: button() -> Button
        $className = ucfirst($name);
        $props = $arguments[0] ?? [];
        
        return $this->create($className, $props);
    }
}

// 전역 헬퍼 함수
function component(string $name, array $props = []): Component {
    return ComponentRegistry::getInstance()->create($name, $props);
}

function c(string $name, array $props = []): Component {
    // 짧은 버전
    return component($name, $props);
}

<?php
// bootstrap.php - 애플리케이션 초기화

require_once 'core/Component.php';
require_once 'core/ComponentRegistry.php';
require_once 'core/WebComponentTrait.php';

// 레지스트리 인스턴스 가져오기
$registry = ComponentRegistry::getInstance();

// 컴포넌트 경로 등록
$registry
    ->registerPath(__DIR__ . '/components')
    ->registerPath(__DIR__ . '/custom-components');

// 별칭 등록 (선택사항)
$registry
    ->registerAlias('btn', 'Button')
    ->registerAlias('user-card', 'UserCard');

// 자동 검색 실행
$registry->discover();

// 등록된 컴포넌트 확인
echo "등록된 컴포넌트: " . implode(', ', $registry->getRegistered()) . "\n";

// ===== 사용 예시 =====

// 방법 1: 레지스트리를 통한 생성
$button1 = $registry->create('Button', ['text' => '클릭']);
echo $button1;

// 방법 2: 별칭 사용
$button2 = $registry->create('btn', ['text' => '저장']);
echo $button2;

// 방법 3: 헬퍼 함수 사용
$card = component('Card', [
    'title' => '헬퍼 함수로 생성',
    'hoverable' => true
]);
echo $card;

// 방법 4: 짧은 헬퍼 함수
$userCard = c('UserCard', ['userId' => 456]);
echo $userCard;

// 방법 5: 매직 메서드 (가장 편리!)
$button3 = $registry->button(['text' => '매직!']);
$card2 = $registry->card(['title' => '매직 카드']);

echo $button3;
echo $card2;

<?php
// core/StyleManager.php

class StyleManager {
    private static $instance = null;
    private $styles = [];
    private $themes = [];
    private $currentTheme = 'default';
    private $compiled = false;
    
    private function __construct() {}
    
    public static function getInstance(): self {
        if (self::$instance === null) {
            self::$instance = new self();
        }
        return self::$instance;
    }
    
    // 스타일 등록
    public function register(string $name, string $css): self {
        $this->styles[$name] = $css;
        $this->compiled = false;
        return $this;
    }
    
    // 스타일 파일 등록
    public function registerFile(string $name, string $filepath): self {
        if (!file_exists($filepath)) {
            throw new RuntimeException("Style file not found: {$filepath}");
        }
        
        $css = file_get_contents($filepath);
        return $this->register($name, $css);
    }
    
    // 테마 등록
    public function registerTheme(string $name, array $variables): self {
        $this->themes[$name] = $variables;
        return $this;
    }
    
    // 현재 테마 설정
    public function setTheme(string $name): self {
        if (!isset($this->themes[$name])) {
            throw new RuntimeException("Theme not found: {$name}");
        }
        
        $this->currentTheme = $name;
        $this->compiled = false;
        return $this;
    }
    
    // CSS 변수 치환
    private function replaceVariables(string $css): string {
        if (!isset($this->themes[$this->currentTheme])) {
            return $css;
        }
        
        $theme = $this->themes[$this->currentTheme];
        
        foreach ($theme as $key => $value) {
            // CSS 변수 형식: var(--variable-name)
            $css = str_replace("var(--{$key})", $value, $css);
            // 또는 PHP 변수 형식: {{variable-name}}
            $css = str_replace("{{{$key}}}", $value, $css);
        }
        
        return $css;
    }
    
    // 모든 스타일 컴파일
    public function compile(): string {
        if ($this->compiled) {
            return $this->getCompiled();
        }
        
        $compiled = [];
        
        foreach ($this->styles as $name => $css) {
            $processed = $this->replaceVariables($css);
            $compiled[] = "/* Component: {$name} */\n{$processed}\n";
        }
        
        $this->compiled = implode("\n", $compiled);
        return $this->compiled;
    }
    
    // 컴파일된 스타일 가져오기
    public function getCompiled(): string {
        return $this->compiled ?: $this->compile();
    }
    
    // 스타일 태그로 출력
    public function render(): string {
        return sprintf(
            '<style>.tx-header{background:linear-gradient(135deg,#f5f7fa 0%,#e8ecf1 100%);
border-radius:16px;
padding:40px;
margin:30px 0;
box-shadow:0 4px 20px rgba(0,0,0,0.08);
text-align:center;}
.tx-section{margin:40px 0;
line-height:1.9;}
.tx-box{background:linear-gradient(135deg,#faf9f7 0%,#f0eeeb 100%);
border-left:4px solid #a8b5c8;
padding:20px;
margin:25px 0;
border-radius:8px;
box-shadow:0 2px 12px rgba(0,0,0,0.05);}
.tx-highlight{background:linear-gradient(120deg,#fef5e7 0%,#fdebd0 100%);
padding:3px 8px;
border-radius:4px;
font-weight:600;}
.tx-tip{background:linear-gradient(135deg,#e8f5e9 0%,#dcedc8 100%);
border-left:4px solid #81c784;
padding:18px;
margin:25px 0;
border-radius:8px;}
.tx-warning{background:linear-gradient(135deg,#fff3e0 0%,#ffe0b2 100%);
border-left:4px solid #ffb74d;
padding:18px;
margin:25px 0;
border-radius:8px;}
.tx-table{width:100%;
border-collapse:collapse;
margin:25px 0;
background:#fff;
border-radius:8px;
overflow:hidden;
box-shadow:0 2px 12px rgba(0,0,0,0.06);}
.tx-table th{background:linear-gradient(135deg,#b8c5d6 0%,#a3b1c6 100%);
color:#2c3e50;
padding:15px;
text-align:left;
font-weight:600;}
.tx-table td{padding:15px;
border-bottom:1px solid #ecf0f1;}
.tx-subtitle{color:#5d6d7e;
font-size:1.1em;
margin:30px 0 15px 0;
font-weight:600;
padding-left:12px;
border-left:3px solid #a8b5c8;}</style>',
            $this->compile()
        );
    }
    
    // 파일로 저장
    public function saveToFile(string $filepath): bool {
        $css = $this->compile();
        return file_put_contents($filepath, $css) !== false;
    }
    
    // 압축 (minify)
    public function minify(string $css): string {
        // 주석 제거
        $css = preg_replace('!/\*[^*]*\*+([^/][^*]*\*+)*/!', '', $css);
        // 불필요한 공백 제거
        $css = str_replace(["\r\n", "\r", "\n", "\t", '  ', '    '], '', $css);
        $css = preg_replace('/\s+/', ' ', $css);
        $css = preg_replace('/\s*([{}:;,])\s*/', '$1', $css);
        
        return trim($css);
    }
    
    // 압축된 버전 출력
    public function renderMinified(): string {
        return sprintf(
            '<style>.tx-header{background:linear-gradient(135deg,#f5f7fa 0%,#e8ecf1 100%);
border-radius:16px;
padding:40px;
margin:30px 0;
box-shadow:0 4px 20px rgba(0,0,0,0.08);
text-align:center;}
.tx-section{margin:40px 0;
line-height:1.9;}
.tx-box{background:linear-gradient(135deg,#faf9f7 0%,#f0eeeb 100%);
border-left:4px solid #a8b5c8;
padding:20px;
margin:25px 0;
border-radius:8px;
box-shadow:0 2px 12px rgba(0,0,0,0.05);}
.tx-highlight{background:linear-gradient(120deg,#fef5e7 0%,#fdebd0 100%);
padding:3px 8px;
border-radius:4px;
font-weight:600;}
.tx-tip{background:linear-gradient(135deg,#e8f5e9 0%,#dcedc8 100%);
border-left:4px solid #81c784;
padding:18px;
margin:25px 0;
border-radius:8px;}
.tx-warning{background:linear-gradient(135deg,#fff3e0 0%,#ffe0b2 100%);
border-left:4px solid #ffb74d;
padding:18px;
margin:25px 0;
border-radius:8px;}
.tx-table{width:100%;
border-collapse:collapse;
margin:25px 0;
background:#fff;
border-radius:8px;
overflow:hidden;
box-shadow:0 2px 12px rgba(0,0,0,0.06);}
.tx-table th{background:linear-gradient(135deg,#b8c5d6 0%,#a3b1c6 100%);
color:#2c3e50;
padding:15px;
text-align:left;
font-weight:600;}
.tx-table td{padding:15px;
border-bottom:1px solid #ecf0f1;}
.tx-subtitle{color:#5d6d7e;
font-size:1.1em;
margin:30px 0 15px 0;
font-weight:600;
padding-left:12px;
border-left:3px solid #a8b5c8;}</style>',
            $this->minify($this->compile())
        );
    }
}

<?php
// themes.php - 테마 정의

$styleManager = StyleManager::getInstance();

// 라이트 테마
$styleManager->registerTheme('light', [
    'primary-color' => '#667eea',
    'secondary-color' => '#a8b5c8',
    'success-color' => '#81c784',
    'danger-color' => '#ef5350',
    'warning-color' => '#ffb74d',
    'bg-color' => '#ffffff',
    'text-color' => '#2c3e50',
    'border-color' => '#e0e0e0',
    'shadow' => '0 2px 8px rgba(0,0,0,0.1)'
]);

// 다크 테마
$styleManager->registerTheme('dark', [
    'primary-color' => '#8b9dc3',
    'secondary-color' => '#6b7c93',
    'success-color' => '#66bb6a',
    'danger-color' => '#e57373',
    'warning-color' => '#ffd54f',
    'bg-color' => '#1e1e1e',
    'text-color' => '#e0e0e0',
    'border-color' => '#3a3a3a',
    'shadow' => '0 2px 8px rgba(0,0,0,0.3)'
]);

// 컴포넌트 스타일 등록 (변수 사용)
$styleManager->register('button', '
.btn {
    background: var(--primary-color);
    color: var(--text-color);
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow);
}

.btn-secondary {
    background: var(--secondary-color);
}

.btn-success {
    background: var(--success-color);
}

.btn-danger {
    background: var(--danger-color);
}
');

$styleManager->register('card', '
.card {
    background: var(--bg-color);
    color: var(--text-color);
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow);
}

.card-header {
    border-bottom: 1px solid var(--border-color);
}
');

// 사용 예시
// 라이트 모드
$styleManager->setTheme('light');
echo $styleManager->render();

// 또는 다크 모드
$styleManager->setTheme('dark');
echo $styleManager->renderMinified();

// 파일로 저장
$styleManager->setTheme('light');
$styleManager->saveToFile('public/css/components-light.css');

$styleManager->setTheme('dark');
$styleManager->saveToFile('public/css/components-dark.css');

<?php
// core/Component.php에 추가

abstract class Component {
    // ... 기존 코드 ...
    
    // 컴포넌트 스타일 자동 등록
    protected function registerStyles(): void {
        $className = get_class($this);
        $styleManager = StyleManager::getInstance();
        
        // 이미 등록되어 있으면 스킵
        if ($styleManager->has($className)) {
            return;
        }
        
        // 컴포넌트 디렉토리에서 CSS 파일 찾기
        $reflection = new ReflectionClass($className);
        $dir = dirname($reflection->getFileName());
        $cssFile = $dir . '/' . strtolower($className) . '.css';
        
        if (file_exists($cssFile)) {
            $styleManager->registerFile($className, $cssFile);
        }
    }
    
    public function __construct(array $props = []) {
        $this->props = $props;
        $this->registerStyles(); // 자동 스타일 등록
        $this->init();
    }
}

<?php
// tests/ButtonTest.php

use PHPUnit\Framework\TestCase;

class ButtonTest extends TestCase {
    private $button;
    
    protected function setUp(): void {
        $this->button = new Button(['text' => 'Test Button']);
    }
    
    protected function tearDown(): void {
        if ($this->button) {
            $this->button->destroy();
        }
    }
    
    public function testButtonRendersCorrectly() {
        $output = $this->button->render();
        
        $this->assertStringContainsString('<button', $output);
        $this->assertStringContainsString('Test Button', $output);
        $this->assertStringContainsString('btn', $output);
    }
    
    public function testButtonVariants() {
        $variants = ['primary', 'secondary', 'success', 'danger', 'warning'];
        
        foreach ($variants as $variant) {
            $button = new Button([
                'text' => 'Test',
                'variant' => $variant
            ]);
            
            $output = $button->render();
            $this->assertStringContainsString("btn-{$variant}", $output);
            
            $button->destroy();
        }
    }
    
    public function testButtonSizes() {
        $sizes = ['sm', 'md', 'lg'];
        
        foreach ($sizes as $size) {
            $button = new Button([
                'text' => 'Test',
                'size' => $size
            ]);
            
            $output = $button->render();
            $this->assertStringContainsString("btn-{$size}", $output);
            
            $button->destroy();
        }
    }
    
    public function testDisabledButton() {
        $button = new Button([
            'text' => 'Test',
            'disabled' => true
        ]);
        
        $output = $button->render();
        $this->assertStringContainsString('disabled', $output);
        $this->assertStringContainsString('btn-disabled', $output);
    }
    
    public function testButtonWithIcon() {
        $button = new Button([
            'text' => 'Test',
            'icon' => '🚀'
        ]);
        
        $output = $button->render();
        $this->assertStringContainsString('🚀', $output);
        $this->assertStringContainsString('btn-icon', $output);
    }
    
    public function testMethodChaining() {
        $output = $this->button
            ->primary()
            ->large()
            ->setAttribute('id', 'test-btn')
            ->render();
        
        $this->assertStringContainsString('btn-primary', $output);
        $this->assertStringContainsString('btn-lg', $output);
        $this->assertStringContainsString('id="test-btn"', $output);
    }
    
    public function testInvalidVariantThrowsException() {
        $this->expectException(InvalidArgumentException::class);
        
        new Button([
            'text' => 'Test',
            'variant' => 'invalid'
        ]);
    }
    
    public function testLifecycleHooks() {
        $beforeRenderCalled = false;
        $afterRenderCalled = false;
        
        $button = new Button(['text' => 'Test']);
        
        $button->on('beforeRender', function() use (&$beforeRenderCalled) {
            $beforeRenderCalled = true;
        });
        
        $button->on('afterRender', function() use (&$afterRenderCalled) {
            $afterRenderCalled = true;
        });
        
        $button->render();
        
        $this->assertTrue($beforeRenderCalled);
        $this->assertTrue($afterRenderCalled);
    }
    
    public function testComponentDestruction() {
        $button = new Button(['text' => 'Test']);
        
        $this->assertFalse($button->isDestroyed());
        
        $button->destroy();
        
        $this->assertTrue($button->isDestroyed());
        
        $this->expectException(RuntimeException::class);
        $button->render(); // 파괴된 컴포넌트는 렌더링 불가
    }
}

<?php
// tests/ComponentIntegrationTest.php

use PHPUnit\Framework\TestCase;

class ComponentIntegrationTest extends TestCase {
    public function testCardWithButtons() {
        $card = new Card(['title' => 'Test Card']);
        
        $button1 = new Button(['text' => 'Action 1', 'variant' => 'primary']);
        $button2 = new Button(['text' => 'Action 2', 'variant' => 'secondary']);
        
        $card->setFooter(
            '<div>' . $button1 . $button2 . '</div>'
        );
        
        $output = $card->render();
        
        $this->assertStringContainsString('Test Card', $output);
        $this->assertStringContainsString('Action 1', $output);
        $this->assertStringContainsString('Action 2', $output);
        $this->assertStringContainsString('btn-primary', $output);
        $this->assertStringContainsString('btn-secondary', $output);
    }
    
    public function testNestedComponents() {
        $parentCard = new Card(['title' => 'Parent']);
        
        for ($i = 1; $i <= 3; $i++) {
            $childCard = new Card(['title' => "Child {$i}"]);
            $childCard->setBody("<p>Content {$i}</p>");
            $parentCard->addChild($childCard);
        }
        
        $output = $parentCard->render();
        
        $this->assertStringContainsString('Parent', $output);
        $this->assertStringContainsString('Child 1', $output);
        $this->assertStringContainsString('Child 2', $output);
        $this->assertStringContainsString('Child 3', $output);
    }
    
    public function testComponentRegistry() {
        $registry = ComponentRegistry::getInstance();
        $registry->register('Button');
        
        $button = $registry->create('Button', ['text' => 'Registry Test']);
        
        $this->assertInstanceOf(Button::class, $button);
        
        $output = $button->render();
        $this->assertStringContainsString('Registry Test', $output);
    }
    
    public function testStyleManager() {
        $styleManager = StyleManager::getInstance();
        
        $styleManager->registerTheme('test', [
            'primary-color' => '#ff0000'
        ]);
        
        $styleManager->register('test-component', '
            .test { color: var(--primary-color); }
        ');
        
        $styleManager->setTheme('test');
        $compiled = $styleManager->compile();
        
        $this->assertStringContainsString('#ff0000', $compiled);
        $this->assertStringNotContainsString('var(--primary-color)', $compiled);
    }
}

<?php
// core/CacheableTrait.php

trait CacheableTrait {
    private $cacheKey;
    private $cacheDuration = 3600; // 1시간
    
    public function setCacheKey(string $key): self {
        $this->cacheKey = $key;
        return $this;
    }
    
    public function setCacheDuration(int $seconds): self {
        $this->cacheDuration = $seconds;
        return $this;
    }
    
    public function render(): string {
        if (!$this->cacheKey) {
            return parent::render();
        }
        
        // 캐시에서 가져오기 시도
        $cached = $this->getFromCache($this->cacheKey);
        if ($cached !== null) {
            return $cached;
        }
        
        // 렌더링
        $output = parent::render();
        
        // 캐시에 저장
        $this->saveToCache($this->cacheKey, $output, $this->cacheDuration);
        
        return $output;
    }
    
    private function getFromCache(string $key): ?string {
        // 실제로는 Redis, Memcached 등 사용
        // 여기서는 파일 캐시 예시
        $cacheFile = sys_get_temp_dir() . '/component_cache_' . md5($key);
        
        if (!file_exists($cacheFile)) {
            return null;
        }
        
        $data = unserialize(file_get_contents($cacheFile));
        
        if ($data['expires'] < time()) {
            unlink($cacheFile);
            return null;
        }
        
        return $data['content'];
    }
    
    private function saveToCache(string $key, string $content, int $duration): void {
        $cacheFile = sys_get_temp_dir() . '/component_cache_' . md5($key);
        
        $data = [
            'content' => $content,
            'expires' => time() + $duration
        ];
        
        file_put_contents($cacheFile, serialize($data));
    }
    
    public function clearCache(): void {
        if ($this->cacheKey) {
            $cacheFile = sys_get_temp_dir() . '/component_cache_' . md5($this->cacheKey);
            if (file_exists($cacheFile)) {
                unlink($cacheFile);
            }
        }
    }
}

// 사용 예시
class ExpensiveComponent extends Component {
    use CacheableTrait;
    
    protected function doRender(): string {
        // 복잡한 계산이나 DB 쿼리
        sleep(2); // 시뮬레이션
        return '<div>Expensive content</div>';
    }
}

$component = new ExpensiveComponent();
$component
    ->setCacheKey('expensive_component_123')
    ->setCacheDuration(1800); // 30분

// 첫 번째 호출: 2초 소요
echo $component->render();

// 두 번째 호출: 즉시 반환 (캐시에서)
echo $component->render();

<?php
// core/LazyComponent.php

class LazyComponent {
    private $className;
    private $props;
    private $loaded = false;
    private $instance;
    
    public function __construct(string $className, array $props = []) {
        $this->className = $className;
        $this->props = $props;
    }
    
    private function load(): Component {
        if (!$this->loaded) {
            $this->instance = new $this->className($this->props);
            $this->loaded = true;
        }
        return $this->instance;
    }
    
    public function render(): string {
        return $this->load()->render();
    }
    
    public function __call(string $method, array $args) {
        return call_user_func_array(
            [$this->load(), $method],
            $args
        );
    }
    
    public function __toString(): string {
        return $this->render();
    }
}

// 사용 예시
$lazyCard = new LazyComponent('Card', [
    'title' => 'Lazy Loaded Card'
]);

// 이 시점에는 Card가 아직 생성되지 않음
// render()가 호출될 때 비로소 생성됨
echo $lazyCard; // 이제 생성됨

<?php
// core/ComponentRenderer.php

class ComponentRenderer {
    private $components = [];
    
    public function add(Component $component): self {
        $this->components[] = $component;
        return $this;
    }
    
    public function renderAll(): string {
        ob_start();
        
        foreach ($this->components as $component) {
            echo $component->render();
        }
        
        return ob_get_clean();
    }
    
    public function renderToFile(string $filepath): bool {
        $content = $this->renderAll();
        return file_put_contents($filepath, $content) !== false;
    }
}

// 사용 예시
$renderer = new ComponentRenderer();

for ($i = 1; $i <= 100; $i++) {
    $renderer->add(new Card(['title' => "Card {$i}"]));
}

// 한 번에 렌더링
$output = $renderer->renderAll();

// 또는 파일로 저장
$renderer->renderToFile('output.html');

<?php
class WellDesignedComponent extends Component {
    /**
     * @param array $props
     *   - title (string, required): 컴포넌트 제목
     *   - subtitle (string, optional): 부제목
     *   - variant (string, optional): 스타일 변형 (default, primary, success)
     *   - size (string, optional): 크기 (sm, md, lg)
     */
    public function __construct(array $props = []) {
        // 필수 props 확인
        if (!isset($props['title'])) {
            throw new InvalidArgumentException('title prop is required');
        }
        
        // 기본값 설정
        $props = array_merge([
            'subtitle' => '',
            'variant' => 'default',
            'size' => 'md'
        ], $props);
        
        parent::__construct($props);
    }
}

<?php
// ❌ 나쁜 예: 과도한 상속
class BaseCard extends Component {}
class UserCard extends BaseCard {}
class AdminUserCard extends UserCard {}
class SuperAdminUserCard extends AdminUserCard {} // 너무 깊음!

// ✅ 좋은 예: 구성 사용
class Card extends Component {
    private $header;
    private $body;
    private $footer;
    
    public function withHeader(Component $header): self {
        $this->header = $header;
        return $this;
    }
    
    public function withBody(Component $body): self {
        $this->body = $body;
        return $this;
    }
    
    public function withFooter(Component $footer): self {
        $this->footer = $footer;
        return $this;
    }
}

// 사용
$card = (new Card())
    ->withHeader(new CardHeader(['title' => 'User Profile']))
    ->withBody(new UserProfile(['userId' => 123]))
    ->withFooter(new CardActions(['buttons' => [...]]));

<?php
// core/ErrorBoundary.php

class ErrorBoundary extends Component {
    private $fallback;
    
    public function __construct(Component $child, $fallback = null) {
        $this->addChild($child);
        $this->fallback = $fallback ?? $this->getDefaultFallback();
    }
    
    protected function doRender(): string {
        try {
            return $this->renderChildren();
        } catch (Exception $e) {
            // 에러 로깅
            error_log("Component error: " . $e->getMessage());
            
            // 폴백 UI 렌더링
            if (is_callable($this->fallback)) {
                return call_user_func($this->fallback, $e);
            }
            
            return $this->fallback;
        }
    }
    
    private function getDefaultFallback(): string {
        return '<div class="error-boundary">
            <p>⚠️ 컴포넌트를 불러오는 중 오류가 발생했습니다.</p>
        </div>';
    }
}

// 사용 예시
$errorBoundary = new ErrorBoundary(
    new ProblematicComponent(),
    function($error) {
        return sprintf(
            '<div class="error-message">오류: %s</div>',
            htmlspecialchars($error->getMessage())
        );
    }
);

echo $errorBoundary;

<?php
class AccessibleButton extends Button {
    protected function doRender(): string {
        // ARIA 속성 자동 추가
        if ($this->getProp('disabled')) {
            $this->setAttribute('aria-disabled', 'true');
        }
        
        // 아이콘만 있는 버튼은 aria-label 필수
        if ($this->getProp('icon') && !$this->getProp('text')) {
            if (!$this->attributes['aria-label'] ?? false) {
                throw new RuntimeException(
                    'Icon-only buttons must have aria-label'
                );
            }
        }
        
        // role 속성
        $this->setAttribute('role', 'button');
        
        // 키보드 접근성
        if (!isset($this->attributes['tabindex'])) {
            $this->setAttribute('tabindex', '0');
        }
        
        return parent::doRender();
    }
}