import type { Meta, StoryObj } from '@storybook/react'

import Heading from '@/components/atoms/Heading'
import { IVideo } from './Video.interface'
import React from 'react'
import Spacer from '@/components/atoms/Spacer'
import Video from './Video.component'

// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
export default {
  title: 'Components/Video',
  component: Video,
  argTypes: {}
} as Meta

export const Default: StoryObj<IVideo> = {
  render: args => (
    <div>
      <Video {...args} />
      <Spacer customHeight={"3rem"} />
      <Heading tag="h2" size="h2">
        Scroll to see autoplay in action
      </Heading>
      <Spacer customHeight={"38rem"} />
    </div>
  ),
  args: {
    autoplay: true,
    controls: true,
    loop: true,
    muted: true,
    playsInline: true,
    poster:
      'https://miew.pt/wp-content/uploads/2021/02/featured-thumb-bmcar-2x-scaled.jpg',
    src: 'https://miew.pt/wp-content/uploads/2021/01/miew_emotion_wide_v5.mp4'
  }
}