docs(730): update video player component scenarios storybook

site/pages/components/video-player.tsx

@@ -53,8 +53,7 @@ const VideoPlayerComponent = (layoutProps: LayoutProps) => (
       introduced: 'v5.0.0',
       codeUrl:
         'https://github.com/newscorp-ghfb/newskit/tree/main/src/video-player',
-      storybookId:
-        'components-video-player-default--story-default-video-player',
+      storybookId: 'components-video-player--story-video-player-default',
     }}
   >
     <ComponentPageCell>
@@ -168,7 +167,7 @@ const VideoPlayerComponent = (layoutProps: LayoutProps) => (
             that can be assembled using the various available subcomponents of
             the Brightcove player.{' '}
             <Link
-              href="https://storybook.newskit.co.uk/?path=/docs/components-video-player-default--story-default-video-player"
+              href="https://storybook.newskit.co.uk/?path=/docs/components-video-player--story-video-player-default"
               target="_blank"
             >
               View the example in Storybook
@@ -195,7 +194,7 @@ const VideoPlayerComponent = (layoutProps: LayoutProps) => (
             </Link>{' '}
             to give context to the video being played.{' '}
             <Link
-              href="https://storybook.newskit.co.uk/?path=/docs/components-video-player-default--story-default-video-player"
+              href="https://storybook.newskit.co.uk/?path=/docs/components-video-player--story-video-player-default"
               target="_blank"
             >
               View the examples in Storybook

src/card-composable/__tests__/__stories/card-composable.stories.tsx

@@ -30,7 +30,7 @@ import {
 import {LinkInline} from '../../../link';
 import {Tag} from '../../../tag';
 import {VideoPlayer} from '../../../video-player';
-import {DEFATULT_VIDEO_PLAYER_CONFIG} from '../../../video-player/__tests__/config';
+import {DEFAULT_VIDEO_PLAYER_CONFIG} from '../../../video-player/__tests__/config';
 
 const H = ({overrides, ...props}: Omit<HeadlineProps, 'children'>) => (
   <Headline
@@ -359,7 +359,7 @@ export const StoryVariations = () => (
           <P />
         </CardContent>
         <CardMedia>
-          <VideoPlayer config={DEFATULT_VIDEO_PLAYER_CONFIG} />
+          <VideoPlayer config={DEFAULT_VIDEO_PLAYER_CONFIG} />
         </CardMedia>
         <CardActions>
           <Tag href={href}>Tag</Tag>

src/test/storybook-comps.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import {sanitize} from 'isomorphic-dompurify';
 import {
   DocsStoryProps,
   DocsContextProps,
@@ -176,7 +177,7 @@ export const StoryDocsHeader = ({context}: {context: DocsContextProps}) => {
           typographyPreset="utilityBody030"
           stylePreset="inkBase"
         >
-          {description}
+          <span dangerouslySetInnerHTML={{__html: sanitize(description)}} />
         </TextBlock>
       )}
       <Divider />

src/theme/__tests__/__snapshots__/theme.test.ts.snap

@@ -3391,7 +3391,7 @@ Object {
   "videoPlayer": Object {
     "controlBar": Object {
       "iconToggle": Object {
-        "stylePreset": "inkInverse",
+        "stylePreset": "inkLight010",
       },
       "maxHeight": Object {
         "md": "sizing080",
@@ -3405,7 +3405,7 @@ Object {
         "divider": Object {
           "spaceInline": "space010",
         },
-        "stylePreset": "inkInverse",
+        "stylePreset": "inkLight010",
         "typographyPreset": "utilityMeta010",
       },
       "typographyPreset": Object {

src/video-player/__tests__/config.ts

@@ -6,7 +6,7 @@ export const PLAYLISTS_VIDEO_PLAYER_CONFIG = {
   controls: true,
 };
 
-export const DEFATULT_VIDEO_PLAYER_CONFIG = {
+export const DEFAULT_VIDEO_PLAYER_CONFIG = {
   'data-video-id': '5290445795001',
   'data-account': '1752604059001',
   'data-player': 'default',