# Component State (SVELTE)

## Context Components

Context components expose state and functions to child components. In this example, `Avatar.Fallback` renders based on
`loaded` state.

> **Good to know (RSC)**: Due to the usage of render prop, you might need to add the `'use client'` directive at the top
> of your file when using React Server Components.

<ExampleCode id="context" component="avatar" />

## Provider Components

Provider components can help coordinate state and behavior between multiple components, enabling interactions that
aren't possible with `Context` components alone. They are used alongside component hooks.

> When using the `RootProvider` component, you don't need to use the `Root` component.

<ExampleCode id="root-provider" component="accordion" />