From ee6b1e8511e17cca7744666f0ec8983f77ef5f58 Mon Sep 17 00:00:00 2001
From: Tatiana Lopaeva <tatiana.lopaeva@onlyoffice.com>
Date: Wed, 21 Aug 2024 13:19:04 +0300
Subject: [PATCH] Shared: Selector: Fixed styles for selector header because of
 icon adding.

---
 .../shared/components/selector/Selector.styled.ts    | 12 +++++++++++-
 .../components/selector/sub-components/Header.tsx    |  4 +++-
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/packages/shared/components/selector/Selector.styled.ts b/packages/shared/components/selector/Selector.styled.ts
index a98ff30cfc..684b7f29c4 100644
--- a/packages/shared/components/selector/Selector.styled.ts
+++ b/packages/shared/components/selector/Selector.styled.ts
@@ -64,7 +64,7 @@ const StyledSelector = styled.div`
 `;
 
 const StyledHeader = styled.div<{ withoutBorder?: boolean }>`
-  width: calc(100% - 32px);
+  width: calc(100% - 53px);
   min-height: 53px;
   height: 53px;
   max-height: 53px;
@@ -79,9 +79,19 @@ const StyledHeader = styled.div<{ withoutBorder?: boolean }>`
   display: flex;
   align-items: center;
 
+  ${(props) =>
+    props.theme.interfaceDirection === "rtl"
+      ? css`
+          padding-left: 37px;
+        `
+      : css`
+          padding-right: 37px;
+        `}
+
   .arrow-button {
     cursor: pointer;
     margin-right: 12px;
+    min-width: 17px;
     ${(props) =>
       props.theme.interfaceDirection === "rtl" &&
       css`
diff --git a/packages/shared/components/selector/sub-components/Header.tsx b/packages/shared/components/selector/sub-components/Header.tsx
index a3e781c5c1..c3deb7b7c3 100644
--- a/packages/shared/components/selector/sub-components/Header.tsx
+++ b/packages/shared/components/selector/sub-components/Header.tsx
@@ -52,7 +52,9 @@ const Header = React.memo(
           />
         )}
 
-        <Heading className="heading-text">{headerLabel}</Heading>
+        <Heading className="heading-text" truncate>
+          {headerLabel}
+        </Heading>
       </StyledHeader>
     );
   },