mirror of
https://github.com/webstudio-is/webstudio.git
synced 2026-10-30 08:37:56 +09:00
codex/headers-settings-docs
125
Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
|
|
e69a3d2f8e |
feat: Create structured MDX entries from collection folders (#6317)
## Paragraph editing follow-up — |
||
|
|
b832a8e808 |
refactor: Centralize Builder ID generation (#6323)
## Outcome Builder-owned code now routes standard ID generation through `@webstudio-is/sdk/createId` while preserving existing NanoID and UUID formats. Closes #6322 ## Technical choices - Use `createId("nano")` for Builder records, assets, transaction IDs, and other existing NanoID-backed values. - Use `createId()` for UUID-backed database records and browser-side client IDs. - Keep `BuilderRuntimeContext.createId` as an injectable dependency. Runtime operations, copy/paste, and deterministic tests rely on that injection. - Keep Node's `randomUUID` in CLI paths that explicitly support running without the Web Crypto global. - Keep specialized generators for custom-alphabet project domains and actual hash generation. - Remove direct `nanoid` dependencies from packages where no specialized use remains. - Do not migrate existing data or change database schemas. ## Todo - [x] Migrate Builder app ID creation. - [x] Migrate project runtime and template defaults. - [x] Migrate asset, project, domain, and authorization-token IDs. - [x] Preserve runtime ID injection. - [x] Review remaining direct generators as explicit exceptions. - [x] Add NanoID-format regression coverage for the default runtime context. - [x] Review documentation impact: no user-facing documentation changes are needed. - [x] Review fixture impact: no fixture input or generated output format changes are needed. - [x] Run targeted tests, typechecks, lint, and package-boundary checks. ## Verification - Targeted Builder tests: 153 passed after preserving runtime-context injection. - Project-build runtime tests: 270 passed. - Asset uploader tests: 61 passed. - Authorization-token tests: 17 passed. - Project tests: 52 passed. - Domain tests: 18 passed. - CLI tests: 32 passed. - Typechecks passed for Builder, project-build, asset-uploader, authorization-token, project, and domain. - `pnpm lint` passed. - `pnpm check:package-boundaries` passed. - The runtime-context format test was demonstrated to fail with a UUID default and pass with the NanoID default. - Agent evaluations were not run because they require separate explicit approval. |
||
|
|
d4b1994a6a |
fix: Improve editor selection and project tag contrast (#6302)
Closes #6301 ## Summary - Restore Dashboard project tags to the pre-color-refactor treatment: fixed white text over a 30% black scrim in both application themes. - Use one high-contrast text-selection treatment across native inputs, textareas, contenteditable fields, and every shared CodeMirror editor. - Preserve the existing subtle selection treatment for Navigator, Project Settings, command menus, Dashboard navigation, and other selected controls. - Add direct Storybook coverage for the CSS fragment editor. - Simplify chromatic color derivation from 571 to 329 lines without changing computed colors. ## Technical choices - Keep project tags independent from application-theme polarity because they overlay arbitrary thumbnail artwork. - Keep the existing `selectionBackground` control-state export unchanged at its original 12% light / 20% dark accent blend. - Define separate `--background-text-selection` and `--foreground-on-text-selection` tokens exclusively for selected text. - Use the bounded accent in light mode and a luminance-lifted accent in dark mode so selected text remains distinct even with extreme custom theme colors. - Style CodeMirror through its existing selection layer and `::selection` CSS hooks; no selection tracking or editor-state logic is added. - Leave canvas rich-text selection independent: authored canvas documents do not load the Builder UI theme stylesheet. - Replace five duplicated XYZ clamp formulas with the exact upper-luminance cap they reduce to. The removed lower-bound and white-mixing branches were unreachable because the minimum was fixed at zero. ## Todo - [x] Restore the original project-tag scrim and foreground in both themes. - [x] Inventory native, CodeMirror, and canvas rich-text selection paths. - [x] Unify native and shared CodeMirror text-selection colors. - [x] Keep text selection independent from selected control and navigation states. - [x] Add the missing CSS fragment editor story. - [x] Add light- and dark-mode browser regressions and confirm they fail before the fix. - [x] Enforce 4.5:1 selected-text contrast and 3:1 highlight-to-surface contrast across supported theme inputs. - [x] Remove duplicated and unreachable chromatic color derivation while preserving outputs. - [x] Review documentation impact; the design-system color-token reference is updated, with no user-facing product documentation change required. - [x] Verify fixture impact; no fixture inputs or generated outputs are affected. ## Verification - `pnpm --filter @webstudio-is/design-system test` — 227 tests passed, including the control/text separation regression, Navigator tree interaction, default-palette comparisons, and the full supported-theme contrast sweep - `pnpm --filter @webstudio-is/design-system typecheck` - `pnpm --filter @webstudio-is/builder exec vitest run app/shared/code-editor-base.browser.test.tsx --project app-browser-shared` - `pnpm --filter @webstudio-is/builder exec vitest run app/dashboard/projects/project-card.browser.test.tsx --project app-browser-canvas-dashboard` - `pnpm --filter @webstudio-is/builder typecheck` - Targeted `oxlint`, formatting, and `git diff --check` - Live dark-mode Dashboard verification of the restored subtle navigation selection - Storybook visual checks for the full color system and input/CodeMirror selection in light and dark modes |
||
|
|
c49c0786be |
fix: unify dashboard background surface (#6287)
## 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 |
||
|
|
f953d1be37 |
fix: Restore the login background gradient (#6286)
## Summary Restores the original Webstudio login gradient after the color-system migration added a dark scrim over it. Fixed Webstudio identity artwork now belongs to the Design System, while generic surfaces, content, translucency, and overlays use the semantic color system instead of a Builder-local brand color bag. ## Architecture - The Design System exports only the fixed Webstudio background gradient, progress gradient, and progress shadow as brand artwork. - Generic black, white, translucent panel, and scrim entries were removed rather than moved. - Login and error surfaces use semantic light/dark pairings. - Project-card tags derive their local 30% scrim from the semantic overlay color. ## Todo - [x] Restore the original login gradient without a scheme-dependent scrim. - [x] Move fixed identity artwork into the Design System package. - [x] Remove the Builder-local brand color registry. - [x] Replace generic fixed colors with semantic colors or local derivations. - [x] Add explicit dark-mode Storybook coverage for the login screen. - [x] Run Design System and Builder typechecks. - [x] Run Design System tests, scoped lint, formatting, and package-boundary validation. - [x] Review documentation impact and document ownership in the Design System color README. ## Verification - Design System tests: 222 passed. - Design System and Builder typechecks: passed. - Scoped Oxlint and formatting: passed. - Package-boundary validation: passed. - Focused visual regression: 23 affected stories compared; the newly added dark login story is the only difference. - Fixture impact: no fixture inputs or generated outputs are affected. Ref #3818 |
||
|
|
f6c524572d |
feat: add Builder dark theme and rebuild colors
## Summary
Rebuilds Webstudio’s color system, migrates the entire Builder to it,
and introduces a complete dark theme.
A small set of theme colors and contrast controls now drives the
interface through relative CSS colors:
```text
Theme colors and contrast
↓
Light/dark derivation bounds
↓
Derived color families
↓
Reusable semantic colors
↓
Component composition
↓
Builder interface
```
CSS is the runtime source of truth. Light and dark modes share the same
theme inputs, so changing a theme color automatically updates its
surfaces, content, borders, states, and component presentation. The
refactor turns dark mode into a first-class Builder theme rather than a
separately maintained palette.
This is an atomic migration. Legacy color names and compatibility
aliases will not remain after all consumers have moved.
## Scope
- The color source, derivation model, semantic vocabulary, validation,
typing, and Storybook overview.
- Every design-system component.
- Builder, dashboard, authentication, shared UI, Query Builder, stories,
and tests that consume the legacy color scale.
- Removal of the legacy Stitches color scale after its final consumer is
migrated.
- A complete dark theme across application UI while keeping authored
canvas content independent.
- Complete light and dark visual verification.
- Unified browser-test infrastructure: Vitest Browser Mode for Design
System browser contracts and standard Playwright Test for all Builder
E2E workflows.
Literal colors remain only where color is the actual content or belongs
to a deliberately separate system, such as user-authored values,
external previews, brand artwork, data visualization, functional canvas
overlays, and source assets. Every remaining exception must have an
explicit owner.
## Architecture decisions
- Theme authors control six color families and three bounded contrast
controls.
- Relative CSS colors derive the rest of the system.
- Dark mode changes derivation bounds instead of maintaining a second
independent palette.
- Components consume a small reusable semantic vocabulary.
- Component states and exceptional presentation are composed inside
components.
- Builder-specific categorical meaning uses focused composite recipes,
not intent semantics or a larger global vocabulary.
- TypeScript validates public semantic CSS-variable names but does not
generate runtime colors.
- No token-manager dependency, compatibility aliases, or
component-specific public color tokens.
- A new semantic or theme variable is added only when existing semantics
and local composition cannot represent a reusable cross-feature
decision.
## Todo
### Color-system foundation
- [x] Establish direct CSS as the runtime source of truth.
- [x] Define bounded theme colors and contrast controls.
- [x] Derive light and dark modes from the same theme inputs.
- [x] Reduce the semantic inventory to reusable decisions and explicit
accessibility pairs.
- [x] Generate only TypeScript names for public semantic CSS variables.
- [x] Validate layers, references, cycles, consumption, naming,
generated types, and browser-computed contrast.
- [x] Add the Storybook color-system overview and theme controls.
- [x] Document the architecture and its relationship to the public Craft
specification.
### Design-system migration
- [x] Replace every active legacy color consumer in design-system
components and Storybook chrome.
- [x] Compose component states locally without component-specific public
tokens.
- [x] Preserve intentional preview and sample-content colors.
- [x] Add complete positive, negative, warning, informative, and accent
accessibility pairings.
- [x] Validate light and dark scheme-bound references independently.
- [x] Verify the design-system package with typecheck, lint, formatting,
Storybook, and 222 tests.
### Inventory and contract
- [x] Inventory all 319 legacy references across 107 Builder, Query
Builder, story, test, and design-system files.
- [x] Classify every reference as a direct semantic replacement, local
composite recipe, documented literal exception, or removable code.
- [x] Record the intentional authored-content, external-preview,
functional-preview, data-visualization, brand, and source-asset
exceptions.
- [x] Treat the public semantic vocabulary as closed by default and
justify any proposed addition by cross-feature reuse and accessibility
need.
- [x] Keep Builder code limited to typed public variables accepted by
`cssVar()`.
### Theme infrastructure
- [x] Add `system` (default), `light`, and `dark` application
preferences.
- [x] Persist the preference in existing client settings and resolve
`system` through `matchMedia`.
- [x] Apply the resolved scheme before paint and respond to
operating-system changes.
- [x] Expose the persisted theme control under **View → Color scheme**.
- [x] Keep authored canvas documents independent from the application
theme.
- [x] Ensure portals, overlays, embedded surfaces, and third-party
controls receive the correct interface scheme.
### Generic interface migration
- [x] Migrate shared dialogs, project settings, notifications, controls,
and Query Builder.
- [x] Migrate dashboard, authentication, publishing, and shared
application UI.
- [x] Migrate the Builder loading state, topbar, sidebars, navigator,
workspace, footer, settings, pages, alerts, and menus.
- [x] Replace fixed interface literals alongside their owning surfaces.
- [x] Remove the old scrollbar variable and hardcoded loading color.
### Style panel and style-source recipes
- [x] Migrate ordinary style-panel inputs, labels, layouts, spacing,
alignment, menus, property states, and value editors.
- [x] Model style-source provenance, kind, interaction, and error as
separate axes.
- [x] Compose categorical style-source colors from neutral and
accent-relative colors.
- [x] Use negative semantics only for actual errors, not overwritten
provenance.
- [x] Reuse one feature-owned recipe across style-source controls,
badges, menus, and values without adding global tokens.
### Canvas and editors
- [x] Migrate canvas selection, reusable outlines, grid guides, resize
handles, labels, badges, and overlays.
- [x] Keep collaborator colors as data visualization while guaranteeing
readable labels.
- [x] Prevent Builder theme values from leaking into authored content.
- [x] Migrate editor surfaces, selections, autocomplete, lint states,
and tooltips.
- [x] Derive syntax visualization from neutral and accent-relative
colors; reserve intent colors for diagnostics.
### Explicit color domains
- [x] Isolate external search and social previews from the application
scheme.
- [x] Preserve user-authored CSS values, functional color previews, and
checkerboards.
- [x] Review brand surfaces independently in both schemes.
- [x] Document every retained literal in the exception ledger.
### Stories, tests, and legacy removal
- [x] Migrate all affected Builder stories and tests.
- [x] Replace the design-system test that intentionally references the
legacy scale.
- [x] Add theme-preference and scheme-resolution behavior tests.
- [x] Remove the legacy `design-tokens.color` registry.
- [x] Remove the Stitches `colors` scale and `rawTheme.colors`.
- [x] Remove color-name conversion code that exists only for the legacy
scale.
- [x] Add a focused repository check that rejects legacy references.
- [x] Confirm no compatibility mappings or deprecated aliases remain.
### Browser-test infrastructure
- [x] Run pure Design System tests in Node and browser-dependent tests
in Vitest Browser Mode with Playwright Chromium.
- [x] Migrate all 79 Builder E2E workflows from the custom harness to
standard Playwright Test.
- [x] Replace filename-based shard discovery with standard Playwright
sharding.
- [x] Preserve clean-backend shard retries and upload Playwright failure
artifacts in CI.
- [x] Remove the custom runner, registry, and timeout infrastructure.
### Verification and documentation
- [x] Compare light-mode visual regressions directly with `main`; review
every difference rather than accepting snapshots wholesale.
- [x] Add representative dark coverage for dashboard, Builder shell,
style panel, dialogs, editors, canvas tools, and status states.
- [x] Test default and extreme custom-theme presets.
- [x] Verify semantic and categorical-recipe contrast.
- [x] Test first paint, persistence, system changes, portals, and canvas
isolation.
- [x] Run affected tests, typechecks, lint, formatting, and Storybook
checks.
- [x] Review fixture impact; no fixture inputs or generated outputs are
affected.
- [x] Review authoritative `docs/` content and update it where needed.
- [x] Review the final diff and make this checklist reflect delivered
scope.
## Current verification
- Design-system typecheck and generated-type freshness: passed.
- Design-system tests: 222 passed, including the full theme-parameter
contrast sweep and browser component coverage.
- Builder typecheck and production build: passed.
- Theme preference and scheme-resolution tests: 10 passed.
- Scoped Oxlint, formatting, and diff checks: passed.
- Design-system Storybook build and representative light/dark visual
review: passed.
- Builder E2E: 80/80 Playwright entries passed (setup plus 79
workflows).
Ref #3818
Closes #6267
|
||
|
|
db3b11970f |
fix: Optimize images in Markdown Embed (#6089)
## Summary Markdown Embed now renders image tags with the same optimized attributes and canvas behavior as the SDK Image component. The implementation shares the complete attribute-resolution path without rendering React inside the Markdown pipeline: - `@webstudio-is/image` exposes one framework-independent `getImageAttributes` function for optimization, placeholder fallback, loading, decoding, dimensions, alternative text, and responsive sources. - React-only element props such as `className`, `style`, handlers, context, and refs stay in React callers. - The SDK Image component and Markdown renderer both use `getSdkImageProps` for canvas-specific loading, decoding, asset identity, and incomplete-upload handling. - Markdown retains only the necessary HTML attribute-name conversion, sanitization, and Safari-safe `sizes` / `srcset` / `src` ordering. - The redundant low-level React Image primitive was removed. Its callers now render native `img` elements, and the image package no longer has React runtime or peer dependencies. ## Compatibility and tradeoffs - The SDK Image component remains the public React component because it owns React context and ref forwarding. - The removed low-level `@webstudio-is/image` Image export is replaced by the pure attribute function for internal callers. - No data migration or schema change is required. - Loader output is sanitized after transformation, while unsafe input URLs are sanitized before reaching the loader. ## Todo - [x] Share image attribute resolution between native, SDK, and Markdown images. - [x] Preserve SDK canvas behavior for Markdown images. - [x] Preserve safe URL sanitization and Safari-safe responsive attribute ordering. - [x] Remove the redundant low-level React image primitive and migrate its callers. - [x] Remove the overlapping `getImageProps` abstraction. - [x] Add regression coverage comparing Markdown, SDK Image, and native attribute output. - [x] Review documentation impact and update the Markdown Embed documentation. - [x] Run targeted tests, typechecks, builds, lint, formatting, package-boundary checks, and fixture generation. ## Verification - `pnpm --filter @webstudio-is/image test` - `pnpm --filter @webstudio-is/image typecheck` - `pnpm --filter @webstudio-is/image build` - `pnpm --filter @webstudio-is/image dts` - `pnpm --filter @webstudio-is/sdk-components-react test` - `pnpm --filter @webstudio-is/sdk-components-react typecheck` - `pnpm --filter @webstudio-is/sdk-components-react build` - `pnpm --filter @webstudio-is/sdk-components-react dts` - `pnpm --filter @webstudio-is/builder typecheck` - `pnpm --filter @webstudio-is/design-system typecheck` - Targeted Oxlint and Oxfmt checks - `pnpm check:package-boundaries` - `pnpm fixtures` (no fixture diff) Ref #6014 |
||
|
|
d291e4b671 |
feat: Builder api runtime contracts guardrails for MCP (#5857)
This PR expands Webstudio MCP and CLI into a more complete agent authoring interface. Agents can discover project capabilities, edit real Webstudio content, use data/resources, verify visual output, and report useful issues when workflows fail. ## MCP User Capabilities - Create, update, duplicate, reorder, and delete pages. - Create pages from templates and manage reusable page templates. - Inspect project pages, instances, props, styles, assets, variables, resources, and metadata. - Insert Webstudio components and authored JSX fragments into pages. - Edit text, props, styles, breakpoints, design tokens, and CSS variables. - Update page metadata, SEO fields, redirects, marketplace metadata, and project settings. - Create and use static data variables. - Create and use dynamic resources fetched over HTTP. - Use REST, GraphQL, and built-in system resources in authored pages. - Bind data variables and resources to visible page content. - Create resource-backed pages such as sitemap XML, structured SEO data, and API-driven content sections. - Preview current project state without requiring a publish step. - Capture screenshots for visual verification. - Verify responsive designs across desktop, tablet, and mobile breakpoints. - Use screenshot diff and OCR-style checks to inspect rendered output. - Reset and refresh local MCP project state when needed. - Discover available CLI/MCP commands from generated manuals. - Use clearer examples for resources, data variables, JSX authoring, previewing, and visual checks. - Read marketplace product metadata without requiring a full project snapshot. - Get safer guidance when using low-level patch tools. - Get a ready-to-copy Discord report template when MCP/CLI behavior is confusing or broken. |
||
|
|
bfcdef65de | chore: Fix/build id sync from main (#5843) | ||
|
|
82c3d83fd1 |
fix: optimize CLI import for large data amount (#5831)
## Summary - Add CLI project import support from synced `.webstudio/data.json` into another project via a destination share link. - Move project bundle import/export contract into `@webstudio-is/protocol`, including bundle versioning, staged upload constants, schema validation, and fixture coverage. - Upload project bundle data through staged TUS upload before calling the import RPC to avoid request body limits. - Upload referenced assets as binary files through the existing asset upload route before importing asset rows. - Add `--skip-assets` and `--ignore-version-check` import options. - Add retry handling for transient missing imported asset files by re-uploading only the reported missing assets. - Share missing-asset import error formatting/parsing through protocol to avoid duplicated string contracts. - Preserve browser asset upload behavior while adding API upload support. - Normalize schema naming across the branch to lower-case names without `Schema` suffix. |
||
|
|
d259a6d970 |
fix: Prevent caching builder user data (#5761)
**Summary** Migrates Builder bootstrap data loading from the legacy `/rest/data/:projectId` endpoint to `build.loadData` tRPC, while keeping the old REST route as a no-store compatibility shim. Hardens authenticated Builder/dashboard responses by explicitly sending: - `Cache-Control: private, no-store, max-age=0` - `Pragma: no-cache` - `Expires: 0` - `Vary: Cookie` **Details** - Added `build.loadData` tRPC query for full Builder state. - Switched Builder client bootstrap loading to tRPC. - Added shared cache-control helpers for private no-store responses. - Made tRPC responses private/no-store by default unless anonymous and explicitly public-cacheable. - Added no-store headers to Builder/dashboard/auth/resource/asset-related responses. - Updated redirect handling to preserve headers while enforcing no-store. - Prevented stale dashboard account data from flashing by applying user-scoped loader data before paint and clearing stores on teardown. - Added tests for cache headers, tRPC response metadata, and no-store redirects. **Validation** - `pnpm --filter @webstudio-is/builder test -- app/services/cache-control.server.test.ts app/services/trpc-response-meta.server.test.ts app/services/no-store-redirect.test.ts app/routes/rest.assets.test.ts app/shared/sync/project-queue.test.ts app/dashboard/dashboard.test.ts` - `pnpm exec oxlint ...` on touched files - `git diff --check` `pnpm --filter @webstudio-is/builder typecheck` still fails on existing unrelated Tailwind/css-engine errors. |
||
|
|
b006947a85 |
feat: WIP realtime collaboration to builder (#5726)
https://github.com/webstudio-is/webstudio/issues/46 |
||
|
|
f0bc73bdac | feat: Onboard video in dashboard (#5725) | ||
|
|
c0d2ebf8e0 | feat: Remove starter templates, add welcome screen with guide and social links (#5722) | ||
|
|
4be8a03726 | fix: Members dialog stale workspace data (#5710) | ||
|
|
70a1a5d6be | chore: show over-capacity warning when members exceed paid seats (#5708) | ||
|
|
5c6af9942b | fix: use DialogActions consistently in all dialogs with footer buttons (#5701) | ||
|
|
09c89376fb | chore: fix workspaces seats counter (#5693) | ||
|
|
4748fa5f1e |
fix: restore short --variable label in CSS value input (#5694)
## Problem
Commit
|
||
|
|
90f92c58d3 |
feat: workspace seat billing at invite time, persist pending invites (#5680)
- 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 |
||
|
|
b8a194c011 | feat: Workspaces (#5641) | ||
|
|
f28e99d85a | chore: Payments (#5671) | ||
|
|
91d2136921 | refactor(stories): consolidate exports, add StorySection/StoryGrid everywhere, remove argTypes/args | ||
|
|
2216adf4f0 |
fix: expand story coverage and apply sentence case to all story titles
- Add new story variants across ~100 files covering previously untested props - Fix all story titles to use sentence case per UI label guidelines - Consolidate duplicate card, thumbnail, and value-text stories into parent files - Add interactive/controlled variants for checkbox, radio, switch, select, etc. - Add style source, disabled, icon, placeholder, unit options variants to CssValueInput - Add sub-menu, radio group, destructive, and disabled variants to dropdown/context menus - Add dialog resize, maximize, actions, and non-draggable variants - Add popover title, actions, and side placement variants - Add tooltip side placements and content variant stories |
||
|
|
f62a34bbff | fix: resolve naming conflicts in story exports and fix TS errors\n\nAlias component imports to avoid conflicts with story export names\n(e.g., import { Card as CardComponent }). Fix unused imports/variables\nin about.stories.tsx and css-value-input.stories.tsx. Fix CssProperty\ntype, help-center icon, and typeof self-references. | ||
|
|
64e5c17129 |
fix: stories render open by default, remove Demo nesting, use data URLs for images
- Make interaction-requiring stories render content immediately: - import-redirects-dialog: render dialog open directly - context-menu: use DropdownMenu with defaultOpen - enhanced-tooltip: add defaultOpen prop - tooltip: add open prop, pre-populate error state - command-panel: call openCommandPanel() on mount - toast: remove interactive InAction story - Rename single 'Demo' exports to match component names, eliminating redundant navigation nesting in Storybook (e.g. 'Search Preview / Demo' → 'Search Preview') - Replace external image URLs with inline data:image/svg+xml: - avatar: pravatar.cc → inline SVG - marketplace/card: placehold.co → inline SVG - search-preview: favicon.ico → inline SVG - animate-children-scroll: unsplash → inline gradient SVG - toast: Blob/createObjectURL → inline data URL |
||
|
|
0107eb8c4d |
fix: support data URIs in Image component, clean up stories
- Skip loader/optimization for data: src in getImageAttributes - Replace external picsum.photos URL with inline SVG data URI in social-preview story - Remove unnecessary ThumbnailWrapper from thumbnail stories |
||
|
|
8292755fb6 | fix: remove redundant title prefixes and use design system wrappers in stories\n\n- Remove redundant Builder/ prefix from 9 builder story titles (titlePrefix already adds it)\n- Remove redundant Design System/ prefix from 6 design-system story titles\n- Replace raw <div style={}> with Box/Flex and theme tokens in dashboard card/thumbnail stories | ||
|
|
2bdd6fd8e1 | refactor: dissolve features/topbar into standalone features\n\n- Move share, clone, safe-mode, builder-mode, view-mode, sync-status directly under features/\n- Move publish cluster (publish, domains, add-domain, entri, cname) into features/publish/\n- Move menu into features/menu/\n- Move topbar-layout (utility) and topbar (composition) into shared/\n- Remove spinner story (animated SVG causes flaky visual tests)\n- Remove avatar NoImageNoFallback variant (invalid state)\n- Update story titles to reflect new structure | ||
|
|
a06bedb8fc | feat: add visual regression stories for style panel, dashboard, and design system components | ||
|
|
50f7ea593a |
fix: Show lifetime deal purchases in profile menu (#5634)
Previously only purchases with a subscriptionId (recurring subscriptions) were displayed. Lifetime deals were counted as paid (no "Free" badge) but not shown in the dropdown. Now LTDs appear as non-clickable labels while subscriptions remain clickable and navigate to the billing portal. ## 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 |
||
|
|
9f497a3513 |
feat: Redirects improvements (#5619)
Show a warning banner when a redirect path matches the current page path, indicating the redirect will override access to the page. Changes: - Add PanelBanner component with warning variant to page settings - Implement findMatchingRedirect utility to detect redirect conflicts - Show contextual warning with link to Redirects settings section - Add comprehensive tests for redirect conflict detection Code quality: - Replace 'return undefined' with 'return' per style guide - Use 'return null' for React components returning nothing |
||
|
|
2a49a9f1fe |
feat: Add safe mode (#5612)
- Changed safe mode detection from .has() to strict === 'true' check - Made safemode a required boolean parameter in builderPath/builderUrl - Added 'Open in safe mode' option to dashboard project menu - Added safe mode indicator button with shield icon in topbar - Safe mode now prevents all script execution in HTML embeds - Added isSafeMode to React SDK context - Added test coverage for safe mode in HTML embed component ## 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 |
||
|
|
8e02c86e5f | chore: Profile menu improvements (#5596) | ||
|
|
8cc1458001 |
feat: add more flags for mini plan (#5440)
Here's the list of available user plan flags with their defaults - allowAdditionalPermissions: true, - allowDynamicData: true, - allowContentMode: true, - allowStagingPublish: true, - maxContactEmails: 5, - maxDomainsAllowedPerUser: Number.MAX_SAFE_INTEGER, - maxPublishesAllowedPerUser: Number.MAX_SAFE_INTEGER, --------- Co-authored-by: Oleg Isonen <oleg008@gmail.com> |
||
|
|
1f4c53419d |
feat: Pseudo elements (#5572)
This PR replaces the limited "States" dropdown in the Style Panel with a flexible input field that supports any CSS selector, pseudo-class, or pseudo-element. This allows for advanced styling capabilities such as `:has()`, `:focus-visible`, and complex combinators. ## Key Changes ### Flexible Selector Input - Replaced the fixed "States" category list with a free-form input field. - Supports **any** valid CSS selector (e.g., `:hover`, `::before`, `:has(:checked)`). - Validation logic ensures only valid selectors are accepted (triggered on `Enter` key). ## How to Test 1. Select an element and open the Style Panel. 2. Click on the Local style source or a Token. 3. In the input field (bottom of menu), type a selector like `:hover` or `:first-child` and press Enter. 4. Verify the selector is added and selected. --------- Co-authored-by: zehjotkah <111518041+zehjotkah@users.noreply.github.com> |
||
|
|
0116966822 |
feat: Updated asset manager: new file types, asset resource, filters, sorting (#5539)
## Description - [x] new file types support - [x] categories filter - [x] sorting filter - [x] asset resource for access from custom code ## 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: 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 --------- Co-authored-by: zehjotkah <111518041+zehjotkah@users.noreply.github.com> |
||
|
|
14f552508b |
fix: Project settings multiple bugs (#5518)
## Description - user plan not correctly considered - loading icon stuck - added loadin indicator ## 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 |
||
|
|
dcdac0eaa7 |
feat: Project settings dialog accessible from dashboard (#5514)
## 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 |
||
|
|
6bba58d2b9 |
feat: delete cloud icon from dashboard (#5484)
doesn't have more value, already visible based on domain ## 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 |
||
|
|
1412d868ba |
chore: make migrations idempotent (#5476)
## 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 |
||
|
|
b7356e0c37 |
feat: List view and sorting of projects in dashboard (#5467)
## 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 |
||
|
|
9f66c8dc26 |
feat: Show custom domain in the dashboard if it exists (#5466)
## 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 |
||
|
|
d5aabf8920 |
chore: Cleanup storybook structure (#5457)
## 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 |
||
|
|
801181c8b6 |
feat: add project tags in dashboard (#5399)
Ref https://github.com/webstudio-is/webstudio/issues/860 https://github.com/user-attachments/assets/a85b525a-d43b-4361-aa5f-f2158b3c0211 --------- Co-authored-by: Oleg Isonen <oleg008@gmail.com> |
||
|
|
631743b860 |
feat: remove free domains (#5426)
<img width="357" height="297" alt="Screenshot 2025-10-15 at 11 54 23" src="https://github.com/user-attachments/assets/f4fa0c5f-89b4-4f9b-9152-bf339c2e8f55" /> |
||
|
|
7decfeb9d8 |
feat: Add Inception banner instead of navigation item (#5414)
## Description <img width="263" height="534" alt="image" src="https://github.com/user-attachments/assets/2618295b-fd34-425f-9339-b278b60365d7" /> |
||
|
|
1963572cb5 |
feat: Add Inception link to the dashboard (#5413)
## Description For a better discovery <img width="268" height="458" alt="image" src="https://github.com/user-attachments/assets/568d0f90-3579-401f-8232-8bbe8b21130d" /> |
||
|
|
5b3144d656 |
refactor: bump zod (#5035)
All three have minor feature updates - zod - zod-validation-error - zod-to-json-schema |
||
|
|
5c3a6e5fcd | refactor: restrict publish count per account (#5030) |