diff --git a/theatre/studio/src/panels/BasePanel/PanelDragZone.tsx b/theatre/studio/src/panels/BasePanel/PanelDragZone.tsx index 64e7eeb..f49f488 100644 --- a/theatre/studio/src/panels/BasePanel/PanelDragZone.tsx +++ b/theatre/studio/src/panels/BasePanel/PanelDragZone.tsx @@ -8,7 +8,7 @@ import styled from 'styled-components' import {panelDimsToPanelPosition, usePanel} from './BasePanel' import {useCssCursorLock} from '@theatre/studio/uiComponents/PointerEventsHandler' import {clamp} from 'lodash-es' -import {visibleSize} from './common' +import {minVisibleSize} from './common' const Container = styled.div` cursor: move; @@ -40,12 +40,12 @@ const PanelDragZone: React.FC< top: clamp( stuffBeforeDrag.dims.top + dy, 0, - window.innerHeight - visibleSize, + window.innerHeight - minVisibleSize, ), left: clamp( stuffBeforeDrag.dims.left + dx, - -stuffBeforeDrag.dims.width + visibleSize, - window.innerWidth - visibleSize, + -stuffBeforeDrag.dims.width + minVisibleSize, + window.innerWidth - minVisibleSize, ), } const position = panelDimsToPanelPosition(newDims, { diff --git a/theatre/studio/src/panels/BasePanel/PanelResizeHandle.tsx b/theatre/studio/src/panels/BasePanel/PanelResizeHandle.tsx index 8318473..bce3910 100644 --- a/theatre/studio/src/panels/BasePanel/PanelResizeHandle.tsx +++ b/theatre/studio/src/panels/BasePanel/PanelResizeHandle.tsx @@ -9,7 +9,7 @@ import styled from 'styled-components' import {panelDimsToPanelPosition, usePanel} from './BasePanel' import {pointerEventsAutoInNormalMode} from '@theatre/studio/css' import {clamp} from 'lodash-es' -import {visibleSize} from './common' +import {minVisibleSize} from './common' const Base = styled.div` position: absolute; @@ -174,7 +174,7 @@ const PanelResizeHandle: React.FC<{ 0, Math.min( bottom - stuffBeforeDrag.minDims.height, - window.innerHeight - visibleSize, + window.innerHeight - minVisibleSize, ), ) const height = bottom - top @@ -188,7 +188,7 @@ const PanelResizeHandle: React.FC<{ newDims.left + dx, Math.min( right - stuffBeforeDrag.minDims.width, - window.innerWidth - visibleSize, + window.innerWidth - minVisibleSize, ), ) const width = right - left @@ -200,7 +200,7 @@ const PanelResizeHandle: React.FC<{ newDims.width + dx, Math.max( stuffBeforeDrag.minDims.width, - visibleSize - stuffBeforeDrag.dims.left, + minVisibleSize - stuffBeforeDrag.dims.left, ), ) } diff --git a/theatre/studio/src/panels/BasePanel/common.tsx b/theatre/studio/src/panels/BasePanel/common.tsx index 1af4f26..47ddf8f 100644 --- a/theatre/studio/src/panels/BasePanel/common.tsx +++ b/theatre/studio/src/panels/BasePanel/common.tsx @@ -60,4 +60,5 @@ export const TitleBar = styled.div` text-overflow: ellipsis; ` -export const visibleSize = 100 +// the minimum visible width or height when the panel is partially offscreen +export const minVisibleSize = 100 diff --git a/theatre/studio/src/panels/SequenceEditorPanel/RightOverlay/FocusRangeZone/FocusRangeZone.tsx b/theatre/studio/src/panels/SequenceEditorPanel/RightOverlay/FocusRangeZone/FocusRangeZone.tsx index 5d3e29e..ed978ca 100644 --- a/theatre/studio/src/panels/SequenceEditorPanel/RightOverlay/FocusRangeZone/FocusRangeZone.tsx +++ b/theatre/studio/src/panels/SequenceEditorPanel/RightOverlay/FocusRangeZone/FocusRangeZone.tsx @@ -20,7 +20,7 @@ import React, {useEffect, useMemo, useRef, useState} from 'react' import styled from 'styled-components' import FocusRangeStrip, {focusRangeStripTheme} from './FocusRangeStrip' import FocusRangeThumb from './FocusRangeThumb' -import {visibleSize} from '@theatre/studio/panels/BasePanel/common' +import {minVisibleSize} from '@theatre/studio/panels/BasePanel/common' const Container = styled.div<{isShiftDown: boolean}>` position: absolute; @@ -190,12 +190,12 @@ function usePanelDragZoneGestureHandlers( top: clamp( stuffBeforeDrag.dims.top + dy, 0, - window.innerHeight - visibleSize, + window.innerHeight - minVisibleSize, ), left: clamp( stuffBeforeDrag.dims.left + dx, - -stuffBeforeDrag.dims.width + visibleSize, - window.innerWidth - visibleSize, + -stuffBeforeDrag.dims.width + minVisibleSize, + window.innerWidth - minVisibleSize, ), } const position = panelDimsToPanelPosition(newDims, {