@toptal/davinci-storybook 0.0.2-alpha-fx-use-node-env-variable-cypress.33 → 0.1.0

package/README.md

@@ -5,5 +5,18 @@ Davinci's support for storybook. Themes, webpack configurations and related tool
 
 ## Usage
 
-> TODO: Add usage of the package
+Simple run
+```shell
+yarn storybook
+```
 
+To run storybook only for a particular `stories` file
+
+```shell
+yarn storybook -s hosts/host-1/src/stories/Button.stories.tsx
+```
+
+To run storybook from a particular directory:
+```shell
+yarn storybook -s hosts/host-1/src/stories/
+```

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toptal/davinci-storybook",
-  "version": "0.0.2-alpha-fx-use-node-env-variable-cypress.33+96dd4461",
+  "version": "0.1.0",
   "description": "Davinci Storybook support project, containing configurations, themes, webpack plugins and related tools",
   "publishConfig": {
     "access": "public"
@@ -30,5 +30,16 @@
   "bugs": {
     "url": "https://github.com/toptal/davinci/issues"
   },
-  "gitHead": "96dd446128f9b9b03d961da13e0dc1d4e12d7fed"
+  "dependencies": {
+    "@babel/core": "^7.18.5",
+    "@toptal/davinci-storybook-addons": "^0.2.0",
+    "@storybook/builder-webpack5": "^6.5.9",
+    "@storybook/manager-webpack5": "^6.5.9",
+    "@storybook/react": "^6.5.9",
+    "@storybook/testing-library": "^0.0.13",
+    "babel-loader": "^8.2.5"
+  },
+  "devDependencies": {
+    "yargs": "^17.5.1"
+  }
 }

package/src/addons.js

@@ -0,0 +1 @@
+module.exports = ['@toptal/davinci-storybook-addons']

package/src/index.js

@@ -1 +1,3 @@
-module.exports = {}
+module.exports = {
+  config: require('./main'),
+}

package/src/main.js

@@ -0,0 +1,15 @@
+const webpackFinal = require('./webpack.conf')
+const addons = require('./addons')
+const stories = require('./stories')
+
+module.exports = {
+  stories,
+  addons,
+  core: {
+    builder: 'webpack5',
+    options: {
+      fsCache: true,
+    },
+  },
+  webpackFinal,
+}

package/src/stories.js

@@ -0,0 +1,65 @@
+const fs = require('fs')
+const path = require('path')
+const yargs = require('yargs/yargs')
+
+const STORY_EXTENSIONS = ['mdx', 'tsx', 'md', 'jsx']
+const STORY_EXTENSIONS_PATTERN = `(${STORY_EXTENSIONS.join('|')})`
+
+let currentWorkspace = process.cwd()
+let isRootWorkspace = __dirname === `${currentWorkspace}/.storybook`
+
+const args = yargs(process.argv.slice(2))
+  .command('src', 'Source path to stories')
+  .alias('s', 'src').argv
+const source = args.src
+
+const tryingSingleStory = STORY_EXTENSIONS.some(ext =>
+  source.endsWith(`.${ext}`)
+)
+const isSingleStory = STORY_EXTENSIONS.some(ext =>
+  source.endsWith(`stories.${ext}`)
+)
+
+const singleStoryPath = isSingleStory
+  ? path.resolve(currentWorkspace, source)
+  : undefined
+
+if (tryingSingleStory) {
+  if (!isSingleStory) {
+    console.error(
+      'It seems you\'re trying to run a single story, but not a story file is provided, please specify "*.stories.tsx" or ".stories.mdx" file'
+    )
+    process.exit(1)
+  }
+
+  console.log(`Running single story file: "${source}"`)
+}
+
+// try locating provided directory path,
+// fallback to default behavior silently if cannot locate the directory
+if (!tryingSingleStory && !source.startsWith('.')) {
+  const directoryPath = path.resolve(currentWorkspace, source)
+
+  if (
+    fs.existsSync(directoryPath) &&
+    fs.statSync(directoryPath).isDirectory()
+  ) {
+    console.log(`Running stories from directory: "${source}"`)
+    isRootWorkspace = false
+    currentWorkspace = directoryPath
+  }
+}
+
+const stories = singleStoryPath
+  ? [singleStoryPath]
+  : isRootWorkspace
+  ? [
+      `../hosts/storybook/*.stories.@${STORY_EXTENSIONS_PATTERN}`,
+      `../apps/**/*.stories.@${STORY_EXTENSIONS_PATTERN}`,
+      `../libs/**/*.stories.@${STORY_EXTENSIONS_PATTERN}`,
+      `../namespaces/*/apps/**/*.stories.@${STORY_EXTENSIONS_PATTERN}`,
+      `../namespaces/*/libs/**/*.stories.@${STORY_EXTENSIONS_PATTERN}`,
+    ]
+  : [`${currentWorkspace}/**/*.stories.@${STORY_EXTENSIONS_PATTERN}`]
+
+module.exports = stories

package/src/webpack.conf.js

@@ -0,0 +1,7 @@
+const webpackFinal = config => {
+  // Make whatever fine-grained changes you need
+  // Return the altered config
+  return config
+}
+
+module.exports = webpackFinal