التواصل بين الأب والابن في Livewire v4

// عرض المكون الأب
<livewire:child-component 
    :user="$user"
    :posts="$posts"
    title="لوحة التحكم"
/>

// المكون الابن
class ChildComponent extends Component
{
    public User $user;
    public Collection $posts;
    public string $title;
    
    public function mount(User $user, Collection $posts, string $title): void
    {
        $this->user = $user;
        $this->posts = $posts;
        $this->title = $title;
    }
}

// المكون الابن - إرسال حدث للأب
class ItemSelector extends Component
{
    public function selectItem(int $id): void
    {
        $this->dispatch('item-selected', id: $id, name: 'منتج');
    }
}

// المكون الأب - الاستماع للحدث
class ParentComponent extends Component
{
    public ?int $selectedItemId = null;
    
    #[On('item-selected')]
    public function handleSelection(int $id, string $name): void
    {
        $this->selectedItemId = $id;
        session()->flash('message', "تم اختيار: {$name}");
    }
}

// الأب يستخدم wire:model
<livewire:color-picker wire:model="selectedColor" />
<livewire:date-picker wire:model.live="startDate" />

// المكون الابن (ColorPicker)
class ColorPicker extends Component
{
    #[Modelable]
    public string $value = '#000000';
    
    public function render()
    {
        return view('livewire.color-picker');
    }
}