├── .gitignore ├── .prettierignore ├── .prettierrc ├── .storybook ├── main.ts └── preview.ts ├── README.md ├── eslint.config.js ├── index.html ├── package.json ├── pnpm-lock.yaml ├── public └── vite.svg ├── src ├── App.tsx ├── components │ ├── compound │ │ ├── README.md │ │ ├── Toggle.module.css │ │ ├── Toggle.tsx │ │ ├── ToggleButton.stories.tsx │ │ ├── ToggleButton.tsx │ │ ├── ToggleContext.ts │ │ └── useToggle.ts │ ├── container_presentation │ │ ├── README.md │ │ ├── Todo.module.css │ │ ├── TodoListContainer.stories.tsx │ │ ├── TodoListContainer.tsx │ │ └── TodoListPresentation.tsx │ ├── custom_hooks │ │ ├── README.md │ │ ├── Todo.module.css │ │ ├── TodoList.stories.tsx │ │ ├── TodoList.tsx │ │ └── useTodoList.ts │ ├── data_provider │ │ ├── Hello.stories.tsx │ │ ├── Hello.tsx │ │ ├── HelloButton.module.css │ │ ├── HelloButton.tsx │ │ ├── README.md │ │ ├── ThemeContext.ts │ │ ├── ThemeProvider.tsx │ │ └── useTheme.ts │ ├── hoc │ │ ├── Avatar.module.css │ │ ├── Avatar.tsx │ │ ├── DefaultAvatar.tsx │ │ ├── JohnDoe.stories.tsx │ │ ├── JohnDoe.tsx │ │ └── README.md │ ├── render_props │ │ ├── Counter.module.css │ │ ├── Counter.tsx │ │ ├── DefaultCounter.stories.tsx │ │ ├── DefaultCounter.tsx │ │ └── README.md │ └── state_reducer │ │ ├── LoginForm.module.css │ │ ├── LoginForm.stories.tsx │ │ ├── LoginForm.tsx │ │ ├── README.md │ │ └── form.type.ts ├── index.css ├── main.tsx ├── types │ └── todo.ts └── vite-env.d.ts ├── tsconfig.app.json ├── tsconfig.json ├── tsconfig.node.json └── vite.config.ts /.gitignore: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/.gitignore -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/.prettierignore -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/.prettierrc -------------------------------------------------------------------------------- /.storybook/main.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/.storybook/main.ts -------------------------------------------------------------------------------- /.storybook/preview.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/.storybook/preview.ts -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/README.md -------------------------------------------------------------------------------- /eslint.config.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/eslint.config.js -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/index.html -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/package.json -------------------------------------------------------------------------------- /pnpm-lock.yaml: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/pnpm-lock.yaml -------------------------------------------------------------------------------- /public/vite.svg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/public/vite.svg -------------------------------------------------------------------------------- /src/App.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/App.tsx -------------------------------------------------------------------------------- /src/components/compound/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/compound/README.md -------------------------------------------------------------------------------- /src/components/compound/Toggle.module.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/compound/Toggle.module.css -------------------------------------------------------------------------------- /src/components/compound/Toggle.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/compound/Toggle.tsx -------------------------------------------------------------------------------- /src/components/compound/ToggleButton.stories.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/compound/ToggleButton.stories.tsx -------------------------------------------------------------------------------- /src/components/compound/ToggleButton.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/compound/ToggleButton.tsx -------------------------------------------------------------------------------- /src/components/compound/ToggleContext.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/compound/ToggleContext.ts -------------------------------------------------------------------------------- /src/components/compound/useToggle.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/compound/useToggle.ts -------------------------------------------------------------------------------- /src/components/container_presentation/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/container_presentation/README.md -------------------------------------------------------------------------------- /src/components/container_presentation/Todo.module.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/container_presentation/Todo.module.css -------------------------------------------------------------------------------- /src/components/container_presentation/TodoListContainer.stories.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/container_presentation/TodoListContainer.stories.tsx -------------------------------------------------------------------------------- /src/components/container_presentation/TodoListContainer.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/container_presentation/TodoListContainer.tsx -------------------------------------------------------------------------------- /src/components/container_presentation/TodoListPresentation.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/container_presentation/TodoListPresentation.tsx -------------------------------------------------------------------------------- /src/components/custom_hooks/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/custom_hooks/README.md -------------------------------------------------------------------------------- /src/components/custom_hooks/Todo.module.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/custom_hooks/Todo.module.css -------------------------------------------------------------------------------- /src/components/custom_hooks/TodoList.stories.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/custom_hooks/TodoList.stories.tsx -------------------------------------------------------------------------------- /src/components/custom_hooks/TodoList.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/custom_hooks/TodoList.tsx -------------------------------------------------------------------------------- /src/components/custom_hooks/useTodoList.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/custom_hooks/useTodoList.ts -------------------------------------------------------------------------------- /src/components/data_provider/Hello.stories.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/data_provider/Hello.stories.tsx -------------------------------------------------------------------------------- /src/components/data_provider/Hello.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/data_provider/Hello.tsx -------------------------------------------------------------------------------- /src/components/data_provider/HelloButton.module.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/data_provider/HelloButton.module.css -------------------------------------------------------------------------------- /src/components/data_provider/HelloButton.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/data_provider/HelloButton.tsx -------------------------------------------------------------------------------- /src/components/data_provider/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/data_provider/README.md -------------------------------------------------------------------------------- /src/components/data_provider/ThemeContext.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/data_provider/ThemeContext.ts -------------------------------------------------------------------------------- /src/components/data_provider/ThemeProvider.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/data_provider/ThemeProvider.tsx -------------------------------------------------------------------------------- /src/components/data_provider/useTheme.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/data_provider/useTheme.ts -------------------------------------------------------------------------------- /src/components/hoc/Avatar.module.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/hoc/Avatar.module.css -------------------------------------------------------------------------------- /src/components/hoc/Avatar.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/hoc/Avatar.tsx -------------------------------------------------------------------------------- /src/components/hoc/DefaultAvatar.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/hoc/DefaultAvatar.tsx -------------------------------------------------------------------------------- /src/components/hoc/JohnDoe.stories.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/hoc/JohnDoe.stories.tsx -------------------------------------------------------------------------------- /src/components/hoc/JohnDoe.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/hoc/JohnDoe.tsx -------------------------------------------------------------------------------- /src/components/hoc/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/hoc/README.md -------------------------------------------------------------------------------- /src/components/render_props/Counter.module.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/render_props/Counter.module.css -------------------------------------------------------------------------------- /src/components/render_props/Counter.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/render_props/Counter.tsx -------------------------------------------------------------------------------- /src/components/render_props/DefaultCounter.stories.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/render_props/DefaultCounter.stories.tsx -------------------------------------------------------------------------------- /src/components/render_props/DefaultCounter.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/render_props/DefaultCounter.tsx -------------------------------------------------------------------------------- /src/components/render_props/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/render_props/README.md -------------------------------------------------------------------------------- /src/components/state_reducer/LoginForm.module.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/state_reducer/LoginForm.module.css -------------------------------------------------------------------------------- /src/components/state_reducer/LoginForm.stories.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/state_reducer/LoginForm.stories.tsx -------------------------------------------------------------------------------- /src/components/state_reducer/LoginForm.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/state_reducer/LoginForm.tsx -------------------------------------------------------------------------------- /src/components/state_reducer/README.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/state_reducer/README.md -------------------------------------------------------------------------------- /src/components/state_reducer/form.type.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/components/state_reducer/form.type.ts -------------------------------------------------------------------------------- /src/index.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/main.tsx: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/main.tsx -------------------------------------------------------------------------------- /src/types/todo.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/src/types/todo.ts -------------------------------------------------------------------------------- /src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /tsconfig.app.json: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/tsconfig.app.json -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/tsconfig.json -------------------------------------------------------------------------------- /tsconfig.node.json: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/tsconfig.node.json -------------------------------------------------------------------------------- /vite.config.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/miinhho/react-design-pattern/HEAD/vite.config.ts --------------------------------------------------------------------------------