[{"data":1,"prerenderedAt":552},["ShallowReactive",2],{"navigation_docs":3,"-frameworks-vue":49,"-frameworks-vue-surround":549},[4,8,12,16,20,24,28],{"title":5,"path":6,"stem":7},"Introduction","\u002Fintroduction","1.introduction",{"title":9,"path":10,"stem":11},"Installation","\u002Finstallation","2.installation",{"title":13,"path":14,"stem":15},"SDKs","\u002Fsdk","3.sdk",{"title":17,"path":18,"stem":19},"Dashboard","\u002Fdashboard","4.dashboard",{"title":21,"path":22,"stem":23},"HTTP API","\u002Fhttp-api","5.http-api",{"title":25,"path":26,"stem":27},"Image Transformations","\u002Ftransformations","6.transformations",{"title":29,"path":30,"stem":31,"children":32},"Framework Components","\u002Fframeworks","frameworks",[33,37,41,45],{"title":34,"path":35,"stem":36},"Qwik","\u002Fframeworks\u002Fqwik","frameworks\u002Fqwik",{"title":38,"path":39,"stem":40},"React","\u002Fframeworks\u002Freact","frameworks\u002Freact",{"title":42,"path":43,"stem":44},"Svelte","\u002Fframeworks\u002Fsvelte","frameworks\u002Fsvelte",{"title":46,"path":47,"stem":48},"Vue","\u002Fframeworks\u002Fvue","frameworks\u002Fvue",{"id":50,"title":46,"body":51,"description":543,"extension":544,"links":545,"meta":546,"navigation":134,"path":47,"seo":547,"stem":48,"__hash__":548},"docs\u002Fframeworks\u002Fvue.md",{"type":52,"value":53,"toc":538},"minimark",[54,63,68,334,338,469,473,534],[55,56,57,58,62],"p",{},"The ",[59,60,61],"code",{},"@pichaflow\u002Fvue"," package provides a reactive upload component.",[64,65,67],"h2",{"id":66},"usage","Usage",[69,70,75],"pre",{"className":71,"code":72,"language":73,"meta":74,"style":74},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup>\nimport { PichaUpload } from '@pichaflow\u002Fvue';\n\nconst onUploadSuccess = (response) => {\n  console.log('Uploaded:', response.url);\n};\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CPichaUpload\n    api-key=\"pk_live_...\"\n    :use-secure=\"true\"\n    signature-url=\"\u002Fapi\u002Fmedia\u002Fv1\u002Fupload\u002Fsign\"\n    :tags=\"['hero', 'banner']\"\n    @success=\"onUploadSuccess\"\n  \u002F>\n\u003C\u002Ftemplate>\n","vue","",[59,76,77,97,129,136,164,202,208,218,223,233,242,259,274,289,304,319,325],{"__ignoreMap":74},[78,79,82,86,90,94],"span",{"class":80,"line":81},"line",1,[78,83,85],{"class":84},"sMK4o","\u003C",[78,87,89],{"class":88},"swJcz","script",[78,91,93],{"class":92},"spNyl"," setup",[78,95,96],{"class":84},">\n",[78,98,100,104,107,111,114,117,120,123,126],{"class":80,"line":99},2,[78,101,103],{"class":102},"s7zQu","import",[78,105,106],{"class":84}," {",[78,108,110],{"class":109},"sTEyZ"," PichaUpload",[78,112,113],{"class":84}," }",[78,115,116],{"class":102}," from",[78,118,119],{"class":84}," '",[78,121,61],{"class":122},"sfazB",[78,124,125],{"class":84},"'",[78,127,128],{"class":84},";\n",[78,130,132],{"class":80,"line":131},3,[78,133,135],{"emptyLinePlaceholder":134},true,"\n",[78,137,139,142,145,148,151,155,158,161],{"class":80,"line":138},4,[78,140,141],{"class":92},"const",[78,143,144],{"class":109}," onUploadSuccess ",[78,146,147],{"class":84},"=",[78,149,150],{"class":84}," (",[78,152,154],{"class":153},"sHdIc","response",[78,156,157],{"class":84},")",[78,159,160],{"class":92}," =>",[78,162,163],{"class":84}," {\n",[78,165,167,170,173,177,180,182,185,187,190,193,195,198,200],{"class":80,"line":166},5,[78,168,169],{"class":109},"  console",[78,171,172],{"class":84},".",[78,174,176],{"class":175},"s2Zo4","log",[78,178,179],{"class":88},"(",[78,181,125],{"class":84},[78,183,184],{"class":122},"Uploaded:",[78,186,125],{"class":84},[78,188,189],{"class":84},",",[78,191,192],{"class":109}," response",[78,194,172],{"class":84},[78,196,197],{"class":109},"url",[78,199,157],{"class":88},[78,201,128],{"class":84},[78,203,205],{"class":80,"line":204},6,[78,206,207],{"class":84},"};\n",[78,209,211,214,216],{"class":80,"line":210},7,[78,212,213],{"class":84},"\u003C\u002F",[78,215,89],{"class":88},[78,217,96],{"class":84},[78,219,221],{"class":80,"line":220},8,[78,222,135],{"emptyLinePlaceholder":134},[78,224,226,228,231],{"class":80,"line":225},9,[78,227,85],{"class":84},[78,229,230],{"class":88},"template",[78,232,96],{"class":84},[78,234,236,239],{"class":80,"line":235},10,[78,237,238],{"class":84},"  \u003C",[78,240,241],{"class":88},"PichaUpload\n",[78,243,245,248,250,253,256],{"class":80,"line":244},11,[78,246,247],{"class":92},"    api-key",[78,249,147],{"class":84},[78,251,252],{"class":84},"\"",[78,254,255],{"class":122},"pk_live_...",[78,257,258],{"class":84},"\"\n",[78,260,262,265,267,269,272],{"class":80,"line":261},12,[78,263,264],{"class":92},"    :use-secure",[78,266,147],{"class":84},[78,268,252],{"class":84},[78,270,271],{"class":122},"true",[78,273,258],{"class":84},[78,275,277,280,282,284,287],{"class":80,"line":276},13,[78,278,279],{"class":92},"    signature-url",[78,281,147],{"class":84},[78,283,252],{"class":84},[78,285,286],{"class":122},"\u002Fapi\u002Fmedia\u002Fv1\u002Fupload\u002Fsign",[78,288,258],{"class":84},[78,290,292,295,297,299,302],{"class":80,"line":291},14,[78,293,294],{"class":92},"    :tags",[78,296,147],{"class":84},[78,298,252],{"class":84},[78,300,301],{"class":122},"['hero', 'banner']",[78,303,258],{"class":84},[78,305,307,310,312,314,317],{"class":80,"line":306},15,[78,308,309],{"class":92},"    @success",[78,311,147],{"class":84},[78,313,252],{"class":84},[78,315,316],{"class":122},"onUploadSuccess",[78,318,258],{"class":84},[78,320,322],{"class":80,"line":321},16,[78,323,324],{"class":84},"  \u002F>\n",[78,326,328,330,332],{"class":80,"line":327},17,[78,329,213],{"class":84},[78,331,230],{"class":88},[78,333,96],{"class":84},[64,335,337],{"id":336},"props","Props",[339,340,341,360],"table",{},[342,343,344],"thead",{},[345,346,347,351,354,357],"tr",{},[348,349,350],"th",{},"Prop",[348,352,353],{},"Type",[348,355,356],{},"Default",[348,358,359],{},"Description",[361,362,363,388,408,430,449],"tbody",{},[345,364,365,371,376,382],{},[366,367,368],"td",{},[59,369,370],{},"apiKey",[366,372,373],{},[59,374,375],{},"string",[366,377,378],{},[379,380,381],"strong",{},"Required",[366,383,384,385,387],{},"Your PichaFlow Public Key (",[59,386,255],{},"). Use Secret Key only in trusted backend apps.",[345,389,390,395,400,405],{},[366,391,392],{},[59,393,394],{},"useSecure",[366,396,397],{},[59,398,399],{},"boolean",[366,401,402],{},[59,403,404],{},"false",[366,406,407],{},"Enable the HMAC-SHA256 handshake flow for secure browser uploads.",[345,409,410,415,419,424],{},[366,411,412],{},[59,413,414],{},"signatureUrl",[366,416,417],{},[59,418,375],{},[366,420,421],{},[59,422,423],{},"undefined",[366,425,426,427,429],{},"The endpoint on your backend that signs the upload request (Required if ",[59,428,394],{}," is true).",[345,431,432,437,441,446],{},[366,433,434],{},[59,435,436],{},"baseUrl",[366,438,439],{},[59,440,375],{},[366,442,443],{},[59,444,445],{},"https:\u002F\u002Fapi.pichaflow.com",[366,447,448],{},"Optional API base URL.",[345,450,451,456,461,466],{},[366,452,453],{},[59,454,455],{},"tags",[366,457,458],{},[59,459,460],{},"string[]",[366,462,463],{},[59,464,465],{},"[]",[366,467,468],{},"Tags to apply to the upload.",[64,470,472],{"id":471},"events","Events",[339,474,475,487],{},[342,476,477],{},[345,478,479,482,485],{},[348,480,481],{},"Event",[348,483,484],{},"Payload",[348,486,359],{},[361,488,489,504,519],{},[345,490,491,496,501],{},[366,492,493],{},[59,494,495],{},"success",[366,497,498],{},[59,499,500],{},"UploadResponse",[366,502,503],{},"Fired when upload completes successfully.",[345,505,506,511,516],{},[366,507,508],{},[59,509,510],{},"error",[366,512,513],{},[59,514,515],{},"any",[366,517,518],{},"Fired on network or server errors.",[345,520,521,526,531],{},[366,522,523],{},[59,524,525],{},"progress",[366,527,528],{},[59,529,530],{},"number",[366,532,533],{},"Fired during upload progress updates.",[535,536,537],"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 .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 .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}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 .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":74,"searchDepth":99,"depth":99,"links":539},[540,541,542],{"id":66,"depth":99,"text":67},{"id":336,"depth":99,"text":337},{"id":471,"depth":99,"text":472},"Integrate PichaFlow into your Vue and Nuxt applications.","md",null,{},{"title":46,"description":543},"twj52C8e-LAX_ZzIgHP-ia5Q1wDiAZbTyEZpTe22Gww",[550,545],{"title":42,"path":43,"stem":44,"description":551,"children":-1},"Integrate PichaFlow into your Svelte and SvelteKit applications with ease.",1779934775330]