scrupt graphics-svelte-components from docs

src/components/Block/stories/docs/component.md

@@ -6,7 +6,7 @@ Blocks are stacked vertically within the well created by the [`Article`](./?path
 
 ```svelte
 <script>
-  import { Block } from '@reuters-graphics/graphics-svelte-components';
+  import { Block } from '@reuters-graphics/graphics-components';
 </script>
 
 

src/components/DatawrapperChart/stories/docs/component.md

@@ -2,7 +2,7 @@ Easily add a responsive Datawrapper embed on your page.
 
 ```svelte
 <script>
-  import { DatawrapperChart } from '@reuters-graphics/graphics-svelte-components';
+  import { DatawrapperChart } from '@reuters-graphics/graphics-components';
 </script>
 
 <DatawrapperChart

src/components/EmbedPreviewerLink/stories/docs/component.md

@@ -2,7 +2,7 @@ An embed tool for development in graphics kit.
 
 ```svelte
 <script>
-  import { EmbedPreviewerLink } from '@reuters-graphics/graphics-svelte-components';
+  import { EmbedPreviewerLink } from '@reuters-graphics/graphics-components';
 
   import { dev } from '$app/env';
 </script>

src/components/FeaturePhoto/stories/docs/component.md

@@ -2,7 +2,7 @@ A full-width photo inside the text well.
 
 ```svelte
 <script>
-  import { FeaturePhoto } from '@reuters-graphics/graphics-svelte-components';
+  import { FeaturePhoto } from '@reuters-graphics/graphics-components';
   import { assets } from '$app/paths'; // 👈 If using in the Graphics Kit...
 </script>
 

src/components/Framer/stories/docs/component.md

@@ -2,7 +2,7 @@ An embed tool for development in the Graphics Kit.
 
 ```svelte
 <script>
-  import { Framer } from '@reuters-graphics/graphics-svelte-components';
+  import { Framer } from '@reuters-graphics/graphics-components';
 
   const embeds = ['/embeds/my-chart/index.html'];
 </script>

src/components/GraphicBlock/stories/docs/component.md

@@ -6,7 +6,7 @@ Many other components use this one to wrap graphics with styled text. When you u
 
 ```svelte
 <script>
-  import { GraphicBlock } from '@reuters-graphics/graphics-svelte-components';
+  import { GraphicBlock } from '@reuters-graphics/graphics-components';
 </script>
 
 

src/components/Headline/stories/docs/component.md

@@ -2,7 +2,7 @@ Reuters Graphics headline
 
 ```svelte
 <script>
-  import { Headline } from '@reuters-graphics/graphics-svelte-components';
+  import { Headline } from '@reuters-graphics/graphics-components';
 </script>
 
 <Headline

src/components/Headline/stories/docs/withByline.md

@@ -2,7 +2,7 @@ Add a byline and dateline with `byline` and `dateline` named slots.
 
 ```svelte
 <script>
-  import { Headline } from '@reuters-graphics/graphics-svelte-components';
+  import { Headline } from '@reuters-graphics/graphics-components';
 </script>
 
 <Headline

src/components/Headline/stories/docs/withCrown.md

@@ -2,7 +2,7 @@ Add a crown image in the `crown` named slot and override the headline in the `he
 
 ```svelte
 <script>
-  import { Headline } from '@reuters-graphics/graphics-svelte-components';
+  import { Headline } from '@reuters-graphics/graphics-components';
   import { assets } from '$app/paths';
 </script>
 

src/components/PymChild/stories/docs/component.md

@@ -2,7 +2,7 @@ A Pym.js child instance for embeddables.
 
 ```svelte
 <script>
-  import { PymChild } from '@reuters-graphics/graphics-svelte-components';
+  import { PymChild } from '@reuters-graphics/graphics-components';
 </script>
 
 <PymChild polling="{500}" />

src/components/ReutersLogo/stories/docs/component.md

@@ -2,7 +2,7 @@ The official home of the Reuters logo.
 
 ```svelte
 <script>
-  import { ReutersLogo } from '@reuters-graphics/graphics-svelte-components';
+  import { ReutersLogo } from '@reuters-graphics/graphics-components';
 </script>
 
 <ReutersLogo />

src/components/Sharer/stories/docs/component.md

@@ -2,7 +2,7 @@ Add share tools to a page.
 
 ```svelte
 <script>
-  import { Sharer } from '@reuters-graphics/graphics-svelte-components';
+  import { Sharer } from '@reuters-graphics/graphics-components';
 </script>
 
 <Sharer />

src/components/SiteFooter/stories/docs/component.md

@@ -4,7 +4,7 @@ Reuters dotcom site footer with graphics referrals, ported from [Raptor UI compo
 
 ```svelte
 <script>
-  import { SiteFooter } from '@reuters-graphics/graphics-svelte-components';
+  import { SiteFooter } from '@reuters-graphics/graphics-components';
 </script>
 
 <SiteFooter />

src/components/SiteFooter/stories/docs/customReferrals.md

@@ -2,7 +2,7 @@ Pass up to four custom referrals to the `referrals` prop.
 
 ```svelte
 <script>
-  import { SiteFooter } from '@reuters-graphics/graphics-svelte-components';
+  import { SiteFooter } from '@reuters-graphics/graphics-components';
   
   const customReferrals = [
     {

src/components/SiteFooter/stories/docs/darkTheme.md

@@ -15,7 +15,7 @@ The component also exports some preset themes you can use or customise:
 
 ```svelte
 <script>
-  import { SiteFooter, SiteFooterThemes } from '@reuters-graphics/graphics-svelte-components';
+  import { SiteFooter, SiteFooterThemes } from '@reuters-graphics/graphics-components';
 </script>
 
 <!-- Use a preset theme. -->

src/components/SiteHeader/stories/docs/component.md

@@ -6,7 +6,7 @@ Reuters dotcom site header, ported from [Raptor UI components](https://github.co
 
 ```svelte
 <script>
-  import { SiteHeader } from '@reuters-graphics/graphics-svelte-components';
+  import { SiteHeader } from '@reuters-graphics/graphics-components';
 </script>
 
 <SiteHeader />

src/components/SiteHeader/stories/docs/darkTheme.md

@@ -15,7 +15,7 @@ The component also exports some preset themes you can use or customise:
 
 ```svelte
 <script>
-  import { SiteHeader, SiteHeaderThemes } from '@reuters-graphics/graphics-svelte-components';
+  import { SiteHeader, SiteHeaderThemes } from '@reuters-graphics/graphics-components';
 </script>
 
 <!-- Use a preset theme. -->

src/components/Spinner/stories/docs/component.md

@@ -2,7 +2,7 @@ Simple loading spinner. Use it to help hide long loading times for components th
 
 ```svelte
 <script>
-  import { Spinner } from '@reuters-graphics/graphics-svelte-components';
+  import { Spinner } from '@reuters-graphics/graphics-components';
 
   let somethingsLoading = true;
 </script>

src/components/Video/stories/docs/withSound.md

@@ -21,7 +21,7 @@ and go to the top. Click anywhere on the page before scrolling down to the video
 
 ```svelte
 <script>
-  import { Video } from '@reuters-graphics/graphics-svelte-components';
+  import { Video } from '@reuters-graphics/graphics-components';
 </script>
 
 <Video 

src/components/Visible/stories/docs/component.md

@@ -1,12 +1,12 @@
 Wrap components or other HTML elements to determine if they are visible on the page using the [Intersection Observer API](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API).
 
-This is especially useful for lazy loading elements, especially expensive ones that load in big media files or components that have to fetch lots of data. You can also use it trigger animations or play media once a reader scrolls a component into view.
+This is especially useful for lazy loading elements, especially expensive media files or components that fetch lots of data. You can also use it trigger animations or play media once a reader scrolls a component into view.
 
 > **Pro tip:** Don't use this for content that's "above the fold" at the top of the page. That'll just slow down the first load of important visible content.
 
 ```svelte
 <script>
-  import { Visible } from '@reuters-graphics/graphics-svelte-components';
+  import { Visible } from '@reuters-graphics/graphics-components';
 </script>
 
 <Visible let:visible>

src/docs/components/intro.stories.mdx

@@ -7,4 +7,6 @@ import { parameters } from '$docs/utils/docsPage.js';
 
 # Components
 
-The components in this section can be used in any Svelte-based project. Check out the Guides section for more info on how to read the docs and use the components.
+The components in this section represent the components you're most likely to use when you make your page. They can be used in any Svelte-based project, but many of the demos are specifically written for use in the Graphics Kit.
+
+If you haven't already, check out the Guides section for more info on how to read the docs and use these components before you dive in.