@tldraw/editor 4.5.0-canary.c15b2dbb18f2 → 4.5.0-canary.c4df25aea136

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 (38) hide show
  1. package/dist-cjs/index.d.ts +16 -2
  2. package/dist-cjs/index.js +1 -1
  3. package/dist-cjs/lib/editor/Editor.js +35 -15
  4. package/dist-cjs/lib/editor/Editor.js.map +2 -2
  5. package/dist-cjs/lib/editor/tools/BaseBoxShapeTool/children/Pointing.js +2 -3
  6. package/dist-cjs/lib/editor/tools/BaseBoxShapeTool/children/Pointing.js.map +2 -2
  7. package/dist-cjs/lib/editor/types/misc-types.js.map +1 -1
  8. package/dist-cjs/lib/exports/exportToSvg.js +1 -1
  9. package/dist-cjs/lib/exports/exportToSvg.js.map +2 -2
  10. package/dist-cjs/lib/exports/getSvgAsImage.js +180 -29
  11. package/dist-cjs/lib/exports/getSvgAsImage.js.map +3 -3
  12. package/dist-cjs/lib/exports/getSvgJsx.js +18 -7
  13. package/dist-cjs/lib/exports/getSvgJsx.js.map +2 -2
  14. package/dist-cjs/version.js +3 -3
  15. package/dist-cjs/version.js.map +1 -1
  16. package/dist-esm/index.d.mts +16 -2
  17. package/dist-esm/index.mjs +1 -1
  18. package/dist-esm/lib/editor/Editor.mjs +36 -16
  19. package/dist-esm/lib/editor/Editor.mjs.map +2 -2
  20. package/dist-esm/lib/editor/tools/BaseBoxShapeTool/children/Pointing.mjs +2 -3
  21. package/dist-esm/lib/editor/tools/BaseBoxShapeTool/children/Pointing.mjs.map +2 -2
  22. package/dist-esm/lib/exports/exportToSvg.mjs +1 -1
  23. package/dist-esm/lib/exports/exportToSvg.mjs.map +2 -2
  24. package/dist-esm/lib/exports/getSvgAsImage.mjs +180 -29
  25. package/dist-esm/lib/exports/getSvgAsImage.mjs.map +3 -3
  26. package/dist-esm/lib/exports/getSvgJsx.mjs +18 -7
  27. package/dist-esm/lib/exports/getSvgJsx.mjs.map +2 -2
  28. package/dist-esm/version.mjs +3 -3
  29. package/dist-esm/version.mjs.map +1 -1
  30. package/package.json +7 -7
  31. package/src/lib/editor/Editor.ts +37 -12
  32. package/src/lib/editor/tools/BaseBoxShapeTool/children/Pointing.ts +3 -3
  33. package/src/lib/editor/types/misc-types.ts +8 -2
  34. package/src/lib/exports/exportToSvg.tsx +1 -1
  35. package/src/lib/exports/getSvgAsImage.ts +290 -31
  36. package/src/lib/exports/getSvgJsx.test.ts +103 -101
  37. package/src/lib/exports/getSvgJsx.tsx +30 -8
  38. package/src/version.ts +3 -3
@@ -1903,6 +1903,12 @@ export declare class Editor extends EventEmitter<TLEventMap> {
1903
1903
  * @public
1904
1904
  */
1905
1905
  getZoomLevel(): number;
1906
+ /**
1907
+ * Get the scale factor used when creating or resizing shapes in dynamic size mode.
1908
+ *
1909
+ * @public
1910
+ */
1911
+ getResizeScaleFactor(): number;
1906
1912
  private _debouncedZoomLevel;
1907
1913
  /**
1908
1914
  * Get the debounced zoom level. When the camera is moving, this returns the zoom level
@@ -3785,6 +3791,7 @@ export declare class Editor extends EventEmitter<TLEventMap> {
3785
3791
  getSvgElement(shapes: TLShape[] | TLShapeId[], opts?: TLSvgExportOptions): Promise<{
3786
3792
  height: number;
3787
3793
  svg: SVGSVGElement;
3794
+ trimPadding: number;
3788
3795
  width: number;
3789
3796
  } | undefined>;
3790
3797
  /**
@@ -3800,6 +3807,7 @@ export declare class Editor extends EventEmitter<TLEventMap> {
3800
3807
  getSvgString(shapes: TLShape[] | TLShapeId[], opts?: TLSvgExportOptions): Promise<{
3801
3808
  height: number;
3802
3809
  svg: string;
3810
+ trimPadding: number;
3803
3811
  width: number;
3804
3812
  } | undefined>;
3805
3813
  /**
@@ -8269,9 +8277,15 @@ export declare interface TLSvgExportOptions {
8269
8277
  */
8270
8278
  background?: boolean;
8271
8279
  /**
8272
- * How much padding to include around the bounds of exports? Defaults to 32px.
8280
+ * How much padding to include around the bounds of exports.
8281
+ *
8282
+ * - `'auto'` (default) — trim to visual content bounds, capturing overflow (like thick
8283
+ * strokes or arrowheads) without extra whitespace.
8284
+ * - `number` (e.g. `32`) — fixed padding in px. No trimming; overflow beyond the padding
8285
+ * region is clipped.
8286
+ * - `0` — no padding, no trimming, overflow is clipped.
8273
8287
  */
8274
- padding?: number;
8288
+ padding?: 'auto' | number;
8275
8289
  /**
8276
8290
  * Should the export be rendered in dark mode (true) or light mode (false)? Defaults to the
8277
8291
  * current instance's dark mode setting.
package/dist-cjs/index.js CHANGED
@@ -370,7 +370,7 @@ var import_LocalIndexedDb = require("./lib/utils/sync/LocalIndexedDb");
370
370
  var import_uniq = require("./lib/utils/uniq");
371
371
  (0, import_utils.registerTldrawLibraryVersion)(
372
372
  "@tldraw/editor",
373
- "4.5.0-canary.c15b2dbb18f2",
373
+ "4.5.0-canary.c4df25aea136",
374
374
  "cjs"
375
375
  );
376
376
  //# sourceMappingURL=index.js.map
@@ -124,8 +124,8 @@ var import_TextManager = require("./managers/TextManager/TextManager");
124
124
  var import_TickManager = require("./managers/TickManager/TickManager");
125
125
  var import_UserPreferencesManager = require("./managers/UserPreferencesManager/UserPreferencesManager");
126
126
  var import_RootState = require("./tools/RootState");
127
- var __setMetaKeyTimeout_dec, __setCtrlKeyTimeout_dec, __setAltKeyTimeout_dec, __setShiftKeyTimeout_dec, _getIsReadonly_dec, _getIsFocused_dec, _getSharedOpacity_dec, _getSharedStyles_dec, __getSelectionSharedStyles_dec, __getBindingsIndexCache_dec, _getCurrentPageRenderingShapesSorted_dec, _getCurrentPageShapesSorted_dec, _getCurrentPageShapes_dec, _getCurrentPageBounds_dec, _getCulledShapes_dec, _getNotVisibleShapes_dec, __getShapeMaskedPageBoundsCache_dec, __getShapeMaskCache_dec, __getShapeClipPathCache_dec, __getShapePageBoundsCache_dec, __getShapePageTransformCache_dec, __getShapeHandlesCache_dec, __getAllAssetsQuery_dec, _getCurrentPageShapeIdsSorted_dec, _getCurrentPageId_dec, _getPages_dec, __getAllPagesQuery_dec, _getRenderingShapes_dec, _getCollaboratorsOnCurrentPage_dec, _getCollaborators_dec, __getCollaboratorsQuery_dec, _getViewportPageBounds_dec, _getViewportScreenCenter_dec, _getViewportScreenBounds_dec, _getEfficientZoomLevel_dec, __getAboveDebouncedZoomThreshold_dec, _getDebouncedZoomLevel_dec, _getZoomLevel_dec, _getCameraForFollowing_dec, _getViewportPageBoundsForFollowing_dec, _getCamera_dec, __unsafe_getCameraId_dec, _getErasingShapes_dec, _getErasingShapeIds_dec, _getHintingShape_dec, _getHintingShapeIds_dec, _getHoveredShape_dec, _getHoveredShapeId_dec, _getRichTextEditor_dec, _getEditingShape_dec, _getEditingShapeId_dec, _getFocusedGroup_dec, _getFocusedGroupId_dec, _getSelectionRotatedScreenBounds_dec, _getSelectionRotatedPageBounds_dec, _getSelectionRotation_dec, _getSelectionPageBounds_dec, _getOnlySelectedShape_dec, _getOnlySelectedShapeId_dec, _getCurrentPageShapesInReadingOrder_dec, _getSelectedShapes_dec, _getSelectedShapeIds_dec, __getCurrentPageStateId_dec, _getCurrentPageState_dec, __getPageStatesQuery_dec, _getPageStates_dec, _getInstanceState_dec, _getDocumentSettings_dec, _getCurrentToolId_dec, _getCurrentTool_dec, _getPath_dec, _canRedo_dec, _canUndo_dec, _getIsShapeHiddenCache_dec, _a, _init;
128
- class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_dec = [import_state.computed], _canUndo_dec = [import_state.computed], _canRedo_dec = [import_state.computed], _getPath_dec = [import_state.computed], _getCurrentTool_dec = [import_state.computed], _getCurrentToolId_dec = [import_state.computed], _getDocumentSettings_dec = [import_state.computed], _getInstanceState_dec = [import_state.computed], _getPageStates_dec = [import_state.computed], __getPageStatesQuery_dec = [import_state.computed], _getCurrentPageState_dec = [import_state.computed], __getCurrentPageStateId_dec = [import_state.computed], _getSelectedShapeIds_dec = [import_state.computed], _getSelectedShapes_dec = [import_state.computed], _getCurrentPageShapesInReadingOrder_dec = [import_state.computed], _getOnlySelectedShapeId_dec = [import_state.computed], _getOnlySelectedShape_dec = [import_state.computed], _getSelectionPageBounds_dec = [import_state.computed], _getSelectionRotation_dec = [import_state.computed], _getSelectionRotatedPageBounds_dec = [import_state.computed], _getSelectionRotatedScreenBounds_dec = [import_state.computed], _getFocusedGroupId_dec = [import_state.computed], _getFocusedGroup_dec = [import_state.computed], _getEditingShapeId_dec = [import_state.computed], _getEditingShape_dec = [import_state.computed], _getRichTextEditor_dec = [import_state.computed], _getHoveredShapeId_dec = [import_state.computed], _getHoveredShape_dec = [import_state.computed], _getHintingShapeIds_dec = [import_state.computed], _getHintingShape_dec = [import_state.computed], _getErasingShapeIds_dec = [import_state.computed], _getErasingShapes_dec = [import_state.computed], __unsafe_getCameraId_dec = [import_state.computed], _getCamera_dec = [import_state.computed], _getViewportPageBoundsForFollowing_dec = [import_state.computed], _getCameraForFollowing_dec = [import_state.computed], _getZoomLevel_dec = [import_state.computed], _getDebouncedZoomLevel_dec = [import_state.computed], __getAboveDebouncedZoomThreshold_dec = [import_state.computed], _getEfficientZoomLevel_dec = [import_state.computed], _getViewportScreenBounds_dec = [import_state.computed], _getViewportScreenCenter_dec = [import_state.computed], _getViewportPageBounds_dec = [import_state.computed], __getCollaboratorsQuery_dec = [import_state.computed], _getCollaborators_dec = [import_state.computed], _getCollaboratorsOnCurrentPage_dec = [import_state.computed], _getRenderingShapes_dec = [import_state.computed], __getAllPagesQuery_dec = [import_state.computed], _getPages_dec = [import_state.computed], _getCurrentPageId_dec = [import_state.computed], _getCurrentPageShapeIdsSorted_dec = [import_state.computed], __getAllAssetsQuery_dec = [import_state.computed], __getShapeHandlesCache_dec = [import_state.computed], __getShapePageTransformCache_dec = [import_state.computed], __getShapePageBoundsCache_dec = [import_state.computed], __getShapeClipPathCache_dec = [import_state.computed], __getShapeMaskCache_dec = [import_state.computed], __getShapeMaskedPageBoundsCache_dec = [import_state.computed], _getNotVisibleShapes_dec = [import_state.computed], _getCulledShapes_dec = [import_state.computed], _getCurrentPageBounds_dec = [import_state.computed], _getCurrentPageShapes_dec = [import_state.computed], _getCurrentPageShapesSorted_dec = [import_state.computed], _getCurrentPageRenderingShapesSorted_dec = [import_state.computed], __getBindingsIndexCache_dec = [import_state.computed], __getSelectionSharedStyles_dec = [import_state.computed], _getSharedStyles_dec = [(0, import_state.computed)({ isEqual: (a, b) => a.equals(b) })], _getSharedOpacity_dec = [import_state.computed], _getIsFocused_dec = [import_state.computed], _getIsReadonly_dec = [import_state.computed], __setShiftKeyTimeout_dec = [import_utils.bind], __setAltKeyTimeout_dec = [import_utils.bind], __setCtrlKeyTimeout_dec = [import_utils.bind], __setMetaKeyTimeout_dec = [import_utils.bind], _a) {
127
+ var __setMetaKeyTimeout_dec, __setCtrlKeyTimeout_dec, __setAltKeyTimeout_dec, __setShiftKeyTimeout_dec, _getIsReadonly_dec, _getIsFocused_dec, _getSharedOpacity_dec, _getSharedStyles_dec, __getSelectionSharedStyles_dec, __getBindingsIndexCache_dec, _getCurrentPageRenderingShapesSorted_dec, _getCurrentPageShapesSorted_dec, _getCurrentPageShapes_dec, _getCurrentPageBounds_dec, _getCulledShapes_dec, _getNotVisibleShapes_dec, __getShapeMaskedPageBoundsCache_dec, __getShapeMaskCache_dec, __getShapeClipPathCache_dec, __getShapePageBoundsCache_dec, __getShapePageTransformCache_dec, __getShapeHandlesCache_dec, __getAllAssetsQuery_dec, _getCurrentPageShapeIdsSorted_dec, _getCurrentPageId_dec, _getPages_dec, __getAllPagesQuery_dec, _getRenderingShapes_dec, _getCollaboratorsOnCurrentPage_dec, _getCollaborators_dec, __getCollaboratorsQuery_dec, _getViewportPageBounds_dec, _getViewportScreenCenter_dec, _getViewportScreenBounds_dec, _getEfficientZoomLevel_dec, __getAboveDebouncedZoomThreshold_dec, _getDebouncedZoomLevel_dec, _getResizeScaleFactor_dec, _getZoomLevel_dec, _getCameraForFollowing_dec, _getViewportPageBoundsForFollowing_dec, _getCamera_dec, __unsafe_getCameraId_dec, _getErasingShapes_dec, _getErasingShapeIds_dec, _getHintingShape_dec, _getHintingShapeIds_dec, _getHoveredShape_dec, _getHoveredShapeId_dec, _getRichTextEditor_dec, _getEditingShape_dec, _getEditingShapeId_dec, _getFocusedGroup_dec, _getFocusedGroupId_dec, _getSelectionRotatedScreenBounds_dec, _getSelectionRotatedPageBounds_dec, _getSelectionRotation_dec, _getSelectionPageBounds_dec, _getOnlySelectedShape_dec, _getOnlySelectedShapeId_dec, _getCurrentPageShapesInReadingOrder_dec, _getSelectedShapes_dec, _getSelectedShapeIds_dec, __getCurrentPageStateId_dec, _getCurrentPageState_dec, __getPageStatesQuery_dec, _getPageStates_dec, _getInstanceState_dec, _getDocumentSettings_dec, _getCurrentToolId_dec, _getCurrentTool_dec, _getPath_dec, _canRedo_dec, _canUndo_dec, _getIsShapeHiddenCache_dec, _a, _init;
128
+ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_dec = [import_state.computed], _canUndo_dec = [import_state.computed], _canRedo_dec = [import_state.computed], _getPath_dec = [import_state.computed], _getCurrentTool_dec = [import_state.computed], _getCurrentToolId_dec = [import_state.computed], _getDocumentSettings_dec = [import_state.computed], _getInstanceState_dec = [import_state.computed], _getPageStates_dec = [import_state.computed], __getPageStatesQuery_dec = [import_state.computed], _getCurrentPageState_dec = [import_state.computed], __getCurrentPageStateId_dec = [import_state.computed], _getSelectedShapeIds_dec = [import_state.computed], _getSelectedShapes_dec = [import_state.computed], _getCurrentPageShapesInReadingOrder_dec = [import_state.computed], _getOnlySelectedShapeId_dec = [import_state.computed], _getOnlySelectedShape_dec = [import_state.computed], _getSelectionPageBounds_dec = [import_state.computed], _getSelectionRotation_dec = [import_state.computed], _getSelectionRotatedPageBounds_dec = [import_state.computed], _getSelectionRotatedScreenBounds_dec = [import_state.computed], _getFocusedGroupId_dec = [import_state.computed], _getFocusedGroup_dec = [import_state.computed], _getEditingShapeId_dec = [import_state.computed], _getEditingShape_dec = [import_state.computed], _getRichTextEditor_dec = [import_state.computed], _getHoveredShapeId_dec = [import_state.computed], _getHoveredShape_dec = [import_state.computed], _getHintingShapeIds_dec = [import_state.computed], _getHintingShape_dec = [import_state.computed], _getErasingShapeIds_dec = [import_state.computed], _getErasingShapes_dec = [import_state.computed], __unsafe_getCameraId_dec = [import_state.computed], _getCamera_dec = [import_state.computed], _getViewportPageBoundsForFollowing_dec = [import_state.computed], _getCameraForFollowing_dec = [import_state.computed], _getZoomLevel_dec = [import_state.computed], _getResizeScaleFactor_dec = [import_state.computed], _getDebouncedZoomLevel_dec = [import_state.computed], __getAboveDebouncedZoomThreshold_dec = [import_state.computed], _getEfficientZoomLevel_dec = [import_state.computed], _getViewportScreenBounds_dec = [import_state.computed], _getViewportScreenCenter_dec = [import_state.computed], _getViewportPageBounds_dec = [import_state.computed], __getCollaboratorsQuery_dec = [import_state.computed], _getCollaborators_dec = [import_state.computed], _getCollaboratorsOnCurrentPage_dec = [import_state.computed], _getRenderingShapes_dec = [import_state.computed], __getAllPagesQuery_dec = [import_state.computed], _getPages_dec = [import_state.computed], _getCurrentPageId_dec = [import_state.computed], _getCurrentPageShapeIdsSorted_dec = [import_state.computed], __getAllAssetsQuery_dec = [import_state.computed], __getShapeHandlesCache_dec = [import_state.computed], __getShapePageTransformCache_dec = [import_state.computed], __getShapePageBoundsCache_dec = [import_state.computed], __getShapeClipPathCache_dec = [import_state.computed], __getShapeMaskCache_dec = [import_state.computed], __getShapeMaskedPageBoundsCache_dec = [import_state.computed], _getNotVisibleShapes_dec = [import_state.computed], _getCulledShapes_dec = [import_state.computed], _getCurrentPageBounds_dec = [import_state.computed], _getCurrentPageShapes_dec = [import_state.computed], _getCurrentPageShapesSorted_dec = [import_state.computed], _getCurrentPageRenderingShapesSorted_dec = [import_state.computed], __getBindingsIndexCache_dec = [import_state.computed], __getSelectionSharedStyles_dec = [import_state.computed], _getSharedStyles_dec = [(0, import_state.computed)({ isEqual: (a, b) => a.equals(b) })], _getSharedOpacity_dec = [import_state.computed], _getIsFocused_dec = [import_state.computed], _getIsReadonly_dec = [import_state.computed], __setShiftKeyTimeout_dec = [import_utils.bind], __setAltKeyTimeout_dec = [import_utils.bind], __setCtrlKeyTimeout_dec = [import_utils.bind], __setMetaKeyTimeout_dec = [import_utils.bind], _a) {
129
129
  constructor({
130
130
  store,
131
131
  user,
@@ -2048,6 +2048,9 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
2048
2048
  getZoomLevel() {
2049
2049
  return this.getCamera().z;
2050
2050
  }
2051
+ getResizeScaleFactor() {
2052
+ return this.user.getIsDynamicResizeMode() ? 1 / this.getZoomLevel() : 1;
2053
+ }
2051
2054
  getDebouncedZoomLevel() {
2052
2055
  if (this.options.debouncedZoom) {
2053
2056
  if (this.getCameraState() === "idle") {
@@ -6911,7 +6914,8 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
6911
6914
  return {
6912
6915
  svg: serializer.serializeToString(result.svg),
6913
6916
  width: result.width,
6914
- height: result.height
6917
+ height: result.height,
6918
+ trimPadding: result.trimPadding
6915
6919
  };
6916
6920
  }
6917
6921
  /**
@@ -6933,30 +6937,45 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
6933
6937
  const result = await this.getSvgString(shapes, withDefaults);
6934
6938
  if (!result) throw new Error("Could not create SVG");
6935
6939
  switch (withDefaults.format) {
6936
- case "svg":
6940
+ case "svg": {
6941
+ let svg = result.svg;
6942
+ let w = result.width;
6943
+ let h = result.height;
6944
+ if (result.trimPadding > 0) {
6945
+ const trimmed = await (0, import_getSvgAsImage.trimSvgToContent)(svg, {
6946
+ width: w,
6947
+ height: h,
6948
+ trimPadding: result.trimPadding,
6949
+ scale: withDefaults.scale
6950
+ });
6951
+ if (trimmed) {
6952
+ svg = trimmed.svg;
6953
+ w = trimmed.width;
6954
+ h = trimmed.height;
6955
+ }
6956
+ }
6937
6957
  return {
6938
- blob: new Blob([result.svg], { type: "image/svg+xml" }),
6939
- width: result.width,
6940
- height: result.height
6958
+ blob: new Blob([svg], { type: "image/svg+xml" }),
6959
+ width: w,
6960
+ height: h
6941
6961
  };
6962
+ }
6942
6963
  case "jpeg":
6943
6964
  case "png":
6944
6965
  case "webp": {
6945
- const blob = await (0, import_getSvgAsImage.getSvgAsImage)(result.svg, {
6966
+ const imageResult = await (0, import_getSvgAsImage.getSvgAsImageWithOptions)(result.svg, {
6946
6967
  type: withDefaults.format,
6947
6968
  quality: withDefaults.quality,
6948
6969
  pixelRatio: withDefaults.pixelRatio,
6949
6970
  width: result.width,
6950
- height: result.height
6971
+ height: result.height,
6972
+ trimPadding: result.trimPadding,
6973
+ scale: withDefaults.scale
6951
6974
  });
6952
- if (!blob) {
6975
+ if (!imageResult) {
6953
6976
  throw new Error("Could not construct image.");
6954
6977
  }
6955
- return {
6956
- blob,
6957
- width: result.width,
6958
- height: result.height
6959
- };
6978
+ return imageResult;
6960
6979
  }
6961
6980
  default: {
6962
6981
  (0, import_utils.exhaustiveSwitchError)(withDefaults.format);
@@ -7918,6 +7937,7 @@ __decorateElement(_init, 1, "getCamera", _getCamera_dec, Editor);
7918
7937
  __decorateElement(_init, 1, "getViewportPageBoundsForFollowing", _getViewportPageBoundsForFollowing_dec, Editor);
7919
7938
  __decorateElement(_init, 1, "getCameraForFollowing", _getCameraForFollowing_dec, Editor);
7920
7939
  __decorateElement(_init, 1, "getZoomLevel", _getZoomLevel_dec, Editor);
7940
+ __decorateElement(_init, 1, "getResizeScaleFactor", _getResizeScaleFactor_dec, Editor);
7921
7941
  __decorateElement(_init, 1, "getDebouncedZoomLevel", _getDebouncedZoomLevel_dec, Editor);
7922
7942
  __decorateElement(_init, 1, "_getAboveDebouncedZoomThreshold", __getAboveDebouncedZoomThreshold_dec, Editor);
7923
7943
  __decorateElement(_init, 1, "getEfficientZoomLevel", _getEfficientZoomLevel_dec, Editor);