Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Spike/grid controls #6027

Closed
wants to merge 33 commits into from
Closed

Spike/grid controls #6027

wants to merge 33 commits into from

Conversation

bkrmendy
Copy link
Contributor

@bkrmendy bkrmendy commented Jul 1, 2024

Problem

Utopia doesn't support grid layouts

Fix

Use the code we created during the hack days as a basis for supporting grids. This PR should be split into multiple smaller PRs, to me merged separately

TODO

Copy link
Contributor

github-actions bot commented Jul 1, 2024

Try me

Copy link

relativeci bot commented Jul 1, 2024

#13245 Bundle Size — 62.52MiB (+0.04%).

36a4aaf(current) vs 6339ece master#13244(baseline)

Warning

Bundle contains 51 duplicate packages – View duplicate packages

Bundle metrics  Change 4 changes Regression 2 regressions
                 Current
#13245
     Baseline
#13244
Regression  Initial JS 45.57MiB(+0.04%) 45.55MiB
No change  Initial CSS 0B 0B
Change  Cache Invalidation 21.6% 23.8%
No change  Chunks 30 30
No change  Assets 33 33
Change  Modules 4323(+0.09%) 4319
Regression  Duplicate Modules 525(+0.19%) 524
No change  Duplicate Code 31.75% 31.75%
No change  Packages 450 450
No change  Duplicate Packages 51 51
Bundle size by type  Change 2 changes Regression 1 regression Improvement 1 improvement
                 Current
#13245
     Baseline
#13244
Regression  JS 62.51MiB (+0.04%) 62.48MiB
Improvement  HTML 11.16KiB (-0.33%) 11.2KiB

Bundle analysis reportBranch spike/grid-controlsProject dashboard

)
}
}
// if (foundTarget != null && draggingAllowed) {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we need to find out how to make this work

bkrmendy added a commit that referenced this pull request Jul 1, 2024
Split out from #6027

## Description
This PR adds the `specialSizeMeasurements` fields we need to support the
grid strategies from
#6027.

This PR doesn't add tests (beyond the snapshots), because this
functionality will be tested through the strategies

**Manual Tests:**
I hereby swear that:

- [x] I opened a hydrogen project and it loaded
- [x] I could navigate to various routes in Preview mode
ruggi and others added 2 commits July 1, 2024 16:12
# Conflicts:
#	editor/src/components/canvas/dom-walker.ts
#	editor/src/components/inspector/common/css-utils.ts
#	editor/src/core/shared/element-template.ts
ruggi added a commit that referenced this pull request Jul 2, 2024
This is groundwork for
#6027.

The `Roll Your Own` floating thing made in the spike becomes a tab in
the right pane (in the future we might want to have it as a floating
panel, but we can incrementally extract it later on).

The `Grid` section is left deliberately empty so we can fill it in with
the other grid-related PRs.

**Context/history**

As part of the exploratory work on grid interactions
(#6027) I added a way to
test individual interaction/UI pieces in the spirit of [the classic
Steve Jobs calculator
story](https://www.reddit.com/r/mac/comments/o89l6i/the_apple_team_created_an_app_so_that_steve_jobs/)
- called `Roll Your Own Grid`

<img width="368" alt="Screenshot 2024-07-01 at 17 55 30"
src="https://github.com/concrete-utopia/utopia/assets/1081051/c99a46a8-60ba-4a7c-ae03-ed4145ea7c3a">

There's a good chance this stuff will be useful for more than Grid in
the future (e.g. the inspector, the canvas etc) so we can reuse this
idea in other contexts, while keeping the original concept.

**Note**
The PR includes a demo feature type for `Grid` for illustration purposes
only; it should be replaced with the actual features.
ruggi and others added 3 commits July 2, 2024 10:30
@bkrmendy bkrmendy closed this Jul 9, 2024
liady pushed a commit that referenced this pull request Dec 13, 2024
Split out from #6027

## Description
This PR adds the `specialSizeMeasurements` fields we need to support the
grid strategies from
#6027.

This PR doesn't add tests (beyond the snapshots), because this
functionality will be tested through the strategies

**Manual Tests:**
I hereby swear that:

- [x] I opened a hydrogen project and it loaded
- [x] I could navigate to various routes in Preview mode
liady pushed a commit that referenced this pull request Dec 13, 2024
This is groundwork for
#6027.

The `Roll Your Own` floating thing made in the spike becomes a tab in
the right pane (in the future we might want to have it as a floating
panel, but we can incrementally extract it later on).

The `Grid` section is left deliberately empty so we can fill it in with
the other grid-related PRs.

**Context/history**

As part of the exploratory work on grid interactions
(#6027) I added a way to
test individual interaction/UI pieces in the spirit of [the classic
Steve Jobs calculator
story](https://www.reddit.com/r/mac/comments/o89l6i/the_apple_team_created_an_app_so_that_steve_jobs/)
- called `Roll Your Own Grid`

<img width="368" alt="Screenshot 2024-07-01 at 17 55 30"
src="https://github.com/concrete-utopia/utopia/assets/1081051/c99a46a8-60ba-4a7c-ae03-ed4145ea7c3a">

There's a good chance this stuff will be useful for more than Grid in
the future (e.g. the inspector, the canvas etc) so we can reuse this
idea in other contexts, while keeping the original concept.

**Note**
The PR includes a demo feature type for `Grid` for illustration purposes
only; it should be replaced with the actual features.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants