tldraw 4.2.0-canary.0a761296d315 → 4.2.0-canary.0d8a9d25ff63

package/dist-cjs/index.d.ts

@@ -3940,9 +3940,6 @@ export declare interface TLUiEventMap {
         operation: 'bold' | 'bulletList' | 'heading' | 'link-edit' | 'link-remove' | 'link-visit' | 'link' | 'strike';
     };
     edit: null;
-    'click-watermark': {
-        url: string;
-    };
 }
 
 /** @public */

package/dist-cjs/index.js

@@ -584,7 +584,7 @@ var import_buildFromV1Document = require("./lib/utils/tldr/buildFromV1Document")
 var import_file = require("./lib/utils/tldr/file");
 (0, import_editor.registerTldrawLibraryVersion)(
   "tldraw",
-  "4.2.0-canary.0a761296d315",
+  "4.2.0-canary.0d8a9d25ff63",
   "cjs"
 );
 //# sourceMappingURL=index.js.map

package/dist-cjs/lib/Tldraw.js

@@ -186,11 +186,6 @@ function InsideOfEditorAndUiContext({
     unsubs.push((0, import_defaultSideEffects.registerDefaultSideEffects)(editor));
     editor.fonts.requestFonts(import_defaultFonts.allDefaultFontFaces);
     editor.once("edit", () => trackEvent("edit", { source: "unknown" }));
-    const handleWatermarkClick = (info) => {
-      trackEvent("click-watermark", { source: "unknown", url: info.url });
-    };
-    editor.on("click-watermark", handleWatermarkClick);
-    unsubs.push(() => editor.off("click-watermark", handleWatermarkClick));
     (0, import_defaultExternalContentHandlers.registerDefaultExternalContentHandlers)(editor, {
       maxImageDimension,
       maxAssetSize,

package/dist-cjs/lib/Tldraw.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/lib/Tldraw.tsx"],
-  "sourcesContent": ["import {\n\tDEFAULT_SUPPORTED_IMAGE_TYPES,\n\tDEFAULT_SUPPORT_VIDEO_TYPES,\n\tTLEditorComponents,\n\tTLOnMountHandler,\n\tTLTextOptions,\n\tTldrawEditor,\n\tTldrawEditorBaseProps,\n\tTldrawEditorStoreProps,\n\tdefaultUserPreferences,\n\tmergeArraysAndReplaceDefaults,\n\tuseEditor,\n\tuseEditorComponents,\n\tuseOnMount,\n\tuseShallowArrayIdentity,\n\tuseShallowObjectIdentity,\n} from '@tldraw/editor'\nimport { useMemo } from 'react'\nimport { TldrawHandles } from './canvas/TldrawHandles'\nimport { TldrawOverlays } from './canvas/TldrawOverlays'\nimport { TldrawScribble } from './canvas/TldrawScribble'\nimport { TldrawSelectionForeground } from './canvas/TldrawSelectionForeground'\nimport { TldrawShapeIndicators } from './canvas/TldrawShapeIndicators'\nimport { defaultBindingUtils } from './defaultBindingUtils'\nimport { TLEmbedDefinition } from './defaultEmbedDefinitions'\nimport {\n\tTLExternalContentProps,\n\tregisterDefaultExternalContentHandlers,\n} from './defaultExternalContentHandlers'\nimport { defaultShapeTools } from './defaultShapeTools'\nimport { defaultShapeUtils } from './defaultShapeUtils'\nimport { registerDefaultSideEffects } from './defaultSideEffects'\nimport { defaultTools } from './defaultTools'\nimport { EmbedShapeUtil } from './shapes/embed/EmbedShapeUtil'\nimport { allDefaultFontFaces } from './shapes/shared/defaultFonts'\nimport { TldrawUi, TldrawUiInFrontOfTheCanvas, TldrawUiProps } from './ui/TldrawUi'\nimport { TLUiAssetUrlOverrides, useDefaultUiAssetUrlsWithOverrides } from './ui/assetUrls'\nimport { LoadingScreen } from './ui/components/LoadingScreen'\nimport { Spinner } from './ui/components/Spinner'\nimport { AssetUrlsProvider } from './ui/context/asset-urls'\nimport { TLUiComponents, useTldrawUiComponents } from './ui/context/components'\nimport { useUiEvents } from './ui/context/events'\nimport { useToasts } from './ui/context/toasts'\nimport {\n\tTldrawUiTranslationProvider,\n\tuseTranslation,\n} from './ui/hooks/useTranslation/useTranslation'\nimport { useMergedTranslationOverrides } from './ui/overrides'\nimport { useDefaultEditorAssetsWithOverrides } from './utils/static-assets/assetUrls'\nimport { defaultAddFontsFromNode, tipTapDefaultExtensions } from './utils/text/richText'\n\n/**\n * Override the default react components used by the editor and UI. Set components to null to\n * disable them entirely.\n *\n * @example\n * ```tsx\n * import {Tldraw, TLComponents} from 'tldraw'\n *\n * const components: TLComponents = {\n *    Scribble: MyCustomScribble,\n * }\n *\n * export function MyApp() {\n *   return <Tldraw components={components} />\n * }\n * ```\n *\n *\n * @public\n */\nexport interface TLComponents extends TLEditorComponents, TLUiComponents {}\n\n/** @public */\nexport interface TldrawBaseProps\n\textends TldrawUiProps,\n\t\tTldrawEditorBaseProps,\n\t\tTLExternalContentProps {\n\t/** Urls for custom assets.\n\t *\n\t * \u26A0\uFE0E Important! This must be memoized (with useMemo) or defined outside of any React component.\n\t */\n\tassetUrls?: TLUiAssetUrlOverrides\n\t/** Overrides for tldraw's components.\n\t *\n\t * \u26A0\uFE0E Important! This must be memoized (with useMemo) or defined outside of any React component.\n\t */\n\tcomponents?: TLComponents\n\t/** Custom definitions for tldraw's embeds.\n\t *\n\t * \u26A0\uFE0E Important! This must be memoized (with useMemo) or defined outside of any React component.\n\t */\n\tembeds?: TLEmbedDefinition[]\n}\n\n/** @public */\nexport type TldrawProps = TldrawBaseProps & TldrawEditorStoreProps\n\nconst allDefaultTools = [...defaultTools, ...defaultShapeTools]\n\n/** @public @react */\nexport function Tldraw(props: TldrawProps) {\n\tconst {\n\t\tchildren,\n\t\tmaxImageDimension,\n\t\tmaxAssetSize,\n\t\tacceptedImageMimeTypes,\n\t\tacceptedVideoMimeTypes,\n\t\tonMount,\n\t\tcomponents = {},\n\t\tshapeUtils = [],\n\t\tbindingUtils = [],\n\t\ttools = [],\n\t\tembeds,\n\t\ttextOptions,\n\t\t...rest\n\t} = props\n\n\tconst _components = useShallowObjectIdentity(components)\n\n\tconst CustomInFrontOfTheCanvas = components?.InFrontOfTheCanvas\n\tconst InFrontOfTheCanvas = useMemo(() => {\n\t\tif (rest.hideUi) return CustomInFrontOfTheCanvas ?? null\n\t\tif (!CustomInFrontOfTheCanvas) return TldrawUiInFrontOfTheCanvas\n\n\t\treturn () => (\n\t\t\t<>\n\t\t\t\t<TldrawUiInFrontOfTheCanvas />\n\t\t\t\t<CustomInFrontOfTheCanvas />\n\t\t\t</>\n\t\t)\n\t}, [rest.hideUi, CustomInFrontOfTheCanvas])\n\tconst componentsWithDefault = useMemo(\n\t\t() => ({\n\t\t\tScribble: TldrawScribble,\n\t\t\tShapeIndicators: TldrawShapeIndicators,\n\t\t\tCollaboratorScribble: TldrawScribble,\n\t\t\tSelectionForeground: TldrawSelectionForeground,\n\t\t\tHandles: TldrawHandles,\n\t\t\tOverlays: TldrawOverlays,\n\t\t\tSpinner,\n\t\t\tLoadingScreen,\n\t\t\t..._components,\n\t\t\tInFrontOfTheCanvas,\n\t\t}),\n\t\t[_components, InFrontOfTheCanvas]\n\t)\n\n\tconst _shapeUtils = useShallowArrayIdentity(shapeUtils)\n\tconst shapeUtilsWithDefaults = useMemo(\n\t\t() => mergeArraysAndReplaceDefaults('type', _shapeUtils, defaultShapeUtils),\n\t\t[_shapeUtils]\n\t)\n\n\tconst _bindingUtils = useShallowArrayIdentity(bindingUtils)\n\tconst bindingUtilsWithDefaults = useMemo(\n\t\t() => mergeArraysAndReplaceDefaults('type', _bindingUtils, defaultBindingUtils),\n\t\t[_bindingUtils]\n\t)\n\n\tconst _tools = useShallowArrayIdentity(tools)\n\tconst toolsWithDefaults = useMemo(\n\t\t() => mergeArraysAndReplaceDefaults('id', _tools, allDefaultTools),\n\t\t[_tools]\n\t)\n\n\tconst _imageMimeTypes = useShallowArrayIdentity(\n\t\tacceptedImageMimeTypes ?? DEFAULT_SUPPORTED_IMAGE_TYPES\n\t)\n\tconst _videoMimeTypes = useShallowArrayIdentity(\n\t\tacceptedVideoMimeTypes ?? DEFAULT_SUPPORT_VIDEO_TYPES\n\t)\n\n\tconst textOptionsWithDefaults = useMemo((): TLTextOptions => {\n\t\treturn {\n\t\t\taddFontsFromNode: defaultAddFontsFromNode,\n\t\t\t...textOptions,\n\t\t\ttipTapConfig: {\n\t\t\t\textensions: tipTapDefaultExtensions,\n\t\t\t\t...textOptions?.tipTapConfig,\n\t\t\t},\n\t\t}\n\t}, [textOptions])\n\n\tconst mediaMimeTypes = useMemo(\n\t\t() => [..._imageMimeTypes, ..._videoMimeTypes],\n\t\t[_imageMimeTypes, _videoMimeTypes]\n\t)\n\n\tconst assets = useDefaultEditorAssetsWithOverrides(rest.assetUrls)\n\n\tconst embedShapeUtil = shapeUtilsWithDefaults.find((util) => util.type === 'embed')\n\tif (embedShapeUtil && embeds) {\n\t\tEmbedShapeUtil.setEmbedDefinitions(embeds)\n\t}\n\n\treturn (\n\t\t// We provide an extra higher layer of asset+translations providers here so that\n\t\t// loading UI (which is rendered outside of TldrawUi) may be translated.\n\t\t// Ideally we would refactor to hoist all the UI context providers we can up here. Maybe later.\n\t\t<AssetUrlsProvider assetUrls={useDefaultUiAssetUrlsWithOverrides(rest.assetUrls)}>\n\t\t\t<TldrawUiTranslationProvider\n\t\t\t\toverrides={useMergedTranslationOverrides(rest.overrides)}\n\t\t\t\tlocale={rest.user?.userPreferences.get().locale ?? defaultUserPreferences.locale}\n\t\t\t>\n\t\t\t\t<TldrawEditor\n\t\t\t\t\tinitialState=\"select\"\n\t\t\t\t\t{...rest}\n\t\t\t\t\tcomponents={componentsWithDefault}\n\t\t\t\t\tshapeUtils={shapeUtilsWithDefaults}\n\t\t\t\t\tbindingUtils={bindingUtilsWithDefaults}\n\t\t\t\t\ttools={toolsWithDefaults}\n\t\t\t\t\ttextOptions={textOptionsWithDefaults}\n\t\t\t\t\tassetUrls={assets}\n\t\t\t\t>\n\t\t\t\t\t<TldrawUi {...rest} components={componentsWithDefault} mediaMimeTypes={mediaMimeTypes}>\n\t\t\t\t\t\t<InsideOfEditorAndUiContext\n\t\t\t\t\t\t\tmaxImageDimension={maxImageDimension}\n\t\t\t\t\t\t\tmaxAssetSize={maxAssetSize}\n\t\t\t\t\t\t\tacceptedImageMimeTypes={_imageMimeTypes}\n\t\t\t\t\t\t\tacceptedVideoMimeTypes={_videoMimeTypes}\n\t\t\t\t\t\t\tonMount={onMount}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{children}\n\t\t\t\t\t</TldrawUi>\n\t\t\t\t</TldrawEditor>\n\t\t\t</TldrawUiTranslationProvider>\n\t\t</AssetUrlsProvider>\n\t)\n}\n\n// We put these hooks into a component here so that they can run inside of the context provided by TldrawEditor and TldrawUi.\nfunction InsideOfEditorAndUiContext({\n\tmaxImageDimension,\n\tmaxAssetSize,\n\tacceptedImageMimeTypes,\n\tacceptedVideoMimeTypes,\n\tonMount,\n}: TLExternalContentProps & {\n\tonMount?: TLOnMountHandler\n}) {\n\tconst editor = useEditor()\n\tconst toasts = useToasts()\n\tconst msg = useTranslation()\n\tconst trackEvent = useUiEvents()\n\n\tuseOnMount(() => {\n\t\tconst unsubs: (void | (() => void) | undefined)[] = []\n\n\t\tunsubs.push(registerDefaultSideEffects(editor))\n\n\t\t// now that the editor has mounted (and presumably pre-loaded the fonts actually in use in\n\t\t// the document), we want to preload the other default font faces in the background. These\n\t\t// won't be directly used, but mean that when adding text the user can switch between fonts\n\t\t// quickly, without having to wait for them to load in.\n\t\teditor.fonts.requestFonts(allDefaultFontFaces)\n\n\t\teditor.once('edit', () => trackEvent('edit', { source: 'unknown' }))\n\n\t\t// Forward watermark click events from editor to UI event system\n\t\tconst handleWatermarkClick = (info: { url: string }) => {\n\t\t\ttrackEvent('click-watermark', { source: 'unknown', url: info.url })\n\t\t}\n\t\teditor.on('click-watermark', handleWatermarkClick)\n\t\tunsubs.push(() => editor.off('click-watermark', handleWatermarkClick))\n\n\t\t// for content handling, first we register the default handlers...\n\t\tregisterDefaultExternalContentHandlers(editor, {\n\t\t\tmaxImageDimension,\n\t\t\tmaxAssetSize,\n\t\t\tacceptedImageMimeTypes,\n\t\t\tacceptedVideoMimeTypes,\n\t\t\ttoasts,\n\t\t\tmsg,\n\t\t})\n\n\t\t// ...then we call the store's on mount which may override them...\n\t\tunsubs.push(editor.store.props.onMount(editor))\n\n\t\t// ...then we run the user's onMount prop, which may override things again.\n\t\tunsubs.push(onMount?.(editor))\n\n\t\treturn () => {\n\t\t\tunsubs.forEach((fn) => fn?.())\n\t\t}\n\t})\n\n\tconst { Canvas } = useEditorComponents()\n\tconst { ContextMenu } = useTldrawUiComponents()\n\n\tif (ContextMenu) {\n\t\t// should wrap canvas\n\t\treturn <ContextMenu />\n\t}\n\n\tif (Canvas) {\n\t\treturn <Canvas />\n\t}\n\n\treturn null\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\tDEFAULT_SUPPORTED_IMAGE_TYPES,\n\tDEFAULT_SUPPORT_VIDEO_TYPES,\n\tTLEditorComponents,\n\tTLOnMountHandler,\n\tTLTextOptions,\n\tTldrawEditor,\n\tTldrawEditorBaseProps,\n\tTldrawEditorStoreProps,\n\tdefaultUserPreferences,\n\tmergeArraysAndReplaceDefaults,\n\tuseEditor,\n\tuseEditorComponents,\n\tuseOnMount,\n\tuseShallowArrayIdentity,\n\tuseShallowObjectIdentity,\n} from '@tldraw/editor'\nimport { useMemo } from 'react'\nimport { TldrawHandles } from './canvas/TldrawHandles'\nimport { TldrawOverlays } from './canvas/TldrawOverlays'\nimport { TldrawScribble } from './canvas/TldrawScribble'\nimport { TldrawSelectionForeground } from './canvas/TldrawSelectionForeground'\nimport { TldrawShapeIndicators } from './canvas/TldrawShapeIndicators'\nimport { defaultBindingUtils } from './defaultBindingUtils'\nimport { TLEmbedDefinition } from './defaultEmbedDefinitions'\nimport {\n\tTLExternalContentProps,\n\tregisterDefaultExternalContentHandlers,\n} from './defaultExternalContentHandlers'\nimport { defaultShapeTools } from './defaultShapeTools'\nimport { defaultShapeUtils } from './defaultShapeUtils'\nimport { registerDefaultSideEffects } from './defaultSideEffects'\nimport { defaultTools } from './defaultTools'\nimport { EmbedShapeUtil } from './shapes/embed/EmbedShapeUtil'\nimport { allDefaultFontFaces } from './shapes/shared/defaultFonts'\nimport { TldrawUi, TldrawUiInFrontOfTheCanvas, TldrawUiProps } from './ui/TldrawUi'\nimport { TLUiAssetUrlOverrides, useDefaultUiAssetUrlsWithOverrides } from './ui/assetUrls'\nimport { LoadingScreen } from './ui/components/LoadingScreen'\nimport { Spinner } from './ui/components/Spinner'\nimport { AssetUrlsProvider } from './ui/context/asset-urls'\nimport { TLUiComponents, useTldrawUiComponents } from './ui/context/components'\nimport { useUiEvents } from './ui/context/events'\nimport { useToasts } from './ui/context/toasts'\nimport {\n\tTldrawUiTranslationProvider,\n\tuseTranslation,\n} from './ui/hooks/useTranslation/useTranslation'\nimport { useMergedTranslationOverrides } from './ui/overrides'\nimport { useDefaultEditorAssetsWithOverrides } from './utils/static-assets/assetUrls'\nimport { defaultAddFontsFromNode, tipTapDefaultExtensions } from './utils/text/richText'\n\n/**\n * Override the default react components used by the editor and UI. Set components to null to\n * disable them entirely.\n *\n * @example\n * ```tsx\n * import {Tldraw, TLComponents} from 'tldraw'\n *\n * const components: TLComponents = {\n *    Scribble: MyCustomScribble,\n * }\n *\n * export function MyApp() {\n *   return <Tldraw components={components} />\n * }\n * ```\n *\n *\n * @public\n */\nexport interface TLComponents extends TLEditorComponents, TLUiComponents {}\n\n/** @public */\nexport interface TldrawBaseProps\n\textends TldrawUiProps,\n\t\tTldrawEditorBaseProps,\n\t\tTLExternalContentProps {\n\t/** Urls for custom assets.\n\t *\n\t * \u26A0\uFE0E Important! This must be memoized (with useMemo) or defined outside of any React component.\n\t */\n\tassetUrls?: TLUiAssetUrlOverrides\n\t/** Overrides for tldraw's components.\n\t *\n\t * \u26A0\uFE0E Important! This must be memoized (with useMemo) or defined outside of any React component.\n\t */\n\tcomponents?: TLComponents\n\t/** Custom definitions for tldraw's embeds.\n\t *\n\t * \u26A0\uFE0E Important! This must be memoized (with useMemo) or defined outside of any React component.\n\t */\n\tembeds?: TLEmbedDefinition[]\n}\n\n/** @public */\nexport type TldrawProps = TldrawBaseProps & TldrawEditorStoreProps\n\nconst allDefaultTools = [...defaultTools, ...defaultShapeTools]\n\n/** @public @react */\nexport function Tldraw(props: TldrawProps) {\n\tconst {\n\t\tchildren,\n\t\tmaxImageDimension,\n\t\tmaxAssetSize,\n\t\tacceptedImageMimeTypes,\n\t\tacceptedVideoMimeTypes,\n\t\tonMount,\n\t\tcomponents = {},\n\t\tshapeUtils = [],\n\t\tbindingUtils = [],\n\t\ttools = [],\n\t\tembeds,\n\t\ttextOptions,\n\t\t...rest\n\t} = props\n\n\tconst _components = useShallowObjectIdentity(components)\n\n\tconst CustomInFrontOfTheCanvas = components?.InFrontOfTheCanvas\n\tconst InFrontOfTheCanvas = useMemo(() => {\n\t\tif (rest.hideUi) return CustomInFrontOfTheCanvas ?? null\n\t\tif (!CustomInFrontOfTheCanvas) return TldrawUiInFrontOfTheCanvas\n\n\t\treturn () => (\n\t\t\t<>\n\t\t\t\t<TldrawUiInFrontOfTheCanvas />\n\t\t\t\t<CustomInFrontOfTheCanvas />\n\t\t\t</>\n\t\t)\n\t}, [rest.hideUi, CustomInFrontOfTheCanvas])\n\tconst componentsWithDefault = useMemo(\n\t\t() => ({\n\t\t\tScribble: TldrawScribble,\n\t\t\tShapeIndicators: TldrawShapeIndicators,\n\t\t\tCollaboratorScribble: TldrawScribble,\n\t\t\tSelectionForeground: TldrawSelectionForeground,\n\t\t\tHandles: TldrawHandles,\n\t\t\tOverlays: TldrawOverlays,\n\t\t\tSpinner,\n\t\t\tLoadingScreen,\n\t\t\t..._components,\n\t\t\tInFrontOfTheCanvas,\n\t\t}),\n\t\t[_components, InFrontOfTheCanvas]\n\t)\n\n\tconst _shapeUtils = useShallowArrayIdentity(shapeUtils)\n\tconst shapeUtilsWithDefaults = useMemo(\n\t\t() => mergeArraysAndReplaceDefaults('type', _shapeUtils, defaultShapeUtils),\n\t\t[_shapeUtils]\n\t)\n\n\tconst _bindingUtils = useShallowArrayIdentity(bindingUtils)\n\tconst bindingUtilsWithDefaults = useMemo(\n\t\t() => mergeArraysAndReplaceDefaults('type', _bindingUtils, defaultBindingUtils),\n\t\t[_bindingUtils]\n\t)\n\n\tconst _tools = useShallowArrayIdentity(tools)\n\tconst toolsWithDefaults = useMemo(\n\t\t() => mergeArraysAndReplaceDefaults('id', _tools, allDefaultTools),\n\t\t[_tools]\n\t)\n\n\tconst _imageMimeTypes = useShallowArrayIdentity(\n\t\tacceptedImageMimeTypes ?? DEFAULT_SUPPORTED_IMAGE_TYPES\n\t)\n\tconst _videoMimeTypes = useShallowArrayIdentity(\n\t\tacceptedVideoMimeTypes ?? DEFAULT_SUPPORT_VIDEO_TYPES\n\t)\n\n\tconst textOptionsWithDefaults = useMemo((): TLTextOptions => {\n\t\treturn {\n\t\t\taddFontsFromNode: defaultAddFontsFromNode,\n\t\t\t...textOptions,\n\t\t\ttipTapConfig: {\n\t\t\t\textensions: tipTapDefaultExtensions,\n\t\t\t\t...textOptions?.tipTapConfig,\n\t\t\t},\n\t\t}\n\t}, [textOptions])\n\n\tconst mediaMimeTypes = useMemo(\n\t\t() => [..._imageMimeTypes, ..._videoMimeTypes],\n\t\t[_imageMimeTypes, _videoMimeTypes]\n\t)\n\n\tconst assets = useDefaultEditorAssetsWithOverrides(rest.assetUrls)\n\n\tconst embedShapeUtil = shapeUtilsWithDefaults.find((util) => util.type === 'embed')\n\tif (embedShapeUtil && embeds) {\n\t\tEmbedShapeUtil.setEmbedDefinitions(embeds)\n\t}\n\n\treturn (\n\t\t// We provide an extra higher layer of asset+translations providers here so that\n\t\t// loading UI (which is rendered outside of TldrawUi) may be translated.\n\t\t// Ideally we would refactor to hoist all the UI context providers we can up here. Maybe later.\n\t\t<AssetUrlsProvider assetUrls={useDefaultUiAssetUrlsWithOverrides(rest.assetUrls)}>\n\t\t\t<TldrawUiTranslationProvider\n\t\t\t\toverrides={useMergedTranslationOverrides(rest.overrides)}\n\t\t\t\tlocale={rest.user?.userPreferences.get().locale ?? defaultUserPreferences.locale}\n\t\t\t>\n\t\t\t\t<TldrawEditor\n\t\t\t\t\tinitialState=\"select\"\n\t\t\t\t\t{...rest}\n\t\t\t\t\tcomponents={componentsWithDefault}\n\t\t\t\t\tshapeUtils={shapeUtilsWithDefaults}\n\t\t\t\t\tbindingUtils={bindingUtilsWithDefaults}\n\t\t\t\t\ttools={toolsWithDefaults}\n\t\t\t\t\ttextOptions={textOptionsWithDefaults}\n\t\t\t\t\tassetUrls={assets}\n\t\t\t\t>\n\t\t\t\t\t<TldrawUi {...rest} components={componentsWithDefault} mediaMimeTypes={mediaMimeTypes}>\n\t\t\t\t\t\t<InsideOfEditorAndUiContext\n\t\t\t\t\t\t\tmaxImageDimension={maxImageDimension}\n\t\t\t\t\t\t\tmaxAssetSize={maxAssetSize}\n\t\t\t\t\t\t\tacceptedImageMimeTypes={_imageMimeTypes}\n\t\t\t\t\t\t\tacceptedVideoMimeTypes={_videoMimeTypes}\n\t\t\t\t\t\t\tonMount={onMount}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{children}\n\t\t\t\t\t</TldrawUi>\n\t\t\t\t</TldrawEditor>\n\t\t\t</TldrawUiTranslationProvider>\n\t\t</AssetUrlsProvider>\n\t)\n}\n\n// We put these hooks into a component here so that they can run inside of the context provided by TldrawEditor and TldrawUi.\nfunction InsideOfEditorAndUiContext({\n\tmaxImageDimension,\n\tmaxAssetSize,\n\tacceptedImageMimeTypes,\n\tacceptedVideoMimeTypes,\n\tonMount,\n}: TLExternalContentProps & {\n\tonMount?: TLOnMountHandler\n}) {\n\tconst editor = useEditor()\n\tconst toasts = useToasts()\n\tconst msg = useTranslation()\n\tconst trackEvent = useUiEvents()\n\n\tuseOnMount(() => {\n\t\tconst unsubs: (void | (() => void) | undefined)[] = []\n\n\t\tunsubs.push(registerDefaultSideEffects(editor))\n\n\t\t// now that the editor has mounted (and presumably pre-loaded the fonts actually in use in\n\t\t// the document), we want to preload the other default font faces in the background. These\n\t\t// won't be directly used, but mean that when adding text the user can switch between fonts\n\t\t// quickly, without having to wait for them to load in.\n\t\teditor.fonts.requestFonts(allDefaultFontFaces)\n\n\t\teditor.once('edit', () => trackEvent('edit', { source: 'unknown' }))\n\n\t\t// for content handling, first we register the default handlers...\n\t\tregisterDefaultExternalContentHandlers(editor, {\n\t\t\tmaxImageDimension,\n\t\t\tmaxAssetSize,\n\t\t\tacceptedImageMimeTypes,\n\t\t\tacceptedVideoMimeTypes,\n\t\t\ttoasts,\n\t\t\tmsg,\n\t\t})\n\n\t\t// ...then we call the store's on mount which may override them...\n\t\tunsubs.push(editor.store.props.onMount(editor))\n\n\t\t// ...then we run the user's onMount prop, which may override things again.\n\t\tunsubs.push(onMount?.(editor))\n\n\t\treturn () => {\n\t\t\tunsubs.forEach((fn) => fn?.())\n\t\t}\n\t})\n\n\tconst { Canvas } = useEditorComponents()\n\tconst { ContextMenu } = useTldrawUiComponents()\n\n\tif (ContextMenu) {\n\t\t// should wrap canvas\n\t\treturn <ContextMenu />\n\t}\n\n\tif (Canvas) {\n\t\treturn <Canvas />\n\t}\n\n\treturn null\n}\n"],
+  "mappings": "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",
   "names": ["import_assetUrls"]
 }

package/dist-cjs/lib/canvas/TldrawSelectionForeground.js

@@ -63,7 +63,9 @@ const TldrawSelectionForeground = (0, import_editor.track)(function TldrawSelect
   const isLockedShape = onlyShape && editor.isShapeOrAncestorLocked(onlyShape);
   const expandOutlineBy = onlyShape ? editor.getShapeUtil(onlyShape).expandSelectionOutlinePx(onlyShape) : 0;
   const expandedBounds = expandOutlineBy instanceof import_editor.Box ? bounds.clone().expand(expandOutlineBy).zeroFix() : bounds.clone().expandBy(expandOutlineBy).zeroFix();
-  (0, import_editor.useTransform)(rSvg, bounds?.x, bounds?.y, 1, editor.getSelectionRotation(), {
+  const selectionRotation = editor.getSelectionRotation();
+  const isShapeTooCloseToContextualToolbar = selectionRotation / import_editor.HALF_PI > 1.6 && selectionRotation / import_editor.HALF_PI < 2.4;
+  (0, import_editor.useTransform)(rSvg, bounds?.x, bounds?.y, 1, selectionRotation, {
     x: expandedBounds.x - bounds.x,
     y: expandedBounds.y - bounds.y
   });
@@ -137,6 +139,7 @@ const TldrawSelectionForeground = (0, import_editor.track)(function TldrawSelect
   }
   const textHandleHeight = Math.min(24 / zoom, height - targetSizeY * 3);
   const showTextResizeHandles = shouldDisplayControls && isCoarsePointer && onlyShape && editor.isShapeOfType(onlyShape, "text") && textHandleHeight * zoom >= 4;
+  const isMediaShape = onlyShape && (editor.isShapeOfType(onlyShape, "image") || editor.isShapeOfType(onlyShape, "video"));
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "svg",
     {
@@ -205,7 +208,7 @@ const TldrawSelectionForeground = (0, import_editor.track)(function TldrawSelect
           {
             "data-testid": "selection.rotate.mobile",
             cx: isSmallX ? -targetSize * 1.5 : width / 2,
-            cy: isSmallX ? height / 2 : -targetSize * 1.5,
+            cy: isSmallX ? height / 2 : isMediaShape && !isShapeTooCloseToContextualToolbar ? height + targetSize * 1.5 : -targetSize * 1.5,
             size,
             isHidden: hideMobileRotateHandle
           }

package/dist-cjs/lib/canvas/TldrawSelectionForeground.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/lib/canvas/TldrawSelectionForeground.tsx"],
-  "sourcesContent": ["import {\n\tBox,\n\tRotateCorner,\n\tTLEmbedShape,\n\tTLSelectionForegroundProps,\n\tTLTextShape,\n\tgetCursor,\n\ttlenv,\n\ttoDomPrecision,\n\ttrack,\n\tuseEditor,\n\tuseSelectionEvents,\n\tuseTransform,\n\tuseValue,\n} from '@tldraw/editor'\nimport classNames from 'classnames'\nimport { PointerEventHandler, useRef } from 'react'\nimport { useReadonly } from '../ui/hooks/useReadonly'\nimport { useTranslation } from '../ui/hooks/useTranslation/useTranslation'\nimport { TldrawCropHandles } from './TldrawCropHandles'\n\n/** @public */\nexport const TldrawSelectionForeground = track(function TldrawSelectionForeground({\n\tbounds,\n\trotation,\n}: TLSelectionForegroundProps) {\n\tconst editor = useEditor()\n\tconst msg = useTranslation()\n\tconst rSvg = useRef<SVGSVGElement>(null)\n\n\tconst isReadonlyMode = useReadonly()\n\tconst topEvents = useSelectionEvents('top')\n\tconst rightEvents = useSelectionEvents('right')\n\tconst bottomEvents = useSelectionEvents('bottom')\n\tconst leftEvents = useSelectionEvents('left')\n\tconst topLeftEvents = useSelectionEvents('top_left')\n\tconst topRightEvents = useSelectionEvents('top_right')\n\tconst bottomRightEvents = useSelectionEvents('bottom_right')\n\tconst bottomLeftEvents = useSelectionEvents('bottom_left')\n\n\tconst isDefaultCursor = editor.getInstanceState().cursor.type === 'default'\n\tconst isCoarsePointer = editor.getInstanceState().isCoarsePointer\n\n\tconst onlyShape = editor.getOnlySelectedShape()\n\tconst isLockedShape = onlyShape && editor.isShapeOrAncestorLocked(onlyShape)\n\n\t// if all shapes have an expandBy for the selection outline, we can expand by the l\n\tconst expandOutlineBy = onlyShape\n\t\t? editor.getShapeUtil(onlyShape).expandSelectionOutlinePx(onlyShape)\n\t\t: 0\n\n\tconst expandedBounds =\n\t\texpandOutlineBy instanceof Box\n\t\t\t? bounds.clone().expand(expandOutlineBy).zeroFix()\n\t\t\t: bounds.clone().expandBy(expandOutlineBy).zeroFix()\n\n\tuseTransform(rSvg, bounds?.x, bounds?.y, 1, editor.getSelectionRotation(), {\n\t\tx: expandedBounds.x - bounds.x,\n\t\ty: expandedBounds.y - bounds.y,\n\t})\n\n\tif (onlyShape && editor.isShapeHidden(onlyShape)) return null\n\n\tconst zoom = editor.getZoomLevel()\n\tconst isChangingStyle = editor.getInstanceState().isChangingStyle\n\n\tconst width = expandedBounds.width\n\tconst height = expandedBounds.height\n\n\tconst size = 8 / zoom\n\tconst isTinyX = width < size * 2\n\tconst isTinyY = height < size * 2\n\n\tconst isSmallX = width < size * 4\n\tconst isSmallY = height < size * 4\n\tconst isSmallCropX = width < size * 5\n\tconst isSmallCropY = height < size * 5\n\n\tconst mobileHandleMultiplier = isCoarsePointer ? 1.75 : 1\n\tconst targetSize = (6 / zoom) * mobileHandleMultiplier\n\n\tconst targetSizeX = (isSmallX ? targetSize / 2 : targetSize) * (mobileHandleMultiplier * 0.75)\n\tconst targetSizeY = (isSmallY ? targetSize / 2 : targetSize) * (mobileHandleMultiplier * 0.75)\n\n\tconst showSelectionBounds =\n\t\t(onlyShape ? !editor.getShapeUtil(onlyShape).hideSelectionBoundsFg(onlyShape) : true) &&\n\t\t!isChangingStyle\n\n\tlet shouldDisplayBox =\n\t\t(showSelectionBounds &&\n\t\t\teditor.isInAny(\n\t\t\t\t'select.idle',\n\t\t\t\t'select.brushing',\n\t\t\t\t'select.scribble_brushing',\n\t\t\t\t'select.pointing_canvas',\n\t\t\t\t'select.pointing_selection',\n\t\t\t\t'select.pointing_shape',\n\t\t\t\t'select.crop.idle',\n\t\t\t\t'select.crop.pointing_crop',\n\t\t\t\t'select.crop.pointing_crop_handle',\n\t\t\t\t'select.pointing_resize_handle'\n\t\t\t)) ||\n\t\t(showSelectionBounds &&\n\t\t\teditor.isIn('select.resizing') &&\n\t\t\tonlyShape &&\n\t\t\teditor.isShapeOfType<TLTextShape>(onlyShape, 'text'))\n\n\tif (onlyShape && shouldDisplayBox) {\n\t\tif (tlenv.isFirefox && editor.isShapeOfType<TLEmbedShape>(onlyShape, 'embed')) {\n\t\t\tshouldDisplayBox = false\n\t\t}\n\t}\n\n\tconst showCropHandles =\n\t\teditor.isInAny(\n\t\t\t'select.crop.idle',\n\t\t\t'select.crop.pointing_crop',\n\t\t\t'select.crop.pointing_crop_handle'\n\t\t) &&\n\t\t!isChangingStyle &&\n\t\t!isReadonlyMode\n\n\tconst shouldDisplayControls =\n\t\teditor.isInAny(\n\t\t\t'select.idle',\n\t\t\t'select.pointing_selection',\n\t\t\t'select.pointing_shape',\n\t\t\t'select.crop.idle'\n\t\t) &&\n\t\t!isChangingStyle &&\n\t\t!isReadonlyMode\n\n\tconst showCornerRotateHandles =\n\t\t!isCoarsePointer &&\n\t\t!(isTinyX || isTinyY) &&\n\t\t(shouldDisplayControls || showCropHandles) &&\n\t\t(onlyShape ? !editor.getShapeUtil(onlyShape).hideRotateHandle(onlyShape) : true) &&\n\t\t!isLockedShape\n\n\tconst showMobileRotateHandle =\n\t\tisCoarsePointer &&\n\t\t(!isSmallX || !isSmallY) &&\n\t\t(shouldDisplayControls || showCropHandles) &&\n\t\t(onlyShape ? !editor.getShapeUtil(onlyShape).hideRotateHandle(onlyShape) : true) &&\n\t\t!isLockedShape\n\n\tconst showResizeHandles =\n\t\tshouldDisplayControls &&\n\t\t(onlyShape\n\t\t\t? editor.getShapeUtil(onlyShape).canResize(onlyShape) &&\n\t\t\t\t!editor.getShapeUtil(onlyShape).hideResizeHandles(onlyShape)\n\t\t\t: true) &&\n\t\t!showCropHandles &&\n\t\t!isLockedShape\n\n\tconst hideAlternateCornerHandles = isTinyX || isTinyY\n\tconst showOnlyOneHandle = isTinyX && isTinyY\n\tconst hideAlternateCropHandles = isSmallCropX || isSmallCropY\n\n\tconst showHandles = showResizeHandles || showCropHandles\n\tconst hideRotateCornerHandles = !showCornerRotateHandles\n\tconst hideMobileRotateHandle = !shouldDisplayControls || !showMobileRotateHandle\n\tconst hideTopLeftCorner = !shouldDisplayControls || !showHandles\n\tconst hideTopRightCorner = !shouldDisplayControls || !showHandles || hideAlternateCornerHandles\n\tconst hideBottomLeftCorner = !shouldDisplayControls || !showHandles || hideAlternateCornerHandles\n\tconst hideBottomRightCorner =\n\t\t!shouldDisplayControls || !showHandles || (showOnlyOneHandle && !showCropHandles)\n\n\t// If we're showing crop handles, then show the edges too.\n\t// If we're showing resize handles, then show the edges only\n\t// if we're not hiding them for some other reason.\n\tlet hideVerticalEdgeTargets = true\n\t// The same logic above applies here, except another nuance is that\n\t// we enable resizing for text on mobile (coarse).\n\tlet hideHorizontalEdgeTargets = true\n\n\tif (showCropHandles) {\n\t\thideVerticalEdgeTargets = hideAlternateCropHandles\n\t\thideHorizontalEdgeTargets = hideAlternateCropHandles\n\t} else if (showResizeHandles) {\n\t\thideVerticalEdgeTargets = hideAlternateCornerHandles || showOnlyOneHandle || isCoarsePointer\n\t\tconst isMobileAndTextShape = isCoarsePointer && onlyShape && onlyShape.type === 'text'\n\t\thideHorizontalEdgeTargets = hideVerticalEdgeTargets && !isMobileAndTextShape\n\t}\n\n\tconst textHandleHeight = Math.min(24 / zoom, height - targetSizeY * 3)\n\tconst showTextResizeHandles =\n\t\tshouldDisplayControls &&\n\t\tisCoarsePointer &&\n\t\tonlyShape &&\n\t\teditor.isShapeOfType<TLTextShape>(onlyShape, 'text') &&\n\t\ttextHandleHeight * zoom >= 4\n\n\treturn (\n\t\t<svg\n\t\t\tclassName=\"tl-overlays__item tl-selection__fg\"\n\t\t\tdata-testid=\"selection-foreground\"\n\t\t\taria-hidden=\"true\"\n\t\t>\n\t\t\t<g ref={rSvg}>\n\t\t\t\t{shouldDisplayBox && (\n\t\t\t\t\t<rect\n\t\t\t\t\t\tclassName=\"tl-selection__fg__outline\"\n\t\t\t\t\t\twidth={toDomPrecision(width)}\n\t\t\t\t\t\theight={toDomPrecision(height)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.top-left\"\n\t\t\t\t\tcx={0}\n\t\t\t\t\tcy={0}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"top_left_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nwse-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.top-right\"\n\t\t\t\t\tcx={width + targetSize * 3}\n\t\t\t\t\tcy={0}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"top_right_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nesw-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.bottom-left\"\n\t\t\t\t\tcx={0}\n\t\t\t\t\tcy={height + targetSize * 3}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"bottom_left_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('swne-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.bottom-right\"\n\t\t\t\t\tcx={width + targetSize * 3}\n\t\t\t\t\tcy={height + targetSize * 3}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"bottom_right_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('senw-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<MobileRotateHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.mobile\"\n\t\t\t\t\tcx={isSmallX ? -targetSize * 1.5 : width / 2}\n\t\t\t\t\tcy={isSmallX ? height / 2 : -targetSize * 1.5}\n\t\t\t\t\tsize={size}\n\t\t\t\t\tisHidden={hideMobileRotateHandle}\n\t\t\t\t/>\n\t\t\t\t{/* Targets */}\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideVerticalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.top\"\n\t\t\t\t\tariaLabel={msg('handle.resize-top')}\n\t\t\t\t\tx={0}\n\t\t\t\t\ty={toDomPrecision(0 - (isSmallY ? targetSizeY * 2 : targetSizeY))}\n\t\t\t\t\twidth={toDomPrecision(width)}\n\t\t\t\t\theight={toDomPrecision(Math.max(1, targetSizeY * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ns-resize', rotation) : undefined}\n\t\t\t\t\tevents={topEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideHorizontalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.right\"\n\t\t\t\t\tariaLabel={msg('handle.resize-right')}\n\t\t\t\t\tx={toDomPrecision(width - (isSmallX ? 0 : targetSizeX))}\n\t\t\t\t\ty={0}\n\t\t\t\t\theight={toDomPrecision(height)}\n\t\t\t\t\twidth={toDomPrecision(Math.max(1, targetSizeX * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ew-resize', rotation) : undefined}\n\t\t\t\t\tevents={rightEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideVerticalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.bottom\"\n\t\t\t\t\tariaLabel={msg('handle.resize-bottom')}\n\t\t\t\t\tx={0}\n\t\t\t\t\ty={toDomPrecision(height - (isSmallY ? 0 : targetSizeY))}\n\t\t\t\t\twidth={toDomPrecision(width)}\n\t\t\t\t\theight={toDomPrecision(Math.max(1, targetSizeY * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ns-resize', rotation) : undefined}\n\t\t\t\t\tevents={bottomEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideHorizontalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.left\"\n\t\t\t\t\tariaLabel={msg('handle.resize-left')}\n\t\t\t\t\tx={toDomPrecision(0 - (isSmallX ? targetSizeX * 2 : targetSizeX))}\n\t\t\t\t\ty={0}\n\t\t\t\t\theight={toDomPrecision(height)}\n\t\t\t\t\twidth={toDomPrecision(Math.max(1, targetSizeX * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ew-resize', rotation) : undefined}\n\t\t\t\t\tevents={leftEvents}\n\t\t\t\t/>\n\t\t\t\t{/* Corner Targets */}\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideTopLeftCorner}\n\t\t\t\t\tdataTestId=\"selection.target.top-left\"\n\t\t\t\t\tariaLabel={msg('handle.resize-top-left')}\n\t\t\t\t\tx={toDomPrecision(0 - (isSmallX ? targetSizeX * 2 : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(0 - (isSmallY ? targetSizeY * 2 : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nwse-resize', rotation) : undefined}\n\t\t\t\t\tevents={topLeftEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideTopRightCorner}\n\t\t\t\t\tdataTestId=\"selection.target.top-right\"\n\t\t\t\t\tariaLabel={msg('handle.resize-top-right')}\n\t\t\t\t\tx={toDomPrecision(width - (isSmallX ? 0 : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(0 - (isSmallY ? targetSizeY * 2 : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nesw-resize', rotation) : undefined}\n\t\t\t\t\tevents={topRightEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideBottomRightCorner}\n\t\t\t\t\tdataTestId=\"selection.target.bottom-right\"\n\t\t\t\t\tariaLabel={msg('handle.resize-bottom-right')}\n\t\t\t\t\tx={toDomPrecision(width - (isSmallX ? targetSizeX : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(height - (isSmallY ? targetSizeY : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nwse-resize', rotation) : undefined}\n\t\t\t\t\tevents={bottomRightEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideBottomLeftCorner}\n\t\t\t\t\tdataTestId=\"selection.target.bottom-left\"\n\t\t\t\t\tariaLabel={msg('handle.resize-bottom-left')}\n\t\t\t\t\tx={toDomPrecision(0 - (isSmallX ? targetSizeX * 3 : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(height - (isSmallY ? 0 : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nesw-resize', rotation) : undefined}\n\t\t\t\t\tevents={bottomLeftEvents}\n\t\t\t\t/>\n\t\t\t\t{/* Resize Handles */}\n\t\t\t\t{showResizeHandles && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.top-left\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideTopLeftCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.top-right\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideTopRightCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(width - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.bottom-right\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideBottomRightCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(width - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(height - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.bottom-left\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideBottomLeftCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(height - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t\t{showTextResizeHandles && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.text-resize.left.handle\"\n\t\t\t\t\t\t\tclassName=\"tl-text-handle\"\n\t\t\t\t\t\t\tx={toDomPrecision(0 - size / 4)}\n\t\t\t\t\t\t\ty={toDomPrecision(height / 2 - textHandleHeight / 2)}\n\t\t\t\t\t\t\trx={size / 4}\n\t\t\t\t\t\t\twidth={toDomPrecision(size / 2)}\n\t\t\t\t\t\t\theight={toDomPrecision(textHandleHeight)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.text-resize.right.handle\"\n\t\t\t\t\t\t\tclassName=\"tl-text-handle\"\n\t\t\t\t\t\t\trx={size / 4}\n\t\t\t\t\t\t\tx={toDomPrecision(width - size / 4)}\n\t\t\t\t\t\t\ty={toDomPrecision(height / 2 - textHandleHeight / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size / 2)}\n\t\t\t\t\t\t\theight={toDomPrecision(textHandleHeight)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t\t{/* Crop Handles */}\n\t\t\t\t{showCropHandles && (\n\t\t\t\t\t<TldrawCropHandles\n\t\t\t\t\t\t{...{\n\t\t\t\t\t\t\tsize,\n\t\t\t\t\t\t\twidth,\n\t\t\t\t\t\t\theight,\n\t\t\t\t\t\t\thideAlternateHandles: hideAlternateCropHandles,\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</g>\n\t\t</svg>\n\t)\n})\n\nexport const ResizeHandle = function ResizeHandle({\n\thide,\n\tdataTestId,\n\tariaLabel,\n\tx,\n\ty,\n\twidth,\n\theight,\n\tcursor,\n\tevents,\n}: {\n\thide: boolean\n\tdataTestId: string\n\tariaLabel: string\n\tx: number\n\ty: number\n\twidth: number\n\theight: number\n\tcursor?: string\n\tevents: {\n\t\tonPointerUp: PointerEventHandler<Element>\n\t\tonPointerMove(e: React.PointerEvent<Element>): void\n\t\tonPointerDown: PointerEventHandler<Element>\n\t}\n}) {\n\treturn (\n\t\t<rect\n\t\t\tclassName={classNames('tl-resize-handle', 'tl-transparent', {\n\t\t\t\t'tl-hidden': hide,\n\t\t\t})}\n\t\t\tdata-testid={dataTestId}\n\t\t\trole=\"button\"\n\t\t\taria-label={ariaLabel}\n\t\t\tpointerEvents=\"all\"\n\t\t\tx={x}\n\t\t\ty={y}\n\t\t\twidth={width}\n\t\t\theight={height}\n\t\t\tcursor={cursor}\n\t\t\t{...events}\n\t\t/>\n\t)\n}\n\nexport const RotateCornerHandle = function RotateCornerHandle({\n\tcx,\n\tcy,\n\ttargetSize,\n\tcorner,\n\tcursor,\n\tisHidden,\n\t'data-testid': testId,\n}: {\n\tcx: number\n\tcy: number\n\ttargetSize: number\n\tcorner: RotateCorner\n\tcursor?: string\n\tisHidden: boolean\n\t'data-testid'?: string\n}) {\n\tconst events = useSelectionEvents(corner)\n\tconst msg = useTranslation()\n\tconst label = msg(`handle.rotate.${corner}`)\n\n\treturn (\n\t\t<rect\n\t\t\tclassName={classNames('tl-transparent', 'tl-rotate-corner', { 'tl-hidden': isHidden })}\n\t\t\tdata-testid={testId}\n\t\t\trole=\"button\"\n\t\t\taria-label={label}\n\t\t\tpointerEvents=\"all\"\n\t\t\tx={toDomPrecision(cx - targetSize * 3)}\n\t\t\ty={toDomPrecision(cy - targetSize * 3)}\n\t\t\twidth={toDomPrecision(Math.max(1, targetSize * 3))}\n\t\t\theight={toDomPrecision(Math.max(1, targetSize * 3))}\n\t\t\tcursor={cursor}\n\t\t\t{...events}\n\t\t/>\n\t)\n}\n\nconst SQUARE_ROOT_PI = Math.sqrt(Math.PI)\n\nexport const MobileRotateHandle = function RotateHandle({\n\tcx,\n\tcy,\n\tsize,\n\tisHidden,\n\t'data-testid': testId,\n}: {\n\tcx: number\n\tcy: number\n\tsize: number\n\tisHidden: boolean\n\t'data-testid'?: string\n}) {\n\tconst events = useSelectionEvents('mobile_rotate')\n\n\tconst editor = useEditor()\n\tconst zoom = useValue('zoom level', () => editor.getZoomLevel(), [editor])\n\tconst bgRadius = Math.max(14 * (1 / zoom), 20 / Math.max(1, zoom))\n\tconst msg = useTranslation()\n\treturn (\n\t\t<g role=\"button\" aria-label={msg('handle.rotate.mobile_rotate')}>\n\t\t\t<circle\n\t\t\t\tdata-testid={testId}\n\t\t\t\tpointerEvents=\"all\"\n\t\t\t\tclassName={classNames('tl-transparent', 'tl-mobile-rotate__bg', { 'tl-hidden': isHidden })}\n\t\t\t\tcx={cx}\n\t\t\t\tcy={cy}\n\t\t\t\tr={bgRadius}\n\t\t\t\t{...events}\n\t\t\t/>\n\t\t\t<circle\n\t\t\t\tclassName={classNames('tl-mobile-rotate__fg', { 'tl-hidden': isHidden })}\n\t\t\t\tcx={cx}\n\t\t\t\tcy={cy}\n\t\t\t\tr={size / SQUARE_ROOT_PI}\n\t\t\t/>\n\t\t</g>\n\t)\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\tBox,\n\tHALF_PI,\n\tRotateCorner,\n\tTLEmbedShape,\n\tTLImageShape,\n\tTLSelectionForegroundProps,\n\tTLTextShape,\n\tTLVideoShape,\n\tgetCursor,\n\ttlenv,\n\ttoDomPrecision,\n\ttrack,\n\tuseEditor,\n\tuseSelectionEvents,\n\tuseTransform,\n\tuseValue,\n} from '@tldraw/editor'\nimport classNames from 'classnames'\nimport { PointerEventHandler, useRef } from 'react'\nimport { useReadonly } from '../ui/hooks/useReadonly'\nimport { useTranslation } from '../ui/hooks/useTranslation/useTranslation'\nimport { TldrawCropHandles } from './TldrawCropHandles'\n\n/** @public */\nexport const TldrawSelectionForeground = track(function TldrawSelectionForeground({\n\tbounds,\n\trotation,\n}: TLSelectionForegroundProps) {\n\tconst editor = useEditor()\n\tconst msg = useTranslation()\n\tconst rSvg = useRef<SVGSVGElement>(null)\n\n\tconst isReadonlyMode = useReadonly()\n\tconst topEvents = useSelectionEvents('top')\n\tconst rightEvents = useSelectionEvents('right')\n\tconst bottomEvents = useSelectionEvents('bottom')\n\tconst leftEvents = useSelectionEvents('left')\n\tconst topLeftEvents = useSelectionEvents('top_left')\n\tconst topRightEvents = useSelectionEvents('top_right')\n\tconst bottomRightEvents = useSelectionEvents('bottom_right')\n\tconst bottomLeftEvents = useSelectionEvents('bottom_left')\n\n\tconst isDefaultCursor = editor.getInstanceState().cursor.type === 'default'\n\tconst isCoarsePointer = editor.getInstanceState().isCoarsePointer\n\n\tconst onlyShape = editor.getOnlySelectedShape()\n\tconst isLockedShape = onlyShape && editor.isShapeOrAncestorLocked(onlyShape)\n\n\t// if all shapes have an expandBy for the selection outline, we can expand by the l\n\tconst expandOutlineBy = onlyShape\n\t\t? editor.getShapeUtil(onlyShape).expandSelectionOutlinePx(onlyShape)\n\t\t: 0\n\n\tconst expandedBounds =\n\t\texpandOutlineBy instanceof Box\n\t\t\t? bounds.clone().expand(expandOutlineBy).zeroFix()\n\t\t\t: bounds.clone().expandBy(expandOutlineBy).zeroFix()\n\n\tconst selectionRotation = editor.getSelectionRotation()\n\tconst isShapeTooCloseToContextualToolbar =\n\t\tselectionRotation / HALF_PI > 1.6 && selectionRotation / HALF_PI < 2.4\n\tuseTransform(rSvg, bounds?.x, bounds?.y, 1, selectionRotation, {\n\t\tx: expandedBounds.x - bounds.x,\n\t\ty: expandedBounds.y - bounds.y,\n\t})\n\n\tif (onlyShape && editor.isShapeHidden(onlyShape)) return null\n\n\tconst zoom = editor.getZoomLevel()\n\tconst isChangingStyle = editor.getInstanceState().isChangingStyle\n\n\tconst width = expandedBounds.width\n\tconst height = expandedBounds.height\n\n\tconst size = 8 / zoom\n\tconst isTinyX = width < size * 2\n\tconst isTinyY = height < size * 2\n\n\tconst isSmallX = width < size * 4\n\tconst isSmallY = height < size * 4\n\tconst isSmallCropX = width < size * 5\n\tconst isSmallCropY = height < size * 5\n\n\tconst mobileHandleMultiplier = isCoarsePointer ? 1.75 : 1\n\tconst targetSize = (6 / zoom) * mobileHandleMultiplier\n\n\tconst targetSizeX = (isSmallX ? targetSize / 2 : targetSize) * (mobileHandleMultiplier * 0.75)\n\tconst targetSizeY = (isSmallY ? targetSize / 2 : targetSize) * (mobileHandleMultiplier * 0.75)\n\n\tconst showSelectionBounds =\n\t\t(onlyShape ? !editor.getShapeUtil(onlyShape).hideSelectionBoundsFg(onlyShape) : true) &&\n\t\t!isChangingStyle\n\n\tlet shouldDisplayBox =\n\t\t(showSelectionBounds &&\n\t\t\teditor.isInAny(\n\t\t\t\t'select.idle',\n\t\t\t\t'select.brushing',\n\t\t\t\t'select.scribble_brushing',\n\t\t\t\t'select.pointing_canvas',\n\t\t\t\t'select.pointing_selection',\n\t\t\t\t'select.pointing_shape',\n\t\t\t\t'select.crop.idle',\n\t\t\t\t'select.crop.pointing_crop',\n\t\t\t\t'select.crop.pointing_crop_handle',\n\t\t\t\t'select.pointing_resize_handle'\n\t\t\t)) ||\n\t\t(showSelectionBounds &&\n\t\t\teditor.isIn('select.resizing') &&\n\t\t\tonlyShape &&\n\t\t\teditor.isShapeOfType<TLTextShape>(onlyShape, 'text'))\n\n\tif (onlyShape && shouldDisplayBox) {\n\t\tif (tlenv.isFirefox && editor.isShapeOfType<TLEmbedShape>(onlyShape, 'embed')) {\n\t\t\tshouldDisplayBox = false\n\t\t}\n\t}\n\n\tconst showCropHandles =\n\t\teditor.isInAny(\n\t\t\t'select.crop.idle',\n\t\t\t'select.crop.pointing_crop',\n\t\t\t'select.crop.pointing_crop_handle'\n\t\t) &&\n\t\t!isChangingStyle &&\n\t\t!isReadonlyMode\n\n\tconst shouldDisplayControls =\n\t\teditor.isInAny(\n\t\t\t'select.idle',\n\t\t\t'select.pointing_selection',\n\t\t\t'select.pointing_shape',\n\t\t\t'select.crop.idle'\n\t\t) &&\n\t\t!isChangingStyle &&\n\t\t!isReadonlyMode\n\n\tconst showCornerRotateHandles =\n\t\t!isCoarsePointer &&\n\t\t!(isTinyX || isTinyY) &&\n\t\t(shouldDisplayControls || showCropHandles) &&\n\t\t(onlyShape ? !editor.getShapeUtil(onlyShape).hideRotateHandle(onlyShape) : true) &&\n\t\t!isLockedShape\n\n\tconst showMobileRotateHandle =\n\t\tisCoarsePointer &&\n\t\t(!isSmallX || !isSmallY) &&\n\t\t(shouldDisplayControls || showCropHandles) &&\n\t\t(onlyShape ? !editor.getShapeUtil(onlyShape).hideRotateHandle(onlyShape) : true) &&\n\t\t!isLockedShape\n\n\tconst showResizeHandles =\n\t\tshouldDisplayControls &&\n\t\t(onlyShape\n\t\t\t? editor.getShapeUtil(onlyShape).canResize(onlyShape) &&\n\t\t\t\t!editor.getShapeUtil(onlyShape).hideResizeHandles(onlyShape)\n\t\t\t: true) &&\n\t\t!showCropHandles &&\n\t\t!isLockedShape\n\n\tconst hideAlternateCornerHandles = isTinyX || isTinyY\n\tconst showOnlyOneHandle = isTinyX && isTinyY\n\tconst hideAlternateCropHandles = isSmallCropX || isSmallCropY\n\n\tconst showHandles = showResizeHandles || showCropHandles\n\tconst hideRotateCornerHandles = !showCornerRotateHandles\n\tconst hideMobileRotateHandle = !shouldDisplayControls || !showMobileRotateHandle\n\tconst hideTopLeftCorner = !shouldDisplayControls || !showHandles\n\tconst hideTopRightCorner = !shouldDisplayControls || !showHandles || hideAlternateCornerHandles\n\tconst hideBottomLeftCorner = !shouldDisplayControls || !showHandles || hideAlternateCornerHandles\n\tconst hideBottomRightCorner =\n\t\t!shouldDisplayControls || !showHandles || (showOnlyOneHandle && !showCropHandles)\n\n\t// If we're showing crop handles, then show the edges too.\n\t// If we're showing resize handles, then show the edges only\n\t// if we're not hiding them for some other reason.\n\tlet hideVerticalEdgeTargets = true\n\t// The same logic above applies here, except another nuance is that\n\t// we enable resizing for text on mobile (coarse).\n\tlet hideHorizontalEdgeTargets = true\n\n\tif (showCropHandles) {\n\t\thideVerticalEdgeTargets = hideAlternateCropHandles\n\t\thideHorizontalEdgeTargets = hideAlternateCropHandles\n\t} else if (showResizeHandles) {\n\t\thideVerticalEdgeTargets = hideAlternateCornerHandles || showOnlyOneHandle || isCoarsePointer\n\t\tconst isMobileAndTextShape = isCoarsePointer && onlyShape && onlyShape.type === 'text'\n\t\thideHorizontalEdgeTargets = hideVerticalEdgeTargets && !isMobileAndTextShape\n\t}\n\n\tconst textHandleHeight = Math.min(24 / zoom, height - targetSizeY * 3)\n\tconst showTextResizeHandles =\n\t\tshouldDisplayControls &&\n\t\tisCoarsePointer &&\n\t\tonlyShape &&\n\t\teditor.isShapeOfType<TLTextShape>(onlyShape, 'text') &&\n\t\ttextHandleHeight * zoom >= 4\n\tconst isMediaShape =\n\t\tonlyShape &&\n\t\t(editor.isShapeOfType<TLImageShape>(onlyShape, 'image') ||\n\t\t\teditor.isShapeOfType<TLVideoShape>(onlyShape, 'video'))\n\n\treturn (\n\t\t<svg\n\t\t\tclassName=\"tl-overlays__item tl-selection__fg\"\n\t\t\tdata-testid=\"selection-foreground\"\n\t\t\taria-hidden=\"true\"\n\t\t>\n\t\t\t<g ref={rSvg}>\n\t\t\t\t{shouldDisplayBox && (\n\t\t\t\t\t<rect\n\t\t\t\t\t\tclassName=\"tl-selection__fg__outline\"\n\t\t\t\t\t\twidth={toDomPrecision(width)}\n\t\t\t\t\t\theight={toDomPrecision(height)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.top-left\"\n\t\t\t\t\tcx={0}\n\t\t\t\t\tcy={0}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"top_left_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nwse-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.top-right\"\n\t\t\t\t\tcx={width + targetSize * 3}\n\t\t\t\t\tcy={0}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"top_right_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nesw-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.bottom-left\"\n\t\t\t\t\tcx={0}\n\t\t\t\t\tcy={height + targetSize * 3}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"bottom_left_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('swne-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.bottom-right\"\n\t\t\t\t\tcx={width + targetSize * 3}\n\t\t\t\t\tcy={height + targetSize * 3}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"bottom_right_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('senw-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<MobileRotateHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.mobile\"\n\t\t\t\t\tcx={isSmallX ? -targetSize * 1.5 : width / 2}\n\t\t\t\t\tcy={\n\t\t\t\t\t\tisSmallX\n\t\t\t\t\t\t\t? height / 2\n\t\t\t\t\t\t\t: isMediaShape && !isShapeTooCloseToContextualToolbar\n\t\t\t\t\t\t\t\t? height + targetSize * 1.5\n\t\t\t\t\t\t\t\t: -targetSize * 1.5\n\t\t\t\t\t}\n\t\t\t\t\tsize={size}\n\t\t\t\t\tisHidden={hideMobileRotateHandle}\n\t\t\t\t/>\n\t\t\t\t{/* Targets */}\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideVerticalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.top\"\n\t\t\t\t\tariaLabel={msg('handle.resize-top')}\n\t\t\t\t\tx={0}\n\t\t\t\t\ty={toDomPrecision(0 - (isSmallY ? targetSizeY * 2 : targetSizeY))}\n\t\t\t\t\twidth={toDomPrecision(width)}\n\t\t\t\t\theight={toDomPrecision(Math.max(1, targetSizeY * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ns-resize', rotation) : undefined}\n\t\t\t\t\tevents={topEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideHorizontalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.right\"\n\t\t\t\t\tariaLabel={msg('handle.resize-right')}\n\t\t\t\t\tx={toDomPrecision(width - (isSmallX ? 0 : targetSizeX))}\n\t\t\t\t\ty={0}\n\t\t\t\t\theight={toDomPrecision(height)}\n\t\t\t\t\twidth={toDomPrecision(Math.max(1, targetSizeX * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ew-resize', rotation) : undefined}\n\t\t\t\t\tevents={rightEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideVerticalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.bottom\"\n\t\t\t\t\tariaLabel={msg('handle.resize-bottom')}\n\t\t\t\t\tx={0}\n\t\t\t\t\ty={toDomPrecision(height - (isSmallY ? 0 : targetSizeY))}\n\t\t\t\t\twidth={toDomPrecision(width)}\n\t\t\t\t\theight={toDomPrecision(Math.max(1, targetSizeY * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ns-resize', rotation) : undefined}\n\t\t\t\t\tevents={bottomEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideHorizontalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.left\"\n\t\t\t\t\tariaLabel={msg('handle.resize-left')}\n\t\t\t\t\tx={toDomPrecision(0 - (isSmallX ? targetSizeX * 2 : targetSizeX))}\n\t\t\t\t\ty={0}\n\t\t\t\t\theight={toDomPrecision(height)}\n\t\t\t\t\twidth={toDomPrecision(Math.max(1, targetSizeX * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ew-resize', rotation) : undefined}\n\t\t\t\t\tevents={leftEvents}\n\t\t\t\t/>\n\t\t\t\t{/* Corner Targets */}\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideTopLeftCorner}\n\t\t\t\t\tdataTestId=\"selection.target.top-left\"\n\t\t\t\t\tariaLabel={msg('handle.resize-top-left')}\n\t\t\t\t\tx={toDomPrecision(0 - (isSmallX ? targetSizeX * 2 : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(0 - (isSmallY ? targetSizeY * 2 : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nwse-resize', rotation) : undefined}\n\t\t\t\t\tevents={topLeftEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideTopRightCorner}\n\t\t\t\t\tdataTestId=\"selection.target.top-right\"\n\t\t\t\t\tariaLabel={msg('handle.resize-top-right')}\n\t\t\t\t\tx={toDomPrecision(width - (isSmallX ? 0 : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(0 - (isSmallY ? targetSizeY * 2 : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nesw-resize', rotation) : undefined}\n\t\t\t\t\tevents={topRightEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideBottomRightCorner}\n\t\t\t\t\tdataTestId=\"selection.target.bottom-right\"\n\t\t\t\t\tariaLabel={msg('handle.resize-bottom-right')}\n\t\t\t\t\tx={toDomPrecision(width - (isSmallX ? targetSizeX : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(height - (isSmallY ? targetSizeY : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nwse-resize', rotation) : undefined}\n\t\t\t\t\tevents={bottomRightEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideBottomLeftCorner}\n\t\t\t\t\tdataTestId=\"selection.target.bottom-left\"\n\t\t\t\t\tariaLabel={msg('handle.resize-bottom-left')}\n\t\t\t\t\tx={toDomPrecision(0 - (isSmallX ? targetSizeX * 3 : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(height - (isSmallY ? 0 : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nesw-resize', rotation) : undefined}\n\t\t\t\t\tevents={bottomLeftEvents}\n\t\t\t\t/>\n\t\t\t\t{/* Resize Handles */}\n\t\t\t\t{showResizeHandles && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.top-left\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideTopLeftCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.top-right\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideTopRightCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(width - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.bottom-right\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideBottomRightCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(width - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(height - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.bottom-left\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideBottomLeftCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(height - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t\t{showTextResizeHandles && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.text-resize.left.handle\"\n\t\t\t\t\t\t\tclassName=\"tl-text-handle\"\n\t\t\t\t\t\t\tx={toDomPrecision(0 - size / 4)}\n\t\t\t\t\t\t\ty={toDomPrecision(height / 2 - textHandleHeight / 2)}\n\t\t\t\t\t\t\trx={size / 4}\n\t\t\t\t\t\t\twidth={toDomPrecision(size / 2)}\n\t\t\t\t\t\t\theight={toDomPrecision(textHandleHeight)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.text-resize.right.handle\"\n\t\t\t\t\t\t\tclassName=\"tl-text-handle\"\n\t\t\t\t\t\t\trx={size / 4}\n\t\t\t\t\t\t\tx={toDomPrecision(width - size / 4)}\n\t\t\t\t\t\t\ty={toDomPrecision(height / 2 - textHandleHeight / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size / 2)}\n\t\t\t\t\t\t\theight={toDomPrecision(textHandleHeight)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t\t{/* Crop Handles */}\n\t\t\t\t{showCropHandles && (\n\t\t\t\t\t<TldrawCropHandles\n\t\t\t\t\t\t{...{\n\t\t\t\t\t\t\tsize,\n\t\t\t\t\t\t\twidth,\n\t\t\t\t\t\t\theight,\n\t\t\t\t\t\t\thideAlternateHandles: hideAlternateCropHandles,\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</g>\n\t\t</svg>\n\t)\n})\n\nexport const ResizeHandle = function ResizeHandle({\n\thide,\n\tdataTestId,\n\tariaLabel,\n\tx,\n\ty,\n\twidth,\n\theight,\n\tcursor,\n\tevents,\n}: {\n\thide: boolean\n\tdataTestId: string\n\tariaLabel: string\n\tx: number\n\ty: number\n\twidth: number\n\theight: number\n\tcursor?: string\n\tevents: {\n\t\tonPointerUp: PointerEventHandler<Element>\n\t\tonPointerMove(e: React.PointerEvent<Element>): void\n\t\tonPointerDown: PointerEventHandler<Element>\n\t}\n}) {\n\treturn (\n\t\t<rect\n\t\t\tclassName={classNames('tl-resize-handle', 'tl-transparent', {\n\t\t\t\t'tl-hidden': hide,\n\t\t\t})}\n\t\t\tdata-testid={dataTestId}\n\t\t\trole=\"button\"\n\t\t\taria-label={ariaLabel}\n\t\t\tpointerEvents=\"all\"\n\t\t\tx={x}\n\t\t\ty={y}\n\t\t\twidth={width}\n\t\t\theight={height}\n\t\t\tcursor={cursor}\n\t\t\t{...events}\n\t\t/>\n\t)\n}\n\nexport const RotateCornerHandle = function RotateCornerHandle({\n\tcx,\n\tcy,\n\ttargetSize,\n\tcorner,\n\tcursor,\n\tisHidden,\n\t'data-testid': testId,\n}: {\n\tcx: number\n\tcy: number\n\ttargetSize: number\n\tcorner: RotateCorner\n\tcursor?: string\n\tisHidden: boolean\n\t'data-testid'?: string\n}) {\n\tconst events = useSelectionEvents(corner)\n\tconst msg = useTranslation()\n\tconst label = msg(`handle.rotate.${corner}`)\n\n\treturn (\n\t\t<rect\n\t\t\tclassName={classNames('tl-transparent', 'tl-rotate-corner', { 'tl-hidden': isHidden })}\n\t\t\tdata-testid={testId}\n\t\t\trole=\"button\"\n\t\t\taria-label={label}\n\t\t\tpointerEvents=\"all\"\n\t\t\tx={toDomPrecision(cx - targetSize * 3)}\n\t\t\ty={toDomPrecision(cy - targetSize * 3)}\n\t\t\twidth={toDomPrecision(Math.max(1, targetSize * 3))}\n\t\t\theight={toDomPrecision(Math.max(1, targetSize * 3))}\n\t\t\tcursor={cursor}\n\t\t\t{...events}\n\t\t/>\n\t)\n}\n\nconst SQUARE_ROOT_PI = Math.sqrt(Math.PI)\n\nexport const MobileRotateHandle = function RotateHandle({\n\tcx,\n\tcy,\n\tsize,\n\tisHidden,\n\t'data-testid': testId,\n}: {\n\tcx: number\n\tcy: number\n\tsize: number\n\tisHidden: boolean\n\t'data-testid'?: string\n}) {\n\tconst events = useSelectionEvents('mobile_rotate')\n\n\tconst editor = useEditor()\n\tconst zoom = useValue('zoom level', () => editor.getZoomLevel(), [editor])\n\tconst bgRadius = Math.max(14 * (1 / zoom), 20 / Math.max(1, zoom))\n\tconst msg = useTranslation()\n\treturn (\n\t\t<g role=\"button\" aria-label={msg('handle.rotate.mobile_rotate')}>\n\t\t\t<circle\n\t\t\t\tdata-testid={testId}\n\t\t\t\tpointerEvents=\"all\"\n\t\t\t\tclassName={classNames('tl-transparent', 'tl-mobile-rotate__bg', { 'tl-hidden': isHidden })}\n\t\t\t\tcx={cx}\n\t\t\t\tcy={cy}\n\t\t\t\tr={bgRadius}\n\t\t\t\t{...events}\n\t\t\t/>\n\t\t\t<circle\n\t\t\t\tclassName={classNames('tl-mobile-rotate__fg', { 'tl-hidden': isHidden })}\n\t\t\t\tcx={cx}\n\t\t\t\tcy={cy}\n\t\t\t\tr={size / SQUARE_ROOT_PI}\n\t\t\t/>\n\t\t</g>\n\t)\n}\n"],
+  "mappings": "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",
   "names": ["TldrawSelectionForeground", "classNames", "ResizeHandle", "RotateCornerHandle"]
 }

package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js

@@ -82,7 +82,8 @@ function TldrawUiMenuItem({
           children: [
             iconLeft && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiButtonIcon.TldrawUiButtonIcon, { icon: iconLeft, small: true }),
             /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiButtonLabel.TldrawUiButtonLabel, { children: labelStr }),
-            kbd && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiKbd.TldrawUiKbd, { children: kbd })
+            kbd && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiKbd.TldrawUiKbd, { children: kbd }),
+            icon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiButtonIcon.TldrawUiButtonIcon, { icon, small: true })
           ]
         }
       ) });

package/dist-cjs/lib/ui/components/primitives/menus/TldrawUiMenuItem.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/lib/ui/components/primitives/menus/TldrawUiMenuItem.tsx"],
-  "sourcesContent": ["import {\n\texhaustiveSwitchError,\n\tgetPointerInfo,\n\tpreventDefault,\n\tTLPointerEventInfo,\n\tuseEditor,\n\tVec,\n\tVecModel,\n} from '@tldraw/editor'\nimport { ContextMenu as _ContextMenu } from 'radix-ui'\nimport { useMemo, useState } from 'react'\nimport { unwrapLabel } from '../../../context/actions'\nimport { TLUiEventSource } from '../../../context/events'\nimport { useReadonly } from '../../../hooks/useReadonly'\nimport { TLUiToolItem } from '../../../hooks/useTools'\nimport { TLUiTranslationKey } from '../../../hooks/useTranslation/TLUiTranslationKey'\nimport { useTranslation } from '../../../hooks/useTranslation/useTranslation'\nimport { kbdStr } from '../../../kbd-utils'\nimport { Spinner } from '../../Spinner'\nimport { TldrawUiButton } from '../Button/TldrawUiButton'\nimport { TldrawUiButtonIcon } from '../Button/TldrawUiButtonIcon'\nimport { TldrawUiButtonLabel } from '../Button/TldrawUiButtonLabel'\nimport { TldrawUiDropdownMenuItem } from '../TldrawUiDropdownMenu'\nimport { TLUiIconJsx } from '../TldrawUiIcon'\nimport { TldrawUiKbd } from '../TldrawUiKbd'\nimport { TldrawUiToolbarButton } from '../TldrawUiToolbar'\nimport { tooltipManager } from '../TldrawUiTooltip'\nimport { useTldrawUiMenuContext } from './TldrawUiMenuContext'\n\n/** @public */\nexport interface TLUiMenuItemProps<\n\tTranslationKey extends string = string,\n\tIconType extends string = string,\n> {\n\tid: string\n\t/**\n\t * The icon to display on the item. Icons are only shown in certain menu types.\n\t */\n\ticon?: IconType | TLUiIconJsx\n\t/**\n\t * An icon to display to the left of the menu item.\n\t */\n\ticonLeft?: IconType | TLUiIconJsx\n\t/**\n\t * The keyboard shortcut to display on the item.\n\t */\n\tkbd?: string\n\t/**\n\t * The label to display on the item. If it's a string, it will be translated. If it's an object, the keys will be used as the language keys and the values will be translated.\n\t */\n\tlabel?: TranslationKey | { [key: string]: TranslationKey }\n\t/**\n\t * If the editor is in readonly mode and the item is not marked as readonlyok, it will not be rendered.\n\t */\n\treadonlyOk?: boolean\n\t/**\n\t * The function to call when the item is clicked.\n\t */\n\tonSelect(source: TLUiEventSource): Promise<void> | void\n\t/**\n\t * Whether this item should be disabled.\n\t */\n\tdisabled?: boolean\n\t/**\n\t * Prevent the menu from closing when the item is clicked\n\t */\n\tnoClose?: boolean\n\t/**\n\t * Whether to show a spinner on the item.\n\t */\n\tspinner?: boolean\n\t/**\n\t * Whether the item is selected.\n\t */\n\tisSelected?: boolean\n\t/**\n\t * The function to call when the item is dragged. If this is provided, the item will be draggable.\n\t */\n\tonDragStart?(source: TLUiEventSource, info: TLPointerEventInfo): void\n}\n\n/** @public @react */\nexport function TldrawUiMenuItem<\n\tTranslationKey extends string = string,\n\tIconType extends string = string,\n>({\n\tdisabled = false,\n\tspinner = false,\n\treadonlyOk = false,\n\tid,\n\tkbd,\n\tlabel,\n\ticon,\n\ticonLeft,\n\tonSelect,\n\tnoClose,\n\tisSelected,\n\tonDragStart,\n}: TLUiMenuItemProps<TranslationKey, IconType>) {\n\tconst { type: menuType, sourceId } = useTldrawUiMenuContext()\n\n\tconst msg = useTranslation()\n\n\tconst [disableClicks, setDisableClicks] = useState(false)\n\n\tconst isReadonlyMode = useReadonly()\n\tif (isReadonlyMode && !readonlyOk) return null\n\n\tconst labelToUse = unwrapLabel(label, menuType)\n\tconst kbdToUse = kbd ? kbdStr(kbd) : undefined\n\n\tconst labelStr = labelToUse ? msg(labelToUse as TLUiTranslationKey) : undefined\n\tconst titleStr = labelStr && kbdToUse ? `${labelStr} ${kbdToUse}` : labelStr\n\n\tswitch (menuType) {\n\t\tcase 'menu': {\n\t\t\treturn (\n\t\t\t\t<TldrawUiDropdownMenuItem>\n\t\t\t\t\t<TldrawUiButton\n\t\t\t\t\t\ttype=\"menu\"\n\t\t\t\t\t\tdata-testid={`${sourceId}.${id}`}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\tif (noClose) {\n\t\t\t\t\t\t\t\tpreventDefault(e)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif (disableClicks) {\n\t\t\t\t\t\t\t\tsetDisableClicks(false)\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tonSelect(sourceId)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{iconLeft && <TldrawUiButtonIcon icon={iconLeft} small />}\n\t\t\t\t\t\t<TldrawUiButtonLabel>{labelStr}</TldrawUiButtonLabel>\n\t\t\t\t\t\t{kbd && <TldrawUiKbd>{kbd}</TldrawUiKbd>}\n\t\t\t\t\t</TldrawUiButton>\n\t\t\t\t</TldrawUiDropdownMenuItem>\n\t\t\t)\n\t\t}\n\t\tcase 'context-menu': {\n\t\t\t// Hide disabled context menu items\n\t\t\tif (disabled) return null\n\n\t\t\treturn (\n\t\t\t\t<_ContextMenu.Item\n\t\t\t\t\tdir=\"ltr\"\n\t\t\t\t\tdraggable={false}\n\t\t\t\t\tclassName=\"tlui-button tlui-button__menu\"\n\t\t\t\t\tdata-testid={`${sourceId}.${id}`}\n\t\t\t\t\tonSelect={(e) => {\n\t\t\t\t\t\tif (noClose) preventDefault(e)\n\t\t\t\t\t\tif (disableClicks) {\n\t\t\t\t\t\t\tsetDisableClicks(false)\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tonSelect(sourceId)\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<span className=\"tlui-button__label\" draggable={false}>\n\t\t\t\t\t\t{labelStr}\n\t\t\t\t\t</span>\n\t\t\t\t\t{iconLeft && <TldrawUiButtonIcon icon={iconLeft} small />}\n\t\t\t\t\t{kbd && <TldrawUiKbd>{kbd}</TldrawUiKbd>}\n\t\t\t\t\t{spinner && <Spinner />}\n\t\t\t\t</_ContextMenu.Item>\n\t\t\t)\n\t\t}\n\t\tcase 'small-icons':\n\t\tcase 'icons': {\n\t\t\treturn (\n\t\t\t\t<TldrawUiToolbarButton\n\t\t\t\t\tdata-testid={`${sourceId}.${id}`}\n\t\t\t\t\ttype=\"icon\"\n\t\t\t\t\ttitle={titleStr}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={() => onSelect(sourceId)}\n\t\t\t\t>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} small />\n\t\t\t\t</TldrawUiToolbarButton>\n\t\t\t)\n\t\t}\n\t\tcase 'keyboard-shortcuts': {\n\t\t\tif (!kbd) {\n\t\t\t\tconsole.warn(\n\t\t\t\t\t`Menu item '${label}' isn't shown in the keyboard shortcuts dialog because it doesn't have a keyboard shortcut.`\n\t\t\t\t)\n\t\t\t\treturn null\n\t\t\t}\n\n\t\t\treturn (\n\t\t\t\t<div className=\"tlui-shortcuts-dialog__key-pair\" data-testid={`${sourceId}.${id}`}>\n\t\t\t\t\t<div className=\"tlui-shortcuts-dialog__key-pair__key\">{labelStr}</div>\n\t\t\t\t\t<div className=\"tlui-shortcuts-dialog__key-pair__value\">\n\t\t\t\t\t\t<TldrawUiKbd visibleOnMobileLayout>{kbd}</TldrawUiKbd>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t)\n\t\t}\n\t\tcase 'helper-buttons': {\n\t\t\treturn (\n\t\t\t\t<TldrawUiButton type=\"low\" onClick={() => onSelect(sourceId)}>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t\t\t<TldrawUiButtonLabel>{labelStr}</TldrawUiButtonLabel>\n\t\t\t\t</TldrawUiButton>\n\t\t\t)\n\t\t}\n\t\tcase 'toolbar': {\n\t\t\tif (onDragStart) {\n\t\t\t\treturn (\n\t\t\t\t\t<DraggableToolbarButton\n\t\t\t\t\t\tid={id}\n\t\t\t\t\t\ticon={icon}\n\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\tonDragStart={onDragStart}\n\t\t\t\t\t\tlabelStr={labelStr}\n\t\t\t\t\t\ttitleStr={titleStr}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t}\n\t\t\treturn (\n\t\t\t\t<TldrawUiToolbarButton\n\t\t\t\t\taria-label={labelStr}\n\t\t\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\t\t\tdata-testid={`tools.${id}`}\n\t\t\t\t\tdata-value={id}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={() => onSelect('toolbar')}\n\t\t\t\t\tonTouchStart={(e) => {\n\t\t\t\t\t\tpreventDefault(e)\n\t\t\t\t\t\tonSelect('toolbar')\n\t\t\t\t\t}}\n\t\t\t\t\ttitle={titleStr}\n\t\t\t\t\ttype=\"tool\"\n\t\t\t\t>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t\t</TldrawUiToolbarButton>\n\t\t\t)\n\t\t}\n\t\tcase 'toolbar-overflow': {\n\t\t\tif (onDragStart) {\n\t\t\t\treturn (\n\t\t\t\t\t<DraggableToolbarButton\n\t\t\t\t\t\tid={id}\n\t\t\t\t\t\ticon={icon}\n\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\tonDragStart={onDragStart}\n\t\t\t\t\t\tlabelStr={labelStr}\n\t\t\t\t\t\ttitleStr={titleStr}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t\toverflow\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t}\n\t\t\treturn (\n\t\t\t\t<TldrawUiToolbarButton\n\t\t\t\t\taria-label={labelStr}\n\t\t\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\t\t\tisActive={isSelected}\n\t\t\t\t\tdata-testid={`tools.more.${id}`}\n\t\t\t\t\tdata-value={id}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={() => onSelect('toolbar')}\n\t\t\t\t\ttitle={titleStr}\n\t\t\t\t\ttype=\"icon\"\n\t\t\t\t>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t\t</TldrawUiToolbarButton>\n\t\t\t)\n\t\t}\n\t\tdefault: {\n\t\t\tthrow exhaustiveSwitchError(menuType)\n\t\t}\n\t}\n}\n\nfunction useDraggableEvents(\n\tonDragStart: TLUiToolItem['onDragStart'],\n\tonSelect: TLUiToolItem['onSelect']\n) {\n\tconst editor = useEditor()\n\tconst events = useMemo(() => {\n\t\tlet state = { name: 'idle' } as\n\t\t\t| {\n\t\t\t\t\tname: 'idle'\n\t\t\t  }\n\t\t\t| {\n\t\t\t\t\tname: 'pointing'\n\t\t\t\t\tscreenSpaceStart: VecModel\n\t\t\t  }\n\t\t\t| {\n\t\t\t\t\tname: 'dragging'\n\t\t\t\t\tscreenSpaceStart: VecModel\n\t\t\t  }\n\t\t\t| {\n\t\t\t\t\tname: 'dragged'\n\t\t\t  }\n\n\t\tfunction handlePointerDown(e: React.PointerEvent<HTMLButtonElement>) {\n\t\t\tstate = {\n\t\t\t\tname: 'pointing',\n\t\t\t\tscreenSpaceStart: { x: e.clientX, y: e.clientY },\n\t\t\t}\n\n\t\t\te.currentTarget.setPointerCapture(e.pointerId)\n\t\t}\n\n\t\tfunction handlePointerMove(e: React.PointerEvent<HTMLButtonElement>) {\n\t\t\tif ((e as any).isSpecialRedispatchedEvent) return\n\n\t\t\tif (state.name === 'pointing') {\n\t\t\t\tconst distanceSq = Vec.Dist2(state.screenSpaceStart, { x: e.clientX, y: e.clientY })\n\t\t\t\tif (\n\t\t\t\t\tdistanceSq >\n\t\t\t\t\t(editor.getInstanceState().isCoarsePointer\n\t\t\t\t\t\t? editor.options.uiCoarseDragDistanceSquared\n\t\t\t\t\t\t: editor.options.uiDragDistanceSquared)\n\t\t\t\t) {\n\t\t\t\t\tconst screenSpaceStart = state.screenSpaceStart\n\t\t\t\t\tstate = {\n\t\t\t\t\t\tname: 'dragging',\n\t\t\t\t\t\tscreenSpaceStart,\n\t\t\t\t\t}\n\n\t\t\t\t\teditor.run(() => {\n\t\t\t\t\t\teditor.setCurrentTool('select')\n\n\t\t\t\t\t\t// Set origin point\n\t\t\t\t\t\teditor.dispatch({\n\t\t\t\t\t\t\ttype: 'pointer',\n\t\t\t\t\t\t\ttarget: 'canvas',\n\t\t\t\t\t\t\tname: 'pointer_down',\n\t\t\t\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t\t\t\t\tpoint: screenSpaceStart,\n\t\t\t\t\t\t})\n\n\t\t\t\t\t\t// Pointer down potentially selects shapes, so we need to deselect them.\n\t\t\t\t\t\teditor.selectNone()\n\n\t\t\t\t\t\t// start drag\n\t\t\t\t\t\tonDragStart?.('toolbar', {\n\t\t\t\t\t\t\ttype: 'pointer',\n\t\t\t\t\t\t\ttarget: 'canvas',\n\t\t\t\t\t\t\tname: 'pointer_move',\n\t\t\t\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t\t\t\t\tpoint: screenSpaceStart,\n\t\t\t\t\t\t})\n\n\t\t\t\t\t\ttooltipManager.hideAllTooltips()\n\t\t\t\t\t\teditor.getContainer().focus()\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tfunction handlePointerUp(e: React.PointerEvent<HTMLButtonElement>) {\n\t\t\tif ((e as any).isSpecialRedispatchedEvent) return\n\n\t\t\te.currentTarget.releasePointerCapture(e.pointerId)\n\n\t\t\teditor.dispatch({\n\t\t\t\ttype: 'pointer',\n\t\t\t\ttarget: 'canvas',\n\t\t\t\tname: 'pointer_up',\n\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t})\n\t\t}\n\n\t\tfunction handleClick() {\n\t\t\tif (state.name === 'dragging' || state.name === 'dragged') {\n\t\t\t\tstate = { name: 'idle' }\n\t\t\t\treturn true\n\t\t\t}\n\n\t\t\tstate = { name: 'idle' }\n\t\t\tonSelect?.('toolbar')\n\t\t}\n\n\t\treturn {\n\t\t\tonPointerDown: handlePointerDown,\n\t\t\tonPointerMove: handlePointerMove,\n\t\t\tonPointerUp: handlePointerUp,\n\t\t\tonClick: handleClick,\n\t\t}\n\t}, [onDragStart, editor, onSelect])\n\n\treturn events\n}\n\nfunction DraggableToolbarButton({\n\tid,\n\tlabelStr,\n\ttitleStr,\n\tdisabled,\n\tisSelected,\n\ticon,\n\tonSelect,\n\tonDragStart,\n\toverflow,\n}: {\n\tid: string\n\tdisabled: boolean\n\tlabelStr?: string\n\ttitleStr?: string\n\tisSelected?: boolean\n\ticon: TLUiMenuItemProps['icon']\n\tonSelect: TLUiMenuItemProps['onSelect']\n\tonDragStart: TLUiMenuItemProps['onDragStart']\n\toverflow?: boolean\n}) {\n\tconst events = useDraggableEvents(onDragStart, onSelect)\n\n\tif (overflow) {\n\t\treturn (\n\t\t\t<TldrawUiToolbarButton\n\t\t\t\taria-label={labelStr}\n\t\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\t\tisActive={isSelected}\n\t\t\t\tclassName=\"tlui-button-grid__button\"\n\t\t\t\tdata-testid={`tools.more.${id}`}\n\t\t\t\tdata-value={id}\n\t\t\t\tdisabled={disabled}\n\t\t\t\ttitle={titleStr}\n\t\t\t\ttype=\"icon\"\n\t\t\t\t{...events}\n\t\t\t>\n\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t</TldrawUiToolbarButton>\n\t\t)\n\t}\n\n\treturn (\n\t\t<TldrawUiToolbarButton\n\t\t\taria-label={labelStr}\n\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\tdata-testid={`tools.${id}`}\n\t\t\tdata-value={id}\n\t\t\tdisabled={disabled}\n\t\t\tonTouchStart={(e) => {\n\t\t\t\tpreventDefault(e)\n\t\t\t\tonSelect('toolbar')\n\t\t\t}}\n\t\t\ttitle={titleStr}\n\t\t\ttype=\"tool\"\n\t\t\t{...events}\n\t\t>\n\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t</TldrawUiToolbarButton>\n\t)\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\texhaustiveSwitchError,\n\tgetPointerInfo,\n\tpreventDefault,\n\tTLPointerEventInfo,\n\tuseEditor,\n\tVec,\n\tVecModel,\n} from '@tldraw/editor'\nimport { ContextMenu as _ContextMenu } from 'radix-ui'\nimport { useMemo, useState } from 'react'\nimport { unwrapLabel } from '../../../context/actions'\nimport { TLUiEventSource } from '../../../context/events'\nimport { useReadonly } from '../../../hooks/useReadonly'\nimport { TLUiToolItem } from '../../../hooks/useTools'\nimport { TLUiTranslationKey } from '../../../hooks/useTranslation/TLUiTranslationKey'\nimport { useTranslation } from '../../../hooks/useTranslation/useTranslation'\nimport { kbdStr } from '../../../kbd-utils'\nimport { Spinner } from '../../Spinner'\nimport { TldrawUiButton } from '../Button/TldrawUiButton'\nimport { TldrawUiButtonIcon } from '../Button/TldrawUiButtonIcon'\nimport { TldrawUiButtonLabel } from '../Button/TldrawUiButtonLabel'\nimport { TldrawUiDropdownMenuItem } from '../TldrawUiDropdownMenu'\nimport { TLUiIconJsx } from '../TldrawUiIcon'\nimport { TldrawUiKbd } from '../TldrawUiKbd'\nimport { TldrawUiToolbarButton } from '../TldrawUiToolbar'\nimport { tooltipManager } from '../TldrawUiTooltip'\nimport { useTldrawUiMenuContext } from './TldrawUiMenuContext'\n\n/** @public */\nexport interface TLUiMenuItemProps<\n\tTranslationKey extends string = string,\n\tIconType extends string = string,\n> {\n\tid: string\n\t/**\n\t * The icon to display on the item. Icons are only shown in certain menu types.\n\t */\n\ticon?: IconType | TLUiIconJsx\n\t/**\n\t * An icon to display to the left of the menu item.\n\t */\n\ticonLeft?: IconType | TLUiIconJsx\n\t/**\n\t * The keyboard shortcut to display on the item.\n\t */\n\tkbd?: string\n\t/**\n\t * The label to display on the item. If it's a string, it will be translated. If it's an object, the keys will be used as the language keys and the values will be translated.\n\t */\n\tlabel?: TranslationKey | { [key: string]: TranslationKey }\n\t/**\n\t * If the editor is in readonly mode and the item is not marked as readonlyok, it will not be rendered.\n\t */\n\treadonlyOk?: boolean\n\t/**\n\t * The function to call when the item is clicked.\n\t */\n\tonSelect(source: TLUiEventSource): Promise<void> | void\n\t/**\n\t * Whether this item should be disabled.\n\t */\n\tdisabled?: boolean\n\t/**\n\t * Prevent the menu from closing when the item is clicked\n\t */\n\tnoClose?: boolean\n\t/**\n\t * Whether to show a spinner on the item.\n\t */\n\tspinner?: boolean\n\t/**\n\t * Whether the item is selected.\n\t */\n\tisSelected?: boolean\n\t/**\n\t * The function to call when the item is dragged. If this is provided, the item will be draggable.\n\t */\n\tonDragStart?(source: TLUiEventSource, info: TLPointerEventInfo): void\n}\n\n/** @public @react */\nexport function TldrawUiMenuItem<\n\tTranslationKey extends string = string,\n\tIconType extends string = string,\n>({\n\tdisabled = false,\n\tspinner = false,\n\treadonlyOk = false,\n\tid,\n\tkbd,\n\tlabel,\n\ticon,\n\ticonLeft,\n\tonSelect,\n\tnoClose,\n\tisSelected,\n\tonDragStart,\n}: TLUiMenuItemProps<TranslationKey, IconType>) {\n\tconst { type: menuType, sourceId } = useTldrawUiMenuContext()\n\n\tconst msg = useTranslation()\n\n\tconst [disableClicks, setDisableClicks] = useState(false)\n\n\tconst isReadonlyMode = useReadonly()\n\tif (isReadonlyMode && !readonlyOk) return null\n\n\tconst labelToUse = unwrapLabel(label, menuType)\n\tconst kbdToUse = kbd ? kbdStr(kbd) : undefined\n\n\tconst labelStr = labelToUse ? msg(labelToUse as TLUiTranslationKey) : undefined\n\tconst titleStr = labelStr && kbdToUse ? `${labelStr} ${kbdToUse}` : labelStr\n\n\tswitch (menuType) {\n\t\tcase 'menu': {\n\t\t\treturn (\n\t\t\t\t<TldrawUiDropdownMenuItem>\n\t\t\t\t\t<TldrawUiButton\n\t\t\t\t\t\ttype=\"menu\"\n\t\t\t\t\t\tdata-testid={`${sourceId}.${id}`}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\tif (noClose) {\n\t\t\t\t\t\t\t\tpreventDefault(e)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif (disableClicks) {\n\t\t\t\t\t\t\t\tsetDisableClicks(false)\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tonSelect(sourceId)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{iconLeft && <TldrawUiButtonIcon icon={iconLeft} small />}\n\t\t\t\t\t\t<TldrawUiButtonLabel>{labelStr}</TldrawUiButtonLabel>\n\t\t\t\t\t\t{kbd && <TldrawUiKbd>{kbd}</TldrawUiKbd>}\n\t\t\t\t\t\t{icon && <TldrawUiButtonIcon icon={icon} small />}\n\t\t\t\t\t</TldrawUiButton>\n\t\t\t\t</TldrawUiDropdownMenuItem>\n\t\t\t)\n\t\t}\n\t\tcase 'context-menu': {\n\t\t\t// Hide disabled context menu items\n\t\t\tif (disabled) return null\n\n\t\t\treturn (\n\t\t\t\t<_ContextMenu.Item\n\t\t\t\t\tdir=\"ltr\"\n\t\t\t\t\tdraggable={false}\n\t\t\t\t\tclassName=\"tlui-button tlui-button__menu\"\n\t\t\t\t\tdata-testid={`${sourceId}.${id}`}\n\t\t\t\t\tonSelect={(e) => {\n\t\t\t\t\t\tif (noClose) preventDefault(e)\n\t\t\t\t\t\tif (disableClicks) {\n\t\t\t\t\t\t\tsetDisableClicks(false)\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tonSelect(sourceId)\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<span className=\"tlui-button__label\" draggable={false}>\n\t\t\t\t\t\t{labelStr}\n\t\t\t\t\t</span>\n\t\t\t\t\t{iconLeft && <TldrawUiButtonIcon icon={iconLeft} small />}\n\t\t\t\t\t{kbd && <TldrawUiKbd>{kbd}</TldrawUiKbd>}\n\t\t\t\t\t{spinner && <Spinner />}\n\t\t\t\t</_ContextMenu.Item>\n\t\t\t)\n\t\t}\n\t\tcase 'small-icons':\n\t\tcase 'icons': {\n\t\t\treturn (\n\t\t\t\t<TldrawUiToolbarButton\n\t\t\t\t\tdata-testid={`${sourceId}.${id}`}\n\t\t\t\t\ttype=\"icon\"\n\t\t\t\t\ttitle={titleStr}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={() => onSelect(sourceId)}\n\t\t\t\t>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} small />\n\t\t\t\t</TldrawUiToolbarButton>\n\t\t\t)\n\t\t}\n\t\tcase 'keyboard-shortcuts': {\n\t\t\tif (!kbd) {\n\t\t\t\tconsole.warn(\n\t\t\t\t\t`Menu item '${label}' isn't shown in the keyboard shortcuts dialog because it doesn't have a keyboard shortcut.`\n\t\t\t\t)\n\t\t\t\treturn null\n\t\t\t}\n\n\t\t\treturn (\n\t\t\t\t<div className=\"tlui-shortcuts-dialog__key-pair\" data-testid={`${sourceId}.${id}`}>\n\t\t\t\t\t<div className=\"tlui-shortcuts-dialog__key-pair__key\">{labelStr}</div>\n\t\t\t\t\t<div className=\"tlui-shortcuts-dialog__key-pair__value\">\n\t\t\t\t\t\t<TldrawUiKbd visibleOnMobileLayout>{kbd}</TldrawUiKbd>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t)\n\t\t}\n\t\tcase 'helper-buttons': {\n\t\t\treturn (\n\t\t\t\t<TldrawUiButton type=\"low\" onClick={() => onSelect(sourceId)}>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t\t\t<TldrawUiButtonLabel>{labelStr}</TldrawUiButtonLabel>\n\t\t\t\t</TldrawUiButton>\n\t\t\t)\n\t\t}\n\t\tcase 'toolbar': {\n\t\t\tif (onDragStart) {\n\t\t\t\treturn (\n\t\t\t\t\t<DraggableToolbarButton\n\t\t\t\t\t\tid={id}\n\t\t\t\t\t\ticon={icon}\n\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\tonDragStart={onDragStart}\n\t\t\t\t\t\tlabelStr={labelStr}\n\t\t\t\t\t\ttitleStr={titleStr}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t}\n\t\t\treturn (\n\t\t\t\t<TldrawUiToolbarButton\n\t\t\t\t\taria-label={labelStr}\n\t\t\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\t\t\tdata-testid={`tools.${id}`}\n\t\t\t\t\tdata-value={id}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={() => onSelect('toolbar')}\n\t\t\t\t\tonTouchStart={(e) => {\n\t\t\t\t\t\tpreventDefault(e)\n\t\t\t\t\t\tonSelect('toolbar')\n\t\t\t\t\t}}\n\t\t\t\t\ttitle={titleStr}\n\t\t\t\t\ttype=\"tool\"\n\t\t\t\t>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t\t</TldrawUiToolbarButton>\n\t\t\t)\n\t\t}\n\t\tcase 'toolbar-overflow': {\n\t\t\tif (onDragStart) {\n\t\t\t\treturn (\n\t\t\t\t\t<DraggableToolbarButton\n\t\t\t\t\t\tid={id}\n\t\t\t\t\t\ticon={icon}\n\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\tonDragStart={onDragStart}\n\t\t\t\t\t\tlabelStr={labelStr}\n\t\t\t\t\t\ttitleStr={titleStr}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t\toverflow\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t}\n\t\t\treturn (\n\t\t\t\t<TldrawUiToolbarButton\n\t\t\t\t\taria-label={labelStr}\n\t\t\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\t\t\tisActive={isSelected}\n\t\t\t\t\tdata-testid={`tools.more.${id}`}\n\t\t\t\t\tdata-value={id}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={() => onSelect('toolbar')}\n\t\t\t\t\ttitle={titleStr}\n\t\t\t\t\ttype=\"icon\"\n\t\t\t\t>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t\t</TldrawUiToolbarButton>\n\t\t\t)\n\t\t}\n\t\tdefault: {\n\t\t\tthrow exhaustiveSwitchError(menuType)\n\t\t}\n\t}\n}\n\nfunction useDraggableEvents(\n\tonDragStart: TLUiToolItem['onDragStart'],\n\tonSelect: TLUiToolItem['onSelect']\n) {\n\tconst editor = useEditor()\n\tconst events = useMemo(() => {\n\t\tlet state = { name: 'idle' } as\n\t\t\t| {\n\t\t\t\t\tname: 'idle'\n\t\t\t  }\n\t\t\t| {\n\t\t\t\t\tname: 'pointing'\n\t\t\t\t\tscreenSpaceStart: VecModel\n\t\t\t  }\n\t\t\t| {\n\t\t\t\t\tname: 'dragging'\n\t\t\t\t\tscreenSpaceStart: VecModel\n\t\t\t  }\n\t\t\t| {\n\t\t\t\t\tname: 'dragged'\n\t\t\t  }\n\n\t\tfunction handlePointerDown(e: React.PointerEvent<HTMLButtonElement>) {\n\t\t\tstate = {\n\t\t\t\tname: 'pointing',\n\t\t\t\tscreenSpaceStart: { x: e.clientX, y: e.clientY },\n\t\t\t}\n\n\t\t\te.currentTarget.setPointerCapture(e.pointerId)\n\t\t}\n\n\t\tfunction handlePointerMove(e: React.PointerEvent<HTMLButtonElement>) {\n\t\t\tif ((e as any).isSpecialRedispatchedEvent) return\n\n\t\t\tif (state.name === 'pointing') {\n\t\t\t\tconst distanceSq = Vec.Dist2(state.screenSpaceStart, { x: e.clientX, y: e.clientY })\n\t\t\t\tif (\n\t\t\t\t\tdistanceSq >\n\t\t\t\t\t(editor.getInstanceState().isCoarsePointer\n\t\t\t\t\t\t? editor.options.uiCoarseDragDistanceSquared\n\t\t\t\t\t\t: editor.options.uiDragDistanceSquared)\n\t\t\t\t) {\n\t\t\t\t\tconst screenSpaceStart = state.screenSpaceStart\n\t\t\t\t\tstate = {\n\t\t\t\t\t\tname: 'dragging',\n\t\t\t\t\t\tscreenSpaceStart,\n\t\t\t\t\t}\n\n\t\t\t\t\teditor.run(() => {\n\t\t\t\t\t\teditor.setCurrentTool('select')\n\n\t\t\t\t\t\t// Set origin point\n\t\t\t\t\t\teditor.dispatch({\n\t\t\t\t\t\t\ttype: 'pointer',\n\t\t\t\t\t\t\ttarget: 'canvas',\n\t\t\t\t\t\t\tname: 'pointer_down',\n\t\t\t\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t\t\t\t\tpoint: screenSpaceStart,\n\t\t\t\t\t\t})\n\n\t\t\t\t\t\t// Pointer down potentially selects shapes, so we need to deselect them.\n\t\t\t\t\t\teditor.selectNone()\n\n\t\t\t\t\t\t// start drag\n\t\t\t\t\t\tonDragStart?.('toolbar', {\n\t\t\t\t\t\t\ttype: 'pointer',\n\t\t\t\t\t\t\ttarget: 'canvas',\n\t\t\t\t\t\t\tname: 'pointer_move',\n\t\t\t\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t\t\t\t\tpoint: screenSpaceStart,\n\t\t\t\t\t\t})\n\n\t\t\t\t\t\ttooltipManager.hideAllTooltips()\n\t\t\t\t\t\teditor.getContainer().focus()\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tfunction handlePointerUp(e: React.PointerEvent<HTMLButtonElement>) {\n\t\t\tif ((e as any).isSpecialRedispatchedEvent) return\n\n\t\t\te.currentTarget.releasePointerCapture(e.pointerId)\n\n\t\t\teditor.dispatch({\n\t\t\t\ttype: 'pointer',\n\t\t\t\ttarget: 'canvas',\n\t\t\t\tname: 'pointer_up',\n\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t})\n\t\t}\n\n\t\tfunction handleClick() {\n\t\t\tif (state.name === 'dragging' || state.name === 'dragged') {\n\t\t\t\tstate = { name: 'idle' }\n\t\t\t\treturn true\n\t\t\t}\n\n\t\t\tstate = { name: 'idle' }\n\t\t\tonSelect?.('toolbar')\n\t\t}\n\n\t\treturn {\n\t\t\tonPointerDown: handlePointerDown,\n\t\t\tonPointerMove: handlePointerMove,\n\t\t\tonPointerUp: handlePointerUp,\n\t\t\tonClick: handleClick,\n\t\t}\n\t}, [onDragStart, editor, onSelect])\n\n\treturn events\n}\n\nfunction DraggableToolbarButton({\n\tid,\n\tlabelStr,\n\ttitleStr,\n\tdisabled,\n\tisSelected,\n\ticon,\n\tonSelect,\n\tonDragStart,\n\toverflow,\n}: {\n\tid: string\n\tdisabled: boolean\n\tlabelStr?: string\n\ttitleStr?: string\n\tisSelected?: boolean\n\ticon: TLUiMenuItemProps['icon']\n\tonSelect: TLUiMenuItemProps['onSelect']\n\tonDragStart: TLUiMenuItemProps['onDragStart']\n\toverflow?: boolean\n}) {\n\tconst events = useDraggableEvents(onDragStart, onSelect)\n\n\tif (overflow) {\n\t\treturn (\n\t\t\t<TldrawUiToolbarButton\n\t\t\t\taria-label={labelStr}\n\t\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\t\tisActive={isSelected}\n\t\t\t\tclassName=\"tlui-button-grid__button\"\n\t\t\t\tdata-testid={`tools.more.${id}`}\n\t\t\t\tdata-value={id}\n\t\t\t\tdisabled={disabled}\n\t\t\t\ttitle={titleStr}\n\t\t\t\ttype=\"icon\"\n\t\t\t\t{...events}\n\t\t\t>\n\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t</TldrawUiToolbarButton>\n\t\t)\n\t}\n\n\treturn (\n\t\t<TldrawUiToolbarButton\n\t\t\taria-label={labelStr}\n\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\tdata-testid={`tools.${id}`}\n\t\t\tdata-value={id}\n\t\t\tdisabled={disabled}\n\t\t\tonTouchStart={(e) => {\n\t\t\t\tpreventDefault(e)\n\t\t\t\tonSelect('toolbar')\n\t\t\t}}\n\t\t\ttitle={titleStr}\n\t\t\ttype=\"tool\"\n\t\t\t{...events}\n\t\t>\n\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t</TldrawUiToolbarButton>\n\t)\n}\n"],
+  "mappings": "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",
   "names": ["_ContextMenu"]
 }

package/dist-cjs/lib/ui/context/events.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/ui/context/events.tsx"],
-  "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\t'click-watermark': { url: string }\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"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAmLE;AAnLF,YAAuB;AAqKvB,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;",
+  "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"],
+  "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;",
   "names": []
 }

package/dist-cjs/lib/ui/version.js

@@ -22,10 +22,10 @@ __export(version_exports, {
   version: () => version
 });
 module.exports = __toCommonJS(version_exports);
-const version = "4.2.0-canary.0a761296d315";
+const version = "4.2.0-canary.0d8a9d25ff63";
 const publishDates = {
   major: "2025-09-18T14:39:22.803Z",
-  minor: "2025-11-11T12:33:37.028Z",
-  patch: "2025-11-11T12:33:37.028Z"
+  minor: "2025-11-17T14:39:41.165Z",
+  patch: "2025-11-17T14:39:41.165Z"
 };
 //# sourceMappingURL=version.js.map

package/dist-cjs/lib/ui/version.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/lib/ui/version.ts"],
-  "sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '4.2.0-canary.0a761296d315'\nexport const publishDates = {\n\tmajor: '2025-09-18T14:39:22.803Z',\n\tminor: '2025-11-11T12:33:37.028Z',\n\tpatch: '2025-11-11T12:33:37.028Z',\n}\n"],
+  "sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '4.2.0-canary.0d8a9d25ff63'\nexport const publishDates = {\n\tmajor: '2025-09-18T14:39:22.803Z',\n\tminor: '2025-11-17T14:39:41.165Z',\n\tpatch: '2025-11-17T14:39:41.165Z',\n}\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGO,MAAM,UAAU;AAChB,MAAM,eAAe;AAAA,EAC3B,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AACR;",
   "names": []
 }

package/dist-esm/index.d.mts

@@ -3940,9 +3940,6 @@ export declare interface TLUiEventMap {
         operation: 'bold' | 'bulletList' | 'heading' | 'link-edit' | 'link-remove' | 'link-visit' | 'link' | 'strike';
     };
     edit: null;
-    'click-watermark': {
-        url: string;
-    };
 }
 
 /** @public */

package/dist-esm/index.mjs

@@ -533,7 +533,7 @@ import {
 } from "./lib/utils/tldr/file.mjs";
 registerTldrawLibraryVersion(
   "tldraw",
-  "4.2.0-canary.0a761296d315",
+  "4.2.0-canary.0d8a9d25ff63",
   "esm"
 );
 export {

package/dist-esm/lib/Tldraw.mjs

@@ -182,11 +182,6 @@ function InsideOfEditorAndUiContext({
     unsubs.push(registerDefaultSideEffects(editor));
     editor.fonts.requestFonts(allDefaultFontFaces);
     editor.once("edit", () => trackEvent("edit", { source: "unknown" }));
-    const handleWatermarkClick = (info) => {
-      trackEvent("click-watermark", { source: "unknown", url: info.url });
-    };
-    editor.on("click-watermark", handleWatermarkClick);
-    unsubs.push(() => editor.off("click-watermark", handleWatermarkClick));
     registerDefaultExternalContentHandlers(editor, {
       maxImageDimension,
       maxAssetSize,

package/dist-esm/lib/Tldraw.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/lib/Tldraw.tsx"],
-  "sourcesContent": ["import {\n\tDEFAULT_SUPPORTED_IMAGE_TYPES,\n\tDEFAULT_SUPPORT_VIDEO_TYPES,\n\tTLEditorComponents,\n\tTLOnMountHandler,\n\tTLTextOptions,\n\tTldrawEditor,\n\tTldrawEditorBaseProps,\n\tTldrawEditorStoreProps,\n\tdefaultUserPreferences,\n\tmergeArraysAndReplaceDefaults,\n\tuseEditor,\n\tuseEditorComponents,\n\tuseOnMount,\n\tuseShallowArrayIdentity,\n\tuseShallowObjectIdentity,\n} from '@tldraw/editor'\nimport { useMemo } from 'react'\nimport { TldrawHandles } from './canvas/TldrawHandles'\nimport { TldrawOverlays } from './canvas/TldrawOverlays'\nimport { TldrawScribble } from './canvas/TldrawScribble'\nimport { TldrawSelectionForeground } from './canvas/TldrawSelectionForeground'\nimport { TldrawShapeIndicators } from './canvas/TldrawShapeIndicators'\nimport { defaultBindingUtils } from './defaultBindingUtils'\nimport { TLEmbedDefinition } from './defaultEmbedDefinitions'\nimport {\n\tTLExternalContentProps,\n\tregisterDefaultExternalContentHandlers,\n} from './defaultExternalContentHandlers'\nimport { defaultShapeTools } from './defaultShapeTools'\nimport { defaultShapeUtils } from './defaultShapeUtils'\nimport { registerDefaultSideEffects } from './defaultSideEffects'\nimport { defaultTools } from './defaultTools'\nimport { EmbedShapeUtil } from './shapes/embed/EmbedShapeUtil'\nimport { allDefaultFontFaces } from './shapes/shared/defaultFonts'\nimport { TldrawUi, TldrawUiInFrontOfTheCanvas, TldrawUiProps } from './ui/TldrawUi'\nimport { TLUiAssetUrlOverrides, useDefaultUiAssetUrlsWithOverrides } from './ui/assetUrls'\nimport { LoadingScreen } from './ui/components/LoadingScreen'\nimport { Spinner } from './ui/components/Spinner'\nimport { AssetUrlsProvider } from './ui/context/asset-urls'\nimport { TLUiComponents, useTldrawUiComponents } from './ui/context/components'\nimport { useUiEvents } from './ui/context/events'\nimport { useToasts } from './ui/context/toasts'\nimport {\n\tTldrawUiTranslationProvider,\n\tuseTranslation,\n} from './ui/hooks/useTranslation/useTranslation'\nimport { useMergedTranslationOverrides } from './ui/overrides'\nimport { useDefaultEditorAssetsWithOverrides } from './utils/static-assets/assetUrls'\nimport { defaultAddFontsFromNode, tipTapDefaultExtensions } from './utils/text/richText'\n\n/**\n * Override the default react components used by the editor and UI. Set components to null to\n * disable them entirely.\n *\n * @example\n * ```tsx\n * import {Tldraw, TLComponents} from 'tldraw'\n *\n * const components: TLComponents = {\n *    Scribble: MyCustomScribble,\n * }\n *\n * export function MyApp() {\n *   return <Tldraw components={components} />\n * }\n * ```\n *\n *\n * @public\n */\nexport interface TLComponents extends TLEditorComponents, TLUiComponents {}\n\n/** @public */\nexport interface TldrawBaseProps\n\textends TldrawUiProps,\n\t\tTldrawEditorBaseProps,\n\t\tTLExternalContentProps {\n\t/** Urls for custom assets.\n\t *\n\t * \u26A0\uFE0E Important! This must be memoized (with useMemo) or defined outside of any React component.\n\t */\n\tassetUrls?: TLUiAssetUrlOverrides\n\t/** Overrides for tldraw's components.\n\t *\n\t * \u26A0\uFE0E Important! This must be memoized (with useMemo) or defined outside of any React component.\n\t */\n\tcomponents?: TLComponents\n\t/** Custom definitions for tldraw's embeds.\n\t *\n\t * \u26A0\uFE0E Important! This must be memoized (with useMemo) or defined outside of any React component.\n\t */\n\tembeds?: TLEmbedDefinition[]\n}\n\n/** @public */\nexport type TldrawProps = TldrawBaseProps & TldrawEditorStoreProps\n\nconst allDefaultTools = [...defaultTools, ...defaultShapeTools]\n\n/** @public @react */\nexport function Tldraw(props: TldrawProps) {\n\tconst {\n\t\tchildren,\n\t\tmaxImageDimension,\n\t\tmaxAssetSize,\n\t\tacceptedImageMimeTypes,\n\t\tacceptedVideoMimeTypes,\n\t\tonMount,\n\t\tcomponents = {},\n\t\tshapeUtils = [],\n\t\tbindingUtils = [],\n\t\ttools = [],\n\t\tembeds,\n\t\ttextOptions,\n\t\t...rest\n\t} = props\n\n\tconst _components = useShallowObjectIdentity(components)\n\n\tconst CustomInFrontOfTheCanvas = components?.InFrontOfTheCanvas\n\tconst InFrontOfTheCanvas = useMemo(() => {\n\t\tif (rest.hideUi) return CustomInFrontOfTheCanvas ?? null\n\t\tif (!CustomInFrontOfTheCanvas) return TldrawUiInFrontOfTheCanvas\n\n\t\treturn () => (\n\t\t\t<>\n\t\t\t\t<TldrawUiInFrontOfTheCanvas />\n\t\t\t\t<CustomInFrontOfTheCanvas />\n\t\t\t</>\n\t\t)\n\t}, [rest.hideUi, CustomInFrontOfTheCanvas])\n\tconst componentsWithDefault = useMemo(\n\t\t() => ({\n\t\t\tScribble: TldrawScribble,\n\t\t\tShapeIndicators: TldrawShapeIndicators,\n\t\t\tCollaboratorScribble: TldrawScribble,\n\t\t\tSelectionForeground: TldrawSelectionForeground,\n\t\t\tHandles: TldrawHandles,\n\t\t\tOverlays: TldrawOverlays,\n\t\t\tSpinner,\n\t\t\tLoadingScreen,\n\t\t\t..._components,\n\t\t\tInFrontOfTheCanvas,\n\t\t}),\n\t\t[_components, InFrontOfTheCanvas]\n\t)\n\n\tconst _shapeUtils = useShallowArrayIdentity(shapeUtils)\n\tconst shapeUtilsWithDefaults = useMemo(\n\t\t() => mergeArraysAndReplaceDefaults('type', _shapeUtils, defaultShapeUtils),\n\t\t[_shapeUtils]\n\t)\n\n\tconst _bindingUtils = useShallowArrayIdentity(bindingUtils)\n\tconst bindingUtilsWithDefaults = useMemo(\n\t\t() => mergeArraysAndReplaceDefaults('type', _bindingUtils, defaultBindingUtils),\n\t\t[_bindingUtils]\n\t)\n\n\tconst _tools = useShallowArrayIdentity(tools)\n\tconst toolsWithDefaults = useMemo(\n\t\t() => mergeArraysAndReplaceDefaults('id', _tools, allDefaultTools),\n\t\t[_tools]\n\t)\n\n\tconst _imageMimeTypes = useShallowArrayIdentity(\n\t\tacceptedImageMimeTypes ?? DEFAULT_SUPPORTED_IMAGE_TYPES\n\t)\n\tconst _videoMimeTypes = useShallowArrayIdentity(\n\t\tacceptedVideoMimeTypes ?? DEFAULT_SUPPORT_VIDEO_TYPES\n\t)\n\n\tconst textOptionsWithDefaults = useMemo((): TLTextOptions => {\n\t\treturn {\n\t\t\taddFontsFromNode: defaultAddFontsFromNode,\n\t\t\t...textOptions,\n\t\t\ttipTapConfig: {\n\t\t\t\textensions: tipTapDefaultExtensions,\n\t\t\t\t...textOptions?.tipTapConfig,\n\t\t\t},\n\t\t}\n\t}, [textOptions])\n\n\tconst mediaMimeTypes = useMemo(\n\t\t() => [..._imageMimeTypes, ..._videoMimeTypes],\n\t\t[_imageMimeTypes, _videoMimeTypes]\n\t)\n\n\tconst assets = useDefaultEditorAssetsWithOverrides(rest.assetUrls)\n\n\tconst embedShapeUtil = shapeUtilsWithDefaults.find((util) => util.type === 'embed')\n\tif (embedShapeUtil && embeds) {\n\t\tEmbedShapeUtil.setEmbedDefinitions(embeds)\n\t}\n\n\treturn (\n\t\t// We provide an extra higher layer of asset+translations providers here so that\n\t\t// loading UI (which is rendered outside of TldrawUi) may be translated.\n\t\t// Ideally we would refactor to hoist all the UI context providers we can up here. Maybe later.\n\t\t<AssetUrlsProvider assetUrls={useDefaultUiAssetUrlsWithOverrides(rest.assetUrls)}>\n\t\t\t<TldrawUiTranslationProvider\n\t\t\t\toverrides={useMergedTranslationOverrides(rest.overrides)}\n\t\t\t\tlocale={rest.user?.userPreferences.get().locale ?? defaultUserPreferences.locale}\n\t\t\t>\n\t\t\t\t<TldrawEditor\n\t\t\t\t\tinitialState=\"select\"\n\t\t\t\t\t{...rest}\n\t\t\t\t\tcomponents={componentsWithDefault}\n\t\t\t\t\tshapeUtils={shapeUtilsWithDefaults}\n\t\t\t\t\tbindingUtils={bindingUtilsWithDefaults}\n\t\t\t\t\ttools={toolsWithDefaults}\n\t\t\t\t\ttextOptions={textOptionsWithDefaults}\n\t\t\t\t\tassetUrls={assets}\n\t\t\t\t>\n\t\t\t\t\t<TldrawUi {...rest} components={componentsWithDefault} mediaMimeTypes={mediaMimeTypes}>\n\t\t\t\t\t\t<InsideOfEditorAndUiContext\n\t\t\t\t\t\t\tmaxImageDimension={maxImageDimension}\n\t\t\t\t\t\t\tmaxAssetSize={maxAssetSize}\n\t\t\t\t\t\t\tacceptedImageMimeTypes={_imageMimeTypes}\n\t\t\t\t\t\t\tacceptedVideoMimeTypes={_videoMimeTypes}\n\t\t\t\t\t\t\tonMount={onMount}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{children}\n\t\t\t\t\t</TldrawUi>\n\t\t\t\t</TldrawEditor>\n\t\t\t</TldrawUiTranslationProvider>\n\t\t</AssetUrlsProvider>\n\t)\n}\n\n// We put these hooks into a component here so that they can run inside of the context provided by TldrawEditor and TldrawUi.\nfunction InsideOfEditorAndUiContext({\n\tmaxImageDimension,\n\tmaxAssetSize,\n\tacceptedImageMimeTypes,\n\tacceptedVideoMimeTypes,\n\tonMount,\n}: TLExternalContentProps & {\n\tonMount?: TLOnMountHandler\n}) {\n\tconst editor = useEditor()\n\tconst toasts = useToasts()\n\tconst msg = useTranslation()\n\tconst trackEvent = useUiEvents()\n\n\tuseOnMount(() => {\n\t\tconst unsubs: (void | (() => void) | undefined)[] = []\n\n\t\tunsubs.push(registerDefaultSideEffects(editor))\n\n\t\t// now that the editor has mounted (and presumably pre-loaded the fonts actually in use in\n\t\t// the document), we want to preload the other default font faces in the background. These\n\t\t// won't be directly used, but mean that when adding text the user can switch between fonts\n\t\t// quickly, without having to wait for them to load in.\n\t\teditor.fonts.requestFonts(allDefaultFontFaces)\n\n\t\teditor.once('edit', () => trackEvent('edit', { source: 'unknown' }))\n\n\t\t// Forward watermark click events from editor to UI event system\n\t\tconst handleWatermarkClick = (info: { url: string }) => {\n\t\t\ttrackEvent('click-watermark', { source: 'unknown', url: info.url })\n\t\t}\n\t\teditor.on('click-watermark', handleWatermarkClick)\n\t\tunsubs.push(() => editor.off('click-watermark', handleWatermarkClick))\n\n\t\t// for content handling, first we register the default handlers...\n\t\tregisterDefaultExternalContentHandlers(editor, {\n\t\t\tmaxImageDimension,\n\t\t\tmaxAssetSize,\n\t\t\tacceptedImageMimeTypes,\n\t\t\tacceptedVideoMimeTypes,\n\t\t\ttoasts,\n\t\t\tmsg,\n\t\t})\n\n\t\t// ...then we call the store's on mount which may override them...\n\t\tunsubs.push(editor.store.props.onMount(editor))\n\n\t\t// ...then we run the user's onMount prop, which may override things again.\n\t\tunsubs.push(onMount?.(editor))\n\n\t\treturn () => {\n\t\t\tunsubs.forEach((fn) => fn?.())\n\t\t}\n\t})\n\n\tconst { Canvas } = useEditorComponents()\n\tconst { ContextMenu } = useTldrawUiComponents()\n\n\tif (ContextMenu) {\n\t\t// should wrap canvas\n\t\treturn <ContextMenu />\n\t}\n\n\tif (Canvas) {\n\t\treturn <Canvas />\n\t}\n\n\treturn null\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\tDEFAULT_SUPPORTED_IMAGE_TYPES,\n\tDEFAULT_SUPPORT_VIDEO_TYPES,\n\tTLEditorComponents,\n\tTLOnMountHandler,\n\tTLTextOptions,\n\tTldrawEditor,\n\tTldrawEditorBaseProps,\n\tTldrawEditorStoreProps,\n\tdefaultUserPreferences,\n\tmergeArraysAndReplaceDefaults,\n\tuseEditor,\n\tuseEditorComponents,\n\tuseOnMount,\n\tuseShallowArrayIdentity,\n\tuseShallowObjectIdentity,\n} from '@tldraw/editor'\nimport { useMemo } from 'react'\nimport { TldrawHandles } from './canvas/TldrawHandles'\nimport { TldrawOverlays } from './canvas/TldrawOverlays'\nimport { TldrawScribble } from './canvas/TldrawScribble'\nimport { TldrawSelectionForeground } from './canvas/TldrawSelectionForeground'\nimport { TldrawShapeIndicators } from './canvas/TldrawShapeIndicators'\nimport { defaultBindingUtils } from './defaultBindingUtils'\nimport { TLEmbedDefinition } from './defaultEmbedDefinitions'\nimport {\n\tTLExternalContentProps,\n\tregisterDefaultExternalContentHandlers,\n} from './defaultExternalContentHandlers'\nimport { defaultShapeTools } from './defaultShapeTools'\nimport { defaultShapeUtils } from './defaultShapeUtils'\nimport { registerDefaultSideEffects } from './defaultSideEffects'\nimport { defaultTools } from './defaultTools'\nimport { EmbedShapeUtil } from './shapes/embed/EmbedShapeUtil'\nimport { allDefaultFontFaces } from './shapes/shared/defaultFonts'\nimport { TldrawUi, TldrawUiInFrontOfTheCanvas, TldrawUiProps } from './ui/TldrawUi'\nimport { TLUiAssetUrlOverrides, useDefaultUiAssetUrlsWithOverrides } from './ui/assetUrls'\nimport { LoadingScreen } from './ui/components/LoadingScreen'\nimport { Spinner } from './ui/components/Spinner'\nimport { AssetUrlsProvider } from './ui/context/asset-urls'\nimport { TLUiComponents, useTldrawUiComponents } from './ui/context/components'\nimport { useUiEvents } from './ui/context/events'\nimport { useToasts } from './ui/context/toasts'\nimport {\n\tTldrawUiTranslationProvider,\n\tuseTranslation,\n} from './ui/hooks/useTranslation/useTranslation'\nimport { useMergedTranslationOverrides } from './ui/overrides'\nimport { useDefaultEditorAssetsWithOverrides } from './utils/static-assets/assetUrls'\nimport { defaultAddFontsFromNode, tipTapDefaultExtensions } from './utils/text/richText'\n\n/**\n * Override the default react components used by the editor and UI. Set components to null to\n * disable them entirely.\n *\n * @example\n * ```tsx\n * import {Tldraw, TLComponents} from 'tldraw'\n *\n * const components: TLComponents = {\n *    Scribble: MyCustomScribble,\n * }\n *\n * export function MyApp() {\n *   return <Tldraw components={components} />\n * }\n * ```\n *\n *\n * @public\n */\nexport interface TLComponents extends TLEditorComponents, TLUiComponents {}\n\n/** @public */\nexport interface TldrawBaseProps\n\textends TldrawUiProps,\n\t\tTldrawEditorBaseProps,\n\t\tTLExternalContentProps {\n\t/** Urls for custom assets.\n\t *\n\t * \u26A0\uFE0E Important! This must be memoized (with useMemo) or defined outside of any React component.\n\t */\n\tassetUrls?: TLUiAssetUrlOverrides\n\t/** Overrides for tldraw's components.\n\t *\n\t * \u26A0\uFE0E Important! This must be memoized (with useMemo) or defined outside of any React component.\n\t */\n\tcomponents?: TLComponents\n\t/** Custom definitions for tldraw's embeds.\n\t *\n\t * \u26A0\uFE0E Important! This must be memoized (with useMemo) or defined outside of any React component.\n\t */\n\tembeds?: TLEmbedDefinition[]\n}\n\n/** @public */\nexport type TldrawProps = TldrawBaseProps & TldrawEditorStoreProps\n\nconst allDefaultTools = [...defaultTools, ...defaultShapeTools]\n\n/** @public @react */\nexport function Tldraw(props: TldrawProps) {\n\tconst {\n\t\tchildren,\n\t\tmaxImageDimension,\n\t\tmaxAssetSize,\n\t\tacceptedImageMimeTypes,\n\t\tacceptedVideoMimeTypes,\n\t\tonMount,\n\t\tcomponents = {},\n\t\tshapeUtils = [],\n\t\tbindingUtils = [],\n\t\ttools = [],\n\t\tembeds,\n\t\ttextOptions,\n\t\t...rest\n\t} = props\n\n\tconst _components = useShallowObjectIdentity(components)\n\n\tconst CustomInFrontOfTheCanvas = components?.InFrontOfTheCanvas\n\tconst InFrontOfTheCanvas = useMemo(() => {\n\t\tif (rest.hideUi) return CustomInFrontOfTheCanvas ?? null\n\t\tif (!CustomInFrontOfTheCanvas) return TldrawUiInFrontOfTheCanvas\n\n\t\treturn () => (\n\t\t\t<>\n\t\t\t\t<TldrawUiInFrontOfTheCanvas />\n\t\t\t\t<CustomInFrontOfTheCanvas />\n\t\t\t</>\n\t\t)\n\t}, [rest.hideUi, CustomInFrontOfTheCanvas])\n\tconst componentsWithDefault = useMemo(\n\t\t() => ({\n\t\t\tScribble: TldrawScribble,\n\t\t\tShapeIndicators: TldrawShapeIndicators,\n\t\t\tCollaboratorScribble: TldrawScribble,\n\t\t\tSelectionForeground: TldrawSelectionForeground,\n\t\t\tHandles: TldrawHandles,\n\t\t\tOverlays: TldrawOverlays,\n\t\t\tSpinner,\n\t\t\tLoadingScreen,\n\t\t\t..._components,\n\t\t\tInFrontOfTheCanvas,\n\t\t}),\n\t\t[_components, InFrontOfTheCanvas]\n\t)\n\n\tconst _shapeUtils = useShallowArrayIdentity(shapeUtils)\n\tconst shapeUtilsWithDefaults = useMemo(\n\t\t() => mergeArraysAndReplaceDefaults('type', _shapeUtils, defaultShapeUtils),\n\t\t[_shapeUtils]\n\t)\n\n\tconst _bindingUtils = useShallowArrayIdentity(bindingUtils)\n\tconst bindingUtilsWithDefaults = useMemo(\n\t\t() => mergeArraysAndReplaceDefaults('type', _bindingUtils, defaultBindingUtils),\n\t\t[_bindingUtils]\n\t)\n\n\tconst _tools = useShallowArrayIdentity(tools)\n\tconst toolsWithDefaults = useMemo(\n\t\t() => mergeArraysAndReplaceDefaults('id', _tools, allDefaultTools),\n\t\t[_tools]\n\t)\n\n\tconst _imageMimeTypes = useShallowArrayIdentity(\n\t\tacceptedImageMimeTypes ?? DEFAULT_SUPPORTED_IMAGE_TYPES\n\t)\n\tconst _videoMimeTypes = useShallowArrayIdentity(\n\t\tacceptedVideoMimeTypes ?? DEFAULT_SUPPORT_VIDEO_TYPES\n\t)\n\n\tconst textOptionsWithDefaults = useMemo((): TLTextOptions => {\n\t\treturn {\n\t\t\taddFontsFromNode: defaultAddFontsFromNode,\n\t\t\t...textOptions,\n\t\t\ttipTapConfig: {\n\t\t\t\textensions: tipTapDefaultExtensions,\n\t\t\t\t...textOptions?.tipTapConfig,\n\t\t\t},\n\t\t}\n\t}, [textOptions])\n\n\tconst mediaMimeTypes = useMemo(\n\t\t() => [..._imageMimeTypes, ..._videoMimeTypes],\n\t\t[_imageMimeTypes, _videoMimeTypes]\n\t)\n\n\tconst assets = useDefaultEditorAssetsWithOverrides(rest.assetUrls)\n\n\tconst embedShapeUtil = shapeUtilsWithDefaults.find((util) => util.type === 'embed')\n\tif (embedShapeUtil && embeds) {\n\t\tEmbedShapeUtil.setEmbedDefinitions(embeds)\n\t}\n\n\treturn (\n\t\t// We provide an extra higher layer of asset+translations providers here so that\n\t\t// loading UI (which is rendered outside of TldrawUi) may be translated.\n\t\t// Ideally we would refactor to hoist all the UI context providers we can up here. Maybe later.\n\t\t<AssetUrlsProvider assetUrls={useDefaultUiAssetUrlsWithOverrides(rest.assetUrls)}>\n\t\t\t<TldrawUiTranslationProvider\n\t\t\t\toverrides={useMergedTranslationOverrides(rest.overrides)}\n\t\t\t\tlocale={rest.user?.userPreferences.get().locale ?? defaultUserPreferences.locale}\n\t\t\t>\n\t\t\t\t<TldrawEditor\n\t\t\t\t\tinitialState=\"select\"\n\t\t\t\t\t{...rest}\n\t\t\t\t\tcomponents={componentsWithDefault}\n\t\t\t\t\tshapeUtils={shapeUtilsWithDefaults}\n\t\t\t\t\tbindingUtils={bindingUtilsWithDefaults}\n\t\t\t\t\ttools={toolsWithDefaults}\n\t\t\t\t\ttextOptions={textOptionsWithDefaults}\n\t\t\t\t\tassetUrls={assets}\n\t\t\t\t>\n\t\t\t\t\t<TldrawUi {...rest} components={componentsWithDefault} mediaMimeTypes={mediaMimeTypes}>\n\t\t\t\t\t\t<InsideOfEditorAndUiContext\n\t\t\t\t\t\t\tmaxImageDimension={maxImageDimension}\n\t\t\t\t\t\t\tmaxAssetSize={maxAssetSize}\n\t\t\t\t\t\t\tacceptedImageMimeTypes={_imageMimeTypes}\n\t\t\t\t\t\t\tacceptedVideoMimeTypes={_videoMimeTypes}\n\t\t\t\t\t\t\tonMount={onMount}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{children}\n\t\t\t\t\t</TldrawUi>\n\t\t\t\t</TldrawEditor>\n\t\t\t</TldrawUiTranslationProvider>\n\t\t</AssetUrlsProvider>\n\t)\n}\n\n// We put these hooks into a component here so that they can run inside of the context provided by TldrawEditor and TldrawUi.\nfunction InsideOfEditorAndUiContext({\n\tmaxImageDimension,\n\tmaxAssetSize,\n\tacceptedImageMimeTypes,\n\tacceptedVideoMimeTypes,\n\tonMount,\n}: TLExternalContentProps & {\n\tonMount?: TLOnMountHandler\n}) {\n\tconst editor = useEditor()\n\tconst toasts = useToasts()\n\tconst msg = useTranslation()\n\tconst trackEvent = useUiEvents()\n\n\tuseOnMount(() => {\n\t\tconst unsubs: (void | (() => void) | undefined)[] = []\n\n\t\tunsubs.push(registerDefaultSideEffects(editor))\n\n\t\t// now that the editor has mounted (and presumably pre-loaded the fonts actually in use in\n\t\t// the document), we want to preload the other default font faces in the background. These\n\t\t// won't be directly used, but mean that when adding text the user can switch between fonts\n\t\t// quickly, without having to wait for them to load in.\n\t\teditor.fonts.requestFonts(allDefaultFontFaces)\n\n\t\teditor.once('edit', () => trackEvent('edit', { source: 'unknown' }))\n\n\t\t// for content handling, first we register the default handlers...\n\t\tregisterDefaultExternalContentHandlers(editor, {\n\t\t\tmaxImageDimension,\n\t\t\tmaxAssetSize,\n\t\t\tacceptedImageMimeTypes,\n\t\t\tacceptedVideoMimeTypes,\n\t\t\ttoasts,\n\t\t\tmsg,\n\t\t})\n\n\t\t// ...then we call the store's on mount which may override them...\n\t\tunsubs.push(editor.store.props.onMount(editor))\n\n\t\t// ...then we run the user's onMount prop, which may override things again.\n\t\tunsubs.push(onMount?.(editor))\n\n\t\treturn () => {\n\t\t\tunsubs.forEach((fn) => fn?.())\n\t\t}\n\t})\n\n\tconst { Canvas } = useEditorComponents()\n\tconst { ContextMenu } = useTldrawUiComponents()\n\n\tif (ContextMenu) {\n\t\t// should wrap canvas\n\t\treturn <ContextMenu />\n\t}\n\n\tif (Canvas) {\n\t\treturn <Canvas />\n\t}\n\n\treturn null\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-esm/lib/canvas/TldrawSelectionForeground.mjs

@@ -1,6 +1,7 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import {
   Box,
+  HALF_PI,
   getCursor,
   tlenv,
   toDomPrecision,
@@ -37,7 +38,9 @@ const TldrawSelectionForeground = track(function TldrawSelectionForeground2({
   const isLockedShape = onlyShape && editor.isShapeOrAncestorLocked(onlyShape);
   const expandOutlineBy = onlyShape ? editor.getShapeUtil(onlyShape).expandSelectionOutlinePx(onlyShape) : 0;
   const expandedBounds = expandOutlineBy instanceof Box ? bounds.clone().expand(expandOutlineBy).zeroFix() : bounds.clone().expandBy(expandOutlineBy).zeroFix();
-  useTransform(rSvg, bounds?.x, bounds?.y, 1, editor.getSelectionRotation(), {
+  const selectionRotation = editor.getSelectionRotation();
+  const isShapeTooCloseToContextualToolbar = selectionRotation / HALF_PI > 1.6 && selectionRotation / HALF_PI < 2.4;
+  useTransform(rSvg, bounds?.x, bounds?.y, 1, selectionRotation, {
     x: expandedBounds.x - bounds.x,
     y: expandedBounds.y - bounds.y
   });
@@ -111,6 +114,7 @@ const TldrawSelectionForeground = track(function TldrawSelectionForeground2({
   }
   const textHandleHeight = Math.min(24 / zoom, height - targetSizeY * 3);
   const showTextResizeHandles = shouldDisplayControls && isCoarsePointer && onlyShape && editor.isShapeOfType(onlyShape, "text") && textHandleHeight * zoom >= 4;
+  const isMediaShape = onlyShape && (editor.isShapeOfType(onlyShape, "image") || editor.isShapeOfType(onlyShape, "video"));
   return /* @__PURE__ */ jsx(
     "svg",
     {
@@ -179,7 +183,7 @@ const TldrawSelectionForeground = track(function TldrawSelectionForeground2({
           {
             "data-testid": "selection.rotate.mobile",
             cx: isSmallX ? -targetSize * 1.5 : width / 2,
-            cy: isSmallX ? height / 2 : -targetSize * 1.5,
+            cy: isSmallX ? height / 2 : isMediaShape && !isShapeTooCloseToContextualToolbar ? height + targetSize * 1.5 : -targetSize * 1.5,
             size,
             isHidden: hideMobileRotateHandle
           }

package/dist-esm/lib/canvas/TldrawSelectionForeground.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/lib/canvas/TldrawSelectionForeground.tsx"],
-  "sourcesContent": ["import {\n\tBox,\n\tRotateCorner,\n\tTLEmbedShape,\n\tTLSelectionForegroundProps,\n\tTLTextShape,\n\tgetCursor,\n\ttlenv,\n\ttoDomPrecision,\n\ttrack,\n\tuseEditor,\n\tuseSelectionEvents,\n\tuseTransform,\n\tuseValue,\n} from '@tldraw/editor'\nimport classNames from 'classnames'\nimport { PointerEventHandler, useRef } from 'react'\nimport { useReadonly } from '../ui/hooks/useReadonly'\nimport { useTranslation } from '../ui/hooks/useTranslation/useTranslation'\nimport { TldrawCropHandles } from './TldrawCropHandles'\n\n/** @public */\nexport const TldrawSelectionForeground = track(function TldrawSelectionForeground({\n\tbounds,\n\trotation,\n}: TLSelectionForegroundProps) {\n\tconst editor = useEditor()\n\tconst msg = useTranslation()\n\tconst rSvg = useRef<SVGSVGElement>(null)\n\n\tconst isReadonlyMode = useReadonly()\n\tconst topEvents = useSelectionEvents('top')\n\tconst rightEvents = useSelectionEvents('right')\n\tconst bottomEvents = useSelectionEvents('bottom')\n\tconst leftEvents = useSelectionEvents('left')\n\tconst topLeftEvents = useSelectionEvents('top_left')\n\tconst topRightEvents = useSelectionEvents('top_right')\n\tconst bottomRightEvents = useSelectionEvents('bottom_right')\n\tconst bottomLeftEvents = useSelectionEvents('bottom_left')\n\n\tconst isDefaultCursor = editor.getInstanceState().cursor.type === 'default'\n\tconst isCoarsePointer = editor.getInstanceState().isCoarsePointer\n\n\tconst onlyShape = editor.getOnlySelectedShape()\n\tconst isLockedShape = onlyShape && editor.isShapeOrAncestorLocked(onlyShape)\n\n\t// if all shapes have an expandBy for the selection outline, we can expand by the l\n\tconst expandOutlineBy = onlyShape\n\t\t? editor.getShapeUtil(onlyShape).expandSelectionOutlinePx(onlyShape)\n\t\t: 0\n\n\tconst expandedBounds =\n\t\texpandOutlineBy instanceof Box\n\t\t\t? bounds.clone().expand(expandOutlineBy).zeroFix()\n\t\t\t: bounds.clone().expandBy(expandOutlineBy).zeroFix()\n\n\tuseTransform(rSvg, bounds?.x, bounds?.y, 1, editor.getSelectionRotation(), {\n\t\tx: expandedBounds.x - bounds.x,\n\t\ty: expandedBounds.y - bounds.y,\n\t})\n\n\tif (onlyShape && editor.isShapeHidden(onlyShape)) return null\n\n\tconst zoom = editor.getZoomLevel()\n\tconst isChangingStyle = editor.getInstanceState().isChangingStyle\n\n\tconst width = expandedBounds.width\n\tconst height = expandedBounds.height\n\n\tconst size = 8 / zoom\n\tconst isTinyX = width < size * 2\n\tconst isTinyY = height < size * 2\n\n\tconst isSmallX = width < size * 4\n\tconst isSmallY = height < size * 4\n\tconst isSmallCropX = width < size * 5\n\tconst isSmallCropY = height < size * 5\n\n\tconst mobileHandleMultiplier = isCoarsePointer ? 1.75 : 1\n\tconst targetSize = (6 / zoom) * mobileHandleMultiplier\n\n\tconst targetSizeX = (isSmallX ? targetSize / 2 : targetSize) * (mobileHandleMultiplier * 0.75)\n\tconst targetSizeY = (isSmallY ? targetSize / 2 : targetSize) * (mobileHandleMultiplier * 0.75)\n\n\tconst showSelectionBounds =\n\t\t(onlyShape ? !editor.getShapeUtil(onlyShape).hideSelectionBoundsFg(onlyShape) : true) &&\n\t\t!isChangingStyle\n\n\tlet shouldDisplayBox =\n\t\t(showSelectionBounds &&\n\t\t\teditor.isInAny(\n\t\t\t\t'select.idle',\n\t\t\t\t'select.brushing',\n\t\t\t\t'select.scribble_brushing',\n\t\t\t\t'select.pointing_canvas',\n\t\t\t\t'select.pointing_selection',\n\t\t\t\t'select.pointing_shape',\n\t\t\t\t'select.crop.idle',\n\t\t\t\t'select.crop.pointing_crop',\n\t\t\t\t'select.crop.pointing_crop_handle',\n\t\t\t\t'select.pointing_resize_handle'\n\t\t\t)) ||\n\t\t(showSelectionBounds &&\n\t\t\teditor.isIn('select.resizing') &&\n\t\t\tonlyShape &&\n\t\t\teditor.isShapeOfType<TLTextShape>(onlyShape, 'text'))\n\n\tif (onlyShape && shouldDisplayBox) {\n\t\tif (tlenv.isFirefox && editor.isShapeOfType<TLEmbedShape>(onlyShape, 'embed')) {\n\t\t\tshouldDisplayBox = false\n\t\t}\n\t}\n\n\tconst showCropHandles =\n\t\teditor.isInAny(\n\t\t\t'select.crop.idle',\n\t\t\t'select.crop.pointing_crop',\n\t\t\t'select.crop.pointing_crop_handle'\n\t\t) &&\n\t\t!isChangingStyle &&\n\t\t!isReadonlyMode\n\n\tconst shouldDisplayControls =\n\t\teditor.isInAny(\n\t\t\t'select.idle',\n\t\t\t'select.pointing_selection',\n\t\t\t'select.pointing_shape',\n\t\t\t'select.crop.idle'\n\t\t) &&\n\t\t!isChangingStyle &&\n\t\t!isReadonlyMode\n\n\tconst showCornerRotateHandles =\n\t\t!isCoarsePointer &&\n\t\t!(isTinyX || isTinyY) &&\n\t\t(shouldDisplayControls || showCropHandles) &&\n\t\t(onlyShape ? !editor.getShapeUtil(onlyShape).hideRotateHandle(onlyShape) : true) &&\n\t\t!isLockedShape\n\n\tconst showMobileRotateHandle =\n\t\tisCoarsePointer &&\n\t\t(!isSmallX || !isSmallY) &&\n\t\t(shouldDisplayControls || showCropHandles) &&\n\t\t(onlyShape ? !editor.getShapeUtil(onlyShape).hideRotateHandle(onlyShape) : true) &&\n\t\t!isLockedShape\n\n\tconst showResizeHandles =\n\t\tshouldDisplayControls &&\n\t\t(onlyShape\n\t\t\t? editor.getShapeUtil(onlyShape).canResize(onlyShape) &&\n\t\t\t\t!editor.getShapeUtil(onlyShape).hideResizeHandles(onlyShape)\n\t\t\t: true) &&\n\t\t!showCropHandles &&\n\t\t!isLockedShape\n\n\tconst hideAlternateCornerHandles = isTinyX || isTinyY\n\tconst showOnlyOneHandle = isTinyX && isTinyY\n\tconst hideAlternateCropHandles = isSmallCropX || isSmallCropY\n\n\tconst showHandles = showResizeHandles || showCropHandles\n\tconst hideRotateCornerHandles = !showCornerRotateHandles\n\tconst hideMobileRotateHandle = !shouldDisplayControls || !showMobileRotateHandle\n\tconst hideTopLeftCorner = !shouldDisplayControls || !showHandles\n\tconst hideTopRightCorner = !shouldDisplayControls || !showHandles || hideAlternateCornerHandles\n\tconst hideBottomLeftCorner = !shouldDisplayControls || !showHandles || hideAlternateCornerHandles\n\tconst hideBottomRightCorner =\n\t\t!shouldDisplayControls || !showHandles || (showOnlyOneHandle && !showCropHandles)\n\n\t// If we're showing crop handles, then show the edges too.\n\t// If we're showing resize handles, then show the edges only\n\t// if we're not hiding them for some other reason.\n\tlet hideVerticalEdgeTargets = true\n\t// The same logic above applies here, except another nuance is that\n\t// we enable resizing for text on mobile (coarse).\n\tlet hideHorizontalEdgeTargets = true\n\n\tif (showCropHandles) {\n\t\thideVerticalEdgeTargets = hideAlternateCropHandles\n\t\thideHorizontalEdgeTargets = hideAlternateCropHandles\n\t} else if (showResizeHandles) {\n\t\thideVerticalEdgeTargets = hideAlternateCornerHandles || showOnlyOneHandle || isCoarsePointer\n\t\tconst isMobileAndTextShape = isCoarsePointer && onlyShape && onlyShape.type === 'text'\n\t\thideHorizontalEdgeTargets = hideVerticalEdgeTargets && !isMobileAndTextShape\n\t}\n\n\tconst textHandleHeight = Math.min(24 / zoom, height - targetSizeY * 3)\n\tconst showTextResizeHandles =\n\t\tshouldDisplayControls &&\n\t\tisCoarsePointer &&\n\t\tonlyShape &&\n\t\teditor.isShapeOfType<TLTextShape>(onlyShape, 'text') &&\n\t\ttextHandleHeight * zoom >= 4\n\n\treturn (\n\t\t<svg\n\t\t\tclassName=\"tl-overlays__item tl-selection__fg\"\n\t\t\tdata-testid=\"selection-foreground\"\n\t\t\taria-hidden=\"true\"\n\t\t>\n\t\t\t<g ref={rSvg}>\n\t\t\t\t{shouldDisplayBox && (\n\t\t\t\t\t<rect\n\t\t\t\t\t\tclassName=\"tl-selection__fg__outline\"\n\t\t\t\t\t\twidth={toDomPrecision(width)}\n\t\t\t\t\t\theight={toDomPrecision(height)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.top-left\"\n\t\t\t\t\tcx={0}\n\t\t\t\t\tcy={0}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"top_left_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nwse-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.top-right\"\n\t\t\t\t\tcx={width + targetSize * 3}\n\t\t\t\t\tcy={0}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"top_right_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nesw-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.bottom-left\"\n\t\t\t\t\tcx={0}\n\t\t\t\t\tcy={height + targetSize * 3}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"bottom_left_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('swne-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.bottom-right\"\n\t\t\t\t\tcx={width + targetSize * 3}\n\t\t\t\t\tcy={height + targetSize * 3}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"bottom_right_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('senw-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<MobileRotateHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.mobile\"\n\t\t\t\t\tcx={isSmallX ? -targetSize * 1.5 : width / 2}\n\t\t\t\t\tcy={isSmallX ? height / 2 : -targetSize * 1.5}\n\t\t\t\t\tsize={size}\n\t\t\t\t\tisHidden={hideMobileRotateHandle}\n\t\t\t\t/>\n\t\t\t\t{/* Targets */}\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideVerticalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.top\"\n\t\t\t\t\tariaLabel={msg('handle.resize-top')}\n\t\t\t\t\tx={0}\n\t\t\t\t\ty={toDomPrecision(0 - (isSmallY ? targetSizeY * 2 : targetSizeY))}\n\t\t\t\t\twidth={toDomPrecision(width)}\n\t\t\t\t\theight={toDomPrecision(Math.max(1, targetSizeY * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ns-resize', rotation) : undefined}\n\t\t\t\t\tevents={topEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideHorizontalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.right\"\n\t\t\t\t\tariaLabel={msg('handle.resize-right')}\n\t\t\t\t\tx={toDomPrecision(width - (isSmallX ? 0 : targetSizeX))}\n\t\t\t\t\ty={0}\n\t\t\t\t\theight={toDomPrecision(height)}\n\t\t\t\t\twidth={toDomPrecision(Math.max(1, targetSizeX * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ew-resize', rotation) : undefined}\n\t\t\t\t\tevents={rightEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideVerticalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.bottom\"\n\t\t\t\t\tariaLabel={msg('handle.resize-bottom')}\n\t\t\t\t\tx={0}\n\t\t\t\t\ty={toDomPrecision(height - (isSmallY ? 0 : targetSizeY))}\n\t\t\t\t\twidth={toDomPrecision(width)}\n\t\t\t\t\theight={toDomPrecision(Math.max(1, targetSizeY * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ns-resize', rotation) : undefined}\n\t\t\t\t\tevents={bottomEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideHorizontalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.left\"\n\t\t\t\t\tariaLabel={msg('handle.resize-left')}\n\t\t\t\t\tx={toDomPrecision(0 - (isSmallX ? targetSizeX * 2 : targetSizeX))}\n\t\t\t\t\ty={0}\n\t\t\t\t\theight={toDomPrecision(height)}\n\t\t\t\t\twidth={toDomPrecision(Math.max(1, targetSizeX * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ew-resize', rotation) : undefined}\n\t\t\t\t\tevents={leftEvents}\n\t\t\t\t/>\n\t\t\t\t{/* Corner Targets */}\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideTopLeftCorner}\n\t\t\t\t\tdataTestId=\"selection.target.top-left\"\n\t\t\t\t\tariaLabel={msg('handle.resize-top-left')}\n\t\t\t\t\tx={toDomPrecision(0 - (isSmallX ? targetSizeX * 2 : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(0 - (isSmallY ? targetSizeY * 2 : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nwse-resize', rotation) : undefined}\n\t\t\t\t\tevents={topLeftEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideTopRightCorner}\n\t\t\t\t\tdataTestId=\"selection.target.top-right\"\n\t\t\t\t\tariaLabel={msg('handle.resize-top-right')}\n\t\t\t\t\tx={toDomPrecision(width - (isSmallX ? 0 : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(0 - (isSmallY ? targetSizeY * 2 : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nesw-resize', rotation) : undefined}\n\t\t\t\t\tevents={topRightEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideBottomRightCorner}\n\t\t\t\t\tdataTestId=\"selection.target.bottom-right\"\n\t\t\t\t\tariaLabel={msg('handle.resize-bottom-right')}\n\t\t\t\t\tx={toDomPrecision(width - (isSmallX ? targetSizeX : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(height - (isSmallY ? targetSizeY : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nwse-resize', rotation) : undefined}\n\t\t\t\t\tevents={bottomRightEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideBottomLeftCorner}\n\t\t\t\t\tdataTestId=\"selection.target.bottom-left\"\n\t\t\t\t\tariaLabel={msg('handle.resize-bottom-left')}\n\t\t\t\t\tx={toDomPrecision(0 - (isSmallX ? targetSizeX * 3 : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(height - (isSmallY ? 0 : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nesw-resize', rotation) : undefined}\n\t\t\t\t\tevents={bottomLeftEvents}\n\t\t\t\t/>\n\t\t\t\t{/* Resize Handles */}\n\t\t\t\t{showResizeHandles && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.top-left\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideTopLeftCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.top-right\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideTopRightCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(width - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.bottom-right\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideBottomRightCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(width - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(height - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.bottom-left\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideBottomLeftCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(height - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t\t{showTextResizeHandles && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.text-resize.left.handle\"\n\t\t\t\t\t\t\tclassName=\"tl-text-handle\"\n\t\t\t\t\t\t\tx={toDomPrecision(0 - size / 4)}\n\t\t\t\t\t\t\ty={toDomPrecision(height / 2 - textHandleHeight / 2)}\n\t\t\t\t\t\t\trx={size / 4}\n\t\t\t\t\t\t\twidth={toDomPrecision(size / 2)}\n\t\t\t\t\t\t\theight={toDomPrecision(textHandleHeight)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.text-resize.right.handle\"\n\t\t\t\t\t\t\tclassName=\"tl-text-handle\"\n\t\t\t\t\t\t\trx={size / 4}\n\t\t\t\t\t\t\tx={toDomPrecision(width - size / 4)}\n\t\t\t\t\t\t\ty={toDomPrecision(height / 2 - textHandleHeight / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size / 2)}\n\t\t\t\t\t\t\theight={toDomPrecision(textHandleHeight)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t\t{/* Crop Handles */}\n\t\t\t\t{showCropHandles && (\n\t\t\t\t\t<TldrawCropHandles\n\t\t\t\t\t\t{...{\n\t\t\t\t\t\t\tsize,\n\t\t\t\t\t\t\twidth,\n\t\t\t\t\t\t\theight,\n\t\t\t\t\t\t\thideAlternateHandles: hideAlternateCropHandles,\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</g>\n\t\t</svg>\n\t)\n})\n\nexport const ResizeHandle = function ResizeHandle({\n\thide,\n\tdataTestId,\n\tariaLabel,\n\tx,\n\ty,\n\twidth,\n\theight,\n\tcursor,\n\tevents,\n}: {\n\thide: boolean\n\tdataTestId: string\n\tariaLabel: string\n\tx: number\n\ty: number\n\twidth: number\n\theight: number\n\tcursor?: string\n\tevents: {\n\t\tonPointerUp: PointerEventHandler<Element>\n\t\tonPointerMove(e: React.PointerEvent<Element>): void\n\t\tonPointerDown: PointerEventHandler<Element>\n\t}\n}) {\n\treturn (\n\t\t<rect\n\t\t\tclassName={classNames('tl-resize-handle', 'tl-transparent', {\n\t\t\t\t'tl-hidden': hide,\n\t\t\t})}\n\t\t\tdata-testid={dataTestId}\n\t\t\trole=\"button\"\n\t\t\taria-label={ariaLabel}\n\t\t\tpointerEvents=\"all\"\n\t\t\tx={x}\n\t\t\ty={y}\n\t\t\twidth={width}\n\t\t\theight={height}\n\t\t\tcursor={cursor}\n\t\t\t{...events}\n\t\t/>\n\t)\n}\n\nexport const RotateCornerHandle = function RotateCornerHandle({\n\tcx,\n\tcy,\n\ttargetSize,\n\tcorner,\n\tcursor,\n\tisHidden,\n\t'data-testid': testId,\n}: {\n\tcx: number\n\tcy: number\n\ttargetSize: number\n\tcorner: RotateCorner\n\tcursor?: string\n\tisHidden: boolean\n\t'data-testid'?: string\n}) {\n\tconst events = useSelectionEvents(corner)\n\tconst msg = useTranslation()\n\tconst label = msg(`handle.rotate.${corner}`)\n\n\treturn (\n\t\t<rect\n\t\t\tclassName={classNames('tl-transparent', 'tl-rotate-corner', { 'tl-hidden': isHidden })}\n\t\t\tdata-testid={testId}\n\t\t\trole=\"button\"\n\t\t\taria-label={label}\n\t\t\tpointerEvents=\"all\"\n\t\t\tx={toDomPrecision(cx - targetSize * 3)}\n\t\t\ty={toDomPrecision(cy - targetSize * 3)}\n\t\t\twidth={toDomPrecision(Math.max(1, targetSize * 3))}\n\t\t\theight={toDomPrecision(Math.max(1, targetSize * 3))}\n\t\t\tcursor={cursor}\n\t\t\t{...events}\n\t\t/>\n\t)\n}\n\nconst SQUARE_ROOT_PI = Math.sqrt(Math.PI)\n\nexport const MobileRotateHandle = function RotateHandle({\n\tcx,\n\tcy,\n\tsize,\n\tisHidden,\n\t'data-testid': testId,\n}: {\n\tcx: number\n\tcy: number\n\tsize: number\n\tisHidden: boolean\n\t'data-testid'?: string\n}) {\n\tconst events = useSelectionEvents('mobile_rotate')\n\n\tconst editor = useEditor()\n\tconst zoom = useValue('zoom level', () => editor.getZoomLevel(), [editor])\n\tconst bgRadius = Math.max(14 * (1 / zoom), 20 / Math.max(1, zoom))\n\tconst msg = useTranslation()\n\treturn (\n\t\t<g role=\"button\" aria-label={msg('handle.rotate.mobile_rotate')}>\n\t\t\t<circle\n\t\t\t\tdata-testid={testId}\n\t\t\t\tpointerEvents=\"all\"\n\t\t\t\tclassName={classNames('tl-transparent', 'tl-mobile-rotate__bg', { 'tl-hidden': isHidden })}\n\t\t\t\tcx={cx}\n\t\t\t\tcy={cy}\n\t\t\t\tr={bgRadius}\n\t\t\t\t{...events}\n\t\t\t/>\n\t\t\t<circle\n\t\t\t\tclassName={classNames('tl-mobile-rotate__fg', { 'tl-hidden': isHidden })}\n\t\t\t\tcx={cx}\n\t\t\t\tcy={cy}\n\t\t\t\tr={size / SQUARE_ROOT_PI}\n\t\t\t/>\n\t\t</g>\n\t)\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\tBox,\n\tHALF_PI,\n\tRotateCorner,\n\tTLEmbedShape,\n\tTLImageShape,\n\tTLSelectionForegroundProps,\n\tTLTextShape,\n\tTLVideoShape,\n\tgetCursor,\n\ttlenv,\n\ttoDomPrecision,\n\ttrack,\n\tuseEditor,\n\tuseSelectionEvents,\n\tuseTransform,\n\tuseValue,\n} from '@tldraw/editor'\nimport classNames from 'classnames'\nimport { PointerEventHandler, useRef } from 'react'\nimport { useReadonly } from '../ui/hooks/useReadonly'\nimport { useTranslation } from '../ui/hooks/useTranslation/useTranslation'\nimport { TldrawCropHandles } from './TldrawCropHandles'\n\n/** @public */\nexport const TldrawSelectionForeground = track(function TldrawSelectionForeground({\n\tbounds,\n\trotation,\n}: TLSelectionForegroundProps) {\n\tconst editor = useEditor()\n\tconst msg = useTranslation()\n\tconst rSvg = useRef<SVGSVGElement>(null)\n\n\tconst isReadonlyMode = useReadonly()\n\tconst topEvents = useSelectionEvents('top')\n\tconst rightEvents = useSelectionEvents('right')\n\tconst bottomEvents = useSelectionEvents('bottom')\n\tconst leftEvents = useSelectionEvents('left')\n\tconst topLeftEvents = useSelectionEvents('top_left')\n\tconst topRightEvents = useSelectionEvents('top_right')\n\tconst bottomRightEvents = useSelectionEvents('bottom_right')\n\tconst bottomLeftEvents = useSelectionEvents('bottom_left')\n\n\tconst isDefaultCursor = editor.getInstanceState().cursor.type === 'default'\n\tconst isCoarsePointer = editor.getInstanceState().isCoarsePointer\n\n\tconst onlyShape = editor.getOnlySelectedShape()\n\tconst isLockedShape = onlyShape && editor.isShapeOrAncestorLocked(onlyShape)\n\n\t// if all shapes have an expandBy for the selection outline, we can expand by the l\n\tconst expandOutlineBy = onlyShape\n\t\t? editor.getShapeUtil(onlyShape).expandSelectionOutlinePx(onlyShape)\n\t\t: 0\n\n\tconst expandedBounds =\n\t\texpandOutlineBy instanceof Box\n\t\t\t? bounds.clone().expand(expandOutlineBy).zeroFix()\n\t\t\t: bounds.clone().expandBy(expandOutlineBy).zeroFix()\n\n\tconst selectionRotation = editor.getSelectionRotation()\n\tconst isShapeTooCloseToContextualToolbar =\n\t\tselectionRotation / HALF_PI > 1.6 && selectionRotation / HALF_PI < 2.4\n\tuseTransform(rSvg, bounds?.x, bounds?.y, 1, selectionRotation, {\n\t\tx: expandedBounds.x - bounds.x,\n\t\ty: expandedBounds.y - bounds.y,\n\t})\n\n\tif (onlyShape && editor.isShapeHidden(onlyShape)) return null\n\n\tconst zoom = editor.getZoomLevel()\n\tconst isChangingStyle = editor.getInstanceState().isChangingStyle\n\n\tconst width = expandedBounds.width\n\tconst height = expandedBounds.height\n\n\tconst size = 8 / zoom\n\tconst isTinyX = width < size * 2\n\tconst isTinyY = height < size * 2\n\n\tconst isSmallX = width < size * 4\n\tconst isSmallY = height < size * 4\n\tconst isSmallCropX = width < size * 5\n\tconst isSmallCropY = height < size * 5\n\n\tconst mobileHandleMultiplier = isCoarsePointer ? 1.75 : 1\n\tconst targetSize = (6 / zoom) * mobileHandleMultiplier\n\n\tconst targetSizeX = (isSmallX ? targetSize / 2 : targetSize) * (mobileHandleMultiplier * 0.75)\n\tconst targetSizeY = (isSmallY ? targetSize / 2 : targetSize) * (mobileHandleMultiplier * 0.75)\n\n\tconst showSelectionBounds =\n\t\t(onlyShape ? !editor.getShapeUtil(onlyShape).hideSelectionBoundsFg(onlyShape) : true) &&\n\t\t!isChangingStyle\n\n\tlet shouldDisplayBox =\n\t\t(showSelectionBounds &&\n\t\t\teditor.isInAny(\n\t\t\t\t'select.idle',\n\t\t\t\t'select.brushing',\n\t\t\t\t'select.scribble_brushing',\n\t\t\t\t'select.pointing_canvas',\n\t\t\t\t'select.pointing_selection',\n\t\t\t\t'select.pointing_shape',\n\t\t\t\t'select.crop.idle',\n\t\t\t\t'select.crop.pointing_crop',\n\t\t\t\t'select.crop.pointing_crop_handle',\n\t\t\t\t'select.pointing_resize_handle'\n\t\t\t)) ||\n\t\t(showSelectionBounds &&\n\t\t\teditor.isIn('select.resizing') &&\n\t\t\tonlyShape &&\n\t\t\teditor.isShapeOfType<TLTextShape>(onlyShape, 'text'))\n\n\tif (onlyShape && shouldDisplayBox) {\n\t\tif (tlenv.isFirefox && editor.isShapeOfType<TLEmbedShape>(onlyShape, 'embed')) {\n\t\t\tshouldDisplayBox = false\n\t\t}\n\t}\n\n\tconst showCropHandles =\n\t\teditor.isInAny(\n\t\t\t'select.crop.idle',\n\t\t\t'select.crop.pointing_crop',\n\t\t\t'select.crop.pointing_crop_handle'\n\t\t) &&\n\t\t!isChangingStyle &&\n\t\t!isReadonlyMode\n\n\tconst shouldDisplayControls =\n\t\teditor.isInAny(\n\t\t\t'select.idle',\n\t\t\t'select.pointing_selection',\n\t\t\t'select.pointing_shape',\n\t\t\t'select.crop.idle'\n\t\t) &&\n\t\t!isChangingStyle &&\n\t\t!isReadonlyMode\n\n\tconst showCornerRotateHandles =\n\t\t!isCoarsePointer &&\n\t\t!(isTinyX || isTinyY) &&\n\t\t(shouldDisplayControls || showCropHandles) &&\n\t\t(onlyShape ? !editor.getShapeUtil(onlyShape).hideRotateHandle(onlyShape) : true) &&\n\t\t!isLockedShape\n\n\tconst showMobileRotateHandle =\n\t\tisCoarsePointer &&\n\t\t(!isSmallX || !isSmallY) &&\n\t\t(shouldDisplayControls || showCropHandles) &&\n\t\t(onlyShape ? !editor.getShapeUtil(onlyShape).hideRotateHandle(onlyShape) : true) &&\n\t\t!isLockedShape\n\n\tconst showResizeHandles =\n\t\tshouldDisplayControls &&\n\t\t(onlyShape\n\t\t\t? editor.getShapeUtil(onlyShape).canResize(onlyShape) &&\n\t\t\t\t!editor.getShapeUtil(onlyShape).hideResizeHandles(onlyShape)\n\t\t\t: true) &&\n\t\t!showCropHandles &&\n\t\t!isLockedShape\n\n\tconst hideAlternateCornerHandles = isTinyX || isTinyY\n\tconst showOnlyOneHandle = isTinyX && isTinyY\n\tconst hideAlternateCropHandles = isSmallCropX || isSmallCropY\n\n\tconst showHandles = showResizeHandles || showCropHandles\n\tconst hideRotateCornerHandles = !showCornerRotateHandles\n\tconst hideMobileRotateHandle = !shouldDisplayControls || !showMobileRotateHandle\n\tconst hideTopLeftCorner = !shouldDisplayControls || !showHandles\n\tconst hideTopRightCorner = !shouldDisplayControls || !showHandles || hideAlternateCornerHandles\n\tconst hideBottomLeftCorner = !shouldDisplayControls || !showHandles || hideAlternateCornerHandles\n\tconst hideBottomRightCorner =\n\t\t!shouldDisplayControls || !showHandles || (showOnlyOneHandle && !showCropHandles)\n\n\t// If we're showing crop handles, then show the edges too.\n\t// If we're showing resize handles, then show the edges only\n\t// if we're not hiding them for some other reason.\n\tlet hideVerticalEdgeTargets = true\n\t// The same logic above applies here, except another nuance is that\n\t// we enable resizing for text on mobile (coarse).\n\tlet hideHorizontalEdgeTargets = true\n\n\tif (showCropHandles) {\n\t\thideVerticalEdgeTargets = hideAlternateCropHandles\n\t\thideHorizontalEdgeTargets = hideAlternateCropHandles\n\t} else if (showResizeHandles) {\n\t\thideVerticalEdgeTargets = hideAlternateCornerHandles || showOnlyOneHandle || isCoarsePointer\n\t\tconst isMobileAndTextShape = isCoarsePointer && onlyShape && onlyShape.type === 'text'\n\t\thideHorizontalEdgeTargets = hideVerticalEdgeTargets && !isMobileAndTextShape\n\t}\n\n\tconst textHandleHeight = Math.min(24 / zoom, height - targetSizeY * 3)\n\tconst showTextResizeHandles =\n\t\tshouldDisplayControls &&\n\t\tisCoarsePointer &&\n\t\tonlyShape &&\n\t\teditor.isShapeOfType<TLTextShape>(onlyShape, 'text') &&\n\t\ttextHandleHeight * zoom >= 4\n\tconst isMediaShape =\n\t\tonlyShape &&\n\t\t(editor.isShapeOfType<TLImageShape>(onlyShape, 'image') ||\n\t\t\teditor.isShapeOfType<TLVideoShape>(onlyShape, 'video'))\n\n\treturn (\n\t\t<svg\n\t\t\tclassName=\"tl-overlays__item tl-selection__fg\"\n\t\t\tdata-testid=\"selection-foreground\"\n\t\t\taria-hidden=\"true\"\n\t\t>\n\t\t\t<g ref={rSvg}>\n\t\t\t\t{shouldDisplayBox && (\n\t\t\t\t\t<rect\n\t\t\t\t\t\tclassName=\"tl-selection__fg__outline\"\n\t\t\t\t\t\twidth={toDomPrecision(width)}\n\t\t\t\t\t\theight={toDomPrecision(height)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.top-left\"\n\t\t\t\t\tcx={0}\n\t\t\t\t\tcy={0}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"top_left_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nwse-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.top-right\"\n\t\t\t\t\tcx={width + targetSize * 3}\n\t\t\t\t\tcy={0}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"top_right_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nesw-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.bottom-left\"\n\t\t\t\t\tcx={0}\n\t\t\t\t\tcy={height + targetSize * 3}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"bottom_left_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('swne-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<RotateCornerHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.bottom-right\"\n\t\t\t\t\tcx={width + targetSize * 3}\n\t\t\t\t\tcy={height + targetSize * 3}\n\t\t\t\t\ttargetSize={targetSize}\n\t\t\t\t\tcorner=\"bottom_right_rotate\"\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('senw-rotate', rotation) : undefined}\n\t\t\t\t\tisHidden={hideRotateCornerHandles}\n\t\t\t\t/>\n\t\t\t\t<MobileRotateHandle\n\t\t\t\t\tdata-testid=\"selection.rotate.mobile\"\n\t\t\t\t\tcx={isSmallX ? -targetSize * 1.5 : width / 2}\n\t\t\t\t\tcy={\n\t\t\t\t\t\tisSmallX\n\t\t\t\t\t\t\t? height / 2\n\t\t\t\t\t\t\t: isMediaShape && !isShapeTooCloseToContextualToolbar\n\t\t\t\t\t\t\t\t? height + targetSize * 1.5\n\t\t\t\t\t\t\t\t: -targetSize * 1.5\n\t\t\t\t\t}\n\t\t\t\t\tsize={size}\n\t\t\t\t\tisHidden={hideMobileRotateHandle}\n\t\t\t\t/>\n\t\t\t\t{/* Targets */}\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideVerticalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.top\"\n\t\t\t\t\tariaLabel={msg('handle.resize-top')}\n\t\t\t\t\tx={0}\n\t\t\t\t\ty={toDomPrecision(0 - (isSmallY ? targetSizeY * 2 : targetSizeY))}\n\t\t\t\t\twidth={toDomPrecision(width)}\n\t\t\t\t\theight={toDomPrecision(Math.max(1, targetSizeY * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ns-resize', rotation) : undefined}\n\t\t\t\t\tevents={topEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideHorizontalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.right\"\n\t\t\t\t\tariaLabel={msg('handle.resize-right')}\n\t\t\t\t\tx={toDomPrecision(width - (isSmallX ? 0 : targetSizeX))}\n\t\t\t\t\ty={0}\n\t\t\t\t\theight={toDomPrecision(height)}\n\t\t\t\t\twidth={toDomPrecision(Math.max(1, targetSizeX * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ew-resize', rotation) : undefined}\n\t\t\t\t\tevents={rightEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideVerticalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.bottom\"\n\t\t\t\t\tariaLabel={msg('handle.resize-bottom')}\n\t\t\t\t\tx={0}\n\t\t\t\t\ty={toDomPrecision(height - (isSmallY ? 0 : targetSizeY))}\n\t\t\t\t\twidth={toDomPrecision(width)}\n\t\t\t\t\theight={toDomPrecision(Math.max(1, targetSizeY * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ns-resize', rotation) : undefined}\n\t\t\t\t\tevents={bottomEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideHorizontalEdgeTargets}\n\t\t\t\t\tdataTestId=\"selection.resize.left\"\n\t\t\t\t\tariaLabel={msg('handle.resize-left')}\n\t\t\t\t\tx={toDomPrecision(0 - (isSmallX ? targetSizeX * 2 : targetSizeX))}\n\t\t\t\t\ty={0}\n\t\t\t\t\theight={toDomPrecision(height)}\n\t\t\t\t\twidth={toDomPrecision(Math.max(1, targetSizeX * 2))}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('ew-resize', rotation) : undefined}\n\t\t\t\t\tevents={leftEvents}\n\t\t\t\t/>\n\t\t\t\t{/* Corner Targets */}\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideTopLeftCorner}\n\t\t\t\t\tdataTestId=\"selection.target.top-left\"\n\t\t\t\t\tariaLabel={msg('handle.resize-top-left')}\n\t\t\t\t\tx={toDomPrecision(0 - (isSmallX ? targetSizeX * 2 : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(0 - (isSmallY ? targetSizeY * 2 : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nwse-resize', rotation) : undefined}\n\t\t\t\t\tevents={topLeftEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideTopRightCorner}\n\t\t\t\t\tdataTestId=\"selection.target.top-right\"\n\t\t\t\t\tariaLabel={msg('handle.resize-top-right')}\n\t\t\t\t\tx={toDomPrecision(width - (isSmallX ? 0 : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(0 - (isSmallY ? targetSizeY * 2 : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nesw-resize', rotation) : undefined}\n\t\t\t\t\tevents={topRightEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideBottomRightCorner}\n\t\t\t\t\tdataTestId=\"selection.target.bottom-right\"\n\t\t\t\t\tariaLabel={msg('handle.resize-bottom-right')}\n\t\t\t\t\tx={toDomPrecision(width - (isSmallX ? targetSizeX : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(height - (isSmallY ? targetSizeY : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nwse-resize', rotation) : undefined}\n\t\t\t\t\tevents={bottomRightEvents}\n\t\t\t\t/>\n\t\t\t\t<ResizeHandle\n\t\t\t\t\thide={hideBottomLeftCorner}\n\t\t\t\t\tdataTestId=\"selection.target.bottom-left\"\n\t\t\t\t\tariaLabel={msg('handle.resize-bottom-left')}\n\t\t\t\t\tx={toDomPrecision(0 - (isSmallX ? targetSizeX * 3 : targetSizeX * 1.5))}\n\t\t\t\t\ty={toDomPrecision(height - (isSmallY ? 0 : targetSizeY * 1.5))}\n\t\t\t\t\twidth={toDomPrecision(targetSizeX * 3)}\n\t\t\t\t\theight={toDomPrecision(targetSizeY * 3)}\n\t\t\t\t\tcursor={isDefaultCursor ? getCursor('nesw-resize', rotation) : undefined}\n\t\t\t\t\tevents={bottomLeftEvents}\n\t\t\t\t/>\n\t\t\t\t{/* Resize Handles */}\n\t\t\t\t{showResizeHandles && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.top-left\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideTopLeftCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.top-right\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideTopRightCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(width - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.bottom-right\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideBottomRightCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(width - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(height - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.resize.bottom-left\"\n\t\t\t\t\t\t\tclassName={classNames('tl-corner-handle', {\n\t\t\t\t\t\t\t\t'tl-hidden': hideBottomLeftCorner,\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\tx={toDomPrecision(0 - size / 2)}\n\t\t\t\t\t\t\ty={toDomPrecision(height - size / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size)}\n\t\t\t\t\t\t\theight={toDomPrecision(size)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t\t{showTextResizeHandles && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.text-resize.left.handle\"\n\t\t\t\t\t\t\tclassName=\"tl-text-handle\"\n\t\t\t\t\t\t\tx={toDomPrecision(0 - size / 4)}\n\t\t\t\t\t\t\ty={toDomPrecision(height / 2 - textHandleHeight / 2)}\n\t\t\t\t\t\t\trx={size / 4}\n\t\t\t\t\t\t\twidth={toDomPrecision(size / 2)}\n\t\t\t\t\t\t\theight={toDomPrecision(textHandleHeight)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<rect\n\t\t\t\t\t\t\tdata-testid=\"selection.text-resize.right.handle\"\n\t\t\t\t\t\t\tclassName=\"tl-text-handle\"\n\t\t\t\t\t\t\trx={size / 4}\n\t\t\t\t\t\t\tx={toDomPrecision(width - size / 4)}\n\t\t\t\t\t\t\ty={toDomPrecision(height / 2 - textHandleHeight / 2)}\n\t\t\t\t\t\t\twidth={toDomPrecision(size / 2)}\n\t\t\t\t\t\t\theight={toDomPrecision(textHandleHeight)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t\t{/* Crop Handles */}\n\t\t\t\t{showCropHandles && (\n\t\t\t\t\t<TldrawCropHandles\n\t\t\t\t\t\t{...{\n\t\t\t\t\t\t\tsize,\n\t\t\t\t\t\t\twidth,\n\t\t\t\t\t\t\theight,\n\t\t\t\t\t\t\thideAlternateHandles: hideAlternateCropHandles,\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</g>\n\t\t</svg>\n\t)\n})\n\nexport const ResizeHandle = function ResizeHandle({\n\thide,\n\tdataTestId,\n\tariaLabel,\n\tx,\n\ty,\n\twidth,\n\theight,\n\tcursor,\n\tevents,\n}: {\n\thide: boolean\n\tdataTestId: string\n\tariaLabel: string\n\tx: number\n\ty: number\n\twidth: number\n\theight: number\n\tcursor?: string\n\tevents: {\n\t\tonPointerUp: PointerEventHandler<Element>\n\t\tonPointerMove(e: React.PointerEvent<Element>): void\n\t\tonPointerDown: PointerEventHandler<Element>\n\t}\n}) {\n\treturn (\n\t\t<rect\n\t\t\tclassName={classNames('tl-resize-handle', 'tl-transparent', {\n\t\t\t\t'tl-hidden': hide,\n\t\t\t})}\n\t\t\tdata-testid={dataTestId}\n\t\t\trole=\"button\"\n\t\t\taria-label={ariaLabel}\n\t\t\tpointerEvents=\"all\"\n\t\t\tx={x}\n\t\t\ty={y}\n\t\t\twidth={width}\n\t\t\theight={height}\n\t\t\tcursor={cursor}\n\t\t\t{...events}\n\t\t/>\n\t)\n}\n\nexport const RotateCornerHandle = function RotateCornerHandle({\n\tcx,\n\tcy,\n\ttargetSize,\n\tcorner,\n\tcursor,\n\tisHidden,\n\t'data-testid': testId,\n}: {\n\tcx: number\n\tcy: number\n\ttargetSize: number\n\tcorner: RotateCorner\n\tcursor?: string\n\tisHidden: boolean\n\t'data-testid'?: string\n}) {\n\tconst events = useSelectionEvents(corner)\n\tconst msg = useTranslation()\n\tconst label = msg(`handle.rotate.${corner}`)\n\n\treturn (\n\t\t<rect\n\t\t\tclassName={classNames('tl-transparent', 'tl-rotate-corner', { 'tl-hidden': isHidden })}\n\t\t\tdata-testid={testId}\n\t\t\trole=\"button\"\n\t\t\taria-label={label}\n\t\t\tpointerEvents=\"all\"\n\t\t\tx={toDomPrecision(cx - targetSize * 3)}\n\t\t\ty={toDomPrecision(cy - targetSize * 3)}\n\t\t\twidth={toDomPrecision(Math.max(1, targetSize * 3))}\n\t\t\theight={toDomPrecision(Math.max(1, targetSize * 3))}\n\t\t\tcursor={cursor}\n\t\t\t{...events}\n\t\t/>\n\t)\n}\n\nconst SQUARE_ROOT_PI = Math.sqrt(Math.PI)\n\nexport const MobileRotateHandle = function RotateHandle({\n\tcx,\n\tcy,\n\tsize,\n\tisHidden,\n\t'data-testid': testId,\n}: {\n\tcx: number\n\tcy: number\n\tsize: number\n\tisHidden: boolean\n\t'data-testid'?: string\n}) {\n\tconst events = useSelectionEvents('mobile_rotate')\n\n\tconst editor = useEditor()\n\tconst zoom = useValue('zoom level', () => editor.getZoomLevel(), [editor])\n\tconst bgRadius = Math.max(14 * (1 / zoom), 20 / Math.max(1, zoom))\n\tconst msg = useTranslation()\n\treturn (\n\t\t<g role=\"button\" aria-label={msg('handle.rotate.mobile_rotate')}>\n\t\t\t<circle\n\t\t\t\tdata-testid={testId}\n\t\t\t\tpointerEvents=\"all\"\n\t\t\t\tclassName={classNames('tl-transparent', 'tl-mobile-rotate__bg', { 'tl-hidden': isHidden })}\n\t\t\t\tcx={cx}\n\t\t\t\tcy={cy}\n\t\t\t\tr={bgRadius}\n\t\t\t\t{...events}\n\t\t\t/>\n\t\t\t<circle\n\t\t\t\tclassName={classNames('tl-mobile-rotate__fg', { 'tl-hidden': isHidden })}\n\t\t\t\tcx={cx}\n\t\t\t\tcy={cy}\n\t\t\t\tr={size / SQUARE_ROOT_PI}\n\t\t\t/>\n\t\t</g>\n\t)\n}\n"],
+  "mappings": "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",
   "names": ["TldrawSelectionForeground", "ResizeHandle", "RotateCornerHandle"]
 }

package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs

@@ -65,7 +65,8 @@ function TldrawUiMenuItem({
           children: [
             iconLeft && /* @__PURE__ */ jsx(TldrawUiButtonIcon, { icon: iconLeft, small: true }),
             /* @__PURE__ */ jsx(TldrawUiButtonLabel, { children: labelStr }),
-            kbd && /* @__PURE__ */ jsx(TldrawUiKbd, { children: kbd })
+            kbd && /* @__PURE__ */ jsx(TldrawUiKbd, { children: kbd }),
+            icon && /* @__PURE__ */ jsx(TldrawUiButtonIcon, { icon, small: true })
           ]
         }
       ) });

package/dist-esm/lib/ui/components/primitives/menus/TldrawUiMenuItem.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/lib/ui/components/primitives/menus/TldrawUiMenuItem.tsx"],
-  "sourcesContent": ["import {\n\texhaustiveSwitchError,\n\tgetPointerInfo,\n\tpreventDefault,\n\tTLPointerEventInfo,\n\tuseEditor,\n\tVec,\n\tVecModel,\n} from '@tldraw/editor'\nimport { ContextMenu as _ContextMenu } from 'radix-ui'\nimport { useMemo, useState } from 'react'\nimport { unwrapLabel } from '../../../context/actions'\nimport { TLUiEventSource } from '../../../context/events'\nimport { useReadonly } from '../../../hooks/useReadonly'\nimport { TLUiToolItem } from '../../../hooks/useTools'\nimport { TLUiTranslationKey } from '../../../hooks/useTranslation/TLUiTranslationKey'\nimport { useTranslation } from '../../../hooks/useTranslation/useTranslation'\nimport { kbdStr } from '../../../kbd-utils'\nimport { Spinner } from '../../Spinner'\nimport { TldrawUiButton } from '../Button/TldrawUiButton'\nimport { TldrawUiButtonIcon } from '../Button/TldrawUiButtonIcon'\nimport { TldrawUiButtonLabel } from '../Button/TldrawUiButtonLabel'\nimport { TldrawUiDropdownMenuItem } from '../TldrawUiDropdownMenu'\nimport { TLUiIconJsx } from '../TldrawUiIcon'\nimport { TldrawUiKbd } from '../TldrawUiKbd'\nimport { TldrawUiToolbarButton } from '../TldrawUiToolbar'\nimport { tooltipManager } from '../TldrawUiTooltip'\nimport { useTldrawUiMenuContext } from './TldrawUiMenuContext'\n\n/** @public */\nexport interface TLUiMenuItemProps<\n\tTranslationKey extends string = string,\n\tIconType extends string = string,\n> {\n\tid: string\n\t/**\n\t * The icon to display on the item. Icons are only shown in certain menu types.\n\t */\n\ticon?: IconType | TLUiIconJsx\n\t/**\n\t * An icon to display to the left of the menu item.\n\t */\n\ticonLeft?: IconType | TLUiIconJsx\n\t/**\n\t * The keyboard shortcut to display on the item.\n\t */\n\tkbd?: string\n\t/**\n\t * The label to display on the item. If it's a string, it will be translated. If it's an object, the keys will be used as the language keys and the values will be translated.\n\t */\n\tlabel?: TranslationKey | { [key: string]: TranslationKey }\n\t/**\n\t * If the editor is in readonly mode and the item is not marked as readonlyok, it will not be rendered.\n\t */\n\treadonlyOk?: boolean\n\t/**\n\t * The function to call when the item is clicked.\n\t */\n\tonSelect(source: TLUiEventSource): Promise<void> | void\n\t/**\n\t * Whether this item should be disabled.\n\t */\n\tdisabled?: boolean\n\t/**\n\t * Prevent the menu from closing when the item is clicked\n\t */\n\tnoClose?: boolean\n\t/**\n\t * Whether to show a spinner on the item.\n\t */\n\tspinner?: boolean\n\t/**\n\t * Whether the item is selected.\n\t */\n\tisSelected?: boolean\n\t/**\n\t * The function to call when the item is dragged. If this is provided, the item will be draggable.\n\t */\n\tonDragStart?(source: TLUiEventSource, info: TLPointerEventInfo): void\n}\n\n/** @public @react */\nexport function TldrawUiMenuItem<\n\tTranslationKey extends string = string,\n\tIconType extends string = string,\n>({\n\tdisabled = false,\n\tspinner = false,\n\treadonlyOk = false,\n\tid,\n\tkbd,\n\tlabel,\n\ticon,\n\ticonLeft,\n\tonSelect,\n\tnoClose,\n\tisSelected,\n\tonDragStart,\n}: TLUiMenuItemProps<TranslationKey, IconType>) {\n\tconst { type: menuType, sourceId } = useTldrawUiMenuContext()\n\n\tconst msg = useTranslation()\n\n\tconst [disableClicks, setDisableClicks] = useState(false)\n\n\tconst isReadonlyMode = useReadonly()\n\tif (isReadonlyMode && !readonlyOk) return null\n\n\tconst labelToUse = unwrapLabel(label, menuType)\n\tconst kbdToUse = kbd ? kbdStr(kbd) : undefined\n\n\tconst labelStr = labelToUse ? msg(labelToUse as TLUiTranslationKey) : undefined\n\tconst titleStr = labelStr && kbdToUse ? `${labelStr} ${kbdToUse}` : labelStr\n\n\tswitch (menuType) {\n\t\tcase 'menu': {\n\t\t\treturn (\n\t\t\t\t<TldrawUiDropdownMenuItem>\n\t\t\t\t\t<TldrawUiButton\n\t\t\t\t\t\ttype=\"menu\"\n\t\t\t\t\t\tdata-testid={`${sourceId}.${id}`}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\tif (noClose) {\n\t\t\t\t\t\t\t\tpreventDefault(e)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif (disableClicks) {\n\t\t\t\t\t\t\t\tsetDisableClicks(false)\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tonSelect(sourceId)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{iconLeft && <TldrawUiButtonIcon icon={iconLeft} small />}\n\t\t\t\t\t\t<TldrawUiButtonLabel>{labelStr}</TldrawUiButtonLabel>\n\t\t\t\t\t\t{kbd && <TldrawUiKbd>{kbd}</TldrawUiKbd>}\n\t\t\t\t\t</TldrawUiButton>\n\t\t\t\t</TldrawUiDropdownMenuItem>\n\t\t\t)\n\t\t}\n\t\tcase 'context-menu': {\n\t\t\t// Hide disabled context menu items\n\t\t\tif (disabled) return null\n\n\t\t\treturn (\n\t\t\t\t<_ContextMenu.Item\n\t\t\t\t\tdir=\"ltr\"\n\t\t\t\t\tdraggable={false}\n\t\t\t\t\tclassName=\"tlui-button tlui-button__menu\"\n\t\t\t\t\tdata-testid={`${sourceId}.${id}`}\n\t\t\t\t\tonSelect={(e) => {\n\t\t\t\t\t\tif (noClose) preventDefault(e)\n\t\t\t\t\t\tif (disableClicks) {\n\t\t\t\t\t\t\tsetDisableClicks(false)\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tonSelect(sourceId)\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<span className=\"tlui-button__label\" draggable={false}>\n\t\t\t\t\t\t{labelStr}\n\t\t\t\t\t</span>\n\t\t\t\t\t{iconLeft && <TldrawUiButtonIcon icon={iconLeft} small />}\n\t\t\t\t\t{kbd && <TldrawUiKbd>{kbd}</TldrawUiKbd>}\n\t\t\t\t\t{spinner && <Spinner />}\n\t\t\t\t</_ContextMenu.Item>\n\t\t\t)\n\t\t}\n\t\tcase 'small-icons':\n\t\tcase 'icons': {\n\t\t\treturn (\n\t\t\t\t<TldrawUiToolbarButton\n\t\t\t\t\tdata-testid={`${sourceId}.${id}`}\n\t\t\t\t\ttype=\"icon\"\n\t\t\t\t\ttitle={titleStr}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={() => onSelect(sourceId)}\n\t\t\t\t>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} small />\n\t\t\t\t</TldrawUiToolbarButton>\n\t\t\t)\n\t\t}\n\t\tcase 'keyboard-shortcuts': {\n\t\t\tif (!kbd) {\n\t\t\t\tconsole.warn(\n\t\t\t\t\t`Menu item '${label}' isn't shown in the keyboard shortcuts dialog because it doesn't have a keyboard shortcut.`\n\t\t\t\t)\n\t\t\t\treturn null\n\t\t\t}\n\n\t\t\treturn (\n\t\t\t\t<div className=\"tlui-shortcuts-dialog__key-pair\" data-testid={`${sourceId}.${id}`}>\n\t\t\t\t\t<div className=\"tlui-shortcuts-dialog__key-pair__key\">{labelStr}</div>\n\t\t\t\t\t<div className=\"tlui-shortcuts-dialog__key-pair__value\">\n\t\t\t\t\t\t<TldrawUiKbd visibleOnMobileLayout>{kbd}</TldrawUiKbd>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t)\n\t\t}\n\t\tcase 'helper-buttons': {\n\t\t\treturn (\n\t\t\t\t<TldrawUiButton type=\"low\" onClick={() => onSelect(sourceId)}>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t\t\t<TldrawUiButtonLabel>{labelStr}</TldrawUiButtonLabel>\n\t\t\t\t</TldrawUiButton>\n\t\t\t)\n\t\t}\n\t\tcase 'toolbar': {\n\t\t\tif (onDragStart) {\n\t\t\t\treturn (\n\t\t\t\t\t<DraggableToolbarButton\n\t\t\t\t\t\tid={id}\n\t\t\t\t\t\ticon={icon}\n\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\tonDragStart={onDragStart}\n\t\t\t\t\t\tlabelStr={labelStr}\n\t\t\t\t\t\ttitleStr={titleStr}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t}\n\t\t\treturn (\n\t\t\t\t<TldrawUiToolbarButton\n\t\t\t\t\taria-label={labelStr}\n\t\t\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\t\t\tdata-testid={`tools.${id}`}\n\t\t\t\t\tdata-value={id}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={() => onSelect('toolbar')}\n\t\t\t\t\tonTouchStart={(e) => {\n\t\t\t\t\t\tpreventDefault(e)\n\t\t\t\t\t\tonSelect('toolbar')\n\t\t\t\t\t}}\n\t\t\t\t\ttitle={titleStr}\n\t\t\t\t\ttype=\"tool\"\n\t\t\t\t>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t\t</TldrawUiToolbarButton>\n\t\t\t)\n\t\t}\n\t\tcase 'toolbar-overflow': {\n\t\t\tif (onDragStart) {\n\t\t\t\treturn (\n\t\t\t\t\t<DraggableToolbarButton\n\t\t\t\t\t\tid={id}\n\t\t\t\t\t\ticon={icon}\n\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\tonDragStart={onDragStart}\n\t\t\t\t\t\tlabelStr={labelStr}\n\t\t\t\t\t\ttitleStr={titleStr}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t\toverflow\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t}\n\t\t\treturn (\n\t\t\t\t<TldrawUiToolbarButton\n\t\t\t\t\taria-label={labelStr}\n\t\t\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\t\t\tisActive={isSelected}\n\t\t\t\t\tdata-testid={`tools.more.${id}`}\n\t\t\t\t\tdata-value={id}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={() => onSelect('toolbar')}\n\t\t\t\t\ttitle={titleStr}\n\t\t\t\t\ttype=\"icon\"\n\t\t\t\t>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t\t</TldrawUiToolbarButton>\n\t\t\t)\n\t\t}\n\t\tdefault: {\n\t\t\tthrow exhaustiveSwitchError(menuType)\n\t\t}\n\t}\n}\n\nfunction useDraggableEvents(\n\tonDragStart: TLUiToolItem['onDragStart'],\n\tonSelect: TLUiToolItem['onSelect']\n) {\n\tconst editor = useEditor()\n\tconst events = useMemo(() => {\n\t\tlet state = { name: 'idle' } as\n\t\t\t| {\n\t\t\t\t\tname: 'idle'\n\t\t\t  }\n\t\t\t| {\n\t\t\t\t\tname: 'pointing'\n\t\t\t\t\tscreenSpaceStart: VecModel\n\t\t\t  }\n\t\t\t| {\n\t\t\t\t\tname: 'dragging'\n\t\t\t\t\tscreenSpaceStart: VecModel\n\t\t\t  }\n\t\t\t| {\n\t\t\t\t\tname: 'dragged'\n\t\t\t  }\n\n\t\tfunction handlePointerDown(e: React.PointerEvent<HTMLButtonElement>) {\n\t\t\tstate = {\n\t\t\t\tname: 'pointing',\n\t\t\t\tscreenSpaceStart: { x: e.clientX, y: e.clientY },\n\t\t\t}\n\n\t\t\te.currentTarget.setPointerCapture(e.pointerId)\n\t\t}\n\n\t\tfunction handlePointerMove(e: React.PointerEvent<HTMLButtonElement>) {\n\t\t\tif ((e as any).isSpecialRedispatchedEvent) return\n\n\t\t\tif (state.name === 'pointing') {\n\t\t\t\tconst distanceSq = Vec.Dist2(state.screenSpaceStart, { x: e.clientX, y: e.clientY })\n\t\t\t\tif (\n\t\t\t\t\tdistanceSq >\n\t\t\t\t\t(editor.getInstanceState().isCoarsePointer\n\t\t\t\t\t\t? editor.options.uiCoarseDragDistanceSquared\n\t\t\t\t\t\t: editor.options.uiDragDistanceSquared)\n\t\t\t\t) {\n\t\t\t\t\tconst screenSpaceStart = state.screenSpaceStart\n\t\t\t\t\tstate = {\n\t\t\t\t\t\tname: 'dragging',\n\t\t\t\t\t\tscreenSpaceStart,\n\t\t\t\t\t}\n\n\t\t\t\t\teditor.run(() => {\n\t\t\t\t\t\teditor.setCurrentTool('select')\n\n\t\t\t\t\t\t// Set origin point\n\t\t\t\t\t\teditor.dispatch({\n\t\t\t\t\t\t\ttype: 'pointer',\n\t\t\t\t\t\t\ttarget: 'canvas',\n\t\t\t\t\t\t\tname: 'pointer_down',\n\t\t\t\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t\t\t\t\tpoint: screenSpaceStart,\n\t\t\t\t\t\t})\n\n\t\t\t\t\t\t// Pointer down potentially selects shapes, so we need to deselect them.\n\t\t\t\t\t\teditor.selectNone()\n\n\t\t\t\t\t\t// start drag\n\t\t\t\t\t\tonDragStart?.('toolbar', {\n\t\t\t\t\t\t\ttype: 'pointer',\n\t\t\t\t\t\t\ttarget: 'canvas',\n\t\t\t\t\t\t\tname: 'pointer_move',\n\t\t\t\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t\t\t\t\tpoint: screenSpaceStart,\n\t\t\t\t\t\t})\n\n\t\t\t\t\t\ttooltipManager.hideAllTooltips()\n\t\t\t\t\t\teditor.getContainer().focus()\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tfunction handlePointerUp(e: React.PointerEvent<HTMLButtonElement>) {\n\t\t\tif ((e as any).isSpecialRedispatchedEvent) return\n\n\t\t\te.currentTarget.releasePointerCapture(e.pointerId)\n\n\t\t\teditor.dispatch({\n\t\t\t\ttype: 'pointer',\n\t\t\t\ttarget: 'canvas',\n\t\t\t\tname: 'pointer_up',\n\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t})\n\t\t}\n\n\t\tfunction handleClick() {\n\t\t\tif (state.name === 'dragging' || state.name === 'dragged') {\n\t\t\t\tstate = { name: 'idle' }\n\t\t\t\treturn true\n\t\t\t}\n\n\t\t\tstate = { name: 'idle' }\n\t\t\tonSelect?.('toolbar')\n\t\t}\n\n\t\treturn {\n\t\t\tonPointerDown: handlePointerDown,\n\t\t\tonPointerMove: handlePointerMove,\n\t\t\tonPointerUp: handlePointerUp,\n\t\t\tonClick: handleClick,\n\t\t}\n\t}, [onDragStart, editor, onSelect])\n\n\treturn events\n}\n\nfunction DraggableToolbarButton({\n\tid,\n\tlabelStr,\n\ttitleStr,\n\tdisabled,\n\tisSelected,\n\ticon,\n\tonSelect,\n\tonDragStart,\n\toverflow,\n}: {\n\tid: string\n\tdisabled: boolean\n\tlabelStr?: string\n\ttitleStr?: string\n\tisSelected?: boolean\n\ticon: TLUiMenuItemProps['icon']\n\tonSelect: TLUiMenuItemProps['onSelect']\n\tonDragStart: TLUiMenuItemProps['onDragStart']\n\toverflow?: boolean\n}) {\n\tconst events = useDraggableEvents(onDragStart, onSelect)\n\n\tif (overflow) {\n\t\treturn (\n\t\t\t<TldrawUiToolbarButton\n\t\t\t\taria-label={labelStr}\n\t\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\t\tisActive={isSelected}\n\t\t\t\tclassName=\"tlui-button-grid__button\"\n\t\t\t\tdata-testid={`tools.more.${id}`}\n\t\t\t\tdata-value={id}\n\t\t\t\tdisabled={disabled}\n\t\t\t\ttitle={titleStr}\n\t\t\t\ttype=\"icon\"\n\t\t\t\t{...events}\n\t\t\t>\n\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t</TldrawUiToolbarButton>\n\t\t)\n\t}\n\n\treturn (\n\t\t<TldrawUiToolbarButton\n\t\t\taria-label={labelStr}\n\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\tdata-testid={`tools.${id}`}\n\t\t\tdata-value={id}\n\t\t\tdisabled={disabled}\n\t\t\tonTouchStart={(e) => {\n\t\t\t\tpreventDefault(e)\n\t\t\t\tonSelect('toolbar')\n\t\t\t}}\n\t\t\ttitle={titleStr}\n\t\t\ttype=\"tool\"\n\t\t\t{...events}\n\t\t>\n\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t</TldrawUiToolbarButton>\n\t)\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\texhaustiveSwitchError,\n\tgetPointerInfo,\n\tpreventDefault,\n\tTLPointerEventInfo,\n\tuseEditor,\n\tVec,\n\tVecModel,\n} from '@tldraw/editor'\nimport { ContextMenu as _ContextMenu } from 'radix-ui'\nimport { useMemo, useState } from 'react'\nimport { unwrapLabel } from '../../../context/actions'\nimport { TLUiEventSource } from '../../../context/events'\nimport { useReadonly } from '../../../hooks/useReadonly'\nimport { TLUiToolItem } from '../../../hooks/useTools'\nimport { TLUiTranslationKey } from '../../../hooks/useTranslation/TLUiTranslationKey'\nimport { useTranslation } from '../../../hooks/useTranslation/useTranslation'\nimport { kbdStr } from '../../../kbd-utils'\nimport { Spinner } from '../../Spinner'\nimport { TldrawUiButton } from '../Button/TldrawUiButton'\nimport { TldrawUiButtonIcon } from '../Button/TldrawUiButtonIcon'\nimport { TldrawUiButtonLabel } from '../Button/TldrawUiButtonLabel'\nimport { TldrawUiDropdownMenuItem } from '../TldrawUiDropdownMenu'\nimport { TLUiIconJsx } from '../TldrawUiIcon'\nimport { TldrawUiKbd } from '../TldrawUiKbd'\nimport { TldrawUiToolbarButton } from '../TldrawUiToolbar'\nimport { tooltipManager } from '../TldrawUiTooltip'\nimport { useTldrawUiMenuContext } from './TldrawUiMenuContext'\n\n/** @public */\nexport interface TLUiMenuItemProps<\n\tTranslationKey extends string = string,\n\tIconType extends string = string,\n> {\n\tid: string\n\t/**\n\t * The icon to display on the item. Icons are only shown in certain menu types.\n\t */\n\ticon?: IconType | TLUiIconJsx\n\t/**\n\t * An icon to display to the left of the menu item.\n\t */\n\ticonLeft?: IconType | TLUiIconJsx\n\t/**\n\t * The keyboard shortcut to display on the item.\n\t */\n\tkbd?: string\n\t/**\n\t * The label to display on the item. If it's a string, it will be translated. If it's an object, the keys will be used as the language keys and the values will be translated.\n\t */\n\tlabel?: TranslationKey | { [key: string]: TranslationKey }\n\t/**\n\t * If the editor is in readonly mode and the item is not marked as readonlyok, it will not be rendered.\n\t */\n\treadonlyOk?: boolean\n\t/**\n\t * The function to call when the item is clicked.\n\t */\n\tonSelect(source: TLUiEventSource): Promise<void> | void\n\t/**\n\t * Whether this item should be disabled.\n\t */\n\tdisabled?: boolean\n\t/**\n\t * Prevent the menu from closing when the item is clicked\n\t */\n\tnoClose?: boolean\n\t/**\n\t * Whether to show a spinner on the item.\n\t */\n\tspinner?: boolean\n\t/**\n\t * Whether the item is selected.\n\t */\n\tisSelected?: boolean\n\t/**\n\t * The function to call when the item is dragged. If this is provided, the item will be draggable.\n\t */\n\tonDragStart?(source: TLUiEventSource, info: TLPointerEventInfo): void\n}\n\n/** @public @react */\nexport function TldrawUiMenuItem<\n\tTranslationKey extends string = string,\n\tIconType extends string = string,\n>({\n\tdisabled = false,\n\tspinner = false,\n\treadonlyOk = false,\n\tid,\n\tkbd,\n\tlabel,\n\ticon,\n\ticonLeft,\n\tonSelect,\n\tnoClose,\n\tisSelected,\n\tonDragStart,\n}: TLUiMenuItemProps<TranslationKey, IconType>) {\n\tconst { type: menuType, sourceId } = useTldrawUiMenuContext()\n\n\tconst msg = useTranslation()\n\n\tconst [disableClicks, setDisableClicks] = useState(false)\n\n\tconst isReadonlyMode = useReadonly()\n\tif (isReadonlyMode && !readonlyOk) return null\n\n\tconst labelToUse = unwrapLabel(label, menuType)\n\tconst kbdToUse = kbd ? kbdStr(kbd) : undefined\n\n\tconst labelStr = labelToUse ? msg(labelToUse as TLUiTranslationKey) : undefined\n\tconst titleStr = labelStr && kbdToUse ? `${labelStr} ${kbdToUse}` : labelStr\n\n\tswitch (menuType) {\n\t\tcase 'menu': {\n\t\t\treturn (\n\t\t\t\t<TldrawUiDropdownMenuItem>\n\t\t\t\t\t<TldrawUiButton\n\t\t\t\t\t\ttype=\"menu\"\n\t\t\t\t\t\tdata-testid={`${sourceId}.${id}`}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\tif (noClose) {\n\t\t\t\t\t\t\t\tpreventDefault(e)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif (disableClicks) {\n\t\t\t\t\t\t\t\tsetDisableClicks(false)\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tonSelect(sourceId)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{iconLeft && <TldrawUiButtonIcon icon={iconLeft} small />}\n\t\t\t\t\t\t<TldrawUiButtonLabel>{labelStr}</TldrawUiButtonLabel>\n\t\t\t\t\t\t{kbd && <TldrawUiKbd>{kbd}</TldrawUiKbd>}\n\t\t\t\t\t\t{icon && <TldrawUiButtonIcon icon={icon} small />}\n\t\t\t\t\t</TldrawUiButton>\n\t\t\t\t</TldrawUiDropdownMenuItem>\n\t\t\t)\n\t\t}\n\t\tcase 'context-menu': {\n\t\t\t// Hide disabled context menu items\n\t\t\tif (disabled) return null\n\n\t\t\treturn (\n\t\t\t\t<_ContextMenu.Item\n\t\t\t\t\tdir=\"ltr\"\n\t\t\t\t\tdraggable={false}\n\t\t\t\t\tclassName=\"tlui-button tlui-button__menu\"\n\t\t\t\t\tdata-testid={`${sourceId}.${id}`}\n\t\t\t\t\tonSelect={(e) => {\n\t\t\t\t\t\tif (noClose) preventDefault(e)\n\t\t\t\t\t\tif (disableClicks) {\n\t\t\t\t\t\t\tsetDisableClicks(false)\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tonSelect(sourceId)\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<span className=\"tlui-button__label\" draggable={false}>\n\t\t\t\t\t\t{labelStr}\n\t\t\t\t\t</span>\n\t\t\t\t\t{iconLeft && <TldrawUiButtonIcon icon={iconLeft} small />}\n\t\t\t\t\t{kbd && <TldrawUiKbd>{kbd}</TldrawUiKbd>}\n\t\t\t\t\t{spinner && <Spinner />}\n\t\t\t\t</_ContextMenu.Item>\n\t\t\t)\n\t\t}\n\t\tcase 'small-icons':\n\t\tcase 'icons': {\n\t\t\treturn (\n\t\t\t\t<TldrawUiToolbarButton\n\t\t\t\t\tdata-testid={`${sourceId}.${id}`}\n\t\t\t\t\ttype=\"icon\"\n\t\t\t\t\ttitle={titleStr}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={() => onSelect(sourceId)}\n\t\t\t\t>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} small />\n\t\t\t\t</TldrawUiToolbarButton>\n\t\t\t)\n\t\t}\n\t\tcase 'keyboard-shortcuts': {\n\t\t\tif (!kbd) {\n\t\t\t\tconsole.warn(\n\t\t\t\t\t`Menu item '${label}' isn't shown in the keyboard shortcuts dialog because it doesn't have a keyboard shortcut.`\n\t\t\t\t)\n\t\t\t\treturn null\n\t\t\t}\n\n\t\t\treturn (\n\t\t\t\t<div className=\"tlui-shortcuts-dialog__key-pair\" data-testid={`${sourceId}.${id}`}>\n\t\t\t\t\t<div className=\"tlui-shortcuts-dialog__key-pair__key\">{labelStr}</div>\n\t\t\t\t\t<div className=\"tlui-shortcuts-dialog__key-pair__value\">\n\t\t\t\t\t\t<TldrawUiKbd visibleOnMobileLayout>{kbd}</TldrawUiKbd>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t)\n\t\t}\n\t\tcase 'helper-buttons': {\n\t\t\treturn (\n\t\t\t\t<TldrawUiButton type=\"low\" onClick={() => onSelect(sourceId)}>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t\t\t<TldrawUiButtonLabel>{labelStr}</TldrawUiButtonLabel>\n\t\t\t\t</TldrawUiButton>\n\t\t\t)\n\t\t}\n\t\tcase 'toolbar': {\n\t\t\tif (onDragStart) {\n\t\t\t\treturn (\n\t\t\t\t\t<DraggableToolbarButton\n\t\t\t\t\t\tid={id}\n\t\t\t\t\t\ticon={icon}\n\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\tonDragStart={onDragStart}\n\t\t\t\t\t\tlabelStr={labelStr}\n\t\t\t\t\t\ttitleStr={titleStr}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t}\n\t\t\treturn (\n\t\t\t\t<TldrawUiToolbarButton\n\t\t\t\t\taria-label={labelStr}\n\t\t\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\t\t\tdata-testid={`tools.${id}`}\n\t\t\t\t\tdata-value={id}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={() => onSelect('toolbar')}\n\t\t\t\t\tonTouchStart={(e) => {\n\t\t\t\t\t\tpreventDefault(e)\n\t\t\t\t\t\tonSelect('toolbar')\n\t\t\t\t\t}}\n\t\t\t\t\ttitle={titleStr}\n\t\t\t\t\ttype=\"tool\"\n\t\t\t\t>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t\t</TldrawUiToolbarButton>\n\t\t\t)\n\t\t}\n\t\tcase 'toolbar-overflow': {\n\t\t\tif (onDragStart) {\n\t\t\t\treturn (\n\t\t\t\t\t<DraggableToolbarButton\n\t\t\t\t\t\tid={id}\n\t\t\t\t\t\ticon={icon}\n\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\tonDragStart={onDragStart}\n\t\t\t\t\t\tlabelStr={labelStr}\n\t\t\t\t\t\ttitleStr={titleStr}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tisSelected={isSelected}\n\t\t\t\t\t\toverflow\n\t\t\t\t\t/>\n\t\t\t\t)\n\t\t\t}\n\t\t\treturn (\n\t\t\t\t<TldrawUiToolbarButton\n\t\t\t\t\taria-label={labelStr}\n\t\t\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\t\t\tisActive={isSelected}\n\t\t\t\t\tdata-testid={`tools.more.${id}`}\n\t\t\t\t\tdata-value={id}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={() => onSelect('toolbar')}\n\t\t\t\t\ttitle={titleStr}\n\t\t\t\t\ttype=\"icon\"\n\t\t\t\t>\n\t\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t\t</TldrawUiToolbarButton>\n\t\t\t)\n\t\t}\n\t\tdefault: {\n\t\t\tthrow exhaustiveSwitchError(menuType)\n\t\t}\n\t}\n}\n\nfunction useDraggableEvents(\n\tonDragStart: TLUiToolItem['onDragStart'],\n\tonSelect: TLUiToolItem['onSelect']\n) {\n\tconst editor = useEditor()\n\tconst events = useMemo(() => {\n\t\tlet state = { name: 'idle' } as\n\t\t\t| {\n\t\t\t\t\tname: 'idle'\n\t\t\t  }\n\t\t\t| {\n\t\t\t\t\tname: 'pointing'\n\t\t\t\t\tscreenSpaceStart: VecModel\n\t\t\t  }\n\t\t\t| {\n\t\t\t\t\tname: 'dragging'\n\t\t\t\t\tscreenSpaceStart: VecModel\n\t\t\t  }\n\t\t\t| {\n\t\t\t\t\tname: 'dragged'\n\t\t\t  }\n\n\t\tfunction handlePointerDown(e: React.PointerEvent<HTMLButtonElement>) {\n\t\t\tstate = {\n\t\t\t\tname: 'pointing',\n\t\t\t\tscreenSpaceStart: { x: e.clientX, y: e.clientY },\n\t\t\t}\n\n\t\t\te.currentTarget.setPointerCapture(e.pointerId)\n\t\t}\n\n\t\tfunction handlePointerMove(e: React.PointerEvent<HTMLButtonElement>) {\n\t\t\tif ((e as any).isSpecialRedispatchedEvent) return\n\n\t\t\tif (state.name === 'pointing') {\n\t\t\t\tconst distanceSq = Vec.Dist2(state.screenSpaceStart, { x: e.clientX, y: e.clientY })\n\t\t\t\tif (\n\t\t\t\t\tdistanceSq >\n\t\t\t\t\t(editor.getInstanceState().isCoarsePointer\n\t\t\t\t\t\t? editor.options.uiCoarseDragDistanceSquared\n\t\t\t\t\t\t: editor.options.uiDragDistanceSquared)\n\t\t\t\t) {\n\t\t\t\t\tconst screenSpaceStart = state.screenSpaceStart\n\t\t\t\t\tstate = {\n\t\t\t\t\t\tname: 'dragging',\n\t\t\t\t\t\tscreenSpaceStart,\n\t\t\t\t\t}\n\n\t\t\t\t\teditor.run(() => {\n\t\t\t\t\t\teditor.setCurrentTool('select')\n\n\t\t\t\t\t\t// Set origin point\n\t\t\t\t\t\teditor.dispatch({\n\t\t\t\t\t\t\ttype: 'pointer',\n\t\t\t\t\t\t\ttarget: 'canvas',\n\t\t\t\t\t\t\tname: 'pointer_down',\n\t\t\t\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t\t\t\t\tpoint: screenSpaceStart,\n\t\t\t\t\t\t})\n\n\t\t\t\t\t\t// Pointer down potentially selects shapes, so we need to deselect them.\n\t\t\t\t\t\teditor.selectNone()\n\n\t\t\t\t\t\t// start drag\n\t\t\t\t\t\tonDragStart?.('toolbar', {\n\t\t\t\t\t\t\ttype: 'pointer',\n\t\t\t\t\t\t\ttarget: 'canvas',\n\t\t\t\t\t\t\tname: 'pointer_move',\n\t\t\t\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t\t\t\t\tpoint: screenSpaceStart,\n\t\t\t\t\t\t})\n\n\t\t\t\t\t\ttooltipManager.hideAllTooltips()\n\t\t\t\t\t\teditor.getContainer().focus()\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tfunction handlePointerUp(e: React.PointerEvent<HTMLButtonElement>) {\n\t\t\tif ((e as any).isSpecialRedispatchedEvent) return\n\n\t\t\te.currentTarget.releasePointerCapture(e.pointerId)\n\n\t\t\teditor.dispatch({\n\t\t\t\ttype: 'pointer',\n\t\t\t\ttarget: 'canvas',\n\t\t\t\tname: 'pointer_up',\n\t\t\t\t...getPointerInfo(editor, e),\n\t\t\t})\n\t\t}\n\n\t\tfunction handleClick() {\n\t\t\tif (state.name === 'dragging' || state.name === 'dragged') {\n\t\t\t\tstate = { name: 'idle' }\n\t\t\t\treturn true\n\t\t\t}\n\n\t\t\tstate = { name: 'idle' }\n\t\t\tonSelect?.('toolbar')\n\t\t}\n\n\t\treturn {\n\t\t\tonPointerDown: handlePointerDown,\n\t\t\tonPointerMove: handlePointerMove,\n\t\t\tonPointerUp: handlePointerUp,\n\t\t\tonClick: handleClick,\n\t\t}\n\t}, [onDragStart, editor, onSelect])\n\n\treturn events\n}\n\nfunction DraggableToolbarButton({\n\tid,\n\tlabelStr,\n\ttitleStr,\n\tdisabled,\n\tisSelected,\n\ticon,\n\tonSelect,\n\tonDragStart,\n\toverflow,\n}: {\n\tid: string\n\tdisabled: boolean\n\tlabelStr?: string\n\ttitleStr?: string\n\tisSelected?: boolean\n\ticon: TLUiMenuItemProps['icon']\n\tonSelect: TLUiMenuItemProps['onSelect']\n\tonDragStart: TLUiMenuItemProps['onDragStart']\n\toverflow?: boolean\n}) {\n\tconst events = useDraggableEvents(onDragStart, onSelect)\n\n\tif (overflow) {\n\t\treturn (\n\t\t\t<TldrawUiToolbarButton\n\t\t\t\taria-label={labelStr}\n\t\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\t\tisActive={isSelected}\n\t\t\t\tclassName=\"tlui-button-grid__button\"\n\t\t\t\tdata-testid={`tools.more.${id}`}\n\t\t\t\tdata-value={id}\n\t\t\t\tdisabled={disabled}\n\t\t\t\ttitle={titleStr}\n\t\t\t\ttype=\"icon\"\n\t\t\t\t{...events}\n\t\t\t>\n\t\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t\t</TldrawUiToolbarButton>\n\t\t)\n\t}\n\n\treturn (\n\t\t<TldrawUiToolbarButton\n\t\t\taria-label={labelStr}\n\t\t\taria-pressed={isSelected ? 'true' : 'false'}\n\t\t\tdata-testid={`tools.${id}`}\n\t\t\tdata-value={id}\n\t\t\tdisabled={disabled}\n\t\t\tonTouchStart={(e) => {\n\t\t\t\tpreventDefault(e)\n\t\t\t\tonSelect('toolbar')\n\t\t\t}}\n\t\t\ttitle={titleStr}\n\t\t\ttype=\"tool\"\n\t\t\t{...events}\n\t\t>\n\t\t\t<TldrawUiButtonIcon icon={icon!} />\n\t\t</TldrawUiToolbarButton>\n\t)\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-esm/lib/ui/context/events.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/ui/context/events.tsx"],
-  "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\t'click-watermark': { url: string }\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"],
-  "mappings": "AAmLE;AAnLF,YAAY,WAAW;AAqKvB,MAAM,sBAA4C,MAAM;AAGjD,MAAM,gBAAgB,MAAM,cAA2C,IAAI;AAS3E,SAAS,uBAAuB,EAAE,SAAS,SAAS,GAAwB;AAClF,SACC,oBAAC,cAAc,UAAd,EAAuB,OAAO,WAAW,qBACxC,UACF;AAEF;AAGO,SAAS,cAAoC;AACnD,QAAM,eAAe,MAAM,WAAW,aAAa;AACnD,SAAO,gBAAgB;AACxB;",
+  "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"],
+  "mappings": "AAkLE;AAlLF,YAAY,WAAW;AAoKvB,MAAM,sBAA4C,MAAM;AAGjD,MAAM,gBAAgB,MAAM,cAA2C,IAAI;AAS3E,SAAS,uBAAuB,EAAE,SAAS,SAAS,GAAwB;AAClF,SACC,oBAAC,cAAc,UAAd,EAAuB,OAAO,WAAW,qBACxC,UACF;AAEF;AAGO,SAAS,cAAoC;AACnD,QAAM,eAAe,MAAM,WAAW,aAAa;AACnD,SAAO,gBAAgB;AACxB;",
   "names": []
 }

package/dist-esm/lib/ui/version.mjs

@@ -1,8 +1,8 @@
-const version = "4.2.0-canary.0a761296d315";
+const version = "4.2.0-canary.0d8a9d25ff63";
 const publishDates = {
   major: "2025-09-18T14:39:22.803Z",
-  minor: "2025-11-11T12:33:37.028Z",
-  patch: "2025-11-11T12:33:37.028Z"
+  minor: "2025-11-17T14:39:41.165Z",
+  patch: "2025-11-17T14:39:41.165Z"
 };
 export {
   publishDates,

package/dist-esm/lib/ui/version.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/lib/ui/version.ts"],
-  "sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '4.2.0-canary.0a761296d315'\nexport const publishDates = {\n\tmajor: '2025-09-18T14:39:22.803Z',\n\tminor: '2025-11-11T12:33:37.028Z',\n\tpatch: '2025-11-11T12:33:37.028Z',\n}\n"],
+  "sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '4.2.0-canary.0d8a9d25ff63'\nexport const publishDates = {\n\tmajor: '2025-09-18T14:39:22.803Z',\n\tminor: '2025-11-17T14:39:41.165Z',\n\tpatch: '2025-11-17T14:39:41.165Z',\n}\n"],
   "mappings": "AAGO,MAAM,UAAU;AAChB,MAAM,eAAe;AAAA,EAC3B,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AACR;",
   "names": []
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "tldraw",
   "description": "A tiny little drawing editor.",
-  "version": "4.2.0-canary.0a761296d315",
+  "version": "4.2.0-canary.0d8a9d25ff63",
   "author": {
     "name": "tldraw Inc.",
     "email": "hello@tldraw.com"
@@ -62,8 +62,8 @@
     "@tiptap/pm": "3.6.2",
     "@tiptap/react": "3.6.2",
     "@tiptap/starter-kit": "3.6.2",
-    "@tldraw/editor": "4.2.0-canary.0a761296d315",
-    "@tldraw/store": "4.2.0-canary.0a761296d315",
+    "@tldraw/editor": "4.2.0-canary.0d8a9d25ff63",
+    "@tldraw/store": "4.2.0-canary.0d8a9d25ff63",
     "classnames": "^2.5.1",
     "hotkeys-js": "^3.13.9",
     "idb": "^7.1.1",

package/src/lib/Tldraw.tsx

@@ -257,13 +257,6 @@ function InsideOfEditorAndUiContext({
 
 		editor.once('edit', () => trackEvent('edit', { source: 'unknown' }))
 
-		// Forward watermark click events from editor to UI event system
-		const handleWatermarkClick = (info: { url: string }) => {
-			trackEvent('click-watermark', { source: 'unknown', url: info.url })
-		}
-		editor.on('click-watermark', handleWatermarkClick)
-		unsubs.push(() => editor.off('click-watermark', handleWatermarkClick))
-
 		// for content handling, first we register the default handlers...
 		registerDefaultExternalContentHandlers(editor, {
 			maxImageDimension,

package/src/lib/canvas/TldrawSelectionForeground.tsx

@@ -1,9 +1,12 @@
 import {
 	Box,
+	HALF_PI,
 	RotateCorner,
 	TLEmbedShape,
+	TLImageShape,
 	TLSelectionForegroundProps,
 	TLTextShape,
+	TLVideoShape,
 	getCursor,
 	tlenv,
 	toDomPrecision,
@@ -54,7 +57,10 @@ export const TldrawSelectionForeground = track(function TldrawSelectionForegroun
 			? bounds.clone().expand(expandOutlineBy).zeroFix()
 			: bounds.clone().expandBy(expandOutlineBy).zeroFix()
 
-	useTransform(rSvg, bounds?.x, bounds?.y, 1, editor.getSelectionRotation(), {
+	const selectionRotation = editor.getSelectionRotation()
+	const isShapeTooCloseToContextualToolbar =
+		selectionRotation / HALF_PI > 1.6 && selectionRotation / HALF_PI < 2.4
+	useTransform(rSvg, bounds?.x, bounds?.y, 1, selectionRotation, {
 		x: expandedBounds.x - bounds.x,
 		y: expandedBounds.y - bounds.y,
 	})
@@ -190,6 +196,10 @@ export const TldrawSelectionForeground = track(function TldrawSelectionForegroun
 		onlyShape &&
 		editor.isShapeOfType<TLTextShape>(onlyShape, 'text') &&
 		textHandleHeight * zoom >= 4
+	const isMediaShape =
+		onlyShape &&
+		(editor.isShapeOfType<TLImageShape>(onlyShape, 'image') ||
+			editor.isShapeOfType<TLVideoShape>(onlyShape, 'video'))
 
 	return (
 		<svg
@@ -244,7 +254,13 @@ export const TldrawSelectionForeground = track(function TldrawSelectionForegroun
 				<MobileRotateHandle
 					data-testid="selection.rotate.mobile"
 					cx={isSmallX ? -targetSize * 1.5 : width / 2}
-					cy={isSmallX ? height / 2 : -targetSize * 1.5}
+					cy={
+						isSmallX
+							? height / 2
+							: isMediaShape && !isShapeTooCloseToContextualToolbar
+								? height + targetSize * 1.5
+								: -targetSize * 1.5
+					}
 					size={size}
 					isHidden={hideMobileRotateHandle}
 				/>

package/src/lib/ui/components/primitives/menus/TldrawUiMenuItem.tsx

@@ -134,6 +134,7 @@ export function TldrawUiMenuItem<
 						{iconLeft && <TldrawUiButtonIcon icon={iconLeft} small />}
 						<TldrawUiButtonLabel>{labelStr}</TldrawUiButtonLabel>
 						{kbd && <TldrawUiKbd>{kbd}</TldrawUiKbd>}
+						{icon && <TldrawUiButtonIcon icon={icon} small />}
 					</TldrawUiButton>
 				</TldrawUiDropdownMenuItem>
 			)

package/src/lib/ui/context/events.tsx

@@ -145,7 +145,6 @@ export interface TLUiEventMap {
 			| 'bulletList'
 	}
 	edit: null
-	'click-watermark': { url: string }
 }
 
 /** @public */

package/src/lib/ui/version.ts

@@ -1,9 +1,9 @@
 // This file is automatically generated by internal/scripts/refresh-assets.ts.
 // Do not edit manually. Or do, I'm a comment, not a cop.
 
-export const version = '4.2.0-canary.0a761296d315'
+export const version = '4.2.0-canary.0d8a9d25ff63'
 export const publishDates = {
 	major: '2025-09-18T14:39:22.803Z',
-	minor: '2025-11-11T12:33:37.028Z',
-	patch: '2025-11-11T12:33:37.028Z',
+	minor: '2025-11-17T14:39:41.165Z',
+	patch: '2025-11-17T14:39:41.165Z',
 }

package/src/lib/ui.css

@@ -514,12 +514,10 @@
 /* If mobile use 16px as font size */
 /* On iOS, font size under 16px in an input will make the page zoom into the input 🤦‍♂️ */
 /* https://css-tricks.com/16px-or-larger-text-prevents-ios-form-zoom/ */
-@media (max-width: 600px) {
-	@supports (-webkit-touch-callout: none) {
-		/* CSS specific to iOS devices */
-		.tlui-input {
-			font-size: 16px;
-		}
+@supports (-webkit-touch-callout: none) {
+	/* CSS specific to iOS devices */
+	.tlui-input {
+		font-size: 16px;
 	}
 }
 

package/tldraw.css

@@ -2315,12 +2315,10 @@ it from receiving any pointer events or affecting the cursor. */
 /* If mobile use 16px as font size */
 /* On iOS, font size under 16px in an input will make the page zoom into the input 🤦‍♂️ */
 /* https://css-tricks.com/16px-or-larger-text-prevents-ios-form-zoom/ */
-@media (max-width: 600px) {
-	@supports (-webkit-touch-callout: none) {
-		/* CSS specific to iOS devices */
-		.tlui-input {
-			font-size: 16px;
-		}
+@supports (-webkit-touch-callout: none) {
+	/* CSS specific to iOS devices */
+	.tlui-input {
+		font-size: 16px;
 	}
 }