@tldraw/editor 3.11.0-canary.f529c521e249 → 3.11.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 (93) hide show
  1. package/CHANGELOG.md +93 -2
  2. package/dist-cjs/index.d.ts +23 -9
  3. package/dist-cjs/index.js +1 -1
  4. package/dist-cjs/index.js.map +2 -2
  5. package/dist-cjs/lib/components/default-components/DefaultShapeIndicator.js +4 -4
  6. package/dist-cjs/lib/components/default-components/DefaultShapeIndicator.js.map +2 -2
  7. package/dist-cjs/lib/components/default-components/DefaultShapeIndicators.js +34 -26
  8. package/dist-cjs/lib/components/default-components/DefaultShapeIndicators.js.map +2 -2
  9. package/dist-cjs/lib/config/TLUserPreferences.js +1 -1
  10. package/dist-cjs/lib/config/TLUserPreferences.js.map +1 -1
  11. package/dist-cjs/lib/config/createTLStore.js +2 -1
  12. package/dist-cjs/lib/config/createTLStore.js.map +2 -2
  13. package/dist-cjs/lib/constants.js +1 -1
  14. package/dist-cjs/lib/constants.js.map +2 -2
  15. package/dist-cjs/lib/editor/Editor.js +18 -14
  16. package/dist-cjs/lib/editor/Editor.js.map +2 -2
  17. package/dist-cjs/lib/editor/managers/FocusManager.js +15 -0
  18. package/dist-cjs/lib/editor/managers/FocusManager.js.map +2 -2
  19. package/dist-cjs/lib/editor/managers/UserPreferencesManager.js +1 -1
  20. package/dist-cjs/lib/editor/managers/UserPreferencesManager.js.map +2 -2
  21. package/dist-cjs/lib/exports/StyleEmbedder.js +16 -1
  22. package/dist-cjs/lib/exports/StyleEmbedder.js.map +2 -2
  23. package/dist-cjs/lib/exports/exportToSvg.js.map +1 -1
  24. package/dist-cjs/lib/exports/getSvgJsx.js +1 -1
  25. package/dist-cjs/lib/exports/getSvgJsx.js.map +2 -2
  26. package/dist-cjs/lib/exports/parseCss.js +27 -2
  27. package/dist-cjs/lib/exports/parseCss.js.map +2 -2
  28. package/dist-cjs/lib/hooks/useLocalStore.js +3 -0
  29. package/dist-cjs/lib/hooks/useLocalStore.js.map +2 -2
  30. package/dist-cjs/lib/license/Watermark.js +7 -1
  31. package/dist-cjs/lib/license/Watermark.js.map +2 -2
  32. package/dist-cjs/lib/options.js +2 -1
  33. package/dist-cjs/lib/options.js.map +2 -2
  34. package/dist-cjs/lib/utils/sync/LocalIndexedDb.js +8 -0
  35. package/dist-cjs/lib/utils/sync/LocalIndexedDb.js.map +2 -2
  36. package/dist-cjs/version.js +3 -3
  37. package/dist-cjs/version.js.map +1 -1
  38. package/dist-esm/index.d.mts +23 -9
  39. package/dist-esm/index.mjs +4 -2
  40. package/dist-esm/index.mjs.map +2 -2
  41. package/dist-esm/lib/components/default-components/DefaultShapeIndicator.mjs +4 -4
  42. package/dist-esm/lib/components/default-components/DefaultShapeIndicator.mjs.map +2 -2
  43. package/dist-esm/lib/components/default-components/DefaultShapeIndicators.mjs +34 -26
  44. package/dist-esm/lib/components/default-components/DefaultShapeIndicators.mjs.map +2 -2
  45. package/dist-esm/lib/config/TLUserPreferences.mjs +1 -1
  46. package/dist-esm/lib/config/TLUserPreferences.mjs.map +1 -1
  47. package/dist-esm/lib/config/createTLStore.mjs +2 -1
  48. package/dist-esm/lib/config/createTLStore.mjs.map +2 -2
  49. package/dist-esm/lib/constants.mjs +1 -1
  50. package/dist-esm/lib/constants.mjs.map +2 -2
  51. package/dist-esm/lib/editor/Editor.mjs +18 -14
  52. package/dist-esm/lib/editor/Editor.mjs.map +2 -2
  53. package/dist-esm/lib/editor/managers/FocusManager.mjs +15 -0
  54. package/dist-esm/lib/editor/managers/FocusManager.mjs.map +2 -2
  55. package/dist-esm/lib/editor/managers/UserPreferencesManager.mjs +1 -1
  56. package/dist-esm/lib/editor/managers/UserPreferencesManager.mjs.map +2 -2
  57. package/dist-esm/lib/exports/StyleEmbedder.mjs +22 -2
  58. package/dist-esm/lib/exports/StyleEmbedder.mjs.map +2 -2
  59. package/dist-esm/lib/exports/exportToSvg.mjs.map +1 -1
  60. package/dist-esm/lib/exports/getSvgJsx.mjs +1 -1
  61. package/dist-esm/lib/exports/getSvgJsx.mjs.map +2 -2
  62. package/dist-esm/lib/exports/parseCss.mjs +27 -2
  63. package/dist-esm/lib/exports/parseCss.mjs.map +2 -2
  64. package/dist-esm/lib/hooks/useLocalStore.mjs +3 -0
  65. package/dist-esm/lib/hooks/useLocalStore.mjs.map +2 -2
  66. package/dist-esm/lib/license/Watermark.mjs +7 -1
  67. package/dist-esm/lib/license/Watermark.mjs.map +2 -2
  68. package/dist-esm/lib/options.mjs +2 -1
  69. package/dist-esm/lib/options.mjs.map +2 -2
  70. package/dist-esm/lib/utils/sync/LocalIndexedDb.mjs +8 -0
  71. package/dist-esm/lib/utils/sync/LocalIndexedDb.mjs.map +2 -2
  72. package/dist-esm/version.mjs +3 -3
  73. package/dist-esm/version.mjs.map +1 -1
  74. package/editor.css +11 -1
  75. package/package.json +10 -7
  76. package/src/index.ts +4 -1
  77. package/src/lib/components/default-components/DefaultShapeIndicator.tsx +4 -4
  78. package/src/lib/components/default-components/DefaultShapeIndicators.tsx +52 -31
  79. package/src/lib/config/TLUserPreferences.ts +1 -1
  80. package/src/lib/config/createTLStore.ts +1 -0
  81. package/src/lib/constants.ts +1 -1
  82. package/src/lib/editor/Editor.ts +20 -17
  83. package/src/lib/editor/managers/FocusManager.ts +18 -0
  84. package/src/lib/editor/managers/UserPreferencesManager.ts +1 -1
  85. package/src/lib/exports/StyleEmbedder.ts +23 -4
  86. package/src/lib/exports/exportToSvg.tsx +1 -1
  87. package/src/lib/exports/getSvgJsx.tsx +1 -1
  88. package/src/lib/exports/parseCss.ts +36 -2
  89. package/src/lib/hooks/useLocalStore.ts +3 -0
  90. package/src/lib/license/Watermark.tsx +7 -1
  91. package/src/lib/options.ts +6 -0
  92. package/src/lib/utils/sync/LocalIndexedDb.ts +9 -0
  93. package/src/version.ts +3 -3
@@ -35,7 +35,7 @@ const DEFAULT_CAMERA_OPTIONS = {
35
35
  wheelBehavior: "pan",
36
36
  panSpeed: 1,
37
37
  zoomSpeed: 1,
38
- zoomSteps: [0.1, 0.25, 0.5, 1, 2, 4, 8]
38
+ zoomSteps: [0.05, 0.1, 0.25, 0.5, 1, 2, 4, 8]
39
39
  };
40
40
  const DEFAULT_ANIMATION_OPTIONS = {
41
41
  duration: 0,
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/lib/constants.ts"],
4
- "sourcesContent": ["import { TLCameraOptions } from './editor/types/misc-types'\nimport { EASINGS } from './primitives/easings'\n\n/** @internal */\nexport const DEFAULT_CAMERA_OPTIONS: TLCameraOptions = {\n\tisLocked: false,\n\twheelBehavior: 'pan',\n\tpanSpeed: 1,\n\tzoomSpeed: 1,\n\tzoomSteps: [0.1, 0.25, 0.5, 1, 2, 4, 8],\n}\n\n/** @internal */\nexport const DEFAULT_ANIMATION_OPTIONS = {\n\tduration: 0,\n\teasing: EASINGS.easeInOutCubic,\n}\n\n/**\n * Negative pointer ids are reserved for internal use.\n *\n * @internal */\nexport const INTERNAL_POINTER_IDS = {\n\tCAMERA_MOVE: -10,\n} as const\n\n/** @public */\nexport const SIDES = ['top', 'right', 'bottom', 'left'] as const\n\nexport const LEFT_MOUSE_BUTTON = 0\nexport const RIGHT_MOUSE_BUTTON = 2\nexport const MIDDLE_MOUSE_BUTTON = 1\nexport const STYLUS_ERASER_BUTTON = 5\n\nexport const ZOOM_TO_FIT_PADDING = 128\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,qBAAwB;AAGjB,MAAM,yBAA0C;AAAA,EACtD,UAAU;AAAA,EACV,eAAe;AAAA,EACf,UAAU;AAAA,EACV,WAAW;AAAA,EACX,WAAW,CAAC,KAAK,MAAM,KAAK,GAAG,GAAG,GAAG,CAAC;AACvC;AAGO,MAAM,4BAA4B;AAAA,EACxC,UAAU;AAAA,EACV,QAAQ,uBAAQ;AACjB;AAMO,MAAM,uBAAuB;AAAA,EACnC,aAAa;AACd;AAGO,MAAM,QAAQ,CAAC,OAAO,SAAS,UAAU,MAAM;AAE/C,MAAM,oBAAoB;AAC1B,MAAM,qBAAqB;AAC3B,MAAM,sBAAsB;AAC5B,MAAM,uBAAuB;AAE7B,MAAM,sBAAsB;",
4
+ "sourcesContent": ["import { TLCameraOptions } from './editor/types/misc-types'\nimport { EASINGS } from './primitives/easings'\n\n/** @internal */\nexport const DEFAULT_CAMERA_OPTIONS: TLCameraOptions = {\n\tisLocked: false,\n\twheelBehavior: 'pan',\n\tpanSpeed: 1,\n\tzoomSpeed: 1,\n\tzoomSteps: [0.05, 0.1, 0.25, 0.5, 1, 2, 4, 8],\n}\n\n/** @internal */\nexport const DEFAULT_ANIMATION_OPTIONS = {\n\tduration: 0,\n\teasing: EASINGS.easeInOutCubic,\n}\n\n/**\n * Negative pointer ids are reserved for internal use.\n *\n * @internal */\nexport const INTERNAL_POINTER_IDS = {\n\tCAMERA_MOVE: -10,\n} as const\n\n/** @public */\nexport const SIDES = ['top', 'right', 'bottom', 'left'] as const\n\nexport const LEFT_MOUSE_BUTTON = 0\nexport const RIGHT_MOUSE_BUTTON = 2\nexport const MIDDLE_MOUSE_BUTTON = 1\nexport const STYLUS_ERASER_BUTTON = 5\n\nexport const ZOOM_TO_FIT_PADDING = 128\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,qBAAwB;AAGjB,MAAM,yBAA0C;AAAA,EACtD,UAAU;AAAA,EACV,eAAe;AAAA,EACf,UAAU;AAAA,EACV,WAAW;AAAA,EACX,WAAW,CAAC,MAAM,KAAK,MAAM,KAAK,GAAG,GAAG,GAAG,CAAC;AAC7C;AAGO,MAAM,4BAA4B;AAAA,EACxC,UAAU;AAAA,EACV,QAAQ,uBAAQ;AACjB;AAMO,MAAM,uBAAuB;AAAA,EACnC,aAAa;AACd;AAGO,MAAM,QAAQ,CAAC,OAAO,SAAS,UAAU,MAAM;AAE/C,MAAM,oBAAoB;AAC1B,MAAM,qBAAqB;AAC3B,MAAM,sBAAsB;AAC5B,MAAM,uBAAuB;AAE7B,MAAM,sBAAsB;",
6
6
  "names": []
7
7
  }
@@ -1641,10 +1641,6 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
1641
1641
  * @public
1642
1642
  */
1643
1643
  setRichTextEditor(textEditor) {
1644
- const current = this._currentRichTextEditor.__unsafe__getWithoutCapture();
1645
- if (current !== textEditor) {
1646
- current?.destroy();
1647
- }
1648
1644
  this._currentRichTextEditor.set(textEditor);
1649
1645
  return this;
1650
1646
  }
@@ -3204,7 +3200,13 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
3204
3200
  if (this.getIsReadonly()) return this;
3205
3201
  const ids = typeof assets[0] === "string" ? assets : assets.map((a) => a.id);
3206
3202
  if (ids.length <= 0) return this;
3207
- this.run(() => this.store.remove(ids), { history: "ignore" });
3203
+ this.run(
3204
+ () => {
3205
+ this.store.props.assets.remove?.(ids);
3206
+ this.store.remove(ids);
3207
+ },
3208
+ { history: "ignore" }
3209
+ );
3208
3210
  return this;
3209
3211
  }
3210
3212
  /**
@@ -4770,17 +4772,18 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
4770
4772
  *
4771
4773
  * @example
4772
4774
  * ```ts
4773
- * editor.stackShapes([box1, box2], 'horizontal', 32)
4774
- * editor.stackShapes(editor.getSelectedShapeIds(), 'horizontal', 32)
4775
+ * editor.stackShapes([box1, box2], 'horizontal')
4776
+ * editor.stackShapes(editor.getSelectedShapeIds(), 'horizontal')
4775
4777
  * ```
4776
4778
  *
4777
4779
  * @param shapes - The shapes (or shape ids) to stack.
4778
4780
  * @param operation - Whether to stack horizontally or vertically.
4779
- * @param gap - The gap to leave between shapes.
4781
+ * @param gap - The gap to leave between shapes. By default, uses the editor's `adjacentShapeMargin` option.
4780
4782
  *
4781
4783
  * @public
4782
4784
  */
4783
4785
  stackShapes(shapes, operation, gap) {
4786
+ const _gap = gap ?? this.options.adjacentShapeMargin;
4784
4787
  const ids = typeof shapes[0] === "string" ? shapes : shapes.map((s) => s.id);
4785
4788
  if (this.getIsReadonly()) return this;
4786
4789
  const shapesToStackFirstPass = (0, import_utils.compact)(ids.map((id) => this.getShape(id)));
@@ -4816,7 +4819,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
4816
4819
  allBounds.push(commonPageBounds);
4817
4820
  }
4818
4821
  const len = shapeClustersToStack.length;
4819
- if (gap === 0 && len < 3 || len < 2) return this;
4822
+ if (_gap === 0 && len < 3 || len < 2) return this;
4820
4823
  let val;
4821
4824
  let min;
4822
4825
  let max;
@@ -4833,7 +4836,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
4833
4836
  dim = "height";
4834
4837
  }
4835
4838
  let shapeGap = 0;
4836
- if (gap === 0) {
4839
+ if (_gap === 0) {
4837
4840
  const gaps = {};
4838
4841
  shapeClustersToStack.sort((a, b) => a.pageBounds[min] - b.pageBounds[min]);
4839
4842
  for (let i = 0; i < len - 1; i++) {
@@ -4861,7 +4864,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
4861
4864
  shapeGap /= totalCount;
4862
4865
  }
4863
4866
  } else {
4864
- shapeGap = gap;
4867
+ shapeGap = _gap;
4865
4868
  }
4866
4869
  const changes = [];
4867
4870
  let v = shapeClustersToStack[0].pageBounds[max];
@@ -4889,16 +4892,17 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
4889
4892
  *
4890
4893
  * @example
4891
4894
  * ```ts
4892
- * editor.packShapes([box1, box2], 32)
4895
+ * editor.packShapes([box1, box2])
4893
4896
  * editor.packShapes(editor.getSelectedShapeIds(), 32)
4894
4897
  * ```
4895
4898
  *
4896
4899
  *
4897
4900
  * @param shapes - The shapes (or shape ids) to pack.
4898
- * @param gap - The padding to apply to the packed shapes. Defaults to 16.
4901
+ * @param gap - The padding to apply to the packed shapes. Defaults to the editor's `adjacentShapeMargin` option.
4899
4902
  */
4900
- packShapes(shapes, gap) {
4903
+ packShapes(shapes, _gap) {
4901
4904
  if (this.getIsReadonly()) return this;
4905
+ const gap = _gap ?? this.options.adjacentShapeMargin;
4902
4906
  const ids = typeof shapes[0] === "string" ? shapes : shapes.map((s) => s.id);
4903
4907
  const shapesToPackFirstPass = (0, import_utils.compact)(ids.map((id) => this.getShape(id)));
4904
4908
  const shapeClustersToPack = [];