From 6c38ad30d7232c7d0ee49c1fbe5b5732febcabdd Mon Sep 17 00:00:00 2001
From: Alexey Safronov <Alexey.Safronov@onlyoffice.com>
Date: Thu, 12 Sep 2019 10:20:57 +0300
Subject: [PATCH] web: components: Added and applied size prop for
 AdvancedSelector

---
 .../advanced-selector.stories.js                  |  4 +++-
 .../src/components/advanced-selector/index.js     | 15 ++++++++-------
 2 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/web/ASC.Web.Components/src/components/advanced-selector/advanced-selector.stories.js b/web/ASC.Web.Components/src/components/advanced-selector/advanced-selector.stories.js
index 8e69329b2f..56a0682a75 100644
--- a/web/ASC.Web.Components/src/components/advanced-selector/advanced-selector.stories.js
+++ b/web/ASC.Web.Components/src/components/advanced-selector/advanced-selector.stories.js
@@ -6,7 +6,7 @@ import withReadme from "storybook-readme/with-readme";
 import Readme from "./README.md";
 import AdvancedSelector from "./";
 import Section from "../../../.storybook/decorators/section";
-import { boolean } from "@storybook/addon-knobs/dist/deprecated";
+import { boolean, select } from "@storybook/addon-knobs/dist/deprecated";
 import { ArrayValue, BooleanValue } from "react-values";
 import Button from "../button";
 
@@ -77,6 +77,7 @@ storiesOf("Components|AdvancedSelector", module)
         >
           {({ value, set }) => (
             <AdvancedSelector
+              size={select("size", ["compact", "full"], "compact")}
               placeholder={text("placeholder", "Search users")}
               onSearchChanged={value => {
                 action("onSearchChanged")(value);
@@ -179,6 +180,7 @@ storiesOf("Components|AdvancedSelector", module)
                 >
                   {({ value, set }) => (
                     <AdvancedSelector
+                      size={select("size", ["compact", "full"], "compact")}
                       isDropDown={true}
                       isOpen={isOpen}
                       placeholder={text("placeholder", "Search users")}
diff --git a/web/ASC.Web.Components/src/components/advanced-selector/index.js b/web/ASC.Web.Components/src/components/advanced-selector/index.js
index 4333c7c2a2..a5e61d29cb 100644
--- a/web/ASC.Web.Components/src/components/advanced-selector/index.js
+++ b/web/ASC.Web.Components/src/components/advanced-selector/index.js
@@ -21,7 +21,7 @@ const Container = ({
   value,
   placeholder,
   isMultiSelect,
-  mode,
+  size,
   width,
   maxHeight,
   isDisabled,
@@ -264,14 +264,15 @@ class AdvancedSelector extends React.Component {
       options,
       isMultiSelect,
       buttonLabel,
-      selectAllLabel
+      selectAllLabel,
+      size
     } = this.props;
 
     const { selectedOptions, selectedAll, currentGroup, groups } = this.state;
 
-    const containerHeight = !groups || !groups.length ? 336 : 545;
-    const containerWidth = !groups || !groups.length ? 325 : 690;
-    const listHeight = 176;
+    const containerHeight = size === "compact" ? (!groups || !groups.length ? 336 : 326) : 545;
+    const containerWidth = size === "compact" ? (!groups || !groups.length ? 325 : 326) : 690;
+    const listHeight = size === "compact" ? (!groups || !groups.length ? 176 : 120) : 345;
     const itemHeight = 32;
 
     return (
@@ -363,7 +364,7 @@ AdvancedSelector.propTypes = {
   value: PropTypes.string,
   placeholder: PropTypes.string,
   isMultiSelect: PropTypes.bool,
-  mode: PropTypes.oneOf(["compact", "full"]),
+  size: PropTypes.oneOf(["compact", "full"]),
   maxHeight: PropTypes.number,
   isDisabled: PropTypes.bool,
   onSearchChanged: PropTypes.func,
@@ -382,7 +383,7 @@ AdvancedSelector.propTypes = {
 
 AdvancedSelector.defaultProps = {
   isMultiSelect: false,
-  mode: "compact",
+  size: "compact",
   buttonLabel: "Add members",
   selectAllLabel: "Select all"
 };