/, true],\r\n // custom elements with hyphens\r\n [/^\u003C\\w+\\-/, />/, true],\r\n]\r\n```\r\n\r\nThe intent here is to mark the opening and closing of scope for a component but as you can see from the RegEx it is only looking for inline components not block components!\r\n\r\nFor example, the component `p-table` has several named slots which help it to render the way the user intends:\r\n\r\n```html\r\n\u003Cp-table>\r\n \r\n \u003Ctemplate #name=\"{ row }\">\r\n {{ row.name }}\r\n \u003C/template>\r\n\r\n \u003Ctemplate #age=\"{ row }\">\r\n {{ row.age }}\r\n \u003C/template>\r\n\r\n\u003C/p-table>\r\n```\r\n\r\nPut this into the template section of a Vue CLI app and it works just fine. Put it into Vuepress or Vitepress and watch the cloud of smoke start to rise as it fumbles around; particularly failing on the `#` symbols used as shorthand for named slots. This is particularly troublesome for a documentation site that is trying to document a set of VueJS components! There should be a way to ensure that this VueJS component's interior scope is left untouched by **Markdown-it** ... at least when that's what you want. \r\n\r\nThere is a second use-case that I would expect Vitepress to just handle and that is _kind of_ what it's doing today but in a hit and miss fashion currently. Let's say that I just have a default slot in my component and therefore I want my component to be seen by the Markdown engine as being an \"inline\" component and process the interior as markdown. Great, then the following should work:\r\n\r\n```md\r\n\u003Csuper-sexy>\r\n# some heading\r\n## some sub heading\r\n\u003C/super-sexy>\r\n```\r\n\r\nThis would just provide some HTML wrapper elements that would in this case make this very dull markdown sexy.\r\n\r\nFinally there is a third use-case that really should be considered required too ... this is the hybrid but it will allow for all sorts of simple but useful documentation components. The use-case presents as a component that exposes named slots -- and therefore is seen by Markdown as a block component -- but these named slots _are_ processed by markdown. An obvious example might be a `\u003Ctwo-columns>` component which provides a `left` and `right` slot and allows authors to more readily leverage their horizontal space.\r\n\r\nImagine the following:\r\n\r\n```html\r\n\u003Ctwo-columns>\r\n\r\n \u003Ctemplate #left>\r\n I'm a lumberjack and I'm ok\r\n \u003C/template>\r\n \u003Ctemplate #right>\r\n I sleep all night and I work all day\r\n \u003C/template>\r\n\r\n\u003C/two-columns>\r\n```\r\n \r\nThis will fail miserably today but it _could_ be grand!\r\n\r\n** Proposed Solution **\r\n\r\nRework the `src/node/markdown/plugins/components.ts` file in Vitepress (same change can be applied to Vuepress) to:\r\n\r\n- use more sophisticated RegEx patterns to actually capture BLOCK content not just inline components\r\n- support two modes of processing for BLOCK VueJS components: \r\n\r\n 1. Isolated - the interior scope is _not_ processed as markdown and all registered VueJS components can operate exactly like they would normally do\r\n 2. Parsed - the interior scope is processed as markdown; this will work well for default slots where the interior content is Markdown content\r\n\r\n- the Isolated mode should be seen as the _default_ as it is more powerful and allows components that work outside the context of Vitepress/Vuepress to just work here as well\r\n- the parsed mode may be popular for components designed strictly for Vitepress and Vuepress and it could be opted into in the HTML template like so:\r\n\r\n ```html\r\n \u003Cmy-crazy-idea parsed>There I was, _there I was_, in the Congo\u003C/my-crazy-idea>\r\n ```\r\n\r\nThis solution so far could pretty easily support the first two use cases which is a big step forward. The third use-case would certainly be nice but would need a bit more thought. I could imagine something as simple as adding the `md` prop to the parent component being used as a means to pass in the Markdownit object into the top-level component so it could chain the rendering into the various named slots:\r\n\r\n ```html\r\n \u003Cmy-crazy-idea md>\r\n \u003Ctemplate #left>\r\n There I was, _there I was_, \r\n \u003Ctemplate #right>\r\n I sleep all night and I work all day\r\n \u003C/template>\r\n \u003C/my-crazy-idea>\r\n ```\r\n\r\nIn all likelihood this last option should be done as an optional second step.\r\n",[],135,"Proper processing of Vue Component slot content","2023-01-21T14:28:50Z","https://github.com/vuejs/vitepress/issues/135",0.6975581,{"description":3103,"labels":3104,"number":3106,"owner":3026,"repository":3027,"state":3049,"title":3107,"updated_at":3108,"url":3109,"score":3110},"### Describe the bug\n\nIf i use backticks (`) within a table in Markdown, it can cause issues with the rendering of the table.\r\n\r\n\r\n\r\nMy Real markdown is \r\n\r\n\r\n\r\n\n\n### Reproduction\n\n[1.0.0-rc.36](https://github.com/vuejs/vitepress/compare/v1.0.0-rc.35...v1.0.0-rc.36) (2024-1-8)\n\n### Expected behavior\n\nHopefully this issue will be resolved soon\n\n### System Info\n\n```Text\n❯ npx envinfo --system --npmPackages vitepress --binaries --browsers\r\nNeed to install the following packages:\r\nenvinfo@7.11.0\r\nOk to proceed? (y)\r\n\r\n System:\r\n OS: Windows 11 10.0.22631\r\n CPU: (24) x64 AMD Ryzen 9 5900X 12-Core Processor\r\n Memory: 60.85 GB / 95.92 GB\r\n Binaries:\r\n Node: 20.9.0 - ~\\AppData\\Local\\Volta\\tools\\image\\node\\20.9.0\\node.EXE\r\n npm: 10.2.5 - ~\\AppData\\Local\\Volta\\tools\\image\\npm\\10.2.5\\bin\\npm.CMD\r\n pnpm: 8.10.5 - C:\\Program Files\\Volta\\pnpm.EXE\r\n Browsers:\r\n Edge: Chromium (120.0.2210.121)\r\n Internet Explorer: 11.0.22621.1\r\n npmPackages:\r\n vitepress: ^1.0.0-rc.36 => 1.0.0-rc.36\n```\n\n\n### Additional context\n\nno\n\n### Validations\n\n- [X] Check if you're on the [latest VitePress version](https://github.com/vuejs/vitepress/releases/latest).\n- [X] Follow our [Code of Conduct](https://vuejs.org/about/coc.html)\n- [X] Read the [docs](https://vitepress.dev).\n- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.",[3105],{"name":3020,"color":3021},3438,"If i use backticks (`) within a table in Markdown, it can cause issues with the rendering of the table.","2024-01-20T00:04:39Z","https://github.com/vuejs/vitepress/issues/3438",0.6977842,{"description":3112,"labels":3113,"number":3115,"owner":3026,"repository":3027,"state":3049,"title":3116,"updated_at":3117,"url":3118,"score":3119},"### Describe the bug\r\n\r\nI tried writing this table:\r\n\r\n```\r\n| Form | Meaning\r\n|---------------------------------|----------------------------\r\n| `#[builder(with = |...| expr)]` | Custom *infallible* closure\r\n```\r\n\r\nand this was rendered:\r\n\r\n\r\n\r\n\r\nI assume the `|` inside of backticks is invalidly interpreted as the termination of the cell.\r\n\r\n### Validations\r\n\r\n- [X] Check if you're on the [latest VitePress version](https://github.com/vuejs/vitepress/releases/latest).\r\n- [X] Follow our [Code of Conduct](https://vuejs.org/about/coc.html)\r\n- [X] Read the [docs](https://vitepress.dev).\r\n- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.",[3114],{"name":3037,"color":3038},4338,"Invalid parsing of `|` under the backticks in markdown tables","2024-11-11T04:43:12Z","https://github.com/vuejs/vitepress/issues/4338",0.7010959,["Reactive",3121],{},["Set"],["ShallowReactive",3124],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$f-CHR0sNTpLoE5HkWxgfx0RdBBaVee-1ot2cnaoc2crQ":-1},"/vuejs/vitepress/4836"]