Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add Polydile/dile-components --skill dile-docs-pagesgit clone --depth 1 https://github.com/Polydile/dile-componentsWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/polydile/dile-components/dile-docs-pages)<a href="https://agentmods.dev/skills/polydile/dile-components/dile-docs-pages"><img src="https://agentmods.dev/badge/skills/polydile/dile-components/dile-docs-pages/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/polydile/dile-components/dile-docs-pages"><img src="https://agentmods.dev/badge/skills/polydile/dile-components/dile-docs-pages.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00079 | $0.02796 |
| Opus 5.5 | $0.00032 | $0.01118 |
| Sonnet 5.5 | $0.00016 | $0.00559 |
| Haiku 4.5 | $0.00008 | $0.00280 |
Grade A, and why
dile-docs-pages scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 14d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 236 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Dile Components documentation pages
The documentation site is an Eleventy project rooted at docs/ (config in eleventy.config.cjs). Each section is a folder of Markdown pages whose shared data lives in a <folder>.json file (layout, collection tag, hasMarkdown, markdownFolder), so pages never declare layout unless the folder lacks that JSON.
Before writing, read the component source (packages/<pkg>/components/<name>/) and its demo (demos/<pkg>/) so the docs match the real API: reactive properties, dispatched events, public methods, slots and CSS custom properties. Then open 1–2 sibling pages of the same family (e.g. another input, another spinner) and mirror them.
Where the page goes
| What | Folder | File name | Example |
|---|---|---|---|
@dile/ui, @dile/utils, @dile/editor components |
docs/components/ |
dile-<name>.md (the tag name) |
dile-qr-code.md |
@dile/crud components and guides |
docs/crud/ |
<name>.md (no dile- prefix) |
crud-list.md, ajax.md |
| Mixins | docs/mixins/ |
dile-<name>-mixin.md |
dile-form-mixin.md |
App lib (@dile/lib) |
docs/lib/ |
<name>.md |
router-mixin.md |
| Icons | docs/icons/ |
<family>-icon.md, <family>-badge.md... |
lucide-icon.md |
The page URL is /<folder>/<file-name>/ (e.g. /components/dile-button/); use that form for internal links.
Front matter
---
title: QR Code
package: '@dile/utils'
element: '<dile-qr-code>'
status: stable
summary: Lightweight component to generate and render customizable QR codes on a canvas.
tags: utils
---
title: human name in Title Case, without thedile-prefix ("Input Money", "Select Ajax Overlay"). Used as the HTML<title>, card title and nav label.package: quoted npm package ('@dile/ui','@dile/utils','@dile/crud','@dile/editor','@dile/lib').element:docs/components/: tag with escaped brackets, quoted:'<dile-name>'(it is printed inside HTML cards).docs/crud/: bare tag name:dile-crud-list.- Mixins / lib: the class or mixin name:
DileForm,DileAppRouter.
status:stable(default for finished components),experimental(new/unsettled API) ordeprecated. Deprecated pages are excluded from catalog and nav collections.summary: one sentence (~15–25 words) saying what it does and its key features. It is shown on the catalog card and inllms.txt, so make it self-explanatory.tags: decides the catalog group and side-nav menu. Must match the lists ineleventy.config.cjs:- components:
forms,feedback,icons,utils,menu,spinner,layout, orinput(input family, shown through_includes/input-family-grid.html). Any other tag lands in "Other components". - crud:
introduction,configuration,ajax,operations,main,'Crud extras'(quote tags with spaces). - mixins:
formData,effects,scroll. - lib:
'state management',routing,'app components'. - icons:
lucide,fontawesome,material,phosphor,tabler,remixicon,'universal icons'.
- components:
- Optional:
order: <n>(crud/lib pages sorted manually),hideLink: true(keep the page out of nav listings).
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 14d ago First seen · 236 lines · 79 tokens per session scan A 090eaca59856
dile-docs-pages is a skill published in the GitHub repository Polydile/dile-components (106 stars, last pushed today), licensed MIT. It adds 79 tokens to every session and 2,796 once invoked, about $0.0003 per session on Opus 5.5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-10-02.
Other skills, from other repositories
frontend-design
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI).…
shadcn
Manages shadcn components and projects — adding, searching, fixing, debugging, styling, and composing UI, including chat interfaces. Provides project context, component docs, and usage examples. Applies when working with shadcn/ui, component registries, presets, --preset codes, or any project with a components.json…
migrate-radix-to-base
Migrates React projects and components from Radix UI to Base UI. Use when asked to migrate from radix, move to base-ui, convert radix primitives, or switch a shadcn project's base library. Handles single components ("migrate accordion") and whole projects.
uview-plus
A guide to using uview-plus, a Vue 3 interface component library for uni-app projects. It covers reusable page elements, setup, themes, icons, and differences between web, mobile-app, and mini-program targets.
ranui
Use when building UI with the ranui web-component library (elements like , , , , ) or its fluent DOM builder (ranui/builder — Div/View/Span/signal/createEffect/EventManager). Covers the import map, the full element inventory, conventions, accessibility, and where the authoritative API reference lives.
ranuts
Use when working with the ranuts utility library — DOM/BOM/string/object/number/color/time helpers and reactivity from ranuts/utils (e.g. createSignal, throttle/debounce, cloneDeep, escapeHtml, getMime, MessageCodec, localStorage helpers), the node-only server toolkit ranuts/node, the 2D rendering engine…