[{"data":1,"prerenderedAt":11090},["ShallowReactive",2],{"\u002Fen\u002Fintegrations\u002Fnextjs":3,"all-pages-\u002Fen\u002Fintegrations\u002Fnextjs":1109},{"id":4,"title":5,"body":6,"description":1101,"extension":1102,"icon":1103,"meta":1104,"navigation":99,"path":1105,"seo":1106,"stem":1107,"__hash__":1108},"content\u002Fen\u002Fintegrations\u002Fnextjs.md","Next.js",{"type":7,"value":8,"toc":1092},"minimark",[9,14,27,32,43,55,397,401,789,793,1062,1066,1072,1088],[10,11,13],"h1",{"id":12},"nextjs-integration","Next.js Integration",[15,16,17,18,22,23,26],"p",{},"The Fitting Widget works with both the ",[19,20,21],"strong",{},"Pages Router"," and ",[19,24,25],{},"App Router",".",[28,29,31],"h2",{"id":30},"app-router-recommended","App Router (Recommended)",[15,33,34,35,39,40,26],{},"Use the Next.js ",[36,37,38],"code",{},"Script"," component with ",[36,41,42],{},"strategy=\"afterInteractive\"",[44,45,47,48,51,52],"h3",{"id":46},"step-1-load-scripts-in-layouttsx-or-pagetsx","Step 1 — Load Scripts in ",[36,49,50],{},"layout.tsx"," or ",[36,53,54],{},"page.tsx",[56,57,62],"pre",{"className":58,"code":59,"language":60,"meta":61,"style":61},"language-tsx shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import Script from 'next\u002Fscript';\n\nexport default function ProductLayout({ children }: { children: React.ReactNode }) {\n return (\n \u003C>\n {children}\n\n \u003CScript\n src=\"https:\u002F\u002Fwidget.try-on.ru\u002Ffitting-widget-bundle.js\"\n strategy=\"afterInteractive\"\n id=\"fitting-widget-bundle\"\n \u002F>\n\n \u003CScript\n strategy=\"afterInteractive\"\n id=\"fitting-init\"\n >\n {`\n window.fitting = window.fitting || function() {\n (window.fitting.q = window.fitting.q || []).push(arguments);\n };\n window.fitting('init', {\n apiKey: '${process.env.NEXT_PUBLIC_TRY_ON_API_KEY}'\n });\n `}\n \u003C\u002FScript>\n \u003C\u002F>\n );\n}\n","tsx","",[36,63,64,94,101,152,161,167,179,184,193,211,226,241,247,252,259,272,286,292,301,307,313,319,325,353,359,367,378,384,392],{"__ignoreMap":61},[65,66,69,73,77,80,84,88,91],"span",{"class":67,"line":68},"line",1,[65,70,72],{"class":71},"s7zQu","import",[65,74,76],{"class":75},"sTEyZ"," Script ",[65,78,79],{"class":71},"from",[65,81,83],{"class":82},"sMK4o"," '",[65,85,87],{"class":86},"sfazB","next\u002Fscript",[65,89,90],{"class":82},"'",[65,92,93],{"class":82},";\n",[65,95,97],{"class":67,"line":96},2,[65,98,100],{"emptyLinePlaceholder":99},true,"\n",[65,102,104,107,110,114,118,121,125,128,131,134,137,141,143,146,149],{"class":67,"line":103},3,[65,105,106],{"class":71},"export",[65,108,109],{"class":71}," default",[65,111,113],{"class":112},"spNyl"," function",[65,115,117],{"class":116},"s2Zo4"," ProductLayout",[65,119,120],{"class":82},"({",[65,122,124],{"class":123},"sHdIc"," children",[65,126,127],{"class":82}," }:",[65,129,130],{"class":82}," {",[65,132,124],{"class":133},"swJcz",[65,135,136],{"class":82},":",[65,138,140],{"class":139},"sBMFI"," React",[65,142,26],{"class":82},[65,144,145],{"class":139},"ReactNode",[65,147,148],{"class":82}," })",[65,150,151],{"class":82}," {\n",[65,153,155,158],{"class":67,"line":154},4,[65,156,157],{"class":71}," return",[65,159,160],{"class":133}," (\n",[65,162,164],{"class":67,"line":163},5,[65,165,166],{"class":82}," \u003C>\n",[65,168,170,173,176],{"class":67,"line":169},6,[65,171,172],{"class":82}," {",[65,174,175],{"class":75},"children",[65,177,178],{"class":82},"}\n",[65,180,182],{"class":67,"line":181},7,[65,183,100],{"emptyLinePlaceholder":99},[65,185,187,190],{"class":67,"line":186},8,[65,188,189],{"class":82}," \u003C",[65,191,192],{"class":139},"Script\n",[65,194,196,199,202,205,208],{"class":67,"line":195},9,[65,197,198],{"class":112}," src",[65,200,201],{"class":82},"=",[65,203,204],{"class":82},"\"",[65,206,207],{"class":86},"https:\u002F\u002Fwidget.try-on.ru\u002Ffitting-widget-bundle.js",[65,209,210],{"class":82},"\"\n",[65,212,214,217,219,221,224],{"class":67,"line":213},10,[65,215,216],{"class":112}," strategy",[65,218,201],{"class":82},[65,220,204],{"class":82},[65,222,223],{"class":86},"afterInteractive",[65,225,210],{"class":82},[65,227,229,232,234,236,239],{"class":67,"line":228},11,[65,230,231],{"class":112}," id",[65,233,201],{"class":82},[65,235,204],{"class":82},[65,237,238],{"class":86},"fitting-widget-bundle",[65,240,210],{"class":82},[65,242,244],{"class":67,"line":243},12,[65,245,246],{"class":82}," \u002F>\n",[65,248,250],{"class":67,"line":249},13,[65,251,100],{"emptyLinePlaceholder":99},[65,253,255,257],{"class":67,"line":254},14,[65,256,189],{"class":82},[65,258,192],{"class":139},[65,260,262,264,266,268,270],{"class":67,"line":261},15,[65,263,216],{"class":112},[65,265,201],{"class":82},[65,267,204],{"class":82},[65,269,223],{"class":86},[65,271,210],{"class":82},[65,273,275,277,279,281,284],{"class":67,"line":274},16,[65,276,231],{"class":112},[65,278,201],{"class":82},[65,280,204],{"class":82},[65,282,283],{"class":86},"fitting-init",[65,285,210],{"class":82},[65,287,289],{"class":67,"line":288},17,[65,290,291],{"class":82}," >\n",[65,293,295,298],{"class":67,"line":294},18,[65,296,297],{"class":82}," {",[65,299,300],{"class":82},"`\n",[65,302,304],{"class":67,"line":303},19,[65,305,306],{"class":86}," window.fitting = window.fitting || function() {\n",[65,308,310],{"class":67,"line":309},20,[65,311,312],{"class":86}," (window.fitting.q = window.fitting.q || []).push(arguments);\n",[65,314,316],{"class":67,"line":315},21,[65,317,318],{"class":86}," };\n",[65,320,322],{"class":67,"line":321},22,[65,323,324],{"class":86}," window.fitting('init', {\n",[65,326,328,331,334,337,339,342,344,347,350],{"class":67,"line":327},23,[65,329,330],{"class":86}," apiKey: '",[65,332,333],{"class":82},"${",[65,335,336],{"class":75},"process",[65,338,26],{"class":82},[65,340,341],{"class":75},"env",[65,343,26],{"class":82},[65,345,346],{"class":75},"NEXT_PUBLIC_TRY_ON_API_KEY",[65,348,349],{"class":82},"}",[65,351,352],{"class":86},"'\n",[65,354,356],{"class":67,"line":355},24,[65,357,358],{"class":86}," });\n",[65,360,362,365],{"class":67,"line":361},25,[65,363,364],{"class":82}," `",[65,366,178],{"class":82},[65,368,370,373,375],{"class":67,"line":369},26,[65,371,372],{"class":82}," \u003C\u002F",[65,374,38],{"class":139},[65,376,377],{"class":82},">\n",[65,379,381],{"class":67,"line":380},27,[65,382,383],{"class":82}," \u003C\u002F>\n",[65,385,387,390],{"class":67,"line":386},28,[65,388,389],{"class":133}," )",[65,391,93],{"class":82},[65,393,395],{"class":67,"line":394},29,[65,396,178],{"class":82},[44,398,400],{"id":399},"step-2-create-the-widget-button","Step 2 — Create the Widget Button",[56,402,404],{"className":58,"code":403,"language":60,"meta":61,"style":61},"'use client';\n\ninterface TryonItem {\n productName: string;\n url: string;\n}\n\ndeclare global {\n interface Window {\n fitting: (command: string, options?: unknown) => void;\n }\n}\n\nexport function TryOnButton({ items }: { items: TryonItem[] }) {\n const handleClick = () => {\n window.fitting('create', {\n targetElementId: 'widget-container',\n model: 'balanced',\n tryonItems: items,\n });\n };\n\n return (\n \u003C>\n \u003Cdiv id=\"widget-container\" style={{ width: '100%', maxWidth: 600, aspectRatio: '3\u002F4' }} \u002F>\n \u003Cbutton onClick={handleClick}>Try On\u003C\u002Fbutton>\n \u003C\u002F>\n );\n}\n",[36,405,406,417,421,431,443,454,458,462,473,483,523,528,532,536,568,586,610,627,643,654,663,668,672,678,682,746,775,779,785],{"__ignoreMap":61},[65,407,408,410,413,415],{"class":67,"line":68},[65,409,90],{"class":82},[65,411,412],{"class":86},"use client",[65,414,90],{"class":82},[65,416,93],{"class":82},[65,418,419],{"class":67,"line":96},[65,420,100],{"emptyLinePlaceholder":99},[65,422,423,426,429],{"class":67,"line":103},[65,424,425],{"class":112},"interface",[65,427,428],{"class":139}," TryonItem",[65,430,151],{"class":82},[65,432,433,436,438,441],{"class":67,"line":154},[65,434,435],{"class":133}," productName",[65,437,136],{"class":82},[65,439,440],{"class":139}," string",[65,442,93],{"class":82},[65,444,445,448,450,452],{"class":67,"line":163},[65,446,447],{"class":133}," url",[65,449,136],{"class":82},[65,451,440],{"class":139},[65,453,93],{"class":82},[65,455,456],{"class":67,"line":169},[65,457,178],{"class":82},[65,459,460],{"class":67,"line":181},[65,461,100],{"emptyLinePlaceholder":99},[65,463,464,467,470],{"class":67,"line":186},[65,465,466],{"class":112},"declare",[65,468,469],{"class":75}," global ",[65,471,472],{"class":82},"{\n",[65,474,475,478,481],{"class":67,"line":195},[65,476,477],{"class":112}," interface",[65,479,480],{"class":139}," Window",[65,482,151],{"class":82},[65,484,485,488,490,493,496,498,500,503,506,509,512,515,518,521],{"class":67,"line":213},[65,486,487],{"class":133}," fitting",[65,489,136],{"class":82},[65,491,492],{"class":82}," (",[65,494,495],{"class":123},"command",[65,497,136],{"class":82},[65,499,440],{"class":139},[65,501,502],{"class":82},",",[65,504,505],{"class":123}," options",[65,507,508],{"class":82},"?:",[65,510,511],{"class":139}," unknown",[65,513,514],{"class":82},")",[65,516,517],{"class":112}," =>",[65,519,520],{"class":139}," void",[65,522,93],{"class":82},[65,524,525],{"class":67,"line":228},[65,526,527],{"class":82}," }\n",[65,529,530],{"class":67,"line":243},[65,531,178],{"class":82},[65,533,534],{"class":67,"line":249},[65,535,100],{"emptyLinePlaceholder":99},[65,537,538,540,542,545,547,550,552,554,556,558,560,563,566],{"class":67,"line":254},[65,539,106],{"class":71},[65,541,113],{"class":112},[65,543,544],{"class":116}," TryOnButton",[65,546,120],{"class":82},[65,548,549],{"class":123}," items",[65,551,127],{"class":82},[65,553,130],{"class":82},[65,555,549],{"class":133},[65,557,136],{"class":82},[65,559,428],{"class":139},[65,561,562],{"class":75},"[] ",[65,564,565],{"class":82},"})",[65,567,151],{"class":82},[65,569,570,573,576,579,582,584],{"class":67,"line":261},[65,571,572],{"class":112}," const",[65,574,575],{"class":75}," handleClick",[65,577,578],{"class":82}," =",[65,580,581],{"class":82}," ()",[65,583,517],{"class":112},[65,585,151],{"class":82},[65,587,588,591,593,596,599,601,604,606,608],{"class":67,"line":274},[65,589,590],{"class":75}," window",[65,592,26],{"class":82},[65,594,595],{"class":116},"fitting",[65,597,598],{"class":133},"(",[65,600,90],{"class":82},[65,602,603],{"class":86},"create",[65,605,90],{"class":82},[65,607,502],{"class":82},[65,609,151],{"class":82},[65,611,612,615,617,619,622,624],{"class":67,"line":288},[65,613,614],{"class":133}," targetElementId",[65,616,136],{"class":82},[65,618,83],{"class":82},[65,620,621],{"class":86},"widget-container",[65,623,90],{"class":82},[65,625,626],{"class":82},",\n",[65,628,629,632,634,636,639,641],{"class":67,"line":294},[65,630,631],{"class":133}," model",[65,633,136],{"class":82},[65,635,83],{"class":82},[65,637,638],{"class":86},"balanced",[65,640,90],{"class":82},[65,642,626],{"class":82},[65,644,645,648,650,652],{"class":67,"line":303},[65,646,647],{"class":133}," tryonItems",[65,649,136],{"class":82},[65,651,549],{"class":75},[65,653,626],{"class":82},[65,655,656,659,661],{"class":67,"line":309},[65,657,658],{"class":82}," }",[65,660,514],{"class":133},[65,662,93],{"class":82},[65,664,665],{"class":67,"line":315},[65,666,667],{"class":82}," };\n",[65,669,670],{"class":67,"line":321},[65,671,100],{"emptyLinePlaceholder":99},[65,673,674,676],{"class":67,"line":327},[65,675,157],{"class":71},[65,677,160],{"class":133},[65,679,680],{"class":67,"line":355},[65,681,166],{"class":82},[65,683,684,686,689,692,694,696,698,700,703,706,709,711,713,716,718,720,723,725,729,731,734,736,738,741,743],{"class":67,"line":361},[65,685,189],{"class":82},[65,687,688],{"class":133},"div",[65,690,691],{"class":112}," id",[65,693,201],{"class":82},[65,695,204],{"class":82},[65,697,621],{"class":86},[65,699,204],{"class":82},[65,701,702],{"class":112}," style",[65,704,705],{"class":82},"={{",[65,707,708],{"class":133}," width",[65,710,136],{"class":82},[65,712,83],{"class":82},[65,714,715],{"class":86},"100%",[65,717,90],{"class":82},[65,719,502],{"class":82},[65,721,722],{"class":133}," maxWidth",[65,724,136],{"class":82},[65,726,728],{"class":727},"sbssI"," 600",[65,730,502],{"class":82},[65,732,733],{"class":133}," aspectRatio",[65,735,136],{"class":82},[65,737,83],{"class":82},[65,739,740],{"class":86},"3\u002F4",[65,742,90],{"class":82},[65,744,745],{"class":82}," }} \u002F>\n",[65,747,748,750,753,756,759,762,765,768,771,773],{"class":67,"line":369},[65,749,189],{"class":82},[65,751,752],{"class":133},"button",[65,754,755],{"class":112}," onClick",[65,757,758],{"class":82},"={",[65,760,761],{"class":75},"handleClick",[65,763,764],{"class":82},"}>",[65,766,767],{"class":75},"Try On",[65,769,770],{"class":82},"\u003C\u002F",[65,772,752],{"class":133},[65,774,377],{"class":82},[65,776,777],{"class":67,"line":380},[65,778,383],{"class":82},[65,780,781,783],{"class":67,"line":386},[65,782,389],{"class":133},[65,784,93],{"class":82},[65,786,787],{"class":67,"line":394},[65,788,178],{"class":82},[44,790,792],{"id":791},"step-3-use-in-a-product-page","Step 3 — Use in a Product Page",[56,794,796],{"className":58,"code":795,"language":60,"meta":61,"style":61},"import { TryOnButton } from '@\u002Fcomponents\u002FTryOnButton';\n\nexport default async function ProductPage({ params }: { params: { slug: string } }) {\n const product = await getProduct(params.slug);\n\n return (\n \u003Cdiv>\n \u003Ch1>{product.name}\u003C\u002Fh1>\n \u003Cimg src={product.image} alt={product.name} \u002F>\n \u003CTryOnButton\n items={[\n {\n productName: product.name,\n url: product.image,\n },\n ]}\n \u002F>\n \u003C\u002Fdiv>\n );\n}\n",[36,797,798,821,825,867,896,900,906,915,939,975,982,992,997,1012,1027,1032,1039,1043,1052,1058],{"__ignoreMap":61},[65,799,800,802,804,806,809,812,814,817,819],{"class":67,"line":68},[65,801,72],{"class":71},[65,803,130],{"class":82},[65,805,544],{"class":75},[65,807,808],{"class":82}," }",[65,810,811],{"class":71}," from",[65,813,83],{"class":82},[65,815,816],{"class":86},"@\u002Fcomponents\u002FTryOnButton",[65,818,90],{"class":82},[65,820,93],{"class":82},[65,822,823],{"class":67,"line":96},[65,824,100],{"emptyLinePlaceholder":99},[65,826,827,829,831,834,836,839,841,844,846,848,850,852,854,857,859,861,863,865],{"class":67,"line":103},[65,828,106],{"class":71},[65,830,109],{"class":71},[65,832,833],{"class":112}," async",[65,835,113],{"class":112},[65,837,838],{"class":116}," ProductPage",[65,840,120],{"class":82},[65,842,843],{"class":123}," params",[65,845,127],{"class":82},[65,847,130],{"class":82},[65,849,843],{"class":133},[65,851,136],{"class":82},[65,853,130],{"class":82},[65,855,856],{"class":133}," slug",[65,858,136],{"class":82},[65,860,440],{"class":139},[65,862,808],{"class":82},[65,864,148],{"class":82},[65,866,151],{"class":82},[65,868,869,871,874,876,879,882,884,887,889,892,894],{"class":67,"line":154},[65,870,572],{"class":112},[65,872,873],{"class":75}," product",[65,875,578],{"class":82},[65,877,878],{"class":71}," await",[65,880,881],{"class":116}," getProduct",[65,883,598],{"class":133},[65,885,886],{"class":75},"params",[65,888,26],{"class":82},[65,890,891],{"class":75},"slug",[65,893,514],{"class":133},[65,895,93],{"class":82},[65,897,898],{"class":67,"line":163},[65,899,100],{"emptyLinePlaceholder":99},[65,901,902,904],{"class":67,"line":169},[65,903,157],{"class":71},[65,905,160],{"class":133},[65,907,908,911,913],{"class":67,"line":181},[65,909,910],{"class":82}," \u003C",[65,912,688],{"class":133},[65,914,377],{"class":82},[65,916,917,919,921,924,927,929,932,935,937],{"class":67,"line":186},[65,918,189],{"class":82},[65,920,10],{"class":133},[65,922,923],{"class":82},">{",[65,925,926],{"class":75},"product",[65,928,26],{"class":82},[65,930,931],{"class":75},"name",[65,933,934],{"class":82},"}\u003C\u002F",[65,936,10],{"class":133},[65,938,377],{"class":82},[65,940,941,943,946,949,951,953,955,958,961,964,966,968,970,972],{"class":67,"line":195},[65,942,189],{"class":82},[65,944,945],{"class":133},"img",[65,947,948],{"class":112}," src",[65,950,758],{"class":82},[65,952,926],{"class":75},[65,954,26],{"class":82},[65,956,957],{"class":75},"image",[65,959,960],{"class":82},"} ",[65,962,963],{"class":112},"alt",[65,965,758],{"class":82},[65,967,926],{"class":75},[65,969,26],{"class":82},[65,971,931],{"class":75},[65,973,974],{"class":82},"} \u002F>\n",[65,976,977,979],{"class":67,"line":213},[65,978,189],{"class":82},[65,980,981],{"class":139},"TryOnButton\n",[65,983,984,987,989],{"class":67,"line":228},[65,985,986],{"class":112}," items",[65,988,758],{"class":82},[65,990,991],{"class":75},"[\n",[65,993,994],{"class":67,"line":243},[65,995,996],{"class":82}," {\n",[65,998,999,1002,1004,1006,1008,1010],{"class":67,"line":249},[65,1000,1001],{"class":133}," productName",[65,1003,136],{"class":82},[65,1005,873],{"class":75},[65,1007,26],{"class":82},[65,1009,931],{"class":75},[65,1011,626],{"class":82},[65,1013,1014,1017,1019,1021,1023,1025],{"class":67,"line":254},[65,1015,1016],{"class":133}," url",[65,1018,136],{"class":82},[65,1020,873],{"class":75},[65,1022,26],{"class":82},[65,1024,957],{"class":75},[65,1026,626],{"class":82},[65,1028,1029],{"class":67,"line":261},[65,1030,1031],{"class":82}," },\n",[65,1033,1034,1037],{"class":67,"line":274},[65,1035,1036],{"class":75}," ]",[65,1038,178],{"class":82},[65,1040,1041],{"class":67,"line":288},[65,1042,246],{"class":82},[65,1044,1045,1048,1050],{"class":67,"line":294},[65,1046,1047],{"class":82}," \u003C\u002F",[65,1049,688],{"class":133},[65,1051,377],{"class":82},[65,1053,1054,1056],{"class":67,"line":303},[65,1055,389],{"class":133},[65,1057,93],{"class":82},[65,1059,1060],{"class":67,"line":309},[65,1061,178],{"class":82},[28,1063,1065],{"id":1064},"environment-variable","Environment Variable",[15,1067,1068,1069,136],{},"Add your API key to ",[36,1070,1071],{},".env.local",[56,1073,1077],{"className":1074,"code":1075,"language":1076,"meta":61,"style":61},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","NEXT_PUBLIC_TRY_ON_API_KEY=pk_live_xxx\n","bash",[36,1078,1079],{"__ignoreMap":61},[65,1080,1081,1083,1085],{"class":67,"line":68},[65,1082,346],{"class":75},[65,1084,201],{"class":82},[65,1086,1087],{"class":86},"pk_live_xxx\n",[1089,1090,1091],"style",{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}",{"title":61,"searchDepth":96,"depth":96,"links":1093},[1094,1100],{"id":30,"depth":96,"text":31,"children":1095},[1096,1098,1099],{"id":46,"depth":103,"text":1097},"Step 1 — Load Scripts in layout.tsx or page.tsx",{"id":399,"depth":103,"text":400},{"id":791,"depth":103,"text":792},{"id":1064,"depth":96,"text":1065},"Integrate with Next.js (Pages Router & App Router)","md","i-lucide-triangle",{},"\u002Fen\u002Fintegrations\u002Fnextjs",{"title":5,"description":1101},"en\u002Fintegrations\u002Fnextjs","JdA3Sttp8qaffNRKpcg9b3i_J2nMxDOCfnya8RjA3yU",[1110,1488,1824,2282,2372,3229,4138,5032,5712,6567,6984,7071,7954,8775,9624,10252],{"id":1111,"title":1112,"body":1113,"description":1481,"extension":1102,"icon":1482,"meta":1483,"navigation":99,"path":1484,"seo":1485,"stem":1486,"__hash__":1487},"content\u002Fapi\u002Findex.md","Справочник API",{"type":7,"value":1114,"toc":1475},[1115,1118,1122,1125,1170,1223,1226,1230,1233,1303,1307,1350,1472],[10,1116,1112],{"id":1117},"справочник-api",[28,1119,1121],{"id":1120},"windowfittinginit-options","window.fitting('init', options)",[15,1123,1124],{},"Инициализирует виджет. Вызывается один раз, до всех остальных методов.",[1126,1127,1128,1148],"table",{},[1129,1130,1131],"thead",{},[1132,1133,1134,1138,1141,1145],"tr",{},[1135,1136,1137],"th",{},"Параметр",[1135,1139,1140],{},"Тип",[1135,1142,1144],{"align":1143},"center","Обязателен",[1135,1146,1147],{},"Описание",[1149,1150,1151],"tbody",{},[1132,1152,1153,1159,1164,1167],{},[1154,1155,1156],"td",{},[36,1157,1158],{},"apiKey",[1154,1160,1161],{},[36,1162,1163],{},"string",[1154,1165,1166],{"align":1143},"Да",[1154,1168,1169],{},"Ваш API-ключ виджета",[56,1171,1175],{"className":1172,"code":1173,"language":1174,"meta":61,"style":61},"language-js shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","window.fitting('init', {\n apiKey: 'pk_live_xxx',\n});\n","js",[36,1176,1177,1199,1215],{"__ignoreMap":61},[65,1178,1179,1182,1184,1186,1188,1190,1193,1195,1197],{"class":67,"line":68},[65,1180,1181],{"class":75},"window",[65,1183,26],{"class":82},[65,1185,595],{"class":116},[65,1187,598],{"class":75},[65,1189,90],{"class":82},[65,1191,1192],{"class":86},"init",[65,1194,90],{"class":82},[65,1196,502],{"class":82},[65,1198,151],{"class":82},[65,1200,1201,1204,1206,1208,1211,1213],{"class":67,"line":96},[65,1202,1203],{"class":133}," apiKey",[65,1205,136],{"class":82},[65,1207,83],{"class":82},[65,1209,1210],{"class":86},"pk_live_xxx",[65,1212,90],{"class":82},[65,1214,626],{"class":82},[65,1216,1217,1219,1221],{"class":67,"line":103},[65,1218,349],{"class":82},[65,1220,514],{"class":75},[65,1222,93],{"class":82},[1224,1225],"hr",{},[28,1227,1229],{"id":1228},"windowfittingcreate-options","window.fitting('create', options)",[15,1231,1232],{},"Запускает виртуальную примерку.",[1126,1234,1235,1247],{},[1129,1236,1237],{},[1132,1238,1239,1241,1243,1245],{},[1135,1240,1137],{},[1135,1242,1140],{},[1135,1244,1144],{"align":1143},[1135,1246,1147],{},[1149,1248,1249,1265,1282],{},[1132,1250,1251,1256,1260,1262],{},[1154,1252,1253],{},[36,1254,1255],{},"targetElementId",[1154,1257,1258],{},[36,1259,1163],{},[1154,1261,1166],{"align":1143},[1154,1263,1264],{},"ID контейнера, в котором отображается виджет",[1132,1266,1267,1272,1277,1279],{},[1154,1268,1269],{},[36,1270,1271],{},"tryonItems",[1154,1273,1274],{},[36,1275,1276],{},"TryonItem[]",[1154,1278,1166],{"align":1143},[1154,1280,1281],{},"Массив товаров, доступных для примерки",[1132,1283,1284,1289,1294,1297],{},[1154,1285,1286],{},[36,1287,1288],{},"model",[1154,1290,1291],{},[36,1292,1293],{},"'balanced' | 'quality' | 'performance'",[1154,1295,1296],{"align":1143},"Нет",[1154,1298,1299,1300,514],{},"Режим отрисовки (по умолчанию: ",[36,1301,1302],{},"'balanced'",[44,1304,1306],{"id":1305},"tryonitem","TryonItem",[1126,1308,1309,1320],{},[1129,1310,1311],{},[1132,1312,1313,1316,1318],{},[1135,1314,1315],{},"Поле",[1135,1317,1140],{},[1135,1319,1147],{},[1149,1321,1322,1336],{},[1132,1323,1324,1329,1333],{},[1154,1325,1326],{},[36,1327,1328],{},"productName",[1154,1330,1331],{},[36,1332,1163],{},[1154,1334,1335],{},"Отображаемое название товара",[1132,1337,1338,1343,1347],{},[1154,1339,1340],{},[36,1341,1342],{},"url",[1154,1344,1345],{},[36,1346,1163],{},[1154,1348,1349],{},"Полный URL изображения товара",[56,1351,1353],{"className":1172,"code":1352,"language":1174,"meta":61,"style":61},"window.fitting('create', {\n targetElementId: 'widget-container',\n model: 'balanced',\n tryonItems: [\n {\n productName: 'Джинсовая куртка',\n url: 'https:\u002F\u002Fexample.com\u002Fjacket.png',\n },\n ],\n});\n",[36,1354,1355,1375,1390,1405,1415,1420,1436,1452,1457,1464],{"__ignoreMap":61},[65,1356,1357,1359,1361,1363,1365,1367,1369,1371,1373],{"class":67,"line":68},[65,1358,1181],{"class":75},[65,1360,26],{"class":82},[65,1362,595],{"class":116},[65,1364,598],{"class":75},[65,1366,90],{"class":82},[65,1368,603],{"class":86},[65,1370,90],{"class":82},[65,1372,502],{"class":82},[65,1374,151],{"class":82},[65,1376,1377,1380,1382,1384,1386,1388],{"class":67,"line":96},[65,1378,1379],{"class":133}," targetElementId",[65,1381,136],{"class":82},[65,1383,83],{"class":82},[65,1385,621],{"class":86},[65,1387,90],{"class":82},[65,1389,626],{"class":82},[65,1391,1392,1395,1397,1399,1401,1403],{"class":67,"line":103},[65,1393,1394],{"class":133}," model",[65,1396,136],{"class":82},[65,1398,83],{"class":82},[65,1400,638],{"class":86},[65,1402,90],{"class":82},[65,1404,626],{"class":82},[65,1406,1407,1410,1412],{"class":67,"line":154},[65,1408,1409],{"class":133}," tryonItems",[65,1411,136],{"class":82},[65,1413,1414],{"class":75}," [\n",[65,1416,1417],{"class":67,"line":163},[65,1418,1419],{"class":82}," {\n",[65,1421,1422,1425,1427,1429,1432,1434],{"class":67,"line":169},[65,1423,1424],{"class":133}," productName",[65,1426,136],{"class":82},[65,1428,83],{"class":82},[65,1430,1431],{"class":86},"Джинсовая куртка",[65,1433,90],{"class":82},[65,1435,626],{"class":82},[65,1437,1438,1441,1443,1445,1448,1450],{"class":67,"line":181},[65,1439,1440],{"class":133}," url",[65,1442,136],{"class":82},[65,1444,83],{"class":82},[65,1446,1447],{"class":86},"https:\u002F\u002Fexample.com\u002Fjacket.png",[65,1449,90],{"class":82},[65,1451,626],{"class":82},[65,1453,1454],{"class":67,"line":186},[65,1455,1456],{"class":82}," },\n",[65,1458,1459,1462],{"class":67,"line":195},[65,1460,1461],{"class":75}," ]",[65,1463,626],{"class":82},[65,1465,1466,1468,1470],{"class":67,"line":213},[65,1467,349],{"class":82},[65,1469,514],{"class":75},[65,1471,93],{"class":82},[1089,1473,1474],{},"html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":61,"searchDepth":96,"depth":96,"links":1476},[1477,1478],{"id":1120,"depth":96,"text":1121},{"id":1228,"depth":96,"text":1229,"children":1479},[1480],{"id":1305,"depth":103,"text":1306},"Полный справочник по API Fitting Widget","i-lucide-code",{},"\u002Fapi",{"title":1112,"description":1481},"api\u002Findex","nBz9Z0BX1B-BPJzD-HVF5oHrejoQd0__hLi-_PGCmvk",{"id":1489,"title":1490,"body":1491,"description":1818,"extension":1102,"icon":1482,"meta":1819,"navigation":99,"path":1820,"seo":1821,"stem":1822,"__hash__":1823},"content\u002Fen\u002Fapi\u002Findex.md","API Reference",{"type":7,"value":1492,"toc":1812},[1493,1496,1498,1501,1537,1583,1585,1587,1590,1655,1657,1698,1810],[10,1494,1490],{"id":1495},"api-reference",[28,1497,1121],{"id":1120},[15,1499,1500],{},"Initializes the widget. Call this once, before any other methods.",[1126,1502,1503,1519],{},[1129,1504,1505],{},[1132,1506,1507,1510,1513,1516],{},[1135,1508,1509],{},"Parameter",[1135,1511,1512],{},"Type",[1135,1514,1515],{"align":1143},"Required",[1135,1517,1518],{},"Description",[1149,1520,1521],{},[1132,1522,1523,1527,1531,1534],{},[1154,1524,1525],{},[36,1526,1158],{},[1154,1528,1529],{},[36,1530,1163],{},[1154,1532,1533],{"align":1143},"Yes",[1154,1535,1536],{},"Your widget API key",[56,1538,1539],{"className":1172,"code":1173,"language":1174,"meta":61,"style":61},[36,1540,1541,1561,1575],{"__ignoreMap":61},[65,1542,1543,1545,1547,1549,1551,1553,1555,1557,1559],{"class":67,"line":68},[65,1544,1181],{"class":75},[65,1546,26],{"class":82},[65,1548,595],{"class":116},[65,1550,598],{"class":75},[65,1552,90],{"class":82},[65,1554,1192],{"class":86},[65,1556,90],{"class":82},[65,1558,502],{"class":82},[65,1560,151],{"class":82},[65,1562,1563,1565,1567,1569,1571,1573],{"class":67,"line":96},[65,1564,1203],{"class":133},[65,1566,136],{"class":82},[65,1568,83],{"class":82},[65,1570,1210],{"class":86},[65,1572,90],{"class":82},[65,1574,626],{"class":82},[65,1576,1577,1579,1581],{"class":67,"line":103},[65,1578,349],{"class":82},[65,1580,514],{"class":75},[65,1582,93],{"class":82},[1224,1584],{},[28,1586,1229],{"id":1228},[15,1588,1589],{},"Opens the virtual try-on experience.",[1126,1591,1592,1604],{},[1129,1593,1594],{},[1132,1595,1596,1598,1600,1602],{},[1135,1597,1509],{},[1135,1599,1512],{},[1135,1601,1515],{"align":1143},[1135,1603,1518],{},[1149,1605,1606,1621,1636],{},[1132,1607,1608,1612,1616,1618],{},[1154,1609,1610],{},[36,1611,1255],{},[1154,1613,1614],{},[36,1615,1163],{},[1154,1617,1533],{"align":1143},[1154,1619,1620],{},"ID of the container element where the widget renders",[1132,1622,1623,1627,1631,1633],{},[1154,1624,1625],{},[36,1626,1271],{},[1154,1628,1629],{},[36,1630,1276],{},[1154,1632,1533],{"align":1143},[1154,1634,1635],{},"Array of items available for try-on",[1132,1637,1638,1642,1647,1650],{},[1154,1639,1640],{},[36,1641,1288],{},[1154,1643,1644],{},[36,1645,1646],{},"'balanced' | 'quality' | 'speed'",[1154,1648,1649],{"align":1143},"No",[1154,1651,1652,1653,514],{},"Rendering model (default: ",[36,1654,1302],{},[44,1656,1306],{"id":1305},[1126,1658,1659,1670],{},[1129,1660,1661],{},[1132,1662,1663,1666,1668],{},[1135,1664,1665],{},"Field",[1135,1667,1512],{},[1135,1669,1518],{},[1149,1671,1672,1685],{},[1132,1673,1674,1678,1682],{},[1154,1675,1676],{},[36,1677,1328],{},[1154,1679,1680],{},[36,1681,1163],{},[1154,1683,1684],{},"Display name of the garment",[1132,1686,1687,1691,1695],{},[1154,1688,1689],{},[36,1690,1342],{},[1154,1692,1693],{},[36,1694,1163],{},[1154,1696,1697],{},"Full URL to the garment image",[56,1699,1701],{"className":1172,"code":1700,"language":1174,"meta":61,"style":61},"window.fitting('create', {\n targetElementId: 'widget-container',\n model: 'balanced',\n tryonItems: [\n {\n productName: 'Denim Jacket',\n url: 'https:\u002F\u002Fexample.com\u002Fjacket.png',\n },\n ],\n});\n",[36,1702,1703,1723,1737,1751,1759,1763,1778,1792,1796,1802],{"__ignoreMap":61},[65,1704,1705,1707,1709,1711,1713,1715,1717,1719,1721],{"class":67,"line":68},[65,1706,1181],{"class":75},[65,1708,26],{"class":82},[65,1710,595],{"class":116},[65,1712,598],{"class":75},[65,1714,90],{"class":82},[65,1716,603],{"class":86},[65,1718,90],{"class":82},[65,1720,502],{"class":82},[65,1722,151],{"class":82},[65,1724,1725,1727,1729,1731,1733,1735],{"class":67,"line":96},[65,1726,1379],{"class":133},[65,1728,136],{"class":82},[65,1730,83],{"class":82},[65,1732,621],{"class":86},[65,1734,90],{"class":82},[65,1736,626],{"class":82},[65,1738,1739,1741,1743,1745,1747,1749],{"class":67,"line":103},[65,1740,1394],{"class":133},[65,1742,136],{"class":82},[65,1744,83],{"class":82},[65,1746,638],{"class":86},[65,1748,90],{"class":82},[65,1750,626],{"class":82},[65,1752,1753,1755,1757],{"class":67,"line":154},[65,1754,1409],{"class":133},[65,1756,136],{"class":82},[65,1758,1414],{"class":75},[65,1760,1761],{"class":67,"line":163},[65,1762,1419],{"class":82},[65,1764,1765,1767,1769,1771,1774,1776],{"class":67,"line":169},[65,1766,1424],{"class":133},[65,1768,136],{"class":82},[65,1770,83],{"class":82},[65,1772,1773],{"class":86},"Denim Jacket",[65,1775,90],{"class":82},[65,1777,626],{"class":82},[65,1779,1780,1782,1784,1786,1788,1790],{"class":67,"line":181},[65,1781,1440],{"class":133},[65,1783,136],{"class":82},[65,1785,83],{"class":82},[65,1787,1447],{"class":86},[65,1789,90],{"class":82},[65,1791,626],{"class":82},[65,1793,1794],{"class":67,"line":186},[65,1795,1456],{"class":82},[65,1797,1798,1800],{"class":67,"line":195},[65,1799,1461],{"class":75},[65,1801,626],{"class":82},[65,1803,1804,1806,1808],{"class":67,"line":213},[65,1805,349],{"class":82},[65,1807,514],{"class":75},[65,1809,93],{"class":82},[1089,1811,1474],{},{"title":61,"searchDepth":96,"depth":96,"links":1813},[1814,1815],{"id":1120,"depth":96,"text":1121},{"id":1228,"depth":96,"text":1229,"children":1816},[1817],{"id":1305,"depth":103,"text":1306},"Complete reference for the Fitting Widget API",{},"\u002Fen\u002Fapi",{"title":1490,"description":1818},"en\u002Fapi\u002Findex","5vrf4TtfB7Sr4MpfgLzStW-oF0xDBiShwkqA4UFzgA0",{"id":1825,"title":1826,"body":1827,"description":2275,"extension":1102,"icon":2276,"meta":2277,"navigation":99,"path":2278,"seo":2279,"stem":2280,"__hash__":2281},"content\u002Fen\u002Fgetting-started\u002Fquick-start.md","Quick Start",{"type":7,"value":1828,"toc":2266},[1829,1832,1835,1839,1850,1854,1865,1916,1920,2075,2079,2086,2113,2117,2123,2236,2240,2243,2247,2263],[10,1830,1826],{"id":1831},"quick-start",[15,1833,1834],{},"Follow these steps to add virtual try-on to your e-commerce site.",[28,1836,1838],{"id":1837},"_1-get-your-api-key","1. Get Your API Key",[15,1840,1841,1842,1849],{},"Sign up at ",[1843,1844,1848],"a",{"href":1845,"rel":1846},"https:\u002F\u002Fwidget.try-on.ru",[1847],"nofollow","widget.try-on.ru"," to obtain your free API key.",[28,1851,1853],{"id":1852},"_2-load-the-widget-script","2. Load the Widget Script",[15,1855,1856,1857,1860,1861,1864],{},"Add the following ",[36,1858,1859],{},"\u003Cscript>"," tag to your page, ideally right before the closing ",[36,1862,1863],{},"\u003C\u002Fbody>"," tag:",[56,1866,1870],{"className":1867,"code":1868,"language":1869,"meta":61,"style":61},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript\n src=\"https:\u002F\u002Fwidget.try-on.ru\u002Ffitting-widget-bundle.js\"\n id=\"fitting-widget-bundle\"\n>\u003C\u002Fscript>\n","html",[36,1871,1872,1880,1893,1906],{"__ignoreMap":61},[65,1873,1874,1877],{"class":67,"line":68},[65,1875,1876],{"class":82},"\u003C",[65,1878,1879],{"class":133},"script\n",[65,1881,1882,1885,1887,1889,1891],{"class":67,"line":96},[65,1883,1884],{"class":112}," src",[65,1886,201],{"class":82},[65,1888,204],{"class":82},[65,1890,207],{"class":86},[65,1892,210],{"class":82},[65,1894,1895,1898,1900,1902,1904],{"class":67,"line":103},[65,1896,1897],{"class":112}," id",[65,1899,201],{"class":82},[65,1901,204],{"class":82},[65,1903,238],{"class":86},[65,1905,210],{"class":82},[65,1907,1908,1911,1914],{"class":67,"line":154},[65,1909,1910],{"class":82},">\u003C\u002F",[65,1912,1913],{"class":133},"script",[65,1915,377],{"class":82},[28,1917,1919],{"id":1918},"_3-initialize-the-widget","3. Initialize the Widget",[56,1921,1923],{"className":1867,"code":1922,"language":1869,"meta":61,"style":61},"\u003Cscript id=\"fitting-init\">\n window.fitting = window.fitting || function() {\n (window.fitting.q = window.fitting.q || []).push(arguments);\n };\n window.fitting('init', {\n apiKey: 'YOUR_API_KEY'\n });\n\u003C\u002Fscript>\n",[36,1924,1925,1943,1972,2020,2024,2044,2058,2067],{"__ignoreMap":61},[65,1926,1927,1929,1931,1933,1935,1937,1939,1941],{"class":67,"line":68},[65,1928,1876],{"class":82},[65,1930,1913],{"class":133},[65,1932,691],{"class":112},[65,1934,201],{"class":82},[65,1936,204],{"class":82},[65,1938,283],{"class":86},[65,1940,204],{"class":82},[65,1942,377],{"class":82},[65,1944,1945,1948,1950,1953,1955,1958,1960,1962,1965,1967,1970],{"class":67,"line":96},[65,1946,1947],{"class":75}," window",[65,1949,26],{"class":82},[65,1951,1952],{"class":75},"fitting ",[65,1954,201],{"class":82},[65,1956,1957],{"class":75}," window",[65,1959,26],{"class":82},[65,1961,1952],{"class":75},[65,1963,1964],{"class":82},"||",[65,1966,113],{"class":112},[65,1968,1969],{"class":82},"()",[65,1971,151],{"class":82},[65,1973,1974,1977,1979,1981,1983,1985,1988,1990,1992,1994,1996,1998,2000,2003,2006,2008,2011,2013,2016,2018],{"class":67,"line":103},[65,1975,1976],{"class":133}," (",[65,1978,1181],{"class":75},[65,1980,26],{"class":82},[65,1982,595],{"class":75},[65,1984,26],{"class":82},[65,1986,1987],{"class":75},"q",[65,1989,578],{"class":82},[65,1991,1957],{"class":75},[65,1993,26],{"class":82},[65,1995,595],{"class":75},[65,1997,26],{"class":82},[65,1999,1987],{"class":75},[65,2001,2002],{"class":82}," ||",[65,2004,2005],{"class":133}," [])",[65,2007,26],{"class":82},[65,2009,2010],{"class":116},"push",[65,2012,598],{"class":133},[65,2014,2015],{"class":75},"arguments",[65,2017,514],{"class":133},[65,2019,93],{"class":82},[65,2021,2022],{"class":67,"line":154},[65,2023,667],{"class":82},[65,2025,2026,2028,2030,2032,2034,2036,2038,2040,2042],{"class":67,"line":163},[65,2027,1947],{"class":75},[65,2029,26],{"class":82},[65,2031,595],{"class":116},[65,2033,598],{"class":75},[65,2035,90],{"class":82},[65,2037,1192],{"class":86},[65,2039,90],{"class":82},[65,2041,502],{"class":82},[65,2043,151],{"class":82},[65,2045,2046,2049,2051,2053,2056],{"class":67,"line":169},[65,2047,2048],{"class":133}," apiKey",[65,2050,136],{"class":82},[65,2052,83],{"class":82},[65,2054,2055],{"class":86},"YOUR_API_KEY",[65,2057,352],{"class":82},[65,2059,2060,2063,2065],{"class":67,"line":181},[65,2061,2062],{"class":82}," }",[65,2064,514],{"class":75},[65,2066,93],{"class":82},[65,2068,2069,2071,2073],{"class":67,"line":186},[65,2070,770],{"class":82},[65,2072,1913],{"class":133},[65,2074,377],{"class":82},[28,2076,2078],{"id":2077},"_4-add-a-container","4. Add a Container",[15,2080,2081,2082,2085],{},"Place a ",[36,2083,2084],{},"\u003Cdiv>"," wherever you want the widget to appear:",[56,2087,2089],{"className":1867,"code":2088,"language":1869,"meta":61,"style":61},"\u003Cdiv id=\"widget-container\">\u003C\u002Fdiv>\n",[36,2090,2091],{"__ignoreMap":61},[65,2092,2093,2095,2097,2099,2101,2103,2105,2107,2109,2111],{"class":67,"line":68},[65,2094,1876],{"class":82},[65,2096,688],{"class":133},[65,2098,691],{"class":112},[65,2100,201],{"class":82},[65,2102,204],{"class":82},[65,2104,621],{"class":86},[65,2106,204],{"class":82},[65,2108,1910],{"class":82},[65,2110,688],{"class":133},[65,2112,377],{"class":82},[28,2114,2116],{"id":2115},"_5-launch-the-widget","5. Launch the Widget",[15,2118,2119,2120,2122],{},"Call the ",[36,2121,603],{}," method when the user clicks a button:",[56,2124,2126],{"className":1172,"code":2125,"language":1174,"meta":61,"style":61},"window.fitting('create', {\n targetElementId: 'widget-container',\n model: 'balanced',\n tryonItems: [\n {\n productName: 'Classic Denim Jacket',\n url: 'https:\u002F\u002Fyour-store.com\u002Fimages\u002Fjacket.jpg',\n },\n ],\n});\n",[36,2127,2128,2148,2162,2176,2184,2188,2203,2218,2222,2228],{"__ignoreMap":61},[65,2129,2130,2132,2134,2136,2138,2140,2142,2144,2146],{"class":67,"line":68},[65,2131,1181],{"class":75},[65,2133,26],{"class":82},[65,2135,595],{"class":116},[65,2137,598],{"class":75},[65,2139,90],{"class":82},[65,2141,603],{"class":86},[65,2143,90],{"class":82},[65,2145,502],{"class":82},[65,2147,151],{"class":82},[65,2149,2150,2152,2154,2156,2158,2160],{"class":67,"line":96},[65,2151,1379],{"class":133},[65,2153,136],{"class":82},[65,2155,83],{"class":82},[65,2157,621],{"class":86},[65,2159,90],{"class":82},[65,2161,626],{"class":82},[65,2163,2164,2166,2168,2170,2172,2174],{"class":67,"line":103},[65,2165,1394],{"class":133},[65,2167,136],{"class":82},[65,2169,83],{"class":82},[65,2171,638],{"class":86},[65,2173,90],{"class":82},[65,2175,626],{"class":82},[65,2177,2178,2180,2182],{"class":67,"line":154},[65,2179,1409],{"class":133},[65,2181,136],{"class":82},[65,2183,1414],{"class":75},[65,2185,2186],{"class":67,"line":163},[65,2187,1419],{"class":82},[65,2189,2190,2192,2194,2196,2199,2201],{"class":67,"line":169},[65,2191,1424],{"class":133},[65,2193,136],{"class":82},[65,2195,83],{"class":82},[65,2197,2198],{"class":86},"Classic Denim Jacket",[65,2200,90],{"class":82},[65,2202,626],{"class":82},[65,2204,2205,2207,2209,2211,2214,2216],{"class":67,"line":181},[65,2206,1440],{"class":133},[65,2208,136],{"class":82},[65,2210,83],{"class":82},[65,2212,2213],{"class":86},"https:\u002F\u002Fyour-store.com\u002Fimages\u002Fjacket.jpg",[65,2215,90],{"class":82},[65,2217,626],{"class":82},[65,2219,2220],{"class":67,"line":186},[65,2221,1456],{"class":82},[65,2223,2224,2226],{"class":67,"line":195},[65,2225,1461],{"class":75},[65,2227,626],{"class":82},[65,2229,2230,2232,2234],{"class":67,"line":213},[65,2231,349],{"class":82},[65,2233,514],{"class":75},[65,2235,93],{"class":82},[28,2237,2239],{"id":2238},"result","Result",[15,2241,2242],{},"Your customers can now upload a photo and see the garment on them instantly.",[28,2244,2246],{"id":2245},"next-steps","Next Steps",[2248,2249,2250,2258],"ul",{},[2251,2252,2253,2254,26],"li",{},"See framework-specific guides under ",[1843,2255,2257],{"href":2256},"\u002Fintegrations\u002Fvanilla-js","Integrations",[2251,2259,2260,2261,26],{},"Explore the full ",[1843,2262,1490],{"href":1484},[1089,2264,2265],{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}",{"title":61,"searchDepth":96,"depth":96,"links":2267},[2268,2269,2270,2271,2272,2273,2274],{"id":1837,"depth":96,"text":1838},{"id":1852,"depth":96,"text":1853},{"id":1918,"depth":96,"text":1919},{"id":2077,"depth":96,"text":2078},{"id":2115,"depth":96,"text":2116},{"id":2238,"depth":96,"text":2239},{"id":2245,"depth":96,"text":2246},"Get the Fitting Widget running in minutes","i-lucide-rocket",{},"\u002Fen\u002Fgetting-started\u002Fquick-start",{"title":1826,"description":2275},"en\u002Fgetting-started\u002Fquick-start","Cy6rzr6z6R2nhbEqOeB18fbbe2pOjXOk0inGXqhKfHg",{"id":2283,"title":2284,"body":2285,"description":2365,"extension":1102,"icon":2366,"meta":2367,"navigation":99,"path":2368,"seo":2369,"stem":2370,"__hash__":2371},"content\u002Fen\u002Findex.md","Introduction",{"type":7,"value":2286,"toc":2360},[2287,2291,2298,2302,2328,2332,2351,2353],[10,2288,2290],{"id":2289},"fitting-widget-virtual-try-on","Fitting Widget — Virtual Try-On",[15,2292,2293,2294,2297],{},"The ",[19,2295,2296],{},"Fitting Widget"," is a drop-in virtual try-on solution for e-commerce fashion stores. It lets your customers upload a photo and instantly see how any garment looks on them — directly on your product pages.",[28,2299,2301],{"id":2300},"key-features","Key Features",[2248,2303,2304,2310,2316,2322],{},[2251,2305,2306,2309],{},[19,2307,2308],{},"Quick Integration"," — Add one script tag and a few lines of code.",[2251,2311,2312,2315],{},[19,2313,2314],{},"Framework-Agnostic"," — Works with Vanilla JS, React, Vue, Next.js, Nuxt, and more.",[2251,2317,2318,2321],{},[19,2319,2320],{},"Customizable"," — Style the widget to match your brand.",[2251,2323,2324,2327],{},[19,2325,2326],{},"Lightweight"," — Optimized loading; won't slow down your store.",[28,2329,2331],{"id":2330},"how-it-works","How It Works",[2333,2334,2335,2338,2341,2348],"ol",{},[2251,2336,2337],{},"Load the widget script on your page.",[2251,2339,2340],{},"Initialize with your API key.",[2251,2342,2343,2344,2347],{},"Call ",[36,2345,2346],{},"window.fitting('create', { ... })"," with product image URLs.",[2251,2349,2350],{},"The widget renders inside a container element of your choice.",[28,2352,1826],{"id":1831},[15,2354,2355,2356,2359],{},"Head over to the ",[1843,2357,1826],{"href":2358},"\u002Fgetting-started\u002Fquick-start"," guide to get up and running in under 5 minutes.",{"title":61,"searchDepth":96,"depth":96,"links":2361},[2362,2363,2364],{"id":2300,"depth":96,"text":2301},{"id":2330,"depth":96,"text":2331},{"id":1831,"depth":96,"text":1826},"What is the Fitting Widget and why use it?","i-lucide-sparkles",{},"\u002Fen",{"title":2284,"description":2365},"en\u002Findex","zjI3aBTZ8Y2iRdmkieXP4q0o6PKbIjE5hUkB6Y1ledA",{"id":4,"title":5,"body":2373,"description":1101,"extension":1102,"icon":1103,"meta":3227,"navigation":99,"path":1105,"seo":3228,"stem":1107,"__hash__":1108},{"type":7,"value":2374,"toc":3219},[2375,2377,2383,2385,2391,2397,2633,2635,2961,2963,3199,3201,3205,3217],[10,2376,13],{"id":12},[15,2378,17,2379,22,2381,26],{},[19,2380,21],{},[19,2382,25],{},[28,2384,31],{"id":30},[15,2386,34,2387,39,2389,26],{},[36,2388,38],{},[36,2390,42],{},[44,2392,47,2393,51,2395],{"id":46},[36,2394,50],{},[36,2396,54],{},[56,2398,2399],{"className":58,"code":59,"language":60,"meta":61,"style":61},[36,2400,2401,2417,2421,2453,2459,2463,2471,2475,2481,2493,2505,2517,2521,2525,2531,2543,2555,2559,2565,2569,2573,2577,2581,2601,2605,2611,2619,2623,2629],{"__ignoreMap":61},[65,2402,2403,2405,2407,2409,2411,2413,2415],{"class":67,"line":68},[65,2404,72],{"class":71},[65,2406,76],{"class":75},[65,2408,79],{"class":71},[65,2410,83],{"class":82},[65,2412,87],{"class":86},[65,2414,90],{"class":82},[65,2416,93],{"class":82},[65,2418,2419],{"class":67,"line":96},[65,2420,100],{"emptyLinePlaceholder":99},[65,2422,2423,2425,2427,2429,2431,2433,2435,2437,2439,2441,2443,2445,2447,2449,2451],{"class":67,"line":103},[65,2424,106],{"class":71},[65,2426,109],{"class":71},[65,2428,113],{"class":112},[65,2430,117],{"class":116},[65,2432,120],{"class":82},[65,2434,124],{"class":123},[65,2436,127],{"class":82},[65,2438,130],{"class":82},[65,2440,124],{"class":133},[65,2442,136],{"class":82},[65,2444,140],{"class":139},[65,2446,26],{"class":82},[65,2448,145],{"class":139},[65,2450,148],{"class":82},[65,2452,151],{"class":82},[65,2454,2455,2457],{"class":67,"line":154},[65,2456,157],{"class":71},[65,2458,160],{"class":133},[65,2460,2461],{"class":67,"line":163},[65,2462,166],{"class":82},[65,2464,2465,2467,2469],{"class":67,"line":169},[65,2466,172],{"class":82},[65,2468,175],{"class":75},[65,2470,178],{"class":82},[65,2472,2473],{"class":67,"line":181},[65,2474,100],{"emptyLinePlaceholder":99},[65,2476,2477,2479],{"class":67,"line":186},[65,2478,189],{"class":82},[65,2480,192],{"class":139},[65,2482,2483,2485,2487,2489,2491],{"class":67,"line":195},[65,2484,198],{"class":112},[65,2486,201],{"class":82},[65,2488,204],{"class":82},[65,2490,207],{"class":86},[65,2492,210],{"class":82},[65,2494,2495,2497,2499,2501,2503],{"class":67,"line":213},[65,2496,216],{"class":112},[65,2498,201],{"class":82},[65,2500,204],{"class":82},[65,2502,223],{"class":86},[65,2504,210],{"class":82},[65,2506,2507,2509,2511,2513,2515],{"class":67,"line":228},[65,2508,231],{"class":112},[65,2510,201],{"class":82},[65,2512,204],{"class":82},[65,2514,238],{"class":86},[65,2516,210],{"class":82},[65,2518,2519],{"class":67,"line":243},[65,2520,246],{"class":82},[65,2522,2523],{"class":67,"line":249},[65,2524,100],{"emptyLinePlaceholder":99},[65,2526,2527,2529],{"class":67,"line":254},[65,2528,189],{"class":82},[65,2530,192],{"class":139},[65,2532,2533,2535,2537,2539,2541],{"class":67,"line":261},[65,2534,216],{"class":112},[65,2536,201],{"class":82},[65,2538,204],{"class":82},[65,2540,223],{"class":86},[65,2542,210],{"class":82},[65,2544,2545,2547,2549,2551,2553],{"class":67,"line":274},[65,2546,231],{"class":112},[65,2548,201],{"class":82},[65,2550,204],{"class":82},[65,2552,283],{"class":86},[65,2554,210],{"class":82},[65,2556,2557],{"class":67,"line":288},[65,2558,291],{"class":82},[65,2560,2561,2563],{"class":67,"line":294},[65,2562,297],{"class":82},[65,2564,300],{"class":82},[65,2566,2567],{"class":67,"line":303},[65,2568,306],{"class":86},[65,2570,2571],{"class":67,"line":309},[65,2572,312],{"class":86},[65,2574,2575],{"class":67,"line":315},[65,2576,318],{"class":86},[65,2578,2579],{"class":67,"line":321},[65,2580,324],{"class":86},[65,2582,2583,2585,2587,2589,2591,2593,2595,2597,2599],{"class":67,"line":327},[65,2584,330],{"class":86},[65,2586,333],{"class":82},[65,2588,336],{"class":75},[65,2590,26],{"class":82},[65,2592,341],{"class":75},[65,2594,26],{"class":82},[65,2596,346],{"class":75},[65,2598,349],{"class":82},[65,2600,352],{"class":86},[65,2602,2603],{"class":67,"line":355},[65,2604,358],{"class":86},[65,2606,2607,2609],{"class":67,"line":361},[65,2608,364],{"class":82},[65,2610,178],{"class":82},[65,2612,2613,2615,2617],{"class":67,"line":369},[65,2614,372],{"class":82},[65,2616,38],{"class":139},[65,2618,377],{"class":82},[65,2620,2621],{"class":67,"line":380},[65,2622,383],{"class":82},[65,2624,2625,2627],{"class":67,"line":386},[65,2626,389],{"class":133},[65,2628,93],{"class":82},[65,2630,2631],{"class":67,"line":394},[65,2632,178],{"class":82},[44,2634,400],{"id":399},[56,2636,2637],{"className":58,"code":403,"language":60,"meta":61,"style":61},[36,2638,2639,2649,2653,2661,2671,2681,2685,2689,2697,2705,2735,2739,2743,2747,2775,2789,2809,2823,2837,2847,2855,2859,2863,2869,2873,2925,2947,2951,2957],{"__ignoreMap":61},[65,2640,2641,2643,2645,2647],{"class":67,"line":68},[65,2642,90],{"class":82},[65,2644,412],{"class":86},[65,2646,90],{"class":82},[65,2648,93],{"class":82},[65,2650,2651],{"class":67,"line":96},[65,2652,100],{"emptyLinePlaceholder":99},[65,2654,2655,2657,2659],{"class":67,"line":103},[65,2656,425],{"class":112},[65,2658,428],{"class":139},[65,2660,151],{"class":82},[65,2662,2663,2665,2667,2669],{"class":67,"line":154},[65,2664,435],{"class":133},[65,2666,136],{"class":82},[65,2668,440],{"class":139},[65,2670,93],{"class":82},[65,2672,2673,2675,2677,2679],{"class":67,"line":163},[65,2674,447],{"class":133},[65,2676,136],{"class":82},[65,2678,440],{"class":139},[65,2680,93],{"class":82},[65,2682,2683],{"class":67,"line":169},[65,2684,178],{"class":82},[65,2686,2687],{"class":67,"line":181},[65,2688,100],{"emptyLinePlaceholder":99},[65,2690,2691,2693,2695],{"class":67,"line":186},[65,2692,466],{"class":112},[65,2694,469],{"class":75},[65,2696,472],{"class":82},[65,2698,2699,2701,2703],{"class":67,"line":195},[65,2700,477],{"class":112},[65,2702,480],{"class":139},[65,2704,151],{"class":82},[65,2706,2707,2709,2711,2713,2715,2717,2719,2721,2723,2725,2727,2729,2731,2733],{"class":67,"line":213},[65,2708,487],{"class":133},[65,2710,136],{"class":82},[65,2712,492],{"class":82},[65,2714,495],{"class":123},[65,2716,136],{"class":82},[65,2718,440],{"class":139},[65,2720,502],{"class":82},[65,2722,505],{"class":123},[65,2724,508],{"class":82},[65,2726,511],{"class":139},[65,2728,514],{"class":82},[65,2730,517],{"class":112},[65,2732,520],{"class":139},[65,2734,93],{"class":82},[65,2736,2737],{"class":67,"line":228},[65,2738,527],{"class":82},[65,2740,2741],{"class":67,"line":243},[65,2742,178],{"class":82},[65,2744,2745],{"class":67,"line":249},[65,2746,100],{"emptyLinePlaceholder":99},[65,2748,2749,2751,2753,2755,2757,2759,2761,2763,2765,2767,2769,2771,2773],{"class":67,"line":254},[65,2750,106],{"class":71},[65,2752,113],{"class":112},[65,2754,544],{"class":116},[65,2756,120],{"class":82},[65,2758,549],{"class":123},[65,2760,127],{"class":82},[65,2762,130],{"class":82},[65,2764,549],{"class":133},[65,2766,136],{"class":82},[65,2768,428],{"class":139},[65,2770,562],{"class":75},[65,2772,565],{"class":82},[65,2774,151],{"class":82},[65,2776,2777,2779,2781,2783,2785,2787],{"class":67,"line":261},[65,2778,572],{"class":112},[65,2780,575],{"class":75},[65,2782,578],{"class":82},[65,2784,581],{"class":82},[65,2786,517],{"class":112},[65,2788,151],{"class":82},[65,2790,2791,2793,2795,2797,2799,2801,2803,2805,2807],{"class":67,"line":274},[65,2792,590],{"class":75},[65,2794,26],{"class":82},[65,2796,595],{"class":116},[65,2798,598],{"class":133},[65,2800,90],{"class":82},[65,2802,603],{"class":86},[65,2804,90],{"class":82},[65,2806,502],{"class":82},[65,2808,151],{"class":82},[65,2810,2811,2813,2815,2817,2819,2821],{"class":67,"line":288},[65,2812,614],{"class":133},[65,2814,136],{"class":82},[65,2816,83],{"class":82},[65,2818,621],{"class":86},[65,2820,90],{"class":82},[65,2822,626],{"class":82},[65,2824,2825,2827,2829,2831,2833,2835],{"class":67,"line":294},[65,2826,631],{"class":133},[65,2828,136],{"class":82},[65,2830,83],{"class":82},[65,2832,638],{"class":86},[65,2834,90],{"class":82},[65,2836,626],{"class":82},[65,2838,2839,2841,2843,2845],{"class":67,"line":303},[65,2840,647],{"class":133},[65,2842,136],{"class":82},[65,2844,549],{"class":75},[65,2846,626],{"class":82},[65,2848,2849,2851,2853],{"class":67,"line":309},[65,2850,658],{"class":82},[65,2852,514],{"class":133},[65,2854,93],{"class":82},[65,2856,2857],{"class":67,"line":315},[65,2858,667],{"class":82},[65,2860,2861],{"class":67,"line":321},[65,2862,100],{"emptyLinePlaceholder":99},[65,2864,2865,2867],{"class":67,"line":327},[65,2866,157],{"class":71},[65,2868,160],{"class":133},[65,2870,2871],{"class":67,"line":355},[65,2872,166],{"class":82},[65,2874,2875,2877,2879,2881,2883,2885,2887,2889,2891,2893,2895,2897,2899,2901,2903,2905,2907,2909,2911,2913,2915,2917,2919,2921,2923],{"class":67,"line":361},[65,2876,189],{"class":82},[65,2878,688],{"class":133},[65,2880,691],{"class":112},[65,2882,201],{"class":82},[65,2884,204],{"class":82},[65,2886,621],{"class":86},[65,2888,204],{"class":82},[65,2890,702],{"class":112},[65,2892,705],{"class":82},[65,2894,708],{"class":133},[65,2896,136],{"class":82},[65,2898,83],{"class":82},[65,2900,715],{"class":86},[65,2902,90],{"class":82},[65,2904,502],{"class":82},[65,2906,722],{"class":133},[65,2908,136],{"class":82},[65,2910,728],{"class":727},[65,2912,502],{"class":82},[65,2914,733],{"class":133},[65,2916,136],{"class":82},[65,2918,83],{"class":82},[65,2920,740],{"class":86},[65,2922,90],{"class":82},[65,2924,745],{"class":82},[65,2926,2927,2929,2931,2933,2935,2937,2939,2941,2943,2945],{"class":67,"line":369},[65,2928,189],{"class":82},[65,2930,752],{"class":133},[65,2932,755],{"class":112},[65,2934,758],{"class":82},[65,2936,761],{"class":75},[65,2938,764],{"class":82},[65,2940,767],{"class":75},[65,2942,770],{"class":82},[65,2944,752],{"class":133},[65,2946,377],{"class":82},[65,2948,2949],{"class":67,"line":380},[65,2950,383],{"class":82},[65,2952,2953,2955],{"class":67,"line":386},[65,2954,389],{"class":133},[65,2956,93],{"class":82},[65,2958,2959],{"class":67,"line":394},[65,2960,178],{"class":82},[44,2962,792],{"id":791},[56,2964,2965],{"className":58,"code":795,"language":60,"meta":61,"style":61},[36,2966,2967,2987,2991,3029,3053,3057,3063,3071,3091,3121,3127,3135,3139,3153,3167,3171,3177,3181,3189,3195],{"__ignoreMap":61},[65,2968,2969,2971,2973,2975,2977,2979,2981,2983,2985],{"class":67,"line":68},[65,2970,72],{"class":71},[65,2972,130],{"class":82},[65,2974,544],{"class":75},[65,2976,808],{"class":82},[65,2978,811],{"class":71},[65,2980,83],{"class":82},[65,2982,816],{"class":86},[65,2984,90],{"class":82},[65,2986,93],{"class":82},[65,2988,2989],{"class":67,"line":96},[65,2990,100],{"emptyLinePlaceholder":99},[65,2992,2993,2995,2997,2999,3001,3003,3005,3007,3009,3011,3013,3015,3017,3019,3021,3023,3025,3027],{"class":67,"line":103},[65,2994,106],{"class":71},[65,2996,109],{"class":71},[65,2998,833],{"class":112},[65,3000,113],{"class":112},[65,3002,838],{"class":116},[65,3004,120],{"class":82},[65,3006,843],{"class":123},[65,3008,127],{"class":82},[65,3010,130],{"class":82},[65,3012,843],{"class":133},[65,3014,136],{"class":82},[65,3016,130],{"class":82},[65,3018,856],{"class":133},[65,3020,136],{"class":82},[65,3022,440],{"class":139},[65,3024,808],{"class":82},[65,3026,148],{"class":82},[65,3028,151],{"class":82},[65,3030,3031,3033,3035,3037,3039,3041,3043,3045,3047,3049,3051],{"class":67,"line":154},[65,3032,572],{"class":112},[65,3034,873],{"class":75},[65,3036,578],{"class":82},[65,3038,878],{"class":71},[65,3040,881],{"class":116},[65,3042,598],{"class":133},[65,3044,886],{"class":75},[65,3046,26],{"class":82},[65,3048,891],{"class":75},[65,3050,514],{"class":133},[65,3052,93],{"class":82},[65,3054,3055],{"class":67,"line":163},[65,3056,100],{"emptyLinePlaceholder":99},[65,3058,3059,3061],{"class":67,"line":169},[65,3060,157],{"class":71},[65,3062,160],{"class":133},[65,3064,3065,3067,3069],{"class":67,"line":181},[65,3066,910],{"class":82},[65,3068,688],{"class":133},[65,3070,377],{"class":82},[65,3072,3073,3075,3077,3079,3081,3083,3085,3087,3089],{"class":67,"line":186},[65,3074,189],{"class":82},[65,3076,10],{"class":133},[65,3078,923],{"class":82},[65,3080,926],{"class":75},[65,3082,26],{"class":82},[65,3084,931],{"class":75},[65,3086,934],{"class":82},[65,3088,10],{"class":133},[65,3090,377],{"class":82},[65,3092,3093,3095,3097,3099,3101,3103,3105,3107,3109,3111,3113,3115,3117,3119],{"class":67,"line":195},[65,3094,189],{"class":82},[65,3096,945],{"class":133},[65,3098,948],{"class":112},[65,3100,758],{"class":82},[65,3102,926],{"class":75},[65,3104,26],{"class":82},[65,3106,957],{"class":75},[65,3108,960],{"class":82},[65,3110,963],{"class":112},[65,3112,758],{"class":82},[65,3114,926],{"class":75},[65,3116,26],{"class":82},[65,3118,931],{"class":75},[65,3120,974],{"class":82},[65,3122,3123,3125],{"class":67,"line":213},[65,3124,189],{"class":82},[65,3126,981],{"class":139},[65,3128,3129,3131,3133],{"class":67,"line":228},[65,3130,986],{"class":112},[65,3132,758],{"class":82},[65,3134,991],{"class":75},[65,3136,3137],{"class":67,"line":243},[65,3138,996],{"class":82},[65,3140,3141,3143,3145,3147,3149,3151],{"class":67,"line":249},[65,3142,1001],{"class":133},[65,3144,136],{"class":82},[65,3146,873],{"class":75},[65,3148,26],{"class":82},[65,3150,931],{"class":75},[65,3152,626],{"class":82},[65,3154,3155,3157,3159,3161,3163,3165],{"class":67,"line":254},[65,3156,1016],{"class":133},[65,3158,136],{"class":82},[65,3160,873],{"class":75},[65,3162,26],{"class":82},[65,3164,957],{"class":75},[65,3166,626],{"class":82},[65,3168,3169],{"class":67,"line":261},[65,3170,1031],{"class":82},[65,3172,3173,3175],{"class":67,"line":274},[65,3174,1036],{"class":75},[65,3176,178],{"class":82},[65,3178,3179],{"class":67,"line":288},[65,3180,246],{"class":82},[65,3182,3183,3185,3187],{"class":67,"line":294},[65,3184,1047],{"class":82},[65,3186,688],{"class":133},[65,3188,377],{"class":82},[65,3190,3191,3193],{"class":67,"line":303},[65,3192,389],{"class":133},[65,3194,93],{"class":82},[65,3196,3197],{"class":67,"line":309},[65,3198,178],{"class":82},[28,3200,1065],{"id":1064},[15,3202,1068,3203,136],{},[36,3204,1071],{},[56,3206,3207],{"className":1074,"code":1075,"language":1076,"meta":61,"style":61},[36,3208,3209],{"__ignoreMap":61},[65,3210,3211,3213,3215],{"class":67,"line":68},[65,3212,346],{"class":75},[65,3214,201],{"class":82},[65,3216,1087],{"class":86},[1089,3218,1091],{},{"title":61,"searchDepth":96,"depth":96,"links":3220},[3221,3226],{"id":30,"depth":96,"text":31,"children":3222},[3223,3224,3225],{"id":46,"depth":103,"text":1097},{"id":399,"depth":103,"text":400},{"id":791,"depth":103,"text":792},{"id":1064,"depth":96,"text":1065},{},{"title":5,"description":1101},{"id":3230,"title":3231,"body":3232,"description":4131,"extension":1102,"icon":4132,"meta":4133,"navigation":99,"path":4134,"seo":4135,"stem":4136,"__hash__":4137},"content\u002Fen\u002Fintegrations\u002Fnuxt.md","Nuxt",{"type":7,"value":3233,"toc":4121},[3234,3238,3241,3245,3255,3261,3581,3587,3783,3787,4097,4099,4105,4118],[10,3235,3237],{"id":3236},"nuxt-integration","Nuxt Integration",[15,3239,3240],{},"The Fitting Widget integrates seamlessly with Nuxt 3 and Nuxt 4.",[28,3242,3244],{"id":3243},"_1-load-the-script","1. Load the Script",[15,3246,3247,3248,3251,3252,26],{},"Use the ",[36,3249,3250],{},"useHead"," composable, or add scripts to your ",[36,3253,3254],{},"nuxt.config.ts",[44,3256,3258,3259],{"id":3257},"option-a-per-page-with-usehead","Option A — Per Page with ",[36,3260,3250],{},[56,3262,3266],{"className":3263,"code":3264,"language":3265,"meta":61,"style":61},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003C!-- pages\u002Fproduct\u002F[slug].vue -->\n\u003Ctemplate>\n \u003Cdiv>\n \u003Ch1>{{ product.name }}\u003C\u002Fh1>\n \u003CTryOnWidget :product-name=\"product.name\" :image-url=\"product.image\" \u002F>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\nimport { useHead } from '#app'\n\nuseHead({\n script: [\n {\n src: 'https:\u002F\u002Fwidget.try-on.ru\u002Ffitting-widget-bundle.js',\n id: 'fitting-widget-bundle',\n },\n {\n id: 'fitting-init',\n innerHTML: `\n window.fitting = window.fitting || function() {\n (window.fitting.q = window.fitting.q || []).push(arguments);\n };\n window.fitting('init', {\n apiKey: '${import.meta.env.VITE_TRY_ON_API_KEY}'\n });\n `,\n },\n ],\n})\n\u003C\u002Fscript>\n","vue",[36,3267,3268,3274,3283,3292,3310,3344,3353,3361,3365,3388,3408,3412,3420,3429,3433,3448,3463,3467,3471,3485,3495,3500,3505,3510,3515,3542,3547,3554,3558,3564,3572],{"__ignoreMap":61},[65,3269,3270],{"class":67,"line":68},[65,3271,3273],{"class":3272},"sHwdD","\u003C!-- pages\u002Fproduct\u002F[slug].vue -->\n",[65,3275,3276,3278,3281],{"class":67,"line":96},[65,3277,1876],{"class":82},[65,3279,3280],{"class":133},"template",[65,3282,377],{"class":82},[65,3284,3285,3288,3290],{"class":67,"line":103},[65,3286,3287],{"class":82}," \u003C",[65,3289,688],{"class":133},[65,3291,377],{"class":82},[65,3293,3294,3296,3298,3301,3304,3306,3308],{"class":67,"line":154},[65,3295,910],{"class":82},[65,3297,10],{"class":133},[65,3299,3300],{"class":82},">",[65,3302,3303],{"class":75},"{{ product.name }}",[65,3305,770],{"class":82},[65,3307,10],{"class":133},[65,3309,377],{"class":82},[65,3311,3312,3314,3317,3320,3322,3324,3327,3329,3332,3334,3336,3339,3341],{"class":67,"line":163},[65,3313,910],{"class":82},[65,3315,3316],{"class":133},"TryOnWidget",[65,3318,3319],{"class":112}," :product-name",[65,3321,201],{"class":82},[65,3323,204],{"class":82},[65,3325,3326],{"class":86},"product.name",[65,3328,204],{"class":82},[65,3330,3331],{"class":112}," :image-url",[65,3333,201],{"class":82},[65,3335,204],{"class":82},[65,3337,3338],{"class":86},"product.image",[65,3340,204],{"class":82},[65,3342,3343],{"class":82}," \u002F>\n",[65,3345,3346,3349,3351],{"class":67,"line":169},[65,3347,3348],{"class":82}," \u003C\u002F",[65,3350,688],{"class":133},[65,3352,377],{"class":82},[65,3354,3355,3357,3359],{"class":67,"line":181},[65,3356,770],{"class":82},[65,3358,3280],{"class":133},[65,3360,377],{"class":82},[65,3362,3363],{"class":67,"line":186},[65,3364,100],{"emptyLinePlaceholder":99},[65,3366,3367,3369,3371,3374,3377,3379,3381,3384,3386],{"class":67,"line":195},[65,3368,1876],{"class":82},[65,3370,1913],{"class":133},[65,3372,3373],{"class":112}," setup",[65,3375,3376],{"class":112}," lang",[65,3378,201],{"class":82},[65,3380,204],{"class":82},[65,3382,3383],{"class":86},"ts",[65,3385,204],{"class":82},[65,3387,377],{"class":82},[65,3389,3390,3392,3394,3397,3399,3401,3403,3406],{"class":67,"line":213},[65,3391,72],{"class":71},[65,3393,130],{"class":82},[65,3395,3396],{"class":75}," useHead",[65,3398,808],{"class":82},[65,3400,811],{"class":71},[65,3402,83],{"class":82},[65,3404,3405],{"class":86},"#app",[65,3407,352],{"class":82},[65,3409,3410],{"class":67,"line":228},[65,3411,100],{"emptyLinePlaceholder":99},[65,3413,3414,3416,3418],{"class":67,"line":243},[65,3415,3250],{"class":116},[65,3417,598],{"class":75},[65,3419,472],{"class":82},[65,3421,3422,3425,3427],{"class":67,"line":249},[65,3423,3424],{"class":133}," script",[65,3426,136],{"class":82},[65,3428,1414],{"class":75},[65,3430,3431],{"class":67,"line":254},[65,3432,1419],{"class":82},[65,3434,3435,3438,3440,3442,3444,3446],{"class":67,"line":261},[65,3436,3437],{"class":133}," src",[65,3439,136],{"class":82},[65,3441,83],{"class":82},[65,3443,207],{"class":86},[65,3445,90],{"class":82},[65,3447,626],{"class":82},[65,3449,3450,3453,3455,3457,3459,3461],{"class":67,"line":274},[65,3451,3452],{"class":133}," id",[65,3454,136],{"class":82},[65,3456,83],{"class":82},[65,3458,238],{"class":86},[65,3460,90],{"class":82},[65,3462,626],{"class":82},[65,3464,3465],{"class":67,"line":288},[65,3466,1456],{"class":82},[65,3468,3469],{"class":67,"line":294},[65,3470,1419],{"class":82},[65,3472,3473,3475,3477,3479,3481,3483],{"class":67,"line":303},[65,3474,3452],{"class":133},[65,3476,136],{"class":82},[65,3478,83],{"class":82},[65,3480,283],{"class":86},[65,3482,90],{"class":82},[65,3484,626],{"class":82},[65,3486,3487,3490,3492],{"class":67,"line":309},[65,3488,3489],{"class":133}," innerHTML",[65,3491,136],{"class":82},[65,3493,3494],{"class":82}," `\n",[65,3496,3497],{"class":67,"line":315},[65,3498,3499],{"class":86}," window.fitting = window.fitting || function() {\n",[65,3501,3502],{"class":67,"line":321},[65,3503,3504],{"class":86}," (window.fitting.q = window.fitting.q || []).push(arguments);\n",[65,3506,3507],{"class":67,"line":327},[65,3508,3509],{"class":86}," };\n",[65,3511,3512],{"class":67,"line":355},[65,3513,3514],{"class":86}," window.fitting('init', {\n",[65,3516,3517,3520,3522,3524,3526,3529,3531,3533,3535,3538,3540],{"class":67,"line":361},[65,3518,3519],{"class":86}," apiKey: '",[65,3521,333],{"class":82},[65,3523,72],{"class":71},[65,3525,26],{"class":82},[65,3527,3528],{"class":75},"meta",[65,3530,26],{"class":82},[65,3532,341],{"class":75},[65,3534,26],{"class":82},[65,3536,3537],{"class":75},"VITE_TRY_ON_API_KEY",[65,3539,349],{"class":82},[65,3541,352],{"class":86},[65,3543,3544],{"class":67,"line":369},[65,3545,3546],{"class":86}," });\n",[65,3548,3549,3552],{"class":67,"line":380},[65,3550,3551],{"class":82}," `",[65,3553,626],{"class":82},[65,3555,3556],{"class":67,"line":386},[65,3557,1456],{"class":82},[65,3559,3560,3562],{"class":67,"line":394},[65,3561,1461],{"class":75},[65,3563,626],{"class":82},[65,3565,3567,3569],{"class":67,"line":3566},30,[65,3568,349],{"class":82},[65,3570,3571],{"class":75},")\n",[65,3573,3575,3577,3579],{"class":67,"line":3574},31,[65,3576,770],{"class":82},[65,3578,1913],{"class":133},[65,3580,377],{"class":82},[44,3582,3584,3585],{"id":3583},"option-b-global-in-nuxtconfigts","Option B — Global in ",[36,3586,3254],{},[56,3588,3591],{"className":3589,"code":3590,"language":3383,"meta":61,"style":61},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","export default defineNuxtConfig({\n app: {\n head: {\n script: [\n {\n src: 'https:\u002F\u002Fwidget.try-on.ru\u002Ffitting-widget-bundle.js',\n id: 'fitting-widget-bundle',\n },\n {\n id: 'fitting-init',\n innerHTML: `\n window.fitting = window.fitting || function() {\n (window.fitting.q = window.fitting.q || []).push(arguments);\n };\n window.fitting('init', {\n apiKey: '${import.meta.env.VITE_TRY_ON_API_KEY}'\n });\n `,\n },\n ],\n },\n },\n})\n",[36,3592,3593,3606,3615,3624,3633,3638,3653,3668,3673,3677,3691,3700,3705,3710,3715,3720,3745,3750,3757,3761,3768,3772,3777],{"__ignoreMap":61},[65,3594,3595,3597,3599,3602,3604],{"class":67,"line":68},[65,3596,106],{"class":71},[65,3598,109],{"class":71},[65,3600,3601],{"class":116}," defineNuxtConfig",[65,3603,598],{"class":75},[65,3605,472],{"class":82},[65,3607,3608,3611,3613],{"class":67,"line":96},[65,3609,3610],{"class":133}," app",[65,3612,136],{"class":82},[65,3614,151],{"class":82},[65,3616,3617,3620,3622],{"class":67,"line":103},[65,3618,3619],{"class":133}," head",[65,3621,136],{"class":82},[65,3623,151],{"class":82},[65,3625,3626,3629,3631],{"class":67,"line":154},[65,3627,3628],{"class":133}," script",[65,3630,136],{"class":82},[65,3632,1414],{"class":75},[65,3634,3635],{"class":67,"line":163},[65,3636,3637],{"class":82}," {\n",[65,3639,3640,3643,3645,3647,3649,3651],{"class":67,"line":169},[65,3641,3642],{"class":133}," src",[65,3644,136],{"class":82},[65,3646,83],{"class":82},[65,3648,207],{"class":86},[65,3650,90],{"class":82},[65,3652,626],{"class":82},[65,3654,3655,3658,3660,3662,3664,3666],{"class":67,"line":181},[65,3656,3657],{"class":133}," id",[65,3659,136],{"class":82},[65,3661,83],{"class":82},[65,3663,238],{"class":86},[65,3665,90],{"class":82},[65,3667,626],{"class":82},[65,3669,3670],{"class":67,"line":186},[65,3671,3672],{"class":82}," },\n",[65,3674,3675],{"class":67,"line":195},[65,3676,3637],{"class":82},[65,3678,3679,3681,3683,3685,3687,3689],{"class":67,"line":213},[65,3680,3657],{"class":133},[65,3682,136],{"class":82},[65,3684,83],{"class":82},[65,3686,283],{"class":86},[65,3688,90],{"class":82},[65,3690,626],{"class":82},[65,3692,3693,3696,3698],{"class":67,"line":228},[65,3694,3695],{"class":133}," innerHTML",[65,3697,136],{"class":82},[65,3699,3494],{"class":82},[65,3701,3702],{"class":67,"line":243},[65,3703,3704],{"class":86}," window.fitting = window.fitting || function() {\n",[65,3706,3707],{"class":67,"line":249},[65,3708,3709],{"class":86}," (window.fitting.q = window.fitting.q || []).push(arguments);\n",[65,3711,3712],{"class":67,"line":254},[65,3713,3714],{"class":86}," };\n",[65,3716,3717],{"class":67,"line":261},[65,3718,3719],{"class":86}," window.fitting('init', {\n",[65,3721,3722,3725,3727,3729,3731,3733,3735,3737,3739,3741,3743],{"class":67,"line":274},[65,3723,3724],{"class":86}," apiKey: '",[65,3726,333],{"class":82},[65,3728,72],{"class":71},[65,3730,26],{"class":82},[65,3732,3528],{"class":75},[65,3734,26],{"class":82},[65,3736,341],{"class":75},[65,3738,26],{"class":82},[65,3740,3537],{"class":75},[65,3742,349],{"class":82},[65,3744,352],{"class":86},[65,3746,3747],{"class":67,"line":288},[65,3748,3749],{"class":86}," });\n",[65,3751,3752,3755],{"class":67,"line":294},[65,3753,3754],{"class":82}," `",[65,3756,626],{"class":82},[65,3758,3759],{"class":67,"line":303},[65,3760,3672],{"class":82},[65,3762,3763,3766],{"class":67,"line":309},[65,3764,3765],{"class":75}," ]",[65,3767,626],{"class":82},[65,3769,3770],{"class":67,"line":315},[65,3771,1456],{"class":82},[65,3773,3774],{"class":67,"line":321},[65,3775,3776],{"class":82}," },\n",[65,3778,3779,3781],{"class":67,"line":327},[65,3780,349],{"class":82},[65,3782,3571],{"class":75},[28,3784,3786],{"id":3785},"_2-create-the-wrapper-component","2. Create the Wrapper Component",[56,3788,3790],{"className":3263,"code":3789,"language":3265,"meta":61,"style":61},"\u003C!-- components\u002FTryOnWidget.vue -->\n\u003Ctemplate>\n \u003Cdiv>\n \u003Cdiv id=\"widget-container\" class=\"aspect-[3\u002F4] w-full max-w-[600px]\" \u002F>\n \u003Cbutton @click=\"handleTryOn\">Try On\u003C\u002Fbutton>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\nconst props = defineProps\u003C{\n productName: string\n imageUrl: string\n}>()\n\nconst handleTryOn = () => {\n window.fitting('create', {\n targetElementId: 'widget-container',\n model: 'balanced',\n tryonItems: [\n {\n productName: props.productName,\n url: props.imageUrl,\n },\n ],\n })\n}\n\u003C\u002Fscript>\n",[36,3791,3792,3797,3805,3813,3843,3871,3879,3887,3891,3911,3927,3936,3945,3952,3956,3971,3991,4006,4021,4030,4035,4051,4067,4072,4079,4085,4089],{"__ignoreMap":61},[65,3793,3794],{"class":67,"line":68},[65,3795,3796],{"class":3272},"\u003C!-- components\u002FTryOnWidget.vue -->\n",[65,3798,3799,3801,3803],{"class":67,"line":96},[65,3800,1876],{"class":82},[65,3802,3280],{"class":133},[65,3804,377],{"class":82},[65,3806,3807,3809,3811],{"class":67,"line":103},[65,3808,3287],{"class":82},[65,3810,688],{"class":133},[65,3812,377],{"class":82},[65,3814,3815,3817,3819,3821,3823,3825,3827,3829,3832,3834,3836,3839,3841],{"class":67,"line":154},[65,3816,910],{"class":82},[65,3818,688],{"class":133},[65,3820,691],{"class":112},[65,3822,201],{"class":82},[65,3824,204],{"class":82},[65,3826,621],{"class":86},[65,3828,204],{"class":82},[65,3830,3831],{"class":112}," class",[65,3833,201],{"class":82},[65,3835,204],{"class":82},[65,3837,3838],{"class":86},"aspect-[3\u002F4] w-full max-w-[600px]",[65,3840,204],{"class":82},[65,3842,3343],{"class":82},[65,3844,3845,3847,3849,3852,3854,3856,3859,3861,3863,3865,3867,3869],{"class":67,"line":163},[65,3846,910],{"class":82},[65,3848,752],{"class":133},[65,3850,3851],{"class":112}," @click",[65,3853,201],{"class":82},[65,3855,204],{"class":82},[65,3857,3858],{"class":86},"handleTryOn",[65,3860,204],{"class":82},[65,3862,3300],{"class":82},[65,3864,767],{"class":75},[65,3866,770],{"class":82},[65,3868,752],{"class":133},[65,3870,377],{"class":82},[65,3872,3873,3875,3877],{"class":67,"line":169},[65,3874,3348],{"class":82},[65,3876,688],{"class":133},[65,3878,377],{"class":82},[65,3880,3881,3883,3885],{"class":67,"line":181},[65,3882,770],{"class":82},[65,3884,3280],{"class":133},[65,3886,377],{"class":82},[65,3888,3889],{"class":67,"line":186},[65,3890,100],{"emptyLinePlaceholder":99},[65,3892,3893,3895,3897,3899,3901,3903,3905,3907,3909],{"class":67,"line":195},[65,3894,1876],{"class":82},[65,3896,1913],{"class":133},[65,3898,3373],{"class":112},[65,3900,3376],{"class":112},[65,3902,201],{"class":82},[65,3904,204],{"class":82},[65,3906,3383],{"class":86},[65,3908,204],{"class":82},[65,3910,377],{"class":82},[65,3912,3913,3916,3919,3921,3924],{"class":67,"line":213},[65,3914,3915],{"class":112},"const",[65,3917,3918],{"class":75}," props ",[65,3920,201],{"class":82},[65,3922,3923],{"class":116}," defineProps",[65,3925,3926],{"class":82},"\u003C{\n",[65,3928,3929,3931,3933],{"class":67,"line":228},[65,3930,435],{"class":133},[65,3932,136],{"class":82},[65,3934,3935],{"class":139}," string\n",[65,3937,3938,3941,3943],{"class":67,"line":243},[65,3939,3940],{"class":133}," imageUrl",[65,3942,136],{"class":82},[65,3944,3935],{"class":139},[65,3946,3947,3949],{"class":67,"line":249},[65,3948,764],{"class":82},[65,3950,3951],{"class":75},"()\n",[65,3953,3954],{"class":67,"line":254},[65,3955,100],{"emptyLinePlaceholder":99},[65,3957,3958,3960,3963,3965,3967,3969],{"class":67,"line":261},[65,3959,3915],{"class":112},[65,3961,3962],{"class":75}," handleTryOn ",[65,3964,201],{"class":82},[65,3966,581],{"class":82},[65,3968,517],{"class":112},[65,3970,151],{"class":82},[65,3972,3973,3975,3977,3979,3981,3983,3985,3987,3989],{"class":67,"line":274},[65,3974,1947],{"class":75},[65,3976,26],{"class":82},[65,3978,595],{"class":116},[65,3980,598],{"class":133},[65,3982,90],{"class":82},[65,3984,603],{"class":86},[65,3986,90],{"class":82},[65,3988,502],{"class":82},[65,3990,151],{"class":82},[65,3992,3993,3996,3998,4000,4002,4004],{"class":67,"line":288},[65,3994,3995],{"class":133}," targetElementId",[65,3997,136],{"class":82},[65,3999,83],{"class":82},[65,4001,621],{"class":86},[65,4003,90],{"class":82},[65,4005,626],{"class":82},[65,4007,4008,4011,4013,4015,4017,4019],{"class":67,"line":294},[65,4009,4010],{"class":133}," model",[65,4012,136],{"class":82},[65,4014,83],{"class":82},[65,4016,638],{"class":86},[65,4018,90],{"class":82},[65,4020,626],{"class":82},[65,4022,4023,4026,4028],{"class":67,"line":303},[65,4024,4025],{"class":133}," tryonItems",[65,4027,136],{"class":82},[65,4029,1414],{"class":133},[65,4031,4032],{"class":67,"line":309},[65,4033,4034],{"class":82}," {\n",[65,4036,4037,4040,4042,4045,4047,4049],{"class":67,"line":315},[65,4038,4039],{"class":133}," productName",[65,4041,136],{"class":82},[65,4043,4044],{"class":75}," props",[65,4046,26],{"class":82},[65,4048,1328],{"class":75},[65,4050,626],{"class":82},[65,4052,4053,4056,4058,4060,4062,4065],{"class":67,"line":321},[65,4054,4055],{"class":133}," url",[65,4057,136],{"class":82},[65,4059,4044],{"class":75},[65,4061,26],{"class":82},[65,4063,4064],{"class":75},"imageUrl",[65,4066,626],{"class":82},[65,4068,4069],{"class":67,"line":327},[65,4070,4071],{"class":82}," },\n",[65,4073,4074,4077],{"class":67,"line":355},[65,4075,4076],{"class":133}," ]",[65,4078,626],{"class":82},[65,4080,4081,4083],{"class":67,"line":361},[65,4082,2062],{"class":82},[65,4084,3571],{"class":133},[65,4086,4087],{"class":67,"line":369},[65,4088,178],{"class":82},[65,4090,4091,4093,4095],{"class":67,"line":380},[65,4092,770],{"class":82},[65,4094,1913],{"class":133},[65,4096,377],{"class":82},[28,4098,1065],{"id":1064},[15,4100,4101,4102,136],{},"Add to ",[36,4103,4104],{},".env",[56,4106,4108],{"className":1074,"code":4107,"language":1076,"meta":61,"style":61},"VITE_TRY_ON_API_KEY=pk_live_xxx\n",[36,4109,4110],{"__ignoreMap":61},[65,4111,4112,4114,4116],{"class":67,"line":68},[65,4113,3537],{"class":75},[65,4115,201],{"class":82},[65,4117,1087],{"class":86},[1089,4119,4120],{},"html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}",{"title":61,"searchDepth":96,"depth":96,"links":4122},[4123,4129,4130],{"id":3243,"depth":96,"text":3244,"children":4124},[4125,4127],{"id":3257,"depth":103,"text":4126},"Option A — Per Page with useHead",{"id":3583,"depth":103,"text":4128},"Option B — Global in nuxt.config.ts",{"id":3785,"depth":96,"text":3786},{"id":1064,"depth":96,"text":1065},"Integrate with a Nuxt 3 \u002F Nuxt 4 app","i-lucide-nut",{},"\u002Fen\u002Fintegrations\u002Fnuxt",{"title":3231,"description":4131},"en\u002Fintegrations\u002Fnuxt","3xlJgokLPj3qTkGk4XWJ2RH_Ar2hK0jHeC6j3_o9shE",{"id":4139,"title":4140,"body":4141,"description":5025,"extension":1102,"icon":5026,"meta":5027,"navigation":99,"path":5028,"seo":5029,"stem":5030,"__hash__":5031},"content\u002Fen\u002Fintegrations\u002Freact.md","React",{"type":7,"value":4142,"toc":5020},[4143,4147,4150,4154,4160,4345,4355,4359,4679,4683,5017],[10,4144,4146],{"id":4145},"react-integration","React Integration",[15,4148,4149],{},"Works with any React setup — Vite, Create React App, or custom.",[28,4151,4153],{"id":4152},"_1-load-the-widget-script","1. Load the Widget Script",[15,4155,4156,4157,136],{},"Add the script to your ",[36,4158,4159],{},"index.html",[56,4161,4163],{"className":1867,"code":4162,"language":1869,"meta":61,"style":61},"\u003C!-- In public\u002Findex.html or index.html (Vite) -->\n\u003Cscript\n src=\"https:\u002F\u002Fwidget.try-on.ru\u002Ffitting-widget-bundle.js\"\n id=\"fitting-widget-bundle\"\n>\u003C\u002Fscript>\n\u003Cscript id=\"fitting-init\">\n window.fitting = window.fitting || function() {\n (window.fitting.q = window.fitting.q || []).push(arguments);\n };\n window.fitting('init', {\n apiKey: '%VITE_TRY_ON_API_KEY%'\n });\n\u003C\u002Fscript>\n",[36,4164,4165,4170,4176,4188,4200,4208,4226,4250,4292,4296,4316,4329,4337],{"__ignoreMap":61},[65,4166,4167],{"class":67,"line":68},[65,4168,4169],{"class":3272},"\u003C!-- In public\u002Findex.html or index.html (Vite) -->\n",[65,4171,4172,4174],{"class":67,"line":96},[65,4173,1876],{"class":82},[65,4175,1879],{"class":133},[65,4177,4178,4180,4182,4184,4186],{"class":67,"line":103},[65,4179,1884],{"class":112},[65,4181,201],{"class":82},[65,4183,204],{"class":82},[65,4185,207],{"class":86},[65,4187,210],{"class":82},[65,4189,4190,4192,4194,4196,4198],{"class":67,"line":154},[65,4191,1897],{"class":112},[65,4193,201],{"class":82},[65,4195,204],{"class":82},[65,4197,238],{"class":86},[65,4199,210],{"class":82},[65,4201,4202,4204,4206],{"class":67,"line":163},[65,4203,1910],{"class":82},[65,4205,1913],{"class":133},[65,4207,377],{"class":82},[65,4209,4210,4212,4214,4216,4218,4220,4222,4224],{"class":67,"line":169},[65,4211,1876],{"class":82},[65,4213,1913],{"class":133},[65,4215,691],{"class":112},[65,4217,201],{"class":82},[65,4219,204],{"class":82},[65,4221,283],{"class":86},[65,4223,204],{"class":82},[65,4225,377],{"class":82},[65,4227,4228,4230,4232,4234,4236,4238,4240,4242,4244,4246,4248],{"class":67,"line":181},[65,4229,1947],{"class":75},[65,4231,26],{"class":82},[65,4233,1952],{"class":75},[65,4235,201],{"class":82},[65,4237,1957],{"class":75},[65,4239,26],{"class":82},[65,4241,1952],{"class":75},[65,4243,1964],{"class":82},[65,4245,113],{"class":112},[65,4247,1969],{"class":82},[65,4249,151],{"class":82},[65,4251,4252,4254,4256,4258,4260,4262,4264,4266,4268,4270,4272,4274,4276,4278,4280,4282,4284,4286,4288,4290],{"class":67,"line":186},[65,4253,1976],{"class":133},[65,4255,1181],{"class":75},[65,4257,26],{"class":82},[65,4259,595],{"class":75},[65,4261,26],{"class":82},[65,4263,1987],{"class":75},[65,4265,578],{"class":82},[65,4267,1957],{"class":75},[65,4269,26],{"class":82},[65,4271,595],{"class":75},[65,4273,26],{"class":82},[65,4275,1987],{"class":75},[65,4277,2002],{"class":82},[65,4279,2005],{"class":133},[65,4281,26],{"class":82},[65,4283,2010],{"class":116},[65,4285,598],{"class":133},[65,4287,2015],{"class":75},[65,4289,514],{"class":133},[65,4291,93],{"class":82},[65,4293,4294],{"class":67,"line":195},[65,4295,667],{"class":82},[65,4297,4298,4300,4302,4304,4306,4308,4310,4312,4314],{"class":67,"line":213},[65,4299,1947],{"class":75},[65,4301,26],{"class":82},[65,4303,595],{"class":116},[65,4305,598],{"class":75},[65,4307,90],{"class":82},[65,4309,1192],{"class":86},[65,4311,90],{"class":82},[65,4313,502],{"class":82},[65,4315,151],{"class":82},[65,4317,4318,4320,4322,4324,4327],{"class":67,"line":228},[65,4319,2048],{"class":133},[65,4321,136],{"class":82},[65,4323,83],{"class":82},[65,4325,4326],{"class":86},"%VITE_TRY_ON_API_KEY%",[65,4328,352],{"class":82},[65,4330,4331,4333,4335],{"class":67,"line":243},[65,4332,2062],{"class":82},[65,4334,514],{"class":75},[65,4336,93],{"class":82},[65,4338,4339,4341,4343],{"class":67,"line":249},[65,4340,770],{"class":82},[65,4342,1913],{"class":133},[65,4344,377],{"class":82},[4346,4347,4349],"callout",{"icon":4348},"i-lucide-lightbulb",[15,4350,4351,4352,4354],{},"Replace ",[36,4353,4326],{}," at build time with your actual key, or use a runtime injection approach.",[28,4356,4358],{"id":4357},"_2-create-a-custom-hook","2. Create a Custom Hook",[56,4360,4362],{"className":58,"code":4361,"language":60,"meta":61,"style":61},"\u002F\u002F hooks\u002FuseFittingWidget.ts\ninterface TryonItem {\n productName: string;\n url: string;\n productId?: string;\n}\n\ninterface CreateOptions {\n targetElementId: string;\n model?: 'balanced' | 'quality' | 'speed';\n tryonItems: TryonItem[];\n}\n\ndeclare global {\n interface Window {\n fitting: (command: string, options?: unknown) => void;\n }\n}\n\nexport function useFittingWidget() {\n const open = (options: CreateOptions) => {\n window.fitting('create', options);\n };\n\n const close = () => {\n window.fitting('close');\n };\n\n return { open, close };\n}\n",[36,4363,4364,4369,4377,4387,4397,4408,4412,4416,4425,4435,4468,4481,4485,4489,4497,4505,4535,4539,4543,4547,4560,4584,4608,4612,4616,4631,4652,4656,4660,4675],{"__ignoreMap":61},[65,4365,4366],{"class":67,"line":68},[65,4367,4368],{"class":3272},"\u002F\u002F hooks\u002FuseFittingWidget.ts\n",[65,4370,4371,4373,4375],{"class":67,"line":96},[65,4372,425],{"class":112},[65,4374,428],{"class":139},[65,4376,151],{"class":82},[65,4378,4379,4381,4383,4385],{"class":67,"line":103},[65,4380,435],{"class":133},[65,4382,136],{"class":82},[65,4384,440],{"class":139},[65,4386,93],{"class":82},[65,4388,4389,4391,4393,4395],{"class":67,"line":154},[65,4390,447],{"class":133},[65,4392,136],{"class":82},[65,4394,440],{"class":139},[65,4396,93],{"class":82},[65,4398,4399,4402,4404,4406],{"class":67,"line":163},[65,4400,4401],{"class":133}," productId",[65,4403,508],{"class":82},[65,4405,440],{"class":139},[65,4407,93],{"class":82},[65,4409,4410],{"class":67,"line":169},[65,4411,178],{"class":82},[65,4413,4414],{"class":67,"line":181},[65,4415,100],{"emptyLinePlaceholder":99},[65,4417,4418,4420,4423],{"class":67,"line":186},[65,4419,425],{"class":112},[65,4421,4422],{"class":139}," CreateOptions",[65,4424,151],{"class":82},[65,4426,4427,4429,4431,4433],{"class":67,"line":195},[65,4428,1379],{"class":133},[65,4430,136],{"class":82},[65,4432,440],{"class":139},[65,4434,93],{"class":82},[65,4436,4437,4439,4441,4443,4445,4447,4450,4452,4455,4457,4459,4461,4464,4466],{"class":67,"line":213},[65,4438,1394],{"class":133},[65,4440,508],{"class":82},[65,4442,83],{"class":82},[65,4444,638],{"class":86},[65,4446,90],{"class":82},[65,4448,4449],{"class":82}," |",[65,4451,83],{"class":82},[65,4453,4454],{"class":86},"quality",[65,4456,90],{"class":82},[65,4458,4449],{"class":82},[65,4460,83],{"class":82},[65,4462,4463],{"class":86},"speed",[65,4465,90],{"class":82},[65,4467,93],{"class":82},[65,4469,4470,4472,4474,4476,4479],{"class":67,"line":228},[65,4471,1409],{"class":133},[65,4473,136],{"class":82},[65,4475,428],{"class":139},[65,4477,4478],{"class":75},"[]",[65,4480,93],{"class":82},[65,4482,4483],{"class":67,"line":243},[65,4484,178],{"class":82},[65,4486,4487],{"class":67,"line":249},[65,4488,100],{"emptyLinePlaceholder":99},[65,4490,4491,4493,4495],{"class":67,"line":254},[65,4492,466],{"class":112},[65,4494,469],{"class":75},[65,4496,472],{"class":82},[65,4498,4499,4501,4503],{"class":67,"line":261},[65,4500,477],{"class":112},[65,4502,480],{"class":139},[65,4504,151],{"class":82},[65,4506,4507,4509,4511,4513,4515,4517,4519,4521,4523,4525,4527,4529,4531,4533],{"class":67,"line":274},[65,4508,487],{"class":133},[65,4510,136],{"class":82},[65,4512,492],{"class":82},[65,4514,495],{"class":123},[65,4516,136],{"class":82},[65,4518,440],{"class":139},[65,4520,502],{"class":82},[65,4522,505],{"class":123},[65,4524,508],{"class":82},[65,4526,511],{"class":139},[65,4528,514],{"class":82},[65,4530,517],{"class":112},[65,4532,520],{"class":139},[65,4534,93],{"class":82},[65,4536,4537],{"class":67,"line":288},[65,4538,527],{"class":82},[65,4540,4541],{"class":67,"line":294},[65,4542,178],{"class":82},[65,4544,4545],{"class":67,"line":303},[65,4546,100],{"emptyLinePlaceholder":99},[65,4548,4549,4551,4553,4556,4558],{"class":67,"line":309},[65,4550,106],{"class":71},[65,4552,113],{"class":112},[65,4554,4555],{"class":116}," useFittingWidget",[65,4557,1969],{"class":82},[65,4559,151],{"class":82},[65,4561,4562,4564,4567,4569,4571,4574,4576,4578,4580,4582],{"class":67,"line":315},[65,4563,572],{"class":112},[65,4565,4566],{"class":75}," open",[65,4568,578],{"class":82},[65,4570,492],{"class":82},[65,4572,4573],{"class":123},"options",[65,4575,136],{"class":82},[65,4577,4422],{"class":139},[65,4579,514],{"class":82},[65,4581,517],{"class":112},[65,4583,151],{"class":82},[65,4585,4586,4588,4590,4592,4594,4596,4598,4600,4602,4604,4606],{"class":67,"line":321},[65,4587,590],{"class":75},[65,4589,26],{"class":82},[65,4591,595],{"class":116},[65,4593,598],{"class":133},[65,4595,90],{"class":82},[65,4597,603],{"class":86},[65,4599,90],{"class":82},[65,4601,502],{"class":82},[65,4603,505],{"class":75},[65,4605,514],{"class":133},[65,4607,93],{"class":82},[65,4609,4610],{"class":67,"line":327},[65,4611,667],{"class":82},[65,4613,4614],{"class":67,"line":355},[65,4615,100],{"emptyLinePlaceholder":99},[65,4617,4618,4620,4623,4625,4627,4629],{"class":67,"line":361},[65,4619,572],{"class":112},[65,4621,4622],{"class":75}," close",[65,4624,578],{"class":82},[65,4626,581],{"class":82},[65,4628,517],{"class":112},[65,4630,151],{"class":82},[65,4632,4633,4635,4637,4639,4641,4643,4646,4648,4650],{"class":67,"line":369},[65,4634,590],{"class":75},[65,4636,26],{"class":82},[65,4638,595],{"class":116},[65,4640,598],{"class":133},[65,4642,90],{"class":82},[65,4644,4645],{"class":86},"close",[65,4647,90],{"class":82},[65,4649,514],{"class":133},[65,4651,93],{"class":82},[65,4653,4654],{"class":67,"line":380},[65,4655,667],{"class":82},[65,4657,4658],{"class":67,"line":386},[65,4659,100],{"emptyLinePlaceholder":99},[65,4661,4662,4664,4666,4668,4670,4672],{"class":67,"line":394},[65,4663,157],{"class":71},[65,4665,130],{"class":82},[65,4667,4566],{"class":75},[65,4669,502],{"class":82},[65,4671,4622],{"class":75},[65,4673,4674],{"class":82}," };\n",[65,4676,4677],{"class":67,"line":3566},[65,4678,178],{"class":82},[28,4680,4682],{"id":4681},"_3-use-in-a-component","3. Use in a Component",[56,4684,4686],{"className":58,"code":4685,"language":60,"meta":61,"style":61},"\u002F\u002F components\u002FTryOnWidget.tsx\nimport { useFittingWidget } from '..\u002Fhooks\u002FuseFittingWidget';\n\ninterface Props {\n productName: string;\n imageUrl: string;\n}\n\nexport function TryOnWidget({ productName, imageUrl }: Props) {\n const { open } = useFittingWidget();\n\n return (\n \u003Cdiv>\n \u003Cdiv\n id=\"widget-container\"\n style={{ width: '100%', maxWidth: 600, aspectRatio: '3\u002F4' }}\n \u002F>\n \u003Cbutton\n onClick={() =>\n open({\n targetElementId: 'widget-container',\n model: 'balanced',\n tryonItems: [{ productName, url: imageUrl }],\n })\n }\n >\n Try On\n \u003C\u002Fbutton>\n \u003C\u002Fdiv>\n );\n}\n",[36,4687,4688,4693,4714,4718,4727,4737,4747,4751,4755,4782,4800,4804,4810,4818,4825,4837,4877,4881,4888,4899,4908,4923,4938,4970,4977,4982,4986,4991,4999,5007,5013],{"__ignoreMap":61},[65,4689,4690],{"class":67,"line":68},[65,4691,4692],{"class":3272},"\u002F\u002F components\u002FTryOnWidget.tsx\n",[65,4694,4695,4697,4699,4701,4703,4705,4707,4710,4712],{"class":67,"line":96},[65,4696,72],{"class":71},[65,4698,130],{"class":82},[65,4700,4555],{"class":75},[65,4702,808],{"class":82},[65,4704,811],{"class":71},[65,4706,83],{"class":82},[65,4708,4709],{"class":86},"..\u002Fhooks\u002FuseFittingWidget",[65,4711,90],{"class":82},[65,4713,93],{"class":82},[65,4715,4716],{"class":67,"line":103},[65,4717,100],{"emptyLinePlaceholder":99},[65,4719,4720,4722,4725],{"class":67,"line":154},[65,4721,425],{"class":112},[65,4723,4724],{"class":139}," Props",[65,4726,151],{"class":82},[65,4728,4729,4731,4733,4735],{"class":67,"line":163},[65,4730,435],{"class":133},[65,4732,136],{"class":82},[65,4734,440],{"class":139},[65,4736,93],{"class":82},[65,4738,4739,4741,4743,4745],{"class":67,"line":169},[65,4740,3940],{"class":133},[65,4742,136],{"class":82},[65,4744,440],{"class":139},[65,4746,93],{"class":82},[65,4748,4749],{"class":67,"line":181},[65,4750,178],{"class":82},[65,4752,4753],{"class":67,"line":186},[65,4754,100],{"emptyLinePlaceholder":99},[65,4756,4757,4759,4761,4764,4766,4769,4771,4774,4776,4778,4780],{"class":67,"line":195},[65,4758,106],{"class":71},[65,4760,113],{"class":112},[65,4762,4763],{"class":116}," TryOnWidget",[65,4765,120],{"class":82},[65,4767,4768],{"class":123}," productName",[65,4770,502],{"class":82},[65,4772,4773],{"class":123}," imageUrl",[65,4775,127],{"class":82},[65,4777,4724],{"class":139},[65,4779,514],{"class":82},[65,4781,151],{"class":82},[65,4783,4784,4786,4788,4790,4792,4794,4796,4798],{"class":67,"line":213},[65,4785,572],{"class":112},[65,4787,130],{"class":82},[65,4789,4566],{"class":75},[65,4791,808],{"class":82},[65,4793,578],{"class":82},[65,4795,4555],{"class":116},[65,4797,1969],{"class":133},[65,4799,93],{"class":82},[65,4801,4802],{"class":67,"line":228},[65,4803,100],{"emptyLinePlaceholder":99},[65,4805,4806,4808],{"class":67,"line":243},[65,4807,157],{"class":71},[65,4809,160],{"class":133},[65,4811,4812,4814,4816],{"class":67,"line":249},[65,4813,910],{"class":82},[65,4815,688],{"class":133},[65,4817,377],{"class":82},[65,4819,4820,4822],{"class":67,"line":254},[65,4821,189],{"class":82},[65,4823,4824],{"class":133},"div\n",[65,4826,4827,4829,4831,4833,4835],{"class":67,"line":261},[65,4828,231],{"class":112},[65,4830,201],{"class":82},[65,4832,204],{"class":82},[65,4834,621],{"class":86},[65,4836,210],{"class":82},[65,4838,4839,4842,4844,4846,4848,4850,4852,4854,4856,4858,4860,4862,4864,4866,4868,4870,4872,4874],{"class":67,"line":274},[65,4840,4841],{"class":112}," style",[65,4843,705],{"class":82},[65,4845,708],{"class":133},[65,4847,136],{"class":82},[65,4849,83],{"class":82},[65,4851,715],{"class":86},[65,4853,90],{"class":82},[65,4855,502],{"class":82},[65,4857,722],{"class":133},[65,4859,136],{"class":82},[65,4861,728],{"class":727},[65,4863,502],{"class":82},[65,4865,733],{"class":133},[65,4867,136],{"class":82},[65,4869,83],{"class":82},[65,4871,740],{"class":86},[65,4873,90],{"class":82},[65,4875,4876],{"class":82}," }}\n",[65,4878,4879],{"class":67,"line":288},[65,4880,246],{"class":82},[65,4882,4883,4885],{"class":67,"line":294},[65,4884,189],{"class":82},[65,4886,4887],{"class":133},"button\n",[65,4889,4890,4893,4896],{"class":67,"line":303},[65,4891,4892],{"class":112}," onClick",[65,4894,4895],{"class":82},"={()",[65,4897,4898],{"class":112}," =>\n",[65,4900,4901,4904,4906],{"class":67,"line":309},[65,4902,4903],{"class":116}," open",[65,4905,598],{"class":75},[65,4907,472],{"class":82},[65,4909,4910,4913,4915,4917,4919,4921],{"class":67,"line":315},[65,4911,4912],{"class":133}," targetElementId",[65,4914,136],{"class":82},[65,4916,83],{"class":82},[65,4918,621],{"class":86},[65,4920,90],{"class":82},[65,4922,626],{"class":82},[65,4924,4925,4928,4930,4932,4934,4936],{"class":67,"line":321},[65,4926,4927],{"class":133}," model",[65,4929,136],{"class":82},[65,4931,83],{"class":82},[65,4933,638],{"class":86},[65,4935,90],{"class":82},[65,4937,626],{"class":82},[65,4939,4940,4943,4945,4948,4951,4953,4955,4958,4960,4963,4965,4968],{"class":67,"line":327},[65,4941,4942],{"class":133}," tryonItems",[65,4944,136],{"class":82},[65,4946,4947],{"class":75}," [",[65,4949,4950],{"class":82},"{",[65,4952,4768],{"class":75},[65,4954,502],{"class":82},[65,4956,4957],{"class":133}," url",[65,4959,136],{"class":82},[65,4961,4962],{"class":75}," imageUrl ",[65,4964,349],{"class":82},[65,4966,4967],{"class":75},"]",[65,4969,626],{"class":82},[65,4971,4972,4975],{"class":67,"line":355},[65,4973,4974],{"class":82}," }",[65,4976,3571],{"class":75},[65,4978,4979],{"class":67,"line":361},[65,4980,4981],{"class":82}," }\n",[65,4983,4984],{"class":67,"line":369},[65,4985,291],{"class":82},[65,4987,4988],{"class":67,"line":380},[65,4989,4990],{"class":75}," Try On\n",[65,4992,4993,4995,4997],{"class":67,"line":386},[65,4994,372],{"class":82},[65,4996,752],{"class":133},[65,4998,377],{"class":82},[65,5000,5001,5003,5005],{"class":67,"line":394},[65,5002,1047],{"class":82},[65,5004,688],{"class":133},[65,5006,377],{"class":82},[65,5008,5009,5011],{"class":67,"line":3566},[65,5010,389],{"class":133},[65,5012,93],{"class":82},[65,5014,5015],{"class":67,"line":3574},[65,5016,178],{"class":82},[1089,5018,5019],{},"html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}",{"title":61,"searchDepth":96,"depth":96,"links":5021},[5022,5023,5024],{"id":4152,"depth":96,"text":4153},{"id":4357,"depth":96,"text":4358},{"id":4681,"depth":96,"text":4682},"Integrate with a React (Vite \u002F CRA) app","i-lucide-react",{},"\u002Fen\u002Fintegrations\u002Freact",{"title":4140,"description":5025},"en\u002Fintegrations\u002Freact","pb3AGE_nU_OjJFKOaRsB1vUMbyzjRuGZlTgplr5i71Q",{"id":5033,"title":5034,"body":5035,"description":5705,"extension":1102,"icon":5706,"meta":5707,"navigation":99,"path":5708,"seo":5709,"stem":5710,"__hash__":5711},"content\u002Fen\u002Fintegrations\u002Fvanilla-js.md","Vanilla JS",{"type":7,"value":5036,"toc":5701},[5037,5041,5044,5048,5675,5679,5698],[10,5038,5040],{"id":5039},"vanilla-js-integration","Vanilla JS Integration",[15,5042,5043],{},"No framework needed — just HTML and JavaScript.",[28,5045,5047],{"id":5046},"full-example","Full Example",[56,5049,5051],{"className":1867,"code":5050,"language":1869,"meta":61,"style":61},"\u003C!DOCTYPE html>\n\u003Chtml lang=\"en\">\n\u003Chead>\n \u003Cmeta charset=\"UTF-8\" \u002F>\n \u003Cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \u002F>\n \u003Ctitle>Product Page — Virtual Try-On\u003C\u002Ftitle>\n\u003C\u002Fhead>\n\u003Cbody>\n\n \u003Ch1>Classic Denim Jacket\u003C\u002Fh1>\n \u003Cp>$89.00\u003C\u002Fp>\n\n \u003C!-- Widget container -->\n \u003Cdiv id=\"widget-container\" style=\"width: 100%; max-width: 600px; aspect-ratio: 3 \u002F 4;\">\u003C\u002Fdiv>\n\n \u003Cbutton onclick=\"openWidget()\">Try On\u003C\u002Fbutton>\n\n \u003C!-- 1. Load the widget bundle -->\n \u003Cscript\n src=\"https:\u002F\u002Fwidget.try-on.ru\u002Ffitting-widget-bundle.js\"\n id=\"fitting-widget-bundle\"\n >\u003C\u002Fscript>\n\n \u003C!-- 2. Initialize -->\n \u003Cscript id=\"fitting-init\">\n window.fitting = window.fitting || function() {\n (window.fitting.q = window.fitting.q || []).push(arguments);\n };\n window.fitting('init', {\n apiKey: 'YOUR_API_KEY'\n });\n \u003C\u002Fscript>\n\n \u003Cscript>\n function openWidget() {\n window.fitting('create', {\n targetElementId: 'widget-container',\n model: 'balanced',\n tryonItems: [\n {\n productName: 'Classic Denim Jacket',\n url: 'https:\u002F\u002Fexample.com\u002Fimages\u002Fjacket.jpg',\n },\n ],\n });\n }\n \u003C\u002Fscript>\n\u003C\u002Fbody>\n\u003C\u002Fhtml>\n",[36,5052,5053,5066,5085,5094,5114,5146,5164,5172,5181,5185,5201,5218,5222,5227,5260,5264,5294,5298,5303,5309,5322,5335,5344,5348,5353,5371,5395,5438,5443,5463,5476,5484,5493,5498,5507,5520,5542,5558,5574,5584,5589,5604,5620,5625,5632,5642,5648,5657,5666],{"__ignoreMap":61},[65,5054,5055,5058,5061,5064],{"class":67,"line":68},[65,5056,5057],{"class":82},"\u003C!",[65,5059,5060],{"class":133},"DOCTYPE",[65,5062,5063],{"class":112}," html",[65,5065,377],{"class":82},[65,5067,5068,5070,5072,5074,5076,5078,5081,5083],{"class":67,"line":96},[65,5069,1876],{"class":82},[65,5071,1869],{"class":133},[65,5073,3376],{"class":112},[65,5075,201],{"class":82},[65,5077,204],{"class":82},[65,5079,5080],{"class":86},"en",[65,5082,204],{"class":82},[65,5084,377],{"class":82},[65,5086,5087,5089,5092],{"class":67,"line":103},[65,5088,1876],{"class":82},[65,5090,5091],{"class":133},"head",[65,5093,377],{"class":82},[65,5095,5096,5098,5100,5103,5105,5107,5110,5112],{"class":67,"line":154},[65,5097,3287],{"class":82},[65,5099,3528],{"class":133},[65,5101,5102],{"class":112}," charset",[65,5104,201],{"class":82},[65,5106,204],{"class":82},[65,5108,5109],{"class":86},"UTF-8",[65,5111,204],{"class":82},[65,5113,3343],{"class":82},[65,5115,5116,5118,5120,5123,5125,5127,5130,5132,5135,5137,5139,5142,5144],{"class":67,"line":163},[65,5117,3287],{"class":82},[65,5119,3528],{"class":133},[65,5121,5122],{"class":112}," name",[65,5124,201],{"class":82},[65,5126,204],{"class":82},[65,5128,5129],{"class":86},"viewport",[65,5131,204],{"class":82},[65,5133,5134],{"class":112}," content",[65,5136,201],{"class":82},[65,5138,204],{"class":82},[65,5140,5141],{"class":86},"width=device-width, initial-scale=1.0",[65,5143,204],{"class":82},[65,5145,3343],{"class":82},[65,5147,5148,5150,5153,5155,5158,5160,5162],{"class":67,"line":169},[65,5149,3287],{"class":82},[65,5151,5152],{"class":133},"title",[65,5154,3300],{"class":82},[65,5156,5157],{"class":75},"Product Page — Virtual Try-On",[65,5159,770],{"class":82},[65,5161,5152],{"class":133},[65,5163,377],{"class":82},[65,5165,5166,5168,5170],{"class":67,"line":181},[65,5167,770],{"class":82},[65,5169,5091],{"class":133},[65,5171,377],{"class":82},[65,5173,5174,5176,5179],{"class":67,"line":186},[65,5175,1876],{"class":82},[65,5177,5178],{"class":133},"body",[65,5180,377],{"class":82},[65,5182,5183],{"class":67,"line":195},[65,5184,100],{"emptyLinePlaceholder":99},[65,5186,5187,5189,5191,5193,5195,5197,5199],{"class":67,"line":213},[65,5188,3287],{"class":82},[65,5190,10],{"class":133},[65,5192,3300],{"class":82},[65,5194,2198],{"class":75},[65,5196,770],{"class":82},[65,5198,10],{"class":133},[65,5200,377],{"class":82},[65,5202,5203,5205,5207,5209,5212,5214,5216],{"class":67,"line":228},[65,5204,3287],{"class":82},[65,5206,15],{"class":133},[65,5208,3300],{"class":82},[65,5210,5211],{"class":75},"$89.00",[65,5213,770],{"class":82},[65,5215,15],{"class":133},[65,5217,377],{"class":82},[65,5219,5220],{"class":67,"line":243},[65,5221,100],{"emptyLinePlaceholder":99},[65,5223,5224],{"class":67,"line":249},[65,5225,5226],{"class":3272}," \u003C!-- Widget container -->\n",[65,5228,5229,5231,5233,5235,5237,5239,5241,5243,5245,5247,5249,5252,5254,5256,5258],{"class":67,"line":254},[65,5230,3287],{"class":82},[65,5232,688],{"class":133},[65,5234,691],{"class":112},[65,5236,201],{"class":82},[65,5238,204],{"class":82},[65,5240,621],{"class":86},[65,5242,204],{"class":82},[65,5244,702],{"class":112},[65,5246,201],{"class":82},[65,5248,204],{"class":82},[65,5250,5251],{"class":86},"width: 100%; max-width: 600px; aspect-ratio: 3 \u002F 4;",[65,5253,204],{"class":82},[65,5255,1910],{"class":82},[65,5257,688],{"class":133},[65,5259,377],{"class":82},[65,5261,5262],{"class":67,"line":261},[65,5263,100],{"emptyLinePlaceholder":99},[65,5265,5266,5268,5270,5273,5275,5277,5280,5282,5284,5286,5288,5290,5292],{"class":67,"line":274},[65,5267,3287],{"class":82},[65,5269,752],{"class":133},[65,5271,5272],{"class":112}," onclick",[65,5274,201],{"class":82},[65,5276,204],{"class":82},[65,5278,5279],{"class":116},"openWidget",[65,5281,1969],{"class":86},[65,5283,204],{"class":82},[65,5285,3300],{"class":82},[65,5287,767],{"class":75},[65,5289,770],{"class":82},[65,5291,752],{"class":133},[65,5293,377],{"class":82},[65,5295,5296],{"class":67,"line":288},[65,5297,100],{"emptyLinePlaceholder":99},[65,5299,5300],{"class":67,"line":294},[65,5301,5302],{"class":3272}," \u003C!-- 1. Load the widget bundle -->\n",[65,5304,5305,5307],{"class":67,"line":303},[65,5306,3287],{"class":82},[65,5308,1879],{"class":133},[65,5310,5311,5314,5316,5318,5320],{"class":67,"line":309},[65,5312,5313],{"class":112}," src",[65,5315,201],{"class":82},[65,5317,204],{"class":82},[65,5319,207],{"class":86},[65,5321,210],{"class":82},[65,5323,5324,5327,5329,5331,5333],{"class":67,"line":315},[65,5325,5326],{"class":112}," id",[65,5328,201],{"class":82},[65,5330,204],{"class":82},[65,5332,238],{"class":86},[65,5334,210],{"class":82},[65,5336,5337,5340,5342],{"class":67,"line":321},[65,5338,5339],{"class":82}," >\u003C\u002F",[65,5341,1913],{"class":133},[65,5343,377],{"class":82},[65,5345,5346],{"class":67,"line":327},[65,5347,100],{"emptyLinePlaceholder":99},[65,5349,5350],{"class":67,"line":355},[65,5351,5352],{"class":3272}," \u003C!-- 2. Initialize -->\n",[65,5354,5355,5357,5359,5361,5363,5365,5367,5369],{"class":67,"line":361},[65,5356,3287],{"class":82},[65,5358,1913],{"class":133},[65,5360,691],{"class":112},[65,5362,201],{"class":82},[65,5364,204],{"class":82},[65,5366,283],{"class":86},[65,5368,204],{"class":82},[65,5370,377],{"class":82},[65,5372,5373,5375,5377,5379,5381,5383,5385,5387,5389,5391,5393],{"class":67,"line":369},[65,5374,590],{"class":75},[65,5376,26],{"class":82},[65,5378,1952],{"class":75},[65,5380,201],{"class":82},[65,5382,1957],{"class":75},[65,5384,26],{"class":82},[65,5386,1952],{"class":75},[65,5388,1964],{"class":82},[65,5390,113],{"class":112},[65,5392,1969],{"class":82},[65,5394,151],{"class":82},[65,5396,5397,5400,5402,5404,5406,5408,5410,5412,5414,5416,5418,5420,5422,5424,5426,5428,5430,5432,5434,5436],{"class":67,"line":380},[65,5398,5399],{"class":133}," (",[65,5401,1181],{"class":75},[65,5403,26],{"class":82},[65,5405,595],{"class":75},[65,5407,26],{"class":82},[65,5409,1987],{"class":75},[65,5411,578],{"class":82},[65,5413,1957],{"class":75},[65,5415,26],{"class":82},[65,5417,595],{"class":75},[65,5419,26],{"class":82},[65,5421,1987],{"class":75},[65,5423,2002],{"class":82},[65,5425,2005],{"class":133},[65,5427,26],{"class":82},[65,5429,2010],{"class":116},[65,5431,598],{"class":133},[65,5433,2015],{"class":75},[65,5435,514],{"class":133},[65,5437,93],{"class":82},[65,5439,5440],{"class":67,"line":386},[65,5441,5442],{"class":82}," };\n",[65,5444,5445,5447,5449,5451,5453,5455,5457,5459,5461],{"class":67,"line":394},[65,5446,590],{"class":75},[65,5448,26],{"class":82},[65,5450,595],{"class":116},[65,5452,598],{"class":75},[65,5454,90],{"class":82},[65,5456,1192],{"class":86},[65,5458,90],{"class":82},[65,5460,502],{"class":82},[65,5462,151],{"class":82},[65,5464,5465,5468,5470,5472,5474],{"class":67,"line":3566},[65,5466,5467],{"class":133}," apiKey",[65,5469,136],{"class":82},[65,5471,83],{"class":82},[65,5473,2055],{"class":86},[65,5475,352],{"class":82},[65,5477,5478,5480,5482],{"class":67,"line":3574},[65,5479,658],{"class":82},[65,5481,514],{"class":75},[65,5483,93],{"class":82},[65,5485,5487,5489,5491],{"class":67,"line":5486},32,[65,5488,3348],{"class":82},[65,5490,1913],{"class":133},[65,5492,377],{"class":82},[65,5494,5496],{"class":67,"line":5495},33,[65,5497,100],{"emptyLinePlaceholder":99},[65,5499,5501,5503,5505],{"class":67,"line":5500},34,[65,5502,3287],{"class":82},[65,5504,1913],{"class":133},[65,5506,377],{"class":82},[65,5508,5510,5513,5516,5518],{"class":67,"line":5509},35,[65,5511,5512],{"class":112}," function",[65,5514,5515],{"class":116}," openWidget",[65,5517,1969],{"class":82},[65,5519,151],{"class":82},[65,5521,5523,5526,5528,5530,5532,5534,5536,5538,5540],{"class":67,"line":5522},36,[65,5524,5525],{"class":75}," window",[65,5527,26],{"class":82},[65,5529,595],{"class":116},[65,5531,598],{"class":133},[65,5533,90],{"class":82},[65,5535,603],{"class":86},[65,5537,90],{"class":82},[65,5539,502],{"class":82},[65,5541,151],{"class":82},[65,5543,5545,5548,5550,5552,5554,5556],{"class":67,"line":5544},37,[65,5546,5547],{"class":133}," targetElementId",[65,5549,136],{"class":82},[65,5551,83],{"class":82},[65,5553,621],{"class":86},[65,5555,90],{"class":82},[65,5557,626],{"class":82},[65,5559,5561,5564,5566,5568,5570,5572],{"class":67,"line":5560},38,[65,5562,5563],{"class":133}," model",[65,5565,136],{"class":82},[65,5567,83],{"class":82},[65,5569,638],{"class":86},[65,5571,90],{"class":82},[65,5573,626],{"class":82},[65,5575,5577,5580,5582],{"class":67,"line":5576},39,[65,5578,5579],{"class":133}," tryonItems",[65,5581,136],{"class":82},[65,5583,1414],{"class":133},[65,5585,5587],{"class":67,"line":5586},40,[65,5588,996],{"class":82},[65,5590,5592,5594,5596,5598,5600,5602],{"class":67,"line":5591},41,[65,5593,1001],{"class":133},[65,5595,136],{"class":82},[65,5597,83],{"class":82},[65,5599,2198],{"class":86},[65,5601,90],{"class":82},[65,5603,626],{"class":82},[65,5605,5607,5609,5611,5613,5616,5618],{"class":67,"line":5606},42,[65,5608,1016],{"class":133},[65,5610,136],{"class":82},[65,5612,83],{"class":82},[65,5614,5615],{"class":86},"https:\u002F\u002Fexample.com\u002Fimages\u002Fjacket.jpg",[65,5617,90],{"class":82},[65,5619,626],{"class":82},[65,5621,5623],{"class":67,"line":5622},43,[65,5624,1031],{"class":82},[65,5626,5628,5630],{"class":67,"line":5627},44,[65,5629,1036],{"class":133},[65,5631,626],{"class":82},[65,5633,5635,5638,5640],{"class":67,"line":5634},45,[65,5636,5637],{"class":82}," }",[65,5639,514],{"class":133},[65,5641,93],{"class":82},[65,5643,5645],{"class":67,"line":5644},46,[65,5646,5647],{"class":82}," }\n",[65,5649,5651,5653,5655],{"class":67,"line":5650},47,[65,5652,3348],{"class":82},[65,5654,1913],{"class":133},[65,5656,377],{"class":82},[65,5658,5660,5662,5664],{"class":67,"line":5659},48,[65,5661,770],{"class":82},[65,5663,5178],{"class":133},[65,5665,377],{"class":82},[65,5667,5669,5671,5673],{"class":67,"line":5668},49,[65,5670,770],{"class":82},[65,5672,1869],{"class":133},[65,5674,377],{"class":82},[28,5676,5678],{"id":5677},"key-points","Key Points",[2248,5680,5681,5684,5693],{},[2251,5682,5683],{},"Load the bundle script first.",[2251,5685,5686,5687,5690,5691,26],{},"Initialize with ",[36,5688,5689],{},"window.fitting('init', { apiKey })"," before calling ",[36,5692,603],{},[2251,5694,2293,5695,5697],{},[36,5696,1255],{}," must match an existing element on the page.",[1089,5699,5700],{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":61,"searchDepth":96,"depth":96,"links":5702},[5703,5704],{"id":5046,"depth":96,"text":5047},{"id":5677,"depth":96,"text":5678},"Integrate with plain HTML\u002FJavaScript","i-lucide-file-code",{},"\u002Fen\u002Fintegrations\u002Fvanilla-js",{"title":5034,"description":5705},"en\u002Fintegrations\u002Fvanilla-js","Ts8msIFer-tIlPDRwRbkNZSpWu0JrTJP8uMKqB57tJQ",{"id":5713,"title":5714,"body":5715,"description":6560,"extension":1102,"icon":6561,"meta":6562,"navigation":99,"path":6563,"seo":6564,"stem":6565,"__hash__":6566},"content\u002Fen\u002Fintegrations\u002Fvue.md","Vue 3",{"type":7,"value":5716,"toc":6555},[5717,5721,5724,5726,5731,5910,5914,6212,6216,6552],[10,5718,5720],{"id":5719},"vue-3-integration","Vue 3 Integration",[15,5722,5723],{},"Works with Vue 3 + Vite or any Vue 3 setup.",[28,5725,4153],{"id":4152},[15,5727,5728,5729,136],{},"In ",[36,5730,4159],{},[56,5732,5734],{"className":1867,"code":5733,"language":1869,"meta":61,"style":61},"\u003Cscript\n src=\"https:\u002F\u002Fwidget.try-on.ru\u002Ffitting-widget-bundle.js\"\n id=\"fitting-widget-bundle\"\n>\u003C\u002Fscript>\n\u003Cscript id=\"fitting-init\">\n window.fitting = window.fitting || function() {\n (window.fitting.q = window.fitting.q || []).push(arguments);\n };\n window.fitting('init', {\n apiKey: 'YOUR_API_KEY'\n });\n\u003C\u002Fscript>\n",[36,5735,5736,5742,5754,5766,5774,5792,5816,5858,5862,5882,5894,5902],{"__ignoreMap":61},[65,5737,5738,5740],{"class":67,"line":68},[65,5739,1876],{"class":82},[65,5741,1879],{"class":133},[65,5743,5744,5746,5748,5750,5752],{"class":67,"line":96},[65,5745,1884],{"class":112},[65,5747,201],{"class":82},[65,5749,204],{"class":82},[65,5751,207],{"class":86},[65,5753,210],{"class":82},[65,5755,5756,5758,5760,5762,5764],{"class":67,"line":103},[65,5757,1897],{"class":112},[65,5759,201],{"class":82},[65,5761,204],{"class":82},[65,5763,238],{"class":86},[65,5765,210],{"class":82},[65,5767,5768,5770,5772],{"class":67,"line":154},[65,5769,1910],{"class":82},[65,5771,1913],{"class":133},[65,5773,377],{"class":82},[65,5775,5776,5778,5780,5782,5784,5786,5788,5790],{"class":67,"line":163},[65,5777,1876],{"class":82},[65,5779,1913],{"class":133},[65,5781,691],{"class":112},[65,5783,201],{"class":82},[65,5785,204],{"class":82},[65,5787,283],{"class":86},[65,5789,204],{"class":82},[65,5791,377],{"class":82},[65,5793,5794,5796,5798,5800,5802,5804,5806,5808,5810,5812,5814],{"class":67,"line":169},[65,5795,1947],{"class":75},[65,5797,26],{"class":82},[65,5799,1952],{"class":75},[65,5801,201],{"class":82},[65,5803,1957],{"class":75},[65,5805,26],{"class":82},[65,5807,1952],{"class":75},[65,5809,1964],{"class":82},[65,5811,113],{"class":112},[65,5813,1969],{"class":82},[65,5815,151],{"class":82},[65,5817,5818,5820,5822,5824,5826,5828,5830,5832,5834,5836,5838,5840,5842,5844,5846,5848,5850,5852,5854,5856],{"class":67,"line":181},[65,5819,1976],{"class":133},[65,5821,1181],{"class":75},[65,5823,26],{"class":82},[65,5825,595],{"class":75},[65,5827,26],{"class":82},[65,5829,1987],{"class":75},[65,5831,578],{"class":82},[65,5833,1957],{"class":75},[65,5835,26],{"class":82},[65,5837,595],{"class":75},[65,5839,26],{"class":82},[65,5841,1987],{"class":75},[65,5843,2002],{"class":82},[65,5845,2005],{"class":133},[65,5847,26],{"class":82},[65,5849,2010],{"class":116},[65,5851,598],{"class":133},[65,5853,2015],{"class":75},[65,5855,514],{"class":133},[65,5857,93],{"class":82},[65,5859,5860],{"class":67,"line":186},[65,5861,667],{"class":82},[65,5863,5864,5866,5868,5870,5872,5874,5876,5878,5880],{"class":67,"line":195},[65,5865,1947],{"class":75},[65,5867,26],{"class":82},[65,5869,595],{"class":116},[65,5871,598],{"class":75},[65,5873,90],{"class":82},[65,5875,1192],{"class":86},[65,5877,90],{"class":82},[65,5879,502],{"class":82},[65,5881,151],{"class":82},[65,5883,5884,5886,5888,5890,5892],{"class":67,"line":213},[65,5885,2048],{"class":133},[65,5887,136],{"class":82},[65,5889,83],{"class":82},[65,5891,2055],{"class":86},[65,5893,352],{"class":82},[65,5895,5896,5898,5900],{"class":67,"line":228},[65,5897,2062],{"class":82},[65,5899,514],{"class":75},[65,5901,93],{"class":82},[65,5903,5904,5906,5908],{"class":67,"line":243},[65,5905,770],{"class":82},[65,5907,1913],{"class":133},[65,5909,377],{"class":82},[28,5911,5913],{"id":5912},"_2-create-a-composable","2. Create a Composable",[56,5915,5917],{"className":3589,"code":5916,"language":3383,"meta":61,"style":61},"\u002F\u002F composables\u002FuseFittingWidget.ts\nexport interface TryonItem {\n productName: string\n url: string\n productId?: string\n}\n\nexport interface CreateOptions {\n targetElementId: string\n model?: 'balanced' | 'quality' | 'speed'\n tryonItems: TryonItem[]\n}\n\ndeclare global {\n interface Window {\n fitting: (command: string, options?: unknown) => void\n }\n}\n\nexport function useFittingWidget() {\n const open = (options: CreateOptions) => {\n window.fitting('create', options)\n }\n\n const close = () => {\n window.fitting('close')\n }\n\n return { open, close }\n}\n",[36,5918,5919,5924,5935,5943,5951,5959,5963,5967,5977,5985,6013,6024,6028,6032,6040,6048,6077,6081,6085,6089,6101,6123,6145,6149,6153,6167,6185,6189,6193,6208],{"__ignoreMap":61},[65,5920,5921],{"class":67,"line":68},[65,5922,5923],{"class":3272},"\u002F\u002F composables\u002FuseFittingWidget.ts\n",[65,5925,5926,5928,5931,5933],{"class":67,"line":96},[65,5927,106],{"class":71},[65,5929,5930],{"class":112}," interface",[65,5932,428],{"class":139},[65,5934,151],{"class":82},[65,5936,5937,5939,5941],{"class":67,"line":103},[65,5938,435],{"class":133},[65,5940,136],{"class":82},[65,5942,3935],{"class":139},[65,5944,5945,5947,5949],{"class":67,"line":154},[65,5946,447],{"class":133},[65,5948,136],{"class":82},[65,5950,3935],{"class":139},[65,5952,5953,5955,5957],{"class":67,"line":163},[65,5954,4401],{"class":133},[65,5956,508],{"class":82},[65,5958,3935],{"class":139},[65,5960,5961],{"class":67,"line":169},[65,5962,178],{"class":82},[65,5964,5965],{"class":67,"line":181},[65,5966,100],{"emptyLinePlaceholder":99},[65,5968,5969,5971,5973,5975],{"class":67,"line":186},[65,5970,106],{"class":71},[65,5972,5930],{"class":112},[65,5974,4422],{"class":139},[65,5976,151],{"class":82},[65,5978,5979,5981,5983],{"class":67,"line":195},[65,5980,1379],{"class":133},[65,5982,136],{"class":82},[65,5984,3935],{"class":139},[65,5986,5987,5989,5991,5993,5995,5997,5999,6001,6003,6005,6007,6009,6011],{"class":67,"line":213},[65,5988,1394],{"class":133},[65,5990,508],{"class":82},[65,5992,83],{"class":82},[65,5994,638],{"class":86},[65,5996,90],{"class":82},[65,5998,4449],{"class":82},[65,6000,83],{"class":82},[65,6002,4454],{"class":86},[65,6004,90],{"class":82},[65,6006,4449],{"class":82},[65,6008,83],{"class":82},[65,6010,4463],{"class":86},[65,6012,352],{"class":82},[65,6014,6015,6017,6019,6021],{"class":67,"line":228},[65,6016,1409],{"class":133},[65,6018,136],{"class":82},[65,6020,428],{"class":139},[65,6022,6023],{"class":75},"[]\n",[65,6025,6026],{"class":67,"line":243},[65,6027,178],{"class":82},[65,6029,6030],{"class":67,"line":249},[65,6031,100],{"emptyLinePlaceholder":99},[65,6033,6034,6036,6038],{"class":67,"line":254},[65,6035,466],{"class":112},[65,6037,469],{"class":75},[65,6039,472],{"class":82},[65,6041,6042,6044,6046],{"class":67,"line":261},[65,6043,477],{"class":112},[65,6045,480],{"class":139},[65,6047,151],{"class":82},[65,6049,6050,6052,6054,6056,6058,6060,6062,6064,6066,6068,6070,6072,6074],{"class":67,"line":274},[65,6051,487],{"class":133},[65,6053,136],{"class":82},[65,6055,492],{"class":82},[65,6057,495],{"class":123},[65,6059,136],{"class":82},[65,6061,440],{"class":139},[65,6063,502],{"class":82},[65,6065,505],{"class":123},[65,6067,508],{"class":82},[65,6069,511],{"class":139},[65,6071,514],{"class":82},[65,6073,517],{"class":112},[65,6075,6076],{"class":139}," void\n",[65,6078,6079],{"class":67,"line":288},[65,6080,527],{"class":82},[65,6082,6083],{"class":67,"line":294},[65,6084,178],{"class":82},[65,6086,6087],{"class":67,"line":303},[65,6088,100],{"emptyLinePlaceholder":99},[65,6090,6091,6093,6095,6097,6099],{"class":67,"line":309},[65,6092,106],{"class":71},[65,6094,113],{"class":112},[65,6096,4555],{"class":116},[65,6098,1969],{"class":82},[65,6100,151],{"class":82},[65,6102,6103,6105,6107,6109,6111,6113,6115,6117,6119,6121],{"class":67,"line":315},[65,6104,572],{"class":112},[65,6106,4566],{"class":75},[65,6108,578],{"class":82},[65,6110,492],{"class":82},[65,6112,4573],{"class":123},[65,6114,136],{"class":82},[65,6116,4422],{"class":139},[65,6118,514],{"class":82},[65,6120,517],{"class":112},[65,6122,151],{"class":82},[65,6124,6125,6127,6129,6131,6133,6135,6137,6139,6141,6143],{"class":67,"line":321},[65,6126,590],{"class":75},[65,6128,26],{"class":82},[65,6130,595],{"class":116},[65,6132,598],{"class":133},[65,6134,90],{"class":82},[65,6136,603],{"class":86},[65,6138,90],{"class":82},[65,6140,502],{"class":82},[65,6142,505],{"class":75},[65,6144,3571],{"class":133},[65,6146,6147],{"class":67,"line":327},[65,6148,527],{"class":82},[65,6150,6151],{"class":67,"line":355},[65,6152,100],{"emptyLinePlaceholder":99},[65,6154,6155,6157,6159,6161,6163,6165],{"class":67,"line":361},[65,6156,572],{"class":112},[65,6158,4622],{"class":75},[65,6160,578],{"class":82},[65,6162,581],{"class":82},[65,6164,517],{"class":112},[65,6166,151],{"class":82},[65,6168,6169,6171,6173,6175,6177,6179,6181,6183],{"class":67,"line":369},[65,6170,590],{"class":75},[65,6172,26],{"class":82},[65,6174,595],{"class":116},[65,6176,598],{"class":133},[65,6178,90],{"class":82},[65,6180,4645],{"class":86},[65,6182,90],{"class":82},[65,6184,3571],{"class":133},[65,6186,6187],{"class":67,"line":380},[65,6188,527],{"class":82},[65,6190,6191],{"class":67,"line":386},[65,6192,100],{"emptyLinePlaceholder":99},[65,6194,6195,6197,6199,6201,6203,6205],{"class":67,"line":394},[65,6196,157],{"class":71},[65,6198,130],{"class":82},[65,6200,4566],{"class":75},[65,6202,502],{"class":82},[65,6204,4622],{"class":75},[65,6206,6207],{"class":82}," }\n",[65,6209,6210],{"class":67,"line":3566},[65,6211,178],{"class":82},[28,6213,6215],{"id":6214},"_3-create-the-widget-component","3. Create the Widget Component",[56,6217,6219],{"className":3263,"code":6218,"language":3265,"meta":61,"style":61},"\u003C!-- components\u002FTryOnWidget.vue -->\n\u003Ctemplate>\n \u003Cdiv>\n \u003Cdiv\n id=\"widget-container\"\n style=\"width: 100%; max-width: 600px; aspect-ratio: 3\u002F4\"\n \u002F>\n \u003Cbutton @click=\"handleTryOn\">Try On\u003C\u002Fbutton>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\nimport { useFittingWidget, type TryonItem } from '~\u002Fcomposables\u002FuseFittingWidget'\n\nconst props = defineProps\u003C{\n productName: string\n imageUrl: string\n}>()\n\nconst { open } = useFittingWidget()\n\nconst handleTryOn = () => {\n open({\n targetElementId: 'widget-container',\n model: 'balanced',\n tryonItems: [\n {\n productName: props.productName,\n url: props.imageUrl,\n },\n ],\n })\n}\n\u003C\u002Fscript>\n",[36,6220,6221,6225,6233,6241,6247,6259,6273,6278,6304,6312,6320,6324,6344,6370,6374,6386,6394,6402,6408,6412,6429,6433,6447,6456,6470,6484,6492,6496,6510,6524,6528,6534,6540,6544],{"__ignoreMap":61},[65,6222,6223],{"class":67,"line":68},[65,6224,3796],{"class":3272},[65,6226,6227,6229,6231],{"class":67,"line":96},[65,6228,1876],{"class":82},[65,6230,3280],{"class":133},[65,6232,377],{"class":82},[65,6234,6235,6237,6239],{"class":67,"line":103},[65,6236,3287],{"class":82},[65,6238,688],{"class":133},[65,6240,377],{"class":82},[65,6242,6243,6245],{"class":67,"line":154},[65,6244,910],{"class":82},[65,6246,4824],{"class":133},[65,6248,6249,6251,6253,6255,6257],{"class":67,"line":163},[65,6250,3452],{"class":112},[65,6252,201],{"class":82},[65,6254,204],{"class":82},[65,6256,621],{"class":86},[65,6258,210],{"class":82},[65,6260,6261,6264,6266,6268,6271],{"class":67,"line":169},[65,6262,6263],{"class":112}," style",[65,6265,201],{"class":82},[65,6267,204],{"class":82},[65,6269,6270],{"class":86},"width: 100%; max-width: 600px; aspect-ratio: 3\u002F4",[65,6272,210],{"class":82},[65,6274,6275],{"class":67,"line":181},[65,6276,6277],{"class":82}," \u002F>\n",[65,6279,6280,6282,6284,6286,6288,6290,6292,6294,6296,6298,6300,6302],{"class":67,"line":186},[65,6281,910],{"class":82},[65,6283,752],{"class":133},[65,6285,3851],{"class":112},[65,6287,201],{"class":82},[65,6289,204],{"class":82},[65,6291,3858],{"class":86},[65,6293,204],{"class":82},[65,6295,3300],{"class":82},[65,6297,767],{"class":75},[65,6299,770],{"class":82},[65,6301,752],{"class":133},[65,6303,377],{"class":82},[65,6305,6306,6308,6310],{"class":67,"line":195},[65,6307,3348],{"class":82},[65,6309,688],{"class":133},[65,6311,377],{"class":82},[65,6313,6314,6316,6318],{"class":67,"line":213},[65,6315,770],{"class":82},[65,6317,3280],{"class":133},[65,6319,377],{"class":82},[65,6321,6322],{"class":67,"line":228},[65,6323,100],{"emptyLinePlaceholder":99},[65,6325,6326,6328,6330,6332,6334,6336,6338,6340,6342],{"class":67,"line":243},[65,6327,1876],{"class":82},[65,6329,1913],{"class":133},[65,6331,3373],{"class":112},[65,6333,3376],{"class":112},[65,6335,201],{"class":82},[65,6337,204],{"class":82},[65,6339,3383],{"class":86},[65,6341,204],{"class":82},[65,6343,377],{"class":82},[65,6345,6346,6348,6350,6352,6354,6357,6359,6361,6363,6365,6368],{"class":67,"line":249},[65,6347,72],{"class":71},[65,6349,130],{"class":82},[65,6351,4555],{"class":75},[65,6353,502],{"class":82},[65,6355,6356],{"class":71}," type",[65,6358,428],{"class":75},[65,6360,808],{"class":82},[65,6362,811],{"class":71},[65,6364,83],{"class":82},[65,6366,6367],{"class":86},"~\u002Fcomposables\u002FuseFittingWidget",[65,6369,352],{"class":82},[65,6371,6372],{"class":67,"line":254},[65,6373,100],{"emptyLinePlaceholder":99},[65,6375,6376,6378,6380,6382,6384],{"class":67,"line":261},[65,6377,3915],{"class":112},[65,6379,3918],{"class":75},[65,6381,201],{"class":82},[65,6383,3923],{"class":116},[65,6385,3926],{"class":82},[65,6387,6388,6390,6392],{"class":67,"line":274},[65,6389,435],{"class":133},[65,6391,136],{"class":82},[65,6393,3935],{"class":139},[65,6395,6396,6398,6400],{"class":67,"line":288},[65,6397,3940],{"class":133},[65,6399,136],{"class":82},[65,6401,3935],{"class":139},[65,6403,6404,6406],{"class":67,"line":294},[65,6405,764],{"class":82},[65,6407,3951],{"class":75},[65,6409,6410],{"class":67,"line":303},[65,6411,100],{"emptyLinePlaceholder":99},[65,6413,6414,6416,6418,6421,6423,6425,6427],{"class":67,"line":309},[65,6415,3915],{"class":112},[65,6417,130],{"class":82},[65,6419,6420],{"class":75}," open ",[65,6422,349],{"class":82},[65,6424,578],{"class":82},[65,6426,4555],{"class":116},[65,6428,3951],{"class":75},[65,6430,6431],{"class":67,"line":315},[65,6432,100],{"emptyLinePlaceholder":99},[65,6434,6435,6437,6439,6441,6443,6445],{"class":67,"line":321},[65,6436,3915],{"class":112},[65,6438,3962],{"class":75},[65,6440,201],{"class":82},[65,6442,581],{"class":82},[65,6444,517],{"class":112},[65,6446,151],{"class":82},[65,6448,6449,6452,6454],{"class":67,"line":327},[65,6450,6451],{"class":116}," open",[65,6453,598],{"class":133},[65,6455,472],{"class":82},[65,6457,6458,6460,6462,6464,6466,6468],{"class":67,"line":355},[65,6459,3995],{"class":133},[65,6461,136],{"class":82},[65,6463,83],{"class":82},[65,6465,621],{"class":86},[65,6467,90],{"class":82},[65,6469,626],{"class":82},[65,6471,6472,6474,6476,6478,6480,6482],{"class":67,"line":361},[65,6473,4010],{"class":133},[65,6475,136],{"class":82},[65,6477,83],{"class":82},[65,6479,638],{"class":86},[65,6481,90],{"class":82},[65,6483,626],{"class":82},[65,6485,6486,6488,6490],{"class":67,"line":369},[65,6487,4025],{"class":133},[65,6489,136],{"class":82},[65,6491,1414],{"class":133},[65,6493,6494],{"class":67,"line":380},[65,6495,4034],{"class":82},[65,6497,6498,6500,6502,6504,6506,6508],{"class":67,"line":386},[65,6499,4039],{"class":133},[65,6501,136],{"class":82},[65,6503,4044],{"class":75},[65,6505,26],{"class":82},[65,6507,1328],{"class":75},[65,6509,626],{"class":82},[65,6511,6512,6514,6516,6518,6520,6522],{"class":67,"line":394},[65,6513,4055],{"class":133},[65,6515,136],{"class":82},[65,6517,4044],{"class":75},[65,6519,26],{"class":82},[65,6521,4064],{"class":75},[65,6523,626],{"class":82},[65,6525,6526],{"class":67,"line":3566},[65,6527,4071],{"class":82},[65,6529,6530,6532],{"class":67,"line":3574},[65,6531,4076],{"class":133},[65,6533,626],{"class":82},[65,6535,6536,6538],{"class":67,"line":5486},[65,6537,2062],{"class":82},[65,6539,3571],{"class":133},[65,6541,6542],{"class":67,"line":5495},[65,6543,178],{"class":82},[65,6545,6546,6548,6550],{"class":67,"line":5500},[65,6547,770],{"class":82},[65,6549,1913],{"class":133},[65,6551,377],{"class":82},[1089,6553,6554],{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}",{"title":61,"searchDepth":96,"depth":96,"links":6556},[6557,6558,6559],{"id":4152,"depth":96,"text":4153},{"id":5912,"depth":96,"text":5913},{"id":6214,"depth":96,"text":6215},"Integrate with a Vue 3 application","i-lucide-venetian-mask",{},"\u002Fen\u002Fintegrations\u002Fvue",{"title":5714,"description":6560},"en\u002Fintegrations\u002Fvue","GShiJEM5AAOgyg7U0MXXp-Lqn_Y-1BooZA_uvPnVwT0",{"id":6568,"title":6569,"body":6570,"description":6979,"extension":1102,"icon":2276,"meta":6980,"navigation":99,"path":2358,"seo":6981,"stem":6982,"__hash__":6983},"content\u002Fgetting-started\u002Fquick-start.md","Быстрый старт",{"type":7,"value":6571,"toc":6970},[6572,6575,6578,6582,6589,6593,6601,6643,6647,6787,6791,6797,6823,6827,6833,6943,6947,6950,6954,6967],[10,6573,6569],{"id":6574},"быстрый-старт",[15,6576,6577],{},"Следуйте этим шагам, чтобы добавить виртуальную примерку на ваш сайт.",[28,6579,6581],{"id":6580},"_1-получите-api-ключ","1. Получите API-ключ",[15,6583,6584,6585,6588],{},"Зарегистрируйтесь на ",[1843,6586,1848],{"href":1845,"rel":6587},[1847],", чтобы получить бесплатный API-ключ.",[28,6590,6592],{"id":6591},"_2-загрузите-скрипт-виджета","2. Загрузите скрипт виджета",[15,6594,6595,6596,6598,6599,136],{},"Добавьте следующий тег ",[36,6597,1859],{}," на страницу, желательно перед закрывающим тегом ",[36,6600,1863],{},[56,6602,6603],{"className":1867,"code":1868,"language":1869,"meta":61,"style":61},[36,6604,6605,6611,6623,6635],{"__ignoreMap":61},[65,6606,6607,6609],{"class":67,"line":68},[65,6608,1876],{"class":82},[65,6610,1879],{"class":133},[65,6612,6613,6615,6617,6619,6621],{"class":67,"line":96},[65,6614,1884],{"class":112},[65,6616,201],{"class":82},[65,6618,204],{"class":82},[65,6620,207],{"class":86},[65,6622,210],{"class":82},[65,6624,6625,6627,6629,6631,6633],{"class":67,"line":103},[65,6626,1897],{"class":112},[65,6628,201],{"class":82},[65,6630,204],{"class":82},[65,6632,238],{"class":86},[65,6634,210],{"class":82},[65,6636,6637,6639,6641],{"class":67,"line":154},[65,6638,1910],{"class":82},[65,6640,1913],{"class":133},[65,6642,377],{"class":82},[28,6644,6646],{"id":6645},"_3-инициализируйте-виджет","3. Инициализируйте виджет",[56,6648,6649],{"className":1867,"code":1922,"language":1869,"meta":61,"style":61},[36,6650,6651,6669,6693,6735,6739,6759,6771,6779],{"__ignoreMap":61},[65,6652,6653,6655,6657,6659,6661,6663,6665,6667],{"class":67,"line":68},[65,6654,1876],{"class":82},[65,6656,1913],{"class":133},[65,6658,691],{"class":112},[65,6660,201],{"class":82},[65,6662,204],{"class":82},[65,6664,283],{"class":86},[65,6666,204],{"class":82},[65,6668,377],{"class":82},[65,6670,6671,6673,6675,6677,6679,6681,6683,6685,6687,6689,6691],{"class":67,"line":96},[65,6672,1947],{"class":75},[65,6674,26],{"class":82},[65,6676,1952],{"class":75},[65,6678,201],{"class":82},[65,6680,1957],{"class":75},[65,6682,26],{"class":82},[65,6684,1952],{"class":75},[65,6686,1964],{"class":82},[65,6688,113],{"class":112},[65,6690,1969],{"class":82},[65,6692,151],{"class":82},[65,6694,6695,6697,6699,6701,6703,6705,6707,6709,6711,6713,6715,6717,6719,6721,6723,6725,6727,6729,6731,6733],{"class":67,"line":103},[65,6696,1976],{"class":133},[65,6698,1181],{"class":75},[65,6700,26],{"class":82},[65,6702,595],{"class":75},[65,6704,26],{"class":82},[65,6706,1987],{"class":75},[65,6708,578],{"class":82},[65,6710,1957],{"class":75},[65,6712,26],{"class":82},[65,6714,595],{"class":75},[65,6716,26],{"class":82},[65,6718,1987],{"class":75},[65,6720,2002],{"class":82},[65,6722,2005],{"class":133},[65,6724,26],{"class":82},[65,6726,2010],{"class":116},[65,6728,598],{"class":133},[65,6730,2015],{"class":75},[65,6732,514],{"class":133},[65,6734,93],{"class":82},[65,6736,6737],{"class":67,"line":154},[65,6738,667],{"class":82},[65,6740,6741,6743,6745,6747,6749,6751,6753,6755,6757],{"class":67,"line":163},[65,6742,1947],{"class":75},[65,6744,26],{"class":82},[65,6746,595],{"class":116},[65,6748,598],{"class":75},[65,6750,90],{"class":82},[65,6752,1192],{"class":86},[65,6754,90],{"class":82},[65,6756,502],{"class":82},[65,6758,151],{"class":82},[65,6760,6761,6763,6765,6767,6769],{"class":67,"line":169},[65,6762,2048],{"class":133},[65,6764,136],{"class":82},[65,6766,83],{"class":82},[65,6768,2055],{"class":86},[65,6770,352],{"class":82},[65,6772,6773,6775,6777],{"class":67,"line":181},[65,6774,2062],{"class":82},[65,6776,514],{"class":75},[65,6778,93],{"class":82},[65,6780,6781,6783,6785],{"class":67,"line":186},[65,6782,770],{"class":82},[65,6784,1913],{"class":133},[65,6786,377],{"class":82},[28,6788,6790],{"id":6789},"_4-добавьте-контейнер","4. Добавьте контейнер",[15,6792,6793,6794,6796],{},"Разместите ",[36,6795,2084],{}," там, где должен отображаться виджет:",[56,6798,6799],{"className":1867,"code":2088,"language":1869,"meta":61,"style":61},[36,6800,6801],{"__ignoreMap":61},[65,6802,6803,6805,6807,6809,6811,6813,6815,6817,6819,6821],{"class":67,"line":68},[65,6804,1876],{"class":82},[65,6806,688],{"class":133},[65,6808,691],{"class":112},[65,6810,201],{"class":82},[65,6812,204],{"class":82},[65,6814,621],{"class":86},[65,6816,204],{"class":82},[65,6818,1910],{"class":82},[65,6820,688],{"class":133},[65,6822,377],{"class":82},[28,6824,6826],{"id":6825},"_5-запустите-виджет","5. Запустите виджет",[15,6828,6829,6830,6832],{},"Вызовите метод ",[36,6831,603],{}," при нажатии пользователем кнопки:",[56,6834,6835],{"className":1172,"code":2125,"language":1174,"meta":61,"style":61},[36,6836,6837,6857,6871,6885,6893,6897,6911,6925,6929,6935],{"__ignoreMap":61},[65,6838,6839,6841,6843,6845,6847,6849,6851,6853,6855],{"class":67,"line":68},[65,6840,1181],{"class":75},[65,6842,26],{"class":82},[65,6844,595],{"class":116},[65,6846,598],{"class":75},[65,6848,90],{"class":82},[65,6850,603],{"class":86},[65,6852,90],{"class":82},[65,6854,502],{"class":82},[65,6856,151],{"class":82},[65,6858,6859,6861,6863,6865,6867,6869],{"class":67,"line":96},[65,6860,1379],{"class":133},[65,6862,136],{"class":82},[65,6864,83],{"class":82},[65,6866,621],{"class":86},[65,6868,90],{"class":82},[65,6870,626],{"class":82},[65,6872,6873,6875,6877,6879,6881,6883],{"class":67,"line":103},[65,6874,1394],{"class":133},[65,6876,136],{"class":82},[65,6878,83],{"class":82},[65,6880,638],{"class":86},[65,6882,90],{"class":82},[65,6884,626],{"class":82},[65,6886,6887,6889,6891],{"class":67,"line":154},[65,6888,1409],{"class":133},[65,6890,136],{"class":82},[65,6892,1414],{"class":75},[65,6894,6895],{"class":67,"line":163},[65,6896,1419],{"class":82},[65,6898,6899,6901,6903,6905,6907,6909],{"class":67,"line":169},[65,6900,1424],{"class":133},[65,6902,136],{"class":82},[65,6904,83],{"class":82},[65,6906,2198],{"class":86},[65,6908,90],{"class":82},[65,6910,626],{"class":82},[65,6912,6913,6915,6917,6919,6921,6923],{"class":67,"line":181},[65,6914,1440],{"class":133},[65,6916,136],{"class":82},[65,6918,83],{"class":82},[65,6920,2213],{"class":86},[65,6922,90],{"class":82},[65,6924,626],{"class":82},[65,6926,6927],{"class":67,"line":186},[65,6928,1456],{"class":82},[65,6930,6931,6933],{"class":67,"line":195},[65,6932,1461],{"class":75},[65,6934,626],{"class":82},[65,6936,6937,6939,6941],{"class":67,"line":213},[65,6938,349],{"class":82},[65,6940,514],{"class":75},[65,6942,93],{"class":82},[28,6944,6946],{"id":6945},"результат","Результат",[15,6948,6949],{},"Теперь ваши покупатели могут загрузить фотографию и мгновенно увидеть, как на них сидит одежда.",[28,6951,6953],{"id":6952},"дальнейшие-шаги","Дальнейшие шаги",[2248,6955,6956,6962],{},[2251,6957,6958,6959,26],{},"Ознакомьтесь с руководствами для конкретных фреймворков в разделе ",[1843,6960,6961],{"href":2256},"Интеграции",[2251,6963,6964,6965,26],{},"Изучите полный ",[1843,6966,1112],{"href":1484},[1089,6968,6969],{},"html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}",{"title":61,"searchDepth":96,"depth":96,"links":6971},[6972,6973,6974,6975,6976,6977,6978],{"id":6580,"depth":96,"text":6581},{"id":6591,"depth":96,"text":6592},{"id":6645,"depth":96,"text":6646},{"id":6789,"depth":96,"text":6790},{"id":6825,"depth":96,"text":6826},{"id":6945,"depth":96,"text":6946},{"id":6952,"depth":96,"text":6953},"Запустите Fitting Widget за считанные минуты",{},{"title":6569,"description":6979},"getting-started\u002Fquick-start","4USnYxFPZA1hrOvVApcSHMt9oQc0aZ6Ct8ohgcj8WJ8",{"id":6985,"title":6986,"body":6987,"description":7065,"extension":1102,"icon":2366,"meta":7066,"navigation":99,"path":7067,"seo":7068,"stem":7069,"__hash__":7070},"content\u002Findex.md","Введение",{"type":7,"value":6988,"toc":7060},[6989,6993,6998,7002,7031,7035,7052,7054],[10,6990,6992],{"id":6991},"fitting-widget-виртуальная-примерка","Fitting Widget — Виртуальная примерка",[15,6994,6995,6997],{},[19,6996,2296],{}," — это готовое решение для виртуальной примерки одежды в интернет-магазинах. Он позволяет вашим покупателям загрузить фотографию и мгновенно увидеть, как на них выглядит любой предмет одежды — прямо на странице товара.",[28,6999,7001],{"id":7000},"ключевые-возможности","Ключевые возможности",[2248,7003,7004,7013,7019,7025],{},[2251,7005,7006,7009,7010,7012],{},[19,7007,7008],{},"Быстрая интеграция"," — Один тег ",[36,7011,1859],{}," и несколько строк кода.",[2251,7014,7015,7018],{},[19,7016,7017],{},"Не зависит от фреймворков"," — Работает с Vanilla JS, React, Vue, Next.js, Nuxt и другими.",[2251,7020,7021,7024],{},[19,7022,7023],{},"Настраиваемый"," — Стилизуйте виджет под ваш бренд.",[2251,7026,7027,7030],{},[19,7028,7029],{},"Лёгкий"," — Оптимизированная загрузка, которая не замедляет магазин.",[28,7032,7034],{"id":7033},"как-это-работает","Как это работает",[2333,7036,7037,7040,7043,7049],{},[2251,7038,7039],{},"Загрузите скрипт виджета на страницу.",[2251,7041,7042],{},"Инициализируйте его с вашим API-ключом.",[2251,7044,7045,7046,7048],{},"Вызовите ",[36,7047,2346],{}," с URL-адресами изображений товаров.",[2251,7050,7051],{},"Виджет отображается внутри выбранного вами контейнера.",[28,7053,6569],{"id":6574},[15,7055,7056,7057,7059],{},"Перейдите к руководству ",[1843,7058,6569],{"href":2358},", чтобы начать работу менее чем за 5 минут.",{"title":61,"searchDepth":96,"depth":96,"links":7061},[7062,7063,7064],{"id":7000,"depth":96,"text":7001},{"id":7033,"depth":96,"text":7034},{"id":6574,"depth":96,"text":6569},"Что такое Fitting Widget и зачем его использовать?",{},"\u002F",{"title":6986,"description":7065},"index","kGT91Bb-Wx88tMoHoRu65KMhDKtcehaBgnLzJYfeCWE",{"id":7072,"title":5,"body":7073,"description":7948,"extension":1102,"icon":1103,"meta":7949,"navigation":99,"path":7950,"seo":7951,"stem":7952,"__hash__":7953},"content\u002Fintegrations\u002Fnextjs.md",{"type":7,"value":7074,"toc":7939},[7075,7079,7087,7091,7099,7108,7344,7348,7676,7680,7916,7920,7925,7937],[10,7076,7078],{"id":7077},"интеграция-с-nextjs","Интеграция с Next.js",[15,7080,7081,7082,7084,7085,26],{},"Fitting Widget работает как с ",[19,7083,21],{},", так и с ",[19,7086,25],{},[28,7088,7090],{"id":7089},"app-router-рекомендуется","App Router (рекомендуется)",[15,7092,7093,7094,7096,7097,26],{},"Используйте компонент Next.js ",[36,7095,38],{}," с ",[36,7098,42],{},[44,7100,7102,7103,7105,7106],{"id":7101},"шаг-1-загрузка-скриптов-в-layouttsx-или-pagetsx","Шаг 1 — Загрузка скриптов в ",[36,7104,50],{}," или ",[36,7107,54],{},[56,7109,7110],{"className":58,"code":59,"language":60,"meta":61,"style":61},[36,7111,7112,7128,7132,7164,7170,7174,7182,7186,7192,7204,7216,7228,7232,7236,7242,7254,7266,7270,7276,7280,7284,7288,7292,7312,7316,7322,7330,7334,7340],{"__ignoreMap":61},[65,7113,7114,7116,7118,7120,7122,7124,7126],{"class":67,"line":68},[65,7115,72],{"class":71},[65,7117,76],{"class":75},[65,7119,79],{"class":71},[65,7121,83],{"class":82},[65,7123,87],{"class":86},[65,7125,90],{"class":82},[65,7127,93],{"class":82},[65,7129,7130],{"class":67,"line":96},[65,7131,100],{"emptyLinePlaceholder":99},[65,7133,7134,7136,7138,7140,7142,7144,7146,7148,7150,7152,7154,7156,7158,7160,7162],{"class":67,"line":103},[65,7135,106],{"class":71},[65,7137,109],{"class":71},[65,7139,113],{"class":112},[65,7141,117],{"class":116},[65,7143,120],{"class":82},[65,7145,124],{"class":123},[65,7147,127],{"class":82},[65,7149,130],{"class":82},[65,7151,124],{"class":133},[65,7153,136],{"class":82},[65,7155,140],{"class":139},[65,7157,26],{"class":82},[65,7159,145],{"class":139},[65,7161,148],{"class":82},[65,7163,151],{"class":82},[65,7165,7166,7168],{"class":67,"line":154},[65,7167,157],{"class":71},[65,7169,160],{"class":133},[65,7171,7172],{"class":67,"line":163},[65,7173,166],{"class":82},[65,7175,7176,7178,7180],{"class":67,"line":169},[65,7177,172],{"class":82},[65,7179,175],{"class":75},[65,7181,178],{"class":82},[65,7183,7184],{"class":67,"line":181},[65,7185,100],{"emptyLinePlaceholder":99},[65,7187,7188,7190],{"class":67,"line":186},[65,7189,189],{"class":82},[65,7191,192],{"class":139},[65,7193,7194,7196,7198,7200,7202],{"class":67,"line":195},[65,7195,198],{"class":112},[65,7197,201],{"class":82},[65,7199,204],{"class":82},[65,7201,207],{"class":86},[65,7203,210],{"class":82},[65,7205,7206,7208,7210,7212,7214],{"class":67,"line":213},[65,7207,216],{"class":112},[65,7209,201],{"class":82},[65,7211,204],{"class":82},[65,7213,223],{"class":86},[65,7215,210],{"class":82},[65,7217,7218,7220,7222,7224,7226],{"class":67,"line":228},[65,7219,231],{"class":112},[65,7221,201],{"class":82},[65,7223,204],{"class":82},[65,7225,238],{"class":86},[65,7227,210],{"class":82},[65,7229,7230],{"class":67,"line":243},[65,7231,246],{"class":82},[65,7233,7234],{"class":67,"line":249},[65,7235,100],{"emptyLinePlaceholder":99},[65,7237,7238,7240],{"class":67,"line":254},[65,7239,189],{"class":82},[65,7241,192],{"class":139},[65,7243,7244,7246,7248,7250,7252],{"class":67,"line":261},[65,7245,216],{"class":112},[65,7247,201],{"class":82},[65,7249,204],{"class":82},[65,7251,223],{"class":86},[65,7253,210],{"class":82},[65,7255,7256,7258,7260,7262,7264],{"class":67,"line":274},[65,7257,231],{"class":112},[65,7259,201],{"class":82},[65,7261,204],{"class":82},[65,7263,283],{"class":86},[65,7265,210],{"class":82},[65,7267,7268],{"class":67,"line":288},[65,7269,291],{"class":82},[65,7271,7272,7274],{"class":67,"line":294},[65,7273,297],{"class":82},[65,7275,300],{"class":82},[65,7277,7278],{"class":67,"line":303},[65,7279,306],{"class":86},[65,7281,7282],{"class":67,"line":309},[65,7283,312],{"class":86},[65,7285,7286],{"class":67,"line":315},[65,7287,318],{"class":86},[65,7289,7290],{"class":67,"line":321},[65,7291,324],{"class":86},[65,7293,7294,7296,7298,7300,7302,7304,7306,7308,7310],{"class":67,"line":327},[65,7295,330],{"class":86},[65,7297,333],{"class":82},[65,7299,336],{"class":75},[65,7301,26],{"class":82},[65,7303,341],{"class":75},[65,7305,26],{"class":82},[65,7307,346],{"class":75},[65,7309,349],{"class":82},[65,7311,352],{"class":86},[65,7313,7314],{"class":67,"line":355},[65,7315,358],{"class":86},[65,7317,7318,7320],{"class":67,"line":361},[65,7319,364],{"class":82},[65,7321,178],{"class":82},[65,7323,7324,7326,7328],{"class":67,"line":369},[65,7325,372],{"class":82},[65,7327,38],{"class":139},[65,7329,377],{"class":82},[65,7331,7332],{"class":67,"line":380},[65,7333,383],{"class":82},[65,7335,7336,7338],{"class":67,"line":386},[65,7337,389],{"class":133},[65,7339,93],{"class":82},[65,7341,7342],{"class":67,"line":394},[65,7343,178],{"class":82},[44,7345,7347],{"id":7346},"шаг-2-создание-кнопки-виджета","Шаг 2 — Создание кнопки виджета",[56,7349,7351],{"className":58,"code":7350,"language":60,"meta":61,"style":61},"'use client';\n\ninterface TryonItem {\n productName: string;\n url: string;\n}\n\ndeclare global {\n interface Window {\n fitting: (command: string, options?: unknown) => void;\n }\n}\n\nexport function TryOnButton({ items }: { items: TryonItem[] }) {\n const handleClick = () => {\n window.fitting('create', {\n targetElementId: 'widget-container',\n model: 'balanced',\n tryonItems: items,\n });\n };\n\n return (\n \u003C>\n \u003Cdiv id=\"widget-container\" style={{ width: '100%', maxWidth: 600, aspectRatio: '3\u002F4' }} \u002F>\n \u003Cbutton onClick={handleClick}>Примерка\u003C\u002Fbutton>\n \u003C\u002F>\n );\n}\n",[36,7352,7353,7363,7367,7375,7385,7395,7399,7403,7411,7419,7449,7453,7457,7461,7489,7503,7523,7537,7551,7561,7569,7573,7577,7583,7587,7639,7662,7666,7672],{"__ignoreMap":61},[65,7354,7355,7357,7359,7361],{"class":67,"line":68},[65,7356,90],{"class":82},[65,7358,412],{"class":86},[65,7360,90],{"class":82},[65,7362,93],{"class":82},[65,7364,7365],{"class":67,"line":96},[65,7366,100],{"emptyLinePlaceholder":99},[65,7368,7369,7371,7373],{"class":67,"line":103},[65,7370,425],{"class":112},[65,7372,428],{"class":139},[65,7374,151],{"class":82},[65,7376,7377,7379,7381,7383],{"class":67,"line":154},[65,7378,435],{"class":133},[65,7380,136],{"class":82},[65,7382,440],{"class":139},[65,7384,93],{"class":82},[65,7386,7387,7389,7391,7393],{"class":67,"line":163},[65,7388,447],{"class":133},[65,7390,136],{"class":82},[65,7392,440],{"class":139},[65,7394,93],{"class":82},[65,7396,7397],{"class":67,"line":169},[65,7398,178],{"class":82},[65,7400,7401],{"class":67,"line":181},[65,7402,100],{"emptyLinePlaceholder":99},[65,7404,7405,7407,7409],{"class":67,"line":186},[65,7406,466],{"class":112},[65,7408,469],{"class":75},[65,7410,472],{"class":82},[65,7412,7413,7415,7417],{"class":67,"line":195},[65,7414,477],{"class":112},[65,7416,480],{"class":139},[65,7418,151],{"class":82},[65,7420,7421,7423,7425,7427,7429,7431,7433,7435,7437,7439,7441,7443,7445,7447],{"class":67,"line":213},[65,7422,487],{"class":133},[65,7424,136],{"class":82},[65,7426,492],{"class":82},[65,7428,495],{"class":123},[65,7430,136],{"class":82},[65,7432,440],{"class":139},[65,7434,502],{"class":82},[65,7436,505],{"class":123},[65,7438,508],{"class":82},[65,7440,511],{"class":139},[65,7442,514],{"class":82},[65,7444,517],{"class":112},[65,7446,520],{"class":139},[65,7448,93],{"class":82},[65,7450,7451],{"class":67,"line":228},[65,7452,527],{"class":82},[65,7454,7455],{"class":67,"line":243},[65,7456,178],{"class":82},[65,7458,7459],{"class":67,"line":249},[65,7460,100],{"emptyLinePlaceholder":99},[65,7462,7463,7465,7467,7469,7471,7473,7475,7477,7479,7481,7483,7485,7487],{"class":67,"line":254},[65,7464,106],{"class":71},[65,7466,113],{"class":112},[65,7468,544],{"class":116},[65,7470,120],{"class":82},[65,7472,549],{"class":123},[65,7474,127],{"class":82},[65,7476,130],{"class":82},[65,7478,549],{"class":133},[65,7480,136],{"class":82},[65,7482,428],{"class":139},[65,7484,562],{"class":75},[65,7486,565],{"class":82},[65,7488,151],{"class":82},[65,7490,7491,7493,7495,7497,7499,7501],{"class":67,"line":261},[65,7492,572],{"class":112},[65,7494,575],{"class":75},[65,7496,578],{"class":82},[65,7498,581],{"class":82},[65,7500,517],{"class":112},[65,7502,151],{"class":82},[65,7504,7505,7507,7509,7511,7513,7515,7517,7519,7521],{"class":67,"line":274},[65,7506,590],{"class":75},[65,7508,26],{"class":82},[65,7510,595],{"class":116},[65,7512,598],{"class":133},[65,7514,90],{"class":82},[65,7516,603],{"class":86},[65,7518,90],{"class":82},[65,7520,502],{"class":82},[65,7522,151],{"class":82},[65,7524,7525,7527,7529,7531,7533,7535],{"class":67,"line":288},[65,7526,614],{"class":133},[65,7528,136],{"class":82},[65,7530,83],{"class":82},[65,7532,621],{"class":86},[65,7534,90],{"class":82},[65,7536,626],{"class":82},[65,7538,7539,7541,7543,7545,7547,7549],{"class":67,"line":294},[65,7540,631],{"class":133},[65,7542,136],{"class":82},[65,7544,83],{"class":82},[65,7546,638],{"class":86},[65,7548,90],{"class":82},[65,7550,626],{"class":82},[65,7552,7553,7555,7557,7559],{"class":67,"line":303},[65,7554,647],{"class":133},[65,7556,136],{"class":82},[65,7558,549],{"class":75},[65,7560,626],{"class":82},[65,7562,7563,7565,7567],{"class":67,"line":309},[65,7564,658],{"class":82},[65,7566,514],{"class":133},[65,7568,93],{"class":82},[65,7570,7571],{"class":67,"line":315},[65,7572,667],{"class":82},[65,7574,7575],{"class":67,"line":321},[65,7576,100],{"emptyLinePlaceholder":99},[65,7578,7579,7581],{"class":67,"line":327},[65,7580,157],{"class":71},[65,7582,160],{"class":133},[65,7584,7585],{"class":67,"line":355},[65,7586,166],{"class":82},[65,7588,7589,7591,7593,7595,7597,7599,7601,7603,7605,7607,7609,7611,7613,7615,7617,7619,7621,7623,7625,7627,7629,7631,7633,7635,7637],{"class":67,"line":361},[65,7590,189],{"class":82},[65,7592,688],{"class":133},[65,7594,691],{"class":112},[65,7596,201],{"class":82},[65,7598,204],{"class":82},[65,7600,621],{"class":86},[65,7602,204],{"class":82},[65,7604,702],{"class":112},[65,7606,705],{"class":82},[65,7608,708],{"class":133},[65,7610,136],{"class":82},[65,7612,83],{"class":82},[65,7614,715],{"class":86},[65,7616,90],{"class":82},[65,7618,502],{"class":82},[65,7620,722],{"class":133},[65,7622,136],{"class":82},[65,7624,728],{"class":727},[65,7626,502],{"class":82},[65,7628,733],{"class":133},[65,7630,136],{"class":82},[65,7632,83],{"class":82},[65,7634,740],{"class":86},[65,7636,90],{"class":82},[65,7638,745],{"class":82},[65,7640,7641,7643,7645,7647,7649,7651,7653,7656,7658,7660],{"class":67,"line":369},[65,7642,189],{"class":82},[65,7644,752],{"class":133},[65,7646,755],{"class":112},[65,7648,758],{"class":82},[65,7650,761],{"class":75},[65,7652,764],{"class":82},[65,7654,7655],{"class":75},"Примерка",[65,7657,770],{"class":82},[65,7659,752],{"class":133},[65,7661,377],{"class":82},[65,7663,7664],{"class":67,"line":380},[65,7665,383],{"class":82},[65,7667,7668,7670],{"class":67,"line":386},[65,7669,389],{"class":133},[65,7671,93],{"class":82},[65,7673,7674],{"class":67,"line":394},[65,7675,178],{"class":82},[44,7677,7679],{"id":7678},"шаг-3-использование-на-странице-товара","Шаг 3 — Использование на странице товара",[56,7681,7682],{"className":58,"code":795,"language":60,"meta":61,"style":61},[36,7683,7684,7704,7708,7746,7770,7774,7780,7788,7808,7838,7844,7852,7856,7870,7884,7888,7894,7898,7906,7912],{"__ignoreMap":61},[65,7685,7686,7688,7690,7692,7694,7696,7698,7700,7702],{"class":67,"line":68},[65,7687,72],{"class":71},[65,7689,130],{"class":82},[65,7691,544],{"class":75},[65,7693,808],{"class":82},[65,7695,811],{"class":71},[65,7697,83],{"class":82},[65,7699,816],{"class":86},[65,7701,90],{"class":82},[65,7703,93],{"class":82},[65,7705,7706],{"class":67,"line":96},[65,7707,100],{"emptyLinePlaceholder":99},[65,7709,7710,7712,7714,7716,7718,7720,7722,7724,7726,7728,7730,7732,7734,7736,7738,7740,7742,7744],{"class":67,"line":103},[65,7711,106],{"class":71},[65,7713,109],{"class":71},[65,7715,833],{"class":112},[65,7717,113],{"class":112},[65,7719,838],{"class":116},[65,7721,120],{"class":82},[65,7723,843],{"class":123},[65,7725,127],{"class":82},[65,7727,130],{"class":82},[65,7729,843],{"class":133},[65,7731,136],{"class":82},[65,7733,130],{"class":82},[65,7735,856],{"class":133},[65,7737,136],{"class":82},[65,7739,440],{"class":139},[65,7741,808],{"class":82},[65,7743,148],{"class":82},[65,7745,151],{"class":82},[65,7747,7748,7750,7752,7754,7756,7758,7760,7762,7764,7766,7768],{"class":67,"line":154},[65,7749,572],{"class":112},[65,7751,873],{"class":75},[65,7753,578],{"class":82},[65,7755,878],{"class":71},[65,7757,881],{"class":116},[65,7759,598],{"class":133},[65,7761,886],{"class":75},[65,7763,26],{"class":82},[65,7765,891],{"class":75},[65,7767,514],{"class":133},[65,7769,93],{"class":82},[65,7771,7772],{"class":67,"line":163},[65,7773,100],{"emptyLinePlaceholder":99},[65,7775,7776,7778],{"class":67,"line":169},[65,7777,157],{"class":71},[65,7779,160],{"class":133},[65,7781,7782,7784,7786],{"class":67,"line":181},[65,7783,910],{"class":82},[65,7785,688],{"class":133},[65,7787,377],{"class":82},[65,7789,7790,7792,7794,7796,7798,7800,7802,7804,7806],{"class":67,"line":186},[65,7791,189],{"class":82},[65,7793,10],{"class":133},[65,7795,923],{"class":82},[65,7797,926],{"class":75},[65,7799,26],{"class":82},[65,7801,931],{"class":75},[65,7803,934],{"class":82},[65,7805,10],{"class":133},[65,7807,377],{"class":82},[65,7809,7810,7812,7814,7816,7818,7820,7822,7824,7826,7828,7830,7832,7834,7836],{"class":67,"line":195},[65,7811,189],{"class":82},[65,7813,945],{"class":133},[65,7815,948],{"class":112},[65,7817,758],{"class":82},[65,7819,926],{"class":75},[65,7821,26],{"class":82},[65,7823,957],{"class":75},[65,7825,960],{"class":82},[65,7827,963],{"class":112},[65,7829,758],{"class":82},[65,7831,926],{"class":75},[65,7833,26],{"class":82},[65,7835,931],{"class":75},[65,7837,974],{"class":82},[65,7839,7840,7842],{"class":67,"line":213},[65,7841,189],{"class":82},[65,7843,981],{"class":139},[65,7845,7846,7848,7850],{"class":67,"line":228},[65,7847,986],{"class":112},[65,7849,758],{"class":82},[65,7851,991],{"class":75},[65,7853,7854],{"class":67,"line":243},[65,7855,996],{"class":82},[65,7857,7858,7860,7862,7864,7866,7868],{"class":67,"line":249},[65,7859,1001],{"class":133},[65,7861,136],{"class":82},[65,7863,873],{"class":75},[65,7865,26],{"class":82},[65,7867,931],{"class":75},[65,7869,626],{"class":82},[65,7871,7872,7874,7876,7878,7880,7882],{"class":67,"line":254},[65,7873,1016],{"class":133},[65,7875,136],{"class":82},[65,7877,873],{"class":75},[65,7879,26],{"class":82},[65,7881,957],{"class":75},[65,7883,626],{"class":82},[65,7885,7886],{"class":67,"line":261},[65,7887,1031],{"class":82},[65,7889,7890,7892],{"class":67,"line":274},[65,7891,1036],{"class":75},[65,7893,178],{"class":82},[65,7895,7896],{"class":67,"line":288},[65,7897,246],{"class":82},[65,7899,7900,7902,7904],{"class":67,"line":294},[65,7901,1047],{"class":82},[65,7903,688],{"class":133},[65,7905,377],{"class":82},[65,7907,7908,7910],{"class":67,"line":303},[65,7909,389],{"class":133},[65,7911,93],{"class":82},[65,7913,7914],{"class":67,"line":309},[65,7915,178],{"class":82},[28,7917,7919],{"id":7918},"переменная-окружения","Переменная окружения",[15,7921,7922,7923,136],{},"Добавьте ваш API-ключ в ",[36,7924,1071],{},[56,7926,7927],{"className":1074,"code":1075,"language":1076,"meta":61,"style":61},[36,7928,7929],{"__ignoreMap":61},[65,7930,7931,7933,7935],{"class":67,"line":68},[65,7932,346],{"class":75},[65,7934,201],{"class":82},[65,7936,1087],{"class":86},[1089,7938,1091],{},{"title":61,"searchDepth":96,"depth":96,"links":7940},[7941,7947],{"id":7089,"depth":96,"text":7090,"children":7942},[7943,7945,7946],{"id":7101,"depth":103,"text":7944},"Шаг 1 — Загрузка скриптов в layout.tsx или page.tsx",{"id":7346,"depth":103,"text":7347},{"id":7678,"depth":103,"text":7679},{"id":7918,"depth":96,"text":7919},"Интеграция с Next.js (Pages Router и App Router)",{},"\u002Fintegrations\u002Fnextjs",{"title":5,"description":7948},"integrations\u002Fnextjs","KS6JTPT1XrolEU5h4YdImeGYebYne3YB0eM4G4u-UlY",{"id":7955,"title":3231,"body":7956,"description":8769,"extension":1102,"icon":4132,"meta":8770,"navigation":99,"path":8771,"seo":8772,"stem":8773,"__hash__":8774},"content\u002Fintegrations\u002Fnuxt.md",{"type":7,"value":7957,"toc":8759},[7958,7962,7965,7969,7977,7983,8265,8271,8447,8451,8738,8740,8745,8757],[10,7959,7961],{"id":7960},"интеграция-с-nuxt","Интеграция с Nuxt",[15,7963,7964],{},"Fitting Widget легко интегрируется с Nuxt 3 и Nuxt 4.",[28,7966,7968],{"id":7967},"_1-загрузка-скрипта","1. Загрузка скрипта",[15,7970,7971,7972,7974,7975,26],{},"Используйте composable ",[36,7973,3250],{}," или добавьте скрипты в ",[36,7976,3254],{},[44,7978,7980,7981],{"id":7979},"вариант-а-на-страницу-через-usehead","Вариант А — На страницу через ",[36,7982,3250],{},[56,7984,7985],{"className":3263,"code":3264,"language":3265,"meta":61,"style":61},[36,7986,7987,7991,7999,8007,8023,8051,8059,8067,8071,8091,8109,8113,8121,8129,8133,8147,8161,8165,8169,8183,8191,8195,8199,8203,8207,8231,8235,8241,8245,8251,8257],{"__ignoreMap":61},[65,7988,7989],{"class":67,"line":68},[65,7990,3273],{"class":3272},[65,7992,7993,7995,7997],{"class":67,"line":96},[65,7994,1876],{"class":82},[65,7996,3280],{"class":133},[65,7998,377],{"class":82},[65,8000,8001,8003,8005],{"class":67,"line":103},[65,8002,3287],{"class":82},[65,8004,688],{"class":133},[65,8006,377],{"class":82},[65,8008,8009,8011,8013,8015,8017,8019,8021],{"class":67,"line":154},[65,8010,910],{"class":82},[65,8012,10],{"class":133},[65,8014,3300],{"class":82},[65,8016,3303],{"class":75},[65,8018,770],{"class":82},[65,8020,10],{"class":133},[65,8022,377],{"class":82},[65,8024,8025,8027,8029,8031,8033,8035,8037,8039,8041,8043,8045,8047,8049],{"class":67,"line":163},[65,8026,910],{"class":82},[65,8028,3316],{"class":133},[65,8030,3319],{"class":112},[65,8032,201],{"class":82},[65,8034,204],{"class":82},[65,8036,3326],{"class":86},[65,8038,204],{"class":82},[65,8040,3331],{"class":112},[65,8042,201],{"class":82},[65,8044,204],{"class":82},[65,8046,3338],{"class":86},[65,8048,204],{"class":82},[65,8050,3343],{"class":82},[65,8052,8053,8055,8057],{"class":67,"line":169},[65,8054,3348],{"class":82},[65,8056,688],{"class":133},[65,8058,377],{"class":82},[65,8060,8061,8063,8065],{"class":67,"line":181},[65,8062,770],{"class":82},[65,8064,3280],{"class":133},[65,8066,377],{"class":82},[65,8068,8069],{"class":67,"line":186},[65,8070,100],{"emptyLinePlaceholder":99},[65,8072,8073,8075,8077,8079,8081,8083,8085,8087,8089],{"class":67,"line":195},[65,8074,1876],{"class":82},[65,8076,1913],{"class":133},[65,8078,3373],{"class":112},[65,8080,3376],{"class":112},[65,8082,201],{"class":82},[65,8084,204],{"class":82},[65,8086,3383],{"class":86},[65,8088,204],{"class":82},[65,8090,377],{"class":82},[65,8092,8093,8095,8097,8099,8101,8103,8105,8107],{"class":67,"line":213},[65,8094,72],{"class":71},[65,8096,130],{"class":82},[65,8098,3396],{"class":75},[65,8100,808],{"class":82},[65,8102,811],{"class":71},[65,8104,83],{"class":82},[65,8106,3405],{"class":86},[65,8108,352],{"class":82},[65,8110,8111],{"class":67,"line":228},[65,8112,100],{"emptyLinePlaceholder":99},[65,8114,8115,8117,8119],{"class":67,"line":243},[65,8116,3250],{"class":116},[65,8118,598],{"class":75},[65,8120,472],{"class":82},[65,8122,8123,8125,8127],{"class":67,"line":249},[65,8124,3424],{"class":133},[65,8126,136],{"class":82},[65,8128,1414],{"class":75},[65,8130,8131],{"class":67,"line":254},[65,8132,1419],{"class":82},[65,8134,8135,8137,8139,8141,8143,8145],{"class":67,"line":261},[65,8136,3437],{"class":133},[65,8138,136],{"class":82},[65,8140,83],{"class":82},[65,8142,207],{"class":86},[65,8144,90],{"class":82},[65,8146,626],{"class":82},[65,8148,8149,8151,8153,8155,8157,8159],{"class":67,"line":274},[65,8150,3452],{"class":133},[65,8152,136],{"class":82},[65,8154,83],{"class":82},[65,8156,238],{"class":86},[65,8158,90],{"class":82},[65,8160,626],{"class":82},[65,8162,8163],{"class":67,"line":288},[65,8164,1456],{"class":82},[65,8166,8167],{"class":67,"line":294},[65,8168,1419],{"class":82},[65,8170,8171,8173,8175,8177,8179,8181],{"class":67,"line":303},[65,8172,3452],{"class":133},[65,8174,136],{"class":82},[65,8176,83],{"class":82},[65,8178,283],{"class":86},[65,8180,90],{"class":82},[65,8182,626],{"class":82},[65,8184,8185,8187,8189],{"class":67,"line":309},[65,8186,3489],{"class":133},[65,8188,136],{"class":82},[65,8190,3494],{"class":82},[65,8192,8193],{"class":67,"line":315},[65,8194,3499],{"class":86},[65,8196,8197],{"class":67,"line":321},[65,8198,3504],{"class":86},[65,8200,8201],{"class":67,"line":327},[65,8202,3509],{"class":86},[65,8204,8205],{"class":67,"line":355},[65,8206,3514],{"class":86},[65,8208,8209,8211,8213,8215,8217,8219,8221,8223,8225,8227,8229],{"class":67,"line":361},[65,8210,3519],{"class":86},[65,8212,333],{"class":82},[65,8214,72],{"class":71},[65,8216,26],{"class":82},[65,8218,3528],{"class":75},[65,8220,26],{"class":82},[65,8222,341],{"class":75},[65,8224,26],{"class":82},[65,8226,3537],{"class":75},[65,8228,349],{"class":82},[65,8230,352],{"class":86},[65,8232,8233],{"class":67,"line":369},[65,8234,3546],{"class":86},[65,8236,8237,8239],{"class":67,"line":380},[65,8238,3551],{"class":82},[65,8240,626],{"class":82},[65,8242,8243],{"class":67,"line":386},[65,8244,1456],{"class":82},[65,8246,8247,8249],{"class":67,"line":394},[65,8248,1461],{"class":75},[65,8250,626],{"class":82},[65,8252,8253,8255],{"class":67,"line":3566},[65,8254,349],{"class":82},[65,8256,3571],{"class":75},[65,8258,8259,8261,8263],{"class":67,"line":3574},[65,8260,770],{"class":82},[65,8262,1913],{"class":133},[65,8264,377],{"class":82},[44,8266,8268,8269],{"id":8267},"вариант-б-глобально-в-nuxtconfigts","Вариант Б — Глобально в ",[36,8270,3254],{},[56,8272,8273],{"className":3589,"code":3590,"language":3383,"meta":61,"style":61},[36,8274,8275,8287,8295,8303,8311,8315,8329,8343,8347,8351,8365,8373,8377,8381,8385,8389,8413,8417,8423,8427,8433,8437,8441],{"__ignoreMap":61},[65,8276,8277,8279,8281,8283,8285],{"class":67,"line":68},[65,8278,106],{"class":71},[65,8280,109],{"class":71},[65,8282,3601],{"class":116},[65,8284,598],{"class":75},[65,8286,472],{"class":82},[65,8288,8289,8291,8293],{"class":67,"line":96},[65,8290,3610],{"class":133},[65,8292,136],{"class":82},[65,8294,151],{"class":82},[65,8296,8297,8299,8301],{"class":67,"line":103},[65,8298,3619],{"class":133},[65,8300,136],{"class":82},[65,8302,151],{"class":82},[65,8304,8305,8307,8309],{"class":67,"line":154},[65,8306,3628],{"class":133},[65,8308,136],{"class":82},[65,8310,1414],{"class":75},[65,8312,8313],{"class":67,"line":163},[65,8314,3637],{"class":82},[65,8316,8317,8319,8321,8323,8325,8327],{"class":67,"line":169},[65,8318,3642],{"class":133},[65,8320,136],{"class":82},[65,8322,83],{"class":82},[65,8324,207],{"class":86},[65,8326,90],{"class":82},[65,8328,626],{"class":82},[65,8330,8331,8333,8335,8337,8339,8341],{"class":67,"line":181},[65,8332,3657],{"class":133},[65,8334,136],{"class":82},[65,8336,83],{"class":82},[65,8338,238],{"class":86},[65,8340,90],{"class":82},[65,8342,626],{"class":82},[65,8344,8345],{"class":67,"line":186},[65,8346,3672],{"class":82},[65,8348,8349],{"class":67,"line":195},[65,8350,3637],{"class":82},[65,8352,8353,8355,8357,8359,8361,8363],{"class":67,"line":213},[65,8354,3657],{"class":133},[65,8356,136],{"class":82},[65,8358,83],{"class":82},[65,8360,283],{"class":86},[65,8362,90],{"class":82},[65,8364,626],{"class":82},[65,8366,8367,8369,8371],{"class":67,"line":228},[65,8368,3695],{"class":133},[65,8370,136],{"class":82},[65,8372,3494],{"class":82},[65,8374,8375],{"class":67,"line":243},[65,8376,3704],{"class":86},[65,8378,8379],{"class":67,"line":249},[65,8380,3709],{"class":86},[65,8382,8383],{"class":67,"line":254},[65,8384,3714],{"class":86},[65,8386,8387],{"class":67,"line":261},[65,8388,3719],{"class":86},[65,8390,8391,8393,8395,8397,8399,8401,8403,8405,8407,8409,8411],{"class":67,"line":274},[65,8392,3724],{"class":86},[65,8394,333],{"class":82},[65,8396,72],{"class":71},[65,8398,26],{"class":82},[65,8400,3528],{"class":75},[65,8402,26],{"class":82},[65,8404,341],{"class":75},[65,8406,26],{"class":82},[65,8408,3537],{"class":75},[65,8410,349],{"class":82},[65,8412,352],{"class":86},[65,8414,8415],{"class":67,"line":288},[65,8416,3749],{"class":86},[65,8418,8419,8421],{"class":67,"line":294},[65,8420,3754],{"class":82},[65,8422,626],{"class":82},[65,8424,8425],{"class":67,"line":303},[65,8426,3672],{"class":82},[65,8428,8429,8431],{"class":67,"line":309},[65,8430,3765],{"class":75},[65,8432,626],{"class":82},[65,8434,8435],{"class":67,"line":315},[65,8436,1456],{"class":82},[65,8438,8439],{"class":67,"line":321},[65,8440,3776],{"class":82},[65,8442,8443,8445],{"class":67,"line":327},[65,8444,349],{"class":82},[65,8446,3571],{"class":75},[28,8448,8450],{"id":8449},"_2-создание-компонента-обёртки","2. Создание компонента-обёртки",[56,8452,8454],{"className":3263,"code":8453,"language":3265,"meta":61,"style":61},"\u003C!-- components\u002FTryOnWidget.vue -->\n\u003Ctemplate>\n \u003Cdiv>\n \u003Cdiv id=\"widget-container\" class=\"aspect-[3\u002F4] w-full max-w-[600px]\" \u002F>\n \u003Cbutton @click=\"handleTryOn\">Примерка\u003C\u002Fbutton>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\nconst props = defineProps\u003C{\n productName: string\n imageUrl: string\n}>()\n\nconst handleTryOn = () => {\n window.fitting('create', {\n targetElementId: 'widget-container',\n model: 'balanced',\n tryonItems: [\n {\n productName: props.productName,\n url: props.imageUrl,\n },\n ],\n })\n}\n\u003C\u002Fscript>\n",[36,8455,8456,8460,8468,8476,8504,8530,8538,8546,8550,8570,8582,8590,8598,8604,8608,8622,8642,8656,8670,8678,8682,8696,8710,8714,8720,8726,8730],{"__ignoreMap":61},[65,8457,8458],{"class":67,"line":68},[65,8459,3796],{"class":3272},[65,8461,8462,8464,8466],{"class":67,"line":96},[65,8463,1876],{"class":82},[65,8465,3280],{"class":133},[65,8467,377],{"class":82},[65,8469,8470,8472,8474],{"class":67,"line":103},[65,8471,3287],{"class":82},[65,8473,688],{"class":133},[65,8475,377],{"class":82},[65,8477,8478,8480,8482,8484,8486,8488,8490,8492,8494,8496,8498,8500,8502],{"class":67,"line":154},[65,8479,910],{"class":82},[65,8481,688],{"class":133},[65,8483,691],{"class":112},[65,8485,201],{"class":82},[65,8487,204],{"class":82},[65,8489,621],{"class":86},[65,8491,204],{"class":82},[65,8493,3831],{"class":112},[65,8495,201],{"class":82},[65,8497,204],{"class":82},[65,8499,3838],{"class":86},[65,8501,204],{"class":82},[65,8503,3343],{"class":82},[65,8505,8506,8508,8510,8512,8514,8516,8518,8520,8522,8524,8526,8528],{"class":67,"line":163},[65,8507,910],{"class":82},[65,8509,752],{"class":133},[65,8511,3851],{"class":112},[65,8513,201],{"class":82},[65,8515,204],{"class":82},[65,8517,3858],{"class":86},[65,8519,204],{"class":82},[65,8521,3300],{"class":82},[65,8523,7655],{"class":75},[65,8525,770],{"class":82},[65,8527,752],{"class":133},[65,8529,377],{"class":82},[65,8531,8532,8534,8536],{"class":67,"line":169},[65,8533,3348],{"class":82},[65,8535,688],{"class":133},[65,8537,377],{"class":82},[65,8539,8540,8542,8544],{"class":67,"line":181},[65,8541,770],{"class":82},[65,8543,3280],{"class":133},[65,8545,377],{"class":82},[65,8547,8548],{"class":67,"line":186},[65,8549,100],{"emptyLinePlaceholder":99},[65,8551,8552,8554,8556,8558,8560,8562,8564,8566,8568],{"class":67,"line":195},[65,8553,1876],{"class":82},[65,8555,1913],{"class":133},[65,8557,3373],{"class":112},[65,8559,3376],{"class":112},[65,8561,201],{"class":82},[65,8563,204],{"class":82},[65,8565,3383],{"class":86},[65,8567,204],{"class":82},[65,8569,377],{"class":82},[65,8571,8572,8574,8576,8578,8580],{"class":67,"line":213},[65,8573,3915],{"class":112},[65,8575,3918],{"class":75},[65,8577,201],{"class":82},[65,8579,3923],{"class":116},[65,8581,3926],{"class":82},[65,8583,8584,8586,8588],{"class":67,"line":228},[65,8585,435],{"class":133},[65,8587,136],{"class":82},[65,8589,3935],{"class":139},[65,8591,8592,8594,8596],{"class":67,"line":243},[65,8593,3940],{"class":133},[65,8595,136],{"class":82},[65,8597,3935],{"class":139},[65,8599,8600,8602],{"class":67,"line":249},[65,8601,764],{"class":82},[65,8603,3951],{"class":75},[65,8605,8606],{"class":67,"line":254},[65,8607,100],{"emptyLinePlaceholder":99},[65,8609,8610,8612,8614,8616,8618,8620],{"class":67,"line":261},[65,8611,3915],{"class":112},[65,8613,3962],{"class":75},[65,8615,201],{"class":82},[65,8617,581],{"class":82},[65,8619,517],{"class":112},[65,8621,151],{"class":82},[65,8623,8624,8626,8628,8630,8632,8634,8636,8638,8640],{"class":67,"line":274},[65,8625,1947],{"class":75},[65,8627,26],{"class":82},[65,8629,595],{"class":116},[65,8631,598],{"class":133},[65,8633,90],{"class":82},[65,8635,603],{"class":86},[65,8637,90],{"class":82},[65,8639,502],{"class":82},[65,8641,151],{"class":82},[65,8643,8644,8646,8648,8650,8652,8654],{"class":67,"line":288},[65,8645,3995],{"class":133},[65,8647,136],{"class":82},[65,8649,83],{"class":82},[65,8651,621],{"class":86},[65,8653,90],{"class":82},[65,8655,626],{"class":82},[65,8657,8658,8660,8662,8664,8666,8668],{"class":67,"line":294},[65,8659,4010],{"class":133},[65,8661,136],{"class":82},[65,8663,83],{"class":82},[65,8665,638],{"class":86},[65,8667,90],{"class":82},[65,8669,626],{"class":82},[65,8671,8672,8674,8676],{"class":67,"line":303},[65,8673,4025],{"class":133},[65,8675,136],{"class":82},[65,8677,1414],{"class":133},[65,8679,8680],{"class":67,"line":309},[65,8681,4034],{"class":82},[65,8683,8684,8686,8688,8690,8692,8694],{"class":67,"line":315},[65,8685,4039],{"class":133},[65,8687,136],{"class":82},[65,8689,4044],{"class":75},[65,8691,26],{"class":82},[65,8693,1328],{"class":75},[65,8695,626],{"class":82},[65,8697,8698,8700,8702,8704,8706,8708],{"class":67,"line":321},[65,8699,4055],{"class":133},[65,8701,136],{"class":82},[65,8703,4044],{"class":75},[65,8705,26],{"class":82},[65,8707,4064],{"class":75},[65,8709,626],{"class":82},[65,8711,8712],{"class":67,"line":327},[65,8713,4071],{"class":82},[65,8715,8716,8718],{"class":67,"line":355},[65,8717,4076],{"class":133},[65,8719,626],{"class":82},[65,8721,8722,8724],{"class":67,"line":361},[65,8723,2062],{"class":82},[65,8725,3571],{"class":133},[65,8727,8728],{"class":67,"line":369},[65,8729,178],{"class":82},[65,8731,8732,8734,8736],{"class":67,"line":380},[65,8733,770],{"class":82},[65,8735,1913],{"class":133},[65,8737,377],{"class":82},[28,8739,7919],{"id":7918},[15,8741,8742,8743,136],{},"Добавьте в ",[36,8744,4104],{},[56,8746,8747],{"className":1074,"code":4107,"language":1076,"meta":61,"style":61},[36,8748,8749],{"__ignoreMap":61},[65,8750,8751,8753,8755],{"class":67,"line":68},[65,8752,3537],{"class":75},[65,8754,201],{"class":82},[65,8756,1087],{"class":86},[1089,8758,4120],{},{"title":61,"searchDepth":96,"depth":96,"links":8760},[8761,8767,8768],{"id":7967,"depth":96,"text":7968,"children":8762},[8763,8765],{"id":7979,"depth":103,"text":8764},"Вариант А — На страницу через useHead",{"id":8267,"depth":103,"text":8766},"Вариант Б — Глобально в nuxt.config.ts",{"id":8449,"depth":96,"text":8450},{"id":7918,"depth":96,"text":7919},"Интеграция с Nuxt 3 \u002F Nuxt 4 приложением",{},"\u002Fintegrations\u002Fnuxt",{"title":3231,"description":8769},"integrations\u002Fnuxt","mSERafXf_JPUG4rn6ZlSU_qJnLNa0suHinF4LwLrASI",{"id":8776,"title":4140,"body":8777,"description":9618,"extension":1102,"icon":5026,"meta":9619,"navigation":99,"path":9620,"seo":9621,"stem":9622,"__hash__":9623},"content\u002Fintegrations\u002Freact.md",{"type":7,"value":8778,"toc":9613},[8779,8783,8786,8790,8795,8979,8987,8991,9297,9301,9611],[10,8780,8782],{"id":8781},"интеграция-с-react","Интеграция с React",[15,8784,8785],{},"Работает с любым React-окружением — Vite, Create React App или своим решением.",[28,8787,8789],{"id":8788},"_1-загрузка-скрипта-виджета","1. Загрузка скрипта виджета",[15,8791,8792,8793,136],{},"Добавьте скрипт в ваш ",[36,8794,4159],{},[56,8796,8798],{"className":1867,"code":8797,"language":1869,"meta":61,"style":61},"\u003C!-- В public\u002Findex.html или index.html (Vite) -->\n\u003Cscript\n src=\"https:\u002F\u002Fwidget.try-on.ru\u002Ffitting-widget-bundle.js\"\n id=\"fitting-widget-bundle\"\n>\u003C\u002Fscript>\n\u003Cscript id=\"fitting-init\">\n window.fitting = window.fitting || function() {\n (window.fitting.q = window.fitting.q || []).push(arguments);\n };\n window.fitting('init', {\n apiKey: '%VITE_TRY_ON_API_KEY%'\n });\n\u003C\u002Fscript>\n",[36,8799,8800,8805,8811,8823,8835,8843,8861,8885,8927,8931,8951,8963,8971],{"__ignoreMap":61},[65,8801,8802],{"class":67,"line":68},[65,8803,8804],{"class":3272},"\u003C!-- В public\u002Findex.html или index.html (Vite) -->\n",[65,8806,8807,8809],{"class":67,"line":96},[65,8808,1876],{"class":82},[65,8810,1879],{"class":133},[65,8812,8813,8815,8817,8819,8821],{"class":67,"line":103},[65,8814,1884],{"class":112},[65,8816,201],{"class":82},[65,8818,204],{"class":82},[65,8820,207],{"class":86},[65,8822,210],{"class":82},[65,8824,8825,8827,8829,8831,8833],{"class":67,"line":154},[65,8826,1897],{"class":112},[65,8828,201],{"class":82},[65,8830,204],{"class":82},[65,8832,238],{"class":86},[65,8834,210],{"class":82},[65,8836,8837,8839,8841],{"class":67,"line":163},[65,8838,1910],{"class":82},[65,8840,1913],{"class":133},[65,8842,377],{"class":82},[65,8844,8845,8847,8849,8851,8853,8855,8857,8859],{"class":67,"line":169},[65,8846,1876],{"class":82},[65,8848,1913],{"class":133},[65,8850,691],{"class":112},[65,8852,201],{"class":82},[65,8854,204],{"class":82},[65,8856,283],{"class":86},[65,8858,204],{"class":82},[65,8860,377],{"class":82},[65,8862,8863,8865,8867,8869,8871,8873,8875,8877,8879,8881,8883],{"class":67,"line":181},[65,8864,1947],{"class":75},[65,8866,26],{"class":82},[65,8868,1952],{"class":75},[65,8870,201],{"class":82},[65,8872,1957],{"class":75},[65,8874,26],{"class":82},[65,8876,1952],{"class":75},[65,8878,1964],{"class":82},[65,8880,113],{"class":112},[65,8882,1969],{"class":82},[65,8884,151],{"class":82},[65,8886,8887,8889,8891,8893,8895,8897,8899,8901,8903,8905,8907,8909,8911,8913,8915,8917,8919,8921,8923,8925],{"class":67,"line":186},[65,8888,1976],{"class":133},[65,8890,1181],{"class":75},[65,8892,26],{"class":82},[65,8894,595],{"class":75},[65,8896,26],{"class":82},[65,8898,1987],{"class":75},[65,8900,578],{"class":82},[65,8902,1957],{"class":75},[65,8904,26],{"class":82},[65,8906,595],{"class":75},[65,8908,26],{"class":82},[65,8910,1987],{"class":75},[65,8912,2002],{"class":82},[65,8914,2005],{"class":133},[65,8916,26],{"class":82},[65,8918,2010],{"class":116},[65,8920,598],{"class":133},[65,8922,2015],{"class":75},[65,8924,514],{"class":133},[65,8926,93],{"class":82},[65,8928,8929],{"class":67,"line":195},[65,8930,667],{"class":82},[65,8932,8933,8935,8937,8939,8941,8943,8945,8947,8949],{"class":67,"line":213},[65,8934,1947],{"class":75},[65,8936,26],{"class":82},[65,8938,595],{"class":116},[65,8940,598],{"class":75},[65,8942,90],{"class":82},[65,8944,1192],{"class":86},[65,8946,90],{"class":82},[65,8948,502],{"class":82},[65,8950,151],{"class":82},[65,8952,8953,8955,8957,8959,8961],{"class":67,"line":228},[65,8954,2048],{"class":133},[65,8956,136],{"class":82},[65,8958,83],{"class":82},[65,8960,4326],{"class":86},[65,8962,352],{"class":82},[65,8964,8965,8967,8969],{"class":67,"line":243},[65,8966,2062],{"class":82},[65,8968,514],{"class":75},[65,8970,93],{"class":82},[65,8972,8973,8975,8977],{"class":67,"line":249},[65,8974,770],{"class":82},[65,8976,1913],{"class":133},[65,8978,377],{"class":82},[4346,8980,8981],{"icon":4348},[15,8982,8983,8984,8986],{},"Замените ",[36,8985,4326],{}," на ваш реальный ключ во время сборки, или используйте инъекцию во время выполнения.",[28,8988,8990],{"id":8989},"_2-создайте-свой-хук","2. Создайте свой хук",[56,8992,8993],{"className":58,"code":4361,"language":60,"meta":61,"style":61},[36,8994,8995,8999,9007,9017,9027,9037,9041,9045,9053,9063,9093,9105,9109,9113,9121,9129,9159,9163,9167,9171,9183,9205,9229,9233,9237,9251,9271,9275,9279,9293],{"__ignoreMap":61},[65,8996,8997],{"class":67,"line":68},[65,8998,4368],{"class":3272},[65,9000,9001,9003,9005],{"class":67,"line":96},[65,9002,425],{"class":112},[65,9004,428],{"class":139},[65,9006,151],{"class":82},[65,9008,9009,9011,9013,9015],{"class":67,"line":103},[65,9010,435],{"class":133},[65,9012,136],{"class":82},[65,9014,440],{"class":139},[65,9016,93],{"class":82},[65,9018,9019,9021,9023,9025],{"class":67,"line":154},[65,9020,447],{"class":133},[65,9022,136],{"class":82},[65,9024,440],{"class":139},[65,9026,93],{"class":82},[65,9028,9029,9031,9033,9035],{"class":67,"line":163},[65,9030,4401],{"class":133},[65,9032,508],{"class":82},[65,9034,440],{"class":139},[65,9036,93],{"class":82},[65,9038,9039],{"class":67,"line":169},[65,9040,178],{"class":82},[65,9042,9043],{"class":67,"line":181},[65,9044,100],{"emptyLinePlaceholder":99},[65,9046,9047,9049,9051],{"class":67,"line":186},[65,9048,425],{"class":112},[65,9050,4422],{"class":139},[65,9052,151],{"class":82},[65,9054,9055,9057,9059,9061],{"class":67,"line":195},[65,9056,1379],{"class":133},[65,9058,136],{"class":82},[65,9060,440],{"class":139},[65,9062,93],{"class":82},[65,9064,9065,9067,9069,9071,9073,9075,9077,9079,9081,9083,9085,9087,9089,9091],{"class":67,"line":213},[65,9066,1394],{"class":133},[65,9068,508],{"class":82},[65,9070,83],{"class":82},[65,9072,638],{"class":86},[65,9074,90],{"class":82},[65,9076,4449],{"class":82},[65,9078,83],{"class":82},[65,9080,4454],{"class":86},[65,9082,90],{"class":82},[65,9084,4449],{"class":82},[65,9086,83],{"class":82},[65,9088,4463],{"class":86},[65,9090,90],{"class":82},[65,9092,93],{"class":82},[65,9094,9095,9097,9099,9101,9103],{"class":67,"line":228},[65,9096,1409],{"class":133},[65,9098,136],{"class":82},[65,9100,428],{"class":139},[65,9102,4478],{"class":75},[65,9104,93],{"class":82},[65,9106,9107],{"class":67,"line":243},[65,9108,178],{"class":82},[65,9110,9111],{"class":67,"line":249},[65,9112,100],{"emptyLinePlaceholder":99},[65,9114,9115,9117,9119],{"class":67,"line":254},[65,9116,466],{"class":112},[65,9118,469],{"class":75},[65,9120,472],{"class":82},[65,9122,9123,9125,9127],{"class":67,"line":261},[65,9124,477],{"class":112},[65,9126,480],{"class":139},[65,9128,151],{"class":82},[65,9130,9131,9133,9135,9137,9139,9141,9143,9145,9147,9149,9151,9153,9155,9157],{"class":67,"line":274},[65,9132,487],{"class":133},[65,9134,136],{"class":82},[65,9136,492],{"class":82},[65,9138,495],{"class":123},[65,9140,136],{"class":82},[65,9142,440],{"class":139},[65,9144,502],{"class":82},[65,9146,505],{"class":123},[65,9148,508],{"class":82},[65,9150,511],{"class":139},[65,9152,514],{"class":82},[65,9154,517],{"class":112},[65,9156,520],{"class":139},[65,9158,93],{"class":82},[65,9160,9161],{"class":67,"line":288},[65,9162,527],{"class":82},[65,9164,9165],{"class":67,"line":294},[65,9166,178],{"class":82},[65,9168,9169],{"class":67,"line":303},[65,9170,100],{"emptyLinePlaceholder":99},[65,9172,9173,9175,9177,9179,9181],{"class":67,"line":309},[65,9174,106],{"class":71},[65,9176,113],{"class":112},[65,9178,4555],{"class":116},[65,9180,1969],{"class":82},[65,9182,151],{"class":82},[65,9184,9185,9187,9189,9191,9193,9195,9197,9199,9201,9203],{"class":67,"line":315},[65,9186,572],{"class":112},[65,9188,4566],{"class":75},[65,9190,578],{"class":82},[65,9192,492],{"class":82},[65,9194,4573],{"class":123},[65,9196,136],{"class":82},[65,9198,4422],{"class":139},[65,9200,514],{"class":82},[65,9202,517],{"class":112},[65,9204,151],{"class":82},[65,9206,9207,9209,9211,9213,9215,9217,9219,9221,9223,9225,9227],{"class":67,"line":321},[65,9208,590],{"class":75},[65,9210,26],{"class":82},[65,9212,595],{"class":116},[65,9214,598],{"class":133},[65,9216,90],{"class":82},[65,9218,603],{"class":86},[65,9220,90],{"class":82},[65,9222,502],{"class":82},[65,9224,505],{"class":75},[65,9226,514],{"class":133},[65,9228,93],{"class":82},[65,9230,9231],{"class":67,"line":327},[65,9232,667],{"class":82},[65,9234,9235],{"class":67,"line":355},[65,9236,100],{"emptyLinePlaceholder":99},[65,9238,9239,9241,9243,9245,9247,9249],{"class":67,"line":361},[65,9240,572],{"class":112},[65,9242,4622],{"class":75},[65,9244,578],{"class":82},[65,9246,581],{"class":82},[65,9248,517],{"class":112},[65,9250,151],{"class":82},[65,9252,9253,9255,9257,9259,9261,9263,9265,9267,9269],{"class":67,"line":369},[65,9254,590],{"class":75},[65,9256,26],{"class":82},[65,9258,595],{"class":116},[65,9260,598],{"class":133},[65,9262,90],{"class":82},[65,9264,4645],{"class":86},[65,9266,90],{"class":82},[65,9268,514],{"class":133},[65,9270,93],{"class":82},[65,9272,9273],{"class":67,"line":380},[65,9274,667],{"class":82},[65,9276,9277],{"class":67,"line":386},[65,9278,100],{"emptyLinePlaceholder":99},[65,9280,9281,9283,9285,9287,9289,9291],{"class":67,"line":394},[65,9282,157],{"class":71},[65,9284,130],{"class":82},[65,9286,4566],{"class":75},[65,9288,502],{"class":82},[65,9290,4622],{"class":75},[65,9292,4674],{"class":82},[65,9294,9295],{"class":67,"line":3566},[65,9296,178],{"class":82},[28,9298,9300],{"id":9299},"_3-использование-в-компоненте","3. Использование в компоненте",[56,9302,9304],{"className":58,"code":9303,"language":60,"meta":61,"style":61},"\u002F\u002F components\u002FTryOnWidget.tsx\nimport { useFittingWidget } from '..\u002Fhooks\u002FuseFittingWidget';\n\ninterface Props {\n productName: string;\n imageUrl: string;\n}\n\nexport function TryOnWidget({ productName, imageUrl }: Props) {\n const { open } = useFittingWidget();\n\n return (\n \u003Cdiv>\n \u003Cdiv\n id=\"widget-container\"\n style={{ width: '100%', maxWidth: 600, aspectRatio: '3\u002F4' }}\n \u002F>\n \u003Cbutton\n onClick={() =>\n open({\n targetElementId: 'widget-container',\n model: 'balanced',\n tryonItems: [{ productName, url: imageUrl }],\n })\n }\n >\n Примерка\n \u003C\u002Fbutton>\n \u003C\u002Fdiv>\n );\n}\n",[36,9305,9306,9310,9330,9334,9342,9352,9362,9366,9370,9394,9412,9416,9422,9430,9436,9448,9486,9490,9496,9504,9512,9526,9540,9566,9572,9576,9580,9585,9593,9601,9607],{"__ignoreMap":61},[65,9307,9308],{"class":67,"line":68},[65,9309,4692],{"class":3272},[65,9311,9312,9314,9316,9318,9320,9322,9324,9326,9328],{"class":67,"line":96},[65,9313,72],{"class":71},[65,9315,130],{"class":82},[65,9317,4555],{"class":75},[65,9319,808],{"class":82},[65,9321,811],{"class":71},[65,9323,83],{"class":82},[65,9325,4709],{"class":86},[65,9327,90],{"class":82},[65,9329,93],{"class":82},[65,9331,9332],{"class":67,"line":103},[65,9333,100],{"emptyLinePlaceholder":99},[65,9335,9336,9338,9340],{"class":67,"line":154},[65,9337,425],{"class":112},[65,9339,4724],{"class":139},[65,9341,151],{"class":82},[65,9343,9344,9346,9348,9350],{"class":67,"line":163},[65,9345,435],{"class":133},[65,9347,136],{"class":82},[65,9349,440],{"class":139},[65,9351,93],{"class":82},[65,9353,9354,9356,9358,9360],{"class":67,"line":169},[65,9355,3940],{"class":133},[65,9357,136],{"class":82},[65,9359,440],{"class":139},[65,9361,93],{"class":82},[65,9363,9364],{"class":67,"line":181},[65,9365,178],{"class":82},[65,9367,9368],{"class":67,"line":186},[65,9369,100],{"emptyLinePlaceholder":99},[65,9371,9372,9374,9376,9378,9380,9382,9384,9386,9388,9390,9392],{"class":67,"line":195},[65,9373,106],{"class":71},[65,9375,113],{"class":112},[65,9377,4763],{"class":116},[65,9379,120],{"class":82},[65,9381,4768],{"class":123},[65,9383,502],{"class":82},[65,9385,4773],{"class":123},[65,9387,127],{"class":82},[65,9389,4724],{"class":139},[65,9391,514],{"class":82},[65,9393,151],{"class":82},[65,9395,9396,9398,9400,9402,9404,9406,9408,9410],{"class":67,"line":213},[65,9397,572],{"class":112},[65,9399,130],{"class":82},[65,9401,4566],{"class":75},[65,9403,808],{"class":82},[65,9405,578],{"class":82},[65,9407,4555],{"class":116},[65,9409,1969],{"class":133},[65,9411,93],{"class":82},[65,9413,9414],{"class":67,"line":228},[65,9415,100],{"emptyLinePlaceholder":99},[65,9417,9418,9420],{"class":67,"line":243},[65,9419,157],{"class":71},[65,9421,160],{"class":133},[65,9423,9424,9426,9428],{"class":67,"line":249},[65,9425,910],{"class":82},[65,9427,688],{"class":133},[65,9429,377],{"class":82},[65,9431,9432,9434],{"class":67,"line":254},[65,9433,189],{"class":82},[65,9435,4824],{"class":133},[65,9437,9438,9440,9442,9444,9446],{"class":67,"line":261},[65,9439,231],{"class":112},[65,9441,201],{"class":82},[65,9443,204],{"class":82},[65,9445,621],{"class":86},[65,9447,210],{"class":82},[65,9449,9450,9452,9454,9456,9458,9460,9462,9464,9466,9468,9470,9472,9474,9476,9478,9480,9482,9484],{"class":67,"line":274},[65,9451,4841],{"class":112},[65,9453,705],{"class":82},[65,9455,708],{"class":133},[65,9457,136],{"class":82},[65,9459,83],{"class":82},[65,9461,715],{"class":86},[65,9463,90],{"class":82},[65,9465,502],{"class":82},[65,9467,722],{"class":133},[65,9469,136],{"class":82},[65,9471,728],{"class":727},[65,9473,502],{"class":82},[65,9475,733],{"class":133},[65,9477,136],{"class":82},[65,9479,83],{"class":82},[65,9481,740],{"class":86},[65,9483,90],{"class":82},[65,9485,4876],{"class":82},[65,9487,9488],{"class":67,"line":288},[65,9489,246],{"class":82},[65,9491,9492,9494],{"class":67,"line":294},[65,9493,189],{"class":82},[65,9495,4887],{"class":133},[65,9497,9498,9500,9502],{"class":67,"line":303},[65,9499,4892],{"class":112},[65,9501,4895],{"class":82},[65,9503,4898],{"class":112},[65,9505,9506,9508,9510],{"class":67,"line":309},[65,9507,4903],{"class":116},[65,9509,598],{"class":75},[65,9511,472],{"class":82},[65,9513,9514,9516,9518,9520,9522,9524],{"class":67,"line":315},[65,9515,4912],{"class":133},[65,9517,136],{"class":82},[65,9519,83],{"class":82},[65,9521,621],{"class":86},[65,9523,90],{"class":82},[65,9525,626],{"class":82},[65,9527,9528,9530,9532,9534,9536,9538],{"class":67,"line":321},[65,9529,4927],{"class":133},[65,9531,136],{"class":82},[65,9533,83],{"class":82},[65,9535,638],{"class":86},[65,9537,90],{"class":82},[65,9539,626],{"class":82},[65,9541,9542,9544,9546,9548,9550,9552,9554,9556,9558,9560,9562,9564],{"class":67,"line":327},[65,9543,4942],{"class":133},[65,9545,136],{"class":82},[65,9547,4947],{"class":75},[65,9549,4950],{"class":82},[65,9551,4768],{"class":75},[65,9553,502],{"class":82},[65,9555,4957],{"class":133},[65,9557,136],{"class":82},[65,9559,4962],{"class":75},[65,9561,349],{"class":82},[65,9563,4967],{"class":75},[65,9565,626],{"class":82},[65,9567,9568,9570],{"class":67,"line":355},[65,9569,4974],{"class":82},[65,9571,3571],{"class":75},[65,9573,9574],{"class":67,"line":361},[65,9575,4981],{"class":82},[65,9577,9578],{"class":67,"line":369},[65,9579,291],{"class":82},[65,9581,9582],{"class":67,"line":380},[65,9583,9584],{"class":75}," Примерка\n",[65,9586,9587,9589,9591],{"class":67,"line":386},[65,9588,372],{"class":82},[65,9590,752],{"class":133},[65,9592,377],{"class":82},[65,9594,9595,9597,9599],{"class":67,"line":394},[65,9596,1047],{"class":82},[65,9598,688],{"class":133},[65,9600,377],{"class":82},[65,9602,9603,9605],{"class":67,"line":3566},[65,9604,389],{"class":133},[65,9606,93],{"class":82},[65,9608,9609],{"class":67,"line":3574},[65,9610,178],{"class":82},[1089,9612,5019],{},{"title":61,"searchDepth":96,"depth":96,"links":9614},[9615,9616,9617],{"id":8788,"depth":96,"text":8789},{"id":8989,"depth":96,"text":8990},{"id":9299,"depth":96,"text":9300},"Интеграция с React-приложением (Vite \u002F CRA)",{},"\u002Fintegrations\u002Freact",{"title":4140,"description":9618},"integrations\u002Freact","F7mSDoVd1RiVLbrCGyquPOzGkvCalo0IeQdlhW6YYUs",{"id":9625,"title":5034,"body":9626,"description":10247,"extension":1102,"icon":5706,"meta":10248,"navigation":99,"path":2256,"seo":10249,"stem":10250,"__hash__":10251},"content\u002Fintegrations\u002Fvanilla-js.md",{"type":7,"value":9627,"toc":10243},[9628,9632,9635,9639,10219,10223,10241],[10,9629,9631],{"id":9630},"интеграция-с-vanilla-js","Интеграция с Vanilla JS",[15,9633,9634],{},"Без фреймворков — только HTML и JavaScript.",[28,9636,9638],{"id":9637},"полный-пример","Полный пример",[56,9640,9642],{"className":1867,"code":9641,"language":1869,"meta":61,"style":61},"\u003C!DOCTYPE html>\n\u003Chtml lang=\"ru\">\n\u003Chead>\n \u003Cmeta charset=\"UTF-8\" \u002F>\n \u003Cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \u002F>\n \u003Ctitle>Страница товара — Виртуальная примерка\u003C\u002Ftitle>\n\u003C\u002Fhead>\n\u003Cbody>\n\n \u003Ch1>Классическая джинсовая куртка\u003C\u002Fh1>\n \u003Cp>7 500 ₽\u003C\u002Fp>\n\n \u003C!-- Контейнер виджета -->\n \u003Cdiv id=\"widget-container\" style=\"width: 100%; max-width: 600px; aspect-ratio: 3 \u002F 4;\">\u003C\u002Fdiv>\n\n \u003Cbutton onclick=\"openWidget()\">Примерка\u003C\u002Fbutton>\n\n \u003C!-- 1. Загрузка пакета виджета -->\n \u003Cscript\n src=\"https:\u002F\u002Fwidget.try-on.ru\u002Ffitting-widget-bundle.js\"\n id=\"fitting-widget-bundle\"\n >\u003C\u002Fscript>\n\n \u003C!-- 2. Инициализация -->\n \u003Cscript id=\"fitting-init\">\n window.fitting = window.fitting || function() {\n (window.fitting.q = window.fitting.q || []).push(arguments);\n };\n window.fitting('init', {\n apiKey: 'YOUR_API_KEY'\n });\n \u003C\u002Fscript>\n\n \u003Cscript>\n function openWidget() {\n window.fitting('create', {\n targetElementId: 'widget-container',\n model: 'balanced',\n tryonItems: [\n {\n productName: 'Классическая джинсовая куртка',\n url: 'https:\u002F\u002Fexample.com\u002Fimages\u002Fjacket.jpg',\n },\n ],\n });\n }\n \u003C\u002Fscript>\n\u003C\u002Fbody>\n\u003C\u002Fhtml>\n",[36,9643,9644,9654,9673,9681,9699,9727,9744,9752,9760,9764,9781,9798,9802,9807,9839,9843,9871,9875,9880,9886,9898,9910,9918,9922,9927,9945,9969,10011,10015,10035,10047,10055,10063,10067,10075,10085,10105,10119,10133,10141,10145,10159,10173,10177,10183,10191,10195,10203,10211],{"__ignoreMap":61},[65,9645,9646,9648,9650,9652],{"class":67,"line":68},[65,9647,5057],{"class":82},[65,9649,5060],{"class":133},[65,9651,5063],{"class":112},[65,9653,377],{"class":82},[65,9655,9656,9658,9660,9662,9664,9666,9669,9671],{"class":67,"line":96},[65,9657,1876],{"class":82},[65,9659,1869],{"class":133},[65,9661,3376],{"class":112},[65,9663,201],{"class":82},[65,9665,204],{"class":82},[65,9667,9668],{"class":86},"ru",[65,9670,204],{"class":82},[65,9672,377],{"class":82},[65,9674,9675,9677,9679],{"class":67,"line":103},[65,9676,1876],{"class":82},[65,9678,5091],{"class":133},[65,9680,377],{"class":82},[65,9682,9683,9685,9687,9689,9691,9693,9695,9697],{"class":67,"line":154},[65,9684,3287],{"class":82},[65,9686,3528],{"class":133},[65,9688,5102],{"class":112},[65,9690,201],{"class":82},[65,9692,204],{"class":82},[65,9694,5109],{"class":86},[65,9696,204],{"class":82},[65,9698,3343],{"class":82},[65,9700,9701,9703,9705,9707,9709,9711,9713,9715,9717,9719,9721,9723,9725],{"class":67,"line":163},[65,9702,3287],{"class":82},[65,9704,3528],{"class":133},[65,9706,5122],{"class":112},[65,9708,201],{"class":82},[65,9710,204],{"class":82},[65,9712,5129],{"class":86},[65,9714,204],{"class":82},[65,9716,5134],{"class":112},[65,9718,201],{"class":82},[65,9720,204],{"class":82},[65,9722,5141],{"class":86},[65,9724,204],{"class":82},[65,9726,3343],{"class":82},[65,9728,9729,9731,9733,9735,9738,9740,9742],{"class":67,"line":169},[65,9730,3287],{"class":82},[65,9732,5152],{"class":133},[65,9734,3300],{"class":82},[65,9736,9737],{"class":75},"Страница товара — Виртуальная примерка",[65,9739,770],{"class":82},[65,9741,5152],{"class":133},[65,9743,377],{"class":82},[65,9745,9746,9748,9750],{"class":67,"line":181},[65,9747,770],{"class":82},[65,9749,5091],{"class":133},[65,9751,377],{"class":82},[65,9753,9754,9756,9758],{"class":67,"line":186},[65,9755,1876],{"class":82},[65,9757,5178],{"class":133},[65,9759,377],{"class":82},[65,9761,9762],{"class":67,"line":195},[65,9763,100],{"emptyLinePlaceholder":99},[65,9765,9766,9768,9770,9772,9775,9777,9779],{"class":67,"line":213},[65,9767,3287],{"class":82},[65,9769,10],{"class":133},[65,9771,3300],{"class":82},[65,9773,9774],{"class":75},"Классическая джинсовая куртка",[65,9776,770],{"class":82},[65,9778,10],{"class":133},[65,9780,377],{"class":82},[65,9782,9783,9785,9787,9789,9792,9794,9796],{"class":67,"line":228},[65,9784,3287],{"class":82},[65,9786,15],{"class":133},[65,9788,3300],{"class":82},[65,9790,9791],{"class":75},"7 500 ₽",[65,9793,770],{"class":82},[65,9795,15],{"class":133},[65,9797,377],{"class":82},[65,9799,9800],{"class":67,"line":243},[65,9801,100],{"emptyLinePlaceholder":99},[65,9803,9804],{"class":67,"line":249},[65,9805,9806],{"class":3272}," \u003C!-- Контейнер виджета -->\n",[65,9808,9809,9811,9813,9815,9817,9819,9821,9823,9825,9827,9829,9831,9833,9835,9837],{"class":67,"line":254},[65,9810,3287],{"class":82},[65,9812,688],{"class":133},[65,9814,691],{"class":112},[65,9816,201],{"class":82},[65,9818,204],{"class":82},[65,9820,621],{"class":86},[65,9822,204],{"class":82},[65,9824,702],{"class":112},[65,9826,201],{"class":82},[65,9828,204],{"class":82},[65,9830,5251],{"class":86},[65,9832,204],{"class":82},[65,9834,1910],{"class":82},[65,9836,688],{"class":133},[65,9838,377],{"class":82},[65,9840,9841],{"class":67,"line":261},[65,9842,100],{"emptyLinePlaceholder":99},[65,9844,9845,9847,9849,9851,9853,9855,9857,9859,9861,9863,9865,9867,9869],{"class":67,"line":274},[65,9846,3287],{"class":82},[65,9848,752],{"class":133},[65,9850,5272],{"class":112},[65,9852,201],{"class":82},[65,9854,204],{"class":82},[65,9856,5279],{"class":116},[65,9858,1969],{"class":86},[65,9860,204],{"class":82},[65,9862,3300],{"class":82},[65,9864,7655],{"class":75},[65,9866,770],{"class":82},[65,9868,752],{"class":133},[65,9870,377],{"class":82},[65,9872,9873],{"class":67,"line":288},[65,9874,100],{"emptyLinePlaceholder":99},[65,9876,9877],{"class":67,"line":294},[65,9878,9879],{"class":3272}," \u003C!-- 1. Загрузка пакета виджета -->\n",[65,9881,9882,9884],{"class":67,"line":303},[65,9883,3287],{"class":82},[65,9885,1879],{"class":133},[65,9887,9888,9890,9892,9894,9896],{"class":67,"line":309},[65,9889,5313],{"class":112},[65,9891,201],{"class":82},[65,9893,204],{"class":82},[65,9895,207],{"class":86},[65,9897,210],{"class":82},[65,9899,9900,9902,9904,9906,9908],{"class":67,"line":315},[65,9901,5326],{"class":112},[65,9903,201],{"class":82},[65,9905,204],{"class":82},[65,9907,238],{"class":86},[65,9909,210],{"class":82},[65,9911,9912,9914,9916],{"class":67,"line":321},[65,9913,5339],{"class":82},[65,9915,1913],{"class":133},[65,9917,377],{"class":82},[65,9919,9920],{"class":67,"line":327},[65,9921,100],{"emptyLinePlaceholder":99},[65,9923,9924],{"class":67,"line":355},[65,9925,9926],{"class":3272}," \u003C!-- 2. Инициализация -->\n",[65,9928,9929,9931,9933,9935,9937,9939,9941,9943],{"class":67,"line":361},[65,9930,3287],{"class":82},[65,9932,1913],{"class":133},[65,9934,691],{"class":112},[65,9936,201],{"class":82},[65,9938,204],{"class":82},[65,9940,283],{"class":86},[65,9942,204],{"class":82},[65,9944,377],{"class":82},[65,9946,9947,9949,9951,9953,9955,9957,9959,9961,9963,9965,9967],{"class":67,"line":369},[65,9948,590],{"class":75},[65,9950,26],{"class":82},[65,9952,1952],{"class":75},[65,9954,201],{"class":82},[65,9956,1957],{"class":75},[65,9958,26],{"class":82},[65,9960,1952],{"class":75},[65,9962,1964],{"class":82},[65,9964,113],{"class":112},[65,9966,1969],{"class":82},[65,9968,151],{"class":82},[65,9970,9971,9973,9975,9977,9979,9981,9983,9985,9987,9989,9991,9993,9995,9997,9999,10001,10003,10005,10007,10009],{"class":67,"line":380},[65,9972,5399],{"class":133},[65,9974,1181],{"class":75},[65,9976,26],{"class":82},[65,9978,595],{"class":75},[65,9980,26],{"class":82},[65,9982,1987],{"class":75},[65,9984,578],{"class":82},[65,9986,1957],{"class":75},[65,9988,26],{"class":82},[65,9990,595],{"class":75},[65,9992,26],{"class":82},[65,9994,1987],{"class":75},[65,9996,2002],{"class":82},[65,9998,2005],{"class":133},[65,10000,26],{"class":82},[65,10002,2010],{"class":116},[65,10004,598],{"class":133},[65,10006,2015],{"class":75},[65,10008,514],{"class":133},[65,10010,93],{"class":82},[65,10012,10013],{"class":67,"line":386},[65,10014,5442],{"class":82},[65,10016,10017,10019,10021,10023,10025,10027,10029,10031,10033],{"class":67,"line":394},[65,10018,590],{"class":75},[65,10020,26],{"class":82},[65,10022,595],{"class":116},[65,10024,598],{"class":75},[65,10026,90],{"class":82},[65,10028,1192],{"class":86},[65,10030,90],{"class":82},[65,10032,502],{"class":82},[65,10034,151],{"class":82},[65,10036,10037,10039,10041,10043,10045],{"class":67,"line":3566},[65,10038,5467],{"class":133},[65,10040,136],{"class":82},[65,10042,83],{"class":82},[65,10044,2055],{"class":86},[65,10046,352],{"class":82},[65,10048,10049,10051,10053],{"class":67,"line":3574},[65,10050,658],{"class":82},[65,10052,514],{"class":75},[65,10054,93],{"class":82},[65,10056,10057,10059,10061],{"class":67,"line":5486},[65,10058,3348],{"class":82},[65,10060,1913],{"class":133},[65,10062,377],{"class":82},[65,10064,10065],{"class":67,"line":5495},[65,10066,100],{"emptyLinePlaceholder":99},[65,10068,10069,10071,10073],{"class":67,"line":5500},[65,10070,3287],{"class":82},[65,10072,1913],{"class":133},[65,10074,377],{"class":82},[65,10076,10077,10079,10081,10083],{"class":67,"line":5509},[65,10078,5512],{"class":112},[65,10080,5515],{"class":116},[65,10082,1969],{"class":82},[65,10084,151],{"class":82},[65,10086,10087,10089,10091,10093,10095,10097,10099,10101,10103],{"class":67,"line":5522},[65,10088,5525],{"class":75},[65,10090,26],{"class":82},[65,10092,595],{"class":116},[65,10094,598],{"class":133},[65,10096,90],{"class":82},[65,10098,603],{"class":86},[65,10100,90],{"class":82},[65,10102,502],{"class":82},[65,10104,151],{"class":82},[65,10106,10107,10109,10111,10113,10115,10117],{"class":67,"line":5544},[65,10108,5547],{"class":133},[65,10110,136],{"class":82},[65,10112,83],{"class":82},[65,10114,621],{"class":86},[65,10116,90],{"class":82},[65,10118,626],{"class":82},[65,10120,10121,10123,10125,10127,10129,10131],{"class":67,"line":5560},[65,10122,5563],{"class":133},[65,10124,136],{"class":82},[65,10126,83],{"class":82},[65,10128,638],{"class":86},[65,10130,90],{"class":82},[65,10132,626],{"class":82},[65,10134,10135,10137,10139],{"class":67,"line":5576},[65,10136,5579],{"class":133},[65,10138,136],{"class":82},[65,10140,1414],{"class":133},[65,10142,10143],{"class":67,"line":5586},[65,10144,996],{"class":82},[65,10146,10147,10149,10151,10153,10155,10157],{"class":67,"line":5591},[65,10148,1001],{"class":133},[65,10150,136],{"class":82},[65,10152,83],{"class":82},[65,10154,9774],{"class":86},[65,10156,90],{"class":82},[65,10158,626],{"class":82},[65,10160,10161,10163,10165,10167,10169,10171],{"class":67,"line":5606},[65,10162,1016],{"class":133},[65,10164,136],{"class":82},[65,10166,83],{"class":82},[65,10168,5615],{"class":86},[65,10170,90],{"class":82},[65,10172,626],{"class":82},[65,10174,10175],{"class":67,"line":5622},[65,10176,1031],{"class":82},[65,10178,10179,10181],{"class":67,"line":5627},[65,10180,1036],{"class":133},[65,10182,626],{"class":82},[65,10184,10185,10187,10189],{"class":67,"line":5634},[65,10186,5637],{"class":82},[65,10188,514],{"class":133},[65,10190,93],{"class":82},[65,10192,10193],{"class":67,"line":5644},[65,10194,5647],{"class":82},[65,10196,10197,10199,10201],{"class":67,"line":5650},[65,10198,3348],{"class":82},[65,10200,1913],{"class":133},[65,10202,377],{"class":82},[65,10204,10205,10207,10209],{"class":67,"line":5659},[65,10206,770],{"class":82},[65,10208,5178],{"class":133},[65,10210,377],{"class":82},[65,10212,10213,10215,10217],{"class":67,"line":5668},[65,10214,770],{"class":82},[65,10216,1869],{"class":133},[65,10218,377],{"class":82},[28,10220,10222],{"id":10221},"ключевые-моменты","Ключевые моменты",[2248,10224,10225,10228,10236],{},[2251,10226,10227],{},"Сначала загружается пакетный скрипт.",[2251,10229,10230,10231,10233,10234,26],{},"Инициализируйте с помощью ",[36,10232,5689],{}," перед вызовом ",[36,10235,603],{},[2251,10237,10238,10240],{},[36,10239,1255],{}," должен совпадать с существующим элементом на странице.",[1089,10242,5700],{},{"title":61,"searchDepth":96,"depth":96,"links":10244},[10245,10246],{"id":9637,"depth":96,"text":9638},{"id":10221,"depth":96,"text":10222},"Интеграция с обычным HTML\u002FJavaScript",{},{"title":5034,"description":10247},"integrations\u002Fvanilla-js","TOVOFdq4t72IBSUKHoJgLGlQk10I_zCs_rea9Sj9PGA",{"id":10253,"title":5714,"body":10254,"description":11084,"extension":1102,"icon":6561,"meta":11085,"navigation":99,"path":11086,"seo":11087,"stem":11088,"__hash__":11089},"content\u002Fintegrations\u002Fvue.md",{"type":7,"value":10255,"toc":11079},[10256,10260,10263,10265,10270,10448,10452,10744,10748,11077],[10,10257,10259],{"id":10258},"интеграция-с-vue-3","Интеграция с Vue 3",[15,10261,10262],{},"Работает с Vue 3 + Vite или любым другим окружением Vue 3.",[28,10264,8789],{"id":8788},[15,10266,10267,10268,136],{},"В ",[36,10269,4159],{},[56,10271,10272],{"className":1867,"code":5733,"language":1869,"meta":61,"style":61},[36,10273,10274,10280,10292,10304,10312,10330,10354,10396,10400,10420,10432,10440],{"__ignoreMap":61},[65,10275,10276,10278],{"class":67,"line":68},[65,10277,1876],{"class":82},[65,10279,1879],{"class":133},[65,10281,10282,10284,10286,10288,10290],{"class":67,"line":96},[65,10283,1884],{"class":112},[65,10285,201],{"class":82},[65,10287,204],{"class":82},[65,10289,207],{"class":86},[65,10291,210],{"class":82},[65,10293,10294,10296,10298,10300,10302],{"class":67,"line":103},[65,10295,1897],{"class":112},[65,10297,201],{"class":82},[65,10299,204],{"class":82},[65,10301,238],{"class":86},[65,10303,210],{"class":82},[65,10305,10306,10308,10310],{"class":67,"line":154},[65,10307,1910],{"class":82},[65,10309,1913],{"class":133},[65,10311,377],{"class":82},[65,10313,10314,10316,10318,10320,10322,10324,10326,10328],{"class":67,"line":163},[65,10315,1876],{"class":82},[65,10317,1913],{"class":133},[65,10319,691],{"class":112},[65,10321,201],{"class":82},[65,10323,204],{"class":82},[65,10325,283],{"class":86},[65,10327,204],{"class":82},[65,10329,377],{"class":82},[65,10331,10332,10334,10336,10338,10340,10342,10344,10346,10348,10350,10352],{"class":67,"line":169},[65,10333,1947],{"class":75},[65,10335,26],{"class":82},[65,10337,1952],{"class":75},[65,10339,201],{"class":82},[65,10341,1957],{"class":75},[65,10343,26],{"class":82},[65,10345,1952],{"class":75},[65,10347,1964],{"class":82},[65,10349,113],{"class":112},[65,10351,1969],{"class":82},[65,10353,151],{"class":82},[65,10355,10356,10358,10360,10362,10364,10366,10368,10370,10372,10374,10376,10378,10380,10382,10384,10386,10388,10390,10392,10394],{"class":67,"line":181},[65,10357,1976],{"class":133},[65,10359,1181],{"class":75},[65,10361,26],{"class":82},[65,10363,595],{"class":75},[65,10365,26],{"class":82},[65,10367,1987],{"class":75},[65,10369,578],{"class":82},[65,10371,1957],{"class":75},[65,10373,26],{"class":82},[65,10375,595],{"class":75},[65,10377,26],{"class":82},[65,10379,1987],{"class":75},[65,10381,2002],{"class":82},[65,10383,2005],{"class":133},[65,10385,26],{"class":82},[65,10387,2010],{"class":116},[65,10389,598],{"class":133},[65,10391,2015],{"class":75},[65,10393,514],{"class":133},[65,10395,93],{"class":82},[65,10397,10398],{"class":67,"line":186},[65,10399,667],{"class":82},[65,10401,10402,10404,10406,10408,10410,10412,10414,10416,10418],{"class":67,"line":195},[65,10403,1947],{"class":75},[65,10405,26],{"class":82},[65,10407,595],{"class":116},[65,10409,598],{"class":75},[65,10411,90],{"class":82},[65,10413,1192],{"class":86},[65,10415,90],{"class":82},[65,10417,502],{"class":82},[65,10419,151],{"class":82},[65,10421,10422,10424,10426,10428,10430],{"class":67,"line":213},[65,10423,2048],{"class":133},[65,10425,136],{"class":82},[65,10427,83],{"class":82},[65,10429,2055],{"class":86},[65,10431,352],{"class":82},[65,10433,10434,10436,10438],{"class":67,"line":228},[65,10435,2062],{"class":82},[65,10437,514],{"class":75},[65,10439,93],{"class":82},[65,10441,10442,10444,10446],{"class":67,"line":243},[65,10443,770],{"class":82},[65,10445,1913],{"class":133},[65,10447,377],{"class":82},[28,10449,10451],{"id":10450},"_2-создайте-composable","2. Создайте composable",[56,10453,10454],{"className":3589,"code":5916,"language":3383,"meta":61,"style":61},[36,10455,10456,10460,10470,10478,10486,10494,10498,10502,10512,10520,10548,10558,10562,10566,10574,10582,10610,10614,10618,10622,10634,10656,10678,10682,10686,10700,10718,10722,10726,10740],{"__ignoreMap":61},[65,10457,10458],{"class":67,"line":68},[65,10459,5923],{"class":3272},[65,10461,10462,10464,10466,10468],{"class":67,"line":96},[65,10463,106],{"class":71},[65,10465,5930],{"class":112},[65,10467,428],{"class":139},[65,10469,151],{"class":82},[65,10471,10472,10474,10476],{"class":67,"line":103},[65,10473,435],{"class":133},[65,10475,136],{"class":82},[65,10477,3935],{"class":139},[65,10479,10480,10482,10484],{"class":67,"line":154},[65,10481,447],{"class":133},[65,10483,136],{"class":82},[65,10485,3935],{"class":139},[65,10487,10488,10490,10492],{"class":67,"line":163},[65,10489,4401],{"class":133},[65,10491,508],{"class":82},[65,10493,3935],{"class":139},[65,10495,10496],{"class":67,"line":169},[65,10497,178],{"class":82},[65,10499,10500],{"class":67,"line":181},[65,10501,100],{"emptyLinePlaceholder":99},[65,10503,10504,10506,10508,10510],{"class":67,"line":186},[65,10505,106],{"class":71},[65,10507,5930],{"class":112},[65,10509,4422],{"class":139},[65,10511,151],{"class":82},[65,10513,10514,10516,10518],{"class":67,"line":195},[65,10515,1379],{"class":133},[65,10517,136],{"class":82},[65,10519,3935],{"class":139},[65,10521,10522,10524,10526,10528,10530,10532,10534,10536,10538,10540,10542,10544,10546],{"class":67,"line":213},[65,10523,1394],{"class":133},[65,10525,508],{"class":82},[65,10527,83],{"class":82},[65,10529,638],{"class":86},[65,10531,90],{"class":82},[65,10533,4449],{"class":82},[65,10535,83],{"class":82},[65,10537,4454],{"class":86},[65,10539,90],{"class":82},[65,10541,4449],{"class":82},[65,10543,83],{"class":82},[65,10545,4463],{"class":86},[65,10547,352],{"class":82},[65,10549,10550,10552,10554,10556],{"class":67,"line":228},[65,10551,1409],{"class":133},[65,10553,136],{"class":82},[65,10555,428],{"class":139},[65,10557,6023],{"class":75},[65,10559,10560],{"class":67,"line":243},[65,10561,178],{"class":82},[65,10563,10564],{"class":67,"line":249},[65,10565,100],{"emptyLinePlaceholder":99},[65,10567,10568,10570,10572],{"class":67,"line":254},[65,10569,466],{"class":112},[65,10571,469],{"class":75},[65,10573,472],{"class":82},[65,10575,10576,10578,10580],{"class":67,"line":261},[65,10577,477],{"class":112},[65,10579,480],{"class":139},[65,10581,151],{"class":82},[65,10583,10584,10586,10588,10590,10592,10594,10596,10598,10600,10602,10604,10606,10608],{"class":67,"line":274},[65,10585,487],{"class":133},[65,10587,136],{"class":82},[65,10589,492],{"class":82},[65,10591,495],{"class":123},[65,10593,136],{"class":82},[65,10595,440],{"class":139},[65,10597,502],{"class":82},[65,10599,505],{"class":123},[65,10601,508],{"class":82},[65,10603,511],{"class":139},[65,10605,514],{"class":82},[65,10607,517],{"class":112},[65,10609,6076],{"class":139},[65,10611,10612],{"class":67,"line":288},[65,10613,527],{"class":82},[65,10615,10616],{"class":67,"line":294},[65,10617,178],{"class":82},[65,10619,10620],{"class":67,"line":303},[65,10621,100],{"emptyLinePlaceholder":99},[65,10623,10624,10626,10628,10630,10632],{"class":67,"line":309},[65,10625,106],{"class":71},[65,10627,113],{"class":112},[65,10629,4555],{"class":116},[65,10631,1969],{"class":82},[65,10633,151],{"class":82},[65,10635,10636,10638,10640,10642,10644,10646,10648,10650,10652,10654],{"class":67,"line":315},[65,10637,572],{"class":112},[65,10639,4566],{"class":75},[65,10641,578],{"class":82},[65,10643,492],{"class":82},[65,10645,4573],{"class":123},[65,10647,136],{"class":82},[65,10649,4422],{"class":139},[65,10651,514],{"class":82},[65,10653,517],{"class":112},[65,10655,151],{"class":82},[65,10657,10658,10660,10662,10664,10666,10668,10670,10672,10674,10676],{"class":67,"line":321},[65,10659,590],{"class":75},[65,10661,26],{"class":82},[65,10663,595],{"class":116},[65,10665,598],{"class":133},[65,10667,90],{"class":82},[65,10669,603],{"class":86},[65,10671,90],{"class":82},[65,10673,502],{"class":82},[65,10675,505],{"class":75},[65,10677,3571],{"class":133},[65,10679,10680],{"class":67,"line":327},[65,10681,527],{"class":82},[65,10683,10684],{"class":67,"line":355},[65,10685,100],{"emptyLinePlaceholder":99},[65,10687,10688,10690,10692,10694,10696,10698],{"class":67,"line":361},[65,10689,572],{"class":112},[65,10691,4622],{"class":75},[65,10693,578],{"class":82},[65,10695,581],{"class":82},[65,10697,517],{"class":112},[65,10699,151],{"class":82},[65,10701,10702,10704,10706,10708,10710,10712,10714,10716],{"class":67,"line":369},[65,10703,590],{"class":75},[65,10705,26],{"class":82},[65,10707,595],{"class":116},[65,10709,598],{"class":133},[65,10711,90],{"class":82},[65,10713,4645],{"class":86},[65,10715,90],{"class":82},[65,10717,3571],{"class":133},[65,10719,10720],{"class":67,"line":380},[65,10721,527],{"class":82},[65,10723,10724],{"class":67,"line":386},[65,10725,100],{"emptyLinePlaceholder":99},[65,10727,10728,10730,10732,10734,10736,10738],{"class":67,"line":394},[65,10729,157],{"class":71},[65,10731,130],{"class":82},[65,10733,4566],{"class":75},[65,10735,502],{"class":82},[65,10737,4622],{"class":75},[65,10739,6207],{"class":82},[65,10741,10742],{"class":67,"line":3566},[65,10743,178],{"class":82},[28,10745,10747],{"id":10746},"_3-создайте-компонент-виджета","3. Создайте компонент виджета",[56,10749,10751],{"className":3263,"code":10750,"language":3265,"meta":61,"style":61},"\u003C!-- components\u002FTryOnWidget.vue -->\n\u003Ctemplate>\n \u003Cdiv>\n \u003Cdiv\n id=\"widget-container\"\n style=\"width: 100%; max-width: 600px; aspect-ratio: 3\u002F4\"\n \u002F>\n \u003Cbutton @click=\"handleTryOn\">Примерка\u003C\u002Fbutton>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\nimport { useFittingWidget, type TryonItem } from '~\u002Fcomposables\u002FuseFittingWidget'\n\nconst props = defineProps\u003C{\n productName: string\n imageUrl: string\n}>()\n\nconst { open } = useFittingWidget()\n\nconst handleTryOn = () => {\n open({\n targetElementId: 'widget-container',\n model: 'balanced',\n tryonItems: [\n {\n productName: props.productName,\n url: props.imageUrl,\n },\n ],\n })\n}\n\u003C\u002Fscript>\n",[36,10752,10753,10757,10765,10773,10779,10791,10803,10807,10833,10841,10849,10853,10873,10897,10901,10913,10921,10929,10935,10939,10955,10959,10973,10981,10995,11009,11017,11021,11035,11049,11053,11059,11065,11069],{"__ignoreMap":61},[65,10754,10755],{"class":67,"line":68},[65,10756,3796],{"class":3272},[65,10758,10759,10761,10763],{"class":67,"line":96},[65,10760,1876],{"class":82},[65,10762,3280],{"class":133},[65,10764,377],{"class":82},[65,10766,10767,10769,10771],{"class":67,"line":103},[65,10768,3287],{"class":82},[65,10770,688],{"class":133},[65,10772,377],{"class":82},[65,10774,10775,10777],{"class":67,"line":154},[65,10776,910],{"class":82},[65,10778,4824],{"class":133},[65,10780,10781,10783,10785,10787,10789],{"class":67,"line":163},[65,10782,3452],{"class":112},[65,10784,201],{"class":82},[65,10786,204],{"class":82},[65,10788,621],{"class":86},[65,10790,210],{"class":82},[65,10792,10793,10795,10797,10799,10801],{"class":67,"line":169},[65,10794,6263],{"class":112},[65,10796,201],{"class":82},[65,10798,204],{"class":82},[65,10800,6270],{"class":86},[65,10802,210],{"class":82},[65,10804,10805],{"class":67,"line":181},[65,10806,6277],{"class":82},[65,10808,10809,10811,10813,10815,10817,10819,10821,10823,10825,10827,10829,10831],{"class":67,"line":186},[65,10810,910],{"class":82},[65,10812,752],{"class":133},[65,10814,3851],{"class":112},[65,10816,201],{"class":82},[65,10818,204],{"class":82},[65,10820,3858],{"class":86},[65,10822,204],{"class":82},[65,10824,3300],{"class":82},[65,10826,7655],{"class":75},[65,10828,770],{"class":82},[65,10830,752],{"class":133},[65,10832,377],{"class":82},[65,10834,10835,10837,10839],{"class":67,"line":195},[65,10836,3348],{"class":82},[65,10838,688],{"class":133},[65,10840,377],{"class":82},[65,10842,10843,10845,10847],{"class":67,"line":213},[65,10844,770],{"class":82},[65,10846,3280],{"class":133},[65,10848,377],{"class":82},[65,10850,10851],{"class":67,"line":228},[65,10852,100],{"emptyLinePlaceholder":99},[65,10854,10855,10857,10859,10861,10863,10865,10867,10869,10871],{"class":67,"line":243},[65,10856,1876],{"class":82},[65,10858,1913],{"class":133},[65,10860,3373],{"class":112},[65,10862,3376],{"class":112},[65,10864,201],{"class":82},[65,10866,204],{"class":82},[65,10868,3383],{"class":86},[65,10870,204],{"class":82},[65,10872,377],{"class":82},[65,10874,10875,10877,10879,10881,10883,10885,10887,10889,10891,10893,10895],{"class":67,"line":249},[65,10876,72],{"class":71},[65,10878,130],{"class":82},[65,10880,4555],{"class":75},[65,10882,502],{"class":82},[65,10884,6356],{"class":71},[65,10886,428],{"class":75},[65,10888,808],{"class":82},[65,10890,811],{"class":71},[65,10892,83],{"class":82},[65,10894,6367],{"class":86},[65,10896,352],{"class":82},[65,10898,10899],{"class":67,"line":254},[65,10900,100],{"emptyLinePlaceholder":99},[65,10902,10903,10905,10907,10909,10911],{"class":67,"line":261},[65,10904,3915],{"class":112},[65,10906,3918],{"class":75},[65,10908,201],{"class":82},[65,10910,3923],{"class":116},[65,10912,3926],{"class":82},[65,10914,10915,10917,10919],{"class":67,"line":274},[65,10916,435],{"class":133},[65,10918,136],{"class":82},[65,10920,3935],{"class":139},[65,10922,10923,10925,10927],{"class":67,"line":288},[65,10924,3940],{"class":133},[65,10926,136],{"class":82},[65,10928,3935],{"class":139},[65,10930,10931,10933],{"class":67,"line":294},[65,10932,764],{"class":82},[65,10934,3951],{"class":75},[65,10936,10937],{"class":67,"line":303},[65,10938,100],{"emptyLinePlaceholder":99},[65,10940,10941,10943,10945,10947,10949,10951,10953],{"class":67,"line":309},[65,10942,3915],{"class":112},[65,10944,130],{"class":82},[65,10946,6420],{"class":75},[65,10948,349],{"class":82},[65,10950,578],{"class":82},[65,10952,4555],{"class":116},[65,10954,3951],{"class":75},[65,10956,10957],{"class":67,"line":315},[65,10958,100],{"emptyLinePlaceholder":99},[65,10960,10961,10963,10965,10967,10969,10971],{"class":67,"line":321},[65,10962,3915],{"class":112},[65,10964,3962],{"class":75},[65,10966,201],{"class":82},[65,10968,581],{"class":82},[65,10970,517],{"class":112},[65,10972,151],{"class":82},[65,10974,10975,10977,10979],{"class":67,"line":327},[65,10976,6451],{"class":116},[65,10978,598],{"class":133},[65,10980,472],{"class":82},[65,10982,10983,10985,10987,10989,10991,10993],{"class":67,"line":355},[65,10984,3995],{"class":133},[65,10986,136],{"class":82},[65,10988,83],{"class":82},[65,10990,621],{"class":86},[65,10992,90],{"class":82},[65,10994,626],{"class":82},[65,10996,10997,10999,11001,11003,11005,11007],{"class":67,"line":361},[65,10998,4010],{"class":133},[65,11000,136],{"class":82},[65,11002,83],{"class":82},[65,11004,638],{"class":86},[65,11006,90],{"class":82},[65,11008,626],{"class":82},[65,11010,11011,11013,11015],{"class":67,"line":369},[65,11012,4025],{"class":133},[65,11014,136],{"class":82},[65,11016,1414],{"class":133},[65,11018,11019],{"class":67,"line":380},[65,11020,4034],{"class":82},[65,11022,11023,11025,11027,11029,11031,11033],{"class":67,"line":386},[65,11024,4039],{"class":133},[65,11026,136],{"class":82},[65,11028,4044],{"class":75},[65,11030,26],{"class":82},[65,11032,1328],{"class":75},[65,11034,626],{"class":82},[65,11036,11037,11039,11041,11043,11045,11047],{"class":67,"line":394},[65,11038,4055],{"class":133},[65,11040,136],{"class":82},[65,11042,4044],{"class":75},[65,11044,26],{"class":82},[65,11046,4064],{"class":75},[65,11048,626],{"class":82},[65,11050,11051],{"class":67,"line":3566},[65,11052,4071],{"class":82},[65,11054,11055,11057],{"class":67,"line":3574},[65,11056,4076],{"class":133},[65,11058,626],{"class":82},[65,11060,11061,11063],{"class":67,"line":5486},[65,11062,2062],{"class":82},[65,11064,3571],{"class":133},[65,11066,11067],{"class":67,"line":5495},[65,11068,178],{"class":82},[65,11070,11071,11073,11075],{"class":67,"line":5500},[65,11072,770],{"class":82},[65,11074,1913],{"class":133},[65,11076,377],{"class":82},[1089,11078,6554],{},{"title":61,"searchDepth":96,"depth":96,"links":11080},[11081,11082,11083],{"id":8788,"depth":96,"text":8789},{"id":10450,"depth":96,"text":10451},{"id":10746,"depth":96,"text":10747},"Интеграция с Vue 3 приложением",{},"\u002Fintegrations\u002Fvue",{"title":5714,"description":11084},"integrations\u002Fvue","940Q7exH9C3y9bXr_sW6skJzNNxxGlNzOBpnASqYjFU",1779283221010]