runtime-core.cjs.js 292 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352335333543355335633573358335933603361336233633364336533663367336833693370337133723373337433753376337733783379338033813382338333843385338633873388338933903391339233933394339533963397339833993400340134023403340434053406340734083409341034113412341334143415341634173418341934203421342234233424342534263427342834293430343134323433343434353436343734383439344034413442344334443445344634473448344934503451345234533454345534563457345834593460346134623463346434653466346734683469347034713472347334743475347634773478347934803481348234833484348534863487348834893490349134923493349434953496349734983499350035013502350335043505350635073508350935103511351235133514351535163517351835193520352135223523352435253526352735283529353035313532353335343535353635373538353935403541354235433544354535463547354835493550355135523553355435553556355735583559356035613562356335643565356635673568356935703571357235733574357535763577357835793580358135823583358435853586358735883589359035913592359335943595359635973598359936003601360236033604360536063607360836093610361136123613361436153616361736183619362036213622362336243625362636273628362936303631363236333634363536363637363836393640364136423643364436453646364736483649365036513652365336543655365636573658365936603661366236633664366536663667366836693670367136723673367436753676367736783679368036813682368336843685368636873688368936903691369236933694369536963697369836993700370137023703370437053706370737083709371037113712371337143715371637173718371937203721372237233724372537263727372837293730373137323733373437353736373737383739374037413742374337443745374637473748374937503751375237533754375537563757375837593760376137623763376437653766376737683769377037713772377337743775377637773778377937803781378237833784378537863787378837893790379137923793379437953796379737983799380038013802380338043805380638073808380938103811381238133814381538163817381838193820382138223823382438253826382738283829383038313832383338343835383638373838383938403841384238433844384538463847384838493850385138523853385438553856385738583859386038613862386338643865386638673868386938703871387238733874387538763877387838793880388138823883388438853886388738883889389038913892389338943895389638973898389939003901390239033904390539063907390839093910391139123913391439153916391739183919392039213922392339243925392639273928392939303931393239333934393539363937393839393940394139423943394439453946394739483949395039513952395339543955395639573958395939603961396239633964396539663967396839693970397139723973397439753976397739783979398039813982398339843985398639873988398939903991399239933994399539963997399839994000400140024003400440054006400740084009401040114012401340144015401640174018401940204021402240234024402540264027402840294030403140324033403440354036403740384039404040414042404340444045404640474048404940504051405240534054405540564057405840594060406140624063406440654066406740684069407040714072407340744075407640774078407940804081408240834084408540864087408840894090409140924093409440954096409740984099410041014102410341044105410641074108410941104111411241134114411541164117411841194120412141224123412441254126412741284129413041314132413341344135413641374138413941404141414241434144414541464147414841494150415141524153415441554156415741584159416041614162416341644165416641674168416941704171417241734174417541764177417841794180418141824183418441854186418741884189419041914192419341944195419641974198419942004201420242034204420542064207420842094210421142124213421442154216421742184219422042214222422342244225422642274228422942304231423242334234423542364237423842394240424142424243424442454246424742484249425042514252425342544255425642574258425942604261426242634264426542664267426842694270427142724273427442754276427742784279428042814282428342844285428642874288428942904291429242934294429542964297429842994300430143024303430443054306430743084309431043114312431343144315431643174318431943204321432243234324432543264327432843294330433143324333433443354336433743384339434043414342434343444345434643474348434943504351435243534354435543564357435843594360436143624363436443654366436743684369437043714372437343744375437643774378437943804381438243834384438543864387438843894390439143924393439443954396439743984399440044014402440344044405440644074408440944104411441244134414441544164417441844194420442144224423442444254426442744284429443044314432443344344435443644374438443944404441444244434444444544464447444844494450445144524453445444554456445744584459446044614462446344644465446644674468446944704471447244734474447544764477447844794480448144824483448444854486448744884489449044914492449344944495449644974498449945004501450245034504450545064507450845094510451145124513451445154516451745184519452045214522452345244525452645274528452945304531453245334534453545364537453845394540454145424543454445454546454745484549455045514552455345544555455645574558455945604561456245634564456545664567456845694570457145724573457445754576457745784579458045814582458345844585458645874588458945904591459245934594459545964597459845994600460146024603460446054606460746084609461046114612461346144615461646174618461946204621462246234624462546264627462846294630463146324633463446354636463746384639464046414642464346444645464646474648464946504651465246534654465546564657465846594660466146624663466446654666466746684669467046714672467346744675467646774678467946804681468246834684468546864687468846894690469146924693469446954696469746984699470047014702470347044705470647074708470947104711471247134714471547164717471847194720472147224723472447254726472747284729473047314732473347344735473647374738473947404741474247434744474547464747474847494750475147524753475447554756475747584759476047614762476347644765476647674768476947704771477247734774477547764777477847794780478147824783478447854786478747884789479047914792479347944795479647974798479948004801480248034804480548064807480848094810481148124813481448154816481748184819482048214822482348244825482648274828482948304831483248334834483548364837483848394840484148424843484448454846484748484849485048514852485348544855485648574858485948604861486248634864486548664867486848694870487148724873487448754876487748784879488048814882488348844885488648874888488948904891489248934894489548964897489848994900490149024903490449054906490749084909491049114912491349144915491649174918491949204921492249234924492549264927492849294930493149324933493449354936493749384939494049414942494349444945494649474948494949504951495249534954495549564957495849594960496149624963496449654966496749684969497049714972497349744975497649774978497949804981498249834984498549864987498849894990499149924993499449954996499749984999500050015002500350045005500650075008500950105011501250135014501550165017501850195020502150225023502450255026502750285029503050315032503350345035503650375038503950405041504250435044504550465047504850495050505150525053505450555056505750585059506050615062506350645065506650675068506950705071507250735074507550765077507850795080508150825083508450855086508750885089509050915092509350945095509650975098509951005101510251035104510551065107510851095110511151125113511451155116511751185119512051215122512351245125512651275128512951305131513251335134513551365137513851395140514151425143514451455146514751485149515051515152515351545155515651575158515951605161516251635164516551665167516851695170517151725173517451755176517751785179518051815182518351845185518651875188518951905191519251935194519551965197519851995200520152025203520452055206520752085209521052115212521352145215521652175218521952205221522252235224522552265227522852295230523152325233523452355236523752385239524052415242524352445245524652475248524952505251525252535254525552565257525852595260526152625263526452655266526752685269527052715272527352745275527652775278527952805281528252835284528552865287528852895290529152925293529452955296529752985299530053015302530353045305530653075308530953105311531253135314531553165317531853195320532153225323532453255326532753285329533053315332533353345335533653375338533953405341534253435344534553465347534853495350535153525353535453555356535753585359536053615362536353645365536653675368536953705371537253735374537553765377537853795380538153825383538453855386538753885389539053915392539353945395539653975398539954005401540254035404540554065407540854095410541154125413541454155416541754185419542054215422542354245425542654275428542954305431543254335434543554365437543854395440544154425443544454455446544754485449545054515452545354545455545654575458545954605461546254635464546554665467546854695470547154725473547454755476547754785479548054815482548354845485548654875488548954905491549254935494549554965497549854995500550155025503550455055506550755085509551055115512551355145515551655175518551955205521552255235524552555265527552855295530553155325533553455355536553755385539554055415542554355445545554655475548554955505551555255535554555555565557555855595560556155625563556455655566556755685569557055715572557355745575557655775578557955805581558255835584558555865587558855895590559155925593559455955596559755985599560056015602560356045605560656075608560956105611561256135614561556165617561856195620562156225623562456255626562756285629563056315632563356345635563656375638563956405641564256435644564556465647564856495650565156525653565456555656565756585659566056615662566356645665566656675668566956705671567256735674567556765677567856795680568156825683568456855686568756885689569056915692569356945695569656975698569957005701570257035704570557065707570857095710571157125713571457155716571757185719572057215722572357245725572657275728572957305731573257335734573557365737573857395740574157425743574457455746574757485749575057515752575357545755575657575758575957605761576257635764576557665767576857695770577157725773577457755776577757785779578057815782578357845785578657875788578957905791579257935794579557965797579857995800580158025803580458055806580758085809581058115812581358145815581658175818581958205821582258235824582558265827582858295830583158325833583458355836583758385839584058415842584358445845584658475848584958505851585258535854585558565857585858595860586158625863586458655866586758685869587058715872587358745875587658775878587958805881588258835884588558865887588858895890589158925893589458955896589758985899590059015902590359045905590659075908590959105911591259135914591559165917591859195920592159225923592459255926592759285929593059315932593359345935593659375938593959405941594259435944594559465947594859495950595159525953595459555956595759585959596059615962596359645965596659675968596959705971597259735974597559765977597859795980598159825983598459855986598759885989599059915992599359945995599659975998599960006001600260036004600560066007600860096010601160126013601460156016601760186019602060216022602360246025602660276028602960306031603260336034603560366037603860396040604160426043604460456046604760486049605060516052605360546055605660576058605960606061606260636064606560666067606860696070607160726073607460756076607760786079608060816082608360846085608660876088608960906091609260936094609560966097609860996100610161026103610461056106610761086109611061116112611361146115611661176118611961206121612261236124612561266127612861296130613161326133613461356136613761386139614061416142614361446145614661476148614961506151615261536154615561566157615861596160616161626163616461656166616761686169617061716172617361746175617661776178617961806181618261836184618561866187618861896190619161926193619461956196619761986199620062016202620362046205620662076208620962106211621262136214621562166217621862196220622162226223622462256226622762286229623062316232623362346235623662376238623962406241624262436244624562466247624862496250625162526253625462556256625762586259626062616262626362646265626662676268626962706271627262736274627562766277627862796280628162826283628462856286628762886289629062916292629362946295629662976298629963006301630263036304630563066307630863096310631163126313631463156316631763186319632063216322632363246325632663276328632963306331633263336334633563366337633863396340634163426343634463456346634763486349635063516352635363546355635663576358635963606361636263636364636563666367636863696370637163726373637463756376637763786379638063816382638363846385638663876388638963906391639263936394639563966397639863996400640164026403640464056406640764086409641064116412641364146415641664176418641964206421642264236424642564266427642864296430643164326433643464356436643764386439644064416442644364446445644664476448644964506451645264536454645564566457645864596460646164626463646464656466646764686469647064716472647364746475647664776478647964806481648264836484648564866487648864896490649164926493649464956496649764986499650065016502650365046505650665076508650965106511651265136514651565166517651865196520652165226523652465256526652765286529653065316532653365346535653665376538653965406541654265436544654565466547654865496550655165526553655465556556655765586559656065616562656365646565656665676568656965706571657265736574657565766577657865796580658165826583658465856586658765886589659065916592659365946595659665976598659966006601660266036604660566066607660866096610661166126613661466156616661766186619662066216622662366246625662666276628662966306631663266336634663566366637663866396640664166426643664466456646664766486649665066516652665366546655665666576658665966606661666266636664666566666667666866696670667166726673667466756676667766786679668066816682668366846685668666876688668966906691669266936694669566966697669866996700670167026703670467056706670767086709671067116712671367146715671667176718671967206721672267236724672567266727672867296730673167326733673467356736673767386739674067416742674367446745674667476748674967506751675267536754675567566757675867596760676167626763676467656766676767686769677067716772677367746775677667776778677967806781678267836784678567866787678867896790679167926793679467956796679767986799680068016802680368046805680668076808680968106811681268136814681568166817681868196820682168226823682468256826682768286829683068316832683368346835683668376838683968406841684268436844684568466847684868496850685168526853685468556856685768586859686068616862686368646865686668676868686968706871687268736874687568766877687868796880688168826883688468856886688768886889689068916892689368946895689668976898689969006901690269036904690569066907690869096910691169126913691469156916691769186919692069216922692369246925692669276928692969306931693269336934693569366937693869396940694169426943694469456946694769486949695069516952695369546955695669576958695969606961696269636964696569666967696869696970697169726973697469756976697769786979698069816982698369846985698669876988698969906991699269936994699569966997699869997000700170027003700470057006700770087009701070117012701370147015701670177018701970207021702270237024702570267027702870297030703170327033703470357036703770387039704070417042704370447045704670477048704970507051705270537054705570567057705870597060706170627063706470657066706770687069707070717072707370747075707670777078707970807081708270837084708570867087708870897090709170927093709470957096709770987099710071017102710371047105710671077108710971107111711271137114711571167117711871197120712171227123712471257126712771287129713071317132713371347135713671377138713971407141714271437144714571467147714871497150715171527153715471557156715771587159716071617162716371647165716671677168716971707171717271737174717571767177717871797180718171827183718471857186718771887189719071917192719371947195719671977198719972007201720272037204720572067207720872097210721172127213721472157216721772187219722072217222722372247225722672277228722972307231723272337234723572367237723872397240724172427243724472457246724772487249725072517252725372547255725672577258725972607261726272637264726572667267726872697270727172727273727472757276727772787279728072817282728372847285728672877288728972907291729272937294729572967297729872997300730173027303730473057306730773087309731073117312731373147315731673177318731973207321732273237324732573267327732873297330733173327333733473357336733773387339734073417342734373447345734673477348734973507351735273537354735573567357735873597360736173627363736473657366736773687369737073717372737373747375737673777378737973807381738273837384738573867387738873897390739173927393739473957396739773987399740074017402740374047405740674077408740974107411741274137414741574167417741874197420742174227423742474257426742774287429743074317432743374347435743674377438743974407441744274437444744574467447744874497450745174527453745474557456745774587459746074617462746374647465746674677468746974707471747274737474747574767477747874797480748174827483748474857486748774887489749074917492749374947495749674977498749975007501750275037504750575067507750875097510751175127513751475157516751775187519752075217522752375247525752675277528752975307531753275337534753575367537753875397540754175427543754475457546754775487549755075517552755375547555755675577558755975607561756275637564756575667567756875697570757175727573757475757576757775787579758075817582758375847585758675877588758975907591759275937594759575967597759875997600760176027603760476057606760776087609761076117612761376147615761676177618761976207621762276237624762576267627762876297630763176327633763476357636763776387639764076417642764376447645764676477648764976507651765276537654765576567657765876597660766176627663766476657666766776687669767076717672767376747675767676777678767976807681768276837684768576867687768876897690769176927693769476957696769776987699770077017702770377047705770677077708770977107711771277137714771577167717771877197720772177227723772477257726772777287729773077317732773377347735773677377738773977407741774277437744774577467747774877497750775177527753775477557756775777587759776077617762776377647765776677677768776977707771777277737774777577767777777877797780778177827783778477857786778777887789779077917792779377947795779677977798779978007801780278037804780578067807780878097810781178127813781478157816781778187819782078217822
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var reactivity = require('@vue/reactivity');
  4. var shared = require('@vue/shared');
  5. const stack = [];
  6. function pushWarningContext(vnode) {
  7. stack.push(vnode);
  8. }
  9. function popWarningContext() {
  10. stack.pop();
  11. }
  12. function warn(msg, ...args) {
  13. // avoid props formatting or warn handler tracking deps that might be mutated
  14. // during patch, leading to infinite recursion.
  15. reactivity.pauseTracking();
  16. const instance = stack.length ? stack[stack.length - 1].component : null;
  17. const appWarnHandler = instance && instance.appContext.config.warnHandler;
  18. const trace = getComponentTrace();
  19. if (appWarnHandler) {
  20. callWithErrorHandling(appWarnHandler, instance, 11 /* APP_WARN_HANDLER */, [
  21. msg + args.join(''),
  22. instance && instance.proxy,
  23. trace
  24. .map(({ vnode }) => `at <${formatComponentName(instance, vnode.type)}>`)
  25. .join('\n'),
  26. trace
  27. ]);
  28. }
  29. else {
  30. const warnArgs = [`[Vue warn]: ${msg}`, ...args];
  31. /* istanbul ignore if */
  32. if (trace.length &&
  33. // avoid spamming console during tests
  34. !false) {
  35. warnArgs.push(`\n`, ...formatTrace(trace));
  36. }
  37. console.warn(...warnArgs);
  38. }
  39. reactivity.resetTracking();
  40. }
  41. function getComponentTrace() {
  42. let currentVNode = stack[stack.length - 1];
  43. if (!currentVNode) {
  44. return [];
  45. }
  46. // we can't just use the stack because it will be incomplete during updates
  47. // that did not start from the root. Re-construct the parent chain using
  48. // instance parent pointers.
  49. const normalizedStack = [];
  50. while (currentVNode) {
  51. const last = normalizedStack[0];
  52. if (last && last.vnode === currentVNode) {
  53. last.recurseCount++;
  54. }
  55. else {
  56. normalizedStack.push({
  57. vnode: currentVNode,
  58. recurseCount: 0
  59. });
  60. }
  61. const parentInstance = currentVNode.component && currentVNode.component.parent;
  62. currentVNode = parentInstance && parentInstance.vnode;
  63. }
  64. return normalizedStack;
  65. }
  66. /* istanbul ignore next */
  67. function formatTrace(trace) {
  68. const logs = [];
  69. trace.forEach((entry, i) => {
  70. logs.push(...(i === 0 ? [] : [`\n`]), ...formatTraceEntry(entry));
  71. });
  72. return logs;
  73. }
  74. function formatTraceEntry({ vnode, recurseCount }) {
  75. const postfix = recurseCount > 0 ? `... (${recurseCount} recursive calls)` : ``;
  76. const isRoot = vnode.component ? vnode.component.parent == null : false;
  77. const open = ` at <${formatComponentName(vnode.component, vnode.type, isRoot)}`;
  78. const close = `>` + postfix;
  79. return vnode.props
  80. ? [open, ...formatProps(vnode.props), close]
  81. : [open + close];
  82. }
  83. /* istanbul ignore next */
  84. function formatProps(props) {
  85. const res = [];
  86. const keys = Object.keys(props);
  87. keys.slice(0, 3).forEach(key => {
  88. res.push(...formatProp(key, props[key]));
  89. });
  90. if (keys.length > 3) {
  91. res.push(` ...`);
  92. }
  93. return res;
  94. }
  95. /* istanbul ignore next */
  96. function formatProp(key, value, raw) {
  97. if (shared.isString(value)) {
  98. value = JSON.stringify(value);
  99. return raw ? value : [`${key}=${value}`];
  100. }
  101. else if (typeof value === 'number' ||
  102. typeof value === 'boolean' ||
  103. value == null) {
  104. return raw ? value : [`${key}=${value}`];
  105. }
  106. else if (reactivity.isRef(value)) {
  107. value = formatProp(key, reactivity.toRaw(value.value), true);
  108. return raw ? value : [`${key}=Ref<`, value, `>`];
  109. }
  110. else if (shared.isFunction(value)) {
  111. return [`${key}=fn${value.name ? `<${value.name}>` : ``}`];
  112. }
  113. else {
  114. value = reactivity.toRaw(value);
  115. return raw ? value : [`${key}=`, value];
  116. }
  117. }
  118. const ErrorTypeStrings = {
  119. ["sp" /* SERVER_PREFETCH */]: 'serverPrefetch hook',
  120. ["bc" /* BEFORE_CREATE */]: 'beforeCreate hook',
  121. ["c" /* CREATED */]: 'created hook',
  122. ["bm" /* BEFORE_MOUNT */]: 'beforeMount hook',
  123. ["m" /* MOUNTED */]: 'mounted hook',
  124. ["bu" /* BEFORE_UPDATE */]: 'beforeUpdate hook',
  125. ["u" /* UPDATED */]: 'updated',
  126. ["bum" /* BEFORE_UNMOUNT */]: 'beforeUnmount hook',
  127. ["um" /* UNMOUNTED */]: 'unmounted hook',
  128. ["a" /* ACTIVATED */]: 'activated hook',
  129. ["da" /* DEACTIVATED */]: 'deactivated hook',
  130. ["ec" /* ERROR_CAPTURED */]: 'errorCaptured hook',
  131. ["rtc" /* RENDER_TRACKED */]: 'renderTracked hook',
  132. ["rtg" /* RENDER_TRIGGERED */]: 'renderTriggered hook',
  133. [0 /* SETUP_FUNCTION */]: 'setup function',
  134. [1 /* RENDER_FUNCTION */]: 'render function',
  135. [2 /* WATCH_GETTER */]: 'watcher getter',
  136. [3 /* WATCH_CALLBACK */]: 'watcher callback',
  137. [4 /* WATCH_CLEANUP */]: 'watcher cleanup function',
  138. [5 /* NATIVE_EVENT_HANDLER */]: 'native event handler',
  139. [6 /* COMPONENT_EVENT_HANDLER */]: 'component event handler',
  140. [7 /* VNODE_HOOK */]: 'vnode hook',
  141. [8 /* DIRECTIVE_HOOK */]: 'directive hook',
  142. [9 /* TRANSITION_HOOK */]: 'transition hook',
  143. [10 /* APP_ERROR_HANDLER */]: 'app errorHandler',
  144. [11 /* APP_WARN_HANDLER */]: 'app warnHandler',
  145. [12 /* FUNCTION_REF */]: 'ref function',
  146. [13 /* ASYNC_COMPONENT_LOADER */]: 'async component loader',
  147. [14 /* SCHEDULER */]: 'scheduler flush. This is likely a Vue internals bug. ' +
  148. 'Please open an issue at https://new-issue.vuejs.org/?repo=vuejs/core'
  149. };
  150. function callWithErrorHandling(fn, instance, type, args) {
  151. let res;
  152. try {
  153. res = args ? fn(...args) : fn();
  154. }
  155. catch (err) {
  156. handleError(err, instance, type);
  157. }
  158. return res;
  159. }
  160. function callWithAsyncErrorHandling(fn, instance, type, args) {
  161. if (shared.isFunction(fn)) {
  162. const res = callWithErrorHandling(fn, instance, type, args);
  163. if (res && shared.isPromise(res)) {
  164. res.catch(err => {
  165. handleError(err, instance, type);
  166. });
  167. }
  168. return res;
  169. }
  170. const values = [];
  171. for (let i = 0; i < fn.length; i++) {
  172. values.push(callWithAsyncErrorHandling(fn[i], instance, type, args));
  173. }
  174. return values;
  175. }
  176. function handleError(err, instance, type, throwInDev = true) {
  177. const contextVNode = instance ? instance.vnode : null;
  178. if (instance) {
  179. let cur = instance.parent;
  180. // the exposed instance is the render proxy to keep it consistent with 2.x
  181. const exposedInstance = instance.proxy;
  182. // in production the hook receives only the error code
  183. const errorInfo = ErrorTypeStrings[type] ;
  184. while (cur) {
  185. const errorCapturedHooks = cur.ec;
  186. if (errorCapturedHooks) {
  187. for (let i = 0; i < errorCapturedHooks.length; i++) {
  188. if (errorCapturedHooks[i](err, exposedInstance, errorInfo) === false) {
  189. return;
  190. }
  191. }
  192. }
  193. cur = cur.parent;
  194. }
  195. // app-level handling
  196. const appErrorHandler = instance.appContext.config.errorHandler;
  197. if (appErrorHandler) {
  198. callWithErrorHandling(appErrorHandler, null, 10 /* APP_ERROR_HANDLER */, [err, exposedInstance, errorInfo]);
  199. return;
  200. }
  201. }
  202. logError(err, type, contextVNode, throwInDev);
  203. }
  204. function logError(err, type, contextVNode, throwInDev = true) {
  205. {
  206. const info = ErrorTypeStrings[type];
  207. if (contextVNode) {
  208. pushWarningContext(contextVNode);
  209. }
  210. warn(`Unhandled error${info ? ` during execution of ${info}` : ``}`);
  211. if (contextVNode) {
  212. popWarningContext();
  213. }
  214. // crash in dev by default so it's more noticeable
  215. if (throwInDev) {
  216. throw err;
  217. }
  218. else {
  219. console.error(err);
  220. }
  221. }
  222. }
  223. let isFlushing = false;
  224. let isFlushPending = false;
  225. const queue = [];
  226. let flushIndex = 0;
  227. const pendingPreFlushCbs = [];
  228. let activePreFlushCbs = null;
  229. let preFlushIndex = 0;
  230. const pendingPostFlushCbs = [];
  231. let activePostFlushCbs = null;
  232. let postFlushIndex = 0;
  233. const resolvedPromise = /*#__PURE__*/ Promise.resolve();
  234. let currentFlushPromise = null;
  235. let currentPreFlushParentJob = null;
  236. const RECURSION_LIMIT = 100;
  237. function nextTick(fn) {
  238. const p = currentFlushPromise || resolvedPromise;
  239. return fn ? p.then(this ? fn.bind(this) : fn) : p;
  240. }
  241. // #2768
  242. // Use binary-search to find a suitable position in the queue,
  243. // so that the queue maintains the increasing order of job's id,
  244. // which can prevent the job from being skipped and also can avoid repeated patching.
  245. function findInsertionIndex(id) {
  246. // the start index should be `flushIndex + 1`
  247. let start = flushIndex + 1;
  248. let end = queue.length;
  249. while (start < end) {
  250. const middle = (start + end) >>> 1;
  251. const middleJobId = getId(queue[middle]);
  252. middleJobId < id ? (start = middle + 1) : (end = middle);
  253. }
  254. return start;
  255. }
  256. function queueJob(job) {
  257. // the dedupe search uses the startIndex argument of Array.includes()
  258. // by default the search index includes the current job that is being run
  259. // so it cannot recursively trigger itself again.
  260. // if the job is a watch() callback, the search will start with a +1 index to
  261. // allow it recursively trigger itself - it is the user's responsibility to
  262. // ensure it doesn't end up in an infinite loop.
  263. if ((!queue.length ||
  264. !queue.includes(job, isFlushing && job.allowRecurse ? flushIndex + 1 : flushIndex)) &&
  265. job !== currentPreFlushParentJob) {
  266. if (job.id == null) {
  267. queue.push(job);
  268. }
  269. else {
  270. queue.splice(findInsertionIndex(job.id), 0, job);
  271. }
  272. queueFlush();
  273. }
  274. }
  275. function queueFlush() {
  276. if (!isFlushing && !isFlushPending) {
  277. isFlushPending = true;
  278. currentFlushPromise = resolvedPromise.then(flushJobs);
  279. }
  280. }
  281. function invalidateJob(job) {
  282. const i = queue.indexOf(job);
  283. if (i > flushIndex) {
  284. queue.splice(i, 1);
  285. }
  286. }
  287. function queueCb(cb, activeQueue, pendingQueue, index) {
  288. if (!shared.isArray(cb)) {
  289. if (!activeQueue ||
  290. !activeQueue.includes(cb, cb.allowRecurse ? index + 1 : index)) {
  291. pendingQueue.push(cb);
  292. }
  293. }
  294. else {
  295. // if cb is an array, it is a component lifecycle hook which can only be
  296. // triggered by a job, which is already deduped in the main queue, so
  297. // we can skip duplicate check here to improve perf
  298. pendingQueue.push(...cb);
  299. }
  300. queueFlush();
  301. }
  302. function queuePreFlushCb(cb) {
  303. queueCb(cb, activePreFlushCbs, pendingPreFlushCbs, preFlushIndex);
  304. }
  305. function queuePostFlushCb(cb) {
  306. queueCb(cb, activePostFlushCbs, pendingPostFlushCbs, postFlushIndex);
  307. }
  308. function flushPreFlushCbs(seen, parentJob = null) {
  309. if (pendingPreFlushCbs.length) {
  310. currentPreFlushParentJob = parentJob;
  311. activePreFlushCbs = [...new Set(pendingPreFlushCbs)];
  312. pendingPreFlushCbs.length = 0;
  313. {
  314. seen = seen || new Map();
  315. }
  316. for (preFlushIndex = 0; preFlushIndex < activePreFlushCbs.length; preFlushIndex++) {
  317. if (checkRecursiveUpdates(seen, activePreFlushCbs[preFlushIndex])) {
  318. continue;
  319. }
  320. activePreFlushCbs[preFlushIndex]();
  321. }
  322. activePreFlushCbs = null;
  323. preFlushIndex = 0;
  324. currentPreFlushParentJob = null;
  325. // recursively flush until it drains
  326. flushPreFlushCbs(seen, parentJob);
  327. }
  328. }
  329. function flushPostFlushCbs(seen) {
  330. if (pendingPostFlushCbs.length) {
  331. const deduped = [...new Set(pendingPostFlushCbs)];
  332. pendingPostFlushCbs.length = 0;
  333. // #1947 already has active queue, nested flushPostFlushCbs call
  334. if (activePostFlushCbs) {
  335. activePostFlushCbs.push(...deduped);
  336. return;
  337. }
  338. activePostFlushCbs = deduped;
  339. {
  340. seen = seen || new Map();
  341. }
  342. activePostFlushCbs.sort((a, b) => getId(a) - getId(b));
  343. for (postFlushIndex = 0; postFlushIndex < activePostFlushCbs.length; postFlushIndex++) {
  344. if (checkRecursiveUpdates(seen, activePostFlushCbs[postFlushIndex])) {
  345. continue;
  346. }
  347. activePostFlushCbs[postFlushIndex]();
  348. }
  349. activePostFlushCbs = null;
  350. postFlushIndex = 0;
  351. }
  352. }
  353. const getId = (job) => job.id == null ? Infinity : job.id;
  354. function flushJobs(seen) {
  355. isFlushPending = false;
  356. isFlushing = true;
  357. {
  358. seen = seen || new Map();
  359. }
  360. flushPreFlushCbs(seen);
  361. // Sort queue before flush.
  362. // This ensures that:
  363. // 1. Components are updated from parent to child. (because parent is always
  364. // created before the child so its render effect will have smaller
  365. // priority number)
  366. // 2. If a component is unmounted during a parent component's update,
  367. // its update can be skipped.
  368. queue.sort((a, b) => getId(a) - getId(b));
  369. // conditional usage of checkRecursiveUpdate must be determined out of
  370. // try ... catch block since Rollup by default de-optimizes treeshaking
  371. // inside try-catch. This can leave all warning code unshaked. Although
  372. // they would get eventually shaken by a minifier like terser, some minifiers
  373. // would fail to do that (e.g. https://github.com/evanw/esbuild/issues/1610)
  374. const check = (job) => checkRecursiveUpdates(seen, job)
  375. ;
  376. try {
  377. for (flushIndex = 0; flushIndex < queue.length; flushIndex++) {
  378. const job = queue[flushIndex];
  379. if (job && job.active !== false) {
  380. if (true && check(job)) {
  381. continue;
  382. }
  383. // console.log(`running:`, job.id)
  384. callWithErrorHandling(job, null, 14 /* SCHEDULER */);
  385. }
  386. }
  387. }
  388. finally {
  389. flushIndex = 0;
  390. queue.length = 0;
  391. flushPostFlushCbs(seen);
  392. isFlushing = false;
  393. currentFlushPromise = null;
  394. // some postFlushCb queued jobs!
  395. // keep flushing until it drains.
  396. if (queue.length ||
  397. pendingPreFlushCbs.length ||
  398. pendingPostFlushCbs.length) {
  399. flushJobs(seen);
  400. }
  401. }
  402. }
  403. function checkRecursiveUpdates(seen, fn) {
  404. if (!seen.has(fn)) {
  405. seen.set(fn, 1);
  406. }
  407. else {
  408. const count = seen.get(fn);
  409. if (count > RECURSION_LIMIT) {
  410. const instance = fn.ownerInstance;
  411. const componentName = instance && getComponentName(instance.type);
  412. warn(`Maximum recursive updates exceeded${componentName ? ` in component <${componentName}>` : ``}. ` +
  413. `This means you have a reactive effect that is mutating its own ` +
  414. `dependencies and thus recursively triggering itself. Possible sources ` +
  415. `include component template, render function, updated hook or ` +
  416. `watcher source function.`);
  417. return true;
  418. }
  419. else {
  420. seen.set(fn, count + 1);
  421. }
  422. }
  423. }
  424. /* eslint-disable no-restricted-globals */
  425. let isHmrUpdating = false;
  426. const hmrDirtyComponents = new Set();
  427. // Expose the HMR runtime on the global object
  428. // This makes it entirely tree-shakable without polluting the exports and makes
  429. // it easier to be used in toolings like vue-loader
  430. // Note: for a component to be eligible for HMR it also needs the __hmrId option
  431. // to be set so that its instances can be registered / removed.
  432. {
  433. shared.getGlobalThis().__VUE_HMR_RUNTIME__ = {
  434. createRecord: tryWrap(createRecord),
  435. rerender: tryWrap(rerender),
  436. reload: tryWrap(reload)
  437. };
  438. }
  439. const map = new Map();
  440. function registerHMR(instance) {
  441. const id = instance.type.__hmrId;
  442. let record = map.get(id);
  443. if (!record) {
  444. createRecord(id, instance.type);
  445. record = map.get(id);
  446. }
  447. record.instances.add(instance);
  448. }
  449. function unregisterHMR(instance) {
  450. map.get(instance.type.__hmrId).instances.delete(instance);
  451. }
  452. function createRecord(id, initialDef) {
  453. if (map.has(id)) {
  454. return false;
  455. }
  456. map.set(id, {
  457. initialDef: normalizeClassComponent(initialDef),
  458. instances: new Set()
  459. });
  460. return true;
  461. }
  462. function normalizeClassComponent(component) {
  463. return isClassComponent(component) ? component.__vccOpts : component;
  464. }
  465. function rerender(id, newRender) {
  466. const record = map.get(id);
  467. if (!record) {
  468. return;
  469. }
  470. // update initial record (for not-yet-rendered component)
  471. record.initialDef.render = newRender;
  472. [...record.instances].forEach(instance => {
  473. if (newRender) {
  474. instance.render = newRender;
  475. normalizeClassComponent(instance.type).render = newRender;
  476. }
  477. instance.renderCache = [];
  478. // this flag forces child components with slot content to update
  479. isHmrUpdating = true;
  480. instance.update();
  481. isHmrUpdating = false;
  482. });
  483. }
  484. function reload(id, newComp) {
  485. const record = map.get(id);
  486. if (!record)
  487. return;
  488. newComp = normalizeClassComponent(newComp);
  489. // update initial def (for not-yet-rendered components)
  490. updateComponentDef(record.initialDef, newComp);
  491. // create a snapshot which avoids the set being mutated during updates
  492. const instances = [...record.instances];
  493. for (const instance of instances) {
  494. const oldComp = normalizeClassComponent(instance.type);
  495. if (!hmrDirtyComponents.has(oldComp)) {
  496. // 1. Update existing comp definition to match new one
  497. if (oldComp !== record.initialDef) {
  498. updateComponentDef(oldComp, newComp);
  499. }
  500. // 2. mark definition dirty. This forces the renderer to replace the
  501. // component on patch.
  502. hmrDirtyComponents.add(oldComp);
  503. }
  504. // 3. invalidate options resolution cache
  505. instance.appContext.optionsCache.delete(instance.type);
  506. // 4. actually update
  507. if (instance.ceReload) {
  508. // custom element
  509. hmrDirtyComponents.add(oldComp);
  510. instance.ceReload(newComp.styles);
  511. hmrDirtyComponents.delete(oldComp);
  512. }
  513. else if (instance.parent) {
  514. // 4. Force the parent instance to re-render. This will cause all updated
  515. // components to be unmounted and re-mounted. Queue the update so that we
  516. // don't end up forcing the same parent to re-render multiple times.
  517. queueJob(instance.parent.update);
  518. // instance is the inner component of an async custom element
  519. // invoke to reset styles
  520. if (instance.parent.type.__asyncLoader &&
  521. instance.parent.ceReload) {
  522. instance.parent.ceReload(newComp.styles);
  523. }
  524. }
  525. else if (instance.appContext.reload) {
  526. // root instance mounted via createApp() has a reload method
  527. instance.appContext.reload();
  528. }
  529. else if (typeof window !== 'undefined') {
  530. // root instance inside tree created via raw render(). Force reload.
  531. window.location.reload();
  532. }
  533. else {
  534. console.warn('[HMR] Root or manually mounted instance modified. Full reload required.');
  535. }
  536. }
  537. // 5. make sure to cleanup dirty hmr components after update
  538. queuePostFlushCb(() => {
  539. for (const instance of instances) {
  540. hmrDirtyComponents.delete(normalizeClassComponent(instance.type));
  541. }
  542. });
  543. }
  544. function updateComponentDef(oldComp, newComp) {
  545. shared.extend(oldComp, newComp);
  546. for (const key in oldComp) {
  547. if (key !== '__file' && !(key in newComp)) {
  548. delete oldComp[key];
  549. }
  550. }
  551. }
  552. function tryWrap(fn) {
  553. return (id, arg) => {
  554. try {
  555. return fn(id, arg);
  556. }
  557. catch (e) {
  558. console.error(e);
  559. console.warn(`[HMR] Something went wrong during Vue component hot-reload. ` +
  560. `Full reload required.`);
  561. }
  562. };
  563. }
  564. let buffer = [];
  565. let devtoolsNotInstalled = false;
  566. function emit(event, ...args) {
  567. if (exports.devtools) {
  568. exports.devtools.emit(event, ...args);
  569. }
  570. else if (!devtoolsNotInstalled) {
  571. buffer.push({ event, args });
  572. }
  573. }
  574. function setDevtoolsHook(hook, target) {
  575. var _a, _b;
  576. exports.devtools = hook;
  577. if (exports.devtools) {
  578. exports.devtools.enabled = true;
  579. buffer.forEach(({ event, args }) => exports.devtools.emit(event, ...args));
  580. buffer = [];
  581. }
  582. else if (
  583. // handle late devtools injection - only do this if we are in an actual
  584. // browser environment to avoid the timer handle stalling test runner exit
  585. // (#4815)
  586. // eslint-disable-next-line no-restricted-globals
  587. typeof window !== 'undefined' &&
  588. // some envs mock window but not fully
  589. window.HTMLElement &&
  590. // also exclude jsdom
  591. !((_b = (_a = window.navigator) === null || _a === void 0 ? void 0 : _a.userAgent) === null || _b === void 0 ? void 0 : _b.includes('jsdom'))) {
  592. const replay = (target.__VUE_DEVTOOLS_HOOK_REPLAY__ =
  593. target.__VUE_DEVTOOLS_HOOK_REPLAY__ || []);
  594. replay.push((newHook) => {
  595. setDevtoolsHook(newHook, target);
  596. });
  597. // clear buffer after 3s - the user probably doesn't have devtools installed
  598. // at all, and keeping the buffer will cause memory leaks (#4738)
  599. setTimeout(() => {
  600. if (!exports.devtools) {
  601. target.__VUE_DEVTOOLS_HOOK_REPLAY__ = null;
  602. devtoolsNotInstalled = true;
  603. buffer = [];
  604. }
  605. }, 3000);
  606. }
  607. else {
  608. // non-browser env, assume not installed
  609. devtoolsNotInstalled = true;
  610. buffer = [];
  611. }
  612. }
  613. function devtoolsInitApp(app, version) {
  614. emit("app:init" /* APP_INIT */, app, version, {
  615. Fragment,
  616. Text,
  617. Comment,
  618. Static
  619. });
  620. }
  621. function devtoolsUnmountApp(app) {
  622. emit("app:unmount" /* APP_UNMOUNT */, app);
  623. }
  624. const devtoolsComponentAdded = /*#__PURE__*/ createDevtoolsComponentHook("component:added" /* COMPONENT_ADDED */);
  625. const devtoolsComponentUpdated =
  626. /*#__PURE__*/ createDevtoolsComponentHook("component:updated" /* COMPONENT_UPDATED */);
  627. const devtoolsComponentRemoved =
  628. /*#__PURE__*/ createDevtoolsComponentHook("component:removed" /* COMPONENT_REMOVED */);
  629. function createDevtoolsComponentHook(hook) {
  630. return (component) => {
  631. emit(hook, component.appContext.app, component.uid, component.parent ? component.parent.uid : undefined, component);
  632. };
  633. }
  634. const devtoolsPerfStart = /*#__PURE__*/ createDevtoolsPerformanceHook("perf:start" /* PERFORMANCE_START */);
  635. const devtoolsPerfEnd = /*#__PURE__*/ createDevtoolsPerformanceHook("perf:end" /* PERFORMANCE_END */);
  636. function createDevtoolsPerformanceHook(hook) {
  637. return (component, type, time) => {
  638. emit(hook, component.appContext.app, component.uid, component, type, time);
  639. };
  640. }
  641. function devtoolsComponentEmit(component, event, params) {
  642. emit("component:emit" /* COMPONENT_EMIT */, component.appContext.app, component, event, params);
  643. }
  644. function emit$1(instance, event, ...rawArgs) {
  645. if (instance.isUnmounted)
  646. return;
  647. const props = instance.vnode.props || shared.EMPTY_OBJ;
  648. {
  649. const { emitsOptions, propsOptions: [propsOptions] } = instance;
  650. if (emitsOptions) {
  651. if (!(event in emitsOptions) &&
  652. !(false )) {
  653. if (!propsOptions || !(shared.toHandlerKey(event) in propsOptions)) {
  654. warn(`Component emitted event "${event}" but it is neither declared in ` +
  655. `the emits option nor as an "${shared.toHandlerKey(event)}" prop.`);
  656. }
  657. }
  658. else {
  659. const validator = emitsOptions[event];
  660. if (shared.isFunction(validator)) {
  661. const isValid = validator(...rawArgs);
  662. if (!isValid) {
  663. warn(`Invalid event arguments: event validation failed for event "${event}".`);
  664. }
  665. }
  666. }
  667. }
  668. }
  669. let args = rawArgs;
  670. const isModelListener = event.startsWith('update:');
  671. // for v-model update:xxx events, apply modifiers on args
  672. const modelArg = isModelListener && event.slice(7);
  673. if (modelArg && modelArg in props) {
  674. const modifiersKey = `${modelArg === 'modelValue' ? 'model' : modelArg}Modifiers`;
  675. const { number, trim } = props[modifiersKey] || shared.EMPTY_OBJ;
  676. if (trim) {
  677. args = rawArgs.map(a => a.trim());
  678. }
  679. else if (number) {
  680. args = rawArgs.map(shared.toNumber);
  681. }
  682. }
  683. {
  684. devtoolsComponentEmit(instance, event, args);
  685. }
  686. {
  687. const lowerCaseEvent = event.toLowerCase();
  688. if (lowerCaseEvent !== event && props[shared.toHandlerKey(lowerCaseEvent)]) {
  689. warn(`Event "${lowerCaseEvent}" is emitted in component ` +
  690. `${formatComponentName(instance, instance.type)} but the handler is registered for "${event}". ` +
  691. `Note that HTML attributes are case-insensitive and you cannot use ` +
  692. `v-on to listen to camelCase events when using in-DOM templates. ` +
  693. `You should probably use "${shared.hyphenate(event)}" instead of "${event}".`);
  694. }
  695. }
  696. let handlerName;
  697. let handler = props[(handlerName = shared.toHandlerKey(event))] ||
  698. // also try camelCase event handler (#2249)
  699. props[(handlerName = shared.toHandlerKey(shared.camelize(event)))];
  700. // for v-model update:xxx events, also trigger kebab-case equivalent
  701. // for props passed via kebab-case
  702. if (!handler && isModelListener) {
  703. handler = props[(handlerName = shared.toHandlerKey(shared.hyphenate(event)))];
  704. }
  705. if (handler) {
  706. callWithAsyncErrorHandling(handler, instance, 6 /* COMPONENT_EVENT_HANDLER */, args);
  707. }
  708. const onceHandler = props[handlerName + `Once`];
  709. if (onceHandler) {
  710. if (!instance.emitted) {
  711. instance.emitted = {};
  712. }
  713. else if (instance.emitted[handlerName]) {
  714. return;
  715. }
  716. instance.emitted[handlerName] = true;
  717. callWithAsyncErrorHandling(onceHandler, instance, 6 /* COMPONENT_EVENT_HANDLER */, args);
  718. }
  719. }
  720. function normalizeEmitsOptions(comp, appContext, asMixin = false) {
  721. const cache = appContext.emitsCache;
  722. const cached = cache.get(comp);
  723. if (cached !== undefined) {
  724. return cached;
  725. }
  726. const raw = comp.emits;
  727. let normalized = {};
  728. // apply mixin/extends props
  729. let hasExtends = false;
  730. if (!shared.isFunction(comp)) {
  731. const extendEmits = (raw) => {
  732. const normalizedFromExtend = normalizeEmitsOptions(raw, appContext, true);
  733. if (normalizedFromExtend) {
  734. hasExtends = true;
  735. shared.extend(normalized, normalizedFromExtend);
  736. }
  737. };
  738. if (!asMixin && appContext.mixins.length) {
  739. appContext.mixins.forEach(extendEmits);
  740. }
  741. if (comp.extends) {
  742. extendEmits(comp.extends);
  743. }
  744. if (comp.mixins) {
  745. comp.mixins.forEach(extendEmits);
  746. }
  747. }
  748. if (!raw && !hasExtends) {
  749. cache.set(comp, null);
  750. return null;
  751. }
  752. if (shared.isArray(raw)) {
  753. raw.forEach(key => (normalized[key] = null));
  754. }
  755. else {
  756. shared.extend(normalized, raw);
  757. }
  758. cache.set(comp, normalized);
  759. return normalized;
  760. }
  761. // Check if an incoming prop key is a declared emit event listener.
  762. // e.g. With `emits: { click: null }`, props named `onClick` and `onclick` are
  763. // both considered matched listeners.
  764. function isEmitListener(options, key) {
  765. if (!options || !shared.isOn(key)) {
  766. return false;
  767. }
  768. key = key.slice(2).replace(/Once$/, '');
  769. return (shared.hasOwn(options, key[0].toLowerCase() + key.slice(1)) ||
  770. shared.hasOwn(options, shared.hyphenate(key)) ||
  771. shared.hasOwn(options, key));
  772. }
  773. /**
  774. * mark the current rendering instance for asset resolution (e.g.
  775. * resolveComponent, resolveDirective) during render
  776. */
  777. let currentRenderingInstance = null;
  778. let currentScopeId = null;
  779. /**
  780. * Note: rendering calls maybe nested. The function returns the parent rendering
  781. * instance if present, which should be restored after the render is done:
  782. *
  783. * ```js
  784. * const prev = setCurrentRenderingInstance(i)
  785. * // ...render
  786. * setCurrentRenderingInstance(prev)
  787. * ```
  788. */
  789. function setCurrentRenderingInstance(instance) {
  790. const prev = currentRenderingInstance;
  791. currentRenderingInstance = instance;
  792. currentScopeId = (instance && instance.type.__scopeId) || null;
  793. return prev;
  794. }
  795. /**
  796. * Set scope id when creating hoisted vnodes.
  797. * @private compiler helper
  798. */
  799. function pushScopeId(id) {
  800. currentScopeId = id;
  801. }
  802. /**
  803. * Technically we no longer need this after 3.0.8 but we need to keep the same
  804. * API for backwards compat w/ code generated by compilers.
  805. * @private
  806. */
  807. function popScopeId() {
  808. currentScopeId = null;
  809. }
  810. /**
  811. * Only for backwards compat
  812. * @private
  813. */
  814. const withScopeId = (_id) => withCtx;
  815. /**
  816. * Wrap a slot function to memoize current rendering instance
  817. * @private compiler helper
  818. */
  819. function withCtx(fn, ctx = currentRenderingInstance, isNonScopedSlot // false only
  820. ) {
  821. if (!ctx)
  822. return fn;
  823. // already normalized
  824. if (fn._n) {
  825. return fn;
  826. }
  827. const renderFnWithContext = (...args) => {
  828. // If a user calls a compiled slot inside a template expression (#1745), it
  829. // can mess up block tracking, so by default we disable block tracking and
  830. // force bail out when invoking a compiled slot (indicated by the ._d flag).
  831. // This isn't necessary if rendering a compiled `<slot>`, so we flip the
  832. // ._d flag off when invoking the wrapped fn inside `renderSlot`.
  833. if (renderFnWithContext._d) {
  834. setBlockTracking(-1);
  835. }
  836. const prevInstance = setCurrentRenderingInstance(ctx);
  837. const res = fn(...args);
  838. setCurrentRenderingInstance(prevInstance);
  839. if (renderFnWithContext._d) {
  840. setBlockTracking(1);
  841. }
  842. {
  843. devtoolsComponentUpdated(ctx);
  844. }
  845. return res;
  846. };
  847. // mark normalized to avoid duplicated wrapping
  848. renderFnWithContext._n = true;
  849. // mark this as compiled by default
  850. // this is used in vnode.ts -> normalizeChildren() to set the slot
  851. // rendering flag.
  852. renderFnWithContext._c = true;
  853. // disable block tracking by default
  854. renderFnWithContext._d = true;
  855. return renderFnWithContext;
  856. }
  857. /**
  858. * dev only flag to track whether $attrs was used during render.
  859. * If $attrs was used during render then the warning for failed attrs
  860. * fallthrough can be suppressed.
  861. */
  862. let accessedAttrs = false;
  863. function markAttrsAccessed() {
  864. accessedAttrs = true;
  865. }
  866. function renderComponentRoot(instance) {
  867. const { type: Component, vnode, proxy, withProxy, props, propsOptions: [propsOptions], slots, attrs, emit, render, renderCache, data, setupState, ctx, inheritAttrs } = instance;
  868. let result;
  869. let fallthroughAttrs;
  870. const prev = setCurrentRenderingInstance(instance);
  871. {
  872. accessedAttrs = false;
  873. }
  874. try {
  875. if (vnode.shapeFlag & 4 /* STATEFUL_COMPONENT */) {
  876. // withProxy is a proxy with a different `has` trap only for
  877. // runtime-compiled render functions using `with` block.
  878. const proxyToUse = withProxy || proxy;
  879. result = normalizeVNode(render.call(proxyToUse, proxyToUse, renderCache, props, setupState, data, ctx));
  880. fallthroughAttrs = attrs;
  881. }
  882. else {
  883. // functional
  884. const render = Component;
  885. // in dev, mark attrs accessed if optional props (attrs === props)
  886. if (true && attrs === props) {
  887. markAttrsAccessed();
  888. }
  889. result = normalizeVNode(render.length > 1
  890. ? render(props, true
  891. ? {
  892. get attrs() {
  893. markAttrsAccessed();
  894. return attrs;
  895. },
  896. slots,
  897. emit
  898. }
  899. : { attrs, slots, emit })
  900. : render(props, null /* we know it doesn't need it */));
  901. fallthroughAttrs = Component.props
  902. ? attrs
  903. : getFunctionalFallthrough(attrs);
  904. }
  905. }
  906. catch (err) {
  907. blockStack.length = 0;
  908. handleError(err, instance, 1 /* RENDER_FUNCTION */);
  909. result = createVNode(Comment);
  910. }
  911. // attr merging
  912. // in dev mode, comments are preserved, and it's possible for a template
  913. // to have comments along side the root element which makes it a fragment
  914. let root = result;
  915. let setRoot = undefined;
  916. if (result.patchFlag > 0 &&
  917. result.patchFlag & 2048 /* DEV_ROOT_FRAGMENT */) {
  918. [root, setRoot] = getChildRoot(result);
  919. }
  920. if (fallthroughAttrs && inheritAttrs !== false) {
  921. const keys = Object.keys(fallthroughAttrs);
  922. const { shapeFlag } = root;
  923. if (keys.length) {
  924. if (shapeFlag & (1 /* ELEMENT */ | 6 /* COMPONENT */)) {
  925. if (propsOptions && keys.some(shared.isModelListener)) {
  926. // If a v-model listener (onUpdate:xxx) has a corresponding declared
  927. // prop, it indicates this component expects to handle v-model and
  928. // it should not fallthrough.
  929. // related: #1543, #1643, #1989
  930. fallthroughAttrs = filterModelListeners(fallthroughAttrs, propsOptions);
  931. }
  932. root = cloneVNode(root, fallthroughAttrs);
  933. }
  934. else if (!accessedAttrs && root.type !== Comment) {
  935. const allAttrs = Object.keys(attrs);
  936. const eventAttrs = [];
  937. const extraAttrs = [];
  938. for (let i = 0, l = allAttrs.length; i < l; i++) {
  939. const key = allAttrs[i];
  940. if (shared.isOn(key)) {
  941. // ignore v-model handlers when they fail to fallthrough
  942. if (!shared.isModelListener(key)) {
  943. // remove `on`, lowercase first letter to reflect event casing
  944. // accurately
  945. eventAttrs.push(key[2].toLowerCase() + key.slice(3));
  946. }
  947. }
  948. else {
  949. extraAttrs.push(key);
  950. }
  951. }
  952. if (extraAttrs.length) {
  953. warn(`Extraneous non-props attributes (` +
  954. `${extraAttrs.join(', ')}) ` +
  955. `were passed to component but could not be automatically inherited ` +
  956. `because component renders fragment or text root nodes.`);
  957. }
  958. if (eventAttrs.length) {
  959. warn(`Extraneous non-emits event listeners (` +
  960. `${eventAttrs.join(', ')}) ` +
  961. `were passed to component but could not be automatically inherited ` +
  962. `because component renders fragment or text root nodes. ` +
  963. `If the listener is intended to be a component custom event listener only, ` +
  964. `declare it using the "emits" option.`);
  965. }
  966. }
  967. }
  968. }
  969. // inherit directives
  970. if (vnode.dirs) {
  971. if (!isElementRoot(root)) {
  972. warn(`Runtime directive used on component with non-element root node. ` +
  973. `The directives will not function as intended.`);
  974. }
  975. root.dirs = root.dirs ? root.dirs.concat(vnode.dirs) : vnode.dirs;
  976. }
  977. // inherit transition data
  978. if (vnode.transition) {
  979. if (!isElementRoot(root)) {
  980. warn(`Component inside <Transition> renders non-element root node ` +
  981. `that cannot be animated.`);
  982. }
  983. root.transition = vnode.transition;
  984. }
  985. if (setRoot) {
  986. setRoot(root);
  987. }
  988. else {
  989. result = root;
  990. }
  991. setCurrentRenderingInstance(prev);
  992. return result;
  993. }
  994. /**
  995. * dev only
  996. * In dev mode, template root level comments are rendered, which turns the
  997. * template into a fragment root, but we need to locate the single element
  998. * root for attrs and scope id processing.
  999. */
  1000. const getChildRoot = (vnode) => {
  1001. const rawChildren = vnode.children;
  1002. const dynamicChildren = vnode.dynamicChildren;
  1003. const childRoot = filterSingleRoot(rawChildren);
  1004. if (!childRoot) {
  1005. return [vnode, undefined];
  1006. }
  1007. const index = rawChildren.indexOf(childRoot);
  1008. const dynamicIndex = dynamicChildren ? dynamicChildren.indexOf(childRoot) : -1;
  1009. const setRoot = (updatedRoot) => {
  1010. rawChildren[index] = updatedRoot;
  1011. if (dynamicChildren) {
  1012. if (dynamicIndex > -1) {
  1013. dynamicChildren[dynamicIndex] = updatedRoot;
  1014. }
  1015. else if (updatedRoot.patchFlag > 0) {
  1016. vnode.dynamicChildren = [...dynamicChildren, updatedRoot];
  1017. }
  1018. }
  1019. };
  1020. return [normalizeVNode(childRoot), setRoot];
  1021. };
  1022. function filterSingleRoot(children) {
  1023. let singleRoot;
  1024. for (let i = 0; i < children.length; i++) {
  1025. const child = children[i];
  1026. if (isVNode(child)) {
  1027. // ignore user comment
  1028. if (child.type !== Comment || child.children === 'v-if') {
  1029. if (singleRoot) {
  1030. // has more than 1 non-comment child, return now
  1031. return;
  1032. }
  1033. else {
  1034. singleRoot = child;
  1035. }
  1036. }
  1037. }
  1038. else {
  1039. return;
  1040. }
  1041. }
  1042. return singleRoot;
  1043. }
  1044. const getFunctionalFallthrough = (attrs) => {
  1045. let res;
  1046. for (const key in attrs) {
  1047. if (key === 'class' || key === 'style' || shared.isOn(key)) {
  1048. (res || (res = {}))[key] = attrs[key];
  1049. }
  1050. }
  1051. return res;
  1052. };
  1053. const filterModelListeners = (attrs, props) => {
  1054. const res = {};
  1055. for (const key in attrs) {
  1056. if (!shared.isModelListener(key) || !(key.slice(9) in props)) {
  1057. res[key] = attrs[key];
  1058. }
  1059. }
  1060. return res;
  1061. };
  1062. const isElementRoot = (vnode) => {
  1063. return (vnode.shapeFlag & (6 /* COMPONENT */ | 1 /* ELEMENT */) ||
  1064. vnode.type === Comment // potential v-if branch switch
  1065. );
  1066. };
  1067. function shouldUpdateComponent(prevVNode, nextVNode, optimized) {
  1068. const { props: prevProps, children: prevChildren, component } = prevVNode;
  1069. const { props: nextProps, children: nextChildren, patchFlag } = nextVNode;
  1070. const emits = component.emitsOptions;
  1071. // Parent component's render function was hot-updated. Since this may have
  1072. // caused the child component's slots content to have changed, we need to
  1073. // force the child to update as well.
  1074. if ((prevChildren || nextChildren) && isHmrUpdating) {
  1075. return true;
  1076. }
  1077. // force child update for runtime directive or transition on component vnode.
  1078. if (nextVNode.dirs || nextVNode.transition) {
  1079. return true;
  1080. }
  1081. if (optimized && patchFlag >= 0) {
  1082. if (patchFlag & 1024 /* DYNAMIC_SLOTS */) {
  1083. // slot content that references values that might have changed,
  1084. // e.g. in a v-for
  1085. return true;
  1086. }
  1087. if (patchFlag & 16 /* FULL_PROPS */) {
  1088. if (!prevProps) {
  1089. return !!nextProps;
  1090. }
  1091. // presence of this flag indicates props are always non-null
  1092. return hasPropsChanged(prevProps, nextProps, emits);
  1093. }
  1094. else if (patchFlag & 8 /* PROPS */) {
  1095. const dynamicProps = nextVNode.dynamicProps;
  1096. for (let i = 0; i < dynamicProps.length; i++) {
  1097. const key = dynamicProps[i];
  1098. if (nextProps[key] !== prevProps[key] &&
  1099. !isEmitListener(emits, key)) {
  1100. return true;
  1101. }
  1102. }
  1103. }
  1104. }
  1105. else {
  1106. // this path is only taken by manually written render functions
  1107. // so presence of any children leads to a forced update
  1108. if (prevChildren || nextChildren) {
  1109. if (!nextChildren || !nextChildren.$stable) {
  1110. return true;
  1111. }
  1112. }
  1113. if (prevProps === nextProps) {
  1114. return false;
  1115. }
  1116. if (!prevProps) {
  1117. return !!nextProps;
  1118. }
  1119. if (!nextProps) {
  1120. return true;
  1121. }
  1122. return hasPropsChanged(prevProps, nextProps, emits);
  1123. }
  1124. return false;
  1125. }
  1126. function hasPropsChanged(prevProps, nextProps, emitsOptions) {
  1127. const nextKeys = Object.keys(nextProps);
  1128. if (nextKeys.length !== Object.keys(prevProps).length) {
  1129. return true;
  1130. }
  1131. for (let i = 0; i < nextKeys.length; i++) {
  1132. const key = nextKeys[i];
  1133. if (nextProps[key] !== prevProps[key] &&
  1134. !isEmitListener(emitsOptions, key)) {
  1135. return true;
  1136. }
  1137. }
  1138. return false;
  1139. }
  1140. function updateHOCHostEl({ vnode, parent }, el // HostNode
  1141. ) {
  1142. while (parent && parent.subTree === vnode) {
  1143. (vnode = parent.vnode).el = el;
  1144. parent = parent.parent;
  1145. }
  1146. }
  1147. const isSuspense = (type) => type.__isSuspense;
  1148. // Suspense exposes a component-like API, and is treated like a component
  1149. // in the compiler, but internally it's a special built-in type that hooks
  1150. // directly into the renderer.
  1151. const SuspenseImpl = {
  1152. name: 'Suspense',
  1153. // In order to make Suspense tree-shakable, we need to avoid importing it
  1154. // directly in the renderer. The renderer checks for the __isSuspense flag
  1155. // on a vnode's type and calls the `process` method, passing in renderer
  1156. // internals.
  1157. __isSuspense: true,
  1158. process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized,
  1159. // platform-specific impl passed from renderer
  1160. rendererInternals) {
  1161. if (n1 == null) {
  1162. mountSuspense(n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals);
  1163. }
  1164. else {
  1165. patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotScopeIds, optimized, rendererInternals);
  1166. }
  1167. },
  1168. hydrate: hydrateSuspense,
  1169. create: createSuspenseBoundary,
  1170. normalize: normalizeSuspenseChildren
  1171. };
  1172. // Force-casted public typing for h and TSX props inference
  1173. const Suspense = (SuspenseImpl );
  1174. function triggerEvent(vnode, name) {
  1175. const eventListener = vnode.props && vnode.props[name];
  1176. if (shared.isFunction(eventListener)) {
  1177. eventListener();
  1178. }
  1179. }
  1180. function mountSuspense(vnode, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals) {
  1181. const { p: patch, o: { createElement } } = rendererInternals;
  1182. const hiddenContainer = createElement('div');
  1183. const suspense = (vnode.suspense = createSuspenseBoundary(vnode, parentSuspense, parentComponent, container, hiddenContainer, anchor, isSVG, slotScopeIds, optimized, rendererInternals));
  1184. // start mounting the content subtree in an off-dom container
  1185. patch(null, (suspense.pendingBranch = vnode.ssContent), hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds);
  1186. // now check if we have encountered any async deps
  1187. if (suspense.deps > 0) {
  1188. // has async
  1189. // invoke @fallback event
  1190. triggerEvent(vnode, 'onPending');
  1191. triggerEvent(vnode, 'onFallback');
  1192. // mount the fallback tree
  1193. patch(null, vnode.ssFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
  1194. isSVG, slotScopeIds);
  1195. setActiveBranch(suspense, vnode.ssFallback);
  1196. }
  1197. else {
  1198. // Suspense has no async deps. Just resolve.
  1199. suspense.resolve();
  1200. }
  1201. }
  1202. function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotScopeIds, optimized, { p: patch, um: unmount, o: { createElement } }) {
  1203. const suspense = (n2.suspense = n1.suspense);
  1204. suspense.vnode = n2;
  1205. n2.el = n1.el;
  1206. const newBranch = n2.ssContent;
  1207. const newFallback = n2.ssFallback;
  1208. const { activeBranch, pendingBranch, isInFallback, isHydrating } = suspense;
  1209. if (pendingBranch) {
  1210. suspense.pendingBranch = newBranch;
  1211. if (isSameVNodeType(newBranch, pendingBranch)) {
  1212. // same root type but content may have changed.
  1213. patch(pendingBranch, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized);
  1214. if (suspense.deps <= 0) {
  1215. suspense.resolve();
  1216. }
  1217. else if (isInFallback) {
  1218. patch(activeBranch, newFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
  1219. isSVG, slotScopeIds, optimized);
  1220. setActiveBranch(suspense, newFallback);
  1221. }
  1222. }
  1223. else {
  1224. // toggled before pending tree is resolved
  1225. suspense.pendingId++;
  1226. if (isHydrating) {
  1227. // if toggled before hydration is finished, the current DOM tree is
  1228. // no longer valid. set it as the active branch so it will be unmounted
  1229. // when resolved
  1230. suspense.isHydrating = false;
  1231. suspense.activeBranch = pendingBranch;
  1232. }
  1233. else {
  1234. unmount(pendingBranch, parentComponent, suspense);
  1235. }
  1236. // increment pending ID. this is used to invalidate async callbacks
  1237. // reset suspense state
  1238. suspense.deps = 0;
  1239. // discard effects from pending branch
  1240. suspense.effects.length = 0;
  1241. // discard previous container
  1242. suspense.hiddenContainer = createElement('div');
  1243. if (isInFallback) {
  1244. // already in fallback state
  1245. patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized);
  1246. if (suspense.deps <= 0) {
  1247. suspense.resolve();
  1248. }
  1249. else {
  1250. patch(activeBranch, newFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
  1251. isSVG, slotScopeIds, optimized);
  1252. setActiveBranch(suspense, newFallback);
  1253. }
  1254. }
  1255. else if (activeBranch && isSameVNodeType(newBranch, activeBranch)) {
  1256. // toggled "back" to current active branch
  1257. patch(activeBranch, newBranch, container, anchor, parentComponent, suspense, isSVG, slotScopeIds, optimized);
  1258. // force resolve
  1259. suspense.resolve(true);
  1260. }
  1261. else {
  1262. // switched to a 3rd branch
  1263. patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized);
  1264. if (suspense.deps <= 0) {
  1265. suspense.resolve();
  1266. }
  1267. }
  1268. }
  1269. }
  1270. else {
  1271. if (activeBranch && isSameVNodeType(newBranch, activeBranch)) {
  1272. // root did not change, just normal patch
  1273. patch(activeBranch, newBranch, container, anchor, parentComponent, suspense, isSVG, slotScopeIds, optimized);
  1274. setActiveBranch(suspense, newBranch);
  1275. }
  1276. else {
  1277. // root node toggled
  1278. // invoke @pending event
  1279. triggerEvent(n2, 'onPending');
  1280. // mount pending branch in off-dom container
  1281. suspense.pendingBranch = newBranch;
  1282. suspense.pendingId++;
  1283. patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized);
  1284. if (suspense.deps <= 0) {
  1285. // incoming branch has no async deps, resolve now.
  1286. suspense.resolve();
  1287. }
  1288. else {
  1289. const { timeout, pendingId } = suspense;
  1290. if (timeout > 0) {
  1291. setTimeout(() => {
  1292. if (suspense.pendingId === pendingId) {
  1293. suspense.fallback(newFallback);
  1294. }
  1295. }, timeout);
  1296. }
  1297. else if (timeout === 0) {
  1298. suspense.fallback(newFallback);
  1299. }
  1300. }
  1301. }
  1302. }
  1303. }
  1304. let hasWarned = false;
  1305. function createSuspenseBoundary(vnode, parent, parentComponent, container, hiddenContainer, anchor, isSVG, slotScopeIds, optimized, rendererInternals, isHydrating = false) {
  1306. /* istanbul ignore if */
  1307. if (!hasWarned) {
  1308. hasWarned = true;
  1309. // @ts-ignore `console.info` cannot be null error
  1310. console[console.info ? 'info' : 'log'](`<Suspense> is an experimental feature and its API will likely change.`);
  1311. }
  1312. const { p: patch, m: move, um: unmount, n: next, o: { parentNode, remove } } = rendererInternals;
  1313. const timeout = shared.toNumber(vnode.props && vnode.props.timeout);
  1314. const suspense = {
  1315. vnode,
  1316. parent,
  1317. parentComponent,
  1318. isSVG,
  1319. container,
  1320. hiddenContainer,
  1321. anchor,
  1322. deps: 0,
  1323. pendingId: 0,
  1324. timeout: typeof timeout === 'number' ? timeout : -1,
  1325. activeBranch: null,
  1326. pendingBranch: null,
  1327. isInFallback: true,
  1328. isHydrating,
  1329. isUnmounted: false,
  1330. effects: [],
  1331. resolve(resume = false) {
  1332. {
  1333. if (!resume && !suspense.pendingBranch) {
  1334. throw new Error(`suspense.resolve() is called without a pending branch.`);
  1335. }
  1336. if (suspense.isUnmounted) {
  1337. throw new Error(`suspense.resolve() is called on an already unmounted suspense boundary.`);
  1338. }
  1339. }
  1340. const { vnode, activeBranch, pendingBranch, pendingId, effects, parentComponent, container } = suspense;
  1341. if (suspense.isHydrating) {
  1342. suspense.isHydrating = false;
  1343. }
  1344. else if (!resume) {
  1345. const delayEnter = activeBranch &&
  1346. pendingBranch.transition &&
  1347. pendingBranch.transition.mode === 'out-in';
  1348. if (delayEnter) {
  1349. activeBranch.transition.afterLeave = () => {
  1350. if (pendingId === suspense.pendingId) {
  1351. move(pendingBranch, container, anchor, 0 /* ENTER */);
  1352. }
  1353. };
  1354. }
  1355. // this is initial anchor on mount
  1356. let { anchor } = suspense;
  1357. // unmount current active tree
  1358. if (activeBranch) {
  1359. // if the fallback tree was mounted, it may have been moved
  1360. // as part of a parent suspense. get the latest anchor for insertion
  1361. anchor = next(activeBranch);
  1362. unmount(activeBranch, parentComponent, suspense, true);
  1363. }
  1364. if (!delayEnter) {
  1365. // move content from off-dom container to actual container
  1366. move(pendingBranch, container, anchor, 0 /* ENTER */);
  1367. }
  1368. }
  1369. setActiveBranch(suspense, pendingBranch);
  1370. suspense.pendingBranch = null;
  1371. suspense.isInFallback = false;
  1372. // flush buffered effects
  1373. // check if there is a pending parent suspense
  1374. let parent = suspense.parent;
  1375. let hasUnresolvedAncestor = false;
  1376. while (parent) {
  1377. if (parent.pendingBranch) {
  1378. // found a pending parent suspense, merge buffered post jobs
  1379. // into that parent
  1380. parent.effects.push(...effects);
  1381. hasUnresolvedAncestor = true;
  1382. break;
  1383. }
  1384. parent = parent.parent;
  1385. }
  1386. // no pending parent suspense, flush all jobs
  1387. if (!hasUnresolvedAncestor) {
  1388. queuePostFlushCb(effects);
  1389. }
  1390. suspense.effects = [];
  1391. // invoke @resolve event
  1392. triggerEvent(vnode, 'onResolve');
  1393. },
  1394. fallback(fallbackVNode) {
  1395. if (!suspense.pendingBranch) {
  1396. return;
  1397. }
  1398. const { vnode, activeBranch, parentComponent, container, isSVG } = suspense;
  1399. // invoke @fallback event
  1400. triggerEvent(vnode, 'onFallback');
  1401. const anchor = next(activeBranch);
  1402. const mountFallback = () => {
  1403. if (!suspense.isInFallback) {
  1404. return;
  1405. }
  1406. // mount the fallback tree
  1407. patch(null, fallbackVNode, container, anchor, parentComponent, null, // fallback tree will not have suspense context
  1408. isSVG, slotScopeIds, optimized);
  1409. setActiveBranch(suspense, fallbackVNode);
  1410. };
  1411. const delayEnter = fallbackVNode.transition && fallbackVNode.transition.mode === 'out-in';
  1412. if (delayEnter) {
  1413. activeBranch.transition.afterLeave = mountFallback;
  1414. }
  1415. suspense.isInFallback = true;
  1416. // unmount current active branch
  1417. unmount(activeBranch, parentComponent, null, // no suspense so unmount hooks fire now
  1418. true // shouldRemove
  1419. );
  1420. if (!delayEnter) {
  1421. mountFallback();
  1422. }
  1423. },
  1424. move(container, anchor, type) {
  1425. suspense.activeBranch &&
  1426. move(suspense.activeBranch, container, anchor, type);
  1427. suspense.container = container;
  1428. },
  1429. next() {
  1430. return suspense.activeBranch && next(suspense.activeBranch);
  1431. },
  1432. registerDep(instance, setupRenderEffect) {
  1433. const isInPendingSuspense = !!suspense.pendingBranch;
  1434. if (isInPendingSuspense) {
  1435. suspense.deps++;
  1436. }
  1437. const hydratedEl = instance.vnode.el;
  1438. instance
  1439. .asyncDep.catch(err => {
  1440. handleError(err, instance, 0 /* SETUP_FUNCTION */);
  1441. })
  1442. .then(asyncSetupResult => {
  1443. // retry when the setup() promise resolves.
  1444. // component may have been unmounted before resolve.
  1445. if (instance.isUnmounted ||
  1446. suspense.isUnmounted ||
  1447. suspense.pendingId !== instance.suspenseId) {
  1448. return;
  1449. }
  1450. // retry from this component
  1451. instance.asyncResolved = true;
  1452. const { vnode } = instance;
  1453. {
  1454. pushWarningContext(vnode);
  1455. }
  1456. handleSetupResult(instance, asyncSetupResult, false);
  1457. if (hydratedEl) {
  1458. // vnode may have been replaced if an update happened before the
  1459. // async dep is resolved.
  1460. vnode.el = hydratedEl;
  1461. }
  1462. const placeholder = !hydratedEl && instance.subTree.el;
  1463. setupRenderEffect(instance, vnode,
  1464. // component may have been moved before resolve.
  1465. // if this is not a hydration, instance.subTree will be the comment
  1466. // placeholder.
  1467. parentNode(hydratedEl || instance.subTree.el),
  1468. // anchor will not be used if this is hydration, so only need to
  1469. // consider the comment placeholder case.
  1470. hydratedEl ? null : next(instance.subTree), suspense, isSVG, optimized);
  1471. if (placeholder) {
  1472. remove(placeholder);
  1473. }
  1474. updateHOCHostEl(instance, vnode.el);
  1475. {
  1476. popWarningContext();
  1477. }
  1478. // only decrease deps count if suspense is not already resolved
  1479. if (isInPendingSuspense && --suspense.deps === 0) {
  1480. suspense.resolve();
  1481. }
  1482. });
  1483. },
  1484. unmount(parentSuspense, doRemove) {
  1485. suspense.isUnmounted = true;
  1486. if (suspense.activeBranch) {
  1487. unmount(suspense.activeBranch, parentComponent, parentSuspense, doRemove);
  1488. }
  1489. if (suspense.pendingBranch) {
  1490. unmount(suspense.pendingBranch, parentComponent, parentSuspense, doRemove);
  1491. }
  1492. }
  1493. };
  1494. return suspense;
  1495. }
  1496. function hydrateSuspense(node, vnode, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals, hydrateNode) {
  1497. /* eslint-disable no-restricted-globals */
  1498. const suspense = (vnode.suspense = createSuspenseBoundary(vnode, parentSuspense, parentComponent, node.parentNode, document.createElement('div'), null, isSVG, slotScopeIds, optimized, rendererInternals, true /* hydrating */));
  1499. // there are two possible scenarios for server-rendered suspense:
  1500. // - success: ssr content should be fully resolved
  1501. // - failure: ssr content should be the fallback branch.
  1502. // however, on the client we don't really know if it has failed or not
  1503. // attempt to hydrate the DOM assuming it has succeeded, but we still
  1504. // need to construct a suspense boundary first
  1505. const result = hydrateNode(node, (suspense.pendingBranch = vnode.ssContent), parentComponent, suspense, slotScopeIds, optimized);
  1506. if (suspense.deps === 0) {
  1507. suspense.resolve();
  1508. }
  1509. return result;
  1510. /* eslint-enable no-restricted-globals */
  1511. }
  1512. function normalizeSuspenseChildren(vnode) {
  1513. const { shapeFlag, children } = vnode;
  1514. const isSlotChildren = shapeFlag & 32 /* SLOTS_CHILDREN */;
  1515. vnode.ssContent = normalizeSuspenseSlot(isSlotChildren ? children.default : children);
  1516. vnode.ssFallback = isSlotChildren
  1517. ? normalizeSuspenseSlot(children.fallback)
  1518. : createVNode(Comment);
  1519. }
  1520. function normalizeSuspenseSlot(s) {
  1521. let block;
  1522. if (shared.isFunction(s)) {
  1523. const trackBlock = isBlockTreeEnabled && s._c;
  1524. if (trackBlock) {
  1525. // disableTracking: false
  1526. // allow block tracking for compiled slots
  1527. // (see ./componentRenderContext.ts)
  1528. s._d = false;
  1529. openBlock();
  1530. }
  1531. s = s();
  1532. if (trackBlock) {
  1533. s._d = true;
  1534. block = currentBlock;
  1535. closeBlock();
  1536. }
  1537. }
  1538. if (shared.isArray(s)) {
  1539. const singleChild = filterSingleRoot(s);
  1540. if (!singleChild) {
  1541. warn(`<Suspense> slots expect a single root node.`);
  1542. }
  1543. s = singleChild;
  1544. }
  1545. s = normalizeVNode(s);
  1546. if (block && !s.dynamicChildren) {
  1547. s.dynamicChildren = block.filter(c => c !== s);
  1548. }
  1549. return s;
  1550. }
  1551. function queueEffectWithSuspense(fn, suspense) {
  1552. if (suspense && suspense.pendingBranch) {
  1553. if (shared.isArray(fn)) {
  1554. suspense.effects.push(...fn);
  1555. }
  1556. else {
  1557. suspense.effects.push(fn);
  1558. }
  1559. }
  1560. else {
  1561. queuePostFlushCb(fn);
  1562. }
  1563. }
  1564. function setActiveBranch(suspense, branch) {
  1565. suspense.activeBranch = branch;
  1566. const { vnode, parentComponent } = suspense;
  1567. const el = (vnode.el = branch.el);
  1568. // in case suspense is the root node of a component,
  1569. // recursively update the HOC el
  1570. if (parentComponent && parentComponent.subTree === vnode) {
  1571. parentComponent.vnode.el = el;
  1572. updateHOCHostEl(parentComponent, el);
  1573. }
  1574. }
  1575. function provide(key, value) {
  1576. if (!currentInstance) {
  1577. {
  1578. warn(`provide() can only be used inside setup().`);
  1579. }
  1580. }
  1581. else {
  1582. let provides = currentInstance.provides;
  1583. // by default an instance inherits its parent's provides object
  1584. // but when it needs to provide values of its own, it creates its
  1585. // own provides object using parent provides object as prototype.
  1586. // this way in `inject` we can simply look up injections from direct
  1587. // parent and let the prototype chain do the work.
  1588. const parentProvides = currentInstance.parent && currentInstance.parent.provides;
  1589. if (parentProvides === provides) {
  1590. provides = currentInstance.provides = Object.create(parentProvides);
  1591. }
  1592. // TS doesn't allow symbol as index type
  1593. provides[key] = value;
  1594. }
  1595. }
  1596. function inject(key, defaultValue, treatDefaultAsFactory = false) {
  1597. // fallback to `currentRenderingInstance` so that this can be called in
  1598. // a functional component
  1599. const instance = currentInstance || currentRenderingInstance;
  1600. if (instance) {
  1601. // #2400
  1602. // to support `app.use` plugins,
  1603. // fallback to appContext's `provides` if the instance is at root
  1604. const provides = instance.parent == null
  1605. ? instance.vnode.appContext && instance.vnode.appContext.provides
  1606. : instance.parent.provides;
  1607. if (provides && key in provides) {
  1608. // TS doesn't allow symbol as index type
  1609. return provides[key];
  1610. }
  1611. else if (arguments.length > 1) {
  1612. return treatDefaultAsFactory && shared.isFunction(defaultValue)
  1613. ? defaultValue.call(instance.proxy)
  1614. : defaultValue;
  1615. }
  1616. else {
  1617. warn(`injection "${String(key)}" not found.`);
  1618. }
  1619. }
  1620. else {
  1621. warn(`inject() can only be used inside setup() or functional components.`);
  1622. }
  1623. }
  1624. // Simple effect.
  1625. function watchEffect(effect, options) {
  1626. return doWatch(effect, null, options);
  1627. }
  1628. function watchPostEffect(effect, options) {
  1629. return doWatch(effect, null, (Object.assign(Object.assign({}, options), { flush: 'post' }) ));
  1630. }
  1631. function watchSyncEffect(effect, options) {
  1632. return doWatch(effect, null, (Object.assign(Object.assign({}, options), { flush: 'sync' }) ));
  1633. }
  1634. // initial value for watchers to trigger on undefined initial values
  1635. const INITIAL_WATCHER_VALUE = {};
  1636. // implementation
  1637. function watch(source, cb, options) {
  1638. if (!shared.isFunction(cb)) {
  1639. warn(`\`watch(fn, options?)\` signature has been moved to a separate API. ` +
  1640. `Use \`watchEffect(fn, options?)\` instead. \`watch\` now only ` +
  1641. `supports \`watch(source, cb, options?) signature.`);
  1642. }
  1643. return doWatch(source, cb, options);
  1644. }
  1645. function doWatch(source, cb, { immediate, deep, flush, onTrack, onTrigger } = shared.EMPTY_OBJ) {
  1646. if (!cb) {
  1647. if (immediate !== undefined) {
  1648. warn(`watch() "immediate" option is only respected when using the ` +
  1649. `watch(source, callback, options?) signature.`);
  1650. }
  1651. if (deep !== undefined) {
  1652. warn(`watch() "deep" option is only respected when using the ` +
  1653. `watch(source, callback, options?) signature.`);
  1654. }
  1655. }
  1656. const warnInvalidSource = (s) => {
  1657. warn(`Invalid watch source: `, s, `A watch source can only be a getter/effect function, a ref, ` +
  1658. `a reactive object, or an array of these types.`);
  1659. };
  1660. const instance = currentInstance;
  1661. let getter;
  1662. let forceTrigger = false;
  1663. let isMultiSource = false;
  1664. if (reactivity.isRef(source)) {
  1665. getter = () => source.value;
  1666. forceTrigger = reactivity.isShallow(source);
  1667. }
  1668. else if (reactivity.isReactive(source)) {
  1669. getter = () => source;
  1670. deep = true;
  1671. }
  1672. else if (shared.isArray(source)) {
  1673. isMultiSource = true;
  1674. forceTrigger = source.some(reactivity.isReactive);
  1675. getter = () => source.map(s => {
  1676. if (reactivity.isRef(s)) {
  1677. return s.value;
  1678. }
  1679. else if (reactivity.isReactive(s)) {
  1680. return traverse(s);
  1681. }
  1682. else if (shared.isFunction(s)) {
  1683. return callWithErrorHandling(s, instance, 2 /* WATCH_GETTER */);
  1684. }
  1685. else {
  1686. warnInvalidSource(s);
  1687. }
  1688. });
  1689. }
  1690. else if (shared.isFunction(source)) {
  1691. if (cb) {
  1692. // getter with cb
  1693. getter = () => callWithErrorHandling(source, instance, 2 /* WATCH_GETTER */);
  1694. }
  1695. else {
  1696. // no cb -> simple effect
  1697. getter = () => {
  1698. if (instance && instance.isUnmounted) {
  1699. return;
  1700. }
  1701. if (cleanup) {
  1702. cleanup();
  1703. }
  1704. return callWithAsyncErrorHandling(source, instance, 3 /* WATCH_CALLBACK */, [onCleanup]);
  1705. };
  1706. }
  1707. }
  1708. else {
  1709. getter = shared.NOOP;
  1710. warnInvalidSource(source);
  1711. }
  1712. if (cb && deep) {
  1713. const baseGetter = getter;
  1714. getter = () => traverse(baseGetter());
  1715. }
  1716. let cleanup;
  1717. let onCleanup = (fn) => {
  1718. cleanup = effect.onStop = () => {
  1719. callWithErrorHandling(fn, instance, 4 /* WATCH_CLEANUP */);
  1720. };
  1721. };
  1722. // in SSR there is no need to setup an actual effect, and it should be noop
  1723. // unless it's eager
  1724. if (isInSSRComponentSetup) {
  1725. // we will also not call the invalidate callback (+ runner is not set up)
  1726. onCleanup = shared.NOOP;
  1727. if (!cb) {
  1728. getter();
  1729. }
  1730. else if (immediate) {
  1731. callWithAsyncErrorHandling(cb, instance, 3 /* WATCH_CALLBACK */, [
  1732. getter(),
  1733. isMultiSource ? [] : undefined,
  1734. onCleanup
  1735. ]);
  1736. }
  1737. return shared.NOOP;
  1738. }
  1739. let oldValue = isMultiSource ? [] : INITIAL_WATCHER_VALUE;
  1740. const job = () => {
  1741. if (!effect.active) {
  1742. return;
  1743. }
  1744. if (cb) {
  1745. // watch(source, cb)
  1746. const newValue = effect.run();
  1747. if (deep ||
  1748. forceTrigger ||
  1749. (isMultiSource
  1750. ? newValue.some((v, i) => shared.hasChanged(v, oldValue[i]))
  1751. : shared.hasChanged(newValue, oldValue)) ||
  1752. (false )) {
  1753. // cleanup before running cb again
  1754. if (cleanup) {
  1755. cleanup();
  1756. }
  1757. callWithAsyncErrorHandling(cb, instance, 3 /* WATCH_CALLBACK */, [
  1758. newValue,
  1759. // pass undefined as the old value when it's changed for the first time
  1760. oldValue === INITIAL_WATCHER_VALUE ? undefined : oldValue,
  1761. onCleanup
  1762. ]);
  1763. oldValue = newValue;
  1764. }
  1765. }
  1766. else {
  1767. // watchEffect
  1768. effect.run();
  1769. }
  1770. };
  1771. // important: mark the job as a watcher callback so that scheduler knows
  1772. // it is allowed to self-trigger (#1727)
  1773. job.allowRecurse = !!cb;
  1774. let scheduler;
  1775. if (flush === 'sync') {
  1776. scheduler = job; // the scheduler function gets called directly
  1777. }
  1778. else if (flush === 'post') {
  1779. scheduler = () => queuePostRenderEffect(job, instance && instance.suspense);
  1780. }
  1781. else {
  1782. // default: 'pre'
  1783. scheduler = () => {
  1784. if (!instance || instance.isMounted) {
  1785. queuePreFlushCb(job);
  1786. }
  1787. else {
  1788. // with 'pre' option, the first call must happen before
  1789. // the component is mounted so it is called synchronously.
  1790. job();
  1791. }
  1792. };
  1793. }
  1794. const effect = new reactivity.ReactiveEffect(getter, scheduler);
  1795. {
  1796. effect.onTrack = onTrack;
  1797. effect.onTrigger = onTrigger;
  1798. }
  1799. // initial run
  1800. if (cb) {
  1801. if (immediate) {
  1802. job();
  1803. }
  1804. else {
  1805. oldValue = effect.run();
  1806. }
  1807. }
  1808. else if (flush === 'post') {
  1809. queuePostRenderEffect(effect.run.bind(effect), instance && instance.suspense);
  1810. }
  1811. else {
  1812. effect.run();
  1813. }
  1814. return () => {
  1815. effect.stop();
  1816. if (instance && instance.scope) {
  1817. shared.remove(instance.scope.effects, effect);
  1818. }
  1819. };
  1820. }
  1821. // this.$watch
  1822. function instanceWatch(source, value, options) {
  1823. const publicThis = this.proxy;
  1824. const getter = shared.isString(source)
  1825. ? source.includes('.')
  1826. ? createPathGetter(publicThis, source)
  1827. : () => publicThis[source]
  1828. : source.bind(publicThis, publicThis);
  1829. let cb;
  1830. if (shared.isFunction(value)) {
  1831. cb = value;
  1832. }
  1833. else {
  1834. cb = value.handler;
  1835. options = value;
  1836. }
  1837. const cur = currentInstance;
  1838. setCurrentInstance(this);
  1839. const res = doWatch(getter, cb.bind(publicThis), options);
  1840. if (cur) {
  1841. setCurrentInstance(cur);
  1842. }
  1843. else {
  1844. unsetCurrentInstance();
  1845. }
  1846. return res;
  1847. }
  1848. function createPathGetter(ctx, path) {
  1849. const segments = path.split('.');
  1850. return () => {
  1851. let cur = ctx;
  1852. for (let i = 0; i < segments.length && cur; i++) {
  1853. cur = cur[segments[i]];
  1854. }
  1855. return cur;
  1856. };
  1857. }
  1858. function traverse(value, seen) {
  1859. if (!shared.isObject(value) || value["__v_skip" /* SKIP */]) {
  1860. return value;
  1861. }
  1862. seen = seen || new Set();
  1863. if (seen.has(value)) {
  1864. return value;
  1865. }
  1866. seen.add(value);
  1867. if (reactivity.isRef(value)) {
  1868. traverse(value.value, seen);
  1869. }
  1870. else if (shared.isArray(value)) {
  1871. for (let i = 0; i < value.length; i++) {
  1872. traverse(value[i], seen);
  1873. }
  1874. }
  1875. else if (shared.isSet(value) || shared.isMap(value)) {
  1876. value.forEach((v) => {
  1877. traverse(v, seen);
  1878. });
  1879. }
  1880. else if (shared.isPlainObject(value)) {
  1881. for (const key in value) {
  1882. traverse(value[key], seen);
  1883. }
  1884. }
  1885. return value;
  1886. }
  1887. function useTransitionState() {
  1888. const state = {
  1889. isMounted: false,
  1890. isLeaving: false,
  1891. isUnmounting: false,
  1892. leavingVNodes: new Map()
  1893. };
  1894. onMounted(() => {
  1895. state.isMounted = true;
  1896. });
  1897. onBeforeUnmount(() => {
  1898. state.isUnmounting = true;
  1899. });
  1900. return state;
  1901. }
  1902. const TransitionHookValidator = [Function, Array];
  1903. const BaseTransitionImpl = {
  1904. name: `BaseTransition`,
  1905. props: {
  1906. mode: String,
  1907. appear: Boolean,
  1908. persisted: Boolean,
  1909. // enter
  1910. onBeforeEnter: TransitionHookValidator,
  1911. onEnter: TransitionHookValidator,
  1912. onAfterEnter: TransitionHookValidator,
  1913. onEnterCancelled: TransitionHookValidator,
  1914. // leave
  1915. onBeforeLeave: TransitionHookValidator,
  1916. onLeave: TransitionHookValidator,
  1917. onAfterLeave: TransitionHookValidator,
  1918. onLeaveCancelled: TransitionHookValidator,
  1919. // appear
  1920. onBeforeAppear: TransitionHookValidator,
  1921. onAppear: TransitionHookValidator,
  1922. onAfterAppear: TransitionHookValidator,
  1923. onAppearCancelled: TransitionHookValidator
  1924. },
  1925. setup(props, { slots }) {
  1926. const instance = getCurrentInstance();
  1927. const state = useTransitionState();
  1928. let prevTransitionKey;
  1929. return () => {
  1930. const children = slots.default && getTransitionRawChildren(slots.default(), true);
  1931. if (!children || !children.length) {
  1932. return;
  1933. }
  1934. let child = children[0];
  1935. if (children.length > 1) {
  1936. let hasFound = false;
  1937. // locate first non-comment child
  1938. for (const c of children) {
  1939. if (c.type !== Comment) {
  1940. if (hasFound) {
  1941. // warn more than one non-comment child
  1942. warn('<transition> can only be used on a single element or component. ' +
  1943. 'Use <transition-group> for lists.');
  1944. break;
  1945. }
  1946. child = c;
  1947. hasFound = true;
  1948. }
  1949. }
  1950. }
  1951. // there's no need to track reactivity for these props so use the raw
  1952. // props for a bit better perf
  1953. const rawProps = reactivity.toRaw(props);
  1954. const { mode } = rawProps;
  1955. // check mode
  1956. if (mode &&
  1957. mode !== 'in-out' &&
  1958. mode !== 'out-in' &&
  1959. mode !== 'default') {
  1960. warn(`invalid <transition> mode: ${mode}`);
  1961. }
  1962. if (state.isLeaving) {
  1963. return emptyPlaceholder(child);
  1964. }
  1965. // in the case of <transition><keep-alive/></transition>, we need to
  1966. // compare the type of the kept-alive children.
  1967. const innerChild = getKeepAliveChild(child);
  1968. if (!innerChild) {
  1969. return emptyPlaceholder(child);
  1970. }
  1971. const enterHooks = resolveTransitionHooks(innerChild, rawProps, state, instance);
  1972. setTransitionHooks(innerChild, enterHooks);
  1973. const oldChild = instance.subTree;
  1974. const oldInnerChild = oldChild && getKeepAliveChild(oldChild);
  1975. let transitionKeyChanged = false;
  1976. const { getTransitionKey } = innerChild.type;
  1977. if (getTransitionKey) {
  1978. const key = getTransitionKey();
  1979. if (prevTransitionKey === undefined) {
  1980. prevTransitionKey = key;
  1981. }
  1982. else if (key !== prevTransitionKey) {
  1983. prevTransitionKey = key;
  1984. transitionKeyChanged = true;
  1985. }
  1986. }
  1987. // handle mode
  1988. if (oldInnerChild &&
  1989. oldInnerChild.type !== Comment &&
  1990. (!isSameVNodeType(innerChild, oldInnerChild) || transitionKeyChanged)) {
  1991. const leavingHooks = resolveTransitionHooks(oldInnerChild, rawProps, state, instance);
  1992. // update old tree's hooks in case of dynamic transition
  1993. setTransitionHooks(oldInnerChild, leavingHooks);
  1994. // switching between different views
  1995. if (mode === 'out-in') {
  1996. state.isLeaving = true;
  1997. // return placeholder node and queue update when leave finishes
  1998. leavingHooks.afterLeave = () => {
  1999. state.isLeaving = false;
  2000. instance.update();
  2001. };
  2002. return emptyPlaceholder(child);
  2003. }
  2004. else if (mode === 'in-out' && innerChild.type !== Comment) {
  2005. leavingHooks.delayLeave = (el, earlyRemove, delayedLeave) => {
  2006. const leavingVNodesCache = getLeavingNodesForType(state, oldInnerChild);
  2007. leavingVNodesCache[String(oldInnerChild.key)] = oldInnerChild;
  2008. // early removal callback
  2009. el._leaveCb = () => {
  2010. earlyRemove();
  2011. el._leaveCb = undefined;
  2012. delete enterHooks.delayedLeave;
  2013. };
  2014. enterHooks.delayedLeave = delayedLeave;
  2015. };
  2016. }
  2017. }
  2018. return child;
  2019. };
  2020. }
  2021. };
  2022. // export the public type for h/tsx inference
  2023. // also to avoid inline import() in generated d.ts files
  2024. const BaseTransition = BaseTransitionImpl;
  2025. function getLeavingNodesForType(state, vnode) {
  2026. const { leavingVNodes } = state;
  2027. let leavingVNodesCache = leavingVNodes.get(vnode.type);
  2028. if (!leavingVNodesCache) {
  2029. leavingVNodesCache = Object.create(null);
  2030. leavingVNodes.set(vnode.type, leavingVNodesCache);
  2031. }
  2032. return leavingVNodesCache;
  2033. }
  2034. // The transition hooks are attached to the vnode as vnode.transition
  2035. // and will be called at appropriate timing in the renderer.
  2036. function resolveTransitionHooks(vnode, props, state, instance) {
  2037. const { appear, mode, persisted = false, onBeforeEnter, onEnter, onAfterEnter, onEnterCancelled, onBeforeLeave, onLeave, onAfterLeave, onLeaveCancelled, onBeforeAppear, onAppear, onAfterAppear, onAppearCancelled } = props;
  2038. const key = String(vnode.key);
  2039. const leavingVNodesCache = getLeavingNodesForType(state, vnode);
  2040. const callHook = (hook, args) => {
  2041. hook &&
  2042. callWithAsyncErrorHandling(hook, instance, 9 /* TRANSITION_HOOK */, args);
  2043. };
  2044. const hooks = {
  2045. mode,
  2046. persisted,
  2047. beforeEnter(el) {
  2048. let hook = onBeforeEnter;
  2049. if (!state.isMounted) {
  2050. if (appear) {
  2051. hook = onBeforeAppear || onBeforeEnter;
  2052. }
  2053. else {
  2054. return;
  2055. }
  2056. }
  2057. // for same element (v-show)
  2058. if (el._leaveCb) {
  2059. el._leaveCb(true /* cancelled */);
  2060. }
  2061. // for toggled element with same key (v-if)
  2062. const leavingVNode = leavingVNodesCache[key];
  2063. if (leavingVNode &&
  2064. isSameVNodeType(vnode, leavingVNode) &&
  2065. leavingVNode.el._leaveCb) {
  2066. // force early removal (not cancelled)
  2067. leavingVNode.el._leaveCb();
  2068. }
  2069. callHook(hook, [el]);
  2070. },
  2071. enter(el) {
  2072. let hook = onEnter;
  2073. let afterHook = onAfterEnter;
  2074. let cancelHook = onEnterCancelled;
  2075. if (!state.isMounted) {
  2076. if (appear) {
  2077. hook = onAppear || onEnter;
  2078. afterHook = onAfterAppear || onAfterEnter;
  2079. cancelHook = onAppearCancelled || onEnterCancelled;
  2080. }
  2081. else {
  2082. return;
  2083. }
  2084. }
  2085. let called = false;
  2086. const done = (el._enterCb = (cancelled) => {
  2087. if (called)
  2088. return;
  2089. called = true;
  2090. if (cancelled) {
  2091. callHook(cancelHook, [el]);
  2092. }
  2093. else {
  2094. callHook(afterHook, [el]);
  2095. }
  2096. if (hooks.delayedLeave) {
  2097. hooks.delayedLeave();
  2098. }
  2099. el._enterCb = undefined;
  2100. });
  2101. if (hook) {
  2102. hook(el, done);
  2103. if (hook.length <= 1) {
  2104. done();
  2105. }
  2106. }
  2107. else {
  2108. done();
  2109. }
  2110. },
  2111. leave(el, remove) {
  2112. const key = String(vnode.key);
  2113. if (el._enterCb) {
  2114. el._enterCb(true /* cancelled */);
  2115. }
  2116. if (state.isUnmounting) {
  2117. return remove();
  2118. }
  2119. callHook(onBeforeLeave, [el]);
  2120. let called = false;
  2121. const done = (el._leaveCb = (cancelled) => {
  2122. if (called)
  2123. return;
  2124. called = true;
  2125. remove();
  2126. if (cancelled) {
  2127. callHook(onLeaveCancelled, [el]);
  2128. }
  2129. else {
  2130. callHook(onAfterLeave, [el]);
  2131. }
  2132. el._leaveCb = undefined;
  2133. if (leavingVNodesCache[key] === vnode) {
  2134. delete leavingVNodesCache[key];
  2135. }
  2136. });
  2137. leavingVNodesCache[key] = vnode;
  2138. if (onLeave) {
  2139. onLeave(el, done);
  2140. if (onLeave.length <= 1) {
  2141. done();
  2142. }
  2143. }
  2144. else {
  2145. done();
  2146. }
  2147. },
  2148. clone(vnode) {
  2149. return resolveTransitionHooks(vnode, props, state, instance);
  2150. }
  2151. };
  2152. return hooks;
  2153. }
  2154. // the placeholder really only handles one special case: KeepAlive
  2155. // in the case of a KeepAlive in a leave phase we need to return a KeepAlive
  2156. // placeholder with empty content to avoid the KeepAlive instance from being
  2157. // unmounted.
  2158. function emptyPlaceholder(vnode) {
  2159. if (isKeepAlive(vnode)) {
  2160. vnode = cloneVNode(vnode);
  2161. vnode.children = null;
  2162. return vnode;
  2163. }
  2164. }
  2165. function getKeepAliveChild(vnode) {
  2166. return isKeepAlive(vnode)
  2167. ? vnode.children
  2168. ? vnode.children[0]
  2169. : undefined
  2170. : vnode;
  2171. }
  2172. function setTransitionHooks(vnode, hooks) {
  2173. if (vnode.shapeFlag & 6 /* COMPONENT */ && vnode.component) {
  2174. setTransitionHooks(vnode.component.subTree, hooks);
  2175. }
  2176. else if (vnode.shapeFlag & 128 /* SUSPENSE */) {
  2177. vnode.ssContent.transition = hooks.clone(vnode.ssContent);
  2178. vnode.ssFallback.transition = hooks.clone(vnode.ssFallback);
  2179. }
  2180. else {
  2181. vnode.transition = hooks;
  2182. }
  2183. }
  2184. function getTransitionRawChildren(children, keepComment = false, parentKey) {
  2185. let ret = [];
  2186. let keyedFragmentCount = 0;
  2187. for (let i = 0; i < children.length; i++) {
  2188. let child = children[i];
  2189. // #5360 inherit parent key in case of <template v-for>
  2190. const key = parentKey == null
  2191. ? child.key
  2192. : String(parentKey) + String(child.key != null ? child.key : i);
  2193. // handle fragment children case, e.g. v-for
  2194. if (child.type === Fragment) {
  2195. if (child.patchFlag & 128 /* KEYED_FRAGMENT */)
  2196. keyedFragmentCount++;
  2197. ret = ret.concat(getTransitionRawChildren(child.children, keepComment, key));
  2198. }
  2199. // comment placeholders should be skipped, e.g. v-if
  2200. else if (keepComment || child.type !== Comment) {
  2201. ret.push(key != null ? cloneVNode(child, { key }) : child);
  2202. }
  2203. }
  2204. // #1126 if a transition children list contains multiple sub fragments, these
  2205. // fragments will be merged into a flat children array. Since each v-for
  2206. // fragment may contain different static bindings inside, we need to de-op
  2207. // these children to force full diffs to ensure correct behavior.
  2208. if (keyedFragmentCount > 1) {
  2209. for (let i = 0; i < ret.length; i++) {
  2210. ret[i].patchFlag = -2 /* BAIL */;
  2211. }
  2212. }
  2213. return ret;
  2214. }
  2215. // implementation, close to no-op
  2216. function defineComponent(options) {
  2217. return shared.isFunction(options) ? { setup: options, name: options.name } : options;
  2218. }
  2219. const isAsyncWrapper = (i) => !!i.type.__asyncLoader;
  2220. function defineAsyncComponent(source) {
  2221. if (shared.isFunction(source)) {
  2222. source = { loader: source };
  2223. }
  2224. const { loader, loadingComponent, errorComponent, delay = 200, timeout, // undefined = never times out
  2225. suspensible = true, onError: userOnError } = source;
  2226. let pendingRequest = null;
  2227. let resolvedComp;
  2228. let retries = 0;
  2229. const retry = () => {
  2230. retries++;
  2231. pendingRequest = null;
  2232. return load();
  2233. };
  2234. const load = () => {
  2235. let thisRequest;
  2236. return (pendingRequest ||
  2237. (thisRequest = pendingRequest =
  2238. loader()
  2239. .catch(err => {
  2240. err = err instanceof Error ? err : new Error(String(err));
  2241. if (userOnError) {
  2242. return new Promise((resolve, reject) => {
  2243. const userRetry = () => resolve(retry());
  2244. const userFail = () => reject(err);
  2245. userOnError(err, userRetry, userFail, retries + 1);
  2246. });
  2247. }
  2248. else {
  2249. throw err;
  2250. }
  2251. })
  2252. .then((comp) => {
  2253. if (thisRequest !== pendingRequest && pendingRequest) {
  2254. return pendingRequest;
  2255. }
  2256. if (!comp) {
  2257. warn(`Async component loader resolved to undefined. ` +
  2258. `If you are using retry(), make sure to return its return value.`);
  2259. }
  2260. // interop module default
  2261. if (comp &&
  2262. (comp.__esModule || comp[Symbol.toStringTag] === 'Module')) {
  2263. comp = comp.default;
  2264. }
  2265. if (comp && !shared.isObject(comp) && !shared.isFunction(comp)) {
  2266. throw new Error(`Invalid async component load result: ${comp}`);
  2267. }
  2268. resolvedComp = comp;
  2269. return comp;
  2270. })));
  2271. };
  2272. return defineComponent({
  2273. name: 'AsyncComponentWrapper',
  2274. __asyncLoader: load,
  2275. get __asyncResolved() {
  2276. return resolvedComp;
  2277. },
  2278. setup() {
  2279. const instance = currentInstance;
  2280. // already resolved
  2281. if (resolvedComp) {
  2282. return () => createInnerComp(resolvedComp, instance);
  2283. }
  2284. const onError = (err) => {
  2285. pendingRequest = null;
  2286. handleError(err, instance, 13 /* ASYNC_COMPONENT_LOADER */, !errorComponent /* do not throw in dev if user provided error component */);
  2287. };
  2288. // suspense-controlled or SSR.
  2289. if ((suspensible && instance.suspense) ||
  2290. (isInSSRComponentSetup)) {
  2291. return load()
  2292. .then(comp => {
  2293. return () => createInnerComp(comp, instance);
  2294. })
  2295. .catch(err => {
  2296. onError(err);
  2297. return () => errorComponent
  2298. ? createVNode(errorComponent, {
  2299. error: err
  2300. })
  2301. : null;
  2302. });
  2303. }
  2304. const loaded = reactivity.ref(false);
  2305. const error = reactivity.ref();
  2306. const delayed = reactivity.ref(!!delay);
  2307. if (delay) {
  2308. setTimeout(() => {
  2309. delayed.value = false;
  2310. }, delay);
  2311. }
  2312. if (timeout != null) {
  2313. setTimeout(() => {
  2314. if (!loaded.value && !error.value) {
  2315. const err = new Error(`Async component timed out after ${timeout}ms.`);
  2316. onError(err);
  2317. error.value = err;
  2318. }
  2319. }, timeout);
  2320. }
  2321. load()
  2322. .then(() => {
  2323. loaded.value = true;
  2324. if (instance.parent && isKeepAlive(instance.parent.vnode)) {
  2325. // parent is keep-alive, force update so the loaded component's
  2326. // name is taken into account
  2327. queueJob(instance.parent.update);
  2328. }
  2329. })
  2330. .catch(err => {
  2331. onError(err);
  2332. error.value = err;
  2333. });
  2334. return () => {
  2335. if (loaded.value && resolvedComp) {
  2336. return createInnerComp(resolvedComp, instance);
  2337. }
  2338. else if (error.value && errorComponent) {
  2339. return createVNode(errorComponent, {
  2340. error: error.value
  2341. });
  2342. }
  2343. else if (loadingComponent && !delayed.value) {
  2344. return createVNode(loadingComponent);
  2345. }
  2346. };
  2347. }
  2348. });
  2349. }
  2350. function createInnerComp(comp, { vnode: { ref, props, children } }) {
  2351. const vnode = createVNode(comp, props, children);
  2352. // ensure inner component inherits the async wrapper's ref owner
  2353. vnode.ref = ref;
  2354. return vnode;
  2355. }
  2356. const isKeepAlive = (vnode) => vnode.type.__isKeepAlive;
  2357. const KeepAliveImpl = {
  2358. name: `KeepAlive`,
  2359. // Marker for special handling inside the renderer. We are not using a ===
  2360. // check directly on KeepAlive in the renderer, because importing it directly
  2361. // would prevent it from being tree-shaken.
  2362. __isKeepAlive: true,
  2363. props: {
  2364. include: [String, RegExp, Array],
  2365. exclude: [String, RegExp, Array],
  2366. max: [String, Number]
  2367. },
  2368. setup(props, { slots }) {
  2369. const instance = getCurrentInstance();
  2370. // KeepAlive communicates with the instantiated renderer via the
  2371. // ctx where the renderer passes in its internals,
  2372. // and the KeepAlive instance exposes activate/deactivate implementations.
  2373. // The whole point of this is to avoid importing KeepAlive directly in the
  2374. // renderer to facilitate tree-shaking.
  2375. const sharedContext = instance.ctx;
  2376. // if the internal renderer is not registered, it indicates that this is server-side rendering,
  2377. // for KeepAlive, we just need to render its children
  2378. if (!sharedContext.renderer) {
  2379. return slots.default;
  2380. }
  2381. const cache = new Map();
  2382. const keys = new Set();
  2383. let current = null;
  2384. {
  2385. instance.__v_cache = cache;
  2386. }
  2387. const parentSuspense = instance.suspense;
  2388. const { renderer: { p: patch, m: move, um: _unmount, o: { createElement } } } = sharedContext;
  2389. const storageContainer = createElement('div');
  2390. sharedContext.activate = (vnode, container, anchor, isSVG, optimized) => {
  2391. const instance = vnode.component;
  2392. move(vnode, container, anchor, 0 /* ENTER */, parentSuspense);
  2393. // in case props have changed
  2394. patch(instance.vnode, vnode, container, anchor, instance, parentSuspense, isSVG, vnode.slotScopeIds, optimized);
  2395. queuePostRenderEffect(() => {
  2396. instance.isDeactivated = false;
  2397. if (instance.a) {
  2398. shared.invokeArrayFns(instance.a);
  2399. }
  2400. const vnodeHook = vnode.props && vnode.props.onVnodeMounted;
  2401. if (vnodeHook) {
  2402. invokeVNodeHook(vnodeHook, instance.parent, vnode);
  2403. }
  2404. }, parentSuspense);
  2405. {
  2406. // Update components tree
  2407. devtoolsComponentAdded(instance);
  2408. }
  2409. };
  2410. sharedContext.deactivate = (vnode) => {
  2411. const instance = vnode.component;
  2412. move(vnode, storageContainer, null, 1 /* LEAVE */, parentSuspense);
  2413. queuePostRenderEffect(() => {
  2414. if (instance.da) {
  2415. shared.invokeArrayFns(instance.da);
  2416. }
  2417. const vnodeHook = vnode.props && vnode.props.onVnodeUnmounted;
  2418. if (vnodeHook) {
  2419. invokeVNodeHook(vnodeHook, instance.parent, vnode);
  2420. }
  2421. instance.isDeactivated = true;
  2422. }, parentSuspense);
  2423. {
  2424. // Update components tree
  2425. devtoolsComponentAdded(instance);
  2426. }
  2427. };
  2428. function unmount(vnode) {
  2429. // reset the shapeFlag so it can be properly unmounted
  2430. resetShapeFlag(vnode);
  2431. _unmount(vnode, instance, parentSuspense, true);
  2432. }
  2433. function pruneCache(filter) {
  2434. cache.forEach((vnode, key) => {
  2435. const name = getComponentName(vnode.type);
  2436. if (name && (!filter || !filter(name))) {
  2437. pruneCacheEntry(key);
  2438. }
  2439. });
  2440. }
  2441. function pruneCacheEntry(key) {
  2442. const cached = cache.get(key);
  2443. if (!current || cached.type !== current.type) {
  2444. unmount(cached);
  2445. }
  2446. else if (current) {
  2447. // current active instance should no longer be kept-alive.
  2448. // we can't unmount it now but it might be later, so reset its flag now.
  2449. resetShapeFlag(current);
  2450. }
  2451. cache.delete(key);
  2452. keys.delete(key);
  2453. }
  2454. // prune cache on include/exclude prop change
  2455. watch(() => [props.include, props.exclude], ([include, exclude]) => {
  2456. include && pruneCache(name => matches(include, name));
  2457. exclude && pruneCache(name => !matches(exclude, name));
  2458. },
  2459. // prune post-render after `current` has been updated
  2460. { flush: 'post', deep: true });
  2461. // cache sub tree after render
  2462. let pendingCacheKey = null;
  2463. const cacheSubtree = () => {
  2464. // fix #1621, the pendingCacheKey could be 0
  2465. if (pendingCacheKey != null) {
  2466. cache.set(pendingCacheKey, getInnerChild(instance.subTree));
  2467. }
  2468. };
  2469. onMounted(cacheSubtree);
  2470. onUpdated(cacheSubtree);
  2471. onBeforeUnmount(() => {
  2472. cache.forEach(cached => {
  2473. const { subTree, suspense } = instance;
  2474. const vnode = getInnerChild(subTree);
  2475. if (cached.type === vnode.type) {
  2476. // current instance will be unmounted as part of keep-alive's unmount
  2477. resetShapeFlag(vnode);
  2478. // but invoke its deactivated hook here
  2479. const da = vnode.component.da;
  2480. da && queuePostRenderEffect(da, suspense);
  2481. return;
  2482. }
  2483. unmount(cached);
  2484. });
  2485. });
  2486. return () => {
  2487. pendingCacheKey = null;
  2488. if (!slots.default) {
  2489. return null;
  2490. }
  2491. const children = slots.default();
  2492. const rawVNode = children[0];
  2493. if (children.length > 1) {
  2494. {
  2495. warn(`KeepAlive should contain exactly one component child.`);
  2496. }
  2497. current = null;
  2498. return children;
  2499. }
  2500. else if (!isVNode(rawVNode) ||
  2501. (!(rawVNode.shapeFlag & 4 /* STATEFUL_COMPONENT */) &&
  2502. !(rawVNode.shapeFlag & 128 /* SUSPENSE */))) {
  2503. current = null;
  2504. return rawVNode;
  2505. }
  2506. let vnode = getInnerChild(rawVNode);
  2507. const comp = vnode.type;
  2508. // for async components, name check should be based in its loaded
  2509. // inner component if available
  2510. const name = getComponentName(isAsyncWrapper(vnode)
  2511. ? vnode.type.__asyncResolved || {}
  2512. : comp);
  2513. const { include, exclude, max } = props;
  2514. if ((include && (!name || !matches(include, name))) ||
  2515. (exclude && name && matches(exclude, name))) {
  2516. current = vnode;
  2517. return rawVNode;
  2518. }
  2519. const key = vnode.key == null ? comp : vnode.key;
  2520. const cachedVNode = cache.get(key);
  2521. // clone vnode if it's reused because we are going to mutate it
  2522. if (vnode.el) {
  2523. vnode = cloneVNode(vnode);
  2524. if (rawVNode.shapeFlag & 128 /* SUSPENSE */) {
  2525. rawVNode.ssContent = vnode;
  2526. }
  2527. }
  2528. // #1513 it's possible for the returned vnode to be cloned due to attr
  2529. // fallthrough or scopeId, so the vnode here may not be the final vnode
  2530. // that is mounted. Instead of caching it directly, we store the pending
  2531. // key and cache `instance.subTree` (the normalized vnode) in
  2532. // beforeMount/beforeUpdate hooks.
  2533. pendingCacheKey = key;
  2534. if (cachedVNode) {
  2535. // copy over mounted state
  2536. vnode.el = cachedVNode.el;
  2537. vnode.component = cachedVNode.component;
  2538. if (vnode.transition) {
  2539. // recursively update transition hooks on subTree
  2540. setTransitionHooks(vnode, vnode.transition);
  2541. }
  2542. // avoid vnode being mounted as fresh
  2543. vnode.shapeFlag |= 512 /* COMPONENT_KEPT_ALIVE */;
  2544. // make this key the freshest
  2545. keys.delete(key);
  2546. keys.add(key);
  2547. }
  2548. else {
  2549. keys.add(key);
  2550. // prune oldest entry
  2551. if (max && keys.size > parseInt(max, 10)) {
  2552. pruneCacheEntry(keys.values().next().value);
  2553. }
  2554. }
  2555. // avoid vnode being unmounted
  2556. vnode.shapeFlag |= 256 /* COMPONENT_SHOULD_KEEP_ALIVE */;
  2557. current = vnode;
  2558. return rawVNode;
  2559. };
  2560. }
  2561. };
  2562. // export the public type for h/tsx inference
  2563. // also to avoid inline import() in generated d.ts files
  2564. const KeepAlive = KeepAliveImpl;
  2565. function matches(pattern, name) {
  2566. if (shared.isArray(pattern)) {
  2567. return pattern.some((p) => matches(p, name));
  2568. }
  2569. else if (shared.isString(pattern)) {
  2570. return pattern.split(',').includes(name);
  2571. }
  2572. else if (pattern.test) {
  2573. return pattern.test(name);
  2574. }
  2575. /* istanbul ignore next */
  2576. return false;
  2577. }
  2578. function onActivated(hook, target) {
  2579. registerKeepAliveHook(hook, "a" /* ACTIVATED */, target);
  2580. }
  2581. function onDeactivated(hook, target) {
  2582. registerKeepAliveHook(hook, "da" /* DEACTIVATED */, target);
  2583. }
  2584. function registerKeepAliveHook(hook, type, target = currentInstance) {
  2585. // cache the deactivate branch check wrapper for injected hooks so the same
  2586. // hook can be properly deduped by the scheduler. "__wdc" stands for "with
  2587. // deactivation check".
  2588. const wrappedHook = hook.__wdc ||
  2589. (hook.__wdc = () => {
  2590. // only fire the hook if the target instance is NOT in a deactivated branch.
  2591. let current = target;
  2592. while (current) {
  2593. if (current.isDeactivated) {
  2594. return;
  2595. }
  2596. current = current.parent;
  2597. }
  2598. return hook();
  2599. });
  2600. injectHook(type, wrappedHook, target);
  2601. // In addition to registering it on the target instance, we walk up the parent
  2602. // chain and register it on all ancestor instances that are keep-alive roots.
  2603. // This avoids the need to walk the entire component tree when invoking these
  2604. // hooks, and more importantly, avoids the need to track child components in
  2605. // arrays.
  2606. if (target) {
  2607. let current = target.parent;
  2608. while (current && current.parent) {
  2609. if (isKeepAlive(current.parent.vnode)) {
  2610. injectToKeepAliveRoot(wrappedHook, type, target, current);
  2611. }
  2612. current = current.parent;
  2613. }
  2614. }
  2615. }
  2616. function injectToKeepAliveRoot(hook, type, target, keepAliveRoot) {
  2617. // injectHook wraps the original for error handling, so make sure to remove
  2618. // the wrapped version.
  2619. const injected = injectHook(type, hook, keepAliveRoot, true /* prepend */);
  2620. onUnmounted(() => {
  2621. shared.remove(keepAliveRoot[type], injected);
  2622. }, target);
  2623. }
  2624. function resetShapeFlag(vnode) {
  2625. let shapeFlag = vnode.shapeFlag;
  2626. if (shapeFlag & 256 /* COMPONENT_SHOULD_KEEP_ALIVE */) {
  2627. shapeFlag -= 256 /* COMPONENT_SHOULD_KEEP_ALIVE */;
  2628. }
  2629. if (shapeFlag & 512 /* COMPONENT_KEPT_ALIVE */) {
  2630. shapeFlag -= 512 /* COMPONENT_KEPT_ALIVE */;
  2631. }
  2632. vnode.shapeFlag = shapeFlag;
  2633. }
  2634. function getInnerChild(vnode) {
  2635. return vnode.shapeFlag & 128 /* SUSPENSE */ ? vnode.ssContent : vnode;
  2636. }
  2637. function injectHook(type, hook, target = currentInstance, prepend = false) {
  2638. if (target) {
  2639. const hooks = target[type] || (target[type] = []);
  2640. // cache the error handling wrapper for injected hooks so the same hook
  2641. // can be properly deduped by the scheduler. "__weh" stands for "with error
  2642. // handling".
  2643. const wrappedHook = hook.__weh ||
  2644. (hook.__weh = (...args) => {
  2645. if (target.isUnmounted) {
  2646. return;
  2647. }
  2648. // disable tracking inside all lifecycle hooks
  2649. // since they can potentially be called inside effects.
  2650. reactivity.pauseTracking();
  2651. // Set currentInstance during hook invocation.
  2652. // This assumes the hook does not synchronously trigger other hooks, which
  2653. // can only be false when the user does something really funky.
  2654. setCurrentInstance(target);
  2655. const res = callWithAsyncErrorHandling(hook, target, type, args);
  2656. unsetCurrentInstance();
  2657. reactivity.resetTracking();
  2658. return res;
  2659. });
  2660. if (prepend) {
  2661. hooks.unshift(wrappedHook);
  2662. }
  2663. else {
  2664. hooks.push(wrappedHook);
  2665. }
  2666. return wrappedHook;
  2667. }
  2668. else {
  2669. const apiName = shared.toHandlerKey(ErrorTypeStrings[type].replace(/ hook$/, ''));
  2670. warn(`${apiName} is called when there is no active component instance to be ` +
  2671. `associated with. ` +
  2672. `Lifecycle injection APIs can only be used during execution of setup().` +
  2673. (` If you are using async setup(), make sure to register lifecycle ` +
  2674. `hooks before the first await statement.`
  2675. ));
  2676. }
  2677. }
  2678. const createHook = (lifecycle) => (hook, target = currentInstance) =>
  2679. // post-create lifecycle registrations are noops during SSR (except for serverPrefetch)
  2680. (!isInSSRComponentSetup || lifecycle === "sp" /* SERVER_PREFETCH */) &&
  2681. injectHook(lifecycle, hook, target);
  2682. const onBeforeMount = createHook("bm" /* BEFORE_MOUNT */);
  2683. const onMounted = createHook("m" /* MOUNTED */);
  2684. const onBeforeUpdate = createHook("bu" /* BEFORE_UPDATE */);
  2685. const onUpdated = createHook("u" /* UPDATED */);
  2686. const onBeforeUnmount = createHook("bum" /* BEFORE_UNMOUNT */);
  2687. const onUnmounted = createHook("um" /* UNMOUNTED */);
  2688. const onServerPrefetch = createHook("sp" /* SERVER_PREFETCH */);
  2689. const onRenderTriggered = createHook("rtg" /* RENDER_TRIGGERED */);
  2690. const onRenderTracked = createHook("rtc" /* RENDER_TRACKED */);
  2691. function onErrorCaptured(hook, target = currentInstance) {
  2692. injectHook("ec" /* ERROR_CAPTURED */, hook, target);
  2693. }
  2694. function createDuplicateChecker() {
  2695. const cache = Object.create(null);
  2696. return (type, key) => {
  2697. if (cache[key]) {
  2698. warn(`${type} property "${key}" is already defined in ${cache[key]}.`);
  2699. }
  2700. else {
  2701. cache[key] = type;
  2702. }
  2703. };
  2704. }
  2705. let shouldCacheAccess = true;
  2706. function applyOptions(instance) {
  2707. const options = resolveMergedOptions(instance);
  2708. const publicThis = instance.proxy;
  2709. const ctx = instance.ctx;
  2710. // do not cache property access on public proxy during state initialization
  2711. shouldCacheAccess = false;
  2712. // call beforeCreate first before accessing other options since
  2713. // the hook may mutate resolved options (#2791)
  2714. if (options.beforeCreate) {
  2715. callHook(options.beforeCreate, instance, "bc" /* BEFORE_CREATE */);
  2716. }
  2717. const {
  2718. // state
  2719. data: dataOptions, computed: computedOptions, methods, watch: watchOptions, provide: provideOptions, inject: injectOptions,
  2720. // lifecycle
  2721. created, beforeMount, mounted, beforeUpdate, updated, activated, deactivated, beforeDestroy, beforeUnmount, destroyed, unmounted, render, renderTracked, renderTriggered, errorCaptured, serverPrefetch,
  2722. // public API
  2723. expose, inheritAttrs,
  2724. // assets
  2725. components, directives, filters } = options;
  2726. const checkDuplicateProperties = createDuplicateChecker() ;
  2727. {
  2728. const [propsOptions] = instance.propsOptions;
  2729. if (propsOptions) {
  2730. for (const key in propsOptions) {
  2731. checkDuplicateProperties("Props" /* PROPS */, key);
  2732. }
  2733. }
  2734. }
  2735. // options initialization order (to be consistent with Vue 2):
  2736. // - props (already done outside of this function)
  2737. // - inject
  2738. // - methods
  2739. // - data (deferred since it relies on `this` access)
  2740. // - computed
  2741. // - watch (deferred since it relies on `this` access)
  2742. if (injectOptions) {
  2743. resolveInjections(injectOptions, ctx, checkDuplicateProperties, instance.appContext.config.unwrapInjectedRef);
  2744. }
  2745. if (methods) {
  2746. for (const key in methods) {
  2747. const methodHandler = methods[key];
  2748. if (shared.isFunction(methodHandler)) {
  2749. // In dev mode, we use the `createRenderContext` function to define
  2750. // methods to the proxy target, and those are read-only but
  2751. // reconfigurable, so it needs to be redefined here
  2752. {
  2753. Object.defineProperty(ctx, key, {
  2754. value: methodHandler.bind(publicThis),
  2755. configurable: true,
  2756. enumerable: true,
  2757. writable: true
  2758. });
  2759. }
  2760. {
  2761. checkDuplicateProperties("Methods" /* METHODS */, key);
  2762. }
  2763. }
  2764. else {
  2765. warn(`Method "${key}" has type "${typeof methodHandler}" in the component definition. ` +
  2766. `Did you reference the function correctly?`);
  2767. }
  2768. }
  2769. }
  2770. if (dataOptions) {
  2771. if (!shared.isFunction(dataOptions)) {
  2772. warn(`The data option must be a function. ` +
  2773. `Plain object usage is no longer supported.`);
  2774. }
  2775. const data = dataOptions.call(publicThis, publicThis);
  2776. if (shared.isPromise(data)) {
  2777. warn(`data() returned a Promise - note data() cannot be async; If you ` +
  2778. `intend to perform data fetching before component renders, use ` +
  2779. `async setup() + <Suspense>.`);
  2780. }
  2781. if (!shared.isObject(data)) {
  2782. warn(`data() should return an object.`);
  2783. }
  2784. else {
  2785. instance.data = reactivity.reactive(data);
  2786. {
  2787. for (const key in data) {
  2788. checkDuplicateProperties("Data" /* DATA */, key);
  2789. // expose data on ctx during dev
  2790. if (key[0] !== '$' && key[0] !== '_') {
  2791. Object.defineProperty(ctx, key, {
  2792. configurable: true,
  2793. enumerable: true,
  2794. get: () => data[key],
  2795. set: shared.NOOP
  2796. });
  2797. }
  2798. }
  2799. }
  2800. }
  2801. }
  2802. // state initialization complete at this point - start caching access
  2803. shouldCacheAccess = true;
  2804. if (computedOptions) {
  2805. for (const key in computedOptions) {
  2806. const opt = computedOptions[key];
  2807. const get = shared.isFunction(opt)
  2808. ? opt.bind(publicThis, publicThis)
  2809. : shared.isFunction(opt.get)
  2810. ? opt.get.bind(publicThis, publicThis)
  2811. : shared.NOOP;
  2812. if (get === shared.NOOP) {
  2813. warn(`Computed property "${key}" has no getter.`);
  2814. }
  2815. const set = !shared.isFunction(opt) && shared.isFunction(opt.set)
  2816. ? opt.set.bind(publicThis)
  2817. : () => {
  2818. warn(`Write operation failed: computed property "${key}" is readonly.`);
  2819. }
  2820. ;
  2821. const c = computed({
  2822. get,
  2823. set
  2824. });
  2825. Object.defineProperty(ctx, key, {
  2826. enumerable: true,
  2827. configurable: true,
  2828. get: () => c.value,
  2829. set: v => (c.value = v)
  2830. });
  2831. {
  2832. checkDuplicateProperties("Computed" /* COMPUTED */, key);
  2833. }
  2834. }
  2835. }
  2836. if (watchOptions) {
  2837. for (const key in watchOptions) {
  2838. createWatcher(watchOptions[key], ctx, publicThis, key);
  2839. }
  2840. }
  2841. if (provideOptions) {
  2842. const provides = shared.isFunction(provideOptions)
  2843. ? provideOptions.call(publicThis)
  2844. : provideOptions;
  2845. Reflect.ownKeys(provides).forEach(key => {
  2846. provide(key, provides[key]);
  2847. });
  2848. }
  2849. if (created) {
  2850. callHook(created, instance, "c" /* CREATED */);
  2851. }
  2852. function registerLifecycleHook(register, hook) {
  2853. if (shared.isArray(hook)) {
  2854. hook.forEach(_hook => register(_hook.bind(publicThis)));
  2855. }
  2856. else if (hook) {
  2857. register(hook.bind(publicThis));
  2858. }
  2859. }
  2860. registerLifecycleHook(onBeforeMount, beforeMount);
  2861. registerLifecycleHook(onMounted, mounted);
  2862. registerLifecycleHook(onBeforeUpdate, beforeUpdate);
  2863. registerLifecycleHook(onUpdated, updated);
  2864. registerLifecycleHook(onActivated, activated);
  2865. registerLifecycleHook(onDeactivated, deactivated);
  2866. registerLifecycleHook(onErrorCaptured, errorCaptured);
  2867. registerLifecycleHook(onRenderTracked, renderTracked);
  2868. registerLifecycleHook(onRenderTriggered, renderTriggered);
  2869. registerLifecycleHook(onBeforeUnmount, beforeUnmount);
  2870. registerLifecycleHook(onUnmounted, unmounted);
  2871. registerLifecycleHook(onServerPrefetch, serverPrefetch);
  2872. if (shared.isArray(expose)) {
  2873. if (expose.length) {
  2874. const exposed = instance.exposed || (instance.exposed = {});
  2875. expose.forEach(key => {
  2876. Object.defineProperty(exposed, key, {
  2877. get: () => publicThis[key],
  2878. set: val => (publicThis[key] = val)
  2879. });
  2880. });
  2881. }
  2882. else if (!instance.exposed) {
  2883. instance.exposed = {};
  2884. }
  2885. }
  2886. // options that are handled when creating the instance but also need to be
  2887. // applied from mixins
  2888. if (render && instance.render === shared.NOOP) {
  2889. instance.render = render;
  2890. }
  2891. if (inheritAttrs != null) {
  2892. instance.inheritAttrs = inheritAttrs;
  2893. }
  2894. // asset options.
  2895. if (components)
  2896. instance.components = components;
  2897. if (directives)
  2898. instance.directives = directives;
  2899. }
  2900. function resolveInjections(injectOptions, ctx, checkDuplicateProperties = shared.NOOP, unwrapRef = false) {
  2901. if (shared.isArray(injectOptions)) {
  2902. injectOptions = normalizeInject(injectOptions);
  2903. }
  2904. for (const key in injectOptions) {
  2905. const opt = injectOptions[key];
  2906. let injected;
  2907. if (shared.isObject(opt)) {
  2908. if ('default' in opt) {
  2909. injected = inject(opt.from || key, opt.default, true /* treat default function as factory */);
  2910. }
  2911. else {
  2912. injected = inject(opt.from || key);
  2913. }
  2914. }
  2915. else {
  2916. injected = inject(opt);
  2917. }
  2918. if (reactivity.isRef(injected)) {
  2919. // TODO remove the check in 3.3
  2920. if (unwrapRef) {
  2921. Object.defineProperty(ctx, key, {
  2922. enumerable: true,
  2923. configurable: true,
  2924. get: () => injected.value,
  2925. set: v => (injected.value = v)
  2926. });
  2927. }
  2928. else {
  2929. {
  2930. warn(`injected property "${key}" is a ref and will be auto-unwrapped ` +
  2931. `and no longer needs \`.value\` in the next minor release. ` +
  2932. `To opt-in to the new behavior now, ` +
  2933. `set \`app.config.unwrapInjectedRef = true\` (this config is ` +
  2934. `temporary and will not be needed in the future.)`);
  2935. }
  2936. ctx[key] = injected;
  2937. }
  2938. }
  2939. else {
  2940. ctx[key] = injected;
  2941. }
  2942. {
  2943. checkDuplicateProperties("Inject" /* INJECT */, key);
  2944. }
  2945. }
  2946. }
  2947. function callHook(hook, instance, type) {
  2948. callWithAsyncErrorHandling(shared.isArray(hook)
  2949. ? hook.map(h => h.bind(instance.proxy))
  2950. : hook.bind(instance.proxy), instance, type);
  2951. }
  2952. function createWatcher(raw, ctx, publicThis, key) {
  2953. const getter = key.includes('.')
  2954. ? createPathGetter(publicThis, key)
  2955. : () => publicThis[key];
  2956. if (shared.isString(raw)) {
  2957. const handler = ctx[raw];
  2958. if (shared.isFunction(handler)) {
  2959. watch(getter, handler);
  2960. }
  2961. else {
  2962. warn(`Invalid watch handler specified by key "${raw}"`, handler);
  2963. }
  2964. }
  2965. else if (shared.isFunction(raw)) {
  2966. watch(getter, raw.bind(publicThis));
  2967. }
  2968. else if (shared.isObject(raw)) {
  2969. if (shared.isArray(raw)) {
  2970. raw.forEach(r => createWatcher(r, ctx, publicThis, key));
  2971. }
  2972. else {
  2973. const handler = shared.isFunction(raw.handler)
  2974. ? raw.handler.bind(publicThis)
  2975. : ctx[raw.handler];
  2976. if (shared.isFunction(handler)) {
  2977. watch(getter, handler, raw);
  2978. }
  2979. else {
  2980. warn(`Invalid watch handler specified by key "${raw.handler}"`, handler);
  2981. }
  2982. }
  2983. }
  2984. else {
  2985. warn(`Invalid watch option: "${key}"`, raw);
  2986. }
  2987. }
  2988. /**
  2989. * Resolve merged options and cache it on the component.
  2990. * This is done only once per-component since the merging does not involve
  2991. * instances.
  2992. */
  2993. function resolveMergedOptions(instance) {
  2994. const base = instance.type;
  2995. const { mixins, extends: extendsOptions } = base;
  2996. const { mixins: globalMixins, optionsCache: cache, config: { optionMergeStrategies } } = instance.appContext;
  2997. const cached = cache.get(base);
  2998. let resolved;
  2999. if (cached) {
  3000. resolved = cached;
  3001. }
  3002. else if (!globalMixins.length && !mixins && !extendsOptions) {
  3003. {
  3004. resolved = base;
  3005. }
  3006. }
  3007. else {
  3008. resolved = {};
  3009. if (globalMixins.length) {
  3010. globalMixins.forEach(m => mergeOptions(resolved, m, optionMergeStrategies, true));
  3011. }
  3012. mergeOptions(resolved, base, optionMergeStrategies);
  3013. }
  3014. cache.set(base, resolved);
  3015. return resolved;
  3016. }
  3017. function mergeOptions(to, from, strats, asMixin = false) {
  3018. const { mixins, extends: extendsOptions } = from;
  3019. if (extendsOptions) {
  3020. mergeOptions(to, extendsOptions, strats, true);
  3021. }
  3022. if (mixins) {
  3023. mixins.forEach((m) => mergeOptions(to, m, strats, true));
  3024. }
  3025. for (const key in from) {
  3026. if (asMixin && key === 'expose') {
  3027. warn(`"expose" option is ignored when declared in mixins or extends. ` +
  3028. `It should only be declared in the base component itself.`);
  3029. }
  3030. else {
  3031. const strat = internalOptionMergeStrats[key] || (strats && strats[key]);
  3032. to[key] = strat ? strat(to[key], from[key]) : from[key];
  3033. }
  3034. }
  3035. return to;
  3036. }
  3037. const internalOptionMergeStrats = {
  3038. data: mergeDataFn,
  3039. props: mergeObjectOptions,
  3040. emits: mergeObjectOptions,
  3041. // objects
  3042. methods: mergeObjectOptions,
  3043. computed: mergeObjectOptions,
  3044. // lifecycle
  3045. beforeCreate: mergeAsArray,
  3046. created: mergeAsArray,
  3047. beforeMount: mergeAsArray,
  3048. mounted: mergeAsArray,
  3049. beforeUpdate: mergeAsArray,
  3050. updated: mergeAsArray,
  3051. beforeDestroy: mergeAsArray,
  3052. beforeUnmount: mergeAsArray,
  3053. destroyed: mergeAsArray,
  3054. unmounted: mergeAsArray,
  3055. activated: mergeAsArray,
  3056. deactivated: mergeAsArray,
  3057. errorCaptured: mergeAsArray,
  3058. serverPrefetch: mergeAsArray,
  3059. // assets
  3060. components: mergeObjectOptions,
  3061. directives: mergeObjectOptions,
  3062. // watch
  3063. watch: mergeWatchOptions,
  3064. // provide / inject
  3065. provide: mergeDataFn,
  3066. inject: mergeInject
  3067. };
  3068. function mergeDataFn(to, from) {
  3069. if (!from) {
  3070. return to;
  3071. }
  3072. if (!to) {
  3073. return from;
  3074. }
  3075. return function mergedDataFn() {
  3076. return (shared.extend)(shared.isFunction(to) ? to.call(this, this) : to, shared.isFunction(from) ? from.call(this, this) : from);
  3077. };
  3078. }
  3079. function mergeInject(to, from) {
  3080. return mergeObjectOptions(normalizeInject(to), normalizeInject(from));
  3081. }
  3082. function normalizeInject(raw) {
  3083. if (shared.isArray(raw)) {
  3084. const res = {};
  3085. for (let i = 0; i < raw.length; i++) {
  3086. res[raw[i]] = raw[i];
  3087. }
  3088. return res;
  3089. }
  3090. return raw;
  3091. }
  3092. function mergeAsArray(to, from) {
  3093. return to ? [...new Set([].concat(to, from))] : from;
  3094. }
  3095. function mergeObjectOptions(to, from) {
  3096. return to ? shared.extend(shared.extend(Object.create(null), to), from) : from;
  3097. }
  3098. function mergeWatchOptions(to, from) {
  3099. if (!to)
  3100. return from;
  3101. if (!from)
  3102. return to;
  3103. const merged = shared.extend(Object.create(null), to);
  3104. for (const key in from) {
  3105. merged[key] = mergeAsArray(to[key], from[key]);
  3106. }
  3107. return merged;
  3108. }
  3109. function initProps(instance, rawProps, isStateful, // result of bitwise flag comparison
  3110. isSSR = false) {
  3111. const props = {};
  3112. const attrs = {};
  3113. shared.def(attrs, InternalObjectKey, 1);
  3114. instance.propsDefaults = Object.create(null);
  3115. setFullProps(instance, rawProps, props, attrs);
  3116. // ensure all declared prop keys are present
  3117. for (const key in instance.propsOptions[0]) {
  3118. if (!(key in props)) {
  3119. props[key] = undefined;
  3120. }
  3121. }
  3122. // validation
  3123. {
  3124. validateProps(rawProps || {}, props, instance);
  3125. }
  3126. if (isStateful) {
  3127. // stateful
  3128. instance.props = isSSR ? props : reactivity.shallowReactive(props);
  3129. }
  3130. else {
  3131. if (!instance.type.props) {
  3132. // functional w/ optional props, props === attrs
  3133. instance.props = attrs;
  3134. }
  3135. else {
  3136. // functional w/ declared props
  3137. instance.props = props;
  3138. }
  3139. }
  3140. instance.attrs = attrs;
  3141. }
  3142. function updateProps(instance, rawProps, rawPrevProps, optimized) {
  3143. const { props, attrs, vnode: { patchFlag } } = instance;
  3144. const rawCurrentProps = reactivity.toRaw(props);
  3145. const [options] = instance.propsOptions;
  3146. let hasAttrsChanged = false;
  3147. if (
  3148. // always force full diff in dev
  3149. // - #1942 if hmr is enabled with sfc component
  3150. // - vite#872 non-sfc component used by sfc component
  3151. !((instance.type.__hmrId ||
  3152. (instance.parent && instance.parent.type.__hmrId))) &&
  3153. (optimized || patchFlag > 0) &&
  3154. !(patchFlag & 16 /* FULL_PROPS */)) {
  3155. if (patchFlag & 8 /* PROPS */) {
  3156. // Compiler-generated props & no keys change, just set the updated
  3157. // the props.
  3158. const propsToUpdate = instance.vnode.dynamicProps;
  3159. for (let i = 0; i < propsToUpdate.length; i++) {
  3160. let key = propsToUpdate[i];
  3161. // skip if the prop key is a declared emit event listener
  3162. if (isEmitListener(instance.emitsOptions, key)) {
  3163. continue;
  3164. }
  3165. // PROPS flag guarantees rawProps to be non-null
  3166. const value = rawProps[key];
  3167. if (options) {
  3168. // attr / props separation was done on init and will be consistent
  3169. // in this code path, so just check if attrs have it.
  3170. if (shared.hasOwn(attrs, key)) {
  3171. if (value !== attrs[key]) {
  3172. attrs[key] = value;
  3173. hasAttrsChanged = true;
  3174. }
  3175. }
  3176. else {
  3177. const camelizedKey = shared.camelize(key);
  3178. props[camelizedKey] = resolvePropValue(options, rawCurrentProps, camelizedKey, value, instance, false /* isAbsent */);
  3179. }
  3180. }
  3181. else {
  3182. if (value !== attrs[key]) {
  3183. attrs[key] = value;
  3184. hasAttrsChanged = true;
  3185. }
  3186. }
  3187. }
  3188. }
  3189. }
  3190. else {
  3191. // full props update.
  3192. if (setFullProps(instance, rawProps, props, attrs)) {
  3193. hasAttrsChanged = true;
  3194. }
  3195. // in case of dynamic props, check if we need to delete keys from
  3196. // the props object
  3197. let kebabKey;
  3198. for (const key in rawCurrentProps) {
  3199. if (!rawProps ||
  3200. // for camelCase
  3201. (!shared.hasOwn(rawProps, key) &&
  3202. // it's possible the original props was passed in as kebab-case
  3203. // and converted to camelCase (#955)
  3204. ((kebabKey = shared.hyphenate(key)) === key || !shared.hasOwn(rawProps, kebabKey)))) {
  3205. if (options) {
  3206. if (rawPrevProps &&
  3207. // for camelCase
  3208. (rawPrevProps[key] !== undefined ||
  3209. // for kebab-case
  3210. rawPrevProps[kebabKey] !== undefined)) {
  3211. props[key] = resolvePropValue(options, rawCurrentProps, key, undefined, instance, true /* isAbsent */);
  3212. }
  3213. }
  3214. else {
  3215. delete props[key];
  3216. }
  3217. }
  3218. }
  3219. // in the case of functional component w/o props declaration, props and
  3220. // attrs point to the same object so it should already have been updated.
  3221. if (attrs !== rawCurrentProps) {
  3222. for (const key in attrs) {
  3223. if (!rawProps ||
  3224. (!shared.hasOwn(rawProps, key) &&
  3225. (!false ))) {
  3226. delete attrs[key];
  3227. hasAttrsChanged = true;
  3228. }
  3229. }
  3230. }
  3231. }
  3232. // trigger updates for $attrs in case it's used in component slots
  3233. if (hasAttrsChanged) {
  3234. reactivity.trigger(instance, "set" /* SET */, '$attrs');
  3235. }
  3236. {
  3237. validateProps(rawProps || {}, props, instance);
  3238. }
  3239. }
  3240. function setFullProps(instance, rawProps, props, attrs) {
  3241. const [options, needCastKeys] = instance.propsOptions;
  3242. let hasAttrsChanged = false;
  3243. let rawCastValues;
  3244. if (rawProps) {
  3245. for (let key in rawProps) {
  3246. // key, ref are reserved and never passed down
  3247. if (shared.isReservedProp(key)) {
  3248. continue;
  3249. }
  3250. const value = rawProps[key];
  3251. // prop option names are camelized during normalization, so to support
  3252. // kebab -> camel conversion here we need to camelize the key.
  3253. let camelKey;
  3254. if (options && shared.hasOwn(options, (camelKey = shared.camelize(key)))) {
  3255. if (!needCastKeys || !needCastKeys.includes(camelKey)) {
  3256. props[camelKey] = value;
  3257. }
  3258. else {
  3259. (rawCastValues || (rawCastValues = {}))[camelKey] = value;
  3260. }
  3261. }
  3262. else if (!isEmitListener(instance.emitsOptions, key)) {
  3263. if (!(key in attrs) || value !== attrs[key]) {
  3264. attrs[key] = value;
  3265. hasAttrsChanged = true;
  3266. }
  3267. }
  3268. }
  3269. }
  3270. if (needCastKeys) {
  3271. const rawCurrentProps = reactivity.toRaw(props);
  3272. const castValues = rawCastValues || shared.EMPTY_OBJ;
  3273. for (let i = 0; i < needCastKeys.length; i++) {
  3274. const key = needCastKeys[i];
  3275. props[key] = resolvePropValue(options, rawCurrentProps, key, castValues[key], instance, !shared.hasOwn(castValues, key));
  3276. }
  3277. }
  3278. return hasAttrsChanged;
  3279. }
  3280. function resolvePropValue(options, props, key, value, instance, isAbsent) {
  3281. const opt = options[key];
  3282. if (opt != null) {
  3283. const hasDefault = shared.hasOwn(opt, 'default');
  3284. // default values
  3285. if (hasDefault && value === undefined) {
  3286. const defaultValue = opt.default;
  3287. if (opt.type !== Function && shared.isFunction(defaultValue)) {
  3288. const { propsDefaults } = instance;
  3289. if (key in propsDefaults) {
  3290. value = propsDefaults[key];
  3291. }
  3292. else {
  3293. setCurrentInstance(instance);
  3294. value = propsDefaults[key] = defaultValue.call(null, props);
  3295. unsetCurrentInstance();
  3296. }
  3297. }
  3298. else {
  3299. value = defaultValue;
  3300. }
  3301. }
  3302. // boolean casting
  3303. if (opt[0 /* shouldCast */]) {
  3304. if (isAbsent && !hasDefault) {
  3305. value = false;
  3306. }
  3307. else if (opt[1 /* shouldCastTrue */] &&
  3308. (value === '' || value === shared.hyphenate(key))) {
  3309. value = true;
  3310. }
  3311. }
  3312. }
  3313. return value;
  3314. }
  3315. function normalizePropsOptions(comp, appContext, asMixin = false) {
  3316. const cache = appContext.propsCache;
  3317. const cached = cache.get(comp);
  3318. if (cached) {
  3319. return cached;
  3320. }
  3321. const raw = comp.props;
  3322. const normalized = {};
  3323. const needCastKeys = [];
  3324. // apply mixin/extends props
  3325. let hasExtends = false;
  3326. if (!shared.isFunction(comp)) {
  3327. const extendProps = (raw) => {
  3328. hasExtends = true;
  3329. const [props, keys] = normalizePropsOptions(raw, appContext, true);
  3330. shared.extend(normalized, props);
  3331. if (keys)
  3332. needCastKeys.push(...keys);
  3333. };
  3334. if (!asMixin && appContext.mixins.length) {
  3335. appContext.mixins.forEach(extendProps);
  3336. }
  3337. if (comp.extends) {
  3338. extendProps(comp.extends);
  3339. }
  3340. if (comp.mixins) {
  3341. comp.mixins.forEach(extendProps);
  3342. }
  3343. }
  3344. if (!raw && !hasExtends) {
  3345. cache.set(comp, shared.EMPTY_ARR);
  3346. return shared.EMPTY_ARR;
  3347. }
  3348. if (shared.isArray(raw)) {
  3349. for (let i = 0; i < raw.length; i++) {
  3350. if (!shared.isString(raw[i])) {
  3351. warn(`props must be strings when using array syntax.`, raw[i]);
  3352. }
  3353. const normalizedKey = shared.camelize(raw[i]);
  3354. if (validatePropName(normalizedKey)) {
  3355. normalized[normalizedKey] = shared.EMPTY_OBJ;
  3356. }
  3357. }
  3358. }
  3359. else if (raw) {
  3360. if (!shared.isObject(raw)) {
  3361. warn(`invalid props options`, raw);
  3362. }
  3363. for (const key in raw) {
  3364. const normalizedKey = shared.camelize(key);
  3365. if (validatePropName(normalizedKey)) {
  3366. const opt = raw[key];
  3367. const prop = (normalized[normalizedKey] =
  3368. shared.isArray(opt) || shared.isFunction(opt) ? { type: opt } : opt);
  3369. if (prop) {
  3370. const booleanIndex = getTypeIndex(Boolean, prop.type);
  3371. const stringIndex = getTypeIndex(String, prop.type);
  3372. prop[0 /* shouldCast */] = booleanIndex > -1;
  3373. prop[1 /* shouldCastTrue */] =
  3374. stringIndex < 0 || booleanIndex < stringIndex;
  3375. // if the prop needs boolean casting or default value
  3376. if (booleanIndex > -1 || shared.hasOwn(prop, 'default')) {
  3377. needCastKeys.push(normalizedKey);
  3378. }
  3379. }
  3380. }
  3381. }
  3382. }
  3383. const res = [normalized, needCastKeys];
  3384. cache.set(comp, res);
  3385. return res;
  3386. }
  3387. function validatePropName(key) {
  3388. if (key[0] !== '$') {
  3389. return true;
  3390. }
  3391. else {
  3392. warn(`Invalid prop name: "${key}" is a reserved property.`);
  3393. }
  3394. return false;
  3395. }
  3396. // use function string name to check type constructors
  3397. // so that it works across vms / iframes.
  3398. function getType(ctor) {
  3399. const match = ctor && ctor.toString().match(/^\s*function (\w+)/);
  3400. return match ? match[1] : ctor === null ? 'null' : '';
  3401. }
  3402. function isSameType(a, b) {
  3403. return getType(a) === getType(b);
  3404. }
  3405. function getTypeIndex(type, expectedTypes) {
  3406. if (shared.isArray(expectedTypes)) {
  3407. return expectedTypes.findIndex(t => isSameType(t, type));
  3408. }
  3409. else if (shared.isFunction(expectedTypes)) {
  3410. return isSameType(expectedTypes, type) ? 0 : -1;
  3411. }
  3412. return -1;
  3413. }
  3414. /**
  3415. * dev only
  3416. */
  3417. function validateProps(rawProps, props, instance) {
  3418. const resolvedValues = reactivity.toRaw(props);
  3419. const options = instance.propsOptions[0];
  3420. for (const key in options) {
  3421. let opt = options[key];
  3422. if (opt == null)
  3423. continue;
  3424. validateProp(key, resolvedValues[key], opt, !shared.hasOwn(rawProps, key) && !shared.hasOwn(rawProps, shared.hyphenate(key)));
  3425. }
  3426. }
  3427. /**
  3428. * dev only
  3429. */
  3430. function validateProp(name, value, prop, isAbsent) {
  3431. const { type, required, validator } = prop;
  3432. // required!
  3433. if (required && isAbsent) {
  3434. warn('Missing required prop: "' + name + '"');
  3435. return;
  3436. }
  3437. // missing but optional
  3438. if (value == null && !prop.required) {
  3439. return;
  3440. }
  3441. // type check
  3442. if (type != null && type !== true) {
  3443. let isValid = false;
  3444. const types = shared.isArray(type) ? type : [type];
  3445. const expectedTypes = [];
  3446. // value is valid as long as one of the specified types match
  3447. for (let i = 0; i < types.length && !isValid; i++) {
  3448. const { valid, expectedType } = assertType(value, types[i]);
  3449. expectedTypes.push(expectedType || '');
  3450. isValid = valid;
  3451. }
  3452. if (!isValid) {
  3453. warn(getInvalidTypeMessage(name, value, expectedTypes));
  3454. return;
  3455. }
  3456. }
  3457. // custom validator
  3458. if (validator && !validator(value)) {
  3459. warn('Invalid prop: custom validator check failed for prop "' + name + '".');
  3460. }
  3461. }
  3462. const isSimpleType = /*#__PURE__*/ shared.makeMap('String,Number,Boolean,Function,Symbol,BigInt');
  3463. /**
  3464. * dev only
  3465. */
  3466. function assertType(value, type) {
  3467. let valid;
  3468. const expectedType = getType(type);
  3469. if (isSimpleType(expectedType)) {
  3470. const t = typeof value;
  3471. valid = t === expectedType.toLowerCase();
  3472. // for primitive wrapper objects
  3473. if (!valid && t === 'object') {
  3474. valid = value instanceof type;
  3475. }
  3476. }
  3477. else if (expectedType === 'Object') {
  3478. valid = shared.isObject(value);
  3479. }
  3480. else if (expectedType === 'Array') {
  3481. valid = shared.isArray(value);
  3482. }
  3483. else if (expectedType === 'null') {
  3484. valid = value === null;
  3485. }
  3486. else {
  3487. valid = value instanceof type;
  3488. }
  3489. return {
  3490. valid,
  3491. expectedType
  3492. };
  3493. }
  3494. /**
  3495. * dev only
  3496. */
  3497. function getInvalidTypeMessage(name, value, expectedTypes) {
  3498. let message = `Invalid prop: type check failed for prop "${name}".` +
  3499. ` Expected ${expectedTypes.map(shared.capitalize).join(' | ')}`;
  3500. const expectedType = expectedTypes[0];
  3501. const receivedType = shared.toRawType(value);
  3502. const expectedValue = styleValue(value, expectedType);
  3503. const receivedValue = styleValue(value, receivedType);
  3504. // check if we need to specify expected value
  3505. if (expectedTypes.length === 1 &&
  3506. isExplicable(expectedType) &&
  3507. !isBoolean(expectedType, receivedType)) {
  3508. message += ` with value ${expectedValue}`;
  3509. }
  3510. message += `, got ${receivedType} `;
  3511. // check if we need to specify received value
  3512. if (isExplicable(receivedType)) {
  3513. message += `with value ${receivedValue}.`;
  3514. }
  3515. return message;
  3516. }
  3517. /**
  3518. * dev only
  3519. */
  3520. function styleValue(value, type) {
  3521. if (type === 'String') {
  3522. return `"${value}"`;
  3523. }
  3524. else if (type === 'Number') {
  3525. return `${Number(value)}`;
  3526. }
  3527. else {
  3528. return `${value}`;
  3529. }
  3530. }
  3531. /**
  3532. * dev only
  3533. */
  3534. function isExplicable(type) {
  3535. const explicitTypes = ['string', 'number', 'boolean'];
  3536. return explicitTypes.some(elem => type.toLowerCase() === elem);
  3537. }
  3538. /**
  3539. * dev only
  3540. */
  3541. function isBoolean(...args) {
  3542. return args.some(elem => elem.toLowerCase() === 'boolean');
  3543. }
  3544. const isInternalKey = (key) => key[0] === '_' || key === '$stable';
  3545. const normalizeSlotValue = (value) => shared.isArray(value)
  3546. ? value.map(normalizeVNode)
  3547. : [normalizeVNode(value)];
  3548. const normalizeSlot = (key, rawSlot, ctx) => {
  3549. const normalized = withCtx((...args) => {
  3550. if (currentInstance) {
  3551. warn(`Slot "${key}" invoked outside of the render function: ` +
  3552. `this will not track dependencies used in the slot. ` +
  3553. `Invoke the slot function inside the render function instead.`);
  3554. }
  3555. return normalizeSlotValue(rawSlot(...args));
  3556. }, ctx);
  3557. normalized._c = false;
  3558. return normalized;
  3559. };
  3560. const normalizeObjectSlots = (rawSlots, slots, instance) => {
  3561. const ctx = rawSlots._ctx;
  3562. for (const key in rawSlots) {
  3563. if (isInternalKey(key))
  3564. continue;
  3565. const value = rawSlots[key];
  3566. if (shared.isFunction(value)) {
  3567. slots[key] = normalizeSlot(key, value, ctx);
  3568. }
  3569. else if (value != null) {
  3570. {
  3571. warn(`Non-function value encountered for slot "${key}". ` +
  3572. `Prefer function slots for better performance.`);
  3573. }
  3574. const normalized = normalizeSlotValue(value);
  3575. slots[key] = () => normalized;
  3576. }
  3577. }
  3578. };
  3579. const normalizeVNodeSlots = (instance, children) => {
  3580. if (!isKeepAlive(instance.vnode) &&
  3581. !(false )) {
  3582. warn(`Non-function value encountered for default slot. ` +
  3583. `Prefer function slots for better performance.`);
  3584. }
  3585. const normalized = normalizeSlotValue(children);
  3586. instance.slots.default = () => normalized;
  3587. };
  3588. const initSlots = (instance, children) => {
  3589. if (instance.vnode.shapeFlag & 32 /* SLOTS_CHILDREN */) {
  3590. const type = children._;
  3591. if (type) {
  3592. // users can get the shallow readonly version of the slots object through `this.$slots`,
  3593. // we should avoid the proxy object polluting the slots of the internal instance
  3594. instance.slots = reactivity.toRaw(children);
  3595. // make compiler marker non-enumerable
  3596. shared.def(children, '_', type);
  3597. }
  3598. else {
  3599. normalizeObjectSlots(children, (instance.slots = {}));
  3600. }
  3601. }
  3602. else {
  3603. instance.slots = {};
  3604. if (children) {
  3605. normalizeVNodeSlots(instance, children);
  3606. }
  3607. }
  3608. shared.def(instance.slots, InternalObjectKey, 1);
  3609. };
  3610. const updateSlots = (instance, children, optimized) => {
  3611. const { vnode, slots } = instance;
  3612. let needDeletionCheck = true;
  3613. let deletionComparisonTarget = shared.EMPTY_OBJ;
  3614. if (vnode.shapeFlag & 32 /* SLOTS_CHILDREN */) {
  3615. const type = children._;
  3616. if (type) {
  3617. // compiled slots.
  3618. if (isHmrUpdating) {
  3619. // Parent was HMR updated so slot content may have changed.
  3620. // force update slots and mark instance for hmr as well
  3621. shared.extend(slots, children);
  3622. }
  3623. else if (optimized && type === 1 /* STABLE */) {
  3624. // compiled AND stable.
  3625. // no need to update, and skip stale slots removal.
  3626. needDeletionCheck = false;
  3627. }
  3628. else {
  3629. // compiled but dynamic (v-if/v-for on slots) - update slots, but skip
  3630. // normalization.
  3631. shared.extend(slots, children);
  3632. // #2893
  3633. // when rendering the optimized slots by manually written render function,
  3634. // we need to delete the `slots._` flag if necessary to make subsequent updates reliable,
  3635. // i.e. let the `renderSlot` create the bailed Fragment
  3636. if (!optimized && type === 1 /* STABLE */) {
  3637. delete slots._;
  3638. }
  3639. }
  3640. }
  3641. else {
  3642. needDeletionCheck = !children.$stable;
  3643. normalizeObjectSlots(children, slots);
  3644. }
  3645. deletionComparisonTarget = children;
  3646. }
  3647. else if (children) {
  3648. // non slot object children (direct value) passed to a component
  3649. normalizeVNodeSlots(instance, children);
  3650. deletionComparisonTarget = { default: 1 };
  3651. }
  3652. // delete stale slots
  3653. if (needDeletionCheck) {
  3654. for (const key in slots) {
  3655. if (!isInternalKey(key) && !(key in deletionComparisonTarget)) {
  3656. delete slots[key];
  3657. }
  3658. }
  3659. }
  3660. };
  3661. /**
  3662. Runtime helper for applying directives to a vnode. Example usage:
  3663. const comp = resolveComponent('comp')
  3664. const foo = resolveDirective('foo')
  3665. const bar = resolveDirective('bar')
  3666. return withDirectives(h(comp), [
  3667. [foo, this.x],
  3668. [bar, this.y]
  3669. ])
  3670. */
  3671. function validateDirectiveName(name) {
  3672. if (shared.isBuiltInDirective(name)) {
  3673. warn('Do not use built-in directive ids as custom directive id: ' + name);
  3674. }
  3675. }
  3676. /**
  3677. * Adds directives to a VNode.
  3678. */
  3679. function withDirectives(vnode, directives) {
  3680. const internalInstance = currentRenderingInstance;
  3681. if (internalInstance === null) {
  3682. warn(`withDirectives can only be used inside render functions.`);
  3683. return vnode;
  3684. }
  3685. const instance = getExposeProxy(internalInstance) ||
  3686. internalInstance.proxy;
  3687. const bindings = vnode.dirs || (vnode.dirs = []);
  3688. for (let i = 0; i < directives.length; i++) {
  3689. let [dir, value, arg, modifiers = shared.EMPTY_OBJ] = directives[i];
  3690. if (shared.isFunction(dir)) {
  3691. dir = {
  3692. mounted: dir,
  3693. updated: dir
  3694. };
  3695. }
  3696. if (dir.deep) {
  3697. traverse(value);
  3698. }
  3699. bindings.push({
  3700. dir,
  3701. instance,
  3702. value,
  3703. oldValue: void 0,
  3704. arg,
  3705. modifiers
  3706. });
  3707. }
  3708. return vnode;
  3709. }
  3710. function invokeDirectiveHook(vnode, prevVNode, instance, name) {
  3711. const bindings = vnode.dirs;
  3712. const oldBindings = prevVNode && prevVNode.dirs;
  3713. for (let i = 0; i < bindings.length; i++) {
  3714. const binding = bindings[i];
  3715. if (oldBindings) {
  3716. binding.oldValue = oldBindings[i].value;
  3717. }
  3718. let hook = binding.dir[name];
  3719. if (hook) {
  3720. // disable tracking inside all lifecycle hooks
  3721. // since they can potentially be called inside effects.
  3722. reactivity.pauseTracking();
  3723. callWithAsyncErrorHandling(hook, instance, 8 /* DIRECTIVE_HOOK */, [
  3724. vnode.el,
  3725. binding,
  3726. vnode,
  3727. prevVNode
  3728. ]);
  3729. reactivity.resetTracking();
  3730. }
  3731. }
  3732. }
  3733. function createAppContext() {
  3734. return {
  3735. app: null,
  3736. config: {
  3737. isNativeTag: shared.NO,
  3738. performance: false,
  3739. globalProperties: {},
  3740. optionMergeStrategies: {},
  3741. errorHandler: undefined,
  3742. warnHandler: undefined,
  3743. compilerOptions: {}
  3744. },
  3745. mixins: [],
  3746. components: {},
  3747. directives: {},
  3748. provides: Object.create(null),
  3749. optionsCache: new WeakMap(),
  3750. propsCache: new WeakMap(),
  3751. emitsCache: new WeakMap()
  3752. };
  3753. }
  3754. let uid = 0;
  3755. function createAppAPI(render, hydrate) {
  3756. return function createApp(rootComponent, rootProps = null) {
  3757. if (!shared.isFunction(rootComponent)) {
  3758. rootComponent = Object.assign({}, rootComponent);
  3759. }
  3760. if (rootProps != null && !shared.isObject(rootProps)) {
  3761. warn(`root props passed to app.mount() must be an object.`);
  3762. rootProps = null;
  3763. }
  3764. const context = createAppContext();
  3765. const installedPlugins = new Set();
  3766. let isMounted = false;
  3767. const app = (context.app = {
  3768. _uid: uid++,
  3769. _component: rootComponent,
  3770. _props: rootProps,
  3771. _container: null,
  3772. _context: context,
  3773. _instance: null,
  3774. version,
  3775. get config() {
  3776. return context.config;
  3777. },
  3778. set config(v) {
  3779. {
  3780. warn(`app.config cannot be replaced. Modify individual options instead.`);
  3781. }
  3782. },
  3783. use(plugin, ...options) {
  3784. if (installedPlugins.has(plugin)) {
  3785. warn(`Plugin has already been applied to target app.`);
  3786. }
  3787. else if (plugin && shared.isFunction(plugin.install)) {
  3788. installedPlugins.add(plugin);
  3789. plugin.install(app, ...options);
  3790. }
  3791. else if (shared.isFunction(plugin)) {
  3792. installedPlugins.add(plugin);
  3793. plugin(app, ...options);
  3794. }
  3795. else {
  3796. warn(`A plugin must either be a function or an object with an "install" ` +
  3797. `function.`);
  3798. }
  3799. return app;
  3800. },
  3801. mixin(mixin) {
  3802. {
  3803. if (!context.mixins.includes(mixin)) {
  3804. context.mixins.push(mixin);
  3805. }
  3806. else {
  3807. warn('Mixin has already been applied to target app' +
  3808. (mixin.name ? `: ${mixin.name}` : ''));
  3809. }
  3810. }
  3811. return app;
  3812. },
  3813. component(name, component) {
  3814. {
  3815. validateComponentName(name, context.config);
  3816. }
  3817. if (!component) {
  3818. return context.components[name];
  3819. }
  3820. if (context.components[name]) {
  3821. warn(`Component "${name}" has already been registered in target app.`);
  3822. }
  3823. context.components[name] = component;
  3824. return app;
  3825. },
  3826. directive(name, directive) {
  3827. {
  3828. validateDirectiveName(name);
  3829. }
  3830. if (!directive) {
  3831. return context.directives[name];
  3832. }
  3833. if (context.directives[name]) {
  3834. warn(`Directive "${name}" has already been registered in target app.`);
  3835. }
  3836. context.directives[name] = directive;
  3837. return app;
  3838. },
  3839. mount(rootContainer, isHydrate, isSVG) {
  3840. if (!isMounted) {
  3841. const vnode = createVNode(rootComponent, rootProps);
  3842. // store app context on the root VNode.
  3843. // this will be set on the root instance on initial mount.
  3844. vnode.appContext = context;
  3845. // HMR root reload
  3846. {
  3847. context.reload = () => {
  3848. render(cloneVNode(vnode), rootContainer, isSVG);
  3849. };
  3850. }
  3851. if (isHydrate && hydrate) {
  3852. hydrate(vnode, rootContainer);
  3853. }
  3854. else {
  3855. render(vnode, rootContainer, isSVG);
  3856. }
  3857. isMounted = true;
  3858. app._container = rootContainer;
  3859. rootContainer.__vue_app__ = app;
  3860. {
  3861. app._instance = vnode.component;
  3862. devtoolsInitApp(app, version);
  3863. }
  3864. return getExposeProxy(vnode.component) || vnode.component.proxy;
  3865. }
  3866. else {
  3867. warn(`App has already been mounted.\n` +
  3868. `If you want to remount the same app, move your app creation logic ` +
  3869. `into a factory function and create fresh app instances for each ` +
  3870. `mount - e.g. \`const createMyApp = () => createApp(App)\``);
  3871. }
  3872. },
  3873. unmount() {
  3874. if (isMounted) {
  3875. render(null, app._container);
  3876. {
  3877. app._instance = null;
  3878. devtoolsUnmountApp(app);
  3879. }
  3880. delete app._container.__vue_app__;
  3881. }
  3882. else {
  3883. warn(`Cannot unmount an app that is not mounted.`);
  3884. }
  3885. },
  3886. provide(key, value) {
  3887. if (key in context.provides) {
  3888. warn(`App already provides property with key "${String(key)}". ` +
  3889. `It will be overwritten with the new value.`);
  3890. }
  3891. // TypeScript doesn't allow symbols as index type
  3892. // https://github.com/Microsoft/TypeScript/issues/24587
  3893. context.provides[key] = value;
  3894. return app;
  3895. }
  3896. });
  3897. return app;
  3898. };
  3899. }
  3900. /**
  3901. * Function for handling a template ref
  3902. */
  3903. function setRef(rawRef, oldRawRef, parentSuspense, vnode, isUnmount = false) {
  3904. if (shared.isArray(rawRef)) {
  3905. rawRef.forEach((r, i) => setRef(r, oldRawRef && (shared.isArray(oldRawRef) ? oldRawRef[i] : oldRawRef), parentSuspense, vnode, isUnmount));
  3906. return;
  3907. }
  3908. if (isAsyncWrapper(vnode) && !isUnmount) {
  3909. // when mounting async components, nothing needs to be done,
  3910. // because the template ref is forwarded to inner component
  3911. return;
  3912. }
  3913. const refValue = vnode.shapeFlag & 4 /* STATEFUL_COMPONENT */
  3914. ? getExposeProxy(vnode.component) || vnode.component.proxy
  3915. : vnode.el;
  3916. const value = isUnmount ? null : refValue;
  3917. const { i: owner, r: ref } = rawRef;
  3918. if (!owner) {
  3919. warn(`Missing ref owner context. ref cannot be used on hoisted vnodes. ` +
  3920. `A vnode with ref must be created inside the render function.`);
  3921. return;
  3922. }
  3923. const oldRef = oldRawRef && oldRawRef.r;
  3924. const refs = owner.refs === shared.EMPTY_OBJ ? (owner.refs = {}) : owner.refs;
  3925. const setupState = owner.setupState;
  3926. // dynamic ref changed. unset old ref
  3927. if (oldRef != null && oldRef !== ref) {
  3928. if (shared.isString(oldRef)) {
  3929. refs[oldRef] = null;
  3930. if (shared.hasOwn(setupState, oldRef)) {
  3931. setupState[oldRef] = null;
  3932. }
  3933. }
  3934. else if (reactivity.isRef(oldRef)) {
  3935. oldRef.value = null;
  3936. }
  3937. }
  3938. if (shared.isFunction(ref)) {
  3939. callWithErrorHandling(ref, owner, 12 /* FUNCTION_REF */, [value, refs]);
  3940. }
  3941. else {
  3942. const _isString = shared.isString(ref);
  3943. const _isRef = reactivity.isRef(ref);
  3944. if (_isString || _isRef) {
  3945. const doSet = () => {
  3946. if (rawRef.f) {
  3947. const existing = _isString ? refs[ref] : ref.value;
  3948. if (isUnmount) {
  3949. shared.isArray(existing) && shared.remove(existing, refValue);
  3950. }
  3951. else {
  3952. if (!shared.isArray(existing)) {
  3953. if (_isString) {
  3954. refs[ref] = [refValue];
  3955. if (shared.hasOwn(setupState, ref)) {
  3956. setupState[ref] = refs[ref];
  3957. }
  3958. }
  3959. else {
  3960. ref.value = [refValue];
  3961. if (rawRef.k)
  3962. refs[rawRef.k] = ref.value;
  3963. }
  3964. }
  3965. else if (!existing.includes(refValue)) {
  3966. existing.push(refValue);
  3967. }
  3968. }
  3969. }
  3970. else if (_isString) {
  3971. refs[ref] = value;
  3972. if (shared.hasOwn(setupState, ref)) {
  3973. setupState[ref] = value;
  3974. }
  3975. }
  3976. else if (reactivity.isRef(ref)) {
  3977. ref.value = value;
  3978. if (rawRef.k)
  3979. refs[rawRef.k] = value;
  3980. }
  3981. else {
  3982. warn('Invalid template ref type:', ref, `(${typeof ref})`);
  3983. }
  3984. };
  3985. if (value) {
  3986. doSet.id = -1;
  3987. queuePostRenderEffect(doSet, parentSuspense);
  3988. }
  3989. else {
  3990. doSet();
  3991. }
  3992. }
  3993. else {
  3994. warn('Invalid template ref type:', ref, `(${typeof ref})`);
  3995. }
  3996. }
  3997. }
  3998. let hasMismatch = false;
  3999. const isSVGContainer = (container) => /svg/.test(container.namespaceURI) && container.tagName !== 'foreignObject';
  4000. const isComment = (node) => node.nodeType === 8 /* COMMENT */;
  4001. // Note: hydration is DOM-specific
  4002. // But we have to place it in core due to tight coupling with core - splitting
  4003. // it out creates a ton of unnecessary complexity.
  4004. // Hydration also depends on some renderer internal logic which needs to be
  4005. // passed in via arguments.
  4006. function createHydrationFunctions(rendererInternals) {
  4007. const { mt: mountComponent, p: patch, o: { patchProp, nextSibling, parentNode, remove, insert, createComment } } = rendererInternals;
  4008. const hydrate = (vnode, container) => {
  4009. if (!container.hasChildNodes()) {
  4010. warn(`Attempting to hydrate existing markup but container is empty. ` +
  4011. `Performing full mount instead.`);
  4012. patch(null, vnode, container);
  4013. flushPostFlushCbs();
  4014. return;
  4015. }
  4016. hasMismatch = false;
  4017. hydrateNode(container.firstChild, vnode, null, null, null);
  4018. flushPostFlushCbs();
  4019. if (hasMismatch && !false) {
  4020. // this error should show up in production
  4021. console.error(`Hydration completed but contains mismatches.`);
  4022. }
  4023. };
  4024. const hydrateNode = (node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized = false) => {
  4025. const isFragmentStart = isComment(node) && node.data === '[';
  4026. const onMismatch = () => handleMismatch(node, vnode, parentComponent, parentSuspense, slotScopeIds, isFragmentStart);
  4027. const { type, ref, shapeFlag } = vnode;
  4028. const domType = node.nodeType;
  4029. vnode.el = node;
  4030. let nextNode = null;
  4031. switch (type) {
  4032. case Text:
  4033. if (domType !== 3 /* TEXT */) {
  4034. nextNode = onMismatch();
  4035. }
  4036. else {
  4037. if (node.data !== vnode.children) {
  4038. hasMismatch = true;
  4039. warn(`Hydration text mismatch:` +
  4040. `\n- Client: ${JSON.stringify(node.data)}` +
  4041. `\n- Server: ${JSON.stringify(vnode.children)}`);
  4042. node.data = vnode.children;
  4043. }
  4044. nextNode = nextSibling(node);
  4045. }
  4046. break;
  4047. case Comment:
  4048. if (domType !== 8 /* COMMENT */ || isFragmentStart) {
  4049. nextNode = onMismatch();
  4050. }
  4051. else {
  4052. nextNode = nextSibling(node);
  4053. }
  4054. break;
  4055. case Static:
  4056. if (domType !== 1 /* ELEMENT */) {
  4057. nextNode = onMismatch();
  4058. }
  4059. else {
  4060. // determine anchor, adopt content
  4061. nextNode = node;
  4062. // if the static vnode has its content stripped during build,
  4063. // adopt it from the server-rendered HTML.
  4064. const needToAdoptContent = !vnode.children.length;
  4065. for (let i = 0; i < vnode.staticCount; i++) {
  4066. if (needToAdoptContent)
  4067. vnode.children += nextNode.outerHTML;
  4068. if (i === vnode.staticCount - 1) {
  4069. vnode.anchor = nextNode;
  4070. }
  4071. nextNode = nextSibling(nextNode);
  4072. }
  4073. return nextNode;
  4074. }
  4075. break;
  4076. case Fragment:
  4077. if (!isFragmentStart) {
  4078. nextNode = onMismatch();
  4079. }
  4080. else {
  4081. nextNode = hydrateFragment(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized);
  4082. }
  4083. break;
  4084. default:
  4085. if (shapeFlag & 1 /* ELEMENT */) {
  4086. if (domType !== 1 /* ELEMENT */ ||
  4087. vnode.type.toLowerCase() !==
  4088. node.tagName.toLowerCase()) {
  4089. nextNode = onMismatch();
  4090. }
  4091. else {
  4092. nextNode = hydrateElement(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized);
  4093. }
  4094. }
  4095. else if (shapeFlag & 6 /* COMPONENT */) {
  4096. // when setting up the render effect, if the initial vnode already
  4097. // has .el set, the component will perform hydration instead of mount
  4098. // on its sub-tree.
  4099. vnode.slotScopeIds = slotScopeIds;
  4100. const container = parentNode(node);
  4101. mountComponent(vnode, container, null, parentComponent, parentSuspense, isSVGContainer(container), optimized);
  4102. // component may be async, so in the case of fragments we cannot rely
  4103. // on component's rendered output to determine the end of the fragment
  4104. // instead, we do a lookahead to find the end anchor node.
  4105. nextNode = isFragmentStart
  4106. ? locateClosingAsyncAnchor(node)
  4107. : nextSibling(node);
  4108. // #3787
  4109. // if component is async, it may get moved / unmounted before its
  4110. // inner component is loaded, so we need to give it a placeholder
  4111. // vnode that matches its adopted DOM.
  4112. if (isAsyncWrapper(vnode)) {
  4113. let subTree;
  4114. if (isFragmentStart) {
  4115. subTree = createVNode(Fragment);
  4116. subTree.anchor = nextNode
  4117. ? nextNode.previousSibling
  4118. : container.lastChild;
  4119. }
  4120. else {
  4121. subTree =
  4122. node.nodeType === 3 ? createTextVNode('') : createVNode('div');
  4123. }
  4124. subTree.el = node;
  4125. vnode.component.subTree = subTree;
  4126. }
  4127. }
  4128. else if (shapeFlag & 64 /* TELEPORT */) {
  4129. if (domType !== 8 /* COMMENT */) {
  4130. nextNode = onMismatch();
  4131. }
  4132. else {
  4133. nextNode = vnode.type.hydrate(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized, rendererInternals, hydrateChildren);
  4134. }
  4135. }
  4136. else if (shapeFlag & 128 /* SUSPENSE */) {
  4137. nextNode = vnode.type.hydrate(node, vnode, parentComponent, parentSuspense, isSVGContainer(parentNode(node)), slotScopeIds, optimized, rendererInternals, hydrateNode);
  4138. }
  4139. else {
  4140. warn('Invalid HostVNode type:', type, `(${typeof type})`);
  4141. }
  4142. }
  4143. if (ref != null) {
  4144. setRef(ref, null, parentSuspense, vnode);
  4145. }
  4146. return nextNode;
  4147. };
  4148. const hydrateElement = (el, vnode, parentComponent, parentSuspense, slotScopeIds, optimized) => {
  4149. optimized = optimized || !!vnode.dynamicChildren;
  4150. const { type, props, patchFlag, shapeFlag, dirs } = vnode;
  4151. // #4006 for form elements with non-string v-model value bindings
  4152. // e.g. <option :value="obj">, <input type="checkbox" :true-value="1">
  4153. const forcePatchValue = (type === 'input' && dirs) || type === 'option';
  4154. // skip props & children if this is hoisted static nodes
  4155. // #5405 in dev, always hydrate children for HMR
  4156. {
  4157. if (dirs) {
  4158. invokeDirectiveHook(vnode, null, parentComponent, 'created');
  4159. }
  4160. // props
  4161. if (props) {
  4162. if (forcePatchValue ||
  4163. !optimized ||
  4164. patchFlag & (16 /* FULL_PROPS */ | 32 /* HYDRATE_EVENTS */)) {
  4165. for (const key in props) {
  4166. if ((forcePatchValue && key.endsWith('value')) ||
  4167. (shared.isOn(key) && !shared.isReservedProp(key))) {
  4168. patchProp(el, key, null, props[key], false, undefined, parentComponent);
  4169. }
  4170. }
  4171. }
  4172. else if (props.onClick) {
  4173. // Fast path for click listeners (which is most often) to avoid
  4174. // iterating through props.
  4175. patchProp(el, 'onClick', null, props.onClick, false, undefined, parentComponent);
  4176. }
  4177. }
  4178. // vnode / directive hooks
  4179. let vnodeHooks;
  4180. if ((vnodeHooks = props && props.onVnodeBeforeMount)) {
  4181. invokeVNodeHook(vnodeHooks, parentComponent, vnode);
  4182. }
  4183. if (dirs) {
  4184. invokeDirectiveHook(vnode, null, parentComponent, 'beforeMount');
  4185. }
  4186. if ((vnodeHooks = props && props.onVnodeMounted) || dirs) {
  4187. queueEffectWithSuspense(() => {
  4188. vnodeHooks && invokeVNodeHook(vnodeHooks, parentComponent, vnode);
  4189. dirs && invokeDirectiveHook(vnode, null, parentComponent, 'mounted');
  4190. }, parentSuspense);
  4191. }
  4192. // children
  4193. if (shapeFlag & 16 /* ARRAY_CHILDREN */ &&
  4194. // skip if element has innerHTML / textContent
  4195. !(props && (props.innerHTML || props.textContent))) {
  4196. let next = hydrateChildren(el.firstChild, vnode, el, parentComponent, parentSuspense, slotScopeIds, optimized);
  4197. let hasWarned = false;
  4198. while (next) {
  4199. hasMismatch = true;
  4200. if (!hasWarned) {
  4201. warn(`Hydration children mismatch in <${vnode.type}>: ` +
  4202. `server rendered element contains more child nodes than client vdom.`);
  4203. hasWarned = true;
  4204. }
  4205. // The SSRed DOM contains more nodes than it should. Remove them.
  4206. const cur = next;
  4207. next = next.nextSibling;
  4208. remove(cur);
  4209. }
  4210. }
  4211. else if (shapeFlag & 8 /* TEXT_CHILDREN */) {
  4212. if (el.textContent !== vnode.children) {
  4213. hasMismatch = true;
  4214. warn(`Hydration text content mismatch in <${vnode.type}>:\n` +
  4215. `- Client: ${el.textContent}\n` +
  4216. `- Server: ${vnode.children}`);
  4217. el.textContent = vnode.children;
  4218. }
  4219. }
  4220. }
  4221. return el.nextSibling;
  4222. };
  4223. const hydrateChildren = (node, parentVNode, container, parentComponent, parentSuspense, slotScopeIds, optimized) => {
  4224. optimized = optimized || !!parentVNode.dynamicChildren;
  4225. const children = parentVNode.children;
  4226. const l = children.length;
  4227. let hasWarned = false;
  4228. for (let i = 0; i < l; i++) {
  4229. const vnode = optimized
  4230. ? children[i]
  4231. : (children[i] = normalizeVNode(children[i]));
  4232. if (node) {
  4233. node = hydrateNode(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized);
  4234. }
  4235. else if (vnode.type === Text && !vnode.children) {
  4236. continue;
  4237. }
  4238. else {
  4239. hasMismatch = true;
  4240. if (!hasWarned) {
  4241. warn(`Hydration children mismatch in <${container.tagName.toLowerCase()}>: ` +
  4242. `server rendered element contains fewer child nodes than client vdom.`);
  4243. hasWarned = true;
  4244. }
  4245. // the SSRed DOM didn't contain enough nodes. Mount the missing ones.
  4246. patch(null, vnode, container, null, parentComponent, parentSuspense, isSVGContainer(container), slotScopeIds);
  4247. }
  4248. }
  4249. return node;
  4250. };
  4251. const hydrateFragment = (node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized) => {
  4252. const { slotScopeIds: fragmentSlotScopeIds } = vnode;
  4253. if (fragmentSlotScopeIds) {
  4254. slotScopeIds = slotScopeIds
  4255. ? slotScopeIds.concat(fragmentSlotScopeIds)
  4256. : fragmentSlotScopeIds;
  4257. }
  4258. const container = parentNode(node);
  4259. const next = hydrateChildren(nextSibling(node), vnode, container, parentComponent, parentSuspense, slotScopeIds, optimized);
  4260. if (next && isComment(next) && next.data === ']') {
  4261. return nextSibling((vnode.anchor = next));
  4262. }
  4263. else {
  4264. // fragment didn't hydrate successfully, since we didn't get a end anchor
  4265. // back. This should have led to node/children mismatch warnings.
  4266. hasMismatch = true;
  4267. // since the anchor is missing, we need to create one and insert it
  4268. insert((vnode.anchor = createComment(`]`)), container, next);
  4269. return next;
  4270. }
  4271. };
  4272. const handleMismatch = (node, vnode, parentComponent, parentSuspense, slotScopeIds, isFragment) => {
  4273. hasMismatch = true;
  4274. warn(`Hydration node mismatch:\n- Client vnode:`, vnode.type, `\n- Server rendered DOM:`, node, node.nodeType === 3 /* TEXT */
  4275. ? `(text)`
  4276. : isComment(node) && node.data === '['
  4277. ? `(start of fragment)`
  4278. : ``);
  4279. vnode.el = null;
  4280. if (isFragment) {
  4281. // remove excessive fragment nodes
  4282. const end = locateClosingAsyncAnchor(node);
  4283. while (true) {
  4284. const next = nextSibling(node);
  4285. if (next && next !== end) {
  4286. remove(next);
  4287. }
  4288. else {
  4289. break;
  4290. }
  4291. }
  4292. }
  4293. const next = nextSibling(node);
  4294. const container = parentNode(node);
  4295. remove(node);
  4296. patch(null, vnode, container, next, parentComponent, parentSuspense, isSVGContainer(container), slotScopeIds);
  4297. return next;
  4298. };
  4299. const locateClosingAsyncAnchor = (node) => {
  4300. let match = 0;
  4301. while (node) {
  4302. node = nextSibling(node);
  4303. if (node && isComment(node)) {
  4304. if (node.data === '[')
  4305. match++;
  4306. if (node.data === ']') {
  4307. if (match === 0) {
  4308. return nextSibling(node);
  4309. }
  4310. else {
  4311. match--;
  4312. }
  4313. }
  4314. }
  4315. }
  4316. return node;
  4317. };
  4318. return [hydrate, hydrateNode];
  4319. }
  4320. /* eslint-disable no-restricted-globals */
  4321. let supported;
  4322. let perf;
  4323. function startMeasure(instance, type) {
  4324. if (instance.appContext.config.performance && isSupported()) {
  4325. perf.mark(`vue-${type}-${instance.uid}`);
  4326. }
  4327. {
  4328. devtoolsPerfStart(instance, type, isSupported() ? perf.now() : Date.now());
  4329. }
  4330. }
  4331. function endMeasure(instance, type) {
  4332. if (instance.appContext.config.performance && isSupported()) {
  4333. const startTag = `vue-${type}-${instance.uid}`;
  4334. const endTag = startTag + `:end`;
  4335. perf.mark(endTag);
  4336. perf.measure(`<${formatComponentName(instance, instance.type)}> ${type}`, startTag, endTag);
  4337. perf.clearMarks(startTag);
  4338. perf.clearMarks(endTag);
  4339. }
  4340. {
  4341. devtoolsPerfEnd(instance, type, isSupported() ? perf.now() : Date.now());
  4342. }
  4343. }
  4344. function isSupported() {
  4345. if (supported !== undefined) {
  4346. return supported;
  4347. }
  4348. if (typeof window !== 'undefined' && window.performance) {
  4349. supported = true;
  4350. perf = window.performance;
  4351. }
  4352. else {
  4353. supported = false;
  4354. }
  4355. return supported;
  4356. }
  4357. const queuePostRenderEffect = queueEffectWithSuspense
  4358. ;
  4359. /**
  4360. * The createRenderer function accepts two generic arguments:
  4361. * HostNode and HostElement, corresponding to Node and Element types in the
  4362. * host environment. For example, for runtime-dom, HostNode would be the DOM
  4363. * `Node` interface and HostElement would be the DOM `Element` interface.
  4364. *
  4365. * Custom renderers can pass in the platform specific types like this:
  4366. *
  4367. * ``` js
  4368. * const { render, createApp } = createRenderer<Node, Element>({
  4369. * patchProp,
  4370. * ...nodeOps
  4371. * })
  4372. * ```
  4373. */
  4374. function createRenderer(options) {
  4375. return baseCreateRenderer(options);
  4376. }
  4377. // Separate API for creating hydration-enabled renderer.
  4378. // Hydration logic is only used when calling this function, making it
  4379. // tree-shakable.
  4380. function createHydrationRenderer(options) {
  4381. return baseCreateRenderer(options, createHydrationFunctions);
  4382. }
  4383. // implementation
  4384. function baseCreateRenderer(options, createHydrationFns) {
  4385. const target = shared.getGlobalThis();
  4386. target.__VUE__ = true;
  4387. {
  4388. setDevtoolsHook(target.__VUE_DEVTOOLS_GLOBAL_HOOK__, target);
  4389. }
  4390. const { insert: hostInsert, remove: hostRemove, patchProp: hostPatchProp, createElement: hostCreateElement, createText: hostCreateText, createComment: hostCreateComment, setText: hostSetText, setElementText: hostSetElementText, parentNode: hostParentNode, nextSibling: hostNextSibling, setScopeId: hostSetScopeId = shared.NOOP, cloneNode: hostCloneNode, insertStaticContent: hostInsertStaticContent } = options;
  4391. // Note: functions inside this closure should use `const xxx = () => {}`
  4392. // style in order to prevent being inlined by minifiers.
  4393. const patch = (n1, n2, container, anchor = null, parentComponent = null, parentSuspense = null, isSVG = false, slotScopeIds = null, optimized = isHmrUpdating ? false : !!n2.dynamicChildren) => {
  4394. if (n1 === n2) {
  4395. return;
  4396. }
  4397. // patching & not same type, unmount old tree
  4398. if (n1 && !isSameVNodeType(n1, n2)) {
  4399. anchor = getNextHostNode(n1);
  4400. unmount(n1, parentComponent, parentSuspense, true);
  4401. n1 = null;
  4402. }
  4403. if (n2.patchFlag === -2 /* BAIL */) {
  4404. optimized = false;
  4405. n2.dynamicChildren = null;
  4406. }
  4407. const { type, ref, shapeFlag } = n2;
  4408. switch (type) {
  4409. case Text:
  4410. processText(n1, n2, container, anchor);
  4411. break;
  4412. case Comment:
  4413. processCommentNode(n1, n2, container, anchor);
  4414. break;
  4415. case Static:
  4416. if (n1 == null) {
  4417. mountStaticNode(n2, container, anchor, isSVG);
  4418. }
  4419. else {
  4420. patchStaticNode(n1, n2, container, isSVG);
  4421. }
  4422. break;
  4423. case Fragment:
  4424. processFragment(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  4425. break;
  4426. default:
  4427. if (shapeFlag & 1 /* ELEMENT */) {
  4428. processElement(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  4429. }
  4430. else if (shapeFlag & 6 /* COMPONENT */) {
  4431. processComponent(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  4432. }
  4433. else if (shapeFlag & 64 /* TELEPORT */) {
  4434. type.process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals);
  4435. }
  4436. else if (shapeFlag & 128 /* SUSPENSE */) {
  4437. type.process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals);
  4438. }
  4439. else {
  4440. warn('Invalid VNode type:', type, `(${typeof type})`);
  4441. }
  4442. }
  4443. // set ref
  4444. if (ref != null && parentComponent) {
  4445. setRef(ref, n1 && n1.ref, parentSuspense, n2 || n1, !n2);
  4446. }
  4447. };
  4448. const processText = (n1, n2, container, anchor) => {
  4449. if (n1 == null) {
  4450. hostInsert((n2.el = hostCreateText(n2.children)), container, anchor);
  4451. }
  4452. else {
  4453. const el = (n2.el = n1.el);
  4454. if (n2.children !== n1.children) {
  4455. hostSetText(el, n2.children);
  4456. }
  4457. }
  4458. };
  4459. const processCommentNode = (n1, n2, container, anchor) => {
  4460. if (n1 == null) {
  4461. hostInsert((n2.el = hostCreateComment(n2.children || '')), container, anchor);
  4462. }
  4463. else {
  4464. // there's no support for dynamic comments
  4465. n2.el = n1.el;
  4466. }
  4467. };
  4468. const mountStaticNode = (n2, container, anchor, isSVG) => {
  4469. [n2.el, n2.anchor] = hostInsertStaticContent(n2.children, container, anchor, isSVG, n2.el, n2.anchor);
  4470. };
  4471. /**
  4472. * Dev / HMR only
  4473. */
  4474. const patchStaticNode = (n1, n2, container, isSVG) => {
  4475. // static nodes are only patched during dev for HMR
  4476. if (n2.children !== n1.children) {
  4477. const anchor = hostNextSibling(n1.anchor);
  4478. // remove existing
  4479. removeStaticNode(n1);
  4480. [n2.el, n2.anchor] = hostInsertStaticContent(n2.children, container, anchor, isSVG);
  4481. }
  4482. else {
  4483. n2.el = n1.el;
  4484. n2.anchor = n1.anchor;
  4485. }
  4486. };
  4487. const moveStaticNode = ({ el, anchor }, container, nextSibling) => {
  4488. let next;
  4489. while (el && el !== anchor) {
  4490. next = hostNextSibling(el);
  4491. hostInsert(el, container, nextSibling);
  4492. el = next;
  4493. }
  4494. hostInsert(anchor, container, nextSibling);
  4495. };
  4496. const removeStaticNode = ({ el, anchor }) => {
  4497. let next;
  4498. while (el && el !== anchor) {
  4499. next = hostNextSibling(el);
  4500. hostRemove(el);
  4501. el = next;
  4502. }
  4503. hostRemove(anchor);
  4504. };
  4505. const processElement = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
  4506. isSVG = isSVG || n2.type === 'svg';
  4507. if (n1 == null) {
  4508. mountElement(n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  4509. }
  4510. else {
  4511. patchElement(n1, n2, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  4512. }
  4513. };
  4514. const mountElement = (vnode, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
  4515. let el;
  4516. let vnodeHook;
  4517. const { type, props, shapeFlag, transition, patchFlag, dirs } = vnode;
  4518. {
  4519. el = vnode.el = hostCreateElement(vnode.type, isSVG, props && props.is, props);
  4520. // mount children first, since some props may rely on child content
  4521. // being already rendered, e.g. `<select value>`
  4522. if (shapeFlag & 8 /* TEXT_CHILDREN */) {
  4523. hostSetElementText(el, vnode.children);
  4524. }
  4525. else if (shapeFlag & 16 /* ARRAY_CHILDREN */) {
  4526. mountChildren(vnode.children, el, null, parentComponent, parentSuspense, isSVG && type !== 'foreignObject', slotScopeIds, optimized);
  4527. }
  4528. if (dirs) {
  4529. invokeDirectiveHook(vnode, null, parentComponent, 'created');
  4530. }
  4531. // props
  4532. if (props) {
  4533. for (const key in props) {
  4534. if (key !== 'value' && !shared.isReservedProp(key)) {
  4535. hostPatchProp(el, key, null, props[key], isSVG, vnode.children, parentComponent, parentSuspense, unmountChildren);
  4536. }
  4537. }
  4538. /**
  4539. * Special case for setting value on DOM elements:
  4540. * - it can be order-sensitive (e.g. should be set *after* min/max, #2325, #4024)
  4541. * - it needs to be forced (#1471)
  4542. * #2353 proposes adding another renderer option to configure this, but
  4543. * the properties affects are so finite it is worth special casing it
  4544. * here to reduce the complexity. (Special casing it also should not
  4545. * affect non-DOM renderers)
  4546. */
  4547. if ('value' in props) {
  4548. hostPatchProp(el, 'value', null, props.value);
  4549. }
  4550. if ((vnodeHook = props.onVnodeBeforeMount)) {
  4551. invokeVNodeHook(vnodeHook, parentComponent, vnode);
  4552. }
  4553. }
  4554. // scopeId
  4555. setScopeId(el, vnode, vnode.scopeId, slotScopeIds, parentComponent);
  4556. }
  4557. {
  4558. Object.defineProperty(el, '__vnode', {
  4559. value: vnode,
  4560. enumerable: false
  4561. });
  4562. Object.defineProperty(el, '__vueParentComponent', {
  4563. value: parentComponent,
  4564. enumerable: false
  4565. });
  4566. }
  4567. if (dirs) {
  4568. invokeDirectiveHook(vnode, null, parentComponent, 'beforeMount');
  4569. }
  4570. // #1583 For inside suspense + suspense not resolved case, enter hook should call when suspense resolved
  4571. // #1689 For inside suspense + suspense resolved case, just call it
  4572. const needCallTransitionHooks = (!parentSuspense || (parentSuspense && !parentSuspense.pendingBranch)) &&
  4573. transition &&
  4574. !transition.persisted;
  4575. if (needCallTransitionHooks) {
  4576. transition.beforeEnter(el);
  4577. }
  4578. hostInsert(el, container, anchor);
  4579. if ((vnodeHook = props && props.onVnodeMounted) ||
  4580. needCallTransitionHooks ||
  4581. dirs) {
  4582. queuePostRenderEffect(() => {
  4583. vnodeHook && invokeVNodeHook(vnodeHook, parentComponent, vnode);
  4584. needCallTransitionHooks && transition.enter(el);
  4585. dirs && invokeDirectiveHook(vnode, null, parentComponent, 'mounted');
  4586. }, parentSuspense);
  4587. }
  4588. };
  4589. const setScopeId = (el, vnode, scopeId, slotScopeIds, parentComponent) => {
  4590. if (scopeId) {
  4591. hostSetScopeId(el, scopeId);
  4592. }
  4593. if (slotScopeIds) {
  4594. for (let i = 0; i < slotScopeIds.length; i++) {
  4595. hostSetScopeId(el, slotScopeIds[i]);
  4596. }
  4597. }
  4598. if (parentComponent) {
  4599. let subTree = parentComponent.subTree;
  4600. if (subTree.patchFlag > 0 &&
  4601. subTree.patchFlag & 2048 /* DEV_ROOT_FRAGMENT */) {
  4602. subTree =
  4603. filterSingleRoot(subTree.children) || subTree;
  4604. }
  4605. if (vnode === subTree) {
  4606. const parentVNode = parentComponent.vnode;
  4607. setScopeId(el, parentVNode, parentVNode.scopeId, parentVNode.slotScopeIds, parentComponent.parent);
  4608. }
  4609. }
  4610. };
  4611. const mountChildren = (children, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, start = 0) => {
  4612. for (let i = start; i < children.length; i++) {
  4613. const child = (children[i] = optimized
  4614. ? cloneIfMounted(children[i])
  4615. : normalizeVNode(children[i]));
  4616. patch(null, child, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  4617. }
  4618. };
  4619. const patchElement = (n1, n2, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
  4620. const el = (n2.el = n1.el);
  4621. let { patchFlag, dynamicChildren, dirs } = n2;
  4622. // #1426 take the old vnode's patch flag into account since user may clone a
  4623. // compiler-generated vnode, which de-opts to FULL_PROPS
  4624. patchFlag |= n1.patchFlag & 16 /* FULL_PROPS */;
  4625. const oldProps = n1.props || shared.EMPTY_OBJ;
  4626. const newProps = n2.props || shared.EMPTY_OBJ;
  4627. let vnodeHook;
  4628. // disable recurse in beforeUpdate hooks
  4629. parentComponent && toggleRecurse(parentComponent, false);
  4630. if ((vnodeHook = newProps.onVnodeBeforeUpdate)) {
  4631. invokeVNodeHook(vnodeHook, parentComponent, n2, n1);
  4632. }
  4633. if (dirs) {
  4634. invokeDirectiveHook(n2, n1, parentComponent, 'beforeUpdate');
  4635. }
  4636. parentComponent && toggleRecurse(parentComponent, true);
  4637. if (isHmrUpdating) {
  4638. // HMR updated, force full diff
  4639. patchFlag = 0;
  4640. optimized = false;
  4641. dynamicChildren = null;
  4642. }
  4643. const areChildrenSVG = isSVG && n2.type !== 'foreignObject';
  4644. if (dynamicChildren) {
  4645. patchBlockChildren(n1.dynamicChildren, dynamicChildren, el, parentComponent, parentSuspense, areChildrenSVG, slotScopeIds);
  4646. if (parentComponent && parentComponent.type.__hmrId) {
  4647. traverseStaticChildren(n1, n2);
  4648. }
  4649. }
  4650. else if (!optimized) {
  4651. // full diff
  4652. patchChildren(n1, n2, el, null, parentComponent, parentSuspense, areChildrenSVG, slotScopeIds, false);
  4653. }
  4654. if (patchFlag > 0) {
  4655. // the presence of a patchFlag means this element's render code was
  4656. // generated by the compiler and can take the fast path.
  4657. // in this path old node and new node are guaranteed to have the same shape
  4658. // (i.e. at the exact same position in the source template)
  4659. if (patchFlag & 16 /* FULL_PROPS */) {
  4660. // element props contain dynamic keys, full diff needed
  4661. patchProps(el, n2, oldProps, newProps, parentComponent, parentSuspense, isSVG);
  4662. }
  4663. else {
  4664. // class
  4665. // this flag is matched when the element has dynamic class bindings.
  4666. if (patchFlag & 2 /* CLASS */) {
  4667. if (oldProps.class !== newProps.class) {
  4668. hostPatchProp(el, 'class', null, newProps.class, isSVG);
  4669. }
  4670. }
  4671. // style
  4672. // this flag is matched when the element has dynamic style bindings
  4673. if (patchFlag & 4 /* STYLE */) {
  4674. hostPatchProp(el, 'style', oldProps.style, newProps.style, isSVG);
  4675. }
  4676. // props
  4677. // This flag is matched when the element has dynamic prop/attr bindings
  4678. // other than class and style. The keys of dynamic prop/attrs are saved for
  4679. // faster iteration.
  4680. // Note dynamic keys like :[foo]="bar" will cause this optimization to
  4681. // bail out and go through a full diff because we need to unset the old key
  4682. if (patchFlag & 8 /* PROPS */) {
  4683. // if the flag is present then dynamicProps must be non-null
  4684. const propsToUpdate = n2.dynamicProps;
  4685. for (let i = 0; i < propsToUpdate.length; i++) {
  4686. const key = propsToUpdate[i];
  4687. const prev = oldProps[key];
  4688. const next = newProps[key];
  4689. // #1471 force patch value
  4690. if (next !== prev || key === 'value') {
  4691. hostPatchProp(el, key, prev, next, isSVG, n1.children, parentComponent, parentSuspense, unmountChildren);
  4692. }
  4693. }
  4694. }
  4695. }
  4696. // text
  4697. // This flag is matched when the element has only dynamic text children.
  4698. if (patchFlag & 1 /* TEXT */) {
  4699. if (n1.children !== n2.children) {
  4700. hostSetElementText(el, n2.children);
  4701. }
  4702. }
  4703. }
  4704. else if (!optimized && dynamicChildren == null) {
  4705. // unoptimized, full diff
  4706. patchProps(el, n2, oldProps, newProps, parentComponent, parentSuspense, isSVG);
  4707. }
  4708. if ((vnodeHook = newProps.onVnodeUpdated) || dirs) {
  4709. queuePostRenderEffect(() => {
  4710. vnodeHook && invokeVNodeHook(vnodeHook, parentComponent, n2, n1);
  4711. dirs && invokeDirectiveHook(n2, n1, parentComponent, 'updated');
  4712. }, parentSuspense);
  4713. }
  4714. };
  4715. // The fast path for blocks.
  4716. const patchBlockChildren = (oldChildren, newChildren, fallbackContainer, parentComponent, parentSuspense, isSVG, slotScopeIds) => {
  4717. for (let i = 0; i < newChildren.length; i++) {
  4718. const oldVNode = oldChildren[i];
  4719. const newVNode = newChildren[i];
  4720. // Determine the container (parent element) for the patch.
  4721. const container =
  4722. // oldVNode may be an errored async setup() component inside Suspense
  4723. // which will not have a mounted element
  4724. oldVNode.el &&
  4725. // - In the case of a Fragment, we need to provide the actual parent
  4726. // of the Fragment itself so it can move its children.
  4727. (oldVNode.type === Fragment ||
  4728. // - In the case of different nodes, there is going to be a replacement
  4729. // which also requires the correct parent container
  4730. !isSameVNodeType(oldVNode, newVNode) ||
  4731. // - In the case of a component, it could contain anything.
  4732. oldVNode.shapeFlag & (6 /* COMPONENT */ | 64 /* TELEPORT */))
  4733. ? hostParentNode(oldVNode.el)
  4734. : // In other cases, the parent container is not actually used so we
  4735. // just pass the block element here to avoid a DOM parentNode call.
  4736. fallbackContainer;
  4737. patch(oldVNode, newVNode, container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, true);
  4738. }
  4739. };
  4740. const patchProps = (el, vnode, oldProps, newProps, parentComponent, parentSuspense, isSVG) => {
  4741. if (oldProps !== newProps) {
  4742. for (const key in newProps) {
  4743. // empty string is not valid prop
  4744. if (shared.isReservedProp(key))
  4745. continue;
  4746. const next = newProps[key];
  4747. const prev = oldProps[key];
  4748. // defer patching value
  4749. if (next !== prev && key !== 'value') {
  4750. hostPatchProp(el, key, prev, next, isSVG, vnode.children, parentComponent, parentSuspense, unmountChildren);
  4751. }
  4752. }
  4753. if (oldProps !== shared.EMPTY_OBJ) {
  4754. for (const key in oldProps) {
  4755. if (!shared.isReservedProp(key) && !(key in newProps)) {
  4756. hostPatchProp(el, key, oldProps[key], null, isSVG, vnode.children, parentComponent, parentSuspense, unmountChildren);
  4757. }
  4758. }
  4759. }
  4760. if ('value' in newProps) {
  4761. hostPatchProp(el, 'value', oldProps.value, newProps.value);
  4762. }
  4763. }
  4764. };
  4765. const processFragment = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
  4766. const fragmentStartAnchor = (n2.el = n1 ? n1.el : hostCreateText(''));
  4767. const fragmentEndAnchor = (n2.anchor = n1 ? n1.anchor : hostCreateText(''));
  4768. let { patchFlag, dynamicChildren, slotScopeIds: fragmentSlotScopeIds } = n2;
  4769. if (isHmrUpdating) {
  4770. // HMR updated, force full diff
  4771. patchFlag = 0;
  4772. optimized = false;
  4773. dynamicChildren = null;
  4774. }
  4775. // check if this is a slot fragment with :slotted scope ids
  4776. if (fragmentSlotScopeIds) {
  4777. slotScopeIds = slotScopeIds
  4778. ? slotScopeIds.concat(fragmentSlotScopeIds)
  4779. : fragmentSlotScopeIds;
  4780. }
  4781. if (n1 == null) {
  4782. hostInsert(fragmentStartAnchor, container, anchor);
  4783. hostInsert(fragmentEndAnchor, container, anchor);
  4784. // a fragment can only have array children
  4785. // since they are either generated by the compiler, or implicitly created
  4786. // from arrays.
  4787. mountChildren(n2.children, container, fragmentEndAnchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  4788. }
  4789. else {
  4790. if (patchFlag > 0 &&
  4791. patchFlag & 64 /* STABLE_FRAGMENT */ &&
  4792. dynamicChildren &&
  4793. // #2715 the previous fragment could've been a BAILed one as a result
  4794. // of renderSlot() with no valid children
  4795. n1.dynamicChildren) {
  4796. // a stable fragment (template root or <template v-for>) doesn't need to
  4797. // patch children order, but it may contain dynamicChildren.
  4798. patchBlockChildren(n1.dynamicChildren, dynamicChildren, container, parentComponent, parentSuspense, isSVG, slotScopeIds);
  4799. if (parentComponent && parentComponent.type.__hmrId) {
  4800. traverseStaticChildren(n1, n2);
  4801. }
  4802. else if (
  4803. // #2080 if the stable fragment has a key, it's a <template v-for> that may
  4804. // get moved around. Make sure all root level vnodes inherit el.
  4805. // #2134 or if it's a component root, it may also get moved around
  4806. // as the component is being moved.
  4807. n2.key != null ||
  4808. (parentComponent && n2 === parentComponent.subTree)) {
  4809. traverseStaticChildren(n1, n2, true /* shallow */);
  4810. }
  4811. }
  4812. else {
  4813. // keyed / unkeyed, or manual fragments.
  4814. // for keyed & unkeyed, since they are compiler generated from v-for,
  4815. // each child is guaranteed to be a block so the fragment will never
  4816. // have dynamicChildren.
  4817. patchChildren(n1, n2, container, fragmentEndAnchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  4818. }
  4819. }
  4820. };
  4821. const processComponent = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
  4822. n2.slotScopeIds = slotScopeIds;
  4823. if (n1 == null) {
  4824. if (n2.shapeFlag & 512 /* COMPONENT_KEPT_ALIVE */) {
  4825. parentComponent.ctx.activate(n2, container, anchor, isSVG, optimized);
  4826. }
  4827. else {
  4828. mountComponent(n2, container, anchor, parentComponent, parentSuspense, isSVG, optimized);
  4829. }
  4830. }
  4831. else {
  4832. updateComponent(n1, n2, optimized);
  4833. }
  4834. };
  4835. const mountComponent = (initialVNode, container, anchor, parentComponent, parentSuspense, isSVG, optimized) => {
  4836. const instance = (initialVNode.component = createComponentInstance(initialVNode, parentComponent, parentSuspense));
  4837. if (instance.type.__hmrId) {
  4838. registerHMR(instance);
  4839. }
  4840. {
  4841. pushWarningContext(initialVNode);
  4842. startMeasure(instance, `mount`);
  4843. }
  4844. // inject renderer internals for keepAlive
  4845. if (isKeepAlive(initialVNode)) {
  4846. instance.ctx.renderer = internals;
  4847. }
  4848. // resolve props and slots for setup context
  4849. {
  4850. {
  4851. startMeasure(instance, `init`);
  4852. }
  4853. setupComponent(instance);
  4854. {
  4855. endMeasure(instance, `init`);
  4856. }
  4857. }
  4858. // setup() is async. This component relies on async logic to be resolved
  4859. // before proceeding
  4860. if (instance.asyncDep) {
  4861. parentSuspense && parentSuspense.registerDep(instance, setupRenderEffect);
  4862. // Give it a placeholder if this is not hydration
  4863. // TODO handle self-defined fallback
  4864. if (!initialVNode.el) {
  4865. const placeholder = (instance.subTree = createVNode(Comment));
  4866. processCommentNode(null, placeholder, container, anchor);
  4867. }
  4868. return;
  4869. }
  4870. setupRenderEffect(instance, initialVNode, container, anchor, parentSuspense, isSVG, optimized);
  4871. {
  4872. popWarningContext();
  4873. endMeasure(instance, `mount`);
  4874. }
  4875. };
  4876. const updateComponent = (n1, n2, optimized) => {
  4877. const instance = (n2.component = n1.component);
  4878. if (shouldUpdateComponent(n1, n2, optimized)) {
  4879. if (instance.asyncDep &&
  4880. !instance.asyncResolved) {
  4881. // async & still pending - just update props and slots
  4882. // since the component's reactive effect for render isn't set-up yet
  4883. {
  4884. pushWarningContext(n2);
  4885. }
  4886. updateComponentPreRender(instance, n2, optimized);
  4887. {
  4888. popWarningContext();
  4889. }
  4890. return;
  4891. }
  4892. else {
  4893. // normal update
  4894. instance.next = n2;
  4895. // in case the child component is also queued, remove it to avoid
  4896. // double updating the same child component in the same flush.
  4897. invalidateJob(instance.update);
  4898. // instance.update is the reactive effect.
  4899. instance.update();
  4900. }
  4901. }
  4902. else {
  4903. // no update needed. just copy over properties
  4904. n2.component = n1.component;
  4905. n2.el = n1.el;
  4906. instance.vnode = n2;
  4907. }
  4908. };
  4909. const setupRenderEffect = (instance, initialVNode, container, anchor, parentSuspense, isSVG, optimized) => {
  4910. const componentUpdateFn = () => {
  4911. if (!instance.isMounted) {
  4912. let vnodeHook;
  4913. const { el, props } = initialVNode;
  4914. const { bm, m, parent } = instance;
  4915. const isAsyncWrapperVNode = isAsyncWrapper(initialVNode);
  4916. toggleRecurse(instance, false);
  4917. // beforeMount hook
  4918. if (bm) {
  4919. shared.invokeArrayFns(bm);
  4920. }
  4921. // onVnodeBeforeMount
  4922. if (!isAsyncWrapperVNode &&
  4923. (vnodeHook = props && props.onVnodeBeforeMount)) {
  4924. invokeVNodeHook(vnodeHook, parent, initialVNode);
  4925. }
  4926. toggleRecurse(instance, true);
  4927. if (el && hydrateNode) {
  4928. // vnode has adopted host node - perform hydration instead of mount.
  4929. const hydrateSubTree = () => {
  4930. {
  4931. startMeasure(instance, `render`);
  4932. }
  4933. instance.subTree = renderComponentRoot(instance);
  4934. {
  4935. endMeasure(instance, `render`);
  4936. }
  4937. {
  4938. startMeasure(instance, `hydrate`);
  4939. }
  4940. hydrateNode(el, instance.subTree, instance, parentSuspense, null);
  4941. {
  4942. endMeasure(instance, `hydrate`);
  4943. }
  4944. };
  4945. if (isAsyncWrapperVNode) {
  4946. initialVNode.type.__asyncLoader().then(
  4947. // note: we are moving the render call into an async callback,
  4948. // which means it won't track dependencies - but it's ok because
  4949. // a server-rendered async wrapper is already in resolved state
  4950. // and it will never need to change.
  4951. () => !instance.isUnmounted && hydrateSubTree());
  4952. }
  4953. else {
  4954. hydrateSubTree();
  4955. }
  4956. }
  4957. else {
  4958. {
  4959. startMeasure(instance, `render`);
  4960. }
  4961. const subTree = (instance.subTree = renderComponentRoot(instance));
  4962. {
  4963. endMeasure(instance, `render`);
  4964. }
  4965. {
  4966. startMeasure(instance, `patch`);
  4967. }
  4968. patch(null, subTree, container, anchor, instance, parentSuspense, isSVG);
  4969. {
  4970. endMeasure(instance, `patch`);
  4971. }
  4972. initialVNode.el = subTree.el;
  4973. }
  4974. // mounted hook
  4975. if (m) {
  4976. queuePostRenderEffect(m, parentSuspense);
  4977. }
  4978. // onVnodeMounted
  4979. if (!isAsyncWrapperVNode &&
  4980. (vnodeHook = props && props.onVnodeMounted)) {
  4981. const scopedInitialVNode = initialVNode;
  4982. queuePostRenderEffect(() => invokeVNodeHook(vnodeHook, parent, scopedInitialVNode), parentSuspense);
  4983. }
  4984. // activated hook for keep-alive roots.
  4985. // #1742 activated hook must be accessed after first render
  4986. // since the hook may be injected by a child keep-alive
  4987. if (initialVNode.shapeFlag & 256 /* COMPONENT_SHOULD_KEEP_ALIVE */) {
  4988. instance.a && queuePostRenderEffect(instance.a, parentSuspense);
  4989. }
  4990. instance.isMounted = true;
  4991. {
  4992. devtoolsComponentAdded(instance);
  4993. }
  4994. // #2458: deference mount-only object parameters to prevent memleaks
  4995. initialVNode = container = anchor = null;
  4996. }
  4997. else {
  4998. // updateComponent
  4999. // This is triggered by mutation of component's own state (next: null)
  5000. // OR parent calling processComponent (next: VNode)
  5001. let { next, bu, u, parent, vnode } = instance;
  5002. let originNext = next;
  5003. let vnodeHook;
  5004. {
  5005. pushWarningContext(next || instance.vnode);
  5006. }
  5007. // Disallow component effect recursion during pre-lifecycle hooks.
  5008. toggleRecurse(instance, false);
  5009. if (next) {
  5010. next.el = vnode.el;
  5011. updateComponentPreRender(instance, next, optimized);
  5012. }
  5013. else {
  5014. next = vnode;
  5015. }
  5016. // beforeUpdate hook
  5017. if (bu) {
  5018. shared.invokeArrayFns(bu);
  5019. }
  5020. // onVnodeBeforeUpdate
  5021. if ((vnodeHook = next.props && next.props.onVnodeBeforeUpdate)) {
  5022. invokeVNodeHook(vnodeHook, parent, next, vnode);
  5023. }
  5024. toggleRecurse(instance, true);
  5025. // render
  5026. {
  5027. startMeasure(instance, `render`);
  5028. }
  5029. const nextTree = renderComponentRoot(instance);
  5030. {
  5031. endMeasure(instance, `render`);
  5032. }
  5033. const prevTree = instance.subTree;
  5034. instance.subTree = nextTree;
  5035. {
  5036. startMeasure(instance, `patch`);
  5037. }
  5038. patch(prevTree, nextTree,
  5039. // parent may have changed if it's in a teleport
  5040. hostParentNode(prevTree.el),
  5041. // anchor may have changed if it's in a fragment
  5042. getNextHostNode(prevTree), instance, parentSuspense, isSVG);
  5043. {
  5044. endMeasure(instance, `patch`);
  5045. }
  5046. next.el = nextTree.el;
  5047. if (originNext === null) {
  5048. // self-triggered update. In case of HOC, update parent component
  5049. // vnode el. HOC is indicated by parent instance's subTree pointing
  5050. // to child component's vnode
  5051. updateHOCHostEl(instance, nextTree.el);
  5052. }
  5053. // updated hook
  5054. if (u) {
  5055. queuePostRenderEffect(u, parentSuspense);
  5056. }
  5057. // onVnodeUpdated
  5058. if ((vnodeHook = next.props && next.props.onVnodeUpdated)) {
  5059. queuePostRenderEffect(() => invokeVNodeHook(vnodeHook, parent, next, vnode), parentSuspense);
  5060. }
  5061. {
  5062. devtoolsComponentUpdated(instance);
  5063. }
  5064. {
  5065. popWarningContext();
  5066. }
  5067. }
  5068. };
  5069. // create reactive effect for rendering
  5070. const effect = (instance.effect = new reactivity.ReactiveEffect(componentUpdateFn, () => queueJob(instance.update), instance.scope // track it in component's effect scope
  5071. ));
  5072. const update = (instance.update = effect.run.bind(effect));
  5073. update.id = instance.uid;
  5074. // allowRecurse
  5075. // #1801, #2043 component render effects should allow recursive updates
  5076. toggleRecurse(instance, true);
  5077. {
  5078. effect.onTrack = instance.rtc
  5079. ? e => shared.invokeArrayFns(instance.rtc, e)
  5080. : void 0;
  5081. effect.onTrigger = instance.rtg
  5082. ? e => shared.invokeArrayFns(instance.rtg, e)
  5083. : void 0;
  5084. // @ts-ignore (for scheduler)
  5085. update.ownerInstance = instance;
  5086. }
  5087. update();
  5088. };
  5089. const updateComponentPreRender = (instance, nextVNode, optimized) => {
  5090. nextVNode.component = instance;
  5091. const prevProps = instance.vnode.props;
  5092. instance.vnode = nextVNode;
  5093. instance.next = null;
  5094. updateProps(instance, nextVNode.props, prevProps, optimized);
  5095. updateSlots(instance, nextVNode.children, optimized);
  5096. reactivity.pauseTracking();
  5097. // props update may have triggered pre-flush watchers.
  5098. // flush them before the render update.
  5099. flushPreFlushCbs(undefined, instance.update);
  5100. reactivity.resetTracking();
  5101. };
  5102. const patchChildren = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized = false) => {
  5103. const c1 = n1 && n1.children;
  5104. const prevShapeFlag = n1 ? n1.shapeFlag : 0;
  5105. const c2 = n2.children;
  5106. const { patchFlag, shapeFlag } = n2;
  5107. // fast path
  5108. if (patchFlag > 0) {
  5109. if (patchFlag & 128 /* KEYED_FRAGMENT */) {
  5110. // this could be either fully-keyed or mixed (some keyed some not)
  5111. // presence of patchFlag means children are guaranteed to be arrays
  5112. patchKeyedChildren(c1, c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  5113. return;
  5114. }
  5115. else if (patchFlag & 256 /* UNKEYED_FRAGMENT */) {
  5116. // unkeyed
  5117. patchUnkeyedChildren(c1, c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  5118. return;
  5119. }
  5120. }
  5121. // children has 3 possibilities: text, array or no children.
  5122. if (shapeFlag & 8 /* TEXT_CHILDREN */) {
  5123. // text children fast path
  5124. if (prevShapeFlag & 16 /* ARRAY_CHILDREN */) {
  5125. unmountChildren(c1, parentComponent, parentSuspense);
  5126. }
  5127. if (c2 !== c1) {
  5128. hostSetElementText(container, c2);
  5129. }
  5130. }
  5131. else {
  5132. if (prevShapeFlag & 16 /* ARRAY_CHILDREN */) {
  5133. // prev children was array
  5134. if (shapeFlag & 16 /* ARRAY_CHILDREN */) {
  5135. // two arrays, cannot assume anything, do full diff
  5136. patchKeyedChildren(c1, c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  5137. }
  5138. else {
  5139. // no new children, just unmount old
  5140. unmountChildren(c1, parentComponent, parentSuspense, true);
  5141. }
  5142. }
  5143. else {
  5144. // prev children was text OR null
  5145. // new children is array OR null
  5146. if (prevShapeFlag & 8 /* TEXT_CHILDREN */) {
  5147. hostSetElementText(container, '');
  5148. }
  5149. // mount new if array
  5150. if (shapeFlag & 16 /* ARRAY_CHILDREN */) {
  5151. mountChildren(c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  5152. }
  5153. }
  5154. }
  5155. };
  5156. const patchUnkeyedChildren = (c1, c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
  5157. c1 = c1 || shared.EMPTY_ARR;
  5158. c2 = c2 || shared.EMPTY_ARR;
  5159. const oldLength = c1.length;
  5160. const newLength = c2.length;
  5161. const commonLength = Math.min(oldLength, newLength);
  5162. let i;
  5163. for (i = 0; i < commonLength; i++) {
  5164. const nextChild = (c2[i] = optimized
  5165. ? cloneIfMounted(c2[i])
  5166. : normalizeVNode(c2[i]));
  5167. patch(c1[i], nextChild, container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  5168. }
  5169. if (oldLength > newLength) {
  5170. // remove old
  5171. unmountChildren(c1, parentComponent, parentSuspense, true, false, commonLength);
  5172. }
  5173. else {
  5174. // mount new
  5175. mountChildren(c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, commonLength);
  5176. }
  5177. };
  5178. // can be all-keyed or mixed
  5179. const patchKeyedChildren = (c1, c2, container, parentAnchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
  5180. let i = 0;
  5181. const l2 = c2.length;
  5182. let e1 = c1.length - 1; // prev ending index
  5183. let e2 = l2 - 1; // next ending index
  5184. // 1. sync from start
  5185. // (a b) c
  5186. // (a b) d e
  5187. while (i <= e1 && i <= e2) {
  5188. const n1 = c1[i];
  5189. const n2 = (c2[i] = optimized
  5190. ? cloneIfMounted(c2[i])
  5191. : normalizeVNode(c2[i]));
  5192. if (isSameVNodeType(n1, n2)) {
  5193. patch(n1, n2, container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  5194. }
  5195. else {
  5196. break;
  5197. }
  5198. i++;
  5199. }
  5200. // 2. sync from end
  5201. // a (b c)
  5202. // d e (b c)
  5203. while (i <= e1 && i <= e2) {
  5204. const n1 = c1[e1];
  5205. const n2 = (c2[e2] = optimized
  5206. ? cloneIfMounted(c2[e2])
  5207. : normalizeVNode(c2[e2]));
  5208. if (isSameVNodeType(n1, n2)) {
  5209. patch(n1, n2, container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  5210. }
  5211. else {
  5212. break;
  5213. }
  5214. e1--;
  5215. e2--;
  5216. }
  5217. // 3. common sequence + mount
  5218. // (a b)
  5219. // (a b) c
  5220. // i = 2, e1 = 1, e2 = 2
  5221. // (a b)
  5222. // c (a b)
  5223. // i = 0, e1 = -1, e2 = 0
  5224. if (i > e1) {
  5225. if (i <= e2) {
  5226. const nextPos = e2 + 1;
  5227. const anchor = nextPos < l2 ? c2[nextPos].el : parentAnchor;
  5228. while (i <= e2) {
  5229. patch(null, (c2[i] = optimized
  5230. ? cloneIfMounted(c2[i])
  5231. : normalizeVNode(c2[i])), container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  5232. i++;
  5233. }
  5234. }
  5235. }
  5236. // 4. common sequence + unmount
  5237. // (a b) c
  5238. // (a b)
  5239. // i = 2, e1 = 2, e2 = 1
  5240. // a (b c)
  5241. // (b c)
  5242. // i = 0, e1 = 0, e2 = -1
  5243. else if (i > e2) {
  5244. while (i <= e1) {
  5245. unmount(c1[i], parentComponent, parentSuspense, true);
  5246. i++;
  5247. }
  5248. }
  5249. // 5. unknown sequence
  5250. // [i ... e1 + 1]: a b [c d e] f g
  5251. // [i ... e2 + 1]: a b [e d c h] f g
  5252. // i = 2, e1 = 4, e2 = 5
  5253. else {
  5254. const s1 = i; // prev starting index
  5255. const s2 = i; // next starting index
  5256. // 5.1 build key:index map for newChildren
  5257. const keyToNewIndexMap = new Map();
  5258. for (i = s2; i <= e2; i++) {
  5259. const nextChild = (c2[i] = optimized
  5260. ? cloneIfMounted(c2[i])
  5261. : normalizeVNode(c2[i]));
  5262. if (nextChild.key != null) {
  5263. if (keyToNewIndexMap.has(nextChild.key)) {
  5264. warn(`Duplicate keys found during update:`, JSON.stringify(nextChild.key), `Make sure keys are unique.`);
  5265. }
  5266. keyToNewIndexMap.set(nextChild.key, i);
  5267. }
  5268. }
  5269. // 5.2 loop through old children left to be patched and try to patch
  5270. // matching nodes & remove nodes that are no longer present
  5271. let j;
  5272. let patched = 0;
  5273. const toBePatched = e2 - s2 + 1;
  5274. let moved = false;
  5275. // used to track whether any node has moved
  5276. let maxNewIndexSoFar = 0;
  5277. // works as Map<newIndex, oldIndex>
  5278. // Note that oldIndex is offset by +1
  5279. // and oldIndex = 0 is a special value indicating the new node has
  5280. // no corresponding old node.
  5281. // used for determining longest stable subsequence
  5282. const newIndexToOldIndexMap = new Array(toBePatched);
  5283. for (i = 0; i < toBePatched; i++)
  5284. newIndexToOldIndexMap[i] = 0;
  5285. for (i = s1; i <= e1; i++) {
  5286. const prevChild = c1[i];
  5287. if (patched >= toBePatched) {
  5288. // all new children have been patched so this can only be a removal
  5289. unmount(prevChild, parentComponent, parentSuspense, true);
  5290. continue;
  5291. }
  5292. let newIndex;
  5293. if (prevChild.key != null) {
  5294. newIndex = keyToNewIndexMap.get(prevChild.key);
  5295. }
  5296. else {
  5297. // key-less node, try to locate a key-less node of the same type
  5298. for (j = s2; j <= e2; j++) {
  5299. if (newIndexToOldIndexMap[j - s2] === 0 &&
  5300. isSameVNodeType(prevChild, c2[j])) {
  5301. newIndex = j;
  5302. break;
  5303. }
  5304. }
  5305. }
  5306. if (newIndex === undefined) {
  5307. unmount(prevChild, parentComponent, parentSuspense, true);
  5308. }
  5309. else {
  5310. newIndexToOldIndexMap[newIndex - s2] = i + 1;
  5311. if (newIndex >= maxNewIndexSoFar) {
  5312. maxNewIndexSoFar = newIndex;
  5313. }
  5314. else {
  5315. moved = true;
  5316. }
  5317. patch(prevChild, c2[newIndex], container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  5318. patched++;
  5319. }
  5320. }
  5321. // 5.3 move and mount
  5322. // generate longest stable subsequence only when nodes have moved
  5323. const increasingNewIndexSequence = moved
  5324. ? getSequence(newIndexToOldIndexMap)
  5325. : shared.EMPTY_ARR;
  5326. j = increasingNewIndexSequence.length - 1;
  5327. // looping backwards so that we can use last patched node as anchor
  5328. for (i = toBePatched - 1; i >= 0; i--) {
  5329. const nextIndex = s2 + i;
  5330. const nextChild = c2[nextIndex];
  5331. const anchor = nextIndex + 1 < l2 ? c2[nextIndex + 1].el : parentAnchor;
  5332. if (newIndexToOldIndexMap[i] === 0) {
  5333. // mount new
  5334. patch(null, nextChild, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  5335. }
  5336. else if (moved) {
  5337. // move if:
  5338. // There is no stable subsequence (e.g. a reverse)
  5339. // OR current node is not among the stable sequence
  5340. if (j < 0 || i !== increasingNewIndexSequence[j]) {
  5341. move(nextChild, container, anchor, 2 /* REORDER */);
  5342. }
  5343. else {
  5344. j--;
  5345. }
  5346. }
  5347. }
  5348. }
  5349. };
  5350. const move = (vnode, container, anchor, moveType, parentSuspense = null) => {
  5351. const { el, type, transition, children, shapeFlag } = vnode;
  5352. if (shapeFlag & 6 /* COMPONENT */) {
  5353. move(vnode.component.subTree, container, anchor, moveType);
  5354. return;
  5355. }
  5356. if (shapeFlag & 128 /* SUSPENSE */) {
  5357. vnode.suspense.move(container, anchor, moveType);
  5358. return;
  5359. }
  5360. if (shapeFlag & 64 /* TELEPORT */) {
  5361. type.move(vnode, container, anchor, internals);
  5362. return;
  5363. }
  5364. if (type === Fragment) {
  5365. hostInsert(el, container, anchor);
  5366. for (let i = 0; i < children.length; i++) {
  5367. move(children[i], container, anchor, moveType);
  5368. }
  5369. hostInsert(vnode.anchor, container, anchor);
  5370. return;
  5371. }
  5372. if (type === Static) {
  5373. moveStaticNode(vnode, container, anchor);
  5374. return;
  5375. }
  5376. // single nodes
  5377. const needTransition = moveType !== 2 /* REORDER */ &&
  5378. shapeFlag & 1 /* ELEMENT */ &&
  5379. transition;
  5380. if (needTransition) {
  5381. if (moveType === 0 /* ENTER */) {
  5382. transition.beforeEnter(el);
  5383. hostInsert(el, container, anchor);
  5384. queuePostRenderEffect(() => transition.enter(el), parentSuspense);
  5385. }
  5386. else {
  5387. const { leave, delayLeave, afterLeave } = transition;
  5388. const remove = () => hostInsert(el, container, anchor);
  5389. const performLeave = () => {
  5390. leave(el, () => {
  5391. remove();
  5392. afterLeave && afterLeave();
  5393. });
  5394. };
  5395. if (delayLeave) {
  5396. delayLeave(el, remove, performLeave);
  5397. }
  5398. else {
  5399. performLeave();
  5400. }
  5401. }
  5402. }
  5403. else {
  5404. hostInsert(el, container, anchor);
  5405. }
  5406. };
  5407. const unmount = (vnode, parentComponent, parentSuspense, doRemove = false, optimized = false) => {
  5408. const { type, props, ref, children, dynamicChildren, shapeFlag, patchFlag, dirs } = vnode;
  5409. // unset ref
  5410. if (ref != null) {
  5411. setRef(ref, null, parentSuspense, vnode, true);
  5412. }
  5413. if (shapeFlag & 256 /* COMPONENT_SHOULD_KEEP_ALIVE */) {
  5414. parentComponent.ctx.deactivate(vnode);
  5415. return;
  5416. }
  5417. const shouldInvokeDirs = shapeFlag & 1 /* ELEMENT */ && dirs;
  5418. const shouldInvokeVnodeHook = !isAsyncWrapper(vnode);
  5419. let vnodeHook;
  5420. if (shouldInvokeVnodeHook &&
  5421. (vnodeHook = props && props.onVnodeBeforeUnmount)) {
  5422. invokeVNodeHook(vnodeHook, parentComponent, vnode);
  5423. }
  5424. if (shapeFlag & 6 /* COMPONENT */) {
  5425. unmountComponent(vnode.component, parentSuspense, doRemove);
  5426. }
  5427. else {
  5428. if (shapeFlag & 128 /* SUSPENSE */) {
  5429. vnode.suspense.unmount(parentSuspense, doRemove);
  5430. return;
  5431. }
  5432. if (shouldInvokeDirs) {
  5433. invokeDirectiveHook(vnode, null, parentComponent, 'beforeUnmount');
  5434. }
  5435. if (shapeFlag & 64 /* TELEPORT */) {
  5436. vnode.type.remove(vnode, parentComponent, parentSuspense, optimized, internals, doRemove);
  5437. }
  5438. else if (dynamicChildren &&
  5439. // #1153: fast path should not be taken for non-stable (v-for) fragments
  5440. (type !== Fragment ||
  5441. (patchFlag > 0 && patchFlag & 64 /* STABLE_FRAGMENT */))) {
  5442. // fast path for block nodes: only need to unmount dynamic children.
  5443. unmountChildren(dynamicChildren, parentComponent, parentSuspense, false, true);
  5444. }
  5445. else if ((type === Fragment &&
  5446. patchFlag &
  5447. (128 /* KEYED_FRAGMENT */ | 256 /* UNKEYED_FRAGMENT */)) ||
  5448. (!optimized && shapeFlag & 16 /* ARRAY_CHILDREN */)) {
  5449. unmountChildren(children, parentComponent, parentSuspense);
  5450. }
  5451. if (doRemove) {
  5452. remove(vnode);
  5453. }
  5454. }
  5455. if ((shouldInvokeVnodeHook &&
  5456. (vnodeHook = props && props.onVnodeUnmounted)) ||
  5457. shouldInvokeDirs) {
  5458. queuePostRenderEffect(() => {
  5459. vnodeHook && invokeVNodeHook(vnodeHook, parentComponent, vnode);
  5460. shouldInvokeDirs &&
  5461. invokeDirectiveHook(vnode, null, parentComponent, 'unmounted');
  5462. }, parentSuspense);
  5463. }
  5464. };
  5465. const remove = vnode => {
  5466. const { type, el, anchor, transition } = vnode;
  5467. if (type === Fragment) {
  5468. if (vnode.patchFlag > 0 &&
  5469. vnode.patchFlag & 2048 /* DEV_ROOT_FRAGMENT */ &&
  5470. transition &&
  5471. !transition.persisted) {
  5472. vnode.children.forEach(child => {
  5473. if (child.type === Comment) {
  5474. hostRemove(child.el);
  5475. }
  5476. else {
  5477. remove(child);
  5478. }
  5479. });
  5480. }
  5481. else {
  5482. removeFragment(el, anchor);
  5483. }
  5484. return;
  5485. }
  5486. if (type === Static) {
  5487. removeStaticNode(vnode);
  5488. return;
  5489. }
  5490. const performRemove = () => {
  5491. hostRemove(el);
  5492. if (transition && !transition.persisted && transition.afterLeave) {
  5493. transition.afterLeave();
  5494. }
  5495. };
  5496. if (vnode.shapeFlag & 1 /* ELEMENT */ &&
  5497. transition &&
  5498. !transition.persisted) {
  5499. const { leave, delayLeave } = transition;
  5500. const performLeave = () => leave(el, performRemove);
  5501. if (delayLeave) {
  5502. delayLeave(vnode.el, performRemove, performLeave);
  5503. }
  5504. else {
  5505. performLeave();
  5506. }
  5507. }
  5508. else {
  5509. performRemove();
  5510. }
  5511. };
  5512. const removeFragment = (cur, end) => {
  5513. // For fragments, directly remove all contained DOM nodes.
  5514. // (fragment child nodes cannot have transition)
  5515. let next;
  5516. while (cur !== end) {
  5517. next = hostNextSibling(cur);
  5518. hostRemove(cur);
  5519. cur = next;
  5520. }
  5521. hostRemove(end);
  5522. };
  5523. const unmountComponent = (instance, parentSuspense, doRemove) => {
  5524. if (instance.type.__hmrId) {
  5525. unregisterHMR(instance);
  5526. }
  5527. const { bum, scope, update, subTree, um } = instance;
  5528. // beforeUnmount hook
  5529. if (bum) {
  5530. shared.invokeArrayFns(bum);
  5531. }
  5532. // stop effects in component scope
  5533. scope.stop();
  5534. // update may be null if a component is unmounted before its async
  5535. // setup has resolved.
  5536. if (update) {
  5537. // so that scheduler will no longer invoke it
  5538. update.active = false;
  5539. unmount(subTree, instance, parentSuspense, doRemove);
  5540. }
  5541. // unmounted hook
  5542. if (um) {
  5543. queuePostRenderEffect(um, parentSuspense);
  5544. }
  5545. queuePostRenderEffect(() => {
  5546. instance.isUnmounted = true;
  5547. }, parentSuspense);
  5548. // A component with async dep inside a pending suspense is unmounted before
  5549. // its async dep resolves. This should remove the dep from the suspense, and
  5550. // cause the suspense to resolve immediately if that was the last dep.
  5551. if (parentSuspense &&
  5552. parentSuspense.pendingBranch &&
  5553. !parentSuspense.isUnmounted &&
  5554. instance.asyncDep &&
  5555. !instance.asyncResolved &&
  5556. instance.suspenseId === parentSuspense.pendingId) {
  5557. parentSuspense.deps--;
  5558. if (parentSuspense.deps === 0) {
  5559. parentSuspense.resolve();
  5560. }
  5561. }
  5562. {
  5563. devtoolsComponentRemoved(instance);
  5564. }
  5565. };
  5566. const unmountChildren = (children, parentComponent, parentSuspense, doRemove = false, optimized = false, start = 0) => {
  5567. for (let i = start; i < children.length; i++) {
  5568. unmount(children[i], parentComponent, parentSuspense, doRemove, optimized);
  5569. }
  5570. };
  5571. const getNextHostNode = vnode => {
  5572. if (vnode.shapeFlag & 6 /* COMPONENT */) {
  5573. return getNextHostNode(vnode.component.subTree);
  5574. }
  5575. if (vnode.shapeFlag & 128 /* SUSPENSE */) {
  5576. return vnode.suspense.next();
  5577. }
  5578. return hostNextSibling((vnode.anchor || vnode.el));
  5579. };
  5580. const render = (vnode, container, isSVG) => {
  5581. if (vnode == null) {
  5582. if (container._vnode) {
  5583. unmount(container._vnode, null, null, true);
  5584. }
  5585. }
  5586. else {
  5587. patch(container._vnode || null, vnode, container, null, null, null, isSVG);
  5588. }
  5589. flushPostFlushCbs();
  5590. container._vnode = vnode;
  5591. };
  5592. const internals = {
  5593. p: patch,
  5594. um: unmount,
  5595. m: move,
  5596. r: remove,
  5597. mt: mountComponent,
  5598. mc: mountChildren,
  5599. pc: patchChildren,
  5600. pbc: patchBlockChildren,
  5601. n: getNextHostNode,
  5602. o: options
  5603. };
  5604. let hydrate;
  5605. let hydrateNode;
  5606. if (createHydrationFns) {
  5607. [hydrate, hydrateNode] = createHydrationFns(internals);
  5608. }
  5609. return {
  5610. render,
  5611. hydrate,
  5612. createApp: createAppAPI(render, hydrate)
  5613. };
  5614. }
  5615. function toggleRecurse({ effect, update }, allowed) {
  5616. effect.allowRecurse = update.allowRecurse = allowed;
  5617. }
  5618. /**
  5619. * #1156
  5620. * When a component is HMR-enabled, we need to make sure that all static nodes
  5621. * inside a block also inherit the DOM element from the previous tree so that
  5622. * HMR updates (which are full updates) can retrieve the element for patching.
  5623. *
  5624. * #2080
  5625. * Inside keyed `template` fragment static children, if a fragment is moved,
  5626. * the children will always be moved. Therefore, in order to ensure correct move
  5627. * position, el should be inherited from previous nodes.
  5628. */
  5629. function traverseStaticChildren(n1, n2, shallow = false) {
  5630. const ch1 = n1.children;
  5631. const ch2 = n2.children;
  5632. if (shared.isArray(ch1) && shared.isArray(ch2)) {
  5633. for (let i = 0; i < ch1.length; i++) {
  5634. // this is only called in the optimized path so array children are
  5635. // guaranteed to be vnodes
  5636. const c1 = ch1[i];
  5637. let c2 = ch2[i];
  5638. if (c2.shapeFlag & 1 /* ELEMENT */ && !c2.dynamicChildren) {
  5639. if (c2.patchFlag <= 0 || c2.patchFlag === 32 /* HYDRATE_EVENTS */) {
  5640. c2 = ch2[i] = cloneIfMounted(ch2[i]);
  5641. c2.el = c1.el;
  5642. }
  5643. if (!shallow)
  5644. traverseStaticChildren(c1, c2);
  5645. }
  5646. // also inherit for comment nodes, but not placeholders (e.g. v-if which
  5647. // would have received .el during block patch)
  5648. if (c2.type === Comment && !c2.el) {
  5649. c2.el = c1.el;
  5650. }
  5651. }
  5652. }
  5653. }
  5654. // https://en.wikipedia.org/wiki/Longest_increasing_subsequence
  5655. function getSequence(arr) {
  5656. const p = arr.slice();
  5657. const result = [0];
  5658. let i, j, u, v, c;
  5659. const len = arr.length;
  5660. for (i = 0; i < len; i++) {
  5661. const arrI = arr[i];
  5662. if (arrI !== 0) {
  5663. j = result[result.length - 1];
  5664. if (arr[j] < arrI) {
  5665. p[i] = j;
  5666. result.push(i);
  5667. continue;
  5668. }
  5669. u = 0;
  5670. v = result.length - 1;
  5671. while (u < v) {
  5672. c = (u + v) >> 1;
  5673. if (arr[result[c]] < arrI) {
  5674. u = c + 1;
  5675. }
  5676. else {
  5677. v = c;
  5678. }
  5679. }
  5680. if (arrI < arr[result[u]]) {
  5681. if (u > 0) {
  5682. p[i] = result[u - 1];
  5683. }
  5684. result[u] = i;
  5685. }
  5686. }
  5687. }
  5688. u = result.length;
  5689. v = result[u - 1];
  5690. while (u-- > 0) {
  5691. result[u] = v;
  5692. v = p[v];
  5693. }
  5694. return result;
  5695. }
  5696. const isTeleport = (type) => type.__isTeleport;
  5697. const isTeleportDisabled = (props) => props && (props.disabled || props.disabled === '');
  5698. const isTargetSVG = (target) => typeof SVGElement !== 'undefined' && target instanceof SVGElement;
  5699. const resolveTarget = (props, select) => {
  5700. const targetSelector = props && props.to;
  5701. if (shared.isString(targetSelector)) {
  5702. if (!select) {
  5703. warn(`Current renderer does not support string target for Teleports. ` +
  5704. `(missing querySelector renderer option)`);
  5705. return null;
  5706. }
  5707. else {
  5708. const target = select(targetSelector);
  5709. if (!target) {
  5710. warn(`Failed to locate Teleport target with selector "${targetSelector}". ` +
  5711. `Note the target element must exist before the component is mounted - ` +
  5712. `i.e. the target cannot be rendered by the component itself, and ` +
  5713. `ideally should be outside of the entire Vue component tree.`);
  5714. }
  5715. return target;
  5716. }
  5717. }
  5718. else {
  5719. if (!targetSelector && !isTeleportDisabled(props)) {
  5720. warn(`Invalid Teleport target: ${targetSelector}`);
  5721. }
  5722. return targetSelector;
  5723. }
  5724. };
  5725. const TeleportImpl = {
  5726. __isTeleport: true,
  5727. process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals) {
  5728. const { mc: mountChildren, pc: patchChildren, pbc: patchBlockChildren, o: { insert, querySelector, createText, createComment } } = internals;
  5729. const disabled = isTeleportDisabled(n2.props);
  5730. let { shapeFlag, children, dynamicChildren } = n2;
  5731. // #3302
  5732. // HMR updated, force full diff
  5733. if (isHmrUpdating) {
  5734. optimized = false;
  5735. dynamicChildren = null;
  5736. }
  5737. if (n1 == null) {
  5738. // insert anchors in the main view
  5739. const placeholder = (n2.el = createComment('teleport start')
  5740. );
  5741. const mainAnchor = (n2.anchor = createComment('teleport end')
  5742. );
  5743. insert(placeholder, container, anchor);
  5744. insert(mainAnchor, container, anchor);
  5745. const target = (n2.target = resolveTarget(n2.props, querySelector));
  5746. const targetAnchor = (n2.targetAnchor = createText(''));
  5747. if (target) {
  5748. insert(targetAnchor, target);
  5749. // #2652 we could be teleporting from a non-SVG tree into an SVG tree
  5750. isSVG = isSVG || isTargetSVG(target);
  5751. }
  5752. else if (!disabled) {
  5753. warn('Invalid Teleport target on mount:', target, `(${typeof target})`);
  5754. }
  5755. const mount = (container, anchor) => {
  5756. // Teleport *always* has Array children. This is enforced in both the
  5757. // compiler and vnode children normalization.
  5758. if (shapeFlag & 16 /* ARRAY_CHILDREN */) {
  5759. mountChildren(children, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
  5760. }
  5761. };
  5762. if (disabled) {
  5763. mount(container, mainAnchor);
  5764. }
  5765. else if (target) {
  5766. mount(target, targetAnchor);
  5767. }
  5768. }
  5769. else {
  5770. // update content
  5771. n2.el = n1.el;
  5772. const mainAnchor = (n2.anchor = n1.anchor);
  5773. const target = (n2.target = n1.target);
  5774. const targetAnchor = (n2.targetAnchor = n1.targetAnchor);
  5775. const wasDisabled = isTeleportDisabled(n1.props);
  5776. const currentContainer = wasDisabled ? container : target;
  5777. const currentAnchor = wasDisabled ? mainAnchor : targetAnchor;
  5778. isSVG = isSVG || isTargetSVG(target);
  5779. if (dynamicChildren) {
  5780. // fast path when the teleport happens to be a block root
  5781. patchBlockChildren(n1.dynamicChildren, dynamicChildren, currentContainer, parentComponent, parentSuspense, isSVG, slotScopeIds);
  5782. // even in block tree mode we need to make sure all root-level nodes
  5783. // in the teleport inherit previous DOM references so that they can
  5784. // be moved in future patches.
  5785. traverseStaticChildren(n1, n2, true);
  5786. }
  5787. else if (!optimized) {
  5788. patchChildren(n1, n2, currentContainer, currentAnchor, parentComponent, parentSuspense, isSVG, slotScopeIds, false);
  5789. }
  5790. if (disabled) {
  5791. if (!wasDisabled) {
  5792. // enabled -> disabled
  5793. // move into main container
  5794. moveTeleport(n2, container, mainAnchor, internals, 1 /* TOGGLE */);
  5795. }
  5796. }
  5797. else {
  5798. // target changed
  5799. if ((n2.props && n2.props.to) !== (n1.props && n1.props.to)) {
  5800. const nextTarget = (n2.target = resolveTarget(n2.props, querySelector));
  5801. if (nextTarget) {
  5802. moveTeleport(n2, nextTarget, null, internals, 0 /* TARGET_CHANGE */);
  5803. }
  5804. else {
  5805. warn('Invalid Teleport target on update:', target, `(${typeof target})`);
  5806. }
  5807. }
  5808. else if (wasDisabled) {
  5809. // disabled -> enabled
  5810. // move into teleport target
  5811. moveTeleport(n2, target, targetAnchor, internals, 1 /* TOGGLE */);
  5812. }
  5813. }
  5814. }
  5815. },
  5816. remove(vnode, parentComponent, parentSuspense, optimized, { um: unmount, o: { remove: hostRemove } }, doRemove) {
  5817. const { shapeFlag, children, anchor, targetAnchor, target, props } = vnode;
  5818. if (target) {
  5819. hostRemove(targetAnchor);
  5820. }
  5821. // an unmounted teleport should always remove its children if not disabled
  5822. if (doRemove || !isTeleportDisabled(props)) {
  5823. hostRemove(anchor);
  5824. if (shapeFlag & 16 /* ARRAY_CHILDREN */) {
  5825. for (let i = 0; i < children.length; i++) {
  5826. const child = children[i];
  5827. unmount(child, parentComponent, parentSuspense, true, !!child.dynamicChildren);
  5828. }
  5829. }
  5830. }
  5831. },
  5832. move: moveTeleport,
  5833. hydrate: hydrateTeleport
  5834. };
  5835. function moveTeleport(vnode, container, parentAnchor, { o: { insert }, m: move }, moveType = 2 /* REORDER */) {
  5836. // move target anchor if this is a target change.
  5837. if (moveType === 0 /* TARGET_CHANGE */) {
  5838. insert(vnode.targetAnchor, container, parentAnchor);
  5839. }
  5840. const { el, anchor, shapeFlag, children, props } = vnode;
  5841. const isReorder = moveType === 2 /* REORDER */;
  5842. // move main view anchor if this is a re-order.
  5843. if (isReorder) {
  5844. insert(el, container, parentAnchor);
  5845. }
  5846. // if this is a re-order and teleport is enabled (content is in target)
  5847. // do not move children. So the opposite is: only move children if this
  5848. // is not a reorder, or the teleport is disabled
  5849. if (!isReorder || isTeleportDisabled(props)) {
  5850. // Teleport has either Array children or no children.
  5851. if (shapeFlag & 16 /* ARRAY_CHILDREN */) {
  5852. for (let i = 0; i < children.length; i++) {
  5853. move(children[i], container, parentAnchor, 2 /* REORDER */);
  5854. }
  5855. }
  5856. }
  5857. // move main view anchor if this is a re-order.
  5858. if (isReorder) {
  5859. insert(anchor, container, parentAnchor);
  5860. }
  5861. }
  5862. function hydrateTeleport(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized, { o: { nextSibling, parentNode, querySelector } }, hydrateChildren) {
  5863. const target = (vnode.target = resolveTarget(vnode.props, querySelector));
  5864. if (target) {
  5865. // if multiple teleports rendered to the same target element, we need to
  5866. // pick up from where the last teleport finished instead of the first node
  5867. const targetNode = target._lpa || target.firstChild;
  5868. if (vnode.shapeFlag & 16 /* ARRAY_CHILDREN */) {
  5869. if (isTeleportDisabled(vnode.props)) {
  5870. vnode.anchor = hydrateChildren(nextSibling(node), vnode, parentNode(node), parentComponent, parentSuspense, slotScopeIds, optimized);
  5871. vnode.targetAnchor = targetNode;
  5872. }
  5873. else {
  5874. vnode.anchor = nextSibling(node);
  5875. vnode.targetAnchor = hydrateChildren(targetNode, vnode, target, parentComponent, parentSuspense, slotScopeIds, optimized);
  5876. }
  5877. target._lpa =
  5878. vnode.targetAnchor && nextSibling(vnode.targetAnchor);
  5879. }
  5880. }
  5881. return vnode.anchor && nextSibling(vnode.anchor);
  5882. }
  5883. // Force-casted public typing for h and TSX props inference
  5884. const Teleport = TeleportImpl;
  5885. const COMPONENTS = 'components';
  5886. const DIRECTIVES = 'directives';
  5887. /**
  5888. * @private
  5889. */
  5890. function resolveComponent(name, maybeSelfReference) {
  5891. return resolveAsset(COMPONENTS, name, true, maybeSelfReference) || name;
  5892. }
  5893. const NULL_DYNAMIC_COMPONENT = Symbol();
  5894. /**
  5895. * @private
  5896. */
  5897. function resolveDynamicComponent(component) {
  5898. if (shared.isString(component)) {
  5899. return resolveAsset(COMPONENTS, component, false) || component;
  5900. }
  5901. else {
  5902. // invalid types will fallthrough to createVNode and raise warning
  5903. return (component || NULL_DYNAMIC_COMPONENT);
  5904. }
  5905. }
  5906. /**
  5907. * @private
  5908. */
  5909. function resolveDirective(name) {
  5910. return resolveAsset(DIRECTIVES, name);
  5911. }
  5912. // implementation
  5913. function resolveAsset(type, name, warnMissing = true, maybeSelfReference = false) {
  5914. const instance = currentRenderingInstance || currentInstance;
  5915. if (instance) {
  5916. const Component = instance.type;
  5917. // explicit self name has highest priority
  5918. if (type === COMPONENTS) {
  5919. const selfName = getComponentName(Component);
  5920. if (selfName &&
  5921. (selfName === name ||
  5922. selfName === shared.camelize(name) ||
  5923. selfName === shared.capitalize(shared.camelize(name)))) {
  5924. return Component;
  5925. }
  5926. }
  5927. const res =
  5928. // local registration
  5929. // check instance[type] first which is resolved for options API
  5930. resolve(instance[type] || Component[type], name) ||
  5931. // global registration
  5932. resolve(instance.appContext[type], name);
  5933. if (!res && maybeSelfReference) {
  5934. // fallback to implicit self-reference
  5935. return Component;
  5936. }
  5937. if (warnMissing && !res) {
  5938. const extra = type === COMPONENTS
  5939. ? `\nIf this is a native custom element, make sure to exclude it from ` +
  5940. `component resolution via compilerOptions.isCustomElement.`
  5941. : ``;
  5942. warn(`Failed to resolve ${type.slice(0, -1)}: ${name}${extra}`);
  5943. }
  5944. return res;
  5945. }
  5946. else {
  5947. warn(`resolve${shared.capitalize(type.slice(0, -1))} ` +
  5948. `can only be used in render() or setup().`);
  5949. }
  5950. }
  5951. function resolve(registry, name) {
  5952. return (registry &&
  5953. (registry[name] ||
  5954. registry[shared.camelize(name)] ||
  5955. registry[shared.capitalize(shared.camelize(name))]));
  5956. }
  5957. const Fragment = Symbol('Fragment' );
  5958. const Text = Symbol('Text' );
  5959. const Comment = Symbol('Comment' );
  5960. const Static = Symbol('Static' );
  5961. // Since v-if and v-for are the two possible ways node structure can dynamically
  5962. // change, once we consider v-if branches and each v-for fragment a block, we
  5963. // can divide a template into nested blocks, and within each block the node
  5964. // structure would be stable. This allows us to skip most children diffing
  5965. // and only worry about the dynamic nodes (indicated by patch flags).
  5966. const blockStack = [];
  5967. let currentBlock = null;
  5968. /**
  5969. * Open a block.
  5970. * This must be called before `createBlock`. It cannot be part of `createBlock`
  5971. * because the children of the block are evaluated before `createBlock` itself
  5972. * is called. The generated code typically looks like this:
  5973. *
  5974. * ```js
  5975. * function render() {
  5976. * return (openBlock(),createBlock('div', null, [...]))
  5977. * }
  5978. * ```
  5979. * disableTracking is true when creating a v-for fragment block, since a v-for
  5980. * fragment always diffs its children.
  5981. *
  5982. * @private
  5983. */
  5984. function openBlock(disableTracking = false) {
  5985. blockStack.push((currentBlock = disableTracking ? null : []));
  5986. }
  5987. function closeBlock() {
  5988. blockStack.pop();
  5989. currentBlock = blockStack[blockStack.length - 1] || null;
  5990. }
  5991. // Whether we should be tracking dynamic child nodes inside a block.
  5992. // Only tracks when this value is > 0
  5993. // We are not using a simple boolean because this value may need to be
  5994. // incremented/decremented by nested usage of v-once (see below)
  5995. let isBlockTreeEnabled = 1;
  5996. /**
  5997. * Block tracking sometimes needs to be disabled, for example during the
  5998. * creation of a tree that needs to be cached by v-once. The compiler generates
  5999. * code like this:
  6000. *
  6001. * ``` js
  6002. * _cache[1] || (
  6003. * setBlockTracking(-1),
  6004. * _cache[1] = createVNode(...),
  6005. * setBlockTracking(1),
  6006. * _cache[1]
  6007. * )
  6008. * ```
  6009. *
  6010. * @private
  6011. */
  6012. function setBlockTracking(value) {
  6013. isBlockTreeEnabled += value;
  6014. }
  6015. function setupBlock(vnode) {
  6016. // save current block children on the block vnode
  6017. vnode.dynamicChildren =
  6018. isBlockTreeEnabled > 0 ? currentBlock || shared.EMPTY_ARR : null;
  6019. // close block
  6020. closeBlock();
  6021. // a block is always going to be patched, so track it as a child of its
  6022. // parent block
  6023. if (isBlockTreeEnabled > 0 && currentBlock) {
  6024. currentBlock.push(vnode);
  6025. }
  6026. return vnode;
  6027. }
  6028. /**
  6029. * @private
  6030. */
  6031. function createElementBlock(type, props, children, patchFlag, dynamicProps, shapeFlag) {
  6032. return setupBlock(createBaseVNode(type, props, children, patchFlag, dynamicProps, shapeFlag, true /* isBlock */));
  6033. }
  6034. /**
  6035. * Create a block root vnode. Takes the same exact arguments as `createVNode`.
  6036. * A block root keeps track of dynamic nodes within the block in the
  6037. * `dynamicChildren` array.
  6038. *
  6039. * @private
  6040. */
  6041. function createBlock(type, props, children, patchFlag, dynamicProps) {
  6042. return setupBlock(createVNode(type, props, children, patchFlag, dynamicProps, true /* isBlock: prevent a block from tracking itself */));
  6043. }
  6044. function isVNode(value) {
  6045. return value ? value.__v_isVNode === true : false;
  6046. }
  6047. function isSameVNodeType(n1, n2) {
  6048. if (n2.shapeFlag & 6 /* COMPONENT */ &&
  6049. hmrDirtyComponents.has(n2.type)) {
  6050. // HMR only: if the component has been hot-updated, force a reload.
  6051. return false;
  6052. }
  6053. return n1.type === n2.type && n1.key === n2.key;
  6054. }
  6055. let vnodeArgsTransformer;
  6056. /**
  6057. * Internal API for registering an arguments transform for createVNode
  6058. * used for creating stubs in the test-utils
  6059. * It is *internal* but needs to be exposed for test-utils to pick up proper
  6060. * typings
  6061. */
  6062. function transformVNodeArgs(transformer) {
  6063. vnodeArgsTransformer = transformer;
  6064. }
  6065. const createVNodeWithArgsTransform = (...args) => {
  6066. return _createVNode(...(vnodeArgsTransformer
  6067. ? vnodeArgsTransformer(args, currentRenderingInstance)
  6068. : args));
  6069. };
  6070. const InternalObjectKey = `__vInternal`;
  6071. const normalizeKey = ({ key }) => key != null ? key : null;
  6072. const normalizeRef = ({ ref, ref_key, ref_for }) => {
  6073. return (ref != null
  6074. ? shared.isString(ref) || reactivity.isRef(ref) || shared.isFunction(ref)
  6075. ? { i: currentRenderingInstance, r: ref, k: ref_key, f: !!ref_for }
  6076. : ref
  6077. : null);
  6078. };
  6079. function createBaseVNode(type, props = null, children = null, patchFlag = 0, dynamicProps = null, shapeFlag = type === Fragment ? 0 : 1 /* ELEMENT */, isBlockNode = false, needFullChildrenNormalization = false) {
  6080. const vnode = {
  6081. __v_isVNode: true,
  6082. __v_skip: true,
  6083. type,
  6084. props,
  6085. key: props && normalizeKey(props),
  6086. ref: props && normalizeRef(props),
  6087. scopeId: currentScopeId,
  6088. slotScopeIds: null,
  6089. children,
  6090. component: null,
  6091. suspense: null,
  6092. ssContent: null,
  6093. ssFallback: null,
  6094. dirs: null,
  6095. transition: null,
  6096. el: null,
  6097. anchor: null,
  6098. target: null,
  6099. targetAnchor: null,
  6100. staticCount: 0,
  6101. shapeFlag,
  6102. patchFlag,
  6103. dynamicProps,
  6104. dynamicChildren: null,
  6105. appContext: null
  6106. };
  6107. if (needFullChildrenNormalization) {
  6108. normalizeChildren(vnode, children);
  6109. // normalize suspense children
  6110. if (shapeFlag & 128 /* SUSPENSE */) {
  6111. type.normalize(vnode);
  6112. }
  6113. }
  6114. else if (children) {
  6115. // compiled element vnode - if children is passed, only possible types are
  6116. // string or Array.
  6117. vnode.shapeFlag |= shared.isString(children)
  6118. ? 8 /* TEXT_CHILDREN */
  6119. : 16 /* ARRAY_CHILDREN */;
  6120. }
  6121. // validate key
  6122. if (vnode.key !== vnode.key) {
  6123. warn(`VNode created with invalid key (NaN). VNode type:`, vnode.type);
  6124. }
  6125. // track vnode for block tree
  6126. if (isBlockTreeEnabled > 0 &&
  6127. // avoid a block node from tracking itself
  6128. !isBlockNode &&
  6129. // has current parent block
  6130. currentBlock &&
  6131. // presence of a patch flag indicates this node needs patching on updates.
  6132. // component nodes also should always be patched, because even if the
  6133. // component doesn't need to update, it needs to persist the instance on to
  6134. // the next vnode so that it can be properly unmounted later.
  6135. (vnode.patchFlag > 0 || shapeFlag & 6 /* COMPONENT */) &&
  6136. // the EVENTS flag is only for hydration and if it is the only flag, the
  6137. // vnode should not be considered dynamic due to handler caching.
  6138. vnode.patchFlag !== 32 /* HYDRATE_EVENTS */) {
  6139. currentBlock.push(vnode);
  6140. }
  6141. return vnode;
  6142. }
  6143. const createVNode = (createVNodeWithArgsTransform );
  6144. function _createVNode(type, props = null, children = null, patchFlag = 0, dynamicProps = null, isBlockNode = false) {
  6145. if (!type || type === NULL_DYNAMIC_COMPONENT) {
  6146. if (!type) {
  6147. warn(`Invalid vnode type when creating vnode: ${type}.`);
  6148. }
  6149. type = Comment;
  6150. }
  6151. if (isVNode(type)) {
  6152. // createVNode receiving an existing vnode. This happens in cases like
  6153. // <component :is="vnode"/>
  6154. // #2078 make sure to merge refs during the clone instead of overwriting it
  6155. const cloned = cloneVNode(type, props, true /* mergeRef: true */);
  6156. if (children) {
  6157. normalizeChildren(cloned, children);
  6158. }
  6159. return cloned;
  6160. }
  6161. // class component normalization.
  6162. if (isClassComponent(type)) {
  6163. type = type.__vccOpts;
  6164. }
  6165. // class & style normalization.
  6166. if (props) {
  6167. // for reactive or proxy objects, we need to clone it to enable mutation.
  6168. props = guardReactiveProps(props);
  6169. let { class: klass, style } = props;
  6170. if (klass && !shared.isString(klass)) {
  6171. props.class = shared.normalizeClass(klass);
  6172. }
  6173. if (shared.isObject(style)) {
  6174. // reactive state objects need to be cloned since they are likely to be
  6175. // mutated
  6176. if (reactivity.isProxy(style) && !shared.isArray(style)) {
  6177. style = shared.extend({}, style);
  6178. }
  6179. props.style = shared.normalizeStyle(style);
  6180. }
  6181. }
  6182. // encode the vnode type information into a bitmap
  6183. const shapeFlag = shared.isString(type)
  6184. ? 1 /* ELEMENT */
  6185. : isSuspense(type)
  6186. ? 128 /* SUSPENSE */
  6187. : isTeleport(type)
  6188. ? 64 /* TELEPORT */
  6189. : shared.isObject(type)
  6190. ? 4 /* STATEFUL_COMPONENT */
  6191. : shared.isFunction(type)
  6192. ? 2 /* FUNCTIONAL_COMPONENT */
  6193. : 0;
  6194. if (shapeFlag & 4 /* STATEFUL_COMPONENT */ && reactivity.isProxy(type)) {
  6195. type = reactivity.toRaw(type);
  6196. warn(`Vue received a Component which was made a reactive object. This can ` +
  6197. `lead to unnecessary performance overhead, and should be avoided by ` +
  6198. `marking the component with \`markRaw\` or using \`shallowRef\` ` +
  6199. `instead of \`ref\`.`, `\nComponent that was made reactive: `, type);
  6200. }
  6201. return createBaseVNode(type, props, children, patchFlag, dynamicProps, shapeFlag, isBlockNode, true);
  6202. }
  6203. function guardReactiveProps(props) {
  6204. if (!props)
  6205. return null;
  6206. return reactivity.isProxy(props) || InternalObjectKey in props
  6207. ? shared.extend({}, props)
  6208. : props;
  6209. }
  6210. function cloneVNode(vnode, extraProps, mergeRef = false) {
  6211. // This is intentionally NOT using spread or extend to avoid the runtime
  6212. // key enumeration cost.
  6213. const { props, ref, patchFlag, children } = vnode;
  6214. const mergedProps = extraProps ? mergeProps(props || {}, extraProps) : props;
  6215. const cloned = {
  6216. __v_isVNode: true,
  6217. __v_skip: true,
  6218. type: vnode.type,
  6219. props: mergedProps,
  6220. key: mergedProps && normalizeKey(mergedProps),
  6221. ref: extraProps && extraProps.ref
  6222. ? // #2078 in the case of <component :is="vnode" ref="extra"/>
  6223. // if the vnode itself already has a ref, cloneVNode will need to merge
  6224. // the refs so the single vnode can be set on multiple refs
  6225. mergeRef && ref
  6226. ? shared.isArray(ref)
  6227. ? ref.concat(normalizeRef(extraProps))
  6228. : [ref, normalizeRef(extraProps)]
  6229. : normalizeRef(extraProps)
  6230. : ref,
  6231. scopeId: vnode.scopeId,
  6232. slotScopeIds: vnode.slotScopeIds,
  6233. children: patchFlag === -1 /* HOISTED */ && shared.isArray(children)
  6234. ? children.map(deepCloneVNode)
  6235. : children,
  6236. target: vnode.target,
  6237. targetAnchor: vnode.targetAnchor,
  6238. staticCount: vnode.staticCount,
  6239. shapeFlag: vnode.shapeFlag,
  6240. // if the vnode is cloned with extra props, we can no longer assume its
  6241. // existing patch flag to be reliable and need to add the FULL_PROPS flag.
  6242. // note: preserve flag for fragments since they use the flag for children
  6243. // fast paths only.
  6244. patchFlag: extraProps && vnode.type !== Fragment
  6245. ? patchFlag === -1 // hoisted node
  6246. ? 16 /* FULL_PROPS */
  6247. : patchFlag | 16 /* FULL_PROPS */
  6248. : patchFlag,
  6249. dynamicProps: vnode.dynamicProps,
  6250. dynamicChildren: vnode.dynamicChildren,
  6251. appContext: vnode.appContext,
  6252. dirs: vnode.dirs,
  6253. transition: vnode.transition,
  6254. // These should technically only be non-null on mounted VNodes. However,
  6255. // they *should* be copied for kept-alive vnodes. So we just always copy
  6256. // them since them being non-null during a mount doesn't affect the logic as
  6257. // they will simply be overwritten.
  6258. component: vnode.component,
  6259. suspense: vnode.suspense,
  6260. ssContent: vnode.ssContent && cloneVNode(vnode.ssContent),
  6261. ssFallback: vnode.ssFallback && cloneVNode(vnode.ssFallback),
  6262. el: vnode.el,
  6263. anchor: vnode.anchor
  6264. };
  6265. return cloned;
  6266. }
  6267. /**
  6268. * Dev only, for HMR of hoisted vnodes reused in v-for
  6269. * https://github.com/vitejs/vite/issues/2022
  6270. */
  6271. function deepCloneVNode(vnode) {
  6272. const cloned = cloneVNode(vnode);
  6273. if (shared.isArray(vnode.children)) {
  6274. cloned.children = vnode.children.map(deepCloneVNode);
  6275. }
  6276. return cloned;
  6277. }
  6278. /**
  6279. * @private
  6280. */
  6281. function createTextVNode(text = ' ', flag = 0) {
  6282. return createVNode(Text, null, text, flag);
  6283. }
  6284. /**
  6285. * @private
  6286. */
  6287. function createStaticVNode(content, numberOfNodes) {
  6288. // A static vnode can contain multiple stringified elements, and the number
  6289. // of elements is necessary for hydration.
  6290. const vnode = createVNode(Static, null, content);
  6291. vnode.staticCount = numberOfNodes;
  6292. return vnode;
  6293. }
  6294. /**
  6295. * @private
  6296. */
  6297. function createCommentVNode(text = '',
  6298. // when used as the v-else branch, the comment node must be created as a
  6299. // block to ensure correct updates.
  6300. asBlock = false) {
  6301. return asBlock
  6302. ? (openBlock(), createBlock(Comment, null, text))
  6303. : createVNode(Comment, null, text);
  6304. }
  6305. function normalizeVNode(child) {
  6306. if (child == null || typeof child === 'boolean') {
  6307. // empty placeholder
  6308. return createVNode(Comment);
  6309. }
  6310. else if (shared.isArray(child)) {
  6311. // fragment
  6312. return createVNode(Fragment, null,
  6313. // #3666, avoid reference pollution when reusing vnode
  6314. child.slice());
  6315. }
  6316. else if (typeof child === 'object') {
  6317. // already vnode, this should be the most common since compiled templates
  6318. // always produce all-vnode children arrays
  6319. return cloneIfMounted(child);
  6320. }
  6321. else {
  6322. // strings and numbers
  6323. return createVNode(Text, null, String(child));
  6324. }
  6325. }
  6326. // optimized normalization for template-compiled render fns
  6327. function cloneIfMounted(child) {
  6328. return child.el === null || child.memo ? child : cloneVNode(child);
  6329. }
  6330. function normalizeChildren(vnode, children) {
  6331. let type = 0;
  6332. const { shapeFlag } = vnode;
  6333. if (children == null) {
  6334. children = null;
  6335. }
  6336. else if (shared.isArray(children)) {
  6337. type = 16 /* ARRAY_CHILDREN */;
  6338. }
  6339. else if (typeof children === 'object') {
  6340. if (shapeFlag & (1 /* ELEMENT */ | 64 /* TELEPORT */)) {
  6341. // Normalize slot to plain children for plain element and Teleport
  6342. const slot = children.default;
  6343. if (slot) {
  6344. // _c marker is added by withCtx() indicating this is a compiled slot
  6345. slot._c && (slot._d = false);
  6346. normalizeChildren(vnode, slot());
  6347. slot._c && (slot._d = true);
  6348. }
  6349. return;
  6350. }
  6351. else {
  6352. type = 32 /* SLOTS_CHILDREN */;
  6353. const slotFlag = children._;
  6354. if (!slotFlag && !(InternalObjectKey in children)) {
  6355. children._ctx = currentRenderingInstance;
  6356. }
  6357. else if (slotFlag === 3 /* FORWARDED */ && currentRenderingInstance) {
  6358. // a child component receives forwarded slots from the parent.
  6359. // its slot type is determined by its parent's slot type.
  6360. if (currentRenderingInstance.slots._ === 1 /* STABLE */) {
  6361. children._ = 1 /* STABLE */;
  6362. }
  6363. else {
  6364. children._ = 2 /* DYNAMIC */;
  6365. vnode.patchFlag |= 1024 /* DYNAMIC_SLOTS */;
  6366. }
  6367. }
  6368. }
  6369. }
  6370. else if (shared.isFunction(children)) {
  6371. children = { default: children, _ctx: currentRenderingInstance };
  6372. type = 32 /* SLOTS_CHILDREN */;
  6373. }
  6374. else {
  6375. children = String(children);
  6376. // force teleport children to array so it can be moved around
  6377. if (shapeFlag & 64 /* TELEPORT */) {
  6378. type = 16 /* ARRAY_CHILDREN */;
  6379. children = [createTextVNode(children)];
  6380. }
  6381. else {
  6382. type = 8 /* TEXT_CHILDREN */;
  6383. }
  6384. }
  6385. vnode.children = children;
  6386. vnode.shapeFlag |= type;
  6387. }
  6388. function mergeProps(...args) {
  6389. const ret = {};
  6390. for (let i = 0; i < args.length; i++) {
  6391. const toMerge = args[i];
  6392. for (const key in toMerge) {
  6393. if (key === 'class') {
  6394. if (ret.class !== toMerge.class) {
  6395. ret.class = shared.normalizeClass([ret.class, toMerge.class]);
  6396. }
  6397. }
  6398. else if (key === 'style') {
  6399. ret.style = shared.normalizeStyle([ret.style, toMerge.style]);
  6400. }
  6401. else if (shared.isOn(key)) {
  6402. const existing = ret[key];
  6403. const incoming = toMerge[key];
  6404. if (incoming &&
  6405. existing !== incoming &&
  6406. !(shared.isArray(existing) && existing.includes(incoming))) {
  6407. ret[key] = existing
  6408. ? [].concat(existing, incoming)
  6409. : incoming;
  6410. }
  6411. }
  6412. else if (key !== '') {
  6413. ret[key] = toMerge[key];
  6414. }
  6415. }
  6416. }
  6417. return ret;
  6418. }
  6419. function invokeVNodeHook(hook, instance, vnode, prevVNode = null) {
  6420. callWithAsyncErrorHandling(hook, instance, 7 /* VNODE_HOOK */, [
  6421. vnode,
  6422. prevVNode
  6423. ]);
  6424. }
  6425. /**
  6426. * Actual implementation
  6427. */
  6428. function renderList(source, renderItem, cache, index) {
  6429. let ret;
  6430. const cached = (cache && cache[index]);
  6431. if (shared.isArray(source) || shared.isString(source)) {
  6432. ret = new Array(source.length);
  6433. for (let i = 0, l = source.length; i < l; i++) {
  6434. ret[i] = renderItem(source[i], i, undefined, cached && cached[i]);
  6435. }
  6436. }
  6437. else if (typeof source === 'number') {
  6438. if (!Number.isInteger(source)) {
  6439. warn(`The v-for range expect an integer value but got ${source}.`);
  6440. return [];
  6441. }
  6442. ret = new Array(source);
  6443. for (let i = 0; i < source; i++) {
  6444. ret[i] = renderItem(i + 1, i, undefined, cached && cached[i]);
  6445. }
  6446. }
  6447. else if (shared.isObject(source)) {
  6448. if (source[Symbol.iterator]) {
  6449. ret = Array.from(source, (item, i) => renderItem(item, i, undefined, cached && cached[i]));
  6450. }
  6451. else {
  6452. const keys = Object.keys(source);
  6453. ret = new Array(keys.length);
  6454. for (let i = 0, l = keys.length; i < l; i++) {
  6455. const key = keys[i];
  6456. ret[i] = renderItem(source[key], key, i, cached && cached[i]);
  6457. }
  6458. }
  6459. }
  6460. else {
  6461. ret = [];
  6462. }
  6463. if (cache) {
  6464. cache[index] = ret;
  6465. }
  6466. return ret;
  6467. }
  6468. /**
  6469. * Compiler runtime helper for creating dynamic slots object
  6470. * @private
  6471. */
  6472. function createSlots(slots, dynamicSlots) {
  6473. for (let i = 0; i < dynamicSlots.length; i++) {
  6474. const slot = dynamicSlots[i];
  6475. // array of dynamic slot generated by <template v-for="..." #[...]>
  6476. if (shared.isArray(slot)) {
  6477. for (let j = 0; j < slot.length; j++) {
  6478. slots[slot[j].name] = slot[j].fn;
  6479. }
  6480. }
  6481. else if (slot) {
  6482. // conditional single slot generated by <template v-if="..." #foo>
  6483. slots[slot.name] = slot.fn;
  6484. }
  6485. }
  6486. return slots;
  6487. }
  6488. /**
  6489. * Compiler runtime helper for rendering `<slot/>`
  6490. * @private
  6491. */
  6492. function renderSlot(slots, name, props = {},
  6493. // this is not a user-facing function, so the fallback is always generated by
  6494. // the compiler and guaranteed to be a function returning an array
  6495. fallback, noSlotted) {
  6496. if (currentRenderingInstance.isCE ||
  6497. (currentRenderingInstance.parent &&
  6498. isAsyncWrapper(currentRenderingInstance.parent) &&
  6499. currentRenderingInstance.parent.isCE)) {
  6500. return createVNode('slot', name === 'default' ? null : { name }, fallback && fallback());
  6501. }
  6502. let slot = slots[name];
  6503. if (slot && slot.length > 1) {
  6504. warn(`SSR-optimized slot function detected in a non-SSR-optimized render ` +
  6505. `function. You need to mark this component with $dynamic-slots in the ` +
  6506. `parent template.`);
  6507. slot = () => [];
  6508. }
  6509. // a compiled slot disables block tracking by default to avoid manual
  6510. // invocation interfering with template-based block tracking, but in
  6511. // `renderSlot` we can be sure that it's template-based so we can force
  6512. // enable it.
  6513. if (slot && slot._c) {
  6514. slot._d = false;
  6515. }
  6516. openBlock();
  6517. const validSlotContent = slot && ensureValidVNode(slot(props));
  6518. const rendered = createBlock(Fragment, { key: props.key || `_${name}` }, validSlotContent || (fallback ? fallback() : []), validSlotContent && slots._ === 1 /* STABLE */
  6519. ? 64 /* STABLE_FRAGMENT */
  6520. : -2 /* BAIL */);
  6521. if (!noSlotted && rendered.scopeId) {
  6522. rendered.slotScopeIds = [rendered.scopeId + '-s'];
  6523. }
  6524. if (slot && slot._c) {
  6525. slot._d = true;
  6526. }
  6527. return rendered;
  6528. }
  6529. function ensureValidVNode(vnodes) {
  6530. return vnodes.some(child => {
  6531. if (!isVNode(child))
  6532. return true;
  6533. if (child.type === Comment)
  6534. return false;
  6535. if (child.type === Fragment &&
  6536. !ensureValidVNode(child.children))
  6537. return false;
  6538. return true;
  6539. })
  6540. ? vnodes
  6541. : null;
  6542. }
  6543. /**
  6544. * For prefixing keys in v-on="obj" with "on"
  6545. * @private
  6546. */
  6547. function toHandlers(obj) {
  6548. const ret = {};
  6549. if (!shared.isObject(obj)) {
  6550. warn(`v-on with no argument expects an object value.`);
  6551. return ret;
  6552. }
  6553. for (const key in obj) {
  6554. ret[shared.toHandlerKey(key)] = obj[key];
  6555. }
  6556. return ret;
  6557. }
  6558. /**
  6559. * #2437 In Vue 3, functional components do not have a public instance proxy but
  6560. * they exist in the internal parent chain. For code that relies on traversing
  6561. * public $parent chains, skip functional ones and go to the parent instead.
  6562. */
  6563. const getPublicInstance = (i) => {
  6564. if (!i)
  6565. return null;
  6566. if (isStatefulComponent(i))
  6567. return getExposeProxy(i) || i.proxy;
  6568. return getPublicInstance(i.parent);
  6569. };
  6570. const publicPropertiesMap =
  6571. // Move PURE marker to new line to workaround compiler discarding it
  6572. // due to type annotation
  6573. /*#__PURE__*/ shared.extend(Object.create(null), {
  6574. $: i => i,
  6575. $el: i => i.vnode.el,
  6576. $data: i => i.data,
  6577. $props: i => (reactivity.shallowReadonly(i.props) ),
  6578. $attrs: i => (reactivity.shallowReadonly(i.attrs) ),
  6579. $slots: i => (reactivity.shallowReadonly(i.slots) ),
  6580. $refs: i => (reactivity.shallowReadonly(i.refs) ),
  6581. $parent: i => getPublicInstance(i.parent),
  6582. $root: i => getPublicInstance(i.root),
  6583. $emit: i => i.emit,
  6584. $options: i => (resolveMergedOptions(i) ),
  6585. $forceUpdate: i => () => queueJob(i.update),
  6586. $nextTick: i => nextTick.bind(i.proxy),
  6587. $watch: i => (instanceWatch.bind(i) )
  6588. });
  6589. const PublicInstanceProxyHandlers = {
  6590. get({ _: instance }, key) {
  6591. const { ctx, setupState, data, props, accessCache, type, appContext } = instance;
  6592. // for internal formatters to know that this is a Vue instance
  6593. if (key === '__isVue') {
  6594. return true;
  6595. }
  6596. // prioritize <script setup> bindings during dev.
  6597. // this allows even properties that start with _ or $ to be used - so that
  6598. // it aligns with the production behavior where the render fn is inlined and
  6599. // indeed has access to all declared variables.
  6600. if (setupState !== shared.EMPTY_OBJ &&
  6601. setupState.__isScriptSetup &&
  6602. shared.hasOwn(setupState, key)) {
  6603. return setupState[key];
  6604. }
  6605. // data / props / ctx
  6606. // This getter gets called for every property access on the render context
  6607. // during render and is a major hotspot. The most expensive part of this
  6608. // is the multiple hasOwn() calls. It's much faster to do a simple property
  6609. // access on a plain object, so we use an accessCache object (with null
  6610. // prototype) to memoize what access type a key corresponds to.
  6611. let normalizedProps;
  6612. if (key[0] !== '$') {
  6613. const n = accessCache[key];
  6614. if (n !== undefined) {
  6615. switch (n) {
  6616. case 1 /* SETUP */:
  6617. return setupState[key];
  6618. case 2 /* DATA */:
  6619. return data[key];
  6620. case 4 /* CONTEXT */:
  6621. return ctx[key];
  6622. case 3 /* PROPS */:
  6623. return props[key];
  6624. // default: just fallthrough
  6625. }
  6626. }
  6627. else if (setupState !== shared.EMPTY_OBJ && shared.hasOwn(setupState, key)) {
  6628. accessCache[key] = 1 /* SETUP */;
  6629. return setupState[key];
  6630. }
  6631. else if (data !== shared.EMPTY_OBJ && shared.hasOwn(data, key)) {
  6632. accessCache[key] = 2 /* DATA */;
  6633. return data[key];
  6634. }
  6635. else if (
  6636. // only cache other properties when instance has declared (thus stable)
  6637. // props
  6638. (normalizedProps = instance.propsOptions[0]) &&
  6639. shared.hasOwn(normalizedProps, key)) {
  6640. accessCache[key] = 3 /* PROPS */;
  6641. return props[key];
  6642. }
  6643. else if (ctx !== shared.EMPTY_OBJ && shared.hasOwn(ctx, key)) {
  6644. accessCache[key] = 4 /* CONTEXT */;
  6645. return ctx[key];
  6646. }
  6647. else if (shouldCacheAccess) {
  6648. accessCache[key] = 0 /* OTHER */;
  6649. }
  6650. }
  6651. const publicGetter = publicPropertiesMap[key];
  6652. let cssModule, globalProperties;
  6653. // public $xxx properties
  6654. if (publicGetter) {
  6655. if (key === '$attrs') {
  6656. reactivity.track(instance, "get" /* GET */, key);
  6657. markAttrsAccessed();
  6658. }
  6659. return publicGetter(instance);
  6660. }
  6661. else if (
  6662. // css module (injected by vue-loader)
  6663. (cssModule = type.__cssModules) &&
  6664. (cssModule = cssModule[key])) {
  6665. return cssModule;
  6666. }
  6667. else if (ctx !== shared.EMPTY_OBJ && shared.hasOwn(ctx, key)) {
  6668. // user may set custom properties to `this` that start with `$`
  6669. accessCache[key] = 4 /* CONTEXT */;
  6670. return ctx[key];
  6671. }
  6672. else if (
  6673. // global properties
  6674. ((globalProperties = appContext.config.globalProperties),
  6675. shared.hasOwn(globalProperties, key))) {
  6676. {
  6677. return globalProperties[key];
  6678. }
  6679. }
  6680. else if (currentRenderingInstance &&
  6681. (!shared.isString(key) ||
  6682. // #1091 avoid internal isRef/isVNode checks on component instance leading
  6683. // to infinite warning loop
  6684. key.indexOf('__v') !== 0)) {
  6685. if (data !== shared.EMPTY_OBJ &&
  6686. (key[0] === '$' || key[0] === '_') &&
  6687. shared.hasOwn(data, key)) {
  6688. warn(`Property ${JSON.stringify(key)} must be accessed via $data because it starts with a reserved ` +
  6689. `character ("$" or "_") and is not proxied on the render context.`);
  6690. }
  6691. else if (instance === currentRenderingInstance) {
  6692. warn(`Property ${JSON.stringify(key)} was accessed during render ` +
  6693. `but is not defined on instance.`);
  6694. }
  6695. }
  6696. },
  6697. set({ _: instance }, key, value) {
  6698. const { data, setupState, ctx } = instance;
  6699. if (setupState !== shared.EMPTY_OBJ && shared.hasOwn(setupState, key)) {
  6700. setupState[key] = value;
  6701. return true;
  6702. }
  6703. else if (data !== shared.EMPTY_OBJ && shared.hasOwn(data, key)) {
  6704. data[key] = value;
  6705. return true;
  6706. }
  6707. else if (shared.hasOwn(instance.props, key)) {
  6708. warn(`Attempting to mutate prop "${key}". Props are readonly.`, instance);
  6709. return false;
  6710. }
  6711. if (key[0] === '$' && key.slice(1) in instance) {
  6712. warn(`Attempting to mutate public property "${key}". ` +
  6713. `Properties starting with $ are reserved and readonly.`, instance);
  6714. return false;
  6715. }
  6716. else {
  6717. if (key in instance.appContext.config.globalProperties) {
  6718. Object.defineProperty(ctx, key, {
  6719. enumerable: true,
  6720. configurable: true,
  6721. value
  6722. });
  6723. }
  6724. else {
  6725. ctx[key] = value;
  6726. }
  6727. }
  6728. return true;
  6729. },
  6730. has({ _: { data, setupState, accessCache, ctx, appContext, propsOptions } }, key) {
  6731. let normalizedProps;
  6732. return (!!accessCache[key] ||
  6733. (data !== shared.EMPTY_OBJ && shared.hasOwn(data, key)) ||
  6734. (setupState !== shared.EMPTY_OBJ && shared.hasOwn(setupState, key)) ||
  6735. ((normalizedProps = propsOptions[0]) && shared.hasOwn(normalizedProps, key)) ||
  6736. shared.hasOwn(ctx, key) ||
  6737. shared.hasOwn(publicPropertiesMap, key) ||
  6738. shared.hasOwn(appContext.config.globalProperties, key));
  6739. },
  6740. defineProperty(target, key, descriptor) {
  6741. if (descriptor.get != null) {
  6742. // invalidate key cache of a getter based property #5417
  6743. target._.accessCache[key] = 0;
  6744. }
  6745. else if (shared.hasOwn(descriptor, 'value')) {
  6746. this.set(target, key, descriptor.value, null);
  6747. }
  6748. return Reflect.defineProperty(target, key, descriptor);
  6749. }
  6750. };
  6751. {
  6752. PublicInstanceProxyHandlers.ownKeys = (target) => {
  6753. warn(`Avoid app logic that relies on enumerating keys on a component instance. ` +
  6754. `The keys will be empty in production mode to avoid performance overhead.`);
  6755. return Reflect.ownKeys(target);
  6756. };
  6757. }
  6758. const RuntimeCompiledPublicInstanceProxyHandlers = /*#__PURE__*/ shared.extend({}, PublicInstanceProxyHandlers, {
  6759. get(target, key) {
  6760. // fast path for unscopables when using `with` block
  6761. if (key === Symbol.unscopables) {
  6762. return;
  6763. }
  6764. return PublicInstanceProxyHandlers.get(target, key, target);
  6765. },
  6766. has(_, key) {
  6767. const has = key[0] !== '_' && !shared.isGloballyWhitelisted(key);
  6768. if (!has && PublicInstanceProxyHandlers.has(_, key)) {
  6769. warn(`Property ${JSON.stringify(key)} should not start with _ which is a reserved prefix for Vue internals.`);
  6770. }
  6771. return has;
  6772. }
  6773. });
  6774. // dev only
  6775. // In dev mode, the proxy target exposes the same properties as seen on `this`
  6776. // for easier console inspection. In prod mode it will be an empty object so
  6777. // these properties definitions can be skipped.
  6778. function createDevRenderContext(instance) {
  6779. const target = {};
  6780. // expose internal instance for proxy handlers
  6781. Object.defineProperty(target, `_`, {
  6782. configurable: true,
  6783. enumerable: false,
  6784. get: () => instance
  6785. });
  6786. // expose public properties
  6787. Object.keys(publicPropertiesMap).forEach(key => {
  6788. Object.defineProperty(target, key, {
  6789. configurable: true,
  6790. enumerable: false,
  6791. get: () => publicPropertiesMap[key](instance),
  6792. // intercepted by the proxy so no need for implementation,
  6793. // but needed to prevent set errors
  6794. set: shared.NOOP
  6795. });
  6796. });
  6797. return target;
  6798. }
  6799. // dev only
  6800. function exposePropsOnRenderContext(instance) {
  6801. const { ctx, propsOptions: [propsOptions] } = instance;
  6802. if (propsOptions) {
  6803. Object.keys(propsOptions).forEach(key => {
  6804. Object.defineProperty(ctx, key, {
  6805. enumerable: true,
  6806. configurable: true,
  6807. get: () => instance.props[key],
  6808. set: shared.NOOP
  6809. });
  6810. });
  6811. }
  6812. }
  6813. // dev only
  6814. function exposeSetupStateOnRenderContext(instance) {
  6815. const { ctx, setupState } = instance;
  6816. Object.keys(reactivity.toRaw(setupState)).forEach(key => {
  6817. if (!setupState.__isScriptSetup) {
  6818. if (key[0] === '$' || key[0] === '_') {
  6819. warn(`setup() return property ${JSON.stringify(key)} should not start with "$" or "_" ` +
  6820. `which are reserved prefixes for Vue internals.`);
  6821. return;
  6822. }
  6823. Object.defineProperty(ctx, key, {
  6824. enumerable: true,
  6825. configurable: true,
  6826. get: () => setupState[key],
  6827. set: shared.NOOP
  6828. });
  6829. }
  6830. });
  6831. }
  6832. const emptyAppContext = createAppContext();
  6833. let uid$1 = 0;
  6834. function createComponentInstance(vnode, parent, suspense) {
  6835. const type = vnode.type;
  6836. // inherit parent app context - or - if root, adopt from root vnode
  6837. const appContext = (parent ? parent.appContext : vnode.appContext) || emptyAppContext;
  6838. const instance = {
  6839. uid: uid$1++,
  6840. vnode,
  6841. type,
  6842. parent,
  6843. appContext,
  6844. root: null,
  6845. next: null,
  6846. subTree: null,
  6847. effect: null,
  6848. update: null,
  6849. scope: new reactivity.EffectScope(true /* detached */),
  6850. render: null,
  6851. proxy: null,
  6852. exposed: null,
  6853. exposeProxy: null,
  6854. withProxy: null,
  6855. provides: parent ? parent.provides : Object.create(appContext.provides),
  6856. accessCache: null,
  6857. renderCache: [],
  6858. // local resovled assets
  6859. components: null,
  6860. directives: null,
  6861. // resolved props and emits options
  6862. propsOptions: normalizePropsOptions(type, appContext),
  6863. emitsOptions: normalizeEmitsOptions(type, appContext),
  6864. // emit
  6865. emit: null,
  6866. emitted: null,
  6867. // props default value
  6868. propsDefaults: shared.EMPTY_OBJ,
  6869. // inheritAttrs
  6870. inheritAttrs: type.inheritAttrs,
  6871. // state
  6872. ctx: shared.EMPTY_OBJ,
  6873. data: shared.EMPTY_OBJ,
  6874. props: shared.EMPTY_OBJ,
  6875. attrs: shared.EMPTY_OBJ,
  6876. slots: shared.EMPTY_OBJ,
  6877. refs: shared.EMPTY_OBJ,
  6878. setupState: shared.EMPTY_OBJ,
  6879. setupContext: null,
  6880. // suspense related
  6881. suspense,
  6882. suspenseId: suspense ? suspense.pendingId : 0,
  6883. asyncDep: null,
  6884. asyncResolved: false,
  6885. // lifecycle hooks
  6886. // not using enums here because it results in computed properties
  6887. isMounted: false,
  6888. isUnmounted: false,
  6889. isDeactivated: false,
  6890. bc: null,
  6891. c: null,
  6892. bm: null,
  6893. m: null,
  6894. bu: null,
  6895. u: null,
  6896. um: null,
  6897. bum: null,
  6898. da: null,
  6899. a: null,
  6900. rtg: null,
  6901. rtc: null,
  6902. ec: null,
  6903. sp: null
  6904. };
  6905. {
  6906. instance.ctx = createDevRenderContext(instance);
  6907. }
  6908. instance.root = parent ? parent.root : instance;
  6909. instance.emit = emit$1.bind(null, instance);
  6910. // apply custom element special handling
  6911. if (vnode.ce) {
  6912. vnode.ce(instance);
  6913. }
  6914. return instance;
  6915. }
  6916. let currentInstance = null;
  6917. const getCurrentInstance = () => currentInstance || currentRenderingInstance;
  6918. const setCurrentInstance = (instance) => {
  6919. currentInstance = instance;
  6920. instance.scope.on();
  6921. };
  6922. const unsetCurrentInstance = () => {
  6923. currentInstance && currentInstance.scope.off();
  6924. currentInstance = null;
  6925. };
  6926. const isBuiltInTag = /*#__PURE__*/ shared.makeMap('slot,component');
  6927. function validateComponentName(name, config) {
  6928. const appIsNativeTag = config.isNativeTag || shared.NO;
  6929. if (isBuiltInTag(name) || appIsNativeTag(name)) {
  6930. warn('Do not use built-in or reserved HTML elements as component id: ' + name);
  6931. }
  6932. }
  6933. function isStatefulComponent(instance) {
  6934. return instance.vnode.shapeFlag & 4 /* STATEFUL_COMPONENT */;
  6935. }
  6936. let isInSSRComponentSetup = false;
  6937. function setupComponent(instance, isSSR = false) {
  6938. isInSSRComponentSetup = isSSR;
  6939. const { props, children } = instance.vnode;
  6940. const isStateful = isStatefulComponent(instance);
  6941. initProps(instance, props, isStateful, isSSR);
  6942. initSlots(instance, children);
  6943. const setupResult = isStateful
  6944. ? setupStatefulComponent(instance, isSSR)
  6945. : undefined;
  6946. isInSSRComponentSetup = false;
  6947. return setupResult;
  6948. }
  6949. function setupStatefulComponent(instance, isSSR) {
  6950. var _a;
  6951. const Component = instance.type;
  6952. {
  6953. if (Component.name) {
  6954. validateComponentName(Component.name, instance.appContext.config);
  6955. }
  6956. if (Component.components) {
  6957. const names = Object.keys(Component.components);
  6958. for (let i = 0; i < names.length; i++) {
  6959. validateComponentName(names[i], instance.appContext.config);
  6960. }
  6961. }
  6962. if (Component.directives) {
  6963. const names = Object.keys(Component.directives);
  6964. for (let i = 0; i < names.length; i++) {
  6965. validateDirectiveName(names[i]);
  6966. }
  6967. }
  6968. if (Component.compilerOptions && isRuntimeOnly()) {
  6969. warn(`"compilerOptions" is only supported when using a build of Vue that ` +
  6970. `includes the runtime compiler. Since you are using a runtime-only ` +
  6971. `build, the options should be passed via your build tool config instead.`);
  6972. }
  6973. }
  6974. // 0. create render proxy property access cache
  6975. instance.accessCache = Object.create(null);
  6976. // 1. create public instance / render proxy
  6977. // also mark it raw so it's never observed
  6978. instance.proxy = reactivity.markRaw(new Proxy(instance.ctx, PublicInstanceProxyHandlers));
  6979. {
  6980. exposePropsOnRenderContext(instance);
  6981. }
  6982. // 2. call setup()
  6983. const { setup } = Component;
  6984. if (setup) {
  6985. const setupContext = (instance.setupContext =
  6986. setup.length > 1 ? createSetupContext(instance) : null);
  6987. setCurrentInstance(instance);
  6988. reactivity.pauseTracking();
  6989. const setupResult = callWithErrorHandling(setup, instance, 0 /* SETUP_FUNCTION */, [reactivity.shallowReadonly(instance.props) , setupContext]);
  6990. reactivity.resetTracking();
  6991. unsetCurrentInstance();
  6992. if (shared.isPromise(setupResult)) {
  6993. setupResult.then(unsetCurrentInstance, unsetCurrentInstance);
  6994. if (isSSR) {
  6995. // return the promise so server-renderer can wait on it
  6996. return setupResult
  6997. .then((resolvedResult) => {
  6998. handleSetupResult(instance, resolvedResult, isSSR);
  6999. })
  7000. .catch(e => {
  7001. handleError(e, instance, 0 /* SETUP_FUNCTION */);
  7002. });
  7003. }
  7004. else {
  7005. // async setup returned Promise.
  7006. // bail here and wait for re-entry.
  7007. instance.asyncDep = setupResult;
  7008. if (!instance.suspense) {
  7009. const name = (_a = Component.name) !== null && _a !== void 0 ? _a : 'Anonymous';
  7010. warn(`Component <${name}>: setup function returned a promise, but no ` +
  7011. `<Suspense> boundary was found in the parent component tree. ` +
  7012. `A component with async setup() must be nested in a <Suspense> ` +
  7013. `in order to be rendered.`);
  7014. }
  7015. }
  7016. }
  7017. else {
  7018. handleSetupResult(instance, setupResult, isSSR);
  7019. }
  7020. }
  7021. else {
  7022. finishComponentSetup(instance, isSSR);
  7023. }
  7024. }
  7025. function handleSetupResult(instance, setupResult, isSSR) {
  7026. if (shared.isFunction(setupResult)) {
  7027. // setup returned an inline render function
  7028. if (instance.type.__ssrInlineRender) {
  7029. // when the function's name is `ssrRender` (compiled by SFC inline mode),
  7030. // set it as ssrRender instead.
  7031. instance.ssrRender = setupResult;
  7032. }
  7033. else {
  7034. instance.render = setupResult;
  7035. }
  7036. }
  7037. else if (shared.isObject(setupResult)) {
  7038. if (isVNode(setupResult)) {
  7039. warn(`setup() should not return VNodes directly - ` +
  7040. `return a render function instead.`);
  7041. }
  7042. // setup returned bindings.
  7043. // assuming a render function compiled from template is present.
  7044. {
  7045. instance.devtoolsRawSetupState = setupResult;
  7046. }
  7047. instance.setupState = reactivity.proxyRefs(setupResult);
  7048. {
  7049. exposeSetupStateOnRenderContext(instance);
  7050. }
  7051. }
  7052. else if (setupResult !== undefined) {
  7053. warn(`setup() should return an object. Received: ${setupResult === null ? 'null' : typeof setupResult}`);
  7054. }
  7055. finishComponentSetup(instance, isSSR);
  7056. }
  7057. let compile;
  7058. let installWithProxy;
  7059. /**
  7060. * For runtime-dom to register the compiler.
  7061. * Note the exported method uses any to avoid d.ts relying on the compiler types.
  7062. */
  7063. function registerRuntimeCompiler(_compile) {
  7064. compile = _compile;
  7065. installWithProxy = i => {
  7066. if (i.render._rc) {
  7067. i.withProxy = new Proxy(i.ctx, RuntimeCompiledPublicInstanceProxyHandlers);
  7068. }
  7069. };
  7070. }
  7071. // dev only
  7072. const isRuntimeOnly = () => !compile;
  7073. function finishComponentSetup(instance, isSSR, skipOptions) {
  7074. const Component = instance.type;
  7075. // template / render function normalization
  7076. // could be already set when returned from setup()
  7077. if (!instance.render) {
  7078. // only do on-the-fly compile if not in SSR - SSR on-the-fly compilation
  7079. // is done by server-renderer
  7080. if (!isSSR && compile && !Component.render) {
  7081. const template = Component.template;
  7082. if (template) {
  7083. {
  7084. startMeasure(instance, `compile`);
  7085. }
  7086. const { isCustomElement, compilerOptions } = instance.appContext.config;
  7087. const { delimiters, compilerOptions: componentCompilerOptions } = Component;
  7088. const finalCompilerOptions = shared.extend(shared.extend({
  7089. isCustomElement,
  7090. delimiters
  7091. }, compilerOptions), componentCompilerOptions);
  7092. Component.render = compile(template, finalCompilerOptions);
  7093. {
  7094. endMeasure(instance, `compile`);
  7095. }
  7096. }
  7097. }
  7098. instance.render = (Component.render || shared.NOOP);
  7099. // for runtime-compiled render functions using `with` blocks, the render
  7100. // proxy used needs a different `has` handler which is more performant and
  7101. // also only allows a whitelist of globals to fallthrough.
  7102. if (installWithProxy) {
  7103. installWithProxy(instance);
  7104. }
  7105. }
  7106. // support for 2.x options
  7107. {
  7108. setCurrentInstance(instance);
  7109. reactivity.pauseTracking();
  7110. applyOptions(instance);
  7111. reactivity.resetTracking();
  7112. unsetCurrentInstance();
  7113. }
  7114. // warn missing template/render
  7115. // the runtime compilation of template in SSR is done by server-render
  7116. if (!Component.render && instance.render === shared.NOOP && !isSSR) {
  7117. /* istanbul ignore if */
  7118. if (!compile && Component.template) {
  7119. warn(`Component provided template option but ` +
  7120. `runtime compilation is not supported in this build of Vue.` +
  7121. (``) /* should not happen */);
  7122. }
  7123. else {
  7124. warn(`Component is missing template or render function.`);
  7125. }
  7126. }
  7127. }
  7128. function createAttrsProxy(instance) {
  7129. return new Proxy(instance.attrs, {
  7130. get(target, key) {
  7131. markAttrsAccessed();
  7132. reactivity.track(instance, "get" /* GET */, '$attrs');
  7133. return target[key];
  7134. },
  7135. set() {
  7136. warn(`setupContext.attrs is readonly.`);
  7137. return false;
  7138. },
  7139. deleteProperty() {
  7140. warn(`setupContext.attrs is readonly.`);
  7141. return false;
  7142. }
  7143. }
  7144. );
  7145. }
  7146. function createSetupContext(instance) {
  7147. const expose = exposed => {
  7148. if (instance.exposed) {
  7149. warn(`expose() should be called only once per setup().`);
  7150. }
  7151. instance.exposed = exposed || {};
  7152. };
  7153. let attrs;
  7154. {
  7155. // We use getters in dev in case libs like test-utils overwrite instance
  7156. // properties (overwrites should not be done in prod)
  7157. return Object.freeze({
  7158. get attrs() {
  7159. return attrs || (attrs = createAttrsProxy(instance));
  7160. },
  7161. get slots() {
  7162. return reactivity.shallowReadonly(instance.slots);
  7163. },
  7164. get emit() {
  7165. return (event, ...args) => instance.emit(event, ...args);
  7166. },
  7167. expose
  7168. });
  7169. }
  7170. }
  7171. function getExposeProxy(instance) {
  7172. if (instance.exposed) {
  7173. return (instance.exposeProxy ||
  7174. (instance.exposeProxy = new Proxy(reactivity.proxyRefs(reactivity.markRaw(instance.exposed)), {
  7175. get(target, key) {
  7176. if (key in target) {
  7177. return target[key];
  7178. }
  7179. else if (key in publicPropertiesMap) {
  7180. return publicPropertiesMap[key](instance);
  7181. }
  7182. }
  7183. })));
  7184. }
  7185. }
  7186. const classifyRE = /(?:^|[-_])(\w)/g;
  7187. const classify = (str) => str.replace(classifyRE, c => c.toUpperCase()).replace(/[-_]/g, '');
  7188. function getComponentName(Component) {
  7189. return shared.isFunction(Component)
  7190. ? Component.displayName || Component.name
  7191. : Component.name;
  7192. }
  7193. /* istanbul ignore next */
  7194. function formatComponentName(instance, Component, isRoot = false) {
  7195. let name = getComponentName(Component);
  7196. if (!name && Component.__file) {
  7197. const match = Component.__file.match(/([^/\\]+)\.\w+$/);
  7198. if (match) {
  7199. name = match[1];
  7200. }
  7201. }
  7202. if (!name && instance && instance.parent) {
  7203. // try to infer the name based on reverse resolution
  7204. const inferFromRegistry = (registry) => {
  7205. for (const key in registry) {
  7206. if (registry[key] === Component) {
  7207. return key;
  7208. }
  7209. }
  7210. };
  7211. name =
  7212. inferFromRegistry(instance.components ||
  7213. instance.parent.type.components) || inferFromRegistry(instance.appContext.components);
  7214. }
  7215. return name ? classify(name) : isRoot ? `App` : `Anonymous`;
  7216. }
  7217. function isClassComponent(value) {
  7218. return shared.isFunction(value) && '__vccOpts' in value;
  7219. }
  7220. const computed = ((getterOrOptions, debugOptions) => {
  7221. // @ts-ignore
  7222. return reactivity.computed(getterOrOptions, debugOptions, isInSSRComponentSetup);
  7223. });
  7224. // dev only
  7225. const warnRuntimeUsage = (method) => warn(`${method}() is a compiler-hint helper that is only usable inside ` +
  7226. `<script setup> of a single file component. Its arguments should be ` +
  7227. `compiled away and passing it at runtime has no effect.`);
  7228. // implementation
  7229. function defineProps() {
  7230. {
  7231. warnRuntimeUsage(`defineProps`);
  7232. }
  7233. return null;
  7234. }
  7235. // implementation
  7236. function defineEmits() {
  7237. {
  7238. warnRuntimeUsage(`defineEmits`);
  7239. }
  7240. return null;
  7241. }
  7242. /**
  7243. * Vue `<script setup>` compiler macro for declaring a component's exposed
  7244. * instance properties when it is accessed by a parent component via template
  7245. * refs.
  7246. *
  7247. * `<script setup>` components are closed by default - i.e. variables inside
  7248. * the `<script setup>` scope is not exposed to parent unless explicitly exposed
  7249. * via `defineExpose`.
  7250. *
  7251. * This is only usable inside `<script setup>`, is compiled away in the
  7252. * output and should **not** be actually called at runtime.
  7253. */
  7254. function defineExpose(exposed) {
  7255. {
  7256. warnRuntimeUsage(`defineExpose`);
  7257. }
  7258. }
  7259. /**
  7260. * Vue `<script setup>` compiler macro for providing props default values when
  7261. * using type-based `defineProps` declaration.
  7262. *
  7263. * Example usage:
  7264. * ```ts
  7265. * withDefaults(defineProps<{
  7266. * size?: number
  7267. * labels?: string[]
  7268. * }>(), {
  7269. * size: 3,
  7270. * labels: () => ['default label']
  7271. * })
  7272. * ```
  7273. *
  7274. * This is only usable inside `<script setup>`, is compiled away in the output
  7275. * and should **not** be actually called at runtime.
  7276. */
  7277. function withDefaults(props, defaults) {
  7278. {
  7279. warnRuntimeUsage(`withDefaults`);
  7280. }
  7281. return null;
  7282. }
  7283. function useSlots() {
  7284. return getContext().slots;
  7285. }
  7286. function useAttrs() {
  7287. return getContext().attrs;
  7288. }
  7289. function getContext() {
  7290. const i = getCurrentInstance();
  7291. if (!i) {
  7292. warn(`useContext() called without active instance.`);
  7293. }
  7294. return i.setupContext || (i.setupContext = createSetupContext(i));
  7295. }
  7296. /**
  7297. * Runtime helper for merging default declarations. Imported by compiled code
  7298. * only.
  7299. * @internal
  7300. */
  7301. function mergeDefaults(raw, defaults) {
  7302. const props = shared.isArray(raw)
  7303. ? raw.reduce((normalized, p) => ((normalized[p] = {}), normalized), {})
  7304. : raw;
  7305. for (const key in defaults) {
  7306. const opt = props[key];
  7307. if (opt) {
  7308. if (shared.isArray(opt) || shared.isFunction(opt)) {
  7309. props[key] = { type: opt, default: defaults[key] };
  7310. }
  7311. else {
  7312. opt.default = defaults[key];
  7313. }
  7314. }
  7315. else if (opt === null) {
  7316. props[key] = { default: defaults[key] };
  7317. }
  7318. else {
  7319. warn(`props default key "${key}" has no corresponding declaration.`);
  7320. }
  7321. }
  7322. return props;
  7323. }
  7324. /**
  7325. * Used to create a proxy for the rest element when destructuring props with
  7326. * defineProps().
  7327. * @internal
  7328. */
  7329. function createPropsRestProxy(props, excludedKeys) {
  7330. const ret = {};
  7331. for (const key in props) {
  7332. if (!excludedKeys.includes(key)) {
  7333. Object.defineProperty(ret, key, {
  7334. enumerable: true,
  7335. get: () => props[key]
  7336. });
  7337. }
  7338. }
  7339. return ret;
  7340. }
  7341. /**
  7342. * `<script setup>` helper for persisting the current instance context over
  7343. * async/await flows.
  7344. *
  7345. * `@vue/compiler-sfc` converts the following:
  7346. *
  7347. * ```ts
  7348. * const x = await foo()
  7349. * ```
  7350. *
  7351. * into:
  7352. *
  7353. * ```ts
  7354. * let __temp, __restore
  7355. * const x = (([__temp, __restore] = withAsyncContext(() => foo())),__temp=await __temp,__restore(),__temp)
  7356. * ```
  7357. * @internal
  7358. */
  7359. function withAsyncContext(getAwaitable) {
  7360. const ctx = getCurrentInstance();
  7361. if (!ctx) {
  7362. warn(`withAsyncContext called without active current instance. ` +
  7363. `This is likely a bug.`);
  7364. }
  7365. let awaitable = getAwaitable();
  7366. unsetCurrentInstance();
  7367. if (shared.isPromise(awaitable)) {
  7368. awaitable = awaitable.catch(e => {
  7369. setCurrentInstance(ctx);
  7370. throw e;
  7371. });
  7372. }
  7373. return [awaitable, () => setCurrentInstance(ctx)];
  7374. }
  7375. // Actual implementation
  7376. function h(type, propsOrChildren, children) {
  7377. const l = arguments.length;
  7378. if (l === 2) {
  7379. if (shared.isObject(propsOrChildren) && !shared.isArray(propsOrChildren)) {
  7380. // single vnode without props
  7381. if (isVNode(propsOrChildren)) {
  7382. return createVNode(type, null, [propsOrChildren]);
  7383. }
  7384. // props without children
  7385. return createVNode(type, propsOrChildren);
  7386. }
  7387. else {
  7388. // omit props
  7389. return createVNode(type, null, propsOrChildren);
  7390. }
  7391. }
  7392. else {
  7393. if (l > 3) {
  7394. children = Array.prototype.slice.call(arguments, 2);
  7395. }
  7396. else if (l === 3 && isVNode(children)) {
  7397. children = [children];
  7398. }
  7399. return createVNode(type, propsOrChildren, children);
  7400. }
  7401. }
  7402. const ssrContextKey = Symbol(`ssrContext` );
  7403. const useSSRContext = () => {
  7404. {
  7405. const ctx = inject(ssrContextKey);
  7406. if (!ctx) {
  7407. warn(`Server rendering context not provided. Make sure to only call ` +
  7408. `useSSRContext() conditionally in the server build.`);
  7409. }
  7410. return ctx;
  7411. }
  7412. };
  7413. function isShallow(value) {
  7414. return !!(value && value["__v_isShallow" /* IS_SHALLOW */]);
  7415. }
  7416. function initCustomFormatter() {
  7417. /* eslint-disable no-restricted-globals */
  7418. if (typeof window === 'undefined') {
  7419. return;
  7420. }
  7421. const vueStyle = { style: 'color:#3ba776' };
  7422. const numberStyle = { style: 'color:#0b1bc9' };
  7423. const stringStyle = { style: 'color:#b62e24' };
  7424. const keywordStyle = { style: 'color:#9d288c' };
  7425. // custom formatter for Chrome
  7426. // https://www.mattzeunert.com/2016/02/19/custom-chrome-devtools-object-formatters.html
  7427. const formatter = {
  7428. header(obj) {
  7429. // TODO also format ComponentPublicInstance & ctx.slots/attrs in setup
  7430. if (!shared.isObject(obj)) {
  7431. return null;
  7432. }
  7433. if (obj.__isVue) {
  7434. return ['div', vueStyle, `VueInstance`];
  7435. }
  7436. else if (reactivity.isRef(obj)) {
  7437. return [
  7438. 'div',
  7439. {},
  7440. ['span', vueStyle, genRefFlag(obj)],
  7441. '<',
  7442. formatValue(obj.value),
  7443. `>`
  7444. ];
  7445. }
  7446. else if (reactivity.isReactive(obj)) {
  7447. return [
  7448. 'div',
  7449. {},
  7450. ['span', vueStyle, isShallow(obj) ? 'ShallowReactive' : 'Reactive'],
  7451. '<',
  7452. formatValue(obj),
  7453. `>${reactivity.isReadonly(obj) ? ` (readonly)` : ``}`
  7454. ];
  7455. }
  7456. else if (reactivity.isReadonly(obj)) {
  7457. return [
  7458. 'div',
  7459. {},
  7460. ['span', vueStyle, isShallow(obj) ? 'ShallowReadonly' : 'Readonly'],
  7461. '<',
  7462. formatValue(obj),
  7463. '>'
  7464. ];
  7465. }
  7466. return null;
  7467. },
  7468. hasBody(obj) {
  7469. return obj && obj.__isVue;
  7470. },
  7471. body(obj) {
  7472. if (obj && obj.__isVue) {
  7473. return [
  7474. 'div',
  7475. {},
  7476. ...formatInstance(obj.$)
  7477. ];
  7478. }
  7479. }
  7480. };
  7481. function formatInstance(instance) {
  7482. const blocks = [];
  7483. if (instance.type.props && instance.props) {
  7484. blocks.push(createInstanceBlock('props', reactivity.toRaw(instance.props)));
  7485. }
  7486. if (instance.setupState !== shared.EMPTY_OBJ) {
  7487. blocks.push(createInstanceBlock('setup', instance.setupState));
  7488. }
  7489. if (instance.data !== shared.EMPTY_OBJ) {
  7490. blocks.push(createInstanceBlock('data', reactivity.toRaw(instance.data)));
  7491. }
  7492. const computed = extractKeys(instance, 'computed');
  7493. if (computed) {
  7494. blocks.push(createInstanceBlock('computed', computed));
  7495. }
  7496. const injected = extractKeys(instance, 'inject');
  7497. if (injected) {
  7498. blocks.push(createInstanceBlock('injected', injected));
  7499. }
  7500. blocks.push([
  7501. 'div',
  7502. {},
  7503. [
  7504. 'span',
  7505. {
  7506. style: keywordStyle.style + ';opacity:0.66'
  7507. },
  7508. '$ (internal): '
  7509. ],
  7510. ['object', { object: instance }]
  7511. ]);
  7512. return blocks;
  7513. }
  7514. function createInstanceBlock(type, target) {
  7515. target = shared.extend({}, target);
  7516. if (!Object.keys(target).length) {
  7517. return ['span', {}];
  7518. }
  7519. return [
  7520. 'div',
  7521. { style: 'line-height:1.25em;margin-bottom:0.6em' },
  7522. [
  7523. 'div',
  7524. {
  7525. style: 'color:#476582'
  7526. },
  7527. type
  7528. ],
  7529. [
  7530. 'div',
  7531. {
  7532. style: 'padding-left:1.25em'
  7533. },
  7534. ...Object.keys(target).map(key => {
  7535. return [
  7536. 'div',
  7537. {},
  7538. ['span', keywordStyle, key + ': '],
  7539. formatValue(target[key], false)
  7540. ];
  7541. })
  7542. ]
  7543. ];
  7544. }
  7545. function formatValue(v, asRaw = true) {
  7546. if (typeof v === 'number') {
  7547. return ['span', numberStyle, v];
  7548. }
  7549. else if (typeof v === 'string') {
  7550. return ['span', stringStyle, JSON.stringify(v)];
  7551. }
  7552. else if (typeof v === 'boolean') {
  7553. return ['span', keywordStyle, v];
  7554. }
  7555. else if (shared.isObject(v)) {
  7556. return ['object', { object: asRaw ? reactivity.toRaw(v) : v }];
  7557. }
  7558. else {
  7559. return ['span', stringStyle, String(v)];
  7560. }
  7561. }
  7562. function extractKeys(instance, type) {
  7563. const Comp = instance.type;
  7564. if (shared.isFunction(Comp)) {
  7565. return;
  7566. }
  7567. const extracted = {};
  7568. for (const key in instance.ctx) {
  7569. if (isKeyOfType(Comp, key, type)) {
  7570. extracted[key] = instance.ctx[key];
  7571. }
  7572. }
  7573. return extracted;
  7574. }
  7575. function isKeyOfType(Comp, key, type) {
  7576. const opts = Comp[type];
  7577. if ((shared.isArray(opts) && opts.includes(key)) ||
  7578. (shared.isObject(opts) && key in opts)) {
  7579. return true;
  7580. }
  7581. if (Comp.extends && isKeyOfType(Comp.extends, key, type)) {
  7582. return true;
  7583. }
  7584. if (Comp.mixins && Comp.mixins.some(m => isKeyOfType(m, key, type))) {
  7585. return true;
  7586. }
  7587. }
  7588. function genRefFlag(v) {
  7589. if (isShallow(v)) {
  7590. return `ShallowRef`;
  7591. }
  7592. if (v.effect) {
  7593. return `ComputedRef`;
  7594. }
  7595. return `Ref`;
  7596. }
  7597. if (window.devtoolsFormatters) {
  7598. window.devtoolsFormatters.push(formatter);
  7599. }
  7600. else {
  7601. window.devtoolsFormatters = [formatter];
  7602. }
  7603. }
  7604. function withMemo(memo, render, cache, index) {
  7605. const cached = cache[index];
  7606. if (cached && isMemoSame(cached, memo)) {
  7607. return cached;
  7608. }
  7609. const ret = render();
  7610. // shallow clone
  7611. ret.memo = memo.slice();
  7612. return (cache[index] = ret);
  7613. }
  7614. function isMemoSame(cached, memo) {
  7615. const prev = cached.memo;
  7616. if (prev.length != memo.length) {
  7617. return false;
  7618. }
  7619. for (let i = 0; i < prev.length; i++) {
  7620. if (prev[i] !== memo[i]) {
  7621. return false;
  7622. }
  7623. }
  7624. // make sure to let parent block track it when returning cached
  7625. if (isBlockTreeEnabled > 0 && currentBlock) {
  7626. currentBlock.push(cached);
  7627. }
  7628. return true;
  7629. }
  7630. // Core API ------------------------------------------------------------------
  7631. const version = "3.2.33";
  7632. const _ssrUtils = {
  7633. createComponentInstance,
  7634. setupComponent,
  7635. renderComponentRoot,
  7636. setCurrentRenderingInstance,
  7637. isVNode,
  7638. normalizeVNode
  7639. };
  7640. /**
  7641. * SSR utils for \@vue/server-renderer. Only exposed in cjs builds.
  7642. * @internal
  7643. */
  7644. const ssrUtils = (_ssrUtils );
  7645. /**
  7646. * @internal only exposed in compat builds
  7647. */
  7648. const resolveFilter = null;
  7649. /**
  7650. * @internal only exposed in compat builds.
  7651. */
  7652. const compatUtils = (null);
  7653. exports.EffectScope = reactivity.EffectScope;
  7654. exports.ReactiveEffect = reactivity.ReactiveEffect;
  7655. exports.customRef = reactivity.customRef;
  7656. exports.effect = reactivity.effect;
  7657. exports.effectScope = reactivity.effectScope;
  7658. exports.getCurrentScope = reactivity.getCurrentScope;
  7659. exports.isProxy = reactivity.isProxy;
  7660. exports.isReactive = reactivity.isReactive;
  7661. exports.isReadonly = reactivity.isReadonly;
  7662. exports.isRef = reactivity.isRef;
  7663. exports.isShallow = reactivity.isShallow;
  7664. exports.markRaw = reactivity.markRaw;
  7665. exports.onScopeDispose = reactivity.onScopeDispose;
  7666. exports.proxyRefs = reactivity.proxyRefs;
  7667. exports.reactive = reactivity.reactive;
  7668. exports.readonly = reactivity.readonly;
  7669. exports.ref = reactivity.ref;
  7670. exports.shallowReactive = reactivity.shallowReactive;
  7671. exports.shallowReadonly = reactivity.shallowReadonly;
  7672. exports.shallowRef = reactivity.shallowRef;
  7673. exports.stop = reactivity.stop;
  7674. exports.toRaw = reactivity.toRaw;
  7675. exports.toRef = reactivity.toRef;
  7676. exports.toRefs = reactivity.toRefs;
  7677. exports.triggerRef = reactivity.triggerRef;
  7678. exports.unref = reactivity.unref;
  7679. exports.camelize = shared.camelize;
  7680. exports.capitalize = shared.capitalize;
  7681. exports.normalizeClass = shared.normalizeClass;
  7682. exports.normalizeProps = shared.normalizeProps;
  7683. exports.normalizeStyle = shared.normalizeStyle;
  7684. exports.toDisplayString = shared.toDisplayString;
  7685. exports.toHandlerKey = shared.toHandlerKey;
  7686. exports.BaseTransition = BaseTransition;
  7687. exports.Comment = Comment;
  7688. exports.Fragment = Fragment;
  7689. exports.KeepAlive = KeepAlive;
  7690. exports.Static = Static;
  7691. exports.Suspense = Suspense;
  7692. exports.Teleport = Teleport;
  7693. exports.Text = Text;
  7694. exports.callWithAsyncErrorHandling = callWithAsyncErrorHandling;
  7695. exports.callWithErrorHandling = callWithErrorHandling;
  7696. exports.cloneVNode = cloneVNode;
  7697. exports.compatUtils = compatUtils;
  7698. exports.computed = computed;
  7699. exports.createBlock = createBlock;
  7700. exports.createCommentVNode = createCommentVNode;
  7701. exports.createElementBlock = createElementBlock;
  7702. exports.createElementVNode = createBaseVNode;
  7703. exports.createHydrationRenderer = createHydrationRenderer;
  7704. exports.createPropsRestProxy = createPropsRestProxy;
  7705. exports.createRenderer = createRenderer;
  7706. exports.createSlots = createSlots;
  7707. exports.createStaticVNode = createStaticVNode;
  7708. exports.createTextVNode = createTextVNode;
  7709. exports.createVNode = createVNode;
  7710. exports.defineAsyncComponent = defineAsyncComponent;
  7711. exports.defineComponent = defineComponent;
  7712. exports.defineEmits = defineEmits;
  7713. exports.defineExpose = defineExpose;
  7714. exports.defineProps = defineProps;
  7715. exports.getCurrentInstance = getCurrentInstance;
  7716. exports.getTransitionRawChildren = getTransitionRawChildren;
  7717. exports.guardReactiveProps = guardReactiveProps;
  7718. exports.h = h;
  7719. exports.handleError = handleError;
  7720. exports.initCustomFormatter = initCustomFormatter;
  7721. exports.inject = inject;
  7722. exports.isMemoSame = isMemoSame;
  7723. exports.isRuntimeOnly = isRuntimeOnly;
  7724. exports.isVNode = isVNode;
  7725. exports.mergeDefaults = mergeDefaults;
  7726. exports.mergeProps = mergeProps;
  7727. exports.nextTick = nextTick;
  7728. exports.onActivated = onActivated;
  7729. exports.onBeforeMount = onBeforeMount;
  7730. exports.onBeforeUnmount = onBeforeUnmount;
  7731. exports.onBeforeUpdate = onBeforeUpdate;
  7732. exports.onDeactivated = onDeactivated;
  7733. exports.onErrorCaptured = onErrorCaptured;
  7734. exports.onMounted = onMounted;
  7735. exports.onRenderTracked = onRenderTracked;
  7736. exports.onRenderTriggered = onRenderTriggered;
  7737. exports.onServerPrefetch = onServerPrefetch;
  7738. exports.onUnmounted = onUnmounted;
  7739. exports.onUpdated = onUpdated;
  7740. exports.openBlock = openBlock;
  7741. exports.popScopeId = popScopeId;
  7742. exports.provide = provide;
  7743. exports.pushScopeId = pushScopeId;
  7744. exports.queuePostFlushCb = queuePostFlushCb;
  7745. exports.registerRuntimeCompiler = registerRuntimeCompiler;
  7746. exports.renderList = renderList;
  7747. exports.renderSlot = renderSlot;
  7748. exports.resolveComponent = resolveComponent;
  7749. exports.resolveDirective = resolveDirective;
  7750. exports.resolveDynamicComponent = resolveDynamicComponent;
  7751. exports.resolveFilter = resolveFilter;
  7752. exports.resolveTransitionHooks = resolveTransitionHooks;
  7753. exports.setBlockTracking = setBlockTracking;
  7754. exports.setDevtoolsHook = setDevtoolsHook;
  7755. exports.setTransitionHooks = setTransitionHooks;
  7756. exports.ssrContextKey = ssrContextKey;
  7757. exports.ssrUtils = ssrUtils;
  7758. exports.toHandlers = toHandlers;
  7759. exports.transformVNodeArgs = transformVNodeArgs;
  7760. exports.useAttrs = useAttrs;
  7761. exports.useSSRContext = useSSRContext;
  7762. exports.useSlots = useSlots;
  7763. exports.useTransitionState = useTransitionState;
  7764. exports.version = version;
  7765. exports.warn = warn;
  7766. exports.watch = watch;
  7767. exports.watchEffect = watchEffect;
  7768. exports.watchPostEffect = watchPostEffect;
  7769. exports.watchSyncEffect = watchSyncEffect;
  7770. exports.withAsyncContext = withAsyncContext;
  7771. exports.withCtx = withCtx;
  7772. exports.withDefaults = withDefaults;
  7773. exports.withDirectives = withDirectives;
  7774. exports.withMemo = withMemo;
  7775. exports.withScopeId = withScopeId;