Skip to main content

View

Use _view attribute to show how to render different views from a single tsx.

Source​

view.tsx
import { Shape } from '@dinghy/base-components'

export default () => (
  <Shape _title='Multiple Views Example'>
    <Shape _title='Default View'>
      <Shape>Default Overview Shape 1</Shape>
      <Shape>Default Overview Shape 2</Shape>
    </Shape>
    <Shape
      _view={['overview', 'all-view']}
      _title='All View'
    >
      <Shape>All View Shape 1</Shape>
      <Shape>All View Shape 2</Shape>
    </Shape>
    <Shape
      _view='sub-view-only'
      _title='Sub View Only'
    >
      <Shape>Sub View Only Shape 1</Shape>
      <Shape>Sub View Only Shape 2</Shape>
    </Shape>
  </Shape>
)

Rendered​

Default Overview​

Overview

All View​

All View

Sub View​

Sub View