colorjs uses internal short names (p3, a98rgb, prophoto) that don't
match the CSS predefined color space identifiers required by the spec:
- p3 → display-p3
- a98rgb → a98-rgb
- prophoto → prophoto-rgb
This caused toValue() to emit invalid CSS like `color(p3 ...)`, which
the css-tree lexer rejects when re-validating the value in the CSS value
input (e.g. after a round-trip through the style panel).
Shorthand properties like background: var(--color) were silently dropped
when pasting into the CSS editor because the shorthand expander can't
handle unresolved var() references.
Fix: CSS vars from the current element's computed styles are now
resolved before expanding shorthands. Inline and nested fallbacks
(var(--a, var(--b))) are supported. If a var still can't be resolved, a
toast error is shown instead of silently dropping the property.
## 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:
0000)
- [ ] 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:
0000)
- [ ] 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:
0000)
- [ ] 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 replace an existing image asset with a new file
directly from the asset details panel, without having to delete and
re-upload manually. Related to [place an image so that it gets replaced
automatically everywhere its being used
#3268](https://github.com/webstudio-is/webstudio/issues/3268)
When clicking the new replace button on an image asset:
1. A file picker opens filtered to image MIME types
2. The new file is uploaded via the existing upload pipeline
3. All references to the old asset (props, styles, page meta: favicon,
social image, marketplace thumbnail) are atomically re-pointed to the
new asset
4. The old asset's filename and description are copied to the new asset
5. The old asset is deleted
A new `ReverseIcon` from the Figma library was added to the icons
package to represent the replace action.
## Steps for reproduction
1. Open the asset manager and select any image asset
2. In the asset details panel, click the new replace icon button next to
the download button
3. Select a new image file from the file picker
4. Expect the asset to be replaced in place - all usages (image props,
background styles, favicon, social image) should now reference the new
file with the original asset's filename preserved
## 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
- [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:
0000)
- [x] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [x] added tests
- [ ] if any new env variables are added, added them to `.env` file
- Add minSeats/maxSeats to PlanFeatures schema
- listMembers returns DB-backed pending invites (no more client-side
state)
- countAllMembers includes pending invites (billed at invite time, Figma
model)
- Builder-level workspace-router calls payment worker on
addMember/removeMember
- Removed client-side invitedEmails state from manage-members-dialog
- getSeatSuspendedMessage now accepts optional workspace name
- notification-router simplified (accept no longer syncs seats)
## 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:
0000)
- [ ] 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
Decimals like `line-height: 1.5` were being rounded to integers because
the rounding logic in parseIntermediateOrInvalidValue applied to all
`unit: "number"` values unconditionally. Now it only rounds when
parseCssValue confirms the decimal is actually invalid for the property
(e.g. z-index, column-count require integers; line-height does not).
# Description
This updates the navigator to use Figma-style subtree highlighting
instead of relying on vertical depth lines, which makes deeply nested
selections easier to follow. The selected node keeps the primary
selected background, its descendant subtree gets a lighter background,
and the navigator hides depth bars to reduce visual noise.
Related to
([#5206](https://github.com/webstudio-is/webstudio/issues/5206))
## Steps for reproduction
1. Open the Builder and create or expand a deeply nested navigator tree.
2. Select a node that has multiple nested descendants.
3. Expect the selected node to have the active background, its
descendant subtree to have a lighter background, and the navigator to no
longer rely on vertical guide lines for orientation.
https://github.com/user-attachments/assets/c7be9884-43e2-46f1-bb58-68bcf0bad48c
## 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
- [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:
0000)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [x] added tests
- [ ] if any new env variables are added, added them to `.env` file
## Description
Prevent accidental form submit in the resource variable modal when
adding or removing headers and search params. The icon buttons in the
resource editor were acting as submit buttons, which caused the
new-variable modal to close unexpectedly instead of updating the
resource fields. Updated the builder test-cases document with a manual
regression flow.
## Steps for reproduction
1. Select an element in a project
2. Open Settings for the element
3. Under data variables, create a new variable
4. Set the name
5. Select `resource` as the type
6. Enter a resource URL
7. Add a header
8. Expect the modal to stay open and a new header row to be added
9. Add a search param
10. Expect the modal to stay open and a new search param row to be added
https://github.com/user-attachments/assets/3dff2e22-284b-4548-8565-937255a732bb
## 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
- [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:
0000)
- [x] 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. Fix style panel label rendering for repeated `box-shadow` and
`text-shadow` items after hiding one layer.
When a shadow layer is hidden, it is omitted from serialized computed
CSS. The repeated-style helper was reparsing that computed value and
bailing out when the computed item count no longer matched the cascaded
item count, which caused all shadow row labels to lose their details
even though the CSS and edit dialogs remained correct.
This PR:
- preserves repeated-item index mapping when hidden layers compact the
computed value
- returns hidden parsed items for hidden rows so labels still have data
- makes shadow labels prefer the row's parsed shadow value before
falling back to computed data
- adds regression tests for hidden box-shadow and text-shadow layers
https://github.com/user-attachments/assets/bd25e302-fac1-4cea-8a4b-317cc5b448f7
## Steps for reproduction
1. Select an instance in the builder.
2. Add at least 3 `box-shadow` layers in the style panel.
3. Hide the first layer.
4. Observe that, before this fix, the labels collapse to partial values
like `Outer:`.
6. Repeat the same flow with at least 3 `text-shadow` layers.
7. With this PR, hidden and visible shadow rows keep their full labels.
## Code Review
- [ ] hi @kof, I need you to do
- 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:
0000)
- [x] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [x] added tests
- [ ] if any new env variables are added, added them to `.env` file
Oleg Isonen