Here replaced esbuild with vite for building sdk-components packages.
Vite can be configured to output preserved structure instead of bundling
everything into single module which hurts treeshaking a lot.
sdk-components-react
./fixtures/ssg/dist/client: 284kB (-24kB)
./fixtures/webstudio-remix-netlify-functions/build/client: 368kB (-28kB)
./fixtures/webstudio-remix-vercel/build/client: 1004kB (-8kB)
sdk-components-react-radix
./fixtures/ssg/dist/client: 284kB (-4kB)
./fixtures/webstudio-remix-netlify-functions/build/client: 372kB (0kB)
./fixtures/webstudio-remix-vercel/build/client: 900kB (-108kB)
## Description
- Double click now sets cursor to the click position
- Up/Down arrows on a first/last line trying to preserve cursor x
position (visible in case of block above block)
- Right/Left arrows switch blocks if cursor is at block begin/end.
## 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
## 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
Ref https://github.com/webstudio-is/webstudio/issues/3399
What to test
- hover
- select
- hiding (with show button) item should be transparent
- slot should be purple
- hide slot fragment
- render collections
- enter should trigger edit instance text
- support editing instance label with cmd+e
- should prevent dragging rich text child
- should prevent dragging non detachable instances (accordion header)
- should support reparenting after the last child
## 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
## Description
- always use defaultValue and defaultChecked props when passing to react
- expose value and checked as props, remove default*
- reorder initial props to make more sense (name, value, checked - in
this order)
Affected components:
Forms:
- checkbox
- radio
- input
- select
- textarea
Radix:
- checkbox
- radio group
- select
- switch
## Steps for reproduction
1. test each component named above how bound and unbound value/checked
works
2. use in regular form and bind to url params
3. use in webhook form
## Code Review
- [ ] hi @john, I need you to do
- 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
---------
Co-authored-by: Ivan Starkov <istarkov@gmail.com>
Co-authored-by: Bogdan Chadkin <opensource@trysound.io>
## Description
Last PR broke the generator because if there are multiple types exported
it starts getting a different namespace
## 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
## Description
Date can be in various forms, lets support them all:
1698377386 - A valid 10-digit Unix timestamp (October 26, 2023).
2147483647 - The maximum 32-bit signed integer timestamp (January 19,
2038).
1698377386000 - A valid 13-digit Unix timestamp (October 26, 2023).
9999999999999 - A far future date (November 20, 2286).
2024.10
## 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
---------
Co-authored-by: johnsicili <john@createtoday.io>
Our parser is good enough to represent any styles with css. Here
converted normalize styles into css and moved into sdk package.
Also fixed (remix) form component name
## Description
- keyboard accessibility (arrow keys)
- fix escape when search is not empty for components, fonts and images
- add "a" shortcut same as wf
## 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
Here added RemixForm alias to native form in base sdk components. It
should allow users to write at least native forms. Naming was not chosen
well though.
## Description
Log was only needed temporarily
## 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
Here split everything imported from react-sdk by published sites into
separate entry point react-sdk/runtime.
The result in ssg fixture is the following
```diff
- 429788 chunk-CuG10VAj.js
+ 370366 chunk-D4NWbWis.js
```
## Description
closes#3724
## Steps for reproduction
https://embed.staging.webstudio.is/builder/f3843f61-c4dd-4fc6-9463-bb88e8cc5f9b
2 "Client Only" Embeds
```html
<!--Embed 1 -->
<script type="module">
import _ from 'https://cdn.jsdelivr.net/npm/lodash-es/lodash.js';
console.log(_.join(['Hello', 'World', '1'], ' '));
document.addEventListener('DOMContentLoaded', (event) => {
console.log('DOM fully loaded 1');
});
</script>
<!--Embed 2 -->
<script type="module">
console.log('Hello 2');
document.addEventListener('DOMContentLoaded', (event) => {
console.log('DOM fully loaded 2');
});
</script>
```
Before this PR gave output with following errors:
- Broken order
- Broken `DOMContentLoaded`
```log
Hello 2
Hello World 1
```
Now no issues
```log
Hello World 1
Hello 2
DOM fully loaded 1
DOM fully loaded 2
```
## 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
Here improved our checks. No longet rely on "checks" script but run
"test" and "typescript" scripts from each package in monorepo.
Would also make each package less boilerplaty.
## 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
## Description
1. allow styles on html embed, still display contents by default
2. allow clicking away toasts immediately
## Steps for reproduction
1. click button
3. 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
## Description
rename of #3609
## New
- Native Select
## Changes
- Improved detection algorithm to include invisible elements (like
`option` or `display:none`).
- Added interceptor to handle pointer down events, preventing select
from opening.
- Enhanced element selection on canvas to support `display:none` and
option selection.
- Fixed prop types generation (previously, the value property was
broken).
- Memory props has effect on canvas only
- Recreate component on Canvas in case of defaultValue has changed
## Steps for reproduction
Add `Select` see 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
## Description
<img width="360" alt="image"
src="https://github.com/webstudio-is/webstudio/assets/5077042/f225882f-7954-4382-a6ac-51d42f24d1c4">
## 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
## Description
Reload scripts in HTML Embed on dynamic pages
Closes#3581
## Steps for reproduction
Open
https://scripts-reload-saas-2-pgmkm.wstd.work/test/1
dynamic link clicks should cause `console.log` from IFrame
Anchor link should not.
## 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
## Description
- Adds the ability to place images on the canvas immediately during
upload, using the file blob or a provided URL.
- Enables images to use width and height from asset metadata.
- Detects duplicate assets and displays a warning message.
<img width="323" alt="image"
src="https://github.com/webstudio-is/webstudio/assets/5077042/fe810dd8-3e3d-4cab-8669-b0d739044f49">
These changes allow images to appear on the canvas upon pasting, even if
the asset is not fully uploaded yet.
## Steps for reproduction
Start uploading few files on a slow connection, select them before
upload, see image on canvas is changed
## 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/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
Monorepo setup for storybook is very complicated, it has two major
problems
- it is very annoying to look for any link in commit status
- hard to upgrade comparing with single project setup
Here merged all storybooks into one in the root.
Closes https://github.com/webstudio-is/webstudio/issues/3149
## Description
As a user when I have Heading, Text or similar instances selected which
have a single text node instance, I expect an added component to insert
AFTER such instances.
## Steps for reproduction
1. add heading
2. select heading instance
3. 1-click box
4. see box was added after the heading
5. repeat the same with paste
6. repeat the same with any instance that has only text inside
## Code Review
- [ ] hi @TrySound , I need you to do
- conceptual review (architecture, feature-correctness)
- detailed review (read every line)
- [ ] hi @johnsicili , I need you to do
- 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/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
## Description
Part of https://github.com/webstudio-is/webstudio/issues/3149 this
allows us to understand if an instance has text child.
With this knowledge we can place instances into components that don't
have text children and after them if they do.
## Steps for reproduction
1. insert text or paragraph
2. see there is expected placeholder text which is editable
3. select it, tell AI to change color or something
4. see it works and see in payload it didn't send placeholder text
5. try text editing on empty body - shouldn't allow it
## 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/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
Bogdan Chadkin