From 21df07c6aeb90c5ba4db3ccbc7b0d11fd5f57655 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Loi=CC=88c=20Correnson?= <loic.correnson@cea.fr> Date: Tue, 4 Jan 2022 18:18:15 +0100 Subject: [PATCH] [ivette] typing q-splitters --- ivette/src/dome/renderer/layout/qsplit.tsx | 29 +++++++++++----------- 1 file changed, 15 insertions(+), 14 deletions(-) diff --git a/ivette/src/dome/renderer/layout/qsplit.tsx b/ivette/src/dome/renderer/layout/qsplit.tsx index 72850728862..e1851b2a94f 100644 --- a/ivette/src/dome/renderer/layout/qsplit.tsx +++ b/ivette/src/dome/renderer/layout/qsplit.tsx @@ -70,7 +70,8 @@ export interface QSplitProps { type DragPos = { position: number, anchor: number, offset: number }; type Dragging = undefined | DragPos; -const getDragPosition = (d: DragPos) => d.position + d.offset - d.anchor; +const getDragPosition = + (d: DragPos): number => d.position + d.offset - d.anchor; interface BSplitterProps { hsplit: boolean; @@ -91,7 +92,7 @@ const HVGRAB = 'dome-xSplitter-grab dome-xSplitter-hvgrab'; const DRAGGING = 'dome-color-dragging'; const DRAGZONE = 'dome-color-dragzone'; -function BSplitter(props: BSplitterProps) { +function BSplitter(props: BSplitterProps): JSX.Element { const { hsplit, style, dragging } = props; const onStart: DraggableEventHandler = @@ -157,7 +158,7 @@ interface CSplitterProps { setPosition: (X: number, Y: number) => void; } -function CSplitter(props: CSplitterProps) { +function CSplitter(props: CSplitterProps): JSX.Element { const { style, dragX, dragY } = props; const onStart: DraggableEventHandler = @@ -220,13 +221,13 @@ const HSPLIT = ( left: number, top: number, height: number, -) => ({ display: 'block', left, top, height }); +): React.CSSProperties => ({ display: 'block', left, top, height }); const VSPLIT = ( left: number, top: number, width: number, -) => ({ display: 'block', left, top, width }); +): React.CSSProperties => ({ display: 'block', left, top, width }); const DISPLAY = ( layout: QSplitLayout, @@ -235,17 +236,17 @@ const DISPLAY = ( width: number, top: number, height: number, -) => { +): void => { if (id) layout.set(id, { display: 'block', left, width, top, height }); }; interface QSplitEngineProps extends QSplitProps { size: Size } -const inRange = (P: number, D: number) => Math.max(0, Math.min(P, D)); +const inRange = (P: number, D: number): number => Math.max(0, Math.min(P, D)); -const getRatio = (P: number, D: number) => inRange(P, D) / D; +const getRatio = (P: number, D: number): number => inRange(P, D) / D; -const getPosition = (d: Dragging, D: number, R: number) => +const getPosition = (d: Dragging, D: number, R: number): number => d ? inRange(getDragPosition(d), D) : Math.round(D * R); type Pid = string | undefined; @@ -258,19 +259,19 @@ const sameOf = (P: Pid, Q: Pid): Pid => { return undefined; }; -const merge = (U: Sid, V: Sid) => { +const merge = (U: Sid, V: Sid): Sid => { if (U === V) return U; if (U === undefined) return V; if (V === undefined) return U; return null; }; -const fullOf = (A: Pid, B: Pid, C: Pid, D: Pid) => { +const fullOf = (A: Pid, B: Pid, C: Pid, D: Pid): Pid => { const S = merge(A, merge(B, merge(C, D))); return (S === null ? undefined : S); }; -function QSplitEngine(props: QSplitEngineProps) { +function QSplitEngine(props: QSplitEngineProps): JSX.Element { const [dragX, setDragX] = React.useState<Dragging>(); const [dragY, setDragY] = React.useState<Dragging>(); const layout: QSplitLayout = new Map(); @@ -449,7 +450,7 @@ function QSplitEngine(props: QSplitEngineProps) { corners but the adjacent quarters can not collapse, it will be positionned into only one quarter. */ -export function QSplit(props: QSplitProps) { +export function QSplit(props: QSplitProps): JSX.Element { const CONTAINER = Utils.classes('dome-xSplitter-container', props.className); return ( <div className={CONTAINER} style={props.style}> @@ -478,7 +479,7 @@ export interface QPaneProps { Childrens are rendered in a positionned `<div/>` with absolute coordinates. */ -export function QPane(props: QPaneProps) { +export function QPane(props: QPaneProps): JSX.Element { const layout = React.useContext(QSplitContext); const QPANE = Utils.classes('dome-xSplitter-pane', props.className); const QSTYLE = Utils.styles(props.style, layout?.get(props.id) ?? NODISPLAY); -- GitLab