`;
- }
-
- // See https://github.com/eslint/eslint.org/blob/29e1d8a000592245e4a30c1996e794643e9b263a/src/playground/App.js#L91-L105
- const state = encodeToBase64(
- JSON.stringify({
- options: languageOptions ? { languageOptions } : void 0,
- text: code
- })
- );
- const prefix = process.env.CONTEXT && process.env.CONTEXT !== "deploy-preview"
- ? ""
- : "https://eslint.org";
-
- return `
+ }
+
+ /**
+ * Encodes text in the base 64 format used in playground URL params.
+ * @param {string} text Text to be encoded to base 64.
+ * @see https://github.com/eslint/eslint.org/blob/1b2f2aabeac2955a076d61788da8a0008bca6fb6/src/playground/utils/unicode.js
+ * @returns {string} The base 64 encoded equivalent of the text.
+ */
+ function encodeToBase64(text) {
+ return btoa(unescape(encodeURIComponent(text)));
+ }
+
+ // markdown-it plugin options for playground-linked code blocks in rule examples.
+ const ruleExampleOptions = markdownItRuleExample({
+ open({ type, code, languageOptions, env, codeBlockToken }) {
+ const isTypeScriptCode =
+ codeBlockToken.info === "ts" || codeBlockToken.info === "tsx";
+
+ prismESLintHook.addContentMustBeMarked(
+ codeBlockToken.content,
+ isTypeScriptCode
+ ? { ...languageOptions, parser: typescriptESLintParser }
+ : languageOptions,
+ );
+
+ const isRuleRemoved = !Object.hasOwn(env.rules_meta, env.title);
+
+ /*
+ * TypeScript isn't yet supported on the playground:
+ * https://github.com/eslint/eslint.org/issues/709
+ */
+ if (isRuleRemoved || isTypeScriptCode) {
+ return `
`;
+ }
+
+ // See https://github.com/eslint/eslint.org/blob/29e1d8a000592245e4a30c1996e794643e9b263a/src/playground/App.js#L91-L105
+ const state = encodeToBase64(
+ JSON.stringify({
+ options: languageOptions ? { languageOptions } : void 0,
+ text: code,
+ }),
+ );
+ const prefix =
+ process.env.CONTEXT && process.env.CONTEXT !== "deploy-preview"
+ ? ""
+ : "https://eslint.org";
+
+ return `
";
- }
- });
-
- const md = markdownIt({ html: true, linkify: true, typographer: true, highlight: (str, lang) => highlighter(md, str, lang) })
- .use(markdownItAnchor, {
- slugify: s => slug(s)
- })
- .use(markdownItContainer, "img-container", {})
- .use(markdownItContainer, "rule-example", ruleExampleOptions)
- .use(markdownItContainer, "warning", {
- render(tokens, idx) {
- return generateAlertMarkup("warning", tokens, idx);
- }
- })
- .use(markdownItContainer, "tip", {
- render(tokens, idx) {
- return generateAlertMarkup("tip", tokens, idx);
- }
- })
- .use(markdownItContainer, "important", {
- render(tokens, idx) {
- return generateAlertMarkup("important", tokens, idx);
- }
- })
- .use(lineNumberPlugin)
- .disable("code");
-
- eleventyConfig.setLibrary("md", md);
-
- //------------------------------------------------------------------------------
- // Shortcodes
- //------------------------------------------------------------------------------
-
- eleventyConfig.addNunjucksShortcode("link", function(url) {
-
- // eslint-disable-next-line no-invalid-this -- Eleventy API
- const urlData = this.ctx.further_reading_links[url];
-
- if (!urlData) {
- throw new Error(`Data missing for ${url}`);
- }
-
- const {
- domain,
- title,
- logo
- } = urlData;
-
- return `
+ },
+ close() {
+ return "
";
+ },
+ });
+
+ const md = markdownIt({
+ html: true,
+ linkify: true,
+ typographer: true,
+ highlight: (str, lang) => highlighter(md, str, lang),
+ })
+ .use(markdownItAnchor, {
+ slugify: s => slug(s),
+ })
+ .use(markdownItContainer, "img-container", {})
+ .use(markdownItContainer, "rule-example", ruleExampleOptions)
+ .use(markdownItContainer, "warning", {
+ render(tokens, idx) {
+ return generateAlertMarkup("warning", tokens, idx);
+ },
+ })
+ .use(markdownItContainer, "tip", {
+ render(tokens, idx) {
+ return generateAlertMarkup("tip", tokens, idx);
+ },
+ })
+ .use(markdownItContainer, "important", {
+ render(tokens, idx) {
+ return generateAlertMarkup("important", tokens, idx);
+ },
+ })
+ .use(lineNumberPlugin)
+ .use(preWrapperPlugin)
+ .disable("code");
+
+ eleventyConfig.setLibrary("md", md);
+
+ //------------------------------------------------------------------------------
+ // Shortcodes
+ //------------------------------------------------------------------------------
+
+ eleventyConfig.addNunjucksShortcode("link", function (url) {
+ // eslint-disable-next-line no-invalid-this -- Eleventy API
+ const urlData = this.ctx.further_reading_links[url];
+
+ if (!urlData) {
+ throw new Error(`Data missing for ${url}`);
+ }
+
+ const { domain, title, logo } = urlData;
+
+ return `
@@ -290,38 +310,47 @@ module.exports = function(eleventyConfig) {
`;
- });
+ });
- eleventyConfig.addShortcode("fixable", () => `
+ eleventyConfig.addShortcode(
+ "fixable",
+ () => `
đ§ Fixable
if some problems reported by the rule are automatically fixable by the --fix command line option
-
`);
+
`,
+ );
- eleventyConfig.addShortcode("recommended", () => `
+ eleventyConfig.addShortcode(
+ "recommended",
+ () => `
â
Recommended
if the "extends": "eslint:recommended" property in a configuration file enables the rule.
-
`);
+ 
