Replace storybook addon with dirDecorator

.storybook/addons.js

@@ -1,3 +1,2 @@
 import '@storybook/addon-notes/register';
 import '@storybook/addon-knobs/register';
-import 'storybook-addon-rtl/register';

.storybook/config.js

@@ -16,7 +16,6 @@ import {
   F_REITH_SANS_BOLD_ITALIC,
 } from '@bbc/psammead-styles/fonts';
 import Helmet from 'react-helmet';
-import { initializeRTL } from 'storybook-addon-rtl';
 
 const theme = create({
   base: 'light',
@@ -77,7 +76,6 @@ export const ampDecorator = story => (
 
 function loadAllStories() {
   require('glob-loader!./stories.pattern');
-  initializeRTL();
 }
 
 configure(loadAllStories, module);

package.json

@@ -77,7 +77,6 @@
     "request": "^2.88.0",
     "semver": "^5.6.0",
     "shelljs": "^0.8.3",
-    "storybook-addon-rtl": "^0.2.2",
     "storybook-readme": "^5.0.1",
     "strip-ansi": "^5.0.0",
     "stylelint": "^9.8.0",

packages/components/psammead-brand/CHANGELOG.md

@@ -3,6 +3,7 @@
 <!-- prettier-ignore -->
 | Version | Description |
 | ------- | ----------- |
+| 1.0.2   | [PR#515](https://github.com/bbc/psammead/pull/515) Update story to use dirDecorator |
 | 1.0.1   | [PR#476](https://github.com/bbc/psammead/pull/476) Fail gracefully if brand svg is not provided |
 | 1.0.0   | [PR#457](https://github.com/bbc/psammead/pull/457) Enable passing of different svgs |
 | 0.3.4   | [PR#424](https://github.com/bbc/psammead/pull/424) Add Snyk badge to readme |

packages/components/psammead-brand/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbc/psammead-brand",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "main": "dist/index.js",
   "description": "Provides the BBC News logo (as SVG), nested a hardcoded link to https://www.bbc.co.uk/news",
   "repository": {
@@ -23,6 +23,7 @@
   },
   "devDependencies": {
     "@bbc/psammead-assets": "^0.1.8",
+    "@bbc/psammead-storybook-helpers": "^2.1.1",
     "@bbc/psammead-test-helpers": "^0.3.3",
     "react": "^16.6.3",
     "styled-components": "^4.1.3"

packages/components/psammead-brand/src/index.stories.jsx

@@ -2,11 +2,13 @@ import React from 'react';
 import { select, withKnobs } from '@storybook/addon-knobs';
 import { storiesOf } from '@storybook/react';
 import * as svgs from '@bbc/psammead-assets/svgs';
+import { dirDecorator } from '@bbc/psammead-storybook-helpers';
 import notes from '../README.md';
 import Brand from './index';
 
 storiesOf('Brand', module)
   .addDecorator(withKnobs)
+  .addDecorator(dirDecorator)
   .add(
     'default',
     () => {
@@ -19,7 +21,12 @@ storiesOf('Brand', module)
       return <Brand brandName="Default Brand Name" svg={svgs[choice]} />;
     },
     { notes },
-  )
-  .add('without brand svg', () => <Brand brandName="Default Brand Name" />, {
+  );
+
+storiesOf('Brand', module).add(
+  'without brand svg',
+  () => <Brand brandName="Default Brand Name" />,
+  {
     notes,
-  });
+  },
+);

packages/components/psammead-caption/CHANGELOG.md

@@ -3,6 +3,7 @@
 <!-- prettier-ignore -->
 | Version | Description |
 |---------|-------------|
+| 1.1.4 | [PR#515](https://github.com/bbc/psammead/pull/515) Update story to use dirDecorator |
 | 1.1.3 | [PR#491](https://github.com/bbc/psammead/pull/491) Remove bottom padding from paragraphs within Caption |
 | 1.1.2 | [PR#498](https://github.com/bbc/psammead/pull/498) Update stories to use new input provider |
 | 1.1.1 | [PR#459](https://github.com/bbc/psammead/pull/459) Add custom propTypes shape |

packages/components/psammead-caption/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbc/psammead-caption",
-  "version": "1.1.3",
+  "version": "1.1.4",
   "main": "dist/index.js",
   "description": "React styled components for a Caption",
   "repository": {
@@ -21,9 +21,9 @@
     "@bbc/psammead-styles": "^0.3.2"
   },
   "devDependencies": {
-    "@bbc/psammead-paragraph": "^1.0.3",
     "@bbc/psammead-inline-link": "^0.3.4",
-    "@bbc/psammead-storybook-helpers": "^2.0.0",
+    "@bbc/psammead-paragraph": "^1.0.3",
+    "@bbc/psammead-storybook-helpers": "^2.1.1",
     "@bbc/psammead-test-helpers": "^0.3.3",
     "@bbc/psammead-visually-hidden-text": "^0.1.10",
     "react": "^16.6.3",

packages/components/psammead-caption/src/index.stories.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { withKnobs } from '@storybook/addon-knobs';
-import { inputProvider } from '@bbc/psammead-storybook-helpers';
+import { inputProvider, dirDecorator } from '@bbc/psammead-storybook-helpers';
 import InlineLink from '@bbc/psammead-inline-link';
 import Paragraph from '@bbc/psammead-paragraph';
 import VisuallyHiddenText from '@bbc/psammead-visually-hidden-text';
@@ -48,7 +48,11 @@ storiesOf('Caption', module)
       ),
     ),
     { notes, knobs: { escapeHTML: false } },
-  )
+  );
+
+storiesOf('Caption', module)
+  .addDecorator(withKnobs)
+  .addDecorator(dirDecorator)
   .add(
     'containing italicisation',
     inputProvider([], (inputs, script) => (

packages/components/psammead-media-indicator/CHANGELOG.md

@@ -3,4 +3,5 @@
 <!-- prettier-ignore -->
 | Version | Description |
 | ------- | ----------- |
+| 0.1.1   | [PR#515](https://github.com/BBC-News/psammead/pull/515) Update story to use dirDecorator |
 | 0.1.0   | [PR#448](https://github.com/BBC-News/psammead/pull/448) Create initial package. |

packages/components/psammead-media-indicator/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbc/psammead-media-indicator",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "main": "dist/index.js",
   "description": "Provides a play icon and media duration for media page promos",
   "repository": {
@@ -22,6 +22,7 @@
     "@bbc/psammead-visually-hidden-text": "^0.1.12"
   },
   "devDependencies": {
+    "@bbc/psammead-storybook-helpers": "^2.1.1",
     "@bbc/psammead-test-helpers": "^0.3.3",
     "react": "^16.6.3",
     "styled-components": "^4.1.3"