fix(storybook): set dir attribute in storybook for rtl (#11031)

* fix(storybook): set dir attribute in storybook for rtl * fix(storybook): rtl - change postcss loader options object * fix(storybook): downgrade rtlcss
carbon-design-system · Nov 1, 2023 · b4f26f2 · b4f26f2
1 parent e7cb631
commit b4f26f2
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 2 deletions.
diff --git a/packages/web-components/.storybook/preview.ts b/packages/web-components/.storybook/preview.ts
@@ -24,6 +24,10 @@ import customElementsMetadata from '../custom-elements.json';
 
 setCustomElements(customElementsMetadata);
 
+if (process.env.STORYBOOK_USE_RTL === 'true') {
+  document.documentElement.setAttribute('dir', 'rtl');
+}
+
 export const parameters = {
   layout: 'fullscreen',
   options: {

diff --git a/packages/web-components/package.json b/packages/web-components/package.json
@@ -223,7 +223,7 @@
     "rollup-plugin-inject-process-env": "^1.3.1",
     "rollup-plugin-multi-input": "^1.3.1",
     "rollup-plugin-sizes": "^1.0.4",
-    "rtlcss": "^3.0.0",
+    "rtlcss": "^2.4.0",
     "sass-loader": "^10.0.0",
     "strip-comments": "^1.0.0",
     "style-loader": "^2.0.0",

diff --git a/yarn.lock b/yarn.lock
@@ -2446,7 +2446,7 @@ __metadata:
     rollup-plugin-inject-process-env: ^1.3.1
     rollup-plugin-multi-input: ^1.3.1
     rollup-plugin-sizes: ^1.0.4
-    rtlcss: ^3.0.0
+    rtlcss: ^2.4.0
     sass-loader: ^10.0.0
     strip-comments: ^1.0.0
     style-loader: ^2.0.0