Merge branch 'develop' of github.com:ONLYOFFICE/AppServer into develop
This commit is contained in:
commit
a099207282
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "asc-web-common",
|
||||
"version": "1.0.275",
|
||||
"version": "1.0.276",
|
||||
"description": "Ascensio System SIA common components and solutions library",
|
||||
"license": "AGPL-3.0",
|
||||
"files": [
|
||||
|
@ -110,6 +110,7 @@ class FilterInput extends React.Component {
|
||||
openFilterItems: [],
|
||||
hiddenFilterItems: [],
|
||||
needUpdateFilter: false,
|
||||
asideView: false,
|
||||
};
|
||||
|
||||
this.searchWrapper = React.createRef();
|
||||
@ -454,6 +455,14 @@ class FilterInput extends React.Component {
|
||||
? sectionWidth - filterWidth - comboBoxWidth - sectionPaddings
|
||||
: fullWidth - filterWidth;
|
||||
|
||||
if (searchWidth) {
|
||||
const asideView = searchWidth && searchWidth < 350;
|
||||
|
||||
this.setState({
|
||||
asideView,
|
||||
});
|
||||
}
|
||||
|
||||
const filterArr = Array.from(
|
||||
Array.from(this.filterWrapper.current.children).find(
|
||||
(x) => x.id === "filter-items-container"
|
||||
@ -740,6 +749,8 @@ class FilterInput extends React.Component {
|
||||
hiddenFilterItems,
|
||||
sortId,
|
||||
sortDirection,
|
||||
asideView,
|
||||
needUpdateFilter,
|
||||
} = this.state;
|
||||
|
||||
const smallSectionWidth = sectionWidth ? sectionWidth < 900 : false;
|
||||
@ -795,7 +806,8 @@ class FilterInput extends React.Component {
|
||||
onFilterRender={this.onFilterRender}
|
||||
isDisabled={isDisabled}
|
||||
columnCount={filterColumnCount}
|
||||
needUpdateFilter={this.state.needUpdateFilter}
|
||||
needUpdateFilter={needUpdateFilter}
|
||||
asideView={asideView}
|
||||
/>
|
||||
</div>
|
||||
</SearchInput>
|
||||
@ -831,7 +843,7 @@ class FilterInput extends React.Component {
|
||||
}
|
||||
}
|
||||
|
||||
FilterInput.protoTypes = {
|
||||
FilterInput.propTypes = {
|
||||
size: PropTypes.oneOf(["base", "middle", "big", "huge"]),
|
||||
autoRefresh: PropTypes.bool,
|
||||
selectedFilterData: PropTypes.object,
|
||||
@ -841,7 +853,7 @@ FilterInput.protoTypes = {
|
||||
className: PropTypes.string,
|
||||
id: PropTypes.string,
|
||||
style: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
|
||||
needForUpdate: PropTypes.bool,
|
||||
needForUpdate: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),
|
||||
filterColumnCount: PropTypes.number,
|
||||
onChangeViewAs: PropTypes.func,
|
||||
contextMenuHeader: PropTypes.string,
|
||||
|
@ -95,6 +95,7 @@ const StyledFilterInput = styled.div`
|
||||
|
||||
.dropdown-style {
|
||||
position: relative;
|
||||
z-index: 190;
|
||||
|
||||
.drop-down {
|
||||
padding: 16px;
|
||||
|
@ -1,7 +1,6 @@
|
||||
import React from "react";
|
||||
import FilterButton from "./FilterButton";
|
||||
import HideFilter from "./HideFilter";
|
||||
import throttle from "lodash/throttle";
|
||||
import { ComboBox } from "asc-web-components";
|
||||
import CloseButton from "./CloseButton";
|
||||
import isEqual from "lodash/isEqual";
|
||||
@ -160,6 +159,7 @@ class FilterItem extends React.Component {
|
||||
defaultOptionLabel,
|
||||
groupsCaption,
|
||||
defaultOption,
|
||||
asideView,
|
||||
} = this.props;
|
||||
return (
|
||||
<StyledFilterItem key={id} id={id} block={block} opened={opened}>
|
||||
@ -186,6 +186,7 @@ class FilterItem extends React.Component {
|
||||
isMultiSelect={false}
|
||||
onCancel={this.onCancelSelector}
|
||||
onSelect={this.onSelectGroup}
|
||||
displayType={asideView ? "aside" : "auto"}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
@ -213,6 +214,7 @@ class FilterItem extends React.Component {
|
||||
defaultOptionLabel={defaultOptionLabel}
|
||||
onCancel={this.onCancelSelector}
|
||||
onSelect={this.onSelectGroup}
|
||||
displayType={asideView ? "aside" : "auto"}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
@ -329,6 +331,7 @@ class FilterBlock extends React.Component {
|
||||
};
|
||||
getFilterItems = () => {
|
||||
const { openFilterItems, hiddenFilterItems } = this.state;
|
||||
const { asideView } = this.props;
|
||||
const _this = this;
|
||||
let result = [];
|
||||
let openItems = [];
|
||||
@ -368,6 +371,7 @@ class FilterBlock extends React.Component {
|
||||
defaultSelectLabel={defaultSelectLabel}
|
||||
selectedItem={selectedItem}
|
||||
onFilterRender={_this.props.onFilterRender}
|
||||
asideView={asideView}
|
||||
></FilterItem>
|
||||
);
|
||||
});
|
||||
@ -409,6 +413,7 @@ class FilterBlock extends React.Component {
|
||||
defaultSelectLabel={defaultSelectLabel}
|
||||
selectedItem={selectedItem}
|
||||
onFilterRender={_this.props.onFilterRender}
|
||||
asideView={asideView}
|
||||
></FilterItem>
|
||||
);
|
||||
});
|
||||
@ -454,7 +459,7 @@ class FilterBlock extends React.Component {
|
||||
const _this = this;
|
||||
const filterItems = this.getFilterItems();
|
||||
const filterData = this.props.getFilterData();
|
||||
const { iconSize, isDisabled, contextMenuHeader } = this.props;
|
||||
const { iconSize, isDisabled, contextMenuHeader, asideView } = this.props;
|
||||
return (
|
||||
<>
|
||||
<div
|
||||
@ -472,6 +477,7 @@ class FilterBlock extends React.Component {
|
||||
getData={_this.getData}
|
||||
isDisabled={isDisabled}
|
||||
asideHeader={contextMenuHeader}
|
||||
asideView={asideView}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
@ -488,6 +494,7 @@ FilterBlock.propTypes = {
|
||||
openFilterItems: PropTypes.array,
|
||||
columnCount: PropTypes.number,
|
||||
contextMenuHeader: PropTypes.string,
|
||||
asideView: PropTypes.bool,
|
||||
};
|
||||
|
||||
export default FilterBlock;
|
||||
|
@ -11,6 +11,7 @@ class FilterButton extends React.PureComponent {
|
||||
iconSize,
|
||||
columnCount,
|
||||
asideHeader,
|
||||
asideView,
|
||||
} = this.props;
|
||||
//console.log('render FilterButton)
|
||||
return (
|
||||
@ -26,7 +27,7 @@ class FilterButton extends React.PureComponent {
|
||||
size={iconSize}
|
||||
title="Actions"
|
||||
columnCount={columnCount}
|
||||
displayType="auto"
|
||||
displayType={asideView ? "aside" : "auto"}
|
||||
asideHeader={asideHeader}
|
||||
></ContextMenuButton>
|
||||
);
|
||||
@ -39,5 +40,6 @@ FilterButton.propTypes = {
|
||||
isDisabled: PropTypes.bool,
|
||||
columnCount: PropTypes.number,
|
||||
asideHeader: PropTypes.string,
|
||||
asideView: PropTypes.bool,
|
||||
};
|
||||
export default FilterButton;
|
||||
|
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "asc-web-components",
|
||||
"version": "1.0.484",
|
||||
"version": "1.0.485",
|
||||
"description": "Ascensio System SIA component library",
|
||||
"license": "AGPL-3.0",
|
||||
"main": "dist/asc-web-components.js",
|
||||
|
@ -49,8 +49,8 @@ const Body = styled.div`
|
||||
margin-top: 17px;
|
||||
}
|
||||
|
||||
.context-menu-button_link-header{
|
||||
text-transform:uppercase;
|
||||
.context-menu-button_link-header {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.context-menu-button_link-header:not(:first-child) {
|
||||
@ -98,6 +98,8 @@ class ContextMenuButton extends React.Component {
|
||||
|
||||
componentWillUnmount() {
|
||||
window.removeEventListener("resize", this.throttledResize);
|
||||
window.removeEventListener("popstate", this.popstate, false);
|
||||
this.throttledResize.cancel();
|
||||
}
|
||||
|
||||
stopAction = (e) => e.preventDefault();
|
||||
@ -152,7 +154,8 @@ class ContextMenuButton extends React.Component {
|
||||
shouldComponentUpdate(nextProps, nextState) {
|
||||
if (
|
||||
this.props.opened === nextProps.opened &&
|
||||
this.state.isOpen === nextState.isOpen
|
||||
this.state.isOpen === nextState.isOpen &&
|
||||
this.props.displayType === nextProps.displayType
|
||||
) {
|
||||
return false;
|
||||
}
|
||||
|
@ -88,7 +88,6 @@ class IconButton extends React.PureComponent {
|
||||
iconHoverName,
|
||||
iconName,
|
||||
color,
|
||||
onClick,
|
||||
onMouseUp,
|
||||
} = this.props;
|
||||
|
||||
@ -103,7 +102,6 @@ class IconButton extends React.PureComponent {
|
||||
currentIconColor: iconHoverName || color,
|
||||
});
|
||||
|
||||
onClick && onClick(e);
|
||||
onMouseUp && onMouseUp(e);
|
||||
break;
|
||||
case 3: //Right click
|
||||
@ -113,6 +111,12 @@ class IconButton extends React.PureComponent {
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
onClick = (e) => {
|
||||
const { onClick } = this.props;
|
||||
onClick && onClick(e);
|
||||
};
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
const { iconName, color } = this.props;
|
||||
|
||||
@ -150,6 +154,7 @@ class IconButton extends React.PureComponent {
|
||||
onMouseLeave={this.onMouseLeave}
|
||||
onMouseDown={this.onMouseDown}
|
||||
onMouseUp={this.onMouseUp}
|
||||
onClick={this.onClick}
|
||||
isClickable={typeof onClick === "function" || isClickable}
|
||||
data-tip={dataTip}
|
||||
data-event="click focus"
|
||||
|
@ -24,7 +24,7 @@ const Dot = styled.div`
|
||||
animation-delay: ${(props) => props.delay};
|
||||
`;
|
||||
|
||||
Dot.protoTypes = {
|
||||
Dot.propTypes = {
|
||||
delay: PropTypes.string.isRequired,
|
||||
color: PropTypes.string.isRequired,
|
||||
size: PropTypes.number.isRequired,
|
||||
|
@ -69,7 +69,7 @@ const Romb = styled.div`
|
||||
2s ease-in-out 0s infinite;
|
||||
`;
|
||||
|
||||
Romb.protoTypes = {
|
||||
Romb.propTypes = {
|
||||
width: PropTypes.string.isRequired,
|
||||
height: PropTypes.string.isRequired,
|
||||
};
|
||||
@ -83,7 +83,7 @@ const Rombs = ({ size }) => (
|
||||
</>
|
||||
);
|
||||
|
||||
Rombs.protoTypes = {
|
||||
Rombs.propTypes = {
|
||||
size: PropTypes.string.isRequired,
|
||||
};
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user