66 Commits

Author SHA1 Message Date
Aakansha Doshi
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
Clément Lafont
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
Aakansha Doshi
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
Hitesh Goyal
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
David Luzar
e90e56452f
fix: stop preventing canvas pointerdown/tapend events (#3207) 2021-03-16 18:04:53 +01:00
Aakansha Doshi
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
Aakansha Doshi
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
Aakansha Doshi
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
Aakansha Doshi
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
David Luzar
4b253c7362
fix: refresh wysiwyg position on canvas resize (#3008) 2021-02-11 12:24:26 +01:00
David Luzar
6c81a32d62
fix: text editor not visible in dark mode (#2920) 2021-02-04 16:21:48 +01:00
David Luzar
e18e945cd3
fix: incorrect z-index of text editor (#2914) 2021-02-04 14:54:00 +01:00
Lipis
b21fd49412
chore: Minor refactoring for consistency (#2425) 2020-11-29 17:32:51 +01:00
Lipis
a20f3240fd
Prefer arrow functions (#2344) 2020-11-06 21:06:39 +01:00
Lipis
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
João Forja
566e6a5ede
Zoom on cursor | Issue #940 (#2319) 2020-11-04 19:49:15 +02:00
Chrisando Pramudhita
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
Pedro Baracho
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
Michal Srb
c0dd870c6e
Dark mode (#2006)
Co-authored-by: dwelle <luzar.david@gmail.com>
2020-08-13 13:35:31 +02:00
Aakansha Doshi
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
Aakansha Doshi
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
Mohammed Salman
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
David Luzar
cd87bd6901
do not center text when not applicable (#1783) 2020-06-25 21:21:27 +02:00
David Luzar
63c10743fb
split font into fontSize and fontFamily (#1635) 2020-05-27 15:14:50 +02:00
Lipis
c427aa3cce
Prefer arrow functions and callbacks (#1210) 2020-05-20 15:21:37 +02:00
David Luzar
692ceece65
fix not using className when querying container (#1420) 2020-04-13 17:29:11 +02:00
David Luzar
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
Kostas Bariotis
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
Youness Fkhach
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
David Luzar
3fd6f3023f
support newline on shift+enter (#1324) 2020-04-08 20:56:27 +02:00
David Luzar
81b38d8808
fix wysiwyg event cleanup (#1248) 2020-04-05 22:31:59 +02:00
Lipis
ae1eee15cc
Replace ev -> event (#1209) 2020-04-04 10:41:54 +02:00
David Luzar
8030a167c6
make text committing cross-platform (#1188) 2020-04-03 15:56:23 +02:00
alaoui abdellah
980d08ce56
Add support for committing a text entry on cmd/shift click (#1185) 2020-04-03 15:41:32 +03:00
David Luzar
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
Jed Fox
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
Daishi Kato
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
Mohit kumar Bajoria
9b6700755a
Add new line on Enter (#1161)
* Add new line on Enter

Fixes #1158

* Fix lint
2020-04-02 01:41:42 +02:00
dependabot-preview[bot]
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
David Luzar
23b785de68
Trim trailing newlines (#999)
* trim newlines for text elements

* fix comment
2020-03-18 13:01:33 +01:00
Christopher Chedeau
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
David Luzar
f0e6f4dbb8
Text esc fixes (#925)
* fix incorrectly resetting state on esc

* confirm text on esc
2020-03-12 18:04:56 +01:00
Lipis
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
Jed Fox
43236bed68
Fix error with contentEditable (#803) 2020-02-21 19:51:34 -08:00
Jed Fox
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
Enzo Ferey
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
David Luzar
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
Lipis
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
Christopher Chedeau
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
Christopher Chedeau
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