[{"data":1,"prerenderedAt":421},["ShallowReactive",2],{"i-simple-icons:github":3,"i-lucide:arrow-right":8,"doc-\u002Fdocs\u002Felements\u002Fspinner":10,"docs-sidebar":288,"i-lucide:file-text":417,"i-lucide:arrow-left":419},{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":7},0,24,false,"\u003Cpath fill=\"currentColor\" d=\"M12 .297c-6.63 0-12 5.373-12 12c0 5.303 3.438 9.8 8.205 11.385c.6.113.82-.258.82-.577c0-.285-.01-1.04-.015-2.04c-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729c1.205.084 1.838 1.236 1.838 1.236c1.07 1.835 2.809 1.305 3.495.998c.108-.776.417-1.305.76-1.605c-2.665-.3-5.466-1.332-5.466-5.93c0-1.31.465-2.38 1.235-3.22c-.135-.303-.54-1.523.105-3.176c0 0 1.005-.322 3.3 1.23c.96-.267 1.98-.399 3-.405c1.02.006 2.04.138 3 .405c2.28-1.552 3.285-1.23 3.285-1.23c.645 1.653.24 2.873.12 3.176c.765.84 1.23 1.91 1.23 3.22c0 4.61-2.805 5.625-5.475 5.92c.42.36.81 1.096.81 2.22c0 1.606-.015 2.896-.015 3.286c0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":9},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M5 12h14m-7-7l7 7l-7 7\"\u002F>",{"id":11,"title":12,"body":13,"description":277,"extension":278,"group":279,"groupOrder":237,"meta":280,"navTitle":281,"navigation":282,"order":283,"path":284,"seo":285,"stem":286,"__hash__":287},"docs\u002Fdocs\u002Felements\u002Fspinner.md","\u003Cwmcp-spinner>",{"type":14,"value":15,"toc":273},"minimark",[16,23,51,53,107,117,122,171,175,183,269],[17,18,20],"h1",{"id":19},"wmcp-spinner",[21,22,12],"code",{},[24,25,26,27,32,33,37,38,42,43,46,47,50],"p",{},"An indeterminate loading indicator — the spinning ring for \"working on it\" with no known duration. Presentational (no ",[28,29,31],"a",{"href":30},"\u002Fdocs\u002Fwebmcp","WebMCP tool","), but unlike the ",[28,34,36],{"href":35},"\u002Fdocs\u002Felements\u002Fskeleton","skeleton"," it's ",[39,40,41],"strong",{},"announced",": ",[21,44,45],{},"role=\"status\""," with an accessible ",[21,48,49],{},"label"," (default \"Loading…\"), so assistive tech tells the user something is happening.",[19,52],{},[54,55,60],"pre",{"className":56,"code":57,"language":58,"meta":59,"style":59},"language-html shiki shiki-themes github-light-default ayu-dark","\u003Cwmcp-spinner>\u003C\u002Fwmcp-spinner>\n\u003Cwmcp-spinner label=\"Saving…\">\u003C\u002Fwmcp-spinner>\n","html","",[21,61,62,82],{"__ignoreMap":59},[63,64,67,71,74,77,79],"span",{"class":65,"line":66},"line",1,[63,68,70],{"class":69},"sqV5G","\u003C",[63,72,19],{"class":73},"sfBZl",[63,75,76],{"class":69},">\u003C\u002F",[63,78,19],{"class":73},[63,80,81],{"class":69},">\n",[63,83,85,87,89,93,97,101,103,105],{"class":65,"line":84},2,[63,86,70],{"class":69},[63,88,19],{"class":73},[63,90,92],{"class":91},"sI192"," label",[63,94,96],{"class":95},"siQKT","=",[63,98,100],{"class":99},"sxLuP","\"Saving…\"",[63,102,76],{"class":69},[63,104,19],{"class":73},[63,106,81],{"class":69},[24,108,109,110,112,113,116],{},"The ",[21,111,49],{}," is the accessible name — set it to describe the specific operation. It stops rotating under ",[21,114,115],{},"prefers-reduced-motion",".",[118,119,121],"h2",{"id":120},"element-attributes","Element attributes",[123,124,125,144],"table",{},[126,127,128],"thead",{},[129,130,131,135,138,141],"tr",{},[132,133,134],"th",{},"Attribute",[132,136,137],{},"Type",[132,139,140],{},"Default",[132,142,143],{},"Description",[145,146,147],"tbody",{},[129,148,149,154,159,164],{},[150,151,152],"td",{},[21,153,49],{},[150,155,156],{},[21,157,158],{},"string",[150,160,161],{},[21,162,163],{},"Loading…",[150,165,166,167,170],{},"Accessible name, mirrored to ",[21,168,169],{},"aria-label"," (kept in sync if it changes).",[118,172,174],{"id":173},"theming","Theming",[24,176,177,178,182],{},"Size, thickness, and the two ring colors are custom properties, defaulting through the ",[28,179,181],{"href":180},"\u002Fdocs\u002Finstallation","design tokens",":",[54,184,188],{"className":185,"code":186,"language":187,"meta":59,"style":59},"language-css shiki shiki-themes github-light-default ayu-dark",":root {\n  --spinner-size: 1.5rem;\n  --spinner-width: 3px;\n  --spinner-color: var(--brand); \u002F* the moving arc *\u002F\n}\n","css",[21,189,190,200,219,235,263],{"__ignoreMap":59},[63,191,192,196],{"class":65,"line":66},[63,193,195],{"class":194},"sybcr",":root",[63,197,199],{"class":198},"sBz_o"," {\n",[63,201,202,206,208,212,216],{"class":65,"line":84},[63,203,205],{"class":204},"sCHdd","  --spinner-size",[63,207,182],{"class":95},[63,209,211],{"class":210},"sQY3k"," 1.5",[63,213,215],{"class":214},"s7jPt","rem",[63,217,218],{"class":95},";\n",[63,220,222,225,227,230,233],{"class":65,"line":221},3,[63,223,224],{"class":204},"  --spinner-width",[63,226,182],{"class":95},[63,228,229],{"class":210}," 3",[63,231,232],{"class":214},"px",[63,234,218],{"class":95},[63,236,238,241,243,247,250,253,256,259],{"class":65,"line":237},4,[63,239,240],{"class":204},"  --spinner-color",[63,242,182],{"class":95},[63,244,246],{"class":245},"sAJRi"," var",[63,248,249],{"class":198},"(",[63,251,252],{"class":204},"--brand",[63,254,255],{"class":198},")",[63,257,258],{"class":95},";",[63,260,262],{"class":261},"s5O_a"," \u002F* the moving arc *\u002F\n",[63,264,266],{"class":65,"line":265},5,[63,267,268],{"class":198},"}\n",[270,271,272],"style",{},"html pre.shiki code .sqV5G, html code.shiki .sqV5G{--shiki-default:#1F2328;--shiki-dark:#39BAE680}html pre.shiki code .sfBZl, html code.shiki .sfBZl{--shiki-default:#116329;--shiki-dark:#39BAE6}html pre.shiki code .sI192, html code.shiki .sI192{--shiki-default:#0550AE;--shiki-dark:#FFB454}html pre.shiki code .siQKT, html code.shiki .siQKT{--shiki-default:#1F2328;--shiki-dark:#BFBDB6B3}html pre.shiki code .sxLuP, html code.shiki .sxLuP{--shiki-default:#0A3069;--shiki-dark:#AAD94C}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sybcr, html code.shiki .sybcr{--shiki-default:#0550AE;--shiki-dark:#95E6CB}html pre.shiki code .sBz_o, html code.shiki .sBz_o{--shiki-default:#1F2328;--shiki-dark:#BFBDB6}html pre.shiki code .sCHdd, html code.shiki .sCHdd{--shiki-default:#953800;--shiki-dark:#BFBDB6}html pre.shiki code .sQY3k, html code.shiki .sQY3k{--shiki-default:#0550AE;--shiki-dark:#D2A6FF}html pre.shiki code .s7jPt, html code.shiki .s7jPt{--shiki-default:#CF222E;--shiki-dark:#FF8F40}html pre.shiki code .sAJRi, html code.shiki .sAJRi{--shiki-default:#0550AE;--shiki-dark:#F07178}html pre.shiki code .s5O_a, html code.shiki .s5O_a{--shiki-default:#6E7781;--shiki-default-font-style:inherit;--shiki-dark:#5A6673;--shiki-dark-font-style:italic}",{"title":59,"searchDepth":84,"depth":84,"links":274},[275,276],{"id":120,"depth":84,"text":121},{"id":173,"depth":84,"text":174},"An indeterminate loading indicator with an accessible label.","md","Presentational",{},"Spinner",true,8,"\u002Fdocs\u002Felements\u002Fspinner",{"title":12,"description":277},"docs\u002Felements\u002Fspinner","6X6AOIXT9WvyMDtbrFaXyJcl-tZTpnnQbUDpA60HLqI",[289,293,297,301,306,311,316,320,324,328,332,336,340,344,348,352,353,357,361,365,369,373,378,381,385,389,392,396,400,404,407,409,412,415],{"path":290,"title":291,"navTitle":292,"group":279,"order":84,"groupOrder":237},"\u002Fdocs\u002Felements\u002Falert","\u003Cwmcp-alert>","Alert",{"path":294,"title":295,"navTitle":296,"group":279,"order":221,"groupOrder":237},"\u002Fdocs\u002Felements\u002Favatar","\u003Cwmcp-avatar>","Avatar",{"path":298,"title":299,"navTitle":300,"group":279,"order":66,"groupOrder":237},"\u002Fdocs\u002Felements\u002Fbadge","\u003Cwmcp-badge>","Badge",{"path":302,"title":303,"navTitle":304,"group":305,"order":66,"groupOrder":221},"\u002Fdocs\u002Felements\u002Fbutton","\u003Cwmcp-button>","Button","Interaction",{"path":307,"title":308,"navTitle":309,"group":279,"order":310,"groupOrder":237},"\u002Fdocs\u002Felements\u002Fcard","\u003Cwmcp-card>","Card",6,{"path":312,"title":313,"navTitle":314,"group":315,"order":237,"groupOrder":84},"\u002Fdocs\u002Felements\u002Fcheckbox","\u003Cwmcp-checkbox>","Checkbox","Elements",{"path":317,"title":318,"navTitle":319,"group":305,"order":84,"groupOrder":221},"\u002Fdocs\u002Felements\u002Fdialog","\u003Cwmcp-dialog>","Dialog",{"path":321,"title":322,"navTitle":323,"group":315,"order":66,"groupOrder":84},"\u002Fdocs\u002Felements\u002Finput","\u003Cwmcp-input>","Input",{"path":325,"title":326,"navTitle":327,"group":305,"order":221,"groupOrder":221},"\u002Fdocs\u002Felements\u002Fmenu","\u003Cwmcp-menu>","Menu",{"path":329,"title":330,"navTitle":331,"group":305,"order":265,"groupOrder":221},"\u002Fdocs\u002Felements\u002Fpopover","\u003Cwmcp-popover>","Popover",{"path":333,"title":334,"navTitle":335,"group":279,"order":237,"groupOrder":237},"\u002Fdocs\u002Felements\u002Fprogress","\u003Cwmcp-progress>","Progress",{"path":337,"title":338,"navTitle":339,"group":315,"order":265,"groupOrder":84},"\u002Fdocs\u002Felements\u002Fradio","\u003Cwmcp-radio-group>","Radio group",{"path":341,"title":342,"navTitle":343,"group":315,"order":221,"groupOrder":84},"\u002Fdocs\u002Felements\u002Fselect","\u003Cwmcp-select>","Select",{"path":345,"title":346,"navTitle":347,"group":279,"order":265,"groupOrder":237},"\u002Fdocs\u002Felements\u002Fseparator","\u003Cwmcp-separator>","Separator",{"path":35,"title":349,"navTitle":350,"group":279,"order":351,"groupOrder":237},"\u003Cwmcp-skeleton>","Skeleton",7,{"path":284,"title":12,"navTitle":281,"group":279,"order":283,"groupOrder":237},{"path":354,"title":355,"navTitle":356,"group":305,"order":351,"groupOrder":221},"\u002Fdocs\u002Felements\u002Fswitch","\u003Cwmcp-switch>","Switch",{"path":358,"title":359,"navTitle":360,"group":305,"order":237,"groupOrder":221},"\u002Fdocs\u002Felements\u002Ftabs","\u003Cwmcp-tabs>","Tabs",{"path":362,"title":363,"navTitle":364,"group":315,"order":84,"groupOrder":84},"\u002Fdocs\u002Felements\u002Ftextarea","\u003Cwmcp-textarea>","Textarea",{"path":366,"title":367,"navTitle":368,"group":305,"order":310,"groupOrder":221},"\u002Fdocs\u002Felements\u002Ftoast","\u003Cwmcp-toast>","Toast",{"path":370,"title":371,"navTitle":372,"group":305,"order":283,"groupOrder":221},"\u002Fdocs\u002Felements\u002Ftooltip","\u003Cwmcp-tooltip>","Tooltip",{"path":374,"title":375,"navTitle":376,"group":377,"order":237,"groupOrder":265},"\u002Fdocs\u002Fexamples\u002Fbrain-dump","Brain-dump → to-do list","Brain-dump → to-dos","Examples",{"path":379,"title":380,"navTitle":380,"group":377,"order":265,"groupOrder":265},"\u002Fdocs\u002Fexamples\u002Fcrm-lead","Email → CRM lead",{"path":382,"title":383,"navTitle":384,"group":377,"order":351,"groupOrder":265},"\u002Fdocs\u002Fexamples\u002Fdashboard","Ask the dashboard a question","Dashboard control",{"path":386,"title":387,"navTitle":388,"group":377,"order":310,"groupOrder":265},"\u002Fdocs\u002Fexamples\u002Fexpense-report","Receipt → expense report","Receipt → expense",{"path":390,"title":377,"navTitle":391,"group":377,"order":66,"groupOrder":265},"\u002Fdocs\u002Fexamples","Overview",{"path":393,"title":394,"navTitle":395,"group":377,"order":84,"groupOrder":265},"\u002Fdocs\u002Fexamples\u002Frecipe-cart","Recipe → grocery cart","Recipe → cart",{"path":397,"title":398,"navTitle":399,"group":377,"order":221,"groupOrder":265},"\u002Fdocs\u002Fexamples\u002Frestaurant-booking","Book a table in one sentence","Restaurant booking",{"path":401,"title":402,"navTitle":402,"group":403,"order":310,"groupOrder":66},"\u002Fdocs\u002Fframeworks","React & Vue","Getting started",{"path":405,"title":406,"navTitle":406,"group":403,"order":66,"groupOrder":66},"\u002Fdocs","Introduction",{"path":180,"title":408,"navTitle":408,"group":403,"order":84,"groupOrder":66},"Installation",{"path":410,"title":411,"navTitle":411,"group":403,"order":265,"groupOrder":66},"\u002Fdocs\u002Ftesting","Testing",{"path":413,"title":414,"navTitle":414,"group":403,"order":221,"groupOrder":66},"\u002Fdocs\u002Fvalidation","Validation",{"path":30,"title":416,"navTitle":416,"group":403,"order":237,"groupOrder":66},"WebMCP exposure",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":418},"\u003Cg fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\">\u003Cpath d=\"M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z\"\u002F>\u003Cpath d=\"M14 2v5a1 1 0 0 0 1 1h5M10 9H8m8 4H8m8 4H8\"\u002F>\u003C\u002Fg>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":420},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"m12 19l-7-7l7-7m7 7H5\"\u002F>",1784517902938]