feat: added storybook

.storybook/main.js

+module.exports = {
+  "stories": [
+    "../src/**/*.stories.mdx",
+    "../src/**/*.stories.@(js|jsx|ts|tsx)"
+  ],
+  "addons": [
+    "@storybook/addon-links",
+    "@storybook/addon-essentials",
+    "@storybook/addon-interactions",
+    "@storybook/preset-create-react-app"
+  ],
+  "framework": "@storybook/react",
+  "core": {
+    "builder": "@storybook/builder-webpack5"
+  }
+}
\ No newline at end of file

.storybook/preview.js

+export const parameters = {
+  actions: { argTypesRegex: "^on[A-Z].*" },
+  controls: {
+    matchers: {
+      color: /(background|color)$/i,
+      date: /Date$/,
+    },
+  },
+}
\ No newline at end of file

src/components/language-items/LanguageItems.stories.tsx

+import React from 'react'
+import { ComponentMeta, Story } from '@storybook/react'
+
+import LanguageItems from './LanguageItems'
+
+// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
+export default {
+  title: 'Example/LanguageBar',
+  component: LanguageItems,
+  // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
+  argTypes: {
+    backgroundColor: { control: 'color' },
+  },
+} as ComponentMeta<typeof LanguageItems>
+
+export const Template: Story = (args) => <LanguageItems {...args} />
+// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
+
+export const Primary = Template.bind({})
+// More on args: https://storybook.js.org/docs/react/writing-stories/args
+Primary.args = {
+  onClick: () => console.log('Change language'),
+}

src/components/todo-item/ToDoItem.stories.tsx

+import React from 'react'
+import { ComponentStory, ComponentMeta } from '@storybook/react'
+
+import ToDoItem from './ToDoItem'
+
+// More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
+export default {
+  title: 'Example/ToDoItem',
+  component: ToDoItem,
+  // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
+  argTypes: {
+    backgroundColor: { control: 'color' },
+  },
+} as ComponentMeta<typeof ToDoItem>
+
+// More on component templates: https://storybook.js.org/docs/react/writing-stories/introduction#using-args
+const Template: ComponentStory<typeof ToDoItem> = (args) => (
+  <ToDoItem {...args} />
+)
+
+export const Primary = Template.bind({})
+// More on args: https://storybook.js.org/docs/react/writing-stories/args
+Primary.args = {
+  id: 1,
+  description: 'Item 1',
+  completed: false,
+  toggleTodo: () => console.log('Changed toggle'),
+  removeTodo: () => console.log('Deleted item'),
+}