From 9e627a51a55c1445321a1adc7bbe53ff87e38f5d Mon Sep 17 00:00:00 2001 From: Brian Zinn Date: Sun, 7 Nov 2021 22:53:02 -0800 Subject: [PATCH] show story add-on tab by default #171 --- storybook/.storybook/{main.cjs => main.js} | 25 ++++--- storybook/.storybook/manager.js | 19 ++++++ storybook/.storybook/preview.js | 79 +++------------------- storybook/package.json | 27 ++++---- 4 files changed, 55 insertions(+), 95 deletions(-) rename storybook/.storybook/{main.cjs => main.js} (57%) diff --git a/storybook/.storybook/main.cjs b/storybook/.storybook/main.js similarity index 57% rename from storybook/.storybook/main.cjs rename to storybook/.storybook/main.js index fa341283..c2f82f93 100644 --- a/storybook/.storybook/main.cjs +++ b/storybook/.storybook/main.js @@ -1,27 +1,26 @@ const path = require('path'); module.exports = { - reactOptions: { - fastRefresh: true, - strictMode: true, - }, - stories: ['../stories/**/*.stories.[tj]s'], + "stories": [ + "../stories/**/*.stories.mdx", + "../stories/**/*.stories.@(js|jsx|ts|tsx)" + ], addons: [ '@storybook/addon-actions/register', - '@storybook/addon-links/register', - '@storybook/addon-storysource/register', + '@storybook/addon-links', + '@storybook/addon-storysource' // '@storybook/addon-notes/register', ], webpackFinal: async (config, { configType }) => { config.resolve.alias['react-babylonjs'] = path.resolve(__dirname, '../../dist/react-babylonjs'); config.resolve.alias['@babylonjs/core'] = path.resolve(__dirname, '../../node_modules/@babylonjs/core'); config.resolve.alias['@babylonjs/gui'] = path.resolve(__dirname, '../../node_modules/@babylonjs/gui'); - config.module.rules.push({ - test: /\.stories\.jsx?$/, - loaders: [require.resolve('@storybook/source-loader')], - enforce: 'pre', - }); - console.log(`added source loader to '${configType}' webpack config`); + // config.module.rules.push({ + // test: /\.stories\.jsx?$/, + // loaders: [require.resolve('@storybook/source-loader')], + // enforce: 'pre', + // }); + // console.log(`added source loader to '${configType}' webpack config`); // Return the altered config return config; }, diff --git a/storybook/.storybook/manager.js b/storybook/.storybook/manager.js index 57e430bd..dcc94918 100644 --- a/storybook/.storybook/manager.js +++ b/storybook/.storybook/manager.js @@ -2,5 +2,24 @@ import { addons } from '@storybook/addons'; import { themes } from '@storybook/theming'; addons.setConfig({ + isFullscreen: false, + showNav: true, + showPanel: true, + panelPosition: 'right', + enableShortcuts: true, + isToolshown: true, theme: themes.dark, + selectedPanel: 'story', + initialActive: 'sidebar', + sidebar: { + showRoots: false, + collapsedRoots: ['other'], + }, + toolbar: { + title: { hidden: false, }, + zoom: { hidden: false, }, + eject: { hidden: false, }, + copy: { hidden: false, }, + fullscreen: { hidden: false, }, + }, }); \ No newline at end of file diff --git a/storybook/.storybook/preview.js b/storybook/.storybook/preview.js index 2cf15651..21377b6c 100644 --- a/storybook/.storybook/preview.js +++ b/storybook/.storybook/preview.js @@ -1,71 +1,14 @@ -import { addParameters } from '@storybook/react'; - -// Option defaults: -addParameters({ +export const parameters = { + actions: { argTypesRegex: "^on[A-Z].*" }, + controls: { + matchers: { + color: /(background|color)$/i, + date: /Date$/, + }, + }, options: { - /** - * show story component as full screen - * @type {Boolean} - */ - isFullscreen: false, - /** - * display panel that shows a list of stories - * @type {Boolean} - */ - showNav: true, - /** - * display panel that shows addon configurations - * @type {Boolean} - */ - showPanel: false, - /** - * where to show the addon panel - * @type {('bottom'|'right')} - */ - panelPosition: 'bottom', - /** - * regex for finding the hierarchy separator - * @example: - * null - turn off hierarchy - * /\// - split by `/` - * /\./ - split by `.` - * /\/|\./ - split by `/` or `.` - * @type {Regex} - */ - hierarchySeparator: /\/|\./, - /** - * regex for finding the hierarchy root separator - * @example: - * null - turn off multiple hierarchy roots - * /\|/ - split by `|` - * @type {Regex} - */ - hierarchyRootSeparator: /\|/, - /** - * sidebar tree animations - * @type {Boolean} - */ - sidebarAnimations: true, - /** - * enable/disable shortcuts - * @type {Boolean} - */ - enableShortcuts: true, - /** - * show/hide tool bar - * @type {Boolean} - */ - isToolshown: true, - /** - * theme storybook, see link below - */ - theme: undefined, - - /** - * custom sorting (custom properties are not available) - */ storySort: (a, b) => { - return a[1].kind === b[1].kind ? 0 : a[1].id.localeCompare(b[1].id, { numeric: true }); - } + return a[1].kind === b[1].kind ? 0 : a[1].id.localeCompare(b[1].id, { numeric: true }); + } }, -}); \ No newline at end of file +}; \ No newline at end of file diff --git a/storybook/package.json b/storybook/package.json index 350af065..57cb6568 100644 --- a/storybook/package.json +++ b/storybook/package.json @@ -9,32 +9,31 @@ "build-storybook": "build-storybook -o storybook-static -s ./storyboard-site" }, "devDependencies": { + "@babel/core": "^7.16.0", "@babylonjs/inspector": "^4.2.0", "@babylonjs/loaders": "^4.2.0", "@babylonjs/materials": "^4.2.0", "@babylonjs/procedural-textures": "^4.2.0", + "@inlet/react-pixi": "^6.6.5", + "@storybook/addon-actions": "^6.3.12", + "@storybook/addon-links": "^6.3.12", + "@storybook/addon-storysource": "^6.3.12", + "@storybook/react": "^6.3.12", + "@storybook/theming": "^6.3.12", + "babel-loader": "8.2.3", "cannon": "^0.6.2", "chroma-js": "^2.1.0", "earcut": "^2.2.2", "gsap": "^3.6.1", "honeycomb-grid": "^3.1.7", "lerp": "^1.0.3", - "react-babylon-spring": "^1.0.2" - }, - "dependencies": { - "@inlet/react-pixi": "^6.6.5", - "@storybook/addon-actions": "^6.3.7", - "@storybook/addon-links": "^6.3.7", - "@storybook/addon-storysource": "^6.3.7", - "@storybook/addons": "^6.3.7", - "@storybook/react": "^6.3.7", - "@storybook/source-loader": "^6.3.7", - "@storybook/theming": "^6.3.7", "pixi-projection": "^0.4.2", "pixi.js": "^6.1.2", - "react": "^17.0.2", - "react-dom": "^17.0.2", - "storybook": "^6.3.7", + "react-babylon-spring": "^1.0.2", "zustand": "^3.6.4" + }, + "dependencies": { + "react": "^17.0.2", + "react-dom": "^17.0.2" } }