chore: add header component

package.json

@@ -1,67 +1,69 @@
 {
-    "name": "example",
+  "name": "example",
-    "private": true,
+  "private": true,
-    "version": "0.0.0",
+  "version": "0.0.0",
-    "type": "module",
+  "type": "module",
-    "scripts": {
+  "scripts": {
-        "dev": "vite",
+    "dev": "vite",
-        "build": "tsc && vite build",
+    "build": "tsc && vite build",
-        "preview": "vite preview",
+    "preview": "vite preview",
-        "format": "prettier --write src",
+    "format": "prettier --write src",
-        "lint": "eslint . --ext .jsx,.js,.tsx,.ts  --no-error-on-unmatched-pattern --fix && stylelint --fix src/{,*/}*.{scss,css} --allow-empty-input",
+    "format:file": "prettier --write",
-        "storybook": "storybook dev -p 6006",
+    "lint": "eslint . --ext .jsx,.js,.tsx,.ts  --no-error-on-unmatched-pattern --fix && stylelint --fix src/{,*/}*.{scss,css} --allow-empty-input",
-        "sb": "storybook dev -p 6006",
+    "lint:file": "eslint --fix",
-        "build-storybook": "storybook build"
+    "storybook": "storybook dev -p 6006",
-    },
+    "sb": "storybook dev -p 6006",
-    "dependencies": {
+    "build-storybook": "storybook build"
-        "@fontsource/roboto": "^5.0.8",
+  },
-        "@hookform/resolvers": "^3.3.3",
+  "dependencies": {
-        "@radix-ui/react-checkbox": "^1.0.4",
+    "@fontsource/roboto": "^5.0.8",
-        "@radix-ui/react-dialog": "^1.0.5",
+    "@hookform/resolvers": "^3.3.3",
-        "@radix-ui/react-label": "^2.0.2",
+    "@radix-ui/react-checkbox": "^1.0.4",
-        "@radix-ui/react-radio-group": "^1.1.3",
+    "@radix-ui/react-dialog": "^1.0.5",
-        "@radix-ui/react-slider": "^1.1.2",
+    "@radix-ui/react-label": "^2.0.2",
-        "@radix-ui/react-tabs": "^1.0.4",
+    "@radix-ui/react-radio-group": "^1.1.3",
-        "@reduxjs/toolkit": "^2.0.1",
+    "@radix-ui/react-slider": "^1.1.2",
-        "@storybook/theming": "^7.6.6",
+    "@radix-ui/react-tabs": "^1.0.4",
-        "clsx": "^2.0.0",
+    "@reduxjs/toolkit": "^2.0.1",
-        "react": "^18.2.0",
+    "@storybook/theming": "^7.6.6",
-        "react-dom": "^18.2.0",
+    "clsx": "^2.0.0",
-        "react-hook-form": "^7.49.2",
+    "react": "^18.2.0",
-        "react-redux": "^9.0.4",
+    "react-dom": "^18.2.0",
-        "react-router-dom": "^6.21.1",
+    "react-hook-form": "^7.49.2",
-        "react-toastify": "^9.1.3",
+    "react-redux": "^9.0.4",
-        "remeda": "^1.33.0",
+    "react-router-dom": "^6.21.1",
-        "storybook-addon-react-router-v6": "^2.0.10",
+    "react-toastify": "^9.1.3",
-        "zod": "^3.22.4"
+    "remeda": "^1.33.0",
-    },
+    "storybook-addon-react-router-v6": "^2.0.10",
-    "devDependencies": {
+    "zod": "^3.22.4"
-        "@hookform/devtools": "^4.3.1",
+  },
-        "@it-incubator/eslint-config": "^1.0.2",
+  "devDependencies": {
-        "@it-incubator/prettier-config": "^0.1.2",
+    "@hookform/devtools": "^4.3.1",
-        "@it-incubator/stylelint-config": "^0.1.5",
+    "@it-incubator/eslint-config": "^1.0.2",
-        "@storybook/addon-essentials": "^7.6.6",
+    "@it-incubator/prettier-config": "^0.1.2",
-        "@storybook/addon-interactions": "^7.6.6",
+    "@it-incubator/stylelint-config": "^0.1.5",
-        "@storybook/addon-links": "^7.6.6",
+    "@storybook/addon-essentials": "^7.6.6",
-        "@storybook/blocks": "^7.6.6",
+    "@storybook/addon-interactions": "^7.6.6",
-        "@storybook/react": "^7.6.6",
+    "@storybook/addon-links": "^7.6.6",
-        "@storybook/react-vite": "^7.6.6",
+    "@storybook/blocks": "^7.6.6",
-        "@storybook/testing-library": "^0.2.2",
+    "@storybook/react": "^7.6.6",
-        "@types/node": "^20.10.5",
+    "@storybook/react-vite": "^7.6.6",
-        "@types/react": "^18.2.45",
+    "@storybook/testing-library": "^0.2.2",
-        "@types/react-dom": "^18.2.18",
+    "@types/node": "^20.10.5",
-        "@typescript-eslint/eslint-plugin": "^6.16.0",
+    "@types/react": "^18.2.45",
-        "@typescript-eslint/parser": "^6.16.0",
+    "@types/react-dom": "^18.2.18",
-        "@vitejs/plugin-react": "^4.2.1",
+    "@typescript-eslint/eslint-plugin": "^6.16.0",
-        "eslint": "^8.56.0",
+    "@typescript-eslint/parser": "^6.16.0",
-        "eslint-plugin-myPlugin": "file:eslint",
+    "@vitejs/plugin-react": "^4.2.1",
-        "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint": "^8.56.0",
-        "eslint-plugin-react-refresh": "^0.4.5",
+    "eslint-plugin-myPlugin": "file:eslint",
-        "eslint-plugin-storybook": "^0.6.15",
+    "eslint-plugin-react-hooks": "^4.6.0",
-        "sass": "^1.69.5",
+    "eslint-plugin-react-refresh": "^0.4.5",
-        "storybook": "^7.6.6",
+    "eslint-plugin-storybook": "^0.6.15",
-        "stylelint": "^15.10.3",
+    "sass": "^1.69.5",
-        "typescript": "^5.3.3",
+    "storybook": "^7.6.6",
-        "vite": "5.0.10"
+    "stylelint": "^15.10.3",
-    }
+    "typescript": "^5.3.3",
+    "vite": "5.0.10"
+  }
 }

src/components/ui/header/header.stories.tsx

@@ -0,0 +1,17 @@
+import type { Meta, StoryObj } from '@storybook/react'
+
+import { Header } from './'
+
+const meta = {
+  component: Header,
+  parameters: { layout: 'fullscreen' },
+  tags: ['autodocs'],
+  title: 'Components/Header',
+} satisfies Meta<typeof Header>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+export const Default: Story = {
+  args: {},
+}

src/components/ui/header/header.tsx

@@ -0,0 +1,11 @@
+import s from './header.module.scss'
+
+export type HeaderProps = {
+  avatar?: string
+  name?: string
+  onLogout?: () => void
+}
+
+export const Header = ({}: HeaderProps) => {
+  return <div>Header</div>
+}

src/components/ui/header/index.ts

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

src/components/ui/index.ts

@@ -1,3 +1,4 @@
+export * from './header'
 export * from './button'
 export * from './card'
 export * from './typography'