Commit Graph

66 Commits

Author SHA1 Message Date
891ac82447 fix: use active Excalidraw component when editing text (#3478)
* fix: use active excalidraw component when editing text

* changelog

* tweak
2021-04-23 21:11:18 +05:30
e0a449aa40 feat: support tab in text Wyswig (#3411)
* fix: support tab in text Wyswig

* Refactor tab handling

Tab now indent the whole line, instead of inserting at the cursor
position.

Shift+Tab now deindent the whole line.

* Add multi-line tabulation support

* rename

* simplify algo for selected lines start indices & naming tweaks

* add cmd-bracket shortcuts as alias to indent/outdent

* support outdenting partial tabs

Co-authored-by: dwelle <luzar.david@gmail.com>
2021-04-13 16:23:46 +02:00
d126d04d17 feat: Bind keyboard events to the current excalidraw container and add handleKeyboardGlobally prop to allow host to bind to document (#3430)
* fix: Bind keyboard events to excalidraw container

* fix cases around blurring

* fix modal rendering so keyboard shortcuts work on modal as well

* Revert "fix modal rendering so keyboard shortcuts work on modal as well"

This reverts commit 2c8ec6be8eff7d308591467fe2c33cfbca16138f.

* Attach keyboard event in react way so we need not handle portals separately (modals)

* dnt propagate esc event when modal shown

* focus the container when help dialog closed with shift+?

* focus the help icon when help dialog on close triggered

* move focusNearestTabbableParent to util

* rename util to focusNearestParent and remove outline from excal and modal

* Add prop bindKeyGlobally to decide if keyboard events should be binded to document and allow it in excal app, revert tests

* fix

* focus container after installing library, reset library and closing error dialog

* fix tests and create util to focus container

* Add excalidraw-container class to focus on the container

* pass focus container to library to focus current instance of excal

* update docs

* remove util as it wont be used anywhere

* fix propagation not being stopped for React keyboard handling

* tweak reamde

Co-authored-by: David Luzar <luzar.david@gmail.com>

* tweak changelog

* rename prop to handleKeyboardGlobally

Co-authored-by: dwelle <luzar.david@gmail.com>
2021-04-13 01:29:25 +05:30
78f3a92dd1 feat: replaces fontSize and fontFamily text with icons (#2857)
Co-authored-by: Hitesh Goyal <hiteshlyearn@Hiteshs-MacBook-Pro.local>
Co-authored-by: dwelle <luzar.david@gmail.com>
2021-03-22 14:26:35 +01:00
e90e56452f fix: stop preventing canvas pointerdown/tapend events (#3207) 2021-03-16 18:04:53 +01:00
f1daff2437 refactor: Rename appearance to theme (#3237)
* refactor: Rename appearance to theme

* fix

* update changelog

* rename theme_dark to theme--dark

* add about migration
2021-03-13 18:58:06 +05:30
3780a155f4 fix: Apply correct translation when text editor overflows when zoom not 100% (#3225)
* fix: Apply correct translation when zoom not 100%

* fix

* fix

* Update src/element/textWysiwyg.tsx

Co-authored-by: David Luzar <luzar.david@gmail.com>
2021-03-12 02:38:50 +05:30
6e629383ea fix: Don't overflow text beyond width of Excalidraw (#3215)
* fix: Don't overflow text beyond width of Excalidraw

* update changelog
2021-03-10 01:49:32 +05:30
3a0a638a0d fix: Position text editor absolute and fix the offsets so it doesn't remain fixed when container is scrolled (#3200)
* fix: Position text editor absolute and fix the offsets so it doesn't remain fixed when container is scrolled

* update changelog

* Update src/packages/excalidraw/CHANGELOG.md
2021-03-07 21:12:10 +05:30
4b253c7362 fix: refresh wysiwyg position on canvas resize (#3008) 2021-02-11 12:24:26 +01:00
6c81a32d62 fix: text editor not visible in dark mode (#2920) 2021-02-04 16:21:48 +01:00
e18e945cd3 fix: incorrect z-index of text editor (#2914) 2021-02-04 14:54:00 +01:00
b21fd49412 chore: Minor refactoring for consistency (#2425) 2020-11-29 17:32:51 +01:00
a20f3240fd Prefer arrow functions (#2344) 2020-11-06 21:06:39 +01:00
5d295415db Keep errors, elements and comments consistent (#2340)
Co-authored-by: David Luzar <luzar.david@gmail.com>
2020-11-05 18:06:18 +01:00
566e6a5ede Zoom on cursor | Issue #940 (#2319) 2020-11-04 19:49:15 +02:00
e424ca53c6 fix inconsistent text element color on dark mode while editing. (#2196)
On dark mode, while text element is being edited, it was changing color to the light mode variant (white turns back to black, etc...).

This is caused by the --appearance-filter not being applied to the floating textarea. The css var --appearance-filter is only applied to the .excalidraw class while the floating textarea is being appended to the body which put it outside of .excalidraw.

This change adds excalidraw class to the floating textarea and also adds Appearance_dark to it while dark mode is on.
2020-10-05 17:41:57 +03:00
e34cf3aee3 Fix #2075 - Pinch zooming while typing text breaks the UI on Chrome Mac OS X (#2076) 2020-08-25 11:38:03 +02:00
c0dd870c6e Dark mode (#2006)
Co-authored-by: dwelle <luzar.david@gmail.com>
2020-08-13 13:35:31 +02:00
20500b7822 remove shared global scene and attach it to every instance (#1706)
Co-authored-by: dwelle <luzar.david@gmail.com>
2020-07-30 11:20:59 +02:00
7eff6893c5 calculate coords based on container viewport position (#1955)
* feat: calculate coords based on parent left and top so it renders correctly in host App

* fix text

* move offsets to state & fix bugs

* fix text jumping

* account for zoom in textWysiwyg & undo incorrect offsetting

Co-authored-by: dwelle <luzar.david@gmail.com>
2020-07-27 13:48:49 +02:00
bac20fa641 Choosing color before entering text does not update the swatch (Fixes #1897) (#1915)
Co-authored-by: dwelle <luzar.david@gmail.com>
2020-07-14 13:56:45 +02:00
cd87bd6901 do not center text when not applicable (#1783) 2020-06-25 21:21:27 +02:00
63c10743fb split font into fontSize and fontFamily (#1635) 2020-05-27 15:14:50 +02:00
c427aa3cce Prefer arrow functions and callbacks (#1210) 2020-05-20 15:21:37 +02:00
692ceece65 fix not using className when querying container (#1420) 2020-04-13 17:29:11 +02:00
6771b505ad rewrite wysiwyg property updating (#1387)
* rewrite wysiwyg property updating

* reuse existing class

* fix case of focus being stolen by other UIs

* revert mistake csp removal

* ensure we don't run cleanup twice

* fix opacity updating

* add shape actions menu class to constants
2020-04-12 15:57:57 +02:00
5e2f164026 PoC: Expose wysiwyg element to manipulate from outside (#1356)
* expose wysiwyg element to manipulate from outside

* keep focus after changing style

* update editingElement correctly

* remove mistake

* update text only

* proper check for element

* udpate snapshots

* add error log

* remove try catch handler

* remove blur event

* add proper types

* merge if condition

* simplify if condition

Co-Authored-By: Lipis <lipiridis@gmail.com>

Co-authored-by: dwelle <luzar.david@gmail.com>
Co-authored-by: Lipis <lipiridis@gmail.com>
Co-authored-by: Fausto95 <faustino.kialungila@gmail.com>
2020-04-11 18:10:56 +02:00
ff82d1cfa3 feat/ability to change the alignment of the text (#1213)
* feat: add the ability to change the alignement of the text

* test: update the snapshots to included the newely textAlign state

* style: use explicit key assignment to object

* test: add missing new key textAlign to newElement.test.ts

* style: make the text on the buttons start with uppercase

* Update src/locales/en.json

* add types

* add migration

* remove incorrect update

Co-authored-by: Youness Fkhach <younessfkhach@porotonmail.com>
Co-authored-by: Lipis <lipiridis@gmail.com>
Co-authored-by: dwelle <luzar.david@gmail.com>
2020-04-08 22:00:27 +02:00
3fd6f3023f support newline on shift+enter (#1324) 2020-04-08 20:56:27 +02:00
81b38d8808 fix wysiwyg event cleanup (#1248) 2020-04-05 22:31:59 +02:00
ae1eee15cc Replace ev -> event (#1209) 2020-04-04 10:41:54 +02:00
8030a167c6 make text committing cross-platform (#1188) 2020-04-03 15:56:23 +02:00
980d08ce56 Add support for committing a text entry on cmd/shift click (#1185) 2020-04-03 15:41:32 +03:00
4912a29e75 sync intermediate text updates (#1174)
* sync intermediate text updates

* fix initial render text position

* batch updates

* tweak onChange subscription
2020-04-03 14:16:14 +02:00
663526129a Proper RTL support (#1154)
* Add RTL styles. Most of the work is done by the browser 💖

* Refactor getLanguage

* Additional fixes

* Mirror the mouse pointer icon

* Move the vertical scrollbar to the left on RTL

* Revert "Mirror the mouse pointer icon"

This reverts commit f69b132538038d231b1b1acc0d6f4a28c91130bb.
2020-04-02 12:21:19 -04:00
65be7973be Rotation support (#1099)
* rotate rectanble with fixed angle

* rotate dashed rectangle with fixed angle

* fix rotate handler rect

* fix canvas size with rotation

* angle in element base

* fix bug in calculating canvas size

* trial only for rectangle

* hitTest for rectangle rotation

* properly resize rotated rectangle

* fix canvas size calculation

* giving up... workaround for now

* **experimental** handler to rotate rectangle

* remove rotation on copy for debugging

* update snapshots

* better rotation handler with atan2

* rotate when drawImage

* add rotation handler

* hitTest for any shapes

* fix hitTest for curved lines

* rotate text element

* rotation locking

* hint messaage for rotating

* show proper handlers on mobile (a workaround, there should be a better way)

* refactor hitTest

* support exporting png

* support exporting svg

* fix rotating curved line

* refactor drawElementFromCanvas with getElementAbsoluteCoords

* fix export png and svg

* adjust resize positions for lines (N, E, S, W)

* do not make handlers big on mobile

* Update src/locales/en.json

Alright!

Co-Authored-By: Lipis <lipiridis@gmail.com>

* do not show rotation/resizing hints on mobile

* proper calculation for N and W positions

* simplify calculation

* use "rotation" as property name for clarification (may increase bundle size)

* update snapshots excluding rotation handle

* refactor with adjustPositionWithRotation

* refactor with adjustXYWithRotation

* forgot to rename rotation

* rename internal function

* initialize element angle on restore

* rotate wysiwyg editor

* fix shift-rotate around 270deg

* improve rotation locking

* refactor adjustXYWithRotation

* avoid rotation degree becomes >=360

* refactor with generateHandler

Co-authored-by: Lipis <lipiridis@gmail.com>
Co-authored-by: dwelle <luzar.david@gmail.com>
2020-04-02 10:40:26 +02:00
9b6700755a Add new line on Enter (#1161)
* Add new line on Enter

Fixes #1158

* Fix lint
2020-04-02 01:41:42 +02:00
722c498abe Bump prettier from 1.19.1 to 2.0.1 (#1060)
* Bump prettier from 1.19.1 to 2.0.1

Bumps [prettier](https://github.com/prettier/prettier) from 1.19.1 to 2.0.1.
- [Release notes](https://github.com/prettier/prettier/releases)
- [Changelog](https://github.com/prettier/prettier/blob/master/CHANGELOG.md)
- [Commits](https://github.com/prettier/prettier/compare/1.19.1...2.0.1)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>

* Update formatting

Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com>
Co-authored-by: Panayiotis Lipiridis <lipiridis@gmail.com>
2020-03-23 13:05:07 +02:00
23b785de68 Trim trailing newlines (#999)
* trim newlines for text elements

* fix comment
2020-03-18 13:01:33 +01:00
809d7ba9f5 Remove text trim (#947)
This was added when we were computing the width without adding "pre" behavior. Now it is no longer an issue
2020-03-14 14:00:20 -07:00
f0e6f4dbb8 Text esc fixes (#925)
* fix incorrectly resetting state on esc

* confirm text on esc
2020-03-12 18:04:56 +01:00
097c5dfad7 Refactor: e -> event or error, err -> error, p -> pointer (#831)
* Refactor: e -> event or error, err -> error, p -> pointer

* simplify
2020-02-28 23:03:53 +01:00
43236bed68 Fix error with contentEditable (#803) 2020-02-21 19:51:34 -08:00
0fd3fb4b5b More mobile tweaks (#790)
* Disable text selection

* Set content-editable=plaintext-only to disable Touch Bar formatting buttons

* Enlarge resize handle tap targets for pen/touch

* Make the lock button a button in mobile mode

* Use icons instead of Unicode characters; add an alternate toolbar for creating multipoint lines

* Allow buttons to hide themselves

* Fix heuristic for showing shape actions

* Refactor icons

* Fix label for edit button

* Switch edit button icon

* Remove lock button on mobile

* Add language selector on mobile

* Fix showing edit button on mobile

* Fix showing edit button on mobile, part 2

* Fix handle touch regions

* Fix scroll-back button position

* Allow using the text tool on a text object to start editing it

* Fix deletion of last point in line
2020-02-21 11:34:18 -08:00
c7ff4c2ed6 Canvas zooming (#716)
* Zoom icons.

* Actions.

* Min zoom of 0 does not make sense.

* Zoom logic.

* Modify how zoom affects selection rendering.

* More precise scrollbar dimensions.

* Adjust elements visibility and scrollbars.

* Normalized canvas width and height.

* Apply zoom to resize test.

* [WIP] Zoom using canvas center as an origin.

* Undo zoom on `getScrollBars`.

* WIP: center zoom origin via scroll

* This was wrong for sure.

* Finish scaling using center as origin.

* Almost there.

* Scroll offset should be not part of zoom transforms.

* Better naming.

* Wheel movement should be the same no matter the zoom level.

* Panning movement should be the same no matter the zoom level.

* Fix elements pasting.

* Fix text WYSIWGT.

* Fix scrollbars and visibility.
2020-02-15 21:03:32 +01:00
88eacc9da7 Improve pasting (#723)
* switch to selection tool on paste

* align pasting via contextMenu with pasting from event

* ensure only plaintext can be pasted

* fix findShapeByKey regression

* simplify wysiwyg pasting

* improve wysiwyg blurriness
2020-02-07 18:42:24 +01:00
53994e71e5 Add more ESLint rules and change the formatting scripts (#626)
* Add curly rule in ESLint for consistency

* Fix rules

* More rules

* REturn

* Push

* no else return

* prefer const

* destructing
2020-02-02 18:04:35 +00:00
4ff88ae03d Fix caret for real! (#653)
Turns out the root cause was the outline. For some reason, doing "transparent" doesn't work but doing "1px solid transparent" does. Don't know why but I'll take it!
2020-02-01 06:07:08 +00:00
9a76556bea Fixed wysiwyg carret disappearing on Chrome (#652)
There's a bug where the carret doesn't show up when the text is first focused on Chrome with the previous combination of CSS. I tweaked it and now it seems to work (don't ask me why!).

Unfortunately on Safari, ever since we moved to contentEditable on #274, the carret disappeared the first time. I unsuccessfully tried to repro in a smaller codebase ( https://jsfiddle.net/u2mjs90y/1/ ) but it does work in Safari...

I'm not exactly sure what's going on, there are bunch of issues opened against this bug when googling against all the browsers...
2020-02-01 05:54:33 +00:00