Merge pull request #18 from Maxxnikitin/maxx/fix-components-styles

feat(architecture): fix styles of components, add ConstructorElement

.gitignore

@@ -19,6 +19,11 @@
 .env.test.local
 .env.production.local
 
+.docz
+docs
+dist
+/src/**/*.js
+
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*

README.md

@@ -7,5 +7,10 @@
 npm install @ya.praktikum/react-developer-burger-ui-components
 ```
 
+## Пример импорта компонента
+```
+import { Tab } from '@ya.praktikum/react-developer-burger-ui-components'
+```
+
 ## Документация
 Интерактивная документация находится [здесь](https://yandex-praktikum.github.io/react-developer-burger-ui-components/docs/)

src/__docz__/constructor-element.mdx

@@ -0,0 +1,28 @@
+---
+name: ConstructorElement
+route: /constructor-element
+---
+import { Playground, Props } from 'docz'
+import { ConstructorElement }  from '../';
+import img from '../images/img.png';
+
+
+# ConstructorElement
+
+## Properties
+
+<Props of={ConstructorElement} />
+
+## Basic usage
+
+<Playground>
+    {() => {
+        return (
+            <div style={{ display: 'flex', flexDirection: 'column', gap: '10px'}}>
+                <ConstructorElement type='top' isLocked={true} text='Краторная булка N-200i (верх)' price={200} thumbnail={img} />
+                <ConstructorElement text='Краторная булка N-200i (верх)' price={50} thumbnail={img} />
+                <ConstructorElement type='bottom' isLocked={true} text='Краторная булка N-200i (низ)' price={200} thumbnail={img} />
+           </div>
+        )
+   }}
+</Playground>

src/__docz__/icons.mdx

@@ -9,6 +9,10 @@ import {
     BurgerIcon,
     LockIcon,
     DragIcon,
+    DeleteIcon,
+    ArrowUpIcon,
+    ArrowDownIcon,
+    MenuIcon,
     CloseIcon,
     ListIcon,
     ProfileIcon,
@@ -18,7 +22,7 @@ import {
     HideIcon,
     LogoutIcon,
     CheckMarkIcon,
-} from '../'
+} from '../ui/icons'
 
 
 # Icons
@@ -44,6 +48,10 @@ import {
     <ShowIcon type="primary" />
     <HideIcon type="primary" />
     <LogoutIcon type="primary" />
+    <DeleteIcon type="primary" />
+    <ArrowUpIcon type="primary" />
+    <ArrowDownIcon type="primary" />
+    <MenuIcon type="primary" />
   </div>
   <div>
     <CurrencyIcon type="secondary" />
@@ -59,6 +67,10 @@ import {
     <ShowIcon type="secondary" />
     <HideIcon type="secondary" />
     <LogoutIcon type="secondary" />
+    <DeleteIcon type="secondary" />
+    <ArrowUpIcon type="secondary" />
+    <ArrowDownIcon type="secondary" />
+    <MenuIcon type="secondary" />
   </div>
   <div>
     <CurrencyIcon type="error" />
@@ -74,6 +86,10 @@ import {
     <ShowIcon type="error" />
     <HideIcon type="error" />
     <LogoutIcon type="error" />
+    <DeleteIcon type="error" />
+    <ArrowUpIcon type="error" />
+    <ArrowDownIcon type="error" />
+    <MenuIcon type="error" />
   </div>
   <div>
     <CurrencyIcon type="success" />
@@ -89,7 +105,9 @@ import {
     <ShowIcon type="success" />
     <HideIcon type="success" />
     <LogoutIcon type="success" />
+    <DeleteIcon type="success" />
+    <ArrowUpIcon type="success" />
+    <ArrowDownIcon type="success" />
+    <MenuIcon type="success" />
   </div>
 </Playground>
-
-

src/__docz__/typography.mdx

@@ -33,12 +33,25 @@ import { Input }  from '../';
     <p className="text text_type_main-small">The quick brown fox jumps over the lazy dog.</p>
 </Playground>
 
+## Text inactive color
+
+<Playground>
+    <p className="text text_type_main-default text_color_inactive">The quick brown fox jumps over the lazy dog.</p>
+</Playground>
+
+
 ## Digits default
 
 <Playground>
     <p className="text text_type_digits-default">1234567890</p>
 </Playground>
 
+## Digits medium
+
+<Playground>
+    <p className="text text_type_digits-medium">1234567890</p>
+</Playground>
+
 ## Digits large
 
 <Playground>