Users are encountering issues with incorrect types when adding custom selector utilities in TypeScript, specifically due to self-referencing types. The request is to make this process easier and ensure correct type inference.
### Discussed in https://github.com/modulz/stitches/discussions/969 <div type='discussions-op-text'> <sup>Originally posted by **joseDaKing** February 24, 2022</sup> Add custom selector utilities in typescript will yield the wrong type. This wont work because of self refercing type ```ts import { createStitches, CSS as BaseCSS } from "@stitches/core"; const stitches = createStitches({ theme: { space: { sm: "16px", md: "32px", lg: "64px" } }, utils: { hover: (styles: CSS) => ({ "@media (hover: hover)": { "&:hover": styles } }) } }); type CSS = BaseCSS<typeof stitches.theme>; ``` The only way to make it work is by using the CSS type without passing in the theme, but the theme tokens won't be typed anymore ```ts import { createStitches, CSS } from "@stitches/core"; const stitches = createStitches({ theme: {