@navinc/base-react-components/src/wave-page-container.story.js

Nav's Pattern Library

import React from 'react'
import styled from 'styled-components'
import WavePageContainer from './wave-page-container'

export default {
  title: 'Layout/WavePageContainer',
  component: WavePageContainer,
  argTypes: {
    variation: {
      control: 'select',
      options: ['bottom', 'top', 'topDynamic', 'topLight', 'topLightDynamic', 'bottomTan', 'topTan', 'topTanDynamic'],
    },
    height: {
      control: { type: 'number' },
    },
  },
}

const StyledFill = styled.div`
  height: 100vh;
`

export const Basic = (args) => (
  <WavePageContainer {...args}>
    <StyledFill />
  </WavePageContainer>
)