@maiyunnet/kebab 9.0.2 → 9.1.0

package/www/example/stc/view/react.page.bundle.js

@@ -0,0 +1,26 @@
+import{a as k,b as I,c as dt,d as ko,f as We,g as ut,h as mt,j as ye,k as pt,l as ft,m as we,o as L}from"../chunk-YJ3GYATF.js";var tt=k(ko(),1),je=k(I(),1);var _=k(I(),1);var Xt=k(L(),1);var kt=k(I(),1);var vt=k(I(),1),Io=k(dt(),1);var N=k(I(),1);var ht=k(I(),1);function bt(e,t){if(typeof e=="function")return e(t);e!=null&&(e.current=t)}function de(...e){return t=>{let o=!1,r=e.map(n=>{let a=bt(n,t);return!o&&typeof a=="function"&&(o=!0),a});if(o)return()=>{for(let n=0;n<r.length;n++){let a=r[n];typeof a=="function"?a():bt(e[n],null)}}}}function K(...e){return ht.useCallback(de(...e),e)}var ke=k(L(),1),Ro=Symbol.for("react.lazy"),Re=N[" use ".trim().toString()];function Co(e){return typeof e=="object"&&e!==null&&"then"in e}function gt(e){return e!=null&&typeof e=="object"&&"$$typeof"in e&&e.$$typeof===Ro&&"_payload"in e&&Co(e._payload)}function xt(e){let t=So(e),o=N.forwardRef((r,n)=>{let{children:a,...i}=r;gt(a)&&typeof Re=="function"&&(a=Re(a._payload));let c=N.Children.toArray(a),l=c.find(Po);if(l){let d=l.props.children,u=c.map(m=>m===l?N.Children.count(d)>1?N.Children.only(null):N.isValidElement(d)?d.props.children:null:m);return(0,ke.jsx)(t,{...i,ref:n,children:N.isValidElement(d)?N.cloneElement(d,void 0,u):null})}return(0,ke.jsx)(t,{...i,ref:n,children:a})});return o.displayName=`${e}.Slot`,o}function So(e){let t=N.forwardRef((o,r)=>{let{children:n,...a}=o;if(gt(n)&&typeof Re=="function"&&(n=Re(n._payload)),N.isValidElement(n)){let i=Ao(n),c=Eo(a,n.props);return n.type!==N.Fragment&&(c.ref=r?de(r,i):i),N.cloneElement(n,c)}return N.Children.count(n)>1?N.Children.only(null):null});return t.displayName=`${e}.SlotClone`,t}var No=Symbol("radix.slottable");function Po(e){return N.isValidElement(e)&&typeof e.type=="function"&&"__radixId"in e.type&&e.type.__radixId===No}function Eo(e,t){let o={...t};for(let r in t){let n=e[r],a=t[r];/^on[A-Z]/.test(r)?n&&a?o[r]=(...c)=>{let l=a(...c);return n(...c),l}:n&&(o[r]=n):r==="style"?o[r]={...n,...a}:r==="className"&&(o[r]=[n,a].filter(Boolean).join(" "))}return{...e,...o}}function Ao(e){let t=Object.getOwnPropertyDescriptor(e.props,"ref")?.get,o=t&&"isReactWarning"in t&&t.isReactWarning;return o?e.ref:(t=Object.getOwnPropertyDescriptor(e,"ref")?.get,o=t&&"isReactWarning"in t&&t.isReactWarning,o?e.props.ref:e.props.ref||e.ref)}var yt=k(L(),1),_o=["a","button","div","form","h2","h3","img","input","label","li","nav","ol","p","select","span","svg","ul"],wt=_o.reduce((e,t)=>{let o=xt(`Primitive.${t}`),r=vt.forwardRef((n,a)=>{let{asChild:i,...c}=n,l=i?o:t;return typeof window<"u"&&(window[Symbol.for("radix-ui")]=!0),(0,yt.jsx)(l,{...c,ref:a})});return r.displayName=`Primitive.${t}`,{...e,[t]:r}},{});var Rt=k(L(),1),Mo="Label",Ct=kt.forwardRef((e,t)=>(0,Rt.jsx)(wt.label,{...e,ref:t,onMouseDown:o=>{o.target.closest("button, input, select, textarea")||(e.onMouseDown?.(o),!o.defaultPrevented&&o.detail>1&&o.preventDefault())}}));Ct.displayName=Mo;var St=Ct;function Nt(e){var t,o,r="";if(typeof e=="string"||typeof e=="number")r+=e;else if(typeof e=="object")if(Array.isArray(e)){var n=e.length;for(t=0;t<n;t++)e[t]&&(o=Nt(e[t]))&&(r&&(r+=" "),r+=o)}else for(o in e)e[o]&&(r&&(r+=" "),r+=o);return r}function Ce(){for(var e,t,o=0,r="",n=arguments.length;o<n;o++)(e=arguments[o])&&(t=Nt(e))&&(r&&(r+=" "),r+=t);return r}var Pt=e=>typeof e=="boolean"?`${e}`:e===0?"0":e,Et=Ce,At=(e,t)=>o=>{var r;if(t?.variants==null)return Et(e,o?.class,o?.className);let{variants:n,defaultVariants:a}=t,i=Object.keys(n).map(d=>{let u=o?.[d],m=a?.[d];if(u===null)return null;let b=Pt(u)||Pt(m);return n[d][b]}),c=o&&Object.entries(o).reduce((d,u)=>{let[m,b]=u;return b===void 0||(d[m]=b),d},{}),l=t==null||(r=t.compoundVariants)===null||r===void 0?void 0:r.reduce((d,u)=>{let{class:m,className:b,...x}=u;return Object.entries(x).every(R=>{let[v,C]=R;return Array.isArray(C)?C.includes({...a,...c}[v]):{...a,...c}[v]===C})?[...d,m,b]:d},[]);return Et(e,i,l,o?.class,o?.className)};var Oo=(e,t)=>{let o=new Array(e.length+t.length);for(let r=0;r<e.length;r++)o[r]=e[r];for(let r=0;r<t.length;r++)o[e.length+r]=t[r];return o},zo=(e,t)=>({classGroupId:e,validator:t}),zt=(e=new Map,t=null,o)=>({nextPart:e,validators:t,classGroupId:o});var It=[],Lo="arbitrary..",Fo=e=>{let t=Bo(e),{conflictingClassGroups:o,conflictingClassGroupModifiers:r}=e;return{getClassGroupId:i=>{if(i.startsWith("[")&&i.endsWith("]"))return jo(i);let c=i.split("-"),l=c[0]===""&&c.length>1?1:0;return Lt(c,l,t)},getConflictingClassGroupIds:(i,c)=>{if(c){let l=r[i],d=o[i];return l?d?Oo(d,l):l:d||It}return o[i]||It}}},Lt=(e,t,o)=>{if(e.length-t===0)return o.classGroupId;let n=e[t],a=o.nextPart.get(n);if(a){let d=Lt(e,t+1,a);if(d)return d}let i=o.validators;if(i===null)return;let c=t===0?e.join("-"):e.slice(t).join("-"),l=i.length;for(let d=0;d<l;d++){let u=i[d];if(u.validator(c))return u.classGroupId}},jo=e=>e.slice(1,-1).indexOf(":")===-1?void 0:(()=>{let t=e.slice(1,-1),o=t.indexOf(":"),r=t.slice(0,o);return r?Lo+r:void 0})(),Bo=e=>{let{theme:t,classGroups:o}=e;return Do(o,t)},Do=(e,t)=>{let o=zt();for(let r in e){let n=e[r];He(n,o,r,t)}return o},He=(e,t,o,r)=>{let n=e.length;for(let a=0;a<n;a++){let i=e[a];$o(i,t,o,r)}},$o=(e,t,o,r)=>{if(typeof e=="string"){Go(e,t,o);return}if(typeof e=="function"){Vo(e,t,o,r);return}Wo(e,t,o,r)},Go=(e,t,o)=>{let r=e===""?t:Ft(t,e);r.classGroupId=o},Vo=(e,t,o,r)=>{if(Uo(e)){He(e(r),t,o,r);return}t.validators===null&&(t.validators=[]),t.validators.push(zo(o,e))},Wo=(e,t,o,r)=>{let n=Object.entries(e),a=n.length;for(let i=0;i<a;i++){let[c,l]=n[i];He(l,Ft(t,c),o,r)}},Ft=(e,t)=>{let o=e,r=t.split("-"),n=r.length;for(let a=0;a<n;a++){let i=r[a],c=o.nextPart.get(i);c||(c=zt(),o.nextPart.set(i,c)),o=c}return o},Uo=e=>"isThemeGetter"in e&&e.isThemeGetter===!0,Ho=e=>{if(e<1)return{get:()=>{},set:()=>{}};let t=0,o=Object.create(null),r=Object.create(null),n=(a,i)=>{o[a]=i,t++,t>e&&(t=0,r=o,o=Object.create(null))};return{get(a){let i=o[a];if(i!==void 0)return i;if((i=r[a])!==void 0)return n(a,i),i},set(a,i){a in o?o[a]=i:n(a,i)}}};var qo=[],_t=(e,t,o,r,n)=>({modifiers:e,hasImportantModifier:t,baseClassName:o,maybePostfixModifierPosition:r,isExternal:n}),Yo=e=>{let{prefix:t,experimentalParseClassName:o}=e,r=n=>{let a=[],i=0,c=0,l=0,d,u=n.length;for(let v=0;v<u;v++){let C=n[v];if(i===0&&c===0){if(C===":"){a.push(n.slice(l,v)),l=v+1;continue}if(C==="/"){d=v;continue}}C==="["?i++:C==="]"?i--:C==="("?c++:C===")"&&c--}let m=a.length===0?n:n.slice(l),b=m,x=!1;m.endsWith("!")?(b=m.slice(0,-1),x=!0):m.startsWith("!")&&(b=m.slice(1),x=!0);let R=d&&d>l?d-l:void 0;return _t(a,x,b,R)};if(t){let n=t+":",a=r;r=i=>i.startsWith(n)?a(i.slice(n.length)):_t(qo,!1,i,void 0,!0)}if(o){let n=r;r=a=>o({className:a,parseClassName:n})}return r},Jo=e=>{let t=new Map;return e.orderSensitiveModifiers.forEach((o,r)=>{t.set(o,1e6+r)}),o=>{let r=[],n=[];for(let a=0;a<o.length;a++){let i=o[a],c=i[0]==="[",l=t.has(i);c||l?(n.length>0&&(n.sort(),r.push(...n),n=[]),r.push(i)):n.push(i)}return n.length>0&&(n.sort(),r.push(...n)),r}},Xo=e=>({cache:Ho(e.cacheSize),parseClassName:Yo(e),sortModifiers:Jo(e),...Fo(e)}),Ko=/\s+/,Zo=(e,t)=>{let{parseClassName:o,getClassGroupId:r,getConflictingClassGroupIds:n,sortModifiers:a}=t,i=[],c=e.trim().split(Ko),l="";for(let d=c.length-1;d>=0;d-=1){let u=c[d],{isExternal:m,modifiers:b,hasImportantModifier:x,baseClassName:R,maybePostfixModifierPosition:v}=o(u);if(m){l=u+(l.length>0?" "+l:l);continue}let C=!!v,y=r(C?R.substring(0,v):R);if(!y){if(!C){l=u+(l.length>0?" "+l:l);continue}if(y=r(R),!y){l=u+(l.length>0?" "+l:l);continue}C=!1}let S=b.length===0?"":b.length===1?b[0]:a(b).join(":"),z=x?S+"!":S,D=z+y;if(i.indexOf(D)>-1)continue;i.push(D);let U=n(y,C);for(let H=0;H<U.length;++H){let oe=U[H];i.push(z+oe)}l=u+(l.length>0?" "+l:l)}return l},Qo=(...e)=>{let t=0,o,r,n="";for(;t<e.length;)(o=e[t++])&&(r=jt(o))&&(n&&(n+=" "),n+=r);return n},jt=e=>{if(typeof e=="string")return e;let t,o="";for(let r=0;r<e.length;r++)e[r]&&(t=jt(e[r]))&&(o&&(o+=" "),o+=t);return o},er=(e,...t)=>{let o,r,n,a,i=l=>{let d=t.reduce((u,m)=>m(u),e());return o=Xo(d),r=o.cache.get,n=o.cache.set,a=c,c(l)},c=l=>{let d=r(l);if(d)return d;let u=Zo(l,o);return n(l,u),u};return a=i,(...l)=>a(Qo(...l))},tr=[],P=e=>{let t=o=>o[e]||tr;return t.isThemeGetter=!0,t},Bt=/^\[(?:(\w[\w-]*):)?(.+)\]$/i,Dt=/^\((?:(\w[\w-]*):)?(.+)\)$/i,or=/^\d+(?:\.\d+)?\/\d+(?:\.\d+)?$/,rr=/^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/,nr=/\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/,sr=/^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/,ar=/^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/,ir=/^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/,Z=e=>or.test(e),w=e=>!!e&&!Number.isNaN(Number(e)),Q=e=>!!e&&Number.isInteger(Number(e)),Ue=e=>e.endsWith("%")&&w(e.slice(0,-1)),q=e=>rr.test(e),$t=()=>!0,lr=e=>nr.test(e)&&!sr.test(e),qe=()=>!1,cr=e=>ar.test(e),dr=e=>ir.test(e),ur=e=>!p(e)&&!f(e),mr=e=>ee(e,Wt,qe),p=e=>Bt.test(e),ne=e=>ee(e,Ut,lr),Mt=e=>ee(e,yr,w),pr=e=>ee(e,qt,$t),fr=e=>ee(e,Ht,qe),Tt=e=>ee(e,Gt,qe),br=e=>ee(e,Vt,dr),Se=e=>ee(e,Yt,cr),f=e=>Dt.test(e),ue=e=>se(e,Ut),hr=e=>se(e,Ht),Ot=e=>se(e,Gt),gr=e=>se(e,Wt),xr=e=>se(e,Vt),Ne=e=>se(e,Yt,!0),vr=e=>se(e,qt,!0),ee=(e,t,o)=>{let r=Bt.exec(e);return r?r[1]?t(r[1]):o(r[2]):!1},se=(e,t,o=!1)=>{let r=Dt.exec(e);return r?r[1]?t(r[1]):o:!1},Gt=e=>e==="position"||e==="percentage",Vt=e=>e==="image"||e==="url",Wt=e=>e==="length"||e==="size"||e==="bg-size",Ut=e=>e==="length",yr=e=>e==="number",Ht=e=>e==="family-name",qt=e=>e==="number"||e==="weight",Yt=e=>e==="shadow";var wr=()=>{let e=P("color"),t=P("font"),o=P("text"),r=P("font-weight"),n=P("tracking"),a=P("leading"),i=P("breakpoint"),c=P("container"),l=P("spacing"),d=P("radius"),u=P("shadow"),m=P("inset-shadow"),b=P("text-shadow"),x=P("drop-shadow"),R=P("blur"),v=P("perspective"),C=P("aspect"),y=P("ease"),S=P("animate"),z=()=>["auto","avoid","all","avoid-page","page","left","right","column"],D=()=>["center","top","bottom","left","right","top-left","left-top","top-right","right-top","bottom-right","right-bottom","bottom-left","left-bottom"],U=()=>[...D(),f,p],H=()=>["auto","hidden","clip","visible","scroll"],oe=()=>["auto","contain","none"],h=()=>[f,p,l],j=()=>[Z,"full","auto",...h()],ot=()=>[Q,"none","subgrid",f,p],rt=()=>["auto",{span:["full",Q,f,p]},Q,f,p],be=()=>[Q,"auto",f,p],nt=()=>["auto","min","max","fr",f,p],Be=()=>["start","end","center","between","around","evenly","stretch","baseline","center-safe","end-safe"],ce=()=>["start","end","center","stretch","center-safe","end-safe"],G=()=>["auto",...h()],re=()=>[Z,"auto","full","dvw","dvh","lvw","lvh","svw","svh","min","max","fit",...h()],De=()=>[Z,"screen","full","dvw","lvw","svw","min","max","fit",...h()],$e=()=>[Z,"screen","full","lh","dvh","lvh","svh","min","max","fit",...h()],g=()=>[e,f,p],st=()=>[...D(),Ot,Tt,{position:[f,p]}],at=()=>["no-repeat",{repeat:["","x","y","space","round"]}],it=()=>["auto","cover","contain",gr,mr,{size:[f,p]}],Ge=()=>[Ue,ue,ne],M=()=>["","none","full",d,f,p],T=()=>["",w,ue,ne],he=()=>["solid","dashed","dotted","double"],lt=()=>["normal","multiply","screen","overlay","darken","lighten","color-dodge","color-burn","hard-light","soft-light","difference","exclusion","hue","saturation","color","luminosity"],A=()=>[w,Ue,Ot,Tt],ct=()=>["","none",R,f,p],ge=()=>["none",w,f,p],xe=()=>["none",w,f,p],Ve=()=>[w,f,p],ve=()=>[Z,"full",...h()];return{cacheSize:500,theme:{animate:["spin","ping","pulse","bounce"],aspect:["video"],blur:[q],breakpoint:[q],color:[$t],container:[q],"drop-shadow":[q],ease:["in","out","in-out"],font:[ur],"font-weight":["thin","extralight","light","normal","medium","semibold","bold","extrabold","black"],"inset-shadow":[q],leading:["none","tight","snug","normal","relaxed","loose"],perspective:["dramatic","near","normal","midrange","distant","none"],radius:[q],shadow:[q],spacing:["px",w],text:[q],"text-shadow":[q],tracking:["tighter","tight","normal","wide","wider","widest"]},classGroups:{aspect:[{aspect:["auto","square",Z,p,f,C]}],container:["container"],columns:[{columns:[w,p,f,c]}],"break-after":[{"break-after":z()}],"break-before":[{"break-before":z()}],"break-inside":[{"break-inside":["auto","avoid","avoid-page","avoid-column"]}],"box-decoration":[{"box-decoration":["slice","clone"]}],box:[{box:["border","content"]}],display:["block","inline-block","inline","flex","inline-flex","table","inline-table","table-caption","table-cell","table-column","table-column-group","table-footer-group","table-header-group","table-row-group","table-row","flow-root","grid","inline-grid","contents","list-item","hidden"],sr:["sr-only","not-sr-only"],float:[{float:["right","left","none","start","end"]}],clear:[{clear:["left","right","both","none","start","end"]}],isolation:["isolate","isolation-auto"],"object-fit":[{object:["contain","cover","fill","none","scale-down"]}],"object-position":[{object:U()}],overflow:[{overflow:H()}],"overflow-x":[{"overflow-x":H()}],"overflow-y":[{"overflow-y":H()}],overscroll:[{overscroll:oe()}],"overscroll-x":[{"overscroll-x":oe()}],"overscroll-y":[{"overscroll-y":oe()}],position:["static","fixed","absolute","relative","sticky"],inset:[{inset:j()}],"inset-x":[{"inset-x":j()}],"inset-y":[{"inset-y":j()}],start:[{"inset-s":j(),start:j()}],end:[{"inset-e":j(),end:j()}],"inset-bs":[{"inset-bs":j()}],"inset-be":[{"inset-be":j()}],top:[{top:j()}],right:[{right:j()}],bottom:[{bottom:j()}],left:[{left:j()}],visibility:["visible","invisible","collapse"],z:[{z:[Q,"auto",f,p]}],basis:[{basis:[Z,"full","auto",c,...h()]}],"flex-direction":[{flex:["row","row-reverse","col","col-reverse"]}],"flex-wrap":[{flex:["nowrap","wrap","wrap-reverse"]}],flex:[{flex:[w,Z,"auto","initial","none",p]}],grow:[{grow:["",w,f,p]}],shrink:[{shrink:["",w,f,p]}],order:[{order:[Q,"first","last","none",f,p]}],"grid-cols":[{"grid-cols":ot()}],"col-start-end":[{col:rt()}],"col-start":[{"col-start":be()}],"col-end":[{"col-end":be()}],"grid-rows":[{"grid-rows":ot()}],"row-start-end":[{row:rt()}],"row-start":[{"row-start":be()}],"row-end":[{"row-end":be()}],"grid-flow":[{"grid-flow":["row","col","dense","row-dense","col-dense"]}],"auto-cols":[{"auto-cols":nt()}],"auto-rows":[{"auto-rows":nt()}],gap:[{gap:h()}],"gap-x":[{"gap-x":h()}],"gap-y":[{"gap-y":h()}],"justify-content":[{justify:[...Be(),"normal"]}],"justify-items":[{"justify-items":[...ce(),"normal"]}],"justify-self":[{"justify-self":["auto",...ce()]}],"align-content":[{content:["normal",...Be()]}],"align-items":[{items:[...ce(),{baseline:["","last"]}]}],"align-self":[{self:["auto",...ce(),{baseline:["","last"]}]}],"place-content":[{"place-content":Be()}],"place-items":[{"place-items":[...ce(),"baseline"]}],"place-self":[{"place-self":["auto",...ce()]}],p:[{p:h()}],px:[{px:h()}],py:[{py:h()}],ps:[{ps:h()}],pe:[{pe:h()}],pbs:[{pbs:h()}],pbe:[{pbe:h()}],pt:[{pt:h()}],pr:[{pr:h()}],pb:[{pb:h()}],pl:[{pl:h()}],m:[{m:G()}],mx:[{mx:G()}],my:[{my:G()}],ms:[{ms:G()}],me:[{me:G()}],mbs:[{mbs:G()}],mbe:[{mbe:G()}],mt:[{mt:G()}],mr:[{mr:G()}],mb:[{mb:G()}],ml:[{ml:G()}],"space-x":[{"space-x":h()}],"space-x-reverse":["space-x-reverse"],"space-y":[{"space-y":h()}],"space-y-reverse":["space-y-reverse"],size:[{size:re()}],"inline-size":[{inline:["auto",...De()]}],"min-inline-size":[{"min-inline":["auto",...De()]}],"max-inline-size":[{"max-inline":["none",...De()]}],"block-size":[{block:["auto",...$e()]}],"min-block-size":[{"min-block":["auto",...$e()]}],"max-block-size":[{"max-block":["none",...$e()]}],w:[{w:[c,"screen",...re()]}],"min-w":[{"min-w":[c,"screen","none",...re()]}],"max-w":[{"max-w":[c,"screen","none","prose",{screen:[i]},...re()]}],h:[{h:["screen","lh",...re()]}],"min-h":[{"min-h":["screen","lh","none",...re()]}],"max-h":[{"max-h":["screen","lh",...re()]}],"font-size":[{text:["base",o,ue,ne]}],"font-smoothing":["antialiased","subpixel-antialiased"],"font-style":["italic","not-italic"],"font-weight":[{font:[r,vr,pr]}],"font-stretch":[{"font-stretch":["ultra-condensed","extra-condensed","condensed","semi-condensed","normal","semi-expanded","expanded","extra-expanded","ultra-expanded",Ue,p]}],"font-family":[{font:[hr,fr,t]}],"font-features":[{"font-features":[p]}],"fvn-normal":["normal-nums"],"fvn-ordinal":["ordinal"],"fvn-slashed-zero":["slashed-zero"],"fvn-figure":["lining-nums","oldstyle-nums"],"fvn-spacing":["proportional-nums","tabular-nums"],"fvn-fraction":["diagonal-fractions","stacked-fractions"],tracking:[{tracking:[n,f,p]}],"line-clamp":[{"line-clamp":[w,"none",f,Mt]}],leading:[{leading:[a,...h()]}],"list-image":[{"list-image":["none",f,p]}],"list-style-position":[{list:["inside","outside"]}],"list-style-type":[{list:["disc","decimal","none",f,p]}],"text-alignment":[{text:["left","center","right","justify","start","end"]}],"placeholder-color":[{placeholder:g()}],"text-color":[{text:g()}],"text-decoration":["underline","overline","line-through","no-underline"],"text-decoration-style":[{decoration:[...he(),"wavy"]}],"text-decoration-thickness":[{decoration:[w,"from-font","auto",f,ne]}],"text-decoration-color":[{decoration:g()}],"underline-offset":[{"underline-offset":[w,"auto",f,p]}],"text-transform":["uppercase","lowercase","capitalize","normal-case"],"text-overflow":["truncate","text-ellipsis","text-clip"],"text-wrap":[{text:["wrap","nowrap","balance","pretty"]}],indent:[{indent:h()}],"vertical-align":[{align:["baseline","top","middle","bottom","text-top","text-bottom","sub","super",f,p]}],whitespace:[{whitespace:["normal","nowrap","pre","pre-line","pre-wrap","break-spaces"]}],break:[{break:["normal","words","all","keep"]}],wrap:[{wrap:["break-word","anywhere","normal"]}],hyphens:[{hyphens:["none","manual","auto"]}],content:[{content:["none",f,p]}],"bg-attachment":[{bg:["fixed","local","scroll"]}],"bg-clip":[{"bg-clip":["border","padding","content","text"]}],"bg-origin":[{"bg-origin":["border","padding","content"]}],"bg-position":[{bg:st()}],"bg-repeat":[{bg:at()}],"bg-size":[{bg:it()}],"bg-image":[{bg:["none",{linear:[{to:["t","tr","r","br","b","bl","l","tl"]},Q,f,p],radial:["",f,p],conic:[Q,f,p]},xr,br]}],"bg-color":[{bg:g()}],"gradient-from-pos":[{from:Ge()}],"gradient-via-pos":[{via:Ge()}],"gradient-to-pos":[{to:Ge()}],"gradient-from":[{from:g()}],"gradient-via":[{via:g()}],"gradient-to":[{to:g()}],rounded:[{rounded:M()}],"rounded-s":[{"rounded-s":M()}],"rounded-e":[{"rounded-e":M()}],"rounded-t":[{"rounded-t":M()}],"rounded-r":[{"rounded-r":M()}],"rounded-b":[{"rounded-b":M()}],"rounded-l":[{"rounded-l":M()}],"rounded-ss":[{"rounded-ss":M()}],"rounded-se":[{"rounded-se":M()}],"rounded-ee":[{"rounded-ee":M()}],"rounded-es":[{"rounded-es":M()}],"rounded-tl":[{"rounded-tl":M()}],"rounded-tr":[{"rounded-tr":M()}],"rounded-br":[{"rounded-br":M()}],"rounded-bl":[{"rounded-bl":M()}],"border-w":[{border:T()}],"border-w-x":[{"border-x":T()}],"border-w-y":[{"border-y":T()}],"border-w-s":[{"border-s":T()}],"border-w-e":[{"border-e":T()}],"border-w-bs":[{"border-bs":T()}],"border-w-be":[{"border-be":T()}],"border-w-t":[{"border-t":T()}],"border-w-r":[{"border-r":T()}],"border-w-b":[{"border-b":T()}],"border-w-l":[{"border-l":T()}],"divide-x":[{"divide-x":T()}],"divide-x-reverse":["divide-x-reverse"],"divide-y":[{"divide-y":T()}],"divide-y-reverse":["divide-y-reverse"],"border-style":[{border:[...he(),"hidden","none"]}],"divide-style":[{divide:[...he(),"hidden","none"]}],"border-color":[{border:g()}],"border-color-x":[{"border-x":g()}],"border-color-y":[{"border-y":g()}],"border-color-s":[{"border-s":g()}],"border-color-e":[{"border-e":g()}],"border-color-bs":[{"border-bs":g()}],"border-color-be":[{"border-be":g()}],"border-color-t":[{"border-t":g()}],"border-color-r":[{"border-r":g()}],"border-color-b":[{"border-b":g()}],"border-color-l":[{"border-l":g()}],"divide-color":[{divide:g()}],"outline-style":[{outline:[...he(),"none","hidden"]}],"outline-offset":[{"outline-offset":[w,f,p]}],"outline-w":[{outline:["",w,ue,ne]}],"outline-color":[{outline:g()}],shadow:[{shadow:["","none",u,Ne,Se]}],"shadow-color":[{shadow:g()}],"inset-shadow":[{"inset-shadow":["none",m,Ne,Se]}],"inset-shadow-color":[{"inset-shadow":g()}],"ring-w":[{ring:T()}],"ring-w-inset":["ring-inset"],"ring-color":[{ring:g()}],"ring-offset-w":[{"ring-offset":[w,ne]}],"ring-offset-color":[{"ring-offset":g()}],"inset-ring-w":[{"inset-ring":T()}],"inset-ring-color":[{"inset-ring":g()}],"text-shadow":[{"text-shadow":["none",b,Ne,Se]}],"text-shadow-color":[{"text-shadow":g()}],opacity:[{opacity:[w,f,p]}],"mix-blend":[{"mix-blend":[...lt(),"plus-darker","plus-lighter"]}],"bg-blend":[{"bg-blend":lt()}],"mask-clip":[{"mask-clip":["border","padding","content","fill","stroke","view"]},"mask-no-clip"],"mask-composite":[{mask:["add","subtract","intersect","exclude"]}],"mask-image-linear-pos":[{"mask-linear":[w]}],"mask-image-linear-from-pos":[{"mask-linear-from":A()}],"mask-image-linear-to-pos":[{"mask-linear-to":A()}],"mask-image-linear-from-color":[{"mask-linear-from":g()}],"mask-image-linear-to-color":[{"mask-linear-to":g()}],"mask-image-t-from-pos":[{"mask-t-from":A()}],"mask-image-t-to-pos":[{"mask-t-to":A()}],"mask-image-t-from-color":[{"mask-t-from":g()}],"mask-image-t-to-color":[{"mask-t-to":g()}],"mask-image-r-from-pos":[{"mask-r-from":A()}],"mask-image-r-to-pos":[{"mask-r-to":A()}],"mask-image-r-from-color":[{"mask-r-from":g()}],"mask-image-r-to-color":[{"mask-r-to":g()}],"mask-image-b-from-pos":[{"mask-b-from":A()}],"mask-image-b-to-pos":[{"mask-b-to":A()}],"mask-image-b-from-color":[{"mask-b-from":g()}],"mask-image-b-to-color":[{"mask-b-to":g()}],"mask-image-l-from-pos":[{"mask-l-from":A()}],"mask-image-l-to-pos":[{"mask-l-to":A()}],"mask-image-l-from-color":[{"mask-l-from":g()}],"mask-image-l-to-color":[{"mask-l-to":g()}],"mask-image-x-from-pos":[{"mask-x-from":A()}],"mask-image-x-to-pos":[{"mask-x-to":A()}],"mask-image-x-from-color":[{"mask-x-from":g()}],"mask-image-x-to-color":[{"mask-x-to":g()}],"mask-image-y-from-pos":[{"mask-y-from":A()}],"mask-image-y-to-pos":[{"mask-y-to":A()}],"mask-image-y-from-color":[{"mask-y-from":g()}],"mask-image-y-to-color":[{"mask-y-to":g()}],"mask-image-radial":[{"mask-radial":[f,p]}],"mask-image-radial-from-pos":[{"mask-radial-from":A()}],"mask-image-radial-to-pos":[{"mask-radial-to":A()}],"mask-image-radial-from-color":[{"mask-radial-from":g()}],"mask-image-radial-to-color":[{"mask-radial-to":g()}],"mask-image-radial-shape":[{"mask-radial":["circle","ellipse"]}],"mask-image-radial-size":[{"mask-radial":[{closest:["side","corner"],farthest:["side","corner"]}]}],"mask-image-radial-pos":[{"mask-radial-at":D()}],"mask-image-conic-pos":[{"mask-conic":[w]}],"mask-image-conic-from-pos":[{"mask-conic-from":A()}],"mask-image-conic-to-pos":[{"mask-conic-to":A()}],"mask-image-conic-from-color":[{"mask-conic-from":g()}],"mask-image-conic-to-color":[{"mask-conic-to":g()}],"mask-mode":[{mask:["alpha","luminance","match"]}],"mask-origin":[{"mask-origin":["border","padding","content","fill","stroke","view"]}],"mask-position":[{mask:st()}],"mask-repeat":[{mask:at()}],"mask-size":[{mask:it()}],"mask-type":[{"mask-type":["alpha","luminance"]}],"mask-image":[{mask:["none",f,p]}],filter:[{filter:["","none",f,p]}],blur:[{blur:ct()}],brightness:[{brightness:[w,f,p]}],contrast:[{contrast:[w,f,p]}],"drop-shadow":[{"drop-shadow":["","none",x,Ne,Se]}],"drop-shadow-color":[{"drop-shadow":g()}],grayscale:[{grayscale:["",w,f,p]}],"hue-rotate":[{"hue-rotate":[w,f,p]}],invert:[{invert:["",w,f,p]}],saturate:[{saturate:[w,f,p]}],sepia:[{sepia:["",w,f,p]}],"backdrop-filter":[{"backdrop-filter":["","none",f,p]}],"backdrop-blur":[{"backdrop-blur":ct()}],"backdrop-brightness":[{"backdrop-brightness":[w,f,p]}],"backdrop-contrast":[{"backdrop-contrast":[w,f,p]}],"backdrop-grayscale":[{"backdrop-grayscale":["",w,f,p]}],"backdrop-hue-rotate":[{"backdrop-hue-rotate":[w,f,p]}],"backdrop-invert":[{"backdrop-invert":["",w,f,p]}],"backdrop-opacity":[{"backdrop-opacity":[w,f,p]}],"backdrop-saturate":[{"backdrop-saturate":[w,f,p]}],"backdrop-sepia":[{"backdrop-sepia":["",w,f,p]}],"border-collapse":[{border:["collapse","separate"]}],"border-spacing":[{"border-spacing":h()}],"border-spacing-x":[{"border-spacing-x":h()}],"border-spacing-y":[{"border-spacing-y":h()}],"table-layout":[{table:["auto","fixed"]}],caption:[{caption:["top","bottom"]}],transition:[{transition:["","all","colors","opacity","shadow","transform","none",f,p]}],"transition-behavior":[{transition:["normal","discrete"]}],duration:[{duration:[w,"initial",f,p]}],ease:[{ease:["linear","initial",y,f,p]}],delay:[{delay:[w,f,p]}],animate:[{animate:["none",S,f,p]}],backface:[{backface:["hidden","visible"]}],perspective:[{perspective:[v,f,p]}],"perspective-origin":[{"perspective-origin":U()}],rotate:[{rotate:ge()}],"rotate-x":[{"rotate-x":ge()}],"rotate-y":[{"rotate-y":ge()}],"rotate-z":[{"rotate-z":ge()}],scale:[{scale:xe()}],"scale-x":[{"scale-x":xe()}],"scale-y":[{"scale-y":xe()}],"scale-z":[{"scale-z":xe()}],"scale-3d":["scale-3d"],skew:[{skew:Ve()}],"skew-x":[{"skew-x":Ve()}],"skew-y":[{"skew-y":Ve()}],transform:[{transform:[f,p,"","none","gpu","cpu"]}],"transform-origin":[{origin:U()}],"transform-style":[{transform:["3d","flat"]}],translate:[{translate:ve()}],"translate-x":[{"translate-x":ve()}],"translate-y":[{"translate-y":ve()}],"translate-z":[{"translate-z":ve()}],"translate-none":["translate-none"],accent:[{accent:g()}],appearance:[{appearance:["none","auto"]}],"caret-color":[{caret:g()}],"color-scheme":[{scheme:["normal","dark","light","light-dark","only-dark","only-light"]}],cursor:[{cursor:["auto","default","pointer","wait","text","move","help","not-allowed","none","context-menu","progress","cell","crosshair","vertical-text","alias","copy","no-drop","grab","grabbing","all-scroll","col-resize","row-resize","n-resize","e-resize","s-resize","w-resize","ne-resize","nw-resize","se-resize","sw-resize","ew-resize","ns-resize","nesw-resize","nwse-resize","zoom-in","zoom-out",f,p]}],"field-sizing":[{"field-sizing":["fixed","content"]}],"pointer-events":[{"pointer-events":["auto","none"]}],resize:[{resize:["none","","y","x"]}],"scroll-behavior":[{scroll:["auto","smooth"]}],"scroll-m":[{"scroll-m":h()}],"scroll-mx":[{"scroll-mx":h()}],"scroll-my":[{"scroll-my":h()}],"scroll-ms":[{"scroll-ms":h()}],"scroll-me":[{"scroll-me":h()}],"scroll-mbs":[{"scroll-mbs":h()}],"scroll-mbe":[{"scroll-mbe":h()}],"scroll-mt":[{"scroll-mt":h()}],"scroll-mr":[{"scroll-mr":h()}],"scroll-mb":[{"scroll-mb":h()}],"scroll-ml":[{"scroll-ml":h()}],"scroll-p":[{"scroll-p":h()}],"scroll-px":[{"scroll-px":h()}],"scroll-py":[{"scroll-py":h()}],"scroll-ps":[{"scroll-ps":h()}],"scroll-pe":[{"scroll-pe":h()}],"scroll-pbs":[{"scroll-pbs":h()}],"scroll-pbe":[{"scroll-pbe":h()}],"scroll-pt":[{"scroll-pt":h()}],"scroll-pr":[{"scroll-pr":h()}],"scroll-pb":[{"scroll-pb":h()}],"scroll-pl":[{"scroll-pl":h()}],"snap-align":[{snap:["start","end","center","align-none"]}],"snap-stop":[{snap:["normal","always"]}],"snap-type":[{snap:["none","x","y","both"]}],"snap-strictness":[{snap:["mandatory","proximity"]}],touch:[{touch:["auto","none","manipulation"]}],"touch-x":[{"touch-pan":["x","left","right"]}],"touch-y":[{"touch-pan":["y","up","down"]}],"touch-pz":["touch-pinch-zoom"],select:[{select:["none","text","all","auto"]}],"will-change":[{"will-change":["auto","scroll","contents","transform",f,p]}],fill:[{fill:["none",...g()]}],"stroke-w":[{stroke:[w,ue,ne,Mt]}],stroke:[{stroke:["none",...g()]}],"forced-color-adjust":[{"forced-color-adjust":["auto","none"]}]},conflictingClassGroups:{overflow:["overflow-x","overflow-y"],overscroll:["overscroll-x","overscroll-y"],inset:["inset-x","inset-y","inset-bs","inset-be","start","end","top","right","bottom","left"],"inset-x":["right","left"],"inset-y":["top","bottom"],flex:["basis","grow","shrink"],gap:["gap-x","gap-y"],p:["px","py","ps","pe","pbs","pbe","pt","pr","pb","pl"],px:["pr","pl"],py:["pt","pb"],m:["mx","my","ms","me","mbs","mbe","mt","mr","mb","ml"],mx:["mr","ml"],my:["mt","mb"],size:["w","h"],"font-size":["leading"],"fvn-normal":["fvn-ordinal","fvn-slashed-zero","fvn-figure","fvn-spacing","fvn-fraction"],"fvn-ordinal":["fvn-normal"],"fvn-slashed-zero":["fvn-normal"],"fvn-figure":["fvn-normal"],"fvn-spacing":["fvn-normal"],"fvn-fraction":["fvn-normal"],"line-clamp":["display","overflow"],rounded:["rounded-s","rounded-e","rounded-t","rounded-r","rounded-b","rounded-l","rounded-ss","rounded-se","rounded-ee","rounded-es","rounded-tl","rounded-tr","rounded-br","rounded-bl"],"rounded-s":["rounded-ss","rounded-es"],"rounded-e":["rounded-se","rounded-ee"],"rounded-t":["rounded-tl","rounded-tr"],"rounded-r":["rounded-tr","rounded-br"],"rounded-b":["rounded-br","rounded-bl"],"rounded-l":["rounded-tl","rounded-bl"],"border-spacing":["border-spacing-x","border-spacing-y"],"border-w":["border-w-x","border-w-y","border-w-s","border-w-e","border-w-bs","border-w-be","border-w-t","border-w-r","border-w-b","border-w-l"],"border-w-x":["border-w-r","border-w-l"],"border-w-y":["border-w-t","border-w-b"],"border-color":["border-color-x","border-color-y","border-color-s","border-color-e","border-color-bs","border-color-be","border-color-t","border-color-r","border-color-b","border-color-l"],"border-color-x":["border-color-r","border-color-l"],"border-color-y":["border-color-t","border-color-b"],translate:["translate-x","translate-y","translate-none"],"translate-none":["translate","translate-x","translate-y","translate-z"],"scroll-m":["scroll-mx","scroll-my","scroll-ms","scroll-me","scroll-mbs","scroll-mbe","scroll-mt","scroll-mr","scroll-mb","scroll-ml"],"scroll-mx":["scroll-mr","scroll-ml"],"scroll-my":["scroll-mt","scroll-mb"],"scroll-p":["scroll-px","scroll-py","scroll-ps","scroll-pe","scroll-pbs","scroll-pbe","scroll-pt","scroll-pr","scroll-pb","scroll-pl"],"scroll-px":["scroll-pr","scroll-pl"],"scroll-py":["scroll-pt","scroll-pb"],touch:["touch-x","touch-y","touch-pz"],"touch-x":["touch"],"touch-y":["touch"],"touch-pz":["touch"]},conflictingClassGroupModifiers:{"font-size":["leading"]},orderSensitiveModifiers:["*","**","after","backdrop","before","details-content","file","first-letter","first-line","marker","placeholder","selection"]}};var Jt=er(wr);function Y(...e){return Jt(Ce(e))}var kr=At("text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70");function J({className:e,...t}){return(0,Xt.jsx)(St,{className:Y(kr(),e),...t})}var Kt=k(L(),1);function me({className:e,...t}){return(0,Kt.jsx)("input",{className:Y("flex h-9 w-full rounded-md border border-slate-300 bg-transparent px-3 py-1 text-sm shadow-sm transition-colors","file:border-0 file:bg-transparent file:text-sm file:font-medium","placeholder:text-slate-400","focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-blue-500","disabled:cursor-not-allowed disabled:opacity-50",e),...t})}var fe=k(L(),1);var O=k(I(),1);var X=k(I(),1),Zt=k(L(),1);function Pe(e,t=[]){let o=[];function r(a,i){let c=X.createContext(i),l=o.length;o=[...o,i];let d=m=>{let{scope:b,children:x,...R}=m,v=b?.[e]?.[l]||c,C=X.useMemo(()=>R,Object.values(R));return(0,Zt.jsx)(v.Provider,{value:C,children:x})};d.displayName=a+"Provider";function u(m,b){let x=b?.[e]?.[l]||c,R=X.useContext(x);if(R)return R;if(i!==void 0)return i;throw new Error(`\`${m}\` must be used within \`${a}\``)}return[d,u]}let n=()=>{let a=o.map(i=>X.createContext(i));return function(c){let l=c?.[e]||a;return X.useMemo(()=>({[`__scope${e}`]:{...c,[e]:l}}),[c,l])}};return n.scopeName=e,[r,Rr(n,...t)]}function Rr(...e){let t=e[0];if(e.length===1)return t;let o=()=>{let r=e.map(n=>({useScope:n(),scopeName:n.scopeName}));return function(a){let i=r.reduce((c,{useScope:l,scopeName:d})=>{let m=l(a)[`__scope${d}`];return{...c,...m}},{});return X.useMemo(()=>({[`__scope${t.scopeName}`]:i}),[i])}};return o.scopeName=t.scopeName,o}var gn=!!(typeof window<"u"&&window.document&&window.document.createElement);function pe(e,t,{checkForDefaultPrevented:o=!0}={}){return function(n){if(e?.(n),o===!1||!n.defaultPrevented)return t?.(n)}}var $=k(I(),1);var Qt=k(I(),1),ae=globalThis?.document?Qt.useLayoutEffect:()=>{};var Ae=k(I(),1);var Cr=$[" useInsertionEffect ".trim().toString()]||ae;function Ee({prop:e,defaultProp:t,onChange:o=()=>{},caller:r}){let[n,a,i]=Sr({defaultProp:t,onChange:o}),c=e!==void 0,l=c?e:n;{let u=$.useRef(e!==void 0);$.useEffect(()=>{let m=u.current;m!==c&&console.warn(`${r} is changing from ${m?"controlled":"uncontrolled"} to ${c?"controlled":"uncontrolled"}. Components should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled value for the lifetime of the component.`),u.current=c},[c,r])}let d=$.useCallback(u=>{if(c){let m=Nr(u)?u(e):u;m!==e&&i.current?.(m)}else a(u)},[c,e,a,i]);return[l,d]}function Sr({defaultProp:e,onChange:t}){let[o,r]=$.useState(e),n=$.useRef(o),a=$.useRef(t);return Cr(()=>{a.current=t},[t]),$.useEffect(()=>{n.current!==o&&(a.current?.(o),n.current=o)},[o,n]),[o,r,a]}function Nr(e){return typeof e=="function"}var Ie=k(I(),1);function _e(e){let t=Ie.useRef({value:e,previous:e});return Ie.useMemo(()=>(t.current.value!==e&&(t.current.previous=t.current.value,t.current.value=e),t.current.previous),[e])}var eo=k(I(),1);function Me(e){let[t,o]=eo.useState(void 0);return ae(()=>{if(e){o({width:e.offsetWidth,height:e.offsetHeight});let r=new ResizeObserver(n=>{if(!Array.isArray(n)||!n.length)return;let a=n[0],i,c;if("borderBoxSize"in a){let l=a.borderBoxSize,d=Array.isArray(l)?l[0]:l;i=d.inlineSize,c=d.blockSize}else i=e.offsetWidth,c=e.offsetHeight;o({width:i,height:c})});return r.observe(e,{box:"border-box"}),()=>r.unobserve(e)}else o(void 0)},[e]),t}var F=k(I(),1);var to=k(I(),1);function Pr(e,t){return to.useReducer((o,r)=>t[o][r]??o,e)}var Ye=e=>{let{present:t,children:o}=e,r=Er(t),n=typeof o=="function"?o({present:r.isPresent}):F.Children.only(o),a=K(r.ref,Ar(n));return typeof o=="function"||r.isPresent?F.cloneElement(n,{ref:a}):null};Ye.displayName="Presence";function Er(e){let[t,o]=F.useState(),r=F.useRef(null),n=F.useRef(e),a=F.useRef("none"),i=e?"mounted":"unmounted",[c,l]=Pr(i,{mounted:{UNMOUNT:"unmounted",ANIMATION_OUT:"unmountSuspended"},unmountSuspended:{MOUNT:"mounted",ANIMATION_END:"unmounted"},unmounted:{MOUNT:"mounted"}});return F.useEffect(()=>{let d=Te(r.current);a.current=c==="mounted"?d:"none"},[c]),ae(()=>{let d=r.current,u=n.current;if(u!==e){let b=a.current,x=Te(d);e?l("MOUNT"):x==="none"||d?.display==="none"?l("UNMOUNT"):l(u&&b!==x?"ANIMATION_OUT":"UNMOUNT"),n.current=e}},[e,l]),ae(()=>{if(t){let d,u=t.ownerDocument.defaultView??window,m=x=>{let v=Te(r.current).includes(CSS.escape(x.animationName));if(x.target===t&&v&&(l("ANIMATION_END"),!n.current)){let C=t.style.animationFillMode;t.style.animationFillMode="forwards",d=u.setTimeout(()=>{t.style.animationFillMode==="forwards"&&(t.style.animationFillMode=C)})}},b=x=>{x.target===t&&(a.current=Te(r.current))};return t.addEventListener("animationstart",b),t.addEventListener("animationcancel",m),t.addEventListener("animationend",m),()=>{u.clearTimeout(d),t.removeEventListener("animationstart",b),t.removeEventListener("animationcancel",m),t.removeEventListener("animationend",m)}}else l("ANIMATION_END")},[t,l]),{isPresent:["mounted","unmountSuspended"].includes(c),ref:F.useCallback(d=>{r.current=d?getComputedStyle(d):null,o(d)},[])}}function Te(e){return e?.animationName||"none"}function Ar(e){let t=Object.getOwnPropertyDescriptor(e.props,"ref")?.get,o=t&&"isReactWarning"in t&&t.isReactWarning;return o?e.ref:(t=Object.getOwnPropertyDescriptor(e,"ref")?.get,o=t&&"isReactWarning"in t&&t.isReactWarning,o?e.props.ref:e.props.ref||e.ref)}var ro=k(I(),1),zr=k(dt(),1);var E=k(I(),1);var Oe=k(L(),1);function oo(e){let t=Ir(e),o=E.forwardRef((r,n)=>{let{children:a,...i}=r,c=E.Children.toArray(a),l=c.find(Mr);if(l){let d=l.props.children,u=c.map(m=>m===l?E.Children.count(d)>1?E.Children.only(null):E.isValidElement(d)?d.props.children:null:m);return(0,Oe.jsx)(t,{...i,ref:n,children:E.isValidElement(d)?E.cloneElement(d,void 0,u):null})}return(0,Oe.jsx)(t,{...i,ref:n,children:a})});return o.displayName=`${e}.Slot`,o}function Ir(e){let t=E.forwardRef((o,r)=>{let{children:n,...a}=o;if(E.isValidElement(n)){let i=Or(n),c=Tr(a,n.props);return n.type!==E.Fragment&&(c.ref=r?de(r,i):i),E.cloneElement(n,c)}return E.Children.count(n)>1?E.Children.only(null):null});return t.displayName=`${e}.SlotClone`,t}var _r=Symbol("radix.slottable");function Mr(e){return E.isValidElement(e)&&typeof e.type=="function"&&"__radixId"in e.type&&e.type.__radixId===_r}function Tr(e,t){let o={...t};for(let r in t){let n=e[r],a=t[r];/^on[A-Z]/.test(r)?n&&a?o[r]=(...c)=>{let l=a(...c);return n(...c),l}:n&&(o[r]=n):r==="style"?o[r]={...n,...a}:r==="className"&&(o[r]=[n,a].filter(Boolean).join(" "))}return{...e,...o}}function Or(e){let t=Object.getOwnPropertyDescriptor(e.props,"ref")?.get,o=t&&"isReactWarning"in t&&t.isReactWarning;return o?e.ref:(t=Object.getOwnPropertyDescriptor(e,"ref")?.get,o=t&&"isReactWarning"in t&&t.isReactWarning,o?e.props.ref:e.props.ref||e.ref)}var no=k(L(),1),Lr=["a","button","div","form","h2","h3","img","input","label","li","nav","ol","p","select","span","svg","ul"],ie=Lr.reduce((e,t)=>{let o=oo(`Primitive.${t}`),r=ro.forwardRef((n,a)=>{let{asChild:i,...c}=n,l=i?o:t;return typeof window<"u"&&(window[Symbol.for("radix-ui")]=!0),(0,no.jsx)(l,{...c,ref:a})});return r.displayName=`Primitive.${t}`,{...e,[t]:r}},{});var B=k(L(),1),ze="Checkbox",[Fr,Dn]=Pe(ze),[jr,Je]=Fr(ze);function Br(e){let{__scopeCheckbox:t,checked:o,children:r,defaultChecked:n,disabled:a,form:i,name:c,onCheckedChange:l,required:d,value:u="on",internal_do_not_use_render:m}=e,[b,x]=Ee({prop:o,defaultProp:n??!1,onChange:l,caller:ze}),[R,v]=O.useState(null),[C,y]=O.useState(null),S=O.useRef(!1),z=R?!!i||!!R.closest("form"):!0,D={checked:b,disabled:a,setChecked:x,control:R,setControl:v,name:c,form:i,value:u,hasConsumerStoppedPropagationRef:S,required:d,defaultChecked:te(n)?!1:n,isFormControl:z,bubbleInput:C,setBubbleInput:y};return(0,B.jsx)(jr,{scope:t,...D,children:Dr(m)?m(D):r})}var so="CheckboxTrigger",ao=O.forwardRef(({__scopeCheckbox:e,onKeyDown:t,onClick:o,...r},n)=>{let{control:a,value:i,disabled:c,checked:l,required:d,setControl:u,setChecked:m,hasConsumerStoppedPropagationRef:b,isFormControl:x,bubbleInput:R}=Je(so,e),v=K(n,u),C=O.useRef(l);return O.useEffect(()=>{let y=a?.form;if(y){let S=()=>m(C.current);return y.addEventListener("reset",S),()=>y.removeEventListener("reset",S)}},[a,m]),(0,B.jsx)(ie.button,{type:"button",role:"checkbox","aria-checked":te(l)?"mixed":l,"aria-required":d,"data-state":uo(l),"data-disabled":c?"":void 0,disabled:c,value:i,...r,ref:v,onKeyDown:pe(t,y=>{y.key==="Enter"&&y.preventDefault()}),onClick:pe(o,y=>{m(S=>te(S)?!0:!S),R&&x&&(b.current=y.isPropagationStopped(),b.current||y.stopPropagation())})})});ao.displayName=so;var Xe=O.forwardRef((e,t)=>{let{__scopeCheckbox:o,name:r,checked:n,defaultChecked:a,required:i,disabled:c,value:l,onCheckedChange:d,form:u,...m}=e;return(0,B.jsx)(Br,{__scopeCheckbox:o,checked:n,defaultChecked:a,disabled:c,required:i,onCheckedChange:d,name:r,form:u,value:l,internal_do_not_use_render:({isFormControl:b})=>(0,B.jsxs)(B.Fragment,{children:[(0,B.jsx)(ao,{...m,ref:t,__scopeCheckbox:o}),b&&(0,B.jsx)(co,{__scopeCheckbox:o})]})})});Xe.displayName=ze;var io="CheckboxIndicator",Ke=O.forwardRef((e,t)=>{let{__scopeCheckbox:o,forceMount:r,...n}=e,a=Je(io,o);return(0,B.jsx)(Ye,{present:r||te(a.checked)||a.checked===!0,children:(0,B.jsx)(ie.span,{"data-state":uo(a.checked),"data-disabled":a.disabled?"":void 0,...n,ref:t,style:{pointerEvents:"none",...e.style}})})});Ke.displayName=io;var lo="CheckboxBubbleInput",co=O.forwardRef(({__scopeCheckbox:e,...t},o)=>{let{control:r,hasConsumerStoppedPropagationRef:n,checked:a,defaultChecked:i,required:c,disabled:l,name:d,value:u,form:m,bubbleInput:b,setBubbleInput:x}=Je(lo,e),R=K(o,x),v=_e(a),C=Me(r);O.useEffect(()=>{let S=b;if(!S)return;let z=window.HTMLInputElement.prototype,U=Object.getOwnPropertyDescriptor(z,"checked").set,H=!n.current;if(v!==a&&U){let oe=new Event("click",{bubbles:H});S.indeterminate=te(a),U.call(S,te(a)?!1:a),S.dispatchEvent(oe)}},[b,v,a,n]);let y=O.useRef(te(a)?!1:a);return(0,B.jsx)(ie.input,{type:"checkbox","aria-hidden":!0,defaultChecked:i??y.current,required:c,disabled:l,name:d,value:u,form:m,...t,tabIndex:-1,ref:R,style:{...t.style,...C,position:"absolute",pointerEvents:"none",opacity:0,margin:0,transform:"translateX(-100%)"}})});co.displayName=lo;function Dr(e){return typeof e=="function"}function te(e){return e==="indeterminate"}function uo(e){return te(e)?"indeterminate":e?"checked":"unchecked"}function Ze({className:e,...t}){return(0,fe.jsx)(Xe,{className:Y("peer h-4 w-4 shrink-0 rounded-sm border border-slate-300 shadow","focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-slate-400","disabled:cursor-not-allowed disabled:opacity-50","data-[state=checked]:bg-blue-600 data-[state=checked]:text-white data-[state=checked]:border-blue-600",e),...t,children:(0,fe.jsx)(Ke,{className:"flex items-center justify-center text-current",children:(0,fe.jsx)("svg",{className:"h-3 w-3",viewBox:"0 0 12 12",fill:"none",stroke:"currentColor",strokeWidth:"2",children:(0,fe.jsx)("polyline",{points:"2,6 5,9 10,3"})})})})}var Qe=k(L(),1);var V=k(I(),1);var le=k(L(),1),Le="Switch",[Gr,Xn]=Pe(Le),[Vr,Wr]=Gr(Le),mo=V.forwardRef((e,t)=>{let{__scopeSwitch:o,name:r,checked:n,defaultChecked:a,required:i,disabled:c,value:l="on",onCheckedChange:d,form:u,...m}=e,[b,x]=V.useState(null),R=K(t,z=>x(z)),v=V.useRef(!1),C=b?u||!!b.closest("form"):!0,[y,S]=Ee({prop:n,defaultProp:a??!1,onChange:d,caller:Le});return(0,le.jsxs)(Vr,{scope:o,checked:y,disabled:c,children:[(0,le.jsx)(ie.button,{type:"button",role:"switch","aria-checked":y,"aria-required":i,"data-state":ho(y),"data-disabled":c?"":void 0,disabled:c,value:l,...m,ref:R,onClick:pe(e.onClick,z=>{S(D=>!D),C&&(v.current=z.isPropagationStopped(),v.current||z.stopPropagation())})}),C&&(0,le.jsx)(bo,{control:b,bubbles:!v.current,name:r,value:l,checked:y,required:i,disabled:c,form:u,style:{transform:"translateX(-100%)"}})]})});mo.displayName=Le;var po="SwitchThumb",fo=V.forwardRef((e,t)=>{let{__scopeSwitch:o,...r}=e,n=Wr(po,o);return(0,le.jsx)(ie.span,{"data-state":ho(n.checked),"data-disabled":n.disabled?"":void 0,...r,ref:t})});fo.displayName=po;var Ur="SwitchBubbleInput",bo=V.forwardRef(({__scopeSwitch:e,control:t,checked:o,bubbles:r=!0,...n},a)=>{let i=V.useRef(null),c=K(i,a),l=_e(o),d=Me(t);return V.useEffect(()=>{let u=i.current;if(!u)return;let m=window.HTMLInputElement.prototype,x=Object.getOwnPropertyDescriptor(m,"checked").set;if(l!==o&&x){let R=new Event("click",{bubbles:r});x.call(u,o),u.dispatchEvent(R)}},[l,o,r]),(0,le.jsx)("input",{type:"checkbox","aria-hidden":!0,defaultChecked:o,...n,tabIndex:-1,ref:c,style:{...n.style,...d,position:"absolute",pointerEvents:"none",opacity:0,margin:0}})});bo.displayName=Ur;function ho(e){return e?"checked":"unchecked"}var go=mo,xo=fo;function et({className:e,...t}){return(0,Qe.jsx)(go,{className:Y("peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors","focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-slate-400 focus-visible:ring-offset-2","disabled:cursor-not-allowed disabled:opacity-50","data-[state=checked]:bg-blue-600 data-[state=unchecked]:bg-slate-200",e),...t,children:(0,Qe.jsx)(xo,{className:Y("pointer-events-none block h-4 w-4 rounded-full bg-white shadow-lg ring-0 transition-transform","data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0")})})}var s=k(L(),1);function W({children:e,className:t=""}){return(0,s.jsx)("div",{className:`bg-white rounded-xl shadow-sm border border-slate-200 p-6 ${t}`,children:e})}function vo({children:e,variant:t="default"}){return(0,s.jsx)("span",{className:`inline-flex px-2.5 py-0.5 rounded-md text-xs font-semibold ${{default:"bg-blue-100 text-blue-700",success:"bg-green-100 text-green-700",warn:"bg-amber-100 text-amber-700"}[t]}`,children:e})}function yo({children:e,onClick:t,disabled:o=!1,outline:r=!1}){return(0,s.jsx)("button",{onClick:t,disabled:o,className:`inline-flex items-center px-4 py-2 rounded-lg text-sm font-medium transition-colors disabled:opacity-50 cursor-pointer ${r?"border border-slate-300 text-slate-700 hover:bg-slate-50":"bg-blue-500 hover:bg-blue-600 text-white"}`,children:e})}function qr(){return(0,s.jsxs)("div",{children:[(0,s.jsxs)("p",{className:"text-slate-700 text-sm font-medium mb-3",children:["Current route: ",(0,s.jsx)("code",{className:"bg-slate-100 px-1 rounded",children:"/"})]}),(0,s.jsxs)("div",{className:"flex gap-2 flex-wrap",children:[(0,s.jsx)(we,{to:"/about",className:"inline-flex items-center px-3 py-1.5 rounded-lg bg-blue-500 hover:bg-blue-600 text-white text-xs font-medium",children:"\u2192 /about"}),(0,s.jsx)(we,{to:"/user/42",className:"inline-flex items-center px-3 py-1.5 rounded-lg border border-slate-300 hover:bg-slate-50 text-slate-700 text-xs font-medium",children:"\u2192 /user/42"}),(0,s.jsx)(we,{to:"/user/hello",className:"inline-flex items-center px-3 py-1.5 rounded-lg border border-slate-300 hover:bg-slate-50 text-slate-700 text-xs font-medium",children:"\u2192 /user/hello"})]})]})}function Yr(){let e=We();return(0,s.jsxs)("div",{children:[(0,s.jsxs)("p",{className:"text-slate-700 text-sm font-medium mb-3",children:["Current route: ",(0,s.jsx)("code",{className:"bg-slate-100 px-1 rounded",children:"/about"})]}),(0,s.jsx)("p",{className:"text-slate-500 text-xs mb-3",children:"useNavigate() programmatic navigation (without Link component):"}),(0,s.jsxs)("div",{className:"flex gap-2",children:[(0,s.jsx)("button",{onClick:()=>e("/"),className:"inline-flex items-center px-3 py-1.5 rounded-lg border border-slate-300 hover:bg-slate-50 text-slate-700 text-xs font-medium cursor-pointer",children:"\u2190 Back to /"}),(0,s.jsx)("button",{onClick:()=>e("/user/99"),className:"inline-flex items-center px-3 py-1.5 rounded-lg bg-blue-500 hover:bg-blue-600 text-white text-xs font-medium cursor-pointer",children:"\u2192 /user/99"})]})]})}function Jr(){let{id:e}=ut(),t=We();return(0,s.jsxs)("div",{children:[(0,s.jsxs)("p",{className:"text-slate-700 text-sm font-medium mb-1",children:["Current route: ",(0,s.jsx)("code",{className:"bg-slate-100 px-1 rounded",children:"/user/:id"})]}),(0,s.jsxs)("p",{className:"text-slate-500 text-xs mb-3",children:["useParams() dynamic segment: ",(0,s.jsxs)("code",{className:"bg-slate-100 px-1 rounded",children:['id = "',e,'"']})]}),(0,s.jsx)("button",{onClick:()=>t("/"),className:"inline-flex items-center px-3 py-1.5 rounded-lg border border-slate-300 hover:bg-slate-50 text-slate-700 text-xs font-medium cursor-pointer",children:"\u2190 Back to /"})]})}function Xr(){let[e,t]=(0,_.useState)(""),[o,r]=(0,_.useState)(""),[n,a]=(0,_.useState)(!1),[i,c]=(0,_.useState)(!1),[l,d]=(0,_.useState)(!1),u=(0,_.useId)(),m=(0,_.useId)(),b=(0,_.useId)(),x=(0,_.useId)();function R(v){v.preventDefault(),d(!0)}return(0,s.jsxs)("div",{className:"space-y-4",children:[(0,s.jsxs)(W,{children:[(0,s.jsx)("h2",{className:"font-semibold text-slate-900 mb-2",children:"shadcn/ui Components"}),(0,s.jsxs)("p",{className:"text-slate-500 text-xs leading-relaxed",children:["All components below are imported from ",(0,s.jsx)("code",{className:"bg-slate-100 px-1 rounded",children:"stc/lib/ui/"}),", following the same ",(0,s.jsx)("code",{className:"bg-slate-100 px-1 rounded",children:"components/ui/"})," structure recommended by shadcn/ui. Built on Radix UI primitives, styled with Tailwind CSS. In dev mode, the framework auto-scans all bare imports and generates the import map automatically."]})]}),(0,s.jsxs)(W,{children:[(0,s.jsx)("h2",{className:"font-semibold text-slate-900 mb-4",children:"Label + Input"}),(0,s.jsxs)("div",{className:"grid gap-4",children:[(0,s.jsxs)("div",{className:"grid gap-1.5",children:[(0,s.jsx)(J,{htmlFor:u,children:"Username"}),(0,s.jsx)(me,{id:u,type:"text",placeholder:"Enter your username",value:e,onChange:v=>t(v.target.value)})]}),(0,s.jsxs)("div",{className:"grid gap-1.5",children:[(0,s.jsx)(J,{htmlFor:m,children:"Email"}),(0,s.jsx)(me,{id:m,type:"email",placeholder:"you@example.com",value:o,onChange:v=>r(v.target.value)})]})]}),(0,s.jsx)("p",{className:"text-xs text-slate-400 mt-3",children:"Click the Label text to focus the corresponding input (Radix UI a11y semantics)"})]}),(0,s.jsxs)(W,{children:[(0,s.jsx)("h2",{className:"font-semibold text-slate-900 mb-4",children:"Checkbox"}),(0,s.jsxs)("div",{className:"flex items-center gap-2",children:[(0,s.jsx)(Ze,{id:b,checked:n,onCheckedChange:a}),(0,s.jsx)(J,{htmlFor:b,children:"I have read and agree to the Terms of Service"})]}),(0,s.jsxs)("p",{className:"text-xs text-slate-400 mt-3",children:["Value: ",(0,s.jsx)("code",{className:"bg-slate-100 px-1 rounded",children:String(n)}),"\xA0(supports ",(0,s.jsx)("code",{className:"bg-slate-100 px-1 rounded",children:"true | false | 'indeterminate'"})," tri-state)"]})]}),(0,s.jsxs)(W,{children:[(0,s.jsx)("h2",{className:"font-semibold text-slate-900 mb-4",children:"Switch"}),(0,s.jsxs)("div",{className:"flex items-center gap-2",children:[(0,s.jsx)(et,{id:x,checked:i,onCheckedChange:c}),(0,s.jsx)(J,{htmlFor:x,children:"Subscribe to product updates"})]}),(0,s.jsxs)("p",{className:"text-xs text-slate-400 mt-3",children:["Value: ",(0,s.jsx)("code",{className:"bg-slate-100 px-1 rounded",children:i?"true":"false"})]})]}),(0,s.jsxs)(W,{children:[(0,s.jsx)("h2",{className:"font-semibold text-slate-900 mb-4",children:"Combined Form (Submit Demo)"}),l?(0,s.jsxs)("div",{className:"space-y-2 text-sm",children:[(0,s.jsx)("p",{className:"text-green-700 font-medium",children:"\u2713 Submitted! Received data:"}),(0,s.jsx)("pre",{className:"bg-slate-50 border border-slate-200 rounded-lg p-3 text-xs text-slate-700 overflow-auto",children:JSON.stringify({name:e,email:o,agree:!!n,newsletter:i},null,2)}),(0,s.jsx)("button",{onClick:()=>d(!1),className:"text-xs text-blue-500 hover:underline cursor-pointer",children:"Reset"})]}):(0,s.jsxs)("form",{onSubmit:R,className:"space-y-4",children:[(0,s.jsxs)("div",{className:"grid gap-1.5",children:[(0,s.jsxs)(J,{htmlFor:`${u}-form`,children:["Username ",(0,s.jsx)("span",{className:"text-red-500",children:"*"})]}),(0,s.jsx)(me,{id:`${u}-form`,required:!0,placeholder:"At least 2 characters",value:e,onChange:v=>t(v.target.value)})]}),(0,s.jsxs)("div",{className:"grid gap-1.5",children:[(0,s.jsxs)(J,{htmlFor:`${m}-form`,children:["Email ",(0,s.jsx)("span",{className:"text-red-500",children:"*"})]}),(0,s.jsx)(me,{id:`${m}-form`,type:"email",required:!0,placeholder:"you@example.com",value:o,onChange:v=>r(v.target.value)})]}),(0,s.jsxs)("div",{className:"flex items-center gap-2",children:[(0,s.jsx)(Ze,{id:`${b}-form`,checked:n,onCheckedChange:a,required:!0}),(0,s.jsx)(J,{htmlFor:`${b}-form`,children:"Agree to terms"})]}),(0,s.jsxs)("div",{className:"flex items-center gap-2",children:[(0,s.jsx)(et,{id:`${x}-form`,checked:i,onCheckedChange:c}),(0,s.jsx)(J,{htmlFor:`${x}-form`,children:"Subscribe"})]}),(0,s.jsx)("button",{type:"submit",className:"inline-flex items-center px-4 py-2 rounded-lg bg-blue-500 hover:bg-blue-600 text-white text-sm font-medium cursor-pointer",children:"Submit"})]})]})]})}function Fe({title:e,serverTime:t,node:o,_urlBase:r,_urlStc:n,_staticVer:a}){let[i,c]=(0,_.useState)(0),[l,d]=(0,_.useState)("overview"),[u,m]=(0,_.useState)(null),[b,x]=(0,_.useState)(!1),[R,v]=(0,_.useState)(!1);(0,_.useEffect)(()=>{v(!0)},[]);function C(y){x(!0),m(null),fetch(y).then(S=>S.json()).then(S=>{m(JSON.stringify(S,null,2)),x(!1)}).catch(S=>{m(`Error: ${S.message}`),x(!1)})}return(0,s.jsxs)("html",{lang:"en",children:[(0,s.jsxs)("head",{children:[(0,s.jsx)("meta",{charSet:"UTF-8"}),(0,s.jsx)("meta",{name:"viewport",content:"width=device-width, initial-scale=1.0"}),(0,s.jsx)("title",{children:e}),(0,s.jsx)("link",{href:`${n}view/react.page.css?v=${a}`,rel:"stylesheet"})]}),(0,s.jsx)("body",{className:"bg-slate-50 min-h-screen font-sans",children:(0,s.jsxs)("div",{className:"max-w-3xl mx-auto px-4 py-10 space-y-6",children:[(0,s.jsxs)("div",{children:[(0,s.jsxs)("div",{className:"flex gap-2 mb-2",children:[(0,s.jsx)(vo,{children:"SSR \xB7 Kebab"}),(0,s.jsx)(vo,{variant:R?"success":"warn",children:R?"Hydrated \u2713":"Rendering..."})]}),(0,s.jsx)("h1",{className:"text-2xl font-bold text-slate-900",children:e}),(0,s.jsxs)("p",{className:"text-slate-500 text-sm mt-1",children:[t," \xB7 ",o]})]}),(0,s.jsx)("div",{className:"flex gap-1 bg-slate-100 p-1 rounded-lg w-fit",children:["overview","routing","fetch","shadcn"].map(y=>(0,s.jsx)("button",{onClick:()=>d(y),className:["px-4 py-2 rounded-md text-sm font-medium transition-colors cursor-pointer",l===y?"bg-white shadow text-slate-900":"text-slate-500 hover:text-slate-900"].join(" "),children:y.charAt(0).toUpperCase()+y.slice(1)},y))}),l==="overview"&&(0,s.jsxs)("div",{className:"space-y-4",children:[(0,s.jsxs)(W,{children:[(0,s.jsx)("h2",{className:"font-semibold text-slate-900 mb-1",children:"Counter\uFF08useState + hydration\uFF09"}),(0,s.jsx)("p",{className:"text-slate-500 text-xs mb-4",children:"SSR renders with initial value 0; props are serialized as inline JSON. After hydration the state becomes interactive \u2014 click the buttons to test:"}),(0,s.jsxs)("div",{className:"flex items-center gap-4",children:[(0,s.jsx)("button",{onClick:()=>c(y=>y-1),className:"w-10 h-10 rounded-lg border border-slate-300 hover:bg-slate-50 font-bold text-slate-700 text-xl cursor-pointer",children:"\u2212"}),(0,s.jsx)("span",{className:"text-3xl font-bold text-slate-900 w-10 text-center tabular-nums",children:i}),(0,s.jsx)("button",{onClick:()=>c(y=>y+1),className:"w-10 h-10 rounded-lg bg-blue-500 hover:bg-blue-600 text-white font-bold text-xl cursor-pointer",children:"+"})]})]}),(0,s.jsxs)(W,{children:[(0,s.jsx)("h2",{className:"font-semibold text-slate-900 mb-3",children:"Server Props (from Ctr method)"}),(0,s.jsxs)("p",{className:"text-slate-500 text-xs mb-3",children:["Passed via"," ",(0,s.jsx)("code",{className:"bg-slate-100 px-1 rounded",children:"_loadReactPage(path, props)"}),". The framework auto-injects constants like _urlBase and serializes all props as inline JSON, reused directly during client hydration \u2014 no extra request needed."]}),(0,s.jsx)("div",{className:"space-y-2",children:[["serverTime",t],["node",o],["_urlBase",r],["_urlStc",n]].map(([y,S])=>(0,s.jsxs)("div",{className:"flex text-xs gap-4",children:[(0,s.jsx)("span",{className:"text-slate-400 font-mono w-28 shrink-0",children:y}),(0,s.jsx)("span",{className:"font-mono text-slate-700 truncate",children:S})]},y))})]}),(0,s.jsxs)(W,{children:[(0,s.jsx)("h2",{className:"font-semibold text-slate-900 mb-2",children:"Recommended Directory Structure"}),(0,s.jsx)("pre",{className:"bg-slate-50 border border-slate-200 rounded-lg p-4 text-xs leading-relaxed text-slate-700",children:`stc/
+  lib/
+    utils.ts            # cn() utility
+    ui/
+      label.tsx         # shadcn Label
+      input.tsx         # shadcn Input
+      checkbox.tsx      # shadcn Checkbox
+      switch.tsx        # shadcn Switch
+  view/
+    react-page.tsx      # Page component (import + compose)`}),(0,s.jsxs)("p",{className:"text-slate-500 text-xs mt-3",children:["Mirrors the shadcn/ui ",(0,s.jsx)("code",{className:"bg-slate-100 px-1 rounded",children:"components/ui/"})," convention. In dev mode, the framework auto-scans imports \u2014 no manual import map configuration needed."]})]})]}),l==="routing"&&(0,s.jsxs)(mt,{children:[(0,s.jsxs)(W,{children:[(0,s.jsx)("h2",{className:"font-semibold text-slate-900 mb-1",children:"React Router Demo"}),(0,s.jsxs)("p",{className:"text-slate-500 text-xs mb-4",children:["Uses ",(0,s.jsx)("code",{className:"bg-slate-100 px-1 rounded",children:"MemoryRouter"})," ","to demonstrate route navigation, dynamic params (useParams), and programmatic navigation (useNavigate). Works on both server SSR and client hydration with no extra server configuration."]}),(0,s.jsxs)(pt,{children:[(0,s.jsx)(ye,{path:"/",element:(0,s.jsx)(qr,{})}),(0,s.jsx)(ye,{path:"/about",element:(0,s.jsx)(Yr,{})}),(0,s.jsx)(ye,{path:"/user/:id",element:(0,s.jsx)(Jr,{})})]})]}),(0,s.jsxs)(W,{className:"mt-4",children:[(0,s.jsx)("h2",{className:"font-semibold text-slate-900 mb-2",children:"Full-Page BrowserRouter Setup"}),(0,s.jsx)("p",{className:"text-slate-500 text-xs mb-3",children:"To let React Router manage the real URL (e.g. /app, /app/about), replace MemoryRouter with BrowserRouter and route all sub-paths to the same Ctr method on the server:"}),(0,s.jsx)("pre",{className:"bg-slate-50 border border-slate-200 rounded-lg p-4 text-xs overflow-auto leading-relaxed text-slate-700",children:`// 1. route.json: \u5C06\u6240\u6709\u5B50\u8DEF\u5F84\u8DEF\u7531\u5230\u540C\u4E00 Ctr \u65B9\u6CD5
+{
+  "app":   "ctr/app@reactPage",
+  "app\\/.*": "ctr/app@reactPage"
+}
+
+// 2. Ctr \u65B9\u6CD5\uFF1A\u4F20\u5165 router: 'browser'\uFF0C\u6846\u67B6\u81EA\u52A8\u5904\u7406 SSR\uFF08StaticRouter\uFF09\u548C\u5BA2\u6237\u7AEF\uFF08BrowserRouter\uFF09
+await this._loadReactPage('view/my', { ...props }, {
+  router: 'browser',
+  routerBase: 'app',  // basename\uFF0C\u76F8\u5BF9\u4E8E urlBase
+});
+
+// 3. \u7EC4\u4EF6\uFF1A\u76F4\u63A5\u4F7F\u7528 Routes/Route/Link\uFF0C\u4E0D\u9700\u8981\u5305\u88F9\u4EFB\u4F55 Router \u5C42
+<Routes>
+  <Route path="/" element={<Home />} />
+  <Route path="/user/:id" element={<User />} />
+</Routes>`})]})]}),l==="shadcn"&&(0,s.jsx)(Xr,{}),l==="fetch"&&(0,s.jsxs)(W,{children:[(0,s.jsx)("h2",{className:"font-semibold text-slate-900 mb-3",children:"Client Fetch Demo"}),(0,s.jsx)("p",{className:"text-slate-500 text-xs mb-4",children:"After hydration, click a button to send a GET request. setState triggers a partial re-render \u2014 no page refresh."}),(0,s.jsxs)("div",{className:"flex gap-3 flex-wrap",children:[(0,s.jsx)(yo,{onClick:()=>C(`${r}test/json?type=4`),disabled:b,children:b?"Fetching...":"GET /test/json?type=4"}),(0,s.jsx)(yo,{outline:!0,onClick:()=>C(`${r}test/json?type=2`),disabled:b,children:"GET type=2 (error resp)"})]}),u!==null?(0,s.jsx)("pre",{className:"mt-4 bg-slate-50 border border-slate-200 rounded-lg p-4 text-xs overflow-auto leading-relaxed text-slate-700",children:u}):(0,s.jsx)("p",{className:"mt-3 text-slate-400 text-xs",children:"Click a button above to see the response"})]})]})})]})}var wo=document.getElementById("__kebab_props__");if(wo){let e=JSON.parse(wo.textContent??"{}");typeof e._routerBase=="string"?(0,tt.hydrateRoot)(document,(0,je.createElement)(ft,{basename:e._routerBase},(0,je.createElement)(Fe,e))):(0,tt.hydrateRoot)(document,(0,je.createElement)(Fe,e))}

package/www/example/stc/view/react.page.css

@@ -0,0 +1,2 @@
+/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-500:oklch(63.7% .237 25.331);--color-red-600:oklch(57.7% .245 27.325);--color-amber-100:oklch(96.2% .059 95.617);--color-amber-700:oklch(55.5% .163 48.998);--color-green-100:oklch(96.2% .044 156.743);--color-green-700:oklch(52.7% .154 150.069);--color-blue-50:oklch(97% .014 254.604);--color-blue-100:oklch(93.2% .032 255.585);--color-blue-500:oklch(62.3% .214 259.815);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-slate-50:oklch(98.4% .003 247.858);--color-slate-100:oklch(96.8% .007 247.896);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-300:oklch(86.9% .022 252.894);--color-slate-400:oklch(70.4% .04 256.788);--color-slate-500:oklch(55.4% .046 257.417);--color-slate-600:oklch(44.6% .043 257.281);--color-slate-700:oklch(37.2% .044 257.287);--color-slate-800:oklch(27.9% .041 260.031);--color-slate-900:oklch(20.8% .042 265.755);--color-white:#fff;--spacing:.25rem;--container-2xl:42rem;--container-3xl:48rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--leading-relaxed:1.625;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-none{pointer-events:none}.static{position:static}.start{inset-inline-start:var(--spacing)}.end{inset-inline-end:var(--spacing)}.mx-auto{margin-inline:auto}.mt-1{margin-top:calc(var(--spacing) * 1)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mb-1{margin-bottom:calc(var(--spacing) * 1)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.inline{display:inline}.inline-flex{display:inline-flex}.table{display:table}.h-3{height:calc(var(--spacing) * 3)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.min-h-screen{min-height:100vh}.w-3{width:calc(var(--spacing) * 3)}.w-4{width:calc(var(--spacing) * 4)}.w-9{width:calc(var(--spacing) * 9)}.w-10{width:calc(var(--spacing) * 10)}.w-28{width:calc(var(--spacing) * 28)}.w-fit{width:fit-content}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-3xl{max-width:var(--container-3xl)}.shrink-0{flex-shrink:0}.cursor-pointer{cursor:pointer}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-1{gap:calc(var(--spacing) * 1)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}:where(.space-y-1\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-slate-200{border-color:var(--color-slate-200)}.border-slate-300{border-color:var(--color-slate-300)}.border-transparent{border-color:#0000}.bg-amber-100{background-color:var(--color-amber-100)}.bg-blue-50{background-color:var(--color-blue-50)}.bg-blue-100{background-color:var(--color-blue-100)}.bg-blue-500{background-color:var(--color-blue-500)}.bg-green-100{background-color:var(--color-green-100)}.bg-slate-50{background-color:var(--color-slate-50)}.bg-slate-100{background-color:var(--color-slate-100)}.bg-slate-200{background-color:var(--color-slate-200)}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.p-1{padding:calc(var(--spacing) * 1)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.p-8{padding:calc(var(--spacing) * 8)}.px-1{padding-inline:calc(var(--spacing) * 1)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:calc(var(--spacing) * 1)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-10{padding-block:calc(var(--spacing) * 10)}.text-center{text-align:center}.font-mono{font-family:var(--font-mono)}.font-sans{font-family:var(--font-sans)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-amber-700{color:var(--color-amber-700)}.text-blue-500{color:var(--color-blue-500)}.text-blue-700{color:var(--color-blue-700)}.text-current{color:currentColor}.text-green-700{color:var(--color-green-700)}.text-red-500{color:var(--color-red-500)}.text-red-600{color:var(--color-red-600)}.text-slate-400{color:var(--color-slate-400)}.text-slate-500{color:var(--color-slate-500)}.text-slate-600{color:var(--color-slate-600)}.text-slate-700{color:var(--color-slate-700)}.text-slate-800{color:var(--color-slate-800)}.text-slate-900{color:var(--color-slate-900)}.text-white{color:var(--color-white)}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-0{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.peer-disabled\:cursor-not-allowed:is(:where(.peer):disabled~*){cursor:not-allowed}.peer-disabled\:opacity-70:is(:where(.peer):disabled~*){opacity:.7}.file\:border-0::file-selector-button{border-style:var(--tw-border-style);border-width:0}.file\:bg-transparent::file-selector-button{background-color:#0000}.file\:text-sm::file-selector-button{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.file\:font-medium::file-selector-button{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.placeholder\:text-slate-400::placeholder{color:var(--color-slate-400)}@media (hover:hover){.hover\:bg-blue-600:hover{background-color:var(--color-blue-600)}.hover\:bg-slate-50:hover{background-color:var(--color-slate-50)}.hover\:bg-slate-100:hover{background-color:var(--color-slate-100)}.hover\:bg-slate-300:hover{background-color:var(--color-slate-300)}.hover\:text-slate-600:hover{color:var(--color-slate-600)}.hover\:text-slate-900:hover{color:var(--color-slate-900)}.hover\:underline:hover{text-decoration-line:underline}}.focus-visible\:ring-1:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-blue-500:focus-visible{--tw-ring-color:var(--color-blue-500)}.focus-visible\:ring-slate-400:focus-visible{--tw-ring-color:var(--color-slate-400)}.focus-visible\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.focus-visible\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}.data-\[state\=checked\]\:translate-x-4[data-state=checked]{--tw-translate-x:calc(var(--spacing) * 4);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=checked\]\:border-blue-600[data-state=checked]{border-color:var(--color-blue-600)}.data-\[state\=checked\]\:bg-blue-600[data-state=checked]{background-color:var(--color-blue-600)}.data-\[state\=checked\]\:text-white[data-state=checked]{color:var(--color-white)}.data-\[state\=unchecked\]\:translate-x-0[data-state=unchecked]{--tw-translate-x:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=unchecked\]\:bg-slate-200[data-state=unchecked]{background-color:var(--color-slate-200)}@media (min-width:40rem){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}

package/www/example/stc/view/{react-page.d.ts → react.page.d.ts}

@@ -1,25 +1,35 @@
 /**
  * --- Kebab React 全页面示例组件 ---
  *
+ * node ./source/main build -d source/www/example/stc
+ *
+ * 【文件命名约定】
+ * 文件名以 .page.tsx 结尾的为页面入口（本文件），框架会将其打包为 .page.bundle.js。
+ * 其余 .tsx 均视为组件（如 stc/lib/ui/button.tsx），不会被单独打包。
+ *
  * 【使用方式】
- * 在 Ctr 方法中调用 _loadReactPage('view/react-page', { ...props })，
- * 框架自动注入 _importMapJson / _hydrateScript / _propsJson 三个内部 props，
- * 组件在 <head> 和 <body> 末尾渲染对应的 <script> 标签即可，其余部分与普通 React 组件无异。
+ * 在 Ctr 方法中调用 _loadReactPage('view/react', { ...props })，
+ * 框架自动将 import map、props JSON、水合脚本注入 HTML，组件只写业务逻辑，无需任何框架样板代码。
  *
  * 【多页面 / 共用组件】
- * 将公共 UI（如 Button/Card/Badge）放在 stc/lib/ 目录，各页面 import 进来。
+ * 将公共 UI（如 Label/Input/Checkbox）放在 stc/lib/ui/ 目录，各页面 import 进来。
+ * 这和 shadcn/ui 推荐的 components/ui/ 目录结构完全一致。
  * tsc watch 会自动将所有 .tsx 编译为同路径的 .js，无需打包工具。
  *
  * 【编译方式】
  * 本文件 (.tsx) 已集成到 source/tsconfig.json 的 include 中，
  * 开启 `tsc: watch - source/tsconfig.json` 即可自动编译，无需额外命令。
- * 编译输出：stc/view/react-page.js（由 tsc 覆盖写入，勿手动编辑 .js 文件）
+ * 编译输出：stc/view/react.page.js（由 tsc 覆盖写入，勿手动编辑 .js 文件）
  *
  * 【运行时机】
  * - 服务端（Node.js）：_loadReactPage() 调用 renderToString()，产出完整 HTML 字符串。
  * - 客户端（浏览器）：import map 将 bare import 解析到 esm.sh，hydrateRoot 接管 document。
  * - 两端使用同一份 JS 文件：服务端从磁盘读，浏览器从静态 URL 下载。
  *
+ * 【第三方包 import map 自动解析】
+ * 开发模式下，框架会自动扫描入口 JS 及其相对引用中的所有 bare specifier，
+ * 并通过 esm.sh CDN 自动生成 import map 条目，无需手动配置。
+ *
  * 【限制】
  * - 不能包含 Node.js 专属代码（fs/path/lDb 等），数据必须通过 props 传入。
  * - 等价于 Next.js 的 Client Component，而非 Server Component。
@@ -32,19 +42,7 @@ interface IProps {
     '_urlStc': string;
     '_urlFull': string;
     '_staticVer': string;
-    /** --- 框架注入：import map JSON 字符串，<head> 中以 type="importmap" <script> 渲染 --- */
-    '_importMapJson'?: string;
-    /**
-     * --- 框架注入：水合 JS 代码字符串，</body> 前以 type="module" <script> 渲染 ---
-     * --- 内容：import hydrateRoot + import App + hydrateRoot(document, createElement(App, p)) ---
-     */
-    '_hydrateScript'?: string;
-    /**
-     * --- 框架注入：fullProps 的 JSON 序列化（不含 _propsJson 本身）---
-     * --- 客户端水合脚本读取此值重建 props，suppressHydrationWarning 处理服务端/客户端内容差异 ---
-     */
-    '_propsJson'?: string;
 }
 /** --- Kebab React 全页面演示 --- */
-export default function ReactPage({ title, serverTime, node, _urlBase, _urlStc, _importMapJson, _hydrateScript, _propsJson }: IProps): import("react/jsx-runtime").JSX.Element;
+export default function ReactPage({ title, serverTime, node, _urlBase, _urlStc, _staticVer }: IProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/www/example/stc/view/react.page.js

@@ -0,0 +1,181 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * --- Kebab React 全页面示例组件 ---
+ *
+ * node ./source/main build -d source/www/example/stc
+ *
+ * 【文件命名约定】
+ * 文件名以 .page.tsx 结尾的为页面入口（本文件），框架会将其打包为 .page.bundle.js。
+ * 其余 .tsx 均视为组件（如 stc/lib/ui/button.tsx），不会被单独打包。
+ *
+ * 【使用方式】
+ * 在 Ctr 方法中调用 _loadReactPage('view/react', { ...props })，
+ * 框架自动将 import map、props JSON、水合脚本注入 HTML，组件只写业务逻辑，无需任何框架样板代码。
+ *
+ * 【多页面 / 共用组件】
+ * 将公共 UI（如 Label/Input/Checkbox）放在 stc/lib/ui/ 目录，各页面 import 进来。
+ * 这和 shadcn/ui 推荐的 components/ui/ 目录结构完全一致。
+ * tsc watch 会自动将所有 .tsx 编译为同路径的 .js，无需打包工具。
+ *
+ * 【编译方式】
+ * 本文件 (.tsx) 已集成到 source/tsconfig.json 的 include 中，
+ * 开启 `tsc: watch - source/tsconfig.json` 即可自动编译，无需额外命令。
+ * 编译输出：stc/view/react.page.js（由 tsc 覆盖写入，勿手动编辑 .js 文件）
+ *
+ * 【运行时机】
+ * - 服务端（Node.js）：_loadReactPage() 调用 renderToString()，产出完整 HTML 字符串。
+ * - 客户端（浏览器）：import map 将 bare import 解析到 esm.sh，hydrateRoot 接管 document。
+ * - 两端使用同一份 JS 文件：服务端从磁盘读，浏览器从静态 URL 下载。
+ *
+ * 【第三方包 import map 自动解析】
+ * 开发模式下，框架会自动扫描入口 JS 及其相对引用中的所有 bare specifier，
+ * 并通过 esm.sh CDN 自动生成 import map 条目，无需手动配置。
+ *
+ * 【限制】
+ * - 不能包含 Node.js 专属代码（fs/path/lDb 等），数据必须通过 props 传入。
+ * - 等价于 Next.js 的 Client Component，而非 Server Component。
+ */
+// --- React / React Router ---
+import { useState, useEffect, useId } from 'react';
+import { MemoryRouter, Routes, Route, Link, useParams, useNavigate } from 'react-router-dom';
+// --- shadcn/ui 控件（从 stc/lib/ui/ 引入，与行业标准 components/ui/ 目录结构一致）---
+import { Label } from '../lib/ui/label.js';
+import { Input } from '../lib/ui/input.js';
+import { Checkbox } from '../lib/ui/checkbox.js';
+import { Switch } from '../lib/ui/switch.js';
+// ─── 页面内部组件（仅本页演示使用，无需提取到 lib/）────────────────────────────
+/** --- 卡片容器 --- */
+function Card({ children, className = '' }) {
+    return (_jsx("div", { className: `bg-white rounded-xl shadow-sm border border-slate-200 p-6 ${className}`, children: children }));
+}
+/** --- 标签徽章 --- */
+function Badge({ children, variant = 'default' }) {
+    const styles = {
+        'default': 'bg-blue-100 text-blue-700',
+        'success': 'bg-green-100 text-green-700',
+        'warn': 'bg-amber-100 text-amber-700',
+    };
+    return (_jsx("span", { className: `inline-flex px-2.5 py-0.5 rounded-md text-xs font-semibold ${styles[variant]}`, children: children }));
+}
+/** --- 按钮 --- */
+function Btn({ children, onClick, disabled = false, outline = false }) {
+    /** --- 填充/轮廓两种样式 --- */
+    const style = outline
+        ? 'border border-slate-300 text-slate-700 hover:bg-slate-50'
+        : 'bg-blue-500 hover:bg-blue-600 text-white';
+    return (_jsx("button", { onClick: onClick, disabled: disabled, className: `inline-flex items-center px-4 py-2 rounded-lg text-sm font-medium transition-colors disabled:opacity-50 cursor-pointer ${style}`, children: children }));
+}
+// ─── Router 演示子页面 ─────────────────────────────────────────────────────────
+/** --- 路由 Home 页 --- */
+function RouterHome() {
+    return (_jsxs("div", { children: [_jsxs("p", { className: "text-slate-700 text-sm font-medium mb-3", children: ["Current route: ", _jsx("code", { className: "bg-slate-100 px-1 rounded", children: "/" })] }), _jsxs("div", { className: "flex gap-2 flex-wrap", children: [_jsx(Link, { to: "/about", className: "inline-flex items-center px-3 py-1.5 rounded-lg bg-blue-500 hover:bg-blue-600 text-white text-xs font-medium", children: "\u2192 /about" }), _jsx(Link, { to: "/user/42", className: "inline-flex items-center px-3 py-1.5 rounded-lg border border-slate-300 hover:bg-slate-50 text-slate-700 text-xs font-medium", children: "\u2192 /user/42" }), _jsx(Link, { to: "/user/hello", className: "inline-flex items-center px-3 py-1.5 rounded-lg border border-slate-300 hover:bg-slate-50 text-slate-700 text-xs font-medium", children: "\u2192 /user/hello" })] })] }));
+}
+/** --- 路由 About 页 --- */
+function RouterAbout() {
+    const navigate = useNavigate();
+    return (_jsxs("div", { children: [_jsxs("p", { className: "text-slate-700 text-sm font-medium mb-3", children: ["Current route: ", _jsx("code", { className: "bg-slate-100 px-1 rounded", children: "/about" })] }), _jsx("p", { className: "text-slate-500 text-xs mb-3", children: "useNavigate() programmatic navigation (without Link component):" }), _jsxs("div", { className: "flex gap-2", children: [_jsx("button", { onClick: () => navigate('/'), className: "inline-flex items-center px-3 py-1.5 rounded-lg border border-slate-300 hover:bg-slate-50 text-slate-700 text-xs font-medium cursor-pointer", children: "\u2190 Back to /" }), _jsx("button", { onClick: () => navigate('/user/99'), className: "inline-flex items-center px-3 py-1.5 rounded-lg bg-blue-500 hover:bg-blue-600 text-white text-xs font-medium cursor-pointer", children: "\u2192 /user/99" })] })] }));
+}
+/** --- 路由 User 动态参数页 --- */
+function RouterUser() {
+    const { id } = useParams();
+    const navigate = useNavigate();
+    return (_jsxs("div", { children: [_jsxs("p", { className: "text-slate-700 text-sm font-medium mb-1", children: ["Current route: ", _jsx("code", { className: "bg-slate-100 px-1 rounded", children: "/user/:id" })] }), _jsxs("p", { className: "text-slate-500 text-xs mb-3", children: ["useParams() dynamic segment: ", _jsxs("code", { className: "bg-slate-100 px-1 rounded", children: ["id = \"", id, "\""] })] }), _jsx("button", { onClick: () => navigate('/'), className: "inline-flex items-center px-3 py-1.5 rounded-lg border border-slate-300 hover:bg-slate-50 text-slate-700 text-xs font-medium cursor-pointer", children: "\u2190 Back to /" })] }));
+}
+// ─── shadcn/ui 演示区 ────────────────────────────────────────────────────────
+/**
+ * --- 展示 Label/Input/Checkbox/Switch 组合使用 ---
+ * 控件定义在 stc/lib/ui/ 目录，本组件只做 import + 组合。
+ */
+function ShadcnDemo() {
+    // --- 表单受控状态 ---
+    const [name, setName] = useState('');
+    const [email, setEmail] = useState('');
+    const [agree, setAgree] = useState(false);
+    const [newsletter, setNewsletter] = useState(false);
+    const [submitted, setSubmitted] = useState(false);
+    // --- useId 生成无障碍访问用的稳定 id（SSR + 水合均确保一致）---
+    const nameId = useId();
+    const emailId = useId();
+    const agreeId = useId();
+    const newsletterId = useId();
+    function handleSubmit(e) {
+        e.preventDefault();
+        setSubmitted(true);
+    }
+    return (_jsxs("div", { className: "space-y-4", children: [_jsxs(Card, { children: [_jsx("h2", { className: "font-semibold text-slate-900 mb-2", children: "shadcn/ui Components" }), _jsxs("p", { className: "text-slate-500 text-xs leading-relaxed", children: ["All components below are imported from ", _jsx("code", { className: "bg-slate-100 px-1 rounded", children: "stc/lib/ui/" }), ", following the same ", _jsx("code", { className: "bg-slate-100 px-1 rounded", children: "components/ui/" }), " structure recommended by shadcn/ui. Built on Radix UI primitives, styled with Tailwind CSS. In dev mode, the framework auto-scans all bare imports and generates the import map automatically."] })] }), _jsxs(Card, { children: [_jsx("h2", { className: "font-semibold text-slate-900 mb-4", children: "Label + Input" }), _jsxs("div", { className: "grid gap-4", children: [_jsxs("div", { className: "grid gap-1.5", children: [_jsx(Label, { htmlFor: nameId, children: "Username" }), _jsx(Input, { id: nameId, type: "text", placeholder: "Enter your username", value: name, onChange: e => setName(e.target.value) })] }), _jsxs("div", { className: "grid gap-1.5", children: [_jsx(Label, { htmlFor: emailId, children: "Email" }), _jsx(Input, { id: emailId, type: "email", placeholder: "you@example.com", value: email, onChange: e => setEmail(e.target.value) })] })] }), _jsx("p", { className: "text-xs text-slate-400 mt-3", children: "Click the Label text to focus the corresponding input (Radix UI a11y semantics)" })] }), _jsxs(Card, { children: [_jsx("h2", { className: "font-semibold text-slate-900 mb-4", children: "Checkbox" }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Checkbox, { id: agreeId, checked: agree, onCheckedChange: setAgree }), _jsx(Label, { htmlFor: agreeId, children: "I have read and agree to the Terms of Service" })] }), _jsxs("p", { className: "text-xs text-slate-400 mt-3", children: ["Value: ", _jsx("code", { className: "bg-slate-100 px-1 rounded", children: String(agree) }), "\u00A0(supports ", _jsx("code", { className: "bg-slate-100 px-1 rounded", children: "true | false | 'indeterminate'" }), " tri-state)"] })] }), _jsxs(Card, { children: [_jsx("h2", { className: "font-semibold text-slate-900 mb-4", children: "Switch" }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Switch, { id: newsletterId, checked: newsletter, onCheckedChange: setNewsletter }), _jsx(Label, { htmlFor: newsletterId, children: "Subscribe to product updates" })] }), _jsxs("p", { className: "text-xs text-slate-400 mt-3", children: ["Value: ", _jsx("code", { className: "bg-slate-100 px-1 rounded", children: newsletter ? 'true' : 'false' })] })] }), _jsxs(Card, { children: [_jsx("h2", { className: "font-semibold text-slate-900 mb-4", children: "Combined Form (Submit Demo)" }), submitted ? (_jsxs("div", { className: "space-y-2 text-sm", children: [_jsx("p", { className: "text-green-700 font-medium", children: "\u2713 Submitted! Received data:" }), _jsx("pre", { className: "bg-slate-50 border border-slate-200 rounded-lg p-3 text-xs text-slate-700 overflow-auto", children: JSON.stringify({ name, email, agree: Boolean(agree), newsletter }, null, 2) }), _jsx("button", { onClick: () => setSubmitted(false), className: "text-xs text-blue-500 hover:underline cursor-pointer", children: "Reset" })] })) : (_jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", children: [_jsxs("div", { className: "grid gap-1.5", children: [_jsxs(Label, { htmlFor: `${nameId}-form`, children: ["Username ", _jsx("span", { className: "text-red-500", children: "*" })] }), _jsx(Input, { id: `${nameId}-form`, required: true, placeholder: "At least 2 characters", value: name, onChange: e => setName(e.target.value) })] }), _jsxs("div", { className: "grid gap-1.5", children: [_jsxs(Label, { htmlFor: `${emailId}-form`, children: ["Email ", _jsx("span", { className: "text-red-500", children: "*" })] }), _jsx(Input, { id: `${emailId}-form`, type: "email", required: true, placeholder: "you@example.com", value: email, onChange: e => setEmail(e.target.value) })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Checkbox, { id: `${agreeId}-form`, checked: agree, onCheckedChange: setAgree, required: true }), _jsx(Label, { htmlFor: `${agreeId}-form`, children: "Agree to terms" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Switch, { id: `${newsletterId}-form`, checked: newsletter, onCheckedChange: setNewsletter }), _jsx(Label, { htmlFor: `${newsletterId}-form`, children: "Subscribe" })] }), _jsx("button", { type: "submit", className: "inline-flex items-center px-4 py-2 rounded-lg bg-blue-500 hover:bg-blue-600 text-white text-sm font-medium cursor-pointer", children: "Submit" })] }))] })] }));
+}
+// ─── 页面主组件 ────────────────────────────────────────────────────────────────
+/** --- Kebab React 全页面演示 --- */
+export default function ReactPage({ title, serverTime, node, _urlBase, _urlStc, _staticVer }) {
+    // --- useState 在 SSR 阶段使用初始值渲染，客户端水合后变为可交互状态 ---
+    const [count, setCount] = useState(0);
+    const [tab, setTab] = useState('overview');
+    const [fetchResult, setFetchResult] = useState(null);
+    const [isFetching, setIsFetching] = useState(false);
+    /** --- 仅客户端为 true，用于展示水合已完成 --- */
+    const [hydrated, setHydrated] = useState(false);
+    // --- useEffect 在 SSR 阶段不执行，只在浏览器端水合完成后触发 ---
+    useEffect(() => {
+        setHydrated(true);
+    }, []);
+    /**
+     * --- 发起 fetch 请求并更新结果状态 ---
+     * @param url 请求地址
+     */
+    function doFetch(url) {
+        setIsFetching(true);
+        setFetchResult(null);
+        fetch(url)
+            .then(r => r.json())
+            .then((data) => {
+            setFetchResult(JSON.stringify(data, null, 2));
+            setIsFetching(false);
+        })
+            .catch((e) => {
+            setFetchResult(`Error: ${e.message}`);
+            setIsFetching(false);
+        });
+    }
+    return (
+    // --- 组件渲染完整 HTML 文档，无需外部 EJS 模板 ---
+    _jsxs("html", { lang: "en", children: [_jsxs("head", { children: [_jsx("meta", { charSet: "UTF-8" }), _jsx("meta", { name: "viewport", content: "width=device-width, initial-scale=1.0" }), _jsx("title", { children: title }), _jsx("link", { href: `${_urlStc}view/react.page.css?v=${_staticVer}`, rel: "stylesheet" })] }), _jsx("body", { className: "bg-slate-50 min-h-screen font-sans", children: _jsxs("div", { className: "max-w-3xl mx-auto px-4 py-10 space-y-6", children: [_jsxs("div", { children: [_jsxs("div", { className: "flex gap-2 mb-2", children: [_jsx(Badge, { children: "SSR \u00B7 Kebab" }), _jsx(Badge, { variant: hydrated ? 'success' : 'warn', children: hydrated ? 'Hydrated ✓' : 'Rendering...' })] }), _jsx("h1", { className: "text-2xl font-bold text-slate-900", children: title }), _jsxs("p", { className: "text-slate-500 text-sm mt-1", children: [serverTime, " \u00B7 ", node] })] }), _jsx("div", { className: "flex gap-1 bg-slate-100 p-1 rounded-lg w-fit", children: ['overview', 'routing', 'fetch', 'shadcn'].map(t => (_jsx("button", { onClick: () => setTab(t), className: [
+                                    'px-4 py-2 rounded-md text-sm font-medium transition-colors cursor-pointer',
+                                    tab === t ? 'bg-white shadow text-slate-900' : 'text-slate-500 hover:text-slate-900',
+                                ].join(' '), children: t.charAt(0).toUpperCase() + t.slice(1) }, t))) }), tab === 'overview' && (_jsxs("div", { className: "space-y-4", children: [_jsxs(Card, { children: [_jsx("h2", { className: "font-semibold text-slate-900 mb-1", children: "Counter\uFF08useState + hydration\uFF09" }), _jsx("p", { className: "text-slate-500 text-xs mb-4", children: "SSR renders with initial value 0; props are serialized as inline JSON. After hydration the state becomes interactive \u2014 click the buttons to test:" }), _jsxs("div", { className: "flex items-center gap-4", children: [_jsx("button", { onClick: () => setCount(c => c - 1), className: "w-10 h-10 rounded-lg border border-slate-300 hover:bg-slate-50 font-bold text-slate-700 text-xl cursor-pointer", children: "\u2212" }), _jsx("span", { className: "text-3xl font-bold text-slate-900 w-10 text-center tabular-nums", children: count }), _jsx("button", { onClick: () => setCount(c => c + 1), className: "w-10 h-10 rounded-lg bg-blue-500 hover:bg-blue-600 text-white font-bold text-xl cursor-pointer", children: "+" })] })] }), _jsxs(Card, { children: [_jsx("h2", { className: "font-semibold text-slate-900 mb-3", children: "Server Props (from Ctr method)" }), _jsxs("p", { className: "text-slate-500 text-xs mb-3", children: ["Passed via", ' ', _jsx("code", { className: "bg-slate-100 px-1 rounded", children: "_loadReactPage(path, props)" }), ". The framework auto-injects constants like _urlBase and serializes all props as inline JSON, reused directly during client hydration \u2014 no extra request needed."] }), _jsx("div", { className: "space-y-2", children: [
+                                                ['serverTime', serverTime],
+                                                ['node', node],
+                                                ['_urlBase', _urlBase],
+                                                ['_urlStc', _urlStc],
+                                            ].map(([k, v]) => (_jsxs("div", { className: "flex text-xs gap-4", children: [_jsx("span", { className: "text-slate-400 font-mono w-28 shrink-0", children: k }), _jsx("span", { className: "font-mono text-slate-700 truncate", children: v })] }, k))) })] }), _jsxs(Card, { children: [_jsx("h2", { className: "font-semibold text-slate-900 mb-2", children: "Recommended Directory Structure" }), _jsx("pre", { className: "bg-slate-50 border border-slate-200 rounded-lg p-4 text-xs leading-relaxed text-slate-700", children: `stc/
+  lib/
+    utils.ts            # cn() utility
+    ui/
+      label.tsx         # shadcn Label
+      input.tsx         # shadcn Input
+      checkbox.tsx      # shadcn Checkbox
+      switch.tsx        # shadcn Switch
+  view/
+    react-page.tsx      # Page component (import + compose)` }), _jsxs("p", { className: "text-slate-500 text-xs mt-3", children: ["Mirrors the shadcn/ui ", _jsx("code", { className: "bg-slate-100 px-1 rounded", children: "components/ui/" }), " convention. In dev mode, the framework auto-scans imports \u2014 no manual import map configuration needed."] })] })] })), tab === 'routing' && (
+                        /*
+                          MemoryRouter：路由状态保存在内存中，服务端 SSR 和客户端水合均可运行，
+                          无需服务端配置 catch-all 路由，适合在页面内嵌入独立的路由演示。
+                          若要整页接管 URL，改用 BrowserRouter（需服务端对所有子路径返回同一页面）。
+                        */
+                        _jsxs(MemoryRouter, { children: [_jsxs(Card, { children: [_jsx("h2", { className: "font-semibold text-slate-900 mb-1", children: "React Router Demo" }), _jsxs("p", { className: "text-slate-500 text-xs mb-4", children: ["Uses ", _jsx("code", { className: "bg-slate-100 px-1 rounded", children: "MemoryRouter" }), ' ', "to demonstrate route navigation, dynamic params (useParams), and programmatic navigation (useNavigate). Works on both server SSR and client hydration with no extra server configuration."] }), _jsxs(Routes, { children: [_jsx(Route, { path: "/", element: _jsx(RouterHome, {}) }), _jsx(Route, { path: "/about", element: _jsx(RouterAbout, {}) }), _jsx(Route, { path: "/user/:id", element: _jsx(RouterUser, {}) })] })] }), _jsxs(Card, { className: "mt-4", children: [_jsx("h2", { className: "font-semibold text-slate-900 mb-2", children: "Full-Page BrowserRouter Setup" }), _jsx("p", { className: "text-slate-500 text-xs mb-3", children: "To let React Router manage the real URL (e.g. /app, /app/about), replace MemoryRouter with BrowserRouter and route all sub-paths to the same Ctr method on the server:" }), _jsx("pre", { className: "bg-slate-50 border border-slate-200 rounded-lg p-4 text-xs overflow-auto leading-relaxed text-slate-700", children: `// 1. route.json: 将所有子路径路由到同一 Ctr 方法
+{
+  "app":   "ctr/app@reactPage",
+  "app\\/.*": "ctr/app@reactPage"
+}
+
+// 2. Ctr 方法：传入 router: 'browser'，框架自动处理 SSR（StaticRouter）和客户端（BrowserRouter）
+await this._loadReactPage('view/my', { ...props }, {
+  router: 'browser',
+  routerBase: 'app',  // basename，相对于 urlBase
+});
+
+// 3. 组件：直接使用 Routes/Route/Link，不需要包裹任何 Router 层
+<Routes>
+  <Route path="/" element={<Home />} />
+  <Route path="/user/:id" element={<User />} />
+</Routes>` })] })] })), tab === 'shadcn' && (_jsx(ShadcnDemo, {})), tab === 'fetch' && (_jsxs(Card, { children: [_jsx("h2", { className: "font-semibold text-slate-900 mb-3", children: "Client Fetch Demo" }), _jsx("p", { className: "text-slate-500 text-xs mb-4", children: "After hydration, click a button to send a GET request. setState triggers a partial re-render \u2014 no page refresh." }), _jsxs("div", { className: "flex gap-3 flex-wrap", children: [_jsx(Btn, { onClick: () => doFetch(`${_urlBase}test/json?type=4`), disabled: isFetching, children: isFetching ? 'Fetching...' : 'GET /test/json?type=4' }), _jsx(Btn, { outline: true, onClick: () => doFetch(`${_urlBase}test/json?type=2`), disabled: isFetching, children: "GET type=2 (error resp)" })] }), fetchResult !== null ? (_jsx("pre", { className: "mt-4 bg-slate-50 border border-slate-200 rounded-lg p-4 text-xs overflow-auto leading-relaxed text-slate-700", children: fetchResult })) : (_jsx("p", { className: "mt-3 text-slate-400 text-xs", children: "Click a button above to see the response" }))] }))] }) })] }));
+}