IlyaSobolev/DocSpace-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

web: components: Added and applied size prop for AdvancedSelector

Browse Source
This commit is contained in:
Alexey Safronov 2019-09-12 10:20:57 +03:00
parent dc293fa50e
commit 6c38ad30d7
2 changed files with 11 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/ASC.Web.Components/src/components/advanced-selector/advanced-selector.stories.js
View File

@ -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")}

15
web/ASC.Web.Components/src/components/advanced-selector/index.js
View File

@ -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"
};