@tldraw/editor 3.8.0-canary.9dece73524ae → 3.8.0-canary.a046fbcebad9

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 (56) hide show
  1. package/dist-cjs/index.d.ts +108 -12
  2. package/dist-cjs/index.js +5 -1
  3. package/dist-cjs/index.js.map +2 -2
  4. package/dist-cjs/lib/components/default-components/DefaultCanvas.js +1 -4
  5. package/dist-cjs/lib/components/default-components/DefaultCanvas.js.map +2 -2
  6. package/dist-cjs/lib/config/createTLStore.js +3 -1
  7. package/dist-cjs/lib/config/createTLStore.js.map +2 -2
  8. package/dist-cjs/lib/editor/Editor.js +58 -5
  9. package/dist-cjs/lib/editor/Editor.js.map +2 -2
  10. package/dist-cjs/lib/editor/types/SvgExportContext.js.map +2 -2
  11. package/dist-cjs/lib/editor/types/misc-types.js.map +1 -1
  12. package/dist-cjs/lib/exports/exportToSvg.js.map +2 -2
  13. package/dist-cjs/lib/exports/getSvgAsImage.js +83 -0
  14. package/dist-cjs/lib/exports/getSvgAsImage.js.map +7 -0
  15. package/dist-cjs/lib/exports/getSvgJsx.js +16 -3
  16. package/dist-cjs/lib/exports/getSvgJsx.js.map +2 -2
  17. package/dist-cjs/lib/hooks/useLocalStore.js +1 -1
  18. package/dist-cjs/lib/hooks/useLocalStore.js.map +2 -2
  19. package/dist-cjs/lib/utils/browserCanvasMaxSize.js +75 -0
  20. package/dist-cjs/lib/utils/browserCanvasMaxSize.js.map +7 -0
  21. package/dist-cjs/version.js +3 -3
  22. package/dist-cjs/version.js.map +1 -1
  23. package/dist-esm/index.d.mts +108 -12
  24. package/dist-esm/index.mjs +5 -1
  25. package/dist-esm/index.mjs.map +2 -2
  26. package/dist-esm/lib/components/default-components/DefaultCanvas.mjs +1 -4
  27. package/dist-esm/lib/components/default-components/DefaultCanvas.mjs.map +2 -2
  28. package/dist-esm/lib/config/createTLStore.mjs +3 -1
  29. package/dist-esm/lib/config/createTLStore.mjs.map +2 -2
  30. package/dist-esm/lib/editor/Editor.mjs +58 -5
  31. package/dist-esm/lib/editor/Editor.mjs.map +2 -2
  32. package/dist-esm/lib/editor/types/SvgExportContext.mjs.map +2 -2
  33. package/dist-esm/lib/exports/exportToSvg.mjs.map +2 -2
  34. package/dist-esm/lib/exports/getSvgAsImage.mjs +63 -0
  35. package/dist-esm/lib/exports/getSvgAsImage.mjs.map +7 -0
  36. package/dist-esm/lib/exports/getSvgJsx.mjs +16 -3
  37. package/dist-esm/lib/exports/getSvgJsx.mjs.map +2 -2
  38. package/dist-esm/lib/hooks/useLocalStore.mjs +1 -1
  39. package/dist-esm/lib/hooks/useLocalStore.mjs.map +2 -2
  40. package/dist-esm/lib/utils/browserCanvasMaxSize.mjs +45 -0
  41. package/dist-esm/lib/utils/browserCanvasMaxSize.mjs.map +7 -0
  42. package/dist-esm/version.mjs +3 -3
  43. package/dist-esm/version.mjs.map +1 -1
  44. package/package.json +9 -7
  45. package/src/index.ts +4 -0
  46. package/src/lib/components/default-components/DefaultCanvas.tsx +1 -4
  47. package/src/lib/config/createTLStore.ts +3 -1
  48. package/src/lib/editor/Editor.ts +75 -12
  49. package/src/lib/editor/types/SvgExportContext.tsx +21 -0
  50. package/src/lib/editor/types/misc-types.ts +55 -2
  51. package/src/lib/exports/exportToSvg.tsx +2 -2
  52. package/src/lib/exports/getSvgAsImage.ts +92 -0
  53. package/src/lib/exports/getSvgJsx.tsx +17 -2
  54. package/src/lib/hooks/useLocalStore.ts +1 -1
  55. package/src/lib/utils/browserCanvasMaxSize.ts +65 -0
  56. package/src/version.ts +3 -3
@@ -87,6 +87,7 @@ var import_defaultBindings = require("../config/defaultBindings");
87
87
  var import_defaultShapes = require("../config/defaultShapes");
88
88
  var import_constants = require("../constants");
89
89
  var import_exportToSvg = require("../exports/exportToSvg");
90
+ var import_getSvgAsImage = require("../exports/getSvgAsImage");
90
91
  var import_environment = require("../globals/environment");
91
92
  var import_menus = require("../globals/menus");
92
93
  var import_time = require("../globals/time");
@@ -1214,7 +1215,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
1214
1215
  if (partial.isChangingStyle === true) {
1215
1216
  this._isChangingStyleTimeout = this.timers.setTimeout(() => {
1216
1217
  this._updateInstanceState({ isChangingStyle: false }, { history: "ignore" });
1217
- }, 2e3);
1218
+ }, 1e3);
1218
1219
  }
1219
1220
  }
1220
1221
  return this;
@@ -3165,11 +3166,14 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
3165
3166
  if (!assetId) return null;
3166
3167
  const asset = this.getAsset(assetId);
3167
3168
  if (!asset) return null;
3168
- const { screenScale = 1, shouldResolveToOriginal = false } = context;
3169
+ const {
3170
+ screenScale = 1,
3171
+ shouldResolveToOriginal = false,
3172
+ dpr = this.getInstanceState().devicePixelRatio
3173
+ } = context;
3169
3174
  const zoomStepFunction = (zoom) => Math.pow(2, Math.ceil(Math.log2(zoom)));
3170
- const steppedScreenScale = Math.max(0.125, zoomStepFunction(screenScale));
3175
+ const steppedScreenScale = zoomStepFunction(screenScale);
3171
3176
  const networkEffectiveType = "connection" in navigator ? navigator.connection.effectiveType : null;
3172
- const dpr = this.getInstanceState().devicePixelRatio;
3173
3177
  return await this.store.props.assets.resolve(asset, {
3174
3178
  screenScale: screenScale || 1,
3175
3179
  steppedScreenScale,
@@ -6287,7 +6291,7 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
6287
6291
  * @public
6288
6292
  */
6289
6293
  async getSvgElement(shapes, opts = {}) {
6290
- const ids = typeof shapes[0] === "string" ? shapes : shapes.map((s) => s.id);
6294
+ const ids = shapes.length === 0 ? this.getCurrentPageShapeIdsSorted() : typeof shapes[0] === "string" ? shapes : shapes.map((s) => s.id);
6291
6295
  if (ids.length === 0) return void 0;
6292
6296
  return (0, import_exportToSvg.exportToSvg)(this, ids, opts);
6293
6297
  }
@@ -6317,6 +6321,55 @@ class Editor extends (_a = import_eventemitter3.default, _getIsShapeHiddenCache_
6317
6321
  if (!result) return void 0;
6318
6322
  return result.svg;
6319
6323
  }
6324
+ /**
6325
+ * Get an exported image of the given shapes.
6326
+ *
6327
+ * @param shapes - The shapes (or shape ids) to export.
6328
+ * @param opts - Options for the export.
6329
+ *
6330
+ * @returns A blob of the image.
6331
+ * @public
6332
+ */
6333
+ async toImage(shapes, opts = {}) {
6334
+ const withDefaults = {
6335
+ format: "png",
6336
+ scale: 1,
6337
+ pixelRatio: opts.format === "svg" ? void 0 : 2,
6338
+ ...opts
6339
+ };
6340
+ const result = await this.getSvgString(shapes, withDefaults);
6341
+ if (!result) throw new Error("Could not create SVG");
6342
+ switch (withDefaults.format) {
6343
+ case "svg":
6344
+ return {
6345
+ blob: new Blob([result.svg], { type: "text/plain" }),
6346
+ width: result.width,
6347
+ height: result.height
6348
+ };
6349
+ case "jpeg":
6350
+ case "png":
6351
+ case "webp": {
6352
+ const blob = await (0, import_getSvgAsImage.getSvgAsImage)(result.svg, {
6353
+ type: withDefaults.format,
6354
+ quality: withDefaults.quality,
6355
+ pixelRatio: withDefaults.pixelRatio,
6356
+ width: result.width,
6357
+ height: result.height
6358
+ });
6359
+ if (!blob) {
6360
+ throw new Error("Could not construct image.");
6361
+ }
6362
+ return {
6363
+ blob,
6364
+ width: result.width,
6365
+ height: result.height
6366
+ };
6367
+ }
6368
+ default: {
6369
+ (0, import_utils.exhaustiveSwitchError)(withDefaults.format);
6370
+ }
6371
+ }
6372
+ }
6320
6373
  /**
6321
6374
  * Update the input points from a pointer, pinch, or wheel event.
6322
6375
  *