[{"data":1,"prerenderedAt":1332},["ShallowReactive",2],{"navigation":3,"\u002Fdocs\u002Fgetting-started\u002Fcustom-renderers":34},[4],{"title":5,"path":6,"stem":7,"children":8,"page":33},"Docs","\u002Fdocs","docs",[9],{"title":10,"path":11,"stem":12,"children":13,"icon":32},"Getting started","\u002Fdocs\u002Fgetting-started","docs\u002F01.getting-started\u002F01.index",[14,16,20,24,28],{"title":15,"path":11,"stem":12},"Installation",{"title":17,"path":18,"stem":19},"Usage","\u002Fdocs\u002Fgetting-started\u002Fform","docs\u002F01.getting-started\u002F02.Form",{"title":21,"path":22,"stem":23},"Layout","\u002Fdocs\u002Fgetting-started\u002Flayout","docs\u002F01.getting-started\u002F03.layout",{"title":25,"path":26,"stem":27},"Validation","\u002Fdocs\u002Fgetting-started\u002Fvalidation","docs\u002F01.getting-started\u002F04.validation",{"title":29,"path":30,"stem":31},"Custom renderers","\u002Fdocs\u002Fgetting-started\u002Fcustom-renderers","docs\u002F01.getting-started\u002F05.custom-renderers","i-lucide-square-play",false,{"page":35,"surround":1329},{"id":36,"title":29,"body":37,"description":1323,"extension":1324,"features":1325,"hero":1325,"links":1325,"meta":1326,"navigation":1325,"path":30,"seo":1327,"stem":31,"__hash__":1328},"docs\u002Fdocs\u002F01.getting-started\u002F05.custom-renderers.md",{"type":38,"value":39,"toc":1317},"minimark",[40,65,70,77,289,313,334,338,350,625,743,755,759,773,854,858,868,1298,1313],[41,42,43,44,48,49,52,53,56,57,60,61,64],"p",{},"Every property gets a field that matches its ",[45,46,47],"code",{},"type",": a text input for ",[45,50,51],{},"string",", a number input for ",[45,54,55],{},"number",", a switch for ",[45,58,59],{},"boolean",", and so on. Set ",[45,62,63],{},"renderer"," on a property to choose a different component.",[66,67,69],"h2",{"id":68},"built-in-renderers","Built-in renderers",[41,71,72,73,76],{},"Some fields have an alternative in the module. Use the component name, with the ",[45,74,75],{},"S"," prefix:",[78,79,84],"pre",{"className":80,"code":81,"language":82,"meta":83,"style":83},"language-json shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","{\n  \"type\": \"object\",\n  \"properties\": {\n    \"notes\": {\n      \"title\": \"Notes\",\n      \"type\": \"string\",\n      \"renderer\": \"STextarea\"\n    },\n    \"internalId\": {\n      \"type\": \"string\",\n      \"renderer\": \"none\"\n    }\n  }\n}\n","json","",[45,85,86,95,122,137,153,176,195,214,220,234,253,271,277,283],{"__ignoreMap":83},[87,88,91],"span",{"class":89,"line":90},"line",1,[87,92,94],{"class":93},"sMK4o","{\n",[87,96,98,101,104,107,110,113,117,119],{"class":89,"line":97},2,[87,99,100],{"class":93},"  \"",[87,102,47],{"class":103},"spNyl",[87,105,106],{"class":93},"\"",[87,108,109],{"class":93},":",[87,111,112],{"class":93}," \"",[87,114,116],{"class":115},"sfazB","object",[87,118,106],{"class":93},[87,120,121],{"class":93},",\n",[87,123,125,127,130,132,134],{"class":89,"line":124},3,[87,126,100],{"class":93},[87,128,129],{"class":103},"properties",[87,131,106],{"class":93},[87,133,109],{"class":93},[87,135,136],{"class":93}," {\n",[87,138,140,143,147,149,151],{"class":89,"line":139},4,[87,141,142],{"class":93},"    \"",[87,144,146],{"class":145},"sBMFI","notes",[87,148,106],{"class":93},[87,150,109],{"class":93},[87,152,136],{"class":93},[87,154,156,159,163,165,167,169,172,174],{"class":89,"line":155},5,[87,157,158],{"class":93},"      \"",[87,160,162],{"class":161},"sbssI","title",[87,164,106],{"class":93},[87,166,109],{"class":93},[87,168,112],{"class":93},[87,170,171],{"class":115},"Notes",[87,173,106],{"class":93},[87,175,121],{"class":93},[87,177,179,181,183,185,187,189,191,193],{"class":89,"line":178},6,[87,180,158],{"class":93},[87,182,47],{"class":161},[87,184,106],{"class":93},[87,186,109],{"class":93},[87,188,112],{"class":93},[87,190,51],{"class":115},[87,192,106],{"class":93},[87,194,121],{"class":93},[87,196,198,200,202,204,206,208,211],{"class":89,"line":197},7,[87,199,158],{"class":93},[87,201,63],{"class":161},[87,203,106],{"class":93},[87,205,109],{"class":93},[87,207,112],{"class":93},[87,209,210],{"class":115},"STextarea",[87,212,213],{"class":93},"\"\n",[87,215,217],{"class":89,"line":216},8,[87,218,219],{"class":93},"    },\n",[87,221,223,225,228,230,232],{"class":89,"line":222},9,[87,224,142],{"class":93},[87,226,227],{"class":145},"internalId",[87,229,106],{"class":93},[87,231,109],{"class":93},[87,233,136],{"class":93},[87,235,237,239,241,243,245,247,249,251],{"class":89,"line":236},10,[87,238,158],{"class":93},[87,240,47],{"class":161},[87,242,106],{"class":93},[87,244,109],{"class":93},[87,246,112],{"class":93},[87,248,51],{"class":115},[87,250,106],{"class":93},[87,252,121],{"class":93},[87,254,256,258,260,262,264,266,269],{"class":89,"line":255},11,[87,257,158],{"class":93},[87,259,63],{"class":161},[87,261,106],{"class":93},[87,263,109],{"class":93},[87,265,112],{"class":93},[87,267,268],{"class":115},"none",[87,270,213],{"class":93},[87,272,274],{"class":89,"line":273},12,[87,275,276],{"class":93},"    }\n",[87,278,280],{"class":89,"line":279},13,[87,281,282],{"class":93},"  }\n",[87,284,286],{"class":89,"line":285},14,[87,287,288],{"class":93},"}\n",[290,291,292,298,308],"ul",{},[293,294,295,297],"li",{},[45,296,210],{}," renders a string as a multi-line text area.",[293,299,300,303,304,307],{},[45,301,302],{},"SSelect"," renders a string with an ",[45,305,306],{},"enum"," as a select menu.",[293,309,310,312],{},[45,311,268],{}," renders nothing. The value stays in the form data.",[41,314,315,316,319,320,325,326,329,330,333],{},"The prefix follows the ",[45,317,318],{},"prefix"," ",[321,322,324],"a",{"href":323},"\u002Fdocs\u002Fgetting-started#configuration","module option",". With ",[45,327,328],{},"prefix: 'My'",", use ",[45,331,332],{},"MyTextarea",".",[66,335,337],{"id":336},"your-own-component","Your own component",[41,339,340,342,343,346,347,109],{},[45,341,63],{}," also accepts the name of a component from your app. The component is looked up by name at runtime, so it must be registered globally. Put it in ",[45,344,345],{},"components\u002Fglobal\u002F",", or name the file ",[45,348,349],{},"*.global.vue",[78,351,356],{"className":352,"code":353,"filename":354,"language":355,"meta":83,"style":83},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript lang=\"ts\" setup>\ndefineProps\u003C{\n  id: string\n  title?: string\n  description?: string\n  isRequired: boolean\n}>()\n\nconst value = defineModel\u003Cstring>({ default: '#00dc82' })\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CUFormField :name=\"id\" :label=\"title\" :description=\"description\" :required=\"isRequired\">\n    \u003CUColorPicker v-model=\"value\" \u002F>\n  \u003C\u002FUFormField>\n\u003C\u002Ftemplate>\n","components\u002Fglobal\u002FColorField.vue","vue",[45,357,358,386,395,405,415,424,434,443,449,496,505,509,518,583,606,616],{"__ignoreMap":83},[87,359,360,363,367,370,373,375,378,380,383],{"class":89,"line":90},[87,361,362],{"class":93},"\u003C",[87,364,366],{"class":365},"swJcz","script",[87,368,369],{"class":103}," lang",[87,371,372],{"class":93},"=",[87,374,106],{"class":93},[87,376,377],{"class":115},"ts",[87,379,106],{"class":93},[87,381,382],{"class":103}," setup",[87,384,385],{"class":93},">\n",[87,387,388,392],{"class":89,"line":97},[87,389,391],{"class":390},"s2Zo4","defineProps",[87,393,394],{"class":93},"\u003C{\n",[87,396,397,400,402],{"class":89,"line":124},[87,398,399],{"class":365},"  id",[87,401,109],{"class":93},[87,403,404],{"class":145}," string\n",[87,406,407,410,413],{"class":89,"line":139},[87,408,409],{"class":365},"  title",[87,411,412],{"class":93},"?:",[87,414,404],{"class":145},[87,416,417,420,422],{"class":89,"line":155},[87,418,419],{"class":365},"  description",[87,421,412],{"class":93},[87,423,404],{"class":145},[87,425,426,429,431],{"class":89,"line":178},[87,427,428],{"class":365},"  isRequired",[87,430,109],{"class":93},[87,432,433],{"class":145}," boolean\n",[87,435,436,439],{"class":89,"line":197},[87,437,438],{"class":93},"}>",[87,440,442],{"class":441},"sTEyZ","()\n",[87,444,445],{"class":89,"line":216},[87,446,448],{"emptyLinePlaceholder":447},true,"\n",[87,450,451,454,457,459,462,464,466,469,472,475,478,480,483,487,490,493],{"class":89,"line":222},[87,452,453],{"class":103},"const",[87,455,456],{"class":441}," value ",[87,458,372],{"class":93},[87,460,461],{"class":390}," defineModel",[87,463,362],{"class":93},[87,465,51],{"class":145},[87,467,468],{"class":93},">",[87,470,471],{"class":441},"(",[87,473,474],{"class":93},"{",[87,476,477],{"class":365}," default",[87,479,109],{"class":93},[87,481,482],{"class":93}," '",[87,484,486],{"class":485},"sJ0Mu","#00dc82",[87,488,489],{"class":93},"'",[87,491,492],{"class":93}," }",[87,494,495],{"class":441},")\n",[87,497,498,501,503],{"class":89,"line":236},[87,499,500],{"class":93},"\u003C\u002F",[87,502,366],{"class":365},[87,504,385],{"class":93},[87,506,507],{"class":89,"line":255},[87,508,448],{"emptyLinePlaceholder":447},[87,510,511,513,516],{"class":89,"line":273},[87,512,362],{"class":93},[87,514,515],{"class":365},"template",[87,517,385],{"class":93},[87,519,520,523,526,529,532,534,536,539,541,543,546,548,550,552,554,556,559,561,563,565,567,569,572,574,576,579,581],{"class":89,"line":279},[87,521,522],{"class":93},"  \u003C",[87,524,525],{"class":365},"UFormField",[87,527,528],{"class":93}," :",[87,530,531],{"class":103},"name",[87,533,372],{"class":93},[87,535,106],{"class":93},[87,537,538],{"class":441},"id",[87,540,106],{"class":93},[87,542,528],{"class":93},[87,544,545],{"class":103},"label",[87,547,372],{"class":93},[87,549,106],{"class":93},[87,551,162],{"class":441},[87,553,106],{"class":93},[87,555,528],{"class":93},[87,557,558],{"class":103},"description",[87,560,372],{"class":93},[87,562,106],{"class":93},[87,564,558],{"class":441},[87,566,106],{"class":93},[87,568,528],{"class":93},[87,570,571],{"class":103},"required",[87,573,372],{"class":93},[87,575,106],{"class":93},[87,577,578],{"class":441},"isRequired",[87,580,106],{"class":93},[87,582,385],{"class":93},[87,584,585,588,591,594,596,598,601,603],{"class":89,"line":285},[87,586,587],{"class":93},"    \u003C",[87,589,590],{"class":365},"UColorPicker",[87,592,593],{"class":103}," v-model",[87,595,372],{"class":93},[87,597,106],{"class":93},[87,599,600],{"class":441},"value",[87,602,106],{"class":93},[87,604,605],{"class":93}," \u002F>\n",[87,607,609,612,614],{"class":89,"line":608},15,[87,610,611],{"class":93},"  \u003C\u002F",[87,613,525],{"class":365},[87,615,385],{"class":93},[87,617,619,621,623],{"class":89,"line":618},16,[87,620,500],{"class":93},[87,622,515],{"class":365},[87,624,385],{"class":93},[78,626,628],{"className":80,"code":627,"language":82,"meta":83,"style":83},"{\n  \"type\": \"object\",\n  \"properties\": {\n    \"brandColor\": {\n      \"title\": \"Brand color\",\n      \"type\": \"string\",\n      \"renderer\": \"ColorField\"\n    }\n  }\n}\n",[45,629,630,634,652,664,677,696,714,731,735,739],{"__ignoreMap":83},[87,631,632],{"class":89,"line":90},[87,633,94],{"class":93},[87,635,636,638,640,642,644,646,648,650],{"class":89,"line":97},[87,637,100],{"class":93},[87,639,47],{"class":103},[87,641,106],{"class":93},[87,643,109],{"class":93},[87,645,112],{"class":93},[87,647,116],{"class":115},[87,649,106],{"class":93},[87,651,121],{"class":93},[87,653,654,656,658,660,662],{"class":89,"line":124},[87,655,100],{"class":93},[87,657,129],{"class":103},[87,659,106],{"class":93},[87,661,109],{"class":93},[87,663,136],{"class":93},[87,665,666,668,671,673,675],{"class":89,"line":139},[87,667,142],{"class":93},[87,669,670],{"class":145},"brandColor",[87,672,106],{"class":93},[87,674,109],{"class":93},[87,676,136],{"class":93},[87,678,679,681,683,685,687,689,692,694],{"class":89,"line":155},[87,680,158],{"class":93},[87,682,162],{"class":161},[87,684,106],{"class":93},[87,686,109],{"class":93},[87,688,112],{"class":93},[87,690,691],{"class":115},"Brand color",[87,693,106],{"class":93},[87,695,121],{"class":93},[87,697,698,700,702,704,706,708,710,712],{"class":89,"line":178},[87,699,158],{"class":93},[87,701,47],{"class":161},[87,703,106],{"class":93},[87,705,109],{"class":93},[87,707,112],{"class":93},[87,709,51],{"class":115},[87,711,106],{"class":93},[87,713,121],{"class":93},[87,715,716,718,720,722,724,726,729],{"class":89,"line":197},[87,717,158],{"class":93},[87,719,63],{"class":161},[87,721,106],{"class":93},[87,723,109],{"class":93},[87,725,112],{"class":93},[87,727,728],{"class":115},"ColorField",[87,730,213],{"class":93},[87,732,733],{"class":89,"line":216},[87,734,276],{"class":93},[87,736,737],{"class":89,"line":222},[87,738,282],{"class":93},[87,740,741],{"class":89,"line":236},[87,742,288],{"class":93},[41,744,745,746,748,749,751,752,754],{},"Set ",[45,747,531],{}," on ",[45,750,525],{}," to the ",[45,753,538],{}," prop, so validation errors for this property show up on your field.",[66,756,758],{"id":757},"props","Props",[41,760,761,762,764,765,764,767,769,770,772],{},"A renderer receives every keyword of its property's schema as a prop, such as ",[45,763,162],{},", ",[45,766,558],{},[45,768,129],{}," and ",[45,771,571],{},". It also receives:",[774,775,776,789],"table",{},[777,778,779],"thead",{},[780,781,782,786],"tr",{},[783,784,785],"th",{},"Prop",[783,787,788],{},"Description",[790,791,792,808,825,836],"tbody",{},[780,793,794,799],{},[795,796,797],"td",{},[45,798,538],{},[795,800,801,802,805,806,333],{},"The property's dot path in the form value, like ",[45,803,804],{},"guardian.email",". Use it as the form field ",[45,807,531],{},[780,809,810,815],{},[795,811,812],{},[45,813,814],{},"modelValue",[795,816,817,818,821,822,333],{},"The property's value. Emit ",[45,819,820],{},"update:modelValue"," to change it, or use ",[45,823,824],{},"defineModel()",[780,826,827,831],{},[795,828,829],{},[45,830,578],{},[795,832,833,834,333],{},"Whether the parent object lists this property in ",[45,835,571],{},[780,837,838,843],{},[795,839,840],{},[45,841,842],{},"validateFields",[795,844,845,848,849,853],{},[45,846,847],{},"(fields: string[]) => Promise\u003Cboolean>",". Validates the given fields by dot path and runs ",[321,850,852],{"href":851},"\u002Fdocs\u002Fgetting-started\u002Fvalidation#custom-validation","custom validation"," for them. Only a renderer on the root schema receives it.",[66,855,857],{"id":856},"rendering-nested-fields","Rendering nested fields",[41,859,860,861,863,864,867],{},"A renderer for an ",[45,862,116],{}," can render its children with the module's own components. Use ",[45,865,866],{},"SComponent"," to render a property just as the form would:",[78,869,872],{"className":352,"code":870,"filename":871,"language":355,"meta":83,"style":83},"\u003Cscript lang=\"ts\" setup>\ndefineProps\u003C{\n  id: string\n  title?: string\n  properties: Record\u003Cstring, Record\u003Cstring, unknown>>\n  required: string[]\n}>()\n\nconst value = defineModel\u003CRecord\u003Cstring, unknown>>({ required: true })\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CUCard>\n    \u003Ctemplate #header>{{ title }}\u003C\u002Ftemplate>\n    \u003CSComponent\n      v-for=\"(child, key) in properties\"\n      :key=\"key\"\n      v-bind=\"child\"\n      :id=\"id ? `${id}.${key}` : key\"\n      :model-value=\"value[key]\"\n      :is-required=\"required.includes(key)\"\n      @update:model-value=\"childValue => (value = { ...value, [key]: childValue })\"\n    \u002F>\n  \u003C\u002FUCard>\n\u003C\u002Ftemplate>\n","components\u002Fglobal\u002FPanel.vue",[45,873,874,894,900,908,916,947,960,966,970,1013,1021,1025,1033,1042,1065,1072,1099,1115,1129,1170,1194,1222,1274,1280,1289],{"__ignoreMap":83},[87,875,876,878,880,882,884,886,888,890,892],{"class":89,"line":90},[87,877,362],{"class":93},[87,879,366],{"class":365},[87,881,369],{"class":103},[87,883,372],{"class":93},[87,885,106],{"class":93},[87,887,377],{"class":115},[87,889,106],{"class":93},[87,891,382],{"class":103},[87,893,385],{"class":93},[87,895,896,898],{"class":89,"line":97},[87,897,391],{"class":390},[87,899,394],{"class":93},[87,901,902,904,906],{"class":89,"line":124},[87,903,399],{"class":365},[87,905,109],{"class":93},[87,907,404],{"class":145},[87,909,910,912,914],{"class":89,"line":139},[87,911,409],{"class":365},[87,913,412],{"class":93},[87,915,404],{"class":145},[87,917,918,921,923,926,928,930,933,935,937,939,941,944],{"class":89,"line":155},[87,919,920],{"class":365},"  properties",[87,922,109],{"class":93},[87,924,925],{"class":145}," Record",[87,927,362],{"class":93},[87,929,51],{"class":145},[87,931,932],{"class":93},",",[87,934,925],{"class":145},[87,936,362],{"class":93},[87,938,51],{"class":145},[87,940,932],{"class":93},[87,942,943],{"class":145}," unknown",[87,945,946],{"class":93},">>\n",[87,948,949,952,954,957],{"class":89,"line":178},[87,950,951],{"class":365},"  required",[87,953,109],{"class":93},[87,955,956],{"class":145}," string",[87,958,959],{"class":441},"[]\n",[87,961,962,964],{"class":89,"line":197},[87,963,438],{"class":93},[87,965,442],{"class":441},[87,967,968],{"class":89,"line":216},[87,969,448],{"emptyLinePlaceholder":447},[87,971,972,974,976,978,980,982,985,987,989,991,993,996,998,1000,1003,1005,1009,1011],{"class":89,"line":222},[87,973,453],{"class":103},[87,975,456],{"class":441},[87,977,372],{"class":93},[87,979,461],{"class":390},[87,981,362],{"class":93},[87,983,984],{"class":145},"Record",[87,986,362],{"class":93},[87,988,51],{"class":145},[87,990,932],{"class":93},[87,992,943],{"class":145},[87,994,995],{"class":93},">>",[87,997,471],{"class":441},[87,999,474],{"class":93},[87,1001,1002],{"class":365}," required",[87,1004,109],{"class":93},[87,1006,1008],{"class":1007},"sfNiH"," true",[87,1010,492],{"class":93},[87,1012,495],{"class":441},[87,1014,1015,1017,1019],{"class":89,"line":236},[87,1016,500],{"class":93},[87,1018,366],{"class":365},[87,1020,385],{"class":93},[87,1022,1023],{"class":89,"line":255},[87,1024,448],{"emptyLinePlaceholder":447},[87,1026,1027,1029,1031],{"class":89,"line":273},[87,1028,362],{"class":93},[87,1030,515],{"class":365},[87,1032,385],{"class":93},[87,1034,1035,1037,1040],{"class":89,"line":279},[87,1036,522],{"class":93},[87,1038,1039],{"class":365},"UCard",[87,1041,385],{"class":93},[87,1043,1044,1046,1048,1051,1054,1056,1059,1061,1063],{"class":89,"line":285},[87,1045,587],{"class":93},[87,1047,515],{"class":365},[87,1049,1050],{"class":93}," #",[87,1052,1053],{"class":103},"header",[87,1055,468],{"class":93},[87,1057,1058],{"class":441},"{{ title }}",[87,1060,500],{"class":93},[87,1062,515],{"class":365},[87,1064,385],{"class":93},[87,1066,1067,1069],{"class":89,"line":608},[87,1068,587],{"class":93},[87,1070,1071],{"class":365},"SComponent\n",[87,1073,1074,1078,1080,1082,1084,1087,1089,1092,1095,1097],{"class":89,"line":618},[87,1075,1077],{"class":1076},"s7zQu","      v-for",[87,1079,372],{"class":93},[87,1081,106],{"class":93},[87,1083,471],{"class":93},[87,1085,1086],{"class":441},"child",[87,1088,764],{"class":93},[87,1090,1091],{"class":441},"key",[87,1093,1094],{"class":93},") in ",[87,1096,129],{"class":441},[87,1098,213],{"class":93},[87,1100,1102,1105,1107,1109,1111,1113],{"class":89,"line":1101},17,[87,1103,1104],{"class":93},"      :",[87,1106,1091],{"class":103},[87,1108,372],{"class":93},[87,1110,106],{"class":93},[87,1112,1091],{"class":441},[87,1114,213],{"class":93},[87,1116,1118,1121,1123,1125,1127],{"class":89,"line":1117},18,[87,1119,1120],{"class":103},"      v-bind",[87,1122,372],{"class":93},[87,1124,106],{"class":93},[87,1126,1086],{"class":441},[87,1128,213],{"class":93},[87,1130,1132,1134,1136,1138,1140,1142,1145,1148,1150,1153,1155,1158,1160,1163,1166,1168],{"class":89,"line":1131},19,[87,1133,1104],{"class":93},[87,1135,538],{"class":103},[87,1137,372],{"class":93},[87,1139,106],{"class":93},[87,1141,538],{"class":441},[87,1143,1144],{"class":93}," ? ",[87,1146,1147],{"class":93},"`${",[87,1149,538],{"class":441},[87,1151,1152],{"class":93},"}",[87,1154,333],{"class":115},[87,1156,1157],{"class":93},"${",[87,1159,1091],{"class":441},[87,1161,1162],{"class":93},"}`",[87,1164,1165],{"class":93}," : ",[87,1167,1091],{"class":441},[87,1169,213],{"class":93},[87,1171,1173,1175,1178,1180,1182,1184,1187,1189,1192],{"class":89,"line":1172},20,[87,1174,1104],{"class":93},[87,1176,1177],{"class":103},"model-value",[87,1179,372],{"class":93},[87,1181,106],{"class":93},[87,1183,600],{"class":441},[87,1185,1186],{"class":93},"[",[87,1188,1091],{"class":441},[87,1190,1191],{"class":93},"]",[87,1193,213],{"class":93},[87,1195,1197,1199,1202,1204,1206,1208,1210,1213,1215,1217,1220],{"class":89,"line":1196},21,[87,1198,1104],{"class":93},[87,1200,1201],{"class":103},"is-required",[87,1203,372],{"class":93},[87,1205,106],{"class":93},[87,1207,571],{"class":441},[87,1209,333],{"class":93},[87,1211,1212],{"class":390},"includes",[87,1214,471],{"class":93},[87,1216,1091],{"class":441},[87,1218,1219],{"class":93},")",[87,1221,213],{"class":93},[87,1223,1225,1228,1231,1233,1235,1237,1239,1243,1246,1249,1251,1254,1256,1258,1260,1262,1264,1267,1269,1272],{"class":89,"line":1224},22,[87,1226,1227],{"class":93},"      @",[87,1229,1230],{"class":103},"update",[87,1232,109],{"class":93},[87,1234,1177],{"class":103},[87,1236,372],{"class":93},[87,1238,106],{"class":93},[87,1240,1242],{"class":1241},"sHdIc","childValue",[87,1244,1245],{"class":103}," =>",[87,1247,1248],{"class":93}," (",[87,1250,600],{"class":441},[87,1252,1253],{"class":93}," = { ...",[87,1255,600],{"class":441},[87,1257,764],{"class":93},[87,1259,1186],{"class":365},[87,1261,1091],{"class":441},[87,1263,1191],{"class":365},[87,1265,1266],{"class":93},": ",[87,1268,1242],{"class":441},[87,1270,1271],{"class":93}," })",[87,1273,213],{"class":93},[87,1275,1277],{"class":89,"line":1276},23,[87,1278,1279],{"class":93},"    \u002F>\n",[87,1281,1283,1285,1287],{"class":89,"line":1282},24,[87,1284,611],{"class":93},[87,1286,1039],{"class":365},[87,1288,385],{"class":93},[87,1290,1292,1294,1296],{"class":89,"line":1291},25,[87,1293,500],{"class":93},[87,1295,515],{"class":365},[87,1297,385],{"class":93},[41,1299,1300,1301,1305,1306,1309,1310,1312],{},"For a full example, see the multi-step form in the ",[321,1302,1304],{"href":1303},"\u002Fdemo","demo",". Its ",[45,1307,1308],{},"MultiStage"," renderer shows one child object per step and calls ",[45,1311,842],{}," before moving to the next one.",[1314,1315,1316],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}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 .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sJ0Mu, html code.shiki .sJ0Mu{background-color:#00dc82;color:#ffffff;display:inline-block;padding:0 0.15em;margin:0 -0.15em;border-radius:0.2em}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}",{"title":83,"searchDepth":97,"depth":97,"links":1318},[1319,1320,1321,1322],{"id":68,"depth":97,"text":69},{"id":336,"depth":97,"text":337},{"id":757,"depth":97,"text":758},{"id":856,"depth":97,"text":857},"Render a property with a built-in alternative or your own component.","md",null,{},{"title":29,"description":1323},"Iqicc_piOx4wrIPJ_GFBWghCbm5gQI_NMFJl_LKCyd0",[1330,1325],{"title":25,"path":26,"stem":27,"description":1331,"children":-1},"Validate forms with rules from the schema, custom error messages and your own checks.",1792420090823]