@ebay/ui-core-react 7.3.2 → 7.3.4

package/src/ebay-tourtip/__tests__/render.spec.tsx

@@ -1,214 +0,0 @@
-import React from 'react'
-import { render, screen, within } from '@testing-library/react'
-import { composeStories } from '@storybook/react'
-import * as stories from './index.stories'
-
-const {
-    DefaultTourtip,
-    PointersWithAllDirections,
-    FooterTourtip,
-    FooterAndHeadingTourtip,
-    PointerWithCustomLocation
-} = composeStories(stories)
-
-describe('ebay-tourtip rendering', () => {
-    it('renders default story correctly', () => {
-        const { container } = render(<DefaultTourtip />)
-
-        const tourtip = container.querySelector('.tourtip')
-        expect(tourtip).toHaveClass('tourtip--expanded')
-
-        const tourtipButton = screen.getByRole('button', { name: 'Info' })
-        expect(tourtipButton).toHaveClass('btn tourtip__host btn--secondary')
-        expect(tourtipButton).toHaveAttribute('aria-expanded', 'true')
-
-        const overlay = screen.getByRole('region')
-        expect(overlay).toHaveClass('tourtip__overlay')
-        expect(overlay.querySelector('.tourtip__pointer.tourtip__pointer--bottom')).toBeInTheDocument()
-        expect(overlay.querySelector('.tourtip__mask .tourtip__cell .tourtip__content p')).toHaveTextContent('Content')
-
-        const closeButton = screen.getByRole('button', { name: 'close' })
-        expect(closeButton).toHaveClass('tourtip__close')
-        expect(closeButton).toHaveAttribute('type', 'button')
-        expect(closeButton.querySelector('svg')).toMatchSnapshot()
-    })
-
-    it('renders footer tourtip story correctly', () => {
-        const { container } = render(<FooterTourtip />)
-
-        const tourtip = container.querySelector('.tourtip')
-        expect(tourtip).toHaveClass('tourtip--expanded')
-
-        const tourtipButton = screen.getByRole('button', { name: 'Info' })
-        expect(tourtipButton).toHaveClass('btn tourtip__host btn--secondary')
-        expect(tourtipButton).toHaveAttribute('aria-expanded', 'true')
-
-        const overlay = screen.getByRole('region')
-        expect(overlay).toHaveClass('tourtip__overlay')
-        expect(overlay.querySelector('.tourtip__pointer.tourtip__pointer--bottom')).toBeInTheDocument()
-        expect(overlay.querySelector('.tourtip__mask .tourtip__cell .tourtip__content p')).toHaveTextContent('Lorem ipsum dolor sit amet consectetur adipisicing elit.')
-
-        const footer: HTMLElement = overlay.querySelector('.tourtip__footer')
-        expect(footer.querySelector('.tourtip__index')).toHaveTextContent('1 / 3')
-        expect(within(footer).getByRole('button', { name: 'Back' })).toHaveClass('fake-link')
-        expect(within(footer).getByRole('button', { name: 'Next' })).toHaveClass('btn btn--primary')
-    })
-
-    it('renders footer and heading tourtip story correctly', () => {
-        const { container } = render(<FooterAndHeadingTourtip />)
-
-        const tourtip = container.querySelector('.tourtip')
-        expect(tourtip).toHaveClass('tourtip--expanded')
-
-        const tourtipButton = screen.getByRole('button', { name: 'Info' })
-        expect(tourtipButton).toHaveClass('btn tourtip__host btn--secondary')
-        expect(tourtipButton).toHaveAttribute('aria-expanded', 'true')
-
-        const overlay = screen.getByRole('region')
-        expect(overlay).toHaveClass('tourtip__overlay')
-        expect(overlay.querySelector('.tourtip__pointer.tourtip__pointer--bottom')).toBeInTheDocument()
-        expect(overlay.querySelector('.tourtip__mask .tourtip__cell .tourtip__content p')).toHaveTextContent('Lorem ipsum dolor sit amet consectetur adipisicing elit.')
-
-        const heading = overlay.querySelector('.tourtip__heading')
-        expect(heading).toHaveTextContent('Title')
-
-        const footer: HTMLElement = overlay.querySelector('.tourtip__footer')
-        expect(footer.querySelector('.tourtip__index')).toHaveTextContent('1 / 3')
-        expect(within(footer).getByRole('button', { name: 'Back' })).toHaveClass('fake-link')
-        expect(within(footer).getByRole('button', { name: 'Next' })).toHaveClass('btn btn--primary')
-    })
-
-    it('renders pointer with custom location story correctly', () => {
-        const { container } = render(<PointerWithCustomLocation />)
-
-        const tourtip = container.querySelector('.tourtip')
-        expect(tourtip).toHaveClass('tourtip--expanded')
-
-        const tourtipButton = screen.getByRole('link', { name: 'View options' })
-        expect(tourtipButton).toHaveClass('tourtip__host')
-        expect(tourtipButton).toHaveAttribute('aria-expanded', 'true')
-        expect(tourtipButton).toHaveAttribute('href', 'https://www.ebay.com')
-
-        const overlay = screen.getByRole('region')
-        expect(overlay).toHaveClass('tourtip__overlay')
-        expect(overlay).toHaveStyle({ top: '40px', left: '-16px' })
-        expect(overlay.querySelector('.tourtip__pointer.tourtip__pointer--top-left')).toBeInTheDocument()
-        expect(overlay.querySelector('.tourtip__mask .tourtip__cell .tourtip__content p')).toHaveTextContent('Use Access Key \'S\' to display settings.')
-    })
-
-    it('renders pointer direction story correctly', () => {
-        const { container } = render(<PointersWithAllDirections />)
-
-        const [
-            tourtipTop,
-            tourtipTopLeft,
-            tourtipTopRight,
-            tourtipRight,
-            tourtipRightBottom,
-            tourtipRightTop,
-            tourtipBottom,
-            tourtipBottomLeft,
-            tourtipBottomRight,
-            tourtipLeft,
-            tourtipLeftBottom,
-            tourtipLeftTop
-        ] = container.querySelectorAll('.tourtip')
-        expect(tourtipTop).toHaveClass('tourtip--expanded')
-
-        const tourtipButtonTop = within(tourtipTop as HTMLElement).getByRole('link', { name: 'top' })
-        expect(tourtipButtonTop).toHaveClass('tourtip__host')
-        expect(tourtipButtonTop).toHaveAttribute('aria-expanded', 'true')
-        expect(tourtipButtonTop).toHaveAttribute('href', 'https://www.ebay.com')
-
-        const overlayTop = tourtipTop.querySelector('.tourtip__overlay')
-        expect(overlayTop.querySelector('.tourtip__pointer')).toHaveClass('tourtip__pointer--top')
-
-        const tourtipButtonTopLeft = within(tourtipTopLeft as HTMLElement).getByRole('link', { name: 'top-left' })
-        expect(tourtipButtonTopLeft).toHaveClass('tourtip__host')
-        expect(tourtipButtonTopLeft).toHaveAttribute('aria-expanded', 'true')
-        expect(tourtipButtonTopLeft).toHaveAttribute('href', 'https://www.ebay.com')
-
-        const overlayTopLeft = tourtipTopLeft.querySelector('.tourtip__overlay')
-        expect(overlayTopLeft.querySelector('.tourtip__pointer')).toHaveClass('tourtip__pointer--top-left')
-
-        const tourtipButtonTopRight = within(tourtipTopRight as HTMLElement).getByRole('link', { name: 'top-right' })
-        expect(tourtipButtonTopRight).toHaveClass('tourtip__host')
-        expect(tourtipButtonTopRight).toHaveAttribute('aria-expanded', 'true')
-        expect(tourtipButtonTopRight).toHaveAttribute('href', 'https://www.ebay.com')
-
-        const overlayTopRight = tourtipTopRight.querySelector('.tourtip__overlay')
-        expect(overlayTopRight.querySelector('.tourtip__pointer')).toHaveClass('tourtip__pointer--top-right')
-
-        const tourtipButtonRight = within(tourtipRight as HTMLElement).getByRole('link', { name: 'right' })
-        expect(tourtipButtonRight).toHaveClass('tourtip__host')
-        expect(tourtipButtonRight).toHaveAttribute('aria-expanded', 'true')
-        expect(tourtipButtonRight).toHaveAttribute('href', 'https://www.ebay.com')
-
-        const overlayRight = tourtipRight.querySelector('.tourtip__overlay')
-        expect(overlayRight.querySelector('.tourtip__pointer')).toHaveClass('tourtip__pointer--right')
-
-        const tourtipButtonRightBottom = within(tourtipRightBottom as HTMLElement).getByRole('link', { name: 'right-bottom' })
-        expect(tourtipButtonRightBottom).toHaveClass('tourtip__host')
-        expect(tourtipButtonRightBottom).toHaveAttribute('aria-expanded', 'true')
-        expect(tourtipButtonRightBottom).toHaveAttribute('href', 'https://www.ebay.com')
-
-        const overlayRightBottom = tourtipRightBottom.querySelector('.tourtip__overlay')
-        expect(overlayRightBottom.querySelector('.tourtip__pointer')).toHaveClass('tourtip__pointer--right-bottom')
-
-        const tourtipButtonRightTop = within(tourtipRightTop as HTMLElement).getByRole('link', { name: 'right-top' })
-        expect(tourtipButtonRightTop).toHaveClass('tourtip__host')
-        expect(tourtipButtonRightTop).toHaveAttribute('aria-expanded', 'true')
-        expect(tourtipButtonRightTop).toHaveAttribute('href', 'https://www.ebay.com')
-
-        const overlayRightTop = tourtipRightTop.querySelector('.tourtip__overlay')
-        expect(overlayRightTop.querySelector('.tourtip__pointer')).toHaveClass('tourtip__pointer--right-top')
-
-        const tourtipButtonBottom = within(tourtipBottom as HTMLElement).getByRole('link', { name: 'bottom' })
-        expect(tourtipButtonBottom).toHaveClass('tourtip__host')
-        expect(tourtipButtonBottom).toHaveAttribute('aria-expanded', 'true')
-        expect(tourtipButtonBottom).toHaveAttribute('href', 'https://www.ebay.com')
-
-        const overlayBottom = tourtipBottom.querySelector('.tourtip__overlay')
-        expect(overlayBottom.querySelector('.tourtip__pointer')).toHaveClass('tourtip__pointer--bottom')
-
-        const tourtipButtonBottomLeft = within(tourtipBottomLeft as HTMLElement).getByRole('link', { name: 'bottom-left' })
-        expect(tourtipButtonBottomLeft).toHaveClass('tourtip__host')
-        expect(tourtipButtonBottomLeft).toHaveAttribute('aria-expanded', 'true')
-        expect(tourtipButtonBottomLeft).toHaveAttribute('href', 'https://www.ebay.com')
-
-        const overlayBottomLeft = tourtipBottomLeft.querySelector('.tourtip__overlay')
-        expect(overlayBottomLeft.querySelector('.tourtip__pointer')).toHaveClass('tourtip__pointer--bottom-left')
-
-        const tourtipButtonBottomRight = within(tourtipBottomRight as HTMLElement).getByRole('link', { name: 'bottom-right' })
-        expect(tourtipButtonBottomRight).toHaveClass('tourtip__host')
-        expect(tourtipButtonBottomRight).toHaveAttribute('aria-expanded', 'true')
-        expect(tourtipButtonBottomRight).toHaveAttribute('href', 'https://www.ebay.com')
-
-        const overlayBottomRight = tourtipBottomRight.querySelector('.tourtip__overlay')
-        expect(overlayBottomRight.querySelector('.tourtip__pointer')).toHaveClass('tourtip__pointer--bottom-right')
-
-        const tourtipButtonLeft = within(tourtipLeft as HTMLElement).getByRole('link', { name: 'left' })
-        expect(tourtipButtonLeft).toHaveClass('tourtip__host')
-        expect(tourtipButtonLeft).toHaveAttribute('aria-expanded', 'true')
-        expect(tourtipButtonLeft).toHaveAttribute('href', 'https://www.ebay.com')
-
-        const overlayLeft = tourtipLeft.querySelector('.tourtip__overlay')
-        expect(overlayLeft.querySelector('.tourtip__pointer')).toHaveClass('tourtip__pointer--left')
-
-        const tourtipButtonLeftBottom = within(tourtipLeftBottom as HTMLElement).getByRole('link', { name: 'left-bottom' })
-        expect(tourtipButtonLeftBottom).toHaveClass('tourtip__host')
-        expect(tourtipButtonLeftBottom).toHaveAttribute('aria-expanded', 'true')
-        expect(tourtipButtonLeftBottom).toHaveAttribute('href', 'https://www.ebay.com')
-
-        const overlayLeftBottom = tourtipLeftBottom.querySelector('.tourtip__overlay')
-        expect(overlayLeftBottom.querySelector('.tourtip__pointer')).toHaveClass('tourtip__pointer--left-bottom')
-
-        const tourtipButtonLeftTop = within(tourtipLeftTop as HTMLElement).getByRole('link', { name: 'left-top' })
-        expect(tourtipButtonLeftTop).toHaveClass('tourtip__host')
-        expect(tourtipButtonLeftTop).toHaveAttribute('aria-expanded', 'true')
-        expect(tourtipButtonLeftTop).toHaveAttribute('href', 'https://www.ebay.com')
-
-        const overlayLeftTop = tourtipLeftTop.querySelector('.tourtip__overlay')
-        expect(overlayLeftTop.querySelector('.tourtip__pointer')).toHaveClass('tourtip__pointer--left-top')
-    })
-})

package/src/ebay-tourtip/ebay-tourtip-content.tsx

@@ -1,11 +0,0 @@
-import { FC } from 'react'
-import { TooltipContentProps } from '../common/tooltip-utils/tooltip-content'
-
-/**
- * This Component is used only for finding it as a child of EbayTooltip
- * and pass the properties to TourtipContent
-*/
-
-const EbayTourtipContent: FC<TooltipContentProps> = () => null
-
-export default EbayTourtipContent

package/src/ebay-tourtip/ebay-tourtip-footer.tsx

@@ -1,19 +0,0 @@
-import React, { FC, ComponentProps } from 'react'
-
-type TourtipFooterProps = ComponentProps<'div'> & {
-    index?: string;
-}
-const EbayTourtipFooter: FC<TourtipFooterProps> = ({ index, children }) =>
-    (
-        <>
-            {index !== undefined && (
-                <span className="tourtip__index">
-                    {index}
-                </span>
-            )}
-            {children}
-        </>
-    )
-
-
-export default EbayTourtipFooter

package/src/ebay-tourtip/ebay-tourtip-heading.tsx

@@ -1,23 +0,0 @@
-import React, { FC, HTMLProps } from 'react'
-import classNames from 'classnames'
-
-type Props = HTMLProps<HTMLHeadingElement> & {
-    as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
-    className?: string;
-}
-
-const EbayTourtipHeading: FC<Props> = ({
-    as,
-    children,
-    className,
-    ...props
-}) => {
-    const HeadingTag = as || 'h2'
-    return (
-        <HeadingTag {...props} className={classNames(`tourtip__heading`, className)}>
-            {children}
-        </HeadingTag>
-    )
-}
-
-export default EbayTourtipHeading

package/src/ebay-tourtip/ebay-tourtip-host.tsx

@@ -1,11 +0,0 @@
-import { FC } from 'react'
-import { TooltipHostProps } from '../common/tooltip-utils/tooltip-host'
-
-/**
- * This Component is used only for finding it as a child of EbayTooltip
- * and pass the properties to TourtipHost
-*/
-
-const EbayTourtipHost: FC<TooltipHostProps> = () => null
-
-export default EbayTourtipHost

package/src/ebay-tourtip/ebay-tourtip.tsx

@@ -1,89 +0,0 @@
-import React, { CSSProperties, FC, useRef } from 'react'
-import { findComponent } from '../common/component-utils'
-import {
-    Tooltip,
-    TooltipHost,
-    TooltipContent,
-    TooltipProps,
-    PointerDirection,
-    useTooltip,
-    TooltipFooter
-} from '../common/tooltip-utils'
-import EbayTourtipContent from './ebay-tourtip-content'
-import EbayTourtipHost from './ebay-tourtip-host'
-import EbayTourtipFooter from './ebay-tourtip-footer'
-import EbayTourtipHeading from './ebay-tourtip-heading'
-
-type TourtipProps = Omit<TooltipProps, 'ref'> & {
-    a11yCloseText: string;
-    pointer?: PointerDirection;
-    onExpand?: () => void;
-    onCollapse?: () => void;
-    overlayStyle?: CSSProperties;
-    'aria-label'?: string;
-    className?: string;
-}
-
-const EbayTourtip:FC<TourtipProps> = ({
-    a11yCloseText,
-    'aria-label': ariaLabel,
-    className,
-    children,
-    onCollapse,
-    onExpand,
-    overlayStyle,
-    pointer,
-    ...rest
-}) => {
-    const hostRef = useRef()
-    const {
-        isExpanded,
-        collapseTooltip
-    } = useTooltip({ onExpand, onCollapse, initialExpanded: true, hostRef })
-    const containerRef = useRef()
-    const content = findComponent(children, EbayTourtipContent)
-    if (!content) {
-        throw new Error(`EbayTourtip: Please use a EbayTourtipContent that defines the content of the tourtip`)
-    }
-    const { children: contentChildren, contentProps } = content.props
-    const host = findComponent(children, EbayTourtipHost)
-    if (!host) {
-        throw new Error(`EbayTourtip: Please use a EbayTourtipHost that defines the host of the tourtip`)
-    }
-    const heading = findComponent(children, EbayTourtipHeading)
-    const footer = findComponent(children, EbayTourtipFooter)
-
-    return (
-        <Tooltip
-            {...rest}
-            className={className}
-            type="tourtip"
-            isExpanded={isExpanded}
-            ref={containerRef}
-        >
-            <TooltipHost
-                {...host.props}
-                forwardedRef={hostRef}
-                aria-label={ariaLabel}
-                aria-expanded={isExpanded} />
-            <TooltipContent
-                {...contentProps}
-                a11yCloseText={a11yCloseText}
-                onClose={collapseTooltip}
-                pointer={pointer}
-                showCloseButton
-                style={overlayStyle}
-                type="tourtip"
-            >
-                {heading}
-                {contentChildren}
-                {footer && (
-                    <TooltipFooter type="tourtip">
-                        {footer}
-                    </TooltipFooter>
-                )}
-            </TooltipContent>
-        </Tooltip>
-    )
-}
-export default EbayTourtip

package/src/ebay-tourtip/index.ts

@@ -1,6 +0,0 @@
-export { default as EbayTourtip } from './ebay-tourtip'
-export { default as EbayTourtipContent } from './ebay-tourtip-content'
-export { default as EbayTourtipHost } from './ebay-tourtip-host'
-export { default as EbayTourtipHeading } from './ebay-tourtip-heading'
-export { default as EbayTourtipFooter } from './ebay-tourtip-footer'
-export { type PointerDirection, Tooltip } from '../common/tooltip-utils'

package/src/ebay-video/__tests__/index.spec.tsx

@@ -1,39 +0,0 @@
-import React from 'react'
-import { render, screen } from '@testing-library/react'
-import { EbayVideo, EbayVideoSource } from '../index'
-
-describe('<EbayVideo>', () => {
-    beforeEach(() => render(
-        <EbayVideo
-            thumbnail="https://ir.ebaystatic.com/cr/v/c1/ebayui/video/v1/iphone-thumbnail.jpg"
-            width={500}
-            height={300}
-            a11yPlayText="Play"
-            a11yLoadText="Loading"
-            errorText="Error loading"
-            reportText="Report"
-        >
-            <EbayVideoSource
-                src="https://ir.ebaystatic.com/cr/v/c1/ebayui/video/v1/video.mp4"
-            />
-        </EbayVideo>
-    ))
-
-    it('shows video player with poster', () => {
-        const video = document.getElementsByTagName('video')[0]
-        expect(video).not.toBeNull()
-        expect(video.poster).toBe('https://ir.ebaystatic.com/cr/v/c1/ebayui/video/v1/iphone-thumbnail.jpg')
-    })
-
-    it('shows error message', () => {
-        expect(screen.getByText('Error loading')).toBeInTheDocument()
-    })
-
-    it('shows play button', () => {
-        expect(screen.getByLabelText('Play')).toBeInTheDocument()
-    })
-
-    it('shows loading spinner', () => {
-        expect(screen.getByLabelText('Loading')).toBeInTheDocument()
-    })
-})

package/src/ebay-video/__tests__/index.stories.tsx

@@ -1,147 +0,0 @@
-import React, { SyntheticEvent, useState } from 'react'
-import { Meta } from '@storybook/react'
-import 'shaka-player/dist/controls.css'
-
-import { action } from '@storybook/addon-actions'
-import { EbayButton } from '../../ebay-button'
-import { EbayVideo, EbayVideoProps, EbayVideoSource } from '../index'
-import { PlayEventProps, VolumeChangeProps } from '../video'
-
-export default {
-    component: EbayVideo,
-    title: 'media/ebay-video'
-} as Meta
-
-const defaultProps: EbayVideoProps = {
-    a11yLoadText: 'Loading',
-    a11yPlayText: 'Click to play',
-    errorText: 'An error has occurred',
-    width: 600,
-    height: 400,
-    onPlay: (e: SyntheticEvent<HTMLVideoElement>, props: PlayEventProps) =>
-        action('onPlay')(e, props),
-    onVolumeChange: (e: SyntheticEvent<HTMLVideoElement>, props: VolumeChangeProps) =>
-        action('onVolumeChange')(e, props),
-    onLoadError: (err: Error) => action('onLoadError')(err),
-    onReport: (e) => action('onReport')(e)
-}
-
-export const Default = () => (
-    <EbayVideo
-        {...defaultProps}
-        thumbnail="https://ir.ebaystatic.com/cr/v/c1/ebayui/video/v1/iphone-thumbnail.jpg"
-        volumeSlider
-    >
-        <EbayVideoSource
-            src="https://ir.ebaystatic.com/cr/v/c1/ebayui/video/v1/playlist.mpd"
-            type="dash"
-        />
-    </EbayVideo>
-)
-
-export const SingleVideo = () => (
-    <EbayVideo {...defaultProps}>
-        <EbayVideoSource src="https://ir.ebaystatic.com/cr/v/c1/ebayui/video/v1/video.mp4" />
-    </EbayVideo>
-)
-
-export const MultipleVideos = () => (
-    <EbayVideo
-        {...defaultProps}
-        thumbnail="https://ir.ebaystatic.com/cr/v/c1/ebayui/video/v1/iphone-thumbnail.jpg"
-    >
-        <EbayVideoSource
-            src="https://bitdash-a.akamaihd.net/content/MI201109210084_1/m3u8s/f08e80da-bf1d-4e3d-8899-f0f6155f6efa.m3u8"
-            type="hls"
-        />
-        <EbayVideoSource
-            src="https://bitmovin-a.akamaihd.net/content/MI201109210084_1/mpds/f08e80da-bf1d-4e3d-8899-f0f6155f6efa.mpd"
-            type="dash"
-        />
-    </EbayVideo>
-)
-
-export const Fail = () => (
-    <EbayVideo {...defaultProps}>
-        <EbayVideoSource src="wrong" />
-    </EbayVideo>
-)
-
-export const FailInsidePlaylist = () => (
-    <EbayVideo {...defaultProps}>
-        <EbayVideoSource
-            src="http://videoservices.vip.qa.ebay.com/videos/v1/b645f08316c0a4e114537903ffffffad/playlist.mpd"
-            type="dash"
-        />
-    </EbayVideo>
-)
-
-export const Captions = () => (
-    <EbayVideo {...defaultProps}>
-        <EbayVideoSource src="https://storage.googleapis.com/shaka-demo-assets/angel-one/dash.mpd" />
-    </EbayVideo>
-)
-
-export const ReportText = () => (
-    <EbayVideo {...defaultProps} reportText="Report" onReport={action('report')}>
-        <EbayVideoSource
-            src="https://ir.ebaystatic.com/cr/v/c1/ebayui/video/v1/playlist.mpd"
-            type="dash"
-        />
-    </EbayVideo>
-)
-
-export const NoReportButton = () => (
-    <EbayVideo {...defaultProps} hideReportButton>
-        <EbayVideoSource
-            src="https://ir.ebaystatic.com/cr/v/c1/ebayui/video/v1/playlist.mpd"
-            type="dash"
-        />
-    </EbayVideo>
-)
-
-export const MutedAutoplay = () => (
-    <EbayVideo {...defaultProps} muted autoPlay>
-        <EbayVideoSource
-            src="https://ir.ebaystatic.com/cr/v/c1/ebayui/video/v1/playlist.mpd"
-            type="dash"
-        />
-    </EbayVideo>
-)
-
-export const FlexibleContainer = () => (
-    <div style={{ width: '100%' }}>
-        <EbayVideo {...defaultProps}>
-            <EbayVideoSource
-                src="https://ir.ebaystatic.com/cr/v/c1/ebayui/video/v1/playlist.mpd"
-                type="dash"
-            />
-        </EbayVideo>
-    </div>
-)
-
-export const Controlled = () => {
-    const [playing, setPlaying] = useState(undefined)
-    const [muted, setMuted] = useState(false)
-
-    return (
-        <>
-            <EbayButton onClick={() => setPlaying(!playing)}>{playing ? 'Pause' : 'Play'}</EbayButton>{' '}
-      &nbsp;
-            <EbayButton onClick={() => setMuted(!muted)}>{muted ? 'Unmute' : 'Mute'}</EbayButton>
-            <EbayVideo
-                style={{ marginTop: '1em' }}
-                action={playing ? 'play' : playing === false ? 'pause' : undefined}
-                muted={muted}
-                onPlay={action('playing')}
-                onVolumeChange={action('volume changed')}
-                {...defaultProps}
-            >
-                <EbayVideoSource
-                    src="https://ir.ebaystatic.com/cr/v/c1/ebayui/video/v1/playlist.mpd"
-                    type="dash"
-                />
-            </EbayVideo>
-        </>
-    )
-}

package/src/ebay-video/__tests__/render.spec.tsx

@@ -1,55 +0,0 @@
-import React from 'react'
-import { render } from '@testing-library/react'
-import { composeStory } from '@storybook/react'
-import Meta, { Default } from './index.stories'
-
-const DefaultStory = composeStory(Default, Meta)
-
-describe('ebay-video rendering', () => {
-    it('renders default story correctly', () => {
-        const { container } = render(<DefaultStory />)
-        const player = container.querySelector('.video-player')
-        expect(player).toHaveClass('video-player--poster')
-        expect(player).toHaveAttribute('style', 'width: 600px; height: 400px;')
-
-        const videoContainer = player.querySelector('.video-player__container')
-        expect(videoContainer).toHaveClass('shaka-video-container')
-        expect(videoContainer).toHaveAttribute('data-shaka-player-container', '')
-        expect(videoContainer).toHaveAttribute('shaka-controls', 'true')
-
-        const videoElement = videoContainer.querySelector('.shaka-video')
-        expect(videoElement).toBeInTheDocument()
-
-        const overlay = player.querySelector('.video-player__overlay')
-        expect(overlay).toHaveClass('video-player__overlay')
-
-        const controlsContainer = videoContainer.querySelector('.shaka-controls-container')
-        expect(controlsContainer).toBeInTheDocument()
-        const playButton = controlsContainer.querySelector('.shaka-play-button')
-        expect(playButton).toHaveAttribute('aria-label', 'Play')
-        expect(playButton).toHaveAttribute('icon', 'play')
-        expect(playButton).toHaveClass('shaka-play-button shaka-no-propagation')
-        const spinnerContainer = videoContainer.querySelector('.shaka-spinner-container')
-        expect(spinnerContainer).toHaveClass('shaka-hidden')
-
-        const bottomControls = player.querySelector('.shaka-bottom-controls')
-        expect(bottomControls).toHaveClass('shaka-no-propagation')
-
-        const errorOverlay = player.querySelector('.video-player__overlay--hidden')
-        expect(errorOverlay).toBeInTheDocument()
-        expect(errorOverlay.textContent).toContain('An error has occurred')
-
-        const scrimContainer = player.querySelector('.shaka-scrim-container')
-        expect(scrimContainer).toBeInTheDocument()
-
-        const serverSideAdContainer = player.querySelector('.shaka-server-side-ad-container')
-        expect(serverSideAdContainer).toBeInTheDocument()
-        const clientSideAdContainer = player.querySelector('.shaka-client-side-ad-container')
-        expect(clientSideAdContainer).toHaveClass('shaka-hidden')
-
-        const video = player.querySelector('video')
-        expect(video).toHaveClass('shaka-video')
-        expect(video).toHaveAttribute('poster', 'https://ir.ebaystatic.com/cr/v/c1/ebayui/video/v1/iphone-thumbnail.jpg')
-        expect(video).toHaveAttribute('style', 'width: 600px; height: 400px;')
-    })
-})

package/src/ebay-video/const.ts

@@ -1,16 +0,0 @@
-export const ERROR_ANOTHER_LOAD = 7000
-export const ERROR_NO_PLAYER = 11
-export const defaultVideoConfig = {
-    addBigPlayButton: false,
-    addSeekBar: true,
-    controlPanelElements: [
-        'play_pause',
-        'time_and_duration',
-        'spacer',
-        'mute',
-        'report',
-        'captions',
-        // 'quality', // uncomment this to show a gear icon for video quality control
-        'fullscreen'
-    ]
-}