PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Add missing types

Browse source
This commit is contained in:
Dariusz Niemczyk 2021-09-13 22:11:43 +02:00
parent 6249a1be5f
commit e913f03a67
No known key found for this signature in database
GPG key ID: 3E8DC619E3C59A05
2 changed files with 14 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/components/structures/ContextMenu.tsx
View file

@ -404,17 +404,27 @@ export class ContextMenu extends React.PureComponent<IProps, IState> {
} }
} }
export type ToRightOf = {
left: number;
top: number;
chevronOffset: number;
};
// Placement method for <ContextMenu /> to position context menu to right of elementRect with chevronOffset // Placement method for <ContextMenu /> to position context menu to right of elementRect with chevronOffset
export const toRightOf = (elementRect: Pick<DOMRect, "right" | "top" | "height">, chevronOffset = 12) => { export const toRightOf = (elementRect: Pick<DOMRect, "right" | "top" | "height">, chevronOffset = 12): ToRightOf => {
const left = elementRect.right + window.pageXOffset + 3; const left = elementRect.right + window.pageXOffset + 3;
let top = elementRect.top + (elementRect.height / 2) + window.pageYOffset; let top = elementRect.top + (elementRect.height / 2) + window.pageYOffset;
top -= chevronOffset + 8; // where 8 is half the height of the chevron top -= chevronOffset + 8; // where 8 is half the height of the chevron
return { left, top, chevronOffset }; return { left, top, chevronOffset };
}; };
export type AboveLeftOf = IPosition & {
chevronFace: ChevronFace;
};
// Placement method for <ContextMenu /> to position context menu right-aligned and flowing to the left of elementRect, // Placement method for <ContextMenu /> to position context menu right-aligned and flowing to the left of elementRect,
// and either above or below: wherever there is more space (maybe this should be aboveOrBelowLeftOf?) // and either above or below: wherever there is more space (maybe this should be aboveOrBelowLeftOf?)
export const aboveLeftOf = (elementRect: DOMRect, chevronFace = ChevronFace.None, vPadding = 0) => { export const aboveLeftOf = (elementRect: DOMRect, chevronFace = ChevronFace.None, vPadding = 0): AboveLeftOf => {
const menuOptions: IPosition & { chevronFace: ChevronFace } = { chevronFace }; const menuOptions: IPosition & { chevronFace: ChevronFace } = { chevronFace };
const buttonRight = elementRect.right + window.pageXOffset; const buttonRight = elementRect.right + window.pageXOffset;

3
src/components/views/rooms/MessageComposer.tsx
View file

@ -32,6 +32,7 @@ import {
ContextMenu, ContextMenu,
useContextMenu, useContextMenu,
MenuItem, MenuItem,
AboveLeftOf,
} from "../../structures/ContextMenu"; } from "../../structures/ContextMenu";
import AccessibleTooltipButton from "../elements/AccessibleTooltipButton"; import AccessibleTooltipButton from "../elements/AccessibleTooltipButton";
import ReplyPreview from "./ReplyPreview"; import ReplyPreview from "./ReplyPreview";
@ -511,7 +512,7 @@ export default class MessageComposer extends React.Component<IProps, IState> {
null, null,
]; ];
let menuPosition; let menuPosition: AboveLeftOf | undefined;
if (this.ref.current) { if (this.ref.current) {
const contentRect = this.ref.current.getBoundingClientRect(); const contentRect = this.ref.current.getBoundingClientRect();
menuPosition = aboveLeftOf(contentRect); menuPosition = aboveLeftOf(contentRect);