bug: Flex boards within a grid based component lose dimensions after creating a new instance

[CodexNotFound]

Steps To Reproduce

The setup for the component is also listed as code under additional context

1. Create board called Grid
2. Assign a Grid layout to it (1 row, 2 columns)
3. Create another board called Flex
4. Assign a Flex layout (column) to it and set the horizontal and vertical align to center and set the width and height to 100%
5. Add two rectangles to the Flex board.
6. Move the Flex board into the first cell of the Grid board
7. Add a rectangle to the second cell of the Grid board
8. Select the grid board and press CTRL+K (make it a component)
9. Press CTRL+C, CTRL+V to make a new instance of this component.
10. Notice how they look identical
11. Drag the instantiated component a tiny bit and notice the dimensions of the flex layout have changed.

Expected behavior

I'm expecting the dimensions of an element to stay the same when dragging a parent

Actual behavior

The dimensions of a child element change when dragging the parent. It only recalculates the proper dimensions if I manually switch to "fixed width" and "fixed height" and back to 100% on both.

Screenshots or video

Overview:

Selected Flex on Instantiated component:

Selected Flex on dragged component:

Desktop (please complete the following information)

• Windows 10
• Firefox 128.0

Smartphone (please complete the following information)

No response

Environment (please complete the following information)

https://design.penpot.app

Frontend Stack Trace

No response

Backend Stack Trace

No response

Additional context

The component code:

{"~:type":"~:copied-shapes","~:features":{"~#set":["layout/grid","styles/v2","components/v2","fdata/shape-data-type"]},"~:version":50,"~:file-id":"~u352e9fc6-6a46-8154-8004-a64884a209e9","~:selected":{"~#ordered-set":["~uf4f8c8ec-4aa8-80d4-8004-a64886b729e2"]},"~:objects":{"~uf4f8c8ec-4aa8-80d4-8004-a64886b729e2":{"~#shape":{"~:y":311,"~:layout-grid-columns":[{"~:type":"~:fixed","~:value":128},{"~:type":"~:flex","~:value":1}],"~:hide-fill-on-export":false,"~:layout-gap-type":"~:multiple","~:layout-padding":{"~:p1":0,"~:p2":0,"~:p3":0,"~:p4":0},"~:transform":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:rotation":0,"~:grow-type":"~:fixed","~:layout":"~:grid","~:hide-in-viewer":false,"~:name":"Grid","~:layout-align-items":"~:start","~:width":327.0000000000001,"~:layout-grid-cells":{"~uf4f8c8ec-4aa8-80d4-8004-a6489cf71d0f":{"~:justify-self":"~:auto","~:column":1,"~:id":"~uf4f8c8ec-4aa8-80d4-8004-a6489cf71d0f","~:position":"~:manual","~:column-span":1,"~:align-self":"~:auto","~:row":1,"~:row-span":1,"~:shapes":["~uf4f8c8ec-4aa8-80d4-8004-a648df16f725"]},"~uf4f8c8ec-4aa8-80d4-8004-a648a92a1f3a":{"~:justify-self":"~:auto","~:column":2,"~:id":"~uf4f8c8ec-4aa8-80d4-8004-a648a92a1f3a","~:position":"~:manual","~:column-span":1,"~:align-self":"~:auto","~:podition":"~:manual","~:row":1,"~:row-span":1,"~:shapes":["~uf4f8c8ec-4aa8-80d4-8004-a648e1fa7e92"]}},"~:layout-padding-type":"~:simple","~:type":"~:frame","~:points":[{"~#point":{"~:x":607,"~:y":311}},{"~#point":{"~:x":934.0000000000001,"~:y":311}},{"~#point":{"~:x":934.0000000000001,"~:y":439}},{"~#point":{"~:x":607,"~:y":439}}],"~:component-root":true,"~:layout-item-h-sizing":"~:auto","~:proportion-lock":false,"~:layout-gap":{"~:row-gap":0,"~:column-gap":0},"~:transform-inverse":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:layout-item-v-sizing":"~:auto","~:layout-justify-content":"~:stretch","~:id":"~uf4f8c8ec-4aa8-80d4-8004-a64886b729e2","~:layout-justify-items":"~:start","~:parent-id":"~u00000000-0000-0000-0000-000000000000","~:layout-align-content":"~:stretch","~:component-id":"~uf4f8c8ec-4aa8-80d4-8004-a649600108a6","~:frame-id":"~u00000000-0000-0000-0000-000000000000","~:strokes":[],"~:x":607,"~:main-instance":true,"~:proportion":1,"~:layout-grid-rows":[{"~:type":"~:fixed","~:value":128}],"~:selrect":{"~#rect":{"~:x":607,"~:y":311,"~:width":327.0000000000001,"~:height":128,"~:x1":607,"~:y1":311,"~:x2":934.0000000000001,"~:y2":439}},"~:fills":[{"~:fill-color":"#FFFFFF","~:fill-opacity":1}],"~:layout-grid-dir":"~:row","~:flip-x":null,"~:height":128,"~:component-file":"~u352e9fc6-6a46-8154-8004-a64884a209e9","~:flip-y":null,"~:shapes":["~uf4f8c8ec-4aa8-80d4-8004-a648e1fa7e92","~uf4f8c8ec-4aa8-80d4-8004-a648df16f725"]}},"~uf4f8c8ec-4aa8-80d4-8004-a648e1fa7e92":{"~#shape":{"~:y":311,"~:rx":0,"~:transform":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:rotation":0,"~:grow-type":"~:fixed","~:hide-in-viewer":false,"~:name":"Rectangle","~:width":199,"~:type":"~:rect","~:points":[{"~#point":{"~:x":735,"~:y":311}},{"~#point":{"~:x":934,"~:y":311}},{"~#point":{"~:x":934,"~:y":370}},{"~#point":{"~:x":735,"~:y":370}}],"~:proportion-lock":false,"~:transform-inverse":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:constraints-v":"~:top","~:constraints-h":"~:left","~:id":"~uf4f8c8ec-4aa8-80d4-8004-a648e1fa7e92","~:parent-id":"~uf4f8c8ec-4aa8-80d4-8004-a64886b729e2","~:frame-id":"~uf4f8c8ec-4aa8-80d4-8004-a64886b729e2","~:strokes":[],"~:x":735,"~:proportion":1,"~:selrect":{"~#rect":{"~:x":735,"~:y":311,"~:width":199,"~:height":59,"~:x1":735,"~:y1":311,"~:x2":934,"~:y2":370}},"~:fills":[{"~:fill-color":"#B1B2B5","~:fill-opacity":1}],"~:flip-x":null,"~:ry":0,"~:height":59,"~:flip-y":null}},"~uf4f8c8ec-4aa8-80d4-8004-a648df16f725":{"~#shape":{"~:y":311,"~:hide-fill-on-export":false,"~:layout-gap-type":"~:multiple","~:layout-padding":{"~:p1":4,"~:p2":19,"~:p3":4,"~:p4":19},"~:transform":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:rotation":0,"~:layout-wrap-type":"~:nowrap","~:grow-type":"~:fixed","~:layout":"~:flex","~:hide-in-viewer":true,"~:name":"Flex","~:layout-align-items":"~:center","~:width":128,"~:layout-padding-type":"~:simple","~:type":"~:frame","~:points":[{"~#point":{"~:x":607,"~:y":311}},{"~#point":{"~:x":735,"~:y":311}},{"~#point":{"~:x":735,"~:y":439}},{"~#point":{"~:x":607,"~:y":439}}],"~:layout-item-h-sizing":"~:fill","~:proportion-lock":false,"~:layout-gap":{"~:row-gap":13,"~:column-gap":0},"~:transform-inverse":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:layout-item-v-sizing":"~:fill","~:layout-justify-content":"~:center","~:id":"~uf4f8c8ec-4aa8-80d4-8004-a648df16f725","~:parent-id":"~uf4f8c8ec-4aa8-80d4-8004-a64886b729e2","~:layout-flex-dir":"~:column","~:layout-align-content":"~:stretch","~:frame-id":"~uf4f8c8ec-4aa8-80d4-8004-a64886b729e2","~:strokes":[],"~:x":607,"~:proportion":1,"~:selrect":{"~#rect":{"~:x":607,"~:y":311,"~:width":128,"~:height":128,"~:x1":607,"~:y1":311,"~:x2":735,"~:y2":439}},"~:fills":[{"~:fill-color":"#FFFFFF","~:fill-opacity":1}],"~:flip-x":null,"~:height":128,"~:flip-y":null,"~:shapes":["~uf4f8c8ec-4aa8-80d4-8004-a648e6fcc2fb","~uf4f8c8ec-4aa8-80d4-8004-a648ecd16d24"]}},"~uf4f8c8ec-4aa8-80d4-8004-a648e6fcc2fb":{"~#shape":{"~:y":364.5,"~:rx":0,"~:transform":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:rotation":0,"~:grow-type":"~:fixed","~:hide-in-viewer":false,"~:name":"Rectangle","~:width":48,"~:type":"~:rect","~:points":[{"~#point":{"~:x":647,"~:y":364.5}},{"~#point":{"~:x":695,"~:y":364.5}},{"~#point":{"~:x":695,"~:y":413.5}},{"~#point":{"~:x":647,"~:y":413.5}}],"~:proportion-lock":false,"~:transform-inverse":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:id":"~uf4f8c8ec-4aa8-80d4-8004-a648e6fcc2fb","~:parent-id":"~uf4f8c8ec-4aa8-80d4-8004-a648df16f725","~:frame-id":"~uf4f8c8ec-4aa8-80d4-8004-a648df16f725","~:strokes":[],"~:x":647,"~:proportion":1,"~:selrect":{"~#rect":{"~:x":647,"~:y":364.5,"~:width":48,"~:height":49,"~:x1":647,"~:y1":364.5,"~:x2":695,"~:y2":413.5}},"~:fills":[{"~:fill-color":"#B1B2B5","~:fill-opacity":1}],"~:flip-x":null,"~:ry":0,"~:height":49,"~:flip-y":null}},"~uf4f8c8ec-4aa8-80d4-8004-a648ecd16d24":{"~#shape":{"~:y":336.5,"~:rx":0,"~:transform":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:rotation":0,"~:grow-type":"~:fixed","~:hide-in-viewer":false,"~:name":"Rectangle","~:width":77,"~:type":"~:rect","~:points":[{"~#point":{"~:x":632.5,"~:y":336.5}},{"~#point":{"~:x":709.5,"~:y":336.5}},{"~#point":{"~:x":709.5,"~:y":351.5}},{"~#point":{"~:x":632.5,"~:y":351.5}}],"~:proportion-lock":false,"~:transform-inverse":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:id":"~uf4f8c8ec-4aa8-80d4-8004-a648ecd16d24","~:parent-id":"~uf4f8c8ec-4aa8-80d4-8004-a648df16f725","~:frame-id":"~uf4f8c8ec-4aa8-80d4-8004-a648df16f725","~:strokes":[],"~:x":632.5,"~:proportion":1,"~:selrect":{"~#rect":{"~:x":632.5,"~:y":336.5,"~:width":77,"~:height":15,"~:x1":632.5,"~:y1":336.5,"~:x2":709.5,"~:y2":351.5}},"~:fills":[{"~:fill-color":"#B1B2B5","~:fill-opacity":1}],"~:flip-x":null,"~:ry":0,"~:height":15,"~:flip-y":null}}},"~:images":{"~#set":[]}}

[madalenapmelo-kp]

Hi @CodexNotFound,

I'm not sure I was able to understand the issue, could you share a screen recording of the behavior described?

[CodexNotFound]

Hey @madalenapmelo-kp
I just made a screenrecording, I currently don't have a proper mic, so there is no audio of me explaining it. I tried to mark important things with moving my mouse over it. If it's not clear let me know and I'll record one later with me actually trying to explain it.

penpot-issue4881.mp4

[madalenapmelo-kp]

Hi @CodexNotFound,

Thanks for reporting this! We've added this to our backlog on Taiga so that we can look further into it, you can find the details here: https://tree.taiga.io/project/penpot/issue/8430

[shdwchn10]

Hi! I encountered a very similar bug with grid board within grid component. In my case component's grid (root grid) lost 'fit content' horizontal/vertical modifiers and inner grid got wrong dimensions. Workaround for this: click reset overrides and 'fit content' horizontal/vertical on the root grid.

Should I open a new issue?

Platform:
Fedora Silverblue 40, GNOME 46, Wayland
Chrome 127.0.6533.119

Demo:

Screencast.from.2024-08-23.23-05-42.webm

Component code:

{"~:type":"~:copied-shapes","~:features":{"~#set":["layout/grid","styles/v2","components/v2","fdata/shape-data-type"]},"~:version":51,"~:file-id":"~u9c5640f9-82b6-81df-8004-db6c09197a1a","~:selected":{"~#ordered-set":["~u36eebecc-26b4-80cc-8004-db4d690f20fb"]},"~:objects":{"~u36eebecc-26b4-80cc-8004-db4d690f20fb":{"~#shape":{"~:y":-449,"~:layout-grid-columns":[{"~:type":"~:fixed","~:value":7},{"~:type":"~:flex","~:value":1}],"~:hide-fill-on-export":false,"~:layout-gap-type":"~:multiple","~:layout-padding":{"~:p1":0,"~:p2":0,"~:p3":0,"~:p4":0},"~:transform":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:rotation":0,"~:layout":"~:grid","~:name":"Message","~:layout-align-items":"~:end","~:width":89.00000000000023,"~:layout-grid-cells":{"~u36eebecc-26b4-80cc-8004-db4d7586e098":{"~:justify-self":"~:auto","~:column":1,"~:id":"~u36eebecc-26b4-80cc-8004-db4d7586e098","~:position":"~:manual","~:column-span":1,"~:align-self":"~:auto","~:row":1,"~:row-span":1,"~:shapes":["~u36eebecc-26b4-80cc-8004-db4d4e8ed6b0"]},"~u36eebecc-26b4-80cc-8004-db4d7586e099":{"~:justify-self":"~:auto","~:column":2,"~:id":"~u36eebecc-26b4-80cc-8004-db4d7586e099","~:position":"~:manual","~:column-span":1,"~:align-self":"~:auto","~:row":1,"~:row-span":1,"~:shapes":["~u36eebecc-26b4-80cc-8004-db4d4e8ed6ad"]}},"~:layout-padding-type":"~:simple","~:type":"~:frame","~:points":[{"~#point":{"~:x":-2066,"~:y":-449}},{"~#point":{"~:x":-1976.9999999999998,"~:y":-449}},{"~#point":{"~:x":-1976.9999999999998,"~:y":-418.0000000000004}},{"~#point":{"~:x":-2066,"~:y":-418.0000000000004}}],"~:layout-item-h-sizing":"~:auto","~:proportion-lock":false,"~:layout-gap":{"~:row-gap":0,"~:column-gap":0},"~:transform-inverse":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:layout-item-v-sizing":"~:auto","~:layout-justify-content":"~:stretch","~:id":"~u36eebecc-26b4-80cc-8004-db4d690f20fb","~:layout-justify-items":"~:start","~:parent-id":"~u00000000-0000-0000-0000-000000000000","~:layout-align-content":"~:stretch","~:frame-id":"~u00000000-0000-0000-0000-000000000000","~:strokes":[],"~:x":-2066,"~:proportion":1,"~:layout-grid-rows":[{"~:type":"~:flex","~:value":1}],"~:selrect":{"~#rect":{"~:x":-2066,"~:y":-449,"~:width":89.00000000000023,"~:height":30.999999999999602,"~:x1":-2066,"~:y1":-449,"~:x2":-1976.9999999999998,"~:y2":-418.0000000000004}},"~:fills":[],"~:layout-grid-dir":"~:row","~:flip-x":null,"~:height":30.999999999999602,"~:flip-y":null,"~:shapes":["~u36eebecc-26b4-80cc-8004-db4d4e8ed6ad","~u36eebecc-26b4-80cc-8004-db4d4e8ed6b0"]}},"~u36eebecc-26b4-80cc-8004-db4d4e8ed6ad":{"~#shape":{"~:y":-449,"~:layout-grid-columns":[{"~:type":"~:flex","~:value":1},{"~:type":"~:fixed","~:value":39}],"~:hide-fill-on-export":false,"~:layout-gap-type":"~:multiple","~:layout-padding":{"~:p1":0,"~:p2":0,"~:p3":0,"~:p4":0},"~:transform":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:rotation":0,"~:layout":"~:grid","~:hide-in-viewer":true,"~:name":"Board","~:layout-align-items":"~:center","~:width":82.00000000000023,"~:layout-grid-cells":{"~u36eebecc-26b4-80cc-8004-db49eef967c7":{"~:justify-self":"~:center","~:column":1,"~:id":"~u36eebecc-26b4-80cc-8004-db49eef967c7","~:position":"~:auto","~:column-span":1,"~:align-self":"~:center","~:row":1,"~:row-span":1,"~:shapes":["~u36eebecc-26b4-80cc-8004-db4d4e8ed6af"]},"~u36eebecc-26b4-80cc-8004-db4b0aef0531":{"~:justify-self":"~:end","~:column":2,"~:id":"~u36eebecc-26b4-80cc-8004-db4b0aef0531","~:position":"~:manual","~:column-span":1,"~:align-self":"~:end","~:row":1,"~:row-span":1,"~:shapes":[]}},"~:layout-padding-type":"~:simple","~:type":"~:frame","~:points":[{"~#point":{"~:x":-2059,"~:y":-449}},{"~#point":{"~:x":-1976.9999999999998,"~:y":-449}},{"~#point":{"~:x":-1976.9999999999998,"~:y":-418.0000000000004}},{"~#point":{"~:x":-2059,"~:y":-418.0000000000004}}],"~:r2":12,"~:show-content":true,"~:layout-item-h-sizing":"~:auto","~:proportion-lock":false,"~:layout-gap":{"~:row-gap":0,"~:column-gap":0},"~:transform-inverse":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:layout-item-v-sizing":"~:auto","~:r3":12,"~:layout-justify-content":"~:stretch","~:r1":12,"~:id":"~u36eebecc-26b4-80cc-8004-db4d4e8ed6ad","~:layout-justify-items":"~:start","~:parent-id":"~u36eebecc-26b4-80cc-8004-db4d690f20fb","~:layout-align-content":"~:stretch","~:frame-id":"~u36eebecc-26b4-80cc-8004-db4d690f20fb","~:strokes":[],"~:x":-2059,"~:proportion":1,"~:r4":0,"~:layout-grid-rows":[{"~:type":"~:flex","~:value":1}],"~:selrect":{"~#rect":{"~:x":-2059,"~:y":-449,"~:width":82.00000000000023,"~:height":30.999999999999602,"~:x1":-2059,"~:y1":-449,"~:x2":-1976.9999999999998,"~:y2":-418.0000000000004}},"~:fills":[{"~:fill-color":"#222e3a","~:fill-color-ref-id":"~ubc3b0c36-c9a6-80f6-8004-cfa2dc0077d4","~:fill-color-ref-file":"~u9c5640f9-82b6-81df-8004-db6c09197a1a","~:fill-opacity":1}],"~:layout-grid-dir":"~:column","~:flip-x":null,"~:height":30.999999999999602,"~:flip-y":null,"~:shapes":["~u36eebecc-26b4-80cc-8004-db4d4e8ed6ae","~u36eebecc-26b4-80cc-8004-db4d4e8ed6af"]}},"~u36eebecc-26b4-80cc-8004-db4d4e8ed6b0":{"~#shape":{"~:y":null,"~:transform":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:rotation":0,"~:grow-type":"~:fixed","~:content":[{"~:command":"~:move-to","~:relative":false,"~:params":{"~:x":-2059,"~:y":-418.0000000000004}},{"~:command":"~:line-to","~:relative":false,"~:params":{"~:x":-2059.000000000001,"~:y":-430.0000000000004}},{"~:command":"~:curve-to","~:params":{"~:x":-2065.5007661694344,"~:y":-419.00032613659215,"~:c1x":-2059.000000000001,"~:c1y":-430.0000000000004,"~:c2x":-2059.509960202645,"~:c2y":-420.0002964878111}},{"~:command":"~:curve-to","~:relative":false,"~:params":{"~:x":-2066,"~:y":-418.5003409609829,"~:c1x":-2065.5007661694344,"~:c1y":-419.00032613659215,"~:c2x":-2066,"~:c2y":-418.83366441138895}},{"~:command":"~:curve-to","~:params":{"~:x":-2065.5007661694344,"~:y":-418.0003557853733,"~:c1x":-2066,"~:c1y":-418.1670175105764,"~:c2x":-2065.5007661694344,"~:c2y":-418.0003557853733}},{"~:command":"~:line-to","~:params":{"~:x":-2059,"~:y":-418.0000000000004}}],"~:hide-in-viewer":false,"~:name":"Rectangle","~:width":null,"~:type":"~:path","~:points":[{"~#point":{"~:x":-2066,"~:y":-430.0000000000004}},{"~#point":{"~:x":-2059.000000000001,"~:y":-430.0000000000004}},{"~#point":{"~:x":-2059,"~:y":-418.0000000000004}},{"~#point":{"~:x":-2066,"~:y":-418.0000000000004}}],"~:show-content":true,"~:proportion-lock":false,"~:transform-inverse":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:hidden":false,"~:id":"~u36eebecc-26b4-80cc-8004-db4d4e8ed6b0","~:parent-id":"~u36eebecc-26b4-80cc-8004-db4d690f20fb","~:frame-id":"~u36eebecc-26b4-80cc-8004-db4d690f20fb","~:strokes":[],"~:x":null,"~:proportion":1,"~:selrect":{"~#rect":{"~:x":-2066,"~:y":-430.0000000000004,"~:width":7,"~:height":12,"~:x1":-2066,"~:y1":-430.0000000000004,"~:x2":-2059,"~:y2":-418.0000000000004}},"~:fills":[{"~:fill-color":"#222e3a","~:fill-opacity":1}],"~:flip-x":null,"~:height":null,"~:flip-y":null}},"~u36eebecc-26b4-80cc-8004-db4d4e8ed6ae":{"~#shape":{"~:y":-433.9783720961771,"~:layout-item-absolute":true,"~:transform":{"~#matrix":{"~:a":0.9999989598189458,"~:b":0.0014423456726975203,"~:c":-0.0014423456727570283,"~:d":0.9999989598189458,"~:e":-8.571987564209849e-11,"~:f":-1.1169731806148775e-11}},"~:rotation":0.08264034829960565,"~:grow-type":"~:fixed","~:content":{"~:type":"root","~:children":[{"~:type":"paragraph-set","~:children":[{"~:line-height":"1.2","~:font-style":"normal","~:children":[{"~:line-height":"1.2","~:font-style":"normal","~:text-transform":"none","~:text-align":"left","~:font-id":"gfont-roboto","~:font-size":"12","~:font-weight":"400","~:font-variant-id":"regular","~:text-decoration":"none","~:letter-spacing":"0","~:fills":[{"~:fill-color":"#6f7e89","~:fill-opacity":1}],"~:font-family":"Roboto","~:text":"12:34"}],"~:text-transform":"none","~:text-align":"left","~:font-id":"gfont-roboto","~:key":"enkd9","~:font-size":"12","~:font-weight":"400","~:type":"paragraph","~:font-variant-id":"regular","~:text-decoration":"none","~:letter-spacing":"0","~:fills":[{"~:fill-color":"#6f7e89","~:fill-opacity":1}],"~:font-family":"Roboto"}]}],"~:vertical-align":"bottom"},"~:hide-in-viewer":false,"~:name":"12:34","~:width":29.999999999995907,"~:type":"~:text","~:points":[{"~#point":{"~:x":-2014.9798071605824,"~:y":-434.00000000000017}},{"~#point":{"~:x":-1984.9798383660184,"~:y":-433.9567296298192}},{"~#point":{"~:x":-1985.0000312054365,"~:y":-419.9567441926194}},{"~#point":{"~:x":-2015.0000000000005,"~:y":-420.00001456280035}}],"~:transform-inverse":{"~#matrix":{"~:a":0.9999989598189325,"~:b":-0.001442345672697501,"~:c":0.001442345672757009,"~:d":0.9999989598189325,"~:e":8.573589709224318e-11,"~:f":1.1046082495908671e-11}},"~:constraints-v":"~:bottom","~:constraints-h":"~:right","~:id":"~u36eebecc-26b4-80cc-8004-db4d4e8ed6ae","~:parent-id":"~u36eebecc-26b4-80cc-8004-db4d4e8ed6ad","~:position-data":[{"~#rect":{"~:y":-420.3689970961771,"~:font-style":"normal","~:text-transform":"none","~:font-size":"12px","~:font-weight":"400","~:y1":-0.390625,"~:width":29.859375,"~:text-decoration":"none solid rgb(111, 126, 137)","~:letter-spacing":"normal","~:x":-2014.9899191830073,"~:x1":0,"~:y2":13.609375,"~:fills":[{"~:fill-color":"#6f7e89","~:fill-opacity":1}],"~:x2":29.859375,"~:direction":"ltr","~:font-family":"Roboto","~:height":14,"~:text":"12:34"}}],"~:frame-id":"~u36eebecc-26b4-80cc-8004-db4d4e8ed6ad","~:x":-2014.9899191830073,"~:selrect":{"~#rect":{"~:x":-2014.9899191830073,"~:y":-433.9783720961771,"~:width":29.999999999995907,"~:height":13.999999999734655,"~:x1":-2014.9899191830073,"~:y1":-433.9783720961771,"~:x2":-1984.9899191830114,"~:y2":-419.97837209644246}},"~:flip-x":null,"~:height":13.999999999734655,"~:flip-y":null}},"~u36eebecc-26b4-80cc-8004-db4d4e8ed6af":{"~#shape":{"~:y":-443,"~:transform":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:rotation":0,"~:grow-type":"~:auto-width","~:content":{"~:type":"root","~:children":[{"~:type":"paragraph-set","~:children":[{"~:line-height":"1.2","~:font-style":"normal","~:children":[{"~:line-height":"1.2","~:font-style":"normal","~:text-transform":"capitalize","~:text-align":"left","~:font-id":"gfont-roboto","~:font-size":"16","~:font-weight":"400","~:font-variant-id":"regular","~:text-decoration":"none","~:letter-spacing":"0","~:fills":[{"~:fill-color":"#f2e8e8","~:fill-color-ref-id":"~ubc3b0c36-c9a6-80f6-8004-cf856ccc4a0d","~:fill-color-ref-file":"~u9c5640f9-82b6-81df-8004-db6c09197a1a","~:fill-opacity":1}],"~:font-family":"Roboto","~:text":"Test"}],"~:text-transform":"capitalize","~:text-align":"left","~:font-id":"gfont-roboto","~:key":"eucc6","~:font-size":"16","~:font-weight":"400","~:type":"paragraph","~:font-variant-id":"regular","~:text-decoration":"none","~:letter-spacing":"0","~:fills":[{"~:fill-color":"#f2e8e8","~:fill-color-ref-id":"~ubc3b0c36-c9a6-80f6-8004-cf856ccc4a0d","~:fill-color-ref-file":"~u9c5640f9-82b6-81df-8004-db6c09197a1a","~:fill-opacity":1}],"~:font-family":"Roboto"}]}]},"~:hide-in-viewer":false,"~:name":"Test","~:layout-item-margin-type":"~:multiple","~:width":31.000000000000227,"~:type":"~:text","~:points":[{"~#point":{"~:x":-2053,"~:y":-443}},{"~#point":{"~:x":-2021.9999999999998,"~:y":-443}},{"~#point":{"~:x":-2021.9999999999998,"~:y":-423.00000000000034}},{"~#point":{"~:x":-2053,"~:y":-423}}],"~:layout-item-h-sizing":"~:fix","~:proportion-lock":false,"~:transform-inverse":{"~#matrix":{"~:a":1,"~:b":0,"~:c":0,"~:d":1,"~:e":0,"~:f":0}},"~:layout-item-v-sizing":"~:fix","~:id":"~u36eebecc-26b4-80cc-8004-db4d4e8ed6af","~:parent-id":"~u36eebecc-26b4-80cc-8004-db4d4e8ed6ad","~:position-data":[{"~#rect":{"~:y":-424,"~:font-style":"normal","~:text-transform":"capitalize","~:font-size":"16px","~:font-weight":"400","~:y1":0,"~:width":30.734375,"~:text-decoration":"none solid rgb(242, 232, 232)","~:letter-spacing":"normal","~:x":-2053,"~:x1":0,"~:y2":19,"~:fills":[{"~:fill-color":"#f2e8e8","~:fill-color-ref-id":"~ubc3b0c36-c9a6-80f6-8004-cf856ccc4a0d","~:fill-color-ref-file":"~u9c5640f9-82b6-81df-8004-db6c09197a1a","~:fill-opacity":1}],"~:x2":30.734375,"~:direction":"ltr","~:font-family":"Roboto","~:height":19,"~:text":"Test"}}],"~:frame-id":"~u36eebecc-26b4-80cc-8004-db4d4e8ed6ad","~:x":-2053,"~:proportion":0.55,"~:layout-item-margin":{"~:m1":6,"~:m3":6,"~_":6,"~:m2":6,"~:m4":6},"~:selrect":{"~#rect":{"~:x":-2053,"~:y":-443,"~:width":31.000000000000227,"~:height":20,"~:x1":-2053,"~:y1":-443,"~:x2":-2021.9999999999998,"~:y2":-423}},"~:flip-x":null,"~:height":20,"~:flip-y":null}}},"~:images":{"~#set":[]}}

[madalenapmelo-kp]

This issue has been fixed and the fix will be released soon!