update 0.11.3

packages/dooringx-lib/src/components/blocks.tsx

@@ -7,7 +7,7 @@ import React from 'react';
 import { transfer } from '../core/transfer';
 import { UserConfig } from '../config';
 import styles from '../index.less';
-import { RotateResizer } from '../core/rotateHandler';
+import { RotateReset, RotateResizer } from '../core/rotateHandler';
 interface BlockProps {
 	data: IBlockType;
 	context: 'edit' | 'preview';
@@ -185,6 +185,7 @@ function Blocks(props: PropsWithChildren<BlockProps>) {
 					)}
 					<BlockResizer data={props.data} config={props.config} rect={ref}></BlockResizer>
 					<RotateResizer data={props.data} config={props.config} rect={ref}></RotateResizer>
+					<RotateReset data={props.data} config={props.config} rect={ref}></RotateReset>
 				</div>
 			);
 		} else {

packages/dooringx-lib/src/components/container.tsx

@@ -60,6 +60,7 @@ function Container(props: PropsWithChildren<ContainerProps>) {
 									backgroundColor: bgColor(),
 									position: 'relative',
 									overflow: 'hidden',
+									cursor: 'default',
 									...editContainerStyle,
 								}}
 								{...(props.context === 'edit' ? containerDragResolve(props.config) : null)}

packages/dooringx-lib/src/components/wrapperMove/event.ts

@@ -64,7 +64,6 @@ export const wrapperEvent = (ref: RefObject<HTMLDivElement>, config: UserConfig)
 };
 export const wrapperMoveMouseUp = (config: UserConfig) => {
 	if (wrapperMoveState.ref && wrapperMoveState.ref.current) {
-		wrapperMoveState.ref.current.style.cursor = 'default';
 	}
 	containerResizer.onMouseUp(config);
 	wrapperMoveState.isDrag = false;

packages/dooringx-lib/src/components/wrapperMove/index.tsx

@@ -12,6 +12,7 @@ import React from 'react';
 import Ticker from './ticker';
 import UserConfig from '../../config';
 import TimeLine from '../timeLine/timeline';
+import styles from '../../index.less';
 
 export interface ContainerWrapperProps extends AllHTMLAttributes<HTMLDivElement> {
 	config: UserConfig;
@@ -25,7 +26,7 @@ function ContainerWrapper(props: PropsWithChildren<ContainerWrapperProps>) {
 	const ticker = props.config.ticker;
 	return (
 		<div
-			className={`ant-menu ${classNames ? classNames : ''}`}
+			className={`ant-menu ${classNames ? classNames : ''} ${styles.yh_container_wrapper}`}
 			ref={ref}
 			style={{
 				backgroundColor: '#f0f0f0',

packages/dooringx-lib/src/core/innerDrag/index.ts

@@ -143,7 +143,6 @@ export const innerContainerDragUp = function (config: UserConfig) {
 		wrapperMoveMouseUp(config);
 		selectRangeMouseUp(e, config);
 		if (innerDragState.ref && innerDragState.ref.current) {
-			innerDragState.ref.current.style.cursor = 'default';
 			innerDragState.ref.current.style.willChange = 'auto';
 		}
 		resizerMouseUp(config);

packages/dooringx-lib/src/core/rotateHandler/index.tsx

@@ -8,10 +8,10 @@
 import React from 'react';
 import { RefObject, useMemo } from 'react';
 import UserConfig from '../../config';
-import { IBlockType } from '../store/storetype';
+import { IBlockType, IStoreData } from '../store/storetype';
 import styles from '../../index.less';
 import { deepCopy } from '../utils';
-import { ReloadOutlined } from '@ant-design/icons';
+import { ReloadOutlined, RotateLeftOutlined } from '@ant-design/icons';
 
 interface rotateStateType {
 	startX: number;
@@ -97,6 +97,7 @@ export function RotateResizer(props: RotateResizerProps) {
 						onMouseDown(e, props.data, props.rect, props.config);
 					}}
 					className={styles.rotate}
+					title={'rotate'}
 				>
 					<ReloadOutlined
 						style={{
@@ -112,3 +113,37 @@ export function RotateResizer(props: RotateResizerProps) {
 
 	return <>{render}</>;
 }
+
+const resetResolve = (e: React.MouseEvent, item: IBlockType, config: UserConfig) => {
+	e.stopPropagation();
+	const store = config.getStore();
+	const clonedata: IStoreData = deepCopy(store.getData());
+	clonedata.block.forEach((v) => {
+		if (v.id === item.id) {
+			v.rotate.value = 0;
+		}
+	});
+	store.setData(clonedata);
+};
+
+export function RotateReset(props: RotateResizerProps) {
+	const render = useMemo(() => {
+		if (props.data.focus && props.data.rotate.canRotate && props.data.canDrag) {
+			return (
+				<div
+					onMouseDown={(e) => {
+						resetResolve(e, props.data, props.config);
+					}}
+					className={styles.rotatereset}
+					title={'rotate reset'}
+				>
+					<RotateLeftOutlined />
+				</div>
+			);
+		} else {
+			return null;
+		}
+	}, [props.config, props.data]);
+
+	return <>{render}</>;
+}

packages/dooringx-lib/src/index.less

@@ -72,6 +72,7 @@
 }
 
 .yh_block_focus {
+	cursor: move;
 	&::before {
 		position: absolute;
 		top: -3px;
@@ -203,3 +204,16 @@
 	cursor: grab;
 	font-size: 20px;
 }
+.rotatereset {
+	position: absolute;
+	top: -35px;
+	left: calc(100% - 15px);
+	cursor: pointer;
+	font-size: 20px;
+	color: gray;
+}
+.yh_container_wrapper {
+	&:hover {
+		cursor: grab;
+	}
+}