diff --git a/CHANGELOG.md b/CHANGELOG.md index 3f00be3..ddfe408 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,11 @@ # Changelog All notable changes to this project will be documented in this file. +## 1.1.0 (2023-03-30) + +### Added +- Implemented the button component + ## 1.0.0 (2023-03-30) ### Added diff --git a/apps/storybook/.storybook/main.ts b/apps/storybook/.storybook/main.ts index 4b57848..a4a94f6 100644 --- a/apps/storybook/.storybook/main.ts +++ b/apps/storybook/.storybook/main.ts @@ -2,8 +2,19 @@ import { StorybookViteConfig } from "@storybook/builder-vite"; import { mergeConfig } from "vite"; export const config: StorybookViteConfig = { - async viteFinal(config, options) { - return mergeConfig(config, {}); + async viteFinal(config) { + const tsconfigPaths = require("vite-tsconfig-paths").default; + const path = require("path"); + config.plugins = (config.plugins) ? config.plugins : []; + config.plugins.push( + tsconfigPaths({ + projects: [ + path.resolve(path.dirname(__dirname), "../../packages/components", "tsconfig.json"), + path.resolve(path.dirname(__dirname), ".", "tsconfig.json") + ], + }) + ); + return config; }, stories: ["../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"], addons: [ diff --git a/apps/storybook/package.json b/apps/storybook/package.json index 7478e29..f589ddd 100644 --- a/apps/storybook/package.json +++ b/apps/storybook/package.json @@ -17,7 +17,8 @@ "dependencies": { "@stitches/react": "^1.2.8", "react": "18.2.0", - "react-dom": "18.2.0" + "react-dom": "18.2.0", + "@csesoc/ui-components": "workspace:*" }, "devDependencies": { "@babel/core": "7.20.2", diff --git a/apps/storybook/src/assets/icons/dark-mode-white.svg b/apps/storybook/src/assets/icons/dark-mode-white.svg new file mode 100644 index 0000000..c7a122a --- /dev/null +++ b/apps/storybook/src/assets/icons/dark-mode-white.svg @@ -0,0 +1,3 @@ + + + diff --git a/apps/storybook/src/stories/examples/button/Button.stories.tsx b/apps/storybook/src/stories/examples/button/Button.stories.tsx index aafe1bf..55d39b2 100644 --- a/apps/storybook/src/stories/examples/button/Button.stories.tsx +++ b/apps/storybook/src/stories/examples/button/Button.stories.tsx @@ -1,41 +1,74 @@ -import { ComponentMeta, ComponentStory } from '@storybook/react'; -import React from 'react'; +import React from "react"; +import { Meta, StoryObj } from "@storybook/react"; +import { Button, type ButtonProps } from "@csesoc/ui-components/src/button"; +import DarkModeIcon from "@/assets/icons/dark-mode-white.svg" -import { Button } from './Button'; - -// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export -export default { - title: 'Example/Button', +const meta: Meta = { component: Button, - // More on argTypes: https://storybook.js.org/docs/react/api/argtypes - argTypes: { - backgroundColor: { control: 'color' }, - }, -} as ComponentMeta; + title: "Example/Button", + argTypes: {}, +}; +export default meta; -// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args -const Template: ComponentStory = (args) =>