fix(storybook): fix code tab

dhis2 · Sep 24, 2024 · 383e147 · 383e147
1 parent fc45bbb
commit 383e147
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 28 deletions.
diff --git a/storybook/config/main.js b/storybook/config/main.js
@@ -1,4 +1,4 @@
-import { dirname, join } from 'path'
+import path, { dirname, join } from 'path'
 const { babelConfig } = require('../src/babel-config.js')
 const { loadStories } = require('../src/load-stories.js')
 const { webpackConfig } = require('../src/webpack-config.js')
@@ -9,10 +9,19 @@ module.exports = {
  name: '@storybook/addon-essentials',
  options: { docs: false },
  },
- {
- name: '@storybook/addon-storysource',
- options: { loaderOptions: { injectDecorator: false } },
- },
+ '@mihkeleidast/storybook-addon-source',
+ // {
+ // name: '@storybook/addon-storysource',
+ // options: {
+ // rule: {
+ // test: /prod\.stories\.jsx?$/,
+ // // include: [path.resolve(__dirname, '../../')], // You can specify directories
+ // },
+ // sourceLoaderOptions: {
+ // injectStoryParameters: false,
+ // },
+ // },
+ // },
  getAbsolutePath('@storybook/addon-a11y'),
  getAbsolutePath('@storybook/preset-create-react-app'),
  ],

diff --git a/storybook/config/preview.js b/storybook/config/preview.js
@@ -1,12 +1,11 @@
 import '@fontsource/roboto/latin.css'
 import { CssReset } from '@dhis2-ui/css'
 import React, { Fragment } from 'react'
-// import { jsxDecorator } from 'storybook-addon-jsx'
 import '@storybook/addon-console'
+const { withJsx } = require('@mihkeleidast/storybook-addon-source')
 
 export const decorators = [
- // Enable storybook jsx visualization
- // jsxDecorator,
+ withJsx,
  /**
  * Basic wrapper for all our components, styles the root elements and applies
  * our css reset for consistency/
@@ -39,13 +38,13 @@ export const parameters = {
  method: 'alphabetical',
  },
  },
- jsx: {
- filterProps: (val) => val !== undefined,
- showDefaultProps: false,
- functionValue: (fn) => fn.name,
- tabStop: 4,
- maxInlineAttributesLineLength: 80,
- },
+ // jsx: {
+ //  filterProps: (val) => val !== undefined,
+ //  showDefaultProps: false,
+ //  functionValue: (fn) => fn.name,
+ //  tabStop: 4,
+ //  maxInlineAttributesLineLength: 80,
+ // },
  // A11y addon config
  a11y: {
  // the target DOM element

diff --git a/storybook/package.json b/storybook/package.json
@@ -25,23 +25,23 @@
  "@dhis2-ui/css": "9.11.4",
  "@dhis2/ui-constants": "9.11.4",
  "@fontsource/roboto": "^4.5.0",
- "@storybook/addon-a11y": "^8.0.6",
+ "@storybook/addon-a11y": "^8.3.3",
  "@storybook/addon-console": "^3.0.0",
- "@storybook/addon-essentials": "^8.0.6",
- "@storybook/addon-storysource": "^8.0.6",
- "@storybook/channels": "^8.0.6",
- "@storybook/components": "^8.0.6",
- "@storybook/core-events": "^8.0.6",
- "@storybook/node-logger": "^8.0.6",
- "@storybook/preset-create-react-app": "^8.0.6",
- "@storybook/react": "^8.0.6",
- "@storybook/theming": "^8.0.6",
- "storybook-addon-jsx": "^7.3.14"
+ "@storybook/addon-essentials": "^8.3.3",
+ "@storybook/addon-storysource": "^8.3.3",
+ "@storybook/channels": "^8.3.3",
+ "@storybook/components": "^8.3.3",
+ "@storybook/core-events": "^8.3.3",
+ "@storybook/node-logger": "^8.3.3",
+ "@storybook/preset-create-react-app": "^8.3.3",
+ "@storybook/react": "^8.3.3",
+ "@storybook/theming": "^8.3.3",
+ "@mihkeleidast/storybook-addon-source": "1.0.1"
  },
  "devDependencies": {
- "@storybook/react-webpack5": "^8.0.6",
+ "@storybook/react-webpack5": "^8.3.3",
  "crypto-browserify": "^3.12.0",
- "storybook": "^8.0.6",
+ "storybook": "^8.3.3",
  "stream-browserify": "^3.0.0",
  "styled-jsx": "^4.0.1"
  }