From 5601d0ee22d34035f4ffe6244ec94901ca7be262 Mon Sep 17 00:00:00 2001 From: Steve Ruiz Date: Mon, 29 Apr 2024 11:58:15 +0100 Subject: [PATCH] Separate text-align property for shapes (#3627) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This PR creates a new "text align" property for text shapes. Its default is left align. This means that text shapes now have their own alignment prop, separate from the vertical / horizontal alignment used in labels. The style panel for text has no visual change: image The style panel for labels has consistent icons for label position: image Both may be configured separately. image # Icon refresh This PR also removes many unused icons. It adds a special toggle icon for the context menu. image image ### Change Type - [x] `sdk` — Changes the tldraw SDK - [x] `improvement` — Improving existing features ### Test Plan 1. Load files. 2. Paste excalidraw content. 3. Load v1 files. 4. Use the app as usual. - [x] Unit Tests ### Release Notes - Separates the text align property for text shapes and labels. --------- Co-authored-by: huppy-bot[bot] <128400622+huppy-bot[bot]@users.noreply.github.com> --- ...raw-in-dark-mode-1-Mobile-Chrome-linux.png | Bin 2521 -> 2521 bytes ...ont-draw-in-dark-mode-1-chromium-linux.png | Bin 2521 -> 2521 bytes ...ono-in-dark-mode-1-Mobile-Chrome-linux.png | Bin 1690 -> 1691 bytes ...ont-mono-in-dark-mode-1-chromium-linux.png | Bin 1690 -> 1691 bytes ...ans-in-dark-mode-1-Mobile-Chrome-linux.png | Bin 1624 -> 1624 bytes ...ont-sans-in-dark-mode-1-chromium-linux.png | Bin 1624 -> 1624 bytes ...rif-in-dark-mode-1-Mobile-Chrome-linux.png | Bin 1551 -> 1546 bytes ...nt-serif-in-dark-mode-1-chromium-linux.png | Bin 1551 -> 1546 bytes .../ToolInToolbarExample.tsx | 3 +- ...OnTheCanvas.tsx => OnTheCanvasExample.tsx} | 0 .../examples/things-on-the-canvas/README.md | 2 +- .../ToolWithChildStatesExample.tsx | 2 +- assets/icons/icon/align-bottom-center.svg | 6 - assets/icons/icon/align-bottom-left.svg | 7 - assets/icons/icon/align-bottom-right.svg | 7 - assets/icons/icon/align-center-center.svg | 7 - assets/icons/icon/align-center-left.svg | 6 - assets/icons/icon/align-center-right.svg | 6 - assets/icons/icon/align-top-center.svg | 6 - assets/icons/icon/align-top-left.svg | 7 - assets/icons/icon/align-top-right.svg | 7 - assets/icons/icon/align-top.svg | 2 +- assets/icons/icon/aspect-ratio.svg | 8 - assets/icons/icon/avatar.svg | 3 - assets/icons/icon/blob.svg | 2 +- assets/icons/icon/broken.svg | 5 + assets/icons/icon/check-circle.svg | 5 +- assets/icons/icon/checkbox-checked.svg | 4 - assets/icons/icon/checkbox-empty.svg | 13 -- assets/icons/icon/chevron-left.svg | 2 +- assets/icons/icon/chevron-right.svg | 2 +- assets/icons/icon/clipboard-copied.svg | 2 +- assets/icons/icon/code.svg | 5 - assets/icons/icon/collab.svg | 5 - assets/icons/icon/comment.svg | 3 - assets/icons/icon/cross-circle.svg | 5 +- assets/icons/icon/cross.svg | 3 - assets/icons/icon/dash-dashed.svg | 2 +- assets/icons/icon/dash-dotted.svg | 4 +- assets/icons/icon/disconnected.svg | 4 + assets/icons/icon/duplicate.svg | 2 +- assets/icons/icon/error.svg | 4 - assets/icons/icon/file.svg | 3 - assets/icons/icon/font-mono.svg | 2 +- assets/icons/icon/geo-check-box.svg | 2 +- assets/icons/icon/geo-cloud.svg | 5 +- assets/icons/icon/geo-hexagon.svg | 2 +- assets/icons/icon/geo-octagon.svg | 2 +- assets/icons/icon/geo-pentagon.svg | 2 +- assets/icons/icon/geo-rectangle.svg | 2 +- assets/icons/icon/geo-rhombus-2.svg | 2 +- assets/icons/icon/geo-rhombus.svg | 2 +- assets/icons/icon/geo-star.svg | 2 +- assets/icons/icon/geo-trapezoid.svg | 2 +- assets/icons/icon/geo-x-box.svg | 2 +- assets/icons/icon/hidden.svg | 3 - assets/icons/icon/horizontal-align-end.svg | 5 + assets/icons/icon/horizontal-align-middle.svg | 7 + assets/icons/icon/horizontal-align-start.svg | 5 + assets/icons/icon/image.svg | 4 - assets/icons/icon/lock-small.svg | 4 - assets/icons/icon/lock.svg | 4 - assets/icons/icon/pack.svg | 2 +- assets/icons/icon/page.svg | 4 - assets/icons/icon/reset-zoom.svg | 4 +- assets/icons/icon/ruler.svg | 3 - assets/icons/icon/search.svg | 4 - assets/icons/icon/settings-horizontal.svg | 3 - assets/icons/icon/settings-vertical-1.svg | 5 - assets/icons/icon/settings-vertical.svg | 3 - assets/icons/icon/share-1.svg | 4 - assets/icons/icon/share-2.svg | 3 - assets/icons/icon/spline-cubic.svg | 3 - assets/icons/icon/spline-line.svg | 3 - assets/icons/icon/status-offline.svg | 4 - assets/icons/icon/status-online.svg | 5 - assets/icons/icon/text-align-justify.svg | 3 - assets/icons/icon/toggle-off.svg | 4 + assets/icons/icon/toggle-on.svg | 4 + assets/icons/icon/tool-embed.svg | 4 - assets/icons/icon/tool-screenshot.svg | 5 + assets/icons/icon/triangle-down.svg | 3 - assets/icons/icon/triangle-up.svg | 3 - assets/icons/icon/unlock-small.svg | 4 - assets/icons/icon/unlock.svg | 4 - ...n-center.svg => vertical-align-middle.svg} | 0 assets/icons/icon/visible.svg | 3 - assets/icons/icon/warning-triangle.svg | 4 +- assets/icons/icon/zoom-in.svg | 4 +- assets/icons/icon/zoom-out.svg | 4 +- packages/assets/imports.js | 104 ++---------- packages/assets/imports.vite.js | 104 ++---------- packages/assets/selfHosted.js | 52 +----- packages/assets/types.d.ts | 52 +----- packages/assets/urls.js | 154 ++++-------------- packages/editor/src/lib/editor/Editor.ts | 4 +- packages/tldraw/api-report.md | 11 +- .../src/lib/defaultExternalContentHandlers.ts | 4 +- .../src/lib/shapes/text/TextShapeUtil.tsx | 12 +- packages/tldraw/src/lib/styles.tsx | 9 +- packages/tldraw/src/lib/ui.css | 7 + .../StylePanel/DefaultStylePanelContent.tsx | 42 ++++- .../StylePanel/DoubleDropdownPicker.tsx | 4 +- .../src/lib/ui/components/menu-items.tsx | 4 +- .../ui/components/primitives/TldrawUiIcon.tsx | 12 ++ .../menus/TldrawUiMenuCheckboxItem.tsx | 12 +- .../hooks/clipboard/pasteExcalidrawContent.ts | 9 +- packages/tldraw/src/lib/ui/hooks/useTools.tsx | 2 +- packages/tldraw/src/lib/ui/icon-types.ts | 104 ++---------- .../src/lib/utils/tldr/buildFromV1Document.ts | 14 +- packages/tldraw/src/test/text.test.ts | 30 ++-- packages/tlschema/api-report.md | 8 +- packages/tlschema/src/index.ts | 1 + packages/tlschema/src/migrations.test.ts | 12 ++ packages/tlschema/src/shapes/TLTextShape.ts | 16 +- .../tlschema/src/styles/TLTextAlignStyle.ts | 11 ++ 116 files changed, 360 insertions(+), 746 deletions(-) rename apps/examples/src/examples/things-on-the-canvas/{OnTheCanvas.tsx => OnTheCanvasExample.tsx} (100%) delete mode 100644 assets/icons/icon/align-bottom-center.svg delete mode 100644 assets/icons/icon/align-bottom-left.svg delete mode 100644 assets/icons/icon/align-bottom-right.svg delete mode 100644 assets/icons/icon/align-center-center.svg delete mode 100644 assets/icons/icon/align-center-left.svg delete mode 100644 assets/icons/icon/align-center-right.svg delete mode 100644 assets/icons/icon/align-top-center.svg delete mode 100644 assets/icons/icon/align-top-left.svg delete mode 100644 assets/icons/icon/align-top-right.svg delete mode 100644 assets/icons/icon/aspect-ratio.svg delete mode 100644 assets/icons/icon/avatar.svg create mode 100644 assets/icons/icon/broken.svg delete mode 100644 assets/icons/icon/checkbox-checked.svg delete mode 100644 assets/icons/icon/checkbox-empty.svg delete mode 100644 assets/icons/icon/code.svg delete mode 100644 assets/icons/icon/collab.svg delete mode 100644 assets/icons/icon/comment.svg delete mode 100644 assets/icons/icon/cross.svg create mode 100644 assets/icons/icon/disconnected.svg delete mode 100644 assets/icons/icon/error.svg delete mode 100644 assets/icons/icon/file.svg delete mode 100644 assets/icons/icon/hidden.svg create mode 100644 assets/icons/icon/horizontal-align-end.svg create mode 100644 assets/icons/icon/horizontal-align-middle.svg create mode 100644 assets/icons/icon/horizontal-align-start.svg delete mode 100644 assets/icons/icon/image.svg delete mode 100644 assets/icons/icon/lock-small.svg delete mode 100644 assets/icons/icon/lock.svg delete mode 100644 assets/icons/icon/page.svg delete mode 100644 assets/icons/icon/ruler.svg delete mode 100644 assets/icons/icon/search.svg delete mode 100644 assets/icons/icon/settings-horizontal.svg delete mode 100644 assets/icons/icon/settings-vertical-1.svg delete mode 100644 assets/icons/icon/settings-vertical.svg delete mode 100644 assets/icons/icon/share-1.svg delete mode 100644 assets/icons/icon/share-2.svg delete mode 100644 assets/icons/icon/spline-cubic.svg delete mode 100644 assets/icons/icon/spline-line.svg delete mode 100644 assets/icons/icon/status-offline.svg delete mode 100644 assets/icons/icon/status-online.svg delete mode 100644 assets/icons/icon/text-align-justify.svg create mode 100644 assets/icons/icon/toggle-off.svg create mode 100644 assets/icons/icon/toggle-on.svg delete mode 100644 assets/icons/icon/tool-embed.svg create mode 100644 assets/icons/icon/tool-screenshot.svg delete mode 100644 assets/icons/icon/triangle-down.svg delete mode 100644 assets/icons/icon/triangle-up.svg delete mode 100644 assets/icons/icon/unlock-small.svg delete mode 100644 assets/icons/icon/unlock.svg rename assets/icons/icon/{vertical-align-center.svg => vertical-align-middle.svg} (100%) delete mode 100644 assets/icons/icon/visible.svg create mode 100644 packages/tlschema/src/styles/TLTextAlignStyle.ts diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-in-dark-mode-1-Mobile-Chrome-linux.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-in-dark-mode-1-Mobile-Chrome-linux.png index eee1dfe7243c91620d7509d6c2356385531bb3dd..5e7447d918f7527cfe588eab842805571d5c3316 100644 GIT binary patch delta 2401 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 Ts04VS00000NkvXXu0mjf+I^nS delta 2404 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 Ts04VS00000NkvXXu0mjf+I^nS delta 2404 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 OFM@aO4dnY1&;AQ+v>W6A delta 1580 zcma*k2_qAF008hm@>GVLA*A(4(lt!kM&zvJRW>=Nh7_9_IYydPnj@u2g`$HZ=gJ<< zLX^-*OCw|M>7ijotj+5iy!ZPGzkHQEl^c7tG44(dnD~O(zNAd8P(!6T5$SZSDBA@? z<+oesu%egVFNt~Yk&@t7-Nh!I@U~l6qbw z-M~4!WjX%US(Tzq^s zHzdi!$*wG2EzON(j#HSkQJ2;WDWO#{B8)i;ro(N+kP*qM2MhoyZOR#o3as#=YOHCV zsPFJmyH@?ugBlm?x4vqZU&5dvZu_mdUfIQs=LG{0a2LIpb?1RA{4w|IU#CCTnHahH zueo%JHs+w$oq#)6uk-D_kR1SIp47_eZ;`Ei?7j5n!O}k?7#90V(j0Y1uZ3y1rGVX9 z>9>qOxr&$h&Ha<*w^N^v_g51oQg=^P`@t`HxO}w7S?aVEgb;&|-*XQZ`&|u5ImFm5 z=uR>m)BH8J;C+5cwg|Uil-Q-}bUJ2)j4++#3v2I95~b4a05?+`8OaqMr+?~ZMzPsS zIIq}-l;2PdGir;@KmZ`nH+Y@#W;91tv#Qx%A(^&3w#}E(^(9!t8avZX`590{^Vb@= zbc9Sr_IylHv$7s3WqKj`TuH4NeL3X8(Yhk@!j-7cZ=juy8&doBTV-nAf^}r$v(Ms> zL|fX4Y<1Tk{LTw=KpIh_;rpjc)lKzYi7M_RnZ!hu- z-bu3l^_hqcG;NhAJtc;7)PgP@q}75b%$7C4|@Y{$K?St=2fnmt^kViQAQH zoT7y0+D7DkE~3@MdH1fgd255nM3|g<`6kgbc2ccA7;fQke!hK}YqDhGi8w)R9Ssdi z=awy8iPDljf7rux+!EJtA*g`;J8P4PMvTR)e-aZS-GvC*s}=@uQvy#rnxDA1e3SVk zBK*0nIscIOD8KGRWGo(jfwIU*-RFlh&GR#T;myr3{&Z-07G0 z{^}X4z0jLYvn-?oUJKB)^0&#SY%+qChyk2hedLC%YF#&W<(tS5I7 zMI@eqL8!k>1HD%zc(SyZpln`trq+VMv~<%QvyQy*LLQqG1K%&4y%=!SrEh*^ch;=` za!hFG0O!bjI5Ut<&+&LdstuZ_+lPg7%I`Bd@wGg2ZNl_sGo6QXV`X_q(#Ye8ii&yG z@pe54Xi76~x?TCbP;Y^a068Qp;g4(QFWmV-ZCFO<<>w1*eM$*F`p<7zL#*^X8_h|W zXZw83*><+RlnVp`!ELAbLpHv;(x$xD)cFP+atHeE%9gI{Sq~Ay5lPEd)Pxy-SR(t{ z)6;X9_C^-@!l2yFQ;(QYyfj_6F zmIr5&;7DWqj7GL!^1Sx^V?ErZTw>^E8wlGK8=+XO^}+7IuJozSV_JsqgyOAS(b&E& zHk9FjwUeKcfIjGy!Z@*aDp@4ymVerH$^-h}RvMQ``*#d7(2NhN5b&G3vxifq+CIA2c diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-in-dark-mode-1-chromium-linux.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-in-dark-mode-1-chromium-linux.png index 65959967a88bacabd1d161d0cc58a24a69d2775c..ff989a7b5c0616ac62c3471e755a07657490337a 100644 GIT binary patch delta 1581 zcma)+`#X~h0LS0OiI`GUBTFroL&~Lcn-oe|Wipq<*4AyVwW%4$^Xj5v3TetPlM;>T zGE))D%sAC{JjIl4DI99m%b`t*o&JM!K0kkd`aIv~!!|23D|B6s4-VWBkzW2~AS>VU z7}970Nv&Pqwffqh&X^AFps|Jr^7&>ed2s7WDWU}X;-{*F&AlW zB#K34;P7%qLQ|#TjuQ+ab!$j<6sRcG9;8k79SLo05j%~#wY^p7&qA4Hur*~bRZHEc zyDwnTQ$0xwn>&XuF^Oy7Co#1{F>>Zcg}5T;Y_q8d{3Ji6LS8|%cpQEB$fu%XPswl6 z%{X{KD~|U*+I%R7RA+sD_IOpHpXaOc%daOwIEw~_?<(C!Ctf)_mp0YC2CoShi$#&^ zFBrK~$Uy{s@g2MC+PR+!*R9W%Y$}k@q0~ePD)E!^ap8u|u`5zS(UUQQl(+o~oiZmP zVOW3q@Izj2@j=I+UV_i2r;NeQT-Kx~Csw%_nCTa-iQmAgNkf3}c`G3Bg{@z2Ijz4Y zyp~4-)nX{bex%yi77KPx2GZQO749CY>tBIUs-~J8%I1#Tk8b5UR?bpo64Y~l^9uuB zp64z4OdN|yMHJGW{TACGZv;GGx=*tMvl^tKy;e2!7Q^4^BKO%03ZE_%5zx)NT?Mmk z?O=xApfE~#xKx+?;wTJ=<6O+*=)*1h=&(m898Ek@HBbKmUsTy6OUUdQLGtr`Q|e)$ zZ2_?_FWm;1(DmYM%+9842Vq0aS%>15utF<>&J9@sM<4TbE17C9z~dTi+l?rmhAwT@ zlY8v2Rf|#;1^&$z*1-0pO3HB2+gufhG$u1c%Q!Ddk(1K9lClc`V3w`mUlZ zJ7eqyggK1p;t)vR*1ECe&(FtB3d47}!a*2NW1O?^|wSVY??KB&O2KbfUC`%n%88$SFJmTzXS9!WtO2aI4X=rvboNE?kzMcVoK zR1US=4X6*X6GD{aogFUVM4A7|IVkk@x9ilGwRdky9^88)Ls9bQ=H&$uRd*X@c4OtL zdz#nd$VUB#0U3)xPZOxiFSV0@j8xphqG>!Nv+^e{G4%8|L2_45JTLNoLt}eHen$Z> zVWV?b5hM_FLLqnfZ;gOo4%*UgLoc|H3dW^Ydo`wx(4&OU{Pdc-4(&EFuR>Zm`mVL&RQ9sH~tR>DSdnAfIX@iAUl0n6vcoa5LRR=U8Yy#A1@b$Z_k81cDT7I2$#kU zbAaz_zcTEp%j;f<|8C5M42Vqb%ED%RwLu%?XUg5m^veD3aF6Rd+F^~+ss~pXvu3uy OFM@aO4dnY1&;AQ+v>W6A delta 1580 zcma*k2_qAF008hm@>GVLA*A(4(lt!kM&zvJRW>=Nh7_9_IYydPnj@u2g`$HZ=gJ<< zLX^-*OCw|M>7ijotj+5iy!ZPGzkHQEl^c7tG44(dnD~O(zNAd8P(!6T5$SZSDBA@? z<+oesu%egVFNt~Yk&@t7-Nh!I@U~l6qbw z-M~4!WjX%US(Tzq^s zHzdi!$*wG2EzON(j#HSkQJ2;WDWO#{B8)i;ro(N+kP*qM2MhoyZOR#o3as#=YOHCV zsPFJmyH@?ugBlm?x4vqZU&5dvZu_mdUfIQs=LG{0a2LIpb?1RA{4w|IU#CCTnHahH zueo%JHs+w$oq#)6uk-D_kR1SIp47_eZ;`Ei?7j5n!O}k?7#90V(j0Y1uZ3y1rGVX9 z>9>qOxr&$h&Ha<*w^N^v_g51oQg=^P`@t`HxO}w7S?aVEgb;&|-*XQZ`&|u5ImFm5 z=uR>m)BH8J;C+5cwg|Uil-Q-}bUJ2)j4++#3v2I95~b4a05?+`8OaqMr+?~ZMzPsS zIIq}-l;2PdGir;@KmZ`nH+Y@#W;91tv#Qx%A(^&3w#}E(^(9!t8avZX`590{^Vb@= zbc9Sr_IylHv$7s3WqKj`TuH4NeL3X8(Yhk@!j-7cZ=juy8&doBTV-nAf^}r$v(Ms> zL|fX4Y<1Tk{LTw=KpIh_;rpjc)lKzYi7M_RnZ!hu- z-bu3l^_hqcG;NhAJtc;7)PgP@q}75b%$7C4|@Y{$K?St=2fnmt^kViQAQH zoT7y0+D7DkE~3@MdH1fgd255nM3|g<`6kgbc2ccA7;fQke!hK}YqDhGi8w)R9Ssdi z=awy8iPDljf7rux+!EJtA*g`;J8P4PMvTR)e-aZS-GvC*s}=@uQvy#rnxDA1e3SVk zBK*0nIscIOD8KGRWGo(jfwIU*-RFlh&GR#T;myr3{&Z-07G0 z{^}X4z0jLYvn-?oUJKB)^0&#SY%+qChyk2hedLC%YF#&W<(tS5I7 zMI@eqL8!k>1HD%zc(SyZpln`trq+VMv~<%QvyQy*LLQqG1K%&4y%=!SrEh*^ch;=` za!hFG0O!bjI5Ut<&+&LdstuZ_+lPg7%I`Bd@wGg2ZNl_sGo6QXV`X_q(#Ye8ii&yG z@pe54Xi76~x?TCbP;Y^a068Qp;g4(QFWmV-ZCFO<<>w1*eM$*F`p<7zL#*^X8_h|W zXZw83*><+RlnVp`!ELAbLpHv;(x$xD)cFP+atHeE%9gI{Sq~Ay5lPEd)Pxy-SR(t{ z)6;X9_C^-@!l2yFQ;(QYyfj_6F zmIr5&;7DWqj7GL!^1Sx^V?ErZTw>^E8wlGK8=+XO^}+7IuJozSV_JsqgyOAS(b&E& zHk9FjwUeKcfIjGy!Z@*aDp@4ymVerH$^-h}RvMQ``*#d7(2NhN5b&G3vxifq+CIA2c diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-in-dark-mode-1-Mobile-Chrome-linux.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-in-dark-mode-1-Mobile-Chrome-linux.png index 6aec0fe06667eded2649d669b199be431bc1fadd..5d98b473343e5456eaa3b25b58c3be671d94553d 100644 GIT binary patch delta 1493 zcmV;`1uFX34A=~iIYil8Y#dh^2k`%QW@gvBYtNjGvEz+%u~Vz&R!5}}LSu!iRFVe^ z1R+F$G%9T$T18Yv0fZ2uNEAw5f(jKyNC_0B3b&Dc9vHAGZ9^R=ZL*H~{oZEJ(b@kw zXU^!GT|ko{1|X5n34d`h)a(EYa$4t~1+Zq}dct*!?*&kLhvs-ws@VYmptZHNx6iWH zjP>?lthWdKDQmUX`nq>&j>RmC4FkZ<4zOUka{4wbmN| z`YV|2545zrp_N9p&Vw2IJ+Jun|9+^o9%80#0B#_{4FJypbbo>wBc4}00HF5TQEc13 zMJaU`GhI)Fwai>1!YO7t2_(PpJn#5r>e%>5CWChw1_EY07l!z)U&7;+>a%eieXLwAp928LadxyT!bejeMV1Kd^pJu;dpg*0$=j=9h*Yw#3Ux>m7 zn=qxz((DZz9WGZ&!{tibF1ro;+S>sDJ0>S_DvTDo(0`M;Tz+7cW!!szM+Y)WVLS}6 zf9^b<2?E%L!XDef7aSX(ZEM3b^iN0Zj*b(&gqxUT!O>lST*@42v*Z*<)vd0ug!W$~Rm?KZR; z2Eru4-hb)oc%)X{=SJbmi7?!H|M|Jo|E$#k0JmueM0_W}UF)nA0AM_d@TW?3yc##Q zmN@A-TB_Xr#mT97?<>=DRZg~eo_Ay^Ij;DEEWxs<5-*0CKCvmA1ptgU8kmR^gGlW+ zP3x>u#!-NJ{$87}HP%=b)|l2h=H%bgjRpXqKYx|N-h94ype1uuE8{c~f33{?R7|+r zb=|S1PVN#l`;oXLL|iBs^94hHDuuD$o<;k2n)v`*Ch|78Mot)#ODShFilCG_^I{{~_nC=_^rsG-cl{qz@!gd0Kp|z(U?ziaw6~*0DeQJ^d}ns{lK_5o)h6^7ToWe@;J-Xo ztpWi0EDN1VCCteV*DaFk7AcM~WH47g+<(#nWE6VHbs0H9!+U`BV7C%9zGV#AVz8o>p>2+^qH=tyh5CyMCjkNPE);}~hB z@KD!EHJHsES({(Mh5QQMm`e{oTFty612B$4Vvh zyEC(cl}ho@w51PxYi8!22Rb{^mrmoST`Mmb$BSc(*6SR{@h__e<&V{B*WcKZ#$Yy! z!G$XGwO$HC9Q3>j5kIt)8~_eonST{nI-}VE03Zm0GbPI!@{^>i*Gi#P5r_!Sg(3c2 zt&RpkeYjq)KXKMH`H$twmNXG*rI02am&CXT)xbb=4_m3?#N3+*zx%`0%t+i&RA4U@KEzDR) zM8wPuBHZD+?yGmU<2W|~>J9({L>K_z1AK~^o`|C0P_;PKpbpZVZ z%()M>w7jjAMzqd@8GBu~_|3O|)LIWR(-r_X5#c6)X8}5Y#*AUtE$#zQn?Fh}m%B|V zbq_P$NQBkQTq42=W;zbUzj9so=oRE>il!GGTI*ed+3fxww6|Zh{kZRA`^4l?*L6M& zz_9K76RRzA>+N<9A4{e19>ajojF*D|PkJRhQ>nfbMd2sP`v!R80g&Yt{7tquUVL)#$Yy8-T8Vt#u^QbN3lVq_L`=3 zS}Ef&K;3_<&D9#KEDNhlYYlV!uc<}@0MM6zNMLt9-_zfcI;@p(l8C=iW_~^*-0L{b zXj3P*2utCSxFAGaC>V1ELti3+(Vp&i?B8XYcq8zS?suH8Zc3$8&NOgmUgOTZ1^~=9 z8f%AZ^|c3FcjN0?Z*d&w_G>bc|Iu}H!VoW}q)jP;QtH%ejd0KB#>eCRj)N1vj|R_w zy<@eRCI(xxIJlyKUMsOPm(x41TKNB?>*$2hoW}e)AzAs^38Yb&&+25J{E@I zky$JGnSEy+@26CJFU8znNLVzGO5s~=ZD>&nJMA34H#75T0KdLw6S_jz%?She&(Bw@ z0DxZ0LWfc@bG*%QisU#&iXsde%$1LSwzPnmkAz|HK>#;otinf zbS_r|>CBApDpiySb0k- z{YoLfjB{4v%x5#1mA#3%3i6omgBdR@B*(Q`jZ0fHk3^#Q)#JW@{`yeY+ztP9sbqeC zdS;+fDIS=z^uF&*Pv7@YM+bV7N&LKX`32*+QG}6touepvtZGpHNUe6`%`Hg`q|+EU zS7pxkdJtg0>sE;Pk%i;{aNz2HtiZw;&HVHEeBVD+vaCTbjyrp-1hR@iM0hy}@TY2Z z#P{n%^?Lo;)27LPC|5QmiAXDjBoV4{jIl7pQ(g(*oj&88j2b&U&wD(XOdR~XAFLa$ z)p{)=v>FNt03kD83j!SSJUlQnTk)dC7d_8Avd|pOT&JdgOPo(@t(oaZ$3%P^Gu99h zF>`|mcR7x8{?4{-`xZdm1)!e@{Qx|GPcYN7Vdx*IR;!b58~2mUw4DeW0IUU&0Wb;h t@4_(rVWmQDdx diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-in-dark-mode-1-chromium-linux.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-in-dark-mode-1-chromium-linux.png index 6aec0fe06667eded2649d669b199be431bc1fadd..5d98b473343e5456eaa3b25b58c3be671d94553d 100644 GIT binary patch delta 1493 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 t@4_(rVWmQDdx diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-in-dark-mode-1-Mobile-Chrome-linux.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-in-dark-mode-1-Mobile-Chrome-linux.png index 4a4a43c593f40a4ef18e02df2ec3f71c6fb0881d..9c603378675403f306f1411e0ea3e0af701564e4 100644 GIT binary patch delta 1515 zcmai!i9gc|0Kk9FNs6efF-PTvA)e*RV^&(WkX0s0&c|Ag-1kp%v^1%0$y+`IgTh9I_;C z74nOcLqZl?si{F!-k^yCaomu2$Jw|YoqEF)iMObtczMV#U!d&A4Zc^r?sU?_DeOe* zLW9=tD5SVU=Vfw&E@#TSF0_S&!ff5cSk8CVvGj&-}_==U+e2uVf-mVYF(mZYtLLF533>f~B$rbp*2{Q&C4&%twBS+gQIhs4g#!0)bt? zS?soaM{s&0UP&dic0(>eGkxP`MZ*D9@FIY%UX{6SnZ7T5PUb5H?PslL2APyKyimif zWG>jp8z#QE9Xd0Kt-jDZu%4%xRG@>L&6s)xt)odE8p4+C#qPZKthiTr8-&2Gk@n;& z1soQQsPA9?v+`L)5=^tOH;V`UClOk&d#$Ky(K-*fS+-Xli}NHw%jyKevK&_`HG!|H z3yYj@n=RtBi)V>%-Elju+ByLfUQ6hnv??FJ*{M4m3qX4_7(oY@R5*N_kwG%FLr#M_ z;!*QA4m&=^&(pQDlHyIKhBY)KS^5P>T%vsHiHix13{E#pG0hSDX3Kwy)SUSI8L2Zj zkMhJ`D=zISXKWoe>172vB)&+>YWfcM{JM=+t}>LG>f6|PP-%<$Y;@iQp4}pu zdgnI%xNGvmUZyi0qrB!l3^GK7aa)Hvl1m0I>Y`8Wc-dj@h78-8ba^y}PSD-*lOQTOKv zxz4PQKEVch{L%Ylc(#Ivxqd?odGyR6UA^slVQLubh{35xJwU5HbIp66(W;e#P4oQNFPc$|4( z{h$jh%lx!Vf3)D*aqx`sKE@mKtq-fLiK`SzrW*SaU77z6%`qQ_AdJL?|IDx1^d_H{ zC9*ewFq8>$UTO-L)LbFys!T!+00KBA?GkKJov5x%tAD8A3O8IZa7RDKXIM)~dfJ;ZH_y`bi<;Sjj{CgMX|I>lb0z=8-N|xi?~9=O~I+IZmc| z0-^9P4mSmPtT&c70Md~^nAJ5JjLLz~l2OO08Vvdob_N^{>1hL}jFt~^oEWrQFWCIg zM3#qfAg*!bR)zKVcE`CyezJRfeEIX9>ye^Oo1s=SH@8YZ0Gb<^0(Bmlhj4?`uLva4 zp%dMLCl1ASD5F?8J)M2%$HFuzxEmzMu-DLjKnIYn9aOOqN(s9@p3rjMI8`37bmc^3 zs-a2Sy7~>OsMkZ?J8r1TutXB6u1sbQ74nN$a+_BbrYB-1G+WUMz)xJ9-A>k_{WAUs D`^nQ_ delta 1520 zcmajb{Xf$Q0KoCD$2_%EYHKYISCPoDA@ckpnUL?an3ad6PI8P+cEy)M$vo7{!==na zC}k8z#5kmg#F#v7DA5hec4yd@>;8ee_phJdK6f;-G_uX09(NZf-?)cMALDPM=Jsv* zCcq5zE%$MkZR?uyNzqpeI?oiGGdAl6jR{+cTZiv>RwBsw%Rb2 zEC=8!jpRt`h-WG7*_;g(-BpD+jEdTXobPT}aZaf{#`Pl`cM6gN+<7(_$4+p8Mi_ zncWWjUl%pfgI#_e_`pO z&ReM{3ElMzWlcmy7BS|O9s~vhd6E9LiaZ|^Q*o63Cj^lBy*9UZQyB7wYd*=&K(s61 z*&hR*mAK)g^>sVpHkRN0jAt(5@ovd_1bz2tLR;8!d`Zo~TL`I~U?JOnt`ZC9xqiiJ zFDyF~aF+||-GU3!V@KY##F$a*qf?lj$Ep@2DfW&ILLU4Q^Up*9+(mP3KD2I3)T}`f zbWTmZbx)hQzh^P?aGT+9xZNh55eSWbE~`GM%9*cy>C_bOUMf(aJ+pdQJ%dXV|2S|c z@Aw_}meNyD&5`(4a9xxcva;X@7BF9b9_$S%@l6~zhi(zm&$=NgMvt$6<0W7Hv>30O zJy2T!&2F=&iQihT#|QUyk>oaxs275(C;KgrL%hln%30Wgxu@&FMRzy03vDwoeziyHX$JUwnvR-RlWr zlF3Z+ehzZ;$w=37v=TZsxb@yN$5cZsEvgVYScj@9I}Thu!Ol?T?Axe1?x{m7T@Zj! zZ}=~Ji`HbP#}@qq2V#R55&Mk}nmmsn1x2%2ex}7Qn{v3jSjkJ{}2Y+bC-HvLxErCuTjqaJq-KY zPU8{<<oxzV5~5b~&y|&}k2370)7h}D?FY@lojxUyQ`N= JwR6yoe*nc};70%e diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-in-dark-mode-1-chromium-linux.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-in-dark-mode-1-chromium-linux.png index 4a4a43c593f40a4ef18e02df2ec3f71c6fb0881d..9c603378675403f306f1411e0ea3e0af701564e4 100644 GIT binary patch delta 1515 zcmai!i9gc|0Kk9FNs6efF-PTvA)e*RV^&(WkX0s0&c|Ag-1kp%v^1%0$y+`IgTh9I_;C z74nOcLqZl?si{F!-k^yCaomu2$Jw|YoqEF)iMObtczMV#U!d&A4Zc^r?sU?_DeOe* zLW9=tD5SVU=Vfw&E@#TSF0_S&!ff5cSk8CVvGj&-}_==U+e2uVf-mVYF(mZYtLLF533>f~B$rbp*2{Q&C4&%twBS+gQIhs4g#!0)bt? zS?soaM{s&0UP&dic0(>eGkxP`MZ*D9@FIY%UX{6SnZ7T5PUb5H?PslL2APyKyimif zWG>jp8z#QE9Xd0Kt-jDZu%4%xRG@>L&6s)xt)odE8p4+C#qPZKthiTr8-&2Gk@n;& z1soQQsPA9?v+`L)5=^tOH;V`UClOk&d#$Ky(K-*fS+-Xli}NHw%jyKevK&_`HG!|H z3yYj@n=RtBi)V>%-Elju+ByLfUQ6hnv??FJ*{M4m3qX4_7(oY@R5*N_kwG%FLr#M_ z;!*QA4m&=^&(pQDlHyIKhBY)KS^5P>T%vsHiHix13{E#pG0hSDX3Kwy)SUSI8L2Zj zkMhJ`D=zISXKWoe>172vB)&+>YWfcM{JM=+t}>LG>f6|PP-%<$Y;@iQp4}pu zdgnI%xNGvmUZyi0qrB!l3^GK7aa)Hvl1m0I>Y`8Wc-dj@h78-8ba^y}PSD-*lOQTOKv zxz4PQKEVch{L%Ylc(#Ivxqd?odGyR6UA^slVQLubh{35xJwU5HbIp66(W;e#P4oQNFPc$|4( z{h$jh%lx!Vf3)D*aqx`sKE@mKtq-fLiK`SzrW*SaU77z6%`qQ_AdJL?|IDx1^d_H{ zC9*ewFq8>$UTO-L)LbFys!T!+00KBA?GkKJov5x%tAD8A3O8IZa7RDKXIM)~dfJ;ZH_y`bi<;Sjj{CgMX|I>lb0z=8-N|xi?~9=O~I+IZmc| z0-^9P4mSmPtT&c70Md~^nAJ5JjLLz~l2OO08Vvdob_N^{>1hL}jFt~^oEWrQFWCIg zM3#qfAg*!bR)zKVcE`CyezJRfeEIX9>ye^Oo1s=SH@8YZ0Gb<^0(Bmlhj4?`uLva4 zp%dMLCl1ASD5F?8J)M2%$HFuzxEmzMu-DLjKnIYn9aOOqN(s9@p3rjMI8`37bmc^3 zs-a2Sy7~>OsMkZ?J8r1TutXB6u1sbQ74nN$a+_BbrYB-1G+WUMz)xJ9-A>k_{WAUs D`^nQ_ delta 1520 zcmajb{Xf$Q0KoCD$2_%EYHKYISCPoDA@ckpnUL?an3ad6PI8P+cEy)M$vo7{!==na zC}k8z#5kmg#F#v7DA5hec4yd@>;8ee_phJdK6f;-G_uX09(NZf-?)cMALDPM=Jsv* zCcq5zE%$MkZR?uyNzqpeI?oiGGdAl6jR{+cTZiv>RwBsw%Rb2 zEC=8!jpRt`h-WG7*_;g(-BpD+jEdTXobPT}aZaf{#`Pl`cM6gN+<7(_$4+p8Mi_ zncWWjUl%pfgI#_e_`pO z&ReM{3ElMzWlcmy7BS|O9s~vhd6E9LiaZ|^Q*o63Cj^lBy*9UZQyB7wYd*=&K(s61 z*&hR*mAK)g^>sVpHkRN0jAt(5@ovd_1bz2tLR;8!d`Zo~TL`I~U?JOnt`ZC9xqiiJ zFDyF~aF+||-GU3!V@KY##F$a*qf?lj$Ep@2DfW&ILLU4Q^Up*9+(mP3KD2I3)T}`f zbWTmZbx)hQzh^P?aGT+9xZNh55eSWbE~`GM%9*cy>C_bOUMf(aJ+pdQJ%dXV|2S|c z@Aw_}meNyD&5`(4a9xxcva;X@7BF9b9_$S%@l6~zhi(zm&$=NgMvt$6<0W7Hv>30O zJy2T!&2F=&iQihT#|QUyk>oaxs275(C;KgrL%hln%30Wgxu@&FMRzy03vDwoeziyHX$JUwnvR-RlWr zlF3Z+ehzZ;$w=37v=TZsxb@yN$5cZsEvgVYScj@9I}Thu!Ol?T?Axe1?x{m7T@Zj! zZ}=~Ji`HbP#}@qq2V#R55&Mk}nmmsn1x2%2ex}7Qn{v3jSjkJ{}2Y+bC-HvLxErCuTjqaJq-KY zPU8{<<oxzV5~5b~&y|&}k2370)7h}D?FY@lojxUyQ`N= JwR6yoe*nc};70%e diff --git a/apps/examples/src/examples/add-tool-to-toolbar/ToolInToolbarExample.tsx b/apps/examples/src/examples/add-tool-to-toolbar/ToolInToolbarExample.tsx index d8d7ae1d6..be005a7d5 100644 --- a/apps/examples/src/examples/add-tool-to-toolbar/ToolInToolbarExample.tsx +++ b/apps/examples/src/examples/add-tool-to-toolbar/ToolInToolbarExample.tsx @@ -66,7 +66,8 @@ export const customAssetUrls: TLUiAssetUrlOverrides = { // [4] const customTools = [StickerTool] -export default function CustomToolExample() { + +export default function ToolInToolbarExample() { return (
- - - - - diff --git a/assets/icons/icon/align-bottom-left.svg b/assets/icons/icon/align-bottom-left.svg deleted file mode 100644 index 45a0e9636..000000000 --- a/assets/icons/icon/align-bottom-left.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/assets/icons/icon/align-bottom-right.svg b/assets/icons/icon/align-bottom-right.svg deleted file mode 100644 index c7315361d..000000000 --- a/assets/icons/icon/align-bottom-right.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/assets/icons/icon/align-center-center.svg b/assets/icons/icon/align-center-center.svg deleted file mode 100644 index ca5285fdd..000000000 --- a/assets/icons/icon/align-center-center.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/assets/icons/icon/align-center-left.svg b/assets/icons/icon/align-center-left.svg deleted file mode 100644 index 91bd3891c..000000000 --- a/assets/icons/icon/align-center-left.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - diff --git a/assets/icons/icon/align-center-right.svg b/assets/icons/icon/align-center-right.svg deleted file mode 100644 index 26aee67b7..000000000 --- a/assets/icons/icon/align-center-right.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - diff --git a/assets/icons/icon/align-top-center.svg b/assets/icons/icon/align-top-center.svg deleted file mode 100644 index 7dd7ebb2b..000000000 --- a/assets/icons/icon/align-top-center.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - diff --git a/assets/icons/icon/align-top-left.svg b/assets/icons/icon/align-top-left.svg deleted file mode 100644 index 65c2027ac..000000000 --- a/assets/icons/icon/align-top-left.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/assets/icons/icon/align-top-right.svg b/assets/icons/icon/align-top-right.svg deleted file mode 100644 index 1a36ab062..000000000 --- a/assets/icons/icon/align-top-right.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/assets/icons/icon/align-top.svg b/assets/icons/icon/align-top.svg index 08731c6db..06cefbc4c 100644 --- a/assets/icons/icon/align-top.svg +++ b/assets/icons/icon/align-top.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/aspect-ratio.svg b/assets/icons/icon/aspect-ratio.svg deleted file mode 100644 index 38f6452a4..000000000 --- a/assets/icons/icon/aspect-ratio.svg +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - - - diff --git a/assets/icons/icon/avatar.svg b/assets/icons/icon/avatar.svg deleted file mode 100644 index 622017d61..000000000 --- a/assets/icons/icon/avatar.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/blob.svg b/assets/icons/icon/blob.svg index 4ff1bafc0..1a57e75a7 100644 --- a/assets/icons/icon/blob.svg +++ b/assets/icons/icon/blob.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/broken.svg b/assets/icons/icon/broken.svg new file mode 100644 index 000000000..bc893659a --- /dev/null +++ b/assets/icons/icon/broken.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/icons/icon/check-circle.svg b/assets/icons/icon/check-circle.svg index 1131b9e12..67c9b863b 100644 --- a/assets/icons/icon/check-circle.svg +++ b/assets/icons/icon/check-circle.svg @@ -1 +1,4 @@ - \ No newline at end of file + + + + diff --git a/assets/icons/icon/checkbox-checked.svg b/assets/icons/icon/checkbox-checked.svg deleted file mode 100644 index 9cd8a9d87..000000000 --- a/assets/icons/icon/checkbox-checked.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/assets/icons/icon/checkbox-empty.svg b/assets/icons/icon/checkbox-empty.svg deleted file mode 100644 index b7c54ad5a..000000000 --- a/assets/icons/icon/checkbox-empty.svg +++ /dev/null @@ -1,13 +0,0 @@ - - - - diff --git a/assets/icons/icon/chevron-left.svg b/assets/icons/icon/chevron-left.svg index 5ec929146..7fba4b065 100644 --- a/assets/icons/icon/chevron-left.svg +++ b/assets/icons/icon/chevron-left.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/chevron-right.svg b/assets/icons/icon/chevron-right.svg index 2432eb346..957f0ec6b 100644 --- a/assets/icons/icon/chevron-right.svg +++ b/assets/icons/icon/chevron-right.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/clipboard-copied.svg b/assets/icons/icon/clipboard-copied.svg index 5bc86e6b8..1860e1516 100644 --- a/assets/icons/icon/clipboard-copied.svg +++ b/assets/icons/icon/clipboard-copied.svg @@ -1,4 +1,4 @@ - + diff --git a/assets/icons/icon/code.svg b/assets/icons/icon/code.svg deleted file mode 100644 index 8386abe1d..000000000 --- a/assets/icons/icon/code.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/assets/icons/icon/collab.svg b/assets/icons/icon/collab.svg deleted file mode 100644 index 9a891bba8..000000000 --- a/assets/icons/icon/collab.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/assets/icons/icon/comment.svg b/assets/icons/icon/comment.svg deleted file mode 100644 index 7c726bb29..000000000 --- a/assets/icons/icon/comment.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/cross-circle.svg b/assets/icons/icon/cross-circle.svg index c8a92bd8e..3e3dbc852 100644 --- a/assets/icons/icon/cross-circle.svg +++ b/assets/icons/icon/cross-circle.svg @@ -1 +1,4 @@ - \ No newline at end of file + + + + diff --git a/assets/icons/icon/cross.svg b/assets/icons/icon/cross.svg deleted file mode 100644 index ce033df93..000000000 --- a/assets/icons/icon/cross.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/dash-dashed.svg b/assets/icons/icon/dash-dashed.svg index 5f53b6a4e..f51ce9cc5 100644 --- a/assets/icons/icon/dash-dashed.svg +++ b/assets/icons/icon/dash-dashed.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/dash-dotted.svg b/assets/icons/icon/dash-dotted.svg index c731b9aab..2b01b4f92 100644 --- a/assets/icons/icon/dash-dotted.svg +++ b/assets/icons/icon/dash-dotted.svg @@ -4,11 +4,11 @@ - + - + diff --git a/assets/icons/icon/disconnected.svg b/assets/icons/icon/disconnected.svg new file mode 100644 index 000000000..335f50312 --- /dev/null +++ b/assets/icons/icon/disconnected.svg @@ -0,0 +1,4 @@ + + + + diff --git a/assets/icons/icon/duplicate.svg b/assets/icons/icon/duplicate.svg index 1dd299efe..3e28e6113 100644 --- a/assets/icons/icon/duplicate.svg +++ b/assets/icons/icon/duplicate.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/error.svg b/assets/icons/icon/error.svg deleted file mode 100644 index 854bf824f..000000000 --- a/assets/icons/icon/error.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - \ No newline at end of file diff --git a/assets/icons/icon/file.svg b/assets/icons/icon/file.svg deleted file mode 100644 index c5abf52e4..000000000 --- a/assets/icons/icon/file.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/font-mono.svg b/assets/icons/icon/font-mono.svg index 3826b56b7..028596a98 100644 --- a/assets/icons/icon/font-mono.svg +++ b/assets/icons/icon/font-mono.svg @@ -1,4 +1,4 @@ - + diff --git a/assets/icons/icon/geo-check-box.svg b/assets/icons/icon/geo-check-box.svg index 28aa64aca..bc3572eec 100644 --- a/assets/icons/icon/geo-check-box.svg +++ b/assets/icons/icon/geo-check-box.svg @@ -1,5 +1,5 @@ - + diff --git a/assets/icons/icon/geo-cloud.svg b/assets/icons/icon/geo-cloud.svg index 726c8723e..de6c05374 100644 --- a/assets/icons/icon/geo-cloud.svg +++ b/assets/icons/icon/geo-cloud.svg @@ -1,6 +1,3 @@ - + - \ No newline at end of file diff --git a/assets/icons/icon/geo-hexagon.svg b/assets/icons/icon/geo-hexagon.svg index 3cf2c8901..ec12957d5 100644 --- a/assets/icons/icon/geo-hexagon.svg +++ b/assets/icons/icon/geo-hexagon.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/geo-octagon.svg b/assets/icons/icon/geo-octagon.svg index 1f9f324ae..d357224bb 100644 --- a/assets/icons/icon/geo-octagon.svg +++ b/assets/icons/icon/geo-octagon.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/geo-pentagon.svg b/assets/icons/icon/geo-pentagon.svg index 3bd2936f3..8f0343934 100644 --- a/assets/icons/icon/geo-pentagon.svg +++ b/assets/icons/icon/geo-pentagon.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/geo-rectangle.svg b/assets/icons/icon/geo-rectangle.svg index 5e37c9133..52ab53b13 100644 --- a/assets/icons/icon/geo-rectangle.svg +++ b/assets/icons/icon/geo-rectangle.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/geo-rhombus-2.svg b/assets/icons/icon/geo-rhombus-2.svg index 2618d5e46..469370182 100644 --- a/assets/icons/icon/geo-rhombus-2.svg +++ b/assets/icons/icon/geo-rhombus-2.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/geo-rhombus.svg b/assets/icons/icon/geo-rhombus.svg index 177e3f096..764b667ab 100644 --- a/assets/icons/icon/geo-rhombus.svg +++ b/assets/icons/icon/geo-rhombus.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/geo-star.svg b/assets/icons/icon/geo-star.svg index 698c151e6..cd2df657e 100644 --- a/assets/icons/icon/geo-star.svg +++ b/assets/icons/icon/geo-star.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/geo-trapezoid.svg b/assets/icons/icon/geo-trapezoid.svg index 659c2bd7c..053abe219 100644 --- a/assets/icons/icon/geo-trapezoid.svg +++ b/assets/icons/icon/geo-trapezoid.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/geo-x-box.svg b/assets/icons/icon/geo-x-box.svg index 0474dff56..d1aaf5ece 100644 --- a/assets/icons/icon/geo-x-box.svg +++ b/assets/icons/icon/geo-x-box.svg @@ -1,5 +1,5 @@ - + diff --git a/assets/icons/icon/hidden.svg b/assets/icons/icon/hidden.svg deleted file mode 100644 index 2ab52e966..000000000 --- a/assets/icons/icon/hidden.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/horizontal-align-end.svg b/assets/icons/icon/horizontal-align-end.svg new file mode 100644 index 000000000..c929995d2 --- /dev/null +++ b/assets/icons/icon/horizontal-align-end.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/icons/icon/horizontal-align-middle.svg b/assets/icons/icon/horizontal-align-middle.svg new file mode 100644 index 000000000..d36bf1ca9 --- /dev/null +++ b/assets/icons/icon/horizontal-align-middle.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/assets/icons/icon/horizontal-align-start.svg b/assets/icons/icon/horizontal-align-start.svg new file mode 100644 index 000000000..895d04829 --- /dev/null +++ b/assets/icons/icon/horizontal-align-start.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/icons/icon/image.svg b/assets/icons/icon/image.svg deleted file mode 100644 index 5d9041558..000000000 --- a/assets/icons/icon/image.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/assets/icons/icon/lock-small.svg b/assets/icons/icon/lock-small.svg deleted file mode 100644 index 90f0e6d4a..000000000 --- a/assets/icons/icon/lock-small.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/assets/icons/icon/lock.svg b/assets/icons/icon/lock.svg deleted file mode 100644 index 5693cc4c5..000000000 --- a/assets/icons/icon/lock.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/assets/icons/icon/pack.svg b/assets/icons/icon/pack.svg index 9d3880025..3095ae1c2 100644 --- a/assets/icons/icon/pack.svg +++ b/assets/icons/icon/pack.svg @@ -1,3 +1,3 @@ - + diff --git a/assets/icons/icon/page.svg b/assets/icons/icon/page.svg deleted file mode 100644 index e2fe4482c..000000000 --- a/assets/icons/icon/page.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/assets/icons/icon/reset-zoom.svg b/assets/icons/icon/reset-zoom.svg index 4d90af791..407f65571 100644 --- a/assets/icons/icon/reset-zoom.svg +++ b/assets/icons/icon/reset-zoom.svg @@ -1,6 +1,6 @@ - + - + diff --git a/assets/icons/icon/ruler.svg b/assets/icons/icon/ruler.svg deleted file mode 100644 index 6784733d7..000000000 --- a/assets/icons/icon/ruler.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/search.svg b/assets/icons/icon/search.svg deleted file mode 100644 index bdee3c3c2..000000000 --- a/assets/icons/icon/search.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/assets/icons/icon/settings-horizontal.svg b/assets/icons/icon/settings-horizontal.svg deleted file mode 100644 index a86a03006..000000000 --- a/assets/icons/icon/settings-horizontal.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/settings-vertical-1.svg b/assets/icons/icon/settings-vertical-1.svg deleted file mode 100644 index 16db6e855..000000000 --- a/assets/icons/icon/settings-vertical-1.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/assets/icons/icon/settings-vertical.svg b/assets/icons/icon/settings-vertical.svg deleted file mode 100644 index 1d4730391..000000000 --- a/assets/icons/icon/settings-vertical.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/share-1.svg b/assets/icons/icon/share-1.svg deleted file mode 100644 index 160f0418a..000000000 --- a/assets/icons/icon/share-1.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/assets/icons/icon/share-2.svg b/assets/icons/icon/share-2.svg deleted file mode 100644 index 2e0910aea..000000000 --- a/assets/icons/icon/share-2.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/spline-cubic.svg b/assets/icons/icon/spline-cubic.svg deleted file mode 100644 index 480fe6e14..000000000 --- a/assets/icons/icon/spline-cubic.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/spline-line.svg b/assets/icons/icon/spline-line.svg deleted file mode 100644 index bdbdf3028..000000000 --- a/assets/icons/icon/spline-line.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/status-offline.svg b/assets/icons/icon/status-offline.svg deleted file mode 100644 index 5a07ef126..000000000 --- a/assets/icons/icon/status-offline.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/assets/icons/icon/status-online.svg b/assets/icons/icon/status-online.svg deleted file mode 100644 index b16709e9f..000000000 --- a/assets/icons/icon/status-online.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/assets/icons/icon/text-align-justify.svg b/assets/icons/icon/text-align-justify.svg deleted file mode 100644 index 946e907a9..000000000 --- a/assets/icons/icon/text-align-justify.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/toggle-off.svg b/assets/icons/icon/toggle-off.svg new file mode 100644 index 000000000..e71190a9e --- /dev/null +++ b/assets/icons/icon/toggle-off.svg @@ -0,0 +1,4 @@ + + + + diff --git a/assets/icons/icon/toggle-on.svg b/assets/icons/icon/toggle-on.svg new file mode 100644 index 000000000..554dbf4e4 --- /dev/null +++ b/assets/icons/icon/toggle-on.svg @@ -0,0 +1,4 @@ + + + + diff --git a/assets/icons/icon/tool-embed.svg b/assets/icons/icon/tool-embed.svg deleted file mode 100644 index 5cca9c3a1..000000000 --- a/assets/icons/icon/tool-embed.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/assets/icons/icon/tool-screenshot.svg b/assets/icons/icon/tool-screenshot.svg new file mode 100644 index 000000000..55cc5de71 --- /dev/null +++ b/assets/icons/icon/tool-screenshot.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/icons/icon/triangle-down.svg b/assets/icons/icon/triangle-down.svg deleted file mode 100644 index 7f16828cb..000000000 --- a/assets/icons/icon/triangle-down.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/triangle-up.svg b/assets/icons/icon/triangle-up.svg deleted file mode 100644 index 88587f8c1..000000000 --- a/assets/icons/icon/triangle-up.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/unlock-small.svg b/assets/icons/icon/unlock-small.svg deleted file mode 100644 index 205980fbb..000000000 --- a/assets/icons/icon/unlock-small.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/assets/icons/icon/unlock.svg b/assets/icons/icon/unlock.svg deleted file mode 100644 index b81dc0b4e..000000000 --- a/assets/icons/icon/unlock.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/assets/icons/icon/vertical-align-center.svg b/assets/icons/icon/vertical-align-middle.svg similarity index 100% rename from assets/icons/icon/vertical-align-center.svg rename to assets/icons/icon/vertical-align-middle.svg diff --git a/assets/icons/icon/visible.svg b/assets/icons/icon/visible.svg deleted file mode 100644 index a5c205380..000000000 --- a/assets/icons/icon/visible.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/assets/icons/icon/warning-triangle.svg b/assets/icons/icon/warning-triangle.svg index 70a73aa29..6082a66a3 100644 --- a/assets/icons/icon/warning-triangle.svg +++ b/assets/icons/icon/warning-triangle.svg @@ -1,5 +1,5 @@ - - + + diff --git a/assets/icons/icon/zoom-in.svg b/assets/icons/icon/zoom-in.svg index 7aa583e5d..bbc795636 100644 --- a/assets/icons/icon/zoom-in.svg +++ b/assets/icons/icon/zoom-in.svg @@ -1,6 +1,6 @@ - + - + diff --git a/assets/icons/icon/zoom-out.svg b/assets/icons/icon/zoom-out.svg index 64f0da31e..9b8d80c1b 100644 --- a/assets/icons/icon/zoom-out.svg +++ b/assets/icons/icon/zoom-out.svg @@ -1,5 +1,5 @@ - - + + diff --git a/packages/assets/imports.js b/packages/assets/imports.js index 536dc4459..655896264 100644 --- a/packages/assets/imports.js +++ b/packages/assets/imports.js @@ -27,20 +27,11 @@ import fontsMonospace from './fonts/IBMPlexMono-Medium.woff2' import fontsSansSerif from './fonts/IBMPlexSans-Medium.woff2' import fontsSerif from './fonts/IBMPlexSerif-Medium.woff2' import fontsDraw from './fonts/Shantell_Sans-Tldrawish.woff2' -import iconsAlignBottomCenter from './icons/icon/align-bottom-center.svg' -import iconsAlignBottomLeft from './icons/icon/align-bottom-left.svg' -import iconsAlignBottomRight from './icons/icon/align-bottom-right.svg' import iconsAlignBottom from './icons/icon/align-bottom.svg' -import iconsAlignCenterCenter from './icons/icon/align-center-center.svg' import iconsAlignCenterHorizontal from './icons/icon/align-center-horizontal.svg' -import iconsAlignCenterLeft from './icons/icon/align-center-left.svg' -import iconsAlignCenterRight from './icons/icon/align-center-right.svg' import iconsAlignCenterVertical from './icons/icon/align-center-vertical.svg' import iconsAlignLeft from './icons/icon/align-left.svg' import iconsAlignRight from './icons/icon/align-right.svg' -import iconsAlignTopCenter from './icons/icon/align-top-center.svg' -import iconsAlignTopLeft from './icons/icon/align-top-left.svg' -import iconsAlignTopRight from './icons/icon/align-top-right.svg' import iconsAlignTop from './icons/icon/align-top.svg' import iconsArrowLeft from './icons/icon/arrow-left.svg' import iconsArrowheadArrow from './icons/icon/arrowhead-arrow.svg' @@ -51,15 +42,12 @@ import iconsArrowheadNone from './icons/icon/arrowhead-none.svg' import iconsArrowheadSquare from './icons/icon/arrowhead-square.svg' import iconsArrowheadTriangleInverted from './icons/icon/arrowhead-triangle-inverted.svg' import iconsArrowheadTriangle from './icons/icon/arrowhead-triangle.svg' -import iconsAspectRatio from './icons/icon/aspect-ratio.svg' -import iconsAvatar from './icons/icon/avatar.svg' import iconsBlob from './icons/icon/blob.svg' import iconsBringForward from './icons/icon/bring-forward.svg' import iconsBringToFront from './icons/icon/bring-to-front.svg' +import iconsBroken from './icons/icon/broken.svg' import iconsCheckCircle from './icons/icon/check-circle.svg' import iconsCheck from './icons/icon/check.svg' -import iconsCheckboxChecked from './icons/icon/checkbox-checked.svg' -import iconsCheckboxEmpty from './icons/icon/checkbox-empty.svg' import iconsChevronDown from './icons/icon/chevron-down.svg' import iconsChevronLeft from './icons/icon/chevron-left.svg' import iconsChevronRight from './icons/icon/chevron-right.svg' @@ -68,17 +56,14 @@ import iconsChevronsNe from './icons/icon/chevrons-ne.svg' import iconsChevronsSw from './icons/icon/chevrons-sw.svg' import iconsClipboardCopied from './icons/icon/clipboard-copied.svg' import iconsClipboardCopy from './icons/icon/clipboard-copy.svg' -import iconsCode from './icons/icon/code.svg' -import iconsCollab from './icons/icon/collab.svg' import iconsColor from './icons/icon/color.svg' -import iconsComment from './icons/icon/comment.svg' import iconsCross2 from './icons/icon/cross-2.svg' import iconsCrossCircle from './icons/icon/cross-circle.svg' -import iconsCross from './icons/icon/cross.svg' import iconsDashDashed from './icons/icon/dash-dashed.svg' import iconsDashDotted from './icons/icon/dash-dotted.svg' import iconsDashDraw from './icons/icon/dash-draw.svg' import iconsDashSolid from './icons/icon/dash-solid.svg' +import iconsDisconnected from './icons/icon/disconnected.svg' import iconsDiscord from './icons/icon/discord.svg' import iconsDistributeHorizontal from './icons/icon/distribute-horizontal.svg' import iconsDistributeVertical from './icons/icon/distribute-vertical.svg' @@ -88,9 +73,7 @@ import iconsDotsVertical from './icons/icon/dots-vertical.svg' import iconsDragHandleDots from './icons/icon/drag-handle-dots.svg' import iconsDuplicate from './icons/icon/duplicate.svg' import iconsEdit from './icons/icon/edit.svg' -import iconsError from './icons/icon/error.svg' import iconsExternalLink from './icons/icon/external-link.svg' -import iconsFile from './icons/icon/file.svg' import iconsFillNone from './icons/icon/fill-none.svg' import iconsFillPattern from './icons/icon/fill-pattern.svg' import iconsFillSemi from './icons/icon/fill-semi.svg' @@ -122,18 +105,16 @@ import iconsGeoTriangle from './icons/icon/geo-triangle.svg' import iconsGeoXBox from './icons/icon/geo-x-box.svg' import iconsGithub from './icons/icon/github.svg' import iconsGroup from './icons/icon/group.svg' -import iconsHidden from './icons/icon/hidden.svg' -import iconsImage from './icons/icon/image.svg' +import iconsHorizontalAlignEnd from './icons/icon/horizontal-align-end.svg' +import iconsHorizontalAlignMiddle from './icons/icon/horizontal-align-middle.svg' +import iconsHorizontalAlignStart from './icons/icon/horizontal-align-start.svg' import iconsInfoCircle from './icons/icon/info-circle.svg' import iconsLeading from './icons/icon/leading.svg' import iconsLink from './icons/icon/link.svg' -import iconsLockSmall from './icons/icon/lock-small.svg' -import iconsLock from './icons/icon/lock.svg' import iconsMenu from './icons/icon/menu.svg' import iconsMinus from './icons/icon/minus.svg' import iconsMixed from './icons/icon/mixed.svg' import iconsPack from './icons/icon/pack.svg' -import iconsPage from './icons/icon/page.svg' import iconsPlus from './icons/icon/plus.svg' import iconsQuestionMarkCircle from './icons/icon/question-mark-circle.svg' import iconsQuestionMark from './icons/icon/question-mark.svg' @@ -141,33 +122,22 @@ import iconsRedo from './icons/icon/redo.svg' import iconsResetZoom from './icons/icon/reset-zoom.svg' import iconsRotateCcw from './icons/icon/rotate-ccw.svg' import iconsRotateCw from './icons/icon/rotate-cw.svg' -import iconsRuler from './icons/icon/ruler.svg' -import iconsSearch from './icons/icon/search.svg' import iconsSendBackward from './icons/icon/send-backward.svg' import iconsSendToBack from './icons/icon/send-to-back.svg' -import iconsSettingsHorizontal from './icons/icon/settings-horizontal.svg' -import iconsSettingsVertical1 from './icons/icon/settings-vertical-1.svg' -import iconsSettingsVertical from './icons/icon/settings-vertical.svg' -import iconsShare1 from './icons/icon/share-1.svg' -import iconsShare2 from './icons/icon/share-2.svg' import iconsSizeExtraLarge from './icons/icon/size-extra-large.svg' import iconsSizeLarge from './icons/icon/size-large.svg' import iconsSizeMedium from './icons/icon/size-medium.svg' import iconsSizeSmall from './icons/icon/size-small.svg' -import iconsSplineCubic from './icons/icon/spline-cubic.svg' -import iconsSplineLine from './icons/icon/spline-line.svg' import iconsStackHorizontal from './icons/icon/stack-horizontal.svg' import iconsStackVertical from './icons/icon/stack-vertical.svg' -import iconsStatusOffline from './icons/icon/status-offline.svg' -import iconsStatusOnline from './icons/icon/status-online.svg' import iconsStretchHorizontal from './icons/icon/stretch-horizontal.svg' import iconsStretchVertical from './icons/icon/stretch-vertical.svg' import iconsTextAlignCenter from './icons/icon/text-align-center.svg' -import iconsTextAlignJustify from './icons/icon/text-align-justify.svg' import iconsTextAlignLeft from './icons/icon/text-align-left.svg' import iconsTextAlignRight from './icons/icon/text-align-right.svg' +import iconsToggleOff from './icons/icon/toggle-off.svg' +import iconsToggleOn from './icons/icon/toggle-on.svg' import iconsToolArrow from './icons/icon/tool-arrow.svg' -import iconsToolEmbed from './icons/icon/tool-embed.svg' import iconsToolEraser from './icons/icon/tool-eraser.svg' import iconsToolFrame from './icons/icon/tool-frame.svg' import iconsToolHand from './icons/icon/tool-hand.svg' @@ -178,19 +148,15 @@ import iconsToolMedia from './icons/icon/tool-media.svg' import iconsToolNote from './icons/icon/tool-note.svg' import iconsToolPencil from './icons/icon/tool-pencil.svg' import iconsToolPointer from './icons/icon/tool-pointer.svg' +import iconsToolScreenshot from './icons/icon/tool-screenshot.svg' import iconsToolText from './icons/icon/tool-text.svg' import iconsTrash from './icons/icon/trash.svg' -import iconsTriangleDown from './icons/icon/triangle-down.svg' -import iconsTriangleUp from './icons/icon/triangle-up.svg' import iconsTwitter from './icons/icon/twitter.svg' import iconsUndo from './icons/icon/undo.svg' import iconsUngroup from './icons/icon/ungroup.svg' -import iconsUnlockSmall from './icons/icon/unlock-small.svg' -import iconsUnlock from './icons/icon/unlock.svg' -import iconsVerticalAlignCenter from './icons/icon/vertical-align-center.svg' import iconsVerticalAlignEnd from './icons/icon/vertical-align-end.svg' +import iconsVerticalAlignMiddle from './icons/icon/vertical-align-middle.svg' import iconsVerticalAlignStart from './icons/icon/vertical-align-start.svg' -import iconsVisible from './icons/icon/visible.svg' import iconsWarningTriangle from './icons/icon/warning-triangle.svg' import iconsZoomIn from './icons/icon/zoom-in.svg' import iconsZoomOut from './icons/icon/zoom-out.svg' @@ -246,20 +212,11 @@ export function getAssetUrlsByImport(opts) { draw: formatAssetUrl(fontsDraw, opts), }, icons: { - 'align-bottom-center': formatAssetUrl(iconsAlignBottomCenter, opts), - 'align-bottom-left': formatAssetUrl(iconsAlignBottomLeft, opts), - 'align-bottom-right': formatAssetUrl(iconsAlignBottomRight, opts), 'align-bottom': formatAssetUrl(iconsAlignBottom, opts), - 'align-center-center': formatAssetUrl(iconsAlignCenterCenter, opts), 'align-center-horizontal': formatAssetUrl(iconsAlignCenterHorizontal, opts), - 'align-center-left': formatAssetUrl(iconsAlignCenterLeft, opts), - 'align-center-right': formatAssetUrl(iconsAlignCenterRight, opts), 'align-center-vertical': formatAssetUrl(iconsAlignCenterVertical, opts), 'align-left': formatAssetUrl(iconsAlignLeft, opts), 'align-right': formatAssetUrl(iconsAlignRight, opts), - 'align-top-center': formatAssetUrl(iconsAlignTopCenter, opts), - 'align-top-left': formatAssetUrl(iconsAlignTopLeft, opts), - 'align-top-right': formatAssetUrl(iconsAlignTopRight, opts), 'align-top': formatAssetUrl(iconsAlignTop, opts), 'arrow-left': formatAssetUrl(iconsArrowLeft, opts), 'arrowhead-arrow': formatAssetUrl(iconsArrowheadArrow, opts), @@ -270,15 +227,12 @@ export function getAssetUrlsByImport(opts) { 'arrowhead-square': formatAssetUrl(iconsArrowheadSquare, opts), 'arrowhead-triangle-inverted': formatAssetUrl(iconsArrowheadTriangleInverted, opts), 'arrowhead-triangle': formatAssetUrl(iconsArrowheadTriangle, opts), - 'aspect-ratio': formatAssetUrl(iconsAspectRatio, opts), - avatar: formatAssetUrl(iconsAvatar, opts), blob: formatAssetUrl(iconsBlob, opts), 'bring-forward': formatAssetUrl(iconsBringForward, opts), 'bring-to-front': formatAssetUrl(iconsBringToFront, opts), + broken: formatAssetUrl(iconsBroken, opts), 'check-circle': formatAssetUrl(iconsCheckCircle, opts), check: formatAssetUrl(iconsCheck, opts), - 'checkbox-checked': formatAssetUrl(iconsCheckboxChecked, opts), - 'checkbox-empty': formatAssetUrl(iconsCheckboxEmpty, opts), 'chevron-down': formatAssetUrl(iconsChevronDown, opts), 'chevron-left': formatAssetUrl(iconsChevronLeft, opts), 'chevron-right': formatAssetUrl(iconsChevronRight, opts), @@ -287,17 +241,14 @@ export function getAssetUrlsByImport(opts) { 'chevrons-sw': formatAssetUrl(iconsChevronsSw, opts), 'clipboard-copied': formatAssetUrl(iconsClipboardCopied, opts), 'clipboard-copy': formatAssetUrl(iconsClipboardCopy, opts), - code: formatAssetUrl(iconsCode, opts), - collab: formatAssetUrl(iconsCollab, opts), color: formatAssetUrl(iconsColor, opts), - comment: formatAssetUrl(iconsComment, opts), 'cross-2': formatAssetUrl(iconsCross2, opts), 'cross-circle': formatAssetUrl(iconsCrossCircle, opts), - cross: formatAssetUrl(iconsCross, opts), 'dash-dashed': formatAssetUrl(iconsDashDashed, opts), 'dash-dotted': formatAssetUrl(iconsDashDotted, opts), 'dash-draw': formatAssetUrl(iconsDashDraw, opts), 'dash-solid': formatAssetUrl(iconsDashSolid, opts), + disconnected: formatAssetUrl(iconsDisconnected, opts), discord: formatAssetUrl(iconsDiscord, opts), 'distribute-horizontal': formatAssetUrl(iconsDistributeHorizontal, opts), 'distribute-vertical': formatAssetUrl(iconsDistributeVertical, opts), @@ -307,9 +258,7 @@ export function getAssetUrlsByImport(opts) { 'drag-handle-dots': formatAssetUrl(iconsDragHandleDots, opts), duplicate: formatAssetUrl(iconsDuplicate, opts), edit: formatAssetUrl(iconsEdit, opts), - error: formatAssetUrl(iconsError, opts), 'external-link': formatAssetUrl(iconsExternalLink, opts), - file: formatAssetUrl(iconsFile, opts), 'fill-none': formatAssetUrl(iconsFillNone, opts), 'fill-pattern': formatAssetUrl(iconsFillPattern, opts), 'fill-semi': formatAssetUrl(iconsFillSemi, opts), @@ -341,18 +290,16 @@ export function getAssetUrlsByImport(opts) { 'geo-x-box': formatAssetUrl(iconsGeoXBox, opts), github: formatAssetUrl(iconsGithub, opts), group: formatAssetUrl(iconsGroup, opts), - hidden: formatAssetUrl(iconsHidden, opts), - image: formatAssetUrl(iconsImage, opts), + 'horizontal-align-end': formatAssetUrl(iconsHorizontalAlignEnd, opts), + 'horizontal-align-middle': formatAssetUrl(iconsHorizontalAlignMiddle, opts), + 'horizontal-align-start': formatAssetUrl(iconsHorizontalAlignStart, opts), 'info-circle': formatAssetUrl(iconsInfoCircle, opts), leading: formatAssetUrl(iconsLeading, opts), link: formatAssetUrl(iconsLink, opts), - 'lock-small': formatAssetUrl(iconsLockSmall, opts), - lock: formatAssetUrl(iconsLock, opts), menu: formatAssetUrl(iconsMenu, opts), minus: formatAssetUrl(iconsMinus, opts), mixed: formatAssetUrl(iconsMixed, opts), pack: formatAssetUrl(iconsPack, opts), - page: formatAssetUrl(iconsPage, opts), plus: formatAssetUrl(iconsPlus, opts), 'question-mark-circle': formatAssetUrl(iconsQuestionMarkCircle, opts), 'question-mark': formatAssetUrl(iconsQuestionMark, opts), @@ -360,33 +307,22 @@ export function getAssetUrlsByImport(opts) { 'reset-zoom': formatAssetUrl(iconsResetZoom, opts), 'rotate-ccw': formatAssetUrl(iconsRotateCcw, opts), 'rotate-cw': formatAssetUrl(iconsRotateCw, opts), - ruler: formatAssetUrl(iconsRuler, opts), - search: formatAssetUrl(iconsSearch, opts), 'send-backward': formatAssetUrl(iconsSendBackward, opts), 'send-to-back': formatAssetUrl(iconsSendToBack, opts), - 'settings-horizontal': formatAssetUrl(iconsSettingsHorizontal, opts), - 'settings-vertical-1': formatAssetUrl(iconsSettingsVertical1, opts), - 'settings-vertical': formatAssetUrl(iconsSettingsVertical, opts), - 'share-1': formatAssetUrl(iconsShare1, opts), - 'share-2': formatAssetUrl(iconsShare2, opts), 'size-extra-large': formatAssetUrl(iconsSizeExtraLarge, opts), 'size-large': formatAssetUrl(iconsSizeLarge, opts), 'size-medium': formatAssetUrl(iconsSizeMedium, opts), 'size-small': formatAssetUrl(iconsSizeSmall, opts), - 'spline-cubic': formatAssetUrl(iconsSplineCubic, opts), - 'spline-line': formatAssetUrl(iconsSplineLine, opts), 'stack-horizontal': formatAssetUrl(iconsStackHorizontal, opts), 'stack-vertical': formatAssetUrl(iconsStackVertical, opts), - 'status-offline': formatAssetUrl(iconsStatusOffline, opts), - 'status-online': formatAssetUrl(iconsStatusOnline, opts), 'stretch-horizontal': formatAssetUrl(iconsStretchHorizontal, opts), 'stretch-vertical': formatAssetUrl(iconsStretchVertical, opts), 'text-align-center': formatAssetUrl(iconsTextAlignCenter, opts), - 'text-align-justify': formatAssetUrl(iconsTextAlignJustify, opts), 'text-align-left': formatAssetUrl(iconsTextAlignLeft, opts), 'text-align-right': formatAssetUrl(iconsTextAlignRight, opts), + 'toggle-off': formatAssetUrl(iconsToggleOff, opts), + 'toggle-on': formatAssetUrl(iconsToggleOn, opts), 'tool-arrow': formatAssetUrl(iconsToolArrow, opts), - 'tool-embed': formatAssetUrl(iconsToolEmbed, opts), 'tool-eraser': formatAssetUrl(iconsToolEraser, opts), 'tool-frame': formatAssetUrl(iconsToolFrame, opts), 'tool-hand': formatAssetUrl(iconsToolHand, opts), @@ -397,19 +333,15 @@ export function getAssetUrlsByImport(opts) { 'tool-note': formatAssetUrl(iconsToolNote, opts), 'tool-pencil': formatAssetUrl(iconsToolPencil, opts), 'tool-pointer': formatAssetUrl(iconsToolPointer, opts), + 'tool-screenshot': formatAssetUrl(iconsToolScreenshot, opts), 'tool-text': formatAssetUrl(iconsToolText, opts), trash: formatAssetUrl(iconsTrash, opts), - 'triangle-down': formatAssetUrl(iconsTriangleDown, opts), - 'triangle-up': formatAssetUrl(iconsTriangleUp, opts), twitter: formatAssetUrl(iconsTwitter, opts), undo: formatAssetUrl(iconsUndo, opts), ungroup: formatAssetUrl(iconsUngroup, opts), - 'unlock-small': formatAssetUrl(iconsUnlockSmall, opts), - unlock: formatAssetUrl(iconsUnlock, opts), - 'vertical-align-center': formatAssetUrl(iconsVerticalAlignCenter, opts), 'vertical-align-end': formatAssetUrl(iconsVerticalAlignEnd, opts), + 'vertical-align-middle': formatAssetUrl(iconsVerticalAlignMiddle, opts), 'vertical-align-start': formatAssetUrl(iconsVerticalAlignStart, opts), - visible: formatAssetUrl(iconsVisible, opts), 'warning-triangle': formatAssetUrl(iconsWarningTriangle, opts), 'zoom-in': formatAssetUrl(iconsZoomIn, opts), 'zoom-out': formatAssetUrl(iconsZoomOut, opts), diff --git a/packages/assets/imports.vite.js b/packages/assets/imports.vite.js index e8b8cc70c..beb14f971 100644 --- a/packages/assets/imports.vite.js +++ b/packages/assets/imports.vite.js @@ -27,20 +27,11 @@ import fontsMonospace from './fonts/IBMPlexMono-Medium.woff2?url' import fontsSansSerif from './fonts/IBMPlexSans-Medium.woff2?url' import fontsSerif from './fonts/IBMPlexSerif-Medium.woff2?url' import fontsDraw from './fonts/Shantell_Sans-Tldrawish.woff2?url' -import iconsAlignBottomCenter from './icons/icon/align-bottom-center.svg?url' -import iconsAlignBottomLeft from './icons/icon/align-bottom-left.svg?url' -import iconsAlignBottomRight from './icons/icon/align-bottom-right.svg?url' import iconsAlignBottom from './icons/icon/align-bottom.svg?url' -import iconsAlignCenterCenter from './icons/icon/align-center-center.svg?url' import iconsAlignCenterHorizontal from './icons/icon/align-center-horizontal.svg?url' -import iconsAlignCenterLeft from './icons/icon/align-center-left.svg?url' -import iconsAlignCenterRight from './icons/icon/align-center-right.svg?url' import iconsAlignCenterVertical from './icons/icon/align-center-vertical.svg?url' import iconsAlignLeft from './icons/icon/align-left.svg?url' import iconsAlignRight from './icons/icon/align-right.svg?url' -import iconsAlignTopCenter from './icons/icon/align-top-center.svg?url' -import iconsAlignTopLeft from './icons/icon/align-top-left.svg?url' -import iconsAlignTopRight from './icons/icon/align-top-right.svg?url' import iconsAlignTop from './icons/icon/align-top.svg?url' import iconsArrowLeft from './icons/icon/arrow-left.svg?url' import iconsArrowheadArrow from './icons/icon/arrowhead-arrow.svg?url' @@ -51,15 +42,12 @@ import iconsArrowheadNone from './icons/icon/arrowhead-none.svg?url' import iconsArrowheadSquare from './icons/icon/arrowhead-square.svg?url' import iconsArrowheadTriangleInverted from './icons/icon/arrowhead-triangle-inverted.svg?url' import iconsArrowheadTriangle from './icons/icon/arrowhead-triangle.svg?url' -import iconsAspectRatio from './icons/icon/aspect-ratio.svg?url' -import iconsAvatar from './icons/icon/avatar.svg?url' import iconsBlob from './icons/icon/blob.svg?url' import iconsBringForward from './icons/icon/bring-forward.svg?url' import iconsBringToFront from './icons/icon/bring-to-front.svg?url' +import iconsBroken from './icons/icon/broken.svg?url' import iconsCheckCircle from './icons/icon/check-circle.svg?url' import iconsCheck from './icons/icon/check.svg?url' -import iconsCheckboxChecked from './icons/icon/checkbox-checked.svg?url' -import iconsCheckboxEmpty from './icons/icon/checkbox-empty.svg?url' import iconsChevronDown from './icons/icon/chevron-down.svg?url' import iconsChevronLeft from './icons/icon/chevron-left.svg?url' import iconsChevronRight from './icons/icon/chevron-right.svg?url' @@ -68,17 +56,14 @@ import iconsChevronsNe from './icons/icon/chevrons-ne.svg?url' import iconsChevronsSw from './icons/icon/chevrons-sw.svg?url' import iconsClipboardCopied from './icons/icon/clipboard-copied.svg?url' import iconsClipboardCopy from './icons/icon/clipboard-copy.svg?url' -import iconsCode from './icons/icon/code.svg?url' -import iconsCollab from './icons/icon/collab.svg?url' import iconsColor from './icons/icon/color.svg?url' -import iconsComment from './icons/icon/comment.svg?url' import iconsCross2 from './icons/icon/cross-2.svg?url' import iconsCrossCircle from './icons/icon/cross-circle.svg?url' -import iconsCross from './icons/icon/cross.svg?url' import iconsDashDashed from './icons/icon/dash-dashed.svg?url' import iconsDashDotted from './icons/icon/dash-dotted.svg?url' import iconsDashDraw from './icons/icon/dash-draw.svg?url' import iconsDashSolid from './icons/icon/dash-solid.svg?url' +import iconsDisconnected from './icons/icon/disconnected.svg?url' import iconsDiscord from './icons/icon/discord.svg?url' import iconsDistributeHorizontal from './icons/icon/distribute-horizontal.svg?url' import iconsDistributeVertical from './icons/icon/distribute-vertical.svg?url' @@ -88,9 +73,7 @@ import iconsDotsVertical from './icons/icon/dots-vertical.svg?url' import iconsDragHandleDots from './icons/icon/drag-handle-dots.svg?url' import iconsDuplicate from './icons/icon/duplicate.svg?url' import iconsEdit from './icons/icon/edit.svg?url' -import iconsError from './icons/icon/error.svg?url' import iconsExternalLink from './icons/icon/external-link.svg?url' -import iconsFile from './icons/icon/file.svg?url' import iconsFillNone from './icons/icon/fill-none.svg?url' import iconsFillPattern from './icons/icon/fill-pattern.svg?url' import iconsFillSemi from './icons/icon/fill-semi.svg?url' @@ -122,18 +105,16 @@ import iconsGeoTriangle from './icons/icon/geo-triangle.svg?url' import iconsGeoXBox from './icons/icon/geo-x-box.svg?url' import iconsGithub from './icons/icon/github.svg?url' import iconsGroup from './icons/icon/group.svg?url' -import iconsHidden from './icons/icon/hidden.svg?url' -import iconsImage from './icons/icon/image.svg?url' +import iconsHorizontalAlignEnd from './icons/icon/horizontal-align-end.svg?url' +import iconsHorizontalAlignMiddle from './icons/icon/horizontal-align-middle.svg?url' +import iconsHorizontalAlignStart from './icons/icon/horizontal-align-start.svg?url' import iconsInfoCircle from './icons/icon/info-circle.svg?url' import iconsLeading from './icons/icon/leading.svg?url' import iconsLink from './icons/icon/link.svg?url' -import iconsLockSmall from './icons/icon/lock-small.svg?url' -import iconsLock from './icons/icon/lock.svg?url' import iconsMenu from './icons/icon/menu.svg?url' import iconsMinus from './icons/icon/minus.svg?url' import iconsMixed from './icons/icon/mixed.svg?url' import iconsPack from './icons/icon/pack.svg?url' -import iconsPage from './icons/icon/page.svg?url' import iconsPlus from './icons/icon/plus.svg?url' import iconsQuestionMarkCircle from './icons/icon/question-mark-circle.svg?url' import iconsQuestionMark from './icons/icon/question-mark.svg?url' @@ -141,33 +122,22 @@ import iconsRedo from './icons/icon/redo.svg?url' import iconsResetZoom from './icons/icon/reset-zoom.svg?url' import iconsRotateCcw from './icons/icon/rotate-ccw.svg?url' import iconsRotateCw from './icons/icon/rotate-cw.svg?url' -import iconsRuler from './icons/icon/ruler.svg?url' -import iconsSearch from './icons/icon/search.svg?url' import iconsSendBackward from './icons/icon/send-backward.svg?url' import iconsSendToBack from './icons/icon/send-to-back.svg?url' -import iconsSettingsHorizontal from './icons/icon/settings-horizontal.svg?url' -import iconsSettingsVertical1 from './icons/icon/settings-vertical-1.svg?url' -import iconsSettingsVertical from './icons/icon/settings-vertical.svg?url' -import iconsShare1 from './icons/icon/share-1.svg?url' -import iconsShare2 from './icons/icon/share-2.svg?url' import iconsSizeExtraLarge from './icons/icon/size-extra-large.svg?url' import iconsSizeLarge from './icons/icon/size-large.svg?url' import iconsSizeMedium from './icons/icon/size-medium.svg?url' import iconsSizeSmall from './icons/icon/size-small.svg?url' -import iconsSplineCubic from './icons/icon/spline-cubic.svg?url' -import iconsSplineLine from './icons/icon/spline-line.svg?url' import iconsStackHorizontal from './icons/icon/stack-horizontal.svg?url' import iconsStackVertical from './icons/icon/stack-vertical.svg?url' -import iconsStatusOffline from './icons/icon/status-offline.svg?url' -import iconsStatusOnline from './icons/icon/status-online.svg?url' import iconsStretchHorizontal from './icons/icon/stretch-horizontal.svg?url' import iconsStretchVertical from './icons/icon/stretch-vertical.svg?url' import iconsTextAlignCenter from './icons/icon/text-align-center.svg?url' -import iconsTextAlignJustify from './icons/icon/text-align-justify.svg?url' import iconsTextAlignLeft from './icons/icon/text-align-left.svg?url' import iconsTextAlignRight from './icons/icon/text-align-right.svg?url' +import iconsToggleOff from './icons/icon/toggle-off.svg?url' +import iconsToggleOn from './icons/icon/toggle-on.svg?url' import iconsToolArrow from './icons/icon/tool-arrow.svg?url' -import iconsToolEmbed from './icons/icon/tool-embed.svg?url' import iconsToolEraser from './icons/icon/tool-eraser.svg?url' import iconsToolFrame from './icons/icon/tool-frame.svg?url' import iconsToolHand from './icons/icon/tool-hand.svg?url' @@ -178,19 +148,15 @@ import iconsToolMedia from './icons/icon/tool-media.svg?url' import iconsToolNote from './icons/icon/tool-note.svg?url' import iconsToolPencil from './icons/icon/tool-pencil.svg?url' import iconsToolPointer from './icons/icon/tool-pointer.svg?url' +import iconsToolScreenshot from './icons/icon/tool-screenshot.svg?url' import iconsToolText from './icons/icon/tool-text.svg?url' import iconsTrash from './icons/icon/trash.svg?url' -import iconsTriangleDown from './icons/icon/triangle-down.svg?url' -import iconsTriangleUp from './icons/icon/triangle-up.svg?url' import iconsTwitter from './icons/icon/twitter.svg?url' import iconsUndo from './icons/icon/undo.svg?url' import iconsUngroup from './icons/icon/ungroup.svg?url' -import iconsUnlockSmall from './icons/icon/unlock-small.svg?url' -import iconsUnlock from './icons/icon/unlock.svg?url' -import iconsVerticalAlignCenter from './icons/icon/vertical-align-center.svg?url' import iconsVerticalAlignEnd from './icons/icon/vertical-align-end.svg?url' +import iconsVerticalAlignMiddle from './icons/icon/vertical-align-middle.svg?url' import iconsVerticalAlignStart from './icons/icon/vertical-align-start.svg?url' -import iconsVisible from './icons/icon/visible.svg?url' import iconsWarningTriangle from './icons/icon/warning-triangle.svg?url' import iconsZoomIn from './icons/icon/zoom-in.svg?url' import iconsZoomOut from './icons/icon/zoom-out.svg?url' @@ -246,20 +212,11 @@ export function getAssetUrlsByImport(opts) { draw: formatAssetUrl(fontsDraw, opts), }, icons: { - 'align-bottom-center': formatAssetUrl(iconsAlignBottomCenter, opts), - 'align-bottom-left': formatAssetUrl(iconsAlignBottomLeft, opts), - 'align-bottom-right': formatAssetUrl(iconsAlignBottomRight, opts), 'align-bottom': formatAssetUrl(iconsAlignBottom, opts), - 'align-center-center': formatAssetUrl(iconsAlignCenterCenter, opts), 'align-center-horizontal': formatAssetUrl(iconsAlignCenterHorizontal, opts), - 'align-center-left': formatAssetUrl(iconsAlignCenterLeft, opts), - 'align-center-right': formatAssetUrl(iconsAlignCenterRight, opts), 'align-center-vertical': formatAssetUrl(iconsAlignCenterVertical, opts), 'align-left': formatAssetUrl(iconsAlignLeft, opts), 'align-right': formatAssetUrl(iconsAlignRight, opts), - 'align-top-center': formatAssetUrl(iconsAlignTopCenter, opts), - 'align-top-left': formatAssetUrl(iconsAlignTopLeft, opts), - 'align-top-right': formatAssetUrl(iconsAlignTopRight, opts), 'align-top': formatAssetUrl(iconsAlignTop, opts), 'arrow-left': formatAssetUrl(iconsArrowLeft, opts), 'arrowhead-arrow': formatAssetUrl(iconsArrowheadArrow, opts), @@ -270,15 +227,12 @@ export function getAssetUrlsByImport(opts) { 'arrowhead-square': formatAssetUrl(iconsArrowheadSquare, opts), 'arrowhead-triangle-inverted': formatAssetUrl(iconsArrowheadTriangleInverted, opts), 'arrowhead-triangle': formatAssetUrl(iconsArrowheadTriangle, opts), - 'aspect-ratio': formatAssetUrl(iconsAspectRatio, opts), - avatar: formatAssetUrl(iconsAvatar, opts), blob: formatAssetUrl(iconsBlob, opts), 'bring-forward': formatAssetUrl(iconsBringForward, opts), 'bring-to-front': formatAssetUrl(iconsBringToFront, opts), + broken: formatAssetUrl(iconsBroken, opts), 'check-circle': formatAssetUrl(iconsCheckCircle, opts), check: formatAssetUrl(iconsCheck, opts), - 'checkbox-checked': formatAssetUrl(iconsCheckboxChecked, opts), - 'checkbox-empty': formatAssetUrl(iconsCheckboxEmpty, opts), 'chevron-down': formatAssetUrl(iconsChevronDown, opts), 'chevron-left': formatAssetUrl(iconsChevronLeft, opts), 'chevron-right': formatAssetUrl(iconsChevronRight, opts), @@ -287,17 +241,14 @@ export function getAssetUrlsByImport(opts) { 'chevrons-sw': formatAssetUrl(iconsChevronsSw, opts), 'clipboard-copied': formatAssetUrl(iconsClipboardCopied, opts), 'clipboard-copy': formatAssetUrl(iconsClipboardCopy, opts), - code: formatAssetUrl(iconsCode, opts), - collab: formatAssetUrl(iconsCollab, opts), color: formatAssetUrl(iconsColor, opts), - comment: formatAssetUrl(iconsComment, opts), 'cross-2': formatAssetUrl(iconsCross2, opts), 'cross-circle': formatAssetUrl(iconsCrossCircle, opts), - cross: formatAssetUrl(iconsCross, opts), 'dash-dashed': formatAssetUrl(iconsDashDashed, opts), 'dash-dotted': formatAssetUrl(iconsDashDotted, opts), 'dash-draw': formatAssetUrl(iconsDashDraw, opts), 'dash-solid': formatAssetUrl(iconsDashSolid, opts), + disconnected: formatAssetUrl(iconsDisconnected, opts), discord: formatAssetUrl(iconsDiscord, opts), 'distribute-horizontal': formatAssetUrl(iconsDistributeHorizontal, opts), 'distribute-vertical': formatAssetUrl(iconsDistributeVertical, opts), @@ -307,9 +258,7 @@ export function getAssetUrlsByImport(opts) { 'drag-handle-dots': formatAssetUrl(iconsDragHandleDots, opts), duplicate: formatAssetUrl(iconsDuplicate, opts), edit: formatAssetUrl(iconsEdit, opts), - error: formatAssetUrl(iconsError, opts), 'external-link': formatAssetUrl(iconsExternalLink, opts), - file: formatAssetUrl(iconsFile, opts), 'fill-none': formatAssetUrl(iconsFillNone, opts), 'fill-pattern': formatAssetUrl(iconsFillPattern, opts), 'fill-semi': formatAssetUrl(iconsFillSemi, opts), @@ -341,18 +290,16 @@ export function getAssetUrlsByImport(opts) { 'geo-x-box': formatAssetUrl(iconsGeoXBox, opts), github: formatAssetUrl(iconsGithub, opts), group: formatAssetUrl(iconsGroup, opts), - hidden: formatAssetUrl(iconsHidden, opts), - image: formatAssetUrl(iconsImage, opts), + 'horizontal-align-end': formatAssetUrl(iconsHorizontalAlignEnd, opts), + 'horizontal-align-middle': formatAssetUrl(iconsHorizontalAlignMiddle, opts), + 'horizontal-align-start': formatAssetUrl(iconsHorizontalAlignStart, opts), 'info-circle': formatAssetUrl(iconsInfoCircle, opts), leading: formatAssetUrl(iconsLeading, opts), link: formatAssetUrl(iconsLink, opts), - 'lock-small': formatAssetUrl(iconsLockSmall, opts), - lock: formatAssetUrl(iconsLock, opts), menu: formatAssetUrl(iconsMenu, opts), minus: formatAssetUrl(iconsMinus, opts), mixed: formatAssetUrl(iconsMixed, opts), pack: formatAssetUrl(iconsPack, opts), - page: formatAssetUrl(iconsPage, opts), plus: formatAssetUrl(iconsPlus, opts), 'question-mark-circle': formatAssetUrl(iconsQuestionMarkCircle, opts), 'question-mark': formatAssetUrl(iconsQuestionMark, opts), @@ -360,33 +307,22 @@ export function getAssetUrlsByImport(opts) { 'reset-zoom': formatAssetUrl(iconsResetZoom, opts), 'rotate-ccw': formatAssetUrl(iconsRotateCcw, opts), 'rotate-cw': formatAssetUrl(iconsRotateCw, opts), - ruler: formatAssetUrl(iconsRuler, opts), - search: formatAssetUrl(iconsSearch, opts), 'send-backward': formatAssetUrl(iconsSendBackward, opts), 'send-to-back': formatAssetUrl(iconsSendToBack, opts), - 'settings-horizontal': formatAssetUrl(iconsSettingsHorizontal, opts), - 'settings-vertical-1': formatAssetUrl(iconsSettingsVertical1, opts), - 'settings-vertical': formatAssetUrl(iconsSettingsVertical, opts), - 'share-1': formatAssetUrl(iconsShare1, opts), - 'share-2': formatAssetUrl(iconsShare2, opts), 'size-extra-large': formatAssetUrl(iconsSizeExtraLarge, opts), 'size-large': formatAssetUrl(iconsSizeLarge, opts), 'size-medium': formatAssetUrl(iconsSizeMedium, opts), 'size-small': formatAssetUrl(iconsSizeSmall, opts), - 'spline-cubic': formatAssetUrl(iconsSplineCubic, opts), - 'spline-line': formatAssetUrl(iconsSplineLine, opts), 'stack-horizontal': formatAssetUrl(iconsStackHorizontal, opts), 'stack-vertical': formatAssetUrl(iconsStackVertical, opts), - 'status-offline': formatAssetUrl(iconsStatusOffline, opts), - 'status-online': formatAssetUrl(iconsStatusOnline, opts), 'stretch-horizontal': formatAssetUrl(iconsStretchHorizontal, opts), 'stretch-vertical': formatAssetUrl(iconsStretchVertical, opts), 'text-align-center': formatAssetUrl(iconsTextAlignCenter, opts), - 'text-align-justify': formatAssetUrl(iconsTextAlignJustify, opts), 'text-align-left': formatAssetUrl(iconsTextAlignLeft, opts), 'text-align-right': formatAssetUrl(iconsTextAlignRight, opts), + 'toggle-off': formatAssetUrl(iconsToggleOff, opts), + 'toggle-on': formatAssetUrl(iconsToggleOn, opts), 'tool-arrow': formatAssetUrl(iconsToolArrow, opts), - 'tool-embed': formatAssetUrl(iconsToolEmbed, opts), 'tool-eraser': formatAssetUrl(iconsToolEraser, opts), 'tool-frame': formatAssetUrl(iconsToolFrame, opts), 'tool-hand': formatAssetUrl(iconsToolHand, opts), @@ -397,19 +333,15 @@ export function getAssetUrlsByImport(opts) { 'tool-note': formatAssetUrl(iconsToolNote, opts), 'tool-pencil': formatAssetUrl(iconsToolPencil, opts), 'tool-pointer': formatAssetUrl(iconsToolPointer, opts), + 'tool-screenshot': formatAssetUrl(iconsToolScreenshot, opts), 'tool-text': formatAssetUrl(iconsToolText, opts), trash: formatAssetUrl(iconsTrash, opts), - 'triangle-down': formatAssetUrl(iconsTriangleDown, opts), - 'triangle-up': formatAssetUrl(iconsTriangleUp, opts), twitter: formatAssetUrl(iconsTwitter, opts), undo: formatAssetUrl(iconsUndo, opts), ungroup: formatAssetUrl(iconsUngroup, opts), - 'unlock-small': formatAssetUrl(iconsUnlockSmall, opts), - unlock: formatAssetUrl(iconsUnlock, opts), - 'vertical-align-center': formatAssetUrl(iconsVerticalAlignCenter, opts), 'vertical-align-end': formatAssetUrl(iconsVerticalAlignEnd, opts), + 'vertical-align-middle': formatAssetUrl(iconsVerticalAlignMiddle, opts), 'vertical-align-start': formatAssetUrl(iconsVerticalAlignStart, opts), - visible: formatAssetUrl(iconsVisible, opts), 'warning-triangle': formatAssetUrl(iconsWarningTriangle, opts), 'zoom-in': formatAssetUrl(iconsZoomIn, opts), 'zoom-out': formatAssetUrl(iconsZoomOut, opts), diff --git a/packages/assets/selfHosted.js b/packages/assets/selfHosted.js index 0e07f3826..2a24a3424 100644 --- a/packages/assets/selfHosted.js +++ b/packages/assets/selfHosted.js @@ -18,20 +18,11 @@ export function getAssetUrls(opts) { draw: formatAssetUrl('./fonts/Shantell_Sans-Tldrawish.woff2', opts), }, icons: { - 'align-bottom-center': formatAssetUrl('./icons/icon/align-bottom-center.svg', opts), - 'align-bottom-left': formatAssetUrl('./icons/icon/align-bottom-left.svg', opts), - 'align-bottom-right': formatAssetUrl('./icons/icon/align-bottom-right.svg', opts), 'align-bottom': formatAssetUrl('./icons/icon/align-bottom.svg', opts), - 'align-center-center': formatAssetUrl('./icons/icon/align-center-center.svg', opts), 'align-center-horizontal': formatAssetUrl('./icons/icon/align-center-horizontal.svg', opts), - 'align-center-left': formatAssetUrl('./icons/icon/align-center-left.svg', opts), - 'align-center-right': formatAssetUrl('./icons/icon/align-center-right.svg', opts), 'align-center-vertical': formatAssetUrl('./icons/icon/align-center-vertical.svg', opts), 'align-left': formatAssetUrl('./icons/icon/align-left.svg', opts), 'align-right': formatAssetUrl('./icons/icon/align-right.svg', opts), - 'align-top-center': formatAssetUrl('./icons/icon/align-top-center.svg', opts), - 'align-top-left': formatAssetUrl('./icons/icon/align-top-left.svg', opts), - 'align-top-right': formatAssetUrl('./icons/icon/align-top-right.svg', opts), 'align-top': formatAssetUrl('./icons/icon/align-top.svg', opts), 'arrow-left': formatAssetUrl('./icons/icon/arrow-left.svg', opts), 'arrowhead-arrow': formatAssetUrl('./icons/icon/arrowhead-arrow.svg', opts), @@ -45,15 +36,12 @@ export function getAssetUrls(opts) { opts ), 'arrowhead-triangle': formatAssetUrl('./icons/icon/arrowhead-triangle.svg', opts), - 'aspect-ratio': formatAssetUrl('./icons/icon/aspect-ratio.svg', opts), - avatar: formatAssetUrl('./icons/icon/avatar.svg', opts), blob: formatAssetUrl('./icons/icon/blob.svg', opts), 'bring-forward': formatAssetUrl('./icons/icon/bring-forward.svg', opts), 'bring-to-front': formatAssetUrl('./icons/icon/bring-to-front.svg', opts), + broken: formatAssetUrl('./icons/icon/broken.svg', opts), 'check-circle': formatAssetUrl('./icons/icon/check-circle.svg', opts), check: formatAssetUrl('./icons/icon/check.svg', opts), - 'checkbox-checked': formatAssetUrl('./icons/icon/checkbox-checked.svg', opts), - 'checkbox-empty': formatAssetUrl('./icons/icon/checkbox-empty.svg', opts), 'chevron-down': formatAssetUrl('./icons/icon/chevron-down.svg', opts), 'chevron-left': formatAssetUrl('./icons/icon/chevron-left.svg', opts), 'chevron-right': formatAssetUrl('./icons/icon/chevron-right.svg', opts), @@ -62,17 +50,14 @@ export function getAssetUrls(opts) { 'chevrons-sw': formatAssetUrl('./icons/icon/chevrons-sw.svg', opts), 'clipboard-copied': formatAssetUrl('./icons/icon/clipboard-copied.svg', opts), 'clipboard-copy': formatAssetUrl('./icons/icon/clipboard-copy.svg', opts), - code: formatAssetUrl('./icons/icon/code.svg', opts), - collab: formatAssetUrl('./icons/icon/collab.svg', opts), color: formatAssetUrl('./icons/icon/color.svg', opts), - comment: formatAssetUrl('./icons/icon/comment.svg', opts), 'cross-2': formatAssetUrl('./icons/icon/cross-2.svg', opts), 'cross-circle': formatAssetUrl('./icons/icon/cross-circle.svg', opts), - cross: formatAssetUrl('./icons/icon/cross.svg', opts), 'dash-dashed': formatAssetUrl('./icons/icon/dash-dashed.svg', opts), 'dash-dotted': formatAssetUrl('./icons/icon/dash-dotted.svg', opts), 'dash-draw': formatAssetUrl('./icons/icon/dash-draw.svg', opts), 'dash-solid': formatAssetUrl('./icons/icon/dash-solid.svg', opts), + disconnected: formatAssetUrl('./icons/icon/disconnected.svg', opts), discord: formatAssetUrl('./icons/icon/discord.svg', opts), 'distribute-horizontal': formatAssetUrl('./icons/icon/distribute-horizontal.svg', opts), 'distribute-vertical': formatAssetUrl('./icons/icon/distribute-vertical.svg', opts), @@ -82,9 +67,7 @@ export function getAssetUrls(opts) { 'drag-handle-dots': formatAssetUrl('./icons/icon/drag-handle-dots.svg', opts), duplicate: formatAssetUrl('./icons/icon/duplicate.svg', opts), edit: formatAssetUrl('./icons/icon/edit.svg', opts), - error: formatAssetUrl('./icons/icon/error.svg', opts), 'external-link': formatAssetUrl('./icons/icon/external-link.svg', opts), - file: formatAssetUrl('./icons/icon/file.svg', opts), 'fill-none': formatAssetUrl('./icons/icon/fill-none.svg', opts), 'fill-pattern': formatAssetUrl('./icons/icon/fill-pattern.svg', opts), 'fill-semi': formatAssetUrl('./icons/icon/fill-semi.svg', opts), @@ -116,18 +99,16 @@ export function getAssetUrls(opts) { 'geo-x-box': formatAssetUrl('./icons/icon/geo-x-box.svg', opts), github: formatAssetUrl('./icons/icon/github.svg', opts), group: formatAssetUrl('./icons/icon/group.svg', opts), - hidden: formatAssetUrl('./icons/icon/hidden.svg', opts), - image: formatAssetUrl('./icons/icon/image.svg', opts), + 'horizontal-align-end': formatAssetUrl('./icons/icon/horizontal-align-end.svg', opts), + 'horizontal-align-middle': formatAssetUrl('./icons/icon/horizontal-align-middle.svg', opts), + 'horizontal-align-start': formatAssetUrl('./icons/icon/horizontal-align-start.svg', opts), 'info-circle': formatAssetUrl('./icons/icon/info-circle.svg', opts), leading: formatAssetUrl('./icons/icon/leading.svg', opts), link: formatAssetUrl('./icons/icon/link.svg', opts), - 'lock-small': formatAssetUrl('./icons/icon/lock-small.svg', opts), - lock: formatAssetUrl('./icons/icon/lock.svg', opts), menu: formatAssetUrl('./icons/icon/menu.svg', opts), minus: formatAssetUrl('./icons/icon/minus.svg', opts), mixed: formatAssetUrl('./icons/icon/mixed.svg', opts), pack: formatAssetUrl('./icons/icon/pack.svg', opts), - page: formatAssetUrl('./icons/icon/page.svg', opts), plus: formatAssetUrl('./icons/icon/plus.svg', opts), 'question-mark-circle': formatAssetUrl('./icons/icon/question-mark-circle.svg', opts), 'question-mark': formatAssetUrl('./icons/icon/question-mark.svg', opts), @@ -135,33 +116,22 @@ export function getAssetUrls(opts) { 'reset-zoom': formatAssetUrl('./icons/icon/reset-zoom.svg', opts), 'rotate-ccw': formatAssetUrl('./icons/icon/rotate-ccw.svg', opts), 'rotate-cw': formatAssetUrl('./icons/icon/rotate-cw.svg', opts), - ruler: formatAssetUrl('./icons/icon/ruler.svg', opts), - search: formatAssetUrl('./icons/icon/search.svg', opts), 'send-backward': formatAssetUrl('./icons/icon/send-backward.svg', opts), 'send-to-back': formatAssetUrl('./icons/icon/send-to-back.svg', opts), - 'settings-horizontal': formatAssetUrl('./icons/icon/settings-horizontal.svg', opts), - 'settings-vertical-1': formatAssetUrl('./icons/icon/settings-vertical-1.svg', opts), - 'settings-vertical': formatAssetUrl('./icons/icon/settings-vertical.svg', opts), - 'share-1': formatAssetUrl('./icons/icon/share-1.svg', opts), - 'share-2': formatAssetUrl('./icons/icon/share-2.svg', opts), 'size-extra-large': formatAssetUrl('./icons/icon/size-extra-large.svg', opts), 'size-large': formatAssetUrl('./icons/icon/size-large.svg', opts), 'size-medium': formatAssetUrl('./icons/icon/size-medium.svg', opts), 'size-small': formatAssetUrl('./icons/icon/size-small.svg', opts), - 'spline-cubic': formatAssetUrl('./icons/icon/spline-cubic.svg', opts), - 'spline-line': formatAssetUrl('./icons/icon/spline-line.svg', opts), 'stack-horizontal': formatAssetUrl('./icons/icon/stack-horizontal.svg', opts), 'stack-vertical': formatAssetUrl('./icons/icon/stack-vertical.svg', opts), - 'status-offline': formatAssetUrl('./icons/icon/status-offline.svg', opts), - 'status-online': formatAssetUrl('./icons/icon/status-online.svg', opts), 'stretch-horizontal': formatAssetUrl('./icons/icon/stretch-horizontal.svg', opts), 'stretch-vertical': formatAssetUrl('./icons/icon/stretch-vertical.svg', opts), 'text-align-center': formatAssetUrl('./icons/icon/text-align-center.svg', opts), - 'text-align-justify': formatAssetUrl('./icons/icon/text-align-justify.svg', opts), 'text-align-left': formatAssetUrl('./icons/icon/text-align-left.svg', opts), 'text-align-right': formatAssetUrl('./icons/icon/text-align-right.svg', opts), + 'toggle-off': formatAssetUrl('./icons/icon/toggle-off.svg', opts), + 'toggle-on': formatAssetUrl('./icons/icon/toggle-on.svg', opts), 'tool-arrow': formatAssetUrl('./icons/icon/tool-arrow.svg', opts), - 'tool-embed': formatAssetUrl('./icons/icon/tool-embed.svg', opts), 'tool-eraser': formatAssetUrl('./icons/icon/tool-eraser.svg', opts), 'tool-frame': formatAssetUrl('./icons/icon/tool-frame.svg', opts), 'tool-hand': formatAssetUrl('./icons/icon/tool-hand.svg', opts), @@ -172,19 +142,15 @@ export function getAssetUrls(opts) { 'tool-note': formatAssetUrl('./icons/icon/tool-note.svg', opts), 'tool-pencil': formatAssetUrl('./icons/icon/tool-pencil.svg', opts), 'tool-pointer': formatAssetUrl('./icons/icon/tool-pointer.svg', opts), + 'tool-screenshot': formatAssetUrl('./icons/icon/tool-screenshot.svg', opts), 'tool-text': formatAssetUrl('./icons/icon/tool-text.svg', opts), trash: formatAssetUrl('./icons/icon/trash.svg', opts), - 'triangle-down': formatAssetUrl('./icons/icon/triangle-down.svg', opts), - 'triangle-up': formatAssetUrl('./icons/icon/triangle-up.svg', opts), twitter: formatAssetUrl('./icons/icon/twitter.svg', opts), undo: formatAssetUrl('./icons/icon/undo.svg', opts), ungroup: formatAssetUrl('./icons/icon/ungroup.svg', opts), - 'unlock-small': formatAssetUrl('./icons/icon/unlock-small.svg', opts), - unlock: formatAssetUrl('./icons/icon/unlock.svg', opts), - 'vertical-align-center': formatAssetUrl('./icons/icon/vertical-align-center.svg', opts), 'vertical-align-end': formatAssetUrl('./icons/icon/vertical-align-end.svg', opts), + 'vertical-align-middle': formatAssetUrl('./icons/icon/vertical-align-middle.svg', opts), 'vertical-align-start': formatAssetUrl('./icons/icon/vertical-align-start.svg', opts), - visible: formatAssetUrl('./icons/icon/visible.svg', opts), 'warning-triangle': formatAssetUrl('./icons/icon/warning-triangle.svg', opts), 'zoom-in': formatAssetUrl('./icons/icon/zoom-in.svg', opts), 'zoom-out': formatAssetUrl('./icons/icon/zoom-out.svg', opts), diff --git a/packages/assets/types.d.ts b/packages/assets/types.d.ts index 29b6d73c6..08397d089 100644 --- a/packages/assets/types.d.ts +++ b/packages/assets/types.d.ts @@ -11,20 +11,11 @@ export type AssetUrls = { draw: string } icons: { - 'align-bottom-center': string - 'align-bottom-left': string - 'align-bottom-right': string 'align-bottom': string - 'align-center-center': string 'align-center-horizontal': string - 'align-center-left': string - 'align-center-right': string 'align-center-vertical': string 'align-left': string 'align-right': string - 'align-top-center': string - 'align-top-left': string - 'align-top-right': string 'align-top': string 'arrow-left': string 'arrowhead-arrow': string @@ -35,15 +26,12 @@ export type AssetUrls = { 'arrowhead-square': string 'arrowhead-triangle-inverted': string 'arrowhead-triangle': string - 'aspect-ratio': string - avatar: string blob: string 'bring-forward': string 'bring-to-front': string + broken: string 'check-circle': string check: string - 'checkbox-checked': string - 'checkbox-empty': string 'chevron-down': string 'chevron-left': string 'chevron-right': string @@ -52,17 +40,14 @@ export type AssetUrls = { 'chevrons-sw': string 'clipboard-copied': string 'clipboard-copy': string - code: string - collab: string color: string - comment: string 'cross-2': string 'cross-circle': string - cross: string 'dash-dashed': string 'dash-dotted': string 'dash-draw': string 'dash-solid': string + disconnected: string discord: string 'distribute-horizontal': string 'distribute-vertical': string @@ -72,9 +57,7 @@ export type AssetUrls = { 'drag-handle-dots': string duplicate: string edit: string - error: string 'external-link': string - file: string 'fill-none': string 'fill-pattern': string 'fill-semi': string @@ -106,18 +89,16 @@ export type AssetUrls = { 'geo-x-box': string github: string group: string - hidden: string - image: string + 'horizontal-align-end': string + 'horizontal-align-middle': string + 'horizontal-align-start': string 'info-circle': string leading: string link: string - 'lock-small': string - lock: string menu: string minus: string mixed: string pack: string - page: string plus: string 'question-mark-circle': string 'question-mark': string @@ -125,33 +106,22 @@ export type AssetUrls = { 'reset-zoom': string 'rotate-ccw': string 'rotate-cw': string - ruler: string - search: string 'send-backward': string 'send-to-back': string - 'settings-horizontal': string - 'settings-vertical-1': string - 'settings-vertical': string - 'share-1': string - 'share-2': string 'size-extra-large': string 'size-large': string 'size-medium': string 'size-small': string - 'spline-cubic': string - 'spline-line': string 'stack-horizontal': string 'stack-vertical': string - 'status-offline': string - 'status-online': string 'stretch-horizontal': string 'stretch-vertical': string 'text-align-center': string - 'text-align-justify': string 'text-align-left': string 'text-align-right': string + 'toggle-off': string + 'toggle-on': string 'tool-arrow': string - 'tool-embed': string 'tool-eraser': string 'tool-frame': string 'tool-hand': string @@ -162,19 +132,15 @@ export type AssetUrls = { 'tool-note': string 'tool-pencil': string 'tool-pointer': string + 'tool-screenshot': string 'tool-text': string trash: string - 'triangle-down': string - 'triangle-up': string twitter: string undo: string ungroup: string - 'unlock-small': string - unlock: string - 'vertical-align-center': string 'vertical-align-end': string + 'vertical-align-middle': string 'vertical-align-start': string - visible: string 'warning-triangle': string 'zoom-in': string 'zoom-out': string diff --git a/packages/assets/urls.js b/packages/assets/urls.js index 94454ca47..15e74213d 100644 --- a/packages/assets/urls.js +++ b/packages/assets/urls.js @@ -30,38 +30,14 @@ export function getAssetUrlsByMetaUrl(opts) { ), }, icons: { - 'align-bottom-center': formatAssetUrl( - new URL('./icons/icon/align-bottom-center.svg', import.meta.url).href, - opts - ), - 'align-bottom-left': formatAssetUrl( - new URL('./icons/icon/align-bottom-left.svg', import.meta.url).href, - opts - ), - 'align-bottom-right': formatAssetUrl( - new URL('./icons/icon/align-bottom-right.svg', import.meta.url).href, - opts - ), 'align-bottom': formatAssetUrl( new URL('./icons/icon/align-bottom.svg', import.meta.url).href, opts ), - 'align-center-center': formatAssetUrl( - new URL('./icons/icon/align-center-center.svg', import.meta.url).href, - opts - ), 'align-center-horizontal': formatAssetUrl( new URL('./icons/icon/align-center-horizontal.svg', import.meta.url).href, opts ), - 'align-center-left': formatAssetUrl( - new URL('./icons/icon/align-center-left.svg', import.meta.url).href, - opts - ), - 'align-center-right': formatAssetUrl( - new URL('./icons/icon/align-center-right.svg', import.meta.url).href, - opts - ), 'align-center-vertical': formatAssetUrl( new URL('./icons/icon/align-center-vertical.svg', import.meta.url).href, opts @@ -74,18 +50,6 @@ export function getAssetUrlsByMetaUrl(opts) { new URL('./icons/icon/align-right.svg', import.meta.url).href, opts ), - 'align-top-center': formatAssetUrl( - new URL('./icons/icon/align-top-center.svg', import.meta.url).href, - opts - ), - 'align-top-left': formatAssetUrl( - new URL('./icons/icon/align-top-left.svg', import.meta.url).href, - opts - ), - 'align-top-right': formatAssetUrl( - new URL('./icons/icon/align-top-right.svg', import.meta.url).href, - opts - ), 'align-top': formatAssetUrl( new URL('./icons/icon/align-top.svg', import.meta.url).href, opts @@ -126,11 +90,6 @@ export function getAssetUrlsByMetaUrl(opts) { new URL('./icons/icon/arrowhead-triangle.svg', import.meta.url).href, opts ), - 'aspect-ratio': formatAssetUrl( - new URL('./icons/icon/aspect-ratio.svg', import.meta.url).href, - opts - ), - avatar: formatAssetUrl(new URL('./icons/icon/avatar.svg', import.meta.url).href, opts), blob: formatAssetUrl(new URL('./icons/icon/blob.svg', import.meta.url).href, opts), 'bring-forward': formatAssetUrl( new URL('./icons/icon/bring-forward.svg', import.meta.url).href, @@ -140,19 +99,12 @@ export function getAssetUrlsByMetaUrl(opts) { new URL('./icons/icon/bring-to-front.svg', import.meta.url).href, opts ), + broken: formatAssetUrl(new URL('./icons/icon/broken.svg', import.meta.url).href, opts), 'check-circle': formatAssetUrl( new URL('./icons/icon/check-circle.svg', import.meta.url).href, opts ), check: formatAssetUrl(new URL('./icons/icon/check.svg', import.meta.url).href, opts), - 'checkbox-checked': formatAssetUrl( - new URL('./icons/icon/checkbox-checked.svg', import.meta.url).href, - opts - ), - 'checkbox-empty': formatAssetUrl( - new URL('./icons/icon/checkbox-empty.svg', import.meta.url).href, - opts - ), 'chevron-down': formatAssetUrl( new URL('./icons/icon/chevron-down.svg', import.meta.url).href, opts @@ -185,16 +137,12 @@ export function getAssetUrlsByMetaUrl(opts) { new URL('./icons/icon/clipboard-copy.svg', import.meta.url).href, opts ), - code: formatAssetUrl(new URL('./icons/icon/code.svg', import.meta.url).href, opts), - collab: formatAssetUrl(new URL('./icons/icon/collab.svg', import.meta.url).href, opts), color: formatAssetUrl(new URL('./icons/icon/color.svg', import.meta.url).href, opts), - comment: formatAssetUrl(new URL('./icons/icon/comment.svg', import.meta.url).href, opts), 'cross-2': formatAssetUrl(new URL('./icons/icon/cross-2.svg', import.meta.url).href, opts), 'cross-circle': formatAssetUrl( new URL('./icons/icon/cross-circle.svg', import.meta.url).href, opts ), - cross: formatAssetUrl(new URL('./icons/icon/cross.svg', import.meta.url).href, opts), 'dash-dashed': formatAssetUrl( new URL('./icons/icon/dash-dashed.svg', import.meta.url).href, opts @@ -211,6 +159,10 @@ export function getAssetUrlsByMetaUrl(opts) { new URL('./icons/icon/dash-solid.svg', import.meta.url).href, opts ), + disconnected: formatAssetUrl( + new URL('./icons/icon/disconnected.svg', import.meta.url).href, + opts + ), discord: formatAssetUrl(new URL('./icons/icon/discord.svg', import.meta.url).href, opts), 'distribute-horizontal': formatAssetUrl( new URL('./icons/icon/distribute-horizontal.svg', import.meta.url).href, @@ -235,12 +187,10 @@ export function getAssetUrlsByMetaUrl(opts) { ), duplicate: formatAssetUrl(new URL('./icons/icon/duplicate.svg', import.meta.url).href, opts), edit: formatAssetUrl(new URL('./icons/icon/edit.svg', import.meta.url).href, opts), - error: formatAssetUrl(new URL('./icons/icon/error.svg', import.meta.url).href, opts), 'external-link': formatAssetUrl( new URL('./icons/icon/external-link.svg', import.meta.url).href, opts ), - file: formatAssetUrl(new URL('./icons/icon/file.svg', import.meta.url).href, opts), 'fill-none': formatAssetUrl( new URL('./icons/icon/fill-none.svg', import.meta.url).href, opts @@ -347,24 +297,28 @@ export function getAssetUrlsByMetaUrl(opts) { ), github: formatAssetUrl(new URL('./icons/icon/github.svg', import.meta.url).href, opts), group: formatAssetUrl(new URL('./icons/icon/group.svg', import.meta.url).href, opts), - hidden: formatAssetUrl(new URL('./icons/icon/hidden.svg', import.meta.url).href, opts), - image: formatAssetUrl(new URL('./icons/icon/image.svg', import.meta.url).href, opts), + 'horizontal-align-end': formatAssetUrl( + new URL('./icons/icon/horizontal-align-end.svg', import.meta.url).href, + opts + ), + 'horizontal-align-middle': formatAssetUrl( + new URL('./icons/icon/horizontal-align-middle.svg', import.meta.url).href, + opts + ), + 'horizontal-align-start': formatAssetUrl( + new URL('./icons/icon/horizontal-align-start.svg', import.meta.url).href, + opts + ), 'info-circle': formatAssetUrl( new URL('./icons/icon/info-circle.svg', import.meta.url).href, opts ), leading: formatAssetUrl(new URL('./icons/icon/leading.svg', import.meta.url).href, opts), link: formatAssetUrl(new URL('./icons/icon/link.svg', import.meta.url).href, opts), - 'lock-small': formatAssetUrl( - new URL('./icons/icon/lock-small.svg', import.meta.url).href, - opts - ), - lock: formatAssetUrl(new URL('./icons/icon/lock.svg', import.meta.url).href, opts), menu: formatAssetUrl(new URL('./icons/icon/menu.svg', import.meta.url).href, opts), minus: formatAssetUrl(new URL('./icons/icon/minus.svg', import.meta.url).href, opts), mixed: formatAssetUrl(new URL('./icons/icon/mixed.svg', import.meta.url).href, opts), pack: formatAssetUrl(new URL('./icons/icon/pack.svg', import.meta.url).href, opts), - page: formatAssetUrl(new URL('./icons/icon/page.svg', import.meta.url).href, opts), plus: formatAssetUrl(new URL('./icons/icon/plus.svg', import.meta.url).href, opts), 'question-mark-circle': formatAssetUrl( new URL('./icons/icon/question-mark-circle.svg', import.meta.url).href, @@ -387,8 +341,6 @@ export function getAssetUrlsByMetaUrl(opts) { new URL('./icons/icon/rotate-cw.svg', import.meta.url).href, opts ), - ruler: formatAssetUrl(new URL('./icons/icon/ruler.svg', import.meta.url).href, opts), - search: formatAssetUrl(new URL('./icons/icon/search.svg', import.meta.url).href, opts), 'send-backward': formatAssetUrl( new URL('./icons/icon/send-backward.svg', import.meta.url).href, opts @@ -397,20 +349,6 @@ export function getAssetUrlsByMetaUrl(opts) { new URL('./icons/icon/send-to-back.svg', import.meta.url).href, opts ), - 'settings-horizontal': formatAssetUrl( - new URL('./icons/icon/settings-horizontal.svg', import.meta.url).href, - opts - ), - 'settings-vertical-1': formatAssetUrl( - new URL('./icons/icon/settings-vertical-1.svg', import.meta.url).href, - opts - ), - 'settings-vertical': formatAssetUrl( - new URL('./icons/icon/settings-vertical.svg', import.meta.url).href, - opts - ), - 'share-1': formatAssetUrl(new URL('./icons/icon/share-1.svg', import.meta.url).href, opts), - 'share-2': formatAssetUrl(new URL('./icons/icon/share-2.svg', import.meta.url).href, opts), 'size-extra-large': formatAssetUrl( new URL('./icons/icon/size-extra-large.svg', import.meta.url).href, opts @@ -427,14 +365,6 @@ export function getAssetUrlsByMetaUrl(opts) { new URL('./icons/icon/size-small.svg', import.meta.url).href, opts ), - 'spline-cubic': formatAssetUrl( - new URL('./icons/icon/spline-cubic.svg', import.meta.url).href, - opts - ), - 'spline-line': formatAssetUrl( - new URL('./icons/icon/spline-line.svg', import.meta.url).href, - opts - ), 'stack-horizontal': formatAssetUrl( new URL('./icons/icon/stack-horizontal.svg', import.meta.url).href, opts @@ -443,14 +373,6 @@ export function getAssetUrlsByMetaUrl(opts) { new URL('./icons/icon/stack-vertical.svg', import.meta.url).href, opts ), - 'status-offline': formatAssetUrl( - new URL('./icons/icon/status-offline.svg', import.meta.url).href, - opts - ), - 'status-online': formatAssetUrl( - new URL('./icons/icon/status-online.svg', import.meta.url).href, - opts - ), 'stretch-horizontal': formatAssetUrl( new URL('./icons/icon/stretch-horizontal.svg', import.meta.url).href, opts @@ -463,10 +385,6 @@ export function getAssetUrlsByMetaUrl(opts) { new URL('./icons/icon/text-align-center.svg', import.meta.url).href, opts ), - 'text-align-justify': formatAssetUrl( - new URL('./icons/icon/text-align-justify.svg', import.meta.url).href, - opts - ), 'text-align-left': formatAssetUrl( new URL('./icons/icon/text-align-left.svg', import.meta.url).href, opts @@ -475,12 +393,16 @@ export function getAssetUrlsByMetaUrl(opts) { new URL('./icons/icon/text-align-right.svg', import.meta.url).href, opts ), - 'tool-arrow': formatAssetUrl( - new URL('./icons/icon/tool-arrow.svg', import.meta.url).href, + 'toggle-off': formatAssetUrl( + new URL('./icons/icon/toggle-off.svg', import.meta.url).href, opts ), - 'tool-embed': formatAssetUrl( - new URL('./icons/icon/tool-embed.svg', import.meta.url).href, + 'toggle-on': formatAssetUrl( + new URL('./icons/icon/toggle-on.svg', import.meta.url).href, + opts + ), + 'tool-arrow': formatAssetUrl( + new URL('./icons/icon/tool-arrow.svg', import.meta.url).href, opts ), 'tool-eraser': formatAssetUrl( @@ -523,40 +445,30 @@ export function getAssetUrlsByMetaUrl(opts) { new URL('./icons/icon/tool-pointer.svg', import.meta.url).href, opts ), + 'tool-screenshot': formatAssetUrl( + new URL('./icons/icon/tool-screenshot.svg', import.meta.url).href, + opts + ), 'tool-text': formatAssetUrl( new URL('./icons/icon/tool-text.svg', import.meta.url).href, opts ), trash: formatAssetUrl(new URL('./icons/icon/trash.svg', import.meta.url).href, opts), - 'triangle-down': formatAssetUrl( - new URL('./icons/icon/triangle-down.svg', import.meta.url).href, - opts - ), - 'triangle-up': formatAssetUrl( - new URL('./icons/icon/triangle-up.svg', import.meta.url).href, - opts - ), twitter: formatAssetUrl(new URL('./icons/icon/twitter.svg', import.meta.url).href, opts), undo: formatAssetUrl(new URL('./icons/icon/undo.svg', import.meta.url).href, opts), ungroup: formatAssetUrl(new URL('./icons/icon/ungroup.svg', import.meta.url).href, opts), - 'unlock-small': formatAssetUrl( - new URL('./icons/icon/unlock-small.svg', import.meta.url).href, - opts - ), - unlock: formatAssetUrl(new URL('./icons/icon/unlock.svg', import.meta.url).href, opts), - 'vertical-align-center': formatAssetUrl( - new URL('./icons/icon/vertical-align-center.svg', import.meta.url).href, - opts - ), 'vertical-align-end': formatAssetUrl( new URL('./icons/icon/vertical-align-end.svg', import.meta.url).href, opts ), + 'vertical-align-middle': formatAssetUrl( + new URL('./icons/icon/vertical-align-middle.svg', import.meta.url).href, + opts + ), 'vertical-align-start': formatAssetUrl( new URL('./icons/icon/vertical-align-start.svg', import.meta.url).href, opts ), - visible: formatAssetUrl(new URL('./icons/icon/visible.svg', import.meta.url).href, opts), 'warning-triangle': formatAssetUrl( new URL('./icons/icon/warning-triangle.svg', import.meta.url).href, opts diff --git a/packages/editor/src/lib/editor/Editor.ts b/packages/editor/src/lib/editor/Editor.ts index b6f419d68..bb0a53808 100644 --- a/packages/editor/src/lib/editor/Editor.ts +++ b/packages/editor/src/lib/editor/Editor.ts @@ -6362,6 +6362,8 @@ export class Editor extends EventEmitter { const shapeRecordsToCreate: TLShape[] = [] + const { opacityForNextShape } = this.getInstanceState() + for (const partial of partials) { const util = this.getShapeUtil(partial as TLShapePartial) @@ -6405,7 +6407,7 @@ export class Editor extends EventEmitter { ).create({ ...partial, index, - opacity: partial.opacity ?? this.getInstanceState().opacityForNextShape, + opacity: partial.opacity ?? opacityForNextShape, parentId: partial.parentId ?? focusedGroupId, props: 'props' in partial ? { ...initialProps, ...partial.props } : initialProps, }) diff --git a/packages/tldraw/api-report.md b/packages/tldraw/api-report.md index 85fbf14d2..67f552e34 100644 --- a/packages/tldraw/api-report.md +++ b/packages/tldraw/api-report.md @@ -1386,13 +1386,13 @@ export class TextShapeUtil extends ShapeUtil { opacity: number; parentId: TLParentId; props: { - align: "end-legacy" | "end" | "middle-legacy" | "middle" | "start-legacy" | "start"; autoSize: boolean; color: "black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "white" | "yellow"; font: "draw" | "mono" | "sans" | "serif"; scale: number; size: "l" | "m" | "s" | "xl"; text: string; + textAlign: "end" | "middle" | "start"; w: number; }; rotation: number; @@ -1410,13 +1410,13 @@ export class TextShapeUtil extends ShapeUtil { opacity: number; parentId: TLParentId; props: { - align: "end-legacy" | "end" | "middle-legacy" | "middle" | "start-legacy" | "start"; autoSize: boolean; color: "black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "white" | "yellow"; font: "draw" | "mono" | "sans" | "serif"; scale: number; size: "l" | "m" | "s" | "xl"; text: string; + textAlign: "end" | "middle" | "start"; w: number; }; rotation: number; @@ -1447,13 +1447,13 @@ export class TextShapeUtil extends ShapeUtil { onResize: TLOnResizeHandler; // (undocumented) static props: { - align: EnumStyleProp<"end-legacy" | "end" | "middle-legacy" | "middle" | "start-legacy" | "start">; autoSize: Validator; color: EnumStyleProp<"black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "white" | "yellow">; font: EnumStyleProp<"draw" | "mono" | "sans" | "serif">; scale: Validator; size: EnumStyleProp<"l" | "m" | "s" | "xl">; text: Validator; + textAlign: EnumStyleProp<"end" | "middle" | "start">; w: Validator; }; // (undocumented) @@ -1729,7 +1729,7 @@ export const TldrawUiInput: React_3.ForwardRefExoticComponent({ id, kbd, label, readonlyOk, onSelect, disabled, checked, }: TLUiMenuCheckboxItemProps): JSX_2.Element | null; +export function TldrawUiMenuCheckboxItem({ id, kbd, label, readonlyOk, onSelect, toggle, disabled, checked, }: TLUiMenuCheckboxItemProps): JSX_2.Element | null; // @public (undocumented) export function TldrawUiMenuContextProvider({ type, sourceId, children, }: TLUiMenuContextProviderProps): JSX_2.Element; @@ -2177,7 +2177,7 @@ export interface TLUiIconProps extends React.HTMLProps { } // @public (undocumented) -export type TLUiIconType = 'align-bottom-center' | 'align-bottom-left' | 'align-bottom-right' | 'align-bottom' | 'align-center-center' | 'align-center-horizontal' | 'align-center-left' | 'align-center-right' | 'align-center-vertical' | 'align-left' | 'align-right' | 'align-top-center' | 'align-top-left' | 'align-top-right' | 'align-top' | 'arrow-left' | 'arrowhead-arrow' | 'arrowhead-bar' | 'arrowhead-diamond' | 'arrowhead-dot' | 'arrowhead-none' | 'arrowhead-square' | 'arrowhead-triangle-inverted' | 'arrowhead-triangle' | 'aspect-ratio' | 'avatar' | 'blob' | 'bring-forward' | 'bring-to-front' | 'check-circle' | 'check' | 'checkbox-checked' | 'checkbox-empty' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'chevron-up' | 'chevrons-ne' | 'chevrons-sw' | 'clipboard-copied' | 'clipboard-copy' | 'code' | 'collab' | 'color' | 'comment' | 'cross-2' | 'cross-circle' | 'cross' | 'dash-dashed' | 'dash-dotted' | 'dash-draw' | 'dash-solid' | 'discord' | 'distribute-horizontal' | 'distribute-vertical' | 'dot' | 'dots-horizontal' | 'dots-vertical' | 'drag-handle-dots' | 'duplicate' | 'edit' | 'error' | 'external-link' | 'file' | 'fill-none' | 'fill-pattern' | 'fill-semi' | 'fill-solid' | 'follow' | 'following' | 'font-draw' | 'font-mono' | 'font-sans' | 'font-serif' | 'geo-arrow-down' | 'geo-arrow-left' | 'geo-arrow-right' | 'geo-arrow-up' | 'geo-check-box' | 'geo-cloud' | 'geo-diamond' | 'geo-ellipse' | 'geo-hexagon' | 'geo-octagon' | 'geo-oval' | 'geo-pentagon' | 'geo-rectangle' | 'geo-rhombus-2' | 'geo-rhombus' | 'geo-star' | 'geo-trapezoid' | 'geo-triangle' | 'geo-x-box' | 'github' | 'group' | 'hidden' | 'image' | 'info-circle' | 'leading' | 'link' | 'lock-small' | 'lock' | 'menu' | 'minus' | 'mixed' | 'pack' | 'page' | 'plus' | 'question-mark-circle' | 'question-mark' | 'redo' | 'reset-zoom' | 'rotate-ccw' | 'rotate-cw' | 'ruler' | 'search' | 'send-backward' | 'send-to-back' | 'settings-horizontal' | 'settings-vertical-1' | 'settings-vertical' | 'share-1' | 'share-2' | 'size-extra-large' | 'size-large' | 'size-medium' | 'size-small' | 'spline-cubic' | 'spline-line' | 'stack-horizontal' | 'stack-vertical' | 'status-offline' | 'status-online' | 'stretch-horizontal' | 'stretch-vertical' | 'text-align-center' | 'text-align-justify' | 'text-align-left' | 'text-align-right' | 'tool-arrow' | 'tool-embed' | 'tool-eraser' | 'tool-frame' | 'tool-hand' | 'tool-highlight' | 'tool-laser' | 'tool-line' | 'tool-media' | 'tool-note' | 'tool-pencil' | 'tool-pointer' | 'tool-text' | 'trash' | 'triangle-down' | 'triangle-up' | 'twitter' | 'undo' | 'ungroup' | 'unlock-small' | 'unlock' | 'vertical-align-center' | 'vertical-align-end' | 'vertical-align-start' | 'visible' | 'warning-triangle' | 'zoom-in' | 'zoom-out'; +export type TLUiIconType = 'align-bottom' | 'align-center-horizontal' | 'align-center-vertical' | 'align-left' | 'align-right' | 'align-top' | 'arrow-left' | 'arrowhead-arrow' | 'arrowhead-bar' | 'arrowhead-diamond' | 'arrowhead-dot' | 'arrowhead-none' | 'arrowhead-square' | 'arrowhead-triangle-inverted' | 'arrowhead-triangle' | 'blob' | 'bring-forward' | 'bring-to-front' | 'broken' | 'check-circle' | 'check' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'chevron-up' | 'chevrons-ne' | 'chevrons-sw' | 'clipboard-copied' | 'clipboard-copy' | 'color' | 'cross-2' | 'cross-circle' | 'dash-dashed' | 'dash-dotted' | 'dash-draw' | 'dash-solid' | 'disconnected' | 'discord' | 'distribute-horizontal' | 'distribute-vertical' | 'dot' | 'dots-horizontal' | 'dots-vertical' | 'drag-handle-dots' | 'duplicate' | 'edit' | 'external-link' | 'fill-none' | 'fill-pattern' | 'fill-semi' | 'fill-solid' | 'follow' | 'following' | 'font-draw' | 'font-mono' | 'font-sans' | 'font-serif' | 'geo-arrow-down' | 'geo-arrow-left' | 'geo-arrow-right' | 'geo-arrow-up' | 'geo-check-box' | 'geo-cloud' | 'geo-diamond' | 'geo-ellipse' | 'geo-hexagon' | 'geo-octagon' | 'geo-oval' | 'geo-pentagon' | 'geo-rectangle' | 'geo-rhombus-2' | 'geo-rhombus' | 'geo-star' | 'geo-trapezoid' | 'geo-triangle' | 'geo-x-box' | 'github' | 'group' | 'horizontal-align-end' | 'horizontal-align-middle' | 'horizontal-align-start' | 'info-circle' | 'leading' | 'link' | 'menu' | 'minus' | 'mixed' | 'pack' | 'plus' | 'question-mark-circle' | 'question-mark' | 'redo' | 'reset-zoom' | 'rotate-ccw' | 'rotate-cw' | 'send-backward' | 'send-to-back' | 'size-extra-large' | 'size-large' | 'size-medium' | 'size-small' | 'stack-horizontal' | 'stack-vertical' | 'stretch-horizontal' | 'stretch-vertical' | 'text-align-center' | 'text-align-left' | 'text-align-right' | 'toggle-off' | 'toggle-on' | 'tool-arrow' | 'tool-eraser' | 'tool-frame' | 'tool-hand' | 'tool-highlight' | 'tool-laser' | 'tool-line' | 'tool-media' | 'tool-note' | 'tool-pencil' | 'tool-pointer' | 'tool-screenshot' | 'tool-text' | 'trash' | 'twitter' | 'undo' | 'ungroup' | 'vertical-align-end' | 'vertical-align-middle' | 'vertical-align-start' | 'warning-triangle' | 'zoom-in' | 'zoom-out'; // @public (undocumented) export interface TLUiInputProps { @@ -2247,6 +2247,7 @@ export type TLUiMenuCheckboxItemProps Promise | void; readonlyOk?: boolean; title?: string; + toggle?: boolean; }; // @public (undocumented) diff --git a/packages/tldraw/src/lib/defaultExternalContentHandlers.ts b/packages/tldraw/src/lib/defaultExternalContentHandlers.ts index d35def4c7..cfbf69883 100644 --- a/packages/tldraw/src/lib/defaultExternalContentHandlers.ts +++ b/packages/tldraw/src/lib/defaultExternalContentHandlers.ts @@ -292,7 +292,7 @@ export function registerDefaultExternalContentHandlers( let w: number let h: number let autoSize: boolean - let align = 'middle' as TLTextShapeProps['align'] + let align = 'middle' as TLTextShapeProps['textAlign'] const isMultiLine = textToPaste.split('\n').length > 1 @@ -346,7 +346,7 @@ export function registerDefaultExternalContentHandlers( props: { text: textToPaste, // if the text has more than one line, align it to the left - align, + textAlign: align, autoSize, w, }, diff --git a/packages/tldraw/src/lib/shapes/text/TextShapeUtil.tsx b/packages/tldraw/src/lib/shapes/text/TextShapeUtil.tsx index 809ab575b..caaea612f 100644 --- a/packages/tldraw/src/lib/shapes/text/TextShapeUtil.tsx +++ b/packages/tldraw/src/lib/shapes/text/TextShapeUtil.tsx @@ -43,7 +43,7 @@ export class TextShapeUtil extends ShapeUtil { w: 8, text: '', font: 'draw', - align: 'middle', + textAlign: 'start', autoSize: true, scale: 1, } @@ -71,7 +71,7 @@ export class TextShapeUtil extends ShapeUtil { component(shape: TLTextShape) { const { id, - props: { font, size, text, color, scale, align }, + props: { font, size, text, color, scale, textAlign }, } = shape const { width, height } = this.getMinDimensions(shape) @@ -87,7 +87,7 @@ export class TextShapeUtil extends ShapeUtil { font={font} fontSize={FONT_SIZES[size]} lineHeight={TEXT_PROPS.lineHeight} - align={align} + align={textAlign} verticalAlign="middle" text={text} labelColor={theme[color].solid} @@ -125,7 +125,7 @@ export class TextShapeUtil extends ShapeUtil { { const styleDidChange = prev.props.size !== next.props.size || - prev.props.align !== next.props.align || + prev.props.textAlign !== next.props.textAlign || prev.props.font !== next.props.font || (prev.props.scale !== 1 && next.props.scale === 1) @@ -233,7 +233,7 @@ export class TextShapeUtil extends ShapeUtil { let delta: Vec | undefined - switch (next.props.align) { + switch (next.props.textAlign) { case 'middle': { delta = new Vec((wB - wA) / 2, textDidChange ? 0 : (hB - hA) / 2) break diff --git a/packages/tldraw/src/lib/styles.tsx b/packages/tldraw/src/lib/styles.tsx index 6a4f2b684..f8f4af71f 100644 --- a/packages/tldraw/src/lib/styles.tsx +++ b/packages/tldraw/src/lib/styles.tsx @@ -43,14 +43,19 @@ export const STYLES = { { value: 'serif', icon: 'font-serif' }, { value: 'mono', icon: 'font-mono' }, ], - horizontalAlign: [ + textAlign: [ { value: 'start', icon: 'text-align-left' }, { value: 'middle', icon: 'text-align-center' }, { value: 'end', icon: 'text-align-right' }, ], + horizontalAlign: [ + { value: 'start', icon: 'horizontal-align-start' }, + { value: 'middle', icon: 'horizontal-align-middle' }, + { value: 'end', icon: 'horizontal-align-end' }, + ], verticalAlign: [ { value: 'start', icon: 'vertical-align-start' }, - { value: 'middle', icon: 'vertical-align-center' }, + { value: 'middle', icon: 'vertical-align-middle' }, { value: 'end', icon: 'vertical-align-end' }, ], geo: [ diff --git a/packages/tldraw/src/lib/ui.css b/packages/tldraw/src/lib/ui.css index 3aa2a278d..61c8f4f68 100644 --- a/packages/tldraw/src/lib/ui.css +++ b/packages/tldraw/src/lib/ui.css @@ -406,6 +406,13 @@ background-color: currentColor; } +.tlui-icon__placeholder { + flex-shrink: 0; + width: 18px; + height: 18px; + background-color: transparent; +} + .tlui-icon__small { width: 15px; height: 15px; diff --git a/packages/tldraw/src/lib/ui/components/StylePanel/DefaultStylePanelContent.tsx b/packages/tldraw/src/lib/ui/components/StylePanel/DefaultStylePanelContent.tsx index ca2d48367..844d85566 100644 --- a/packages/tldraw/src/lib/ui/components/StylePanel/DefaultStylePanelContent.tsx +++ b/packages/tldraw/src/lib/ui/components/StylePanel/DefaultStylePanelContent.tsx @@ -7,6 +7,7 @@ import { DefaultFontStyle, DefaultHorizontalAlignStyle, DefaultSizeStyle, + DefaultTextAlignStyle, DefaultVerticalAlignStyle, GeoShapeGeoStyle, LineShapeSplineStyle, @@ -193,9 +194,10 @@ export function TextStylePickerSet({ const handleValueChange = useStyleChangeCallback() const font = styles.get(DefaultFontStyle) - const align = styles.get(DefaultHorizontalAlignStyle) - const verticalAlign = styles.get(DefaultVerticalAlignStyle) - if (font === undefined && align === undefined) { + const textAlign = styles.get(DefaultTextAlignStyle) + const labelAlign = styles.get(DefaultHorizontalAlignStyle) + const verticalLabelAlign = styles.get(DefaultVerticalAlignStyle) + if (font === undefined && labelAlign === undefined) { return null } @@ -213,26 +215,50 @@ export function TextStylePickerSet({ /> )} - {align === undefined ? null : ( + {textAlign === undefined ? null : ( +
+ +
+ + + +
+
+ )} + + {labelAlign === undefined ? null : (
- {verticalAlign === undefined ? ( + {verticalLabelAlign === undefined ? ( - + ) : ( )} diff --git a/packages/tldraw/src/lib/ui/components/StylePanel/DoubleDropdownPicker.tsx b/packages/tldraw/src/lib/ui/components/StylePanel/DoubleDropdownPicker.tsx index 8a5dff9d6..75bda44d3 100644 --- a/packages/tldraw/src/lib/ui/components/StylePanel/DoubleDropdownPicker.tsx +++ b/packages/tldraw/src/lib/ui/components/StylePanel/DoubleDropdownPicker.tsx @@ -80,7 +80,7 @@ function _DoubleDropdownPicker({ - +
{itemsA.map((item, i) => { return ( @@ -115,7 +115,7 @@ function _DoubleDropdownPicker({ - +
{itemsB.map((item) => { return ( diff --git a/packages/tldraw/src/lib/ui/components/menu-items.tsx b/packages/tldraw/src/lib/ui/components/menu-items.tsx index 156a81764..a94295a57 100644 --- a/packages/tldraw/src/lib/ui/components/menu-items.tsx +++ b/packages/tldraw/src/lib/ui/components/menu-items.tsx @@ -123,7 +123,9 @@ export function ToggleTransparentBgMenuItem() { () => !editor.getInstanceState().exportBackground, [editor] ) - return + return ( + + ) } /** @public */ export function UnlockAllMenuItem() { diff --git a/packages/tldraw/src/lib/ui/components/primitives/TldrawUiIcon.tsx b/packages/tldraw/src/lib/ui/components/primitives/TldrawUiIcon.tsx index 0ffd656c0..28c7ed0ec 100644 --- a/packages/tldraw/src/lib/ui/components/primitives/TldrawUiIcon.tsx +++ b/packages/tldraw/src/lib/ui/components/primitives/TldrawUiIcon.tsx @@ -40,6 +40,18 @@ export const TldrawUiIcon = memo(function TldrawUi({ } }, [ref, asset, icon]) + if (icon === 'none') { + return ( +
+ ) + } + return (
Promise | void + toggle?: boolean checked?: boolean disabled?: boolean } @@ -36,6 +37,7 @@ export function TldrawUiMenuCheckboxItem< label, readonlyOk, onSelect, + toggle = false, disabled = false, checked = false, }: TLUiMenuCheckboxItemProps) { @@ -63,7 +65,10 @@ export function TldrawUiMenuCheckboxItem< disabled={disabled} checked={checked} > - + {labelStr && ( {labelStr} @@ -87,7 +92,10 @@ export function TldrawUiMenuCheckboxItem< disabled={disabled} checked={checked} > - + {labelStr && ( {labelStr} diff --git a/packages/tldraw/src/lib/ui/hooks/clipboard/pasteExcalidrawContent.ts b/packages/tldraw/src/lib/ui/hooks/clipboard/pasteExcalidrawContent.ts index bf8452a74..34b4a3eed 100644 --- a/packages/tldraw/src/lib/ui/hooks/clipboard/pasteExcalidrawContent.ts +++ b/packages/tldraw/src/lib/ui/hooks/clipboard/pasteExcalidrawContent.ts @@ -11,6 +11,7 @@ import { TLDefaultFontStyle, TLDefaultHorizontalAlignStyle, TLDefaultSizeStyle, + TLDefaultTextAlignStyle, TLOpacityType, TLShapeId, Vec, @@ -282,7 +283,7 @@ export async function pasteExcalidrawContent(editor: Editor, clipboard: any, poi font: fontFamilyToFontType[element.fontFamily] ?? 'draw', color: colorsToColors[element.strokeColor] ?? 'black', text: element.text, - align: textAlignToAlignTypes[element.textAlign], + textAlign: textAlignToTextAlignTypes[element.textAlign], }, }) break @@ -472,6 +473,12 @@ const textAlignToAlignTypes: Record = { right: 'end', } +const textAlignToTextAlignTypes: Record = { + left: 'start', + center: 'middle', + right: 'end', +} + const arrowheadsToArrowheadTypes: Record = { arrow: 'arrow', dot: 'dot', diff --git a/packages/tldraw/src/lib/ui/hooks/useTools.tsx b/packages/tldraw/src/lib/ui/hooks/useTools.tsx index fd05a340b..4e0fae9e9 100644 --- a/packages/tldraw/src/lib/ui/hooks/useTools.tsx +++ b/packages/tldraw/src/lib/ui/hooks/useTools.tsx @@ -182,7 +182,7 @@ export function ToolsProvider({ overrides, children }: TLUiToolsProviderProps) { { id: 'embed', label: 'tool.embed', - icon: 'tool-embed', + icon: 'dot', onSelect(source) { addDialog({ component: EmbedDialog }) trackEvent('select-tool', { source, id: 'embed' }) diff --git a/packages/tldraw/src/lib/ui/icon-types.ts b/packages/tldraw/src/lib/ui/icon-types.ts index 623e78273..55b70b103 100644 --- a/packages/tldraw/src/lib/ui/icon-types.ts +++ b/packages/tldraw/src/lib/ui/icon-types.ts @@ -3,20 +3,11 @@ /** @public */ export type TLUiIconType = - | 'align-bottom-center' - | 'align-bottom-left' - | 'align-bottom-right' | 'align-bottom' - | 'align-center-center' | 'align-center-horizontal' - | 'align-center-left' - | 'align-center-right' | 'align-center-vertical' | 'align-left' | 'align-right' - | 'align-top-center' - | 'align-top-left' - | 'align-top-right' | 'align-top' | 'arrow-left' | 'arrowhead-arrow' @@ -27,15 +18,12 @@ export type TLUiIconType = | 'arrowhead-square' | 'arrowhead-triangle-inverted' | 'arrowhead-triangle' - | 'aspect-ratio' - | 'avatar' | 'blob' | 'bring-forward' | 'bring-to-front' + | 'broken' | 'check-circle' | 'check' - | 'checkbox-checked' - | 'checkbox-empty' | 'chevron-down' | 'chevron-left' | 'chevron-right' @@ -44,17 +32,14 @@ export type TLUiIconType = | 'chevrons-sw' | 'clipboard-copied' | 'clipboard-copy' - | 'code' - | 'collab' | 'color' - | 'comment' | 'cross-2' | 'cross-circle' - | 'cross' | 'dash-dashed' | 'dash-dotted' | 'dash-draw' | 'dash-solid' + | 'disconnected' | 'discord' | 'distribute-horizontal' | 'distribute-vertical' @@ -64,9 +49,7 @@ export type TLUiIconType = | 'drag-handle-dots' | 'duplicate' | 'edit' - | 'error' | 'external-link' - | 'file' | 'fill-none' | 'fill-pattern' | 'fill-semi' @@ -98,18 +81,16 @@ export type TLUiIconType = | 'geo-x-box' | 'github' | 'group' - | 'hidden' - | 'image' + | 'horizontal-align-end' + | 'horizontal-align-middle' + | 'horizontal-align-start' | 'info-circle' | 'leading' | 'link' - | 'lock-small' - | 'lock' | 'menu' | 'minus' | 'mixed' | 'pack' - | 'page' | 'plus' | 'question-mark-circle' | 'question-mark' @@ -117,33 +98,22 @@ export type TLUiIconType = | 'reset-zoom' | 'rotate-ccw' | 'rotate-cw' - | 'ruler' - | 'search' | 'send-backward' | 'send-to-back' - | 'settings-horizontal' - | 'settings-vertical-1' - | 'settings-vertical' - | 'share-1' - | 'share-2' | 'size-extra-large' | 'size-large' | 'size-medium' | 'size-small' - | 'spline-cubic' - | 'spline-line' | 'stack-horizontal' | 'stack-vertical' - | 'status-offline' - | 'status-online' | 'stretch-horizontal' | 'stretch-vertical' | 'text-align-center' - | 'text-align-justify' | 'text-align-left' | 'text-align-right' + | 'toggle-off' + | 'toggle-on' | 'tool-arrow' - | 'tool-embed' | 'tool-eraser' | 'tool-frame' | 'tool-hand' @@ -154,39 +124,26 @@ export type TLUiIconType = | 'tool-note' | 'tool-pencil' | 'tool-pointer' + | 'tool-screenshot' | 'tool-text' | 'trash' - | 'triangle-down' - | 'triangle-up' | 'twitter' | 'undo' | 'ungroup' - | 'unlock-small' - | 'unlock' - | 'vertical-align-center' | 'vertical-align-end' + | 'vertical-align-middle' | 'vertical-align-start' - | 'visible' | 'warning-triangle' | 'zoom-in' | 'zoom-out' /** @public */ export const iconTypes = [ - 'align-bottom-center', - 'align-bottom-left', - 'align-bottom-right', 'align-bottom', - 'align-center-center', 'align-center-horizontal', - 'align-center-left', - 'align-center-right', 'align-center-vertical', 'align-left', 'align-right', - 'align-top-center', - 'align-top-left', - 'align-top-right', 'align-top', 'arrow-left', 'arrowhead-arrow', @@ -197,15 +154,12 @@ export const iconTypes = [ 'arrowhead-square', 'arrowhead-triangle-inverted', 'arrowhead-triangle', - 'aspect-ratio', - 'avatar', 'blob', 'bring-forward', 'bring-to-front', + 'broken', 'check-circle', 'check', - 'checkbox-checked', - 'checkbox-empty', 'chevron-down', 'chevron-left', 'chevron-right', @@ -214,17 +168,14 @@ export const iconTypes = [ 'chevrons-sw', 'clipboard-copied', 'clipboard-copy', - 'code', - 'collab', 'color', - 'comment', 'cross-2', 'cross-circle', - 'cross', 'dash-dashed', 'dash-dotted', 'dash-draw', 'dash-solid', + 'disconnected', 'discord', 'distribute-horizontal', 'distribute-vertical', @@ -234,9 +185,7 @@ export const iconTypes = [ 'drag-handle-dots', 'duplicate', 'edit', - 'error', 'external-link', - 'file', 'fill-none', 'fill-pattern', 'fill-semi', @@ -268,18 +217,16 @@ export const iconTypes = [ 'geo-x-box', 'github', 'group', - 'hidden', - 'image', + 'horizontal-align-end', + 'horizontal-align-middle', + 'horizontal-align-start', 'info-circle', 'leading', 'link', - 'lock-small', - 'lock', 'menu', 'minus', 'mixed', 'pack', - 'page', 'plus', 'question-mark-circle', 'question-mark', @@ -287,33 +234,22 @@ export const iconTypes = [ 'reset-zoom', 'rotate-ccw', 'rotate-cw', - 'ruler', - 'search', 'send-backward', 'send-to-back', - 'settings-horizontal', - 'settings-vertical-1', - 'settings-vertical', - 'share-1', - 'share-2', 'size-extra-large', 'size-large', 'size-medium', 'size-small', - 'spline-cubic', - 'spline-line', 'stack-horizontal', 'stack-vertical', - 'status-offline', - 'status-online', 'stretch-horizontal', 'stretch-vertical', 'text-align-center', - 'text-align-justify', 'text-align-left', 'text-align-right', + 'toggle-off', + 'toggle-on', 'tool-arrow', - 'tool-embed', 'tool-eraser', 'tool-frame', 'tool-hand', @@ -324,19 +260,15 @@ export const iconTypes = [ 'tool-note', 'tool-pencil', 'tool-pointer', + 'tool-screenshot', 'tool-text', 'trash', - 'triangle-down', - 'triangle-up', 'twitter', 'undo', 'ungroup', - 'unlock-small', - 'unlock', - 'vertical-align-center', 'vertical-align-end', + 'vertical-align-middle', 'vertical-align-start', - 'visible', 'warning-triangle', 'zoom-in', 'zoom-out', diff --git a/packages/tldraw/src/lib/utils/tldr/buildFromV1Document.ts b/packages/tldraw/src/lib/utils/tldr/buildFromV1Document.ts index 1d894703d..c94515c08 100644 --- a/packages/tldraw/src/lib/utils/tldr/buildFromV1Document.ts +++ b/packages/tldraw/src/lib/utils/tldr/buildFromV1Document.ts @@ -13,6 +13,7 @@ import { TLDefaultFontStyle, TLDefaultHorizontalAlignStyle, TLDefaultSizeStyle, + TLDefaultTextAlignStyle, TLDrawShape, TLGeoShape, TLImageShape, @@ -436,7 +437,7 @@ export function buildFromV1Document(editor: Editor, document: LegacyTldrawDocume color: getV2Color(v1Shape.style.color), size: getV2TextSize(v1Shape.style.size), font: getV2Font(v1Shape.style.font), - align: getV2Align(v1Shape.style.textAlign), + textAlign: getV2TextAlign(v1Shape.style.textAlign), scale: v1Shape.style.scale ?? 1, }, }, @@ -1106,6 +1107,13 @@ const v1AlignsToV2Aligns: Record = { [AlignStyle.Justify]: 'start', } +const v1TextAlignsToV2TextAligns: Record = { + [AlignStyle.Start]: 'start', + [AlignStyle.Middle]: 'middle', + [AlignStyle.End]: 'end', + [AlignStyle.Justify]: 'start', +} + const v1TextSizesToV2TextSizes: Record = { [SizeStyle.Small]: 's', [SizeStyle.Medium]: 'l', @@ -1137,6 +1145,10 @@ function getV2Align(align: AlignStyle | undefined): TLDefaultHorizontalAlignStyl return align ? v1AlignsToV2Aligns[align] ?? 'middle' : 'middle' } +function getV2TextAlign(align: AlignStyle | undefined): TLDefaultTextAlignStyle { + return align ? v1TextAlignsToV2TextAligns[align] ?? 'middle' : 'middle' +} + function getV2TextSize(size: SizeStyle | undefined): TLDefaultSizeStyle { return size ? v1TextSizesToV2TextSizes[size] ?? 'm' : 'm' } diff --git a/packages/tldraw/src/test/text.test.ts b/packages/tldraw/src/test/text.test.ts index 51495c4eb..3f96693f5 100644 --- a/packages/tldraw/src/test/text.test.ts +++ b/packages/tldraw/src/test/text.test.ts @@ -1,4 +1,4 @@ -import { createShapeId } from '@tldraw/editor' +import { TLTextShape, createShapeId } from '@tldraw/editor' import { TestEditor } from './TestEditor' let editor: TestEditor @@ -13,7 +13,7 @@ afterEach(() => { describe('When editing text', () => { it('preserves the top center when center aligned', () => { const id = createShapeId() - editor.createShapes([ + editor.createShapes([ { id, type: 'text', @@ -21,7 +21,7 @@ describe('When editing text', () => { y: 0, props: { text: 'Hello', - align: 'middle', + textAlign: 'middle', scale: 2, }, }, @@ -47,7 +47,7 @@ describe('When editing text', () => { it('preserved the right center when center aligned and rotated 90deg', () => { const id = createShapeId() - editor.createShapes([ + editor.createShapes([ { id, type: 'text', @@ -56,7 +56,7 @@ describe('When editing text', () => { rotation: Math.PI / 2, props: { text: 'Hello', - align: 'middle', + textAlign: 'middle', scale: 2, }, }, @@ -73,7 +73,7 @@ describe('When editing text', () => { it('preserves the top left corner when start aligned', () => { const id = createShapeId() - editor.createShapes([ + editor.createShapes([ { id, type: 'text', @@ -81,7 +81,7 @@ describe('When editing text', () => { y: 0, props: { text: 'Hello', - align: 'start', + textAlign: 'start', scale: 2, }, }, @@ -107,7 +107,7 @@ describe('When editing text', () => { it('preserves the top right edge when end aligned', () => { const id = createShapeId() - editor.createShapes([ + editor.createShapes([ { id, type: 'text', @@ -115,7 +115,7 @@ describe('When editing text', () => { y: 0, props: { text: 'Hello', - align: 'end', + textAlign: 'end', scale: 2, }, }, @@ -143,7 +143,7 @@ describe('When editing text', () => { describe('When changing text size', () => { it('preserves the center when center aligned', () => { const id = createShapeId() - editor.createShapes([ + editor.createShapes([ { id, type: 'text', @@ -152,7 +152,7 @@ describe('When changing text size', () => { props: { text: 'Hello', size: 'm', - align: 'middle', + textAlign: 'middle', scale: 2, }, }, @@ -178,7 +178,7 @@ describe('When changing text size', () => { it('preserves the center left point when start aligned', () => { const id = createShapeId() - editor.createShapes([ + editor.createShapes([ { id, type: 'text', @@ -187,7 +187,7 @@ describe('When changing text size', () => { props: { text: 'Hello', size: 'm', - align: 'start', + textAlign: 'start', scale: 2, }, }, @@ -213,7 +213,7 @@ describe('When changing text size', () => { it('preserves the top right edge when end aligned', () => { const id = createShapeId() - editor.createShapes([ + editor.createShapes([ { id, type: 'text', @@ -222,7 +222,7 @@ describe('When changing text size', () => { props: { text: 'Hello', size: 'm', - align: 'end', + textAlign: 'end', scale: 2, }, }, diff --git a/packages/tlschema/api-report.md b/packages/tlschema/api-report.md index 13da9d330..979b14ae0 100644 --- a/packages/tlschema/api-report.md +++ b/packages/tlschema/api-report.md @@ -200,6 +200,9 @@ export const defaultShapeSchemas: { // @public (undocumented) export const DefaultSizeStyle: EnumStyleProp<"l" | "m" | "s" | "xl">; +// @public (undocumented) +export const DefaultTextAlignStyle: EnumStyleProp<"end" | "middle" | "start">; + // @public (undocumented) export const DefaultVerticalAlignStyle: EnumStyleProp<"end" | "middle" | "start">; @@ -790,13 +793,13 @@ export const textShapeMigrations: TLShapePropsMigrations; // @public (undocumented) export const textShapeProps: { - align: EnumStyleProp<"end-legacy" | "end" | "middle-legacy" | "middle" | "start-legacy" | "start">; autoSize: T.Validator; color: EnumStyleProp<"black" | "blue" | "green" | "grey" | "light-blue" | "light-green" | "light-red" | "light-violet" | "orange" | "red" | "violet" | "white" | "yellow">; font: EnumStyleProp<"draw" | "mono" | "sans" | "serif">; scale: T.Validator; size: EnumStyleProp<"l" | "m" | "s" | "xl">; text: T.Validator; + textAlign: EnumStyleProp<"end" | "middle" | "start">; w: T.Validator; }; @@ -954,6 +957,9 @@ export type TLDefaultShape = TLArrowShape | TLBookmarkShape | TLDrawShape | TLEm // @public (undocumented) export type TLDefaultSizeStyle = T.TypeOf; +// @public (undocumented) +export type TLDefaultTextAlignStyle = T.TypeOf; + // @public (undocumented) export type TLDefaultVerticalAlignStyle = T.TypeOf; diff --git a/packages/tlschema/src/index.ts b/packages/tlschema/src/index.ts index 886ff30ed..b4e32baa6 100644 --- a/packages/tlschema/src/index.ts +++ b/packages/tlschema/src/index.ts @@ -166,6 +166,7 @@ export { type TLDefaultHorizontalAlignStyle, } from './styles/TLHorizontalAlignStyle' export { DefaultSizeStyle, type TLDefaultSizeStyle } from './styles/TLSizeStyle' +export { DefaultTextAlignStyle, type TLDefaultTextAlignStyle } from './styles/TLTextAlignStyle' export { DefaultVerticalAlignStyle, type TLDefaultVerticalAlignStyle, diff --git a/packages/tlschema/src/migrations.test.ts b/packages/tlschema/src/migrations.test.ts index bb3f985e2..1178e8d48 100644 --- a/packages/tlschema/src/migrations.test.ts +++ b/packages/tlschema/src/migrations.test.ts @@ -1549,6 +1549,18 @@ describe('Add font size adjustment to notes', () => { }) }) +describe('Add text align to text shapes', () => { + const { up, down } = getTestMigration(textShapeVersions.AddTextAlign) + + test('up works as expected', () => { + expect(up({ props: { align: 'middle' } })).toEqual({ props: { textAlign: 'middle' } }) + }) + + test('down works as expected', () => { + expect(down({ props: { textAlign: 'middle' } })).toEqual({ props: { align: 'middle' } }) + }) +}) + /* --- PUT YOUR MIGRATIONS TESTS ABOVE HERE --- */ // check that all migrator fns were called at least once diff --git a/packages/tlschema/src/shapes/TLTextShape.ts b/packages/tlschema/src/shapes/TLTextShape.ts index 63e90915f..43a239ad9 100644 --- a/packages/tlschema/src/shapes/TLTextShape.ts +++ b/packages/tlschema/src/shapes/TLTextShape.ts @@ -6,8 +6,8 @@ import { } from '../records/TLShape' import { DefaultColorStyle } from '../styles/TLColorStyle' import { DefaultFontStyle } from '../styles/TLFontStyle' -import { DefaultHorizontalAlignStyle } from '../styles/TLHorizontalAlignStyle' import { DefaultSizeStyle } from '../styles/TLSizeStyle' +import { DefaultTextAlignStyle } from '../styles/TLTextAlignStyle' import { ShapePropsType, TLBaseShape } from './TLBaseShape' /** @public */ @@ -15,7 +15,7 @@ export const textShapeProps = { color: DefaultColorStyle, size: DefaultSizeStyle, font: DefaultFontStyle, - align: DefaultHorizontalAlignStyle, + textAlign: DefaultTextAlignStyle, w: T.nonZeroNumber, text: T.string, scale: T.nonZeroNumber, @@ -30,6 +30,7 @@ export type TLTextShape = TLBaseShape<'text', TLTextShapeProps> const Versions = createShapePropsMigrationIds('text', { RemoveJustify: 1, + AddTextAlign: 2, }) export { Versions as textShapeVersions } @@ -46,5 +47,16 @@ export const textShapeMigrations = createShapePropsMigrationSequence({ }, down: RETIRED_DOWN_MIGRATION, }, + { + id: Versions.AddTextAlign, + up: (props) => { + props.textAlign = props.align + delete props.align + }, + down: (props) => { + props.align = props.textAlign + delete props.textAlign + }, + }, ], }) diff --git a/packages/tlschema/src/styles/TLTextAlignStyle.ts b/packages/tlschema/src/styles/TLTextAlignStyle.ts new file mode 100644 index 000000000..999477fe8 --- /dev/null +++ b/packages/tlschema/src/styles/TLTextAlignStyle.ts @@ -0,0 +1,11 @@ +import { T } from '@tldraw/validate' +import { StyleProp } from './StyleProp' + +/** @public */ +export const DefaultTextAlignStyle = StyleProp.defineEnum('tldraw:textAlign', { + defaultValue: 'start', + values: ['start', 'middle', 'end'], +}) + +/** @public */ +export type TLDefaultTextAlignStyle = T.TypeOf