Commit Graph
1 Commits
Author SHA1 Message Date
Ivan Starkov 4f10bc26f8 Attempt to hover/select without element (#2014)
## Description

Removes `div style="display:contents"` arount Radix etc Components.

Below in Implementation is written why SelectedInstanceConnector was
moved into standalone root level hook.
In short
- [x] - No issues with visually hidden components.
- [x] - Allows us to not use refs for the builder support. (Now our
components can be without refs)
- [ ] - cc @TrySound ContentEditable could also use
getAllElementsBoundingBox from domUtils to get element ref this will
allow to remove useRef from WebstudioDevComponent

Changes from previous behavior:

- Now on preview elements are not selected (now is like in webflow).
- On changing marign etc we do not hide outline as before



## Implementation: 

having `instanceSelector` we can 
- Find all elements with attribute `data-ws-selector` which ends with
`instanceSelector`
- Then find "root/parent" elements of found elements. _(We can find few
subtrees)_
- Then use that elements instead of wrapper element.

This works fine with tree hovering and selections.
This allows us to not use `refs` inside our WebstudioDevComponent at
all.

### Below is why SelectedInstanceConnector was rewritten

The issue arises when such element is duplicated by radix into
VisuallyHidden element.

There is no way to detect now inside `WebstudioComponentDev` does
current Component is inside VisuallyHidden
(We have no reference element to detect that.)

So current approach makes any additional changes useless.
I'm going to close this. And leave just for example




## Steps for reproduction

1. click button
2. expect xyz

## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio-builder/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env.example`
and the `builder/env-check.js` if mandatory
2023-08-04 13:34:14 +03:00