@af-mobile/eslint-plugin 2.0.0

package/rules/prefer-component.js

@@ -0,0 +1,58 @@
+// L2-6 aiflow/prefer-component（warn）
+// 检测：(a) .toast class + setTimeout / (b) .sheet class vs <af-action-sheet> / (c) .list class + scroll 监听
+import { extractAllClassLists } from '../utils/helpers.js';
+
+export default {
+  meta: {
+    type: 'suggestion',
+    docs: { description: '建议使用 L3 组件替代手动实现' },
+    schema: [],
+    messages: {
+      toast: "Manual .toast + setTimeout detected, prefer <af-toast> for singleton queue / auto-dismiss / aria-live",
+      sheet: "Manual .sheet class detected, prefer <af-action-sheet> for touch-friendly bottom sheet / gesture dismiss",
+      list: "Manual .list + scroll listener detected, prefer <af-list> for virtual scroll / pull refresh / load more",
+    },
+  },
+  create(context) {
+    const filename = context.filename || context.getFilename();
+    // 组件源码自身实现不适用此规则（避免 af-list.js 报"prefer <af-list>"的自指误报）
+    if (/src[\\/](?:charts[\\/])?components[\\/].*\.js$/.test(filename)) return {};
+    const sourceCode = context.sourceCode || context.getSourceCode();
+    let hasToast = false, hasSheet = false, hasList = false;
+    let hasSetTimeout = false, hasScrollListener = false;
+
+    function scan(str) {
+      for (const { classes } of extractAllClassLists(str)) {
+        if (classes.includes('toast')) hasToast = true;
+        if (classes.includes('sheet')) hasSheet = true;
+        if (classes.includes('list')) hasList = true;
+      }
+    }
+
+    return {
+      Literal(node) { if (typeof node.value === 'string') scan(node.value); },
+      TemplateElement(node) { if (node.value?.raw) scan(node.value.raw); },
+      CallExpression(node) {
+        // setTimeout 检测
+        const callee = node.callee;
+        if (callee.type === 'Identifier' && callee.name === 'setTimeout') hasSetTimeout = true;
+        // addEventListener('scroll', ...) 检测
+        if (callee.type === 'MemberExpression' && callee.property?.name === 'addEventListener') {
+          const arg = node.arguments[0];
+          if (arg?.value === 'scroll') hasScrollListener = true;
+        }
+      },
+      'Program:exit'() {
+        if (hasToast && hasSetTimeout) {
+          context.report({ loc: { line: 1, column: 0 }, messageId: 'toast' });
+        }
+        if (hasSheet) {
+          context.report({ loc: { line: 1, column: 0 }, messageId: 'sheet' });
+        }
+        if (hasList && hasScrollListener) {
+          context.report({ loc: { line: 1, column: 0 }, messageId: 'list' });
+        }
+      },
+    };
+  },
+};

package/rules/token-whitelist.js

@@ -0,0 +1,78 @@
+// L2-1 aiflow/token-whitelist（error）
+// 检测：class="" 中的 class / 自定义元素 tagName → 与 whitelist + extraClass/extraComponents 对比
+import { ALL_CLASSES, ALL_COMPONENTS, extractAllClassLists, extractCustomElements } from '../utils/helpers.js';
+
+export default {
+  meta: {
+    type: 'problem',
+    docs: { description: 'class 名和自定义元素必须在白名单内' },
+    schema: [{
+      type: 'object',
+      properties: {
+        extraClass: { type: 'array', items: { type: 'string' } },
+        extraComponents: { type: 'array', items: { type: 'string' } },
+      },
+      additionalProperties: false,
+    }],
+    messages: {
+      unknownClass: "Class '{{name}}' not in whitelist. Use recipe/atomic or register in 'aiflow/token-whitelist' rule's extraClass",
+      unknownComponent: "Component '{{name}}' not in whitelist. Register in 'aiflow/token-whitelist' rule's extraComponents",
+    },
+  },
+  create(context) {
+    const options = context.options[0] || {};
+    const allowClass = new Set([...ALL_CLASSES, ...(options.extraClass || [])]);
+    const allowComp = new Set([...ALL_COMPONENTS, ...(options.extraComponents || [])]);
+
+    function checkString(str, node) {
+      // class 检查
+      for (const { classes } of extractAllClassLists(str)) {
+        for (const cls of classes) {
+          if (!allowClass.has(cls)) {
+            context.report({ node, messageId: 'unknownClass', data: { name: cls } });
+          }
+        }
+      }
+      // 自定义元素检查
+      for (const tag of extractCustomElements(str)) {
+        if (!allowComp.has(tag)) {
+          context.report({ node, messageId: 'unknownComponent', data: { name: tag } });
+        }
+      }
+    }
+
+    return {
+      Literal(node) { if (typeof node.value === 'string') checkString(node.value, node); },
+      TemplateElement(node) { if (node.value?.raw) checkString(node.value.raw, node); },
+      // 检测 classList.add/remove/toggle 的字符串参数（绕过 class="..." 字面量检测）
+      CallExpression(node) {
+        const callee = node.callee;
+        if (callee?.type !== 'MemberExpression') return;
+        if (callee.object?.type !== 'MemberExpression') return;
+        if (callee.object.property?.name !== 'classList') return;
+        const method = callee.property?.name;
+        if (!['add', 'remove', 'toggle'].includes(method)) return;
+        for (const arg of node.arguments) {
+          if (arg.type === 'Literal' && typeof arg.value === 'string') {
+            for (const cls of arg.value.split(/\s+/).filter(Boolean)) {
+              if (!allowClass.has(cls)) {
+                context.report({ node: arg, messageId: 'unknownClass', data: { name: cls } });
+              }
+            }
+          }
+          if (arg.type === 'ArrayExpression') {
+            for (const el of arg.elements) {
+              if (el?.type === 'Literal' && typeof el.value === 'string') {
+                for (const cls of el.value.split(/\s+/).filter(Boolean)) {
+                  if (!allowClass.has(cls)) {
+                    context.report({ node: el, messageId: 'unknownClass', data: { name: cls } });
+                  }
+                }
+              }
+            }
+          }
+        }
+      },
+    };
+  },
+};

package/rules/wc-aria-required.js

@@ -0,0 +1,60 @@
+// L3-5 aiflow/wc-aria-required（error）
+// 检测：组件 render 输出的 DOM 缺少必需的 ARIA 角色/属性
+import { readFileSync } from 'node:fs';
+import { fileURLToPath } from 'node:url';
+import { resolve, dirname } from 'node:path';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const ariaPath = resolve(__dirname, '../utils/aria-requirements.json');
+const ARIA_REQ = JSON.parse(readFileSync(ariaPath, 'utf8'));
+
+export default {
+  meta: {
+    type: 'problem',
+    docs: { description: '组件必须包含声明的必需 ARIA 角色/属性' },
+    schema: [],
+    messages: {
+      missingRole: "af-{{comp}} missing role=\"{{role}}\"; required by WAI-ARIA, see aria-requirements.json",
+      missingAriaLabel: "af-{{comp}} missing aria-label; required for screen reader accessibility",
+      missingAriaLive: "af-{{comp}} missing aria-live; required for dynamic content announcements",
+      missingAriaChecked: "af-{{comp}} missing aria-checked; required for switch/checkbox state",
+    },
+  },
+  create(context) {
+    const filename = context.filename || context.getFilename();
+    if (!/src[\\/](?:charts[\\/])?components[\\/].*\.js$/.test(filename)) return {};
+
+    // 从文件名提取组件名（af-xxx.js → af-xxx）
+    const m = filename.match(/(af-[a-z-]+)\.js$/);
+    if (!m) return {};
+    const compName = m[1];
+    const req = ARIA_REQ[compName];
+    if (!req) return {};
+
+    const sourceCode = context.sourceCode || context.getSourceCode();
+
+    return {
+      'Program:exit'() {
+        const source = sourceCode.getText();
+        // 识别两种形式：(a) 字面量 role="xxx" (b) setAttribute('role', 'xxx')
+        const hasRole = (r) =>
+          source.includes(`role="${r}"`) ||
+          source.includes(`role='${r}'`) ||
+          source.includes(`setAttribute('role', '${r}')`) ||
+          source.includes(`setAttribute("role", "${r}")`);
+        if (req.role && !hasRole(req.role)) {
+          context.report({ loc: { line: 1, column: 0 }, messageId: 'missingRole', data: { comp: compName, role: req.role } });
+        }
+        if (req.ariaLabel && !source.includes('aria-label') && !source.includes("ariaLabel")) {
+          context.report({ loc: { line: 1, column: 0 }, messageId: 'missingAriaLabel', data: { comp: compName } });
+        }
+        if (req.ariaLive && !source.includes('aria-live') && !source.includes("ariaLive")) {
+          context.report({ loc: { line: 1, column: 0 }, messageId: 'missingAriaLive', data: { comp: compName } });
+        }
+        if (req.ariaChecked && !source.includes('aria-checked') && !source.includes("ariaChecked")) {
+          context.report({ loc: { line: 1, column: 0 }, messageId: 'missingAriaChecked', data: { comp: compName } });
+        }
+      },
+    };
+  },
+};

package/rules/wc-block-no-internal-ref.js

@@ -0,0 +1,59 @@
+// L3.5 aiflow/wc-block-no-internal-ref（error）
+// 检测：消费端代码（非 src/）禁止穿透 Block 边界访问内部
+// 反例：querySelector('af-auth-form > div') / blockInstance.shadowRoot.querySelector(...)
+// 正例：document.querySelector('af-auth-form').setAttribute('loading', 'true')
+export default {
+  meta: {
+    type: 'problem',
+    docs: { description: '消费端禁止穿透 Block 边界访问内部', fixable: 'manual' },
+    schema: [],
+    messages: {
+      childSelector: "querySelector('{{sel}}') penetrates Block boundary; only root tag selector allowed (e.g. 'af-auth-form')",
+      shadowRoot: "accessing .shadowRoot of Block '{{name}}' is forbidden; use props/events only",
+    },
+  },
+  create(context) {
+    const filename = context.filename || context.getFilename();
+    // 非消费端放行：库源码/单元测试/构建脚本
+    if (/src[\\/]|test[\\/]|scripts[\\/]/.test(filename)) return {};
+
+    // af-* 标签选择器（含子代/后代穿透）：af-xxx > 或 af-xxx 空格 后跟其他选择器
+    const PENETRATE_RE = /af-[a-z]+(?:[>+~]|\s+[^,)\]]+)/;
+
+    return {
+      CallExpression(node) {
+        const callee = node.callee;
+        // 匹配 xxx.querySelector(...) / querySelectorAll(...)
+        if (callee.type !== 'MemberExpression') return;
+        const propName = callee.property?.name;
+        if (propName !== 'querySelector' && propName !== 'querySelectorAll') return;
+
+        const selArg = node.arguments[0];
+        if (!selArg) return;
+        let sel = '';
+        if (selArg.type === 'Literal' && typeof selArg.value === 'string') sel = selArg.value;
+        else if (selArg.type === 'TemplateLiteral' && selArg.quasis.length === 1) sel = selArg.quasis[0].value.raw;
+
+        // 穿透检测：af-xxx > div / af-xxx div / af-xxx > .foo
+        if (sel && PENETRATE_RE.test(sel)) {
+          context.report({ node: selArg, messageId: 'childSelector', data: { sel } });
+        }
+      },
+      // 检测 blockInstance.shadowRoot 访问
+      MemberExpression(node) {
+        // 形如 xxx.shadowRoot
+        if (node.property?.type === 'Identifier' && node.property.name === 'shadowRoot') {
+          // 只对 af-* 开头的变量名报错（近似 Block 实例）
+          const obj = node.object;
+          let name = '';
+          if (obj.type === 'Identifier') name = obj.name;
+          else if (obj.type === 'MemberExpression' && obj.property?.name) name = obj.property.name;
+          // 启发式：变量名含 af 或块名关键词视为 Block 实例
+          if (/af|block|form|grid|card|list/i.test(name)) {
+            context.report({ node: node.property, messageId: 'shadowRoot', data: { name } });
+          }
+        }
+      },
+    };
+  },
+};

package/rules/wc-block-props-count.js

@@ -0,0 +1,48 @@
+// L3.5 aiflow/wc-block-props-count（error）
+// 检测：Block 类的 AfElement.defineProp 调用数必须在 2-5 之间
+// 适用：src/blocks/**/*.js
+export default {
+  meta: {
+    type: 'problem',
+    docs: { description: 'Block props 数必须在 2-5' },
+    schema: [],
+    messages: {
+      tooFew: "Block '{{name}}' has {{n}} prop(s); minimum is 2 (合并到现有 Block 或补充必要 props)",
+      tooMany: "Block '{{name}}' has {{n}} props; maximum is 5 (拆分为多个 Block)",
+    },
+  },
+  create(context) {
+    const filename = context.filename || context.getFilename();
+    if (!/src[\\/]blocks[\\/].*\.js$/.test(filename)) return {};
+
+    const MIN = 2, MAX = 5;
+    let definePropCalls = 0;
+    let className = 'unknown';
+
+    return {
+      ClassDeclaration(node) {
+        if (node.id?.name) className = node.id.name;
+      },
+      CallExpression(node) {
+        // 匹配 AfElement.defineProp(...) 或 this.constructor.defineProp(...)
+        const callee = node.callee;
+        const isDefineProp =
+          (callee.type === 'MemberExpression' &&
+           callee.property?.type === 'Identifier' &&
+           callee.property.name === 'defineProp') ||
+          (callee.type === 'MemberExpression' &&
+           callee.object?.type === 'MemberExpression' &&
+           callee.object.property?.name === 'constructor' &&
+           callee.property?.name === 'defineProp');
+        if (isDefineProp) definePropCalls++;
+      },
+      'Program:exit'() {
+        if (definePropCalls > 0 && definePropCalls < MIN) {
+          context.report({ loc: { line: 1, column: 0 }, messageId: 'tooFew', data: { name: className, n: definePropCalls } });
+        } else if (definePropCalls > MAX) {
+          context.report({ loc: { line: 1, column: 0 }, messageId: 'tooMany', data: { name: className, n: definePropCalls } });
+        }
+      },
+    };
+  },
+};

package/rules/wc-block-states.js

@@ -0,0 +1,64 @@
+// L3.5 aiflow/wc-block-states（error）
+// 检测：Block 类的 mounted/render/_render 方法必须包含 loading/error/empty 分支
+// 五态：idle（默认）/ loading / error / empty / success
+// 检测策略：源码文本扫描，找 loading / error / empty 三个关键词至少各出现一次（在条件分支中）
+// 适用：src/blocks/**/*.js
+export default {
+  meta: {
+    type: 'problem',
+    docs: { description: 'Block 必须实现 loading/error/empty 三态分支' },
+    schema: [],
+    messages: {
+      missing: "Block '{{name}}' missing state '{{state}}'; must implement loading/error/empty branches in render",
+    },
+  },
+  create(context) {
+    const filename = context.filename || context.getFilename();
+    if (!/src[\\/]blocks[\\/].*\.js$/.test(filename)) return {};
+
+    const REQUIRED = ['loading', 'error', 'empty'];
+    const found = new Set();
+    let className = 'unknown';
+
+    return {
+      ClassDeclaration(node) {
+        if (node.id?.name) className = node.id.name;
+      },
+      // 检测 this.loading / this._error / this._data?.length（empty 分支）
+      // 检测 if (this.loading) / if (this._error) / if (!this._data?.length)
+      MemberExpression(node) {
+        const propName = node.property?.name;
+        if (propName === 'loading') found.add('loading');
+        if (propName === '_error' || propName === 'error') found.add('error');
+      },
+      // 检测字符串中的 loading/error/empty（模板、注释、class 名）
+      Literal(node) {
+        if (typeof node.value === 'string' && /(loading|error|empty)/.test(node.value)) {
+          for (const s of REQUIRED) {
+            if (node.value.includes(s)) found.add(s);
+          }
+        }
+      },
+      TemplateElement(node) {
+        const raw = node.value?.raw || '';
+        for (const s of REQUIRED) {
+          if (raw.includes(s)) found.add(s);
+        }
+      },
+      Identifier(node) {
+        // _renderLoading / _renderError / _renderEmpty 方法名
+        const name = node.name || '';
+        if (/loading/i.test(name)) found.add('loading');
+        if (/error/i.test(name)) found.add('error');
+        if (/empty/i.test(name)) found.add('empty');
+      },
+      'Program:exit'() {
+        for (const s of REQUIRED) {
+          if (!found.has(s)) {
+            context.report({ loc: { line: 1, column: 0 }, messageId: 'missing', data: { name: className, state: s } });
+          }
+        }
+      },
+    };
+  },
+};

package/rules/wc-block-variant-enum.js

@@ -0,0 +1,74 @@
+// L3.5 aiflow/wc-block-variant-enum（warn）
+// 检测：Block 类的 variant 属性必须在 defineProp 时声明枚举值，或在 onAttributeChange 中校验
+// 策略：检测 defineProp(proto, 'variant', { ... }) 调用，检查是否有 enum / values / 一行注释枚举
+// 或：onAttributeChange 内有 variant 的 if/switch 校验
+// 适用：src/blocks/**/*.js
+export default {
+  meta: {
+    type: 'suggestion',
+    docs: { description: 'variant 属性必须限制枚举值' },
+    schema: [],
+    messages: {
+      noEnum: "Block variant property has no enum constraint; declare allowed values via comment or validate in onAttributeChange",
+    },
+  },
+  create(context) {
+    const filename = context.filename || context.getFilename();
+    if (!/src[\\/]blocks[\\/].*\.js$/.test(filename)) return {};
+
+    const sourceCode = context.sourceCode || context.getSourceCode();
+    const source = sourceCode.getText();
+    let hasVariantProp = false;
+    let variantEnumDeclared = false;
+
+    return {
+      CallExpression(node) {
+        const callee = node.callee;
+        if (callee.type !== 'MemberExpression' || callee.property?.name !== 'defineProp') return;
+        const arg = node.arguments[1];
+        if (arg?.type !== 'Literal' || arg.value !== 'variant') return;
+        hasVariantProp = true;
+
+        // 检查 defineProp 第三参数是否有 enum/values 字段
+        const optsArg = node.arguments[2];
+        if (optsArg?.type === 'ObjectExpression') {
+          for (const prop of optsArg.properties) {
+            if (prop.type === 'Property' && (prop.key?.name === 'enum' || prop.key?.name === 'values')) {
+              variantEnumDeclared = true;
+              return;
+            }
+          }
+        }
+        // 检查上方注释是否含枚举值（// variant: phone-code / password / sms）
+        const line = node.loc.start.line;
+        const commentLines = [];
+        for (let i = line - 1; i >= 1; i--) {
+          const l = sourceCode.lines[i - 1];
+          if (l.trim() === '') break;
+          if (/\bvariant\b.*\//.test(l) || /variant\s*:/i.test(l)) {
+            commentLines.push(l);
+            break;
+          }
+          if (l.trim().startsWith('//')) { commentLines.push(l); break; }
+          break;
+        }
+        if (commentLines.some(l => /variant\s*:?\s*[a-z-]+(\s*\/\s*[a-z-]+)+/i.test(l))) {
+          variantEnumDeclared = true;
+        }
+      },
+      // 检测 onAttributeChange 内是否校验 variant
+      MethodDefinition(node) {
+        if (node.key?.name !== 'onAttributeChange') return;
+        const bodyText = sourceCode.getText(node.value);
+        if (/variant/.test(bodyText) && /(if|switch)/.test(bodyText)) {
+          variantEnumDeclared = true;
+        }
+      },
+      'Program:exit'() {
+        if (hasVariantProp && !variantEnumDeclared) {
+          context.report({ loc: { line: 1, column: 0 }, messageId: 'noEnum' });
+        }
+      },
+    };
+  },
+};

package/rules/wc-cleanup.js

@@ -0,0 +1,75 @@
+// L3-6 aiflow/wc-cleanup（warn）
+// 检测两类资源泄漏（覆盖 src/components 与 src/blocks）：
+// 1) addEventListener 未通过 this._listen() 登记（传 signal 选项的原生自动解绑除外）
+//    —— 基类 disconnectedCallback 统一解绑 _listeners，绕过登记即泄漏
+// 2) IntersectionObserver/ResizeObserver/MutationObserver/setTimeout/setInterval/rAF
+//    在 unmounted() 中无对应清理调用
+const TIMERS = [
+  { name: 'setTimeout', cleanup: 'clearTimeout' },
+  { name: 'setInterval', cleanup: 'clearInterval' },
+  { name: 'requestAnimationFrame', cleanup: 'cancelAnimationFrame' },
+];
+const OBSERVERS = ['IntersectionObserver', 'ResizeObserver', 'MutationObserver'];
+
+export default {
+  meta: {
+    type: 'problem',
+    docs: { description: '组件资源清理：addEventListener 走 _listen，观察器/定时器在 unmounted() 清理' },
+    schema: [],
+    messages: {
+      listen: 'addEventListener 需通过 this._listen(target, type, handler) 登记，由基类在断开时统一解绑（AbortController 场景可传 { signal }）',
+      leak: '{{name}} 需在 unmounted() 中调用 {{cleanup}}，否则潜在内存泄漏',
+    },
+  },
+  create(context) {
+    const filename = context.filename || context.getFilename();
+    // 覆盖 src/components、src/blocks 与 charts 子库 src/charts/components
+    if (!/src[\\/](?:charts[\\/])?(?:components|blocks)[\\/].*\.js$/.test(filename)) return {};
+
+    const sourceCode = context.sourceCode || context.getSourceCode();
+    const leaks = []; // { node, name, cleanup }
+
+    const hasSignal = (args) => args.some((a) => a.type === 'ObjectExpression'
+      && a.properties.some((p) => p.key?.name === 'signal'));
+
+    return {
+      CallExpression(node) {
+        const callee = node.callee;
+        if (callee.type === 'MemberExpression' && callee.property?.name === 'addEventListener') {
+          if (!hasSignal(node.arguments)) context.report({ node, messageId: 'listen' });
+          return;
+        }
+        if (callee.type === 'Identifier') {
+          const p = TIMERS.find((t) => t.name === callee.name);
+          if (p) leaks.push({ node, name: p.name, cleanup: p.cleanup });
+        }
+      },
+      NewExpression(node) {
+        if (OBSERVERS.includes(node.callee?.name)) {
+          leaks.push({ node, name: node.callee.name, cleanup: 'disconnect' });
+        }
+      },
+      'Program:exit'() {
+        // 提取 unmounted() 方法体文本（括号计数，支持任意嵌套）
+        const source = sourceCode.getText();
+        let unmountedBody = '';
+        const startMatch = source.match(/unmounted\s*\(\s*\)\s*\{/);
+        if (startMatch) {
+          let depth = 1;
+          let i = startMatch.index + startMatch[0].length;
+          while (i < source.length && depth > 0) {
+            if (source[i] === '{') depth++;
+            else if (source[i] === '}') depth--;
+            if (depth > 0) unmountedBody += source[i];
+            i++;
+          }
+        }
+        for (const l of leaks) {
+          if (!unmountedBody.includes(l.cleanup)) {
+            context.report({ node: l.node, messageId: 'leak', data: { name: l.name, cleanup: l.cleanup } });
+          }
+        }
+      },
+    };
+  },
+};

package/rules/wc-event-naming.js

@@ -0,0 +1,55 @@
+// L3-4 aiflow/wc-event-naming（error，可自动修）
+// 检测：emit('xxx') 调用名不匹配 /^af-[a-z0-9]+:[a-z]+$/
+const EVENT_RE = /^af-[a-z0-9-]+:[a-z]+$/;
+
+export default {
+  meta: {
+    type: 'problem',
+    docs: { description: '事件名必须匹配 af-{component}:{action} 格式' },
+    schema: [],
+    messages: {
+      naming: "Event name '{{name}}' should match 'af-{component}:{action}' (e.g. 'af-list:loadmore')",
+    },
+    fixable: 'code',
+  },
+  create(context) {
+    return {
+      CallExpression(node) {
+        // 检测 emit('xxx') 或 this.emit('xxx')
+        const callee = node.callee;
+        const isEmit = (callee.type === 'Identifier' && callee.name === 'emit') ||
+                       (callee.type === 'MemberExpression' && callee.property?.name === 'emit');
+        if (!isEmit) return;
+        const arg = node.arguments[0];
+        if (arg?.type !== 'Literal' || typeof arg.value !== 'string') return;
+        const name = arg.value;
+        if (EVENT_RE.test(name)) return;
+        // 自动修：尝试转换为 af-xxx:yyy 格式
+        let fixed = name;
+        // snake_case / camelCase → kebab + colon
+        fixed = fixed.replace(/_/g, '-')
+          .replace(/([a-z])([A-Z])/g, '$1-$2')
+          .toLowerCase();
+        // 如果不含冒号，尝试在组件名后插入冒号
+        if (!fixed.includes(':')) {
+          // 检测 af- 前缀
+          if (fixed.startsWith('af-')) {
+            // 在 af-xxx 后插入 : （xxx 是第一个单词）
+            fixed = fixed.replace(/^af-([a-z0-9]+)/, 'af-$1:');
+          } else {
+            // 无 af- 前缀，添加 af- 前缀 + 冒号
+            fixed = 'af-component:' + fixed;
+          }
+        }
+        context.report({
+          node: arg,
+          messageId: 'naming',
+          data: { name },
+          fix(fixer) {
+            return fixer.replaceText(arg, `'${fixed}'`);
+          },
+        });
+      },
+    };
+  },
+};

package/rules/wc-light-no-style.js

@@ -0,0 +1,87 @@
+// L3-1 aiflow/wc-light-no-style（error）
+// 检测：Light 组件（useShadow=false）中 .style.xxx 赋值 / innerHTML 含 <style> 标签 / innerHTML 含 style="..." 属性
+export default {
+  meta: {
+    type: 'problem',
+    docs: { description: 'Light DOM 组件不能有内联样式，必须用 L2 class' },
+    schema: [],
+    messages: {
+      styleProp: "Light DOM component must use L2 recipe classes only. Custom styles → use Shadow component or recipes.project.css",
+      styleTag: "Light DOM component must not contain <style> tags. Move to Shadow component or recipes.project.css",
+      styleAttr: 'Light DOM component must not contain style="..." attributes in innerHTML. Use L2 recipe/atomic classes instead',
+    },
+  },
+  create(context) {
+    const filename = context.filename || context.getFilename();
+    // 仅检查 src/components/*.js 文件
+    if (!/src[\\/](?:charts[\\/])?components[\\/].*\.js$/.test(filename)) return {};
+
+    const sourceCode = context.sourceCode || context.getSourceCode();
+    const source = sourceCode.getText();
+    // 检测是否为 Light 组件（含 useShadow = false）
+    if (!/useShadow\s*=\s*false/.test(source)) return {};
+
+    // 检测 innerHTML / 模板字符串中的 style="..." 或 style='...' 属性
+    // 例外：style="--xxx:..."（CSS 自定义属性传递，非视觉属性，与 setProperty('--*') 同理）
+    const hasVisualStyleAttr = (str) => {
+      if (!str) return false;
+      // 匹配 style="..." 或 style='...'，且值非 -- 开头（CSS 自定义属性放行）
+      const re = /\bstyle=(["'])([^"']*)\1/gi;
+      let m;
+      while ((m = re.exec(str))) {
+        const val = m[2];
+        // CSS 自定义属性（--xxx）放行：用于主题变量传递
+        if (val.trim().startsWith('--')) continue;
+        // 任何非空 style 属性都违规（视觉属性）
+        if (val.trim()) return true;
+      }
+      return false;
+    };
+
+    return {
+      AssignmentExpression(node) {
+        // .style.xxx = 赋值
+        if (node.left?.type === 'MemberExpression' &&
+            node.left.object?.type === 'MemberExpression' &&
+            node.left.object.property?.name === 'style') {
+          context.report({ node, messageId: 'styleProp' });
+        }
+      },
+      CallExpression(node) {
+        // 检测 x.style.setProperty('prop', ...) 绕过：非 CSS 自定义属性（--*）的视觉属性
+        const callee = node.callee;
+        if (callee?.type !== 'MemberExpression') return;
+        if (callee.object?.type !== 'MemberExpression') return;
+        if (callee.object.property?.name !== 'style') return;
+        if (callee.property?.name !== 'setProperty') return;
+        const propArg = node.arguments?.[0];
+        if (!propArg || propArg.type !== 'Literal' || typeof propArg.value !== 'string') return;
+        // CSS 自定义属性（--*）允许：用于主题变量传递，非视觉属性
+        if (propArg.value.startsWith('--')) return;
+        context.report({ node, messageId: 'styleProp' });
+      },
+      Literal(node) {
+        if (typeof node.value !== 'string') return;
+        // <style> 标签
+        if (/<style[\s>]/i.test(node.value)) {
+          context.report({ node, messageId: 'styleTag' });
+        }
+        // style="..." 属性（视觉属性）
+        if (hasVisualStyleAttr(node.value)) {
+          context.report({ node, messageId: 'styleAttr' });
+        }
+      },
+      TemplateElement(node) {
+        if (!node.value?.raw) return;
+        // <style> 标签
+        if (/<style[\s>]/i.test(node.value.raw)) {
+          context.report({ node, messageId: 'styleTag' });
+        }
+        // style="..." 属性（视觉属性）
+        if (hasVisualStyleAttr(node.value.raw)) {
+          context.report({ node, messageId: 'styleAttr' });
+        }
+      },
+    };
+  },
+};