Merge pull request #1092 from ONLYOFFICE/bugfix/create-room-tag-input
Bugfix/create room tag input
This commit is contained in:
commit
3e734bb2a1
@ -20,6 +20,8 @@ const StyledDropDown = styled(DropDown)`
|
||||
box-shadow: 0px 12px 40px rgba(4, 15, 27, 0.12);
|
||||
border-radius: 3px;
|
||||
overflow: hidden;
|
||||
${(props) => !props.hasItems && "visibility: hidden"};
|
||||
/* visibility: hidden */
|
||||
|
||||
width: 446px;
|
||||
max-width: 446px;
|
||||
|
@ -40,7 +40,8 @@ const TagDropdown = ({
|
||||
e.preventDefault();
|
||||
};
|
||||
|
||||
const onClickOutside = () => {
|
||||
const onClickOutside = (e) => {
|
||||
if (e.target.id === "shared_tags-input") return;
|
||||
document.getElementById("shared_tags-input").blur();
|
||||
};
|
||||
|
||||
@ -108,18 +109,18 @@ const TagDropdown = ({
|
||||
className="dropdown-content-wrapper"
|
||||
onMouseDown={preventDefault}
|
||||
>
|
||||
{!!dropdownItems.length && (
|
||||
<StyledDropDown
|
||||
className="dropdown-content"
|
||||
open={open}
|
||||
forwardedRef={dropdownRef}
|
||||
clickOutsideAction={onClickOutside}
|
||||
maxHeight={dropdownMaxHeight}
|
||||
showDisabledItems={false}
|
||||
>
|
||||
{dropdownItems}
|
||||
</StyledDropDown>
|
||||
)}
|
||||
<StyledDropDown
|
||||
className="dropdown-content"
|
||||
open={open}
|
||||
forwardedRef={dropdownRef}
|
||||
maxHeight={dropdownMaxHeight}
|
||||
showDisabledItems={false}
|
||||
hasItems={!!dropdownItems.length}
|
||||
clickOutsideAction={onClickOutside}
|
||||
withBackdrop={false}
|
||||
>
|
||||
{dropdownItems}
|
||||
</StyledDropDown>
|
||||
</StyledDropDownWrapper>
|
||||
);
|
||||
};
|
||||
|
@ -11,6 +11,8 @@ const StyledTagList = styled.div`
|
||||
width: 100%;
|
||||
|
||||
.set_room_params-tag_input-tag {
|
||||
background: ${(props) =>
|
||||
props.theme.createEditRoomDialog.tagInput.tagBackground};
|
||||
padding: 6px 8px;
|
||||
border-radius: 3px;
|
||||
margin: 0;
|
||||
@ -31,7 +33,19 @@ const TagList = ({ defaultTagLabel, tagHandler, isDisabled }) => {
|
||||
|
||||
return (
|
||||
<StyledTagList className="set_room_params-tag_input-tag_list">
|
||||
{tags.length ? (
|
||||
{tags.map((tag) => (
|
||||
<Tag
|
||||
key={tag.id}
|
||||
className="set_room_params-tag_input-tag"
|
||||
tag="script"
|
||||
label={tag.name}
|
||||
isNewTag
|
||||
onDelete={() => {
|
||||
onDeleteAction(tag.id);
|
||||
}}
|
||||
/>
|
||||
))}
|
||||
{/* {tags.length ? (
|
||||
tags.map((tag) => (
|
||||
<Tag
|
||||
key={tag.id}
|
||||
@ -51,7 +65,7 @@ const TagList = ({ defaultTagLabel, tagHandler, isDisabled }) => {
|
||||
label={defaultTagLabel}
|
||||
isDefault
|
||||
/>
|
||||
)}
|
||||
)} */}
|
||||
</StyledTagList>
|
||||
);
|
||||
};
|
||||
|
@ -22,6 +22,8 @@ const StyledTagInput = styled.div`
|
||||
max-width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
${({ hasTags }) => !hasTags && "margin-bottom: -8px"}
|
||||
`;
|
||||
|
||||
const TagInput = ({
|
||||
@ -48,7 +50,10 @@ const TagInput = ({
|
||||
};
|
||||
|
||||
return (
|
||||
<StyledTagInput className="set_room_params-input set_room_params-tag_input">
|
||||
<StyledTagInput
|
||||
className="set_room_params-input set_room_params-tag_input"
|
||||
hasTags={!!tagHandler.tags.length}
|
||||
>
|
||||
<InputParam
|
||||
id="shared_tags-input"
|
||||
title={`${t("Common:Tags")}:`}
|
||||
|
@ -2390,6 +2390,10 @@ const Base = {
|
||||
descriptionColor: "#555f65",
|
||||
},
|
||||
|
||||
tagInput: {
|
||||
tagBackground: "#ECEEF1",
|
||||
},
|
||||
|
||||
dropdown: {
|
||||
background: "#ffffff",
|
||||
borderColor: "#d0d5da",
|
||||
@ -3005,13 +3009,12 @@ const Base = {
|
||||
boxShadow: "0px 5px 20px rgba(4, 15, 27, 0.07)",
|
||||
},
|
||||
|
||||
|
||||
preparationPortalProgress: {
|
||||
backgroundColor: "#F3F4F4",
|
||||
colorPercentSmall: "#333333",
|
||||
colorPercentBig: "#FFFFFF",
|
||||
},
|
||||
|
||||
},
|
||||
|
||||
codeInput: {
|
||||
background: white,
|
||||
border: "1px solid #d0d5da",
|
||||
|
@ -2390,6 +2390,10 @@ const Dark = {
|
||||
descriptionColor: "#a3a9ae",
|
||||
},
|
||||
|
||||
tagInput: {
|
||||
tagBackground: "#292929",
|
||||
},
|
||||
|
||||
dropdown: {
|
||||
background: "#333333",
|
||||
borderColor: "#474747",
|
||||
|
Loading…
Reference in New Issue
Block a user