Skip to content

Commit 9f0e44e

Browse files
committed
Refactored file locations
1 parent f0dfa02 commit 9f0e44e

File tree

19 files changed

+125
-61
lines changed

19 files changed

+125
-61
lines changed
Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,16 @@
11
import * as React from "react";
2-
import { SpaceContext } from "src/Contexts";
2+
import { SpaceContext } from "../components/Contexts";
3+
import { IParentSpace, ResizeType } from "../types";
34

4-
export const useParentSpace = () => {
5+
export const useParentSpace: () => IParentSpace = () => {
56
const parentSpace = React.useContext(SpaceContext);
67

78
return {
8-
startMouseDrag: !parentSpace ? (e: React.MouseEvent<HTMLElement, MouseEvent>) => null : parentSpace.startMouseDrag,
9+
startMouseDrag: !parentSpace
10+
? (e: React.MouseEvent<HTMLElement, MouseEvent>, onDragEnd?: (e: any) => void) => null
11+
: parentSpace.startMouseDrag,
12+
startMouseResize: !parentSpace
13+
? (e: React.MouseEvent<HTMLElement, MouseEvent>, resizeType: ResizeType, onResizeEnd?: (e: any) => void) => null
14+
: parentSpace.startMouseResize,
915
};
1016
};

react-spaces/src/Hooks/useSpace.ts

Lines changed: 24 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,51 +1,58 @@
11
import * as React from "react";
2-
import { AllProps, IState, AnchorType, ISize, SizeUnit } from "src/Globals/Types";
3-
import { initialState, isHorizontalSpace, isVerticalSpace, coalesce } from "src/Globals/Utils";
4-
import { ISpaceContext, updateSpace, removeSpace, registerSpace, createSpaceContext } from "src/Globals/ISpaceContext";
5-
import { SpaceLayerContext, SpaceContext } from "src/Contexts";
2+
import { AllProps, IState, AnchorType, ISize, SizeUnit } from "src/types";
3+
import { initialState, isHorizontalSpace, isVerticalSpace, coalesce } from "src/utils";
4+
import { ISpaceContext, updateSpace, removeSpace, registerSpace, createSpaceContext } from "src/ISpaceContext";
5+
import { SpaceLayerContext, SpaceContext } from "src/components/Contexts";
66
import { ResizeSensor } from "css-element-queries";
7-
import { startMouseDrag } from "src/Globals/Dragging";
7+
import { startMouseDrag } from "src/dragging";
8+
import { startMouseResize } from "src/resizing";
89

910
const calcProp = (props: AllProps, positionedFn: (p: AllProps) => SizeUnit, elseFn: (p: AllProps) => SizeUnit) =>
1011
props.isPositioned ? positionedFn(props) : elseFn(props);
12+
1113
const initialLeft = (props: AllProps) =>
1214
calcProp(
1315
props,
1416
(p) => p.left,
1517
(p) => (p.anchor !== AnchorType.Right ? p.left || 0 : undefined),
1618
);
19+
1720
const initialTop = (props: AllProps) =>
1821
calcProp(
1922
props,
2023
(p) => p.top,
2124
(p) => (p.anchor !== AnchorType.Bottom ? p.top || 0 : undefined),
2225
);
26+
2327
const initialRight = (props: AllProps) =>
2428
calcProp(
2529
props,
2630
(p) => p.right,
2731
(p) => (p.anchor !== AnchorType.Left ? p.right || 0 : undefined),
2832
);
33+
2934
const initialBottom = (props: AllProps) =>
3035
calcProp(
3136
props,
3237
(p) => p.bottom,
3338
(p) => (p.anchor !== AnchorType.Top ? p.bottom || 0 : undefined),
3439
);
40+
3541
const initialWidth = (props: AllProps) =>
3642
calcProp(
3743
props,
3844
(p) => p.width,
3945
(p) => (isHorizontalSpace(p.anchor) ? p.anchorSize || 0 : p.width),
4046
);
47+
4148
const initialHeight = (props: AllProps) =>
4249
calcProp(
4350
props,
4451
(p) => p.height,
4552
(p) => (isVerticalSpace(p.anchor) ? p.anchorSize || 0 : p.height),
4653
);
4754

48-
export const useSpace = (props: AllProps, divElementRef: React.MutableRefObject<HTMLElement | undefined>) => {
55+
export const useSpace = (props: AllProps, spaceElement: React.MutableRefObject<HTMLElement | undefined>) => {
4956
const parentContext = React.useContext(SpaceContext) as ISpaceContext;
5057

5158
if (!parentContext) {
@@ -61,8 +68,8 @@ export const useSpace = (props: AllProps, divElementRef: React.MutableRefObject<
6168
const currentZIndex = props.zIndex || layerContext || 0;
6269

6370
const updateCurrentSize = React.useCallback(() => {
64-
if (divElementRef.current) {
65-
const rect = divElementRef.current.getBoundingClientRect();
71+
if (spaceElement.current) {
72+
const rect = spaceElement.current.getBoundingClientRect();
6673
setCurrentSize({
6774
width: rect.width,
6875
height: rect.height,
@@ -109,6 +116,8 @@ export const useSpace = (props: AllProps, divElementRef: React.MutableRefObject<
109116
bottom: initialBottom(props),
110117
width: initialWidth(props),
111118
height: initialHeight(props),
119+
adjustedLeft: 0,
120+
adjustedTop: 0,
112121
});
113122
}, [props.left, props.top, props.bottom, props.right, props.width, props.height, props.anchor]);
114123

@@ -121,9 +130,9 @@ export const useSpace = (props: AllProps, divElementRef: React.MutableRefObject<
121130
// Setup / cleanup
122131

123132
React.useEffect(() => {
124-
if (divElementRef.current) {
133+
if (spaceElement.current) {
125134
if (props.trackSize) {
126-
resizeSensor.current = new ResizeSensor(divElementRef.current, (size) =>
135+
resizeSensor.current = new ResizeSensor(spaceElement.current, (size) =>
127136
setCurrentSize({
128137
width: size.width,
129138
height: size.height,
@@ -156,7 +165,11 @@ export const useSpace = (props: AllProps, divElementRef: React.MutableRefObject<
156165
state.children,
157166
(children) => setState({ children: children }),
158167
(resizing) => setState({ resizing: resizing }),
159-
(e) => startMouseDrag(e, parentContext, space, divElementRef.current),
168+
(event, onDragEnd) => startMouseDrag(event, parentContext, space, spaceElement.current, onDragEnd),
169+
(event, resizeType) =>
170+
startMouseResize(event, parentContext, space, props, spaceElement.current, (r) => {
171+
updateSpace(parentContext, space.id, { adjustedLeft: r.x });
172+
}),
160173
parentContext,
161174
);
162175

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
1-
import { ISpace, AnchorType, AnchorTypes } from "./Types";
2-
import { getSizeString } from "./Utils";
1+
import { ISpace, AnchorType, AnchorTypes, ResizeType, IPosition } from "./types";
2+
import { getSizeString } from "./utils";
33

44
export interface ISpaceContext {
55
level: number;
66
children: ISpace[];
77
updateChildren: (children: ISpace[]) => void;
88
updateResizing: (state: boolean) => void;
9-
startMouseDrag: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void;
9+
startMouseDrag: (e: React.MouseEvent<HTMLElement, MouseEvent>, onDragEnd?: (info: IPosition) => void) => void;
10+
startMouseResize: (e: React.MouseEvent<HTMLElement, MouseEvent>, resizeType: ResizeType) => void;
1011
}
1112

1213
const recalcSpaces = (spaces: ISpace[]) => {
@@ -109,15 +110,17 @@ export const createSpaceContext = (
109110
children: ISpace[],
110111
updateChildren: (children: ISpace[]) => void,
111112
updateResizing: (state: boolean) => void,
112-
startDrag: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void,
113+
startMouseDrag: (e: React.MouseEvent<HTMLElement, MouseEvent>, onDragEnd?: (info: IPosition) => void) => void,
114+
startMouseResize: (e: React.MouseEvent<HTMLElement, MouseEvent>, resizeType: ResizeType) => void,
113115
parent?: ISpaceContext | null,
114116
) => {
115117
const context: ISpaceContext = {
116118
level: parent ? parent.level + 1 : 0,
117119
children: children,
118120
updateChildren: updateChildren,
119121
updateResizing: updateResizing,
120-
startMouseDrag: startDrag,
122+
startMouseDrag: startMouseDrag,
123+
startMouseResize: startMouseResize,
121124
};
122125

123126
return context;
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import * as React from "react";
2-
import "./Styles.css";
2+
import "../styles.css";
33

44
export const Centered: React.FC = (props) => <div className={`spaces-centered`}>{props.children}</div>;
55

Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
import * as React from "react";
2-
import "./Styles.css";
2+
import "../styles.css";
33

44
export const ClearFix: React.FC = (props) => <div className={`spaces-clearfix`}>{props.children}</div>;
Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from "react";
2-
import { ISpaceInfo } from "./Globals/Types";
3-
import { ISpaceContext } from "./Globals/ISpaceContext";
2+
import { ISpaceInfo } from "../types";
3+
import { ISpaceContext } from "../ISpaceContext";
44

55
export const SpaceContext = React.createContext<ISpaceContext | null>(null);
66
export const SpaceLayerContext = React.createContext<number | null>(null);
Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
import * as React from "react";
2-
import "./Styles.css";
32
import * as PropTypes from "prop-types";
43
import { SpaceContext } from "./Contexts";
5-
import { ISpace, IReactEvents } from "./Globals/Types";
6-
import { createSpaceContext } from "./Globals/ISpaceContext";
4+
import { ISpace, IReactEvents } from "../types";
5+
import { createSpaceContext } from "../ISpaceContext";
76
import { HeadStyles } from "./HeadStyles";
7+
import "../styles.css";
88

99
interface IProps extends IReactEvents {
1010
className?: string;
@@ -38,7 +38,16 @@ export const Fixed: React.FC<IProps> = (props) => {
3838
onTouchMove={props.onTouchMove}
3939
onTouchEnd={props.onTouchEnd}>
4040
<HeadStyles spaces={children} />
41-
<SpaceContext.Provider value={createSpaceContext(children, setChildren, setResizing, () => null)}>{props.children}</SpaceContext.Provider>
41+
<SpaceContext.Provider
42+
value={createSpaceContext(
43+
children,
44+
setChildren,
45+
setResizing,
46+
() => null,
47+
() => null,
48+
)}>
49+
{props.children}
50+
</SpaceContext.Provider>
4251
</div>
4352
);
4453
};

react-spaces/src/HeadStyles.tsx renamed to react-spaces/src/components/HeadStyles.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import { ISpace } from "./Globals/Types";
1+
import { ISpace } from "../types";
22
import * as ReactDOM from "react-dom";
3-
import { cssValue, isHorizontalSpace, isVerticalSpace, getSizeString } from "./Globals/Utils";
3+
import { cssValue, isHorizontalSpace, isVerticalSpace, getSizeString } from "../utils";
44
import * as React from "react";
55

66
export const HeadStyles: React.FC<{ spaces: ISpace[] }> = (props) => {

react-spaces/src/ResizeHandle.tsx renamed to react-spaces/src/components/ResizeHandle.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import * as React from "react";
2-
import "./Styles.css";
3-
import { ResizeType, ISpace, AnchorToResizeTypeMap, AnchorType } from "./Globals/Types";
4-
import { startMouseResize, startTouchResize } from "./Globals/Resizing";
5-
import { ISpaceContext } from "./Globals/ISpaceContext";
2+
import { ResizeType, ISpace, AnchorToResizeTypeMap, AnchorType } from "../types";
3+
import { startMouseResize, startTouchResize } from "../resizing";
4+
import { ISpaceContext } from "../ISpaceContext";
5+
import "../styles.css";
66

77
interface IProps {
88
resizable?: boolean;

0 commit comments

Comments
 (0)