@murky-web/oxlint-plugin-solid 0.0.1

package/src/rules/no_proxy_apis.mjs

@@ -0,0 +1,96 @@
+import { ESLintUtils } from "@typescript-eslint/utils";
+
+import {
+    isFunctionNode,
+    trackImports,
+    isPropsByName,
+    trace,
+} from "../utils.mjs";
+const createRule = ESLintUtils.RuleCreator.withoutDocs;
+export default createRule({
+    meta: {
+        type: "problem",
+        docs: {
+            description:
+                "Disallow usage of APIs that use ES6 Proxies, only to target environments that don't support them.",
+            url: "https://github.com/solidjs-community/eslint-plugin-solid/blob/main/packages/eslint-plugin-solid/docs/no-proxy-apis.md",
+        },
+        schema: [],
+        messages: {
+            noStore:
+                "Solid Store APIs use Proxies, which are incompatible with your target environment.",
+            spreadCall:
+                "Using a function call in JSX spread makes Solid use Proxies, which are incompatible with your target environment.",
+            spreadMember:
+                "Using a property access in JSX spread makes Solid use Proxies, which are incompatible with your target environment.",
+            proxyLiteral:
+                "Proxies are incompatible with your target environment.",
+            mergeProps:
+                "If you pass a function to `mergeProps`, it will create a Proxy, which are incompatible with your target environment.",
+        },
+    },
+    defaultOptions: [],
+    create(context) {
+        const { matchImport, handleImportDeclaration } = trackImports();
+        return {
+            ImportDeclaration(node) {
+                handleImportDeclaration(node); // track import aliases
+                const source = node.source.value;
+                if (source === "solid-js/store") {
+                    context.report({
+                        node,
+                        messageId: "noStore",
+                    });
+                }
+            },
+            "JSXSpreadAttribute MemberExpression"(node) {
+                context.report({ node, messageId: "spreadMember" });
+            },
+            "JSXSpreadAttribute CallExpression"(node) {
+                context.report({ node, messageId: "spreadCall" });
+            },
+            CallExpression(node) {
+                if (node.callee.type === "Identifier") {
+                    if (matchImport("mergeProps", node.callee.name)) {
+                        node.arguments
+                            .filter((arg) => {
+                                if (arg.type === "SpreadElement") return true;
+                                const traced = trace(arg, context);
+                                return (
+                                    (traced.type === "Identifier" &&
+                                        !isPropsByName(traced.name)) ||
+                                    isFunctionNode(traced)
+                                );
+                            })
+                            .forEach((badArg) => {
+                                context.report({
+                                    node: badArg,
+                                    messageId: "mergeProps",
+                                });
+                            });
+                    }
+                } else if (node.callee.type === "MemberExpression") {
+                    if (
+                        node.callee.object.type === "Identifier" &&
+                        node.callee.object.name === "Proxy" &&
+                        node.callee.property.type === "Identifier" &&
+                        node.callee.property.name === "revocable"
+                    ) {
+                        context.report({
+                            node,
+                            messageId: "proxyLiteral",
+                        });
+                    }
+                }
+            },
+            NewExpression(node) {
+                if (
+                    node.callee.type === "Identifier" &&
+                    node.callee.name === "Proxy"
+                ) {
+                    context.report({ node, messageId: "proxyLiteral" });
+                }
+            },
+        };
+    },
+});

package/src/rules/no_react_deps.mjs

@@ -0,0 +1,65 @@
+import { ESLintUtils } from "@typescript-eslint/utils";
+
+import { isFunctionNode, trace, trackImports } from "../utils.mjs";
+const createRule = ESLintUtils.RuleCreator.withoutDocs;
+export default createRule({
+    meta: {
+        type: "problem",
+        docs: {
+            description:
+                "Disallow usage of dependency arrays in `createEffect` and `createMemo`.",
+            url: "https://github.com/solidjs-community/eslint-plugin-solid/blob/main/packages/eslint-plugin-solid/docs/no-react-deps.md",
+        },
+        fixable: "code",
+        schema: [],
+        messages: {
+            noUselessDep:
+                "In Solid, `{{name}}` doesn't accept a dependency array because it automatically tracks its dependencies. If you really need to override the list of dependencies, use `on`.",
+        },
+    },
+    defaultOptions: [],
+    create(context) {
+        /** Tracks imports from 'solid-js', handling aliases. */
+        const { matchImport, handleImportDeclaration } = trackImports();
+        return {
+            ImportDeclaration: handleImportDeclaration,
+            CallExpression(node) {
+                if (
+                    node.callee.type === "Identifier" &&
+                    matchImport(
+                        ["createEffect", "createMemo"],
+                        node.callee.name,
+                    ) &&
+                    node.arguments.length === 2 &&
+                    node.arguments.every((arg) => arg.type !== "SpreadElement")
+                ) {
+                    // grab both arguments, tracing any variables to their actual values if possible
+                    const [arg0, arg1] = node.arguments.map((arg) =>
+                        trace(arg, context),
+                    );
+                    if (
+                        isFunctionNode(arg0) &&
+                        arg0.params.length === 0 &&
+                        arg1.type === "ArrayExpression"
+                    ) {
+                        // A second argument that looks like a dependency array was passed to
+                        // createEffect/createMemo, and the inline function doesn't accept a parameter, so it
+                        // can't just be an initial value.
+                        context.report({
+                            node: node.arguments[1], // if this is a variable, highlight the usage, not the initialization
+                            messageId: "noUselessDep",
+                            data: {
+                                name: node.callee.name,
+                            },
+                            // remove dep array if it's given inline, otherwise don't fix
+                            fix:
+                                arg1 === node.arguments[1]
+                                    ? (fixer) => fixer.remove(arg1)
+                                    : undefined,
+                        });
+                    }
+                }
+            },
+        };
+    },
+});

package/src/rules/no_react_specific_props.mjs

@@ -0,0 +1,71 @@
+import { ESLintUtils } from "@typescript-eslint/utils";
+
+import { isDOMElementName, jsxGetProp, jsxHasProp } from "../utils.mjs";
+
+const createRule = ESLintUtils.RuleCreator.withoutDocs;
+const REACT_SPECIFIC_PROPS = [
+    { from: "className", to: "class" },
+    { from: "htmlFor", to: "for" },
+];
+
+export const noReactSpecificPropsRule = createRule({
+    meta: {
+        docs: {
+            description:
+                "Disallow usage of React-specific className/htmlFor props.",
+            url: "https://github.com/solidjs-community/eslint-plugin-solid/blob/main/packages/eslint-plugin-solid/docs/no-react-specific-props.md",
+        },
+        fixable: "code",
+        messages: {
+            noUselessKey:
+                "Elements in a <For> or <Index> list do not need a key prop.",
+            prefer: "Prefer the `{{ to }}` prop over the deprecated `{{ from }}` prop.",
+        },
+        schema: [],
+        type: "problem",
+    },
+    defaultOptions: [],
+    create(context) {
+        return {
+            JSXOpeningElement(node) {
+                for (const { from, to } of REACT_SPECIFIC_PROPS) {
+                    const attribute = jsxGetProp(node.attributes, from);
+                    if (!attribute) {
+                        continue;
+                    }
+
+                    const fix = !jsxHasProp(node.attributes, to)
+                        ? (fixer) => {
+                              return fixer.replaceText(attribute.name, to);
+                          }
+                        : undefined;
+
+                    context.report({
+                        data: { from, to },
+                        fix,
+                        messageId: "prefer",
+                        node: attribute,
+                    });
+                }
+
+                if (
+                    node.name.type === "JSXIdentifier" &&
+                    isDOMElementName(node.name.name)
+                ) {
+                    const keyProp = jsxGetProp(node.attributes, "key");
+                    if (!keyProp) {
+                        return;
+                    }
+
+                    context.report({
+                        fix(fixer) {
+                            return fixer.remove(keyProp);
+                        },
+                        messageId: "noUselessKey",
+                        node: keyProp,
+                    });
+                }
+            },
+        };
+    },
+});

package/src/rules/no_unknown_namespaces.mjs

@@ -0,0 +1,100 @@
+import { ESLintUtils } from "@typescript-eslint/utils";
+
+import { isDOMElementName } from "../utils.mjs";
+const createRule = ESLintUtils.RuleCreator.withoutDocs;
+const knownNamespaces = ["on", "oncapture", "use", "prop", "attr", "bool"];
+const styleNamespaces = ["style", "class"];
+const otherNamespaces = ["xmlns", "xlink"];
+export default createRule({
+    meta: {
+        type: "problem",
+        docs: {
+            description:
+                "Enforce using only Solid-specific namespaced attribute names (i.e. `'on:'` in `<div on:click={...} />`).",
+            url: "https://github.com/solidjs-community/eslint-plugin-solid/blob/main/packages/eslint-plugin-solid/docs/no-unknown-namespaces.md",
+        },
+        hasSuggestions: true,
+        schema: [
+            {
+                type: "object",
+                properties: {
+                    allowedNamespaces: {
+                        description:
+                            "an array of additional namespace names to allow",
+                        type: "array",
+                        items: {
+                            type: "string",
+                        },
+                        default: [],
+                        minItems: 1,
+                        uniqueItems: true,
+                    },
+                },
+                additionalProperties: false,
+            },
+        ],
+        messages: {
+            unknown: `'{{namespace}}:' is not one of Solid's special prefixes for JSX attributes (${knownNamespaces
+                .map((n) => `'${n}:'`)
+                .join(", ")}).`,
+            style: "Using the '{{namespace}}:' special prefix is potentially confusing, prefer the '{{namespace}}' prop instead.",
+            component: "Namespaced props have no effect on components.",
+            "component-suggest":
+                "Replace {{namespace}}:{{name}} with {{name}}.",
+        },
+    },
+    defaultOptions: [],
+    create(context) {
+        const explicitlyAllowedNamespaces =
+            context.options?.[0]?.allowedNamespaces;
+        return {
+            "JSXAttribute > JSXNamespacedName": (node) => {
+                const openingElement = node.parent.parent;
+                if (
+                    openingElement.name.type === "JSXIdentifier" &&
+                    !isDOMElementName(openingElement.name.name)
+                ) {
+                    // no namespaces on Solid component elements
+                    context.report({
+                        node,
+                        messageId: "component",
+                        suggest: [
+                            {
+                                messageId: "component-suggest",
+                                data: {
+                                    namespace: node.namespace.name,
+                                    name: node.name.name,
+                                },
+                                fix: (fixer) =>
+                                    fixer.replaceText(node, node.name.name),
+                            },
+                        ],
+                    });
+                    return;
+                }
+                const namespace = node.namespace?.name;
+                if (
+                    !(
+                        knownNamespaces.includes(namespace) ||
+                        otherNamespaces.includes(namespace) ||
+                        explicitlyAllowedNamespaces?.includes(namespace)
+                    )
+                ) {
+                    if (styleNamespaces.includes(namespace)) {
+                        context.report({
+                            node,
+                            messageId: "style",
+                            data: { namespace },
+                        });
+                    } else {
+                        context.report({
+                            node,
+                            messageId: "unknown",
+                            data: { namespace },
+                        });
+                    }
+                }
+            },
+        };
+    },
+});