https://global-free-tools.qr-code-generator.com/global-free-editor/latest/assets/index-A5EsG26-.js

1import{b as u,j as s,e as w}from"./react-DkY5NCor.js";import{p as V,T as Q,u as te,a as b,c as he,s as P,b as Me}from"../global-free-editor.js";import{s as ze,l as Te,u as Re,i as $e}from"./InputHint-BeF4ZhNU-BcEihOk7.js";import{u as Be,a as Oe,o as He,b as De,c as Ae,F as Qe}from"./floating-ui-CqFJXdbG.js";import{u as Ve}from"./useToggle-C5Zkr9zM.js";import{u as be}from"./useWindowSize-DP9gVyU8.js";import"./react-dom-D2uz-j24.js";import"./snowplow-B76Al7v7.js";function We(){var e=u.useRef(!0);return e.current?(e.current=!1,!0):e.current}var Ue=function(e,r){var t=We();u.useEffect(function(){if(!t)return e()},r)},Ke=function(){};function Ge(e){for(var r=[],t=1;t<arguments.length;t++)r[t-1]=arguments[t];e&&e.addEventListener&&e.addEventListener.apply(e,r)}function Ie(e){for(var r=[],t=1;t<arguments.length;t++)r[t-1]=arguments[t];e&&e.removeEventListener&&e.removeEventListener.apply(e,r)}var Xe=typeof window<"u",Ye=Xe?window:null,le=function(e){return!!e.addEventListener},ce=function(e){return!!e.on},Je=function(e,r,t,a){t===void 0&&(t=Ye),u.useEffect(function(){if(r&&t)return le(t)?Ge(t,e,r,a):ce(t)&&t.on(e,r,a),function(){le(t)?Ie(t,e,r,a):ce(t)&&t.off(e,r,a)}},[e,r,t,JSON.stringify(a)])},Ze=function(e){return typeof e=="function"?e:typeof e=="string"?function(r){return r.key===e}:e?function(){return!0}:function(){return!1}},ue=function(e,r,t,a){r===void 0&&(r=Ke),t===void 0&&(t={}),a===void 0&&(a=[e]);var o=t.event,n=o===void 0?"keydown":o,d=t.target,m=t.options,l=u.useMemo(function(){var v=Ze(e),c=function(p){if(v(p))return r(p)};return c},a);Je(n,l,d,m)},er=function(e){var r=u.useState([!1,null]),t=r[0],a=r[1];return ue(e,function(o){return a([!0,o])},{event:"keydown"},[t]),ue(e,function(o){return a([!1,o])},{event:"keyup"},[t]),t},de=function(e,r,t,a){a===void 0&&(a=er);var o=a(e),n=o[0],d=o[1];Ue(function(){n&&r&&r(d)},[n])},rr=({tabs:e,activeIndex:r})=>s.jsx("div",{id:`tabpanel-${e[r].id}`,role:"tabpanel","aria-labelledby":`tab-${e[r].id}`,children:e[r].content}),tr=({tabs:e,activeIndex:r})=>{let[t,a]=u.useState(0),[o,n]=u.useState(0),[d,m]=u.useState(!1),l=r===t?[t]:r>t?[t,r]:[r,t];u.useLayoutEffect(()=>{if(r===t)return;let g=r>t;m(!1),n(+!g);let N=requestAnimationFrame(()=>{requestAnimationFrame(()=>{m(!0),n(+!!g)})});return()=>cancelAnimationFrame(N)},[r,t]);let v=g=>{g.target!==g.currentTarget||g.propertyName!=="transform"||r!==t&&(a(r),m(!1),n(0))},c=l.length,p=100/c,f=c===1?0:o;return s.jsx("div",{className:"relative w-full overflow-hidden",children:s.jsx("div",{className:"flex",style:{width:`${c*100}%`,transform:`translateX(-${f*p}%)`,transition:d?"transform 300ms ease-in-out":"none"},onTransitionEnd:v,children:l.map(g=>{let N=e[g],C=g===r;return s.jsx("div",{id:`tabpanel-${N.id}`,role:"tabpanel","aria-labelledby":`tab-${N.id}`,"aria-hidden":!C,className:"box-border shrink-0 overflow-hidden",style:{width:`${p}%`},children:N.content},N.id)})})})},ar=({tabs:e,ariaLabel:r,onTabChange:t,equalWidth:a=!1,animated:o=!1})=>{let n=u.useRef(null),[d,m]=u.useState(0),l=(c,p)=>{if(c.preventDefault(),!n.current?.contains(document.activeElement))return;let f;switch(p){case"prev":for(f=d-1;f>=0&&e[f].disabled;)f--;if(f<0)for(f=e.length-1;f>=0&&e[f].disabled;)f--;break;case"next":for(f=d+1;f<e.length&&e[f].disabled;)f++;if(f>=e.length)for(f=0;f<e.length&&e[f].disabled;)f++;break}if(f!==void 0&&f>=0&&f<e.length&&!e[f].disabled){m(f);let g=document.getElementById(`tab-${e[f].id}`);g&&g.focus(),t!==void 0&&t(e[f])}};de("ArrowLeft",c=>{l(c,"prev")}),de("ArrowRight",c=>{l(c,"next")});let v=(c,p)=>{p.disabled||(m(c),t!==void 0&&t(p))};return s.jsxs(s.Fragment,{children:[s.jsx("div",{ref:n,role:"tablist","aria-label":r,className:Q("relative flex w-full",a&&"justify-between"),children:e.map((c,p)=>{let f=d===p;return s.jsxs("button",{type:"button",id:`tab-${c.id}`,"data-testid":`tab-${c.id}`,role:"tab","aria-selected":d===p,"aria-controls":`tabpanel-${c.id}`,"aria-disabled":c.disabled,onClick:()=>v(p,c),disabled:c.disabled,className:Q("text-md text-lapis-800 hover:bg-navy-100 focus-visible:outline-navy-600 relative border-b border-transparent px-3 py-2 font-semibold capitalize hover:rounded-xs focus-visible:z-10 focus-visible:rounded-xs focus-visible:ring-2 focus-visible:ring-neutral-50 focus-visible:outline-2 focus-visible:outline-offset-2",f&&"border-navy-600 text-navy-600 border-b",c.icon?.placement==="append"?"flex-row-reverse":"",c.disabled&&"cursor-not-allowed text-neutral-700 hover:rounded-none hover:bg-transparent focus-visible:ring-0 focus-visible:outline-hidden",a&&"flex-1"),children:[c.icon&&s.jsx(V,{className:Q("-mt-2px mr-2 mb-px -ml-1 inline-block",c.disabled&&"text-neutral-700"),name:c.icon?.name,size:12}),c.tabName]},c.id)})}),s.jsx("div",{children:s.jsx(o?tr:rr,{tabs:e,activeIndex:d})})]})},nr={xs:"h-10 w-10",sm:"h-12 w-12",md:"h-20 w-20",lg:"h-28 w-20"},X={general:"relative flex items-center justify-center overflow-hidden rounded-sm peer-focus:ring-2 peer-focus:ring-navy-600 peer-focus:ring-offset-2 hover:bg-neutral-300",selected:"bg-navy-100 outline-solid outline-2 outline-navy-600",default:"bg-neutral-200"},ae=({size:e="md",selected:r=!1,disabled:t=!1,className:a="",...o})=>s.jsxs("label",{htmlFor:o.id,className:`relative block ${t?"grayscale":"cursor-pointer"}`,children:[s.jsx("input",{type:"radio",id:o.id,"data-test":o.id,onChange:t?void 0:o.onChange,className:"peer sr-only","aria-label":o.ariaLabel,"aria-checked":r,checked:r,name:o.name,disabled:t}),s.jsx("div",{className:Q(X.general,r?X.selected:X.default,`${nr[e]} ${a}`),children:s.jsx("div",{className:t?"":"cursor-pointer",children:o.children})}),o.action]});function W(){return(W=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e}).apply(this,arguments)}function xe(e,r){if(e==null)return{};var t,a,o={},n=Object.keys(e);for(a=0;a<n.length;a++)r.indexOf(t=n[a])>=0||(o[t]=e[t]);return o}function z(e){var r=u.useRef(e),t=u.useRef(function(a){r.current&&r.current(a)});return r.current=e,t.current}var R=function(e,r,t){return r===void 0&&(r=0),t===void 0&&(t=1),e>t?t:e<r?r:e},T=function(e){return"touches"in e},Z=function(e){return e&&e.ownerDocument.defaultView||self},fe=function(e,r,t){var a=e.getBoundingClientRect(),o=T(r)?(function(n,d){for(var m=0;m<n.length;m++)if(n[m].identifier===d)return n[m];return n[0]})(r.touches,t):r;return{left:R((o.pageX-(a.left+Z(e).pageXOffset))/a.width),top:R((o.pageY-(a.top+Z(e).pageYOffset))/a.height)}},me=function(e){!T(e)&&e.preventDefault()},_e=w.memo(function(e){var r=e.onMove,t=e.onKey,a=e.onEnd,o=xe(e,["onMove","onKey","onEnd"]),n=u.useRef(null),d=z(r),m=z(t),l=z(a),v=u.useRef(null),c=u.useRef(!1),p=u.useMemo(function(){var S=function(h){me(h),(T(h)?h.touches.length>0:h.buttons>0)&&n.current?d(fe(n.current,h,v.current)):(k(!1),l())},F=function(){k(!1),l()};function k(h){var i=c.current,_=Z(n.current),E=h?_.addEventListener:_.removeEventListener;

1E(i?"touchmove":"mousemove",S),E(i?"touchend":"mouseup",F)}return[function(h){var i=h.nativeEvent,_=n.current;if(_&&(me(i),!(function(U,$){return $&&!T(U)})(i,c.current)&&_)){if(T(i)){c.current=!0;var E=i.changedTouches||[];E.length&&(v.current=E[0].identifier)}_.focus(),d(fe(_,i,v.current)),k(!0)}},function(h){var i=h.which||h.keyCode;i<37||i>40||(h.preventDefault(),m({left:i===39?.05:i===37?-.05:0,top:i===40?.05:i===38?-.05:0}))},function(h){var i=h.which||h.keyCode;i>=37&&i<=40&&l()},k]},[m,d,l]),f=p[0],g=p[1],N=p[2],C=p[3];return u.useEffect(function(){return C},[C]),w.createElement("div",W({},o,{onTouchStart:f,onMouseDown:f,className:"react-colorful__interactive",ref:n,onKeyDown:g,onKeyUp:N,tabIndex:0,role:"slider"}))}),ne=function(e){return e.filter(Boolean).join(" ")},we=function(e){var r=e.color,t=e.left,a=e.top,o=a===void 0?.5:a,n=ne(["react-colorful__pointer",e.className]);return w.createElement("div",{className:n,style:{top:100*o+"%",left:100*t+"%"}},w.createElement("div",{className:"react-colorful__pointer-fill",style:{backgroundColor:r}}))},x=function(e,r,t){return r===void 0&&(r=0),t===void 0&&(t=Math.pow(10,r)),Math.round(t*e)/t},or=function(e){return ur(ee(e))},ee=function(e){return e[0]==="#"&&(e=e.substring(1)),e.length<6?{r:parseInt(e[0]+e[0],16),g:parseInt(e[1]+e[1],16),b:parseInt(e[2]+e[2],16),a:e.length===4?x(parseInt(e[3]+e[3],16)/255,2):1}:{r:parseInt(e.substring(0,2),16),g:parseInt(e.substring(2,4),16),b:parseInt(e.substring(4,6),16),a:e.length===8?x(parseInt(e.substring(6,8),16)/255,2):1}},sr=function(e){return cr(lr(e))},ir=function(e){var r=e.s,t=e.v,a=e.a,o=(200-r)*t/100;return{h:x(e.h),s:x(o>0&&o<200?r*t/100/(o<=100?o:200-o)*100:0),l:x(o/2),a:x(a,2)}},re=function(e){var r=ir(e);return"hsl("+r.h+", "+r.s+"%, "+r.l+"%)"},lr=function(e){var r=e.h,t=e.s,a=e.v,o=e.a;r=r/360*6,t/=100,a/=100;var n=Math.floor(r),d=a*(1-t),m=a*(1-(r-n)*t),l=a*(1-(1-r+n)*t),v=n%6;return{r:x(255*[a,m,d,d,l,a][v]),g:x(255*[l,a,a,m,d,d][v]),b:x(255*[d,d,l,a,a,m][v]),a:x(o,2)}},D=function(e){var r=e.toString(16);return r.length<2?"0"+r:r},cr=function(e){var r=e.r,t=e.g,a=e.b,o=e.a,n=o<1?D(x(255*o)):"";return"#"+D(r)+D(t)+D(a)+n},ur=function(e){var r=e.r,t=e.g,a=e.b,o=e.a,n=Math.max(r,t,a),d=n-Math.min(r,t,a),m=d?n===r?(t-a)/d:n===t?2+(a-r)/d:4+(r-t)/d:0;return{h:x(60*(m<0?m+6:m)),s:x(n?d/n*100:0),v:x(n/255*100),a:o}},dr=w.memo(function(e){var r=e.hue,t=e.onChange,a=e.onChangeEnd,o=ne(["react-colorful__hue",e.className]);return w.createElement("div",{className:o},w.createElement(_e,{onMove:function(n){t({h:360*n.left})},onKey:function(n){t({h:R(r+360*n.left,0,360)})},onEnd:a,"aria-label":"Hue","aria-valuenow":x(r),"aria-valuemax":"360","aria-valuemin":"0"},w.createElement(we,{className:"react-colorful__hue-pointer",left:r/360,color:re({h:r,s:100,v:100,a:1})})))}),fr=w.memo(function(e){var r=e.hsva,t=e.onChange,a=e.onChangeEnd,o={backgroundColor:re({h:r.h,s:100,v:100,a:1})};return w.createElement("div",{className:"react-colorful__saturation",style:o},w.createElement(_e,{onMove:function(n){t({s:100*n.left,v:100-100*n.top})},onKey:function(n){t({s:R(r.s+100*n.left,0,100),v:R(r.v-100*n.top,0,100)})},onEnd:a,"aria-label":"Color","aria-valuetext":"Saturation "+x(r.s)+"%, Brightness "+x(r.v)+"%"},w.createElement(we,{className:"react-colorful__saturation-pointer",top:1-r.v/100,left:r.s/100,color:re(r)})))}),Ne=function(e,r){if(e===r)return!0;for(var t in e)if(e[t]!==r[t])return!1;return!0},mr=function(e,r){return e.toLowerCase()===r.toLowerCase()||Ne(ee(e),ee(r))};function gr(e,r,t,a){var o=z(t),n=z(a),d=u.useState(function(){return e.toHsva(r)}),m=d[0],l=d[1],v=u.useRef({color:r,hsva:m}),c=u.useRef(!1);u.useEffect(function(){if(!e.equal(r,v.current.color)){var g=e.toHsva(r);v.current={hsva:g,color:r},l(g),c.current=!1}},[r,e]),u.useEffect(function(){var g;Ne(m,v.current.hsva)||e.equal(g=e.fromHsva(m),v.current.color)||(v.current={hsva:m,color:g},o(g),c.current=!0)},[m,e,o]);var p=u.useCallback(function(g){l(function(N){return Object.assign({},N,g)})},[]),f=u.useCallback(function(){c.current&&(c.current=!1,n(v.current.color))},[n]);return[m,p,f]}var vr=typeof window<"u"?u.useLayoutEffect:u.useEffect,pr=function(){return typeof __webpack_nonce__<"u"?__webpack_nonce__:void 0},ge=new Map,hr=function(e){vr(function(){var r=e.current?e.current.ownerDocument:document;if(r!==void 0&&!ge.has(r)){var t=r.createElement("style");t.innerHTML=`.react-colorful{position:relative;display:flex;flex-direction:column;

1width:200px;height:200px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default}.react-colorful__saturation{position:relative;flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(0deg,#000,transparent),linear-gradient(90deg,#fff,hsla(0,0%,100%,0))}.react-colorful__alpha-gradient,.react-colorful__pointer-fill{content:"";position:absolute;left:0;top:0;right:0;bottom:0;pointer-events:none;border-radius:inherit}.react-colorful__alpha-gradient,.react-colorful__saturation{box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}.react-colorful__alpha,.react-colorful__hue{position:relative;height:24px}.react-colorful__hue{background:linear-gradient(90deg,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red)}.react-colorful__last-control{border-radius:0 0 8px 8px}.react-colorful__interactive{position:absolute;left:0;top:0;right:0;bottom:0;border-radius:inherit;outline:none;touch-action:none}.react-colorful__pointer{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}.react-colorful__interactive:focus .react-colorful__pointer{transform:translate(-50%,-50%) scale(1.1)}.react-colorful__alpha,.react-colorful__alpha-pointer{background-color:#fff;background-image:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>')}.react-colorful__saturation-pointer{z-index:3}.react-colorful__hue-pointer{z-index:2}`,ge.set(r,t);var a=pr();a&&t.setAttribute("nonce",a),r.head.appendChild(t)}},[])},br=function(e){var r=e.className,t=e.colorModel,a=e.color,o=a===void 0?t.defaultColor:a,n=e.onChange,d=e.onChangeEnd,m=xe(e,["className","colorModel","color","onChange","onChangeEnd"]),l=u.useRef(null);hr(l);var v=gr(t,o,n,d),c=v[0],p=v[1],f=v[2],g=ne(["react-colorful",r]);return w.createElement("div",W({},m,{ref:l,className:g}),w.createElement(fr,{hsva:c,onChange:p,onChangeEnd:f}),w.createElement(dr,{hue:c.h,onChange:p,onChangeEnd:f,className:"react-colorful__last-control"}))},xr={defaultColor:"000",toHsva:or,fromHsva:function(e){return sr({h:e.h,s:e.s,v:e.v,a:1})},equal:mr},_r=function(e){return w.createElement(br,W({},e,{colorModel:xr}))},wr=({...e})=>e.open?s.jsxs("div",{"data-testid":e.dataTest,className:"flex flex-col gap-4 roun

1ded-md border border-neutral-300 bg-neutral-100 p-2 shadow-md",children:[s.jsx(_r,{color:e.value,onChange:e.onChange,className:"custom-color-picker grow"}),e.colorPalette?.length?s.jsxs("div",{className:"flex flex-col items-start gap-2",children:[s.jsx("h4",{id:"color_palette_title",className:"shrink text-xs font-bold uppercase text-lapis-950",children:e.recentlySelectedLabel??"Recently Selected"}),s.jsx("ul",{className:"grid grid-cols-6 grid-rows-2 items-start gap-2","aria-labelledby":"color_palette_title",children:e.colorPalette?.map((r,t)=>s.jsx("li",{className:"size-6",children:s.jsx("button",{type:"button",className:"size-6 rounded-full border-[0.5px] border-neutral-500",style:{backgroundColor:r},onClick:a=>{a.stopPropagation(),e.onChange(r)},"aria-label":`Color: ${r}`})},`color-${t}-${r}`))})]}):null]}):null,Y=/^#[A-Fa-f0-9]{6}$/,ve=e=>{let{id:r,label:t,labelHidden:a=!1,applyActiveClass:o=!1,value:n,invalidColorErrorText:d,onChange:m,onBlur:l,onFocus:v,required:c=!1,requiredErrorText:p="This is required!",dataTest:f,placeholder:g=" ",palette:N,pickerDirection:C="bottom-start",pickerButtonAriaLabel:S="Open Color Picker Button",errorMessage:F,hasError:k,disabled:h=!1,hint:i,hintIcon:_,onValidationChange:E,wrapperRef:U=null}=e,$=u.useRef(null),oe=u.useRef(null),[ye,se]=u.useState(!1),[B,K]=Ve(!1),[L,G]=u.useState(n?.toString()??(c?"":"#000000")),M=u.useRef(E);u.useEffect(()=>{M.current=E},[E]);let I=y=>!y&&c?{isValid:!1,message:p}:y&&!Y.test(y.toString())?{isValid:!1,message:d}:{isValid:!0},O=I(L),H=!O.isValid,q=H||k,Ce=H?O?.message:F;u.useEffect(()=>{M.current&&M.current(!H,O?.message)},[H,O?.message]);let Ee=y=>{let j=y;j&&=(j=j.replace(/#/g,""),"#"+j),G(j),I(j).isValid&&m?.(j)},je=y=>{G(y),m?.(y)},Se=y=>{se(!0),v?.(y.target.value)},ke=y=>{let j=I(L);!j.isValid&&M.current&&M.current(!1,j.message),se(!1),l?.(y.target.value)},{refs:ie,floatingStyles:Pe,context:Le}=Be({open:B,onOpenChange:K,placement:C,whileElementsMounted:Oe,strategy:"fixed",middleware:[He(4)]}),{getReferenceProps:qe,getFloatingProps:Fe}=De([Ae(Le)]);return u.useEffect(()=>{n&&Y.test(n.toString())&&G(n.toString())},[n]),s.jsxs("div",{className:"relative w-full",ref:$,children:[s.jsxs("div",{className:"relative w-full",ref:ie.setReference,...qe(),children:[s.jsx("input",{type:"text",id:r,value:L,"aria-invalid":q,"aria-describedby":q?`${r}-error`:void 0,className:ze(q,h,B),placeholder:g,"aria-required":c,disabled:h,onChange:y=>Ee(y.target.value),onBlur:ke,onFocus:Se,maxLength:7}),s.jsx("button",{ref:oe,type:"button",className:"absolute bottom-0 right-2 top-0 my-auto size-6 rounded-[4px] border border-neutral-500",style:{backgroundColor:Y.test(L)?L:"transparent"},onClick:K,"aria-label":S,disabled:h}),s.jsx(Te,{htmlFor:r,label:t,hasError:q,labelHidden:a,active:o||ye||B,disabled:h}),s.jsx(Qe,{root:U||$,children:s.jsx("div",{ref:ie.setFloating,style:Pe,...Fe(),children:s.jsx(wr,{open:B,value:L,onChange:je,colorPalette:N?.slice(0,12)||[],onClose:()=>{K(!1)},dataTest:f,triggerRef:oe})})})]}),(i||q)&&s.jsxs("div",{className:"mt-2 flex min-h-5 flex-col gap-[2px]",children:[i&&s.jsx(Re,{hint:i,hintIcon:_}),q&&s.jsx($e,{id:r,message:Ce})]})]})};const Nr=({totalItems:e,premiumIsVisible:r})=>{const[t,a]=u.useState(e),{breakpoint:o}=be();return u.useEffect(()=>{if(r===!0){a(e);return}(o==="xs"||o==="sm")&&a(e),o==="md"&&a(3),(o==="lg"||o==="xl")&&a(6)},[o,r,e]),{itemsToShow:t,setItemsToShow:a}},J=12,yr=24,Cr=48,Er=(e,r)=>{const t=Cr,a=yr+J,o=Math.floor(r/(t+J)),n=Math.ceil(a/(t+J));return Math.ceil((e+n)/o)},A=[{id:"rounded-2",iconName:"shapeRounded2"},{id:"dots",iconName:"shapeDots"},{id:"square",iconName:"shapeSquare"},{id:"rounded-1",iconName:"shapeRounded1",isPro:!0},{id:"connect-horizontal",iconName:"shapeConnectHorizontal",isPro:!0},{id:"rounded-3",iconName:"shapeRounded3",isPro:!0}],pe=["#FF0A01","#FF9110","#FCFF03","#22FF38","#02E1E4","#0D19FF","#7E15FF","#000000","#ffffff"],jr=({refProps:e})=>{const{t:r}=te(),t=b(i=>i.foreground_color),a=b(i=>i.setForeground_color),o=b(i=>i.qr_code_pattern),n=b(i=>i.setQr_code_pattern),d=b(i=>i.background_color),m=b(i=>i.set_background_color),l=b(i=>i.generateQrCode),v=b(i=>i.setProFeaturesSelection),[c,p]=u.useState(!1),{breakpoint:f}=be(),[g,N]=u.useState(0),C=u.useRef(null),{itemsToShow:S}=Nr({totalItems:A.length,premiumIsVisible:c});u.useEffect(()=>{const i=()=>

1{if(C.current){const E=C.current.offsetWidth;N(E)}};i();const _=new ResizeObserver(i);return C.current&&_.observe(C.current),()=>{_.disconnect()}},[]);const F=u.useMemo(()=>g===0||f==="sm"||f==="xs"?1:Er(S,g),[g,S,f]),k=(i,_)=>{P("fg_design_customized"),n(i),l(400),v({isProShapeSelected:_})},h=i=>{P("fg_design_customized"),m(i),l(400),v({isProBackgroundColorSelected:i.toLowerCase()!=="#ffffff"})};return s.jsxs("div",{className:"flex flex-col gap-8",children:[s.jsxs("div",{ref:C,className:`flex md:flex-wrap items-center transition-all duration-300 ease-in-out pt-2 pl-1 pb-1 gap-3 overflow-x-auto overflow-y-visible scrollbar-hide ${S!==A.length?"pr-1":"pr-0"}`,style:{height:60*F},children:[A.map((i,_)=>s.jsx("div",{className:`${_>=S?"hidden":"inline"}`,children:s.jsx(ae,{id:`pattern-${i.id}`,name:"qr_code_pattern",ariaLabel:r("Select {{pattern}} pattern",{pattern:i.id}),size:"sm",className:i?.isPro?"border-brand-300 border":"",onChange:()=>k(i.id,i?.isPro),selected:o===i.id,children:s.jsx(V,{size:28,name:i.iconName})})},i.id)),S!==A.length&&s.jsx(he,{size:"sm",variant:"text",className:"hidden md:inline",onClick:()=>{P("fg_design_customized"),p(!0)},children:r("+ Show all")})]}),s.jsxs("div",{className:"flex flex-wrap gap-4",children:[s.jsx("div",{className:"w-44",children:e?.current&&s.jsx(ve,{id:"qrCodeLogo",label:r("QR Code Color"),value:t,palette:pe,wrapperRef:e,onChange:i=>{P("fg_design_customized"),l(400),a(i)}})}),s.jsx("div",{className:"flex items-center gap-1",children:s.jsx("div",{className:"w-44",children:e?.current&&s.jsx(ve,{id:"backgroundLogo",label:r("Background Color"),value:d,palette:pe,wrapperRef:e,onChange:i=>h(i)})})})]})]})},Sr=[{id:"no-frame",iconName:"forbidden",isPro:!1},{id:"qrcg-scan-me-bottom-frame",iconName:"frameBottom",isPro:!1},{id:"qrcg-scan-me-bubble-frame",iconName:"frameBubble",isPro:!1},{id:"qrcg-scan-me-bottom-tooltip-frame",iconName:"frameBottomHeaderTooltip",isPro:!1},{id:"solution-video-frame-01",iconName:"frameType",isPro:!0},{id:"qrcg-scan-me-letter-frame",iconName:"frameLetter",isPro:!0},{id:"qrcg-scan-me-script-frame",iconName:"frameScript",isPro:!0},{id:"qrcg-scan-me-arrow-frame",iconName:"frameArrow",isPro:!0},{id:"qrcg-scan-me-basic-frame",iconName:"frameBasic",isPro:!0},{id:"qrcg-scan-me-shopping-bag-frame",iconName:"frameBag",isPro:!0},{id:"qrcg-scan-me-scratch-frame",iconName:"frameScratch",isPro:!0},{id:"qrcg-scan-me-takeaway-frame-01",iconName:"frameTakeaway01",isPro:!0},{id:"qrcg-scan-me-gift-frame",iconName:"frameGift",isPro:!0},{id:"qrcg-scan-me-coffee-frame",iconName:"frameCoffee",isPro:!0},{id:"qrcg-scan-me-takeaway-frame-02",iconName:"frameTakeaway02",isPro:!0},{id:"qrcg-scan-me-chef-frame",iconName:"frameChef",isPro:!0},{id:"qrcg-scan-me-bottom-header-frame",iconName:"frameBottomHeader",isPro:!0}],kr=()=>{const e=b(n=>n.frame_name),r=b(n=>n.setFrame_name),t=b(n=>n.generateQrCode),a=b(n=>n.setProFeaturesSelection),o=(n,d)=>{P("fg_design_customized"),r(n),t(),a({isProFrameSelected:d})};return s.jsx("div",{className:"flex flex-wrap transition-all duration-300 ease-in-out overflow-x-auto scrollbar-hide items-start pt-2 pl-1 pb-1 pr-1 gap-3",children:Sr.map(n=>s.jsx("div",{className:"inline",children:s.jsx(ae,{id:`frame-${n.id}`,name:"qr_code_frame",ariaLabel:`Select ${n.id} frame`,size:"sm",className:n?.isPro?"border-brand-300 border":"",onChange:()=>o(n.id,n.isPro),selected:e===n.id,children:s.jsx(V,{size:28,name:n.iconName})})},n.id))})},Pr={"no-logo":"No logo","scan-me-square":"Scan Me Square logo","scan-me":"Scan Me logo"},Lr=[{id:"no-logo",iconName:"forbidden"},{id:"scan-me-square",iconName:"logoScanMeSquare"},{id:"scan-me",iconName:"logoScanMe"}],qr=()=>{const{t:e}=te(),r=b(l=>l.qr_code_logo),t=b(l=>l.setQr_code_logo),a=b(l=>l.generateQrCode),o=b(l=>l.setOpenOverlay),n=Me(),d=l=>{P("fg_design_customized"),t(l),a(400)},m=()=>{P("fg_design_customized"),n("upload_your_logo_link"),o("sign-up")};return s.jsxs("div",{className:"flex flex-col gap-4",children:[s.jsx("div",{className:"flex pt-2 pr-0 pb-1 pl-1 gap-3 overflow-x-auto overflow-y-visible",children:Lr.map(l=>s.jsx("div",{children:s.jsx(ae,{id:`logo-${l.id}`,name:"qr_code_logo",ariaLabel:e(Pr[l.id]||l.id),size:"sm",onChange:()=>d(l.id),selected:r===l.id,children:s.jsx(V,{size:28,name:l.iconName})})},l.id))}),s.jsxs("div",{className:"flex flex-col gap-1",children:[s.jsx("div",{className:"flex flex-row items-center",children:s.jsx(he,{className:"text-navy-600 mx-px",variant:"text",onClick:m,prependIcon:{name:"Upload"},children:e("Upload your logo")})}),s.jsx("div",{className:"text-sm text-[#53678C] pl-2",children:e("File types: png, .jpg, .gif or .svg —  max size of 2 MB")}

1)]})]})},Hr=()=>{const{t:e}=te(),r=u.useRef(null),t=b(o=>o.setLoadedSections);u.useEffect(()=>{t("design")},[]);const a=[{id:"frame",tabName:e("Frame"),content:s.jsx(kr,{})},{id:"logo",tabName:e("Logo"),content:s.jsx(qr,{})},{id:"shape",tabName:e("Color & Shape"),content:s.jsx(jr,{refProps:r})}];return s.jsx("div",{ref:r,children:s.jsx("div",{className:"flex flex-col gap-8 [&>div>button:not([aria-selected=true])]:border-neutral-300",children:s.jsx(ar,{animated:!0,tabs:a,equalWidth:!0})})})};export{Hr as default};