@weapp-vite/dashboard 6.17.2 → 6.17.3

package/dist/assets/tokens.js

@@ -1 +1 @@
-import{B as e,C as t,D as n,K as r,N as i,R as a,S as o,U as s,V as c,X as l,Y as u,_ as d,g as f,h as p,j as m,k as h,l as g,p as _,q as v,u as y,v as b,x,y as S,z as C}from"./vue.js";import{O as ee,g as w,v as T,x as E}from"./index.js";import{n as D,t as O}from"./AppEmptyState.js";import{t as k}from"./AppRuntimeBadge.js";import{n as A,t as j}from"./AppSectionHeading.js";var M=t({__name:`AppSurfaceSampleCard`,props:{label:{},tone:{}},setup(e){function t(e){switch(e){case`strong`:return`border border-(--dashboard-border-strong) bg-(--dashboard-panel-strong) shadow-(--dashboard-shadow)`;case`muted`:return`border border-(--dashboard-border) bg-(--dashboard-panel-muted)`;default:return`border border-(--dashboard-border) bg-(--dashboard-panel)`}}return(n,r)=>(m(),S(`div`,{class:v([`rounded-4.5 p-4`,t(e.tone)])},l(e.label),3))}});function N(e){let t=s(``),n=s(`all`),r=s(null),i=s(null),o=s(null),c=null,l=p(()=>e.groups.flatMap(e=>e.tokens.map(t=>({...t,key:`${e.title}:${t.name}`,groupTitle:e.title,groupIconName:e.iconName})))),u=p(()=>[{value:`all`,label:`全部分组`},...e.groups.map(e=>({value:e.title,label:e.title}))]),d=p(()=>{let e=t.value.trim().toLowerCase();return l.value.filter(t=>n.value!==`all`&&t.groupTitle!==n.value?!1:e?[t.name,t.sample,t.groupTitle].join(` `).toLowerCase().includes(e):!0)}),f=p(()=>d.value.find(e=>e.key===r.value)??d.value[0]??null),m=p(()=>{let e=n.value===`all`?`全部`:n.value;return`匹配 ${d.value.length} / ${l.value.length} 个令牌 · ${e}`}),g=p(()=>({background:f.value?.sample??`transparent`}));function _(){i.value=null,o.value=null}function v(){c&&clearTimeout(c),c=setTimeout(()=>{_(),c=null},1800)}async function y(e){try{await D(e),i.value=e,o.value=null}catch{i.value=null,o.value=e}v()}return a(d,e=>{e.some(e=>e.key===r.value)||(r.value=e[0]?.key??null)},{immediate:!0}),h(()=>{c&&clearTimeout(c)}),{copiedToken:i,copyToken:y,failedToken:o,filteredTokens:d,groupFilter:n,groupOptions:u,searchQuery:t,selectedSampleStyle:g,selectedToken:f,selectedTokenKey:r,tokenSummary:m}}var P={class:`grid h-full min-h-0 gap-3 xl:grid-cols-[minmax(0,1fr)_minmax(16rem,0.62fr)]`},F={class:`grid min-h-0 grid-rows-[auto_minmax(0,1fr)] gap-3 overflow-hidden`},I={class:`grid gap-3 rounded-md border border-(--dashboard-border) bg-(--dashboard-panel-muted) p-3`},L={class:`grid gap-2 md:grid-cols-[minmax(0,1fr)_11rem]`},R={class:`grid gap-1.5 text-xs font-medium uppercase tracking-[0.16em] text-(--dashboard-text-soft)`},z={class:`grid gap-1.5 text-xs font-medium uppercase tracking-[0.16em] text-(--dashboard-text-soft)`},B=[`value`],V={class:`text-xs text-(--dashboard-text-soft)`},H={key:1,class:`grid min-h-0 gap-2 overflow-y-auto pr-1`},U=[`onClick`],W={class:`flex items-center justify-between gap-3`},G={class:`flex min-w-0 items-center gap-2`},K={class:`h-4.5 w-4.5 shrink-0 text-(--dashboard-accent)`},q={class:`truncate text-xs text-(--dashboard-text-soft)`},J={class:`mt-2 flex items-center justify-between gap-3`},Y={class:`truncate text-xs text-(--dashboard-text-muted)`},X={class:`grid min-h-0 grid-rows-[auto_minmax(0,1fr)] gap-3 overflow-hidden rounded-md border border-(--dashboard-border) bg-(--dashboard-panel-muted) p-4`},Z={class:`flex items-start justify-between gap-3`},Q={key:1,class:`grid min-h-0 content-start gap-3 overflow-y-auto`},te={class:`grid gap-2`},ne={class:`rounded-md bg-slate-950 px-3 py-2 font-mono text-xs leading-6 text-slate-100 dark:bg-slate-900`},re={class:`rounded-md bg-slate-950 px-3 py-2 font-mono text-xs leading-6 text-slate-100 dark:bg-slate-900`},ie={class:`grid gap-2 sm:grid-cols-2 xl:grid-cols-1 2xl:grid-cols-2`},ae=t({__name:`TokenInspector`,props:{groups:{}},setup(t){let{copiedToken:n,copyToken:a,failedToken:s,filteredTokens:p,groupFilter:h,groupOptions:w,searchQuery:T,selectedSampleStyle:E,selectedToken:D,selectedTokenKey:A,tokenSummary:j}=N(t);return(t,M)=>(m(),S(`div`,P,[f(`div`,F,[f(`div`,I,[f(`div`,L,[f(`label`,R,[M[4]||=x(` 搜索令牌 `,-1),e(f(`input`,{"onUpdate:modelValue":M[0]||=e=>c(T)?T.value=e:null,type:`text`,placeholder:`搜索变量名、分组或 CSS 值`,class:`h-9 rounded-md border border-(--dashboard-border) bg-(--dashboard-panel) px-3 text-sm normal-case tracking-normal text-(--dashboard-text) outline-none transition focus:border-(--dashboard-border-strong)`},null,512),[[y,r(T)]])]),f(`label`,z,[M[5]||=x(` 分组 `,-1),e(f(`select`,{"onUpdate:modelValue":M[1]||=e=>c(h)?h.value=e:null,class:`h-9 rounded-md border border-(--dashboard-border) bg-(--dashboard-panel) px-2.5 text-sm normal-case tracking-normal text-(--dashboard-text) outline-none transition focus:border-(--dashboard-border-strong)`},[(m(!0),S(_,null,i(r(w),e=>(m(),S(`option`,{key:e.value,value:e.value},l(e.label),9,B))),128))],512),[[g,r(h)]])])]),f(`p`,V,l(r(j)),1)]),r(p).length===0?(m(),d(O,{key:0,compact:``},{default:C(()=>[...M[6]||=[x(` 当前筛选条件下没有匹配令牌。 `,-1)]]),_:1})):(m(),S(`div`,H,[(m(!0),S(_,null,i(r(p),e=>(m(),S(`button`,{key:e.key,type:`button`,class:v([`rounded-md border bg-(--dashboard-panel-muted) p-3 text-left transition focus:outline-none`,r(D)?.key===e.key?`border-(--dashboard-border-strong) bg-(--dashboard-panel)`:`border-(--dashboard-border)`]),onClick:t=>A.value=e.key},[f(`span`,W,[f(`span`,G,[f(`span`,K,[o(ee,{name:e.groupIconName},null,8,[`name`])]),f(`code`,q,l(e.name),1)]),f(`span`,{class:`h-8 w-14 shrink-0 rounded-md border border-(--dashboard-border)`,style:u({background:e.sample})},null,4)]),f(`span`,J,[o(k,{label:e.groupTitle,tone:`info`},null,8,[`label`]),f(`span`,Y,l(e.sample),1)])],10,U))),128))]))]),f(`aside`,X,[f(`div`,Z,[M[7]||=f(`div`,null,[f(`p`,{class:`text-[11px] uppercase tracking-[0.2em] text-(--dashboard-accent)`},` Selected `),f(`h3`,{class:`mt-1 text-base font-semibold`},` 当前令牌 `)],-1),r(D)?(m(),d(k,{key:0,label:r(D).groupTitle,tone:`info`},null,8,[`label`])):b(``,!0)]),r(D)?(m(),S(`div`,Q,[f(`div`,{class:`min-h-28 rounded-md border border-(--dashboard-border) shadow-inner`,style:u(r(E))},null,4),f(`div`,te,[f(`code`,ne,l(r(D).name),1),f(`code`,re,l(r(D).sample),1)]),f(`div`,ie,[f(`button`,{type:`button`,class:`inline-flex h-9 items-center justify-center gap-2 rounded-md border border-(--dashboard-border) bg-(--dashboard-panel) px-3 text-sm font-medium text-(--dashboard-text) transition hover:border-(--dashboard-border-strong) hover:text-(--dashboard-accent) focus:border-(--dashboard-border-strong) focus:outline-none`,onClick:M[2]||=e=>r(a)(r(D).name)},` 复制变量名 `),f(`button`,{type:`button`,class:`inline-flex h-9 items-center justify-center gap-2 rounded-md border border-(--dashboard-border) bg-(--dashboard-panel) px-3 text-sm font-medium text-(--dashboard-text) transition hover:border-(--dashboard-border-strong) hover:text-(--dashboard-accent) focus:border-(--dashboard-border-strong) focus:outline-none`,onClick:M[3]||=e=>r(a)(r(D).sample)},l(r(n)===r(D).sample?`已复制`:r(s)===r(D).sample?`复制失败`:`复制 CSS 值`),1)])])):(m(),d(O,{key:0,compact:``},{default:C(()=>[...M[8]||=[x(` 选择左侧令牌后查看 CSS 变量详情。 `,-1)]]),_:1}))])]))}}),oe={class:`grid h-full min-h-0 grid-rows-[auto_minmax(0,1fr)_auto] gap-3 overflow-hidden`},$={class:`mt-4 grid gap-3 lg:grid-cols-3`},se={class:`grid min-h-0 overflow-hidden`},ce={class:`grid gap-3 xl:grid-cols-[minmax(0,1fr)_minmax(0,1fr)]`},le={class:`grid gap-3 md:grid-cols-3`},ue=t({__name:`tokens`,setup(e){let t=[{label:`Default surface`,tone:`default`},{label:`Strong surface`,tone:`strong`},{label:`Muted surface`,tone:`muted`}],a=T.map(e=>({iconName:e.iconName,title:e.label,meta:e.value}));return(e,s)=>(m(),S(`div`,oe,[o(E,{tone:`strong`,padding:`md`},{default:C(()=>[o(j,{eyebrow:`System`,title:`设计令牌`}),f(`div`,$,[(m(!0),S(_,null,i(r(a),e=>(m(),d(A,n({key:e.meta},{ref_for:!0},e),null,16))),128))])]),_:1}),f(`section`,se,[o(E,{eyebrow:`Tokens`,title:`令牌检查器`,"icon-name":`token-color`,padding:`md`,"content-class":`min-h-0 overflow-hidden`},{default:C(()=>[o(ae,{groups:r(w)},null,8,[`groups`])]),_:1})]),f(`section`,ce,[o(E,{eyebrow:`Components`,title:`标准表面`,"icon-name":`token-surface`},{default:C(()=>[f(`div`,le,[(m(),S(_,null,i(t,e=>o(M,n({key:e.label},{ref_for:!0},e),null,16)),64))])]),_:1}),o(E,{eyebrow:`Typography`,title:`文本层级`,"icon-name":`token-type`},{default:C(()=>[...s[0]||=[f(`div`,{class:`space-y-3`},[f(`p`,{class:`text-2xl font-semibold tracking-tight`},` IBM Plex Sans Console `),f(`p`,{class:`text-sm uppercase tracking-[0.24em] text-(--dashboard-text-soft)`},` uppercased meta labels for control surfaces `)],-1)]]),_:1})])]))}});export{ue as default};
+import{a as U,_ as A}from"./AppSectionHeading.vue_vue_type_script_setup_true_lang.js";import{_ as E,z as G,a as T,A as P}from"./index.js";import{d as B,o as r,c as u,n as O,t as h,l as Q,p as R,a as x,k,e,h as S,C as V,D as q,u as t,G as M,E as H,F as $,r as N,f as C,w as v,b as p,S as D,g as J,K as z}from"./vue.js";import{c as W,_ as K}from"./clipboard.js";import{_ as L}from"./AppRuntimeBadge.vue_vue_type_script_setup_true_lang.js";import"./vendor.js";import"./monaco.js";const X=B({__name:"AppSurfaceSampleCard",props:{label:{},tone:{}},setup(g){function f(i){switch(i){case"strong":return"border border-(--dashboard-border-strong) bg-(--dashboard-panel-strong) shadow-(--dashboard-shadow)";case"muted":return"border border-(--dashboard-border) bg-(--dashboard-panel-muted)";default:return"border border-(--dashboard-border) bg-(--dashboard-panel)"}}return(i,n)=>(r(),u("div",{class:O(["rounded-4.5 p-4",f(g.tone)])},h(g.label),3))}});function Y(g){const f=k(""),i=k("all"),n=k(null),m=k(null),d=k(null);let c=null;const w=x(()=>g.groups.flatMap(o=>o.tokens.map(b=>({...b,key:`${o.title}:${b.name}`,groupTitle:o.title,groupIconName:o.iconName})))),y=x(()=>[{value:"all",label:"全部分组"},...g.groups.map(o=>({value:o.title,label:o.title}))]),_=x(()=>{const o=f.value.trim().toLowerCase();return w.value.filter(b=>i.value!=="all"&&b.groupTitle!==i.value?!1:o?[b.name,b.sample,b.groupTitle].join(" ").toLowerCase().includes(o):!0)}),l=x(()=>_.value.find(o=>o.key===n.value)??_.value[0]??null),F=x(()=>{const o=i.value==="all"?"全部":i.value;return`匹配 ${_.value.length} / ${w.value.length} 个令牌 · ${o}`}),j=x(()=>({background:l.value?.sample??"transparent"}));function I(){m.value=null,d.value=null}function a(){c&&clearTimeout(c),c=setTimeout(()=>{I(),c=null},1800)}async function s(o){try{await W(o),m.value=o,d.value=null}catch{m.value=null,d.value=o}a()}return Q(_,o=>{o.some(b=>b.key===n.value)||(n.value=o[0]?.key??null)},{immediate:!0}),R(()=>{c&&clearTimeout(c)}),{copiedToken:m,copyToken:s,failedToken:d,filteredTokens:_,groupFilter:i,groupOptions:y,searchQuery:f,selectedSampleStyle:j,selectedToken:l,selectedTokenKey:n,tokenSummary:F}}const Z={class:"grid h-full min-h-0 gap-3 xl:grid-cols-[minmax(0,1fr)_minmax(16rem,0.62fr)]"},ee={class:"grid min-h-0 grid-rows-[auto_minmax(0,1fr)] gap-3 overflow-hidden"},te={class:"grid gap-3 rounded-md border border-(--dashboard-border) bg-(--dashboard-panel-muted) p-3"},oe={class:"grid gap-2 md:grid-cols-[minmax(0,1fr)_11rem]"},ae={class:"grid gap-1.5 text-xs font-medium uppercase tracking-[0.16em] text-(--dashboard-text-soft)"},se={class:"grid gap-1.5 text-xs font-medium uppercase tracking-[0.16em] text-(--dashboard-text-soft)"},re=["value"],ne={class:"text-xs text-(--dashboard-text-soft)"},de={key:1,class:"grid min-h-0 gap-2 overflow-y-auto pr-1"},le=["onClick"],ie={class:"flex items-center justify-between gap-3"},ue={class:"flex min-w-0 items-center gap-2"},ce={class:"h-4.5 w-4.5 shrink-0 text-(--dashboard-accent)"},me={class:"truncate text-xs text-(--dashboard-text-soft)"},be={class:"mt-2 flex items-center justify-between gap-3"},pe={class:"truncate text-xs text-(--dashboard-text-muted)"},ge={class:"grid min-h-0 grid-rows-[auto_minmax(0,1fr)] gap-3 overflow-hidden rounded-md border border-(--dashboard-border) bg-(--dashboard-panel-muted) p-4"},fe={class:"flex items-start justify-between gap-3"},he={key:1,class:"grid min-h-0 content-start gap-3 overflow-y-auto"},_e={class:"grid gap-2"},xe={class:"rounded-md bg-slate-950 px-3 py-2 font-mono text-xs leading-6 text-slate-100 dark:bg-slate-900"},ve={class:"rounded-md bg-slate-950 px-3 py-2 font-mono text-xs leading-6 text-slate-100 dark:bg-slate-900"},ye={class:"grid gap-2 sm:grid-cols-2 xl:grid-cols-1 2xl:grid-cols-2"},ke=B({__name:"TokenInspector",props:{groups:{}},setup(g){const f=g,{copiedToken:i,copyToken:n,failedToken:m,filteredTokens:d,groupFilter:c,groupOptions:w,searchQuery:y,selectedSampleStyle:_,selectedToken:l,selectedTokenKey:F,tokenSummary:j}=Y(f);return(I,a)=>(r(),u("div",Z,[e("div",ee,[e("div",te,[e("div",oe,[e("label",ae,[a[4]||(a[4]=S(" 搜索令牌 ",-1)),V(e("input",{"onUpdate:modelValue":a[0]||(a[0]=s=>M(y)?y.value=s:null),type:"text",placeholder:"搜索变量名、分组或 CSS 值",class:"h-9 rounded-md border border-(--dashboard-border) bg-(--dashboard-panel) px-3 text-sm normal-case tracking-normal text-(--dashboard-text) outline-none transition focus:border-(--dashboard-border-strong)"},null,512),[[q,t(y)]])]),e("label",se,[a[5]||(a[5]=S(" 分组 ",-1)),V(e("select",{"onUpdate:modelValue":a[1]||(a[1]=s=>M(c)?c.value=s:null),class:"h-9 rounded-md border border-(--dashboard-border) bg-(--dashboard-panel) px-2.5 text-sm normal-case tracking-normal text-(--dashboard-text) outline-none transition focus:border-(--dashboard-border-strong)"},[(r(!0),u($,null,N(t(w),s=>(r(),u("option",{key:s.value,value:s.value},h(s.label),9,re))),128))],512),[[H,t(c)]])])]),e("p",ne,h(t(j)),1)]),t(d).length===0?(r(),C(K,{key:0,compact:""},{default:v(()=>[...a[6]||(a[6]=[S(" 当前筛选条件下没有匹配令牌。 ",-1)])]),_:1})):(r(),u("div",de,[(r(!0),u($,null,N(t(d),s=>(r(),u("button",{key:s.key,type:"button",class:O(["rounded-md border bg-(--dashboard-panel-muted) p-3 text-left transition focus:outline-none",t(l)?.key===s.key?"border-(--dashboard-border-strong) bg-(--dashboard-panel)":"border-(--dashboard-border)"]),onClick:o=>F.value=s.key},[e("span",ie,[e("span",ue,[e("span",ce,[p(E,{name:s.groupIconName},null,8,["name"])]),e("code",me,h(s.name),1)]),e("span",{class:"h-8 w-14 shrink-0 rounded-md border border-(--dashboard-border)",style:D({background:s.sample})},null,4)]),e("span",be,[p(L,{label:s.groupTitle,tone:"info"},null,8,["label"]),e("span",pe,h(s.sample),1)])],10,le))),128))]))]),e("aside",ge,[e("div",fe,[a[7]||(a[7]=e("div",null,[e("p",{class:"text-[11px] uppercase tracking-[0.2em] text-(--dashboard-accent)"}," Selected "),e("h3",{class:"mt-1 text-base font-semibold"}," 当前令牌 ")],-1)),t(l)?(r(),C(L,{key:0,label:t(l).groupTitle,tone:"info"},null,8,["label"])):J("",!0)]),t(l)?(r(),u("div",he,[e("div",{class:"min-h-28 rounded-md border border-(--dashboard-border) shadow-inner",style:D(t(_))},null,4),e("div",_e,[e("code",xe,h(t(l).name),1),e("code",ve,h(t(l).sample),1)]),e("div",ye,[e("button",{type:"button",class:"inline-flex h-9 items-center justify-center gap-2 rounded-md border border-(--dashboard-border) bg-(--dashboard-panel) px-3 text-sm font-medium text-(--dashboard-text) transition hover:border-(--dashboard-border-strong) hover:text-(--dashboard-accent) focus:border-(--dashboard-border-strong) focus:outline-none",onClick:a[2]||(a[2]=s=>t(n)(t(l).name))}," 复制变量名 "),e("button",{type:"button",class:"inline-flex h-9 items-center justify-center gap-2 rounded-md border border-(--dashboard-border) bg-(--dashboard-panel) px-3 text-sm font-medium text-(--dashboard-text) transition hover:border-(--dashboard-border-strong) hover:text-(--dashboard-accent) focus:border-(--dashboard-border-strong) focus:outline-none",onClick:a[3]||(a[3]=s=>t(n)(t(l).sample))},h(t(i)===t(l).sample?"已复制":t(m)===t(l).sample?"复制失败":"复制 CSS 值"),1)])])):(r(),C(K,{key:0,compact:""},{default:v(()=>[...a[8]||(a[8]=[S(" 选择左侧令牌后查看 CSS 变量详情。 ",-1)])]),_:1}))])]))}}),we={class:"grid h-full min-h-0 grid-rows-[auto_minmax(0,1fr)_auto] gap-3 overflow-hidden"},Te={class:"mt-4 grid gap-3 lg:grid-cols-3"},Se={class:"grid min-h-0 overflow-hidden"},Ce={class:"grid gap-3 xl:grid-cols-[minmax(0,1fr)_minmax(0,1fr)]"},$e={class:"grid gap-3 md:grid-cols-3"},De=B({__name:"tokens",setup(g){const f=[{label:"Default surface",tone:"default"},{label:"Strong surface",tone:"strong"},{label:"Muted surface",tone:"muted"}],i=G.map(n=>({iconName:n.iconName,title:n.label,meta:n.value}));return(n,m)=>(r(),u("div",we,[p(T,{tone:"strong",padding:"md"},{default:v(()=>[p(U,{eyebrow:"System",title:"设计令牌"}),e("div",Te,[(r(!0),u($,null,N(t(i),d=>(r(),C(A,z({key:d.meta},{ref_for:!0},d),null,16))),128))])]),_:1}),e("section",Se,[p(T,{eyebrow:"Tokens",title:"令牌检查器","icon-name":"token-color",padding:"md","content-class":"min-h-0 overflow-hidden"},{default:v(()=>[p(ke,{groups:t(P)},null,8,["groups"])]),_:1})]),e("section",Ce,[p(T,{eyebrow:"Components",title:"标准表面","icon-name":"token-surface"},{default:v(()=>[e("div",$e,[(r(),u($,null,N(f,d=>p(X,z({key:d.label},{ref_for:!0},d),null,16)),64))])]),_:1}),p(T,{eyebrow:"Typography",title:"文本层级","icon-name":"token-type"},{default:v(()=>[...m[0]||(m[0]=[e("div",{class:"space-y-3"},[e("p",{class:"text-2xl font-semibold tracking-tight"}," IBM Plex Sans Console "),e("p",{class:"text-sm uppercase tracking-[0.24em] text-(--dashboard-text-soft)"}," uppercased meta labels for control surfaces ")],-1)])]),_:1})])]))}});export{De as default};