npm - tldraw - Versions diffs - 5.2.0-next.e2b8d10bf10e → 5.2.0 - Mend

tldraw 5.2.0-next.e2b8d10bf10e → 5.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (420) hide show

package/dist-esm/lib/ui/components/Minimap/MinimapManager.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/ui/components/Minimap/MinimapManager.ts"],
-  "sourcesContent": ["import {\n\tBox,\n\tComputedCache,\n\tEditor,\n\tTLShape,\n\tVec,\n\tatom,\n\tbind,\n\tclamp,\n\tcomputed,\n\treact,\n\tuniqueId,\n} from '@tldraw/editor'\n\nexport class MinimapManager {\n\tdisposables = [] as (() => void)[]\n\n\t@bind\n\tclose() {\n\t\treturn this.disposables.forEach((d) => d())\n\t}\n\n\tprivate readonly ctx: CanvasRenderingContext2D\n\tprivate readonly shapeRectCache: ComputedCache<Box | null, TLShape>\n\n\tconstructor(\n\t\tpublic editor: Editor,\n\t\tpublic readonly elem: HTMLCanvasElement,\n\t\tpublic readonly container: HTMLElement\n\t) {\n\t\tconst ctx = elem.getContext('2d')\n\t\tif (!ctx) throw new Error('Minimap: could not get 2D canvas context')\n\t\tthis.ctx = ctx\n\t\t// Per-shape minimap rect cache. Each entry re-derives only when the\n\t\t// underlying shape record (or its masked page bounds) changes, so a\n\t\t// single shape edit invalidates one entry instead of the whole render.\n\t\t// `null` means \"do not draw this shape\" (hideInMinimap or no bounds).\n\t\tthis.shapeRectCache = editor.store.createComputedCache<Box | null, TLShape>(\n\t\t\t'minimap-shape-rect',\n\t\t\t(shape) => {\n\t\t\t\tconst util = editor.getShapeUtil(shape.type)\n\t\t\t\tif (util.hideInMinimap?.(shape)) return null\n\t\t\t\treturn editor.getShapeMaskedPageBounds(shape.id) ?? null\n\t\t\t}\n\t\t)\n\t\tthis.colors = this._getColors()\n\t\tthis.disposables.push(this._listenForCanvasResize(), react('minimap render', this.render))\n\t}\n\n\tprivate _getColors() {\n\t\tconst style = this.editor.getContainerWindow().getComputedStyle(this.editor.getContainer())\n\t\treturn {\n\t\t\tshapeFill: style.getPropertyValue('--tl-color-text-3').trim(),\n\t\t\tselectFill: style.getPropertyValue('--tl-color-selected').trim(),\n\t\t\tviewportFill: style.getPropertyValue('--tl-color-muted-1').trim(),\n\t\t\tbackground: style.getPropertyValue('--tl-color-low').trim(),\n\t\t}\n\t}\n\n\tprivate colors: ReturnType<MinimapManager['_getColors']>\n\t// this should be called after dark/light mode changes have propagated to the dom\n\tupdateColors() {\n\t\tthis.colors = this._getColors()\n\t}\n\n\treadonly id = uniqueId()\n\t@computed\n\tgetDpr() {\n\t\treturn this.editor.getInstanceState().devicePixelRatio\n\t}\n\n\t@computed\n\tgetContentPageBounds() {\n\t\tconst viewportPageBounds = this.editor.getViewportPageBounds()\n\t\tconst commonShapeBounds = this.editor.getCurrentPageBounds()\n\t\treturn commonShapeBounds\n\t\t\t? Box.Expand(commonShapeBounds, viewportPageBounds)\n\t\t\t: viewportPageBounds\n\t}\n\n\t@computed\n\tgetContentScreenBounds() {\n\t\tconst contentPageBounds = this.getContentPageBounds()\n\t\tconst topLeft = this.editor.pageToScreen(contentPageBounds.point)\n\t\tconst bottomRight = this.editor.pageToScreen(\n\t\t\tnew Vec(contentPageBounds.maxX, contentPageBounds.maxY)\n\t\t)\n\t\treturn new Box(topLeft.x, topLeft.y, bottomRight.x - topLeft.x, bottomRight.y - topLeft.y)\n\t}\n\n\tprivate _getCanvasBoundingRect() {\n\t\tconst { x, y, width, height } = this.elem.getBoundingClientRect()\n\t\treturn new Box(x, y, width, height)\n\t}\n\n\tprivate readonly canvasBoundingClientRect = atom('canvasBoundingClientRect', new Box())\n\n\tgetCanvasScreenBounds() {\n\t\treturn this.canvasBoundingClientRect.get()\n\t}\n\n\tprivate _listenForCanvasResize() {\n\t\tconst observer = new ResizeObserver(() => {\n\t\t\tconst rect = this._getCanvasBoundingRect()\n\t\t\tthis.canvasBoundingClientRect.set(rect)\n\t\t})\n\t\tobserver.observe(this.elem)\n\t\tobserver.observe(this.container)\n\t\treturn () => observer.disconnect()\n\t}\n\n\t@computed\n\tgetCanvasSize() {\n\t\tconst rect = this.canvasBoundingClientRect.get()\n\t\tconst dpr = this.getDpr()\n\t\treturn new Vec(rect.width * dpr, rect.height * dpr)\n\t}\n\n\t@computed\n\tgetCanvasClientPosition() {\n\t\treturn this.canvasBoundingClientRect.get().point\n\t}\n\n\toriginPagePoint = new Vec()\n\toriginPageCenter = new Vec()\n\n\tisInViewport = false\n\n\t/** Get the canvas's true bounds converted to page bounds. */\n\t@computed getCanvasPageBounds() {\n\t\tconst canvasScreenBounds = this.getCanvasScreenBounds()\n\t\tconst contentPageBounds = this.getContentPageBounds()\n\n\t\tconst aspectRatio = canvasScreenBounds.width / canvasScreenBounds.height\n\n\t\tlet targetWidth = contentPageBounds.width\n\t\tlet targetHeight = targetWidth / aspectRatio\n\t\tif (targetHeight < contentPageBounds.height) {\n\t\t\ttargetHeight = contentPageBounds.height\n\t\t\ttargetWidth = targetHeight * aspectRatio\n\t\t}\n\n\t\tconst box = new Box(0, 0, targetWidth, targetHeight)\n\t\tbox.center = contentPageBounds.center\n\t\treturn box\n\t}\n\n\t/** Minimap screen-pixels per page-unit \u2014 same convention as `editor.getCamera().z`. */\n\t@computed getZoom() {\n\t\treturn this.getCanvasScreenBounds().width / this.getCanvasPageBounds().width\n\t}\n\n\tgetMinimapPagePoint(clientX: number, clientY: number) {\n\t\tconst canvasPageBounds = this.getCanvasPageBounds()\n\t\tconst canvasScreenBounds = this.getCanvasScreenBounds()\n\n\t\t// first offset the canvas position\n\t\tlet x = clientX - canvasScreenBounds.x\n\t\tlet y = clientY - canvasScreenBounds.y\n\n\t\t// then multiply by the ratio between the page and screen bounds\n\t\tx *= canvasPageBounds.width / canvasScreenBounds.width\n\t\ty *= canvasPageBounds.height / canvasScreenBounds.height\n\n\t\t// then add the canvas page bounds' offset\n\t\tx += canvasPageBounds.minX\n\t\ty += canvasPageBounds.minY\n\n\t\treturn new Vec(x, y, 1)\n\t}\n\n\tminimapScreenPointToPagePoint(x: number, y: number, shiftKey = false, clampToBounds = false) {\n\t\tconst { editor } = this\n\t\tconst vpPageBounds = editor.getViewportPageBounds()\n\n\t\tlet { x: px, y: py } = this.getMinimapPagePoint(x, y)\n\n\t\tif (clampToBounds) {\n\t\t\tconst shapesPageBounds = this.editor.getCurrentPageBounds() ?? new Box()\n\n\t\t\tconst minX = shapesPageBounds.minX - vpPageBounds.width / 2\n\t\t\tconst maxX = shapesPageBounds.maxX + vpPageBounds.width / 2\n\t\t\tconst minY = shapesPageBounds.minY - vpPageBounds.height / 2\n\t\t\tconst maxY = shapesPageBounds.maxY + vpPageBounds.height / 2\n\n\t\t\tconst lx = Math.max(0, minX + vpPageBounds.width - px)\n\t\t\tconst rx = Math.max(0, -(maxX - vpPageBounds.width - px))\n\t\t\tconst ly = Math.max(0, minY + vpPageBounds.height - py)\n\t\t\tconst ry = Math.max(0, -(maxY - vpPageBounds.height - py))\n\n\t\t\tpx += (lx - rx) / 2\n\t\t\tpy += (ly - ry) / 2\n\n\t\t\tpx = clamp(px, minX, maxX)\n\t\t\tpy = clamp(py, minY, maxY)\n\t\t}\n\n\t\tif (shiftKey) {\n\t\t\tconst { originPagePoint } = this\n\t\t\tconst dx = Math.abs(px - originPagePoint.x)\n\t\t\tconst dy = Math.abs(py - originPagePoint.y)\n\t\t\tif (dx > dy) {\n\t\t\t\tpy = originPagePoint.y\n\t\t\t} else {\n\t\t\t\tpx = originPagePoint.x\n\t\t\t}\n\t\t}\n\n\t\treturn new Vec(px, py)\n\t}\n\n\t@bind\n\trender() {\n\t\tconst { ctx, editor, elem } = this\n\t\tconst canvasSize = this.getCanvasSize()\n\t\tconst canvasPageBounds = this.getCanvasPageBounds()\n\t\tconst dpr = this.getDpr()\n\t\tconst zoom = this.getZoom()\n\n\t\t// Size the backing canvas to device pixels. Assigning width/height\n\t\t// also resets the context transform and clears the canvas.\n\t\tif (elem.width !== canvasSize.x || elem.height !== canvasSize.y) {\n\t\t\telem.width = canvasSize.x\n\t\t\telem.height = canvasSize.y\n\t\t}\n\n\t\tctx.resetTransform()\n\t\t// Background fill (opaque \u2014 matches the WebGL clear color).\n\t\tctx.fillStyle = this.colors.background\n\t\tctx.fillRect(0, 0, canvasSize.x, canvasSize.y)\n\n\t\t// Transform: 1 page unit = `zoom * dpr` device pixels, with the minimap's\n\t\t// page bounds pinned to the top-left of the canvas.\n\t\tctx.scale(dpr * zoom, dpr * zoom)\n\t\tctx.translate(-canvasPageBounds.minX, -canvasPageBounds.minY)\n\n\t\t// Shapes \u2014 iterate sorted IDs and pull per-shape rects from the\n\t\t// computed cache so only *changed* shapes re-derive between renders.\n\t\tconst selectedIds = new Set<string>(editor.getSelectedShapeIds())\n\t\tconst ids = editor.getCurrentPageShapeIdsSorted()\n\n\t\tconst shapesPath = new Path2D()\n\t\tconst selectedPath = new Path2D()\n\n\t\tfor (let i = 0, len = ids.length; i < len; i++) {\n\t\t\tconst shapeId = ids[i]\n\t\t\tconst bounds = this.shapeRectCache.get(shapeId)\n\t\t\tif (!bounds) continue\n\t\t\tconst target = selectedIds.has(shapeId) ? selectedPath : shapesPath\n\t\t\ttarget.rect(bounds.x, bounds.y, bounds.w, bounds.h)\n\t\t}\n\n\t\tctx.fillStyle = this.colors.shapeFill\n\t\tctx.fill(shapesPath)\n\n\t\tctx.fillStyle = this.colors.selectFill\n\t\tctx.fill(selectedPath)\n\n\t\t// Viewport rounded rect\n\t\tconst viewport = editor.getViewportPageBounds()\n\t\tconst { minX: vx, minY: vy, width: vw, height: vh } = viewport\n\t\tconst r = Math.min(vw / 4, vh / 4, 4 / zoom)\n\t\tctx.beginPath()\n\t\troundedRect(ctx, vx, vy, vw, vh, r)\n\t\tctx.closePath()\n\t\tctx.fillStyle = this.colors.viewportFill\n\t\tctx.fill()\n\n\t\t// Let active overlay utils contribute to the minimap. The ctx is already\n\t\t// in page space, matching the main-canvas overlay render contract.\n\t\tconst entries = editor.overlays.getActiveOverlayEntries()\n\t\tfor (const { util, overlays } of entries) {\n\t\t\tctx.save()\n\t\t\tutil.renderMinimap(ctx, overlays, zoom)\n\t\t\tctx.restore()\n\t\t}\n\t}\n}\n\nfunction roundedRect(\n\tctx: CanvasRenderingContext2D | Path2D,\n\tx: number,\n\ty: number,\n\tw: number,\n\th: number,\n\tr: number\n) {\n\tif (r < 1) {\n\t\tctx.rect(x, y, w, h)\n\t\treturn\n\t}\n\tctx.moveTo(x + r, y)\n\tctx.lineTo(x + w - r, y)\n\tctx.quadraticCurveTo(x + w, y, x + w, y + r)\n\tctx.lineTo(x + w, y + h - r)\n\tctx.quadraticCurveTo(x + w, y + h, x + w - r, y + h)\n\tctx.lineTo(x + r, y + h)\n\tctx.quadraticCurveTo(x, y + h, x, y + h - r)\n\tctx.lineTo(x, y + r)\n\tctx.quadraticCurveTo(x, y, x + r, y)\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\tBox,\n\tComputedCache,\n\tEditor,\n\tTLShape,\n\tVec,\n\tatom,\n\tbind,\n\tclamp,\n\tcomputed,\n\treact,\n\tuniqueId,\n} from '@tldraw/editor'\n\nexport class MinimapManager {\n\tdisposables = [] as (() => void)[]\n\n\t@bind\n\tclose() {\n\t\tthis.disposables.forEach((d) => d())\n\t}\n\n\tprivate readonly ctx: CanvasRenderingContext2D\n\tprivate readonly shapeRectCache: ComputedCache<Box | null, TLShape>\n\n\tconstructor(\n\t\tpublic editor: Editor,\n\t\tpublic readonly elem: HTMLCanvasElement,\n\t\tpublic readonly container: HTMLElement\n\t) {\n\t\tconst ctx = elem.getContext('2d')\n\t\tif (!ctx) throw new Error('Minimap: could not get 2D canvas context')\n\t\tthis.ctx = ctx\n\t\t// Per-shape minimap rect cache. Each entry re-derives only when the\n\t\t// underlying shape record (or its masked page bounds) changes, so a\n\t\t// single shape edit invalidates one entry instead of the whole render.\n\t\t// `null` means \"do not draw this shape\" (hideInMinimap or no bounds).\n\t\tthis.shapeRectCache = editor.store.createComputedCache<Box | null, TLShape>(\n\t\t\t'minimap-shape-rect',\n\t\t\t(shape) => {\n\t\t\t\tconst util = editor.getShapeUtil(shape.type)\n\t\t\t\tif (util.hideInMinimap?.(shape)) return null\n\t\t\t\treturn editor.getShapeMaskedPageBounds(shape.id) ?? null\n\t\t\t}\n\t\t)\n\t\tthis.colors = this._getColors()\n\t\tthis.disposables.push(this._listenForCanvasResize(), react('minimap render', this.render))\n\t}\n\n\tprivate _getColors() {\n\t\tconst style = this.editor.getContainerWindow().getComputedStyle(this.editor.getContainer())\n\t\treturn {\n\t\t\tshapeFill: style.getPropertyValue('--tl-color-text-3').trim(),\n\t\t\tselectFill: style.getPropertyValue('--tl-color-selected').trim(),\n\t\t\tviewportFill: style.getPropertyValue('--tl-color-muted-1').trim(),\n\t\t\tbackground: style.getPropertyValue('--tl-color-low').trim(),\n\t\t}\n\t}\n\n\tprivate colors: ReturnType<MinimapManager['_getColors']>\n\t// this should be called after dark/light mode changes have propagated to the dom\n\tupdateColors() {\n\t\tthis.colors = this._getColors()\n\t}\n\n\treadonly id = uniqueId()\n\t@computed\n\tgetDpr() {\n\t\treturn this.editor.getInstanceState().devicePixelRatio\n\t}\n\n\t@computed\n\tgetContentPageBounds() {\n\t\tconst viewportPageBounds = this.editor.getViewportPageBounds()\n\t\tconst commonShapeBounds = this.editor.getCurrentPageBounds()\n\t\treturn commonShapeBounds\n\t\t\t? Box.Expand(commonShapeBounds, viewportPageBounds)\n\t\t\t: viewportPageBounds\n\t}\n\n\tprivate _getCanvasBoundingRect() {\n\t\tconst { x, y, width, height } = this.elem.getBoundingClientRect()\n\t\treturn new Box(x, y, width, height)\n\t}\n\n\tprivate readonly canvasBoundingClientRect = atom('canvasBoundingClientRect', new Box())\n\n\tgetCanvasScreenBounds() {\n\t\treturn this.canvasBoundingClientRect.get()\n\t}\n\n\tprivate _listenForCanvasResize() {\n\t\tconst observer = new ResizeObserver(() => {\n\t\t\tconst rect = this._getCanvasBoundingRect()\n\t\t\tthis.canvasBoundingClientRect.set(rect)\n\t\t})\n\t\tobserver.observe(this.elem)\n\t\tobserver.observe(this.container)\n\t\treturn () => observer.disconnect()\n\t}\n\n\t@computed\n\tgetCanvasSize() {\n\t\tconst rect = this.canvasBoundingClientRect.get()\n\t\tconst dpr = this.getDpr()\n\t\treturn new Vec(rect.width * dpr, rect.height * dpr)\n\t}\n\n\toriginPagePoint = new Vec()\n\toriginPageCenter = new Vec()\n\n\tisInViewport = false\n\n\t/** Get the canvas's true bounds converted to page bounds. */\n\t@computed getCanvasPageBounds() {\n\t\tconst canvasScreenBounds = this.getCanvasScreenBounds()\n\t\tconst contentPageBounds = this.getContentPageBounds()\n\n\t\tconst aspectRatio = canvasScreenBounds.width / canvasScreenBounds.height\n\n\t\tlet targetWidth = contentPageBounds.width\n\t\tlet targetHeight = targetWidth / aspectRatio\n\t\tif (targetHeight < contentPageBounds.height) {\n\t\t\ttargetHeight = contentPageBounds.height\n\t\t\ttargetWidth = targetHeight * aspectRatio\n\t\t}\n\n\t\tconst box = new Box(0, 0, targetWidth, targetHeight)\n\t\tbox.center = contentPageBounds.center\n\t\treturn box\n\t}\n\n\t/** Minimap screen-pixels per page-unit \u2014 same convention as `editor.getCamera().z`. */\n\t@computed getZoom() {\n\t\treturn this.getCanvasScreenBounds().width / this.getCanvasPageBounds().width\n\t}\n\n\tgetMinimapPagePoint(clientX: number, clientY: number) {\n\t\tconst canvasPageBounds = this.getCanvasPageBounds()\n\t\tconst canvasScreenBounds = this.getCanvasScreenBounds()\n\n\t\t// first offset the canvas position\n\t\tlet x = clientX - canvasScreenBounds.x\n\t\tlet y = clientY - canvasScreenBounds.y\n\n\t\t// then multiply by the ratio between the page and screen bounds\n\t\tx *= canvasPageBounds.width / canvasScreenBounds.width\n\t\ty *= canvasPageBounds.height / canvasScreenBounds.height\n\n\t\t// then add the canvas page bounds' offset\n\t\tx += canvasPageBounds.minX\n\t\ty += canvasPageBounds.minY\n\n\t\treturn new Vec(x, y, 1)\n\t}\n\n\tminimapScreenPointToPagePoint(x: number, y: number, shiftKey = false, clampToBounds = false) {\n\t\tconst { editor } = this\n\t\tconst vpPageBounds = editor.getViewportPageBounds()\n\n\t\tlet { x: px, y: py } = this.getMinimapPagePoint(x, y)\n\n\t\tif (clampToBounds) {\n\t\t\tconst shapesPageBounds = this.editor.getCurrentPageBounds() ?? new Box()\n\n\t\t\tconst minX = shapesPageBounds.minX - vpPageBounds.width / 2\n\t\t\tconst maxX = shapesPageBounds.maxX + vpPageBounds.width / 2\n\t\t\tconst minY = shapesPageBounds.minY - vpPageBounds.height / 2\n\t\t\tconst maxY = shapesPageBounds.maxY + vpPageBounds.height / 2\n\n\t\t\tconst lx = Math.max(0, minX + vpPageBounds.width - px)\n\t\t\tconst rx = Math.max(0, -(maxX - vpPageBounds.width - px))\n\t\t\tconst ly = Math.max(0, minY + vpPageBounds.height - py)\n\t\t\tconst ry = Math.max(0, -(maxY - vpPageBounds.height - py))\n\n\t\t\tpx += (lx - rx) / 2\n\t\t\tpy += (ly - ry) / 2\n\n\t\t\tpx = clamp(px, minX, maxX)\n\t\t\tpy = clamp(py, minY, maxY)\n\t\t}\n\n\t\tif (shiftKey) {\n\t\t\tconst { originPagePoint } = this\n\t\t\tconst dx = Math.abs(px - originPagePoint.x)\n\t\t\tconst dy = Math.abs(py - originPagePoint.y)\n\t\t\tif (dx > dy) {\n\t\t\t\tpy = originPagePoint.y\n\t\t\t} else {\n\t\t\t\tpx = originPagePoint.x\n\t\t\t}\n\t\t}\n\n\t\treturn new Vec(px, py)\n\t}\n\n\t// Shape geometry in page space, split into unselected/selected fills. Built\n\t// from the per-shape rect cache and selection only, so it survives pan/zoom of\n\t// the main canvas \u2014 those move the `ctx` transform, not the paths themselves.\n\t@computed\n\tprivate getShapePaths() {\n\t\tconst { editor } = this\n\t\tconst selectedIds = new Set<string>(editor.getSelectedShapeIds())\n\t\tconst ids = editor.getCurrentPageShapeIdsSorted()\n\n\t\tconst shapes = new Path2D()\n\t\tconst selected = new Path2D()\n\n\t\tfor (let i = 0, len = ids.length; i < len; i++) {\n\t\t\tconst shapeId = ids[i]\n\t\t\tconst bounds = this.shapeRectCache.get(shapeId)\n\t\t\tif (!bounds) continue\n\t\t\tconst target = selectedIds.has(shapeId) ? selected : shapes\n\t\t\ttarget.rect(bounds.x, bounds.y, bounds.w, bounds.h)\n\t\t}\n\n\t\treturn { shapes, selected }\n\t}\n\n\t@bind\n\trender() {\n\t\tconst { ctx, editor, elem } = this\n\t\tconst canvasSize = this.getCanvasSize()\n\t\tconst canvasPageBounds = this.getCanvasPageBounds()\n\t\tconst dpr = this.getDpr()\n\t\tconst zoom = this.getZoom()\n\n\t\t// Size the backing canvas to device pixels. Assigning width/height\n\t\t// also resets the context transform and clears the canvas.\n\t\tif (elem.width !== canvasSize.x || elem.height !== canvasSize.y) {\n\t\t\telem.width = canvasSize.x\n\t\t\telem.height = canvasSize.y\n\t\t}\n\n\t\tctx.resetTransform()\n\t\t// Background fill (opaque \u2014 matches the WebGL clear color).\n\t\tctx.fillStyle = this.colors.background\n\t\tctx.fillRect(0, 0, canvasSize.x, canvasSize.y)\n\n\t\t// Transform: 1 page unit = `zoom * dpr` device pixels, with the minimap's\n\t\t// page bounds pinned to the top-left of the canvas.\n\t\tctx.scale(dpr * zoom, dpr * zoom)\n\t\tctx.translate(-canvasPageBounds.minX, -canvasPageBounds.minY)\n\n\t\t// Shapes \u2014 page-space paths from a computed, so a pan/zoom that only moves\n\t\t// the transform above reuses them instead of rebuilding per shape.\n\t\tconst { shapes: shapesPath, selected: selectedPath } = this.getShapePaths()\n\n\t\tctx.fillStyle = this.colors.shapeFill\n\t\tctx.fill(shapesPath)\n\n\t\tctx.fillStyle = this.colors.selectFill\n\t\tctx.fill(selectedPath)\n\n\t\t// Viewport indicator. roundRect is pricier than rect, so when the corner\n\t\t// radius would be sub-pixel on screen (and thus invisible) fall back to a\n\t\t// plain rect.\n\t\tconst viewport = editor.getViewportPageBounds()\n\t\tconst { minX: vx, minY: vy, width: vw, height: vh } = viewport\n\t\tconst r = Math.min(vw / 4, vh / 4, 4 / zoom)\n\t\tctx.beginPath()\n\t\tif (r * zoom < 1) {\n\t\t\tctx.rect(vx, vy, vw, vh)\n\t\t} else {\n\t\t\tctx.roundRect(vx, vy, vw, vh, r)\n\t\t}\n\t\tctx.fillStyle = this.colors.viewportFill\n\t\tctx.fill()\n\n\t\t// Let active overlay utils contribute to the minimap. The ctx is already\n\t\t// in page space, matching the main-canvas overlay render contract.\n\t\tconst entries = editor.overlays.getActiveOverlayEntries()\n\t\tfor (const { util, overlays } of entries) {\n\t\t\tctx.save()\n\t\t\tutil.renderMinimap(ctx, overlays, zoom)\n\t\t\tctx.restore()\n\t\t}\n\t}\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-esm/lib/ui/components/SharePanel/DefaultPeopleMenuAvatar.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/ui/components/SharePanel/DefaultPeopleMenuAvatar.tsx"],
-  "sourcesContent": ["import { usePresence } from '@tldraw/editor'\n\n/** @public */\nexport interface TLUiPeopleMenuAvatarProps {\n\tuserId: string\n}\n\n/** @public @react */\nexport function DefaultPeopleMenuAvatar({ userId }: TLUiPeopleMenuAvatarProps) {\n\tconst presence = usePresence(userId)\n\n\tif (!presence) return null\n\treturn (\n\t\t<div\n\t\t\tclassName=\"tlui-people-menu__avatar\"\n\t\t\tstyle={{\n\t\t\t\tbackgroundColor: presence.color,\n\t\t\t}}\n\t\t>\n\t\t\t{presence.userName?.[0] ?? ''}\n\t\t</div>\n\t)\n}\n"],
-  "mappings": "AAaE;AAbF,SAAS,mBAAmB;AAQrB,SAAS,wBAAwB,EAAE,OAAO,GAA8B;AAC9E,QAAM,WAAW,YAAY,MAAM;AAEnC,MAAI,CAAC,SAAU,QAAO;AACtB,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,OAAO;AAAA,QACN,iBAAiB,SAAS;AAAA,MAC3B;AAAA,MAEC,mBAAS,WAAW,CAAC,KAAK;AAAA;AAAA,EAC5B;AAEF;",
+  "sourcesContent": ["import { TLUserId, usePresence } from '@tldraw/editor'\n\n/** @public */\nexport interface TLUiPeopleMenuAvatarProps {\n\tuserId: TLUserId\n}\n\n/** @public @react */\nexport function DefaultPeopleMenuAvatar({ userId }: TLUiPeopleMenuAvatarProps) {\n\tconst presence = usePresence(userId)\n\n\tif (!presence) return null\n\treturn (\n\t\t<div\n\t\t\tclassName=\"tlui-people-menu__avatar\"\n\t\t\tstyle={{\n\t\t\t\tbackgroundColor: presence.color,\n\t\t\t}}\n\t\t>\n\t\t\t{presence.userName?.[0] ?? ''}\n\t\t</div>\n\t)\n}\n"],
+  "mappings": "AAaE;AAbF,SAAmB,mBAAmB;AAQ/B,SAAS,wBAAwB,EAAE,OAAO,GAA8B;AAC9E,QAAM,WAAW,YAAY,MAAM;AAEnC,MAAI,CAAC,SAAU,QAAO;AACtB,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,OAAO;AAAA,QACN,iBAAiB,SAAS;AAAA,MAC3B;AAAA,MAEC,mBAAS,WAAW,CAAC,KAAK;AAAA;AAAA,EAC5B;AAEF;",
   "names": []
 }

package/dist-esm/lib/ui/components/SharePanel/DefaultPeopleMenuContent.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/ui/components/SharePanel/DefaultPeopleMenuContent.tsx"],
-  "sourcesContent": ["import { useTldrawUiComponents } from '../../context/components'\n\n/** @public */\nexport interface DefaultPeopleMenuContentProps {\n\tuserIds: string[]\n}\n\n/** @public @react */\nexport function DefaultPeopleMenuContent({ userIds }: DefaultPeopleMenuContentProps) {\n\tconst { PeopleMenuItem, UserPresenceEditor } = useTldrawUiComponents()\n\n\treturn (\n\t\t<>\n\t\t\t{UserPresenceEditor && (\n\t\t\t\t<div className=\"tlui-people-menu__section\">\n\t\t\t\t\t<UserPresenceEditor />\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{PeopleMenuItem && userIds.length > 0 && (\n\t\t\t\t<div className=\"tlui-people-menu__section\">\n\t\t\t\t\t{userIds.map((userId) => {\n\t\t\t\t\t\treturn <PeopleMenuItem key={userId + '_presence'} userId={userId} />\n\t\t\t\t\t})}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</>\n\t)\n}\n"],
-  "mappings": "AAYE,mBAGG,KAHH;AAZF,SAAS,6BAA6B;AAQ/B,SAAS,yBAAyB,EAAE,QAAQ,GAAkC;AACpF,QAAM,EAAE,gBAAgB,mBAAmB,IAAI,sBAAsB;AAErE,SACC,iCACE;AAAA,0BACA,oBAAC,SAAI,WAAU,6BACd,8BAAC,sBAAmB,GACrB;AAAA,IAEA,kBAAkB,QAAQ,SAAS,KACnC,oBAAC,SAAI,WAAU,6BACb,kBAAQ,IAAI,CAAC,WAAW;AACxB,aAAO,oBAAC,kBAA0C,UAAtB,SAAS,WAA6B;AAAA,IACnE,CAAC,GACF;AAAA,KAEF;AAEF;",
+  "sourcesContent": ["import { TLUserId } from '@tldraw/editor'\nimport { useTldrawUiComponents } from '../../context/components'\n\n/** @public */\nexport interface DefaultPeopleMenuContentProps {\n\tuserIds: TLUserId[]\n}\n\n/** @public @react */\nexport function DefaultPeopleMenuContent({ userIds }: DefaultPeopleMenuContentProps) {\n\tconst { PeopleMenuItem, UserPresenceEditor } = useTldrawUiComponents()\n\n\treturn (\n\t\t<>\n\t\t\t{UserPresenceEditor && (\n\t\t\t\t<div className=\"tlui-people-menu__section\">\n\t\t\t\t\t<UserPresenceEditor />\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{PeopleMenuItem && userIds.length > 0 && (\n\t\t\t\t<div className=\"tlui-people-menu__section\">\n\t\t\t\t\t{userIds.map((userId) => {\n\t\t\t\t\t\treturn <PeopleMenuItem key={userId + '_presence'} userId={userId} />\n\t\t\t\t\t})}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</>\n\t)\n}\n"],
+  "mappings": "AAaE,mBAGG,KAHH;AAZF,SAAS,6BAA6B;AAQ/B,SAAS,yBAAyB,EAAE,QAAQ,GAAkC;AACpF,QAAM,EAAE,gBAAgB,mBAAmB,IAAI,sBAAsB;AAErE,SACC,iCACE;AAAA,0BACA,oBAAC,SAAI,WAAU,6BACd,8BAAC,sBAAmB,GACrB;AAAA,IAEA,kBAAkB,QAAQ,SAAS,KACnC,oBAAC,SAAI,WAAU,6BACb,kBAAQ,IAAI,CAAC,WAAW;AACxB,aAAO,oBAAC,kBAA0C,UAAtB,SAAS,WAA6B;AAAA,IACnE,CAAC,GACF;AAAA,KAEF;AAEF;",
   "names": []
 }

package/dist-esm/lib/ui/components/SharePanel/DefaultPeopleMenuFacePile.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/ui/components/SharePanel/DefaultPeopleMenuFacePile.tsx"],
-  "sourcesContent": ["import { PORTRAIT_BREAKPOINT } from '../../constants'\nimport { useBreakpoint } from '../../context/breakpoints'\nimport { useTldrawUiComponents } from '../../context/components'\n\n/** @public */\nexport interface TLUiPeopleMenuFacePileProps {\n\tuserIds: string[]\n\tuserName: string\n\tuserColor: string\n}\n\n/** @public @react */\nexport function DefaultPeopleMenuFacePile({\n\tuserIds,\n\tuserName,\n\tuserColor,\n}: TLUiPeopleMenuFacePileProps) {\n\tconst { PeopleMenuAvatar } = useTldrawUiComponents()\n\n\tconst breakpoint = useBreakpoint()\n\tconst maxAvatars = breakpoint <= PORTRAIT_BREAKPOINT.MOBILE_XS ? 1 : 5\n\n\treturn (\n\t\t<div className=\"tlui-people-menu__avatars\">\n\t\t\t{PeopleMenuAvatar &&\n\t\t\t\tuserIds\n\t\t\t\t\t.slice(-maxAvatars)\n\t\t\t\t\t.map((userId) => <PeopleMenuAvatar key={userId} userId={userId} />)}\n\t\t\t{userIds.length > 0 && (\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"tlui-people-menu__avatar\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tbackgroundColor: userColor,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{userName?.[0] ?? ''}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{userIds.length > maxAvatars && (\n\t\t\t\t<div className=\"tlui-people-menu__avatar tlui-people-menu__more\">\n\t\t\t\t\t{Math.abs(userIds.length - maxAvatars)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t)\n}\n"],
-  "mappings": "AAuBE,SAIoB,KAJpB;AAvBF,SAAS,2BAA2B;AACpC,SAAS,qBAAqB;AAC9B,SAAS,6BAA6B;AAU/B,SAAS,0BAA0B;AAAA,EACzC;AAAA,EACA;AAAA,EACA;AACD,GAAgC;AAC/B,QAAM,EAAE,iBAAiB,IAAI,sBAAsB;AAEnD,QAAM,aAAa,cAAc;AACjC,QAAM,aAAa,cAAc,oBAAoB,YAAY,IAAI;AAErE,SACC,qBAAC,SAAI,WAAU,6BACb;AAAA,wBACA,QACE,MAAM,CAAC,UAAU,EACjB,IAAI,CAAC,WAAW,oBAAC,oBAA8B,UAAR,MAAwB,CAAE;AAAA,IACnE,QAAQ,SAAS,KACjB;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV,OAAO;AAAA,UACN,iBAAiB;AAAA,QAClB;AAAA,QAEC,qBAAW,CAAC,KAAK;AAAA;AAAA,IACnB;AAAA,IAEA,QAAQ,SAAS,cACjB,oBAAC,SAAI,WAAU,mDACb,eAAK,IAAI,QAAQ,SAAS,UAAU,GACtC;AAAA,KAEF;AAEF;",
+  "sourcesContent": ["import { TLUserId } from '@tldraw/editor'\nimport { PORTRAIT_BREAKPOINT } from '../../constants'\nimport { useBreakpoint } from '../../context/breakpoints'\nimport { useTldrawUiComponents } from '../../context/components'\n\n/** @public */\nexport interface TLUiPeopleMenuFacePileProps {\n\tuserIds: TLUserId[]\n\tuserName: string\n\tuserColor: string\n}\n\n/** @public @react */\nexport function DefaultPeopleMenuFacePile({\n\tuserIds,\n\tuserName,\n\tuserColor,\n}: TLUiPeopleMenuFacePileProps) {\n\tconst { PeopleMenuAvatar } = useTldrawUiComponents()\n\n\tconst breakpoint = useBreakpoint()\n\tconst maxAvatars = breakpoint <= PORTRAIT_BREAKPOINT.MOBILE_XS ? 1 : 5\n\n\treturn (\n\t\t<div className=\"tlui-people-menu__avatars\">\n\t\t\t{PeopleMenuAvatar &&\n\t\t\t\tuserIds\n\t\t\t\t\t.slice(-maxAvatars)\n\t\t\t\t\t.map((userId) => <PeopleMenuAvatar key={userId} userId={userId} />)}\n\t\t\t{userIds.length > 0 && (\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"tlui-people-menu__avatar\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tbackgroundColor: userColor,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{userName?.[0] ?? ''}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{userIds.length > maxAvatars && (\n\t\t\t\t<div className=\"tlui-people-menu__avatar tlui-people-menu__more\">\n\t\t\t\t\t{Math.abs(userIds.length - maxAvatars)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t)\n}\n"],
+  "mappings": "AAwBE,SAIoB,KAJpB;AAvBF,SAAS,2BAA2B;AACpC,SAAS,qBAAqB;AAC9B,SAAS,6BAA6B;AAU/B,SAAS,0BAA0B;AAAA,EACzC;AAAA,EACA;AAAA,EACA;AACD,GAAgC;AAC/B,QAAM,EAAE,iBAAiB,IAAI,sBAAsB;AAEnD,QAAM,aAAa,cAAc;AACjC,QAAM,aAAa,cAAc,oBAAoB,YAAY,IAAI;AAErE,SACC,qBAAC,SAAI,WAAU,6BACb;AAAA,wBACA,QACE,MAAM,CAAC,UAAU,EACjB,IAAI,CAAC,WAAW,oBAAC,oBAA8B,UAAR,MAAwB,CAAE;AAAA,IACnE,QAAQ,SAAS,KACjB;AAAA,MAAC;AAAA;AAAA,QACA,WAAU;AAAA,QACV,OAAO;AAAA,UACN,iBAAiB;AAAA,QAClB;AAAA,QAEC,qBAAW,CAAC,KAAK;AAAA;AAAA,IACnB;AAAA,IAEA,QAAQ,SAAS,cACjB,oBAAC,SAAI,WAAU,mDACb,eAAK,IAAI,QAAQ,SAAS,UAAU,GACtC;AAAA,KAEF;AAEF;",
   "names": []
 }

package/dist-esm/lib/ui/components/SharePanel/DefaultPeopleMenuItem.mjs CHANGED Viewed

@@ -23,7 +23,7 @@ const DefaultPeopleMenuItem = track(function DefaultPeopleMenuItem2({
       trackEvent("start-following", { source: "people-menu" });
     }
   }, [editor, userId, trackEvent]);
-  const theyAreFollowingYou = presence?.followingUserId === editor.user.getId();
+  const theyAreFollowingYou = presence?.followingUserId === editor.user.getRecordId();
   const youAreFollowingThem = editor.getInstanceState().followingUserId === userId;
   if (!presence) return null;
   return /* @__PURE__ */ jsxs(

package/dist-esm/lib/ui/components/SharePanel/DefaultPeopleMenuItem.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/ui/components/SharePanel/DefaultPeopleMenuItem.tsx"],
-  "sourcesContent": ["import { track, useEditor, usePresence } from '@tldraw/editor'\nimport { useCallback } from 'react'\nimport { useUiEvents } from '../../context/events'\nimport { useTranslation } from '../../hooks/useTranslation/useTranslation'\nimport { TldrawUiButton } from '../primitives/Button/TldrawUiButton'\nimport { TldrawUiButtonIcon } from '../primitives/Button/TldrawUiButtonIcon'\nimport { TldrawUiRow } from '../primitives/layout'\nimport { TldrawUiIcon } from '../primitives/TldrawUiIcon'\n\n/** @public */\nexport interface TLUiPeopleMenuItemProps {\n\tuserId: string\n}\n\n/** @public @react */\nexport const DefaultPeopleMenuItem = track(function DefaultPeopleMenuItem({\n\tuserId,\n}: TLUiPeopleMenuItemProps) {\n\tconst editor = useEditor()\n\tconst msg = useTranslation()\n\tconst trackEvent = useUiEvents()\n\n\tconst presence = usePresence(userId)\n\n\tconst handleFollowClick = useCallback(() => {\n\t\tif (editor.getInstanceState().followingUserId === userId) {\n\t\t\teditor.stopFollowingUser()\n\t\t\ttrackEvent('stop-following', { source: 'people-menu' })\n\t\t} else {\n\t\t\teditor.startFollowingUser(userId)\n\t\t\ttrackEvent('start-following', { source: 'people-menu' })\n\t\t}\n\t}, [editor, userId, trackEvent])\n\n\tconst theyAreFollowingYou = presence?.followingUserId === editor.user.getId()\n\tconst youAreFollowingThem = editor.getInstanceState().followingUserId === userId\n\n\tif (!presence) return null\n\n\treturn (\n\t\t<TldrawUiRow\n\t\t\tclassName=\"tlui-people-menu__item\"\n\t\t\tdata-follow={youAreFollowingThem || theyAreFollowingYou}\n\t\t>\n\t\t\t<TldrawUiButton\n\t\t\t\ttype=\"menu\"\n\t\t\t\tclassName=\"tlui-people-menu__item__button\"\n\t\t\t\tonClick={() => editor.zoomToUser(userId)}\n\t\t\t\tonDoubleClick={handleFollowClick}\n\t\t\t>\n\t\t\t\t<TldrawUiIcon label={msg('people-menu.avatar-color')} icon=\"color\" color={presence.color} />\n\t\t\t\t<div className=\"tlui-people-menu__name\">\n\t\t\t\t\t{presence.userName?.trim() || msg('people-menu.anonymous-user')}\n\t\t\t\t</div>\n\t\t\t</TldrawUiButton>\n\t\t\t<TldrawUiButton\n\t\t\t\ttype=\"icon\"\n\t\t\t\tclassName=\"tlui-people-menu__item__follow\"\n\t\t\t\ttitle={\n\t\t\t\t\ttheyAreFollowingYou\n\t\t\t\t\t\t? msg('people-menu.leading')\n\t\t\t\t\t\t: youAreFollowingThem\n\t\t\t\t\t\t\t? msg('people-menu.following')\n\t\t\t\t\t\t\t: msg('people-menu.follow')\n\t\t\t\t}\n\t\t\t\tonClick={handleFollowClick}\n\t\t\t\tdisabled={theyAreFollowingYou}\n\t\t\t>\n\t\t\t\t<TldrawUiButtonIcon\n\t\t\t\t\ticon={theyAreFollowingYou ? 'leading' : youAreFollowingThem ? 'following' : 'follow'}\n\t\t\t\t/>\n\t\t\t</TldrawUiButton>\n\t\t</TldrawUiRow>\n\t)\n})\n"],
-  "mappings": "AA4CG,SAMC,KAND;AA5CH,SAAS,OAAO,WAAW,mBAAmB;AAC9C,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,sBAAsB;AAC/B,SAAS,0BAA0B;AACnC,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAQtB,MAAM,wBAAwB,MAAM,SAASA,uBAAsB;AAAA,EACzE;AACD,GAA4B;AAC3B,QAAM,SAAS,UAAU;AACzB,QAAM,MAAM,eAAe;AAC3B,QAAM,aAAa,YAAY;AAE/B,QAAM,WAAW,YAAY,MAAM;AAEnC,QAAM,oBAAoB,YAAY,MAAM;AAC3C,QAAI,OAAO,iBAAiB,EAAE,oBAAoB,QAAQ;AACzD,aAAO,kBAAkB;AACzB,iBAAW,kBAAkB,EAAE,QAAQ,cAAc,CAAC;AAAA,IACvD,OAAO;AACN,aAAO,mBAAmB,MAAM;AAChC,iBAAW,mBAAmB,EAAE,QAAQ,cAAc,CAAC;AAAA,IACxD;AAAA,EACD,GAAG,CAAC,QAAQ,QAAQ,UAAU,CAAC;AAE/B,QAAM,sBAAsB,UAAU,oBAAoB,OAAO,KAAK,MAAM;AAC5E,QAAM,sBAAsB,OAAO,iBAAiB,EAAE,oBAAoB;AAE1E,MAAI,CAAC,SAAU,QAAO;AAEtB,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,eAAa,uBAAuB;AAAA,MAEpC;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,MAAK;AAAA,YACL,WAAU;AAAA,YACV,SAAS,MAAM,OAAO,WAAW,MAAM;AAAA,YACvC,eAAe;AAAA,YAEf;AAAA,kCAAC,gBAAa,OAAO,IAAI,0BAA0B,GAAG,MAAK,SAAQ,OAAO,SAAS,OAAO;AAAA,cAC1F,oBAAC,SAAI,WAAU,0BACb,mBAAS,UAAU,KAAK,KAAK,IAAI,4BAA4B,GAC/D;AAAA;AAAA;AAAA,QACD;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACA,MAAK;AAAA,YACL,WAAU;AAAA,YACV,OACC,sBACG,IAAI,qBAAqB,IACzB,sBACC,IAAI,uBAAuB,IAC3B,IAAI,oBAAoB;AAAA,YAE7B,SAAS;AAAA,YACT,UAAU;AAAA,YAEV;AAAA,cAAC;AAAA;AAAA,gBACA,MAAM,sBAAsB,YAAY,sBAAsB,cAAc;AAAA;AAAA,YAC7E;AAAA;AAAA,QACD;AAAA;AAAA;AAAA,EACD;AAEF,CAAC;",
+  "sourcesContent": ["import { TLUserId, track, useEditor, usePresence } from '@tldraw/editor'\nimport { useCallback } from 'react'\nimport { useUiEvents } from '../../context/events'\nimport { useTranslation } from '../../hooks/useTranslation/useTranslation'\nimport { TldrawUiButton } from '../primitives/Button/TldrawUiButton'\nimport { TldrawUiButtonIcon } from '../primitives/Button/TldrawUiButtonIcon'\nimport { TldrawUiRow } from '../primitives/layout'\nimport { TldrawUiIcon } from '../primitives/TldrawUiIcon'\n\n/** @public */\nexport interface TLUiPeopleMenuItemProps {\n\tuserId: TLUserId\n}\n\n/** @public @react */\nexport const DefaultPeopleMenuItem = track(function DefaultPeopleMenuItem({\n\tuserId,\n}: TLUiPeopleMenuItemProps) {\n\tconst editor = useEditor()\n\tconst msg = useTranslation()\n\tconst trackEvent = useUiEvents()\n\n\tconst presence = usePresence(userId)\n\n\tconst handleFollowClick = useCallback(() => {\n\t\tif (editor.getInstanceState().followingUserId === userId) {\n\t\t\teditor.stopFollowingUser()\n\t\t\ttrackEvent('stop-following', { source: 'people-menu' })\n\t\t} else {\n\t\t\teditor.startFollowingUser(userId)\n\t\t\ttrackEvent('start-following', { source: 'people-menu' })\n\t\t}\n\t}, [editor, userId, trackEvent])\n\n\tconst theyAreFollowingYou = presence?.followingUserId === editor.user.getRecordId()\n\tconst youAreFollowingThem = editor.getInstanceState().followingUserId === userId\n\n\tif (!presence) return null\n\n\treturn (\n\t\t<TldrawUiRow\n\t\t\tclassName=\"tlui-people-menu__item\"\n\t\t\tdata-follow={youAreFollowingThem || theyAreFollowingYou}\n\t\t>\n\t\t\t<TldrawUiButton\n\t\t\t\ttype=\"menu\"\n\t\t\t\tclassName=\"tlui-people-menu__item__button\"\n\t\t\t\tonClick={() => editor.zoomToUser(userId)}\n\t\t\t\tonDoubleClick={handleFollowClick}\n\t\t\t>\n\t\t\t\t<TldrawUiIcon label={msg('people-menu.avatar-color')} icon=\"color\" color={presence.color} />\n\t\t\t\t<div className=\"tlui-people-menu__name\">\n\t\t\t\t\t{presence.userName?.trim() || msg('people-menu.anonymous-user')}\n\t\t\t\t</div>\n\t\t\t</TldrawUiButton>\n\t\t\t<TldrawUiButton\n\t\t\t\ttype=\"icon\"\n\t\t\t\tclassName=\"tlui-people-menu__item__follow\"\n\t\t\t\ttitle={\n\t\t\t\t\ttheyAreFollowingYou\n\t\t\t\t\t\t? msg('people-menu.leading')\n\t\t\t\t\t\t: youAreFollowingThem\n\t\t\t\t\t\t\t? msg('people-menu.following')\n\t\t\t\t\t\t\t: msg('people-menu.follow')\n\t\t\t\t}\n\t\t\t\tonClick={handleFollowClick}\n\t\t\t\tdisabled={theyAreFollowingYou}\n\t\t\t>\n\t\t\t\t<TldrawUiButtonIcon\n\t\t\t\t\ticon={theyAreFollowingYou ? 'leading' : youAreFollowingThem ? 'following' : 'follow'}\n\t\t\t\t/>\n\t\t\t</TldrawUiButton>\n\t\t</TldrawUiRow>\n\t)\n})\n"],
+  "mappings": "AA4CG,SAMC,KAND;AA5CH,SAAmB,OAAO,WAAW,mBAAmB;AACxD,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,sBAAsB;AAC/B,SAAS,0BAA0B;AACnC,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAQtB,MAAM,wBAAwB,MAAM,SAASA,uBAAsB;AAAA,EACzE;AACD,GAA4B;AAC3B,QAAM,SAAS,UAAU;AACzB,QAAM,MAAM,eAAe;AAC3B,QAAM,aAAa,YAAY;AAE/B,QAAM,WAAW,YAAY,MAAM;AAEnC,QAAM,oBAAoB,YAAY,MAAM;AAC3C,QAAI,OAAO,iBAAiB,EAAE,oBAAoB,QAAQ;AACzD,aAAO,kBAAkB;AACzB,iBAAW,kBAAkB,EAAE,QAAQ,cAAc,CAAC;AAAA,IACvD,OAAO;AACN,aAAO,mBAAmB,MAAM;AAChC,iBAAW,mBAAmB,EAAE,QAAQ,cAAc,CAAC;AAAA,IACxD;AAAA,EACD,GAAG,CAAC,QAAQ,QAAQ,UAAU,CAAC;AAE/B,QAAM,sBAAsB,UAAU,oBAAoB,OAAO,KAAK,YAAY;AAClF,QAAM,sBAAsB,OAAO,iBAAiB,EAAE,oBAAoB;AAE1E,MAAI,CAAC,SAAU,QAAO;AAEtB,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,eAAa,uBAAuB;AAAA,MAEpC;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,MAAK;AAAA,YACL,WAAU;AAAA,YACV,SAAS,MAAM,OAAO,WAAW,MAAM;AAAA,YACvC,eAAe;AAAA,YAEf;AAAA,kCAAC,gBAAa,OAAO,IAAI,0BAA0B,GAAG,MAAK,SAAQ,OAAO,SAAS,OAAO;AAAA,cAC1F,oBAAC,SAAI,WAAU,0BACb,mBAAS,UAAU,KAAK,KAAK,IAAI,4BAA4B,GAC/D;AAAA;AAAA;AAAA,QACD;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACA,MAAK;AAAA,YACL,WAAU;AAAA,YACV,OACC,sBACG,IAAI,qBAAqB,IACzB,sBACC,IAAI,uBAAuB,IAC3B,IAAI,oBAAoB;AAAA,YAE7B,SAAS;AAAA,YACT,UAAU;AAAA,YAEV;AAAA,cAAC;AAAA;AAAA,gBACA,MAAM,sBAAsB,YAAY,sBAAsB,cAAc;AAAA;AAAA,YAC7E;AAAA;AAAA,QACD;AAAA;AAAA;AAAA,EACD;AAEF,CAAC;",
   "names": ["DefaultPeopleMenuItem"]
 }

package/dist-esm/lib/ui/components/StylePanel/StylePanelButtonPicker.mjs CHANGED Viewed

@@ -84,6 +84,7 @@ function StylePanelButtonPickerInlineInner(props) {
       onValueChange(style, id);
     };
     const handleButtonPointerUp2 = (e) => {
+      if (!rPointing.current) return;
       const { id } = e.currentTarget.dataset;
       if (value.type === "shared" && value.value === id) return;
       onValueChange(style, id);

package/dist-esm/lib/ui/components/StylePanel/StylePanelButtonPicker.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/ui/components/StylePanel/StylePanelButtonPicker.tsx"],
-  "sourcesContent": ["import {\n\tDefaultColorStyle,\n\telementShouldCaptureKeys,\n\tgetColorValue,\n\tSharedStyle,\n\tStyleProp,\n\tTLDefaultColorStyle,\n\tuseEditor,\n\tuseValue,\n} from '@tldraw/editor'\nimport { memo, useMemo, useRef } from 'react'\nimport { StyleValuesForUi } from '../../../styles'\nimport { PORTRAIT_BREAKPOINT } from '../../constants'\nimport { useBreakpoint } from '../../context/breakpoints'\nimport { TLUiTranslationKey } from '../../hooks/useTranslation/TLUiTranslationKey'\nimport { useTranslation } from '../../hooks/useTranslation/useTranslation'\nimport { TldrawUiButtonIcon } from '../primitives/Button/TldrawUiButtonIcon'\nimport { TldrawUiGrid, TldrawUiRow } from '../primitives/layout'\nimport {\n\tTldrawUiToolbar,\n\tTldrawUiToolbarToggleGroup,\n\tTldrawUiToolbarToggleItem,\n} from '../primitives/TldrawUiToolbar'\nimport { useStylePanelContext } from './StylePanelContext'\nimport { StylePanelSubheading } from './StylePanelSubheading'\n\n/** @public */\nexport interface StylePanelButtonPickerProps<T extends string> {\n\ttitle: string\n\tuiType: string\n\tstyle: StyleProp<T>\n\tvalue: SharedStyle<T>\n\titems: StyleValuesForUi<T>\n\tonValueChange?(style: StyleProp<T>, value: T): void\n\tonHistoryMark?(id: string): void\n}\n\nfunction StylePanelButtonPickerInner<T extends string>(props: StylePanelButtonPickerProps<T>) {\n\tconst { enhancedA11yMode } = useStylePanelContext()\n\treturn (\n\t\t<>\n\t\t\t{enhancedA11yMode && <StylePanelSubheading>{props.title}</StylePanelSubheading>}\n\t\t\t<TldrawUiToolbar label={props.title}>\n\t\t\t\t<StylePanelButtonPickerInline {...props} />\n\t\t\t</TldrawUiToolbar>\n\t\t</>\n\t)\n}\n\nfunction StylePanelButtonPickerInlineInner<T extends string>(\n\tprops: StylePanelButtonPickerProps<T>\n) {\n\tconst ctx = useStylePanelContext()\n\n\tconst {\n\t\tuiType,\n\t\titems,\n\t\ttitle,\n\t\tstyle,\n\t\tvalue,\n\t\tonValueChange = ctx.onValueChange,\n\t\tonHistoryMark = ctx.onHistoryMark,\n\t} = props\n\tconst editor = useEditor()\n\tconst colors = useValue(\n\t\t'style panel button picker colors',\n\t\t() => editor.getCurrentTheme().colors[editor.getColorMode()],\n\t\t[editor]\n\t)\n\tconst msg = useTranslation()\n\tconst breakpoint = useBreakpoint()\n\n\tconst rPointing = useRef(false)\n\tconst rPointingOriginalActiveElement = useRef<HTMLElement | null>(null)\n\n\tconst {\n\t\thandleButtonClick,\n\t\thandleButtonPointerDown,\n\t\thandleButtonPointerEnter,\n\t\thandleButtonPointerUp,\n\t} = useMemo(() => {\n\t\tconst handlePointerUp = () => {\n\t\t\trPointing.current = false\n\t\t\teditor.getContainerWindow().removeEventListener('pointerup', handlePointerUp)\n\n\t\t\t// This is fun little micro-optimization to make sure that the focus\n\t\t\t// is retained on a text label. That way, you can continue typing\n\t\t\t// after selecting a style.\n\t\t\tconst origActiveEl = rPointingOriginalActiveElement.current\n\t\t\tif (origActiveEl && elementShouldCaptureKeys(origActiveEl, false)) {\n\t\t\t\torigActiveEl.focus()\n\t\t\t} else if (breakpoint >= PORTRAIT_BREAKPOINT.TABLET_SM) {\n\t\t\t\teditor.getContainer().focus()\n\t\t\t}\n\t\t\trPointingOriginalActiveElement.current = null\n\t\t}\n\n\t\tconst handleButtonClick = (e: React.PointerEvent<HTMLButtonElement>) => {\n\t\t\tconst { id } = e.currentTarget.dataset\n\t\t\tif (value.type === 'shared' && value.value === id) return\n\n\t\t\tonHistoryMark?.('point picker item')\n\t\t\tonValueChange(style, id as T)\n\t\t}\n\n\t\tconst handleButtonPointerDown = (e: React.PointerEvent<HTMLButtonElement>) => {\n\t\t\tconst { id } = e.currentTarget.dataset\n\n\t\t\tonHistoryMark?.('point picker item')\n\t\t\tonValueChange(style, id as T)\n\n\t\t\trPointing.current = true\n\t\t\trPointingOriginalActiveElement.current = editor.getContainerDocument()\n\t\t\t\t.activeElement as HTMLElement\n\t\t\teditor.getContainerWindow().addEventListener('pointerup', handlePointerUp) // see TLD-658\n\t\t}\n\n\t\tconst handleButtonPointerEnter = (e: React.PointerEvent<HTMLButtonElement>) => {\n\t\t\tif (!rPointing.current) return\n\n\t\t\tconst { id } = e.currentTarget.dataset\n\t\t\tonValueChange(style, id as T)\n\t\t}\n\n\t\tconst handleButtonPointerUp = (e: React.PointerEvent<HTMLButtonElement>) => {\n\t\t\tconst { id } = e.currentTarget.dataset\n\t\t\tif (value.type === 'shared' && value.value === id) return\n\n\t\t\tonValueChange(style, id as T)\n\t\t}\n\n\t\treturn {\n\t\t\thandleButtonClick,\n\t\t\thandleButtonPointerDown,\n\t\t\thandleButtonPointerEnter,\n\t\t\thandleButtonPointerUp,\n\t\t}\n\t}, [editor, breakpoint, value, onHistoryMark, onValueChange, style])\n\n\tconst Layout = items.length > 4 ? TldrawUiGrid : TldrawUiRow\n\n\treturn (\n\t\t<TldrawUiToolbarToggleGroup\n\t\t\tdata-testid={`style.${uiType}`}\n\t\t\ttype=\"single\"\n\t\t\tvalue={value.type === 'shared' ? value.value : null}\n\t\t\tasChild\n\t\t>\n\t\t\t<Layout>\n\t\t\t\t{items.map((item) => {\n\t\t\t\t\tconst isActive = value.type === 'shared' && value.value === item.value\n\t\t\t\t\tconst label = title + ' \u2014 ' + msg(`${uiType}-style.${item.value}` as TLUiTranslationKey)\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<TldrawUiToolbarToggleItem\n\t\t\t\t\t\t\ttype=\"icon\"\n\t\t\t\t\t\t\tkey={item.value}\n\t\t\t\t\t\t\tdata-id={item.value}\n\t\t\t\t\t\t\tdata-testid={`style.${uiType}.${item.value}`}\n\t\t\t\t\t\t\taria-label={label + (isActive ? ` (${msg('style-panel.selected')})` : '')}\n\t\t\t\t\t\t\ttooltip={\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<div>{label}</div>\n\t\t\t\t\t\t\t\t\t{isActive ? <div>({msg('style-panel.selected')})</div> : null}\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={item.value}\n\t\t\t\t\t\t\tdata-state={value.type === 'shared' && value.value === item.value ? 'on' : 'off'}\n\t\t\t\t\t\t\tdata-isactive={isActive}\n\t\t\t\t\t\t\ttitle={label}\n\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\tstyle === (DefaultColorStyle as StyleProp<unknown>)\n\t\t\t\t\t\t\t\t\t? { color: getColorValue(colors, item.value as TLDefaultColorStyle, 'solid') }\n\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonPointerEnter={handleButtonPointerEnter}\n\t\t\t\t\t\t\tonPointerDown={handleButtonPointerDown}\n\t\t\t\t\t\t\tonPointerUp={handleButtonPointerUp}\n\t\t\t\t\t\t\tonClick={handleButtonClick}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<TldrawUiButtonIcon icon={item.icon} />\n\t\t\t\t\t\t</TldrawUiToolbarToggleItem>\n\t\t\t\t\t)\n\t\t\t\t})}\n\t\t\t</Layout>\n\t\t</TldrawUiToolbarToggleGroup>\n\t)\n}\n\n/** @public @react */\nexport const StylePanelButtonPicker = memo(StylePanelButtonPickerInner) as <T extends string>(\n\tprops: StylePanelButtonPickerProps<T>\n) => React.JSX.Element\n\n/** @public @react*/\nexport const StylePanelButtonPickerInline = memo(StylePanelButtonPickerInlineInner) as <\n\tT extends string,\n>(\n\tprops: StylePanelButtonPickerProps<T>\n) => React.JSX.Element\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n\tDefaultColorStyle,\n\telementShouldCaptureKeys,\n\tgetColorValue,\n\tSharedStyle,\n\tStyleProp,\n\tTLDefaultColorStyle,\n\tuseEditor,\n\tuseValue,\n} from '@tldraw/editor'\nimport { memo, useMemo, useRef } from 'react'\nimport { StyleValuesForUi } from '../../../styles'\nimport { PORTRAIT_BREAKPOINT } from '../../constants'\nimport { useBreakpoint } from '../../context/breakpoints'\nimport { TLUiTranslationKey } from '../../hooks/useTranslation/TLUiTranslationKey'\nimport { useTranslation } from '../../hooks/useTranslation/useTranslation'\nimport { TldrawUiButtonIcon } from '../primitives/Button/TldrawUiButtonIcon'\nimport { TldrawUiGrid, TldrawUiRow } from '../primitives/layout'\nimport {\n\tTldrawUiToolbar,\n\tTldrawUiToolbarToggleGroup,\n\tTldrawUiToolbarToggleItem,\n} from '../primitives/TldrawUiToolbar'\nimport { useStylePanelContext } from './StylePanelContext'\nimport { StylePanelSubheading } from './StylePanelSubheading'\n\n/** @public */\nexport interface StylePanelButtonPickerProps<T extends string> {\n\ttitle: string\n\tuiType: string\n\tstyle: StyleProp<T>\n\tvalue: SharedStyle<T>\n\titems: StyleValuesForUi<T>\n\tonValueChange?(style: StyleProp<T>, value: T): void\n\tonHistoryMark?(id: string): void\n}\n\nfunction StylePanelButtonPickerInner<T extends string>(props: StylePanelButtonPickerProps<T>) {\n\tconst { enhancedA11yMode } = useStylePanelContext()\n\treturn (\n\t\t<>\n\t\t\t{enhancedA11yMode && <StylePanelSubheading>{props.title}</StylePanelSubheading>}\n\t\t\t<TldrawUiToolbar label={props.title}>\n\t\t\t\t<StylePanelButtonPickerInline {...props} />\n\t\t\t</TldrawUiToolbar>\n\t\t</>\n\t)\n}\n\nfunction StylePanelButtonPickerInlineInner<T extends string>(\n\tprops: StylePanelButtonPickerProps<T>\n) {\n\tconst ctx = useStylePanelContext()\n\n\tconst {\n\t\tuiType,\n\t\titems,\n\t\ttitle,\n\t\tstyle,\n\t\tvalue,\n\t\tonValueChange = ctx.onValueChange,\n\t\tonHistoryMark = ctx.onHistoryMark,\n\t} = props\n\tconst editor = useEditor()\n\tconst colors = useValue(\n\t\t'style panel button picker colors',\n\t\t() => editor.getCurrentTheme().colors[editor.getColorMode()],\n\t\t[editor]\n\t)\n\tconst msg = useTranslation()\n\tconst breakpoint = useBreakpoint()\n\n\tconst rPointing = useRef(false)\n\tconst rPointingOriginalActiveElement = useRef<HTMLElement | null>(null)\n\n\tconst {\n\t\thandleButtonClick,\n\t\thandleButtonPointerDown,\n\t\thandleButtonPointerEnter,\n\t\thandleButtonPointerUp,\n\t} = useMemo(() => {\n\t\tconst handlePointerUp = () => {\n\t\t\trPointing.current = false\n\t\t\teditor.getContainerWindow().removeEventListener('pointerup', handlePointerUp)\n\n\t\t\t// This is fun little micro-optimization to make sure that the focus\n\t\t\t// is retained on a text label. That way, you can continue typing\n\t\t\t// after selecting a style.\n\t\t\tconst origActiveEl = rPointingOriginalActiveElement.current\n\t\t\tif (origActiveEl && elementShouldCaptureKeys(origActiveEl, false)) {\n\t\t\t\torigActiveEl.focus()\n\t\t\t} else if (breakpoint >= PORTRAIT_BREAKPOINT.TABLET_SM) {\n\t\t\t\teditor.getContainer().focus()\n\t\t\t}\n\t\t\trPointingOriginalActiveElement.current = null\n\t\t}\n\n\t\tconst handleButtonClick = (e: React.PointerEvent<HTMLButtonElement>) => {\n\t\t\tconst { id } = e.currentTarget.dataset\n\t\t\tif (value.type === 'shared' && value.value === id) return\n\n\t\t\tonHistoryMark?.('point picker item')\n\t\t\tonValueChange(style, id as T)\n\t\t}\n\n\t\tconst handleButtonPointerDown = (e: React.PointerEvent<HTMLButtonElement>) => {\n\t\t\tconst { id } = e.currentTarget.dataset\n\n\t\t\tonHistoryMark?.('point picker item')\n\t\t\tonValueChange(style, id as T)\n\n\t\t\trPointing.current = true\n\t\t\trPointingOriginalActiveElement.current = editor.getContainerDocument()\n\t\t\t\t.activeElement as HTMLElement\n\t\t\teditor.getContainerWindow().addEventListener('pointerup', handlePointerUp) // see TLD-658\n\t\t}\n\n\t\tconst handleButtonPointerEnter = (e: React.PointerEvent<HTMLButtonElement>) => {\n\t\t\tif (!rPointing.current) return\n\n\t\t\tconst { id } = e.currentTarget.dataset\n\t\t\tonValueChange(style, id as T)\n\t\t}\n\n\t\tconst handleButtonPointerUp = (e: React.PointerEvent<HTMLButtonElement>) => {\n\t\t\t// Only apply on release if the scrub started in this picker. Otherwise\n\t\t\t// releasing over a different style section selects that section's\n\t\t\t// option, even though scrubbing can't cross sections. See #9223.\n\t\t\tif (!rPointing.current) return\n\n\t\t\tconst { id } = e.currentTarget.dataset\n\t\t\tif (value.type === 'shared' && value.value === id) return\n\n\t\t\tonValueChange(style, id as T)\n\t\t}\n\n\t\treturn {\n\t\t\thandleButtonClick,\n\t\t\thandleButtonPointerDown,\n\t\t\thandleButtonPointerEnter,\n\t\t\thandleButtonPointerUp,\n\t\t}\n\t}, [editor, breakpoint, value, onHistoryMark, onValueChange, style])\n\n\tconst Layout = items.length > 4 ? TldrawUiGrid : TldrawUiRow\n\n\treturn (\n\t\t<TldrawUiToolbarToggleGroup\n\t\t\tdata-testid={`style.${uiType}`}\n\t\t\ttype=\"single\"\n\t\t\tvalue={value.type === 'shared' ? value.value : null}\n\t\t\tasChild\n\t\t>\n\t\t\t<Layout>\n\t\t\t\t{items.map((item) => {\n\t\t\t\t\tconst isActive = value.type === 'shared' && value.value === item.value\n\t\t\t\t\tconst label = title + ' \u2014 ' + msg(`${uiType}-style.${item.value}` as TLUiTranslationKey)\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<TldrawUiToolbarToggleItem\n\t\t\t\t\t\t\ttype=\"icon\"\n\t\t\t\t\t\t\tkey={item.value}\n\t\t\t\t\t\t\tdata-id={item.value}\n\t\t\t\t\t\t\tdata-testid={`style.${uiType}.${item.value}`}\n\t\t\t\t\t\t\taria-label={label + (isActive ? ` (${msg('style-panel.selected')})` : '')}\n\t\t\t\t\t\t\ttooltip={\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<div>{label}</div>\n\t\t\t\t\t\t\t\t\t{isActive ? <div>({msg('style-panel.selected')})</div> : null}\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={item.value}\n\t\t\t\t\t\t\tdata-state={value.type === 'shared' && value.value === item.value ? 'on' : 'off'}\n\t\t\t\t\t\t\tdata-isactive={isActive}\n\t\t\t\t\t\t\ttitle={label}\n\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\tstyle === (DefaultColorStyle as StyleProp<unknown>)\n\t\t\t\t\t\t\t\t\t? { color: getColorValue(colors, item.value as TLDefaultColorStyle, 'solid') }\n\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonPointerEnter={handleButtonPointerEnter}\n\t\t\t\t\t\t\tonPointerDown={handleButtonPointerDown}\n\t\t\t\t\t\t\tonPointerUp={handleButtonPointerUp}\n\t\t\t\t\t\t\tonClick={handleButtonClick}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<TldrawUiButtonIcon icon={item.icon} />\n\t\t\t\t\t\t</TldrawUiToolbarToggleItem>\n\t\t\t\t\t)\n\t\t\t\t})}\n\t\t\t</Layout>\n\t\t</TldrawUiToolbarToggleGroup>\n\t)\n}\n\n/** @public @react */\nexport const StylePanelButtonPicker = memo(StylePanelButtonPickerInner) as <T extends string>(\n\tprops: StylePanelButtonPickerProps<T>\n) => React.JSX.Element\n\n/** @public @react*/\nexport const StylePanelButtonPickerInline = memo(StylePanelButtonPickerInlineInner) as <\n\tT extends string,\n>(\n\tprops: StylePanelButtonPickerProps<T>\n) => React.JSX.Element\n"],
+  "mappings": "AAwCE,mBACsB,KADtB;AAxCF;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EAIA;AAAA,EACA;AAAA,OACM;AACP,SAAS,MAAM,SAAS,cAAc;AAEtC,SAAS,2BAA2B;AACpC,SAAS,qBAAqB;AAE9B,SAAS,sBAAsB;AAC/B,SAAS,0BAA0B;AACnC,SAAS,cAAc,mBAAmB;AAC1C;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,4BAA4B;AACrC,SAAS,4BAA4B;AAarC,SAAS,4BAA8C,OAAuC;AAC7F,QAAM,EAAE,iBAAiB,IAAI,qBAAqB;AAClD,SACC,iCACE;AAAA,wBAAoB,oBAAC,wBAAsB,gBAAM,OAAM;AAAA,IACxD,oBAAC,mBAAgB,OAAO,MAAM,OAC7B,8BAAC,gCAA8B,GAAG,OAAO,GAC1C;AAAA,KACD;AAEF;AAEA,SAAS,kCACR,OACC;AACD,QAAM,MAAM,qBAAqB;AAEjC,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB,IAAI;AAAA,IACpB,gBAAgB,IAAI;AAAA,EACrB,IAAI;AACJ,QAAM,SAAS,UAAU;AACzB,QAAM,SAAS;AAAA,IACd;AAAA,IACA,MAAM,OAAO,gBAAgB,EAAE,OAAO,OAAO,aAAa,CAAC;AAAA,IAC3D,CAAC,MAAM;AAAA,EACR;AACA,QAAM,MAAM,eAAe;AAC3B,QAAM,aAAa,cAAc;AAEjC,QAAM,YAAY,OAAO,KAAK;AAC9B,QAAM,iCAAiC,OAA2B,IAAI;AAEtE,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI,QAAQ,MAAM;AACjB,UAAM,kBAAkB,MAAM;AAC7B,gBAAU,UAAU;AACpB,aAAO,mBAAmB,EAAE,oBAAoB,aAAa,eAAe;AAK5E,YAAM,eAAe,+BAA+B;AACpD,UAAI,gBAAgB,yBAAyB,cAAc,KAAK,GAAG;AAClE,qBAAa,MAAM;AAAA,MACpB,WAAW,cAAc,oBAAoB,WAAW;AACvD,eAAO,aAAa,EAAE,MAAM;AAAA,MAC7B;AACA,qCAA+B,UAAU;AAAA,IAC1C;AAEA,UAAMA,qBAAoB,CAAC,MAA6C;AACvE,YAAM,EAAE,GAAG,IAAI,EAAE,cAAc;AAC/B,UAAI,MAAM,SAAS,YAAY,MAAM,UAAU,GAAI;AAEnD,sBAAgB,mBAAmB;AACnC,oBAAc,OAAO,EAAO;AAAA,IAC7B;AAEA,UAAMC,2BAA0B,CAAC,MAA6C;AAC7E,YAAM,EAAE,GAAG,IAAI,EAAE,cAAc;AAE/B,sBAAgB,mBAAmB;AACnC,oBAAc,OAAO,EAAO;AAE5B,gBAAU,UAAU;AACpB,qCAA+B,UAAU,OAAO,qBAAqB,EACnE;AACF,aAAO,mBAAmB,EAAE,iBAAiB,aAAa,eAAe;AAAA,IAC1E;AAEA,UAAMC,4BAA2B,CAAC,MAA6C;AAC9E,UAAI,CAAC,UAAU,QAAS;AAExB,YAAM,EAAE,GAAG,IAAI,EAAE,cAAc;AAC/B,oBAAc,OAAO,EAAO;AAAA,IAC7B;AAEA,UAAMC,yBAAwB,CAAC,MAA6C;AAI3E,UAAI,CAAC,UAAU,QAAS;AAExB,YAAM,EAAE,GAAG,IAAI,EAAE,cAAc;AAC/B,UAAI,MAAM,SAAS,YAAY,MAAM,UAAU,GAAI;AAEnD,oBAAc,OAAO,EAAO;AAAA,IAC7B;AAEA,WAAO;AAAA,MACN,mBAAAH;AAAA,MACA,yBAAAC;AAAA,MACA,0BAAAC;AAAA,MACA,uBAAAC;AAAA,IACD;AAAA,EACD,GAAG,CAAC,QAAQ,YAAY,OAAO,eAAe,eAAe,KAAK,CAAC;AAEnE,QAAM,SAAS,MAAM,SAAS,IAAI,eAAe;AAEjD,SACC;AAAA,IAAC;AAAA;AAAA,MACA,eAAa,SAAS,MAAM;AAAA,MAC5B,MAAK;AAAA,MACL,OAAO,MAAM,SAAS,WAAW,MAAM,QAAQ;AAAA,MAC/C,SAAO;AAAA,MAEP,8BAAC,UACC,gBAAM,IAAI,CAAC,SAAS;AACpB,cAAM,WAAW,MAAM,SAAS,YAAY,MAAM,UAAU,KAAK;AACjE,cAAM,QAAQ,QAAQ,aAAQ,IAAI,GAAG,MAAM,UAAU,KAAK,KAAK,EAAwB;AACvF,eACC;AAAA,UAAC;AAAA;AAAA,YACA,MAAK;AAAA,YAEL,WAAS,KAAK;AAAA,YACd,eAAa,SAAS,MAAM,IAAI,KAAK,KAAK;AAAA,YAC1C,cAAY,SAAS,WAAW,KAAK,IAAI,sBAAsB,CAAC,MAAM;AAAA,YACtE,SACC,iCACC;AAAA,kCAAC,SAAK,iBAAM;AAAA,cACX,WAAW,qBAAC,SAAI;AAAA;AAAA,gBAAE,IAAI,sBAAsB;AAAA,gBAAE;AAAA,iBAAC,IAAS;AAAA,eAC1D;AAAA,YAED,OAAO,KAAK;AAAA,YACZ,cAAY,MAAM,SAAS,YAAY,MAAM,UAAU,KAAK,QAAQ,OAAO;AAAA,YAC3E,iBAAe;AAAA,YACf,OAAO;AAAA,YACP,OACC,UAAW,oBACR,EAAE,OAAO,cAAc,QAAQ,KAAK,OAA8B,OAAO,EAAE,IAC3E;AAAA,YAEJ,gBAAgB;AAAA,YAChB,eAAe;AAAA,YACf,aAAa;AAAA,YACb,SAAS;AAAA,YAET,8BAAC,sBAAmB,MAAM,KAAK,MAAM;AAAA;AAAA,UAxBhC,KAAK;AAAA,QAyBX;AAAA,MAEF,CAAC,GACF;AAAA;AAAA,EACD;AAEF;AAGO,MAAM,yBAAyB,KAAK,2BAA2B;AAK/D,MAAM,+BAA+B,KAAK,iCAAiC;",
   "names": ["handleButtonClick", "handleButtonPointerDown", "handleButtonPointerEnter", "handleButtonPointerUp"]
 }

package/dist-esm/lib/ui/components/menu-items.mjs CHANGED Viewed

@@ -80,6 +80,11 @@ function UngroupMenuItem() {
   if (!shouldDisplay) return null;
   return /* @__PURE__ */ jsx(TldrawUiMenuActionItem, { actionId: "ungroup" });
 }
+function FrameSelectionMenuItem() {
+  const shouldDisplay = useAllowGroup();
+  if (!shouldDisplay) return null;
+  return /* @__PURE__ */ jsx(TldrawUiMenuActionItem, { actionId: "frame-selection" });
+}
 function RemoveFrameMenuItem() {
   const editor = useEditor();
   const shouldDisplay = useValue(
@@ -252,6 +257,7 @@ function EditMenuSubmenu() {
     /* @__PURE__ */ jsx(GroupMenuItem, {}),
     /* @__PURE__ */ jsx(UngroupMenuItem, {}),
     /* @__PURE__ */ jsx(FlattenMenuItem, {}),
+    /* @__PURE__ */ jsx(FrameSelectionMenuItem, {}),
     /* @__PURE__ */ jsx(EditLinkMenuItem, {}),
     /* @__PURE__ */ jsx(FitFrameToContentMenuItem, {}),
     /* @__PURE__ */ jsx(RemoveFrameMenuItem, {}),
@@ -547,6 +553,7 @@ export {
   EditMenuSubmenu,
   FitFrameToContentMenuItem,
   FlattenMenuItem,
+  FrameSelectionMenuItem,
   GroupMenuItem,
   MoveToPageMenu,
   PasteMenuItem,

package/dist-esm/lib/ui/components/menu-items.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/ui/components/menu-items.tsx"],
-  "sourcesContent": ["import { TLPageId, useEditor, useValue } from '@tldraw/editor'\nimport { supportsDownloadingOriginal } from '../context/actions'\nimport { useUiEvents } from '../context/events'\nimport { useToasts } from '../context/toasts'\nimport {\n\tshowMenuPaste,\n\tuseAllowGroup,\n\tuseAllowUngroup,\n\tuseAnySelectedShapesCount,\n\tuseCanApplySelectionAction,\n\tuseHasLinkShapeSelected,\n\tuseHasShapesOnPage,\n\tuseOnlyFlippableShape,\n\tuseShowAutoSizeToggle,\n\tuseThreeStackableItems,\n\tuseUnlockedSelectedShapesCount,\n} from '../hooks/menu-hooks'\nimport { useGetEmbedDefinition } from '../hooks/useGetEmbedDefinition'\nimport { useReadonly } from '../hooks/useReadonly'\nimport { TldrawUiMenuActionCheckboxItem } from './primitives/menus/TldrawUiMenuActionCheckboxItem'\nimport { TldrawUiMenuActionItem } from './primitives/menus/TldrawUiMenuActionItem'\nimport { TldrawUiMenuGroup } from './primitives/menus/TldrawUiMenuGroup'\nimport { TldrawUiMenuItem } from './primitives/menus/TldrawUiMenuItem'\nimport { TldrawUiMenuSubmenu } from './primitives/menus/TldrawUiMenuSubmenu'\n\n/* -------------------- Selection ------------------- */\n\n/** @public @react */\nexport function ToggleAutoSizeMenuItem() {\n\tconst shouldDisplay = useShowAutoSizeToggle()\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"toggle-auto-size\" />\n}\n\n/** @public @react */\nexport function EditLinkMenuItem() {\n\tconst shouldDisplay = useHasLinkShapeSelected()\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"edit-link\" />\n}\n\n/** @public @react */\nexport function DuplicateMenuItem() {\n\tconst shouldDisplay = useUnlockedSelectedShapesCount(1)\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"duplicate\" />\n}\n\n/** @public @react */\nexport function FlattenMenuItem() {\n\tconst editor = useEditor()\n\tconst shouldDisplay = useValue(\n\t\t'should display flatten option',\n\t\t() => {\n\t\t\tconst selectedShapeIds = editor.getSelectedShapeIds()\n\t\t\tif (selectedShapeIds.length === 0) return false\n\t\t\tconst onlySelectedShape = editor.getOnlySelectedShape()\n\t\t\tif (onlySelectedShape && editor.isShapeOfType(onlySelectedShape, 'image')) {\n\t\t\t\treturn false\n\t\t\t}\n\t\t\treturn true\n\t\t},\n\t\t[editor]\n\t)\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"flatten-to-image\" />\n}\n\n/** @public @react */\nexport function DownloadOriginalMenuItem() {\n\tconst editor = useEditor()\n\tconst shouldDisplay = useValue(\n\t\t'should display download original option',\n\t\t() => {\n\t\t\tconst selectedShapes = editor.getSelectedShapes()\n\t\t\tif (selectedShapes.length === 0) return false\n\t\t\treturn selectedShapes.some((shape) => supportsDownloadingOriginal(shape, editor))\n\t\t},\n\t\t[editor]\n\t)\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"download-original\" />\n}\n\n/** @public @react */\nexport function GroupMenuItem() {\n\tconst shouldDisplay = useAllowGroup()\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"group\" />\n}\n\n/** @public @react */\nexport function UngroupMenuItem() {\n\tconst shouldDisplay = useAllowUngroup()\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"ungroup\" />\n}\n\n/** @public @react */\nexport function RemoveFrameMenuItem() {\n\tconst editor = useEditor()\n\tconst shouldDisplay = useValue(\n\t\t'allow unframe',\n\t\t() => {\n\t\t\tconst selectedShapes = editor.getSelectedShapes()\n\t\t\tif (selectedShapes.length === 0) return false\n\t\t\treturn selectedShapes.every((shape) => editor.isShapeFrameLike(shape))\n\t\t},\n\t\t[editor]\n\t)\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"remove-frame\" />\n}\n\n/** @public @react */\nexport function FitFrameToContentMenuItem() {\n\tconst editor = useEditor()\n\tconst shouldDisplay = useValue(\n\t\t'allow fit frame to content',\n\t\t() => {\n\t\t\tconst onlySelectedShape = editor.getOnlySelectedShape()\n\t\t\tif (!onlySelectedShape) return false\n\t\t\treturn (\n\t\t\t\teditor.isShapeFrameLike(onlySelectedShape) &&\n\t\t\t\teditor.getSortedChildIdsForParent(onlySelectedShape).length > 0\n\t\t\t)\n\t\t},\n\t\t[editor]\n\t)\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"fit-frame-to-content\" />\n}\n\n/** @public @react */\nexport function ToggleLockMenuItem() {\n\tconst shouldDisplay = useAnySelectedShapesCount(1)\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"toggle-lock\" />\n}\n\n/** @public @react */\nexport function ToggleTransparentBgMenuItem() {\n\tconst editor = useEditor()\n\tconst isTransparentBg = useValue(\n\t\t'isTransparentBg',\n\t\t() => !editor.getInstanceState().exportBackground,\n\t\t[editor]\n\t)\n\n\treturn (\n\t\t<TldrawUiMenuActionCheckboxItem\n\t\t\tactionId=\"toggle-transparent\"\n\t\t\tchecked={isTransparentBg}\n\t\t\ttoggle\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function UnlockAllMenuItem() {\n\tconst hasShapes = useHasShapesOnPage()\n\n\treturn <TldrawUiMenuActionItem actionId=\"unlock-all\" disabled={!hasShapes} />\n}\n\n/* ---------------------- Zoom ---------------------- */\n\n/** @public @react */\nexport function ZoomTo100MenuItem() {\n\tconst editor = useEditor()\n\tconst isZoomedTo100 = useValue('zoomed to 100', () => editor.getEfficientZoomLevel() === 1, [\n\t\teditor,\n\t])\n\n\treturn <TldrawUiMenuActionItem actionId=\"zoom-to-100\" noClose disabled={isZoomedTo100} />\n}\n\n/** @public @react */\nexport function ZoomToFitMenuItem() {\n\tconst hasShapes = useHasShapesOnPage()\n\n\treturn (\n\t\t<TldrawUiMenuActionItem\n\t\t\tactionId=\"zoom-to-fit\"\n\t\t\tdisabled={!hasShapes}\n\t\t\tdata-testid=\"minimap.zoom-menu.zoom-to-fit\"\n\t\t\tnoClose\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function ZoomToSelectionMenuItem() {\n\tconst canApplySelectionAction = useCanApplySelectionAction()\n\n\treturn (\n\t\t<TldrawUiMenuActionItem\n\t\t\tactionId=\"zoom-to-selection\"\n\t\t\tdisabled={!canApplySelectionAction}\n\t\t\tdata-testid=\"minimap.zoom-menu.zoom-to-selection\"\n\t\t\tnoClose\n\t\t/>\n\t)\n}\n\n/* -------------------- Clipboard ------------------- */\n\n/** @public @react */\nexport function ClipboardMenuGroup() {\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"clipboard\">\n\t\t\t<CutMenuItem />\n\t\t\t<CopyMenuItem />\n\t\t\t<PasteMenuItem />\n\t\t\t<DuplicateMenuItem />\n\t\t\t<DeleteMenuItem />\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n\n/** @public @react */\nexport function CopyAsMenuGroup() {\n\tconst editor = useEditor()\n\tconst atLeastOneShapeOnPage = useHasShapesOnPage()\n\tconst isDebugMode = useValue('isDebugMode', () => editor.getInstanceState().isDebugMode, [editor])\n\n\treturn (\n\t\t<TldrawUiMenuSubmenu\n\t\t\tid=\"copy-as\"\n\t\t\tlabel=\"context-menu.copy-as\"\n\t\t\tsize=\"small\"\n\t\t\tdisabled={!atLeastOneShapeOnPage}\n\t\t>\n\t\t\t<TldrawUiMenuGroup id=\"copy-as-group\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"copy-as-svg\" />\n\t\t\t\t{Boolean(editor.getContainerWindow().navigator.clipboard?.write) && (\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"copy-as-png\" />\n\t\t\t\t)}\n\t\t\t\t{isDebugMode && <TldrawUiMenuActionItem actionId=\"copy-as-json\" />}\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup id=\"copy-as-bg\">\n\t\t\t\t<ToggleTransparentBgMenuItem />\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\n/** @public @react */\nexport function CutMenuItem() {\n\tconst canApplySelectionAction = useCanApplySelectionAction()\n\tconst hasUnlockedShapes = useUnlockedSelectedShapesCount(1)\n\n\treturn (\n\t\t<TldrawUiMenuActionItem\n\t\t\tactionId=\"cut\"\n\t\t\tdisabled={!canApplySelectionAction || !hasUnlockedShapes}\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function CopyMenuItem() {\n\tconst canApplySelectionAction = useCanApplySelectionAction()\n\n\treturn <TldrawUiMenuActionItem actionId=\"copy\" disabled={!canApplySelectionAction} />\n}\n\n/** @public @react */\nexport function PasteMenuItem() {\n\tconst shouldDisplay = showMenuPaste\n\n\treturn <TldrawUiMenuActionItem actionId=\"paste\" disabled={!shouldDisplay} />\n}\n\n/* ------------------- Conversions ------------------ */\n\n/** @public @react */\nexport function ConversionsMenuGroup() {\n\tconst atLeastOneShapeOnPage = useHasShapesOnPage()\n\n\tif (!atLeastOneShapeOnPage) return null\n\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"conversions\">\n\t\t\t<CopyAsMenuGroup />\n\t\t\t<TldrawUiMenuSubmenu id=\"export-as\" label=\"context-menu.export-as\" size=\"small\">\n\t\t\t\t<TldrawUiMenuGroup id=\"export-as-group\">\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"export-as-svg\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"export-as-png\" />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t\t<TldrawUiMenuGroup id=\"export-as-bg\">\n\t\t\t\t\t<ToggleTransparentBgMenuItem />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t</TldrawUiMenuSubmenu>\n\t\t\t<DownloadOriginalMenuItem />\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n\n/* ------------------ Set Selection ----------------- */\n/** @public @react */\nexport function SelectAllMenuItem() {\n\tconst atLeastOneShapeOnPage = useHasShapesOnPage()\n\n\treturn <TldrawUiMenuActionItem actionId=\"select-all\" disabled={!atLeastOneShapeOnPage} />\n}\n\n/* ------------------ Delete Group ------------------ */\n\n/** @public @react */\nexport function DeleteMenuItem() {\n\tconst canApplySelectionAction = useCanApplySelectionAction()\n\tconst hasUnlockedShapes = useUnlockedSelectedShapesCount(1)\n\n\treturn (\n\t\t<TldrawUiMenuActionItem\n\t\t\tactionId=\"delete\"\n\t\t\tdisabled={!canApplySelectionAction || !hasUnlockedShapes}\n\t\t/>\n\t)\n}\n\n/* --------------------- Modify --------------------- */\n\n/** @public @react */\nexport function EditMenuSubmenu() {\n\tconst isReadonlyMode = useReadonly()\n\tif (!useAnySelectedShapesCount(1)) return null\n\tif (isReadonlyMode) return null\n\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"edit\" label=\"context-menu.edit\" size=\"small\">\n\t\t\t<GroupMenuItem />\n\t\t\t<UngroupMenuItem />\n\t\t\t<FlattenMenuItem />\n\t\t\t<EditLinkMenuItem />\n\t\t\t<FitFrameToContentMenuItem />\n\t\t\t<RemoveFrameMenuItem />\n\t\t\t<ConvertToEmbedMenuItem />\n\t\t\t<ConvertToBookmarkMenuItem />\n\t\t\t<ToggleAutoSizeMenuItem />\n\t\t\t<ToggleLockMenuItem />\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\n/** @public @react */\nexport function ArrangeMenuSubmenu() {\n\tconst twoSelected = useUnlockedSelectedShapesCount(2)\n\tconst onlyFlippableShapeSelected = useOnlyFlippableShape()\n\tconst isReadonlyMode = useReadonly()\n\n\tif (isReadonlyMode) return null\n\tif (!(twoSelected || onlyFlippableShapeSelected)) return null\n\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"arrange\" label=\"context-menu.arrange\" size=\"small\">\n\t\t\t{twoSelected && (\n\t\t\t\t<TldrawUiMenuGroup id=\"align\">\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-left\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-center-horizontal\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-right\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-top\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-center-vertical\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-bottom\" />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t)}\n\t\t\t<DistributeMenuGroup />\n\t\t\t{twoSelected && (\n\t\t\t\t<TldrawUiMenuGroup id=\"stretch\">\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"stretch-horizontal\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"stretch-vertical\" />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t)}\n\t\t\t{(twoSelected || onlyFlippableShapeSelected) && (\n\t\t\t\t<TldrawUiMenuGroup id=\"flip\">\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"flip-horizontal\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"flip-vertical\" />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t)}\n\t\t\t<OrderMenuGroup />\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\nfunction DistributeMenuGroup() {\n\tconst threeSelected = useUnlockedSelectedShapesCount(3)\n\tif (!threeSelected) return null\n\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"distribute\">\n\t\t\t<TldrawUiMenuActionItem actionId=\"distribute-horizontal\" />\n\t\t\t<TldrawUiMenuActionItem actionId=\"distribute-vertical\" />\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n\nfunction OrderMenuGroup() {\n\tconst twoSelected = useUnlockedSelectedShapesCount(2)\n\tconst threeStackableItems = useThreeStackableItems()\n\tif (!twoSelected) return null\n\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"order\">\n\t\t\t<TldrawUiMenuActionItem actionId=\"pack\" />\n\t\t\t{threeStackableItems && <TldrawUiMenuActionItem actionId=\"stack-horizontal\" />}\n\t\t\t{threeStackableItems && <TldrawUiMenuActionItem actionId=\"stack-vertical\" />}\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n\n/** @public @react */\nexport function ReorderMenuSubmenu() {\n\tconst isReadonlyMode = useReadonly()\n\tconst oneSelected = useUnlockedSelectedShapesCount(1)\n\tif (isReadonlyMode) return null\n\tif (!oneSelected) return null\n\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"reorder\" label=\"context-menu.reorder\" size=\"small\">\n\t\t\t<TldrawUiMenuGroup id=\"reorder\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"bring-to-front\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"bring-forward\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"send-backward\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"send-to-back\" />\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\n/** @public @react */\nexport function MoveToPageMenu() {\n\tconst editor = useEditor()\n\tconst pages = useValue('pages', () => editor.getPages(), [editor])\n\tconst currentPageId = useValue('current page id', () => editor.getCurrentPageId(), [editor])\n\tconst { addToast } = useToasts()\n\tconst trackEvent = useUiEvents()\n\tconst isReadonlyMode = useReadonly()\n\tconst oneSelected = useUnlockedSelectedShapesCount(1)\n\n\tif (!oneSelected) return null\n\tif (isReadonlyMode) return null\n\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"move-to-page\" label=\"context-menu.move-to-page\" size=\"small\">\n\t\t\t<TldrawUiMenuGroup id=\"pages\">\n\t\t\t\t{pages.map((page) => (\n\t\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\t\tid={page.id}\n\t\t\t\t\t\tkey={page.id}\n\t\t\t\t\t\tdisabled={currentPageId === page.id}\n\t\t\t\t\t\tlabel={page.name.length > 30 ? `${page.name.slice(0, 30)}\u2026` : page.name}\n\t\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t\teditor.markHistoryStoppingPoint('move_shapes_to_page')\n\t\t\t\t\t\t\teditor.moveShapesToPage(editor.getSelectedShapeIds(), page.id as TLPageId)\n\n\t\t\t\t\t\t\tconst toPage = editor.getPage(page.id)\n\n\t\t\t\t\t\t\tif (toPage) {\n\t\t\t\t\t\t\t\taddToast({\n\t\t\t\t\t\t\t\t\ttitle: 'Changed page',\n\t\t\t\t\t\t\t\t\tdescription: `Moved to ${toPage.name}.`,\n\t\t\t\t\t\t\t\t\tactions: [\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tlabel: 'Go back',\n\t\t\t\t\t\t\t\t\t\t\ttype: 'primary',\n\t\t\t\t\t\t\t\t\t\t\tonClick: () => {\n\t\t\t\t\t\t\t\t\t\t\t\teditor.markHistoryStoppingPoint('change-page')\n\t\t\t\t\t\t\t\t\t\t\t\teditor.setCurrentPage(currentPageId)\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ttrackEvent('move-to-page', { source: 'context-menu' })\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup id=\"new-page\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"move-to-new-page\" />\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\n/** @public @react */\nexport function ConvertToBookmarkMenuItem() {\n\tconst editor = useEditor()\n\n\tconst oneEmbedSelected = useValue(\n\t\t'oneEmbedSelected',\n\t\t() => {\n\t\t\tconst onlySelectedShape = editor.getOnlySelectedShape()\n\t\t\tif (!onlySelectedShape) return false\n\t\t\treturn !!(\n\t\t\t\teditor.isShapeOfType(onlySelectedShape, 'embed') &&\n\t\t\t\tonlySelectedShape.props.url &&\n\t\t\t\t!editor.isShapeOrAncestorLocked(onlySelectedShape)\n\t\t\t)\n\t\t},\n\t\t[editor]\n\t)\n\n\tif (!oneEmbedSelected) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"convert-to-bookmark\" />\n}\n\n/** @public @react */\nexport function ConvertToEmbedMenuItem() {\n\tconst editor = useEditor()\n\tconst getEmbedDefinition = useGetEmbedDefinition()\n\n\tconst oneEmbeddableBookmarkSelected = useValue(\n\t\t'oneEmbeddableBookmarkSelected',\n\t\t() => {\n\t\t\tconst onlySelectedShape = editor.getOnlySelectedShape()\n\t\t\tif (!onlySelectedShape) return false\n\t\t\treturn !!(\n\t\t\t\teditor.isShapeOfType(onlySelectedShape, 'bookmark') &&\n\t\t\t\tonlySelectedShape.props.url &&\n\t\t\t\tgetEmbedDefinition(onlySelectedShape.props.url) &&\n\t\t\t\t!editor.isShapeOrAncestorLocked(onlySelectedShape)\n\t\t\t)\n\t\t},\n\t\t[editor]\n\t)\n\n\tif (!oneEmbeddableBookmarkSelected) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"convert-to-embed\" />\n}\n\n/* ------------------- Preferences ------------------ */\n\n/** @public @react */\nexport function ToggleSnapModeItem() {\n\tconst editor = useEditor()\n\tconst isSnapMode = useValue('isSnapMode', () => editor.user.getIsSnapMode(), [editor])\n\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"toggle-snap-mode\" checked={isSnapMode} />\n}\n\n/** @public @react */\nexport function ToggleToolLockItem() {\n\tconst editor = useEditor()\n\tconst isToolLock = useValue('isToolLock', () => editor.getInstanceState().isToolLocked, [editor])\n\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"toggle-tool-lock\" checked={isToolLock} />\n}\n\n/** @public @react */\nexport function ToggleGridItem() {\n\tconst editor = useEditor()\n\tconst isGridMode = useValue('isGridMode', () => editor.getInstanceState().isGridMode, [editor])\n\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"toggle-grid\" checked={isGridMode} />\n}\n\n/** @public @react */\nexport function ToggleWrapModeItem() {\n\tconst editor = useEditor()\n\tconst isWrapMode = useValue('isWrapMode', () => editor.user.getIsWrapMode(), [editor])\n\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"toggle-wrap-mode\" checked={isWrapMode} />\n}\n\n/** @public @react */\nexport function ToggleDarkModeItem() {\n\tconst editor = useEditor()\n\tconst isDarkMode = useValue('isDarkMode', () => editor.user.getIsDarkMode(), [editor])\n\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"toggle-dark-mode\" checked={isDarkMode} />\n}\n\n/** @public @react */\nexport function ToggleFocusModeItem() {\n\tconst editor = useEditor()\n\tconst isFocusMode = useValue('isFocusMode', () => editor.getInstanceState().isFocusMode, [editor])\n\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"toggle-focus-mode\" checked={isFocusMode} />\n}\n\n/** @public @react */\nexport function ToggleEdgeScrollingItem() {\n\tconst editor = useEditor()\n\tconst edgeScrollSpeed = useValue('edgeScrollSpeed', () => editor.user.getEdgeScrollSpeed(), [\n\t\teditor,\n\t])\n\n\treturn (\n\t\t<TldrawUiMenuActionCheckboxItem\n\t\t\tactionId=\"toggle-edge-scrolling\"\n\t\t\tchecked={edgeScrollSpeed === 1}\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function ToggleInvertZoomItem() {\n\tconst editor = useEditor()\n\n\tconst isMouseInputMode = useValue(\n\t\t'inputMode',\n\t\t() => editor.user.getUserPreferences().inputMode === 'mouse',\n\t\t[editor]\n\t)\n\n\tconst isZoomDirectionInverted = useValue(\n\t\t'isZoomDirectionInverted',\n\t\t() => editor.user.getIsZoomDirectionInverted(),\n\t\t[editor]\n\t)\n\n\treturn (\n\t\t<TldrawUiMenuActionCheckboxItem\n\t\t\tactionId=\"toggle-invert-zoom\"\n\t\t\tchecked={isZoomDirectionInverted}\n\t\t\tdisabled={!isMouseInputMode}\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function ToggleReduceMotionItem() {\n\tconst editor = useEditor()\n\tconst animationSpeed = useValue('animationSpeed', () => editor.user.getAnimationSpeed(), [editor])\n\n\treturn (\n\t\t<TldrawUiMenuActionCheckboxItem\n\t\t\tactionId=\"toggle-reduce-motion\"\n\t\t\tchecked={animationSpeed === 0}\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function ToggleKeyboardShortcutsItem() {\n\tconst editor = useEditor()\n\tconst keyboardShortcuts = useValue(\n\t\t'keyboardShortcuts',\n\t\t() => editor.user.getAreKeyboardShortcutsEnabled(),\n\t\t[editor]\n\t)\n\n\treturn (\n\t\t<TldrawUiMenuActionCheckboxItem\n\t\t\tactionId=\"toggle-keyboard-shortcuts\"\n\t\t\tchecked={keyboardShortcuts}\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function ToggleEnhancedA11yModeItem() {\n\tconst editor = useEditor()\n\tconst enhancedA11yMode = useValue('enhancedA11yMode', () => editor.user.getEnhancedA11yMode(), [\n\t\teditor,\n\t])\n\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"enhanced-a11y-mode\" checked={enhancedA11yMode} />\n}\n\n/** @public @react */\nexport function ToggleDebugModeItem() {\n\tconst editor = useEditor()\n\tconst isDebugMode = useValue('isDebugMode', () => editor.getInstanceState().isDebugMode, [editor])\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"toggle-debug-mode\" checked={isDebugMode} />\n}\n\n/** @public @react */\nexport function ToggleDynamicSizeModeItem() {\n\tconst editor = useEditor()\n\tconst isDynamicResizeMode = useValue(\n\t\t'dynamic resize',\n\t\t() => editor.user.getIsDynamicResizeMode(),\n\t\t[editor]\n\t)\n\n\treturn (\n\t\t<TldrawUiMenuActionCheckboxItem\n\t\t\tactionId=\"toggle-dynamic-size-mode\"\n\t\t\tchecked={isDynamicResizeMode}\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function TogglePasteAtCursorItem() {\n\tconst editor = useEditor()\n\tconst pasteAtCursor = useValue('paste at cursor', () => editor.user.getIsPasteAtCursorMode(), [\n\t\teditor,\n\t])\n\n\treturn (\n\t\t<TldrawUiMenuActionCheckboxItem actionId=\"toggle-paste-at-cursor\" checked={pasteAtCursor} />\n\t)\n}\n\n/* ---------------------- Print --------------------- */\n\n/** @public @react */\nexport function PrintItem() {\n\tconst hasShapes = useHasShapesOnPage()\n\n\treturn <TldrawUiMenuActionItem actionId=\"print\" disabled={!hasShapes} />\n}\n\n/* ---------------------- Multiplayer --------------------- */\n\n/** @public @react */\nexport function CursorChatItem() {\n\tconst editor = useEditor()\n\tconst shouldShow = useValue(\n\t\t'show cursor chat',\n\t\t() => editor.getCurrentToolId() === 'select' && !editor.getInstanceState().isCoarsePointer,\n\t\t[editor]\n\t)\n\n\tif (!shouldShow) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"open-cursor-chat\" />\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { TLPageId, useEditor, useValue } from '@tldraw/editor'\nimport { supportsDownloadingOriginal } from '../context/actions'\nimport { useUiEvents } from '../context/events'\nimport { useToasts } from '../context/toasts'\nimport {\n\tshowMenuPaste,\n\tuseAllowGroup,\n\tuseAllowUngroup,\n\tuseAnySelectedShapesCount,\n\tuseCanApplySelectionAction,\n\tuseHasLinkShapeSelected,\n\tuseHasShapesOnPage,\n\tuseOnlyFlippableShape,\n\tuseShowAutoSizeToggle,\n\tuseThreeStackableItems,\n\tuseUnlockedSelectedShapesCount,\n} from '../hooks/menu-hooks'\nimport { useGetEmbedDefinition } from '../hooks/useGetEmbedDefinition'\nimport { useReadonly } from '../hooks/useReadonly'\nimport { TldrawUiMenuActionCheckboxItem } from './primitives/menus/TldrawUiMenuActionCheckboxItem'\nimport { TldrawUiMenuActionItem } from './primitives/menus/TldrawUiMenuActionItem'\nimport { TldrawUiMenuGroup } from './primitives/menus/TldrawUiMenuGroup'\nimport { TldrawUiMenuItem } from './primitives/menus/TldrawUiMenuItem'\nimport { TldrawUiMenuSubmenu } from './primitives/menus/TldrawUiMenuSubmenu'\n\n/* -------------------- Selection ------------------- */\n\n/** @public @react */\nexport function ToggleAutoSizeMenuItem() {\n\tconst shouldDisplay = useShowAutoSizeToggle()\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"toggle-auto-size\" />\n}\n\n/** @public @react */\nexport function EditLinkMenuItem() {\n\tconst shouldDisplay = useHasLinkShapeSelected()\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"edit-link\" />\n}\n\n/** @public @react */\nexport function DuplicateMenuItem() {\n\tconst shouldDisplay = useUnlockedSelectedShapesCount(1)\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"duplicate\" />\n}\n\n/** @public @react */\nexport function FlattenMenuItem() {\n\tconst editor = useEditor()\n\tconst shouldDisplay = useValue(\n\t\t'should display flatten option',\n\t\t() => {\n\t\t\tconst selectedShapeIds = editor.getSelectedShapeIds()\n\t\t\tif (selectedShapeIds.length === 0) return false\n\t\t\tconst onlySelectedShape = editor.getOnlySelectedShape()\n\t\t\tif (onlySelectedShape && editor.isShapeOfType(onlySelectedShape, 'image')) {\n\t\t\t\treturn false\n\t\t\t}\n\t\t\treturn true\n\t\t},\n\t\t[editor]\n\t)\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"flatten-to-image\" />\n}\n\n/** @public @react */\nexport function DownloadOriginalMenuItem() {\n\tconst editor = useEditor()\n\tconst shouldDisplay = useValue(\n\t\t'should display download original option',\n\t\t() => {\n\t\t\tconst selectedShapes = editor.getSelectedShapes()\n\t\t\tif (selectedShapes.length === 0) return false\n\t\t\treturn selectedShapes.some((shape) => supportsDownloadingOriginal(shape, editor))\n\t\t},\n\t\t[editor]\n\t)\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"download-original\" />\n}\n\n/** @public @react */\nexport function GroupMenuItem() {\n\tconst shouldDisplay = useAllowGroup()\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"group\" />\n}\n\n/** @public @react */\nexport function UngroupMenuItem() {\n\tconst shouldDisplay = useAllowUngroup()\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"ungroup\" />\n}\n\n/** @public @react */\nexport function FrameSelectionMenuItem() {\n\tconst shouldDisplay = useAllowGroup()\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"frame-selection\" />\n}\n\n/** @public @react */\nexport function RemoveFrameMenuItem() {\n\tconst editor = useEditor()\n\tconst shouldDisplay = useValue(\n\t\t'allow unframe',\n\t\t() => {\n\t\t\tconst selectedShapes = editor.getSelectedShapes()\n\t\t\tif (selectedShapes.length === 0) return false\n\t\t\treturn selectedShapes.every((shape) => editor.isShapeFrameLike(shape))\n\t\t},\n\t\t[editor]\n\t)\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"remove-frame\" />\n}\n\n/** @public @react */\nexport function FitFrameToContentMenuItem() {\n\tconst editor = useEditor()\n\tconst shouldDisplay = useValue(\n\t\t'allow fit frame to content',\n\t\t() => {\n\t\t\tconst onlySelectedShape = editor.getOnlySelectedShape()\n\t\t\tif (!onlySelectedShape) return false\n\t\t\treturn (\n\t\t\t\teditor.isShapeFrameLike(onlySelectedShape) &&\n\t\t\t\teditor.getSortedChildIdsForParent(onlySelectedShape).length > 0\n\t\t\t)\n\t\t},\n\t\t[editor]\n\t)\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"fit-frame-to-content\" />\n}\n\n/** @public @react */\nexport function ToggleLockMenuItem() {\n\tconst shouldDisplay = useAnySelectedShapesCount(1)\n\tif (!shouldDisplay) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"toggle-lock\" />\n}\n\n/** @public @react */\nexport function ToggleTransparentBgMenuItem() {\n\tconst editor = useEditor()\n\tconst isTransparentBg = useValue(\n\t\t'isTransparentBg',\n\t\t() => !editor.getInstanceState().exportBackground,\n\t\t[editor]\n\t)\n\n\treturn (\n\t\t<TldrawUiMenuActionCheckboxItem\n\t\t\tactionId=\"toggle-transparent\"\n\t\t\tchecked={isTransparentBg}\n\t\t\ttoggle\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function UnlockAllMenuItem() {\n\tconst hasShapes = useHasShapesOnPage()\n\n\treturn <TldrawUiMenuActionItem actionId=\"unlock-all\" disabled={!hasShapes} />\n}\n\n/* ---------------------- Zoom ---------------------- */\n\n/** @public @react */\nexport function ZoomTo100MenuItem() {\n\tconst editor = useEditor()\n\tconst isZoomedTo100 = useValue('zoomed to 100', () => editor.getEfficientZoomLevel() === 1, [\n\t\teditor,\n\t])\n\n\treturn <TldrawUiMenuActionItem actionId=\"zoom-to-100\" noClose disabled={isZoomedTo100} />\n}\n\n/** @public @react */\nexport function ZoomToFitMenuItem() {\n\tconst hasShapes = useHasShapesOnPage()\n\n\treturn (\n\t\t<TldrawUiMenuActionItem\n\t\t\tactionId=\"zoom-to-fit\"\n\t\t\tdisabled={!hasShapes}\n\t\t\tdata-testid=\"minimap.zoom-menu.zoom-to-fit\"\n\t\t\tnoClose\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function ZoomToSelectionMenuItem() {\n\tconst canApplySelectionAction = useCanApplySelectionAction()\n\n\treturn (\n\t\t<TldrawUiMenuActionItem\n\t\t\tactionId=\"zoom-to-selection\"\n\t\t\tdisabled={!canApplySelectionAction}\n\t\t\tdata-testid=\"minimap.zoom-menu.zoom-to-selection\"\n\t\t\tnoClose\n\t\t/>\n\t)\n}\n\n/* -------------------- Clipboard ------------------- */\n\n/** @public @react */\nexport function ClipboardMenuGroup() {\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"clipboard\">\n\t\t\t<CutMenuItem />\n\t\t\t<CopyMenuItem />\n\t\t\t<PasteMenuItem />\n\t\t\t<DuplicateMenuItem />\n\t\t\t<DeleteMenuItem />\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n\n/** @public @react */\nexport function CopyAsMenuGroup() {\n\tconst editor = useEditor()\n\tconst atLeastOneShapeOnPage = useHasShapesOnPage()\n\tconst isDebugMode = useValue('isDebugMode', () => editor.getInstanceState().isDebugMode, [editor])\n\n\treturn (\n\t\t<TldrawUiMenuSubmenu\n\t\t\tid=\"copy-as\"\n\t\t\tlabel=\"context-menu.copy-as\"\n\t\t\tsize=\"small\"\n\t\t\tdisabled={!atLeastOneShapeOnPage}\n\t\t>\n\t\t\t<TldrawUiMenuGroup id=\"copy-as-group\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"copy-as-svg\" />\n\t\t\t\t{Boolean(editor.getContainerWindow().navigator.clipboard?.write) && (\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"copy-as-png\" />\n\t\t\t\t)}\n\t\t\t\t{isDebugMode && <TldrawUiMenuActionItem actionId=\"copy-as-json\" />}\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup id=\"copy-as-bg\">\n\t\t\t\t<ToggleTransparentBgMenuItem />\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\n/** @public @react */\nexport function CutMenuItem() {\n\tconst canApplySelectionAction = useCanApplySelectionAction()\n\tconst hasUnlockedShapes = useUnlockedSelectedShapesCount(1)\n\n\treturn (\n\t\t<TldrawUiMenuActionItem\n\t\t\tactionId=\"cut\"\n\t\t\tdisabled={!canApplySelectionAction || !hasUnlockedShapes}\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function CopyMenuItem() {\n\tconst canApplySelectionAction = useCanApplySelectionAction()\n\n\treturn <TldrawUiMenuActionItem actionId=\"copy\" disabled={!canApplySelectionAction} />\n}\n\n/** @public @react */\nexport function PasteMenuItem() {\n\tconst shouldDisplay = showMenuPaste\n\n\treturn <TldrawUiMenuActionItem actionId=\"paste\" disabled={!shouldDisplay} />\n}\n\n/* ------------------- Conversions ------------------ */\n\n/** @public @react */\nexport function ConversionsMenuGroup() {\n\tconst atLeastOneShapeOnPage = useHasShapesOnPage()\n\n\tif (!atLeastOneShapeOnPage) return null\n\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"conversions\">\n\t\t\t<CopyAsMenuGroup />\n\t\t\t<TldrawUiMenuSubmenu id=\"export-as\" label=\"context-menu.export-as\" size=\"small\">\n\t\t\t\t<TldrawUiMenuGroup id=\"export-as-group\">\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"export-as-svg\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"export-as-png\" />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t\t<TldrawUiMenuGroup id=\"export-as-bg\">\n\t\t\t\t\t<ToggleTransparentBgMenuItem />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t</TldrawUiMenuSubmenu>\n\t\t\t<DownloadOriginalMenuItem />\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n\n/* ------------------ Set Selection ----------------- */\n/** @public @react */\nexport function SelectAllMenuItem() {\n\tconst atLeastOneShapeOnPage = useHasShapesOnPage()\n\n\treturn <TldrawUiMenuActionItem actionId=\"select-all\" disabled={!atLeastOneShapeOnPage} />\n}\n\n/* ------------------ Delete Group ------------------ */\n\n/** @public @react */\nexport function DeleteMenuItem() {\n\tconst canApplySelectionAction = useCanApplySelectionAction()\n\tconst hasUnlockedShapes = useUnlockedSelectedShapesCount(1)\n\n\treturn (\n\t\t<TldrawUiMenuActionItem\n\t\t\tactionId=\"delete\"\n\t\t\tdisabled={!canApplySelectionAction || !hasUnlockedShapes}\n\t\t/>\n\t)\n}\n\n/* --------------------- Modify --------------------- */\n\n/** @public @react */\nexport function EditMenuSubmenu() {\n\tconst isReadonlyMode = useReadonly()\n\tif (!useAnySelectedShapesCount(1)) return null\n\tif (isReadonlyMode) return null\n\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"edit\" label=\"context-menu.edit\" size=\"small\">\n\t\t\t<GroupMenuItem />\n\t\t\t<UngroupMenuItem />\n\t\t\t<FlattenMenuItem />\n\t\t\t<FrameSelectionMenuItem />\n\t\t\t<EditLinkMenuItem />\n\t\t\t<FitFrameToContentMenuItem />\n\t\t\t<RemoveFrameMenuItem />\n\t\t\t<ConvertToEmbedMenuItem />\n\t\t\t<ConvertToBookmarkMenuItem />\n\t\t\t<ToggleAutoSizeMenuItem />\n\t\t\t<ToggleLockMenuItem />\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\n/** @public @react */\nexport function ArrangeMenuSubmenu() {\n\tconst twoSelected = useUnlockedSelectedShapesCount(2)\n\tconst onlyFlippableShapeSelected = useOnlyFlippableShape()\n\tconst isReadonlyMode = useReadonly()\n\n\tif (isReadonlyMode) return null\n\tif (!(twoSelected || onlyFlippableShapeSelected)) return null\n\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"arrange\" label=\"context-menu.arrange\" size=\"small\">\n\t\t\t{twoSelected && (\n\t\t\t\t<TldrawUiMenuGroup id=\"align\">\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-left\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-center-horizontal\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-right\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-top\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-center-vertical\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"align-bottom\" />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t)}\n\t\t\t<DistributeMenuGroup />\n\t\t\t{twoSelected && (\n\t\t\t\t<TldrawUiMenuGroup id=\"stretch\">\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"stretch-horizontal\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"stretch-vertical\" />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t)}\n\t\t\t{(twoSelected || onlyFlippableShapeSelected) && (\n\t\t\t\t<TldrawUiMenuGroup id=\"flip\">\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"flip-horizontal\" />\n\t\t\t\t\t<TldrawUiMenuActionItem actionId=\"flip-vertical\" />\n\t\t\t\t</TldrawUiMenuGroup>\n\t\t\t)}\n\t\t\t<OrderMenuGroup />\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\nfunction DistributeMenuGroup() {\n\tconst threeSelected = useUnlockedSelectedShapesCount(3)\n\tif (!threeSelected) return null\n\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"distribute\">\n\t\t\t<TldrawUiMenuActionItem actionId=\"distribute-horizontal\" />\n\t\t\t<TldrawUiMenuActionItem actionId=\"distribute-vertical\" />\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n\nfunction OrderMenuGroup() {\n\tconst twoSelected = useUnlockedSelectedShapesCount(2)\n\tconst threeStackableItems = useThreeStackableItems()\n\tif (!twoSelected) return null\n\n\treturn (\n\t\t<TldrawUiMenuGroup id=\"order\">\n\t\t\t<TldrawUiMenuActionItem actionId=\"pack\" />\n\t\t\t{threeStackableItems && <TldrawUiMenuActionItem actionId=\"stack-horizontal\" />}\n\t\t\t{threeStackableItems && <TldrawUiMenuActionItem actionId=\"stack-vertical\" />}\n\t\t</TldrawUiMenuGroup>\n\t)\n}\n\n/** @public @react */\nexport function ReorderMenuSubmenu() {\n\tconst isReadonlyMode = useReadonly()\n\tconst oneSelected = useUnlockedSelectedShapesCount(1)\n\tif (isReadonlyMode) return null\n\tif (!oneSelected) return null\n\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"reorder\" label=\"context-menu.reorder\" size=\"small\">\n\t\t\t<TldrawUiMenuGroup id=\"reorder\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"bring-to-front\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"bring-forward\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"send-backward\" />\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"send-to-back\" />\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\n/** @public @react */\nexport function MoveToPageMenu() {\n\tconst editor = useEditor()\n\tconst pages = useValue('pages', () => editor.getPages(), [editor])\n\tconst currentPageId = useValue('current page id', () => editor.getCurrentPageId(), [editor])\n\tconst { addToast } = useToasts()\n\tconst trackEvent = useUiEvents()\n\tconst isReadonlyMode = useReadonly()\n\tconst oneSelected = useUnlockedSelectedShapesCount(1)\n\n\tif (!oneSelected) return null\n\tif (isReadonlyMode) return null\n\n\treturn (\n\t\t<TldrawUiMenuSubmenu id=\"move-to-page\" label=\"context-menu.move-to-page\" size=\"small\">\n\t\t\t<TldrawUiMenuGroup id=\"pages\">\n\t\t\t\t{pages.map((page) => (\n\t\t\t\t\t<TldrawUiMenuItem\n\t\t\t\t\t\tid={page.id}\n\t\t\t\t\t\tkey={page.id}\n\t\t\t\t\t\tdisabled={currentPageId === page.id}\n\t\t\t\t\t\tlabel={page.name.length > 30 ? `${page.name.slice(0, 30)}\u2026` : page.name}\n\t\t\t\t\t\tonSelect={() => {\n\t\t\t\t\t\t\teditor.markHistoryStoppingPoint('move_shapes_to_page')\n\t\t\t\t\t\t\teditor.moveShapesToPage(editor.getSelectedShapeIds(), page.id as TLPageId)\n\n\t\t\t\t\t\t\tconst toPage = editor.getPage(page.id)\n\n\t\t\t\t\t\t\tif (toPage) {\n\t\t\t\t\t\t\t\taddToast({\n\t\t\t\t\t\t\t\t\ttitle: 'Changed page',\n\t\t\t\t\t\t\t\t\tdescription: `Moved to ${toPage.name}.`,\n\t\t\t\t\t\t\t\t\tactions: [\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tlabel: 'Go back',\n\t\t\t\t\t\t\t\t\t\t\ttype: 'primary',\n\t\t\t\t\t\t\t\t\t\t\tonClick: () => {\n\t\t\t\t\t\t\t\t\t\t\t\teditor.markHistoryStoppingPoint('change-page')\n\t\t\t\t\t\t\t\t\t\t\t\teditor.setCurrentPage(currentPageId)\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ttrackEvent('move-to-page', { source: 'context-menu' })\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</TldrawUiMenuGroup>\n\t\t\t<TldrawUiMenuGroup id=\"new-page\">\n\t\t\t\t<TldrawUiMenuActionItem actionId=\"move-to-new-page\" />\n\t\t\t</TldrawUiMenuGroup>\n\t\t</TldrawUiMenuSubmenu>\n\t)\n}\n\n/** @public @react */\nexport function ConvertToBookmarkMenuItem() {\n\tconst editor = useEditor()\n\n\tconst oneEmbedSelected = useValue(\n\t\t'oneEmbedSelected',\n\t\t() => {\n\t\t\tconst onlySelectedShape = editor.getOnlySelectedShape()\n\t\t\tif (!onlySelectedShape) return false\n\t\t\treturn !!(\n\t\t\t\teditor.isShapeOfType(onlySelectedShape, 'embed') &&\n\t\t\t\tonlySelectedShape.props.url &&\n\t\t\t\t!editor.isShapeOrAncestorLocked(onlySelectedShape)\n\t\t\t)\n\t\t},\n\t\t[editor]\n\t)\n\n\tif (!oneEmbedSelected) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"convert-to-bookmark\" />\n}\n\n/** @public @react */\nexport function ConvertToEmbedMenuItem() {\n\tconst editor = useEditor()\n\tconst getEmbedDefinition = useGetEmbedDefinition()\n\n\tconst oneEmbeddableBookmarkSelected = useValue(\n\t\t'oneEmbeddableBookmarkSelected',\n\t\t() => {\n\t\t\tconst onlySelectedShape = editor.getOnlySelectedShape()\n\t\t\tif (!onlySelectedShape) return false\n\t\t\treturn !!(\n\t\t\t\teditor.isShapeOfType(onlySelectedShape, 'bookmark') &&\n\t\t\t\tonlySelectedShape.props.url &&\n\t\t\t\tgetEmbedDefinition(onlySelectedShape.props.url) &&\n\t\t\t\t!editor.isShapeOrAncestorLocked(onlySelectedShape)\n\t\t\t)\n\t\t},\n\t\t[editor]\n\t)\n\n\tif (!oneEmbeddableBookmarkSelected) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"convert-to-embed\" />\n}\n\n/* ------------------- Preferences ------------------ */\n\n/** @public @react */\nexport function ToggleSnapModeItem() {\n\tconst editor = useEditor()\n\tconst isSnapMode = useValue('isSnapMode', () => editor.user.getIsSnapMode(), [editor])\n\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"toggle-snap-mode\" checked={isSnapMode} />\n}\n\n/** @public @react */\nexport function ToggleToolLockItem() {\n\tconst editor = useEditor()\n\tconst isToolLock = useValue('isToolLock', () => editor.getInstanceState().isToolLocked, [editor])\n\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"toggle-tool-lock\" checked={isToolLock} />\n}\n\n/** @public @react */\nexport function ToggleGridItem() {\n\tconst editor = useEditor()\n\tconst isGridMode = useValue('isGridMode', () => editor.getInstanceState().isGridMode, [editor])\n\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"toggle-grid\" checked={isGridMode} />\n}\n\n/** @public @react */\nexport function ToggleWrapModeItem() {\n\tconst editor = useEditor()\n\tconst isWrapMode = useValue('isWrapMode', () => editor.user.getIsWrapMode(), [editor])\n\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"toggle-wrap-mode\" checked={isWrapMode} />\n}\n\n/** @public @react */\nexport function ToggleDarkModeItem() {\n\tconst editor = useEditor()\n\tconst isDarkMode = useValue('isDarkMode', () => editor.user.getIsDarkMode(), [editor])\n\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"toggle-dark-mode\" checked={isDarkMode} />\n}\n\n/** @public @react */\nexport function ToggleFocusModeItem() {\n\tconst editor = useEditor()\n\tconst isFocusMode = useValue('isFocusMode', () => editor.getInstanceState().isFocusMode, [editor])\n\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"toggle-focus-mode\" checked={isFocusMode} />\n}\n\n/** @public @react */\nexport function ToggleEdgeScrollingItem() {\n\tconst editor = useEditor()\n\tconst edgeScrollSpeed = useValue('edgeScrollSpeed', () => editor.user.getEdgeScrollSpeed(), [\n\t\teditor,\n\t])\n\n\treturn (\n\t\t<TldrawUiMenuActionCheckboxItem\n\t\t\tactionId=\"toggle-edge-scrolling\"\n\t\t\tchecked={edgeScrollSpeed === 1}\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function ToggleInvertZoomItem() {\n\tconst editor = useEditor()\n\n\tconst isMouseInputMode = useValue(\n\t\t'inputMode',\n\t\t() => editor.user.getUserPreferences().inputMode === 'mouse',\n\t\t[editor]\n\t)\n\n\tconst isZoomDirectionInverted = useValue(\n\t\t'isZoomDirectionInverted',\n\t\t() => editor.user.getIsZoomDirectionInverted(),\n\t\t[editor]\n\t)\n\n\treturn (\n\t\t<TldrawUiMenuActionCheckboxItem\n\t\t\tactionId=\"toggle-invert-zoom\"\n\t\t\tchecked={isZoomDirectionInverted}\n\t\t\tdisabled={!isMouseInputMode}\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function ToggleReduceMotionItem() {\n\tconst editor = useEditor()\n\tconst animationSpeed = useValue('animationSpeed', () => editor.user.getAnimationSpeed(), [editor])\n\n\treturn (\n\t\t<TldrawUiMenuActionCheckboxItem\n\t\t\tactionId=\"toggle-reduce-motion\"\n\t\t\tchecked={animationSpeed === 0}\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function ToggleKeyboardShortcutsItem() {\n\tconst editor = useEditor()\n\tconst keyboardShortcuts = useValue(\n\t\t'keyboardShortcuts',\n\t\t() => editor.user.getAreKeyboardShortcutsEnabled(),\n\t\t[editor]\n\t)\n\n\treturn (\n\t\t<TldrawUiMenuActionCheckboxItem\n\t\t\tactionId=\"toggle-keyboard-shortcuts\"\n\t\t\tchecked={keyboardShortcuts}\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function ToggleEnhancedA11yModeItem() {\n\tconst editor = useEditor()\n\tconst enhancedA11yMode = useValue('enhancedA11yMode', () => editor.user.getEnhancedA11yMode(), [\n\t\teditor,\n\t])\n\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"enhanced-a11y-mode\" checked={enhancedA11yMode} />\n}\n\n/** @public @react */\nexport function ToggleDebugModeItem() {\n\tconst editor = useEditor()\n\tconst isDebugMode = useValue('isDebugMode', () => editor.getInstanceState().isDebugMode, [editor])\n\treturn <TldrawUiMenuActionCheckboxItem actionId=\"toggle-debug-mode\" checked={isDebugMode} />\n}\n\n/** @public @react */\nexport function ToggleDynamicSizeModeItem() {\n\tconst editor = useEditor()\n\tconst isDynamicResizeMode = useValue(\n\t\t'dynamic resize',\n\t\t() => editor.user.getIsDynamicResizeMode(),\n\t\t[editor]\n\t)\n\n\treturn (\n\t\t<TldrawUiMenuActionCheckboxItem\n\t\t\tactionId=\"toggle-dynamic-size-mode\"\n\t\t\tchecked={isDynamicResizeMode}\n\t\t/>\n\t)\n}\n\n/** @public @react */\nexport function TogglePasteAtCursorItem() {\n\tconst editor = useEditor()\n\tconst pasteAtCursor = useValue('paste at cursor', () => editor.user.getIsPasteAtCursorMode(), [\n\t\teditor,\n\t])\n\n\treturn (\n\t\t<TldrawUiMenuActionCheckboxItem actionId=\"toggle-paste-at-cursor\" checked={pasteAtCursor} />\n\t)\n}\n\n/* ---------------------- Print --------------------- */\n\n/** @public @react */\nexport function PrintItem() {\n\tconst hasShapes = useHasShapesOnPage()\n\n\treturn <TldrawUiMenuActionItem actionId=\"print\" disabled={!hasShapes} />\n}\n\n/* ---------------------- Multiplayer --------------------- */\n\n/** @public @react */\nexport function CursorChatItem() {\n\tconst editor = useEditor()\n\tconst shouldShow = useValue(\n\t\t'show cursor chat',\n\t\t() => editor.getCurrentToolId() === 'select' && !editor.getInstanceState().isCoarsePointer,\n\t\t[editor]\n\t)\n\n\tif (!shouldShow) return null\n\n\treturn <TldrawUiMenuActionItem actionId=\"open-cursor-chat\" />\n}\n"],
+  "mappings": "AAgCQ,cAoMN,YApMM;AAhCR,SAAmB,WAAW,gBAAgB;AAC9C,SAAS,mCAAmC;AAC5C,SAAS,mBAAmB;AAC5B,SAAS,iBAAiB;AAC1B;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,6BAA6B;AACtC,SAAS,mBAAmB;AAC5B,SAAS,sCAAsC;AAC/C,SAAS,8BAA8B;AACvC,SAAS,yBAAyB;AAClC,SAAS,wBAAwB;AACjC,SAAS,2BAA2B;AAK7B,SAAS,yBAAyB;AACxC,QAAM,gBAAgB,sBAAsB;AAC5C,MAAI,CAAC,cAAe,QAAO;AAE3B,SAAO,oBAAC,0BAAuB,UAAS,oBAAmB;AAC5D;AAGO,SAAS,mBAAmB;AAClC,QAAM,gBAAgB,wBAAwB;AAC9C,MAAI,CAAC,cAAe,QAAO;AAE3B,SAAO,oBAAC,0BAAuB,UAAS,aAAY;AACrD;AAGO,SAAS,oBAAoB;AACnC,QAAM,gBAAgB,+BAA+B,CAAC;AACtD,MAAI,CAAC,cAAe,QAAO;AAE3B,SAAO,oBAAC,0BAAuB,UAAS,aAAY;AACrD;AAGO,SAAS,kBAAkB;AACjC,QAAM,SAAS,UAAU;AACzB,QAAM,gBAAgB;AAAA,IACrB;AAAA,IACA,MAAM;AACL,YAAM,mBAAmB,OAAO,oBAAoB;AACpD,UAAI,iBAAiB,WAAW,EAAG,QAAO;AAC1C,YAAM,oBAAoB,OAAO,qBAAqB;AACtD,UAAI,qBAAqB,OAAO,cAAc,mBAAmB,OAAO,GAAG;AAC1E,eAAO;AAAA,MACR;AACA,aAAO;AAAA,IACR;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AACA,MAAI,CAAC,cAAe,QAAO;AAE3B,SAAO,oBAAC,0BAAuB,UAAS,oBAAmB;AAC5D;AAGO,SAAS,2BAA2B;AAC1C,QAAM,SAAS,UAAU;AACzB,QAAM,gBAAgB;AAAA,IACrB;AAAA,IACA,MAAM;AACL,YAAM,iBAAiB,OAAO,kBAAkB;AAChD,UAAI,eAAe,WAAW,EAAG,QAAO;AACxC,aAAO,eAAe,KAAK,CAAC,UAAU,4BAA4B,OAAO,MAAM,CAAC;AAAA,IACjF;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AACA,MAAI,CAAC,cAAe,QAAO;AAE3B,SAAO,oBAAC,0BAAuB,UAAS,qBAAoB;AAC7D;AAGO,SAAS,gBAAgB;AAC/B,QAAM,gBAAgB,cAAc;AACpC,MAAI,CAAC,cAAe,QAAO;AAE3B,SAAO,oBAAC,0BAAuB,UAAS,SAAQ;AACjD;AAGO,SAAS,kBAAkB;AACjC,QAAM,gBAAgB,gBAAgB;AACtC,MAAI,CAAC,cAAe,QAAO;AAE3B,SAAO,oBAAC,0BAAuB,UAAS,WAAU;AACnD;AAGO,SAAS,yBAAyB;AACxC,QAAM,gBAAgB,cAAc;AACpC,MAAI,CAAC,cAAe,QAAO;AAE3B,SAAO,oBAAC,0BAAuB,UAAS,mBAAkB;AAC3D;AAGO,SAAS,sBAAsB;AACrC,QAAM,SAAS,UAAU;AACzB,QAAM,gBAAgB;AAAA,IACrB;AAAA,IACA,MAAM;AACL,YAAM,iBAAiB,OAAO,kBAAkB;AAChD,UAAI,eAAe,WAAW,EAAG,QAAO;AACxC,aAAO,eAAe,MAAM,CAAC,UAAU,OAAO,iBAAiB,KAAK,CAAC;AAAA,IACtE;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AACA,MAAI,CAAC,cAAe,QAAO;AAE3B,SAAO,oBAAC,0BAAuB,UAAS,gBAAe;AACxD;AAGO,SAAS,4BAA4B;AAC3C,QAAM,SAAS,UAAU;AACzB,QAAM,gBAAgB;AAAA,IACrB;AAAA,IACA,MAAM;AACL,YAAM,oBAAoB,OAAO,qBAAqB;AACtD,UAAI,CAAC,kBAAmB,QAAO;AAC/B,aACC,OAAO,iBAAiB,iBAAiB,KACzC,OAAO,2BAA2B,iBAAiB,EAAE,SAAS;AAAA,IAEhE;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AACA,MAAI,CAAC,cAAe,QAAO;AAE3B,SAAO,oBAAC,0BAAuB,UAAS,wBAAuB;AAChE;AAGO,SAAS,qBAAqB;AACpC,QAAM,gBAAgB,0BAA0B,CAAC;AACjD,MAAI,CAAC,cAAe,QAAO;AAE3B,SAAO,oBAAC,0BAAuB,UAAS,eAAc;AACvD;AAGO,SAAS,8BAA8B;AAC7C,QAAM,SAAS,UAAU;AACzB,QAAM,kBAAkB;AAAA,IACvB;AAAA,IACA,MAAM,CAAC,OAAO,iBAAiB,EAAE;AAAA,IACjC,CAAC,MAAM;AAAA,EACR;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAS;AAAA,MACT,SAAS;AAAA,MACT,QAAM;AAAA;AAAA,EACP;AAEF;AAGO,SAAS,oBAAoB;AACnC,QAAM,YAAY,mBAAmB;AAErC,SAAO,oBAAC,0BAAuB,UAAS,cAAa,UAAU,CAAC,WAAW;AAC5E;AAKO,SAAS,oBAAoB;AACnC,QAAM,SAAS,UAAU;AACzB,QAAM,gBAAgB,SAAS,iBAAiB,MAAM,OAAO,sBAAsB,MAAM,GAAG;AAAA,IAC3F;AAAA,EACD,CAAC;AAED,SAAO,oBAAC,0BAAuB,UAAS,eAAc,SAAO,MAAC,UAAU,eAAe;AACxF;AAGO,SAAS,oBAAoB;AACnC,QAAM,YAAY,mBAAmB;AAErC,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAS;AAAA,MACT,UAAU,CAAC;AAAA,MACX,eAAY;AAAA,MACZ,SAAO;AAAA;AAAA,EACR;AAEF;AAGO,SAAS,0BAA0B;AACzC,QAAM,0BAA0B,2BAA2B;AAE3D,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAS;AAAA,MACT,UAAU,CAAC;AAAA,MACX,eAAY;AAAA,MACZ,SAAO;AAAA;AAAA,EACR;AAEF;AAKO,SAAS,qBAAqB;AACpC,SACC,qBAAC,qBAAkB,IAAG,aACrB;AAAA,wBAAC,eAAY;AAAA,IACb,oBAAC,gBAAa;AAAA,IACd,oBAAC,iBAAc;AAAA,IACf,oBAAC,qBAAkB;AAAA,IACnB,oBAAC,kBAAe;AAAA,KACjB;AAEF;AAGO,SAAS,kBAAkB;AACjC,QAAM,SAAS,UAAU;AACzB,QAAM,wBAAwB,mBAAmB;AACjD,QAAM,cAAc,SAAS,eAAe,MAAM,OAAO,iBAAiB,EAAE,aAAa,CAAC,MAAM,CAAC;AAEjG,SACC;AAAA,IAAC;AAAA;AAAA,MACA,IAAG;AAAA,MACH,OAAM;AAAA,MACN,MAAK;AAAA,MACL,UAAU,CAAC;AAAA,MAEX;AAAA,6BAAC,qBAAkB,IAAG,iBACrB;AAAA,8BAAC,0BAAuB,UAAS,eAAc;AAAA,UAC9C,QAAQ,OAAO,mBAAmB,EAAE,UAAU,WAAW,KAAK,KAC9D,oBAAC,0BAAuB,UAAS,eAAc;AAAA,UAE/C,eAAe,oBAAC,0BAAuB,UAAS,gBAAe;AAAA,WACjE;AAAA,QACA,oBAAC,qBAAkB,IAAG,cACrB,8BAAC,+BAA4B,GAC9B;AAAA;AAAA;AAAA,EACD;AAEF;AAGO,SAAS,cAAc;AAC7B,QAAM,0BAA0B,2BAA2B;AAC3D,QAAM,oBAAoB,+BAA+B,CAAC;AAE1D,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAS;AAAA,MACT,UAAU,CAAC,2BAA2B,CAAC;AAAA;AAAA,EACxC;AAEF;AAGO,SAAS,eAAe;AAC9B,QAAM,0BAA0B,2BAA2B;AAE3D,SAAO,oBAAC,0BAAuB,UAAS,QAAO,UAAU,CAAC,yBAAyB;AACpF;AAGO,SAAS,gBAAgB;AAC/B,QAAM,gBAAgB;AAEtB,SAAO,oBAAC,0BAAuB,UAAS,SAAQ,UAAU,CAAC,eAAe;AAC3E;AAKO,SAAS,uBAAuB;AACtC,QAAM,wBAAwB,mBAAmB;AAEjD,MAAI,CAAC,sBAAuB,QAAO;AAEnC,SACC,qBAAC,qBAAkB,IAAG,eACrB;AAAA,wBAAC,mBAAgB;AAAA,IACjB,qBAAC,uBAAoB,IAAG,aAAY,OAAM,0BAAyB,MAAK,SACvE;AAAA,2BAAC,qBAAkB,IAAG,mBACrB;AAAA,4BAAC,0BAAuB,UAAS,iBAAgB;AAAA,QACjD,oBAAC,0BAAuB,UAAS,iBAAgB;AAAA,SAClD;AAAA,MACA,oBAAC,qBAAkB,IAAG,gBACrB,8BAAC,+BAA4B,GAC9B;AAAA,OACD;AAAA,IACA,oBAAC,4BAAyB;AAAA,KAC3B;AAEF;AAIO,SAAS,oBAAoB;AACnC,QAAM,wBAAwB,mBAAmB;AAEjD,SAAO,oBAAC,0BAAuB,UAAS,cAAa,UAAU,CAAC,uBAAuB;AACxF;AAKO,SAAS,iBAAiB;AAChC,QAAM,0BAA0B,2BAA2B;AAC3D,QAAM,oBAAoB,+BAA+B,CAAC;AAE1D,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAS;AAAA,MACT,UAAU,CAAC,2BAA2B,CAAC;AAAA;AAAA,EACxC;AAEF;AAKO,SAAS,kBAAkB;AACjC,QAAM,iBAAiB,YAAY;AACnC,MAAI,CAAC,0BAA0B,CAAC,EAAG,QAAO;AAC1C,MAAI,eAAgB,QAAO;AAE3B,SACC,qBAAC,uBAAoB,IAAG,QAAO,OAAM,qBAAoB,MAAK,SAC7D;AAAA,wBAAC,iBAAc;AAAA,IACf,oBAAC,mBAAgB;AAAA,IACjB,oBAAC,mBAAgB;AAAA,IACjB,oBAAC,0BAAuB;AAAA,IACxB,oBAAC,oBAAiB;AAAA,IAClB,oBAAC,6BAA0B;AAAA,IAC3B,oBAAC,uBAAoB;AAAA,IACrB,oBAAC,0BAAuB;AAAA,IACxB,oBAAC,6BAA0B;AAAA,IAC3B,oBAAC,0BAAuB;AAAA,IACxB,oBAAC,sBAAmB;AAAA,KACrB;AAEF;AAGO,SAAS,qBAAqB;AACpC,QAAM,cAAc,+BAA+B,CAAC;AACpD,QAAM,6BAA6B,sBAAsB;AACzD,QAAM,iBAAiB,YAAY;AAEnC,MAAI,eAAgB,QAAO;AAC3B,MAAI,EAAE,eAAe,4BAA6B,QAAO;AAEzD,SACC,qBAAC,uBAAoB,IAAG,WAAU,OAAM,wBAAuB,MAAK,SAClE;AAAA,mBACA,qBAAC,qBAAkB,IAAG,SACrB;AAAA,0BAAC,0BAAuB,UAAS,cAAa;AAAA,MAC9C,oBAAC,0BAAuB,UAAS,2BAA0B;AAAA,MAC3D,oBAAC,0BAAuB,UAAS,eAAc;AAAA,MAC/C,oBAAC,0BAAuB,UAAS,aAAY;AAAA,MAC7C,oBAAC,0BAAuB,UAAS,yBAAwB;AAAA,MACzD,oBAAC,0BAAuB,UAAS,gBAAe;AAAA,OACjD;AAAA,IAED,oBAAC,uBAAoB;AAAA,IACpB,eACA,qBAAC,qBAAkB,IAAG,WACrB;AAAA,0BAAC,0BAAuB,UAAS,sBAAqB;AAAA,MACtD,oBAAC,0BAAuB,UAAS,oBAAmB;AAAA,OACrD;AAAA,KAEC,eAAe,+BAChB,qBAAC,qBAAkB,IAAG,QACrB;AAAA,0BAAC,0BAAuB,UAAS,mBAAkB;AAAA,MACnD,oBAAC,0BAAuB,UAAS,iBAAgB;AAAA,OAClD;AAAA,IAED,oBAAC,kBAAe;AAAA,KACjB;AAEF;AAEA,SAAS,sBAAsB;AAC9B,QAAM,gBAAgB,+BAA+B,CAAC;AACtD,MAAI,CAAC,cAAe,QAAO;AAE3B,SACC,qBAAC,qBAAkB,IAAG,cACrB;AAAA,wBAAC,0BAAuB,UAAS,yBAAwB;AAAA,IACzD,oBAAC,0BAAuB,UAAS,uBAAsB;AAAA,KACxD;AAEF;AAEA,SAAS,iBAAiB;AACzB,QAAM,cAAc,+BAA+B,CAAC;AACpD,QAAM,sBAAsB,uBAAuB;AACnD,MAAI,CAAC,YAAa,QAAO;AAEzB,SACC,qBAAC,qBAAkB,IAAG,SACrB;AAAA,wBAAC,0BAAuB,UAAS,QAAO;AAAA,IACvC,uBAAuB,oBAAC,0BAAuB,UAAS,oBAAmB;AAAA,IAC3E,uBAAuB,oBAAC,0BAAuB,UAAS,kBAAiB;AAAA,KAC3E;AAEF;AAGO,SAAS,qBAAqB;AACpC,QAAM,iBAAiB,YAAY;AACnC,QAAM,cAAc,+BAA+B,CAAC;AACpD,MAAI,eAAgB,QAAO;AAC3B,MAAI,CAAC,YAAa,QAAO;AAEzB,SACC,oBAAC,uBAAoB,IAAG,WAAU,OAAM,wBAAuB,MAAK,SACnE,+BAAC,qBAAkB,IAAG,WACrB;AAAA,wBAAC,0BAAuB,UAAS,kBAAiB;AAAA,IAClD,oBAAC,0BAAuB,UAAS,iBAAgB;AAAA,IACjD,oBAAC,0BAAuB,UAAS,iBAAgB;AAAA,IACjD,oBAAC,0BAAuB,UAAS,gBAAe;AAAA,KACjD,GACD;AAEF;AAGO,SAAS,iBAAiB;AAChC,QAAM,SAAS,UAAU;AACzB,QAAM,QAAQ,SAAS,SAAS,MAAM,OAAO,SAAS,GAAG,CAAC,MAAM,CAAC;AACjE,QAAM,gBAAgB,SAAS,mBAAmB,MAAM,OAAO,iBAAiB,GAAG,CAAC,MAAM,CAAC;AAC3F,QAAM,EAAE,SAAS,IAAI,UAAU;AAC/B,QAAM,aAAa,YAAY;AAC/B,QAAM,iBAAiB,YAAY;AACnC,QAAM,cAAc,+BAA+B,CAAC;AAEpD,MAAI,CAAC,YAAa,QAAO;AACzB,MAAI,eAAgB,QAAO;AAE3B,SACC,qBAAC,uBAAoB,IAAG,gBAAe,OAAM,6BAA4B,MAAK,SAC7E;AAAA,wBAAC,qBAAkB,IAAG,SACpB,gBAAM,IAAI,CAAC,SACX;AAAA,MAAC;AAAA;AAAA,QACA,IAAI,KAAK;AAAA,QAET,UAAU,kBAAkB,KAAK;AAAA,QACjC,OAAO,KAAK,KAAK,SAAS,KAAK,GAAG,KAAK,KAAK,MAAM,GAAG,EAAE,CAAC,WAAM,KAAK;AAAA,QACnE,UAAU,MAAM;AACf,iBAAO,yBAAyB,qBAAqB;AACrD,iBAAO,iBAAiB,OAAO,oBAAoB,GAAG,KAAK,EAAc;AAEzE,gBAAM,SAAS,OAAO,QAAQ,KAAK,EAAE;AAErC,cAAI,QAAQ;AACX,qBAAS;AAAA,cACR,OAAO;AAAA,cACP,aAAa,YAAY,OAAO,IAAI;AAAA,cACpC,SAAS;AAAA,gBACR;AAAA,kBACC,OAAO;AAAA,kBACP,MAAM;AAAA,kBACN,SAAS,MAAM;AACd,2BAAO,yBAAyB,aAAa;AAC7C,2BAAO,eAAe,aAAa;AAAA,kBACpC;AAAA,gBACD;AAAA,cACD;AAAA,YACD,CAAC;AAAA,UACF;AACA,qBAAW,gBAAgB,EAAE,QAAQ,eAAe,CAAC;AAAA,QACtD;AAAA;AAAA,MA1BK,KAAK;AAAA,IA2BX,CACA,GACF;AAAA,IACA,oBAAC,qBAAkB,IAAG,YACrB,8BAAC,0BAAuB,UAAS,oBAAmB,GACrD;AAAA,KACD;AAEF;AAGO,SAAS,4BAA4B;AAC3C,QAAM,SAAS,UAAU;AAEzB,QAAM,mBAAmB;AAAA,IACxB;AAAA,IACA,MAAM;AACL,YAAM,oBAAoB,OAAO,qBAAqB;AACtD,UAAI,CAAC,kBAAmB,QAAO;AAC/B,aAAO,CAAC,EACP,OAAO,cAAc,mBAAmB,OAAO,KAC/C,kBAAkB,MAAM,OACxB,CAAC,OAAO,wBAAwB,iBAAiB;AAAA,IAEnD;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AAEA,MAAI,CAAC,iBAAkB,QAAO;AAE9B,SAAO,oBAAC,0BAAuB,UAAS,uBAAsB;AAC/D;AAGO,SAAS,yBAAyB;AACxC,QAAM,SAAS,UAAU;AACzB,QAAM,qBAAqB,sBAAsB;AAEjD,QAAM,gCAAgC;AAAA,IACrC;AAAA,IACA,MAAM;AACL,YAAM,oBAAoB,OAAO,qBAAqB;AACtD,UAAI,CAAC,kBAAmB,QAAO;AAC/B,aAAO,CAAC,EACP,OAAO,cAAc,mBAAmB,UAAU,KAClD,kBAAkB,MAAM,OACxB,mBAAmB,kBAAkB,MAAM,GAAG,KAC9C,CAAC,OAAO,wBAAwB,iBAAiB;AAAA,IAEnD;AAAA,IACA,CAAC,MAAM;AAAA,EACR;AAEA,MAAI,CAAC,8BAA+B,QAAO;AAE3C,SAAO,oBAAC,0BAAuB,UAAS,oBAAmB;AAC5D;AAKO,SAAS,qBAAqB;AACpC,QAAM,SAAS,UAAU;AACzB,QAAM,aAAa,SAAS,cAAc,MAAM,OAAO,KAAK,cAAc,GAAG,CAAC,MAAM,CAAC;AAErF,SAAO,oBAAC,kCAA+B,UAAS,oBAAmB,SAAS,YAAY;AACzF;AAGO,SAAS,qBAAqB;AACpC,QAAM,SAAS,UAAU;AACzB,QAAM,aAAa,SAAS,cAAc,MAAM,OAAO,iBAAiB,EAAE,cAAc,CAAC,MAAM,CAAC;AAEhG,SAAO,oBAAC,kCAA+B,UAAS,oBAAmB,SAAS,YAAY;AACzF;AAGO,SAAS,iBAAiB;AAChC,QAAM,SAAS,UAAU;AACzB,QAAM,aAAa,SAAS,cAAc,MAAM,OAAO,iBAAiB,EAAE,YAAY,CAAC,MAAM,CAAC;AAE9F,SAAO,oBAAC,kCAA+B,UAAS,eAAc,SAAS,YAAY;AACpF;AAGO,SAAS,qBAAqB;AACpC,QAAM,SAAS,UAAU;AACzB,QAAM,aAAa,SAAS,cAAc,MAAM,OAAO,KAAK,cAAc,GAAG,CAAC,MAAM,CAAC;AAErF,SAAO,oBAAC,kCAA+B,UAAS,oBAAmB,SAAS,YAAY;AACzF;AAGO,SAAS,qBAAqB;AACpC,QAAM,SAAS,UAAU;AACzB,QAAM,aAAa,SAAS,cAAc,MAAM,OAAO,KAAK,cAAc,GAAG,CAAC,MAAM,CAAC;AAErF,SAAO,oBAAC,kCAA+B,UAAS,oBAAmB,SAAS,YAAY;AACzF;AAGO,SAAS,sBAAsB;AACrC,QAAM,SAAS,UAAU;AACzB,QAAM,cAAc,SAAS,eAAe,MAAM,OAAO,iBAAiB,EAAE,aAAa,CAAC,MAAM,CAAC;AAEjG,SAAO,oBAAC,kCAA+B,UAAS,qBAAoB,SAAS,aAAa;AAC3F;AAGO,SAAS,0BAA0B;AACzC,QAAM,SAAS,UAAU;AACzB,QAAM,kBAAkB,SAAS,mBAAmB,MAAM,OAAO,KAAK,mBAAmB,GAAG;AAAA,IAC3F;AAAA,EACD,CAAC;AAED,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAS;AAAA,MACT,SAAS,oBAAoB;AAAA;AAAA,EAC9B;AAEF;AAGO,SAAS,uBAAuB;AACtC,QAAM,SAAS,UAAU;AAEzB,QAAM,mBAAmB;AAAA,IACxB;AAAA,IACA,MAAM,OAAO,KAAK,mBAAmB,EAAE,cAAc;AAAA,IACrD,CAAC,MAAM;AAAA,EACR;AAEA,QAAM,0BAA0B;AAAA,IAC/B;AAAA,IACA,MAAM,OAAO,KAAK,2BAA2B;AAAA,IAC7C,CAAC,MAAM;AAAA,EACR;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAS;AAAA,MACT,SAAS;AAAA,MACT,UAAU,CAAC;AAAA;AAAA,EACZ;AAEF;AAGO,SAAS,yBAAyB;AACxC,QAAM,SAAS,UAAU;AACzB,QAAM,iBAAiB,SAAS,kBAAkB,MAAM,OAAO,KAAK,kBAAkB,GAAG,CAAC,MAAM,CAAC;AAEjG,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAS;AAAA,MACT,SAAS,mBAAmB;AAAA;AAAA,EAC7B;AAEF;AAGO,SAAS,8BAA8B;AAC7C,QAAM,SAAS,UAAU;AACzB,QAAM,oBAAoB;AAAA,IACzB;AAAA,IACA,MAAM,OAAO,KAAK,+BAA+B;AAAA,IACjD,CAAC,MAAM;AAAA,EACR;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAS;AAAA,MACT,SAAS;AAAA;AAAA,EACV;AAEF;AAGO,SAAS,6BAA6B;AAC5C,QAAM,SAAS,UAAU;AACzB,QAAM,mBAAmB,SAAS,oBAAoB,MAAM,OAAO,KAAK,oBAAoB,GAAG;AAAA,IAC9F;AAAA,EACD,CAAC;AAED,SAAO,oBAAC,kCAA+B,UAAS,sBAAqB,SAAS,kBAAkB;AACjG;AAGO,SAAS,sBAAsB;AACrC,QAAM,SAAS,UAAU;AACzB,QAAM,cAAc,SAAS,eAAe,MAAM,OAAO,iBAAiB,EAAE,aAAa,CAAC,MAAM,CAAC;AACjG,SAAO,oBAAC,kCAA+B,UAAS,qBAAoB,SAAS,aAAa;AAC3F;AAGO,SAAS,4BAA4B;AAC3C,QAAM,SAAS,UAAU;AACzB,QAAM,sBAAsB;AAAA,IAC3B;AAAA,IACA,MAAM,OAAO,KAAK,uBAAuB;AAAA,IACzC,CAAC,MAAM;AAAA,EACR;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAS;AAAA,MACT,SAAS;AAAA;AAAA,EACV;AAEF;AAGO,SAAS,0BAA0B;AACzC,QAAM,SAAS,UAAU;AACzB,QAAM,gBAAgB,SAAS,mBAAmB,MAAM,OAAO,KAAK,uBAAuB,GAAG;AAAA,IAC7F;AAAA,EACD,CAAC;AAED,SACC,oBAAC,kCAA+B,UAAS,0BAAyB,SAAS,eAAe;AAE5F;AAKO,SAAS,YAAY;AAC3B,QAAM,YAAY,mBAAmB;AAErC,SAAO,oBAAC,0BAAuB,UAAS,SAAQ,UAAU,CAAC,WAAW;AACvE;AAKO,SAAS,iBAAiB;AAChC,QAAM,SAAS,UAAU;AACzB,QAAM,aAAa;AAAA,IAClB;AAAA,IACA,MAAM,OAAO,iBAAiB,MAAM,YAAY,CAAC,OAAO,iBAAiB,EAAE;AAAA,IAC3E,CAAC,MAAM;AAAA,EACR;AAEA,MAAI,CAAC,WAAY,QAAO;AAExB,SAAO,oBAAC,0BAAuB,UAAS,oBAAmB;AAC5D;",
   "names": []
 }

package/dist-esm/lib/ui/components/primitives/TldrawUiDropdownMenu.mjs CHANGED Viewed

@@ -46,6 +46,7 @@ function TldrawUiDropdownMenuContent({
   align = "start",
   sideOffset = 8,
   alignOffset = 8,
+  collisionPadding = 4,
   children
 }) {
   const container = useContainer();
@@ -57,7 +58,7 @@ function TldrawUiDropdownMenuContent({
       sideOffset,
       align,
       alignOffset,
-      collisionPadding: 4,
+      collisionPadding,
       children
     }
   ) });

package/dist-esm/lib/ui/components/primitives/TldrawUiDropdownMenu.mjs.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/lib/ui/components/primitives/TldrawUiDropdownMenu.tsx"],
-  "sourcesContent": ["import { preventDefault, useContainer } from '@tldraw/editor'\nimport classNames from 'classnames'\nimport { DropdownMenu as _DropdownMenu } from 'radix-ui'\nimport { ReactNode } from 'react'\nimport { useMenuIsOpen } from '../../hooks/useMenuIsOpen'\nimport { useDirection, useTranslation } from '../../hooks/useTranslation/useTranslation'\nimport { TldrawUiButton } from './Button/TldrawUiButton'\nimport { TldrawUiButtonIcon } from './Button/TldrawUiButtonIcon'\nimport { TldrawUiButtonLabel } from './Button/TldrawUiButtonLabel'\nimport { TldrawUiIcon } from './TldrawUiIcon'\n\n/** @public */\nexport interface TLUiDropdownMenuRootProps {\n\tid: string\n\tchildren: ReactNode\n\tmodal?: boolean\n\tdebugOpen?: boolean\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuRoot({\n\tid,\n\tchildren,\n\tmodal = false,\n\tdebugOpen = false,\n}: TLUiDropdownMenuRootProps) {\n\tconst [open, onOpenChange] = useMenuIsOpen(id)\n\tconst dir = useDirection()\n\n\treturn (\n\t\t<_DropdownMenu.Root\n\t\t\topen={debugOpen || open}\n\t\t\tdir={dir}\n\t\t\tmodal={modal}\n\t\t\tonOpenChange={onOpenChange}\n\t\t>\n\t\t\t{children}\n\t\t</_DropdownMenu.Root>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuTriggerProps {\n\tchildren?: ReactNode\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuTrigger({ children, ...rest }: TLUiDropdownMenuTriggerProps) {\n\tconst dir = useDirection()\n\treturn (\n\t\t<_DropdownMenu.Trigger\n\t\t\tdir={dir}\n\t\t\tasChild\n\t\t\t// Firefox fix: Stop the dropdown immediately closing after touch\n\t\t\tonTouchEnd={(e) => preventDefault(e)}\n\t\t\t{...rest}\n\t\t>\n\t\t\t{children}\n\t\t</_DropdownMenu.Trigger>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuContentProps {\n\tid?: string\n\tclassName?: string\n\tside?: 'bottom' | 'top' | 'right' | 'left'\n\talign?: 'start' | 'center' | 'end'\n\tsideOffset?: number\n\talignOffset?: number\n\tchildren: ReactNode\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuContent({\n\tclassName,\n\tside = 'bottom',\n\talign = 'start',\n\tsideOffset = 8,\n\talignOffset = 8,\n\tchildren,\n}: TLUiDropdownMenuContentProps) {\n\tconst container = useContainer()\n\n\treturn (\n\t\t<_DropdownMenu.Portal container={container}>\n\t\t\t<_DropdownMenu.Content\n\t\t\t\tclassName={classNames('tlui-menu', className)}\n\t\t\t\tside={side}\n\t\t\t\tsideOffset={sideOffset}\n\t\t\t\talign={align}\n\t\t\t\talignOffset={alignOffset}\n\t\t\t\tcollisionPadding={4}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</_DropdownMenu.Content>\n\t\t</_DropdownMenu.Portal>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuSubProps {\n\tid: string\n\tchildren: ReactNode\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuSub({ id, children }: TLUiDropdownMenuSubProps) {\n\tconst [open, onOpenChange] = useMenuIsOpen(id)\n\n\treturn (\n\t\t<_DropdownMenu.Sub open={open} onOpenChange={onOpenChange}>\n\t\t\t{children}\n\t\t</_DropdownMenu.Sub>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuSubTriggerProps {\n\tlabel: string\n\tid?: string\n\ttitle?: string\n\tdisabled?: boolean\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuSubTrigger({\n\tid,\n\tlabel,\n\ttitle,\n\tdisabled,\n}: TLUiDropdownMenuSubTriggerProps) {\n\tconst dir = useDirection()\n\treturn (\n\t\t<_DropdownMenu.SubTrigger dir={dir} asChild disabled={disabled}>\n\t\t\t<TldrawUiButton\n\t\t\t\tdata-testid={id}\n\t\t\t\ttype=\"menu\"\n\t\t\t\tclassName=\"tlui-menu__submenu__trigger\"\n\t\t\t\tdisabled={disabled}\n\t\t\t\ttitle={title}\n\t\t\t>\n\t\t\t\t<TldrawUiButtonLabel>{label}</TldrawUiButtonLabel>\n\t\t\t\t<TldrawUiButtonIcon icon={dir === 'rtl' ? 'chevron-left' : 'chevron-right'} small />\n\t\t\t</TldrawUiButton>\n\t\t</_DropdownMenu.SubTrigger>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuSubContentProps {\n\tid?: string\n\talignOffset?: number\n\tsideOffset?: number\n\tsize?: 'tiny' | 'small' | 'medium' | 'wide'\n\tchildren: ReactNode\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuSubContent({\n\tid,\n\talignOffset = -1,\n\tsideOffset = -6,\n\tsize = 'small',\n\tchildren,\n}: TLUiDropdownMenuSubContentProps) {\n\tconst container = useContainer()\n\treturn (\n\t\t<_DropdownMenu.Portal container={container}>\n\t\t\t<_DropdownMenu.SubContent\n\t\t\t\tdata-testid={id}\n\t\t\t\tclassName=\"tlui-menu tlui-menu__submenu__content\"\n\t\t\t\talignOffset={alignOffset}\n\t\t\t\tsideOffset={sideOffset}\n\t\t\t\tcollisionPadding={4}\n\t\t\t\tdata-size={size}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</_DropdownMenu.SubContent>\n\t\t</_DropdownMenu.Portal>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuGroupProps {\n\tchildren: ReactNode\n\tclassName?: string\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuGroup({ className, children }: TLUiDropdownMenuGroupProps) {\n\tconst dir = useDirection()\n\treturn (\n\t\t<div dir={dir} className={classNames('tlui-menu__group', className)}>\n\t\t\t{children}\n\t\t</div>\n\t)\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuIndicator() {\n\tconst msg = useTranslation()\n\tconst dir = useDirection()\n\n\treturn (\n\t\t<_DropdownMenu.ItemIndicator dir={dir} asChild>\n\t\t\t<TldrawUiIcon label={msg('ui.checked')} icon=\"check\" />\n\t\t</_DropdownMenu.ItemIndicator>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuItemProps {\n\tnoClose?: boolean\n\tchildren: ReactNode\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuItem({ noClose, children }: TLUiDropdownMenuItemProps) {\n\tconst dir = useDirection()\n\treturn (\n\t\t<_DropdownMenu.Item dir={dir} asChild onClick={noClose ? preventDefault : undefined}>\n\t\t\t{children}\n\t\t</_DropdownMenu.Item>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuCheckboxItemProps {\n\tchecked?: boolean\n\tonSelect?(e: Event): void\n\tdisabled?: boolean\n\ttitle: string\n\tchildren: ReactNode\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuCheckboxItem({\n\tchildren,\n\tonSelect,\n\t...rest\n}: TLUiDropdownMenuCheckboxItemProps) {\n\tconst msg = useTranslation()\n\tconst dir = useDirection()\n\n\treturn (\n\t\t<_DropdownMenu.CheckboxItem\n\t\t\tdir={dir}\n\t\t\tclassName=\"tlui-button tlui-button__menu tlui-button__checkbox\"\n\t\t\tonSelect={(e) => {\n\t\t\t\tonSelect?.(e)\n\t\t\t\tpreventDefault(e)\n\t\t\t}}\n\t\t\t{...rest}\n\t\t>\n\t\t\t<div className=\"tlui-button__checkbox__indicator\">\n\t\t\t\t<_DropdownMenu.ItemIndicator dir={dir}>\n\t\t\t\t\t<TldrawUiIcon label={msg('ui.checked')} icon=\"check\" small />\n\t\t\t\t</_DropdownMenu.ItemIndicator>\n\t\t\t</div>\n\t\t\t{children}\n\t\t</_DropdownMenu.CheckboxItem>\n\t)\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { preventDefault, useContainer } from '@tldraw/editor'\nimport classNames from 'classnames'\nimport { DropdownMenu as _DropdownMenu } from 'radix-ui'\nimport { ReactNode } from 'react'\nimport { useMenuIsOpen } from '../../hooks/useMenuIsOpen'\nimport { useDirection, useTranslation } from '../../hooks/useTranslation/useTranslation'\nimport { TldrawUiButton } from './Button/TldrawUiButton'\nimport { TldrawUiButtonIcon } from './Button/TldrawUiButtonIcon'\nimport { TldrawUiButtonLabel } from './Button/TldrawUiButtonLabel'\nimport { TldrawUiIcon } from './TldrawUiIcon'\n\n/** @public */\nexport interface TLUiDropdownMenuRootProps {\n\tid: string\n\tchildren: ReactNode\n\tmodal?: boolean\n\tdebugOpen?: boolean\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuRoot({\n\tid,\n\tchildren,\n\tmodal = false,\n\tdebugOpen = false,\n}: TLUiDropdownMenuRootProps) {\n\tconst [open, onOpenChange] = useMenuIsOpen(id)\n\tconst dir = useDirection()\n\n\treturn (\n\t\t<_DropdownMenu.Root\n\t\t\topen={debugOpen || open}\n\t\t\tdir={dir}\n\t\t\tmodal={modal}\n\t\t\tonOpenChange={onOpenChange}\n\t\t>\n\t\t\t{children}\n\t\t</_DropdownMenu.Root>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuTriggerProps {\n\tchildren?: ReactNode\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuTrigger({ children, ...rest }: TLUiDropdownMenuTriggerProps) {\n\tconst dir = useDirection()\n\treturn (\n\t\t<_DropdownMenu.Trigger\n\t\t\tdir={dir}\n\t\t\tasChild\n\t\t\t// Firefox fix: Stop the dropdown immediately closing after touch\n\t\t\tonTouchEnd={(e) => preventDefault(e)}\n\t\t\t{...rest}\n\t\t>\n\t\t\t{children}\n\t\t</_DropdownMenu.Trigger>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuContentProps {\n\tid?: string\n\tclassName?: string\n\tside?: 'bottom' | 'top' | 'right' | 'left'\n\talign?: 'start' | 'center' | 'end'\n\tsideOffset?: number\n\talignOffset?: number\n\tcollisionPadding?: number\n\tchildren: ReactNode\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuContent({\n\tclassName,\n\tside = 'bottom',\n\talign = 'start',\n\tsideOffset = 8,\n\talignOffset = 8,\n\tcollisionPadding = 4,\n\tchildren,\n}: TLUiDropdownMenuContentProps) {\n\tconst container = useContainer()\n\n\treturn (\n\t\t<_DropdownMenu.Portal container={container}>\n\t\t\t<_DropdownMenu.Content\n\t\t\t\tclassName={classNames('tlui-menu', className)}\n\t\t\t\tside={side}\n\t\t\t\tsideOffset={sideOffset}\n\t\t\t\talign={align}\n\t\t\t\talignOffset={alignOffset}\n\t\t\t\tcollisionPadding={collisionPadding}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</_DropdownMenu.Content>\n\t\t</_DropdownMenu.Portal>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuSubProps {\n\tid: string\n\tchildren: ReactNode\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuSub({ id, children }: TLUiDropdownMenuSubProps) {\n\tconst [open, onOpenChange] = useMenuIsOpen(id)\n\n\treturn (\n\t\t<_DropdownMenu.Sub open={open} onOpenChange={onOpenChange}>\n\t\t\t{children}\n\t\t</_DropdownMenu.Sub>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuSubTriggerProps {\n\tlabel: string\n\tid?: string\n\ttitle?: string\n\tdisabled?: boolean\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuSubTrigger({\n\tid,\n\tlabel,\n\ttitle,\n\tdisabled,\n}: TLUiDropdownMenuSubTriggerProps) {\n\tconst dir = useDirection()\n\treturn (\n\t\t<_DropdownMenu.SubTrigger dir={dir} asChild disabled={disabled}>\n\t\t\t<TldrawUiButton\n\t\t\t\tdata-testid={id}\n\t\t\t\ttype=\"menu\"\n\t\t\t\tclassName=\"tlui-menu__submenu__trigger\"\n\t\t\t\tdisabled={disabled}\n\t\t\t\ttitle={title}\n\t\t\t>\n\t\t\t\t<TldrawUiButtonLabel>{label}</TldrawUiButtonLabel>\n\t\t\t\t<TldrawUiButtonIcon icon={dir === 'rtl' ? 'chevron-left' : 'chevron-right'} small />\n\t\t\t</TldrawUiButton>\n\t\t</_DropdownMenu.SubTrigger>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuSubContentProps {\n\tid?: string\n\talignOffset?: number\n\tsideOffset?: number\n\tsize?: 'tiny' | 'small' | 'medium' | 'wide'\n\tchildren: ReactNode\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuSubContent({\n\tid,\n\talignOffset = -1,\n\tsideOffset = -6,\n\tsize = 'small',\n\tchildren,\n}: TLUiDropdownMenuSubContentProps) {\n\tconst container = useContainer()\n\treturn (\n\t\t<_DropdownMenu.Portal container={container}>\n\t\t\t<_DropdownMenu.SubContent\n\t\t\t\tdata-testid={id}\n\t\t\t\tclassName=\"tlui-menu tlui-menu__submenu__content\"\n\t\t\t\talignOffset={alignOffset}\n\t\t\t\tsideOffset={sideOffset}\n\t\t\t\tcollisionPadding={4}\n\t\t\t\tdata-size={size}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</_DropdownMenu.SubContent>\n\t\t</_DropdownMenu.Portal>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuGroupProps {\n\tchildren: ReactNode\n\tclassName?: string\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuGroup({ className, children }: TLUiDropdownMenuGroupProps) {\n\tconst dir = useDirection()\n\treturn (\n\t\t<div dir={dir} className={classNames('tlui-menu__group', className)}>\n\t\t\t{children}\n\t\t</div>\n\t)\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuIndicator() {\n\tconst msg = useTranslation()\n\tconst dir = useDirection()\n\n\treturn (\n\t\t<_DropdownMenu.ItemIndicator dir={dir} asChild>\n\t\t\t<TldrawUiIcon label={msg('ui.checked')} icon=\"check\" />\n\t\t</_DropdownMenu.ItemIndicator>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuItemProps {\n\tnoClose?: boolean\n\tchildren: ReactNode\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuItem({ noClose, children }: TLUiDropdownMenuItemProps) {\n\tconst dir = useDirection()\n\treturn (\n\t\t<_DropdownMenu.Item dir={dir} asChild onClick={noClose ? preventDefault : undefined}>\n\t\t\t{children}\n\t\t</_DropdownMenu.Item>\n\t)\n}\n\n/** @public */\nexport interface TLUiDropdownMenuCheckboxItemProps {\n\tchecked?: boolean\n\tonSelect?(e: Event): void\n\tdisabled?: boolean\n\ttitle: string\n\tchildren: ReactNode\n}\n\n/** @public @react */\nexport function TldrawUiDropdownMenuCheckboxItem({\n\tchildren,\n\tonSelect,\n\t...rest\n}: TLUiDropdownMenuCheckboxItemProps) {\n\tconst msg = useTranslation()\n\tconst dir = useDirection()\n\n\treturn (\n\t\t<_DropdownMenu.CheckboxItem\n\t\t\tdir={dir}\n\t\t\tclassName=\"tlui-button tlui-button__menu tlui-button__checkbox\"\n\t\t\tonSelect={(e) => {\n\t\t\t\tonSelect?.(e)\n\t\t\t\tpreventDefault(e)\n\t\t\t}}\n\t\t\t{...rest}\n\t\t>\n\t\t\t<div className=\"tlui-button__checkbox__indicator\">\n\t\t\t\t<_DropdownMenu.ItemIndicator dir={dir}>\n\t\t\t\t\t<TldrawUiIcon label={msg('ui.checked')} icon=\"check\" small />\n\t\t\t\t</_DropdownMenu.ItemIndicator>\n\t\t\t</div>\n\t\t\t{children}\n\t\t</_DropdownMenu.CheckboxItem>\n\t)\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist-esm/lib/ui/components/primitives/TldrawUiIcon.mjs CHANGED Viewed

@@ -7,6 +7,7 @@ const TldrawUiIcon = memo(function TldrawUiIcon2({
   small,
   invertIcon,
   icon,
+  tiny,
   color,
   className,
   ...props
@@ -17,6 +18,7 @@ const TldrawUiIcon = memo(function TldrawUiIcon2({
       {
         label,
         small,
+        tiny,
         invertIcon,
         icon,
         color,
@@ -27,7 +29,11 @@ const TldrawUiIcon = memo(function TldrawUiIcon2({
   }
   return cloneElement(icon, {
     ...props,
-    className: classNames({ "tlui-icon__small": small }, className, icon.props.className),
+    className: classNames(
+      { "tlui-icon__small": small, "tlui-icon__tiny": tiny },
+      className,
+      icon.props.className
+    ),
     "aria-label": label,
     style: {
       color,
@@ -39,6 +45,7 @@ const TldrawUiIcon = memo(function TldrawUiIcon2({
 function TldrawUIIconInner({
   label,
   small,
+  tiny,
   invertIcon,
   icon,
   color,
@@ -62,7 +69,7 @@ function TldrawUIIconInner({
       {
         className: classNames(
           "tlui-icon tlui-icon__placeholder",
-          { "tlui-icon__small": small },
+          { "tlui-icon__small": small, "tlui-icon__tiny": tiny },
           className
         ),
         ...props
@@ -76,7 +83,11 @@ function TldrawUIIconInner({
       ref,
       "aria-label": label,
       role: "img",
-      className: classNames("tlui-icon", { "tlui-icon__small": small }, className),
+      className: classNames(
+        "tlui-icon",
+        { "tlui-icon__small": small, "tlui-icon__tiny": tiny },
+        className
+      ),
       style: {
         color,
         mask: `url(${asset}) center 100% / 100% no-repeat`,