[{"data":1,"prerenderedAt":599},["ShallowReactive",2],{"navigation_docs":3,"-frameworks-qwik":49,"-frameworks-qwik-surround":595},[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":34,"body":51,"description":589,"extension":590,"links":591,"meta":592,"navigation":146,"path":35,"seo":593,"stem":36,"__hash__":594},"docs\u002Fframeworks\u002Fqwik.md",{"type":52,"value":53,"toc":584},"minimark",[54,63,68,390,394,526,530,537,580],[55,56,57,58,62],"p",{},"The ",[59,60,61],"code",{},"@pichaflow\u002Fqwik"," package provides a high-performance upload component optimized for Qwik's resumability.",[64,65,67],"h2",{"id":66},"usage","Usage",[69,70,75],"pre",{"className":71,"code":72,"language":73,"meta":74,"style":74},"language-tsx shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { component$, $ } from '@builder.io\u002Fqwik';\nimport { PichaUpload } from '@pichaflow\u002Fqwik';\n\nexport default component$(() => {\n  const onUploadSuccess$ = $((response) => {\n    console.log('Uploaded to Edge:', response.url);\n  });\n\n  return (\n    \u003CPichaUpload\n      apiKey=\"pk_live_your_public_key\"\n      useSecure={true}\n      signatureUrl=\"\u002Fapi\u002Fmedia\u002Fv1\u002Fupload\u002Fsign\"\n      tags={['ecommerce', 'qwik']}\n      onSuccess$={onUploadSuccess$}\n    \u002F>\n  );\n});\n","tsx","",[59,76,77,119,141,148,173,203,238,248,253,262,272,290,306,321,353,366,372,380],{"__ignoreMap":74},[78,79,82,86,90,94,97,100,103,106,109,113,116],"span",{"class":80,"line":81},"line",1,[78,83,85],{"class":84},"s7zQu","import",[78,87,89],{"class":88},"sMK4o"," {",[78,91,93],{"class":92},"sTEyZ"," component$",[78,95,96],{"class":88},",",[78,98,99],{"class":92}," $",[78,101,102],{"class":88}," }",[78,104,105],{"class":84}," from",[78,107,108],{"class":88}," '",[78,110,112],{"class":111},"sfazB","@builder.io\u002Fqwik",[78,114,115],{"class":88},"'",[78,117,118],{"class":88},";\n",[78,120,122,124,126,129,131,133,135,137,139],{"class":80,"line":121},2,[78,123,85],{"class":84},[78,125,89],{"class":88},[78,127,128],{"class":92}," PichaUpload",[78,130,102],{"class":88},[78,132,105],{"class":84},[78,134,108],{"class":88},[78,136,61],{"class":111},[78,138,115],{"class":88},[78,140,118],{"class":88},[78,142,144],{"class":80,"line":143},3,[78,145,147],{"emptyLinePlaceholder":146},true,"\n",[78,149,151,154,157,160,163,166,170],{"class":80,"line":150},4,[78,152,153],{"class":84},"export",[78,155,156],{"class":84}," default",[78,158,93],{"class":159},"s2Zo4",[78,161,162],{"class":92},"(",[78,164,165],{"class":88},"()",[78,167,169],{"class":168},"spNyl"," =>",[78,171,172],{"class":88}," {\n",[78,174,176,179,182,185,187,190,192,196,199,201],{"class":80,"line":175},5,[78,177,178],{"class":168},"  const",[78,180,181],{"class":92}," onUploadSuccess$",[78,183,184],{"class":88}," =",[78,186,99],{"class":159},[78,188,162],{"class":189},"swJcz",[78,191,162],{"class":88},[78,193,195],{"class":194},"sHdIc","response",[78,197,198],{"class":88},")",[78,200,169],{"class":168},[78,202,172],{"class":88},[78,204,206,209,212,215,217,219,222,224,226,229,231,234,236],{"class":80,"line":205},6,[78,207,208],{"class":92},"    console",[78,210,211],{"class":88},".",[78,213,214],{"class":159},"log",[78,216,162],{"class":189},[78,218,115],{"class":88},[78,220,221],{"class":111},"Uploaded to Edge:",[78,223,115],{"class":88},[78,225,96],{"class":88},[78,227,228],{"class":92}," response",[78,230,211],{"class":88},[78,232,233],{"class":92},"url",[78,235,198],{"class":189},[78,237,118],{"class":88},[78,239,241,244,246],{"class":80,"line":240},7,[78,242,243],{"class":88},"  }",[78,245,198],{"class":189},[78,247,118],{"class":88},[78,249,251],{"class":80,"line":250},8,[78,252,147],{"emptyLinePlaceholder":146},[78,254,256,259],{"class":80,"line":255},9,[78,257,258],{"class":84},"  return",[78,260,261],{"class":189}," (\n",[78,263,265,268],{"class":80,"line":264},10,[78,266,267],{"class":88},"    \u003C",[78,269,271],{"class":270},"sBMFI","PichaUpload\n",[78,273,275,278,281,284,287],{"class":80,"line":274},11,[78,276,277],{"class":168},"      apiKey",[78,279,280],{"class":88},"=",[78,282,283],{"class":88},"\"",[78,285,286],{"class":111},"pk_live_your_public_key",[78,288,289],{"class":88},"\"\n",[78,291,293,296,299,303],{"class":80,"line":292},12,[78,294,295],{"class":168},"      useSecure",[78,297,298],{"class":88},"={",[78,300,302],{"class":301},"sfNiH","true",[78,304,305],{"class":88},"}\n",[78,307,309,312,314,316,319],{"class":80,"line":308},13,[78,310,311],{"class":168},"      signatureUrl",[78,313,280],{"class":88},[78,315,283],{"class":88},[78,317,318],{"class":111},"\u002Fapi\u002Fmedia\u002Fv1\u002Fupload\u002Fsign",[78,320,289],{"class":88},[78,322,324,327,329,332,334,337,339,341,343,346,348,351],{"class":80,"line":323},14,[78,325,326],{"class":168},"      tags",[78,328,298],{"class":88},[78,330,331],{"class":92},"[",[78,333,115],{"class":88},[78,335,336],{"class":111},"ecommerce",[78,338,115],{"class":88},[78,340,96],{"class":88},[78,342,108],{"class":88},[78,344,345],{"class":111},"qwik",[78,347,115],{"class":88},[78,349,350],{"class":92},"]",[78,352,305],{"class":88},[78,354,356,359,361,364],{"class":80,"line":355},15,[78,357,358],{"class":168},"      onSuccess$",[78,360,298],{"class":88},[78,362,363],{"class":92},"onUploadSuccess$",[78,365,305],{"class":88},[78,367,369],{"class":80,"line":368},16,[78,370,371],{"class":88},"    \u002F>\n",[78,373,375,378],{"class":80,"line":374},17,[78,376,377],{"class":189},"  )",[78,379,118],{"class":88},[78,381,383,386,388],{"class":80,"line":382},18,[78,384,385],{"class":88},"}",[78,387,198],{"class":92},[78,389,118],{"class":88},[64,391,393],{"id":392},"props","Props",[395,396,397,416],"table",{},[398,399,400],"thead",{},[401,402,403,407,410,413],"tr",{},[404,405,406],"th",{},"Prop",[404,408,409],{},"Type",[404,411,412],{},"Default",[404,414,415],{},"Description",[417,418,419,445,465,487,506],"tbody",{},[401,420,421,427,432,438],{},[422,423,424],"td",{},[59,425,426],{},"apiKey",[422,428,429],{},[59,430,431],{},"string",[422,433,434],{},[435,436,437],"strong",{},"Required",[422,439,440,441,444],{},"Your PichaFlow Public Key (",[59,442,443],{},"pk_live_...",").",[401,446,447,452,457,462],{},[422,448,449],{},[59,450,451],{},"useSecure",[422,453,454],{},[59,455,456],{},"boolean",[422,458,459],{},[59,460,461],{},"false",[422,463,464],{},"Enable the HMAC-SHA256 handshake flow for secure browser uploads.",[401,466,467,472,476,481],{},[422,468,469],{},[59,470,471],{},"signatureUrl",[422,473,474],{},[59,475,431],{},[422,477,478],{},[59,479,480],{},"undefined",[422,482,483,484,486],{},"The endpoint on your backend that signs the upload request (Required if ",[59,485,451],{}," is true).",[401,488,489,494,498,503],{},[422,490,491],{},[59,492,493],{},"baseUrl",[422,495,496],{},[59,497,431],{},[422,499,500],{},[59,501,502],{},"https:\u002F\u002Fapi.pichaflow.com",[422,504,505],{},"Optional API base URL.",[401,507,508,513,518,523],{},[422,509,510],{},[59,511,512],{},"tags",[422,514,515],{},[59,516,517],{},"string[]",[422,519,520],{},[59,521,522],{},"[]",[422,524,525],{},"Tags to apply to the upload.",[64,527,529],{"id":528},"events-qrls","Events (QRLs)",[55,531,532,533,536],{},"Qwik events use the ",[59,534,535],{},"$"," suffix to indicate they are lazy-loadable.",[395,538,539,549],{},[398,540,541],{},[401,542,543,545,547],{},[404,544,406],{},[404,546,409],{},[404,548,415],{},[417,550,551,566],{},[401,552,553,558,563],{},[422,554,555],{},[59,556,557],{},"onSuccess$",[422,559,560],{},[59,561,562],{},"PropFunction",[422,564,565],{},"Fired when upload completes successfully.",[401,567,568,573,577],{},[422,569,570],{},[59,571,572],{},"onError$",[422,574,575],{},[59,576,562],{},[422,578,579],{},"Fired on network or server errors.",[581,582,583],"style",{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}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 .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}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 .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}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":121,"depth":121,"links":585},[586,587,588],{"id":66,"depth":121,"text":67},{"id":392,"depth":121,"text":393},{"id":528,"depth":121,"text":529},"Integrate PichaFlow into your Qwik applications with fine-grained reactivity.","md",null,{},{"title":34,"description":589},"8p3IgbgRT1qKprXA0f4-dTPxRESIdbSjmPVvf1oRehc",[596,597],{"title":29,"path":30,"stem":31,"children":-1,"description":74},{"title":38,"path":39,"stem":40,"description":598,"children":-1},"Integrate PichaFlow into your React and Next.js applications.",1779934775330]