Nexus Storybook

From 5b04166cd02bd7a7aa18e586fff75911d53011b6 Mon Sep 17 00:00:00 2001 From: Pauline Date: Sun, 15 Oct 2023 01:01:28 -0400 Subject: feature(storybook) init storybook framework --- apps/storybook/.storybook/main.ts | 34 +++++++++++++++++++++++++++ apps/storybook/.storybook/preview-head.html | 3 +++ apps/storybook/.storybook/preview.ts | 17 ++++++++++++++ apps/storybook/index.html | 13 +++++++++++ apps/storybook/package.json | 36 +++++++++++++++++++++++++++++ apps/storybook/postcss.config.js | 10 ++++++++ apps/storybook/public/vite.svg | 1 + apps/storybook/tailwind.config.js | 2 ++ apps/storybook/tsconfig.json | 19 +++++++++++++++ 9 files changed, 135 insertions(+) create mode 100644 apps/storybook/.storybook/main.ts create mode 100644 apps/storybook/.storybook/preview-head.html create mode 100644 apps/storybook/.storybook/preview.ts create mode 100644 apps/storybook/index.html create mode 100644 apps/storybook/package.json create mode 100644 apps/storybook/postcss.config.js create mode 100644 apps/storybook/public/vite.svg create mode 100644 apps/storybook/tailwind.config.js create mode 100644 apps/storybook/tsconfig.json (limited to 'apps') diff --git a/apps/storybook/.storybook/main.ts b/apps/storybook/.storybook/main.ts new file mode 100644 index 0000000..9a50fb5 --- /dev/null +++ b/apps/storybook/.storybook/main.ts @@ -0,0 +1,34 @@ +import type { StorybookConfig } from '@storybook/react-vite'; + +const config: StorybookConfig = { + stories: [ + { + directory: '../../../packages/ui/src/**', + titlePrefix: 'UI', + files: '*.stories.*' + }, + { + directory: '../../../interface/app/**', + titlePrefix: 'Interface', + files: '*.stories.*' + } + ], + addons: [ + '@storybook/addon-links', + '@storybook/addon-essentials', + '@storybook/addon-interactions', + '@storybook/addon-styling' + ], + framework: { + name: '@storybook/react-vite', + options: {} + }, + docs: { + autodocs: 'tag' + }, + core: { + disableTelemetry: true + } +}; + +export default config; diff --git a/apps/storybook/.storybook/preview-head.html b/apps/storybook/.storybook/preview-head.html new file mode 100644 index 0000000..b617b7b --- /dev/null +++ b/apps/storybook/.storybook/preview-head.html @@ -0,0 +1,3 @@ + diff --git a/apps/storybook/.storybook/preview.ts b/apps/storybook/.storybook/preview.ts new file mode 100644 index 0000000..1c3d344 --- /dev/null +++ b/apps/storybook/.storybook/preview.ts @@ -0,0 +1,17 @@ +import type { Preview } from '@storybook/react'; + +import '@polyfrost/ui/style'; + +const preview: Preview = { + parameters: { + actions: { argTypesRegex: '^on[A-Z].*' }, + controls: { + matchers: { + color: /(background|color)$/i, + date: /Date$/ + } + } + } +}; + +export default preview; diff --git a/apps/storybook/index.html b/apps/storybook/index.html new file mode 100644 index 0000000..abcdd48 --- /dev/null +++ b/apps/storybook/index.html @@ -0,0 +1,13 @@ + + + + + + + Nexus Storybook + + +

+ + + diff --git a/apps/storybook/package.json b/apps/storybook/package.json new file mode 100644 index 0000000..1282477 --- /dev/null +++ b/apps/storybook/package.json @@ -0,0 +1,36 @@ +{ + "name": "@polyfrost/storybook", + "private": true, + "scripts": { + "dev": "storybook dev -p 6006 --no-open", + "build-storybook": "storybook build --no-open" + }, + "dependencies": { + "@storybook/addon-essentials": "^7.4.6", + "@storybook/addon-interactions": "^7.4.6", + "@storybook/addon-links": "^7.4.6", + "@storybook/addon-styling": "^1.3.7", + "@storybook/blocks": "^7.4.6", + "@storybook/react": "^7.4.6", + "@storybook/react-vite": "^7.4.6", + "@storybook/testing-library": "^0.2.2", + "postcss-pseudo-companion-classes": "^0.1.1", + "sass": "^1.69.3", + "react": "^18.2.0", + "react-dom": "^18.2.0" + }, + "devDependencies": { + "@polyfrost/config": "workspace:*", + "@polyfrost/ui": "workspace:*", + "@types/react": "^18.2.28", + "@types/react-dom": "^18.2.13", + "@vitejs/plugin-react": "^4.1.0", + "autoprefixer": "^10.4.16", + "postcss": "^8.4.31", + "prop-types": "^15.8.1", + "storybook": "^7.4.6", + "tailwindcss": "^3.3.3", + "typescript": "^5.2.2", + "vite": "^4.4.11" + } +} diff --git a/apps/storybook/postcss.config.js b/apps/storybook/postcss.config.js new file mode 100644 index 0000000..de27714 --- /dev/null +++ b/apps/storybook/postcss.config.js @@ -0,0 +1,10 @@ +module.exports = { + plugins: { + 'tailwindcss': {}, + 'autoprefixer': {}, + 'postcss-pseudo-companion-classes': { + prefix: 'sb-pseudo--', + restrictTo: [':hover', ':focus'] + } + } +}; diff --git a/apps/storybook/public/vite.svg b/apps/storybook/public/vite.svg new file mode 100644 index 0000000..ee9fada --- /dev/null +++ b/apps/storybook/public/vite.svg @@ -0,0 +1 @@ + diff --git a/apps/storybook/tailwind.config.js b/apps/storybook/tailwind.config.js new file mode 100644 index 0000000..595a567 --- /dev/null +++ b/apps/storybook/tailwind.config.js @@ -0,0 +1,2 @@ +/** @type {import('tailwindcss').Config} */ +module.exports = require('@polyfrost/ui/tailwind')('web'); diff --git a/apps/storybook/tsconfig.json b/apps/storybook/tsconfig.json new file mode 100644 index 0000000..da3cfcc --- /dev/null +++ b/apps/storybook/tsconfig.json @@ -0,0 +1,19 @@ +{ + "compilerOptions": { + "target": "ESNext", + "module": "ESNext", + "moduleResolution": "Node", + "lib": ["DOM", "DOM.Iterable", "ESNext"], + "useDefineForClassFields": true, + "allowJs": true, + "skipLibCheck": true, + "esModuleInterop": false, + "allowSyntheticDefaultImports": true, + "strict": true, + "forceConsistentCasingInFileNames": true, + "resolveJsonModule": true, + "isolatedModules": true, + "noEmit": true, + "jsx": "react-jsx" + } +} -- cgit