[{"data":1,"prerenderedAt":1419},["ShallowReactive",2],{"docs:radio":3,"demo:radio\u002Fhero":1418},{"frontmatter":4,"meta":5,"nodes":6},{},{},[7,12,16,20,25,28,173,177,206,210,214,221,293,310,388,392,410,568,572,590,825,829,832,839,983,1105,1109,1119,1212,1331,1335,1340,1383,1386],[8,9,11],"h1",{"id":10},"radio","Radio",[13,14,15],"p",{},"One choice from a set of options.",[17,18],"demo",{"name":19},"radio\u002Fhero",[21,22,24],"h2",{"id":23},"anatomy","Anatomy",[13,26,27],{},"A Radio only works inside a Radio Group. Import both and nest the radios inside the group:",[29,30,34],"pre",{"language":31,"meta":32,"class":33},"vue","title=\"Anatomy\"","shiki shiki-themes github-light github-dark dark:github-dark",[35,36,38,58,59,58,75,58,87,58,96,58,98,58,107,58,117,58,136,58,147,58,156,58,165],"code",{"class":37},"language-vue",[39,40,43,47,51,55],"span",{"class":41,"style":42},"line","display: inline",[39,44,46],{"style":45},"color:#24292E;--shiki-dark:#E1E4E8","\u003C",[39,48,50],{"style":49},"color:#22863A;--shiki-dark:#85E89D","script",[39,52,54],{"style":53},"color:#6F42C1;--shiki-dark:#B392F0"," setup",[39,56,57],{"style":45},">","\n",[39,60,61,65,68,71],{"class":41,"style":42},[39,62,64],{"style":63},"color:#D73A49;--shiki-dark:#F97583","import",[39,66,67],{"style":45}," { Radio } ",[39,69,70],{"style":63},"from",[39,72,74],{"style":73},"color:#032F62;--shiki-dark:#9ECBFF"," '@shardsui\u002Fvue\u002Fradio'",[39,76,77,79,82,84],{"class":41,"style":42},[39,78,64],{"style":63},[39,80,81],{"style":45}," { RadioGroup } ",[39,83,70],{"style":63},[39,85,86],{"style":73}," '@shardsui\u002Fvue\u002Fradio-group'",[39,88,89,92,94],{"class":41,"style":42},[39,90,91],{"style":45},"\u003C\u002F",[39,93,50],{"style":49},[39,95,57],{"style":45},[39,97],{"class":41,"style":42},[39,99,100,102,105],{"class":41,"style":42},[39,101,46],{"style":45},[39,103,104],{"style":49},"template",[39,106,57],{"style":45},[39,108,109,112,115],{"class":41,"style":42},[39,110,111],{"style":45},"  \u003C",[39,113,114],{"style":49},"RadioGroup",[39,116,57],{"style":45},[39,118,119,122,125,128,131,134],{"class":41,"style":42},[39,120,121],{"style":45},"    \u003C",[39,123,124],{"style":49},"Radio.Root",[39,126,127],{"style":53}," value",[39,129,130],{"style":45},"=",[39,132,133],{"style":73},"\"...\"",[39,135,57],{"style":45},[39,137,138,141,144],{"class":41,"style":42},[39,139,140],{"style":45},"      \u003C",[39,142,143],{"style":49},"Radio.Indicator",[39,145,146],{"style":45}," \u002F>",[39,148,149,152,154],{"class":41,"style":42},[39,150,151],{"style":45},"    \u003C\u002F",[39,153,124],{"style":49},[39,155,57],{"style":45},[39,157,158,161,163],{"class":41,"style":42},[39,159,160],{"style":45},"  \u003C\u002F",[39,162,114],{"style":49},[39,164,57],{"style":45},[39,166,167,169,171],{"class":41,"style":42},[39,168,91],{"style":45},[39,170,104],{"style":49},[39,172,57],{"style":45},[21,174,176],{"id":175},"usage-guidelines","Usage guidelines",[178,179,180],"ul",{},[181,182,183,187,188,191,192,195,196,199,200,205],"li",{},[184,185,186],"strong",{},"Form controls must have an accessible name",": name the group and each radio with ",[35,189,190],{},"\u003Clabel>"," elements, or with the ",[35,193,194],{},"Field"," and ",[35,197,198],{},"Fieldset"," components. See ",[201,202,204],"a",{"href":203},"#examples-labeling-a-radio-group","Labeling a radio group",".",[21,207,209],{"id":208},"examples","Examples",[211,212,204],"h3",{"id":213},"examples-labeling-a-radio-group",[13,215,216,217,220],{},"Point the group at a sibling label with ",[35,218,219],{},"aria-labelledby",":",[29,222,224],{"language":31,"meta":223,"class":33},"title=\"Using aria-labelledby to label a radio group\"",[35,225,226,58,234,58,256,58,271,58,277,58,285],{"class":37},[39,227,228,230,232],{"class":41,"style":42},[39,229,46],{"style":45},[39,231,104],{"style":49},[39,233,57],{"style":45},[39,235,236,238,241,244,246,249,252,254],{"class":41,"style":42},[39,237,111],{"style":45},[39,239,240],{"style":49},"div",[39,242,243],{"style":53}," id",[39,245,130],{"style":45},[39,247,248],{"style":73},"\"storage-type-label\"",[39,250,251],{"style":45},">Storage type\u003C\u002F",[39,253,240],{"style":49},[39,255,57],{"style":45},[39,257,258,260,262,265,267,269],{"class":41,"style":42},[39,259,111],{"style":45},[39,261,114],{"style":49},[39,263,264],{"style":53}," aria-labelledby",[39,266,130],{"style":45},[39,268,248],{"style":73},[39,270,57],{"style":45},[39,272,273],{"class":41,"style":42},[39,274,276],{"style":275},"color:#6A737D;--shiki-dark:#6A737D","    \u003C!-- radios -->",[39,278,279,281,283],{"class":41,"style":42},[39,280,160],{"style":45},[39,282,114],{"style":49},[39,284,57],{"style":45},[39,286,287,289,291],{"class":41,"style":42},[39,288,91],{"style":45},[39,290,104],{"style":49},[39,292,57],{"style":45},[13,294,295,296,298,299,301,302,305,306,309],{},"For each radio, an enclosing ",[35,297,190],{}," takes the least markup. ",[35,300,124],{}," renders a ",[35,303,304],{},"\u003Cspan>"," by default, so the label toggles the hidden ",[35,307,308],{},"\u003Cinput type=\"radio\">"," natively:",[29,311,314],{"language":31,"meta":312,"class":313},"title=\"Using an enclosing label to label a radio button\"","shiki shiki-themes github-light github-dark has-highlighted dark:github-dark",[35,315,316,58,324,58,335,58,350,58,358,58,366,58,371,58,380],{"class":37},[39,317,318,320,322],{"class":41,"style":42},[39,319,46],{"style":45},[39,321,104],{"style":49},[39,323,57],{"style":45},[39,325,328,330,333],{"class":326,"style":42},[41,327],"highlighted",[39,329,111],{"style":45},[39,331,332],{"style":49},"label",[39,334,57],{"style":45},[39,336,337,339,341,343,345,348],{"class":41,"style":42},[39,338,121],{"style":45},[39,340,124],{"style":49},[39,342,127],{"style":53},[39,344,130],{"style":45},[39,346,347],{"style":73},"\"ssd\"",[39,349,57],{"style":45},[39,351,352,354,356],{"class":41,"style":42},[39,353,140],{"style":45},[39,355,143],{"style":49},[39,357,146],{"style":45},[39,359,360,362,364],{"class":41,"style":42},[39,361,151],{"style":45},[39,363,124],{"style":49},[39,365,57],{"style":45},[39,367,368],{"class":41,"style":42},[39,369,370],{"style":45},"    SSD",[39,372,374,376,378],{"class":373,"style":42},[41,327],[39,375,160],{"style":45},[39,377,332],{"style":49},[39,379,57],{"style":45},[39,381,382,384,386],{"class":41,"style":42},[39,383,91],{"style":45},[39,385,104],{"style":49},[39,387,57],{"style":45},[211,389,391],{"id":390},"examples-rendering-as-a-native-button","Rendering as a native button",[13,393,394,395,398,399,402,403,406,407,409],{},"When each radio has its own label tied to it with ",[35,396,397],{},"for","\u002F",[35,400,401],{},"id",", render it as a native button with ",[35,404,405],{},"as=\"button\"",". The ",[35,408,401],{}," then lands on the button rather than the hidden input, so the label points at the focusable element:",[29,411,413],{"language":31,"meta":412,"class":33},"title=\"Sibling label pattern with a native button\"",[35,414,415,58,423,58,442,58,462,58,470,58,491,58,526,58,535,58,544,58,552,58,560],{"class":37},[39,416,417,419,421],{"class":41,"style":42},[39,418,46],{"style":45},[39,420,104],{"style":49},[39,422,57],{"style":45},[39,424,425,427,429,431,433,436,438,440],{"class":41,"style":42},[39,426,111],{"style":45},[39,428,240],{"style":49},[39,430,243],{"style":53},[39,432,130],{"style":45},[39,434,435],{"style":73},"\"storage-type\"",[39,437,251],{"style":45},[39,439,240],{"style":49},[39,441,57],{"style":45},[39,443,444,446,448,450,452,454,456,458,460],{"class":41,"style":42},[39,445,111],{"style":45},[39,447,114],{"style":49},[39,449,127],{"style":53},[39,451,130],{"style":45},[39,453,347],{"style":73},[39,455,264],{"style":53},[39,457,130],{"style":45},[39,459,435],{"style":73},[39,461,57],{"style":45},[39,463,464,466,468],{"class":41,"style":42},[39,465,121],{"style":45},[39,467,240],{"style":49},[39,469,57],{"style":45},[39,471,472,474,476,479,481,484,487,489],{"class":41,"style":42},[39,473,140],{"style":45},[39,475,332],{"style":49},[39,477,478],{"style":53}," for",[39,480,130],{"style":45},[39,482,483],{"style":73},"\"storage-type-ssd\"",[39,485,486],{"style":45},">SSD\u003C\u002F",[39,488,332],{"style":49},[39,490,57],{"style":45},[39,492,493,495,497,499,501,503,505,507,509,512,517,520,524],{"class":41,"style":42},[39,494,140],{"style":45},[39,496,124],{"style":49},[39,498,127],{"style":53},[39,500,130],{"style":45},[39,502,347],{"style":73},[39,504,243],{"style":53},[39,506,130],{"style":45},[39,508,483],{"style":73},[39,510,511],{"style":53}," ",[39,513,516],{"style":53,"class":514},[515],"highlighted-word","as",[39,518,130],{"style":45,"class":519},[515],[39,521,523],{"style":73,"class":522},[515],"\"button\"",[39,525,57],{"style":45},[39,527,528,531,533],{"class":41,"style":42},[39,529,530],{"style":45},"        \u003C",[39,532,143],{"style":49},[39,534,146],{"style":45},[39,536,537,540,542],{"class":41,"style":42},[39,538,539],{"style":45},"      \u003C\u002F",[39,541,124],{"style":49},[39,543,57],{"style":45},[39,545,546,548,550],{"class":41,"style":42},[39,547,151],{"style":45},[39,549,240],{"style":49},[39,551,57],{"style":45},[39,553,554,556,558],{"class":41,"style":42},[39,555,160],{"style":45},[39,557,114],{"style":49},[39,559,57],{"style":45},[39,561,562,564,566],{"class":41,"style":42},[39,563,91],{"style":45},[39,565,104],{"style":49},[39,567,57],{"style":45},[211,569,571],{"id":570},"examples-form-integration","Form integration",[13,573,574,577,578,581,582,585,586,589],{},[35,575,576],{},"Field.Root"," names the group and wires it into the form; ",[35,579,580],{},"Fieldset.Legend"," labels it. Give each radio its own ",[35,583,584],{},"Field.Item",", which scopes the enclosed ",[35,587,588],{},"Field.Label"," to that radio alone:",[29,591,593],{"language":31,"meta":592,"class":313},"title=\"Using Radio Group in a form\"",[35,594,595,58,603,58,612,58,629,58,638,58,650,58,658,58,667,58,676,58,701,58,706,58,715,58,724,58,732,58,740,58,763,58,768,58,776,58,784,58,793,58,801,58,809,58,817],{"class":37},[39,596,597,599,601],{"class":41,"style":42},[39,598,46],{"style":45},[39,600,104],{"style":49},[39,602,57],{"style":45},[39,604,605,607,610],{"class":41,"style":42},[39,606,111],{"style":45},[39,608,609],{"style":49},"Form",[39,611,57],{"style":45},[39,613,615,617,619,622,624,627],{"class":614,"style":42},[41,327],[39,616,121],{"style":45},[39,618,576],{"style":49},[39,620,621],{"style":53}," name",[39,623,130],{"style":45},[39,625,626],{"style":73},"\"storageType\"",[39,628,57],{"style":45},[39,630,631,633,636],{"class":41,"style":42},[39,632,140],{"style":45},[39,634,635],{"style":49},"Fieldset.Root",[39,637,57],{"style":45},[39,639,640,642,644,646,648],{"class":41,"style":42},[39,641,530],{"style":45},[39,643,580],{"style":49},[39,645,251],{"style":45},[39,647,580],{"style":49},[39,649,57],{"style":45},[39,651,652,654,656],{"class":41,"style":42},[39,653,530],{"style":45},[39,655,114],{"style":49},[39,657,57],{"style":45},[39,659,660,663,665],{"class":41,"style":42},[39,661,662],{"style":45},"          \u003C",[39,664,584],{"style":49},[39,666,57],{"style":45},[39,668,669,672,674],{"class":41,"style":42},[39,670,671],{"style":45},"            \u003C",[39,673,588],{"style":49},[39,675,57],{"style":45},[39,677,678,681,683,685,687,689,692,694,697,699],{"class":41,"style":42},[39,679,680],{"style":45},"              \u003C",[39,682,124],{"style":49},[39,684,127],{"style":53},[39,686,130],{"style":45},[39,688,347],{"style":73},[39,690,691],{"style":45},">\u003C",[39,693,143],{"style":49},[39,695,696],{"style":45}," \u002F>\u003C\u002F",[39,698,124],{"style":49},[39,700,57],{"style":45},[39,702,703],{"class":41,"style":42},[39,704,705],{"style":45},"              SSD",[39,707,708,711,713],{"class":41,"style":42},[39,709,710],{"style":45},"            \u003C\u002F",[39,712,588],{"style":49},[39,714,57],{"style":45},[39,716,717,720,722],{"class":41,"style":42},[39,718,719],{"style":45},"          \u003C\u002F",[39,721,584],{"style":49},[39,723,57],{"style":45},[39,725,726,728,730],{"class":41,"style":42},[39,727,662],{"style":45},[39,729,584],{"style":49},[39,731,57],{"style":45},[39,733,734,736,738],{"class":41,"style":42},[39,735,671],{"style":45},[39,737,588],{"style":49},[39,739,57],{"style":45},[39,741,742,744,746,748,750,753,755,757,759,761],{"class":41,"style":42},[39,743,680],{"style":45},[39,745,124],{"style":49},[39,747,127],{"style":53},[39,749,130],{"style":45},[39,751,752],{"style":73},"\"hdd\"",[39,754,691],{"style":45},[39,756,143],{"style":49},[39,758,696],{"style":45},[39,760,124],{"style":49},[39,762,57],{"style":45},[39,764,765],{"class":41,"style":42},[39,766,767],{"style":45},"              HDD",[39,769,770,772,774],{"class":41,"style":42},[39,771,710],{"style":45},[39,773,588],{"style":49},[39,775,57],{"style":45},[39,777,778,780,782],{"class":41,"style":42},[39,779,719],{"style":45},[39,781,584],{"style":49},[39,783,57],{"style":45},[39,785,786,789,791],{"class":41,"style":42},[39,787,788],{"style":45},"        \u003C\u002F",[39,790,114],{"style":49},[39,792,57],{"style":45},[39,794,795,797,799],{"class":41,"style":42},[39,796,539],{"style":45},[39,798,635],{"style":49},[39,800,57],{"style":45},[39,802,803,805,807],{"class":41,"style":42},[39,804,151],{"style":45},[39,806,576],{"style":49},[39,808,57],{"style":45},[39,810,811,813,815],{"class":41,"style":42},[39,812,160],{"style":45},[39,814,609],{"style":49},[39,816,57],{"style":45},[39,818,819,821,823],{"class":41,"style":42},[39,820,91],{"style":45},[39,822,104],{"style":49},[39,824,57],{"style":45},[21,826,828],{"id":827},"api-reference","API reference",[211,830,114],{"id":831},"api-reference-radiogroup",[13,833,834,835,838],{},"Provides a shared state to a series of radio buttons.\nRenders a ",[35,836,837],{},"\u003Cdiv>"," element.",[840,841],"table",{"columns":842,"rows":846},[843,844,845],"Prop","Type","Default",[847,859,870,879,889,900,909,918,927,936,945,954,963,973],{"summary":848,"detail":852},[849,850,851],"\u003Ccode>as\u003C\u002Fcode>","\u003Ccode>keyof HTMLElementTagNameMap\u003C\u002Fcode>","\u003Ccode>'div'\u003C\u002Fcode>",[853,854,855,856],{"label":843,"html":849},{"label":844,"html":850},{"label":845,"html":851},{"label":857,"html":858},"Description","HTML element to render.",{"summary":860,"detail":864},[861,862,863],"\u003Ccode>class\u003C\u002Fcode>","\u003Ccode>string\u003C\u002Fcode>","—",[865,866,867,868],{"label":843,"html":861},{"label":844,"html":862},{"label":845,"html":863},{"label":857,"html":869},"CSS class applied to the element.",{"summary":871,"detail":873},[872,862,863],"\u003Ccode>style\u003C\u002Fcode>",[874,875,876,877],{"label":843,"html":872},{"label":844,"html":862},{"label":845,"html":863},{"label":857,"html":878},"Inline style applied to the element.",{"summary":880,"detail":883},[881,882,863],"\u003Ccode>value\u003C\u002Fcode>","\u003Ccode>Value\u003C\u002Fcode>",[884,885,886,887],{"label":843,"html":881},{"label":844,"html":882},{"label":845,"html":863},{"label":857,"html":888},"The selected radio value. Pass an initial value for uncontrolled use, or \u003Ccode>v-model:value\u003C\u002Fcode> to control it.",{"summary":890,"detail":894},[891,892,893],"\u003Ccode>disabled\u003C\u002Fcode>","\u003Ccode>boolean\u003C\u002Fcode>","\u003Ccode>false\u003C\u002Fcode>",[895,896,897,898],{"label":843,"html":891},{"label":844,"html":892},{"label":845,"html":893},{"label":857,"html":899},"Disables every radio in the group. Also on when an enclosing \u003Ccode>Field.Root\u003C\u002Fcode> is disabled.",{"summary":901,"detail":903},[902,892,893],"\u003Ccode>readOnly\u003C\u002Fcode>",[904,905,906,907],{"label":843,"html":902},{"label":844,"html":892},{"label":845,"html":893},{"label":857,"html":908},"Keeps the radios focusable but prevents the selection from changing.",{"summary":910,"detail":912},[911,892,893],"\u003Ccode>required\u003C\u002Fcode>",[913,914,915,916],{"label":843,"html":911},{"label":844,"html":892},{"label":845,"html":893},{"label":857,"html":917},"Requires a selection before the form can submit.",{"summary":919,"detail":921},[920,862,863],"\u003Ccode>name\u003C\u002Fcode>",[922,923,924,925],{"label":843,"html":920},{"label":844,"html":862},{"label":845,"html":863},{"label":857,"html":926},"Form-submission key shared with all child radios. An enclosing \u003Ccode>Field.Root\u003C\u002Fcode>'s \u003Ccode>name\u003C\u002Fcode> wins.",{"summary":928,"detail":930},[929,862,863],"\u003Ccode>form\u003C\u002Fcode>",[931,932,933,934],{"label":843,"html":929},{"label":844,"html":862},{"label":845,"html":863},{"label":857,"html":935},"\u003Ccode>id\u003C\u002Fcode> of the form the hidden inputs belong to, when rendered outside it.",{"summary":937,"detail":939},[938,862,863],"\u003Ccode>aria-labelledby\u003C\u002Fcode>",[940,941,942,943],{"label":843,"html":938},{"label":844,"html":862},{"label":845,"html":863},{"label":857,"html":944},"Accessible name for the group. Falls back to an enclosing \u003Ccode>Field.Label\u003C\u002Fcode> or \u003Ccode>Fieldset.Legend\u003C\u002Fcode>.",{"summary":946,"detail":948},[947,862,863],"\u003Ccode>aria-describedby\u003C\u002Fcode>",[949,950,951,952],{"label":843,"html":947},{"label":844,"html":862},{"label":845,"html":863},{"label":857,"html":953},"Additional description IDs; merged with Field message IDs when wrapped in \u003Ccode>Field.Root\u003C\u002Fcode>.",{"summary":955,"detail":957},[956,862,863],"\u003Ccode>id\u003C\u002Fcode>",[958,959,960,961],{"label":843,"html":956},{"label":844,"html":862},{"label":845,"html":863},{"label":857,"html":962},"Custom element ID.",{"summary":964,"detail":967},[965,966,863],"\u003Ccode>update:value\u003C\u002Fcode>","\u003Ccode>(value: Value) => void\u003C\u002Fcode>",[968,969,970,971],{"label":843,"html":965},{"label":844,"html":966},{"label":845,"html":863},{"label":857,"html":972},"Emitted when the selected value changes.",{"summary":974,"detail":977},[975,976,863],"\u003Ccode>default\u003C\u002Fcode>","\u003Ccode>Slot<{ touched, dirty, filled, focused, valid, disabled, readOnly, required }>\u003C\u002Fcode>",[978,979,980,981],{"label":843,"html":975},{"label":844,"html":976},{"label":845,"html":863},{"label":857,"html":982},"Content; receives the group's state and the enclosing field's state.",[840,984,985,998],{},[986,987,988],"thead",{},[989,990,991,996],"tr",{},[992,993,995],"th",{"style":994},"text-align:left","Attribute",[992,997,857],{"style":994},[999,1000,1001,1012,1022,1032,1045,1057,1069,1081,1093],"tbody",{},[989,1002,1003,1009],{},[1004,1005,1006],"td",{"style":994},[35,1007,1008],{},"data-disabled",[1004,1010,1011],{"style":994},"Present when the group is disabled.",[989,1013,1014,1019],{},[1004,1015,1016],{"style":994},[35,1017,1018],{},"data-readonly",[1004,1020,1021],{"style":994},"Present when the group is read-only.",[989,1023,1024,1029],{},[1004,1025,1026],{"style":994},[35,1027,1028],{},"data-required",[1004,1030,1031],{"style":994},"Present when the group is required.",[989,1033,1034,1039],{},[1004,1035,1036],{"style":994},[35,1037,1038],{},"data-valid",[1004,1040,1041,1042,1044],{"style":994},"Present when the field is valid (when wrapped in ",[35,1043,576],{},").",[989,1046,1047,1052],{},[1004,1048,1049],{"style":994},[35,1050,1051],{},"data-invalid",[1004,1053,1054,1055,1044],{"style":994},"Present when the field is invalid (when wrapped in ",[35,1056,576],{},[989,1058,1059,1064],{},[1004,1060,1061],{"style":994},[35,1062,1063],{},"data-touched",[1004,1065,1066,1067,1044],{"style":994},"Present when the field has been touched (when wrapped in ",[35,1068,576],{},[989,1070,1071,1076],{},[1004,1072,1073],{"style":994},[35,1074,1075],{},"data-dirty",[1004,1077,1078,1079,1044],{"style":994},"Present when the value has changed (when wrapped in ",[35,1080,576],{},[989,1082,1083,1088],{},[1004,1084,1085],{"style":994},[35,1086,1087],{},"data-filled",[1004,1089,1090,1091,1044],{"style":994},"Present when the group has a selection (when wrapped in ",[35,1092,576],{},[989,1094,1095,1100],{},[1004,1096,1097],{"style":994},[35,1098,1099],{},"data-focused",[1004,1101,1102,1103,1044],{"style":994},"Present when focus is inside the group (when wrapped in ",[35,1104,576],{},[211,1106,1108],{"id":1107},"api-reference-root","Root",[13,1110,1111,1112,1114,1115,1118],{},"Represents the radio button itself.\nRenders a ",[35,1113,304],{}," element and a hidden ",[35,1116,1117],{},"\u003Cinput>"," beside.",[840,1120],{"columns":1121,"rows":1122},[843,844,845],[1123,1132,1139,1146,1155,1164,1172,1180,1188,1196,1203],{"summary":1124,"detail":1127},[849,1125,1126],"\u003Ccode>'span' | 'button'\u003C\u002Fcode>","\u003Ccode>'span'\u003C\u002Fcode>",[1128,1129,1130,1131],{"label":843,"html":849},{"label":844,"html":1125},{"label":845,"html":1126},{"label":857,"html":858},{"summary":1133,"detail":1134},[861,862,863],[1135,1136,1137,1138],{"label":843,"html":861},{"label":844,"html":862},{"label":845,"html":863},{"label":857,"html":869},{"summary":1140,"detail":1141},[872,862,863],[1142,1143,1144,1145],{"label":843,"html":872},{"label":844,"html":862},{"label":845,"html":863},{"label":857,"html":878},{"summary":1147,"detail":1149},[956,862,1148],"auto",[1150,1151,1152,1153],{"label":843,"html":956},{"label":844,"html":862},{"label":845,"html":1148},{"label":857,"html":1154},"Applied to the hidden \u003Ccode><input>\u003C\u002Fcode> — or to the element itself when \u003Ccode>as="button"\u003C\u002Fcode>.",{"summary":1156,"detail":1158},[881,1157,863],"\u003Ccode>unknown\u003C\u002Fcode>",[1159,1160,1161,1162],{"label":843,"html":881},{"label":844,"html":1157},{"label":845,"html":863},{"label":857,"html":1163},"Required. Identifies this radio within the group.",{"summary":1165,"detail":1166},[891,892,893],[1167,1168,1169,1170],{"label":843,"html":891},{"label":844,"html":892},{"label":845,"html":893},{"label":857,"html":1171},"Disables interaction. Also on when the group, \u003Ccode>Field.Root\u003C\u002Fcode> or \u003Ccode>Field.Item\u003C\u002Fcode> is disabled.",{"summary":1173,"detail":1174},[902,892,893],[1175,1176,1177,1178],{"label":843,"html":902},{"label":844,"html":892},{"label":845,"html":893},{"label":857,"html":1179},"Prevents selection. Also on when the group is read-only.",{"summary":1181,"detail":1182},[911,892,893],[1183,1184,1185,1186],{"label":843,"html":911},{"label":844,"html":892},{"label":845,"html":893},{"label":857,"html":1187},"Marks the hidden input required. Also on when the group is required.",{"summary":1189,"detail":1190},[938,862,863],[1191,1192,1193,1194],{"label":843,"html":938},{"label":844,"html":862},{"label":845,"html":863},{"label":857,"html":1195},"Accessible name. Falls back to an enclosing or associated \u003Ccode><label>\u003C\u002Fcode>.",{"summary":1197,"detail":1198},[947,862,863],[1199,1200,1201,1202],{"label":843,"html":947},{"label":844,"html":862},{"label":845,"html":863},{"label":857,"html":953},{"summary":1204,"detail":1206},[975,1205,863],"\u003Ccode>Slot<{ touched, dirty, filled, focused, valid, checked, disabled, readOnly, required }>\u003C\u002Fcode>",[1207,1208,1209,1210],{"label":843,"html":975},{"label":844,"html":1205},{"label":845,"html":863},{"label":857,"html":1211},"Content; receives the radio's state and the enclosing field's state.",[840,1213,1214,1222],{},[986,1215,1216],{},[989,1217,1218,1220],{},[992,1219,995],{"style":994},[992,1221,857],{"style":994},[999,1223,1224,1234,1244,1253,1262,1271,1281,1291,1301,1311,1321],{},[989,1225,1226,1231],{},[1004,1227,1228],{"style":994},[35,1229,1230],{},"data-checked",[1004,1232,1233],{"style":994},"Present when selected.",[989,1235,1236,1241],{},[1004,1237,1238],{"style":994},[35,1239,1240],{},"data-unchecked",[1004,1242,1243],{"style":994},"Present when not selected.",[989,1245,1246,1250],{},[1004,1247,1248],{"style":994},[35,1249,1008],{},[1004,1251,1252],{"style":994},"Present when disabled.",[989,1254,1255,1259],{},[1004,1256,1257],{"style":994},[35,1258,1018],{},[1004,1260,1261],{"style":994},"Present when read-only.",[989,1263,1264,1268],{},[1004,1265,1266],{"style":994},[35,1267,1028],{},[1004,1269,1270],{"style":994},"Present when required.",[989,1272,1273,1277],{},[1004,1274,1275],{"style":994},[35,1276,1038],{},[1004,1278,1041,1279,1044],{"style":994},[35,1280,576],{},[989,1282,1283,1287],{},[1004,1284,1285],{"style":994},[35,1286,1051],{},[1004,1288,1054,1289,1044],{"style":994},[35,1290,576],{},[989,1292,1293,1297],{},[1004,1294,1295],{"style":994},[35,1296,1063],{},[1004,1298,1066,1299,1044],{"style":994},[35,1300,576],{},[989,1302,1303,1307],{},[1004,1304,1305],{"style":994},[35,1306,1075],{},[1004,1308,1078,1309,1044],{"style":994},[35,1310,576],{},[989,1312,1313,1317],{},[1004,1314,1315],{"style":994},[35,1316,1087],{},[1004,1318,1090,1319,1044],{"style":994},[35,1320,576],{},[989,1322,1323,1327],{},[1004,1324,1325],{"style":994},[35,1326,1099],{},[1004,1328,1102,1329,1044],{"style":994},[35,1330,576],{},[211,1332,1334],{"id":1333},"api-reference-indicator","Indicator",[13,1336,1337,1338,838],{},"Indicates whether the radio button is selected.\nRenders a ",[35,1339,304],{},[840,1341],{"columns":1342,"rows":1343},[843,844,845],[1344,1351,1358,1365,1374],{"summary":1345,"detail":1346},[849,850,1126],[1347,1348,1349,1350],{"label":843,"html":849},{"label":844,"html":850},{"label":845,"html":1126},{"label":857,"html":858},{"summary":1352,"detail":1353},[861,862,863],[1354,1355,1356,1357],{"label":843,"html":861},{"label":844,"html":862},{"label":845,"html":863},{"label":857,"html":869},{"summary":1359,"detail":1360},[872,862,863],[1361,1362,1363,1364],{"label":843,"html":872},{"label":844,"html":862},{"label":845,"html":863},{"label":857,"html":878},{"summary":1366,"detail":1368},[1367,892,893],"\u003Ccode>keepMounted\u003C\u002Fcode>",[1369,1370,1371,1372],{"label":843,"html":1367},{"label":844,"html":892},{"label":845,"html":893},{"label":857,"html":1373},"Keep in DOM when unchecked (for exit animations).",{"summary":1375,"detail":1377},[975,1376,863],"\u003Ccode>Slot<{ touched, dirty, filled, focused, valid, checked, disabled, readOnly, required, transitionStatus }>\u003C\u002Fcode>",[1378,1379,1380,1381],{"label":843,"html":975},{"label":844,"html":1376},{"label":845,"html":863},{"label":857,"html":1382},"Content; receives the radio's state plus the indicator's \u003Ccode>transitionStatus\u003C\u002Fcode>.",[13,1384,1385],{},"Inherits the same data attributes as Root, plus:",[840,1387,1388,1396],{},[986,1389,1390],{},[989,1391,1392,1394],{},[992,1393,995],{"style":994},[992,1395,857],{"style":994},[999,1397,1398,1408],{},[989,1399,1400,1405],{},[1004,1401,1402],{"style":994},[35,1403,1404],{},"data-starting-style",[1004,1406,1407],{"style":994},"Present when the indicator is animating in.",[989,1409,1410,1415],{},[1004,1411,1412],{"style":994},[35,1413,1414],{},"data-ending-style",[1004,1416,1417],{"style":994},"Present when the indicator is animating out.","\u003Cpre class=\"shiki shiki-themes github-light github-dark\" style=\"--shiki-light:#24292e;--shiki-dark:#e1e4e8;--shiki-light-bg:#fff;--shiki-dark-bg:#24292e\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"><\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">script\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\"> setup\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\"> lang\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"ts\"\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\">import\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"> { useId } \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\">from\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\"> 'vue'\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\">import\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"> { Radio } \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\">from\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\"> '@shardsui\u002Fvue\u002Fradio'\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\">import\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"> { RadioGroup } \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\">from\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\"> '@shardsui\u002Fvue\u002Fradio-group'\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\">const\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#005CC5;--shiki-dark:#79B8FF\"> id\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\"> =\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\"> useId\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">()\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\">const\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#005CC5;--shiki-dark:#79B8FF\"> levels\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#D73A49;--shiki-dark:#F97583\"> =\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"> [\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">  { value: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">'beginner'\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">, label: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">'Beginner'\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"> },\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">  { value: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">'intermediate'\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">, label: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">'Intermediate'\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"> },\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">  { value: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">'advanced'\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">, label: \u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">'Advanced'\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"> }\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">]\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"><\u002F\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">script\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"><\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">template\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">  <\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">RadioGroup\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">    value\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"intermediate\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">    class\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"flex flex-col items-start gap-1 text-gray-900\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">    :\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">aria-labelledby\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">id\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">  >\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">    <\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">div\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\"> class\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"text-sm font-semibold\"\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\"> :id\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"id\"\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>Difficulty<\u002F\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">div\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">    <\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">label\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">      v-for\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"level in levels\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">      :key\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"level.value\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">      class\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"flex items-center gap-2 text-sm font-normal\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">    >\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">      <\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">Radio.Root\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">        :value\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"level.value\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\">        class\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"flex size-4 shrink-0 items-center justify-center rounded-full focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-950 data-checked:bg-gray-900 data-unchecked:border data-unchecked:border-gray-300\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">      >\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">        <\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">Radio.Indicator\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#6F42C1;--shiki-dark:#B392F0\"> class\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">=\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#032F62;--shiki-dark:#9ECBFF\">\"flex before:size-2 before:rounded-full before:bg-gray-50\"\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"> \u002F>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">      <\u002F\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">Radio.Root\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">      {{ level.label }}\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">    <\u002F\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">label\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">  <\u002F\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">RadioGroup\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\"><\u002F\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#22863A;--shiki-dark:#85E89D\">template\u003C\u002Fspan>\u003Cspan style=\"--shiki-light:#24292E;--shiki-dark:#E1E4E8\">>\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>",1789390076947]