Improves copy / paste from menu

This commit is contained in:
Steve Ruiz 2021-09-01 19:49:25 +01:00
parent 4412954be5
commit 206a1236a1
3 changed files with 32 additions and 12 deletions

View file

@ -101,11 +101,19 @@ export const ContextMenu = React.memo(({ children }: ContextMenuProps): JSX.Elem
tlstate.delete()
}, [tlstate])
const handlecopyJson = React.useCallback(() => {
const handleCopyJson = React.useCallback(() => {
tlstate.copyJson()
}, [tlstate])
const handlecopySvg = React.useCallback(() => {
const handleCopy = React.useCallback(() => {
tlstate.copy()
}, [tlstate])
const handlePaste = React.useCallback(() => {
tlstate.paste()
}, [tlstate])
const handleCopySvg = React.useCallback(() => {
tlstate.copySvg()
}, [tlstate])
@ -178,16 +186,24 @@ export const ContextMenu = React.memo(({ children }: ContextMenuProps): JSX.Elem
{hasTwoOrMore && (
<AlignDistributeSubMenu hasTwoOrMore={hasTwoOrMore} hasThreeOrMore={hasThreeOrMore} />
)}
<ContextMenuDivider />
{/* <MoveToPageMenu /> */}
<ContextMenuButton onSelect={handleCopy}>
<span>Copy</span>
<Kbd variant="menu">#C</Kbd>
</ContextMenuButton>
<ContextMenuButton onSelect={handleCopySvg}>
<span>Copy to SVG</span>
<Kbd variant="menu">#C</Kbd>
</ContextMenuButton>
{isDebugMode && (
<ContextMenuButton onSelect={handlecopyJson}>
<span>Copy Data</span>
<Kbd variant="menu">#C</Kbd>
<ContextMenuButton onSelect={handleCopyJson}>
<span>Copy to JSON</span>
</ContextMenuButton>
)}
<ContextMenuButton onSelect={handlecopySvg}>
<span>Copy to SVG</span>
<Kbd variant="menu">#C</Kbd>
<ContextMenuButton onSelect={handlePaste}>
<span>Paste</span>
<Kbd variant="menu">#V</Kbd>
</ContextMenuButton>
<ContextMenuDivider />
<ContextMenuButton onSelect={handleDelete}>
@ -197,6 +213,10 @@ export const ContextMenu = React.memo(({ children }: ContextMenuProps): JSX.Elem
</>
) : (
<>
<ContextMenuButton onSelect={handlePaste}>
<span>Paste</span>
<Kbd variant="menu">#V</Kbd>
</ContextMenuButton>
<ContextMenuButton onSelect={handleUndo}>
<span>Undo</span>
<Kbd variant="menu">#Z</Kbd>

View file

@ -66,7 +66,7 @@ function SelectedShapeContent(): JSX.Element {
tlstate.paste()
}, [tlstate])
const handlecopySvg = React.useCallback(() => {
const handleCopySvg = React.useCallback(() => {
tlstate.copySvg()
}, [tlstate])
@ -88,7 +88,7 @@ function SelectedShapeContent(): JSX.Element {
<span>Paste</span>
{showKbds && <Kbd variant="menu">#V</Kbd>}
</RowButton>
<RowButton bp={breakpoints} onClick={handlecopySvg}>
<RowButton bp={breakpoints} onClick={handleCopySvg}>
<span>Copy to SVG</span>
{showKbds && <Kbd variant="menu">#C</Kbd>}
</RowButton>

View file

@ -636,7 +636,7 @@ export class TLDrawState extends StateManager<Data> {
return this
}
paste = (string?: string): this => {
paste = (point?: number[], string?: string): this => {
if (string) {
// Parse shapes from string
try {
@ -692,7 +692,7 @@ export class TLDrawState extends StateManager<Data> {
const centeredBounds = Utils.centerBounds(
commonBounds,
this.getPagePoint([window.innerWidth / 2, window.innerHeight / 2])
this.getPagePoint(point || [window.innerWidth / 2, window.innerHeight / 2])
)
let delta = Vec.sub(Utils.getBoundsCenter(centeredBounds), Utils.getBoundsCenter(commonBounds))