[{"data":1,"prerenderedAt":377},["ShallowReactive",2],{"content-en-\u002Fsyntax\u002Fdeclarations":3},{"id":4,"title":5,"body":6,"description":370,"extension":371,"meta":372,"navigation":79,"path":373,"seo":374,"stem":375,"__hash__":376},"content_en\u002Fsyntax\u002Fdeclarations.md","Declarations",{"type":7,"value":8,"toc":362},"minimark",[9,13,22,27,93,97,137,141,204,208,223,263,271,275,305,309,339,358],[10,11,5],"h1",{"id":12},"declarations",[14,15,16,17,21],"p",{},"Inside ",[18,19,20],"code",{},"@hg"," blocks, use JavaScript-like declarations to bind template variables.",[23,24,26],"h2",{"id":25},"const-and-let","const and let",[28,29,34],"pre",{"className":30,"code":31,"language":32,"meta":33,"style":33},"language-markdown shiki shiki-themes github-light github-dark","\u003C!--\n@hg\nconst text = \"foo bar\"\nlet mutable = \"original\"\n@endhg\n-->\n\n- {{ text }}\n- {{ mutable }}\n","markdown","",[18,35,36,44,50,56,62,68,74,81,87],{"__ignoreMap":33},[37,38,41],"span",{"class":39,"line":40},"line",1,[37,42,43],{},"\u003C!--\n",[37,45,47],{"class":39,"line":46},2,[37,48,49],{},"@hg\n",[37,51,53],{"class":39,"line":52},3,[37,54,55],{},"const text = \"foo bar\"\n",[37,57,59],{"class":39,"line":58},4,[37,60,61],{},"let mutable = \"original\"\n",[37,63,65],{"class":39,"line":64},5,[37,66,67],{},"@endhg\n",[37,69,71],{"class":39,"line":70},6,[37,72,73],{},"-->\n",[37,75,77],{"class":39,"line":76},7,[37,78,80],{"emptyLinePlaceholder":79},true,"\n",[37,82,84],{"class":39,"line":83},8,[37,85,86],{},"- {{ text }}\n",[37,88,90],{"class":39,"line":89},9,[37,91,92],{},"- {{ mutable }}\n",[23,94,96],{"id":95},"reassignment","Reassignment",[28,98,100],{"className":30,"code":99,"language":32,"meta":33,"style":33},"\u003C!--\n@hg\nlet foo = \"before\"\nfoo = \"after\"\n@endhg\n-->\n\n{{ foo }}\n",[18,101,102,106,110,115,120,124,128,132],{"__ignoreMap":33},[37,103,104],{"class":39,"line":40},[37,105,43],{},[37,107,108],{"class":39,"line":46},[37,109,49],{},[37,111,112],{"class":39,"line":52},[37,113,114],{},"let foo = \"before\"\n",[37,116,117],{"class":39,"line":58},[37,118,119],{},"foo = \"after\"\n",[37,121,122],{"class":39,"line":64},[37,123,67],{},[37,125,126],{"class":39,"line":70},[37,127,73],{},[37,129,130],{"class":39,"line":76},[37,131,80],{"emptyLinePlaceholder":79},[37,133,134],{"class":39,"line":83},[37,135,136],{},"{{ foo }}\n",[23,138,140],{"id":139},"objects-and-arrays","Objects and arrays",[28,142,144],{"className":30,"code":143,"language":32,"meta":33,"style":33},"\u003C!--\n@hg\nconst object = {\n  animal: \"duck\",\n  state: \"sitting\",\n}\nconst list = [\"apple\", \"banana\"]\n@endhg\n-->\n\n- {{ object.animal }} is {{ object.state }}\n- {{ list[0] }}\n",[18,145,146,150,154,159,164,169,174,179,183,187,192,198],{"__ignoreMap":33},[37,147,148],{"class":39,"line":40},[37,149,43],{},[37,151,152],{"class":39,"line":46},[37,153,49],{},[37,155,156],{"class":39,"line":52},[37,157,158],{},"const object = {\n",[37,160,161],{"class":39,"line":58},[37,162,163],{},"  animal: \"duck\",\n",[37,165,166],{"class":39,"line":64},[37,167,168],{},"  state: \"sitting\",\n",[37,170,171],{"class":39,"line":70},[37,172,173],{},"}\n",[37,175,176],{"class":39,"line":76},[37,177,178],{},"const list = [\"apple\", \"banana\"]\n",[37,180,181],{"class":39,"line":83},[37,182,67],{},[37,184,185],{"class":39,"line":89},[37,186,73],{},[37,188,190],{"class":39,"line":189},10,[37,191,80],{"emptyLinePlaceholder":79},[37,193,195],{"class":39,"line":194},11,[37,196,197],{},"- {{ object.animal }} is {{ object.state }}\n",[37,199,201],{"class":39,"line":200},12,[37,202,203],{},"- {{ list[0] }}\n",[23,205,207],{"id":206},"template-literals","Template literals",[14,209,210,211,214,215,218,219,222],{},"Backtick strings with ",[18,212,213],{},"${expression}"," are allowed. Expressions inside ",[18,216,217],{},"${}"," follow the same whitelist as ",[18,220,221],{},"{{ }}",":",[28,224,226],{"className":30,"code":225,"language":32,"meta":33,"style":33},"\u003C!--\n@hg\nconst name = \"world\"\nconst msg = `hello ${name}`\n@endhg\n-->\n\n{{ msg }}\n",[18,227,228,232,236,241,246,250,254,258],{"__ignoreMap":33},[37,229,230],{"class":39,"line":40},[37,231,43],{},[37,233,234],{"class":39,"line":46},[37,235,49],{},[37,237,238],{"class":39,"line":52},[37,239,240],{},"const name = \"world\"\n",[37,242,243],{"class":39,"line":58},[37,244,245],{},"const msg = `hello ${name}`\n",[37,247,248],{"class":39,"line":64},[37,249,67],{},[37,251,252],{"class":39,"line":70},[37,253,73],{},[37,255,256],{"class":39,"line":76},[37,257,80],{"emptyLinePlaceholder":79},[37,259,260],{"class":39,"line":83},[37,261,262],{},"{{ msg }}\n",[14,264,265,266,270],{},"Component calls are ",[267,268,269],"strong",{},"not"," allowed inside template literal expressions.",[23,272,274],{"id":273},"allowed-updates","Allowed updates",[276,277,278,289],"ul",{},[279,280,281,284,285,288],"li",{},[18,282,283],{},"++"," \u002F ",[18,286,287],{},"--"," (prefix and postfix)",[279,290,291,292,295,296,295,299,295,302],{},"Compound assignment: ",[18,293,294],{},"+=",", ",[18,297,298],{},"-=",[18,300,301],{},"*=",[18,303,304],{},"\u002F=",[23,306,308],{"id":307},"not-allowed","Not allowed",[276,310,311,317,325,328],{},[279,312,313,316],{},[18,314,315],{},"function"," declarations and arrow functions",[279,318,319,284,322],{},[18,320,321],{},"import",[18,323,324],{},"require",[279,326,327],{},"Destructuring assignment",[279,329,330,284,333,295,336],{},[18,331,332],{},"try",[18,334,335],{},"catch",[18,337,338],{},"new",[14,340,341,342,295,345,295,348,351,352,357],{},"Reserved words (",[18,343,344],{},"if",[18,346,347],{},"each",[18,349,350],{},"include",", etc.) cannot be used as identifiers. See ",[353,354,356],"a",{"href":355},"\u002Fen\u002Fsyntax\u002Fhg-blocks","Hyogen blocks",".",[359,360,361],"style",{},"html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":33,"searchDepth":46,"depth":46,"links":363},[364,365,366,367,368,369],{"id":25,"depth":46,"text":26},{"id":95,"depth":46,"text":96},{"id":139,"depth":46,"text":140},{"id":206,"depth":46,"text":207},{"id":273,"depth":46,"text":274},{"id":307,"depth":46,"text":308},"const, let, and reassignment in @hg blocks.","md",{},"\u002Fsyntax\u002Fdeclarations",{"title":5,"description":370},"syntax\u002Fdeclarations","8y4BSFevbAQLxVpALZEk4yL7K6-pDpFebaLHlx7YBq0",1787223114963]