322 Commits
Author SHA1 Message Date
Ivan Starkov be4fcc3ce2 Update npm versions (#1216)
## 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-03-09 23:49:18 +04:00
Bogdan Chadkin d6811f8dbd Drop storybook testing (#1212)
All these packages are not compatible with vite builder and we use them
only to test 2 inputs. Much easier to remove them now and add when
storybook fix issues.

```diff
du -ck node_modules
-818692
+775208
```
2023-03-09 21:56:50 +03:00
Oleg Isonen e6c5217e7a Reverting the decision to make nicer looking link targets (#1211)
User should know the underlying platform

this has also resulted in the need to have target wrapped in all links
components

<img width="265" alt="Screenshot 2023-03-09 at 14 19 50"
src="https://user-images.githubusercontent.com/52824/224035667-b0cc296c-3ed0-4c4c-b86b-205aa4a8adba.png">


## Steps for reproduction

1. create link
2. select target prop

## 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-03-09 19:54:09 +01:00
Oleg Isonen fd7d34d312 Allow button children and inner text over properties (#1203)
Fixes https://github.com/webstudio-is/webstudio-builder/issues/1198

## Description

- Button has a standard behavior with space key pressed that can't be
turned off, so we can't type a space
- Even if we work around the space behavior somehow, we still don't have
an ability for rich-text to accept any instance and that makes a use
case for icon button and button with icon on left/right impossible

The solution I went for is to make it container for accepting child
instances and edit text using InnerText property. This may be not as
intuitive as direct rich-text but its more capable.

Webflow does the same thing for a form button, though it uses an input
element.

<img width="1082" alt="Screenshot 2023-03-09 at 03 10 05"
src="https://user-images.githubusercontent.com/52824/223898596-a4aae718-32d6-4090-a6f9-3d883b587ef7.png">



## Steps for reproduction

1. add button
1. change inner text
1. add image or text components

## Code Review

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

## 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-03-09 11:37:25 +01:00
Ivan Starkov 22a2f11e0d Update versions (#1205)
## 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-03-09 09:36:55 +04:00
Ivan Starkov 1abd12a069 ts satisfies keyword support for storybook (#1197)
## Description

Storybook don't understand ts satisfies. Until we move onto new
storybook this adds that support

## 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-03-08 20:11:39 +04:00
Ivan StarkovandOleg Isonen bac386467c Background section redesign part 1.1 (#1149)
## Description

ref #877
As in this comment part 1
https://github.com/webstudio-is/webstudio-builder/issues/877#issuecomment-1441897685

<img width="647" alt="image"
src="https://user-images.githubusercontent.com/5077042/223226959-3e9b1832-07aa-425b-afcf-27f7cdafa85c.png">

You can add/remove layers. View/Hide not working. No drag.

## Steps for reproduction

Create new project. (existing could not work well because of migration)
Create background layers. Add images. Set various background layers
params.

## 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

- [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
- [x] 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: Oleg Isonen <oleg008@gmail.com>
2023-03-08 19:29:53 +04:00
Ivan Starkov ce502f50fb Update version (#1190)
## Description

Update npm versions

## 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-03-07 22:13:01 +04:00
Oleg Isonen 3d18d71bb3 Link block sdk component (#1174)
Closes #1173 

## Description

- link block component that allows adding child instances
- also replaced box icon

## Steps for reproduction

1. add link block
2. insert image component and text component
3. select it
4. add regular link, see if it still works correctly
5. add text-editable link, see if it still works correctly

## 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-03-07 15:08:42 +01:00
Ivan Starkov 1e7f70cf95 Right types for the RootInstance (#1178)
## Description

RootInstance dont need all the data we pass

## 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-03-06 11:52:24 +04:00
Ivan Starkov 50c1cadbdb Update vers (#1176)
## 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-03-05 12:21:23 +04:00
Andras Bacsai 9db961a158 Release 0.43.0 (#1170)
## 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-03-03 10:58:00 +01:00
Oleg Isonen d5db7a38b4 Markdown bugs (#1168)
## Description

1. Don't handle global paste even when inside content-editable (before
that when you paste inside texteditable, it would insert an instance
additionally outside)
2. Insert links in paragraphs as RichTextLink
3. Make sure rich text link has the same props as link



## 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-03-03 10:41:43 +01:00
Andras Bacsai 9fb3c54258 Release 0.42.0 (#1165)
## 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-03-02 11:05:44 +01:00
Andras Bacsai 2e9f5fb5f7 Release new versions (#1156)
## 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-03-01 14:40:38 +01:00
Bogdan Chadkin 7e80f18163 Drop tree table (#1147)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1116

We moved all data to build and tree table no longer necessary.

- fixed writing instances on page creation (broke in my previous PRs)
- pages are no longer cloned on build cloning and preserve their ids
between builds
2023-03-01 12:13:33 +03:00
Bogdan Chadkin 5d5172f846 Move instances to build (#1144)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1116

We want to have freedom in manipulation and reusability of tree parts so
gonna merge tree data of all pages into build.

Here migrated instances. Tree no longer have any data. Will cleanup in
the next PR.
2023-02-28 21:58:50 +03:00
Bogdan Chadkin df4c2e0384 Add root instance id to page schema (#1142)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1116

Before we assumed the first instance in the list of instances is the
root. Though we are gonna introduce slots and for this have to combine
instances of all pages into single array. So there can be many roots in
one list.

So now we gonna specify root instance id on page. treeId will be removed
once instances are migrated to Build table.
2023-02-28 19:41:20 +03:00
Bogdan Chadkin 3239ae8587 Move props to build (#1136)
We want to have freedom in manipulation and reusability of tree parts so
gonna merge tree data of all pages into build.

Here migrated props. Left one todo to cleanup tree data of deleted
pages. Though easier to solve this when pages management is moved to
client.

May require to change code in sass.
2023-02-28 00:50:28 +03:00
Andras Bacsai bb3344c3a0 Bump versions (#1127)
## 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-02-25 10:46:22 +01:00
Oleg Isonen afa83c8d55 Add target and prefetch to a link (#1117)
## Description

Adding target and prefetch to initial properties of a Link component
along with the defaults

## Steps for reproduction

1. add a link
2. try target prop
3. try prefetch options

## 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-02-24 10:17:40 +01:00
Ivan StarkovandBogdan Chadkin 069f137253 Update npm packages to version 0.36 (#1114)
## 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

---------

Co-authored-by: Bogdan Chadkin <trysound@yandex.ru>
2023-02-23 17:46:48 +03:00
Bogdan Chadkin 83a44d9077 Patch normalized instances (#1112)
Ref https://github.com/webstudio-is/webstudio-designer/issues/696
https://github.com/webstudio-is/webstudio-builder/issues/924

Moved temporary denormalization from server to client. Denormalized tree
patches are converted to normalized patches. Now we can enable
collaboration and get minimal conflicts to resolve.
2023-02-23 16:42:42 +03:00
Oleg Isonen 4ace99eebd WrapperComponent > WebstudioComponent (#1109)
## Description

Renaming WrapperComponent > WebstudioComponent


## Code Review

- [ ] hi @TrySound , I need you to do
  - conceptual review (architecture, feature-correctness)
  - 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-02-23 11:36:09 +01:00
Roman Pominov aac93f3702 Props panel refactoring (#1048)
## Description

Closes #1013

1. Refactored `PropMeta` shape to be flat again instead of trying to be
the same as Storybook's `ArgType`
2. Changed `*.props.json` to `*.props.ts`. Fixes #1051
3. Prepared controls files structure, now just need to work on their UI
4. Refactored `usePropsLogic/PropsPanel` to the new logic where we
choose the prop before adding and then never change the name
5. A lot of cleanup / small fixes / better TS types

This PR basically completes architecture/logic and now only the work on
the controls UI is left. Although complicated controls like URL may
still require some work on the logic.

## Steps for reproduction

1. Open props panel
2. Interact with the props
2023-02-22 20:20:29 +03:00
Ivan Starkov e799dcb28e To reduce size of published apps pass getComponent to InstanceRoot, add size limit (#1098)
## Description

Now published apps during build can pregenerate imports of used
components

https://github.com/webstudio-is/webstudio-builder/blob/89688ee837b45f0877ebe32d3aefb1869a97c0a1/packages/sdk-size-test/app/page-components/page-main.ts#L1-L3

And pas getComponent to InstanceRoot
https://github.com/webstudio-is/webstudio-builder/blob/89688ee837b45f0877ebe32d3aefb1869a97c0a1/packages/sdk-size-test/app/routes/$.tsx#L23

Also size-limit is added
https://github.com/webstudio-is/webstudio-builder/blob/89688ee837b45f0877ebe32d3aefb1869a97c0a1/packages/sdk-size-test/package.json#L10-L19


## Steps for reproduction

### What I did

Create sample remix app with sdk
Build: 256K

Increase size of sup component
Build now 564K

After changes build now 256kB

## 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-02-22 18:31:48 +03:00
Oleg Isonen e4785959c0 Code component (#1102)
## Description

Introduces Code component, no syntax highlighting just block and inline
code

## Steps for reproduction

1. add code component, try toggle inline prop
2. try from markdown

block

```js
alert(123)
alert(123)
alert(123)
```

inline
```
test  test `alert(123)` test 
```

## 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-02-22 14:24:45 +01:00
Oleg Isonen fe82cd441e Separator component (#1099)
## Description


## Steps for reproduction

1. Add separator 
2. Paste `---` for markdown

## 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-02-22 13:11:35 +01:00
Oleg Isonen 76e47bcba5 Blockquote, List, List Item components (#1096)
## Description

This is adding a blockquote, preset styles taken from webflow

## Steps for reproduction

1. add a blockquote from add component
2. paste a blockquote as a markdown `> something`
3. add List
4. add List Item into List
5. paste list from markdown: 

```
- one item
- another item
```
```
1. one item
1. another item
```
```
1. one item
2. another item
```



## 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-02-21 17:44:59 +01:00
Ivan Starkov 1076d6efd0 Fix color input does not accept CSS color names (#1089)
## Description

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

Found few bugs.

- [x] - White color have border
- [x] - Fix transparent - all is parsed well its `react-color` feature
<img width="237" alt="image"
src="https://user-images.githubusercontent.com/5077042/220187124-fe8ddc9a-1cc0-4ad3-9979-4037e4a69b5a.png">

- [x] - Synchronize picker color and color shown in input



closes #1081

`+` Added transparent color (need be in design, looks better for most
inputs if anything is shown)

<img width="212" alt="image"
src="https://user-images.githubusercontent.com/5077042/220186642-8cc0bcad-ab35-4444-b773-da652cafb734.png">

<img width="217" alt="image"
src="https://user-images.githubusercontent.com/5077042/220186773-071e6176-066a-4d37-807d-cd6a2db70642.png">


Accessibility is not done fully for the color picker
https://github.com/webstudio-is/webstudio-builder/issues/1092


## Steps for reproduction

1. You are now able to select colors by name
<img width="243" alt="image"
src="https://user-images.githubusercontent.com/5077042/220174790-7e33219d-e955-4718-bad1-0c1ac79ebaf3.png">

2. Colors with non-1 alpha will be shown on chessboard

<img width="225" alt="image"
src="https://user-images.githubusercontent.com/5077042/220174949-2c0c4a45-d330-4a3c-a769-f30bd33b2154.png">


## Code Review

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

- [ ] hi @TrySound 
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)


## Before requesting a review

- [x] made a self-review
- [ ] 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
- [x] added tests
- [ ] if any new env variables are added, added them to `.env.example`
and the `builder/env-check.js` if mandatory
2023-02-21 02:48:49 +04:00
Ivan Starkov d396142f2a Update npm packages (#1073)
## 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-02-18 12:34:33 +03:00
Oleg Isonen 29f3839456 Make css helper tool for collapsing prevention on canvas really smart (#1059)
Closes https://github.com/webstudio-is/webstudio-builder/issues/604

## Description

-  User can now override helper definitions on canvas
- only boxes that would collapse without helper -  receive helper
- helper is removed when any CSS property is changed on that instance
that would prevent collapsing, so that helper can be removed
- Helper doesn't show on the preview or publish
- Helper goes away if an instance inserted as a child
- There is no need to set padding-right or padding-bottom if you just
need a small div with a defined or layout-based size, as soon as div is
not collapsing, helper is not applied

More: padding will be only added on the side that would collapse
otherwise.
For example when I add a div, it is a block element, it grows
automatically full width but has 0 height, in this case spacing heloper
with padidng-top: 50px will apply, so that it doesn't collapse.
If user sets height: 100px or does anything that would give it a height
- we remove the helper padding right away, so user can actually see the
height they set

In other words we prevent elements from collapsing when they have 0
height or width by making them non-zero on canvas, but then we remove
those padding universally without shortlists as soon as element doesn't
collapse.

## Steps for reproduction

1. add a box
2. set padding-top
3. see it applies on canvas

1. add a box
2. set width
3. see the exact width on canvas, no helper padding


1. add a box
2. set height
3. see the exact height on canvas, no helper padding

## Code Review

- [ ] hi @TrySound , I need you to do
  - conceptual review (architecture, feature-correctness)
  - 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-02-17 20:46:12 +01:00
Bogdan Chadkin 0ab3c60659 Simplify text editor store updates (#1054)
Before we had to preserve instance data to not break styles. Now styles
are decoupled and editor can interop whole instances type.

So we no longer need updates with instance-like shape. Text editor can
output instances directly preserving only ids.

As a result got rid from children updates in both react-sdk and project
packages.
2023-02-17 21:10:35 +03:00
Bogdan Chadkin f6150c98da Move build db utils to project-build package (#1050)
We are moving all build related utils into separate package. Here moved
breakpoints, styles, style sources and build utils.
2023-02-16 21:30:50 +03:00
Ivan Starkov 7f624d189e Update npm versions (#1053)
## 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-02-16 18:52:15 +03:00
Ivan Starkov fe2a2a1bd8 Exclude zod parse and exports from read-sdk (#1052)
## Description

Partial fix for #1051
The full fix must include validating during props generation. Probably
we could generate ts files with all
typeinfo inside.
cc @rpominov 

Also I excluded Zod exports, only types
https://github.com/webstudio-is/webstudio-builder/pull/1052/files#diff-5659b16effbbb5a7214ce728cf281efa2f2cac4332d31685b78ecb1b27ab0502


## 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-02-16 19:17:39 +04:00
Ivan Starkov 0bcee28c59 Add lib to files section of package.json of generate-arg-types (#1049)
## 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-02-16 16:24:07 +03:00
Ivan Starkov 09e1f3c46e Move generate-arg-types as dependency link of sdk (#1047)
## 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-02-16 16:52:14 +04:00
Ivan Starkov 76c3c68054 Make @webstudio-is/generate-arg-types public, update versions (#1046)
## 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-02-16 15:20:57 +03:00
Ivan Starkov 89a95c468b Update NPM versions (#1045)
## 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-02-16 14:57:27 +03:00
Ivan Starkov d76c598090 Switch on link and generate css for all pages on server (#1041)
## Description

We are going to render CSS for all pages in production mode.
That allows us to switch on native remix links i.e. `export const links`

Also now for `published` pages we use same data as SaaS will. 
That would allow for investigating SaaS issues faster.

[x] - Also now check does ssr css is needed at all at "edit" mode.
_Checked, as of now we don't render `style` tags serverside and that
cause FOUC in designer on page switch,
cc @TrySound probably in Canvas we can render styles serverside too that
would allow us to not use /s/css path for canvas inside designer_


closes #929
closes https://github.com/webstudio-is/webstudio-saas/issues/51
closes #606

## Steps for reproduction

In local dev mode, create 2 pages in a project, and add cross-links on
both pages.
Do publish.
Go to the published page, see no fouc on link clicks.




## Code Review
- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)

- [ ] hi @TrySound , I need you to do
  - 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-02-16 14:24:04 +03:00
Roman Pominov 343647d52a Props panel: Basics (#1031)
#992

1. Cleaned up control types
2. Control type is now chosen by component meta (including Image.src)
3. Added custom labels support
4. Some other changes mentioned in comments in diff
2023-02-16 11:18:43 +03:00
Bogdan Chadkin 0c506ed79e Move breakpoints schema to project-build (#1027)
Breakpoints are not really related to css data and represent project
build data so moving it before switching to map patches.
2023-02-14 16:37:33 +03:00
Andras Bacsai ac413cdd5f rename designer to builder 2023-02-14 11:15:24 +01:00
Ivan Starkov 2f1ba03544 Update typescript (#1025)
## 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-designer/blob/main/apps/designer/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env.example`
and the `designer/env-check.js` if mandatory
2023-02-13 23:19:11 +03:00
Ivan Starkov 4848f43a07 Update NPM packages (#1022)
## 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-designer/blob/main/apps/designer/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env.example`
and the `designer/env-check.js` if mandatory
2023-02-13 17:06:16 +03:00
Roman Pominov 2e43ba1b39 Don't crash on href=// (#1017)
Fixes #997
2023-02-13 16:02:22 +03:00
Ivan Starkov 034156e628 Update npm versions (#1018)
## 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-designer/blob/main/apps/designer/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env.example`
and the `designer/env-check.js` if mandatory
2023-02-13 15:45:08 +03:00
Bogdan Chadkin 10ea732ee2 Resolve props assets on client (#1005)
Before we checked looked for all asset ids in props, loaded assets and
replaced ids with resolved assets. This is all on server. We faced a few
problems with it.

- requires to maintain two versions of types: stored in db and resolved
for client
- easy to break project by writing to db wrong version

Here I provide to sdk both props and assets and resolve on client with
almost same amount of code.

Also replaced store setter with context, see
https://github.com/webstudio-is/webstudio-designer/issues/213
2023-02-13 12:42:02 +03:00
Ivan Starkov 13afe43cc5 Update ussets and project (#985)
## 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-designer/blob/main/apps/designer/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env.example`
and the `designer/env-check.js` if mandatory
2023-02-10 13:39:35 +03:00