[{"data":1,"prerenderedAt":11057},["ShallowReactive",2],{"\u002Fen\u002Fintegrations\u002Fvue":3,"all-pages-\u002Fen\u002Fintegrations\u002Fvue":1051},{"id":4,"title":5,"body":6,"description":1043,"extension":1044,"icon":1045,"meta":1046,"navigation":348,"path":1047,"seo":1048,"stem":1049,"__hash__":1050},"content\u002Fen\u002Fintegrations\u002Fvue.md","Vue 3",{"type":7,"value":8,"toc":1038},"minimark",[9,14,18,23,31,278,282,647,651,1034],[10,11,13],"h1",{"id":12},"vue-3-integration","Vue 3 Integration",[15,16,17],"p",{},"Works with Vue 3 + Vite or any Vue 3 setup.",[19,20,22],"h2",{"id":21},"_1-load-the-widget-script","1. Load the Widget Script",[15,24,25,26,30],{},"In ",[27,28,29],"code",{},"index.html",":",[32,33,38],"pre",{"className":34,"code":35,"language":36,"meta":37,"style":37},"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\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","html","",[27,39,40,53,73,88,100,121,155,211,217,241,258,268],{"__ignoreMap":37},[41,42,45,49],"span",{"class":43,"line":44},"line",1,[41,46,48],{"class":47},"sMK4o","\u003C",[41,50,52],{"class":51},"swJcz","script\n",[41,54,56,60,63,66,70],{"class":43,"line":55},2,[41,57,59],{"class":58},"spNyl","  src",[41,61,62],{"class":47},"=",[41,64,65],{"class":47},"\"",[41,67,69],{"class":68},"sfazB","https:\u002F\u002Fwidget.try-on.ru\u002Ffitting-widget-bundle.js",[41,71,72],{"class":47},"\"\n",[41,74,76,79,81,83,86],{"class":43,"line":75},3,[41,77,78],{"class":58},"  id",[41,80,62],{"class":47},[41,82,65],{"class":47},[41,84,85],{"class":68},"fitting-widget-bundle",[41,87,72],{"class":47},[41,89,91,94,97],{"class":43,"line":90},4,[41,92,93],{"class":47},">\u003C\u002F",[41,95,96],{"class":51},"script",[41,98,99],{"class":47},">\n",[41,101,103,105,107,110,112,114,117,119],{"class":43,"line":102},5,[41,104,48],{"class":47},[41,106,96],{"class":51},[41,108,109],{"class":58}," id",[41,111,62],{"class":47},[41,113,65],{"class":47},[41,115,116],{"class":68},"fitting-init",[41,118,65],{"class":47},[41,120,99],{"class":47},[41,122,124,128,131,134,136,139,141,143,146,149,152],{"class":43,"line":123},6,[41,125,127],{"class":126},"sTEyZ","  window",[41,129,130],{"class":47},".",[41,132,133],{"class":126},"fitting ",[41,135,62],{"class":47},[41,137,138],{"class":126}," window",[41,140,130],{"class":47},[41,142,133],{"class":126},[41,144,145],{"class":47},"||",[41,147,148],{"class":58}," function",[41,150,151],{"class":47},"()",[41,153,154],{"class":47}," {\n",[41,156,158,161,164,166,169,171,174,177,179,181,183,185,187,190,193,195,199,202,205,208],{"class":43,"line":157},7,[41,159,160],{"class":51},"    (",[41,162,163],{"class":126},"window",[41,165,130],{"class":47},[41,167,168],{"class":126},"fitting",[41,170,130],{"class":47},[41,172,173],{"class":126},"q",[41,175,176],{"class":47}," =",[41,178,138],{"class":126},[41,180,130],{"class":47},[41,182,168],{"class":126},[41,184,130],{"class":47},[41,186,173],{"class":126},[41,188,189],{"class":47}," ||",[41,191,192],{"class":51}," [])",[41,194,130],{"class":47},[41,196,198],{"class":197},"s2Zo4","push",[41,200,201],{"class":51},"(",[41,203,204],{"class":126},"arguments",[41,206,207],{"class":51},")",[41,209,210],{"class":47},";\n",[41,212,214],{"class":43,"line":213},8,[41,215,216],{"class":47},"  };\n",[41,218,220,222,224,226,228,231,234,236,239],{"class":43,"line":219},9,[41,221,127],{"class":126},[41,223,130],{"class":47},[41,225,168],{"class":197},[41,227,201],{"class":126},[41,229,230],{"class":47},"'",[41,232,233],{"class":68},"init",[41,235,230],{"class":47},[41,237,238],{"class":47},",",[41,240,154],{"class":47},[41,242,244,247,249,252,255],{"class":43,"line":243},10,[41,245,246],{"class":51},"    apiKey",[41,248,30],{"class":47},[41,250,251],{"class":47}," '",[41,253,254],{"class":68},"YOUR_API_KEY",[41,256,257],{"class":47},"'\n",[41,259,261,264,266],{"class":43,"line":260},11,[41,262,263],{"class":47},"  }",[41,265,207],{"class":126},[41,267,210],{"class":47},[41,269,271,274,276],{"class":43,"line":270},12,[41,272,273],{"class":47},"\u003C\u002F",[41,275,96],{"class":51},[41,277,99],{"class":47},[19,279,281],{"id":280},"_2-create-a-composable","2. Create a Composable",[32,283,287],{"className":284,"code":285,"language":286,"meta":37,"style":37},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\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","ts",[27,288,289,295,310,320,329,339,344,350,361,370,403,415,419,424,436,447,485,491,496,501,515,541,567,572,577,594,614,619,624,642],{"__ignoreMap":37},[41,290,291],{"class":43,"line":44},[41,292,294],{"class":293},"sHwdD","\u002F\u002F composables\u002FuseFittingWidget.ts\n",[41,296,297,301,304,308],{"class":43,"line":55},[41,298,300],{"class":299},"s7zQu","export",[41,302,303],{"class":58}," interface",[41,305,307],{"class":306},"sBMFI"," TryonItem",[41,309,154],{"class":47},[41,311,312,315,317],{"class":43,"line":75},[41,313,314],{"class":51},"  productName",[41,316,30],{"class":47},[41,318,319],{"class":306}," string\n",[41,321,322,325,327],{"class":43,"line":90},[41,323,324],{"class":51},"  url",[41,326,30],{"class":47},[41,328,319],{"class":306},[41,330,331,334,337],{"class":43,"line":102},[41,332,333],{"class":51},"  productId",[41,335,336],{"class":47},"?:",[41,338,319],{"class":306},[41,340,341],{"class":43,"line":123},[41,342,343],{"class":47},"}\n",[41,345,346],{"class":43,"line":157},[41,347,349],{"emptyLinePlaceholder":348},true,"\n",[41,351,352,354,356,359],{"class":43,"line":213},[41,353,300],{"class":299},[41,355,303],{"class":58},[41,357,358],{"class":306}," CreateOptions",[41,360,154],{"class":47},[41,362,363,366,368],{"class":43,"line":219},[41,364,365],{"class":51},"  targetElementId",[41,367,30],{"class":47},[41,369,319],{"class":306},[41,371,372,375,377,379,382,384,387,389,392,394,396,398,401],{"class":43,"line":243},[41,373,374],{"class":51},"  model",[41,376,336],{"class":47},[41,378,251],{"class":47},[41,380,381],{"class":68},"balanced",[41,383,230],{"class":47},[41,385,386],{"class":47}," |",[41,388,251],{"class":47},[41,390,391],{"class":68},"quality",[41,393,230],{"class":47},[41,395,386],{"class":47},[41,397,251],{"class":47},[41,399,400],{"class":68},"speed",[41,402,257],{"class":47},[41,404,405,408,410,412],{"class":43,"line":260},[41,406,407],{"class":51},"  tryonItems",[41,409,30],{"class":47},[41,411,307],{"class":306},[41,413,414],{"class":126},"[]\n",[41,416,417],{"class":43,"line":270},[41,418,343],{"class":47},[41,420,422],{"class":43,"line":421},13,[41,423,349],{"emptyLinePlaceholder":348},[41,425,427,430,433],{"class":43,"line":426},14,[41,428,429],{"class":58},"declare",[41,431,432],{"class":126}," global ",[41,434,435],{"class":47},"{\n",[41,437,439,442,445],{"class":43,"line":438},15,[41,440,441],{"class":58},"  interface",[41,443,444],{"class":306}," Window",[41,446,154],{"class":47},[41,448,450,453,455,458,462,464,467,469,472,474,477,479,482],{"class":43,"line":449},16,[41,451,452],{"class":51},"    fitting",[41,454,30],{"class":47},[41,456,457],{"class":47}," (",[41,459,461],{"class":460},"sHdIc","command",[41,463,30],{"class":47},[41,465,466],{"class":306}," string",[41,468,238],{"class":47},[41,470,471],{"class":460}," options",[41,473,336],{"class":47},[41,475,476],{"class":306}," unknown",[41,478,207],{"class":47},[41,480,481],{"class":58}," =>",[41,483,484],{"class":306}," void\n",[41,486,488],{"class":43,"line":487},17,[41,489,490],{"class":47},"  }\n",[41,492,494],{"class":43,"line":493},18,[41,495,343],{"class":47},[41,497,499],{"class":43,"line":498},19,[41,500,349],{"emptyLinePlaceholder":348},[41,502,504,506,508,511,513],{"class":43,"line":503},20,[41,505,300],{"class":299},[41,507,148],{"class":58},[41,509,510],{"class":197}," useFittingWidget",[41,512,151],{"class":47},[41,514,154],{"class":47},[41,516,518,521,524,526,528,531,533,535,537,539],{"class":43,"line":517},21,[41,519,520],{"class":58},"  const",[41,522,523],{"class":126}," open",[41,525,176],{"class":47},[41,527,457],{"class":47},[41,529,530],{"class":460},"options",[41,532,30],{"class":47},[41,534,358],{"class":306},[41,536,207],{"class":47},[41,538,481],{"class":58},[41,540,154],{"class":47},[41,542,544,547,549,551,553,555,558,560,562,564],{"class":43,"line":543},22,[41,545,546],{"class":126},"    window",[41,548,130],{"class":47},[41,550,168],{"class":197},[41,552,201],{"class":51},[41,554,230],{"class":47},[41,556,557],{"class":68},"create",[41,559,230],{"class":47},[41,561,238],{"class":47},[41,563,471],{"class":126},[41,565,566],{"class":51},")\n",[41,568,570],{"class":43,"line":569},23,[41,571,490],{"class":47},[41,573,575],{"class":43,"line":574},24,[41,576,349],{"emptyLinePlaceholder":348},[41,578,580,582,585,587,590,592],{"class":43,"line":579},25,[41,581,520],{"class":58},[41,583,584],{"class":126}," close",[41,586,176],{"class":47},[41,588,589],{"class":47}," ()",[41,591,481],{"class":58},[41,593,154],{"class":47},[41,595,597,599,601,603,605,607,610,612],{"class":43,"line":596},26,[41,598,546],{"class":126},[41,600,130],{"class":47},[41,602,168],{"class":197},[41,604,201],{"class":51},[41,606,230],{"class":47},[41,608,609],{"class":68},"close",[41,611,230],{"class":47},[41,613,566],{"class":51},[41,615,617],{"class":43,"line":616},27,[41,618,490],{"class":47},[41,620,622],{"class":43,"line":621},28,[41,623,349],{"emptyLinePlaceholder":348},[41,625,627,630,633,635,637,639],{"class":43,"line":626},29,[41,628,629],{"class":299},"  return",[41,631,632],{"class":47}," {",[41,634,523],{"class":126},[41,636,238],{"class":47},[41,638,584],{"class":126},[41,640,641],{"class":47}," }\n",[41,643,645],{"class":43,"line":644},30,[41,646,343],{"class":47},[19,648,650],{"id":649},"_3-create-the-widget-component","3. Create the Widget Component",[32,652,656],{"className":653,"code":654,"language":655,"meta":37,"style":37},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\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","vue",[27,657,658,663,672,682,690,704,718,723,754,763,771,775,797,826,830,846,854,863,871,875,893,897,912,921,937,952,962,967,984,1000,1005,1013,1020,1025],{"__ignoreMap":37},[41,659,660],{"class":43,"line":44},[41,661,662],{"class":293},"\u003C!-- components\u002FTryOnWidget.vue -->\n",[41,664,665,667,670],{"class":43,"line":55},[41,666,48],{"class":47},[41,668,669],{"class":51},"template",[41,671,99],{"class":47},[41,673,674,677,680],{"class":43,"line":75},[41,675,676],{"class":47},"  \u003C",[41,678,679],{"class":51},"div",[41,681,99],{"class":47},[41,683,684,687],{"class":43,"line":90},[41,685,686],{"class":47},"    \u003C",[41,688,689],{"class":51},"div\n",[41,691,692,695,697,699,702],{"class":43,"line":102},[41,693,694],{"class":58},"      id",[41,696,62],{"class":47},[41,698,65],{"class":47},[41,700,701],{"class":68},"widget-container",[41,703,72],{"class":47},[41,705,706,709,711,713,716],{"class":43,"line":123},[41,707,708],{"class":58},"      style",[41,710,62],{"class":47},[41,712,65],{"class":47},[41,714,715],{"class":68},"width: 100%; max-width: 600px; aspect-ratio: 3\u002F4",[41,717,72],{"class":47},[41,719,720],{"class":43,"line":157},[41,721,722],{"class":47},"    \u002F>\n",[41,724,725,727,730,733,735,737,740,742,745,748,750,752],{"class":43,"line":213},[41,726,686],{"class":47},[41,728,729],{"class":51},"button",[41,731,732],{"class":58}," @click",[41,734,62],{"class":47},[41,736,65],{"class":47},[41,738,739],{"class":68},"handleTryOn",[41,741,65],{"class":47},[41,743,744],{"class":47},">",[41,746,747],{"class":126},"Try On",[41,749,273],{"class":47},[41,751,729],{"class":51},[41,753,99],{"class":47},[41,755,756,759,761],{"class":43,"line":219},[41,757,758],{"class":47},"  \u003C\u002F",[41,760,679],{"class":51},[41,762,99],{"class":47},[41,764,765,767,769],{"class":43,"line":243},[41,766,273],{"class":47},[41,768,669],{"class":51},[41,770,99],{"class":47},[41,772,773],{"class":43,"line":260},[41,774,349],{"emptyLinePlaceholder":348},[41,776,777,779,781,784,787,789,791,793,795],{"class":43,"line":270},[41,778,48],{"class":47},[41,780,96],{"class":51},[41,782,783],{"class":58}," setup",[41,785,786],{"class":58}," lang",[41,788,62],{"class":47},[41,790,65],{"class":47},[41,792,286],{"class":68},[41,794,65],{"class":47},[41,796,99],{"class":47},[41,798,799,802,804,806,808,811,813,816,819,821,824],{"class":43,"line":421},[41,800,801],{"class":299},"import",[41,803,632],{"class":47},[41,805,510],{"class":126},[41,807,238],{"class":47},[41,809,810],{"class":299}," type",[41,812,307],{"class":126},[41,814,815],{"class":47}," }",[41,817,818],{"class":299}," from",[41,820,251],{"class":47},[41,822,823],{"class":68},"~\u002Fcomposables\u002FuseFittingWidget",[41,825,257],{"class":47},[41,827,828],{"class":43,"line":426},[41,829,349],{"emptyLinePlaceholder":348},[41,831,832,835,838,840,843],{"class":43,"line":438},[41,833,834],{"class":58},"const",[41,836,837],{"class":126}," props ",[41,839,62],{"class":47},[41,841,842],{"class":197}," defineProps",[41,844,845],{"class":47},"\u003C{\n",[41,847,848,850,852],{"class":43,"line":449},[41,849,314],{"class":51},[41,851,30],{"class":47},[41,853,319],{"class":306},[41,855,856,859,861],{"class":43,"line":487},[41,857,858],{"class":51},"  imageUrl",[41,860,30],{"class":47},[41,862,319],{"class":306},[41,864,865,868],{"class":43,"line":493},[41,866,867],{"class":47},"}>",[41,869,870],{"class":126},"()\n",[41,872,873],{"class":43,"line":498},[41,874,349],{"emptyLinePlaceholder":348},[41,876,877,879,881,884,887,889,891],{"class":43,"line":503},[41,878,834],{"class":58},[41,880,632],{"class":47},[41,882,883],{"class":126}," open ",[41,885,886],{"class":47},"}",[41,888,176],{"class":47},[41,890,510],{"class":197},[41,892,870],{"class":126},[41,894,895],{"class":43,"line":517},[41,896,349],{"emptyLinePlaceholder":348},[41,898,899,901,904,906,908,910],{"class":43,"line":543},[41,900,834],{"class":58},[41,902,903],{"class":126}," handleTryOn ",[41,905,62],{"class":47},[41,907,589],{"class":47},[41,909,481],{"class":58},[41,911,154],{"class":47},[41,913,914,917,919],{"class":43,"line":569},[41,915,916],{"class":197},"  open",[41,918,201],{"class":51},[41,920,435],{"class":47},[41,922,923,926,928,930,932,934],{"class":43,"line":574},[41,924,925],{"class":51},"    targetElementId",[41,927,30],{"class":47},[41,929,251],{"class":47},[41,931,701],{"class":68},[41,933,230],{"class":47},[41,935,936],{"class":47},",\n",[41,938,939,942,944,946,948,950],{"class":43,"line":579},[41,940,941],{"class":51},"    model",[41,943,30],{"class":47},[41,945,251],{"class":47},[41,947,381],{"class":68},[41,949,230],{"class":47},[41,951,936],{"class":47},[41,953,954,957,959],{"class":43,"line":596},[41,955,956],{"class":51},"    tryonItems",[41,958,30],{"class":47},[41,960,961],{"class":51}," [\n",[41,963,964],{"class":43,"line":616},[41,965,966],{"class":47},"      {\n",[41,968,969,972,974,977,979,982],{"class":43,"line":621},[41,970,971],{"class":51},"        productName",[41,973,30],{"class":47},[41,975,976],{"class":126}," props",[41,978,130],{"class":47},[41,980,981],{"class":126},"productName",[41,983,936],{"class":47},[41,985,986,989,991,993,995,998],{"class":43,"line":626},[41,987,988],{"class":51},"        url",[41,990,30],{"class":47},[41,992,976],{"class":126},[41,994,130],{"class":47},[41,996,997],{"class":126},"imageUrl",[41,999,936],{"class":47},[41,1001,1002],{"class":43,"line":644},[41,1003,1004],{"class":47},"      },\n",[41,1006,1008,1011],{"class":43,"line":1007},31,[41,1009,1010],{"class":51},"    ]",[41,1012,936],{"class":47},[41,1014,1016,1018],{"class":43,"line":1015},32,[41,1017,263],{"class":47},[41,1019,566],{"class":51},[41,1021,1023],{"class":43,"line":1022},33,[41,1024,343],{"class":47},[41,1026,1028,1030,1032],{"class":43,"line":1027},34,[41,1029,273],{"class":47},[41,1031,96],{"class":51},[41,1033,99],{"class":47},[1035,1036,1037],"style",{},"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":37,"searchDepth":55,"depth":55,"links":1039},[1040,1041,1042],{"id":21,"depth":55,"text":22},{"id":280,"depth":55,"text":281},{"id":649,"depth":55,"text":650},"Integrate with a Vue 3 application","md","i-lucide-venetian-mask",{},"\u002Fen\u002Fintegrations\u002Fvue",{"title":5,"description":1043},"en\u002Fintegrations\u002Fvue","GShiJEM5AAOgyg7U0MXXp-Lqn_Y-1BooZA_uvPnVwT0",[1052,1424,1760,2196,2287,3280,4153,5033,5710,6534,6951,7038,7921,8742,9591,10219],{"id":1053,"title":1054,"body":1055,"description":1417,"extension":1044,"icon":1418,"meta":1419,"navigation":348,"path":1420,"seo":1421,"stem":1422,"__hash__":1423},"content\u002Fapi\u002Findex.md","Справочник API",{"type":7,"value":1056,"toc":1411},[1057,1060,1064,1067,1112,1163,1166,1170,1173,1243,1248,1290,1408],[10,1058,1054],{"id":1059},"справочник-api",[19,1061,1063],{"id":1062},"windowfittinginit-options","window.fitting('init', options)",[15,1065,1066],{},"Инициализирует виджет. Вызывается один раз, до всех остальных методов.",[1068,1069,1070,1090],"table",{},[1071,1072,1073],"thead",{},[1074,1075,1076,1080,1083,1087],"tr",{},[1077,1078,1079],"th",{},"Параметр",[1077,1081,1082],{},"Тип",[1077,1084,1086],{"align":1085},"center","Обязателен",[1077,1088,1089],{},"Описание",[1091,1092,1093],"tbody",{},[1074,1094,1095,1101,1106,1109],{},[1096,1097,1098],"td",{},[27,1099,1100],{},"apiKey",[1096,1102,1103],{},[27,1104,1105],{},"string",[1096,1107,1108],{"align":1085},"Да",[1096,1110,1111],{},"Ваш API-ключ виджета",[32,1113,1117],{"className":1114,"code":1115,"language":1116,"meta":37,"style":37},"language-js shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","window.fitting('init', {\n  apiKey: 'pk_live_xxx',\n});\n","js",[27,1118,1119,1139,1155],{"__ignoreMap":37},[41,1120,1121,1123,1125,1127,1129,1131,1133,1135,1137],{"class":43,"line":44},[41,1122,163],{"class":126},[41,1124,130],{"class":47},[41,1126,168],{"class":197},[41,1128,201],{"class":126},[41,1130,230],{"class":47},[41,1132,233],{"class":68},[41,1134,230],{"class":47},[41,1136,238],{"class":47},[41,1138,154],{"class":47},[41,1140,1141,1144,1146,1148,1151,1153],{"class":43,"line":55},[41,1142,1143],{"class":51},"  apiKey",[41,1145,30],{"class":47},[41,1147,251],{"class":47},[41,1149,1150],{"class":68},"pk_live_xxx",[41,1152,230],{"class":47},[41,1154,936],{"class":47},[41,1156,1157,1159,1161],{"class":43,"line":75},[41,1158,886],{"class":47},[41,1160,207],{"class":126},[41,1162,210],{"class":47},[1164,1165],"hr",{},[19,1167,1169],{"id":1168},"windowfittingcreate-options","window.fitting('create', options)",[15,1171,1172],{},"Запускает виртуальную примерку.",[1068,1174,1175,1187],{},[1071,1176,1177],{},[1074,1178,1179,1181,1183,1185],{},[1077,1180,1079],{},[1077,1182,1082],{},[1077,1184,1086],{"align":1085},[1077,1186,1089],{},[1091,1188,1189,1205,1222],{},[1074,1190,1191,1196,1200,1202],{},[1096,1192,1193],{},[27,1194,1195],{},"targetElementId",[1096,1197,1198],{},[27,1199,1105],{},[1096,1201,1108],{"align":1085},[1096,1203,1204],{},"ID контейнера, в котором отображается виджет",[1074,1206,1207,1212,1217,1219],{},[1096,1208,1209],{},[27,1210,1211],{},"tryonItems",[1096,1213,1214],{},[27,1215,1216],{},"TryonItem[]",[1096,1218,1108],{"align":1085},[1096,1220,1221],{},"Массив товаров, доступных для примерки",[1074,1223,1224,1229,1234,1237],{},[1096,1225,1226],{},[27,1227,1228],{},"model",[1096,1230,1231],{},[27,1232,1233],{},"'balanced' | 'quality' | 'performance'",[1096,1235,1236],{"align":1085},"Нет",[1096,1238,1239,1240,207],{},"Режим отрисовки (по умолчанию: ",[27,1241,1242],{},"'balanced'",[1244,1245,1247],"h3",{"id":1246},"tryonitem","TryonItem",[1068,1249,1250,1261],{},[1071,1251,1252],{},[1074,1253,1254,1257,1259],{},[1077,1255,1256],{},"Поле",[1077,1258,1082],{},[1077,1260,1089],{},[1091,1262,1263,1276],{},[1074,1264,1265,1269,1273],{},[1096,1266,1267],{},[27,1268,981],{},[1096,1270,1271],{},[27,1272,1105],{},[1096,1274,1275],{},"Отображаемое название товара",[1074,1277,1278,1283,1287],{},[1096,1279,1280],{},[27,1281,1282],{},"url",[1096,1284,1285],{},[27,1286,1105],{},[1096,1288,1289],{},"Полный URL изображения товара",[32,1291,1293],{"className":1114,"code":1292,"language":1116,"meta":37,"style":37},"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",[27,1294,1295,1315,1329,1343,1351,1356,1372,1388,1393,1400],{"__ignoreMap":37},[41,1296,1297,1299,1301,1303,1305,1307,1309,1311,1313],{"class":43,"line":44},[41,1298,163],{"class":126},[41,1300,130],{"class":47},[41,1302,168],{"class":197},[41,1304,201],{"class":126},[41,1306,230],{"class":47},[41,1308,557],{"class":68},[41,1310,230],{"class":47},[41,1312,238],{"class":47},[41,1314,154],{"class":47},[41,1316,1317,1319,1321,1323,1325,1327],{"class":43,"line":55},[41,1318,365],{"class":51},[41,1320,30],{"class":47},[41,1322,251],{"class":47},[41,1324,701],{"class":68},[41,1326,230],{"class":47},[41,1328,936],{"class":47},[41,1330,1331,1333,1335,1337,1339,1341],{"class":43,"line":75},[41,1332,374],{"class":51},[41,1334,30],{"class":47},[41,1336,251],{"class":47},[41,1338,381],{"class":68},[41,1340,230],{"class":47},[41,1342,936],{"class":47},[41,1344,1345,1347,1349],{"class":43,"line":90},[41,1346,407],{"class":51},[41,1348,30],{"class":47},[41,1350,961],{"class":126},[41,1352,1353],{"class":43,"line":102},[41,1354,1355],{"class":47},"    {\n",[41,1357,1358,1361,1363,1365,1368,1370],{"class":43,"line":123},[41,1359,1360],{"class":51},"      productName",[41,1362,30],{"class":47},[41,1364,251],{"class":47},[41,1366,1367],{"class":68},"Джинсовая куртка",[41,1369,230],{"class":47},[41,1371,936],{"class":47},[41,1373,1374,1377,1379,1381,1384,1386],{"class":43,"line":157},[41,1375,1376],{"class":51},"      url",[41,1378,30],{"class":47},[41,1380,251],{"class":47},[41,1382,1383],{"class":68},"https:\u002F\u002Fexample.com\u002Fjacket.png",[41,1385,230],{"class":47},[41,1387,936],{"class":47},[41,1389,1390],{"class":43,"line":213},[41,1391,1392],{"class":47},"    },\n",[41,1394,1395,1398],{"class":43,"line":219},[41,1396,1397],{"class":126},"  ]",[41,1399,936],{"class":47},[41,1401,1402,1404,1406],{"class":43,"line":243},[41,1403,886],{"class":47},[41,1405,207],{"class":126},[41,1407,210],{"class":47},[1035,1409,1410],{},"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":37,"searchDepth":55,"depth":55,"links":1412},[1413,1414],{"id":1062,"depth":55,"text":1063},{"id":1168,"depth":55,"text":1169,"children":1415},[1416],{"id":1246,"depth":75,"text":1247},"Полный справочник по API Fitting Widget","i-lucide-code",{},"\u002Fapi",{"title":1054,"description":1417},"api\u002Findex","nBz9Z0BX1B-BPJzD-HVF5oHrejoQd0__hLi-_PGCmvk",{"id":1425,"title":1426,"body":1427,"description":1754,"extension":1044,"icon":1418,"meta":1755,"navigation":348,"path":1756,"seo":1757,"stem":1758,"__hash__":1759},"content\u002Fen\u002Fapi\u002Findex.md","API Reference",{"type":7,"value":1428,"toc":1748},[1429,1432,1434,1437,1473,1519,1521,1523,1526,1591,1593,1634,1746],[10,1430,1426],{"id":1431},"api-reference",[19,1433,1063],{"id":1062},[15,1435,1436],{},"Initializes the widget. Call this once, before any other methods.",[1068,1438,1439,1455],{},[1071,1440,1441],{},[1074,1442,1443,1446,1449,1452],{},[1077,1444,1445],{},"Parameter",[1077,1447,1448],{},"Type",[1077,1450,1451],{"align":1085},"Required",[1077,1453,1454],{},"Description",[1091,1456,1457],{},[1074,1458,1459,1463,1467,1470],{},[1096,1460,1461],{},[27,1462,1100],{},[1096,1464,1465],{},[27,1466,1105],{},[1096,1468,1469],{"align":1085},"Yes",[1096,1471,1472],{},"Your widget API key",[32,1474,1475],{"className":1114,"code":1115,"language":1116,"meta":37,"style":37},[27,1476,1477,1497,1511],{"__ignoreMap":37},[41,1478,1479,1481,1483,1485,1487,1489,1491,1493,1495],{"class":43,"line":44},[41,1480,163],{"class":126},[41,1482,130],{"class":47},[41,1484,168],{"class":197},[41,1486,201],{"class":126},[41,1488,230],{"class":47},[41,1490,233],{"class":68},[41,1492,230],{"class":47},[41,1494,238],{"class":47},[41,1496,154],{"class":47},[41,1498,1499,1501,1503,1505,1507,1509],{"class":43,"line":55},[41,1500,1143],{"class":51},[41,1502,30],{"class":47},[41,1504,251],{"class":47},[41,1506,1150],{"class":68},[41,1508,230],{"class":47},[41,1510,936],{"class":47},[41,1512,1513,1515,1517],{"class":43,"line":75},[41,1514,886],{"class":47},[41,1516,207],{"class":126},[41,1518,210],{"class":47},[1164,1520],{},[19,1522,1169],{"id":1168},[15,1524,1525],{},"Opens the virtual try-on experience.",[1068,1527,1528,1540],{},[1071,1529,1530],{},[1074,1531,1532,1534,1536,1538],{},[1077,1533,1445],{},[1077,1535,1448],{},[1077,1537,1451],{"align":1085},[1077,1539,1454],{},[1091,1541,1542,1557,1572],{},[1074,1543,1544,1548,1552,1554],{},[1096,1545,1546],{},[27,1547,1195],{},[1096,1549,1550],{},[27,1551,1105],{},[1096,1553,1469],{"align":1085},[1096,1555,1556],{},"ID of the container element where the widget renders",[1074,1558,1559,1563,1567,1569],{},[1096,1560,1561],{},[27,1562,1211],{},[1096,1564,1565],{},[27,1566,1216],{},[1096,1568,1469],{"align":1085},[1096,1570,1571],{},"Array of items available for try-on",[1074,1573,1574,1578,1583,1586],{},[1096,1575,1576],{},[27,1577,1228],{},[1096,1579,1580],{},[27,1581,1582],{},"'balanced' | 'quality' | 'speed'",[1096,1584,1585],{"align":1085},"No",[1096,1587,1588,1589,207],{},"Rendering model (default: ",[27,1590,1242],{},[1244,1592,1247],{"id":1246},[1068,1594,1595,1606],{},[1071,1596,1597],{},[1074,1598,1599,1602,1604],{},[1077,1600,1601],{},"Field",[1077,1603,1448],{},[1077,1605,1454],{},[1091,1607,1608,1621],{},[1074,1609,1610,1614,1618],{},[1096,1611,1612],{},[27,1613,981],{},[1096,1615,1616],{},[27,1617,1105],{},[1096,1619,1620],{},"Display name of the garment",[1074,1622,1623,1627,1631],{},[1096,1624,1625],{},[27,1626,1282],{},[1096,1628,1629],{},[27,1630,1105],{},[1096,1632,1633],{},"Full URL to the garment image",[32,1635,1637],{"className":1114,"code":1636,"language":1116,"meta":37,"style":37},"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",[27,1638,1639,1659,1673,1687,1695,1699,1714,1728,1732,1738],{"__ignoreMap":37},[41,1640,1641,1643,1645,1647,1649,1651,1653,1655,1657],{"class":43,"line":44},[41,1642,163],{"class":126},[41,1644,130],{"class":47},[41,1646,168],{"class":197},[41,1648,201],{"class":126},[41,1650,230],{"class":47},[41,1652,557],{"class":68},[41,1654,230],{"class":47},[41,1656,238],{"class":47},[41,1658,154],{"class":47},[41,1660,1661,1663,1665,1667,1669,1671],{"class":43,"line":55},[41,1662,365],{"class":51},[41,1664,30],{"class":47},[41,1666,251],{"class":47},[41,1668,701],{"class":68},[41,1670,230],{"class":47},[41,1672,936],{"class":47},[41,1674,1675,1677,1679,1681,1683,1685],{"class":43,"line":75},[41,1676,374],{"class":51},[41,1678,30],{"class":47},[41,1680,251],{"class":47},[41,1682,381],{"class":68},[41,1684,230],{"class":47},[41,1686,936],{"class":47},[41,1688,1689,1691,1693],{"class":43,"line":90},[41,1690,407],{"class":51},[41,1692,30],{"class":47},[41,1694,961],{"class":126},[41,1696,1697],{"class":43,"line":102},[41,1698,1355],{"class":47},[41,1700,1701,1703,1705,1707,1710,1712],{"class":43,"line":123},[41,1702,1360],{"class":51},[41,1704,30],{"class":47},[41,1706,251],{"class":47},[41,1708,1709],{"class":68},"Denim Jacket",[41,1711,230],{"class":47},[41,1713,936],{"class":47},[41,1715,1716,1718,1720,1722,1724,1726],{"class":43,"line":157},[41,1717,1376],{"class":51},[41,1719,30],{"class":47},[41,1721,251],{"class":47},[41,1723,1383],{"class":68},[41,1725,230],{"class":47},[41,1727,936],{"class":47},[41,1729,1730],{"class":43,"line":213},[41,1731,1392],{"class":47},[41,1733,1734,1736],{"class":43,"line":219},[41,1735,1397],{"class":126},[41,1737,936],{"class":47},[41,1739,1740,1742,1744],{"class":43,"line":243},[41,1741,886],{"class":47},[41,1743,207],{"class":126},[41,1745,210],{"class":47},[1035,1747,1410],{},{"title":37,"searchDepth":55,"depth":55,"links":1749},[1750,1751],{"id":1062,"depth":55,"text":1063},{"id":1168,"depth":55,"text":1169,"children":1752},[1753],{"id":1246,"depth":75,"text":1247},"Complete reference for the Fitting Widget API",{},"\u002Fen\u002Fapi",{"title":1426,"description":1754},"en\u002Fapi\u002Findex","5vrf4TtfB7Sr4MpfgLzStW-oF0xDBiShwkqA4UFzgA0",{"id":1761,"title":1762,"body":1763,"description":2189,"extension":1044,"icon":2190,"meta":2191,"navigation":348,"path":2192,"seo":2193,"stem":2194,"__hash__":2195},"content\u002Fen\u002Fgetting-started\u002Fquick-start.md","Quick Start",{"type":7,"value":1764,"toc":2180},[1765,1768,1771,1775,1786,1790,1801,1844,1848,1989,1993,2000,2027,2031,2037,2150,2154,2157,2161,2177],[10,1766,1762],{"id":1767},"quick-start",[15,1769,1770],{},"Follow these steps to add virtual try-on to your e-commerce site.",[19,1772,1774],{"id":1773},"_1-get-your-api-key","1. Get Your API Key",[15,1776,1777,1778,1785],{},"Sign up at ",[1779,1780,1784],"a",{"href":1781,"rel":1782},"https:\u002F\u002Fwidget.try-on.ru",[1783],"nofollow","widget.try-on.ru"," to obtain your free API key.",[19,1787,1789],{"id":1788},"_2-load-the-widget-script","2. Load the Widget Script",[15,1791,1792,1793,1796,1797,1800],{},"Add the following ",[27,1794,1795],{},"\u003Cscript>"," tag to your page, ideally right before the closing ",[27,1798,1799],{},"\u003C\u002Fbody>"," tag:",[32,1802,1804],{"className":34,"code":1803,"language":36,"meta":37,"style":37},"\u003Cscript\n  src=\"https:\u002F\u002Fwidget.try-on.ru\u002Ffitting-widget-bundle.js\"\n  id=\"fitting-widget-bundle\"\n>\u003C\u002Fscript>\n",[27,1805,1806,1812,1824,1836],{"__ignoreMap":37},[41,1807,1808,1810],{"class":43,"line":44},[41,1809,48],{"class":47},[41,1811,52],{"class":51},[41,1813,1814,1816,1818,1820,1822],{"class":43,"line":55},[41,1815,59],{"class":58},[41,1817,62],{"class":47},[41,1819,65],{"class":47},[41,1821,69],{"class":68},[41,1823,72],{"class":47},[41,1825,1826,1828,1830,1832,1834],{"class":43,"line":75},[41,1827,78],{"class":58},[41,1829,62],{"class":47},[41,1831,65],{"class":47},[41,1833,85],{"class":68},[41,1835,72],{"class":47},[41,1837,1838,1840,1842],{"class":43,"line":90},[41,1839,93],{"class":47},[41,1841,96],{"class":51},[41,1843,99],{"class":47},[19,1845,1847],{"id":1846},"_3-initialize-the-widget","3. Initialize the Widget",[32,1849,1851],{"className":34,"code":1850,"language":36,"meta":37,"style":37},"\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",[27,1852,1853,1871,1895,1937,1941,1961,1973,1981],{"__ignoreMap":37},[41,1854,1855,1857,1859,1861,1863,1865,1867,1869],{"class":43,"line":44},[41,1856,48],{"class":47},[41,1858,96],{"class":51},[41,1860,109],{"class":58},[41,1862,62],{"class":47},[41,1864,65],{"class":47},[41,1866,116],{"class":68},[41,1868,65],{"class":47},[41,1870,99],{"class":47},[41,1872,1873,1875,1877,1879,1881,1883,1885,1887,1889,1891,1893],{"class":43,"line":55},[41,1874,127],{"class":126},[41,1876,130],{"class":47},[41,1878,133],{"class":126},[41,1880,62],{"class":47},[41,1882,138],{"class":126},[41,1884,130],{"class":47},[41,1886,133],{"class":126},[41,1888,145],{"class":47},[41,1890,148],{"class":58},[41,1892,151],{"class":47},[41,1894,154],{"class":47},[41,1896,1897,1899,1901,1903,1905,1907,1909,1911,1913,1915,1917,1919,1921,1923,1925,1927,1929,1931,1933,1935],{"class":43,"line":75},[41,1898,160],{"class":51},[41,1900,163],{"class":126},[41,1902,130],{"class":47},[41,1904,168],{"class":126},[41,1906,130],{"class":47},[41,1908,173],{"class":126},[41,1910,176],{"class":47},[41,1912,138],{"class":126},[41,1914,130],{"class":47},[41,1916,168],{"class":126},[41,1918,130],{"class":47},[41,1920,173],{"class":126},[41,1922,189],{"class":47},[41,1924,192],{"class":51},[41,1926,130],{"class":47},[41,1928,198],{"class":197},[41,1930,201],{"class":51},[41,1932,204],{"class":126},[41,1934,207],{"class":51},[41,1936,210],{"class":47},[41,1938,1939],{"class":43,"line":90},[41,1940,216],{"class":47},[41,1942,1943,1945,1947,1949,1951,1953,1955,1957,1959],{"class":43,"line":102},[41,1944,127],{"class":126},[41,1946,130],{"class":47},[41,1948,168],{"class":197},[41,1950,201],{"class":126},[41,1952,230],{"class":47},[41,1954,233],{"class":68},[41,1956,230],{"class":47},[41,1958,238],{"class":47},[41,1960,154],{"class":47},[41,1962,1963,1965,1967,1969,1971],{"class":43,"line":123},[41,1964,246],{"class":51},[41,1966,30],{"class":47},[41,1968,251],{"class":47},[41,1970,254],{"class":68},[41,1972,257],{"class":47},[41,1974,1975,1977,1979],{"class":43,"line":157},[41,1976,263],{"class":47},[41,1978,207],{"class":126},[41,1980,210],{"class":47},[41,1982,1983,1985,1987],{"class":43,"line":213},[41,1984,273],{"class":47},[41,1986,96],{"class":51},[41,1988,99],{"class":47},[19,1990,1992],{"id":1991},"_4-add-a-container","4. Add a Container",[15,1994,1995,1996,1999],{},"Place a ",[27,1997,1998],{},"\u003Cdiv>"," wherever you want the widget to appear:",[32,2001,2003],{"className":34,"code":2002,"language":36,"meta":37,"style":37},"\u003Cdiv id=\"widget-container\">\u003C\u002Fdiv>\n",[27,2004,2005],{"__ignoreMap":37},[41,2006,2007,2009,2011,2013,2015,2017,2019,2021,2023,2025],{"class":43,"line":44},[41,2008,48],{"class":47},[41,2010,679],{"class":51},[41,2012,109],{"class":58},[41,2014,62],{"class":47},[41,2016,65],{"class":47},[41,2018,701],{"class":68},[41,2020,65],{"class":47},[41,2022,93],{"class":47},[41,2024,679],{"class":51},[41,2026,99],{"class":47},[19,2028,2030],{"id":2029},"_5-launch-the-widget","5. Launch the Widget",[15,2032,2033,2034,2036],{},"Call the ",[27,2035,557],{}," method when the user clicks a button:",[32,2038,2040],{"className":1114,"code":2039,"language":1116,"meta":37,"style":37},"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",[27,2041,2042,2062,2076,2090,2098,2102,2117,2132,2136,2142],{"__ignoreMap":37},[41,2043,2044,2046,2048,2050,2052,2054,2056,2058,2060],{"class":43,"line":44},[41,2045,163],{"class":126},[41,2047,130],{"class":47},[41,2049,168],{"class":197},[41,2051,201],{"class":126},[41,2053,230],{"class":47},[41,2055,557],{"class":68},[41,2057,230],{"class":47},[41,2059,238],{"class":47},[41,2061,154],{"class":47},[41,2063,2064,2066,2068,2070,2072,2074],{"class":43,"line":55},[41,2065,365],{"class":51},[41,2067,30],{"class":47},[41,2069,251],{"class":47},[41,2071,701],{"class":68},[41,2073,230],{"class":47},[41,2075,936],{"class":47},[41,2077,2078,2080,2082,2084,2086,2088],{"class":43,"line":75},[41,2079,374],{"class":51},[41,2081,30],{"class":47},[41,2083,251],{"class":47},[41,2085,381],{"class":68},[41,2087,230],{"class":47},[41,2089,936],{"class":47},[41,2091,2092,2094,2096],{"class":43,"line":90},[41,2093,407],{"class":51},[41,2095,30],{"class":47},[41,2097,961],{"class":126},[41,2099,2100],{"class":43,"line":102},[41,2101,1355],{"class":47},[41,2103,2104,2106,2108,2110,2113,2115],{"class":43,"line":123},[41,2105,1360],{"class":51},[41,2107,30],{"class":47},[41,2109,251],{"class":47},[41,2111,2112],{"class":68},"Classic Denim Jacket",[41,2114,230],{"class":47},[41,2116,936],{"class":47},[41,2118,2119,2121,2123,2125,2128,2130],{"class":43,"line":157},[41,2120,1376],{"class":51},[41,2122,30],{"class":47},[41,2124,251],{"class":47},[41,2126,2127],{"class":68},"https:\u002F\u002Fyour-store.com\u002Fimages\u002Fjacket.jpg",[41,2129,230],{"class":47},[41,2131,936],{"class":47},[41,2133,2134],{"class":43,"line":213},[41,2135,1392],{"class":47},[41,2137,2138,2140],{"class":43,"line":219},[41,2139,1397],{"class":126},[41,2141,936],{"class":47},[41,2143,2144,2146,2148],{"class":43,"line":243},[41,2145,886],{"class":47},[41,2147,207],{"class":126},[41,2149,210],{"class":47},[19,2151,2153],{"id":2152},"result","Result",[15,2155,2156],{},"Your customers can now upload a photo and see the garment on them instantly.",[19,2158,2160],{"id":2159},"next-steps","Next Steps",[2162,2163,2164,2172],"ul",{},[2165,2166,2167,2168,130],"li",{},"See framework-specific guides under ",[1779,2169,2171],{"href":2170},"\u002Fintegrations\u002Fvanilla-js","Integrations",[2165,2173,2174,2175,130],{},"Explore the full ",[1779,2176,1426],{"href":1420},[1035,2178,2179],{},"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":37,"searchDepth":55,"depth":55,"links":2181},[2182,2183,2184,2185,2186,2187,2188],{"id":1773,"depth":55,"text":1774},{"id":1788,"depth":55,"text":1789},{"id":1846,"depth":55,"text":1847},{"id":1991,"depth":55,"text":1992},{"id":2029,"depth":55,"text":2030},{"id":2152,"depth":55,"text":2153},{"id":2159,"depth":55,"text":2160},"Get the Fitting Widget running in minutes","i-lucide-rocket",{},"\u002Fen\u002Fgetting-started\u002Fquick-start",{"title":1762,"description":2189},"en\u002Fgetting-started\u002Fquick-start","Cy6rzr6z6R2nhbEqOeB18fbbe2pOjXOk0inGXqhKfHg",{"id":2197,"title":2198,"body":2199,"description":2280,"extension":1044,"icon":2281,"meta":2282,"navigation":348,"path":2283,"seo":2284,"stem":2285,"__hash__":2286},"content\u002Fen\u002Findex.md","Introduction",{"type":7,"value":2200,"toc":2275},[2201,2205,2213,2217,2243,2247,2266,2268],[10,2202,2204],{"id":2203},"fitting-widget-virtual-try-on","Fitting Widget — Virtual Try-On",[15,2206,2207,2208,2212],{},"The ",[2209,2210,2211],"strong",{},"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.",[19,2214,2216],{"id":2215},"key-features","Key Features",[2162,2218,2219,2225,2231,2237],{},[2165,2220,2221,2224],{},[2209,2222,2223],{},"Quick Integration"," — Add one script tag and a few lines of code.",[2165,2226,2227,2230],{},[2209,2228,2229],{},"Framework-Agnostic"," — Works with Vanilla JS, React, Vue, Next.js, Nuxt, and more.",[2165,2232,2233,2236],{},[2209,2234,2235],{},"Customizable"," — Style the widget to match your brand.",[2165,2238,2239,2242],{},[2209,2240,2241],{},"Lightweight"," — Optimized loading; won't slow down your store.",[19,2244,2246],{"id":2245},"how-it-works","How It Works",[2248,2249,2250,2253,2256,2263],"ol",{},[2165,2251,2252],{},"Load the widget script on your page.",[2165,2254,2255],{},"Initialize with your API key.",[2165,2257,2258,2259,2262],{},"Call ",[27,2260,2261],{},"window.fitting('create', { ... })"," with product image URLs.",[2165,2264,2265],{},"The widget renders inside a container element of your choice.",[19,2267,1762],{"id":1767},[15,2269,2270,2271,2274],{},"Head over to the ",[1779,2272,1762],{"href":2273},"\u002Fgetting-started\u002Fquick-start"," guide to get up and running in under 5 minutes.",{"title":37,"searchDepth":55,"depth":55,"links":2276},[2277,2278,2279],{"id":2215,"depth":55,"text":2216},{"id":2245,"depth":55,"text":2246},{"id":1767,"depth":55,"text":1762},"What is the Fitting Widget and why use it?","i-lucide-sparkles",{},"\u002Fen",{"title":2198,"description":2280},"en\u002Findex","zjI3aBTZ8Y2iRdmkieXP4q0o6PKbIjE5hUkB6Y1ledA",{"id":2288,"title":2289,"body":2290,"description":3273,"extension":1044,"icon":3274,"meta":3275,"navigation":348,"path":3276,"seo":3277,"stem":3278,"__hash__":3279},"content\u002Fen\u002Fintegrations\u002Fnextjs.md","Next.js",{"type":7,"value":2291,"toc":3264},[2292,2296,2306,2310,2320,2331,2609,2613,2965,2969,3235,3239,3245,3261],[10,2293,2295],{"id":2294},"nextjs-integration","Next.js Integration",[15,2297,2298,2299,2302,2303,130],{},"The Fitting Widget works with both the ",[2209,2300,2301],{},"Pages Router"," and ",[2209,2304,2305],{},"App Router",[19,2307,2309],{"id":2308},"app-router-recommended","App Router (Recommended)",[15,2311,2312,2313,2316,2317,130],{},"Use the Next.js ",[27,2314,2315],{},"Script"," component with ",[27,2318,2319],{},"strategy=\"afterInteractive\"",[1244,2321,2323,2324,2327,2328],{"id":2322},"step-1-load-scripts-in-layouttsx-or-pagetsx","Step 1 — Load Scripts in ",[27,2325,2326],{},"layout.tsx"," or ",[27,2329,2330],{},"page.tsx",[32,2332,2336],{"className":2333,"code":2334,"language":2335,"meta":37,"style":37},"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",[27,2337,2338,2357,2361,2401,2408,2413,2423,2427,2435,2448,2462,2475,2480,2484,2490,2502,2514,2519,2527,2532,2537,2542,2547,2572,2577,2584,2593,2598,2605],{"__ignoreMap":37},[41,2339,2340,2342,2345,2348,2350,2353,2355],{"class":43,"line":44},[41,2341,801],{"class":299},[41,2343,2344],{"class":126}," Script ",[41,2346,2347],{"class":299},"from",[41,2349,251],{"class":47},[41,2351,2352],{"class":68},"next\u002Fscript",[41,2354,230],{"class":47},[41,2356,210],{"class":47},[41,2358,2359],{"class":43,"line":55},[41,2360,349],{"emptyLinePlaceholder":348},[41,2362,2363,2365,2368,2370,2373,2376,2379,2382,2384,2386,2388,2391,2393,2396,2399],{"class":43,"line":75},[41,2364,300],{"class":299},[41,2366,2367],{"class":299}," default",[41,2369,148],{"class":58},[41,2371,2372],{"class":197}," ProductLayout",[41,2374,2375],{"class":47},"({",[41,2377,2378],{"class":460}," children",[41,2380,2381],{"class":47}," }:",[41,2383,632],{"class":47},[41,2385,2378],{"class":51},[41,2387,30],{"class":47},[41,2389,2390],{"class":306}," React",[41,2392,130],{"class":47},[41,2394,2395],{"class":306},"ReactNode",[41,2397,2398],{"class":47}," })",[41,2400,154],{"class":47},[41,2402,2403,2405],{"class":43,"line":90},[41,2404,629],{"class":299},[41,2406,2407],{"class":51}," (\n",[41,2409,2410],{"class":43,"line":102},[41,2411,2412],{"class":47},"    \u003C>\n",[41,2414,2415,2418,2421],{"class":43,"line":123},[41,2416,2417],{"class":47},"      {",[41,2419,2420],{"class":126},"children",[41,2422,343],{"class":47},[41,2424,2425],{"class":43,"line":157},[41,2426,349],{"emptyLinePlaceholder":348},[41,2428,2429,2432],{"class":43,"line":213},[41,2430,2431],{"class":47},"      \u003C",[41,2433,2434],{"class":306},"Script\n",[41,2436,2437,2440,2442,2444,2446],{"class":43,"line":219},[41,2438,2439],{"class":58},"        src",[41,2441,62],{"class":47},[41,2443,65],{"class":47},[41,2445,69],{"class":68},[41,2447,72],{"class":47},[41,2449,2450,2453,2455,2457,2460],{"class":43,"line":243},[41,2451,2452],{"class":58},"        strategy",[41,2454,62],{"class":47},[41,2456,65],{"class":47},[41,2458,2459],{"class":68},"afterInteractive",[41,2461,72],{"class":47},[41,2463,2464,2467,2469,2471,2473],{"class":43,"line":260},[41,2465,2466],{"class":58},"        id",[41,2468,62],{"class":47},[41,2470,65],{"class":47},[41,2472,85],{"class":68},[41,2474,72],{"class":47},[41,2476,2477],{"class":43,"line":270},[41,2478,2479],{"class":47},"      \u002F>\n",[41,2481,2482],{"class":43,"line":421},[41,2483,349],{"emptyLinePlaceholder":348},[41,2485,2486,2488],{"class":43,"line":426},[41,2487,2431],{"class":47},[41,2489,2434],{"class":306},[41,2491,2492,2494,2496,2498,2500],{"class":43,"line":438},[41,2493,2452],{"class":58},[41,2495,62],{"class":47},[41,2497,65],{"class":47},[41,2499,2459],{"class":68},[41,2501,72],{"class":47},[41,2503,2504,2506,2508,2510,2512],{"class":43,"line":449},[41,2505,2466],{"class":58},[41,2507,62],{"class":47},[41,2509,65],{"class":47},[41,2511,116],{"class":68},[41,2513,72],{"class":47},[41,2515,2516],{"class":43,"line":487},[41,2517,2518],{"class":47},"      >\n",[41,2520,2521,2524],{"class":43,"line":493},[41,2522,2523],{"class":47},"        {",[41,2525,2526],{"class":47},"`\n",[41,2528,2529],{"class":43,"line":498},[41,2530,2531],{"class":68},"          window.fitting = window.fitting || function() {\n",[41,2533,2534],{"class":43,"line":503},[41,2535,2536],{"class":68},"            (window.fitting.q = window.fitting.q || []).push(arguments);\n",[41,2538,2539],{"class":43,"line":517},[41,2540,2541],{"class":68},"          };\n",[41,2543,2544],{"class":43,"line":543},[41,2545,2546],{"class":68},"          window.fitting('init', {\n",[41,2548,2549,2552,2555,2558,2560,2563,2565,2568,2570],{"class":43,"line":569},[41,2550,2551],{"class":68},"            apiKey: '",[41,2553,2554],{"class":47},"${",[41,2556,2557],{"class":126},"process",[41,2559,130],{"class":47},[41,2561,2562],{"class":126},"env",[41,2564,130],{"class":47},[41,2566,2567],{"class":126},"NEXT_PUBLIC_TRY_ON_API_KEY",[41,2569,886],{"class":47},[41,2571,257],{"class":68},[41,2573,2574],{"class":43,"line":574},[41,2575,2576],{"class":68},"          });\n",[41,2578,2579,2582],{"class":43,"line":579},[41,2580,2581],{"class":47},"        `",[41,2583,343],{"class":47},[41,2585,2586,2589,2591],{"class":43,"line":596},[41,2587,2588],{"class":47},"      \u003C\u002F",[41,2590,2315],{"class":306},[41,2592,99],{"class":47},[41,2594,2595],{"class":43,"line":616},[41,2596,2597],{"class":47},"    \u003C\u002F>\n",[41,2599,2600,2603],{"class":43,"line":621},[41,2601,2602],{"class":51},"  )",[41,2604,210],{"class":47},[41,2606,2607],{"class":43,"line":626},[41,2608,343],{"class":47},[1244,2610,2612],{"id":2611},"step-2-create-the-widget-button","Step 2 — Create the Widget Button",[32,2614,2616],{"className":2333,"code":2615,"language":2335,"meta":37,"style":37},"'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",[27,2617,2618,2629,2633,2642,2652,2662,2666,2670,2678,2686,2717,2721,2725,2729,2761,2776,2796,2811,2826,2837,2846,2850,2854,2860,2864,2926,2951,2955,2961],{"__ignoreMap":37},[41,2619,2620,2622,2625,2627],{"class":43,"line":44},[41,2621,230],{"class":47},[41,2623,2624],{"class":68},"use client",[41,2626,230],{"class":47},[41,2628,210],{"class":47},[41,2630,2631],{"class":43,"line":55},[41,2632,349],{"emptyLinePlaceholder":348},[41,2634,2635,2638,2640],{"class":43,"line":75},[41,2636,2637],{"class":58},"interface",[41,2639,307],{"class":306},[41,2641,154],{"class":47},[41,2643,2644,2646,2648,2650],{"class":43,"line":90},[41,2645,314],{"class":51},[41,2647,30],{"class":47},[41,2649,466],{"class":306},[41,2651,210],{"class":47},[41,2653,2654,2656,2658,2660],{"class":43,"line":102},[41,2655,324],{"class":51},[41,2657,30],{"class":47},[41,2659,466],{"class":306},[41,2661,210],{"class":47},[41,2663,2664],{"class":43,"line":123},[41,2665,343],{"class":47},[41,2667,2668],{"class":43,"line":157},[41,2669,349],{"emptyLinePlaceholder":348},[41,2671,2672,2674,2676],{"class":43,"line":213},[41,2673,429],{"class":58},[41,2675,432],{"class":126},[41,2677,435],{"class":47},[41,2679,2680,2682,2684],{"class":43,"line":219},[41,2681,441],{"class":58},[41,2683,444],{"class":306},[41,2685,154],{"class":47},[41,2687,2688,2690,2692,2694,2696,2698,2700,2702,2704,2706,2708,2710,2712,2715],{"class":43,"line":243},[41,2689,452],{"class":51},[41,2691,30],{"class":47},[41,2693,457],{"class":47},[41,2695,461],{"class":460},[41,2697,30],{"class":47},[41,2699,466],{"class":306},[41,2701,238],{"class":47},[41,2703,471],{"class":460},[41,2705,336],{"class":47},[41,2707,476],{"class":306},[41,2709,207],{"class":47},[41,2711,481],{"class":58},[41,2713,2714],{"class":306}," void",[41,2716,210],{"class":47},[41,2718,2719],{"class":43,"line":260},[41,2720,490],{"class":47},[41,2722,2723],{"class":43,"line":270},[41,2724,343],{"class":47},[41,2726,2727],{"class":43,"line":421},[41,2728,349],{"emptyLinePlaceholder":348},[41,2730,2731,2733,2735,2738,2740,2743,2745,2747,2749,2751,2753,2756,2759],{"class":43,"line":426},[41,2732,300],{"class":299},[41,2734,148],{"class":58},[41,2736,2737],{"class":197}," TryOnButton",[41,2739,2375],{"class":47},[41,2741,2742],{"class":460}," items",[41,2744,2381],{"class":47},[41,2746,632],{"class":47},[41,2748,2742],{"class":51},[41,2750,30],{"class":47},[41,2752,307],{"class":306},[41,2754,2755],{"class":126},"[] ",[41,2757,2758],{"class":47},"})",[41,2760,154],{"class":47},[41,2762,2763,2765,2768,2770,2772,2774],{"class":43,"line":438},[41,2764,520],{"class":58},[41,2766,2767],{"class":126}," handleClick",[41,2769,176],{"class":47},[41,2771,589],{"class":47},[41,2773,481],{"class":58},[41,2775,154],{"class":47},[41,2777,2778,2780,2782,2784,2786,2788,2790,2792,2794],{"class":43,"line":449},[41,2779,546],{"class":126},[41,2781,130],{"class":47},[41,2783,168],{"class":197},[41,2785,201],{"class":51},[41,2787,230],{"class":47},[41,2789,557],{"class":68},[41,2791,230],{"class":47},[41,2793,238],{"class":47},[41,2795,154],{"class":47},[41,2797,2798,2801,2803,2805,2807,2809],{"class":43,"line":487},[41,2799,2800],{"class":51},"      targetElementId",[41,2802,30],{"class":47},[41,2804,251],{"class":47},[41,2806,701],{"class":68},[41,2808,230],{"class":47},[41,2810,936],{"class":47},[41,2812,2813,2816,2818,2820,2822,2824],{"class":43,"line":493},[41,2814,2815],{"class":51},"      model",[41,2817,30],{"class":47},[41,2819,251],{"class":47},[41,2821,381],{"class":68},[41,2823,230],{"class":47},[41,2825,936],{"class":47},[41,2827,2828,2831,2833,2835],{"class":43,"line":498},[41,2829,2830],{"class":51},"      tryonItems",[41,2832,30],{"class":47},[41,2834,2742],{"class":126},[41,2836,936],{"class":47},[41,2838,2839,2842,2844],{"class":43,"line":503},[41,2840,2841],{"class":47},"    }",[41,2843,207],{"class":51},[41,2845,210],{"class":47},[41,2847,2848],{"class":43,"line":517},[41,2849,216],{"class":47},[41,2851,2852],{"class":43,"line":543},[41,2853,349],{"emptyLinePlaceholder":348},[41,2855,2856,2858],{"class":43,"line":569},[41,2857,629],{"class":299},[41,2859,2407],{"class":51},[41,2861,2862],{"class":43,"line":574},[41,2863,2412],{"class":47},[41,2865,2866,2868,2870,2872,2874,2876,2878,2880,2883,2886,2889,2891,2893,2896,2898,2900,2903,2905,2909,2911,2914,2916,2918,2921,2923],{"class":43,"line":579},[41,2867,2431],{"class":47},[41,2869,679],{"class":51},[41,2871,109],{"class":58},[41,2873,62],{"class":47},[41,2875,65],{"class":47},[41,2877,701],{"class":68},[41,2879,65],{"class":47},[41,2881,2882],{"class":58}," style",[41,2884,2885],{"class":47},"={{",[41,2887,2888],{"class":51}," width",[41,2890,30],{"class":47},[41,2892,251],{"class":47},[41,2894,2895],{"class":68},"100%",[41,2897,230],{"class":47},[41,2899,238],{"class":47},[41,2901,2902],{"class":51}," maxWidth",[41,2904,30],{"class":47},[41,2906,2908],{"class":2907},"sbssI"," 600",[41,2910,238],{"class":47},[41,2912,2913],{"class":51}," aspectRatio",[41,2915,30],{"class":47},[41,2917,251],{"class":47},[41,2919,2920],{"class":68},"3\u002F4",[41,2922,230],{"class":47},[41,2924,2925],{"class":47}," }} \u002F>\n",[41,2927,2928,2930,2932,2935,2938,2941,2943,2945,2947,2949],{"class":43,"line":596},[41,2929,2431],{"class":47},[41,2931,729],{"class":51},[41,2933,2934],{"class":58}," onClick",[41,2936,2937],{"class":47},"={",[41,2939,2940],{"class":126},"handleClick",[41,2942,867],{"class":47},[41,2944,747],{"class":126},[41,2946,273],{"class":47},[41,2948,729],{"class":51},[41,2950,99],{"class":47},[41,2952,2953],{"class":43,"line":616},[41,2954,2597],{"class":47},[41,2956,2957,2959],{"class":43,"line":621},[41,2958,2602],{"class":51},[41,2960,210],{"class":47},[41,2962,2963],{"class":43,"line":626},[41,2964,343],{"class":47},[1244,2966,2968],{"id":2967},"step-3-use-in-a-product-page","Step 3 — Use in a Product Page",[32,2970,2972],{"className":2333,"code":2971,"language":2335,"meta":37,"style":37},"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",[27,2973,2974,2995,2999,3041,3070,3074,3080,3088,3112,3148,3155,3165,3170,3185,3200,3205,3212,3216,3225,3231],{"__ignoreMap":37},[41,2975,2976,2978,2980,2982,2984,2986,2988,2991,2993],{"class":43,"line":44},[41,2977,801],{"class":299},[41,2979,632],{"class":47},[41,2981,2737],{"class":126},[41,2983,815],{"class":47},[41,2985,818],{"class":299},[41,2987,251],{"class":47},[41,2989,2990],{"class":68},"@\u002Fcomponents\u002FTryOnButton",[41,2992,230],{"class":47},[41,2994,210],{"class":47},[41,2996,2997],{"class":43,"line":55},[41,2998,349],{"emptyLinePlaceholder":348},[41,3000,3001,3003,3005,3008,3010,3013,3015,3018,3020,3022,3024,3026,3028,3031,3033,3035,3037,3039],{"class":43,"line":75},[41,3002,300],{"class":299},[41,3004,2367],{"class":299},[41,3006,3007],{"class":58}," async",[41,3009,148],{"class":58},[41,3011,3012],{"class":197}," ProductPage",[41,3014,2375],{"class":47},[41,3016,3017],{"class":460}," params",[41,3019,2381],{"class":47},[41,3021,632],{"class":47},[41,3023,3017],{"class":51},[41,3025,30],{"class":47},[41,3027,632],{"class":47},[41,3029,3030],{"class":51}," slug",[41,3032,30],{"class":47},[41,3034,466],{"class":306},[41,3036,815],{"class":47},[41,3038,2398],{"class":47},[41,3040,154],{"class":47},[41,3042,3043,3045,3048,3050,3053,3056,3058,3061,3063,3066,3068],{"class":43,"line":90},[41,3044,520],{"class":58},[41,3046,3047],{"class":126}," product",[41,3049,176],{"class":47},[41,3051,3052],{"class":299}," await",[41,3054,3055],{"class":197}," getProduct",[41,3057,201],{"class":51},[41,3059,3060],{"class":126},"params",[41,3062,130],{"class":47},[41,3064,3065],{"class":126},"slug",[41,3067,207],{"class":51},[41,3069,210],{"class":47},[41,3071,3072],{"class":43,"line":102},[41,3073,349],{"emptyLinePlaceholder":348},[41,3075,3076,3078],{"class":43,"line":123},[41,3077,629],{"class":299},[41,3079,2407],{"class":51},[41,3081,3082,3084,3086],{"class":43,"line":157},[41,3083,686],{"class":47},[41,3085,679],{"class":51},[41,3087,99],{"class":47},[41,3089,3090,3092,3094,3097,3100,3102,3105,3108,3110],{"class":43,"line":213},[41,3091,2431],{"class":47},[41,3093,10],{"class":51},[41,3095,3096],{"class":47},">{",[41,3098,3099],{"class":126},"product",[41,3101,130],{"class":47},[41,3103,3104],{"class":126},"name",[41,3106,3107],{"class":47},"}\u003C\u002F",[41,3109,10],{"class":51},[41,3111,99],{"class":47},[41,3113,3114,3116,3119,3122,3124,3126,3128,3131,3134,3137,3139,3141,3143,3145],{"class":43,"line":219},[41,3115,2431],{"class":47},[41,3117,3118],{"class":51},"img",[41,3120,3121],{"class":58}," src",[41,3123,2937],{"class":47},[41,3125,3099],{"class":126},[41,3127,130],{"class":47},[41,3129,3130],{"class":126},"image",[41,3132,3133],{"class":47},"} ",[41,3135,3136],{"class":58},"alt",[41,3138,2937],{"class":47},[41,3140,3099],{"class":126},[41,3142,130],{"class":47},[41,3144,3104],{"class":126},[41,3146,3147],{"class":47},"} \u002F>\n",[41,3149,3150,3152],{"class":43,"line":243},[41,3151,2431],{"class":47},[41,3153,3154],{"class":306},"TryOnButton\n",[41,3156,3157,3160,3162],{"class":43,"line":260},[41,3158,3159],{"class":58},"        items",[41,3161,2937],{"class":47},[41,3163,3164],{"class":126},"[\n",[41,3166,3167],{"class":43,"line":270},[41,3168,3169],{"class":47},"          {\n",[41,3171,3172,3175,3177,3179,3181,3183],{"class":43,"line":421},[41,3173,3174],{"class":51},"            productName",[41,3176,30],{"class":47},[41,3178,3047],{"class":126},[41,3180,130],{"class":47},[41,3182,3104],{"class":126},[41,3184,936],{"class":47},[41,3186,3187,3190,3192,3194,3196,3198],{"class":43,"line":426},[41,3188,3189],{"class":51},"            url",[41,3191,30],{"class":47},[41,3193,3047],{"class":126},[41,3195,130],{"class":47},[41,3197,3130],{"class":126},[41,3199,936],{"class":47},[41,3201,3202],{"class":43,"line":438},[41,3203,3204],{"class":47},"          },\n",[41,3206,3207,3210],{"class":43,"line":449},[41,3208,3209],{"class":126},"        ]",[41,3211,343],{"class":47},[41,3213,3214],{"class":43,"line":487},[41,3215,2479],{"class":47},[41,3217,3218,3221,3223],{"class":43,"line":493},[41,3219,3220],{"class":47},"    \u003C\u002F",[41,3222,679],{"class":51},[41,3224,99],{"class":47},[41,3226,3227,3229],{"class":43,"line":498},[41,3228,2602],{"class":51},[41,3230,210],{"class":47},[41,3232,3233],{"class":43,"line":503},[41,3234,343],{"class":47},[19,3236,3238],{"id":3237},"environment-variable","Environment Variable",[15,3240,3241,3242,30],{},"Add your API key to ",[27,3243,3244],{},".env.local",[32,3246,3250],{"className":3247,"code":3248,"language":3249,"meta":37,"style":37},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","NEXT_PUBLIC_TRY_ON_API_KEY=pk_live_xxx\n","bash",[27,3251,3252],{"__ignoreMap":37},[41,3253,3254,3256,3258],{"class":43,"line":44},[41,3255,2567],{"class":126},[41,3257,62],{"class":47},[41,3259,3260],{"class":68},"pk_live_xxx\n",[1035,3262,3263],{},"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":37,"searchDepth":55,"depth":55,"links":3265},[3266,3272],{"id":2308,"depth":55,"text":2309,"children":3267},[3268,3270,3271],{"id":2322,"depth":75,"text":3269},"Step 1 — Load Scripts in layout.tsx or page.tsx",{"id":2611,"depth":75,"text":2612},{"id":2967,"depth":75,"text":2968},{"id":3237,"depth":55,"text":3238},"Integrate with Next.js (Pages Router & App Router)","i-lucide-triangle",{},"\u002Fen\u002Fintegrations\u002Fnextjs",{"title":2289,"description":3273},"en\u002Fintegrations\u002Fnextjs","JdA3Sttp8qaffNRKpcg9b3i_J2nMxDOCfnya8RjA3yU",{"id":3281,"title":3282,"body":3283,"description":4146,"extension":1044,"icon":4147,"meta":4148,"navigation":348,"path":4149,"seo":4150,"stem":4151,"__hash__":4152},"content\u002Fen\u002Fintegrations\u002Fnuxt.md","Nuxt",{"type":7,"value":3284,"toc":4136},[3285,3289,3292,3296,3306,3312,3618,3624,3819,3823,4112,4114,4120,4133],[10,3286,3288],{"id":3287},"nuxt-integration","Nuxt Integration",[15,3290,3291],{},"The Fitting Widget integrates seamlessly with Nuxt 3 and Nuxt 4.",[19,3293,3295],{"id":3294},"_1-load-the-script","1. Load the Script",[15,3297,3298,3299,3302,3303,130],{},"Use the ",[27,3300,3301],{},"useHead"," composable, or add scripts to your ",[27,3304,3305],{},"nuxt.config.ts",[1244,3307,3309,3310],{"id":3308},"option-a-per-page-with-usehead","Option A — Per Page with ",[27,3311,3301],{},[32,3313,3315],{"className":653,"code":3314,"language":655,"meta":37,"style":37},"\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",[27,3316,3317,3322,3330,3338,3355,3389,3397,3405,3409,3429,3449,3453,3461,3470,3474,3489,3503,3507,3511,3525,3535,3540,3545,3550,3555,3582,3587,3594,3598,3604,3610],{"__ignoreMap":37},[41,3318,3319],{"class":43,"line":44},[41,3320,3321],{"class":293},"\u003C!-- pages\u002Fproduct\u002F[slug].vue -->\n",[41,3323,3324,3326,3328],{"class":43,"line":55},[41,3325,48],{"class":47},[41,3327,669],{"class":51},[41,3329,99],{"class":47},[41,3331,3332,3334,3336],{"class":43,"line":75},[41,3333,676],{"class":47},[41,3335,679],{"class":51},[41,3337,99],{"class":47},[41,3339,3340,3342,3344,3346,3349,3351,3353],{"class":43,"line":90},[41,3341,686],{"class":47},[41,3343,10],{"class":51},[41,3345,744],{"class":47},[41,3347,3348],{"class":126},"{{ product.name }}",[41,3350,273],{"class":47},[41,3352,10],{"class":51},[41,3354,99],{"class":47},[41,3356,3357,3359,3362,3365,3367,3369,3372,3374,3377,3379,3381,3384,3386],{"class":43,"line":102},[41,3358,686],{"class":47},[41,3360,3361],{"class":51},"TryOnWidget",[41,3363,3364],{"class":58}," :product-name",[41,3366,62],{"class":47},[41,3368,65],{"class":47},[41,3370,3371],{"class":68},"product.name",[41,3373,65],{"class":47},[41,3375,3376],{"class":58}," :image-url",[41,3378,62],{"class":47},[41,3380,65],{"class":47},[41,3382,3383],{"class":68},"product.image",[41,3385,65],{"class":47},[41,3387,3388],{"class":47}," \u002F>\n",[41,3390,3391,3393,3395],{"class":43,"line":123},[41,3392,758],{"class":47},[41,3394,679],{"class":51},[41,3396,99],{"class":47},[41,3398,3399,3401,3403],{"class":43,"line":157},[41,3400,273],{"class":47},[41,3402,669],{"class":51},[41,3404,99],{"class":47},[41,3406,3407],{"class":43,"line":213},[41,3408,349],{"emptyLinePlaceholder":348},[41,3410,3411,3413,3415,3417,3419,3421,3423,3425,3427],{"class":43,"line":219},[41,3412,48],{"class":47},[41,3414,96],{"class":51},[41,3416,783],{"class":58},[41,3418,786],{"class":58},[41,3420,62],{"class":47},[41,3422,65],{"class":47},[41,3424,286],{"class":68},[41,3426,65],{"class":47},[41,3428,99],{"class":47},[41,3430,3431,3433,3435,3438,3440,3442,3444,3447],{"class":43,"line":243},[41,3432,801],{"class":299},[41,3434,632],{"class":47},[41,3436,3437],{"class":126}," useHead",[41,3439,815],{"class":47},[41,3441,818],{"class":299},[41,3443,251],{"class":47},[41,3445,3446],{"class":68},"#app",[41,3448,257],{"class":47},[41,3450,3451],{"class":43,"line":260},[41,3452,349],{"emptyLinePlaceholder":348},[41,3454,3455,3457,3459],{"class":43,"line":270},[41,3456,3301],{"class":197},[41,3458,201],{"class":126},[41,3460,435],{"class":47},[41,3462,3463,3466,3468],{"class":43,"line":421},[41,3464,3465],{"class":51},"  script",[41,3467,30],{"class":47},[41,3469,961],{"class":126},[41,3471,3472],{"class":43,"line":426},[41,3473,1355],{"class":47},[41,3475,3476,3479,3481,3483,3485,3487],{"class":43,"line":438},[41,3477,3478],{"class":51},"      src",[41,3480,30],{"class":47},[41,3482,251],{"class":47},[41,3484,69],{"class":68},[41,3486,230],{"class":47},[41,3488,936],{"class":47},[41,3490,3491,3493,3495,3497,3499,3501],{"class":43,"line":449},[41,3492,694],{"class":51},[41,3494,30],{"class":47},[41,3496,251],{"class":47},[41,3498,85],{"class":68},[41,3500,230],{"class":47},[41,3502,936],{"class":47},[41,3504,3505],{"class":43,"line":487},[41,3506,1392],{"class":47},[41,3508,3509],{"class":43,"line":493},[41,3510,1355],{"class":47},[41,3512,3513,3515,3517,3519,3521,3523],{"class":43,"line":498},[41,3514,694],{"class":51},[41,3516,30],{"class":47},[41,3518,251],{"class":47},[41,3520,116],{"class":68},[41,3522,230],{"class":47},[41,3524,936],{"class":47},[41,3526,3527,3530,3532],{"class":43,"line":503},[41,3528,3529],{"class":51},"      innerHTML",[41,3531,30],{"class":47},[41,3533,3534],{"class":47}," `\n",[41,3536,3537],{"class":43,"line":517},[41,3538,3539],{"class":68},"        window.fitting = window.fitting || function() {\n",[41,3541,3542],{"class":43,"line":543},[41,3543,3544],{"class":68},"          (window.fitting.q = window.fitting.q || []).push(arguments);\n",[41,3546,3547],{"class":43,"line":569},[41,3548,3549],{"class":68},"        };\n",[41,3551,3552],{"class":43,"line":574},[41,3553,3554],{"class":68},"        window.fitting('init', {\n",[41,3556,3557,3560,3562,3564,3566,3569,3571,3573,3575,3578,3580],{"class":43,"line":579},[41,3558,3559],{"class":68},"          apiKey: '",[41,3561,2554],{"class":47},[41,3563,801],{"class":299},[41,3565,130],{"class":47},[41,3567,3568],{"class":126},"meta",[41,3570,130],{"class":47},[41,3572,2562],{"class":126},[41,3574,130],{"class":47},[41,3576,3577],{"class":126},"VITE_TRY_ON_API_KEY",[41,3579,886],{"class":47},[41,3581,257],{"class":68},[41,3583,3584],{"class":43,"line":596},[41,3585,3586],{"class":68},"        });\n",[41,3588,3589,3592],{"class":43,"line":616},[41,3590,3591],{"class":47},"      `",[41,3593,936],{"class":47},[41,3595,3596],{"class":43,"line":621},[41,3597,1392],{"class":47},[41,3599,3600,3602],{"class":43,"line":626},[41,3601,1397],{"class":126},[41,3603,936],{"class":47},[41,3605,3606,3608],{"class":43,"line":644},[41,3607,886],{"class":47},[41,3609,566],{"class":126},[41,3611,3612,3614,3616],{"class":43,"line":1007},[41,3613,273],{"class":47},[41,3615,96],{"class":51},[41,3617,99],{"class":47},[1244,3619,3621,3622],{"id":3620},"option-b-global-in-nuxtconfigts","Option B — Global in ",[27,3623,3305],{},[32,3625,3627],{"className":284,"code":3626,"language":286,"meta":37,"style":37},"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",[27,3628,3629,3642,3651,3660,3669,3674,3689,3704,3709,3713,3727,3736,3741,3746,3751,3756,3781,3786,3793,3797,3804,3808,3813],{"__ignoreMap":37},[41,3630,3631,3633,3635,3638,3640],{"class":43,"line":44},[41,3632,300],{"class":299},[41,3634,2367],{"class":299},[41,3636,3637],{"class":197}," defineNuxtConfig",[41,3639,201],{"class":126},[41,3641,435],{"class":47},[41,3643,3644,3647,3649],{"class":43,"line":55},[41,3645,3646],{"class":51},"  app",[41,3648,30],{"class":47},[41,3650,154],{"class":47},[41,3652,3653,3656,3658],{"class":43,"line":75},[41,3654,3655],{"class":51},"    head",[41,3657,30],{"class":47},[41,3659,154],{"class":47},[41,3661,3662,3665,3667],{"class":43,"line":90},[41,3663,3664],{"class":51},"      script",[41,3666,30],{"class":47},[41,3668,961],{"class":126},[41,3670,3671],{"class":43,"line":102},[41,3672,3673],{"class":47},"        {\n",[41,3675,3676,3679,3681,3683,3685,3687],{"class":43,"line":123},[41,3677,3678],{"class":51},"          src",[41,3680,30],{"class":47},[41,3682,251],{"class":47},[41,3684,69],{"class":68},[41,3686,230],{"class":47},[41,3688,936],{"class":47},[41,3690,3691,3694,3696,3698,3700,3702],{"class":43,"line":157},[41,3692,3693],{"class":51},"          id",[41,3695,30],{"class":47},[41,3697,251],{"class":47},[41,3699,85],{"class":68},[41,3701,230],{"class":47},[41,3703,936],{"class":47},[41,3705,3706],{"class":43,"line":213},[41,3707,3708],{"class":47},"        },\n",[41,3710,3711],{"class":43,"line":219},[41,3712,3673],{"class":47},[41,3714,3715,3717,3719,3721,3723,3725],{"class":43,"line":243},[41,3716,3693],{"class":51},[41,3718,30],{"class":47},[41,3720,251],{"class":47},[41,3722,116],{"class":68},[41,3724,230],{"class":47},[41,3726,936],{"class":47},[41,3728,3729,3732,3734],{"class":43,"line":260},[41,3730,3731],{"class":51},"          innerHTML",[41,3733,30],{"class":47},[41,3735,3534],{"class":47},[41,3737,3738],{"class":43,"line":270},[41,3739,3740],{"class":68},"            window.fitting = window.fitting || function() {\n",[41,3742,3743],{"class":43,"line":421},[41,3744,3745],{"class":68},"              (window.fitting.q = window.fitting.q || []).push(arguments);\n",[41,3747,3748],{"class":43,"line":426},[41,3749,3750],{"class":68},"            };\n",[41,3752,3753],{"class":43,"line":438},[41,3754,3755],{"class":68},"            window.fitting('init', {\n",[41,3757,3758,3761,3763,3765,3767,3769,3771,3773,3775,3777,3779],{"class":43,"line":449},[41,3759,3760],{"class":68},"              apiKey: '",[41,3762,2554],{"class":47},[41,3764,801],{"class":299},[41,3766,130],{"class":47},[41,3768,3568],{"class":126},[41,3770,130],{"class":47},[41,3772,2562],{"class":126},[41,3774,130],{"class":47},[41,3776,3577],{"class":126},[41,3778,886],{"class":47},[41,3780,257],{"class":68},[41,3782,3783],{"class":43,"line":487},[41,3784,3785],{"class":68},"            });\n",[41,3787,3788,3791],{"class":43,"line":493},[41,3789,3790],{"class":47},"          `",[41,3792,936],{"class":47},[41,3794,3795],{"class":43,"line":498},[41,3796,3708],{"class":47},[41,3798,3799,3802],{"class":43,"line":503},[41,3800,3801],{"class":126},"      ]",[41,3803,936],{"class":47},[41,3805,3806],{"class":43,"line":517},[41,3807,1392],{"class":47},[41,3809,3810],{"class":43,"line":543},[41,3811,3812],{"class":47},"  },\n",[41,3814,3815,3817],{"class":43,"line":569},[41,3816,886],{"class":47},[41,3818,566],{"class":126},[19,3820,3822],{"id":3821},"_2-create-the-wrapper-component","2. Create the Wrapper Component",[32,3824,3826],{"className":653,"code":3825,"language":655,"meta":37,"style":37},"\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",[27,3827,3828,3832,3840,3848,3878,3904,3912,3920,3924,3944,3956,3964,3972,3978,3982,3996,4016,4030,4044,4052,4056,4070,4084,4088,4094,4100,4104],{"__ignoreMap":37},[41,3829,3830],{"class":43,"line":44},[41,3831,662],{"class":293},[41,3833,3834,3836,3838],{"class":43,"line":55},[41,3835,48],{"class":47},[41,3837,669],{"class":51},[41,3839,99],{"class":47},[41,3841,3842,3844,3846],{"class":43,"line":75},[41,3843,676],{"class":47},[41,3845,679],{"class":51},[41,3847,99],{"class":47},[41,3849,3850,3852,3854,3856,3858,3860,3862,3864,3867,3869,3871,3874,3876],{"class":43,"line":90},[41,3851,686],{"class":47},[41,3853,679],{"class":51},[41,3855,109],{"class":58},[41,3857,62],{"class":47},[41,3859,65],{"class":47},[41,3861,701],{"class":68},[41,3863,65],{"class":47},[41,3865,3866],{"class":58}," class",[41,3868,62],{"class":47},[41,3870,65],{"class":47},[41,3872,3873],{"class":68},"aspect-[3\u002F4] w-full max-w-[600px]",[41,3875,65],{"class":47},[41,3877,3388],{"class":47},[41,3879,3880,3882,3884,3886,3888,3890,3892,3894,3896,3898,3900,3902],{"class":43,"line":102},[41,3881,686],{"class":47},[41,3883,729],{"class":51},[41,3885,732],{"class":58},[41,3887,62],{"class":47},[41,3889,65],{"class":47},[41,3891,739],{"class":68},[41,3893,65],{"class":47},[41,3895,744],{"class":47},[41,3897,747],{"class":126},[41,3899,273],{"class":47},[41,3901,729],{"class":51},[41,3903,99],{"class":47},[41,3905,3906,3908,3910],{"class":43,"line":123},[41,3907,758],{"class":47},[41,3909,679],{"class":51},[41,3911,99],{"class":47},[41,3913,3914,3916,3918],{"class":43,"line":157},[41,3915,273],{"class":47},[41,3917,669],{"class":51},[41,3919,99],{"class":47},[41,3921,3922],{"class":43,"line":213},[41,3923,349],{"emptyLinePlaceholder":348},[41,3925,3926,3928,3930,3932,3934,3936,3938,3940,3942],{"class":43,"line":219},[41,3927,48],{"class":47},[41,3929,96],{"class":51},[41,3931,783],{"class":58},[41,3933,786],{"class":58},[41,3935,62],{"class":47},[41,3937,65],{"class":47},[41,3939,286],{"class":68},[41,3941,65],{"class":47},[41,3943,99],{"class":47},[41,3945,3946,3948,3950,3952,3954],{"class":43,"line":243},[41,3947,834],{"class":58},[41,3949,837],{"class":126},[41,3951,62],{"class":47},[41,3953,842],{"class":197},[41,3955,845],{"class":47},[41,3957,3958,3960,3962],{"class":43,"line":260},[41,3959,314],{"class":51},[41,3961,30],{"class":47},[41,3963,319],{"class":306},[41,3965,3966,3968,3970],{"class":43,"line":270},[41,3967,858],{"class":51},[41,3969,30],{"class":47},[41,3971,319],{"class":306},[41,3973,3974,3976],{"class":43,"line":421},[41,3975,867],{"class":47},[41,3977,870],{"class":126},[41,3979,3980],{"class":43,"line":426},[41,3981,349],{"emptyLinePlaceholder":348},[41,3983,3984,3986,3988,3990,3992,3994],{"class":43,"line":438},[41,3985,834],{"class":58},[41,3987,903],{"class":126},[41,3989,62],{"class":47},[41,3991,589],{"class":47},[41,3993,481],{"class":58},[41,3995,154],{"class":47},[41,3997,3998,4000,4002,4004,4006,4008,4010,4012,4014],{"class":43,"line":449},[41,3999,127],{"class":126},[41,4001,130],{"class":47},[41,4003,168],{"class":197},[41,4005,201],{"class":51},[41,4007,230],{"class":47},[41,4009,557],{"class":68},[41,4011,230],{"class":47},[41,4013,238],{"class":47},[41,4015,154],{"class":47},[41,4017,4018,4020,4022,4024,4026,4028],{"class":43,"line":487},[41,4019,925],{"class":51},[41,4021,30],{"class":47},[41,4023,251],{"class":47},[41,4025,701],{"class":68},[41,4027,230],{"class":47},[41,4029,936],{"class":47},[41,4031,4032,4034,4036,4038,4040,4042],{"class":43,"line":493},[41,4033,941],{"class":51},[41,4035,30],{"class":47},[41,4037,251],{"class":47},[41,4039,381],{"class":68},[41,4041,230],{"class":47},[41,4043,936],{"class":47},[41,4045,4046,4048,4050],{"class":43,"line":498},[41,4047,956],{"class":51},[41,4049,30],{"class":47},[41,4051,961],{"class":51},[41,4053,4054],{"class":43,"line":503},[41,4055,966],{"class":47},[41,4057,4058,4060,4062,4064,4066,4068],{"class":43,"line":517},[41,4059,971],{"class":51},[41,4061,30],{"class":47},[41,4063,976],{"class":126},[41,4065,130],{"class":47},[41,4067,981],{"class":126},[41,4069,936],{"class":47},[41,4071,4072,4074,4076,4078,4080,4082],{"class":43,"line":543},[41,4073,988],{"class":51},[41,4075,30],{"class":47},[41,4077,976],{"class":126},[41,4079,130],{"class":47},[41,4081,997],{"class":126},[41,4083,936],{"class":47},[41,4085,4086],{"class":43,"line":569},[41,4087,1004],{"class":47},[41,4089,4090,4092],{"class":43,"line":574},[41,4091,1010],{"class":51},[41,4093,936],{"class":47},[41,4095,4096,4098],{"class":43,"line":579},[41,4097,263],{"class":47},[41,4099,566],{"class":51},[41,4101,4102],{"class":43,"line":596},[41,4103,343],{"class":47},[41,4105,4106,4108,4110],{"class":43,"line":616},[41,4107,273],{"class":47},[41,4109,96],{"class":51},[41,4111,99],{"class":47},[19,4113,3238],{"id":3237},[15,4115,4116,4117,30],{},"Add to ",[27,4118,4119],{},".env",[32,4121,4123],{"className":3247,"code":4122,"language":3249,"meta":37,"style":37},"VITE_TRY_ON_API_KEY=pk_live_xxx\n",[27,4124,4125],{"__ignoreMap":37},[41,4126,4127,4129,4131],{"class":43,"line":44},[41,4128,3577],{"class":126},[41,4130,62],{"class":47},[41,4132,3260],{"class":68},[1035,4134,4135],{},"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":37,"searchDepth":55,"depth":55,"links":4137},[4138,4144,4145],{"id":3294,"depth":55,"text":3295,"children":4139},[4140,4142],{"id":3308,"depth":75,"text":4141},"Option A — Per Page with useHead",{"id":3620,"depth":75,"text":4143},"Option B — Global in nuxt.config.ts",{"id":3821,"depth":55,"text":3822},{"id":3237,"depth":55,"text":3238},"Integrate with a Nuxt 3 \u002F Nuxt 4 app","i-lucide-nut",{},"\u002Fen\u002Fintegrations\u002Fnuxt",{"title":3282,"description":4146},"en\u002Fintegrations\u002Fnuxt","3xlJgokLPj3qTkGk4XWJ2RH_Ar2hK0jHeC6j3_o9shE",{"id":4154,"title":4155,"body":4156,"description":5026,"extension":1044,"icon":5027,"meta":5028,"navigation":348,"path":5029,"seo":5030,"stem":5031,"__hash__":5032},"content\u002Fen\u002Fintegrations\u002Freact.md","React",{"type":7,"value":4157,"toc":5021},[4158,4162,4165,4167,4172,4357,4367,4371,4681,4685,5018],[10,4159,4161],{"id":4160},"react-integration","React Integration",[15,4163,4164],{},"Works with any React setup — Vite, Create React App, or custom.",[19,4166,22],{"id":21},[15,4168,4169,4170,30],{},"Add the script to your ",[27,4171,29],{},[32,4173,4175],{"className":34,"code":4174,"language":36,"meta":37,"style":37},"\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",[27,4176,4177,4182,4188,4200,4212,4220,4238,4262,4304,4308,4328,4341,4349],{"__ignoreMap":37},[41,4178,4179],{"class":43,"line":44},[41,4180,4181],{"class":293},"\u003C!-- In public\u002Findex.html or index.html (Vite) -->\n",[41,4183,4184,4186],{"class":43,"line":55},[41,4185,48],{"class":47},[41,4187,52],{"class":51},[41,4189,4190,4192,4194,4196,4198],{"class":43,"line":75},[41,4191,59],{"class":58},[41,4193,62],{"class":47},[41,4195,65],{"class":47},[41,4197,69],{"class":68},[41,4199,72],{"class":47},[41,4201,4202,4204,4206,4208,4210],{"class":43,"line":90},[41,4203,78],{"class":58},[41,4205,62],{"class":47},[41,4207,65],{"class":47},[41,4209,85],{"class":68},[41,4211,72],{"class":47},[41,4213,4214,4216,4218],{"class":43,"line":102},[41,4215,93],{"class":47},[41,4217,96],{"class":51},[41,4219,99],{"class":47},[41,4221,4222,4224,4226,4228,4230,4232,4234,4236],{"class":43,"line":123},[41,4223,48],{"class":47},[41,4225,96],{"class":51},[41,4227,109],{"class":58},[41,4229,62],{"class":47},[41,4231,65],{"class":47},[41,4233,116],{"class":68},[41,4235,65],{"class":47},[41,4237,99],{"class":47},[41,4239,4240,4242,4244,4246,4248,4250,4252,4254,4256,4258,4260],{"class":43,"line":157},[41,4241,127],{"class":126},[41,4243,130],{"class":47},[41,4245,133],{"class":126},[41,4247,62],{"class":47},[41,4249,138],{"class":126},[41,4251,130],{"class":47},[41,4253,133],{"class":126},[41,4255,145],{"class":47},[41,4257,148],{"class":58},[41,4259,151],{"class":47},[41,4261,154],{"class":47},[41,4263,4264,4266,4268,4270,4272,4274,4276,4278,4280,4282,4284,4286,4288,4290,4292,4294,4296,4298,4300,4302],{"class":43,"line":213},[41,4265,160],{"class":51},[41,4267,163],{"class":126},[41,4269,130],{"class":47},[41,4271,168],{"class":126},[41,4273,130],{"class":47},[41,4275,173],{"class":126},[41,4277,176],{"class":47},[41,4279,138],{"class":126},[41,4281,130],{"class":47},[41,4283,168],{"class":126},[41,4285,130],{"class":47},[41,4287,173],{"class":126},[41,4289,189],{"class":47},[41,4291,192],{"class":51},[41,4293,130],{"class":47},[41,4295,198],{"class":197},[41,4297,201],{"class":51},[41,4299,204],{"class":126},[41,4301,207],{"class":51},[41,4303,210],{"class":47},[41,4305,4306],{"class":43,"line":219},[41,4307,216],{"class":47},[41,4309,4310,4312,4314,4316,4318,4320,4322,4324,4326],{"class":43,"line":243},[41,4311,127],{"class":126},[41,4313,130],{"class":47},[41,4315,168],{"class":197},[41,4317,201],{"class":126},[41,4319,230],{"class":47},[41,4321,233],{"class":68},[41,4323,230],{"class":47},[41,4325,238],{"class":47},[41,4327,154],{"class":47},[41,4329,4330,4332,4334,4336,4339],{"class":43,"line":260},[41,4331,246],{"class":51},[41,4333,30],{"class":47},[41,4335,251],{"class":47},[41,4337,4338],{"class":68},"%VITE_TRY_ON_API_KEY%",[41,4340,257],{"class":47},[41,4342,4343,4345,4347],{"class":43,"line":270},[41,4344,263],{"class":47},[41,4346,207],{"class":126},[41,4348,210],{"class":47},[41,4350,4351,4353,4355],{"class":43,"line":421},[41,4352,273],{"class":47},[41,4354,96],{"class":51},[41,4356,99],{"class":47},[4358,4359,4361],"callout",{"icon":4360},"i-lucide-lightbulb",[15,4362,4363,4364,4366],{},"Replace ",[27,4365,4338],{}," at build time with your actual key, or use a runtime injection approach.",[19,4368,4370],{"id":4369},"_2-create-a-custom-hook","2. Create a Custom Hook",[32,4372,4374],{"className":2333,"code":4373,"language":2335,"meta":37,"style":37},"\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",[27,4375,4376,4381,4389,4399,4409,4419,4423,4427,4435,4445,4475,4488,4492,4496,4504,4512,4542,4546,4550,4554,4566,4588,4612,4616,4620,4634,4654,4658,4662,4677],{"__ignoreMap":37},[41,4377,4378],{"class":43,"line":44},[41,4379,4380],{"class":293},"\u002F\u002F hooks\u002FuseFittingWidget.ts\n",[41,4382,4383,4385,4387],{"class":43,"line":55},[41,4384,2637],{"class":58},[41,4386,307],{"class":306},[41,4388,154],{"class":47},[41,4390,4391,4393,4395,4397],{"class":43,"line":75},[41,4392,314],{"class":51},[41,4394,30],{"class":47},[41,4396,466],{"class":306},[41,4398,210],{"class":47},[41,4400,4401,4403,4405,4407],{"class":43,"line":90},[41,4402,324],{"class":51},[41,4404,30],{"class":47},[41,4406,466],{"class":306},[41,4408,210],{"class":47},[41,4410,4411,4413,4415,4417],{"class":43,"line":102},[41,4412,333],{"class":51},[41,4414,336],{"class":47},[41,4416,466],{"class":306},[41,4418,210],{"class":47},[41,4420,4421],{"class":43,"line":123},[41,4422,343],{"class":47},[41,4424,4425],{"class":43,"line":157},[41,4426,349],{"emptyLinePlaceholder":348},[41,4428,4429,4431,4433],{"class":43,"line":213},[41,4430,2637],{"class":58},[41,4432,358],{"class":306},[41,4434,154],{"class":47},[41,4436,4437,4439,4441,4443],{"class":43,"line":219},[41,4438,365],{"class":51},[41,4440,30],{"class":47},[41,4442,466],{"class":306},[41,4444,210],{"class":47},[41,4446,4447,4449,4451,4453,4455,4457,4459,4461,4463,4465,4467,4469,4471,4473],{"class":43,"line":243},[41,4448,374],{"class":51},[41,4450,336],{"class":47},[41,4452,251],{"class":47},[41,4454,381],{"class":68},[41,4456,230],{"class":47},[41,4458,386],{"class":47},[41,4460,251],{"class":47},[41,4462,391],{"class":68},[41,4464,230],{"class":47},[41,4466,386],{"class":47},[41,4468,251],{"class":47},[41,4470,400],{"class":68},[41,4472,230],{"class":47},[41,4474,210],{"class":47},[41,4476,4477,4479,4481,4483,4486],{"class":43,"line":260},[41,4478,407],{"class":51},[41,4480,30],{"class":47},[41,4482,307],{"class":306},[41,4484,4485],{"class":126},"[]",[41,4487,210],{"class":47},[41,4489,4490],{"class":43,"line":270},[41,4491,343],{"class":47},[41,4493,4494],{"class":43,"line":421},[41,4495,349],{"emptyLinePlaceholder":348},[41,4497,4498,4500,4502],{"class":43,"line":426},[41,4499,429],{"class":58},[41,4501,432],{"class":126},[41,4503,435],{"class":47},[41,4505,4506,4508,4510],{"class":43,"line":438},[41,4507,441],{"class":58},[41,4509,444],{"class":306},[41,4511,154],{"class":47},[41,4513,4514,4516,4518,4520,4522,4524,4526,4528,4530,4532,4534,4536,4538,4540],{"class":43,"line":449},[41,4515,452],{"class":51},[41,4517,30],{"class":47},[41,4519,457],{"class":47},[41,4521,461],{"class":460},[41,4523,30],{"class":47},[41,4525,466],{"class":306},[41,4527,238],{"class":47},[41,4529,471],{"class":460},[41,4531,336],{"class":47},[41,4533,476],{"class":306},[41,4535,207],{"class":47},[41,4537,481],{"class":58},[41,4539,2714],{"class":306},[41,4541,210],{"class":47},[41,4543,4544],{"class":43,"line":487},[41,4545,490],{"class":47},[41,4547,4548],{"class":43,"line":493},[41,4549,343],{"class":47},[41,4551,4552],{"class":43,"line":498},[41,4553,349],{"emptyLinePlaceholder":348},[41,4555,4556,4558,4560,4562,4564],{"class":43,"line":503},[41,4557,300],{"class":299},[41,4559,148],{"class":58},[41,4561,510],{"class":197},[41,4563,151],{"class":47},[41,4565,154],{"class":47},[41,4567,4568,4570,4572,4574,4576,4578,4580,4582,4584,4586],{"class":43,"line":517},[41,4569,520],{"class":58},[41,4571,523],{"class":126},[41,4573,176],{"class":47},[41,4575,457],{"class":47},[41,4577,530],{"class":460},[41,4579,30],{"class":47},[41,4581,358],{"class":306},[41,4583,207],{"class":47},[41,4585,481],{"class":58},[41,4587,154],{"class":47},[41,4589,4590,4592,4594,4596,4598,4600,4602,4604,4606,4608,4610],{"class":43,"line":543},[41,4591,546],{"class":126},[41,4593,130],{"class":47},[41,4595,168],{"class":197},[41,4597,201],{"class":51},[41,4599,230],{"class":47},[41,4601,557],{"class":68},[41,4603,230],{"class":47},[41,4605,238],{"class":47},[41,4607,471],{"class":126},[41,4609,207],{"class":51},[41,4611,210],{"class":47},[41,4613,4614],{"class":43,"line":569},[41,4615,216],{"class":47},[41,4617,4618],{"class":43,"line":574},[41,4619,349],{"emptyLinePlaceholder":348},[41,4621,4622,4624,4626,4628,4630,4632],{"class":43,"line":579},[41,4623,520],{"class":58},[41,4625,584],{"class":126},[41,4627,176],{"class":47},[41,4629,589],{"class":47},[41,4631,481],{"class":58},[41,4633,154],{"class":47},[41,4635,4636,4638,4640,4642,4644,4646,4648,4650,4652],{"class":43,"line":596},[41,4637,546],{"class":126},[41,4639,130],{"class":47},[41,4641,168],{"class":197},[41,4643,201],{"class":51},[41,4645,230],{"class":47},[41,4647,609],{"class":68},[41,4649,230],{"class":47},[41,4651,207],{"class":51},[41,4653,210],{"class":47},[41,4655,4656],{"class":43,"line":616},[41,4657,216],{"class":47},[41,4659,4660],{"class":43,"line":621},[41,4661,349],{"emptyLinePlaceholder":348},[41,4663,4664,4666,4668,4670,4672,4674],{"class":43,"line":626},[41,4665,629],{"class":299},[41,4667,632],{"class":47},[41,4669,523],{"class":126},[41,4671,238],{"class":47},[41,4673,584],{"class":126},[41,4675,4676],{"class":47}," };\n",[41,4678,4679],{"class":43,"line":644},[41,4680,343],{"class":47},[19,4682,4684],{"id":4683},"_3-use-in-a-component","3. Use in a Component",[32,4686,4688],{"className":2333,"code":4687,"language":2335,"meta":37,"style":37},"\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",[27,4689,4690,4695,4716,4720,4729,4739,4749,4753,4757,4784,4802,4806,4812,4820,4826,4838,4878,4882,4889,4900,4909,4924,4939,4971,4978,4983,4987,4992,5000,5008,5014],{"__ignoreMap":37},[41,4691,4692],{"class":43,"line":44},[41,4693,4694],{"class":293},"\u002F\u002F components\u002FTryOnWidget.tsx\n",[41,4696,4697,4699,4701,4703,4705,4707,4709,4712,4714],{"class":43,"line":55},[41,4698,801],{"class":299},[41,4700,632],{"class":47},[41,4702,510],{"class":126},[41,4704,815],{"class":47},[41,4706,818],{"class":299},[41,4708,251],{"class":47},[41,4710,4711],{"class":68},"..\u002Fhooks\u002FuseFittingWidget",[41,4713,230],{"class":47},[41,4715,210],{"class":47},[41,4717,4718],{"class":43,"line":75},[41,4719,349],{"emptyLinePlaceholder":348},[41,4721,4722,4724,4727],{"class":43,"line":90},[41,4723,2637],{"class":58},[41,4725,4726],{"class":306}," Props",[41,4728,154],{"class":47},[41,4730,4731,4733,4735,4737],{"class":43,"line":102},[41,4732,314],{"class":51},[41,4734,30],{"class":47},[41,4736,466],{"class":306},[41,4738,210],{"class":47},[41,4740,4741,4743,4745,4747],{"class":43,"line":123},[41,4742,858],{"class":51},[41,4744,30],{"class":47},[41,4746,466],{"class":306},[41,4748,210],{"class":47},[41,4750,4751],{"class":43,"line":157},[41,4752,343],{"class":47},[41,4754,4755],{"class":43,"line":213},[41,4756,349],{"emptyLinePlaceholder":348},[41,4758,4759,4761,4763,4766,4768,4771,4773,4776,4778,4780,4782],{"class":43,"line":219},[41,4760,300],{"class":299},[41,4762,148],{"class":58},[41,4764,4765],{"class":197}," TryOnWidget",[41,4767,2375],{"class":47},[41,4769,4770],{"class":460}," productName",[41,4772,238],{"class":47},[41,4774,4775],{"class":460}," imageUrl",[41,4777,2381],{"class":47},[41,4779,4726],{"class":306},[41,4781,207],{"class":47},[41,4783,154],{"class":47},[41,4785,4786,4788,4790,4792,4794,4796,4798,4800],{"class":43,"line":243},[41,4787,520],{"class":58},[41,4789,632],{"class":47},[41,4791,523],{"class":126},[41,4793,815],{"class":47},[41,4795,176],{"class":47},[41,4797,510],{"class":197},[41,4799,151],{"class":51},[41,4801,210],{"class":47},[41,4803,4804],{"class":43,"line":260},[41,4805,349],{"emptyLinePlaceholder":348},[41,4807,4808,4810],{"class":43,"line":270},[41,4809,629],{"class":299},[41,4811,2407],{"class":51},[41,4813,4814,4816,4818],{"class":43,"line":421},[41,4815,686],{"class":47},[41,4817,679],{"class":51},[41,4819,99],{"class":47},[41,4821,4822,4824],{"class":43,"line":426},[41,4823,2431],{"class":47},[41,4825,689],{"class":51},[41,4827,4828,4830,4832,4834,4836],{"class":43,"line":438},[41,4829,2466],{"class":58},[41,4831,62],{"class":47},[41,4833,65],{"class":47},[41,4835,701],{"class":68},[41,4837,72],{"class":47},[41,4839,4840,4843,4845,4847,4849,4851,4853,4855,4857,4859,4861,4863,4865,4867,4869,4871,4873,4875],{"class":43,"line":449},[41,4841,4842],{"class":58},"        style",[41,4844,2885],{"class":47},[41,4846,2888],{"class":51},[41,4848,30],{"class":47},[41,4850,251],{"class":47},[41,4852,2895],{"class":68},[41,4854,230],{"class":47},[41,4856,238],{"class":47},[41,4858,2902],{"class":51},[41,4860,30],{"class":47},[41,4862,2908],{"class":2907},[41,4864,238],{"class":47},[41,4866,2913],{"class":51},[41,4868,30],{"class":47},[41,4870,251],{"class":47},[41,4872,2920],{"class":68},[41,4874,230],{"class":47},[41,4876,4877],{"class":47}," }}\n",[41,4879,4880],{"class":43,"line":487},[41,4881,2479],{"class":47},[41,4883,4884,4886],{"class":43,"line":493},[41,4885,2431],{"class":47},[41,4887,4888],{"class":51},"button\n",[41,4890,4891,4894,4897],{"class":43,"line":498},[41,4892,4893],{"class":58},"        onClick",[41,4895,4896],{"class":47},"={()",[41,4898,4899],{"class":58}," =>\n",[41,4901,4902,4905,4907],{"class":43,"line":503},[41,4903,4904],{"class":197},"          open",[41,4906,201],{"class":126},[41,4908,435],{"class":47},[41,4910,4911,4914,4916,4918,4920,4922],{"class":43,"line":517},[41,4912,4913],{"class":51},"            targetElementId",[41,4915,30],{"class":47},[41,4917,251],{"class":47},[41,4919,701],{"class":68},[41,4921,230],{"class":47},[41,4923,936],{"class":47},[41,4925,4926,4929,4931,4933,4935,4937],{"class":43,"line":543},[41,4927,4928],{"class":51},"            model",[41,4930,30],{"class":47},[41,4932,251],{"class":47},[41,4934,381],{"class":68},[41,4936,230],{"class":47},[41,4938,936],{"class":47},[41,4940,4941,4944,4946,4949,4952,4954,4956,4959,4961,4964,4966,4969],{"class":43,"line":569},[41,4942,4943],{"class":51},"            tryonItems",[41,4945,30],{"class":47},[41,4947,4948],{"class":126}," [",[41,4950,4951],{"class":47},"{",[41,4953,4770],{"class":126},[41,4955,238],{"class":47},[41,4957,4958],{"class":51}," url",[41,4960,30],{"class":47},[41,4962,4963],{"class":126}," imageUrl ",[41,4965,886],{"class":47},[41,4967,4968],{"class":126},"]",[41,4970,936],{"class":47},[41,4972,4973,4976],{"class":43,"line":574},[41,4974,4975],{"class":47},"          }",[41,4977,566],{"class":126},[41,4979,4980],{"class":43,"line":579},[41,4981,4982],{"class":47},"        }\n",[41,4984,4985],{"class":43,"line":596},[41,4986,2518],{"class":47},[41,4988,4989],{"class":43,"line":616},[41,4990,4991],{"class":126},"        Try On\n",[41,4993,4994,4996,4998],{"class":43,"line":621},[41,4995,2588],{"class":47},[41,4997,729],{"class":51},[41,4999,99],{"class":47},[41,5001,5002,5004,5006],{"class":43,"line":626},[41,5003,3220],{"class":47},[41,5005,679],{"class":51},[41,5007,99],{"class":47},[41,5009,5010,5012],{"class":43,"line":644},[41,5011,2602],{"class":51},[41,5013,210],{"class":47},[41,5015,5016],{"class":43,"line":1007},[41,5017,343],{"class":47},[1035,5019,5020],{},"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":37,"searchDepth":55,"depth":55,"links":5022},[5023,5024,5025],{"id":21,"depth":55,"text":22},{"id":4369,"depth":55,"text":4370},{"id":4683,"depth":55,"text":4684},"Integrate with a React (Vite \u002F CRA) app","i-lucide-react",{},"\u002Fen\u002Fintegrations\u002Freact",{"title":4155,"description":5026},"en\u002Fintegrations\u002Freact","pb3AGE_nU_OjJFKOaRsB1vUMbyzjRuGZlTgplr5i71Q",{"id":5034,"title":5035,"body":5036,"description":5703,"extension":1044,"icon":5704,"meta":5705,"navigation":348,"path":5706,"seo":5707,"stem":5708,"__hash__":5709},"content\u002Fen\u002Fintegrations\u002Fvanilla-js.md","Vanilla JS",{"type":7,"value":5037,"toc":5699},[5038,5042,5045,5049,5673,5677,5696],[10,5039,5041],{"id":5040},"vanilla-js-integration","Vanilla JS Integration",[15,5043,5044],{},"No framework needed — just HTML and JavaScript.",[19,5046,5048],{"id":5047},"full-example","Full Example",[32,5050,5052],{"className":34,"code":5051,"language":36,"meta":37,"style":37},"\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",[27,5053,5054,5067,5086,5095,5115,5147,5165,5173,5182,5186,5202,5219,5223,5228,5261,5265,5295,5299,5304,5310,5323,5336,5345,5349,5354,5372,5396,5439,5444,5464,5477,5485,5493,5497,5505,5518,5540,5556,5572,5582,5587,5602,5618,5623,5630,5640,5646,5655,5664],{"__ignoreMap":37},[41,5055,5056,5059,5062,5065],{"class":43,"line":44},[41,5057,5058],{"class":47},"\u003C!",[41,5060,5061],{"class":51},"DOCTYPE",[41,5063,5064],{"class":58}," html",[41,5066,99],{"class":47},[41,5068,5069,5071,5073,5075,5077,5079,5082,5084],{"class":43,"line":55},[41,5070,48],{"class":47},[41,5072,36],{"class":51},[41,5074,786],{"class":58},[41,5076,62],{"class":47},[41,5078,65],{"class":47},[41,5080,5081],{"class":68},"en",[41,5083,65],{"class":47},[41,5085,99],{"class":47},[41,5087,5088,5090,5093],{"class":43,"line":75},[41,5089,48],{"class":47},[41,5091,5092],{"class":51},"head",[41,5094,99],{"class":47},[41,5096,5097,5099,5101,5104,5106,5108,5111,5113],{"class":43,"line":90},[41,5098,676],{"class":47},[41,5100,3568],{"class":51},[41,5102,5103],{"class":58}," charset",[41,5105,62],{"class":47},[41,5107,65],{"class":47},[41,5109,5110],{"class":68},"UTF-8",[41,5112,65],{"class":47},[41,5114,3388],{"class":47},[41,5116,5117,5119,5121,5124,5126,5128,5131,5133,5136,5138,5140,5143,5145],{"class":43,"line":102},[41,5118,676],{"class":47},[41,5120,3568],{"class":51},[41,5122,5123],{"class":58}," name",[41,5125,62],{"class":47},[41,5127,65],{"class":47},[41,5129,5130],{"class":68},"viewport",[41,5132,65],{"class":47},[41,5134,5135],{"class":58}," content",[41,5137,62],{"class":47},[41,5139,65],{"class":47},[41,5141,5142],{"class":68},"width=device-width, initial-scale=1.0",[41,5144,65],{"class":47},[41,5146,3388],{"class":47},[41,5148,5149,5151,5154,5156,5159,5161,5163],{"class":43,"line":123},[41,5150,676],{"class":47},[41,5152,5153],{"class":51},"title",[41,5155,744],{"class":47},[41,5157,5158],{"class":126},"Product Page — Virtual Try-On",[41,5160,273],{"class":47},[41,5162,5153],{"class":51},[41,5164,99],{"class":47},[41,5166,5167,5169,5171],{"class":43,"line":157},[41,5168,273],{"class":47},[41,5170,5092],{"class":51},[41,5172,99],{"class":47},[41,5174,5175,5177,5180],{"class":43,"line":213},[41,5176,48],{"class":47},[41,5178,5179],{"class":51},"body",[41,5181,99],{"class":47},[41,5183,5184],{"class":43,"line":219},[41,5185,349],{"emptyLinePlaceholder":348},[41,5187,5188,5190,5192,5194,5196,5198,5200],{"class":43,"line":243},[41,5189,676],{"class":47},[41,5191,10],{"class":51},[41,5193,744],{"class":47},[41,5195,2112],{"class":126},[41,5197,273],{"class":47},[41,5199,10],{"class":51},[41,5201,99],{"class":47},[41,5203,5204,5206,5208,5210,5213,5215,5217],{"class":43,"line":260},[41,5205,676],{"class":47},[41,5207,15],{"class":51},[41,5209,744],{"class":47},[41,5211,5212],{"class":126},"$89.00",[41,5214,273],{"class":47},[41,5216,15],{"class":51},[41,5218,99],{"class":47},[41,5220,5221],{"class":43,"line":270},[41,5222,349],{"emptyLinePlaceholder":348},[41,5224,5225],{"class":43,"line":421},[41,5226,5227],{"class":293},"  \u003C!-- Widget container -->\n",[41,5229,5230,5232,5234,5236,5238,5240,5242,5244,5246,5248,5250,5253,5255,5257,5259],{"class":43,"line":426},[41,5231,676],{"class":47},[41,5233,679],{"class":51},[41,5235,109],{"class":58},[41,5237,62],{"class":47},[41,5239,65],{"class":47},[41,5241,701],{"class":68},[41,5243,65],{"class":47},[41,5245,2882],{"class":58},[41,5247,62],{"class":47},[41,5249,65],{"class":47},[41,5251,5252],{"class":68},"width: 100%; max-width: 600px; aspect-ratio: 3 \u002F 4;",[41,5254,65],{"class":47},[41,5256,93],{"class":47},[41,5258,679],{"class":51},[41,5260,99],{"class":47},[41,5262,5263],{"class":43,"line":438},[41,5264,349],{"emptyLinePlaceholder":348},[41,5266,5267,5269,5271,5274,5276,5278,5281,5283,5285,5287,5289,5291,5293],{"class":43,"line":449},[41,5268,676],{"class":47},[41,5270,729],{"class":51},[41,5272,5273],{"class":58}," onclick",[41,5275,62],{"class":47},[41,5277,65],{"class":47},[41,5279,5280],{"class":197},"openWidget",[41,5282,151],{"class":68},[41,5284,65],{"class":47},[41,5286,744],{"class":47},[41,5288,747],{"class":126},[41,5290,273],{"class":47},[41,5292,729],{"class":51},[41,5294,99],{"class":47},[41,5296,5297],{"class":43,"line":487},[41,5298,349],{"emptyLinePlaceholder":348},[41,5300,5301],{"class":43,"line":493},[41,5302,5303],{"class":293},"  \u003C!-- 1. Load the widget bundle -->\n",[41,5305,5306,5308],{"class":43,"line":498},[41,5307,676],{"class":47},[41,5309,52],{"class":51},[41,5311,5312,5315,5317,5319,5321],{"class":43,"line":503},[41,5313,5314],{"class":58},"    src",[41,5316,62],{"class":47},[41,5318,65],{"class":47},[41,5320,69],{"class":68},[41,5322,72],{"class":47},[41,5324,5325,5328,5330,5332,5334],{"class":43,"line":517},[41,5326,5327],{"class":58},"    id",[41,5329,62],{"class":47},[41,5331,65],{"class":47},[41,5333,85],{"class":68},[41,5335,72],{"class":47},[41,5337,5338,5341,5343],{"class":43,"line":543},[41,5339,5340],{"class":47},"  >\u003C\u002F",[41,5342,96],{"class":51},[41,5344,99],{"class":47},[41,5346,5347],{"class":43,"line":569},[41,5348,349],{"emptyLinePlaceholder":348},[41,5350,5351],{"class":43,"line":574},[41,5352,5353],{"class":293},"  \u003C!-- 2. Initialize -->\n",[41,5355,5356,5358,5360,5362,5364,5366,5368,5370],{"class":43,"line":579},[41,5357,676],{"class":47},[41,5359,96],{"class":51},[41,5361,109],{"class":58},[41,5363,62],{"class":47},[41,5365,65],{"class":47},[41,5367,116],{"class":68},[41,5369,65],{"class":47},[41,5371,99],{"class":47},[41,5373,5374,5376,5378,5380,5382,5384,5386,5388,5390,5392,5394],{"class":43,"line":596},[41,5375,546],{"class":126},[41,5377,130],{"class":47},[41,5379,133],{"class":126},[41,5381,62],{"class":47},[41,5383,138],{"class":126},[41,5385,130],{"class":47},[41,5387,133],{"class":126},[41,5389,145],{"class":47},[41,5391,148],{"class":58},[41,5393,151],{"class":47},[41,5395,154],{"class":47},[41,5397,5398,5401,5403,5405,5407,5409,5411,5413,5415,5417,5419,5421,5423,5425,5427,5429,5431,5433,5435,5437],{"class":43,"line":616},[41,5399,5400],{"class":51},"      (",[41,5402,163],{"class":126},[41,5404,130],{"class":47},[41,5406,168],{"class":126},[41,5408,130],{"class":47},[41,5410,173],{"class":126},[41,5412,176],{"class":47},[41,5414,138],{"class":126},[41,5416,130],{"class":47},[41,5418,168],{"class":126},[41,5420,130],{"class":47},[41,5422,173],{"class":126},[41,5424,189],{"class":47},[41,5426,192],{"class":51},[41,5428,130],{"class":47},[41,5430,198],{"class":197},[41,5432,201],{"class":51},[41,5434,204],{"class":126},[41,5436,207],{"class":51},[41,5438,210],{"class":47},[41,5440,5441],{"class":43,"line":621},[41,5442,5443],{"class":47},"    };\n",[41,5445,5446,5448,5450,5452,5454,5456,5458,5460,5462],{"class":43,"line":626},[41,5447,546],{"class":126},[41,5449,130],{"class":47},[41,5451,168],{"class":197},[41,5453,201],{"class":126},[41,5455,230],{"class":47},[41,5457,233],{"class":68},[41,5459,230],{"class":47},[41,5461,238],{"class":47},[41,5463,154],{"class":47},[41,5465,5466,5469,5471,5473,5475],{"class":43,"line":644},[41,5467,5468],{"class":51},"      apiKey",[41,5470,30],{"class":47},[41,5472,251],{"class":47},[41,5474,254],{"class":68},[41,5476,257],{"class":47},[41,5478,5479,5481,5483],{"class":43,"line":1007},[41,5480,2841],{"class":47},[41,5482,207],{"class":126},[41,5484,210],{"class":47},[41,5486,5487,5489,5491],{"class":43,"line":1015},[41,5488,758],{"class":47},[41,5490,96],{"class":51},[41,5492,99],{"class":47},[41,5494,5495],{"class":43,"line":1022},[41,5496,349],{"emptyLinePlaceholder":348},[41,5498,5499,5501,5503],{"class":43,"line":1027},[41,5500,676],{"class":47},[41,5502,96],{"class":51},[41,5504,99],{"class":47},[41,5506,5508,5511,5514,5516],{"class":43,"line":5507},35,[41,5509,5510],{"class":58},"    function",[41,5512,5513],{"class":197}," openWidget",[41,5515,151],{"class":47},[41,5517,154],{"class":47},[41,5519,5521,5524,5526,5528,5530,5532,5534,5536,5538],{"class":43,"line":5520},36,[41,5522,5523],{"class":126},"      window",[41,5525,130],{"class":47},[41,5527,168],{"class":197},[41,5529,201],{"class":51},[41,5531,230],{"class":47},[41,5533,557],{"class":68},[41,5535,230],{"class":47},[41,5537,238],{"class":47},[41,5539,154],{"class":47},[41,5541,5543,5546,5548,5550,5552,5554],{"class":43,"line":5542},37,[41,5544,5545],{"class":51},"        targetElementId",[41,5547,30],{"class":47},[41,5549,251],{"class":47},[41,5551,701],{"class":68},[41,5553,230],{"class":47},[41,5555,936],{"class":47},[41,5557,5559,5562,5564,5566,5568,5570],{"class":43,"line":5558},38,[41,5560,5561],{"class":51},"        model",[41,5563,30],{"class":47},[41,5565,251],{"class":47},[41,5567,381],{"class":68},[41,5569,230],{"class":47},[41,5571,936],{"class":47},[41,5573,5575,5578,5580],{"class":43,"line":5574},39,[41,5576,5577],{"class":51},"        tryonItems",[41,5579,30],{"class":47},[41,5581,961],{"class":51},[41,5583,5585],{"class":43,"line":5584},40,[41,5586,3169],{"class":47},[41,5588,5590,5592,5594,5596,5598,5600],{"class":43,"line":5589},41,[41,5591,3174],{"class":51},[41,5593,30],{"class":47},[41,5595,251],{"class":47},[41,5597,2112],{"class":68},[41,5599,230],{"class":47},[41,5601,936],{"class":47},[41,5603,5605,5607,5609,5611,5614,5616],{"class":43,"line":5604},42,[41,5606,3189],{"class":51},[41,5608,30],{"class":47},[41,5610,251],{"class":47},[41,5612,5613],{"class":68},"https:\u002F\u002Fexample.com\u002Fimages\u002Fjacket.jpg",[41,5615,230],{"class":47},[41,5617,936],{"class":47},[41,5619,5621],{"class":43,"line":5620},43,[41,5622,3204],{"class":47},[41,5624,5626,5628],{"class":43,"line":5625},44,[41,5627,3209],{"class":51},[41,5629,936],{"class":47},[41,5631,5633,5636,5638],{"class":43,"line":5632},45,[41,5634,5635],{"class":47},"      }",[41,5637,207],{"class":51},[41,5639,210],{"class":47},[41,5641,5643],{"class":43,"line":5642},46,[41,5644,5645],{"class":47},"    }\n",[41,5647,5649,5651,5653],{"class":43,"line":5648},47,[41,5650,758],{"class":47},[41,5652,96],{"class":51},[41,5654,99],{"class":47},[41,5656,5658,5660,5662],{"class":43,"line":5657},48,[41,5659,273],{"class":47},[41,5661,5179],{"class":51},[41,5663,99],{"class":47},[41,5665,5667,5669,5671],{"class":43,"line":5666},49,[41,5668,273],{"class":47},[41,5670,36],{"class":51},[41,5672,99],{"class":47},[19,5674,5676],{"id":5675},"key-points","Key Points",[2162,5678,5679,5682,5691],{},[2165,5680,5681],{},"Load the bundle script first.",[2165,5683,5684,5685,5688,5689,130],{},"Initialize with ",[27,5686,5687],{},"window.fitting('init', { apiKey })"," before calling ",[27,5690,557],{},[2165,5692,2207,5693,5695],{},[27,5694,1195],{}," must match an existing element on the page.",[1035,5697,5698],{},"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":37,"searchDepth":55,"depth":55,"links":5700},[5701,5702],{"id":5047,"depth":55,"text":5048},{"id":5675,"depth":55,"text":5676},"Integrate with plain HTML\u002FJavaScript","i-lucide-file-code",{},"\u002Fen\u002Fintegrations\u002Fvanilla-js",{"title":5035,"description":5703},"en\u002Fintegrations\u002Fvanilla-js","Ts8msIFer-tIlPDRwRbkNZSpWu0JrTJP8uMKqB57tJQ",{"id":4,"title":5,"body":5711,"description":1043,"extension":1044,"icon":1045,"meta":6532,"navigation":348,"path":1047,"seo":6533,"stem":1049,"__hash__":1050},{"type":7,"value":5712,"toc":6527},[5713,5715,5717,5719,5723,5901,5903,6195,6197,6525],[10,5714,13],{"id":12},[15,5716,17],{},[19,5718,22],{"id":21},[15,5720,25,5721,30],{},[27,5722,29],{},[32,5724,5725],{"className":34,"code":35,"language":36,"meta":37,"style":37},[27,5726,5727,5733,5745,5757,5765,5783,5807,5849,5853,5873,5885,5893],{"__ignoreMap":37},[41,5728,5729,5731],{"class":43,"line":44},[41,5730,48],{"class":47},[41,5732,52],{"class":51},[41,5734,5735,5737,5739,5741,5743],{"class":43,"line":55},[41,5736,59],{"class":58},[41,5738,62],{"class":47},[41,5740,65],{"class":47},[41,5742,69],{"class":68},[41,5744,72],{"class":47},[41,5746,5747,5749,5751,5753,5755],{"class":43,"line":75},[41,5748,78],{"class":58},[41,5750,62],{"class":47},[41,5752,65],{"class":47},[41,5754,85],{"class":68},[41,5756,72],{"class":47},[41,5758,5759,5761,5763],{"class":43,"line":90},[41,5760,93],{"class":47},[41,5762,96],{"class":51},[41,5764,99],{"class":47},[41,5766,5767,5769,5771,5773,5775,5777,5779,5781],{"class":43,"line":102},[41,5768,48],{"class":47},[41,5770,96],{"class":51},[41,5772,109],{"class":58},[41,5774,62],{"class":47},[41,5776,65],{"class":47},[41,5778,116],{"class":68},[41,5780,65],{"class":47},[41,5782,99],{"class":47},[41,5784,5785,5787,5789,5791,5793,5795,5797,5799,5801,5803,5805],{"class":43,"line":123},[41,5786,127],{"class":126},[41,5788,130],{"class":47},[41,5790,133],{"class":126},[41,5792,62],{"class":47},[41,5794,138],{"class":126},[41,5796,130],{"class":47},[41,5798,133],{"class":126},[41,5800,145],{"class":47},[41,5802,148],{"class":58},[41,5804,151],{"class":47},[41,5806,154],{"class":47},[41,5808,5809,5811,5813,5815,5817,5819,5821,5823,5825,5827,5829,5831,5833,5835,5837,5839,5841,5843,5845,5847],{"class":43,"line":157},[41,5810,160],{"class":51},[41,5812,163],{"class":126},[41,5814,130],{"class":47},[41,5816,168],{"class":126},[41,5818,130],{"class":47},[41,5820,173],{"class":126},[41,5822,176],{"class":47},[41,5824,138],{"class":126},[41,5826,130],{"class":47},[41,5828,168],{"class":126},[41,5830,130],{"class":47},[41,5832,173],{"class":126},[41,5834,189],{"class":47},[41,5836,192],{"class":51},[41,5838,130],{"class":47},[41,5840,198],{"class":197},[41,5842,201],{"class":51},[41,5844,204],{"class":126},[41,5846,207],{"class":51},[41,5848,210],{"class":47},[41,5850,5851],{"class":43,"line":213},[41,5852,216],{"class":47},[41,5854,5855,5857,5859,5861,5863,5865,5867,5869,5871],{"class":43,"line":219},[41,5856,127],{"class":126},[41,5858,130],{"class":47},[41,5860,168],{"class":197},[41,5862,201],{"class":126},[41,5864,230],{"class":47},[41,5866,233],{"class":68},[41,5868,230],{"class":47},[41,5870,238],{"class":47},[41,5872,154],{"class":47},[41,5874,5875,5877,5879,5881,5883],{"class":43,"line":243},[41,5876,246],{"class":51},[41,5878,30],{"class":47},[41,5880,251],{"class":47},[41,5882,254],{"class":68},[41,5884,257],{"class":47},[41,5886,5887,5889,5891],{"class":43,"line":260},[41,5888,263],{"class":47},[41,5890,207],{"class":126},[41,5892,210],{"class":47},[41,5894,5895,5897,5899],{"class":43,"line":270},[41,5896,273],{"class":47},[41,5898,96],{"class":51},[41,5900,99],{"class":47},[19,5902,281],{"id":280},[32,5904,5905],{"className":284,"code":285,"language":286,"meta":37,"style":37},[27,5906,5907,5911,5921,5929,5937,5945,5949,5953,5963,5971,5999,6009,6013,6017,6025,6033,6061,6065,6069,6073,6085,6107,6129,6133,6137,6151,6169,6173,6177,6191],{"__ignoreMap":37},[41,5908,5909],{"class":43,"line":44},[41,5910,294],{"class":293},[41,5912,5913,5915,5917,5919],{"class":43,"line":55},[41,5914,300],{"class":299},[41,5916,303],{"class":58},[41,5918,307],{"class":306},[41,5920,154],{"class":47},[41,5922,5923,5925,5927],{"class":43,"line":75},[41,5924,314],{"class":51},[41,5926,30],{"class":47},[41,5928,319],{"class":306},[41,5930,5931,5933,5935],{"class":43,"line":90},[41,5932,324],{"class":51},[41,5934,30],{"class":47},[41,5936,319],{"class":306},[41,5938,5939,5941,5943],{"class":43,"line":102},[41,5940,333],{"class":51},[41,5942,336],{"class":47},[41,5944,319],{"class":306},[41,5946,5947],{"class":43,"line":123},[41,5948,343],{"class":47},[41,5950,5951],{"class":43,"line":157},[41,5952,349],{"emptyLinePlaceholder":348},[41,5954,5955,5957,5959,5961],{"class":43,"line":213},[41,5956,300],{"class":299},[41,5958,303],{"class":58},[41,5960,358],{"class":306},[41,5962,154],{"class":47},[41,5964,5965,5967,5969],{"class":43,"line":219},[41,5966,365],{"class":51},[41,5968,30],{"class":47},[41,5970,319],{"class":306},[41,5972,5973,5975,5977,5979,5981,5983,5985,5987,5989,5991,5993,5995,5997],{"class":43,"line":243},[41,5974,374],{"class":51},[41,5976,336],{"class":47},[41,5978,251],{"class":47},[41,5980,381],{"class":68},[41,5982,230],{"class":47},[41,5984,386],{"class":47},[41,5986,251],{"class":47},[41,5988,391],{"class":68},[41,5990,230],{"class":47},[41,5992,386],{"class":47},[41,5994,251],{"class":47},[41,5996,400],{"class":68},[41,5998,257],{"class":47},[41,6000,6001,6003,6005,6007],{"class":43,"line":260},[41,6002,407],{"class":51},[41,6004,30],{"class":47},[41,6006,307],{"class":306},[41,6008,414],{"class":126},[41,6010,6011],{"class":43,"line":270},[41,6012,343],{"class":47},[41,6014,6015],{"class":43,"line":421},[41,6016,349],{"emptyLinePlaceholder":348},[41,6018,6019,6021,6023],{"class":43,"line":426},[41,6020,429],{"class":58},[41,6022,432],{"class":126},[41,6024,435],{"class":47},[41,6026,6027,6029,6031],{"class":43,"line":438},[41,6028,441],{"class":58},[41,6030,444],{"class":306},[41,6032,154],{"class":47},[41,6034,6035,6037,6039,6041,6043,6045,6047,6049,6051,6053,6055,6057,6059],{"class":43,"line":449},[41,6036,452],{"class":51},[41,6038,30],{"class":47},[41,6040,457],{"class":47},[41,6042,461],{"class":460},[41,6044,30],{"class":47},[41,6046,466],{"class":306},[41,6048,238],{"class":47},[41,6050,471],{"class":460},[41,6052,336],{"class":47},[41,6054,476],{"class":306},[41,6056,207],{"class":47},[41,6058,481],{"class":58},[41,6060,484],{"class":306},[41,6062,6063],{"class":43,"line":487},[41,6064,490],{"class":47},[41,6066,6067],{"class":43,"line":493},[41,6068,343],{"class":47},[41,6070,6071],{"class":43,"line":498},[41,6072,349],{"emptyLinePlaceholder":348},[41,6074,6075,6077,6079,6081,6083],{"class":43,"line":503},[41,6076,300],{"class":299},[41,6078,148],{"class":58},[41,6080,510],{"class":197},[41,6082,151],{"class":47},[41,6084,154],{"class":47},[41,6086,6087,6089,6091,6093,6095,6097,6099,6101,6103,6105],{"class":43,"line":517},[41,6088,520],{"class":58},[41,6090,523],{"class":126},[41,6092,176],{"class":47},[41,6094,457],{"class":47},[41,6096,530],{"class":460},[41,6098,30],{"class":47},[41,6100,358],{"class":306},[41,6102,207],{"class":47},[41,6104,481],{"class":58},[41,6106,154],{"class":47},[41,6108,6109,6111,6113,6115,6117,6119,6121,6123,6125,6127],{"class":43,"line":543},[41,6110,546],{"class":126},[41,6112,130],{"class":47},[41,6114,168],{"class":197},[41,6116,201],{"class":51},[41,6118,230],{"class":47},[41,6120,557],{"class":68},[41,6122,230],{"class":47},[41,6124,238],{"class":47},[41,6126,471],{"class":126},[41,6128,566],{"class":51},[41,6130,6131],{"class":43,"line":569},[41,6132,490],{"class":47},[41,6134,6135],{"class":43,"line":574},[41,6136,349],{"emptyLinePlaceholder":348},[41,6138,6139,6141,6143,6145,6147,6149],{"class":43,"line":579},[41,6140,520],{"class":58},[41,6142,584],{"class":126},[41,6144,176],{"class":47},[41,6146,589],{"class":47},[41,6148,481],{"class":58},[41,6150,154],{"class":47},[41,6152,6153,6155,6157,6159,6161,6163,6165,6167],{"class":43,"line":596},[41,6154,546],{"class":126},[41,6156,130],{"class":47},[41,6158,168],{"class":197},[41,6160,201],{"class":51},[41,6162,230],{"class":47},[41,6164,609],{"class":68},[41,6166,230],{"class":47},[41,6168,566],{"class":51},[41,6170,6171],{"class":43,"line":616},[41,6172,490],{"class":47},[41,6174,6175],{"class":43,"line":621},[41,6176,349],{"emptyLinePlaceholder":348},[41,6178,6179,6181,6183,6185,6187,6189],{"class":43,"line":626},[41,6180,629],{"class":299},[41,6182,632],{"class":47},[41,6184,523],{"class":126},[41,6186,238],{"class":47},[41,6188,584],{"class":126},[41,6190,641],{"class":47},[41,6192,6193],{"class":43,"line":644},[41,6194,343],{"class":47},[19,6196,650],{"id":649},[32,6198,6199],{"className":653,"code":654,"language":655,"meta":37,"style":37},[27,6200,6201,6205,6213,6221,6227,6239,6251,6255,6281,6289,6297,6301,6321,6345,6349,6361,6369,6377,6383,6387,6403,6407,6421,6429,6443,6457,6465,6469,6483,6497,6501,6507,6513,6517],{"__ignoreMap":37},[41,6202,6203],{"class":43,"line":44},[41,6204,662],{"class":293},[41,6206,6207,6209,6211],{"class":43,"line":55},[41,6208,48],{"class":47},[41,6210,669],{"class":51},[41,6212,99],{"class":47},[41,6214,6215,6217,6219],{"class":43,"line":75},[41,6216,676],{"class":47},[41,6218,679],{"class":51},[41,6220,99],{"class":47},[41,6222,6223,6225],{"class":43,"line":90},[41,6224,686],{"class":47},[41,6226,689],{"class":51},[41,6228,6229,6231,6233,6235,6237],{"class":43,"line":102},[41,6230,694],{"class":58},[41,6232,62],{"class":47},[41,6234,65],{"class":47},[41,6236,701],{"class":68},[41,6238,72],{"class":47},[41,6240,6241,6243,6245,6247,6249],{"class":43,"line":123},[41,6242,708],{"class":58},[41,6244,62],{"class":47},[41,6246,65],{"class":47},[41,6248,715],{"class":68},[41,6250,72],{"class":47},[41,6252,6253],{"class":43,"line":157},[41,6254,722],{"class":47},[41,6256,6257,6259,6261,6263,6265,6267,6269,6271,6273,6275,6277,6279],{"class":43,"line":213},[41,6258,686],{"class":47},[41,6260,729],{"class":51},[41,6262,732],{"class":58},[41,6264,62],{"class":47},[41,6266,65],{"class":47},[41,6268,739],{"class":68},[41,6270,65],{"class":47},[41,6272,744],{"class":47},[41,6274,747],{"class":126},[41,6276,273],{"class":47},[41,6278,729],{"class":51},[41,6280,99],{"class":47},[41,6282,6283,6285,6287],{"class":43,"line":219},[41,6284,758],{"class":47},[41,6286,679],{"class":51},[41,6288,99],{"class":47},[41,6290,6291,6293,6295],{"class":43,"line":243},[41,6292,273],{"class":47},[41,6294,669],{"class":51},[41,6296,99],{"class":47},[41,6298,6299],{"class":43,"line":260},[41,6300,349],{"emptyLinePlaceholder":348},[41,6302,6303,6305,6307,6309,6311,6313,6315,6317,6319],{"class":43,"line":270},[41,6304,48],{"class":47},[41,6306,96],{"class":51},[41,6308,783],{"class":58},[41,6310,786],{"class":58},[41,6312,62],{"class":47},[41,6314,65],{"class":47},[41,6316,286],{"class":68},[41,6318,65],{"class":47},[41,6320,99],{"class":47},[41,6322,6323,6325,6327,6329,6331,6333,6335,6337,6339,6341,6343],{"class":43,"line":421},[41,6324,801],{"class":299},[41,6326,632],{"class":47},[41,6328,510],{"class":126},[41,6330,238],{"class":47},[41,6332,810],{"class":299},[41,6334,307],{"class":126},[41,6336,815],{"class":47},[41,6338,818],{"class":299},[41,6340,251],{"class":47},[41,6342,823],{"class":68},[41,6344,257],{"class":47},[41,6346,6347],{"class":43,"line":426},[41,6348,349],{"emptyLinePlaceholder":348},[41,6350,6351,6353,6355,6357,6359],{"class":43,"line":438},[41,6352,834],{"class":58},[41,6354,837],{"class":126},[41,6356,62],{"class":47},[41,6358,842],{"class":197},[41,6360,845],{"class":47},[41,6362,6363,6365,6367],{"class":43,"line":449},[41,6364,314],{"class":51},[41,6366,30],{"class":47},[41,6368,319],{"class":306},[41,6370,6371,6373,6375],{"class":43,"line":487},[41,6372,858],{"class":51},[41,6374,30],{"class":47},[41,6376,319],{"class":306},[41,6378,6379,6381],{"class":43,"line":493},[41,6380,867],{"class":47},[41,6382,870],{"class":126},[41,6384,6385],{"class":43,"line":498},[41,6386,349],{"emptyLinePlaceholder":348},[41,6388,6389,6391,6393,6395,6397,6399,6401],{"class":43,"line":503},[41,6390,834],{"class":58},[41,6392,632],{"class":47},[41,6394,883],{"class":126},[41,6396,886],{"class":47},[41,6398,176],{"class":47},[41,6400,510],{"class":197},[41,6402,870],{"class":126},[41,6404,6405],{"class":43,"line":517},[41,6406,349],{"emptyLinePlaceholder":348},[41,6408,6409,6411,6413,6415,6417,6419],{"class":43,"line":543},[41,6410,834],{"class":58},[41,6412,903],{"class":126},[41,6414,62],{"class":47},[41,6416,589],{"class":47},[41,6418,481],{"class":58},[41,6420,154],{"class":47},[41,6422,6423,6425,6427],{"class":43,"line":569},[41,6424,916],{"class":197},[41,6426,201],{"class":51},[41,6428,435],{"class":47},[41,6430,6431,6433,6435,6437,6439,6441],{"class":43,"line":574},[41,6432,925],{"class":51},[41,6434,30],{"class":47},[41,6436,251],{"class":47},[41,6438,701],{"class":68},[41,6440,230],{"class":47},[41,6442,936],{"class":47},[41,6444,6445,6447,6449,6451,6453,6455],{"class":43,"line":579},[41,6446,941],{"class":51},[41,6448,30],{"class":47},[41,6450,251],{"class":47},[41,6452,381],{"class":68},[41,6454,230],{"class":47},[41,6456,936],{"class":47},[41,6458,6459,6461,6463],{"class":43,"line":596},[41,6460,956],{"class":51},[41,6462,30],{"class":47},[41,6464,961],{"class":51},[41,6466,6467],{"class":43,"line":616},[41,6468,966],{"class":47},[41,6470,6471,6473,6475,6477,6479,6481],{"class":43,"line":621},[41,6472,971],{"class":51},[41,6474,30],{"class":47},[41,6476,976],{"class":126},[41,6478,130],{"class":47},[41,6480,981],{"class":126},[41,6482,936],{"class":47},[41,6484,6485,6487,6489,6491,6493,6495],{"class":43,"line":626},[41,6486,988],{"class":51},[41,6488,30],{"class":47},[41,6490,976],{"class":126},[41,6492,130],{"class":47},[41,6494,997],{"class":126},[41,6496,936],{"class":47},[41,6498,6499],{"class":43,"line":644},[41,6500,1004],{"class":47},[41,6502,6503,6505],{"class":43,"line":1007},[41,6504,1010],{"class":51},[41,6506,936],{"class":47},[41,6508,6509,6511],{"class":43,"line":1015},[41,6510,263],{"class":47},[41,6512,566],{"class":51},[41,6514,6515],{"class":43,"line":1022},[41,6516,343],{"class":47},[41,6518,6519,6521,6523],{"class":43,"line":1027},[41,6520,273],{"class":47},[41,6522,96],{"class":51},[41,6524,99],{"class":47},[1035,6526,1037],{},{"title":37,"searchDepth":55,"depth":55,"links":6528},[6529,6530,6531],{"id":21,"depth":55,"text":22},{"id":280,"depth":55,"text":281},{"id":649,"depth":55,"text":650},{},{"title":5,"description":1043},{"id":6535,"title":6536,"body":6537,"description":6946,"extension":1044,"icon":2190,"meta":6947,"navigation":348,"path":2273,"seo":6948,"stem":6949,"__hash__":6950},"content\u002Fgetting-started\u002Fquick-start.md","Быстрый старт",{"type":7,"value":6538,"toc":6937},[6539,6542,6545,6549,6556,6560,6568,6610,6614,6754,6758,6764,6790,6794,6800,6910,6914,6917,6921,6934],[10,6540,6536],{"id":6541},"быстрый-старт",[15,6543,6544],{},"Следуйте этим шагам, чтобы добавить виртуальную примерку на ваш сайт.",[19,6546,6548],{"id":6547},"_1-получите-api-ключ","1. Получите API-ключ",[15,6550,6551,6552,6555],{},"Зарегистрируйтесь на ",[1779,6553,1784],{"href":1781,"rel":6554},[1783],", чтобы получить бесплатный API-ключ.",[19,6557,6559],{"id":6558},"_2-загрузите-скрипт-виджета","2. Загрузите скрипт виджета",[15,6561,6562,6563,6565,6566,30],{},"Добавьте следующий тег ",[27,6564,1795],{}," на страницу, желательно перед закрывающим тегом ",[27,6567,1799],{},[32,6569,6570],{"className":34,"code":1803,"language":36,"meta":37,"style":37},[27,6571,6572,6578,6590,6602],{"__ignoreMap":37},[41,6573,6574,6576],{"class":43,"line":44},[41,6575,48],{"class":47},[41,6577,52],{"class":51},[41,6579,6580,6582,6584,6586,6588],{"class":43,"line":55},[41,6581,59],{"class":58},[41,6583,62],{"class":47},[41,6585,65],{"class":47},[41,6587,69],{"class":68},[41,6589,72],{"class":47},[41,6591,6592,6594,6596,6598,6600],{"class":43,"line":75},[41,6593,78],{"class":58},[41,6595,62],{"class":47},[41,6597,65],{"class":47},[41,6599,85],{"class":68},[41,6601,72],{"class":47},[41,6603,6604,6606,6608],{"class":43,"line":90},[41,6605,93],{"class":47},[41,6607,96],{"class":51},[41,6609,99],{"class":47},[19,6611,6613],{"id":6612},"_3-инициализируйте-виджет","3. Инициализируйте виджет",[32,6615,6616],{"className":34,"code":1850,"language":36,"meta":37,"style":37},[27,6617,6618,6636,6660,6702,6706,6726,6738,6746],{"__ignoreMap":37},[41,6619,6620,6622,6624,6626,6628,6630,6632,6634],{"class":43,"line":44},[41,6621,48],{"class":47},[41,6623,96],{"class":51},[41,6625,109],{"class":58},[41,6627,62],{"class":47},[41,6629,65],{"class":47},[41,6631,116],{"class":68},[41,6633,65],{"class":47},[41,6635,99],{"class":47},[41,6637,6638,6640,6642,6644,6646,6648,6650,6652,6654,6656,6658],{"class":43,"line":55},[41,6639,127],{"class":126},[41,6641,130],{"class":47},[41,6643,133],{"class":126},[41,6645,62],{"class":47},[41,6647,138],{"class":126},[41,6649,130],{"class":47},[41,6651,133],{"class":126},[41,6653,145],{"class":47},[41,6655,148],{"class":58},[41,6657,151],{"class":47},[41,6659,154],{"class":47},[41,6661,6662,6664,6666,6668,6670,6672,6674,6676,6678,6680,6682,6684,6686,6688,6690,6692,6694,6696,6698,6700],{"class":43,"line":75},[41,6663,160],{"class":51},[41,6665,163],{"class":126},[41,6667,130],{"class":47},[41,6669,168],{"class":126},[41,6671,130],{"class":47},[41,6673,173],{"class":126},[41,6675,176],{"class":47},[41,6677,138],{"class":126},[41,6679,130],{"class":47},[41,6681,168],{"class":126},[41,6683,130],{"class":47},[41,6685,173],{"class":126},[41,6687,189],{"class":47},[41,6689,192],{"class":51},[41,6691,130],{"class":47},[41,6693,198],{"class":197},[41,6695,201],{"class":51},[41,6697,204],{"class":126},[41,6699,207],{"class":51},[41,6701,210],{"class":47},[41,6703,6704],{"class":43,"line":90},[41,6705,216],{"class":47},[41,6707,6708,6710,6712,6714,6716,6718,6720,6722,6724],{"class":43,"line":102},[41,6709,127],{"class":126},[41,6711,130],{"class":47},[41,6713,168],{"class":197},[41,6715,201],{"class":126},[41,6717,230],{"class":47},[41,6719,233],{"class":68},[41,6721,230],{"class":47},[41,6723,238],{"class":47},[41,6725,154],{"class":47},[41,6727,6728,6730,6732,6734,6736],{"class":43,"line":123},[41,6729,246],{"class":51},[41,6731,30],{"class":47},[41,6733,251],{"class":47},[41,6735,254],{"class":68},[41,6737,257],{"class":47},[41,6739,6740,6742,6744],{"class":43,"line":157},[41,6741,263],{"class":47},[41,6743,207],{"class":126},[41,6745,210],{"class":47},[41,6747,6748,6750,6752],{"class":43,"line":213},[41,6749,273],{"class":47},[41,6751,96],{"class":51},[41,6753,99],{"class":47},[19,6755,6757],{"id":6756},"_4-добавьте-контейнер","4. Добавьте контейнер",[15,6759,6760,6761,6763],{},"Разместите ",[27,6762,1998],{}," там, где должен отображаться виджет:",[32,6765,6766],{"className":34,"code":2002,"language":36,"meta":37,"style":37},[27,6767,6768],{"__ignoreMap":37},[41,6769,6770,6772,6774,6776,6778,6780,6782,6784,6786,6788],{"class":43,"line":44},[41,6771,48],{"class":47},[41,6773,679],{"class":51},[41,6775,109],{"class":58},[41,6777,62],{"class":47},[41,6779,65],{"class":47},[41,6781,701],{"class":68},[41,6783,65],{"class":47},[41,6785,93],{"class":47},[41,6787,679],{"class":51},[41,6789,99],{"class":47},[19,6791,6793],{"id":6792},"_5-запустите-виджет","5. Запустите виджет",[15,6795,6796,6797,6799],{},"Вызовите метод ",[27,6798,557],{}," при нажатии пользователем кнопки:",[32,6801,6802],{"className":1114,"code":2039,"language":1116,"meta":37,"style":37},[27,6803,6804,6824,6838,6852,6860,6864,6878,6892,6896,6902],{"__ignoreMap":37},[41,6805,6806,6808,6810,6812,6814,6816,6818,6820,6822],{"class":43,"line":44},[41,6807,163],{"class":126},[41,6809,130],{"class":47},[41,6811,168],{"class":197},[41,6813,201],{"class":126},[41,6815,230],{"class":47},[41,6817,557],{"class":68},[41,6819,230],{"class":47},[41,6821,238],{"class":47},[41,6823,154],{"class":47},[41,6825,6826,6828,6830,6832,6834,6836],{"class":43,"line":55},[41,6827,365],{"class":51},[41,6829,30],{"class":47},[41,6831,251],{"class":47},[41,6833,701],{"class":68},[41,6835,230],{"class":47},[41,6837,936],{"class":47},[41,6839,6840,6842,6844,6846,6848,6850],{"class":43,"line":75},[41,6841,374],{"class":51},[41,6843,30],{"class":47},[41,6845,251],{"class":47},[41,6847,381],{"class":68},[41,6849,230],{"class":47},[41,6851,936],{"class":47},[41,6853,6854,6856,6858],{"class":43,"line":90},[41,6855,407],{"class":51},[41,6857,30],{"class":47},[41,6859,961],{"class":126},[41,6861,6862],{"class":43,"line":102},[41,6863,1355],{"class":47},[41,6865,6866,6868,6870,6872,6874,6876],{"class":43,"line":123},[41,6867,1360],{"class":51},[41,6869,30],{"class":47},[41,6871,251],{"class":47},[41,6873,2112],{"class":68},[41,6875,230],{"class":47},[41,6877,936],{"class":47},[41,6879,6880,6882,6884,6886,6888,6890],{"class":43,"line":157},[41,6881,1376],{"class":51},[41,6883,30],{"class":47},[41,6885,251],{"class":47},[41,6887,2127],{"class":68},[41,6889,230],{"class":47},[41,6891,936],{"class":47},[41,6893,6894],{"class":43,"line":213},[41,6895,1392],{"class":47},[41,6897,6898,6900],{"class":43,"line":219},[41,6899,1397],{"class":126},[41,6901,936],{"class":47},[41,6903,6904,6906,6908],{"class":43,"line":243},[41,6905,886],{"class":47},[41,6907,207],{"class":126},[41,6909,210],{"class":47},[19,6911,6913],{"id":6912},"результат","Результат",[15,6915,6916],{},"Теперь ваши покупатели могут загрузить фотографию и мгновенно увидеть, как на них сидит одежда.",[19,6918,6920],{"id":6919},"дальнейшие-шаги","Дальнейшие шаги",[2162,6922,6923,6929],{},[2165,6924,6925,6926,130],{},"Ознакомьтесь с руководствами для конкретных фреймворков в разделе ",[1779,6927,6928],{"href":2170},"Интеграции",[2165,6930,6931,6932,130],{},"Изучите полный ",[1779,6933,1054],{"href":1420},[1035,6935,6936],{},"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":37,"searchDepth":55,"depth":55,"links":6938},[6939,6940,6941,6942,6943,6944,6945],{"id":6547,"depth":55,"text":6548},{"id":6558,"depth":55,"text":6559},{"id":6612,"depth":55,"text":6613},{"id":6756,"depth":55,"text":6757},{"id":6792,"depth":55,"text":6793},{"id":6912,"depth":55,"text":6913},{"id":6919,"depth":55,"text":6920},"Запустите Fitting Widget за считанные минуты",{},{"title":6536,"description":6946},"getting-started\u002Fquick-start","4USnYxFPZA1hrOvVApcSHMt9oQc0aZ6Ct8ohgcj8WJ8",{"id":6952,"title":6953,"body":6954,"description":7032,"extension":1044,"icon":2281,"meta":7033,"navigation":348,"path":7034,"seo":7035,"stem":7036,"__hash__":7037},"content\u002Findex.md","Введение",{"type":7,"value":6955,"toc":7027},[6956,6960,6965,6969,6998,7002,7019,7021],[10,6957,6959],{"id":6958},"fitting-widget-виртуальная-примерка","Fitting Widget — Виртуальная примерка",[15,6961,6962,6964],{},[2209,6963,2211],{}," — это готовое решение для виртуальной примерки одежды в интернет-магазинах. Он позволяет вашим покупателям загрузить фотографию и мгновенно увидеть, как на них выглядит любой предмет одежды — прямо на странице товара.",[19,6966,6968],{"id":6967},"ключевые-возможности","Ключевые возможности",[2162,6970,6971,6980,6986,6992],{},[2165,6972,6973,6976,6977,6979],{},[2209,6974,6975],{},"Быстрая интеграция"," — Один тег ",[27,6978,1795],{}," и несколько строк кода.",[2165,6981,6982,6985],{},[2209,6983,6984],{},"Не зависит от фреймворков"," — Работает с Vanilla JS, React, Vue, Next.js, Nuxt и другими.",[2165,6987,6988,6991],{},[2209,6989,6990],{},"Настраиваемый"," — Стилизуйте виджет под ваш бренд.",[2165,6993,6994,6997],{},[2209,6995,6996],{},"Лёгкий"," — Оптимизированная загрузка, которая не замедляет магазин.",[19,6999,7001],{"id":7000},"как-это-работает","Как это работает",[2248,7003,7004,7007,7010,7016],{},[2165,7005,7006],{},"Загрузите скрипт виджета на страницу.",[2165,7008,7009],{},"Инициализируйте его с вашим API-ключом.",[2165,7011,7012,7013,7015],{},"Вызовите ",[27,7014,2261],{}," с URL-адресами изображений товаров.",[2165,7017,7018],{},"Виджет отображается внутри выбранного вами контейнера.",[19,7020,6536],{"id":6541},[15,7022,7023,7024,7026],{},"Перейдите к руководству ",[1779,7025,6536],{"href":2273},", чтобы начать работу менее чем за 5 минут.",{"title":37,"searchDepth":55,"depth":55,"links":7028},[7029,7030,7031],{"id":6967,"depth":55,"text":6968},{"id":7000,"depth":55,"text":7001},{"id":6541,"depth":55,"text":6536},"Что такое Fitting Widget и зачем его использовать?",{},"\u002F",{"title":6953,"description":7032},"index","kGT91Bb-Wx88tMoHoRu65KMhDKtcehaBgnLzJYfeCWE",{"id":7039,"title":2289,"body":7040,"description":7915,"extension":1044,"icon":3274,"meta":7916,"navigation":348,"path":7917,"seo":7918,"stem":7919,"__hash__":7920},"content\u002Fintegrations\u002Fnextjs.md",{"type":7,"value":7041,"toc":7906},[7042,7046,7054,7058,7066,7075,7311,7315,7643,7647,7883,7887,7892,7904],[10,7043,7045],{"id":7044},"интеграция-с-nextjs","Интеграция с Next.js",[15,7047,7048,7049,7051,7052,130],{},"Fitting Widget работает как с ",[2209,7050,2301],{},", так и с ",[2209,7053,2305],{},[19,7055,7057],{"id":7056},"app-router-рекомендуется","App Router (рекомендуется)",[15,7059,7060,7061,7063,7064,130],{},"Используйте компонент Next.js ",[27,7062,2315],{}," с ",[27,7065,2319],{},[1244,7067,7069,7070,7072,7073],{"id":7068},"шаг-1-загрузка-скриптов-в-layouttsx-или-pagetsx","Шаг 1 — Загрузка скриптов в ",[27,7071,2326],{}," или ",[27,7074,2330],{},[32,7076,7077],{"className":2333,"code":2334,"language":2335,"meta":37,"style":37},[27,7078,7079,7095,7099,7131,7137,7141,7149,7153,7159,7171,7183,7195,7199,7203,7209,7221,7233,7237,7243,7247,7251,7255,7259,7279,7283,7289,7297,7301,7307],{"__ignoreMap":37},[41,7080,7081,7083,7085,7087,7089,7091,7093],{"class":43,"line":44},[41,7082,801],{"class":299},[41,7084,2344],{"class":126},[41,7086,2347],{"class":299},[41,7088,251],{"class":47},[41,7090,2352],{"class":68},[41,7092,230],{"class":47},[41,7094,210],{"class":47},[41,7096,7097],{"class":43,"line":55},[41,7098,349],{"emptyLinePlaceholder":348},[41,7100,7101,7103,7105,7107,7109,7111,7113,7115,7117,7119,7121,7123,7125,7127,7129],{"class":43,"line":75},[41,7102,300],{"class":299},[41,7104,2367],{"class":299},[41,7106,148],{"class":58},[41,7108,2372],{"class":197},[41,7110,2375],{"class":47},[41,7112,2378],{"class":460},[41,7114,2381],{"class":47},[41,7116,632],{"class":47},[41,7118,2378],{"class":51},[41,7120,30],{"class":47},[41,7122,2390],{"class":306},[41,7124,130],{"class":47},[41,7126,2395],{"class":306},[41,7128,2398],{"class":47},[41,7130,154],{"class":47},[41,7132,7133,7135],{"class":43,"line":90},[41,7134,629],{"class":299},[41,7136,2407],{"class":51},[41,7138,7139],{"class":43,"line":102},[41,7140,2412],{"class":47},[41,7142,7143,7145,7147],{"class":43,"line":123},[41,7144,2417],{"class":47},[41,7146,2420],{"class":126},[41,7148,343],{"class":47},[41,7150,7151],{"class":43,"line":157},[41,7152,349],{"emptyLinePlaceholder":348},[41,7154,7155,7157],{"class":43,"line":213},[41,7156,2431],{"class":47},[41,7158,2434],{"class":306},[41,7160,7161,7163,7165,7167,7169],{"class":43,"line":219},[41,7162,2439],{"class":58},[41,7164,62],{"class":47},[41,7166,65],{"class":47},[41,7168,69],{"class":68},[41,7170,72],{"class":47},[41,7172,7173,7175,7177,7179,7181],{"class":43,"line":243},[41,7174,2452],{"class":58},[41,7176,62],{"class":47},[41,7178,65],{"class":47},[41,7180,2459],{"class":68},[41,7182,72],{"class":47},[41,7184,7185,7187,7189,7191,7193],{"class":43,"line":260},[41,7186,2466],{"class":58},[41,7188,62],{"class":47},[41,7190,65],{"class":47},[41,7192,85],{"class":68},[41,7194,72],{"class":47},[41,7196,7197],{"class":43,"line":270},[41,7198,2479],{"class":47},[41,7200,7201],{"class":43,"line":421},[41,7202,349],{"emptyLinePlaceholder":348},[41,7204,7205,7207],{"class":43,"line":426},[41,7206,2431],{"class":47},[41,7208,2434],{"class":306},[41,7210,7211,7213,7215,7217,7219],{"class":43,"line":438},[41,7212,2452],{"class":58},[41,7214,62],{"class":47},[41,7216,65],{"class":47},[41,7218,2459],{"class":68},[41,7220,72],{"class":47},[41,7222,7223,7225,7227,7229,7231],{"class":43,"line":449},[41,7224,2466],{"class":58},[41,7226,62],{"class":47},[41,7228,65],{"class":47},[41,7230,116],{"class":68},[41,7232,72],{"class":47},[41,7234,7235],{"class":43,"line":487},[41,7236,2518],{"class":47},[41,7238,7239,7241],{"class":43,"line":493},[41,7240,2523],{"class":47},[41,7242,2526],{"class":47},[41,7244,7245],{"class":43,"line":498},[41,7246,2531],{"class":68},[41,7248,7249],{"class":43,"line":503},[41,7250,2536],{"class":68},[41,7252,7253],{"class":43,"line":517},[41,7254,2541],{"class":68},[41,7256,7257],{"class":43,"line":543},[41,7258,2546],{"class":68},[41,7260,7261,7263,7265,7267,7269,7271,7273,7275,7277],{"class":43,"line":569},[41,7262,2551],{"class":68},[41,7264,2554],{"class":47},[41,7266,2557],{"class":126},[41,7268,130],{"class":47},[41,7270,2562],{"class":126},[41,7272,130],{"class":47},[41,7274,2567],{"class":126},[41,7276,886],{"class":47},[41,7278,257],{"class":68},[41,7280,7281],{"class":43,"line":574},[41,7282,2576],{"class":68},[41,7284,7285,7287],{"class":43,"line":579},[41,7286,2581],{"class":47},[41,7288,343],{"class":47},[41,7290,7291,7293,7295],{"class":43,"line":596},[41,7292,2588],{"class":47},[41,7294,2315],{"class":306},[41,7296,99],{"class":47},[41,7298,7299],{"class":43,"line":616},[41,7300,2597],{"class":47},[41,7302,7303,7305],{"class":43,"line":621},[41,7304,2602],{"class":51},[41,7306,210],{"class":47},[41,7308,7309],{"class":43,"line":626},[41,7310,343],{"class":47},[1244,7312,7314],{"id":7313},"шаг-2-создание-кнопки-виджета","Шаг 2 — Создание кнопки виджета",[32,7316,7318],{"className":2333,"code":7317,"language":2335,"meta":37,"style":37},"'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",[27,7319,7320,7330,7334,7342,7352,7362,7366,7370,7378,7386,7416,7420,7424,7428,7456,7470,7490,7504,7518,7528,7536,7540,7544,7550,7554,7606,7629,7633,7639],{"__ignoreMap":37},[41,7321,7322,7324,7326,7328],{"class":43,"line":44},[41,7323,230],{"class":47},[41,7325,2624],{"class":68},[41,7327,230],{"class":47},[41,7329,210],{"class":47},[41,7331,7332],{"class":43,"line":55},[41,7333,349],{"emptyLinePlaceholder":348},[41,7335,7336,7338,7340],{"class":43,"line":75},[41,7337,2637],{"class":58},[41,7339,307],{"class":306},[41,7341,154],{"class":47},[41,7343,7344,7346,7348,7350],{"class":43,"line":90},[41,7345,314],{"class":51},[41,7347,30],{"class":47},[41,7349,466],{"class":306},[41,7351,210],{"class":47},[41,7353,7354,7356,7358,7360],{"class":43,"line":102},[41,7355,324],{"class":51},[41,7357,30],{"class":47},[41,7359,466],{"class":306},[41,7361,210],{"class":47},[41,7363,7364],{"class":43,"line":123},[41,7365,343],{"class":47},[41,7367,7368],{"class":43,"line":157},[41,7369,349],{"emptyLinePlaceholder":348},[41,7371,7372,7374,7376],{"class":43,"line":213},[41,7373,429],{"class":58},[41,7375,432],{"class":126},[41,7377,435],{"class":47},[41,7379,7380,7382,7384],{"class":43,"line":219},[41,7381,441],{"class":58},[41,7383,444],{"class":306},[41,7385,154],{"class":47},[41,7387,7388,7390,7392,7394,7396,7398,7400,7402,7404,7406,7408,7410,7412,7414],{"class":43,"line":243},[41,7389,452],{"class":51},[41,7391,30],{"class":47},[41,7393,457],{"class":47},[41,7395,461],{"class":460},[41,7397,30],{"class":47},[41,7399,466],{"class":306},[41,7401,238],{"class":47},[41,7403,471],{"class":460},[41,7405,336],{"class":47},[41,7407,476],{"class":306},[41,7409,207],{"class":47},[41,7411,481],{"class":58},[41,7413,2714],{"class":306},[41,7415,210],{"class":47},[41,7417,7418],{"class":43,"line":260},[41,7419,490],{"class":47},[41,7421,7422],{"class":43,"line":270},[41,7423,343],{"class":47},[41,7425,7426],{"class":43,"line":421},[41,7427,349],{"emptyLinePlaceholder":348},[41,7429,7430,7432,7434,7436,7438,7440,7442,7444,7446,7448,7450,7452,7454],{"class":43,"line":426},[41,7431,300],{"class":299},[41,7433,148],{"class":58},[41,7435,2737],{"class":197},[41,7437,2375],{"class":47},[41,7439,2742],{"class":460},[41,7441,2381],{"class":47},[41,7443,632],{"class":47},[41,7445,2742],{"class":51},[41,7447,30],{"class":47},[41,7449,307],{"class":306},[41,7451,2755],{"class":126},[41,7453,2758],{"class":47},[41,7455,154],{"class":47},[41,7457,7458,7460,7462,7464,7466,7468],{"class":43,"line":438},[41,7459,520],{"class":58},[41,7461,2767],{"class":126},[41,7463,176],{"class":47},[41,7465,589],{"class":47},[41,7467,481],{"class":58},[41,7469,154],{"class":47},[41,7471,7472,7474,7476,7478,7480,7482,7484,7486,7488],{"class":43,"line":449},[41,7473,546],{"class":126},[41,7475,130],{"class":47},[41,7477,168],{"class":197},[41,7479,201],{"class":51},[41,7481,230],{"class":47},[41,7483,557],{"class":68},[41,7485,230],{"class":47},[41,7487,238],{"class":47},[41,7489,154],{"class":47},[41,7491,7492,7494,7496,7498,7500,7502],{"class":43,"line":487},[41,7493,2800],{"class":51},[41,7495,30],{"class":47},[41,7497,251],{"class":47},[41,7499,701],{"class":68},[41,7501,230],{"class":47},[41,7503,936],{"class":47},[41,7505,7506,7508,7510,7512,7514,7516],{"class":43,"line":493},[41,7507,2815],{"class":51},[41,7509,30],{"class":47},[41,7511,251],{"class":47},[41,7513,381],{"class":68},[41,7515,230],{"class":47},[41,7517,936],{"class":47},[41,7519,7520,7522,7524,7526],{"class":43,"line":498},[41,7521,2830],{"class":51},[41,7523,30],{"class":47},[41,7525,2742],{"class":126},[41,7527,936],{"class":47},[41,7529,7530,7532,7534],{"class":43,"line":503},[41,7531,2841],{"class":47},[41,7533,207],{"class":51},[41,7535,210],{"class":47},[41,7537,7538],{"class":43,"line":517},[41,7539,216],{"class":47},[41,7541,7542],{"class":43,"line":543},[41,7543,349],{"emptyLinePlaceholder":348},[41,7545,7546,7548],{"class":43,"line":569},[41,7547,629],{"class":299},[41,7549,2407],{"class":51},[41,7551,7552],{"class":43,"line":574},[41,7553,2412],{"class":47},[41,7555,7556,7558,7560,7562,7564,7566,7568,7570,7572,7574,7576,7578,7580,7582,7584,7586,7588,7590,7592,7594,7596,7598,7600,7602,7604],{"class":43,"line":579},[41,7557,2431],{"class":47},[41,7559,679],{"class":51},[41,7561,109],{"class":58},[41,7563,62],{"class":47},[41,7565,65],{"class":47},[41,7567,701],{"class":68},[41,7569,65],{"class":47},[41,7571,2882],{"class":58},[41,7573,2885],{"class":47},[41,7575,2888],{"class":51},[41,7577,30],{"class":47},[41,7579,251],{"class":47},[41,7581,2895],{"class":68},[41,7583,230],{"class":47},[41,7585,238],{"class":47},[41,7587,2902],{"class":51},[41,7589,30],{"class":47},[41,7591,2908],{"class":2907},[41,7593,238],{"class":47},[41,7595,2913],{"class":51},[41,7597,30],{"class":47},[41,7599,251],{"class":47},[41,7601,2920],{"class":68},[41,7603,230],{"class":47},[41,7605,2925],{"class":47},[41,7607,7608,7610,7612,7614,7616,7618,7620,7623,7625,7627],{"class":43,"line":596},[41,7609,2431],{"class":47},[41,7611,729],{"class":51},[41,7613,2934],{"class":58},[41,7615,2937],{"class":47},[41,7617,2940],{"class":126},[41,7619,867],{"class":47},[41,7621,7622],{"class":126},"Примерка",[41,7624,273],{"class":47},[41,7626,729],{"class":51},[41,7628,99],{"class":47},[41,7630,7631],{"class":43,"line":616},[41,7632,2597],{"class":47},[41,7634,7635,7637],{"class":43,"line":621},[41,7636,2602],{"class":51},[41,7638,210],{"class":47},[41,7640,7641],{"class":43,"line":626},[41,7642,343],{"class":47},[1244,7644,7646],{"id":7645},"шаг-3-использование-на-странице-товара","Шаг 3 — Использование на странице товара",[32,7648,7649],{"className":2333,"code":2971,"language":2335,"meta":37,"style":37},[27,7650,7651,7671,7675,7713,7737,7741,7747,7755,7775,7805,7811,7819,7823,7837,7851,7855,7861,7865,7873,7879],{"__ignoreMap":37},[41,7652,7653,7655,7657,7659,7661,7663,7665,7667,7669],{"class":43,"line":44},[41,7654,801],{"class":299},[41,7656,632],{"class":47},[41,7658,2737],{"class":126},[41,7660,815],{"class":47},[41,7662,818],{"class":299},[41,7664,251],{"class":47},[41,7666,2990],{"class":68},[41,7668,230],{"class":47},[41,7670,210],{"class":47},[41,7672,7673],{"class":43,"line":55},[41,7674,349],{"emptyLinePlaceholder":348},[41,7676,7677,7679,7681,7683,7685,7687,7689,7691,7693,7695,7697,7699,7701,7703,7705,7707,7709,7711],{"class":43,"line":75},[41,7678,300],{"class":299},[41,7680,2367],{"class":299},[41,7682,3007],{"class":58},[41,7684,148],{"class":58},[41,7686,3012],{"class":197},[41,7688,2375],{"class":47},[41,7690,3017],{"class":460},[41,7692,2381],{"class":47},[41,7694,632],{"class":47},[41,7696,3017],{"class":51},[41,7698,30],{"class":47},[41,7700,632],{"class":47},[41,7702,3030],{"class":51},[41,7704,30],{"class":47},[41,7706,466],{"class":306},[41,7708,815],{"class":47},[41,7710,2398],{"class":47},[41,7712,154],{"class":47},[41,7714,7715,7717,7719,7721,7723,7725,7727,7729,7731,7733,7735],{"class":43,"line":90},[41,7716,520],{"class":58},[41,7718,3047],{"class":126},[41,7720,176],{"class":47},[41,7722,3052],{"class":299},[41,7724,3055],{"class":197},[41,7726,201],{"class":51},[41,7728,3060],{"class":126},[41,7730,130],{"class":47},[41,7732,3065],{"class":126},[41,7734,207],{"class":51},[41,7736,210],{"class":47},[41,7738,7739],{"class":43,"line":102},[41,7740,349],{"emptyLinePlaceholder":348},[41,7742,7743,7745],{"class":43,"line":123},[41,7744,629],{"class":299},[41,7746,2407],{"class":51},[41,7748,7749,7751,7753],{"class":43,"line":157},[41,7750,686],{"class":47},[41,7752,679],{"class":51},[41,7754,99],{"class":47},[41,7756,7757,7759,7761,7763,7765,7767,7769,7771,7773],{"class":43,"line":213},[41,7758,2431],{"class":47},[41,7760,10],{"class":51},[41,7762,3096],{"class":47},[41,7764,3099],{"class":126},[41,7766,130],{"class":47},[41,7768,3104],{"class":126},[41,7770,3107],{"class":47},[41,7772,10],{"class":51},[41,7774,99],{"class":47},[41,7776,7777,7779,7781,7783,7785,7787,7789,7791,7793,7795,7797,7799,7801,7803],{"class":43,"line":219},[41,7778,2431],{"class":47},[41,7780,3118],{"class":51},[41,7782,3121],{"class":58},[41,7784,2937],{"class":47},[41,7786,3099],{"class":126},[41,7788,130],{"class":47},[41,7790,3130],{"class":126},[41,7792,3133],{"class":47},[41,7794,3136],{"class":58},[41,7796,2937],{"class":47},[41,7798,3099],{"class":126},[41,7800,130],{"class":47},[41,7802,3104],{"class":126},[41,7804,3147],{"class":47},[41,7806,7807,7809],{"class":43,"line":243},[41,7808,2431],{"class":47},[41,7810,3154],{"class":306},[41,7812,7813,7815,7817],{"class":43,"line":260},[41,7814,3159],{"class":58},[41,7816,2937],{"class":47},[41,7818,3164],{"class":126},[41,7820,7821],{"class":43,"line":270},[41,7822,3169],{"class":47},[41,7824,7825,7827,7829,7831,7833,7835],{"class":43,"line":421},[41,7826,3174],{"class":51},[41,7828,30],{"class":47},[41,7830,3047],{"class":126},[41,7832,130],{"class":47},[41,7834,3104],{"class":126},[41,7836,936],{"class":47},[41,7838,7839,7841,7843,7845,7847,7849],{"class":43,"line":426},[41,7840,3189],{"class":51},[41,7842,30],{"class":47},[41,7844,3047],{"class":126},[41,7846,130],{"class":47},[41,7848,3130],{"class":126},[41,7850,936],{"class":47},[41,7852,7853],{"class":43,"line":438},[41,7854,3204],{"class":47},[41,7856,7857,7859],{"class":43,"line":449},[41,7858,3209],{"class":126},[41,7860,343],{"class":47},[41,7862,7863],{"class":43,"line":487},[41,7864,2479],{"class":47},[41,7866,7867,7869,7871],{"class":43,"line":493},[41,7868,3220],{"class":47},[41,7870,679],{"class":51},[41,7872,99],{"class":47},[41,7874,7875,7877],{"class":43,"line":498},[41,7876,2602],{"class":51},[41,7878,210],{"class":47},[41,7880,7881],{"class":43,"line":503},[41,7882,343],{"class":47},[19,7884,7886],{"id":7885},"переменная-окружения","Переменная окружения",[15,7888,7889,7890,30],{},"Добавьте ваш API-ключ в ",[27,7891,3244],{},[32,7893,7894],{"className":3247,"code":3248,"language":3249,"meta":37,"style":37},[27,7895,7896],{"__ignoreMap":37},[41,7897,7898,7900,7902],{"class":43,"line":44},[41,7899,2567],{"class":126},[41,7901,62],{"class":47},[41,7903,3260],{"class":68},[1035,7905,3263],{},{"title":37,"searchDepth":55,"depth":55,"links":7907},[7908,7914],{"id":7056,"depth":55,"text":7057,"children":7909},[7910,7912,7913],{"id":7068,"depth":75,"text":7911},"Шаг 1 — Загрузка скриптов в layout.tsx или page.tsx",{"id":7313,"depth":75,"text":7314},{"id":7645,"depth":75,"text":7646},{"id":7885,"depth":55,"text":7886},"Интеграция с Next.js (Pages Router и App Router)",{},"\u002Fintegrations\u002Fnextjs",{"title":2289,"description":7915},"integrations\u002Fnextjs","KS6JTPT1XrolEU5h4YdImeGYebYne3YB0eM4G4u-UlY",{"id":7922,"title":3282,"body":7923,"description":8736,"extension":1044,"icon":4147,"meta":8737,"navigation":348,"path":8738,"seo":8739,"stem":8740,"__hash__":8741},"content\u002Fintegrations\u002Fnuxt.md",{"type":7,"value":7924,"toc":8726},[7925,7929,7932,7936,7944,7950,8232,8238,8414,8418,8705,8707,8712,8724],[10,7926,7928],{"id":7927},"интеграция-с-nuxt","Интеграция с Nuxt",[15,7930,7931],{},"Fitting Widget легко интегрируется с Nuxt 3 и Nuxt 4.",[19,7933,7935],{"id":7934},"_1-загрузка-скрипта","1. Загрузка скрипта",[15,7937,7938,7939,7941,7942,130],{},"Используйте composable ",[27,7940,3301],{}," или добавьте скрипты в ",[27,7943,3305],{},[1244,7945,7947,7948],{"id":7946},"вариант-а-на-страницу-через-usehead","Вариант А — На страницу через ",[27,7949,3301],{},[32,7951,7952],{"className":653,"code":3314,"language":655,"meta":37,"style":37},[27,7953,7954,7958,7966,7974,7990,8018,8026,8034,8038,8058,8076,8080,8088,8096,8100,8114,8128,8132,8136,8150,8158,8162,8166,8170,8174,8198,8202,8208,8212,8218,8224],{"__ignoreMap":37},[41,7955,7956],{"class":43,"line":44},[41,7957,3321],{"class":293},[41,7959,7960,7962,7964],{"class":43,"line":55},[41,7961,48],{"class":47},[41,7963,669],{"class":51},[41,7965,99],{"class":47},[41,7967,7968,7970,7972],{"class":43,"line":75},[41,7969,676],{"class":47},[41,7971,679],{"class":51},[41,7973,99],{"class":47},[41,7975,7976,7978,7980,7982,7984,7986,7988],{"class":43,"line":90},[41,7977,686],{"class":47},[41,7979,10],{"class":51},[41,7981,744],{"class":47},[41,7983,3348],{"class":126},[41,7985,273],{"class":47},[41,7987,10],{"class":51},[41,7989,99],{"class":47},[41,7991,7992,7994,7996,7998,8000,8002,8004,8006,8008,8010,8012,8014,8016],{"class":43,"line":102},[41,7993,686],{"class":47},[41,7995,3361],{"class":51},[41,7997,3364],{"class":58},[41,7999,62],{"class":47},[41,8001,65],{"class":47},[41,8003,3371],{"class":68},[41,8005,65],{"class":47},[41,8007,3376],{"class":58},[41,8009,62],{"class":47},[41,8011,65],{"class":47},[41,8013,3383],{"class":68},[41,8015,65],{"class":47},[41,8017,3388],{"class":47},[41,8019,8020,8022,8024],{"class":43,"line":123},[41,8021,758],{"class":47},[41,8023,679],{"class":51},[41,8025,99],{"class":47},[41,8027,8028,8030,8032],{"class":43,"line":157},[41,8029,273],{"class":47},[41,8031,669],{"class":51},[41,8033,99],{"class":47},[41,8035,8036],{"class":43,"line":213},[41,8037,349],{"emptyLinePlaceholder":348},[41,8039,8040,8042,8044,8046,8048,8050,8052,8054,8056],{"class":43,"line":219},[41,8041,48],{"class":47},[41,8043,96],{"class":51},[41,8045,783],{"class":58},[41,8047,786],{"class":58},[41,8049,62],{"class":47},[41,8051,65],{"class":47},[41,8053,286],{"class":68},[41,8055,65],{"class":47},[41,8057,99],{"class":47},[41,8059,8060,8062,8064,8066,8068,8070,8072,8074],{"class":43,"line":243},[41,8061,801],{"class":299},[41,8063,632],{"class":47},[41,8065,3437],{"class":126},[41,8067,815],{"class":47},[41,8069,818],{"class":299},[41,8071,251],{"class":47},[41,8073,3446],{"class":68},[41,8075,257],{"class":47},[41,8077,8078],{"class":43,"line":260},[41,8079,349],{"emptyLinePlaceholder":348},[41,8081,8082,8084,8086],{"class":43,"line":270},[41,8083,3301],{"class":197},[41,8085,201],{"class":126},[41,8087,435],{"class":47},[41,8089,8090,8092,8094],{"class":43,"line":421},[41,8091,3465],{"class":51},[41,8093,30],{"class":47},[41,8095,961],{"class":126},[41,8097,8098],{"class":43,"line":426},[41,8099,1355],{"class":47},[41,8101,8102,8104,8106,8108,8110,8112],{"class":43,"line":438},[41,8103,3478],{"class":51},[41,8105,30],{"class":47},[41,8107,251],{"class":47},[41,8109,69],{"class":68},[41,8111,230],{"class":47},[41,8113,936],{"class":47},[41,8115,8116,8118,8120,8122,8124,8126],{"class":43,"line":449},[41,8117,694],{"class":51},[41,8119,30],{"class":47},[41,8121,251],{"class":47},[41,8123,85],{"class":68},[41,8125,230],{"class":47},[41,8127,936],{"class":47},[41,8129,8130],{"class":43,"line":487},[41,8131,1392],{"class":47},[41,8133,8134],{"class":43,"line":493},[41,8135,1355],{"class":47},[41,8137,8138,8140,8142,8144,8146,8148],{"class":43,"line":498},[41,8139,694],{"class":51},[41,8141,30],{"class":47},[41,8143,251],{"class":47},[41,8145,116],{"class":68},[41,8147,230],{"class":47},[41,8149,936],{"class":47},[41,8151,8152,8154,8156],{"class":43,"line":503},[41,8153,3529],{"class":51},[41,8155,30],{"class":47},[41,8157,3534],{"class":47},[41,8159,8160],{"class":43,"line":517},[41,8161,3539],{"class":68},[41,8163,8164],{"class":43,"line":543},[41,8165,3544],{"class":68},[41,8167,8168],{"class":43,"line":569},[41,8169,3549],{"class":68},[41,8171,8172],{"class":43,"line":574},[41,8173,3554],{"class":68},[41,8175,8176,8178,8180,8182,8184,8186,8188,8190,8192,8194,8196],{"class":43,"line":579},[41,8177,3559],{"class":68},[41,8179,2554],{"class":47},[41,8181,801],{"class":299},[41,8183,130],{"class":47},[41,8185,3568],{"class":126},[41,8187,130],{"class":47},[41,8189,2562],{"class":126},[41,8191,130],{"class":47},[41,8193,3577],{"class":126},[41,8195,886],{"class":47},[41,8197,257],{"class":68},[41,8199,8200],{"class":43,"line":596},[41,8201,3586],{"class":68},[41,8203,8204,8206],{"class":43,"line":616},[41,8205,3591],{"class":47},[41,8207,936],{"class":47},[41,8209,8210],{"class":43,"line":621},[41,8211,1392],{"class":47},[41,8213,8214,8216],{"class":43,"line":626},[41,8215,1397],{"class":126},[41,8217,936],{"class":47},[41,8219,8220,8222],{"class":43,"line":644},[41,8221,886],{"class":47},[41,8223,566],{"class":126},[41,8225,8226,8228,8230],{"class":43,"line":1007},[41,8227,273],{"class":47},[41,8229,96],{"class":51},[41,8231,99],{"class":47},[1244,8233,8235,8236],{"id":8234},"вариант-б-глобально-в-nuxtconfigts","Вариант Б — Глобально в ",[27,8237,3305],{},[32,8239,8240],{"className":284,"code":3626,"language":286,"meta":37,"style":37},[27,8241,8242,8254,8262,8270,8278,8282,8296,8310,8314,8318,8332,8340,8344,8348,8352,8356,8380,8384,8390,8394,8400,8404,8408],{"__ignoreMap":37},[41,8243,8244,8246,8248,8250,8252],{"class":43,"line":44},[41,8245,300],{"class":299},[41,8247,2367],{"class":299},[41,8249,3637],{"class":197},[41,8251,201],{"class":126},[41,8253,435],{"class":47},[41,8255,8256,8258,8260],{"class":43,"line":55},[41,8257,3646],{"class":51},[41,8259,30],{"class":47},[41,8261,154],{"class":47},[41,8263,8264,8266,8268],{"class":43,"line":75},[41,8265,3655],{"class":51},[41,8267,30],{"class":47},[41,8269,154],{"class":47},[41,8271,8272,8274,8276],{"class":43,"line":90},[41,8273,3664],{"class":51},[41,8275,30],{"class":47},[41,8277,961],{"class":126},[41,8279,8280],{"class":43,"line":102},[41,8281,3673],{"class":47},[41,8283,8284,8286,8288,8290,8292,8294],{"class":43,"line":123},[41,8285,3678],{"class":51},[41,8287,30],{"class":47},[41,8289,251],{"class":47},[41,8291,69],{"class":68},[41,8293,230],{"class":47},[41,8295,936],{"class":47},[41,8297,8298,8300,8302,8304,8306,8308],{"class":43,"line":157},[41,8299,3693],{"class":51},[41,8301,30],{"class":47},[41,8303,251],{"class":47},[41,8305,85],{"class":68},[41,8307,230],{"class":47},[41,8309,936],{"class":47},[41,8311,8312],{"class":43,"line":213},[41,8313,3708],{"class":47},[41,8315,8316],{"class":43,"line":219},[41,8317,3673],{"class":47},[41,8319,8320,8322,8324,8326,8328,8330],{"class":43,"line":243},[41,8321,3693],{"class":51},[41,8323,30],{"class":47},[41,8325,251],{"class":47},[41,8327,116],{"class":68},[41,8329,230],{"class":47},[41,8331,936],{"class":47},[41,8333,8334,8336,8338],{"class":43,"line":260},[41,8335,3731],{"class":51},[41,8337,30],{"class":47},[41,8339,3534],{"class":47},[41,8341,8342],{"class":43,"line":270},[41,8343,3740],{"class":68},[41,8345,8346],{"class":43,"line":421},[41,8347,3745],{"class":68},[41,8349,8350],{"class":43,"line":426},[41,8351,3750],{"class":68},[41,8353,8354],{"class":43,"line":438},[41,8355,3755],{"class":68},[41,8357,8358,8360,8362,8364,8366,8368,8370,8372,8374,8376,8378],{"class":43,"line":449},[41,8359,3760],{"class":68},[41,8361,2554],{"class":47},[41,8363,801],{"class":299},[41,8365,130],{"class":47},[41,8367,3568],{"class":126},[41,8369,130],{"class":47},[41,8371,2562],{"class":126},[41,8373,130],{"class":47},[41,8375,3577],{"class":126},[41,8377,886],{"class":47},[41,8379,257],{"class":68},[41,8381,8382],{"class":43,"line":487},[41,8383,3785],{"class":68},[41,8385,8386,8388],{"class":43,"line":493},[41,8387,3790],{"class":47},[41,8389,936],{"class":47},[41,8391,8392],{"class":43,"line":498},[41,8393,3708],{"class":47},[41,8395,8396,8398],{"class":43,"line":503},[41,8397,3801],{"class":126},[41,8399,936],{"class":47},[41,8401,8402],{"class":43,"line":517},[41,8403,1392],{"class":47},[41,8405,8406],{"class":43,"line":543},[41,8407,3812],{"class":47},[41,8409,8410,8412],{"class":43,"line":569},[41,8411,886],{"class":47},[41,8413,566],{"class":126},[19,8415,8417],{"id":8416},"_2-создание-компонента-обёртки","2. Создание компонента-обёртки",[32,8419,8421],{"className":653,"code":8420,"language":655,"meta":37,"style":37},"\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",[27,8422,8423,8427,8435,8443,8471,8497,8505,8513,8517,8537,8549,8557,8565,8571,8575,8589,8609,8623,8637,8645,8649,8663,8677,8681,8687,8693,8697],{"__ignoreMap":37},[41,8424,8425],{"class":43,"line":44},[41,8426,662],{"class":293},[41,8428,8429,8431,8433],{"class":43,"line":55},[41,8430,48],{"class":47},[41,8432,669],{"class":51},[41,8434,99],{"class":47},[41,8436,8437,8439,8441],{"class":43,"line":75},[41,8438,676],{"class":47},[41,8440,679],{"class":51},[41,8442,99],{"class":47},[41,8444,8445,8447,8449,8451,8453,8455,8457,8459,8461,8463,8465,8467,8469],{"class":43,"line":90},[41,8446,686],{"class":47},[41,8448,679],{"class":51},[41,8450,109],{"class":58},[41,8452,62],{"class":47},[41,8454,65],{"class":47},[41,8456,701],{"class":68},[41,8458,65],{"class":47},[41,8460,3866],{"class":58},[41,8462,62],{"class":47},[41,8464,65],{"class":47},[41,8466,3873],{"class":68},[41,8468,65],{"class":47},[41,8470,3388],{"class":47},[41,8472,8473,8475,8477,8479,8481,8483,8485,8487,8489,8491,8493,8495],{"class":43,"line":102},[41,8474,686],{"class":47},[41,8476,729],{"class":51},[41,8478,732],{"class":58},[41,8480,62],{"class":47},[41,8482,65],{"class":47},[41,8484,739],{"class":68},[41,8486,65],{"class":47},[41,8488,744],{"class":47},[41,8490,7622],{"class":126},[41,8492,273],{"class":47},[41,8494,729],{"class":51},[41,8496,99],{"class":47},[41,8498,8499,8501,8503],{"class":43,"line":123},[41,8500,758],{"class":47},[41,8502,679],{"class":51},[41,8504,99],{"class":47},[41,8506,8507,8509,8511],{"class":43,"line":157},[41,8508,273],{"class":47},[41,8510,669],{"class":51},[41,8512,99],{"class":47},[41,8514,8515],{"class":43,"line":213},[41,8516,349],{"emptyLinePlaceholder":348},[41,8518,8519,8521,8523,8525,8527,8529,8531,8533,8535],{"class":43,"line":219},[41,8520,48],{"class":47},[41,8522,96],{"class":51},[41,8524,783],{"class":58},[41,8526,786],{"class":58},[41,8528,62],{"class":47},[41,8530,65],{"class":47},[41,8532,286],{"class":68},[41,8534,65],{"class":47},[41,8536,99],{"class":47},[41,8538,8539,8541,8543,8545,8547],{"class":43,"line":243},[41,8540,834],{"class":58},[41,8542,837],{"class":126},[41,8544,62],{"class":47},[41,8546,842],{"class":197},[41,8548,845],{"class":47},[41,8550,8551,8553,8555],{"class":43,"line":260},[41,8552,314],{"class":51},[41,8554,30],{"class":47},[41,8556,319],{"class":306},[41,8558,8559,8561,8563],{"class":43,"line":270},[41,8560,858],{"class":51},[41,8562,30],{"class":47},[41,8564,319],{"class":306},[41,8566,8567,8569],{"class":43,"line":421},[41,8568,867],{"class":47},[41,8570,870],{"class":126},[41,8572,8573],{"class":43,"line":426},[41,8574,349],{"emptyLinePlaceholder":348},[41,8576,8577,8579,8581,8583,8585,8587],{"class":43,"line":438},[41,8578,834],{"class":58},[41,8580,903],{"class":126},[41,8582,62],{"class":47},[41,8584,589],{"class":47},[41,8586,481],{"class":58},[41,8588,154],{"class":47},[41,8590,8591,8593,8595,8597,8599,8601,8603,8605,8607],{"class":43,"line":449},[41,8592,127],{"class":126},[41,8594,130],{"class":47},[41,8596,168],{"class":197},[41,8598,201],{"class":51},[41,8600,230],{"class":47},[41,8602,557],{"class":68},[41,8604,230],{"class":47},[41,8606,238],{"class":47},[41,8608,154],{"class":47},[41,8610,8611,8613,8615,8617,8619,8621],{"class":43,"line":487},[41,8612,925],{"class":51},[41,8614,30],{"class":47},[41,8616,251],{"class":47},[41,8618,701],{"class":68},[41,8620,230],{"class":47},[41,8622,936],{"class":47},[41,8624,8625,8627,8629,8631,8633,8635],{"class":43,"line":493},[41,8626,941],{"class":51},[41,8628,30],{"class":47},[41,8630,251],{"class":47},[41,8632,381],{"class":68},[41,8634,230],{"class":47},[41,8636,936],{"class":47},[41,8638,8639,8641,8643],{"class":43,"line":498},[41,8640,956],{"class":51},[41,8642,30],{"class":47},[41,8644,961],{"class":51},[41,8646,8647],{"class":43,"line":503},[41,8648,966],{"class":47},[41,8650,8651,8653,8655,8657,8659,8661],{"class":43,"line":517},[41,8652,971],{"class":51},[41,8654,30],{"class":47},[41,8656,976],{"class":126},[41,8658,130],{"class":47},[41,8660,981],{"class":126},[41,8662,936],{"class":47},[41,8664,8665,8667,8669,8671,8673,8675],{"class":43,"line":543},[41,8666,988],{"class":51},[41,8668,30],{"class":47},[41,8670,976],{"class":126},[41,8672,130],{"class":47},[41,8674,997],{"class":126},[41,8676,936],{"class":47},[41,8678,8679],{"class":43,"line":569},[41,8680,1004],{"class":47},[41,8682,8683,8685],{"class":43,"line":574},[41,8684,1010],{"class":51},[41,8686,936],{"class":47},[41,8688,8689,8691],{"class":43,"line":579},[41,8690,263],{"class":47},[41,8692,566],{"class":51},[41,8694,8695],{"class":43,"line":596},[41,8696,343],{"class":47},[41,8698,8699,8701,8703],{"class":43,"line":616},[41,8700,273],{"class":47},[41,8702,96],{"class":51},[41,8704,99],{"class":47},[19,8706,7886],{"id":7885},[15,8708,8709,8710,30],{},"Добавьте в ",[27,8711,4119],{},[32,8713,8714],{"className":3247,"code":4122,"language":3249,"meta":37,"style":37},[27,8715,8716],{"__ignoreMap":37},[41,8717,8718,8720,8722],{"class":43,"line":44},[41,8719,3577],{"class":126},[41,8721,62],{"class":47},[41,8723,3260],{"class":68},[1035,8725,4135],{},{"title":37,"searchDepth":55,"depth":55,"links":8727},[8728,8734,8735],{"id":7934,"depth":55,"text":7935,"children":8729},[8730,8732],{"id":7946,"depth":75,"text":8731},"Вариант А — На страницу через useHead",{"id":8234,"depth":75,"text":8733},"Вариант Б — Глобально в nuxt.config.ts",{"id":8416,"depth":55,"text":8417},{"id":7885,"depth":55,"text":7886},"Интеграция с Nuxt 3 \u002F Nuxt 4 приложением",{},"\u002Fintegrations\u002Fnuxt",{"title":3282,"description":8736},"integrations\u002Fnuxt","mSERafXf_JPUG4rn6ZlSU_qJnLNa0suHinF4LwLrASI",{"id":8743,"title":4155,"body":8744,"description":9585,"extension":1044,"icon":5027,"meta":9586,"navigation":348,"path":9587,"seo":9588,"stem":9589,"__hash__":9590},"content\u002Fintegrations\u002Freact.md",{"type":7,"value":8745,"toc":9580},[8746,8750,8753,8757,8762,8946,8954,8958,9264,9268,9578],[10,8747,8749],{"id":8748},"интеграция-с-react","Интеграция с React",[15,8751,8752],{},"Работает с любым React-окружением — Vite, Create React App или своим решением.",[19,8754,8756],{"id":8755},"_1-загрузка-скрипта-виджета","1. Загрузка скрипта виджета",[15,8758,8759,8760,30],{},"Добавьте скрипт в ваш ",[27,8761,29],{},[32,8763,8765],{"className":34,"code":8764,"language":36,"meta":37,"style":37},"\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",[27,8766,8767,8772,8778,8790,8802,8810,8828,8852,8894,8898,8918,8930,8938],{"__ignoreMap":37},[41,8768,8769],{"class":43,"line":44},[41,8770,8771],{"class":293},"\u003C!-- В public\u002Findex.html или index.html (Vite) -->\n",[41,8773,8774,8776],{"class":43,"line":55},[41,8775,48],{"class":47},[41,8777,52],{"class":51},[41,8779,8780,8782,8784,8786,8788],{"class":43,"line":75},[41,8781,59],{"class":58},[41,8783,62],{"class":47},[41,8785,65],{"class":47},[41,8787,69],{"class":68},[41,8789,72],{"class":47},[41,8791,8792,8794,8796,8798,8800],{"class":43,"line":90},[41,8793,78],{"class":58},[41,8795,62],{"class":47},[41,8797,65],{"class":47},[41,8799,85],{"class":68},[41,8801,72],{"class":47},[41,8803,8804,8806,8808],{"class":43,"line":102},[41,8805,93],{"class":47},[41,8807,96],{"class":51},[41,8809,99],{"class":47},[41,8811,8812,8814,8816,8818,8820,8822,8824,8826],{"class":43,"line":123},[41,8813,48],{"class":47},[41,8815,96],{"class":51},[41,8817,109],{"class":58},[41,8819,62],{"class":47},[41,8821,65],{"class":47},[41,8823,116],{"class":68},[41,8825,65],{"class":47},[41,8827,99],{"class":47},[41,8829,8830,8832,8834,8836,8838,8840,8842,8844,8846,8848,8850],{"class":43,"line":157},[41,8831,127],{"class":126},[41,8833,130],{"class":47},[41,8835,133],{"class":126},[41,8837,62],{"class":47},[41,8839,138],{"class":126},[41,8841,130],{"class":47},[41,8843,133],{"class":126},[41,8845,145],{"class":47},[41,8847,148],{"class":58},[41,8849,151],{"class":47},[41,8851,154],{"class":47},[41,8853,8854,8856,8858,8860,8862,8864,8866,8868,8870,8872,8874,8876,8878,8880,8882,8884,8886,8888,8890,8892],{"class":43,"line":213},[41,8855,160],{"class":51},[41,8857,163],{"class":126},[41,8859,130],{"class":47},[41,8861,168],{"class":126},[41,8863,130],{"class":47},[41,8865,173],{"class":126},[41,8867,176],{"class":47},[41,8869,138],{"class":126},[41,8871,130],{"class":47},[41,8873,168],{"class":126},[41,8875,130],{"class":47},[41,8877,173],{"class":126},[41,8879,189],{"class":47},[41,8881,192],{"class":51},[41,8883,130],{"class":47},[41,8885,198],{"class":197},[41,8887,201],{"class":51},[41,8889,204],{"class":126},[41,8891,207],{"class":51},[41,8893,210],{"class":47},[41,8895,8896],{"class":43,"line":219},[41,8897,216],{"class":47},[41,8899,8900,8902,8904,8906,8908,8910,8912,8914,8916],{"class":43,"line":243},[41,8901,127],{"class":126},[41,8903,130],{"class":47},[41,8905,168],{"class":197},[41,8907,201],{"class":126},[41,8909,230],{"class":47},[41,8911,233],{"class":68},[41,8913,230],{"class":47},[41,8915,238],{"class":47},[41,8917,154],{"class":47},[41,8919,8920,8922,8924,8926,8928],{"class":43,"line":260},[41,8921,246],{"class":51},[41,8923,30],{"class":47},[41,8925,251],{"class":47},[41,8927,4338],{"class":68},[41,8929,257],{"class":47},[41,8931,8932,8934,8936],{"class":43,"line":270},[41,8933,263],{"class":47},[41,8935,207],{"class":126},[41,8937,210],{"class":47},[41,8939,8940,8942,8944],{"class":43,"line":421},[41,8941,273],{"class":47},[41,8943,96],{"class":51},[41,8945,99],{"class":47},[4358,8947,8948],{"icon":4360},[15,8949,8950,8951,8953],{},"Замените ",[27,8952,4338],{}," на ваш реальный ключ во время сборки, или используйте инъекцию во время выполнения.",[19,8955,8957],{"id":8956},"_2-создайте-свой-хук","2. Создайте свой хук",[32,8959,8960],{"className":2333,"code":4373,"language":2335,"meta":37,"style":37},[27,8961,8962,8966,8974,8984,8994,9004,9008,9012,9020,9030,9060,9072,9076,9080,9088,9096,9126,9130,9134,9138,9150,9172,9196,9200,9204,9218,9238,9242,9246,9260],{"__ignoreMap":37},[41,8963,8964],{"class":43,"line":44},[41,8965,4380],{"class":293},[41,8967,8968,8970,8972],{"class":43,"line":55},[41,8969,2637],{"class":58},[41,8971,307],{"class":306},[41,8973,154],{"class":47},[41,8975,8976,8978,8980,8982],{"class":43,"line":75},[41,8977,314],{"class":51},[41,8979,30],{"class":47},[41,8981,466],{"class":306},[41,8983,210],{"class":47},[41,8985,8986,8988,8990,8992],{"class":43,"line":90},[41,8987,324],{"class":51},[41,8989,30],{"class":47},[41,8991,466],{"class":306},[41,8993,210],{"class":47},[41,8995,8996,8998,9000,9002],{"class":43,"line":102},[41,8997,333],{"class":51},[41,8999,336],{"class":47},[41,9001,466],{"class":306},[41,9003,210],{"class":47},[41,9005,9006],{"class":43,"line":123},[41,9007,343],{"class":47},[41,9009,9010],{"class":43,"line":157},[41,9011,349],{"emptyLinePlaceholder":348},[41,9013,9014,9016,9018],{"class":43,"line":213},[41,9015,2637],{"class":58},[41,9017,358],{"class":306},[41,9019,154],{"class":47},[41,9021,9022,9024,9026,9028],{"class":43,"line":219},[41,9023,365],{"class":51},[41,9025,30],{"class":47},[41,9027,466],{"class":306},[41,9029,210],{"class":47},[41,9031,9032,9034,9036,9038,9040,9042,9044,9046,9048,9050,9052,9054,9056,9058],{"class":43,"line":243},[41,9033,374],{"class":51},[41,9035,336],{"class":47},[41,9037,251],{"class":47},[41,9039,381],{"class":68},[41,9041,230],{"class":47},[41,9043,386],{"class":47},[41,9045,251],{"class":47},[41,9047,391],{"class":68},[41,9049,230],{"class":47},[41,9051,386],{"class":47},[41,9053,251],{"class":47},[41,9055,400],{"class":68},[41,9057,230],{"class":47},[41,9059,210],{"class":47},[41,9061,9062,9064,9066,9068,9070],{"class":43,"line":260},[41,9063,407],{"class":51},[41,9065,30],{"class":47},[41,9067,307],{"class":306},[41,9069,4485],{"class":126},[41,9071,210],{"class":47},[41,9073,9074],{"class":43,"line":270},[41,9075,343],{"class":47},[41,9077,9078],{"class":43,"line":421},[41,9079,349],{"emptyLinePlaceholder":348},[41,9081,9082,9084,9086],{"class":43,"line":426},[41,9083,429],{"class":58},[41,9085,432],{"class":126},[41,9087,435],{"class":47},[41,9089,9090,9092,9094],{"class":43,"line":438},[41,9091,441],{"class":58},[41,9093,444],{"class":306},[41,9095,154],{"class":47},[41,9097,9098,9100,9102,9104,9106,9108,9110,9112,9114,9116,9118,9120,9122,9124],{"class":43,"line":449},[41,9099,452],{"class":51},[41,9101,30],{"class":47},[41,9103,457],{"class":47},[41,9105,461],{"class":460},[41,9107,30],{"class":47},[41,9109,466],{"class":306},[41,9111,238],{"class":47},[41,9113,471],{"class":460},[41,9115,336],{"class":47},[41,9117,476],{"class":306},[41,9119,207],{"class":47},[41,9121,481],{"class":58},[41,9123,2714],{"class":306},[41,9125,210],{"class":47},[41,9127,9128],{"class":43,"line":487},[41,9129,490],{"class":47},[41,9131,9132],{"class":43,"line":493},[41,9133,343],{"class":47},[41,9135,9136],{"class":43,"line":498},[41,9137,349],{"emptyLinePlaceholder":348},[41,9139,9140,9142,9144,9146,9148],{"class":43,"line":503},[41,9141,300],{"class":299},[41,9143,148],{"class":58},[41,9145,510],{"class":197},[41,9147,151],{"class":47},[41,9149,154],{"class":47},[41,9151,9152,9154,9156,9158,9160,9162,9164,9166,9168,9170],{"class":43,"line":517},[41,9153,520],{"class":58},[41,9155,523],{"class":126},[41,9157,176],{"class":47},[41,9159,457],{"class":47},[41,9161,530],{"class":460},[41,9163,30],{"class":47},[41,9165,358],{"class":306},[41,9167,207],{"class":47},[41,9169,481],{"class":58},[41,9171,154],{"class":47},[41,9173,9174,9176,9178,9180,9182,9184,9186,9188,9190,9192,9194],{"class":43,"line":543},[41,9175,546],{"class":126},[41,9177,130],{"class":47},[41,9179,168],{"class":197},[41,9181,201],{"class":51},[41,9183,230],{"class":47},[41,9185,557],{"class":68},[41,9187,230],{"class":47},[41,9189,238],{"class":47},[41,9191,471],{"class":126},[41,9193,207],{"class":51},[41,9195,210],{"class":47},[41,9197,9198],{"class":43,"line":569},[41,9199,216],{"class":47},[41,9201,9202],{"class":43,"line":574},[41,9203,349],{"emptyLinePlaceholder":348},[41,9205,9206,9208,9210,9212,9214,9216],{"class":43,"line":579},[41,9207,520],{"class":58},[41,9209,584],{"class":126},[41,9211,176],{"class":47},[41,9213,589],{"class":47},[41,9215,481],{"class":58},[41,9217,154],{"class":47},[41,9219,9220,9222,9224,9226,9228,9230,9232,9234,9236],{"class":43,"line":596},[41,9221,546],{"class":126},[41,9223,130],{"class":47},[41,9225,168],{"class":197},[41,9227,201],{"class":51},[41,9229,230],{"class":47},[41,9231,609],{"class":68},[41,9233,230],{"class":47},[41,9235,207],{"class":51},[41,9237,210],{"class":47},[41,9239,9240],{"class":43,"line":616},[41,9241,216],{"class":47},[41,9243,9244],{"class":43,"line":621},[41,9245,349],{"emptyLinePlaceholder":348},[41,9247,9248,9250,9252,9254,9256,9258],{"class":43,"line":626},[41,9249,629],{"class":299},[41,9251,632],{"class":47},[41,9253,523],{"class":126},[41,9255,238],{"class":47},[41,9257,584],{"class":126},[41,9259,4676],{"class":47},[41,9261,9262],{"class":43,"line":644},[41,9263,343],{"class":47},[19,9265,9267],{"id":9266},"_3-использование-в-компоненте","3. Использование в компоненте",[32,9269,9271],{"className":2333,"code":9270,"language":2335,"meta":37,"style":37},"\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",[27,9272,9273,9277,9297,9301,9309,9319,9329,9333,9337,9361,9379,9383,9389,9397,9403,9415,9453,9457,9463,9471,9479,9493,9507,9533,9539,9543,9547,9552,9560,9568,9574],{"__ignoreMap":37},[41,9274,9275],{"class":43,"line":44},[41,9276,4694],{"class":293},[41,9278,9279,9281,9283,9285,9287,9289,9291,9293,9295],{"class":43,"line":55},[41,9280,801],{"class":299},[41,9282,632],{"class":47},[41,9284,510],{"class":126},[41,9286,815],{"class":47},[41,9288,818],{"class":299},[41,9290,251],{"class":47},[41,9292,4711],{"class":68},[41,9294,230],{"class":47},[41,9296,210],{"class":47},[41,9298,9299],{"class":43,"line":75},[41,9300,349],{"emptyLinePlaceholder":348},[41,9302,9303,9305,9307],{"class":43,"line":90},[41,9304,2637],{"class":58},[41,9306,4726],{"class":306},[41,9308,154],{"class":47},[41,9310,9311,9313,9315,9317],{"class":43,"line":102},[41,9312,314],{"class":51},[41,9314,30],{"class":47},[41,9316,466],{"class":306},[41,9318,210],{"class":47},[41,9320,9321,9323,9325,9327],{"class":43,"line":123},[41,9322,858],{"class":51},[41,9324,30],{"class":47},[41,9326,466],{"class":306},[41,9328,210],{"class":47},[41,9330,9331],{"class":43,"line":157},[41,9332,343],{"class":47},[41,9334,9335],{"class":43,"line":213},[41,9336,349],{"emptyLinePlaceholder":348},[41,9338,9339,9341,9343,9345,9347,9349,9351,9353,9355,9357,9359],{"class":43,"line":219},[41,9340,300],{"class":299},[41,9342,148],{"class":58},[41,9344,4765],{"class":197},[41,9346,2375],{"class":47},[41,9348,4770],{"class":460},[41,9350,238],{"class":47},[41,9352,4775],{"class":460},[41,9354,2381],{"class":47},[41,9356,4726],{"class":306},[41,9358,207],{"class":47},[41,9360,154],{"class":47},[41,9362,9363,9365,9367,9369,9371,9373,9375,9377],{"class":43,"line":243},[41,9364,520],{"class":58},[41,9366,632],{"class":47},[41,9368,523],{"class":126},[41,9370,815],{"class":47},[41,9372,176],{"class":47},[41,9374,510],{"class":197},[41,9376,151],{"class":51},[41,9378,210],{"class":47},[41,9380,9381],{"class":43,"line":260},[41,9382,349],{"emptyLinePlaceholder":348},[41,9384,9385,9387],{"class":43,"line":270},[41,9386,629],{"class":299},[41,9388,2407],{"class":51},[41,9390,9391,9393,9395],{"class":43,"line":421},[41,9392,686],{"class":47},[41,9394,679],{"class":51},[41,9396,99],{"class":47},[41,9398,9399,9401],{"class":43,"line":426},[41,9400,2431],{"class":47},[41,9402,689],{"class":51},[41,9404,9405,9407,9409,9411,9413],{"class":43,"line":438},[41,9406,2466],{"class":58},[41,9408,62],{"class":47},[41,9410,65],{"class":47},[41,9412,701],{"class":68},[41,9414,72],{"class":47},[41,9416,9417,9419,9421,9423,9425,9427,9429,9431,9433,9435,9437,9439,9441,9443,9445,9447,9449,9451],{"class":43,"line":449},[41,9418,4842],{"class":58},[41,9420,2885],{"class":47},[41,9422,2888],{"class":51},[41,9424,30],{"class":47},[41,9426,251],{"class":47},[41,9428,2895],{"class":68},[41,9430,230],{"class":47},[41,9432,238],{"class":47},[41,9434,2902],{"class":51},[41,9436,30],{"class":47},[41,9438,2908],{"class":2907},[41,9440,238],{"class":47},[41,9442,2913],{"class":51},[41,9444,30],{"class":47},[41,9446,251],{"class":47},[41,9448,2920],{"class":68},[41,9450,230],{"class":47},[41,9452,4877],{"class":47},[41,9454,9455],{"class":43,"line":487},[41,9456,2479],{"class":47},[41,9458,9459,9461],{"class":43,"line":493},[41,9460,2431],{"class":47},[41,9462,4888],{"class":51},[41,9464,9465,9467,9469],{"class":43,"line":498},[41,9466,4893],{"class":58},[41,9468,4896],{"class":47},[41,9470,4899],{"class":58},[41,9472,9473,9475,9477],{"class":43,"line":503},[41,9474,4904],{"class":197},[41,9476,201],{"class":126},[41,9478,435],{"class":47},[41,9480,9481,9483,9485,9487,9489,9491],{"class":43,"line":517},[41,9482,4913],{"class":51},[41,9484,30],{"class":47},[41,9486,251],{"class":47},[41,9488,701],{"class":68},[41,9490,230],{"class":47},[41,9492,936],{"class":47},[41,9494,9495,9497,9499,9501,9503,9505],{"class":43,"line":543},[41,9496,4928],{"class":51},[41,9498,30],{"class":47},[41,9500,251],{"class":47},[41,9502,381],{"class":68},[41,9504,230],{"class":47},[41,9506,936],{"class":47},[41,9508,9509,9511,9513,9515,9517,9519,9521,9523,9525,9527,9529,9531],{"class":43,"line":569},[41,9510,4943],{"class":51},[41,9512,30],{"class":47},[41,9514,4948],{"class":126},[41,9516,4951],{"class":47},[41,9518,4770],{"class":126},[41,9520,238],{"class":47},[41,9522,4958],{"class":51},[41,9524,30],{"class":47},[41,9526,4963],{"class":126},[41,9528,886],{"class":47},[41,9530,4968],{"class":126},[41,9532,936],{"class":47},[41,9534,9535,9537],{"class":43,"line":574},[41,9536,4975],{"class":47},[41,9538,566],{"class":126},[41,9540,9541],{"class":43,"line":579},[41,9542,4982],{"class":47},[41,9544,9545],{"class":43,"line":596},[41,9546,2518],{"class":47},[41,9548,9549],{"class":43,"line":616},[41,9550,9551],{"class":126},"        Примерка\n",[41,9553,9554,9556,9558],{"class":43,"line":621},[41,9555,2588],{"class":47},[41,9557,729],{"class":51},[41,9559,99],{"class":47},[41,9561,9562,9564,9566],{"class":43,"line":626},[41,9563,3220],{"class":47},[41,9565,679],{"class":51},[41,9567,99],{"class":47},[41,9569,9570,9572],{"class":43,"line":644},[41,9571,2602],{"class":51},[41,9573,210],{"class":47},[41,9575,9576],{"class":43,"line":1007},[41,9577,343],{"class":47},[1035,9579,5020],{},{"title":37,"searchDepth":55,"depth":55,"links":9581},[9582,9583,9584],{"id":8755,"depth":55,"text":8756},{"id":8956,"depth":55,"text":8957},{"id":9266,"depth":55,"text":9267},"Интеграция с React-приложением (Vite \u002F CRA)",{},"\u002Fintegrations\u002Freact",{"title":4155,"description":9585},"integrations\u002Freact","F7mSDoVd1RiVLbrCGyquPOzGkvCalo0IeQdlhW6YYUs",{"id":9592,"title":5035,"body":9593,"description":10214,"extension":1044,"icon":5704,"meta":10215,"navigation":348,"path":2170,"seo":10216,"stem":10217,"__hash__":10218},"content\u002Fintegrations\u002Fvanilla-js.md",{"type":7,"value":9594,"toc":10210},[9595,9599,9602,9606,10186,10190,10208],[10,9596,9598],{"id":9597},"интеграция-с-vanilla-js","Интеграция с Vanilla JS",[15,9600,9601],{},"Без фреймворков — только HTML и JavaScript.",[19,9603,9605],{"id":9604},"полный-пример","Полный пример",[32,9607,9609],{"className":34,"code":9608,"language":36,"meta":37,"style":37},"\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",[27,9610,9611,9621,9640,9648,9666,9694,9711,9719,9727,9731,9748,9765,9769,9774,9806,9810,9838,9842,9847,9853,9865,9877,9885,9889,9894,9912,9936,9978,9982,10002,10014,10022,10030,10034,10042,10052,10072,10086,10100,10108,10112,10126,10140,10144,10150,10158,10162,10170,10178],{"__ignoreMap":37},[41,9612,9613,9615,9617,9619],{"class":43,"line":44},[41,9614,5058],{"class":47},[41,9616,5061],{"class":51},[41,9618,5064],{"class":58},[41,9620,99],{"class":47},[41,9622,9623,9625,9627,9629,9631,9633,9636,9638],{"class":43,"line":55},[41,9624,48],{"class":47},[41,9626,36],{"class":51},[41,9628,786],{"class":58},[41,9630,62],{"class":47},[41,9632,65],{"class":47},[41,9634,9635],{"class":68},"ru",[41,9637,65],{"class":47},[41,9639,99],{"class":47},[41,9641,9642,9644,9646],{"class":43,"line":75},[41,9643,48],{"class":47},[41,9645,5092],{"class":51},[41,9647,99],{"class":47},[41,9649,9650,9652,9654,9656,9658,9660,9662,9664],{"class":43,"line":90},[41,9651,676],{"class":47},[41,9653,3568],{"class":51},[41,9655,5103],{"class":58},[41,9657,62],{"class":47},[41,9659,65],{"class":47},[41,9661,5110],{"class":68},[41,9663,65],{"class":47},[41,9665,3388],{"class":47},[41,9667,9668,9670,9672,9674,9676,9678,9680,9682,9684,9686,9688,9690,9692],{"class":43,"line":102},[41,9669,676],{"class":47},[41,9671,3568],{"class":51},[41,9673,5123],{"class":58},[41,9675,62],{"class":47},[41,9677,65],{"class":47},[41,9679,5130],{"class":68},[41,9681,65],{"class":47},[41,9683,5135],{"class":58},[41,9685,62],{"class":47},[41,9687,65],{"class":47},[41,9689,5142],{"class":68},[41,9691,65],{"class":47},[41,9693,3388],{"class":47},[41,9695,9696,9698,9700,9702,9705,9707,9709],{"class":43,"line":123},[41,9697,676],{"class":47},[41,9699,5153],{"class":51},[41,9701,744],{"class":47},[41,9703,9704],{"class":126},"Страница товара — Виртуальная примерка",[41,9706,273],{"class":47},[41,9708,5153],{"class":51},[41,9710,99],{"class":47},[41,9712,9713,9715,9717],{"class":43,"line":157},[41,9714,273],{"class":47},[41,9716,5092],{"class":51},[41,9718,99],{"class":47},[41,9720,9721,9723,9725],{"class":43,"line":213},[41,9722,48],{"class":47},[41,9724,5179],{"class":51},[41,9726,99],{"class":47},[41,9728,9729],{"class":43,"line":219},[41,9730,349],{"emptyLinePlaceholder":348},[41,9732,9733,9735,9737,9739,9742,9744,9746],{"class":43,"line":243},[41,9734,676],{"class":47},[41,9736,10],{"class":51},[41,9738,744],{"class":47},[41,9740,9741],{"class":126},"Классическая джинсовая куртка",[41,9743,273],{"class":47},[41,9745,10],{"class":51},[41,9747,99],{"class":47},[41,9749,9750,9752,9754,9756,9759,9761,9763],{"class":43,"line":260},[41,9751,676],{"class":47},[41,9753,15],{"class":51},[41,9755,744],{"class":47},[41,9757,9758],{"class":126},"7 500 ₽",[41,9760,273],{"class":47},[41,9762,15],{"class":51},[41,9764,99],{"class":47},[41,9766,9767],{"class":43,"line":270},[41,9768,349],{"emptyLinePlaceholder":348},[41,9770,9771],{"class":43,"line":421},[41,9772,9773],{"class":293},"  \u003C!-- Контейнер виджета -->\n",[41,9775,9776,9778,9780,9782,9784,9786,9788,9790,9792,9794,9796,9798,9800,9802,9804],{"class":43,"line":426},[41,9777,676],{"class":47},[41,9779,679],{"class":51},[41,9781,109],{"class":58},[41,9783,62],{"class":47},[41,9785,65],{"class":47},[41,9787,701],{"class":68},[41,9789,65],{"class":47},[41,9791,2882],{"class":58},[41,9793,62],{"class":47},[41,9795,65],{"class":47},[41,9797,5252],{"class":68},[41,9799,65],{"class":47},[41,9801,93],{"class":47},[41,9803,679],{"class":51},[41,9805,99],{"class":47},[41,9807,9808],{"class":43,"line":438},[41,9809,349],{"emptyLinePlaceholder":348},[41,9811,9812,9814,9816,9818,9820,9822,9824,9826,9828,9830,9832,9834,9836],{"class":43,"line":449},[41,9813,676],{"class":47},[41,9815,729],{"class":51},[41,9817,5273],{"class":58},[41,9819,62],{"class":47},[41,9821,65],{"class":47},[41,9823,5280],{"class":197},[41,9825,151],{"class":68},[41,9827,65],{"class":47},[41,9829,744],{"class":47},[41,9831,7622],{"class":126},[41,9833,273],{"class":47},[41,9835,729],{"class":51},[41,9837,99],{"class":47},[41,9839,9840],{"class":43,"line":487},[41,9841,349],{"emptyLinePlaceholder":348},[41,9843,9844],{"class":43,"line":493},[41,9845,9846],{"class":293},"  \u003C!-- 1. Загрузка пакета виджета -->\n",[41,9848,9849,9851],{"class":43,"line":498},[41,9850,676],{"class":47},[41,9852,52],{"class":51},[41,9854,9855,9857,9859,9861,9863],{"class":43,"line":503},[41,9856,5314],{"class":58},[41,9858,62],{"class":47},[41,9860,65],{"class":47},[41,9862,69],{"class":68},[41,9864,72],{"class":47},[41,9866,9867,9869,9871,9873,9875],{"class":43,"line":517},[41,9868,5327],{"class":58},[41,9870,62],{"class":47},[41,9872,65],{"class":47},[41,9874,85],{"class":68},[41,9876,72],{"class":47},[41,9878,9879,9881,9883],{"class":43,"line":543},[41,9880,5340],{"class":47},[41,9882,96],{"class":51},[41,9884,99],{"class":47},[41,9886,9887],{"class":43,"line":569},[41,9888,349],{"emptyLinePlaceholder":348},[41,9890,9891],{"class":43,"line":574},[41,9892,9893],{"class":293},"  \u003C!-- 2. Инициализация -->\n",[41,9895,9896,9898,9900,9902,9904,9906,9908,9910],{"class":43,"line":579},[41,9897,676],{"class":47},[41,9899,96],{"class":51},[41,9901,109],{"class":58},[41,9903,62],{"class":47},[41,9905,65],{"class":47},[41,9907,116],{"class":68},[41,9909,65],{"class":47},[41,9911,99],{"class":47},[41,9913,9914,9916,9918,9920,9922,9924,9926,9928,9930,9932,9934],{"class":43,"line":596},[41,9915,546],{"class":126},[41,9917,130],{"class":47},[41,9919,133],{"class":126},[41,9921,62],{"class":47},[41,9923,138],{"class":126},[41,9925,130],{"class":47},[41,9927,133],{"class":126},[41,9929,145],{"class":47},[41,9931,148],{"class":58},[41,9933,151],{"class":47},[41,9935,154],{"class":47},[41,9937,9938,9940,9942,9944,9946,9948,9950,9952,9954,9956,9958,9960,9962,9964,9966,9968,9970,9972,9974,9976],{"class":43,"line":616},[41,9939,5400],{"class":51},[41,9941,163],{"class":126},[41,9943,130],{"class":47},[41,9945,168],{"class":126},[41,9947,130],{"class":47},[41,9949,173],{"class":126},[41,9951,176],{"class":47},[41,9953,138],{"class":126},[41,9955,130],{"class":47},[41,9957,168],{"class":126},[41,9959,130],{"class":47},[41,9961,173],{"class":126},[41,9963,189],{"class":47},[41,9965,192],{"class":51},[41,9967,130],{"class":47},[41,9969,198],{"class":197},[41,9971,201],{"class":51},[41,9973,204],{"class":126},[41,9975,207],{"class":51},[41,9977,210],{"class":47},[41,9979,9980],{"class":43,"line":621},[41,9981,5443],{"class":47},[41,9983,9984,9986,9988,9990,9992,9994,9996,9998,10000],{"class":43,"line":626},[41,9985,546],{"class":126},[41,9987,130],{"class":47},[41,9989,168],{"class":197},[41,9991,201],{"class":126},[41,9993,230],{"class":47},[41,9995,233],{"class":68},[41,9997,230],{"class":47},[41,9999,238],{"class":47},[41,10001,154],{"class":47},[41,10003,10004,10006,10008,10010,10012],{"class":43,"line":644},[41,10005,5468],{"class":51},[41,10007,30],{"class":47},[41,10009,251],{"class":47},[41,10011,254],{"class":68},[41,10013,257],{"class":47},[41,10015,10016,10018,10020],{"class":43,"line":1007},[41,10017,2841],{"class":47},[41,10019,207],{"class":126},[41,10021,210],{"class":47},[41,10023,10024,10026,10028],{"class":43,"line":1015},[41,10025,758],{"class":47},[41,10027,96],{"class":51},[41,10029,99],{"class":47},[41,10031,10032],{"class":43,"line":1022},[41,10033,349],{"emptyLinePlaceholder":348},[41,10035,10036,10038,10040],{"class":43,"line":1027},[41,10037,676],{"class":47},[41,10039,96],{"class":51},[41,10041,99],{"class":47},[41,10043,10044,10046,10048,10050],{"class":43,"line":5507},[41,10045,5510],{"class":58},[41,10047,5513],{"class":197},[41,10049,151],{"class":47},[41,10051,154],{"class":47},[41,10053,10054,10056,10058,10060,10062,10064,10066,10068,10070],{"class":43,"line":5520},[41,10055,5523],{"class":126},[41,10057,130],{"class":47},[41,10059,168],{"class":197},[41,10061,201],{"class":51},[41,10063,230],{"class":47},[41,10065,557],{"class":68},[41,10067,230],{"class":47},[41,10069,238],{"class":47},[41,10071,154],{"class":47},[41,10073,10074,10076,10078,10080,10082,10084],{"class":43,"line":5542},[41,10075,5545],{"class":51},[41,10077,30],{"class":47},[41,10079,251],{"class":47},[41,10081,701],{"class":68},[41,10083,230],{"class":47},[41,10085,936],{"class":47},[41,10087,10088,10090,10092,10094,10096,10098],{"class":43,"line":5558},[41,10089,5561],{"class":51},[41,10091,30],{"class":47},[41,10093,251],{"class":47},[41,10095,381],{"class":68},[41,10097,230],{"class":47},[41,10099,936],{"class":47},[41,10101,10102,10104,10106],{"class":43,"line":5574},[41,10103,5577],{"class":51},[41,10105,30],{"class":47},[41,10107,961],{"class":51},[41,10109,10110],{"class":43,"line":5584},[41,10111,3169],{"class":47},[41,10113,10114,10116,10118,10120,10122,10124],{"class":43,"line":5589},[41,10115,3174],{"class":51},[41,10117,30],{"class":47},[41,10119,251],{"class":47},[41,10121,9741],{"class":68},[41,10123,230],{"class":47},[41,10125,936],{"class":47},[41,10127,10128,10130,10132,10134,10136,10138],{"class":43,"line":5604},[41,10129,3189],{"class":51},[41,10131,30],{"class":47},[41,10133,251],{"class":47},[41,10135,5613],{"class":68},[41,10137,230],{"class":47},[41,10139,936],{"class":47},[41,10141,10142],{"class":43,"line":5620},[41,10143,3204],{"class":47},[41,10145,10146,10148],{"class":43,"line":5625},[41,10147,3209],{"class":51},[41,10149,936],{"class":47},[41,10151,10152,10154,10156],{"class":43,"line":5632},[41,10153,5635],{"class":47},[41,10155,207],{"class":51},[41,10157,210],{"class":47},[41,10159,10160],{"class":43,"line":5642},[41,10161,5645],{"class":47},[41,10163,10164,10166,10168],{"class":43,"line":5648},[41,10165,758],{"class":47},[41,10167,96],{"class":51},[41,10169,99],{"class":47},[41,10171,10172,10174,10176],{"class":43,"line":5657},[41,10173,273],{"class":47},[41,10175,5179],{"class":51},[41,10177,99],{"class":47},[41,10179,10180,10182,10184],{"class":43,"line":5666},[41,10181,273],{"class":47},[41,10183,36],{"class":51},[41,10185,99],{"class":47},[19,10187,10189],{"id":10188},"ключевые-моменты","Ключевые моменты",[2162,10191,10192,10195,10203],{},[2165,10193,10194],{},"Сначала загружается пакетный скрипт.",[2165,10196,10197,10198,10200,10201,130],{},"Инициализируйте с помощью ",[27,10199,5687],{}," перед вызовом ",[27,10202,557],{},[2165,10204,10205,10207],{},[27,10206,1195],{}," должен совпадать с существующим элементом на странице.",[1035,10209,5698],{},{"title":37,"searchDepth":55,"depth":55,"links":10211},[10212,10213],{"id":9604,"depth":55,"text":9605},{"id":10188,"depth":55,"text":10189},"Интеграция с обычным HTML\u002FJavaScript",{},{"title":5035,"description":10214},"integrations\u002Fvanilla-js","TOVOFdq4t72IBSUKHoJgLGlQk10I_zCs_rea9Sj9PGA",{"id":10220,"title":5,"body":10221,"description":11051,"extension":1044,"icon":1045,"meta":11052,"navigation":348,"path":11053,"seo":11054,"stem":11055,"__hash__":11056},"content\u002Fintegrations\u002Fvue.md",{"type":7,"value":10222,"toc":11046},[10223,10227,10230,10232,10237,10415,10419,10711,10715,11044],[10,10224,10226],{"id":10225},"интеграция-с-vue-3","Интеграция с Vue 3",[15,10228,10229],{},"Работает с Vue 3 + Vite или любым другим окружением Vue 3.",[19,10231,8756],{"id":8755},[15,10233,10234,10235,30],{},"В ",[27,10236,29],{},[32,10238,10239],{"className":34,"code":35,"language":36,"meta":37,"style":37},[27,10240,10241,10247,10259,10271,10279,10297,10321,10363,10367,10387,10399,10407],{"__ignoreMap":37},[41,10242,10243,10245],{"class":43,"line":44},[41,10244,48],{"class":47},[41,10246,52],{"class":51},[41,10248,10249,10251,10253,10255,10257],{"class":43,"line":55},[41,10250,59],{"class":58},[41,10252,62],{"class":47},[41,10254,65],{"class":47},[41,10256,69],{"class":68},[41,10258,72],{"class":47},[41,10260,10261,10263,10265,10267,10269],{"class":43,"line":75},[41,10262,78],{"class":58},[41,10264,62],{"class":47},[41,10266,65],{"class":47},[41,10268,85],{"class":68},[41,10270,72],{"class":47},[41,10272,10273,10275,10277],{"class":43,"line":90},[41,10274,93],{"class":47},[41,10276,96],{"class":51},[41,10278,99],{"class":47},[41,10280,10281,10283,10285,10287,10289,10291,10293,10295],{"class":43,"line":102},[41,10282,48],{"class":47},[41,10284,96],{"class":51},[41,10286,109],{"class":58},[41,10288,62],{"class":47},[41,10290,65],{"class":47},[41,10292,116],{"class":68},[41,10294,65],{"class":47},[41,10296,99],{"class":47},[41,10298,10299,10301,10303,10305,10307,10309,10311,10313,10315,10317,10319],{"class":43,"line":123},[41,10300,127],{"class":126},[41,10302,130],{"class":47},[41,10304,133],{"class":126},[41,10306,62],{"class":47},[41,10308,138],{"class":126},[41,10310,130],{"class":47},[41,10312,133],{"class":126},[41,10314,145],{"class":47},[41,10316,148],{"class":58},[41,10318,151],{"class":47},[41,10320,154],{"class":47},[41,10322,10323,10325,10327,10329,10331,10333,10335,10337,10339,10341,10343,10345,10347,10349,10351,10353,10355,10357,10359,10361],{"class":43,"line":157},[41,10324,160],{"class":51},[41,10326,163],{"class":126},[41,10328,130],{"class":47},[41,10330,168],{"class":126},[41,10332,130],{"class":47},[41,10334,173],{"class":126},[41,10336,176],{"class":47},[41,10338,138],{"class":126},[41,10340,130],{"class":47},[41,10342,168],{"class":126},[41,10344,130],{"class":47},[41,10346,173],{"class":126},[41,10348,189],{"class":47},[41,10350,192],{"class":51},[41,10352,130],{"class":47},[41,10354,198],{"class":197},[41,10356,201],{"class":51},[41,10358,204],{"class":126},[41,10360,207],{"class":51},[41,10362,210],{"class":47},[41,10364,10365],{"class":43,"line":213},[41,10366,216],{"class":47},[41,10368,10369,10371,10373,10375,10377,10379,10381,10383,10385],{"class":43,"line":219},[41,10370,127],{"class":126},[41,10372,130],{"class":47},[41,10374,168],{"class":197},[41,10376,201],{"class":126},[41,10378,230],{"class":47},[41,10380,233],{"class":68},[41,10382,230],{"class":47},[41,10384,238],{"class":47},[41,10386,154],{"class":47},[41,10388,10389,10391,10393,10395,10397],{"class":43,"line":243},[41,10390,246],{"class":51},[41,10392,30],{"class":47},[41,10394,251],{"class":47},[41,10396,254],{"class":68},[41,10398,257],{"class":47},[41,10400,10401,10403,10405],{"class":43,"line":260},[41,10402,263],{"class":47},[41,10404,207],{"class":126},[41,10406,210],{"class":47},[41,10408,10409,10411,10413],{"class":43,"line":270},[41,10410,273],{"class":47},[41,10412,96],{"class":51},[41,10414,99],{"class":47},[19,10416,10418],{"id":10417},"_2-создайте-composable","2. Создайте composable",[32,10420,10421],{"className":284,"code":285,"language":286,"meta":37,"style":37},[27,10422,10423,10427,10437,10445,10453,10461,10465,10469,10479,10487,10515,10525,10529,10533,10541,10549,10577,10581,10585,10589,10601,10623,10645,10649,10653,10667,10685,10689,10693,10707],{"__ignoreMap":37},[41,10424,10425],{"class":43,"line":44},[41,10426,294],{"class":293},[41,10428,10429,10431,10433,10435],{"class":43,"line":55},[41,10430,300],{"class":299},[41,10432,303],{"class":58},[41,10434,307],{"class":306},[41,10436,154],{"class":47},[41,10438,10439,10441,10443],{"class":43,"line":75},[41,10440,314],{"class":51},[41,10442,30],{"class":47},[41,10444,319],{"class":306},[41,10446,10447,10449,10451],{"class":43,"line":90},[41,10448,324],{"class":51},[41,10450,30],{"class":47},[41,10452,319],{"class":306},[41,10454,10455,10457,10459],{"class":43,"line":102},[41,10456,333],{"class":51},[41,10458,336],{"class":47},[41,10460,319],{"class":306},[41,10462,10463],{"class":43,"line":123},[41,10464,343],{"class":47},[41,10466,10467],{"class":43,"line":157},[41,10468,349],{"emptyLinePlaceholder":348},[41,10470,10471,10473,10475,10477],{"class":43,"line":213},[41,10472,300],{"class":299},[41,10474,303],{"class":58},[41,10476,358],{"class":306},[41,10478,154],{"class":47},[41,10480,10481,10483,10485],{"class":43,"line":219},[41,10482,365],{"class":51},[41,10484,30],{"class":47},[41,10486,319],{"class":306},[41,10488,10489,10491,10493,10495,10497,10499,10501,10503,10505,10507,10509,10511,10513],{"class":43,"line":243},[41,10490,374],{"class":51},[41,10492,336],{"class":47},[41,10494,251],{"class":47},[41,10496,381],{"class":68},[41,10498,230],{"class":47},[41,10500,386],{"class":47},[41,10502,251],{"class":47},[41,10504,391],{"class":68},[41,10506,230],{"class":47},[41,10508,386],{"class":47},[41,10510,251],{"class":47},[41,10512,400],{"class":68},[41,10514,257],{"class":47},[41,10516,10517,10519,10521,10523],{"class":43,"line":260},[41,10518,407],{"class":51},[41,10520,30],{"class":47},[41,10522,307],{"class":306},[41,10524,414],{"class":126},[41,10526,10527],{"class":43,"line":270},[41,10528,343],{"class":47},[41,10530,10531],{"class":43,"line":421},[41,10532,349],{"emptyLinePlaceholder":348},[41,10534,10535,10537,10539],{"class":43,"line":426},[41,10536,429],{"class":58},[41,10538,432],{"class":126},[41,10540,435],{"class":47},[41,10542,10543,10545,10547],{"class":43,"line":438},[41,10544,441],{"class":58},[41,10546,444],{"class":306},[41,10548,154],{"class":47},[41,10550,10551,10553,10555,10557,10559,10561,10563,10565,10567,10569,10571,10573,10575],{"class":43,"line":449},[41,10552,452],{"class":51},[41,10554,30],{"class":47},[41,10556,457],{"class":47},[41,10558,461],{"class":460},[41,10560,30],{"class":47},[41,10562,466],{"class":306},[41,10564,238],{"class":47},[41,10566,471],{"class":460},[41,10568,336],{"class":47},[41,10570,476],{"class":306},[41,10572,207],{"class":47},[41,10574,481],{"class":58},[41,10576,484],{"class":306},[41,10578,10579],{"class":43,"line":487},[41,10580,490],{"class":47},[41,10582,10583],{"class":43,"line":493},[41,10584,343],{"class":47},[41,10586,10587],{"class":43,"line":498},[41,10588,349],{"emptyLinePlaceholder":348},[41,10590,10591,10593,10595,10597,10599],{"class":43,"line":503},[41,10592,300],{"class":299},[41,10594,148],{"class":58},[41,10596,510],{"class":197},[41,10598,151],{"class":47},[41,10600,154],{"class":47},[41,10602,10603,10605,10607,10609,10611,10613,10615,10617,10619,10621],{"class":43,"line":517},[41,10604,520],{"class":58},[41,10606,523],{"class":126},[41,10608,176],{"class":47},[41,10610,457],{"class":47},[41,10612,530],{"class":460},[41,10614,30],{"class":47},[41,10616,358],{"class":306},[41,10618,207],{"class":47},[41,10620,481],{"class":58},[41,10622,154],{"class":47},[41,10624,10625,10627,10629,10631,10633,10635,10637,10639,10641,10643],{"class":43,"line":543},[41,10626,546],{"class":126},[41,10628,130],{"class":47},[41,10630,168],{"class":197},[41,10632,201],{"class":51},[41,10634,230],{"class":47},[41,10636,557],{"class":68},[41,10638,230],{"class":47},[41,10640,238],{"class":47},[41,10642,471],{"class":126},[41,10644,566],{"class":51},[41,10646,10647],{"class":43,"line":569},[41,10648,490],{"class":47},[41,10650,10651],{"class":43,"line":574},[41,10652,349],{"emptyLinePlaceholder":348},[41,10654,10655,10657,10659,10661,10663,10665],{"class":43,"line":579},[41,10656,520],{"class":58},[41,10658,584],{"class":126},[41,10660,176],{"class":47},[41,10662,589],{"class":47},[41,10664,481],{"class":58},[41,10666,154],{"class":47},[41,10668,10669,10671,10673,10675,10677,10679,10681,10683],{"class":43,"line":596},[41,10670,546],{"class":126},[41,10672,130],{"class":47},[41,10674,168],{"class":197},[41,10676,201],{"class":51},[41,10678,230],{"class":47},[41,10680,609],{"class":68},[41,10682,230],{"class":47},[41,10684,566],{"class":51},[41,10686,10687],{"class":43,"line":616},[41,10688,490],{"class":47},[41,10690,10691],{"class":43,"line":621},[41,10692,349],{"emptyLinePlaceholder":348},[41,10694,10695,10697,10699,10701,10703,10705],{"class":43,"line":626},[41,10696,629],{"class":299},[41,10698,632],{"class":47},[41,10700,523],{"class":126},[41,10702,238],{"class":47},[41,10704,584],{"class":126},[41,10706,641],{"class":47},[41,10708,10709],{"class":43,"line":644},[41,10710,343],{"class":47},[19,10712,10714],{"id":10713},"_3-создайте-компонент-виджета","3. Создайте компонент виджета",[32,10716,10718],{"className":653,"code":10717,"language":655,"meta":37,"style":37},"\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",[27,10719,10720,10724,10732,10740,10746,10758,10770,10774,10800,10808,10816,10820,10840,10864,10868,10880,10888,10896,10902,10906,10922,10926,10940,10948,10962,10976,10984,10988,11002,11016,11020,11026,11032,11036],{"__ignoreMap":37},[41,10721,10722],{"class":43,"line":44},[41,10723,662],{"class":293},[41,10725,10726,10728,10730],{"class":43,"line":55},[41,10727,48],{"class":47},[41,10729,669],{"class":51},[41,10731,99],{"class":47},[41,10733,10734,10736,10738],{"class":43,"line":75},[41,10735,676],{"class":47},[41,10737,679],{"class":51},[41,10739,99],{"class":47},[41,10741,10742,10744],{"class":43,"line":90},[41,10743,686],{"class":47},[41,10745,689],{"class":51},[41,10747,10748,10750,10752,10754,10756],{"class":43,"line":102},[41,10749,694],{"class":58},[41,10751,62],{"class":47},[41,10753,65],{"class":47},[41,10755,701],{"class":68},[41,10757,72],{"class":47},[41,10759,10760,10762,10764,10766,10768],{"class":43,"line":123},[41,10761,708],{"class":58},[41,10763,62],{"class":47},[41,10765,65],{"class":47},[41,10767,715],{"class":68},[41,10769,72],{"class":47},[41,10771,10772],{"class":43,"line":157},[41,10773,722],{"class":47},[41,10775,10776,10778,10780,10782,10784,10786,10788,10790,10792,10794,10796,10798],{"class":43,"line":213},[41,10777,686],{"class":47},[41,10779,729],{"class":51},[41,10781,732],{"class":58},[41,10783,62],{"class":47},[41,10785,65],{"class":47},[41,10787,739],{"class":68},[41,10789,65],{"class":47},[41,10791,744],{"class":47},[41,10793,7622],{"class":126},[41,10795,273],{"class":47},[41,10797,729],{"class":51},[41,10799,99],{"class":47},[41,10801,10802,10804,10806],{"class":43,"line":219},[41,10803,758],{"class":47},[41,10805,679],{"class":51},[41,10807,99],{"class":47},[41,10809,10810,10812,10814],{"class":43,"line":243},[41,10811,273],{"class":47},[41,10813,669],{"class":51},[41,10815,99],{"class":47},[41,10817,10818],{"class":43,"line":260},[41,10819,349],{"emptyLinePlaceholder":348},[41,10821,10822,10824,10826,10828,10830,10832,10834,10836,10838],{"class":43,"line":270},[41,10823,48],{"class":47},[41,10825,96],{"class":51},[41,10827,783],{"class":58},[41,10829,786],{"class":58},[41,10831,62],{"class":47},[41,10833,65],{"class":47},[41,10835,286],{"class":68},[41,10837,65],{"class":47},[41,10839,99],{"class":47},[41,10841,10842,10844,10846,10848,10850,10852,10854,10856,10858,10860,10862],{"class":43,"line":421},[41,10843,801],{"class":299},[41,10845,632],{"class":47},[41,10847,510],{"class":126},[41,10849,238],{"class":47},[41,10851,810],{"class":299},[41,10853,307],{"class":126},[41,10855,815],{"class":47},[41,10857,818],{"class":299},[41,10859,251],{"class":47},[41,10861,823],{"class":68},[41,10863,257],{"class":47},[41,10865,10866],{"class":43,"line":426},[41,10867,349],{"emptyLinePlaceholder":348},[41,10869,10870,10872,10874,10876,10878],{"class":43,"line":438},[41,10871,834],{"class":58},[41,10873,837],{"class":126},[41,10875,62],{"class":47},[41,10877,842],{"class":197},[41,10879,845],{"class":47},[41,10881,10882,10884,10886],{"class":43,"line":449},[41,10883,314],{"class":51},[41,10885,30],{"class":47},[41,10887,319],{"class":306},[41,10889,10890,10892,10894],{"class":43,"line":487},[41,10891,858],{"class":51},[41,10893,30],{"class":47},[41,10895,319],{"class":306},[41,10897,10898,10900],{"class":43,"line":493},[41,10899,867],{"class":47},[41,10901,870],{"class":126},[41,10903,10904],{"class":43,"line":498},[41,10905,349],{"emptyLinePlaceholder":348},[41,10907,10908,10910,10912,10914,10916,10918,10920],{"class":43,"line":503},[41,10909,834],{"class":58},[41,10911,632],{"class":47},[41,10913,883],{"class":126},[41,10915,886],{"class":47},[41,10917,176],{"class":47},[41,10919,510],{"class":197},[41,10921,870],{"class":126},[41,10923,10924],{"class":43,"line":517},[41,10925,349],{"emptyLinePlaceholder":348},[41,10927,10928,10930,10932,10934,10936,10938],{"class":43,"line":543},[41,10929,834],{"class":58},[41,10931,903],{"class":126},[41,10933,62],{"class":47},[41,10935,589],{"class":47},[41,10937,481],{"class":58},[41,10939,154],{"class":47},[41,10941,10942,10944,10946],{"class":43,"line":569},[41,10943,916],{"class":197},[41,10945,201],{"class":51},[41,10947,435],{"class":47},[41,10949,10950,10952,10954,10956,10958,10960],{"class":43,"line":574},[41,10951,925],{"class":51},[41,10953,30],{"class":47},[41,10955,251],{"class":47},[41,10957,701],{"class":68},[41,10959,230],{"class":47},[41,10961,936],{"class":47},[41,10963,10964,10966,10968,10970,10972,10974],{"class":43,"line":579},[41,10965,941],{"class":51},[41,10967,30],{"class":47},[41,10969,251],{"class":47},[41,10971,381],{"class":68},[41,10973,230],{"class":47},[41,10975,936],{"class":47},[41,10977,10978,10980,10982],{"class":43,"line":596},[41,10979,956],{"class":51},[41,10981,30],{"class":47},[41,10983,961],{"class":51},[41,10985,10986],{"class":43,"line":616},[41,10987,966],{"class":47},[41,10989,10990,10992,10994,10996,10998,11000],{"class":43,"line":621},[41,10991,971],{"class":51},[41,10993,30],{"class":47},[41,10995,976],{"class":126},[41,10997,130],{"class":47},[41,10999,981],{"class":126},[41,11001,936],{"class":47},[41,11003,11004,11006,11008,11010,11012,11014],{"class":43,"line":626},[41,11005,988],{"class":51},[41,11007,30],{"class":47},[41,11009,976],{"class":126},[41,11011,130],{"class":47},[41,11013,997],{"class":126},[41,11015,936],{"class":47},[41,11017,11018],{"class":43,"line":644},[41,11019,1004],{"class":47},[41,11021,11022,11024],{"class":43,"line":1007},[41,11023,1010],{"class":51},[41,11025,936],{"class":47},[41,11027,11028,11030],{"class":43,"line":1015},[41,11029,263],{"class":47},[41,11031,566],{"class":51},[41,11033,11034],{"class":43,"line":1022},[41,11035,343],{"class":47},[41,11037,11038,11040,11042],{"class":43,"line":1027},[41,11039,273],{"class":47},[41,11041,96],{"class":51},[41,11043,99],{"class":47},[1035,11045,1037],{},{"title":37,"searchDepth":55,"depth":55,"links":11047},[11048,11049,11050],{"id":8755,"depth":55,"text":8756},{"id":10417,"depth":55,"text":10418},{"id":10713,"depth":55,"text":10714},"Интеграция с Vue 3 приложением",{},"\u002Fintegrations\u002Fvue",{"title":5,"description":11051},"integrations\u002Fvue","940Q7exH9C3y9bXr_sW6skJzNNxxGlNzOBpnASqYjFU",1779283221010]