Can I use polymode for styled components inside tsx or jsx files? For example:
// MyComponent.tsx
const x = 1;
const y = 2;
const myStyle = cssbackground-color: red; padding: ${x + y}; margin-left: ${y};
I want the stuff inside the css block to be in css-mode, except for the interpolated bits, which I want to be in the host mode (ie typescript-mode).
I can get the css bit working sort of like this:
(define-hostmode poly-css-in-ts-hostmode :mode 'typescript-mode)
(define-innermode poly-css-in-ts-innermode
:mode 'css-mode
:head-matcher "css" :tail-matcher ""
:head-mode 'host
:tail-mode 'host
:init-functions)
(define-polymode poly-css-in-ts-mode
:hostmode 'poly-css-in-ts-hostmode
:innermodes '(poly-css-in-ts-innermode))
But I'm not sure how to get the nested ${/* ts or js code */} blocks working.
