https://github.com/webstudio-is/webstudio-designer/issues/494
This PR Renders this UI and, when adding tokens - renders CSS variables
on the canvas: It's behind a feature flag.
<img width="411" alt="Screenshot 2022-11-25 at 15 51 00"
src="https://user-images.githubusercontent.com/52824/204009859-81ed72c4-e758-4973-be49-c8c65e6b4661.png">
## Before requesting a review
- [ ] if the PR is WIP - use draft mode
- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")
- [ ] what kind of review is needed?
- [ ] conceptual
- [ ] detailed
- [ ] with testing
## Test cases
- [ ] step by step interaction description and what is expected to
happen
## Before merging
- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio-designer/blob/main/apps/designer/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env.example`
and the `designer/env-check.js` if mandatory
Co-authored-by: istarkov <istarkov@gmail.com>
- [x] - Image optimization component moved into standalone package
- [x] - generate-arg-types moved into standalone package - one issue
with current yarn https://github.com/yarnpkg/yarn/issues/4964 (you need
to delete root node_modules, then yarn and yarn build to make
generate-arg-types to work)
- [x] - move json into `__generated__` folder, (allow import json from
__generated__ folders only)
- [x] - Icons moved all gen into `__generated__`
- [x] - css-data generated content moved to `__generated__`
Current solution often fails with
> You cannot publish over the previously published versions
Here I added small script which compares committed version and version
on npm and publish if do not match.
All scripts are run by turbo. So publishing new package is just changing
package script now.
Our designer bundle heavily bloated with not analyzable commonjs
generated by typescript.
The biggest problem comes from bundled icons library which esbuild
cannot tree shake because of cjs.
Another issue is broken code splitting. Packages in one piece are appear
in chunks and always loaded even with dynamic import and React.lazy.
To solve this I migrated each package to native node es modules.
Storybook and jest work almost without changes. Though it's not possible
to run remix in esm project (while still esm packages can be bundled for
ssr). And as a result designer jest failed because of cjs tests requires
from esm packages. As a solution I generated additional commonjs
artifacts in lib/cjs.
du -ck public/build
2336
1736
Here "include" often have list of extensions and forgotten .tsx so such
modules are left unchecked. Replaced with just "src" which consider all
typescript extensions.
Ideally stop using tsc to build artifacts, switch to esbuild and remove
complex configuration from all tsconfig.json.
Bogdan Chadkin
