chore: sort imports

libs/components/board-shapes/src/TDShapeUtil.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 /* eslint-disable @typescript-eslint/no-unused-vars */
-import { Utils, TLShapeUtil } from '@tldraw/core';
+import type { TLBounds, TLPointerInfo } from '@tldraw/core';
-import type { TLPointerInfo, TLBounds } from '@tldraw/core';
+import { TLShapeUtil, Utils } from '@tldraw/core';
 import {
     intersectLineSegmentBounds,
     intersectLineSegmentPolyline,
@@ -15,9 +15,9 @@ import type {
 } from '@toeverything/components/board-types';
 import { BINDING_DISTANCE } from '@toeverything/components/board-types';
 import { createRef } from 'react';
-import { getTextSvgElement } from './shared/get-text-svg-element';
-import { getTextLabelSize } from './shared/get-text-size';
 import { getFontStyle, getShapeStyle } from './shared';
+import { getTextLabelSize } from './shared/get-text-size';
+import { getTextSvgElement } from './shared/get-text-svg-element';
 
 export abstract class TDShapeUtil<
     T extends TDShape,

libs/components/board-shapes/src/arrow-util/arrow-helpers.ts

@@ -4,14 +4,14 @@ import {
     intersectCircleLineSegment,
 } from '@tldraw/intersect';
 import Vec from '@tldraw/vec';
-import getStroke from 'perfect-freehand';
-import { EASINGS } from '@toeverything/components/board-types';
-import { getShapeStyle } from '../shared/shape-styles';
 import type {
     ArrowShape,
     Decoration,
     ShapeStyles,
 } from '@toeverything/components/board-types';
+import { EASINGS } from '@toeverything/components/board-types';
+import getStroke from 'perfect-freehand';
+import { getShapeStyle } from '../shared/shape-styles';
 
 export function getArrowArcPath(
     start: number[],

libs/components/board-shapes/src/arrow-util/arrow-util.tsx

@@ -1,22 +1,30 @@
-import * as React from 'react';
+import { SVGContainer, TLBounds, Utils } from '@tldraw/core';
-import { Utils, TLBounds, SVGContainer } from '@tldraw/core';
-import { Vec } from '@tldraw/vec';
-import { defaultStyle } from '../shared/shape-styles';
-import {
-    ArrowShape,
-    TransformInfo,
-    Decoration,
-    TDShapeType,
-    DashStyle,
-    TDMeta,
-    GHOSTED_OPACITY,
-} from '@toeverything/components/board-types';
-import { TDShapeUtil } from '../TDShapeUtil';
 import {
     intersectArcBounds,
     intersectLineSegmentBounds,
     intersectLineSegmentLineSegment,
 } from '@tldraw/intersect';
+import { Vec } from '@tldraw/vec';
+import {
+    ArrowShape,
+    DashStyle,
+    Decoration,
+    GHOSTED_OPACITY,
+    TDMeta,
+    TDShapeType,
+    TransformInfo,
+} from '@toeverything/components/board-types';
+import { styled } from '@toeverything/components/ui';
+import * as React from 'react';
+import {
+    getFontStyle,
+    getShapeStyle,
+    getTextLabelSize,
+    LabelMask,
+    TextLabel,
+} from '../shared';
+import { defaultStyle } from '../shared/shape-styles';
+import { TDShapeUtil } from '../TDShapeUtil';
 import {
     getArcLength,
     getArcPoints,
@@ -25,16 +33,8 @@ import {
     getCtp,
     isAngleBetween,
 } from './arrow-helpers';
-import { styled } from '@toeverything/components/ui';
-import {
-    TextLabel,
-    getFontStyle,
-    getShapeStyle,
-    getTextLabelSize,
-    LabelMask,
-} from '../shared';
-import { StraightArrow } from './components/straight-arrow';
 import { CurvedArrow } from './components/curved-arrow';
+import { StraightArrow } from './components/straight-arrow';
 
 type T = ArrowShape;
 type E = HTMLDivElement;

libs/components/board-shapes/src/arrow-util/components/arrow-head.tsx

@@ -1,5 +1,3 @@
-import * as React from 'react';
-
 export interface ArrowheadProps {
     left: number[];
     middle: number[];

libs/components/board-shapes/src/arrow-util/components/curved-arrow.tsx

@@ -1,12 +1,12 @@
 import { Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
-import * as React from 'react';
-import { EASINGS } from '@toeverything/components/board-types';
-import { getShapeStyle } from '../../shared';
 import type {
     Decoration,
     ShapeStyles,
 } from '@toeverything/components/board-types';
+import { EASINGS } from '@toeverything/components/board-types';
+import * as React from 'react';
+import { getShapeStyle } from '../../shared';
 import {
     getArcLength,
     getArrowArcPath,

libs/components/board-shapes/src/arrow-util/components/straight-arrow.tsx

@@ -1,11 +1,11 @@
 import { Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
-import * as React from 'react';
-import { getShapeStyle } from '../../shared';
 import type {
     Decoration,
     ShapeStyles,
 } from '@toeverything/components/board-types';
+import * as React from 'react';
+import { getShapeStyle } from '../../shared';
 import {
     getStraightArrowHeadPoints,
     renderFreehandArrowShaft,

libs/components/board-shapes/src/draw-util/DrawUtil.tsx

@@ -1,22 +1,22 @@
-import * as React from 'react';
+import { SVGContainer, TLBounds, Utils } from '@tldraw/core';
-import { Utils, SVGContainer, TLBounds } from '@tldraw/core';
-import { Vec } from '@tldraw/vec';
-import { defaultStyle, getShapeStyle } from '../shared/shape-styles';
-import {
-    DrawShape,
-    DashStyle,
-    TDShapeType,
-    TransformInfo,
-    TDMeta,
-    GHOSTED_OPACITY,
-} from '@toeverything/components/board-types';
-import { TDShapeUtil } from '../TDShapeUtil';
 import {
     intersectBoundsBounds,
     intersectBoundsPolyline,
     intersectLineSegmentBounds,
     intersectLineSegmentLineSegment,
 } from '@tldraw/intersect';
+import { Vec } from '@tldraw/vec';
+import {
+    DashStyle,
+    DrawShape,
+    GHOSTED_OPACITY,
+    TDMeta,
+    TDShapeType,
+    TransformInfo,
+} from '@toeverything/components/board-types';
+import * as React from 'react';
+import { defaultStyle, getShapeStyle } from '../shared/shape-styles';
+import { TDShapeUtil } from '../TDShapeUtil';
 import {
     getDrawStrokePathTDSnapshot,
     getFillPath,

libs/components/board-shapes/src/draw-util/draw-helpers.ts

@@ -1,11 +1,11 @@
 import { Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
+import type { DrawShape } from '@toeverything/components/board-types';
 import {
     getStrokeOutlinePoints,
     getStrokePoints,
     StrokeOptions,
 } from 'perfect-freehand';
-import type { DrawShape } from '@toeverything/components/board-types';
 import { getShapeStyle } from '../shared/shape-styles';
 
 const simulatePressureSettings: StrokeOptions = {

libs/components/board-shapes/src/editor-util/EditorUtil.tsx

@@ -1,24 +1,24 @@
 /* eslint-disable no-restricted-syntax */
-import { useRef, useCallback, useEffect, memo } from 'react';
+import { HTMLContainer, TLBounds, Utils } from '@tldraw/core';
-import type { SyntheticEvent } from 'react';
+import { Vec } from '@tldraw/vec';
-import { Utils, HTMLContainer, TLBounds } from '@tldraw/core';
+import { AffineEditor } from '@toeverything/components/affine-editor';
 import {
     EditorShape,
     TDMeta,
     TDShapeType,
     TransformInfo,
 } from '@toeverything/components/board-types';
+import { MIN_PAGE_WIDTH } from '@toeverything/components/editor-core';
+import { styled } from '@toeverything/components/ui';
+import type { SyntheticEvent } from 'react';
+import { memo, useCallback, useEffect, useRef } from 'react';
 import {
     defaultTextStyle,
     getBoundsRectangle,
     getTextSvgElement,
 } from '../shared';
-import { TDShapeUtil } from '../TDShapeUtil';
 import { getShapeStyle } from '../shared/shape-styles';
-import { styled } from '@toeverything/components/ui';
+import { TDShapeUtil } from '../TDShapeUtil';
-import { Vec } from '@tldraw/vec';
-import { AffineEditor } from '@toeverything/components/affine-editor';
-import { MIN_PAGE_WIDTH } from '@toeverything/components/editor-core';
 const MemoAffineEditor = memo(AffineEditor, (prev, next) => {
     return (
         prev.workspace === next.workspace &&

libs/components/board-shapes/src/ellipse-util/EllipseUtil.tsx

@@ -1,32 +1,32 @@
-import * as React from 'react';
+import { SVGContainer, TLBounds, Utils } from '@tldraw/core';
-import { Utils, SVGContainer, TLBounds } from '@tldraw/core';
-import { Vec } from '@tldraw/vec';
-import {
-    defaultStyle,
-    getShapeStyle,
-    getFontStyle,
-    TextLabel,
-} from '../shared';
-import {
-    EllipseShape,
-    DashStyle,
-    TDShapeType,
-    TDShape,
-    TransformInfo,
-    TDMeta,
-    GHOSTED_OPACITY,
-    LABEL_POINT,
-} from '@toeverything/components/board-types';
-import { TDShapeUtil } from '../TDShapeUtil';
 import {
     intersectEllipseBounds,
     intersectLineSegmentEllipse,
     intersectRayEllipse,
 } from '@tldraw/intersect';
-import { getEllipseIndicatorPath } from './ellipse-helpers';
+import { Vec } from '@tldraw/vec';
-import { DrawEllipse } from './components/DrawEllipse';
+import {
-import { DashedEllipse } from './components/DashedEllipse';
+    DashStyle,
+    EllipseShape,
+    GHOSTED_OPACITY,
+    LABEL_POINT,
+    TDMeta,
+    TDShape,
+    TDShapeType,
+    TransformInfo,
+} from '@toeverything/components/board-types';
 import { styled } from '@toeverything/components/ui';
+import * as React from 'react';
+import {
+    defaultStyle,
+    getFontStyle,
+    getShapeStyle,
+    TextLabel,
+} from '../shared';
+import { TDShapeUtil } from '../TDShapeUtil';
+import { DashedEllipse } from './components/DashedEllipse';
+import { DrawEllipse } from './components/DrawEllipse';
+import { getEllipseIndicatorPath } from './ellipse-helpers';
 
 type T = EllipseShape;
 type E = HTMLDivElement;

libs/components/board-shapes/src/ellipse-util/components/DashedEllipse.tsx

@@ -1,6 +1,6 @@
-import * as React from 'react';
 import { Utils } from '@tldraw/core';
 import type { ShapeStyles } from '@toeverything/components/board-types';
+import * as React from 'react';
 import { getShapeStyle } from '../../shared';
 
 interface EllipseSvgProps {

libs/components/board-shapes/src/ellipse-util/components/DrawEllipse.tsx

@@ -1,6 +1,6 @@
+import type { ShapeStyles } from '@toeverything/components/board-types';
 import * as React from 'react';
 import { getShapeStyle } from '../../shared';
-import type { ShapeStyles } from '@toeverything/components/board-types';
 import { getEllipseIndicatorPath, getEllipsePath } from '../ellipse-helpers';
 
 interface EllipseSvgProps {

libs/components/board-shapes/src/ellipse-util/ellipse-helpers.ts

@@ -1,7 +1,7 @@
 import { Utils } from '@tldraw/core';
-import { getStrokeOutlinePoints, getStrokePoints } from 'perfect-freehand';
-import { EASINGS } from '@toeverything/components/board-types';
 import type { ShapeStyles } from '@toeverything/components/board-types';
+import { EASINGS } from '@toeverything/components/board-types';
+import { getStrokeOutlinePoints, getStrokePoints } from 'perfect-freehand';
 import { getShapeStyle } from '../shared/shape-styles';
 
 export function getEllipseStrokePoints(

libs/components/board-shapes/src/frame-util/FrameUtil.tsx

@@ -1,20 +1,20 @@
 /* eslint-disable no-restricted-syntax */
-import { Utils, SVGContainer } from '@tldraw/core';
+import { SVGContainer, Utils } from '@tldraw/core';
 import {
     FrameShape,
-    TDShapeType,
     TDMeta,
+    TDShapeType,
 } from '@toeverything/components/board-types';
-import { TDShapeUtil } from '../TDShapeUtil';
+import { styled } from '@toeverything/components/ui';
 import {
     defaultStyle,
-    getShapeStyle,
     getBoundsRectangle,
+    getShapeStyle,
     transformRectangle,
     transformSingleRectangle,
 } from '../shared';
+import { TDShapeUtil } from '../TDShapeUtil';
 import { Frame } from './components/Frame';
-import { styled } from '@toeverything/components/ui';
 
 type T = FrameShape;
 type E = SVGSVGElement;

libs/components/board-shapes/src/frame-util/components/Frame.tsx

@@ -1,6 +1,6 @@
-import * as React from 'react';
-import { BINDING_DISTANCE } from '@toeverything/components/board-types';
 import type { ShapeStyles } from '@toeverything/components/board-types';
+import { BINDING_DISTANCE } from '@toeverything/components/board-types';
+import * as React from 'react';
 import { getShapeStyle } from '../../shared';
 
 interface RectangleSvgProps {

libs/components/board-shapes/src/frame-util/components/frame-binding-indicator.tsx

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { BINDING_DISTANCE } from '@toeverything/components/board-types';
 
 interface BindingIndicatorProps {

libs/components/board-shapes/src/group-util/group-util.tsx

@@ -1,15 +1,14 @@
-import * as React from 'react';
+import { SVGContainer, Utils } from '@tldraw/core';
-import { styled } from '@toeverything/components/ui';
-import { Utils, SVGContainer } from '@tldraw/core';
-import { defaultStyle } from '../shared/shape-styles';
 import {
-    TDShapeType,
+    GHOSTED_OPACITY,
     GroupShape,
     TDMeta,
-    GHOSTED_OPACITY,
+    TDShapeType,
 } from '@toeverything/components/board-types';
+import { styled } from '@toeverything/components/ui';
+import { commonColors, getBoundsRectangle } from '../shared';
+import { defaultStyle } from '../shared/shape-styles';
 import { TDShapeUtil } from '../TDShapeUtil';
-import { getBoundsRectangle, commonColors } from '../shared';
 
 type T = GroupShape;
 type E = SVGSVGElement;

libs/components/board-shapes/src/hexagon-util/HexagonUtil.tsx

@@ -1,36 +1,36 @@
-import * as React from 'react';
+import { SVGContainer, TLBounds, Utils } from '@tldraw/core';
-import { Utils, SVGContainer, TLBounds } from '@tldraw/core';
-import {
-    HexagonShape,
-    TDShapeType,
-    TDMeta,
-    TDShape,
-    DashStyle,
-    BINDING_DISTANCE,
-    GHOSTED_OPACITY,
-    LABEL_POINT,
-} from '@toeverything/components/board-types';
-import { TDShapeUtil } from '../TDShapeUtil';
-import {
-    defaultStyle,
-    getBoundsRectangle,
-    transformRectangle,
-    transformSingleRectangle,
-    getFontStyle,
-    TextLabel,
-    getShapeStyle,
-} from '../shared';
 import {
     intersectBoundsPolygon,
     intersectLineSegmentPolyline,
     intersectRayLineSegment,
 } from '@tldraw/intersect';
 import Vec from '@tldraw/vec';
-import { getHexagonCentroid, getHexagonPoints } from './hexagon-helpers';
+import {
+    BINDING_DISTANCE,
+    DashStyle,
+    GHOSTED_OPACITY,
+    HexagonShape,
+    LABEL_POINT,
+    TDMeta,
+    TDShape,
+    TDShapeType,
+} from '@toeverything/components/board-types';
 import { styled } from '@toeverything/components/ui';
-import { DrawHexagon } from './components/DrawHexagon';
+import * as React from 'react';
+import {
+    defaultStyle,
+    getBoundsRectangle,
+    getFontStyle,
+    getShapeStyle,
+    TextLabel,
+    transformRectangle,
+    transformSingleRectangle,
+} from '../shared';
+import { TDShapeUtil } from '../TDShapeUtil';
 import { DashedHexagon } from './components/DashedHexagon';
+import { DrawHexagon } from './components/DrawHexagon';
 import { HexagonBindingIndicator } from './components/HexagonBindingIndicator';
+import { getHexagonCentroid, getHexagonPoints } from './hexagon-helpers';
 
 type T = HexagonShape;
 type E = HTMLDivElement;

libs/components/board-shapes/src/hexagon-util/components/DashedHexagon.tsx

@@ -1,9 +1,9 @@
-import * as React from 'react';
 import { Utils } from '@tldraw/core';
+import Vec from '@tldraw/vec';
 import type { ShapeStyles } from '@toeverything/components/board-types';
+import * as React from 'react';
 import { getShapeStyle } from '../../shared';
 import { getHexagonPoints } from '../hexagon-helpers';
-import Vec from '@tldraw/vec';
 
 interface HexagonSvgProps {
     id: string;

libs/components/board-shapes/src/hexagon-util/components/DrawHexagon.tsx

@@ -1,6 +1,6 @@
+import type { ShapeStyles } from '@toeverything/components/board-types';
 import * as React from 'react';
 import { getShapeStyle } from '../../shared';
-import type { ShapeStyles } from '@toeverything/components/board-types';
 import {
     getHexagonIndicatorPathTDSnapshot,
     getHexagonPath,

libs/components/board-shapes/src/hexagon-util/components/HexagonBindingIndicator.tsx

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { BINDING_DISTANCE } from '@toeverything/components/board-types';
 import { getHexagonPoints } from '../hexagon-helpers';
 

libs/components/board-shapes/src/hexagon-util/hexagon-helpers.ts

@@ -1,8 +1,8 @@
 import { Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
-import getStroke, { getStrokePoints } from 'perfect-freehand';
 import type { ShapeStyles } from '@toeverything/components/board-types';
-import { getShapeStyle, getOffsetPolygon } from '../shared';
+import getStroke, { getStrokePoints } from 'perfect-freehand';
+import { getOffsetPolygon, getShapeStyle } from '../shared';
 function getPonits(w: number, h: number) {
     return [
         [w / 5, 0],

libs/components/board-shapes/src/image-util/image-util.tsx

@@ -1,20 +1,20 @@
-import * as React from 'react';
+import { HTMLContainer, Utils } from '@tldraw/core';
-import { Utils, HTMLContainer } from '@tldraw/core';
 import {
-    TDShapeType,
+    GHOSTED_OPACITY,
-    TDMeta,
     ImageShape,
     TDImageAsset,
-    GHOSTED_OPACITY,
+    TDMeta,
+    TDShapeType,
 } from '@toeverything/components/board-types';
-import { TDShapeUtil } from '../TDShapeUtil';
+import { styled } from '@toeverything/components/ui';
+import * as React from 'react';
 import {
     defaultStyle,
     getBoundsRectangle,
     transformRectangle,
     transformSingleRectangle,
 } from '../shared';
-import { styled } from '@toeverything/components/ui';
+import { TDShapeUtil } from '../TDShapeUtil';
 
 type T = ImageShape;
 type E = HTMLDivElement;

libs/components/board-shapes/src/index.ts

@@ -1,20 +1,23 @@
 import { TDShape, TDShapeType } from '@toeverything/components/board-types';
-import type { TDShapeUtil } from './TDShapeUtil';
-import { RectangleUtil } from './rectangle-util';
-import { TriangleUtil } from './triangle-util';
-import { HexagonUtil } from './hexagon-util';
 import { ArrowUtil } from './arrow-util';
 import { DrawUtil } from './draw-util';
-import { EllipseUtil } from './ellipse-util';
-import { GroupUtil } from './group-util';
-import { ImageUtil } from './image-util';
-import { VideoUtil } from './video-util';
 import { EditorUtil } from './editor-util';
-import { PentagramUtil } from './pentagram-util';
+import { EllipseUtil } from './ellipse-util';
-import { WhiteArrowUtil } from './white-arrow-util';
 import { FrameUtil } from './frame-util';
+import { GroupUtil } from './group-util';
+import { HexagonUtil } from './hexagon-util';
+import { ImageUtil } from './image-util';
+import { PentagramUtil } from './pentagram-util';
+import { RectangleUtil } from './rectangle-util';
+import type { TDShapeUtil } from './TDShapeUtil';
+import { TriangleUtil } from './triangle-util';
+import { VideoUtil } from './video-util';
+import { WhiteArrowUtil } from './white-arrow-util';
 
+export { clearPrevSize } from './shared/get-text-size';
+export { defaultStyle } from './shared/shape-styles';
 export { TDShapeUtil } from './TDShapeUtil';
+export { getTrianglePoints } from './triangle-util/triangle-helpers';
 
 export const Rectangle = new RectangleUtil();
 export const Triangle = new TriangleUtil();
@@ -54,7 +57,3 @@ export const getShapeUtil = <T extends TDShape>(
         return shapeUtils[shape] as unknown as TDShapeUtil<T>;
     return shapeUtils[shape.type] as unknown as TDShapeUtil<T>;
 };
-
-export { getTrianglePoints } from './triangle-util/triangle-helpers';
-export { defaultStyle } from './shared/shape-styles';
-export { clearPrevSize } from './shared/get-text-size';

libs/components/board-shapes/src/pentagram-util/PentagramUtil.tsx

@@ -1,36 +1,36 @@
-import * as React from 'react';
+import { SVGContainer, TLBounds, Utils } from '@tldraw/core';
-import { Utils, SVGContainer, TLBounds } from '@tldraw/core';
-import {
-    PentagramShape,
-    TDShapeType,
-    TDMeta,
-    TDShape,
-    DashStyle,
-    BINDING_DISTANCE,
-    GHOSTED_OPACITY,
-    LABEL_POINT,
-} from '@toeverything/components/board-types';
-import { TDShapeUtil } from '../TDShapeUtil';
-import {
-    defaultStyle,
-    getBoundsRectangle,
-    transformRectangle,
-    transformSingleRectangle,
-    getFontStyle,
-    TextLabel,
-    getShapeStyle,
-} from '../shared';
 import {
     intersectBoundsPolygon,
     intersectLineSegmentPolyline,
     intersectRayLineSegment,
 } from '@tldraw/intersect';
 import Vec from '@tldraw/vec';
-import { getPentagramCentroid, getPentagramPoints } from './pentagram-helpers';
+import {
+    BINDING_DISTANCE,
+    DashStyle,
+    GHOSTED_OPACITY,
+    LABEL_POINT,
+    PentagramShape,
+    TDMeta,
+    TDShape,
+    TDShapeType,
+} from '@toeverything/components/board-types';
 import { styled } from '@toeverything/components/ui';
-import { DrawPentagram } from './components/DrawPentagram';
+import * as React from 'react';
+import {
+    defaultStyle,
+    getBoundsRectangle,
+    getFontStyle,
+    getShapeStyle,
+    TextLabel,
+    transformRectangle,
+    transformSingleRectangle,
+} from '../shared';
+import { TDShapeUtil } from '../TDShapeUtil';
 import { DashedPentagram } from './components/DashedPentagram';
+import { DrawPentagram } from './components/DrawPentagram';
 import { PentagramBindingIndicator } from './components/PentagramBindingIndicator';
+import { getPentagramCentroid, getPentagramPoints } from './pentagram-helpers';
 
 type T = PentagramShape;
 type E = HTMLDivElement;

libs/components/board-shapes/src/pentagram-util/components/DashedPentagram.tsx

@@ -1,9 +1,9 @@
-import * as React from 'react';
 import { Utils } from '@tldraw/core';
+import Vec from '@tldraw/vec';
 import type { ShapeStyles } from '@toeverything/components/board-types';
+import * as React from 'react';
 import { getShapeStyle } from '../../shared';
 import { getPentagramPoints } from '../pentagram-helpers';
-import Vec from '@tldraw/vec';
 
 interface PentagramSvgProps {
     id: string;

libs/components/board-shapes/src/pentagram-util/components/DrawPentagram.tsx

@@ -1,6 +1,6 @@
+import type { ShapeStyles } from '@toeverything/components/board-types';
 import * as React from 'react';
 import { getShapeStyle } from '../../shared';
-import type { ShapeStyles } from '@toeverything/components/board-types';
 import {
     getPentagramIndicatorPathTDSnapshot,
     getPentagramPath,

libs/components/board-shapes/src/pentagram-util/components/PentagramBindingIndicator.tsx

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { BINDING_DISTANCE } from '@toeverything/components/board-types';
 import { getPentagramPoints } from '../pentagram-helpers';
 

libs/components/board-shapes/src/pentagram-util/pentagram-helpers.ts

@@ -1,8 +1,8 @@
 import { Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
-import getStroke, { getStrokePoints } from 'perfect-freehand';
 import type { ShapeStyles } from '@toeverything/components/board-types';
-import { getShapeStyle, getOffsetPolygon } from '../shared';
+import getStroke, { getStrokePoints } from 'perfect-freehand';
+import { getOffsetPolygon, getShapeStyle } from '../shared';
 function getPonits(w: number, h: number) {
     return [
         [0, (76 / 200) * h],

libs/components/board-shapes/src/rectangle-util/RectangleUtil.tsx

@@ -1,28 +1,28 @@
-import * as React from 'react';
+import { SVGContainer, Utils } from '@tldraw/core';
-import { Utils, SVGContainer } from '@tldraw/core';
 import {
-    RectangleShape,
     DashStyle,
-    TDShapeType,
-    TDMeta,
     GHOSTED_OPACITY,
     LABEL_POINT,
+    RectangleShape,
+    TDMeta,
+    TDShapeType,
 } from '@toeverything/components/board-types';
-import { TDShapeUtil } from '../TDShapeUtil';
+import { styled } from '@toeverything/components/ui';
+import * as React from 'react';
 import {
     defaultStyle,
-    getShapeStyle,
     getBoundsRectangle,
-    transformRectangle,
     getFontStyle,
+    getShapeStyle,
+    transformRectangle,
     transformSingleRectangle,
 } from '../shared';
 import { TextLabel } from '../shared/text-label';
-import { getRectangleIndicatorPathTDSnapshot } from './rectangle-helpers';
+import { TDShapeUtil } from '../TDShapeUtil';
-import { DrawRectangle } from './components/DrawRectangle';
-import { DashedRectangle } from './components/DashedRectangle';
 import { BindingIndicator } from './components/BindingIndicator';
-import { styled } from '@toeverything/components/ui';
+import { DashedRectangle } from './components/DashedRectangle';
+import { DrawRectangle } from './components/DrawRectangle';
+import { getRectangleIndicatorPathTDSnapshot } from './rectangle-helpers';
 
 type T = RectangleShape;
 type E = HTMLDivElement;

libs/components/board-shapes/src/rectangle-util/components/BindingIndicator.tsx

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { BINDING_DISTANCE } from '@toeverything/components/board-types';
 
 interface BindingIndicatorProps {

libs/components/board-shapes/src/rectangle-util/components/DashedRectangle.tsx

@@ -1,7 +1,7 @@
-import * as React from 'react';
 import { Utils } from '@tldraw/core';
-import { BINDING_DISTANCE } from '@toeverything/components/board-types';
 import type { ShapeStyles } from '@toeverything/components/board-types';
+import { BINDING_DISTANCE } from '@toeverything/components/board-types';
+import * as React from 'react';
 import { getShapeStyle } from '../../shared';
 
 interface RectangleSvgProps {

libs/components/board-shapes/src/rectangle-util/components/DrawRectangle.tsx

@@ -1,6 +1,6 @@
+import type { ShapeStyles } from '@toeverything/components/board-types';
 import * as React from 'react';
 import { getShapeStyle } from '../../shared';
-import type { ShapeStyles } from '@toeverything/components/board-types';
 import {
     getRectangleIndicatorPathTDSnapshot,
     getRectanglePath,

libs/components/board-shapes/src/rectangle-util/rectangle-helpers.ts

@@ -1,7 +1,7 @@
 import { Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
-import getStroke, { getStrokePoints } from 'perfect-freehand';
 import type { ShapeStyles } from '@toeverything/components/board-types';
+import getStroke, { getStrokePoints } from 'perfect-freehand';
 import { getShapeStyle } from '../shared';
 
 function getRectangleDrawPoints(

libs/components/board-shapes/src/shared/get-text-svg-element.ts

@@ -1,11 +1,11 @@
 import type { TLBounds } from '@tldraw/core';
-import { getFontFace, getFontSize } from './shape-styles';
-import { getTextAlign } from './get-text-align';
 import {
-    LINE_HEIGHT,
     AlignStyle,
+    LINE_HEIGHT,
     ShapeStyles,
 } from '@toeverything/components/board-types';
+import { getTextAlign } from './get-text-align';
+import { getFontFace, getFontSize } from './shape-styles';
 
 export function getTextSvgElement(
     text: string,

libs/components/board-shapes/src/shared/index.ts

@@ -1,12 +1,12 @@
+export * from './get-bounds-rectangle';
 export * from './get-text-align';
 export * from './get-text-size';
 export * from './get-text-svg-element';
-export * from './shape-styles';
-export * from './get-bounds-rectangle';
-export * from './transform-rectangle';
-export * from './transform-single-rectangle';
-export * from './text-label';
-export * from './polygon-utils';
 export * from './label-mask';
 export * from './normalize-text';
+export * from './polygon-utils';
+export * from './shape-styles';
 export * from './stop-propagation';
+export * from './text-label';
+export * from './transform-rectangle';
+export * from './transform-single-rectangle';

libs/components/board-shapes/src/shared/label-mask.tsx

@@ -1,5 +1,4 @@
 import type { TLBounds } from '@tldraw/core';
-import * as React from 'react';
 
 interface WithLabelMaskProps {
     id: string;

libs/components/board-shapes/src/shared/shape-styles.ts

@@ -1,13 +1,13 @@
 import { Utils } from '@tldraw/core';
 import {
-    Theme,
+    AlignStyle,
     ColorStyle,
     DashStyle,
-    ShapeStyles,
     FontSizeStyle,
     FontStyle,
-    AlignStyle,
+    ShapeStyles,
     StrokeWidth,
+    Theme,
 } from '@toeverything/components/board-types';
 
 const canvasLight = '#fafafa';

libs/components/board-shapes/src/shared/text-label.tsx

@@ -1,12 +1,12 @@
-import * as React from 'react';
-import { stopPropagation } from './stop-propagation';
 import {
     GHOSTED_OPACITY,
     LETTER_SPACING,
 } from '@toeverything/components/board-types';
-import { normalizeText } from './normalize-text';
 import { styled } from '@toeverything/components/ui';
+import * as React from 'react';
 import { getTextLabelSize } from './get-text-size';
+import { normalizeText } from './normalize-text';
+import { stopPropagation } from './stop-propagation';
 import { TextAreaUtils } from './text-area-utils';
 
 export interface TextLabelProps {

libs/components/board-shapes/src/triangle-util/TriangleUtil.tsx

@@ -1,36 +1,36 @@
-import * as React from 'react';
+import { SVGContainer, TLBounds, Utils } from '@tldraw/core';
-import { Utils, SVGContainer, TLBounds } from '@tldraw/core';
-import {
-    TriangleShape,
-    TDShapeType,
-    TDMeta,
-    TDShape,
-    DashStyle,
-    BINDING_DISTANCE,
-    GHOSTED_OPACITY,
-    LABEL_POINT,
-} from '@toeverything/components/board-types';
-import { TDShapeUtil } from '../TDShapeUtil';
-import {
-    defaultStyle,
-    getBoundsRectangle,
-    transformRectangle,
-    transformSingleRectangle,
-    getFontStyle,
-    TextLabel,
-    getShapeStyle,
-} from '../shared';
 import {
     intersectBoundsPolygon,
     intersectLineSegmentPolyline,
     intersectRayLineSegment,
 } from '@tldraw/intersect';
 import Vec from '@tldraw/vec';
-import { getTriangleCentroid, getTrianglePoints } from './triangle-helpers';
+import {
+    BINDING_DISTANCE,
+    DashStyle,
+    GHOSTED_OPACITY,
+    LABEL_POINT,
+    TDMeta,
+    TDShape,
+    TDShapeType,
+    TriangleShape,
+} from '@toeverything/components/board-types';
 import { styled } from '@toeverything/components/ui';
-import { DrawTriangle } from './components/DrawTriangle';
+import * as React from 'react';
+import {
+    defaultStyle,
+    getBoundsRectangle,
+    getFontStyle,
+    getShapeStyle,
+    TextLabel,
+    transformRectangle,
+    transformSingleRectangle,
+} from '../shared';
+import { TDShapeUtil } from '../TDShapeUtil';
 import { DashedTriangle } from './components/DashedTriangle';
+import { DrawTriangle } from './components/DrawTriangle';
 import { TriangleBindingIndicator } from './components/TriangleBindingIndicator';
+import { getTriangleCentroid, getTrianglePoints } from './triangle-helpers';
 
 type T = TriangleShape;
 type E = HTMLDivElement;

libs/components/board-shapes/src/triangle-util/components/DashedTriangle.tsx

@@ -1,9 +1,9 @@
-import * as React from 'react';
 import { Utils } from '@tldraw/core';
+import Vec from '@tldraw/vec';
 import type { ShapeStyles } from '@toeverything/components/board-types';
+import * as React from 'react';
 import { getShapeStyle } from '../../shared';
 import { getTrianglePoints } from '../triangle-helpers';
-import Vec from '@tldraw/vec';
 
 interface TriangleSvgProps {
     id: string;

libs/components/board-shapes/src/triangle-util/components/DrawTriangle.tsx

@@ -1,6 +1,6 @@
+import type { ShapeStyles } from '@toeverything/components/board-types';
 import * as React from 'react';
 import { getShapeStyle } from '../../shared';
-import type { ShapeStyles } from '@toeverything/components/board-types';
 import {
     getTriangleIndicatorPathTDSnapshot,
     getTrianglePath,

libs/components/board-shapes/src/triangle-util/components/TriangleBindingIndicator.tsx

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { BINDING_DISTANCE } from '@toeverything/components/board-types';
 import { getTrianglePoints } from '../triangle-helpers';
 

libs/components/board-shapes/src/triangle-util/triangle-helpers.ts

@@ -1,8 +1,8 @@
 import { Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
-import getStroke, { getStrokePoints } from 'perfect-freehand';
 import type { ShapeStyles } from '@toeverything/components/board-types';
-import { getShapeStyle, getOffsetPolygon } from '../shared';
+import getStroke, { getStrokePoints } from 'perfect-freehand';
+import { getOffsetPolygon, getShapeStyle } from '../shared';
 
 export function getTrianglePoints(size: number[], offset = 0, rotation = 0) {
     const [w, h] = size;

libs/components/board-shapes/src/video-util/video-util.tsx

@@ -1,20 +1,20 @@
-import * as React from 'react';
+import { HTMLContainer, Utils } from '@tldraw/core';
-import { Utils, HTMLContainer } from '@tldraw/core';
 import {
-    TDShapeType,
-    TDMeta,
-    VideoShape,
-    TDVideoAsset,
     GHOSTED_OPACITY,
+    TDMeta,
+    TDShapeType,
+    TDVideoAsset,
+    VideoShape,
 } from '@toeverything/components/board-types';
-import { TDShapeUtil } from '../TDShapeUtil';
+import { styled } from '@toeverything/components/ui';
+import * as React from 'react';
 import {
     defaultStyle,
     getBoundsRectangle,
     transformRectangle,
     transformSingleRectangle,
 } from '../shared';
-import { styled } from '@toeverything/components/ui';
+import { TDShapeUtil } from '../TDShapeUtil';
 
 type T = VideoShape;
 type E = HTMLDivElement;

libs/components/board-shapes/src/white-arrow-util/WhiteArrowUtil.tsx

@@ -1,39 +1,39 @@
-import * as React from 'react';
+import { SVGContainer, TLBounds, Utils } from '@tldraw/core';
-import { Utils, SVGContainer, TLBounds } from '@tldraw/core';
-import {
-    WhiteArrowShape,
-    TDShapeType,
-    TDMeta,
-    TDShape,
-    DashStyle,
-    BINDING_DISTANCE,
-    GHOSTED_OPACITY,
-    LABEL_POINT,
-} from '@toeverything/components/board-types';
-import { TDShapeUtil } from '../TDShapeUtil';
-import {
-    defaultStyle,
-    getBoundsRectangle,
-    transformRectangle,
-    transformSingleRectangle,
-    getFontStyle,
-    TextLabel,
-    getShapeStyle,
-} from '../shared';
 import {
     intersectBoundsPolygon,
     intersectLineSegmentPolyline,
     intersectRayLineSegment,
 } from '@tldraw/intersect';
 import Vec from '@tldraw/vec';
+import {
+    BINDING_DISTANCE,
+    DashStyle,
+    GHOSTED_OPACITY,
+    LABEL_POINT,
+    TDMeta,
+    TDShape,
+    TDShapeType,
+    WhiteArrowShape,
+} from '@toeverything/components/board-types';
+import { styled } from '@toeverything/components/ui';
+import * as React from 'react';
+import {
+    defaultStyle,
+    getBoundsRectangle,
+    getFontStyle,
+    getShapeStyle,
+    TextLabel,
+    transformRectangle,
+    transformSingleRectangle,
+} from '../shared';
+import { TDShapeUtil } from '../TDShapeUtil';
+import { DashedWhiteArrow } from './components/DashedWhiteArrow';
+import { DrawWhiteArrow } from './components/DrawWhiteArrow';
+import { WhiteArrowBindingIndicator } from './components/WhiteArrowBindingIndicator';
 import {
     getWhiteArrowCentroid,
     getWhiteArrowPoints,
 } from './white-arrow-helpers';
-import { styled } from '@toeverything/components/ui';
-import { DrawWhiteArrow } from './components/DrawWhiteArrow';
-import { DashedWhiteArrow } from './components/DashedWhiteArrow';
-import { WhiteArrowBindingIndicator } from './components/WhiteArrowBindingIndicator';
 
 type T = WhiteArrowShape;
 type E = HTMLDivElement;

libs/components/board-shapes/src/white-arrow-util/components/DashedWhiteArrow.tsx

@@ -1,9 +1,9 @@
-import * as React from 'react';
 import { Utils } from '@tldraw/core';
+import Vec from '@tldraw/vec';
 import type { ShapeStyles } from '@toeverything/components/board-types';
+import * as React from 'react';
 import { getShapeStyle } from '../../shared';
 import { getWhiteArrowPoints } from '../white-arrow-helpers';
-import Vec from '@tldraw/vec';
 
 interface WhiteArrowSvgProps {
     id: string;

libs/components/board-shapes/src/white-arrow-util/components/DrawWhiteArrow.tsx

@@ -1,6 +1,6 @@
+import type { ShapeStyles } from '@toeverything/components/board-types';
 import * as React from 'react';
 import { getShapeStyle } from '../../shared';
-import type { ShapeStyles } from '@toeverything/components/board-types';
 import {
     getWhiteArrowIndicatorPathTDSnapshot,
     getWhiteArrowPath,

libs/components/board-shapes/src/white-arrow-util/components/WhiteArrowBindingIndicator.tsx

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { BINDING_DISTANCE } from '@toeverything/components/board-types';
 import { getWhiteArrowPoints } from '../white-arrow-helpers';
 

libs/components/board-shapes/src/white-arrow-util/white-arrow-helpers.ts

@@ -1,8 +1,8 @@
 import { Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
-import getStroke, { getStrokePoints } from 'perfect-freehand';
 import type { ShapeStyles } from '@toeverything/components/board-types';
-import { getShapeStyle, getOffsetPolygon } from '../shared';
+import getStroke, { getStrokePoints } from 'perfect-freehand';
+import { getOffsetPolygon, getShapeStyle } from '../shared';
 function getPonits(w: number, h: number) {
     return [
         [w / 2, 0],

libs/components/board-state/src/data/filesystem.ts

@@ -1,11 +1,11 @@
 /* eslint-disable @typescript-eslint/ban-ts-comment */
 import type { TDDocument, TDFile } from '@toeverything/components/board-types';
-import type { FileSystemHandle } from './browser-fs-access';
-import { get as getFromIdb, set as setToIdb } from 'idb-keyval';
 import {
     IMAGE_EXTENSIONS,
     VIDEO_EXTENSIONS,
 } from '@toeverything/components/board-types';
+import { get as getFromIdb, set as setToIdb } from 'idb-keyval';
+import type { FileSystemHandle } from './browser-fs-access';
 
 const options = { mode: 'readwrite' as const };
 

libs/components/board-state/src/data/index.ts

@@ -1,3 +1,3 @@
-export * from './migrate';
-export * from './filesystem';
 export * from './browser-fs-access';
+export * from './filesystem';
+export * from './migrate';

libs/components/board-state/src/data/migrate.spec.ts

@@ -1,7 +1,7 @@
-import type { TDDocument } from '~types';
 import { TldrawApp } from '~state';
 import oldDoc from '~test/documents/old-doc';
 import oldDoc2 from '~test/documents/old-doc-2';
+import type { TDDocument } from '~types';
 
 describe('When migrating bindings', () => {
     it('migrates a document without a version', () => {

libs/components/board-state/src/data/migrate.ts

@@ -1,10 +1,8 @@
 /* eslint-disable @typescript-eslint/ban-ts-comment */
 import {
     Decoration,
-    FontStyle,
     TDDocument,
     TDShapeType,
-    // TextShape
 } from '@toeverything/components/board-types';
 
 export function migrate(document: TDDocument, newVersion: number): TDDocument {

libs/components/board-state/src/idb-clipboard.ts

@@ -1,4 +1,4 @@
-import { get, set, del } from 'idb-keyval';
+import { del, get, set } from 'idb-keyval';
 
 // Used for clipboard
 

libs/components/board-state/src/index.ts

@@ -1,5 +1,5 @@
+export { deepCopy } from './manager/deep-copy';
+export { TLDR } from './tldr';
 export { TldrawApp } from './tldraw-app';
 export type { TldrawAppCtorProps } from './tldraw-app';
-export { TLDR } from './tldr';
-export { deepCopy } from './manager/deep-copy';
 export { BaseTool, Status as BaseToolStatus } from './types/tool';

libs/components/board-state/src/manager/state-manager.ts

@@ -1,9 +1,9 @@
-import createVanilla, { StoreApi } from 'zustand/vanilla';
-import create, { UseBoundStore } from 'zustand';
-import * as idb from 'idb-keyval';
-import { deepCopy } from './deep-copy';
-import type { Patch, Command } from '@toeverything/components/board-types';
 import { Utils } from '@tldraw/core';
+import type { Command, Patch } from '@toeverything/components/board-types';
+import * as idb from 'idb-keyval';
+import create, { UseBoundStore } from 'zustand';
+import createVanilla, { StoreApi } from 'zustand/vanilla';
+import { deepCopy } from './deep-copy';
 
 export class StateManager<T extends Record<string, any>> {
     /**

libs/components/board-state/src/tldr.ts

@@ -1,31 +1,31 @@
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
-import { TLBounds, TLTransformInfo, Utils, TLPageState } from '@tldraw/core';
+import { TLBounds, TLPageState, TLTransformInfo, Utils } from '@tldraw/core';
 import {
-    TDSnapshot,
+    intersectRayBounds,
-    ShapesWithProp,
+    intersectRayEllipse,
-    TDShape,
+    intersectRayLineSegment,
-    TDBinding,
+} from '@tldraw/intersect';
-    TDPage,
-    TldrawCommand,
-    TldrawPatch,
-    TDShapeType,
-    ArrowShape,
-    TDHandle,
-    TDExportType,
-    BINDING_DISTANCE,
-} from '@toeverything/components/board-types';
 import { Vec } from '@tldraw/vec';
 import type { TDShapeUtil } from '@toeverything/components/board-shapes';
 import {
     getShapeUtil,
     getTrianglePoints,
 } from '@toeverything/components/board-shapes';
-import { deepCopy } from './manager/deep-copy';
 import {
-    intersectRayBounds,
+    ArrowShape,
-    intersectRayEllipse,
+    BINDING_DISTANCE,
-    intersectRayLineSegment,
+    ShapesWithProp,
-} from '@tldraw/intersect';
+    TDBinding,
+    TDExportType,
+    TDHandle,
+    TDPage,
+    TDShape,
+    TDShapeType,
+    TDSnapshot,
+    TldrawCommand,
+    TldrawPatch,
+} from '@toeverything/components/board-types';
+import { deepCopy } from './manager/deep-copy';
 
 const isDev = process.env['NODE_ENV'] === 'development';
 

libs/components/board-state/src/tldraw-app.ts

@@ -3,77 +3,77 @@
 /* eslint-disable @typescript-eslint/ban-ts-comment */
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
 /* eslint-disable no-restricted-syntax */
-import { Vec } from '@tldraw/vec';
 import {
+    TLBounds,
     TLBoundsEventHandler,
     TLBoundsHandleEventHandler,
-    TLKeyboardEventHandler,
-    TLShapeCloneHandler,
     TLCanvasEventHandler,
+    TLDropEventHandler,
+    TLKeyboardEventHandler,
     TLPageState,
     TLPinchEventHandler,
     TLPointerEventHandler,
+    TLShapeCloneHandler,
     TLWheelEventHandler,
     Utils,
-    TLBounds,
-    TLDropEventHandler,
 } from '@tldraw/core';
+import { Vec } from '@tldraw/vec';
+import {
+    clearPrevSize,
+    defaultStyle,
+    shapeUtils,
+} from '@toeverything/components/board-shapes';
 import {
-    FlipType,
-    TDDocument,
-    MoveType,
     AlignType,
-    StretchType,
+    ArrowShape,
+    BaseSessionType,
     DistributeType,
+    FIT_TO_SCREEN_PADDING,
+    FlipType,
+    GRID_SIZE,
+    GroupShape,
+    IMAGE_EXTENSIONS,
+    MoveType,
+    SessionType,
     ShapeStyles,
+    StretchType,
+    SVG_EXPORT_PADDING,
+    TDAsset,
+    TDAssets,
+    TDAssetType,
+    TDBinding,
+    TDDocument,
+    TDExport,
+    TDExportType,
+    TDPage,
     TDShape,
     TDShapeType,
     TDSnapshot,
     TDStatus,
-    TDPage,
-    TDBinding,
-    GroupShape,
-    TldrawCommand,
-    TDUser,
-    SessionType,
     TDToolType,
-    TDAssetType,
+    TDUser,
-    TDAsset,
+    TldrawCommand,
-    TDAssets,
-    TDExport,
-    ArrowShape,
-    TDExportType,
     USER_COLORS,
-    FIT_TO_SCREEN_PADDING,
-    GRID_SIZE,
-    IMAGE_EXTENSIONS,
     VIDEO_EXTENSIONS,
-    SVG_EXPORT_PADDING,
-    BaseSessionType,
 } from '@toeverything/components/board-types';
+import { MIN_PAGE_WIDTH } from '@toeverything/components/editor-core';
 import {
-    migrate,
     FileSystemHandle,
-    loadFileHandle,
-    openFromFileSystem,
-    saveToFileSystem,
-    openAssetFromFileSystem,
     fileToBase64,
     fileToText,
     getImageSizeFromSrc,
     getVideoSizeFromSrc,
+    loadFileHandle,
+    migrate,
+    openAssetFromFileSystem,
+    openFromFileSystem,
+    saveToFileSystem,
 } from './data';
-import { TLDR } from './tldr';
-import {
-    shapeUtils,
-    defaultStyle,
-    clearPrevSize,
-} from '@toeverything/components/board-shapes';
-import { StateManager } from './manager/state-manager';
 import { getClipboard, setClipboard } from './idb-clipboard';
+import { StateManager } from './manager/state-manager';
+import { TLDR } from './tldr';
 import type { Commands } from './types/commands';
 import type { BaseTool } from './types/tool';
-import { MIN_PAGE_WIDTH } from '@toeverything/components/editor-core';
 
 const uuid = Utils.uniqueId();
 

libs/components/board-state/src/types/commands.ts

@@ -1,17 +1,17 @@
 import type { TLBounds } from '@tldraw/core';
-import type { TldrawApp } from '../tldraw-app';
 import type {
-    TldrawCommand,
     AlignType,
-    TDShape,
-    TDBinding,
     DistributeType,
     FlipType,
-    MoveType,
-    StretchType,
-    ShapeStyles,
     GroupShape,
+    MoveType,
+    ShapeStyles,
+    StretchType,
+    TDBinding,
+    TDShape,
+    TldrawCommand,
 } from '@toeverything/components/board-types';
+import type { TldrawApp } from '../tldraw-app';
 
 export interface Commands {
     alignShapes(app: TldrawApp, ids: string[], type: AlignType): TldrawCommand;

libs/components/board-state/src/types/tool.ts

@@ -4,11 +4,11 @@ import {
     TLPointerEventHandler,
     Utils,
 } from '@tldraw/core';
-import type { TldrawApp } from '../tldraw-app';
 import {
     TDEventHandler,
     TDToolType,
 } from '@toeverything/components/board-types';
+import type { TldrawApp } from '../tldraw-app';
 
 export enum Status {
     Idle = 'idle',

libs/components/board-tools/src/arrow-tool/arrow-tool.ts

@@ -1,9 +1,8 @@
-import { Utils, TLPointerEventHandler } from '@tldraw/core';
+import { TLPointerEventHandler, Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
 import { Arrow } from '@toeverything/components/board-shapes';
-import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 import { BaseTool, BaseToolStatus } from '@toeverything/components/board-state';
-import { services } from '@toeverything/datasource/db-service';
+import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 
 export class ArrowTool extends BaseTool {
     override type = TDShapeType.Arrow as const;

libs/components/board-tools/src/draw-tool/draw-tool.ts

@@ -1,7 +1,7 @@
-import { Utils, TLPointerEventHandler } from '@tldraw/core';
+import { TLPointerEventHandler, Utils } from '@tldraw/core';
 import { Draw } from '@toeverything/components/board-shapes';
-import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 import { BaseTool } from '@toeverything/components/board-state';
+import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 
 enum Status {
     Idle = 'idle',

libs/components/board-tools/src/editor-tool/editor-tool.ts

@@ -2,8 +2,8 @@
 import { TLPointerEventHandler } from '@tldraw/core';
 import Vec from '@tldraw/vec';
 import { Editor } from '@toeverything/components/board-shapes';
-import { TDShapeType } from '@toeverything/components/board-types';
 import { BaseTool, BaseToolStatus } from '@toeverything/components/board-state';
+import { TDShapeType } from '@toeverything/components/board-types';
 import { services } from '@toeverything/datasource/db-service';
 
 export class EditorTool extends BaseTool {

libs/components/board-tools/src/ellipse-tool/ellipse-tool.ts

@@ -1,8 +1,8 @@
-import { Utils, TLPointerEventHandler, TLBoundsCorner } from '@tldraw/core';
+import { TLBoundsCorner, TLPointerEventHandler, Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
 import { Ellipse } from '@toeverything/components/board-shapes';
-import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 import { BaseTool, BaseToolStatus } from '@toeverything/components/board-state';
+import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 
 export class EllipseTool extends BaseTool {
     override type = TDShapeType.Ellipse as const;

libs/components/board-tools/src/erase-tool/erase-tool.ts

@@ -1,7 +1,7 @@
-import Vec from '@tldraw/vec';
 import type { TLPointerEventHandler } from '@tldraw/core';
-import { SessionType, DEAD_ZONE } from '@toeverything/components/board-types';
+import Vec from '@tldraw/vec';
 import { BaseTool } from '@toeverything/components/board-state';
+import { DEAD_ZONE, SessionType } from '@toeverything/components/board-types';
 
 enum Status {
     Idle = 'idle',

libs/components/board-tools/src/frame-tool/frame-tool.ts

@@ -1,13 +1,8 @@
-import {
+import { TLBoundsCorner, TLPointerEventHandler, Utils } from '@tldraw/core';
-    Utils,
-    TLPointerEventHandler,
-    TLBoundsCorner,
-    TLBoundsHandleEventHandler,
-} from '@tldraw/core';
 import Vec from '@tldraw/vec';
 import { Frame } from '@toeverything/components/board-shapes';
-import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 import { BaseTool, BaseToolStatus } from '@toeverything/components/board-state';
+import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 
 export class FrameTool extends BaseTool {
     override type = TDShapeType.Frame as const;

libs/components/board-tools/src/hand-draw/hand-draw-tool.ts

@@ -1,9 +1,7 @@
-import { TLPointerEventHandler } from '@tldraw/core';
 // import { Draw } from '@toeverything/components/board-shapes';
-import { Vec } from '@tldraw/vec';
 
-import { TDShapeType } from '@toeverything/components/board-types';
 import { BaseTool } from '@toeverything/components/board-state';
+import { TDShapeType } from '@toeverything/components/board-types';
 
 enum Status {
     Idle = 'idle',

libs/components/board-tools/src/hexagon-tool/hexagon-tool.ts

@@ -1,8 +1,8 @@
-import { Utils, TLPointerEventHandler, TLBoundsCorner } from '@tldraw/core';
+import { TLBoundsCorner, TLPointerEventHandler, Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
 import { Hexagon } from '@toeverything/components/board-shapes';
-import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 import { BaseTool, BaseToolStatus } from '@toeverything/components/board-state';
+import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 
 export class HexagonTool extends BaseTool {
     override type = TDShapeType.Triangle as const;

libs/components/board-tools/src/highlight-tool/highlight-tool.ts

@@ -1,12 +1,12 @@
-import { Utils, TLPointerEventHandler } from '@tldraw/core';
+import { TLPointerEventHandler, Utils } from '@tldraw/core';
 import { Draw } from '@toeverything/components/board-shapes';
-import {
-    SessionType,
-    TDShapeType,
-    DashStyle,
-    StrokeWidth,
-} from '@toeverything/components/board-types';
 import { BaseTool } from '@toeverything/components/board-state';
+import {
+    DashStyle,
+    SessionType,
+    StrokeWidth,
+    TDShapeType,
+} from '@toeverything/components/board-types';
 
 enum Status {
     Idle = 'idle',

libs/components/board-tools/src/index.ts

@@ -1,21 +1,21 @@
 import { TDShapeType, TDToolType } from '@toeverything/components/board-types';
 import { ArrowTool } from './arrow-tool';
-import { LineTool } from './line-tool';
 import { DrawTool } from './draw-tool';
-import { PencilTool } from './pencil-tool';
-import { HighlightTool } from './highlight-tool';
-import { EllipseTool } from './ellipse-tool';
-import { RectangleTool } from './rectangle-tool';
-import { TriangleTool } from './triangle-tool';
-import { SelectTool } from './select-tool';
-import { EraseTool } from './erase-tool';
 import { EditorTool } from './editor-tool';
-import { HexagonTool } from './hexagon-tool';
+import { EllipseTool } from './ellipse-tool';
-import { PentagramTool } from './pentagram-tool';
+import { EraseTool } from './erase-tool';
-import { WhiteArrowTool } from './white-arrow-tool';
-import { LaserTool } from './laser-tool';
-import { HandDrawTool } from './hand-draw';
 import { FrameTool } from './frame-tool/frame-tool';
+import { HandDrawTool } from './hand-draw';
+import { HexagonTool } from './hexagon-tool';
+import { HighlightTool } from './highlight-tool';
+import { LaserTool } from './laser-tool';
+import { LineTool } from './line-tool';
+import { PencilTool } from './pencil-tool';
+import { PentagramTool } from './pentagram-tool';
+import { RectangleTool } from './rectangle-tool';
+import { SelectTool } from './select-tool';
+import { TriangleTool } from './triangle-tool';
+import { WhiteArrowTool } from './white-arrow-tool';
 
 export interface ToolsMap {
     select: typeof SelectTool;

libs/components/board-tools/src/laser-tool/laser-tool.ts

@@ -2,8 +2,8 @@ import { TLPointerEventHandler } from '@tldraw/core';
 // import { Draw } from '@toeverything/components/board-shapes';
 import { Vec } from '@tldraw/vec';
 
-import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 import { BaseTool } from '@toeverything/components/board-state';
+import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 
 enum Status {
     Idle = 'idle',

libs/components/board-tools/src/line-tool/line-tool.ts

@@ -1,8 +1,8 @@
-import { Utils, TLPointerEventHandler } from '@tldraw/core';
+import { TLPointerEventHandler, Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
 import { Arrow } from '@toeverything/components/board-shapes';
-import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 import { BaseTool, BaseToolStatus } from '@toeverything/components/board-state';
+import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 
 export class LineTool extends BaseTool {
     override type = TDShapeType.Line as const;

libs/components/board-tools/src/pencil-tool/pencil-tool.ts

@@ -1,11 +1,11 @@
-import { Utils, TLPointerEventHandler } from '@tldraw/core';
+import { TLPointerEventHandler, Utils } from '@tldraw/core';
 import { Draw } from '@toeverything/components/board-shapes';
+import { BaseTool } from '@toeverything/components/board-state';
 import {
     DashStyle,
     SessionType,
     TDShapeType,
 } from '@toeverything/components/board-types';
-import { BaseTool } from '@toeverything/components/board-state';
 
 enum Status {
     Idle = 'idle',

libs/components/board-tools/src/pentagram-tool/pentagram-tool.ts

@@ -1,8 +1,8 @@
-import { Utils, TLPointerEventHandler, TLBoundsCorner } from '@tldraw/core';
+import { TLBoundsCorner, TLPointerEventHandler, Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
 import { Pentagram } from '@toeverything/components/board-shapes';
-import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 import { BaseTool, BaseToolStatus } from '@toeverything/components/board-state';
+import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 
 export class PentagramTool extends BaseTool {
     override type = TDShapeType.Pentagram as const;

libs/components/board-tools/src/rectangle-tool/rectangle-tool.ts

@@ -1,8 +1,8 @@
-import { Utils, TLPointerEventHandler, TLBoundsCorner } from '@tldraw/core';
+import { TLBoundsCorner, TLPointerEventHandler, Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
 import { Rectangle } from '@toeverything/components/board-shapes';
-import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 import { BaseTool, BaseToolStatus } from '@toeverything/components/board-state';
+import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 
 export class RectangleTool extends BaseTool {
     override type = TDShapeType.Rectangle as const;

libs/components/board-tools/src/select-tool/select-tool.ts

@@ -4,19 +4,18 @@ import {
     TLBoundsEventHandler,
     TLBoundsHandleEventHandler,
     TLCanvasEventHandler,
-    TLPointerEventHandler,
     TLKeyboardEventHandler,
+    TLPointerEventHandler,
     TLShapeCloneHandler,
     Utils,
 } from '@tldraw/core';
+import Vec from '@tldraw/vec';
+import { BaseTool, TLDR } from '@toeverything/components/board-state';
 import {
-    SessionType,
-    TDShapeType,
     CLONING_DISTANCE,
     DEAD_ZONE,
+    SessionType,
 } from '@toeverything/components/board-types';
-import { BaseTool, TLDR } from '@toeverything/components/board-state';
-import Vec from '@tldraw/vec';
 
 enum Status {
     Idle = 'idle',

libs/components/board-tools/src/triangle-tool/triangle-tool.ts

@@ -1,8 +1,8 @@
-import { Utils, TLPointerEventHandler, TLBoundsCorner } from '@tldraw/core';
+import { TLBoundsCorner, TLPointerEventHandler, Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
 import { Triangle } from '@toeverything/components/board-shapes';
-import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 import { BaseTool, BaseToolStatus } from '@toeverything/components/board-state';
+import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 
 export class TriangleTool extends BaseTool {
     override type = TDShapeType.Triangle as const;

libs/components/board-tools/src/white-arrow-tool/white-arrow-tool.ts

@@ -1,8 +1,8 @@
-import { Utils, TLPointerEventHandler, TLBoundsCorner } from '@tldraw/core';
+import { TLBoundsCorner, TLPointerEventHandler, Utils } from '@tldraw/core';
 import Vec from '@tldraw/vec';
 import { WhiteArrow } from '@toeverything/components/board-shapes';
-import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 import { BaseTool, BaseToolStatus } from '@toeverything/components/board-state';
+import { SessionType, TDShapeType } from '@toeverything/components/board-types';
 
 export class WhiteArrowTool extends BaseTool {
     override type = TDShapeType.Triangle as const;

libs/components/board-types/src/index.ts

@@ -1,3 +1,3 @@
-export * from './types';
 export * from './constants';
 export * from './session';
+export * from './types';

libs/components/board-types/src/session.ts

@@ -1,5 +1,5 @@
 import { TLPerformanceMode } from '@tldraw/core';
-import { TDSnapshot, Patch } from './types';
+import { Patch, TDSnapshot } from './types';
 
 export enum SessionType {
     Transform = 'transform',

libs/components/board-types/src/types.ts

@@ -1,24 +1,24 @@
 /* eslint-disable max-lines */
 import type {
-    TLPage,
+    TLAsset,
-    TLUser,
-    TLPageState,
     TLBinding,
     TLBoundsCorner,
     TLBoundsEdge,
-    TLShape,
-    TLHandle,
-    TLSnapLine,
-    TLPinchEventHandler,
-    TLKeyboardEventHandler,
-    TLPointerEventHandler,
-    TLWheelEventHandler,
-    TLCanvasEventHandler,
     TLBoundsEventHandler,
     TLBoundsHandleEventHandler,
+    TLCanvasEventHandler,
+    TLHandle,
+    TLKeyboardEventHandler,
+    TLPage,
+    TLPageState,
+    TLPinchEventHandler,
+    TLPointerEventHandler,
+    TLShape,
     TLShapeBlurHandler,
     TLShapeCloneHandler,
-    TLAsset,
+    TLSnapLine,
+    TLUser,
+    TLWheelEventHandler,
 } from '@tldraw/core';
 
 /* -------------------------------------------------- */

libs/components/layout/src/header/EditorBoardSwitcher/StatusIcon.tsx

@@ -1,5 +1,5 @@
+import { BoardViewIcon, DocViewIcon } from '@toeverything/components/icons';
 import { styled } from '@toeverything/components/ui';
-import { DocViewIcon, BoardViewIcon } from '@toeverything/components/icons';
 import { DocMode } from './type';
 
 interface StatusIconProps {

libs/components/layout/src/header/EditorBoardSwitcher/StatusTrack.tsx

@@ -1,6 +1,6 @@
-import type { DocMode } from './type';
 import { styled } from '@toeverything/components/ui';
 import { StatusIcon } from './StatusIcon';
+import type { DocMode } from './type';
 
 interface StatusTrackProps {
     mode: DocMode;

libs/components/layout/src/header/EditorBoardSwitcher/Switcher.tsx

@@ -1,5 +1,5 @@
-import { useLocation, useParams, useNavigate } from 'react-router-dom';
 import { styled } from '@toeverything/components/ui';
+import { useLocation, useNavigate, useParams } from 'react-router-dom';
 import { StatusText } from './StatusText';
 import { StatusTrack } from './StatusTrack';
 import { DocMode } from './type';

libs/components/layout/src/header/Header.tsx

@@ -1,24 +1,23 @@
-import { useNavigate, useParams, useLocation } from 'react-router-dom';
+import { ListIcon, LogoLink, SpaceIcon } from '@toeverything/components/common';
-import MenuIconBak from '@mui/icons-material/Menu';
+import { SideBarViewIcon } from '@toeverything/components/icons';
-import {
-    useUserAndSpaces,
-    useShowSpaceSidebar,
-    useShowSettingsSidebar,
-} from '@toeverything/datasource/state';
 import {
     MuiIconButton as IconButton,
     styled,
     Tooltip,
     useTheme,
 } from '@toeverything/components/ui';
-import { SideBarViewIcon } from '@toeverything/components/icons';
+import { useFlag } from '@toeverything/datasource/feature-flags';
-import { LogoLink, ListIcon, SpaceIcon } from '@toeverything/components/common';
+import {
+    useShowSettingsSidebar,
+    useShowSpaceSidebar,
+    useUserAndSpaces,
+} from '@toeverything/datasource/state';
+import { useLocation, useNavigate, useParams } from 'react-router-dom';
 import { PageHistoryPortal } from './PageHistoryPortal';
-import { PageSharePortal } from './PageSharePortal';
 import { PageSettingPortal } from './PageSettingPortal';
+import { PageSharePortal } from './PageSharePortal';
 import { CurrentPageTitle } from './Title';
 import { UserMenuIcon } from './user-menu-icon';
-import { useFlag } from '@toeverything/datasource/feature-flags';
 
 function hideAffineHeader(pathname: string): boolean {
     return ['/', '/login', '/error/workspace', '/error/404', '/ui'].includes(

libs/components/layout/src/header/LayoutHeader.tsx

@@ -1,19 +1,19 @@
 import { useMemo } from 'react';
 
-import { IconButton, styled } from '@toeverything/components/ui';
 import {
     LogoIcon,
-    SideBarViewIcon,
     SearchIcon,
     SideBarViewCloseIcon,
+    SideBarViewIcon,
 } from '@toeverything/components/icons';
+import { IconButton, styled } from '@toeverything/components/ui';
 import {
-    useShowSettingsSidebar,
     useLocalTrigger,
+    useShowSettingsSidebar,
 } from '@toeverything/datasource/state';
 
 import { EditorBoardSwitcher } from './EditorBoardSwitcher';
-import { fsApiSupported, FileSystem } from './FileSystem';
+import { FileSystem, fsApiSupported } from './FileSystem';
 import { CurrentPageTitle } from './Title';
 
 export const LayoutHeader = () => {

libs/components/layout/src/header/PageSettingPortal.tsx

@@ -1,22 +1,22 @@
-import { useState, MouseEvent, useCallback, useEffect } from 'react';
 import { services } from '@toeverything/datasource/db-service';
-import { useParams, useNavigate } from 'react-router-dom';
+import { useCallback, useEffect, useState } from 'react';
+import { useNavigate, useParams } from 'react-router-dom';
 
-import { copyToClipboard } from '@toeverything/utils';
 import { MoreIcon } from '@toeverything/components/icons';
 import {
-    MuiSnackbar as Snackbar,
-    Popover,
     ListButton,
     MuiDivider as Divider,
+    MuiSnackbar as Snackbar,
     MuiSwitch as Switch,
+    Popover,
     styled,
 } from '@toeverything/components/ui';
-import { useUserAndSpaces } from '@toeverything/datasource/state';
-import format from 'date-fns/format';
 import { useFlag } from '@toeverything/datasource/feature-flags';
-import { PageBlock } from './types';
+import { useUserAndSpaces } from '@toeverything/datasource/state';
+import { copyToClipboard } from '@toeverything/utils';
+import format from 'date-fns/format';
 import { FileExporter } from './file-exporter/file-exporter';
+import { PageBlock } from './types';
 const PageSettingPortalContainer = styled('div')({
     width: '320p',
     padding: '15px',

libs/components/layout/src/header/PageSharePortal.tsx

@@ -1,18 +1,17 @@
-import style9 from 'style9';
-import LanguageIcon from '@mui/icons-material/Language';
-import { useState, MouseEvent } from 'react';
 import InsertLinkIcon from '@mui/icons-material/InsertLink';
+import LanguageIcon from '@mui/icons-material/Language';
 import ShareIcon from '@mui/icons-material/Share';
 import {
-    MuiSnackbar as Snackbar,
     MuiButton as Button,
-    MuiDivider as Divider,
     MuiInputBase as InputBase,
     MuiPaper as Paper,
+    MuiSnackbar as Snackbar,
     MuiSwitch as Switch,
     Popover,
 } from '@toeverything/components/ui';
 import { copyToClipboard } from '@toeverything/utils';
+import { useState } from 'react';
+import style9 from 'style9';
 
 const styles = style9.create({
     pageShareBox: {

libs/components/layout/src/header/Title.tsx

@@ -1,6 +1,6 @@
-import { useEffect, useState, useCallback } from 'react';
+import { styled, Typography } from '@toeverything/components/ui';
+import { useCallback, useEffect, useState } from 'react';
 import { useParams } from 'react-router-dom';
-import { Typography, styled } from '@toeverything/components/ui';
 
 import { services } from '@toeverything/datasource/db-service';
 import { useUserAndSpaces } from '@toeverything/datasource/state';

libs/components/layout/src/header/file-exporter/file-exporter.ts

@@ -1,4 +1,3 @@
-import { PageBlock } from '../types';
 import TurndownService from 'turndown';
 const FileExporter = {
     exportFile: (filename: string, text: string, format: string) => {

libs/components/layout/src/header/user-menu-icon/UserMenuList.tsx

@@ -1,14 +1,14 @@
-import { useMemo } from 'react';
 import { getAuth, signOut } from 'firebase/auth';
+import { useMemo } from 'react';
 
-import { LOGOUT_COOKIES, LOGOUT_LOCAL_STORAGE } from '@toeverything/utils';
-import { useUserAndSpaces } from '@toeverything/datasource/state';
 import {
     MuiDivider as Divider,
     MuiList as List,
     MuiListItem as ListItem,
     MuiListItemText as ListItemText,
 } from '@toeverything/components/ui';
+import { useUserAndSpaces } from '@toeverything/datasource/state';
+import { LOGOUT_COOKIES, LOGOUT_LOCAL_STORAGE } from '@toeverything/utils';
 
 export const UserMenuList = () => {
     const { user } = useUserAndSpaces();

libs/components/layout/src/settings-sidebar/Comments/CommentItem.tsx

@@ -1,10 +1,10 @@
-import { Fragment, useState, useEffect, useCallback } from 'react';
+import { MuiClickAwayListener, styled } from '@toeverything/components/ui';
-import { styled, MuiClickAwayListener } from '@toeverything/components/ui';
 import { services } from '@toeverything/datasource/db-service';
+import { Fragment, useCallback, useEffect, useState } from 'react';
 
 import { QuotedContent } from './item/QuotedContent';
-import { ReplyItem } from './item/ReplyItem';
 import { ReplyInput } from './item/ReplyInput';
+import { ReplyItem } from './item/ReplyItem';
 import { CommentInfo } from './type';
 
 export const CommentItem = (props: CommentInfo) => {

libs/components/layout/src/settings-sidebar/Comments/Comments.tsx

@@ -1,6 +1,6 @@
 import { styled } from '@toeverything/components/ui';
-import { useComments } from './use-comments';
 import { CommentItem } from './CommentItem';
+import { useComments } from './use-comments';
 
 type CommentsProps = {
     activeCommentId: string;

libs/components/layout/src/settings-sidebar/Comments/item/CommentedByUser.tsx

@@ -1,7 +1,7 @@
-import { useMemo } from 'react';
+import { MuiAvatar as Avatar, styled } from '@toeverything/components/ui';
-import { styled, MuiAvatar as Avatar } from '@toeverything/components/ui';
 import { useUserAndSpaces } from '@toeverything/datasource/state';
 import { getUserDisplayName } from '@toeverything/utils';
+import { useMemo } from 'react';
 
 type CommentedByUserProps = {
     username: string;

libs/components/layout/src/settings-sidebar/Comments/item/QuotedContent.tsx

@@ -1,5 +1,5 @@
-import { styled } from '@toeverything/components/ui';
 import { DoneIcon } from '@toeverything/components/icons';
+import { styled } from '@toeverything/components/ui';
 
 type QuotedContentProps = {
     content: string;

libs/components/layout/src/settings-sidebar/Comments/item/ReplyInput.tsx

@@ -1,10 +1,10 @@
-import {
-    useState,
-    useCallback,
-    KeyboardEventHandler,
-    ChangeEvent,
-} from 'react';
 import { styled } from '@toeverything/components/ui';
+import {
+    ChangeEvent,
+    KeyboardEventHandler,
+    useCallback,
+    useState,
+} from 'react';
 
 export const ReplyInput = (props: any) => {
     const { onSubmit } = props;

libs/components/layout/src/settings-sidebar/Comments/item/ReplyItem.tsx

@@ -1,4 +1,3 @@
-import { styled } from '@toeverything/components/ui';
 import type { CommentReply } from '@toeverything/datasource/db-service';
 
 import { CommentContent } from './CommentContent';

libs/components/layout/src/settings-sidebar/Comments/use-comments.ts

@@ -1,11 +1,11 @@
-import { useState, useCallback, useEffect, useMemo } from 'react';
-import { useParams } from 'react-router-dom';
-import { services } from '@toeverything/datasource/db-service';
 import type { Virgo } from '@toeverything/components/editor-core';
+import { services } from '@toeverything/datasource/db-service';
 import {
     useCurrentEditors,
     useShowSettingsSidebar,
 } from '@toeverything/datasource/state';
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useParams } from 'react-router-dom';
 import type { CommentInfo } from './type';
 
 export const useComments = () => {

libs/components/layout/src/settings-sidebar/Comments/utils.ts

@@ -1,6 +1,6 @@
 import type {
-    ReturnEditorBlock,
     Comment,
+    ReturnEditorBlock,
 } from '@toeverything/datasource/db-service';
 
 export const getCommentsFromEditorBlocks = (