@prismicio/editor-ui

editor-ui

radix-ui GOTCHAS

• When passing a React Node as children to a radix primitive that has the asChild prop, you must spread all unused props into that React Node, even if at the type level there doesn't seem to be any remaining props. This is because radix secretly set a lot of extra props on the React Node you gave it. For an example of this, see BaseInput's otherProps. We favor using asChild to reduce the number of DOM nodes and make it easy to size children.

vanilla-extract GOTCHAS

• You can not reference a parent selector that is made of ONLY sprinkles generated classNames. See Field.css.ts -> labelPosition to see a workaround: An empty object is passed to styleVariant which is equivalent to having an empty className generated with style({}).

How to add a new SVG icon

1. Export the SVG icon from Figma. It should always be the variant with a viewbox of 24x24.
2. Move the file to src/icons and rename it with the official Material name: https://fonts.google.com/icons but with a lower camel case name.
3. You can repeat 1. and 2. as many times as needed.
4. Run deno task update-icons (it does not matter where in the monorepo you run this from)
5. Check that your icon is visible in Storybook.