quickblox-react-ui-kit 0.4.2-beta.2 → 0.4.2-beta.4

package/src/Presentation/icons/status/loader.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M20.1666 7.46163V3.7583C16.4816 4.12497 13.1266 5.59163 10.4133 7.80997L13.0166 10.4316C15.0516 8.85497 17.49 7.79163 20.1666 7.46163ZM33.5866 7.80997C30.8733 5.59163 27.5183 4.12497 23.8333 3.7583V7.46163C26.51 7.79163 28.9483 8.85497 30.9833 10.4316L33.5866 7.80997ZM36.5383 20.1666H40.2416C39.875 16.4816 38.4083 13.1266 36.19 10.4133L33.5683 13.0166C35.145 15.0516 36.2083 17.49 36.5383 20.1666ZM10.4316 13.0166L7.80997 10.4133C5.59163 13.1266 4.12497 16.4816 3.7583 20.1666H7.46163C7.79163 17.49 8.85497 15.0516 10.4316 13.0166ZM7.46163 23.8333H3.7583C4.12497 27.5183 5.59163 30.8733 7.80997 33.5866L10.4316 30.965C8.85497 28.9483 7.79163 26.51 7.46163 23.8333ZM33.5683 30.9833L36.19 33.605C38.4083 30.8916 39.875 27.5183 40.2416 23.8516H36.5383C36.2083 26.51 35.145 28.9483 33.5683 30.9833ZM23.8333 36.5383V40.2416C27.5183 39.875 30.8733 38.4083 33.5866 36.19L30.965 33.5683C28.9483 35.145 26.51 36.2083 23.8333 36.5383ZM10.4133 36.19C13.1266 38.4083 16.5 39.875 20.1666 40.2416V36.5383C17.49 36.2083 15.0516 35.145 13.0166 33.5683L10.4133 36.19Z"/>
+</svg>

package/src/Presentation/icons/status/mention.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M18.9998 3.66675C8.87984 3.66675 0.666504 11.8801 0.666504 22.0001C0.666504 32.1201 8.87984 40.3334 18.9998 40.3334H28.1665V36.6667H18.9998C11.0432 36.6667 4.33317 29.9567 4.33317 22.0001C4.33317 14.0434 11.0432 7.33341 18.9998 7.33341C26.9565 7.33341 33.6665 14.0434 33.6665 22.0001V24.6217C33.6665 26.0701 32.3648 27.5001 30.9165 27.5001C29.4682 27.5001 28.1665 26.0701 28.1665 24.6217V22.0001C28.1665 16.9401 24.0598 12.8334 18.9998 12.8334C13.9398 12.8334 9.83317 16.9401 9.83317 22.0001C9.83317 27.0601 13.9398 31.1667 18.9998 31.1667C21.5298 31.1667 23.8398 30.1401 25.4898 28.4717C26.6815 30.1034 28.7348 31.1667 30.9165 31.1667C34.5282 31.1667 37.3332 28.2334 37.3332 24.6217V22.0001C37.3332 11.8801 29.1198 3.66675 18.9998 3.66675ZM18.9998 27.5001C15.9565 27.5001 13.4998 25.0434 13.4998 22.0001C13.4998 18.9567 15.9565 16.5001 18.9998 16.5001C22.0432 16.5001 24.4998 18.9567 24.4998 22.0001C24.4998 25.0434 22.0432 27.5001 18.9998 27.5001Z"/>
+</svg>

package/src/Presentation/icons/status/sent.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M16.1334 29.1499L8.43337 21.4499L5.8667 24.0166L16.1334 34.2832L38.1334 12.2832L35.5667 9.71655L16.1334 29.1499Z"/>
+</svg>

package/src/Presentation/icons/status/viewed-delivered.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M32.9358 12.2925L30.3508 9.70752L18.7275 21.3309L21.3125 23.9159L32.9358 12.2925ZM40.7092 9.70752L21.3125 29.1042L13.6492 21.4592L11.0642 24.0442L21.3125 34.2925L43.3125 12.2925L40.7092 9.70752ZM0.6875 24.0442L10.9358 34.2925L13.5208 31.7075L3.29083 21.4592L0.6875 24.0442Z"/>
+</svg>

package/src/Presentation/icons/toggle/camera-off.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M39.4166 12.8333L32.0833 20.1666V13.7499C32.0833 12.7416 31.2583 11.9166 30.2499 11.9166H18.9199L39.4166 32.4133V12.8333ZM6.91159 4.58325L4.58325 6.91159L9.58825 11.9166H8.24992C7.24159 11.9166 6.41659 12.7416 6.41659 13.7499V32.0833C6.41659 33.0916 7.24159 33.9166 8.24992 33.9166H30.2499C30.6349 33.9166 30.9649 33.7699 31.2399 33.5866L37.0883 39.4166L39.4166 37.0883L6.91159 4.58325Z"/>
+</svg>

package/src/Presentation/icons/toggle/camera-on.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M31.1667 19.25V12.8333C31.1667 11.825 30.3417 11 29.3333 11H7.33333C6.325 11 5.5 11.825 5.5 12.8333V31.1667C5.5 32.175 6.325 33 7.33333 33H29.3333C30.3417 33 31.1667 32.175 31.1667 31.1667V24.75L38.5 32.0833V11.9167L31.1667 19.25Z"/>
+</svg>

package/src/Presentation/icons/toggle/check-off.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M34.8333 5.5H9.16667C7.15 5.5 5.5 7.15 5.5 9.16667V34.8333C5.5 36.85 7.15 38.5 9.16667 38.5H34.8333C36.85 38.5 38.5 36.85 38.5 34.8333V9.16667C38.5 7.15 36.85 5.5 34.8333 5.5ZM34.8333 34.8333H9.16667V9.16667H34.8333V34.8333Z"/>
+</svg>

package/src/Presentation/icons/toggle/check-on.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M34.8333 5.5H9.16667C7.15 5.5 5.5 7.15 5.5 9.16667V34.8333C5.5 36.85 7.15 38.5 9.16667 38.5H34.8333C36.85 38.5 38.5 36.85 38.5 34.8333V9.16667C38.5 7.15 36.85 5.5 34.8333 5.5ZM30.3967 13.8967L32.9817 16.5L18.315 31.1667L10.9817 23.8517L13.585 21.2667L18.315 25.9783L30.3967 13.8967Z"/>
+</svg>

package/src/Presentation/icons/toggle/favorite.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M40.3334 17.8566L27.1517 16.7199L22.0001 4.58325L16.8484 16.7383L3.66675 17.8566L13.6767 26.5283L10.6701 39.4166L22.0001 32.5783L33.3301 39.4166L30.3417 26.5283L40.3334 17.8566ZM22.0001 29.1499L15.1067 33.3116L16.9401 25.4649L10.8534 20.1849L18.8834 19.4883L22.0001 12.0999L25.1351 19.5066L33.1651 20.2033L27.0784 25.4833L28.9117 33.3299L22.0001 29.1499Z"/>
+</svg>

package/src/Presentation/icons/toggle/favourite.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M40.3334 17.8566L27.1517 16.7199L22.0001 4.58325L16.8484 16.7383L3.66675 17.8566L13.6767 26.5283L10.6701 39.4166L22.0001 32.5783L33.3301 39.4166L30.3417 26.5283L40.3334 17.8566ZM22.0001 29.1499L15.1067 33.3116L16.9401 25.4649L10.8534 20.1849L18.8834 19.4883L22.0001 12.0999L25.1351 19.5066L33.1651 20.2033L27.0784 25.4833L28.9117 33.3299L22.0001 29.1499Z"/>
+</svg>

package/src/Presentation/icons/toggle/full-screen.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M27.5 5.5L31.7167 9.71667L26.4183 14.9783L29.0217 17.5817L34.2833 12.2833L38.5 16.5V5.5H27.5ZM5.5 16.5L9.71667 12.2833L14.9783 17.5817L17.5817 14.9783L12.2833 9.71667L16.5 5.5H5.5V16.5ZM16.5 38.5L12.2833 34.2833L17.5817 29.0217L14.9783 26.4183L9.71667 31.7167L5.5 27.5V38.5H16.5ZM38.5 27.5L34.2833 31.7167L29.0217 26.4183L26.4183 29.0217L31.7167 34.2833L27.5 38.5H38.5V27.5Z"/>
+</svg>

package/src/Presentation/icons/toggle/hide.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M22.009 11.9166C27.069 11.9166 31.1756 16.0233 31.1756 21.0833C31.1756 22.2749 30.9373 23.3933 30.5156 24.4383L35.869 29.7916C38.6373 27.4816 40.819 24.4933 42.1573 21.0833C38.9856 13.0349 31.1573 7.33325 21.9906 7.33325C19.424 7.33325 16.9673 7.79159 14.694 8.61659L18.654 12.5766C19.699 12.1549 20.8173 11.9166 22.009 11.9166ZM3.67562 6.91159L8.69895 11.9349C5.65562 14.2999 3.27229 17.4533 1.84229 21.0833C5.01395 29.1316 12.8423 34.8333 22.009 34.8333C24.8506 34.8333 27.564 34.2833 30.039 33.2933L30.809 34.0633L36.1806 39.4166L38.509 37.0883L6.00395 4.58325L3.67562 6.91159ZM13.814 17.0499L16.6556 19.8916C16.564 20.2766 16.509 20.6799 16.509 21.0833C16.509 24.1266 18.9656 26.5833 22.009 26.5833C22.4123 26.5833 22.8156 26.5283 23.2006 26.4366L26.0423 29.2783C24.814 29.8833 23.4573 30.2499 22.009 30.2499C16.949 30.2499 12.8423 26.1433 12.8423 21.0833C12.8423 19.6349 13.209 18.2783 13.814 17.0499ZM21.7156 15.6199L27.4906 21.3949L27.5273 21.1016C27.5273 18.0583 25.0706 15.6016 22.0273 15.6016L21.7156 15.6199Z"/>
+</svg>

package/src/Presentation/icons/toggle/index.ts

@@ -0,0 +1,23 @@
+export { ReactComponent as CameraOffSvg } from './camera-off.svg';
+export { ReactComponent as CameraOnSvg } from './camera-on.svg';
+export { ReactComponent as CheckOffSvg } from './check-off.svg';
+export { ReactComponent as CheckOnSvg } from './check-on.svg';
+export { ReactComponent as FavoriteSvg } from './favorite.svg';
+export { ReactComponent as FullScreenSvg } from './full-screen.svg';
+export { ReactComponent as HideSvg } from './hide.svg';
+export { ReactComponent as LouderSvg } from './louder.svg';
+export { ReactComponent as MicOffSvg } from './mic-off.svg';
+export { ReactComponent as MicOnSvg } from './mic-on.svg';
+export { ReactComponent as MinimizeSvg } from './minimize.svg';
+export { ReactComponent as NotifyOffSvg } from './notify-off.svg';
+export { ReactComponent as NotifyOnSvg } from './notify-on.svg';
+export { ReactComponent as PauseSvg } from './pause.svg';
+export { ReactComponent as PlaySvg } from './play.svg';
+export { ReactComponent as QuiteSvg } from './quite.svg';
+export { ReactComponent as RecordSvg } from './record.svg';
+export { ReactComponent as ScreenShareSvg } from './screenshare.svg';
+export { ReactComponent as ShowSvg } from './show.svg';
+export { ReactComponent as SpeakerOffSvg } from './speaker-off.svg';
+export { ReactComponent as SpeakerSvg } from './speaker.svg';
+export { ReactComponent as StopRecordSvg } from './stop-record.svg';
+export { ReactComponent as StopShareSvg } from './stop-share.svg';

package/src/Presentation/icons/toggle/louder.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M5.5 16.5V27.5H12.8333L22 36.6666V7.3333L12.8333 16.5H5.5ZM18.3333 16.1883V27.8116L14.355 23.8333H9.16667V20.1666H14.355L18.3333 16.1883ZM30.25 22C30.25 18.755 28.38 15.9683 25.6667 14.6116V29.37C28.38 28.0316 30.25 25.245 30.25 22ZM25.6667 5.92163V9.6983C30.965 11.275 34.8333 16.1883 34.8333 22C34.8333 27.8116 30.965 32.725 25.6667 34.3016V38.0783C33.0183 36.41 38.5 29.8466 38.5 22C38.5 14.1533 33.0183 7.58996 25.6667 5.92163Z"/>
+</svg>

package/src/Presentation/icons/toggle/mic-off.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M34.8333 21.0833H31.7167C31.7167 22.4399 31.4233 23.7049 30.9283 24.8416L33.1833 27.0966C34.21 25.2999 34.8333 23.2649 34.8333 21.0833ZM27.4633 21.3949C27.4633 21.2849 27.5 21.1933 27.5 21.0833V10.0833C27.5 7.03992 25.0433 4.58325 22 4.58325C18.9567 4.58325 16.5 7.03992 16.5 10.0833V10.4133L27.4633 21.3949ZM7.82833 6.41659L5.5 8.74492L16.5183 19.7633V21.0833C16.5183 24.1266 18.9567 26.5833 22 26.5833C22.4033 26.5833 22.8067 26.5283 23.1917 26.4366L26.235 29.4799C24.9333 30.0849 23.485 30.4333 22 30.4333C16.94 30.4333 12.2833 26.5833 12.2833 21.0833H9.16667C9.16667 27.3349 14.1533 32.5049 20.1667 33.4033V39.4166H23.8333V33.4033C25.5017 33.1649 27.0783 32.5783 28.49 31.7533L36.1717 39.4166L38.5 37.0883L7.82833 6.41659Z"/>
+</svg>

package/src/Presentation/icons/toggle/mic-on.svg

@@ -0,0 +1,4 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M22.0001 26.5833C25.0434 26.5833 27.5001 24.1266 27.5001 21.0833V10.0833C27.5001 7.03992 25.0434 4.58325 22.0001 4.58325C18.9567 4.58325 16.5001 7.03992 16.5001 10.0833V21.0833C16.5001 24.1266 18.9567 26.5833 22.0001 26.5833Z"/>
+    <path d="M31.1667 21.0833C31.1667 26.1433 27.0601 30.2499 22.0001 30.2499C16.9401 30.2499 12.8334 26.1433 12.8334 21.0833H9.16675C9.16675 27.5549 13.9517 32.8716 20.1667 33.7699V39.4166H23.8334V33.7699C30.0484 32.8716 34.8334 27.5549 34.8334 21.0833H31.1667Z"/>
+</svg>

package/src/Presentation/icons/toggle/minimize.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M17.4999 16.4999V5.49992H13.8333V10.2483L8.16825 4.58325L5.58325 7.16825L11.2483 12.8333H6.49992V16.4999H17.4999ZM39.4999 16.4999V12.8333H34.7516L40.4166 7.16825L37.8316 4.58325L32.1666 10.2483V5.49992H28.4999V16.4999H39.4999ZM6.49992 27.4999V31.1666H11.2483L5.58325 36.8316L8.16825 39.4166L13.8333 33.7516V38.4999H17.4999V27.4999H6.49992ZM28.4999 27.4999V38.4999H32.1666V33.7516L37.8316 39.4166L40.4166 36.8316L34.7516 31.1666H39.4999V27.4999H28.4999Z"/>
+</svg>

package/src/Presentation/icons/toggle/notify-off.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M35.7501 33.8067L8.74508 5.94L6.41675 8.26833L11.5501 13.4017V13.42C10.5967 15.235 10.0834 17.38 10.0834 19.69V28.8567L6.41675 32.5233V34.3567H31.5884L35.2551 38.0233L37.5834 35.695L35.7501 33.8067ZM21.0834 39.875C23.1184 39.875 24.7501 38.2433 24.7501 36.2083H17.4167C17.4167 38.2433 19.0484 39.875 21.0834 39.875ZM32.0834 26.455V19.7083C32.0834 14.0617 29.0767 9.36833 23.8334 8.12167V6.875C23.8334 5.35333 22.6051 4.125 21.0834 4.125C19.5617 4.125 18.3334 5.35333 18.3334 6.875V8.12167C18.0584 8.17667 17.8017 8.26833 17.5634 8.34167C17.3801 8.39667 17.1967 8.47 17.0134 8.54333H16.9951C16.9767 8.54333 16.9767 8.54333 16.9584 8.56167C16.5367 8.72667 16.1151 8.92833 15.7117 9.13C15.7117 9.13 15.6934 9.13 15.6934 9.14833L32.0834 26.455Z"/>
+</svg>

package/src/Presentation/icons/toggle/notify-on.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M13.8967 7.02167L11.275 4.4C6.87501 7.755 3.97835 12.925 3.72168 18.7917H7.38835C7.66335 13.9333 10.1567 9.68 13.8967 7.02167ZM36.6117 18.7917H40.2783C40.0033 12.925 37.1067 7.755 32.725 4.4L30.1217 7.02167C33.825 9.68 36.3367 13.9333 36.6117 18.7917ZM33 19.7083C33 14.08 29.9933 9.36833 24.75 8.12167V6.875C24.75 5.35333 23.5217 4.125 22 4.125C20.4783 4.125 19.25 5.35333 19.25 6.875V8.12167C13.9883 9.36833 11 14.0617 11 19.7083V28.875L7.33335 32.5417V34.375H36.6667V32.5417L33 28.875V19.7083ZM22 39.875C22.2567 39.875 22.495 39.8567 22.7333 39.8017C23.925 39.545 24.8967 38.7383 25.3733 37.6383C25.5567 37.1983 25.6483 36.7217 25.6483 36.2083H18.315C18.3333 38.225 19.965 39.875 22 39.875Z"/>
+</svg>

package/src/Presentation/icons/toggle/pause.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M11 34.8334H18.3333V9.16675H11V34.8334ZM25.6667 9.16675V34.8334H33V9.16675H25.6667Z"/>
+</svg>

package/src/Presentation/icons/toggle/play.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M12.9165 9.16675V34.8334L33.0832 22.0001L12.9165 9.16675Z"/>
+</svg>

package/src/Presentation/icons/toggle/quite.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M29.7917 14.6116V29.3699C32.505 28.0316 34.375 25.2449 34.375 21.9999C34.375 18.7549 32.505 15.9683 29.7917 14.6116ZM9.625 16.4999V27.4999H16.9583L26.125 36.6666V7.33325L16.9583 16.4999H9.625ZM22.4583 16.1883V27.8116L18.48 23.8333H13.2917V20.1666H18.48L22.4583 16.1883Z"/>
+</svg>

package/src/Presentation/icons/toggle/record.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M22.0002 36.6666C30.1003 36.6666 36.6668 30.1001 36.6668 21.9999C36.6668 13.8997 30.1003 7.33325 22.0002 7.33325C13.9 7.33325 7.3335 13.8997 7.3335 21.9999C7.3335 30.1001 13.9 36.6666 22.0002 36.6666Z"/>
+</svg>

package/src/Presentation/icons/toggle/screenshare.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M36.6667 33.0002C38.6833 33.0002 40.315 31.3502 40.315 29.3335L40.3333 11.0002C40.3333 8.96516 38.6833 7.3335 36.6667 7.3335H7.33333C5.29833 7.3335 3.66667 8.96516 3.66667 11.0002V29.3335C3.66667 31.3502 5.29833 33.0002 7.33333 33.0002H0V36.6668H44V33.0002H36.6667ZM23.8333 26.5285V22.5135C18.7367 22.5135 15.3817 24.0718 12.8333 27.5002C13.86 22.6052 16.7017 17.7285 23.8333 16.7385V12.8335L31.1667 19.6718L23.8333 26.5285Z"/>
+</svg>

package/src/Presentation/icons/toggle/show.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M22.0002 8.25C12.8335 8.25 5.00516 13.9517 1.8335 22C5.00516 30.0483 12.8335 35.75 22.0002 35.75C31.1668 35.75 38.9952 30.0483 42.1668 22C38.9952 13.9517 31.1668 8.25 22.0002 8.25ZM22.0002 31.1667C16.9402 31.1667 12.8335 27.06 12.8335 22C12.8335 16.94 16.9402 12.8333 22.0002 12.8333C27.0602 12.8333 31.1668 16.94 31.1668 22C31.1668 27.06 27.0602 31.1667 22.0002 31.1667ZM22.0002 16.5C18.9568 16.5 16.5002 18.9567 16.5002 22C16.5002 25.0433 18.9568 27.5 22.0002 27.5C25.0435 27.5 27.5002 25.0433 27.5002 22C27.5002 18.9567 25.0435 16.5 22.0002 16.5Z"/>
+</svg>

package/src/Presentation/icons/toggle/speaker off.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M30.25 22C30.25 18.755 28.38 15.9683 25.6667 14.6117V18.6633L30.1583 23.155C30.2133 22.7883 30.25 22.4033 30.25 22ZM34.8333 22C34.8333 23.7233 34.4667 25.3367 33.8433 26.84L36.6117 29.6083C37.8217 27.335 38.5 24.75 38.5 22C38.5 14.1533 33.0183 7.59 25.6667 5.92167V9.69833C30.965 11.275 34.8333 16.1883 34.8333 22ZM7.82833 5.5L5.5 7.82833L14.1717 16.5H5.5V27.5H12.8333L22 36.6667V24.3283L29.7917 32.12C28.5633 33.0733 27.1883 33.825 25.6667 34.2833V38.06C28.1967 37.4917 30.4883 36.3183 32.4317 34.7417L36.1717 38.5L38.5 36.1717L7.82833 5.5ZM22 7.33333L18.1683 11.165L22 14.9967V7.33333Z"/>
+</svg>

package/src/Presentation/icons/toggle/speaker-off.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M30.25 22C30.25 18.755 28.38 15.9683 25.6667 14.6117V18.6633L30.1583 23.155C30.2133 22.7883 30.25 22.4033 30.25 22ZM34.8333 22C34.8333 23.7233 34.4667 25.3367 33.8433 26.84L36.6117 29.6083C37.8217 27.335 38.5 24.75 38.5 22C38.5 14.1533 33.0183 7.59 25.6667 5.92167V9.69833C30.965 11.275 34.8333 16.1883 34.8333 22ZM7.82833 5.5L5.5 7.82833L14.1717 16.5H5.5V27.5H12.8333L22 36.6667V24.3283L29.7917 32.12C28.5633 33.0733 27.1883 33.825 25.6667 34.2833V38.06C28.1967 37.4917 30.4883 36.3183 32.4317 34.7417L36.1717 38.5L38.5 36.1717L7.82833 5.5ZM22 7.33333L18.1683 11.165L22 14.9967V7.33333Z"/>
+</svg>

package/src/Presentation/icons/toggle/speaker.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M5.5 16.5V27.5H12.8333L22 36.6666V7.3333L12.8333 16.5H5.5ZM30.25 22C30.25 18.755 28.38 15.9683 25.6667 14.6116V29.37C28.38 28.0316 30.25 25.245 30.25 22ZM25.6667 5.92163V9.6983C30.965 11.275 34.8333 16.1883 34.8333 22C34.8333 27.8116 30.965 32.725 25.6667 34.3016V38.0783C33.0183 36.41 38.5 29.8466 38.5 22C38.5 14.1533 33.0183 7.58996 25.6667 5.92163Z"/>
+</svg>

package/src/Presentation/icons/toggle/stop-record.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M11 11H33V33H11V11Z"/>
+</svg>

package/src/Presentation/icons/toggle/stop-share.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 44 44" xmlns="http://www.w3.org/2000/svg">
+    <path d="M38.9033 32.615L42.57 36.2817H44V32.615H38.9033ZM40.315 28.9483L40.3333 10.615C40.3333 8.58 38.6833 6.94833 36.6667 6.94833H13.2367L22.825 16.5367C23.155 16.4633 23.485 16.4083 23.8333 16.3533V12.4483L31.1667 19.2867L28.27 21.9817L38.4267 32.1383C39.545 31.5333 40.315 30.3233 40.315 28.9483ZM4.38167 2.75L2.035 5.07833L4.85833 7.90167C4.125 8.56167 3.66667 9.53333 3.66667 10.615V28.9483C3.66667 30.965 5.29833 32.615 7.33333 32.615H0V36.2817H33.2383L38.2067 41.25L40.535 38.9217L4.38167 2.75ZM12.8333 27.115C13.4017 24.4017 14.52 21.7067 16.6283 19.6717L19.5433 22.5867C16.72 23.2833 14.5933 24.75 12.8333 27.115Z"/>
+</svg>

package/src/Presentation/layouts/Desktop/DesktopLayout.scss

@@ -0,0 +1,62 @@
+$desktop-main-container-max-width: 1360px;
+$desktop-main-container-min-height: 800px;
+$desktop-main-container-item-width: 320px;
+$desktop-main-container-item-center-width: 720px;
+// $desktop-main-container-item-center-width: 1040px;
+
+.desktop-layout-main-container {
+  // border: 1px solid var(--color-divider, #e7efff);
+  // border: 2px solid #6c38cc;
+  // min-height: $desktop-main-container-min-height;
+  // max-width: $desktop-main-container-max-width;
+  // height: calc(100vh - 128px);
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: flex-start;
+  align-items: flex-start;
+  margin: 0 auto;
+
+  &__item-left {
+    border-bottom: 1px solid var(--divider);
+    flex: 1 1 $desktop-main-container-item-width;
+    // max-width: $desktop-main-container-item-width
+    height: 100%;
+  }
+  &__item-right {
+    border: 1px solid var(--divider);
+    flex: 1 0 $desktop-main-container-item-width;
+    // max-width: $desktop-main-container-item-width
+    width: 100%;
+    height: 100%;
+  }
+  &__item-center {
+    //border: 1px solid  var(--divider);
+    border-style: solid;
+    border-color: var(--divider, #e7efff);
+    border-width: 1px 1px 1px 0;
+    // flex: 3 2 $desktop-main-container-item-center-width;
+    height: 100%;
+    width: 100%;
+    //  min-width: 320px;
+  }
+}
+
+.dialog-leave-container {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  margin-top: 48px;
+  gap: 8px;
+}
+
+.empty-chat-placeholder {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+}
+
+.empty-chat-history-placeholder {
+  justify-content: center;
+  height: 100%;
+}

package/src/Presentation/layouts/Desktop/DesktopLayout.tsx

@@ -0,0 +1,89 @@
+import React, { useRef, useEffect, useState } from 'react';
+import './DesktopLayout.scss';
+import UiKitTheme from '../../themes/UiKitTheme';
+
+type LayoutItems = {
+  dialogsView: React.ReactNode;
+  dialogMessagesView: React.ReactNode;
+  dialogInfoView: React.ReactNode;
+  theme?: UiKitTheme;
+  mainContainerStyles?: React.CSSProperties;
+  onHeightChange?: (height: number) => void;
+};
+
+function DesktopLayout({
+  dialogsView,
+  dialogMessagesView,
+  dialogInfoView,
+  theme = undefined,
+  onHeightChange,
+  mainContainerStyles = {},
+}: LayoutItems) {
+  const containerRef = useRef<HTMLDivElement | null>(null);
+  const [height, setHeight] = useState<number>(0);
+
+  const handleResize = () => {
+    if (containerRef.current) {
+      const newHeight = containerRef.current.offsetHeight;
+
+      if (newHeight !== height) {
+        setHeight(newHeight);
+        if (onHeightChange) {
+          onHeightChange(newHeight);
+        }
+      }
+    }
+  };
+
+  useEffect(() => {
+    window.addEventListener('resize', handleResize);
+    handleResize();
+
+    return () => {
+      window.removeEventListener('resize', handleResize);
+    };
+  }, [height, onHeightChange]);
+
+  const columnContainerStyles = theme
+    ? {
+        color: theme.mainText(),
+        backgroundColor: theme.mainBackground(),
+        // border: `1px solid ${theme.divider()}`,
+      }
+    : {};
+
+  return (
+    <div
+      ref={containerRef}
+      style={mainContainerStyles}
+      className="desktop-layout-main-container"
+    >
+      {dialogsView && (
+        <div
+          style={columnContainerStyles}
+          className="desktop-layout-main-container__item-left"
+        >
+          {dialogsView}
+        </div>
+      )}
+      {dialogMessagesView && (
+        <div
+          style={columnContainerStyles}
+          className="desktop-layout-main-container__item-center"
+        >
+          {dialogMessagesView}
+        </div>
+      )}
+      {dialogInfoView && (
+        <div
+          style={columnContainerStyles}
+          className="desktop-layout-main-container__item-right"
+        >
+          {dialogInfoView}
+        </div>
+      )}
+    </div>
+  );
+}
+
+export default DesktopLayout;