@frigade/react 2.0.0-alpha.4 → 2.0.0-alpha.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +601 -4
- package/dist/index.cjs +65 -2
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +1201 -44
- package/dist/index.js +21 -2
- package/dist/index.js.map +1 -1
- package/package.json +17 -3
package/dist/index.js
CHANGED
|
@@ -1,3 +1,22 @@
|
|
|
1
|
-
|
|
2
|
-
var ee=Object.defineProperty,Fe=Object.defineProperties;var Ee=Object.getOwnPropertyDescriptors;var $=Object.getOwnPropertySymbols;var te=Object.prototype.hasOwnProperty,oe=Object.prototype.propertyIsEnumerable;var Z=(e,t,o)=>t in e?ee(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,a=(e,t)=>{for(var o in t||(t={}))te.call(t,o)&&Z(e,o,t[o]);if($)for(var o of $(t))oe.call(t,o)&&Z(e,o,t[o]);return e},u=(e,t)=>Fe(e,Ee(t));var p=(e,t)=>{var o={};for(var r in e)te.call(e,r)&&t.indexOf(r)<0&&(o[r]=e[r]);if(e!=null&&$)for(var r of $(e))t.indexOf(r)<0&&oe.call(e,r)&&(o[r]=e[r]);return o};var re=(e,t)=>{for(var o in t)ee(e,o,{get:t[o],enumerable:!0})};var k=(e,t,o)=>new Promise((r,n)=>{var l=c=>{try{d(o.next(c))}catch(f){n(f)}},s=c=>{try{d(o.throw(c))}catch(f){n(f)}},d=c=>c.done?r(c.value):Promise.resolve(c.value).then(l,s);d((o=o.apply(e,t)).next())});import*as de from"react";import{clsx as je}from"clsx";var Ae="px",De=e=>typeof e=="number"?`${4*e}${Ae}`:e,He=[-20,-19,-18,-17,-16,-15,-14,-13,-12,-11,-10,-9,-8,-7,-6,-5,-4,-3,-2,-1,-.5,0,.5,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,"auto"],Ve=Object.fromEntries(He.map(e=>[e,De(e)])),We={black:"#000000",gray100:"#14161A",gray200:"#181B20",gray300:"#1F2329",gray400:"#2E343D",gray500:"#4C5766",gray600:"#5A6472",gray700:"#C5CBD3",gray800:"#E2E5E9",gray900:"#F1F2F4",white:"#ffffff",blue400:"#015AC6",blue500:"#0171F8",blue800:"#DBECFF",blue900:"#F5F9FF",green400:"#009E37",green500:"#00D149",green800:"#DBFFE8",transparent:"#FFFFFF00",red500:"#c00000"},I={borders:{md:"1px solid"},borderWidths:{0:"0",md:"1px"},colors:a({},We),fontFamilies:{default:"TT Interphases Pro, sans-serif"},fontSizes:{xs:"12px",sm:"14px",md:"16px",lg:"18px",xl:"20px","2xl":"24px","3xl":"30px","4xl":"36px","5xl":"48px"},fontWeights:{regular:"400",demibold:"600",bold:"700"},letterSpacings:{md:"0.02em"},lineHeights:{xs:"18px",sm:"22px",md:"24px",lg:"26px",xl:"30px","2xl":"38px","3xl":"46px","4xl":"60px"},radii:{md:"8px",lg:"20px",round:"50%"},shadows:{md:"0px 4px 20px rgba(0, 0, 0, 0.1)"},space:Ve};var i=e=>`var(--fr-colors-${e})`,ne={neutral:{background:i("white"),border:i("gray900"),foreground:i("black"),surface:i("gray700"),active:{background:i("white"),border:i("gray900"),foreground:i("black"),surface:i("gray700")},focus:{background:i("white"),border:i("gray900"),foreground:i("black"),surface:i("gray700")},hover:{background:i("white"),border:i("gray900"),foreground:i("black"),surface:i("gray700")}},primary:{background:i("blue500"),border:i("blue500"),foreground:i("white"),surface:i("blue500"),active:{background:i("blue400"),border:i("blue400"),foreground:i("white"),surface:i("blue400")},focus:{background:i("blue500"),border:i("blue500"),foreground:i("white"),surface:i("blue500")},hover:{background:i("blue400"),border:i("blue400"),foreground:i("white"),surface:i("blue400")}},secondary:{background:i("gray900"),border:i("gray900"),foreground:i("black"),surface:i("gray900"),active:{background:i("gray800"),border:i("gray800"),foreground:i("black"),surface:i("gray800")},focus:{background:i("gray900"),border:i("gray900"),foreground:i("black"),surface:i("gray900")},hover:{background:i("gray800"),border:i("gray800"),foreground:i("black"),surface:i("gray800")}}};var j=u(a({},I),{colors:a(a({},I.colors),ne)});function O(e,t="",o="."){return Object.keys(e).reduce((r,n)=>{let s=`${t.length?`${t}${o}`:""}${n}`,d=e[n];return typeof d=="object"&&d!==null&&!Array.isArray(d)?Object.assign(r,O(d,s,o)):r[s]=d,r},{})}function L(e){return O(e,"--fr","-")}function ie(e,t="--fr"){let o={};return Object.keys(e).forEach(r=>{let n=e[r];typeof n=="object"&&n!==null&&!Array.isArray(n)?o[r]=ie(n,`${t}-${r}`):o[r]=`var(${t}-${r})`}),o}var se=L(j),g=ie(j);var z=O(g.colors),ae={color:z,backgroundColor:z,borderColor:z,border:g.borders,borderRadius:g.radii,borderWidth:g.borderWidths,fontFamily:g.fontFamilies,fontSize:g.fontSizes,fontWeight:g.fontWeights,gap:g.space,lineHeight:g.lineHeights,margin:g.space,marginTop:g.space,marginRight:g.space,marginBottom:g.space,marginLeft:g.space,padding:g.space,paddingTop:g.space,paddingRight:g.space,paddingBottom:g.space,paddingLeft:g.space,alignContent:["center","start","end","flex-start","flex-end","normal","baseline","first baseline","last baseline","space-between","space-around","space-evenly","stretch","safe center","unsafe center","inherit","initial","revert","revert-layer","unset"],alignItems:["normal","stretch","center","start","end","flex-start","flex-end","self-start","self-end","baseline","first baseline","last baseline","safe center","unsafe center","inherit","initial","revert","revert-layer","unset"],alignSelf:["auto","normal","center","start","end","self-start","self-end","flex-start","flex-end","baseline","first baseline","last baseline","stretch","safe center","unsafe center","inherit","initial","revert","revert-layer","unset"],flexDirection:["row","row-reverse","column","column-reverse","inherit","initial","revert","revert-layer","unset"],flexWrap:["nowrap","wrap","wrap-reverse","inherit","initial","revert","revert-layer","unset"],justifyContent:["center","start","end","flex-start","flex-end","left","right","normal","space-between","space-around","space-evenly","stretch","safe center","unsafe center","inherit","initial","revert","revert-layer","unset"],justifyItems:["normal","stretch","center","start","end","flex-start","flex-end","self-start","self-end","left","right","baseline","first baseline","last baseline","safe center","unsafe center","legacy right","legacy left","legacy center","inherit","initial","revert","revert-layer","unset"],boxSizing:["border-box","content-box","inherit","initial","revert","revert-layer","unset"],position:["static","relative","absolute","fixed","sticky","inherit","initial","revert","revert-layer","unset"],display:["block","block flex","block flow","block flow-root","block grid","contents","flex","flow-root","grid","inherit","initial","inline","inline flex","inline flow","inline flow-root","inline grid","inline-block","inline-flex","inline-grid","list-item","none","revert","revert-layer","table","table-row-group","table-header-group","table-footer-group","table-row","table-cell","table-column-group","table-column","table-caption","unset"]},le={m:["margin"],mt:["marginTop"],mr:["marginRight"],mb:["marginBottom"],ml:["marginLeft"],mx:["marginLeft","marginRight"],my:["marginTop","marginBottom"],p:["padding"],pt:["paddingTop"],pr:["paddingRight"],pb:["paddingBottom"],pl:["paddingLeft"],px:["paddingLeft","paddingRight"],py:["paddingTop","paddingBottom"]};function Me(e){if(Array.isArray(e))return new Map(e.map(t=>[t,t]));if(typeof e=="object"&&e!==null)return new Map(Object.entries(e));if(["string","number"].includes(typeof e))return new Map([e,e]);throw new Error("Invalid entry in styleProps")}var $e=new Map(Object.entries(ae).map(([e,t])=>[e,Me(t)])),Ie=new Map(Object.entries(le).map(([e,t])=>[e,new Set(t)]));function pe(e){let t=Object.assign({},e),o={};return Object.entries(t).forEach(([r,n])=>{let l=Ie.get(r);l!=null&&(l.forEach(s=>{t[s]=n}),delete t[r])}),Object.entries(t).forEach(([r,n])=>{let l=$e.get(r);if(l!=null)if(typeof n=="string"&&n.indexOf(" ")>-1){let s=n.split(" ");o[r]=s.map(d=>{var c;return(c=l.get(d.toString()))!=null?c:d}).join(" "),delete t[r]}else l.has(n.toString())&&(o[r]=l.get(n.toString()),delete t[r])}),{cssFromProps:o,unmatchedProps:t}}import{jsx as Ke}from"@emotion/react/jsx-runtime";function ce(e){return e&&`fr-${e}`}function Le(e){return e&&(Array.isArray(e)?e.map(t=>ce(t)).join(" "):ce(e))}function ze(d,s){var c=d,{as:e,children:t,className:o,css:r,part:n}=c,l=p(c,["as","children","className","css","part"]);let f=e!=null?e:"div",{cssFromProps:h,unmatchedProps:y}=pe(l),v=Le(n),B=o||v?je(o,v):void 0;return Ke(f,u(a({className:B,css:[a(a({boxSizing:"border-box"},h),r)]},y),{ref:s,children:t}))}var m=de.forwardRef(ze);var K={};re(K,{Body1:()=>Je,Body2:()=>Qe,Caption:()=>Ye,Display1:()=>Ne,Display2:()=>Ue,H1:()=>_e,H2:()=>Xe,H3:()=>qe,H4:()=>Ge,base:()=>P});var P=({fontFamilies:e})=>({fontFamily:e.default,margin:0}),Ne=({fontSizes:e,fontWeights:t,lineHeights:o})=>[P,{fontSize:e["5xl"],fontWeight:t.bold,lineHeight:o["4xl"]}],Ue=({fontSizes:e,fontWeights:t,lineHeights:o})=>[P,{fontSize:e["4xl"],fontWeight:t.bold,lineHeight:o["3xl"]}],_e=({fontSizes:e,fontWeights:t,lineHeights:o})=>[P,{fontSize:e["3xl"],fontWeight:t.bold,lineHeight:o["2xl"]}],Xe=({fontSizes:e,fontWeights:t,lineHeights:o})=>[P,{fontSize:e["2xl"],fontWeight:t.bold,lineHeight:o.xl}],qe=({fontSizes:e,fontWeights:t,lineHeights:o})=>[P,{fontSize:e.xl,fontWeight:t.bold,lineHeight:o.lg}],Ge=({fontSizes:e,fontWeights:t,lineHeights:o})=>[P,{fontSize:e.lg,fontWeight:t.bold,lineHeight:o.md}],Je=({fontSizes:e,fontWeights:t,lineHeights:o})=>[P,{fontSize:e.md,fontWeight:t.regular,lineHeight:o.md}],Qe=({fontSizes:e,fontWeights:t,lineHeights:o})=>[P,{fontSize:e.sm,fontWeight:t.regular,lineHeight:o.md}],Ye=({fontSizes:e,fontWeights:t,lineHeights:o})=>[P,{fontSize:e.xs,fontWeight:t.regular,lineHeight:o.sm}];import{jsx as ue}from"@emotion/react/jsx-runtime";function fe(l){var s=l,{as:e="span",children:t,css:o,variant:r="Body1"}=s,n=p(s,["as","children","css","variant"]);return ue(m,u(a({as:e,css:[K[r],o]},n),{children:t}))}var Ze=["Display1","Display2","H1","H2","H3","H4","Body1","Body2","Caption"],et=Object.fromEntries(Ze.map(e=>{let t=["H1","H2","H3","H4"].includes(e)?e.toLowerCase():void 0,o=r=>ue(fe,u(a({as:t},r),{variant:e,children:r.children}));return o.displayName=`Text.${e}`,[e,o]})),T=Object.assign(fe,et);var N={};re(N,{Link:()=>rt,Plain:()=>nt,Primary:()=>tt,Secondary:()=>ot,base:()=>F});var F=({radii:e,space:t})=>({borderWidth:0,borderRadius:e.md,padding:`${t[2]} ${t[4]}`}),tt=({colors:e})=>[F,{backgroundColor:e.primary.surface,color:e.primary.foreground,"&:hover":{backgroundColor:e.primary.hover.surface}}],ot=({colors:e})=>[F,{backgroundColor:e.secondary.surface,color:e.secondary.foreground,"&:hover":{backgroundColor:e.secondary.hover.surface}}],rt=({colors:e})=>[F,{backgroundColor:e.transparent,color:e.primary.surface,"&:hover":{color:e.primary.hover.surface}}],nt=({colors:e})=>[F,{backgroundColor:e.transparent,color:e.neutral.foreground}];import{jsx as me,jsxs as at}from"@emotion/react/jsx-runtime";function ge(s){var d=s,{as:e,children:t,css:o={},title:r,variant:n="Primary"}=d,l=p(d,["as","children","css","title","variant"]);return at(m,u(a({as:e!=null?e:"button",css:[N[n],o]},l),{children:[t,r&&me(T.Body2,{fontWeight:"demibold",children:r})]}))}var it=["Primary","Secondary","Link","Plain"],st=Object.fromEntries(it.map(e=>{let t=e.toLocaleLowerCase(),o=l=>{var s=l,{part:r}=s,n=p(s,["part"]);return me(ge,u(a({part:[`button-${t}`,r]},n),{variant:e,children:n.children}))};return o.displayName=`Text.${e}`,[e,o]})),E=Object.assign(ge,st);import*as U from"react";import{jsx as xe}from"@emotion/react/jsx-runtime";var lt=U.forwardRef((n,r)=>{var l=n,{children:e,css:t}=l,o=p(l,["children","css"]);return xe(m,u(a({css:[{display:"flex",flexDirection:"row"},t]},o),{ref:r,children:e}))}),pt=U.forwardRef((n,r)=>{var l=n,{children:e,css:t}=l,o=p(l,["children","css"]);return xe(m,u(a({css:[{display:"flex",flexDirection:"column"},t]},o),{ref:r,children:e}))}),R={Column:pt,Row:lt};import{createContext as ct}from"react";import{Global as dt,ThemeProvider as ft}from"@emotion/react";import{jsx as be,jsxs as gt}from"@emotion/react/jsx-runtime";var _=ct({apiKey:"",config:{}});function ut({apiKey:e,children:t,config:o={},theme:r}){let n=r?L(r):{};return gt(_.Provider,{value:{apiKey:e,config:o},children:[be(dt,{styles:{":root":a(a({},se),n)}}),be(ft,{theme:g,children:t})]})}import{useEffect as Ct,useRef as vt,useState as q}from"react";import{XMarkIcon as Rt}from"@heroicons/react/24/solid";import*as w from"@radix-ui/react-popover";import{useCallback as mt,useLayoutEffect as xt,useState as ye}from"react";function he(){let e="DOMRect"in globalThis?new DOMRect:{height:0,width:0,x:0,y:0,bottom:0,top:0,right:0,left:0,toJSON:()=>{}},[t,o]=ye(e),[r,n]=ye(null),l=mt(s=>{n(s)},[]);return xt(()=>{r&&o(r.getBoundingClientRect())},[r]),{node:r,rect:t,ref:l}}import{keyframes as bt}from"@emotion/react";import{jsx as Pe,jsxs as ht}from"@emotion/react/jsx-runtime";var yt=bt({"0%":{opacity:.5,transform:"scale(0.5)"},"50%":{opacity:0,transform:"scale(1)"},"100%":{opacity:0,transform:"scale(1)"}});function we(r){var n=r,{style:e={},part:t=""}=n,o=p(n,["style","part"]);return ht(m,u(a({part:`dot-wrapper ${t}`,style:a({height:"48px",position:"absolute",width:"48px"},e)},o),{children:[Pe(m,{backgroundColor:"primary.surface",part:"dot-pulse",css:{animation:`2s ease-out infinite ${yt}`,borderRadius:"24px",height:"48px",left:0,position:"absolute",top:0,transformOrigin:"center center",width:"48px"}}),Pe(m,{backgroundColor:"primary.surface",part:"dot",style:{borderRadius:"12px",height:"24px",left:"12px",position:"absolute",top:"12px",width:"24px"}})]}))}import{jsx as Pt}from"@emotion/react/jsx-runtime";function Be(r){var n=r,{part:e,src:t}=n,o=p(n,["part","src"]);return Pt(m,a({as:"img",part:["image",e],src:t},o))}import{jsx as Bt}from"@emotion/react/jsx-runtime";function wt(e){var t,o,r;if(e.includes("youtube"))return`https://www.youtube.com/embed/${(t=e.split("v=")[1])==null?void 0:t.split("&")[0]}`;if(e.includes("vimeo"))return`https://player.vimeo.com/video/${(o=e.split("vimeo.com/")[1])==null?void 0:o.split("&")[0]}`;if(e.includes("wistia"))return`https://fast.wistia.net/embed/iframe/${(r=e.split("wistia.com/medias/")[1])==null?void 0:r.split("&")[0]}`;throw new Error("Could not map videoUri to a known provider (Youtube, Vimeo, Wistia).")}function Te(r){var n=r,{part:e,src:t}=n,o=p(n,["part","src"]);let l=wt(t);return Bt(m,a({allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0,as:"iframe",backgroundColor:"gray100",borderWidth:0,part:["video",e],src:l},o))}import{jsx as Tt}from"@emotion/react/jsx-runtime";function X(r){var n=r,{src:e,type:t}=n,o=p(n,["src","type"]);return Tt(t==="video"?Te:Be,a({src:e},o))}function Ce({props:e,alignAttr:t,sideAttr:o}){let r=o!=null?o:"bottom",n={},l=()=>{var f;if(["after","before"].includes(e.align)){if(t=="start")return"before";if(t=="end")return"after"}return(f=e.align)!=null?f:"after"},s="-24px",d={top:"bottom",right:"left",bottom:"top",left:"right"};n[d[r]]=s;let c=l();return["before","end"].includes(c)?["top","bottom"].includes(r)?n.right=s:n.bottom=s:["after","start"].includes(c)?["top","bottom"].includes(r)?n.left=s:n.top=s:["top","bottom"].includes(r)?n.left=`calc(50% + ${s})`:n.top=`calc(50% + ${s})`,n}var ve={content:["align","alignOffset","arrowPadding","avoidCollisions","collisionBoundary","collisionPadding","forceMount","hideWhenDetached","onCloseAutoFocus","onEscapeKeyDown","onFocusOutside","onInteractOutside","onOpenAutoFocus","onPointerDownOutside","side","sideOffset","sticky"],root:["defaultOpen","modal","onOpenChange","open"]};function Re(e,t){var n,l,s,d,c;let o=Object.fromEntries(ve.content.map(f=>[f,e[f]]).filter(f=>f[1]!==void 0)),r=Object.fromEntries(ve.root.map(f=>[f,e[f]]).filter(f=>f[1]!==void 0));if(o.align=(n=o.align)!=null?n:"after",o.side=(l=o.side)!=null?l:"bottom",["before","after"].includes(o.align)){let f={after:"end",before:"start"},h=(H,V)=>["top","bottom"].includes(V)?H=="after"?"marginLeft":"marginRight":H=="after"?"marginTop":"marginBottom",y=(s=o.alignOffset)!=null?s:0,v=(d=o.style)!=null?d:{},B=(c=o.side)!=null?c:"bottom",A=o.align;o.style=u(a({},v),{[h(A,B)]:y});let D=["top","bottom"].includes(B)?t.width:t.height;o.alignOffset=(D+y)*-1,o.align=f[A]}return{contentProps:o,rootProps:r}}import{jsx as b,jsxs as G}from"@emotion/react/jsx-runtime";function x(s){var d=s,{anchor:e,children:t,css:o,spotlight:r=!1,style:n}=d,l=p(d,["anchor","children","css","spotlight","style"]);let{node:c,rect:f,ref:h}=he(),{contentProps:y,rootProps:v}=Re(l,f),[B,A]=q(y.align),[D,H]=q(y.side);if(c!==null){let S=c.getAttribute("data-align"),Y=c.getAttribute("data-side");B!==S&&A(S),D!==Y&&H(Y)}let V=vt(null),[W,ke]=q(null);if(Ct(()=>{let S=document.querySelector(e);S!=null&&(V.current=S,ke(V))},[e]),W==null)return null;let M=W.current.getBoundingClientRect(),Q="0";typeof window!="undefined"&&(Q=window.getComputedStyle(W.current).borderRadius);let Oe=Ce({props:l,alignAttr:B,sideAttr:D});return G(w.Root,u(a({defaultOpen:!0},v),{children:[b(w.Anchor,{virtualRef:W}),b(w.Portal,{children:G("div",{css:o,children:[r&&b(m,{borderRadius:Q,part:"tooltip-spotlight",position:"absolute",css:{boxShadow:"0 0 0 2000px rgb(0 0 0 / 0.5)",height:M.height,left:M.left,top:M.top,width:M.width}}),b(w.Content,u(a({asChild:!0},y),{ref:h,children:G(R.Column,{backgroundColor:"white",borderRadius:"md",p:5,part:"tooltip-content",position:"relative",css:a({boxShadow:"0px 4px 20px rgba(0, 0, 0, 0.1)",width:"300px"},n),children:[b(we,{style:Oe}),t]})}))]})})]}))}x.Close=o=>{var r=o,{css:e}=r,t=p(r,["css"]);return b(w.Close,{"aria-label":"Close",asChild:!0,children:b(E.Plain,u(a({css:[{top:0,right:0},e],part:"tooltip-close",position:"absolute"},t),{children:b(Rt,{height:"20",fill:"currentColor"})}))})};x.Media=o=>{var r=o,{src:e}=r,t=p(r,["src"]);return e==null?null:b(X,a({borderRadius:"md md 0 0",borderWidth:"0",css:{aspectRatio:"2"},margin:"-5 -5 5",src:e},t))};x.Primary=r=>{var n=r,{onClick:e,title:t}=n,o=p(n,["onClick","title"]);return t==null?null:b(E.Primary,a({title:t,onClick:e},o))};x.Progress=o=>{var r=o,{children:e}=r,t=p(r,["children"]);return e==null?null:b(T.Body2,u(a({fontWeight:"demibold",part:"progress"},t),{children:e}))};x.Secondary=r=>{var n=r,{onClick:e,title:t}=n,o=p(n,["onClick","title"]);return t==null?null:b(E.Secondary,a({title:t,onClick:e},o))};x.Subtitle=o=>{var r=o,{children:e}=r,t=p(r,["children"]);return e==null?null:b(T.Body2,u(a({part:"subtitle"},t),{children:e}))};x.Title=o=>{var r=o,{children:e}=r,t=p(r,["children"]);return e==null?null:b(T.Body1,u(a({fontWeight:"bold",mb:1,part:"title"},t),{children:e}))};import{Frigade as St}from"@frigade/js";import{useContext as kt,useState as Ot}from"react";function Se(e){let[t,o]=Ot(null),{apiKey:r,config:n}=kt(_);function l(){return k(this,null,function*(){let s=Object.fromEntries(Object.entries(n).filter(([f,h])=>["apiUrl","userId"].includes(f)&&h!=null)),c=yield(yield new St(r,s)).getFlow(e);o(c)})}return t===null&&l(),{flow:t,fetchFlow:l}}import{jsx as C,jsxs as J}from"@emotion/react/jsx-runtime";function Ft(o){var r=o,{flowId:e}=r,t=p(r,["flowId"]);var h;let{flow:n,fetchFlow:l}=Se(e);if(n==null||n!=null&&n.isCompleted||n!=null&&n.isSkipped)return null;n.start();let s=n.getCurrentStep();s==null||s.start();function d(){return k(this,null,function*(){yield n.skip(),l()})}function c(){return k(this,null,function*(){yield s.complete(),l()})}let f=c;return J(x,u(a({anchor:s.selector,onOpenAutoFocus:y=>y.preventDefault(),onPointerDownOutside:y=>y.preventDefault()},t),{children:[C(x.Close,{onClick:d}),C(x.Media,{src:(h=s.videoUri)!=null?h:s.imageUri,type:s.videoUri?"video":"image"}),C(x.Title,{children:s.title}),C(x.Subtitle,{children:s.subtitle}),J(R.Row,{pt:4,alignItems:"center",justifyContent:"space-between",children:[C(x.Progress,{children:`${n.getNumberOfCompletedSteps()}/${n.steps.size}`}),J(R.Row,{gap:3,children:[C(x.Secondary,{title:s.secondaryButtonTitle,onClick:f}),C(x.Primary,{title:s.primaryButtonTitle,onClick:c})]})]})]}))}export{m as Box,E as Button,R as Flex,ut as Provider,T as Text,x as Tooltip,Ft as Tour};
|
|
1
|
+
'use client';
|
|
2
|
+
import * as F from '@radix-ui/react-dialog';
|
|
3
|
+
import { XMarkIcon } from '@heroicons/react/24/solid';
|
|
4
|
+
import * as ue from 'react';
|
|
5
|
+
import { createContext, useState, useRef, useEffect, useContext, useCallback, useLayoutEffect } from 'react';
|
|
6
|
+
import { clsx } from 'clsx';
|
|
7
|
+
import Ro from 'known-css-properties';
|
|
8
|
+
import Ao from 'dompurify';
|
|
9
|
+
import { jsx, jsxs, Fragment } from '@emotion/react/jsx-runtime';
|
|
10
|
+
import { keyframes, Global, ThemeProvider } from '@emotion/react';
|
|
11
|
+
import { Frigade } from '@frigade/js';
|
|
12
|
+
import { useForm, useController } from 'react-hook-form';
|
|
13
|
+
import * as $ from '@radix-ui/react-radio-group';
|
|
14
|
+
import * as y from '@radix-ui/react-select';
|
|
15
|
+
import { ChevronDownIcon } from '@heroicons/react/24/outline';
|
|
16
|
+
import * as v from '@radix-ui/react-popover';
|
|
17
|
+
|
|
18
|
+
var So=Object.defineProperty;var Co=(e=>typeof require<"u"?require:typeof Proxy<"u"?new Proxy(e,{get:(o,t)=>(typeof require<"u"?require:o)[t]}):e)(function(e){if(typeof require<"u")return require.apply(this,arguments);throw new Error('Dynamic require of "'+e+'" is not supported')});var Y=(e,o)=>{for(var t in o)So(e,t,{get:o[t],enumerable:!0});};var ye={borders:{md:"1px solid"},borderWidths:{0:"0",md:"1px"}};var he={black:"#000000",gray100:"#14161A",gray200:"#181B20",gray300:"#1F2329",gray400:"#2E343D",gray500:"#4C5766",gray600:"#5A6472",gray700:"#C5CBD3",gray800:"#E2E5E9",gray900:"#F1F2F4",white:"#ffffff",blue400:"#015AC6",blue500:"#0171F8",blue800:"#DBECFF",blue900:"#F5F9FF",green400:"#009E37",green500:"#00D149",green800:"#DBFFE8",transparent:"#FFFFFF00",inherit:"inherit",red500:"#c00000"};var be={md:"10px",lg:"20px",round:"50%"};var l=e=>`var(--fr-colors-${e})`,Pe={neutral:{background:l("white"),border:l("gray800"),foreground:l("black"),surface:l("gray700"),active:{background:l("white"),border:l("gray900"),foreground:l("black"),surface:l("gray700")},focus:{background:l("white"),border:l("gray900"),foreground:l("black"),surface:l("gray700")},hover:{background:l("white"),border:l("gray900"),foreground:l("black"),surface:l("gray700")}},primary:{background:l("blue500"),border:l("blue500"),foreground:l("white"),surface:l("blue500"),active:{background:l("blue400"),border:l("blue400"),foreground:l("white"),surface:l("blue400")},focus:{background:l("blue500"),border:l("blue500"),foreground:l("white"),surface:l("blue500")},hover:{background:l("blue400"),border:l("blue400"),foreground:l("white"),surface:l("blue400")}},secondary:{background:l("white"),border:l("gray800"),foreground:l("black"),surface:l("gray900"),active:{background:l("gray900"),border:l("gray800"),foreground:l("black"),surface:l("gray800")},focus:{background:l("gray900"),border:l("gray800"),foreground:l("black"),surface:l("gray900")},hover:{background:l("gray900"),border:l("gray800"),foreground:l("black"),surface:l("gray800")}}};var Se={md:"0px 4px 20px rgba(0, 0, 0, 0.1)"};var Fo="px",To=e=>typeof e=="number"?`${4*e}${Fo}`:e,wo=[-20,-19,-18,-17,-16,-15,-14,-13,-12,-11,-10,-9,-8,-7,-6,-5,-4,-3,-2,-1,-.5,0,.5,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,"auto"],Ce=Object.fromEntries(wo.map(e=>[e,To(e)]));var Fe={fontFamilies:{default:"TT Interphases Pro, sans-serif"},fontSizes:{xs:"12px",sm:"14px",md:"16px",lg:"18px",xl:"20px","2xl":"24px","3xl":"30px","4xl":"36px","5xl":"48px"},fontWeights:{thin:"100",extralight:"200",light:"300",regular:"400",medium:"500",demibold:"600",bold:"700",extrabold:"800",black:"900"},letterSpacings:{md:"0.02em"},lineHeights:{xs:"18px",sm:"22px",md:"24px",lg:"26px",xl:"30px","2xl":"38px","3xl":"46px","4xl":"60px"}};var le={...ye,colors:{...he,...Pe},...Fe,radii:be,shadows:Se,space:Ce};function N(e,o="",t="."){return Object.keys(e).reduce((n,r)=>{let a=`${o.length?`${o}${t}`:""}${r}`,s=e[r];return typeof s=="object"&&s!==null&&!Array.isArray(s)?Object.assign(n,N(s,a,t)):n[a]=s,n},{})}function pe(e){return N(e,"--fr","-")}function Te(e,o="--fr"){let t={};return Object.keys(e).forEach(n=>{let r=e[n];typeof r=="object"&&r!==null&&!Array.isArray(r)?t[n]=Te(r,`${o}-${n}`):t[n]=`var(${o}-${n})`;}),t}var we=pe(le),m=Te(le);var Bo=new Set(["alt","size","src"]),vo=Ro.all.filter(e=>e.indexOf("-")!=0&&!Bo.has(e)).map(e=>[e.replace(/-([a-z])/g,(o,t)=>t.toUpperCase()),null]),ko=Object.fromEntries(vo),de=N(m.colors),Do={color:de,backgroundColor:de,borderColor:de,border:m.borders,borderRadius:m.radii,borderWidth:m.borderWidths,boxShadow:m.shadows,fontFamily:m.fontFamilies,fontSize:m.fontSizes,fontWeight:m.fontWeights,gap:m.space,lineHeight:m.lineHeights,margin:m.space,marginBottom:m.space,marginLeft:m.space,marginRight:m.space,marginTop:m.space,padding:m.space,paddingBottom:m.space,paddingLeft:m.space,paddingRight:m.space,paddingTop:m.space},Re={...ko,...Do},Be={bg:["backgroundColor"],m:["margin"],mt:["marginTop"],mr:["marginRight"],mb:["marginBottom"],ml:["marginLeft"],mx:["marginLeft","marginRight"],my:["marginTop","marginBottom"],p:["padding"],pt:["paddingTop"],pr:["paddingRight"],pb:["paddingBottom"],pl:["paddingLeft"],px:["paddingLeft","paddingRight"],py:["paddingTop","paddingBottom"]},ve=new Set(["active","focus","focusVisible","focusWithin","hover"]);function Oo(e){return Array.isArray(e)?new Map(e.map(o=>[o,o])):typeof e=="object"&&e!==null?new Map(Object.entries(e)):typeof e=="string"||typeof e=="number"?new Map([[e,e]]):new Map}var ke=new Map(Object.entries(Re).map(([e,o])=>[e,Oo(o)])),Eo=new Map(Object.entries(Be).map(([e,o])=>[e,new Set(o)])),Ho=new Set(["height","width"]),Mo=new Set(["canvas","embed","iframe","img","input","object","video"]);function De(e){let[o,t]=e.split(":");return [o,ve.has(t)?t:null]}function Oe(e,o="div"){let t=Object.assign({},e),n={};function r(i){if(i==null)return n;let s=`&:${i.replace(/[A-Z]/g,d=>`-${d.toLocaleLowerCase()}`)}`;return n[s]==null&&(n[s]={}),n[s]}return Object.entries(t).forEach(([i,a])=>{let[s,d]=De(i),f=Eo.get(s);f!=null&&(f.forEach(u=>{let S=`${u}${d?":"+d:""}`;t[S]=a;}),delete t[i]);}),Object.entries(t).forEach(([i,a])=>{let[s,d]=De(i),f=ke.get(s);if(f!=null){if(typeof a=="string"&&a.indexOf(" ")>-1){let u=a.split(" ");r(d)[s]=u.map(S=>f.get(S.toString())??S).join(" ");}else f.has(a.toString())?r(d)[s]=f.get(a.toString()):r(d)[s]=a;(typeof o!="string"||!Mo.has(o)||!Ho.has(s))&&delete t[i];}}),Object.keys(t).forEach(i=>{let a=i.substring(1);i.indexOf("_")===0&&ke.has(a)&&(t[a]=t[i],delete t[i]);}),{cssFromProps:n,unmatchedProps:t}}function Vo(){if(typeof window>"u"){let{JSDOM:e}=Co("jsdom");return new e("<!DOCTYPE html>").window}return window}function Ee(e){return e?{__html:Ao(Vo()).sanitize(e,{ALLOWED_TAGS:["b","i","a","span","div","p","pre","u","br","img","code","li","ul","table","tbody","thead","tr","td","th","h1","h2","h3","h4","video"],ALLOWED_ATTR:["style","class","target","id","href","alt","src","controls","autoplay","loop","muted"]})}:{__html:""}}function Io(e){return e&&`fr-${e}`}function Ae(e){return e&&(Array.isArray(e)?e.map(o=>Ae(o)).join(" "):Io(e))}function Wo({as:e,children:o,className:t,css:n={},part:r,...i},a){let s=e??"div",{cssFromProps:d,unmatchedProps:f}=Oe(i,s),u=Ae(r),S=t||u?clsx(t,u):void 0,B=[{boxSizing:"border-box"},d,n];return typeof o=="string"?jsx(s,{className:S,css:B,...f,ref:a,dangerouslySetInnerHTML:Ee(o)}):jsx(s,{className:S,css:B,...f,ref:a,children:o})}var p=ue.forwardRef(Wo);var c={};Y(c,{Body1:()=>tt,Body2:()=>rt,Caption:()=>nt,Display1:()=>Xo,Display2:()=>Yo,H1:()=>Qo,H2:()=>Zo,H3:()=>et,H4:()=>ot});var ce={};Y(ce,{Body1:()=>Uo,Body2:()=>Go,Caption:()=>qo,Display1:()=>$o,Display2:()=>zo,H1:()=>_o,H2:()=>Ko,H3:()=>No,H4:()=>jo});var k={color:"neutral.foreground",fontFamily:"default",margin:"0"},$o={...k,fontSize:"5xl",fontWeight:"bold",lineHeight:"4xl"},zo={...k,fontSize:"4xl",fontWeight:"bold",lineHeight:"3xl"},_o={...k,fontSize:"3xl",fontWeight:"bold",lineHeight:"2xl"},Ko={...k,fontSize:"2xl",fontWeight:"bold",lineHeight:"xl"},No={...k,fontSize:"xl",fontWeight:"bold",lineHeight:"lg"},jo={...k,fontSize:"lg",fontWeight:"bold",lineHeight:"md"},Uo={...k,fontSize:"md",fontWeight:"regular",lineHeight:"md"},Go={...k,fontSize:"sm",fontWeight:"regular",lineHeight:"md"},qo={...k,fontSize:"xs",fontWeight:"regular",lineHeight:"sm"};var Jo=["Display1","Display2","H1","H2","H3","H4","Body1","Body2","Caption"],D=Object.fromEntries(Jo.map(e=>{let o=["H1","H2","H3","H4"].includes(e)?e.toLowerCase():"span",t=ue.forwardRef(({as:n=o,children:r,...i},a)=>jsx(p,{as:n,...ce[e],...i,ref:a,children:r}));return t.displayName=`Text.${e}`,[e,t]})),Xo=D.Display1,Yo=D.Display2,Qo=D.H1,Zo=D.H2,et=D.H3,ot=D.H4,tt=D.Body1,rt=D.Body2,nt=D.Caption;var me={};Y(me,{Link:()=>lt,Plain:()=>pt,Primary:()=>st,Secondary:()=>at});var Q={borderWidth:"0",borderRadius:"md",display:"flex",gap:"2",padding:"2 4"},st={...Q,backgroundColor:"primary.surface",color:"primary.foreground","backgroundColor:hover":"primary.hover.surface"},at={...Q,backgroundColor:"secondary.background",borderColor:"secondary.border",borderStyle:"solid",borderWidth:"1px",color:"secondary.foreground","backgroundColor:hover":"secondary.hover.background"},lt={...Q,backgroundColor:"transparent",color:"primary.surface","color:hover":"primary.hover.surface"},pt={...Q,backgroundColor:"transparent",color:"neutral.foreground"};function Le({as:e,children:o,part:t,title:n,variant:r="Primary",...i}){let a=r.toLocaleLowerCase();return jsxs(p,{as:e??"button",part:[`button-${a}`,t],...me[r],...i,children:[o,n&&jsx(c.Body2,{flexGrow:"1",fontWeight:"demibold",color:"inherit",children:n})]})}var dt=["Primary","Secondary","Link","Plain"],ct=Object.fromEntries(dt.map(e=>{let o=t=>jsx(Le,{...t,variant:e,children:t.children});return o.displayName=`Text.${e}`,[e,o]})),C=Object.assign(Le,ct);var h={};Y(h,{Column:()=>ft,Row:()=>ut});var ut=ue.forwardRef(({children:e,css:o,...t},n)=>jsx(p,{css:[{display:"flex",flexDirection:"row"},o],...t,ref:n,children:e})),ft=ue.forwardRef(({children:e,css:o,...t},n)=>jsx(p,{css:[{display:"flex",flexDirection:"column"},o],...t,ref:n,children:e}));var A=ue.forwardRef(({as:e,children:o,...t},n)=>{let r=e??h.Column;return jsx(r,{backgroundColor:"neutral.background",borderRadius:"md",p:5,...t,ref:n,children:o})});function ze({part:e,src:o,...t}){return jsx(p,{as:"img",part:["image",e],src:o,...t})}function yt(e){var o,t,n;if(e.includes("youtube"))return `https://www.youtube.com/embed/${(o=e.split("v=")[1])==null?void 0:o.split("&")[0]}`;if(e.includes("vimeo"))return `https://player.vimeo.com/video/${(t=e.split("vimeo.com/")[1])==null?void 0:t.split("&")[0]}`;if(e.includes("wistia"))return `https://fast.wistia.net/embed/iframe/${(n=e.split("wistia.com/medias/")[1])==null?void 0:n.split("&")[0]}`;throw new Error("Could not map videoUri to a known provider (Youtube, Vimeo, Wistia).")}function _e({part:e,src:o,...t}){let n=yt(o);return jsx(p,{allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0,as:"iframe",backgroundColor:"gray100",borderWidth:0,part:["video",e],src:n,...t})}function j({src:e,type:o,...t}){return jsx(o==="video"?_e:ze,{src:e,...t})}function b({children:e,...o}){return jsx(F.Root,{defaultOpen:!0,modal:!0,children:jsx(F.Portal,{children:jsxs(p,{inset:"0",position:"fixed",zIndex:"9999",children:[jsx(F.Overlay,{asChild:!0,children:jsx(p,{background:"rgb(0 0 0 / 0.5)",part:"dialog-overlay",position:"fixed",inset:"0"})}),jsx(F.Content,{asChild:!0,onOpenAutoFocus:t=>t.preventDefault(),onPointerDownOutside:t=>t.preventDefault(),children:jsx(A,{boxShadow:"md",left:"50%",maxWidth:"430px",p:8,part:"dialog-content",position:"fixed",textAlign:"center",top:"50%",transform:"translate(-50%, -50%)",...o,children:e})})]})})})}b.Close=e=>jsx(F.Close,{"aria-label":"Close",asChild:!0,children:jsx(C.Plain,{part:"close",position:"absolute",right:"-4px",top:"4px",...e,children:jsx(XMarkIcon,{height:"24",fill:"currentColor"})})});b.Subtitle=({children:e,...o})=>jsx(F.Description,{asChild:!0,children:jsx(c.Body2,{mb:5,part:"subtitle",...o,children:e})});b.Media=({src:e,...o})=>e==null?null:jsx(j,{borderRadius:"md",src:e,...o});b.Primary=({onClick:e,title:o,...t})=>o==null?null:jsx(C.Primary,{title:o,onClick:e,...t});b.ProgressDots=({current:e,total:o})=>{if(o==0)return null;let t=[...Array(o)].map((n,r)=>jsx("circle",{r:4,cx:4+16*r,cy:"4px",fill:e===r?m.colors.blue500:m.colors.blue800},r));return jsx(p,{as:"svg",height:"8px",margin:"5 auto",part:"progress",viewBox:`0 0 ${16*o-8} 8`,width:16*o-8,children:t})};b.Secondary=({onClick:e,title:o,...t})=>o==null?null:jsx(C.Secondary,{title:o,onClick:e,...t});b.Title=({children:e,...o})=>jsx(F.Title,{asChild:!0,children:jsx(c.H3,{mb:1,part:"title",...o,children:e})});var O=createContext({apiKey:"",modals:new Set,setModals:()=>{},currentModal:null,navigate:()=>{}});function kt({children:e,navigate:o,theme:t,...n}){let r=t?pe(t):{},[i,a]=useState(new Set),s=useRef(new Frigade(n.apiKey,{apiKey:n.apiKey,apiUrl:n.apiUrl,userId:n.userId,groupId:n.groupId,__readOnly:n.__readOnly,__flowConfigOverrides:n.__flowConfigOverrides})),d=o??((u,S="_self")=>{window.open(u,S);});useEffect(()=>()=>{var u;(u=s.current)==null||u.destroy();},[]);let f=i.size>0?i.values().next().value:null;return jsxs(O.Provider,{value:{modals:i,setModals:a,currentModal:f,navigate:d,...n,frigade:s.current},children:[jsx(Global,{styles:{":root":{...we,...r}}}),jsx(ThemeProvider,{theme:m,children:e})]})}function U(e,o){let[t,n]=useState(),[,r]=useState(""),{frigade:i}=useContext(O),a=s=>{s.id===e&&(o!=null&&o.variables&&s.applyVariables(o.variables),n(s),r(Math.random().toString()));};return useEffect(()=>((async()=>{let s=await i.getFlow(e);if(!s||i.hasFailedToLoad()){n(void 0);return}o!=null&&o.variables&&s.applyVariables(o.variables),n(s);})(),i.onStateChange(a),()=>{i.removeStateChangeHandler(a);}),[]),{flow:t}}function V(e,{onComplete:o,onDismiss:t}={}){let n=useRef(null);return useEffect(()=>{e!=null&&(e.isCompleted&&n.current===!1&&(async()=>await(o==null?void 0:o(e)))(),n.current=e==null?void 0:e.isCompleted);},[e==null?void 0:e.isCompleted]),{handleDismiss:useCallback(async r=>{if(await(t==null?void 0:t(e,r))===!1)return r.preventDefault(),!1;await e.skip();},[e])}}function G(e,{onPrimary:o,onSecondary:t}={}){let{navigate:n}=useContext(O);return {handlePrimary:useCallback(async r=>{if(await(o==null?void 0:o(e,r))===!1)return r.preventDefault(),!1;await e.complete(),e.primaryButtonUri!=null&&n(e.primaryButtonUri,e.primaryButtonUriTarget);},[e]),handleSecondary:useCallback(async r=>{if(await(t==null?void 0:t(e,r))===!1)return r.preventDefault(),!1;await e.complete(),e.secondaryButtonUri!=null&&n(e.secondaryButtonUri,e.secondaryButtonUriTarget);},[e])}}function q(e){let{currentModal:o,modals:t,setModals:n}=useContext(O),[r,i]=useState(!1);useEffect(()=>{e!=null&&!t.has(e)&&n(s=>new Set(s).add(e));},[e]),useEffect(()=>{let s=o===e;e!=null&&s!==r&&i(s);},[e,o]);function a(){t.has(e)&&n(s=>{let d=new Set(s);return d.delete(e),d});}return {isCurrentModal:r,removeModal:a}}function W({container:e,dismissible:o=!0,flowId:t,onComplete:n,onDismiss:r,onPrimary:i,onSecondary:a,variables:s,...d}){let f=e==="dialog"?b:p;return {FlowComponent:function({children:B,...re}){let{flow:g}=U(t,{variables:s}),z=g==null?void 0:g.getCurrentStep(),{handleDismiss:_}=V(g,{onComplete:n,onDismiss:r}),{handlePrimary:ne,handleSecondary:ie}=G(z,{onPrimary:i,onSecondary:a}),{isCurrentModal:K,removeModal:se}=q(g==null?void 0:g.id);if(useEffect(()=>{!(g!=null&&g.isVisible)&&K&&se();},[g==null?void 0:g.isVisible,K]),g==null||!g.isVisible||!K)return null;let ae=o&&e==="dialog"?jsx(b.Close,{onClick:_}):null;return g.start(),z.start(),jsxs(f,{...re,...d,children:[ae,B({flow:g,handleDismiss:_,handlePrimary:ne,handleSecondary:ie,step:z})]})}}}function _t(e){let{FlowComponent:o}=W({...e,container:"dialog"});return jsx(o,{children:({flow:t,handlePrimary:n,handleSecondary:r,step:i})=>jsxs(Fragment,{children:[jsx(b.Title,{children:i.title}),jsx(b.Subtitle,{children:i.subtitle}),jsx(b.Media,{src:i.imageUri,css:{aspectRatio:"1.5",objectFit:"cover",width:"100%"}}),jsx(b.ProgressDots,{current:t.getNumberOfCompletedSteps(),total:t.getNumberOfAvailableSteps()}),jsxs(h.Row,{css:{"& > button":{flexGrow:1}},gap:3,children:[i.secondaryButtonTitle&&jsx(b.Secondary,{title:i.secondaryButtonTitle,onClick:r}),jsx(b.Primary,{title:i.primaryButtonTitle??"Continue",onClick:n})]})]})})}function jt(e){let{FlowComponent:o}=W(e);return jsx(o,{as:A,border:"md",borderColor:"gray900",display:"flex",flexDirection:"row",gap:3,justifyContent:"space-between",children:({handleDismiss:t,handlePrimary:n,handleSecondary:r,step:i})=>jsxs(Fragment,{children:[jsxs(h.Row,{gap:3,children:[i.imageUri&&jsx("img",{src:i.imageUri,style:{height:40,width:40,alignSelf:"center"}}),jsxs(h.Column,{children:[jsx(c.H4,{mb:1,children:i.title}),jsx(c.Body2,{children:i.subtitle})]})]}),jsxs(h.Row,{alignItems:"center",gap:3,justifyContent:"center",children:[i.secondaryButtonTitle&&jsx(C.Secondary,{title:i.secondaryButtonTitle,onClick:r}),jsx(C.Primary,{title:i.primaryButtonTitle,onClick:n}),e.dismissible&&e.container!="dialog"&&jsx(C.Plain,{part:"banner-close",onClick:t,children:jsx(XMarkIcon,{height:"24",fill:"currentColor"})})]})]})})}var Jt=new Set(["required","min","max","minLength","maxLength","pattern"]);function Xt({fieldComponent:e,control:o,fieldData:t}){t.pattern!=null&&(typeof t.pattern=="string"?t.pattern=new RegExp(t.pattern.replace(/^\/|\/$/g,"")):typeof t.pattern=="object"&&typeof t.pattern.value=="string"&&(t.pattern.value=new RegExp(t.pattern.value.replace(/^\/|\/$/g,""))));let n=Object.fromEntries(Object.entries(t).filter(([i])=>Jt.has(i))),r=useController({name:t.id,control:o,rules:n});return jsx(e,{...r,fieldData:t})}function qe({fieldTypes:e,step:o}){var a;let{control:t,handleSubmit:n}=useForm({delayError:2e3,mode:"onChange"}),r=[];function i(s){o.complete(s);}return (a=o.fields)==null||a.forEach(s=>{e[s.type]!=null&&r.push(jsx(Xt,{control:t,fieldComponent:e[s.type],fieldData:s},s.id));}),jsxs(Fragment,{children:[r,jsx(h.Row,{justifyContent:"flex-end",children:jsx(C.Primary,{title:o.primaryButtonTitle??"Submit",onClick:n(i)})},"form-footer")]})}function Je({error:e}){var o;return (o=e==null?void 0:e.message)!=null&&o.length?jsx(c.Caption,{color:"red500",display:"block",part:"field-error",textAlign:"end",children:e==null?void 0:e.message}):null}function Xe({children:e,id:o,required:t=!1}){return jsxs(c.Body2,{as:"label",htmlFor:o,fontWeight:"demibold",part:"field-label",children:[e,t&&" *"]})}var Ye={marginBottom:"5"},J={px:"4",py:"2",backgroundColor:"neutral.background",borderColor:"neutral.border",borderStyle:"solid",borderWidth:"md",borderRadius:"md",display:"block",outline:"none",width:"100%"};function M({children:e,field:o,fieldData:t,fieldState:n}){let{id:r,label:i,placeholder:a}=t,{error:s}=n,d={id:r,...o,...a?{placeholder:a}:{},...J,"aria-invalid":!!s,value:o.value??""};return jsxs(p,{...Ye,part:"field",children:[jsx(Xe,{id:r,required:!!t.required,children:i}),e(d),jsx(Je,{error:s})]})}var tr=()=>jsx(p,{as:"svg",color:"primary.foreground",width:"10px",height:"8px",viewBox:"0 0 10 8",fill:"none",children:jsx("path",{d:"M1 4.34664L3.4618 6.99729L3.4459 6.98017L9 1",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),rr=ue.forwardRef(({label:e,value:o},t)=>jsxs(p,{as:"label",htmlFor:o,display:"flex",justifyContent:"space-between",part:"field-radio",px:4,py:2,borderWidth:"md",borderStyle:"solid",borderColor:"neutral.border",borderRadius:"md",children:[jsx(c.Body2,{part:"field-radio-label",children:e}),jsx($.Item,{id:o,value:o,ref:t,asChild:!0,children:jsx(p,{as:"button",backgroundColor:"neutral.background",borderWidth:"md",borderStyle:"solid",borderColor:"neutral.border",borderRadius:"100%",padding:"0",part:"field-radio-value",position:"relative",height:"24px",width:"24px",children:jsx(p,{as:$.Indicator,alignItems:"center",bg:"primary.surface",borderWidth:"md",borderStyle:"solid",borderColor:"primary.border",borderRadius:"100%",display:"flex",height:"calc(100% + 2px)",justifyContent:"center",left:"-1px",part:"field-radio-indicator",position:"absolute",top:"-1px",width:"calc(100% + 2px)",children:jsx(tr,{})})})})]}));function oo(e){let{field:{onChange:o,value:t},fieldData:{options:n=[]}}=e,r=n.map(({label:i,value:a})=>jsx(rr,{value:a,label:i},a));return jsx(M,{...e,children:()=>jsx($.Root,{value:t,onValueChange:o,asChild:!0,children:jsx(h.Column,{gap:2,part:"field-radio-group",children:r})})})}var sr=ue.forwardRef(({label:e,value:o},t)=>jsx(y.Item,{value:o,ref:t,asChild:!0,children:jsx(p,{"backgroundColor:hover":"blue900",borderRadius:"md",outline:"none",part:"field-select-option",px:"3",py:"2",children:jsx(y.ItemText,{asChild:!0,children:jsx(c.Body2,{part:"field-select-option-label",children:e})})})}));function no(e){let{field:{onChange:o,value:t},fieldData:{options:n=[],placeholder:r}}=e,i=n.map(({label:a,value:s})=>jsx(sr,{value:s,label:a},s));return jsx(M,{...e,children:()=>jsxs(y.Root,{value:t,onValueChange:o,children:[jsx(y.Trigger,{asChild:!0,children:jsxs(c.Body2,{...J,alignItems:"center",display:"flex",justifyContent:"space-between",part:"field-select",children:[jsx(y.Value,{placeholder:r??"Select one"}),jsx(y.Icon,{children:jsx(p,{as:ChevronDownIcon,color:"gray100",display:"block",height:"24px",part:"field-select-icon",width:"24px"})})]})}),jsx(y.Portal,{children:jsx(y.Content,{position:"popper",sideOffset:4,asChild:!0,children:jsx(p,{...J,p:"1",part:"field-select-options",width:"var(--radix-popper-anchor-width)",children:jsx(y.Viewport,{children:i})})})})]})})}function so(e){return jsx(M,{...e,children:o=>jsx(c.Body2,{as:"input",part:"field-text",type:"text",...o})})}function lo(e){return jsx(M,{...e,children:o=>jsx(c.Body2,{as:"textarea",part:"field-textarea",...o})})}var ar={radio:oo,select:no,text:so,textarea:lo};function lr({fieldTypes:e={},...o}){let{FlowComponent:t}=W(o),n=Object.assign({},ar,e);return jsx(t,{children:({step:r})=>jsx(qe,{fieldTypes:n,step:r,...o})})}function oe(){let e="DOMRect"in globalThis?new DOMRect:{height:0,width:0,x:0,y:0,bottom:0,top:0,right:0,left:0,toJSON:()=>{}},[o,t]=useState(e),[n,r]=useState(null),i=useCallback(a=>{r(a);},[]);return useLayoutEffect(()=>{if(!n)return;let a=()=>{let s=n.getBoundingClientRect();t(s);};return a(),window.addEventListener("resize",a),()=>window.removeEventListener("resize",a)},[n]),{node:n,rect:o,ref:i}}var mr=keyframes({"0%":{opacity:.5,transform:"scale(0.5)"},"50%":{opacity:0,transform:"scale(1)"},"100%":{opacity:0,transform:"scale(1)"}});function uo({style:e={},part:o="",...t}){return jsxs(p,{part:`dot-wrapper ${o}`,style:{height:"48px",position:"absolute",width:"48px",...e},...t,children:[jsx(p,{backgroundColor:"primary.surface",part:"dot-pulse",css:{animation:`2s ease-out infinite ${mr}`,borderRadius:"24px",height:"48px",left:0,position:"absolute",top:0,transformOrigin:"center center",width:"48px"}}),jsx(p,{backgroundColor:"primary.surface",part:"dot",style:{borderRadius:"12px",height:"24px",left:"12px",position:"absolute",top:"12px",width:"24px"}})]})}function fo({props:e,alignAttr:o,sideAttr:t}){let n=t??"bottom",r={},i=()=>{if(["after","before"].includes(e.align)){if(o=="start")return "before";if(o=="end")return "after"}return e.align??"after"},a="-24px",s={top:"bottom",right:"left",bottom:"top",left:"right"};r[s[n]]=a;let d=i();return ["before","end"].includes(d)?["top","bottom"].includes(n)?r.right=a:r.bottom=a:["after","start"].includes(d)?["top","bottom"].includes(n)?r.left=a:r.top=a:["top","bottom"].includes(n)?r.left=`calc(50% + ${a})`:r.top=`calc(50% + ${a})`,r}var go={content:["align","alignOffset","arrowPadding","avoidCollisions","collisionBoundary","collisionPadding","forceMount","hideWhenDetached","onCloseAutoFocus","onEscapeKeyDown","onFocusOutside","onInteractOutside","onOpenAutoFocus","onPointerDownOutside","side","sideOffset","sticky"],root:["defaultOpen","modal","onOpenChange","open"]};function xo(e,o){let t=Object.fromEntries(go.content.map(r=>[r,e[r]]).filter(r=>r[1]!==void 0)),n=Object.fromEntries(go.root.map(r=>[r,e[r]]).filter(r=>r[1]!==void 0));if(t.align=t.align??"after",t.side=t.side??"bottom",["before","after"].includes(t.align)){let r={after:"end",before:"start"},i=(S,B)=>["top","bottom"].includes(B)?S=="after"?"marginLeft":"marginRight":S=="after"?"marginTop":"marginBottom",a=t.alignOffset??0,s=t.style??{},d=t.side??"bottom",f=t.align;t.style={...s,[i(f,d)]:a};let u=["top","bottom"].includes(d)?o.width:o.height;t.alignOffset=(u+a)*-1,t.align=r[f];}return {contentProps:t,rootProps:n}}function P({anchor:e,children:o,className:t,spotlight:n=!1,style:r,...i}){let{node:a,rect:s,ref:d}=oe(),{node:f,rect:u,ref:S}=oe(),{contentProps:B,rootProps:re}=xo(i,s),[g,z]=useState(B.align),[_,ne]=useState(B.side),[ie,K]=useState(0),[se,ae]=useState(0);if(a!==null){let E=a.getAttribute("data-align"),X=a.getAttribute("data-side");g!==E&&z(E),_!==X&&ne(X);}let ge=useRef(null);if(useEffect(()=>{let E=document.querySelector(e);E!=null&&(S(E),ge.current=E);},[e]),useEffect(()=>{let{scrollX:E,scrollY:X}=window;K(u.left+E),ae(u.top+X);},[u.left,u.top]),f==null)return null;let xe="0";typeof window<"u"&&(xe=window.getComputedStyle(f).borderRadius);let Po=fo({props:i,alignAttr:g,sideAttr:_});return jsxs(v.Root,{defaultOpen:!0,...re,children:[jsx(v.Anchor,{virtualRef:ge}),jsx(v.Portal,{children:jsxs("div",{className:t,css:{bottom:0,left:0,position:"absolute",right:0,top:0,zIndex:9999},children:[n&&jsx(p,{part:"tooltip-spotlight",position:"absolute",style:{borderRadius:xe,boxShadow:"0 0 0 20000px rgb(0 0 0 / 0.5)",height:u.height,left:ie,top:se,width:u.width}}),jsx(v.Content,{asChild:!0,...B,ref:d,children:jsxs(A,{boxShadow:"md",part:"tooltip-content",position:"relative",css:{maxWidth:"360px",...r},children:[jsx(uo,{style:Po}),o]})})]})})]})}P.Close=e=>jsx(v.Close,{"aria-label":"Close",asChild:!0,children:jsx(C.Plain,{css:{top:"12px",right:"4px"},part:"close",position:"absolute",...e,children:jsx(XMarkIcon,{height:"24",fill:"currentColor"})})});P.Media=({src:e,...o})=>e==null?null:jsx(j,{borderRadius:"md md 0 0",borderWidth:"0",css:{aspectRatio:"2"},margin:"-5 -5 5",src:e,...o});P.Primary=({onClick:e,title:o,...t})=>o==null?null:jsx(C.Primary,{title:o,onClick:e,...t});P.Progress=({children:e,...o})=>e==null?null:jsx(c.Body2,{fontWeight:"demibold",part:"progress",...o,children:e});P.Secondary=({onClick:e,title:o,...t})=>o==null?null:jsx(C.Secondary,{title:o,onClick:e,...t});P.Subtitle=({children:e,...o})=>e==null?null:jsx(c.Body2,{part:"subtitle",...o,children:e});P.Title=({children:e,...o})=>e==null?null:jsx(c.Body1,{fontWeight:"bold",mb:1,part:"title",...o,children:e});function bo({dismissible:e=!0,flow:o,onDismiss:t,onPrimary:n,onSecondary:r,step:i,...a}){let{handleDismiss:s}=V(o,{onDismiss:t}),{handlePrimary:d,handleSecondary:f}=G(i,{onPrimary:n,onSecondary:r});return jsxs(P,{anchor:i.selector,onOpenAutoFocus:u=>u.preventDefault(),onPointerDownOutside:u=>u.preventDefault(),...a,children:[e&&jsx(P.Close,{onClick:s}),jsx(P.Media,{src:i.videoUri??i.imageUri,type:i.videoUri?"video":"image"}),jsx(P.Title,{children:i.title}),jsx(P.Subtitle,{children:i.subtitle}),jsxs(h.Row,{alignItems:"center",gap:3,justifyContent:"flex-end",part:"tooltip-footer",pt:4,children:[jsx(P.Progress,{children:`${o.getNumberOfCompletedSteps()+1}/${o.getNumberOfAvailableSteps()}`}),jsx(P.Secondary,{marginLeft:"auto",title:i.secondaryButtonTitle,onClick:f}),jsx(P.Primary,{title:i.primaryButtonTitle,onClick:d})]})]},i.id)}function yr({flowId:e,onComplete:o,variables:t,...n}){let{flow:r}=U(e,{variables:t});V(r,{onComplete:o});let{isCurrentModal:i,removeModal:a}=q(r==null?void 0:r.id);if(useEffect(()=>{!(r!=null&&r.isVisible)&&i&&a();},[r==null?void 0:r.isVisible,i]),r==null||r.isVisible===!1||!i)return null;r.start();let s=r.getCurrentStep();return s==null||s.start(),jsx(bo,{step:s,flow:r,...n})}function Pr(){let{frigade:e}=useContext(O);return {frigade:e}}
|
|
19
|
+
|
|
20
|
+
export { _t as Announcement, jt as Banner, p as Box, C as Button, A as Card, h as Flex, lr as Form, kt as Provider, c as Text, P as Tooltip, yr as Tour, oe as useBoundingClientRect, U as useFlow, V as useFlowHandlers, Pr as useFrigade, q as useModal, G as useStepHandlers };
|
|
21
|
+
//# sourceMappingURL=out.js.map
|
|
3
22
|
//# sourceMappingURL=index.js.map
|