Something went wrong. Try again.
Starship Simulator Controls thoriumsim.com
Something went wrong. Try again.
2.0 kB · 66 lines
TSX
at develop
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667import * as React from "react";
import { DockLocation } from "../DockLocation";import type { BorderNode } from "../model/BorderNode";import { Orientation } from "../Orientation";import { Rect } from "../Rect";import { CLASSES } from "../Types";import type { LayoutInternal } from "./Layout";import { Splitter } from "./Splitter";
/** @internal */export interface IBorderTabProps { layout: LayoutInternal; border: BorderNode; show: boolean;}
export function BorderTab(props: IBorderTabProps) { const { layout, border, show } = props; const selfRef = React.useRef<HTMLDivElement | null>(null);
React.useLayoutEffect(() => { const outerRect = layout.getBoundingClientRect(selfRef.current!); const contentRect = Rect.getContentRect(selfRef.current!).relativeTo(layout.getDomRect()!); if (outerRect.width > 0) { border.setOuterRect(outerRect); if (!border.getContentRect().equals(contentRect)) { border.setContentRect(contentRect); layout.redrawInternal("border content rect"); } } });
let horizontal = true; const style: Record<string, any> = {};
if (border.getOrientation() === Orientation.HORZ) { style.width = border.getSize(); style.minWidth = border.getMinSize(); style.maxWidth = border.getMaxSize(); } else { style.height = border.getSize(); style.minHeight = border.getMinSize(); style.maxHeight = border.getMaxSize(); horizontal = false; }
style.display = show ? "flex" : "none";
const className = layout.getClassName(CLASSES.FLEXLAYOUT__BORDER_TAB_CONTENTS);
if (border.getLocation() === DockLocation.LEFT || border.getLocation() === DockLocation.TOP) { return ( <> <div ref={selfRef} style={style} className={className} /> {show && <Splitter layout={layout} node={border} index={0} horizontal={horizontal} />} </> ); } return ( <> {show && <Splitter layout={layout} node={border} index={0} horizontal={horizontal} />} <div ref={selfRef} style={style} className={className} /> </> );}