36 Commits
Author SHA1 Message Date
Ivan Starkov 596aa50b9f Update version 0.78.0 (#1899)
## 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-07-04 22:32:14 +03:00
Ivan Starkov 5909fe5ba9 Upate version (#1896)
## Description

npm libs update

## 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-07-03 23:51:36 +03:00
Oleg IsonenandBogdan Chadkin 8f53eadf5b Override browser default tag based styles that use EM units (#1888)
## Description

EM seems to be challenging to use and people tend to use PX or REM
instead ... I changed those values that come with EM by default from
browsers to the values Webflow is using.


I am not sure why webflow is doing certain things: e.g. paragraphs have
marginTop 0, h1-3 have marginTop 20; marginBottom: 10, h4- have
marginTop 10 ; marginBottom 20

These seem to be inconsistent and weird choices.

---------

Co-authored-by: Bogdan Chadkin <trysound@yandex.ru>
2023-07-03 23:13:37 +03:00
Ivan Starkov 4f7ad34cbf Release 0.76.0 (#1890)
## 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-07-02 22:39:35 +03:00
Bogdan Chadkin 47ac7080da Migrate form to data sources (#1855)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1529

Instead of SuccessMessage and ErrorMessage components we can use Box
with bound state from form.

For now this is only boolean state which should be set on Form component
side. Soon we explore using expression as data sources to change only
enum value instead of booleans.

Changes in template
- ErrorMessage and SuccessMessage are replaced with Box with "show"
bound to expression
- ErrorMessage and SuccessMessage have text in own children
- the rest of Form content is wrapped with Box bound to expression
- Form got state prop bound to variable
- Form initialState prop is deleted

Migration just bind show props of all from direct children to data
sources. Without additional wrapping.
2023-07-02 22:17:23 +03:00
Oleg Isonen 66af42157f Sort properties alphabetically (#1886)
## Description

As recently reported, its easier to scan properties when they are sorted

## Steps for reproduction

1. open properties pane.
2. combobox showing properties list now will have them sorted
alphabetically

## 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-07-01 23:32:43 +02:00
Bogdan Chadkin d6aca6b55b Ignore complex props (#1810)
Ref https://github.com/webstudio-is/webstudio/discussions/37

There are props like object and function we cannot express with UI. Even
more there is style prop which if casted to string gives runtime error.
So the best way would be to ignore such types.
2023-07-01 23:49:02 +03:00
Oleg Isonen 42748f27b9 Move body font size and line height to normalize and also fix the values (#1867)
Closes https://github.com/webstudio-is/webstudio-builder/issues/1845

## Description

See issue

## 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-06-29 21:20:21 +02:00
Ivan StarkovandOleg Isonen 7632b05fe7 Fix hash scroll (#1861)
## Description

closes #1824

- [x] single edgecase left if id is equal to `hello%20world` nothing
works
- [x] fix back button cause chrome bug
https://discord.com/channels/955905230107738152/1122839004375691355
- [x] allow edit form in preview mode to close issue above

Fix corresponding issue in RR
https://github.com/remix-run/react-router/pull/10642

At SaaS patched too

## Steps for reproduction

create links on pages with anchor
<img width="254" alt="image"
src="https://github.com/webstudio-is/webstudio-builder/assets/5077042/46a880f3-cdd0-4e19-8cb4-b608bdc4f96a">

Check it works

## 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: Oleg Isonen <oleg008@gmail.com>
2023-06-28 10:06:54 +04:00
Bogdan Chadkin e66e118ad5 Migrate to storybook 7 (#1862)
See https://storybook.js.org/docs/react/migration-guide and
https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#from-version-65x-to-700

- all configs are now ts/esm
- had to add hack (process.env.NODE_ENV) to workaround storybook bug
- webpack is gone
- renamed storybook:run to storybook:dev
- amount of packages reduced from 2456 to 2060
2023-06-27 10:02:58 +03:00
Bogdan Chadkin c5f84b7822 Run eslint from the root with cache (#1854)
While turborepo does not work for us we can try to solve long checks
time with builtin caching. Eslint provides similar one to prettier we
already use.

```
pnpm -r lint
51.53s

pnpm eslint . --ext .ts,.tsx --max-warnings 0
18.10s

pnpm eslint . --ext .ts,.tsx --max-warnings 0 --cache (with cache)
1.82s
```

In this PR I removed all lint scripts in packages and added global one
in the to github workflow. It saves like 30s on my laptop because pnpm.
Already stored cache makes linting almost instant.

Also bumped all eslint dependencies.
2023-06-26 10:08:15 +03:00
Ivan Starkov 5bae55124c Fix url hash (#1838)
## Description

closes #1828 

## Steps for reproduction

Create links to the page with section with spaces, see its escaped
properly

## 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-06-23 21:32:00 +03:00
Bogdan Chadkin 36b98ef3f6 Add "show" system prop for conditional rendering (#1724)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1529

Here added system "show" prop which already works to not render
component but has lack of dynamic behavior based on some state.
2023-06-19 21:01:50 +03:00
Ivan Starkov e31ed7908a Fix ssr error (#1820)
## Description

Init order of modules on client and server can be different. We can't
rely on `counter++`
As the only reason of counter was to prevent same name in different
modules, here I just added runtme check

removed ts type magic, as not used and opaque types are better to create
other way

## 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-06-19 20:31:19 +03:00
Bogdan Chadkin 1be61e59bb Compute currentColor (#1815)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1536

Here replaced browser getComputedStyle for currentColor with computing
from data.

`color: inherit` is now considered same as `color: currentColor` and
displayed properly in UI.

Changed initial value for color from inherit to black (in mdn-data it's
canvastext).
2023-06-19 16:27:27 +03:00
Ivan Starkov 611f12b8ea Release 0.75.0 (#1774)
## 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-06-16 01:36:55 +04:00
Bogdan Chadkin f06b35e35d Move types above import/require conditions (#1801)
Ref
https://github.com/webstudio-is/webstudio-builder/pull/1708#discussion_r1229878400
2023-06-15 10:46:42 +03:00
Bogdan Chadkin f15339e002 Check types outside of src folder (#1789)
We generate dts type for each package on publish.
It requires us to include only "src" to output same structure as in src
folder. Though we have configs and cli scripts outside of it which
should be typechecked, they cannot be ignored.

Ideally would be to have one-line commands in package.json. Though
typescript always has problems with build step. In this case the CLI
have everything to configure this except "include" and "exclude" flags.

So here to workaround that I added tsconfig.dts.json to distinct dts
generation and typechecking.

Blocker for https://github.com/webstudio-is/webstudio-builder/pull/1634
2023-06-14 23:37:24 +03:00
Ivan Starkov 0750cd03f5 Fix body layout (#1784)
## Description

closes #1781
Also makes body/html layout more modern fixing additional bugs
More details
https://twitter.com/ChallengesCss/status/1471128244720181258

## 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-06-14 18:32:49 +04:00
Oleg Isonen 48c45cca5b Add first component description for slot (#1772)
Components like Slot need explanation, so I added a new field -
description.
2023-06-13 12:25:12 +03:00
Ivan Starkov 380e6e9da7 Release 0.74.0 (#1771)
## 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-06-13 07:46:11 +03:00
Ivan Starkov afcc738961 Release 0.73.0 (#1762)
## Description

update npm

## 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-06-13 00:45:37 +04:00
Oleg Isonen a8572e7917 Experimental universal input (#1732)
## Description

New Text control for props is using a new UniversalInput component which
allows us to dynamically decide if we need a single-line input or a
multi-line textarea.

Problem it is solving is that we don't know from data type string if
user needs a textarea or an input, so we render a universal input.

We can still set rows to a number in the meta, so that a certain field
is always multiline initially, by default:
- empty field will be single-line input
- multi-line text will automatically turn into multi-line input

Single-line mode:
- enter saves
- shift + enter - adds newline and saves

Multiline-mode:
- enter saves and ads newline
- cmd+enter - saves, no newline


## Steps for reproduction

1. add any component
2. open properties panel and playwith any text input

## 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-06-12 20:00:44 +02:00
Bogdan Chadkin e13f3d203d Fix paragraph template wording (#1754)
Ref
https://discord.com/channels/955905230107738152/955907841070346300/1114249116566962227

## Code Review

- [ ] hi @kof, 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-06-12 16:14:33 +02:00
Bogdan Chadkin 1263a9ab08 Provide params with context (#1743)
Ref https://github.com/webstudio-is/webstudio-builder/issues/213

Before we set params globally which works yet only because they do not
change often. Here explicitly passed all params with context or by
passing them where necessary.
2023-06-12 16:51:27 +03:00
Bogdan Chadkin 6fa95e2964 Drop radio button field and checkbox field (#1745)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1552

These two components were added before we had meta.template and dropping
into rich text labels support.

Now we can use composition and remove redundant components.
2023-06-11 19:07:18 +03:00
Bogdan Chadkin 21f8d1aab2 Merge text and block components (#1742)
Ref https://github.com/webstudio-is/webstudio-builder/pull/1703
https://github.com/webstudio-is/webstudio-builder/issues/1677

- renamed TextBlock to Text in db and meta
- replaced LinkBlock with Link in db and meta
- renamed Styled Text label to Text
2023-06-11 14:58:34 +03:00
Bogdan Chadkin 891a96e0c9 Fix editing text inside button (#1739)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1719

Buttons has issue with unavoidable space which prevents entering spaces.
Here bind lexical to temporary span inside of button. Now space works
fine.
2023-06-11 12:11:33 +03:00
Bogdan Chadkin dcae1b5a9d Allow inserting into editable containers (#1735)
Here I removed "rich-text" type from components. Instead "container" can
be edited when has only text or rich text children.

And any time user can drop into editablle container which will wrap all
text and rich text children into "Span" component.

Had to implement position adjustment to consider text children which do
not have representation in navigator tree and canvas dnd.

Span has temporary SpanContainer name to not conflict with existinig
Span for styled text in rich text. Will rename in other PR when remove
no longer necessary components.
2023-06-10 00:55:46 +03:00
Oleg Isonen 7bef21719f Fix object fit, ignore loader (#1737)
## Description

- I used object position instead of object fit by mistake
- Unrelated: ignore loader prop

## Steps for reproduction

1. add vimeo
2. select preview image
3. see it has object fit cover

## 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-06-09 16:59:52 +02:00
Ivan Starkov e1b0c7808e Update typescript (#1734)
## Description

Removes errors with vscode and tsconfig

## 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-06-09 11:03:23 +03:00
Ivan Starkov 9a446787d1 Release 0.72.0 (#1733)
## 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-06-09 00:59:53 +04:00
Oleg Isonen b71dc75184 Vimeo (#1702)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1688

## Description

Vimeo Component

## Steps for reproduction

1. Add vimeo
2. play with props

## 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-06-08 02:07:58 +02:00
Bogdan Chadkin d92b628d23 Split props for base and remix links (#1711)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1120

Here refactored links components to generate separate props for base and
remix variants.
Removed prefetch from base links.

Added following props to remix links

- reloadDocument: boolean
- replace: boolean
- preventScrollReset: boolean

Now all components consistently have meta and props
2023-06-07 10:57:53 +03:00
Ivan Starkov 52472a8adb Release 0.71.0 (#1710)
## Description

Npm update 

## 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-06-03 15:50:31 +04:00
Bogdan Chadkin b7081f3741 Add sdk-components-react package (#1693)
Ref https://github.com/webstudio-is/webstudio-builder/issues/1129

Splitted base components into separate package. Exposed 3 entry points

- @webstudio-is/sdk-components-react
- @webstudio-is/sdk-components-react/metas
- @webstudio-is/sdk-components-react/props
2023-06-03 09:58:04 +03:00