tldraw 4.2.0-canary.f59b349f83fb → 4.2.0-canary.fb5d6ddcf79c
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist-cjs/index.d.ts +1 -1
- package/dist-cjs/index.js +1 -1
- package/dist-cjs/lib/shapes/shared/RichTextLabel.js +1 -1
- package/dist-cjs/lib/shapes/shared/RichTextLabel.js.map +2 -2
- package/dist-cjs/lib/tools/SelectTool/childStates/DraggingHandle.js +14 -6
- package/dist-cjs/lib/tools/SelectTool/childStates/DraggingHandle.js.map +2 -2
- package/dist-cjs/lib/tools/SelectTool/childStates/Idle.js +2 -2
- package/dist-cjs/lib/tools/SelectTool/childStates/Idle.js.map +2 -2
- package/dist-cjs/lib/ui/components/Toolbar/DefaultRichTextToolbarContent.js +2 -1
- package/dist-cjs/lib/ui/components/Toolbar/DefaultRichTextToolbarContent.js.map +2 -2
- package/dist-cjs/lib/ui/components/Toolbar/LinkEditor.js +1 -1
- package/dist-cjs/lib/ui/components/Toolbar/LinkEditor.js.map +2 -2
- package/dist-cjs/lib/ui/context/events.js.map +2 -2
- package/dist-cjs/lib/ui/getLocalFiles.js +18 -3
- package/dist-cjs/lib/ui/getLocalFiles.js.map +2 -2
- package/dist-cjs/lib/ui/hooks/useClipboardEvents.js +18 -16
- package/dist-cjs/lib/ui/hooks/useClipboardEvents.js.map +3 -3
- package/dist-cjs/lib/ui/version.js +3 -3
- package/dist-cjs/lib/ui/version.js.map +1 -1
- package/dist-esm/index.d.mts +1 -1
- package/dist-esm/index.mjs +1 -1
- package/dist-esm/lib/shapes/shared/RichTextLabel.mjs +2 -1
- package/dist-esm/lib/shapes/shared/RichTextLabel.mjs.map +2 -2
- package/dist-esm/lib/tools/SelectTool/childStates/DraggingHandle.mjs +14 -6
- package/dist-esm/lib/tools/SelectTool/childStates/DraggingHandle.mjs.map +2 -2
- package/dist-esm/lib/tools/SelectTool/childStates/Idle.mjs +2 -2
- package/dist-esm/lib/tools/SelectTool/childStates/Idle.mjs.map +2 -2
- package/dist-esm/lib/ui/components/Toolbar/DefaultRichTextToolbarContent.mjs +2 -1
- package/dist-esm/lib/ui/components/Toolbar/DefaultRichTextToolbarContent.mjs.map +2 -2
- package/dist-esm/lib/ui/components/Toolbar/LinkEditor.mjs +2 -2
- package/dist-esm/lib/ui/components/Toolbar/LinkEditor.mjs.map +2 -2
- package/dist-esm/lib/ui/context/events.mjs.map +2 -2
- package/dist-esm/lib/ui/getLocalFiles.mjs +18 -3
- package/dist-esm/lib/ui/getLocalFiles.mjs.map +2 -2
- package/dist-esm/lib/ui/hooks/useClipboardEvents.mjs +18 -16
- package/dist-esm/lib/ui/hooks/useClipboardEvents.mjs.map +3 -3
- package/dist-esm/lib/ui/version.mjs +3 -3
- package/dist-esm/lib/ui/version.mjs.map +1 -1
- package/package.json +3 -3
- package/src/lib/shapes/shared/RichTextLabel.tsx +2 -1
- package/src/lib/tools/SelectTool/childStates/DraggingHandle.tsx +19 -8
- package/src/lib/tools/SelectTool/childStates/Idle.ts +2 -2
- package/src/lib/ui/components/Toolbar/DefaultRichTextToolbarContent.tsx +4 -1
- package/src/lib/ui/components/Toolbar/LinkEditor.tsx +2 -2
- package/src/lib/ui/context/events.tsx +1 -0
- package/src/lib/ui/getLocalFiles.ts +20 -3
- package/src/lib/ui/hooks/useClipboardEvents.ts +12 -9
- package/src/lib/ui/version.ts +3 -3
- package/src/test/customSnapping.test.tsx +185 -0
package/dist-cjs/index.d.ts
CHANGED
|
@@ -3942,7 +3942,7 @@ export declare interface TLUiEventMap {
|
|
|
3942
3942
|
}
|
|
3943
3943
|
|
|
3944
3944
|
/** @public */
|
|
3945
|
-
export declare type TLUiEventSource = 'actions-menu' | 'context-menu' | 'debug-panel' | 'dialog' | 'document-name' | 'export-menu' | 'help-menu' | 'helper-buttons' | 'image-toolbar' | 'kbd' | 'main-menu' | 'menu' | 'navigation-zone' | 'page-menu' | 'people-menu' | 'quick-actions' | 'rich-text-menu' | 'share-menu' | 'style-panel' | 'toolbar' | 'unknown' | 'video-toolbar' | 'zoom-menu';
|
|
3945
|
+
export declare type TLUiEventSource = 'actions-menu' | 'context-menu' | 'debug-panel' | 'dialog' | 'document-name' | 'export-menu' | 'fairy-panel' | 'help-menu' | 'helper-buttons' | 'image-toolbar' | 'kbd' | 'main-menu' | 'menu' | 'navigation-zone' | 'page-menu' | 'people-menu' | 'quick-actions' | 'rich-text-menu' | 'share-menu' | 'style-panel' | 'toolbar' | 'unknown' | 'video-toolbar' | 'zoom-menu';
|
|
3946
3946
|
|
|
3947
3947
|
/** @public */
|
|
3948
3948
|
export declare interface TLUiHelperButtonsProps {
|
package/dist-cjs/index.js
CHANGED
|
@@ -584,7 +584,7 @@ var import_buildFromV1Document = require("./lib/utils/tldr/buildFromV1Document")
|
|
|
584
584
|
var import_file = require("./lib/utils/tldr/file");
|
|
585
585
|
(0, import_editor.registerTldrawLibraryVersion)(
|
|
586
586
|
"tldraw",
|
|
587
|
-
"4.2.0-canary.
|
|
587
|
+
"4.2.0-canary.fb5d6ddcf79c",
|
|
588
588
|
"cjs"
|
|
589
589
|
);
|
|
590
590
|
//# sourceMappingURL=index.js.map
|
|
@@ -90,7 +90,7 @@ const RichTextLabel = import_react.default.memo(function RichTextLabel2({
|
|
|
90
90
|
const handlePointerUp = (e2) => {
|
|
91
91
|
if (e2.name !== "pointer_up" || !link) return;
|
|
92
92
|
if (!isDragging.current) {
|
|
93
|
-
|
|
93
|
+
(0, import_editor.openWindow)(link, "_blank", false);
|
|
94
94
|
}
|
|
95
95
|
editor.off("event", handlePointerUp);
|
|
96
96
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/lib/shapes/shared/RichTextLabel.tsx"],
|
|
4
|
-
"sourcesContent": ["import {\n\tBox,\n\tDefaultFontFamilies,\n\tTLDefaultFillStyle,\n\tTLDefaultFontStyle,\n\tTLDefaultHorizontalAlignStyle,\n\tTLDefaultVerticalAlignStyle,\n\tTLEventInfo,\n\tTLRichText,\n\tTLShapeId,\n\tpreventDefault,\n\tuseEditor,\n\tuseReactor,\n\tuseValue,\n} from '@tldraw/editor'\nimport React, { useMemo } from 'react'\nimport { renderHtmlFromRichText } from '../../utils/text/richText'\nimport { RichTextArea } from '../text/RichTextArea'\nimport { TEXT_PROPS } from './default-shape-constants'\nimport { isLegacyAlign } from './legacyProps'\nimport { useEditableRichText } from './useEditableRichText'\n\n/** @public */\nexport interface RichTextLabelProps {\n\tshapeId: TLShapeId\n\ttype: string\n\tfont: TLDefaultFontStyle\n\tfontSize: number\n\tlineHeight: number\n\tfill?: TLDefaultFillStyle\n\talign: TLDefaultHorizontalAlignStyle\n\tverticalAlign: TLDefaultVerticalAlignStyle\n\twrap?: boolean\n\trichText?: TLRichText\n\tlabelColor: string\n\tbounds?: Box\n\tisSelected: boolean\n\tonKeyDown?(e: KeyboardEvent): void\n\tclassNamePrefix?: string\n\tstyle?: React.CSSProperties\n\ttextWidth?: number\n\ttextHeight?: number\n\tpadding?: number\n\thasCustomTabBehavior?: boolean\n}\n\n/**\n * Renders a text label that can be used inside of shapes.\n * The component has the ability to be edited in place and furthermore\n * supports rich text editing.\n *\n * @public @react\n */\nexport const RichTextLabel = React.memo(function RichTextLabel({\n\tshapeId,\n\ttype,\n\trichText,\n\tlabelColor,\n\tfont,\n\tfontSize,\n\tlineHeight,\n\talign,\n\tverticalAlign,\n\twrap,\n\tisSelected,\n\tpadding = 0,\n\tonKeyDown: handleKeyDownCustom,\n\tclassNamePrefix,\n\tstyle,\n\ttextWidth,\n\ttextHeight,\n\thasCustomTabBehavior,\n}: RichTextLabelProps) {\n\tconst editor = useEditor()\n\tconst isDragging = React.useRef(false)\n\tconst { rInput, isEmpty, isEditing, isReadyForEditing, ...editableTextRest } =\n\t\tuseEditableRichText(shapeId, type, richText)\n\n\tconst html = useMemo(() => {\n\t\tif (richText) {\n\t\t\treturn renderHtmlFromRichText(editor, richText)\n\t\t}\n\t}, [editor, richText])\n\n\tconst selectToolActive = useValue(\n\t\t'isSelectToolActive',\n\t\t() => editor.getCurrentToolId() === 'select',\n\t\t[editor]\n\t)\n\n\tuseReactor(\n\t\t'isDragging',\n\t\t() => {\n\t\t\teditor.getInstanceState()\n\t\t\tisDragging.current = editor.inputs.isDragging\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst legacyAlign = isLegacyAlign(align)\n\n\tconst handlePointerDown = (e: React.MouseEvent<HTMLDivElement>) => {\n\t\tif (e.target instanceof HTMLElement && (e.target.tagName === 'A' || e.target.closest('a'))) {\n\t\t\t// This mousedown prevent default is to let dragging when over a link work.\n\t\t\tpreventDefault(e)\n\n\t\t\tif (!selectToolActive) return\n\t\t\tconst link = e.target.closest('a')?.getAttribute('href') ?? ''\n\t\t\t// We don't get the mouseup event later because we preventDefault\n\t\t\t// so we have to do it manually.\n\t\t\tconst handlePointerUp = (e: TLEventInfo) => {\n\t\t\t\tif (e.name !== 'pointer_up' || !link) return\n\n\t\t\t\tif (!isDragging.current) {\n\t\t\t\t\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["import {\n\tBox,\n\tDefaultFontFamilies,\n\tTLDefaultFillStyle,\n\tTLDefaultFontStyle,\n\tTLDefaultHorizontalAlignStyle,\n\tTLDefaultVerticalAlignStyle,\n\tTLEventInfo,\n\tTLRichText,\n\tTLShapeId,\n\topenWindow,\n\tpreventDefault,\n\tuseEditor,\n\tuseReactor,\n\tuseValue,\n} from '@tldraw/editor'\nimport React, { useMemo } from 'react'\nimport { renderHtmlFromRichText } from '../../utils/text/richText'\nimport { RichTextArea } from '../text/RichTextArea'\nimport { TEXT_PROPS } from './default-shape-constants'\nimport { isLegacyAlign } from './legacyProps'\nimport { useEditableRichText } from './useEditableRichText'\n\n/** @public */\nexport interface RichTextLabelProps {\n\tshapeId: TLShapeId\n\ttype: string\n\tfont: TLDefaultFontStyle\n\tfontSize: number\n\tlineHeight: number\n\tfill?: TLDefaultFillStyle\n\talign: TLDefaultHorizontalAlignStyle\n\tverticalAlign: TLDefaultVerticalAlignStyle\n\twrap?: boolean\n\trichText?: TLRichText\n\tlabelColor: string\n\tbounds?: Box\n\tisSelected: boolean\n\tonKeyDown?(e: KeyboardEvent): void\n\tclassNamePrefix?: string\n\tstyle?: React.CSSProperties\n\ttextWidth?: number\n\ttextHeight?: number\n\tpadding?: number\n\thasCustomTabBehavior?: boolean\n}\n\n/**\n * Renders a text label that can be used inside of shapes.\n * The component has the ability to be edited in place and furthermore\n * supports rich text editing.\n *\n * @public @react\n */\nexport const RichTextLabel = React.memo(function RichTextLabel({\n\tshapeId,\n\ttype,\n\trichText,\n\tlabelColor,\n\tfont,\n\tfontSize,\n\tlineHeight,\n\talign,\n\tverticalAlign,\n\twrap,\n\tisSelected,\n\tpadding = 0,\n\tonKeyDown: handleKeyDownCustom,\n\tclassNamePrefix,\n\tstyle,\n\ttextWidth,\n\ttextHeight,\n\thasCustomTabBehavior,\n}: RichTextLabelProps) {\n\tconst editor = useEditor()\n\tconst isDragging = React.useRef(false)\n\tconst { rInput, isEmpty, isEditing, isReadyForEditing, ...editableTextRest } =\n\t\tuseEditableRichText(shapeId, type, richText)\n\n\tconst html = useMemo(() => {\n\t\tif (richText) {\n\t\t\treturn renderHtmlFromRichText(editor, richText)\n\t\t}\n\t}, [editor, richText])\n\n\tconst selectToolActive = useValue(\n\t\t'isSelectToolActive',\n\t\t() => editor.getCurrentToolId() === 'select',\n\t\t[editor]\n\t)\n\n\tuseReactor(\n\t\t'isDragging',\n\t\t() => {\n\t\t\teditor.getInstanceState()\n\t\t\tisDragging.current = editor.inputs.isDragging\n\t\t},\n\t\t[editor]\n\t)\n\n\tconst legacyAlign = isLegacyAlign(align)\n\n\tconst handlePointerDown = (e: React.MouseEvent<HTMLDivElement>) => {\n\t\tif (e.target instanceof HTMLElement && (e.target.tagName === 'A' || e.target.closest('a'))) {\n\t\t\t// This mousedown prevent default is to let dragging when over a link work.\n\t\t\tpreventDefault(e)\n\n\t\t\tif (!selectToolActive) return\n\t\t\tconst link = e.target.closest('a')?.getAttribute('href') ?? ''\n\t\t\t// We don't get the mouseup event later because we preventDefault\n\t\t\t// so we have to do it manually.\n\t\t\tconst handlePointerUp = (e: TLEventInfo) => {\n\t\t\t\tif (e.name !== 'pointer_up' || !link) return\n\n\t\t\t\tif (!isDragging.current) {\n\t\t\t\t\topenWindow(link, '_blank', false)\n\t\t\t\t}\n\t\t\t\teditor.off('event', handlePointerUp)\n\t\t\t}\n\t\t\teditor.on('event', handlePointerUp)\n\t\t}\n\t}\n\n\t// Should be guarded higher up so that this doesn't render... but repeated here. This should never be true.\n\tif (!isEditing && isEmpty) return null\n\n\t// TODO: probably combine tl-text and tl-arrow eventually\n\tconst cssPrefix = classNamePrefix || 'tl-text'\n\treturn (\n\t\t<div\n\t\t\tclassName={`${cssPrefix}-label tl-text-wrapper tl-rich-text-wrapper`}\n\t\t\taria-hidden={!isEditing}\n\t\t\tdata-font={font}\n\t\t\tdata-align={align}\n\t\t\tdata-hastext={!isEmpty}\n\t\t\tdata-isediting={isEditing}\n\t\t\tdata-textwrap={!!wrap}\n\t\t\tdata-isselected={isSelected}\n\t\t\tstyle={{\n\t\t\t\tjustifyContent: align === 'middle' || legacyAlign ? 'center' : align,\n\t\t\t\talignItems: verticalAlign === 'middle' ? 'center' : verticalAlign,\n\t\t\t\tpadding,\n\t\t\t\t...style,\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={`${cssPrefix}-label__inner tl-text-content__wrapper`}\n\t\t\t\tstyle={{\n\t\t\t\t\tfontSize,\n\t\t\t\t\tlineHeight: lineHeight.toString(),\n\t\t\t\t\tminHeight: Math.floor(fontSize * lineHeight) + 'px',\n\t\t\t\t\tminWidth: Math.ceil(textWidth || 0),\n\t\t\t\t\tcolor: labelColor,\n\t\t\t\t\twidth: textWidth ? Math.ceil(textWidth) : undefined,\n\t\t\t\t\theight: textHeight ? Math.ceil(textHeight) : undefined,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<div className={`${cssPrefix} tl-text tl-text-content`} dir=\"auto\">\n\t\t\t\t\t{richText && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName=\"tl-rich-text\"\n\t\t\t\t\t\t\tdata-is-select-tool-active={selectToolActive}\n\t\t\t\t\t\t\t// todo: see if I can abuse this\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={{ __html: html || '' }}\n\t\t\t\t\t\t\tonPointerDown={handlePointerDown}\n\t\t\t\t\t\t\tdata-is-ready-for-editing={isReadyForEditing}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t{(isReadyForEditing || isSelected) && (\n\t\t\t\t\t<RichTextArea\n\t\t\t\t\t\t// Fudge the ref type because we're using forwardRef and it's not typed correctly.\n\t\t\t\t\t\tref={rInput as any}\n\t\t\t\t\t\trichText={richText}\n\t\t\t\t\t\tisEditing={isEditing}\n\t\t\t\t\t\tshapeId={shapeId}\n\t\t\t\t\t\t{...editableTextRest}\n\t\t\t\t\t\thasCustomTabBehavior={hasCustomTabBehavior}\n\t\t\t\t\t\thandleKeyDown={handleKeyDownCustom ?? editableTextRest.handleKeyDown}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</div>\n\t)\n})\n\n/** @public */\nexport interface RichTextSVGProps {\n\tbounds: Box\n\trichText: TLRichText\n\tfontSize: number\n\tfont: TLDefaultFontStyle\n\talign: TLDefaultHorizontalAlignStyle\n\tverticalAlign: TLDefaultVerticalAlignStyle\n\twrap?: boolean\n\tlabelColor: string\n\tpadding: number\n\tshowTextOutline?: boolean\n}\n\n/**\n * Renders a rich text string as SVG given bounds and text properties.\n *\n * @public @react\n */\nexport function RichTextSVG({\n\tbounds,\n\trichText,\n\tfontSize,\n\tfont,\n\talign,\n\tverticalAlign,\n\twrap,\n\tlabelColor,\n\tpadding,\n\tshowTextOutline = true,\n}: RichTextSVGProps) {\n\tconst editor = useEditor()\n\tconst html = renderHtmlFromRichText(editor, richText)\n\tconst textAlign =\n\t\talign === 'middle'\n\t\t\t? ('center' as const)\n\t\t\t: align === 'start'\n\t\t\t\t? ('start' as const)\n\t\t\t\t: ('end' as const)\n\tconst justifyContent =\n\t\talign === 'middle'\n\t\t\t? ('center' as const)\n\t\t\t: align === 'start'\n\t\t\t\t? ('flex-start' as const)\n\t\t\t\t: ('flex-end' as const)\n\tconst alignItems =\n\t\tverticalAlign === 'middle' ? 'center' : verticalAlign === 'start' ? 'flex-start' : 'flex-end'\n\tconst wrapperStyle = {\n\t\tdisplay: 'flex',\n\t\tfontFamily: DefaultFontFamilies[font],\n\t\theight: `100%`,\n\t\tjustifyContent,\n\t\talignItems,\n\t\tpadding: `${padding}px`,\n\t}\n\tconst style = {\n\t\tfontSize: `${fontSize}px`,\n\t\twrap: wrap ? 'wrap' : 'nowrap',\n\t\tcolor: labelColor,\n\t\tlineHeight: TEXT_PROPS.lineHeight,\n\t\ttextAlign,\n\t\twidth: '100%',\n\t\twordWrap: 'break-word' as const,\n\t\toverflowWrap: 'break-word' as const,\n\t\twhiteSpace: 'pre-wrap',\n\t\ttextShadow: showTextOutline ? 'var(--tl-text-outline)' : 'none',\n\t}\n\n\treturn (\n\t\t<foreignObject\n\t\t\tx={bounds.minX}\n\t\t\ty={bounds.minY}\n\t\t\twidth={bounds.w}\n\t\t\theight={bounds.h}\n\t\t\tclassName=\"tl-export-embed-styles tl-rich-text tl-rich-text-svg\"\n\t\t>\n\t\t\t<div style={wrapperStyle}>\n\t\t\t\t<div dangerouslySetInnerHTML={{ __html: html }} style={style} />\n\t\t\t</div>\n\t\t</foreignObject>\n\t)\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React", "RichTextLabel", "e"]
|
|
7
7
|
}
|
|
@@ -67,21 +67,29 @@ class DraggingHandle extends import_editor.StateNode {
|
|
|
67
67
|
const handles = this.editor.getShapeHandles(shape).sort(import_editor.sortByIndex);
|
|
68
68
|
const index = handles.findIndex((h) => h.id === info.handle.id);
|
|
69
69
|
this.initialAdjacentHandle = null;
|
|
70
|
-
|
|
71
|
-
const
|
|
72
|
-
if (
|
|
73
|
-
this.initialAdjacentHandle =
|
|
74
|
-
break;
|
|
70
|
+
if (info.handle.snapReferenceHandleId) {
|
|
71
|
+
const customHandle = handles.find((h) => h.id === info.handle.snapReferenceHandleId);
|
|
72
|
+
if (customHandle) {
|
|
73
|
+
this.initialAdjacentHandle = customHandle;
|
|
75
74
|
}
|
|
76
75
|
}
|
|
77
76
|
if (!this.initialAdjacentHandle) {
|
|
78
|
-
for (let i =
|
|
77
|
+
for (let i = index + 1; i < handles.length; i++) {
|
|
79
78
|
const handle2 = handles[i];
|
|
80
79
|
if (handle2.type === "vertex" && handle2.id !== "middle" && handle2.id !== info.handle.id) {
|
|
81
80
|
this.initialAdjacentHandle = handle2;
|
|
82
81
|
break;
|
|
83
82
|
}
|
|
84
83
|
}
|
|
84
|
+
if (!this.initialAdjacentHandle) {
|
|
85
|
+
for (let i = handles.length - 1; i >= 0; i--) {
|
|
86
|
+
const handle2 = handles[i];
|
|
87
|
+
if (handle2.type === "vertex" && handle2.id !== "middle" && handle2.id !== info.handle.id) {
|
|
88
|
+
this.initialAdjacentHandle = handle2;
|
|
89
|
+
break;
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
}
|
|
85
93
|
}
|
|
86
94
|
if (this.editor.isShapeOfType(shape, "arrow")) {
|
|
87
95
|
const initialBinding = (0, import_shared.getArrowBindings)(this.editor, shape)[info.handle.id];
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/lib/tools/SelectTool/childStates/DraggingHandle.tsx"],
|
|
4
|
-
"sourcesContent": ["import {\n\tMat,\n\tStateNode,\n\tTLArrowShape,\n\tTLHandle,\n\tTLLineShape,\n\tTLPointerEventInfo,\n\tTLShapeId,\n\tTLShapePartial,\n\tVec,\n\tkickoutOccludedShapes,\n\tsnapAngle,\n\tsortByIndex,\n\tstructuredClone,\n\twarnOnce,\n} from '@tldraw/editor'\nimport { ArrowShapeUtil } from '../../../shapes/arrow/ArrowShapeUtil'\nimport { clearArrowTargetState } from '../../../shapes/arrow/arrowTargetState'\nimport { getArrowBindings } from '../../../shapes/arrow/shared'\n\nexport type DraggingHandleInfo = TLPointerEventInfo & {\n\tshape: TLArrowShape | TLLineShape\n\ttarget: 'handle'\n\tonInteractionEnd?: string | (() => void)\n\tisCreating?: boolean\n\tcreatingMarkId?: string\n}\n\nexport class DraggingHandle extends StateNode {\n\tstatic override id = 'dragging_handle'\n\n\tshapeId!: TLShapeId\n\tinitialHandle!: TLHandle\n\tinitialAdjacentHandle!: TLHandle | null\n\tinitialPagePoint!: Vec\n\n\tmarkId!: string\n\tinitialPageTransform!: Mat\n\tinitialPageRotation!: number\n\n\tinfo!: DraggingHandleInfo\n\n\tisPrecise = false\n\tisPreciseId: TLShapeId | null = null\n\tpointingId: TLShapeId | null = null\n\n\toverride onEnter(info: DraggingHandleInfo) {\n\t\tconst { shape, isCreating, creatingMarkId, handle } = info\n\t\tthis.info = info\n\t\tif (typeof info.onInteractionEnd === 'string') {\n\t\t\tthis.parent.setCurrentToolIdMask(info.onInteractionEnd)\n\t\t}\n\t\tthis.shapeId = shape.id\n\t\tthis.markId = ''\n\n\t\tif (isCreating) {\n\t\t\tif (creatingMarkId) {\n\t\t\t\tthis.markId = creatingMarkId\n\t\t\t} else {\n\t\t\t\t// handle legacy implicit `creating:{shapeId}` marks\n\t\t\t\tconst markId = this.editor.getMarkIdMatching(\n\t\t\t\t\t`creating:${this.editor.getOnlySelectedShapeId()}`\n\t\t\t\t)\n\t\t\t\tif (markId) {\n\t\t\t\t\tthis.markId = markId\n\t\t\t\t}\n\t\t\t}\n\t\t} else {\n\t\t\tthis.markId = this.editor.markHistoryStoppingPoint('dragging handle')\n\t\t}\n\n\t\tthis.initialHandle = structuredClone(handle)\n\n\t\tthis.initialPageTransform = this.editor.getShapePageTransform(shape)!\n\t\tthis.initialPageRotation = this.initialPageTransform.rotation()\n\t\tthis.initialPagePoint = this.editor.inputs.originPagePoint.clone()\n\n\t\tthis.editor.setCursor({ type: isCreating ? 'cross' : 'grabbing', rotation: 0 })\n\n\t\tconst handles = this.editor.getShapeHandles(shape)!.sort(sortByIndex)\n\t\tconst index = handles.findIndex((h) => h.id === info.handle.id)\n\n\t\t// Find the adjacent handle\n\t\tthis.initialAdjacentHandle = null\n\n\t\t// Start from the handle and work forward\n\t\tfor (let i = index + 1; i < handles.length; i++) {\n\t\t\tconst handle = handles[i]\n\t\t\tif (handle.type === 'vertex' && handle.id !== 'middle' && handle.id !== info.handle.id) {\n\t\t\t\tthis.initialAdjacentHandle = handle\n\t\t\t\tbreak\n\t\t\t}\n\t\t}\n\n\t\t// If still no handle, start from the end and work backward\n\t\tif (!this.initialAdjacentHandle) {\n\t\t\tfor (let i = handles.length - 1; i >= 0; i--) {\n\t\t\t\tconst handle = handles[i]\n\t\t\t\tif (handle.type === 'vertex' && handle.id !== 'middle' && handle.id !== info.handle.id) {\n\t\t\t\t\tthis.initialAdjacentHandle = handle\n\t\t\t\t\tbreak\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// <!-- Only relevant to arrows\n\t\tif (this.editor.isShapeOfType<TLArrowShape>(shape, 'arrow')) {\n\t\t\tconst initialBinding = getArrowBindings(this.editor, shape)[info.handle.id as 'start' | 'end']\n\n\t\t\tthis.isPrecise = false\n\n\t\t\tif (initialBinding) {\n\t\t\t\tthis.isPrecise = initialBinding.props.isPrecise\n\t\t\t\tif (this.isPrecise) {\n\t\t\t\t\tthis.isPreciseId = initialBinding.toId\n\t\t\t\t} else {\n\t\t\t\t\tthis.resetExactTimeout()\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t// -->\n\n\t\t// Call onHandleDragStart callback\n\t\tconst handleDragInfo = {\n\t\t\thandle: this.initialHandle,\n\t\t\tisPrecise: this.isPrecise,\n\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\tinitial: shape,\n\t\t}\n\t\tconst util = this.editor.getShapeUtil(shape)\n\t\tconst startChanges = util.onHandleDragStart?.(shape, handleDragInfo)\n\t\tif (startChanges) {\n\t\t\tthis.editor.updateShapes([{ ...startChanges, id: shape.id, type: shape.type }])\n\t\t}\n\n\t\tthis.update()\n\n\t\tthis.editor.select(this.shapeId)\n\t}\n\n\t// Only relevant to arrows\n\tprivate exactTimeout = -1\n\n\t// Only relevant to arrows\n\tprivate resetExactTimeout() {\n\t\tconst arrowUtil = this.editor.getShapeUtil<ArrowShapeUtil>('arrow')\n\t\tconst timeoutValue = arrowUtil.options.pointingPreciseTimeout\n\n\t\tif (this.exactTimeout !== -1) {\n\t\t\tthis.clearExactTimeout()\n\t\t}\n\n\t\tthis.exactTimeout = this.editor.timers.setTimeout(() => {\n\t\t\tif (this.getIsActive() && !this.isPrecise) {\n\t\t\t\tthis.isPrecise = true\n\t\t\t\tthis.isPreciseId = this.pointingId\n\t\t\t\tthis.update()\n\t\t\t}\n\t\t\tthis.exactTimeout = -1\n\t\t}, timeoutValue)\n\t}\n\n\t// Only relevant to arrows\n\tprivate clearExactTimeout() {\n\t\tif (this.exactTimeout !== -1) {\n\t\t\tclearTimeout(this.exactTimeout)\n\t\t\tthis.exactTimeout = -1\n\t\t}\n\t}\n\n\toverride onPointerMove() {\n\t\tthis.update()\n\t}\n\n\toverride onKeyDown() {\n\t\tthis.update()\n\t}\n\n\toverride onKeyUp() {\n\t\tthis.update()\n\t}\n\n\toverride onPointerUp() {\n\t\tthis.complete()\n\t}\n\n\toverride onComplete() {\n\t\tthis.update()\n\t\tthis.complete()\n\t}\n\n\toverride onCancel() {\n\t\tthis.cancel()\n\t}\n\n\toverride onExit() {\n\t\tthis.parent.setCurrentToolIdMask(undefined)\n\t\tclearArrowTargetState(this.editor)\n\t\tthis.editor.snaps.clearIndicators()\n\n\t\tthis.editor.setCursor({ type: 'default', rotation: 0 })\n\t}\n\n\tprivate complete() {\n\t\tthis.editor.snaps.clearIndicators()\n\t\tkickoutOccludedShapes(this.editor, [this.shapeId])\n\n\t\t// Call onHandleDragEnd callback before state transitions\n\t\tconst shape = this.editor.getShape(this.shapeId)\n\t\tif (shape) {\n\t\t\tconst util = this.editor.getShapeUtil(shape)\n\t\t\tconst handleDragInfo = {\n\t\t\t\thandle: this.initialHandle,\n\t\t\t\tisPrecise: this.isPrecise,\n\t\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\t\tinitial: this.info.shape,\n\t\t\t}\n\t\t\tconst endChanges = util.onHandleDragEnd?.(shape, handleDragInfo)\n\t\t\tif (endChanges) {\n\t\t\t\tthis.editor.updateShapes([{ ...endChanges, id: shape.id, type: shape.type }])\n\t\t\t}\n\t\t}\n\n\t\tconst { onInteractionEnd } = this.info\n\t\tif (onInteractionEnd) {\n\t\t\tif (typeof onInteractionEnd === 'string') {\n\t\t\t\tif (this.editor.getInstanceState().isToolLocked && onInteractionEnd) {\n\t\t\t\t\t// Return to the tool that was active before this one but only if tool lock is turned on!\n\t\t\t\t\tthis.editor.setCurrentTool(onInteractionEnd, { shapeId: this.shapeId })\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tonInteractionEnd?.()\n\t\t\t\treturn\n\t\t\t}\n\t\t}\n\n\t\tthis.parent.transition('idle')\n\t}\n\n\tprivate cancel() {\n\t\t// Call onHandleDragCancel callback before bailing to mark\n\t\tconst shape = this.editor.getShape(this.shapeId)\n\t\tif (shape) {\n\t\t\tconst util = this.editor.getShapeUtil(shape)\n\t\t\tconst handleDragInfo = {\n\t\t\t\thandle: this.initialHandle,\n\t\t\t\tisPrecise: this.isPrecise,\n\t\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\t\tinitial: this.info.shape,\n\t\t\t}\n\t\t\tutil.onHandleDragCancel?.(shape, handleDragInfo)\n\t\t}\n\n\t\tthis.editor.bailToMark(this.markId)\n\t\tthis.editor.snaps.clearIndicators()\n\n\t\tconst { onInteractionEnd } = this.info\n\t\tif (onInteractionEnd) {\n\t\t\tif (typeof onInteractionEnd === 'string') {\n\t\t\t\t// Return to the tool that was active before this one, whether tool lock is turned on or not!\n\t\t\t\tthis.editor.setCurrentTool(onInteractionEnd, { shapeId: this.shapeId })\n\t\t\t} else {\n\t\t\t\tonInteractionEnd?.()\n\t\t\t}\n\t\t\treturn\n\t\t}\n\n\t\tthis.parent.transition('idle')\n\t}\n\n\tprivate update() {\n\t\tconst { editor, shapeId, initialPagePoint } = this\n\t\tconst { initialHandle, initialPageRotation, initialAdjacentHandle } = this\n\t\tconst isSnapMode = this.editor.user.getIsSnapMode()\n\t\tconst {\n\t\t\tsnaps,\n\t\t\tinputs: { currentPagePoint, shiftKey, ctrlKey, altKey, pointerVelocity },\n\t\t} = editor\n\n\t\tconst initial = this.info.shape\n\n\t\tconst shape = editor.getShape(shapeId)\n\t\tif (!shape) return\n\t\tconst util = editor.getShapeUtil(shape)\n\n\t\tconst initialBinding = editor.isShapeOfType<TLArrowShape>(shape, 'arrow')\n\t\t\t? getArrowBindings(editor, shape)[initialHandle.id as 'start' | 'end']\n\t\t\t: undefined\n\n\t\tlet point = currentPagePoint\n\t\t\t.clone()\n\t\t\t.sub(initialPagePoint)\n\t\t\t.rot(-initialPageRotation)\n\t\t\t.add(initialHandle)\n\n\t\tif (shiftKey && initialAdjacentHandle && initialHandle.id !== 'middle') {\n\t\t\tconst angle = Vec.Angle(initialAdjacentHandle, point)\n\t\t\tconst snappedAngle = snapAngle(angle, 24)\n\t\t\tconst angleDifference = snappedAngle - angle\n\t\t\tpoint = Vec.RotWith(point, initialAdjacentHandle, angleDifference)\n\t\t}\n\n\t\t// Clear any existing snaps\n\t\teditor.snaps.clearIndicators()\n\n\t\tlet nextHandle = { ...initialHandle, x: point.x, y: point.y }\n\n\t\tlet canSnap = false\n\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\t\tif (initialHandle.canSnap && initialHandle.snapType) {\n\t\t\twarnOnce(\n\t\t\t\t'canSnap is deprecated. Cannot use both canSnap and snapType together - snapping disabled. Please use only snapType.'\n\t\t\t)\n\t\t} else {\n\t\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\t\t\tcanSnap = initialHandle.canSnap || initialHandle.snapType !== undefined\n\t\t}\n\n\t\tif (canSnap && (isSnapMode ? !ctrlKey : ctrlKey)) {\n\t\t\t// We're snapping\n\t\t\tconst pageTransform = editor.getShapePageTransform(shape.id)\n\t\t\tif (!pageTransform) throw Error('Expected a page transform')\n\n\t\t\tconst snap = snaps.handles.snapHandle({ currentShapeId: shapeId, handle: nextHandle })\n\n\t\t\tif (snap) {\n\t\t\t\tsnap.nudge.rot(-editor.getShapeParentTransform(shape)!.rotation())\n\t\t\t\tpoint.add(snap.nudge)\n\t\t\t\tnextHandle = { ...initialHandle, x: point.x, y: point.y }\n\t\t\t}\n\t\t}\n\n\t\tconst changes = util.onHandleDrag?.(shape, {\n\t\t\thandle: nextHandle,\n\t\t\tisPrecise: this.isPrecise || altKey,\n\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\tinitial: initial,\n\t\t})\n\n\t\tconst next: TLShapePartial<any> = { id: shape.id, type: shape.type, ...changes }\n\n\t\t// Arrows\n\t\tif (\n\t\t\tinitialHandle.type === 'vertex' &&\n\t\t\tthis.editor.isShapeOfType<TLArrowShape>(shape, 'arrow')\n\t\t) {\n\t\t\tconst bindingAfter = getArrowBindings(editor, shape)[initialHandle.id as 'start' | 'end']\n\n\t\t\tif (bindingAfter) {\n\t\t\t\tif (initialBinding?.toId !== bindingAfter.toId) {\n\t\t\t\t\tthis.pointingId = bindingAfter.toId\n\t\t\t\t\tthis.isPrecise = pointerVelocity.len() < 0.5 || altKey\n\t\t\t\t\tthis.isPreciseId = this.isPrecise ? bindingAfter.toId : null\n\t\t\t\t\tthis.resetExactTimeout()\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tif (initialBinding) {\n\t\t\t\t\tthis.pointingId = null\n\t\t\t\t\tthis.isPrecise = false\n\t\t\t\t\tthis.isPreciseId = null\n\t\t\t\t\tthis.resetExactTimeout()\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tif (changes) {\n\t\t\teditor.updateShapes([next])\n\t\t}\n\t}\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAeO;AAEP,8BAAsC;AACtC,oBAAiC;AAU1B,MAAM,uBAAuB,wBAAU;AAAA,EAC7C,OAAgB,KAAK;AAAA,EAErB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EAEA,YAAY;AAAA,EACZ,cAAgC;AAAA,EAChC,aAA+B;AAAA,EAEtB,QAAQ,MAA0B;AAC1C,UAAM,EAAE,OAAO,YAAY,gBAAgB,OAAO,IAAI;AACtD,SAAK,OAAO;AACZ,QAAI,OAAO,KAAK,qBAAqB,UAAU;AAC9C,WAAK,OAAO,qBAAqB,KAAK,gBAAgB;AAAA,IACvD;AACA,SAAK,UAAU,MAAM;AACrB,SAAK,SAAS;AAEd,QAAI,YAAY;AACf,UAAI,gBAAgB;AACnB,aAAK,SAAS;AAAA,MACf,OAAO;AAEN,cAAM,SAAS,KAAK,OAAO;AAAA,UAC1B,YAAY,KAAK,OAAO,uBAAuB,CAAC;AAAA,QACjD;AACA,YAAI,QAAQ;AACX,eAAK,SAAS;AAAA,QACf;AAAA,MACD;AAAA,IACD,OAAO;AACN,WAAK,SAAS,KAAK,OAAO,yBAAyB,iBAAiB;AAAA,IACrE;AAEA,SAAK,oBAAgB,+BAAgB,MAAM;AAE3C,SAAK,uBAAuB,KAAK,OAAO,sBAAsB,KAAK;AACnE,SAAK,sBAAsB,KAAK,qBAAqB,SAAS;AAC9D,SAAK,mBAAmB,KAAK,OAAO,OAAO,gBAAgB,MAAM;AAEjE,SAAK,OAAO,UAAU,EAAE,MAAM,aAAa,UAAU,YAAY,UAAU,EAAE,CAAC;AAE9E,UAAM,UAAU,KAAK,OAAO,gBAAgB,KAAK,EAAG,KAAK,yBAAW;AACpE,UAAM,QAAQ,QAAQ,UAAU,CAAC,MAAM,EAAE,OAAO,KAAK,OAAO,EAAE;AAG9D,SAAK,wBAAwB;AAG7B,
|
|
4
|
+
"sourcesContent": ["import {\n\tMat,\n\tStateNode,\n\tTLArrowShape,\n\tTLHandle,\n\tTLLineShape,\n\tTLPointerEventInfo,\n\tTLShapeId,\n\tTLShapePartial,\n\tVec,\n\tkickoutOccludedShapes,\n\tsnapAngle,\n\tsortByIndex,\n\tstructuredClone,\n\twarnOnce,\n} from '@tldraw/editor'\nimport { ArrowShapeUtil } from '../../../shapes/arrow/ArrowShapeUtil'\nimport { clearArrowTargetState } from '../../../shapes/arrow/arrowTargetState'\nimport { getArrowBindings } from '../../../shapes/arrow/shared'\n\nexport type DraggingHandleInfo = TLPointerEventInfo & {\n\tshape: TLArrowShape | TLLineShape\n\ttarget: 'handle'\n\tonInteractionEnd?: string | (() => void)\n\tisCreating?: boolean\n\tcreatingMarkId?: string\n}\n\nexport class DraggingHandle extends StateNode {\n\tstatic override id = 'dragging_handle'\n\n\tshapeId!: TLShapeId\n\tinitialHandle!: TLHandle\n\tinitialAdjacentHandle!: TLHandle | null\n\tinitialPagePoint!: Vec\n\n\tmarkId!: string\n\tinitialPageTransform!: Mat\n\tinitialPageRotation!: number\n\n\tinfo!: DraggingHandleInfo\n\n\tisPrecise = false\n\tisPreciseId: TLShapeId | null = null\n\tpointingId: TLShapeId | null = null\n\n\toverride onEnter(info: DraggingHandleInfo) {\n\t\tconst { shape, isCreating, creatingMarkId, handle } = info\n\t\tthis.info = info\n\t\tif (typeof info.onInteractionEnd === 'string') {\n\t\t\tthis.parent.setCurrentToolIdMask(info.onInteractionEnd)\n\t\t}\n\t\tthis.shapeId = shape.id\n\t\tthis.markId = ''\n\n\t\tif (isCreating) {\n\t\t\tif (creatingMarkId) {\n\t\t\t\tthis.markId = creatingMarkId\n\t\t\t} else {\n\t\t\t\t// handle legacy implicit `creating:{shapeId}` marks\n\t\t\t\tconst markId = this.editor.getMarkIdMatching(\n\t\t\t\t\t`creating:${this.editor.getOnlySelectedShapeId()}`\n\t\t\t\t)\n\t\t\t\tif (markId) {\n\t\t\t\t\tthis.markId = markId\n\t\t\t\t}\n\t\t\t}\n\t\t} else {\n\t\t\tthis.markId = this.editor.markHistoryStoppingPoint('dragging handle')\n\t\t}\n\n\t\tthis.initialHandle = structuredClone(handle)\n\n\t\tthis.initialPageTransform = this.editor.getShapePageTransform(shape)!\n\t\tthis.initialPageRotation = this.initialPageTransform.rotation()\n\t\tthis.initialPagePoint = this.editor.inputs.originPagePoint.clone()\n\n\t\tthis.editor.setCursor({ type: isCreating ? 'cross' : 'grabbing', rotation: 0 })\n\n\t\tconst handles = this.editor.getShapeHandles(shape)!.sort(sortByIndex)\n\t\tconst index = handles.findIndex((h) => h.id === info.handle.id)\n\n\t\t// Find the adjacent handle\n\t\tthis.initialAdjacentHandle = null\n\n\t\t// First, check if the handle specifies a custom reference handle\n\t\tif (info.handle.snapReferenceHandleId) {\n\t\t\tconst customHandle = handles.find((h) => h.id === info.handle.snapReferenceHandleId)\n\t\t\tif (customHandle) {\n\t\t\t\tthis.initialAdjacentHandle = customHandle\n\t\t\t}\n\t\t}\n\n\t\t// If no custom reference handle, use default behavior\n\t\tif (!this.initialAdjacentHandle) {\n\t\t\t// Start from the handle and work forward\n\t\t\tfor (let i = index + 1; i < handles.length; i++) {\n\t\t\t\tconst handle = handles[i]\n\t\t\t\tif (handle.type === 'vertex' && handle.id !== 'middle' && handle.id !== info.handle.id) {\n\t\t\t\t\tthis.initialAdjacentHandle = handle\n\t\t\t\t\tbreak\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// If still no handle, start from the end and work backward\n\t\t\tif (!this.initialAdjacentHandle) {\n\t\t\t\tfor (let i = handles.length - 1; i >= 0; i--) {\n\t\t\t\t\tconst handle = handles[i]\n\t\t\t\t\tif (handle.type === 'vertex' && handle.id !== 'middle' && handle.id !== info.handle.id) {\n\t\t\t\t\t\tthis.initialAdjacentHandle = handle\n\t\t\t\t\t\tbreak\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// <!-- Only relevant to arrows\n\t\tif (this.editor.isShapeOfType<TLArrowShape>(shape, 'arrow')) {\n\t\t\tconst initialBinding = getArrowBindings(this.editor, shape)[info.handle.id as 'start' | 'end']\n\n\t\t\tthis.isPrecise = false\n\n\t\t\tif (initialBinding) {\n\t\t\t\tthis.isPrecise = initialBinding.props.isPrecise\n\t\t\t\tif (this.isPrecise) {\n\t\t\t\t\tthis.isPreciseId = initialBinding.toId\n\t\t\t\t} else {\n\t\t\t\t\tthis.resetExactTimeout()\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t// -->\n\n\t\t// Call onHandleDragStart callback\n\t\tconst handleDragInfo = {\n\t\t\thandle: this.initialHandle,\n\t\t\tisPrecise: this.isPrecise,\n\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\tinitial: shape,\n\t\t}\n\t\tconst util = this.editor.getShapeUtil(shape)\n\t\tconst startChanges = util.onHandleDragStart?.(shape, handleDragInfo)\n\t\tif (startChanges) {\n\t\t\tthis.editor.updateShapes([{ ...startChanges, id: shape.id, type: shape.type }])\n\t\t}\n\n\t\tthis.update()\n\n\t\tthis.editor.select(this.shapeId)\n\t}\n\n\t// Only relevant to arrows\n\tprivate exactTimeout = -1\n\n\t// Only relevant to arrows\n\tprivate resetExactTimeout() {\n\t\tconst arrowUtil = this.editor.getShapeUtil<ArrowShapeUtil>('arrow')\n\t\tconst timeoutValue = arrowUtil.options.pointingPreciseTimeout\n\n\t\tif (this.exactTimeout !== -1) {\n\t\t\tthis.clearExactTimeout()\n\t\t}\n\n\t\tthis.exactTimeout = this.editor.timers.setTimeout(() => {\n\t\t\tif (this.getIsActive() && !this.isPrecise) {\n\t\t\t\tthis.isPrecise = true\n\t\t\t\tthis.isPreciseId = this.pointingId\n\t\t\t\tthis.update()\n\t\t\t}\n\t\t\tthis.exactTimeout = -1\n\t\t}, timeoutValue)\n\t}\n\n\t// Only relevant to arrows\n\tprivate clearExactTimeout() {\n\t\tif (this.exactTimeout !== -1) {\n\t\t\tclearTimeout(this.exactTimeout)\n\t\t\tthis.exactTimeout = -1\n\t\t}\n\t}\n\n\toverride onPointerMove() {\n\t\tthis.update()\n\t}\n\n\toverride onKeyDown() {\n\t\tthis.update()\n\t}\n\n\toverride onKeyUp() {\n\t\tthis.update()\n\t}\n\n\toverride onPointerUp() {\n\t\tthis.complete()\n\t}\n\n\toverride onComplete() {\n\t\tthis.update()\n\t\tthis.complete()\n\t}\n\n\toverride onCancel() {\n\t\tthis.cancel()\n\t}\n\n\toverride onExit() {\n\t\tthis.parent.setCurrentToolIdMask(undefined)\n\t\tclearArrowTargetState(this.editor)\n\t\tthis.editor.snaps.clearIndicators()\n\n\t\tthis.editor.setCursor({ type: 'default', rotation: 0 })\n\t}\n\n\tprivate complete() {\n\t\tthis.editor.snaps.clearIndicators()\n\t\tkickoutOccludedShapes(this.editor, [this.shapeId])\n\n\t\t// Call onHandleDragEnd callback before state transitions\n\t\tconst shape = this.editor.getShape(this.shapeId)\n\t\tif (shape) {\n\t\t\tconst util = this.editor.getShapeUtil(shape)\n\t\t\tconst handleDragInfo = {\n\t\t\t\thandle: this.initialHandle,\n\t\t\t\tisPrecise: this.isPrecise,\n\t\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\t\tinitial: this.info.shape,\n\t\t\t}\n\t\t\tconst endChanges = util.onHandleDragEnd?.(shape, handleDragInfo)\n\t\t\tif (endChanges) {\n\t\t\t\tthis.editor.updateShapes([{ ...endChanges, id: shape.id, type: shape.type }])\n\t\t\t}\n\t\t}\n\n\t\tconst { onInteractionEnd } = this.info\n\t\tif (onInteractionEnd) {\n\t\t\tif (typeof onInteractionEnd === 'string') {\n\t\t\t\tif (this.editor.getInstanceState().isToolLocked && onInteractionEnd) {\n\t\t\t\t\t// Return to the tool that was active before this one but only if tool lock is turned on!\n\t\t\t\t\tthis.editor.setCurrentTool(onInteractionEnd, { shapeId: this.shapeId })\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tonInteractionEnd?.()\n\t\t\t\treturn\n\t\t\t}\n\t\t}\n\n\t\tthis.parent.transition('idle')\n\t}\n\n\tprivate cancel() {\n\t\t// Call onHandleDragCancel callback before bailing to mark\n\t\tconst shape = this.editor.getShape(this.shapeId)\n\t\tif (shape) {\n\t\t\tconst util = this.editor.getShapeUtil(shape)\n\t\t\tconst handleDragInfo = {\n\t\t\t\thandle: this.initialHandle,\n\t\t\t\tisPrecise: this.isPrecise,\n\t\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\t\tinitial: this.info.shape,\n\t\t\t}\n\t\t\tutil.onHandleDragCancel?.(shape, handleDragInfo)\n\t\t}\n\n\t\tthis.editor.bailToMark(this.markId)\n\t\tthis.editor.snaps.clearIndicators()\n\n\t\tconst { onInteractionEnd } = this.info\n\t\tif (onInteractionEnd) {\n\t\t\tif (typeof onInteractionEnd === 'string') {\n\t\t\t\t// Return to the tool that was active before this one, whether tool lock is turned on or not!\n\t\t\t\tthis.editor.setCurrentTool(onInteractionEnd, { shapeId: this.shapeId })\n\t\t\t} else {\n\t\t\t\tonInteractionEnd?.()\n\t\t\t}\n\t\t\treturn\n\t\t}\n\n\t\tthis.parent.transition('idle')\n\t}\n\n\tprivate update() {\n\t\tconst { editor, shapeId, initialPagePoint } = this\n\t\tconst { initialHandle, initialPageRotation, initialAdjacentHandle } = this\n\t\tconst isSnapMode = this.editor.user.getIsSnapMode()\n\t\tconst {\n\t\t\tsnaps,\n\t\t\tinputs: { currentPagePoint, shiftKey, ctrlKey, altKey, pointerVelocity },\n\t\t} = editor\n\n\t\tconst initial = this.info.shape\n\n\t\tconst shape = editor.getShape(shapeId)\n\t\tif (!shape) return\n\t\tconst util = editor.getShapeUtil(shape)\n\n\t\tconst initialBinding = editor.isShapeOfType<TLArrowShape>(shape, 'arrow')\n\t\t\t? getArrowBindings(editor, shape)[initialHandle.id as 'start' | 'end']\n\t\t\t: undefined\n\n\t\tlet point = currentPagePoint\n\t\t\t.clone()\n\t\t\t.sub(initialPagePoint)\n\t\t\t.rot(-initialPageRotation)\n\t\t\t.add(initialHandle)\n\n\t\tif (shiftKey && initialAdjacentHandle && initialHandle.id !== 'middle') {\n\t\t\tconst angle = Vec.Angle(initialAdjacentHandle, point)\n\t\t\tconst snappedAngle = snapAngle(angle, 24)\n\t\t\tconst angleDifference = snappedAngle - angle\n\t\t\tpoint = Vec.RotWith(point, initialAdjacentHandle, angleDifference)\n\t\t}\n\n\t\t// Clear any existing snaps\n\t\teditor.snaps.clearIndicators()\n\n\t\tlet nextHandle = { ...initialHandle, x: point.x, y: point.y }\n\n\t\tlet canSnap = false\n\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\t\tif (initialHandle.canSnap && initialHandle.snapType) {\n\t\t\twarnOnce(\n\t\t\t\t'canSnap is deprecated. Cannot use both canSnap and snapType together - snapping disabled. Please use only snapType.'\n\t\t\t)\n\t\t} else {\n\t\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated\n\t\t\tcanSnap = initialHandle.canSnap || initialHandle.snapType !== undefined\n\t\t}\n\n\t\tif (canSnap && (isSnapMode ? !ctrlKey : ctrlKey)) {\n\t\t\t// We're snapping\n\t\t\tconst pageTransform = editor.getShapePageTransform(shape.id)\n\t\t\tif (!pageTransform) throw Error('Expected a page transform')\n\n\t\t\tconst snap = snaps.handles.snapHandle({ currentShapeId: shapeId, handle: nextHandle })\n\n\t\t\tif (snap) {\n\t\t\t\tsnap.nudge.rot(-editor.getShapeParentTransform(shape)!.rotation())\n\t\t\t\tpoint.add(snap.nudge)\n\t\t\t\tnextHandle = { ...initialHandle, x: point.x, y: point.y }\n\t\t\t}\n\t\t}\n\n\t\tconst changes = util.onHandleDrag?.(shape, {\n\t\t\thandle: nextHandle,\n\t\t\tisPrecise: this.isPrecise || altKey,\n\t\t\tisCreatingShape: !!this.info.isCreating,\n\t\t\tinitial: initial,\n\t\t})\n\n\t\tconst next: TLShapePartial<any> = { id: shape.id, type: shape.type, ...changes }\n\n\t\t// Arrows\n\t\tif (\n\t\t\tinitialHandle.type === 'vertex' &&\n\t\t\tthis.editor.isShapeOfType<TLArrowShape>(shape, 'arrow')\n\t\t) {\n\t\t\tconst bindingAfter = getArrowBindings(editor, shape)[initialHandle.id as 'start' | 'end']\n\n\t\t\tif (bindingAfter) {\n\t\t\t\tif (initialBinding?.toId !== bindingAfter.toId) {\n\t\t\t\t\tthis.pointingId = bindingAfter.toId\n\t\t\t\t\tthis.isPrecise = pointerVelocity.len() < 0.5 || altKey\n\t\t\t\t\tthis.isPreciseId = this.isPrecise ? bindingAfter.toId : null\n\t\t\t\t\tthis.resetExactTimeout()\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tif (initialBinding) {\n\t\t\t\t\tthis.pointingId = null\n\t\t\t\t\tthis.isPrecise = false\n\t\t\t\t\tthis.isPreciseId = null\n\t\t\t\t\tthis.resetExactTimeout()\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tif (changes) {\n\t\t\teditor.updateShapes([next])\n\t\t}\n\t}\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["handle"]
|
|
7
7
|
}
|
|
@@ -407,7 +407,7 @@ class Idle extends import_editor.StateNode {
|
|
|
407
407
|
}
|
|
408
408
|
case "Tab": {
|
|
409
409
|
const selectedShapes = this.editor.getSelectedShapes();
|
|
410
|
-
if (selectedShapes.length) {
|
|
410
|
+
if (selectedShapes.length && !info.altKey) {
|
|
411
411
|
this.editor.selectAdjacentShape(info.shiftKey ? "prev" : "next");
|
|
412
412
|
}
|
|
413
413
|
break;
|
|
@@ -446,7 +446,7 @@ class Idle extends import_editor.StateNode {
|
|
|
446
446
|
}
|
|
447
447
|
case "Tab": {
|
|
448
448
|
const selectedShapes = this.editor.getSelectedShapes();
|
|
449
|
-
if (selectedShapes.length) {
|
|
449
|
+
if (selectedShapes.length && !info.altKey) {
|
|
450
450
|
this.editor.selectAdjacentShape(info.shiftKey ? "prev" : "next");
|
|
451
451
|
}
|
|
452
452
|
break;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/lib/tools/SelectTool/childStates/Idle.ts"],
|
|
4
|
-
"sourcesContent": ["import {\n\tEditor,\n\tStateNode,\n\tTLAdjacentDirection,\n\tTLClickEventInfo,\n\tTLGroupShape,\n\tTLKeyboardEventInfo,\n\tTLPointerEventInfo,\n\tTLShape,\n\tTLTextShape,\n\tVec,\n\tVecLike,\n\tcreateShapeId,\n\tdebugFlags,\n\tkickoutOccludedShapes,\n\tpointInPolygon,\n\ttoRichText,\n} from '@tldraw/editor'\nimport { isOverArrowLabel } from '../../../shapes/arrow/arrowLabel'\nimport { getHitShapeOnCanvasPointerDown } from '../../selection-logic/getHitShapeOnCanvasPointerDown'\nimport { getShouldEnterCropMode } from '../../selection-logic/getShouldEnterCropModeOnPointerDown'\nimport { selectOnCanvasPointerUp } from '../../selection-logic/selectOnCanvasPointerUp'\nimport { updateHoveredShapeId } from '../../selection-logic/updateHoveredShapeId'\nimport { startEditingShapeWithLabel } from '../selectHelpers'\n\nconst SKIPPED_KEYS_FOR_AUTO_EDITING = [\n\t'Delete',\n\t'Backspace',\n\t'[',\n\t']',\n\t'Enter',\n\t' ',\n\t'Shift',\n\t'Tab',\n]\n\nexport class Idle extends StateNode {\n\tstatic override id = 'idle'\n\n\tselectedShapesOnKeyDown: TLShape[] = []\n\n\toverride onEnter() {\n\t\tthis.parent.setCurrentToolIdMask(undefined)\n\t\tupdateHoveredShapeId(this.editor)\n\t\tthis.selectedShapesOnKeyDown = []\n\t\tthis.editor.setCursor({ type: 'default', rotation: 0 })\n\t}\n\n\toverride onExit() {\n\t\tupdateHoveredShapeId.cancel()\n\t}\n\n\toverride onPointerMove() {\n\t\tupdateHoveredShapeId(this.editor)\n\t}\n\n\toverride onPointerDown(info: TLPointerEventInfo) {\n\t\tconst shouldEnterCropMode = info.ctrlKey && getShouldEnterCropMode(this.editor)\n\n\t\tswitch (info.target) {\n\t\t\tcase 'canvas': {\n\t\t\t\t// Check to see if we hit any shape under the pointer; if so,\n\t\t\t\t// handle this as a pointer down on the shape instead of the canvas\n\t\t\t\tconst hitShape = getHitShapeOnCanvasPointerDown(this.editor)\n\t\t\t\tif (hitShape && !hitShape.isLocked) {\n\t\t\t\t\tthis.onPointerDown({\n\t\t\t\t\t\t...info,\n\t\t\t\t\t\tshape: hitShape,\n\t\t\t\t\t\ttarget: 'shape',\n\t\t\t\t\t})\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\tconst selectedShapeIds = this.editor.getSelectedShapeIds()\n\t\t\t\tconst onlySelectedShape = this.editor.getOnlySelectedShape()\n\t\t\t\tconst {\n\t\t\t\t\tinputs: { currentPagePoint },\n\t\t\t\t} = this.editor\n\n\t\t\t\tif (\n\t\t\t\t\tselectedShapeIds.length > 1 ||\n\t\t\t\t\t(onlySelectedShape &&\n\t\t\t\t\t\t!this.editor.getShapeUtil(onlySelectedShape).hideSelectionBoundsBg(onlySelectedShape))\n\t\t\t\t) {\n\t\t\t\t\tif (isPointInRotatedSelectionBounds(this.editor, currentPagePoint)) {\n\t\t\t\t\t\tthis.onPointerDown({\n\t\t\t\t\t\t\t...info,\n\t\t\t\t\t\t\ttarget: 'selection',\n\t\t\t\t\t\t})\n\t\t\t\t\t\treturn\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tthis.parent.transition('pointing_canvas', info)\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'shape': {\n\t\t\t\tconst { shape } = info\n\n\t\t\t\tif (this.editor.isShapeOrAncestorLocked(shape)) {\n\t\t\t\t\tthis.parent.transition('pointing_canvas', info)\n\t\t\t\t\tbreak\n\t\t\t\t}\n\n\t\t\t\t// If we're holding ctrl key, we might select it, or start brushing...\n\t\t\t\tthis.parent.transition('pointing_shape', info)\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'handle': {\n\t\t\t\tif (this.editor.getIsReadonly()) break\n\t\t\t\tif (this.editor.inputs.altKey) {\n\t\t\t\t\tthis.parent.transition('pointing_shape', info)\n\t\t\t\t} else {\n\t\t\t\t\t// If we're holding ctrl key, we might select it, or start brushing...\n\t\t\t\t\tthis.parent.transition('pointing_handle', info)\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'selection': {\n\t\t\t\tswitch (info.handle) {\n\t\t\t\t\tcase 'mobile_rotate':\n\t\t\t\t\tcase 'top_left_rotate':\n\t\t\t\t\tcase 'top_right_rotate':\n\t\t\t\t\tcase 'bottom_left_rotate':\n\t\t\t\t\tcase 'bottom_right_rotate': {\n\t\t\t\t\t\tif (info.accelKey) {\n\t\t\t\t\t\t\tthis.parent.transition('brushing', info)\n\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t}\n\t\t\t\t\t\tthis.parent.transition('pointing_rotate_handle', info)\n\t\t\t\t\t\tbreak\n\t\t\t\t\t}\n\t\t\t\t\tcase 'top':\n\t\t\t\t\tcase 'right':\n\t\t\t\t\tcase 'bottom':\n\t\t\t\t\tcase 'left':\n\t\t\t\t\tcase 'top_left':\n\t\t\t\t\tcase 'top_right':\n\t\t\t\t\tcase 'bottom_left':\n\t\t\t\t\tcase 'bottom_right': {\n\t\t\t\t\t\tif (shouldEnterCropMode) {\n\t\t\t\t\t\t\tthis.parent.transition('crop.pointing_crop_handle', info)\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tif (info.accelKey) {\n\t\t\t\t\t\t\t\tthis.parent.transition('brushing', info)\n\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tthis.parent.transition('pointing_resize_handle', info)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tbreak\n\t\t\t\t\t}\n\t\t\t\t\tdefault: {\n\t\t\t\t\t\tconst hoveredShape = this.editor.getHoveredShape()\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\thoveredShape &&\n\t\t\t\t\t\t\t!this.editor.getSelectedShapeIds().includes(hoveredShape.id) &&\n\t\t\t\t\t\t\t!hoveredShape.isLocked\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tthis.onPointerDown({\n\t\t\t\t\t\t\t\t...info,\n\t\t\t\t\t\t\t\tshape: hoveredShape,\n\t\t\t\t\t\t\t\ttarget: 'shape',\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\treturn\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tthis.parent.transition('pointing_selection', info)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t}\n\t}\n\n\toverride onDoubleClick(info: TLClickEventInfo) {\n\t\tif (this.editor.inputs.shiftKey || info.phase !== 'up') return\n\n\t\t// We don't want to double click while toggling shapes\n\t\tif (info.ctrlKey || info.shiftKey) return\n\n\t\tswitch (info.target) {\n\t\t\tcase 'canvas': {\n\t\t\t\tconst hoveredShape = this.editor.getHoveredShape()\n\n\t\t\t\t// todo\n\t\t\t\t// double clicking on the middle of a hollow geo shape without a label, or\n\t\t\t\t// over the label of a hollwo shape that has a label, should start editing\n\t\t\t\t// that shape's label. We can't support \"double click anywhere inside\"\n\t\t\t\t// of the shape yet because that also creates text shapes, and can produce\n\t\t\t\t// unexpected results when working \"inside of\" a hollow shape.\n\n\t\t\t\tconst hitShape =\n\t\t\t\t\thoveredShape && !this.editor.isShapeOfType<TLGroupShape>(hoveredShape, 'group')\n\t\t\t\t\t\t? hoveredShape\n\t\t\t\t\t\t: (this.editor.getSelectedShapeAtPoint(this.editor.inputs.currentPagePoint) ??\n\t\t\t\t\t\t\tthis.editor.getShapeAtPoint(this.editor.inputs.currentPagePoint, {\n\t\t\t\t\t\t\t\tmargin: this.editor.options.hitTestMargin / this.editor.getZoomLevel(),\n\t\t\t\t\t\t\t\thitInside: false,\n\t\t\t\t\t\t\t}))\n\n\t\t\t\tconst focusedGroupId = this.editor.getFocusedGroupId()\n\n\t\t\t\tif (hitShape) {\n\t\t\t\t\tif (this.editor.isShapeOfType<TLGroupShape>(hitShape, 'group')) {\n\t\t\t\t\t\t// Probably select the shape\n\t\t\t\t\t\tselectOnCanvasPointerUp(this.editor, info)\n\t\t\t\t\t\treturn\n\t\t\t\t\t} else {\n\t\t\t\t\t\tconst parent = this.editor.getShape(hitShape.parentId)\n\t\t\t\t\t\tif (parent && this.editor.isShapeOfType<TLGroupShape>(parent, 'group')) {\n\t\t\t\t\t\t\t// The shape is the direct child of a group. If the group is\n\t\t\t\t\t\t\t// selected, then we can select the shape. If the group is the\n\t\t\t\t\t\t\t// focus layer id, then we can double click into it as usual.\n\t\t\t\t\t\t\tif (focusedGroupId && parent.id === focusedGroupId) {\n\t\t\t\t\t\t\t\t// noop, double click on the shape as normal below\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t// The shape is the child of some group other than our current\n\t\t\t\t\t\t\t\t// focus layer. We should probably select the group instead.\n\t\t\t\t\t\t\t\tselectOnCanvasPointerUp(this.editor, info)\n\t\t\t\t\t\t\t\treturn\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// double click on the shape. We'll start editing the\n\t\t\t\t\t// shape if it's editable or else do a double click on\n\t\t\t\t\t// the canvas.\n\t\t\t\t\tthis.onDoubleClick({\n\t\t\t\t\t\t...info,\n\t\t\t\t\t\tshape: hitShape,\n\t\t\t\t\t\ttarget: 'shape',\n\t\t\t\t\t})\n\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\tif (!this.editor.inputs.shiftKey) {\n\t\t\t\t\tthis.handleDoubleClickOnCanvas(info)\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'selection': {\n\t\t\t\tif (this.editor.getIsReadonly()) break\n\n\t\t\t\tconst onlySelectedShape = this.editor.getOnlySelectedShape()\n\n\t\t\t\tif (onlySelectedShape) {\n\t\t\t\t\tconst util = this.editor.getShapeUtil(onlySelectedShape)\n\n\t\t\t\t\tif (!this.canInteractWithShapeInReadOnly(onlySelectedShape)) {\n\t\t\t\t\t\treturn\n\t\t\t\t\t}\n\n\t\t\t\t\t// Test edges for an onDoubleClickEdge handler\n\t\t\t\t\tif (\n\t\t\t\t\t\tinfo.handle === 'right' ||\n\t\t\t\t\t\tinfo.handle === 'left' ||\n\t\t\t\t\t\tinfo.handle === 'top' ||\n\t\t\t\t\t\tinfo.handle === 'bottom'\n\t\t\t\t\t) {\n\t\t\t\t\t\tconst change = util.onDoubleClickEdge?.(onlySelectedShape, info)\n\t\t\t\t\t\tif (change) {\n\t\t\t\t\t\t\tthis.editor.markHistoryStoppingPoint('double click edge')\n\t\t\t\t\t\t\tthis.editor.updateShapes([change])\n\t\t\t\t\t\t\tkickoutOccludedShapes(this.editor, [onlySelectedShape.id])\n\t\t\t\t\t\t\treturn\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tif (\n\t\t\t\t\t\tinfo.handle === 'top_left' ||\n\t\t\t\t\t\tinfo.handle === 'top_right' ||\n\t\t\t\t\t\tinfo.handle === 'bottom_right' ||\n\t\t\t\t\t\tinfo.handle === 'bottom_left'\n\t\t\t\t\t) {\n\t\t\t\t\t\tconst change = util.onDoubleClickCorner?.(onlySelectedShape, info)\n\t\t\t\t\t\tif (change) {\n\t\t\t\t\t\t\tthis.editor.markHistoryStoppingPoint('double click corner')\n\t\t\t\t\t\t\tthis.editor.updateShapes([change])\n\t\t\t\t\t\t\tkickoutOccludedShapes(this.editor, [onlySelectedShape.id])\n\t\t\t\t\t\t\treturn\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t// For corners OR edges but NOT rotation corners\n\t\t\t\t\tif (\n\t\t\t\t\t\tutil.canCrop(onlySelectedShape) &&\n\t\t\t\t\t\t!this.editor.isShapeOrAncestorLocked(onlySelectedShape)\n\t\t\t\t\t) {\n\t\t\t\t\t\tthis.parent.transition('crop', info)\n\t\t\t\t\t\treturn\n\t\t\t\t\t}\n\n\t\t\t\t\tif (this.shouldStartEditingShape(onlySelectedShape)) {\n\t\t\t\t\t\tthis.startEditingShape(onlySelectedShape, info, true /* select all */)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'shape': {\n\t\t\t\tconst { shape } = info\n\t\t\t\tconst util = this.editor.getShapeUtil(shape)\n\n\t\t\t\t// Allow playing videos and embeds\n\t\t\t\tif (shape.type !== 'video' && shape.type !== 'embed' && this.editor.getIsReadonly()) break\n\n\t\t\t\tif (util.onDoubleClick) {\n\t\t\t\t\t// Call the shape's double click handler\n\t\t\t\t\tconst change = util.onDoubleClick?.(shape)\n\t\t\t\t\tif (change) {\n\t\t\t\t\t\tthis.editor.updateShapes([change])\n\t\t\t\t\t\treturn\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tif (util.canCrop(shape) && !this.editor.isShapeOrAncestorLocked(shape)) {\n\t\t\t\t\t// crop image etc on double click\n\t\t\t\t\tthis.editor.markHistoryStoppingPoint('select and crop')\n\t\t\t\t\tthis.editor.select(info.shape?.id)\n\t\t\t\t\tthis.parent.transition('crop', info)\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\t// If the shape can edit, then begin editing\n\t\t\t\tif (this.shouldStartEditingShape(shape)) {\n\t\t\t\t\tthis.startEditingShape(shape, info, true /* select all */)\n\t\t\t\t} else {\n\t\t\t\t\t// If the shape's double click handler has not created a change,\n\t\t\t\t\t// and if the shape cannot edit, then create a text shape and\n\t\t\t\t\t// begin editing the text shape\n\t\t\t\t\tthis.handleDoubleClickOnCanvas(info)\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'handle': {\n\t\t\t\tif (this.editor.getIsReadonly()) break\n\t\t\t\tconst { shape, handle } = info\n\n\t\t\t\tconst util = this.editor.getShapeUtil(shape)\n\t\t\t\tconst changes = util.onDoubleClickHandle?.(shape, handle)\n\n\t\t\t\tif (changes) {\n\t\t\t\t\tthis.editor.updateShapes([changes])\n\t\t\t\t} else {\n\t\t\t\t\t// If the shape's double click handler has not created a change,\n\t\t\t\t\t// and if the shape can edit, then begin editing the shape.\n\t\t\t\t\tif (this.shouldStartEditingShape(shape)) {\n\t\t\t\t\t\tthis.startEditingShape(shape, info, true /* select all */)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\toverride onRightClick(info: TLPointerEventInfo) {\n\t\tswitch (info.target) {\n\t\t\tcase 'canvas': {\n\t\t\t\tconst hoveredShape = this.editor.getHoveredShape()\n\t\t\t\tconst hitShape =\n\t\t\t\t\thoveredShape && !this.editor.isShapeOfType<TLGroupShape>(hoveredShape, 'group')\n\t\t\t\t\t\t? hoveredShape\n\t\t\t\t\t\t: this.editor.getShapeAtPoint(this.editor.inputs.currentPagePoint, {\n\t\t\t\t\t\t\t\tmargin: this.editor.options.hitTestMargin / this.editor.getZoomLevel(),\n\t\t\t\t\t\t\t\thitInside: false,\n\t\t\t\t\t\t\t\thitLabels: true,\n\t\t\t\t\t\t\t\thitLocked: true,\n\t\t\t\t\t\t\t\thitFrameInside: true,\n\t\t\t\t\t\t\t\trenderingOnly: true,\n\t\t\t\t\t\t\t})\n\n\t\t\t\tif (hitShape) {\n\t\t\t\t\tthis.onRightClick({\n\t\t\t\t\t\t...info,\n\t\t\t\t\t\tshape: hitShape,\n\t\t\t\t\t\ttarget: 'shape',\n\t\t\t\t\t})\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\tconst selectedShapeIds = this.editor.getSelectedShapeIds()\n\t\t\t\tconst onlySelectedShape = this.editor.getOnlySelectedShape()\n\t\t\t\tconst {\n\t\t\t\t\tinputs: { currentPagePoint },\n\t\t\t\t} = this.editor\n\n\t\t\t\tif (\n\t\t\t\t\tselectedShapeIds.length > 1 ||\n\t\t\t\t\t(onlySelectedShape &&\n\t\t\t\t\t\t!this.editor.getShapeUtil(onlySelectedShape).hideSelectionBoundsBg(onlySelectedShape))\n\t\t\t\t) {\n\t\t\t\t\tif (isPointInRotatedSelectionBounds(this.editor, currentPagePoint)) {\n\t\t\t\t\t\tthis.onRightClick({\n\t\t\t\t\t\t\t...info,\n\t\t\t\t\t\t\ttarget: 'selection',\n\t\t\t\t\t\t})\n\t\t\t\t\t\treturn\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tthis.editor.selectNone()\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'shape': {\n\t\t\t\tconst { selectedShapeIds } = this.editor.getCurrentPageState()\n\t\t\t\tconst { shape } = info\n\n\t\t\t\tconst targetShape = this.editor.getOutermostSelectableShape(\n\t\t\t\t\tshape,\n\t\t\t\t\t(parent) => !selectedShapeIds.includes(parent.id)\n\t\t\t\t)\n\n\t\t\t\tif (\n\t\t\t\t\t!selectedShapeIds.includes(targetShape.id) &&\n\t\t\t\t\t!this.editor.findShapeAncestor(targetShape, (shape) =>\n\t\t\t\t\t\tselectedShapeIds.includes(shape.id)\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\tthis.editor.markHistoryStoppingPoint('selecting shape')\n\t\t\t\t\tthis.editor.setSelectedShapes([targetShape.id])\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t}\n\t}\n\n\toverride onCancel() {\n\t\tif (\n\t\t\tthis.editor.getFocusedGroupId() !== this.editor.getCurrentPageId() &&\n\t\t\tthis.editor.getSelectedShapeIds().length > 0\n\t\t) {\n\t\t\tthis.editor.popFocusedGroupId()\n\t\t} else {\n\t\t\tthis.editor.markHistoryStoppingPoint('clearing selection')\n\t\t\tthis.editor.selectNone()\n\t\t}\n\t}\n\n\toverride onKeyDown(info: TLKeyboardEventInfo) {\n\t\tthis.selectedShapesOnKeyDown = this.editor.getSelectedShapes()\n\n\t\tswitch (info.code) {\n\t\t\tcase 'ArrowLeft':\n\t\t\tcase 'ArrowRight':\n\t\t\tcase 'ArrowUp':\n\t\t\tcase 'ArrowDown': {\n\t\t\t\tif (info.accelKey) {\n\t\t\t\t\tif (info.shiftKey) {\n\t\t\t\t\t\tif (info.code === 'ArrowDown') {\n\t\t\t\t\t\t\tthis.editor.selectFirstChildShape()\n\t\t\t\t\t\t} else if (info.code === 'ArrowUp') {\n\t\t\t\t\t\t\tthis.editor.selectParentShape()\n\t\t\t\t\t\t}\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.editor.selectAdjacentShape(\n\t\t\t\t\t\t\tinfo.code.replace('Arrow', '').toLowerCase() as TLAdjacentDirection\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\tthis.nudgeSelectedShapes(false)\n\t\t\t\treturn\n\t\t\t}\n\t\t}\n\n\t\tif (debugFlags['editOnType'].get()) {\n\t\t\t// This feature flag lets us start editing a note shape's label when a key is pressed.\n\t\t\t// We exclude certain keys to avoid conflicting with modifiers, but there are conflicts\n\t\t\t// with other action kbds, hence why this is kept behind a feature flag.\n\t\t\tif (!SKIPPED_KEYS_FOR_AUTO_EDITING.includes(info.key) && !info.altKey && !info.ctrlKey) {\n\t\t\t\t// If the only selected shape is editable, then begin editing it\n\t\t\t\tconst onlySelectedShape = this.editor.getOnlySelectedShape()\n\t\t\t\tif (\n\t\t\t\t\tonlySelectedShape &&\n\t\t\t\t\t// If it's a note shape, then edit on type\n\t\t\t\t\tthis.editor.isShapeOfType(onlySelectedShape, 'note') &&\n\t\t\t\t\t// If it's not locked or anything\n\t\t\t\t\tthis.shouldStartEditingShape(onlySelectedShape)\n\t\t\t\t) {\n\t\t\t\t\tthis.startEditingShape(\n\t\t\t\t\t\tonlySelectedShape,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t...info,\n\t\t\t\t\t\t\ttarget: 'shape',\n\t\t\t\t\t\t\tshape: onlySelectedShape,\n\t\t\t\t\t\t},\n\t\t\t\t\t\ttrue /* select all */\n\t\t\t\t\t)\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\toverride onKeyRepeat(info: TLKeyboardEventInfo) {\n\t\tswitch (info.code) {\n\t\t\tcase 'ArrowLeft':\n\t\t\tcase 'ArrowRight':\n\t\t\tcase 'ArrowUp':\n\t\t\tcase 'ArrowDown': {\n\t\t\t\tif (info.accelKey) {\n\t\t\t\t\tthis.editor.selectAdjacentShape(\n\t\t\t\t\t\tinfo.code.replace('Arrow', '').toLowerCase() as TLAdjacentDirection\n\t\t\t\t\t)\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\tthis.nudgeSelectedShapes(true)\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'Tab': {\n\t\t\t\tconst selectedShapes = this.editor.getSelectedShapes()\n\t\t\t\tif (selectedShapes.length) {\n\t\t\t\t\tthis.editor.selectAdjacentShape(info.shiftKey ? 'prev' : 'next')\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t}\n\t}\n\n\toverride onKeyUp(info: TLKeyboardEventInfo) {\n\t\tswitch (info.key) {\n\t\t\tcase 'Enter': {\n\t\t\t\t// Because Enter onKeyDown can happen outside the canvas (but then focus the canvas potentially),\n\t\t\t\t// we need to check if the canvas was initially selecting something before continuing.\n\t\t\t\tif (!this.selectedShapesOnKeyDown.length) return\n\n\t\t\t\tconst selectedShapes = this.editor.getSelectedShapes()\n\n\t\t\t\t// On enter, if every selected shape is a group, then select all of the children of the groups\n\t\t\t\tif (\n\t\t\t\t\tselectedShapes.every((shape) => this.editor.isShapeOfType<TLGroupShape>(shape, 'group'))\n\t\t\t\t) {\n\t\t\t\t\tthis.editor.setSelectedShapes(\n\t\t\t\t\t\tselectedShapes.flatMap((shape) => this.editor.getSortedChildIdsForParent(shape.id))\n\t\t\t\t\t)\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\t// If the only selected shape is editable, then begin editing it\n\t\t\t\tconst onlySelectedShape = this.editor.getOnlySelectedShape()\n\t\t\t\tif (onlySelectedShape && this.shouldStartEditingShape(onlySelectedShape)) {\n\t\t\t\t\tthis.startEditingShape(\n\t\t\t\t\t\tonlySelectedShape,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t...info,\n\t\t\t\t\t\t\ttarget: 'shape',\n\t\t\t\t\t\t\tshape: onlySelectedShape,\n\t\t\t\t\t\t},\n\t\t\t\t\t\ttrue /* select all */\n\t\t\t\t\t)\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\t// If the only selected shape is croppable, then begin cropping it\n\t\t\t\tif (getShouldEnterCropMode(this.editor)) {\n\t\t\t\t\tthis.parent.transition('crop', info)\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'Tab': {\n\t\t\t\tconst selectedShapes = this.editor.getSelectedShapes()\n\t\t\t\tif (selectedShapes.length) {\n\t\t\t\t\tthis.editor.selectAdjacentShape(info.shiftKey ? 'prev' : 'next')\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate shouldStartEditingShape(\n\t\tshape: TLShape | null = this.editor.getOnlySelectedShape()\n\t): boolean {\n\t\tif (!shape) return false\n\t\tif (this.editor.isShapeOrAncestorLocked(shape) && shape.type !== 'embed') return false\n\t\tif (!this.canInteractWithShapeInReadOnly(shape)) return false\n\t\treturn this.editor.getShapeUtil(shape).canEdit(shape)\n\t}\n\n\tprivate startEditingShape(\n\t\tshape: TLShape,\n\t\tinfo: TLClickEventInfo | TLKeyboardEventInfo,\n\t\tshouldSelectAll?: boolean\n\t) {\n\t\tif (this.editor.isShapeOrAncestorLocked(shape) && shape.type !== 'embed') return\n\t\tthis.editor.markHistoryStoppingPoint('editing shape')\n\t\tstartEditingShapeWithLabel(this.editor, shape, shouldSelectAll)\n\t\tthis.parent.transition('editing_shape', info)\n\t}\n\n\tisOverArrowLabelTest(shape: TLShape | undefined) {\n\t\tif (!shape) return false\n\n\t\treturn isOverArrowLabel(this.editor, shape)\n\t}\n\n\thandleDoubleClickOnCanvas(info: TLClickEventInfo) {\n\t\t// Create text shape and transition to editing_shape\n\t\tif (this.editor.getIsReadonly()) return\n\n\t\tif (!this.editor.options.createTextOnCanvasDoubleClick) return\n\n\t\tthis.editor.markHistoryStoppingPoint('creating text shape')\n\n\t\tconst id = createShapeId()\n\n\t\tconst { x, y } = this.editor.inputs.currentPagePoint\n\n\t\t// Allow this to trigger the max shapes reached alert\n\t\tthis.editor.createShapes<TLTextShape>([\n\t\t\t{\n\t\t\t\tid,\n\t\t\t\ttype: 'text',\n\t\t\t\tx,\n\t\t\t\ty,\n\t\t\t\tprops: {\n\t\t\t\t\trichText: toRichText(''),\n\t\t\t\t\tautoSize: true,\n\t\t\t\t},\n\t\t\t},\n\t\t])\n\n\t\tconst shape = this.editor.getShape(id)\n\t\tif (!shape) return\n\n\t\tconst util = this.editor.getShapeUtil(shape)\n\t\tif (this.editor.getIsReadonly()) {\n\t\t\tif (!util.canEditInReadonly(shape)) {\n\t\t\t\treturn\n\t\t\t}\n\t\t}\n\n\t\tthis.editor.setEditingShape(id)\n\t\tthis.editor.select(id)\n\t\tthis.parent.transition('editing_shape', info)\n\t}\n\n\tprivate nudgeSelectedShapes(ephemeral = false) {\n\t\tconst {\n\t\t\teditor: {\n\t\t\t\tinputs: { keys },\n\t\t\t},\n\t\t} = this\n\n\t\t// We want to use the \"actual\" shift key state,\n\t\t// not the one that's in the editor.inputs.shiftKey,\n\t\t// because that one uses a short timeout on release\n\t\tconst shiftKey = keys.has('ShiftLeft')\n\n\t\tconst delta = new Vec(0, 0)\n\n\t\tif (keys.has('ArrowLeft')) delta.x -= 1\n\t\tif (keys.has('ArrowRight')) delta.x += 1\n\t\tif (keys.has('ArrowUp')) delta.y -= 1\n\t\tif (keys.has('ArrowDown')) delta.y += 1\n\n\t\tif (delta.equals(new Vec(0, 0))) return\n\n\t\tif (!ephemeral) this.editor.markHistoryStoppingPoint('nudge shapes')\n\n\t\tconst { gridSize } = this.editor.getDocumentSettings()\n\n\t\tconst step = this.editor.getInstanceState().isGridMode\n\t\t\t? shiftKey\n\t\t\t\t? gridSize * GRID_INCREMENT\n\t\t\t\t: gridSize\n\t\t\t: shiftKey\n\t\t\t\t? MAJOR_NUDGE_FACTOR\n\t\t\t\t: MINOR_NUDGE_FACTOR\n\n\t\tconst selectedShapeIds = this.editor.getSelectedShapeIds()\n\t\tthis.editor.nudgeShapes(selectedShapeIds, delta.mul(step))\n\t\tkickoutOccludedShapes(this.editor, selectedShapeIds)\n\t}\n\n\tprivate canInteractWithShapeInReadOnly(shape: TLShape) {\n\t\tif (!this.editor.getIsReadonly()) return true\n\t\tconst util = this.editor.getShapeUtil(shape)\n\t\tif (util.canEditInReadonly(shape)) return true\n\t\treturn false\n\t}\n}\n\nexport const MAJOR_NUDGE_FACTOR = 10\nexport const MINOR_NUDGE_FACTOR = 1\nexport const GRID_INCREMENT = 5\n\nfunction isPointInRotatedSelectionBounds(editor: Editor, point: VecLike) {\n\tconst selectionBounds = editor.getSelectionRotatedPageBounds()\n\tif (!selectionBounds) return false\n\n\tconst selectionRotation = editor.getSelectionRotation()\n\tif (!selectionRotation) return selectionBounds.containsPoint(point)\n\n\treturn pointInPolygon(\n\t\tpoint,\n\t\tselectionBounds.corners.map((c) => Vec.RotWith(c, selectionBounds.point, selectionRotation))\n\t)\n}\n"],
|
|
5
|
-
"mappings": "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",
|
|
4
|
+
"sourcesContent": ["import {\n\tEditor,\n\tStateNode,\n\tTLAdjacentDirection,\n\tTLClickEventInfo,\n\tTLGroupShape,\n\tTLKeyboardEventInfo,\n\tTLPointerEventInfo,\n\tTLShape,\n\tTLTextShape,\n\tVec,\n\tVecLike,\n\tcreateShapeId,\n\tdebugFlags,\n\tkickoutOccludedShapes,\n\tpointInPolygon,\n\ttoRichText,\n} from '@tldraw/editor'\nimport { isOverArrowLabel } from '../../../shapes/arrow/arrowLabel'\nimport { getHitShapeOnCanvasPointerDown } from '../../selection-logic/getHitShapeOnCanvasPointerDown'\nimport { getShouldEnterCropMode } from '../../selection-logic/getShouldEnterCropModeOnPointerDown'\nimport { selectOnCanvasPointerUp } from '../../selection-logic/selectOnCanvasPointerUp'\nimport { updateHoveredShapeId } from '../../selection-logic/updateHoveredShapeId'\nimport { startEditingShapeWithLabel } from '../selectHelpers'\n\nconst SKIPPED_KEYS_FOR_AUTO_EDITING = [\n\t'Delete',\n\t'Backspace',\n\t'[',\n\t']',\n\t'Enter',\n\t' ',\n\t'Shift',\n\t'Tab',\n]\n\nexport class Idle extends StateNode {\n\tstatic override id = 'idle'\n\n\tselectedShapesOnKeyDown: TLShape[] = []\n\n\toverride onEnter() {\n\t\tthis.parent.setCurrentToolIdMask(undefined)\n\t\tupdateHoveredShapeId(this.editor)\n\t\tthis.selectedShapesOnKeyDown = []\n\t\tthis.editor.setCursor({ type: 'default', rotation: 0 })\n\t}\n\n\toverride onExit() {\n\t\tupdateHoveredShapeId.cancel()\n\t}\n\n\toverride onPointerMove() {\n\t\tupdateHoveredShapeId(this.editor)\n\t}\n\n\toverride onPointerDown(info: TLPointerEventInfo) {\n\t\tconst shouldEnterCropMode = info.ctrlKey && getShouldEnterCropMode(this.editor)\n\n\t\tswitch (info.target) {\n\t\t\tcase 'canvas': {\n\t\t\t\t// Check to see if we hit any shape under the pointer; if so,\n\t\t\t\t// handle this as a pointer down on the shape instead of the canvas\n\t\t\t\tconst hitShape = getHitShapeOnCanvasPointerDown(this.editor)\n\t\t\t\tif (hitShape && !hitShape.isLocked) {\n\t\t\t\t\tthis.onPointerDown({\n\t\t\t\t\t\t...info,\n\t\t\t\t\t\tshape: hitShape,\n\t\t\t\t\t\ttarget: 'shape',\n\t\t\t\t\t})\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\tconst selectedShapeIds = this.editor.getSelectedShapeIds()\n\t\t\t\tconst onlySelectedShape = this.editor.getOnlySelectedShape()\n\t\t\t\tconst {\n\t\t\t\t\tinputs: { currentPagePoint },\n\t\t\t\t} = this.editor\n\n\t\t\t\tif (\n\t\t\t\t\tselectedShapeIds.length > 1 ||\n\t\t\t\t\t(onlySelectedShape &&\n\t\t\t\t\t\t!this.editor.getShapeUtil(onlySelectedShape).hideSelectionBoundsBg(onlySelectedShape))\n\t\t\t\t) {\n\t\t\t\t\tif (isPointInRotatedSelectionBounds(this.editor, currentPagePoint)) {\n\t\t\t\t\t\tthis.onPointerDown({\n\t\t\t\t\t\t\t...info,\n\t\t\t\t\t\t\ttarget: 'selection',\n\t\t\t\t\t\t})\n\t\t\t\t\t\treturn\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tthis.parent.transition('pointing_canvas', info)\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'shape': {\n\t\t\t\tconst { shape } = info\n\n\t\t\t\tif (this.editor.isShapeOrAncestorLocked(shape)) {\n\t\t\t\t\tthis.parent.transition('pointing_canvas', info)\n\t\t\t\t\tbreak\n\t\t\t\t}\n\n\t\t\t\t// If we're holding ctrl key, we might select it, or start brushing...\n\t\t\t\tthis.parent.transition('pointing_shape', info)\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'handle': {\n\t\t\t\tif (this.editor.getIsReadonly()) break\n\t\t\t\tif (this.editor.inputs.altKey) {\n\t\t\t\t\tthis.parent.transition('pointing_shape', info)\n\t\t\t\t} else {\n\t\t\t\t\t// If we're holding ctrl key, we might select it, or start brushing...\n\t\t\t\t\tthis.parent.transition('pointing_handle', info)\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'selection': {\n\t\t\t\tswitch (info.handle) {\n\t\t\t\t\tcase 'mobile_rotate':\n\t\t\t\t\tcase 'top_left_rotate':\n\t\t\t\t\tcase 'top_right_rotate':\n\t\t\t\t\tcase 'bottom_left_rotate':\n\t\t\t\t\tcase 'bottom_right_rotate': {\n\t\t\t\t\t\tif (info.accelKey) {\n\t\t\t\t\t\t\tthis.parent.transition('brushing', info)\n\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t}\n\t\t\t\t\t\tthis.parent.transition('pointing_rotate_handle', info)\n\t\t\t\t\t\tbreak\n\t\t\t\t\t}\n\t\t\t\t\tcase 'top':\n\t\t\t\t\tcase 'right':\n\t\t\t\t\tcase 'bottom':\n\t\t\t\t\tcase 'left':\n\t\t\t\t\tcase 'top_left':\n\t\t\t\t\tcase 'top_right':\n\t\t\t\t\tcase 'bottom_left':\n\t\t\t\t\tcase 'bottom_right': {\n\t\t\t\t\t\tif (shouldEnterCropMode) {\n\t\t\t\t\t\t\tthis.parent.transition('crop.pointing_crop_handle', info)\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tif (info.accelKey) {\n\t\t\t\t\t\t\t\tthis.parent.transition('brushing', info)\n\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tthis.parent.transition('pointing_resize_handle', info)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tbreak\n\t\t\t\t\t}\n\t\t\t\t\tdefault: {\n\t\t\t\t\t\tconst hoveredShape = this.editor.getHoveredShape()\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\thoveredShape &&\n\t\t\t\t\t\t\t!this.editor.getSelectedShapeIds().includes(hoveredShape.id) &&\n\t\t\t\t\t\t\t!hoveredShape.isLocked\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tthis.onPointerDown({\n\t\t\t\t\t\t\t\t...info,\n\t\t\t\t\t\t\t\tshape: hoveredShape,\n\t\t\t\t\t\t\t\ttarget: 'shape',\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\treturn\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tthis.parent.transition('pointing_selection', info)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t}\n\t}\n\n\toverride onDoubleClick(info: TLClickEventInfo) {\n\t\tif (this.editor.inputs.shiftKey || info.phase !== 'up') return\n\n\t\t// We don't want to double click while toggling shapes\n\t\tif (info.ctrlKey || info.shiftKey) return\n\n\t\tswitch (info.target) {\n\t\t\tcase 'canvas': {\n\t\t\t\tconst hoveredShape = this.editor.getHoveredShape()\n\n\t\t\t\t// todo\n\t\t\t\t// double clicking on the middle of a hollow geo shape without a label, or\n\t\t\t\t// over the label of a hollwo shape that has a label, should start editing\n\t\t\t\t// that shape's label. We can't support \"double click anywhere inside\"\n\t\t\t\t// of the shape yet because that also creates text shapes, and can produce\n\t\t\t\t// unexpected results when working \"inside of\" a hollow shape.\n\n\t\t\t\tconst hitShape =\n\t\t\t\t\thoveredShape && !this.editor.isShapeOfType<TLGroupShape>(hoveredShape, 'group')\n\t\t\t\t\t\t? hoveredShape\n\t\t\t\t\t\t: (this.editor.getSelectedShapeAtPoint(this.editor.inputs.currentPagePoint) ??\n\t\t\t\t\t\t\tthis.editor.getShapeAtPoint(this.editor.inputs.currentPagePoint, {\n\t\t\t\t\t\t\t\tmargin: this.editor.options.hitTestMargin / this.editor.getZoomLevel(),\n\t\t\t\t\t\t\t\thitInside: false,\n\t\t\t\t\t\t\t}))\n\n\t\t\t\tconst focusedGroupId = this.editor.getFocusedGroupId()\n\n\t\t\t\tif (hitShape) {\n\t\t\t\t\tif (this.editor.isShapeOfType<TLGroupShape>(hitShape, 'group')) {\n\t\t\t\t\t\t// Probably select the shape\n\t\t\t\t\t\tselectOnCanvasPointerUp(this.editor, info)\n\t\t\t\t\t\treturn\n\t\t\t\t\t} else {\n\t\t\t\t\t\tconst parent = this.editor.getShape(hitShape.parentId)\n\t\t\t\t\t\tif (parent && this.editor.isShapeOfType<TLGroupShape>(parent, 'group')) {\n\t\t\t\t\t\t\t// The shape is the direct child of a group. If the group is\n\t\t\t\t\t\t\t// selected, then we can select the shape. If the group is the\n\t\t\t\t\t\t\t// focus layer id, then we can double click into it as usual.\n\t\t\t\t\t\t\tif (focusedGroupId && parent.id === focusedGroupId) {\n\t\t\t\t\t\t\t\t// noop, double click on the shape as normal below\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t// The shape is the child of some group other than our current\n\t\t\t\t\t\t\t\t// focus layer. We should probably select the group instead.\n\t\t\t\t\t\t\t\tselectOnCanvasPointerUp(this.editor, info)\n\t\t\t\t\t\t\t\treturn\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// double click on the shape. We'll start editing the\n\t\t\t\t\t// shape if it's editable or else do a double click on\n\t\t\t\t\t// the canvas.\n\t\t\t\t\tthis.onDoubleClick({\n\t\t\t\t\t\t...info,\n\t\t\t\t\t\tshape: hitShape,\n\t\t\t\t\t\ttarget: 'shape',\n\t\t\t\t\t})\n\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\tif (!this.editor.inputs.shiftKey) {\n\t\t\t\t\tthis.handleDoubleClickOnCanvas(info)\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'selection': {\n\t\t\t\tif (this.editor.getIsReadonly()) break\n\n\t\t\t\tconst onlySelectedShape = this.editor.getOnlySelectedShape()\n\n\t\t\t\tif (onlySelectedShape) {\n\t\t\t\t\tconst util = this.editor.getShapeUtil(onlySelectedShape)\n\n\t\t\t\t\tif (!this.canInteractWithShapeInReadOnly(onlySelectedShape)) {\n\t\t\t\t\t\treturn\n\t\t\t\t\t}\n\n\t\t\t\t\t// Test edges for an onDoubleClickEdge handler\n\t\t\t\t\tif (\n\t\t\t\t\t\tinfo.handle === 'right' ||\n\t\t\t\t\t\tinfo.handle === 'left' ||\n\t\t\t\t\t\tinfo.handle === 'top' ||\n\t\t\t\t\t\tinfo.handle === 'bottom'\n\t\t\t\t\t) {\n\t\t\t\t\t\tconst change = util.onDoubleClickEdge?.(onlySelectedShape, info)\n\t\t\t\t\t\tif (change) {\n\t\t\t\t\t\t\tthis.editor.markHistoryStoppingPoint('double click edge')\n\t\t\t\t\t\t\tthis.editor.updateShapes([change])\n\t\t\t\t\t\t\tkickoutOccludedShapes(this.editor, [onlySelectedShape.id])\n\t\t\t\t\t\t\treturn\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\tif (\n\t\t\t\t\t\tinfo.handle === 'top_left' ||\n\t\t\t\t\t\tinfo.handle === 'top_right' ||\n\t\t\t\t\t\tinfo.handle === 'bottom_right' ||\n\t\t\t\t\t\tinfo.handle === 'bottom_left'\n\t\t\t\t\t) {\n\t\t\t\t\t\tconst change = util.onDoubleClickCorner?.(onlySelectedShape, info)\n\t\t\t\t\t\tif (change) {\n\t\t\t\t\t\t\tthis.editor.markHistoryStoppingPoint('double click corner')\n\t\t\t\t\t\t\tthis.editor.updateShapes([change])\n\t\t\t\t\t\t\tkickoutOccludedShapes(this.editor, [onlySelectedShape.id])\n\t\t\t\t\t\t\treturn\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t// For corners OR edges but NOT rotation corners\n\t\t\t\t\tif (\n\t\t\t\t\t\tutil.canCrop(onlySelectedShape) &&\n\t\t\t\t\t\t!this.editor.isShapeOrAncestorLocked(onlySelectedShape)\n\t\t\t\t\t) {\n\t\t\t\t\t\tthis.parent.transition('crop', info)\n\t\t\t\t\t\treturn\n\t\t\t\t\t}\n\n\t\t\t\t\tif (this.shouldStartEditingShape(onlySelectedShape)) {\n\t\t\t\t\t\tthis.startEditingShape(onlySelectedShape, info, true /* select all */)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'shape': {\n\t\t\t\tconst { shape } = info\n\t\t\t\tconst util = this.editor.getShapeUtil(shape)\n\n\t\t\t\t// Allow playing videos and embeds\n\t\t\t\tif (shape.type !== 'video' && shape.type !== 'embed' && this.editor.getIsReadonly()) break\n\n\t\t\t\tif (util.onDoubleClick) {\n\t\t\t\t\t// Call the shape's double click handler\n\t\t\t\t\tconst change = util.onDoubleClick?.(shape)\n\t\t\t\t\tif (change) {\n\t\t\t\t\t\tthis.editor.updateShapes([change])\n\t\t\t\t\t\treturn\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tif (util.canCrop(shape) && !this.editor.isShapeOrAncestorLocked(shape)) {\n\t\t\t\t\t// crop image etc on double click\n\t\t\t\t\tthis.editor.markHistoryStoppingPoint('select and crop')\n\t\t\t\t\tthis.editor.select(info.shape?.id)\n\t\t\t\t\tthis.parent.transition('crop', info)\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\t// If the shape can edit, then begin editing\n\t\t\t\tif (this.shouldStartEditingShape(shape)) {\n\t\t\t\t\tthis.startEditingShape(shape, info, true /* select all */)\n\t\t\t\t} else {\n\t\t\t\t\t// If the shape's double click handler has not created a change,\n\t\t\t\t\t// and if the shape cannot edit, then create a text shape and\n\t\t\t\t\t// begin editing the text shape\n\t\t\t\t\tthis.handleDoubleClickOnCanvas(info)\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'handle': {\n\t\t\t\tif (this.editor.getIsReadonly()) break\n\t\t\t\tconst { shape, handle } = info\n\n\t\t\t\tconst util = this.editor.getShapeUtil(shape)\n\t\t\t\tconst changes = util.onDoubleClickHandle?.(shape, handle)\n\n\t\t\t\tif (changes) {\n\t\t\t\t\tthis.editor.updateShapes([changes])\n\t\t\t\t} else {\n\t\t\t\t\t// If the shape's double click handler has not created a change,\n\t\t\t\t\t// and if the shape can edit, then begin editing the shape.\n\t\t\t\t\tif (this.shouldStartEditingShape(shape)) {\n\t\t\t\t\t\tthis.startEditingShape(shape, info, true /* select all */)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\toverride onRightClick(info: TLPointerEventInfo) {\n\t\tswitch (info.target) {\n\t\t\tcase 'canvas': {\n\t\t\t\tconst hoveredShape = this.editor.getHoveredShape()\n\t\t\t\tconst hitShape =\n\t\t\t\t\thoveredShape && !this.editor.isShapeOfType<TLGroupShape>(hoveredShape, 'group')\n\t\t\t\t\t\t? hoveredShape\n\t\t\t\t\t\t: this.editor.getShapeAtPoint(this.editor.inputs.currentPagePoint, {\n\t\t\t\t\t\t\t\tmargin: this.editor.options.hitTestMargin / this.editor.getZoomLevel(),\n\t\t\t\t\t\t\t\thitInside: false,\n\t\t\t\t\t\t\t\thitLabels: true,\n\t\t\t\t\t\t\t\thitLocked: true,\n\t\t\t\t\t\t\t\thitFrameInside: true,\n\t\t\t\t\t\t\t\trenderingOnly: true,\n\t\t\t\t\t\t\t})\n\n\t\t\t\tif (hitShape) {\n\t\t\t\t\tthis.onRightClick({\n\t\t\t\t\t\t...info,\n\t\t\t\t\t\tshape: hitShape,\n\t\t\t\t\t\ttarget: 'shape',\n\t\t\t\t\t})\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\tconst selectedShapeIds = this.editor.getSelectedShapeIds()\n\t\t\t\tconst onlySelectedShape = this.editor.getOnlySelectedShape()\n\t\t\t\tconst {\n\t\t\t\t\tinputs: { currentPagePoint },\n\t\t\t\t} = this.editor\n\n\t\t\t\tif (\n\t\t\t\t\tselectedShapeIds.length > 1 ||\n\t\t\t\t\t(onlySelectedShape &&\n\t\t\t\t\t\t!this.editor.getShapeUtil(onlySelectedShape).hideSelectionBoundsBg(onlySelectedShape))\n\t\t\t\t) {\n\t\t\t\t\tif (isPointInRotatedSelectionBounds(this.editor, currentPagePoint)) {\n\t\t\t\t\t\tthis.onRightClick({\n\t\t\t\t\t\t\t...info,\n\t\t\t\t\t\t\ttarget: 'selection',\n\t\t\t\t\t\t})\n\t\t\t\t\t\treturn\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tthis.editor.selectNone()\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'shape': {\n\t\t\t\tconst { selectedShapeIds } = this.editor.getCurrentPageState()\n\t\t\t\tconst { shape } = info\n\n\t\t\t\tconst targetShape = this.editor.getOutermostSelectableShape(\n\t\t\t\t\tshape,\n\t\t\t\t\t(parent) => !selectedShapeIds.includes(parent.id)\n\t\t\t\t)\n\n\t\t\t\tif (\n\t\t\t\t\t!selectedShapeIds.includes(targetShape.id) &&\n\t\t\t\t\t!this.editor.findShapeAncestor(targetShape, (shape) =>\n\t\t\t\t\t\tselectedShapeIds.includes(shape.id)\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\tthis.editor.markHistoryStoppingPoint('selecting shape')\n\t\t\t\t\tthis.editor.setSelectedShapes([targetShape.id])\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t}\n\t}\n\n\toverride onCancel() {\n\t\tif (\n\t\t\tthis.editor.getFocusedGroupId() !== this.editor.getCurrentPageId() &&\n\t\t\tthis.editor.getSelectedShapeIds().length > 0\n\t\t) {\n\t\t\tthis.editor.popFocusedGroupId()\n\t\t} else {\n\t\t\tthis.editor.markHistoryStoppingPoint('clearing selection')\n\t\t\tthis.editor.selectNone()\n\t\t}\n\t}\n\n\toverride onKeyDown(info: TLKeyboardEventInfo) {\n\t\tthis.selectedShapesOnKeyDown = this.editor.getSelectedShapes()\n\n\t\tswitch (info.code) {\n\t\t\tcase 'ArrowLeft':\n\t\t\tcase 'ArrowRight':\n\t\t\tcase 'ArrowUp':\n\t\t\tcase 'ArrowDown': {\n\t\t\t\tif (info.accelKey) {\n\t\t\t\t\tif (info.shiftKey) {\n\t\t\t\t\t\tif (info.code === 'ArrowDown') {\n\t\t\t\t\t\t\tthis.editor.selectFirstChildShape()\n\t\t\t\t\t\t} else if (info.code === 'ArrowUp') {\n\t\t\t\t\t\t\tthis.editor.selectParentShape()\n\t\t\t\t\t\t}\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthis.editor.selectAdjacentShape(\n\t\t\t\t\t\t\tinfo.code.replace('Arrow', '').toLowerCase() as TLAdjacentDirection\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\tthis.nudgeSelectedShapes(false)\n\t\t\t\treturn\n\t\t\t}\n\t\t}\n\n\t\tif (debugFlags['editOnType'].get()) {\n\t\t\t// This feature flag lets us start editing a note shape's label when a key is pressed.\n\t\t\t// We exclude certain keys to avoid conflicting with modifiers, but there are conflicts\n\t\t\t// with other action kbds, hence why this is kept behind a feature flag.\n\t\t\tif (!SKIPPED_KEYS_FOR_AUTO_EDITING.includes(info.key) && !info.altKey && !info.ctrlKey) {\n\t\t\t\t// If the only selected shape is editable, then begin editing it\n\t\t\t\tconst onlySelectedShape = this.editor.getOnlySelectedShape()\n\t\t\t\tif (\n\t\t\t\t\tonlySelectedShape &&\n\t\t\t\t\t// If it's a note shape, then edit on type\n\t\t\t\t\tthis.editor.isShapeOfType(onlySelectedShape, 'note') &&\n\t\t\t\t\t// If it's not locked or anything\n\t\t\t\t\tthis.shouldStartEditingShape(onlySelectedShape)\n\t\t\t\t) {\n\t\t\t\t\tthis.startEditingShape(\n\t\t\t\t\t\tonlySelectedShape,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t...info,\n\t\t\t\t\t\t\ttarget: 'shape',\n\t\t\t\t\t\t\tshape: onlySelectedShape,\n\t\t\t\t\t\t},\n\t\t\t\t\t\ttrue /* select all */\n\t\t\t\t\t)\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\toverride onKeyRepeat(info: TLKeyboardEventInfo) {\n\t\tswitch (info.code) {\n\t\t\tcase 'ArrowLeft':\n\t\t\tcase 'ArrowRight':\n\t\t\tcase 'ArrowUp':\n\t\t\tcase 'ArrowDown': {\n\t\t\t\tif (info.accelKey) {\n\t\t\t\t\tthis.editor.selectAdjacentShape(\n\t\t\t\t\t\tinfo.code.replace('Arrow', '').toLowerCase() as TLAdjacentDirection\n\t\t\t\t\t)\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\tthis.nudgeSelectedShapes(true)\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'Tab': {\n\t\t\t\tconst selectedShapes = this.editor.getSelectedShapes()\n\t\t\t\tif (selectedShapes.length && !info.altKey) {\n\t\t\t\t\tthis.editor.selectAdjacentShape(info.shiftKey ? 'prev' : 'next')\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t}\n\t}\n\n\toverride onKeyUp(info: TLKeyboardEventInfo) {\n\t\tswitch (info.key) {\n\t\t\tcase 'Enter': {\n\t\t\t\t// Because Enter onKeyDown can happen outside the canvas (but then focus the canvas potentially),\n\t\t\t\t// we need to check if the canvas was initially selecting something before continuing.\n\t\t\t\tif (!this.selectedShapesOnKeyDown.length) return\n\n\t\t\t\tconst selectedShapes = this.editor.getSelectedShapes()\n\n\t\t\t\t// On enter, if every selected shape is a group, then select all of the children of the groups\n\t\t\t\tif (\n\t\t\t\t\tselectedShapes.every((shape) => this.editor.isShapeOfType<TLGroupShape>(shape, 'group'))\n\t\t\t\t) {\n\t\t\t\t\tthis.editor.setSelectedShapes(\n\t\t\t\t\t\tselectedShapes.flatMap((shape) => this.editor.getSortedChildIdsForParent(shape.id))\n\t\t\t\t\t)\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\t// If the only selected shape is editable, then begin editing it\n\t\t\t\tconst onlySelectedShape = this.editor.getOnlySelectedShape()\n\t\t\t\tif (onlySelectedShape && this.shouldStartEditingShape(onlySelectedShape)) {\n\t\t\t\t\tthis.startEditingShape(\n\t\t\t\t\t\tonlySelectedShape,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t...info,\n\t\t\t\t\t\t\ttarget: 'shape',\n\t\t\t\t\t\t\tshape: onlySelectedShape,\n\t\t\t\t\t\t},\n\t\t\t\t\t\ttrue /* select all */\n\t\t\t\t\t)\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\t// If the only selected shape is croppable, then begin cropping it\n\t\t\t\tif (getShouldEnterCropMode(this.editor)) {\n\t\t\t\t\tthis.parent.transition('crop', info)\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t\tcase 'Tab': {\n\t\t\t\tconst selectedShapes = this.editor.getSelectedShapes()\n\t\t\t\tif (selectedShapes.length && !info.altKey) {\n\t\t\t\t\tthis.editor.selectAdjacentShape(info.shiftKey ? 'prev' : 'next')\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate shouldStartEditingShape(\n\t\tshape: TLShape | null = this.editor.getOnlySelectedShape()\n\t): boolean {\n\t\tif (!shape) return false\n\t\tif (this.editor.isShapeOrAncestorLocked(shape) && shape.type !== 'embed') return false\n\t\tif (!this.canInteractWithShapeInReadOnly(shape)) return false\n\t\treturn this.editor.getShapeUtil(shape).canEdit(shape)\n\t}\n\n\tprivate startEditingShape(\n\t\tshape: TLShape,\n\t\tinfo: TLClickEventInfo | TLKeyboardEventInfo,\n\t\tshouldSelectAll?: boolean\n\t) {\n\t\tif (this.editor.isShapeOrAncestorLocked(shape) && shape.type !== 'embed') return\n\t\tthis.editor.markHistoryStoppingPoint('editing shape')\n\t\tstartEditingShapeWithLabel(this.editor, shape, shouldSelectAll)\n\t\tthis.parent.transition('editing_shape', info)\n\t}\n\n\tisOverArrowLabelTest(shape: TLShape | undefined) {\n\t\tif (!shape) return false\n\n\t\treturn isOverArrowLabel(this.editor, shape)\n\t}\n\n\thandleDoubleClickOnCanvas(info: TLClickEventInfo) {\n\t\t// Create text shape and transition to editing_shape\n\t\tif (this.editor.getIsReadonly()) return\n\n\t\tif (!this.editor.options.createTextOnCanvasDoubleClick) return\n\n\t\tthis.editor.markHistoryStoppingPoint('creating text shape')\n\n\t\tconst id = createShapeId()\n\n\t\tconst { x, y } = this.editor.inputs.currentPagePoint\n\n\t\t// Allow this to trigger the max shapes reached alert\n\t\tthis.editor.createShapes<TLTextShape>([\n\t\t\t{\n\t\t\t\tid,\n\t\t\t\ttype: 'text',\n\t\t\t\tx,\n\t\t\t\ty,\n\t\t\t\tprops: {\n\t\t\t\t\trichText: toRichText(''),\n\t\t\t\t\tautoSize: true,\n\t\t\t\t},\n\t\t\t},\n\t\t])\n\n\t\tconst shape = this.editor.getShape(id)\n\t\tif (!shape) return\n\n\t\tconst util = this.editor.getShapeUtil(shape)\n\t\tif (this.editor.getIsReadonly()) {\n\t\t\tif (!util.canEditInReadonly(shape)) {\n\t\t\t\treturn\n\t\t\t}\n\t\t}\n\n\t\tthis.editor.setEditingShape(id)\n\t\tthis.editor.select(id)\n\t\tthis.parent.transition('editing_shape', info)\n\t}\n\n\tprivate nudgeSelectedShapes(ephemeral = false) {\n\t\tconst {\n\t\t\teditor: {\n\t\t\t\tinputs: { keys },\n\t\t\t},\n\t\t} = this\n\n\t\t// We want to use the \"actual\" shift key state,\n\t\t// not the one that's in the editor.inputs.shiftKey,\n\t\t// because that one uses a short timeout on release\n\t\tconst shiftKey = keys.has('ShiftLeft')\n\n\t\tconst delta = new Vec(0, 0)\n\n\t\tif (keys.has('ArrowLeft')) delta.x -= 1\n\t\tif (keys.has('ArrowRight')) delta.x += 1\n\t\tif (keys.has('ArrowUp')) delta.y -= 1\n\t\tif (keys.has('ArrowDown')) delta.y += 1\n\n\t\tif (delta.equals(new Vec(0, 0))) return\n\n\t\tif (!ephemeral) this.editor.markHistoryStoppingPoint('nudge shapes')\n\n\t\tconst { gridSize } = this.editor.getDocumentSettings()\n\n\t\tconst step = this.editor.getInstanceState().isGridMode\n\t\t\t? shiftKey\n\t\t\t\t? gridSize * GRID_INCREMENT\n\t\t\t\t: gridSize\n\t\t\t: shiftKey\n\t\t\t\t? MAJOR_NUDGE_FACTOR\n\t\t\t\t: MINOR_NUDGE_FACTOR\n\n\t\tconst selectedShapeIds = this.editor.getSelectedShapeIds()\n\t\tthis.editor.nudgeShapes(selectedShapeIds, delta.mul(step))\n\t\tkickoutOccludedShapes(this.editor, selectedShapeIds)\n\t}\n\n\tprivate canInteractWithShapeInReadOnly(shape: TLShape) {\n\t\tif (!this.editor.getIsReadonly()) return true\n\t\tconst util = this.editor.getShapeUtil(shape)\n\t\tif (util.canEditInReadonly(shape)) return true\n\t\treturn false\n\t}\n}\n\nexport const MAJOR_NUDGE_FACTOR = 10\nexport const MINOR_NUDGE_FACTOR = 1\nexport const GRID_INCREMENT = 5\n\nfunction isPointInRotatedSelectionBounds(editor: Editor, point: VecLike) {\n\tconst selectionBounds = editor.getSelectionRotatedPageBounds()\n\tif (!selectionBounds) return false\n\n\tconst selectionRotation = editor.getSelectionRotation()\n\tif (!selectionRotation) return selectionBounds.containsPoint(point)\n\n\treturn pointInPolygon(\n\t\tpoint,\n\t\tselectionBounds.corners.map((c) => Vec.RotWith(c, selectionBounds.point, selectionRotation))\n\t)\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["shape"]
|
|
7
7
|
}
|
|
@@ -60,6 +60,7 @@ function DefaultRichTextToolbarContent({
|
|
|
60
60
|
}, [onEditLinkStart]);
|
|
61
61
|
const actions = (0, import_react.useMemo)(() => {
|
|
62
62
|
function handleOp(name, op) {
|
|
63
|
+
if (!textEditor.view) return;
|
|
63
64
|
trackEvent("rich-text", { operation: name, source });
|
|
64
65
|
textEditor.chain().focus()[op]().run();
|
|
65
66
|
}
|
|
@@ -107,7 +108,7 @@ function DefaultRichTextToolbarContent({
|
|
|
107
108
|
].filter(Boolean);
|
|
108
109
|
}, [textEditor, trackEvent, onEditLinkStart]);
|
|
109
110
|
return actions.map(({ name, attrs, onSelect }) => {
|
|
110
|
-
const isActive = textEditor.isActive(name, attrs);
|
|
111
|
+
const isActive = textEditor.view ? textEditor.isActive(name, attrs) : false;
|
|
111
112
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
112
113
|
import_TldrawUiToolbar.TldrawUiToolbarButton,
|
|
113
114
|
{
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/lib/ui/components/Toolbar/DefaultRichTextToolbarContent.tsx"],
|
|
4
|
-
"sourcesContent": ["import { isAccelKey, preventDefault, TiptapEditor } from '@tldraw/editor'\nimport { useEffect, useMemo, useState } from 'react'\nimport { useUiEvents } from '../../context/events'\nimport { useTranslation } from '../../hooks/useTranslation/useTranslation'\nimport { TldrawUiButtonIcon } from '../primitives/Button/TldrawUiButtonIcon'\nimport { TldrawUiToolbarButton } from '../primitives/TldrawUiToolbar'\n\n/** @public */\nexport interface DefaultRichTextToolbarContentProps {\n\tonEditLinkStart?(): void\n\ttextEditor: TiptapEditor\n}\n\n/**\n * Rich text toolbar items that have the basics.\n *\n * @public @react\n */\nexport function DefaultRichTextToolbarContent({\n\ttextEditor,\n\tonEditLinkStart,\n}: DefaultRichTextToolbarContentProps) {\n\tconst trackEvent = useUiEvents()\n\tconst msg = useTranslation()\n\tconst source = 'rich-text-menu'\n\n\t// We need to force this one to update when the editor updates or when selection changes\n\tconst [_, set] = useState(0)\n\tuseEffect(\n\t\tfunction forceUpdateWhenContentChanges() {\n\t\t\tfunction forceUpdate() {\n\t\t\t\tset((t) => t + 1)\n\t\t\t}\n\t\t\ttextEditor.on('update', forceUpdate)\n\t\t\ttextEditor.on('selectionUpdate', forceUpdate)\n\t\t},\n\t\t[textEditor]\n\t)\n\n\tuseEffect(() => {\n\t\tfunction handleKeyDown(event: KeyboardEvent) {\n\t\t\tif (onEditLinkStart && isAccelKey(event) && event.shiftKey && event.key === 'k') {\n\t\t\t\tevent.preventDefault()\n\t\t\t\tonEditLinkStart()\n\t\t\t}\n\t\t}\n\n\t\tdocument.addEventListener('keydown', handleKeyDown)\n\t\treturn () => {\n\t\t\tdocument.removeEventListener('keydown', handleKeyDown)\n\t\t}\n\t}, [onEditLinkStart])\n\n\t// todo: we could make this a prop\n\tconst actions = useMemo(() => {\n\t\tfunction handleOp(name: string, op: string) {\n\t\t\ttrackEvent('rich-text', { operation: name as any, source })\n\t\t\t// @ts-expect-error typing this is annoying at the moment.\n\t\t\ttextEditor.chain().focus()[op]().run()\n\t\t}\n\n\t\treturn [\n\t\t\t// { name: 'heading', attrs: { level: 3 }, onSelect() { textEditor.chain().focus().toggleHeading({ level: 3}).run() }},\n\t\t\t{\n\t\t\t\tname: 'bold',\n\t\t\t\tonSelect() {\n\t\t\t\t\thandleOp('bold', 'toggleBold')\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'italic',\n\t\t\t\tonSelect() {\n\t\t\t\t\thandleOp('bold', 'toggleItalic')\n\t\t\t\t},\n\t\t\t},\n\t\t\t// { name: 'underline', onSelect() { handleOp('underline', 'toggleUnderline') }},\n\t\t\t// { name: 'strike', onSelect() { handleOp('strike', 'toggleStrike') }},\n\t\t\t{\n\t\t\t\tname: 'code',\n\t\t\t\tonSelect() {\n\t\t\t\t\thandleOp('bold', 'toggleCode')\n\t\t\t\t},\n\t\t\t},\n\t\t\tonEditLinkStart\n\t\t\t\t? {\n\t\t\t\t\t\tname: 'link',\n\t\t\t\t\t\tonSelect() {\n\t\t\t\t\t\t\tonEditLinkStart()\n\t\t\t\t\t\t},\n\t\t\t\t\t}\n\t\t\t\t: undefined, // ? is this really optional?\n\t\t\t{\n\t\t\t\tname: 'bulletList',\n\t\t\t\tonSelect() {\n\t\t\t\t\thandleOp('bulletList', 'toggleBulletList')\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'highlight',\n\t\t\t\tonSelect() {\n\t\t\t\t\thandleOp('bulletList', 'toggleHighlight')\n\t\t\t\t},\n\t\t\t},\n\t\t].filter(Boolean) as {\n\t\t\tname: string\n\t\t\tattrs?: string\n\t\t\tonSelect(): void\n\t\t}[]\n\t}, [textEditor, trackEvent, onEditLinkStart])\n\n\treturn actions.map(({ name, attrs, onSelect }) => {\n\t\tconst isActive = textEditor.isActive(name, attrs)\n\t\treturn (\n\t\t\t<TldrawUiToolbarButton\n\t\t\t\tkey={name}\n\t\t\t\ttitle={msg(`tool.rich-text-${name}`)}\n\t\t\t\tdata-testid={`rich-text.${name}`}\n\t\t\t\ttype=\"icon\"\n\t\t\t\tisActive={isActive} // todo: we need to update this only when the text editor \"settles\", ie not during a change of selection\n\t\t\t\tonPointerDown={preventDefault}\n\t\t\t\tonClick={onSelect}\n\t\t\t\trole=\"option\"\n\t\t\t\taria-pressed={isActive}\n\t\t\t>\n\t\t\t\t<TldrawUiButtonIcon small icon={name} />\n\t\t\t</TldrawUiToolbarButton>\n\t\t)\n\t})\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["import { isAccelKey, preventDefault, TiptapEditor } from '@tldraw/editor'\nimport { useEffect, useMemo, useState } from 'react'\nimport { useUiEvents } from '../../context/events'\nimport { useTranslation } from '../../hooks/useTranslation/useTranslation'\nimport { TldrawUiButtonIcon } from '../primitives/Button/TldrawUiButtonIcon'\nimport { TldrawUiToolbarButton } from '../primitives/TldrawUiToolbar'\n\n/** @public */\nexport interface DefaultRichTextToolbarContentProps {\n\tonEditLinkStart?(): void\n\ttextEditor: TiptapEditor\n}\n\n/**\n * Rich text toolbar items that have the basics.\n *\n * @public @react\n */\nexport function DefaultRichTextToolbarContent({\n\ttextEditor,\n\tonEditLinkStart,\n}: DefaultRichTextToolbarContentProps) {\n\tconst trackEvent = useUiEvents()\n\tconst msg = useTranslation()\n\tconst source = 'rich-text-menu'\n\n\t// We need to force this one to update when the editor updates or when selection changes\n\tconst [_, set] = useState(0)\n\tuseEffect(\n\t\tfunction forceUpdateWhenContentChanges() {\n\t\t\tfunction forceUpdate() {\n\t\t\t\tset((t) => t + 1)\n\t\t\t}\n\t\t\ttextEditor.on('update', forceUpdate)\n\t\t\ttextEditor.on('selectionUpdate', forceUpdate)\n\t\t},\n\t\t[textEditor]\n\t)\n\n\tuseEffect(() => {\n\t\tfunction handleKeyDown(event: KeyboardEvent) {\n\t\t\tif (onEditLinkStart && isAccelKey(event) && event.shiftKey && event.key === 'k') {\n\t\t\t\tevent.preventDefault()\n\t\t\t\tonEditLinkStart()\n\t\t\t}\n\t\t}\n\n\t\tdocument.addEventListener('keydown', handleKeyDown)\n\t\treturn () => {\n\t\t\tdocument.removeEventListener('keydown', handleKeyDown)\n\t\t}\n\t}, [onEditLinkStart])\n\n\t// todo: we could make this a prop\n\tconst actions = useMemo(() => {\n\t\tfunction handleOp(name: string, op: string) {\n\t\t\t// Check if the editor view is available before calling operations\n\t\t\tif (!textEditor.view) return\n\n\t\t\ttrackEvent('rich-text', { operation: name as any, source })\n\t\t\t// @ts-expect-error typing this is annoying at the moment.\n\t\t\ttextEditor.chain().focus()[op]().run()\n\t\t}\n\n\t\treturn [\n\t\t\t// { name: 'heading', attrs: { level: 3 }, onSelect() { textEditor.chain().focus().toggleHeading({ level: 3}).run() }},\n\t\t\t{\n\t\t\t\tname: 'bold',\n\t\t\t\tonSelect() {\n\t\t\t\t\thandleOp('bold', 'toggleBold')\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'italic',\n\t\t\t\tonSelect() {\n\t\t\t\t\thandleOp('bold', 'toggleItalic')\n\t\t\t\t},\n\t\t\t},\n\t\t\t// { name: 'underline', onSelect() { handleOp('underline', 'toggleUnderline') }},\n\t\t\t// { name: 'strike', onSelect() { handleOp('strike', 'toggleStrike') }},\n\t\t\t{\n\t\t\t\tname: 'code',\n\t\t\t\tonSelect() {\n\t\t\t\t\thandleOp('bold', 'toggleCode')\n\t\t\t\t},\n\t\t\t},\n\t\t\tonEditLinkStart\n\t\t\t\t? {\n\t\t\t\t\t\tname: 'link',\n\t\t\t\t\t\tonSelect() {\n\t\t\t\t\t\t\tonEditLinkStart()\n\t\t\t\t\t\t},\n\t\t\t\t\t}\n\t\t\t\t: undefined, // ? is this really optional?\n\t\t\t{\n\t\t\t\tname: 'bulletList',\n\t\t\t\tonSelect() {\n\t\t\t\t\thandleOp('bulletList', 'toggleBulletList')\n\t\t\t\t},\n\t\t\t},\n\t\t\t{\n\t\t\t\tname: 'highlight',\n\t\t\t\tonSelect() {\n\t\t\t\t\thandleOp('bulletList', 'toggleHighlight')\n\t\t\t\t},\n\t\t\t},\n\t\t].filter(Boolean) as {\n\t\t\tname: string\n\t\t\tattrs?: string\n\t\t\tonSelect(): void\n\t\t}[]\n\t}, [textEditor, trackEvent, onEditLinkStart])\n\n\treturn actions.map(({ name, attrs, onSelect }) => {\n\t\tconst isActive = textEditor.view ? textEditor.isActive(name, attrs) : false\n\t\treturn (\n\t\t\t<TldrawUiToolbarButton\n\t\t\t\tkey={name}\n\t\t\t\ttitle={msg(`tool.rich-text-${name}`)}\n\t\t\t\tdata-testid={`rich-text.${name}`}\n\t\t\t\ttype=\"icon\"\n\t\t\t\tisActive={isActive} // todo: we need to update this only when the text editor \"settles\", ie not during a change of selection\n\t\t\t\tonPointerDown={preventDefault}\n\t\t\t\tonClick={onSelect}\n\t\t\t\trole=\"option\"\n\t\t\t\taria-pressed={isActive}\n\t\t\t>\n\t\t\t\t<TldrawUiButtonIcon small icon={name} />\n\t\t\t</TldrawUiToolbarButton>\n\t\t)\n\t})\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA+HI;AA/HJ,oBAAyD;AACzD,mBAA6C;AAC7C,oBAA4B;AAC5B,4BAA+B;AAC/B,gCAAmC;AACnC,6BAAsC;AAa/B,SAAS,8BAA8B;AAAA,EAC7C;AAAA,EACA;AACD,GAAuC;AACtC,QAAM,iBAAa,2BAAY;AAC/B,QAAM,UAAM,sCAAe;AAC3B,QAAM,SAAS;AAGf,QAAM,CAAC,GAAG,GAAG,QAAI,uBAAS,CAAC;AAC3B;AAAA,IACC,SAAS,gCAAgC;AACxC,eAAS,cAAc;AACtB,YAAI,CAAC,MAAM,IAAI,CAAC;AAAA,MACjB;AACA,iBAAW,GAAG,UAAU,WAAW;AACnC,iBAAW,GAAG,mBAAmB,WAAW;AAAA,IAC7C;AAAA,IACA,CAAC,UAAU;AAAA,EACZ;AAEA,8BAAU,MAAM;AACf,aAAS,cAAc,OAAsB;AAC5C,UAAI,uBAAmB,0BAAW,KAAK,KAAK,MAAM,YAAY,MAAM,QAAQ,KAAK;AAChF,cAAM,eAAe;AACrB,wBAAgB;AAAA,MACjB;AAAA,IACD;AAEA,aAAS,iBAAiB,WAAW,aAAa;AAClD,WAAO,MAAM;AACZ,eAAS,oBAAoB,WAAW,aAAa;AAAA,IACtD;AAAA,EACD,GAAG,CAAC,eAAe,CAAC;AAGpB,QAAM,cAAU,sBAAQ,MAAM;AAC7B,aAAS,SAAS,MAAc,IAAY;AAE3C,UAAI,CAAC,WAAW,KAAM;AAEtB,iBAAW,aAAa,EAAE,WAAW,MAAa,OAAO,CAAC;AAE1D,iBAAW,MAAM,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,IAAI;AAAA,IACtC;AAEA,WAAO;AAAA;AAAA,MAEN;AAAA,QACC,MAAM;AAAA,QACN,WAAW;AACV,mBAAS,QAAQ,YAAY;AAAA,QAC9B;AAAA,MACD;AAAA,MACA;AAAA,QACC,MAAM;AAAA,QACN,WAAW;AACV,mBAAS,QAAQ,cAAc;AAAA,QAChC;AAAA,MACD;AAAA;AAAA;AAAA,MAGA;AAAA,QACC,MAAM;AAAA,QACN,WAAW;AACV,mBAAS,QAAQ,YAAY;AAAA,QAC9B;AAAA,MACD;AAAA,MACA,kBACG;AAAA,QACA,MAAM;AAAA,QACN,WAAW;AACV,0BAAgB;AAAA,QACjB;AAAA,MACD,IACC;AAAA;AAAA,MACH;AAAA,QACC,MAAM;AAAA,QACN,WAAW;AACV,mBAAS,cAAc,kBAAkB;AAAA,QAC1C;AAAA,MACD;AAAA,MACA;AAAA,QACC,MAAM;AAAA,QACN,WAAW;AACV,mBAAS,cAAc,iBAAiB;AAAA,QACzC;AAAA,MACD;AAAA,IACD,EAAE,OAAO,OAAO;AAAA,EAKjB,GAAG,CAAC,YAAY,YAAY,eAAe,CAAC;AAE5C,SAAO,QAAQ,IAAI,CAAC,EAAE,MAAM,OAAO,SAAS,MAAM;AACjD,UAAM,WAAW,WAAW,OAAO,WAAW,SAAS,MAAM,KAAK,IAAI;AACtE,WACC;AAAA,MAAC;AAAA;AAAA,QAEA,OAAO,IAAI,kBAAkB,IAAI,EAAE;AAAA,QACnC,eAAa,aAAa,IAAI;AAAA,QAC9B,MAAK;AAAA,QACL;AAAA,QACA,eAAe;AAAA,QACf,SAAS;AAAA,QACT,MAAK;AAAA,QACL,gBAAc;AAAA,QAEd,sDAAC,gDAAmB,OAAK,MAAC,MAAM,MAAM;AAAA;AAAA,MAVjC;AAAA,IAWN;AAAA,EAEF,CAAC;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -53,7 +53,7 @@ function LinkEditor({ textEditor, value: initialValue, onClose }) {
|
|
|
53
53
|
};
|
|
54
54
|
const handleVisitLink = () => {
|
|
55
55
|
trackEvent("rich-text", { operation: "link-visit", source });
|
|
56
|
-
|
|
56
|
+
(0, import_editor.openWindow)(linkifiedValue, "_blank");
|
|
57
57
|
onClose();
|
|
58
58
|
};
|
|
59
59
|
const handleRemoveLink = () => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/lib/ui/components/Toolbar/LinkEditor.tsx"],
|
|
4
|
-
"sourcesContent": ["import { preventDefault, TiptapEditor, useEditor } from '@tldraw/editor'\nimport { useEffect, useRef, useState } from 'react'\nimport { useUiEvents } from '../../context/events'\nimport { useTranslation } from '../../hooks/useTranslation/useTranslation'\nimport { TldrawUiButton } from '../primitives/Button/TldrawUiButton'\nimport { TldrawUiButtonIcon } from '../primitives/Button/TldrawUiButtonIcon'\nimport { TldrawUiInput } from '../primitives/TldrawUiInput'\n\n/** @public */\nexport interface LinkEditorProps {\n\ttextEditor: TiptapEditor\n\tvalue: string\n\tonClose(): void\n}\n\n/** @public @react */\nexport function LinkEditor({ textEditor, value: initialValue, onClose }: LinkEditorProps) {\n\tconst editor = useEditor()\n\tconst [value, setValue] = useState(initialValue)\n\tconst msg = useTranslation()\n\tconst ref = useRef<HTMLInputElement>(null)\n\tconst trackEvent = useUiEvents()\n\tconst source = 'rich-text-menu'\n\tconst linkifiedValue = value.startsWith('http') ? value : `https://${value}`\n\n\tconst handleValueChange = (value: string) => setValue(value)\n\n\tconst handleLinkComplete = (link: string) => {\n\t\ttrackEvent('rich-text', { operation: 'link-edit', source })\n\t\tif (!link.startsWith('http://') && !link.startsWith('https://')) {\n\t\t\tlink = `https://${link}`\n\t\t}\n\n\t\ttextEditor.chain().setLink({ href: link }).run()\n\t\t// N.B. We shouldn't focus() on mobile because it causes the\n\t\t// Return key to replace the link with a newline :facepalm:\n\t\tif (editor.getInstanceState().isCoarsePointer) {\n\t\t\ttextEditor.commands.blur()\n\t\t} else {\n\t\t\ttextEditor.commands.focus()\n\t\t}\n\t\tonClose()\n\t}\n\n\tconst handleVisitLink = () => {\n\t\ttrackEvent('rich-text', { operation: 'link-visit', source })\n\t\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAmEE;AAnEF,
|
|
4
|
+
"sourcesContent": ["import { openWindow, preventDefault, TiptapEditor, useEditor } from '@tldraw/editor'\nimport { useEffect, useRef, useState } from 'react'\nimport { useUiEvents } from '../../context/events'\nimport { useTranslation } from '../../hooks/useTranslation/useTranslation'\nimport { TldrawUiButton } from '../primitives/Button/TldrawUiButton'\nimport { TldrawUiButtonIcon } from '../primitives/Button/TldrawUiButtonIcon'\nimport { TldrawUiInput } from '../primitives/TldrawUiInput'\n\n/** @public */\nexport interface LinkEditorProps {\n\ttextEditor: TiptapEditor\n\tvalue: string\n\tonClose(): void\n}\n\n/** @public @react */\nexport function LinkEditor({ textEditor, value: initialValue, onClose }: LinkEditorProps) {\n\tconst editor = useEditor()\n\tconst [value, setValue] = useState(initialValue)\n\tconst msg = useTranslation()\n\tconst ref = useRef<HTMLInputElement>(null)\n\tconst trackEvent = useUiEvents()\n\tconst source = 'rich-text-menu'\n\tconst linkifiedValue = value.startsWith('http') ? value : `https://${value}`\n\n\tconst handleValueChange = (value: string) => setValue(value)\n\n\tconst handleLinkComplete = (link: string) => {\n\t\ttrackEvent('rich-text', { operation: 'link-edit', source })\n\t\tif (!link.startsWith('http://') && !link.startsWith('https://')) {\n\t\t\tlink = `https://${link}`\n\t\t}\n\n\t\ttextEditor.chain().setLink({ href: link }).run()\n\t\t// N.B. We shouldn't focus() on mobile because it causes the\n\t\t// Return key to replace the link with a newline :facepalm:\n\t\tif (editor.getInstanceState().isCoarsePointer) {\n\t\t\ttextEditor.commands.blur()\n\t\t} else {\n\t\t\ttextEditor.commands.focus()\n\t\t}\n\t\tonClose()\n\t}\n\n\tconst handleVisitLink = () => {\n\t\ttrackEvent('rich-text', { operation: 'link-visit', source })\n\t\topenWindow(linkifiedValue, '_blank')\n\t\tonClose()\n\t}\n\n\tconst handleRemoveLink = () => {\n\t\ttrackEvent('rich-text', { operation: 'link-remove', source })\n\t\ttextEditor.chain().unsetLink().focus().run()\n\t\tonClose()\n\t}\n\n\tconst handleLinkCancel = () => onClose()\n\n\tuseEffect(() => {\n\t\tref.current?.focus()\n\t}, [value])\n\n\tuseEffect(() => {\n\t\tsetValue(initialValue)\n\t}, [initialValue])\n\n\treturn (\n\t\t<>\n\t\t\t<TldrawUiInput\n\t\t\t\tref={ref}\n\t\t\t\tdata-testid=\"rich-text.link-input\"\n\t\t\t\tclassName=\"tlui-rich-text__toolbar-link-input\"\n\t\t\t\tvalue={value}\n\t\t\t\tonValueChange={handleValueChange}\n\t\t\t\tonComplete={handleLinkComplete}\n\t\t\t\tonCancel={handleLinkCancel}\n\t\t\t\tplaceholder=\"example.com\"\n\t\t\t\taria-label=\"example.com\"\n\t\t\t/>\n\t\t\t<TldrawUiButton\n\t\t\t\tclassName=\"tlui-rich-text__toolbar-link-visit\"\n\t\t\t\ttitle={msg('tool.rich-text-link-visit')}\n\t\t\t\ttype=\"icon\"\n\t\t\t\tonPointerDown={preventDefault}\n\t\t\t\tonClick={handleVisitLink}\n\t\t\t\tdisabled={!value}\n\t\t\t>\n\t\t\t\t<TldrawUiButtonIcon small icon=\"external-link\" />\n\t\t\t</TldrawUiButton>\n\t\t\t<TldrawUiButton\n\t\t\t\tclassName=\"tlui-rich-text__toolbar-link-remove\"\n\t\t\t\ttitle={msg('tool.rich-text-link-remove')}\n\t\t\t\tdata-testid=\"rich-text.link-remove\"\n\t\t\t\ttype=\"icon\"\n\t\t\t\tonPointerDown={preventDefault}\n\t\t\t\tonClick={handleRemoveLink}\n\t\t\t>\n\t\t\t\t<TldrawUiButtonIcon small icon=\"trash\" />\n\t\t\t</TldrawUiButton>\n\t\t</>\n\t)\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAmEE;AAnEF,oBAAoE;AACpE,mBAA4C;AAC5C,oBAA4B;AAC5B,4BAA+B;AAC/B,4BAA+B;AAC/B,gCAAmC;AACnC,2BAA8B;AAUvB,SAAS,WAAW,EAAE,YAAY,OAAO,cAAc,QAAQ,GAAoB;AACzF,QAAM,aAAS,yBAAU;AACzB,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAS,YAAY;AAC/C,QAAM,UAAM,sCAAe;AAC3B,QAAM,UAAM,qBAAyB,IAAI;AACzC,QAAM,iBAAa,2BAAY;AAC/B,QAAM,SAAS;AACf,QAAM,iBAAiB,MAAM,WAAW,MAAM,IAAI,QAAQ,WAAW,KAAK;AAE1E,QAAM,oBAAoB,CAACA,WAAkB,SAASA,MAAK;AAE3D,QAAM,qBAAqB,CAAC,SAAiB;AAC5C,eAAW,aAAa,EAAE,WAAW,aAAa,OAAO,CAAC;AAC1D,QAAI,CAAC,KAAK,WAAW,SAAS,KAAK,CAAC,KAAK,WAAW,UAAU,GAAG;AAChE,aAAO,WAAW,IAAI;AAAA,IACvB;AAEA,eAAW,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAC,EAAE,IAAI;AAG/C,QAAI,OAAO,iBAAiB,EAAE,iBAAiB;AAC9C,iBAAW,SAAS,KAAK;AAAA,IAC1B,OAAO;AACN,iBAAW,SAAS,MAAM;AAAA,IAC3B;AACA,YAAQ;AAAA,EACT;AAEA,QAAM,kBAAkB,MAAM;AAC7B,eAAW,aAAa,EAAE,WAAW,cAAc,OAAO,CAAC;AAC3D,kCAAW,gBAAgB,QAAQ;AACnC,YAAQ;AAAA,EACT;AAEA,QAAM,mBAAmB,MAAM;AAC9B,eAAW,aAAa,EAAE,WAAW,eAAe,OAAO,CAAC;AAC5D,eAAW,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,IAAI;AAC3C,YAAQ;AAAA,EACT;AAEA,QAAM,mBAAmB,MAAM,QAAQ;AAEvC,8BAAU,MAAM;AACf,QAAI,SAAS,MAAM;AAAA,EACpB,GAAG,CAAC,KAAK,CAAC;AAEV,8BAAU,MAAM;AACf,aAAS,YAAY;AAAA,EACtB,GAAG,CAAC,YAAY,CAAC;AAEjB,SACC,4EACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,eAAY;AAAA,QACZ,WAAU;AAAA,QACV;AAAA,QACA,eAAe;AAAA,QACf,YAAY;AAAA,QACZ,UAAU;AAAA,QACV,aAAY;AAAA,QACZ,cAAW;AAAA;AAAA,IACZ;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV,OAAO,IAAI,2BAA2B;AAAA,QACtC,MAAK;AAAA,QACL,eAAe;AAAA,QACf,SAAS;AAAA,QACT,UAAU,CAAC;AAAA,QAEX,sDAAC,gDAAmB,OAAK,MAAC,MAAK,iBAAgB;AAAA;AAAA,IAChD;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV,OAAO,IAAI,4BAA4B;AAAA,QACvC,eAAY;AAAA,QACZ,MAAK;AAAA,QACL,eAAe;AAAA,QACf,SAAS;AAAA,QAET,sDAAC,gDAAmB,OAAK,MAAC,MAAK,SAAQ;AAAA;AAAA,IACxC;AAAA,KACD;AAEF;",
|
|
6
6
|
"names": ["value"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/lib/ui/context/events.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react'\n\n/** @public */\nexport type TLUiEventSource =\n\t| 'menu'\n\t| 'main-menu'\n\t| 'context-menu'\n\t| 'zoom-menu'\n\t| 'document-name'\n\t| 'navigation-zone'\n\t| 'quick-actions'\n\t| 'actions-menu'\n\t| 'kbd'\n\t| 'debug-panel'\n\t| 'page-menu'\n\t| 'share-menu'\n\t| 'export-menu'\n\t| 'toolbar'\n\t| 'people-menu'\n\t| 'dialog'\n\t| 'help-menu'\n\t| 'helper-buttons'\n\t| 'style-panel'\n\t| 'rich-text-menu'\n\t| 'image-toolbar'\n\t| 'video-toolbar'\n\t| 'unknown'\n\n/** @public */\nexport interface TLUiEventMap {\n\t// Actions\n\tundo: null\n\tredo: null\n\t'change-language': { locale: string }\n\t'change-page': { direction?: 'prev' | 'next' }\n\t'select-adjacent-shape': { direction: 'prev' | 'next' | 'left' | 'right' | 'up' | 'down' }\n\t'delete-page': null\n\t'duplicate-page': null\n\t'move-page': null\n\t'new-page': null\n\t'rename-page': null\n\t'move-to-page': null\n\t'move-to-new-page': null\n\t'rename-document': null\n\t'group-shapes': null\n\t'ungroup-shapes': null\n\t'remove-frame': null\n\t'fit-frame-to-content': null\n\t'convert-to-embed': null\n\t'convert-to-bookmark': null\n\t'open-embed-link': null\n\t'toggle-auto-size': null\n\t'copy-as': { format: 'svg' | 'png' | 'json' }\n\t'export-as': { format: 'svg' | 'png' | 'json' }\n\t'export-all-as': { format: 'svg' | 'png' | 'json' }\n\t'download-original': null\n\t'edit-link': null\n\t'insert-embed': null\n\t'insert-media': null\n\t'replace-media': null\n\t'image-manipulate': null\n\t'alt-text-start': null\n\t'set-alt-text': null\n\t'align-shapes': {\n\t\toperation: 'left' | 'center-horizontal' | 'right' | 'top' | 'center-vertical' | 'bottom'\n\t}\n\t'duplicate-shapes': null\n\t'pack-shapes': null\n\t'stack-shapes': { operation: 'horizontal' | 'vertical' }\n\t'flip-shapes': { operation: 'horizontal' | 'vertical' }\n\t'distribute-shapes': { operation: 'horizontal' | 'vertical' }\n\t'stretch-shapes': { operation: 'horizontal' | 'vertical' }\n\t'reorder-shapes': {\n\t\toperation: 'toBack' | 'toFront' | 'forward' | 'backward'\n\t}\n\t'delete-shapes': null\n\t'select-all-shapes': null\n\t'select-none-shapes': null\n\t'rotate-ccw': { fine: boolean }\n\t'rotate-cw': { fine: boolean }\n\t'zoom-in': { towardsCursor: boolean }\n\t'zoom-out': { towardsCursor: boolean }\n\t'zoom-to-fit': null\n\t'zoom-to-selection': null\n\t'reset-zoom': null\n\t'zoom-into-view': null\n\t'zoom-to-content': null\n\t'open-menu': { id: string }\n\t'close-menu': { id: string }\n\t'create-new-project': null\n\t'save-project-to-file': null\n\t'open-file': null\n\t'select-tool': { id: string }\n\tprint: null\n\tcopy: null\n\tpaste: null\n\tcut: null\n\t'set-style': { id: string; value: string | number }\n\t'toggle-transparent': null\n\t'toggle-snap-mode': null\n\t'toggle-tool-lock': null\n\t'toggle-grid-mode': null\n\t'toggle-wrap-mode': null\n\t'toggle-focus-mode': null\n\t'input-mode': { value: string }\n\t'toggle-debug-mode': null\n\t'toggle-dynamic-size-mode': null\n\t'toggle-paste-at-cursor': null\n\t'toggle-lock': null\n\t'toggle-reduce-motion': null\n\t'toggle-keyboard-shortcuts': null\n\t'enhanced-a11y-mode': null\n\t'toggle-edge-scrolling': null\n\t'color-scheme': { value: string }\n\t'exit-pen-mode': null\n\t'start-following': null\n\t'stop-following': null\n\t'set-color': null\n\t'change-user-name': null\n\t'open-cursor-chat': null\n\t'zoom-tool': null\n\t'unlock-all': null\n\t'enlarge-shapes': null\n\t'shrink-shapes': null\n\t'flatten-to-image': null\n\t'a11y-repeat-shape-announce': null\n\t'open-url': { destinationUrl: string }\n\t'open-context-menu': null\n\t'adjust-shape-styles': null\n\t'copy-link': null\n\t'drag-tool': { id: string }\n\t'image-replace': null\n\t'video-replace': null\n\t'open-kbd-shortcuts': null\n\t'rich-text': {\n\t\toperation:\n\t\t\t| 'bold'\n\t\t\t| 'strike'\n\t\t\t| 'link'\n\t\t\t| 'link-edit'\n\t\t\t| 'link-visit'\n\t\t\t| 'link-remove'\n\t\t\t| 'heading'\n\t\t\t| 'bulletList'\n\t}\n\tedit: null\n}\n\n/** @public */\nexport type TLUiEventData<K> = K extends null\n\t? { source: TLUiEventSource }\n\t: { source: TLUiEventSource } & K\n\n/** @public */\nexport type TLUiEventHandler = <T extends keyof TLUiEventMap>(\n\tname: T,\n\tdata: TLUiEventData<TLUiEventMap[T]>\n) => void\n\n/** @public */\nexport type TLUiEventContextType = TLUiEventHandler\n\n/** @internal */\nconst defaultEventHandler: TLUiEventContextType = () => void null\n\n/** @internal */\nexport const EventsContext = React.createContext<TLUiEventContextType | null>(null)\n\n/** @public */\nexport interface EventsProviderProps {\n\tonEvent?: TLUiEventHandler\n\tchildren: React.ReactNode\n}\n\n/** @public @react */\nexport function TldrawUiEventsProvider({ onEvent, children }: EventsProviderProps) {\n\treturn (\n\t\t<EventsContext.Provider value={onEvent ?? defaultEventHandler}>\n\t\t\t{children}\n\t\t</EventsContext.Provider>\n\t)\n}\n\n/** @public */\nexport function useUiEvents(): TLUiEventContextType {\n\tconst eventHandler = React.useContext(EventsContext)\n\treturn eventHandler ?? defaultEventHandler\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react'\n\n/** @public */\nexport type TLUiEventSource =\n\t| 'menu'\n\t| 'main-menu'\n\t| 'context-menu'\n\t| 'zoom-menu'\n\t| 'document-name'\n\t| 'navigation-zone'\n\t| 'quick-actions'\n\t| 'actions-menu'\n\t| 'kbd'\n\t| 'debug-panel'\n\t| 'page-menu'\n\t| 'share-menu'\n\t| 'export-menu'\n\t| 'toolbar'\n\t| 'people-menu'\n\t| 'dialog'\n\t| 'help-menu'\n\t| 'helper-buttons'\n\t| 'style-panel'\n\t| 'rich-text-menu'\n\t| 'image-toolbar'\n\t| 'video-toolbar'\n\t| 'fairy-panel'\n\t| 'unknown'\n\n/** @public */\nexport interface TLUiEventMap {\n\t// Actions\n\tundo: null\n\tredo: null\n\t'change-language': { locale: string }\n\t'change-page': { direction?: 'prev' | 'next' }\n\t'select-adjacent-shape': { direction: 'prev' | 'next' | 'left' | 'right' | 'up' | 'down' }\n\t'delete-page': null\n\t'duplicate-page': null\n\t'move-page': null\n\t'new-page': null\n\t'rename-page': null\n\t'move-to-page': null\n\t'move-to-new-page': null\n\t'rename-document': null\n\t'group-shapes': null\n\t'ungroup-shapes': null\n\t'remove-frame': null\n\t'fit-frame-to-content': null\n\t'convert-to-embed': null\n\t'convert-to-bookmark': null\n\t'open-embed-link': null\n\t'toggle-auto-size': null\n\t'copy-as': { format: 'svg' | 'png' | 'json' }\n\t'export-as': { format: 'svg' | 'png' | 'json' }\n\t'export-all-as': { format: 'svg' | 'png' | 'json' }\n\t'download-original': null\n\t'edit-link': null\n\t'insert-embed': null\n\t'insert-media': null\n\t'replace-media': null\n\t'image-manipulate': null\n\t'alt-text-start': null\n\t'set-alt-text': null\n\t'align-shapes': {\n\t\toperation: 'left' | 'center-horizontal' | 'right' | 'top' | 'center-vertical' | 'bottom'\n\t}\n\t'duplicate-shapes': null\n\t'pack-shapes': null\n\t'stack-shapes': { operation: 'horizontal' | 'vertical' }\n\t'flip-shapes': { operation: 'horizontal' | 'vertical' }\n\t'distribute-shapes': { operation: 'horizontal' | 'vertical' }\n\t'stretch-shapes': { operation: 'horizontal' | 'vertical' }\n\t'reorder-shapes': {\n\t\toperation: 'toBack' | 'toFront' | 'forward' | 'backward'\n\t}\n\t'delete-shapes': null\n\t'select-all-shapes': null\n\t'select-none-shapes': null\n\t'rotate-ccw': { fine: boolean }\n\t'rotate-cw': { fine: boolean }\n\t'zoom-in': { towardsCursor: boolean }\n\t'zoom-out': { towardsCursor: boolean }\n\t'zoom-to-fit': null\n\t'zoom-to-selection': null\n\t'reset-zoom': null\n\t'zoom-into-view': null\n\t'zoom-to-content': null\n\t'open-menu': { id: string }\n\t'close-menu': { id: string }\n\t'create-new-project': null\n\t'save-project-to-file': null\n\t'open-file': null\n\t'select-tool': { id: string }\n\tprint: null\n\tcopy: null\n\tpaste: null\n\tcut: null\n\t'set-style': { id: string; value: string | number }\n\t'toggle-transparent': null\n\t'toggle-snap-mode': null\n\t'toggle-tool-lock': null\n\t'toggle-grid-mode': null\n\t'toggle-wrap-mode': null\n\t'toggle-focus-mode': null\n\t'input-mode': { value: string }\n\t'toggle-debug-mode': null\n\t'toggle-dynamic-size-mode': null\n\t'toggle-paste-at-cursor': null\n\t'toggle-lock': null\n\t'toggle-reduce-motion': null\n\t'toggle-keyboard-shortcuts': null\n\t'enhanced-a11y-mode': null\n\t'toggle-edge-scrolling': null\n\t'color-scheme': { value: string }\n\t'exit-pen-mode': null\n\t'start-following': null\n\t'stop-following': null\n\t'set-color': null\n\t'change-user-name': null\n\t'open-cursor-chat': null\n\t'zoom-tool': null\n\t'unlock-all': null\n\t'enlarge-shapes': null\n\t'shrink-shapes': null\n\t'flatten-to-image': null\n\t'a11y-repeat-shape-announce': null\n\t'open-url': { destinationUrl: string }\n\t'open-context-menu': null\n\t'adjust-shape-styles': null\n\t'copy-link': null\n\t'drag-tool': { id: string }\n\t'image-replace': null\n\t'video-replace': null\n\t'open-kbd-shortcuts': null\n\t'rich-text': {\n\t\toperation:\n\t\t\t| 'bold'\n\t\t\t| 'strike'\n\t\t\t| 'link'\n\t\t\t| 'link-edit'\n\t\t\t| 'link-visit'\n\t\t\t| 'link-remove'\n\t\t\t| 'heading'\n\t\t\t| 'bulletList'\n\t}\n\tedit: null\n}\n\n/** @public */\nexport type TLUiEventData<K> = K extends null\n\t? { source: TLUiEventSource }\n\t: { source: TLUiEventSource } & K\n\n/** @public */\nexport type TLUiEventHandler = <T extends keyof TLUiEventMap>(\n\tname: T,\n\tdata: TLUiEventData<TLUiEventMap[T]>\n) => void\n\n/** @public */\nexport type TLUiEventContextType = TLUiEventHandler\n\n/** @internal */\nconst defaultEventHandler: TLUiEventContextType = () => void null\n\n/** @internal */\nexport const EventsContext = React.createContext<TLUiEventContextType | null>(null)\n\n/** @public */\nexport interface EventsProviderProps {\n\tonEvent?: TLUiEventHandler\n\tchildren: React.ReactNode\n}\n\n/** @public @react */\nexport function TldrawUiEventsProvider({ onEvent, children }: EventsProviderProps) {\n\treturn (\n\t\t<EventsContext.Provider value={onEvent ?? defaultEventHandler}>\n\t\t\t{children}\n\t\t</EventsContext.Provider>\n\t)\n}\n\n/** @public */\nexport function useUiEvents(): TLUiEventContextType {\n\tconst eventHandler = React.useContext(EventsContext)\n\treturn eventHandler ?? defaultEventHandler\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkLE;AAlLF,YAAuB;AAoKvB,MAAM,sBAA4C,MAAM;AAGjD,MAAM,gBAAgB,MAAM,cAA2C,IAAI;AAS3E,SAAS,uBAAuB,EAAE,SAAS,SAAS,GAAwB;AAClF,SACC,4CAAC,cAAc,UAAd,EAAuB,OAAO,WAAW,qBACxC,UACF;AAEF;AAGO,SAAS,cAAoC;AACnD,QAAM,eAAe,MAAM,WAAW,aAAa;AACnD,SAAO,gBAAgB;AACxB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -28,15 +28,30 @@ function getLocalFiles(options) {
|
|
|
28
28
|
input.type = "file";
|
|
29
29
|
input.accept = mimeTypes?.join(",");
|
|
30
30
|
input.multiple = allowMultiple;
|
|
31
|
+
input.style.display = "none";
|
|
32
|
+
function dispose() {
|
|
33
|
+
input.removeEventListener("change", onchange);
|
|
34
|
+
input.removeEventListener("cancel", oncancel);
|
|
35
|
+
input.remove();
|
|
36
|
+
}
|
|
31
37
|
async function onchange(e) {
|
|
32
38
|
const fileList = e.target.files;
|
|
33
|
-
if (!fileList || fileList.length === 0)
|
|
39
|
+
if (!fileList || fileList.length === 0) {
|
|
40
|
+
resolve([]);
|
|
41
|
+
dispose();
|
|
42
|
+
return;
|
|
43
|
+
}
|
|
34
44
|
const files = Array.from(fileList);
|
|
35
45
|
input.value = "";
|
|
36
46
|
resolve(files);
|
|
37
|
-
|
|
38
|
-
|
|
47
|
+
dispose();
|
|
48
|
+
}
|
|
49
|
+
function oncancel() {
|
|
50
|
+
resolve([]);
|
|
51
|
+
dispose();
|
|
39
52
|
}
|
|
53
|
+
document.body.appendChild(input);
|
|
54
|
+
input.addEventListener("cancel", oncancel);
|
|
40
55
|
input.addEventListener("change", onchange);
|
|
41
56
|
input?.click();
|
|
42
57
|
});
|