Change between markup and stylesheets emmets based on context

[pedro757]

A cool feature will be to change between markup and stylesheets emmets based on cursor context, this is a nice feature, specially in filetypes like jsx tsx wherein both kinds of emmets are used.

For example:

import React from 'react';
import styled from 'styled-components'

const Button = styled.button`
  border: 2px solid;
  margin: 0 1em;
`
//  TYPING p10 DOES NOT WORK 

const Home = () => {
  return (
    <>
      <div>hola</div>
      {/*  TYPING (table>tr*3) WORKS  */}
    </>
  );
};

export default Home;

I don't know how to achieve this, maybe treesitter? Any ideas?

[wochap]

FYI, here's an example of how to get the filetype from the cursor position with treesitter:

https://github.com/L3MON4D3/LuaSnip/blob/f813c0ae944bcaa5630d1c5cb172009a392cb921/lua/luasnip/extras/filetype_functions.lua#L12

[pedro757]

Wow. Thank you, I've been thinking on this for a while and I had no clue how to deal with it. I'll check that. @wochap

[martinsione]

Maybe this can also be used to avoid having emmet completion across all jsx/tsx files and just have completion on return statments

[pedro757]

Do you have any ideas on this?, the thing is that is Lua and my server is in JavaScript.

@wochap

[wochap]

No 😢,

[fitrh]

Comes across to this issue when thinking about this feature

I think this kind of feature can be delegated to a dedicated plugin, e.g. emmet.nvim for neovim, so the focus of this repository is to enhance emmet as an LSP