temp/UI
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

iter(g72): 文档站搜索框与结果区补无障碍语义

Browse Source
This commit is contained in:
HIsheR
2026-10-26 12:41:24 +08:00
parent 6c5e331248
commit 2aaf30fc09
1 changed files with 7 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/tools/cli/bin/ua.js
+7 -3
View File
@@ -220,12 +220,14 @@ iframe.demo{width:100%;height:430px;border:1px dashed var(--border);border-radiu
.sw span{font-size:12px;color:var(--muted)} .sw span{font-size:12px;color:var(--muted)}
.swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:4px 20px} .swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:4px 20px}
.empty{color:var(--muted);text-align:center;padding:40px 0} .empty{color:var(--muted);text-align:center;padding:40px 0}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
footer{max-width:960px;margin:0 auto;padding:0 20px 40px;color:var(--muted);font-size:12px} footer{max-width:960px;margin:0 auto;padding:0 20px 40px;color:var(--muted);font-size:12px}
</style> </style>
</head> </head>
<body> <body>
<header><h1>@ui-arch<span>私人组件库</span></h1><input id="q" placeholder="搜索组件、参数、API…" autocomplete="off"></header> <header><h1>@ui-arch<span>私人组件库</span></h1><input id="q" type="search" aria-label="搜索组件、参数或 API" placeholder="搜索组件、参数、API…" autocomplete="off"></header>
<nav class="pkgnav" id="nav"></nav> <nav class="pkgnav" id="nav" aria-label="仓库导航"></nav>
<p class="sr-only" id="hit" role="status" aria-live="polite"></p>
<main id="app"></main> <main id="app"></main>
<footer>由 <code>ua docs</code> 生成于 ${generatedAt} · AI 版全文：<code>llms-full.txt</code> · 重新生成：npm run docs</footer> <footer>由 <code>ua docs</code> 生成于 ${generatedAt} · AI 版全文：<code>llms-full.txt</code> · 重新生成：npm run docs</footer>
<script> <script>
@@ -286,8 +288,10 @@ function tokensCard(){
} }
function render(list){ function render(list){
var app=document.getElementById('app'); var app=document.getElementById('app');
if(!list.length){app.innerHTML='<p class="empty">无匹配结果</p>';return} if(!list.length){app.innerHTML='<p class="empty">无匹配结果</p>';var none=document.getElementById('hit');if(none)none.textContent='无匹配结果';return}
app.innerHTML=quickstart()+list.map(pkgCard).join('')+(list.some(function(p){return p.name.indexOf('tokens')>=0})?'':tokensCard()); app.innerHTML=quickstart()+list.map(pkgCard).join('')+(list.some(function(p){return p.name.indexOf('tokens')>=0})?'':tokensCard());
var hit=document.getElementById('hit'); // 搜索结果对读屏播报
if(hit)hit.textContent='匹配 '+list.length+' 个包';
} }
function norm(p){ function norm(p){
var parts=[p.name,p.description,p.type,(p.tags||[]).join(' '),(p.api&&p.api.exports||[]).join(' ')]; var parts=[p.name,p.description,p.type,(p.tags||[]).join(' '),(p.api&&p.api.exports||[]).join(' ')];