[{"data":1,"prerenderedAt":1249},["ShallowReactive",2],{"content-\u002Fdocs\u002Fmultistep\u002Furl-sync":3},{"id":4,"title":5,"body":6,"description":1229,"extension":1230,"meta":1231,"metaRows":1232,"navigation":92,"path":1244,"seo":1245,"source":1246,"stem":1247,"__hash__":1248},"docs\u002Fdocs\u002Fmultistep\u002Furl-sync.md","URL sync",{"type":7,"value":8,"toc":1220},"minimark",[9,13,33,36,41,58,138,171,184,188,202,209,213,220,276,307,311,319,404,407,579,585,589,595,1030,1033,1036,1047,1169,1176,1180,1216],[10,11,5],"h1",{"id":12},"url-sync",[14,15,16],"blockquote",{},[17,18,19,20,24,25,28,29,32],"p",{},"A wizard with no extra options reads its starting step from ",[21,22,23],"code",{},"?step=\u003Ckey>"," on the URL and writes the active step back as the user navigates. Reloads land on the same step, deep links render the right step on the first byte under SSR, and the URL stays shareable. To rename the param, scope it across wizards on the same page, or wire the state to non-URL storage, pass ",[21,26,27],{},"restore"," and ",[21,30,31],{},"persist"," callbacks.",[34,35],"docs-meta-table",{},[37,38,40],"h2",{"id":39},"the-default-behavior","The default behavior",[17,42,43,46,47,50,51,53,54,57],{},[21,44,45],{},"useWizard"," does URL sync out of the box. Construct a wizard with nothing but ",[21,48,49],{},"steps",", and the wizard reads ",[21,52,23],{}," from the URL at construction and mirrors ",[21,55,56],{},"currentStep"," back to it on every navigation:",[59,60,65],"pre",{"className":61,"code":62,"language":63,"meta":64,"style":64},"language-ts shiki shiki-themes github-light github-dark","import { useForm, useWizard } from 'attaform\u002Fzod'\n\nconst wizard = useWizard({\n  steps: ['welcome', shipping, payment, 'final-review'],\n})\n","ts","",[21,66,67,87,94,114,132],{"__ignoreMap":64},[68,69,72,76,80,83],"span",{"class":70,"line":71},"line",1,[68,73,75],{"class":74},"szBVR","import",[68,77,79],{"class":78},"sVt8B"," { useForm, useWizard } ",[68,81,82],{"class":74},"from",[68,84,86],{"class":85},"sZZnC"," 'attaform\u002Fzod'\n",[68,88,90],{"class":70,"line":89},2,[68,91,93],{"emptyLinePlaceholder":92},true,"\n",[68,95,97,100,104,107,111],{"class":70,"line":96},3,[68,98,99],{"class":74},"const",[68,101,103],{"class":102},"sj4cs"," wizard",[68,105,106],{"class":74}," =",[68,108,110],{"class":109},"sScJk"," useWizard",[68,112,113],{"class":78},"({\n",[68,115,117,120,123,126,129],{"class":70,"line":116},4,[68,118,119],{"class":78},"  steps: [",[68,121,122],{"class":85},"'welcome'",[68,124,125],{"class":78},", shipping, payment, ",[68,127,128],{"class":85},"'final-review'",[68,130,131],{"class":78},"],\n",[68,133,135],{"class":70,"line":134},5,[68,136,137],{"class":78},"})\n",[139,140,141,153,162,165],"ul",{},[142,143,144,145,148,149,152],"li",{},"Landing on ",[21,146,147],{},"\u002Fcheckout?step=payment"," boots the wizard with ",[21,150,151],{},"currentStep === 'payment'",".",[142,154,155,28,158,161],{},[21,156,157],{},"wizard.next()",[21,159,160],{},"wizard.goTo('shipping')"," update the URL as the active step changes.",[142,163,164],{},"Reloading the page lands on the same step.",[142,166,167,168,170],{},"The URL is shareable: paste ",[21,169,147],{}," into another tab and that tab opens on the payment step.",[17,172,173,174,177,178,183],{},"The default write uses ",[21,175,176],{},"history.replaceState",", so a single back-button press leaves the wizard's host page rather than walking backward through every step the user visited. If you want push semantics (back button retreats one step), see ",[179,180,182],"a",{"href":181},"#pushing-each-navigation","Pushing each navigation"," below.",[37,185,187],{"id":186},"ssr-hand-off","SSR hand-off",[17,189,190,191,194,195,198,199,201],{},"Under SSR (Nuxt or any framework wired through ",[21,192,193],{},"createAttaform()","), the default restore reads the incoming request's ",[21,196,197],{},"?step"," from a server-side resolver provided by the integration, so the first byte rendered on the server matches what the URL asked for. The wizard exposes nothing extra here: with default ",[21,200,27],{}," and the Nuxt module installed, deep links render the right step on the first paint with no consumer wiring.",[17,203,204,205,208],{},"A bare-Vue SPA without the Nuxt integration still gets the client-side default: ",[21,206,207],{},"window.location"," is read on construction once the page hydrates, and the wizard navigates to the matching step before the user sees the first render.",[37,210,212],{"id":211},"disabling-url-sync","Disabling URL sync",[17,214,215,216,219],{},"Pass ",[21,217,218],{},"false"," to either side to opt out of the default. The two switches are independent:",[59,221,223],{"className":61,"code":222,"language":63,"meta":64,"style":64},"const wizard = useWizard({\n  steps: [...],\n  restore: false,  \u002F\u002F don't read the URL at construction\n  persist: false,  \u002F\u002F don't write the URL on navigation\n})\n",[21,224,225,237,246,260,272],{"__ignoreMap":64},[68,226,227,229,231,233,235],{"class":70,"line":71},[68,228,99],{"class":74},[68,230,103],{"class":102},[68,232,106],{"class":74},[68,234,110],{"class":109},[68,236,113],{"class":78},[68,238,239,241,244],{"class":70,"line":89},[68,240,119],{"class":78},[68,242,243],{"class":74},"...",[68,245,131],{"class":78},[68,247,248,251,253,256],{"class":70,"line":96},[68,249,250],{"class":78},"  restore: ",[68,252,218],{"class":102},[68,254,255],{"class":78},",  ",[68,257,259],{"class":258},"sJ8bj","\u002F\u002F don't read the URL at construction\n",[68,261,262,265,267,269],{"class":70,"line":116},[68,263,264],{"class":78},"  persist: ",[68,266,218],{"class":102},[68,268,255],{"class":78},[68,270,271],{"class":258},"\u002F\u002F don't write the URL on navigation\n",[68,273,274],{"class":70,"line":134},[68,275,137],{"class":78},[139,277,278,292,298],{},[142,279,280,283,284,287,288,291],{},[21,281,282],{},"restore: false",". The wizard ignores the URL at construction and boots on ",[21,285,286],{},"steps[0]",". Useful when the consumer drives initial step from a custom source (a Pinia store, a feature flag, a server-rendered prop) and doesn't want a stray ",[21,289,290],{},"?step="," in the URL to override it.",[142,293,294,297],{},[21,295,296],{},"persist: false",". Navigation never writes to the URL. The wizard's active step stays in memory only. Useful for embedded wizards inside a modal, a popover, or any context where the URL belongs to the surrounding page.",[142,299,300,301,303,304,306],{},"Both ",[21,302,218],{},". The wizard is fully URL-blind: starts on ",[21,305,286],{},", leaves the URL untouched, never reads from it.",[37,308,310],{"id":309},"custom-callbacks","Custom callbacks",[17,312,313,314,28,316,318],{},"The ",[21,315,27],{},[21,317,31],{}," options take callbacks for non-URL storage:",[59,320,322],{"className":61,"code":321,"language":63,"meta":64,"style":64},"type WizardRestoreState = { readonly step?: string }\ntype WizardRestoreFn = () => WizardRestoreState | undefined\ntype WizardPersistFn = (state: WizardRestoreState) => void\n",[21,323,324,353,376],{"__ignoreMap":64},[68,325,326,329,332,334,337,340,344,347,350],{"class":70,"line":71},[68,327,328],{"class":74},"type",[68,330,331],{"class":109}," WizardRestoreState",[68,333,106],{"class":74},[68,335,336],{"class":78}," { ",[68,338,339],{"class":74},"readonly",[68,341,343],{"class":342},"s4XuR"," step",[68,345,346],{"class":74},"?:",[68,348,349],{"class":102}," string",[68,351,352],{"class":78}," }\n",[68,354,355,357,360,362,365,368,370,373],{"class":70,"line":89},[68,356,328],{"class":74},[68,358,359],{"class":109}," WizardRestoreFn",[68,361,106],{"class":74},[68,363,364],{"class":78}," () ",[68,366,367],{"class":74},"=>",[68,369,331],{"class":109},[68,371,372],{"class":74}," |",[68,374,375],{"class":102}," undefined\n",[68,377,378,380,383,385,388,391,394,396,399,401],{"class":70,"line":96},[68,379,328],{"class":74},[68,381,382],{"class":109}," WizardPersistFn",[68,384,106],{"class":74},[68,386,387],{"class":78}," (",[68,389,390],{"class":342},"state",[68,392,393],{"class":74},":",[68,395,331],{"class":109},[68,397,398],{"class":78},") ",[68,400,367],{"class":74},[68,402,403],{"class":102}," void\n",[17,405,406],{},"A localStorage example:",[59,408,410],{"className":61,"code":409,"language":63,"meta":64,"style":64},"const STORAGE_KEY = 'checkout:active-step'\n\nconst wizard = useWizard({\n  steps: [shipping, payment, review],\n  restore: () => {\n    const step = localStorage.getItem(STORAGE_KEY)\n    return step === null ? undefined : { step }\n  },\n  persist: ({ step }) => {\n    if (step === undefined) return\n    localStorage.setItem(STORAGE_KEY, step)\n  },\n})\n",[21,411,412,424,428,440,445,458,483,510,516,535,553,569,574],{"__ignoreMap":64},[68,413,414,416,419,421],{"class":70,"line":71},[68,415,99],{"class":74},[68,417,418],{"class":102}," STORAGE_KEY",[68,420,106],{"class":74},[68,422,423],{"class":85}," 'checkout:active-step'\n",[68,425,426],{"class":70,"line":89},[68,427,93],{"emptyLinePlaceholder":92},[68,429,430,432,434,436,438],{"class":70,"line":96},[68,431,99],{"class":74},[68,433,103],{"class":102},[68,435,106],{"class":74},[68,437,110],{"class":109},[68,439,113],{"class":78},[68,441,442],{"class":70,"line":116},[68,443,444],{"class":78},"  steps: [shipping, payment, review],\n",[68,446,447,450,453,455],{"class":70,"line":134},[68,448,449],{"class":109},"  restore",[68,451,452],{"class":78},": () ",[68,454,367],{"class":74},[68,456,457],{"class":78}," {\n",[68,459,461,464,466,468,471,474,477,480],{"class":70,"line":460},6,[68,462,463],{"class":74},"    const",[68,465,343],{"class":102},[68,467,106],{"class":74},[68,469,470],{"class":78}," localStorage.",[68,472,473],{"class":109},"getItem",[68,475,476],{"class":78},"(",[68,478,479],{"class":102},"STORAGE_KEY",[68,481,482],{"class":78},")\n",[68,484,486,489,492,495,498,501,504,507],{"class":70,"line":485},7,[68,487,488],{"class":74},"    return",[68,490,491],{"class":78}," step ",[68,493,494],{"class":74},"===",[68,496,497],{"class":102}," null",[68,499,500],{"class":74}," ?",[68,502,503],{"class":102}," undefined",[68,505,506],{"class":74}," :",[68,508,509],{"class":78}," { step }\n",[68,511,513],{"class":70,"line":512},8,[68,514,515],{"class":78},"  },\n",[68,517,519,522,525,528,531,533],{"class":70,"line":518},9,[68,520,521],{"class":109},"  persist",[68,523,524],{"class":78},": ({ ",[68,526,527],{"class":342},"step",[68,529,530],{"class":78}," }) ",[68,532,367],{"class":74},[68,534,457],{"class":78},[68,536,538,541,544,546,548,550],{"class":70,"line":537},10,[68,539,540],{"class":74},"    if",[68,542,543],{"class":78}," (step ",[68,545,494],{"class":74},[68,547,503],{"class":102},[68,549,398],{"class":78},[68,551,552],{"class":74},"return\n",[68,554,556,559,562,564,566],{"class":70,"line":555},11,[68,557,558],{"class":78},"    localStorage.",[68,560,561],{"class":109},"setItem",[68,563,476],{"class":78},[68,565,479],{"class":102},[68,567,568],{"class":78},", step)\n",[68,570,572],{"class":70,"line":571},12,[68,573,515],{"class":78},[68,575,577],{"class":70,"line":576},13,[68,578,137],{"class":78},[17,580,581,582,584],{},"The restore callback is invoked at construction and re-evaluated reactively (its tracked reads decide the dep set); the persist callback fires on every ",[21,583,56],{}," change, diffed to break the restore-persist loop. The wizard handles the loop break, so a persist write that triggers a restore re-read converges in one round.",[37,586,588],{"id":587},"renaming-the-param","Renaming the param",[17,590,591,592,594],{},"The default ",[21,593,23],{}," works fine until two wizards land on the same page. Then the second wizard's writes overwrite the first's. Give each wizard its own param via custom callbacks:",[59,596,598],{"className":61,"code":597,"language":63,"meta":64,"style":64},"import { useForm, useWizard } from 'attaform\u002Fzod'\n\nconst checkout = useWizard({\n  steps: [shipping, payment, review],\n  restore: () => {\n    const url = new URL(window.location.href)\n    const step = url.searchParams.get('checkout-step')\n    return step === null ? undefined : { step }\n  },\n  persist: ({ step }) => {\n    const url = new URL(window.location.href)\n    if (step === undefined) {\n      url.searchParams.delete('checkout-step')\n    } else {\n      url.searchParams.set('checkout-step', step)\n    }\n    history.replaceState(history.state, '', url.toString())\n  },\n})\n\nconst support = useWizard({\n  steps: [...],\n  restore: () => {\n    const url = new URL(window.location.href)\n    const step = url.searchParams.get('support-step')\n    return step === null ? undefined : { step }\n  },\n  persist: ({ step }) => {\n    const url = new URL(window.location.href)\n    if (step === undefined) {\n      url.searchParams.delete('support-step')\n    } else {\n      url.searchParams.set('support-step', step)\n    }\n    history.replaceState(history.state, '', url.toString())\n  },\n})\n",[21,599,600,610,614,627,631,641,659,680,698,702,716,730,743,757,768,782,788,812,817,822,827,841,850,861,876,896,915,920,935,950,963,976,985,998,1003,1020,1025],{"__ignoreMap":64},[68,601,602,604,606,608],{"class":70,"line":71},[68,603,75],{"class":74},[68,605,79],{"class":78},[68,607,82],{"class":74},[68,609,86],{"class":85},[68,611,612],{"class":70,"line":89},[68,613,93],{"emptyLinePlaceholder":92},[68,615,616,618,621,623,625],{"class":70,"line":96},[68,617,99],{"class":74},[68,619,620],{"class":102}," checkout",[68,622,106],{"class":74},[68,624,110],{"class":109},[68,626,113],{"class":78},[68,628,629],{"class":70,"line":116},[68,630,444],{"class":78},[68,632,633,635,637,639],{"class":70,"line":134},[68,634,449],{"class":109},[68,636,452],{"class":78},[68,638,367],{"class":74},[68,640,457],{"class":78},[68,642,643,645,648,650,653,656],{"class":70,"line":460},[68,644,463],{"class":74},[68,646,647],{"class":102}," url",[68,649,106],{"class":74},[68,651,652],{"class":74}," new",[68,654,655],{"class":109}," URL",[68,657,658],{"class":78},"(window.location.href)\n",[68,660,661,663,665,667,670,673,675,678],{"class":70,"line":485},[68,662,463],{"class":74},[68,664,343],{"class":102},[68,666,106],{"class":74},[68,668,669],{"class":78}," url.searchParams.",[68,671,672],{"class":109},"get",[68,674,476],{"class":78},[68,676,677],{"class":85},"'checkout-step'",[68,679,482],{"class":78},[68,681,682,684,686,688,690,692,694,696],{"class":70,"line":512},[68,683,488],{"class":74},[68,685,491],{"class":78},[68,687,494],{"class":74},[68,689,497],{"class":102},[68,691,500],{"class":74},[68,693,503],{"class":102},[68,695,506],{"class":74},[68,697,509],{"class":78},[68,699,700],{"class":70,"line":518},[68,701,515],{"class":78},[68,703,704,706,708,710,712,714],{"class":70,"line":537},[68,705,521],{"class":109},[68,707,524],{"class":78},[68,709,527],{"class":342},[68,711,530],{"class":78},[68,713,367],{"class":74},[68,715,457],{"class":78},[68,717,718,720,722,724,726,728],{"class":70,"line":555},[68,719,463],{"class":74},[68,721,647],{"class":102},[68,723,106],{"class":74},[68,725,652],{"class":74},[68,727,655],{"class":109},[68,729,658],{"class":78},[68,731,732,734,736,738,740],{"class":70,"line":571},[68,733,540],{"class":74},[68,735,543],{"class":78},[68,737,494],{"class":74},[68,739,503],{"class":102},[68,741,742],{"class":78},") {\n",[68,744,745,748,751,753,755],{"class":70,"line":576},[68,746,747],{"class":78},"      url.searchParams.",[68,749,750],{"class":109},"delete",[68,752,476],{"class":78},[68,754,677],{"class":85},[68,756,482],{"class":78},[68,758,760,763,766],{"class":70,"line":759},14,[68,761,762],{"class":78},"    } ",[68,764,765],{"class":74},"else",[68,767,457],{"class":78},[68,769,771,773,776,778,780],{"class":70,"line":770},15,[68,772,747],{"class":78},[68,774,775],{"class":109},"set",[68,777,476],{"class":78},[68,779,677],{"class":85},[68,781,568],{"class":78},[68,783,785],{"class":70,"line":784},16,[68,786,787],{"class":78},"    }\n",[68,789,791,794,797,800,803,806,809],{"class":70,"line":790},17,[68,792,793],{"class":78},"    history.",[68,795,796],{"class":109},"replaceState",[68,798,799],{"class":78},"(history.state, ",[68,801,802],{"class":85},"''",[68,804,805],{"class":78},", url.",[68,807,808],{"class":109},"toString",[68,810,811],{"class":78},"())\n",[68,813,815],{"class":70,"line":814},18,[68,816,515],{"class":78},[68,818,820],{"class":70,"line":819},19,[68,821,137],{"class":78},[68,823,825],{"class":70,"line":824},20,[68,826,93],{"emptyLinePlaceholder":92},[68,828,830,832,835,837,839],{"class":70,"line":829},21,[68,831,99],{"class":74},[68,833,834],{"class":102}," support",[68,836,106],{"class":74},[68,838,110],{"class":109},[68,840,113],{"class":78},[68,842,844,846,848],{"class":70,"line":843},22,[68,845,119],{"class":78},[68,847,243],{"class":74},[68,849,131],{"class":78},[68,851,853,855,857,859],{"class":70,"line":852},23,[68,854,449],{"class":109},[68,856,452],{"class":78},[68,858,367],{"class":74},[68,860,457],{"class":78},[68,862,864,866,868,870,872,874],{"class":70,"line":863},24,[68,865,463],{"class":74},[68,867,647],{"class":102},[68,869,106],{"class":74},[68,871,652],{"class":74},[68,873,655],{"class":109},[68,875,658],{"class":78},[68,877,879,881,883,885,887,889,891,894],{"class":70,"line":878},25,[68,880,463],{"class":74},[68,882,343],{"class":102},[68,884,106],{"class":74},[68,886,669],{"class":78},[68,888,672],{"class":109},[68,890,476],{"class":78},[68,892,893],{"class":85},"'support-step'",[68,895,482],{"class":78},[68,897,899,901,903,905,907,909,911,913],{"class":70,"line":898},26,[68,900,488],{"class":74},[68,902,491],{"class":78},[68,904,494],{"class":74},[68,906,497],{"class":102},[68,908,500],{"class":74},[68,910,503],{"class":102},[68,912,506],{"class":74},[68,914,509],{"class":78},[68,916,918],{"class":70,"line":917},27,[68,919,515],{"class":78},[68,921,923,925,927,929,931,933],{"class":70,"line":922},28,[68,924,521],{"class":109},[68,926,524],{"class":78},[68,928,527],{"class":342},[68,930,530],{"class":78},[68,932,367],{"class":74},[68,934,457],{"class":78},[68,936,938,940,942,944,946,948],{"class":70,"line":937},29,[68,939,463],{"class":74},[68,941,647],{"class":102},[68,943,106],{"class":74},[68,945,652],{"class":74},[68,947,655],{"class":109},[68,949,658],{"class":78},[68,951,953,955,957,959,961],{"class":70,"line":952},30,[68,954,540],{"class":74},[68,956,543],{"class":78},[68,958,494],{"class":74},[68,960,503],{"class":102},[68,962,742],{"class":78},[68,964,966,968,970,972,974],{"class":70,"line":965},31,[68,967,747],{"class":78},[68,969,750],{"class":109},[68,971,476],{"class":78},[68,973,893],{"class":85},[68,975,482],{"class":78},[68,977,979,981,983],{"class":70,"line":978},32,[68,980,762],{"class":78},[68,982,765],{"class":74},[68,984,457],{"class":78},[68,986,988,990,992,994,996],{"class":70,"line":987},33,[68,989,747],{"class":78},[68,991,775],{"class":109},[68,993,476],{"class":78},[68,995,893],{"class":85},[68,997,568],{"class":78},[68,999,1001],{"class":70,"line":1000},34,[68,1002,787],{"class":78},[68,1004,1006,1008,1010,1012,1014,1016,1018],{"class":70,"line":1005},35,[68,1007,793],{"class":78},[68,1009,796],{"class":109},[68,1011,799],{"class":78},[68,1013,802],{"class":85},[68,1015,805],{"class":78},[68,1017,808],{"class":109},[68,1019,811],{"class":78},[68,1021,1023],{"class":70,"line":1022},36,[68,1024,515],{"class":78},[68,1026,1028],{"class":70,"line":1027},37,[68,1029,137],{"class":78},[17,1031,1032],{},"Each wizard owns its own search param; the two never collide.",[37,1034,182],{"id":1035},"pushing-each-navigation",[17,1037,591,1038,1040,1041,1043,1044,393],{},[21,1039,31],{}," uses ",[21,1042,796],{}," so the browser's back button leaves the host page in one press. To get push semantics (back walks the visited steps), swap in a custom persist that calls ",[21,1045,1046],{},"pushState",[59,1048,1050],{"className":61,"code":1049,"language":63,"meta":64,"style":64},"const wizard = useWizard({\n  steps: [shipping, payment, review],\n  persist: ({ step }) => {\n    const url = new URL(window.location.href)\n    if (step === undefined) {\n      url.searchParams.delete('step')\n    } else {\n      url.searchParams.set('step', step)\n    }\n    history.pushState(history.state, '', url.toString())\n  },\n})\n",[21,1051,1052,1064,1068,1082,1096,1108,1121,1129,1141,1145,1161,1165],{"__ignoreMap":64},[68,1053,1054,1056,1058,1060,1062],{"class":70,"line":71},[68,1055,99],{"class":74},[68,1057,103],{"class":102},[68,1059,106],{"class":74},[68,1061,110],{"class":109},[68,1063,113],{"class":78},[68,1065,1066],{"class":70,"line":89},[68,1067,444],{"class":78},[68,1069,1070,1072,1074,1076,1078,1080],{"class":70,"line":96},[68,1071,521],{"class":109},[68,1073,524],{"class":78},[68,1075,527],{"class":342},[68,1077,530],{"class":78},[68,1079,367],{"class":74},[68,1081,457],{"class":78},[68,1083,1084,1086,1088,1090,1092,1094],{"class":70,"line":116},[68,1085,463],{"class":74},[68,1087,647],{"class":102},[68,1089,106],{"class":74},[68,1091,652],{"class":74},[68,1093,655],{"class":109},[68,1095,658],{"class":78},[68,1097,1098,1100,1102,1104,1106],{"class":70,"line":134},[68,1099,540],{"class":74},[68,1101,543],{"class":78},[68,1103,494],{"class":74},[68,1105,503],{"class":102},[68,1107,742],{"class":78},[68,1109,1110,1112,1114,1116,1119],{"class":70,"line":460},[68,1111,747],{"class":78},[68,1113,750],{"class":109},[68,1115,476],{"class":78},[68,1117,1118],{"class":85},"'step'",[68,1120,482],{"class":78},[68,1122,1123,1125,1127],{"class":70,"line":485},[68,1124,762],{"class":78},[68,1126,765],{"class":74},[68,1128,457],{"class":78},[68,1130,1131,1133,1135,1137,1139],{"class":70,"line":512},[68,1132,747],{"class":78},[68,1134,775],{"class":109},[68,1136,476],{"class":78},[68,1138,1118],{"class":85},[68,1140,568],{"class":78},[68,1142,1143],{"class":70,"line":518},[68,1144,787],{"class":78},[68,1146,1147,1149,1151,1153,1155,1157,1159],{"class":70,"line":537},[68,1148,793],{"class":78},[68,1150,1046],{"class":109},[68,1152,799],{"class":78},[68,1154,802],{"class":85},[68,1156,805],{"class":78},[68,1158,808],{"class":109},[68,1160,811],{"class":78},[68,1162,1163],{"class":70,"line":555},[68,1164,515],{"class":78},[68,1166,1167],{"class":70,"line":571},[68,1168,137],{"class":78},[17,1170,1171,1172,1175],{},"The matching restore (the default one) already listens to ",[21,1173,1174],{},"popstate"," and re-reads the URL, so the back button retreats one step at a time once persist pushes.",[37,1177,1179],{"id":1178},"where-to-next","Where to next",[139,1181,1182,1190,1200],{},[142,1183,1184,1189],{},[179,1185,1187],{"href":1186},"\u002Fdocs\u002Fmultistep\u002Fuse-wizard",[21,1188,45],{}," for the construction signature and the wizard handle.",[142,1191,1192,1196,1197,1199],{},[179,1193,1195],{"href":1194},"\u002Fdocs\u002Fmultistep\u002Fpatterns","Patterns"," for the per-form ",[21,1198,31],{}," option that keeps each step's field values across reloads.",[142,1201,1202,1208,1209,1212,1213,1215],{},[179,1203,1205],{"href":1204},"\u002Fdocs\u002Fmultistep\u002Finject-wizard",[21,1206,1207],{},"injectWizard"," for cross-component access to a wizard with a named ",[21,1210,1211],{},"key"," (a separate identifier from ",[21,1214,290],{},").",[1217,1218,1219],"style",{},"html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}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 .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .s4XuR, html code.shiki .s4XuR{--shiki-default:#E36209;--shiki-dark:#FFAB70}",{"title":64,"searchDepth":89,"depth":89,"links":1221},[1222,1223,1224,1225,1226,1227,1228],{"id":39,"depth":89,"text":40},{"id":186,"depth":89,"text":187},{"id":211,"depth":89,"text":212},{"id":309,"depth":89,"text":310},{"id":587,"depth":89,"text":588},{"id":1035,"depth":89,"text":182},{"id":1178,"depth":89,"text":1179},"Wizards round-trip the active step through the URL by default. ?step=\u003Ckey> writes on every navigation, reloads land on the same step, and deep links render the right step on the first byte under SSR. Opt out with restore false \u002F persist false, or swap in custom callbacks for non-URL storage.","md",{},[1233,1236,1238,1241],{"label":1234,"value":1235},"Category","Restore \u002F persist",{"label":1237,"value":23,"kind":21},"Default param",{"label":1239,"value":1240,"kind":21},"Opt out","restore: false · persist: false",{"label":1242,"value":1243,"kind":21},"Custom","restore() => { step? } · persist({ step }) => void","\u002Fdocs\u002Fmultistep\u002Furl-sync",{"title":5,"description":1229},null,"docs\u002Fmultistep\u002Furl-sync","LOUMTApOuraoYQKzQBiNoPHgXC5sqfWP8Dt82FE8dCA",1780949761936]