mirror of
https://github.com/webstudio-is/webstudio.git
synced 2026-11-09 14:03:33 +09:00
Oleg Isonen
d9e3394c18
Closes #6470 Closes #4806 Closes #4392 Closes #4804 Closes #4616 Closes #4863 Closes #4912 Ref #1798 Advanced styles now uses a CSS block editor in the panel and a centered editor. Local declarations are editable. Cascaded or inherited, preset, and global declarations are grouped below them and are read-only. The editor suggests properties and values, highlights search matches, shows source details and color swatches, and previews valid local edits on the canvas. Keyframe CSS declarations use the reusable local block editor. The old Add styles field, property-row editor, declaration menu actions, and Navigator CSS Preview are removed. ### Delivery checklist - [x] Edit and validate local CSS declarations, including shorthand display and likely typo hints - [x] Show other style sources with source colors, tooltips, and read-only protection - [x] Add search navigation, color swatches, and the centered editor shortcut - [x] Reuse the block editor for animation keyframes and preserve transform controls - [x] Preserve uploaded background layers when editing gradients or reordering layers - [x] Remove superseded editor and Navigator UI - [x] Review and update the Style panel and Navigator guides - [x] Remove the outdated CSS Preview sentence from the Builder anatomy guide - [x] Rename the stale Code view test title to match the Advanced editor - [x] Regenerate fixtures and keep the Vercel build manifest through regeneration - [x] Resolve review threads and verify required CI ### Implementation notes Styles remain stored as individual properties; equivalent shorthand text is reconstructed for editing. Unknown property names become CSS variables unless they resemble a known property, in which case the editor warns and skips the typo. Editing is limited to the selected local style block; read-only source groups remain visible for reference. Existing uploaded image and hidden background layers are retained when neighboring layers change. No schema migration is needed. The Vercel manifest setting lives in the React Router template, so fixture regeneration produces a clean worktree. The shared template also generates the setting for the Docker fixture. ### Verification On commit `7fb44d358`, both fixture checks, `check-size`, the main workflow, all ten end-to-end shards, and the label-approved visual comparison passed. The fixture regeneration, Vercel build, Builder typecheck, focused lint, and formatting checks passed locally before the final documentation and test-title cleanup; `git diff --check` passed afterward. No local tests were run for the final cleanup, which changes no behavior.
112 lines
6.3 KiB
JSON
112 lines
6.3 KiB
JSON
{
|
|
"packageManager": "pnpm@9.14.4",
|
|
"name": "webstudio-root",
|
|
"version": "0.0.0",
|
|
"private": true,
|
|
"type": "module",
|
|
"scripts": {
|
|
"build": "pnpm -r --filter='!./fixtures/*' build",
|
|
"webstudio": "node packages/cli/local.js",
|
|
"dts": "pnpm -r dts",
|
|
"dev": "pnpm --filter=@webstudio-is/builder dev:local",
|
|
"evaluations": "pnpm --filter webstudio evaluations",
|
|
"lint": "oxlint --deny-warnings",
|
|
"check:package-boundaries": "node scripts/check-package-boundaries.mjs",
|
|
"check:generated-api": "pnpm --filter @webstudio-is/project-build generate-runtime-operation-contracts && pnpm --filter @webstudio-is/builder generate-server-only-api-metadata && node scripts/check-clean-files.mjs packages/project-build/src/contracts/__generated__/runtime-operation-contracts.ts packages/protocol/src/builder-api/__generated__/server-only-router-operation-metadata.ts",
|
|
"check:generated-docs": "pnpm --filter @webstudio-is/project-build generate-docs && pnpm --filter webstudio generate-docs && pnpm docs:mcp:typecheck && pnpm docs:content-engine:test && pnpm docs:mcp:check && pnpm docs:content-engine:check && node scripts/check-clean-files.mjs packages/project-build/src/docs.generated.ts packages/cli/src/docs.generated.ts",
|
|
"check:fixture-sizes": "tsx scripts/check-fixture-sizes.ts",
|
|
"docs:mcp:sync": "tsx scripts/docs/generate-mcp-docs.ts",
|
|
"docs:mcp:check": "pnpm docs:mcp:sync && node scripts/check-clean-files.mjs docs/university/mcp.md",
|
|
"docs:mcp:typecheck": "tsc --noEmit -p scripts/docs/tsconfig.json",
|
|
"docs:content-engine:sync": "tsx scripts/docs/generate-content-engine-docs.ts",
|
|
"docs:content-engine:check": "pnpm docs:content-engine:sync && node scripts/check-clean-files.mjs docs/university/foundations/content-engine-reference.md",
|
|
"docs:content-engine:test": "pnpm --filter webstudio exec vitest run src/content-engine-reference.test.ts",
|
|
"test:packages": "pnpm -r --filter '!@webstudio-is/builder' --filter '!webstudio' test",
|
|
"test:cli": "pnpm --filter webstudio test",
|
|
"test:builder:core": "pnpm --filter @webstudio-is/builder exec vitest run --project 'core-*'",
|
|
"test:builder:app": "pnpm --filter @webstudio-is/builder exec vitest run --project 'app-*'",
|
|
"fixtures": "pnpm -r fixtures:link && pnpm -r fixtures:sync && pnpm -r fixtures:build",
|
|
"checks": "pnpm -r test && pnpm -r typecheck && pnpm lint && pnpm check:package-boundaries && pnpm check:generated-api && pnpm check:generated-docs && pnpm fixtures",
|
|
"e2e:builder": "pnpm --filter=@webstudio-is/builder e2e",
|
|
"e2e:builder:build": "pnpm --filter=@webstudio-is/builder build",
|
|
"e2e:builder:dev:backend": "pnpm --filter=@webstudio-is/builder e2e:dev:backend",
|
|
"e2e:builder:dev": "pnpm --filter=@webstudio-is/builder e2e:dev",
|
|
"e2e:builder:refresh-schema-cache": "pnpm --filter=@webstudio-is/builder e2e:schema-cache",
|
|
"e2e:builder:check-supabase-migrations": "pnpm --filter=@webstudio-is/builder e2e:supabase-migrations",
|
|
"playwright": "pnpm -r playwright-init",
|
|
"format": "oxfmt",
|
|
"storybook:dev": "storybook dev -p 6006",
|
|
"storybook:build": "storybook build",
|
|
"visual-regression": "tsx --conditions=webstudio scripts/visual-regression/run.ts",
|
|
"visual-regression:ui": "tsx --conditions=webstudio scripts/visual-regression/run.ts --open-report",
|
|
"visual-regression:report": "tsx scripts/visual-regression/open-report.ts",
|
|
"visual-regression:test": "tsx --test scripts/visual-regression/*.test.ts",
|
|
"visual-regression:typecheck": "tsc -p scripts/visual-regression/tsconfig.json",
|
|
"migrations": "pnpm --filter=@webstudio-is/prisma-client generate && pnpm --filter=./packages/prisma-client migrations --dev --cwd ../../apps/builder",
|
|
"prepare": "which git && git config core.hooksPath .git/hooks/ && simple-git-hooks || echo git not installed",
|
|
"local:version-snapshot": "pnpm -r exec pnpm version prepatch --preid $(cat /dev/urandom | LC_ALL=C tr -dc 'a-z' | fold -w 8 | head -n 1)",
|
|
"local:publish-snapshot": "pnpm -r publish --access public --no-git-checks --registry http://localhost:4873",
|
|
"local:dangerously-undo-version-snapshot": "git restore --source=$(git branch --show-current) '**/*/package.json'",
|
|
"local:release": "pnpm build && pnpm dts && pnpm local:version-snapshot && pnpm local:publish-snapshot && pnpm local:dangerously-undo-version-snapshot && echo \"now execute\npnpm up -r -L '@webstudio-is/*' --registry http://localhost:4873\"",
|
|
"clean:deep": "bash ./cleanup.sh"
|
|
},
|
|
"simple-git-hooks": {
|
|
"pre-commit": "./node_modules/.bin/nano-staged"
|
|
},
|
|
"devDependencies": {
|
|
"@modelcontextprotocol/sdk": "^1.10.0",
|
|
"@radix-ui/react-tooltip": "^1.2.4",
|
|
"@storybook/addon-actions": "^8.6.4",
|
|
"@storybook/addon-backgrounds": "^8.6.4",
|
|
"@storybook/addon-controls": "^8.6.4",
|
|
"@storybook/addon-toolbars": "^8.6.4",
|
|
"@storybook/react": "^8.6.4",
|
|
"@storybook/react-vite": "^8.6.4",
|
|
"@types/node": "^22.13.10",
|
|
"@types/react": "^18.2.70",
|
|
"@types/react-dom": "^18.2.25",
|
|
"@webstudio-is/project-build": "workspace:^",
|
|
"@webstudio-is/vision": "workspace:^",
|
|
"esbuild": "^0.25.3",
|
|
"nano-staged": "^0.8.0",
|
|
"oxfmt": "0.58.0",
|
|
"oxlint": "^1.73.0",
|
|
"parse5": "7.3.0",
|
|
"react": "18.3.0-canary-14898b6a9-20240318",
|
|
"react-dom": "18.3.0-canary-14898b6a9-20240318",
|
|
"simple-git-hooks": "^2.11.1",
|
|
"storybook": "^8.6.4",
|
|
"tsx": "^4.19.3",
|
|
"typescript": "7.0.2",
|
|
"webstudio": "workspace:^",
|
|
"vite": "^6.3.4"
|
|
},
|
|
"engines": {
|
|
"node": "22",
|
|
"pnpm": "^9.14.0",
|
|
"yarn": "This project is configured to use pnpm"
|
|
},
|
|
"nano-staged": {
|
|
"*.{ts,tsx,js,json,css,md}": "oxfmt"
|
|
},
|
|
"pnpm": {
|
|
"overrides": {
|
|
"@types/react": "^18.2.70",
|
|
"@types/react-dom": "^18.2.25",
|
|
"react": "18.3.0-canary-14898b6a9-20240318",
|
|
"react-dom": "18.3.0-canary-14898b6a9-20240318",
|
|
"playwright": "1.50.1",
|
|
"@playwright/test": "1.50.1",
|
|
"vite@<7": "6.3.4",
|
|
"@react-router/dev>vite-node": "3.2.4",
|
|
"@codemirror/state": "6.5.2",
|
|
"@codemirror/view": "6.36.4"
|
|
},
|
|
"patchedDependencies": {
|
|
"@stitches/react@1.3.1-1": "patches/@stitches__react@1.3.1-1.patch",
|
|
"@radix-ui/react-scroll-area@1.0.5": "patches/@radix-ui__react-scroll-area@1.0.5.patch",
|
|
"@remix-run/dev": "patches/@remix-run__dev.patch"
|
|
}
|
|
}
|
|
}
|