PrivateCoffee/tldraw
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

fix copy and paste on Safari (#680)

Browse source
This commit is contained in:
Steve Ruiz 2022-05-13 13:00:53 +01:00 committed by GitHub
parent 98d44b2120
commit 57769e47b7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 30 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
packages/tldraw/src/state/TldrawApp.ts
View file

@ -1753,6 +1753,8 @@ export class TldrawApp extends StateManager<TDSnapshot> {
* @param ids The ids of the shapes to cut. * @param ids The ids of the shapes to cut.
*/ */
cut = (ids = this.selectedIds, pageId = this.currentPageId, e?: ClipboardEvent): this => { cut = (ids = this.selectedIds, pageId = this.currentPageId, e?: ClipboardEvent): this => {
e?.preventDefault()
this.copy(ids, pageId, e) this.copy(ids, pageId, e)
if (!this.readOnly) { if (!this.readOnly) {
this.delete(ids) this.delete(ids)
@ -1765,6 +1767,8 @@ export class TldrawApp extends StateManager<TDSnapshot> {
* @param ids The ids of the shapes to copy. * @param ids The ids of the shapes to copy.
*/ */
copy = (ids = this.selectedIds, pageId = this.currentPageId, e?: ClipboardEvent): this => { copy = (ids = this.selectedIds, pageId = this.currentPageId, e?: ClipboardEvent): this => {
e?.preventDefault()
this.clipboard = this.getClipboard(ids, pageId) this.clipboard = this.getClipboard(ids, pageId)
const tldrawString = JSON.stringify({ const tldrawString = JSON.stringify({
@ -1773,7 +1777,7 @@ export class TldrawApp extends StateManager<TDSnapshot> {
}) })
if (e) { if (e) {
e.clipboardData?.setData('text/hmtl', tldrawString) e.clipboardData?.setData('text/html', tldrawString)
} }
if (navigator.clipboard) { if (navigator.clipboard) {
@ -1925,7 +1929,9 @@ export class TldrawApp extends StateManager<TDSnapshot> {
const pasteAsHTML = (html: string) => { const pasteAsHTML = (html: string) => {
try { try {
const maybeJson = html.slice('<meta charset="utf-8">'.length) const maybeJson = html.startsWith('<') ? html.match(/({".*})$|</g)?.[1] : html
if (!maybeJson) return
const json: { const json: {
type: string type: string
@ -1956,13 +1962,17 @@ export class TldrawApp extends StateManager<TDSnapshot> {
// and tiling them out on the canvas. At the moment, let's just // and tiling them out on the canvas. At the moment, let's just
// support pasting one file / image. // support pasting one file / image.
if (item.type === 'text/html') {
item.getAsString(async (text) => {
pasteAsHTML(text)
})
return
} else {
switch (item.kind) { switch (item.kind) {
case 'string': { case 'string': {
item.getAsString(async (text) => { item.getAsString(async (text) => {
if (text.startsWith('<svg')) { if (text.startsWith('<svg')) {
pasteTextAsSvg(text) pasteTextAsSvg(text)
} else if (text.startsWith('<meta')) {
pasteAsHTML(text)
} else { } else {
pasteTextAsShape(text) pasteTextAsShape(text)
} }
@ -1979,6 +1989,7 @@ export class TldrawApp extends StateManager<TDSnapshot> {
} }
} }
} }
}
if (navigator.clipboard) { if (navigator.clipboard) {
const items = await navigator.clipboard.read() const items = await navigator.clipboard.read()