tldraw 4.4.0-canary.afdcafe834b3 → 4.4.0-canary.b80d167101d1

package/dist-cjs/lib/tools/selection-logic/updateHoveredShapeId.js

@@ -22,14 +22,15 @@ __export(updateHoveredShapeId_exports, {
 });
 module.exports = __toCommonJS(updateHoveredShapeId_exports);
 var import_editor = require("@tldraw/editor");
-function _updateHoveredShapeId(editor) {
+const hoverLockedEditors = /* @__PURE__ */ new WeakMap();
+function getShapeToHover(editor) {
   const hitShape = editor.getShapeAtPoint(editor.inputs.getCurrentPagePoint(), {
     hitInside: false,
     hitLabels: false,
     margin: editor.options.hitTestMargin / editor.getZoomLevel(),
     renderingOnly: true
   });
-  if (!hitShape) return editor.setHoveredShape(null);
+  if (!hitShape) return null;
   let shapeToHover = void 0;
   const outermostShape = editor.getOutermostSelectableShape(hitShape);
   if (outermostShape === hitShape) {
@@ -41,7 +42,29 @@ function _updateHoveredShapeId(editor) {
       shapeToHover = outermostShape;
     }
   }
-  return editor.setHoveredShape(shapeToHover.id);
+  return shapeToHover.id;
+}
+function _updateHoveredShapeId(editor) {
+  const cameraMoving = editor.getCameraState() === "moving";
+  if (!cameraMoving) {
+    hoverLockedEditors.set(editor, false);
+    const nextHoveredId2 = getShapeToHover(editor);
+    return editor.setHoveredShape(nextHoveredId2);
+  }
+  if (hoverLockedEditors.get(editor)) {
+    return;
+  }
+  const currentHoveredId = editor.getHoveredShapeId();
+  if (!currentHoveredId) {
+    hoverLockedEditors.set(editor, true);
+    return;
+  }
+  const nextHoveredId = getShapeToHover(editor);
+  if (nextHoveredId === currentHoveredId) {
+    return;
+  }
+  editor.setHoveredShape(null);
+  hoverLockedEditors.set(editor, true);
 }
 const updateHoveredShapeId = (0, import_editor.throttle)(
   _updateHoveredShapeId,

package/dist-cjs/lib/tools/selection-logic/updateHoveredShapeId.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/lib/tools/selection-logic/updateHoveredShapeId.ts"],
-  "sourcesContent": ["import { Editor, TLShape, throttle } from '@tldraw/editor'\n\nfunction _updateHoveredShapeId(editor: Editor) {\n\t// todo: consider replacing `get hoveredShapeId` with this; it would mean keeping hoveredShapeId in memory rather than in the store and possibly re-computing it more often than necessary\n\tconst hitShape = editor.getShapeAtPoint(editor.inputs.getCurrentPagePoint(), {\n\t\thitInside: false,\n\t\thitLabels: false,\n\t\tmargin: editor.options.hitTestMargin / editor.getZoomLevel(),\n\t\trenderingOnly: true,\n\t})\n\n\tif (!hitShape) return editor.setHoveredShape(null)\n\n\tlet shapeToHover: TLShape | undefined = undefined\n\n\tconst outermostShape = editor.getOutermostSelectableShape(hitShape)\n\n\tif (outermostShape === hitShape) {\n\t\tshapeToHover = hitShape\n\t} else {\n\t\tif (\n\t\t\toutermostShape.id === editor.getFocusedGroupId() ||\n\t\t\teditor.getSelectedShapeIds().includes(outermostShape.id)\n\t\t) {\n\t\t\tshapeToHover = hitShape\n\t\t} else {\n\t\t\tshapeToHover = outermostShape\n\t\t}\n\t}\n\n\treturn editor.setHoveredShape(shapeToHover.id)\n}\n\n/** @internal */\nexport const updateHoveredShapeId = throttle(\n\t_updateHoveredShapeId,\n\tprocess.env.NODE_ENV === 'test' ? 0 : 32\n)\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAA0C;AAE1C,SAAS,sBAAsB,QAAgB;AAE9C,QAAM,WAAW,OAAO,gBAAgB,OAAO,OAAO,oBAAoB,GAAG;AAAA,IAC5E,WAAW;AAAA,IACX,WAAW;AAAA,IACX,QAAQ,OAAO,QAAQ,gBAAgB,OAAO,aAAa;AAAA,IAC3D,eAAe;AAAA,EAChB,CAAC;AAED,MAAI,CAAC,SAAU,QAAO,OAAO,gBAAgB,IAAI;AAEjD,MAAI,eAAoC;AAExC,QAAM,iBAAiB,OAAO,4BAA4B,QAAQ;AAElE,MAAI,mBAAmB,UAAU;AAChC,mBAAe;AAAA,EAChB,OAAO;AACN,QACC,eAAe,OAAO,OAAO,kBAAkB,KAC/C,OAAO,oBAAoB,EAAE,SAAS,eAAe,EAAE,GACtD;AACD,qBAAe;AAAA,IAChB,OAAO;AACN,qBAAe;AAAA,IAChB;AAAA,EACD;AAEA,SAAO,OAAO,gBAAgB,aAAa,EAAE;AAC9C;AAGO,MAAM,2BAAuB;AAAA,EACnC;AAAA,EACA,QAAQ,IAAI,aAAa,SAAS,IAAI;AACvC;",
-  "names": []
+  "sourcesContent": ["import { Editor, TLShape, TLShapeId, throttle } from '@tldraw/editor'\n\n/*\nPerf optimization: Skip hover updates while panning.\n\nHit-testing shapes is expensive in large documents. When panning, we don't need\ncontinuous hover updates - we just need to resume when the camera stops.\n\nThe logic:\n1. Camera idle \u2192 update hover normally, unlock\n2. Camera moving + locked \u2192 skip entirely (no hit-testing)\n3. Camera moving + no current hover \u2192 lock immediately\n4. Camera moving + same shape \u2192 keep current hover (no change needed)\n5. Camera moving + different shape \u2192 clear hover and lock\n\nThis means: when you start panning over a shape, it stays hovered until\nyour cursor moves off it, then hover clears and we stop hit-testing until\nthe camera stops.\n*/\n\n// Track per-editor state for hover updates during camera movement\nconst hoverLockedEditors = new WeakMap<Editor, boolean>()\n\nfunction getShapeToHover(editor: Editor): TLShapeId | null {\n\tconst hitShape = editor.getShapeAtPoint(editor.inputs.getCurrentPagePoint(), {\n\t\thitInside: false,\n\t\thitLabels: false,\n\t\tmargin: editor.options.hitTestMargin / editor.getZoomLevel(),\n\t\trenderingOnly: true,\n\t})\n\n\tif (!hitShape) return null\n\n\tlet shapeToHover: TLShape | undefined = undefined\n\n\tconst outermostShape = editor.getOutermostSelectableShape(hitShape)\n\n\tif (outermostShape === hitShape) {\n\t\tshapeToHover = hitShape\n\t} else {\n\t\tif (\n\t\t\toutermostShape.id === editor.getFocusedGroupId() ||\n\t\t\teditor.getSelectedShapeIds().includes(outermostShape.id)\n\t\t) {\n\t\t\tshapeToHover = hitShape\n\t\t} else {\n\t\t\tshapeToHover = outermostShape\n\t\t}\n\t}\n\n\treturn shapeToHover.id\n}\n\nfunction _updateHoveredShapeId(editor: Editor) {\n\tconst cameraMoving = editor.getCameraState() === 'moving'\n\n\tif (!cameraMoving) {\n\t\thoverLockedEditors.set(editor, false)\n\t\tconst nextHoveredId = getShapeToHover(editor)\n\t\treturn editor.setHoveredShape(nextHoveredId)\n\t}\n\n\tif (hoverLockedEditors.get(editor)) {\n\t\treturn\n\t}\n\n\tconst currentHoveredId = editor.getHoveredShapeId()\n\n\tif (!currentHoveredId) {\n\t\thoverLockedEditors.set(editor, true)\n\t\treturn\n\t}\n\n\tconst nextHoveredId = getShapeToHover(editor)\n\tif (nextHoveredId === currentHoveredId) {\n\t\treturn\n\t}\n\n\teditor.setHoveredShape(null)\n\thoverLockedEditors.set(editor, true)\n}\n\n/** @internal */\nexport const updateHoveredShapeId = throttle(\n\t_updateHoveredShapeId,\n\tprocess.env.NODE_ENV === 'test' ? 0 : 32\n)\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAAqD;AAqBrD,MAAM,qBAAqB,oBAAI,QAAyB;AAExD,SAAS,gBAAgB,QAAkC;AAC1D,QAAM,WAAW,OAAO,gBAAgB,OAAO,OAAO,oBAAoB,GAAG;AAAA,IAC5E,WAAW;AAAA,IACX,WAAW;AAAA,IACX,QAAQ,OAAO,QAAQ,gBAAgB,OAAO,aAAa;AAAA,IAC3D,eAAe;AAAA,EAChB,CAAC;AAED,MAAI,CAAC,SAAU,QAAO;AAEtB,MAAI,eAAoC;AAExC,QAAM,iBAAiB,OAAO,4BAA4B,QAAQ;AAElE,MAAI,mBAAmB,UAAU;AAChC,mBAAe;AAAA,EAChB,OAAO;AACN,QACC,eAAe,OAAO,OAAO,kBAAkB,KAC/C,OAAO,oBAAoB,EAAE,SAAS,eAAe,EAAE,GACtD;AACD,qBAAe;AAAA,IAChB,OAAO;AACN,qBAAe;AAAA,IAChB;AAAA,EACD;AAEA,SAAO,aAAa;AACrB;AAEA,SAAS,sBAAsB,QAAgB;AAC9C,QAAM,eAAe,OAAO,eAAe,MAAM;AAEjD,MAAI,CAAC,cAAc;AAClB,uBAAmB,IAAI,QAAQ,KAAK;AACpC,UAAMA,iBAAgB,gBAAgB,MAAM;AAC5C,WAAO,OAAO,gBAAgBA,cAAa;AAAA,EAC5C;AAEA,MAAI,mBAAmB,IAAI,MAAM,GAAG;AACnC;AAAA,EACD;AAEA,QAAM,mBAAmB,OAAO,kBAAkB;AAElD,MAAI,CAAC,kBAAkB;AACtB,uBAAmB,IAAI,QAAQ,IAAI;AACnC;AAAA,EACD;AAEA,QAAM,gBAAgB,gBAAgB,MAAM;AAC5C,MAAI,kBAAkB,kBAAkB;AACvC;AAAA,EACD;AAEA,SAAO,gBAAgB,IAAI;AAC3B,qBAAmB,IAAI,QAAQ,IAAI;AACpC;AAGO,MAAM,2BAAuB;AAAA,EACnC;AAAA,EACA,QAAQ,IAAI,aAAa,SAAS,IAAI;AACvC;",
+  "names": ["nextHoveredId"]
 }

package/dist-cjs/lib/ui/components/primitives/TldrawUiSelect.js

@@ -0,0 +1,144 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var TldrawUiSelect_exports = {};
+__export(TldrawUiSelect_exports, {
+  TldrawUiSelect: () => TldrawUiSelect,
+  TldrawUiSelectContent: () => TldrawUiSelectContent,
+  TldrawUiSelectItem: () => TldrawUiSelectItem,
+  TldrawUiSelectTrigger: () => TldrawUiSelectTrigger,
+  TldrawUiSelectValue: () => TldrawUiSelectValue
+});
+module.exports = __toCommonJS(TldrawUiSelect_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_editor = require("@tldraw/editor");
+var import_classnames = __toESM(require("classnames"), 1);
+var import_radix_ui = require("radix-ui");
+var React = __toESM(require("react"), 1);
+var import_useMenuIsOpen = require("../../hooks/useMenuIsOpen");
+var import_TldrawUiIcon = require("./TldrawUiIcon");
+function TldrawUiSelect({
+  id,
+  value,
+  onValueChange,
+  onOpenChange,
+  disabled,
+  className,
+  children,
+  "data-testid": dataTestId,
+  "aria-label": ariaLabel
+}) {
+  const [open, handleOpenChange] = (0, import_useMenuIsOpen.useMenuIsOpen)(id, onOpenChange);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_radix_ui.Select.Root,
+    {
+      value,
+      onValueChange,
+      onOpenChange: handleOpenChange,
+      open,
+      disabled,
+      dir: "ltr",
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "div",
+        {
+          id,
+          className: (0, import_classnames.default)("tlui-select", className),
+          "data-testid": dataTestId,
+          "aria-label": ariaLabel,
+          children
+        }
+      )
+    }
+  );
+}
+const TldrawUiSelectTrigger = React.forwardRef(
+  function TldrawUiSelectTrigger2({ children, className }, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      import_radix_ui.Select.Trigger,
+      {
+        ref,
+        className: (0, import_classnames.default)("tlui-button tlui-select__trigger", className),
+        children: [
+          children,
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Select.Icon, { className: "tlui-select__chevron", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiIcon.TldrawUiIcon, { icon: "chevron-down", label: "", small: true }) })
+        ]
+      }
+    );
+  }
+);
+function TldrawUiSelectValue({ placeholder, icon, children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Select.Value, { placeholder, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "tlui-select__value", children: [
+    icon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiIcon.TldrawUiIcon, { icon, label: "", small: true }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "tlui-button__label", children })
+  ] }) });
+}
+function TldrawUiSelectContent({
+  children,
+  side = "bottom",
+  align = "start",
+  className
+}) {
+  const container = (0, import_editor.useContainer)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Select.Portal, { container, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_radix_ui.Select.Content,
+    {
+      className: (0, import_classnames.default)("tlui-menu tlui-select__content", className),
+      position: "popper",
+      side,
+      align,
+      sideOffset: 4,
+      collisionPadding: 4,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Select.Viewport, { className: "tlui-select__viewport", children })
+    }
+  ) });
+}
+function TldrawUiSelectItem({
+  value,
+  label,
+  icon,
+  disabled,
+  className
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    import_radix_ui.Select.Item,
+    {
+      value,
+      disabled,
+      className: (0, import_classnames.default)(
+        "tlui-button tlui-button__menu tlui-button__checkbox tlui-select__item",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiIcon.TldrawUiIcon, { small: true, icon: "check", label: "", className: "tlui-select__item-indicator" }),
+        icon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TldrawUiIcon.TldrawUiIcon, { icon, label: "", small: true }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Select.ItemText, { className: "tlui-button__label", children: label })
+      ]
+    }
+  );
+}
+//# sourceMappingURL=TldrawUiSelect.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/lib/ui/components/primitives/TldrawUiSelect.tsx"],
+  "sourcesContent": ["import { useContainer } from '@tldraw/editor'\nimport classNames from 'classnames'\nimport { Select as _Select } from 'radix-ui'\nimport * as React from 'react'\nimport { useMenuIsOpen } from '../../hooks/useMenuIsOpen'\nimport { TLUiIconType } from '../../icon-types'\nimport { TldrawUiIcon } from './TldrawUiIcon'\n\n/* --------------------- Root --------------------- */\n\n/** @public */\nexport interface TLUiSelectProps {\n\tid: string\n\tvalue: string\n\tonValueChange(value: string): void\n\tonOpenChange?(isOpen: boolean): void\n\tdisabled?: boolean\n\tclassName?: string\n\tchildren: React.ReactNode\n\t'data-testid'?: string\n\t'aria-label'?: string\n}\n\n/**\n * A select dropdown component.\n *\n * @example\n * ```tsx\n * <TldrawUiSelect id=\"my-select\" value={value} onValueChange={setValue}>\n *   <TldrawUiSelectTrigger>\n *     <TldrawUiSelectValue placeholder=\"Select...\" />\n *   </TldrawUiSelectTrigger>\n *   <TldrawUiSelectContent>\n *     <TldrawUiSelectItem value=\"one\" label=\"One\" />\n *     <TldrawUiSelectItem value=\"two\" label=\"Two\" />\n *   </TldrawUiSelectContent>\n * </TldrawUiSelect>\n * ```\n *\n * @public\n * @react\n */\nexport function TldrawUiSelect({\n\tid,\n\tvalue,\n\tonValueChange,\n\tonOpenChange,\n\tdisabled,\n\tclassName,\n\tchildren,\n\t'data-testid': dataTestId,\n\t'aria-label': ariaLabel,\n}: TLUiSelectProps) {\n\tconst [open, handleOpenChange] = useMenuIsOpen(id, onOpenChange)\n\n\treturn (\n\t\t<_Select.Root\n\t\t\tvalue={value}\n\t\t\tonValueChange={onValueChange}\n\t\t\tonOpenChange={handleOpenChange}\n\t\t\topen={open}\n\t\t\tdisabled={disabled}\n\t\t\tdir=\"ltr\"\n\t\t>\n\t\t\t<div\n\t\t\t\tid={id}\n\t\t\t\tclassName={classNames('tlui-select', className)}\n\t\t\t\tdata-testid={dataTestId}\n\t\t\t\taria-label={ariaLabel}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t</_Select.Root>\n\t)\n}\n\n/* --------------------- Trigger --------------------- */\n\n/** @public */\nexport interface TLUiSelectTriggerProps {\n\tchildren: React.ReactNode\n\tclassName?: string\n}\n\n/**\n * The trigger button for the select dropdown.\n *\n * @public\n * @react\n */\nexport const TldrawUiSelectTrigger = React.forwardRef<HTMLButtonElement, TLUiSelectTriggerProps>(\n\tfunction TldrawUiSelectTrigger({ children, className }, ref) {\n\t\treturn (\n\t\t\t<_Select.Trigger\n\t\t\t\tref={ref}\n\t\t\t\tclassName={classNames('tlui-button tlui-select__trigger', className)}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t\t<_Select.Icon className=\"tlui-select__chevron\">\n\t\t\t\t\t<TldrawUiIcon icon=\"chevron-down\" label=\"\" small />\n\t\t\t\t</_Select.Icon>\n\t\t\t</_Select.Trigger>\n\t\t)\n\t}\n)\n\n/* --------------------- Value --------------------- */\n\n/** @public */\nexport interface TLUiSelectValueProps {\n\tplaceholder?: string\n\ticon?: TLUiIconType | Exclude<string, TLUiIconType>\n\tchildren?: React.ReactNode\n}\n\n/**\n * Displays the currently selected value in the trigger.\n *\n * @public\n * @react\n */\nexport function TldrawUiSelectValue({ placeholder, icon, children }: TLUiSelectValueProps) {\n\treturn (\n\t\t<_Select.Value placeholder={placeholder}>\n\t\t\t<span className=\"tlui-select__value\">\n\t\t\t\t{icon && <TldrawUiIcon icon={icon} label=\"\" small />}\n\t\t\t\t<span className=\"tlui-button__label\">{children}</span>\n\t\t\t</span>\n\t\t</_Select.Value>\n\t)\n}\n\n/* --------------------- Content --------------------- */\n\n/** @public */\nexport interface TLUiSelectContentProps {\n\tchildren: React.ReactNode\n\tside?: 'top' | 'bottom'\n\talign?: 'start' | 'center' | 'end'\n\tclassName?: string\n}\n\n/**\n * The dropdown content container for select items.\n *\n * @public\n * @react\n */\nexport function TldrawUiSelectContent({\n\tchildren,\n\tside = 'bottom',\n\talign = 'start',\n\tclassName,\n}: TLUiSelectContentProps) {\n\tconst container = useContainer()\n\n\treturn (\n\t\t<_Select.Portal container={container}>\n\t\t\t<_Select.Content\n\t\t\t\tclassName={classNames('tlui-menu tlui-select__content', className)}\n\t\t\t\tposition=\"popper\"\n\t\t\t\tside={side}\n\t\t\t\talign={align}\n\t\t\t\tsideOffset={4}\n\t\t\t\tcollisionPadding={4}\n\t\t\t>\n\t\t\t\t<_Select.Viewport className=\"tlui-select__viewport\">{children}</_Select.Viewport>\n\t\t\t</_Select.Content>\n\t\t</_Select.Portal>\n\t)\n}\n\n/* --------------------- Item --------------------- */\n\n/** @public */\nexport interface TLUiSelectItemProps {\n\tvalue: string\n\tlabel: string\n\ticon?: TLUiIconType | Exclude<string, TLUiIconType>\n\tdisabled?: boolean\n\tclassName?: string\n}\n\n/**\n * An item in the select dropdown. Styled to match TldrawUiMenuCheckboxItem.\n *\n * @public\n * @react\n */\nexport function TldrawUiSelectItem({\n\tvalue,\n\tlabel,\n\ticon,\n\tdisabled,\n\tclassName,\n}: TLUiSelectItemProps) {\n\treturn (\n\t\t<_Select.Item\n\t\t\tvalue={value}\n\t\t\tdisabled={disabled}\n\t\t\tclassName={classNames(\n\t\t\t\t'tlui-button tlui-button__menu tlui-button__checkbox tlui-select__item',\n\t\t\t\tclassName\n\t\t\t)}\n\t\t>\n\t\t\t<TldrawUiIcon small icon=\"check\" label=\"\" className=\"tlui-select__item-indicator\" />\n\t\t\t{icon && <TldrawUiIcon icon={icon} label=\"\" small />}\n\t\t\t<_Select.ItemText className=\"tlui-button__label\">{label}</_Select.ItemText>\n\t\t</_Select.Item>\n\t)\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgEG;AAhEH,oBAA6B;AAC7B,wBAAuB;AACvB,sBAAkC;AAClC,YAAuB;AACvB,2BAA8B;AAE9B,0BAA6B;AAoCtB,SAAS,eAAe;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,cAAc;AACf,GAAoB;AACnB,QAAM,CAAC,MAAM,gBAAgB,QAAI,oCAAc,IAAI,YAAY;AAE/D,SACC;AAAA,IAAC,gBAAAA,OAAQ;AAAA,IAAR;AAAA,MACA;AAAA,MACA;AAAA,MACA,cAAc;AAAA,MACd;AAAA,MACA;AAAA,MACA,KAAI;AAAA,MAEJ;AAAA,QAAC;AAAA;AAAA,UACA;AAAA,UACA,eAAW,kBAAAC,SAAW,eAAe,SAAS;AAAA,UAC9C,eAAa;AAAA,UACb,cAAY;AAAA,UAEX;AAAA;AAAA,MACF;AAAA;AAAA,EACD;AAEF;AAgBO,MAAM,wBAAwB,MAAM;AAAA,EAC1C,SAASC,uBAAsB,EAAE,UAAU,UAAU,GAAG,KAAK;AAC5D,WACC;AAAA,MAAC,gBAAAF,OAAQ;AAAA,MAAR;AAAA,QACA;AAAA,QACA,eAAW,kBAAAC,SAAW,oCAAoC,SAAS;AAAA,QAElE;AAAA;AAAA,UACD,4CAAC,gBAAAD,OAAQ,MAAR,EAAa,WAAU,wBACvB,sDAAC,oCAAa,MAAK,gBAAe,OAAM,IAAG,OAAK,MAAC,GAClD;AAAA;AAAA;AAAA,IACD;AAAA,EAEF;AACD;AAiBO,SAAS,oBAAoB,EAAE,aAAa,MAAM,SAAS,GAAyB;AAC1F,SACC,4CAAC,gBAAAA,OAAQ,OAAR,EAAc,aACd,uDAAC,UAAK,WAAU,sBACd;AAAA,YAAQ,4CAAC,oCAAa,MAAY,OAAM,IAAG,OAAK,MAAC;AAAA,IAClD,4CAAC,UAAK,WAAU,sBAAsB,UAAS;AAAA,KAChD,GACD;AAEF;AAkBO,SAAS,sBAAsB;AAAA,EACrC;AAAA,EACA,OAAO;AAAA,EACP,QAAQ;AAAA,EACR;AACD,GAA2B;AAC1B,QAAM,gBAAY,4BAAa;AAE/B,SACC,4CAAC,gBAAAA,OAAQ,QAAR,EAAe,WACf;AAAA,IAAC,gBAAAA,OAAQ;AAAA,IAAR;AAAA,MACA,eAAW,kBAAAC,SAAW,kCAAkC,SAAS;AAAA,MACjE,UAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA,YAAY;AAAA,MACZ,kBAAkB;AAAA,MAElB,sDAAC,gBAAAD,OAAQ,UAAR,EAAiB,WAAU,yBAAyB,UAAS;AAAA;AAAA,EAC/D,GACD;AAEF;AAmBO,SAAS,mBAAmB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAwB;AACvB,SACC;AAAA,IAAC,gBAAAA,OAAQ;AAAA,IAAR;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAW,kBAAAC;AAAA,QACV;AAAA,QACA;AAAA,MACD;AAAA,MAEA;AAAA,oDAAC,oCAAa,OAAK,MAAC,MAAK,SAAQ,OAAM,IAAG,WAAU,+BAA8B;AAAA,QACjF,QAAQ,4CAAC,oCAAa,MAAY,OAAM,IAAG,OAAK,MAAC;AAAA,QAClD,4CAAC,gBAAAD,OAAQ,UAAR,EAAiB,WAAU,sBAAsB,iBAAM;AAAA;AAAA;AAAA,EACzD;AAEF;",
+  "names": ["_Select", "classNames", "TldrawUiSelectTrigger"]
+}

package/dist-cjs/lib/ui/context/actions.js

@@ -1335,6 +1335,7 @@ function ActionsProvider({ overrides, children }) {
         label: "action.toggle-lock",
         kbd: "shift+l",
         onSelect(source) {
+          if (!canApplySelectionAction()) return;
           editor.markHistoryStoppingPoint("locking");
           trackEvent("toggle-lock", { source });
           editor.toggleLock(editor.getSelectedShapeIds());
@@ -1516,6 +1517,7 @@ function ActionsProvider({ overrides, children }) {
         label: "a11y.enlarge-shape",
         kbd: "cmd+alt+shift+=,ctrl+alt+shift+=",
         onSelect: async (source) => {
+          if (!canApplySelectionAction()) return;
           scaleShapes(1.1);
           trackEvent("enlarge-shapes", { source });
         }
@@ -1525,6 +1527,7 @@ function ActionsProvider({ overrides, children }) {
         label: "a11y.shrink-shape",
         kbd: "cmd+alt+shift+-,ctrl+alt+shift+-",
         onSelect: async (source) => {
+          if (!canApplySelectionAction()) return;
           scaleShapes(1 / 1.1);
           trackEvent("shrink-shapes", { source });
         }