Update App.tsx

feat: Added reddit links as embeddable (#8099 )
feat: #8063 Added reddit links as embeddable Co-authored-by: Aakansha Doshi <aakansha1216@gmail.com>
2024-09-28 13:05:40 +02:00 · 2024-09-28 11:49:18 +05:30 · 2024-09-24 21:09:15 +05:30 · 2024-09-24 17:30:21 +02:00 · 2024-09-24 12:01:28 +00:00 · 2024-09-19 15:46:36 +02:00
56 changed files with 836 additions and 573 deletions
@@ -2720,21 +2720,21 @@ binary-extensions@^2.0.0:
  resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.2.0.tgz#75f502eeaf9ffde42fc98829645be4ea76bd9e2d"
  integrity sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==

-body-parser@1.20.3:
-  version "1.20.3"
-  resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.20.3.tgz#1953431221c6fb5cd63c4b36d53fab0928e548c6"
-  integrity sha512-7rAxByjUMqQ3/bHJy7D6OGXvx/MMc4IqBn/X0fcM1QUcAItpZrBEYhWGem+tzXH90c+G01ypMcYJBO9Y30203g==
+body-parser@1.20.0:
+  version "1.20.0"
+  resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.20.0.tgz#3de69bd89011c11573d7bfee6a64f11b6bd27cc5"
+  integrity sha512-DfJ+q6EPcGKZD1QWUjSpqp+Q7bDQTsQIF4zfUAtZ6qk+H/3/QRhg9CEp39ss+/T2vw0+HaidC0ecJj/DRLIaKg==
  dependencies:
    bytes "3.1.2"
-    content-type "~1.0.5"
+    content-type "~1.0.4"
    debug "2.6.9"
    depd "2.0.0"
    destroy "1.2.0"
    http-errors "2.0.0"
    iconv-lite "0.4.24"
    on-finished "2.4.1"
-    qs "6.13.0"
-    raw-body "2.5.2"
+    qs "6.10.3"
+    raw-body "2.5.1"
    type-is "~1.6.18"
    unpipe "1.0.0"

@@ -2861,17 +2861,6 @@ call-bind@^1.0.0:
    function-bind "^1.1.1"
    get-intrinsic "^1.0.2"

-call-bind@^1.0.7:
-  version "1.0.7"
-  resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.7.tgz#06016599c40c56498c18769d2730be242b6fa3b9"
-  integrity sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==
-  dependencies:
-    es-define-property "^1.0.0"
-    es-errors "^1.3.0"
-    function-bind "^1.1.2"
-    get-intrinsic "^1.2.4"
-    set-function-length "^1.2.1"
-
 callsites@^3.0.0:
  version "3.1.0"
  resolved "https://registry.yarnpkg.com/callsites/-/callsites-3.1.0.tgz#b3630abd8943432f54b3f0519238e33cd7df2f73"
@@ -3197,11 +3186,6 @@ content-type@~1.0.4:
  resolved "https://registry.yarnpkg.com/content-type/-/content-type-1.0.4.tgz#e138cc75e040c727b1966fe5e5f8c9aee256fe3b"
  integrity sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA==

-content-type@~1.0.5:
-  version "1.0.5"
-  resolved "https://registry.yarnpkg.com/content-type/-/content-type-1.0.5.tgz#8b773162656d1d1086784c8f23a54ce6d73d7918"
-  integrity sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==
-
 convert-source-map@^1.7.0:
  version "1.8.0"
  resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.8.0.tgz#f3373c32d21b4d780dd8004514684fb791ca4369"
@@ -3214,10 +3198,10 @@ cookie-signature@1.0.6:
  resolved "https://registry.yarnpkg.com/cookie-signature/-/cookie-signature-1.0.6.tgz#e303a882b342cc3ee8ca513a79999734dab3ae2c"
  integrity sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ==

-cookie@0.6.0:
-  version "0.6.0"
-  resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.6.0.tgz#2798b04b071b0ecbff0dbb62a505a8efa4e19051"
-  integrity sha512-U71cyTamuh1CRNCfpGY6to28lxvNwPG4Guz/EVjgf3Jmzv0vlDp1atT9eS5dDjMYHucpHbWns6Lwf3BKz6svdw==
+cookie@0.5.0:
+  version "0.5.0"
+  resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.5.0.tgz#d1f5d71adec6558c58f389987c366aa47e994f8b"
+  integrity sha512-YZ3GUyn/o8gfKJlnlX7g7xq4gyO6OSuhGPKaaGssGB2qgDUS0gPgtTvoyZLTt9Ab6dC4hfc9dV5arkvc/OCmrw==

 copy-text-to-clipboard@^3.0.1:
  version "3.0.1"
@@ -3494,15 +3478,6 @@ defer-to-connect@^1.0.1:
  resolved "https://registry.yarnpkg.com/defer-to-connect/-/defer-to-connect-1.1.3.tgz#331ae050c08dcf789f8c83a7b81f0ed94f4ac591"
  integrity sha512-0ISdNousHvZT2EiFlZeZAHBUvSxmKswVCEf8hW7KWgG4a8MVEu/3Vb6uWYozkjylyCxe0JBIiRB1jV45S70WVQ==

-define-data-property@^1.1.4:
-  version "1.1.4"
-  resolved "https://registry.yarnpkg.com/define-data-property/-/define-data-property-1.1.4.tgz#894dc141bb7d3060ae4366f6a0107e68fbe48c5e"
-  integrity sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==
-  dependencies:
-    es-define-property "^1.0.0"
-    es-errors "^1.3.0"
-    gopd "^1.0.1"
-
 define-lazy-prop@^2.0.0:
  version "2.0.0"
  resolved "https://registry.yarnpkg.com/define-lazy-prop/-/define-lazy-prop-2.0.0.tgz#3f7ae421129bcaaac9bc74905c98a0009ec9ee7f"
@@ -3760,11 +3735,6 @@ encodeurl@~1.0.2:
  resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59"
  integrity sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w==

-encodeurl@~2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-2.0.0.tgz#7b8ea898077d7e409d3ac45474ea38eaf0857a58"
-  integrity sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg==
-
 end-of-stream@^1.1.0:
  version "1.4.4"
  resolved "https://registry.yarnpkg.com/end-of-stream/-/end-of-stream-1.4.4.tgz#5ae64a5f45057baf3626ec14da0ca5e4b2431eb0"
@@ -3797,18 +3767,6 @@ error-ex@^1.3.1:
  dependencies:
    is-arrayish "^0.2.1"

-es-define-property@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/es-define-property/-/es-define-property-1.0.0.tgz#c7faefbdff8b2696cf5f46921edfb77cc4ba3845"
-  integrity sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==
-  dependencies:
-    get-intrinsic "^1.2.4"
-
-es-errors@^1.3.0:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/es-errors/-/es-errors-1.3.0.tgz#05f75a25dab98e4fb1dcd5e1472c0546d5057c8f"
-  integrity sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==
-
 es-module-lexer@^0.9.0:
  version "0.9.3"
  resolved "https://registry.yarnpkg.com/es-module-lexer/-/es-module-lexer-0.9.3.tgz#6f13db00cc38417137daf74366f535c8eb438f19"
@@ -3918,36 +3876,36 @@ execa@^5.0.0:
    strip-final-newline "^2.0.0"

 express@^4.17.3:
-  version "4.21.0"
-  resolved "https://registry.yarnpkg.com/express/-/express-4.21.0.tgz#d57cb706d49623d4ac27833f1cbc466b668eb915"
-  integrity sha512-VqcNGcj/Id5ZT1LZ/cfihi3ttTn+NJmkli2eZADigjq29qTlWi/hAQ43t/VLPq8+UX06FCEx3ByOYet6ZFblng==
+  version "4.18.1"
+  resolved "https://registry.yarnpkg.com/express/-/express-4.18.1.tgz#7797de8b9c72c857b9cd0e14a5eea80666267caf"
+  integrity sha512-zZBcOX9TfehHQhtupq57OF8lFZ3UZi08Y97dwFCkD8p9d/d2Y3M+ykKcwaMDEL+4qyUolgBDX6AblpR3fL212Q==
  dependencies:
    accepts "~1.3.8"
    array-flatten "1.1.1"
-    body-parser "1.20.3"
+    body-parser "1.20.0"
    content-disposition "0.5.4"
    content-type "~1.0.4"
-    cookie "0.6.0"
+    cookie "0.5.0"
    cookie-signature "1.0.6"
    debug "2.6.9"
    depd "2.0.0"
-    encodeurl "~2.0.0"
+    encodeurl "~1.0.2"
    escape-html "~1.0.3"
    etag "~1.8.1"
-    finalhandler "1.3.1"
+    finalhandler "1.2.0"
    fresh "0.5.2"
    http-errors "2.0.0"
-    merge-descriptors "1.0.3"
+    merge-descriptors "1.0.1"
    methods "~1.1.2"
    on-finished "2.4.1"
    parseurl "~1.3.3"
-    path-to-regexp "0.1.10"
+    path-to-regexp "0.1.7"
    proxy-addr "~2.0.7"
-    qs "6.13.0"
+    qs "6.10.3"
    range-parser "~1.2.1"
    safe-buffer "5.2.1"
-    send "0.19.0"
-    serve-static "1.16.2"
+    send "0.18.0"
+    serve-static "1.15.0"
    setprototypeof "1.2.0"
    statuses "2.0.1"
    type-is "~1.6.18"
@@ -4067,13 +4025,13 @@ fill-range@^7.1.1:
  dependencies:
    to-regex-range "^5.0.1"

-finalhandler@1.3.1:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-1.3.1.tgz#0c575f1d1d324ddd1da35ad7ece3df7d19088019"
-  integrity sha512-6BN9trH7bp3qvnrRyzsBz+g3lZxTNZTbVO2EV1CS0WIcDbawYVdYvGflME/9QP0h0pYlCDBCTjYa9nZzMDpyxQ==
+finalhandler@1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-1.2.0.tgz#7d23fe5731b207b4640e4fcd00aec1f9207a7b32"
+  integrity sha512-5uXcUVftlQMFnWC9qu/svkWv3GTd2PfUhK/3PLkYNAe7FbqJMt3515HaxE6eRL74GdsriiwujiawdaB1BpEISg==
  dependencies:
    debug "2.6.9"
-    encodeurl "~2.0.0"
+    encodeurl "~1.0.2"
    escape-html "~1.0.3"
    on-finished "2.4.1"
    parseurl "~1.3.3"
@@ -4198,11 +4156,6 @@ function-bind@^1.1.1:
  resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d"
  integrity sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==

-function-bind@^1.1.2:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.2.tgz#2c02d864d97f3ea6c8830c464cbd11ab6eab7a1c"
-  integrity sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==
-
 gensync@^1.0.0-beta.1, gensync@^1.0.0-beta.2:
  version "1.0.0-beta.2"
  resolved "https://registry.yarnpkg.com/gensync/-/gensync-1.0.0-beta.2.tgz#32a6ee76c3d7f52d46b2b1ae5d93fea8580a25e0"
@@ -4217,17 +4170,6 @@ get-intrinsic@^1.0.2, get-intrinsic@^1.1.1:
    has "^1.0.3"
    has-symbols "^1.0.3"

-get-intrinsic@^1.1.3, get-intrinsic@^1.2.4:
-  version "1.2.4"
-  resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.2.4.tgz#e385f5a4b5227d449c3eabbad05494ef0abbeadd"
-  integrity sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==
-  dependencies:
-    es-errors "^1.3.0"
-    function-bind "^1.1.2"
-    has-proto "^1.0.1"
-    has-symbols "^1.0.3"
-    hasown "^2.0.0"
-
 get-own-enumerable-property-symbols@^3.0.0:
  version "3.0.2"
  resolved "https://registry.yarnpkg.com/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-3.0.2.tgz#b5fde77f22cbe35f390b4e089922c50bce6ef664"
@@ -4339,13 +4281,6 @@ globby@^13.1.1:
    merge2 "^1.4.1"
    slash "^4.0.0"

-gopd@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/gopd/-/gopd-1.0.1.tgz#29ff76de69dac7489b7c0918a5788e56477c332c"
-  integrity sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==
-  dependencies:
-    get-intrinsic "^1.1.3"
-
 got@^9.6.0:
  version "9.6.0"
  resolved "https://registry.yarnpkg.com/got/-/got-9.6.0.tgz#edf45e7d67f99545705de1f7bbeeeb121765ed85"
@@ -4407,18 +4342,6 @@ has-property-descriptors@^1.0.0:
  dependencies:
    get-intrinsic "^1.1.1"

-has-property-descriptors@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz#963ed7d071dc7bf5f084c5bfbe0d1b6222586854"
-  integrity sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==
-  dependencies:
-    es-define-property "^1.0.0"
-
-has-proto@^1.0.1:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/has-proto/-/has-proto-1.0.3.tgz#b31ddfe9b0e6e9914536a6ab286426d0214f77fd"
-  integrity sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==
-
 has-symbols@^1.0.1, has-symbols@^1.0.3:
  version "1.0.3"
  resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.3.tgz#bb7b2c4349251dce87b125f7bdf874aa7c8b39f8"
@@ -4436,13 +4359,6 @@ has@^1.0.3:
  dependencies:
    function-bind "^1.1.1"

-hasown@^2.0.0:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/hasown/-/hasown-2.0.2.tgz#003eaf91be7adc372e84ec59dc37252cedb80003"
-  integrity sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==
-  dependencies:
-    function-bind "^1.1.2"
-
 hast-to-hyperscript@^9.0.0:
  version "9.0.1"
  resolved "https://registry.yarnpkg.com/hast-to-hyperscript/-/hast-to-hyperscript-9.0.1.tgz#9b67fd188e4c81e8ad66f803855334173920218d"
@@ -5284,10 +5200,10 @@ memfs@^3.1.2, memfs@^3.4.3:
  dependencies:
    fs-monkey "^1.0.3"

-merge-descriptors@1.0.3:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/merge-descriptors/-/merge-descriptors-1.0.3.tgz#d80319a65f3c7935351e5cfdac8f9318504dbed5"
-  integrity sha512-gaNvAS7TZ897/rVaZ0nMtAyxNyi/pdbjbAwUpFQpN70GqnVfOiXpeUUMKRBmzXaSQ8DdTX4/0ms62r2K+hE6mQ==
+merge-descriptors@1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/merge-descriptors/-/merge-descriptors-1.0.1.tgz#b00aaa556dd8b44568150ec9d1b953f3f90cbb61"
+  integrity sha512-cCi6g3/Zr1iqQi6ySbseM1Xvooa98N0w31jzUYrXPX2xqObmFGHJ0tQ5u74H3mVh7wLouTseZyYIq39g8cNp1w==

 merge-stream@^2.0.0:
  version "2.0.0"
@@ -5509,10 +5425,10 @@ object-assign@^4.1.0, object-assign@^4.1.1:
  resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
  integrity sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==

-object-inspect@^1.13.1:
-  version "1.13.2"
-  resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.13.2.tgz#dea0088467fb991e67af4058147a24824a3043ff"
-  integrity sha512-IRZSRuzJiynemAXPYtPe5BoI/RESNYR7TYm50MC5Mqbd3Jmw5y790sErYw3V6SryFJD64b74qQQs9wn5Bg/k3g==
+object-inspect@^1.9.0:
+  version "1.12.2"
+  resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.12.2.tgz#c0641f26394532f28ab8d796ab954e43c009a8ea"
+  integrity sha512-z+cPxW0QGUp0mcqcsgQyLVRDoXFQbXOwBaqyF7VIgI4TWNQsDHrBpUQslRmIfAoYWdYzs6UlKJtB2XJpTaNSpQ==

 object-keys@^1.1.1:
  version "1.1.1"
@@ -5754,10 +5670,10 @@ path-parse@^1.0.7:
  resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.7.tgz#fbc114b60ca42b30d9daf5858e4bd68bbedb6735"
  integrity sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==

-path-to-regexp@0.1.10:
-  version "0.1.10"
-  resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.10.tgz#67e9108c5c0551b9e5326064387de4763c4d5f8b"
-  integrity sha512-7lf7qcQidTku0Gu3YDPc8DJ1q7OOucfa/BSsIwjuh56VU7katFvuM8hULfkwB3Fns/rsVF7PwPKVw1sl5KQS9w==
+path-to-regexp@0.1.7:
+  version "0.1.7"
+  resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.7.tgz#df604178005f522f15eb4490e7247a1bfaa67f8c"
+  integrity sha512-5DFkuoqlv1uYQKxy8omFBeJPQcdoE07Kv2sferDCrAq1ohOU+MSDswDIbnx3YAM60qIOnYa53wBhXW0EbMonrQ==

 path-to-regexp@2.2.1:
  version "2.2.1"
@@ -6192,12 +6108,12 @@ pure-color@^1.2.0:
  resolved "https://registry.yarnpkg.com/pure-color/-/pure-color-1.3.0.tgz#1fe064fb0ac851f0de61320a8bf796836422f33e"
  integrity sha512-QFADYnsVoBMw1srW7OVKEYjG+MbIa49s54w1MA1EDY6r2r/sTcKKYqRX1f4GYvnXP7eN/Pe9HFcX+hwzmrXRHA==

-qs@6.13.0:
-  version "6.13.0"
-  resolved "https://registry.yarnpkg.com/qs/-/qs-6.13.0.tgz#6ca3bd58439f7e245655798997787b0d88a51906"
-  integrity sha512-+38qI9SOr8tfZ4QmJNplMUxqjbe7LKvvZgWdExBOmd+egZTtjLB67Gu0HRX3u/XOq7UU2Nx6nsjvS16Z9uwfpg==
+qs@6.10.3:
+  version "6.10.3"
+  resolved "https://registry.yarnpkg.com/qs/-/qs-6.10.3.tgz#d6cde1b2ffca87b5aa57889816c5f81535e22e8e"
+  integrity sha512-wr7M2E0OFRfIfJZjKGieI8lBKb7fRCH4Fv5KNPEs7gJ8jadvotdsS08PzOKR7opXhZ/Xkjtt3WF9g38drmyRqQ==
  dependencies:
-    side-channel "^1.0.6"
+    side-channel "^1.0.4"

 queue-microtask@^1.2.2:
  version "1.2.3"
@@ -6228,10 +6144,10 @@ range-parser@^1.2.1, range-parser@~1.2.1:
  resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.1.tgz#3cf37023d199e1c24d1a55b84800c2f3e6468031"
  integrity sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==

-raw-body@2.5.2:
-  version "2.5.2"
-  resolved "https://registry.yarnpkg.com/raw-body/-/raw-body-2.5.2.tgz#99febd83b90e08975087e8f1f9419a149366b68a"
-  integrity sha512-8zGqypfENjCIqGhgXToC8aB2r7YrBX+AQAfIPs/Mlk+BtPTztOvTS01NRW/3Eh60J+a48lt8qsCzirQ6loCVfA==
+raw-body@2.5.1:
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/raw-body/-/raw-body-2.5.1.tgz#fe1b1628b181b700215e5fd42389f98b71392857"
+  integrity sha512-qqJBtEyVgS0ZmPGdCFPWJ3FreoqvG4MVQln/kCgF7Olq95IbOp0/BWyMwbdtn4VTvkM8Y7khCQ2Xgk/tcrCXig==
  dependencies:
    bytes "3.1.2"
    http-errors "2.0.0"
@@ -6861,10 +6777,10 @@ semver@^7.3.2, semver@^7.3.4, semver@^7.3.5, semver@^7.3.7:
  dependencies:
    lru-cache "^6.0.0"

-send@0.19.0:
-  version "0.19.0"
-  resolved "https://registry.yarnpkg.com/send/-/send-0.19.0.tgz#bbc5a388c8ea6c048967049dbeac0e4a3f09d7f8"
-  integrity sha512-dW41u5VfLXu8SJh5bwRmyYUbAoSB3c9uQh6L8h/KtsFREPWpbX1lrljJo186Jc4nmci/sGUZ9a0a0J2zgfq2hw==
+send@0.18.0:
+  version "0.18.0"
+  resolved "https://registry.yarnpkg.com/send/-/send-0.18.0.tgz#670167cc654b05f5aa4a767f9113bb371bc706be"
+  integrity sha512-qqWzuOjSFOuqPjFe4NOsMLafToQQwBSOEpS+FwEt3A2V3vKubTquT3vmLTQpFgMXp8AlFWFuP1qKaJZOtPpVXg==
  dependencies:
    debug "2.6.9"
    depd "2.0.0"
@@ -6914,27 +6830,15 @@ serve-index@^1.9.1:
    mime-types "~2.1.17"
    parseurl "~1.3.2"

-serve-static@1.16.2:
-  version "1.16.2"
-  resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-1.16.2.tgz#b6a5343da47f6bdd2673848bf45754941e803296"
-  integrity sha512-VqpjJZKadQB/PEbEwvFdO43Ax5dFBZ2UECszz8bQ7pi7wt//PWe1P6MN7eCnjsatYtBT6EuiClbjSWP2WrIoTw==
+serve-static@1.15.0:
+  version "1.15.0"
+  resolved "https://registry.yarnpkg.com/serve-static/-/serve-static-1.15.0.tgz#faaef08cffe0a1a62f60cad0c4e513cff0ac9540"
+  integrity sha512-XGuRDNjXUijsUL0vl6nSD7cwURuzEgglbOaFuZM9g3kwDXOWVTck0jLzjPzGD+TazWbboZYu52/9/XPdUgne9g==
  dependencies:
-    encodeurl "~2.0.0"
+    encodeurl "~1.0.2"
    escape-html "~1.0.3"
    parseurl "~1.3.3"
-    send "0.19.0"
-
-set-function-length@^1.2.1:
-  version "1.2.2"
-  resolved "https://registry.yarnpkg.com/set-function-length/-/set-function-length-1.2.2.tgz#aac72314198eaed975cf77b2c3b6b880695e5449"
-  integrity sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==
-  dependencies:
-    define-data-property "^1.1.4"
-    es-errors "^1.3.0"
-    function-bind "^1.1.2"
-    get-intrinsic "^1.2.4"
-    gopd "^1.0.1"
-    has-property-descriptors "^1.0.2"
+    send "0.18.0"

 setimmediate@^1.0.5:
  version "1.0.5"
@@ -6989,15 +6893,14 @@ shelljs@^0.8.5:
    interpret "^1.0.0"
    rechoir "^0.6.2"

-side-channel@^1.0.6:
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/side-channel/-/side-channel-1.0.6.tgz#abd25fb7cd24baf45466406b1096b7831c9215f2"
-  integrity sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==
+side-channel@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/side-channel/-/side-channel-1.0.4.tgz#efce5c8fdc104ee751b25c58d4290011fa5ea2cf"
+  integrity sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==
  dependencies:
-    call-bind "^1.0.7"
-    es-errors "^1.3.0"
-    get-intrinsic "^1.2.4"
-    object-inspect "^1.13.1"
+    call-bind "^1.0.0"
+    get-intrinsic "^1.0.2"
+    object-inspect "^1.9.0"

 signal-exit@^3.0.2, signal-exit@^3.0.3:
  version "3.0.7"
@@ -40,7 +40,7 @@ import type {
 } from "@excalidraw/excalidraw/dist/excalidraw/element/types";
 import type { ImportedLibraryData } from "@excalidraw/excalidraw/dist/excalidraw/data/types";

-import "./App.scss";
+import "./ExampleApp.scss";

 type Comment = {
  x: number;
@@ -73,7 +73,7 @@ export interface AppProps {
  excalidrawLib: typeof TExcalidraw;
 }

-export default function App({
+export default function ExampleApp({
  appTitle,
  useCustom,
  customArgs,
@@ -1,7 +1,7 @@
 "use client";
 import * as excalidrawLib from "@excalidraw/excalidraw";
 import { Excalidraw } from "@excalidraw/excalidraw";
-import App from "../../components/App";
+import App from "../../components/ExampleApp";

 import "@excalidraw/excalidraw/index.css";

@@ -1,4 +1,4 @@
-import App from "../components/App";
+import App from "../components/ExampleApp";
 import React, { StrictMode } from "react";
 import { createRoot } from "react-dom/client";

@@ -649,7 +649,12 @@ const ExcalidrawWrapper = () => {

    // Render the debug scene if the debug canvas is available
    if (debugCanvasRef.current && excalidrawAPI) {
-      debugRenderer(debugCanvasRef.current, appState, window.devicePixelRatio);
+      debugRenderer(
+        debugCanvasRef.current,
+        appState,
+        window.devicePixelRatio,
+        () => forceRefresh((prev) => !prev),
+      );
    }
  };

@@ -68,12 +68,17 @@ const _debugRenderer = (
  canvas: HTMLCanvasElement,
  appState: AppState,
  scale: number,
+  refresh: () => void,
 ) => {
  const [normalizedWidth, normalizedHeight] = getNormalizedCanvasDimensions(
    canvas,
    scale,
  );

+  if (appState.height !== canvas.height || appState.width !== canvas.width) {
+    refresh();
+  }
+
  const context = bootstrapCanvas({
    canvas,
    scale,
@@ -138,8 +143,13 @@ export const saveDebugState = (debug: { enabled: boolean }) => {
 };

 export const debugRenderer = throttleRAF(
-  (canvas: HTMLCanvasElement, appState: AppState, scale: number) => {
-    _debugRenderer(canvas, appState, scale);
+  (
+    canvas: HTMLCanvasElement,
+    appState: AppState,
+    scale: number,
+    refresh: () => void,
+  ) => {
+    _debugRenderer(canvas, appState, scale, refresh);
  },
  { trailing: true },
 );
@@ -130,15 +130,6 @@
    </script>
    <% } %>

-    <!-- For Nunito only preload the latin range, which should be good enough for now -->
-    <link
-      rel="preload"
-      href="https://fonts.gstatic.com/s/nunito/v26/XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTQ3j6zbXWjgeg.woff2"
-      as="font"
-      type="font/woff2"
-      crossorigin="anonymous"
-    />
-
    <!-- Register Assistant as the UI font, before the scene inits -->
    <link
      rel="stylesheet"
@@ -48,6 +48,8 @@ export default defineConfig({
      },
    },
    sourcemap: true,
+    // don't auto-inline small assets (i.e. fonts hosted on CDN)
+    assetsInlineLimit: 0,
  },
  plugins: [
    woff2BrowserPlugin(),
@@ -15,6 +15,8 @@ Please add the latest change on the top under the correct section.

 ### Features

+- Prefer user defined coordinates and dimensions when creating a frame using [`convertToExcalidrawElements`](https://docs.excalidraw.com/docs/@excalidraw/excalidraw/api/excalidraw-element-skeleton#converttoexcalidrawelements) [#8517](https://github.com/excalidraw/excalidraw/pull/8517)
+
 - `props.initialData` can now be a function that returns `ExcalidrawInitialDataState` or `Promise<ExcalidrawInitialDataState>`. [#8107](https://github.com/excalidraw/excalidraw/pull/8135)

 - Added support for multiplayer undo/redo, by calculating invertible increments and storing them inside the local-only undo/redo stacks. [#7348](https://github.com/excalidraw/excalidraw/pull/7348)
@@ -217,6 +217,7 @@ export const actionFinalize = register({
      onClick={updateData}
      visible={appState.multiElement != null}
      size={data?.size || "medium"}
+      style={{ pointerEvents: "all" }}
    />
  ),
 });
@@ -0,0 +1,211 @@
+import React from "react";
+import { Excalidraw } from "../index";
+import { render } from "../tests/test-utils";
+import { API } from "../tests/helpers/api";
+import { point } from "../../math";
+import { actionFlipHorizontal, actionFlipVertical } from "./actionFlip";
+
+const { h } = window;
+
+describe("flipping re-centers selection", () => {
+  it("elbow arrow touches group selection side yet it remains in place after multiple moves", async () => {
+    const elements = [
+      API.createElement({
+        type: "rectangle",
+        id: "rec1",
+        x: 100,
+        y: 100,
+        width: 100,
+        height: 100,
+        boundElements: [{ id: "arr", type: "arrow" }],
+      }),
+      API.createElement({
+        type: "rectangle",
+        id: "rec2",
+        x: 220,
+        y: 250,
+        width: 100,
+        height: 100,
+        boundElements: [{ id: "arr", type: "arrow" }],
+      }),
+      API.createElement({
+        type: "arrow",
+        id: "arr",
+        x: 149.9,
+        y: 95,
+        width: 156,
+        height: 239.9,
+        startBinding: {
+          elementId: "rec1",
+          focus: 0,
+          gap: 5,
+          fixedPoint: [0.49, -0.05],
+        },
+        endBinding: {
+          elementId: "rec2",
+          focus: 0,
+          gap: 5,
+          fixedPoint: [-0.05, 0.49],
+        },
+        startArrowhead: null,
+        endArrowhead: "arrow",
+        points: [
+          point(0, 0),
+          point(0, -35),
+          point(-90.9, -35),
+          point(-90.9, 204.9),
+          point(65.1, 204.9),
+        ],
+        elbowed: true,
+      }),
+    ];
+    await render(<Excalidraw initialData={{ elements }} />);
+
+    API.setSelectedElements(elements);
+
+    expect(Object.keys(h.state.selectedElementIds).length).toBe(3);
+
+    API.executeAction(actionFlipHorizontal);
+    API.executeAction(actionFlipHorizontal);
+    API.executeAction(actionFlipHorizontal);
+    API.executeAction(actionFlipHorizontal);
+
+    const rec1 = h.elements.find((el) => el.id === "rec1");
+    expect(rec1?.x).toBeCloseTo(100);
+    expect(rec1?.y).toBeCloseTo(100);
+
+    const rec2 = h.elements.find((el) => el.id === "rec2");
+    expect(rec2?.x).toBeCloseTo(220);
+    expect(rec2?.y).toBeCloseTo(250);
+  });
+});
+
+describe("flipping arrowheads", () => {
+  beforeEach(async () => {
+    await render(<Excalidraw />);
+  });
+
+  it("flipping bound arrow should flip arrowheads only", () => {
+    const rect = API.createElement({
+      type: "rectangle",
+      boundElements: [{ type: "arrow", id: "arrow1" }],
+    });
+    const arrow = API.createElement({
+      type: "arrow",
+      id: "arrow1",
+      startArrowhead: "arrow",
+      endArrowhead: null,
+      endBinding: {
+        elementId: rect.id,
+        focus: 0.5,
+        gap: 5,
+      },
+    });
+
+    API.setElements([rect, arrow]);
+    API.setSelectedElements([arrow]);
+
+    expect(API.getElement(arrow).startArrowhead).toBe("arrow");
+    expect(API.getElement(arrow).endArrowhead).toBe(null);
+
+    API.executeAction(actionFlipHorizontal);
+    expect(API.getElement(arrow).startArrowhead).toBe(null);
+    expect(API.getElement(arrow).endArrowhead).toBe("arrow");
+
+    API.executeAction(actionFlipHorizontal);
+    expect(API.getElement(arrow).startArrowhead).toBe("arrow");
+    expect(API.getElement(arrow).endArrowhead).toBe(null);
+
+    API.executeAction(actionFlipVertical);
+    expect(API.getElement(arrow).startArrowhead).toBe(null);
+    expect(API.getElement(arrow).endArrowhead).toBe("arrow");
+  });
+
+  it("flipping bound arrow should flip arrowheads only 2", () => {
+    const rect = API.createElement({
+      type: "rectangle",
+      boundElements: [{ type: "arrow", id: "arrow1" }],
+    });
+    const rect2 = API.createElement({
+      type: "rectangle",
+      boundElements: [{ type: "arrow", id: "arrow1" }],
+    });
+    const arrow = API.createElement({
+      type: "arrow",
+      id: "arrow1",
+      startArrowhead: "arrow",
+      endArrowhead: "circle",
+      startBinding: {
+        elementId: rect.id,
+        focus: 0.5,
+        gap: 5,
+      },
+      endBinding: {
+        elementId: rect2.id,
+        focus: 0.5,
+        gap: 5,
+      },
+    });
+
+    API.setElements([rect, rect2, arrow]);
+    API.setSelectedElements([arrow]);
+
+    expect(API.getElement(arrow).startArrowhead).toBe("arrow");
+    expect(API.getElement(arrow).endArrowhead).toBe("circle");
+
+    API.executeAction(actionFlipHorizontal);
+    expect(API.getElement(arrow).startArrowhead).toBe("circle");
+    expect(API.getElement(arrow).endArrowhead).toBe("arrow");
+
+    API.executeAction(actionFlipVertical);
+    expect(API.getElement(arrow).startArrowhead).toBe("arrow");
+    expect(API.getElement(arrow).endArrowhead).toBe("circle");
+  });
+
+  it("flipping unbound arrow shouldn't flip arrowheads", () => {
+    const arrow = API.createElement({
+      type: "arrow",
+      id: "arrow1",
+      startArrowhead: "arrow",
+      endArrowhead: "circle",
+    });
+
+    API.setElements([arrow]);
+    API.setSelectedElements([arrow]);
+
+    expect(API.getElement(arrow).startArrowhead).toBe("arrow");
+    expect(API.getElement(arrow).endArrowhead).toBe("circle");
+
+    API.executeAction(actionFlipHorizontal);
+    expect(API.getElement(arrow).startArrowhead).toBe("arrow");
+    expect(API.getElement(arrow).endArrowhead).toBe("circle");
+  });
+
+  it("flipping bound arrow shouldn't flip arrowheads if selected alongside non-arrow eleemnt", () => {
+    const rect = API.createElement({
+      type: "rectangle",
+      boundElements: [{ type: "arrow", id: "arrow1" }],
+    });
+    const arrow = API.createElement({
+      type: "arrow",
+      id: "arrow1",
+      startArrowhead: "arrow",
+      endArrowhead: null,
+      endBinding: {
+        elementId: rect.id,
+        focus: 0.5,
+        gap: 5,
+      },
+    });
+
+    API.setElements([rect, arrow]);
+    API.setSelectedElements([rect, arrow]);
+
+    expect(API.getElement(arrow).startArrowhead).toBe("arrow");
+    expect(API.getElement(arrow).endArrowhead).toBe(null);
+
+    API.executeAction(actionFlipHorizontal);
+    expect(API.getElement(arrow).startArrowhead).toBe("arrow");
+    expect(API.getElement(arrow).endArrowhead).toBe(null);
+  });
+});
@@ -2,6 +2,8 @@ import { register } from "./register";
 import { getSelectedElements } from "../scene";
 import { getNonDeletedElements } from "../element";
 import type {
+  ExcalidrawArrowElement,
+  ExcalidrawElbowArrowElement,
  ExcalidrawElement,
  NonDeleted,
  NonDeletedSceneElementsMap,
@@ -18,7 +20,13 @@ import {
 import { updateFrameMembershipOfSelectedElements } from "../frame";
 import { flipHorizontal, flipVertical } from "../components/icons";
 import { StoreAction } from "../store";
-import { isLinearElement } from "../element/typeChecks";
+import {
+  isArrowElement,
+  isElbowArrow,
+  isLinearElement,
+} from "../element/typeChecks";
+import { mutateElbowArrow } from "../element/routing";
+import { mutateElement, newElementWith } from "../element/mutateElement";

 export const actionFlipHorizontal = register({
  name: "flipHorizontal",
@@ -109,7 +117,23 @@ const flipElements = (
  flipDirection: "horizontal" | "vertical",
  app: AppClassProperties,
 ): ExcalidrawElement[] => {
-  const { minX, minY, maxX, maxY } = getCommonBoundingBox(selectedElements);
+  if (
+    selectedElements.every(
+      (element) =>
+        isArrowElement(element) && (element.startBinding || element.endBinding),
+    )
+  ) {
+    return selectedElements.map((element) => {
+      const _element = element as ExcalidrawArrowElement;
+      return newElementWith(_element, {
+        startArrowhead: _element.endArrowhead,
+        endArrowhead: _element.startArrowhead,
+      });
+    });
+  }
+
+  const { minX, minY, maxX, maxY, midX, midY } =
+    getCommonBoundingBox(selectedElements);

  resizeMultipleElements(
    elementsMap,
@@ -131,5 +155,48 @@ const flipElements = (
    [],
  );

+  // ---------------------------------------------------------------------------
+  // flipping arrow elements (and potentially other) makes the selection group
+  // "move" across the canvas because of how arrows can bump against the "wall"
+  // of the selection, so we need to center the group back to the original
+  // position so that repeated flips don't accumulate the offset
+
+  const { elbowArrows, otherElements } = selectedElements.reduce(
+    (
+      acc: {
+        elbowArrows: ExcalidrawElbowArrowElement[];
+        otherElements: ExcalidrawElement[];
+      },
+      element,
+    ) =>
+      isElbowArrow(element)
+        ? { ...acc, elbowArrows: acc.elbowArrows.concat(element) }
+        : { ...acc, otherElements: acc.otherElements.concat(element) },
+    { elbowArrows: [], otherElements: [] },
+  );
+
+  const { midX: newMidX, midY: newMidY } =
+    getCommonBoundingBox(selectedElements);
+  const [diffX, diffY] = [midX - newMidX, midY - newMidY];
+  otherElements.forEach((element) =>
+    mutateElement(element, {
+      x: element.x + diffX,
+      y: element.y + diffY,
+    }),
+  );
+  elbowArrows.forEach((element) =>
+    mutateElbowArrow(
+      element,
+      elementsMap,
+      element.points,
+      undefined,
+      undefined,
+      {
+        informMutation: false,
+      },
+    ),
+  );
+  // ---------------------------------------------------------------------------
+
  return selectedElements;
 };
@@ -1685,19 +1685,6 @@ export const actionChangeArrowType = register({
                : {}),
            },
          );
-        } else {
-          mutateElement(
-            newElement,
-            {
-              startBinding: newElement.startBinding
-                ? { ...newElement.startBinding, fixedPoint: null }
-                : null,
-              endBinding: newElement.endBinding
-                ? { ...newElement.endBinding, fixedPoint: null }
-                : null,
-            },
-            false,
-          );
        }

        return newElement;
@@ -185,6 +185,7 @@ import type {
  MagicGenerationData,
  ExcalidrawNonSelectionElement,
  ExcalidrawArrowElement,
+  NonDeletedSceneElementsMap,
 } from "../element/types";
 import { getCenter, getDistance } from "../gesture";
 import {
@@ -287,6 +288,7 @@ import {
  getDateTime,
  isShallowEqual,
  arrayToMap,
+  toBrandedType,
 } from "../utils";
 import {
  createSrcDoc,
@@ -435,7 +437,7 @@ import { actionTextAutoResize } from "../actions/actionTextAutoResize";
 import { getVisibleSceneBounds } from "../element/bounds";
 import { isMaybeMermaidDefinition } from "../mermaid";
 import NewElementCanvas from "./canvases/NewElementCanvas";
-import { mutateElbowArrow } from "../element/routing";
+import { mutateElbowArrow, updateElbowArrow } from "../element/routing";
 import {
  FlowChartCreator,
  FlowChartNavigator,
@@ -3109,7 +3111,45 @@ class App extends React.Component<AppProps, AppState> {
    retainSeed?: boolean;
    fitToContent?: boolean;
  }) => {
-    const elements = restoreElements(opts.elements, null, undefined);
+    let elements = opts.elements.map((el, _, elements) => {
+      if (isElbowArrow(el)) {
+        const startEndElements = [
+          el.startBinding &&
+            elements.find((l) => l.id === el.startBinding?.elementId),
+          el.endBinding &&
+            elements.find((l) => l.id === el.endBinding?.elementId),
+        ];
+        const startBinding = startEndElements[0] ? el.startBinding : null;
+        const endBinding = startEndElements[1] ? el.endBinding : null;
+        return {
+          ...el,
+          ...updateElbowArrow(
+            {
+              ...el,
+              startBinding,
+              endBinding,
+            },
+            toBrandedType<NonDeletedSceneElementsMap>(
+              new Map(
+                startEndElements
+                  .filter((x) => x != null)
+                  .map(
+                    (el) =>
+                      [el!.id, el] as [
+                        string,
+                        Ordered<NonDeletedExcalidrawElement>,
+                      ],
+                  ),
+              ),
+            ),
+            [el.points[0], el.points[el.points.length - 1]],
+          ),
+        };
+      }
+
+      return el;
+    });
+    elements = restoreElements(elements, null, undefined);
    const [minX, minY, maxX, maxY] = getCommonBounds(elements);

    const elementsCenterX = distance(minX, maxX) / 2;
@@ -3817,40 +3857,53 @@ class App extends React.Component<AppProps, AppState> {

  public getEditorUIOffsets = (): Offsets => {
    const toolbarBottom =
-      this.excalidrawContainerRef?.current
+      (this.excalidrawContainerRef?.current
        ?.querySelector(".App-toolbar")
-        ?.getBoundingClientRect()?.bottom ?? 0;
+        ?.getBoundingClientRect()?.bottom ?? 0) - this.state.offsetTop;
    const sidebarRect = this.excalidrawContainerRef?.current
      ?.querySelector(".sidebar")
      ?.getBoundingClientRect();
    const propertiesPanelRect = this.excalidrawContainerRef?.current
      ?.querySelector(".App-menu__left")
      ?.getBoundingClientRect();
-
    const PADDING = 16;

+    const adjustRectValueForOffset = (
+      value: number | undefined,
+      fallback: number,
+    ) => (value ?? fallback + this.state.offsetLeft) - this.state.offsetLeft;
+
    return getLanguage().rtl
      ? {
          top: toolbarBottom + PADDING,
          right:
            Math.max(
              this.state.width -
-                (propertiesPanelRect?.left ?? this.state.width),
+                adjustRectValueForOffset(
+                  propertiesPanelRect?.left,
+                  this.state.width,
+                ),
              0,
            ) + PADDING,
          bottom: PADDING,
-          left: Math.max(sidebarRect?.right ?? 0, 0) + PADDING,
+          left:
+            Math.max(adjustRectValueForOffset(sidebarRect?.right, 0), 0) +
+            PADDING,
        }
      : {
          top: toolbarBottom + PADDING,
          right: Math.max(
            this.state.width -
-              (sidebarRect?.left ?? this.state.width) +
+              adjustRectValueForOffset(sidebarRect?.left, this.state.width) +
              PADDING,
            0,
          ),
          bottom: PADDING,
-          left: Math.max(propertiesPanelRect?.right ?? 0, 0) + PADDING,
+          left:
+            Math.max(
+              adjustRectValueForOffset(propertiesPanelRect?.right, 0),
+              0,
+            ) + PADDING,
        };
  };

@@ -6,11 +6,11 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing s
  "backgroundColor": "#d8f5a2",
  "boundElements": [
    {
-      "id": "id45",
+      "id": "id47",
      "type": "arrow",
    },
    {
-      "id": "id46",
+      "id": "id48",
      "type": "arrow",
    },
  ],
@@ -47,7 +47,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing s
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id46",
+      "id": "id48",
      "type": "arrow",
    },
  ],
@@ -118,7 +118,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing s
  "seed": Any<Number>,
  "startArrowhead": null,
  "startBinding": {
-    "elementId": "id47",
+    "elementId": "id49",
    "fixedPoint": null,
    "focus": -0.08139534883720931,
    "gap": 1,
@@ -200,7 +200,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing s
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id45",
+      "id": "id47",
      "type": "arrow",
    },
  ],
@@ -238,7 +238,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing t
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id48",
+      "id": "id50",
      "type": "arrow",
    },
  ],
@@ -284,7 +284,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing t
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id48",
+      "id": "id50",
      "type": "arrow",
    },
  ],
@@ -329,7 +329,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing t
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id49",
+      "id": "id51",
      "type": "text",
    },
  ],
@@ -392,7 +392,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing t
  "autoResize": true,
  "backgroundColor": "transparent",
  "boundElements": null,
-  "containerId": "id48",
+  "containerId": "id50",
  "customData": undefined,
  "fillStyle": "solid",
  "fontFamily": 5,
@@ -433,7 +433,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to shapes whe
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id38",
+      "id": "id40",
      "type": "text",
    },
  ],
@@ -441,7 +441,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to shapes whe
  "elbowed": false,
  "endArrowhead": "arrow",
  "endBinding": {
-    "elementId": "id40",
+    "elementId": "id42",
    "fixedPoint": null,
    "focus": 0,
    "gap": 1,
@@ -472,7 +472,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to shapes whe
  "seed": Any<Number>,
  "startArrowhead": null,
  "startBinding": {
-    "elementId": "id39",
+    "elementId": "id41",
    "fixedPoint": null,
    "focus": 0,
    "gap": 1,
@@ -496,7 +496,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to shapes whe
  "autoResize": true,
  "backgroundColor": "transparent",
  "boundElements": null,
-  "containerId": "id37",
+  "containerId": "id39",
  "customData": undefined,
  "fillStyle": "solid",
  "fontFamily": 5,
@@ -537,7 +537,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to shapes whe
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id37",
+      "id": "id39",
      "type": "arrow",
    },
  ],
@@ -574,7 +574,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to shapes whe
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id37",
+      "id": "id39",
      "type": "arrow",
    },
  ],
@@ -611,7 +611,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id42",
+      "id": "id44",
      "type": "text",
    },
  ],
@@ -619,7 +619,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
  "elbowed": false,
  "endArrowhead": "arrow",
  "endBinding": {
-    "elementId": "id44",
+    "elementId": "id46",
    "fixedPoint": null,
    "focus": 0,
    "gap": 1,
@@ -650,7 +650,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
  "seed": Any<Number>,
  "startArrowhead": null,
  "startBinding": {
-    "elementId": "id43",
+    "elementId": "id45",
    "fixedPoint": null,
    "focus": 0,
    "gap": 1,
@@ -674,7 +674,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
  "autoResize": true,
  "backgroundColor": "transparent",
  "boundElements": null,
-  "containerId": "id41",
+  "containerId": "id43",
  "customData": undefined,
  "fillStyle": "solid",
  "fontFamily": 5,
@@ -716,7 +716,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id41",
+      "id": "id43",
      "type": "arrow",
    },
  ],
@@ -762,7 +762,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id41",
+      "id": "id43",
      "type": "arrow",
    },
  ],
@@ -1303,7 +1303,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id54",
+      "id": "id56",
      "type": "text",
    },
    {
@@ -1346,7 +1346,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id55",
+      "id": "id57",
      "type": "text",
    },
  ],
@@ -1385,7 +1385,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id56",
+      "id": "id58",
      "type": "text",
    },
    {
@@ -1428,7 +1428,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id57",
+      "id": "id59",
      "type": "text",
    },
    {
@@ -1475,7 +1475,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id58",
+      "id": "id60",
      "type": "text",
    },
  ],
@@ -1540,7 +1540,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
  "backgroundColor": "transparent",
  "boundElements": [
    {
-      "id": "id59",
+      "id": "id61",
      "type": "text",
    },
  ],
@@ -57,6 +57,15 @@ export const base64ToString = async (base64: string, isByteString = false) => {
    : byteStringToString(window.atob(base64));
 };

+export const base64ToArrayBuffer = (base64: string): ArrayBuffer => {
+  if (typeof Buffer !== "undefined") {
+    // Node.js environment
+    return Buffer.from(base64, "base64").buffer;
+  }
+  // Browser environment
+  return byteStringToArrayBuffer(atob(base64));
+};
+
 // -----------------------------------------------------------------------------
 // text encoding
 // -----------------------------------------------------------------------------
@@ -5,6 +5,7 @@ import type {
  ExcalidrawLinearElement,
  ExcalidrawSelectionElement,
  ExcalidrawTextElement,
+  FixedPointBinding,
  FontFamilyValues,
  OrderedExcalidrawElement,
  PointBinding,
@@ -21,6 +22,7 @@ import {
 import {
  isArrowElement,
  isElbowArrow,
+  isFixedPointBinding,
  isLinearElement,
  isTextElement,
  isUsingAdaptiveRadius,
@@ -101,8 +103,8 @@ const getFontFamilyByName = (fontFamilyName: string): FontFamilyValues => {

 const repairBinding = (
  element: ExcalidrawLinearElement,
-  binding: PointBinding | null,
-): PointBinding | null => {
+  binding: PointBinding | FixedPointBinding | null,
+): PointBinding | FixedPointBinding | null => {
  if (!binding) {
    return null;
  }
@@ -110,9 +112,11 @@ const repairBinding = (
  return {
    ...binding,
    focus: binding.focus || 0,
-    fixedPoint: isElbowArrow(element)
-      ? normalizeFixedPoint(binding.fixedPoint ?? [0, 0])
-      : null,
+    ...(isElbowArrow(element) && isFixedPointBinding(binding)
+      ? {
+          fixedPoint: normalizeFixedPoint(binding.fixedPoint ?? [0, 0]),
+        }
+      : {}),
  };
 };

@@ -309,28 +309,32 @@ describe("Test Transform", () => {
  });

  describe("Test Frames", () => {
+    const elements: ExcalidrawElementSkeleton[] = [
+      {
+        type: "rectangle",
+        x: 10,
+        y: 10,
+        strokeWidth: 2,
+        id: "1",
+      },
+      {
+        type: "diamond",
+        x: 120,
+        y: 20,
+        backgroundColor: "#fff3bf",
+        strokeWidth: 2,
+        label: {
+          text: "HELLO EXCALIDRAW",
+          strokeColor: "#099268",
+          fontSize: 30,
+        },
+        id: "2",
+      },
+    ];
+
    it("should transform frames and update frame ids when regenerated", () => {
      const elementsSkeleton: ExcalidrawElementSkeleton[] = [
-        {
-          type: "rectangle",
-          x: 10,
-          y: 10,
-          strokeWidth: 2,
-          id: "1",
-        },
-        {
-          type: "diamond",
-          x: 120,
-          y: 20,
-          backgroundColor: "#fff3bf",
-          strokeWidth: 2,
-          label: {
-            text: "HELLO EXCALIDRAW",
-            strokeColor: "#099268",
-            fontSize: 30,
-          },
-          id: "2",
-        },
+        ...elements,
        {
          type: "frame",
          children: ["1", "2"],
@@ -352,28 +356,9 @@ describe("Test Transform", () => {
      });
    });

-    it("should consider max of calculated and frame dimensions when provided", () => {
+    it("should consider user defined frame dimensions over calculated when provided", () => {
      const elementsSkeleton: ExcalidrawElementSkeleton[] = [
-        {
-          type: "rectangle",
-          x: 10,
-          y: 10,
-          strokeWidth: 2,
-          id: "1",
-        },
-        {
-          type: "diamond",
-          x: 120,
-          y: 20,
-          backgroundColor: "#fff3bf",
-          strokeWidth: 2,
-          label: {
-            text: "HELLO EXCALIDRAW",
-            strokeColor: "#099268",
-            fontSize: 30,
-          },
-          id: "2",
-        },
+        ...elements,
        {
          type: "frame",
          children: ["1", "2"],
@@ -388,7 +373,27 @@ describe("Test Transform", () => {
      );
      const frame = excalidrawElements.find((ele) => ele.type === "frame")!;
      expect(frame.width).toBe(800);
-      expect(frame.height).toBe(126);
+      expect(frame.height).toBe(100);
+    });
+
+    it("should consider user defined frame coordinates calculated when provided", () => {
+      const elementsSkeleton: ExcalidrawElementSkeleton[] = [
+        ...elements,
+        {
+          type: "frame",
+          children: ["1", "2"],
+          name: "My frame",
+          x: 100,
+          y: 300,
+        },
+      ];
+      const excalidrawElements = convertToExcalidrawElements(
+        elementsSkeleton,
+        opts,
+      );
+      const frame = excalidrawElements.find((ele) => ele.type === "frame")!;
+      expect(frame.x).toBe(100);
+      expect(frame.y).toBe(300);
    });
  });

@@ -46,6 +46,7 @@ import {
  assertNever,
  cloneJSON,
  getFontString,
+  isDevEnv,
  toBrandedType,
 } from "../utils";
 import { getSizeFromPoints } from "../points";
@@ -717,7 +718,7 @@ export const convertToExcalidrawElements = (
  }

  // Once all the excalidraw elements are created, we can add frames since we
-  // need to calculate coordinates and dimensions of frame which is possibe after all
+  // need to calculate coordinates and dimensions of frame which is possible after all
  // frame children are processed.
  for (const [id, element] of elementsWithIds) {
    if (element.type !== "frame" && element.type !== "magicframe") {
@@ -764,10 +765,26 @@ export const convertToExcalidrawElements = (
    maxX = maxX + PADDING;
    maxY = maxY + PADDING;

-    // Take the max of calculated and provided frame dimensions, whichever is higher
-    const width = Math.max(frame?.width, maxX - minX);
-    const height = Math.max(frame?.height, maxY - minY);
-    Object.assign(frame, { x: minX, y: minY, width, height });
+    const frameX = frame?.x || minX;
+    const frameY = frame?.y || minY;
+    const frameWidth = frame?.width || maxX - minX;
+    const frameHeight = frame?.height || maxY - minY;
+
+    Object.assign(frame, {
+      x: frameX,
+      y: frameY,
+      width: frameWidth,
+      height: frameHeight,
+    });
+    if (
+      isDevEnv() &&
+      element.children.length &&
+      (frame?.x || frame?.y || frame?.width || frame?.height)
+    ) {
+      console.info(
+        "User provided frame attributes are being considered, if you find this inaccurate, please remove any of the attributes - x, y, width and height so frame coordinates and dimensions are calculated automatically",
+      );
+    }
  }

  return elementStore.getElements();
@@ -39,6 +39,7 @@ import {
  isBindingElement,
  isBoundToContainer,
  isElbowArrow,
+  isFixedPointBinding,
  isFrameLikeElement,
  isLinearElement,
  isRectangularElement,
@@ -797,7 +798,7 @@ export const bindPointToSnapToElementOutline = (
          isVertical
            ? Math.abs(p[1] - i[1]) < 0.1
            : Math.abs(p[0] - i[0]) < 0.1,
-        )[0] ?? point;
+        )[0] ?? p;
  }

  return p;
@@ -1013,7 +1014,7 @@ const updateBoundPoint = (
  const direction = startOrEnd === "startBinding" ? -1 : 1;
  const edgePointIndex = direction === -1 ? 0 : linearElement.points.length - 1;

-  if (isElbowArrow(linearElement)) {
+  if (isElbowArrow(linearElement) && isFixedPointBinding(binding)) {
    const fixedPoint =
      normalizeFixedPoint(binding.fixedPoint) ??
      calculateFixedPointForElbowArrowBinding(
@@ -35,7 +35,6 @@ export const dragSelectedElements = (
 ) => {
  if (
    _selectedElements.length === 1 &&
-    isArrowElement(_selectedElements[0]) &&
    isElbowArrow(_selectedElements[0]) &&
    (_selectedElements[0].startBinding || _selectedElements[0].endBinding)
  ) {
@@ -43,13 +42,7 @@ export const dragSelectedElements = (
  }

  const selectedElements = _selectedElements.filter(
-    (el) =>
-      !(
-        isArrowElement(el) &&
-        isElbowArrow(el) &&
-        el.startBinding &&
-        el.endBinding
-      ),
+    (el) => !(isElbowArrow(el) && el.startBinding && el.endBinding),
  );

  // we do not want a frame and its elements to be selected at the same time
@@ -45,6 +45,12 @@ const RE_GENERIC_EMBED =
 const RE_GIPHY =
  /giphy.com\/(?:clips|embed|gifs)\/[a-zA-Z0-9]*?-?([a-zA-Z0-9]+)(?:[^a-zA-Z0-9]|$)/;

+const RE_REDDIT =
+  /^(?:http(?:s)?:\/\/)?(?:www\.)?reddit\.com\/r\/([a-zA-Z0-9_]+)\/comments\/([a-zA-Z0-9_]+)\/([a-zA-Z0-9_]+)\/?(?:\?[^#\s]*)?(?:#[^\s]*)?$/;
+
+const RE_REDDIT_EMBED =
+  /^<blockquote[\s\S]*?\shref=["'](https?:\/\/(?:www\.)?reddit\.com\/[^"']*)/i;
+
 const ALLOWED_DOMAINS = new Set([
  "youtube.com",
  "youtu.be",
@@ -59,6 +65,7 @@ const ALLOWED_DOMAINS = new Set([
  "stackblitz.com",
  "val.town",
  "giphy.com",
+  "reddit.com",
 ]);

 const ALLOW_SAME_ORIGIN = new Set([
@@ -71,6 +78,7 @@ const ALLOW_SAME_ORIGIN = new Set([
  "x.com",
  "*.simplepdf.eu",
  "stackblitz.com",
+  "reddit.com",
 ]);

 export const createSrcDoc = (body: string) => {
@@ -218,6 +226,24 @@ export const getEmbedLink = (
    return ret;
  }

+  if (RE_REDDIT.test(link)) {
+    const [, page, postId, title] = link.match(RE_REDDIT)!;
+    const safeURL = sanitizeHTMLAttribute(
+      `https://reddit.com/r/${page}/comments/${postId}/${title}`,
+    );
+    const ret: IframeDataWithSandbox = {
+      type: "document",
+      srcdoc: (theme: string) =>
+        createSrcDoc(
+          `<blockquote class="reddit-embed-bq" data-embed-theme="${theme}"><a href="${safeURL}"></a><br></blockquote><script async="" src="https://embed.reddit.com/widgets.js" charset="UTF-8"></script>`,
+        ),
+      intrinsicSize: { w: 480, h: 480 },
+      sandbox: { allowSameOrigin },
+    };
+    embeddedLinkCache.set(originalLink, ret);
+    return ret;
+  }
+
  if (RE_GH_GIST.test(link)) {
    const [, user, gistId] = link.match(RE_GH_GIST)!;
    const safeURL = sanitizeHTMLAttribute(
@@ -361,6 +387,11 @@ export const maybeParseEmbedSrc = (str: string): string => {
    return twitterMatch[1];
  }

+  const redditMatch = str.match(RE_REDDIT_EMBED);
+  if (redditMatch && redditMatch.length === 2) {
+    return redditMatch[1];
+  }
+
  const gistMatch = str.match(RE_GH_GIST_EMBED);
  if (gistMatch && gistMatch.length === 2) {
    return gistMatch[1];
@@ -102,6 +102,7 @@ export class LinearElementEditor {
  public readonly endBindingElement: ExcalidrawBindableElement | null | "keep";
  public readonly hoverPointIndex: number;
  public readonly segmentMidPointHoveredCoords: GlobalPoint | null;
+  public readonly elbowed: boolean;

  constructor(element: NonDeleted<ExcalidrawLinearElement>) {
    this.elementId = element.id as string & {
@@ -131,6 +132,7 @@ export class LinearElementEditor {
    };
    this.hoverPointIndex = -1;
    this.segmentMidPointHoveredCoords = null;
+    this.elbowed = isElbowArrow(element) && element.elbowed;
  }

  // ---------------------------------------------------------------------------
@@ -1477,7 +1479,9 @@ export class LinearElementEditor {
        nextPoints,
        vector(offsetX, offsetY),
        bindings,
-        options,
+        {
+          isDragging: options?.isDragging,
+        },
      );
    } else {
      const nextCoords = getElementPointsCoords(element, nextPoints);
@@ -9,6 +9,7 @@ import type {
  ExcalidrawTextElementWithContainer,
  ExcalidrawImageElement,
  ElementsMap,
+  ExcalidrawArrowElement,
  NonDeletedSceneElementsMap,
  SceneElementsMap,
 } from "./types";
@@ -909,6 +910,8 @@ export const resizeMultipleElements = (
      fontSize?: ExcalidrawTextElement["fontSize"];
      scale?: ExcalidrawImageElement["scale"];
      boundTextFontSize?: ExcalidrawTextElement["fontSize"];
+      startBinding?: ExcalidrawArrowElement["startBinding"];
+      endBinding?: ExcalidrawArrowElement["endBinding"];
    };
  }[] = [];

@@ -993,19 +996,6 @@ export const resizeMultipleElements = (

    mutateElement(element, update, false);

-    if (isArrowElement(element) && isElbowArrow(element)) {
-      mutateElbowArrow(
-        element,
-        elementsMap,
-        element.points,
-        undefined,
-        undefined,
-        {
-          informMutation: false,
-        },
-      );
-    }
-
    updateBoundElements(element, elementsMap, {
      simultaneouslyUpdated: elementsToUpdate,
      oldSize: { width: oldWidth, height: oldHeight },
@@ -1059,7 +1049,7 @@ const rotateMultipleElements = (
        (centerAngle + origAngle - element.angle) as Radians,
      );

-      if (isArrowElement(element) && isElbowArrow(element)) {
+      if (isElbowArrow(element)) {
        const points = getArrowLocalFixedPoints(element, elementsMap);
        mutateElbowArrow(element, elementsMap, points);
      } else {
@@ -94,7 +94,16 @@ describe("elbow arrow routing", () => {

 describe("elbow arrow ui", () => {
  beforeEach(async () => {
+    localStorage.clear();
    await render(<Excalidraw handleKeyboardGlobally={true} />);
+
+    fireEvent.contextMenu(GlobalTestState.interactiveCanvas, {
+      button: 2,
+      clientX: 1,
+      clientY: 1,
+    });
+    const contextMenu = UI.queryContextMenu();
+    fireEvent.click(queryByTestId(contextMenu!, "stats")!);
  });

  it("can follow bound shapes", async () => {
@@ -130,8 +139,8 @@ describe("elbow arrow ui", () => {
    expect(arrow.elbowed).toBe(true);
    expect(arrow.points).toEqual([
      [0, 0],
-      [35, 0],
-      [35, 200],
+      [45, 0],
+      [45, 200],
      [90, 200],
    ]);
  });
@@ -163,14 +172,6 @@ describe("elbow arrow ui", () => {
      h.state,
    )[0] as ExcalidrawArrowElement;

-    fireEvent.contextMenu(GlobalTestState.interactiveCanvas, {
-      button: 2,
-      clientX: 1,
-      clientY: 1,
-    });
-    const contextMenu = UI.queryContextMenu();
-    fireEvent.click(queryByTestId(contextMenu!, "stats")!);
-
    mouse.click(51, 51);

    const inputAngle = UI.queryStatsProperty("A")?.querySelector(
@@ -182,8 +183,8 @@ describe("elbow arrow ui", () => {
      [0, 0],
      [35, 0],
      [35, 90],
-      [25, 90],
-      [25, 165],
+      [35, 90], // Note that coordinates are rounded above!
+      [35, 165],
      [103, 165],
    ]);
  });
@@ -36,11 +36,11 @@ import {
  HEADING_UP,
  vectorToHeading,
 } from "./heading";
+import type { ElementUpdate } from "./mutateElement";
 import { mutateElement } from "./mutateElement";
 import { isBindableElement, isRectanguloidElement } from "./typeChecks";
 import type {
  ExcalidrawElbowArrowElement,
-  FixedPointBinding,
  NonDeletedSceneElementsMap,
  SceneElementsMap,
 } from "./types";
@@ -72,16 +72,48 @@ export const mutateElbowArrow = (
  elementsMap: NonDeletedSceneElementsMap | SceneElementsMap,
  nextPoints: readonly LocalPoint[],
  offset?: Vector,
-  otherUpdates?: {
-    startBinding?: FixedPointBinding | null;
-    endBinding?: FixedPointBinding | null;
+  otherUpdates?: Omit<
+    ElementUpdate<ExcalidrawElbowArrowElement>,
+    "angle" | "x" | "y" | "width" | "height" | "elbowed" | "points"
+  >,
+  options?: {
+    isDragging?: boolean;
+    informMutation?: boolean;
  },
+) => {
+  const update = updateElbowArrow(
+    arrow,
+    elementsMap,
+    nextPoints,
+    offset,
+    options,
+  );
+  if (update) {
+    mutateElement(
+      arrow,
+      {
+        ...otherUpdates,
+        ...update,
+        angle: 0 as Radians,
+      },
+      options?.informMutation,
+    );
+  } else {
+    console.error("Elbow arrow cannot find a route");
+  }
+};
+
+export const updateElbowArrow = (
+  arrow: ExcalidrawElbowArrowElement,
+  elementsMap: NonDeletedSceneElementsMap | SceneElementsMap,
+  nextPoints: readonly LocalPoint[],
+  offset?: Vector,
  options?: {
    isDragging?: boolean;
    disableBinding?: boolean;
    informMutation?: boolean;
  },
-) => {
+): ElementUpdate<ExcalidrawElbowArrowElement> | null => {
  const origStartGlobalPoint: GlobalPoint = pointTranslate(
    pointTranslate<LocalPoint, GlobalPoint>(
      nextPoints[0],
@@ -235,6 +267,8 @@ export const mutateElbowArrow = (
          BASE_PADDING,
        ),
    boundsOverlap,
+    hoveredStartElement && aabbForElement(hoveredStartElement),
+    hoveredEndElement && aabbForElement(hoveredEndElement),
  );
  const startDonglePosition = getDonglePosition(
    dynamicAABBs[0],
@@ -295,18 +329,10 @@ export const mutateElbowArrow = (
    startDongle && points.unshift(startGlobalPoint);
    endDongle && points.push(endGlobalPoint);

-    mutateElement(
-      arrow,
-      {
-        ...otherUpdates,
-        ...normalizedArrowElementUpdate(simplifyElbowArrowPoints(points), 0, 0),
-        angle: 0 as Radians,
-      },
-      options?.informMutation,
-    );
-  } else {
-    console.error("Elbow arrow cannot find a route");
+    return normalizedArrowElementUpdate(simplifyElbowArrowPoints(points), 0, 0);
  }
+
+  return null;
 };

 const offsetFromHeading = (
@@ -475,7 +501,11 @@ const generateDynamicAABBs = (
  startDifference?: [number, number, number, number],
  endDifference?: [number, number, number, number],
  disableSideHack?: boolean,
+  startElementBounds?: Bounds | null,
+  endElementBounds?: Bounds | null,
 ): Bounds[] => {
+  const startEl = startElementBounds ?? a;
+  const endEl = endElementBounds ?? b;
  const [startUp, startRight, startDown, startLeft] = startDifference ?? [
    0, 0, 0, 0,
  ];
@@ -484,29 +514,29 @@ const generateDynamicAABBs = (
  const first = [
    a[0] > b[2]
      ? a[1] > b[3] || a[3] < b[1]
-        ? Math.min((a[0] + b[2]) / 2, a[0] - startLeft)
-        : (a[0] + b[2]) / 2
+        ? Math.min((startEl[0] + endEl[2]) / 2, a[0] - startLeft)
+        : (startEl[0] + endEl[2]) / 2
      : a[0] > b[0]
      ? a[0] - startLeft
      : common[0] - startLeft,
    a[1] > b[3]
      ? a[0] > b[2] || a[2] < b[0]
-        ? Math.min((a[1] + b[3]) / 2, a[1] - startUp)
-        : (a[1] + b[3]) / 2
+        ? Math.min((startEl[1] + endEl[3]) / 2, a[1] - startUp)
+        : (startEl[1] + endEl[3]) / 2
      : a[1] > b[1]
      ? a[1] - startUp
      : common[1] - startUp,
    a[2] < b[0]
      ? a[1] > b[3] || a[3] < b[1]
-        ? Math.max((a[2] + b[0]) / 2, a[2] + startRight)
-        : (a[2] + b[0]) / 2
+        ? Math.max((startEl[2] + endEl[0]) / 2, a[2] + startRight)
+        : (startEl[2] + endEl[0]) / 2
      : a[2] < b[2]
      ? a[2] + startRight
      : common[2] + startRight,
    a[3] < b[1]
      ? a[0] > b[2] || a[2] < b[0]
-        ? Math.max((a[3] + b[1]) / 2, a[3] + startDown)
-        : (a[3] + b[1]) / 2
+        ? Math.max((startEl[3] + endEl[1]) / 2, a[3] + startDown)
+        : (startEl[3] + endEl[1]) / 2
      : a[3] < b[3]
      ? a[3] + startDown
      : common[3] + startDown,
@@ -514,29 +544,29 @@ const generateDynamicAABBs = (
  const second = [
    b[0] > a[2]
      ? b[1] > a[3] || b[3] < a[1]
-        ? Math.min((b[0] + a[2]) / 2, b[0] - endLeft)
-        : (b[0] + a[2]) / 2
+        ? Math.min((endEl[0] + startEl[2]) / 2, b[0] - endLeft)
+        : (endEl[0] + startEl[2]) / 2
      : b[0] > a[0]
      ? b[0] - endLeft
      : common[0] - endLeft,
    b[1] > a[3]
      ? b[0] > a[2] || b[2] < a[0]
-        ? Math.min((b[1] + a[3]) / 2, b[1] - endUp)
-        : (b[1] + a[3]) / 2
+        ? Math.min((endEl[1] + startEl[3]) / 2, b[1] - endUp)
+        : (endEl[1] + startEl[3]) / 2
      : b[1] > a[1]
      ? b[1] - endUp
      : common[1] - endUp,
    b[2] < a[0]
      ? b[1] > a[3] || b[3] < a[1]
-        ? Math.max((b[2] + a[0]) / 2, b[2] + endRight)
-        : (b[2] + a[0]) / 2
+        ? Math.max((endEl[2] + startEl[0]) / 2, b[2] + endRight)
+        : (endEl[2] + startEl[0]) / 2
      : b[2] < a[2]
      ? b[2] + endRight
      : common[2] + endRight,
    b[3] < a[1]
      ? b[0] > a[2] || b[2] < a[0]
-        ? Math.max((b[3] + a[1]) / 2, b[3] + endDown)
-        : (b[3] + a[1]) / 2
+        ? Math.max((endEl[3] + startEl[1]) / 2, b[3] + endDown)
+        : (endEl[3] + startEl[1]) / 2
      : b[3] < a[3]
      ? b[3] + endDown
      : common[3] + endDown,
@@ -247,7 +247,7 @@ export const textWysiwyg = ({

      // adding left and right padding buffer, so that browser does not cut the glyphs (does not work in Safari)
      const padding = !isSafari
-        ? Math.ceil(updatedTextElement.fontSize / 2)
+        ? Math.ceil(updatedTextElement.fontSize / appState.zoom.value / 2)
        : 0;

      // Make sure text editor height doesn't go beyond viewport
@@ -320,9 +320,12 @@ export const getDefaultRoundnessTypeForElement = (
 };

 export const isFixedPointBinding = (
-  binding: PointBinding,
+  binding: PointBinding | FixedPointBinding,
 ): binding is FixedPointBinding => {
-  return binding.fixedPoint != null;
+  return (
+    Object.hasOwn(binding, "fixedPoint") &&
+    (binding as FixedPointBinding).fixedPoint != null
+  );
 };

 // TODO: Move this to @excalidraw/math
@@ -193,6 +193,7 @@ export type ExcalidrawElement =
  | ExcalidrawGenericElement
  | ExcalidrawTextElement
  | ExcalidrawLinearElement
+  | ExcalidrawArrowElement
  | ExcalidrawFreeDrawElement
  | ExcalidrawImageElement
  | ExcalidrawFrameElement
@@ -268,15 +269,19 @@ export type PointBinding = {
  elementId: ExcalidrawBindableElement["id"];
  focus: number;
  gap: number;
-  // Represents the fixed point binding information in form of a vertical and
-  // horizontal ratio (i.e. a percentage value in the 0.0-1.0 range). This ratio
-  // gives the user selected fixed point by multiplying the bound element width
-  // with fixedPoint[0] and the bound element height with fixedPoint[1] to get the
-  // bound element-local point coordinate.
-  fixedPoint: FixedPoint | null;
 };

-export type FixedPointBinding = Merge<PointBinding, { fixedPoint: FixedPoint }>;
+export type FixedPointBinding = Merge<
+  PointBinding,
+  {
+    // Represents the fixed point binding information in form of a vertical and
+    // horizontal ratio (i.e. a percentage value in the 0.0-1.0 range). This ratio
+    // gives the user selected fixed point by multiplying the bound element width
+    // with fixedPoint[0] and the bound element height with fixedPoint[1] to get the
+    // bound element-local point coordinate.
+    fixedPoint: FixedPoint;
+  }
+>;

 export type Arrowhead =
  | "arrow"
@@ -1,4 +1,8 @@
-import { stringToBase64, toByteString } from "../data/encode";
+import {
+  base64ToArrayBuffer,
+  stringToBase64,
+  toByteString,
+} from "../data/encode";
 import { LOCAL_FONT_PROTOCOL } from "./metadata";
 import loadWoff2 from "./wasm/woff2.loader";
 import loadHbSubset from "./wasm/hb-subset.loader";
@@ -49,10 +53,7 @@ export class ExcalidrawFont implements Font {

      // it's dataurl (server), the font is inlined as base64, no need to fetch
      if (url.protocol === "data:") {
-        const arrayBuffer = Buffer.from(
-          url.toString().split(",")[1],
-          "base64",
-        ).buffer;
+        const arrayBuffer = base64ToArrayBuffer(url.toString().split(",")[1]);

        const base64 = await ExcalidrawFont.subsetGlyphsByCodePoints(
          arrayBuffer,
@@ -24,14 +24,14 @@ import Cascadia from "./assets/CascadiaCode-Regular.woff2";
 import ComicShanns from "./assets/ComicShanns-Regular.woff2";
 import LiberationSans from "./assets/LiberationSans-Regular.woff2";

-import LilitaLatin from "https://fonts.gstatic.com/s/lilitaone/v15/i7dPIFZ9Zz-WBtRtedDbYEF8RXi4EwQ.woff2";
-import LilitaLatinExt from "https://fonts.gstatic.com/s/lilitaone/v15/i7dPIFZ9Zz-WBtRtedDbYE98RXi4EwSsbg.woff2";
+import LilitaLatin from "./assets/Lilita-Regular-i7dPIFZ9Zz-WBtRtedDbYEF8RXi4EwQ.woff2";
+import LilitaLatinExt from "./assets/Lilita-Regular-i7dPIFZ9Zz-WBtRtedDbYE98RXi4EwSsbg.woff2";

-import NunitoLatin from "https://fonts.gstatic.com/s/nunito/v26/XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTQ3j6zbXWjgeg.woff2";
-import NunitoLatinExt from "https://fonts.gstatic.com/s/nunito/v26/XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTo3j6zbXWjgevT5.woff2";
-import NunitoCyrilic from "https://fonts.gstatic.com/s/nunito/v26/XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTA3j6zbXWjgevT5.woff2";
-import NunitoCyrilicExt from "https://fonts.gstatic.com/s/nunito/v26/XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTk3j6zbXWjgevT5.woff2";
-import NunitoVietnamese from "https://fonts.gstatic.com/s/nunito/v26/XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTs3j6zbXWjgevT5.woff2";
+import NunitoLatin from "./assets/Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTQ3j6zbXWjgeg.woff2";
+import NunitoLatinExt from "./assets/Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTo3j6zbXWjgevT5.woff2";
+import NunitoCyrilic from "./assets/Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTA3j6zbXWjgevT5.woff2";
+import NunitoCyrilicExt from "./assets/Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTk3j6zbXWjgevT5.woff2";
+import NunitoVietnamese from "./assets/Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTs3j6zbXWjgevT5.woff2";

 export class Fonts {
  // it's ok to track fonts across multiple instances only once, so let's use
@@ -52,7 +52,6 @@ import {
 } from "./helpers";
 import oc from "open-color";
 import {
-  isArrowElement,
  isElbowArrow,
  isFrameLikeElement,
  isLinearElement,
@@ -807,7 +806,6 @@ const _renderInteractiveScene = ({
            // Elbow arrow elements cannot be selected when bound on either end
            (
              isSingleLinearElementSelected &&
-              isArrowElement(element) &&
              isElbowArrow(element) &&
              (element.startBinding || element.endBinding)
            )
@@ -421,6 +421,7 @@ const renderElementToSvg = (
          image.setAttribute("width", "100%");
          image.setAttribute("height", "100%");
          image.setAttribute("href", fileData.dataURL);
+          image.setAttribute("preserveAspectRatio", "none");

          symbol.appendChild(image);

@@ -185,6 +185,11 @@ export const exportToCanvas = async (
    exportingFrame ?? null,
    appState.frameRendering ?? null,
  );
+  // for canvas export, don't clip if exporting a specific frame as it would
+  // clip the corners of the content
+  if (exportingFrame) {
+    frameRendering.clip = false;
+  }

  const elementsForRender = prepareElementsForRender({
    elements,
@@ -351,6 +356,11 @@ export const exportToSvg = async (
    }) rotate(${frame.angle} ${cx} ${cy})"
          width="${frame.width}"
          height="${frame.height}"
+          ${
+            exportingFrame
+              ? ""
+              : `rx=${FRAME_STYLE.radius} ry=${FRAME_STYLE.radius}`
+          }
          >
          </rect>
        </clipPath>`;
@@ -8430,6 +8430,7 @@ exports[`regression tests > key 5 selects arrow tool > [end of test] appState 1`
  "selectedElementsAreBeingDragged": false,
  "selectedGroupIds": {},
  "selectedLinearElement": LinearElementEditor {
+    "elbowed": false,
    "elementId": "id0",
    "endBindingElement": "keep",
    "hoverPointIndex": -1,
@@ -8649,6 +8650,7 @@ exports[`regression tests > key 6 selects line tool > [end of test] appState 1`]
  "selectedElementsAreBeingDragged": false,
  "selectedGroupIds": {},
  "selectedLinearElement": LinearElementEditor {
+    "elbowed": false,
    "elementId": "id0",
    "endBindingElement": "keep",
    "hoverPointIndex": -1,
@@ -9058,6 +9060,7 @@ exports[`regression tests > key a selects arrow tool > [end of test] appState 1`
  "selectedElementsAreBeingDragged": false,
  "selectedGroupIds": {},
  "selectedLinearElement": LinearElementEditor {
+    "elbowed": false,
    "elementId": "id0",
    "endBindingElement": "keep",
    "hoverPointIndex": -1,
@@ -9454,6 +9457,7 @@ exports[`regression tests > key l selects line tool > [end of test] appState 1`]
  "selectedElementsAreBeingDragged": false,
  "selectedGroupIds": {},
  "selectedLinearElement": LinearElementEditor {
+    "elbowed": false,
    "elementId": "id0",
    "endBindingElement": "keep",
    "hoverPointIndex": -1,
@@ -9,6 +9,8 @@ import type {
  ExcalidrawFrameElement,
  ExcalidrawElementType,
  ExcalidrawMagicFrameElement,
+  ExcalidrawElbowArrowElement,
+  ExcalidrawArrowElement,
 } from "../../element/types";
 import { newElement, newTextElement, newLinearElement } from "../../element";
 import { DEFAULT_VERTICAL_ALIGN, ROUNDNESS } from "../../constants";
@@ -127,6 +129,10 @@ export class API {
    expect(API.getSelectedElements().length).toBe(0);
  };

+  static getElement = <T extends ExcalidrawElement>(element: T): T => {
+    return h.app.scene.getElementsMapIncludingDeleted().get(element.id) as T || element;
+  }
+
  static createElement = <
    T extends Exclude<ExcalidrawElementType, "selection"> = "rectangle",
  >({
@@ -179,10 +185,16 @@ export class API {
    scale?: T extends "image" ? ExcalidrawImageElement["scale"] : never;
    status?: T extends "image" ? ExcalidrawImageElement["status"] : never;
    startBinding?: T extends "arrow"
-      ? ExcalidrawLinearElement["startBinding"]
+      ? ExcalidrawArrowElement["startBinding"] | ExcalidrawElbowArrowElement["startBinding"]
      : never;
    endBinding?: T extends "arrow"
-      ? ExcalidrawLinearElement["endBinding"]
+      ? ExcalidrawArrowElement["endBinding"] | ExcalidrawElbowArrowElement["endBinding"]
+      : never;
+    startArrowhead?: T extends "arrow"
+      ? ExcalidrawArrowElement["startArrowhead"] | ExcalidrawElbowArrowElement["startArrowhead"]
+      : never;
+    endArrowhead?: T extends "arrow"
+      ? ExcalidrawArrowElement["endArrowhead"] | ExcalidrawElbowArrowElement["endArrowhead"]
      : never;
    elbowed?: boolean;
  }): T extends "arrow" | "line"
@@ -340,6 +352,8 @@ export class API {
    if (element.type === "arrow") {
      element.startBinding = rest.startBinding ?? null;
      element.endBinding = rest.endBinding ?? null;
+      element.startArrowhead = rest.startArrowhead ?? null;
+      element.endArrowhead = rest.endArrowhead ?? null;
    }
    if (id) {
      element.id = id;
@@ -31,6 +31,7 @@ import type {
  ExcalidrawGenericElement,
  ExcalidrawLinearElement,
  ExcalidrawTextElement,
+  FixedPointBinding,
  FractionalIndex,
  SceneElementsMap,
 } from "../element/types";
@@ -2049,13 +2050,13 @@ describe("history", () => {
              focus: -0.001587301587301948,
              gap: 5,
              fixedPoint: [1.0318471337579618, 0.49920634920634904],
-            },
+            } as FixedPointBinding,
            endBinding: {
              elementId: "u2JGnnmoJ0VATV4vCNJE5",
              focus: -0.0016129032258049847,
              gap: 3.537079145500037,
              fixedPoint: [0.4991935483870975, -0.03875193720914723],
-            },
+            } as FixedPointBinding,
          },
        ],
        storeAction: StoreAction.CAPTURE,
@@ -4455,7 +4456,7 @@ describe("history", () => {
          elements: [
            h.elements[0],
            newElementWith(h.elements[1], { boundElements: [] }),
-            newElementWith(h.elements[2] as ExcalidrawLinearElement, {
+            newElementWith(h.elements[2] as ExcalidrawElbowArrowElement, {
              endBinding: {
                elementId: remoteContainer.id,
                gap: 1,
@@ -4655,7 +4656,7 @@ describe("history", () => {
        // Simulate remote update
        API.updateScene({
          elements: [
-            newElementWith(h.elements[0] as ExcalidrawLinearElement, {
+            newElementWith(h.elements[0] as ExcalidrawElbowArrowElement, {
              startBinding: {
                elementId: rect1.id,
                gap: 1,
@@ -4,6 +4,7 @@ import { render } from "./test-utils";
 import { reseed } from "../random";
 import { UI, Keyboard, Pointer } from "./helpers/ui";
 import type {
+  ExcalidrawElbowArrowElement,
  ExcalidrawFreeDrawElement,
  ExcalidrawLinearElement,
 } from "../element/types";
@@ -333,6 +334,62 @@ describe("arrow element", () => {
    expect(label.angle).toBeCloseTo(0);
    expect(label.fontSize).toEqual(20);
  });
+
+  it("flips the fixed point binding on negative resize for single bindable", () => {
+    const rectangle = UI.createElement("rectangle", {
+      x: -100,
+      y: -75,
+      width: 95,
+      height: 100,
+    });
+    UI.clickTool("arrow");
+    UI.clickOnTestId("elbow-arrow");
+    mouse.reset();
+    mouse.moveTo(-5, 0);
+    mouse.click();
+    mouse.moveTo(120, 200);
+    mouse.click();
+
+    const arrow = h.scene.getSelectedElements(
+      h.state,
+    )[0] as ExcalidrawElbowArrowElement;
+
+    expect(arrow.startBinding?.fixedPoint?.[0]).toBeCloseTo(1.05);
+    expect(arrow.startBinding?.fixedPoint?.[1]).toBeCloseTo(0.75);
+
+    UI.resize(rectangle, "se", [-200, -150]);
+
+    expect(arrow.startBinding?.fixedPoint?.[0]).toBeCloseTo(1.05);
+    expect(arrow.startBinding?.fixedPoint?.[1]).toBeCloseTo(0.75);
+  });
+
+  it("flips the fixed point binding on negative resize for group selection", () => {
+    const rectangle = UI.createElement("rectangle", {
+      x: -100,
+      y: -75,
+      width: 95,
+      height: 100,
+    });
+    UI.clickTool("arrow");
+    UI.clickOnTestId("elbow-arrow");
+    mouse.reset();
+    mouse.moveTo(-5, 0);
+    mouse.click();
+    mouse.moveTo(120, 200);
+    mouse.click();
+
+    const arrow = h.scene.getSelectedElements(
+      h.state,
+    )[0] as ExcalidrawElbowArrowElement;
+
+    expect(arrow.startBinding?.fixedPoint?.[0]).toBeCloseTo(1.05);
+    expect(arrow.startBinding?.fixedPoint?.[1]).toBeCloseTo(0.75);
+
+    UI.resize([rectangle, arrow], "nw", [300, 350]);
+
+    expect(arrow.startBinding?.fixedPoint?.[0]).toBeCloseTo(-0.144, 2);
+    expect(arrow.startBinding?.fixedPoint?.[1]).toBeCloseTo(0.25);
+  });
 });

 describe("text element", () => {
@@ -828,7 +885,6 @@ describe("multiple selection", () => {
    expect(leftBoundArrow.endBinding?.elementId).toBe(
      leftArrowBinding.elementId,
    );
-    expect(leftBoundArrow.endBinding?.fixedPoint).toBeNull();
    expect(leftBoundArrow.endBinding?.focus).toBe(leftArrowBinding.focus);

    expect(rightBoundArrow.x).toBeCloseTo(210);
@@ -843,7 +899,6 @@ describe("multiple selection", () => {
    expect(rightBoundArrow.endBinding?.elementId).toBe(
      rightArrowBinding.elementId,
    );
-    expect(rightBoundArrow.endBinding?.fixedPoint).toBeNull();
    expect(rightBoundArrow.endBinding?.focus).toBe(rightArrowBinding.focus);
  });

@@ -110,8 +110,8 @@ export const debugDrawBoundingBox = (
 export const debugDrawBounds = (
  box: Bounds | Bounds[],
  opts?: {
-    color: string;
-    permanent: boolean;
+    color?: string;
+    permanent?: boolean;
  },
 ) => {
  (isBounds(box) ? [box] : box).forEach((bbox) =>
@@ -136,7 +136,7 @@ export const debugDrawBounds = (
      ],
      {
        color: opts?.color ?? "green",
-        permanent: opts?.permanent,
+        permanent: !!opts?.permanent,
      },
    ),
  );
@@ -68,7 +68,6 @@
    "css-loader": "6.7.1",
    "file-loader": "6.2.0",
    "fonteditor-core": "2.4.0",
-    "node-fetch": "3.3.2",
    "sass-loader": "13.0.2",
    "ts-loader": "9.3.1",
    "typescript": "4.9.4",
@@ -1,7 +1,6 @@
 const { build } = require("esbuild");
 const { sassPlugin } = require("esbuild-sass-plugin");
 const { externalGlobalPlugin } = require("esbuild-plugin-external-global");
-const { woff2BrowserPlugin } = require("./woff2/woff2-esbuild-plugins");

 // Will be used later for treeshaking
 //const fs = require("fs");
@@ -45,13 +44,15 @@ const browserConfig = {
  format: "esm",
  plugins: [
    sassPlugin(),
-    woff2BrowserPlugin(),
    externalGlobalPlugin({
      react: "React",
      "react-dom": "ReactDOM",
    }),
  ],
  splitting: true,
+  loader: {
+    ".woff2": "file",
+  },
 };
 const createESMBrowserBuild = async () => {
  // Development unminified build with source maps
@@ -100,9 +101,10 @@ const rawConfig = {
  entryPoints: ["index.tsx"],
  bundle: true,
  format: "esm",
-  plugins: [sassPlugin(), woff2BrowserPlugin()],
+  plugins: [sassPlugin()],
  loader: {
    ".json": "copy",
+    ".woff2": "file",
  },
  packages: "external",
 };
@@ -1,17 +1,17 @@
 const fs = require("fs");
 const { build } = require("esbuild");
 const { sassPlugin } = require("esbuild-sass-plugin");
-const {
-  woff2BrowserPlugin,
-  woff2ServerPlugin,
-} = require("./woff2/woff2-esbuild-plugins");
+const { woff2ServerPlugin } = require("./woff2/woff2-esbuild-plugins");

 const browserConfig = {
  entryPoints: ["index.ts"],
  bundle: true,
  format: "esm",
-  plugins: [sassPlugin(), woff2BrowserPlugin()],
+  plugins: [sassPlugin()],
  assetNames: "assets/[name]",
+  loader: {
+    ".woff2": "file",
+  },
 };

 // Will be used later for treeshaking
@@ -2,45 +2,9 @@ const fs = require("fs");
 const path = require("path");
 const { execSync } = require("child_process");
 const which = require("which");
-const fetch = require("node-fetch");
 const wawoff = require("wawoff2");
 const { Font } = require("fonteditor-core");

-/**
- * Custom esbuild plugin to convert url woff2 imports into a text.
- * Other woff2 imports are handled by a "file" loader.
- *
- * @returns {import("esbuild").Plugin}
- */
-module.exports.woff2BrowserPlugin = () => {
-  return {
-    name: "woff2BrowserPlugin",
-    setup(build) {
-      build.initialOptions.loader = {
-        ".woff2": "file",
-        ...build.initialOptions.loader,
-      };
-
-      build.onResolve({ filter: /^https:\/\/.+?\.woff2$/ }, (args) => {
-        return {
-          path: args.path,
-          namespace: "woff2BrowserPlugin",
-        };
-      });
-
-      build.onLoad(
-        { filter: /.*/, namespace: "woff2BrowserPlugin" },
-        async (args) => {
-          return {
-            contents: args.path,
-            loader: "text",
-          };
-        },
-      );
-    },
-  };
-};
-
 /**
 * Custom esbuild plugin to:
 * 1. inline all woff2 (url and relative imports) as base64 for server-side use cases (no need for additional font fetch; works in both esm and commonjs)
@@ -53,27 +17,6 @@ module.exports.woff2BrowserPlugin = () => {
 * @returns {import("esbuild").Plugin}
 */
 module.exports.woff2ServerPlugin = (options = {}) => {
-  // google CDN fails time to time, so let's retry
-  async function fetchRetry(url, options = {}, retries = 0, delay = 1000) {
-    try {
-      const response = await fetch(url, options);
-
-      if (!response.ok) {
-        throw new Error(`Status: ${response.status}, ${await response.json()}`);
-      }
-
-      return response;
-    } catch (e) {
-      if (retries > 0) {
-        await new Promise((resolve) => setTimeout(resolve, delay));
-        return fetchRetry(url, options, retries - 1, delay * 2);
-      }
-
-      console.error(`Couldn't fetch: ${url}, error: ${e.message}`);
-      throw e;
-    }
-  }
-
  return {
    name: "woff2ServerPlugin",
    setup(build) {
@@ -82,9 +25,7 @@ module.exports.woff2ServerPlugin = (options = {}) => {
      const fonts = new Map();

      build.onResolve({ filter: /\.woff2$/ }, (args) => {
-        const resolvedPath = args.path.startsWith("http")
-          ? args.path // url
-          : path.resolve(args.resolveDir, args.path); // absolute path
+        const resolvedPath = path.resolve(args.resolveDir, args.path);

        return {
          path: resolvedPath,
@@ -101,9 +42,7 @@ module.exports.woff2ServerPlugin = (options = {}) => {
            // read local woff2 as a buffer (WARN: `readFileSync` does not work!)
            woff2Buffer = await fs.promises.readFile(args.path);
          } else {
-            // fetch remote woff2 as a buffer (i.e. from a cdn)
-            const response = await fetchRetry(args.path, {}, 3);
-            woff2Buffer = await response.buffer();
+            throw new Error(`Font path has to be absolute! "${args.path}"`);
          }

          // google's brotli decompression into snft
@@ -1,15 +1,13 @@
+// `EXCALIDRAW_ASSET_PATH` as a SSOT
 const OSS_FONTS_CDN =
  "https://excalidraw.nyc3.cdn.digitaloceanspaces.com/fonts/oss/";

 /**
- * Custom vite plugin to convert url woff2 imports into a text.
- * Other woff2 imports are automatically served and resolved as a file uri.
+ * Custom vite plugin for auto-prefixing `EXCALIDRAW_ASSET_PATH` woff2 fonts in `excalidraw-app`.
 *
 * @returns {import("vite").PluginOption}
 */
 module.exports.woff2BrowserPlugin = () => {
-  // for now limited to woff2 only, might be extended to any assets in the future
-  const regex = /^https:\/\/.+?\.woff2$/;
  let isDev;

  return {
@@ -18,34 +16,9 @@ module.exports.woff2BrowserPlugin = () => {
    config(_, { command }) {
      isDev = command === "serve";
    },
-    resolveId(source) {
-      if (!regex.test(source)) {
-        return null;
-      }
-
-      // getting the url to the dependency tree
-      return source;
-    },
-    load(id) {
-      if (!regex.test(id)) {
-        return null;
-      }
-
-      // loading the url as string
-      return `export default "${id}"`;
-    },
-    // necessary for dev as vite / rollup does skips https imports in serve (~dev) mode
-    // aka dev mode equivalent of "export default x" above (resolveId + load)
    transform(code, id) {
-      // treat https woff2 imports as a text
-      if (isDev && id.endsWith("/excalidraw/fonts/index.ts")) {
-        return code.replaceAll(
-          /import\s+(\w+)\s+from\s+(["']https:\/\/.+?\.woff2["'])/g,
-          `const $1 = $2`,
-        );
-      }
-
-      // use CDN for Assistant
+      // using copy / replace as fonts defined in the `.css` don't have to be manually copied over (vite/rollup does this automatically),
+      // but at the same time can't be easily prefixed with the `EXCALIDRAW_ASSET_PATH` only for the `excalidraw-app`
      if (!isDev && id.endsWith("/excalidraw/fonts/assets/fonts.css")) {
        return `/* WARN: The following content is generated during excalidraw-app build */

@@ -90,7 +63,6 @@ module.exports.woff2BrowserPlugin = () => {
      }`;
      }

-      // using EXCALIDRAW_ASSET_PATH as a SSOT
      if (!isDev && id.endsWith("excalidraw-app/index.html")) {
        return code.replace(
          "<!-- PLACEHOLDER:EXCALIDRAW_APP_FONTS -->",
@@ -110,9 +82,10 @@ module.exports.woff2BrowserPlugin = () => {
        type="font/woff2"
        crossorigin="anonymous"
      />
+      <!-- For Nunito only preload the latin range, which should be good enough for now -->
      <link
        rel="preload"
-        href="${OSS_FONTS_CDN}Virgil-Regular-hO16qHwV.woff2"
+        href="${OSS_FONTS_CDN}Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTQ3j6zbXWjgeg-DqUjjPte.woff2"
        as="font"
        type="font/woff2"
        crossorigin="anonymous"
@@ -124,6 +97,13 @@ module.exports.woff2BrowserPlugin = () => {
        type="font/woff2"
        crossorigin="anonymous"
      />
+      <link
+        rel="preload"
+        href="${OSS_FONTS_CDN}Virgil-Regular-hO16qHwV.woff2"
+        as="font"
+        type="font/woff2"
+        crossorigin="anonymous"
+      />
    `,
        );
      }
@@ -1,9 +1,7 @@
 import { defineConfig } from "vitest/config";
-import { woff2BrowserPlugin } from "./scripts/woff2/woff2-vite-plugins";

 export default defineConfig({
  //@ts-ignore
-  plugins: [woff2BrowserPlugin()],
  test: {
    // Since hooks are running in stack in v2, which means all hooks run serially whereas
    // we need to run them in parallel
@@ -19,10 +17,10 @@ export default defineConfig({
      // Additionally the thresholds also needs to be updated slightly as a result of this change
      ignoreEmptyLines: false,
      thresholds: {
-        lines: 66,
+        lines: 60,
        branches: 70,
        functions: 63,
-        statements: 66,
+        statements: 60,
      },
    },
  },
@@ -5194,11 +5194,6 @@ damerau-levenshtein@^1.0.8:
  resolved "https://registry.yarnpkg.com/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz#b43d286ccbd36bc5b2f7ed41caf2d0aba1f8a6e7"
  integrity sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA==

-data-uri-to-buffer@^4.0.0:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/data-uri-to-buffer/-/data-uri-to-buffer-4.0.1.tgz#d8feb2b2881e6a4f58c2e08acfd0e2834e26222e"
-  integrity sha512-0R9ikRb668HB7QDxT1vkpuUBtqc53YyAwMwGeUFKRojY/NWKvdZ+9UYtRfGmhqNbRkTSVpMbmyhXipFFv2cb/A==
-
 data-urls@^4.0.0:
  version "4.0.0"
  resolved "https://registry.yarnpkg.com/data-urls/-/data-urls-4.0.0.tgz#333a454eca6f9a5b7b0f1013ff89074c3f522dd4"
@@ -6262,14 +6257,6 @@ fd-slicer@~1.1.0:
  dependencies:
    pend "~1.2.0"

-fetch-blob@^3.1.2, fetch-blob@^3.1.4:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/fetch-blob/-/fetch-blob-3.2.0.tgz#f09b8d4bbd45adc6f0c20b7e787e793e309dcce9"
-  integrity sha512-7yAQpD2UMJzLi1Dqv7qFYnPbaPx7ZfFK6PiIxQ4PfkGPyNyl2Ugx+a/umUonmKqjhM4DnfbMvdX6otXq83soQQ==
-  dependencies:
-    node-domexception "^1.0.0"
-    web-streams-polyfill "^3.0.3"
-
 fflate@^0.8.2:
  version "0.8.2"
  resolved "https://registry.yarnpkg.com/fflate/-/fflate-0.8.2.tgz#fc8631f5347812ad6028bbe4a2308b2792aa1dea"
@@ -6408,13 +6395,6 @@ form-data@^4.0.0:
    combined-stream "^1.0.8"
    mime-types "^2.1.12"

-formdata-polyfill@^4.0.10:
-  version "4.0.10"
-  resolved "https://registry.yarnpkg.com/formdata-polyfill/-/formdata-polyfill-4.0.10.tgz#24807c31c9d402e002ab3d8c720144ceb8848423"
-  integrity sha512-buewHzMvYL29jdeQTVILecSaZKnt/RJWjoZCF5OW60Z67/GmSLBkOFM7qh1PI3zFNtJbaZL5eQu1vLfazOwj4g==
-  dependencies:
-    fetch-blob "^3.1.2"
-
 fraction.js@^4.2.0:
  version "4.3.7"
  resolved "https://registry.yarnpkg.com/fraction.js/-/fraction.js-4.3.7.tgz#06ca0085157e42fda7f9e726e79fefc4068840f7"
@@ -8256,11 +8236,6 @@ no-case@^3.0.4:
    lower-case "^2.0.2"
    tslib "^2.0.3"

-node-domexception@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/node-domexception/-/node-domexception-1.0.0.tgz#6888db46a1f71c0b76b3f7555016b63fe64766e5"
-  integrity sha512-/jKZoMpw0F8GRwl4/eLROPA3cfcXtLApP0QzLmUT/HuPCZWyB7IY9ZrMeKw2O/nFIqPQB3PVM9aYm0F312AXDQ==
-
 node-fetch@2.6.1:
  version "2.6.1"
  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.1.tgz#045bd323631f76ed2e2b55573394416b639a0052"
@@ -8273,15 +8248,6 @@ node-fetch@2.6.7:
  dependencies:
    whatwg-url "^5.0.0"

-node-fetch@3.3.2:
-  version "3.3.2"
-  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-3.3.2.tgz#d1e889bacdf733b4ff3b2b243eb7a12866a0b78b"
-  integrity sha512-dRB78srN/l6gqWulah9SrxeYnxeddIG30+GOqK/9OlLVyLg3HPnr6SqOWTWOXKRwC2eGYCkZ59NNuSgvSrpgOA==
-  dependencies:
-    data-uri-to-buffer "^4.0.0"
-    fetch-blob "^3.1.4"
-    formdata-polyfill "^4.0.10"
-
 node-html-parser@^5.3.3:
  version "5.4.2"
  resolved "https://registry.yarnpkg.com/node-html-parser/-/node-html-parser-5.4.2.tgz#93e004038c17af80226c942336990a0eaed8136a"
@@ -9667,7 +9633,7 @@ string-natural-compare@^3.0.1:
  resolved "https://registry.yarnpkg.com/string-natural-compare/-/string-natural-compare-3.0.1.tgz#7a42d58474454963759e8e8b7ae63d71c1e7fdf4"
  integrity sha512-n3sPwynL1nwKi3WJ6AIsClwBMa0zTi54fn2oLU6ndfTSIO05xaznjSf15PcBZU6FNWbmN5Q6cxT4V5hGvB4taw==

-"string-width-cjs@npm:string-width@^4.2.0":
+"string-width-cjs@npm:string-width@^4.2.0", string-width@^4.2.3:
  version "4.2.3"
  resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
  integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
@@ -9685,15 +9651,6 @@ string-width@^4.1.0, string-width@^4.2.0:
    is-fullwidth-code-point "^3.0.0"
    strip-ansi "^6.0.0"

-string-width@^4.2.3:
-  version "4.2.3"
-  resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
-  integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
-  dependencies:
-    emoji-regex "^8.0.0"
-    is-fullwidth-code-point "^3.0.0"
-    strip-ansi "^6.0.1"
-
 string-width@^5.0.0, string-width@^5.0.1, string-width@^5.1.2:
  version "5.1.2"
  resolved "https://registry.yarnpkg.com/string-width/-/string-width-5.1.2.tgz#14f8daec6d81e7221d2a357e668cab73bdbca794"
@@ -9765,14 +9722,7 @@ stringify-object@^3.3.0:
    is-obj "^1.0.1"
    is-regexp "^1.0.0"

-"strip-ansi-cjs@npm:strip-ansi@^6.0.1":
-  version "6.0.1"
-  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
-  integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
-  dependencies:
-    ansi-regex "^5.0.1"
-
-strip-ansi@6.0.1, strip-ansi@^3.0.0, strip-ansi@^6.0.0, strip-ansi@^6.0.1, strip-ansi@^7.0.1:
+"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@6.0.1, strip-ansi@^3.0.0, strip-ansi@^6.0.0, strip-ansi@^6.0.1, strip-ansi@^7.0.1:
  version "6.0.1"
  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
  integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
@@ -10562,11 +10512,6 @@ wawoff2@2.0.1:
  dependencies:
    argparse "^2.0.1"

-web-streams-polyfill@^3.0.3:
-  version "3.3.3"
-  resolved "https://registry.yarnpkg.com/web-streams-polyfill/-/web-streams-polyfill-3.3.3.tgz#2073b91a2fdb1fbfbd401e7de0ac9f8214cecb4b"
-  integrity sha512-d2JWLCivmZYTSIoge9MsgFCZrt571BikcWGYkjC1khllbTeDlGqZ2D8vD8E/lJa8WGWbb7Plm8/XJYV7IJHZZw==
-
 web-worker@^1.2.0:
  version "1.3.0"
  resolved "https://registry.yarnpkg.com/web-worker/-/web-worker-1.3.0.tgz#e5f2df5c7fe356755a5fb8f8410d4312627e6776"
@@ -11009,7 +10954,7 @@ workbox-window@7.1.0, workbox-window@^7.0.0:
    "@types/trusted-types" "^2.0.2"
    workbox-core "7.1.0"

-"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0":
+"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0:
  version "7.0.0"
  resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
  integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
@@ -11027,15 +10972,6 @@ wrap-ansi@^6.2.0:
    string-width "^4.1.0"
    strip-ansi "^6.0.0"

-wrap-ansi@^7.0.0:
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
-  integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
-  dependencies:
-    ansi-styles "^4.0.0"
-    string-width "^4.1.0"
-    strip-ansi "^6.0.0"
-
 wrap-ansi@^8.1.0:
  version "8.1.0"
  resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214"
Author	SHA1	Message	Date
zsviczian	5c8adfa1a9	Update App.tsx	2024-09-28 13:05:40 +02:00
Subhadeep Sengupta	a977dd1bf5	feat: Added reddit links as embeddable (#8099 ) feat: #8063 Added reddit links as embeddable Co-authored-by: Aakansha Doshi <aakansha1216@gmail.com>	2024-09-28 11:49:18 +05:30
Aakansha Doshi	3fe1883f3f	feat: prefer user defined coords and dimensions over calculated for for frame (#8517 ) * feat: prefer user defined coords and dimensions over calculated for frame * update changelog * lint * show the info only in dev mode and when children present	2024-09-24 21:09:15 +05:30
Marcel Mraz	a80cb5896a	feat: self-hosting existing google fonts (#8540 )	2024-09-24 17:30:21 +02:00
David Luzar	6dfa18414a	test: decrease min coverage thresholds (#8541 )	2024-09-24 12:01:28 +00:00
David Luzar	8ca4cf3260	feat: flip arrowheads if only arrow(s) selected (#8525 ) Co-authored-by: Mark Tolmacs <mark@lazycat.hu>	2024-09-19 15:46:36 +02:00
Márk Tolmács	f3f0ab7c83	fix: Elbow arrow fixedpoint flipping now properly flips on inverted resize and flip action (#8324 ) * Flipping action now properly mirrors selections with elbow arrows * Flipping action now re-centers the selection to the original center to avoid "walking" selections on repeated flipping	2024-09-19 08:47:23 +02:00
David Luzar	44a1c8d857	fix: svg and png frame clipping cases (#8515 )	2024-09-18 00:20:22 +02:00
Márk Tolmács	e0a22edfbd	fix: Re-route elbow arrows when pasted (#8448 ) Re-route elbow arrows when pasted	2024-09-17 12:20:40 +02:00
Márk Tolmács	c07f5a0c80	feat: Common elbow mid segments (#8440 ) Common start or end segment length for elbow arrows regardless of arrowhead is present	2024-09-17 10:11:07 +02:00
David Luzar	508f16dc04	refactor: rename example `App.tsx` -> `ExampleApp.tsx` (#8501 )	2024-09-13 16:56:32 +02:00
zsviczian	c1b310c56b	fix: Buffer dependency (#8474 ) * fix Buffer dependency * moved to encode.ts * move base64 parsing out --------- Co-authored-by: dwelle <5153846+dwelle@users.noreply.github.com>	2024-09-12 15:48:47 +02:00
zsviczian	d4900e8f19	fix: Linear element complete button disabled (#8492 )	2024-09-12 14:59:38 +02:00
zsviczian	caf2db934c	fix: aspect ratio of distorted images are not preserved in SVG exports (#8061 )	2024-09-12 14:11:08 +02:00
zsviczian	60e3801691	fix: WYSIWYG editor padding is not normalized with zoom.value (#8481 )	2024-09-12 13:42:39 +02:00