mirror of
https://github.com/excalidraw/excalidraw.git
synced 2025-05-03 10:00:07 -04:00
feat: text wrapping (#7999)
* resize single elements from the side * fix lint * do not resize texts from the sides (for we want to wrap/unwrap) * omit side handles for frames too * upgrade types * enable resizing from the sides for multiple elements as well * fix lint * maintain aspect ratio when elements are not of the same angle * lint * always resize proportionally for multiple elements * increase side resizing padding * code cleanup * adaptive handles * do not resize for linear elements with only two points * prioritize point dragging over edge resizing * lint * allow free resizing for multiple elements at degree 0 * always resize from the sides * reduce hit threshold * make small multiple elements movable * lint * show side handles on touch screen and mobile devices * differentiate touchscreens * keep proportional with text in multi-element resizing * update snapshot * update multi elements resizing logic * lint * reduce side resizing padding * bound texts do not scale in normal cases * lint * test sides for texts * wrap text * do not update text size when changing its alignment * keep text wrapped/unwrapped when editing * change wrapped size to auto size from context menu * fix test * lint * increase min width for wrapped texts * wrap wrapped text in container * unwrap when binding text to container * rename `wrapped` to `autoResize` * fix lint * revert: use `center` align when wrapping text in container * update snaps * fix lint * simplify logic on autoResize * lint and test * snapshots * remove unnecessary code * snapshots * fix: defaults not set correctly * tests for wrapping texts when resized * tests for text wrapping when edited * fix autoResize refactor * include autoResize flag check * refactor * feat: rename action label & change contextmenu position * fix: update version on `autoResize` action * fix infinite loop when editing text in a container * simplify * always maintain `width` if `!autoResize` * maintain `x` if `!autoResize` * maintain `y` pos after fontSize change if `!autoResize` * refactor * when editing, do not wrap text in textWysiwyg * simplify text editor * make test more readable * comment * rename action to match file name * revert function signature change * only update in app --------- Co-authored-by: dwelle <5153846+dwelle@users.noreply.github.com>
This commit is contained in:
Ryan Di
GitHub
parent
cc4c51996c
commit
971b4d4ae6
22 changed files with 596 additions and 143 deletions
|
|
@ -228,6 +228,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing s
|
|||
exports[`Test Transform > Test arrow bindings > should bind arrows to existing text elements when start / end provided with ids 1`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": [
|
||||
{
|
||||
|
|
@ -273,6 +274,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing t
|
|||
exports[`Test Transform > Test arrow bindings > should bind arrows to existing text elements when start / end provided with ids 2`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": [
|
||||
{
|
||||
|
|
@ -378,6 +380,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing t
|
|||
exports[`Test Transform > Test arrow bindings > should bind arrows to existing text elements when start / end provided with ids 4`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "id48",
|
||||
|
|
@ -478,6 +481,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to shapes whe
|
|||
exports[`Test Transform > Test arrow bindings > should bind arrows to shapes when start / end provided without ids 2`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "id37",
|
||||
|
|
@ -652,6 +656,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
|
|||
exports[`Test Transform > Test arrow bindings > should bind arrows to text when start / end provided without ids 2`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "id41",
|
||||
|
|
@ -692,6 +697,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
|
|||
exports[`Test Transform > Test arrow bindings > should bind arrows to text when start / end provided without ids 3`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": [
|
||||
{
|
||||
|
|
@ -737,6 +743,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
|
|||
exports[`Test Transform > Test arrow bindings > should bind arrows to text when start / end provided without ids 4`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": [
|
||||
{
|
||||
|
|
@ -1194,6 +1201,7 @@ exports[`Test Transform > should transform regular shapes 6`] = `
|
|||
exports[`Test Transform > should transform text element 1`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": null,
|
||||
|
|
@ -1234,6 +1242,7 @@ exports[`Test Transform > should transform text element 1`] = `
|
|||
exports[`Test Transform > should transform text element 2`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": null,
|
||||
|
|
@ -1566,6 +1575,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
|
|||
exports[`Test Transform > should transform the elements correctly when linear elements have single point 7`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "B",
|
||||
|
|
@ -1608,6 +1618,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
|
|||
exports[`Test Transform > should transform the elements correctly when linear elements have single point 8`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "A",
|
||||
|
|
@ -1650,6 +1661,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
|
|||
exports[`Test Transform > should transform the elements correctly when linear elements have single point 9`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "Alice",
|
||||
|
|
@ -1692,6 +1704,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
|
|||
exports[`Test Transform > should transform the elements correctly when linear elements have single point 10`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "Bob",
|
||||
|
|
@ -1734,6 +1747,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
|
|||
exports[`Test Transform > should transform the elements correctly when linear elements have single point 11`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "Bob_Alice",
|
||||
|
|
@ -1774,6 +1788,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
|
|||
exports[`Test Transform > should transform the elements correctly when linear elements have single point 12`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "Bob_B",
|
||||
|
|
@ -2022,6 +2037,7 @@ exports[`Test Transform > should transform to labelled arrows when label provide
|
|||
exports[`Test Transform > should transform to labelled arrows when label provided for arrows 5`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "id25",
|
||||
|
|
@ -2062,6 +2078,7 @@ exports[`Test Transform > should transform to labelled arrows when label provide
|
|||
exports[`Test Transform > should transform to labelled arrows when label provided for arrows 6`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "id26",
|
||||
|
|
@ -2102,6 +2119,7 @@ exports[`Test Transform > should transform to labelled arrows when label provide
|
|||
exports[`Test Transform > should transform to labelled arrows when label provided for arrows 7`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "id27",
|
||||
|
|
@ -2143,6 +2161,7 @@ LABELLED ARROW",
|
|||
exports[`Test Transform > should transform to labelled arrows when label provided for arrows 8`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "id28",
|
||||
|
|
@ -2406,6 +2425,7 @@ exports[`Test Transform > should transform to text containers when label provide
|
|||
exports[`Test Transform > should transform to text containers when label provided 7`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "id13",
|
||||
|
|
@ -2446,6 +2466,7 @@ exports[`Test Transform > should transform to text containers when label provide
|
|||
exports[`Test Transform > should transform to text containers when label provided 8`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "id14",
|
||||
|
|
@ -2487,6 +2508,7 @@ CONTAINER",
|
|||
exports[`Test Transform > should transform to text containers when label provided 9`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "id15",
|
||||
|
|
@ -2530,6 +2552,7 @@ CONTAINER",
|
|||
exports[`Test Transform > should transform to text containers when label provided 10`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "id16",
|
||||
|
|
@ -2571,6 +2594,7 @@ TEXT CONTAINER",
|
|||
exports[`Test Transform > should transform to text containers when label provided 11`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "id17",
|
||||
|
|
@ -2613,6 +2637,7 @@ CONTAINER",
|
|||
exports[`Test Transform > should transform to text containers when label provided 12`] = `
|
||||
{
|
||||
"angle": 0,
|
||||
"autoResize": true,
|
||||
"backgroundColor": "transparent",
|
||||
"boundElements": null,
|
||||
"containerId": "id18",
|
||||
|
|
|
|||
|
|
@ -208,7 +208,7 @@ const restoreElement = (
|
|||
verticalAlign: element.verticalAlign || DEFAULT_VERTICAL_ALIGN,
|
||||
containerId: element.containerId ?? null,
|
||||
originalText: element.originalText || text,
|
||||
|
||||
autoResize: element.autoResize ?? true,
|
||||
lineHeight,
|
||||
});
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue