kopia lustrzana https://github.com/Tldraw/Tldraw
Also fix create shape.
rodzic
44f0a3d6d0
commit
760a735872
|
@ -633,7 +633,7 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|||
};
|
||||
};
|
||||
createPage(page: Partial<TLPage>): this;
|
||||
createShape<T extends TLUnknownShape>(shape: OptionalKeys<TLShapePartial<T>, 'id'>): this;
|
||||
createShape<T extends TLUnknownShape>(shape: OptionalKeys<TLShapePartial<T>, 'id'>): EditorResult<void>;
|
||||
createShapes<T extends TLUnknownShape>(shapes: OptionalKeys<TLShapePartial<T>, 'id'>[]): EditorResult<void>;
|
||||
deleteAssets(assets: TLAsset[] | TLAssetId[]): this;
|
||||
deleteOpenMenu(id: string): this;
|
||||
|
|
|
@ -6223,9 +6223,8 @@ export class Editor extends EventEmitter<TLEventMap> {
|
|||
*
|
||||
* @public
|
||||
*/
|
||||
createShape<T extends TLUnknownShape>(shape: OptionalKeys<TLShapePartial<T>, 'id'>): this {
|
||||
this.createShapes([shape])
|
||||
return this
|
||||
createShape<T extends TLUnknownShape>(shape: OptionalKeys<TLShapePartial<T>, 'id'>) {
|
||||
return this.createShapes([shape])
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
@ -75,7 +75,7 @@ export class Pointing extends StateNode {
|
|||
|
||||
this.editor.mark(this.markId)
|
||||
|
||||
this.editor.createShapes<TLGeoShape>([
|
||||
const result = this.editor.createShapes<TLGeoShape>([
|
||||
{
|
||||
id,
|
||||
type: 'geo',
|
||||
|
@ -88,6 +88,10 @@ export class Pointing extends StateNode {
|
|||
},
|
||||
},
|
||||
])
|
||||
if (!result.ok) {
|
||||
this.cancel()
|
||||
return
|
||||
}
|
||||
|
||||
const shape = this.editor.getShape<TLGeoShape>(id)!
|
||||
if (!shape) return
|
||||
|
|
|
@ -190,8 +190,8 @@ describe('Grid placement helpers', () => {
|
|||
})
|
||||
|
||||
it('Falls into a sticky pit when empty', () => {
|
||||
editor.createShape({ type: 'note', x: 0, y: 0 })
|
||||
editor
|
||||
.createShape({ type: 'note', x: 0, y: 0 })
|
||||
.setCurrentTool('note')
|
||||
.pointerMove(324, 104)
|
||||
.click()
|
||||
|
@ -204,9 +204,9 @@ describe('Grid placement helpers', () => {
|
|||
})
|
||||
|
||||
it('Does not create a new sticky note in a sticky pit if a note is already there', () => {
|
||||
editor.createShape({ type: 'note', x: 0, y: 0 })
|
||||
editor.createShape({ type: 'note', x: 330, y: 8 }) // make a shape kinda there already!
|
||||
editor
|
||||
.createShape({ type: 'note', x: 0, y: 0 })
|
||||
.createShape({ type: 'note', x: 330, y: 8 }) // make a shape kinda there already!
|
||||
.setCurrentTool('note')
|
||||
.pointerMove(300, 104)
|
||||
.click()
|
||||
|
@ -241,7 +241,8 @@ describe('Grid placement helpers', () => {
|
|||
})
|
||||
|
||||
it('Falls into correct pit below notes with growY', () => {
|
||||
editor.createShape({ type: 'note', x: 0, y: 0 }).updateShape({
|
||||
editor.createShape({ type: 'note', x: 0, y: 0 })
|
||||
editor.updateShape({
|
||||
...editor.getLastCreatedShape(),
|
||||
props: { growY: 100 },
|
||||
})
|
||||
|
|
|
@ -40,7 +40,12 @@ export class Pointing extends StateNode {
|
|||
if (offset) {
|
||||
center.sub(offset)
|
||||
}
|
||||
this.shape = createSticky(this.editor, id, center)
|
||||
const result = createSticky(this.editor, id, center)
|
||||
if (!result) {
|
||||
this.cancel()
|
||||
return
|
||||
}
|
||||
this.shape = result
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -53,7 +58,12 @@ export class Pointing extends StateNode {
|
|||
if (offset) {
|
||||
center.sub(offset)
|
||||
}
|
||||
this.shape = createSticky(this.editor, id, center)
|
||||
const result = createSticky(this.editor, id, center)
|
||||
if (!result) {
|
||||
this.cancel()
|
||||
return
|
||||
}
|
||||
this.shape = result
|
||||
}
|
||||
|
||||
this.editor.setCurrentTool('select.translating', {
|
||||
|
@ -123,14 +133,17 @@ export function getNotePitOffset(editor: Editor, center: Vec) {
|
|||
}
|
||||
|
||||
export function createSticky(editor: Editor, id: TLShapeId, center: Vec) {
|
||||
editor
|
||||
.createShape({
|
||||
id,
|
||||
type: 'note',
|
||||
x: center.x,
|
||||
y: center.y,
|
||||
})
|
||||
.select(id)
|
||||
const result = editor.createShape({
|
||||
id,
|
||||
type: 'note',
|
||||
x: center.x,
|
||||
y: center.y,
|
||||
})
|
||||
if (!result.ok) {
|
||||
return null
|
||||
}
|
||||
|
||||
editor.select(id)
|
||||
|
||||
const shape = editor.getShape<TLNoteShape>(id)!
|
||||
const bounds = editor.getShapeGeometry(shape).bounds
|
||||
|
|
|
@ -563,8 +563,8 @@ describe('When in readonly mode', () => {
|
|||
|
||||
// This should be end to end, the problem is the blur handler of the react component
|
||||
it('goes into pointing canvas', () => {
|
||||
editor.createShape({ type: 'note' })
|
||||
editor
|
||||
.createShape({ type: 'note' })
|
||||
.pointerMove(50, 50)
|
||||
.doubleClick()
|
||||
.expectToBeIn('select.editing_shape')
|
||||
|
|
|
@ -680,26 +680,25 @@ describe('when a frame has multiple children', () => {
|
|||
let box1: TLGeoShape
|
||||
let box2: TLGeoShape
|
||||
beforeEach(() => {
|
||||
editor
|
||||
.createShape<TLFrameShape>({ id: ids.frame1, type: 'frame', props: { w: 100, h: 100 } })
|
||||
.createShape<TLGeoShape>({
|
||||
id: ids.box1,
|
||||
parentId: ids.frame1,
|
||||
type: 'geo',
|
||||
x: 25,
|
||||
y: 25,
|
||||
})
|
||||
.createShape<TLGeoShape>({
|
||||
id: ids.box2,
|
||||
parentId: ids.frame1,
|
||||
type: 'geo',
|
||||
x: 50,
|
||||
y: 50,
|
||||
props: {
|
||||
w: 80,
|
||||
h: 80,
|
||||
},
|
||||
})
|
||||
editor.createShape<TLFrameShape>({ id: ids.frame1, type: 'frame', props: { w: 100, h: 100 } })
|
||||
editor.createShape<TLGeoShape>({
|
||||
id: ids.box1,
|
||||
parentId: ids.frame1,
|
||||
type: 'geo',
|
||||
x: 25,
|
||||
y: 25,
|
||||
})
|
||||
editor.createShape<TLGeoShape>({
|
||||
id: ids.box2,
|
||||
parentId: ids.frame1,
|
||||
type: 'geo',
|
||||
x: 50,
|
||||
y: 50,
|
||||
props: {
|
||||
w: 80,
|
||||
h: 80,
|
||||
},
|
||||
})
|
||||
box1 = editor.getShape<TLGeoShape>(ids.box1)!
|
||||
box2 = editor.getShape<TLGeoShape>(ids.box2)!
|
||||
})
|
||||
|
|
|
@ -1954,9 +1954,9 @@ const defaultPitLocations = [
|
|||
|
||||
describe('Note shape grid helper positions / pits', () => {
|
||||
it('Snaps to pits', () => {
|
||||
editor.createShape({ type: 'note' })
|
||||
editor.createShape({ type: 'note', x: 500, y: 500 })
|
||||
editor
|
||||
.createShape({ type: 'note' })
|
||||
.createShape({ type: 'note', x: 500, y: 500 })
|
||||
.pointerMove(600, 600)
|
||||
// start translating
|
||||
.pointerDown()
|
||||
|
@ -1971,9 +1971,9 @@ describe('Note shape grid helper positions / pits', () => {
|
|||
})
|
||||
|
||||
it('Does not snap to pit if shape has a different rotation', () => {
|
||||
editor.createShape({ type: 'note', rotation: 0.001 })
|
||||
editor.createShape({ type: 'note', x: 500, y: 500 })
|
||||
editor
|
||||
.createShape({ type: 'note', rotation: 0.001 })
|
||||
.createShape({ type: 'note', x: 500, y: 500 })
|
||||
.pointerMove(600, 600)
|
||||
// start translating
|
||||
.pointerDown()
|
||||
|
@ -1989,9 +1989,9 @@ describe('Note shape grid helper positions / pits', () => {
|
|||
})
|
||||
|
||||
it('Snaps to pit if shape has the same rotation', () => {
|
||||
editor.createShape({ type: 'note', rotation: 0.001 })
|
||||
editor.createShape({ type: 'note', x: 500, y: 500, rotation: 0.001 })
|
||||
editor
|
||||
.createShape({ type: 'note', rotation: 0.001 })
|
||||
.createShape({ type: 'note', x: 500, y: 500, rotation: 0.001 })
|
||||
.pointerMove(600, 600)
|
||||
// start translating
|
||||
.pointerDown()
|
||||
|
@ -2008,9 +2008,9 @@ describe('Note shape grid helper positions / pits', () => {
|
|||
})
|
||||
|
||||
it('Snaps correctly to the top when the translating shape has growY', () => {
|
||||
editor.createShape({ type: 'note' })
|
||||
editor.createShape({ type: 'note', x: 500, y: 500 })
|
||||
editor
|
||||
.createShape({ type: 'note' })
|
||||
.createShape({ type: 'note', x: 500, y: 500 })
|
||||
.updateShape({ ...editor.getLastCreatedShape(), props: { growY: 100 } })
|
||||
.pointerMove(600, 600)
|
||||
// start translating
|
||||
|
@ -2028,10 +2028,10 @@ describe('Note shape grid helper positions / pits', () => {
|
|||
})
|
||||
|
||||
it('Snaps correctly to the bottom when the not-translating shape has growY', () => {
|
||||
editor.createShape({ type: 'note' })
|
||||
editor.updateShape({ ...editor.getLastCreatedShape(), props: { growY: 100 } })
|
||||
editor.createShape({ type: 'note', x: 500, y: 500 })
|
||||
editor
|
||||
.createShape({ type: 'note' })
|
||||
.updateShape({ ...editor.getLastCreatedShape(), props: { growY: 100 } })
|
||||
.createShape({ type: 'note', x: 500, y: 500 })
|
||||
.pointerMove(600, 600)
|
||||
// start translating
|
||||
.pointerDown()
|
||||
|
|
Ładowanie…
Reference in New Issue