# Container/State

> Props: container-state.props.txt

## Examples


### Empty Kind

```tsx
{
  args: {
    kind: 'empty',
    description: '검색 결과가 없습니다.\n 필터 또는 검색어를 변경해주세요.'
  }
}
```

### Empty Kind With Action

```tsx
{
  args: {
    kind: 'empty',
    description: '검색 결과가 없습니다.\n 필터 또는 검색어를 변경해주세요.',
    action: <Button kind='primary'>Label</Button>
  }
}
```

### Loading

```tsx
{
  args: {
    kind: 'loading',
    size: 32,
    description: 'loading...'
  }
}
```

### Warning Kind

```tsx
{
  args: {
    kind: 'warning',
    size: 40,
    title: '일시적인 서비스 장애 안내',
    description: '이용에 불편을 드려 죄송합니다.\n 잠시후 다시 시도해주세요.'
  },
  parameters: {
    layout: 'fullscreen'
  },
  render: args => <div style={{
    height: '100vh',
    display: 'grid',
    alignItems: 'center'
  }}>
      <State {...args} />
    </div>
}
```