import { Meta } from '@storybook/addon-docs/blocks'

<Meta title='@dxtmisha/en/figma-ref/Composables/useFigmaUiFrames - List of top-level frames'/>

# `useFigmaUiFrames`

Composable for managing and observing the list of top-level frames in the Figma UI.

**Returns:**
An object with the following properties:
- `frames: ComputedRef<UiFigmaFramesList>` — A reactive list of top-level frames. Automatically updates when data is received.
- `loading: ComputedRef<boolean>` — A reactive flag indicating whether the frames are currently being fetched from the Figma plugin.

```typescript
import { useFigmaUiFrames } from '@dxtmisha/figma-ref'

const { frames, loading } = useFigmaUiFrames()

// Use loading to show a progress indicator
if (loading.value) {
  console.log('Fetching frames...')
}

// Use frames to render the list
console.log('Frames:', frames.value)
```
