Merge pull request #21 from route06inc/add-ui-package

feat: add ui package and sample component

frontend/apps/service-site/.storybook/main.ts

@@ -3,7 +3,13 @@ import type { StorybookConfig } from '@storybook/nextjs'
 
 const config: StorybookConfig = {
   framework: '@storybook/nextjs',
-  stories: ['../src/**/*.stories.@(ts|tsx)'],
+  stories: [
+    '../src/**/*.stories.@(ts|tsx)',
+    {
+      directory: path.resolve(__dirname, '../../../packages/ui/src'),
+      titlePrefix: 'UI',
+    },
+  ],
   features: {
     experimentalRSC: true,
   },

frontend/apps/service-site/package.json

@@ -21,6 +21,7 @@
     "fmt:biome": "biome check --write --unsafe ."
   },
   "dependencies": {
+    "@packages/ui": "workspace:*",
     "clsx": "^2.1.1",
     "contentlayer2": "^0.5.1",
     "date-fns": "^4.1.0",

frontend/packages/ui/.gitignore

@@ -0,0 +1,2 @@
+# typed-css-modules
+*.css.d.ts

frontend/packages/ui/biome.jsonc

@@ -0,0 +1,3 @@
+{
+  "extends": ["../../packages/configs/biome.jsonc"]
+}

frontend/packages/ui/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "@packages/ui",
+  "main": "src/index.ts",
+  "scripts": {
+    "dev": "conc -c auto pnpm:dev:*",
+    "dev:css": "tcm src --watch",
+    "gen": "conc -c auto pnpm:gen:*",
+    "gen:css": "tcm src",
+    "lint": "conc -c auto pnpm:lint:*",
+    "lint:biome": "biome check .",
+    "lint:tsc": "tsc --noEmit",
+    "fmt": "conc -c auto pnpm:fmt:*",
+    "fmt:biome": "biome check --write --unsafe ."
+  },
+  "devDependencies": {
+    "@biomejs/biome": "1.9.3",
+    "@packages/configs": "workspace:*",
+    "@storybook/react": "^8.3.4",
+    "@types/react": "^18",
+    "typed-css-modules": "^0.9.1",
+    "typescript": "^5"
+  }
+}

frontend/packages/ui/src/components/DropdownMenu/DropdownMenu.module.css

@@ -0,0 +1,3 @@
+/* biome-ignore lint/suspicious/noEmptyBlock: TODO */
+.wrapper {
+}

frontend/packages/ui/src/components/DropdownMenu/DropdownMenu.stories.tsx

@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from '@storybook/react'
+
+import { DropdownMenu } from './'
+
+const meta = {
+  component: DropdownMenu,
+  args: {},
+} satisfies Meta<typeof DropdownMenu>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+export const Default: Story = {}

frontend/packages/ui/src/components/DropdownMenu/DropdownMenu.tsx

@@ -0,0 +1,10 @@
+import type { FC } from 'react'
+import styles from './DropdownMenu.module.css'
+
+export const DropdownMenu: FC = () => {
+  return (
+    <div className={styles.wrapper}>
+      <h1>DropdownMenu Component</h1>
+    </div>
+  )
+}

frontend/packages/ui/src/components/DropdownMenu/index.ts

@@ -0,0 +1 @@
+export * from './DropdownMenu'

frontend/packages/ui/src/components/index.ts

@@ -0,0 +1 @@
+export * from './DropdownMenu'

frontend/packages/ui/src/index.ts

@@ -0,0 +1 @@
+export * from './components'

frontend/packages/ui/tsconfig.json

@@ -0,0 +1,7 @@
+{
+  "extends": "@packages/configs/tsconfig/base.json",
+  "compilerOptions": {
+    "baseUrl": "."
+  },
+  "include": ["src/**/*"]
+}

frontend/turbo/generators/config.ts

@@ -33,6 +33,7 @@ export default function generator(plop: PlopTypes.NodePlopAPI): void {
         choices: [
           ...listDirectories('apps/service-site/src/features'),
           ...listDirectories('apps/service-site/src/components'),
+          ...listDirectories('packages/ui/src/components'),
         ],
       },
       {