fix: render plugin-supplied labels and package references faithfully

.agents/skills/web-design-guidelines/SKILL.md

@@ -0,0 +1,39 @@
+---
+name: web-design-guidelines
+description: Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".
+metadata:
+  author: vercel
+  version: "1.0.0"
+  argument-hint: <file-or-pattern>
+---
+
+# Web Interface Guidelines
+
+Review files for compliance with Web Interface Guidelines.
+
+## How It Works
+
+1. Fetch the latest guidelines from the source URL below
+2. Read the specified files (or prompt user for files/pattern)
+3. Check against all rules in the fetched guidelines
+4. Output findings in the terse `file:line` format
+
+## Guidelines Source
+
+Fetch fresh guidelines before each review:
+
+```
+https://raw.githubusercontent.com/vercel-labs/web-interface-guidelines/main/command.md
+```
+
+Use WebFetch to retrieve the latest rules. The fetched content contains all the rules and output format instructions.
+
+## Usage
+
+When a user provides a file or pattern argument:
+1. Fetch guidelines from the source URL above
+2. Read the specified files
+3. Apply all rules from the fetched guidelines
+4. Output findings using the format specified in the guidelines
+
+If no files specified, ask the user which files to review.

.claude/skills/web-design-guidelines

@@ -0,0 +1 @@
+../../.agents/skills/web-design-guidelines

skills-lock.json

@@ -0,0 +1,10 @@
+{
+  "version": 1,
+  "skills": {
+    "web-design-guidelines": {
+      "source": "vercel-labs/agent-skills",
+      "sourceType": "github",
+      "computedHash": "a6a44d5498f7e8f68289902f3dedfc6f38ae0cee1e96527c80724cf27f727c2a"
+    }
+  }
+}

xpkgindex/build.py

@@ -108,6 +108,10 @@ def _reverse_deps(packages: List[Package]) -> None:
             if target is not None and target is not pkg:
                 if pkg.identity.slug not in target.required_by:
                     target.required_by.append(pkg.identity.slug)
+                # The same edge, pointing the other way. `required_by` was a
+                # link and `dependencies` was inert text, so a relationship
+                # the site had already resolved was only walkable uphill.
+                pkg.dep_slugs[dep] = target.identity.slug
 
 
 def _apply_default_namespace(packages: List[Package], meta: IndexMeta) -> None:

xpkgindex/models.py

@@ -214,6 +214,9 @@ class Package:
     versions: List[Version] = field(default_factory=list)
     latest: str = ""
     deps: List[str] = field(default_factory=list)
+    # dep string -> slug of the package it resolves to, for deps that name a
+    # package this index carries. Absent for external ones, which stay text.
+    dep_slugs: Dict[str, str] = field(default_factory=dict)
     required_by: List[str] = field(default_factory=list)
 
     facets: Dict[str, str] = field(default_factory=dict)

xpkgindex/templates/_macros.html

@@ -193,7 +193,16 @@
         <thead><tr>{% for h in b.data.get('head', []) %}<th>{{ h | loc }}</th>{% endfor %}</tr></thead>
         <tbody>
         {% for row in b.data.get('rows', []) %}
-          <tr>{% for cell in row %}<td>{{ cell }}</td>{% endfor %}</tr>
+          <tr>{% for cell in row %}<td>
+            {%- if cell is mapping and cell.get('slug') -%}
+            {# A cell may name a package instead of being flat text, so a
+               plugin's own table can point at the pages this index already
+               has. The plugin supplies the slug; the URL is the core's to
+               build, exactly as it is for `required_by`. #}
+            <a href="{{ root }}packages/{{ cell.slug }}/{{ page_suffix }}">{{ cell.get('text', cell.slug) }}</a>
+            {%- elif cell is mapping -%}{{ cell.get('text', '') }}
+            {%- else -%}{{ cell }}{%- endif -%}
+          </td>{% endfor %}</tr>
         {% endfor %}
         </tbody>
       </table>

xpkgindex/templates/package.html

@@ -15,7 +15,10 @@ <h1 class="pkg-name">
         {% if parts[0] %}<span class="ns">{{ parts[0] }}</span>{% endif %}{{ parts[1] }}
       </h1>
       {% if pkg.interface %}
-      <span class="tone-badge">{{ pkg.interface.data.get('label', pkg.tone) }}</span>
+      {# `| loc` like every other consumer-supplied string: a plugin may hand
+         this a per-locale map, and without the filter the map was printed as
+         its Python repr -- `{'en': 'command', 'zh': '命令'}` in the badge. #}
+      <span class="tone-badge">{{ pkg.interface.data.get('label', pkg.tone) | loc }}</span>
       {% endif %}
       {% if pkg.type and pkg.type != 'package' %}<span class="badge">{{ pkg.type }}</span>{% endif %}
     </header>
@@ -116,7 +119,12 @@ <h4>{{ t('pkg.facts') }}</h4>
         <dt>{{ t('pkg.dependencies') }}</dt>
         <dd>
           {% if pkg.deps %}
-            {% for d in pkg.deps %}<code class="dep">{{ d }}</code>{% endfor %}
+            {% for d in pkg.deps %}
+              {%- set slug = pkg.dep_slugs.get(d) -%}
+              {%- if slug -%}
+              <a class="dep" href="{{ root }}packages/{{ slug }}/{{ page_suffix }}"><code>{{ d }}</code></a>
+              {%- else -%}<code class="dep">{{ d }}</code>{%- endif -%}
+            {% endfor %}
           {% else %}<span class="muted">{{ t('pkg.none') }}</span>{% endif %}
         </dd>
         <dt>{{ t('pkg.required_by') }}</dt>