mirror of
https://github.com/webstudio-is/webstudio.git
synced 2026-11-09 05:26:24 +09:00
Ivan Starkov
cad34a3040
## Description
Makes AllComponent type better
Found null bug.
Enforced for all components
```
[componentAttribute]: instance.component,
[idAttribute]: instance.id,
```
to be non-optional.
cc @TrySound should fix your issue with Html component
## 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
33 lines
858 B
TypeScript
33 lines
858 B
TypeScript
import { useEffect, useRef } from "react";
|
|
import type { Point } from "@webstudio-is/design-system";
|
|
|
|
// Draw a point where we think the pointer is to visualize if calculations are based on the right position
|
|
// Only needed for debugging.
|
|
export const usePointerOutline = () => {
|
|
const ref = useRef<HTMLDivElement>();
|
|
|
|
useEffect(() => {
|
|
const div = document.createElement("div");
|
|
div.style.cssText = `
|
|
position: absolute;
|
|
width: 5px;
|
|
height: 5px;
|
|
background: red;
|
|
`;
|
|
document.body.appendChild(div);
|
|
ref.current = div;
|
|
return () => {
|
|
document.body.removeChild(div);
|
|
ref.current = undefined;
|
|
};
|
|
}, []);
|
|
|
|
return (offset: Point) => {
|
|
if (ref.current === undefined) {
|
|
return;
|
|
}
|
|
ref.current.style.left = `${offset.x}px`;
|
|
ref.current.style.top = `${offset.y}px`;
|
|
};
|
|
};
|