Files
webstudio/packages/jsx-utils
Bogdan Chadkin a15bbc9eb4 feat: show all expression errors with linter (#4251)
Here show expression linter errors with code mirror lint and made lint
tooltip same as our error tooltip.

Also upgraded code mirror and acorn

![Screenshot 2024-10-08 at 14 36
49](https://github.com/user-attachments/assets/38c84fb0-7c1a-4dcc-a6ca-d8fea1db9f05)


![image](https://github.com/user-attachments/assets/65399e56-7139-4146-82a4-f0207552bc33)
2024-10-08 16:24:36 +03:00
..
2023-10-06 09:07:59 +02:00
2023-10-01 12:17:43 +02:00
2023-10-01 12:17:43 +02:00
2023-10-01 12:17:43 +02:00
2023-10-01 12:17:43 +02:00

JSX Utils

Utilities to work with JSX, including converting it to Webstudio format.

Usage

Install the package

pnpm i @webstudio-is/jsx-utils

Transform a JSX string to Webstudio Embed Template:

import { jsxToWSEmbedTemplate } from "@webstudio-is/jsx-utils";

await jsxToWSEmbedTemplate("<Box>hello</Box>");

Other utils:

  • traverseTemplate and traverseTemplateAsync to traverse a WsEmbedTemplate and work with nodes
  • tailwindToWebstudio converts a template className prop to Webstudio local styles
  • heroiconsToSvgEmbed converts <HeroIcon name="iconName" type="solid"> to HtmlEmbed with inline SVG