242 Commits
Author SHA1 Message Date
Ivan Starkov bcd615022b Remove useless warning (#1435)
## Description

No longer needed, as impossible to set width less than allowed

## 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-04-13 01:22:46 +04:00
Ivan Starkov 969d311b66 Npm packages release 0.55.0 (#1433)
## Description

Npm packages release 0.55.0

## 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-04-13 00:47:17 +04:00
Oleg Isonen ffb3811380 Use scroll area in style right panels (#1434)
## Description

Replacing scrollbar in all panels on the right

Closes https://github.com/webstudio-is/webstudio-builder/issues/1417

## 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-04-12 22:43:03 +02:00
Bogdan Chadkin d4753f0a26 Switch canvas and published rendering to normalized instances (#1422)
Ref https://github.com/webstudio-is/webstudio-builder/issues/696

Here we finally can switch to normalized instances for rendering tree
and get rid from denormalization for published sites.

## Code Review

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

## 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-04-12 21:32:03 +02:00
Ivan Starkov 3dd40cc5e6 Fix inital canvas size and breakpoints (#1430)
## Description

This is the fast-fix.
Better to rewrite as here
https://github.com/webstudio-is/webstudio-builder/issues/1431

## 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-04-12 22:05:04 +04:00
Oleg Isonen 21073ecaa5 Top panel drop shadow (#1432)
closes https://github.com/webstudio-is/webstudio-builder/issues/1419

## Description

1. What is this PR about (link the issue and add a short description)

## Steps for reproduction

1. style panel shadow on the top panel
 

## 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-04-12 20:02:15 +02:00
Bogdan Chadkin 1c0faf73d6 Fix tree hover (#1429)
There were two problems here. 1 hover out provided item selector which
actually made it hovered. And outline was not reset when hover selector
is reset.
2023-04-13 00:19:00 +07:00
Ivan Starkov 62001142ec Fix cascade indicators on scrub move (#1428)
## Description

Map used based on

https://react.dev/learn/manipulating-the-dom-with-refs#how-to-manage-a-list-of-refs-using-a-ref-callback


## 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-04-12 20:35:00 +04:00
Ivan Starkov a4c9bb8603 Fix perf on scrub (#1425)
## Description

fixes perf on breakpoint scrub change

Still some issues on breakpoint change, but we know why this happens.
Would be fixed in next iterations.

## 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-04-12 19:44:26 +04:00
Ivan Starkov deb4a49347 Update npm versions 0.54.0 (#1423)
## Description

Update npm versions 0.54.0

## 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-04-12 16:42:00 +04:00
Oleg IsonenandIvan Starkov 3b0aba880e Breakpoints stage 3 (#1413)
## Description

1. Input instead of a slider

## Steps for reproduction

1. click button
2. expect xyz

## Code Review

- [ ] hi @TrySound , I need you to do
  - detailed review (read every line)

- [ ] hi @istarkov  , I need you to do
  - conceptual review (architecture, feature-correctness)
  - 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

---------

Co-authored-by: Ivan Starkov <istarkov@gmail.com>
2023-04-12 16:22:08 +04:00
Ivan Starkov 1ecea88ddb Speedup add remove nodes (#1415)
## Description

Reduces amount of renders from 6 to 2 on addding/deleting instances

Reduction to 1 render is impossible in our current architecture as
following situation happens.

On add node, we set selectedInstanceSelectorStore from the builder, what
cause

In the canvas "SelectedInstanceConnector" sets computed styles etc and
sync back. Both are causing double rendering.

Can be avoided in the future allowing to set store from the builder in a
canvas.


## 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-04-12 12:19:07 +04:00
Bogdan Chadkin 34181a1a95 Add public path to local image loader (#1409)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1179

Added ASSET_PUBLIC_PATH env for local development
and publicPath option in local image loader.

Now fs asset client provides name as path without modification on server
side.
2023-04-11 22:02:44 +07:00
Ivan Starkov 167d746107 UX improvement for Inputs that have both keywords and units (#1412)
## Description

closes #956

+ In case if user not edited the value but immediately clicked to unit
select we are trying to convert em px etc values

## Steps for reproduction

1. Edit `width` value, enter 10
go to unit select set `em` - see 10em as final result

2. Click on unit select of the width, change em to px see 10em converted
to 140px or like (depends on em size)

3. Enter `Auto` in width, click Enter. 
Click on UnitSelect select EM, see browser style is used to set em
width.

4. Enter Auto in width, switch on Unit select, set px, see browser style
is used.

5. See that now unit selector is visible always. With some exclusions
like aspectRatio as it has keywords and numeric values.




## Code Review

- [x] 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-04-11 16:01:23 +04:00
Bogdan Chadkin 06b3f279ad Drop assets resolving from project-build (#1406)
This big chunk of legacy is no longer necessary.
We resolve style assets on client so css engine can accept db types now.
2023-04-10 23:14:10 +07:00
Bogdan Chadkin b13b073ffe Pass fs directory from builder (#1400)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1179
2023-04-10 23:13:32 +07:00
Ivan Starkov d243fbc2fb Fix error in dev mode (#1408)
## Description

Fixes Error in dev mode on every start or reload

```
react-dom.development.js:67 Warning: Prop `className` did not match. Server: "null" Client: "t-doScVt"
    at html
    at Root (http://localhost:3000/build/_shared/chunk-TNFZIIN2.js:36:22)
 ```

It works because of bug, now without bug it shows
https://github.com/webstudio-is/webstudio-builder/pull/1408

I would comment usetEffect for now



## Steps for reproduction

Run localy, see Error has gone

## 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-04-10 19:43:34 +04:00
Oleg Isonen 48b4980d12 Breakpoints redesign stage 2 (#1366)
## Description

- Canvas behavior should be exactly as in Webflow now - responsive
canvas.
- No constraints for resizing, you can switch to different breakpoints
when you change the canvas width just like in preview

## Not done in this PR

- [ ] breakpoints dropdown menu redesign
- [ ] on-canvas resizable handles
- [ ] flash-animate breakpoints list when breakpoint is switched through
resize
- [ ] flash-animate left and right borders when breakpoint is switched
- [ ] gravity of resize handle dragging when reaching next breakpoint
- [ ] vertical labels with @media example that matches current
breakpoint
- [ ] migrate min-width 0 breakpoints to base?
- [ ] hide outline while changing size
- [ ] ensure there is never both min and max in one media

## Todo

- [x] draggable positioning calc
- [x] shortcuts for zoom
- [x] sync width and selected breakpoint
- [x] remove scale
- [x] fix mobile-first breakpoints
- [x] tabbable toolbar items
- [x] icon for base
- [x] fix flicker
- [x] After breakpoint delete/add CascadeIndicator doesn't refresh
- [x] fix when there is no base, min-width 0 should have still a full
width

## Steps for reproduction

1. click button
3. expect xyz

## Code Review

- [ ] hi @TrySound, @istarkov  , 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-04-09 20:19:12 +02:00
Bogdan Chadkin 33fd087ece Transform image value to resolve url (#1405)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1179

Succeeded https://github.com/webstudio-is/webstudio-builder/pull/1403

Here added support for transformValue in css-engine StyleRule. So we can
apply any transformation when render css.

In sdk added image transformation which accepts assets and provides
image value with new url value.

Now we can get rid of resolving on server side and apply image loaders
for images rendered in styles.
2023-04-09 22:24:02 +07:00
Bogdan Chadkin 914fbfca97 Allow to map individual style values when stringify to css (#1404)
Related to https://github.com/webstudio-is/webstudio-builder/pull/1403

Here I removed app specific case from css-engine toValue by providing
transformValue function which is called on every individual style value
inside nested structure (like var or layers).

With this function we can resolve assets and remove complex resolving
logic from server.
2023-04-09 20:22:10 +07:00
Bogdan Chadkin ba9738d332 Store style states in db (#1384)
Ref https://github.com/webstudio-is/webstudio-builder/issues/807

- added indicator state has styles in style source menu
- added style state to schema
- save state styles changed from style panel

<img width="175" alt="Screenshot 2023-04-06 at 19 10 55"
src="https://user-images.githubusercontent.com/5635476/230375421-dabab617-4e15-4784-a27b-1ba92549f7ff.png">
2023-04-08 11:32:31 +07:00
Bogdan Chadkin 6c9df7c655 Setup s3 credentials with asset client (#1394)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1179

Moved s3 client initialization to asset client and passed it to upload
and delete.

We may also need to find a way to destroy s3 client.
2023-04-07 22:52:18 +07:00
Roman Pominov 083b138ebf Refactor "file" props control; Free up id attribute (#1393)
Ref. #1011 

## Description

1. Fixes #1382 
1. Changed `file-image` to `file` with an accept option
2. Added `file` control to the props-panel stories:
https://file-control--6382151c8b47d4399fb9fc69.chromatic.com/index.html?path=/story/builder-features-props-panel--story

## Steps for reproduction

1. No visible to user changes (unless you set `accept` to something like
`.png` in some prop meta)
2023-04-07 15:25:15 +03:00
Ivan Starkov b123f5a498 Update packages 0.53.0 (#1389)
## Description

- [x] - Update branch after #1388

## 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-04-07 15:51:18 +04:00
Bogdan Chadkin 304e82f979 Split s3 and fs logic from asset uploader into "clients" (#1386)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1179

Currently asset-uploader package consume all configuration from
environment. Though it prevents using any other environment.
Configuration better be passed from builder.

Here all s3 and fs related logic is splitted into fs client and s3
client which is configured and passed from builder.

For now splitted only delete and upload utilities.
2023-04-07 15:27:25 +07:00
Ivan Starkov eaecc6ac54 packages update 0.52.0 (#1387)
## Description

1. What is this PR about (link the issue and add a short description)

## 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-04-07 09:51:03 +04:00
Ivan Starkov a6fb118ca3 Preserve border sub sections state (#1383)
## Description

closes #1381

## Steps for reproduction

Expand border width or border radius at style panel, switch on other
instance, return see expanded state is preserved


## Code Review

- [ ] hi @TrySound , 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-04-07 09:36:22 +04:00
Mateusz Burzyński 678c9a273f Generate declaration files before publishing packages (#1351) 2023-04-07 07:14:18 +02:00
Roman Pominov 7297544198 Add phone and email links support in URL control (#1375)
Ref. #993 

## Description

1. Added phone and email options in the URL control

## Steps for reproduction

1. Open a Link's props
3. See new options in the "Href" control
2023-04-06 10:37:25 +03:00
Ivan Starkov 2328f37fd2 Fix Escape and Enter issues (#1374)
## Description

closes #1359

The only Esc event that needed to be passed into Canvas from the builder
is cancelCurrentDrag (don't know why)

- [x] - Todo reset/notshow outline on canvas Escape click too to have
visual response
- [x] - Fix Enter to work only in Navigator

## Steps for reproduction

See corresponding issue #1359 . 

## Code Review
- [x] hi @kof , I need you to do
  - test it on preview

- [x] hi @TrySound , I need you to do
  - detailed review (read every line)

## Before requesting a review

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

## Before merging

- [x] 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-04-05 23:38:07 +04:00
Bogdan Chadkin 3a16cb1821 Upgrade to remix 1.15 (#1373)
Ref https://github.com/remix-run/remix/releases/tag/remix%401.15.0 and
https://remix.run/docs/en/1.15.0/pages/v2

- bumped to remix 1.15
- switched to v2 meta
- replaced serverBuildTarget with fields from examples
- dropped unused remix-utils
2023-04-05 19:18:25 +07:00
Bogdan Chadkin 85473f8e57 Simplify assets uploading (#1372)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1335

- with persistent fetcher there is no need in assets provider
- replaced async FileReader api with sync URL.createObjectURL for
preview while uploading
2023-04-05 15:11:43 +07:00
Ivan Starkov 6fbc97b2f5 Reduce renders from 5 to 1 (#1371)
## Description

1. What is this PR about (link the issue and add a short description)

## 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-04-05 10:25:43 +04:00
Bogdan Chadkin 0095f47fbc Migrate to remix v2 route convention (#1367)
Ref
https://remix.run/docs/en/1.15.0/pages/v2#file-system-route-convention
and https://remix.run/docs/en/1.15.0/file-conventions/route-files-v2

New route convention enforces flat structure.
2023-04-05 01:54:17 +07:00
Bogdan Chadkin 417b39833e Delete assets with patches (#1368)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1335

Here moved assets store to immerhin. Patches manage only delete
operation by diffing previous and patched list of assets.
2023-04-05 01:32:14 +07:00
Ivan Starkov c037417cde Fix enter (#1369)
## Description

Currently when you click Enter inside the builder when focused on Rich
Text nothing happens.
Here I forward enter event into the Canvas and focus RT element before
Editing mode

ref #1359

## Steps for reproduction

Click RT node in Navigator, press Enter, edit text
<img width="820" alt="image"
src="https://user-images.githubusercontent.com/5077042/229862820-62bc3f50-1290-49e3-856e-1fab2fb50eae.png">



## Code Review

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

## Before requesting a review

- [x] 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-04-04 21:17:01 +04:00
Roman Pominov 8c27c75f93 Input Field (#954)
## Description

1. Added `InputField` aligned with Figma.
[Demo](https://input-field--638245578b47d4399fba191a.chromatic.com/?path=/story/library-input-field--demo).
Closes #614
2. Added `NestedSelectButton` that should be used as `InputField`'s
suffix.
[Demo](https://input-field--638245578b47d4399fba191a.chromatic.com/?path=/story/library-nested-select-button--demo)
3. Deprecated `TextField`
4. Used `InputField` instead of `TextField` in `CssValueInput`
5. Added support for `<input>` in `ArrowFocus`. Closes #1364

## Steps for reproduction

1. Open style panel
6. Test `CssValueInput`'s
2023-04-04 16:12:10 +03:00
Bogdan Chadkin 17fb9a7213 Migrate to remix v2 error boundary (#1363)
Ref
https://remix.run/docs/en/1.15.0/pages/v2#catchboundary-and-errorboundary

Since 1.15 remix will force to switch with warnings.
2023-04-04 17:53:59 +07:00
Bogdan Chadkin f0c8681a2d Replace mitt with nanoevents (#1365)
nanoevents doesn't have `*` we stopped using recently, have simpler api
with unsubscribe function and allows to avoid patch upcoming changes
https://github.com/webstudio-is/webstudio-builder/pull/1351.
2023-04-04 17:36:01 +07:00
Oleg Isonen ebbdb71ced Scroll area (#1360)
## Description

1. Add scroll area to the to ds
2. Add scroll area to add components panel

## Code Review

- [ ] hi @TrySound , 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-04-04 12:08:12 +02:00
Bogdan Chadkin 362cced071 Add assets store (#1361)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1335

Here I replaced assetContainersStore with assetsStore. Now deleting and
uploading states are maintained locally in assets provider. To preserve
the order of uploading assets assetsStore map has value as undefined.
This way assets.get(id) provides the same value. Though when iterating
we see missing asset.
2023-04-04 16:42:10 +07:00
Mateusz Burzyński d42d8dcc18 Locally-generated Prisma client (#1290) 2023-04-04 07:25:12 +02:00
Bogdan Chadkin a3beb9f810 Add style source states UI (#1349)
Ref https://github.com/webstudio-is/webstudio-builder/issues/807

Here added support for states in style source input under feature flag.
Styles editing and rendering still doesn't work. Here only UI.

<img width="326" alt="image"
src="https://user-images.githubusercontent.com/5635476/229406413-d7704dd7-2122-4747-888a-630aef08a902.png">
2023-04-04 00:22:38 +07:00
Bogdan Chadkin 58f3b3f3d5 Cleanup project package (#1358)
Here removed from project package everything not related to project
mannagement.

- project no longer depends on sdk
- style updates types moved to builder
- CanvasData no longer necessary, Data from react-sdk is same
2023-04-04 00:11:37 +07:00
Ivan Starkov d58c9aa73b Background list focus management (#1356)
## Description

closes #877

- [x] - Seems like Esc when layer window is open broken, probably this
PR (not this, just broken will create an issue)

added `focusManagerOptions` to ArrowFocus handleKeyDown
what allows us to create nested focus navigation.


## Steps for reproduction

Create a few background layers and use arrows to navigate.

## Code Review

- [ ] hi @rpominov , 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-04-03 17:14:51 +04:00
Bogdan Chadkin e7e52a941e Remove assets data reloading (#1355)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1335

We load initial assets in builder and can stop load it additionally from
rest api. And after all mutations client store can be updated directly.
2023-04-03 19:59:25 +07:00
Bogdan Chadkin 7e440df235 Move css generation from project to sdk (#1354)
Generation of css text relies on components and not related to project
management so better move to sdk.

Also need to fix in saas
(https://github.com/webstudio-is/webstudio-saas/issues/126)
2023-04-03 19:30:45 +07:00
Bogdan Chadkin b4d21aadff Run global prettier check (#1353)
Here add check to have formatting always applied in case git hook was
ignored or not run for some reason.

Cached prettier for whole project is run within 2-3 seconds.
2023-04-03 16:48:10 +07:00
Ivan Starkov 8c27c5c86b Show currentcolor value in picker (#1339)
## Description

closes #1304 

To not expose computed style or do hard currentColor recalculation. I
added currentColor: StyleValue to the styleInfo color property.

## Steps for reproduction

Set currentColor on border or background or color, see in color picker
it works

## Code Review

- [ ] hi @TrySound , 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-04-03 12:32:15 +04:00
Bogdan Chadkin c5c90f6644 Drop radix icons (#1350)
We have all icons in figma. Here replaced with alternatives or exported
from figma. See diff.
2023-04-03 10:13:46 +07:00